:root{
    --ink:#f4f3f0;
    --ink-dim:#a6a6ac;
    --bg-0:#0a0a0b;
    --bg-1:#131315;
    --bg-2:#1a1a1d;
    --line:#242427;
    --red:#ff444f;
    --red-deep:#c62430;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{background:var(--bg-0); color:var(--ink); font-family:'Inter',sans-serif; overflow-x:hidden;}
  a{color:inherit; text-decoration:none;}
  img{max-width:100%; display:block;}
  button{font-family:inherit;}
  .wrap{max-width:1160px; margin:0 auto; padding:0 28px;}
  .mono{font-family:'JetBrains Mono',monospace;}

  .chevrons{display:flex; justify-content:center; gap:6px; margin:0 auto;}
  .chevrons span{width:0; height:0; border-left:9px solid transparent; border-right:9px solid transparent; border-top:12px solid var(--red); opacity:0.9;}
  .chevrons span:nth-child(2){border-top-color:var(--bg-2); opacity:1;}
  .chevrons span:nth-child(3){border-top-color:var(--red-deep); opacity:0.7;}

  header{position:sticky; top:0; z-index:50; background:rgba(10,10,11,0.82); backdrop-filter:blur(12px); border-bottom:1px solid var(--line);}
  nav{display:flex; align-items:center; justify-content:space-between; max-width:1160px; margin:0 auto; padding:18px 28px;}
  .logo{display:flex; align-items:center; gap:11px; font-family:'Archivo Black',sans-serif; font-size:19px; text-transform:uppercase;}
  .logo .mark{width:26px; height:22px; background:linear-gradient(160deg, var(--red), var(--red-deep)); clip-path:polygon(0% 0%, 22% 0%, 50% 62%, 78% 0%, 100% 0%, 58% 100%, 42% 100%);}
  .nav-links{display:flex; gap:28px; font-size:13.5px; font-weight:600; color:var(--ink-dim);}
  .nav-links a:hover{color:var(--red);}
  .nav-cta{background:var(--red); color:#0a0a0b; font-weight:800; font-size:13px; padding:11px 22px; border-radius:3px; text-transform:uppercase; letter-spacing:0.3px;}

  .hero{padding:100px 0 70px; text-align:center;}
  .eyebrow{font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--red); text-transform:uppercase; letter-spacing:2px; margin-bottom:24px; display:block;}
  h1.hero-title{font-size:clamp(36px,6.5vw,66px); line-height:1.05; max-width:820px; margin:0 auto 22px;}
  h1.hero-title .hl{color:var(--red);}
  .hero-sub{font-size:17px; color:var(--ink-dim); max-width:520px; margin:0 auto 40px; line-height:1.65;}

  section{padding:80px 0;}
  .sec-head{max-width:640px; margin:0 auto 50px; text-align:center;}
  .sec-label{font-family:'JetBrains Mono',monospace; font-size:11.5px; color:var(--red); text-transform:uppercase; letter-spacing:1.8px; margin-bottom:12px; display:block;}
  h2.sec-title{font-size:clamp(26px,4vw,38px); line-height:1.1;}
  .sec-title .hl{color:var(--red);}
  .sec-desc{color:var(--ink-dim); font-size:15px; margin-top:14px; line-height:1.6;}

  /* ---------- video grids ---------- */
  .vgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
  .vgrid.is-shorts{grid-template-columns:repeat(4,1fr);}

  /* ---------- video card (custom player: thumbnail + info pulled from YouTube) ---------- */
  .vcard{
    position:relative; display:block; aspect-ratio:16/9; width:100%;
    border-radius:14px; overflow:hidden; isolation:isolate; cursor:pointer;
    background:var(--bg-1); border:1px solid var(--line);
    transition:transform .28s cubic-bezier(.2,.7,.2,1), border-color .28s, box-shadow .28s;
    -webkit-tap-highlight-color:transparent;
  }
  .vcard.vertical{aspect-ratio:9/16; max-width:320px; margin:0 auto;}
  .vcard:hover, .vcard:focus-visible{
    transform:translateY(-4px); border-color:var(--red); outline:none;
    box-shadow:0 16px 40px rgba(0,0,0,.55), 0 0 0 1px rgba(255,68,79,.3), 0 14px 44px -12px rgba(255,68,79,.4);
  }
  .vc-img{
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
    opacity:0; transition:opacity .45s ease, transform .7s cubic-bezier(.2,.7,.2,1), filter .35s;
  }
  .vcard.is-ready .vc-img{opacity:1;}
  .vcard:hover .vc-img, .vcard:focus-visible .vc-img{transform:scale(1.07); filter:brightness(.72) saturate(1.05);}
  .vcard::after{
    content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
    background:linear-gradient(to top, rgba(10,10,11,.94) 0%, rgba(10,10,11,.6) 26%, rgba(10,10,11,0) 56%);
  }

  .vc-badges{position:absolute; top:14px; left:14px; z-index:3; display:flex; gap:8px; align-items:center;}
  .vc-chip{
    font-family:'JetBrains Mono',monospace; font-size:10.5px; font-weight:600; letter-spacing:.6px;
    padding:6px 11px; border-radius:999px; color:var(--ink);
    background:rgba(10,10,11,.7); border:1px solid rgba(255,255,255,.14); backdrop-filter:blur(6px);
  }
  .vc-star{
    width:28px; height:28px; border-radius:50%; display:none; align-items:center; justify-content:center;
    background:linear-gradient(160deg, var(--red), var(--red-deep)); box-shadow:0 4px 14px rgba(255,68,79,.45);
  }
  .vcard[data-featured] .vc-star{display:flex;}
  .vc-star svg{width:14px; height:14px; fill:#fff;}

  .vc-play{
    position:absolute; left:50%; top:50%; z-index:3; width:70px; height:70px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background:rgba(10,10,11,.62); border:1.5px solid rgba(255,68,79,.85); backdrop-filter:blur(8px);
    box-shadow:0 10px 34px rgba(0,0,0,.55), 0 0 0 0 rgba(255,68,79,.45);
    opacity:0; transform:translate(-50%,-50%) scale(.7);
    transition:opacity .25s ease, transform .35s cubic-bezier(.2,1.2,.3,1);
  }
  .vc-play svg{width:26px; height:26px; fill:#fff; margin-left:4px;}
  .vcard:hover .vc-play, .vcard:focus-visible .vc-play{opacity:1; transform:translate(-50%,-50%) scale(1); animation:vcPulse 1.8s ease-out .35s infinite;}
  @keyframes vcPulse{0%{box-shadow:0 10px 34px rgba(0,0,0,.55), 0 0 0 0 rgba(255,68,79,.45);} 100%{box-shadow:0 10px 34px rgba(0,0,0,.55), 0 0 0 18px rgba(255,68,79,0);}}

  .vc-info{position:absolute; left:18px; right:18px; bottom:16px; z-index:3; display:flex; flex-direction:column; gap:8px;}
  .vc-title{
    font-size:clamp(14px,1.55vw,17px); font-weight:800; line-height:1.22; letter-spacing:-.1px;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
    text-shadow:0 2px 12px rgba(0,0,0,.7);
  }
  .vcard.vertical .vc-title{font-size:14px;}
  .vc-title.skeleton{height:2.4em; width:78%; border-radius:6px; background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(255,255,255,.14),rgba(255,255,255,.06)); background-size:200% 100%; animation:vcShimmer 1.4s linear infinite; text-shadow:none;}
  @keyframes vcShimmer{from{background-position:200% 0;} to{background-position:-200% 0;}}
  .vc-row{display:flex; align-items:center; justify-content:space-between; gap:10px;}
  .vc-tag{font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:1px; color:var(--ink-dim); text-transform:uppercase;}
  .vc-views{
    display:inline-flex; align-items:center; gap:7px; padding:7px 12px; border-radius:999px;
    font-size:12.5px; font-weight:700; color:var(--ink);
    background:rgba(10,10,11,.74); border:1px solid rgba(255,255,255,.14); backdrop-filter:blur(6px);
  }
  .vc-views[hidden]{display:none;}
  .vc-views svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; opacity:.85;}

  /* touch screens have no hover: keep a quiet play cue visible */
  @media (hover:none){
    .vc-play{opacity:.92; transform:translate(-50%,-50%) scale(.82); animation:none !important;}
  }
  @media (prefers-reduced-motion:reduce){
    .vcard, .vc-img, .vc-play{transition:none;}
    .vcard:hover, .vcard:focus-visible{transform:none;}
    .vcard:hover .vc-img{transform:none;}
    .vcard:hover .vc-play{animation:none;}
    .vc-title.skeleton{animation:none;}
  }

  /* ---------- contact ---------- */
  .contact{text-align:center; padding:100px 0;}
  .contact h2{font-size:clamp(30px,5vw,50px); margin-bottom:18px; line-height:1.08;}
  .contact p{color:var(--ink-dim); font-size:15.5px; max-width:440px; margin:0 auto 34px; line-height:1.6;}
  .contact-actions{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}
  .btn-primary{background:var(--red); color:#0a0a0b; font-weight:800; font-size:14px; padding:16px 30px; border-radius:4px; text-transform:uppercase; letter-spacing:0.3px; transition:transform .15s, background .2s; display:inline-block;}
  .btn-primary:hover{transform:translateY(-2px); background:#ff5c66;}
  .btn-secondary{border:1px solid var(--line); color:var(--ink); font-weight:700; font-size:14px; padding:16px 30px; border-radius:4px; text-transform:uppercase; letter-spacing:0.3px; transition:border-color .2s; display:inline-block;}
  .btn-secondary:hover{border-color:var(--red); color:var(--red);}

  footer{padding:34px 0; text-align:center; border-top:1px solid var(--line);}
  footer span{font-family:'JetBrains Mono',monospace; font-size:11.5px; color:var(--ink-dim);}

  /* ---------- lightbox (thumbnails) ---------- */
  .lightbox{position:fixed; inset:0; background:rgba(6,6,7,0.93); backdrop-filter:blur(6px); display:none; align-items:center; justify-content:center; z-index:500; padding:60px 70px;}
  .lightbox.active{display:flex; animation:vmFade .2s ease;}
  .lightbox-inner{position:relative; max-width:min(92vw, 1180px); max-height:86vh; animation:lightboxIn .22s ease;}
  .lightbox-inner img{max-width:100%; max-height:84vh; width:auto; height:auto; display:block; border-radius:12px; border:1px solid var(--line); box-shadow:0 24px 70px rgba(0,0,0,0.6), 0 0 80px -30px rgba(255,68,79,.4);}
  .lightbox-close{position:absolute; top:-48px; right:0; width:38px; height:38px; border-radius:50%; background:var(--bg-1); border:1px solid var(--line); color:var(--ink); font-size:20px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.2s;}
  .lightbox-close:hover, .lightbox-close:focus-visible{border-color:var(--red); color:var(--red); outline:none;}
  .lb-nav{position:fixed; top:50%; transform:translateY(-50%); width:46px; height:46px; border-radius:50%; background:var(--bg-1); border:1px solid var(--line); color:var(--ink); font-size:28px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.2s; padding-bottom:3px;}
  .lb-nav:hover, .lb-nav:focus-visible{border-color:var(--red); color:var(--red); outline:none;}
  .lb-nav.prev{left:18px;} .lb-nav.next{right:18px;}
  .lb-count{position:absolute; left:0; bottom:-34px; font-family:'JetBrains Mono',monospace; font-size:11.5px; color:var(--ink-dim); letter-spacing:1px;}
  @keyframes lightboxIn{from{transform:scale(.96); opacity:0;} to{transform:scale(1); opacity:1;}}

  nav .nav-links a.active{color:var(--red);}
  .vgrid-sentinel{height:1px;}

  /* loading placeholders */
  .vcard.skel{pointer-events:none; cursor:default; background:linear-gradient(90deg,var(--bg-1),var(--bg-2),var(--bg-1)); background-size:200% 100%; animation:vcShimmer 1.4s linear infinite;}
  .vcard.skel::after{display:none;}

  /* ---------- /portfolio page ---------- */
  .pf-hero{padding:96px 0 40px;}
  .pf-hero-inner{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap;}
  .pf-hero .eyebrow{margin-bottom:20px;}
  .pf-title{font-size:clamp(40px,7vw,78px); line-height:1.02; margin-bottom:20px;}
  .pf-title .hl{color:var(--red);}
  .pf-sub{font-size:16px; color:var(--ink-dim); max-width:520px; line-height:1.65;}
  .stat-card{
    min-width:260px; padding:24px 32px 26px; border-radius:14px;
    background:var(--bg-1); border:1px solid var(--line);
    box-shadow:0 0 90px -34px rgba(255,68,79,.45);
  }
  .stat-card[hidden]{display:none;}
  .stat-label{display:flex; align-items:center; gap:10px; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:1.8px; text-transform:uppercase; color:var(--red); margin-bottom:12px;}
  .stat-label svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
  .stat-value{font-family:'Archivo Black',sans-serif; font-size:clamp(40px,5vw,56px); line-height:1; letter-spacing:-.5px;}
  .pf-list{padding:30px 0 110px;}

  /* ---------- video modal ---------- */
  .vmodal{position:fixed; inset:0; z-index:600; display:none; align-items:center; justify-content:center; padding:56px 24px 40px; background:rgba(6,6,7,.88); backdrop-filter:blur(5px);}
  .vmodal.active{display:flex; animation:vmFade .22s ease;}
  .vm-frame{
    position:relative; width:min(94vw, calc((100vh - 110px) * 16 / 9), 1500px); aspect-ratio:16/9;
    background:#000; border-radius:14px; overflow:hidden;
    border:1px solid rgba(255,68,79,.38);
    box-shadow:0 0 0 1px rgba(255,68,79,.1), 0 30px 90px rgba(0,0,0,.75), 0 0 90px -24px rgba(255,68,79,.45);
    animation:vmIn .28s cubic-bezier(.2,.8,.2,1);
  }
  .vm-frame.vertical{width:min(94vw, calc((100vh - 110px) * 9 / 16)); aspect-ratio:9/16;}
  .vm-frame iframe{position:absolute; inset:0; width:100%; height:100%; border:0; display:block;}
  .vm-close{position:fixed; top:16px; right:22px; width:40px; height:40px; border-radius:50%; background:var(--bg-1); border:1px solid var(--line); color:var(--ink); font-size:22px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.2s; z-index:2;}
  .vm-close:hover, .vm-close:focus-visible{border-color:var(--red); color:var(--red); outline:none;}
  @keyframes vmFade{from{opacity:0;} to{opacity:1;}}
  @keyframes vmIn{from{transform:scale(.95) translateY(8px); opacity:0;} to{transform:none; opacity:1;}}


  /* ---------- nav ---------- */
  .logo{color:var(--ink);}
  .pf-title{font-size:clamp(36px,5.4vw,66px);}
  .pf-hero-inner > div:first-child{flex:1 1 560px; min-width:0;}
  .pf-hero-inner .stat-card{margin-left:auto;}

  /* ---------- home hero ---------- */
  .hero{padding:48px 0 4px;}
  .hero .eyebrow{margin-bottom:18px;}
  h1.hero-title{font-size:clamp(32px,4.7vw,54px); max-width:1000px; margin:0 auto 18px;}
  .hero-sub{max-width:660px; margin:0 auto 26px; font-size:16.5px;}
  .hero-cta{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-bottom:16px;}
  .hero-proof{display:inline-flex; align-items:center; gap:10px; font-size:13.5px; color:var(--ink-dim); margin-bottom:0;}
  .hero-proof[hidden]{display:none;}
  .hero-proof svg{width:17px; height:17px; fill:none; stroke:var(--red); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
  .hero-proof b{font-family:'Archivo Black',sans-serif; font-size:17px; color:var(--ink); font-weight:400;}

  /* ---------- what we do ---------- */
  .wwd-compare{display:grid; grid-template-columns:1fr 1fr; gap:22px; max-width:1000px; margin:0 auto 26px;}
  .wwd-col{border:1px solid var(--line); border-radius:14px; padding:30px 30px 32px; background:var(--bg-1);}
  .wwd-col h3{font-family:'JetBrains Mono',monospace; font-size:11.5px; font-weight:600; letter-spacing:1.8px; text-transform:uppercase; color:var(--ink-dim); margin-bottom:22px;}
  .wwd-col ul{list-style:none; display:grid; gap:15px;}
  .wwd-col li{display:flex; gap:13px; font-size:15px; line-height:1.45; color:var(--ink-dim);}
  .wwd-col li::before{content:'×'; flex:none; width:20px; font-size:20px; line-height:1.05; color:#6b6b72;}
  .wwd-col.new{border-color:rgba(255,68,79,.55); background:linear-gradient(180deg, rgba(255,68,79,.08), var(--bg-1) 62%); box-shadow:0 0 90px -34px rgba(255,68,79,.5);}
  .wwd-col.new h3{color:var(--red);}
  .wwd-col.new li{color:var(--ink); font-weight:500;}
  .wwd-col.new li::before{content:'✓'; color:var(--red); font-size:16px; line-height:1.3; font-weight:800;}
  .wwd-steps{display:grid; grid-template-columns:repeat(5,1fr); gap:1px; max-width:1000px; margin:0 auto; background:var(--line); border:1px solid var(--line); border-radius:14px; overflow:hidden;}
  .wwd-step{background:var(--bg-1); padding:24px 20px 26px; position:relative;}
  .wwd-step .n{font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--red); letter-spacing:1.5px; display:block; margin-bottom:12px;}
  .wwd-step h4{font-size:14px; font-weight:800; text-transform:uppercase; margin-bottom:8px;}
  .wwd-step p{font-size:12.5px; color:var(--ink-dim); line-height:1.5;}
  .wwd-note{text-align:center; max-width:640px; margin:30px auto 0; font-size:15.5px; color:var(--ink-dim); line-height:1.6;}
  .wwd-note strong{color:var(--ink);}

  /* ---------- previews: special + secondary access buttons ---------- */
  .more-wrap{text-align:center; margin-top:46px;}
  .btn-special{
    display:inline-flex; align-items:center; gap:12px; background:var(--red); color:#0a0a0b; font-weight:800; font-size:15px;
    padding:18px 34px; border-radius:6px; text-transform:uppercase; letter-spacing:.4px;
    box-shadow:0 14px 44px -10px rgba(255,68,79,.6);
    transition:transform .2s, background .2s, box-shadow .2s;
  }
  .btn-special svg{transition:transform .2s;}
  .btn-special:hover{transform:translateY(-3px); background:#ff5c66; box-shadow:0 18px 54px -8px rgba(255,68,79,.75);}
  .btn-special:hover svg{transform:translateX(5px);}
  .see-all-tile{
    position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
    aspect-ratio:16/9; border-radius:14px; text-align:center; color:var(--ink);
    border:1.5px dashed rgba(255,68,79,.55);
    background:radial-gradient(120% 120% at 50% 0%, rgba(255,68,79,.15), rgba(255,68,79,.03) 62%);
    transition:transform .28s cubic-bezier(.2,.7,.2,1), border-color .28s, background .28s;
  }
  .see-all-tile:hover, .see-all-tile:focus-visible{transform:translateY(-4px); border-style:solid; border-color:var(--red); outline:none; background:radial-gradient(120% 120% at 50% 0%, rgba(255,68,79,.24), rgba(255,68,79,.06) 62%);}
  .sa-count{font-family:'Archivo Black',sans-serif; font-size:clamp(30px,4vw,46px); line-height:1; color:var(--red);}
  .sa-label{font-size:14px; font-weight:700; letter-spacing:.2px;}
  .sa-arrow{width:40px; height:40px; border-radius:50%; background:var(--red); color:#0a0a0b; display:flex; align-items:center; justify-content:center; transition:transform .25s;}
  .see-all-tile:hover .sa-arrow{transform:translateX(6px);}

  /* ---------- thumbnails ---------- */
  .thumb-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
  .thumb-card{
    display:block; aspect-ratio:16/9; border-radius:12px; overflow:hidden; position:relative; cursor:zoom-in;
    border:1px solid var(--line); background:linear-gradient(135deg,#1c1a1e,#111012);
    transition:transform .28s cubic-bezier(.2,.7,.2,1), border-color .28s, box-shadow .28s;
  }
  .thumb-card img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s cubic-bezier(.2,.7,.2,1);}
  .thumb-card:hover, .thumb-card:focus-visible{transform:translateY(-4px); border-color:var(--red); outline:none; box-shadow:0 16px 40px rgba(0,0,0,.55), 0 14px 44px -12px rgba(255,68,79,.4); z-index:2;}
  .thumb-card:hover img{transform:scale(1.05);}
  .thumb-tools{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:28px;}
  .phone-toggle{
    display:inline-flex; align-items:center; gap:10px; cursor:pointer; font:700 13.5px 'Inter',sans-serif; color:var(--ink);
    background:var(--bg-1); border:1px solid var(--line); border-radius:999px; padding:11px 20px; transition:.2s;
  }
  .phone-toggle svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;}
  .phone-toggle:hover{border-color:var(--red);}
  .phone-toggle[aria-pressed="true"]{background:var(--red); color:#0a0a0b; border-color:var(--red);}
  .phone-note{font-size:13.5px; color:var(--ink-dim); max-width:460px; line-height:1.5;}
  .phone-note[hidden]{display:none;}
  .thumb-grid.phone-mode{grid-template-columns:repeat(2,1fr); max-width:400px; margin:0 auto; gap:12px; padding:22px 16px; background:var(--bg-1); border:1px solid var(--line); border-radius:38px; box-shadow:0 0 90px -34px rgba(255,68,79,.45);}
  .thumb-grid.phone-mode .thumb-card{border-radius:8px;}

  /* ---------- filter tabs ---------- */
  .tabs{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:30px;}
  .tab{font:600 13.5px 'Inter',sans-serif; color:var(--ink-dim); background:transparent; border:1px solid var(--line); border-radius:999px; padding:10px 20px; cursor:pointer; transition:.2s;}
  .tab:hover{border-color:var(--red); color:var(--ink);}
  .tab[aria-selected="true"]{background:var(--red); border-color:var(--red); color:#0a0a0b; font-weight:800;}
  .tab[hidden]{display:none;}
  .tab-count{margin-left:8px; font-weight:600; opacity:.55;}
  .tab[aria-selected="true"] .tab-count{opacity:.7;}
  .wwd-cta{text-align:center; margin-top:30px;}
  #portfolio{padding-top:26px;}
  #portfolio .sec-head{margin-bottom:30px;}
  #portfolio .sec-desc{margin-top:10px;}
  .vgrid-empty{grid-column:1/-1; text-align:center; color:var(--ink-dim); padding:60px 0;}

  /* ---------- bottom CTA on inner pages ---------- */
  .cta-band{border-top:1px solid var(--line); background:var(--bg-1); text-align:center; padding:70px 0;}
  .cta-band h2{font-size:clamp(24px,3.6vw,34px); margin-bottom:14px; line-height:1.15;}
  .cta-band p{color:var(--ink-dim); font-size:15px; margin:0 auto 26px; max-width:460px; line-height:1.6;}

  @media (max-width:900px){
    nav{flex-wrap:wrap; row-gap:10px; padding:14px 20px;}
    .nav-links{order:3; width:100%; display:flex; gap:22px; overflow-x:auto; padding-bottom:4px; -webkit-overflow-scrolling:touch;}
    .nav-links a{white-space:nowrap;}
    .hero{padding:44px 0 14px;}
    .vgrid, .thumb-grid{grid-template-columns:repeat(2,1fr);}
    .vgrid.is-shorts{grid-template-columns:repeat(2,1fr);}
    .wwd-compare{grid-template-columns:1fr;}
    .wwd-steps{grid-template-columns:1fr 1fr;}
    .lightbox{padding:60px 14px;}
    .lb-nav{width:40px; height:40px;} .lb-nav.prev{left:6px;} .lb-nav.next{right:6px;}
    .vmodal{padding:60px 14px 24px;}
    .pf-hero{padding:56px 0 24px;}
    .vc-play{width:58px; height:58px;}
  }
  @media (max-width:560px){
    .vgrid, .thumb-grid{grid-template-columns:1fr;}
    .vgrid.is-shorts{grid-template-columns:repeat(2,1fr);}
    .wwd-steps{grid-template-columns:1fr;}
    .thumb-grid.phone-mode{grid-template-columns:repeat(2,1fr);}
  }

  /* ---------- language switcher ---------- */
  .nav-right{display:flex; align-items:center; gap:12px;}
  .lang{position:relative;}
  .lang-btn{display:inline-flex; align-items:center; gap:9px; height:38px; padding:0 13px 0 9px; background:var(--bg-1); color:var(--ink); border:1px solid var(--line); border-radius:999px; cursor:pointer; font:600 12.5px 'JetBrains Mono',monospace; letter-spacing:1.2px; transition:border-color .2s, background .2s, box-shadow .2s;}
  .lang-btn:hover, .lang.open .lang-btn{border-color:var(--red); background:var(--bg-2);}
  .lang.open .lang-btn{box-shadow:0 0 0 4px rgba(255,68,79,.12);}
  .lang-btn:focus-visible{outline:2px solid var(--red); outline-offset:3px;}
  .lang-btn .flag{width:22px; height:22px; border-radius:50%; flex:none; box-shadow:0 0 0 1px rgba(255,255,255,.14);}
  .lang-btn .globe{width:16px; height:16px; fill:none; stroke:var(--ink-dim); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; transition:transform .5s cubic-bezier(.2,.8,.2,1), stroke .2s;}
  .lang-btn:hover .globe, .lang.open .globe{stroke:var(--red);}
  .lang.open .globe{transform:rotate(180deg);}
  .lang-menu{position:absolute; right:0; top:calc(100% + 10px); min-width:208px; padding:6px; list-style:none; background:rgba(19,19,21,.97); backdrop-filter:blur(14px); border:1px solid var(--line); border-radius:16px; box-shadow:0 24px 60px -12px rgba(0,0,0,.8), 0 0 0 1px rgba(255,68,79,.05); opacity:0; visibility:hidden; transform:translateY(-8px) scale(.97); transform-origin:top right; transition:opacity .18s, transform .22s cubic-bezier(.2,.8,.2,1), visibility 0s .22s; z-index:60;}
  .lang.open .lang-menu{opacity:1; visibility:visible; transform:none; transition:opacity .18s, transform .22s cubic-bezier(.2,.8,.2,1);}
  .lang-opt{display:flex; align-items:center; gap:12px; width:100%; padding:11px 12px; border:0; border-radius:11px; background:transparent; color:var(--ink); font:600 14.5px 'Inter',sans-serif; text-align:left; cursor:pointer; transition:background .15s;}
  .lang-opt:hover, .lang-opt:focus-visible{background:var(--bg-2); outline:none;}
  .lang-opt .flag{width:24px; height:24px; border-radius:50%; flex:none; box-shadow:0 0 0 1px rgba(255,255,255,.14);}
  .lang-opt .name{flex:1;}
  .lang-opt .tick{width:18px; height:18px; fill:none; stroke:var(--red); stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; opacity:0; transform:scale(.6); transition:.2s;}
  .lang-opt[aria-checked="true"] .tick{opacity:1; transform:none;}
  .lang-opt[aria-checked="true"]{color:#fff;}
  body.lang-swap > section, body.lang-swap > footer{opacity:0; transform:translateY(5px);}
  body > section, body > footer{transition:opacity .16s ease, transform .16s ease;}
  @media (max-width:720px){
    .nav-right{gap:8px;}
    .lang-btn{height:36px; padding:0 10px 0 7px; gap:7px;}
    .lang-btn .globe{display:none;}
    .nav-cta{padding:10px 16px;}
  }