/* =====================================================================
   39 Point Cloud (Linnet Studio theme library)
   Architects and engineers. Warm black, bone type, one signal blue;
   point-cloud drawings instead of photos, mono figure captions, a footer
   drawn as a title-block sheet. No scripts. Mobile first: 760 / 1080.
   ===================================================================== */

/* ---------- Shared token layer (the presets in _presets/ write these) ---------- */
:root {
  --c-bg: #0a0908;            /* page */
  --c-surface: #11100e;       /* panels, demo bar, overlay rows */
  --c-ink: #ece6d8;           /* bone: text, primary button */
  --c-muted: #8a8478;         /* secondary text, mono labels (5.4:1) */
  --c-line: #26231f;          /* hairlines (decorative) */
  --c-line-strong: #6b665c;   /* field borders, outline buttons (3.5:1) */
  --c-accent: #86b6f0;        /* signal blue: eyebrows, arrow tiles, + marks, scan */
  --c-on-accent: #0a0908;
  --c-accent-2: #e0a458;      /* status only ("On site") */
  --f-display: "Inter Tight", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-body: "Inter Tight", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --r-sm: 0px;
  --r-lg: 0px;
  --r-pill: 0px;              /* buttons are square, like the original */
  --s-1: 8px;
  --s-2: 16px;
  --s-3: 24px;
  --s-4: 40px;
  --s-5: 64px;
  --s-6: 112px;

  /* Theme names, mapped to the shared layer */
  --paper: var(--c-bg);
  --bone: var(--c-ink);
  --grey: var(--c-muted);
  --dim: #6f6a60;             /* second line of two-tone headings: 24px and up only (3.7:1) */
  --signal: var(--c-accent);
  --rule: color-mix(in srgb, var(--c-ink) 20%, transparent);
  --head-line: color-mix(in srgb, var(--c-ink) 26%, transparent);
  --cloud-filter: none;       /* light presets: invert(1) hue-rotate(180deg) turns the bone clouds dark */
  --gut: 20px;
  --bar-h: 56px;
  --sec: 36px;                /* section padding */
  --ncs-on-style: none;       /* the nav styles its own current link from --on */
}
@media (min-width: 760px) { :root { --gut: 32px; --sec: 88px; } }
@media (min-width: 1080px) { :root { --gut: 48px; --bar-h: 64px; --sec: 112px; } }

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--c-bg); scroll-padding-top: calc(var(--bar-h) + 8px); -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--c-bg); color: var(--c-ink); font: 400 16px/1.55 var(--f-body); -webkit-font-smoothing: antialiased; overflow-x: clip; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
p { margin: 0; text-wrap: pretty; }
h1, h2, h3 { margin: 0; font-family: var(--f-display); font-weight: 500; letter-spacing: -0.03em; line-height: 1; text-wrap: balance; }
ul, ol { margin: 0; padding: 0; list-style: none; }
dl, dd, figure, blockquote, fieldset { margin: 0; }
fieldset { border: 0; padding: 0; min-width: 0; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.i { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.sr-only, .vh { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.vh { opacity: 0; }
.tab { font-variant-numeric: tabular-nums; }
.acc { color: var(--c-accent); }
.mute { color: var(--c-muted); }
.dim { color: var(--dim); }
.two > span { display: block; }
@media (max-width: 759px) { .desk-only { display: none !important; } }
:focus-visible { outline: 2px solid var(--c-accent); outline-offset: 3px; }
a, button, summary, label { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.skip { position: absolute; left: var(--gut); top: -60px; z-index: 200; padding: 12px 16px; background: var(--c-ink); color: var(--c-bg); font: 500 13px/1 var(--f-mono); text-transform: uppercase; letter-spacing: .12em; }
.skip:focus { top: 8px; }

/* Mono labels: every caption, data field and nav link */
.mono { font-family: var(--f-mono); font-size: 12px; font-weight: 400; line-height: 1.45; letter-spacing: .14em; text-transform: uppercase; }
.wrap { width: 100%; max-width: 1440px; margin-inline: auto; padding-inline: var(--gut); }
section.wrap { padding-block: var(--sec); border-top: 1px solid var(--c-line); }

/* Type scale (measured: h1 50px / 38px, section h2 63px / 36px, chapter 36px / 24px) */
h1 { font-size: clamp(38px, 2.4vw + 22px, 58px); line-height: .98; }
.h-xl { font-size: clamp(64px, 11.4vw, 168px); line-height: .9; letter-spacing: -0.045em; }
.h-lg { font-size: clamp(34px, 3vw + 18px, 64px); }
.h-md { font-size: clamp(30px, 1.6vw + 20px, 44px); line-height: 1.04; }
.h-sm { font-size: clamp(24px, 1vw + 18px, 36px); line-height: 1.06; letter-spacing: -0.022em; }
.intro, .lede { color: var(--c-muted); max-width: 46ch; margin-top: var(--s-3); }
.lede { color: var(--c-ink); font-size: 17px; }

/* Figure heads: "FIG. 03 / METHOD / ..." two mono lines */
.fig-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 24px; margin-bottom: var(--s-3); }
.fig-head > :last-child { color: var(--c-muted); }
.fig-head > p:last-child, .projects .intro, figure.frame figcaption span + span { display: none; }
.fig-solo { margin-bottom: var(--s-2); }

/* Spec rows (mono data) */
.spec > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--c-line); font-family: var(--f-mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.spec > div:first-child { border-top: 1px solid var(--c-line); }
.spec dt { color: var(--c-muted); flex: none; }
.spec dd { text-align: right; font-variant-numeric: tabular-nums; }
.spec a { display: inline-block; padding-block: 2px; text-decoration-color: var(--c-line-strong); text-underline-offset: 4px; }

/* Buttons: bone label + blue arrow tile, square */
.btn { display: inline-flex; align-items: stretch; min-height: 48px; border: 0; padding: 0; background: none; color: inherit; font: inherit; cursor: pointer; text-decoration: none; transition: transform 120ms cubic-bezier(.23, 1, .32, 1); }
.btn:active { transform: scale(.97); }
.btn-l { display: inline-flex; align-items: center; padding: 0 22px; background: var(--c-ink); color: var(--c-bg); font: 500 12px/1 var(--f-mono); letter-spacing: .16em; text-transform: uppercase; }
.btn-t { display: inline-grid; place-items: center; width: 48px; background: var(--c-accent); color: var(--c-on-accent); }
.btn-t .i { transition: transform .25s cubic-bezier(.2, .7, .2, 1); }
.link-mono { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font: 400 12px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; }
.link-mono > :not(svg), .link-mono { background: linear-gradient(currentColor 0 0) 0 calc(50% + 11px)/calc(100% - 26px) 1px no-repeat; }
.link-mono .i { width: 16px; height: 16px; }
.box-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 1px solid var(--c-line-strong); color: var(--c-ink); font: 400 12px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; white-space: nowrap; }
.box-btn .i { width: 16px; height: 16px; }
.cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; margin-top: var(--s-4); }

/* + corner marks on figure frames */
.frame { --pc: var(--c-accent); position: relative; border: 1px solid var(--c-line);
  background:
    linear-gradient(var(--pc) 0 0) 0 4px / 9px 1px, linear-gradient(var(--pc) 0 0) 4px 0 / 1px 9px,
    linear-gradient(var(--pc) 0 0) 100% 4px / 9px 1px, linear-gradient(var(--pc) 0 0) calc(100% - 4px) 0 / 1px 9px,
    linear-gradient(var(--pc) 0 0) 0 calc(100% - 4px) / 9px 1px, linear-gradient(var(--pc) 0 0) 4px 100% / 1px 9px,
    linear-gradient(var(--pc) 0 0) 100% calc(100% - 4px) / 9px 1px, linear-gradient(var(--pc) 0 0) calc(100% - 4px) 100% / 1px 9px;
  background-repeat: no-repeat; }
figure.frame figcaption { display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px; border-top: 1px solid var(--c-line); }

/* Point clouds: our own renders (img/), bone and blue on transparent */
.cloud { position: relative; aspect-ratio: 4 / 3; overflow: hidden; }
.cloud img { width: 100%; height: 100%; object-fit: cover; filter: var(--cloud-filter); }

/* Swipe rails (phones) */
.rail { display: grid; grid-auto-flow: column; grid-auto-columns: 84%; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gut) * -1); padding-inline: var(--gut); scroll-padding-inline: var(--gut); }
.rail::-webkit-scrollbar { display: none; }
.rail > * { scroll-snap-align: start; min-width: 0; }

/* ---------- Demo bar, ruler ---------- */
.demo { padding: 7px var(--gut); background: var(--c-surface); color: var(--c-muted); border-bottom: 1px solid var(--c-line); font: 400 13px/1.4 var(--f-body); text-align: center; }
/* Fixed left ruler with a blue progress mark (scroll-linked where supported) */
.ruler { position: fixed; z-index: 30; left: 4px; top: 0; bottom: 0; width: 11px; pointer-events: none;
  background:
    linear-gradient(var(--rule) 0 0) right top / 1px 100% no-repeat,
    repeating-linear-gradient(to bottom, var(--rule) 0 1px, transparent 1px 16px) right top / 5px 100% no-repeat,
    repeating-linear-gradient(to bottom, var(--rule) 0 1px, transparent 1px 96px) right 8px / 11px 100% no-repeat; }
.ruler i { position: absolute; right: -1px; top: 0; width: 3px; height: 56px; background: var(--c-accent); opacity: 0; }
@supports (animation-timeline: scroll()) {
  .ruler i { opacity: 1; animation: ruler-run linear both; animation-timeline: scroll(root); }
  @keyframes ruler-run { from { transform: translateY(var(--bar-h)); } to { transform: translateY(calc(100vh - 56px)); } }
}

/* ---------- Header bar ---------- */
.bar { position: sticky; top: 0; z-index: 50; background: var(--c-bg); border-bottom: 1px solid var(--head-line); }
.bar-in { display: flex; align-items: center; gap: 10px; max-width: 1440px; height: var(--bar-h); margin-inline: auto; padding-inline: calc(var(--gut) - 10px) var(--gut); }
.menu-btn { display: grid; place-items: center; width: 44px; height: 44px; color: var(--c-ink); }
.menu-btn .i { width: 24px; height: 24px; stroke-width: 1.3; }
.logo { display: inline-flex; align-items: center; min-height: 44px; margin-right: auto; font: 600 15px/1 var(--f-display); letter-spacing: .22em; text-transform: uppercase; text-decoration: none; white-space: nowrap; }
.site-nav { display: none; }
.bar-act { display: flex; align-items: center; gap: 12px; }
.chip-tel, .bar-start { display: none; }
.chip-tel { align-items: center; gap: 10px; min-height: 44px; font: 400 12px/1 var(--f-mono); letter-spacing: .14em; text-decoration: none; font-variant-numeric: tabular-nums; }
.sq { width: 7px; height: 7px; background: var(--c-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-accent) 22%, transparent); }

/* ---------- Menu overlay (#menu :target) ---------- */
.ov { position: fixed; inset: 0; z-index: 100; display: flex; flex-direction: column; overflow-y: auto; overscroll-behavior: contain; background: var(--c-bg); visibility: hidden; opacity: 0; transition: opacity .3s ease, visibility 0s linear .3s; }
.ov:target { visibility: visible; opacity: 1; transition: opacity .3s ease; }
html:has(#menu:target) { overflow: hidden; }
body:has(#menu:target) :is(.bar, main, .sheet, .ruler) { visibility: hidden; }
.ov-top { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; height: var(--bar-h); padding-inline: var(--gut); border-bottom: 1px solid var(--head-line); }
.ov-mark { font: 600 15px/1 var(--f-display); letter-spacing: .22em; text-transform: uppercase; }
.ov-body { flex: 1; display: grid; align-content: start; gap: var(--s-4); padding: var(--s-4) var(--gut) calc(var(--s-4) + env(safe-area-inset-bottom)); }
.ov-list { border-bottom: 1px solid var(--c-line); }
.ov-list a { display: grid; grid-template-columns: 56px 1fr; align-items: baseline; min-height: 64px; padding-block: 10px; border-top: 1px solid var(--c-line); text-decoration: none; }
.ov-n { font: 400 12px/1 var(--f-mono); letter-spacing: .14em; color: var(--c-muted); }
.ov-list li:first-child .ov-n { color: var(--c-accent); }
.ov-t { font: 500 clamp(36px, 6.4vh, 58px)/1.05 var(--f-display); letter-spacing: -0.035em; transition: transform .3s cubic-bezier(.2, .7, .2, 1), color .2s; }
.ov-side { display: grid; gap: var(--s-2); align-content: start; }
.ov-addr { color: var(--c-muted); }
.ov-side .btn { width: 100%; }
.ov-side .btn-l { flex: 1; justify-content: center; }
@media (prefers-reduced-motion: no-preference) {
  .ov:target .ov-list li { animation: ov-rise .55s cubic-bezier(.2, .7, .2, 1) both; animation-delay: calc(80ms + var(--d, 0) * 45ms); }
  .ov-list li:nth-child(2) { --d: 1; } .ov-list li:nth-child(3) { --d: 2; } .ov-list li:nth-child(4) { --d: 3; } .ov-list li:nth-child(5) { --d: 4; }
}
@keyframes ov-rise { from { opacity: 0; transform: translateY(18px); } }

/* ---------- Hero ---------- */
.hero { position: relative; overflow: clip; max-width: 1440px; margin-inline: auto; padding-inline: var(--gut); padding-top: 16px; }
.hero-fig { position: relative; }
.fig-cap p:first-child { color: var(--c-ink); }
.fig-cap-l p + p { display: none; }
.fig-cap-r { display: none; }
.cloud-hero { aspect-ratio: 1400 / 1000; width: calc(100% + var(--gut) * 2); margin: 4px calc(var(--gut) * -1) 0; overflow: visible; }
.cloud-hero .scan-img { width: 100%; height: 100%; object-fit: contain; }
.cloud-ov { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.ov-ring { fill: none; stroke: var(--rule); stroke-width: 1.5; }
.ov-orbit { fill: none; stroke: var(--c-ink); stroke-opacity: .55; stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 0 9; }
.ov-plane { fill: color-mix(in srgb, var(--c-accent) 9%, transparent); stroke: var(--c-accent); stroke-width: 1.5; }
.ov-cone { fill: none; stroke: var(--c-accent); stroke-opacity: .7; stroke-width: 1.2; }
.ov-drone { fill: none; stroke: var(--c-ink); stroke-width: 2; }
.cv-t { fill: var(--c-muted); font: 400 22px var(--f-mono); letter-spacing: .14em; }
.flag { position: absolute; left: var(--x); top: var(--y); z-index: 2; transform: translate(calc(-100% - 6px), -50%); padding: 6px 9px; background: color-mix(in srgb, var(--c-bg) 86%, transparent); border: 1px solid var(--c-line-strong); color: var(--c-ink); font: 400 12px/1.2 var(--f-mono); letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.flag b { font-weight: 500; color: var(--c-accent); margin-right: 6px; }
.flag::after { content: ""; position: absolute; right: -6px; top: 50%; width: 5px; height: 5px; margin-top: -2px; background: var(--c-accent); }
.flag-l { display: none; transform: translate(6px, -50%); }
.flag-l::after { right: auto; left: -6px; }
.fig-hint { display: none; }
.hero-text { position: relative; z-index: 2; padding-top: var(--s-2); }
.eyebrow { color: var(--c-accent); margin-bottom: var(--s-2); }
.hero-text .lede { color: var(--c-muted); }
.hero .cta-row { margin-top: var(--s-3); }
.rating { margin-top: var(--s-3); }
.hero-stats { display: grid; grid-template-columns: 1fr 1fr; margin: var(--s-2) calc(var(--gut) * -1) 0; border-top: 1px solid var(--c-line); }
.hero-stats > div { padding: 14px var(--gut) 16px; border-bottom: 1px solid var(--c-line); }
.hero-stats > div:nth-child(odd) { border-right: 1px solid var(--c-line); }
.hero-stats dt { font: 400 12px/1.35 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); }
.hero-stats dd { margin-top: 6px; font: 400 15px/1 var(--f-mono); letter-spacing: .08em; font-variant-numeric: tabular-nums; }

/* The signature moment: a blue scan band sweeps the drawing in (CSS only; the resting state is the finished drawing) */
@media (prefers-reduced-motion: no-preference) {
  .cloud-hero .scan-img { animation: scan-in 1.9s cubic-bezier(.55, 0, .25, 1) .25s backwards; }
  .cloud-hero::before { content: ""; position: absolute; z-index: 3; top: 0; bottom: 0; left: 0; width: 12%; pointer-events: none;
    background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--c-accent) 26%, transparent) 70%, color-mix(in srgb, var(--c-accent) 55%, transparent));
    border-right: 1px solid var(--c-accent); opacity: 0; animation: scan-band 1.9s cubic-bezier(.55, 0, .25, 1) .25s both; }
  .cloud-ov, .flag { animation: fade-in .7s ease 1.9s backwards; }
}
@keyframes scan-in { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes scan-band { 0% { opacity: 1; transform: translateX(-100%); } 88% { opacity: 1; } 100% { opacity: 0; transform: translateX(780%); } }
@keyframes fade-in { from { opacity: 0; } }

/* ---------- Manifesto ---------- */
.manifesto { font: 500 clamp(24px, 3.2vw + 12px, 54px)/1.1 var(--f-display); letter-spacing: -0.028em; text-wrap: balance; }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .manifesto { view-timeline: --mf block; }
    .manifesto span { color: var(--dim); animation: lit linear both; animation-timeline: --mf; animation-range: cover calc(14% + var(--i) * 1%) cover calc(19% + var(--i) * 1%); }
  }
}
@keyframes lit { to { color: var(--c-ink); } }

/* ---------- Method chapters ---------- */
.method .h-md { margin-bottom: var(--s-4); }
.chap { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: var(--s-3); }
.chap-n { margin-bottom: 10px; }
.chap-n .acc { margin-right: 10px; }
.chap-text > p:not(.mono) { margin-top: 12px; color: var(--c-muted); }
.chap .spec { display: none; }
.drawing { width: 100%; height: auto; aspect-ratio: 800 / 440; }
.chap-fig .drawing { aspect-ratio: 4 / 3; padding: 8%; }

/* Line drawings (symbols in the sprite) */
.dw-grid { fill: none; stroke: var(--c-line-strong); stroke-width: 1; stroke-dasharray: 2 7; }
.dw-bub { fill: var(--c-bg); stroke: var(--c-muted); stroke-width: 1.2; }
.dw-txt text { fill: var(--c-muted); font: 400 13px var(--f-mono); letter-spacing: .08em; text-anchor: middle; }
.dw-l text { text-anchor: middle; font-size: 14px; }
.dw-r text { text-anchor: end; }
.dw-wall { fill: none; stroke: var(--c-ink); stroke-width: 3; }
.dw-wall .thin { stroke-width: 1; stroke-opacity: .7; }
.dw-thin { fill: none; stroke: var(--c-muted); stroke-width: 1.1; }
.dw-col { fill: var(--c-ink); }
.dw-dots { fill: none; stroke: var(--c-accent); stroke-width: 3.2; stroke-linecap: round; stroke-dasharray: 0 8; transform: translate(3px, 4px); }
.dw-acc { fill: none; stroke: var(--c-accent); stroke-width: 1.6; }
.dw-acc .dot { stroke-width: 3.2; stroke-linecap: round; stroke-dasharray: 0 7; }
.dw-acc-t text { fill: var(--c-accent); font: 500 16px var(--f-mono); letter-spacing: .1em; text-anchor: start; }

/* ---------- Selected rows + CTA (computers and tablets) ---------- */
.sheet-cols > .sc-id, .sheet-cols > nav.sc { display: none; }
.rows { border-bottom: 1px solid var(--c-line); }
.rows a { display: grid; grid-template-columns: 36px 1fr 24px; align-items: center; gap: 10px; min-height: 68px; border-top: 1px solid var(--c-line); text-decoration: none; }
.rows a > span:nth-of-type(n+3) { display: none; }
.rows { margin-top: var(--s-3); }
.row-t { font: 500 clamp(22px, 2.2vw, 36px)/1.1 var(--f-display); letter-spacing: -0.025em; transition: transform .3s cubic-bezier(.2, .7, .2, 1); }
.cta .h-xl { margin-top: 0; font-size: clamp(56px, 11.4vw, 168px); }
.cta-head { display: none; }
.cta .cta-row { margin-top: var(--s-3); }
.chap-fig .cloud, .card .cloud { aspect-ratio: 16 / 11; }

/* ---------- Services ---------- */
.head-split .spec-side { display: none; }
.svc-list { margin-top: var(--s-4); border-bottom: 1px solid var(--c-line); }
.svc summary { display: grid; grid-template-columns: 36px 1fr 44px; align-items: center; gap: 8px; min-height: 64px; padding-block: 10px; border-top: 1px solid var(--c-line); cursor: pointer; list-style: none; }
.svc summary::-webkit-details-marker { display: none; }
.svc-t { font: 500 21px/1.15 var(--f-display); letter-spacing: -0.02em; }
.svc-d { display: none; }
.pm { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--c-line); color: var(--c-ink); transition: transform .3s cubic-bezier(.2, .7, .2, 1), border-color .2s; }
.svc[open] .pm { transform: rotate(45deg); border-color: var(--c-accent); }
.svc-body { display: grid; gap: var(--s-3); padding: 4px 0 var(--s-3) 44px; }
.svc-body > p { color: var(--c-muted); }

/* ---------- Clients ---------- */
.clients .h-md { margin-bottom: var(--s-3); }
.cl-grid { grid-auto-columns: 62%; }
.cl-grid li { padding: 16px; border: 1px solid var(--c-line); }
.cl-grid h3 { margin-top: 18px; font-size: 19px; letter-spacing: -0.015em; line-height: 1.15; }
.cl-grid li > p:last-child { margin-top: 8px; color: var(--c-muted); font-size: 16px; line-height: 1.45; }

/* ---------- Projects ---------- */
.chips { position: relative; display: flex; flex-wrap: wrap; gap: 8px; }
.chips label { display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border: 1px solid var(--c-line-strong); color: var(--c-ink); font: 400 12px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; cursor: pointer; transition: background .2s, color .2s; }
.chips input:checked + label { background: var(--c-ink); color: var(--c-bg); border-color: var(--c-ink); }
.chips input:focus-visible + label { outline: 2px solid var(--c-accent); outline-offset: 3px; }
.pj .chips { margin: var(--s-4) 0 var(--s-3); }
.cards { gap: 12px; }
.card h3 { margin-top: 14px; font-size: 21px; letter-spacing: -0.02em; line-height: 1.15; }
.card h3::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 10px; vertical-align: .2em; background: var(--c-accent); transform: scale(0); transition: transform .25s cubic-bezier(.3, .7, .3, 1.4); }
.card > p { margin-top: 6px; }
.card figure .cloud { transition: opacity .3s ease; }
.pj-table { display: none; }
/* Highlight: matching projects get a blue mark, the others' drawings fade (text keeps its contrast) */
.pj:has(#pj-home:checked) [data-t="home"] h3::before, .pj:has(#pj-com:checked) [data-t="com"] h3::before, .pj:has(#pj-civ:checked) [data-t="civ"] h3::before { transform: scale(1); }
.pj:has(#pj-home:checked) .card:not([data-t="home"]) .cloud, .pj:has(#pj-com:checked) .card:not([data-t="com"]) .cloud, .pj:has(#pj-civ:checked) .card:not([data-t="civ"]) .cloud { opacity: .22; }
.pj:has(#pj-home:checked) tr[data-t="home"] th, .pj:has(#pj-com:checked) tr[data-t="com"] th, .pj:has(#pj-civ:checked) tr[data-t="civ"] th { color: var(--c-accent); }
.pj:has(#pj-home:checked) tr[data-t="home"] td:first-child, .pj:has(#pj-com:checked) tr[data-t="com"] td:first-child, .pj:has(#pj-civ:checked) tr[data-t="civ"] td:first-child { box-shadow: inset 3px 0 0 var(--c-accent); }
.dot { display: inline-block; width: 7px; height: 7px; margin-right: 10px; background: var(--c-ink); vertical-align: .1em; }
.dot-2 { background: var(--c-accent-2); }

/* ---------- Project detail ---------- */
.facts { display: grid; grid-template-columns: 1fr 1fr; margin-top: var(--s-4); border-top: 1px solid var(--c-line); }
.facts > div { padding: 14px 0; border-bottom: 1px solid var(--c-line); }
.facts > div:nth-child(odd) { padding-right: 12px; border-right: 1px solid var(--c-line); }
.facts > div:nth-child(even) { padding-left: 14px; }
.facts dt { font: 400 12px/1.4 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); }
.facts dd { margin-top: 6px; font-size: 18px; letter-spacing: -0.01em; }
.pr-grid { display: grid; gap: var(--s-4); margin-top: var(--s-4); }
.tabs { position: relative; display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.tabs label { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px; border-bottom: 1px solid var(--c-line); color: var(--c-muted); font: 400 12px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.tabs input:checked + label { color: var(--c-ink); border-bottom-color: var(--c-accent); box-shadow: inset 0 -1px 0 var(--c-accent); }
.tabs input:focus-visible + label { outline: 2px solid var(--c-accent); outline-offset: 2px; }
.panels { display: grid; }
.panels > * { grid-area: 1 / 1; min-width: 0; }
.pnl { visibility: hidden; opacity: 0; transition: opacity .3s ease, visibility 0s linear .3s; }
.pnl .drawing { padding: 14px 12px 4px; }
.pnl figcaption { padding: 8px 12px 12px; }
.pnl-1, .dset:has(#dw-2:checked) .pnl-2, .dset:has(#dw-3:checked) .pnl-3 { visibility: visible; opacity: 1; transition: opacity .3s ease; }
.dset:has(#dw-2:checked, #dw-3:checked) .pnl-1 { visibility: hidden; opacity: 0; transition: opacity .3s ease, visibility 0s linear .3s; }
.pr-text { display: grid; gap: var(--s-3); align-content: start; }
.pr-text > p { color: var(--c-muted); }
.pr-text > p:first-child { color: var(--c-ink); font-size: 17px; }
.timeline { display: grid; grid-template-columns: repeat(5, 1fr); margin-top: var(--s-5); padding-top: 28px; background: linear-gradient(var(--c-line-strong) 0 0) 0 7px / 100% 1px no-repeat; }
.timeline li { position: relative; display: grid; gap: 4px; padding-top: 8px; }
.timeline li::before { content: ""; position: absolute; left: 0; top: -26px; width: 9px; height: 9px; background: var(--c-bg); border: 1px solid var(--c-ink); }
.timeline li:last-child::before { background: var(--c-accent); border-color: var(--c-accent); }

/* ---------- Reviews ---------- */
.reviews .h-md { margin-bottom: var(--s-3); }
.notes li { display: flex; flex-direction: column; gap: 14px; padding: 16px; border: 1px solid var(--c-line); }
.notes li > p:first-child { display: flex; justify-content: space-between; gap: 12px; }
.notes blockquote p { font: 500 18px/1.32 var(--f-display); letter-spacing: -0.015em; }
.notes blockquote p::before { content: "\201C"; }
.notes blockquote p::after { content: "\201D"; }
.who { margin-top: auto; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 12px; align-items: baseline; }

/* ---------- Studio, people, credentials ---------- */
.people { grid-auto-columns: 62%; margin-top: var(--s-4); }
.people li { display: flex; flex-direction: column; gap: 8px; min-height: 128px; padding: 14px; border: 1px solid var(--c-line); }
.people li > p:first-child { display: flex; justify-content: space-between; gap: 8px; margin-bottom: auto; }
.people h3 { font-size: 21px; letter-spacing: -0.02em; line-height: 1.15; padding-top: 24px; }
.people .acc { margin-right: 8px; letter-spacing: 0; }
.cr-grid { display: grid; gap: var(--s-3); }
.miles { display: grid; grid-template-columns: repeat(5, 1fr); margin-top: var(--s-5); border-top: 1px solid var(--c-line); }
.miles li { display: grid; gap: 6px; padding: 18px 16px 0 0; }
.miles b { font: 500 36px/1 var(--f-display); letter-spacing: -0.03em; }
.miles span { color: var(--c-muted); font-size: 15px; }

/* ---------- Contact ---------- */
.ct-grid { display: grid; gap: var(--s-4); }
.brief { display: grid; gap: 20px; margin-top: var(--s-4); }
.fld { display: grid; gap: 6px; }
.fld > label, .fld > legend { padding: 0; font: 400 12px/1.4 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--c-muted); }
.fld > legend { margin-bottom: 8px; }
.req { letter-spacing: .06em; }
.fld input, .fld textarea { width: 100%; min-height: 48px; padding: 10px 0; border: 0; border-bottom: 1px solid var(--c-line-strong); border-radius: 0; background: transparent; color: var(--c-ink); font: 400 16px/1.4 var(--f-body); }
.fld textarea { resize: vertical; min-height: 72px; }
.fld input:focus-visible, .fld textarea:focus-visible { outline: none; border-bottom-color: var(--c-accent); box-shadow: 0 1px 0 var(--c-accent); }
.fld ::placeholder { color: var(--c-muted); opacity: 1; }
.brief .btn { justify-self: start; }
.sent { display: none; padding: 14px 16px; border: 1px solid var(--c-accent); font: 400 13px/1.5 var(--f-mono); letter-spacing: .06em; }
.sent:target { display: block; }
.office { display: grid; gap: var(--s-2); align-content: start; padding: 18px; }
.office > p.mono { display: flex; justify-content: space-between; gap: 12px; }
.locator { display: none; width: 100%; height: auto; }
.lc-ring { fill: none; stroke: var(--rule); stroke-dasharray: 2 5; }
.lc-grid { fill: none; stroke: var(--c-line); }
.lc-pin { fill: var(--c-accent); }
.lc-pin-o { fill: none; stroke: var(--c-accent); stroke-opacity: .6; }
.locator text { fill: var(--c-muted); font: 400 12px var(--f-mono); letter-spacing: .12em; }
.addr { display: flex; gap: 12px; align-items: flex-start; min-height: 44px; padding-block: 4px; text-decoration: none; }
.addr .i { margin-top: 3px; color: var(--c-accent); }
.addr span { text-decoration: underline; text-decoration-color: var(--c-line-strong); text-underline-offset: 4px; }

/* ---------- Footer: the drawing sheet ---------- */
.sheet { padding: var(--s-4) var(--gut) var(--gut); border-top: 1px solid var(--c-line); }
.sheet-in { --pc: var(--c-accent); position: relative; max-width: calc(1440px - var(--gut) * 2); margin-inline: auto; padding: 40px 16px 0; border: 1px solid var(--c-line); container-type: inline-size;
  background:
    linear-gradient(var(--pc) 0 0) 0 6px / 13px 1px, linear-gradient(var(--pc) 0 0) 6px 0 / 1px 13px,
    linear-gradient(var(--pc) 0 0) 100% 6px / 13px 1px, linear-gradient(var(--pc) 0 0) calc(100% - 6px) 0 / 1px 13px,
    linear-gradient(var(--pc) 0 0) 0 calc(100% - 6px) / 13px 1px, linear-gradient(var(--pc) 0 0) 6px 100% / 1px 13px,
    linear-gradient(var(--pc) 0 0) 100% calc(100% - 6px) / 13px 1px, linear-gradient(var(--pc) 0 0) calc(100% - 6px) 100% / 1px 13px;
  background-repeat: no-repeat; }
.refs-top { position: absolute; left: 0; right: 0; top: 0; display: flex; justify-content: space-around; height: 24px; align-items: center; border-bottom: 1px solid var(--c-line); font: 400 12px/1 var(--f-mono); color: var(--c-muted); }
.sheet-head { display: grid; gap: var(--s-3); padding-top: 12px; }
.mail { margin-top: 8px; font-size: clamp(24px, 2.6vw + 12px, 56px); letter-spacing: -0.03em; line-height: 1.1; overflow-wrap: anywhere; }
.mail a { display: inline-block; padding-block: 9px; text-decoration: none; background: linear-gradient(var(--c-line-strong) 0 0) 0 100% / 100% 1px no-repeat; }
/* Giant dotted wordmark: the client's name set in Inter Tight, filled with two offset dot grids */
.dotmark { --dot-tile: 56px; position: relative; margin: var(--s-3) 0 var(--s-3); font: 600 21.2cqi/.86 var(--f-display); letter-spacing: -0.04em; text-transform: uppercase; white-space: nowrap; color: transparent;
  background: var(--c-ink); -webkit-background-clip: text; background-clip: text;
  /* a scattered-dot tile (our own, 72px) masks the letters into a point cloud */
  -webkit-mask: url("data:image/png;base64,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") 0 0 / var(--dot-tile) var(--dot-tile) repeat; mask: url("data:image/png;base64,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") 0 0 / var(--dot-tile) var(--dot-tile) repeat; }
.sheet-cols { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--c-line); margin-inline: -16px; }
.sc { display: grid; gap: 8px; align-content: start; padding: 16px; border-bottom: 1px solid var(--c-line); }
.sc:nth-child(odd) { border-right: 1px solid var(--c-line); }
.sc-id { grid-column: 1 / -1; border-right: 0 !important; }
.sc a { text-decoration: none; }
.sc > p:not(.mono) a { display: inline-block; padding-block: 11px; margin-block: -11px; text-decoration: underline; text-decoration-color: var(--c-line-strong); text-underline-offset: 4px; }
.sc li a { display: flex; align-items: center; gap: 10px; min-height: 44px; }
.sc > p:not(.mono) { color: var(--c-ink); font-size: 15px; line-height: 1.5; }
.sc > p.mute { color: var(--c-muted); }
.north { width: 120px; height: 40px; margin-top: 8px; }
.north path { fill: none; stroke: var(--c-ink); stroke-width: 1.2; }
.north path:first-child { fill: var(--c-ink); }
.north .sbf { fill: var(--c-ink); stroke: none; }
.elev { display: none; }
.tblock { display: grid; grid-template-columns: 1fr 1fr; margin-inline: -16px; }
.tblock > div { padding: 12px 16px; border-bottom: 1px solid var(--c-line); }
.tblock > div:nth-child(odd) { border-right: 1px solid var(--c-line); }
.tblock > div:nth-child(n+5) { display: none; }
.tblock > div:nth-child(3), .tblock > div:nth-child(4) { border-bottom: 0; }
.tblock dt { font: 400 12px/1.3 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); }
.tblock dd { margin-top: 4px; font: 400 13px/1.3 var(--f-mono); letter-spacing: .1em; text-transform: uppercase; }

/* ---------- Hover (fine pointers only) ---------- */
@media (hover: hover) and (pointer: fine) {
  .btn:hover .btn-t .i { transform: translateX(3px); }
  .link-mono:hover, .box-btn:hover { color: var(--c-accent); }
  .box-btn:hover { border-color: var(--c-accent); }
  .site-nav a:hover { color: var(--c-ink); }
  .ov-list a:hover .ov-t { transform: translateX(12px); color: var(--c-accent); }
  .rows a:hover .row-t { transform: translateX(12px); }
  .rows a:hover .i { color: var(--c-accent); }
  .svc summary:hover .svc-t { color: var(--c-ink); }
  .svc summary:hover .pm { border-color: var(--c-accent); }
  .chips label:hover, .tabs label:hover { border-color: var(--c-ink); color: var(--c-ink); }
  .chips input:checked + label:hover { color: var(--c-bg); }
  .pj-table tbody tr:hover { background: var(--c-surface); }
  .sc li a:hover, .sc > p a:hover, .spec a:hover, .addr:hover span, .mail a:hover { color: var(--c-accent); }
}

/* ---------- Tablet (760+) ---------- */
@media (min-width: 760px) {
  .bar-start { display: inline-flex; }
  .hero { padding-top: 24px; }
  .fig-cap-r { display: block; position: absolute; right: 0; top: 0; text-align: right; }
  .cloud-hero { width: 100%; margin-inline: 0; }
  .flag-l { display: block; }
  .hero-stats { grid-template-columns: repeat(4, 1fr); }
  .hero-stats > div { border-right: 1px solid var(--c-line); }
  .hero-stats > div:last-child { border-right: 0; }
  .fig-head > p:last-child, .fig-cap-l p + p, .projects .intro, figure.frame figcaption span + span { display: block; }
  .sheet-cols > .sc-id, .sheet-cols > nav.sc { display: grid; }
  .rows { margin-top: var(--s-5); }
  .manifesto { max-width: 24ch; }
  .cta-head { display: flex; }
  .cta .h-xl { margin-top: var(--s-4); }
  .chap-fig .cloud, .card .cloud { aspect-ratio: 4 / 3; }
  .rows a { grid-template-columns: 64px 1fr 190px 190px 24px; gap: 16px; min-height: 92px; }
  .rows a > span:nth-of-type(n+3) { display: block; }
  .head-split { display: grid; grid-template-columns: 1fr minmax(260px, 340px); gap: var(--s-4); align-items: end; }
  .head-split .spec-side { display: block; }
  .rail { display: grid; grid-auto-flow: row; overflow: visible; margin-inline: 0; padding-inline: 0; scroll-snap-type: none; }
  .chapters { gap: 0; border-bottom: 1px solid var(--c-line); }
  .chap { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s-4); align-items: center; padding-block: var(--s-4); border-top: 1px solid var(--c-line); }
  .chap .spec { display: block; margin-top: var(--s-3); }
  .chap-fig { order: 2; }
  .svc summary { grid-template-columns: 56px minmax(0, 1fr) 44px; }
  .svc-t { font-size: 26px; }
  .svc-body { grid-template-columns: 1fr 1fr; padding-left: 64px; }
  .cl-grid { grid-template-columns: repeat(3, 1fr); gap: 12px; }
  .cards { grid-template-columns: 1fr 1fr; gap: 24px 16px; }
  .facts { grid-template-columns: repeat(4, 1fr); }
  .facts > div { padding: 16px !important; border-right: 1px solid var(--c-line); }
  .facts > div:last-child { border-right: 0; }
  .notes { grid-template-columns: 1fr; gap: 0; border-bottom: 1px solid var(--c-line); }
  .notes li { display: grid; grid-template-columns: 180px 1fr 200px; gap: 24px; align-items: start; padding: 28px 0; border: 0; border-top: 1px solid var(--c-line); }
  .notes li > p:first-child { flex-direction: column; gap: 4px; }
  .notes blockquote p { font-size: clamp(21px, 1.2vw + 10px, 28px); }
  .who { flex-direction: column; margin-top: 0; }
  .people { grid-template-columns: repeat(3, 1fr); gap: 0; border-left: 1px solid var(--c-line); border-top: 1px solid var(--c-line); }
  .people li { min-height: 190px; border: 0; border-right: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); padding: 18px; }
  .cr-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--s-5); align-items: start; }
  .ct-grid { grid-template-columns: minmax(0, 7fr) minmax(280px, 5fr); gap: var(--s-5); align-items: start; }
  .locator { display: block; }
  .office { margin-top: 0; }
  .sheet-in { padding: 48px 28px 0; }
  .sheet-head { grid-template-columns: 1fr auto; align-items: end; }
  .sheet-cols, .tblock { margin-inline: -28px; }
  .sheet-cols { grid-template-columns: 1.2fr 1fr 1fr 1fr; }
  .sc { padding: 20px 28px; border-right: 1px solid var(--c-line); }
  .sc-id { grid-column: auto; border-right: 1px solid var(--c-line) !important; }
  .sc:last-child { border-right: 0; }
  .elev { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; padding: 28px 28px 16px; margin-inline: -28px; border-bottom: 1px solid var(--c-line); }
  .elev svg { width: 100%; height: auto; fill: none; stroke: var(--c-muted); stroke-width: 1; }
  .elev span { display: block; margin-top: 8px; font: 400 12px/1.3 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); }
  .tblock { grid-template-columns: repeat(7, 1fr); }
  .tblock > div, .tblock > div:nth-child(n+5) { display: block; border-bottom: 0; border-right: 1px solid var(--c-line); padding: 14px 16px 18px; }
  .tblock > div:last-child { border-right: 0; }
}

/* ---------- Computers (1080+) ---------- */
@media (min-width: 1080px) {
  .bar-in { gap: 14px; }
  .site-nav { position: absolute; left: 50%; transform: translateX(-50%); display: flex; gap: 30px; }
  .site-nav a { position: relative; display: inline-flex; align-items: flex-start; gap: 4px; min-height: 44px; padding-top: 15px; color: color-mix(in srgb, var(--c-ink) calc(var(--on, 0) * 100%), var(--c-muted)); font: 400 12px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; transition: color .2s; }
  .site-nav a::before { content: ""; position: absolute; left: -14px; top: 18px; width: 6px; height: 6px; background: var(--c-accent); transform: scale(var(--on, 0)); transition: transform .25s cubic-bezier(.3, .7, .3, 1.4); }
  .site-nav sup { font-size: 12px; line-height: 1; letter-spacing: .04em; position: relative; top: -6px; color: var(--c-muted); }
  .chip-tel { display: none; margin-right: 6px; }
  .bar-call { display: none; }

  /* Hero: the drawing fills the right two-thirds behind the text, stats strip along the bottom */
  .hero { display: grid; grid-template-rows: 1fr auto; min-height: max(720px, calc(100svh - var(--bar-h) - 31px)); padding-top: 0; }
  .hero-fig { position: absolute; inset: 0; }
  .fig-cap { position: absolute; top: 24px; z-index: 3; }
  .fig-cap-l { left: var(--gut); }
  .fig-cap-r { right: var(--gut); }
  .cloud-hero { position: absolute; right: -2%; top: 56px; width: 66%; margin: 0; }
  .hero-fig::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 52%; z-index: 1; pointer-events: none; background: linear-gradient(90deg, var(--c-bg) 46%, transparent); }
  .fig-hint { display: block; position: absolute; right: var(--gut); bottom: 112px; z-index: 3; }
  .hero-text { align-self: center; max-width: 600px; padding: 120px 0 72px; }
  .hero-text .lede { max-width: 40ch; }
  .hero-stats { position: relative; z-index: 3; grid-template-columns: repeat(4, minmax(0, 1fr)) 1.3fr; margin: 0 calc(var(--gut) * -1); background: var(--c-bg); border-bottom: 1px solid var(--c-line); }
  .hero-stats > div { padding: 18px var(--gut) 20px; border-bottom: 0; }
  .hero-stats > div:nth-child(4) { border-right: 1px solid var(--c-line) !important; }
  .hero-stats::after { content: "01 Scan    02 Design    03 Engineer    04 Permit"; white-space: pre; align-self: center; padding-inline: var(--gut); color: var(--c-muted); font: 400 12px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; }

  .statement { padding-block: calc(var(--sec) * 1.3); }
  .statement .fig-head { margin-bottom: var(--s-5); }
  .chap { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: var(--s-6); padding-block: var(--s-5); }
  .chap-text { max-width: 420px; }
  .cl-grid { grid-template-columns: repeat(5, 1fr); gap: 0; border-left: 1px solid var(--c-line); }
  .cl-grid li { border: 0; border-right: 1px solid var(--c-line); border-block: 1px solid var(--c-line); padding: 18px 20px 28px; }
  .svc summary { grid-template-columns: 80px minmax(0, 1fr) minmax(0, 1fr) 44px; gap: 24px; min-height: 104px; }
  .svc-t { font-size: clamp(28px, 2.4vw, 38px); letter-spacing: -0.03em; color: var(--dim); transition: color .2s; }
  .svc[open] .svc-t { color: var(--c-ink); }
  .svc-d { display: block; color: var(--c-muted); max-width: 44ch; justify-self: end; text-align: right; }
  .svc-body { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--s-5); padding: 8px 68px var(--s-4) 104px; }
  .cards { grid-template-columns: repeat(4, 1fr); }
  .pj-table { display: table; width: 100%; margin-top: var(--s-5); border-collapse: collapse; }
  .pj-table th, .pj-table td { padding: 0 12px; height: 64px; border-top: 1px solid var(--c-line); text-align: left; font: 400 12px/1.3 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--c-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
  .pj-table thead th { height: 44px; border-top: 0; }
  .pj-table tbody th { color: var(--c-ink); font: 500 22px/1.1 var(--f-display); letter-spacing: -0.02em; text-transform: none; transition: color .2s; }
  .pj-table tbody td:last-child { color: var(--c-ink); }
  .pj-table th a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; text-decoration-color: var(--c-line-strong); text-underline-offset: 5px; }
  .pj-table tbody tr:last-child > * { border-bottom: 1px solid var(--c-line); }
  .pr-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--s-5); }
  .pr-text { padding-top: 56px; }
  .people { grid-template-columns: repeat(3, 1fr); }
  .ct-grid { grid-template-columns: minmax(0, 6fr) minmax(320px, 5fr); gap: var(--s-6); }
  .contact .office { margin-top: 8px; }
  .sheet { padding-top: var(--s-5); padding-bottom: var(--gut); }
  .dotmark { --dot-tile: 72px; }
  .ov-body { grid-template-columns: minmax(0, 7fr) minmax(320px, 4fr); gap: var(--s-6); align-content: start; padding-block: var(--s-5) var(--s-4); }
  .ov-list a { min-height: 76px; grid-template-columns: 72px 1fr; }
  .ov-side { align-self: start; }
  .sheet-in { padding: 56px 40px 0; }
  .sheet-cols, .tblock, .elev { margin-inline: -40px; }
  .sc { padding: 24px 40px; }
  .elev { padding: 32px 40px 18px; gap: 32px; }
}


@media (min-width: 1080px) and (max-width: 1279px) {
  .hero-text { max-width: 500px; }
  .flag-l { display: none; }
  .hero-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .hero-stats::after { content: none; }
  .hero-stats > div:nth-child(4) { border-right: 0 !important; }
}
@media (min-width: 1280px) { .chip-tel { display: inline-flex; } }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-delay: 0s !important; transition-duration: .001ms !important; }
  .ruler i { animation-duration: auto !important; }
}