.wh-page { background: var(--bg); }
.wh-page main { overflow: hidden; }
.wh-hero { padding-block: clamp(70px,8vw,122px); }
.wh-hero-grid { display:grid; grid-template-columns:minmax(0,.76fr) minmax(560px,1.24fr); gap:clamp(46px,7vw,108px); align-items:center; }
.wh-breadcrumb { display:inline-flex; gap:8px; margin-bottom:28px; color:var(--muted); font-size:.82rem; font-weight:700; text-decoration:none; }
.wh-eyebrow,.wh-section-tag { color:var(--brand); font-size:.72rem; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.wh-eyebrow { display:flex; align-items:center; gap:10px; }
.wh-eyebrow span { width:8px; height:8px; border-radius:50%; background:#22C55E; box-shadow:0 0 0 5px color-mix(in srgb,#22C55E 13%,transparent); }
.wh-hero h1 { margin-top:18px; max-width:800px; font-size:clamp(3.9rem,6.5vw,7.2rem); line-height:.89; letter-spacing:-.075em; font-weight:760; }
.wh-hero h1 em { color:var(--brand); font-style:normal; }
.wh-lead { max-width:670px; margin-top:28px; color:var(--muted); font-size:clamp(1.05rem,1.35vw,1.25rem); line-height:1.65; }
.wh-hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:18px; margin-top:34px; }
.wh-text-link { color:var(--brand); font-size:.88rem; font-weight:850; text-decoration:none; }
.wh-proof { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:34px; }
.wh-proof div { min-width:0; padding:15px 16px; border:1px solid var(--line); background:var(--surface); }
.wh-proof strong,.wh-proof span { display:block; }
.wh-proof strong { font-size:.82rem; }
.wh-proof span { margin-top:3px; color:var(--muted); font-size:.72rem; line-height:1.4; }
.wh-hero-art { margin:0; overflow:hidden; border:1px solid color-mix(in srgb,var(--brand) 34%,var(--line)); background:#08111F; box-shadow:0 42px 110px rgba(0,0,0,.28),0 0 70px rgba(37,99,235,.08); }
.wh-hero-art img { width:100%; height:auto; }
.wh-rail { border-block:1px solid var(--line); background:var(--surface); }
.wh-rail-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.wh-rail-grid div { min-width:0; min-height:116px; display:grid; grid-template-columns:30px 1fr; align-content:center; padding:22px 24px; border-left:1px solid var(--line); }
.wh-rail-grid div:last-child { border-right:1px solid var(--line); }
.wh-rail-grid span { grid-row:1/3; color:var(--brand); font:700 .7rem ui-monospace,SFMono-Regular,Menlo,monospace; }
.wh-rail-grid strong { font-size:.9rem; }
.wh-rail-grid small { margin-top:2px; color:var(--muted); font-size:.72rem; line-height:1.4; }
.wh-feature { display:grid; grid-template-columns:1.15fr .62fr; gap:clamp(56px,8vw,118px); align-items:center; padding-block:clamp(100px,11vw,164px); }
.wh-feature-reverse { grid-template-columns:.62fr 1.15fr; }
.wh-feature-reverse .wh-feature-visual { order:2; }
.wh-feature-copy h2,.wh-settings-heading h2,.wh-faq-heading h2,.wh-final h2 { margin-top:14px; font-size:clamp(2.8rem,4.9vw,5.3rem); line-height:.97; letter-spacing:-.065em; }
.wh-feature-copy > p:not(.wh-section-tag),.wh-settings-heading > p:not(.wh-section-tag) { max-width:610px; margin-top:21px; color:var(--muted); font-size:1rem; line-height:1.65; }
.wh-feature-visual { margin:0; overflow:hidden; border:1px solid color-mix(in srgb,var(--brand) 27%,var(--line)); background:#08111F; box-shadow:0 28px 80px rgba(11,18,32,.16); }
.wh-feature-visual img { width:100%; height:auto; }
.wh-portrait { max-width:620px; }
.wh-feature-points { display:flex; flex-wrap:wrap; gap:9px; margin-top:28px; }
.wh-feature-points span,.wh-settings-tags span { padding:8px 11px; border:1px solid var(--line); background:var(--surface); color:var(--muted); font-size:.76rem; font-weight:750; }
.wh-settings { padding-block:clamp(100px,11vw,160px); background:#0B1220; color:white; }
.wh-settings-heading { max-width:840px; }
.wh-settings-heading .wh-section-tag { color:#7AA7FF; }
.wh-settings-heading > p:not(.wh-section-tag) { color:#AAB6C9; }
.wh-settings-stage { position:relative; min-height:560px; margin-top:58px; }
.wh-settings-card { position:absolute; margin:0; overflow:hidden; border:1px solid rgba(122,167,255,.24); background:#0D1727; box-shadow:0 30px 90px rgba(0,0,0,.32); }
.wh-settings-card img { width:100%; height:auto; }
.wh-settings-main { z-index:3; width:66%; left:17%; top:96px; }
.wh-settings-side { z-index:2; width:42%; }
.wh-settings-left { left:0; top:0; transform:rotate(-2deg); }
.wh-settings-right { right:0; top:36px; transform:rotate(2deg); }
.wh-settings-tags { display:flex; flex-wrap:wrap; justify-content:center; gap:9px; margin-top:12px; }
.wh-settings-tags span { border-color:rgba(255,255,255,.15); background:transparent; color:#AAB6C9; }
.wh-freepro { display:grid; grid-template-columns:repeat(2,1fr); gap:22px; padding-block:clamp(95px,10vw,145px); }
.wh-plan { padding:clamp(30px,4vw,50px); border:1px solid var(--line); background:var(--surface); }
.wh-plan-pro { border-color:color-mix(in srgb,var(--brand) 45%,var(--line)); background:linear-gradient(145deg,color-mix(in srgb,var(--brand) 8%,var(--surface)),var(--surface)); }
.wh-plan > p { color:var(--brand); font-size:.72rem; font-weight:900; letter-spacing:.14em; }
.wh-plan h2 { margin-top:13px; font-size:clamp(2rem,3vw,3.45rem); line-height:1; letter-spacing:-.055em; }
.wh-plan > span { display:block; max-width:560px; margin-top:16px; color:var(--muted); line-height:1.55; }
.wh-plan ul { display:grid; gap:9px; margin:25px 0 0; padding:0; list-style:none; }
.wh-plan li { position:relative; padding-left:23px; color:var(--muted); font-size:.9rem; }
.wh-plan li::before { content:"✓"; position:absolute; left:0; color:var(--brand); font-weight:900; }
.wh-faq { display:grid; grid-template-columns:.7fr 1fr; gap:clamp(60px,10vw,150px); padding-block:clamp(100px,11vw,160px); border-top:1px solid var(--line); }
.wh-faq-heading h2 { font-size:clamp(2.6rem,4.5vw,4.8rem); }
.wh-final { background:var(--brand); color:white; }
.wh-final-grid { min-height:400px; display:grid; grid-template-columns:1fr .56fr; gap:64px; align-items:center; }
.wh-final .wh-section-tag { color:rgba(255,255,255,.62); }
.wh-final h2 { max-width:800px; }
.wh-final-grid > div:last-child { max-width:410px; justify-self:end; }
.wh-final-grid > div:last-child p { margin-bottom:22px; color:rgba(255,255,255,.8); }
.wh-final .button-primary { background:white; border-color:white; color:#0B1220; }
@media (max-width:1100px) {
  .wh-hero-grid,.wh-feature,.wh-feature-reverse { grid-template-columns:1fr; }
  .wh-feature-reverse .wh-feature-visual { order:0; }
  .wh-hero-art { max-width:920px; }
  .wh-proof { max-width:760px; }
  .wh-settings-stage { min-height:520px; }
  .wh-settings-main { width:72%; left:14%; }
  .wh-settings-side { width:45%; }
}
@media (max-width:760px) {
  .wh-hero { padding-block:54px 74px; }
  .wh-hero h1 { font-size:clamp(3.25rem,15vw,5.2rem); }
  .wh-proof,.wh-rail-grid,.wh-freepro,.wh-faq,.wh-final-grid { grid-template-columns:1fr; }
  .wh-rail-grid div,.wh-rail-grid div:last-child { border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
  .wh-feature { padding-block:80px; }
  .wh-feature-copy h2,.wh-settings-heading h2,.wh-final h2 { font-size:clamp(2.5rem,11vw,4.2rem); }
  .wh-settings-stage { min-height:0; display:grid; gap:14px; margin-top:40px; }
  .wh-settings-card,.wh-settings-main,.wh-settings-side { position:relative; inset:auto; width:100%; transform:none; }
  .wh-settings-left,.wh-settings-right { top:auto; left:auto; right:auto; }
  .wh-settings-tags { justify-content:flex-start; }
  .wh-final-grid { min-height:430px; padding-block:70px; }
  .wh-final-grid > div:last-child { justify-self:start; }
}
@media (forced-colors:active) {
  .wh-hero-art,.wh-feature-visual,.wh-settings-card,.wh-plan,.wh-proof div { border-color:CanvasText; box-shadow:none; }
  .wh-settings { background:Canvas; color:CanvasText; border-block:1px solid CanvasText; }
}