.sfx{--sfx-sky:#03B3EF; --sfx-deep:#6F7072; --sfx-icon:#848486; --sfx-tint:rgba(3,179,239,.07); --sfx-hov:rgba(3,179,239,.035);
  --sfx-serif:"Cormorant Garamond",Georgia,serif; --sfx-e:cubic-bezier(.22,.61,.36,1); background:#FFFFFF}
.sfx .sfx-head{max-width:760px; margin:0 0 clamp(28px,3.2vw,48px)}
.sfx .sfx-head h2{margin:0}
.sfx .sfx-list{list-style:none; margin:0; padding:0}

.sfx .sfx-g + .sfx-g{margin-top:clamp(22px,2.2vw,30px)}
.sfx .sfx-gh{display:flex; align-items:center; gap:14px; margin:0 0 4px; font-family:Inter,sans-serif; font-size:12.5px; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:var(--navy); line-height:1.4}
.sfx .sfx-gh::after{content:""; flex:1 1 auto; height:1px; background:var(--line)}

.sfx .sfx-row{position:relative; display:grid; grid-template-columns:34px minmax(0,1fr) 22px; align-items:center; column-gap:10px; width:100%;
  min-height:52px; padding:10px 14px 10px 16px; border:0; border-bottom:1px solid var(--line); background:transparent; text-align:left;
  cursor:pointer; font:inherit; color:var(--ink); transition:background-color .4s var(--sfx-e), color .4s var(--sfx-e)}
.sfx .sfx-row::before{content:""; position:absolute; left:0; top:8px; bottom:8px; width:3px; border-radius:2px; background:var(--sfx-sky);
  transform:scaleY(0); transform-origin:50% 50%; transition:transform .4s var(--sfx-e)}
.sfx .sfx-n{font-family:Inter,sans-serif; font-size:12.5px; font-weight:600; letter-spacing:.06em; font-variant-numeric:tabular-nums; color:var(--sfx-deep)}
.sfx .sfx-t{font-family:var(--sfx-serif); font-weight:500; font-size:clamp(22px,1.75vw,24px); line-height:1.15; color:inherit}
.sfx .sfx-ar{display:flex; justify-content:flex-end; color:var(--sfx-icon); opacity:0; transform:translateX(-8px);
  transition:opacity .4s var(--sfx-e), transform .4s var(--sfx-e)}
.sfx .sfx-row:hover{background:var(--sfx-hov)}
.sfx .sfx-row:hover .sfx-ar{opacity:.55; transform:translateX(-3px)}
.sfx .sfx-row.on{background:var(--sfx-tint); color:var(--ink)}
.sfx .sfx-row.on::before{transform:scaleY(1)}
.sfx .sfx-row.on .sfx-ar{opacity:1; transform:none}
.sfx .sfx-row:focus-visible{outline:2px solid var(--navy); outline-offset:-2px}

.sfx .sfx-ph{position:relative; margin:0; overflow:hidden; border-radius:var(--r-sm,4px); background:var(--wash,#F2F4F7)}
.sfx .sfx-ph img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.sfx .sfx-title{margin:0; font-size:clamp(28px,2.5vw,36px); font-weight:300; line-height:1.1}
.sfx .sfx-d{margin:10px 0 0; max-width:62ch; font-size:16px; line-height:1.6; color:var(--body)}
.sfx .sfx-ticks{list-style:none; margin:16px 0 0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:1fr;
  column-gap:24px; border-top:1px solid var(--line)}
.sfx .sfx-ticks li{display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--line); font-size:16px; line-height:1.35; color:var(--ink)}
.sfx .sfx-ticks svg{flex:none; width:20px; height:20px; padding:3px; border-radius:50%; background:rgba(3,179,239,.12); color:var(--sfx-icon)}
.sfx .sfx-cta{display:flex; flex-wrap:wrap; align-items:center; gap:10px 12px; margin-top:18px}
.sfx .sfx-cta .btn{min-height:48px}

@media (max-width:899px){
  .sfx .sfx-p{padding:16px 0 26px}
  .sfx .sfx-ph{aspect-ratio:16 / 10; margin:0 0 18px}
  .js .sfx .sfx-p{display:none}
  .js .sfx .sfx-p.open{display:block}
  .js .sfx .sfx-p.open > *{animation:sfxIn .4s var(--sfx-e) both}
  .js .sfx .sfx-p.open > .sfx-body{animation-delay:.06s}
  .sfx .sfx-ar{opacity:.55; transform:rotate(90deg)}
  .sfx .sfx-row:hover .sfx-ar{transform:rotate(90deg)}
  .sfx .sfx-row.open .sfx-ar{opacity:1; transform:rotate(-90deg)}
  .sfx .sfx-row{padding-left:14px}
  .sfx .sfx-stage{display:none}
}
@keyframes sfxIn{from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none}}
@media (max-width:560px){
  .sfx .sfx-ticks{grid-template-columns:1fr; grid-auto-rows:auto}
  .sfx .sfx-cta .btn{flex:1 1 100%; justify-content:center}
  .sfx .sfx-t{font-size:22px}
}

@media (min-width:900px){
  .sfx .sfx-stage{display:none}
  .js .sfx .sfx-in{display:grid; grid-template-columns:minmax(300px,35fr) minmax(0,65fr); column-gap:clamp(32px,4.2vw,72px); align-items:start}
  .js .sfx .sfx-stage{display:block; position:sticky; top:calc(var(--hdr-solid,92px) + 16px)}
  .js .sfx .sfx-frame{position:relative; height:clamp(170px,calc(100vh - 520px),420px); overflow:hidden; border-radius:var(--r-sm,4px); background:var(--wash,#F2F4F7)}
  .js .sfx .sfx-frame .sfx-ph{position:absolute; inset:0; border-radius:0; opacity:0; visibility:hidden;
    transition:opacity .4s var(--sfx-e), visibility 0s linear .4s}
  .js .sfx .sfx-frame .sfx-ph.on{opacity:1; visibility:visible; z-index:1; transition:opacity .45s var(--sfx-e), visibility 0s}
  .js .sfx .sfx-frame .sfx-ph img{transform:scale(1.06); transition:transform 1.2s var(--sfx-e)}
  .js .sfx .sfx-frame .sfx-ph.on img{transform:none}
  .js .sfx .sfx-panes{display:grid; margin-top:clamp(18px,2vw,24px)}
  .js .sfx .sfx-panes .sfx-p{grid-area:1 / 1; padding:0; visibility:hidden; pointer-events:none}
  .js .sfx .sfx-panes .sfx-p.on{visibility:visible; pointer-events:auto}
  .js .sfx .sfx-panes .sfx-body > *{opacity:0; transform:translateY(8px); transition:opacity .25s var(--sfx-e), transform .25s var(--sfx-e)}
  .js .sfx .sfx-panes .sfx-p.on .sfx-body > *{opacity:1; transform:none; transition:opacity .4s var(--sfx-e), transform .4s var(--sfx-e)}
  .js .sfx .sfx-panes .sfx-p.on .sfx-body > :nth-child(2){transition-delay:.04s}
  .js .sfx .sfx-panes .sfx-p.on .sfx-body > :nth-child(3){transition-delay:.08s}
  .js .sfx .sfx-panes .sfx-p.on .sfx-body > :nth-child(4){transition-delay:.12s}
}

@media (min-width:900px) and (max-height:760px){
  .js .sfx .sfx-frame{height:clamp(150px,calc(100vh - 464px),280px)}
  .js .sfx .sfx-panes{margin-top:14px}
  .js .sfx .sfx-title{font-size:28px}
  .js .sfx .sfx-d{margin-top:6px; line-height:1.5}
  .js .sfx .sfx-ticks{margin-top:10px}
  .js .sfx .sfx-ticks li{padding:5px 0; line-height:1.3}
  .js .sfx .sfx-cta{margin-top:12px}
  .js .sfx .sfx-row{min-height:48px; padding-top:8px; padding-bottom:8px}
}
@media (prefers-reduced-motion:reduce){
  .sfx *, .sfx *::before{transition-duration:.01ms !important; animation-duration:.01ms !important}
}

@media (min-width:900px){ .js .sfx .sfx-frame{height:auto; aspect-ratio:16 / 9} }

@media (min-width:900px) and (max-height:819px){ .js .sfx .sfx-stage:not(#_){position:relative; top:auto} }

.sfx .sfx-t:not(#_){white-space:nowrap; overflow:hidden; text-overflow:clip}
@media (min-width:900px) and (max-width:1199px){ .sfx .sfx-t:not(#_){font-size:clamp(18px,1.9vw,21px)} }