/* Brand fonts, self-hosted (SIL Open Font License; from Google Fonts, latin subset, variable weight) */
@font-face{font-family:'Archivo';font-style:normal;font-weight:500 800;font-display:swap;src:url('fonts/archivo-latin-var.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url('fonts/ibm-plex-sans-latin-var.woff2') format('woff2')}
/* Constructicore public site. Brand source of truth: brand/BRAND.md */

/* ---------- brand tokens (from brand/tokens/tokens.css, palette P1 Site Navy) ---------- */
:root{
	--cc-navy:#1E2F5C;
	--cc-ink:#0F1A30;
	--cc-sky:#3FA9DC;
	--cc-sky-text:#2A8FC4;
	--cc-surface:#F5F7FA;
	--cc-white:#FFFFFF;
	--cc-muted:#5B6577;
	--cc-line:#DDE2EA;

	--color-bg:var(--cc-surface);
	--color-card:var(--cc-white);
	--color-text:var(--cc-ink);
	--color-text-muted:var(--cc-muted);
	--color-primary:var(--cc-navy);
	--color-on-primary:var(--cc-white);
	--color-accent:var(--cc-sky);
	--color-on-accent:var(--cc-ink);
	--color-border:var(--cc-line);
	--color-focus:var(--cc-sky);
	/* Status colours (brand/BRAND.md, "Status colours"). Text shades pass AA on
	   white, surface and their tint; solid shades are for icons, borders and dots. */
	--cc-success-text:#17663E;--cc-success-tint:#E4F4EA;--cc-success:#2E8B57;
	--cc-warning-text:#8A4B00;--cc-warning-tint:#FDF0D5;--cc-warning:#B8730A;
	--cc-error-text:#B42318;--cc-error-tint:#FCE8E6;--cc-error:#C8322A;

	/* Secondary text on navy or ink: white at reduced opacity, not a new colour */
	--color-on-dark-muted:rgba(255,255,255,.78);

	--font-display:'Archivo','Helvetica Neue',Arial,sans-serif;
	--font-body:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
	--font-code:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;

	--text-xs:.8125rem;
	--text-sm:.9375rem;
	--text-base:1rem;
	--text-lg:1.1875rem;
	--text-xl:1.375rem;
	--text-2xl:2rem;
	--text-3xl:3rem;
	--text-4xl:4rem;

	--leading-tight:1.02;
	--leading-snug:1.3;
	--leading-body:1.55;
	--tracking-display:-.025em;
	--tracking-eyebrow:.14em;

	--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;
	--space-8:32px;--space-10:40px;--space-12:48px;--space-14:56px;--space-16:64px;

	--radius-sm:8px;
	--radius-md:12px;
	--radius-lg:16px;
	--radius-pill:999px;
	--shadow-card:0 24px 48px -24px rgba(15,26,48,.25);

	--container-max:1312px;
	--gutter:64px;
	--nav-height:88px;
	--control-height:44px;
	--control-height-lg:52px;

	color-scheme:light;
}

/* ---------- base ---------- */
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
	background:var(--color-bg);
	color:var(--color-text);
	font-family:var(--font-body);
	font-size:var(--text-base);
	line-height:var(--leading-body);
	-webkit-font-smoothing:antialiased;
	overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%}
:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}
.wrap{max-width:var(--container-max);margin:0 auto;padding:0 var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:8px;background:var(--color-primary);color:var(--color-on-primary);padding:10px 16px;border-radius:var(--radius-sm);z-index:100}
.skip:focus{left:8px}
.mt{margin-top:var(--space-4)}

h1,h2,h3{font-family:var(--font-display);color:var(--color-primary)}
h1{font-weight:800;font-size:clamp(2.5rem,5vw,var(--text-4xl));line-height:var(--leading-tight);letter-spacing:var(--tracking-display);margin-top:var(--space-6)}
h2{font-weight:800;font-size:clamp(1.75rem,3.4vw,var(--text-3xl));line-height:1.08;letter-spacing:-.02em}
h3{font-weight:700}
/* Sky text: large display text only (3.6:1 on white) */
.hl{color:var(--cc-sky-text)}

.kicker{
	font-family:var(--font-body);font-weight:500;font-size:var(--text-xs);letter-spacing:var(--tracking-eyebrow);
	text-transform:uppercase;color:var(--color-text-muted);display:inline-block;font-variant-numeric:tabular-nums}
.num{font-family:var(--font-body);font-variant-numeric:tabular-nums}

/* ---------- buttons ---------- */
.btn{
	display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);
	min-height:var(--control-height);padding:0 20px;border-radius:var(--radius-sm);
	border:1.5px solid var(--color-primary);font-family:var(--font-body);font-weight:600;font-size:var(--text-base);
	cursor:pointer;transition:background-color .15s,color .15s;
}
.btn-primary{background:var(--color-primary);color:var(--color-on-primary)}
.btn-primary:hover{background:var(--cc-ink);border-color:var(--cc-ink)}
.btn-secondary{background:transparent;color:var(--color-primary)}
.btn-secondary:hover{background:var(--color-card)}
.btn-lg{min-height:var(--control-height-lg);padding:0 24px}
.btn svg{width:18px;height:18px}

/* ---------- chips ---------- */
.chip{
	display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:var(--radius-pill);
	background:var(--color-accent);color:var(--color-on-accent);font-size:var(--text-xs);font-weight:600;white-space:nowrap;
}
.chip-navy{background:var(--color-primary);color:var(--color-on-primary)}
.chip-outline{background:var(--color-card);color:var(--color-text);border:1px solid var(--color-border)}
/* Status chips: info uses the default sky chip */
.chip-success{background:var(--cc-success-tint);color:var(--cc-success-text)}
.chip-warning{background:var(--cc-warning-tint);color:var(--cc-warning-text)}
.chip-error{background:var(--cc-error-tint);color:var(--cc-error-text)}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--color-card);border-bottom:1px solid var(--color-border)}
.nav{height:var(--nav-height);display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}
.brand{display:block;flex:none}
.brand img{height:36px;width:auto;display:block}
.navlinks{display:flex;align-items:center;gap:36px;font-size:var(--text-sm);font-weight:500}
.navlinks a:hover{color:var(--color-primary);text-decoration:underline;text-underline-offset:4px}
.navlinks a[aria-current="page"]{color:var(--color-primary);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.nav-actions{display:flex;align-items:center;gap:var(--space-3)}
.nav-actions .btn{white-space:nowrap}
.menu-toggle{
	display:none;align-items:center;justify-content:center;width:var(--control-height);height:var(--control-height);
	background:var(--color-card);border:1.5px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-primary);cursor:pointer;
}

/* ---------- breadcrumbs ---------- */
.crumbs{padding-top:var(--space-6)}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:var(--space-2);font-size:var(--text-xs);color:var(--color-text-muted)}
.crumbs li+li::before{content:"/";margin-right:var(--space-2)}
.crumbs a{text-decoration:underline;text-underline-offset:3px}
.crumbs a:hover{color:var(--color-primary)}

/* ---------- hero ---------- */
.hero{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-16);align-items:center;padding-block:var(--space-14) var(--space-12)}
.page-hero{padding-block:var(--space-12) var(--space-10);max-width:860px}
.page-hero h1{font-size:clamp(2.25rem,4.4vw,3.5rem)}
.lede{font-size:var(--text-lg);color:var(--color-text-muted);margin-top:var(--space-6);max-width:600px}
.hero-cta{display:flex;gap:var(--space-3);margin-top:var(--space-8);flex-wrap:wrap}
.hero-cta.center{justify-content:center}
.hero-note{margin-top:var(--space-5);font-size:var(--text-sm);color:var(--color-text-muted)}
.hero-note .chip{margin-right:var(--space-2)}

/* ---------- cards ---------- */
.card{
	background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);
	padding:28px;box-shadow:var(--shadow-card);position:relative;
}
a.card{display:block;transition:border-color .15s}
a.card:hover{border-color:var(--color-primary)}
.card-head{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:var(--space-4)}
.card-head small{display:block;font-size:var(--text-xs);color:var(--color-text-muted)}
.card-head .card-title{font-family:var(--font-display);font-size:var(--text-xl);font-weight:700;line-height:var(--leading-snug);color:var(--color-primary)}
.card .ico{width:48px;height:48px;border-radius:var(--radius-md);display:grid;place-items:center;background:var(--color-bg);border:1px solid var(--color-border);margin-bottom:var(--space-5)}
.card .ico svg{width:24px;height:24px;fill:none;stroke:var(--color-primary);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.card .tagline{font-family:var(--font-body);font-weight:500;font-size:var(--text-xs);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--color-text-muted);font-variant-numeric:tabular-nums}
.card h3,.card-h{font-family:var(--font-display);font-weight:700;font-size:var(--text-lg);line-height:var(--leading-snug);letter-spacing:0;color:var(--color-primary);margin:var(--space-2) 0 var(--space-3)}
.card p{color:var(--color-text-muted);font-size:var(--text-sm)}
.card-meta{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.card .more{display:inline-block;margin-top:var(--space-4);font-weight:600;font-size:var(--text-sm);color:var(--color-primary);text-decoration:underline;text-underline-offset:3px}

/* progress bar */
.progress-label{display:flex;justify-content:space-between;gap:var(--space-4);font-size:var(--text-xs);color:var(--color-text-muted)}
.progress{height:8px;border-radius:var(--radius-pill);background:var(--color-border);margin:var(--space-2) 0 var(--space-3)}
.progress span{display:block;height:100%;border-radius:inherit;background:var(--color-primary)}
.progress .p-74{width:74%}

/* money table (brand component) */
.money-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}
.money-table th{text-align:left;font-weight:400;padding:11px var(--space-4) 11px 0}
.money-table td{text-align:right;font-family:var(--font-body);font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.money-table tr{border-bottom:1px solid var(--color-border)}
.money-table thead th{font-family:var(--font-body);font-weight:500;font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted);padding-top:0;font-variant-numeric:tabular-nums}
.money-table thead th.num{text-align:right}
.money-table .strong th,.money-table .strong td{font-weight:600}
.money-table .muted{color:var(--color-text-muted)}
.money-table .total{border-bottom:0}
.money-table .total th{font-weight:600;padding-top:14px}
.money-table .total td{font-size:1.5rem;color:var(--color-primary)}
.card-foot{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--color-border);display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-6);font-size:var(--text-xs);color:var(--color-text-muted)}
.card-foot b{font-family:var(--font-body);font-weight:500;color:var(--color-text);font-variant-numeric:tabular-nums}

/* timeline (payment cycle mock) */
.timeline{list-style:none;display:flex;flex-direction:column}
.timeline li{display:flex;align-items:center;gap:var(--space-4);padding:12px 0;border-bottom:1px solid var(--color-border);font-size:var(--text-sm)}
.timeline li:last-child{border-bottom:0}
.timeline .when{font-family:var(--font-body);font-weight:500;font-variant-numeric:tabular-nums;min-width:60px;color:var(--color-text-muted)}
.timeline b{font-weight:600}
.timeline .chip{margin-left:auto}

/* ---------- feature band (navy) ---------- */
.band{background:var(--color-primary);color:var(--color-on-primary)}
.features{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-10);padding-block:var(--space-10)}
.features a{display:block}
.features h3{margin:10px 0;font-family:var(--font-display);font-weight:700;font-size:var(--text-lg);color:var(--color-on-primary)}
.features a:hover h3{text-decoration:underline;text-underline-offset:4px}
.features p{font-size:.875rem;color:var(--color-on-dark-muted)}
.features svg{width:28px;height:28px;fill:none;stroke:var(--cc-sky);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.claim-strip{border-bottom:1px solid var(--color-border);background:var(--color-card)}
.claim-inner{padding-block:var(--space-6);display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);flex-wrap:wrap}
.claim{font-family:var(--font-display);font-weight:700;font-size:var(--text-lg);line-height:var(--leading-snug);color:var(--color-primary);max-width:720px}

/* ---------- sections ---------- */
.block{padding-block:88px}
.block.alt{background:var(--color-card);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}
.sec-head{max-width:720px;margin-bottom:var(--space-12)}
.sec-head.center{text-align:center;margin-left:auto;margin-right:auto}
.sec-head h2{margin-top:var(--space-4)}
.sec-head p{color:var(--color-text-muted);font-size:var(--text-lg);margin-top:var(--space-4)}

.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-6)}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-6)}
.contact-ways{list-style:none;margin:var(--space-6) 0 0;padding:0;display:grid;gap:var(--space-5)}
.contact-ways li{display:flex;flex-direction:column;gap:2px}
.contact-label{font-size:var(--text-sm);font-weight:600;color:var(--color-text-muted)}
.contact-value{font-size:1.25rem;font-weight:600}
.foot-contact{margin-top:var(--space-4)}
.foot-contact a{color:inherit}
.template-card{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-3)}
.template-card p{margin:0}
.guide-more-h{margin:0 0 var(--space-5)}
.guide-nav{display:flex;justify-content:space-between;gap:var(--space-5);flex-wrap:wrap;margin-top:var(--space-8)}
.guide-nav a{display:flex;flex-direction:column;gap:var(--space-1);max-width:26rem;text-decoration:none}
.guide-nav strong{text-decoration:underline}
.guide-next{margin-left:auto;text-align:right}
.split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-16);align-items:center}

.checks{list-style:none;display:flex;flex-direction:column;gap:var(--space-4);margin-top:var(--space-6)}
.checks li{display:flex;gap:var(--space-3);align-items:flex-start;color:var(--color-text-muted)}
.checks li b{color:var(--color-text);font-weight:600}
.chk{flex:none;width:24px;height:24px;border-radius:6px;background:var(--color-accent);display:grid;place-items:center;margin-top:1px}
.chk svg{width:14px;height:14px;stroke:var(--color-on-accent);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* numbered steps */
.steps{list-style:none;counter-reset:step;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-6)}
.steps li{counter-increment:step;border-top:3px solid var(--color-primary);padding-top:var(--space-5)}
.steps li::before{content:counter(step,decimal-leading-zero);font-family:var(--font-body);font-weight:500;font-size:var(--text-xs);letter-spacing:var(--tracking-eyebrow);color:var(--color-text-muted);font-variant-numeric:tabular-nums}
.steps h3{font-size:var(--text-lg);margin:var(--space-2) 0;line-height:var(--leading-snug)}
.steps p{color:var(--color-text-muted);font-size:var(--text-sm)}

/* pricing */
.price-card{display:flex;flex-direction:column}
.price-card .price{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:800;color:var(--color-primary);margin:var(--space-2) 0 var(--space-1)}
.price-card .price small{font-family:var(--font-body);font-size:var(--text-sm);color:var(--color-text-muted);font-weight:400}
.price-card ul{list-style:none;margin-top:var(--space-4);display:flex;flex-direction:column;gap:var(--space-2);font-size:var(--text-sm);color:var(--color-text-muted)}
.price-card li{padding-left:22px;position:relative}
.price-card li::before{content:"";position:absolute;left:0;top:.45em;width:10px;height:10px;border-radius:3px;background:var(--color-accent)}
.price-card.featured{border:2px solid var(--color-primary)}

/* FAQ */
.faq{max-width:860px}
.faq details{border-bottom:1px solid var(--color-border);padding:var(--space-5) 0}
.faq summary{cursor:pointer;font-weight:600;font-size:var(--text-lg);color:var(--color-primary);list-style:none;display:flex;justify-content:space-between;gap:var(--space-5)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--font-body);font-size:1.4rem;line-height:1;font-variant-numeric:tabular-nums}
.faq details[open] summary::after{content:"\2212"}
.faq details p{color:var(--color-text-muted);margin-top:var(--space-3);max-width:760px}

/* closing call to action (navy) */
.cta-band{
	background:var(--color-primary);color:var(--color-on-primary);border-radius:var(--radius-lg);padding:var(--space-12) var(--space-10);
	display:flex;align-items:center;justify-content:space-between;gap:var(--space-8);flex-wrap:wrap;
}
.cta-band h2{font-size:clamp(1.5rem,2.8vw,var(--text-2xl));color:var(--color-on-primary);max-width:620px}
.cta-band p{color:var(--color-on-dark-muted);margin-top:var(--space-3);max-width:620px}
.cta-band .btn-primary{background:var(--color-card);color:var(--color-primary);border-color:var(--color-card)}
.cta-band .btn-primary:hover{background:var(--color-bg)}

/* integrations */
.integrations{display:flex;align-items:center;justify-content:center;gap:var(--space-3);flex-wrap:wrap}
.integration{font-size:var(--text-sm);color:var(--color-text-muted);padding:var(--space-3) var(--space-5);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-card)}
.integration b{color:var(--color-primary);font-weight:600}

/* ---------- prose (guides, privacy) ---------- */
.prose{max-width:760px;padding-bottom:var(--space-10)}
.prose h2{font-size:clamp(1.375rem,2.6vw,1.75rem);margin:var(--space-12) 0 var(--space-3)}
.prose h3{font-size:var(--text-lg);margin:var(--space-8) 0 var(--space-2)}
.prose p,.prose li{font-size:1.0625rem;line-height:1.7}
.prose p+p{margin-top:var(--space-4)}
.prose ul,.prose ol{margin:var(--space-3) 0 var(--space-3) 22px;display:flex;flex-direction:column;gap:var(--space-2)}
.prose a{color:var(--color-primary);text-decoration:underline;text-underline-offset:3px}
.prose strong{font-weight:600}
.prose table{width:100%;border-collapse:collapse;margin:var(--space-5) 0;font-size:var(--text-sm);background:var(--color-card)}
.prose th,.prose td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--color-border)}
.prose th{font-family:var(--font-body);font-weight:500;font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted);font-variant-numeric:tabular-nums}
.table-scroll{overflow-x:auto}
.note{border-left:4px solid var(--color-accent);background:var(--color-card);padding:var(--space-4) var(--space-5);border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin:var(--space-6) 0}
.note p{font-size:var(--text-sm)}
.draft-banner{background:var(--color-primary);color:var(--color-on-primary);padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);font-family:var(--font-body);font-weight:500;font-size:var(--text-xs);margin:var(--space-5) 0;font-variant-numeric:tabular-nums}

/* ---------- forms ---------- */
.form-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:var(--space-16);align-items:start;padding-bottom:100px}
.form-panel h2{font-size:var(--text-xl);letter-spacing:0;margin-bottom:var(--space-5)}
.fg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}
.fg .s2{grid-column:1/-1}
.field{display:flex;flex-direction:column;gap:6px}
.field label,.field legend{font-size:var(--text-sm);font-weight:600;color:var(--color-text)}
.field .req{color:var(--color-primary)}
.field input,.field select,.field textarea{
	background:var(--color-card);border:1.5px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);
	font-family:var(--font-body);font-size:var(--text-base);min-height:var(--control-height);padding:10px 14px;width:100%;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--color-primary);outline:3px solid var(--color-focus);outline-offset:1px}
.field .err{border:2px solid var(--cc-error)}
.field .ferr{font-size:var(--text-sm);font-weight:600;color:var(--cc-error-text)}
.field .ferr::before{content:"! ";font-family:var(--font-body);font-variant-numeric:tabular-nums}
.field textarea{resize:vertical;min-height:110px}
fieldset.field{border:0}
.opts{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-2)}
.opts label{display:flex;gap:var(--space-3);align-items:flex-start;font-weight:400;cursor:pointer}
.opts input{width:20px;height:20px;min-height:0;margin-top:2px;accent-color:var(--color-primary);flex:none}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.alert{border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4);font-size:var(--text-sm);margin-bottom:var(--space-5)}
.alert-err{background:var(--cc-error-tint);border:1px solid var(--cc-error);color:var(--cc-error-text);font-weight:600}
.form-foot{margin-top:var(--space-6);display:flex;flex-direction:column;gap:var(--space-3)}
.form-foot .btn{width:100%;min-height:var(--control-height-lg)}
.form-foot .small{font-size:var(--text-xs);color:var(--color-text-muted);text-align:center}
.form-foot .small a{color:var(--color-primary);text-decoration:underline}
.sent{text-align:center;padding:var(--space-6) 0}
.sent .ico-ok{width:56px;height:56px;border-radius:var(--radius-md);margin:0 auto var(--space-5);display:grid;place-items:center;background:var(--cc-success-tint)}
.sent .ico-ok svg{width:26px;height:26px;stroke:var(--cc-success-text);stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.sent h2{font-size:var(--text-xl);margin-bottom:var(--space-3)}
.sent p{color:var(--color-text-muted);max-width:380px;margin:0 auto}

/* ---------- footer (ink) ---------- */
.site-footer{background:var(--cc-ink);color:var(--color-on-primary);padding-block:var(--space-14) var(--space-8);margin-top:var(--space-10)}
.site-footer .brand img{height:32px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--space-10)}
.foot-lede{color:var(--color-on-dark-muted);font-size:var(--text-sm);margin-top:var(--space-4);max-width:380px}
.foot-h{font-family:var(--font-body);font-weight:500;font-size:var(--text-xs);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--color-on-dark-muted);margin-bottom:var(--space-4);font-variant-numeric:tabular-nums}
.site-footer ul{list-style:none;display:flex;flex-direction:column;gap:var(--space-2);font-size:var(--text-sm)}
.site-footer ul a:hover{text-decoration:underline;text-underline-offset:3px}
.disclaimer{margin-top:var(--space-10);padding-top:var(--space-6);border-top:1px solid rgba(255,255,255,.18);font-size:var(--text-xs);color:var(--color-on-dark-muted);max-width:860px}
.copy{margin-top:var(--space-3);font-size:var(--text-xs);color:var(--color-on-dark-muted)}

/* ---------- error pages ---------- */
.error-page{padding-block:120px;text-align:center}
.error-page p{color:var(--color-text-muted);margin:var(--space-4) auto var(--space-8);max-width:480px}
.error-page pre{text-align:left;white-space:pre-wrap;font-size:var(--text-xs);background:var(--color-card);border:1px solid var(--color-border);padding:var(--space-4);border-radius:var(--radius-sm);margin-top:var(--space-8);overflow:auto}

/* ---------- responsive ---------- */
@media (max-width:1280px){
	.navlinks{gap:24px}
	.brand img{height:32px}
}
/* Header collapses to logo, call to action and menu toggle */
@media (max-width:1080px){
	.menu-toggle{display:inline-flex}
	.navlinks{
		display:none;position:absolute;top:var(--nav-height);left:0;right:0;flex-direction:column;align-items:stretch;gap:0;
		background:var(--color-card);border-bottom:1px solid var(--color-border);padding:var(--space-2) var(--gutter) var(--space-4);
		box-shadow:var(--shadow-card);
	}
	.navlinks.open{display:flex}
	.navlinks a{padding:14px 0;border-bottom:1px solid var(--color-border)}
	.navlinks a:last-child{border-bottom:0}
}
@media (max-width:960px){
	:root{--gutter:16px;--nav-height:72px}
	.hero,.split,.form-wrap,.features{grid-template-columns:minmax(0,1fr);gap:var(--space-10)}
	.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
	.steps{grid-template-columns:repeat(2,minmax(0,1fr))}
	.brand img{height:26px}
	.nav-actions .btn{padding:0 14px;font-size:var(--text-sm)}
	.block{padding-block:64px}
	.hero{padding-block:var(--space-10)}
	.card{padding:var(--space-5)}
	.cta-band{padding:var(--space-8) var(--space-6)}
}
@media (max-width:620px){
	.grid-3,.grid-2,.steps{grid-template-columns:minmax(0,1fr)}
	.fg{grid-template-columns:minmax(0,1fr)}
	.foot-grid{grid-template-columns:1fr 1fr}
	.foot-grid>div:first-child{grid-column:1/-1}
	.progress-label{flex-direction:column;gap:2px}
}
@media (max-width:480px){
	/* Keep logo, call to action and menu toggle on one line at 375px */
	.nav,.nav-actions{gap:var(--space-2)}
	.brand img{height:20px}
	.nav-actions .btn{padding:0 12px;font-size:.875rem}
}
@media (prefers-reduced-motion:reduce){
	*{transition:none!important;scroll-behavior:auto!important}
}

/* pricing page */
.pricing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5)}
.price-card .price-alt{font-size:var(--text-sm);color:var(--color-text-muted)}
.price-card .price-scope{font-weight:600;color:var(--color-text);margin-top:var(--space-3)}
.price-note{margin-top:var(--space-6);font-size:var(--text-sm);color:var(--color-text-muted);text-align:center}
@media (max-width:900px){.pricing-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:620px){.pricing-grid{grid-template-columns:minmax(0,1fr)}}
.pricing-grid .price small{display:block;margin-top:2px;line-height:1.3}
.founding{margin-bottom:var(--space-5);border-left:4px solid var(--color-primary)}
.founding p{margin-top:var(--space-2)}
.price-card .price-text{font-size:var(--text-xl)}
.coming-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5)}
.coming-card h3{font-size:var(--text-lg)}
.coming-card p{margin-top:var(--space-2);color:var(--color-text-muted);font-size:var(--text-sm)}
@media (max-width:900px){.coming-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.coming-grid{grid-template-columns:minmax(0,1fr)}}

/* installer */
.install{padding-bottom:var(--space-16)}
.install-card{margin-bottom:var(--space-6);max-width:860px}
.install-card p{color:var(--color-text-muted);margin-bottom:var(--space-4)}
.install-action{margin-top:var(--space-5)}
.install code{font-family:var(--font-code);background:var(--color-bg);padding:1px 6px;border-radius:4px}
.secret-card{border:2px solid var(--cc-success)}
.secret-card td.secret{font-size:var(--text-base);user-select:all;word-break:break-all;white-space:normal;text-align:left}
.muted-text{color:var(--color-text-muted);font-weight:400}
.note-text{margin-top:var(--space-4)}
.plain-list{list-style:none;color:var(--color-text)}
.alert-ok{background:var(--cc-success-tint);border:1px solid var(--cc-success);color:var(--cc-success-text);font-weight:600;max-width:860px}
.install .alert-err{max-width:860px}

/* Modules: roadmap grid, module pages, waiting list */
.module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5)}
.module-card{display:flex;flex-direction:column;gap:var(--space-2);text-decoration:none;color:inherit}
.module-card h3{font-family:var(--font-display);font-size:var(--text-lg);color:var(--color-primary)}
.module-card p{color:var(--color-text-muted);font-size:var(--text-sm)}
a.module-card:hover h3{text-decoration:underline;text-underline-offset:3px}
.module-card .ico{margin:0}
a.coming-card{text-decoration:none;color:inherit}
a.coming-card:hover h3{text-decoration:underline;text-underline-offset:3px}
.page-hero .kicker .chip{margin-left:var(--space-2);vertical-align:middle}
.waitlist .card-h{margin-bottom:var(--space-2)}
.waitlist-form{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-4)}
.waitlist-form .field{display:flex;flex-direction:column;gap:var(--space-1)}
.waitlist .small-print{margin-top:var(--space-3);font-size:.8125rem;color:var(--color-text-muted)}
.waitlist .form-error{color:var(--cc-error-text);font-weight:600;margin-top:var(--space-2)}
.cta-card .hero-cta{margin-top:var(--space-4)}
.integration .chip{margin-left:var(--space-2)}
@media (max-width:900px){.module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.module-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- payment date calculator ---------- */
.calc-wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding-bottom:var(--space-12)}
.calc-custom{border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-4)}
.calc-custom legend{padding:0 var(--space-2)}
.calc-dates{list-style:none;display:flex;flex-direction:column}
.calc-dates li{display:grid;grid-template-columns:152px minmax(0,1fr);gap:var(--space-4);padding:12px 0;border-bottom:1px solid var(--color-border);font-size:var(--text-sm)}
.calc-dates li:last-child{border-bottom:0}
.calc-dates .when{font-family:var(--font-body);font-weight:500;font-variant-numeric:tabular-nums;color:var(--color-text-muted)}
.calc-dates b{font-weight:600;color:var(--color-text)}
.calc-dates .why{color:var(--color-text-muted)}
.calc-dates li.key .when{color:var(--color-primary);font-weight:700}
.card .calc-note{margin-top:var(--space-4);font-size:var(--text-xs)}
.calc-cta{margin-top:var(--space-5)}
.calc-cta .btn{margin-top:var(--space-4)}
.calc-empty p+p{margin-top:var(--space-3)}
.alert-warn{background:var(--cc-warning-tint);border:1px solid var(--cc-warning);color:var(--cc-warning-text);font-weight:600}
@media (max-width:900px){.calc-wrap{grid-template-columns:minmax(0,1fr);gap:var(--space-8)}}
@media (max-width:480px){.calc-dates li{grid-template-columns:minmax(0,1fr);gap:var(--space-1)}}
.calc-disclaimer{max-width:760px}
.calc-actions{margin-top:var(--space-5)}

/* Status page */
.status-page{max-width:720px;padding-block:var(--space-7, 3rem) var(--space-8, 4rem)}
.status-overall{text-align:center;padding:var(--space-6, 2rem) var(--space-5, 1.25rem);border-radius:var(--radius-md, 10px);border:1.5px solid;margin-bottom:var(--space-6, 2rem)}
.status-overall p{margin:0}
.status-dot{display:inline-block;width:36px;height:36px;border-radius:50%;background:currentColor;box-shadow:0 0 0 10px color-mix(in srgb,currentColor 16%,transparent);margin:var(--space-2) 0 var(--space-5)}
.status-operational{background:var(--cc-success-tint);border-color:var(--cc-success);color:var(--cc-success-text)}
.status-degraded{background:var(--cc-warning-tint);border-color:var(--cc-warning);color:var(--cc-warning-text)}
.status-outage{background:var(--cc-error-tint);border-color:var(--cc-error);color:var(--cc-error-text)}
.status-headline{font-family:var(--font-display);font-weight:800;font-size:clamp(1.4rem,3vw,1.9rem);text-transform:uppercase;letter-spacing:.01em}
.status-checked{margin-top:var(--space-2, .5rem)!important;color:var(--color-text-muted)}
.status-card{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-md, 10px)}
.status-mono{font-family:var(--font-body);font-size:.8rem;color:var(--color-text-muted);font-variant-numeric:tabular-nums}
.status-uptime{padding:var(--space-5, 1.25rem);margin-bottom:var(--space-6, 2rem)}
.status-uptime-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-3);margin-bottom:var(--space-3, .75rem)}
.status-uptime-head h2{font-family:var(--font-body);font-size:1rem;font-weight:600;margin:0;color:var(--color-text)}
.uptime-bars{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(30,1fr);gap:3px}
.uptime-bars li{height:40px;border-radius:3px;background:var(--color-border)}
.uptime-bars .uptime-operational{background:var(--cc-success)}
.uptime-bars .uptime-degraded{background:var(--cc-warning)}
.uptime-bars .uptime-outage{background:var(--cc-error)}
.uptime-scale{display:flex;justify-content:space-between;margin-top:var(--space-2, .5rem)}
.status-group{font-family:var(--font-body);font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--color-text-muted);margin:var(--space-6, 2rem) 0 var(--space-2, .5rem);font-variant-numeric:tabular-nums}
.status-list{list-style:none;margin:0;padding:0}
.status-list li{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3, .75rem);padding:var(--space-4, 1rem) var(--space-5, 1.25rem);border-top:1px solid var(--color-border)}
.status-list li:first-child{border-top:0}
.status-name{font-weight:500}
.status-name small{display:block;color:var(--color-text-muted);font-size:.85rem;font-weight:400}
.status-pill{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;padding:4px 12px;border-radius:999px;font-family:var(--font-body);font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;font-variant-numeric:tabular-nums}
.pill-dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.status-foot{margin-top:var(--space-6, 2rem);text-align:center}
.status-foot p{margin:var(--space-2) 0}
@media (max-width:560px){.uptime-bars{gap:2px}.uptime-bars li{height:32px}}
.foot-badge{margin:var(--space-4, 1rem) 0 0}
.foot-badge img,.status-foot img{height:20px;width:auto}
.hero h1.h1-long{font-size:clamp(2.1rem,4.2vw,3.5rem)}
.audience .card h3{margin-top:var(--space-3)}
.status-foot a{color:var(--color-primary);text-decoration:underline}
.audience .card{display:flex;flex-direction:column;align-items:flex-start}
.audience .card p:last-child{margin-top:auto;padding-top:var(--space-3)}

/* Cookie choice (analytics only after Accept) */
.cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--color-card);border-top:1px solid var(--color-border);box-shadow:var(--shadow-card);padding:var(--space-4) 0 calc(var(--space-4) + env(safe-area-inset-bottom, 0px))}
.cookie-inner{display:flex;gap:var(--space-4);align-items:center;justify-content:space-between;flex-wrap:wrap}
.cookie-inner p{margin:0;max-width:62ch;font-size:var(--text-sm)}
.cookie-actions{display:flex;gap:var(--space-3);flex-wrap:wrap}
.foot-link{color:inherit;font:inherit;padding:0;text-align:left;background:none;border:0;cursor:pointer}
.foot-link:hover,.foot-link:focus{text-decoration:underline}
@media print{.cookie-banner{display:none}}
.cookie-inner a{color:var(--color-primary);text-decoration:underline}

/* Developers page: copyable code examples (device monospace, as allowed for codes people copy) */
.code-block{font-family:var(--font-code);font-size:var(--text-sm);line-height:1.6;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-4);overflow-x:auto;white-space:pre;margin:var(--space-4) 0}
.prose code{font-family:var(--font-code);font-size:.92em;overflow-wrap:anywhere}
/* Header: sign in for customers */
.nav-signin{font-weight:600;color:var(--color-primary);text-decoration:none;margin-right:var(--space-3)}
.nav-signin:hover{text-decoration:underline}
@media (max-width:620px){.nav-signin{display:none}}

/* Integrations: a tick for what is available now */
.integration.is-live{display:inline-flex;align-items:center;gap:var(--space-2)}
.integration .chk{flex-shrink:0}