/* GreenGate International.
   Design language: the shipping document. Ruled ledgers instead of cards,
   square corners, a monospaced face for anything that reads as a reference
   or a label, and the bronze of the seal used the way a stamp is used:
   sparingly, and only where something is being marked.
   Everything below is built from the tokens in :root. See DESIGN.md. */

:root{
  /* ---- colour: ink (the green of the seal), paper, bronze ---- */
  --ink:#0b2019;
  --ink-rgb:11,32,25;
  --ink-2:#102a21;
  --ink-3:#071610;
  --paper:#f3eee3;
  --paper-2:#fbf8f1;
  --bronze:#c08a62;
  --bronze-rgb:192,138,98;
  --bronze-hi:#d7a57e;
  --bronze-deep:#7d4c2a;
  --gold:#d6ad63;
  --danger:#a3282a;
  --ok:#2f5a3d;

  /* ---- text ---- */
  --on-ink:#f3eee3;
  --on-ink-2:rgba(243,238,227,.72);
  --on-ink-3:rgba(243,238,227,.52);
  --on-paper:#0b2019;
  --on-paper-2:rgba(11,32,25,.74);
  --on-paper-3:rgba(11,32,25,.56);

  /* ---- rules: hairlines do the work shadows and cards usually do ---- */
  --rule-ink:rgba(243,238,227,.16);
  --rule-ink-strong:rgba(243,238,227,.34);
  --rule-paper:rgba(11,32,25,.16);
  --rule-paper-strong:rgba(11,32,25,.8);

  /* ---- type ---- */
  --font-display:'Fraunces',Georgia,'Times New Roman',serif;
  --font-body:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --t-micro:11.5px;
  --t-xs:12.5px;
  --t-sm:14px;
  --t-base:16px;
  --t-md:18px;
  --t-lg:22px;
  --t-xl:clamp(24px,2.5vw,31px);
  --t-2xl:clamp(31px,4vw,50px);
  --t-3xl:clamp(38px,5.2vw,68px);
  --t-hero:clamp(42px,6vw,84px);

  /* ---- space: one scale, 4px base ---- */
  --s-1:4px;
  --s-2:8px;
  --s-3:12px;
  --s-4:16px;
  --s-5:24px;
  --s-6:32px;
  --s-7:48px;
  --s-8:clamp(48px,6vw,80px);
  --s-9:clamp(72px,10vw,136px);

  /* ---- shape and motion ---- */
  --r:2px;
  --ease:cubic-bezier(.2,.6,.2,1);
  --dur:.25s;
  --dur-slow:.7s;

  /* ---- layout ---- */
  --max:1280px;
  --pad:clamp(20px,4vw,56px);
  --col-label:clamp(150px,17vw,230px);
}

/* ---------- base ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--ink);color:var(--on-ink);line-height:1.65;font-size:var(--t-base);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
::selection{background:var(--bronze);color:var(--ink)}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.light :focus-visible,.form-card :focus-visible,.article :focus-visible{outline-color:var(--bronze-deep)}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}

.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.skip{position:absolute;left:-999px;top:0;background:var(--bronze);color:var(--ink);padding:var(--s-3) var(--s-4);font-weight:600;z-index:999}
.skip:focus{left:0}

section{padding:var(--s-9) 0;position:relative}
.dark{background:var(--ink)}
.light{background:var(--paper);color:var(--on-paper)}
.gap-26{height:var(--s-5)}
.gap-top{margin-top:var(--s-7)}

/* ---------- typography ---------- */
h1,h2{font-family:var(--font-display);font-weight:500;line-height:1.04;letter-spacing:-.02em;text-wrap:balance}
h3{font-family:var(--font-body);font-weight:600;line-height:1.25;letter-spacing:-.005em}
/* Emphasis in a heading is the italic of the display face, in bronze. One
   treatment, everywhere a heading field accepts <em>. */
h1 em,h2 em,h3 em,.ft-tag em{font-family:var(--font-display);font-style:italic;font-weight:400;color:var(--bronze)}
.light h1 em,.light h2 em,.light h3 em{color:var(--bronze-deep)}
.h2{font-size:var(--t-2xl)}
.lede{font-size:var(--t-md);line-height:1.6;max-width:60ch;color:var(--on-ink-2)}
.light .lede{color:var(--on-paper-2)}
.lede-tight{margin-top:var(--s-3)}

/* The label face. Kickers, breadcrumbs, table heads, field labels, captions:
   anything that names or indexes rather than says. */
.kicker,.crumbs,.hero-trust span,.pghero-facts span,.svc-num,.e2e-step b i,.rt-label span,.rt-caption,.f-field label,.doc-tag,.ft-col h4,.cta-line small,.mnav-label,.mnav-line small,.head-phone small,.about-quote span,.about-badge span,.areas li,.svc-tag,.article-meta,.tst footer span,.read-time,.post-card .tag,.cban-locked,.stats .lbl,.topbar{font-family:var(--font-mono);font-size:var(--t-micro);font-weight:500;letter-spacing:.09em;text-transform:uppercase;line-height:1.5}
.kicker{color:var(--bronze);margin-bottom:var(--s-5)}
.light .kicker{color:var(--bronze-deep)}

/* Section head: the label sits in its own narrow column, like the margin of
   a form, and the heading starts on the content column. */
.sec-head{display:grid;grid-template-columns:var(--col-label) minmax(0,1fr);column-gap:var(--s-6);margin-bottom:var(--s-8)}
.sec-head .kicker{grid-column:1;grid-row:1/span 3;align-self:start;margin:0;padding-top:.9em;border-top:1px solid currentColor}
.sec-head>.h2,.sec-head>.lede{grid-column:2}
.sec-head .h2{max-width:20ch}
.sec-head .lede{margin-top:var(--s-5)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-3);font-family:var(--font-body);font-weight:600;font-size:var(--t-sm);letter-spacing:.01em;line-height:1.2;padding:16px 26px;border-radius:var(--r);border:1px solid transparent;cursor:pointer;transition:background var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.btn svg{transition:transform var(--dur) var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn-accent{background:var(--bronze);color:var(--ink)}
.btn-accent:hover{background:var(--bronze-hi)}
.btn-ghost{border-color:var(--rule-ink-strong);color:var(--on-ink)}
.btn-ghost:hover{border-color:var(--bronze);color:var(--bronze)}
.btn-dark{background:var(--ink);color:var(--paper)}
.btn-dark:hover{background:var(--ink-2)}
.btn-outline-dark{border-color:var(--rule-paper-strong);color:var(--on-paper)}
.btn-outline-dark:hover{background:var(--ink);color:var(--paper)}
.btn-nav{padding:12px 20px}
.btn-row{display:flex;gap:var(--s-3);flex-wrap:wrap;align-items:center}

/* ---------- header ---------- */
.topbar{background:var(--ink-3);color:var(--on-ink-3);border-bottom:1px solid var(--rule-ink);position:relative;z-index:60}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;min-height:38px}
.topbar span,.topbar a{display:inline-flex;align-items:center;gap:var(--s-2)}
.topbar a:hover{color:var(--bronze)}
.topbar .tb-r{display:flex;gap:var(--s-5)}
.topbar svg{width:12px;height:12px;stroke:var(--bronze)}
header.site{position:sticky;top:0;z-index:50;background:var(--ink);border-bottom:1px solid var(--rule-ink)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;height:82px;gap:var(--s-6)}
.logo{display:flex;align-items:center;gap:var(--s-3);flex:0 0 auto}
.logo img{width:52px;height:52px;border-radius:var(--r);outline:1px solid rgba(var(--bronze-rgb),.45);outline-offset:2px}
.logo-txt{display:flex;flex-direction:column;line-height:1.05}
.logo-txt b{font-family:var(--font-display);font-weight:500;font-size:var(--t-lg);letter-spacing:-.005em;color:var(--on-ink)}
.logo-txt small{font-family:var(--font-mono);font-size:10px;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--bronze);margin-top:6px}
nav.main{display:flex;gap:var(--s-6);font-size:var(--t-sm);font-weight:500}
nav.main a{color:var(--on-ink-2);position:relative;padding:var(--s-2) 0;transition:color var(--dur) var(--ease)}
nav.main a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--bronze);transform:scaleX(0);transform-origin:left;transition:transform var(--dur) var(--ease)}
nav.main a:hover,nav.main a.is-here{color:var(--on-ink)}
nav.main a:hover::after,nav.main a.is-here::after{transform:scaleX(1)}
.head-cta{display:flex;align-items:center;gap:var(--s-5);flex:0 0 auto}
.head-phone{display:flex;flex-direction:column;align-items:flex-end;line-height:1.3}
.head-phone small{color:var(--on-ink-3)}
.head-phone a{font-family:var(--font-mono);font-size:var(--t-sm);color:var(--on-ink)}
.head-phone a:hover{color:var(--bronze)}
.burger{display:none;background:none;border:1px solid var(--rule-ink-strong);border-radius:var(--r);width:46px;height:46px;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.burger span{display:block;width:20px;height:1.5px;background:var(--on-ink);transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease)}
.burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

/* Mobile nav. Fully opaque. Scrolls, because the contact block will not fit
   on a short handset. */
.mnav{display:none;position:fixed;inset:0;top:120px;background:var(--ink);z-index:49;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.mnav.open{display:block}
.mnav-inner{display:flex;flex-direction:column;min-height:100%;padding:var(--s-5) var(--pad) calc(var(--s-5) + env(safe-area-inset-bottom,0px))}
.mnav-links{display:flex;flex-direction:column;counter-reset:nav}
.mnav-links a{counter-increment:nav;display:flex;align-items:baseline;gap:var(--s-4);font-family:var(--font-display);font-size:var(--t-xl);font-weight:500;line-height:1.2;padding:var(--s-4) 0;border-bottom:1px solid var(--rule-ink);color:var(--on-ink)}
.mnav-links a::before{content:counter(nav,decimal-leading-zero);font-family:var(--font-mono);font-size:var(--t-micro);letter-spacing:.09em;color:var(--on-ink-3)}
.mnav-links a.is-here,.mnav-links a:hover{color:var(--bronze)}
.mnav .mnav-cta{margin-top:var(--s-5);width:100%}
.mnav-contact{margin-top:auto;padding-top:var(--s-6)}
.mnav-label{color:var(--bronze);margin-bottom:var(--s-3)}
.mnav-line{display:flex;align-items:center;gap:var(--s-3);padding:var(--s-3) 0;color:var(--on-ink)}
.mnav-line .ic{display:inline-flex;flex:0 0 auto}
.mnav-line .ic svg{width:18px;height:18px;stroke:var(--bronze)}
.mnav-line b{display:block;font-weight:500;font-size:var(--t-sm);overflow-wrap:anywhere}
.mnav-line small{display:block;color:var(--on-ink-3)}
.mnav-meta{display:flex;flex-direction:column;gap:var(--s-2);margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--rule-ink)}
.mnav-meta span{display:flex;align-items:center;gap:var(--s-2);font-size:var(--t-xs);color:var(--on-ink-3)}
.mnav-meta svg{width:14px;height:14px;flex:0 0 auto;stroke:var(--bronze)}
.mnav-social,.ft-social{display:flex;gap:var(--s-2);margin-top:var(--s-5)}
.mnav-social a,.ft-social a{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--rule-ink);border-radius:var(--r);transition:border-color var(--dur) var(--ease)}
.mnav-social svg,.ft-social svg{width:16px;height:16px;stroke:var(--on-ink-3)}
.mnav-social a:hover,.ft-social a:hover{border-color:var(--bronze)}
.mnav-social a:hover svg,.ft-social a:hover svg{stroke:var(--bronze)}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;isolation:isolate;padding:0;background:var(--ink)}
.hero-bg{position:absolute;inset:0;z-index:-2}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 40%}
.hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(var(--ink-rgb),.95) 22%,rgba(var(--ink-rgb),.76) 52%,rgba(var(--ink-rgb),.42) 100%)}
.hero .wrap{padding-top:var(--s-8);padding-bottom:0}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--s-7);align-items:center;min-height:min(600px,calc(100svh - 320px))}
.hero.has-image .hero-grid{grid-template-columns:1fr}
.hero h1{font-size:var(--t-hero);line-height:.98;letter-spacing:-.028em}
.hero h1 .l{display:block}
.hero h1 .accent{font-style:italic;font-weight:400;color:var(--bronze)}
.hero .lede{margin:var(--s-6) 0;max-width:52ch}
.hero-ctas{display:flex;gap:var(--s-3);flex-wrap:wrap}

/* The manifest strip: the facts of the route, set out like the header row of
   a shipping document. Shared by the homepage hero and the inner page hero. */
.hero-trust,.pghero-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule-ink-strong);margin-top:var(--s-8)}
.hero-trust div,.pghero-facts div{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:var(--s-2);padding:var(--s-4) var(--s-4) var(--s-5) 0;border-right:1px solid var(--rule-ink)}
.hero-trust div+div,.pghero-facts div+div{padding-left:var(--s-4)}
.hero-trust div:last-child,.pghero-facts div:last-child{border-right:0}
.hero-trust span,.pghero-facts span{color:var(--on-ink-3)}
.hero-trust b,.pghero-facts b{font-family:var(--font-display);font-weight:500;font-size:var(--t-lg);line-height:1.15;color:var(--on-ink)}
.hero-trust b em,.pghero-facts b em{font-style:normal;color:var(--on-ink)}
.pghero-facts{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));max-width:760px}

/* Route graphic: wireframe globe with the California to Prague arc. The label
   positions are the projected coordinates of the two nodes in route.svg. */
.hero-route{position:relative;width:100%;max-width:560px;margin-left:auto;aspect-ratio:1}
.hero-route svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.rt-disc{fill:none}
.rt-grat{stroke:rgba(var(--bronze-rgb),.24);stroke-width:.8}
.rt-rim{stroke:rgba(var(--bronze-rgb),.7);stroke-width:1}
.rt-arc{stroke:var(--gold);stroke-width:2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:rt-draw 2.2s cubic-bezier(.5,.1,.2,1) .35s forwards}
.rt-node{fill:var(--gold);stroke:var(--ink);stroke-width:2.5}
.rt-pulse{fill:none;stroke:var(--gold);stroke-width:1;transform-box:fill-box;transform-origin:center;animation:rt-pulse 3.2s ease-out infinite}
.rt-pulse-b{animation-delay:1.6s}
.rt-label{position:absolute;display:flex;flex-direction:column;gap:2px;white-space:nowrap;opacity:0;animation:rt-in var(--dur-slow) ease forwards}
.rt-label b{font-family:var(--font-display);font-weight:500;font-size:var(--t-lg);line-height:1.15;color:var(--on-ink)}
.rt-label span{color:var(--bronze)}
.rt-origin{left:17.7%;top:38.6%;transform:translate(-14%,20px);animation-delay:.5s}
.rt-dest{left:75.5%;top:31.7%;transform:translate(-50%,20px);text-align:center;animation-delay:2.2s}
.rt-caption{position:absolute;left:0;right:0;bottom:-6px;text-align:center;color:var(--on-ink-3)}
@keyframes rt-draw{to{stroke-dashoffset:0}}
@keyframes rt-pulse{0%{transform:scale(1);opacity:.8}100%{transform:scale(3.2);opacity:0}}
@keyframes rt-in{to{opacity:1}}

/* ---------- the ledger: every repeated set of items on the site ----------
   USPs, standards, values, client types and process steps all share this.
   No boxes: each entry hangs from its own rule, and the columns are kept
   apart by space. */
.usp-grid,.std-grid,.sectors,.proc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--s-6);row-gap:var(--s-6)}
.sectors,.proc-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.usp,.std,.sector,.proc{border-top:1px solid var(--rule-ink-strong);padding-top:var(--s-4)}
.light .usp,.light .std,.light .sector,.light .proc{border-top-color:var(--rule-paper-strong)}
.usp .ic,.std .ic{display:block;margin-bottom:var(--s-5)}
.usp svg,.std svg,.sector svg{display:block;width:26px;height:26px;stroke:var(--bronze);stroke-width:1.5}
.light .usp svg,.light .std svg,.light .sector svg{stroke:var(--bronze-deep)}
.sector svg{margin-bottom:var(--s-5)}
.usp h3,.std h3,.proc h3,.sector b{display:block;font-family:var(--font-body);font-size:var(--t-md);font-weight:600;line-height:1.25;margin-bottom:var(--s-2)}
.usp p,.std p,.proc p,.sector p{font-size:var(--t-sm);line-height:1.6;color:var(--on-ink-2);max-width:38ch}
.light .usp p,.light .std p,.light .proc p,.light .sector p{color:var(--on-paper-2)}
.usp-grid{margin-top:var(--s-8)}
.proc b.num{display:block;font-family:var(--font-display);font-weight:400;font-style:italic;font-size:var(--t-2xl);line-height:1;color:var(--bronze);margin-bottom:var(--s-5)}
.light .proc b.num{color:var(--bronze-deep)}

/* ---------- about ---------- */
.about-grid,.story-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:var(--s-8);align-items:start}
.about-copy p,.story-copy p{color:var(--on-paper-2);margin-bottom:var(--s-4);max-width:58ch}
.about-copy p strong,.story-copy p strong{color:var(--on-paper);font-weight:600}
.dark .story-copy p{color:var(--on-ink-2)}
.about-copy .h2,.story-copy .h2{max-width:16ch}
.about-quote{margin:var(--s-6) 0;padding:var(--s-1) 0 var(--s-1) var(--s-5);border-left:2px solid var(--bronze)}
.about-quote p{font-family:var(--font-display);font-style:italic;font-weight:400;font-size:var(--t-xl);line-height:1.25;color:var(--on-paper);margin:0 0 var(--s-2)}
.about-quote span{color:var(--bronze-deep)}
/* The seal is mounted like a plate: a hairline frame with a margin, no shadow. */
.about-imgs{position:relative;padding:0 0 var(--s-6)}
.about-imgs .im1{border:1px solid var(--rule-paper-strong);padding:var(--s-3);background:var(--paper-2)}
.about-imgs .im1 img{width:100%;height:clamp(360px,42vw,540px);object-fit:cover}
.about-imgs .im1 img.is-seal{height:auto;aspect-ratio:1}
/* The stamp. Bronze, slightly off square, as if applied by hand. */
.about-badge{position:absolute;right:calc(var(--s-4) * -1);bottom:0;display:flex;align-items:center;gap:var(--s-3);background:var(--paper);color:var(--bronze-deep);border:2px solid var(--bronze-deep);border-radius:var(--r);padding:var(--s-3) var(--s-4);transform:rotate(-4deg);box-shadow:inset 0 0 0 3px var(--paper),inset 0 0 0 4px var(--bronze-deep)}
.about-badge b{font-family:var(--font-display);font-weight:600;font-size:var(--t-xl);line-height:1}
.about-badge span{color:var(--bronze-deep)}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--s-6);margin-top:var(--s-8)}
.stats div{border-top:1px solid var(--rule-paper-strong);padding-top:var(--s-4)}
.stats b{display:block;font-family:var(--font-display);font-weight:500;font-size:var(--t-3xl);line-height:1;color:var(--on-paper)}
.stats b em{font-style:normal;color:var(--bronze-deep)}
.stats .lbl{display:block;margin-top:var(--s-3);color:var(--on-paper-3)}

/* ---------- services: the manifest ----------
   Homepage: one line per service, read across like a row in a table. */
.svc-table{border-bottom:1px solid var(--rule-ink-strong)}
.svc-line{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr) minmax(0,1.35fr) auto;column-gap:var(--s-6);align-items:baseline;padding:var(--s-5) 0;border-top:1px solid var(--rule-ink-strong);transition:background var(--dur) var(--ease),padding var(--dur) var(--ease)}
.svc-line:hover{background:rgba(var(--bronze-rgb),.07);padding-left:var(--s-4);padding-right:var(--s-4)}
.svc-num{color:var(--bronze)}
.svc-line h3{font-family:var(--font-display);font-weight:500;font-size:var(--t-xl);letter-spacing:-.015em;line-height:1.15}
/* The whole line is the link. */
.svc-line h3 a::after{content:"";position:absolute;inset:0}
.svc-line p{font-size:var(--t-base);color:var(--on-ink-2);max-width:52ch}
.svc-go{display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--t-sm);font-weight:500;color:var(--bronze);white-space:nowrap}
.svc-go svg,.svc-link svg{transition:transform var(--dur) var(--ease)}
.svc-line:hover .svc-go svg{transform:translateX(4px)}
.svc-link{display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--t-sm);font-weight:500;color:var(--bronze)}
.svc-link svg{width:15px;height:15px}

/* The four stages, drawn as a route: a line with a station at each stop. */
.e2e{margin-top:var(--s-9)}
.e2e-head{display:grid;grid-template-columns:var(--col-label) minmax(0,1fr) minmax(0,1fr);column-gap:var(--s-6);align-items:end;margin-bottom:var(--s-7)}
.e2e-head::before{content:"Route";font-family:var(--font-mono);font-size:var(--t-micro);font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--bronze);align-self:start;padding-top:.9em;border-top:1px solid currentColor}
.e2e-head h3{font-family:var(--font-display);font-weight:500;font-size:var(--t-xl);letter-spacing:-.015em;line-height:1.15}
.e2e-head p{color:var(--on-ink-2);font-size:var(--t-base)}
.e2e-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.e2e-step{position:relative;border-top:1px solid var(--gold);padding:var(--s-5) var(--s-5) 0 0}
.e2e-step::before{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px var(--ink)}
.e2e-step b{display:flex;flex-direction:column;gap:var(--s-2);font-family:var(--font-display);font-weight:500;font-size:var(--t-lg);margin-bottom:var(--s-2)}
.e2e-step b i{font-style:normal;color:var(--on-ink-3)}
.e2e-step p{font-size:var(--t-sm);color:var(--on-ink-2);max-width:30ch}

/* Services page: one full entry per service. */
.svc-rows{border-bottom:1px solid var(--rule-paper-strong)}
.svc-row{display:grid;grid-template-columns:var(--col-label) minmax(0,1.25fr) minmax(0,.85fr);column-gap:var(--s-6);align-items:start;padding:var(--s-7) 0;border-top:1px solid var(--rule-paper-strong);scroll-margin-top:110px}
.svc-row-head{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-4)}
.svc-row .svc-num{color:var(--bronze-deep)}
.svc-row .ic svg{display:block;width:30px;height:30px;stroke:var(--bronze-deep);stroke-width:1.4}
.svc-tag{color:var(--bronze-deep);border:1px solid var(--bronze-deep);border-radius:var(--r);padding:3px 8px}
.svc-row h3{font-family:var(--font-display);font-weight:500;font-size:var(--t-xl);letter-spacing:-.015em;line-height:1.15;margin-bottom:var(--s-3)}
.svc-row-lede{font-size:var(--t-md);color:var(--on-paper);margin-bottom:var(--s-4);max-width:44ch}
.svc-row-body p{color:var(--on-paper-2);margin-bottom:var(--s-3);max-width:58ch}
.svc-row-body p strong{color:var(--on-paper);font-weight:600}
.svc-list{display:grid;gap:0}
.svc-list li{display:flex;gap:var(--s-3);align-items:flex-start;font-size:var(--t-sm);padding:var(--s-3) 0;border-bottom:1px solid var(--rule-paper);color:var(--on-paper-2)}
.svc-list li:first-child{border-top:1px solid var(--rule-paper)}
.svc-list svg{width:15px;height:15px;stroke:var(--bronze-deep);flex:0 0 auto;margin-top:4px}

/* ---------- standards ---------- */
/* The declaration: a single statement, set large, under a rule. */
.trustline{margin-top:var(--s-9);padding-top:var(--s-6);border-top:1px solid var(--rule-paper-strong);display:grid;grid-template-columns:var(--col-label) minmax(0,1fr);column-gap:var(--s-6)}
.trustline::before{content:"Declaration";font-family:var(--font-mono);font-size:var(--t-micro);font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--bronze-deep);grid-row:1/span 2}
.trustline h3{font-family:var(--font-display);font-weight:500;font-size:var(--t-2xl);letter-spacing:-.02em;line-height:1.08;grid-column:2}
.trustline p{margin-top:var(--s-4);color:var(--on-paper-2);font-size:var(--t-md);grid-column:2}

/* ---------- accreditations and partners ---------- */
.accred{background:var(--ink-2);border-top:1px solid var(--rule-ink);border-bottom:1px solid var(--rule-ink)}
.accred-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));column-gap:var(--s-6);row-gap:var(--s-6)}
.accred-item{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-2);border-top:1px solid var(--rule-ink-strong);padding-top:var(--s-4)}
.accred-logo{display:flex;align-items:center;height:72px;margin-bottom:var(--s-3)}
.accred-logo img{max-height:72px;width:auto;max-width:170px;object-fit:contain}
.accred-item b{font-size:var(--t-md);font-weight:600}
.accred-note{font-size:var(--t-sm);color:var(--on-ink-3)}

/* ---------- testimonials ---------- */
.tst-head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-6);flex-wrap:wrap}
.tst-nav{display:flex;gap:var(--s-2)}
.tst-nav button{width:46px;height:46px;border-radius:var(--r);border:1px solid var(--rule-paper-strong);background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background var(--dur) var(--ease)}
.tst-nav svg{width:18px;height:18px;stroke:var(--on-paper)}
.tst-nav button:hover{background:var(--ink)}
.tst-nav button:hover svg{stroke:var(--paper)}
.tst-row{display:flex;gap:var(--s-6);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:var(--s-5);margin-top:var(--s-7);scrollbar-width:none}
.tst-row::-webkit-scrollbar{display:none}
.tst{flex:0 0 min(440px,86%);scroll-snap-align:start;display:flex;flex-direction:column;border-top:1px solid var(--rule-paper-strong);padding-top:var(--s-4)}
.tst .stars{color:var(--bronze-deep);font-size:var(--t-sm);letter-spacing:3px;margin-bottom:var(--s-4)}
.tst blockquote{font-family:var(--font-display);font-weight:400;font-size:var(--t-lg);line-height:1.4;color:var(--on-paper);flex:1}
.tst footer{margin-top:var(--s-5)}
.tst footer b{display:block;font-weight:600;font-size:var(--t-base)}
.tst footer span{color:var(--on-paper-3)}
.tst-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:var(--s-7) var(--s-6);margin-bottom:var(--s-8)}
.tst-wall blockquote br+br{content:"";display:block;height:var(--s-3)}
.rating-link{color:var(--bronze-deep);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* ---------- contact ---------- */
.cta{position:relative;isolation:isolate;overflow:hidden;background:var(--ink)}
.cta-bg{position:absolute;inset:0;z-index:-2}
.cta-bg img{width:100%;height:100%;object-fit:cover}
.cta-bg:has(img)+.cta-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,rgba(var(--ink-rgb),.97) 30%,rgba(var(--ink-rgb),.88) 60%,rgba(var(--ink-rgb),.78))}
.cta-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:var(--s-8);align-items:start}
.cta-info h2{margin-bottom:var(--s-5);max-width:14ch}
.cta-info>p:not(.kicker){color:var(--on-ink-2);font-size:var(--t-md);margin-bottom:var(--s-6);max-width:46ch}
.commit{margin-bottom:var(--s-6);border-top:1px solid var(--rule-ink)}
.commit li{display:flex;gap:var(--s-3);align-items:flex-start;padding:var(--s-3) 0;border-bottom:1px solid var(--rule-ink);font-size:var(--t-base)}
.commit svg{width:16px;height:16px;stroke:var(--bronze);flex:0 0 auto;margin-top:5px}
.light .commit,.light .commit li{border-color:var(--rule-paper)}
.light .commit svg{stroke:var(--bronze-deep)}
.cta-lines{display:flex;flex-direction:column}
.cta-line{display:flex;align-items:center;gap:var(--s-4);padding:var(--s-4) 0;border-top:1px solid var(--rule-ink)}
.cta-line .ic{display:inline-flex;flex:0 0 auto}
.cta-line svg{width:18px;height:18px;stroke:var(--bronze);stroke-width:1.5}
.cta-line small{display:block;color:var(--on-ink-3)}
.cta-line b{display:block;font-weight:500;font-size:var(--t-md);color:var(--on-ink);overflow-wrap:anywhere;transition:color var(--dur) var(--ease)}
.cta-line>span:last-child{min-width:0}
a.cta-line:hover b{color:var(--bronze)}

/* The form is a document: a tag naming it, ruled fields, labels in the
   label face. */
.form-card{position:relative;background:var(--paper-2);color:var(--on-paper);border-radius:var(--r);padding:var(--s-6) clamp(24px,3.4vw,48px) var(--s-7)}
.doc-tag{display:flex;justify-content:space-between;gap:var(--s-4);color:var(--on-paper-3);border-bottom:1px solid var(--rule-paper-strong);padding-bottom:var(--s-3);margin-bottom:var(--s-6)}
.form-card h3{font-family:var(--font-display);font-size:var(--t-xl);font-weight:500;letter-spacing:-.015em;margin-bottom:var(--s-2)}
.form-card>p:not(.doc-tag){font-size:var(--t-sm);color:var(--on-paper-2);margin-bottom:var(--s-6);max-width:44ch}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-5);margin-bottom:var(--s-5)}
.f-field{display:flex;flex-direction:column;gap:var(--s-1);min-width:0}
.f-field.full{grid-column:1/-1}
.f-field label{color:var(--on-paper-3)}
.f-field input,.f-field select,.f-field textarea{font-family:var(--font-body);font-size:var(--t-base);padding:var(--s-2) 0 var(--s-3);border:0;border-bottom:1px solid var(--rule-paper-strong);border-radius:0;background:transparent;color:var(--on-paper);width:100%;appearance:none;transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.f-field ::placeholder{color:var(--on-paper-3);opacity:1}
.f-field textarea{resize:vertical;min-height:104px}
.f-field input:focus,.f-field select:focus,.f-field textarea:focus{outline:none;border-bottom-color:var(--bronze-deep);box-shadow:0 1px 0 0 var(--bronze-deep)}
.f-sub{width:100%;margin-top:var(--s-2)}
.f-note{margin-top:var(--s-4);font-size:var(--t-xs);color:var(--on-paper-3)}
.f-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.enquiry-form .is-bad{border-bottom-color:var(--danger)!important;box-shadow:0 1px 0 0 var(--danger)}
.f-error{margin:0 0 var(--s-4);font-size:var(--t-sm);font-weight:500;color:var(--danger)}
.f-status{padding:var(--s-3) var(--s-4);border-radius:var(--r);font-size:var(--t-sm);font-weight:500;margin-bottom:var(--s-5);border:1px solid currentColor}
.f-status-ok{color:var(--ok)}
.f-status-bad{color:var(--danger)}

/* Closing band on inner pages: heading left, action right, details below. */
.cta-center{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--s-7);align-items:end}
.cta-center .kicker,.cta-center h2,.cta-center>p{grid-column:1}
.cta-center h2{font-size:var(--t-3xl);max-width:14ch}
.cta-center>p:not(.kicker){color:var(--on-ink-2);font-size:var(--t-md);margin-top:var(--s-5);max-width:50ch}
.cta-actions{grid-column:2;grid-row:1/span 3;align-self:end;display:flex;gap:var(--s-3);flex-wrap:wrap}
.cta-center .cta-lines{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;column-gap:var(--s-7);margin-top:var(--s-8);border-top:1px solid var(--rule-ink-strong)}
.cta-center .cta-line{border-top:0;flex:0 1 auto}

/* ---------- page hero (inner pages) ---------- */
.pghero{position:relative;overflow:hidden;isolation:isolate;padding:var(--s-8) 0 0;background:var(--ink)}
.pghero-bg{position:absolute;inset:0;z-index:-2}
.pghero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 45%}
.pghero-bg:has(img)+.pghero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(var(--ink-rgb),.96) 24%,rgba(var(--ink-rgb),.84) 56%,rgba(var(--ink-rgb),.6) 100%)}
.pghero h1{font-size:var(--t-3xl);max-width:17ch}
.pghero .lede{margin-top:var(--s-5)}
.pghero .wrap>:last-child:not(.pghero-facts){margin-bottom:var(--s-8)}
.pghero-facts{margin-top:var(--s-7)}
/* Compact hero: runs straight into the form below, so the form is on screen
   without scrolling. Used by the Contact landing page. */
.pghero-compact .wrap>:last-child:not(.pghero-facts){margin-bottom:0}
.pghero-compact+.cta{padding-top:var(--s-7)}
.crumbs{display:flex;align-items:center;gap:var(--s-2);color:var(--on-ink-3);margin-bottom:var(--s-5);flex-wrap:wrap}
.crumbs a:hover{color:var(--bronze)}
.crumbs b{color:var(--bronze);font-weight:500}
.crumbs i{font-style:normal;opacity:.5}

/* ---------- location tags ---------- */
.areas{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-left:calc(var(--col-label) + var(--s-6))}
.areas li{border:1px solid var(--rule-paper-strong);border-radius:var(--r);padding:var(--s-2) var(--s-3);color:var(--on-paper)}

/* ---------- faq ---------- */
.faq{border-top:1px solid var(--rule-paper-strong);margin-left:calc(var(--col-label) + var(--s-6))}
.faq details{border-bottom:1px solid var(--rule-paper)}
.dark .faq{border-top-color:var(--rule-ink-strong)}
.dark .faq details{border-bottom-color:var(--rule-ink)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s-5);padding:var(--s-5) 0;font-family:var(--font-display);font-weight:500;font-size:var(--t-lg);line-height:1.25;transition:color var(--dur) var(--ease)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--bronze)}
.light .faq summary:hover{color:var(--bronze-deep)}
.faq summary::after{content:"";width:13px;height:13px;flex:0 0 auto;margin-top:8px;background:linear-gradient(currentColor,currentColor) center/100% 1px no-repeat,linear-gradient(currentColor,currentColor) center/1px 100% no-repeat}
.faq details[open] summary::after{background:linear-gradient(currentColor,currentColor) center/100% 1px no-repeat}
.faq .ans{padding:0 0 var(--s-5);max-width:64ch;color:var(--on-paper-2)}
.dark .faq .ans{color:var(--on-ink-2)}

/* ---------- footer ---------- */
footer.site{background:var(--ink-3);border-top:1px solid var(--rule-ink);padding:var(--s-8) 0 0}
.ft-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:var(--s-7);padding-bottom:var(--s-8)}
.ft-brand .logo{margin-bottom:var(--s-5)}
.ft-brand p{font-size:var(--t-sm);color:var(--on-ink-3);max-width:36ch;margin-bottom:var(--s-4)}
.ft-brand .ft-tag{font-family:var(--font-display);font-size:var(--t-lg);line-height:1.25;color:var(--on-ink)}
.ft-col h4{color:var(--bronze);margin-bottom:var(--s-4);padding-top:var(--s-3);border-top:1px solid var(--rule-ink-strong)}
.ft-col li{margin-bottom:var(--s-2)}
.ft-col a,.ft-col span{font-size:var(--t-sm);color:var(--on-ink-2);overflow-wrap:anywhere}
.ft-col a:hover{color:var(--bronze)}
.ft-contact li{display:flex;gap:var(--s-3);align-items:flex-start;min-width:0}
.ft-contact svg{width:15px;height:15px;stroke:var(--bronze);flex:0 0 auto;margin-top:4px}
.ft-accred{border-top:1px solid var(--rule-ink);padding:var(--s-5) 0}
.ft-accred .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3) var(--s-6)}
.ft-accred img{height:44px;width:auto;object-fit:contain}
.ft-accred span{font-family:var(--font-mono);font-size:var(--t-micro);letter-spacing:.09em;text-transform:uppercase;color:var(--on-ink-3)}
.ft-bottom{border-top:1px solid var(--rule-ink);padding:var(--s-5) 0}
.ft-bottom .wrap{display:flex;justify-content:space-between;gap:var(--s-4);flex-wrap:wrap;font-size:var(--t-xs);color:var(--on-ink-3)}
.ft-bottom a:hover{color:var(--bronze)}
.ft-legal{flex-basis:100%;order:-1}
.ft-legal-links{display:flex;flex-wrap:wrap;gap:var(--s-4);flex-basis:100%;order:-1;margin-bottom:var(--s-2)}
.ft-legal-links a{color:var(--on-ink-2)}

/* ---------- reveal ---------- */
/* Gated on .js (set in the head by inc/enqueue.php) so that content is never
   left invisible if the script fails to load or run. */
.js .rv{opacity:0;transform:translateY(16px);transition:opacity var(--dur-slow) var(--ease),transform var(--dur-slow) var(--ease)}
.js .rv.in{opacity:1;transform:none}
.rv-d1{transition-delay:.07s}.rv-d2{transition-delay:.14s}.rv-d3{transition-delay:.21s}

/* ---------- filter tabs (blog index) ---------- */
.gal-filters{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-bottom:var(--s-7)}
.gal-filter{font-family:var(--font-mono);font-size:var(--t-micro);letter-spacing:.09em;text-transform:uppercase;padding:var(--s-2) var(--s-3);border-radius:var(--r);border:1px solid var(--rule-paper-strong);background:none;color:var(--on-paper);cursor:pointer;transition:background var(--dur) var(--ease),color var(--dur) var(--ease)}
.gal-filter:hover,.gal-filter.is-on{background:var(--ink);color:var(--paper)}
.gal-empty{padding:var(--s-7) 0;color:var(--on-paper-2)}

/* ---------- blog ---------- */
.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:var(--s-7) var(--s-6)}
.post-card{display:flex;flex-direction:column;gap:var(--s-3);border-top:1px solid var(--rule-paper-strong);padding-top:var(--s-4)}
.post-card[hidden]{display:none}
.post-card .tag{display:inline-flex;align-items:center;gap:var(--s-2);color:var(--bronze-deep)}
.post-card .tag svg{width:14px;height:14px;stroke:var(--bronze-deep)}
.post-card h3{font-family:var(--font-display);font-size:var(--t-xl);font-weight:500;line-height:1.15;letter-spacing:-.015em;transition:color var(--dur) var(--ease)}
.post-card:hover h3{color:var(--bronze-deep)}
.post-card p{font-size:var(--t-sm);color:var(--on-paper-2);flex:1}
.post-card .read-time{color:var(--on-paper-3)}
.article-hero{background:var(--ink);padding:var(--s-8) 0 var(--s-7);border-bottom:1px solid var(--rule-ink)}
.article-hero h1{font-size:var(--t-3xl);max-width:18ch}
.article-meta{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap;margin-top:var(--s-5);color:var(--on-ink-3)}
.article-meta span{color:var(--bronze)}
.article{background:var(--paper);color:var(--on-paper);padding:var(--s-8) var(--pad)}
.article>*{max-width:68ch;margin-left:auto;margin-right:auto}
.article p{font-size:var(--t-md);line-height:1.7;color:var(--on-paper-2);margin-bottom:var(--s-5)}
.article h2{font-size:var(--t-xl);margin:var(--s-7) auto var(--s-4)}
.article h3{font-size:var(--t-md);margin:var(--s-6) auto var(--s-3)}
.article ul,.article ol{margin:0 auto var(--s-5);padding-left:var(--s-5)}
.article ul li,.article ol li{font-size:var(--t-md);line-height:1.65;color:var(--on-paper-2);margin-bottom:var(--s-2);list-style:disc}
.article ol li{list-style:decimal}
.article strong{color:var(--on-paper);font-weight:600}
.article a,.entry a{color:var(--bronze-deep);text-decoration:underline;text-underline-offset:3px}
.article blockquote{border-left:2px solid var(--bronze);padding-left:var(--s-5);margin:var(--s-6) auto;font-family:var(--font-display);font-style:italic;font-size:var(--t-xl);line-height:1.3;color:var(--on-paper)}
.article .article-note{margin-top:var(--s-7);padding-top:var(--s-4);border-top:1px solid var(--rule-paper);font-size:var(--t-sm);color:var(--on-paper-2)}
.article img{margin:var(--s-6) auto}
.related{padding-top:var(--s-8)}
.related h2{margin-bottom:var(--s-7)}
.article.legal .legal-nav{margin-top:var(--s-8);padding-top:var(--s-5);border-top:1px solid var(--rule-paper-strong)}
.article.legal .legal-nav h2{font-family:var(--font-mono);font-size:var(--t-micro);font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--on-paper-3);margin:0 0 var(--s-3)}
.article.legal .legal-nav ul{display:flex;flex-wrap:wrap;gap:var(--s-5);padding:0;margin:0}
.article.legal .legal-nav li{list-style:none;margin:0}
.pagination{display:flex;justify-content:center;gap:var(--s-2);margin-top:var(--s-8)}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 var(--s-3);border:1px solid var(--rule-paper-strong);border-radius:var(--r);font-family:var(--font-mono);font-size:var(--t-xs);color:var(--on-paper)}
.pagination .page-numbers:hover,.pagination .page-numbers.current{background:var(--ink);color:var(--paper)}

/* ---------- cookie consent ---------- */
.cban{position:fixed;left:var(--s-4);bottom:0;transform:translateY(120%);width:min(480px,calc(100% - 32px));background:var(--paper-2);color:var(--on-paper);border:1px solid var(--ink);border-radius:var(--r);padding:var(--s-5);z-index:120;transition:transform .45s var(--ease);margin-bottom:max(16px,env(safe-area-inset-bottom,0px))}
.cban.show{transform:none}
.cban p{font-size:var(--t-sm);line-height:1.6;color:var(--on-paper-2);margin-bottom:var(--s-4)}
.cban a{color:var(--bronze-deep);text-decoration:underline;text-underline-offset:3px}
.cban-actions{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:center}
.cban .btn{padding:11px 18px;background:var(--ink);color:var(--paper)}
.cban-alt{background:none;border:1px solid var(--rule-paper-strong);color:var(--on-paper);font-family:var(--font-body);font-weight:600;font-size:var(--t-sm);padding:11px 18px;border-radius:var(--r);cursor:pointer}
.cban-alt:hover{background:var(--ink);color:var(--paper)}
.cban-link{background:none;border:0;color:var(--on-paper-2);font-size:var(--t-sm);text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:11px 6px}
.cban-prefs{display:none;margin-top:var(--s-5);padding-top:var(--s-4);border-top:1px solid var(--rule-paper)}
.cban.open-prefs .cban-prefs{display:block}
.cban-prefs h4{font-size:var(--t-sm);font-weight:600;margin-bottom:var(--s-3)}
.cban-cat{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);padding:var(--s-3) 0;border-bottom:1px solid var(--rule-paper)}
.cban-cat b{display:block;font-size:var(--t-sm);font-weight:600}
.cban-cat span{display:block;font-size:var(--t-xs);color:var(--on-paper-3)}
.cban-locked{color:var(--bronze-deep);flex:0 0 auto}
.cban-switch{position:relative;flex:0 0 auto;width:44px;height:24px;cursor:pointer}
.cban-switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.cban-switch .track{position:absolute;inset:0;background:var(--rule-paper);border-radius:24px;transition:background var(--dur) var(--ease)}
.cban-switch .track::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--paper-2);transition:transform var(--dur) var(--ease)}
.cban-switch input:checked+.track{background:var(--ink)}
.cban-switch input:checked+.track::after{transform:translateX(20px)}
.cban-switch input:focus-visible+.track{outline:2px solid var(--bronze-deep);outline-offset:2px}
.js-cookie-settings{background:none;border:0;cursor:pointer}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .usp-grid,.std-grid,.proc-grid,.sectors,.proc-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ft-grid{grid-template-columns:1fr 1fr}
  .e2e-head{grid-template-columns:var(--col-label) minmax(0,1fr)}
  .e2e-head p{grid-column:2;margin-top:var(--s-3)}
  .svc-line{grid-template-columns:48px minmax(0,1fr) auto}
  .svc-line p{grid-column:2;grid-row:2;margin-top:var(--s-2)}
  .svc-go{grid-column:3;grid-row:1}
  .svc-row{grid-template-columns:var(--col-label) minmax(0,1fr)}
  .svc-row .svc-list{grid-column:2;margin-top:var(--s-5)}
  .head-phone{display:none}
}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;min-height:0}
  .hero-route{max-width:440px;margin:0 auto}
  .cta-center{grid-template-columns:1fr}
  .cta-actions{grid-column:1;grid-row:auto;margin-top:var(--s-6)}
}
@media (max-width:840px){
  .about-grid,.cta-grid,.story-grid{grid-template-columns:1fr}
  .about-badge{right:var(--s-3)}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:var(--s-6)}
  .e2e-steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:var(--s-6)}
  nav.main{display:none}
  .burger{display:flex}
  .btn-nav{display:none}
  .topbar .tb-r span:last-child{display:none}
}
@media (max-width:700px){
  /* The label column folds above the content. */
  .sec-head,.trustline,.e2e-head{grid-template-columns:1fr}
  .sec-head .kicker{grid-row:auto;margin-bottom:var(--s-5)}
  .sec-head>.h2,.sec-head>.lede,.trustline h3,.trustline p,.e2e-head p{grid-column:1}
  .trustline::before,.e2e-head::before{grid-row:auto;margin-bottom:var(--s-4)}
  .areas,.faq{margin-left:0}
  .svc-row{grid-template-columns:1fr;row-gap:var(--s-4)}
  .svc-row-head{flex-direction:row;align-items:center}
  .svc-row .svc-list{grid-column:1}
  .hero-trust{grid-template-columns:1fr 1fr}
  .hero-trust div:nth-child(2n){border-right:0}
  .hero-trust div:nth-child(2n+1){padding-left:0}
  .hero-trust div:nth-child(n+3){border-top:1px solid var(--rule-ink)}
}
@media (max-width:620px){
  .usp-grid,.std-grid,.proc-grid,.proc-grid.four,.sectors,.ft-grid{grid-template-columns:1fr}
  .e2e-steps{grid-template-columns:1fr}
  .f-row{grid-template-columns:1fr}
  .svc-line{grid-template-columns:36px minmax(0,1fr)}
  .svc-go{grid-column:2;grid-row:3;margin-top:var(--s-3)}
  .topbar .tb-r{display:none}
  .logo img{width:46px;height:46px}
  .cta-center .cta-lines{flex-direction:column}
  .cta-center .cta-line{border-top:1px solid var(--rule-ink)}
  .cta-center .cta-line:first-child{border-top:0}
  .cban-actions{flex-direction:column;align-items:stretch}
}
/* Touch: comfortable hit areas on coarse pointers, whatever the width. */
@media (pointer:coarse){
  .ft-col a,.ft-bottom a,.crumbs a,.rating-link{display:inline-block;padding:6px 0}
  .ft-col li{margin-bottom:0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .rv{opacity:1;transform:none;transition:none}
  .rt-arc{animation:none;stroke-dashoffset:0}
  .rt-pulse{animation:none;opacity:0}
  .rt-label{animation:none;opacity:1}
  .btn svg,.svc-go svg{transition:none}
}