/* site.css — shared design tokens + nav + footer + primitives for all
   McMillion Lab pages. Page-specific styles live in each page's own <style>. */
:root{
  --bg:#F6F3EC; --text:#222222; --dim:#5A5650; --line:rgba(34,34,34,0.13);
  --gold:#8C6D2C; --gold-soft:#BE9F5E; --ink:#1A1813;
  --font:'Hanken Grotesk','Helvetica Neue',Helvetica,Arial,sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,monospace;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:90px;}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
img{max-width:100%;}
a{color:inherit;}
.wrap{max-width:1320px;margin:0 auto;width:100%;padding-inline:clamp(24px,5vw,72px);}
.eyebrow{font-size:12.5px;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold);display:inline-block;}

/* nav */
.nav{position:sticky;top:0;z-index:50;transition:background .25s,border-color .25s,backdrop-filter .25s;border-bottom:1px solid transparent;}
.nav.solid,.nav.scrolled{background:rgba(246,243,236,0.82);backdrop-filter:saturate(140%) blur(12px);border-bottom-color:var(--line);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:112px;gap:24px;}
.brand{display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;flex-shrink:0;line-height:1;}
.brand img{display:block;height:auto;width:120px;}
.burst-h{position:relative;display:block;width:120px;}
.burst-top-h{aspect-ratio:526/177;}
.burst-bot-h{aspect-ratio:526/179;}
.burst-h .xw{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:transform .55s cubic-bezier(.2,.7,.3,1);will-change:transform;}
.burst-top-h .xw{transform-origin:50% 101%;}
.burst-bot-h .xw{transform-origin:50% -1%;}
.brand:hover .xw{transform:scale(var(--k,1.1));}
@media (prefers-reduced-motion:reduce){.burst-h .xw{transition:none;}.brand:hover .xw{transform:none;}}
.brand-word{font-family:'Gruppo',sans-serif;font-weight:400;font-size:23px;letter-spacing:0.01em;color:var(--text);line-height:1;white-space:nowrap;margin:2px 0;}
.tabs{display:flex;align-items:center;gap:26px;margin-left:auto;}
.nav-actions{display:flex;align-items:center;gap:16px;flex-shrink:0;}
.nav-search{position:relative;display:flex;align-items:center;}
.search-btn{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);background:transparent;color:var(--dim);cursor:pointer;border-radius:50%;transition:color .18s,border-color .18s,background .18s;}
.search-btn:hover{color:var(--gold);border-color:var(--gold);}
.search-panel{position:absolute;top:calc(100% + 12px);right:0;width:340px;max-width:78vw;background:var(--bg);border:1px solid var(--line);box-shadow:0 16px 40px rgba(34,34,34,0.14);z-index:60;overflow:hidden;}
.search-field{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line);color:var(--dim);}
.search-input{flex:1;border:0;outline:0;background:transparent;font-family:var(--font);font-size:15px;color:var(--text);}
.search-input::placeholder{color:var(--dim);}
.search-empty{padding:16px;font-size:13.5px;color:var(--dim);}
.search-results{list-style:none;margin:0;padding:6px;max-height:340px;overflow-y:auto;}
.search-result{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:10px 12px;text-decoration:none;border-radius:2px;transition:background .15s;}
.search-result:hover{background:rgba(140,109,44,0.09);}
.search-result-title{font-size:14px;font-weight:500;color:var(--text);line-height:1.3;text-wrap:pretty;}
.search-result-page{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);white-space:nowrap;flex-shrink:0;}
.tab{position:relative;font-size:14.5px;font-weight:500;color:var(--dim);text-decoration:none;white-space:nowrap;transition:color .18s;}
.tab::after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:1.5px;background:var(--gold);transition:right .22s cubic-bezier(.2,.7,.3,1);}
.tab:hover{color:var(--gold);}
.tab[data-active="1"]{color:var(--gold);}
.tab:hover::after,.tab[data-active="1"]::after{right:0;}
.tab-cta{font-size:13.5px;font-weight:600;color:var(--gold);text-decoration:none;border:1px solid var(--gold);padding:9px 16px;transition:background .18s,color .18s;white-space:nowrap;}
.tab-cta:hover{background:var(--gold);color:var(--bg);}

/* buttons + links */
.btn{display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-size:15px;font-weight:600;letter-spacing:.01em;white-space:nowrap;transition:transform .18s,box-shadow .18s,background .18s;}
.btn-solid{background:var(--gold);color:var(--bg);padding:15px 26px;}
.btn-solid:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(140,109,44,0.28);}
.btn-arrow{transition:transform .22s cubic-bezier(.2,.7,.3,1);}
.btn:hover .btn-arrow{transform:translateX(4px);}
.textlink{position:relative;text-decoration:none;font-size:15px;font-weight:600;color:var(--gold);background-image:linear-gradient(currentColor,currentColor);background-size:0% 1.5px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .25s;padding-bottom:2px;display:inline-flex;align-items:center;}
.textlink:hover{background-size:100% 1.5px;}

/* section header crystal marker */
.pub-subhead{display:flex;align-items:center;gap:11px;}
.pub-subhead::before{content:"";width:17px;height:21px;flex-shrink:0;background:url('data:image/svg+xml;utf8,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 28%22><polygon points=%2212,2 20,8.5 20,21.5 12,27 4,21.5 4,8.5%22 fill=%22none%22 stroke=%22%238C6D2C%22 stroke-width=%221.6%22 stroke-linejoin=%22round%22/><polyline points=%224,8.5 12,13 20,8.5%22 fill=%22none%22 stroke=%22%238C6D2C%22 stroke-width=%221.4%22 stroke-linejoin=%22round%22/><line x1=%2212%22 y1=%2213%22 x2=%2212%22 y2=%2227%22 stroke=%22%238C6D2C%22 stroke-width=%221.4%22/></svg>') center/contain no-repeat;}

/* footer */
/* page loader */
.page-loader{position:fixed;inset:0;display:grid;place-items:center;background:var(--bg);z-index:9999;}
.page-loader svg{width:52px;height:auto;}
@media (prefers-reduced-motion:no-preference){.page-loader svg{animation:loaderPulse 1.3s ease-in-out infinite;}}
@keyframes loaderPulse{0%,100%{opacity:.38;transform:translateY(2px) scale(.95);}50%{opacity:1;transform:translateY(-3px) scale(1);}}

/* footer */
.footer{background:#F1ECE1;border-top:1px solid var(--line);padding-block:42px;margin-top:0;}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;}
.footer-brand{display:flex;align-items:center;gap:16px;}
.footer-logo{display:flex;flex-direction:column;align-items:center;gap:1px;line-height:1;flex-shrink:0;}
.footer-logo img{display:block;height:auto;width:98px;}
.footer-word{font-family:'Gruppo',sans-serif;font-weight:400;font-size:18px;letter-spacing:0.01em;color:var(--text);line-height:1;white-space:nowrap;margin:1px 0;}
.footer-name{font-size:14.5px;font-weight:600;color:var(--text);}
.footer-sub{font-size:13px;color:var(--dim);margin-top:2px;}
.footer-right{display:flex;align-items:center;gap:26px;flex-wrap:wrap;}
.footer-nav{display:flex;gap:22px;}
.footer-nav .textlink{font-size:13.5px;font-weight:500;color:var(--dim);}
.footer-email{font-family:var(--mono);font-size:13.5px;color:var(--gold);text-decoration:none;}
.footer-email:hover{text-decoration:underline;}
.footer-base{display:flex;justify-content:space-between;gap:16px;margin-top:30px;padding-top:20px;border-top:1px solid var(--line);font-size:12.5px;color:var(--dim);opacity:.85;flex-wrap:wrap;}

@media (max-width:980px){ .tabs{gap:20px;} .tab{font-size:13.5px;} }
@media (max-width:860px){ .tabs{display:none;} }
@media (max-width:720px){ .footer-inner{flex-direction:column;align-items:flex-start;} }
@media (max-width:480px){ .tab-cta{display:none;} }

/* ── shared gallery + lightbox ── */
.gal-masonry{columns:4 240px;column-gap:16px;margin-top:26px;}
.gal-item{position:relative;margin:0 0 16px;break-inside:avoid;overflow:hidden;cursor:pointer;border:1px solid var(--line);background:#0f0e0b;line-height:0;}
.gal-item img{width:100%;height:auto;display:block;transition:transform .6s cubic-bezier(.2,.7,.3,1);}
.gal-item:hover img{transform:scale(1.05);}
.lb{position:fixed;inset:0;z-index:100;background:rgba(16,14,11,0.94);backdrop-filter:blur(4px);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:clamp(16px,4vw,48px);animation:lbfade .2s ease;}
@keyframes lbfade{from{opacity:0}to{opacity:1}}
.lb-figure{margin:0;grid-column:2;display:flex;justify-content:center;align-items:center;max-height:100%;}
.lb-figure img{max-width:100%;max-height:84vh;object-fit:contain;border:1px solid rgba(243,238,228,0.18);}
.lb-close{position:absolute;top:18px;right:24px;width:44px;height:44px;border:none;background:none;color:#F3EEE4;font-size:34px;line-height:1;cursor:pointer;opacity:.75;transition:opacity .18s;}
.lb-close:hover{opacity:1;}
.lb-nav{width:56px;height:56px;border:1px solid rgba(243,238,228,0.25);background:rgba(243,238,228,0.04);color:#F3EEE4;font-size:30px;line-height:1;cursor:pointer;transition:background .18s,border-color .18s;display:grid;place-items:center;flex-shrink:0;}
.lb-nav:hover{background:rgba(190,159,94,0.22);border-color:var(--gold-soft);}
.lb-prev{grid-column:1;}
.lb-next{grid-column:3;}
@media (max-width:760px){
  .gal-masonry{columns:2 150px;column-gap:12px;}
  .gal-item{margin-bottom:12px;}
  .lb{grid-template-columns:1fr;padding:16px;}
  .lb-figure{grid-column:1;}
  .lb-nav{position:absolute;top:50%;transform:translateY(-50%);}
  .lb-prev{left:10px;}
  .lb-next{right:10px;}
}
