/* ============================================================
   ICOSA LTD  ·  Shared base
   Tokens, type, navigation, buttons, the faceted brand field,
   the line pattern, reveals and the footer. Everything here is
   shared by every template; page layouts live in their own sheet.

   Brand rules this file encodes (Brand Guidelines V1.0):
   · Merriweather only. Headlines Light, body Regular, CTAs Bold.
   · Palette: white, stone, bold orange, burnt orange, black.
   · Coloured pattern: icosahedron facets, always cropped.
   · Line pattern: subtle, feathered, never behind body copy at
     full strength.
   · Single-colour symbol: burnt orange beside a black wordmark on
     light grounds, all white on orange and black grounds.
   ============================================================ */

:root{
  /* Palette */
  --white:#FFFFFF;
  --stone:#F3F3EF;
  --stone-2:#E8E7E0;
  --orange:#FF631F;            /* Bold orange: accents on dark grounds */
  --burnt:#C74906;             /* Burnt orange: the primary brand colour */
  --burnt-deep:#A33A04;
  --burnt-ink:#A93C03;         /* Burnt for small text on light grounds (5.7:1 on stone) */
  --ink:#231F20;               /* Brand black */
  --ink-2:#1A1718;

  /* Text */
  --text:#231F20;
  --text-soft:#4A4445;
  --mut:#5C5657;               /* 6.5:1 on stone */
  --on-dark:#FFFFFF;
  --on-dark-mut:rgba(255,255,255,.72);

  /* Lines */
  --line:rgba(35,31,32,.14);
  --line-strong:rgba(35,31,32,.28);
  --line-dark:rgba(255,255,255,.16);

  /* Facet ramp, sampled from the brand's burnt orange pattern */
  --f-dark:#B02E03;
  --f-mid:#C74906;
  --f-light:#D1610C;

  /* Type */
  --ff:'Merriweather', Georgia, 'Times New Roman', serif;
  --h1:clamp(2.75rem, 1.15rem + 5.4vw, 7rem);
  --h2:clamp(2.15rem, 1.25rem + 3vw, 4.5rem);
  --h3:clamp(1.3rem, 1.05rem + .8vw, 1.85rem);
  --lede:clamp(1.1rem, 1rem + .35vw, 1.35rem);

  /* Space */
  --sec:clamp(88px, 10vw, 176px);
  --gutter:clamp(20px, 4vw, 72px);
  --ease:cubic-bezier(.2,.7,.1,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{
  scroll-behavior:smooth; -webkit-text-size-adjust:100%;
  /* The nav is fixed, so an in-page jump would otherwise park the target
     heading underneath it. --nav-h is measured live by main.js. */
  scroll-padding-top:calc(var(--nav-h, 88px) + 24px);
}
body{
  background:var(--stone); color:var(--text);
  font-family:var(--ff); font-weight:400; font-size:1.0625rem; line-height:1.75;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility; overflow-x:hidden;
}
a{ color:inherit; text-decoration:none; }
img,svg{ display:block; max-width:100%; }
button{ font:inherit; }
::selection{ background:var(--burnt); color:var(--white); }

:focus-visible{ outline:2px solid var(--burnt); outline-offset:4px; }
.on-dark :focus-visible, .burnt :focus-visible, .ink :focus-visible{ outline-color:var(--white); }

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:300;
  background:var(--ink); color:var(--white);
  font-weight:700; font-size:.85rem; padding:14px 20px;
}
.skip-link:focus{ left:0; }

.sr-only{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0;
}

/* ---------- Containers and grounds ---------- */
.shell{
  width:100%; max-width:1600px; margin-inline:auto;
  padding-inline:var(--gutter);
}
.sec-pad{ padding-block:var(--sec); }
.stone{ background:var(--stone); color:var(--text); }
.white{ background:var(--white); color:var(--text); }
.ink{ background:var(--ink); color:var(--on-dark); }
.burnt{ background:var(--burnt); color:var(--on-dark); }
section{ position:relative; }

/* ---------- Type ---------- */
h1,h2,h3,h4{ font-weight:300; line-height:1.08; letter-spacing:-.012em; }
.h-display{
  font-size:var(--h2); font-weight:300; line-height:1.06; letter-spacing:-.02em;
  text-wrap:balance;
}
.h-display em,
h1 em{ font-style:italic; font-weight:300; color:var(--burnt); }
.ink .h-display em, .ink h1 em{ color:var(--orange); }
.burnt .h-display em, .burnt h1 em{ color:var(--white); }

.lede{
  font-size:var(--lede); font-weight:300; line-height:1.65; color:var(--text-soft);
  max-width:58ch; text-wrap:pretty;
}
.ink .lede{ color:var(--on-dark-mut); }
.burnt .lede{ color:rgba(255,255,255,.92); }

.eyebrow{
  display:inline-flex; align-items:center; gap:14px;
  font-size:.72rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  color:var(--burnt-ink); line-height:1.4;
}
.eyebrow::before{
  content:""; width:11px; height:10px; flex:none; background:currentColor;
  clip-path:polygon(50% 0, 100% 100%, 0 100%);
}
.ink .eyebrow{ color:var(--orange); }
.burnt .eyebrow{ color:var(--white); }

p{ text-wrap:pretty; }

/* ---------- Wordmark ---------- */
.wordmark{ display:flex; align-items:center; gap:12px; }
.wm-mark{ width:31px; height:34.4px; fill:currentColor; flex:none; color:var(--burnt); transition:color .4s var(--ease); }
.wm-word{ width:112px; height:34.4px; fill:currentColor; flex:none; color:var(--ink); transition:color .4s var(--ease); }

/* ---------- Buttons ---------- */
.btn{
  position:relative; display:inline-flex; align-items:center; gap:14px;
  font-family:var(--ff); font-weight:700; font-size:.9rem; letter-spacing:.01em; line-height:1.2;
  padding:17px 26px; border:1px solid transparent; cursor:pointer; overflow:hidden; isolation:isolate;
  transition:color .45s var(--ease), border-color .45s var(--ease), background-color .45s var(--ease);
}
/* The fill sweeps in on a diagonal, a facet edge rather than a flat slide. */
.btn::before{
  content:""; position:absolute; inset:-1px; z-index:-1;
  background:var(--btn-sweep, var(--ink));
  clip-path:polygon(0 0, 0 0, 0 100%, 0 100%);
  transition:clip-path .55s var(--ease);
}
.btn:hover::before, .btn:focus-visible::before{ clip-path:polygon(0 0, 130% 0, 100% 100%, 0 100%); }
.btn .arr{ display:inline-block; transition:transform .45s var(--ease); }
.btn:hover .arr{ transform:translateX(5px); }

.btn-solid{ background:var(--burnt); color:var(--white); --btn-sweep:var(--ink); }
.btn-solid[disabled]{ opacity:.55; cursor:not-allowed; }
.btn-ghost{ border-color:var(--line-strong); color:var(--ink); --btn-sweep:var(--ink); }
.btn-ghost:hover{ color:var(--white); border-color:var(--ink); }
.btn-light{ background:var(--white); color:var(--ink); --btn-sweep:var(--ink); }
.btn-light:hover{ color:var(--white); }
.btn-outline-light{ border-color:rgba(255,255,255,.55); color:var(--white); --btn-sweep:var(--white); }
.btn-outline-light:hover{ color:var(--burnt-deep); border-color:var(--white); }

.text-link{
  display:inline-flex; align-items:center; gap:10px; font-weight:700; font-size:.92rem;
  color:var(--burnt-ink); padding-bottom:4px;
  background:linear-gradient(currentColor,currentColor) 0 100% / 100% 1px no-repeat;
  transition:background-size .5s var(--ease), color .3s var(--ease);
}
.text-link:hover{ background-size:0 1px; background-position:100% 100%; }
.text-link .arr{ transition:transform .45s var(--ease); }
.text-link:hover .arr{ transform:translateX(5px); }

/* ============================================================
   Navigation
   ============================================================ */
.nav{
  position:fixed; inset:0 0 auto; z-index:100;
  color:var(--ink);
  background:rgba(243,243,239,.95);
  -webkit-backdrop-filter:saturate(1.4) blur(16px); backdrop-filter:saturate(1.4) blur(16px);
  border-bottom:1px solid var(--line);
  transition:transform .55s var(--ease), background-color .45s var(--ease), border-color .45s var(--ease), color .45s var(--ease);
}
.admin-bar .nav{ top:32px; }
@media (max-width:782px){ .admin-bar .nav{ top:46px; } }

.nav-in{ display:flex; align-items:center; justify-content:space-between; gap:24px; padding-block:22px; transition:padding .45s var(--ease); }
.nav.is-scrolled .nav-in{ padding-block:15px; }
.nav.is-hidden{ transform:translateY(-110%); }

.nav-right{ display:flex; align-items:center; gap:clamp(20px, 2.6vw, 44px); }
.nav-links{ display:flex; align-items:center; gap:clamp(20px, 2.6vw, 44px); list-style:none; }
.nav-links a{
  position:relative; font-size:.95rem; font-weight:400; padding-block:6px;
  transition:color .3s var(--ease);
}
.nav-links a::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:currentColor;
  transform:scaleX(0); transform-origin:right; transition:transform .5s var(--ease);
}
.nav-links a:hover::after,
.nav-links a[aria-current="page"]::after{ transform:scaleX(1); transform-origin:left; }
.nav-links .nav-cta{ display:none; }
.nav .btn{ padding:14px 22px; font-size:.86rem; }

/* Over the faceted home hero: transparent, everything white. */
.nav.is-over{ background:transparent; border-bottom-color:transparent; color:var(--white); -webkit-backdrop-filter:none; backdrop-filter:none; }
.nav.is-over .wm-mark, .nav.is-over .wm-word{ color:var(--white); }
.nav.is-over .btn-solid{ background:var(--white); color:var(--ink); --btn-sweep:var(--ink); }
.nav.is-over .btn-solid:hover{ color:var(--white); }

.burger{
  display:none; position:relative; width:46px; height:46px; flex:none;
  border:1px solid currentColor; border-color:var(--line-strong); background:none; color:inherit; cursor:pointer;
}
.nav.is-over .burger{ border-color:rgba(255,255,255,.5); }
.burger span{
  position:absolute; left:13px; right:13px; height:1.5px; background:currentColor;
  transition:transform .45s var(--ease), opacity .3s var(--ease);
}
.burger span:nth-child(1){ top:18px; }
.burger span:nth-child(2){ top:26px; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(4px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ transform:translateY(-4px) rotate(-45deg); }

/* ============================================================
   The faceted field
   A cropped icosahedron, drawn and lit by main.js in the burnt
   orange ramp. Hosts carry a flat brand fill underneath so the
   ground is right before the script runs, and without it.
   ============================================================ */
.facets{
  position:absolute; inset:0; overflow:hidden; background:var(--f-mid);
  background-image:
    linear-gradient(118deg, transparent 0 38%, rgba(209,97,12,.55) 38% 61%, transparent 61%),
    linear-gradient(32deg, rgba(176,46,3,.6) 0 30%, transparent 30%);
}
.facets svg{ position:absolute; inset:0; width:100%; height:100%; }
.facets polygon{ shape-rendering:geometricPrecision; }

/* ============================================================
   Line pattern
   The brand's repeated icosahedron outline, as a mask so it can
   take any colour, feathered so it never fights the copy.
   ============================================================ */
.lines{
  position:absolute; inset:0; pointer-events:none; overflow:hidden;
  --lc:var(--ink); --lo:.16; --lsize:57px 99px;
  --lfade:radial-gradient(ellipse 70% 80% at 100% 0%, #000 0%, transparent 70%);
}
.lines::before{
  content:""; position:absolute; inset:0; background:var(--lc); opacity:var(--lo);
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35.355' height='61.58' viewBox='0 0 35.355 61.58'%3E%3Cpath d='M-35.3 -61.5 -17.6 -51.3 -17.6 -30.8 -35.3 -20.6 -53.1 -30.8 -53.1 -51.3ZM-35.3 -61.5 -53.1 -30.8 -17.6 -30.8ZM-35.3 -31.0 -26.6 -46.1 -44.0 -46.1ZM-53.1 -51.3L-44.0 -46.1M-17.6 -51.3L-26.6 -46.1M-35.3 -31.0V-20.6M0.0 -61.5 17.7 -51.3 17.7 -30.8 0.0 -20.6 -17.7 -30.8 -17.7 -51.3ZM0.0 -61.5 -17.7 -30.8 17.7 -30.8ZM0.0 -31.0 8.7 -46.1 -8.7 -46.1ZM-17.7 -51.3L-8.7 -46.1M17.7 -51.3L8.7 -46.1M0.0 -31.0V-20.6M35.3 -61.5 53.1 -51.3 53.1 -30.8 35.3 -20.6 17.6 -30.8 17.6 -51.3ZM35.3 -61.5 17.6 -30.8 53.1 -30.8ZM35.3 -31.0 44.0 -46.1 26.6 -46.1ZM17.6 -51.3L26.6 -46.1M53.1 -51.3L44.0 -46.1M35.3 -31.0V-20.6M70.7 -61.5 88.4 -51.3 88.4 -30.8 70.7 -20.6 52.9 -30.8 52.9 -51.3ZM70.7 -61.5 52.9 -30.8 88.4 -30.8ZM70.7 -31.0 79.4 -46.1 62.0 -46.1ZM52.9 -51.3L62.0 -46.1M88.4 -51.3L79.4 -46.1M70.7 -31.0V-20.6M-17.6 -30.7 0.0 -20.5 0.0 -0.0 -17.6 10.1 -35.4 -0.0 -35.4 -20.5ZM-17.6 -30.7 -35.4 -0.0 0.0 -0.0ZM-17.6 -0.2 -8.9 -15.3 -26.3 -15.3ZM-35.4 -20.5L-26.3 -15.3M0.0 -20.5L-8.9 -15.3M-17.6 -0.2V10.1M17.6 -30.7 35.4 -20.5 35.4 -0.0 17.6 10.1 -0.0 -0.0 -0.0 -20.5ZM17.6 -30.7 -0.0 -0.0 35.4 -0.0ZM17.6 -0.2 26.3 -15.3 8.9 -15.3ZM-0.0 -20.5L8.9 -15.3M35.4 -20.5L26.3 -15.3M17.6 -0.2V10.1M53.0 -30.7 70.7 -20.5 70.7 -0.0 53.0 10.1 35.2 -0.0 35.2 -20.5ZM53.0 -30.7 35.2 -0.0 70.7 -0.0ZM53.0 -0.2 61.7 -15.3 44.3 -15.3ZM35.2 -20.5L44.3 -15.3M70.7 -20.5L61.7 -15.3M53.0 -0.2V10.1M88.3 -30.7 106.1 -20.5 106.1 -0.0 88.3 10.1 70.6 -0.0 70.6 -20.5ZM88.3 -30.7 70.6 -0.0 106.1 -0.0ZM88.3 -0.2 97.0 -15.3 79.6 -15.3ZM70.6 -20.5L79.6 -15.3M106.1 -20.5L97.0 -15.3M88.3 -0.2V10.1M-35.3 0.0 -17.6 10.2 -17.6 30.7 -35.3 40.9 -53.1 30.7 -53.1 10.2ZM-35.3 0.0 -53.1 30.7 -17.6 30.7ZM-35.3 30.5 -26.6 15.4 -44.0 15.4ZM-53.1 10.2L-44.0 15.4M-17.6 10.2L-26.6 15.4M-35.3 30.5V40.9M0.0 0.0 17.7 10.2 17.7 30.7 0.0 40.9 -17.7 30.7 -17.7 10.2ZM0.0 0.0 -17.7 30.7 17.7 30.7ZM0.0 30.5 8.7 15.4 -8.7 15.4ZM-17.7 10.2L-8.7 15.4M17.7 10.2L8.7 15.4M0.0 30.5V40.9M35.3 0.0 53.1 10.2 53.1 30.7 35.3 40.9 17.6 30.7 17.6 10.2ZM35.3 0.0 17.6 30.7 53.1 30.7ZM35.3 30.5 44.0 15.4 26.6 15.4ZM17.6 10.2L26.6 15.4M53.1 10.2L44.0 15.4M35.3 30.5V40.9M70.7 0.0 88.4 10.2 88.4 30.7 70.7 40.9 52.9 30.7 52.9 10.2ZM70.7 0.0 52.9 30.7 88.4 30.7ZM70.7 30.5 79.4 15.4 62.0 15.4ZM52.9 10.2L62.0 15.4M88.4 10.2L79.4 15.4M70.7 30.5V40.9M-17.6 30.7 0.0 41.0 0.0 61.5 -17.6 71.7 -35.4 61.5 -35.4 41.0ZM-17.6 30.7 -35.4 61.5 0.0 61.5ZM-17.6 61.3 -8.9 46.2 -26.3 46.2ZM-35.4 41.0L-26.3 46.2M0.0 41.0L-8.9 46.2M-17.6 61.3V71.7M17.6 30.7 35.4 41.0 35.4 61.5 17.6 71.7 -0.0 61.5 -0.0 41.0ZM17.6 30.7 -0.0 61.5 35.4 61.5ZM17.6 61.3 26.3 46.2 8.9 46.2ZM-0.0 41.0L8.9 46.2M35.4 41.0L26.3 46.2M17.6 61.3V71.7M53.0 30.7 70.7 41.0 70.7 61.5 53.0 71.7 35.2 61.5 35.2 41.0ZM53.0 30.7 35.2 61.5 70.7 61.5ZM53.0 61.3 61.7 46.2 44.3 46.2ZM35.2 41.0L44.3 46.2M70.7 41.0L61.7 46.2M53.0 61.3V71.7M88.3 30.7 106.1 41.0 106.1 61.5 88.3 71.7 70.6 61.5 70.6 41.0ZM88.3 30.7 70.6 61.5 106.1 61.5ZM88.3 61.3 97.0 46.2 79.6 46.2ZM70.6 41.0L79.6 46.2M106.1 41.0L97.0 46.2M88.3 61.3V71.7M-35.3 61.5 -17.6 71.8 -17.6 92.3 -35.3 102.5 -53.1 92.3 -53.1 71.8ZM-35.3 61.5 -53.1 92.3 -17.6 92.3ZM-35.3 92.1 -26.6 77.0 -44.0 77.0ZM-53.1 71.8L-44.0 77.0M-17.6 71.8L-26.6 77.0M-35.3 92.1V102.5M0.0 61.5 17.7 71.8 17.7 92.3 0.0 102.5 -17.7 92.3 -17.7 71.8ZM0.0 61.5 -17.7 92.3 17.7 92.3ZM0.0 92.1 8.7 77.0 -8.7 77.0ZM-17.7 71.8L-8.7 77.0M17.7 71.8L8.7 77.0M0.0 92.1V102.5M35.3 61.5 53.1 71.8 53.1 92.3 35.3 102.5 17.6 92.3 17.6 71.8ZM35.3 61.5 17.6 92.3 53.1 92.3ZM35.3 92.1 44.0 77.0 26.6 77.0ZM17.6 71.8L26.6 77.0M53.1 71.8L44.0 77.0M35.3 92.1V102.5M70.7 61.5 88.4 71.8 88.4 92.3 70.7 102.5 52.9 92.3 52.9 71.8ZM70.7 61.5 52.9 92.3 88.4 92.3ZM70.7 92.1 79.4 77.0 62.0 77.0ZM52.9 71.8L62.0 77.0M88.4 71.8L79.4 77.0M70.7 92.1V102.5' fill='none' stroke='%23000' stroke-width='.5'/%3E%3C/svg%3E"), var(--lfade);
  -webkit-mask-size:var(--lsize), 100% 100%;
  -webkit-mask-repeat:repeat, no-repeat;
  -webkit-mask-composite:source-in;
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35.355' height='61.58' viewBox='0 0 35.355 61.58'%3E%3Cpath d='M-35.3 -61.5 -17.6 -51.3 -17.6 -30.8 -35.3 -20.6 -53.1 -30.8 -53.1 -51.3ZM-35.3 -61.5 -53.1 -30.8 -17.6 -30.8ZM-35.3 -31.0 -26.6 -46.1 -44.0 -46.1ZM-53.1 -51.3L-44.0 -46.1M-17.6 -51.3L-26.6 -46.1M-35.3 -31.0V-20.6M0.0 -61.5 17.7 -51.3 17.7 -30.8 0.0 -20.6 -17.7 -30.8 -17.7 -51.3ZM0.0 -61.5 -17.7 -30.8 17.7 -30.8ZM0.0 -31.0 8.7 -46.1 -8.7 -46.1ZM-17.7 -51.3L-8.7 -46.1M17.7 -51.3L8.7 -46.1M0.0 -31.0V-20.6M35.3 -61.5 53.1 -51.3 53.1 -30.8 35.3 -20.6 17.6 -30.8 17.6 -51.3ZM35.3 -61.5 17.6 -30.8 53.1 -30.8ZM35.3 -31.0 44.0 -46.1 26.6 -46.1ZM17.6 -51.3L26.6 -46.1M53.1 -51.3L44.0 -46.1M35.3 -31.0V-20.6M70.7 -61.5 88.4 -51.3 88.4 -30.8 70.7 -20.6 52.9 -30.8 52.9 -51.3ZM70.7 -61.5 52.9 -30.8 88.4 -30.8ZM70.7 -31.0 79.4 -46.1 62.0 -46.1ZM52.9 -51.3L62.0 -46.1M88.4 -51.3L79.4 -46.1M70.7 -31.0V-20.6M-17.6 -30.7 0.0 -20.5 0.0 -0.0 -17.6 10.1 -35.4 -0.0 -35.4 -20.5ZM-17.6 -30.7 -35.4 -0.0 0.0 -0.0ZM-17.6 -0.2 -8.9 -15.3 -26.3 -15.3ZM-35.4 -20.5L-26.3 -15.3M0.0 -20.5L-8.9 -15.3M-17.6 -0.2V10.1M17.6 -30.7 35.4 -20.5 35.4 -0.0 17.6 10.1 -0.0 -0.0 -0.0 -20.5ZM17.6 -30.7 -0.0 -0.0 35.4 -0.0ZM17.6 -0.2 26.3 -15.3 8.9 -15.3ZM-0.0 -20.5L8.9 -15.3M35.4 -20.5L26.3 -15.3M17.6 -0.2V10.1M53.0 -30.7 70.7 -20.5 70.7 -0.0 53.0 10.1 35.2 -0.0 35.2 -20.5ZM53.0 -30.7 35.2 -0.0 70.7 -0.0ZM53.0 -0.2 61.7 -15.3 44.3 -15.3ZM35.2 -20.5L44.3 -15.3M70.7 -20.5L61.7 -15.3M53.0 -0.2V10.1M88.3 -30.7 106.1 -20.5 106.1 -0.0 88.3 10.1 70.6 -0.0 70.6 -20.5ZM88.3 -30.7 70.6 -0.0 106.1 -0.0ZM88.3 -0.2 97.0 -15.3 79.6 -15.3ZM70.6 -20.5L79.6 -15.3M106.1 -20.5L97.0 -15.3M88.3 -0.2V10.1M-35.3 0.0 -17.6 10.2 -17.6 30.7 -35.3 40.9 -53.1 30.7 -53.1 10.2ZM-35.3 0.0 -53.1 30.7 -17.6 30.7ZM-35.3 30.5 -26.6 15.4 -44.0 15.4ZM-53.1 10.2L-44.0 15.4M-17.6 10.2L-26.6 15.4M-35.3 30.5V40.9M0.0 0.0 17.7 10.2 17.7 30.7 0.0 40.9 -17.7 30.7 -17.7 10.2ZM0.0 0.0 -17.7 30.7 17.7 30.7ZM0.0 30.5 8.7 15.4 -8.7 15.4ZM-17.7 10.2L-8.7 15.4M17.7 10.2L8.7 15.4M0.0 30.5V40.9M35.3 0.0 53.1 10.2 53.1 30.7 35.3 40.9 17.6 30.7 17.6 10.2ZM35.3 0.0 17.6 30.7 53.1 30.7ZM35.3 30.5 44.0 15.4 26.6 15.4ZM17.6 10.2L26.6 15.4M53.1 10.2L44.0 15.4M35.3 30.5V40.9M70.7 0.0 88.4 10.2 88.4 30.7 70.7 40.9 52.9 30.7 52.9 10.2ZM70.7 0.0 52.9 30.7 88.4 30.7ZM70.7 30.5 79.4 15.4 62.0 15.4ZM52.9 10.2L62.0 15.4M88.4 10.2L79.4 15.4M70.7 30.5V40.9M-17.6 30.7 0.0 41.0 0.0 61.5 -17.6 71.7 -35.4 61.5 -35.4 41.0ZM-17.6 30.7 -35.4 61.5 0.0 61.5ZM-17.6 61.3 -8.9 46.2 -26.3 46.2ZM-35.4 41.0L-26.3 46.2M0.0 41.0L-8.9 46.2M-17.6 61.3V71.7M17.6 30.7 35.4 41.0 35.4 61.5 17.6 71.7 -0.0 61.5 -0.0 41.0ZM17.6 30.7 -0.0 61.5 35.4 61.5ZM17.6 61.3 26.3 46.2 8.9 46.2ZM-0.0 41.0L8.9 46.2M35.4 41.0L26.3 46.2M17.6 61.3V71.7M53.0 30.7 70.7 41.0 70.7 61.5 53.0 71.7 35.2 61.5 35.2 41.0ZM53.0 30.7 35.2 61.5 70.7 61.5ZM53.0 61.3 61.7 46.2 44.3 46.2ZM35.2 41.0L44.3 46.2M70.7 41.0L61.7 46.2M53.0 61.3V71.7M88.3 30.7 106.1 41.0 106.1 61.5 88.3 71.7 70.6 61.5 70.6 41.0ZM88.3 30.7 70.6 61.5 106.1 61.5ZM88.3 61.3 97.0 46.2 79.6 46.2ZM70.6 41.0L79.6 46.2M106.1 41.0L97.0 46.2M88.3 61.3V71.7M-35.3 61.5 -17.6 71.8 -17.6 92.3 -35.3 102.5 -53.1 92.3 -53.1 71.8ZM-35.3 61.5 -53.1 92.3 -17.6 92.3ZM-35.3 92.1 -26.6 77.0 -44.0 77.0ZM-53.1 71.8L-44.0 77.0M-17.6 71.8L-26.6 77.0M-35.3 92.1V102.5M0.0 61.5 17.7 71.8 17.7 92.3 0.0 102.5 -17.7 92.3 -17.7 71.8ZM0.0 61.5 -17.7 92.3 17.7 92.3ZM0.0 92.1 8.7 77.0 -8.7 77.0ZM-17.7 71.8L-8.7 77.0M17.7 71.8L8.7 77.0M0.0 92.1V102.5M35.3 61.5 53.1 71.8 53.1 92.3 35.3 102.5 17.6 92.3 17.6 71.8ZM35.3 61.5 17.6 92.3 53.1 92.3ZM35.3 92.1 44.0 77.0 26.6 77.0ZM17.6 71.8L26.6 77.0M53.1 71.8L44.0 77.0M35.3 92.1V102.5M70.7 61.5 88.4 71.8 88.4 92.3 70.7 102.5 52.9 92.3 52.9 71.8ZM70.7 61.5 52.9 92.3 88.4 92.3ZM70.7 92.1 79.4 77.0 62.0 77.0ZM52.9 71.8L62.0 77.0M88.4 71.8L79.4 77.0M70.7 92.1V102.5' fill='none' stroke='%23000' stroke-width='.5'/%3E%3C/svg%3E"), var(--lfade);
  mask-size:var(--lsize), 100% 100%;
  mask-repeat:repeat, no-repeat;
  mask-composite:intersect;
}

/* ============================================================
   Scroll reveals
   Armed only once main.js reports in (see the head script). With
   no JavaScript every section stays visible.
   ============================================================ */
.js-reveal .rv{
  opacity:0; transform:translateY(28px);
  transition:opacity 1.1s var(--ease), transform 1.1s var(--ease);
  transition-delay:var(--d, 0s);
}
.js-reveal .rv.in{ opacity:1; transform:none; }

/* Headings rise line by line from behind a mask. */
.js-reveal .rv-lines .ln{ display:block; overflow:hidden; padding-bottom:.08em; margin-bottom:-.08em; }
.js-reveal .rv-lines .ln > span{
  display:block; transform:translateY(105%);
  transition:transform 1.2s var(--ease); transition-delay:calc(var(--d, 0s) + var(--i, 0) * .09s);
}
.js-reveal .rv-lines.in .ln > span{ transform:none; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .js-reveal .rv, .js-reveal .rv-lines .ln > span{ opacity:1; transform:none; transition:none; }
  .btn::before, .nav{ transition:none; }
}

/* ============================================================
   Section heads and inner-page title bands
   ============================================================ */
.sec-head{
  display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  gap:28px clamp(40px, 7vw, 140px); align-items:end;
  margin-bottom:clamp(56px, 6vw, 100px);
}
.sec-head .h-display{ margin-top:26px; }
.em-break em{ display:block; }
.white > .lines, .stone > .lines{ --lo:.1; --lfade:radial-gradient(ellipse 50% 60% at 100% 0%, #000 0%, transparent 72%); }
.white > .shell, .stone > .shell, .ink > .shell{ position:relative; }

.page-top{
  position:relative; overflow:hidden;
  padding-top:calc(var(--nav-h, 88px) + clamp(64px, 8vw, 136px));
  padding-bottom:clamp(64px, 7vw, 120px);
}
.page-top-in{ position:relative; z-index:2; }
.page-top-copy{ max-width:min(64%, 1000px); }
.page-top h1{
  margin-top:28px;
  font-size:clamp(2.6rem, 1.15rem + 4.5vw, 6rem); font-weight:300; line-height:1.04; letter-spacing:-.024em;
  text-wrap:balance;
}
.page-top .lede{ margin-top:clamp(26px, 2.6vw, 36px); }
.page-meta{ margin-top:18px; font-size:.8rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--mut); }
.page-top--compact{ padding-bottom:clamp(56px, 6vw, 96px); }
.page-top--compact h1{ font-size:clamp(2.3rem, 1.2rem + 3.4vw, 4.6rem); }

/* The shard: a slice of the faceted field with one cut edge. */
.shard{
  position:absolute; top:var(--nav-h, 88px); right:0; bottom:0; z-index:1; width:36vw;
  clip-path:polygon(44% 0, 100% 0, 100% 100%, 0 100%);
}
.page-top--compact .shard{ width:30vw; }

.stat-strip{
  list-style:none; margin-top:clamp(56px, 6vw, 96px);
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  border-top:1px solid var(--line-strong); max-width:64%;
}
.stat{ display:flex; flex-direction:column; gap:8px; padding:24px 24px 0 0; }
.stat + .stat{ padding-left:clamp(16px, 2vw, 32px); border-left:1px solid var(--line); }
.stat b{
  font-size:clamp(1.7rem, 1.2rem + 1.4vw, 2.6rem); font-weight:300; line-height:1.1; letter-spacing:-.02em; color:var(--burnt);
}
.stat span{ font-size:.68rem; font-weight:700; letter-spacing:.16em; line-height:1.6; text-transform:uppercase; color:var(--mut); }

/* ============================================================
   Closing band, shared by About and Services
   ============================================================ */
.closing{ overflow:hidden; color:var(--white); }
.closing .shell{ position:relative; z-index:2; }
.closing-inner{
  display:grid; grid-template-columns:minmax(0,1.5fr) auto; gap:40px clamp(40px, 6vw, 120px);
  align-items:end;
}
.closing .h-display{ max-width:16ch; margin-top:26px; }
.closing .lede{ margin-top:26px; max-width:46ch; }
.closing::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg, rgba(118,28,0,.5) 0%, rgba(118,28,0,.32) 50%, rgba(118,28,0,.3) 100%);
}

/* ============================================================
   Footer
   ============================================================ */
.footer{ position:relative; overflow:hidden; background:var(--ink-2); color:var(--on-dark); }
.footer .wm-mark, .footer .wm-word{ color:var(--white); }
.footer-main{
  display:grid;
  grid-template-columns:minmax(0,1.6fr) repeat(3, minmax(0,1fr));
  gap:clamp(36px, 4vw, 80px); align-items:start;
  padding-block:clamp(72px, 8vw, 128px) clamp(48px, 5vw, 80px);
}
.footer-etym{ margin-top:28px; max-width:40ch; color:var(--on-dark-mut); font-size:.95rem; font-weight:300; line-height:1.8; }
.footer-etym b{ color:var(--white); font-weight:700; }
.footer-col h2{
  font-size:.7rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  color:var(--orange); margin-bottom:22px;
}
.footer-col ul{ list-style:none; display:flex; flex-direction:column; gap:12px; }
.footer-col a{ color:var(--on-dark-mut); font-size:.95rem; transition:color .3s var(--ease); }
.footer-col a:hover{ color:var(--white); }
.footer-contact{ font-style:normal; color:var(--on-dark-mut); font-size:.95rem; line-height:1.85; }
.footer-contact--mail{ margin-top:16px; }
.footer-contact .fc-mail{ color:var(--white); border-bottom:1px solid rgba(255,99,31,.7); padding-bottom:2px; }
.footer-contact .fc-mail:hover{ border-bottom-color:var(--white); }
.li-link{ display:inline-flex; align-items:center; gap:11px; }
.li-icon{ width:18px; height:18px; flex:none; fill:currentColor; }

/* The wordmark, set enormous and cropped by the footer's edge. */
.footer-giant{
  position:relative; display:block; width:100%; height:clamp(70px, 15vw, 270px);
  margin-top:-10px; pointer-events:none; overflow:hidden;
}
.footer-giant svg{
  position:absolute; left:50%; top:0; width:min(118%, 1900px); height:auto; aspect-ratio:212.58/63.62;
  transform:translateX(-50%); fill:rgba(255,255,255,.045);
}
.footer-bottom{
  position:relative; z-index:2;
  border-top:1px solid var(--line-dark); padding-block:26px 30px;
  display:flex; flex-wrap:wrap; gap:10px 28px; justify-content:space-between;
  font-size:.78rem; color:rgba(255,255,255,.6);
}

/* ============================================================
   Responsive: the parts every template shares
   ============================================================ */
@media (max-width: 1180px){
  .footer-main{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width: 980px){
  .burger{ display:block; }
  .nav .nav-right > .btn{ display:none; }
  .nav-links{
    position:fixed; inset:0; z-index:-1;
    display:flex; flex-direction:column; align-items:stretch; justify-content:center; gap:0;
    padding:calc(var(--nav-h, 88px) + 24px) var(--gutter) 48px;
    background:var(--ink); color:var(--white);
    opacity:0; visibility:hidden; transform:translateY(-12px);
    transition:opacity .45s var(--ease), transform .55s var(--ease), visibility 0s linear .55s;
  }
  .nav-links.open{ opacity:1; visibility:visible; transform:none; transition:opacity .45s var(--ease), transform .55s var(--ease); }
  .nav-links li{ border-top:1px solid var(--line-dark); }
  .nav-links a{ display:block; padding-block:18px; font-size:clamp(1.9rem, 7vw, 2.6rem); font-weight:300; letter-spacing:-.01em; }
  .nav-links a::after{ display:none; }
  .nav-links .nav-cta{ display:block; padding-top:28px; }
  .nav-links .nav-cta .btn{ display:inline-flex; font-size:.95rem; font-weight:700; letter-spacing:.01em; padding:18px 26px; }
  .nav-links .nav-cta .btn-solid{ background:var(--burnt); color:var(--white); }

  /* While the drawer is open the bar sits on the ink panel. */
  .nav.menu-open{ background:transparent; border-bottom-color:transparent; color:var(--white); -webkit-backdrop-filter:none; backdrop-filter:none; }
  .nav.menu-open .wm-mark, .nav.menu-open .wm-word{ color:var(--white); }
  .nav.menu-open .burger{ border-color:rgba(255,255,255,.5); }

  .closing-inner{ grid-template-columns:minmax(0,1fr); }
  .sec-head{ grid-template-columns:minmax(0,1fr); }
  .page-top{ padding-top:var(--nav-h, 88px); }
  .page-top-in{ padding-top:clamp(44px, 8vw, 72px); }
  .page-top-copy{ max-width:none; }
  .shard, .page-top--compact .shard{
    position:relative; inset:auto; width:auto; height:clamp(110px, 24vw, 200px);
    clip-path:polygon(0 0, 100% 0, 100% 100%, 0 46%);
  }
  .stat-strip{ grid-template-columns:repeat(2, minmax(0,1fr)); max-width:none; }
  .stat:nth-child(3){ padding-left:0; border-left:0; }
  .stat:nth-child(n+3){ margin-top:8px; }
}
@media (max-width: 640px){
  .footer-main{ grid-template-columns:minmax(0,1fr); }
  .wm-mark{ width:27px; height:30px; }
  .wm-word{ width:98px; height:30px; }
  .nav-in{ padding-block:16px; }
}