:root{--paper:#f4f1e9;--ink:#111;--green:#42ef9a;--pad:clamp(22px,5vw,78px)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}.hero{height:100svh;min-height:620px;position:relative;background:#171717;overflow:hidden}.hero-image{width:100%;height:100%;object-fit:cover;object-position:center}.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08),transparent 40%,rgba(0,0,0,.12))}.hero-logo{position:absolute;top:8%;left:50%;transform:translateX(-50%);width:min(54vw,760px);height:auto;filter:drop-shadow(0 2px 8px #0005)}.section-pad{padding:clamp(72px,8vw,135px) var(--pad)}.intro-logo-row{margin-bottom:80px}.intro-logo-row img{width:min(360px,48vw)}.eyebrow{font-size:10px;letter-spacing:.2em;margin-bottom:38px}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:9vw}.intro h1{font-size:clamp(62px,8.5vw,145px);line-height:.86;letter-spacing:-.07em;margin:0}.intro-copy{max-width:650px}.intro-copy p{font-size:clamp(17px,1.35vw,22px);line-height:1.5;margin:0 0 25px}.intro-copy .lead{font-size:clamp(27px,2.4vw,42px);line-height:1.08;letter-spacing:-.04em}.pillars{margin-top:50px;border-top:1px solid #c8c4ba;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding-top:25px}.pillars>div{display:flex;gap:15px;align-items:center}.pillars i{font-style:normal;font-size:35px;min-width:45px;text-align:center}.rest-icon{width:35px;height:25px;border:1.5px solid;border-radius:50%;position:relative}.rest-icon:after{content:"";position:absolute;width:35px;height:25px;border:1.5px solid;border-radius:50%;left:10px;top:-1.5px}.pillars span{font-size:11px;color:#666}.pillars b{display:block;color:#111;letter-spacing:.08em;margin-bottom:5px}.re{position:relative;overflow:hidden;background:#050505;color:#f5f4ef}.re:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 72% 45%,rgba(255,135,56,.11),transparent 32%),radial-gradient(ellipse at 55% 36%,rgba(255,255,255,.06),transparent 23%),linear-gradient(90deg,#030303,#0a0a0a 52%,#030303)}.studio-glow{position:absolute;border-radius:50%;filter:blur(90px);opacity:.14}.glow-a{width:45vw;height:18vw;background:#ff7138;right:1vw;top:24%}.glow-b{width:28vw;height:25vw;background:#fff;left:40%;top:25%;opacity:.035}.re-inner{position:relative;z-index:2;display:grid;grid-template-columns:.72fr 1.28fr;gap:5vw;align-items:center;min-height:100svh}.eyebrow.light{color:#7f827d}.re h2,.contact h2{font-size:clamp(45px,5vw,82px);line-height:.95;letter-spacing:-.055em;margin:0 0 30px}.re-copy p{max-width:500px;color:#aaa;font-size:clamp(16px,1.25vw,20px);line-height:1.55}.machine-stage{position:relative;width:100%;filter:drop-shadow(0 38px 55px #000)}.machine-photo img{display:block;width:100%;height:auto;mix-blend-mode:screen}.machine-animation{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.machine-animation path{fill:none;stroke:url(#machineCurveGradient);stroke-width:7;stroke-linecap:round;filter:url(#glow)}#animCursor{fill:white;filter:url(#glow)}.phase-lights{position:absolute;left:20.5%;top:28%;width:67.5%;height:34%;display:grid;grid-template-columns:repeat(7,1fr);pointer-events:none}.phase-lights span{border-top:1px solid transparent;transition:.2s}.phase-lights span.active{box-shadow:inset 0 0 28px rgba(255,85,25,.10)}.phase-lights span:nth-child(n+5).active{box-shadow:inset 0 0 28px rgba(87,255,74,.10)}.phase-lights span:last-child.final{animation:blink .3s 6 alternate;box-shadow:inset 0 0 40px rgba(40,230,255,.22)}@keyframes blink{to{opacity:.2}}.contact{background:#050505;color:#f5f4ef;display:grid;grid-template-columns:1fr 1.15fr;gap:8vw;border-top:1px solid #222}.contact p{color:#888;font-size:17px}.contact form{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:start}.contact input,.contact textarea{width:100%;background:transparent;border:1px solid #444;color:white;padding:16px;font:inherit;border-radius:0;outline:none}.contact textarea{grid-column:1/-1;resize:vertical}.contact input:focus,.contact textarea:focus{border-color:#aaa}.contact button{grid-column:2;justify-self:end;border:0;border-radius:999px;padding:15px 24px;background:#f5f4ef;color:#111;font-size:10px;font-weight:bold;letter-spacing:.06em;cursor:pointer}.contact button span{padding-left:12px}.contact small{grid-column:1/-1;color:#555;font-size:9px;letter-spacing:.08em}footer{background:#050505;color:#666;border-top:1px solid #1b1b1b;padding:28px var(--pad) 36px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:9px;letter-spacing:.13em}footer img{width:150px;opacity:.85}footer a{color:#888;text-decoration:none}
@media(max-width:900px){.hero{height:78svh;min-height:520px}.hero-logo{width:min(68vw,600px)}.intro-grid,.re-inner,.contact{grid-template-columns:1fr}.intro-grid{gap:50px}.intro-logo-row{margin-bottom:55px}.re-inner{gap:65px;min-height:auto}.machine-stage{max-width:850px;margin:auto}.contact{gap:55px}}
@media(max-width:600px){.hero{height:62svh;min-height:430px}.hero-image{object-position:center}.hero-logo{top:7%;width:75vw}.section-pad{padding:68px 20px}.intro-logo-row img{width:64vw}.intro h1{font-size:16.5vw}.intro-copy .lead{font-size:30px}.intro-copy p{font-size:16px}.pillars{grid-template-columns:1fr;gap:22px}.re h2,.contact h2{font-size:12vw}.machine-stage{width:112%;margin-left:-6%}.contact form{grid-template-columns:1fr}.contact textarea,.contact button,.contact small{grid-column:1}.contact button{justify-self:start}footer{flex-direction:column;align-items:flex-start;padding:28px 20px}footer img{width:135px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.phase-lights span:last-child.final{animation:none}}
/* v2.2: hero uses the white identity already embedded in the hero artwork. */
.hero-logo,.intro-logo-row{display:none!important}
/* Clean the pre-rendered graph from the source machine so only the live curve is visible. */
.curve-cleanplate{position:absolute;z-index:2;left:20.2%;top:39.5%;width:68.7%;height:25.5%;background:#030303;border-radius:2px;box-shadow:inset 0 0 22px #000}
.machine-animation{z-index:3}
.phase-lights{z-index:4}
.machine-photo img{mix-blend-mode:normal}
footer img{display:none!important}
/* v2.4 — precise instrument-language pillars */
.pillars{gap:28px}
.pillars>div.pillar{display:grid;grid-template-columns:34px 38px minmax(0,1fr);gap:12px;align-items:center;min-width:0}
.dot-defs{position:absolute;pointer-events:none}
.dot-number{display:block;width:31px;height:23px;fill:#111;overflow:visible}
.te-icon{width:38px;height:30px;display:flex;align-items:center;justify-content:center;min-width:38px}
.pause-icon{gap:7px}
.pause-icon i{display:block;width:4px;height:25px;background:#111}
.signal-icon svg{display:block;width:38px;height:24px;overflow:visible}
.signal-icon path{fill:none;stroke:#111;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.forward-icon{gap:2px}
.forward-icon i{display:block;width:15px;height:15px;border-top:2px solid #111;border-right:2px solid #111;transform:rotate(45deg)}
.pillars .pillar>span:last-child{font-size:11px;color:#666;line-height:1.35}
.pillars .pillar>span:last-child b{display:block;color:#111;letter-spacing:.08em;margin-bottom:5px}
.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.form-status{grid-column:1/-1;min-height:18px;color:#8b8b85;font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding-top:6px}
.form-status.success{color:#42ef9a}.form-status.error{color:#ff745f}
.contact button[disabled]{opacity:.5;cursor:wait}
@media(max-width:600px){.pillars>div.pillar{grid-template-columns:34px 38px 1fr;gap:12px}.dot-number{width:31px;height:23px}}

/* v2.5 — self-contained TE-style instrument modules */
.pillars{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:34px!important;
  align-items:center!important;
}
.pillars>.pillar{
  display:grid!important;
  grid-template-columns:48px 44px minmax(0,1fr)!important;
  gap:14px!important;
  align-items:center!important;
  min-width:0!important;
}
.pillars .dot-number{
  display:block!important;width:48px!important;height:30px!important;
  fill:#111!important;overflow:visible!important;
}
.pillars .te-symbol{
  display:block!important;width:44px!important;height:30px!important;
  fill:#111;stroke:#111;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;
}
.pillars .te-symbol path{fill:none!important}
.pillars .pillar>span:last-child{
  display:block!important;font-size:11px!important;line-height:1.35!important;color:#666!important;
}
.pillars .pillar>span:last-child b{
  display:block!important;color:#111!important;letter-spacing:.08em!important;margin:0 0 5px!important;
}
@media(max-width:900px){
 .pillars{grid-template-columns:1fr!important;gap:20px!important}
 .pillars>.pillar{grid-template-columns:48px 44px minmax(0,1fr)!important}
}

/* v2.6 — single live curve + sequential phase illumination */
.curve-cleanplate{
  left:19.7%!important;
  top:38.7%!important;
  width:69.8%!important;
  height:27.2%!important;
  background:#020303!important;
  border-radius:0!important;
  box-shadow:inset 0 0 30px #000!important;
}
.machine-animation path{
  filter:none!important;
  stroke-width:6!important;
}
#animCursor{
  filter:none!important;
  fill:#fff!important;
}
.phase-lights{
  left:20.0%!important;
  top:24.2%!important;
  width:68.8%!important;
  height:42.0%!important;
  z-index:4!important;
  gap:0!important;
}
.phase-lights span{
  position:relative;
  background:rgba(0,0,0,.62);
  box-shadow:inset 0 0 18px rgba(0,0,0,.9);
  border-left:1px solid rgba(255,255,255,.025);
  transition:background .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.phase-lights span.active{
  background:rgba(0,0,0,0);
  box-shadow:inset 0 0 22px rgba(255,85,25,.06);
}
.phase-lights span:nth-child(4).active{
  box-shadow:inset 0 0 24px rgba(255,55,35,.07);
}
.phase-lights span:nth-child(5).active{
  box-shadow:inset 0 0 24px rgba(245,235,70,.07);
}
.phase-lights span:nth-child(6).active{
  box-shadow:inset 0 0 26px rgba(80,255,75,.08);
}
.phase-lights span:nth-child(7).active{
  box-shadow:inset 0 0 28px rgba(40,230,255,.10);
}
.phase-lights span:last-child.final{
  animation:phaseFinalBlink .32s 6 alternate;
}
@keyframes phaseFinalBlink{
  from{opacity:1}
  to{opacity:.45}
}

/* v2.7 — definitive machine screen rebuild. The baked-in screen is fully covered. */
.curve-cleanplate,.machine-animation,.phase-lights{display:none!important}
.machine-stage{position:relative}
.machine-photo{position:relative;z-index:1}
.screen-rebuild{position:absolute;inset:0;width:100%;height:100%;z-index:5;pointer-events:none}
.screen-blackout{fill:#020303}
.screen-grid line{stroke:#313131;stroke-width:1}
.pause-mark{fill:#ecece7}
.dot-field{fill:#8a6b26}
.phase{opacity:.22;transition:opacity .18s ease}
.phase.active{opacity:1}
.phase-num{font:700 22px ui-monospace,SFMono-Regular,Menlo,monospace;fill:#ff9a32}
.phase-name{font:500 14px ui-monospace,SFMono-Regular,Menlo,monospace;fill:#e7e7df;letter-spacing:.02em}
.phase-4 .phase-num{fill:#ff6548}.phase-5 .phase-num{fill:#d8e35a}.phase-6 .phase-num{fill:#63ef6e}.phase-7 .phase-num{fill:#35e7ef}
.live-curve{fill:none;stroke:url(#liveCurve);stroke-width:6;stroke-linecap:round;stroke-linejoin:round;filter:none!important}
.live-cursor{fill:#fff;filter:none!important}
.phase.final{animation:finalPhaseBlink .3s 6 alternate}
@keyframes finalPhaseBlink{from{opacity:1}to{opacity:.25}}

/* v2.7 — quiet, typography-first Rest / Recover / Perform */
.pillars{
 display:grid!important;grid-template-columns:repeat(3,1fr)!important;
 gap:0!important;border-top:1px solid #cbc8bf;padding-top:18px!important
}
.pillars>.pillar{
 display:block!important;position:relative!important;padding-left:38px!important;min-height:42px!important
}
.pillars>.pillar:not(:first-child){border-left:1px solid #d8d4ca;padding-left:54px!important}
.pillars .dot-number{position:absolute!important;left:0!important;top:2px!important;width:25px!important;height:17px!important;fill:#111!important}
.pillars>.pillar:not(:first-child) .dot-number{left:16px!important}
.pillars .te-symbol{display:none!important}
.pillars .pillar>span:last-child{font-size:10px!important;line-height:1.35!important;color:#777!important}
.pillars .pillar>span:last-child b{font-size:11px!important;letter-spacing:.13em!important;margin-bottom:5px!important;color:#111!important}
@media(max-width:900px){
 .pillars{grid-template-columns:1fr!important}
 .pillars>.pillar{padding:16px 0 16px 38px!important;border-left:0!important;border-bottom:1px solid #d8d4ca}
 .pillars>.pillar:not(:first-child){padding-left:38px!important}
 .pillars>.pillar:not(:first-child) .dot-number{left:0!important;top:18px!important}
 .pillars>.pillar:first-child .dot-number{top:18px!important}
}

/* v2.8 — use only the original pixel pause mark; white lead-in to phase 01 */
.pause-mark{display:none!important}
.pause-connector{
  stroke:#f4f4ef;
  stroke-width:5;
  stroke-linecap:round;
}

/* v2.9 looping phase illumination */
.machine-screen-svg .phase{opacity:.38; transition:opacity .22s ease, filter .22s ease}
.machine-screen-svg .phase.is-active{opacity:1; filter:brightness(1.65) drop-shadow(0 0 5px currentColor)}
.machine-screen-svg .phase.blink{opacity:.2; filter:none}

/* v3.1 — lock Rest / Recover / Perform graphic structure */
.pillars>.pillar{
  display:grid!important;
  grid-template-columns:48px 44px minmax(0,1fr)!important;
  align-items:center!important;
  column-gap:14px!important;
}
.pillars .dot-number{
  display:block!important;
  width:48px!important;
  height:30px!important;
  fill:#111!important;
  opacity:1!important;
  visibility:visible!important;
}
.pillars .te-symbol{
  display:block!important;
  width:44px!important;
  height:30px!important;
  opacity:1!important;
  visibility:visible!important;
}
@media(max-width:900px){
  .pillars{display:grid!important;grid-template-columns:1fr!important;gap:18px!important}
  .pillars>.pillar{display:grid!important;grid-template-columns:48px 44px minmax(0,1fr)!important}
}
