.experienceHero{position:relative;padding-bottom:28px;background:radial-gradient(ellipse at 85% 15%,rgba(215,165,74,.10),transparent 55%)}
.experienceHero h1{font-size:clamp(48px,6.6vw,84px);line-height:1.03;max-width:1050px;margin-top:22px}
.experienceHero h1 em{color:var(--gold2);font-weight:400}
.experienceHero .lede{max-width:660px;font-size:18px}
.experienceHero .heroCtas{margin-top:27px}
.experienceJump{display:flex;flex-wrap:wrap;gap:9px;margin:28px 0 18px}
.experienceJump a{display:inline-flex;align-items:center;min-height:44px;padding:10px 15px;border:1px solid var(--line);border-radius:999px;color:var(--gold2);font-size:13px;background:rgba(255,255,255,.025)}
.experienceJump a:hover{background:rgba(215,165,74,.10);border-color:rgba(215,165,74,.4)}
.experienceNote{max-width:790px;font-size:13px;color:#c2d0dd;line-height:1.7}
.experienceHero .affiliateNote{margin:12px 0 0;font-size:12px;max-width:790px}
.experienceSection{padding-top:38px;padding-bottom:32px;scroll-margin-top:100px}
.experienceIntro{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:24px}
.experienceIntro h2{font-size:clamp(36px,4.5vw,56px);line-height:1.08;margin-bottom:0}
.experienceIntro p{max-width:440px;color:#c2d0dd;line-height:1.7;margin-bottom:3px}
.experienceGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;min-width:0}
.experienceCollectionLayout{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.9fr);gap:20px;align-items:stretch}
.experienceCollectionLayout .experienceGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.experienceCover{position:relative;isolation:isolate;min-width:0;min-height:410px;margin:0;overflow:hidden;border:1px solid var(--line);border-radius:25px;background:linear-gradient(155deg,#255766,#102b40 65%,#071425)}
.experienceCover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;color:#fff;font-size:13px}
.experienceCover:after{position:absolute;inset:30% 0 0;content:"";background:linear-gradient(transparent,rgba(4,17,30,.83));pointer-events:none}
.experienceCover figcaption{position:absolute;z-index:1;bottom:25px;left:25px;right:20px;display:grid;gap:8px;color:#fff}
.experienceCover figcaption span{font-size:10px;line-height:1.6;letter-spacing:.14em;text-transform:uppercase;color:#fff2cf}
.experienceCover figcaption strong{font-family:Georgia,serif;font-size:36px;font-weight:400;line-height:1.1}
.experienceCover figcaption small{color:#d4e0e8;font-size:11px}
.experienceCard{display:flex;flex-direction:column;min-width:0;padding:25px 22px;border:1px solid rgba(181,207,224,.19);border-radius:21px;background:linear-gradient(145deg,rgba(37,68,91,.66),rgba(15,35,54,.84));transition:border-color .2s,background .2s}
.experienceCard:hover{border-color:rgba(215,165,74,.43);background:linear-gradient(145deg,rgba(43,75,96,.75),rgba(17,39,58,.9))}
.experienceCard .kicker{font-size:10px;letter-spacing:.13em;line-height:1.5}
.experienceCard h3{font-family:Georgia,serif;font-size:30px;line-height:1.08;letter-spacing:-.02em;margin:12px 0}
.experienceCard p{font-size:14px;line-height:1.7;color:#ccd9e3;margin:0 0 20px}
.experienceActions{margin-top:auto;display:grid;gap:8px}
.experienceActions .btn{width:100%;min-height:46px;font-size:13px;gap:7px;padding:12px}
.experiencePlan{display:inline-flex;align-items:center;justify-content:center;min-height:44px;font-size:12px;color:var(--gold2);line-height:1.55;text-align:center}
.experiencePlan:hover{text-decoration:underline;text-underline-offset:4px}
.experienceNext{padding-top:45px}
.experienceNext .ctaBox p{color:#c2d0dd;line-height:1.7;max-width:580px;margin:16px 0 0}
@media(max-width:1050px){
 .experienceGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .experienceIntro{align-items:start;flex-direction:column;gap:10px}
 .experienceIntro p{margin:0;max-width:680px}
 .experienceCollectionLayout{grid-template-columns:minmax(0,.85fr) minmax(0,1.9fr);gap:14px}
 .experienceCard{padding:23px 19px}
}
@media(max-width:900px){
 .experienceCollectionLayout{grid-template-columns:1fr;gap:15px}
 .experienceCover{min-height:0;height:235px}
 .experienceCover img{object-position:center 57%}
 .experienceCover figcaption{bottom:22px;left:25px}
 .experienceCover figcaption strong{font-size:33px}
}
@media(max-width:620px){
 .experienceHero{padding-top:35px;padding-bottom:22px}
 .experienceHero h1{font-size:clamp(41px,10.8vw,56px);margin-top:18px}
 .experienceHero .lede{font-size:15px;line-height:1.65}
 .experienceHero .heroCtas{margin-top:23px}
 .experienceHero .heroCtas .btn{font-size:13px;min-height:46px;padding:12px 16px}
 .experienceJump{margin-top:22px;gap:7px}
 .experienceJump a{font-size:12px;padding-inline:13px}
 .experienceNote{font-size:12px}
 .experienceHero .affiliateNote{font-size:11px;line-height:1.7}
 .experienceSection{padding-top:30px;padding-bottom:18px}
 .experienceIntro{margin-bottom:19px}
 .experienceIntro h2{font-size:37px}
 .experienceIntro p{font-size:14px}
 .experienceGrid,.experienceCollectionLayout .experienceGrid{grid-template-columns:1fr;gap:11px}
 .experienceCover{height:185px;border-radius:20px}
 .experienceCover:after{inset:12% 0 0}
 .experienceCover figcaption{bottom:20px;left:21px;gap:6px}
 .experienceCover figcaption span{font-size:9px}
 .experienceCover figcaption strong{font-size:31px}
 .experienceCover figcaption small{font-size:10px}
 .experienceCard{padding:21px;border-radius:19px}
 .experienceCard h3{font-size:29px;margin:9px 0 12px}
 .experienceCard p{font-size:14px;margin-bottom:16px}
 .experienceActions{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:center}
 .experienceActions .btn,.experiencePlan{font-size:12px}
 .experienceNext{padding-top:30px}
}
@media(max-width:350px){
 .experienceHero h1{font-size:37px}
 .experienceActions{grid-template-columns:1fr;gap:3px}
}