.cw{box-sizing:border-box;background:#f3f2f2;color:#201e1d;font-family:'Archivo',system-ui,sans-serif;font-size:17px;line-height:1.5;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased}
.cw *{box-sizing:border-box}
.cw h1,.cw h2,.cw h3,.cw h4,.cw p,.cw ul,.cw ol,.cw figure{margin:0;padding:0}
.cw ul,.cw ol{list-style:none}
.cw a{color:#ae1800}
.cw a:hover{color:#e15b47}

/* layout */
.sec{padding:56px 20px}
.sec-t{padding:40px 20px}
.wrap{display:flex;flex-direction:column;gap:20px;width:100%;max-width:1120px;margin:0 auto}
.stack{display:flex;flex-direction:column}
.g8{gap:8px}.g12{gap:12px}.g16{gap:16px}.g24{gap:24px}.g32{gap:32px}.g40{gap:40px}
.ink{background:#201e1d;color:#ffffff}
.red{background:#dd2b0f;color:#ffffff}
.surf{background:#eae9e9}
.white{background:#ffffff}
.rule-t{border-top:2px solid #9b9797}
.cols{display:flex;flex-direction:column;gap:16px}

/* type */
.h-hero{font-size:42px;line-height:1.02;font-weight:900;letter-spacing:-.03em}
.h-page{font-size:40px;line-height:1.04;font-weight:900;letter-spacing:-.03em}
.h2{font-size:30px;line-height:1.08;font-weight:800;letter-spacing:-.02em}
.h3{font-size:21px;line-height:1.2;font-weight:800;letter-spacing:-.01em}
.h4{font-size:17px;line-height:1.3;font-weight:800}
.lead{font-size:19px;line-height:1.45}
.punch{font-size:34px;line-height:1.05;font-weight:900;letter-spacing:-.02em}
.eyebrow{font-size:12px;line-height:1.3;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#605d5d}
.ink .eyebrow{color:#bab6b6}
.red .eyebrow{color:#ffffff}
.muted{color:#605d5d}
.ink .muted{color:#bab6b6}
.small{font-size:14px;line-height:1.45}
.meta{font-size:13px;line-height:1.45;color:#605d5d}
.ink .meta{color:#bab6b6}
.cw .al .meta,.cw .pan .meta,.cw .tl .meta,.cw .plan .meta{color:#605d5d}
.cw .tl .eyebrow{color:#605d5d}
.cw .al .muted,.cw .pan .muted{color:#605d5d}
.b{font-weight:700}
.num{font-variant-numeric:tabular-nums}

/* header and footer */
.hd{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-bottom:2px solid #9b9797;background:#f3f2f2}
.hd-r{display:flex;align-items:center;gap:8px}
.cw .hd-a{display:inline-flex;align-items:center;min-height:44px;padding:0 8px;font-size:15px;font-weight:700;color:#201e1d;text-decoration:none}
.hd-m{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 12px;border:2px solid #201e1d;background:transparent;font-family:inherit;font-size:15px;font-weight:700;color:#201e1d}
.nav{display:none}
.ft{background:#201e1d;color:#ffffff;padding:40px 20px 48px}
.cw .ft a{color:#ffffff;text-decoration:none;font-weight:600;font-size:15px;display:flex;align-items:center;min-height:44px}
.cw .ft a:hover{color:#ff9783}
.ft-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}

/* buttons and links */
.cw .btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:56px;padding:0 24px;border:0;background:#dd2b0f;color:#ffffff;font-family:inherit;font-size:18px;font-weight:800;text-decoration:none;cursor:pointer}
.cw .btn:hover{background:#e15b47;color:#ffffff}
.cw .btn-2{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;padding:0 20px;border:2px solid #201e1d;background:transparent;color:#201e1d;font-family:inherit;font-size:17px;font-weight:700;text-decoration:none}
.cw .btn-w{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;padding:0 20px;border:2px solid #ffffff;background:transparent;color:#ffffff;font-family:inherit;font-size:17px;font-weight:700;text-decoration:none}
.cw .btn-ink{display:flex;align-items:center;justify-content:center;width:100%;min-height:56px;padding:0 24px;border:0;background:#201e1d;color:#ffffff;font-family:inherit;font-size:18px;font-weight:800;text-decoration:none}
.cw .lnk{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:700;font-size:17px}
.cw .ink .lnk,.cw .red .lnk{color:#ffffff}
.chev{flex-shrink:0}

/* alert cards and product panels */
.al{background:#ffffff;color:#201e1d;border-top:4px solid #ae1800;padding:16px 16px 18px;display:flex;flex-direction:column;gap:6px}
.al-2{margin:0 12px;padding:12px 16px;border-top-color:#605d5d;opacity:.92}
.al-3{margin:0 24px;padding:10px 16px;border-top-color:#605d5d;opacity:.8}
.tag{display:inline-flex;align-self:flex-start;align-items:center;font-size:11px;line-height:1;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:5px 8px}
.t-soon{color:#ae1800;background:#fff2ef}
.t-worth{color:#201e1d;background:#eae9e9}
.t-good{color:#605d5d;background:#f3f2f2;border:1px solid #bab6b6}
.t-ill{color:#bab6b6;border:1px solid #605d5d}
.t-ill-l{color:#605d5d;border:1px solid #9b9797}
.pan{background:#ffffff;color:#201e1d;border:2px solid #201e1d;display:flex;flex-direction:column}
.pan-h{padding:10px 14px;border-bottom:2px solid #201e1d;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;display:flex;justify-content:space-between;gap:8px}
.pan-b{padding:14px;display:flex;flex-direction:column;gap:10px}
.row{display:flex;flex-direction:column;gap:4px;padding:10px 0;border-top:2px solid #eae9e9}
.row:first-child{border-top:0;padding-top:0}

/* horizontal swipe row on a phone */
.snap{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -20px;padding:0 20px 4px;scroll-padding-inline:20px;scrollbar-width:none}
.snap>*{flex:0 0 86%;scroll-snap-align:start}

/* timeline */
.tl{display:flex;flex-direction:column;gap:10px;padding:18px 16px;background:#ffffff;border:2px solid #201e1d}
.tl-r{display:flex;align-items:center;gap:8px}
.tl-p{display:flex;flex-direction:column;flex-shrink:0}
.tl-d{font-size:15px;font-weight:800;line-height:1.2}
.tl-l{flex-grow:1;height:0;border-top:2px dashed #9b9797}
.tl-s{flex-grow:0;width:28px;height:0;border-top:2px solid #dd2b0f}

/* wall of sources */
.big{font-size:132px;line-height:.82;font-weight:900;letter-spacing:-.06em}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;min-height:32px;padding:4px 10px;border:2px solid #605d5d;font-size:14px;line-height:1.25;font-weight:600}
.cw a.chip{color:#201e1d;text-decoration:none;border-color:#201e1d;min-height:44px;font-weight:700}

/* moments, steps, who */
.mo{background:#eae9e9;padding:20px;display:flex;flex-direction:column;gap:10px;border-top:4px solid #201e1d}
.mo-t{font-size:26px;line-height:1.05;font-weight:900;letter-spacing:-.02em}
.step{display:grid;grid-template-columns:52px minmax(0,1fr);gap:0 8px;padding:16px 0;border-top:2px solid #9b9797}
.step-n{font-size:44px;line-height:.9;font-weight:900;letter-spacing:-.04em}
.cw .who a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0;border-top:2px solid #9b9797;color:#201e1d;text-decoration:none}
.cw .who a:hover{color:#ae1800}
.price{font-size:96px;line-height:.85;font-weight:900;letter-spacing:-.05em}
.tick{display:grid;grid-template-columns:24px minmax(0,1fr);gap:0 10px;align-items:start}
.never{display:grid;grid-template-columns:24px minmax(0,1fr);gap:0 10px;align-items:start;padding:14px 0;border-top:2px solid #605d5d;font-size:19px;font-weight:700;line-height:1.3}

/* source rows */
.src{border-top:2px solid #d7d3d3}
.src summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;padding:8px 0;cursor:pointer;list-style:none;font-weight:700}
.src summary::-webkit-details-marker{display:none}
.src-b{display:flex;flex-direction:column;gap:10px;padding:0 0 16px}
.cov{flex-shrink:0;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#605d5d;border:1px solid #9b9797;padding:4px 6px;line-height:1}
.cls{display:flex;flex-direction:column;gap:12px;padding:32px 0 0;border-top:4px solid #201e1d}

/* pricing */
.seg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:2px solid #201e1d}
.seg3{grid-template-columns:repeat(3,minmax(0,1fr))}
.seg button{min-height:48px;border:0;border-right:2px solid #201e1d;background:transparent;font-family:inherit;font-size:15px;font-weight:700;color:#201e1d;cursor:pointer;padding:6px 4px;line-height:1.15}
.seg button:last-child{border-right:0}
.seg .on{background:#201e1d;color:#ffffff}
.plan{border:2px solid #9b9797;padding:20px;display:flex;flex-direction:column;gap:12px;background:#f3f2f2}
.plan-on{border:4px solid #201e1d;background:#ffffff;padding:18px}
.plan-p{font-size:64px;line-height:.9;font-weight:900;letter-spacing:-.04em}
.qa{border-top:2px solid #9b9797;padding:16px 0;display:flex;flex-direction:column;gap:6px}

/* forms */
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:15px;font-weight:700}
.inp{width:100%;min-height:52px;padding:12px;border:2px solid #201e1d;background:#ffffff;font-family:inherit;font-size:17px;color:#201e1d;border-radius:0}
.chk{display:grid;grid-template-columns:24px minmax(0,1fr);gap:0 10px;align-items:start;font-size:15px}
.chk input{width:22px;height:22px;margin:2px 0 0;accent-color:#201e1d}

/* desktop (from the 1280 board): 900px and up */
@media (min-width:900px){
  .hd{padding:16px 80px}
  .nav{display:flex;align-items:center;gap:4px}
  .hd-m{display:none}
  .sec{padding:104px 80px}
  .sec-t{padding:72px 80px}
  .ft{padding:72px 80px 80px}
  .h-hero{font-size:76px}
  .h-page{font-size:68px}
  .h2{font-size:46px}
  .h3{font-size:24px}
  .lead{font-size:22px}
  .punch{font-size:56px}
  .big{font-size:240px}
  .price{font-size:168px}
  .wrap{gap:28px}
  .cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;align-items:center}
  .cols-t{align-items:start}
  .snap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;overflow:visible;margin:0;padding:0}
  .g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
  .g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
  .g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px}
  .step{grid-template-columns:minmax(0,1fr);gap:12px;padding:20px 0 0;border-top:4px solid #201e1d}
  .step-n{font-size:72px}
  .cw .btn,.cw .btn-2,.cw .btn-w{width:auto;min-width:260px}
  .ft-g{grid-template-columns:repeat(4,minmax(0,1fr))}
  .mw{max-width:720px}
  .tl{padding:28px}
  .tl-d{font-size:18px}
  .mo-t{font-size:32px}
}

/* Site layer on top of the approved screen styles (screens.css). Tokens: marketing/Catchwind design system. */
@font-face{font-family:'Archivo';src:url('/assets/archivo-var.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Archivo Fallback';src:local('Arial');size-adjust:104%;ascent-override:88%;descent-override:21%;line-gap-override:0%}
:root{--paper:#f3f2f2;--ink:#201e1d;--surface:#eae9e9;--red:#dd2b0f;--red-text:#ae1800;--ember:#e15b47;--hot:#ff563c;--grey:#605d5d;--rule:#9b9797}
html{-webkit-text-size-adjust:100%;scroll-padding-top:80px}
body.cw{margin:0;min-height:100vh;font-family:'Archivo','Archivo Fallback',system-ui,sans-serif}
@view-transition{navigation:auto}

/* accessibility */
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:12px 16px;font-weight:700}
.skip:focus{top:12px;color:#fff}
.cw :focus-visible{outline:3px solid var(--red);outline-offset:3px}
.cw .ink :focus-visible,.cw .red :focus-visible,.cw .ft :focus-visible{outline-color:#fff}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.sr-in{position:absolute;opacity:0;width:1px;height:1px;margin:0}

/* small utilities used by the templates */
.n{font-weight:400}.b{font-weight:700}.u{text-decoration:underline}.db{display:block}.center{text-align:center}
.strike{text-decoration:line-through}.self-start{align-self:flex-start}
.hot{color:var(--hot)}.hot-ink{color:var(--red-text)}.red-t{color:var(--red-text)}
.mw{max-width:720px}.mw900{max-width:900px}
.pt0{padding-top:0!important}.pt24{padding-top:24px!important}.pt36{padding-top:36px!important}.pb8{padding-bottom:8px}
.cw a.on-ink{color:#fff;font-weight:700}
.on-ink-meta{color:#bab6b6}
.cta-row{display:flex;flex-direction:column;align-items:stretch;gap:12px}
.ruled{padding-top:32px;border-top:2px solid var(--rule)}
.quiet{padding-top:28px;border-top:2px solid var(--rule)}
.close{align-items:flex-start}

/* header */
.hd{position:sticky;top:0;z-index:20}
.logo{display:flex;align-items:center;min-height:44px}
.hd-start{display:none}
.cw .btn-sm{min-height:44px;font-size:16px;padding:0 18px;width:auto}
.hd-signin{display:inline-flex}
.hd-m{cursor:pointer}

/* phone menu (popover) */
.menu{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:var(--paper);color:var(--ink);overflow:auto}
.menu::backdrop{background:rgba(32,30,29,.4)}
.menu-in{display:flex;flex-direction:column;gap:16px;padding:12px 20px 32px;min-height:100%}
.menu-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;border-bottom:2px solid var(--rule)}
.menu nav{display:flex;flex-direction:column}
.cw .menu-a{display:flex;align-items:center;min-height:52px;font-size:22px;font-weight:800;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--surface)}
.cw .menu-sub{font-size:18px;font-weight:700;min-height:48px}
.menu-e{padding-top:20px}
.menu-cta{margin-top:auto;padding-top:16px}

/* sticky Start bar (phone): shown by site.js once the hero button scrolls away */
.sticky{position:fixed;left:0;right:0;bottom:0;z-index:15;display:flex;flex-direction:column;gap:4px;padding:10px 20px calc(10px + env(safe-area-inset-bottom));background:var(--ink);border-top:2px solid var(--ink)}
.sticky[hidden]{display:none}
.sticky-s{color:#bab6b6;font-size:13px;text-align:center}

/* hero cards */
.hero-cards{padding-top:8px}
.al-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.al-fact{font-size:19px;line-height:1.4}
.al-ink{border-top-color:var(--ink)}
.al-grey{border-top-color:var(--rule)}
.pan-rows{gap:0}
.pan-tall{min-height:190px}
.fake-search{border:2px solid var(--ink);padding:8px 10px;font-size:14px;color:var(--grey);margin-bottom:10px}
.row-x{flex-direction:row;justify-content:space-between}

/* wall, counts, price */
.chips{list-style:none;margin:0;padding:0}
.count-row{display:flex;align-items:flex-end;gap:14px}
.count-row .h3{padding-bottom:4px}
.big{color:var(--hot)}
.cw .ink .big{color:var(--hot)}
.price-box{display:flex;align-items:flex-end;gap:16px}
.price-per{padding-bottom:12px}
.maths{font-size:112px}

/* moments and scenarios */
.mo-red{border-top-color:var(--red)}
.mo-w{background:#fff}

/* source rows */
.src-list .src:last-child{border-bottom:2px solid #d7d3d3}
.src summary span:first-child{padding-right:8px}
.src summary::after{content:'';flex-shrink:0;width:10px;height:10px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg);margin:0 4px 4px 0}
.src[open] summary::after{transform:rotate(225deg);margin:4px 4px 0 0}
.src summary .cov{margin-left:auto}

/* pricing: radios styled as the board's segmented buttons; the chosen plan lights up (no script) */
fieldset.seg{margin:0;padding:0;min-width:0}
.seg label{display:flex;align-items:center;justify-content:center;text-align:center;min-height:48px;border-right:2px solid var(--ink);font-size:15px;font-weight:700;cursor:pointer;padding:6px 4px;line-height:1.15}
.seg label:last-of-type{border-right:0}
.seg input:checked+label{background:var(--ink);color:#fff}
.seg input:focus-visible+label{outline:3px solid var(--red);outline-offset:3px}
.plans{display:flex;flex-direction:column;gap:12px}
.plan-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.plan-price{display:flex;align-items:flex-end;gap:10px}
.plan-price .small{padding-bottom:4px}
.py{display:none}
.pricing:has(#bill-y:checked) .pm{display:none}
.pricing:has(#bill-y:checked) .py{display:flex}
.pricing:has(#bill-y:checked) .plan-cta .py{display:flex}
.pricing:has(#plan-starter:checked) [data-plan=starter],
.pricing:has(#plan-practice:checked) [data-plan=practice],
.pricing:has(#plan-firm:checked) [data-plan=firm]{border:4px solid var(--ink);background:#fff;padding:18px}
@supports selector(:has(*)){
  .pricing:has(#plan-starter:checked) [data-plan]:not([data-plan=starter]) .plan-cta,
  .pricing:has(#plan-practice:checked) [data-plan]:not([data-plan=practice]) .plan-cta,
  .pricing:has(#plan-firm:checked) [data-plan]:not([data-plan=firm]) .plan-cta{display:none}
}

/* forms */
.ask{max-width:640px}
.cw .inp{font-size:17px}
select.inp{appearance:auto}
.inp:user-invalid{border-color:var(--red-text)}
.err{color:var(--red-text);font-size:14px;font-weight:700}
.form-msg:empty{display:none}
.form-msg{font-weight:700}
.form-msg.bad{color:var(--red-text)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cw button[disabled]{opacity:.5;cursor:default}

/* plain pages and legal text */
.prose h2{font-size:26px;line-height:1.15;font-weight:800;margin-top:12px}
.prose h3{font-size:20px;font-weight:800;margin-top:8px}
.prose p,.prose li{max-width:68ch}
.prose ul,.prose ol{list-style:revert;padding-left:22px;display:flex;flex-direction:column;gap:6px}
.prose table{border-collapse:collapse;width:100%}
.prose th,.prose td{border:1px solid var(--rule);padding:8px;text-align:left;vertical-align:top;font-size:15px}
.tbl{overflow-x:auto}
.att{display:flex;flex-direction:column;gap:14px;list-style:none;padding:0}
.att li{padding-top:12px;border-top:2px solid var(--surface)}
.att .cov{margin-left:8px;vertical-align:middle}
.ft-legal a{color:#fff}

/* two-up from 640px */
@media (min-width:640px){
  .cta-row{flex-direction:row;align-items:center;gap:24px}
  .cw .cta-row .btn,.cw .cta-row .btn-2{width:auto;min-width:240px}
  .plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* fluid type between the phone and desktop boards */
@media (min-width:640px) and (max-width:899px){
  .h-hero{font-size:clamp(42px,6.4vw,58px)}.h-page{font-size:clamp(40px,6vw,54px)}.h2{font-size:clamp(30px,4.6vw,38px)}
  .sec{padding:72px clamp(20px,5vw,48px)}.hd{padding:12px clamp(20px,5vw,48px)}
}
@media (min-width:900px){
  .hd-start{display:inline-flex}
  .hd-signin{display:none}
  .hd .nav .hd-a{white-space:nowrap}
  .sticky{display:none!important}
  .hero-cards{padding-left:40px}
  .hero-cards .al-1{padding:24px 24px 26px;gap:8px}
  .hero-cards .al-2{margin:0 20px;padding:16px 24px}
  .hero-cards .al-3{margin:0 40px;padding:14px 24px}
  .wall-cols{grid-template-columns:420px minmax(0,1fr)}
  .price-box{justify-content:flex-end}
  .g3-lg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
  .g2-lg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 48px}
  .g5-lg{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
  .maths{font-size:200px}
  .mo{padding:28px}
  .hero-sm{padding-top:88px;padding-bottom:88px}
}
@media (max-width:899px){
  .hero-sm{padding-top:44px;padding-bottom:44px}
  .has-sticky{padding-bottom:84px}
}

/* motion: only when the reader allows it; nothing the reader needs moves */
@media (prefers-reduced-motion:no-preference){
  .hero-cards .al{animation:cw-in .5s cubic-bezier(.2,.7,.2,1) both}
  .hero-cards .al-2{animation-delay:.35s}
  .hero-cards .al-3{animation-delay:.6s}
  @keyframes cw-in{from{opacity:0;transform:translateY(16px)}}
}
@media (forced-colors:active){
  .seg input:checked+label{outline:3px solid CanvasText}
  .tag,.chip,.cov{border:1px solid CanvasText}
}
@media print{.hd,.menu,.sticky,.ft nav{display:none}}

/* narrow text inside the page rail: keep the rail's left edge, narrow only the children */
.wrap.mw,.wrap.mw900{max-width:1120px}
.wrap.mw>*{max-width:720px}
.wrap.mw900>*{max-width:900px}

/* footer small print on ink: same light grey as other ink sections (contrast 8:1) */
.ft .meta{color:#bab6b6}
.snap:focus-visible{outline-offset:6px}
.hero-cards .al-2,.hero-cards .al-3{opacity:1}
