/* ============================================================
   Delta V — Portfolio device-artwork system
   ============================================================ */
:root{
  --bg:#0a0e15;
  --bg-tile:#0b0f18;
  --bg-tile-2:#0c111c;
  --ink:#eef2f8;
  --dim:#6c7689;
  --dimmer:#454e60;
  --line:rgba(150,175,215,.085);
  --line-2:rgba(150,175,215,.16);
  --edge:#cdddfb;
  --edge-blue:#5b82ff;
  --glow-amt:7;
  --lw:1.25px;
  --mono:"Geist Mono","IBM Plex Mono",ui-monospace,monospace;
  --sans:"Geist","Helvetica Neue",Helvetica,system-ui,sans-serif;
  --maxw:1320px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--sans);-webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;overflow-x:hidden;
}
.meta{
  font-family:var(--mono);font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--dim);font-weight:400;
}
[data-mono="0"] .meta{font-family:var(--sans);letter-spacing:.16em;font-weight:500;}

/* ============================================================ HERO */
.hero{
  position:relative;min-height:100vh;padding:46px clamp(28px,5vw,68px);
  display:flex;flex-direction:column;justify-content:space-between;
  overflow:hidden;border-bottom:1px solid var(--line-2);
}
.hero-bg{position:absolute;inset:0;z-index:0;}
.hero-slot{position:absolute;inset:0;width:100%;height:100%;display:block;
  --is-bg:#0a0e15;filter:saturate(.5) brightness(.62);}
.hero-bg .hero-grain{
  position:absolute;inset:0;opacity:.05;mix-blend-mode:screen;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.hero-shade{
  position:absolute;inset:0;
  background:
    radial-gradient(120% 90% at 50% 22%, rgba(40,60,110,.18), transparent 60%),
    linear-gradient(180deg, rgba(10,14,21,.55) 0%, rgba(10,14,21,.2) 38%, rgba(10,14,21,.86) 100%);
}
/* fallback field when no image dropped */
.hero-slot::part(empty){background:
  radial-gradient(80% 60% at 50% 30%, #141b2a, #0a0e15 70%);}

.hero-top,.hero-mid,.hero-foot{position:relative;z-index:2;}
.hero-top{display:flex;justify-content:space-between;align-items:flex-start;}
.wordmark{font-size:clamp(22px,2.1vw,30px);font-weight:600;letter-spacing:-.01em;}
.wordmark sup{font-size:.42em;font-weight:400;opacity:.7;top:-1.1em;}
.hero-meta{display:flex;flex-direction:column;gap:6px;text-align:right;white-space:nowrap;}

.hero-mid{max-width:1100px;padding-bottom:8px;}
.tagrow{display:flex;flex-wrap:wrap;gap:18px 34px;margin-bottom:26px;}
.tag{white-space:nowrap;}
.headline{
  font-size:clamp(40px,7.4vw,108px);line-height:.96;letter-spacing:-.025em;
  font-weight:400;margin:0;color:#aeb8c8;max-width:15ch;text-wrap:balance;
}
.headline strong{color:var(--ink);font-weight:600;}
.sub{
  font-size:clamp(16px,1.5vw,21px);line-height:1.45;color:var(--dim);
  margin:26px 0 0;max-width:52ch;font-weight:400;
}
.sub strong{color:var(--ink);font-weight:500;}
.hero-foot{display:flex;justify-content:space-between;align-items:center;
  border-top:1px solid var(--line-2);padding-top:20px;margin-top:32px;}
.portfolio-cue{color:var(--ink);}

/* ============================================================ PORTFOLIO */
.portfolio{padding:clamp(40px,6vw,86px) clamp(20px,4vw,56px) 60px;max-width:var(--maxw);margin:0 auto;}
.port-head{display:flex;justify-content:space-between;align-items:flex-end;
  gap:40px;flex-wrap:wrap;margin-bottom:clamp(28px,4vw,52px);}
.ph-left{display:flex;flex-direction:column;gap:12px;}
.ph-title{font-size:clamp(24px,3vw,40px);font-weight:500;letter-spacing:-.02em;margin:0;}
.ph-right{display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-width:300px;}
.switch-label{color:var(--dimmer);}
.switcher{display:flex;gap:0;border:1px solid var(--line-2);border-radius:2px;overflow:hidden;}
.sw{
  appearance:none;background:transparent;border:0;border-right:1px solid var(--line-2);
  color:var(--dim);font-family:var(--mono);font-size:12px;letter-spacing:.08em;
  padding:11px 16px;cursor:pointer;display:flex;align-items:center;gap:8px;
  transition:color .25s,background .25s;text-transform:uppercase;
}
.sw:last-child{border-right:0;}
.sw .sw-n{font-size:10px;color:var(--dimmer);transition:color .25s;}
.sw:hover{color:var(--ink);}
.sw.on{background:var(--edge-blue);color:#fff;}
.sw.on .sw-n{color:rgba(255,255,255,.7);}
.sw-note{max-width:340px;line-height:1.6;letter-spacing:.04em;color:var(--dimmer);
  text-transform:none;font-size:11px;}

/* grid */
.grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--line);border-left:1px solid var(--line);
}
.cell{
  position:relative;background:var(--bg-tile);
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:22px 24px;display:flex;flex-direction:column;min-height:340px;
  opacity:0;transform:translateY(18px);
  transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1),background .35s;
  transition-delay:var(--d);
}
.cell.in{opacity:1;transform:none;}
.cell:hover{background:var(--bg-tile-2);}
.cell.clickable{cursor:pointer;text-decoration:none;color:inherit;}
.cell.clickable::after{content:"";position:absolute;inset:0;border:1px solid transparent;
  transition:border-color .3s,box-shadow .3s;pointer-events:none;}
.cell.clickable:hover{background:var(--bg-tile-2);}
.cell.clickable:hover::after{border-color:var(--edge-blue);
  box-shadow:inset 0 0 26px rgba(91,130,255,.14);}
.cell.clickable:hover .cname{color:#fff;}
.cell.clickable:hover .loc{color:var(--edge);}
.cell.clickable:focus-visible{outline:2px solid var(--edge-blue);outline-offset:-2px;}
.cell-top{display:flex;justify-content:space-between;align-items:center;}
.cell-top .num{color:var(--dimmer);}
.cell-bot{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:auto;}
.cname{font-size:clamp(15px,1.3vw,18px);font-weight:500;letter-spacing:-.01em;}
.loc{color:var(--dimmer);white-space:nowrap;}

/* stage / artwork */
.stage{position:relative;flex:1;display:flex;align-items:center;justify-content:center;
  margin:14px 0;overflow:hidden;}
.art{width:100%;max-width:320px;aspect-ratio:260/200;}
.motif-svg{width:100%;height:100%;overflow:visible;}
.slot-tag{position:absolute;left:0;bottom:0;color:var(--dimmer);font-size:9px;
  letter-spacing:.18em;opacity:0;transition:opacity .4s;}
.cell:hover .slot-tag{opacity:.8;}

/* ---- shared motif ink ---- */
.motif-ink .ln{stroke:var(--edge);stroke-width:var(--lw);
  stroke-linecap:round;stroke-linejoin:round;
  filter:drop-shadow(0 0 calc(var(--glow-amt)*0.6px) var(--edge-blue));}
.motif-ink .faint{stroke:var(--edge);opacity:.32;
  stroke-width:calc(var(--lw)*.8);filter:none;}
.motif-ink .dot{fill:var(--edge);stroke:none;
  filter:drop-shadow(0 0 calc(var(--glow-amt)*0.7px) var(--edge-blue));}
.motif-ink .dot.hot{fill:#fff;}
.motif-ink .cellbox{stroke:var(--edge);stroke-width:var(--lw);fill:rgba(91,130,255,.05);}
.motif-bloom{opacity:calc(.25 + var(--glow-amt)*.04);}

/* base continuous motion (ambient) */
.spin{animation:spin 26s linear infinite;}
.spin-slow{animation:spin 40s linear infinite;}
.spin-rev{animation:spin 32s linear infinite reverse;}
.sweep-rot{animation:spin 6s linear infinite;}
.rotor-disc{animation:rotor 1.4s linear infinite;}
.ring-pulse{stroke:var(--edge);stroke-width:var(--lw);opacity:.5;animation:ringpulse 3.2s ease-out infinite;}
.joint-a{animation:swingA 6s ease-in-out infinite;}
.joint-b{animation:swingB 5s ease-in-out infinite;}
.dot.wave{animation:wave 3.4s ease-in-out infinite;animation-delay:calc(var(--i)*-.12s);}

/* Dirac exploded module */
.motif-ink .face{fill:rgba(91,130,255,.05);}
.motif-ink .board-plane{fill:rgba(91,130,255,.07);stroke:var(--edge);stroke-width:calc(var(--lw)*.8);opacity:.5;}
.motif-ink .comp{fill:rgba(205,221,251,.10);stroke:var(--edge);stroke-width:.8px;opacity:.7;
  animation:wave 2.6s ease-in-out infinite;animation-delay:calc(var(--i)*-.3s);}
.motif-ink .led{fill:#39e08a;filter:drop-shadow(0 0 calc(var(--glow-amt)*0.9px) #39e08a);
  animation:nodepulse 1.8s ease-in-out infinite;}
.lid-explode{animation:explode 5.2s ease-in-out infinite;}
.board-reveal{opacity:.25;animation:reveal 5.2s ease-in-out infinite;}
@keyframes explode{0%,16%{transform:translateY(0);}48%,64%{transform:translateY(-30px);}96%,100%{transform:translateY(0);}}
@keyframes reveal{0%,16%{opacity:.18;}48%,64%{opacity:1;}96%,100%{opacity:.18;}}

/* Dirac environment ping */
.dv-module{transform:scale(.72);}
.motif-ink .ping{stroke:var(--edge-blue);stroke-width:var(--lw);opacity:0;
  animation:ping 3.8s ease-out infinite;animation-delay:calc(var(--i)*1.25s);}
@keyframes ping{0%{transform:scale(.45);opacity:.7;}100%{transform:scale(5);opacity:0;}}
.motif-ink .sweep-sector{fill:rgba(91,130,255,.13);stroke:none;}
.radar-sweep{animation:spin 4.2s linear infinite;}
.motif-ink .det{opacity:0;transform-box:fill-box;transform-origin:center;animation:detect 4.2s ease-out infinite;animation-delay:calc(var(--i)*1.05s);}

/* Pluto delivery scooter */
.motif-ink .glass{fill:rgba(91,130,255,.10);stroke:var(--edge);stroke-width:calc(var(--lw)*.8);opacity:.5;}
.motif-ink .cabin{fill:rgba(14,20,34,.62);}
.drive{animation:bob 3s ease-in-out infinite;transform-origin:center bottom;}
.wheel-spin{animation:spin 2.6s linear infinite;}
.veh-streak{stroke:var(--edge-blue);stroke-width:var(--lw);stroke-linecap:round;opacity:0;
  animation:vstreak 1.6s ease-out infinite;animation-delay:calc(var(--i)*.22s);}
.motif-ink .cargo-pulse{fill:none;stroke:var(--edge-blue);stroke-width:calc(var(--lw)*.9);opacity:0;
  animation:cargopulse 3.4s ease-in-out infinite;}
@keyframes bob{0%,100%{transform:translateY(0) rotate(0deg);}50%{transform:translateY(-2px) rotate(-.4deg);}}
@keyframes vstreak{0%{opacity:0;transform:translateX(10px);}25%{opacity:.7;}100%{opacity:0;transform:translateX(-26px);}}
@keyframes cargopulse{0%,70%{opacity:0;}80%{opacity:.85;}100%{opacity:0;}}

/* Armatrix continuum snake-arm */
.motif-ink .vertebra{stroke:var(--edge);stroke-width:var(--lw);fill:rgba(91,130,255,.06);}
.motif-ink .tool{fill:rgba(205,221,251,.18);stroke:var(--edge);stroke-width:var(--lw);}
.motif-ink .access{fill:rgba(91,130,255,.12);}
.arm-seg{transform-box:fill-box;transform-origin:center;
  animation:armseg 5s cubic-bezier(.5,0,.3,1) infinite;animation-delay:calc(var(--i)*.11s);}
.arm-seg.anchored{animation:none;opacity:1;}
.tool-spark{animation:nodepulse 1.1s ease-in-out infinite;}
@keyframes armseg{
  0%{opacity:0;transform:scale(.15);}
  6%{opacity:1;transform:scale(1);}
  60%{opacity:1;transform:scale(1);}
  72%{opacity:0;transform:scale(.15);}
  100%{opacity:0;transform:scale(.15);}
}

/* Blinq battery swap */
.motif-ink .bat{stroke:var(--edge);stroke-width:var(--lw);fill:rgba(91,130,255,.06);}
.motif-ink .bat-bar{fill:var(--led);filter:drop-shadow(0 0 4px var(--led));}
.bat-out{animation:batOut 5s ease-in-out infinite;}
.bat-in{animation:batIn 5s ease-in-out infinite;}
@keyframes batOut{0%,14%{transform:translate(0,0);opacity:1}32%{transform:translate(0,32px);opacity:1}55%{transform:translate(-130px,32px);opacity:0}100%{transform:translate(-130px,32px);opacity:0}}
@keyframes batIn{0%,30%{transform:translate(132px,32px);opacity:0}35%{transform:translate(132px,32px);opacity:1}55%{transform:translate(0,32px);opacity:1}73%{transform:translate(0,0);opacity:1}100%{transform:translate(0,0);opacity:1}}
.motif-ink .hex{fill:var(--edge);animation:wave 1.6s ease-in-out infinite;animation-delay:calc(var(--i)*.18s);}
.motif-ink .charge-sweep{stroke:var(--led);stroke-width:2;opacity:0;stroke-dasharray:26 280;
  filter:drop-shadow(0 0 5px var(--led));animation:chargesweep 5s ease-in-out infinite;}
@keyframes chargesweep{0%,58%{stroke-dashoffset:306;opacity:0}66%{opacity:.9}84%{stroke-dashoffset:30;opacity:0}100%{opacity:0}}

/* Kubocare sensor + vitals */
.motif-ink .kwave{stroke:var(--edge-blue);stroke-width:1.4;opacity:0;
  animation:kwave 3.6s ease-out infinite;animation-delay:calc(var(--i)*.9s);}
@keyframes kwave{0%{transform:scale(.4);opacity:.85}100%{transform:scale(7);opacity:0}}
.sensor-led{animation:nodepulse 1.6s ease-in-out infinite;}
.motif-ink .vital{stroke:var(--led);stroke-width:1.4;transform-box:fill-box;transform-origin:center;
  opacity:.6;animation:heartbeat 1.1s ease-out infinite;}
@keyframes heartbeat{0%{transform:scale(.5);opacity:.9}45%{opacity:.35}60%{transform:scale(.78);opacity:.7}100%{transform:scale(1.7);opacity:0}}
.motif-ink .heart{animation:nodepulse 1.1s ease-in-out infinite;}
.kpulse{offset-rotate:0deg;animation:kpulse 2.6s ease-in infinite;}
@keyframes kpulse{0%{offset-distance:0%;opacity:0}12%{opacity:1}88%{opacity:1}100%{offset-distance:100%;opacity:0}}

/* Lagann teleop — operator + robot share the same arm motion */
.ra-shoulder,.ha-shoulder{animation:teleShoulder 4s ease-in-out infinite;}
.ra-elbow,.ha-elbow{animation:teleElbow 4s ease-in-out infinite;}
@keyframes teleShoulder{0%,100%{transform:rotate(-14deg)}30%{transform:rotate(-50deg)}62%{transform:rotate(8deg)}}
@keyframes teleElbow{0%,100%{transform:rotate(10deg)}30%{transform:rotate(40deg)}62%{transform:rotate(-8deg)}}

/* Neocambrian — DexUMI pick-and-place */
.motif-ink .cube{stroke:var(--edge);stroke-width:var(--lw);fill:rgba(91,130,255,.10);
  filter:drop-shadow(0 0 calc(var(--glow-amt)*0.5px) var(--edge-blue));}
@keyframes detect{0%,18%{opacity:0;transform:scale(.5);}24%{opacity:1;transform:scale(1.5);}42%{opacity:1;transform:scale(1);}72%,100%{opacity:0;}}
.bar.charge{transform-origin:left center;animation:charge 4s ease-in-out infinite;animation-delay:calc(var(--i)*.4s);}
.scan-cell{opacity:.4;animation:cellscan 5s linear infinite;animation-delay:calc(var(--i)*.35s);}
.node{animation:nodepulse 3s ease-in-out infinite;animation-delay:calc(var(--i)*.2s);}
.pulse-move{animation:pulsemove 2.6s linear infinite;animation-delay:calc(var(--i)*.42s);offset-rotate:0deg;}
.gantry-head{animation:gantry 5s ease-in-out infinite;}
.dashring{stroke-dasharray:10 14;animation:dashspin 3s linear infinite;opacity:.7;}
.streak{stroke:var(--edge);stroke-width:var(--lw);opacity:0;
  animation:streak 1.8s ease-out infinite;animation-delay:calc(var(--i)*.18s);}

@keyframes spin{to{transform:rotate(360deg);}}
@keyframes dashspin{to{stroke-dashoffset:-48;}}
@keyframes rotor{to{transform:scaleX(.12);}}
@keyframes ringpulse{0%{transform:scale(.7);opacity:.7;}100%{transform:scale(1.8);opacity:0;}}
@keyframes swingA{0%,100%{transform:rotate(-7deg);}50%{transform:rotate(9deg);}}
@keyframes swingB{0%,100%{transform:rotate(8deg);}50%{transform:rotate(-10deg);}}
@keyframes wave{0%,100%{opacity:.25;}50%{opacity:1;}}
@keyframes charge{0%,100%{transform:scaleX(.15);opacity:.4;}50%{transform:scaleX(1);opacity:1;}}
@keyframes cellscan{0%,70%{opacity:.35;}80%{opacity:1;}90%{opacity:.35;}}
@keyframes nodepulse{0%,100%{opacity:.55;}50%{opacity:1;}}
@keyframes pulsemove{0%{offset-distance:0%;opacity:0;}10%{opacity:1;}90%{opacity:1;}100%{offset-distance:100%;opacity:0;}}
@keyframes gantry{0%,100%{transform:translateY(0);}50%{transform:translateY(58px);}}
@keyframes streak{0%{opacity:0;transform:translateX(8px);}30%{opacity:.7;}100%{opacity:0;transform:translateX(-10px);}}

/* draw-on (revealed when cell enters) */
.draw{stroke-dasharray:240;stroke-dashoffset:240;}
.cell.in .draw{animation:draw 1.4s ease forwards;animation-delay:calc(var(--d) + .15s);}
@keyframes draw{to{stroke-dashoffset:0;}}

/* scanline overlay (used by signal) */
.scanline{position:absolute;left:0;right:0;height:2px;top:0;
  background:linear-gradient(90deg,transparent,var(--edge-blue),transparent);
  opacity:0;pointer-events:none;}

/* stealth */
.cell.stealth .art{filter:blur(7px) brightness(.8);opacity:.5;}
.stealth-veil{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  backdrop-filter:blur(2px);}
.stealth-veil .meta{color:var(--dim);font-size:10px;letter-spacing:.3em;
  border:1px solid var(--line-2);padding:7px 13px;background:rgba(10,14,21,.4);}

/* ===== TREATMENT: TRACE (default) — calm, draw-on, low ambient ===== */
[data-treat="trace"] .spin{animation-duration:46s;}
[data-treat="trace"] .motif-bloom{opacity:calc(.2 + var(--glow-amt)*.03);}

/* ===== TREATMENT: VOLUMETRIC — bloom + light sweep across device ===== */
[data-treat="volumetric"] .stage::after{
  content:"";position:absolute;inset:-20% -40%;pointer-events:none;
  background:linear-gradient(105deg,transparent 40%,rgba(205,221,251,.16) 50%,transparent 60%);
  transform:translateX(-60%);animation:lightsweep 5.5s ease-in-out infinite;
}
[data-treat="volumetric"] .motif-bloom{opacity:calc(.4 + var(--glow-amt)*.05);}
[data-treat="volumetric"] .art{filter:drop-shadow(0 0 22px rgba(91,130,255,.18));}
[data-treat="volumetric"] .cell.in .stage{animation:bloomin 1.2s ease both;}
@keyframes lightsweep{0%,100%{transform:translateX(-70%);}50%{transform:translateX(70%);}}
@keyframes bloomin{from{opacity:.2;transform:scale(.94);}to{opacity:1;transform:none;}}

/* ===== TREATMENT: SIGNAL — telemetry scan + faster motion ===== */
[data-treat="signal"] .scanline{opacity:.9;animation:scan 3.4s linear infinite;}
[data-treat="signal"] .spin{animation-duration:14s;}
[data-treat="signal"] .sweep-rot{animation-duration:3.2s;}
[data-treat="signal"] .rotor-disc{animation-duration:.8s;}
[data-treat="signal"] .radar-sweep{animation-duration:2.8s;}
[data-treat="signal"] .ping,[data-treat="signal"] .det{animation-duration:2.8s;}
[data-treat="signal"] .wheel-spin{animation-duration:1.5s;}
[data-treat="signal"] .arm-seg{animation-duration:3.4s;}
[data-treat="signal"] .kwave{animation-duration:2.4s;}
[data-treat="signal"] .bat-out,[data-treat="signal"] .bat-in,[data-treat="signal"] .charge-sweep{animation-duration:3.6s;}
[data-treat="signal"] .ra-shoulder,[data-treat="signal"] .ra-elbow,[data-treat="signal"] .ha-shoulder,[data-treat="signal"] .ha-elbow{animation-duration:2.6s;}
[data-treat="trace"] .arm-seg{animation-duration:7s;}
[data-treat="trace"] .kwave{animation-duration:5s;}
[data-treat="trace"] .ra-shoulder,[data-treat="trace"] .ra-elbow,[data-treat="trace"] .ha-shoulder,[data-treat="trace"] .ha-elbow{animation-duration:5.6s;}
[data-treat="signal"] .ncurl,[data-treat="signal"] .ncap{animation-duration:3.8s;}
[data-treat="trace"] .ncurl,[data-treat="trace"] .ncap{animation-duration:7.5s;}
[data-treat="trace"] .arm-seg{animation-duration:7s;}
[data-treat="trace"] .wheel-spin{animation-duration:4s;}
[data-treat="trace"] .radar-sweep{animation-duration:6.5s;}
[data-treat="trace"] .ping,[data-treat="trace"] .det{animation-duration:5.5s;}
[data-treat="signal"] .lid-explode,[data-treat="signal"] .board-reveal{animation-duration:3.4s;}
[data-treat="trace"] .lid-explode,[data-treat="trace"] .board-reveal{animation-duration:7s;}
[data-treat="signal"] .stage::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),
    linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:26px 26px;
  mask:radial-gradient(60% 60% at 50% 50%,#000,transparent 75%);
}
[data-treat="signal"] .slot-tag{opacity:.7;}
@keyframes scan{0%{top:0;}100%{top:100%;}}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important;}
  .cell{opacity:1;transform:none;}
  .draw{stroke-dashoffset:0;}
}

/* ============================================================ responsive */
@media(max-width:920px){
  .grid{grid-template-columns:repeat(2,1fr);}
  .ph-right{min-width:0;}
}
@media(max-width:620px){
  .grid{grid-template-columns:1fr;}
  .hero-top{flex-direction:column;gap:18px;}
  .hero-meta{text-align:left;}
  .switcher{flex-wrap:wrap;}
  .cell{min-height:300px;}
}

/* ============================================================ HERO IMAGE */
.hero-img{
  background:#070a0e url("../assets/hero-rocket.jpg") center 38% / cover no-repeat;
  filter:saturate(.5) brightness(.62);
}

/* ============================================================ FOOTER */
.site-footer{
  background:var(--bg);
  padding:clamp(22px,3vw,34px) clamp(28px,5vw,68px) clamp(20px,2.5vw,28px);
  border-top:1px solid var(--line-2);
}
.footer-bar{display:flex;align-items:center;justify-content:space-between;gap:16px 40px;flex-wrap:wrap;}
.fb-left{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;}
.fb-left .wordmark{font-size:20px;}
.fb-tag{color:var(--dim);font-size:15px;letter-spacing:-.01em;}
.fb-right{display:flex;align-items:center;gap:22px;flex-wrap:wrap;
  font-family:var(--mono);font-size:12px;letter-spacing:.04em;}
.fb-people{display:inline-flex;align-items:center;gap:12px;}
.fb-person{display:inline-flex;align-items:center;gap:8px;}
.fb-person .nm{color:var(--ink);text-decoration:none;transition:color .2s ease;}
.fb-person .nm:hover{color:#fff;}
.fb-x{display:inline-flex;color:var(--dimmer);transition:color .2s ease,transform .2s ease;}
.fb-x:hover{color:var(--ink);transform:translateY(-1px);}
.fb-x svg{width:12px;height:12px;display:block;fill:currentColor;}
.fb-dot{color:var(--dimmer);}
.fb-contact{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-2);
  padding-bottom:2px;transition:border-color .2s ease;}
.fb-contact:hover{border-color:var(--ink);}
.fb-loc{color:var(--dimmer);letter-spacing:.14em;}
.fb-meta{margin-top:clamp(16px,2.2vw,22px);padding-top:15px;border-top:1px solid var(--line);
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--dimmer);text-transform:uppercase;}
@media(max-width:620px){
  .fb-right{gap:14px;}
}
