/* ShipperAG site styles. Design system v3, 4 October 2026 (docs/seo/WEBSITE_REDESIGN_PLAN.md §8):
   light first with dark bands, the app's own light and dark values, one type and spacing scale.
   One file for every page, the homepage included. Replaces the layered v1–v2.1 sheet. */
@font-face{font-family:"Barlow";src:url("/fonts/Barlow-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow";src:url("/fonts/Barlow-SemiBold.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow";src:url("/fonts/Barlow-Bold.woff2") format("woff2");font-weight:700;font-display:swap}
/* A fallback sized to Barlow's widths (measured 4 Oct 2026: Barlow is 0.960 of Arial at 400, 0.910 at 600,
   0.920 at 700), so text wraps the same before and after the web font arrives and the page does not shift. */
@font-face{font-family:"Barlow Fallback";src:local("Arial"),local("ArialMT");font-weight:400;size-adjust:96%}
@font-face{font-family:"Barlow Fallback";src:local("Arial Bold"),local("Arial-BoldMT");font-weight:600;size-adjust:91%}
@font-face{font-family:"Barlow Fallback";src:local("Arial Bold"),local("Arial-BoldMT");font-weight:700;size-adjust:92%}
@font-face{font-family:"JetBrains Mono";src:url("/fonts/JetBrainsMono-Variable.woff2") format("woff2");font-weight:100 800;font-display:swap}

:root{
  /* Surfaces and lines (app v2 light theme) */
  --bg:#FFFFFF; --tint:#F4F6FA; --raised:#FFFFFF; --inset:#EDF1F7;
  --line:#DDE3EE; --line-strong:#C6D0E0; --line-ctl:#7B889E;
  /* Text */
  --ink:#112A46; --text:#3E4F68; --muted:#56657D;
  /* Brand: #2458D3 for text and buttons on light, #4C7DFF for graphics only */
  --primary:#2458D3; --primary-h:#1D47B0; --brand:#4C7DFF; --accent-soft:#EAF0FD;
  /* Evidence states on light */
  --pass:#1D6746; --warn:#805500; --fail:#A52E36; --nc:#56657D;
  --pass-bg:#E8F0EC; --warn-bg:#F2EEE6; --fail-bg:#F6EAEB; --nc-bg:#EDF1F7;
  /* Dark bands (app v2 dark surface) */
  --night:#0E1527; --night-2:#151F38; --night-line:rgba(180,192,216,.18);
  --night-ink:#EDF2FC; --night-text:#B4C0D8; --night-accent:#9DB7FF;
  --pass-d:#3DDC97; --warn-d:#FFB84D; --fail-d:#FF7A86; --nc-d:#8FA2C8;
  /* Names older page styles still use */
  --white:var(--ink); --accent:var(--primary); --accent-solid:var(--primary); --accent-hover:var(--primary-h);
  --panel:var(--raised); --panel-solid:var(--raised); --deep:var(--tint); --void:var(--bg);
  --cyan:var(--primary); --blue:var(--brand); --violet:var(--brand);
  /* Type, shape, depth */
  --sans:"Barlow","Barlow Fallback",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; --display:var(--sans);
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --r-control:8px; --r-card:12px; --r-panel:16px;
  --shadow-card:0 1px 2px rgba(17,42,70,.05),0 6px 20px rgba(17,42,70,.06);
  --shadow-frame:0 1px 2px rgba(17,42,70,.06),0 18px 48px -12px rgba(17,42,70,.22);
  --gutter:20px; --content:1180px;
}
@media (min-width:768px){:root{--gutter:32px}}

/* Base */
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:400 17px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg,video{max-width:100%;height:auto}
figure{margin:0}
a{color:var(--primary);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{color:var(--primary-h)}
::selection{background:#CCDAFA;color:var(--ink)}
:focus-visible{outline:2px solid var(--primary);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:12px;top:-60px;z-index:60;background:var(--ink);color:#fff;padding:10px 16px;border-radius:var(--r-control);text-decoration:none;font-weight:600}
.skip:focus{top:12px;color:#fff}
.wrap{width:100%;max-width:calc(var(--content) + 2 * var(--gutter));margin-inline:auto;padding-inline:var(--gutter);position:relative}
section[id],[id].team,main [id]:target{scroll-margin-top:80px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.aurora,.gridfloor{display:none!important}

/* Type */
h1,h2,h3,h4{font-family:var(--sans);color:var(--ink);text-wrap:balance;margin:0}
h1{font-weight:700;font-size:clamp(34px,4.2vw,52px);line-height:1.08;letter-spacing:-.028em;max-width:24ch}
h2{font-weight:700;font-size:clamp(28px,3vw,40px);line-height:1.15;letter-spacing:-.025em}
h3{font-weight:600;font-size:20px;line-height:1.3;letter-spacing:-.016em}
p{margin:0 0 16px}
.lede{font-size:clamp(18px,1.6vw,20px);line-height:1.55;color:var(--text);max-width:60ch}
.grad{color:var(--primary)}
.kicker,.eyebrow{display:inline-flex;align-items:center;gap:8px;font:600 13px/1.3 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--primary)}
.eyebrow{align-items:flex-start}
.eyebrow .dot{flex:none;width:7px;height:7px;margin-top:calc(.65em - 3.5px);border-radius:50%;background:var(--brand)}
.meta{font-size:14px;color:var(--muted);margin:0}
.mono{font-family:var(--mono)}
.divider{height:1px;background:var(--line)}

/* Free-trial bar and navigation */
.trial-bar{position:relative;z-index:31;color:#fff;font-size:15px;background:radial-gradient(60% 180% at 85% 50%,rgba(255,255,255,.14),transparent 60%),linear-gradient(90deg,#1D47B0,#2458D3 55%,#2F5FDC);box-shadow:inset 0 -1px 0 rgba(255,255,255,.12)}
.trial-bar .wrap{padding-block:9px}
.trial-bar p{display:flex;align-items:center;justify-content:center;gap:10px 14px;margin:0;line-height:1.35}
.tb-pill{flex:none;display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.16);box-shadow:inset 0 0 0 1px rgba(255,255,255,.38);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.tb-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:#9FF0C9;box-shadow:0 0 0 3px rgba(159,240,201,.25)}
.tb-text{min-width:0;color:#EAF0FD}
.tb-cta{flex:none;display:inline-flex;align-items:center;min-height:32px;padding:0 14px;border-radius:999px;background:#fff;color:#1D47B0;font-weight:700;font-size:14px;text-decoration:none;white-space:nowrap;box-shadow:0 2px 8px rgba(9,20,50,.25);transition:background-color .15s,transform .15s}
.tb-cta:hover{background:#EAF0FD;color:#1D47B0}
.trial-bar :focus-visible{outline-color:#fff}
@media (max-width:1180px){.tb-long{display:none}}
@media (max-width:560px){.trial-bar{font-size:14px}.trial-bar .wrap{padding-block:8px}.tb-text{display:none}.trial-bar p{justify-content:space-between}.tb-pill{font-size:12px;padding:5px 10px}}
header.nav{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.97);-webkit-backdrop-filter:saturate(1.6) blur(12px);backdrop-filter:saturate(1.6) blur(12px);border-bottom:1px solid var(--line)}
header.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px}
.brand{display:inline-flex;align-items:center;gap:10px;font:700 21px/1 var(--sans);letter-spacing:-.01em;color:var(--ink);text-decoration:none;min-height:44px}
.brand:hover{color:var(--ink)}
.brand .mk{width:28px;height:28px}
.brand b{color:var(--primary);font-weight:700}
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a{color:var(--text);font-weight:500;font-size:15.5px;text-decoration:none}
.nav-links a:hover{color:var(--ink)}
.nav-links a.btn,.nav-links a.btn:hover{color:#fff}
@media (max-width:820px){.nav-links a:not(.btn){display:none}}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border:1px solid transparent;border-radius:var(--r-control);background:var(--primary);color:#fff;font:600 16px/1.1 var(--sans);text-align:center;text-decoration:none;cursor:pointer;box-shadow:0 1px 2px rgba(17,42,70,.14);transition:background-color .15s,border-color .15s,color .15s,box-shadow .15s}
.btn:hover{background:var(--primary-h);color:#fff}
a.btn,a.btn:link,a.btn:visited,a.btn:hover{color:#fff}
.btn.small{min-height:40px;padding:0 16px;font-size:14.5px}
@media (max-width:700px){.btn.small{min-height:44px}}
.btn.ghost,a.btn.ghost,a.btn.ghost:visited{background:#fff;color:var(--ink);border-color:var(--line-ctl);box-shadow:none}
.btn.ghost:hover,a.btn.ghost:hover{background:var(--tint);color:var(--ink)}
.btn[disabled]{opacity:.7;cursor:progress}
.link-arrow{display:inline-block;padding-block:5px;font-weight:600;text-decoration:none}
.link-arrow::after{content:" \2192"}
.link-arrow:hover{text-decoration:underline}

/* Page header (guides, comparisons, research, company pages) */
.page-hero{position:relative;isolation:isolate;padding-block:44px 40px}
.page-hero::before{content:"";position:absolute;z-index:-1;inset:0 calc(50% - 50vw);background:linear-gradient(180deg,var(--tint),var(--bg))}
.crumbs{font-size:14px;color:var(--muted);margin:0 0 22px}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.crumbs li+li::before{content:"/";margin-right:6px;color:#9AA6BA}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--primary);text-decoration:underline}
.page-hero h1{margin-top:14px;max-width:30ch}
.page-hero h1+.lede{margin-top:20px}
.page-hero .lede{margin-bottom:0}
.page-hero .meta{margin-top:18px}
.page-hero .hero-ctas{margin-top:26px}

@media (min-width:1000px){.page-hero.split{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:64px;align-items:end}}
.hero-aside{margin-top:28px;background:#fff;border:1px solid var(--line);border-radius:var(--r-panel);padding:22px 24px;box-shadow:var(--shadow-card)}
@media (min-width:1000px){.hero-aside{margin-top:0}}
.hero-aside-title{margin:0;font-weight:700;font-size:18px;color:var(--ink)}
.hero-aside .ticks{display:grid;gap:9px;margin-top:14px;font-size:15.5px}

/* Article layout: article on the left, contents on the right */
.layout{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;padding-block:48px 16px}
@media (min-width:1040px){.layout{grid-template-columns:minmax(0,740px) 280px;justify-content:space-between}}
.layout>*{min-width:0}
.prose{font-size:18px;line-height:1.7;color:var(--text)}
.prose>p,.prose>ul,.prose>ol,.prose>dl,.prose .src{max-width:68ch}
.prose>ul[class],.prose>ol[class],.prose>dl[class]{max-width:none}
.prose h2{font-size:clamp(26px,2.5vw,32px);line-height:1.2;margin:56px 0 0;max-width:30ch;scroll-margin-top:96px}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:20px;margin:36px 0 0;max-width:40ch;scroll-margin-top:96px}
.prose h2+*{margin-top:16px}
.prose h3+*{margin-top:10px}
.prose p{margin:0 0 18px}
.prose ul,.prose ol{margin:0 0 22px;padding-left:24px}
.prose li{margin:0 0 9px}
.prose li::marker{color:var(--muted)}
.prose ol>li::marker{color:var(--primary);font-weight:600}
.prose strong{color:var(--ink);font-weight:600}
.prose code{font:15px var(--mono);background:var(--inset);border-radius:4px;padding:1px 5px}
.prose blockquote{margin:24px 0;padding:4px 0 4px 20px;border-left:3px solid var(--line-strong);color:var(--ink)}
.prose .kicker{margin-bottom:6px}
.src{font-size:15px;line-height:1.55;color:var(--muted)}
.callout{margin:28px 0;padding:18px 22px;background:var(--tint);border:1px solid var(--line);border-left:3px solid var(--primary);border-radius:0 var(--r-card) var(--r-card) 0}
.callout p{max-width:68ch}
.callout p:last-child{margin-bottom:0}
.callout .wl-inline{margin-top:6px}
.callout .form-note{margin-top:4px}

/* Tables */
.table-wrap{margin:28px 0;overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-card);background:#fff}
table{border-collapse:collapse;width:100%;min-width:620px;font-size:15.5px;line-height:1.5}
caption{text-align:left;padding:14px 16px 0;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
th,td{text-align:left;vertical-align:top;padding:13px 16px;border-bottom:1px solid var(--line)}
thead th{background:var(--tint);font-size:14.5px;font-weight:600;color:var(--ink)}
tbody th{color:var(--ink);font-weight:600}
tbody tr:last-child>*{border-bottom:0}
@media (max-width:700px){
  .table-wrap{overflow-x:visible;border:0;background:none;padding:0}
  .table-wrap table{min-width:0}
  .table-wrap table,.table-wrap tbody,.table-wrap tr,.table-wrap tbody th,.table-wrap td{display:block;width:auto}
  .table-wrap thead{display:none}
  .table-wrap caption{padding:0 0 12px}
  .table-wrap tr{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:16px 18px;margin-bottom:12px}
  .table-wrap tr:last-child{margin-bottom:0}
  .table-wrap tbody th[scope=row]{padding:0 0 12px;border:0;font-size:16.5px;line-height:1.3;background:none}
  .table-wrap td{padding:0 0 12px;border:0;font-size:15.5px;line-height:1.55}
  .table-wrap tr>*:last-child{padding-bottom:0}
  .table-wrap td::before{content:attr(data-col);display:block;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
  .table-wrap th a,.table-wrap td a{display:inline-block;padding-block:6px}
}

/* Evidence states */
.states{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:24px 0 28px;padding:0;list-style:none}
.prose .states{padding-left:0}
.prose .states li::marker{content:none}
.state{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:16px 18px;margin:0}
.state .pill,.pill{display:inline-flex;align-items:center;gap:7px;font:600 13px/1 var(--sans);letter-spacing:.01em;color:var(--c,var(--nc));background:var(--cb,var(--nc-bg));padding:6px 10px;border-radius:999px;white-space:nowrap}
.state .pill::before,.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.state p{margin:10px 0 0;font-size:15.5px;line-height:1.5}
.s-pass{--c:var(--pass);--cb:var(--pass-bg)}.s-fail{--c:var(--fail);--cb:var(--fail-bg)}
.s-ask{--c:var(--warn);--cb:var(--warn-bg)}.s-nc{--c:var(--nc);--cb:var(--nc-bg)}

/* Specialist groups */
.groups{display:grid;gap:12px;margin:20px 0 28px}
@media (min-width:760px){.groups{display:block;columns:2;column-gap:12px}.groups>.group{break-inside:avoid;margin:0 0 12px}}
.group{background:#fff;border:1px solid var(--line);border-top:3px solid var(--g);border-radius:var(--r-card);padding:18px 20px}
.group h3{margin:0 0 10px}
.group h3 span{font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--muted);margin-left:8px}
.group dl{margin:0;display:grid;gap:2px}
.group dt{font-weight:600;color:var(--ink)}
.group dd{margin:0 0 10px;font-size:16px;line-height:1.5}
.g-biz{--g:#0A7FA0}.g-exp{--g:#6B4FD8}.g-eng{--g:#2458D3}.g-trust{--g:#1D7A52}.g-ops{--g:#9A6700}

/* Contents card */
.aside{align-self:start}
@media (min-width:1040px){.aside{position:sticky;top:88px}}
.toc{background:var(--tint);border:1px solid var(--line);border-radius:var(--r-card);padding:18px 20px}
.toc h2{font:600 13px/1.3 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.toc ol{margin:0;padding-left:18px;font-size:15px;line-height:1.45}
.toc li{margin:0 0 8px}
.toc li::marker{color:var(--muted)}
.toc a{color:var(--text);text-decoration:none}
.toc a:hover{color:var(--primary);text-decoration:underline}
.toc .btn{margin-top:12px;width:100%}
@media (max-width:700px){.toc li{margin-bottom:2px}.toc a{display:inline-block;padding-block:7px}}

/* FAQ: heading across the top, questions in two columns on wide screens */
.faq-block{padding-block:56px 16px}
.faq-block h2{margin-top:10px}
.faq{margin-top:24px;display:grid;grid-template-columns:minmax(0,1fr);column-gap:56px;align-items:start}
@media (min-width:960px){.faq{grid-template-columns:repeat(2,minmax(0,1fr))}}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:18px 0;font:600 17px/1.4 var(--sans);letter-spacing:-.01em;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:10px;height:10px;margin-top:6px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .16s}
.faq details[open] summary::after{transform:rotate(225deg);margin-top:10px}
.faq summary:hover{color:var(--primary)}
.faq details p{margin:0 0 20px;font-size:16px;line-height:1.65;max-width:62ch}
.faq-col{display:grid;align-content:start}
.faq-col details:first-child{border-top:1px solid var(--line)}
@media (min-width:960px){.faq>details:nth-child(-n+2){border-top:1px solid var(--line)}}
@media (max-width:959px){.faq>details:first-child{border-top:1px solid var(--line)}.faq-col+.faq-col details:first-child{border-top:0}}

/* Related links */
.related{padding-block:48px 8px}
.related h2{margin-top:10px;font-size:clamp(24px,2.4vw,30px)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;list-style:none;margin:24px 0 0;padding:0}
.cards a{display:flex;flex-direction:column;gap:6px;height:100%;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:18px 20px;color:var(--text);text-decoration:none;transition:border-color .15s,box-shadow .15s}
.cards a:hover{border-color:#B7C4DA;box-shadow:var(--shadow-card);color:var(--text)}
.cards b{color:var(--ink);font-weight:600;font-size:17px;line-height:1.3;letter-spacing:-.01em}
.cards span{font-size:15px;line-height:1.5;color:var(--muted)}

/* Closing call to action: a dark band, offer on the left and the form on the right */
.cta{position:relative;margin-block:40px 64px;padding:clamp(28px,4vw,48px);background:var(--night);color:var(--night-text);border-radius:var(--r-panel);overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr);column-gap:56px;align-items:start}
.cta::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 90% at 100% 0%,rgba(76,125,255,.22),transparent 70%);pointer-events:none}
.cta>*{position:relative}
@media (min-width:980px){
  .cta:has(>form){grid-template-columns:minmax(0,1fr) minmax(0,500px)}
  .cta:has(>form)>form{grid-column:2;grid-row:1 / span 4;align-self:end;margin:0}
  .cta:has(>form)>.form-note{grid-column:2;grid-row:5;margin-top:10px}
  .cta:has(>.trial-form)>form{grid-row:1 / span 5;align-self:center}
}
.cta>.kicker{color:var(--night-accent)}
.cta>h2{color:var(--night-ink);margin-top:10px;font-size:clamp(28px,3vw,38px);max-width:22ch}
.cta>h2 .grad{color:var(--night-accent)}
.cta>p{color:var(--night-text);max-width:56ch;margin:14px 0 0}
.cta>.perks{margin:18px 0 22px}
.cta>.perks li{color:var(--night-ink)}
.cta>.perks li::before{border-color:var(--pass-d)}
.cta>p a:not(.btn),.cta>.form-note a{color:var(--night-accent)}
.cta>p a:not(.btn):hover,.cta>.form-note a:hover{color:#fff}
.cta .row{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.cta .btn.ghost{background:transparent;color:#fff;border-color:rgba(237,242,252,.45)}
.cta .btn.ghost:hover{background:rgba(255,255,255,.08)}
.cta>.form-note{color:var(--night-text)}
.cta .wl-inline .wl-status.ok{color:var(--pass-d)}.cta .wl-inline .wl-status.err{color:var(--fail-d)}
.cta .wl-inline .wl-share{border-top-color:var(--night-line)!important}
.cta .wl-inline .wl-share p{color:var(--night-ink)}
.cta :focus-visible{outline-color:var(--night-accent)}
.cta .trial-form :focus-visible{outline-color:var(--primary)}

/* Forms */
.wl-inline{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 10px;max-width:760px}
.wl-inline input[type=email]{flex:1 1 240px}
.wl-inline select{flex:1 1 150px}
.wl-inline .btn{flex:0 0 auto}
.wl-inline input,.wl-inline select,.field input,.field select,.field textarea,.chk-form input{min-height:48px;font:16px/1.3 var(--sans);color:var(--ink);background:#fff;border:1px solid var(--line-ctl);border-radius:var(--r-control);padding:11px 14px;transition:border-color .15s,box-shadow .15s}
.wl-inline input::placeholder,.field input::placeholder,.field textarea::placeholder,.chk-form input::placeholder{color:#6B7890}
.wl-inline input:focus,.wl-inline select:focus,.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(36,88,211,.2);outline:none}
.wl-inline select,.field select{-webkit-appearance:none;appearance:none;padding-right:38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2356657D' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.wl-inline select:has(option[value=""]:checked){color:var(--muted)}
.wl-inline select option{color:var(--ink)}
[aria-invalid=true]{border-color:var(--fail)!important}
.wl-status{flex-basis:100%;min-height:22px;margin:2px 0 0;font-weight:600;font-size:15px;line-height:1.45}
.wl-status.ok{color:var(--pass)}.wl-status.err{color:var(--fail)}
.wl-status:empty{min-height:0;margin:0}
.trial-form .wl-status:empty{margin:0}
.form-note{font-size:13.5px;line-height:1.55;color:var(--muted);margin:6px 0 0}
.wl-share{flex-basis:100%;margin-top:10px;padding-top:12px;border-top:1px solid var(--line)}
.wl-share p{margin:0 0 6px;font-size:14.5px}
.wl-share-title{font-weight:700}
.wl-share-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.wl-share-status{min-height:18px;margin:8px 0 0;font-weight:600;font-size:14px;color:var(--pass)}
.perks,.ticks{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px;font-size:15.5px}
.perks li,.ticks li,.plan li{position:relative;padding-left:22px}
.perks li::before,.ticks li::before,.plan li::before{content:"";position:absolute;left:2px;top:.45em;width:11px;height:6px;border-left:2px solid var(--pass);border-bottom:2px solid var(--pass);transform:rotate(-45deg)}

/* The full trial form (homepage #join, /pricing/#trial): a light panel, usually on a dark band */
.trial-form{background:#fff;color:var(--text);border-radius:var(--r-panel);padding:28px;box-shadow:0 30px 80px -30px rgba(0,0,0,.65)}
.trial-form h3{font-size:22px;margin:0 0 18px;color:var(--ink)}
.trial-form h3:focus{outline:none}
.trial-form :focus-visible{outline-color:var(--primary)}
.field{display:grid;gap:6px;margin:0 0 14px}
.field label{font-weight:600;font-size:15px;color:var(--ink)}
.field label span{font-weight:400;color:var(--muted)}
.field input,.field select,.field textarea{width:100%}
.field textarea{min-height:92px;resize:vertical;line-height:1.5}
.field-row{display:grid;grid-template-columns:minmax(0,1fr);gap:0 14px}
@media (min-width:560px){.field-row{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}}
.field-note{margin:-4px 0 14px;font-size:13.5px;line-height:1.5;color:var(--muted)}
.wl-more{margin:0 0 16px}
.wl-more summary{cursor:pointer;display:inline-block;padding:6px 0;font-weight:600;font-size:15px;color:var(--primary)}
.wl-more[open] summary{margin-bottom:8px}
.trial-form .btn{width:100%;min-height:52px;font-size:17px}
.trial-form .wl-status{margin-top:12px}
.trial-form .form-note{margin-top:10px}
.trial-form .form-note a{color:var(--primary)}
.cta .trial-form{color:var(--text)}
.cta .trial-form .wl-status.ok{color:var(--pass)}.cta .trial-form .wl-status.err{color:var(--fail)}
.cta .trial-form .form-note{color:var(--muted)}

/* Footer */
footer{background:var(--night);color:var(--night-text);padding-block:56px 32px;font-size:15px;border-top:1px solid var(--night-line)}
.foot-grid{display:grid;grid-template-columns:1fr;gap:32px}
@media (min-width:640px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.foot-grid{grid-template-columns:1.4fr 1fr 1fr 1fr}}
footer .brand{color:#fff}
footer .brand b{color:var(--night-accent)}
.foot-brand p{margin:14px 0 18px;font-size:15px;line-height:1.55;max-width:40ch;color:var(--night-text)}
.foot-col h2{margin:0 0 14px;font:600 13px/1.3 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--night-ink)}
.foot-col ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.foot-col a{color:var(--night-text);text-decoration:none;font-size:15px}
.foot-col a:hover,.foot-col a:focus-visible{color:#fff;text-decoration:underline}
footer :focus-visible{outline-color:var(--night-accent)}
.foot-bottom{display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;margin-top:40px;padding-top:20px;border-top:1px solid var(--night-line)}
footer .mono{font-family:var(--sans);font-size:13.5px;letter-spacing:0;color:var(--night-text)}
footer .mono a{color:var(--night-text)}
footer .mono a:hover{color:#fff}
@media (max-width:700px){.foot-col ul{gap:2px}.foot-col a{display:inline-block;padding-block:7px}.foot-bottom a{display:inline-block;padding-block:6px}.crumbs a{display:inline-block;padding-block:6px}.prose li>a:only-child{display:inline-block;padding-block:6px}}

/* Pricing */
.plans-block{padding-block:48px 8px}
.plans-block>p{max-width:66ch}
.plans{list-style:none;margin:32px 0 0;padding:0;display:grid;gap:20px;grid-template-columns:1fr}
@media (min-width:700px){.plans{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.plans{grid-template-columns:repeat(4,1fr)}}
@media (min-width:900px){.plans.three{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:700px) and (max-width:899px){.plans.three{grid-template-columns:1fr}}
.plan{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:26px 24px 24px}
.plan.featured{border-color:var(--primary);box-shadow:0 0 0 1px var(--primary),var(--shadow-card)}
.plan-tag{position:absolute;top:-12px;left:22px;margin:0;font:600 12px/1.4 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--primary);border-radius:6px;padding:3px 9px}
.plan h3{margin:0;font-size:21px}
.plan .plan-for{margin:6px 0 0;font-size:15px;color:var(--muted)}
.plan .plan-price{margin:20px 0 0;font:700 44px/1 var(--sans);letter-spacing:-.03em;color:var(--ink)}
.plan .plan-price small{margin-left:6px;font-size:15px;font-weight:400;letter-spacing:0;color:var(--muted)}
.plan .plan-year{margin:8px 0 0;font-size:14px;color:var(--muted)}
.plan .plan-checks{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--line);font-weight:600;color:var(--ink)}
.plan ul{list-style:none;margin:12px 0 22px;padding:0;display:grid;gap:8px;font-size:15px}
.plan .plan-eg{margin:4px 0 0;font-size:14px;line-height:1.45;color:var(--muted)}
.rc-def{display:grid;gap:12px 40px;margin:24px 0 0;padding:20px 24px;background:var(--tint);border:1px solid var(--line);border-radius:var(--r-card)}
@media (min-width:960px){.rc-def{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"what counts" "ask counts";align-items:start}.rc-what{grid-area:what}.rc-counts{grid-area:counts}.rc-ask{grid-area:ask}}
.rc-what{margin:0;font-size:16px;line-height:1.6;color:var(--text)}
.rc-what b{color:var(--ink)}
.rc-counts{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:15px;line-height:1.45;color:var(--text)}
.rc-counts li{display:grid;grid-template-columns:118px minmax(0,1fr);gap:12px}
.rc-counts b{font-weight:600;color:var(--ink)}
.rc-ask{margin:0;font-size:14.5px;color:var(--muted)}
@media (max-width:640px){.rc-def{padding:16px 18px}.rc-counts li{grid-template-columns:minmax(0,1fr);gap:0}}
.plans-block>p.plans-note{max-width:none}
.plan .btn{margin-top:auto;width:100%}
.plans-note{margin:16px 0 0;font-size:14.5px;color:var(--muted)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px}
.trial-steps{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:16px;counter-reset:s}
@media (min-width:820px){.trial-steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
.trial-steps li{counter-increment:s;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:20px 22px;color:var(--text)}
.trial-steps li::before{content:counter(s);display:inline-grid;place-items:center;width:28px;height:28px;margin-bottom:12px;border-radius:50%;background:var(--accent-soft);color:var(--primary);font-weight:700;font-size:14px}
.trial-steps b{display:block;margin-bottom:4px;font-size:17px;color:var(--ink)}

/* Release readiness scorecard */
.scorecard{display:grid;gap:14px;margin:18px 0 8px}
.sc-q{border:1px solid var(--line);border-radius:var(--r-card);padding:14px 18px 16px;margin:0;background:#fff;min-width:0}
.sc-q legend{padding:0 6px;font-weight:600;font-size:16.5px;color:var(--ink)}
.sc-q p{margin:4px 0 10px}
.sc-n{font-family:var(--mono);font-size:12px;color:var(--muted);margin-right:4px}
.sc-crit{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--fail);background:var(--fail-bg);border-radius:999px;padding:2px 8px;margin-left:6px;white-space:nowrap}
.sc-opts{display:flex;flex-wrap:wrap;gap:9px}
.sc-opt{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line-ctl);border-radius:var(--r-control);padding:7px 14px;cursor:pointer;min-height:44px;font-size:15.5px;color:var(--text);background:#fff}
.sc-opt input{accent-color:var(--primary);width:16px;height:16px;margin:0}
.sc-opt:has(input:checked){border-color:var(--primary);background:var(--accent-soft);color:var(--ink)}
.sc-opt:has(input:focus-visible){box-shadow:0 0 0 3px rgba(36,88,211,.25)}
.sc-actions{display:flex;flex-wrap:wrap;gap:10px;margin:4px 0}
.sc-actions .btn{margin-top:0;width:auto}
.sc-msg{min-height:22px;color:var(--fail);font-weight:600;margin:0}
.sc-result{border:1px solid var(--line);border-radius:var(--r-card);padding:20px 22px;margin:12px 0 28px;background:var(--tint)}
.sc-result:focus{outline:2px solid var(--primary);outline-offset:3px}
.sc-result h3{margin-top:0}
.sc-score{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 8px}
.sc-score b{font:700 42px/1 var(--sans);letter-spacing:-.03em;color:var(--ink)}
.sc-band{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:5px 12px}
.sc-band.ok{color:var(--pass);background:var(--pass-bg)}
.sc-band.warn{color:var(--warn);background:var(--warn-bg)}
.sc-band.bad{color:var(--fail);background:var(--fail-bg)}
.sc-gaps li{margin:0 0 10px}
.sc-tag{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;border:1px solid var(--line-strong);border-radius:6px;padding:1px 6px;margin-right:8px;color:var(--muted)}
.sc-note{margin:10px 0 0}

/* 404 */
.nf{padding-block:80px 48px;min-height:50vh}
.nf .code{color:var(--muted);font-family:var(--mono);letter-spacing:.1em}
.nf h1{margin-top:12px}
.nf h1+.lede{margin-top:20px}

/* Motion off when asked */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
@media print{
  .nav,.skip,.trial-bar,footer,.aside,.scorecard,#join-cta,.related,.faq-block,.divider,.sc-actions,.sc-note,.mcta{display:none!important}
  body{background:#fff!important;color:#000!important}
  .page-hero::before{display:none}
  .sc-result{border:1px solid #000;background:none;color:#000}
  .sc-score b,.sc-result h3,.sc-result h4,.sc-tag{color:#000}
  .prose a{color:#000}
}
