/* 
 * Can 2026 — Phase 9 CSS architecture
 * Cascade contract: reset → tokens → base → layout → components → motion → utilities → overrides.
 * Canonical breakpoints: micro ≤ 23rem; compact ≤ 47.99rem; tablet 48–63.99rem;
 * wide ≥ 64rem; extended ≥ 75rem; short-wide ≥ 64rem and height ≤ 43rem.
 * Component layout never depends on motion state. GSAP inline transform/opacity remains authoritative.
  */

@layer reset, tokens, base, layout, components, motion, utilities, overrides;

@layer reset{

*,*::before,*::after{box-sizing:border-box}
*{margin:0}

html{
  background:var(--ink);
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  /* Native smooth scroll. No JS scroll hijacking: it is the single largest
     source of jank + accessibility complaints on touch. */
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-height) + var(--space-s));
}
@media (prefers-reduced-motion:reduce) and (max-width:0px){html{scroll-behavior:auto}}

body{
  min-width:320px;
  overflow-x:hidden;
  overflow-x:clip;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--font);
  font-size:var(--step-0);
  font-weight:400;
  line-height:1.55;
  letter-spacing:-.005em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body[data-menu-lock="active"]{overflow:hidden}
html[data-menu-scroll-lock="active"],
html[data-menu-scroll-lock="active"] body{overscroll-behavior:none}
html[data-menu-scroll-lock="active"] body{min-height:100%;touch-action:manipulation}

/* Global grain. One pseudo-element, GPU-composited, zero DOM cost. */
body::after{
  content:"";
  position:fixed;
  z-index:9999;
  inset:0;
  pointer-events:none;
  opacity:.032;
  background-image:url("noise.svg");
  background-size:200px 200px;
  mix-blend-mode:overlay;
}

img,svg,video,canvas{display:block;max-width:100%}
img,video{height:auto}}

@layer tokens{

:root{
  color-scheme:dark;

  /* Surface — near-black, never pure #000 (pure black kills grain + banding) */
  --ink:#0a0a0a;
  --ink-soft:#101010;
  --ink-raised:#161616;
  --ink-deep:#050505;

  /* Ink on surface */
  --paper:#ededea;
  --paper-bright:#fbfbf8;
  --paper-muted:#8f8f8a;
  --paper-faint:#5c5c58;

  /* One accent. Used at most twice per viewport. */
  --accent:#37da37;
  --danger:#ff6b6b;

  /* Hairlines — the primary structural device of this design */
  --line:rgba(237,237,234,.14);
  --line-strong:rgba(237,237,234,.32);

  /* Fluid type scale. Every step is clamp()-driven: no breakpoint jumps. */
  --step--1:clamp(.74rem,.71rem + .14vw,.82rem);
  --step-0:clamp(.95rem,.92rem + .16vw,1.05rem);
  --step-1:clamp(1.1rem,1.02rem + .38vw,1.35rem);
  --step-2:clamp(1.5rem,1.28rem + 1.1vw,2.1rem);
  --step-3:clamp(2rem,1.5rem + 2.5vw,3.4rem);
  --step-4:clamp(2.6rem,1.6rem + 5vw,5.6rem);
  --display:clamp(3.2rem,1rem + 11vw,11rem);

  /* Spatial rhythm — negative space scales with the viewport, not the breakpoint */
  --space-3xs:clamp(.25rem,.2rem + .2vw,.4rem);
  --space-2xs:clamp(.5rem,.42rem + .35vw,.75rem);
  --space-xs:clamp(.75rem,.6rem + .6vw,1.1rem);
  --space-s:clamp(1rem,.8rem + .9vw,1.6rem);
  --space-m:clamp(1.6rem,1.2rem + 1.8vw,2.8rem);
  --space-l:clamp(2.4rem,1.6rem + 3.4vw,4.8rem);
  --space-xl:clamp(4rem,2.4rem + 7vw,9rem);
  --space-2xl:clamp(6rem,3rem + 12vw,14rem);

  --container:min(100% - (var(--space-s) * 2),84rem);
  --container-wide:min(100% - var(--space-s),110rem);
  --header-height:4.5rem;
  --radius:clamp(.75rem,2vw,1.25rem);

  /* Motion */
  --ease:cubic-bezier(.2,.75,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --dur:.6s;

  /* Owned by JS: real visual viewport height. Falls back cleanly. */
  --experience-vh:100vh;
  --menu-gutter:clamp(.6rem,1.2vw,1rem);

  --font:-apple-system,BlinkMacSystemFont,"SF Pro Display","Inter","Helvetica Neue",Arial,sans-serif;
}}

@layer base{
a{color:inherit;text-decoration-thickness:.06em;text-underline-offset:.22em}
button,input,select,textarea{font:inherit;color:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
::selection{background:var(--accent);color:var(--ink)}
[hidden]{display:none}

h1,h2,h3,h4{
  font-weight:500;
  letter-spacing:-.045em;
  line-height:.94;
  text-wrap:balance;
}
p{text-wrap:pretty}

[data-counter-value]{
  font-variant-numeric:tabular-nums lining-nums;
}}

@layer layout{

main{display:block}

.section-shell{
  width:var(--container);
  margin-inline:auto;
  padding-block:var(--space-xl);
}

/* Hairline separators between every top-level band. This single rule replaces
   the ~40 per-section border declarations in the previous stylesheet. */
main > section + section,
main > article + section{border-top:1px solid var(--line)}

.section-kicker{
  display:flex;
  align-items:center;
  gap:.6rem;
  color:var(--paper-muted);
  font-size:var(--step--1);
  font-weight:600;
  letter-spacing:.16em;
  line-height:1;
  text-transform:uppercase;
}
/* Kicker tick — a 1px mark, not a decorative blob. */
.section-kicker::before{
  content:"";
  width:1.6rem;
  height:1px;
  background:var(--line-strong);
}

/* §2 · KINETIC LEDE --------------------------------------------------------
   Black slab, green ink. Phase 7 uses a one-shot GSAP clip reveal on short
   highlighted phrases only. The final style remains visible without JS. */

.lede{position:relative}
.lede--display{font-size:var(--step-4)}

.lede-mark{
  position:relative;
  display:inline;
  padding:.04em .18em .1em;
  border-radius:.06em;
  background:#000;
  color:var(--accent);
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
  -webkit-clip-path:inset(0 0 0 0);
  clip-path:inset(0 0 0 0);
}
/* No CSS transition is declared here: GSAP is the sole clip-path owner. */

@media (prefers-reduced-motion:reduce) and (max-width:0px){
  .lede-mark{clip-path:none;-webkit-clip-path:none;transition:none}
}

.section-heading{
  display:grid;
  gap:var(--space-s);
  margin-bottom:var(--space-l);
}
/* Measure the line on the element that actually carries the display size. */
.section-heading h2{font-size:var(--step-3);max-width:18ch}
.section-heading .lede--display{max-width:13ch}

.section-intro{
  max-width:52ch;
  margin-bottom:var(--space-m);
  color:var(--paper-muted);
  font-size:var(--step-1);
  line-height:1.45;
}

.arrow-link{
  display:inline-flex;
  grid-column:2;
  min-width:0;
  align-items:center;
  gap:.5rem;
  margin-top:var(--space-m);
  padding-bottom:.35rem;
  border-bottom:1px solid var(--line-strong);
  color:var(--paper);
  font-size:var(--step--1);
  font-weight:600;
  letter-spacing:.1em;
  text-decoration:none;
  text-transform:uppercase;
  transition:border-color .25s var(--ease),color .25s var(--ease);
}
.arrow-link span{transition:transform .35s var(--ease-out)}
.arrow-link:hover,.arrow-link:focus-visible{border-bottom-color:var(--paper)}
.arrow-link:hover span,.arrow-link:focus-visible span{transform:translate(.25rem,-.25rem)}

[data-reveal]{
  min-width:0;
}
[data-reveal="line-mask"]{
  isolation:isolate;
}}

@layer components{

.site-header{
  position:fixed;
  z-index:10000;
  top:0;left:0;right:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-s);
  min-height:var(--header-height);
  padding:
    max(.6rem,env(safe-area-inset-top))
    max(var(--space-s),env(safe-area-inset-right))
    .6rem
    max(var(--space-s),env(safe-area-inset-left));
  background:linear-gradient(to bottom,rgba(10,10,10,.9),rgba(10,10,10,.4) 60%,transparent);
  transition:background .3s var(--ease),transform .4s var(--ease);
}
/* Scrolled state: the bar earns a surface only once content is behind it. */
/* Hide-on-scroll-down. Header returns the instant intent reverses. */
html[data-menu-state="open"] .site-header{transform:none;background:transparent;border-bottom-color:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}

/* §4 · Suppressed at rest. The FLIP lockup occupies this slot until docked;
   --dock is written by JS and owns the handoff. Non-home routes never set it,
   so the brand renders normally there. */
.site-brand{
  z-index:10001;
  opacity:var(--brand-opacity,1);
  pointer-events:var(--brand-events,auto);
  transition:opacity .25s linear;
  max-width:calc(100vw - 8rem);
  overflow:hidden;
  color:var(--paper);
  font-size:var(--step--1);
  font-weight:700;
  letter-spacing:.12em;
  text-decoration:none;
  text-overflow:ellipsis;
  text-transform:uppercase;
  white-space:nowrap;
}

.menu-disclosure{position:relative;z-index:10020;margin-left:auto}

/* ---- Hamburger: three hairlines. No pill, no circle, no fill. -------------
   Requested change. The button keeps a 44px hit area (WCAG 2.5.8) while the
   *visual* is only the rules themselves — the target is invisible padding. */
.site-header .menu-toggle{
  position:relative;
  z-index:10021;
  display:grid;
  place-items:center;
  width:2.75rem;
  height:2.75rem;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  color:#fff;
  transition:transform .3s var(--ease-out);
}
.site-header .menu-toggle:hover{transform:scale(1.06)}
.site-header .menu-toggle:active{transform:scale(.94)}

/* Label is gone at every size — the glyph is self-evident and the reference
   sites all use a bare mark. Kept in DOM for screen readers via .sr-only. */
.menu-toggle__label{display:none}

.menu-toggle__glyph{
  position:relative;
  display:block;
  width:1.6rem;
  height:.85rem;
  background:none;
}
.menu-toggle__glyph i{
  position:absolute;
  left:0;
  width:100%;
  height:1.5px;
  border-radius:2px;
  background:#fff;
  transform-origin:center;
  transition:
    transform .42s var(--ease-out),
    opacity .2s ease,
    width .42s var(--ease-out),
    top .42s var(--ease-out);
}
.menu-toggle__glyph i:nth-child(1){top:0}
.menu-toggle__glyph i:nth-child(2){top:calc(50% - .75px)}
.menu-toggle__glyph i:nth-child(3){
  top:calc(100% - 1.5px);
  width:62%;
}

/* Middle rule is shorter at rest — a small asymmetry that reads as intentional
   craft rather than a default icon-font hamburger. */

@media (hover:hover) and (pointer:fine){
  .site-header .menu-toggle:hover .menu-toggle__glyph i:nth-child(3){width:100%}
}

/* Open state: collapse to a true X. Middle rule fades, outer rules converge. */
html[data-menu-state="open"] .menu-disclosure .menu-toggle__glyph i:nth-child(1){
  top:calc(50% - .75px);
  transform:rotate(45deg);
}
html[data-menu-state="open"] .menu-disclosure .menu-toggle__glyph i:nth-child(2){
  transform:scaleX(0);
  opacity:0;
}
html[data-menu-state="open"] .menu-disclosure .menu-toggle__glyph i:nth-child(3){
  top:calc(50% - .75px);
  width:100%;
  transform:rotate(-45deg);
}

html[data-menu-state="open"] .menu-disclosure .menu-toggle{
  position:fixed;
  top:max(.6rem,env(safe-area-inset-top));
  right:max(var(--space-s),env(safe-area-inset-right));
}

/* ---- Overlay panel -------------------------------------------------------
   PRESERVED. This is the one component that was already well-built; the
   geometry, slice masks and stagger below are carried over unchanged and only
   re-hosted on the new token names. Do not restyle without a brief. */


/* Critical navigation boot state: never expose the overlay during first paint. */
html:not([data-menu-state="open"]) .site-header .primary-navigation{
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
.site-header .primary-navigation{
  position:fixed;
  z-index:10010;
  inset:0;
  display:block;
  width:100%;
  height:var(--experience-vh);
  max-height:var(--experience-vh);
  overflow:auto;
  overscroll-behavior:contain;
  background:var(--ink-deep);
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  transition:opacity .34s ease,visibility .34s ease;
  scrollbar-width:thin;
  scrollbar-color:var(--line-strong) transparent;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
}
html[data-menu-state="open"] .menu-disclosure .primary-navigation{
  visibility:visible;
  opacity:1;
  pointer-events:auto;
}
.site-header .primary-navigation::-webkit-scrollbar{width:.45rem}
.site-header .primary-navigation::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:999px}

.menu-panel{
  position:relative;
  display:grid;
  min-width:0;
  min-height:100%;
  isolation:isolate;
  background:
    radial-gradient(circle at 86% 8%,rgba(255,255,255,.055),transparent 28%),
    linear-gradient(145deg,#050505,#090909 56%,#040404);
}
.menu-panel::after{
  content:"";
  position:absolute;
  z-index:8;
  inset:0;
  pointer-events:none;
  opacity:.15;
  background-image:url("noise.svg");
  background-size:190px 190px;
  mix-blend-mode:soft-light;
}

.menu-panel__media{
  position:relative;
  z-index:1;
  min-width:0;
  overflow:hidden;
  background:var(--ink-soft);
  opacity:0;
  transform:scale(.985);
  transition:opacity .42s ease .04s,transform .8s var(--ease-out);
}
html[data-menu-state="open"] .menu-disclosure .menu-panel__media{opacity:1;transform:scale(1)}

.menu-panel__image,
.menu-panel__slice img{
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center;
  filter:saturate(.45) contrast(1.14) brightness(.58);
}
.menu-panel__image{
  position:absolute;
  inset:0;
  transform:scale(1.025);
  transition:transform 1.15s var(--ease-out),filter .6s ease;
}
html[data-menu-state="open"] .menu-disclosure .menu-panel__image{transform:scale(1)}
.menu-panel__media--placeholder .menu-panel__image{filter:saturate(.7) contrast(1.03) brightness(.62)}

/* Screen-blend slices: the signature of this panel. */
.menu-panel__slice{
  position:absolute;
  z-index:2;
  left:14%;
  width:72%;
  overflow:hidden;
  opacity:.48;
  border-radius:999px;
  mix-blend-mode:screen;
  transform:translateX(-6%);
  transition:transform 1s var(--ease-out) .14s,opacity .55s ease .1s;
}
.menu-panel__slice img{position:absolute;inset:0}
.menu-panel__slice--one{top:28%;height:8%}
.menu-panel__slice--one img{left:-18%;top:-350%;width:138%;height:1250%}
.menu-panel__slice--two{top:48%;left:22%;width:62%;height:11%;transform:translateX(7%)}
.menu-panel__slice--two img{left:-29%;top:-430%;width:161%;height:910%}
html[data-menu-state="open"] .menu-disclosure .menu-panel__slice{opacity:.66;transform:translateX(0)}

.menu-panel__shade{
  position:absolute;
  z-index:3;
  inset:0;
  background:
    linear-gradient(90deg,rgba(0,0,0,.18),rgba(0,0,0,.02) 48%,rgba(0,0,0,.42)),
    linear-gradient(180deg,rgba(0,0,0,.06),rgba(0,0,0,.56));
}

.menu-panel__content{
  position:relative;
  z-index:10;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  min-width:0;
  padding:
    max(var(--space-s),env(safe-area-inset-top))
    max(var(--space-s),env(safe-area-inset-right))
    max(var(--space-xs),env(safe-area-inset-bottom))
    max(var(--space-s),env(safe-area-inset-left));
}

.site-header .menu-panel__identity{
  justify-self:center;
  align-self:start;
  max-width:calc(100% - 8rem);
  overflow:hidden;
  color:var(--paper);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.14em;
  text-decoration:none;
  text-overflow:ellipsis;
  text-transform:uppercase;
  white-space:nowrap;
  opacity:0;
  transform:translateY(-.5rem);
  transition:opacity .35s ease .18s,transform .55s var(--ease-out) .18s;
}
html[data-menu-state="open"] .menu-disclosure .menu-panel__identity{opacity:1;transform:none}

.site-header .menu-panel__list{
  align-self:center;
  width:100%;
  margin:clamp(2rem,8vh,6rem) 0 clamp(1.5rem,4vh,3rem);
  padding:0;
  list-style:none;
}
.site-header .menu-panel__list li{
  opacity:0;
  transform:translateY(1rem);
  transition:opacity .38s ease,transform .62s var(--ease-out);
}
html[data-menu-state="open"] .menu-disclosure .menu-panel__list li{opacity:1;transform:none}
html[data-menu-state="open"] .menu-disclosure .menu-panel__list li:nth-child(1){transition-delay:.11s}
html[data-menu-state="open"] .menu-disclosure .menu-panel__list li:nth-child(2){transition-delay:.15s}
html[data-menu-state="open"] .menu-disclosure .menu-panel__list li:nth-child(3){transition-delay:.19s}
html[data-menu-state="open"] .menu-disclosure .menu-panel__list li:nth-child(4){transition-delay:.23s}
html[data-menu-state="open"] .menu-disclosure .menu-panel__list li:nth-child(5){transition-delay:.27s}
html[data-menu-state="open"] .menu-disclosure .menu-panel__list li:nth-child(6){transition-delay:.31s}
html[data-menu-state="open"] .menu-disclosure .menu-panel__list li:nth-child(n + 7){transition-delay:.35s}

.site-header .menu-panel__list a{
  display:grid;
  grid-template-columns:clamp(2.6rem,5vw,4.25rem) minmax(0,1fr) 1.5rem;
  align-items:center;
  gap:clamp(.7rem,2vw,1.5rem);
  min-height:clamp(3.9rem,7.2vh,5.5rem);
  padding:.45rem 0;
  border-bottom:1px solid var(--line);
  color:rgba(237,237,234,.72);
  text-decoration:none;
  transition:color .22s ease,border-color .22s ease;
}
.site-header .menu-panel__list a[aria-current="page"]{color:var(--paper)}
.site-header .menu-panel__list a:hover,
.site-header .menu-panel__list a:focus-visible{color:var(--paper);border-bottom-color:var(--line-strong)}

.menu-panel__number{
  color:var(--paper-faint);
  font-size:.67rem;
  font-variant-numeric:tabular-nums;
  letter-spacing:.06em;
}
.menu-panel__title{
  min-width:0;
  overflow:hidden;
  font-size:clamp(1.75rem,4.2vw,4rem);
  font-weight:500;
  letter-spacing:-.055em;
  line-height:.95;
  text-overflow:ellipsis;
  text-transform:uppercase;
  white-space:nowrap;
  transition:transform .32s var(--ease-out);
}
.menu-panel__plus{
  justify-self:end;
  color:var(--paper-muted);
  font-size:1rem;
  font-weight:300;
  transition:transform .32s var(--ease-out),color .22s ease;
}
.site-header .menu-panel__list a:hover .menu-panel__title,
.site-header .menu-panel__list a:focus-visible .menu-panel__title{transform:translateX(.28rem)}
.site-header .menu-panel__list a:hover .menu-panel__plus,
.site-header .menu-panel__list a:focus-visible .menu-panel__plus{color:var(--paper);transform:rotate(90deg)}

.menu-panel__footer{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.1fr) auto;
  gap:clamp(1.25rem,3vw,3rem);
  align-content:start;
  align-items:start;
  padding-top:clamp(1.25rem,3vh,2.2rem);
  opacity:0;
  transform:translateY(.75rem);
  transition:opacity .4s ease .26s,transform .62s var(--ease-out) .26s;
}
html[data-menu-state="open"] .menu-disclosure .menu-panel__footer{opacity:1;transform:none}
.menu-panel__meta,.menu-panel__language{min-width:0}
.menu-panel__meta h2,.menu-panel__language h2{
  display:flex;
  align-items:center;
  gap:.65rem;
  margin-bottom:.75rem;
  color:rgba(237,237,234,.8);
  font-size:.62rem;
  font-weight:700;
  letter-spacing:.16em;
  line-height:1.2;
  text-transform:uppercase;
}
.menu-panel__meta h2 span,.menu-panel__language h2 span{font-size:.9rem;font-weight:400}
.menu-panel__meta ul{display:grid;gap:.22rem;align-content:start;list-style:none;padding:0}
.menu-panel__meta a,.menu-panel__email{
  display:inline-block;
  max-width:100%;
  overflow-wrap:anywhere;
  color:var(--paper-muted);
  font-size:.78rem;
  line-height:1.55;
  text-decoration:none;
  transition:color .2s ease,transform .25s var(--ease-out);
}
.menu-panel__meta a:hover,.menu-panel__meta a:focus-visible,.menu-panel__email:hover,.menu-panel__email:focus-visible{color:var(--paper);transform:translateX(.15rem)}

.menu-panel__language>div{display:flex;gap:.25rem}
.menu-panel__language button{
  min-width:2.65rem;
  min-height:2.4rem;
  padding:.35rem .55rem;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--paper-faint);
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.08em;
}
.menu-panel__language button[aria-pressed="true"]{border-color:var(--line-strong);background:var(--paper);color:var(--ink)}
.menu-panel__language button[aria-disabled="true"]{opacity:.46;cursor:not-allowed}

/* Desktop: split panel — image left, index right. */
@media (min-width:64rem){
  .menu-panel{
    grid-template-columns:minmax(23rem,41%) minmax(0,1fr);
    gap:clamp(2rem,4.8vw,6rem);
    padding:var(--menu-gutter);
  }
  .menu-panel__media{
    min-height:calc(var(--experience-vh) - (var(--menu-gutter) * 2));
    border-radius:1.05rem;
  }
  .menu-panel__content{
    min-height:calc(var(--experience-vh) - (var(--menu-gutter) * 2));
    padding:1rem clamp(1rem,2vw,2rem) 1.25rem 0;
  }
  .site-header .menu-panel__list{margin-block:clamp(3.25rem,10vh,7rem) clamp(1.5rem,4vh,3rem)}
  .site-header .menu-panel__list a{grid-template-columns:3.2rem minmax(0,1fr) 1.5rem}
}

/* Mobile / tablet: full-bleed image *behind* the index. Single owner — this
   replaces the three competing mobile menu blocks in the old sheet. */
@media (max-width:63.99rem){
  .site-header .primary-navigation{
    height:var(--experience-vh);
    max-height:var(--experience-vh);
    overflow:hidden;
  }
  .menu-panel{
    grid-template-rows:minmax(0,1fr);
    width:100%;
    height:100%;
    min-height:0;
    padding:0;
    overflow:hidden;
  }
  .menu-panel__media{
    position:absolute;
    inset:0;
    height:100%;
    border-radius:0;
    opacity:.32;
    transform:scale(1.04);
  }
  html[data-menu-state="open"] .menu-disclosure .menu-panel__media{transform:scale(1)}
  .menu-panel__shade{background:linear-gradient(180deg,rgba(0,0,0,.42),rgba(0,0,0,.72) 48%,var(--ink-deep) 88%)}
  .menu-panel__content{
    width:100%;
    height:100%;
    min-height:0;
    padding:
      max(5.25rem,calc(env(safe-area-inset-top) + 4.5rem))
      max(1.1rem,env(safe-area-inset-right))
      max(1rem,env(safe-area-inset-bottom))
      max(1.1rem,env(safe-area-inset-left));
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  .site-header .menu-panel__identity{justify-self:start;max-width:calc(100% - 4.5rem)}
  .site-header .menu-panel__list{margin-block:clamp(2rem,7vw,3.25rem)}
  .site-header .menu-panel__list a{
    grid-template-columns:clamp(2.8rem,12vw,4.6rem) minmax(0,1fr) 1.2rem;
    min-height:clamp(4rem,14vw,5.5rem);
  }
  .menu-panel__title{font-size:clamp(1.7rem,7.6vw,3.3rem)}
  .menu-panel__footer{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:1.75rem 1rem;padding-top:var(--space-s)}
  .menu-panel__language{grid-column:1/-1}
}

@media (max-width:22.5rem){
  .menu-panel__content{padding-inline:.7rem}
  .site-header .menu-panel__list a{grid-template-columns:2.4rem minmax(0,1fr) 1rem;min-height:3.6rem}
  .menu-panel__title{font-size:1.5rem}
  .menu-panel__footer{grid-template-columns:1fr;gap:1.25rem}
  .menu-panel__language{grid-column:auto}
}

/* Short landscape desktop */
@media (min-width:64rem) and (max-height:43rem){
  .site-header .menu-panel__list{margin-block:2.8rem 1.25rem}
  .site-header .menu-panel__list a{min-height:3.45rem}
  .menu-panel__title{font-size:clamp(1.65rem,3.4vw,3rem)}
  .menu-panel__footer{padding-top:.5rem}
}


@media (hover:none), (pointer:coarse){
  .site-header .menu-toggle:active{transform:scale(.94)}
  .arrow-link:active span,
  .work-row__cta:active i,
  .contact-stage__links a:active span{transform:translate(.16rem,-.16rem)}
  .surface-card:active{transform:translateY(-2px)}
}
@keyframes heroDrift{from{transform:scale(1.03)}to{transform:scale(1.09)}}

/* Grade: two stops, bottom-weighted. Guarantees WCAG AA on the wordmark
   regardless of what image the CMS serves. */

/* Viewfinder guides — hairline framing marks. Desktop only: at phone width
   they are noise, not craft. */
@media (max-width:47.99rem){}

/* Promoted state. Only set once JS has measured the delta — a failed measure
   leaves the lockup absolutely positioned in the hero, which is a correct
   (just static) result. */

@media (min-width:64rem){
  .cinematic-hero__content{
    grid-template-columns:minmax(0,1fr);
    justify-items:end;
  }
}

/* ---- Metrics -------------------------------------------------------------
   Numbers get the display size; labels stay small. Reversing that hierarchy
   was the main thing making the old section read as a corporate dashboard. */

/* §3 · Rule-anchored body. A 2px keyline instead of a card: the evidence
   reads as annotation on the headline, not as a separate module. */
.recognition-story{
  max-width:64ch;
  margin-bottom:var(--space-xl);
  padding-left:var(--space-s);
  border-left:2px solid var(--line-strong);
  color:var(--paper-muted);
  font-size:var(--step-0);
  line-height:1.7;
}

.metric-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));
  border-top:1px solid var(--line);
}
.metric{
  display:grid;
  grid-template-rows:auto auto 1fr;
  align-content:start;
  gap:var(--space-2xs);
  min-width:0;
  contain:layout style;
  padding:var(--space-m) var(--space-s) var(--space-m) 0;
  border-bottom:1px solid var(--line);
}
/* Interior hairlines only — no boxes. */
@media (min-width:48rem){
  .metric + .metric{padding-left:var(--space-s);border-left:1px solid var(--line)}
}

.metric__value{
  position:relative;
  color:var(--paper-bright);
  font-size:clamp(3rem,1.8rem + 5.5vw,6.5rem);
  font-weight:600;
  letter-spacing:-.05em;
  line-height:1;
}
.metric__value-visual{
  display:flex;
  align-items:baseline;
}
/* §3 · Prefix/suffix ride as true superscripts in accent. */
.metric__value-visual > span{
  align-self:flex-start;
  color:var(--accent);
  font-size:.4em;
  font-weight:600;
  letter-spacing:-.02em;
  line-height:1;
}
.metric__value > .metric__value-a11y{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
/* --count-ch is set inline by PHP from the final value: the glyph box is
   reserved before the count animates → zero CLS. */
.metric__value strong{
  display:inline-block;
  min-width:var(--count-ch,2ch);
  color:var(--accent);
  font-weight:inherit;
  font-variant-numeric:tabular-nums lining-nums;
  font-feature-settings:"tnum" 1,"lnum" 1;
  white-space:nowrap;
  text-align:left;
}
.metric h3{font-size:var(--step--1);font-weight:700;letter-spacing:.01em;line-height:1.3;text-transform:none}
/* Scoped to the trailing paragraph only. A bare `.metric p` also matches
   p.metric__value and outranks it (0,1,1 vs 0,1,0) — which is how the display
   numerals silently collapsed to body size. */
.metric > p:last-of-type{color:var(--paper-muted);font-size:var(--step--1);line-height:1.5}

.metrics-section{
  width:100%;
  max-width:none;
  padding-inline:max(var(--space-s),calc((100vw - 84rem)/2));
  background:var(--ink-deep);
}
.metrics-section .section-heading{max-width:56rem;margin-bottom:var(--space-m)}
.metrics-section .section-heading h2{max-width:11ch;font-size:clamp(3.25rem,2rem + 5.8vw,7rem)}
.metrics-section .section-kicker{color:var(--accent)}
.metrics-section .recognition-story{max-width:76ch;margin-bottom:var(--space-l)}
.metrics-section .metric-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.metrics-section .metric{min-width:0}

@media (max-width:63.99rem){
  .metrics-section .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .metrics-section .metric:nth-child(odd){padding-left:0;border-left:0}
}
@media (max-width:39.99rem){
  .metrics-section{padding-inline:var(--space-s)}
  .metrics-section .section-heading h2{font-size:clamp(2.7rem,12vw,4.2rem)}
  .metrics-section .metric-grid{grid-template-columns:1fr}
  .metrics-section .metric{padding-inline:0;border-left:0}
}

/* ---- Phase 4 · Work layers -----------------------------------------------
   Layout ownership: CSS. Highlight progress ownership: GSAP/ScrollTrigger.
   Tool-track transform ownership remains CSS until the dedicated Phase 5
   marquee rebuild. All visible copy is readable in the static fallback. */
.work-layers{
  --wl-bg:#ededea;
  --wl-card:#fafaf7;
  --wl-ink:#090909;
  --wl-muted:#3f403b;
  --wl-accent:#04551b;
  --wl-highlight:#38f36c;
  --wl-line:rgba(9,9,9,.16);
  --wl-line-strong:rgba(9,9,9,.28);
  overflow:hidden;
  overflow:clip;
  background:var(--wl-bg);
  color:var(--wl-ink);
}
.work-layers .section-shell{
  width:min(100% - clamp(2rem,5vw,6rem),108rem);
  padding-block:clamp(4.5rem,8vw,9rem);
}
.work-layers .section-kicker{color:var(--wl-accent)}
.work-layers .section-kicker::before{background:var(--wl-line-strong)}
.work-layers__intro{margin-bottom:clamp(1.5rem,3vw,3rem)}
.work-layers__layout{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(2rem,5vw,5rem);
  align-items:start;
  min-width:0;
}
.work-layers__main{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(2rem,5vw,5rem);
  min-width:0;
}
.work-layers__header,
.work-layers__grid,
.work-layer-card{min-width:0}
.work-layers__header{
  display:grid;
  gap:clamp(1rem,2vw,1.75rem);
  align-content:start;
}
.work-layers__statement{
  max-width:15ch;
  color:var(--wl-ink);
  font-size:clamp(2.35rem,6.8vw,4.8rem);
  font-weight:650;
  letter-spacing:-.055em;
  line-height:.98;
  text-wrap:balance;
}
.work-layers__note{
  max-width:48ch;
  color:var(--wl-muted);
  font-size:clamp(.95rem,.88rem + .2vw,1.08rem);
  line-height:1.65;
}

/* Scroll highlight: the base text always remains visible. Each visual word is
   duplicated only inside an aria-hidden layer, so clipping cannot alter text
   metrics, wrapping, line-height or screen-reader output. */
.work-highlight{display:inline}
.work-highlight__words{display:inline}
.work-highlight__word{
  display:inline-grid;
  grid-template-areas:"word";
  vertical-align:baseline;
  white-space:nowrap;
}
.work-highlight__base,
.work-highlight__mask{
  grid-area:word;
  display:inline-block;
  padding:.025em .075em .045em;
  margin-inline:-.075em;
  border-radius:.08em;
}
.work-highlight__base{
  position:relative;
  z-index:0;
  color:var(--wl-ink);
  background:transparent;
}
.work-highlight__mask{
  position:relative;
  z-index:1;
  overflow:hidden;
  color:var(--wl-highlight);
  background:#050505;
  -webkit-clip-path:inset(0 100% 0 0 round .08em);
  clip-path:inset(0 100% 0 0 round .08em);
}
.work-highlight__ink{color:inherit}

/* Tools rail · Phase 5 -----------------------------------------------------
   Layout ownership: CSS. Continuous transform ownership: GSAP only.
   The cloned sequence stays hidden until the controller has measured a valid
   loop, preserving a single-copy fail-open fallback. */
.tool-rail{
  --rail-gap:clamp(.65rem,1.2vw,1rem);
  --rail-loop-gap:var(--rail-gap);
  min-width:0;
}
.tool-rail__label{
  margin-bottom:.8rem;
  color:var(--wl-muted);
  font-size:clamp(.72rem,.68rem + .15vw,.82rem);
  font-weight:700;
  letter-spacing:.14em;
  line-height:1.25;
  text-transform:uppercase;
}
.tool-rail__viewport{
  position:relative;
  min-width:0;
  overflow:hidden;
  outline-offset:.35rem;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 10%,#000 90%,transparent);
  mask-image:linear-gradient(to right,transparent,#000 10%,#000 90%,transparent);
}
.tool-rail__track,
.tool-rail__group{
  display:flex;
  flex-direction:row;
  align-items:stretch;
  width:max-content;
  min-width:max-content;
}
.tool-rail__track{
  gap:var(--rail-loop-gap);
  transform:none;
}
.tool-rail__group{
  gap:var(--rail-gap);
  flex:0 0 auto;
  padding:0;
  list-style:none;
}
.tool-rail__group[data-tool-marquee-clone]{display:none}
.tool-rail[data-tool-marquee-state="running"] .tool-rail__group[data-tool-marquee-clone],
.tool-rail[data-tool-marquee-state="paused"] .tool-rail__group[data-tool-marquee-clone]{display:flex}
.tool-rail[data-tool-marquee-state="running"] .tool-rail__track{
  will-change:transform;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}
.tool-rail__item{
  display:grid;
  place-items:center;
  gap:.55rem;
  width:6.5rem;
  min-height:6.8rem;
  padding:.85rem .65rem;
  border:1px solid transparent;
  border-radius:.9rem;
  transition:border-color .25s var(--ease),background-color .25s var(--ease);
}
.tool-rail__item img{
  width:3.5rem;
  height:3.5rem;
  object-fit:contain;
  opacity:1;
  filter:none;
}
.tool-rail__item span{
  color:var(--wl-ink);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.02em;
  line-height:1.25;
  text-align:center;
}
.tool-rail__viewport:focus-visible{
  outline:2px solid var(--wl-accent);
}
.tool-rail__item:focus-within{
  border-color:var(--wl-line-strong);
  background:rgba(255,255,255,.72);
}
@media (hover:hover) and (pointer:fine){
  .tool-rail__item:hover{
    border-color:var(--wl-line-strong);
    background:rgba(255,255,255,.72);
  }
}

/* Expertise cards ---------------------------------------------------------- */
.work-layers__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(.8rem,1.5vw,1.2rem);
  align-items:start;
}
.work-layer-card{
  display:grid;
  align-content:start;
  gap:clamp(.85rem,1.5vw,1.2rem);
  padding:clamp(1.3rem,2vw,2rem);
  border:1px solid var(--wl-line);
  border-radius:1rem;
  background:var(--wl-card);
  box-shadow:0 1.1rem 3rem rgba(0,0,0,.05);
}
.work-layer-card__top{
  display:flex;
  align-items:center;
  gap:.75rem;
  color:var(--wl-muted);
  font-size:clamp(.72rem,.68rem + .12vw,.8rem);
  font-weight:700;
  letter-spacing:.12em;
  line-height:1.3;
  text-transform:uppercase;
}
.work-layer-card__top span{
  color:var(--wl-accent);
  font-weight:800;
  font-variant-numeric:tabular-nums;
}
.work-layer-card h3{
  max-width:22ch;
  color:var(--wl-ink);
  font-size:clamp(1.45rem,1.12rem + .75vw,2.2rem);
  line-height:1.05;
  text-wrap:balance;
  hyphens:auto;
}
.work-layer-card>p{
  max-width:48ch;
  color:var(--wl-muted);
  font-size:clamp(.92rem,.87rem + .16vw,1rem);
  line-height:1.62;
}
.work-layer-card ul{
  display:grid;
  gap:.48rem;
  padding:0;
  list-style:none;
}
.work-layer-card li{
  padding-left:1.15rem;
  color:var(--wl-muted);
  font-size:clamp(.82rem,.78rem + .12vw,.9rem);
  line-height:1.5;
}
.work-layer-card li::before{
  content:"+";
  display:inline-block;
  width:1.15rem;
  margin-left:-1.15rem;
  color:var(--wl-accent);
  font-weight:800;
}

/* Mobile: label → horizontal rail → statement → one-column cards. */
@media (max-width:47.99rem){
  .work-layers .section-shell{width:min(100% - 2rem,108rem)}
  .work-layers__layout{gap:2.25rem}
  .work-layers__main{gap:2.5rem}
  .work-layers__statement{
    max-width:14ch;
    font-size:clamp(2.25rem,10.7vw,3.7rem);
    letter-spacing:-.05em;
  }
  .tool-rail__viewport{margin-inline:-1rem;padding-inline:1rem}
  .tool-rail__item{width:5.75rem;min-height:6.15rem;padding:.7rem .5rem}
  .tool-rail__item img{width:3rem;height:3rem}
  .tool-rail__item span{font-size:.66rem}
  .work-layer-card{padding:1.25rem}
}

/* Tablet: compact horizontal rail, editorial statement, two-column grid. */
@media (min-width:48rem){
  .work-layers__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:48rem) and (max-width:74.99rem){
  .work-layers__layout{gap:3rem}
  .work-layers__main{gap:3rem}
  .work-layers__statement{max-width:18ch;font-size:clamp(3.2rem,6.4vw,5rem)}
}

/* Desktop: rail | editorial statement | four expertise cards. The 75rem gate
   is intentionally later than the runtime's desktop profile so 1024–1199px
   never receives a compressed three-column composition. */
@media (min-width:75rem){
  .work-layers__layout{
    grid-template-columns:minmax(8rem,10rem) minmax(0,1fr);
    gap:clamp(2.25rem,3.5vw,4.75rem);
  }
  .tool-rail{
    --rail-axis:column;
    position:sticky;
    top:calc(var(--header-height) + 2rem);
    align-self:start;
  }
  .tool-rail__viewport{
    height:clamp(25rem,58vh,39rem);
    -webkit-mask-image:linear-gradient(to bottom,transparent,#000 10%,#000 90%,transparent);
    mask-image:linear-gradient(to bottom,transparent,#000 10%,#000 90%,transparent);
  }
  .tool-rail__track,
  .tool-rail__group{
    flex-direction:column;
    width:100%;
    min-width:0;
  }
  .tool-rail__track{height:max-content}
  .tool-rail__group{height:max-content}
  .tool-rail__item{width:100%}
  .work-layers__main{
    grid-template-columns:minmax(17rem,.62fr) minmax(0,1.55fr);
    gap:clamp(2.25rem,3.5vw,4.5rem);
  }
  .work-layers__header{
    position:sticky;
    top:calc(var(--header-height) + 2rem);
  }
  .work-layers__statement{
    max-width:12.5ch;
    font-size:clamp(3.1rem,3.35vw,5.25rem);
  }
}

@media (prefers-reduced-motion:reduce) and (max-width:0px){
  .tool-rail__viewport{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-inline:contain;mask-image:none;-webkit-mask-image:none}
  .tool-rail__track,.tool-rail__group{flex-direction:row;width:max-content;min-width:max-content;will-change:auto;transform:none}
  .tool-rail__group[data-tool-marquee-clone]{display:none}
  .work-highlight__mask{-webkit-clip-path:inset(0 100% 0 0 round .08em);clip-path:inset(0 100% 0 0 round .08em)}
}
html.motion-reduced .tool-rail__viewport{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-inline:contain;mask-image:none;-webkit-mask-image:none}
html.motion-reduced .tool-rail__track,
html.motion-reduced .tool-rail__group{flex-direction:row;width:max-content;min-width:max-content;will-change:auto;transform:none}
html.motion-reduced .tool-rail__group[data-tool-marquee-clone]{display:none}
.tool-rail[data-tool-marquee-axis="x"] .tool-rail__track,
.tool-rail[data-tool-marquee-axis="x"] .tool-rail__group{flex-direction:row;width:max-content;min-width:max-content}
.tool-rail[data-tool-marquee-axis="y"] .tool-rail__track,
.tool-rail[data-tool-marquee-axis="y"] .tool-rail__group{flex-direction:column;width:100%;min-width:0}
@media (forced-colors:active){
  .work-layer-card,.tool-rail__item{border-color:CanvasText}
  .work-highlight__mask{background:CanvasText;color:Canvas}
}

/* ---- Work list -----------------------------------------------------------
   The centrepiece. Rows are hairline-separated, the numeral is oversized and
   the whole row lifts on hover. Row height is generous on purpose: this is
   where the negative-space budget gets spent. */

.work-list{border-top:1px solid var(--line)}

.work-row{
  position:relative;
  display:grid;
  grid-template-columns:2rem minmax(0,1fr);
  gap:var(--space-s);
  align-items:start;
  padding:var(--space-m) 0;
  border-bottom:1px solid var(--line);
  transition:padding-inline .45s var(--ease-out);
}
/* Hover wash — a pseudo-element bleeding past the container, so the row reads
   as full-bleed without breaking the shell's max-width. */
.work-row::before{
  content:"";
  position:absolute;
  inset:0 calc(var(--space-s) * -1);
  z-index:-1;
  background:var(--ink-soft);
  opacity:0;
  transition:opacity .4s var(--ease);
}
.work-row>span{
  color:var(--paper-faint);
  font-size:var(--step--1);
  font-variant-numeric:tabular-nums;
  letter-spacing:.1em;
  padding-top:.55em;
  transition:color .3s var(--ease)}
.work-row>div{display:grid;gap:var(--space-2xs);min-width:0}
.work-row>div>p:first-child{
  color:var(--paper-faint);
  font-size:var(--step--1);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.work-row h2,.work-row h3{font-size:var(--step-3)}
.work-row h2 a,.work-row h3 a{
  color:inherit;
  text-decoration:none;
  /* Stretched link: the whole row is the target, no nested-interactive a11y
     violation, no JS click handler. */
}
.work-row h2 a::after,.work-row h3 a::after{content:"";position:absolute;inset:0}
.work-row>div>p:last-child{max-width:52ch;color:var(--paper-muted);line-height:1.5}

.work-row__cta{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  justify-self:start;
  margin-top:var(--space-2xs);
  padding:.55rem 1rem;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--paper-muted);
  font-size:var(--step--1);
  letter-spacing:.08em;
  text-decoration:none;
  text-transform:uppercase;
  transition:border-color .3s var(--ease),color .3s var(--ease),background .3s var(--ease);
}
.work-row__cta i{font-style:normal;transition:transform .35s var(--ease-out)}

@media (hover:hover){
  .work-row:hover{padding-inline:var(--space-s)}
  .work-row:hover::before{opacity:1}
  .work-row:hover>span{color:var(--accent)}
  .work-row:hover .work-row__cta{border-color:var(--paper);background:var(--paper);color:var(--ink)}
  .work-row:hover .work-row__cta i{transform:translate(.2rem,-.2rem)}
}
/* Touch parity: the CTA is always legible because there is no hover to wait
   for. This is the fix for "mobile has no interaction feedback". */
@media (hover:none){
  .work-row__cta{border-color:var(--line-strong);color:var(--paper)}
  .work-row:active::before{opacity:1}
}

@media (min-width:64rem){
  .work-row{grid-template-columns:5rem minmax(0,1fr) auto;align-items:center}
  .work-row__cta{grid-column:auto;margin-top:0}
}

/* ---- Notes --------------------------------------------------------------- */

.note-list{border-top:1px solid var(--line)}
.note-list article{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:var(--space-2xs) var(--space-s);
  align-items:center;
  padding:var(--space-s) 0;
  border-bottom:1px solid var(--line);
  transition:padding-inline .45s var(--ease-out);
}
.note-list article>p{
  grid-column:1;
  color:var(--paper-faint);
  font-size:var(--step--1);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.note-list h2,.note-list h3{grid-column:1;font-size:var(--step-2);font-weight:500}
.note-list h2 a,.note-list h3 a{color:inherit;text-decoration:none}
.note-list h2 a::after,.note-list h3 a::after{content:"";position:absolute;inset:0}
.note-list article>span{
  grid-column:2;
  grid-row:1/3;
  color:var(--paper-faint);
  transition:transform .35s var(--ease-out),color .3s var(--ease);
}
.note-list--large h2{font-size:var(--step-3)}
@media (hover:hover){
  .note-list article:hover{padding-inline:var(--space-s)}
  .note-list article:hover>span{color:var(--accent);transform:translate(.25rem,-.25rem)}
}

/* ---- Contact stage ------------------------------------------------------- */

.contact-stage{
  position:relative;
  display:grid;
  place-items:center start;
  min-height:min(100vh,50rem);
  min-height:min(100svh,50rem);
  min-height:min(var(--experience-vh,100svh),50rem);
  padding:var(--space-xl) max(var(--space-s),calc((100vw - 74rem) / 2));
  overflow:hidden;
  overflow:clip;
  isolation:isolate;
  text-align:left;
}
.contact-stage__stars{
  position:absolute;
  z-index:-1;
  inset:0;
  width:100%;
  height:100%;
}
/* Accent-weighted atmospheric field with a restrained cool counterpoint. */
.contact-stage__nebula{
  position:absolute;
  z-index:-2;
  inset:0;
  background:
    radial-gradient(ellipse 55% 40% at 12% 8%,rgba(55,218,55,.16),transparent 68%),
    radial-gradient(ellipse 45% 38% at 62% 30%,rgba(70,90,190,.10),transparent 70%),
    radial-gradient(ellipse 70% 50% at 48% 78%,rgba(55,218,55,.05),transparent 72%);
}
.contact-stage__grid{
  position:absolute;
  z-index:-1;
  inset:auto 0 0;
  display:grid;
  grid-template-columns:repeat(9,1fr);
  height:38vh;
  opacity:.18;
  transform:perspective(30rem) rotateX(62deg);
  transform-origin:bottom center;
  -webkit-mask-image:linear-gradient(to top,#000,transparent);
  mask-image:linear-gradient(to top,#000,transparent);
}
.contact-stage__grid span{border-left:1px solid var(--line-strong)}
.contact-stage__grid span:last-child{border-right:1px solid var(--line-strong)}

.contact-stage__content{
  display:grid;
  justify-items:start;
  gap:var(--space-s);
  max-width:64rem;
}
.contact-stage__content .section-kicker{
  justify-content:flex-start;
  color:var(--accent);
}
.contact-stage__content h2{
  max-width:14ch;
  font-size:clamp(3rem,2rem + 4vw,6rem);
}
.contact-stage__content>p{
  max-width:52ch;
  color:var(--paper-muted);
  font-size:var(--step-1);
  line-height:1.45;
}
.contact-stage__links{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-2xs);
  width:min(100%,52rem);
  margin-top:var(--space-s);
}
.contact-stage__links a{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:.45rem;
  padding:.8rem 0;
  border-bottom:1px solid var(--line);
  font-size:var(--step--1);
  letter-spacing:.06em;
  text-decoration:none;
  transition:border-color .3s var(--ease),color .3s var(--ease);
}
.contact-stage__links a span{transition:transform .35s var(--ease-out)}
.contact-stage__links a:first-child{border-color:var(--line)}
.contact-stage__meta{
  margin-top:var(--space-s);
  color:var(--paper-faint);
  font-size:var(--step--1);
  letter-spacing:.1em;
  text-transform:uppercase;
}
@media (hover:hover) and (pointer:fine){
  .contact-stage__links a:hover,
  .contact-stage__links a:focus-visible{color:var(--accent)}
  .contact-stage__links a:hover span{transform:translate(.2rem,-.2rem)}
}
@media (max-width:39.99rem){
  .contact-stage{
    min-height:100vh;
    min-height:100svh;
    padding-inline:var(--space-s);
  }
  .contact-stage__content h2{font-size:clamp(2.85rem,12vw,4.6rem)}
  .contact-stage__links{grid-template-columns:1fr}
}

/* ---- Editorial ----------------------------------------------------------- */

.home-editorial{display:grid;gap:var(--space-s)}
.home-editorial h2{font-size:var(--step-3);max-width:22ch}
.home-editorial__body{max-width:58ch;color:var(--paper-muted);font-size:var(--step-1);line-height:1.5}
@media (min-width:64rem){
  .home-editorial{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:var(--space-l)}
  .home-editorial .section-kicker{grid-column:1;grid-row:1}
  .home-editorial h2{grid-column:1;grid-row:2}
  .home-editorial__body{grid-column:2;grid-row:1/4;align-self:center}
  .home-editorial .arrow-link{grid-column:1;grid-row:3;justify-self:start}
}

.page-shell{
  width:var(--container);
  margin-inline:auto;
  padding-block:calc(var(--header-height) + var(--space-xl)) var(--space-xl);
}
.page-hero{display:grid;gap:var(--space-s);margin-bottom:var(--space-xl)}
.page-hero h1{
  max-width:12ch;
  font-size:var(--step-4);
}
.page-hero p{
  max-width:46ch;
  color:var(--paper-muted);
  font-size:var(--step-1);
  line-height:1.45;
}



.article-shell{max-width:min(100% - (var(--space-s) * 2),68rem)}
.article-cover{width:100%;border-radius:var(--radius);margin-bottom:var(--space-l)}
.article-block{display:grid;gap:var(--space-xs);max-width:62ch;padding-block:var(--space-m);border-top:1px solid var(--line)}
.article-block h2{font-size:var(--step-2)}
.article-block p{color:var(--paper-muted);line-height:1.65}

.project-facts{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr));
  margin-bottom:var(--space-l);
  border-top:1px solid var(--line);
}
.project-facts>div{display:grid;gap:.3rem;padding:var(--space-s) var(--space-s) var(--space-s) 0;border-bottom:1px solid var(--line)}
.project-facts dt{color:var(--paper-faint);font-size:var(--step--1);letter-spacing:.12em;text-transform:uppercase}
.project-facts dd{margin:0;font-size:var(--step-1)}

.inline-links{display:flex;flex-wrap:wrap;gap:var(--space-s);margin-top:var(--space-m)}
.inline-links .arrow-link{margin-top:0}

.editorial-stack,.cv-stack{display:grid;gap:0;border-top:1px solid var(--line)}
.editorial-stack>section{display:grid;gap:var(--space-xs);max-width:62ch;padding-block:var(--space-m);border-bottom:1px solid var(--line)}
.editorial-stack h2{font-size:var(--step-2)}
.editorial-stack p{color:var(--paper-muted);line-height:1.65}

.cv-stack>section{display:grid;gap:var(--space-m);padding-block:var(--space-l);border-bottom:1px solid var(--line)}
.cv-stack__heading{display:grid;gap:var(--space-2xs);align-content:start;max-width:32ch}
.cv-stack__heading h2{font-size:var(--step-2)}
.cv-stack__heading p{color:var(--paper-muted);font-size:var(--step--1)}
@media (min-width:64rem){
  .cv-stack>section{grid-template-columns:minmax(0,16rem) minmax(0,1fr);gap:var(--space-l)}
  .cv-stack__heading{position:sticky;top:calc(var(--header-height) + var(--space-s));align-self:start}
}
.cv-item{display:grid;gap:.35rem;padding-block:var(--space-s);border-top:1px solid var(--line)}
.cv-item:first-child{border-top:0;padding-top:0}
.cv-item h3{font-size:var(--step-1);font-weight:500}
.cv-item p{color:var(--paper-muted);font-size:var(--step--1);line-height:1.55}

.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));gap:var(--space-s)}
.surface-card{
  display:grid;
  gap:var(--space-2xs);
  align-content:start;
  padding:var(--space-s);
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--ink-soft);
  transition:border-color .35s var(--ease),transform .45s var(--ease-out);
}
.surface-card:hover{border-color:var(--line-strong);transform:translateY(-4px)}
.surface-card h2{font-size:var(--step-2)}
.surface-card h2 a{color:inherit;text-decoration:none}
.surface-card p{color:var(--paper-muted);font-size:var(--step--1);line-height:1.55}
.card-image{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:calc(var(--radius) * .6);margin-bottom:var(--space-2xs)}

.rich-text{max-width:66ch;color:var(--paper-muted);font-size:var(--step-1);line-height:1.7}
.rich-text > * + *{margin-top:1em}
.rich-text h2,.rich-text h3{color:var(--paper);margin-top:1.8em}
.rich-text h2{font-size:var(--step-2)}
.rich-text h3{font-size:var(--step-1)}
.rich-text a{color:var(--paper)}
.rich-text img{border-radius:var(--radius)}
.rich-text blockquote{
  padding-left:var(--space-s);
  border-left:2px solid var(--accent);
  color:var(--paper);
  font-size:var(--step-2);
  line-height:1.3;
}
.rich-text ul,.rich-text ol{padding-left:1.2em}
.rich-text li + li{margin-top:.4em}
.rich-text code{padding:.15em .4em;border-radius:.25rem;background:var(--ink-raised);font-size:.9em}

/* ---- Forms --------------------------------------------------------------- */

.contact-page .contact-form{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));
  gap:var(--space-s);
  max-width:52rem;
}
.field{display:grid;gap:.45rem}
.field--wide{grid-column:1/-1}
.field label{color:var(--paper-muted);font-size:var(--step--1);letter-spacing:.1em;text-transform:uppercase}
.field input,.field select,.field textarea{
  width:100%;
  min-height:3rem;
  padding:.75rem 0;
  border:0;
  border-bottom:1px solid var(--line-strong);
  border-radius:0;
  background:transparent;
  color:var(--paper);
  font-size:var(--step-1);
  transition:border-color .3s var(--ease);
}
.field textarea{min-height:9rem;padding-block:.75rem;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-bottom-color:var(--accent)}
.field select option{background:var(--ink-raised)}
.field [aria-invalid="true"]{border-bottom-color:var(--danger)}
.field-error{color:var(--danger);font-size:var(--step--1)}

.checkbox{grid-template-columns:auto minmax(0,1fr);align-items:start;gap:.7rem}
.checkbox input{width:1.1rem;min-height:0;height:1.1rem;margin-top:.25rem;accent-color:var(--accent)}
.checkbox label{text-transform:none;letter-spacing:normal;line-height:1.5}
.honeypot{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}

.primary-button{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  min-height:3.25rem;
  padding:.8rem 1.6rem;
  border-radius:999px;
  background:var(--paper);
  color:var(--ink);
  font-size:var(--step--1);
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  transition:transform .3s var(--ease-out),opacity .2s ease;
}
.primary-button span{transition:transform .35s var(--ease-out)}
.primary-button:hover{transform:translateY(-2px)}
.primary-button:hover span{transform:translate(.2rem,-.2rem)}
.primary-button:disabled{opacity:.5;cursor:wait;transform:none}

.form-status{margin-top:var(--space-2xs);font-size:var(--step--1)}
.form-status[data-state="error"]{color:var(--danger)}
.form-status[data-state="success"]{color:var(--accent)}

.notice{
  max-width:52rem;
  margin-bottom:var(--space-m);
  padding:var(--space-xs) var(--space-s);
  border:1px solid var(--line);
  border-left-width:2px;
  border-radius:.4rem;
  font-size:var(--step--1);
}
.notice--success{border-left-color:var(--accent)}
.notice--error{border-left-color:var(--danger)}

.site-footer{
  display:grid;
  gap:var(--space-l);
  width:var(--container);
  margin-inline:auto;
  padding-block:var(--space-l) var(--space-m);
  border-top:1px solid var(--line);
}
.site-footer>div:first-child{display:grid;gap:.4rem}
.site-footer strong{font-size:var(--step--1);font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.site-footer p{color:var(--paper-faint);font-size:var(--step--1)}
.site-footer__links{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr));gap:var(--space-s)}
.site-footer__links nav{display:grid;gap:.6rem;align-content:start}
.site-footer__links ul{display:grid;gap:.3rem;padding:0;list-style:none}
.site-footer__links a{
  color:var(--paper-muted);
  font-size:var(--step--1);
  text-decoration:none;
  transition:color .25s var(--ease),transform .3s var(--ease-out);
  display:inline-block;
}
.site-footer__links a:hover{color:var(--paper);transform:translateX(.15rem)}
@media (min-width:64rem){
  .site-footer{grid-template-columns:minmax(0,1fr) minmax(0,2fr);align-items:start}
}
body[data-page="home"] .site-brand{display:none}
body[data-page="home"] .site-header{
  justify-content:flex-end;
  background:transparent;
  border-bottom:0;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.cinematic-hero__media img,
.cinematic-hero__media video,
.cinematic-hero__picture{
  width:100%;
  height:100%;
  object-fit:cover;
  /* Focal point written by JS from CMS values. Static fallback: centre. */
  /* Slow, permanent drift. 20s, transform-only → composited, no layout cost. */
  animation:heroDrift 24s var(--ease) infinite alternate;
  transform-origin:var(--hero-focal,50% 50%);
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  object-position:var(--hero-focal,50% 50%);
}

.hero-statement{
  display:grid;
  grid-template-columns:.55rem minmax(0,auto) .55rem;
  align-items:center;
  justify-content:center;
  gap:clamp(.8rem,2vw,1.8rem);
  width:100%;
  text-align:center;
  text-shadow:0 2px 24px rgba(0,0,0,.72);
}
.hero-statement__copy{display:grid;justify-items:center;gap:.18rem;min-width:0}
.hero-statement__marker{
  width:.5rem;
  aspect-ratio:1;
  background:currentColor;
  box-shadow:0 0 0 1px rgba(255,255,255,.1);
}
.hero-statement__name,
.hero-statement__discipline,
.hero-statement__belief{margin:0;color:#fff}
.hero-statement__name{
  font-size:clamp(1.55rem,1rem + 2.15vw,3.25rem);
  font-weight:650;
  letter-spacing:-.045em;
  line-height:1;
}
.hero-statement__discipline{
  max-width:25ch;
  font-size:clamp(1.15rem,.78rem + 1.35vw,2.5rem);
  font-weight:600;
  letter-spacing:-.035em;
  line-height:1.05;
  text-wrap:balance;
}
.hero-statement__belief{
  margin-top:clamp(.75rem,1.7vh,1.35rem);
  font-size:clamp(1rem,.82rem + .72vw,1.65rem);
  font-weight:500;
  letter-spacing:-.025em;
  line-height:1.1;
}
.motion-line,
.motion-pulse{position:absolute;display:block}
.motion-line{
  left:-12%;
  width:124%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.2) 20%,rgba(255,255,255,.42) 50%,rgba(255,255,255,.15) 80%,transparent);
  transform-origin:center;
  animation:heroSignal 8s ease-in-out infinite alternate;
}
.motion-line--one{top:24%;transform:rotate(-1.2deg)}
.motion-line--two{top:49%;opacity:.65;animation-delay:-2.2s}
.motion-line--three{top:67%;transform:rotate(.8deg);opacity:.38;animation-delay:-4.6s}
.motion-line--four{top:81%;opacity:.24;animation-delay:-6.1s}
.motion-pulse{
  top:48%;
  width:clamp(6rem,15vw,16rem);
  height:5rem;
  opacity:.58;
  background:
    repeating-linear-gradient(90deg,transparent 0 7px,rgba(255,255,255,.55) 7px 8px,transparent 8px 13px);
  clip-path:polygon(0 48%,7% 46%,12% 55%,18% 30%,24% 72%,30% 22%,36% 78%,43% 38%,50% 61%,58% 44%,66% 56%,74% 46%,82% 52%,91% 48%,100% 50%,100% 52%,0 52%);
  animation:heroPulse 4.8s ease-in-out infinite;
}
.motion-pulse--left{left:2%}
.motion-pulse--right{right:2%;transform:scaleX(-1);animation-delay:-2.4s}
.cinematic-hero__guides path{fill:none;vector-effect:non-scaling-stroke;stroke:#fff;stroke-width:1}
.cinematic-hero__guides path:nth-child(2){stroke-dasharray:2 12;opacity:.52}
.cinematic-hero__guides path:nth-child(3){stroke-dasharray:1 14;opacity:.28}

@keyframes heroSignal{
  0%{transform:translate3d(-2%,0,0) scaleX(.98)}
  100%{transform:translate3d(2%,0,0) scaleX(1.02)}
}
@keyframes heroPulse{
  0%,100%{opacity:.22;filter:blur(.2px)}
  50%{opacity:.7;filter:blur(0)}
}

/* Phase 1: hero content is visible without an entrance gate. */

@media (max-width:47.99rem){
  .cinematic-hero__media img,
  .cinematic-hero__media video,
  .cinematic-hero__picture{animation-duration:18s}
  .cinematic-hero__content{width:100%}
  .hero-statement{
    grid-template-columns:.42rem minmax(0,1fr) .42rem;
    gap:.7rem;
    align-items:start;
  }
  .hero-statement__marker{width:.42rem;margin-top:.35rem}
  .hero-statement__name{font-size:clamp(1.85rem,8vw,2.75rem)}
  .hero-statement__discipline{max-width:18ch;font-size:clamp(1.45rem,6.2vw,2.15rem)}
  .hero-statement__belief{margin-top:1.2rem;font-size:clamp(1.15rem,4.6vw,1.5rem)}
  .cinematic-hero__viewfinder{display:block;inset:.65rem;opacity:.1}
  .cinematic-hero__guides path:nth-child(3){display:none}
  .motion-line--one{top:18%}
  .motion-line--two{top:43%}
  .motion-line--three{top:63%}
  .motion-line--four{top:78%}
  .motion-pulse{top:43%;width:7rem;height:4rem;opacity:.35}
  .motion-pulse--left{left:-2rem}
  .motion-pulse--right{right:-2rem}
}

@media (max-width:23rem){
  .hero-statement__name{font-size:1.65rem}
  .hero-statement__discipline{font-size:1.28rem}
  .hero-statement__belief{font-size:1.05rem}
}

@media (prefers-reduced-motion:reduce) and (max-width:0px){
  .motion-line,.motion-pulse{animation:none}
  .cinematic-hero__content{opacity:1;transform:none;transition:none}
}

/* Hero surfaces remain in a readable static state until the Phase 3 controller initializes. */
.cinematic-hero__media,
.cinematic-hero__grade,
.cinematic-hero__motion-lines{
  inset:0;
  border-radius:0;
  transform:none;
  overflow:hidden;
  transition:none;
  will-change:auto;
}
@media (prefers-reduced-motion:reduce) and (max-width:0px){
  .cinematic-hero__media,
  .cinematic-hero__grade,
  .cinematic-hero__motion-lines{inset:0;border-radius:0;transform:none}
}

.cinematic-hero{
  position:relative;
  width:100%;
  min-height:100vh;
  min-height:100svh;
  min-height:var(--experience-vh,100svh);
  overflow:hidden;
  overflow:clip;
  isolation:isolate;
  display:grid;
  place-items:end center;
  padding:
    max(calc(var(--header-height) + 1rem),calc(env(safe-area-inset-top) + 5rem))
    max(1rem,env(safe-area-inset-right))
    max(clamp(2rem,5vh,4.5rem),env(safe-area-inset-bottom))
    max(1rem,env(safe-area-inset-left));
  background:var(--wl-bg,#f2f2ed);
}

.cinematic-hero__surface{
  position:absolute;
  z-index:0;
  inset:0;
  display:grid;
  place-items:end center;
  padding:inherit;
  overflow:hidden;
  border-radius:0;
  background:#050505;
  transform:none;
  transform-origin:50% 0%;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  will-change:auto;
}

.cinematic-hero__surface::after{
  content:"";
  position:absolute;
  z-index:4;
  inset:0;
  pointer-events:none;
  opacity:.16;
  background-image:url("noise.svg");
  background-size:220px 220px;
  mix-blend-mode:soft-light;
}

.cinematic-hero::after{content:none}

.cinematic-hero__media{
  position:absolute;
  z-index:0;
  inset:0;
  border-radius:inherit;
  background:#050505;
}

.cinematic-hero__media img,
.cinematic-hero__media video{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.cinematic-hero__picture{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  transform:none;
  animation:none;
  will-change:auto;
}

.cinematic-hero__video{z-index:1;background:#050505}
.cinematic-hero__poster{
  z-index:2;
  opacity:1;
  visibility:visible;
  pointer-events:none;
  transition:opacity .18s linear,visibility 0s linear .18s;
}
.cinematic-hero__surface[data-video-state="playing"] .cinematic-hero__poster{
  opacity:0;
  visibility:hidden;
}
.cinematic-hero__surface[data-video-state="blocked"] .cinematic-hero__poster,
.cinematic-hero__surface[data-video-state="error"] .cinematic-hero__poster,
.cinematic-hero__surface[data-video-state="hidden"] .cinematic-hero__poster,
.cinematic-hero__surface[data-video-state="page-hidden"] .cinematic-hero__poster,
.cinematic-hero__surface[data-video-state="offscreen"] .cinematic-hero__poster,
.cinematic-hero__surface[data-video-state="constrained"] .cinematic-hero__poster,
.cinematic-hero__surface[data-video-state="reduced-motion"] .cinematic-hero__poster{
  opacity:1;
  visibility:visible;
  transition-delay:0s;
}

.cinematic-hero__grade{
  position:absolute;
  background:
    radial-gradient(circle at 50% 48%,transparent 0 25%,rgba(0,0,0,.08) 48%,rgba(0,0,0,.7) 100%),
    linear-gradient(180deg,rgba(0,0,0,.48) 0%,rgba(0,0,0,.04) 28%,rgba(0,0,0,.08) 55%,rgba(0,0,0,.9) 100%);
  z-index:2;
  inset:0;
  border-radius:inherit;
}
.cinematic-hero__motion-lines{
  position:absolute;
  overflow:hidden;
  pointer-events:none;
  opacity:.46;
  z-index:3;
  inset:0;
  border-radius:inherit;
}
.cinematic-hero__viewfinder{
  position:absolute;
  width:auto;height:auto;
  pointer-events:none;
  inset:clamp(.85rem,2vw,1.75rem);
  opacity:.13;
  z-index:5;
}
.cinematic-hero__content{
  gap:var(--space-m);
  display:grid;
  place-items:center;
  width:min(100%,70rem);
  min-width:0;
  margin-inline:auto;
  position:relative;
  z-index:6;
  opacity:1;
  transform:none;
  will-change:auto;
}

@media (max-width:47.99rem){
  .cinematic-hero{
    padding-top:max(calc(var(--header-height) + .5rem),calc(env(safe-area-inset-top) + 4.5rem));
    padding-bottom:max(2.4rem,calc(env(safe-area-inset-bottom) + 1.5rem));
    min-height:100svh;
    min-height:var(--experience-vh,100svh);
  }
  .cinematic-hero__surface::after{opacity:.08;background-size:180px 180px;mix-blend-mode:normal}
  .cinematic-hero__media img,
  .cinematic-hero__media video{animation-duration:18s}
}

@media (prefers-reduced-motion:reduce) and (max-width:0px){
  .cinematic-hero__surface,
  .cinematic-hero__content{border-radius:0;transform:none;opacity:1;will-change:auto}
  .cinematic-hero__poster{transition:none}
}}

@layer motion{

[data-reveal],
[data-reveal-child],
.work-row,
.metric,
.work-layer-card,
.note-list article,
.cv-item,
.cinematic-hero__content{
  opacity:1;
  transform:none;
  will-change:auto;
}

html.motion-pending [data-reveal],
html.motion-pending [data-reveal-child],
html.motion-failed [data-reveal],
html.motion-failed [data-reveal-child],
html.motion-reduced [data-reveal],
html.motion-reduced [data-reveal-child]{
  opacity:1;
  transform:none;
  clip-path:none;
  -webkit-clip-path:none;
}

html.motion-pending [data-text-effect],
html.motion-failed [data-text-effect],
html.motion-reduced [data-text-effect]{
  clip-path:none;
  -webkit-clip-path:none;
  will-change:auto;
}

/* Reduced motion: strip decorative loops while preserving menu usability and
   readable static content. The class also covers a setting changed at runtime. */
@media (prefers-reduced-motion:reduce) and (max-width:0px){
  .cinematic-hero__media img,
  .cinematic-hero__media video,
  .motion-line,
  .motion-pulse,
  .tool-rail__track{animation:none;-webkit-animation:none}
  .menu-panel__media,
  .menu-panel__identity,
  .menu-panel__list li,
  .menu-panel__footer,
  .menu-panel__slice,
  .menu-toggle__glyph i{transition-duration:.01ms}
  *{scroll-behavior:auto}
}

html.motion-reduced .cinematic-hero__media img,
html.motion-reduced .cinematic-hero__media video,
html.motion-reduced .motion-line,
html.motion-reduced .motion-pulse,
html.motion-reduced .tool-rail__track{
  animation:none;
  -webkit-animation:none;
}


html[data-page-visibility="hidden"] .cinematic-hero__media img,
html[data-page-visibility="hidden"] .cinematic-hero__media video,
html[data-page-visibility="hidden"] .motion-line,
html[data-page-visibility="hidden"] .motion-pulse,
html[data-hero-in-viewport="false"] .cinematic-hero__media img,
html[data-hero-in-viewport="false"] .cinematic-hero__media video,
html[data-hero-in-viewport="false"] .motion-line,
html[data-hero-in-viewport="false"] .motion-pulse{
  animation-play-state:paused;
  -webkit-animation-play-state:paused;
}

/* Data Saver / 2G keeps the poster-first media policy, but it must not
   disable the entire mobile motion system. Scroll-driven transforms remain
   available; only the non-essential decorative line layer is suppressed. */
html[data-performance-profile="constrained"] .cinematic-hero__motion-lines{opacity:0;visibility:hidden}

/* Forced colours */

html.motion-pending .cinematic-hero__surface,
html.motion-failed .cinematic-hero__surface,
html.motion-reduced .cinematic-hero__surface,
html.no-js .cinematic-hero__surface{
  border-radius:0;
  transform:none;
  will-change:auto;
}
html.motion-pending .cinematic-hero__content,
html.motion-failed .cinematic-hero__content,
html.motion-reduced .cinematic-hero__content,
html.no-js .cinematic-hero__content{
  opacity:1;
  transform:none;
  will-change:auto;
}}

@layer utilities{

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

.skip-link{
  position:fixed;
  z-index:10050;
  top:var(--space-2xs);
  left:var(--space-2xs);
  padding:.7rem 1rem;
  border-radius:.4rem;
  background:var(--accent);
  color:var(--ink);
  font-weight:700;
  text-decoration:none;
  transform:translateY(-200%);
  transition:transform .2s var(--ease);
}
.skip-link:focus{transform:translateY(0)}

.preview-banner{
  position:relative;
  z-index:2000;
  padding:.7rem 1rem;
  background:var(--accent);
  color:var(--ink);
  font-size:var(--step--1);
  font-weight:700;
  text-align:center;
}}

@layer overrides{
@media (forced-colors:active){
  .arrow-link,.work-row__cta,.surface-card,.primary-button,input,select,textarea{border:1px solid CanvasText}
  .menu-toggle__glyph i{background:CanvasText}
}
html.no-js .site-header,
html.controller-menu-failed .site-header,
html.controller-bootstrap-failed .site-header{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:start;
  min-height:0;
  padding:1rem max(var(--space-s),env(safe-area-inset-right)) 1rem max(var(--space-s),env(safe-area-inset-left));
  border-bottom:1px solid var(--line);
  background:var(--ink);
  transform:none;
}
html.no-js body[data-page="home"] .site-brand,
html.controller-menu-failed body[data-page="home"] .site-brand,
html.controller-bootstrap-failed body[data-page="home"] .site-brand{display:block}
html.no-js .menu-toggle,
html.controller-menu-failed .menu-toggle,
html.controller-bootstrap-failed .menu-toggle{display:none}
html.no-js .menu-disclosure,
html.controller-menu-failed .menu-disclosure,
html.controller-bootstrap-failed .menu-disclosure{width:100%;margin-left:0}
html.no-js .primary-navigation,
html.controller-menu-failed .primary-navigation,
html.controller-bootstrap-failed .primary-navigation{
  position:static;
  width:100%;
  height:auto;
  max-height:none;
  overflow:visible;
  visibility:visible;
  opacity:1;
  pointer-events:auto;
  background:transparent;
  transition:none;
}
html.no-js .menu-panel,
html.controller-menu-failed .menu-panel,
html.controller-bootstrap-failed .menu-panel{
  display:block;
  min-height:0;
  background:transparent;
}
html.no-js .menu-panel::after,
html.no-js .menu-panel__media,
html.no-js .menu-panel__identity,
html.no-js .menu-panel__footer,
html.controller-menu-failed .menu-panel::after,
html.controller-menu-failed .menu-panel__media,
html.controller-menu-failed .menu-panel__identity,
html.controller-menu-failed .menu-panel__footer,
html.controller-bootstrap-failed .menu-panel::after,
html.controller-bootstrap-failed .menu-panel__media,
html.controller-bootstrap-failed .menu-panel__identity,
html.controller-bootstrap-failed .menu-panel__footer{display:none}
html.no-js .menu-panel__content,
html.controller-menu-failed .menu-panel__content,
html.controller-bootstrap-failed .menu-panel__content{display:block;padding:0}
html.no-js .menu-panel__list,
html.controller-menu-failed .menu-panel__list,
html.controller-bootstrap-failed .menu-panel__list{
  display:flex;
  flex-wrap:wrap;
  gap:.35rem 1rem;
  width:100%;
  margin:0;
}
html.no-js .menu-panel__list li,
html.controller-menu-failed .menu-panel__list li,
html.controller-bootstrap-failed .menu-panel__list li{opacity:1;transform:none}
html.no-js .menu-panel__list a,
html.controller-menu-failed .menu-panel__list a,
html.controller-bootstrap-failed .menu-panel__list a{
  display:inline-flex;
  min-height:2.75rem;
  padding:.35rem 0;
  border:0;
}
html.no-js .menu-panel__number,
html.no-js .menu-panel__plus,
html.controller-menu-failed .menu-panel__number,
html.controller-menu-failed .menu-panel__plus,
html.controller-bootstrap-failed .menu-panel__number,
html.controller-bootstrap-failed .menu-panel__plus{display:none}
html.no-js .menu-panel__title,
html.controller-menu-failed .menu-panel__title,
html.controller-bootstrap-failed .menu-panel__title{
  overflow:visible;
  font-size:var(--step--1);
  letter-spacing:.06em;
  line-height:1.2;
  text-overflow:clip;
  white-space:normal;
}

@media (max-width:47.99rem){
  html.no-js .site-header,
  html.controller-menu-failed .site-header,
  html.controller-bootstrap-failed .site-header{grid-template-columns:1fr;gap:.75rem}
}}

/* Phase 14 · visual continuity and premium motion polish ------------------ */
body[data-page="home"] main{background:#ededea}

/* The hero shell exposed by the scroll morph must match the following band.
   Video startup is deliberately pure black: no stale CMS poster flashes. */
.cinematic-hero{background:#ededea}
.cinematic-hero__surface,
.cinematic-hero__media,
.cinematic-hero__video{background:#000}
.cinematic-hero__video{opacity:0;transition:opacity .22s linear}
.cinematic-hero__surface[data-video-state="playing"] .cinematic-hero__video{opacity:1}
.cinematic-hero__poster{display:none!important}

/* Softer editorial emphasis: dark graphite instead of hard black, with a
   subtle illuminated edge so highlighted phrases remain legible in motion. */
.work-highlight__base,
.work-highlight__mask{
  padding:.045em .12em .085em;
  margin-inline:-.12em;
  border-radius:.12em;
}
.work-highlight__mask{
  background:linear-gradient(100deg,#10110f 0%,#050505 78%,#151815 100%);
  box-shadow:inset 0 0 0 1px rgba(56,243,108,.12),0 .06em .22em rgba(0,0,0,.12);
}
.work-highlight__ink{color:#38f36c}

/* Phase 17: immediate gray-to-black section cut; no tonal bridge. */
.metrics-section{
  position:relative;
  padding-top:var(--space-xl);
  background:#050505;
}
.work-layers + .metrics-section{border-top:0}

/* Recognition highlight: white slab + green ink on the black field. */
.metrics-section .section-heading{gap:clamp(1rem,2vw,1.8rem)}
.metrics-section .section-heading h2{
  line-height:1.08;
  letter-spacing:-.055em;
}
.metrics-section .lede-mark{
  display:inline;
  margin-inline:.055em;
  padding:.035em .16em .09em;
  background:#f7f7f2;
  color:#20c94d;
  border-radius:.075em;
  box-shadow:0 .08em .28em rgba(0,0,0,.26);
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
}

@media (max-width:47.99rem){
  .cinematic-hero__video{transition-duration:.14s}
  .metrics-section{
    padding-top:var(--space-xl);
    background:#050505;
  }
  .metrics-section .section-heading h2{line-height:1.12}
}


/* ---- Phase 15: full-viewport editorial contact architecture ------------- */
.contact-stage{
  display:block;
  min-height:100svh;
  padding:0;
  background:var(--ink);
  color:var(--paper);
  overflow:hidden;
  isolation:isolate;
}
.contact-stage__stars,.contact-stage__nebula{display:none!important}
.contact-stage__grid{
  position:absolute;
  inset:0;
  z-index:0;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-rows:repeat(3,minmax(0,1fr));
  height:auto;
  opacity:1;
  transform:none;
  -webkit-mask-image:none;
  mask-image:none;
  pointer-events:none;
}
.contact-stage__grid span{
  position:relative;
  border-right:1px solid rgba(230,230,230,.08);
  border-bottom:1px solid rgba(230,230,230,.08);
}
.contact-stage__grid span:nth-child(4n){border-right:0}
.contact-stage__grid span::after{
  content:"";
  position:absolute;
  top:-.16rem;
  left:-.16rem;
  width:.32rem;
  height:.32rem;
  background:var(--paper);
  opacity:.9;
}
.contact-stage__content{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-rows:auto 1fr auto auto;
  gap:clamp(2rem,5vw,4.5rem);
  width:min(100%,96rem);
  min-height:100svh;
  margin-inline:auto;
  padding:clamp(5.5rem,9vw,8rem) clamp(1rem,4vw,4rem) max(1.25rem,env(safe-area-inset-bottom));
}
.contact-stage__intro{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(16rem,.9fr);
  gap:clamp(1.5rem,5vw,6rem);
  align-items:end;
}
.contact-stage__intro .section-kicker{grid-column:1/-1;margin:0;color:var(--accent)}
.contact-stage__intro h2{
  max-width:13ch;
  margin:0;
  font-size:clamp(2.6rem,6.3vw,7rem);
  line-height:.88;
  letter-spacing:-.065em;
  text-wrap:balance;
}
.contact-stage__intro>p:last-child{
  max-width:42ch;
  margin:0;
  color:var(--paper-muted);
  font-size:clamp(1rem,1.4vw,1.25rem);
  line-height:1.5;
}
.contact-stage__links{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-self:start;
  width:100%;
  margin:0;
  border-top:1px solid var(--line);
}
.contact-stage__links a{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  gap:.35rem 1rem;
  min-height:8.5rem;
  padding:1.35rem 1.25rem 1.35rem 0;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  color:inherit;
  text-decoration:none;
}
.contact-stage__links a:nth-child(even){padding-left:1.25rem;border-right:0}
.contact-stage__links small{
  grid-column:1;
  color:var(--paper-faint);
  font-size:.7rem;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.contact-stage__links strong{
  grid-column:1;
  align-self:end;
  font-size:clamp(1.15rem,2.4vw,2.15rem);
  font-weight:540;
  letter-spacing:-.045em;
  overflow-wrap:anywhere;
}
.contact-stage__links a>span{
  grid-column:2;
  grid-row:1/3;
  align-self:center;
  font-size:1.5rem;
  transition:transform .35s var(--ease-out),color .25s var(--ease);
}
.contact-stage__links a::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:var(--accent);
  transform:scaleY(0);
  transform-origin:bottom;
  transition:transform .4s var(--ease-out);
}
.contact-stage__wordmark{
  width:calc(100% + clamp(2rem,8vw,8rem));
  margin-inline:calc(clamp(1rem,4vw,4rem) * -1);
  overflow:hidden;
  background:var(--accent);
  color:var(--ink);
  white-space:nowrap;
}
.contact-stage__wordmark span{
  display:block;
  padding:.05em .18em .13em;
  font-size:clamp(4.25rem,11.8vw,12.5rem);
  font-weight:620;
  letter-spacing:-.085em;
  line-height:.78;
}
.contact-stage__meta{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin:0;
  border-top:1px solid var(--line);
  color:inherit;
  font-size:inherit;
  letter-spacing:normal;
  text-transform:none;
}
.contact-stage__meta p{
  display:grid;
  gap:.35rem;
  min-height:5.5rem;
  margin:0;
  padding:1rem 1.25rem 0 0;
  border-right:1px solid var(--line);
}
.contact-stage__meta p:not(:first-child){padding-left:1.25rem}
.contact-stage__meta p:last-child{border-right:0}
.contact-stage__meta span{color:var(--paper-faint);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase}
.contact-stage__meta strong{font-size:clamp(.9rem,1.2vw,1.05rem);font-weight:520;line-height:1.25}
@media (hover:hover) and (pointer:fine){
  .contact-stage__links a:hover,.contact-stage__links a:focus-visible{color:var(--ink)}
  .contact-stage__links a:hover::before,.contact-stage__links a:focus-visible::before{transform:scaleY(1)}
  .contact-stage__links a:hover>span,.contact-stage__links a:focus-visible>span{color:var(--ink);transform:translate(.25rem,-.15rem)}
}
@media (max-width:56rem){
  .contact-stage__content{grid-template-rows:auto auto auto auto}
  .contact-stage__intro{grid-template-columns:1fr}
  .contact-stage__intro .section-kicker{grid-column:auto}
  .contact-stage__intro h2{font-size:clamp(2.8rem,9vw,5.6rem)}
  .contact-stage__links a{min-height:7.5rem}
  .contact-stage__meta{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact-stage__meta p:nth-child(2){border-right:0}
  .contact-stage__meta p:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .contact-stage__meta p:nth-child(3){padding-left:0}
}
@media (max-width:39.99rem){
  .contact-stage__content{gap:2rem;padding:5.5rem 1rem max(1rem,env(safe-area-inset-bottom))}
  .contact-stage__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(6,minmax(0,1fr))}
  .contact-stage__grid span:nth-child(4n){border-right:1px solid rgba(230,230,230,.08)}
  .contact-stage__grid span:nth-child(2n){border-right:0}
  .contact-stage__intro h2{font-size:clamp(2.7rem,13vw,4.4rem);line-height:.9}
  .contact-stage__links{grid-template-columns:1fr}
  .contact-stage__links a,.contact-stage__links a:nth-child(even){min-height:6rem;padding:1rem 0;border-right:0}
  .contact-stage__wordmark{width:calc(100% + 2rem);margin-inline:-1rem}
  .contact-stage__wordmark span{padding:.08em .18em .16em;font-size:clamp(3.55rem,20vw,6.4rem);line-height:.82}
  .contact-stage__meta{grid-template-columns:1fr}
  .contact-stage__meta p,.contact-stage__meta p:not(:first-child),.contact-stage__meta p:nth-child(3){min-height:auto;padding:.85rem 0;border-right:0;border-bottom:1px solid var(--line)}
  .contact-stage__meta p:last-child{border-bottom:0}
}


/* ---- Phase 16: contact viewport-fit refinement -------------------------- */
.contact-stage{
  display:block;
  min-height:auto;
  padding:0;
}
.contact-stage__content{
  grid-template-rows:auto auto auto auto;
  gap:clamp(1.35rem,2.35vw,2.2rem);
  width:min(100%,88rem);
  min-height:min(var(--experience-vh,100svh),56rem);
  padding:calc(var(--header-height) + .85rem) clamp(1rem,3vw,2.5rem) max(.9rem,env(safe-area-inset-bottom));
}
.contact-stage__intro{
  gap:clamp(1rem,3vw,3rem);
  align-items:end;
}
.contact-stage__intro h2{
  max-width:10.2ch;
  font-size:clamp(2.3rem,5.15vw,5.55rem);
  line-height:.9;
}
.contact-stage__intro > p:last-child{
  max-width:34ch;
  font-size:clamp(.95rem,1.05vw,1.08rem);
  line-height:1.46;
}
.contact-stage__links a{
  min-height:6.4rem;
  padding:1rem 1rem 1rem 0;
}
.contact-stage__links a:nth-child(even){padding-left:1rem}
.contact-stage__links strong{
  font-size:clamp(1.02rem,1.85vw,1.6rem);
  line-height:1.08;
}
.contact-stage__wordmark{
  width:100%;
  margin-inline:0;
}
.contact-stage__wordmark span{
  padding:.09em .12em .15em;
  font-size:clamp(3.25rem,8.1vw,8.7rem);
  line-height:.8;
}
.contact-stage__meta p{
  min-height:4.6rem;
  padding-top:.85rem;
}
.contact-stage__meta strong{
  font-size:clamp(.86rem,1.05vw,.98rem);
  line-height:1.28;
}

@media (max-width:68rem){
  .contact-stage__content{
    width:min(100%,82rem);
    min-height:min(var(--experience-vh,100svh),52rem);
    padding:calc(var(--header-height) + .75rem) 1rem max(.9rem,env(safe-area-inset-bottom));
  }
  .contact-stage__intro{
    grid-template-columns:minmax(0,1fr) minmax(15rem,.82fr);
  }
  .contact-stage__intro h2{font-size:clamp(2.2rem,5.85vw,4.8rem)}
  .contact-stage__links a{min-height:5.9rem}
  .contact-stage__wordmark span{font-size:clamp(3rem,9.35vw,7.2rem)}
}

@media (max-width:56rem){
  .contact-stage__content{
    min-height:min(var(--experience-vh,100svh),50rem);
    gap:1.4rem;
  }
  .contact-stage__intro{grid-template-columns:1fr}
  .contact-stage__intro h2{
    max-width:9.2ch;
    font-size:clamp(2.15rem,7vw,4.1rem);
  }
  .contact-stage__intro > p:last-child{max-width:38ch}
  .contact-stage__links a{min-height:5.35rem}
  .contact-stage__wordmark span{font-size:clamp(2.85rem,10.5vw,6rem)}
  .contact-stage__meta p{min-height:4.2rem;padding-top:.8rem}
}

@media (max-width:39.99rem){
  .contact-stage__content{
    width:100%;
    min-height:auto;
    gap:1.25rem;
    padding:calc(var(--header-height) + .55rem) 1rem max(.8rem,env(safe-area-inset-bottom));
  }
  .contact-stage__grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:repeat(6,minmax(0,1fr));
  }
  .contact-stage__intro h2{
    max-width:8.6ch;
    font-size:clamp(2rem,10.4vw,3.55rem);
    line-height:.92;
  }
  .contact-stage__intro > p:last-child{font-size:.96rem}
  .contact-stage__links{grid-template-columns:1fr}
  .contact-stage__links a,
  .contact-stage__links a:nth-child(even){
    min-height:4.9rem;
    padding:.9rem 0;
    border-right:0;
  }
  .contact-stage__links strong{
    font-size:clamp(1rem,5.1vw,1.28rem);
    line-height:1.12;
  }
  .contact-stage__wordmark{
    width:100%;
    margin-inline:0;
  }
  .contact-stage__wordmark span{
    padding:.1em .12em .15em;
    font-size:clamp(2.55rem,12.2vw,4.4rem);
    line-height:.84;
  }
  .contact-stage__meta{
    grid-template-columns:1fr;
  }
  .contact-stage__meta p,
  .contact-stage__meta p:not(:first-child),
  .contact-stage__meta p:nth-child(3){
    min-height:auto;
    padding:.78rem 0;
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .contact-stage__meta p:last-child{border-bottom:0}
}


/* ---- Phase 18: full-width contact composition --------------------------- */
.contact-stage__content{
  width:100%;
  max-width:none;
  grid-template-rows:auto auto auto;
  gap:clamp(1.4rem,2.4vw,2.5rem);
  padding-inline:clamp(1rem,6vw,7rem);
}
.contact-stage__intro{
  grid-template-columns:minmax(0,1.15fr) minmax(18rem,.85fr);
  gap:clamp(2rem,7vw,9rem);
}
.contact-stage__intro h2{
  max-width:11ch;
  font-size:clamp(3rem,5.4vw,6.4rem);
}
.contact-stage__links{
  width:100%;
}
.contact-stage__links a{
  min-height:7rem;
  padding-inline:clamp(1rem,2vw,2rem);
}
.contact-stage__links a:first-child{padding-left:0}
.contact-stage__wordmark{
  width:100%;
  margin:0;
  overflow:visible;
}
.contact-stage__wordmark span{
  width:100%;
  padding:.1em .16em .14em;
  font-size:clamp(3.2rem,7.25vw,8.75rem);
  line-height:.82;
  letter-spacing:-.075em;
  white-space:nowrap;
  text-align:center;
}
.contact-stage__meta{display:none!important}

@media (max-width:56rem){
  .contact-stage__content{
    gap:1.35rem;
    padding-inline:clamp(1rem,4vw,2rem);
  }
  .contact-stage__intro{
    grid-template-columns:1fr;
    gap:1.25rem;
  }
  .contact-stage__intro h2{
    max-width:10ch;
    font-size:clamp(2.5rem,8vw,4.6rem);
  }
  .contact-stage__links a{min-height:5.5rem}
  .contact-stage__wordmark span{
    font-size:clamp(2.45rem,10vw,5.2rem);
    letter-spacing:-.06em;
  }
}

@media (max-width:39.99rem){
  .contact-stage__content{
    gap:1.1rem;
    padding:calc(var(--header-height) + .45rem) 1rem max(1rem,env(safe-area-inset-bottom));
  }
  .contact-stage__intro h2{
    max-width:9.4ch;
    font-size:clamp(2.15rem,10.8vw,3.65rem);
    line-height:.94;
  }
  .contact-stage__intro > p:last-child{
    max-width:100%;
    font-size:.95rem;
    line-height:1.5;
  }
  .contact-stage__links a,
  .contact-stage__links a:nth-child(even){
    min-height:4.75rem;
    padding:.85rem 0;
  }
  .contact-stage__links strong{
    font-size:clamp(1rem,5.2vw,1.28rem);
  }
  .contact-stage__wordmark{
    overflow:hidden;
  }
  .contact-stage__wordmark span{
    padding:.14em .08em .18em;
    font-size:clamp(2.05rem,10.6vw,3.35rem);
    letter-spacing:-.055em;
    line-height:.88;
  }
}


/* ---- Phase 19: editorial grey contact composition ---------------------- */
.contact-editorial{background:#efefec;color:#0b0b0b;padding:clamp(1rem,2vw,2rem)}
.contact-editorial__inner{width:min(100%,92rem);margin-inline:auto}
.contact-editorial__hero{position:relative;height:clamp(13rem,25vw,24rem);overflow:hidden;border-radius:.22rem;background:#171717}
.contact-editorial__hero picture,.contact-editorial__hero img,.contact-editorial__hero video{display:block;width:100%;height:100%;object-fit:cover}
.contact-editorial__hero-placeholder{display:grid;place-items:center;width:100%;height:100%;background:#181818;color:#fff}
.contact-editorial__hero-placeholder span{font-size:clamp(2rem,5vw,6rem);font-weight:700}
.contact-editorial__hero>strong{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);color:#fff;font-size:clamp(1.2rem,2.5vw,2.3rem);font-weight:760;letter-spacing:-.045em;text-shadow:0 .08em .8em rgba(0,0,0,.5);white-space:nowrap}
.contact-editorial__middle{display:grid;grid-template-columns:minmax(0,.9fr) minmax(22rem,1.1fr);gap:clamp(3rem,8vw,10rem);align-items:start;padding:clamp(3rem,6vw,6.5rem) 1rem;border-bottom:1px solid rgba(0,0,0,.14)}
.contact-editorial__copy{display:grid;gap:1.25rem;max-width:36rem}
.contact-editorial__eyebrow{margin:0;color:#999;font-size:clamp(1.85rem,3.4vw,3.4rem);font-weight:670;letter-spacing:-.05em;line-height:.95}
.contact-editorial__copy h2{margin:0;font-size:clamp(1.75rem,3vw,3rem);letter-spacing:-.055em;line-height:1}
.contact-editorial__copy h2 a{text-decoration-thickness:.08em;text-underline-offset:.12em;overflow-wrap:anywhere}
.contact-editorial__copy>p:last-of-type{max-width:37ch;margin:0;color:#565656;line-height:1.55}
.contact-editorial__cta{display:inline-flex;align-items:center;gap:.65rem;justify-self:start;margin-top:.4rem;padding:.5rem 1rem .5rem .5rem;border-radius:999px;background:#dededb;text-decoration:none;font-weight:650}
.contact-editorial__cta span{display:grid;place-items:center;width:2.1rem;height:2.1rem;border-radius:50%;background:#0b0b0b;color:#fff}
.contact-editorial__nav{display:grid}
.contact-editorial__nav a{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.55rem;min-height:3.7rem;border-top:1px solid rgba(0,0,0,.14);color:#777;text-decoration:none}
.contact-editorial__nav a:last-child{border-bottom:1px solid rgba(0,0,0,.14)}
.contact-editorial__nav span{font-size:.75rem}.contact-editorial__nav strong{font-size:1rem;font-weight:560}.contact-editorial__nav i{font-style:normal;transition:transform .25s ease}
.contact-editorial__nav a:hover,.contact-editorial__nav a:focus-visible{color:#0b0b0b}.contact-editorial__nav a:hover i{transform:translateX(.3rem)}
.contact-editorial__brand-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(14rem,24rem);gap:clamp(2rem,4vw,4rem);align-items:stretch;padding:clamp(2rem,3vw,3rem) 1rem;border-bottom:1px solid rgba(0,0,0,.14)}
.contact-editorial__brand{display:flex;align-items:center;min-width:0;overflow:hidden;font-size:clamp(4rem,10vw,10.5rem);font-weight:840;letter-spacing:-.095em;line-height:.78;white-space:nowrap}
.contact-editorial__side-media{min-height:12rem;overflow:hidden;border-radius:.7rem;background:#d7d7d2}
.contact-editorial__side-media img,.contact-editorial__side-media video,.contact-editorial__side-media>div{width:100%;height:100%;min-height:12rem;object-fit:cover}
.contact-editorial__bottom{display:flex;justify-content:space-between;gap:2rem;padding:1rem;font-size:.9rem}.contact-editorial__bottom p{margin:0}.contact-editorial__bottom a{text-decoration:none}
@media (max-width:54rem){.contact-editorial__middle{grid-template-columns:1fr;gap:3rem;padding-block:3.25rem}.contact-editorial__brand-row{grid-template-columns:1fr}.contact-editorial__brand{min-height:8rem;font-size:clamp(3.4rem,13vw,7rem);white-space:normal;overflow-wrap:anywhere}.contact-editorial__side-media{min-height:15rem}}
@media (max-width:39.99rem){.contact-editorial{padding:.75rem}.contact-editorial__hero{height:12rem}.contact-editorial__hero>strong{max-width:90%;font-size:clamp(1.15rem,6vw,1.7rem);white-space:normal;text-align:center}.contact-editorial__middle{padding:2.5rem .25rem}.contact-editorial__eyebrow{font-size:clamp(1.7rem,9vw,2.5rem)}.contact-editorial__copy h2{font-size:clamp(1.55rem,7.7vw,2.15rem)}.contact-editorial__nav a{min-height:3.45rem}.contact-editorial__brand-row{padding:1.5rem .25rem}.contact-editorial__brand{min-height:0;font-size:clamp(2.75rem,15vw,4.8rem);line-height:.86;letter-spacing:-.075em}.contact-editorial__side-media,.contact-editorial__side-media img,.contact-editorial__side-media video,.contact-editorial__side-media>div{min-height:12rem}.contact-editorial__bottom{flex-direction:column;gap:.65rem;padding:1rem .25rem}}


/* ---- Phase 20: contact clarity and footer removal ----------------------- */
.contact-editorial__middle{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(3rem,9vw,11rem)}
.contact-editorial__copy--feature{align-self:center;max-width:42rem}
.contact-editorial__copy--feature .contact-editorial__eyebrow{color:#111;font-size:clamp(2.4rem,4.8vw,5rem);line-height:.88}
.contact-editorial__copy--feature h3{margin:0;font-size:clamp(1.8rem,3.3vw,3.5rem);letter-spacing:-.06em;line-height:1}
.contact-editorial__copy--feature h3 a{overflow-wrap:anywhere;text-decoration-thickness:.08em;text-underline-offset:.13em}
.contact-editorial__copy--feature>p:last-child{max-width:39ch;margin:0;color:#4e4e4e;font-size:clamp(1rem,1.35vw,1.22rem);line-height:1.55}
.contact-editorial__brand-row{display:block;padding:clamp(2.5rem,4vw,4.5rem) 1rem}
.contact-editorial__brand{width:100%;min-height:auto;overflow:visible;font-size:clamp(4rem,10.8vw,11.5rem);line-height:.82;white-space:normal;text-wrap:balance;overflow-wrap:normal}
.site-footer{display:none!important}
@media (max-width:54rem){.contact-editorial__middle{grid-template-columns:1fr;gap:3.5rem}.contact-editorial__copy--feature .contact-editorial__eyebrow{font-size:clamp(2.25rem,9vw,4.25rem)}.contact-editorial__brand{font-size:clamp(3.6rem,13.8vw,7rem);line-height:.86}}
@media (max-width:39.99rem){.contact-editorial__middle{gap:2.75rem}.contact-editorial__copy--feature h3{font-size:clamp(1.55rem,7.8vw,2.3rem)}.contact-editorial__brand-row{padding:1.75rem .25rem}.contact-editorial__brand{font-size:clamp(2.9rem,15.3vw,4.75rem);letter-spacing:-.078em;line-height:.9}}


/* ---- Phase 21: single contact statement and clearer identity ------------ */
.contact-editorial__middle{
  display:block;
  margin-inline:calc(clamp(1rem,2vw,2rem) * -1);
  padding:clamp(3.25rem,6vw,6.5rem) clamp(1.25rem,5vw,6rem);
  border-bottom:0;
  background:#050505;
  color:#32e33b;
}
.contact-editorial__copy{
  max-width:min(100%,70rem);
  margin-inline:auto;
  gap:clamp(1rem,1.8vw,1.6rem);
}
.contact-editorial__eyebrow{
  color:#32e33b;
  font-size:clamp(3rem,7vw,7.5rem);
  font-weight:760;
  letter-spacing:-.055em;
  line-height:.86;
}
.contact-editorial__copy h2{
  font-size:clamp(2rem,4.5vw,4.8rem);
  letter-spacing:-.045em;
  line-height:1;
}
.contact-editorial__copy h2 a{
  color:#32e33b;
  text-decoration-color:currentColor;
}
.contact-editorial__copy>p:last-of-type{
  max-width:48ch;
  color:#32e33b;
  font-size:clamp(1rem,1.45vw,1.3rem);
  line-height:1.55;
}
.contact-editorial__cta{
  background:#32e33b;
  color:#050505;
}
.contact-editorial__cta span{
  background:#050505;
  color:#32e33b;
}
.contact-editorial__brand{
  letter-spacing:-.045em;
  word-spacing:.08em;
}

@media (max-width:54rem){
  .contact-editorial__middle{padding:3.5rem 1.25rem}
  .contact-editorial__eyebrow{font-size:clamp(2.6rem,10vw,5rem)}
  .contact-editorial__copy h2{font-size:clamp(1.7rem,7vw,3rem)}
  .contact-editorial__brand{letter-spacing:-.035em;word-spacing:.1em}
}
@media (max-width:39.99rem){
  .contact-editorial__middle{margin-inline:-.75rem;padding:2.75rem 1rem}
  .contact-editorial__eyebrow{font-size:clamp(2.3rem,12vw,3.75rem);line-height:.9}
  .contact-editorial__copy h2{font-size:clamp(1.45rem,7.6vw,2.2rem)}
  .contact-editorial__brand{letter-spacing:-.025em;word-spacing:.12em}
}

/* ---- Phase 23: contact heading-only editorial highlight ---------------- */
.contact-editorial__middle{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  margin-inline:0;
  padding:clamp(3.5rem,7vw,7.5rem) clamp(1rem,2.5vw,2.5rem);
  overflow:visible;
  border-bottom:1px solid rgba(0,0,0,.14);
  background:#efefec;
  color:#0b0b0b;
}
.contact-editorial__middle::before{content:none}
.contact-editorial__copy{
  width:min(100%,76rem);
  max-width:none;
  margin:0;
  gap:clamp(1rem,1.6vw,1.5rem);
}
.contact-editorial__eyebrow{
  display:table;
  width:fit-content;
  max-width:100%;
  margin:0;
  padding:.06em .13em .1em;
  border-radius:.12em;
  background:linear-gradient(#050505,#050505) 0 100%/0 100% no-repeat;
  color:#0b0b0b;
  font-size:clamp(3.25rem,7.5vw,8rem);
  font-weight:760;
  letter-spacing:-.065em;
  line-height:.86;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
  transition:background-size .8s cubic-bezier(.16,1,.3,1),color .28s ease .08s,transform .8s cubic-bezier(.16,1,.3,1);
}
.contact-editorial__copy h2{
  font-size:clamp(2rem,4.3vw,4.8rem);
  letter-spacing:-.055em;
  line-height:1;
}
.contact-editorial__copy h2 a{
  color:inherit;
  text-decoration-color:currentColor;
  text-decoration-thickness:.07em;
  text-underline-offset:.12em;
}
.contact-editorial__copy>p:last-of-type{
  max-width:54ch;
  color:#505050;
  font-size:clamp(1rem,1.25vw,1.22rem);
  line-height:1.55;
}
.contact-editorial__cta{
  background:#dededb;
  color:#050505;
  transition:background-color .35s ease,color .35s ease,transform .35s cubic-bezier(.22,1,.36,1);
}
.contact-editorial__cta span{background:#050505;color:#fff}
.contact-editorial__middle.is-contact-active .contact-editorial__eyebrow{
  background-size:100% 100%;
  color:#32e33b;
  transform:translateY(-.03em);
}

@media (hover:hover) and (pointer:fine){
  .contact-editorial__cta:hover,.contact-editorial__cta:focus-visible{transform:translateY(-2px)}
}
@media (max-width:54rem){
  .contact-editorial__middle{padding:clamp(3rem,8vw,5rem) 1rem}
  .contact-editorial__copy{width:100%}
  .contact-editorial__eyebrow{font-size:clamp(2.7rem,10vw,5.4rem)}
  .contact-editorial__copy h2{font-size:clamp(1.65rem,6.8vw,3.1rem)}
}
@media (max-width:39.99rem){
  .contact-editorial__middle{margin-inline:0;padding:2.75rem .25rem}
  .contact-editorial__eyebrow{font-size:clamp(2.35rem,12vw,3.8rem);line-height:.9}
  .contact-editorial__copy h2{font-size:clamp(1.42rem,7.5vw,2.2rem)}
  .contact-editorial__copy>p:last-of-type{font-size:.98rem}
}
@media (prefers-reduced-motion:reduce){
  .contact-editorial__eyebrow,
  .contact-editorial__cta{transition-duration:.01ms!important;transition-delay:0ms!important}
}

/* ---- Phase 24: fluid contact art direction ----------------------------- */
.contact-editorial__middle{
  container-type:inline-size;
  isolation:isolate;
  padding:clamp(3rem,7vw,7.5rem) clamp(.25rem,2.2vw,2rem);
}
.contact-editorial__copy{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(15rem,22rem);
  align-items:end;
  gap:clamp(2.25rem,6vw,7rem);
  width:100%;
  max-width:none;
}
.contact-editorial__lead{
  display:grid;
  min-width:0;
  gap:clamp(1.1rem,2vw,1.9rem);
}
.contact-editorial__eyebrow{
  display:inline-block;
  justify-self:start;
  width:auto;
  max-width:100%;
  padding:.08em .14em .12em;
  border-radius:.11em;
  font-size:clamp(3.1rem,7.15cqi,7.7rem);
  line-height:.84;
  text-wrap:balance;
  overflow-wrap:normal;
  box-shadow:0 0 0 1px rgba(0,0,0,.04);
  transform-origin:left center;
}
.contact-editorial__copy h2{
  max-width:100%;
  font-size:clamp(1.95rem,4.25cqi,4.7rem);
  line-height:.94;
}
.contact-editorial__copy h2 a{
  display:inline;
  overflow-wrap:anywhere;
  text-decoration-thickness:.055em;
  text-underline-offset:.14em;
  transition:opacity .25s ease,text-decoration-thickness .25s ease;
}
.contact-editorial__support{
  display:grid;
  align-content:end;
  justify-items:start;
  gap:clamp(1.25rem,2vw,1.8rem);
  padding-bottom:.25rem;
}
.contact-editorial__support p{
  max-width:34ch;
  margin:0;
  color:#505050;
  font-size:clamp(.98rem,1.18vw,1.16rem);
  line-height:1.58;
}
.contact-editorial__cta{
  margin:0;
  min-height:3.15rem;
  padding:.5rem 1.05rem .5rem .5rem;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.04);
}
.contact-editorial__middle.is-contact-active .contact-editorial__eyebrow{
  transform:translateY(-.035em) scale(1.006);
}
@media (hover:hover) and (pointer:fine){
  .contact-editorial__copy h2 a:hover{opacity:.62;text-decoration-thickness:.085em}
  .contact-editorial__cta:hover,.contact-editorial__cta:focus-visible{transform:translate3d(0,-3px,0)}
}
@container (max-width:52rem){
  .contact-editorial__copy{
    grid-template-columns:1fr;
    align-items:start;
    gap:clamp(2rem,7vw,3.75rem);
  }
  .contact-editorial__support{
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    gap:1.5rem;
  }
  .contact-editorial__support p{max-width:43ch}
}
@container (max-width:34rem){
  .contact-editorial__middle{padding-block:clamp(2.75rem,12vw,4rem)}
  .contact-editorial__eyebrow{
    font-size:clamp(2.35rem,12.5cqi,3.85rem);
    line-height:.88;
  }
  .contact-editorial__copy h2{
    font-size:clamp(1.42rem,7.6cqi,2.2rem);
    line-height:1;
  }
  .contact-editorial__support{
    grid-template-columns:1fr;
    align-items:start;
    gap:1.35rem;
  }
  .contact-editorial__support p{max-width:100%;font-size:.98rem}
  .contact-editorial__cta{min-height:3rem}
}
@media (prefers-reduced-motion:reduce){
  .contact-editorial__copy h2 a{transition:none!important}
  .contact-editorial__middle.is-contact-active .contact-editorial__eyebrow{transform:none}
}

/* ---- Phase 25: viewport-safe contact footer visibility ----------------- */
/* Keep the identity lockup and terminal utility row inside the first
   contact viewport on common desktop/tablet heights without fixed UI. */
.contact-editorial__middle{
  padding-block:clamp(2.75rem,4.6vw,5rem);
}
.contact-editorial__brand-row{
  padding:clamp(1.25rem,2.2vw,2.25rem) clamp(.25rem,2.2vw,2rem);
}
.contact-editorial__brand{
  font-size:clamp(3.75rem,8.35vw,8.75rem);
  line-height:.8;
}
.contact-editorial__bottom{
  align-items:center;
  min-height:clamp(3.25rem,4.5vw,4rem);
  padding:.7rem clamp(.25rem,2.2vw,2rem) max(.7rem,env(safe-area-inset-bottom));
  border-top:1px solid rgba(0,0,0,.14);
  font-size:clamp(.78rem,.85vw,.9rem);
}
.contact-editorial__bottom a{
  display:inline-flex;
  align-items:center;
  min-height:2.75rem;
  padding-inline:.35rem;
  font-weight:650;
  white-space:nowrap;
}

@media (max-height:50rem) and (min-width:54.01rem){
  .contact-editorial__hero{height:clamp(11.5rem,22vh,16rem)}
  .contact-editorial__middle{padding-block:clamp(2.25rem,4vh,3.5rem)}
  .contact-editorial__copy{gap:clamp(1.75rem,4vw,4rem)}
  .contact-editorial__eyebrow{font-size:clamp(2.8rem,6.2cqi,6.25rem)}
  .contact-editorial__copy h2{font-size:clamp(1.8rem,3.65cqi,3.85rem)}
  .contact-editorial__brand-row{padding-block:1.1rem}
  .contact-editorial__brand{font-size:clamp(3.6rem,7.45vw,7.4rem)}
}

@media (max-width:54rem){
  .contact-editorial__middle{padding-block:clamp(2.75rem,7vw,4.25rem)}
  .contact-editorial__brand-row{padding-block:clamp(1.1rem,3.5vw,1.75rem)}
  .contact-editorial__brand{font-size:clamp(3.25rem,11.5vw,6.25rem);line-height:.84}
  .contact-editorial__bottom{padding-inline:.25rem}
}

@media (max-width:39.99rem){
  .contact-editorial__middle{padding-block:clamp(2.35rem,9vw,3.25rem)}
  .contact-editorial__brand-row{padding:1rem .25rem}
  .contact-editorial__brand{
    font-size:clamp(2.65rem,13.2vw,4.1rem);
    line-height:.88;
  }
  .contact-editorial__bottom{
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    min-height:3.5rem;
    padding:.45rem .25rem max(.55rem,env(safe-area-inset-bottom));
    font-size:clamp(.72rem,3.1vw,.82rem);
  }
  .contact-editorial__bottom p{min-width:0}
  .contact-editorial__bottom a{flex:0 0 auto;min-height:2.75rem}
}

/* ---- Phase 26: cinematic video-filled identity wordmark ---------------- */
/* The contact media is now rendered inside the name rather than beside it.
   SVG clipping provides a real moving-image fill while the HTML fallback
   preserves identity and accessibility when media or SVG rendering fails. */
.contact-editorial__hero--wordmark{
  position:relative;
  display:grid;
  place-items:center;
  width:100%;
  height:auto;
  min-height:clamp(13rem,23vw,22rem);
  padding:clamp(1.25rem,2.4vw,2.75rem) clamp(.5rem,1.5vw,1.5rem);
  overflow:hidden;
  border-radius:0;
  background:#080808;
  isolation:isolate;
}
.contact-editorial__hero--wordmark::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(110deg,rgba(255,255,255,.035),transparent 36%,rgba(255,255,255,.018));
  mix-blend-mode:screen;
}
.contact-video-wordmark{
  display:block;
  width:min(100%,100rem);
  height:auto;
  overflow:visible;
}
.contact-video-wordmark text{
  font-family:var(--font-display,var(--font-sans,Arial,sans-serif));
  font-size:245px;
  font-weight:850;
  letter-spacing:-.075em;
}
.contact-video-wordmark__media,
.contact-video-wordmark__media video,
.contact-video-wordmark__media img{
  display:block;
  width:100%;
  height:100%;
}
.contact-video-wordmark__media{background:#111}
.contact-video-wordmark__media video,
.contact-video-wordmark__media img{
  object-fit:cover;
  object-position:center;
  transform:scale(1.02);
}
.contact-video-wordmark--mobile{display:none}
.contact-video-wordmark__fallback{
  max-width:100%;
  color:#f5f5f2;
  font-size:clamp(4rem,11vw,11.5rem);
  font-weight:850;
  letter-spacing:-.085em;
  line-height:.78;
  text-align:center;
  text-wrap:balance;
}
.contact-editorial__middle{
  border-top:0;
}

@media (hover:hover) and (pointer:fine){
  .contact-editorial__hero--wordmark .contact-video-wordmark__media video,
  .contact-editorial__hero--wordmark .contact-video-wordmark__media img{
    transition:transform .9s cubic-bezier(.2,.75,.2,1),filter .9s ease;
  }
  .contact-editorial__hero--wordmark:hover .contact-video-wordmark__media video,
  .contact-editorial__hero--wordmark:hover .contact-video-wordmark__media img{
    transform:scale(1.065);
    filter:saturate(1.08) contrast(1.04);
  }
}

@media (max-width:54rem){
  .contact-editorial__hero--wordmark{
    min-height:clamp(12rem,37vw,18rem);
    padding:clamp(1rem,3vw,1.75rem) .5rem;
  }
  .contact-video-wordmark text{font-size:252px}
}

@media (max-width:39.99rem){
  .contact-editorial__hero--wordmark{
    min-height:clamp(17rem,78vw,25rem);
    padding:clamp(1rem,4vw,1.5rem) .15rem;
  }
  .contact-video-wordmark--desktop{display:none}
  .contact-video-wordmark--mobile{display:block;width:100%}
  .contact-video-wordmark--mobile text{
    font-size:198px;
    font-weight:850;
    letter-spacing:-.07em;
  }
  .contact-video-wordmark__fallback{
    font-size:clamp(3.7rem,18vw,6rem);
    line-height:.82;
  }
}

@media (prefers-reduced-motion:reduce){
  .contact-editorial__hero--wordmark .contact-video-wordmark__media video,
  .contact-editorial__hero--wordmark .contact-video-wordmark__media img{
    transition:none!important;
    transform:none!important;
  }
}


/* ---- Phase 27: resilient video-text mask, transparent section ---------- */
.contact-editorial__hero--wordmark{
  min-height:0;
  padding:clamp(1rem,2.2vw,2.25rem) 0;
  background:transparent;
  overflow:visible;
}
.contact-editorial__hero--wordmark::after{display:none}
.contact-video-mask{
  position:relative;
  width:100%;
  aspect-ratio:1600/360;
}
.contact-video-mask__media,
.contact-video-mask__media video,
.contact-video-mask__media img{
  display:block;
  width:100%;
  height:100%;
}
.contact-video-mask__media video,
.contact-video-mask__media img{
  object-fit:cover;
  object-position:center;
}
.contact-video-mask__fallback{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  color:#050505;
  font-family:var(--font-display,var(--font-sans,Arial,sans-serif));
  font-size:clamp(3.4rem,10.7vw,11.2rem);
  font-weight:850;
  letter-spacing:-.075em;
  line-height:.82;
  text-align:center;
}
.contact-video-mask:not(.contact-video-mask--fallback) .contact-video-mask__fallback{
  position:absolute;
  inset:0;
}
@supports ((-webkit-mask-image:url("")) or (mask-image:url(""))){
  .contact-video-mask:not(.contact-video-mask--fallback) .contact-video-mask__media{
    -webkit-mask-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNjAwIDM2MCI+PHJlY3Qgd2lkdGg9IjE2MDAiIGhlaWdodD0iMzYwIiBmaWxsPSJibGFjayIvPjx0ZXh0IHg9IjgwMCIgeT0iMjc0IiB0ZXh0LWFuY2hvcj0ibWlkZGxlIiBmaWxsPSJ3aGl0ZSIgZm9udC1mYW1pbHk9IkFyaWFsLEhlbHZldGljYSxzYW5zLXNlcmlmIiBmb250LXNpemU9IjIzOCIgZm9udC13ZWlnaHQ9IjkwMCIgbGV0dGVyLXNwYWNpbmc9Ii0xMyI+xLBzbWFpbCBDYW4gU8O2bm1lejwvdGV4dD48L3N2Zz4=");
    mask-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNjAwIDM2MCI+PHJlY3Qgd2lkdGg9IjE2MDAiIGhlaWdodD0iMzYwIiBmaWxsPSJibGFjayIvPjx0ZXh0IHg9IjgwMCIgeT0iMjc0IiB0ZXh0LWFuY2hvcj0ibWlkZGxlIiBmaWxsPSJ3aGl0ZSIgZm9udC1mYW1pbHk9IkFyaWFsLEhlbHZldGljYSxzYW5zLXNlcmlmIiBmb250LXNpemU9IjIzOCIgZm9udC13ZWlnaHQ9IjkwMCIgbGV0dGVyLXNwYWNpbmc9Ii0xMyI+xLBzbWFpbCBDYW4gU8O2bm1lejwvdGV4dD48L3N2Zz4=");
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
    -webkit-mask-position:center;
    mask-position:center;
    -webkit-mask-size:100% 100%;
    mask-size:100% 100%;
  }
  .contact-video-mask:not(.contact-video-mask--fallback) .contact-video-mask__fallback{display:none}
}
@media (max-width:39.99rem){
  .contact-editorial__hero--wordmark{padding:clamp(.75rem,3vw,1.25rem) 0}
  .contact-video-mask{aspect-ratio:760/500}
  .contact-video-mask__fallback{
    padding-inline:.1em;
    font-size:clamp(3.5rem,17.8vw,6rem);
    line-height:.78;
    white-space:normal;
  }
  @supports ((-webkit-mask-image:url("")) or (mask-image:url(""))){
    .contact-video-mask:not(.contact-video-mask--fallback) .contact-video-mask__media{
      -webkit-mask-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA3NjAgNTAwIj48cmVjdCB3aWR0aD0iNzYwIiBoZWlnaHQ9IjUwMCIgZmlsbD0iYmxhY2siLz48dGV4dCB4PSIzODAiIHk9IjIwNSIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZmlsbD0id2hpdGUiIGZvbnQtZmFtaWx5PSJBcmlhbCxIZWx2ZXRpY2Esc2Fucy1zZXJpZiIgZm9udC1zaXplPSIxODYiIGZvbnQtd2VpZ2h0PSI5MDAiIGxldHRlci1zcGFjaW5nPSItOSI+xLBzbWFpbCBDYW48L3RleHQ+PHRleHQgeD0iMzgwIiB5PSI0MjAiIHRleHQtYW5jaG9yPSJtaWRkbGUiIGZpbGw9IndoaXRlIiBmb250LWZhbWlseT0iQXJpYWwsSGVsdmV0aWNhLHNhbnMtc2VyaWYiIGZvbnQtc2l6ZT0iMjA1IiBmb250LXdlaWdodD0iOTAwIiBsZXR0ZXItc3BhY2luZz0iLTEwIj5Tw7ZubWV6PC90ZXh0Pjwvc3ZnPg==");
      mask-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA3NjAgNTAwIj48cmVjdCB3aWR0aD0iNzYwIiBoZWlnaHQ9IjUwMCIgZmlsbD0iYmxhY2siLz48dGV4dCB4PSIzODAiIHk9IjIwNSIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZmlsbD0id2hpdGUiIGZvbnQtZmFtaWx5PSJBcmlhbCxIZWx2ZXRpY2Esc2Fucy1zZXJpZiIgZm9udC1zaXplPSIxODYiIGZvbnQtd2VpZ2h0PSI5MDAiIGxldHRlci1zcGFjaW5nPSItOSI+xLBzbWFpbCBDYW48L3RleHQ+PHRleHQgeD0iMzgwIiB5PSI0MjAiIHRleHQtYW5jaG9yPSJtaWRkbGUiIGZpbGw9IndoaXRlIiBmb250LWZhbWlseT0iQXJpYWwsSGVsdmV0aWNhLHNhbnMtc2VyaWYiIGZvbnQtc2l6ZT0iMjA1IiBmb250LXdlaWdodD0iOTAwIiBsZXR0ZXItc3BhY2luZz0iLTEwIj5Tw7ZubWV6PC90ZXh0Pjwvc3ZnPg==");
    }
  }
}
@media (prefers-reduced-motion:reduce){
  .contact-video-mask__media video{transform:none!important;transition:none!important}
}

/* ---- Phase 28: CMS-synced contact copy + true transparent video mask ---- */
.contact-video-mask__media{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 360'%3E%3Ctext x='800' y='274' text-anchor='middle' fill='white' font-family='Arial,Helvetica,sans-serif' font-size='238' font-weight='900' letter-spacing='-13'%3E%C4%B0smail Can S%C3%B6nmez%3C/text%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 360'%3E%3Ctext x='800' y='274' text-anchor='middle' fill='white' font-family='Arial,Helvetica,sans-serif' font-size='238' font-weight='900' letter-spacing='-13'%3E%C4%B0smail Can S%C3%B6nmez%3C/text%3E%3C/svg%3E");
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
}
.contact-video-mask__asset{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:var(--media-x,50%) var(--media-y,50%);
}
.contact-video-mask__asset--mobile{display:none}
.contact-video-mask__fallback{gap:.18em}
.contact-video-mask__fallback span{display:inline}
.contact-editorial__kicker{
  margin:0 0 clamp(.65rem,1.2vw,1rem);
  font-size:clamp(.72rem,.85vw,.9rem);
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.contact-editorial__lead h2{
  margin:0;
  max-width:18ch;
  font-size:clamp(2.35rem,5.8cqi,6.2rem);
  line-height:.9;
  letter-spacing:-.065em;
}
.contact-editorial__headline-highlight{
  display:inline;
  padding:.04em .12em .08em;
  color:#20ef45;
  background:#050505;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
  border-radius:.09em;
}
.contact-editorial__secondary{
  margin:clamp(1rem,2vw,1.5rem) 0 0;
  max-width:34ch;
  font-size:clamp(1.05rem,1.7vw,1.5rem);
  line-height:1.25;
  font-weight:650;
}
@media (max-width:39.99rem){
  .contact-video-mask__media{
    -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 760 500'%3E%3Ctext x='380' y='205' text-anchor='middle' fill='white' font-family='Arial,Helvetica,sans-serif' font-size='186' font-weight='900' letter-spacing='-9'%3E%C4%B0smail Can%3C/text%3E%3Ctext x='380' y='420' text-anchor='middle' fill='white' font-family='Arial,Helvetica,sans-serif' font-size='205' font-weight='900' letter-spacing='-10'%3ES%C3%B6nmez%3C/text%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 760 500'%3E%3Ctext x='380' y='205' text-anchor='middle' fill='white' font-family='Arial,Helvetica,sans-serif' font-size='186' font-weight='900' letter-spacing='-9'%3E%C4%B0smail Can%3C/text%3E%3Ctext x='380' y='420' text-anchor='middle' fill='white' font-family='Arial,Helvetica,sans-serif' font-size='205' font-weight='900' letter-spacing='-10'%3ES%C3%B6nmez%3C/text%3E%3C/svg%3E");
  }
  .contact-video-mask__asset--desktop{display:none}
  .contact-video-mask__asset--mobile{display:block}
  .contact-video-mask__fallback{flex-direction:column;gap:0}
  .contact-editorial__lead h2{max-width:100%;font-size:clamp(2.4rem,12.5vw,4.4rem)}
  .contact-editorial__headline-highlight{padding-inline:.1em}
}
@supports not ((-webkit-mask-image:url("")) or (mask-image:url(""))){
  .contact-video-mask__media{display:none}
  .contact-video-mask__fallback{display:flex!important}
}


/* ---- Phase 29: direct contact media + responsive editorial CTA -------- */
.contact-editorial__hero--media{
  position:relative;
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:21/5;
  margin:0;
  overflow:hidden;
  border-radius:0;
  background:#d8d8d3;
}
.contact-editorial__media-asset{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:var(--media-x,50%) var(--media-y,50%);
}
.contact-editorial__media-asset--mobile{display:none}

.contact-editorial__middle{
  container-type:inline-size;
  display:block;
  padding:clamp(3.25rem,7vw,7rem) clamp(.25rem,2vw,1rem);
}
.contact-editorial__copy{
  display:grid;
  grid-template-columns:minmax(0,1.75fr) minmax(18rem,.75fr);
  gap:clamp(2.5rem,8vw,9rem);
  align-items:end;
  max-width:none;
}
.contact-editorial__lead{
  min-width:0;
}
.contact-editorial__kicker{
  margin:0 0 clamp(1rem,1.8vw,1.5rem);
  color:#111;
  font-size:clamp(.72rem,.8vw,.88rem);
  font-weight:760;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.contact-editorial__lead h2{
  margin:0;
  max-width:15ch;
  font-size:clamp(2.7rem,5.2cqi,5.9rem);
  line-height:.92;
  letter-spacing:-.06em;
  text-wrap:balance;
}
.contact-editorial__headline-highlight{
  display:block;
  width:fit-content;
  max-width:100%;
  padding:.16em .2em .2em;
  color:#20ef45;
  background:#050505;
  border-radius:.1em;
  -webkit-box-decoration-break:slice;
  box-decoration-break:slice;
}
.contact-editorial__support{
  display:grid;
  gap:clamp(1.35rem,2vw,2rem);
  align-content:end;
  max-width:32rem;
  padding-bottom:.35rem;
}
.contact-editorial__support>p{
  margin:0;
  max-width:34ch;
  color:#333;
  font-size:clamp(1rem,1.2vw,1.18rem);
  line-height:1.55;
}
.contact-editorial__cta{
  min-height:3rem;
  padding:.45rem 1.05rem .45rem .45rem;
}
.contact-editorial__cta span{
  width:2.1rem;
  height:2.1rem;
}

@media (max-width:54rem){
  .contact-editorial__hero--media{aspect-ratio:16/7}
  .contact-editorial__copy{
    grid-template-columns:1fr;
    gap:clamp(2rem,6vw,3.5rem);
    align-items:start;
  }
  .contact-editorial__lead h2{
    max-width:17ch;
    font-size:clamp(2.65rem,8.7vw,5.1rem);
  }
  .contact-editorial__support{max-width:38rem;padding-bottom:0}
}

@media (max-width:39.99rem){
  .contact-editorial{padding:.75rem}
  .contact-editorial__hero--media{
    aspect-ratio:4/3;
    min-height:0;
  }
  .contact-editorial__media-asset--desktop{display:none}
  .contact-editorial__media-asset--mobile{display:block}
  .contact-editorial__middle{
    padding:clamp(2.5rem,12vw,4rem) .25rem;
  }
  .contact-editorial__copy{gap:2.25rem}
  .contact-editorial__lead h2{
    max-width:100%;
    font-size:clamp(2.35rem,11.8vw,4rem);
    line-height:.94;
  }
  .contact-editorial__headline-highlight{
    width:100%;
    padding:.18em .18em .22em;
  }
  .contact-editorial__support>p{
    max-width:31ch;
    font-size:1rem;
  }
  .contact-editorial__cta{width:fit-content;min-height:3.25rem}
}

@media (prefers-reduced-motion:reduce){
  .contact-editorial__media-asset{transform:none!important;transition:none!important}
}


/* ---- Phase 30: compact handoff + typewriter statement -------------------
   The media-to-content transition is intentionally tighter. The statement is
   plain ink only; emphasis now comes from temporal typing rather than a dark
   highlight slab, reducing visual noise beside the expertise cards. */
.work-layers .section-shell{
  padding-top:clamp(2rem,3.8vw,4.25rem);
  padding-bottom:clamp(4rem,7vw,8rem);
}
.work-layers__intro{margin-bottom:clamp(1rem,1.8vw,1.75rem)}
.work-layers__statement{
  position:relative;
  min-height:calc(4.9em * .98);
  color:var(--wl-ink);
  background:transparent;
}
.work-layers__statement .work-highlight,
.work-layers__statement .work-highlight__words,
.work-layers__statement .work-highlight__word,
.work-layers__statement .work-highlight__base,
.work-layers__statement .work-highlight__mask{
  display:inline;
  padding:0;
  margin:0;
  border-radius:0;
  background:transparent;
  color:inherit;
  box-shadow:none;
  clip-path:none;
  -webkit-clip-path:none;
}
.work-layers__cursor{
  display:none;
  width:.055em;
  height:.86em;
  margin-left:.07em;
  vertical-align:-.06em;
  background:currentColor;
}
.work-layers__statement[data-typewriter-active] .work-layers__cursor{
  display:inline-block;
  animation:work-typewriter-caret .72s steps(1,end) infinite;
}
.work-layers__statement[data-typewriter-complete] .work-layers__cursor{display:none}
@keyframes work-typewriter-caret{0%,46%{opacity:1}47%,100%{opacity:0}}

/* When the CMS order places a media-led section immediately before work
   layers, remove the compounded section spacing without coupling internals. */
.contact-editorial + .work-layers .section-shell,
.cinematic-hero + .work-layers .section-shell{
  padding-top:clamp(1.5rem,3vw,3rem);
}

@media (max-width:47.99rem){
  .work-layers .section-shell{
    width:min(100% - 1.5rem,108rem);
    padding-top:clamp(1.5rem,6vw,2.5rem);
    padding-bottom:clamp(3.5rem,12vw,5.5rem);
  }
  .work-layers__statement{
    min-height:calc(5.9em * .98);
    max-width:15ch;
  }
}
@media (prefers-reduced-motion:reduce){
  .work-layers__cursor{display:none!important;animation:none!important}
}


/* ---- Phase 31: compact hero-to-layers handoff + icon-only tool rail -----
   The expertise section is pulled into the visual wake of the hero morph.
   Tool names remain available to assistive technology and native title
   tooltips, but are removed from the visual rail to reduce repetitive noise. */
.cinematic-hero + .work-layers{
  position:relative;
  z-index:2;
  margin-top:clamp(-7rem,-9vh,-3.5rem);
}
.cinematic-hero + .work-layers .section-shell{
  padding-top:clamp(1rem,2vw,2rem);
}
.tool-rail__item > .sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
.tool-rail__item{
  gap:0;
}

@media (max-width:63.99rem){
  .cinematic-hero + .work-layers{
    margin-top:clamp(-5rem,-7vh,-2.5rem);
  }
  .cinematic-hero + .work-layers .section-shell{
    padding-top:clamp(.75rem,3vw,1.5rem);
  }
}

@media (max-width:47.99rem){
  .cinematic-hero + .work-layers{
    margin-top:clamp(-3.5rem,-5.5vh,-2rem);
  }
  .cinematic-hero + .work-layers .section-shell{
    padding-top:clamp(.75rem,4vw,1.25rem);
  }
}

/* ---- Phase 33: section boundary isolation + viewport-safe composition ----
   Each homepage module owns its own paint layer and at least one dynamic
   viewport. This prevents a preceding section with a raised z-index or
   negative handoff margin from bleeding over the following module. */
main > section[data-home-section]{
  position:relative;
  min-height:100svh;
  isolation:isolate;
  box-sizing:border-box;
}

/* Phase 31 used a negative overlap and z-index to visually pull the expertise
   section into the hero. That also allowed it to paint over Recognition when
   scrolling. Keep the hero morph, but restore normal document-flow ownership. */
.cinematic-hero + .work-layers{
  margin-top:0;
  z-index:auto;
}
.cinematic-hero + .work-layers .section-shell{
  padding-top:clamp(2rem,4vw,4.5rem);
}

.work-layers{
  z-index:0;
}
.work-layers .section-shell{
  min-height:100svh;
  display:grid;
  align-content:center;
  box-sizing:border-box;
}

.work-layers + .metrics-section{
  position:relative;
  z-index:1;
}
.metrics-section{
  min-height:100svh;
  display:grid;
  align-content:center;
  box-sizing:border-box;
  padding-top:clamp(5rem,9svh,8rem);
  padding-bottom:clamp(4rem,8svh,7rem);
  overflow:hidden;
}

/* Short desktop windows need normal top alignment rather than compressed
   vertical centering. Content can extend naturally without overlapping the
   adjacent section. */
@media (min-width:64rem) and (max-height:46rem){
  .work-layers .section-shell,
  .metrics-section{
    align-content:start;
  }
  .work-layers .section-shell{
    padding-top:clamp(3rem,7svh,4.5rem);
    padding-bottom:clamp(3.5rem,8svh,5rem);
  }
  .metrics-section{
    padding-top:clamp(4.5rem,8svh,6rem);
    padding-bottom:clamp(3.5rem,7svh,5rem);
  }
}

@media (max-width:63.99rem){
  .cinematic-hero + .work-layers{
    margin-top:0;
  }
  .cinematic-hero + .work-layers .section-shell{
    padding-top:clamp(2.25rem,7vw,4rem);
  }
  .work-layers .section-shell,
  .metrics-section{
    min-height:100svh;
    align-content:start;
  }
}

@media (max-width:47.99rem){
  main > section[data-home-section]{
    min-height:100svh;
  }
  .cinematic-hero + .work-layers .section-shell{
    padding-top:clamp(2rem,9vw,3.25rem);
  }
  .metrics-section{
    padding-top:clamp(4.5rem,18vw,6rem);
    padding-bottom:clamp(4rem,16vw,5.5rem);
    overflow:clip;
  }
}


/* ---- Phase 34: contact typewriter + rounded responsive media ------------
   Contact now reuses the same keystroke reveal language as Work Layers.
   The previous black/green highlight slab is intentionally removed: the
   temporal reveal supplies emphasis without creating a competing card. */
.contact-editorial__hero--media{
  overflow:hidden;
  border-radius:clamp(1.25rem,2.25vw,2.75rem);
  clip-path:inset(0 round clamp(1.25rem,2.25vw,2.75rem));
  -webkit-clip-path:inset(0 round clamp(1.25rem,2.25vw,2.75rem));
  transform:translateZ(0);
}
.contact-editorial__media-asset{
  border-radius:inherit;
}
.contact-editorial__typewriter{
  position:relative;
  max-width:15ch!important;
  min-height:3.8em;
  margin:0;
  padding:0!important;
  color:#050505!important;
  background:transparent!important;
  box-shadow:none!important;
  border-radius:0!important;
  font-size:clamp(3rem,5.25vw,6.4rem)!important;
  line-height:.91!important;
  letter-spacing:-.065em!important;
  text-wrap:balance;
  overflow-wrap:normal;
  word-break:normal;
}
.contact-editorial__headline-highlight{
  display:contents;
  padding:0;
  color:inherit;
  background:transparent;
  box-shadow:none;
  border-radius:0;
}
.contact-editorial__cursor{
  display:none;
  width:.055em;
  height:.86em;
  margin-left:.07em;
  vertical-align:-.06em;
  background:currentColor;
}
.contact-editorial__typewriter[data-typewriter-active] .contact-editorial__cursor{
  display:inline-block;
  animation:contact-typewriter-caret .72s steps(1,end) infinite;
}
.contact-editorial__typewriter[data-typewriter-complete] .contact-editorial__cursor{display:none}
@keyframes contact-typewriter-caret{0%,46%{opacity:1}47%,100%{opacity:0}}

@media (max-width:54rem){
  .contact-editorial__hero--media{
    border-radius:clamp(1.15rem,3.5vw,2rem);
    clip-path:inset(0 round clamp(1.15rem,3.5vw,2rem));
    -webkit-clip-path:inset(0 round clamp(1.15rem,3.5vw,2rem));
  }
  .contact-editorial__typewriter{
    max-width:16ch!important;
    min-height:3.25em;
    font-size:clamp(2.65rem,8.7vw,5.1rem)!important;
  }
}

@media (max-width:39.99rem){
  .contact-editorial__hero--media{
    border-radius:clamp(1rem,5vw,1.5rem);
    clip-path:inset(0 round clamp(1rem,5vw,1.5rem));
    -webkit-clip-path:inset(0 round clamp(1rem,5vw,1.5rem));
  }
  .contact-editorial__typewriter{
    max-width:11ch!important;
    min-height:4.6em;
    font-size:clamp(2.35rem,11.8vw,4rem)!important;
    line-height:.94!important;
    letter-spacing:-.058em!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .contact-editorial__cursor{display:none!important;animation:none!important}
}


/* Phase 14 hotfix: canonical multidisciplinary homepage styles. */
/* Phase 14: multidisciplinary homepage */
.identity-bento,.music-preview,.growth-bento{padding-block:clamp(5rem,11vw,10rem)}
.identity-bento__header{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(18rem,.8fr);gap:2rem;align-items:end;margin-bottom:2rem}.identity-bento__header .section-kicker{grid-column:1/-1}.identity-bento__header h2{margin:0;max-width:15ch;font-size:clamp(3rem,7vw,7rem);letter-spacing:-.07em;line-height:.9}.identity-bento__header>p:last-child{margin:0;color:var(--paper-muted);max-width:42rem}
.identity-bento__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:.35rem}.identity-card{position:relative;display:grid;align-content:space-between;gap:1.25rem;min-height:18rem;padding:clamp(1.25rem,2.5vw,2.2rem);overflow:hidden;border:1px solid var(--line);border-radius:1.2rem;background:#121212}.identity-card--primary{grid-column:span 7;min-height:34rem;background:linear-gradient(145deg,#101a12,#111)}.identity-card--media{grid-column:span 5;padding:0}.identity-card--music{grid-column:span 4}.identity-card--photo{grid-column:span 4}.identity-card--approach{grid-column:span 4}.identity-card h3{margin:0;font-size:clamp(2rem,4.8vw,5.4rem);letter-spacing:-.065em;line-height:.92}.identity-card p{margin:0;color:var(--paper-muted)}.identity-card a{width:max-content;color:var(--accent);font-weight:750}.identity-card__eyebrow{font-size:.72rem!important;letter-spacing:.12em;text-transform:uppercase}.identity-tags{display:flex;flex-wrap:wrap;gap:.45rem;margin:0;padding:0;list-style:none}.identity-tags li{padding:.5rem .7rem;border:1px solid var(--line);border-radius:999px;font-size:.75rem}.identity-card__asset{width:100%;height:100%;object-fit:cover}.identity-card__placeholder{display:grid;place-content:center;gap:.5rem;width:100%;height:100%;min-height:34rem;background:radial-gradient(circle at 65% 30%,rgba(55,218,55,.26),transparent 34%),linear-gradient(145deg,#222,#0d0d0d);text-align:center}.identity-card__placeholder span{font-size:clamp(5rem,12vw,11rem);font-weight:800;letter-spacing:-.1em}.identity-card__placeholder small{color:var(--paper-muted)}
.music-preview{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(3rem,8vw,9rem);align-items:start}.music-preview__copy h2{margin:0 0 1.5rem;font-size:clamp(3rem,7vw,7rem);letter-spacing:-.07em;line-height:.9}.music-preview__copy>p:not(.section-kicker){max-width:42rem;color:var(--paper-muted)}.music-preview__timeline{border-top:1px solid var(--line)}.music-preview__timeline article{display:grid;grid-template-columns:3rem minmax(0,1fr);gap:.4rem 1rem;padding:1.7rem 0;border-bottom:1px solid var(--line)}.music-preview__timeline span{grid-row:1/3;color:var(--muted);font-size:1.5rem}.music-preview__timeline h3,.music-preview__timeline p{margin:0}.music-preview__timeline h3{font-size:clamp(1.7rem,3vw,3.2rem);letter-spacing:-.05em}.music-preview__timeline p{color:var(--paper-muted)}
.gallery-preview{padding-block:clamp(5rem,10vw,9rem);overflow:hidden}.gallery-preview__header{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:end;margin-bottom:3rem}.gallery-preview__header .section-kicker{grid-column:1/-1}.gallery-preview__header h2{margin:0;max-width:15ch;font-size:clamp(3rem,7vw,7rem);letter-spacing:-.07em;line-height:.9}.gallery-preview__header>p:last-child{color:var(--paper-muted)}.gallery-ribbon{display:flex;gap:.8rem;width:max-content;margin:0 0 3rem 50%;transform:translateX(-50%);perspective:80rem}.gallery-ribbon figure{width:clamp(11rem,18vw,21rem);margin:0;overflow:hidden;border-radius:1rem;transform:rotateY(var(--ry,0deg)) translateY(var(--ty,0))}.gallery-ribbon figure:nth-child(1){--ry:18deg;--ty:2rem}.gallery-ribbon figure:nth-child(2){--ry:10deg;--ty:.7rem}.gallery-ribbon figure:nth-child(4){--ry:-10deg;--ty:.7rem}.gallery-ribbon figure:nth-child(5){--ry:-18deg;--ty:2rem}.gallery-ribbon img{width:100%;aspect-ratio:3/4;object-fit:cover}
.growth-bento__header{display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:end;margin-bottom:2rem}.growth-bento__header .section-kicker{grid-column:1/-1}.growth-bento__header h2{margin:0;font-size:clamp(3rem,7vw,7rem);letter-spacing:-.07em;line-height:.9}.growth-bento__header>p:last-child{color:var(--paper-muted)}.growth-bento__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:.35rem}.growth-card{display:grid;align-content:space-between;gap:1rem;min-height:19rem;padding:clamp(1.2rem,2.3vw,2rem);border:1px solid var(--line);border-radius:1.15rem;background:#121212}.growth-card--1,.growth-card--2{grid-column:span 4}.growth-card--story{grid-column:span 4;grid-row:span 2;padding:0;overflow:hidden}.growth-card--3{grid-column:span 5}.growth-card--4{grid-column:span 4}.growth-card--cta{grid-column:span 3;background:var(--paper);color:var(--ink)}.growth-card__value{display:flex;align-items:flex-start;margin:0;color:var(--accent);font-size:clamp(4rem,8vw,8rem);font-weight:800;letter-spacing:-.08em;line-height:.8}.growth-card__value span{font-size:.32em;letter-spacing:-.03em}.growth-card h3,.growth-card>p{margin:0}.growth-card>p:last-child{color:var(--paper-muted)}.growth-card--cta>p{color:var(--ink)}.growth-card--cta a{font-weight:800}.growth-card__media{width:100%;height:100%;object-fit:cover}.growth-card__story-copy{display:grid;align-content:end;gap:1rem;height:100%;min-height:38.35rem;padding:2rem;background:radial-gradient(circle at 70% 25%,rgba(55,218,55,.38),transparent 30%),linear-gradient(150deg,#212121,#080808)}.growth-card__story-copy strong{font-size:clamp(2rem,4vw,4.7rem);letter-spacing:-.06em;line-height:.92}
.creative-story{display:grid;border-top:1px solid var(--line)}.creative-story article{display:grid;grid-template-columns:4rem minmax(0,.7fr) minmax(0,1fr);gap:2rem;padding:2.4rem 0;border-bottom:1px solid var(--line)}.creative-story h2,.creative-story p{margin:0}.creative-story h2{font-size:clamp(2rem,5vw,5rem);letter-spacing:-.06em}.creative-story p{color:var(--paper-muted)}.gallery-page-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1rem}.gallery-page-grid figure{grid-column:span 4;margin:0;overflow:hidden;border-radius:1rem}.gallery-page-grid figure:nth-child(2),.gallery-page-grid figure:nth-child(4){transform:translateY(4rem)}.gallery-page-grid img{width:100%;aspect-ratio:3/4;object-fit:cover}
@media(max-width:64rem){.identity-bento__header,.gallery-preview__header,.growth-bento__header,.music-preview{grid-template-columns:1fr}.identity-card--primary,.identity-card--media{grid-column:span 12}.identity-card--music,.identity-card--photo,.identity-card--approach{grid-column:span 4}.growth-card--1,.growth-card--2,.growth-card--story,.growth-card--3,.growth-card--4,.growth-card--cta{grid-column:span 6}.growth-card__story-copy{min-height:19rem}}
@media(max-width:47.99rem){.identity-bento__grid,.growth-bento__grid{display:block}.identity-card,.growth-card{min-height:auto;margin-bottom:.5rem}.identity-card--primary{min-height:30rem}.identity-card__placeholder{min-height:28rem}.gallery-ribbon{width:100%;margin-left:0;padding-inline:1rem;overflow-x:auto;scroll-snap-type:x mandatory;transform:none;perspective:none}.gallery-ribbon figure{flex:0 0 78vw;transform:none!important;scroll-snap-align:center}.creative-story article{grid-template-columns:2.5rem 1fr}.creative-story p{grid-column:2}.gallery-page-grid{grid-template-columns:1fr}.gallery-page-grid figure{grid-column:auto!important;transform:none!important}.growth-card__story-copy{min-height:24rem}}
@media(prefers-reduced-motion:reduce){.gallery-ribbon figure{transform:none!important}}

/* Phase 14 visibility fail-open: new content must never depend on motion runtime. */
html.motion-pending .identity-bento [data-reveal],
html.motion-pending .identity-bento [data-reveal-child],
html.motion-pending .music-preview [data-reveal],
html.motion-pending .music-preview [data-reveal-child],
html.motion-pending .gallery-preview [data-reveal],
html.motion-pending .gallery-preview [data-reveal-child],
html.motion-pending .growth-bento [data-reveal],
html.motion-pending .growth-bento [data-reveal-child],
html.motion-failed .identity-bento [data-reveal],
html.motion-failed .identity-bento [data-reveal-child],
html.motion-failed .music-preview [data-reveal],
html.motion-failed .music-preview [data-reveal-child],
html.motion-failed .gallery-preview [data-reveal],
html.motion-failed .gallery-preview [data-reveal-child],
html.motion-failed .growth-bento [data-reveal],
html.motion-failed .growth-bento [data-reveal-child]{
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
  filter:none!important;
}

.identity-bento,.music-preview,.gallery-preview,.growth-bento{
  position:relative;
  z-index:1;
  color:var(--paper);
  background:var(--ink);
}

/* Phase 15: full-width editorial composition and layout stabilization. */
main > section.identity-bento,
main > section.music-preview,
main > section.growth-bento{
  width:min(calc(100% - clamp(2rem,5vw,6rem)),108rem);
  min-height:0;
  margin-inline:auto;
  padding-block:clamp(5rem,9vw,9rem);
  background:#070707;
  box-shadow:0 0 0 100vmax #070707;
  clip-path:inset(0 -100vmax);
}
main > section.gallery-preview{
  min-height:0;
}
.identity-bento__header,
.growth-bento__header{
  grid-template-columns:minmax(0,1.35fr) minmax(20rem,.65fr);
  gap:clamp(2rem,6vw,7rem);
  margin-bottom:clamp(2rem,4vw,4rem);
}
.identity-bento__header h2,
.growth-bento__header h2,
.music-preview__copy h2,
.gallery-preview__header h2{
  font-size:clamp(3rem,6vw,6.4rem);
  line-height:.91;
  max-width:14ch;
}
.identity-bento__grid{gap:.75rem}
.identity-card{border-radius:1.35rem;min-height:22rem;padding:clamp(1.5rem,2.5vw,2.75rem)}
.identity-card--primary{grid-column:span 8;min-height:34rem}
.identity-card--media{grid-column:span 4}
.identity-card--music,.identity-card--photo,.identity-card--approach{grid-column:span 4;min-height:24rem}
.identity-card h3{font-size:clamp(2.4rem,4.3vw,5rem)}
.identity-card--primary h3{max-width:14ch}
.identity-card--approach strong{font-size:clamp(1.6rem,2.2vw,2.6rem);line-height:1}

.music-preview{
  grid-template-columns:minmax(0,1fr) minmax(30rem,.9fr);
  gap:clamp(4rem,9vw,10rem);
}
.music-preview__copy{position:sticky;top:clamp(6rem,12vh,9rem)}
.music-preview__timeline article{padding:2.25rem 0}

.growth-bento__grid{gap:.75rem}
.growth-card{min-height:20rem;border-radius:1.35rem}
.growth-card--1,.growth-card--2,.growth-card--3,.growth-card--4{grid-column:span 3}
.growth-card--story{grid-column:span 8;grid-row:auto;min-height:34rem}
.growth-card--cta{grid-column:span 4;min-height:34rem}
.growth-card__story-copy{min-height:34rem}
.growth-card__value{font-size:clamp(4.2rem,7vw,7.6rem)}

@media (max-width:64rem){
  main > section.identity-bento,
  main > section.music-preview,
  main > section.growth-bento{width:min(calc(100% - 2rem),68rem)}
  .identity-bento__header,.growth-bento__header,.music-preview{grid-template-columns:1fr}
  .music-preview__copy{position:static}
  .identity-card--primary,.identity-card--media{grid-column:span 12}
  .identity-card--music,.identity-card--photo,.identity-card--approach{grid-column:span 4}
  .growth-card--1,.growth-card--2,.growth-card--3,.growth-card--4{grid-column:span 6}
  .growth-card--story{grid-column:span 7}
  .growth-card--cta{grid-column:span 5}
}
@media (max-width:47.99rem){
  main > section.identity-bento,
  main > section.music-preview,
  main > section.growth-bento{width:calc(100% - 1.25rem);padding-block:clamp(4rem,16vw,6rem)}
  .identity-bento__header h2,.growth-bento__header h2,.music-preview__copy h2,.gallery-preview__header h2{font-size:clamp(2.65rem,12vw,4.6rem)}
  .identity-card{min-height:auto;padding:1.35rem}
  .identity-card--primary{min-height:30rem}
  .identity-card--music,.identity-card--photo,.identity-card--approach{min-height:20rem}
  .growth-card{min-height:18rem;margin-bottom:.75rem}
  .growth-card--story,.growth-card--cta{min-height:24rem}
  .growth-card__story-copy{min-height:24rem}
}

/* Banner remains rectangular throughout scroll; no oval morph. */
.cinematic-hero__surface,
.cinematic-hero__media,
.cinematic-hero__grade,
.cinematic-hero__motion-lines{
  border-radius:0!important;
  clip-path:none!important;
  -webkit-clip-path:none!important;
}

/* Phase 16: viewport-scale editorial sections and static rectangular hero. */
:root{--home-content-max:92rem;--home-gutter:clamp(1.25rem,4vw,4.5rem)}

/* Every major homepage chapter gets its own readable visual frame. */
main > section.identity-bento,
main > section.music-preview,
main > section.growth-bento,
main > section.work-section,
main > section.notes-section,
main > section.home-editorial{
  width:min(calc(100% - (var(--home-gutter) * 2)),var(--home-content-max));
  min-height:min(58rem,92svh);
  margin-inline:auto;
  padding-block:clamp(5.5rem,9vh,8.5rem);
  align-content:center;
}
main > section.identity-bento,
main > section.growth-bento,
main > section.work-section,
main > section.notes-section,
main > section.home-editorial{
  background:#070707;
  box-shadow:0 0 0 100vmax #070707;
  clip-path:inset(0 -100vmax);
}
main > section.identity-bento,
main > section.music-preview,
main > section.gallery-preview,
main > section.growth-bento,
main > section.work-layers,
main > section.work-section,
main > section.contact-editorial{
  border-top:1px solid rgba(255,255,255,.08);
}

.identity-bento__header,
.growth-bento__header,
.gallery-preview__header{
  margin-bottom:clamp(2.25rem,5vh,4.5rem);
}
.identity-bento__header h2,
.growth-bento__header h2,
.music-preview__copy h2,
.gallery-preview__header h2,
.work-section .section-heading h2{
  text-wrap:balance;
}
.identity-bento__grid,
.growth-bento__grid{gap:clamp(.65rem,1vw,1rem)}
.identity-card,.growth-card{border-radius:clamp(.9rem,1.2vw,1.35rem)}
.identity-card--primary{min-height:clamp(28rem,47vh,38rem)}
.identity-card--media,.identity-card__placeholder{min-height:clamp(28rem,47vh,38rem)}
.identity-card--music,.identity-card--photo,.identity-card--approach{min-height:clamp(19rem,31vh,25rem)}

.music-preview{align-items:center}
.music-preview__copy{position:static}
.music-preview__timeline article{min-height:9rem;align-content:center}

.gallery-preview{
  min-height:min(58rem,92svh);
  display:grid;
  align-content:center;
  padding-block:clamp(5.5rem,9vh,8.5rem);
}
.gallery-preview > .section-shell{width:min(calc(100% - (var(--home-gutter) * 2)),var(--home-content-max));margin-inline:auto}
.gallery-ribbon{margin-bottom:clamp(2rem,5vh,4rem)}

.growth-card{min-height:clamp(18rem,29vh,23rem)}
.growth-card--story,.growth-card--cta,.growth-card__story-copy{min-height:clamp(28rem,46vh,36rem)}

/* Work layers already has a strong internal composition; enlarge its frame without
   stretching the cards beyond readable line lengths. */
.work-layers{min-height:min(58rem,92svh);display:grid;align-content:center;padding-block:clamp(5rem,8vh,8rem)}
.work-layers .section-shell{width:min(calc(100% - (var(--home-gutter) * 2)),var(--home-content-max));margin-inline:auto}

/* The hero is now a normal document-flow section. No scale, pin, translation,
   clipping or rounded-corner morph is allowed on desktop, tablet or mobile. */
.cinematic-hero{position:relative!important;min-height:100svh!important;overflow:hidden!important}
.cinematic-hero__surface,
.cinematic-hero__media,
.cinematic-hero__video,
.cinematic-hero__poster,
.cinematic-hero__grade,
.cinematic-hero__motion-lines{
  transform:none!important;
  translate:none!important;
  scale:1!important;
  border-radius:0!important;
  clip-path:none!important;
  -webkit-clip-path:none!important;
}
html[data-hero-motion-active] .cinematic-hero__surface,
html[data-hero-motion-active] .cinematic-hero__media{transform:none!important;border-radius:0!important}

@media (max-width:64rem){
  main > section.identity-bento,
  main > section.music-preview,
  main > section.growth-bento,
  main > section.work-section,
  main > section.notes-section,
  main > section.home-editorial{
    width:min(calc(100% - 2rem),68rem);
    min-height:auto;
    padding-block:clamp(4.5rem,10vw,7rem);
  }
  .gallery-preview,.work-layers{min-height:auto;padding-block:clamp(4.5rem,10vw,7rem)}
  .identity-card--music,.identity-card--photo,.identity-card--approach{min-height:21rem}
}

@media (max-width:47.99rem){
  :root{--home-gutter:.875rem}
  main > section.identity-bento,
  main > section.music-preview,
  main > section.growth-bento,
  main > section.work-section,
  main > section.notes-section,
  main > section.home-editorial{
    width:calc(100% - 1.25rem);
    padding-block:clamp(4rem,18vw,6rem);
  }
  .gallery-preview,.work-layers{padding-block:clamp(4rem,18vw,6rem)}
  .identity-bento__header,.growth-bento__header,.gallery-preview__header{margin-bottom:2rem}
  .identity-card--primary,.identity-card--media,.identity-card__placeholder{min-height:27rem}
  .identity-card--music,.identity-card--photo,.identity-card--approach{min-height:18rem}
  .music-preview__timeline article{min-height:0;padding-block:1.5rem}
  .growth-card,.growth-card--story,.growth-card--cta,.growth-card__story-copy{min-height:auto}
  .cinematic-hero{min-height:100svh!important}
}


/* Phase 27.2 — compact personal identity composition.
   Desktop density is reduced by roughly 30% so the entire bento narrative
   remains visible without clipping. Tablet and mobile retain natural flow. */
.identity-bento__header{
  grid-template-columns:minmax(0,1fr)!important;
  gap:0!important;
  align-items:start!important;
}
.identity-bento__header h2{
  width:100%;
  max-width:none!important;
  text-wrap:balance;
}

@media (min-width:64.01rem){
  main > section.identity-bento{
    width:min(calc(100% - clamp(2rem,5vw,5rem)),92rem);
    min-height:100svh;
    padding-top:clamp(3.6rem,5.4vh,4.8rem);
    padding-bottom:clamp(.8rem,1.5vh,1.25rem);
  }
  .identity-bento__header{
    margin-bottom:clamp(.75rem,1.4vh,1.1rem)!important;
  }
  .identity-bento__header h2{
    font-size:clamp(3.15rem,5.45vw,6.1rem)!important;
    line-height:.88!important;
    letter-spacing:-.065em;
  }
  .identity-bento__grid{
    gap:.5rem!important;
    grid-template-rows:minmax(18rem,1.32fr) minmax(12rem,.88fr)!important;
  }
  .identity-card{
    min-height:0!important;
    padding:clamp(.85rem,1.2vw,1.3rem)!important;
    gap:clamp(.5rem,.9vh,.75rem)!important;
    border-radius:.95rem!important;
  }
  .identity-card--primary{grid-column:span 8!important}
  .identity-card--media{grid-column:span 4!important;padding:0!important}
  .identity-card--music,.identity-card--photo,.identity-card--approach{
    grid-column:span 4!important;
    min-height:0!important;
  }
  .identity-card h3{
    font-size:clamp(1.7rem,2.75vw,3.35rem)!important;
    line-height:.92!important;
  }
  .identity-card--primary h3{
    font-size:clamp(2rem,3.05vw,3.7rem)!important;
    max-width:15ch;
  }
  .identity-card--approach strong{
    font-size:clamp(1.25rem,1.65vw,1.9rem)!important;
    line-height:1.02;
  }
  .identity-card p{
    font-size:clamp(.7rem,.67vw,.82rem)!important;
    line-height:1.38!important;
  }
  .identity-card__eyebrow{font-size:.56rem!important}
  .identity-tags{gap:.28rem!important}
  .identity-tags li{
    padding:.28rem .45rem!important;
    font-size:.56rem!important;
  }
  .identity-card__placeholder{min-height:0!important}
  .identity-card__asset{object-position:center 35%}
}

@media (min-width:64.01rem) and (max-height:50rem){
  main > section.identity-bento{
    padding-top:clamp(3.25rem,4.5vh,4rem);
  }
  .identity-bento__header h2{
    font-size:clamp(2.8rem,4.8vw,5.2rem)!important;
  }
  .identity-bento__grid{
    grid-template-rows:minmax(15rem,1.25fr) minmax(10rem,.82fr)!important;
  }
}

@media (max-width:64rem){
  .identity-bento__header h2{
    width:100%;
    max-width:none!important;
    font-size:clamp(2.8rem,9vw,5.4rem)!important;
    line-height:.9!important;
  }
}

@media (max-width:47.99rem){
  main > section.identity-bento{
    padding-top:clamp(3.5rem,13vw,5rem);
    padding-bottom:clamp(3rem,10vw,4.5rem);
  }
  .identity-bento__header{margin-bottom:1.25rem!important}
  .identity-bento__header h2{
    font-size:clamp(2.45rem,12.3vw,4.35rem)!important;
    line-height:.91!important;
    text-wrap:pretty;
  }
  .identity-card{
    padding:clamp(1.1rem,5vw,1.45rem)!important;
    border-radius:1rem!important;
  }
  .identity-card--primary{min-height:25rem!important}
  .identity-card--media,.identity-card__placeholder{min-height:23rem!important}
  .identity-card--music,.identity-card--photo,.identity-card--approach{min-height:16rem!important}
  .identity-card h3{font-size:clamp(2rem,11vw,3.4rem)!important}
  .identity-card--primary h3{font-size:clamp(2.2rem,11.5vw,3.65rem)!important}
}


/* Phase 27.3 — music journey now matches the light editorial surface used in
   the work-layers section, and the timeline is simplified to two stages. */
main > section.music-preview{
  --music-bg:#ededea;
  --music-surface:#fafaf7;
  --music-ink:#090909;
  --music-muted:#3f403b;
  --music-accent:#04551b;
  --music-line:rgba(9,9,9,.16);
  --music-line-strong:rgba(9,9,9,.28);
  color:var(--music-ink);
  background:var(--music-bg);
  box-shadow:0 0 0 100vmax var(--music-bg);
  clip-path:inset(0 -100vmax);
  border-top:1px solid rgba(9,9,9,.08);
}
.music-preview .section-kicker{color:var(--music-accent)}
.music-preview .section-kicker::before{background:var(--music-line-strong)}
.music-preview__copy h2,
.music-preview__timeline h3{color:var(--music-ink)}
.music-preview__copy > p:not(.section-kicker),
.music-preview__timeline p,
.music-preview__timeline span{color:var(--music-muted)}
.music-preview__timeline{border-top-color:var(--music-line)}
.music-preview__timeline article{border-bottom-color:var(--music-line)}
.music-preview .arrow-link{
  color:var(--music-ink);
  border-bottom-color:var(--music-line-strong);
}
.music-preview .arrow-link:hover,
.music-preview .arrow-link:focus-visible{border-bottom-color:var(--music-ink)}

@media (max-width:64rem){
  main > section.music-preview{
    box-shadow:0 0 0 100vmax var(--music-bg);
  }
}

/* Phase 27.4 — full-slide music journey with progressive scroll narrative. */
main > section.music-preview{
  --music-glow-x:28%;
  position:relative;
  isolation:isolate;
  min-height:100svh;
  padding-block:clamp(7rem,14vh,11rem);
  align-content:center;
  overflow:hidden;
  overflow:clip;
}
main > section.music-preview::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-18%;
  pointer-events:none;
  background:
    radial-gradient(circle at var(--music-glow-x) 42%,rgba(4,85,27,.085),transparent 28%),
    linear-gradient(115deg,rgba(255,255,255,.34),transparent 34% 68%,rgba(0,0,0,.025));
}
main > section.music-preview::after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  opacity:.22;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}
.music-preview__copy{align-self:center}
.music-preview__copy h2{max-width:10ch}
.music-preview__timeline{
  position:relative;
  align-self:center;
  padding-left:clamp(1rem,2vw,2rem);
}
.music-preview__timeline article{
  position:relative;
  min-height:clamp(10rem,18vh,13rem);
  padding:clamp(2rem,4vh,3rem) clamp(1rem,2vw,2rem);
  border-bottom-color:var(--music-line);
  transition:opacity .45s ease,transform .45s cubic-bezier(.22,1,.36,1),background-color .45s ease;
}
.music-preview__timeline article::before{
  content:"";
  position:absolute;
  inset:.75rem 0;
  z-index:-1;
  border-radius:1rem;
  background:rgba(255,255,255,0);
  box-shadow:0 0 0 1px rgba(9,9,9,0);
  transition:background-color .45s ease,box-shadow .45s ease;
}
.music-preview__timeline article:not(.is-active){opacity:.5;transform:translateX(.75rem)}
.music-preview__timeline article.is-active{opacity:1;transform:translateX(0)}
.music-preview__timeline article.is-active::before{
  background:rgba(250,250,247,.62);
  box-shadow:0 0 0 1px rgba(9,9,9,.08),0 1.25rem 3rem rgba(9,9,9,.055);
}
.music-preview__timeline h3{transition:transform .45s cubic-bezier(.22,1,.36,1)}
.music-preview__timeline article.is-active h3{transform:translateX(.2rem)}
.music-preview__progress{
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  width:2px;
  overflow:hidden;
  background:rgba(9,9,9,.12);
}
.music-preview__progress i{
  display:block;
  width:100%;
  height:100%;
  transform:scaleY(0);
  transform-origin:top;
  background:var(--music-accent);
  will-change:transform;
}
.music-preview .arrow-link{position:relative}
.music-preview .arrow-link::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:1px;
  transform:scaleX(0);
  transform-origin:left;
  background:var(--music-ink);
  transition:transform .35s cubic-bezier(.22,1,.36,1);
}
.music-preview .arrow-link:hover::after,
.music-preview .arrow-link:focus-visible::after{transform:scaleX(1)}

@media (min-width:64.01rem){
  main > section.music-preview{
    grid-template-columns:minmax(0,.94fr) minmax(30rem,1.06fr);
    gap:clamp(5rem,10vw,11rem);
  }
  .music-preview__copy{
    position:sticky;
    top:50%;
    transform:translateY(-50%);
  }
}

@media (max-width:64rem){
  main > section.music-preview{
    min-height:auto;
    padding-block:clamp(6rem,12vw,8rem);
    gap:clamp(3.5rem,8vw,5rem);
  }
  .music-preview__copy{position:static;transform:none}
  .music-preview__timeline{padding-left:1rem}
}

@media (max-width:47.99rem){
  main > section.music-preview{
    width:100%;
    padding:clamp(5rem,18vw,7rem) 1rem;
  }
  main > section.music-preview::before{inset:-5%}
  .music-preview__copy h2{max-width:9ch}
  .music-preview__timeline article{
    grid-template-columns:2.5rem minmax(0,1fr);
    min-height:0;
    padding:1.6rem .75rem;
  }
  .music-preview__timeline article:not(.is-active){opacity:.72;transform:none}
  .music-preview__timeline article::before{inset:.45rem 0}
}

@media (prefers-reduced-motion:reduce){
  main > section.music-preview::before{background:none}
  .music-preview__timeline article,
  .music-preview__timeline h3,
  .music-preview__progress i{transition:none!important;transform:none!important;opacity:1!important}
}

/* ---- Phase 28: compact homepage project index ---------------------------
   A reduced editorial index for the homepage. The full /projects page keeps
   its existing, more spacious list treatment. */
.home-projects{
  background:var(--ink);
  color:var(--paper);
}
.home-projects__inner{
  padding-block:clamp(4.5rem,8vw,8rem);
}
.home-projects__header{
  display:grid;
  gap:clamp(1.35rem,3vw,2.5rem);
  margin-bottom:clamp(2.25rem,5vw,4.5rem);
}
.home-projects__heading{
  display:grid;
  gap:1rem;
  max-width:48rem;
}
.home-projects__heading h2{
  font-size:clamp(3rem,7vw,6.5rem);
  line-height:.88;
  letter-spacing:-.065em;
}
.home-projects__heading p{
  max-width:42ch;
  color:var(--paper-muted);
  font-size:clamp(.98rem,.92rem + .25vw,1.15rem);
  line-height:1.55;
}
.home-projects__list{
  border-top:1px solid var(--line);
}
.home-project{
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:2.4rem minmax(0,1fr) auto;
  gap:clamp(1rem,2.5vw,2.5rem);
  align-items:center;
  min-height:clamp(8.25rem,12vw,10.5rem);
  padding-block:clamp(1.35rem,2.5vw,2rem);
  border-bottom:1px solid var(--line);
  overflow:hidden;
}
.home-project::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0 calc(var(--space-s) * -1);
  background:var(--ink-soft);
  opacity:0;
  transform:scaleY(.82);
  transform-origin:center;
  transition:opacity .35s var(--ease),transform .45s var(--ease-out);
}
.home-project__index{
  align-self:start;
  padding-top:.45rem;
  color:var(--paper-faint);
  font-size:var(--step--1);
  font-variant-numeric:tabular-nums;
  letter-spacing:.12em;
  transition:color .3s var(--ease);
}
.home-project__content{
  display:grid;
  gap:.55rem;
  min-width:0;
}
.home-project__meta{
  color:var(--paper-faint);
  font-size:clamp(.68rem,.65rem + .12vw,.78rem);
  font-weight:600;
  letter-spacing:.13em;
  line-height:1.35;
  text-transform:uppercase;
}
.home-project h3{
  max-width:20ch;
  font-size:clamp(1.75rem,2.7vw,3rem);
  line-height:.98;
}
.home-project h3 a{
  color:inherit;
  text-decoration:none;
}
.home-project h3 a::after{
  content:"";
  position:absolute;
  inset:0;
}
.home-project__summary{
  max-width:58ch;
  color:var(--paper-muted);
  font-size:clamp(.88rem,.84rem + .14vw,.98rem);
  line-height:1.5;
}
.home-project__action{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  min-height:2.6rem;
  padding:.65rem 1rem;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--paper-muted);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  transition:background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease);
}
.home-project__action i{
  font-style:normal;
  transition:transform .35s var(--ease-out);
}
.home-projects__footer{
  display:flex;
  justify-content:flex-end;
}
.home-projects__footer .arrow-link{
  grid-column:auto;
  margin-top:clamp(1.5rem,3vw,2.5rem);
}
@media (hover:hover) and (pointer:fine){
  .home-project:hover::before,
  .home-project:focus-within::before{opacity:1;transform:scaleY(1)}
  .home-project:hover .home-project__index,
  .home-project:focus-within .home-project__index{color:var(--accent)}
  .home-project:hover .home-project__action,
  .home-project:focus-within .home-project__action{background:var(--paper);border-color:var(--paper);color:var(--ink)}
  .home-project:hover .home-project__action i,
  .home-project:focus-within .home-project__action i{transform:translate(.2rem,-.2rem)}
}
@media (max-width:47.99rem){
  .home-projects__inner{width:min(100% - 2rem,84rem)}
  .home-projects__header{margin-bottom:2rem}
  .home-projects__heading h2{font-size:clamp(3rem,17vw,4.8rem)}
  .home-project{
    grid-template-columns:1.8rem minmax(0,1fr);
    gap:.85rem;
    min-height:0;
    padding-block:1.35rem;
  }
  .home-project__index{padding-top:.3rem}
  .home-project__content{gap:.5rem}
  .home-project h3{max-width:none;font-size:clamp(1.65rem,8vw,2.35rem)}
  .home-project__summary{
    display:-webkit-box;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
  }
  .home-project__action{
    grid-column:2;
    justify-self:start;
    min-height:auto;
    margin-top:.15rem;
    padding:.45rem .75rem;
    border-color:var(--line-strong);
  }
  .home-projects__footer{justify-content:flex-start}
}
@media (max-width:23rem){
  .home-projects__inner{width:min(100% - 1.25rem,84rem)}
  .home-project{grid-template-columns:1.5rem minmax(0,1fr)}
  .home-project__summary{-webkit-line-clamp:2}
  .home-project__action span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .home-project__action{width:2.25rem;height:2.25rem;justify-content:center;padding:0}
}
@media (prefers-reduced-motion:reduce){
  .home-project::before,.home-project__index,.home-project__action,.home-project__action i{transition:none}
}
@media (forced-colors:active){
  .home-projects__list,.home-project,.home-project__action{border-color:CanvasText}
}

/* Phase 30: menu video runtime */
.menu-panel__video{width:100%;height:100%;object-fit:cover;display:block;background:#080808}
@media (prefers-reduced-motion:reduce){.menu-panel__video{display:none}}

/* Phase 32 · Cinematic gallery hero + editorial archive cards */
body[data-page="gallery"]{background:#000;color:#fff}
body[data-page="gallery"] .site-header{mix-blend-mode:normal}
.gallery-experience{background:#000;overflow:clip}
.gallery-hero{position:relative;isolation:isolate;display:grid;place-items:center;min-height:100svh;overflow:hidden;background:#090909}
.gallery-hero__video{position:absolute;z-index:-4;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.035)}
.gallery-hero__veil{position:absolute;z-index:-3;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.18) 38%,rgba(0,0,0,.55)),linear-gradient(90deg,rgba(0,0,0,.35),transparent 28%,transparent 72%,rgba(0,0,0,.35))}
.gallery-hero__veil::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,transparent 0 24%,rgba(0,0,0,.5) 78%);pointer-events:none}
.gallery-hero__marquee{position:absolute;z-index:-1;inset:50% 0 auto;overflow:hidden;transform:translateY(-50%);white-space:nowrap;pointer-events:none}
.gallery-hero__track{display:flex;width:max-content;align-items:center;gap:clamp(1.1rem,2vw,2.3rem);animation:gallery-marquee 34s linear infinite;will-change:transform}
.gallery-hero__track span{font-size:clamp(5.2rem,11vw,13rem);font-weight:600;letter-spacing:-.075em;line-height:.82;color:#fff;text-shadow:0 .08em .35em rgba(0,0,0,.35)}
.gallery-hero__track i{font-size:clamp(1rem,1.7vw,2rem);font-style:normal;color:rgba(255,255,255,.7)}
@keyframes gallery-marquee{to{transform:translateX(-50%)}}
.gallery-hero__focus{position:relative;z-index:2;width:clamp(10.5rem,16vw,15rem);margin:0;transform:translateY(1.5vh);filter:drop-shadow(0 2rem 4rem rgba(0,0,0,.62))}
.gallery-hero__focus::before,.gallery-hero__focus::after{content:"";position:absolute;z-index:2;width:1rem;height:1rem;pointer-events:none}
.gallery-hero__focus::before{top:-.65rem;left:-.65rem;border-top:1px solid #fff;border-left:1px solid #fff}
.gallery-hero__focus::after{right:-.65rem;bottom:2.55rem;border-right:1px solid #fff;border-bottom:1px solid #fff}
.gallery-hero__focus img{display:block;width:100%;aspect-ratio:3/4.35;object-fit:cover;border-radius:.18rem;background:#151515}
.gallery-hero__focus figcaption{display:flex;justify-content:space-between;gap:1rem;margin-top:.8rem;padding-bottom:.55rem;border-bottom:1px solid rgba(255,255,255,.8);font-size:.62rem;line-height:1.2;text-transform:uppercase;letter-spacing:.09em}
.gallery-hero__focus figcaption span{color:rgba(255,255,255,.6)}
.gallery-hero__focus figcaption strong{font-weight:650;text-align:right}
.gallery-hero__scroll{position:absolute;right:clamp(1rem,3vw,3rem);bottom:clamp(1.25rem,3vw,2.5rem);display:grid;gap:.55rem;justify-items:end;color:rgba(255,255,255,.6);font-size:.6rem;font-weight:650;letter-spacing:.16em;text-transform:uppercase}
.gallery-hero__scroll i{display:block;width:clamp(4rem,8vw,8rem);height:1px;background:linear-gradient(90deg,transparent,#fff)}
.gallery-archive{width:min(100% - clamp(1.25rem,5vw,7rem),108rem);margin-inline:auto;padding:clamp(5rem,10vw,10rem) 0 clamp(6rem,10vw,10rem)}
.gallery-archive__header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:end;margin-bottom:clamp(2.5rem,6vw,5rem)}
.gallery-archive__header p,.gallery-archive__header span{font-size:.68rem;font-weight:650;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.gallery-archive__header h1{grid-column:1/-1;max-width:10ch;margin:0;font-size:clamp(3.6rem,8.5vw,9rem);font-weight:500;letter-spacing:-.07em;line-height:.84}
.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1rem,2vw,2rem);align-items:start}
.gallery-card{display:grid;gap:0;width:100%;padding:clamp(.72rem,1vw,1rem);border:0;border-radius:clamp(1rem,1.35vw,1.45rem);background:#f0f1f3;color:#101114;text-align:left;cursor:zoom-in;box-shadow:0 1rem 3rem rgba(0,0,0,.26);overflow:hidden;transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .55s cubic-bezier(.2,.8,.2,1)}
.gallery-card__media{position:relative;display:block;overflow:hidden;border-radius:clamp(.65rem,.9vw,.9rem);background:#151515}
.gallery-card--landscape .gallery-card__media{aspect-ratio:16/10}
.gallery-card--portrait .gallery-card__media{aspect-ratio:4/5}
.gallery-card__media img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.001);transition:filter .65s cubic-bezier(.2,.8,.2,1),transform .85s cubic-bezier(.2,.8,.2,1),opacity .65s cubic-bezier(.2,.8,.2,1)}
.gallery-card__corners{position:absolute;inset:0;pointer-events:none}
.gallery-card__corners i{position:absolute;width:.8rem;height:.8rem;border-color:#fff;border-style:solid;filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))}
.gallery-card__corners i:nth-child(1){top:1.15rem;left:1.15rem;border-width:2px 0 0 2px}
.gallery-card__corners i:nth-child(2){top:1.15rem;right:1.15rem;border-width:2px 2px 0 0}
.gallery-card__corners i:nth-child(3){right:1.15rem;bottom:1.15rem;border-width:0 2px 2px 0}
.gallery-card__corners i:nth-child(4){bottom:1.15rem;left:1.15rem;border-width:0 0 2px 2px}
.gallery-card__zoom{position:absolute;top:50%;left:50%;display:grid;place-items:center;width:clamp(4rem,6vw,5.5rem);aspect-ratio:1;border:1px solid rgba(255,255,255,.24);border-radius:50%;background:rgba(255,255,255,.24);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;transform:translate(-50%,-50%) scale(.78);transition:opacity .4s ease,transform .55s cubic-bezier(.2,.8,.2,1)}
.gallery-card__zoom i,.gallery-card__zoom b{position:absolute;width:1.35rem;height:2px;background:#fff;border-radius:2px}
.gallery-card__zoom b{transform:rotate(90deg)}
.gallery-card__details{display:flex;align-items:end;justify-content:space-between;gap:1rem;padding:.95rem .2rem .15rem}
.gallery-card__copy{display:grid;gap:.42rem;min-width:0}
.gallery-card__copy strong{overflow:hidden;font-size:clamp(1rem,1.25vw,1.3rem);font-weight:650;line-height:1.1;text-overflow:ellipsis;white-space:nowrap}
.gallery-card__copy small{font-size:.74rem;color:#a8acb2}
.gallery-card__category{flex:0 0 auto;padding:.66rem .9rem;border-radius:999px;background:#e1e4e8;font-size:clamp(.62rem,.67vw,.73rem);font-weight:650;white-space:nowrap}
.gallery-card:focus-visible{outline:3px solid #fff;outline-offset:5px}
.gallery-lightbox{position:fixed;inset:0;z-index:1200;display:grid;grid-template-columns:minmax(3rem,8vw) minmax(0,1fr) minmax(3rem,8vw);align-items:center;padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));visibility:hidden;opacity:0;pointer-events:none}
.gallery-lightbox[aria-hidden="false"]{visibility:visible;opacity:1;pointer-events:auto}
.gallery-lightbox__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.86);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.gallery-lightbox__figure{position:relative;z-index:1;grid-column:2;display:grid;place-items:center;gap:.75rem;max-width:100%;max-height:90svh;margin:0}
.gallery-lightbox__figure img{display:block;max-width:100%;max-height:84svh;width:auto;height:auto;object-fit:contain;filter:none}
.gallery-lightbox__figure figcaption{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.gallery-lightbox__close,.gallery-lightbox__nav{position:relative;z-index:2;border:1px solid rgba(255,255,255,.24);background:rgba(0,0,0,.32);color:#fff;backdrop-filter:blur(8px)}
.gallery-lightbox__close{position:absolute;top:max(1rem,env(safe-area-inset-top));right:max(1rem,env(safe-area-inset-right));width:3rem;height:3rem;border-radius:50%}
.gallery-lightbox__close span{position:absolute;left:50%;top:50%;width:1rem;height:1px;background:currentColor}.gallery-lightbox__close span:first-child{transform:translate(-50%,-50%) rotate(45deg)}.gallery-lightbox__close span:last-child{transform:translate(-50%,-50%) rotate(-45deg)}
.gallery-lightbox__nav{display:grid;place-items:center;width:3rem;height:3rem;border-radius:50%;font-size:1.15rem}.gallery-lightbox__nav--prev{grid-column:1}.gallery-lightbox__nav--next{grid-column:3}
body.gallery-lightbox-open{overflow:hidden}
@media (hover:hover) and (pointer:fine){.gallery-card:hover,.gallery-card:focus-visible{transform:translateY(-.35rem);box-shadow:0 1.8rem 4rem rgba(0,0,0,.4)}.gallery-card:hover .gallery-card__media img,.gallery-card:focus-visible .gallery-card__media img{filter:blur(7px) brightness(.58);transform:scale(1.035);opacity:.94}.gallery-card:hover .gallery-card__zoom,.gallery-card:focus-visible .gallery-card__zoom{opacity:1;transform:translate(-50%,-50%) scale(1)}.gallery-lightbox__close:hover,.gallery-lightbox__nav:hover{background:#fff;color:#000}}
@media (max-width:50rem){.gallery-grid{grid-template-columns:1fr}.gallery-card--portrait .gallery-card__media{aspect-ratio:4/5.2}.gallery-archive__header h1{font-size:clamp(3.5rem,14vw,6rem)}}
@media (max-width:38rem){.gallery-hero{min-height:92svh}.gallery-hero__video{transform:scale(1.08)}.gallery-hero__track{animation-duration:24s;gap:1rem}.gallery-hero__track span{font-size:clamp(4.6rem,22vw,7rem)}.gallery-hero__focus{width:min(40vw,10.25rem);transform:none}.gallery-hero__focus figcaption{font-size:.52rem;gap:.5rem}.gallery-hero__scroll{display:none}.gallery-archive{width:min(100% - 1rem,108rem);padding-top:4.5rem}.gallery-archive__header{grid-template-columns:1fr}.gallery-archive__header span{justify-self:start}.gallery-archive__header h1{grid-column:1;font-size:clamp(3.25rem,16vw,5rem)}.gallery-grid{gap:1rem}.gallery-card{padding:.65rem;border-radius:1rem}.gallery-card__details{padding:.82rem .05rem .05rem}.gallery-card__category{max-width:48%;overflow:hidden;text-overflow:ellipsis}.gallery-card__zoom{width:4rem}.gallery-lightbox{grid-template-columns:1fr;padding:4.5rem .75rem 4.5rem}.gallery-lightbox__figure{grid-column:1}.gallery-lightbox__nav{position:absolute;bottom:max(1rem,env(safe-area-inset-bottom))}.gallery-lightbox__nav--prev{left:1rem}.gallery-lightbox__nav--next{right:1rem}}
@media (prefers-reduced-motion:reduce){.gallery-hero__track{animation-play-state:paused}.gallery-hero__video{display:none}.gallery-card,.gallery-card__media img,.gallery-card__zoom,.gallery-lightbox{transition:none!important}.gallery-card{opacity:1!important;transform:none!important}}
@media (forced-colors:active){.gallery-card{border:2px solid CanvasText}.gallery-lightbox__close,.gallery-lightbox__nav{border-color:CanvasText}}


/* Phase 33 · Gallery lightbox/header isolation and mobile video fallback */
body.gallery-lightbox-open .site-header{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-.5rem);
}
.site-header{transition:opacity .22s ease,visibility .22s ease,transform .22s ease}
.gallery-hero__video{background:#0a0a0a center/cover no-repeat}
.gallery-hero.is-video-fallback .gallery-hero__video{opacity:.72}
@media (max-width:47.9375rem){
  .gallery-hero__video{transform:scale(1.02)}
  .gallery-lightbox__close{top:max(.75rem,env(safe-area-inset-top));right:max(.75rem,env(safe-area-inset-right));width:2.75rem;height:2.75rem}
}
.menu-panel__language a{min-width:2.8rem;min-height:2.8rem;display:inline-grid;place-items:center;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:inherit}.menu-panel__language a[aria-current="true"]{border-color:var(--line-strong);background:var(--paper);color:var(--ink)}


/* Phase 34 — premium identity-section scale, legibility and motion rhythm.
   Uses compositor-safe reveal properties only (transform + opacity). */
.identity-bento__header{
  row-gap:clamp(1rem,1.8vw,1.75rem)!important;
}
.identity-bento__header .section-kicker{
  margin-bottom:0!important;
}
.identity-card > p:not(.identity-card__eyebrow){
  max-width:72ch;
  font-size:clamp(.98rem,1.02vw,1.13rem)!important;
  line-height:1.62!important;
  letter-spacing:-.012em;
}
.identity-tags{
  gap:clamp(.42rem,.6vw,.65rem)!important;
}
.identity-tags li{
  padding:clamp(.48rem,.58vw,.66rem) clamp(.7rem,.85vw,.95rem)!important;
  font-size:clamp(.76rem,.72vw,.88rem)!important;
  line-height:1.1;
  letter-spacing:-.01em;
  background:rgba(255,255,255,.025);
}
.identity-card__eyebrow{
  font-size:clamp(.68rem,.62vw,.78rem)!important;
  line-height:1.25!important;
}

@media (min-width:64.01rem){
  main > section.identity-bento{
    width:min(calc(100% - clamp(2rem,5vw,5rem)),96rem)!important;
    min-height:112svh!important;
    padding-top:clamp(5rem,8vh,7.5rem)!important;
    padding-bottom:clamp(4rem,7vh,6.5rem)!important;
  }
  .identity-bento__header{
    margin-bottom:clamp(2rem,3.6vh,3.25rem)!important;
  }
  .identity-bento__header h2{
    font-size:clamp(3.4rem,5.55vw,6.35rem)!important;
  }
  .identity-bento__grid{
    grid-template-rows:minmax(22rem,1.35fr) minmax(15rem,.92fr)!important;
    gap:.7rem!important;
  }
  .identity-card{
    padding:clamp(1.45rem,1.8vw,2rem)!important;
    gap:clamp(.85rem,1.4vh,1.25rem)!important;
    border-radius:1.1rem!important;
  }
  .identity-card--primary{
    grid-column:span 8!important;
  }
  .identity-card--primary h3{
    max-width:19ch!important;
    font-size:clamp(2.5rem,3.45vw,4.25rem)!important;
    line-height:.91!important;
  }
  .identity-card--media{
    grid-column:span 4!important;
    padding:0!important;
  }
  .identity-card--music,.identity-card--photo,.identity-card--approach{
    min-height:15rem!important;
  }
  .identity-card h3{
    font-size:clamp(2.05rem,2.85vw,3.45rem)!important;
  }
  .identity-card--approach strong{
    font-size:clamp(1.55rem,1.95vw,2.25rem)!important;
    line-height:1.04!important;
  }
}

@media (min-width:64.01rem) and (max-height:50rem){
  main > section.identity-bento{
    min-height:118svh!important;
    padding-top:4.5rem!important;
    padding-bottom:4rem!important;
  }
  .identity-bento__grid{
    grid-template-rows:minmax(19rem,1.3fr) minmax(13rem,.9fr)!important;
  }
}

@media (min-width:48rem) and (max-width:64rem){
  main > section.identity-bento{
    padding-block:clamp(5rem,9vw,7rem)!important;
  }
  .identity-bento__header{
    margin-bottom:2rem!important;
  }
  .identity-card--primary{
    min-height:34rem!important;
  }
  .identity-card > p:not(.identity-card__eyebrow){
    font-size:clamp(1rem,1.7vw,1.12rem)!important;
  }
  .identity-tags li{
    font-size:clamp(.78rem,1.2vw,.88rem)!important;
  }
}

@media (max-width:47.99rem){
  main > section.identity-bento{
    padding-top:clamp(5rem,18vw,7rem)!important;
    padding-bottom:clamp(5rem,16vw,7rem)!important;
  }
  .identity-bento__header{
    row-gap:1rem!important;
    margin-bottom:clamp(2rem,8vw,3rem)!important;
  }
  .identity-card{
    gap:1.1rem!important;
    margin-bottom:.75rem!important;
  }
  .identity-card--primary{
    min-height:31rem!important;
  }
  .identity-card > p:not(.identity-card__eyebrow){
    font-size:clamp(.98rem,4vw,1.08rem)!important;
    line-height:1.58!important;
  }
  .identity-tags{
    gap:.45rem!important;
  }
  .identity-tags li{
    padding:.55rem .72rem!important;
    font-size:clamp(.75rem,3.2vw,.84rem)!important;
  }
  .identity-card__eyebrow{
    font-size:.7rem!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .identity-bento [data-reveal],
  .identity-bento [data-reveal-child]{
    opacity:1!important;
    transform:none!important;
    clip-path:none!important;
    -webkit-clip-path:none!important;
  }
}

/* Phase 35 — editorial identity system */
.identity-system{padding-block:clamp(5rem,9vw,9rem)}
.identity-system__grid{display:grid;grid-template-columns:minmax(13rem,.82fr) minmax(28rem,1.85fr) minmax(13rem,.82fr);grid-template-rows:minmax(10.5rem,auto) repeat(2,minmax(15rem,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line);background:#0a0a0a}
.identity-system__cell{position:relative;min-width:0;overflow:hidden;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#101010}
.identity-system__cell:after{content:"";position:absolute;inset:auto 0 0;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.22,1,.36,1)}
.identity-system__cell:hover:after{transform:scaleX(1)}
.identity-system__title{grid-column:2;grid-row:1;display:grid;place-content:center;padding:clamp(1.8rem,3vw,3.5rem);text-align:center;background:#090909}
.identity-system__title .section-kicker{margin:0 0 1rem;color:var(--accent)}
.identity-system__title h2{margin:0;font-size:clamp(3rem,6vw,7rem);line-height:.82;letter-spacing:-.075em;text-transform:uppercase;text-wrap:balance}
.identity-system__skill{display:flex;flex-direction:column;justify-content:space-between;gap:2rem;padding:clamp(1.35rem,2.3vw,2.6rem);transition:background-color .3s ease}
.identity-system__skill:hover{background:#131813}
.identity-system__index{font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;color:var(--paper-muted)}
.identity-system__skill h3{margin:0 0 .8rem;max-width:12ch;font-size:clamp(1.5rem,2vw,2.45rem);line-height:.96;letter-spacing:-.05em;text-wrap:balance}
.identity-system__skill p{margin:0;max-width:32ch;color:var(--paper-muted);font-size:clamp(.9rem,.92vw,1.02rem);line-height:1.5}
.identity-system__portrait{grid-column:2;grid-row:2/4;min-height:clamp(34rem,62vh,48rem);background:#0d0f0d}
.identity-system__media{position:absolute;inset:0;overflow:hidden}
.identity-system__media:before{content:"";position:absolute;z-index:1;left:50%;bottom:4%;width:min(72%,38rem);aspect-ratio:1;border:1px solid rgba(55,218,55,.22);border-radius:50%;background:radial-gradient(circle,rgba(55,218,55,.08),transparent 68%);transform:translateX(-50%)}
.identity-system__asset,.identity-system__media picture,.identity-system__media video{width:100%;height:100%;object-fit:cover}
.identity-system__asset{object-position:center 25%}
.identity-system__placeholder{display:grid;place-items:center;width:100%;height:100%;font-size:clamp(6rem,14vw,13rem);font-weight:800;background:radial-gradient(circle at 50% 45%,rgba(55,218,55,.18),transparent 40%),#111}
.identity-system__quote{position:absolute;z-index:2;top:clamp(1rem,2.5vw,2.6rem);right:clamp(1rem,2.5vw,2.6rem);max-width:20rem;padding:.85rem 1.15rem;border:1px solid var(--line);border-radius:999px;background:rgba(8,8,8,.76);backdrop-filter:blur(10px);font-size:clamp(.78rem,.9vw,.95rem);line-height:1.35}
.identity-system__intro{position:absolute;z-index:2;left:clamp(1rem,2.5vw,2.6rem);right:clamp(1rem,8vw,8rem);bottom:clamp(1rem,2.5vw,2.6rem);padding:1rem 1.15rem;border-left:2px solid var(--accent);background:linear-gradient(90deg,rgba(8,8,8,.96),rgba(8,8,8,.25))}
.identity-system__intro p{margin:0;font-size:clamp(1rem,1.25vw,1.3rem);line-height:1.42}
.identity-system__creative{display:grid;grid-template-columns:1fr 1fr;border-left:1px solid var(--line)}
.identity-system__creative article{min-height:clamp(15rem,28vh,21rem);padding:clamp(1.5rem,3vw,3rem);border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#101010;display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;transition:background-color .3s ease}
.identity-system__creative article:hover{background:#131813}
.identity-system__creative span{display:block;margin-bottom:1rem;color:var(--paper-muted);font-size:.68rem;letter-spacing:.15em;text-transform:uppercase}
.identity-system__creative h3{margin:0 0 1rem;max-width:12ch;font-size:clamp(2rem,3vw,4.1rem);line-height:.9;letter-spacing:-.06em;text-wrap:balance}
.identity-system__creative p{margin:0;max-width:48ch;color:var(--paper-muted);line-height:1.5}
.identity-system__creative a{flex:0 0 auto;color:var(--accent);font-weight:750;white-space:nowrap}
@media(max-width:70rem){.identity-system__grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}.identity-system__title{grid-column:1/-1;grid-row:auto;min-height:14rem}.identity-system__portrait{grid-column:1/-1;grid-row:auto;min-height:42rem;order:2}.identity-system__skill--1,.identity-system__skill--2{order:1}.identity-system__skill--3,.identity-system__skill--4,.identity-system__skill--5,.identity-system__skill--6{order:3}.identity-system__skill{min-height:17rem}}
@media(max-width:47.99rem){.identity-system{padding-block:4rem}.identity-system__grid{grid-template-columns:1fr 1fr;margin-inline:-1rem;border-left:0}.identity-system__title{min-height:12rem;padding:1.5rem;border-right:0}.identity-system__title h2{font-size:clamp(2.8rem,14vw,5rem)}.identity-system__portrait{min-height:34rem;border-right:0}.identity-system__quote{left:1rem;right:auto;max-width:calc(100% - 2rem)}.identity-system__intro{left:1rem;right:1rem;bottom:1rem}.identity-system__skill{min-height:15rem;padding:1.15rem}.identity-system__skill h3{font-size:clamp(1.35rem,6vw,1.9rem)}.identity-system__skill p{font-size:.86rem}.identity-system__creative{grid-template-columns:1fr;margin-inline:-1rem;border-left:0}.identity-system__creative article{min-height:18rem;display:grid}.identity-system__creative a{justify-self:start}}
@media(max-width:29rem){.identity-system__grid{grid-template-columns:1fr}.identity-system__skill{min-height:13rem}.identity-system__portrait{min-height:31rem}.identity-system__creative h3{font-size:2.25rem}}
@media(prefers-reduced-motion:reduce){.identity-system__cell:after{transition:none}}
\n\n/* Phase 36 — full-bleed identity system and viewport-fit composition. */
body[data-page="home"] .identity-system{
  box-sizing:border-box;
  width:100vw;
  max-width:none;
  margin-inline:calc(50% - 50vw);
  padding:0;
  background:#090909;
  color:var(--paper,#f4f4f1);
}
body[data-page="home"] .identity-system__grid{
  width:100%;
  min-height:100svh;
  grid-template-columns:minmax(15rem,.82fr) minmax(34rem,1.85fr) minmax(15rem,.82fr);
  grid-template-rows:minmax(14rem,34svh) repeat(2,minmax(13rem,33svh));
  border-left:0;
  border-top:0;
}
body[data-page="home"] .identity-system__title{
  padding:clamp(1.5rem,2.4vw,3rem);
}
body[data-page="home"] .identity-system__title h2{
  max-width:12ch;
  font-size:clamp(3.8rem,6.3vw,7.5rem);
  line-height:.84;
}
body[data-page="home"] .identity-system__portrait{
  min-height:0;
}
body[data-page="home"] .identity-system__media,
body[data-page="home"] .identity-system__media picture,
body[data-page="home"] .identity-system__media video,
body[data-page="home"] .identity-system__asset{
  width:100%;
  height:100%;
}
body[data-page="home"] .identity-system__asset{
  object-fit:cover;
  object-position:center 28%;
}
body[data-page="home"] .identity-system__intro{
  right:clamp(1rem,5vw,5rem);
}
body[data-page="home"] .identity-system__creative{
  width:100%;
  border-left:0;
  background:#090909;
}

@media (min-width:70.01rem) and (max-height:850px){
  body[data-page="home"] .identity-system__grid{
    grid-template-rows:minmax(11rem,32svh) repeat(2,minmax(11rem,34svh));
  }
  body[data-page="home"] .identity-system__skill{
    gap:1.25rem;
    padding:clamp(1.15rem,1.8vw,2rem);
  }
  body[data-page="home"] .identity-system__skill h3{
    font-size:clamp(1.35rem,1.65vw,2rem);
  }
  body[data-page="home"] .identity-system__skill p{
    font-size:clamp(.82rem,.78vw,.94rem);
  }
  body[data-page="home"] .identity-system__title h2{
    font-size:clamp(3.25rem,5.4vw,6.25rem);
  }
}

@media(max-width:70rem){
  body[data-page="home"] .identity-system{
    width:100vw;
    margin-inline:calc(50% - 50vw);
  }
  body[data-page="home"] .identity-system__grid{
    min-height:auto;
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto;
  }
  body[data-page="home"] .identity-system__title h2{
    max-width:13ch;
  }
  body[data-page="home"] .identity-system__portrait{
    min-height:clamp(36rem,78svh,48rem);
  }
}

@media(max-width:47.99rem){
  body[data-page="home"] .identity-system__grid,
  body[data-page="home"] .identity-system__creative{
    margin-inline:0;
  }
  body[data-page="home"] .identity-system__portrait{
    min-height:clamp(31rem,72svh,39rem);
  }
  body[data-page="home"] .identity-system__asset{
    object-position:center 24%;
  }
}


/* Phase 37 — definitive identity viewport-fit and full-width correction. */
body[data-page="home"] main,
body[data-page="home"] .site-main{
  max-width:none;
  overflow:visible;
}

body[data-page="home"] section.identity-system{
  position:relative;
  left:50%;
  right:50%;
  width:100vw!important;
  max-width:100vw!important;
  margin-left:-50vw!important;
  margin-right:-50vw!important;
  padding:0!important;
  background:#090909!important;
  overflow:clip;
  isolation:isolate;
}

body[data-page="home"] section.identity-system::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background:#090909;
}

body[data-page="home"] .identity-system__grid{
  width:100%!important;
  max-width:none!important;
  min-height:100svh;
  margin:0!important;
  grid-template-columns:minmax(14rem,.78fr) minmax(30rem,1.72fr) minmax(14rem,.78fr);
  grid-template-rows:40svh 30svh 30svh;
  border:0;
}

body[data-page="home"] .identity-system__title{
  min-width:0;
  min-height:0;
  padding:clamp(1.25rem,2vw,2.5rem) clamp(1.5rem,2.6vw,3rem);
  place-content:center;
  overflow:hidden;
}

body[data-page="home"] .identity-system__title .section-kicker{
  margin-bottom:clamp(.7rem,1.2vh,1rem);
}

body[data-page="home"] .identity-system__title h2{
  width:100%;
  max-width:10.8ch;
  margin-inline:auto;
  font-size:clamp(3rem,min(4.7vw,7.4svh),6.5rem);
  line-height:.86;
  letter-spacing:-.072em;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}

body[data-page="home"] .identity-system__skill{
  min-height:0;
  gap:clamp(.85rem,1.6vh,1.5rem);
  padding:clamp(1.1rem,1.65vw,2rem);
}

body[data-page="home"] .identity-system__skill h3{
  font-size:clamp(1.35rem,min(1.8vw,3.2vh),2.25rem);
  line-height:.98;
}

body[data-page="home"] .identity-system__skill p{
  font-size:clamp(.82rem,min(.82vw,1.7vh),1rem);
  line-height:1.48;
}

body[data-page="home"] .identity-system__portrait{
  min-height:0!important;
}

body[data-page="home"] .identity-system__asset,
body[data-page="home"] .identity-system__media picture,
body[data-page="home"] .identity-system__media picture img,
body[data-page="home"] .identity-system__media video{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  object-fit:cover!important;
  object-position:center 24%!important;
}

body[data-page="home"] .identity-system__intro{
  left:clamp(1rem,1.8vw,2rem);
  right:clamp(1rem,3vw,3.5rem);
  bottom:clamp(1rem,1.8vw,2rem);
  padding:clamp(.8rem,1.15vw,1.15rem) clamp(.9rem,1.3vw,1.3rem);
}

body[data-page="home"] .identity-system__intro p{
  font-size:clamp(.9rem,min(1vw,2vh),1.18rem);
  line-height:1.42;
}

body[data-page="home"] .identity-system__creative{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}

@media (min-width:70.01rem) and (max-height:760px){
  body[data-page="home"] .identity-system__grid{
    grid-template-rows:42svh 29svh 29svh;
  }

  body[data-page="home"] .identity-system__title h2{
    font-size:clamp(2.75rem,min(4.35vw,6.75svh),5.75rem);
    line-height:.88;
  }

  body[data-page="home"] .identity-system__skill{
    padding:clamp(.95rem,1.4vw,1.65rem);
  }
}

@media (max-width:70rem){
  body[data-page="home"] section.identity-system{
    overflow:hidden;
  }

  body[data-page="home"] .identity-system__grid{
    min-height:auto;
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto;
  }

  body[data-page="home"] .identity-system__title{
    min-height:clamp(15rem,36svh,22rem);
  }

  body[data-page="home"] .identity-system__title h2{
    max-width:12ch;
    font-size:clamp(3rem,10vw,6.2rem);
  }

  body[data-page="home"] .identity-system__portrait{
    min-height:clamp(38rem,78svh,48rem)!important;
  }

  body[data-page="home"] .identity-system__skill{
    min-height:clamp(15rem,34svh,20rem);
  }
}

@media (max-width:47.99rem){
  body[data-page="home"] .identity-system__grid{
    grid-template-columns:1fr 1fr;
  }

  body[data-page="home"] .identity-system__title{
    min-height:clamp(14rem,34svh,19rem);
  }

  body[data-page="home"] .identity-system__title h2{
    max-width:11ch;
    font-size:clamp(2.65rem,13vw,4.7rem);
    line-height:.88;
  }

  body[data-page="home"] .identity-system__portrait{
    min-height:clamp(32rem,70svh,40rem)!important;
  }

  body[data-page="home"] .identity-system__skill{
    min-height:15rem;
  }
}

@media (max-width:29rem){
  body[data-page="home"] .identity-system__grid{
    grid-template-columns:1fr;
  }

  body[data-page="home"] .identity-system__title{
    min-height:13rem;
  }

  body[data-page="home"] .identity-system__title h2{
    max-width:12ch;
    font-size:clamp(2.45rem,12vw,3.75rem);
  }

  body[data-page="home"] .identity-system__skill{
    min-height:12.5rem;
  }
}

/* Phase 38 — compact full-width identity composition.
   Retains the full-bleed editorial grid while reducing its visual dominance. */
@media (min-width:70.01rem){
  body[data-page="home"] .identity-system__grid{
    min-height:0;
    height:clamp(44rem,82svh,56rem);
    grid-template-columns:minmax(13.5rem,.82fr) minmax(30rem,1.68fr) minmax(13.5rem,.82fr);
    grid-template-rows:34% 33% 33%;
  }

  body[data-page="home"] .identity-system__title{
    padding:clamp(1rem,1.55vw,1.75rem) clamp(1.35rem,2vw,2.35rem);
  }

  body[data-page="home"] .identity-system__title .section-kicker{
    margin-bottom:clamp(.55rem,.8vh,.8rem);
  }

  body[data-page="home"] .identity-system__title h2{
    max-width:10.4ch;
    font-size:clamp(2.8rem,min(4vw,6.1svh),5.45rem);
    line-height:.88;
    letter-spacing:-.068em;
  }

  body[data-page="home"] .identity-system__skill{
    padding:clamp(.95rem,1.35vw,1.55rem);
    gap:clamp(.65rem,1.05vh,1rem);
  }

  body[data-page="home"] .identity-system__skill h3{
    font-size:clamp(1.25rem,min(1.55vw,2.5vh),1.95rem);
  }

  body[data-page="home"] .identity-system__skill p{
    max-width:29ch;
    font-size:clamp(.78rem,min(.76vw,1.4vh),.94rem);
    line-height:1.45;
  }

  body[data-page="home"] .identity-system__intro{
    left:clamp(.85rem,1.35vw,1.5rem);
    right:clamp(.85rem,2.2vw,2.5rem);
    bottom:clamp(.85rem,1.35vw,1.5rem);
    max-width:38rem;
    padding:clamp(.68rem,.85vw,.9rem) clamp(.8rem,1vw,1rem);
  }

  body[data-page="home"] .identity-system__intro p{
    font-size:clamp(.82rem,min(.86vw,1.55vh),1rem);
    line-height:1.38;
  }
}

@media (min-width:70.01rem) and (max-height:760px){
  body[data-page="home"] .identity-system__grid{
    height:clamp(39rem,88svh,46rem);
    grid-template-rows:35% 32.5% 32.5%;
  }

  body[data-page="home"] .identity-system__title h2{
    font-size:clamp(2.55rem,min(3.7vw,5.7svh),4.8rem);
  }
}

@media (min-width:100rem){
  body[data-page="home"] .identity-system__grid{
    height:clamp(48rem,78svh,58rem);
  }
}

/* Phase 39 — centered editorial identity frame.
   Replaces the full-bleed desktop composition with a controlled portfolio-width grid,
   while retaining full-width mobile usability and all admin-editable content. */
body[data-page="home"] section.identity-system{
  left:auto!important;
  right:auto!important;
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  padding-block:clamp(2.5rem,5vw,5.5rem)!important;
  padding-inline:clamp(1.25rem,5vw,6rem)!important;
  background:#090909!important;
}

body[data-page="home"] .identity-system__grid,
body[data-page="home"] .identity-system__creative{
  width:min(100%,73.75rem)!important;
  max-width:73.75rem!important;
  margin-inline:auto!important;
}

@media (min-width:100rem){
  body[data-page="home"] .identity-system__grid,
  body[data-page="home"] .identity-system__creative{
    width:min(100%,77.5rem)!important;
    max-width:77.5rem!important;
  }
}

@media (min-width:70.01rem){
  body[data-page="home"] .identity-system__grid{
    height:clamp(42rem,76svh,50rem);
    min-height:42rem;
    grid-template-columns:minmax(11.75rem,.82fr) minmax(29rem,1.9fr) minmax(11.75rem,.82fr);
    grid-template-rows:33% 33.5% 33.5%;
    border-top:1px solid rgba(255,255,255,.09);
    border-left:1px solid rgba(255,255,255,.09);
  }

  body[data-page="home"] .identity-system__title{
    padding:clamp(1.15rem,1.6vw,1.8rem) clamp(1.3rem,2vw,2.2rem);
  }

  body[data-page="home"] .identity-system__title h2{
    max-width:10.7ch;
    font-size:clamp(2.75rem,min(3.75vw,5.6svh),5rem);
    line-height:.88;
    letter-spacing:-.066em;
  }

  body[data-page="home"] .identity-system__skill{
    padding:clamp(1rem,1.35vw,1.5rem);
  }

  body[data-page="home"] .identity-system__skill h3{
    font-size:clamp(1.2rem,min(1.45vw,2.35vh),1.8rem);
  }

  body[data-page="home"] .identity-system__skill p{
    font-size:clamp(.77rem,min(.72vw,1.3vh),.9rem);
    max-width:28ch;
  }

  body[data-page="home"] .identity-system__intro{
    max-width:34rem;
  }
}

@media (min-width:70.01rem) and (max-height:760px){
  body[data-page="home"] section.identity-system{
    padding-block:clamp(2rem,3.5vw,3.5rem)!important;
  }

  body[data-page="home"] .identity-system__grid{
    height:clamp(38rem,82svh,44rem);
    min-height:38rem;
  }

  body[data-page="home"] .identity-system__title h2{
    font-size:clamp(2.45rem,min(3.45vw,5.1svh),4.35rem);
  }
}

@media (max-width:70rem){
  body[data-page="home"] section.identity-system{
    padding-inline:clamp(1rem,3.5vw,2rem)!important;
    padding-block:clamp(3rem,7vw,5rem)!important;
  }

  body[data-page="home"] .identity-system__grid,
  body[data-page="home"] .identity-system__creative{
    width:100%!important;
    max-width:none!important;
  }

  body[data-page="home"] .identity-system__title{
    min-height:clamp(13rem,30svh,18rem);
  }

  body[data-page="home"] .identity-system__title h2{
    font-size:clamp(2.8rem,9vw,5.4rem);
  }

  body[data-page="home"] .identity-system__portrait{
    min-height:clamp(32rem,68svh,42rem)!important;
  }

  body[data-page="home"] .identity-system__skill{
    min-height:clamp(13rem,29svh,17rem);
  }
}

@media (max-width:47.99rem){
  body[data-page="home"] section.identity-system{
    padding-inline:1rem!important;
    padding-block:3.5rem!important;
  }

  body[data-page="home"] .identity-system__grid,
  body[data-page="home"] .identity-system__creative{
    margin-inline:0!important;
  }

  body[data-page="home"] .identity-system__title{
    min-height:clamp(12rem,28svh,16rem);
  }

  body[data-page="home"] .identity-system__title h2{
    max-width:11.5ch;
    font-size:clamp(2.45rem,12vw,4.2rem);
  }

  body[data-page="home"] .identity-system__portrait{
    min-height:clamp(29rem,62svh,36rem)!important;
  }

  body[data-page="home"] .identity-system__skill{
    min-height:13.5rem;
  }
}

@media (max-width:29rem){
  body[data-page="home"] section.identity-system{
    padding-inline:0!important;
  }

  body[data-page="home"] .identity-system__title{
    min-height:12rem;
  }

  body[data-page="home"] .identity-system__title h2{
    font-size:clamp(2.25rem,11vw,3.35rem);
  }

  body[data-page="home"] .identity-system__portrait{
    min-height:28rem!important;
  }
}

/* Phase 40 — reference-proportioned editorial grid.
   Wider side cells, narrower portrait column, and reduced portrait scale. */
@media (min-width:70.01rem){
  body[data-page="home"] .identity-system__grid{
    width:min(100%,72rem)!important;
    max-width:72rem!important;
    height:clamp(43rem,78svh,52rem)!important;
    min-height:43rem!important;
    grid-template-columns:minmax(16.5rem,1.05fr) minmax(27rem,1.55fr) minmax(16.5rem,1.05fr)!important;
    grid-template-rows:31% 34.5% 34.5%!important;
  }

  body[data-page="home"] .identity-system__creative{
    width:min(100%,72rem)!important;
    max-width:72rem!important;
  }

  body[data-page="home"] .identity-system__title{
    padding:clamp(1.25rem,1.8vw,2rem) clamp(1.35rem,2vw,2.15rem)!important;
  }

  body[data-page="home"] .identity-system__title h2{
    max-width:10.5ch!important;
    font-size:clamp(2.55rem,min(3.25vw,5.2svh),4.45rem)!important;
    line-height:.87!important;
  }

  body[data-page="home"] .identity-system__skill{
    padding:clamp(1.35rem,1.75vw,2rem)!important;
  }

  body[data-page="home"] .identity-system__skill h3{
    max-width:13ch!important;
    font-size:clamp(1.3rem,min(1.55vw,2.45vh),1.85rem)!important;
  }

  body[data-page="home"] .identity-system__skill p{
    max-width:34ch!important;
    font-size:clamp(.8rem,min(.78vw,1.35vh),.94rem)!important;
    line-height:1.52!important;
  }

  body[data-page="home"] .identity-system__media{
    display:grid!important;
    place-items:center!important;
    overflow:hidden!important;
    background:#0d0d0d!important;
  }

  body[data-page="home"] .identity-system__media picture{
    width:92%!important;
    height:92%!important;
    display:block!important;
  }

  body[data-page="home"] .identity-system__asset,
  body[data-page="home"] .identity-system__media picture img,
  body[data-page="home"] .identity-system__media video{
    width:92%!important;
    height:92%!important;
    max-width:none!important;
    object-fit:contain!important;
    object-position:center center!important;
    margin:auto!important;
    transform:none!important;
  }

  body[data-page="home"] .identity-system__intro{
    left:clamp(.9rem,1.4vw,1.35rem)!important;
    right:clamp(.9rem,1.4vw,1.35rem)!important;
    bottom:clamp(.9rem,1.4vw,1.35rem)!important;
    max-width:none!important;
    padding:.8rem .95rem!important;
  }

  body[data-page="home"] .identity-system__intro p{
    font-size:clamp(.82rem,.82vw,.96rem)!important;
    line-height:1.45!important;
  }
}

@media (min-width:100rem){
  body[data-page="home"] .identity-system__grid,
  body[data-page="home"] .identity-system__creative{
    width:min(100%,76rem)!important;
    max-width:76rem!important;
  }
}

@media (min-width:70.01rem) and (max-height:760px){
  body[data-page="home"] .identity-system__grid{
    height:clamp(39rem,84svh,45rem)!important;
    min-height:39rem!important;
  }

  body[data-page="home"] .identity-system__title h2{
    font-size:clamp(2.3rem,min(3vw,4.8svh),3.85rem)!important;
  }
}

@media (max-width:70rem){
  body[data-page="home"] .identity-system__media picture,
  body[data-page="home"] .identity-system__asset,
  body[data-page="home"] .identity-system__media picture img,
  body[data-page="home"] .identity-system__media video{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
}

/* Phase 41 — compact asymmetric identity profile.
   Desktop uses a landscape portrait frame; tablet/mobile can use a dedicated mobile asset. */
.identity-profile{
  width:100%;
  padding:clamp(4.25rem,7vw,7rem) clamp(1rem,4vw,4rem);
  background:#080908;
  color:#f4f5f1;
}
.identity-profile__inner{width:min(100%,76rem);margin-inline:auto}
.identity-profile__header{
  display:grid;grid-template-columns:minmax(0,1.45fr) minmax(17rem,.72fr);
  gap:clamp(1.5rem,4vw,4rem);align-items:end;
  padding-bottom:clamp(1.35rem,2.2vw,2rem);border-bottom:1px solid rgba(255,255,255,.11)
}
.identity-profile__header .section-kicker{margin:0 0 .8rem;color:#52ff63}
.identity-profile__header h2{margin:0;max-width:11ch;font-size:clamp(3rem,5.2vw,5.8rem);line-height:.87;letter-spacing:-.07em;text-wrap:balance}
.identity-profile__header>p{margin:0;color:#9ca39b;font-size:clamp(.94rem,1.05vw,1.08rem);line-height:1.58;max-width:38ch}
.identity-profile__stage{display:grid;grid-template-columns:minmax(18rem,.82fr) minmax(0,1.75fr);min-height:35rem;border:1px solid rgba(255,255,255,.11);border-top:0;background:#0d0f0d}
.identity-profile__portrait{position:relative;min-width:0;margin:0;overflow:hidden;border-right:1px solid rgba(255,255,255,.11);background:#0a0c0a}
.identity-profile__portrait picture{display:block;width:100%;height:100%}
.identity-profile__portrait img{width:100%;height:100%;object-fit:cover;object-position:center 28%;transition:transform .9s cubic-bezier(.22,1,.36,1)}
.identity-profile__stage:hover .identity-profile__portrait img{transform:scale(1.018)}
.identity-profile__portrait::after{content:"";position:absolute;inset:auto 0 0;height:42%;background:linear-gradient(transparent,rgba(0,0,0,.82));pointer-events:none}
.identity-profile__portrait figcaption{position:absolute;z-index:2;left:1.35rem;right:1.35rem;bottom:1.35rem;display:grid;gap:.35rem}
.identity-profile__portrait figcaption strong{font-size:clamp(1.2rem,1.7vw,1.65rem);letter-spacing:-.035em}
.identity-profile__portrait figcaption span{max-width:30ch;color:#d0d4ce;font-size:.82rem;line-height:1.42}
.identity-profile__placeholder{height:100%;display:grid;place-items:center;background:radial-gradient(circle,rgba(82,255,99,.12),transparent 55%)}
.identity-profile__placeholder span{font-size:5rem;font-weight:800;letter-spacing:-.08em}
.identity-profile__skills{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr))}
.identity-profile__skill{position:relative;min-width:0;padding:clamp(1.25rem,2vw,1.85rem);display:flex;flex-direction:column;justify-content:space-between;gap:1.5rem;border-right:1px solid rgba(255,255,255,.11);border-bottom:1px solid rgba(255,255,255,.11);overflow:hidden;background:#0d0f0d;transition:background-color .3s ease}
.identity-profile__skill:nth-child(2n){border-right:0}.identity-profile__skill:nth-last-child(-n+2){border-bottom:0}
.identity-profile__skill:hover{background:#121512}
.identity-profile__skill-meta{display:flex;justify-content:space-between;align-items:center;gap:1rem;color:#858d84;font-size:.61rem;letter-spacing:.14em;text-transform:uppercase}
.identity-profile__skill-meta i{width:.42rem;height:.42rem;border-radius:50%;background:#52ff63;box-shadow:0 0 0 0 rgba(82,255,99,.15);transition:box-shadow .3s ease,transform .3s ease}
.identity-profile__skill:hover .identity-profile__skill-meta i{transform:scale(1.2);box-shadow:0 0 0 .45rem rgba(82,255,99,.07)}
.identity-profile__skill h3{margin:0 0 .6rem;max-width:13ch;font-size:clamp(1.25rem,1.75vw,1.8rem);line-height:.98;letter-spacing:-.045em;text-wrap:balance}
.identity-profile__skill p{margin:0;max-width:34ch;color:#9ca39b;font-size:clamp(.78rem,.78vw,.9rem);line-height:1.5}
.identity-profile__creative{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;margin-top:.85rem}
.identity-profile__creative article{min-height:13.5rem;padding:clamp(1.35rem,2.2vw,2rem);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:1.5rem;border:1px solid rgba(255,255,255,.11);background:#0d0f0d;transition:transform .35s cubic-bezier(.22,1,.36,1),background-color .3s ease}
.identity-profile__creative article:hover{transform:translateY(-3px);background:#121512}
.identity-profile__creative article>div{display:grid;gap:.65rem}.identity-profile__creative article span{color:#858d84;font-size:.63rem;letter-spacing:.15em;text-transform:uppercase}
.identity-profile__creative h3{margin:0;max-width:13ch;font-size:clamp(1.8rem,3vw,3rem);line-height:.91;letter-spacing:-.055em;text-wrap:balance}
.identity-profile__creative p{margin:0;max-width:46ch;color:#9ca39b;font-size:.82rem;line-height:1.48}
.identity-profile__creative a{align-self:end;white-space:nowrap;color:#52ff63;font-size:.82rem;font-weight:700}
@media(max-width:64rem){
  .identity-profile__header{grid-template-columns:1fr}.identity-profile__header h2{max-width:12ch}
  .identity-profile__stage{grid-template-columns:1fr;min-height:auto}
  .identity-profile__portrait{height:clamp(22rem,56vw,34rem);border-right:0;border-bottom:1px solid rgba(255,255,255,.11)}
  .identity-profile__portrait img{object-position:center 26%}
  .identity-profile__skills{min-height:36rem}
}
@media(max-width:47.99rem){
  .identity-profile{padding:3.5rem .85rem}
  .identity-profile__header h2{font-size:clamp(2.7rem,13vw,4.6rem)}
  .identity-profile__portrait{height:clamp(24rem,112vw,34rem)}
  .identity-profile__portrait img{object-position:center 24%}
  .identity-profile__skills{grid-template-columns:1fr;grid-template-rows:auto;min-height:0}
  .identity-profile__skill{min-height:12rem;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.11)!important}
  .identity-profile__skill:last-child{border-bottom:0!important}
  .identity-profile__creative{grid-template-columns:1fr}
  .identity-profile__creative article{min-height:13rem}
}
@media(max-width:28rem){
  .identity-profile__portrait{height:28rem}
  .identity-profile__creative article{grid-template-columns:1fr}.identity-profile__creative a{justify-self:start}
}
@media(prefers-reduced-motion:reduce){.identity-profile__portrait img,.identity-profile__skill,.identity-profile__creative article{transition:none!important}}


/* Phase 42 — full-width editorial identity heading.
   Removes the secondary intro paragraph and gives the primary statement the
   complete header canvas. Motion remains transform/opacity based. */
.identity-profile__header{
  display:block!important;
  padding-bottom:clamp(1.7rem,3vw,2.7rem)!important;
}
.identity-profile__heading{
  width:100%;
}
.identity-profile__header .section-kicker{
  margin-bottom:clamp(.9rem,1.4vw,1.25rem)!important;
}
.identity-profile__header h2{
  width:100%;
  max-width:15ch!important;
  font-size:clamp(3.6rem,6.8vw,7.1rem)!important;
  line-height:.84!important;
  letter-spacing:-.075em!important;
  text-wrap:balance;
  overflow:hidden;
}
.identity-profile__header h2 > span{
  display:block;
  transform:translateY(112%);
  opacity:0;
  will-change:transform,opacity;
  transition:
    transform 1s cubic-bezier(.22,1,.36,1),
    opacity .55s ease;
}
html.motion-ready .identity-profile__header.is-revealed h2 > span,
html:not(.motion-pending) .identity-profile__header h2 > span,
.identity-profile__header[data-reveal-state="visible"] h2 > span{
  transform:none;
  opacity:1;
}
html.no-js .identity-profile__header h2 > span,
html.motion-failed .identity-profile__header h2 > span{
  transform:none;
  opacity:1;
}
@media (max-width:64rem){
  .identity-profile__header h2{
    max-width:13ch!important;
    font-size:clamp(3.2rem,9vw,6rem)!important;
  }
}
@media (max-width:47.99rem){
  .identity-profile__header{
    padding-bottom:1.5rem!important;
  }
  .identity-profile__header h2{
    max-width:none!important;
    font-size:clamp(2.8rem,13.5vw,4.8rem)!important;
    line-height:.87!important;
  }
}
@media (prefers-reduced-motion:reduce){
  .identity-profile__header h2 > span{
    transform:none!important;
    opacity:1!important;
    transition:none!important;
  }
}

/* Phase 43 — balanced editorial heading scale and optical alignment. */
@media (min-width:64.01rem){
  .identity-profile__heading{
    padding-left:clamp(1.25rem,3.2vw,3.25rem);
  }

  .identity-profile__header h2{
    max-width:14.25ch!important;
    font-size:clamp(3.2rem,5.55vw,6.15rem)!important;
    line-height:.86!important;
    letter-spacing:-.068em!important;
  }
}

@media (min-width:48rem) and (max-width:64rem){
  .identity-profile__heading{
    padding-left:clamp(.6rem,2vw,1.35rem);
  }

  .identity-profile__header h2{
    max-width:13.5ch!important;
    font-size:clamp(3rem,7.5vw,5rem)!important;
    line-height:.87!important;
  }
}

@media (max-width:47.99rem){
  .identity-profile__heading{
    padding-left:0;
  }

  .identity-profile__header h2{
    font-size:clamp(2.55rem,12vw,4.35rem)!important;
    line-height:.89!important;
    letter-spacing:-.06em!important;
  }
}

/* Phase 44 — two-line desktop editorial heading.
   Expands the usable measure to the right while reducing type scale so the
   current Turkish statement resolves into two balanced lines on desktop. */
@media (min-width:64.01rem){
  .identity-profile__heading{
    width:100%;
    padding-left:clamp(.75rem,1.6vw,1.5rem)!important;
    padding-right:clamp(.25rem,1vw,.85rem)!important;
  }

  .identity-profile__header h2{
    width:100%!important;
    max-width:none!important;
    font-size:clamp(3.15rem,5.05vw,5.45rem)!important;
    line-height:.88!important;
    letter-spacing:-.064em!important;
    text-wrap:balance!important;
  }
}

@media (min-width:48rem) and (max-width:64rem){
  .identity-profile__heading{
    padding-left:clamp(.45rem,1.25vw,.9rem)!important;
    padding-right:.25rem!important;
  }

  .identity-profile__header h2{
    width:100%!important;
    max-width:none!important;
    font-size:clamp(2.85rem,6.65vw,4.5rem)!important;
    line-height:.89!important;
  }
}

/* Phase 65: CMS-managed project background previews */
.home-projects{position:relative;isolation:isolate;overflow:hidden}
.home-projects__preview{position:absolute;z-index:-2;inset:0;pointer-events:none;background:#080808;overflow:hidden}
.home-projects__preview::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,6,6,.96) 0%,rgba(6,6,6,.84) 48%,rgba(6,6,6,.66) 100%)}
.home-projects__preview img,.home-projects__preview video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.035);transition:opacity .42s var(--ease),transform 1.1s var(--ease-out);filter:saturate(.82) contrast(1.04)}
.home-projects[data-preview-active="true"] .home-projects__preview :is(img,video).is-visible{opacity:1;transform:scale(1)}
.home-projects__inner{position:relative;z-index:1}
.home-project{transition:opacity .3s var(--ease)}
.home-projects[data-preview-active="true"] .home-project:not([data-preview-current="true"]){opacity:.48}
.home-project[data-preview-current="true"]{opacity:1}
@media (max-width:47.99rem){
  .home-projects__preview::after{background:linear-gradient(180deg,rgba(6,6,6,.72) 0%,rgba(6,6,6,.88) 45%,rgba(6,6,6,.97) 100%)}
  .home-projects[data-preview-active="true"] .home-project:not([data-preview-current="true"]){opacity:.68}
}
@media (prefers-reduced-motion:reduce){.home-projects__preview img,.home-projects__preview video{transition:opacity .15s linear;transform:none!important}}

/* Phase 67 — full-bleed editorial project rows + row-bound media preview */
.home-projects{
  position:relative;
  isolation:isolate;
  overflow:clip;
  background:#080808;
}
.home-projects__inner{
  position:relative;
  z-index:2;
  width:min(100% - 2rem,84rem);
}
.home-projects__preview{
  position:absolute;
  z-index:1;
  top:var(--project-preview-top,0px);
  left:50%;
  width:100vw;
  height:var(--project-preview-height,0px);
  min-height:0;
  transform:translateX(-50%);
  overflow:hidden;
  pointer-events:none;
  background:#0a0a0a;
  opacity:0;
  transition:top .42s var(--ease-out),height .42s var(--ease-out),opacity .24s linear;
}
.home-projects[data-preview-active="true"] .home-projects__preview{opacity:1}
.home-projects__preview::after{
  content:"";
  position:absolute;
  z-index:2;
  inset:0;
  background:linear-gradient(90deg,rgba(5,5,5,.78) 0%,rgba(5,5,5,.48) 43%,rgba(5,5,5,.28) 72%,rgba(5,5,5,.42) 100%);
}
.home-projects__preview img,
.home-projects__preview video{
  position:absolute!important;
  z-index:1;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  object-fit:cover!important;
  object-position:center!important;
  opacity:0;
  transform:scale(1.035);
  transition:opacity .38s var(--ease),transform 1.05s var(--ease-out);
  filter:saturate(.88) contrast(1.06);
}
.home-projects[data-preview-active="true"] .home-projects__preview :is(img,video).is-visible{
  opacity:1;
  transform:scale(1);
}
.home-projects__list{
  width:100vw;
  margin-left:calc(50% - 50vw);
  border-top:1px solid rgba(255,255,255,.14);
}
.home-project{
  z-index:3;
  width:100%;
  min-height:clamp(8.5rem,11vw,10.75rem);
  padding-block:clamp(1.45rem,2.3vw,2.15rem);
  padding-inline:max(1rem,calc((100vw - 84rem)/2));
  border-bottom:1px solid rgba(255,255,255,.14);
  overflow:visible;
  transition:opacity .28s var(--ease),color .28s var(--ease);
}
.home-project::before{display:none}
.home-project[data-preview-current="true"]{
  opacity:1!important;
  color:#fff;
}
.home-projects[data-preview-active="true"] .home-project:not([data-preview-current="true"]){opacity:.46}
.home-project[data-preview-current="true"] .home-project__meta,
.home-project[data-preview-current="true"] .home-project__summary{color:rgba(255,255,255,.82)}
.home-project[data-preview-current="true"] .home-project__index{color:var(--accent)}
.home-project[data-preview-current="true"] .home-project__action{
  background:#fff;
  border-color:#fff;
  color:#090909;
}
.home-projects__footer{
  width:100%;
  justify-content:flex-end;
}

@media (max-width:47.99rem){
  .home-projects__inner{width:min(100% - 1.5rem,84rem)}
  .home-project{
    grid-template-columns:1.75rem minmax(0,1fr);
    padding-inline:.75rem;
    min-height:10.25rem;
  }
  .home-projects__preview::after{
    background:linear-gradient(180deg,rgba(5,5,5,.48) 0%,rgba(5,5,5,.72) 58%,rgba(5,5,5,.9) 100%);
  }
  .home-projects[data-preview-active="true"] .home-project:not([data-preview-current="true"]){opacity:.62}
}

@media (prefers-reduced-motion:reduce){
  .home-projects__preview{transition:opacity .15s linear}
  .home-projects__preview img,
  .home-projects__preview video{transition:opacity .15s linear;transform:none!important}
}

/* Phase 68 — high-contrast project copy and dual CTA hierarchy */
.home-project h3 a::after{content:none}
.home-project__actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:.7rem;
  position:relative;
  z-index:5;
}
.home-project__action{
  position:relative;
  z-index:5;
  text-decoration:none;
  white-space:nowrap;
  box-shadow:0 10px 28px rgba(0,0,0,.18);
}
.home-project__action--primary{
  background:#fff;
  border-color:#fff;
  color:#090909;
  font-weight:750;
}
.home-project__action--demo{
  background:rgba(7,7,7,.52);
  border-color:rgba(255,255,255,.6);
  color:#fff;
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
}
.home-projects__preview::after{
  background:linear-gradient(90deg,rgba(4,4,6,.94) 0%,rgba(4,4,6,.84) 38%,rgba(4,4,6,.48) 68%,rgba(4,4,6,.62) 100%);
}
.home-projects__preview img,
.home-projects__preview video{
  filter:brightness(.68) saturate(.86) contrast(1.08);
}
.home-project[data-preview-current="true"] .home-project__meta{
  color:rgba(255,255,255,.78);
  text-shadow:0 1px 14px rgba(0,0,0,.7);
}
.home-project[data-preview-current="true"] h3{
  color:#fff;
  text-shadow:0 2px 28px rgba(0,0,0,.7);
}
.home-project[data-preview-current="true"] .home-project__summary{
  color:rgba(255,255,255,.93);
  text-shadow:0 2px 20px rgba(0,0,0,.72);
}
.home-project[data-preview-current="true"] .home-project__action--primary{
  background:#fff;
  border-color:#fff;
  color:#090909;
  box-shadow:0 10px 32px rgba(0,0,0,.34),0 0 0 1px rgba(255,255,255,.16);
}
.home-project[data-preview-current="true"] .home-project__action--demo{
  background:rgba(5,5,7,.58);
  border-color:rgba(255,255,255,.76);
  color:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.28);
}
@media (hover:hover) and (pointer:fine){
  .home-project__action:hover,.home-project__action:focus-visible{transform:translateY(-2px)}
  .home-project__action--primary:hover,.home-project__action--primary:focus-visible{background:#f0f0f0}
  .home-project__action--demo:hover,.home-project__action--demo:focus-visible{background:rgba(255,255,255,.14);border-color:#fff}
}
@media (max-width:64rem){
  .home-project{grid-template-columns:2rem minmax(0,1fr)}
  .home-project__actions{grid-column:2;justify-content:flex-start;flex-wrap:wrap;margin-top:.35rem}
}
@media (max-width:47.99rem){
  .home-projects__preview::after{background:linear-gradient(180deg,rgba(4,4,6,.62) 0%,rgba(4,4,6,.78) 48%,rgba(4,4,6,.94) 100%)}
  .home-project__actions{width:100%;gap:.55rem}
  .home-project__action{min-height:2.55rem;padding:.6rem .85rem}
  .home-project__action--primary{flex:1;justify-content:center}
}
@media (max-width:25rem){
  .home-project__actions{display:grid;grid-template-columns:1fr}
  .home-project__action{width:100%;justify-content:center}
  .home-project__action span{position:static;width:auto;height:auto;overflow:visible;clip:auto;white-space:nowrap}
}

/* Phase 69 — verified active-row legibility and explicit dual CTA */
.home-project[data-preview-current="true"]::after{
  content:"";
  position:absolute;
  z-index:0;
  top:0;
  bottom:0;
  left:50%;
  width:100vw;
  transform:translateX(-50%);
  pointer-events:none;
  background:linear-gradient(90deg,rgba(3,3,5,.88) 0%,rgba(3,3,5,.76) 42%,rgba(3,3,5,.30) 72%,rgba(3,3,5,.48) 100%);
}
.home-project[data-preview-current="true"] > *{position:relative;z-index:2}
.home-project[data-preview-current="true"] .home-project__meta{
  color:rgba(255,255,255,.86)!important;
  font-weight:700;
  text-shadow:0 2px 12px rgba(0,0,0,.9);
}
.home-project[data-preview-current="true"] h3,
.home-project[data-preview-current="true"] h3 a{
  color:#fff!important;
  opacity:1!important;
  text-shadow:0 3px 22px rgba(0,0,0,.92);
}
.home-project[data-preview-current="true"] .home-project__summary{
  color:rgba(255,255,255,.96)!important;
  opacity:1!important;
  font-weight:500;
  text-shadow:0 2px 16px rgba(0,0,0,.95);
}
.home-project__actions{
  display:flex!important;
  align-items:center;
  justify-content:flex-end;
  gap:.75rem;
  min-width:max-content;
}
.home-project__action{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  min-height:2.8rem;
  padding:.72rem 1rem!important;
  border:1px solid transparent;
  border-radius:999px;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.08em;
  line-height:1;
  text-transform:uppercase;
  opacity:1!important;
  visibility:visible!important;
}
.home-project__action span{
  position:static!important;
  width:auto!important;
  height:auto!important;
  overflow:visible!important;
  clip:auto!important;
  white-space:nowrap!important;
}
.home-project__action--primary{
  background:#fff!important;
  color:#090909!important;
  border-color:#fff!important;
  box-shadow:0 10px 28px rgba(0,0,0,.38);
}
.home-project__action--demo{
  background:rgba(8,8,10,.72)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.82)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.34);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
}
@media (max-width:64rem){
  .home-project__actions{grid-column:2;justify-content:flex-start;min-width:0;flex-wrap:wrap}
}
@media (max-width:47.99rem){
  .home-project[data-preview-current="true"]::after{background:linear-gradient(180deg,rgba(3,3,5,.56) 0%,rgba(3,3,5,.78) 55%,rgba(3,3,5,.94) 100%)}
  .home-project__actions{width:100%;display:grid!important;grid-template-columns:1fr 1fr;gap:.55rem}
  .home-project__action{width:100%;padding:.72rem .75rem!important}
}
@media (max-width:32rem){
  .home-project__actions{grid-template-columns:1fr}
}


/* Phase 70 — project-row readability, fluid type and persistent CTA contrast */
.home-project{
  color:#fff;
  background:rgba(8,8,10,.96);
}
.home-project::after{
  content:"";
  position:absolute;
  z-index:0;
  inset:0 50% 0 auto;
  width:100vw;
  transform:translateX(50%);
  pointer-events:none;
  background:linear-gradient(90deg,rgba(7,7,9,.98) 0%,rgba(7,7,9,.92) 48%,rgba(7,7,9,.84) 100%);
  opacity:1;
  transition:background .3s var(--ease),opacity .3s var(--ease);
}
.home-project > *{position:relative;z-index:2}
.home-project__index{
  color:rgba(121,255,115,.9)!important;
  font-size:clamp(.75rem,.68rem + .18vw,.9rem)!important;
  font-weight:750;
}
.home-project__meta{
  color:rgba(255,255,255,.72)!important;
  font-size:clamp(.78rem,.72rem + .17vw,.92rem)!important;
  font-weight:700;
  letter-spacing:.1em;
}
.home-project h3,
.home-project h3 a{
  color:#fff!important;
  font-size:clamp(2rem,1.55rem + 1.7vw,3.5rem)!important;
  line-height:.96!important;
  opacity:1!important;
}
.home-project__summary{
  max-width:60ch!important;
  color:rgba(255,255,255,.82)!important;
  font-size:clamp(1rem,.93rem + .24vw,1.15rem)!important;
  line-height:1.58!important;
  opacity:1!important;
}
.home-projects[data-preview-active="true"] .home-project:not([data-preview-current="true"]){opacity:.78}
.home-project[data-preview-current="true"]::after{
  inset:0 50% 0 auto;
  background:linear-gradient(90deg,rgba(3,3,5,.96) 0%,rgba(3,3,5,.88) 44%,rgba(3,3,5,.6) 72%,rgba(3,3,5,.72) 100%);
}
.home-projects__preview::after{
  background:linear-gradient(90deg,rgba(3,3,5,.94) 0%,rgba(3,3,5,.82) 43%,rgba(3,3,5,.54) 72%,rgba(3,3,5,.68) 100%);
}
.home-projects__preview img,
.home-projects__preview video{filter:brightness(.54) saturate(.78) contrast(1.12)}
.home-project__action{font-size:clamp(.75rem,.71rem + .12vw,.84rem)!important;min-height:3rem;padding:.78rem 1.1rem!important}
.home-project__action:focus-visible{outline:3px solid #9dff98;outline-offset:4px}
@media (max-width:47.99rem){
  .home-project{background:#08080a;min-height:unset;padding-block:1.65rem}
  .home-project::after,.home-project[data-preview-current="true"]::after{background:linear-gradient(180deg,rgba(3,3,5,.78) 0%,rgba(3,3,5,.9) 62%,rgba(3,3,5,.97) 100%)}
  .home-projects[data-preview-active="true"] .home-project:not([data-preview-current="true"]){opacity:.9}
  .home-project h3,.home-project h3 a{font-size:clamp(1.85rem,8.4vw,2.8rem)!important}
  .home-project__summary{font-size:1rem!important}
}
@media (forced-colors:active){
  .home-project::after{display:none}
  .home-project{background:Canvas;color:CanvasText}
}

/* Phase 71 — restore project preview visibility without sacrificing text contrast */
.home-project{
  background:transparent;
}
.home-project::after{
  background:linear-gradient(90deg,
    rgba(4,4,6,.84) 0%,
    rgba(4,4,6,.68) 36%,
    rgba(4,4,6,.24) 64%,
    rgba(4,4,6,.06) 100%);
}
.home-project[data-preview-current="true"]::after{
  background:linear-gradient(90deg,
    rgba(3,3,5,.82) 0%,
    rgba(3,3,5,.64) 38%,
    rgba(3,3,5,.18) 68%,
    rgba(3,3,5,.04) 100%);
}
.home-projects__preview::after{
  background:linear-gradient(90deg,
    rgba(3,3,5,.62) 0%,
    rgba(3,3,5,.42) 38%,
    rgba(3,3,5,.12) 70%,
    rgba(3,3,5,.04) 100%);
}
.home-projects__preview img,
.home-projects__preview video{
  filter:brightness(.82) saturate(.9) contrast(1.05);
  will-change:opacity,transform;
}
.home-projects[data-preview-active="true"] .home-projects__preview :is(img,video).is-visible{
  opacity:1;
  visibility:visible;
}
@media (max-width:47.99rem){
  .home-project{background:#08080a}
  .home-project::after,
  .home-project[data-preview-current="true"]::after{
    background:linear-gradient(180deg,
      rgba(3,3,5,.5) 0%,
      rgba(3,3,5,.68) 46%,
      rgba(3,3,5,.9) 100%);
  }
  .home-projects__preview::after{
    background:linear-gradient(180deg,
      rgba(3,3,5,.34) 0%,
      rgba(3,3,5,.52) 46%,
      rgba(3,3,5,.82) 100%);
  }
  .home-projects__preview img,
  .home-projects__preview video{
    filter:brightness(.76) saturate(.88) contrast(1.06);
  }
}

/* Phase 72 — mobile project card legibility and CTA reconstruction */
@media (max-width:47.99rem){
  .home-projects__inner{
    width:100%;
    padding-block:clamp(3.5rem,12vw,5rem);
  }
  .home-projects__header{
    width:min(100% - 2rem,42rem);
    margin-inline:auto;
    margin-bottom:2rem;
  }
  .home-projects__heading{
    gap:1.15rem;
  }
  .home-projects__heading p{
    max-width:34ch;
    color:rgba(255,255,255,.76);
    font-size:clamp(1.05rem,4.5vw,1.22rem);
    line-height:1.55;
  }
  .home-projects__list{
    border-top-color:rgba(255,255,255,.18);
  }
  .home-project{
    grid-template-columns:2rem minmax(0,1fr);
    gap:.9rem;
    padding:1.75rem 1rem 1.9rem;
    min-height:0;
    background:#08080a;
    border-bottom-color:rgba(255,255,255,.16);
  }
  .home-project::after{
    background:linear-gradient(180deg,rgba(5,5,7,.18) 0%,rgba(5,5,7,.36) 35%,rgba(5,5,7,.72) 100%);
  }
  .home-project[data-preview-current="true"]{
    min-height:clamp(31rem,128vw,39rem);
    align-content:end;
    padding-top:clamp(7.5rem,34vw,12rem);
    background:transparent;
  }
  .home-project[data-preview-current="true"]::after{
    background:linear-gradient(180deg,
      rgba(3,3,5,.08) 0%,
      rgba(3,3,5,.16) 24%,
      rgba(3,3,5,.54) 56%,
      rgba(3,3,5,.90) 82%,
      rgba(3,3,5,.97) 100%);
  }
  .home-projects__preview::after{
    background:linear-gradient(180deg,
      rgba(3,3,5,.08) 0%,
      rgba(3,3,5,.14) 28%,
      rgba(3,3,5,.42) 62%,
      rgba(3,3,5,.78) 100%);
  }
  .home-projects__preview img,
  .home-projects__preview video{
    filter:brightness(.9) saturate(.94) contrast(1.04);
    object-position:center center!important;
  }
  .home-projects[data-preview-active="true"] .home-project:not([data-preview-current="true"]){
    opacity:1;
  }
  .home-project__index{
    padding-top:.25rem;
    color:rgba(157,255,152,.92)!important;
    font-size:.78rem!important;
    line-height:1;
  }
  .home-project__content{
    gap:.68rem;
  }
  .home-project__meta,
  .home-project[data-preview-current="true"] .home-project__meta{
    color:rgba(255,255,255,.76)!important;
    font-size:clamp(.72rem,3vw,.82rem)!important;
    font-weight:750;
    letter-spacing:.11em;
    line-height:1.45;
    text-shadow:0 2px 16px rgba(0,0,0,.85);
  }
  .home-project h3,
  .home-project h3 a,
  .home-project[data-preview-current="true"] h3,
  .home-project[data-preview-current="true"] h3 a{
    color:#fff!important;
    font-size:clamp(2rem,9.2vw,2.85rem)!important;
    line-height:.95!important;
    letter-spacing:-.045em;
    text-shadow:0 3px 26px rgba(0,0,0,.88);
  }
  .home-project__summary,
  .home-project[data-preview-current="true"] .home-project__summary{
    display:-webkit-box;
    max-width:34rem!important;
    color:rgba(255,255,255,.9)!important;
    font-size:clamp(1rem,4.15vw,1.12rem)!important;
    font-weight:500;
    line-height:1.55!important;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:4;
    text-shadow:0 2px 18px rgba(0,0,0,.9);
  }
  .home-project__actions{
    grid-column:2;
    width:100%;
    display:grid!important;
    grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
    gap:.65rem;
    margin-top:.75rem;
  }
  .home-project__action,
  .home-project__action:link,
  .home-project__action:visited{
    width:100%;
    min-height:3.15rem;
    padding:.82rem .9rem!important;
    border-radius:.85rem;
    font-size:.74rem!important;
    line-height:1;
    letter-spacing:.075em;
    text-decoration:none!important;
    box-shadow:none;
  }
  .home-project__action span{
    text-decoration:none!important;
    border:0!important;
  }
  .home-project__action--primary,
  .home-project[data-preview-current="true"] .home-project__action--primary{
    background:#fff!important;
    color:#08080a!important;
    border-color:#fff!important;
    box-shadow:0 12px 30px rgba(0,0,0,.3);
  }
  .home-project__action--demo,
  .home-project[data-preview-current="true"] .home-project__action--demo{
    background:rgba(14,14,17,.66)!important;
    color:#fff!important;
    border-color:rgba(255,255,255,.58)!important;
    box-shadow:0 12px 30px rgba(0,0,0,.22);
    -webkit-backdrop-filter:blur(16px) saturate(120%);
    backdrop-filter:blur(16px) saturate(120%);
  }
  .home-project__action i{
    font-size:1rem;
  }
}

@media (max-width:23.5rem){
  .home-projects__header{width:min(100% - 1.25rem,42rem)}
  .home-project{padding-inline:.65rem;grid-template-columns:1.65rem minmax(0,1fr);gap:.65rem}
  .home-project__actions{grid-template-columns:1fr}
  .home-project__action{min-height:3rem}
}

/* Phase 73 — mobile project card architecture hotfix
   Fixes: missing mobile preview, excessive left gutter, clipped CTA labels,
   weak hierarchy and unstable two-column button layout. */
@media (max-width:47.99rem){
  .home-projects{
    overflow:clip;
  }

  .home-projects__inner{
    width:100%!important;
    padding-block:clamp(3.25rem,11vw,4.75rem)!important;
  }

  .home-projects__header{
    width:auto!important;
    margin:0 clamp(1.25rem,5vw,1.75rem) 2.25rem!important;
  }

  .home-projects__list{
    width:100%!important;
    margin-left:0!important;
  }

  .home-project{
    position:relative;
    z-index:3;
    display:grid!important;
    grid-template-columns:1fr!important;
    align-content:start;
    gap:0!important;
    width:100%;
    padding:1.65rem clamp(1.25rem,5vw,1.75rem) 1.85rem!important;
    background:#08080a;
    overflow:hidden;
  }

  .home-project::after{
    content:"";
    position:absolute;
    z-index:-1;
    inset:0;
    pointer-events:none;
    background:linear-gradient(180deg,rgba(5,5,7,.06) 0%,rgba(5,5,7,.28) 45%,rgba(5,5,7,.82) 100%)!important;
  }

  .home-project[data-preview-current="true"]{
    min-height:clamp(35rem,142vw,43rem)!important;
    padding-top:clamp(10.5rem,46vw,15rem)!important;
    align-content:end;
    background:transparent!important;
  }

  .home-project[data-preview-current="true"]::after{
    background:linear-gradient(180deg,
      rgba(3,3,5,.05) 0%,
      rgba(3,3,5,.10) 24%,
      rgba(3,3,5,.44) 54%,
      rgba(3,3,5,.88) 79%,
      rgba(3,3,5,.98) 100%)!important;
  }

  .home-projects__preview{
    z-index:2!important;
    width:100%!important;
    left:0!important;
    transform:none!important;
    background:#0a0a0c;
  }

  .home-projects__preview::after{
    z-index:2;
    background:linear-gradient(180deg,
      rgba(3,3,5,.02) 0%,
      rgba(3,3,5,.08) 30%,
      rgba(3,3,5,.38) 62%,
      rgba(3,3,5,.82) 100%)!important;
  }

  .home-projects__preview img,
  .home-projects__preview video{
    filter:brightness(.92) saturate(.96) contrast(1.04)!important;
    object-position:center center!important;
  }

  .home-project__index{
    position:absolute;
    top:1.7rem;
    left:clamp(1.25rem,5vw,1.75rem);
    z-index:4;
    padding:0!important;
    color:#9dff98!important;
    font-size:.78rem!important;
    font-weight:800;
    line-height:1;
    letter-spacing:.16em;
    text-shadow:0 2px 14px rgba(0,0,0,.9);
  }

  .home-project__content{
    display:grid;
    gap:.68rem!important;
    width:100%;
    min-width:0;
  }

  .home-project__meta,
  .home-project[data-preview-current="true"] .home-project__meta{
    max-width:30rem;
    padding-left:3rem;
    color:rgba(255,255,255,.8)!important;
    font-size:clamp(.72rem,3.2vw,.84rem)!important;
    font-weight:780;
    letter-spacing:.115em;
    line-height:1.45;
    text-wrap:balance;
  }

  .home-project h3,
  .home-project h3 a,
  .home-project[data-preview-current="true"] h3,
  .home-project[data-preview-current="true"] h3 a{
    max-width:none!important;
    color:#fff!important;
    font-size:clamp(2.15rem,10.2vw,3.2rem)!important;
    line-height:.98!important;
    letter-spacing:-.05em!important;
    overflow-wrap:anywhere;
  }

  .home-project__summary,
  .home-project[data-preview-current="true"] .home-project__summary{
    display:-webkit-box;
    width:100%;
    max-width:36rem!important;
    overflow:hidden;
    color:rgba(255,255,255,.92)!important;
    font-size:clamp(1.02rem,4.35vw,1.16rem)!important;
    font-weight:500;
    line-height:1.55!important;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:4;
    text-shadow:0 2px 18px rgba(0,0,0,.92);
  }

  .home-project__actions{
    grid-column:1!important;
    display:grid!important;
    grid-template-columns:minmax(0,1.35fr) minmax(7.25rem,.8fr)!important;
    gap:.65rem!important;
    width:100%!important;
    min-width:0;
    margin-top:1.15rem!important;
  }

  .home-project__action,
  .home-project__action:link,
  .home-project__action:visited{
    display:flex!important;
    width:100%!important;
    min-width:0;
    min-height:3.35rem!important;
    margin:0!important;
    padding:.85rem .95rem!important;
    justify-content:center!important;
    border-radius:.85rem!important;
    font-size:clamp(.68rem,3vw,.78rem)!important;
    font-weight:800!important;
    line-height:1.15!important;
    letter-spacing:.07em!important;
    white-space:nowrap;
    overflow:hidden;
  }

  .home-project__action span{
    position:static!important;
    width:auto!important;
    height:auto!important;
    overflow:visible!important;
    clip:auto!important;
    white-space:nowrap!important;
    text-decoration:none!important;
  }

  .home-project__action i{
    flex:0 0 auto;
    font-size:1rem!important;
  }
}

@media (max-width:25rem){
  .home-project__actions,
  .home-project[data-preview-current="true"] .home-project__actions{
    grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr)!important;
    gap:.55rem!important;
  }
  .home-project__action,
  .home-project__action:link,
  .home-project__action:visited{
    min-height:3.15rem!important;
    padding:.68rem .58rem!important;
    font-size:clamp(.62rem,2.7vw,.72rem)!important;
    letter-spacing:.035em!important;
  }
  .home-project__meta{
    padding-left:2.7rem;
  }
}

/* Phase 74 — mobile preview reliability and horizontal CTA system */
@media (max-width:47.99rem){
  .home-projects__preview{
    z-index:2!important;
    opacity:1!important;
    background:#0a0a0c!important;
  }
  .home-project[data-preview-current="true"]{
    background:transparent!important;
  }
  .home-projects__preview img.is-visible,
  .home-projects__preview video.is-visible{
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
    transform:scale(1)!important;
  }
  .home-projects__preview video{
    object-fit:cover!important;
    object-position:center center!important;
  }
  .home-project__actions,
  .home-project[data-preview-current="true"] .home-project__actions{
    display:grid!important;
    grid-template-columns:minmax(0,1.45fr) minmax(0,.8fr)!important;
    align-items:stretch!important;
    gap:.625rem!important;
    width:100%!important;
    max-width:none!important;
    margin-top:1rem!important;
  }
  .home-project__action,
  .home-project__action:link,
  .home-project__action:visited{
    min-width:0!important;
    min-height:3.25rem!important;
    padding:.75rem .72rem!important;
    border-radius:.78rem!important;
    gap:.42rem!important;
    font-size:clamp(.64rem,2.85vw,.76rem)!important;
    letter-spacing:.045em!important;
    white-space:nowrap!important;
  }
  .home-project__action span{
    min-width:0!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  .home-project__action i{
    font-size:.95rem!important;
  }
}
@media (max-width:22rem){
  .home-project__actions,
  .home-project[data-preview-current="true"] .home-project__actions{
    grid-template-columns:minmax(0,1.55fr) minmax(5.6rem,.75fr)!important;
    gap:.45rem!important;
  }
  .home-project__action,
  .home-project__action:link,
  .home-project__action:visited{
    min-height:3rem!important;
    padding:.65rem .5rem!important;
    font-size:.61rem!important;
    letter-spacing:.025em!important;
  }
}

/* Phase 75 — keep mobile project CTAs horizontal on common phone widths */
@media (max-width:20rem){
  .home-project__actions,
  .home-project[data-preview-current="true"] .home-project__actions{
    grid-template-columns:1fr!important;
  }
}

/* Phase 75.1 — override late mobile CTA stacking rules */
@media (max-width:25rem) and (min-width:20.01rem){
  .home-project__actions,
  .home-project[data-preview-current="true"] .home-project__actions{
    grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr)!important;
    gap:.55rem!important;
  }
  .home-project__action,
  .home-project__action:link,
  .home-project__action:visited{
    min-height:3.15rem!important;
    padding:.68rem .58rem!important;
    font-size:clamp(.62rem,2.7vw,.72rem)!important;
    letter-spacing:.035em!important;
  }
}

/* Phase 76 — definitive mobile CTA row alignment */
@media (max-width:47.99rem){
  .home-project__actions,
  .home-project[data-preview-current="true"] .home-project__actions{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    justify-content:flex-start!important;
    align-items:center!important;
    width:100%!important;
    max-width:100%!important;
    gap:.6rem!important;
    margin-top:1rem!important;
  }

  .home-project__action,
  .home-project__action:link,
  .home-project__action:visited,
  .home-project[data-preview-current="true"] .home-project__action{
    flex:0 0 auto!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    min-height:3.1rem!important;
    padding:.72rem .9rem!important;
    justify-content:center!important;
    border-radius:.78rem!important;
    white-space:nowrap!important;
  }

  .home-project__action--primary{
    min-width:9.8rem!important;
  }

  .home-project__action--demo{
    min-width:6.6rem!important;
  }
}

@media (max-width:22rem){
  .home-project__actions,
  .home-project[data-preview-current="true"] .home-project__actions{
    gap:.4rem!important;
  }

  .home-project__action,
  .home-project__action:link,
  .home-project__action:visited{
    min-height:2.9rem!important;
    padding:.62rem .62rem!important;
    font-size:.6rem!important;
  }

  .home-project__action--primary{
    min-width:8.9rem!important;
  }

  .home-project__action--demo{
    min-width:5.5rem!important;
  }
}


/* Phase 77 — mobile project identity hierarchy + desktop hover-only video */
@media (min-width:48rem){
  .home-projects[data-preview-active="false"] .home-projects__preview{
    opacity:0!important;
  }

  .home-projects[data-preview-active="false"] .home-projects__preview video{
    visibility:hidden!important;
  }
}

@media (max-width:47.99rem){
  .home-project[data-preview-current="true"] .home-project__index{
    top:calc(clamp(10.5rem,46vw,15rem) + .22rem)!important;
    left:clamp(1.25rem,5vw,1.75rem)!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:2rem!important;
    height:1.65rem!important;
    padding:0!important;
    border:1px solid rgba(157,255,152,.45);
    border-radius:999px;
    background:rgba(7,9,8,.54);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    color:#9dff98!important;
    font-size:.7rem!important;
    font-weight:850!important;
    letter-spacing:.08em!important;
    text-shadow:none!important;
  }

  .home-project__meta,
  .home-project[data-preview-current="true"] .home-project__meta{
    min-height:1.65rem;
    padding-left:2.65rem!important;
    display:flex;
    align-items:center;
    max-width:24rem!important;
    color:rgba(255,255,255,.88)!important;
    font-size:clamp(.68rem,2.8vw,.78rem)!important;
    font-weight:800!important;
    letter-spacing:.085em!important;
    line-height:1.35!important;
    text-wrap:pretty;
  }

  .home-project[data-preview-current="true"] .home-project__content{
    gap:.78rem!important;
  }
}

@media (max-width:23rem){
  .home-project[data-preview-current="true"] .home-project__index{
    top:calc(clamp(10.5rem,46vw,15rem) + .16rem)!important;
    width:1.85rem!important;
  }

  .home-project__meta,
  .home-project[data-preview-current="true"] .home-project__meta{
    padding-left:2.4rem!important;
    font-size:.66rem!important;
    letter-spacing:.065em!important;
  }
}


/* Phase 79 — full mobile project copy and deterministic active-media state */
@media (max-width:47.99rem){
  .home-project__summary,
  .home-project[data-preview-current="true"] .home-project__summary{
    display:block!important;
    overflow:visible!important;
    max-height:none!important;
    -webkit-line-clamp:unset!important;
    line-clamp:unset!important;
    text-overflow:clip!important;
  }

  .home-project[data-preview-current="true"]{
    min-height:max(35rem,auto)!important;
    height:auto!important;
  }

  .home-projects[data-preview-active="true"] .home-projects__preview,
  .home-projects[data-preview-active="true"] .home-projects__preview video.is-visible,
  .home-projects[data-preview-active="true"] .home-projects__preview img.is-visible{
    opacity:1!important;
    visibility:visible!important;
  }
}

/* Phase 80 — deterministic inline mobile media + resolved projects footer CTA */
@media (max-width:47.99rem){
  /* The desktop hover preview is not used on touch layouts. Each project owns
     its own media layer, removing the dynamic-source race on iOS Safari. */
  .home-projects__preview{
    display:none!important;
  }

  .home-project--has-mobile-media{
    min-height:clamp(34rem,138vw,43rem)!important;
    padding-top:clamp(10.5rem,43vw,14rem)!important;
    align-content:end!important;
    background:#09090b!important;
  }

  .home-project__mobile-media{
    position:absolute;
    z-index:0;
    inset:0;
    overflow:hidden;
    pointer-events:none;
    background:#0a0a0c;
  }

  .home-project__mobile-media::after{
    content:"";
    position:absolute;
    z-index:2;
    inset:0;
    background:linear-gradient(180deg,
      rgba(3,3,5,.03) 0%,
      rgba(3,3,5,.10) 31%,
      rgba(3,3,5,.42) 58%,
      rgba(3,3,5,.86) 81%,
      rgba(3,3,5,.98) 100%);
  }

  .home-project__mobile-media img,
  .home-project__mobile-media video{
    position:absolute;
    z-index:1;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
    display:block;
    opacity:1;
    visibility:visible;
    filter:brightness(.9) saturate(.96) contrast(1.04);
  }

  .home-project--has-mobile-media > .home-project__index,
  .home-project--has-mobile-media > .home-project__content,
  .home-project--has-mobile-media > .home-project__actions{
    position:relative;
    z-index:3;
  }

  .home-project--has-mobile-media .home-project__index{
    top:calc(clamp(10.5rem,43vw,14rem) + .2rem)!important;
  }

  .home-projects__footer{
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:1rem clamp(1.25rem,5vw,1.75rem) clamp(3.5rem,12vw,5rem)!important;
    border-top:0!important;
  }

  .home-projects__footer .arrow-link{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    min-height:4rem!important;
    margin:0!important;
    padding:1rem 1.15rem!important;
    border:1px solid rgba(255,255,255,.24)!important;
    border-radius:1rem!important;
    background:rgba(255,255,255,.06)!important;
    color:#fff!important;
    font-size:.76rem!important;
    font-weight:800!important;
    letter-spacing:.115em!important;
    line-height:1.2!important;
    text-decoration:none!important;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }

  .home-projects__footer .arrow-link::after{
    display:none!important;
  }

  .home-projects__footer .arrow-link span{
    display:grid;
    place-items:center;
    flex:0 0 2rem;
    width:2rem;
    height:2rem;
    margin-left:1rem;
    border-radius:999px;
    background:#fff;
    color:#09090b;
    font-size:1rem;
  }
}

@media (hover:hover) and (pointer:fine){
  .home-projects__footer .arrow-link:hover{
    background:#fff!important;
    border-color:#fff!important;
    color:#09090b!important;
  }
}


/* Phase 81 — isolate mobile inline media from desktop hover preview */
.home-project__mobile-media{
  display:none;
}

@media (min-width:48rem){
  .home-project__mobile-media,
  .home-project__mobile-media img,
  .home-project__mobile-media video{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    width:0!important;
    height:0!important;
    overflow:hidden!important;
  }
}

@media (max-width:47.99rem){
  .home-project__mobile-media{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
}

/* Phase 82 — mobile tap-to-play media and corrected project identity row */
.home-project__media-toggle{display:none}

@media (max-width:47.99rem){
  .home-project__mobile-media video{
    cursor:default;
  }

  .home-project__media-toggle{
    position:absolute;
    z-index:4;
    top:clamp(1rem,4vw,1.35rem);
    right:clamp(1rem,4vw,1.35rem);
    display:inline-flex;
    align-items:center;
    gap:.55rem;
    min-height:2.75rem;
    padding:.65rem .8rem;
    border:1px solid rgba(255,255,255,.48);
    border-radius:999px;
    background:rgba(7,7,9,.58);
    color:#fff;
    font:inherit;
    font-size:.68rem;
    font-weight:800;
    letter-spacing:.075em;
    line-height:1;
    text-transform:uppercase;
    pointer-events:auto;
    -webkit-backdrop-filter:blur(14px) saturate(125%);
    backdrop-filter:blur(14px) saturate(125%);
    box-shadow:0 10px 30px rgba(0,0,0,.24);
  }

  .home-project__media-toggle:focus-visible{
    outline:3px solid #9dff98;
    outline-offset:3px;
  }

  .home-project__media-toggle-icon{
    position:relative;
    display:block;
    width:.8rem;
    height:.8rem;
    flex:0 0 .8rem;
  }

  .home-project__media-toggle-icon::before{
    content:"";
    position:absolute;
    inset:0;
    margin:auto;
    width:0;
    height:0;
    border-top:.34rem solid transparent;
    border-bottom:.34rem solid transparent;
    border-left:.52rem solid currentColor;
    transform:translateX(.06rem);
  }

  .home-project[data-mobile-video-playing] .home-project__media-toggle-icon::before{
    width:.58rem;
    height:.68rem;
    border:0;
    background:linear-gradient(90deg,currentColor 0 34%,transparent 34% 66%,currentColor 66% 100%);
    transform:none;
  }

  .home-project--has-mobile-media{
    grid-template-columns:2.1rem minmax(0,1fr)!important;
    column-gap:.65rem!important;
  }

  .home-project--has-mobile-media > .home-project__index,
  .home-project--has-mobile-media > .home-project__content,
  .home-project--has-mobile-media > .home-project__actions{
    position:relative!important;
    z-index:3;
  }

  .home-project--has-mobile-media .home-project__index,
  .home-project--has-mobile-media[data-preview-current="true"] .home-project__index{
    grid-column:1!important;
    grid-row:1!important;
    align-self:start!important;
    top:auto!important;
    left:auto!important;
    width:auto!important;
    height:1.65rem!important;
    min-width:2rem!important;
    margin:0!important;
    padding:0!important;
  }

  .home-project--has-mobile-media .home-project__content,
  .home-project--has-mobile-media[data-preview-current="true"] .home-project__content{
    grid-column:2!important;
    grid-row:1!important;
    min-width:0;
  }

  .home-project--has-mobile-media .home-project__meta,
  .home-project--has-mobile-media[data-preview-current="true"] .home-project__meta{
    min-height:1.65rem;
    padding-left:0!important;
    margin:0!important;
  }

  .home-project--has-mobile-media .home-project__actions,
  .home-project--has-mobile-media[data-preview-current="true"] .home-project__actions{
    grid-column:1 / -1!important;
    grid-row:2!important;
  }
}

@media (max-width:23rem){
  .home-project__media-toggle-label{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    white-space:nowrap!important;
    border:0!important;
  }

  .home-project__media-toggle{
    width:2.75rem;
    justify-content:center;
    padding:.65rem;
  }
}

/* Phase 83 — viewport-focused mobile media playback and soft visual transitions */
@media (max-width:47.99rem){
  .home-project__media-toggle{
    display:none!important;
  }

  .home-project__mobile-media img,
  .home-project__mobile-media video{
    opacity:0!important;
    transform:scale(1.035);
    transition:
      opacity .7s cubic-bezier(.22,1,.36,1),
      transform 1.15s cubic-bezier(.22,1,.36,1),
      filter .7s cubic-bezier(.22,1,.36,1);
    will-change:opacity,transform;
  }

  .home-project[data-mobile-media-active] .home-project__mobile-media img,
  .home-project[data-mobile-media-active] .home-project__mobile-media video{
    opacity:1!important;
    transform:scale(1);
    filter:brightness(.94) saturate(1) contrast(1.04);
  }

  .home-project__mobile-media::after{
    transition:background .7s cubic-bezier(.22,1,.36,1),opacity .7s cubic-bezier(.22,1,.36,1);
  }

  .home-project[data-mobile-media-active] .home-project__mobile-media::after{
    background:linear-gradient(180deg,
      rgba(3,3,5,.01) 0%,
      rgba(3,3,5,.08) 31%,
      rgba(3,3,5,.38) 58%,
      rgba(3,3,5,.84) 81%,
      rgba(3,3,5,.98) 100%);
  }
}

@media (max-width:47.99rem) and (prefers-reduced-motion:reduce){
  .home-project__mobile-media img,
  .home-project__mobile-media video,
  .home-project__mobile-media::after{
    transition-duration:.15s!important;
    transform:none!important;
  }
}


/* Phase 85 achievement showcase */
.achievement-showcase{--achievement-panel:#0b0c0b;--achievement-panel-2:#101210;--achievement-line:rgba(255,255,255,.16);--achievement-line-strong:rgba(255,255,255,.28);position:relative;isolation:isolate;overflow:hidden;padding:clamp(5rem,11vh,8.75rem) clamp(1.125rem,4.5vw,5.25rem);background:radial-gradient(circle at 84% 4%,rgba(55,218,55,.08),transparent 31rem),#050505;color:#fff}.achievement-showcase::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);background-size:6rem 6rem;mask-image:linear-gradient(to bottom,transparent,#000 10%,#000 94%,transparent)}.achievement-showcase__frame{width:min(100%,100rem);margin-inline:auto}.achievement-showcase__header{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(20rem,.62fr);gap:clamp(2.5rem,8vw,9.375rem);align-items:end;padding-bottom:clamp(2.75rem,6vh,4.75rem);border-bottom:1px solid var(--achievement-line)}.achievement-showcase__heading{display:grid;gap:1rem}.achievement-showcase__eyebrow{margin:0;display:flex;align-items:center;gap:.75rem;color:#fff;font-size:.75rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase}.achievement-showcase__eyebrow::before{content:"";width:.625rem;height:.625rem;background:var(--accent);box-shadow:0 0 1.125rem rgba(55,218,55,.5)}.achievement-showcase__header h2{margin:0;max-width:65rem;color:#fff;font-size:clamp(4rem,9.4vw,10rem);line-height:.84;letter-spacing:-.074em;font-weight:830;text-wrap:balance}.achievement-showcase__header h2 span{display:block}.achievement-showcase__header h2 span:last-child{color:var(--accent)}.achievement-showcase__intro{margin:0 0 .35rem;max-width:45ch;color:#fff;font-size:clamp(1.125rem,1.25vw,1.375rem);line-height:1.62;letter-spacing:-.018em}.achievement-showcase__records{display:grid}.achievement-record{position:relative;display:grid;grid-template-columns:minmax(18.75rem,.72fr) minmax(0,.92fr) minmax(21.25rem,.78fr);gap:clamp(2.125rem,5.5vw,5.625rem);align-items:center;min-height:clamp(29rem,64vh,43rem);padding-block:clamp(3.375rem,8vh,6rem);border-bottom:1px solid var(--achievement-line);overflow:hidden}.achievement-record::before{content:"";position:absolute;top:-1px;left:0;right:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .72s cubic-bezier(.2,.8,.2,1)}.achievement-record.is-visible::before{transform:scaleX(1)}.achievement-record__metric,.achievement-record__metric-pair{display:grid;gap:1.75rem;align-content:center}.achievement-metric-block{display:grid;gap:.625rem}.achievement-metric-block+.achievement-metric-block{padding-top:1.625rem;border-top:1px solid var(--achievement-line)}.achievement-value{display:flex;align-items:flex-start;margin:0;color:var(--accent);font-size:clamp(5rem,8vw,9.625rem);line-height:.72;letter-spacing:-.092em;font-weight:840;white-space:nowrap;font-variant-numeric:tabular-nums}.achievement-value--single{font-size:clamp(6.5rem,12vw,13.625rem)}.achievement-value span{font-size:.33em;line-height:1.15}.achievement-value strong{font:inherit}.achievement-value sup{position:relative;top:-.2em;margin-left:.04em;font-size:.29em;letter-spacing:-.02em}.achievement-unit{max-width:28ch;color:#fff;font-size:.8125rem;line-height:1.55;font-weight:800;letter-spacing:.15em;text-transform:uppercase}.achievement-record__copy{max-width:45rem}.achievement-record__meta{margin:0 0 1.125rem;color:#fff;font-size:.75rem;line-height:1.5;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.achievement-record__copy h3{margin:0;max-width:42.5rem;color:#fff;font-size:clamp(2.125rem,3.75vw,4.125rem);line-height:.96;letter-spacing:-.052em;font-weight:770;text-wrap:balance}.achievement-record__copy>p:last-child{margin:clamp(1.375rem,3vh,2rem) 0 0;max-width:62ch;color:#fff;font-size:clamp(1.0625rem,1.08vw,1.25rem);line-height:1.7;letter-spacing:-.012em}.achievement-evidence{min-width:0;border:1px solid var(--achievement-line-strong);border-radius:1.625rem;background:linear-gradient(180deg,rgba(255,255,255,.035),transparent),var(--achievement-panel);padding:clamp(1.375rem,2.2vw,2.125rem);overflow:hidden}.achievement-evidence__head{display:flex;justify-content:space-between;gap:1.125rem;align-items:center;padding-bottom:1.125rem;border-bottom:1px solid var(--achievement-line);color:#fff;font-size:.6875rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.achievement-evidence__head span:last-child{opacity:.82}.achievement-music-cases{display:grid;gap:.875rem;margin-top:1.5rem}.achievement-music-case{position:relative;min-height:9.25rem;padding:1.25rem;border:1px solid var(--achievement-line);border-radius:1rem;background:var(--achievement-panel-2);display:grid;align-content:start;gap:.625rem;opacity:0;transform:translateY(1.375rem);transition:opacity .6s ease var(--delay),transform .65s cubic-bezier(.2,.8,.2,1) var(--delay),border-color .3s ease}.achievement-record.is-visible .achievement-music-case{opacity:1;transform:none}.achievement-music-case__label{color:var(--accent);font-size:.625rem;line-height:1.45;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.achievement-music-case h4{margin:0;color:#fff;font-size:clamp(1.25rem,1.6vw,1.6875rem);line-height:1.05;letter-spacing:-.035em}.achievement-music-case p{margin:0;max-width:34ch;color:#fff;font-size:.875rem;line-height:1.58}.achievement-flow{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:.25rem}.achievement-flow span{display:inline-flex;align-items:center;min-height:2.125rem;padding:.5rem .6875rem;border:1px solid var(--achievement-line);border-radius:999px;color:#fff;background:#0b0c0b;font-size:.625rem;line-height:1.2;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.achievement-flow i{color:var(--accent);font-style:normal}.achievement-seo-audit{margin-top:1.5rem;border:1px solid var(--achievement-line);border-radius:1.125rem;overflow:hidden;background:var(--achievement-panel-2)}.achievement-seo-browser{display:flex;align-items:center;gap:.5rem;min-height:2.625rem;padding:0 .875rem;border-bottom:1px solid var(--achievement-line)}.achievement-seo-browser i{width:.4375rem;height:.4375rem;border-radius:50%;background:rgba(255,255,255,.28)}.achievement-seo-browser span{margin-left:.375rem;color:#fff;font-size:.625rem;font-weight:750;letter-spacing:.08em;opacity:.8}.achievement-seo-snippet{padding:1.25rem;display:grid;gap:.5625rem;border-bottom:1px solid var(--achievement-line)}.achievement-seo-snippet small{color:var(--accent);font-size:.625rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.achievement-seo-snippet strong{color:#fff;font-size:1.25rem;line-height:1.15;letter-spacing:-.025em}.achievement-seo-snippet p{margin:0;color:#fff;font-size:.8125rem;line-height:1.55}.achievement-seo-checks{display:grid;padding:.5rem 1.25rem 1rem}.achievement-seo-check{display:grid;grid-template-columns:1.5rem 1fr;gap:.625rem;align-items:center;min-height:2.75rem;border-bottom:1px solid rgba(255,255,255,.08);color:#fff;font-size:.75rem;font-weight:700;opacity:0;transform:translateX(-.75rem);transition:opacity .45s ease var(--delay),transform .55s cubic-bezier(.2,.8,.2,1) var(--delay)}.achievement-seo-check:last-child{border-bottom:0}.achievement-seo-check b{width:1.375rem;height:1.375rem;border:1px solid var(--accent);border-radius:50%;display:grid;place-items:center;color:var(--accent);font-size:.75rem}.achievement-record.is-visible .achievement-seo-check{opacity:1;transform:none}.achievement-product-list{display:grid;gap:.75rem;margin-top:1.5rem}.achievement-product{min-height:6.5rem;padding:1.125rem;border:1px solid var(--achievement-line);border-radius:1rem;background:var(--achievement-panel-2);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:1.25rem;opacity:0;transform:translateY(1.375rem);transition:opacity .55s ease var(--delay),transform .6s cubic-bezier(.2,.8,.2,1) var(--delay),border-color .3s ease}.achievement-record.is-visible .achievement-product{opacity:1;transform:none}.achievement-product>div{display:grid;gap:.4375rem}.achievement-product strong{color:#fff;font-size:1.0625rem;line-height:1.15}.achievement-product span{color:var(--accent);font-size:.625rem;line-height:1.4;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.achievement-product b{width:2.125rem;height:2.125rem;border:1px solid var(--accent);border-radius:50%;display:grid;place-items:center;color:var(--accent);font-size:.6875rem;font-weight:850}.achievement-award-card{margin-top:1.5rem;position:relative;min-height:16.875rem;border:1px solid var(--accent);border-radius:1.125rem;padding:1.625rem;background:radial-gradient(circle at 84% 15%,rgba(55,218,55,.11),transparent 11rem),var(--achievement-panel-2);display:grid;align-content:space-between;gap:1.25rem;overflow:hidden}.achievement-award-card>span{color:var(--accent);font-size:.6875rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.achievement-award-card>strong{max-width:18ch;color:#fff;font-size:clamp(1.75rem,2.4vw,2.625rem);line-height:.98;letter-spacing:-.04em}.achievement-award-card>p{margin:0;max-width:34ch;color:#fff;font-size:.8125rem;line-height:1.55}.achievement-award-card footer{display:flex;justify-content:space-between;gap:1.125rem;align-items:end;color:#fff;font-size:.6875rem;line-height:1.5;font-weight:700}.achievement-award-card footer i{width:3.375rem;height:3.375rem;border-radius:50%;border:1px solid var(--accent);display:grid;place-items:center;color:var(--accent);font-size:1.625rem;font-style:normal;transform:scale(0) rotate(-12deg);transition:transform .7s cubic-bezier(.2,.9,.25,1.35) .5s}.achievement-record.is-visible .achievement-award-card footer i{transform:scale(1) rotate(0)}.achievement-showcase.is-motion-ready [data-achievement-reveal]{opacity:0;transform:translateY(2.625rem);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.75,.2,1)}.achievement-showcase.is-motion-ready .achievement-record.is-visible [data-achievement-reveal]{opacity:1;transform:none}.achievement-showcase.is-motion-ready .achievement-record [data-achievement-reveal]:nth-child(2){transition-delay:.1s}.achievement-showcase.is-motion-ready .achievement-record [data-achievement-reveal]:nth-child(3){transition-delay:.18s}@media(hover:hover){.achievement-music-case:hover,.achievement-product:hover{border-color:var(--accent)}}@media(max-width:73.75rem){.achievement-showcase__header{grid-template-columns:1fr;gap:1.875rem}.achievement-showcase__intro{max-width:60ch}.achievement-record{grid-template-columns:minmax(15rem,.46fr) minmax(0,1fr)}.achievement-evidence{grid-column:1/-1;width:100%}}@media(max-width:45rem){.achievement-showcase{padding:4.25rem 1.125rem 5.125rem}.achievement-showcase__header{padding-bottom:2.5rem}.achievement-showcase__eyebrow{font-size:.625rem;line-height:1.5}.achievement-showcase__header h2{font-size:clamp(3.625rem,17.5vw,5.5rem);line-height:.87}.achievement-showcase__intro{font-size:1.0625rem;line-height:1.66}.achievement-record{grid-template-columns:1fr;min-height:auto;gap:1.875rem;padding-block:3.125rem}.achievement-record__metric-pair{grid-template-columns:1fr 1fr;gap:1rem}.achievement-metric-block+.achievement-metric-block{padding-top:0;padding-left:1rem;border-top:0;border-left:1px solid var(--achievement-line)}.achievement-value{font-size:clamp(3.625rem,18vw,5.375rem)}.achievement-value--single{font-size:clamp(5.75rem,29vw,8.625rem)}.achievement-unit{font-size:.625rem;letter-spacing:.1em}.achievement-record__meta{font-size:.625rem}.achievement-record__copy h3{font-size:clamp(2.125rem,10.7vw,3.125rem);line-height:.98}.achievement-record__copy>p:last-child{font-size:1.0625rem;line-height:1.68}.achievement-evidence{padding:1.25rem;border-radius:1.25rem}.achievement-evidence__head{font-size:.625rem}.achievement-flow{gap:.4375rem}.achievement-flow span{font-size:.5625rem;padding:.4375rem .5625rem}.achievement-product{grid-template-columns:1fr;align-items:start}.achievement-award-card{min-height:15rem}}@media(max-width:26.25rem){.achievement-record__metric-pair{grid-template-columns:1fr}.achievement-metric-block+.achievement-metric-block{padding-top:1.25rem;padding-left:0;border-top:1px solid var(--achievement-line);border-left:0}}@media(prefers-reduced-motion:reduce){.achievement-showcase *,.achievement-showcase *::before,.achievement-showcase *::after{animation:none!important;transition:none!important}.achievement-showcase [data-achievement-reveal],.achievement-music-case,.achievement-seo-check,.achievement-product{opacity:1!important;transform:none!important}.achievement-award-card footer i{transform:none!important}}

/* Phase 86 — achievement content accuracy and responsive header refinement */
.achievement-showcase__header--solo{
  grid-template-columns:minmax(0,1fr);
  gap:0;
  align-items:start;
  padding-bottom:clamp(2rem,4vh,3.25rem);
}
.achievement-showcase__header--solo .achievement-showcase__heading{
  max-width:62rem;
}
.achievement-showcase__header h2{
  max-width:62rem;
  font-size:clamp(3rem,5vw,6rem);
  line-height:.9;
  letter-spacing:-.06em;
}
.achievement-showcase__intro{
  max-width:50ch;
  align-self:end;
}

.achievement-seo-workflow{
  position:relative;
  display:grid;
  gap:.75rem;
  margin-top:1.5rem;
}
.achievement-seo-step{
  position:relative;
  display:grid;
  grid-template-columns:2rem minmax(0,1fr) auto;
  gap:.875rem;
  align-items:center;
  min-height:7.25rem;
  padding:1rem;
  border:1px solid var(--achievement-line);
  border-radius:1rem;
  background:var(--achievement-panel-2);
  overflow:hidden;
  opacity:0;
  transform:translateY(1rem);
  transition:
    opacity .55s ease var(--delay),
    transform .65s cubic-bezier(.2,.8,.2,1) var(--delay),
    border-color .3s ease;
}
.achievement-seo-step::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(105deg,transparent 0 42%,rgba(55,218,55,.14) 50%,transparent 58% 100%);
  transform:translateX(-120%);
}
.achievement-record.is-visible .achievement-seo-step{
  opacity:1;
  transform:none;
}
.achievement-record.is-visible .achievement-seo-step::after{
  animation:achievementSeoScan 1.15s ease calc(var(--delay) + .25s) both;
}
.achievement-seo-step__index{
  color:var(--accent);
  font-size:.6875rem;
  font-weight:850;
  letter-spacing:.12em;
}
.achievement-seo-step>div{
  display:grid;
  gap:.4rem;
}
.achievement-seo-step strong{
  color:#fff;
  font-size:1rem;
  line-height:1.15;
  letter-spacing:-.02em;
}
.achievement-seo-step p{
  margin:0;
  max-width:40ch;
  color:#fff;
  font-size:.75rem;
  line-height:1.55;
}
.achievement-seo-step>i{
  min-width:3.15rem;
  min-height:2rem;
  padding:.45rem .65rem;
  border:1px solid var(--accent);
  border-radius:999px;
  display:grid;
  place-items:center;
  color:var(--accent);
  font-size:.6875rem;
  font-style:normal;
  font-weight:850;
  letter-spacing:.08em;
}
.achievement-seo-route{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto;
  gap:.625rem;
  align-items:center;
  min-height:3.75rem;
  padding:.875rem 1rem;
  border:1px dashed rgba(55,218,55,.55);
  border-radius:1rem;
  color:#fff;
  background:rgba(55,218,55,.035);
  opacity:0;
  transform:translateY(.75rem);
  transition:opacity .55s ease .62s,transform .65s cubic-bezier(.2,.8,.2,1) .62s;
}
.achievement-record.is-visible .achievement-seo-route{
  opacity:1;
  transform:none;
}
.achievement-seo-route span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.6875rem;
  font-weight:750;
  letter-spacing:.02em;
}
.achievement-seo-route b{
  color:var(--accent);
  font-size:1rem;
}
.achievement-seo-route em{
  padding:.35rem .5rem;
  border-radius:.5rem;
  color:#050505;
  background:var(--accent);
  font-size:.625rem;
  font-style:normal;
  font-weight:900;
}
@keyframes achievementSeoScan{
  to{transform:translateX(120%)}
}

@media(hover:hover){
  .achievement-seo-step:hover{border-color:var(--accent)}
}

@media(max-width:73.75rem){
  .achievement-showcase__header h2{
    max-width:52rem;
    font-size:clamp(3rem,7vw,5.5rem);
  }
}

@media(max-width:45rem){
  .achievement-showcase__header--solo{
    padding-bottom:2rem;
  }
  .achievement-showcase__header h2{
    max-width:100%;
    font-size:clamp(2.75rem,12vw,4.25rem);
    line-height:.92;
    letter-spacing:-.055em;
  }
  .achievement-showcase__heading{
    gap:.75rem;
  }
  .achievement-seo-step{
    grid-template-columns:1.75rem minmax(0,1fr);
    align-items:start;
    min-height:0;
    padding:.9rem;
  }
  .achievement-seo-step>i{
    grid-column:2;
    justify-self:start;
    min-width:2.75rem;
  }
  .achievement-seo-step p{
    font-size:.8125rem;
  }
  .achievement-seo-route{
    grid-template-columns:minmax(0,1fr) auto;
  }
  .achievement-seo-route b{
    display:none;
  }
  .achievement-seo-route span:nth-of-type(2){
    grid-column:1;
  }
  .achievement-seo-route em{
    grid-column:2;
    grid-row:1 / span 2;
  }
}

@media(prefers-reduced-motion:reduce){
  .achievement-seo-step,
  .achievement-seo-route{
    opacity:1!important;
    transform:none!important;
  }
  .achievement-seo-step::after{display:none!important}
}

/* Phase 87 — homepage gallery editorial film strip.
   One gallery source, two-line desktop headline, contact-surface palette and
   input-aware motion. */
.gallery-preview{
  --gallery-surface:#efefec;
  --gallery-ink:#0b0b0b;
  --gallery-muted:#4d4d4a;
  --gallery-line:rgba(11,11,11,.14);
  position:relative;
  min-height:min(58rem,92svh);
  display:grid;
  align-content:center;
  overflow:hidden;
  padding-block:clamp(5.5rem,9vh,8.5rem);
  color:var(--gallery-ink)!important;
  background:var(--gallery-surface)!important;
  border-top:1px solid var(--gallery-line)!important;
  box-shadow:0 0 0 100vmax var(--gallery-surface);
  clip-path:inset(0 -100vmax);
}
.gallery-preview > .section-shell{
  width:min(calc(100% - (var(--home-gutter) * 2)),var(--home-content-max));
  margin-inline:auto;
}
.gallery-preview__header{
  display:grid;
  grid-template-columns:minmax(0,1.42fr) minmax(20rem,.58fr);
  gap:clamp(3rem,7vw,8rem);
  align-items:end;
  margin-bottom:clamp(2.75rem,5.8vh,5.25rem);
}
.gallery-preview__heading{
  min-width:0;
}
.gallery-preview__heading .section-kicker{
  margin:0 0 clamp(1.1rem,2vw,1.75rem);
  color:#686865;
}
.gallery-preview__header h2{
  width:100%;
  max-width:none!important;
  margin:0;
  color:var(--gallery-ink);
  font-size:clamp(3.4rem,5.15vw,5.9rem)!important;
  line-height:.88;
  letter-spacing:-.068em;
  text-wrap:initial;
}
.gallery-preview__title-line{
  display:block;
  white-space:nowrap;
}
.gallery-preview__intro{
  display:grid;
  justify-items:start;
  gap:clamp(1.35rem,2.5vw,2rem);
  align-self:end;
  padding-bottom:.2rem;
}
.gallery-preview__description{
  max-width:40ch;
  margin:0;
  color:var(--gallery-muted)!important;
  font-size:clamp(1.08rem,1.35vw,1.38rem);
  font-weight:480;
  line-height:1.58;
  letter-spacing:-.012em;
}
.gallery-preview__cta{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:1.25rem;
  min-width:min(100%,18rem);
  min-height:3.85rem;
  padding:.55rem .6rem .55rem 1.35rem;
  border:1px solid #0b0b0b;
  border-radius:999px;
  color:#fff;
  background:#0b0b0b;
  font-size:clamp(1rem,1.1vw,1.12rem);
  font-weight:760;
  letter-spacing:-.018em;
  text-decoration:none;
  transition:transform .35s cubic-bezier(.2,.75,.25,1),background-color .25s ease,color .25s ease;
}
.gallery-preview__cta i{
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 2.75rem;
  width:2.75rem;
  height:2.75rem;
  border-radius:50%;
  color:#071007;
  background:var(--accent,#37da37);
  font-size:1.15rem;
  font-style:normal;
  transition:transform .35s cubic-bezier(.2,.75,.25,1);
}
.gallery-ribbon{
  display:flex;
  justify-content:center;
  gap:clamp(.55rem,1vw,1rem);
  width:min(112rem,calc(100% + 5rem));
  margin:0 auto;
  padding:1rem 0 clamp(2.2rem,4vh,3.5rem);
  perspective:100rem;
  transform:none;
}
.gallery-ribbon__item{
  --gallery-ry:0deg;
  --gallery-ty:0rem;
  position:relative;
  z-index:1;
  flex:0 1 clamp(10.5rem,18vw,20.5rem);
  width:clamp(10.5rem,18vw,20.5rem);
  min-width:0;
  color:#fff;
  text-decoration:none;
  transform:rotateY(var(--gallery-ry)) translateY(var(--gallery-ty));
  transform-style:preserve-3d;
  transition:opacity .38s ease,filter .38s ease,translate .48s cubic-bezier(.2,.75,.25,1);
  will-change:translate;
}
.gallery-ribbon__item:nth-child(1){--gallery-ry:15deg;--gallery-ty:1.9rem}
.gallery-ribbon__item:nth-child(2){--gallery-ry:8deg;--gallery-ty:.65rem}
.gallery-ribbon__item:nth-child(3){z-index:2}
.gallery-ribbon__item:nth-child(4){--gallery-ry:-8deg;--gallery-ty:.65rem}
.gallery-ribbon__item:nth-child(5){--gallery-ry:-15deg;--gallery-ty:1.9rem}
.gallery-ribbon__reveal{
  display:block;
  height:100%;
}
.gallery-ribbon figure{
  position:relative;
  height:100%;
  margin:0;
  overflow:hidden;
  border:1px solid rgba(11,11,11,.12);
  border-radius:clamp(.9rem,1.15vw,1.25rem);
  background:#121212;
  box-shadow:0 1.1rem 2.8rem rgba(17,17,17,.13);
  isolation:isolate;
}
.gallery-ribbon__media{
  display:block;
  height:100%;
  overflow:hidden;
  aspect-ratio:3/4;
  background:#151515;
}
.gallery-ribbon img{
  display:block;
  width:100%;
  height:100%;
  aspect-ratio:3/4;
  object-fit:cover;
  transform:scale(1.015);
  transition:transform .75s cubic-bezier(.2,.75,.25,1),filter .45s ease;
}
.gallery-ribbon figcaption{
  position:absolute;
  z-index:2;
  inset:auto .8rem .8rem;
  display:grid;
  gap:.25rem;
  padding:.85rem .9rem;
  border:1px solid rgba(255,255,255,.17);
  border-radius:.8rem;
  color:#fff;
  background:rgba(8,8,8,.68);
  box-shadow:0 .75rem 2rem rgba(0,0,0,.2);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  opacity:0;
  transform:translateY(.75rem);
  transition:opacity .35s ease,transform .45s cubic-bezier(.2,.75,.25,1);
}
.gallery-ribbon figcaption span{
  color:rgba(255,255,255,.7);
  font-size:.66rem;
  font-weight:750;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.gallery-ribbon figcaption strong{
  overflow:hidden;
  font-size:clamp(.95rem,1.2vw,1.15rem);
  line-height:1.12;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.gallery-ribbon__item:focus-visible{
  outline:3px solid var(--gallery-ink);
  outline-offset:.38rem;
  border-radius:1.25rem;
}

@media(hover:hover) and (pointer:fine){
  .gallery-preview__cta:hover,
  .gallery-preview__cta:focus-visible{
    transform:translateY(-3px);
  }
  .gallery-preview__cta:hover i,
  .gallery-preview__cta:focus-visible i{
    transform:rotate(45deg);
  }
  .gallery-ribbon:has(.gallery-ribbon__item:hover) .gallery-ribbon__item:not(:hover){
    opacity:.55;
    filter:saturate(.7);
  }
  .gallery-ribbon__item:hover{
    z-index:8;
    translate:0 -.9rem;
  }
  .gallery-ribbon__item:hover img{
    transform:scale(1.075);
  }
  .gallery-ribbon__item:hover figcaption,
  .gallery-ribbon__item:focus-visible figcaption{
    opacity:1;
    transform:translateY(0);
  }
}

@media(max-width:64rem){
  .gallery-preview{
    min-height:auto;
    padding-block:clamp(4.75rem,10vw,7rem);
  }
  .gallery-preview__header{
    grid-template-columns:1fr;
    gap:clamp(2rem,5vw,3.25rem);
  }
  .gallery-preview__header h2{
    max-width:14ch!important;
    font-size:clamp(3rem,7.7vw,5.1rem)!important;
  }
  .gallery-preview__title-line{
    white-space:normal;
  }
  .gallery-preview__description{
    max-width:48ch;
  }
}

@media(max-width:47.99rem){
  .gallery-preview{
    padding-block:clamp(4rem,17vw,6rem);
  }
  .gallery-preview__header{
    margin-bottom:2rem;
  }
  .gallery-preview__header h2{
    max-width:12ch!important;
    font-size:clamp(2.7rem,11.7vw,4.35rem)!important;
    line-height:.91;
    letter-spacing:-.06em;
  }
  .gallery-preview__intro{
    gap:1.25rem;
  }
  .gallery-preview__description{
    max-width:34ch;
    font-size:clamp(1.05rem,4.8vw,1.2rem);
    line-height:1.52;
  }
  .gallery-preview__cta{
    width:100%;
    min-width:0;
    min-height:4rem;
    font-size:1.05rem;
  }
  .gallery-ribbon{
    justify-content:flex-start;
    gap:1rem;
    width:100%;
    margin:0;
    padding:1rem var(--home-gutter) 2.2rem;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    scroll-padding-inline:var(--home-gutter);
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
    perspective:none;
  }
  .gallery-ribbon::-webkit-scrollbar{display:none}
  .gallery-ribbon__item,
  .gallery-ribbon__item:nth-child(n){
    flex:0 0 min(81vw,22rem);
    width:min(81vw,22rem);
    transform:none!important;
    translate:0 0!important;
    scroll-snap-align:center;
    opacity:.66;
    filter:saturate(.76);
    transition:opacity .35s ease,filter .35s ease,scale .35s cubic-bezier(.2,.75,.25,1);
    scale:.965;
  }
  .gallery-ribbon__item.is-active{
    z-index:2;
    opacity:1;
    filter:none;
    scale:1;
  }
  .gallery-ribbon figcaption{
    opacity:1;
    transform:none;
  }
}

@media(prefers-reduced-motion:reduce){
  .gallery-preview__cta,
  .gallery-preview__cta i,
  .gallery-ribbon__item,
  .gallery-ribbon img,
  .gallery-ribbon figcaption,
  .gallery-ribbon__reveal{
    animation:none!important;
    transition-duration:.01ms!important;
    transform:none!important;
    translate:none!important;
  }
  .gallery-ribbon__item{opacity:1!important;filter:none!important;scale:1!important}
}

/* Neutralize the legacy figure-level 3D transform; Phase 87 owns geometry on
   .gallery-ribbon__item so entrance and hover layers never fight each other. */
.gallery-ribbon .gallery-ribbon__item figure{
  width:100%;
  transform:none!important;
}
.gallery-preview__header{
  grid-template-columns:minmax(0,1fr) minmax(20rem,27rem);
}
.gallery-preview__header h2{
  font-size:clamp(3.25rem,4vw,4.7rem)!important;
}
@media(max-width:64rem){
  .gallery-preview__header{grid-template-columns:1fr}
  .gallery-preview__header h2{font-size:clamp(3rem,7.7vw,5.1rem)!important}
}
@media(max-width:47.99rem){
  .gallery-preview__header h2{font-size:clamp(2.7rem,11.7vw,4.35rem)!important}
}

/* ---- Phase 88: project header CTA + optical arrow alignment -------------
   The full-projects action now sits inside the section's decision zone,
   rather than after the complete project list. Both editorial CTAs share one
   pill-and-orb interaction model while preserving section-specific contrast. */
.home-projects__header-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(18rem,21rem);
  gap:clamp(2.5rem,7vw,8rem);
  align-items:end;
}
.home-projects__heading{
  max-width:52rem;
}
.home-projects__cta{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  justify-self:end;
  gap:1.25rem;
  width:100%;
  min-height:4rem;
  padding:.55rem .6rem .55rem 1.4rem;
  border:1px solid rgba(255,255,255,.92);
  border-radius:999px;
  color:#09090b;
  background:#fff;
  box-shadow:0 .85rem 2.4rem rgba(0,0,0,.2);
  font-size:clamp(1rem,1.08vw,1.12rem);
  font-weight:760;
  letter-spacing:-.018em;
  line-height:1.15;
  text-decoration:none;
  transition:transform .35s cubic-bezier(.2,.75,.25,1),background-color .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.home-projects__cta i,
.gallery-preview__cta i{
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 2.75rem;
  width:2.75rem;
  height:2.75rem;
  padding:0;
  border-radius:50%;
  color:#071007;
  background:var(--accent,#37da37);
  font-style:normal;
  line-height:1;
  transform-origin:50% 50%;
  transition:transform .35s cubic-bezier(.2,.75,.25,1);
}
/* Draw the north-east arrow with CSS instead of a Unicode glyph.
   iOS may promote ↗ to an emoji presentation even inside a text-only UI. */
.home-projects__cta i::before,
.gallery-preview__cta i::before{
  content:"";
  position:absolute;
  width:.9rem;
  height:.13rem;
  border-radius:999px;
  background:currentColor;
  transform:rotate(-45deg);
  transform-origin:center;
}
.home-projects__cta i::after,
.gallery-preview__cta i::after{
  content:"";
  position:absolute;
  width:.48rem;
  height:.48rem;
  border-top:.13rem solid currentColor;
  border-right:.13rem solid currentColor;
  transform:translate(.21rem,-.21rem);
}

@media(hover:hover) and (pointer:fine){
  .home-projects__cta:hover,
  .home-projects__cta:focus-visible{
    transform:translateY(-3px);
    box-shadow:0 1.15rem 3rem rgba(0,0,0,.28);
  }
  .home-projects__cta:hover i,
  .home-projects__cta:focus-visible i,
  .gallery-preview__cta:hover i,
  .gallery-preview__cta:focus-visible i{
    transform:rotate(45deg);
  }
}

@media(max-width:64rem){
  .home-projects__header-row{
    grid-template-columns:minmax(0,1fr) minmax(17rem,19rem);
    gap:clamp(2rem,5vw,4rem);
  }
}

@media(max-width:47.99rem){
  .home-projects__header-row{
    grid-template-columns:1fr;
    gap:1.5rem;
  }
  .home-projects__cta{
    justify-self:stretch;
    width:100%;
    max-width:none;
    min-height:4rem;
    font-size:1.05rem;
  }
}

@media(prefers-reduced-motion:reduce){
  .home-projects__cta,
  .home-projects__cta i,
  .gallery-preview__cta i{
    transition-duration:.01ms!important;
  }
}

/* ---- Phase 89: section rhythm, shared eyebrow system and surface parity --- */
:root{
  --home-editorial-surface:#efefec;
  --home-editorial-ink:#0b0b0b;
  --home-eyebrow-light:rgba(255,255,255,.78);
  --home-eyebrow-dark:#4f504c;
  --home-eyebrow-line-light:rgba(255,255,255,.34);
  --home-eyebrow-line-dark:rgba(11,11,11,.28);
}

/* Remove the dead band after the project index. The achievement section now
   starts directly after the final project row, while keeping its own internal
   header breathing room. */
.home-projects__inner{
  padding-bottom:0!important;
}
.home-projects__list{
  margin-bottom:0!important;
}
.home-projects + .achievement-showcase{
  border-top:1px solid rgba(255,255,255,.12)!important;
}

/* Work Layers and Photo are intentionally one continuous editorial surface. */
.work-layers,
.gallery-preview{
  background:var(--home-editorial-surface)!important;
}
.work-layers{
  --wl-bg:var(--home-editorial-surface);
  border-bottom:0!important;
}
.work-layers + .gallery-preview,
.gallery-preview + .work-layers{
  border-top-color:rgba(11,11,11,.12)!important;
}

/* Shared section eyebrow architecture. It is contrast-aware, but geometry,
   weight, spacing and marker treatment remain identical across the homepage. */
.identity-profile .section-kicker,
.home-projects .section-kicker,
.achievement-showcase__eyebrow,
.work-layers .section-kicker,
.gallery-preview .section-kicker,
.contact-editorial__kicker{
  display:flex!important;
  align-items:center!important;
  gap:.7rem!important;
  margin-top:0!important;
  font-size:clamp(.69rem,.66rem + .12vw,.78rem)!important;
  font-weight:760!important;
  line-height:1.2!important;
  letter-spacing:.145em!important;
  text-transform:uppercase!important;
}
.identity-profile .section-kicker::before,
.home-projects .section-kicker::before,
.achievement-showcase__eyebrow::before,
.work-layers .section-kicker::before,
.gallery-preview .section-kicker::before,
.contact-editorial__kicker::before{
  content:""!important;
  display:block!important;
  flex:0 0 1.6rem!important;
  width:1.6rem!important;
  height:1px!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}

/* Dark surfaces */
.home-projects .section-kicker,
.achievement-showcase__eyebrow{
  color:var(--home-eyebrow-light)!important;
}
.home-projects .section-kicker::before,
.achievement-showcase__eyebrow::before{
  background:var(--home-eyebrow-line-light)!important;
}

/* Light surfaces */
.identity-profile .section-kicker,
.work-layers .section-kicker,
.gallery-preview .section-kicker,
.contact-editorial__kicker{
  color:var(--home-eyebrow-dark)!important;
}
.identity-profile .section-kicker::before,
.work-layers .section-kicker::before,
.gallery-preview .section-kicker::before,
.contact-editorial__kicker::before{
  background:var(--home-eyebrow-line-dark)!important;
}

@media(max-width:47.99rem){
  .home-projects__inner{padding-bottom:0!important}
  .identity-profile .section-kicker,
  .home-projects .section-kicker,
  .achievement-showcase__eyebrow,
  .work-layers .section-kicker,
  .gallery-preview .section-kicker,
  .contact-editorial__kicker{
    font-size:.68rem!important;
    letter-spacing:.13em!important;
  }
}


/* Phase 88 · print, CSP and deterministic reveal timing */
@media print{
  .skip-link{display:none!important}
}

.lede-mark--delay-0{--lede-delay:0ms}
.lede-mark--delay-1{--lede-delay:70ms}
.lede-mark--delay-2{--lede-delay:140ms}
.lede-mark--delay-3{--lede-delay:210ms}
.lede-mark--delay-4{--lede-delay:280ms}
.lede-mark--delay-5{--lede-delay:350ms}
.lede-mark--delay-6{--lede-delay:420ms}
.lede-mark--delay-7{--lede-delay:490ms}

.achievement-music-case--delay-1{--delay:140ms}
.achievement-music-case--delay-2{--delay:300ms}
.achievement-seo-step--delay-1{--delay:120ms}
.achievement-seo-step--delay-2{--delay:260ms}
.achievement-seo-step--delay-3{--delay:400ms}
.achievement-product--delay-1{--delay:240ms}
.achievement-product--delay-2{--delay:360ms}
.achievement-product--delay-3{--delay:480ms}

/* Commerce Hub project · isolated interactive-demo gateway */
@layer components{
.commerce-demo-gateway{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(22rem,.82fr);
  gap:clamp(2rem,6vw,6rem);
  align-items:start;
  margin-top:var(--space-xl);
  padding:clamp(2rem,5vw,5rem);
  border:1px solid var(--line);
  background:linear-gradient(145deg,var(--ink-soft),var(--ink-deep));
}
.commerce-demo-gateway__intro h2{
  max-width:13ch;
  margin:var(--space-s) 0;
  font-size:var(--step-3);
}
.commerce-demo-gateway__intro>p:not(.section-kicker){
  max-width:54ch;
  color:var(--paper-muted);
  line-height:1.65;
}
.commerce-demo-gateway__primary{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  min-width:min(100%,22rem);
  margin-top:var(--space-m);
  padding:1rem 1.15rem;
  border:1px solid var(--paper-bright);
  border-radius:999px;
  background:var(--paper-bright);
  color:var(--ink);
  font-size:var(--step--1);
  font-weight:750;
  letter-spacing:.08em;
  text-decoration:none;
  text-transform:uppercase;
  transition:transform .25s var(--ease),background .25s var(--ease);
}
.commerce-demo-gateway__primary:hover{transform:translateY(-3px);background:var(--accent)}
.commerce-demo-gateway__primary i{font-size:1.15rem;font-style:normal}
.commerce-demo-gateway__choices{display:grid;gap:1px;background:var(--line)}
.commerce-demo-choice{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:1rem;
  align-items:start;
  min-height:13rem;
  padding:1.4rem;
  background:var(--ink-raised);
  color:var(--paper);
  text-decoration:none;
  transition:background .25s var(--ease),color .25s var(--ease),transform .25s var(--ease);
}
.commerce-demo-choice:hover{z-index:1;transform:translateX(-.4rem);background:var(--paper-bright);color:var(--ink)}
.commerce-demo-choice--admin{background:#e9ecef;color:#11151b}
.commerce-demo-choice__number{color:currentColor;font-size:.68rem;font-weight:800;letter-spacing:.12em}
.commerce-demo-choice p{margin:0 0 .7rem;color:currentColor;font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.62}
.commerce-demo-choice h3{margin:0 0 .8rem;font-size:clamp(1.8rem,3vw,3.2rem)}
.commerce-demo-choice div>span{display:block;max-width:33ch;color:currentColor;font-size:var(--step--1);line-height:1.45;opacity:.72}
.commerce-demo-choice>i{font-size:1.3rem;font-style:normal}
}
@media(max-width:63.99rem){
  .commerce-demo-gateway{grid-template-columns:1fr}
  .commerce-demo-gateway__intro h2{max-width:16ch}
}
@media(max-width:47.99rem){
  .commerce-demo-gateway{margin-inline:calc(var(--space-s) * -1);padding:var(--space-m) var(--space-s)}
  .commerce-demo-gateway__primary{width:100%;min-width:0}
  .commerce-demo-choice{min-height:11rem;padding:1.1rem}
  .commerce-demo-choice:hover{transform:none}
}

/* ---- Phase 90: deterministic skill alignment + content-driven project height ---- */
/* Skill copy starts from a shared top baseline. Variable paragraph/title length
   may grow downward, but no card can push a shorter title toward the bottom. */
.identity-profile__skill{
  justify-content:flex-start;
  gap:clamp(1.65rem,2.45vw,2.35rem);
}
.identity-profile__skill > div:last-child{
  align-self:stretch;
}

/* The project section is strictly content-sized. Published records with no usable
   title/slug are filtered in the template, and removing a project cannot leave a
   reserved row or viewport-height dead band behind. */
.home-projects,
.home-projects__inner,
.home-projects__list{
  height:auto!important;
  min-height:0!important;
}
.home-projects__list:empty{
  display:none;
  border:0;
}

@media (max-width:47.99rem){
  .identity-profile__skill{
    gap:1.45rem;
  }
}

/* Shared analytics / marketing consent panel */
.tracking-consent[hidden]{display:none!important}
.tracking-consent{
  position:fixed;
  left:max(1rem,env(safe-area-inset-left));
  right:max(1rem,env(safe-area-inset-right));
  bottom:max(1rem,env(safe-area-inset-bottom));
  z-index:9998;
  width:min(calc(100% - 2rem),48rem);
  margin-inline:auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:1rem;
  align-items:end;
  padding:1rem;
  border:1px solid rgba(127,127,127,.28);
  border-radius:1rem;
  background:rgba(18,18,18,.94);
  color:#fff;
  box-shadow:0 20px 55px rgba(0,0,0,.28);
}
@supports (backdrop-filter:blur(18px)){
  .tracking-consent{background:rgba(18,18,18,.86);backdrop-filter:blur(18px) saturate(135%);-webkit-backdrop-filter:blur(18px) saturate(135%)}
}
.tracking-consent__copy{min-width:0}
.tracking-consent__eyebrow{margin:0 0 .28rem;color:rgba(255,255,255,.68);font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.tracking-consent h2{margin:0;font-size:1rem;color:#fff}
.tracking-consent__copy>p:last-child{margin:.4rem 0 0;max-width:58ch;color:rgba(255,255,255,.76);font-size:.86rem;line-height:1.55}
.tracking-consent__actions{display:flex;gap:.55rem;flex-wrap:wrap;justify-content:flex-end}
.tracking-consent__button{min-height:44px;padding:.65rem .9rem;border-radius:.72rem;border:1px solid rgba(255,255,255,.3);font:inherit;font-weight:760;cursor:pointer}
.tracking-consent__button--secondary{background:transparent;color:#fff}
.tracking-consent__button--primary{background:#fff;color:#111;border-color:#fff}
.tracking-consent__button:focus-visible{outline:3px solid #fff;outline-offset:3px}
@media (max-width:42rem){
  .tracking-consent{grid-template-columns:1fr;align-items:stretch;padding:.9rem}
  .tracking-consent__actions{display:grid;grid-template-columns:1fr 1fr}
  .tracking-consent__button{width:100%}
}
@media (max-width:24rem){.tracking-consent__actions{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.tracking-consent{scroll-behavior:auto}}