:root{--black:#050505;--cream:#f2ebe2;--red:#d2161f;--gold:#c29a34;--ink:#131313;--max:1460px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:#fff;font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.container{width:min(var(--max),calc(100% - 72px));margin:auto}.nav{height:88px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;position:relative;z-index:4}.brand{display:flex;flex-direction:column;gap:6px;letter-spacing:.08em}.brand strong{font-size:18px;font-weight:500}.brand strong span{color:var(--red)}.brand small{font-size:11px;letter-spacing:.16em;color:#ddd}.navlinks{display:flex;gap:34px;font-size:12px}.navcta{justify-self:end;border:1px solid var(--red);padding:13px 24px;font-size:12px}.hero{min-height:700px;background:#000;overflow:hidden}.heroin{min-height:612px;display:flex;align-items:center;position:relative}.herocopy{width:58%;z-index:2}.hero h1,.how h2,.about h2,.cta h2,.casehero h1,.casecontent h2{font-family:Georgia,serif;font-weight:400}.hero h1{font-size:clamp(48px,5.2vw,84px);line-height:.99;letter-spacing:-.028em;margin:20px 0 24px}.hero em,.about em,.cta em{color:var(--red);font-weight:400}.rule{width:48px;height:2px;background:var(--red);margin:28px 0 30px}.formula{display:flex;gap:24px;flex-wrap:wrap;font-size:15px;letter-spacing:.08em}.formula b{color:var(--red)}.formula strong{color:var(--gold);font-weight:500}.actions{display:flex;gap:40px;align-items:center;margin-top:42px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:16px 34px;border:1px solid var(--red);font-size:13px}.btn.primary{background:var(--red)}.textlink{display:inline-flex;gap:12px;align-items:center;border-bottom:2px solid var(--red);padding-bottom:7px;font-size:13px}.venus{position:absolute;right:-3%;top:-3%;width:58%;height:106%;overflow:hidden}.venus img{width:100%;height:100%;object-fit:cover;object-position:66% 18%;filter:brightness(.72) contrast(1.15) saturate(.55)}.venus:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#000 0%,rgba(0,0,0,.85) 12%,rgba(0,0,0,.18) 45%,rgba(0,0,0,.35) 72%,#000 100%),linear-gradient(0deg,#000 0%,rgba(0,0,0,.35) 22%,transparent 50%)}.how{background:linear-gradient(90deg,#f5efe7,#e9dfd2);color:var(--ink);padding:54px 0}.howgrid{display:grid;grid-template-columns:.8fr 1.45fr;gap:86px;align-items:center}.label{color:var(--red);font-size:12px;letter-spacing:.15em;font-weight:700;text-transform:uppercase;margin-bottom:16px}.how h2{font-size:clamp(38px,4vw,64px);line-height:1.03;margin:0}.howcopy{border-left:1px solid #93897b;padding-left:58px;max-width:840px}.howcopy p{font-size:17px;line-height:1.62;margin:0}.howcopy .lead{font-weight:700;margin-bottom:9px}.what{padding:42px 0 58px}.steps{display:grid;grid-template-columns:repeat(5,1fr)}.step{min-height:385px;padding:18px 26px 12px 22px;border-right:1px solid rgba(194,154,52,.42)}.step:last-child{border-right:0}.no{font-size:66px;line-height:.85;color:#171717;font-weight:700}.sym{color:var(--red);font-size:34px;margin-top:-8px}.short{font-size:15px;font-weight:700;margin-top:10px}.step h3{font-family:Georgia,serif;font-weight:400;font-size:19px;color:#e2e2e2;margin:6px 0 12px}.step p{font-size:13px;line-height:1.58;color:#c7c7c7;margin:0}.work{background:var(--cream);color:var(--ink);padding:52px 0 48px}.casegrid{display:grid;grid-template-columns:1fr 1fr;gap:26px}.card{display:grid;grid-template-columns:38% 62%;min-height:355px;background:#fbf7f1;border:1px solid rgba(20,20,20,.13);box-shadow:0 3px 16px rgba(0,0,0,.05)}.visual{overflow:hidden}.visual img{width:100%;height:100%;object-fit:cover}.casebody{padding:32px}.eyebrow{color:#9b5a2c;font-size:12px;margin-bottom:8px}.card h3{font-family:Georgia,serif;font-weight:400;font-size:34px;margin:0 0 24px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:24px}.metric strong{display:block;font-family:Georgia,serif;font-weight:400;font-size:30px;color:var(--red)}.metric span{display:block;font-size:11px;line-height:1.28;margin-top:4px}.casebody p{font-size:14px;line-height:1.55;margin:0 0 22px}.note{text-align:center;font-size:10px;color:#555}.about{padding:52px 0}.aboutgrid{display:grid;grid-template-columns:38% 1fr;gap:72px}.portrait{min-height:445px;border:1px solid #272727;background:radial-gradient(circle at 48% 30%,#3a3a3a 0 11%,transparent 12%),linear-gradient(145deg,#202020,#090909 64%);display:grid;place-items:end start;padding:28px;color:#777;letter-spacing:.13em;font-size:12px}.aboutcopy{align-self:center}.about h2{font-size:clamp(42px,4vw,68px);line-height:1.02;margin:0 0 24px}.about p{font-size:16px;line-height:1.66;color:#d0d0d0;max-width:820px}.about strong{color:var(--red)}.cta{background:var(--cream);color:var(--ink);padding:42px 0}.ctagrid{display:grid;grid-template-columns:1.25fr 1fr auto;gap:54px;align-items:center}.cta h2{font-size:clamp(36px,3.5vw,56px);line-height:1.03;margin:0}.cta p{font-size:15px;line-height:1.55;margin:0}.footer{padding:32px 0;background:#020202;color:#bbb}.footergrid{display:grid;grid-template-columns:1fr auto 1fr;gap:28px;align-items:center}.flinks{display:flex;gap:24px;font-size:11px}.fcontact{justify-self:end;text-align:right;font-size:12px;display:flex;flex-direction:column;gap:8px}.casepage{background:#050505}.caseheader{height:96px;display:flex;align-items:center;justify-content:space-between}.casehero{padding:76px 0 52px}.casehero h1{font-size:clamp(58px,7vw,102px);margin:8px 0 14px}.casehero p{font-size:18px;color:#bbb}.casecontent{padding-bottom:72px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:60px}.stats div{background:#111;border:1px solid #222;padding:24px}.stats strong{display:block;color:var(--red);font-family:Georgia,serif;font-size:38px;font-weight:400}.stats span{display:block;color:#aaa;font-size:12px;margin-top:8px}.casecontent section{display:grid;grid-template-columns:30% 1fr;gap:42px;border-top:1px solid #252525;padding:40px 0}.casecontent h2{font-size:34px;margin:0}.casecontent p{font-size:17px;line-height:1.72;color:#ccc;margin:0;max-width:920px}@media(max-width:1100px){.nav{grid-template-columns:1fr auto}.navlinks{display:none}.herocopy{width:65%}.venus{width:63%;right:-16%}.howgrid{grid-template-columns:1fr;gap:28px}.howcopy{border-left:0;padding-left:0}.steps{grid-template-columns:repeat(2,1fr)}.step{border-bottom:1px solid rgba(194,154,52,.42)}.casegrid{grid-template-columns:1fr}.aboutgrid{grid-template-columns:1fr 1.2fr}.ctagrid,.footergrid{grid-template-columns:1fr}.fcontact{justify-self:start;text-align:left}}@media(max-width:720px){.container{width:calc(100% - 32px)}.nav{height:76px}.brand strong{font-size:14px}.hero{min-height:720px}.heroin{min-height:644px;align-items:flex-end}.herocopy{width:100%;padding-bottom:42px}.hero h1{font-size:48px}.venus{width:96%;height:66%;right:-36%;top:0;opacity:.78}.formula{font-size:11px;gap:12px}.actions{gap:20px}.steps{grid-template-columns:1fr}.step{border-right:0;min-height:auto;padding:24px 0}.card{grid-template-columns:1fr}.visual{min-height:230px}.metrics{gap:8px}.metric strong{font-size:25px}.aboutgrid{grid-template-columns:1fr}.portrait{min-height:330px}.stats{grid-template-columns:1fr 1fr}.casecontent section{grid-template-columns:1fr;gap:12px}}


/* ===== V4 FIXED POLISH ===== */

/* Hero formula */
.formula{font-size:19px;gap:28px;font-weight:500}
.formula strong{font-size:21px;color:var(--gold)}

/* Layered hero visual */
.heroart{position:absolute;right:-3%;top:-3%;width:58%;height:106%;z-index:1;overflow:hidden}
.heroart .venus{position:absolute;inset:0;width:100%;height:100%;z-index:2}
.heroart .venus img{width:100%;height:100%;object-fit:cover;object-position:66% 18%;filter:brightness(.78) contrast(1.12) saturate(.66)}
.heroart .venus::after{content:"";position:absolute;inset:0;background:
linear-gradient(90deg,#000 0%,rgba(0,0,0,.80) 11%,rgba(0,0,0,.12) 43%,rgba(0,0,0,.24) 74%,#000 100%),
linear-gradient(0deg,#000 0%,rgba(0,0,0,.36) 20%,transparent 52%)}
.databack,.datafront{position:absolute;inset:7% 0 0;width:100%;height:88%;pointer-events:none}
.databack{z-index:1;opacity:.72}
.datafront{z-index:3;opacity:.84}
.datapath{fill:none;stroke:var(--gold);stroke-width:1.25;stroke-dasharray:1000;stroke-dashoffset:1000;animation:drawline 2.4s ease-out .25s forwards}
.p2{opacity:.45;animation-delay:.7s}.fp{stroke-width:1;animation-delay:1.15s}
.dnode{fill:var(--gold);opacity:.74}
.pulse{fill:var(--red);animation:pulsepoint 2.6s ease-in-out infinite}
.bars rect{fill:none;stroke:var(--gold);stroke-width:1;opacity:.45;transform-box:fill-box;transform-origin:bottom;animation:barrise 1.2s ease-out both}
.bars rect:nth-child(2){animation-delay:.12s}.bars rect:nth-child(3){animation-delay:.24s}.bars rect:nth-child(4){animation-delay:.36s}
.microtag{position:absolute;z-index:4;border-left:1px solid rgba(194,154,52,.7);padding:5px 8px;background:rgba(0,0,0,.22);opacity:0;animation:tagshow .75s ease-out 1.55s forwards}
.microtag span{display:block;font-size:8px;letter-spacing:.16em;color:#8f805d}
.microtag strong{display:block;margin-top:2px;font:400 14px Georgia,serif;color:var(--gold)}
.roas{right:8%;top:27%}.ctr{right:24%;top:55%;animation-delay:1.95s}.growth{right:3%;top:68%;animation-delay:2.3s}
@keyframes drawline{to{stroke-dashoffset:0}}
@keyframes pulsepoint{0%,100%{opacity:.35;r:5}50%{opacity:1;r:8}}
@keyframes barrise{from{transform:scaleY(.05);opacity:0}to{transform:scaleY(1);opacity:.45}}
@keyframes tagshow{from{opacity:0;transform:translateY(5px)}to{opacity:.82;transform:none}}

/* More gold & breathing room */
.label::after{content:"";display:inline-block;width:42px;height:1px;margin-left:10px;vertical-align:middle;background:linear-gradient(90deg,var(--gold),transparent)}
.step{position:relative}
.step::before{content:"";position:absolute;left:22px;top:0;width:27px;height:1px;background:var(--gold);opacity:.65}
.step p{font-size:14px;line-height:1.64}
.step h3{color:#e7dcc6}
.card{border-top:2px solid rgba(194,154,52,.58)}
.textlink,.btn,.navcta{transition:all .2s ease}
.textlink:hover{color:var(--gold)!important;border-color:var(--gold);transform:translateX(3px)}
.btn:hover,.navcta:hover{background:var(--gold);border-color:var(--gold);color:#080808;transform:translateY(-1px)}

/* Real About photo */
.portraitreal{padding:0;overflow:hidden;background:#171411;display:block}
.portraitreal img{width:100%;height:100%;min-height:430px;object-fit:cover;object-position:center 45%;filter:contrast(1.04) brightness(1.02)}

/* Contact modal */
.contactmodal{position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:24px}
.contactmodal.open{display:grid}
.modalbackdrop{position:absolute;inset:0;background:rgba(0,0,0,.80);backdrop-filter:blur(6px)}
.modalpanel{position:relative;z-index:1;width:min(620px,100%);max-height:calc(100vh - 48px);overflow:auto;background:#0a0a0a;border:1px solid rgba(194,154,52,.58);padding:42px;color:#fff}
.modalpanel h2{font:400 42px/1.05 Georgia,serif;margin:0 0 10px}
.modalintro{color:#bbb;margin:0 0 26px}
.modalclose{position:absolute;right:18px;top:13px;border:0;background:none;color:#ddd;font-size:32px;cursor:pointer}
.modalpanel form{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.modalpanel label{display:flex;flex-direction:column;gap:8px;font-size:11px;letter-spacing:.08em;color:#c7b88f;text-transform:uppercase}
.modalpanel label.full{grid-column:1/-1}
.modalpanel input,.modalpanel textarea{width:100%;border:1px solid #39342c;background:#111;color:#fff;padding:13px 14px;font:16px Arial,sans-serif;outline:none}
.modalpanel input:focus,.modalpanel textarea:focus{border-color:var(--gold)}
.formnote{grid-column:1/-1;color:#777;font-size:11px;margin:0}

@media(max-width:1100px){
  .heroart{width:63%;right:-16%}
  .formula{font-size:16px}.formula strong{font-size:18px}
}
@media(max-width:720px){
  .heroart{width:96%;height:66%;right:-36%;top:0;opacity:.82}
  .formula{font-size:13px;gap:13px}.formula strong{font-size:14px}
  .microtag{display:none}
  .portraitreal img{min-height:330px}
  .modalpanel{padding:32px 22px}
  .modalpanel h2{font-size:34px}
  .modalpanel form{grid-template-columns:1fr}
  .modalpanel label.full{grid-column:auto}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
}


/* ===== V5 — GOLD DATA SYSTEM ===== */

/* Stronger hero data composition */
.databack{opacity:.92}
.datafront{opacity:.96}
.datapath{
  stroke-width:1.55;
  filter:drop-shadow(0 0 4px rgba(194,154,52,.28));
}
.p2{opacity:.58}
.p3{opacity:.68;animation-delay:.95s}
.p4{opacity:.48;animation-delay:1.35s}
.fp{stroke-width:1.35}
.fp2{stroke-width:1.05;opacity:.58;animation-delay:1.7s}
.dnode{filter:drop-shadow(0 0 4px rgba(194,154,52,.5))}
.glow-node{animation:goldpulse 4.2s ease-in-out infinite}
.faint-node{opacity:.48;animation:goldpulse 5.4s ease-in-out infinite 1.2s}
.orbit-ring{
  fill:none;
  stroke:var(--gold);
  stroke-width:.8;
  opacity:.18;
  transform-box:fill-box;
  transform-origin:center;
  animation:ringpulse 4.5s ease-in-out infinite;
}
.microtag{
  border-left-color:rgba(215,177,75,.88);
  background:rgba(0,0,0,.32);
  box-shadow:0 0 22px rgba(194,154,52,.04);
}
.microtag strong{color:#d8b65a}
.bars rect{opacity:.62;stroke-width:1.15}
@keyframes goldpulse{
  0%,100%{opacity:.35}
  48%{opacity:.95}
  58%{opacity:.62}
}
@keyframes ringpulse{
  0%,100%{opacity:.10;transform:scale(.82)}
  50%{opacity:.42;transform:scale(1.18)}
}

/* One quiet golden data-thread through the entire page */
.gold-thread{
  position:absolute;
  z-index:0;
  left:0;
  top:0;
  width:100%;
  height:100%;
  pointer-events:none;
  overflow:hidden;
}
.gold-thread svg{
  display:block;
  width:100%;
  height:100%;
  min-height:100%;
}
.thread-main,.thread-branch{
  fill:none;
  stroke:var(--gold);
  vector-effect:non-scaling-stroke;
}
.thread-main{
  stroke-width:.72;
  opacity:.14;
  stroke-dasharray:5 10;
}
.thread-branch{
  stroke-width:.65;
  opacity:.11;
}
.thread-node{
  fill:var(--gold);
  opacity:.20;
  transform-box:fill-box;
  transform-origin:center;
  animation:threadpulse 6.5s ease-in-out infinite;
}
.t2,.t5{animation-delay:1.4s}
.t3,.t6{animation-delay:3s}
.t4,.t7{animation-delay:4.4s}
@keyframes threadpulse{
  0%,100%{opacity:.10;transform:scale(.75)}
  45%{opacity:.32;transform:scale(1.15)}
  65%{opacity:.16;transform:scale(.9)}
}

/* Keep actual content above the decorative thread */
body{position:relative}
nav,main,footer,.contactmodal{position:relative;z-index:2}

/* Let the line feel slightly more present on dark sections without becoming decoration */
section{position:relative}
.dark::after{
  content:"";
  position:absolute;
  pointer-events:none;
  right:5%;
  top:12%;
  width:74px;
  height:74px;
  border-top:1px solid rgba(194,154,52,.10);
  border-right:1px solid rgba(194,154,52,.07);
  transform:rotate(12deg);
}

/* Tiny gold punctuation that visually ties cards/process back to the data system */
.stepnum{color:var(--gold)}
.card .kicker,.case-kicker{color:var(--gold)}

@media(max-width:720px){
  .gold-thread{opacity:.62}
  .thread-main{stroke-width:.55;opacity:.10}
  .thread-branch{display:none}
  .p4,.fp2{display:none}
  .datapath{stroke-width:1.25}
}

@media(prefers-reduced-motion:reduce){
  .thread-node,.glow-node,.faint-node,.orbit-ring{animation:none!important}
}


/* ===== V6 — TECHNOLOGICAL VENUS ===== */
.techback{
  inset:-4% -7% -7% -10%;
  width:117%;
  height:111%;
  opacity:1;
  overflow:visible;
}
.radial-system{
  fill:none;
  stroke:var(--gold);
  stroke-width:.55;
  opacity:.13;
  stroke-dasharray:2 7;
}
.radial-system circle:nth-child(2){opacity:.65}
.radial-system circle:nth-child(3){opacity:.45}

.network-lines,.wave-system{
  fill:none;
  stroke:var(--gold);
}
.net{
  stroke-width:1.02;
  opacity:.42;
  stroke-dasharray:1400;
  stroke-dashoffset:1400;
  animation:netdraw 8s ease-in-out infinite alternate;
}
.n2{opacity:.22;animation-delay:.8s}.n3{opacity:.30;animation-delay:1.5s}
.n4{opacity:.18;animation-delay:2.1s}.n5{opacity:.20;animation-delay:2.7s}
.n6{opacity:.60;stroke-width:1.2;animation-delay:.4s}
.n7{opacity:.32;animation-delay:1.9s}
.wave-system{opacity:.20;stroke-width:.75}
.wave-system path+path{opacity:.5}

.network-nodes circle,.frontnodes circle{
  fill:#d9b552;
  stroke:#f2d887;
  stroke-width:.65;
  filter:drop-shadow(0 0 5px rgba(231,190,83,.7));
  animation:nodeblink 4.8s ease-in-out infinite;
}
.network-nodes circle:nth-child(3n){animation-delay:1.1s}
.network-nodes circle:nth-child(4n){animation-delay:2.4s}
.big-glow{opacity:.48;animation:glowbreath 4.5s ease-in-out infinite}
.g2{animation-delay:1.7s}

.techmetric text{
  fill:#d5ad48;
  font-family:Inter,Arial,sans-serif;
  font-size:10px;
  letter-spacing:2px;
  opacity:.68;
}
.techmetric .metricvalue{
  fill:#f3ead9;
  font-family:Georgia,serif;
  font-size:21px;
  letter-spacing:.5px;
  opacity:.82;
}
.tm1{animation:metricfade 7s ease-in-out infinite}
.tm2{animation:metricfade 7s ease-in-out infinite 2.6s}
.techbars rect{
  fill:rgba(194,154,52,.12);
  stroke:#c29a34;
  stroke-width:.65;
  opacity:.48;
}

.techfront{
  inset:-2% -5% -4% -7%;
  width:112%;
  height:106%;
  overflow:visible;
  opacity:1;
}
.frontnet{
  fill:none;
  stroke:#d1aa45;
  stroke-width:1.22;
  opacity:.72;
  stroke-dasharray:1100;
  stroke-dashoffset:1100;
  filter:drop-shadow(0 0 4px rgba(194,154,52,.22));
  animation:frontdraw 6.8s ease-in-out infinite alternate;
}
.f2{opacity:.48;animation-delay:1.2s}
.f3{opacity:.34;animation-delay:2.2s}
.target-node circle{
  fill:none;
  stroke:#d8b34e;
  stroke-width:.8;
  opacity:.55;
  animation:targetpulse 4s ease-in-out infinite;
}
.target-node circle:nth-child(2){opacity:.75}
.target-node .targetcore{fill:#f0d27b;stroke:none;opacity:1}

@keyframes netdraw{
  0%{stroke-dashoffset:1400;opacity:.12}
  45%,100%{stroke-dashoffset:0}
}
@keyframes frontdraw{
  0%{stroke-dashoffset:1100;opacity:.18}
  55%,100%{stroke-dashoffset:0}
}
@keyframes nodeblink{
  0%,100%{opacity:.28}
  42%{opacity:1}
  58%{opacity:.55}
}
@keyframes glowbreath{
  0%,100%{opacity:.16;transform:scale(.78);transform-origin:center}
  50%{opacity:.62;transform:scale(1.15);transform-origin:center}
}
@keyframes metricfade{
  0%,100%{opacity:.35}
  35%,70%{opacity:1}
}
@keyframes targetpulse{
  0%,100%{opacity:.24;transform:scale(.85)}
  50%{opacity:.78;transform:scale(1.14)}
}

@media(max-width:720px){
  .techback{inset:0 -18% 0 -22%;width:140%}
  .techfront{inset:0 -12% 0 -14%;width:126%}
  .n2,.n4,.n5,.wave-system,.tm2,.techbars{display:none}
  .radial-system{opacity:.09}
  .net{stroke-width:.8}
  .frontnet{stroke-width:1}
}
@media(prefers-reduced-motion:reduce){
  .net,.frontnet,.network-nodes circle,.big-glow,.techmetric,.target-node circle{animation:none!important}
  .net,.frontnet{stroke-dashoffset:0!important}
}


/* ===== V7 — MOBILE FIRST + TRANSPARENT VENUS ===== */

/* Transparent Venus allows the back layer to read through */
.heroart .venus img{
  object-fit:contain;
  object-position:70% 47%;
  filter:brightness(.83) contrast(1.08) saturate(.52);
}
.heroart .venus::after{
  background:
    linear-gradient(90deg,#000 0%,rgba(0,0,0,.52) 12%,rgba(0,0,0,.02) 45%,rgba(0,0,0,.12) 78%,#000 100%),
    linear-gradient(0deg,#000 0%,rgba(0,0,0,.14) 14%,transparent 44%);
}

.techback{opacity:1}
.tech-grid{
  fill:none;
  stroke:#d0aa48;
  stroke-width:.78;
  opacity:.25;
  stroke-dasharray:2 8;
  filter:drop-shadow(0 0 2px rgba(194,154,52,.18));
}
.tech-grid circle:nth-child(2){opacity:.82}
.tech-grid circle:nth-child(3){opacity:.65}
.tech-grid circle:nth-child(4){opacity:.42}
.network-lines .net{opacity:.47}
.n6{opacity:.74}
.network-nodes circle{opacity:.88}

/* Make the decorative gold thread span the actual document and sit above section backgrounds */
.gold-thread{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:2;
  opacity:.8;
}
.gold-thread svg{width:100%;height:100%}
main{position:relative;z-index:1}
main section{position:relative;z-index:1}
main section > .container,
footer > .container{position:relative;z-index:4}
.gold-thread{pointer-events:none}
.thread-main{opacity:.16;stroke-width:.78}
.thread-branch{opacity:.12}
.thread-node{opacity:.22}

/* Mobile-first hero: simplify without just shrinking desktop */
@media(max-width:720px){
  .hero{min-height:690px}
  .hero-inner{min-height:614px;align-items:flex-end}
  .hero-copy{width:100%;padding-bottom:38px}
  .hero h1{font-size:42px;line-height:1.02;max-width:88%}
  .formula{font-size:12px;gap:10px;max-width:88%}
  .formula strong{font-size:13px}

  .heroart{
    width:106%;
    height:58%;
    right:-42%;
    top:3%;
    opacity:.95;
    overflow:visible;
  }
  .heroart .venus img{
    object-fit:contain;
    object-position:65% 48%;
  }

  /* Keep only the most legible parts of the data system on mobile */
  .tech-grid{opacity:.13}
  .n2,.n4,.n5,.tm2,.techbars{display:none}
  .n1,.n3,.n6,.n7{opacity:.36}
  .frontnet{stroke-width:.95}
  .microtag{display:none}
  .gold-thread{opacity:.5}
  .thread-main{opacity:.08;stroke-width:.5}
  .thread-branch{display:none}
}

/* Tablet tuning */
@media(min-width:721px) and (max-width:1100px){
  .heroart{
    width:66%;
    right:-16%;
  }
  .tech-grid{opacity:.18}
}

/* Desktop gets the full technological composition */
@media(min-width:1101px){
  .heroart{
    width:61%;
    right:-3%;
  }
  .tech-grid{opacity:.28}
}