/* Departure Mono — free OFL pixel/raster monospace, our stand-in for Tavus's (paid) FK Raster nav font */
  @font-face{font-family:'Departure Mono';src:url('fonts/DepartureMono-Regular.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:block}
  :root{
    --ground:#faf9f7; --paper:#fdfcfa; --ink:#191918; --ink2:#40403d;
    --grey:#9ca3af; --grey2:#6b7280; --line:#e5e4e0;
    --violet:#2f4bf0; --hot:#f76f9b;  /* accent -> cobalt (was #9f52e0) */
    --mint:#9be8bf; --pink:#f7bcd8; --amber:#f8d264; --indigo:#6d8cff;  /* was periwinkle #a9b6f2 -> light cobalt (no violet in UI) */
    --coral:#f6b48c; --lilac:#c3cffb; --sky:#b0d4f7;  /* --lilac was violet #cdbcf5 -> pale cobalt tint */
    --cobalt-tint:#e4eafe;  /* soft cobalt fill for the highlighted/"Popular" plan card */
    --disp:'Fraunces',Georgia,serif;
    --mono:'Departure Mono',ui-monospace,SFMono-Regular,Menlo,'Courier New',monospace;
    --body:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;
  }
  *{box-sizing:border-box}
  *,*::before,*::after{border-radius:0!important}   /* SHARP edges everywhere — beats inline/specific radii */
  html{scroll-behavior:smooth}
  body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased;font-synthesis:none}
  a{color:inherit}
  .page{max-width:1500px;margin:0 auto;padding:0 clamp(18px,4vw,52px)}
  section{padding:clamp(52px,7vw,104px) 0}
  .disp{font-family:var(--disp);font-optical-sizing:none;font-variation-settings:'opsz' 34,'wght' 800}
  .eyebrow{font-family:var(--mono);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--grey2)}
  /* Tavus-style section title: light, high-optical-contrast serif with room to breathe (was thick wght-900) */
  .sec-h{font-family:var(--disp);font-optical-sizing:none;font-variation-settings:'opsz' 88,'wght' 455;font-size:clamp(31px,4.8vw,52px);letter-spacing:-.012em;line-height:1.08;margin:10px 0 0;text-wrap:balance}
  .tag{display:inline-flex;align-items:center;font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);border:1.5px solid var(--ink);padding:2px 8px;line-height:1.6}
  canvas.dith{image-rendering:pixelated;display:block}

  /* header */
  /* sticky top region: full-width promo bar + floating (no-background) split header */
  .topstick{position:sticky;top:0;z-index:70}
  .promo{background:var(--amber)}
  .promo-in{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-family:var(--mono);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:9px 0}
  .promo-in .b-tag{background:var(--ink);color:var(--paper);padding:3px 8px;font-size:10px}
  .promo-in a{margin-left:auto;color:var(--ink);text-decoration:none;border-bottom:1.5px solid var(--ink)}
  .hdr-wrap{padding:13px 0;pointer-events:none}
  /* header + promo extend WIDER than the body (Tavus near-full-bleed); body sections keep the 1500px .page */
  .hdr-wrap .page,.promo .page{max-width:1810px;padding:0 clamp(20px,3vw,46px)}
  .hdr-wrap .page{position:relative}
  .hdr-wrap .mkhead-l,.hdr-wrap .mkright,.hdr-wrap .burger,.hdr-wrap #mobnav{pointer-events:auto}
  /* ONE connected bordered bar — logo + nav cells share vertical dividers (Tavus segmented header) */
  .mkhead{display:flex;align-items:stretch;justify-content:space-between;gap:14px}
  .mkhead-l{display:flex;align-items:stretch;border:1.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);background:var(--paper);overflow:hidden}
  .mklogo-cell{display:flex;align-items:center;gap:8px;padding:13px 20px}
  .mklogo{font-family:var(--disp);font-optical-sizing:none;font-variation-settings:'opsz' 30,'wght' 900;font-size:27px;letter-spacing:-.02em;text-decoration:none;color:var(--ink);line-height:1}
  .mkearly{font-family:var(--mono);font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;background:var(--hot);border:1.5px solid var(--ink);padding:2px 6px}
  .mknav{display:flex;align-items:stretch;gap:0}
  .mknav a{font-family:var(--mono);font-size:13px;font-weight:400;text-transform:uppercase;letter-spacing:.05em;color:var(--ink);border-left:1.5px solid var(--ink);padding:0 19px;text-decoration:none;display:inline-flex;align-items:center;gap:8px;background:transparent;transition:background .12s}
  .mknav a .sq{width:8px;height:8px;background:var(--ink);flex-shrink:0}
  .mknav a:hover{background:var(--amber)}
  /* login + start = one connected bar too (start is the accent-violet cell) */
  .mkright{margin-left:auto;display:flex;align-items:stretch;border:1.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);background:var(--paper);overflow:hidden}
  .mklogin{font-family:var(--mono);font-size:13px;font-weight:400;text-transform:uppercase;letter-spacing:.05em;background:transparent;padding:0 21px;color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;transition:background .12s}
  .mklogin:hover{background:var(--amber)}
  .mkstart{font-family:var(--mono);font-size:13px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;border-left:1.5px solid var(--ink);background:var(--violet);padding:0 21px;color:#fff;text-decoration:none;display:inline-flex;align-items:center;transition:filter .12s}
  .mkstart:hover{filter:brightness(1.12)}
  .burger{display:none;margin-left:auto;background:none;border:1.5px solid var(--ink);padding:8px;cursor:pointer;line-height:0}
  #mobnav{display:none;position:absolute;top:calc(100% + 2px);left:0;right:0;z-index:70;border:1.5px solid var(--ink);box-shadow:5px 6px 0 var(--ink);background:var(--paper);padding:10px;flex-direction:column;gap:4px}
  #mobnav a{font-family:var(--mono);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;text-decoration:none;color:var(--ink);padding:9px 8px;border-bottom:1px solid var(--line)}

  /* banner */
  .mkbanner{border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:var(--amber);padding:12px 18px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-family:var(--mono);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
  .mkbanner .b-tag{background:var(--ink);color:var(--paper);padding:3px 8px;font-size:10px}
  .mkbanner a{margin-left:auto;color:var(--ink);text-decoration:none;border-bottom:1.5px solid var(--ink)}

  /* CLOUD HERO — dithered image as a faint full-bleed background + centred typing question */
  /* full-bleed to the very top: negative margin slides the cloud up UNDER the floating header (no gap, no separator).
     min-height fills the viewport so the next section never peeks above the fold; content vertically centred. */
  .hero-cloud{position:relative;overflow:hidden;margin-top:calc(-1 * var(--hdrh,83px));min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:clamp(122px,14vw,192px) 0 clamp(76px,9vw,120px)}
  .hero-bg{position:absolute;inset:0;z-index:0;opacity:.5;background:#e9e6df center/cover no-repeat}
  /* slight living-dither shimmer: a 2nd, coarser dither of the same cloud that gently cross-fades over the base */
  .hero-bg-alt{opacity:0}
  @media(prefers-reduced-motion:no-preference){ .hero-bg-alt{animation:heroDither 6.5s ease-in-out infinite} }
  @keyframes heroDither{0%,100%{opacity:0}50%{opacity:.4}}
  .hero-inner{position:relative;z-index:1;text-align:center}
  .hero-inner .eyebrow{display:block;margin-bottom:20px}
  .hero-q{font-family:var(--disp);font-optical-sizing:none;font-variation-settings:'opsz' 110,'wght' 430,'SOFT' 0;font-size:clamp(40px,6.6vw,86px);line-height:1.05;letter-spacing:-.02em;margin:0 auto;max-width:20ch;text-wrap:balance;color:var(--ink)}
  .hero-q #hero-word{font-style:italic;font-variation-settings:'opsz' 110,'wght' 500,'SOFT' 0}
  .hero-rot{display:block;min-height:1.03em}   /* own line + reserved height so typing can't reflow the hero */
  .hero-cur{display:inline-block;width:.06em;min-width:3px;height:.82em;background:var(--violet);margin-left:.04em;transform:translateY(.06em);animation:blink 1s step-end infinite}
  @keyframes blink{50%{opacity:0}}
  @media(prefers-reduced-motion:reduce){.hero-cur{animation:none}}
  .hero-sub{font-size:clamp(15.5px,1.55vw,19px);line-height:1.55;color:var(--ink);font-weight:450;max-width:48ch;margin:24px auto 30px;position:relative}
  /* soft light halo behind the hero text so the busy dither can't fight legibility (keeps the subtitle readable) */
  .hero-inner::before{content:'';position:absolute;z-index:-1;inset:-9% -8% -6% -8%;background:radial-gradient(ellipse 64% 62% at 50% 44%,rgba(244,242,239,.85),rgba(244,242,239,.45) 44%,transparent 72%);pointer-events:none}
  .hero-inner .accent-btn{margin:0 auto}
  /* hero folder tabs */
  .ftabs{display:flex;gap:5px;padding-left:20px;position:relative;z-index:2;flex-wrap:wrap}
  .ftab{font-family:var(--mono);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--grey2);border:1.5px solid var(--ink);background:#eceae4;padding:11px 26px;cursor:pointer;margin-right:-1.5px;margin-bottom:-1.5px;position:relative;z-index:1}
  .ftab:hover{color:var(--ink)}
  .ftab.on{background:var(--paper);color:var(--ink);border-bottom-color:var(--paper);z-index:4}
  .fpanel{border:1.5px solid var(--ink);box-shadow:7px 7px 0 var(--ink);background:var(--paper);position:relative}
  .fpanel-top{display:grid;grid-template-columns:1.1fr .9fr;border-bottom:1.5px solid var(--ink)}
  .fpanel-l{padding:clamp(24px,3.2vw,40px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
  .fpanel-l h1{font-family:var(--disp);font-optical-sizing:none;font-variation-settings:'opsz' 84,'wght' 460;font-size:clamp(33px,4.6vw,52px);margin:0 0 18px;letter-spacing:-.015em;line-height:1.03;text-wrap:balance}
  .fpanel-l p{font-size:16px;line-height:1.55;color:var(--ink2);max-width:44ch;margin:0 0 26px}
  .accent-btn{font-family:var(--mono);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;background:var(--violet);color:#fff;border:1.5px solid var(--ink);box-shadow:3px 3px 0 var(--ink);padding:12px 20px;cursor:pointer;text-decoration:none;display:inline-flex;transition:transform .09s,box-shadow .09s}
  .accent-btn:hover{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--ink)}
  .fpanel-r{position:relative;border-left:1.5px solid var(--ink);background:#0c0c0b;display:flex;min-height:250px;overflow:hidden}
  .fpanel-r canvas{width:100%;height:100%;background:#0c0c0b}
  .benefits{display:grid;grid-template-columns:repeat(3,1fr)}
  .benefit{padding:24px 26px;border-left:1.5px solid var(--ink)}
  .benefit:first-child{border-left:none}
  .bruler{display:flex;align-items:center;gap:11px;margin-bottom:15px}
  .bruler .bl{font-family:var(--mono);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--grey2);white-space:nowrap}
  .bruler .rl{flex:1;height:9px;background:repeating-linear-gradient(90deg,var(--ink) 0,var(--ink) 1.5px,transparent 1.5px,transparent 5px)}
  .benefit h4{font-family:var(--disp);font-size:22px;margin:0 0 8px}
  .benefit p{font-size:13.5px;line-height:1.55;color:var(--ink2);margin:0}

  /* What You Get: full-bleed image background (runs from the section to pricing) with a
     light paper scrim for legibility; the folder-tab "bookmark" card sits narrower + floats.
     COLOR FLOW: the scrim is a vertical wash — warm beige at the top (continuing the hero /
     pipeline) that gradually cools to a soft cobalt tint by the bottom, so the eye drifts
     from beige → blue as it approaches pricing. Gentle: all stops are light + legible. */
  .wyg-bg{background:linear-gradient(180deg,
      rgba(244,242,239,.60) 0%,
      rgba(240,240,242,.50) 34%,
      rgba(230,235,248,.50) 68%,
      rgba(219,227,250,.62) 100%),
    url('images/wyg-bg.png') center center/cover no-repeat}
  /* the marquee is the last band inside .wyg-bg; a blue-tinted plate under it eases the
     transition into pricing (which sits on the cool --ground) so there's no hard image edge */
  .wyg-bg .marq{position:relative}
  .wyg-card{max-width:1040px;margin:0 auto;animation:wygFloat 7s ease-in-out infinite;will-change:transform}
  @keyframes wygFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
  @media(prefers-reduced-motion:reduce){.wyg-card{animation:none}}

  /* research areas — FULL-BLEED dithered section (Tavus): texture edge-to-edge, content in .page.
     COLOR FLOW: dot texture stays, but the base tone is now a gentle vertical wash — warm beige
     at the top (continuing the hero banner) drifting a touch cooler at the bottom so it hands off
     seamlessly into the .wyg-bg wash below. Subtle: both stops are light beige. */
  .rareas-full{background:linear-gradient(180deg,#eceae3 0%,#e7e7e4 100%);background-image:radial-gradient(rgba(25,25,24,.10) 1px,transparent 1px);background-size:4px 4px;padding:clamp(48px,6.5vw,96px) 0}
  .rareas-full h2{font-family:var(--disp);font-optical-sizing:none;font-variation-settings:'opsz' 88,'wght' 455;font-size:clamp(31px,4.8vw,52px);text-align:center;margin:0 0 10px;letter-spacing:-.012em;line-height:1.08}
  .rareas-full .sub{text-align:center;color:var(--ink2);max-width:60ch;margin:0 auto 36px;font-size:15.5px;line-height:1.5}
  .rgrid{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:16px;align-items:start}
  .rcol{display:flex;flex-direction:column;gap:16px}
  .rcard{border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:#fff;overflow:hidden}
  .rcard .rh{border-bottom:1.5px solid var(--ink);padding:6px 10px;font-family:var(--mono);font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;display:flex;align-items:center;gap:8px;background:var(--lilac)}
  .rcard.green .rh{background:var(--mint)} .rcard.pink .rh{background:var(--pink)} .rcard.amber .rh{background:var(--amber)}
  .rcard .rh .rl{flex:1;height:7px;background:repeating-linear-gradient(90deg,var(--ink) 0,var(--ink) 1.5px,transparent 1.5px,transparent 4px)}
  .rcard .rb{padding:13px;display:flex;gap:12px}
  .rcard .rb canvas{width:46px;height:46px;flex-shrink:0;border:1px solid var(--ink)}
  .rcard .rb p{margin:0;font-size:12.5px;line-height:1.45;color:var(--ink2)}
  .term{background:#18172a;border:1.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);overflow:hidden}
  .term-bar{background:#e9e6df;border-bottom:1.5px solid var(--ink);padding:6px 10px;font-family:var(--mono);font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;display:flex;align-items:center;gap:7px}
  .term-bar .g{width:9px;height:9px;background:var(--mint);border:1px solid var(--ink)}
  .term-bar .rl{flex:1;height:7px;background:repeating-linear-gradient(90deg,var(--ink) 0,var(--ink) 1.5px,transparent 1.5px,transparent 4px)}
  .term-body{display:grid;grid-template-columns:1fr 1.15fr;min-height:270px}
  .term-body canvas{width:100%;height:100%;background:#0c0c14;border-right:1.5px solid #2b2a40}
  .term-txt{padding:14px 16px;font-family:var(--mono);font-size:12px;line-height:1.6;color:#7ef0b0;white-space:pre;overflow:hidden}
  .term-txt .p{color:#8f8be0}
  .term-cursor{display:inline-block;width:8px;height:15px;background:#7ef0b0;margin-left:1px;vertical-align:text-bottom;animation:blink 1s step-end infinite}
  @keyframes blink{50%{opacity:0}}
  @media(prefers-reduced-motion:reduce){.term-cursor{animation:none}}

  /* feature cards */
  .fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin-top:34px}
  .fcard{border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:20px 20px 22px;background:var(--paper)}
  .fcard .ic{width:38px;height:38px;border:1.5px solid var(--ink);background:var(--mint);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:700;font-size:16px;margin-bottom:14px}
  .fcard.pink .ic{background:var(--pink)} .fcard.amber .ic{background:var(--amber)} .fcard.indigo .ic{background:var(--indigo)} .fcard.coral .ic{background:var(--coral)} .fcard.lilac .ic{background:var(--lilac)}
  .fcard .cat{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--grey2)}
  .fcard h4{font-family:var(--disp);font-size:20px;margin:6px 0 6px}
  .fcard p{margin:0;font-size:13.5px;line-height:1.5;color:var(--ink2)}

  /* flow */
  .flow{border:1.5px dashed var(--ink2);padding:22px;display:flex;align-items:stretch;overflow-x:auto;margin-top:30px}
  .flow-step{flex:1;min-width:155px;background:var(--amber);border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:15px 16px 17px;display:flex;flex-direction:column}
  .flow-step.c2{background:var(--mint)} .flow-step.c3{background:var(--pink)} .flow-step.c4{background:var(--indigo)} .flow-step.c5{background:var(--coral)}
  .flow-step .n{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.04em}
  .flow-step h4{font-family:var(--disp);font-size:18px;margin:9px 0 5px}
  .flow-step p{margin:0;font-size:12.5px;line-height:1.45;color:var(--ink2)}
  .flow-arrow{display:flex;align-items:center;font-size:22px;color:var(--ink);padding:0 10px;flex-shrink:0}

  /* stats */
  .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));border:1.5px solid var(--ink);box-shadow:6px 6px 0 var(--ink);background:var(--paper)}
  .stat{padding:26px 26px;border-left:1.5px solid var(--line)}
  .stat:first-child{border-left:none}
  .stat .n{font-family:var(--disp);font-optical-sizing:none;font-variation-settings:'opsz' 50,'wght' 900;font-size:clamp(34px,5vw,52px);line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
  .stat .l{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--grey2);margin-top:10px}

  /* marquee */
  .marq{overflow:hidden;border-top:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);background:var(--paper)}
  .marq-track{display:flex;width:max-content;animation:scroll 60s linear infinite}
  @media(prefers-reduced-motion:reduce){.marq-track{animation:none}}
  @keyframes scroll{to{transform:translateX(-50%)}}
  .marq-item{font-family:var(--disp);font-size:23px;padding:16px 30px;white-space:nowrap}

  /* marquee → pricing BRIDGE: mono eyebrow between two hairline rules, on the cool wyg ground.
     A shared, hard-edge connective element (Tavus retro) so the channels band and pricing read
     as one intentional flow rather than two stacked blocks. */
  .mq-bridge{display:flex;align-items:center;gap:16px;padding:22px 0 26px}
  .mq-bridge .rl{flex:1;height:9px;background:repeating-linear-gradient(90deg,var(--ink) 0,var(--ink) 1.5px,transparent 1.5px,transparent 5px);opacity:.65}
  .mq-bridge-lbl{font-family:var(--mono);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink2);white-space:nowrap;display:inline-flex;align-items:center;gap:9px}
  .mq-bridge-lbl::before{content:"◆";font-size:8px;color:var(--violet)}
  .mq-bridge-lbl::after{content:"↓";font-size:13px;color:var(--ink)}
  /* pricing: soft cool-tinted top continuing the marquee ground, fading into the plain ground so
     the bridge → plans handoff has no hard seam. */
  #pricing{background:linear-gradient(180deg,rgba(219,227,250,.42) 0%,rgba(244,242,239,0) 46%)}

  /* pricing */
  .prgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
  .prcard{border:1.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);background:var(--paper);padding:26px 24px;display:flex;flex-direction:column}
  .prcard.pop{background:var(--cobalt-tint)}
  .prcard .pn{font-family:var(--mono);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--grey2);display:flex;align-items:center;gap:8px}
  .prcard .pn .sq{width:9px;height:9px;background:var(--ink)}
  .prcard .price{font-family:var(--disp);font-optical-sizing:none;font-variation-settings:'opsz' 40,'wght' 900;font-size:44px;letter-spacing:-.03em;margin:14px 0 2px;line-height:1}
  .prcard .price small{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--grey2);letter-spacing:0}
  .prcard ul{list-style:none;margin:16px 0 22px;padding:16px 0 0;border-top:1.5px solid var(--ink);display:flex;flex-direction:column;gap:9px}
  .prcard.pop ul{border-top-color:var(--ink)}
  .prcard li{font-size:13.5px;color:var(--ink2);display:flex;gap:9px;align-items:baseline}
  .prcard li::before{content:"■";color:var(--ink);font-size:8px}
  .prbtn{margin-top:auto;text-align:center;font-family:var(--mono);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;border:1.5px solid var(--ink);padding:12px;text-decoration:none;color:var(--ink);background:#fff;box-shadow:3px 3px 0 var(--ink);transition:transform .09s,box-shadow .09s}
  .prcard.pop .prbtn{background:var(--violet);color:#fff}
  .prbtn:hover{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--ink)}

  /* quotes */
  .quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:18px;margin-top:34px}
  .quote{border:1.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:22px;background:var(--amber);transform:rotate(-1deg)}
  .quote:nth-child(2){background:var(--sky);transform:rotate(1deg)} .quote:nth-child(3){background:var(--pink);transform:rotate(-.5deg)}
  .quote blockquote{margin:0 0 16px;font-family:var(--disp);font-size:19px;line-height:1.4;letter-spacing:-.01em}
  .quote .who{font-family:var(--mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink2)}

  /* cta */
  .cta{background:var(--ink);color:var(--paper);padding:clamp(44px,7vw,96px) 0;text-align:center}
  .cta h2{font-family:var(--disp);font-optical-sizing:none;font-variation-settings:'opsz' 84,'wght' 460;font-size:clamp(32px,5vw,54px);margin:0 0 12px;color:var(--paper);text-wrap:balance;letter-spacing:-.012em;line-height:1.06}
  .cta p{margin:0 auto 26px;max-width:50ch;color:#c9c3ba;font-size:16px;line-height:1.5}
  .cta a{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;background:var(--violet);color:#fff;border:1.5px solid #fff;box-shadow:4px 4px 0 #fff;padding:14px 26px;text-decoration:none}

  /* footer — Tavus: oversized wordmark + pink CTA, connected column cells, legal bar */
  .mkfoot{background:var(--ink);color:var(--paper);border-top:1.5px solid var(--ink)}
  .mkfoot-cta{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap;padding:clamp(30px,4vw,50px) 0;border-bottom:1.5px solid #34322d}
  .mkfoot-word{font-family:var(--disp);font-optical-sizing:none;font-variation-settings:'opsz' 60,'wght' 900;font-size:clamp(46px,8vw,94px);color:var(--paper);letter-spacing:-.035em;line-height:.82}
  .mkfoot-cta .r{display:flex;flex-direction:column;gap:15px;align-items:flex-start;max-width:38ch}
  .mkfoot-cta .tagline{color:#a8a39c;font-size:14.5px;line-height:1.5}
  .foot-start{font-family:var(--mono);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;background:var(--violet);color:#fff;border:1.5px solid var(--paper);box-shadow:3px 3px 0 var(--paper);padding:11px 18px;text-decoration:none}
  .mkfoot-cols{display:grid;grid-template-columns:repeat(4,1fr)}
  .mkfoot-col{padding:24px clamp(18px,2.6vw,30px);border-left:1px solid #34322d}
  .mkfoot-col:first-child{border-left:none;padding-left:0}
  .mkfoot-col:last-child{padding-right:0}
  .mkfoot-col h5{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:#8a857d;margin:0 0 13px}
  .mkfoot-col a{display:block;color:#e2ded7;text-decoration:none;font-size:13px;padding:4px 0}
  .mkfoot-col a:hover{color:var(--hot)}
  .mkfoot-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#8a857d;border-top:1.5px solid #34322d;padding:16px 0}
  .mkfoot-bar .dots{display:flex;gap:6px}
  .mkfoot-bar .dots span{width:9px;height:9px;background:#34322d}
  .mkfoot-bar .dots span:nth-child(1){background:var(--mint)} .mkfoot-bar .dots span:nth-child(2){background:var(--amber)} .mkfoot-bar .dots span:nth-child(3){background:var(--hot)}

  .sec-head{max-width:640px}
  @media(max-width:900px){ .rgrid{grid-template-columns:1fr} .prgrid{grid-template-columns:1fr} }
  @media(max-width:820px){ .fpanel-top{grid-template-columns:1fr} .fpanel-r{border-left:none;border-top:1.5px solid var(--ink);min-height:220px} .benefits{grid-template-columns:1fr} .benefit{border-left:none;border-top:1.5px solid var(--line)} .benefit:first-child{border-top:none} .term-body{grid-template-columns:1fr} .mkfoot-cols{grid-template-columns:1fr 1fr} }
  @media(max-width:760px){ .mknav,.mkright{display:none} .burger{display:block} }