@font-face{font-family:"Manrope";src:url("Manrope-Variable.ttf") format("truetype");font-weight:200 800;font-display:swap;}
@font-face{font-family:"Inter";src:url("Inter-Variable.ttf") format("truetype");font-weight:100 900;font-display:swap;}

:root{
  --navy:#16273E; --navy-900:#0F1C2E; --copper:#C17A47; --copper-hover:#A9683A;
  --ink:#23272E; --slate:#6B7078; --mist:#E4E0DA; --paper:#F8F5F0; --sand:#F0E2D0;
  --card:#FFFFFF;
  --line-light:rgba(22,39,62,.10);   /* slight border on light */
  --line-dark:rgba(248,245,240,.14);  /* slight border on dark */
  --maxw:1200px;
}
*{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(--ink);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased;font-optical-sizing:auto;}
h1,h2,h3,h4{font-family:"Manrope",system-ui,sans-serif;color:var(--navy);letter-spacing:-0.03em;line-height:1.04;font-weight:800;}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:1.5rem}
@media(min-width:768px){.wrap{padding-inline:2rem}}

/* eyebrow */
.eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-family:"Manrope";font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--copper)}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--copper)}
.eyebrow.chip{border:1px solid rgba(193,122,71,.4);background:rgba(193,122,71,.08);padding:.4rem .8rem;border-radius:999px}
.eyebrow.chip::before{width:6px;height:6px;border-radius:999px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;height:52px;padding:0 1.5rem;border-radius:12px;font-family:"Inter";font-weight:700;font-size:15px;letter-spacing:.01em;cursor:pointer;transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease;border:1px solid transparent}
.btn svg{width:18px;height:18px}
.btn-copper{background:var(--copper);color:var(--paper);box-shadow:0 6px 18px rgba(193,122,71,.25)}
.btn-copper:hover{background:var(--copper-hover);transform:translateY(-2px);box-shadow:0 10px 24px rgba(193,122,71,.32)}
.btn-ghost-dark{border-color:var(--line-light);color:var(--navy)}
.btn-ghost-dark:hover{border-color:var(--navy);transform:translateY(-2px)}
.btn-ghost-light{border-color:rgba(248,245,240,.35);color:var(--paper)}
.btn-ghost-light:hover{border-color:var(--paper);transform:translateY(-2px)}
.btn-sm{height:44px;padding:0 1.1rem;font-size:14px}

/* zoomable media (slight border + zoom on hover/focus/tap) */
.zoom{position:relative;overflow:hidden;border-radius:20px;border:1px solid var(--line-light);background:var(--card);cursor:zoom-in;outline:none}
.zoom.on-dark{border-color:var(--line-dark)}
.zoom img{width:100%;height:auto;display:block;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.zoom:hover img,.zoom:focus-visible img,.zoom.is-active img{transform:scale(1.07)}
.zoom.is-active{cursor:zoom-out}
.zoom:focus-visible{outline:2px solid var(--copper);outline-offset:3px}
.zoom .tag{position:absolute;top:14px;left:14px;background:var(--navy);color:var(--paper);font-family:"Manrope";font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:.35rem .7rem;border-radius:999px}

/* ---------- utility bar ---------- */
.util{background:var(--navy-900);color:rgba(248,245,240,.66);font-size:12.5px}
.util .wrap{display:flex;align-items:center;justify-content:space-between;height:38px;gap:1rem}
.util a:hover{color:var(--copper)}
.util .u-right{display:flex;gap:1.4rem}
.util .dot{color:var(--copper)}
@media(max-width:640px){.util .u-left{display:none}}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:50;background:var(--navy);border-bottom:1px solid rgba(248,245,240,.08);transition:box-shadow .3s ease}
.hdr.scrolled{box-shadow:0 10px 30px rgba(0,0,0,.28)}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;height:74px;gap:1rem}
.logo-chip{background:var(--paper);border-radius:10px;padding:.4rem .6rem;display:inline-flex;align-items:center}
.logo-chip img{height:30px;width:auto}
.nav{display:none;align-items:center;gap:2rem}
.nav a{font-size:15px;font-weight:600;color:rgba(248,245,240,.85);transition:color .2s}
.nav a:hover{color:var(--copper)}
.hdr-actions{display:flex;align-items:center;gap:.6rem}
.burger{display:inline-flex;height:44px;width:44px;align-items:center;justify-content:center;border:1px solid rgba(248,245,240,.2);border-radius:10px;color:var(--paper);background:none;cursor:pointer}
.mobile-nav{display:none;background:var(--navy);border-top:1px solid rgba(248,245,240,.08)}
.mobile-nav.open{display:block}
.mobile-nav a{display:block;padding:.85rem 0;font-size:16px;font-weight:600;color:var(--paper);border-bottom:1px solid rgba(248,245,240,.06)}
@media(min-width:900px){.nav{display:flex}.burger{display:none}}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--navy);color:var(--paper);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;
  background:
    radial-gradient(circle at 82% 18%, rgba(193,122,71,.20), transparent 42%),
    linear-gradient(rgba(248,245,240,.045) 1px, transparent 1px) 0 0/34px 34px,
    linear-gradient(90deg, rgba(248,245,240,.045) 1px, transparent 1px) 0 0/34px 34px;
  pointer-events:none}
.hero .wrap{position:relative;display:grid;gap:3rem;align-items:center;padding-block:4.5rem}
@media(min-width:960px){.hero .wrap{grid-template-columns:1.05fr .95fr;padding-block:6rem}}
.hero h1{color:var(--paper);font-size:clamp(42px,6.2vw,76px);margin-top:1.4rem}
.hero h1 .accent{color:var(--copper)}
.hero p.lead{color:rgba(248,245,240,.78);font-size:clamp(17px,1.4vw,19px);max-width:40ch;margin-top:1.4rem}
.hero .cta-row{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2.2rem}
.hero .microtrust{margin-top:1.5rem;font-size:14px;color:rgba(248,245,240,.6)}
.hero-media{position:relative}
.hero-media .zoom{background:var(--paper);padding:1.5rem}
.hero-media .zoom img{border-radius:8px}
.hero-media .float{position:absolute;bottom:-18px;left:-18px;background:var(--navy-900);border:1px solid var(--line-dark);border-radius:14px;padding:.8rem 1rem;display:flex;gap:.7rem;align-items:center}
.hero-media .float .n{font-family:"Manrope";font-weight:800;font-size:20px;color:var(--copper)}
.hero-media .float .l{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(248,245,240,.7);line-height:1.3}

/* ---------- section scaffolding ---------- */
.section{padding-block:5.5rem}
.section.tight{padding-block:4rem}
.bg-paper{background:var(--paper)}
.bg-sand{background:var(--sand)}
.bg-sand-soft{background:color-mix(in srgb, var(--sand) 55%, var(--paper))}
.bg-navy{background:var(--navy);color:var(--paper)}
.bg-navy h2,.bg-navy h3{color:var(--paper)}
.sec-head{max-width:56ch}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head h2{font-size:clamp(30px,3.6vw,44px);margin-top:.8rem}
.sec-head p{color:var(--slate);margin-top:1rem;font-size:18px}
.bg-navy .sec-head p{color:rgba(248,245,240,.72)}

/* trust bar */
.trust{border-top:1px solid var(--line-light);border-bottom:1px solid var(--line-light)}
.trust .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;padding-block:2.6rem}
@media(min-width:768px){.trust .grid{grid-template-columns:repeat(4,1fr)}}
.stat .v{font-family:"Manrope";font-weight:800;font-size:clamp(28px,3vw,36px);color:var(--navy);letter-spacing:-0.03em}
.stat .v .u{color:var(--copper)}
.stat .l{margin-top:.35rem;font-size:12.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--slate)}
.stat{border-left:2px solid var(--copper);padding-left:1rem}

/* cards */
.cards{display:grid;gap:1.25rem;margin-top:3rem}
.g4{grid-template-columns:1fr}
.g3{grid-template-columns:1fr}
@media(min-width:640px){.g4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.g4{grid-template-columns:repeat(4,1fr)}}
@media(min-width:768px){.g3{grid-template-columns:repeat(3,1fr)}}
.card{background:var(--card);border:1px solid var(--line-light);border-radius:18px;padding:1.6rem;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.card:hover{transform:translateY(-4px);border-color:rgba(193,122,71,.35);box-shadow:0 16px 34px rgba(22,39,62,.08)}
.card h3{font-size:18px;font-weight:700;margin-top:1.1rem}
.card p{color:var(--slate);font-size:15px;margin-top:.5rem}
.icon-c{display:inline-grid;place-items:center;height:46px;width:46px;border-radius:12px;background:var(--navy);color:var(--copper)}
.icon-c svg{width:22px;height:22px}
.icon-c.sm{height:38px;width:38px;border-radius:10px}
.icon-c.sm svg{width:18px;height:18px}

/* product */
.product-grid{display:grid;gap:3.5rem;align-items:center}
@media(min-width:1024px){.product-grid{grid-template-columns:1fr 1fr}}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.gallery .main{grid-column:span 2}
.gallery .zoom:not(.main) img{aspect-ratio:4/5;object-fit:cover}
.train-grid .zoom img{aspect-ratio:3/2;object-fit:cover}
.spec-grid{display:grid;grid-template-columns:1fr;gap:.8rem;margin-top:2rem}
@media(min-width:560px){.spec-grid{grid-template-columns:repeat(2,1fr)}}
.spec{display:flex;gap:.9rem;align-items:flex-start;background:var(--card);border:1px solid var(--line-light);border-radius:12px;padding:1rem}
.spec .v{font-weight:700;color:var(--navy);font-size:15px}
.spec .l{color:var(--slate);font-size:13px}
.prod-cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem}
details.specs{margin-top:3rem}
details.specs table{width:100%;border-collapse:collapse;border:1px solid var(--line-light);border-radius:16px;overflow:hidden;font-size:15px}
details.specs thead{background:var(--navy);color:var(--paper)}
details.specs th{text-align:left;padding:.9rem 1.2rem;font-family:"Manrope";font-weight:700}
details.specs td{padding:.8rem 1.2rem}
details.specs td:first-child{font-weight:600;color:var(--navy);width:38%}
details.specs tr:nth-child(even){background:rgba(228,224,218,.35)}
details.specs summary{list-style:none;cursor:pointer;display:inline-flex}

/* how it works (navy, numbered) */
.steps{display:grid;gap:1.25rem;margin-top:3rem;grid-template-columns:1fr}
@media(min-width:768px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{position:relative;background:var(--navy-900);border:1px solid var(--line-dark);border-radius:18px;padding:1.8rem}
.step .num{font-family:"Manrope";font-weight:800;font-size:44px;color:rgba(193,122,71,.9);letter-spacing:-0.04em;line-height:1}
.step h3{color:var(--paper);font-size:19px;font-weight:700;margin-top:1rem}
.step p{color:rgba(248,245,240,.72);font-size:15px;margin-top:.5rem}

/* training */
.train-grid{display:grid;gap:3rem;align-items:center}
@media(min-width:1024px){.train-grid{grid-template-columns:1fr 1fr}}
.train-list{display:grid;gap:.7rem;margin-top:1.6rem;grid-template-columns:1fr}
@media(min-width:560px){.train-list{grid-template-columns:repeat(3,1fr)}}
.train-list li{display:flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.6);border:1px solid var(--line-light);border-radius:12px;padding:.8rem 1rem;font-size:14px;font-weight:600;color:var(--navy);list-style:none}
.train-list svg{width:16px;height:16px;color:var(--copper);flex-shrink:0}

/* final cta */
.final{text-align:center}
.final h2{font-size:clamp(30px,4vw,46px)}
.final p{color:rgba(248,245,240,.8);margin-top:1rem;font-size:18px;max-width:46ch;margin-inline:auto}
.final .btn{margin-top:2rem}

/* footer */
.footer{background:var(--navy);color:var(--paper)}
.footer .cols{display:grid;gap:2.5rem;padding-block:4rem;grid-template-columns:1fr}
@media(min-width:768px){.footer .cols{grid-template-columns:1.4fr 1fr 1.2fr}}
.footer .logo-chip{margin-bottom:1.2rem}
.footer p.tl{color:rgba(248,245,240,.75);max-width:30ch;font-size:15px}
.footer h4{color:rgba(248,245,240,.7);font-family:"Manrope";font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700}
.footer ul{list-style:none;margin-top:1rem;display:grid;gap:.6rem}
.footer a:hover{color:var(--copper)}
.footer .contact li{display:flex;gap:.7rem;align-items:flex-start;color:rgba(248,245,240,.85);font-size:15px;margin-top:.8rem}
.footer .contact svg{width:16px;height:16px;color:var(--copper);margin-top:.25rem;flex-shrink:0}
.foot-bottom{border-top:1px solid rgba(248,245,240,.1)}
.foot-bottom .wrap{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:space-between;padding-block:1.4rem;font-size:13px;color:rgba(248,245,240,.6)}
.foot-bottom .legal{display:flex;gap:1.4rem}

/* cookie */
.cookie{position:fixed;inset-inline:.8rem;bottom:.8rem;z-index:60;max-width:760px;margin-inline:auto;background:var(--paper);border:1px solid var(--line-light);border-radius:16px;padding:1.1rem 1.2rem;box-shadow:0 20px 50px rgba(0,0,0,.18)}
.cookie .row{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center;justify-content:space-between}
.cookie p{font-size:14px;color:var(--ink);flex:1;min-width:240px}
.cookie .acts{display:flex;gap:.5rem}
.cookie button{height:42px;padding:0 1.1rem;border-radius:10px;font-weight:700;font-size:14px;cursor:pointer;border:1px solid var(--line-light);background:none;color:var(--navy)}
.cookie button.accept{background:var(--copper);color:var(--paper);border-color:var(--copper)}

/* reveal */
/* Content is VISIBLE by default. It is only hidden (to be faded in) when
   JavaScript is confirmed running - the inline script in <head> sets html.js.
   So if main.js ever fails to load, the page still shows everything. */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.js .reveal.is-visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}.zoom img{transition:none}}

/* ================= multi-page additions ================= */

/* page hero (inner pages) */
.page-hero{position:relative;background:var(--navy);color:var(--paper);overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;background:
  radial-gradient(circle at 88% 12%, rgba(193,122,71,.18), transparent 45%),
  linear-gradient(rgba(248,245,240,.045) 1px, transparent 1px) 0 0/34px 34px,
  linear-gradient(90deg, rgba(248,245,240,.045) 1px, transparent 1px) 0 0/34px 34px;
  pointer-events:none}
.page-hero .wrap{position:relative;padding-block:3.5rem 4rem;max-width:900px;margin-inline:auto}
@media(min-width:768px){.page-hero .wrap{padding-block:5rem 5.5rem}}
.page-hero h1{color:var(--paper);font-size:clamp(34px,5vw,58px);margin-top:1.1rem}
.page-hero p{color:rgba(248,245,240,.78);font-size:clamp(16px,1.3vw,19px);margin-top:1.2rem;max-width:56ch}

/* breadcrumb */
.crumb{font-size:13px;color:rgba(248,245,240,.55);margin-bottom:.2rem}
.crumb a:hover{color:var(--copper)}
.crumb span{color:rgba(248,245,240,.35);margin-inline:.4rem}

/* active nav */
.nav a.active{color:var(--copper)}
.mobile-nav a.active{color:var(--copper)}

/* split rows (about, industries detail) */
.split{display:grid;gap:3rem;align-items:center}
@media(min-width:1024px){.split{grid-template-columns:1fr 1fr}}
.split.rev .split-media{order:-1}
@media(max-width:1023px){.split.rev .split-media{order:0}}

/* prose (legal pages, about story) */
.prose{max-width:74ch}
.prose h2{font-size:clamp(24px,2.4vw,30px);margin-top:2.6rem}
.prose h3{font-size:19px;font-weight:700;margin-top:1.8rem;color:var(--navy)}
.prose p{margin-top:1rem;color:var(--ink);font-size:16.5px;line-height:1.75}
.prose ul{margin-top:1rem;padding-left:1.2rem;color:var(--ink)}
.prose li{margin-top:.5rem;font-size:16.5px;line-height:1.7}
.prose strong{color:var(--navy);font-weight:600}
.prose a{color:var(--copper);text-decoration:underline;text-underline-offset:3px}
.prose .updated{color:var(--slate);font-size:14px;margin-top:.4rem}
.legal-note{background:var(--sand);border:1px solid var(--line-light);border-radius:14px;padding:1.1rem 1.3rem;margin-top:2rem;font-size:14.5px;color:var(--ink)}

/* founder card */
.founder{display:grid;gap:2rem;align-items:start;background:var(--card);border:1px solid var(--line-light);border-radius:20px;padding:2rem}
@media(min-width:768px){.founder{grid-template-columns:auto 1fr;padding:2.5rem}}
.founder .avatar{width:96px;height:96px;border-radius:20px;background:var(--navy);color:var(--copper);display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:30px;letter-spacing:-.02em}
.founder h3{font-size:22px;font-weight:800}
.founder .role{color:var(--copper);font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-top:.3rem}
.founder p{color:var(--slate);margin-top:1rem;font-size:16px;line-height:1.75}

/* value pillars (about) */
.pillars{display:grid;gap:1.25rem;margin-top:3rem;grid-template-columns:1fr}
@media(min-width:768px){.pillars{grid-template-columns:repeat(3,1fr)}}
.pillar{background:var(--card);border:1px solid var(--line-light);border-radius:18px;padding:1.8rem}
.pillar h3{font-size:19px;font-weight:700;margin-top:1rem}
.pillar p{color:var(--slate);font-size:15px;margin-top:.6rem}

/* numbered value list */
.vlist{list-style:none;padding:0;margin-top:2rem;display:grid;gap:1rem}
.vlist li{display:flex;gap:1rem;align-items:flex-start;background:var(--card);border:1px solid var(--line-light);border-radius:14px;padding:1.2rem 1.4rem}
.vlist .rank{font-family:var(--font-display);font-weight:800;font-size:20px;color:var(--copper);min-width:2ch}
.vlist h3{font-size:17px;font-weight:700}
.vlist p{color:var(--slate);font-size:15px;margin-top:.3rem}

/* materials chips */
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.5rem;padding:0;list-style:none}
.chips li{background:var(--card);border:1px solid var(--line-light);border-radius:999px;padding:.5rem 1rem;font-size:14px;font-weight:600;color:var(--navy)}

/* quote form */
.form-grid{display:grid;gap:3rem;align-items:start}
@media(min-width:1024px){.form-grid{grid-template-columns:1.25fr .75fr}}
.form-card{background:var(--card);border:1px solid var(--line-light);border-radius:20px;padding:1.8rem}
@media(min-width:768px){.form-card{padding:2.4rem}}
.field{margin-top:1.2rem}
.field:first-child{margin-top:0}
.field label{display:block;font-size:14px;font-weight:600;color:var(--navy);margin-bottom:.45rem}
.field .req{color:var(--copper)}
.field input,.field select,.field textarea{width:100%;background:var(--paper);border:1px solid var(--mist);border-radius:10px;padding:.85rem 1rem;font-family:var(--font-sans);font-size:15px;color:var(--ink);transition:border-color .2s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--copper);box-shadow:0 0 0 3px rgba(193,122,71,.12)}
.field textarea{min-height:130px;resize:vertical}
.field .hint{font-size:13px;color:var(--slate);margin-top:.4rem}
.form-row{display:grid;gap:1.2rem;grid-template-columns:1fr}
@media(min-width:640px){.form-row{grid-template-columns:1fr 1fr}}
.form-card .btn{width:100%;margin-top:1.8rem}
.consent{display:flex;gap:.7rem;align-items:flex-start;margin-top:1.4rem;font-size:14px;color:var(--slate);line-height:1.6}
.consent input{width:auto;margin-top:.25rem;flex-shrink:0;accent-color:var(--copper)}
.consent a{color:var(--copper);text-decoration:underline}
.form-status{margin-top:1rem;font-size:14.5px;font-weight:600;display:none}
.form-status.ok{display:block;color:#2F8F6B}
.form-status.err{display:block;color:#C74B3F}

/* contact aside */
.contact-card{background:var(--navy);color:var(--paper);border-radius:20px;padding:2rem}
.contact-card h3{color:var(--paper);font-size:20px;font-weight:800}
.contact-card p{color:rgba(248,245,240,.75);font-size:15px;margin-top:.7rem}
.contact-card ul{list-style:none;padding:0;margin-top:1.6rem;display:grid;gap:1.1rem}
.contact-card li{display:flex;gap:.8rem;align-items:flex-start;font-size:15px;color:rgba(248,245,240,.9)}
.contact-card svg{color:var(--copper);flex-shrink:0;margin-top:.2rem}
.contact-card a:hover{color:var(--copper)}
.wa{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;width:100%;margin-top:1.8rem;height:48px;border-radius:12px;background:#25D366;color:#0B2A17;font-weight:700;font-size:15px;transition:transform .2s}
.wa:hover{transform:translateY(-2px)}

/* faq / accordion */
.faq{margin-top:3rem;display:grid;gap:.8rem}
.faq details{background:var(--card);border:1px solid var(--line-light);border-radius:14px;padding:1.1rem 1.4rem}
.faq summary{cursor:pointer;font-weight:700;color:var(--navy);font-size:16.5px;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--copper);font-size:22px;font-weight:700;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq p{color:var(--slate);font-size:15.5px;margin-top:.9rem;line-height:1.7}

/* generic section intro spacing fix */
.section > .wrap > .sec-head + .split{margin-top:3rem}
.section > .wrap > .sec-head + .prose{margin-top:2rem}

/* ---- mobile overflow fixes ---- */
/* grid children must be allowed to shrink below their content width */
.form-grid > *,.product-grid > *,.train-grid > *,.split > *,.footer .cols > *{min-width:0}
/* long email addresses must be able to wrap inside narrow cards */
.contact-card a,.footer .contact a,.footer .contact li,.util .u-right a{overflow-wrap:anywhere}
.contact-card li,.faq summary{min-width:0}
/* keep the top bar tidy on small screens */
@media(max-width:520px){
  .util{font-size:11.5px}
  .util .u-right{gap:.8rem}
}

/* honeypot: invisible to people, visible to bots */
.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none}

/* ============ fixes ============ */

/* FORM ALIGNMENT:
   .field has margin-top:1.2rem, and :first-child only cleared it for the
   FIRST field in the card. Inside a two-column .form-row that pushed the
   RIGHT-hand field down by 1.2rem. Rows are already spaced by their own
   margin, so fields inside a row must have no top margin at all. */
.form-row > .field{margin-top:0}
.form-row{margin-top:1.2rem}
.form-card > .form-row:first-of-type{margin-top:0}

/* ABOUT: the story heading should match the size of the other section
   headings ("The founder.", "Purpose, vision, mission." etc). */
.prose h2.h2-lg{font-size:clamp(30px,3.6vw,44px);letter-spacing:-0.03em;line-height:1.05}