/* GENERATED by tools/build.py from src/css/main.src.css — do not edit by hand */
/* ============================================================
   TENOR — design system
   Source of truth: Tenor Brandbook (2026, Simonia), 32 pp.
   Every token below is traced to a brandbook page; nothing is invented.
   Build: main.css is generated from this file by tools/build-css.py, which
   inlines the pattern tiles ({{…}} placeholders). Edit THIS file.
   ============================================================ */

/* ---------- fonts (brandbook p.19–22) ----------
   Campton            → Latin display: main titles, numerals          (Book 400 · Medium 500 · Bold 700)
   Helvetica Neue LT GEO → Georgian titles, sub-titles and all body copy (Thin 200 · Roman 400 · Bold 700 · Heavy 800)
   Helvetica GEO Caps → the Mtavruli sub-title cut (p.22 "მთავრული")
   Font files are licensed separately — drop the WOFF2s into assets/fonts/ under the names below.
   Until then every stack falls through to TBC Contractica, which p.19 itself names for
   Georgian copy and which ships with the site. */
/* fallbacks (already shipped) */
@font-face { font-family:"Contractica"; src:url("../fonts/contractica-300.woff2") format("woff2"); font-weight:300; font-display:swap; }
@font-face { font-family:"Contractica"; src:url("../fonts/contractica-400.woff2") format("woff2"); font-weight:400; font-display:swap; }
@font-face { font-family:"Contractica"; src:url("../fonts/contractica-500.woff2") format("woff2"); font-weight:500; font-display:swap; }
@font-face { font-family:"Contractica"; src:url("../fonts/contractica-700.woff2") format("woff2"); font-weight:700; font-display:swap; }
@font-face { font-family:"ContracticaCAPS"; src:url("../fonts/caps-500.woff2") format("woff2"); font-weight:400 500; font-display:swap; }
@font-face { font-family:"ContracticaCAPS"; src:url("../fonts/caps-700.woff2") format("woff2"); font-weight:700; font-display:swap; }

/* ---------- tokens ---------- */
:root {
  /* colour — p.17, with the four tint steps drawn on the same page */
  --ink:#0D0838;  --ink-1:#3F3B61; --ink-2:#706D8A; --ink-3:#A19FB2; --ink-4:#D1D0D9;   /* backgrounds */
  --blue:#005AAB; --blue-1:#347CBC; --blue-2:#699ECD; --blue-3:#9CBFDE; --blue-4:#CFE0EF; /* the logo colour */
  --sun:#FFC373;  --sun-1:#FFCF90; --sun-2:#FFDCAC; --sun-3:#FFE8C9; --sun-4:#FFF4E4;   /* accents only */
  --mist:#E8E8EA;                                   /* the brandbook's label tabs and page band */
  --white:#FFFFFF;
  --ink-raise:#16114A;                              /* ink panels lifted one step off an ink field */
  --error:#C8443A; --error-soft:#F08D80;            /* validation only — never decorative */

  /* type stacks */
  --f-geo:"HelveticaGEO","Contractica","Helvetica Neue",Arial,sans-serif;
  --f-caps:"HelveticaGEOCaps","ContracticaCAPS","HelveticaGEO",sans-serif;
  --f-display:"Campton","Contractica","Helvetica Neue",Arial,sans-serif;

  /* Optical centring for the Mtavruli fallback cut — its line box reserves a descent the
     capitals never use, so centred caps ride high. Campton/Contractica figures need less. */
  --caps-y:.07em; --figs-y:.05em;

  /* geometry — the mark is a pentagon with softened joints; UI corners follow it */
  --r-xs:3px;    /* label tabs (p.4–15 section labels) */
  --r:10px;      /* panels, photos, buttons */
  --r-lg:18px;   /* feature slabs */
  --house:polygon(50% 0, 100% 36%, 100% 80%, 80% 100%, 20% 100%, 0 80%, 0 36%);  /* mark silhouette */

  /* motion */
  --e-out:cubic-bezier(.16,1,.30,1);
  --e-inout:cubic-bezier(.83,0,.17,1);
  --e-soft:cubic-bezier(.22,.61,.36,1);
  --t-quick:180ms; --t-base:300ms; --t-move:480ms;

  /* layout — 8px grid; --u is the spacing module page layouts multiply */
  --u:14px;
  --max:1440px; --gutter:24px; --margin:80px;
  --pad-section:120px;
  --header-h:92px; --header-h-stuck:68px;
}
@media (max-width:1279px){ :root{ --u:12px; --pad-section:96px; --margin:48px; --header-h:84px; } }
@media (max-width:1023px){ :root{ --header-h:76px; --header-h-stuck:62px; } }
@media (max-width:767px){ :root{ --u:10px; --pad-section:64px; --margin:20px; --header-h:70px; --header-h-stuck:58px; } }

/* ---------- base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }

/* smooth scroll — Lenis drives it with a mouse or trackpad (js/app.js); these are its base
   rules. Without Lenis (touch screens), in-page jumps still glide natively, unless the
   visitor's OS asks for reduced motion. */
html.lenis, html.lenis body{ height:auto; }
.lenis.lenis-stopped{ overflow:clip; }
.lenis [data-lenis-prevent]{ overscroll-behavior:contain; }
.lenis.lenis-smooth iframe{ pointer-events:none; }
@media (prefers-reduced-motion: no-preference){ html:not(.lenis){ scroll-behavior:smooth; } }
[id]{ scroll-margin-top:calc(var(--header-h) + 24px); }
body{
  margin:0; background:var(--white); color:var(--ink);
  font-family:var(--f-geo); font-size:16px; line-height:1.6; overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }   /* height:auto — width/height attrs reserve ratio only */
a{ color:inherit; }
::selection{ background:var(--sun); color:var(--ink); }

h1,h2,h3,h4{ margin:0; text-wrap:balance; font-weight:700; }
p{ margin:0 0 12px; max-width:64ch; }

/* width:100% matters: as a flex/grid item, margin-inline:auto would otherwise shrink-wrap */
.container{ width:100%; max-width:var(--max); margin-inline:auto; padding-inline:var(--margin); }
.section{ position:relative; padding-block:var(--pad-section); }
main{ display:block; }

/* ---------- type scale (p.21–22) ---------- */
.display-1{ font-size:clamp(40px,6.4vw,92px); line-height:1.06; font-weight:700; letter-spacing:-.015em; }
.display-2{ font-size:clamp(32px,4.6vw,64px); line-height:1.1; font-weight:700; letter-spacing:-.01em; }

/* THE TITLE VOICE — p.21: Georgian main titles are Helvetica Neue LT GEO Bold, set in
   mkhedruli (not Mtavruli). Line breaks are authored by hand with <br>. */
.title-stack{
  font-family:var(--f-geo); font-weight:700;
  font-size:clamp(28px,3.3vw,50px); line-height:1.16; letter-spacing:-.012em;
  text-wrap:initial; margin:0; max-width:none !important;
}
.title-stack--lg{ font-size:clamp(32px,4.4vw,66px); line-height:1.1; }
.title-stack--sm{ font-size:clamp(21px,2.1vw,30px); line-height:1.24; }
.title-stack .lo{ font-weight:400; color:var(--ink-2); }
.title-stack .cream, .title-stack .sun{ color:var(--sun); }
.title-stack .blue{ color:var(--blue); }
.on-ink .title-stack{ color:#fff; }
.on-ink .title-stack .lo{ color:var(--ink-3); }
.on-blue .title-stack .lo{ color:var(--blue-4); }
.h3{ font-size:clamp(24px,2.6vw,38px); line-height:1.22; }
.h4{ font-size:clamp(19px,1.9vw,26px); line-height:1.32; font-weight:700; }
.body-lg{ font-size:clamp(17px,1.3vw,20px); line-height:1.6; color:var(--ink-1); }
.on-ink .body-lg{ color:rgba(255,255,255,.78); }
.small{ font-size:13.5px; }
/* p.22 — sub-titles in Mtavruli Helvetica */
.caps{ font-family:var(--f-caps); font-weight:400; letter-spacing:.06em; }
/* Latin display + numerals — Campton (p.20, p.22) */
.num{ font-family:var(--f-display); font-weight:500; }
.num-xb{ font-family:var(--f-display); font-weight:700; }
.en-title{ font-family:var(--f-display); font-weight:700; text-transform:uppercase; letter-spacing:.01em; }

/* ---------- section contexts (p.18 colour pairing rules) ----------
   ink  → may carry blue + yellow (+ white details)
   blue → may carry ink + yellow (+ white)
   sun  → may carry ink + blue (+ white)                                       */
.on-ink{ background:var(--ink); color:#fff; }
.on-ink p{ color:rgba(255,255,255,.78); }
.on-blue{ background:var(--blue); color:#fff; }
.on-blue p{ color:rgba(255,255,255,.86); }
.on-sun{ background:var(--sun); color:var(--ink); }
.on-mist{ background:var(--mist); }
.on-tint{ background:linear-gradient(180deg, #F4F4F6, #fff); }

/* layered sections: content is lifted above the decoration. Zero specificity (:where) so
   any absolutely-positioned device (.t-pattern, .t-render, .watermark…) keeps its own rules. */
:where(.layered) > *{ position:relative; z-index:2; }

/* ---------- brand devices ---------- */

/* SECTION LABEL — the grey tab with a dark tick that heads every brandbook spread (p.4–27) */
.t-label{
  display:inline-flex; align-items:center; gap:10px; min-width:min(230px,100%);
  margin:0 0 22px; padding:7px 16px 7px 0; border-radius:var(--r-xs);
  background:var(--mist); color:var(--ink);
  font-family:var(--f-geo); font-weight:700; font-size:13px; line-height:1.2; letter-spacing:.01em;
}
.t-label::before{ content:""; width:4px; align-self:stretch; margin-block:-3px; border-radius:2px 0 0 2px;
  background:var(--ink); flex:none; }
.on-ink .t-label{ background:rgba(255,255,255,.08); color:#fff; }
.on-ink .t-label::before{ background:var(--blue); }
.on-blue .t-label{ background:rgba(13,8,56,.22); color:#fff; }
.on-blue .t-label::before{ background:var(--sun); }

/* PAGE BAND — the brandbook's running footer (grey band, mark left, breadcrumb right) */
.t-band{ display:flex; align-items:center; gap:16px; min-height:46px; padding:0 var(--margin);
  background:var(--mist); color:var(--ink-1); font-size:12.5px; }
.t-band .mk{ width:30px; height:30px; flex:none; margin-top:-6px; }
.t-band .crumb{ margin-left:auto; }

/* HOUSE CONTOUR — p.13: the outline version, "a watermark or a decoration" */
.watermark, .t-contour{ position:absolute; pointer-events:none; z-index:0;
  fill:none; stroke:currentColor; color:rgba(0,90,171,.38); }
.watermark path, .t-contour path{ vector-effect:non-scaling-stroke; stroke-width:1.5; }
.on-ink .watermark, .on-ink .t-contour{ color:rgba(0,90,171,.75); }
.on-blue .watermark, .on-blue .t-contour{ color:rgba(255,255,255,.28); }
.watermark--light{ color:var(--blue-4); }
.contour{ fill:none; }
.wm-fade::before{ display:none; }   /* the MFB tonal mark needed a fade; the contour doesn't */

/* PATTERN — p.23 contour / p.24 filled / p.25–26 usage (always fragmentary) */
.t-pattern{ position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19.988 12.384' width='19.988' height='12.384'%3E%3Cg fill='none' stroke='%23005AAB' stroke-width='0.42' stroke-linejoin='round'%3E%3Cg transform='translate%280 -12.384%29'%3E%3Cpath d='M17.945 18.387L19.456 17.132C19.667 16.956 19.822 16.727 19.909 16.473C19.961 16.321 19.988 16.16 19.988 15.995L19.988 7.744C19.988 7.561 19.902 7.389 19.755 7.279L19.639 7.192C19.637 7.191 19.636 7.19 19.634 7.188L19.578 7.147L9.994 0L0.41 7.147L0.354 7.188C0.353 7.19 0.351 7.191 0.349 7.192L0.233 7.279C0.087 7.389 0 7.561 0 7.744L0 15.995C0 16.16 0.028 16.321 0.08 16.473C0.166 16.727 0.322 16.956 0.532 17.132L2.03 18.375'/%3E%3Cpath d='M7.946 13.912L7.946 9.919L3.973 9.919L9.995 5.434L16.016 9.919L12.002 9.919L12.002 13.899'/%3E%3C/g%3E%3Cg transform='translate%280 0%29'%3E%3Cpath d='M17.945 18.387L19.456 17.132C19.667 16.956 19.822 16.727 19.909 16.473C19.961 16.321 19.988 16.16 19.988 15.995L19.988 7.744C19.988 7.561 19.902 7.389 19.755 7.279L19.639 7.192C19.637 7.191 19.636 7.19 19.634 7.188L19.578 7.147L9.994 0L0.41 7.147L0.354 7.188C0.353 7.19 0.351 7.191 0.349 7.192L0.233 7.279C0.087 7.389 0 7.561 0 7.744L0 15.995C0 16.16 0.028 16.321 0.08 16.473C0.166 16.727 0.322 16.956 0.532 17.132L2.03 18.375'/%3E%3Cpath d='M7.946 13.912L7.946 9.919L3.973 9.919L9.995 5.434L16.016 9.919L12.002 9.919L12.002 13.899'/%3E%3C/g%3E%3Cg transform='translate%280 12.384%29'%3E%3Cpath d='M17.945 18.387L19.456 17.132C19.667 16.956 19.822 16.727 19.909 16.473C19.961 16.321 19.988 16.16 19.988 15.995L19.988 7.744C19.988 7.561 19.902 7.389 19.755 7.279L19.639 7.192C19.637 7.191 19.636 7.19 19.634 7.188L19.578 7.147L9.994 0L0.41 7.147L0.354 7.188C0.353 7.19 0.351 7.191 0.349 7.192L0.233 7.279C0.087 7.389 0 7.561 0 7.744L0 15.995C0 16.16 0.028 16.321 0.08 16.473C0.166 16.727 0.322 16.956 0.532 17.132L2.03 18.375'/%3E%3Cpath d='M7.946 13.912L7.946 9.919L3.973 9.919L9.995 5.434L16.016 9.919L12.002 9.919L12.002 13.899'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); background-size:40px auto; opacity:.12; }
.on-ink .t-pattern{ opacity:.32; }
.t-pattern--fade{ -webkit-mask-image:radial-gradient(120% 90% at 85% 15%, #000 0%, transparent 62%);
                          mask-image:radial-gradient(120% 90% at 85% 15%, #000 0%, transparent 62%); }
/* the p.25 strip: a band of filled houses along an ink edge */
.t-strip{ height:28px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19.988 12.384' width='19.988' height='12.384'%3E%3Cg transform='translate%280 -12.384%29'%3E%3Cpath fill='%23005AAB' d='M17.945 18.387L19.456 17.132C19.667 16.956 19.822 16.727 19.909 16.473C19.961 16.321 19.988 16.16 19.988 15.995L19.988 7.744C19.988 7.561 19.902 7.389 19.755 7.279L19.639 7.192C19.637 7.191 19.636 7.19 19.634 7.188L19.578 7.147L9.994 0L0.41 7.147L0.354 7.188C0.353 7.19 0.351 7.191 0.349 7.192L0.233 7.279C0.087 7.389 0 7.561 0 7.744L0 15.995C0 16.16 0.028 16.321 0.08 16.473C0.166 16.727 0.322 16.956 0.532 17.132L2.03 18.375Z'/%3E%3Cpath fill='%230D0838' d='M7.946 13.912L7.946 9.919L3.973 9.919L9.995 5.434L16.016 9.919L12.002 9.919L12.002 13.912Z'/%3E%3C/g%3E%3Cg transform='translate%280 0%29'%3E%3Cpath fill='%23005AAB' d='M17.945 18.387L19.456 17.132C19.667 16.956 19.822 16.727 19.909 16.473C19.961 16.321 19.988 16.16 19.988 15.995L19.988 7.744C19.988 7.561 19.902 7.389 19.755 7.279L19.639 7.192C19.637 7.191 19.636 7.19 19.634 7.188L19.578 7.147L9.994 0L0.41 7.147L0.354 7.188C0.353 7.19 0.351 7.191 0.349 7.192L0.233 7.279C0.087 7.389 0 7.561 0 7.744L0 15.995C0 16.16 0.028 16.321 0.08 16.473C0.166 16.727 0.322 16.956 0.532 17.132L2.03 18.375Z'/%3E%3Cpath fill='%230D0838' d='M7.946 13.912L7.946 9.919L3.973 9.919L9.995 5.434L16.016 9.919L12.002 9.919L12.002 13.912Z'/%3E%3C/g%3E%3Cg transform='translate%280 12.384%29'%3E%3Cpath fill='%23005AAB' d='M17.945 18.387L19.456 17.132C19.667 16.956 19.822 16.727 19.909 16.473C19.961 16.321 19.988 16.16 19.988 15.995L19.988 7.744C19.988 7.561 19.902 7.389 19.755 7.279L19.639 7.192C19.637 7.191 19.636 7.19 19.634 7.188L19.578 7.147L9.994 0L0.41 7.147L0.354 7.188C0.353 7.19 0.351 7.191 0.349 7.192L0.233 7.279C0.087 7.389 0 7.561 0 7.744L0 15.995C0 16.16 0.028 16.321 0.08 16.473C0.166 16.727 0.322 16.956 0.532 17.132L2.03 18.375Z'/%3E%3Cpath fill='%230D0838' d='M7.946 13.912L7.946 9.919L3.973 9.919L9.995 5.434L16.016 9.919L12.002 9.919L12.002 13.912Z'/%3E%3C/g%3E%3C/svg%3E"); background-size:34px auto;
  background-position:0 0; background-color:var(--ink); }
.t-strip--light{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19.988 12.384' width='19.988' height='12.384'%3E%3Cg transform='translate%280 -12.384%29'%3E%3Cpath fill='%23CFE0EF' d='M17.945 18.387L19.456 17.132C19.667 16.956 19.822 16.727 19.909 16.473C19.961 16.321 19.988 16.16 19.988 15.995L19.988 7.744C19.988 7.561 19.902 7.389 19.755 7.279L19.639 7.192C19.637 7.191 19.636 7.19 19.634 7.188L19.578 7.147L9.994 0L0.41 7.147L0.354 7.188C0.353 7.19 0.351 7.191 0.349 7.192L0.233 7.279C0.087 7.389 0 7.561 0 7.744L0 15.995C0 16.16 0.028 16.321 0.08 16.473C0.166 16.727 0.322 16.956 0.532 17.132L2.03 18.375Z'/%3E%3Cpath fill='%23FFFFFF' d='M7.946 13.912L7.946 9.919L3.973 9.919L9.995 5.434L16.016 9.919L12.002 9.919L12.002 13.912Z'/%3E%3C/g%3E%3Cg transform='translate%280 0%29'%3E%3Cpath fill='%23CFE0EF' d='M17.945 18.387L19.456 17.132C19.667 16.956 19.822 16.727 19.909 16.473C19.961 16.321 19.988 16.16 19.988 15.995L19.988 7.744C19.988 7.561 19.902 7.389 19.755 7.279L19.639 7.192C19.637 7.191 19.636 7.19 19.634 7.188L19.578 7.147L9.994 0L0.41 7.147L0.354 7.188C0.353 7.19 0.351 7.191 0.349 7.192L0.233 7.279C0.087 7.389 0 7.561 0 7.744L0 15.995C0 16.16 0.028 16.321 0.08 16.473C0.166 16.727 0.322 16.956 0.532 17.132L2.03 18.375Z'/%3E%3Cpath fill='%23FFFFFF' d='M7.946 13.912L7.946 9.919L3.973 9.919L9.995 5.434L16.016 9.919L12.002 9.919L12.002 13.912Z'/%3E%3C/g%3E%3Cg transform='translate%280 12.384%29'%3E%3Cpath fill='%23CFE0EF' d='M17.945 18.387L19.456 17.132C19.667 16.956 19.822 16.727 19.909 16.473C19.961 16.321 19.988 16.16 19.988 15.995L19.988 7.744C19.988 7.561 19.902 7.389 19.755 7.279L19.639 7.192C19.637 7.191 19.636 7.19 19.634 7.188L19.578 7.147L9.994 0L0.41 7.147L0.354 7.188C0.353 7.19 0.351 7.191 0.349 7.192L0.233 7.279C0.087 7.389 0 7.561 0 7.744L0 15.995C0 16.16 0.028 16.321 0.08 16.473C0.166 16.727 0.322 16.956 0.532 17.132L2.03 18.375Z'/%3E%3Cpath fill='%23FFFFFF' d='M7.946 13.912L7.946 9.919L3.973 9.919L9.995 5.434L16.016 9.919L12.002 9.919L12.002 13.912Z'/%3E%3C/g%3E%3C/svg%3E"); background-color:var(--blue-4); }

/* 3D RENDERS — p.27 "décor": the mark rendered in concrete / glass / dark stone */
.t-render{ position:absolute; pointer-events:none; z-index:1; height:auto; user-select:none; }

/* hairline rule + progress fill (fill is bound to section scroll in app.js) */
.rule{ position:relative; display:flex; align-items:center; gap:14px; min-height:1px; margin-top:44px; }
.rule::before{ content:""; position:absolute; top:0; left:0; right:0; height:1px; background:currentColor; opacity:.14; }
.rule .fill{ position:absolute; top:0; left:0; width:100%; height:2px; margin-top:-.5px;
  background:var(--blue); transform:scaleX(0); transform-origin:left center; }
.on-ink .rule .fill{ background:var(--sun); }
.rule--quiet::before{ opacity:.1; }

/* dotted leader — kept for spec rows */
.leader{ flex:1; height:2px; align-self:center; min-width:24px;
  background:radial-gradient(circle, currentColor 1px, transparent 1px);
  background-size:8px 2px; background-repeat:repeat-x; opacity:.3; }

/* photo frame */
.crop{ position:relative; overflow:hidden; border-radius:var(--r); background:var(--mist); }
.crop img{ width:100%; height:100%; object-fit:cover; }
/* the house crop — reserved for one hero-scale image per page */
.crop--house{ border-radius:0; clip-path:var(--house); }

/* big translucent arrow overlay (the arrow inside the mark) */
.arrow-block{ position:absolute; pointer-events:none; opacity:.16; }
.arrow-block svg{ width:100%; height:100%; display:block; }
.arrow-block, .arrow-block svg{ color:var(--blue); }
.arrow-block--cream, .arrow-block--cream svg, svg.arrow-block--cream{ color:var(--sun); opacity:.5; }
.arrow-block--navy, .arrow-block--navy svg, svg.arrow-block--navy{ color:var(--blue); }

/* panels on ink / over photos (replace MFB glassmorphism — Tenor's glass lives in renders) */
.glass-navy{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); }
.glass-photo{ background:rgba(13,8,56,.72); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }

/* PROJECT FEATURE — two-project editorial layout */
.pf{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(28px,4.5vw,80px); align-items:center; }
.pf + .pf{ margin-top:clamp(64px,9vw,140px); }
.pf:nth-of-type(even) .pf-media{ order:2; }
.pf-media{ position:relative; }
.pf-media .crop{ aspect-ratio:4/5; }
.pf-idx{ font-family:var(--f-display); font-weight:700; font-size:clamp(38px,5.4vw,86px);
  line-height:1; color:var(--blue-4); display:block; margin-bottom:18px; }
.on-ink .pf-idx{ color:var(--blue); }
.pf-body h2, .pf-body h3{ margin-bottom:clamp(16px,1.7vw,22px); }
.pf-meta{ margin:26px 0 30px; display:grid; gap:0; max-width:440px; }
.pf-meta div{ display:flex; align-items:baseline; gap:12px; padding:11px 0;
  border-top:1px solid var(--ink-4); font-size:14px; }
.on-ink .pf-meta div{ border-top-color:rgba(255,255,255,.12); }
.pf-meta .k{ color:var(--ink-2); }
.on-ink .pf-meta .k{ color:var(--ink-3); }
.pf-meta .v{ margin-left:auto; font-weight:700; }
.pf-meta .v.cream{ color:var(--sun); }
@media (max-width:860px){
  .pf{ grid-template-columns:1fr; gap:26px; }
  .pf:nth-of-type(even) .pf-media{ order:0; }
  .pf-media .crop{ aspect-ratio:3/2; }
}
.roster-note{ max-width:44ch; font-size:clamp(16px,1.35vw,19px); }

/* quote bar */
.quote-bar{ position:relative; padding-left:26px; max-width:56ch; }
.quote-bar::before{ content:""; position:absolute; left:0; top:4px; bottom:4px; width:4px; border-radius:2px; background:var(--sun); }

/* ---------- interactive components ---------- */

/* underline sweep */
.u-sweep{ text-decoration:none; padding-bottom:3px;
  background-image:linear-gradient(currentColor, currentColor);
  background-size:100% 1.5px; background-repeat:no-repeat; background-position:0 100%;
  transition:background-size var(--t-base) var(--e-out); }
.u-sweep:hover{ background-size:0 1.5px; background-position:100% 100%; }

/* links */
.link{
  position:relative; display:inline-flex; align-items:center; gap:8px; text-decoration:none;
  font-family:var(--f-geo); font-weight:700; font-size:14.5px; padding-bottom:4px; white-space:nowrap;
}
.link::after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:2px; border-radius:1px;
  background:var(--blue); transform:scaleX(0); transform-origin:left center;
  transition:transform var(--t-base) var(--e-out); }
.on-ink .link::after, .on-blue .link::after{ background:var(--sun); }
.link:hover::after{ transform:scaleX(1); }
.site-nav .link{ font-size:14px; font-weight:400; padding-bottom:0; opacity:.7;
  transition:opacity var(--t-quick) var(--e-out); }
.site-nav .link::after{ bottom:-8px; height:3px; }
.site-nav .link:hover{ opacity:1; }
.site-nav .link[aria-current="page"]{ opacity:1; font-weight:700; }
.site-nav .link[aria-current="page"]::after{ transform:scaleX(1); }
@media (max-width:1330px){ .site-nav{ gap:18px; } .site-nav .link{ font-size:13.5px; } }

/* arrows — the solid arrow from inside the mark; colour comes from `color` */
.arw{ fill:currentColor; stroke:none; }
.link .arw{ width:14px; height:14px; color:var(--blue); transition:transform var(--t-quick) var(--e-out); }
.on-ink .link .arw, .on-blue .link .arw{ color:var(--sun); }
.link:hover .arw{ transform:translateX(3px); }

/* buttons — rounded rectangle; the arrow sits in a circle that floods the button on hover.
   --exp (the flood scale) is measured per button in app.js. */
.btn{
  --circ:38px; --circ-inset:7px; --circ-gap:14px; --arw:16px; --exp:1;
  position:relative; display:inline-flex; align-items:center;
  height:52px; border-radius:var(--r); border:0; cursor:pointer;
  padding:0 calc(var(--circ) + var(--circ-inset) + var(--circ-gap)) 0 24px;
  font-family:var(--f-geo); font-weight:700; font-size:15px; letter-spacing:.005em;
  text-decoration:none; overflow:hidden; white-space:nowrap;
  transition:background-color var(--t-quick) var(--e-out), box-shadow var(--t-quick) var(--e-out), transform var(--t-quick) var(--e-out);
}
.btn::before{ content:""; position:absolute; z-index:0;
  right:var(--circ-inset); top:50%; width:var(--circ); height:var(--circ);
  margin-top:calc(var(--circ) / -2); border-radius:50%;
  transform:scale(1); transform-origin:center center; transition:transform .58s var(--e-out); }
.btn:hover::before{ transform:scale(var(--exp)); }
.btn > span{ position:relative; z-index:2; }
.btn > span::after{ content:attr(data-label); position:absolute; left:0; top:0; white-space:nowrap; pointer-events:none;
  clip-path:circle(calc(var(--circ) / 2) at calc(100% + var(--circ-gap) + var(--circ) / 2) 50%);
  transition:clip-path .58s var(--e-out); }
.btn:hover > span::after{
  clip-path:circle(calc(var(--circ) / 2 * var(--exp)) at calc(100% + var(--circ-gap) + var(--circ) / 2) 50%); }
.btn .arw{ position:absolute; z-index:2; width:var(--arw); height:var(--arw);
  right:calc(var(--circ-inset) + (var(--circ) - var(--arw)) / 2); top:50%; margin-top:calc(var(--arw) / -2);
  transition:transform var(--t-quick) var(--e-out); }
.btn:hover .arw{ transform:translateX(2px); }
.btn:active{ transform:scale(.98); }
.btn:not(:has(.arw)){ padding-right:24px; }
.btn:not(:has(.arw))::before{ display:none; }

/* primary — the logo blue; floods to ink */
.btn--primary{ background:var(--blue); color:#fff; }
.btn--primary::before{ background:var(--ink); }
.btn--primary .arw{ color:#fff; }
.btn--primary > span::after{ color:#fff; }
/* sun — the accent button for ink and blue fields; floods to blue (p.18: blue on yellow) */
.btn--sun, .btn--cream{ background:var(--sun); color:var(--ink); }
.btn--sun::before, .btn--cream::before{ background:var(--blue); }
.btn--sun .arw, .btn--cream .arw{ color:#fff; }
.btn--sun > span::after, .btn--cream > span::after{ color:#fff; }
.on-blue .btn--sun::before, .on-blue .btn--cream::before{ background:var(--ink); }
/* ghost on dark */
.btn--ghost{ background:transparent; color:#fff; box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.32); }
.btn--ghost::before{ background:var(--sun); }
.btn--ghost .arw{ color:var(--ink); }
.btn--ghost > span::after{ color:var(--ink); }
.btn--ghost:hover{ box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.6); }
/* ghost on light */
.btn--ghost.btn--on-light{ color:var(--ink); box-shadow:inset 0 0 0 1.5px var(--ink-4); }
.btn--ghost.btn--on-light::before{ background:var(--blue); }
.btn--ghost.btn--on-light .arw{ color:#fff; }
.btn--ghost.btn--on-light > span::after{ color:#fff; }
.btn--ghost.btn--on-light:hover{ box-shadow:inset 0 0 0 1.5px var(--blue); }

.btn[aria-busy="true"]{ pointer-events:none; }
.btn[aria-busy="true"] span{ opacity:.45; }
.btn[disabled]{ background:var(--ink-4); color:var(--ink-2); pointer-events:none; }
.btn[disabled]::before{ display:none; }

/* focus */
:focus-visible{ outline:2px solid var(--blue); outline-offset:3px; border-radius:2px; }
.on-ink :focus-visible, .on-blue :focus-visible, .site-footer :focus-visible{ outline-color:var(--sun); }
.btn:focus-visible{ border-radius:var(--r); }

/* filter chips */
.chip{ display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 18px;
  border-radius:var(--r); background:var(--mist); cursor:pointer; border:0; color:var(--ink-1);
  font-family:var(--f-geo); font-weight:700; font-size:13.5px;
  transition:background-color var(--t-quick), color var(--t-quick); }
.chip:hover{ background:var(--ink-4); color:var(--ink); }
.chip .arw{ width:0; height:12px; color:var(--sun); overflow:hidden; transition:width var(--t-quick) var(--e-out); }
.chip[aria-pressed="true"]{ background:var(--ink); color:#fff; }
.chip[aria-pressed="true"] .arw{ width:12px; }

/* cards */
.card{ position:relative; display:block; text-decoration:none; color:inherit;
  transition:transform var(--t-base) var(--e-out), box-shadow var(--t-base) var(--e-out); }
.card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px rgba(13,8,56,.08), 0 3px 10px rgba(13,8,56,.04); }
html:not(.js) .card:hover .crop img{ transform:scale(1.05); transition:transform .6s var(--e-out); }
.card .caption{ background:var(--ink); color:#fff; padding:16px 20px;
  display:flex; align-items:baseline; gap:12px; position:relative; overflow:hidden; }
.card .caption h3{ font-weight:700; font-size:17px; }
.card .caption .sub{ color:var(--ink-3); font-size:13px; }
.card .caption .tag{ margin-left:auto; color:var(--sun); font-size:12px; font-weight:700; }
.card--service{ border-radius:var(--r); padding:28px; }

/* blog cards — plate, rule, meta, title */
.blog-card{ display:block; }
.blog-card:hover{ transform:none; box-shadow:none; }
.blog-card .crop{ aspect-ratio:4/5; }
.blog-card .b-rule{ position:relative; height:2px; margin-top:20px; overflow:hidden; border-radius:1px; }
.blog-card .b-rule::before{ content:""; position:absolute; inset:0; background:var(--ink-4); }
.blog-card .b-rule .fill{ position:absolute; inset:0; background:var(--blue);
  transform:scaleX(0); transform-origin:left center; transition:transform .55s var(--e-out); }
.blog-card:hover .b-rule .fill{ transform:scaleX(1); }
.blog-card .b-meta{ display:flex; align-items:baseline; gap:14px; margin:13px 0 10px; }
.blog-card .b-cat{ font-weight:700; font-size:12.5px; color:var(--blue); transition:color .4s var(--e-out); }
.blog-card:hover .b-cat{ color:var(--ink); }
.blog-card .b-date{ margin-left:auto; font-family:var(--f-display); font-weight:400; font-size:12.5px; color:var(--ink-2); }
.blog-card h3{ font-size:19px; line-height:1.38; font-weight:700; max-width:28ch; }
.on-ink .blog-card .b-rule::before{ background:rgba(255,255,255,.16); }
.on-ink .blog-card .b-rule .fill{ background:var(--sun); }
.on-ink .blog-card .b-cat{ color:var(--sun); }
.on-ink .blog-card:hover .b-cat{ color:#fff; }
.on-ink .blog-card .b-date{ color:var(--ink-3); }

/* form fields — p.19–22 specimen boxes: soft grey panels */
.field{ position:relative; padding-top:24px; margin-bottom:30px; }
.field label{ position:absolute; top:0; left:0; font-weight:700; font-size:13px; color:var(--ink-1); }
.field input, .field select, .field textarea{
  width:100%; border:1.5px solid transparent; background:#F2F2F4; border-radius:var(--r);
  font:inherit; color:var(--ink); padding:13px 16px; outline:0;
  transition:border-color var(--t-quick) var(--e-out), background-color var(--t-quick) var(--e-out); }
.field input:hover, .field textarea:hover{ background:var(--mist); }
.field input:focus, .field textarea:focus, .field select:focus{ background:#fff; border-color:var(--blue); }
.field input::placeholder, .field textarea::placeholder{ color:var(--ink-3); }
.field .focus-line{ display:none; }
.field.is-error input, .field.is-error textarea, .field.is-error .phone-row{ border-color:var(--error); background:#fff; }
.field .msg{ display:none; position:absolute; top:calc(100% + 6px); left:2px; margin:0;
  font-size:12.5px; font-weight:700; color:var(--error); }
.field.is-error .msg{ display:block; }
/* fields on ink */
.on-ink .field label, .call-card .field label{ color:rgba(255,255,255,.72); }
.on-ink .field input, .on-ink .field textarea, .call-card .field input{ background:rgba(255,255,255,.07); color:#fff; }
.on-ink .field input:focus, .on-ink .field textarea:focus{ background:rgba(255,255,255,.1); border-color:var(--sun); }

/* phone field — country selector + national number share one box */
.field--phone .phone-row{ display:flex; align-items:center; gap:10px; padding-left:14px;
  background:#F2F2F4; border:1.5px solid transparent; border-radius:var(--r);
  transition:border-color var(--t-quick) var(--e-out), background-color var(--t-quick) var(--e-out); }
.field--phone .phone-row:focus-within{ background:#fff; border-color:var(--blue); }
.field--phone input{ border:0 !important; background:transparent !important; flex:1; min-width:0; padding-left:4px; }
.cc-btn{ display:flex; align-items:center; gap:7px; padding:10px 8px 10px 0; border:0; background:none;
  cursor:pointer; font:inherit; color:inherit; flex:none; border-right:1px solid var(--ink-4); }
.cc-flag{ width:20px; height:20px; border-radius:50%; flex:none; display:block; }
.cc-dial{ font-family:var(--f-display); font-weight:500; font-size:14px; }
.cc-chev{ width:9px; height:9px; flex:none; opacity:.5; transition:transform var(--t-quick) var(--e-out); }
.cc-btn[aria-expanded="true"] .cc-chev{ transform:rotate(180deg); }
.cc-list{ position:absolute; z-index:30; top:calc(100% + 6px); left:0; width:min(310px,100%);
  max-height:262px; overflow-y:auto; margin:0; padding:6px; list-style:none;
  background:#fff; border:1px solid var(--ink-4); border-radius:var(--r);
  box-shadow:0 18px 40px rgba(13,8,56,.12), 0 3px 10px rgba(13,8,56,.04); }
.cc-list[hidden]{ display:none; }
.field--phone.is-open{ z-index:20; }   /* the open list sits above the fields that follow */
.cc-list li{ display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:6px; cursor:pointer; font-size:14px; }
.cc-list li:hover, .cc-list li[aria-selected="true"], .cc-list li.is-active{ background:var(--blue-4); }
.cc-list .cc-name{ flex:1; }
.cc-list .cc-code{ font-family:var(--f-display); font-size:13px; color:var(--ink-2); }
.call-card .field--phone .phone-row, .on-ink .field--phone .phone-row{ background:rgba(255,255,255,.07); }
.call-card .cc-btn, .on-ink .cc-btn{ border-right-color:rgba(255,255,255,.18); }
.call-card .cc-list, .on-ink .cc-list{ background:var(--ink-raise); border-color:rgba(255,255,255,.14); color:#fff; }
.call-card .cc-list li:hover, .call-card .cc-list li.is-active,
.on-ink .cc-list li:hover, .on-ink .cc-list li.is-active{ background:rgba(255,255,255,.08); }
.call-card .cc-list .cc-code, .on-ink .cc-list .cc-code{ color:var(--ink-3); }
.call-card .field .msg, .on-ink .field .msg{ color:var(--error-soft); }

/* FAQ accordion */
.acc{ border-bottom:1px solid var(--ink-4); }
.acc button.acc-head{ display:flex; width:100%; align-items:center; gap:16px; background:none; border:0;
  padding:24px 2px; cursor:pointer; text-align:left; font:inherit; color:inherit; min-height:72px; }
.acc .idx{ font-family:var(--f-display); font-weight:500; font-size:13px; color:var(--blue); flex:none; }
.acc .q{ font-weight:700; font-size:17.5px; }
.acc .pm{ position:relative; width:32px; height:32px; margin-left:auto; flex:none; border-radius:8px;
  background:var(--mist); transition:background-color var(--t-base) var(--e-out); }
.acc .pm::before,.acc .pm::after{ content:""; position:absolute; top:50%; left:50%; width:12px; height:2px;
  border-radius:1px; background:var(--ink); translate:-50% -50%; transition:rotate var(--t-base) var(--e-inout), background-color var(--t-base); }
.acc .pm::after{ rotate:90deg; }
.acc[data-open="true"] .pm{ background:var(--blue); }
.acc[data-open="true"] .pm::before, .acc[data-open="true"] .pm::after{ background:#fff; }
.acc[data-open="true"] .pm::before{ rotate:180deg; }
.acc[data-open="true"] .pm::after{ rotate:180deg; }
.acc .acc-body{ overflow:hidden; height:0; }
.acc .acc-inner{ padding:0 2px 28px; color:var(--ink-1); max-width:64ch; }

/* ---------- header ---------- */
.site-header{ position:fixed; top:0; left:0; right:0; z-index:100; color:var(--ink);
  padding:0; transition:padding .32s var(--e-out); }
.site-header.is-stuck{ padding:12px clamp(12px,1.6vw,24px) 0; }
.header-shell{ position:relative; max-width:var(--max); margin-inline:auto;
  height:var(--header-h); display:flex; align-items:center; gap:clamp(20px,2.4vw,40px);
  padding-inline:var(--margin);
  transition:height .32s var(--e-out), padding-inline .32s var(--e-out); }
.site-header.is-stuck .header-shell{ height:var(--header-h-stuck); padding-inline:clamp(22px,2.6vw,36px); }
.header-shell > *{ position:relative; z-index:1; }
.header-shell::before{ content:""; position:absolute; inset:0; opacity:0; pointer-events:none; z-index:0;
  background:rgba(255,255,255,.9);
  -webkit-backdrop-filter:blur(18px) saturate(160%); backdrop-filter:blur(18px) saturate(160%);
  border-radius:var(--r-lg); box-shadow:0 14px 44px rgba(13,8,56,.10);
  transition:opacity .32s var(--e-out); }
.site-header.is-stuck .header-shell::before{ opacity:1; }
.site-header[data-theme="dark"]{ color:#fff; }
.site-header[data-theme="dark"] .header-shell::before{ background:rgba(13,8,56,.82); box-shadow:0 14px 44px rgba(0,0,0,.3); }
/* lockup: gradient mark (raster, from the brandbook) + vector wordmark in currentColor */
.logo-lockup{ display:block; height:36px; position:relative; text-decoration:none;
  transition:height .32s var(--e-out); }
.site-header.is-stuck .logo-lockup{ height:30px; }
@media (max-width:1023px){ .logo-lockup{ height:30px; } .site-header.is-stuck .logo-lockup{ height:28px; } }
.logo-lockup svg{ height:100%; width:auto; fill:currentColor; display:block; overflow:visible; }
.site-nav{ display:flex; gap:clamp(18px,2vw,32px); margin-left:auto; align-items:center; }
.header-cta{ display:flex; align-items:center; gap:clamp(16px,1.8vw,26px); }
.header-cta::before{ content:""; width:1px; height:22px; background:currentColor; opacity:.16; }

/* language switcher */
.lang{ display:flex; gap:2px; align-items:center; padding:3px; border-radius:8px;
  background:rgba(13,8,56,.06); font-family:var(--f-display); font-weight:500; font-size:12px; }
.site-header[data-theme="dark"] .lang, .is-menu-open .lang, .m-foot .lang{ background:rgba(255,255,255,.1); }
.lang a{ text-decoration:none; opacity:.55; padding:6px 9px; line-height:1; border-radius:6px;
  transition:opacity var(--t-quick) var(--e-out), background-color var(--t-quick) var(--e-out); }
.lang a:hover{ opacity:.9; }
.lang a[aria-current="true"]{ opacity:1; background:#fff; color:var(--ink); }
.btn--nav{ --circ:30px; --circ-inset:6px; --circ-gap:12px; --arw:13px;
  height:44px; padding-left:18px; font-size:14px; }
.site-header.is-stuck .btn--nav{ height:42px; }
.m-tools{ display:none; }
/* header CTA on ink: the yellow accent (p.18) */
.site-header[data-theme="dark"] .btn--nav{ background:var(--sun); color:var(--ink); }
.site-header[data-theme="dark"] .btn--nav::before{ background:var(--blue); }
.site-header[data-theme="dark"] .btn--nav .arw{ color:#fff; }
.site-header[data-theme="dark"] .btn--nav > span::after{ color:#fff; }
.menu-btn{ display:none; }

/* reading progress */
.read-progress{ position:absolute; left:0; bottom:0; width:100%; height:3px; border-radius:2px;
  background:var(--blue); transform:scaleX(0); transform-origin:left center; }

/* mobile nav */
@media (max-width:1023px){
  .site-nav, .header-cta{ display:none; }
  .m-tools{ display:flex; align-items:center; gap:clamp(8px,2.4vw,14px); margin-left:auto; }
  .lang--m{ font-size:11.5px; }
  .menu-btn{ display:grid; place-items:center; width:46px; height:46px; cursor:pointer; color:inherit;
    background:rgba(13,8,56,.06); border:0; border-radius:var(--r);
    transition:background-color var(--t-quick) var(--e-out); }
  .menu-btn:hover{ background:rgba(13,8,56,.11); }
  .site-header[data-theme="dark"] .menu-btn{ background:rgba(255,255,255,.1); }
  .menu-btn .mb-lines{ display:grid; gap:5.5px; width:20px; }
  .menu-btn .mb-line{ width:100%; height:2px; border-radius:2px; background:currentColor;
    transition:transform var(--t-base) var(--e-inout); }
  .menu-btn[aria-expanded="true"] .mb-line:first-child{ transform:translateY(3.75px) rotate(45deg); }
  .menu-btn[aria-expanded="true"] .mb-line:last-child{ transform:translateY(-3.75px) rotate(-45deg); }

  .site-header.is-menu-open{ color:#fff; }
  .site-header.is-menu-open .header-shell{ z-index:95; }
  .site-header.is-menu-open .header-shell::before{ opacity:0; }
  .site-header.is-menu-open .menu-btn{ background:rgba(255,255,255,.12); }
  .mobile-panel{ position:fixed; inset:0; z-index:90; background:var(--ink); color:#fff;
    display:flex; flex-direction:column;
    padding:calc(var(--header-h) + 30px) var(--margin) calc(30px + env(safe-area-inset-bottom));
    opacity:0; pointer-events:none; transition:opacity .36s var(--e-out); overflow:hidden; }
  .mobile-panel.is-open{ opacity:1; pointer-events:auto; }
  .mobile-panel .wm{ position:absolute; right:-28%; bottom:-12%; height:78vh; width:auto;
    fill:none; color:rgba(0,90,171,.6); }
  .mobile-panel .wm path{ vector-effect:non-scaling-stroke; stroke-width:1.5; }
  .m-link{ position:relative; display:flex; align-items:baseline; gap:14px; padding:12px 0; text-decoration:none; color:#fff;
    font-weight:700; font-size:28px; opacity:0; transform:translateY(24px); }
  .m-link .idx{ font-family:var(--f-display); font-weight:500; font-size:13px; color:var(--sun); }
  .m-foot{ position:relative; margin-top:auto; display:grid; gap:12px; justify-items:start; opacity:0; transform:translateY(16px); }
  .m-foot .tel{ font-family:var(--f-display); font-weight:500; font-size:22px; color:#fff; text-decoration:none; }
  .m-foot > a{ color:var(--ink-3); text-decoration:none; }
  .m-foot .lang{ margin-top:8px; }
  .m-foot .lang a{ color:#fff; }
  .m-foot .lang a[aria-current="true"]{ color:var(--ink); }
}
@media (min-width:1024px){ .mobile-panel{ display:none; } }

/* ---------- footer ---------- */
.site-footer{ position:relative; background:var(--ink); color:#fff; overflow:hidden; }
.site-footer .t-strip{ position:relative; z-index:2; }
.site-footer .wm-giant{ position:absolute; right:-6%; bottom:-14%; width:min(46%,620px); height:auto;
  fill:none; color:rgba(0,90,171,.55); pointer-events:none; }
.site-footer .wm-giant path{ vector-effect:non-scaling-stroke; stroke-width:1.5; }
.footer-grid{ position:relative; z-index:2; display:grid; gap:48px;
  grid-template-columns:1.2fr .85fr 1fr 1.5fr; padding-block:84px 60px; }
@media (max-width:1023px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:640px){ .footer-grid{ grid-template-columns:1fr; } }
.site-footer h4{ font-weight:700; font-size:13px; color:var(--sun); margin-bottom:18px; }
.f-col a{ display:block; color:rgba(255,255,255,.72); text-decoration:none; padding:6px 0; font-size:14.5px;
  transition:color var(--t-quick) var(--e-out); }
.f-col a:hover{ color:#fff; }
.site-footer .tagline{ color:rgba(255,255,255,.72); font-size:14.5px; margin-top:20px; max-width:30ch; line-height:1.6; }
.site-footer .tagline b{ display:block; font-family:var(--f-display); font-weight:700; letter-spacing:.04em;
  color:#fff; font-size:13px; margin-bottom:6px; }
.site-footer .tel{ font-family:var(--f-display); font-weight:500; font-size:clamp(20px,2vw,26px);
  color:#fff; text-decoration:none; display:block; margin-bottom:8px; white-space:nowrap; }
.site-footer .mail{ color:var(--blue-3); text-decoration:none; }
.site-footer .mail:hover{ color:#fff; }
/* the bottom bar IS the brandbook page band (grey, mark left, breadcrumb right) */
.footer-band{ position:relative; z-index:2; display:flex; align-items:center; gap:16px; flex-wrap:wrap;
  min-height:52px; padding-block:10px; background:var(--mist); color:var(--ink-1); }
.footer-band .mk{ width:30px; height:auto; flex:none; }
.footer-band .foot-legal{ font-size:12.5px; }
.footer-band .foot-legal a{ color:inherit; }
.footer-band .crumb{ margin-left:auto; font-size:12.5px; color:var(--ink-2); }

/* pre-footer CTA cover image (kept for pages that still use a photo backdrop) */
.layered > .cta-cover, .cta-cover{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.cta-cover img{ width:100%; height:100%; object-fit:cover; object-position:50% 58%; display:block; }
.cta-cover::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(13,8,56,.94) 0%, rgba(13,8,56,.86) 45%, rgba(13,8,56,.95) 100%); }

/* ---------- closing CTA band (shared by every page) ----------
   A blue field (p.18: ink + yellow + white may sit on blue) carrying the p.1 cover
   composition — the house contour bleeding off the edge — and the concrete mark (p.27). */
.cta-band{ position:relative; overflow:hidden; background:var(--blue); color:#fff;
  padding-block:clamp(72px,9vw,136px); }
.cta-band .t-contour{ width:min(64vw,820px); height:auto; right:-14%; top:-22%; color:rgba(255,255,255,.22); }
.cta-band .cta-render{ position:absolute; z-index:1; right:max(var(--margin), 6vw); bottom:-6%;
  width:clamp(220px,26vw,400px); pointer-events:none; filter:drop-shadow(0 30px 40px rgba(13,8,56,.35)); }
.cta-band .container{ position:relative; z-index:2; }
.cta-frame{ position:relative; max-width:640px; }
.cta-frame .fc-label{ margin-bottom:24px; }
.cta-frame .title-stack{ color:#fff; }
.cta-frame .tel-big{ display:inline-block; font-family:var(--f-display); font-weight:500;
  font-size:clamp(24px,3.2vw,42px); color:#fff; text-decoration:none; margin:26px 0 6px; }
.cta-frame .mail{ color:rgba(255,255,255,.82); text-decoration:none; }
.cta-frame .mail:hover{ color:#fff; }
.cta-frame .cta-actions{ margin-top:32px; display:flex; flex-wrap:wrap; gap:14px; }
@media (max-width:860px){ .cta-band .cta-render{ position:relative; right:auto; bottom:auto; display:block;
  width:min(62vw,280px); margin:48px 0 -100px auto; } }

/* ---------- call-request dialog ---------- */
html.is-modal{ overflow:hidden; }
.modal{ position:fixed; inset:0; z-index:400; display:grid; place-items:center; padding:clamp(18px,4vh,48px) var(--margin); }
.modal[hidden]{ display:none; }
.modal-scrim{ position:absolute; inset:0; background:rgba(13,8,56,.66);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.modal-panel{ position:relative; width:min(100%,480px); max-height:calc(100vh - 2 * clamp(18px,4vh,48px));
  overflow:auto; border-radius:var(--r-lg); padding:clamp(30px,3.4vw,44px);
  background:#fff; color:var(--ink);
  box-shadow:0 34px 90px rgba(13,8,56,.45), 0 6px 20px rgba(13,8,56,.2); will-change:transform, opacity; }
.modal-panel::before{ content:""; position:absolute; left:0; right:0; top:0; height:6px; background:var(--blue); }
.modal-x{ position:absolute; top:16px; right:16px; width:38px; height:38px; border:0; cursor:pointer;
  border-radius:var(--r); background:var(--mist); color:var(--ink-1); display:grid; place-items:center;
  transition:background-color var(--t-quick) var(--e-out), color var(--t-quick) var(--e-out); }
.modal-x svg{ width:16px; height:16px; }
.modal-x:hover{ background:var(--ink); color:#fff; }
.modal-panel #cm-title{ margin:0 0 8px; }
.cm-sub{ margin:0 0 clamp(22px,2.6vw,30px); font-size:14.5px; line-height:1.55; color:var(--ink-1); }
.cm-form .field{ margin-bottom:26px; }
.cm-form .cm-submit{ width:100%; justify-content:center; }
.cm-note{ margin:14px 0 0; font-size:12.5px; color:var(--ink-2); text-align:center; }
@media (max-width:520px){ .modal-panel{ padding:28px 20px 24px; } }

/* ---------- mobile rails ---------- */
@media (max-width:760px){
  .rail{ display:grid !important; grid-auto-flow:column; grid-auto-columns:80%;
    grid-template-columns:none !important; grid-template-rows:none !important; gap:14px;
    overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
    margin-inline:calc(var(--margin) * -1); padding-inline:var(--margin); padding-bottom:4px; }
  .rail::-webkit-scrollbar{ display:none; }
  .rail > *{ scroll-snap-align:start; margin-bottom:0 !important; }
  .rail > .prj{ display:flex !important; flex-direction:column; grid-row:auto !important; grid-template-rows:none !important; }
  .rail > .prj .prj-rule{ margin-top:auto; }
  .rail--wide{ grid-auto-columns:88%; }
  .rail-bar{ position:relative; height:3px; margin-top:16px; background:currentColor; opacity:.14; border-radius:2px; }
  .rail-bar i{ position:absolute; inset:0 auto 0 0; display:block; border-radius:2px; background:var(--blue); transform-origin:left center; }
  .on-ink .rail-bar{ background:#fff; }
  .on-ink .rail-bar i{ background:var(--sun); }
}
@media (min-width:761px){ .rail-bar{ display:none; } }

/* ---------- touch ergonomics ---------- */
@media (max-width:760px){
  .link{ min-height:44px; }
  .cc-btn{ min-height:44px; }
  .f-col a{ padding-block:11px; }
  .site-footer .tel, .site-footer .mail, .cta-frame .tel-big, .contact-rail .tel{ display:inline-block; padding-block:9px; }
  .lang a{ padding:12px 10px; }
  .modal-x{ width:44px; height:44px; top:10px; right:10px; }
  .btn--nav{ min-height:44px; }
  .m-cta{ width:100%; justify-content:center; margin-bottom:22px; }
  .chips-row > div, .chips-row{ display:flex; flex-wrap:nowrap; overflow-x:auto; overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
    margin-inline:calc(var(--margin) * -1); padding-inline:var(--margin); }
  .chips-row::-webkit-scrollbar, .chips-row > div::-webkit-scrollbar{ display:none; }
  .chips-row .chip{ flex:none; }
}

/* SplitText line masks — mkhedruli descenders need a little extra clip depth */
.st-mask-line-mask{ padding-bottom:.12em; margin-bottom:-.12em; }

/* back-to-top — a small house tile; its outline traces scroll progress */
.backtop{ position:fixed; right:28px; bottom:28px; z-index:80; width:50px; height:50px;
  border:0; cursor:pointer; background:var(--blue); color:#fff; border-radius:var(--r);
  display:grid; place-items:center; box-shadow:0 10px 26px rgba(0,90,171,.32);
  opacity:0; transform:translateY(12px); pointer-events:none;
  transition:opacity var(--t-base) var(--e-out), transform var(--t-base) var(--e-out), background-color var(--t-quick); }
.backtop.is-visible{ opacity:1; transform:none; pointer-events:auto; }
.backtop:hover{ background:var(--ink); }
.backtop svg.frame{ position:absolute; inset:0; width:100%; height:100%; }
.backtop svg.frame rect{ fill:none; stroke:var(--sun); stroke-width:2; }
.backtop .arr{ width:18px; height:18px; fill:currentColor; transition:transform var(--t-quick) var(--e-out); }
.backtop:hover .arr{ transform:translateY(-3px); }

.js [data-anim]{ }

/* skeleton */
.skeleton{ position:relative; overflow:hidden; background:var(--mist); }
.skeleton::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(105deg, transparent 40%, rgba(255,255,255,.6) 50%, transparent 60%);
  animation:shimmer 1.2s linear infinite; }
@keyframes shimmer{ from{ transform:translateX(-100%);} to{ transform:translateX(100%);} }

/* toast */
.toast{ position:fixed; top:20px; left:50%; transform:translate(-50%,-8px); z-index:200; opacity:0;
  background:var(--ink); color:#fff; padding:12px 22px; border-radius:var(--r);
  font-size:14px; pointer-events:none; box-shadow:0 14px 34px rgba(13,8,56,.25);
  transition:opacity var(--t-quick) var(--e-out), transform var(--t-quick) var(--e-out); }
.toast.is-on{ opacity:1; transform:translate(-50%,0); }

/* scroll cue */
.scroll-cue{ position:absolute; bottom:32px; right:var(--margin); width:30px; height:30px; opacity:.6; }
.scroll-cue svg{ color:var(--sun); width:100%; height:100%; }

/* utility */
.grid-12{ display:grid; grid-template-columns:repeat(12,1fr); gap:var(--gutter); }
.visually-hidden{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip-link{ position:fixed; top:10px; left:10px; z-index:300; transform:translateY(-200%); }
.skip-link:focus{ transform:none; }

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; }
  html{ scroll-behavior:auto; }
}

/* ================================================================
   OPTICAL CENTRING — last, so it wins over the rules it corrects.
   Only the Mtavruli caps cut and the Latin figures need it. */
.foot-legal, .hero-proof span, .toc-row .tn, .slot .lbl, .feat-bar .fb-label, .share-row .sh-label{ position:relative; }
.cc-btn .cc-dial, .toc-row .ti, .acc .idx{ position:relative; top:var(--figs-y); }