/* Cooperative — shared styles for every page (menu, footer, buttons, type). Page-only styles stay in each page. */
@font-face{font-family:'Switzer';src:url(/assets/fonts/Switzer-Light.woff2) format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Switzer';src:url(/assets/fonts/Switzer-Regular.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}





:root{
  --ink:#141414; --ink-2:#55524d; --ink-3:#8f8a83;
  --paper:#f5f2ee; --paper-2:#ebe6df; --white:#fcfbf9;
  --line:rgba(20,20,20,.12); --line-dark:rgba(245,242,238,.14);
  --accent:#8f8a83; --ivory:#f4efe8;
  --m:48px; --ease:cubic-bezier(.22,.7,.2,1);
  --font:"PP Neue Montreal","Neue Montreal","Helvetica Neue",Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html.preload *,html.preload *::before,html.preload *::after{transition:none!important}
body{background:var(--paper);color:var(--ink);font-family:var(--font);font-weight:400;letter-spacing:.003em;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.wrap{padding-left:var(--m);padding-right:var(--m)}
.label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;line-height:1.4}
.grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:32px}
.display{font-weight:300;letter-spacing:-.022em;line-height:1.02}
.rv{opacity:0;transform:translateY(24px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.rv.in{opacity:1;transform:none}
:focus-visible{outline:1px solid currentColor;outline-offset:4px}

/* ---------- MENU word + top fade ---------- */
.topnav{position:fixed;top:0;right:0;z-index:40;height:84px;padding:0 var(--m);display:flex;align-items:center;color:var(--ink);transition:color .5s var(--ease)}
.topnav.on-dark{color:#fff}
.nav-menu{font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;padding:6px 0}
.nav-menu span{position:relative;display:inline-block;padding-bottom:3px}
.nav-menu span::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease)}
.nav-menu:hover span::after{transform:scaleX(1);transform-origin:left}

/* ---------- MENU overlay ---------- */
.overlay{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;justify-content:space-between;padding:0 var(--m) 40px;
  background:rgba(245,242,238,.9);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);
  opacity:0;visibility:hidden;transition:opacity .6s var(--ease),visibility 0s .6s}
.overlay.open{opacity:1;visibility:visible;transition:opacity .6s var(--ease)}
.overlay .row{display:flex;justify-content:space-between;align-items:center}
.overlay .row:first-child{height:84px}
.overlay nav{border-top:1px solid var(--line)}
.overlay nav a{display:block;border-bottom:1px solid var(--line);padding:18px 0;font-size:clamp(38px,5.5vw,84px);font-weight:300;letter-spacing:-.022em;line-height:1;transition:padding .5s var(--ease),color .5s}
.overlay nav a:hover{padding-left:20px;color:var(--accent)}
.menu-close{font-size:12px;letter-spacing:.18em;font-weight:500;padding:6px 0;color:var(--ink)}

/* ---------- HERO ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:640px;overflow:hidden;background:#a43c1e;color:var(--ivory)}
.hero-img{position:absolute;inset:0;background:url(/assets/img/hero.webp) 30% 50%/cover no-repeat;transform:scale(1.04);animation:settle 2.4s var(--ease) forwards}
@keyframes settle{to{transform:scale(1)}}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,12,8,.28) 0%,rgba(20,12,8,0) 30%,rgba(20,12,8,0) 55%,rgba(20,12,8,.5) 100%)}
.headline{position:absolute;top:34px;left:var(--m);z-index:3;max-width:560px;font-size:clamp(34px,3.5vw,56px);color:#fff}
.wordmark{position:absolute;left:var(--m);bottom:-1.3vw;z-index:2;font-weight:400;text-transform:uppercase;letter-spacing:-.01em;line-height:.8;font-size:12vw;white-space:nowrap;color:var(--ivory);user-select:none}

/* ---------- SECTION HEAD ---------- */
.sec-head{padding:28px 0 0;color:var(--ink-3)}
.sec-head b{font-weight:400;color:var(--ink)}

/* ---------- ABOUT ---------- */
.intro{padding-bottom:160px}
.intro .lead{grid-column:1/11;margin-top:160px;font-size:clamp(36px,4.4vw,72px)}
.intro .lead em{font-style:normal;color:var(--ink-3)}
.intro .cols{margin-top:96px;padding-top:28px;border-top:1px solid var(--line)}
.intro .cols .label{grid-column:1/4;color:var(--ink-3)}
.intro .cols p{font-size:15px;line-height:1.55;color:var(--ink-2)}
.intro .cols p:nth-of-type(1){grid-column:7/10}
.intro .cols p:nth-of-type(2){grid-column:10/13}

/* ---------- COMPANIES (dark gallery) ---------- */
.companies{background:#0f0e0c;color:var(--ivory);padding-bottom:170px}
.companies .sec-head,.companies .sec-head b{color:rgba(244,239,232,.55)}
.co-head{display:grid;grid-template-columns:repeat(12,1fr);column-gap:32px;align-items:end;margin-top:120px}
.co-head h2{grid-column:1/8;font-size:clamp(44px,5.4vw,88px);color:var(--ivory)}
.co-head p{grid-column:9/13;justify-self:end;max-width:360px;font-size:15px;line-height:1.6;color:rgba(244,239,232,.5)}
.gallery{margin-top:96px;display:grid;grid-template-columns:repeat(3,1fr);gap:32px 24px}
.tile{display:block;color:inherit}
.plate{position:relative;aspect-ratio:4/3;border-radius:3px;overflow:hidden;display:grid;place-items:center;
  background:radial-gradient(120% 95% at 50% 0%,#26231f 0%,#171512 55%,#121110 100%);
  box-shadow:inset 0 0 0 1px rgba(244,239,232,.06),inset 0 1px 0 rgba(244,239,232,.08);transition:box-shadow .8s var(--ease)}
.plate::before{content:"";position:absolute;inset:0;opacity:0;transition:opacity .8s var(--ease);
  background:radial-gradient(420px circle at var(--x,50%) var(--y,50%),rgba(244,239,232,.10),transparent 60%)}
.plate::after{content:"";position:absolute;left:12%;right:12%;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(244,239,232,.35),transparent);opacity:0;transition:opacity .8s var(--ease)}
.tile:hover .plate{box-shadow:inset 0 0 0 1px rgba(244,239,232,.14),inset 0 1px 0 rgba(244,239,232,.14),0 40px 80px -40px rgba(0,0,0,.9)}
.tile:hover .plate::before,.tile:hover .plate::after{opacity:1}
.plate img{position:relative;max-width:62%;width:auto;filter:brightness(0) invert(.93) sepia(.08);opacity:.88;transition:transform 1.1s var(--ease),opacity .6s}
.tile:hover .plate img{transform:scale(1.045);opacity:1}
.t-cat,.t-dom{position:absolute;top:22px;z-index:1;color:rgba(244,239,232,.45);transition:color .6s,opacity .6s,transform .6s var(--ease)}
.t-cat{left:24px}
.t-dom{right:24px;font-size:13px;display:flex;align-items:center;gap:8px;opacity:0;transform:translateY(4px)}
.t-dom svg{width:10px;height:10px;fill:none;stroke:currentColor;stroke-width:1.2}
.tile:hover .t-cat{color:rgba(244,239,232,.7)}
.tile:hover .t-dom{opacity:1;transform:none;color:var(--ivory)}
.tile p{margin-top:18px;font-size:14px;line-height:1.55;color:rgba(244,239,232,.5);max-width:340px;transition:color .6s}
.tile:hover p{color:rgba(244,239,232,.8)}

/* ---------- APPROACH ---------- */
.approach{background:var(--white);padding-bottom:140px}
.approach h2{grid-column:1/9;margin-top:120px;font-size:clamp(38px,4.4vw,72px)}
.approach h2 span{color:var(--ink-3)}
.steps{margin-top:110px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.step{padding:28px 32px 0 0}
.step + .step{padding-left:32px;border-left:1px solid var(--line)}
.step h4{font-weight:400;font-size:24px;letter-spacing:-.015em}
.step p{margin-top:14px;font-size:14px;line-height:1.55;color:var(--ink-2);max-width:280px}

/* ---------- CONTACT ---------- */
.contact{position:relative;overflow:hidden;background:radial-gradient(60% 70% at 85% 30%,rgba(255,255,255,.75),transparent 70%),var(--paper)}
.ct-grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:32px;align-items:end;margin-top:150px}
.ct-grid h2{grid-column:1/8;font-size:clamp(40px,4.8vw,84px);line-height:1}
.ct-grid h2 span{color:var(--ink-3)}
.ct-panel{grid-column:9/13}
.ct-row{display:grid;grid-template-columns:130px 1fr 18px;align-items:center;gap:16px;padding:16px 0;font-size:17px;letter-spacing:-.005em}
.ct-row .label{color:var(--ink-3)}
.ct-row .v{transition:transform .6s var(--ease)}
a.ct-row:hover .v{transform:translateX(6px)}
.ct-row .time{margin-left:12px;color:var(--ink-3)}
.ct-row .ico{position:relative;width:16px;height:16px;overflow:hidden;display:block}
.ct-row .ico svg{position:absolute;inset:0;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:.9;stroke-linecap:round;stroke-linejoin:round;transition:transform .6s var(--ease)}
.ct-row .ico svg:last-child{transform:translate(-100%,100%)}
a.ct-row:hover .ico svg:first-child{transform:translate(100%,-100%)}
a.ct-row:hover .ico svg:last-child{transform:none}
.foot{display:flex;justify-content:space-between;margin-top:150px;padding-top:24px;border-top:1px solid var(--line);color:var(--ink-3)}
.foot a{transition:color .3s}.foot a:hover{color:var(--ink)}
.foot-mark{font-weight:400;text-transform:uppercase;letter-spacing:-.01em;line-height:.78;white-space:nowrap;color:var(--paper-2);margin-top:40px;margin-bottom:-1.4vw;user-select:none}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1000px){
  :root{--m:20px}
  .topnav{height:64px}.overlay .row:first-child{height:64px}
  .grid,.co-head,.ct-grid{grid-template-columns:1fr;row-gap:14px}
  .grid > *,.co-head > *,.ct-grid > *{grid-column:1/-1!important;justify-self:start!important}
  .headline{top:22px;right:92px;font-size:38px}
  .hero-img{background-size:auto 58%;background-position:62% 100%;background-color:#a43c1e}
  .hero-img::before{content:"";position:absolute;left:0;right:0;top:42%;height:90px;background:linear-gradient(180deg,#a43c1e,rgba(164,60,30,0))}
  .hero-shade{background:linear-gradient(180deg,rgba(20,12,8,.35) 0%,rgba(20,12,8,0) 40%,rgba(20,12,8,0) 65%,rgba(20,12,8,.5) 100%)}
  .wordmark{bottom:-1vw}
  .intro .lead,.approach h2{margin-top:80px}
  .intro{padding-bottom:100px}.intro .cols{margin-top:56px}
  .co-head{margin-top:80px;row-gap:20px}
  .gallery{grid-template-columns:1fr 1fr;gap:24px 16px;margin-top:56px}
  .t-dom{opacity:1;transform:none}
  .steps{grid-template-columns:1fr 1fr;row-gap:48px}
  .step:nth-child(3){border-left:0;padding-left:0}
  .ct-grid{margin-top:80px;row-gap:56px}
  .ct-panel{width:100%}
  .foot{flex-direction:column;gap:10px;margin-top:90px}
}
@media (max-width:560px){
  .gallery{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .step + .step{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:28px}
  .ct-row{grid-template-columns:110px 1fr 18px}
}
@media (max-width:1000px) and (min-width:561px){
  .hero-img{background-size:auto 80%;background-position:60% 100%}
  .hero-img::before{top:20%}
}
@media (max-width:560px){
  .hero-img{background-size:auto 64%;background-position:74% 100%}
  .hero-img::before{top:34%}
}
@media (min-width:1001px) and (max-width:1300px){.hero-img{background-position:46% 50%}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}


/* Everything in Neue Montreal Regular */
body,body *{font-family:var(--font)!important;font-weight:400!important}




/* Large text: Neue Montreal Book */
.display,.display *,.overlay nav a{font-family:"PP Neue Montreal Book","PP Neue Montreal","Helvetica Neue",Helvetica,Arial,sans-serif!important;font-weight:400!important;letter-spacing:-.075em!important}

/* Logo wordmarks: heavier weight (Semibold file, closest available to Medium) */
.wordmark,.foot-mark{font-weight:500!important}

/* ===== gallery v2 ===== */
.gallery{gap:72px 28px}
.plate{aspect-ratio:16/11;border-radius:2px;
  background:radial-gradient(90% 80% at 50% 38%,#24211d 0%,#181614 60%,#131210 100%)}
.plate .noise{position:absolute;inset:0;opacity:.05;pointer-events:none;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.plate img{max-width:58%;opacity:.82}
.t-cat{top:20px;left:22px;color:rgba(244,239,232,.38)}
.cap{margin-top:22px;padding-top:18px;border-top:1px solid rgba(244,239,232,.10);transition:border-color .6s var(--ease)}
.tile:hover .cap{border-color:rgba(244,239,232,.28)}
.cap-top{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.cap-name{font-size:17px;color:var(--ivory);letter-spacing:-.01em}
.cap-dom{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:rgba(244,239,232,.45);transition:color .5s}
.cap-dom svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;transition:transform .5s var(--ease)}
.tile:hover .cap-dom{color:var(--ivory)}
.tile:hover .cap-dom svg{transform:translate(2px,-2px)}
.tile .cap p{margin-top:8px;max-width:none;font-size:14px;line-height:1.55;color:rgba(244,239,232,.48);text-wrap:pretty}
.tile:hover .cap p{color:rgba(244,239,232,.72)}
@media (max-width:1000px){.gallery{gap:48px 16px}}

/* one size for all section headlines */
.intro .lead,.co-head h2,.approach h2,.ct-grid h2{font-size:clamp(36px,4.4vw,72px)!important;line-height:1.02!important}

/* ===== Morphed menu ===== */
.mm{position:fixed;top:16px;right:16px;width:440px;height:460px;z-index:60;pointer-events:none}
.mm-panel{position:absolute;top:8px;right:8px;width:110px;height:46px;border-radius:24px;background:#0b0a09;overflow:hidden;
  display:flex;flex-direction:column;justify-content:center;pointer-events:auto;box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.mm-panel.closed{pointer-events:none}
.mm-btn{position:absolute;top:8px;right:8px;width:110px;height:46px;border-radius:25px;overflow:hidden;z-index:2;pointer-events:auto;
  background:#0b0a09;color:#fff;font-size:15px!important;letter-spacing:.06em;transition:background .45s var(--ease),color .45s var(--ease)}
.mm.open .mm-btn{background:#fff;color:#0b0a09}
.mm-strip{display:block;height:46px;transition:transform .7s cubic-bezier(.34,1.3,.5,1)}
.mm.open .mm-strip{transform:translateY(-100%)}
.mm-slot{display:block;height:46px;overflow:hidden;position:relative}
.mm-slot > span{display:flex;align-items:center;justify-content:center;height:46px;transition:transform .55s cubic-bezier(.34,1.25,.5,1)}
.mm-btn:hover .mm-slot > span{transform:translateY(-100%)}
.mm-inner{margin:56px 0 0 40px}
.mm-item{margin-bottom:-4px;perspective:70px;perspective-origin:bottom}
.mm-item a{display:inline-flex;align-items:center;color:#fff;font-size:46px!important;line-height:1.12;letter-spacing:-.03em;
  font-family:"PP Neue Montreal Book","PP Neue Montreal",sans-serif!important;transform-origin:bottom;
  opacity:0;transform:translateY(80px) rotateX(100deg)}
.mm-arrow{width:0;height:28px;fill:none;stroke:#fff;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;flex:none;
  transition:width .5s cubic-bezier(.34,1.25,.5,1),margin .5s cubic-bezier(.34,1.25,.5,1)}
.mm-item a:hover .mm-arrow{width:48px;margin-right:14px}
.mm-foot{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:32px 40px 0 12px}
.mm-foot a{justify-self:start;color:#fff;font-size:18px!important;margin-bottom:8px;opacity:0;transform:translateY(20px);position:relative;padding-bottom:3px}
.mm-foot a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:#fff;transform:scaleX(0);transform-origin:left;transition:transform .55s cubic-bezier(.34,1.2,.5,1)}
.mm-foot a:hover::after{transform:scaleX(1)}
@media (max-width:768px){
  .mm{top:10px;right:10px;width:calc(100vw - 20px);height:62vh}
  .mm-btn,.mm-panel{width:90px;height:40px}
  .mm-strip,.mm-slot,.mm-slot > span{height:40px}
  .mm-btn{font-size:13px!important}
  .mm-inner{margin:52px 0 0 22px}
  .mm-item a{font-size:38px!important}
  .mm-foot{margin:28px 22px 0 4px}
}

/* ===== Liquid glass flip cards ===== */
.companies{position:relative;overflow:hidden}
.lg-gallery{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:96px}
.lg-glow{position:absolute;inset:-10% -8%;z-index:0;pointer-events:none;filter:blur(70px);opacity:.9}
.lg-glow i{position:absolute;border-radius:50%;display:block}
.lg-glow i:nth-child(1){width:42%;height:48%;left:4%;top:8%;background:radial-gradient(circle,#c4552a 0%,rgba(196,85,42,0) 70%);animation:drift1 18s ease-in-out infinite alternate}
.lg-glow i:nth-child(2){width:38%;height:44%;right:6%;top:30%;background:radial-gradient(circle,#7a3b8f 0%,rgba(122,59,143,0) 70%);opacity:.7;animation:drift2 22s ease-in-out infinite alternate}
.lg-glow i:nth-child(3){width:46%;height:40%;left:30%;bottom:0;background:radial-gradient(circle,#d98a3d 0%,rgba(217,138,61,0) 70%);opacity:.6;animation:drift1 26s ease-in-out infinite alternate-reverse}
@keyframes drift1{to{transform:translate(12%,8%) scale(1.08)}}
@keyframes drift2{to{transform:translate(-10%,-6%) scale(1.1)}}
.lg{position:relative;z-index:1;aspect-ratio:360/460;perspective:1400px;outline:none;--rx:0deg;--ry:0deg}
.lg-turn{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform}
.lg-face{position:absolute;inset:0;border-radius:32px;padding:28px;display:flex;flex-direction:column;overflow:hidden;
  backface-visibility:hidden;-webkit-backface-visibility:hidden;color:#fff;isolation:isolate;
  background:linear-gradient(155deg,rgba(255,255,255,.14),rgba(255,255,255,.03) 46%,rgba(255,255,255,.08)),rgba(255,255,255,.04);
  backdrop-filter:blur(8px) saturate(1.45) brightness(1.02);-webkit-backdrop-filter:blur(8px) saturate(1.45) brightness(1.02);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.42),inset 0 -1px 0 rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.07),
    inset 0 18px 30px -22px rgba(255,255,255,.35),inset 0 -24px 40px -30px rgba(0,0,0,.6),
    0 1px 2px rgba(0,0,0,.12),0 18px 34px -20px rgba(0,0,0,.42),0 46px 76px -46px rgba(0,0,0,.46)}
.lg-face::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.25px;z-index:-1;pointer-events:none;
  background:conic-gradient(from 205deg,rgba(255,255,255,.75),rgba(255,255,255,.08) 18%,rgba(0,0,0,.35) 38%,rgba(255,255,255,.12) 55%,rgba(255,255,255,.6) 72%,rgba(255,255,255,.1) 88%,rgba(255,255,255,.75));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.lg-face::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;opacity:.35;
  background:linear-gradient(115deg,transparent 30%,rgba(255,120,180,.18) 40%,rgba(255,200,90,.16) 46%,rgba(90,220,255,.16) 52%,rgba(160,120,255,.16) 58%,transparent 68%);mix-blend-mode:screen}
.lg-back{transform:rotateY(180deg)}
.lg-sheen{position:absolute;top:0;bottom:0;left:-110%;width:220%;z-index:-1;pointer-events:none;opacity:0;
  background:linear-gradient(104deg,transparent 38%,rgba(255,255,255,.18) 46%,rgba(255,255,255,.56) 50%,rgba(255,255,255,.18) 54%,transparent 62%)}
.lg-top{display:flex;justify-content:space-between;align-items:center}
.lg-chip{display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:999px;font-size:12px!important;background:rgba(255,255,255,.12);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);color:rgba(255,255,255,.88)}
.lg-flip{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),inset 0 1px 0 rgba(255,255,255,.3);color:#fff;transition:background .4s,transform .6s var(--ease)}
.lg-flip:hover{background:rgba(255,255,255,.22);transform:rotate(90deg)}
.lg-flip svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.lg-logo{flex:1;display:grid;place-items:center}
.lg-logo img{max-width:64%;width:auto;filter:brightness(0) invert(1);opacity:.95;transform:scale(1.15)}
.lg-name{font-size:15px;color:rgba(255,255,255,.62)}
.lg-backbody{flex:1;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:22px}
.lg-backbody h3{font-weight:400!important;font-size:34px!important;letter-spacing:-.035em;line-height:1.05;font-family:"PP Neue Montreal Book","PP Neue Montreal",sans-serif!important}
.lg-backbody p{margin-top:14px;font-size:15px;line-height:1.5;color:rgba(255,255,255,.7)}
.lg-btn{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 16px 0 20px;border-radius:999px;font-size:14px;
  background:rgba(255,255,255,.92);color:#0f0e0c;box-shadow:inset 0 1px 0 #fff,0 10px 24px -12px rgba(0,0,0,.6);transition:background .4s,transform .5s var(--ease)}
.lg-btn:hover{background:#fff;transform:translateY(-2px)}
.lg-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.lg:focus-visible .lg-face{box-shadow:0 0 0 2px #8FB4FF}
@media (max-width:1000px){.lg-gallery{grid-template-columns:1fr 1fr;gap:16px;margin-top:56px}.lg-face{padding:20px;border-radius:26px}.lg-backbody h3{font-size:26px!important}}
@media (max-width:560px){.lg-gallery{grid-template-columns:1fr}.lg{aspect-ratio:4/4.6}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.lg-face{background:#1d1b19}}
@media (prefers-reduced-transparency:reduce){.lg-face{background:#2a2c33;backdrop-filter:none}}

/* square, slightly smaller glass cards */
.lg{aspect-ratio:1/1!important}
.lg-gallery{gap:24px}
.lg-face{padding:24px;border-radius:28px}
.lg-logo img{transform:none}
.lg-backbody{padding-bottom:18px}
.lg-backbody h3{font-size:30px!important}
@media (max-width:1000px){.lg-face{padding:18px;border-radius:24px}.lg-backbody h3{font-size:24px!important}.lg-backbody p{font-size:14px}}

/* ===== glossy liquid-glass menu ===== */
.mm-panel,.mm-btn{
  background:linear-gradient(155deg,rgba(255,255,255,.16),rgba(255,255,255,.04) 46%,rgba(255,255,255,.09)),rgba(22,20,18,.76);
  backdrop-filter:blur(18px) saturate(1.6) brightness(1.02);-webkit-backdrop-filter:blur(18px) saturate(1.6) brightness(1.02);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -1px 0 rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.08),
    inset 0 14px 24px -18px rgba(255,255,255,.4),inset 0 -20px 30px -24px rgba(0,0,0,.55),
    0 1px 2px rgba(0,0,0,.12),0 18px 34px -20px rgba(0,0,0,.42),0 46px 76px -46px rgba(0,0,0,.46)}
.mm-panel{isolation:isolate}
.mm-panel::before,.mm-btn::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.25px;pointer-events:none;z-index:3;
  background:conic-gradient(from 205deg,rgba(255,255,255,.8),rgba(255,255,255,.08) 18%,rgba(0,0,0,.3) 38%,rgba(255,255,255,.14) 55%,rgba(255,255,255,.62) 72%,rgba(255,255,255,.1) 88%,rgba(255,255,255,.8));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.mm-panel::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;opacity:.4;mix-blend-mode:screen;
  background:linear-gradient(115deg,transparent 30%,rgba(255,120,180,.18) 40%,rgba(255,200,90,.16) 46%,rgba(90,220,255,.16) 52%,rgba(160,120,255,.16) 58%,transparent 68%)}
.mm-btn{color:#fff}
.mm.open .mm-btn{background:linear-gradient(180deg,#fff,#ece9e4);color:#0b0a09;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(0,0,0,.08),0 8px 20px -10px rgba(0,0,0,.5)}
.mm.open .mm-btn::before{opacity:0}
.mm-arrow{stroke-width:3}

.mm-btn{font-size:13px!important;letter-spacing:.08em}
@media (max-width:768px){.mm-btn{font-size:12px!important}}

/* mobile/tablet menu + focus fixes */
.mm-btn:focus,.mm-btn:focus-visible,.mm a:focus,.mm a:focus-visible{outline:none}
.mm-btn:focus-visible{box-shadow:0 0 0 2px rgba(255,255,255,.55),0 0 0 4px rgba(0,0,0,.25)}
.mm-item a:focus-visible span,.mm-foot a:focus-visible span{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
@media (max-width:768px){.mm{width:min(calc(100vw - 20px),440px);height:min(62vh,440px)}}
@media (max-width:1000px){.headline{right:150px!important;max-width:none}}
@media (max-width:560px){.headline{right:118px!important}}

.mm-panel{backdrop-filter:blur(34px) saturate(1.6)!important;-webkit-backdrop-filter:blur(34px) saturate(1.6)!important}

.mm-panel{background:linear-gradient(155deg,rgba(255,255,255,.12),rgba(255,255,255,.03) 46%,rgba(255,255,255,.07)),rgba(20,18,16,.9)!important}

.headline{transition:opacity .45s var(--ease)}
@media (max-width:1000px){html.mm-open .headline{opacity:0}}

/* ===== Approach: light liquid glass ===== */
.approach{position:relative;overflow:hidden}
.lg-steps{position:relative;border-top:0!important;gap:20px;isolation:isolate}
.ap-glow{position:absolute;inset:-30% -6%;z-index:-1;pointer-events:none;filter:blur(60px)}
.ap-glow i{position:absolute;display:block;border-radius:50%}
.ap-glow i:nth-child(1){width:34%;height:90%;left:2%;top:10%;background:radial-gradient(circle,rgba(214,110,58,.55),rgba(214,110,58,0) 70%);animation:drift1 20s ease-in-out infinite alternate}
.ap-glow i:nth-child(2){width:30%;height:80%;left:40%;top:20%;background:radial-gradient(circle,rgba(160,120,200,.35),rgba(160,120,200,0) 70%);animation:drift2 24s ease-in-out infinite alternate}
.ap-glow i:nth-child(3){width:34%;height:90%;right:0;top:0;background:radial-gradient(circle,rgba(230,170,90,.45),rgba(230,170,90,0) 70%);animation:drift1 28s ease-in-out infinite alternate-reverse}
.lg-steps .step{position:relative;padding:28px 26px 34px!important;border:0!important;border-radius:28px;overflow:hidden;isolation:isolate;min-height:250px;
  background:linear-gradient(150deg,rgba(255,255,255,.62),rgba(255,255,255,.22) 46%,rgba(255,255,255,.42)),rgba(255,255,255,.18);
  backdrop-filter:blur(16px) saturate(1.45) brightness(1.03);-webkit-backdrop-filter:blur(16px) saturate(1.45) brightness(1.03);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(0,0,0,.06),inset 0 16px 26px -20px rgba(255,255,255,.9),
    0 1px 2px rgba(0,0,0,.06),0 18px 34px -22px rgba(60,30,10,.28),0 46px 76px -50px rgba(60,30,10,.3);
  transition:transform .7s var(--ease),box-shadow .7s var(--ease)}
.lg-steps .step::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.25px;pointer-events:none;
  background:conic-gradient(from 205deg,rgba(255,255,255,1),rgba(255,255,255,.3) 18%,rgba(0,0,0,.12) 38%,rgba(255,255,255,.5) 55%,rgba(255,255,255,.95) 72%,rgba(255,255,255,.35) 88%,#fff);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.lg-steps .step::after{content:"";position:absolute;top:0;bottom:0;left:-120%;width:120%;z-index:-1;pointer-events:none;
  background:linear-gradient(104deg,transparent 30%,rgba(255,255,255,.75) 50%,transparent 70%);transition:left 1.1s var(--ease)}
.lg-steps .step:hover{transform:translateY(-6px);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(0,0,0,.06),0 30px 50px -26px rgba(60,30,10,.35)}
.lg-steps .step:hover::after{left:120%}
.lg-steps .step h4{margin-top:96px}
.lg-steps .step p{color:var(--ink-2)}
@media (max-width:1000px){.lg-steps{gap:14px}.lg-steps .step{min-height:0}.lg-steps .step h4{margin-top:56px}}
@media (max-width:560px){.lg-steps .step + .step{border-top:0!important;padding-top:28px!important}}

.st-ico{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;
  background:linear-gradient(160deg,rgba(255,255,255,.9),rgba(255,255,255,.4));
  box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(20,20,20,.07),0 6px 14px -8px rgba(60,30,10,.35);color:var(--ink);
  transition:transform .7s var(--ease)}
.st-ico svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round}
.lg-steps .step:hover .st-ico{transform:translateY(-2px) rotate(-6deg)}
.lg-steps .step h4{margin-top:64px!important}
@media (max-width:1000px){.lg-steps .step h4{margin-top:40px!important}}

.st-ico{font-size:13px!important;letter-spacing:.04em;font-family:"PP Neue Montreal Book","PP Neue Montreal",sans-serif!important;line-height:1}
.lg-steps .step:hover .st-ico{transform:translateY(-2px)}

/* serif numerals, no chip */
.st-ico{width:auto!important;height:auto!important;display:block!important;background:none!important;box-shadow:none!important;border-radius:0!important;
  font-family:"Times New Roman",Times,Georgia,serif!important;font-weight:700!important;font-size:46px!important;line-height:1!important;letter-spacing:.02em!important;color:var(--ink)}
.lg-steps .step h4{margin-top:56px!important}
@media (max-width:1000px){.st-ico{font-size:40px!important}.lg-steps .step h4{margin-top:36px!important}}

/* lighter, smaller serif numerals */
.st-ico{font-family:"Times New Roman",Times,Georgia,serif!important;font-weight:400!important;font-size:32px!important;letter-spacing:.06em!important;color:rgba(20,20,20,.82)!important}
@media (max-width:1000px){.st-ico{font-size:28px!important}}

.mm-btn{font-size:12px!important}

/* glossy footer wordmark */
.foot-mark{position:relative;color:transparent!important;
  background:linear-gradient(180deg,#fdfcfa 0%,#ece6dd 34%,#d6cdc1 52%,#e9e2d8 70%,#f7f3ee 100%);
  -webkit-background-clip:text;background-clip:text;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.95)) drop-shadow(0 -1px 0 rgba(60,40,20,.12))}
.foot-mark::after{content:"COOPERATIVE";position:absolute;left:0;top:0;color:transparent;pointer-events:none;
  background:linear-gradient(100deg,transparent 40%,rgba(255,255,255,.95) 50%,transparent 60%) -150% 0/60% 100% no-repeat;
  -webkit-background-clip:text;background-clip:text;animation:fshine 7s ease-in-out infinite}
@keyframes fshine{0%,35%{background-position:-150% 0}75%,100%{background-position:250% 0}}

/* ===================== DARK THEME ===================== */
:root{--ink:#f2eee8;--ink-2:rgba(242,238,232,.66);--ink-3:rgba(242,238,232,.42);--paper:#0c0b0a;--paper-2:#151311;--white:#0f0e0c;--line:rgba(242,238,232,.12)}
body{background:#0c0b0a;color:var(--ink)}
.intro{background:#0c0b0a}
.companies{background:#0f0e0c}
.approach{background:#0c0b0a!important;color:var(--ink)}
.contact{background:radial-gradient(60% 70% at 85% 30%,rgba(196,85,42,.12),transparent 70%),#0c0b0a!important}
.sec-head b{color:var(--ink)}
/* approach: dark glass */
.ap-glow i:nth-child(1){background:radial-gradient(circle,rgba(196,85,42,.55),rgba(196,85,42,0) 70%)!important}
.ap-glow i:nth-child(2){background:radial-gradient(circle,rgba(122,59,143,.45),rgba(122,59,143,0) 70%)!important}
.ap-glow i:nth-child(3){background:radial-gradient(circle,rgba(217,138,61,.4),rgba(217,138,61,0) 70%)!important}
.lg-steps .step{background:linear-gradient(155deg,rgba(255,255,255,.12),rgba(255,255,255,.03) 46%,rgba(255,255,255,.07)),rgba(255,255,255,.035)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -1px 0 rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.06),
    inset 0 18px 30px -22px rgba(255,255,255,.3),0 18px 34px -20px rgba(0,0,0,.6),0 46px 76px -46px rgba(0,0,0,.6)!important}
.lg-steps .step::before{background:conic-gradient(from 205deg,rgba(255,255,255,.75),rgba(255,255,255,.08) 18%,rgba(0,0,0,.35) 38%,rgba(255,255,255,.12) 55%,rgba(255,255,255,.6) 72%,rgba(255,255,255,.1) 88%,rgba(255,255,255,.75))!important}
.lg-steps .step::after{background:linear-gradient(104deg,transparent 30%,rgba(255,255,255,.18) 50%,transparent 70%)!important}
.lg-steps .step p{color:var(--ink-2)!important}
.st-ico{color:rgba(242,238,232,.85)!important}
/* footer wordmark: dark chrome */
.foot-mark{background:linear-gradient(180deg,#2a2622 0%,#1a1816 34%,#3a342e 52%,#1c1a17 70%,#2a2622 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.08)) drop-shadow(0 -1px 0 rgba(0,0,0,.5))!important}
.foot-mark::after{background:linear-gradient(100deg,transparent 40%,rgba(255,255,255,.22) 50%,transparent 60%) -150% 0/60% 100% no-repeat!important;-webkit-background-clip:text!important;background-clip:text!important}
.foot a:hover{color:var(--ink)}

/* ===== smooth section transitions (light) ===== */
.intro{padding-bottom:280px!important;background:linear-gradient(180deg,#f5f2ee 0,#f5f2ee calc(100% - 240px),#0f0e0c 100%)!important}
.companies{padding-bottom:280px!important;background:linear-gradient(180deg,#0f0e0c 0,#0f0e0c calc(100% - 240px),#fcfbf9 100%)!important}
.approach{padding-bottom:200px!important;background:linear-gradient(180deg,#fcfbf9 0,#fcfbf9 calc(100% - 200px),#f5f2ee 100%)!important}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:18%;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(245,242,238,0),rgba(245,242,238,.12))}
@media (max-width:1000px){.intro,.companies{padding-bottom:200px!important}.intro{background:linear-gradient(180deg,#f5f2ee 0,#f5f2ee calc(100% - 170px),#0f0e0c 100%)!important}.companies{background:linear-gradient(180deg,#0f0e0c 0,#0f0e0c calc(100% - 170px),#fcfbf9 100%)!important}}

/* ===== smooth section transitions (dark) ===== */
.intro,.companies,.approach,.contact{background-color:#0c0b0a!important}
.intro,.companies,.approach{background-image:none!important}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:42%;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(12,11,10,0) 0%,rgba(12,11,10,.55) 60%,#0c0b0a 100%)}
.companies,.approach{overflow:visible!important;overflow-x:clip!important}
.lg-glow,.ap-glow{-webkit-mask:linear-gradient(180deg,transparent,#000 25%,#000 75%,transparent);mask:linear-gradient(180deg,transparent,#000 25%,#000 75%,transparent)}
body{overflow-x:hidden}

.contact{background:#0c0b0a!important;overflow-x:clip}
html,body{overflow-x:clip}

/* full, uncropped hero wordmark */
.wordmark{bottom:clamp(20px,2.4vw,40px)!important;line-height:.86!important}
@media (max-width:1000px){.wordmark{bottom:18px!important}}

.wordmark{bottom:clamp(4px,.5vw,10px)!important}
@media (max-width:1000px){.wordmark{bottom:6px!important}}

.wordmark{bottom:0!important;line-height:.745!important}
@media (max-width:1000px){.wordmark{bottom:0!important}}

/* about: no label */
.intro .lead{margin-top:140px!important}
@media (max-width:1000px){.intro .lead{margin-top:72px!important}}
/* ===== contact: liquid glass panel ===== */
.ct-grid{position:relative;isolation:isolate}
.ct-glow{position:absolute;right:-2%;top:-30%;width:46%;height:160%;z-index:-1;pointer-events:none;filter:blur(70px)}
.ct-glow i{position:absolute;display:block;border-radius:50%}
.ct-glow i:nth-child(1){width:70%;height:60%;left:5%;top:15%;background:radial-gradient(circle,rgba(196,85,42,.7),rgba(196,85,42,0) 70%);animation:drift1 20s ease-in-out infinite alternate}
.ct-glow i:nth-child(2){width:60%;height:55%;right:0;bottom:10%;background:radial-gradient(circle,rgba(122,59,143,.55),rgba(122,59,143,0) 70%);animation:drift2 24s ease-in-out infinite alternate}
.ct-panel{position:relative;padding:22px 28px!important;border-radius:28px;overflow:hidden;isolation:isolate;
  background:linear-gradient(155deg,rgba(255,255,255,.13),rgba(255,255,255,.03) 46%,rgba(255,255,255,.08)),rgba(255,255,255,.035);
  backdrop-filter:blur(16px) saturate(1.45);-webkit-backdrop-filter:blur(16px) saturate(1.45);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.42),inset 0 -1px 0 rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.06),
    inset 0 18px 30px -22px rgba(255,255,255,.3),0 18px 34px -20px rgba(0,0,0,.6),0 46px 76px -46px rgba(0,0,0,.6)}
.ct-panel::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.25px;pointer-events:none;
  background:conic-gradient(from 205deg,rgba(255,255,255,.75),rgba(255,255,255,.08) 18%,rgba(0,0,0,.35) 38%,rgba(255,255,255,.12) 55%,rgba(255,255,255,.6) 72%,rgba(255,255,255,.1) 88%,rgba(255,255,255,.75));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.ct-panel::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;opacity:.35;mix-blend-mode:screen;
  background:linear-gradient(115deg,transparent 30%,rgba(255,120,180,.16) 40%,rgba(255,200,90,.14) 46%,rgba(90,220,255,.14) 52%,rgba(160,120,255,.14) 58%,transparent 68%)}
.ct-row + .ct-row{border-top:1px solid rgba(255,255,255,.08)!important}
@media (max-width:1000px){.ct-glow{right:-20%;top:20%;width:110%;height:100%}.ct-panel{padding:16px 20px!important}}

/* no section tags: adjust spacing */
.intro .lead{margin-top:200px!important}
.co-head,.approach h2{margin-top:160px!important}
.ct-grid{margin-top:180px!important}
@media (min-width:1001px){.intro .cols p:nth-of-type(1){grid-column:1/5!important}.intro .cols p:nth-of-type(2){grid-column:6/10!important}}
@media (max-width:1000px){.intro .lead{margin-top:120px!important}.co-head,.approach h2,.ct-grid{margin-top:96px!important}}

.intro{padding-bottom:180px!important}
.companies{padding-bottom:180px!important}
.co-head,.approach h2{margin-top:120px!important}
.approach{padding-bottom:160px!important}
.ct-grid{margin-top:140px!important}
@media (max-width:1000px){.intro,.companies{padding-bottom:120px!important}.co-head,.approach h2,.ct-grid{margin-top:72px!important}}

/* tighter section rhythm */
.intro{padding-bottom:110px!important}
.companies{padding-bottom:120px!important}
.co-head{margin-top:90px!important}
.approach h2{margin-top:90px!important}
.steps{margin-top:72px!important}
.approach{padding-bottom:120px!important}
.ct-grid{margin-top:110px!important}
.foot{margin-top:110px!important}
@media (max-width:1000px){.intro,.companies,.approach{padding-bottom:80px!important}.co-head,.approach h2,.ct-grid{margin-top:56px!important}.steps{margin-top:48px!important}.foot{margin-top:72px!important}}

/* ===== mobile/tablet fixes ===== */
@media (max-width:1000px){
  .intro .cols{display:grid;grid-template-columns:1fr 1fr!important;column-gap:28px!important;row-gap:16px!important}
  .intro .cols p{grid-column:auto!important;font-size:15px;line-height:1.55}
  .co-head p{max-width:520px}
  .foot{flex-direction:row!important;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 20px!important;font-size:10px!important}
  .foot > span:nth-child(2){display:none}
  .foot-mark{margin-top:28px!important}
}
@media (max-width:560px){
  .intro .cols{grid-template-columns:1fr!important}
  .intro .lead{font-size:34px!important}
  .co-head h2,.approach h2,.ct-grid h2{font-size:38px!important}
}

/* original hero image framing */
.hero-img{background-position:70% 82%!important;background-size:cover!important}
@media (max-width:560px){.hero{background:linear-gradient(180deg,#5c1e0c 0%,#70240d 40%,#2a120a 82%,#0c0b0a 100%)!important}
.hero-img{background-size:auto 70%!important;background-position:96% 74%!important;background-color:transparent!important;
 -webkit-mask-image:linear-gradient(180deg,transparent 22%,#000 40%,#000 82%,transparent 94%);mask-image:linear-gradient(180deg,transparent 22%,#000 40%,#000 82%,transparent 94%)}
.hero-img::before,.hero-img::after{display:none!important}}
@media (min-width:561px) and (max-width:1000px){.hero-img::before,.hero-img::after{display:none!important}.hero-img{-webkit-mask-image:none!important;mask-image:none!important}}

/* logo: fixed SVG artwork, independent of the site font */
.wordmark{right:var(--m)!important;font-size:0!important;line-height:0!important;letter-spacing:0!important;bottom:0!important}
.foot-mark{font-size:0!important;line-height:0!important;background:none!important;filter:none!important;margin:40px 0 -1px!important}
.foot-mark::after{display:none!important}
.wm-svg{display:block;width:100%;height:auto;overflow:visible}

/* ===== site font: Switzer (Fontshare); logo is fixed SVG artwork ===== */
html body *,html body .display,html body .display *,html body .overlay nav a,html body .mm-item a,html body .headline,html body .lg-backbody h3{font-family:'Switzer',"Helvetica Neue",Arial,sans-serif!important}
html body .display,html body .display *,html body .overlay nav a,html body .mm-item a,html body .headline{letter-spacing:-.03em!important}

/* hero headline: exactly three lines on desktop */
.headline{max-width:none!important;white-space:nowrap}
.hb{display:inline}
@media (max-width:1000px){.headline{white-space:normal}.hb{display:none}}

/* large text: Switzer Light, faded halves slightly lighter for readability */
html body .display,html body .display *,html body .headline,html body .headline *,html body .mm-item a,html body .lg-backbody h3{font-weight:300!important}
html body .intro .lead em,html body .approach h2 span,html body .ct-grid h2 span{color:rgba(242,238,232,.56)!important}

html body .mm-item a *{font-weight:300!important}

/* ===================== LIQUID METAL BUTTONS (shared) ===================== */
.lm{position:relative;display:inline-block;-webkit-tap-highlight-color:transparent;outline:none;cursor:pointer;perspective:1000px}
.lm-3d{position:relative;display:inline-flex;align-items:center;justify-content:center;height:46px;min-width:46px;padding:0 24px;border-radius:100px;transform-style:preserve-3d}
.lm-rim,.lm-inner{position:absolute;border-radius:100px;transition:transform .8s cubic-bezier(.34,1.56,.64,1),box-shadow .15s cubic-bezier(.4,0,.2,1)}
.lm-rim{inset:0;overflow:hidden;
  box-shadow:0 0 0 1px rgba(0,0,0,.3),0 36px 14px 0 rgba(0,0,0,.02),0 20px 12px 0 rgba(0,0,0,.08),0 9px 9px 0 rgba(0,0,0,.12),0 2px 5px 0 rgba(0,0,0,.15)}
.lm-rim canvas{position:absolute;inset:0;width:100%;height:100%;display:block;border-radius:100px}
.lm-inner{inset:2px;background:linear-gradient(180deg,#202020 0%,#000 100%)}
.lm-label{position:relative;z-index:2;display:inline-flex;align-items:center;gap:6px;font-size:14px!important;font-weight:400!important;letter-spacing:0!important;
  text-transform:none!important;color:#666!important;text-shadow:0 1px 2px rgba(0,0,0,.5);white-space:nowrap;pointer-events:none}
.lm-label svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .5s var(--ease)}
.lm:hover .lm-rim{box-shadow:0 0 0 1px rgba(0,0,0,.4),0 12px 6px 0 rgba(0,0,0,.05),0 8px 5px 0 rgba(0,0,0,.1),0 4px 4px 0 rgba(0,0,0,.15),0 1px 2px 0 rgba(0,0,0,.2)}
.lm:active .lm-rim{transform:translateY(1px) scale(.98);box-shadow:0 0 0 1px rgba(0,0,0,.5),0 1px 2px 0 rgba(0,0,0,.3)}
.lm:active .lm-inner{transform:translateY(1px) scale(.98);box-shadow:inset 0 2px 4px rgba(0,0,0,.4),inset 0 1px 2px rgba(0,0,0,.3)}
.lm:focus-visible .lm-rim{box-shadow:0 0 0 2px rgba(242,238,232,.5)}
.lm.icon .lm-3d{padding:0;width:46px}
.lm-ripple{position:absolute;width:20px;height:20px;border-radius:50%;pointer-events:none;z-index:40;
  background:radial-gradient(circle,rgba(255,255,255,.4) 0%,rgba(255,255,255,0) 70%);animation:lmrip .6s ease-out forwards}
@keyframes lmrip{0%{transform:translate(-50%,-50%) scale(0);opacity:.6}100%{transform:translate(-50%,-50%) scale(4);opacity:0}}
/* menu button as liquid metal */
.mm-btn.lm{position:absolute!important;display:block!important;perspective:none;background:transparent!important;box-shadow:none!important;color:#666!important;overflow:hidden;border-radius:100px}
.mm-btn.lm::before{display:none!important}
.mm.open .mm-btn.lm{background:transparent!important;color:#666!important}
.mm-btn.lm .lm-rim,.mm-btn.lm .lm-inner{z-index:0}
.mm-btn.lm .mm-strip{position:relative;z-index:2}
.mm-btn.lm .mm-slot>span{font-size:14px!important;font-weight:400!important;letter-spacing:0!important;text-transform:none!important;color:#666;text-shadow:0 1px 2px rgba(0,0,0,.5)}
/* card buttons as liquid metal */
.lg-btn.lm{background:none!important;box-shadow:none!important;padding:0!important;height:auto!important;color:inherit}
.lg-btn.lm:hover{transform:none}
.lg-flip.lm{width:auto!important;height:auto!important;background:none!important;box-shadow:none!important;padding:0;border-radius:100px}
.lg-flip.lm:hover{transform:none!important;background:none!important}
.lg-flip.lm:hover .lm-label svg{transform:rotate(90deg)}
.lg-flip.lm .lm-label svg{width:16px;height:16px;stroke-width:1.3}
@media (max-width:1000px){.lg-flip.lm .lm-3d{width:40px;height:40px;min-width:40px}}

/* ===== liquid metal refinements ===== */
.lm-label,.mm-btn.lm .mm-slot>span{color:#a8a39b!important}
.mm.open .mm-btn.lm,.mm-btn.lm{color:#a8a39b!important}
/* inside glass cards: smoky translucent inner pill */
.lg .lm-inner{background:linear-gradient(180deg,rgba(40,37,34,.72) 0%,rgba(12,11,10,.62) 100%);
  backdrop-filter:blur(10px) saturate(1.3);-webkit-backdrop-filter:blur(10px) saturate(1.3);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.lg .lm-label{color:#c9c3ba!important}
.lg .lm-rim{padding:2px;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.lg-flip.lm .lm-rim{padding:1.5px}
/* smaller, quieter flip button */
.lg-flip.lm .lm-3d{width:36px!important;height:36px!important;min-width:36px!important}
.lg-flip.lm .lm-inner{inset:1.5px}
.lg-flip.lm .lm-rim{opacity:.75}
.lg-flip.lm .lm-label svg{width:14px!important;height:14px!important}

/* Close button: smoky glass while the menu is open */
.mm-btn.lm .lm-inner{transition:background .5s var(--ease),box-shadow .5s var(--ease)}
.mm-btn.lm .lm-rim{transition:opacity .5s var(--ease)}
.mm.open .mm-btn.lm .lm-inner{background:linear-gradient(180deg,rgba(40,37,34,.72) 0%,rgba(12,11,10,.62) 100%);
  backdrop-filter:blur(10px) saturate(1.3);-webkit-backdrop-filter:blur(10px) saturate(1.3);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.mm.open .mm-btn.lm .lm-rim{padding:2px;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.mm.open .mm-btn.lm .mm-slot>span{color:#c9c3ba!important}

/* page switch */
html.leaving body{opacity:0;transition:opacity .38s var(--ease)}

/* contact glow: let it fade out naturally instead of being cut at the section edge */
.contact{overflow-x:clip!important;overflow-y:visible!important}

/* ===== company cards: status + description on the front ===== */
.lg-status{display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 12px;border-radius:999px;font-size:12px;color:rgba(255,255,255,.78);background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.lg-status i{width:6px;height:6px;border-radius:50%;background:#7fd6a4;box-shadow:0 0 0 3px rgba(127,214,164,.14),0 0 10px rgba(127,214,164,.55)}
.lg-desc{margin-top:6px;max-width:36ch;font-size:13px;line-height:1.45;color:rgba(255,255,255,.5)}
@media (max-width:560px){.lg-desc{font-size:14px}}

/* ===== intro: what every company gets ===== */
.intro .cols .found{display:flex;flex-direction:column;gap:12px}
.intro .cols .found .label{color:var(--ink-3)}
.intro .cols .found ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;font-size:15px;line-height:1.55;color:var(--ink-2)}
@media (min-width:1001px){.intro .cols .found{grid-column:10/13}}
@media (max-width:1000px){.intro .cols .found{grid-column:1/-1!important;margin-top:12px}
  .intro .cols .found ul{flex-direction:row;flex-wrap:wrap;gap:6px 22px}}

/* ===== contact: who it's for ===== */
.ct-grid h2{grid-row:1}
.ct-panel{grid-row:1/3;align-self:end}
.ct-why{grid-column:1/8;grid-row:2;display:flex;flex-wrap:wrap;gap:10px;margin-top:36px}
.ct-why a{display:inline-flex;align-items:center;gap:10px;height:42px;padding:0 18px;border-radius:999px;font-size:14px;color:var(--ink-2);
  background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 0 0 1px rgba(255,255,255,.09);
  transition:background .45s var(--ease),color .45s var(--ease)}
.ct-why a svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;opacity:.6;transition:transform .5s var(--ease),opacity .45s}
.ct-why a:hover{color:var(--ink);background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.05))}
.ct-why a:hover svg{transform:translate(2px,-2px);opacity:1}
@media (max-width:1000px){.ct-grid h2,.ct-panel,.ct-why{grid-row:auto!important}.ct-why{margin-top:4px}}

/* intro foundation: one quiet line under the two paragraphs */
.intro .cols .found{grid-column:1/-1!important;flex-direction:row!important;flex-wrap:wrap;align-items:baseline;gap:10px 28px!important;margin-top:40px!important;padding-top:22px;border-top:1px solid var(--line)}
.intro .cols .found ul{flex-direction:row!important;flex-wrap:wrap;gap:6px 0!important}
.intro .cols .found li+li::before{content:"·";margin:0 12px;color:var(--ink-3)}
@media (max-width:560px){.intro .cols .found{flex-direction:column!important;gap:12px!important;margin-top:28px!important}}
@media (max-width:560px){.intro .cols .found li+li::before{content:none}.intro .cols .found ul{gap:8px 22px!important}}

/* intro foundation as a path: hairline track, nodes light up in sequence */
.intro .cols .found{display:block!important;border-top:0!important;padding-top:0!important;margin-top:64px!important}
.intro .cols .found .label{display:block;margin-bottom:26px}
.path{--n:5;list-style:none;margin:0;padding:0;position:relative;display:grid;grid-template-columns:repeat(var(--n),1fr)}
.path::before,.path::after{content:"";position:absolute;left:0;right:calc(100% / var(--n) - 9px);top:4px;height:1px}
.path::before{background:var(--line)}
.path::after{background:linear-gradient(90deg,rgba(242,238,232,.15),rgba(242,238,232,.7));transform:scaleX(0);transform-origin:left;transition:transform 1.6s var(--ease) .2s}
.path li{position:relative;padding-right:18px}
.path i{position:relative;z-index:1;display:block;width:9px;height:9px;border-radius:50%;background:#0c0b0a;box-shadow:inset 0 0 0 1px rgba(242,238,232,.28);transition:box-shadow .6s var(--ease),background .6s var(--ease)}
.path span{display:block;margin-top:18px;font-size:15px;line-height:1.4;color:var(--ink-3);transition:color .8s var(--ease)}
.cols.in .path::after{transform:scaleX(1)}
.cols.in .path i{background:#f2eee8;box-shadow:0 0 0 4px rgba(242,238,232,.06),0 0 14px rgba(242,238,232,.35)}
.cols.in .path span{color:var(--ink-2)}
.path li:nth-child(1) i,.path li:nth-child(1) span{transition-delay:.25s}
.path li:nth-child(2) i,.path li:nth-child(2) span{transition-delay:.6s}
.path li:nth-child(3) i,.path li:nth-child(3) span{transition-delay:.95s}
.path li:nth-child(4) i,.path li:nth-child(4) span{transition-delay:1.3s}
.path li:nth-child(5) i,.path li:nth-child(5) span{transition-delay:1.65s}
@media (max-width:560px){
  .intro .cols .found{margin-top:40px!important}
  .path{grid-template-columns:1fr;row-gap:20px;padding-left:2px}
  .path::before,.path::after{left:6px;right:auto;top:6px;bottom:auto;width:1px;height:calc(100% - 26px)}
  .path::after{transform:scaleY(0);transform-origin:top;background:linear-gradient(180deg,rgba(242,238,232,.15),rgba(242,238,232,.7))}
  .cols.in .path::after{transform:scaleY(1)}
  .path li{display:flex;align-items:center;gap:18px;padding:0}
  .path i{flex:none;margin-left:2px}
  .path span{margin-top:0}}
@media (prefers-reduced-motion:reduce){.path::after,.path i,.path span{transition:none!important}}
.intro .cols .found .path li::before{content:none!important;margin:0!important}
@media (max-width:560px){.path::before,.path::after{left:8px!important;top:10px!important;bottom:10px!important;height:auto!important}}

/* liquid metal: CSS fallback when WebGL can't animate (set by site.js) */
.lm.lm-css .lm-rim canvas{display:none}
.lm.lm-css .lm-rim{background:linear-gradient(115deg,#1a1a1a 0%,#d9d9d9 9%,#4a4a4a 18%,#f5f5f5 28%,#262626 38%,#bdbdbd 50%,#1a1a1a 60%,#e6e6e6 70%,#3a3a3a 80%,#fafafa 90%,#1a1a1a 100%);background-size:300% 100%;animation:lmflow 9s linear infinite}
.lm.lm-css:hover .lm-rim{animation-duration:4s}
@keyframes lmflow{from{background-position:0% 0}to{background-position:150% 0}}
@media (prefers-reduced-motion:reduce){.lm.lm-css .lm-rim{animation:none}}

/* small top-left logo (shared menu template) */
.brand{position:fixed;z-index:59;top:24px;left:24px;height:46px;display:flex;align-items:center;padding:0 2px;color:var(--ivory,#f2eee8);
  opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .6s var(--ease),transform .6s var(--ease)}
.brand svg{display:block;height:15px;width:auto}
.brand.on{opacity:.92;transform:none;pointer-events:auto}
.brand.on:hover{opacity:1}
@media (max-width:768px){.brand{top:18px;left:18px;height:40px}.brand svg{height:13px}html.mm-open .brand{opacity:0;pointer-events:none}}
@media (prefers-reduced-motion:reduce){.brand{transition:none}}
/* soft top fade so the small logo stays clean over scrolling text */
body::before{content:"";position:fixed;left:0;right:0;top:0;height:104px;z-index:58;pointer-events:none;opacity:0;transition:opacity .6s var(--ease);
  background:linear-gradient(180deg,rgba(12,11,10,.92) 0%,rgba(12,11,10,.7) 45%,rgba(12,11,10,0) 100%)}
html.brand-on body::before{opacity:1}
@media (max-width:768px){body::before{height:84px}}

/* header on the content edge: logo and Menu both sit on the page margin (48px desktop, 20px phone) */
.mm{right:calc(var(--m) - 8px)!important}
@media (max-width:768px){.mm{width:min(calc(100vw - 2 * (var(--m) - 8px)),440px)!important}}
.brand{left:var(--m)!important;padding:0!important}
/* stronger top fade so cards disappear cleanly under the logo */
body::before{height:132px;background:linear-gradient(180deg,rgba(12,11,10,.98) 0%,rgba(12,11,10,.9) 40%,rgba(12,11,10,.55) 70%,rgba(12,11,10,0) 100%)}
@media (max-width:768px){body::before{height:104px}}
/* small logo size */
.brand svg{height:18px!important}
@media (max-width:768px){.brand svg{height:14px!important}}