:root{
    /* Verago Agency: Verago Agency runs near-black with one saturated blue on every button and nav hover, and the logo mark is that same blue glowing to violet, so blue is the accent and the violet reads as a secondary on dark ground.; logo from https://storage.googleapis.com/funnel-ai-production/image-generation/nlSYopI9rCaLsI4W4v7n/brand-logo-ZZF_YfDWpz.png */
    --accent:#0950C3;
    --accent-soft:rgba(9,80,195,0.10);
    --accent-mid:rgba(9,80,195,0.24);
    --accent-glow:rgba(89,149,247,0.28);
    --paper:#FAF8F3;
    --paper-2:#EFEDE6;
    --paper-3:#E1DFD6;
    --ink:#121821;
    --ink-2:#181F2A;
    --ink-3:#1D2634;
    --line:rgba(0,0,0,0.08);
    --line-dark:rgba(255,255,255,0.08);
    --text:#16171B;
    --text-dim:rgba(0,0,0,0.55);
    --text-dim-dark:rgba(255,255,255,0.55);
    --warn:#B45309;
    --warn-soft:rgba(180,83,9,0.08);
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    font-family:'Inter',system-ui,sans-serif;background:var(--paper);color:var(--text);
    -webkit-font-smoothing:antialiased;overflow-x:hidden;
  }
  .serif{font-family:'Instrument Serif',serif;font-weight:400;letter-spacing:-0.02em;line-height:0.95}
  .mono{font-family:'Geist Mono',ui-monospace,monospace}
  .mono-label{font-family:'Geist Mono',monospace;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:0.12em;color:var(--text-dim)}
  .container{max-width:1280px;margin:0 auto;padding:0 24px}

  .grain{position:relative}
  .grain::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.05 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
    opacity:0.5;mix-blend-mode:multiply;z-index:0;
  }
  .grain > *{position:relative;z-index:1}

  /* NAV */
  nav.top{
    position:fixed;top:0;left:0;right:0;z-index:50;
    backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);
    background:rgba(250,248,243,0.78);border-bottom:1px solid var(--line);
  }
  nav.top .row{display:flex;align-items:center;justify-content:space-between;height:64px}
  nav.top .brand{display:flex;align-items:center;gap:14px;font-size:15px}
  nav.top .logo-sk{font-weight:700;letter-spacing:-0.01em}
  nav.top .logo-sk em{font-style:normal;color:var(--accent)}
  nav.top .x{color:var(--text-dim);font-size:13px}
  nav.top .logo-charm{font-weight:600;letter-spacing:-0.01em}
  nav.top .links{display:flex;gap:24px;align-items:center}
  .brand-logo{display:block;filter:brightness(0);width:auto}
  .brand-switch{display:flex;background:var(--paper-2);border:1px solid var(--line);border-radius:999px;padding:4px;gap:2px}
  .brand-switch a{font-size:12px;font-weight:600;padding:7px 14px;border-radius:999px;text-decoration:none;color:var(--text-dim);letter-spacing:0.02em;white-space:nowrap;transition:color .2s, background .2s}
  .brand-switch a.active{background:var(--ink);color:#fff}
  .brand-switch a:not(.active):hover{color:var(--text)}
  nav.top .links a{font-size:13px;color:var(--text-dim);text-decoration:none;font-weight:500}
  nav.top .links a:hover{color:var(--text)}
  nav.top .cta{font-size:13px;padding:10px 18px;background:var(--accent);color:#fff;border-radius:999px;text-decoration:none;font-weight:600;transition:transform .2s}
  nav.top .cta:hover{transform:scale(1.03)}
  @media(max-width:900px){ nav.top .links{display:none} }

  /* SECTION COMMON */
  section{padding:96px 0;position:relative;overflow:hidden}
  section.dark{background:var(--ink);color:var(--paper)}
  section.dark .mono-label{color:var(--text-dim-dark)}
  section.dark .section-head h2{color:var(--paper)}
  .section-head{margin-bottom:48px;display:flex;align-items:end;justify-content:space-between;gap:32px;flex-wrap:wrap}
  .section-head h2{font-family:'Instrument Serif',serif;font-size:clamp(40px,5vw,72px);line-height:0.98;letter-spacing:-0.025em;font-weight:400;max-width:780px}
  .section-head h2 em{font-style:italic;color:var(--accent)}
  .section-head .head-num{display:block;margin-bottom:8px}

  /* GRID + TILES */
  .bento{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
  .tile{
    background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;
    position:relative;overflow:hidden;
    display:flex;flex-direction:column;
    transition:transform .35s cubic-bezier(.2,.8,.2,1), border-color .35s;
  }
  .tile:hover{transform:translateY(-2px)}
  section.dark .tile{background:var(--ink-2);border-color:var(--line-dark)}
  section.dark .tile:hover{border-color:var(--accent)}
  .tile h3{font-family:'Instrument Serif',serif;font-size:28px;line-height:1.1;letter-spacing:-0.015em;font-weight:400;margin-bottom:12px}
  .tile p{font-size:14px;line-height:1.55;color:var(--text-dim)}
  section.dark .tile p{color:var(--text-dim-dark)}
  .tile .accent-rule{display:block;width:32px;height:2px;background:var(--accent);margin-bottom:14px}
  .tile.sm{grid-column:span 4;min-height:240px}
  .tile.md{grid-column:span 6;min-height:300px}
  .tile.lg{grid-column:span 8;min-height:320px}
  .tile.xl{grid-column:span 12;min-height:260px}

  /* HERO */
  section.hero{padding:120px 0 48px}
  .hero-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;align-items:start}
  .hero-title{
    grid-column:span 12;
    font-size:clamp(56px,7.5vw,116px);
    line-height:0.95;letter-spacing:-0.035em;
    font-family:'Instrument Serif',serif;font-weight:400;
    text-align:center;
  }
  .hero-title em{font-style:italic;color:var(--accent)}
  .hero-meta{
    grid-column:span 12;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:32px;padding-top:24px;border-top:1px solid var(--line);
    text-align:center;
  }
  .hero-meta div{font-size:13px}

  /* SITUATION */
  .sit-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
  .col-win{grid-column:span 6;display:flex;flex-direction:column;gap:16px}
  .col-way{grid-column:span 6;display:flex;flex-direction:column;gap:16px}
  .panel{background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;flex:1;display:flex;flex-direction:column;gap:18px}
  .panel.win{background:#fff}
  .panel.way{background:#FFFBF5;border-color:rgba(180,83,9,0.18)}
  .panel-head{display:flex;align-items:center;gap:12px;margin-bottom:8px}
  .panel-head .dot{width:10px;height:10px;border-radius:50%;background:var(--accent)}
  .panel.way .panel-head .dot{background:var(--warn)}
  .panel-head h3{font-family:'Instrument Serif',serif;font-size:32px;font-weight:400;letter-spacing:-0.02em}
  .item{display:flex;gap:16px;align-items:flex-start}
  .item .n{flex-shrink:0;width:32px;height:32px;border-radius:50%;background:var(--accent);color:#fff;font-family:'Geist Mono',monospace;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center}
  .panel.way .item .n{background:var(--warn)}
  .item h4{font-weight:600;font-size:16px;letter-spacing:-0.01em;margin-bottom:4px}
  .item p{font-size:14px;line-height:1.55;color:var(--text-dim)}

  /* APPROACH */
  section.approach{background:var(--paper-2)}
  .approach-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:start}
  .approach-lead{grid-column:span 7;font-family:'Instrument Serif',serif;font-size:clamp(28px,3.5vw,56px);line-height:1.05;letter-spacing:-0.025em;font-weight:400}
  .approach-lead em{font-style:italic;color:var(--accent)}
  .approach-body{grid-column:span 5;display:flex;flex-direction:column;gap:20px}
  .approach-body p{font-size:16px;line-height:1.55;color:var(--text-dim)}
  .approach-body p strong{color:var(--text);font-weight:600}
  .approach-body p em.accent{font-style:normal;color:var(--accent);font-weight:600}

  /* 02 END STATE (Qwilr module: label + three bullets, one column) */
  section.endstate{background:var(--paper-2)}
  .es-col{max-width:760px}
  .es-group{padding:28px 0;border-top:1px solid var(--line)}
  .es-group:first-child{border-top:0;padding-top:0}
  .es-label{display:block;color:var(--accent);margin-bottom:14px}
  .es-group ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
  .es-group li{position:relative;padding-left:22px;font-size:17px;line-height:1.55;color:var(--text)}
  .es-group li::before{content:"";position:absolute;left:0;top:11px;width:7px;height:7px;border-radius:50%;background:var(--accent)}
  .es-offer{margin-top:8px;padding-top:28px;border-top:1px solid var(--line);font-size:17px;line-height:1.6;color:var(--text-dim)}
  .es-offer strong{color:var(--text);font-weight:600}

  .hero-line{max-width:820px;margin:48px auto 0;text-align:center;font-size:20px;line-height:1.55;color:var(--text-dim)}
  /* PROOF WALL */
  .wall-label{text-align:center;margin-bottom:18px}
  .wall{display:grid;grid-template-columns:repeat(8,1fr);gap:12px}
  .wall .tile{background:#fff;border:1px solid var(--line);border-radius:16px;height:84px;display:flex;align-items:center;justify-content:center;padding:14px}
  .wall .tile img{max-height:40px;max-width:100%;width:auto;object-fit:contain;filter:grayscale(1);opacity:.7}
  .wall .tile.more{font-family:'Geist Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--text-dim);text-align:center}
  .badges{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px}
  .badge{background:var(--ink);color:var(--paper);border-radius:16px;padding:18px 20px;display:flex;align-items:baseline;gap:14px}
  .badge .v{font-family:'Instrument Serif',serif;font-size:40px;line-height:1;color:var(--accent);letter-spacing:-.02em;white-space:nowrap}
  .badge .l{font-size:13px;line-height:1.4;color:var(--text-dim-dark)}
  /* FLOW */
  .flow-wrap{background:var(--ink-2);border:1px solid var(--line-dark);border-radius:28px;padding:36px 40px 20px}
  .flow{width:100%;height:auto;display:block}
  .flow .nd{fill:rgba(255,255,255,0.04);stroke:rgba(255,255,255,0.22);stroke-width:1.2}
  .flow .nd.acc{fill:var(--accent-soft);stroke:var(--accent)}
  .flow .t1{fill:#fff;font-family:Inter,sans-serif;font-size:17px;font-weight:600;letter-spacing:-.01em}
  .flow .t2{fill:rgba(255,255,255,0.6);font-family:'Geist Mono',monospace;font-size:12px}
  .flow .t2.loop{fill:rgba(255,255,255,0.75);font-size:13px}
  .flow .ln{stroke:rgba(255,255,255,0.35);stroke-width:1.4;fill:none}
  .flow .ah{fill:rgba(255,255,255,0.55)}
  .flow-cap{max-width:760px;margin:28px 0 0;font-size:17px;line-height:1.6;color:var(--text-dim-dark)}
  /* CHECKLIST + COLLAPSED PLAYS */
  .es-group ul.checks{display:grid;grid-template-columns:1fr 1fr;gap:10px 32px}
  .es-group ul.checks li::before{content:"\2713";width:auto;height:auto;background:none;top:0;color:var(--accent);font-weight:700}
  .es-group ul.checks li.note{font-family:'Geist Mono',monospace;font-size:12px;color:var(--text-dim);margin-top:-8px}
  .es-group ul.checks li.note::before{content:""}
  details.play-more{margin-top:4px}
  details.play-more summary{list-style:none;cursor:pointer;display:inline-block;font-family:'Geist Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--accent);border:1px solid var(--accent-mid);border-radius:999px;padding:8px 14px}
  details.play-more summary::-webkit-details-marker{display:none}
  details.play-more[open] summary{margin-bottom:14px}
  .sign-grid.four{grid-template-columns:repeat(4,1fr)}
  .step.short{min-height:0}
  .step p a{color:var(--accent)}

  /* RAIL (04 how it runs) */
  .rail{display:grid;grid-template-columns:repeat(5,1fr);gap:28px;position:relative}
  .rail::before{content:"";position:absolute;left:28px;right:28px;top:28px;height:1px;background:rgba(255,255,255,0.16)}
  .rn{position:relative;padding-right:8px}
  .rn .dot{width:56px;height:56px;border-radius:50%;border:1px solid var(--accent);background:var(--ink);color:var(--accent);font-family:'Instrument Serif',serif;font-size:26px;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
  .rn h4{margin:22px 0 10px;font-size:19px;font-weight:600;letter-spacing:-.01em;color:#fff;line-height:1.25}
  .rn p{font-size:14px;line-height:1.55;color:var(--text-dim-dark)}
  .rail-loop{margin-top:40px;padding-top:20px;border-top:1px solid var(--line-dark);font-family:'Geist Mono',monospace;font-size:12px;letter-spacing:.04em;color:rgba(255,255,255,0.7)}

  /* TIMELINE GRAPHIC (07) */
  .tl{background:#fff;border:1px solid var(--line);border-radius:28px;padding:36px 40px 32px}
  .tl-bars{display:grid;grid-template-columns:repeat(5,1fr);gap:8px 0;margin-bottom:22px}
  .tl-bar{background:var(--accent-soft);color:var(--accent);border-radius:999px;padding:7px 14px;font-family:'Geist Mono',monospace;font-size:11px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-right:10px}
  .tl-bar.solid{background:var(--accent);color:#fff}
  .tl-axis{position:relative;display:grid;grid-template-columns:repeat(5,1fr);height:16px;margin:6px 0 18px}
  .tl-axis::before{content:"";position:absolute;left:0;right:0;top:7px;height:2px;background:var(--line)}
  .tl-axis span{position:relative;width:14px;height:14px;border-radius:50%;background:var(--paper);border:2px solid var(--accent);top:1px}
  .tl-cols{display:grid;grid-template-columns:repeat(5,1fr);gap:0}
  .tl-col{padding:0 22px 0 0;border-right:1px solid var(--line);margin-right:22px}
  .tl-col:last-child{border-right:0;margin-right:0;padding-right:0}
  .tl-lab{display:block;color:var(--accent);margin-bottom:12px}
  .tl-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
  .tl-col li{position:relative;padding-left:14px;font-size:14px;line-height:1.45;color:var(--text)}
  .tl-col li::before{content:"";position:absolute;left:0;top:8px;width:5px;height:5px;border-radius:50%;background:var(--accent)}

  /* SYSTEM FLOW (04) */
  .sys-wrap{padding:8px 0 0}
  .sys{width:100%;height:auto;display:block}
  .sys .nd{fill:rgba(255,255,255,0.03);stroke:rgba(255,255,255,0.30);stroke-width:1.2}
  .sys .nd.top{fill:rgba(255,255,255,0.06);stroke:rgba(255,255,255,0.45)}
  .sys .nd.acc{fill:var(--accent-soft);stroke:var(--accent);stroke-width:1.4}
  .sys .t1{fill:#fff;font-family:Inter,sans-serif;font-size:18px;font-weight:500;letter-spacing:-.01em}
  .sys .ts{fill:#fff;font-family:'Instrument Serif',serif;font-size:26px;letter-spacing:-.01em}
  .sys .t2{fill:rgba(255,255,255,0.6);font-family:'Geist Mono',monospace;font-size:12px;letter-spacing:.04em}
  .sys .ln{stroke:rgba(255,255,255,0.32);stroke-width:1.2;fill:none}
  .sys .ah{fill:rgba(255,255,255,0.6)}

  /* OUTBOUND */
  section.outbound{background:var(--ink);color:var(--paper)}
  .out-tile{
    grid-column:span 12;background:var(--ink-2);border:1px solid var(--line-dark);border-radius:28px;
    padding:48px;display:grid;grid-template-columns:1fr 2fr;gap:48px;align-items:start;
  }
  .out-tile .num{font-family:'Instrument Serif',serif;font-size:96px;line-height:0.9;color:var(--accent);font-weight:400}
  .out-tile h3{font-family:'Instrument Serif',serif;font-size:40px;line-height:1.05;letter-spacing:-0.02em;font-weight:400;margin:8px 0 18px}
  .out-tile p{font-size:15px;line-height:1.6;color:var(--text-dim-dark)}
  .out-tile p strong{color:var(--paper);font-weight:600}
  .out-tile .meta{display:flex;flex-direction:column;gap:8px;padding-top:16px;border-top:1px solid var(--line-dark);margin-top:24px}
  .out-tile .meta span{font-family:'Geist Mono',monospace;font-size:12px;color:var(--text-dim-dark)}

  /* TOOLS */
  section.tools{background:var(--ink);color:var(--paper)}
  .tools-bento{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}
  .tool{grid-column:span 3;background:var(--ink-2);border:1px solid var(--line-dark);border-radius:18px;padding:20px;min-height:130px;display:flex;flex-direction:column;justify-content:space-between;transition:all .3s}
  .tool:hover{border-color:var(--accent);transform:translateY(-2px)}
  .tool .tn{font-weight:600;font-size:15px;letter-spacing:-0.01em}
  .tool .td{font-family:'Geist Mono',monospace;font-size:11px;color:var(--text-dim-dark);margin-top:4px;text-transform:uppercase;letter-spacing:0.05em}
  .tool .tp{font-family:'Geist Mono',monospace;font-size:12px;color:var(--accent);margin-top:8px}
  .tool.owned{border-color:rgba(255,255,255,0.22);background:rgba(255,255,255,0.04)}
  .tool.owned .tp{color:#7BD389}
  .tool.cat{background:transparent;border-color:transparent;color:var(--text-dim-dark);min-height:auto;padding:8px 0 4px;grid-column:span 12}
  .tool.cat .mono-label{color:var(--paper)}
  .tool.cat .rule{display:inline-block;width:32px;height:1px;background:var(--accent);margin-right:12px;vertical-align:middle}

  /* TIMELINE */
  section.timeline{background:var(--paper)}
  .timeline-rail{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
  .week{
    background:var(--paper-2);border:1px solid var(--line);border-radius:24px;padding:24px;min-height:260px;
    display:flex;flex-direction:column;justify-content:flex-start;gap:16px;transition:all .3s;
  }
  .week:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
  .week:hover p{color:var(--text-dim-dark)}
  .week .w{font-family:'Instrument Serif',serif;font-size:72px;line-height:1;letter-spacing:-0.03em;color:var(--accent)}
  .week h4{font-weight:600;font-size:18px;letter-spacing:-0.01em;margin-bottom:8px}
  .week p{font-size:13px;line-height:1.55;color:var(--text-dim)}

  /* CAMPAIGNS */
  section.campaigns{background:var(--paper)}

  /* CASE STUDIES */
  section.cases{background:var(--paper)}
  .case-card{
    background:#fff;border:1px solid var(--line);border-radius:28px;padding:40px;margin-bottom:16px;
    display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;
  }
  .case-card .head{display:flex;align-items:center;gap:16px;margin-bottom:20px}
  .case-card h3{font-family:'Instrument Serif',serif;font-size:36px;font-weight:400;letter-spacing:-0.02em;line-height:1}
  .case-card .descline{color:var(--text-dim);font-size:13px;margin-top:4px}
  .case-card h5{font-family:'Geist Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:0.12em;color:var(--text-dim);margin-bottom:8px;margin-top:18px}
  .case-card p{font-size:14px;line-height:1.6;color:var(--text-dim)}
  .case-card .metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:24px}
  .case-card .metric{background:var(--paper-2);border-radius:16px;padding:16px;border:1px solid var(--line)}
  .case-card .metric .v{font-family:'Instrument Serif',serif;font-size:36px;line-height:1;color:var(--accent);letter-spacing:-0.02em;font-weight:400}
  .case-card .metric .l{font-family:'Geist Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.1em;color:var(--text-dim);margin-top:6px}
  .case-card .logo{background:#fff;border:1px solid var(--line);width:64px;height:64px;padding:8px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .case-card .logo img{max-width:100%;max-height:100%;object-fit:contain}

  /* PRICING */
  section.pricing{background:var(--paper-2)}
  .price-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;max-width:1000px;margin:0 auto}
  .price-grid.three{grid-template-columns:repeat(3,1fr);max-width:1200px;gap:14px}
  .plan{background:#fff;border:1px solid var(--line);border-radius:28px;padding:32px;min-height:440px;display:flex;flex-direction:column;transition:all .3s;position:relative}
  .price-grid.three .plan{padding:28px 26px}
  .plan.rec{background:var(--ink);color:var(--paper);border-color:var(--ink);transform:scale(1.02)}
  .plan.rec .price{color:var(--accent)}
  .plan.rec p, .plan.rec li{color:var(--text-dim-dark)}
  .plan h4{font-family:'Instrument Serif',serif;font-size:32px;line-height:1.05;font-weight:400;letter-spacing:-0.02em;margin-bottom:8px}
  .plan .price{font-family:'Instrument Serif',serif;font-size:56px;line-height:1;letter-spacing:-0.03em;color:var(--accent);margin:16px 0}
  .plan .price em{font-style:normal;font-size:0.3em;color:var(--text-dim);vertical-align:middle;margin-left:6px}
  .plan.rec .price em{color:var(--text-dim-dark)}
  .plan ul{list-style:none;margin:16px 0;display:flex;flex-direction:column;gap:10px}
  .plan li{font-size:13.5px;line-height:1.5;display:flex;gap:10px}
  .plan li::before{content:"+";color:var(--accent);font-weight:600;flex-shrink:0}
  .plan .cta-btn{margin-top:auto;padding:14px;border-radius:999px;text-align:center;background:var(--ink);color:var(--paper);text-decoration:none;font-weight:500;font-size:14px;transition:transform .2s}
  .plan.rec .cta-btn{background:var(--accent);color:var(--paper)}
  .plan .cta-btn:hover{transform:scale(1.02)}
  .badge-rec{position:absolute;top:20px;right:24px;font-family:'Geist Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.12em;background:var(--accent);color:var(--ink);padding:5px 10px;border-radius:999px;font-weight:600}
  .badge-new{position:absolute;top:20px;right:24px;font-family:'Geist Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.12em;background:var(--accent-soft);color:var(--accent);border:1px solid var(--accent-mid);padding:5px 10px;border-radius:999px;font-weight:600}

  /* GUARANTEE */
  section.guarantee{background:var(--paper);padding:64px 0}
  .guarantee-tile{
    background:var(--ink);color:var(--paper);border-radius:28px;padding:64px;
    display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;
    position:relative;overflow:hidden;
  }
  .guarantee-tile::after{
    content:"";position:absolute;top:-200px;right:-200px;width:600px;height:600px;
    background:radial-gradient(circle, var(--accent-glow), transparent 60%);pointer-events:none;
  }
  .guarantee-tile > *{position:relative;z-index:1}
  .guarantee-tile h2{font-family:'Instrument Serif',serif;font-size:clamp(40px,5vw,72px);line-height:0.98;letter-spacing:-0.025em;font-weight:400}
  .guarantee-tile h2 em{font-style:italic;color:var(--accent)}
  .guarantee-tile p{font-size:16px;line-height:1.6;color:var(--text-dim-dark);margin-top:24px}
  .guarantee-tile .seal{
    display:inline-flex;align-items:center;gap:8px;background:var(--accent);color:#fff;
    padding:8px 14px;border-radius:999px;font-family:'Geist Mono',monospace;font-size:11px;
    text-transform:uppercase;letter-spacing:0.1em;font-weight:600;margin-bottom:20px;
  }
  .guarantee-tile .cta{display:inline-flex;align-items:center;gap:8px;background:var(--paper);color:var(--ink);padding:14px 24px;border-radius:999px;text-decoration:none;font-weight:600;font-size:14px;margin-top:24px}

  /* SIGN TODAY */
  section.sign{background:var(--paper-2)}
  .sign-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  .step{background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;min-height:240px;display:flex;flex-direction:column;justify-content:flex-start;gap:16px}
  .step .n{font-family:'Instrument Serif',serif;font-size:72px;line-height:1;color:var(--accent);letter-spacing:-0.03em}
  .step h4{font-weight:600;font-size:18px;letter-spacing:-0.01em;margin-bottom:8px}
  .step p{font-size:13px;line-height:1.55;color:var(--text-dim)}

  /* FINAL CTA */
  section.final-cta{background:var(--ink);color:var(--paper);padding:120px 0;position:relative;overflow:hidden}
  section.final-cta::after{
    content:"";position:absolute;top:-200px;right:-200px;width:700px;height:700px;
    background:radial-gradient(circle, var(--accent-glow), transparent 60%);pointer-events:none;
  }
  .final-cta .container{position:relative;z-index:1}
  .final-cta h2{font-family:'Instrument Serif',serif;font-size:clamp(56px,8vw,128px);line-height:0.95;letter-spacing:-0.035em;font-weight:400;max-width:920px}
  .final-cta h2 em{font-style:italic;color:var(--accent)}
  .final-cta p{font-size:18px;line-height:1.55;color:var(--text-dim-dark);max-width:560px;margin-top:24px}
  .final-cta .cta{display:inline-flex;align-items:center;gap:10px;background:var(--paper);color:var(--ink);padding:18px 32px;border-radius:999px;text-decoration:none;font-weight:600;font-size:15px;margin-top:32px;transition:transform .2s}
  .final-cta .cta:hover{transform:scale(1.04)}
  .final-cta .personal{margin-top:56px;padding-top:24px;border-top:1px solid var(--line-dark);max-width:620px;font-size:14px;line-height:1.65;color:var(--text-dim-dark)}

  /* TRUST STRIP */
  section.trust{padding:32px 0 16px;background:var(--paper)}
  .trust-strip{display:flex;flex-direction:column;gap:24px;align-items:center;padding:32px;background:#fff;border:1px solid var(--line);border-radius:24px}
  .trust-strip .label{font-family:'Geist Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:0.12em;color:var(--text-dim);white-space:nowrap}
  .trust-strip .logos{display:flex;align-items:center;gap:28px;flex-wrap:wrap;justify-content:center;width:100%}
  .trust-strip .logos img{height:26px;max-width:96px;width:auto;object-fit:contain;opacity:0.55;filter:grayscale(1);transition:opacity .3s, filter .3s;flex-shrink:0}
  .trust-strip .logos img:hover{opacity:1;filter:none}
  .trust-strip .logos .and-others{font-family:'Geist Mono',monospace;font-size:12px;text-transform:uppercase;letter-spacing:0.12em;color:var(--text-dim);opacity:0.7;flex-shrink:0;white-space:nowrap}

  /* FOOTER */
  footer{padding:32px 0;background:var(--paper);border-top:1px solid var(--line);font-size:12px;color:var(--text-dim)}

  /* === ASSET LEDGER (docket) === */
  .docket{border:1px solid var(--line);border-radius:24px;overflow:hidden;background:#fff;margin-top:8px}
  .docket .drow{display:grid;grid-template-columns:2.1fr 0.9fr 1.1fr 2fr;gap:18px;padding:16px 24px;border-bottom:1px solid var(--line);align-items:center}
  .docket .drow:last-child{border-bottom:none}
  .docket .dhead{background:var(--paper-2);font-family:'Geist Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.12em;color:var(--text-dim)}
  .docket .cname{font-weight:600;font-size:15px;letter-spacing:-0.01em}
  .docket .cname span{display:block;font-weight:400;font-size:12.5px;color:var(--text-dim);margin-top:3px}
  .docket .cval{font-family:'Geist Mono',monospace;font-size:14px;color:var(--accent);font-weight:600}
  .docket .cdate{font-family:'Geist Mono',monospace;font-size:12.5px}
  .docket .cwho{font-size:13px;color:var(--text-dim);line-height:1.5}
  .docket .past{opacity:0.42}
  .docket .cname span.flag{display:inline-block;font-family:'Geist Mono',monospace;font-size:9.5px;font-weight:600;text-transform:uppercase;letter-spacing:0.1em;background:var(--accent-soft);color:var(--accent);padding:3px 8px;border-radius:999px;margin:0 0 0 8px;vertical-align:middle}
  @media(max-width:860px){ .docket .drow{grid-template-columns:1fr;gap:6px} .docket .dhead{display:none} }

  /* === COUNTER CLOCK === */
  .clock{background:var(--ink);color:var(--paper);border-radius:24px;padding:32px 36px;display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:center;margin-top:28px}
  .clock .days{font-family:'Instrument Serif',serif;font-size:96px;line-height:0.9;color:var(--accent);letter-spacing:-0.03em;white-space:nowrap}
  .clock .days em{font-style:normal;font-size:0.2em;display:block;font-family:'Geist Mono',monospace;text-transform:uppercase;letter-spacing:0.12em;color:rgba(255,255,255,0.55);margin-top:10px;max-width:220px;line-height:1.5;white-space:normal}
  .clock p{font-size:15px;line-height:1.65;color:rgba(255,255,255,0.72)}
  .clock p strong{color:#fff}
  @media(max-width:720px){ .clock{grid-template-columns:1fr;gap:18px} .clock .days{font-size:64px} }

  /* === LIFECYCLE RAIL === */
  .life{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:8px}
  .life .stage{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:10px;min-height:200px}
  .life .stage .ev{font-family:'Geist Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.12em;color:var(--accent);font-weight:600}
  .life .stage h4{font-family:'Instrument Serif',serif;font-size:24px;font-weight:400;line-height:1.05;letter-spacing:-0.015em}
  .life .stage p{font-size:13px;line-height:1.55;color:var(--text-dim)}
  .life .stage .rec{margin-top:auto;font-family:'Geist Mono',monospace;font-size:11px;color:var(--text-dim);padding-top:10px;border-top:1px solid var(--line)}

  /* === SIGNAL PLAY CARDS === */
  .play{grid-column:span 12;background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;display:flex;flex-direction:column;gap:14px;transition:all .3s}
  .play:hover{border-color:var(--accent)}
  .play.lead{background:var(--ink);color:var(--paper);border-color:var(--ink)}
  .play.lead p{color:var(--text-dim-dark)}
  .play.lead .mono-label{color:rgba(255,255,255,0.6)}
  .play .ptop{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
  .play h3{font-family:'Instrument Serif',serif;font-size:30px;font-weight:400;letter-spacing:-0.02em;line-height:1.05}
  .play .rec-pill{font-family:'Geist Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.12em;background:var(--accent);color:#fff;padding:5px 10px;border-radius:999px;font-weight:600;white-space:nowrap}
  .play.lead .rec-pill{background:var(--accent);color:var(--ink)}
  .play .sig{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
  .play.lead .sig{background:rgba(255,255,255,0.05);border-color:var(--line-dark)}
  .play .sig .k{font-family:'Geist Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.12em;color:var(--text-dim);display:block;margin-bottom:6px}
  .play.lead .sig .k{color:rgba(255,255,255,0.55)}
  .play .sig .v{font-size:14px;line-height:1.5}
  .play .chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:6px}
  .play .chip{font-family:'Geist Mono',monospace;font-size:10px;padding:5px 10px;background:var(--paper-2);border:1px solid var(--line);border-radius:999px;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-dim)}
  .play.lead .chip{background:rgba(255,255,255,0.06);border-color:var(--line-dark);color:rgba(255,255,255,0.7)}

  /* === EMAIL SEQUENCE CARDS === */
  .seq{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px}
  @media(max-width:900px){ .seq{grid-template-columns:1fr} }
  .mail{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px;display:flex;flex-direction:column;gap:12px}
  .mail .mhead{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line);padding-bottom:10px}
  .mail .mstep{font-family:'Geist Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.12em;color:var(--accent);font-weight:600}
  .mail .mday{font-family:'Geist Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.1em;color:var(--text-dim);white-space:nowrap}
  .mail .msubj{font-family:'Geist Mono',monospace;font-size:12px;color:var(--text);background:var(--paper-2);border-radius:8px;padding:7px 10px}
  .mail .msubj b{color:var(--text-dim);font-weight:500}
  .mail .mbody{font-size:13.5px;line-height:1.62;color:var(--text-dim);white-space:pre-line;flex:1}
  .mail .mbody v{font-style:normal;color:var(--accent);font-family:'Geist Mono',monospace;font-size:12px}
  .mail .mps{font-size:12.5px;line-height:1.55;color:var(--text-dim);border-top:1px solid var(--line);padding-top:10px}
  .mail .mscore{font-family:'Geist Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.1em;color:var(--text-dim)}
  .mail .mscore b{color:var(--accent)}
  .seq-note{background:var(--paper-2);border:1px solid var(--line);border-radius:16px;padding:16px 20px;margin-top:16px;font-size:13.5px;line-height:1.6;color:var(--text-dim)}
  .seq-note b{color:var(--text)}

  /* === OPEN QUESTIONS === */
  .q{grid-column:span 6;background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;display:flex;gap:16px;align-items:flex-start}
  .q .qn{flex-shrink:0;width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;font-family:'Geist Mono',monospace;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center}
  .q h4{font-weight:600;font-size:15px;margin-bottom:5px;letter-spacing:-0.01em}
  .q p{font-size:13px;line-height:1.55;color:var(--text-dim)}

  /* === CALLOUT BOX === */
  .callout{background:var(--warn-soft);border:1px solid rgba(180,83,9,0.2);border-radius:16px;padding:18px 22px}
  .callout p{font-size:14px;line-height:1.6;color:var(--text-dim);margin-top:8px}
  .callout p strong{color:var(--text)}

  /* === VERSUS TILE === */
  .versus{background:#fff;border:1px solid var(--line);border-radius:24px;padding:32px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:32px}
  .versus .big{font-family:'Instrument Serif',serif;font-size:60px;line-height:1;color:var(--accent);margin-top:8px;letter-spacing:-0.03em}
  .versus .big em{font-style:normal;font-size:0.3em;color:var(--text-dim);margin-left:4px}
  .versus p{margin-top:8px;font-size:14px;line-height:1.55;color:var(--text-dim)}
  section.tools .versus{background:var(--ink-2);border-color:var(--line-dark);color:var(--paper)}
  section.tools .versus p{color:var(--text-dim-dark)}
  @media(max-width:900px){ .versus{grid-template-columns:1fr;gap:20px;text-align:left} }

  /* === SCROLL REVEALS === */
  [data-reveal]{
    opacity:0;transform:translateY(28px);
    transition:opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1);
    transition-delay:var(--reveal-delay, 0ms);
    will-change:opacity, transform;
  }
  [data-reveal].revealed{opacity:1;transform:translateY(0)}

  /* === HERO LOAD === */
  .hero-title{opacity:0;transform:translateY(24px);animation:heroFade 1s cubic-bezier(.2,.8,.2,1) .15s forwards}
  .hero-title em{display:inline-block;opacity:0;transform:translateY(24px);animation:heroFade 1s cubic-bezier(.2,.8,.2,1) .45s forwards}
  .hero-meta{opacity:0;animation:heroFade .9s ease 1s forwards}
  @keyframes heroFade{to{opacity:1;transform:translateY(0)}}

  /* === REDUCED MOTION === */
  @media (prefers-reduced-motion: reduce){
    *, *::before, *::after{animation:none !important;transition:none !important}
    [data-reveal], .hero-title, .hero-title em, .hero-meta{opacity:1 !important;transform:none !important}
  }

  /* Mobile */
  @media (max-width: 900px) {
    .hero-title, .hero-meta, .col-win, .col-way{grid-column:span 12}
    .hero-meta{grid-template-columns:1fr}
    .approach-grid, .timeline-rail, .wall, .badges, .rail, .tl-cols, .tl-bars, .tl-axis, .sign-grid.four, .es-group ul.checks, .price-grid, .price-grid.three, .sign-grid, .tools-bento{grid-template-columns:1fr}
    .approach-lead, .approach-body{grid-column:span 12}
    .tl-bar{grid-column:1 / -1 !important}
    .tl-axis{display:none}
    .tl-col{border-right:0;margin-right:0;padding:0 0 18px}
    .out-tile, .case-card, .guarantee-tile{grid-template-columns:1fr;padding:32px;gap:24px}
    .tool{grid-column:span 6}
    .q{grid-column:span 12}
    .life{grid-template-columns:1fr 1fr}
    .plan.rec{transform:none}
    section{padding:64px 0}
  }

  /* (Removed: a leftover blue --accent block from the source template. It was
     fully superseded by the Big Deal yellow block below, but .plan.rec .price,
     .clock .days and .badge-rec had the blue hardcoded and were still painting
     it, which put stray blue on a yellow/near-black brand.) */
  .plan.rec .price{color:var(--accent)}

    /* ---- lighter accent on the dark containers only ---- */
  section.dark, section.outbound, section.tools, section.final-cta,
  .plan.rec, .guarantee-tile, .clock, .play.lead, .week:hover{
    --accent:#5995F7;
    --accent-soft:rgba(89,149,247,0.14);
    --accent-mid:rgba(89,149,247,0.32);
    --accent-glow:rgba(89,149,247,0.28);
  }
  .play.lead .rec-pill{ background:var(--accent); color:#fff }
  .guarantee-tile .seal{ background:var(--accent); border-color:transparent; color:#fff }

  /* ---- mono-labels on dark surfaces ----
     .mono-label defaults to rgba(0,0,0,0.55) for cream backgrounds. Only
     section.dark re-declared it, so labels in the other ink-backed containers
     ("The activation layer", "The signal layer", head-nums) rendered near-black
     on near-black. Light them here. */
  section.outbound .mono-label,
  section.tools .mono-label,
  section.final-cta .mono-label,
  .clock .mono-label,
  .plan.rec .mono-label{ color:var(--text-dim-dark) }

  /* NB: .versus declares background:#fff, but `section.tools .versus` (line ~357)
     overrides it to --ink-2, so the versus card is DARK here and its labels
     ("Licensed by yourself", "Included with Charm", "VS") correctly inherit the
     light colour above. Do not add a dark-text exception for it. */