:root {
  --bg: #090a0b;
  --bg-soft: #101214;
  --panel: #151719;
  --panel-2: #1c1e20;
  --text: #f1f0eb;
  --muted: #a7a7a2;
  --line: rgba(255,255,255,.12);
  --line-strong: rgba(255,255,255,.24);
  --accent: #bf6c4c;
  --accent-soft: rgba(191,108,76,.18);
  --wood: #5b3828;
  --wood-light: #8a5c3e;
  --max: 1240px;
  --radius: 22px;
  --shadow: 0 30px 80px rgba(0,0,0,.45);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
body::selection { background: var(--accent); color: #fff; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
img { max-width: 100%; display: block; }
.shell { width: min(var(--max), calc(100% - 44px)); margin-inline: auto; }
.section-pad { padding: 130px 0; position: relative; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position: fixed; left: 16px; top: 16px; z-index: 999; transform: translateY(-150%); background: #fff; color:#111; padding: 10px 14px; border-radius: 8px; transition: transform .2s; }
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  background: linear-gradient(to bottom, rgba(9,10,11,.92), rgba(9,10,11,.42), transparent);
  transition: background .25s, border-color .25s;
  border-bottom: 1px solid transparent;
}
.site-header.scrolled { background: rgba(9,10,11,.88); backdrop-filter: blur(18px); border-color: var(--line); }
.header-inner { height: 84px; display: flex; align-items:center; justify-content:space-between; }
.brand { display:flex; align-items:center; gap:11px; font-weight:800; font-size:.9rem; }
.brand-mark { width:28px; height:28px; border:1px solid rgba(255,255,255,.7); border-radius:7px; display:grid; place-items:center; color:var(--text); font-size:.52rem; letter-spacing:.08em; line-height:1; }
.brand-wordmark { display:flex; align-items:baseline; gap:.55em; white-space:nowrap; }
.brand-wordmark strong { font-size:.9rem; letter-spacing:.16em; line-height:1; }
.brand-wordmark small { color:#85888a; font-size:.5rem; letter-spacing:.22em; line-height:1; }
.main-nav { display:flex; align-items:center; gap:34px; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.main-nav a { transition: color .2s; }
.main-nav a:hover, .main-nav a:focus-visible { color:var(--text); }
.nav-cta { border:1px solid var(--line-strong); padding:12px 17px; border-radius:999px; color:var(--text)!important; }
.menu-toggle { display:none; border:0; background:transparent; color:#fff; width:42px; height:42px; position:relative; }
.menu-toggle span:not(.sr-only) { position:absolute; left:10px; right:10px; height:1px; background:#fff; transition:.2s; }
.menu-toggle span:first-child { top:16px; }
.menu-toggle span:nth-child(2) { top:25px; }
.menu-toggle[aria-expanded="true"] span:first-child { top:21px; transform:rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { top:21px; transform:rotate(-45deg); }

.hero { min-height: 100svh; display:flex; align-items:center; overflow:hidden; padding-top:140px; }
.hero::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 78% 42%, rgba(191,108,76,.09), transparent 26%), radial-gradient(circle at 18% 20%, rgba(255,255,255,.04), transparent 28%); pointer-events:none; }
.hero-field { position:absolute; width:740px; height:740px; border-radius:50%; right:-180px; top:8%; border:1px solid rgba(255,255,255,.05); box-shadow: 0 0 0 100px rgba(255,255,255,.018), 0 0 0 200px rgba(255,255,255,.01); animation: fieldPulse 8s ease-in-out infinite; }
@keyframes fieldPulse { 50% { transform:scale(1.045); opacity:.7; } }
.hero-grid { display:grid; grid-template-columns: .9fr 1.1fr; gap:40px; align-items:center; position:relative; z-index:2; }
.eyebrow { margin:0 0 28px; color:#d5d4cf; text-transform:uppercase; font-size:.73rem; letter-spacing:.24em; font-weight:700; }
.brand-intro { margin:0 0 13px; color:#6f7375; text-transform:uppercase; font-size:.58rem; letter-spacing:.22em; font-weight:700; }
.hero h1 { margin:0; font-size:clamp(4.3rem, 7.4vw, 7.9rem); line-height:.86; letter-spacing:-.065em; font-weight:630; }
.hero h1 em { font-family: Georgia, "Times New Roman", serif; font-weight:400; color:#d4d0c7; }
.hero-lead { max-width:610px; margin:35px 0 0; font-size:clamp(1.05rem, 1.7vw, 1.32rem); line-height:1.62; color:var(--muted); }
.hero-actions { display:flex; gap:12px; margin-top:38px; flex-wrap:wrap; }
.button { min-height:52px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; padding:0 24px; font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; transition:.22s; }
.button-primary { background:var(--text); color:#0a0b0c; }
.button-primary:hover { transform:translateY(-2px); box-shadow:0 10px 30px rgba(255,255,255,.1); }
.button-ghost { border:1px solid var(--line-strong); color:var(--text); }
.button-ghost:hover { border-color:rgba(255,255,255,.55); transform:translateY(-2px); }
.hero-proof { display:flex; gap:0; margin-top:44px; color:#777a7c; text-transform:uppercase; letter-spacing:.14em; font-size:.62rem; }
.hero-proof span { display:flex; align-items:center; }
.hero-proof span:not(:last-child)::after { content:""; width:18px; height:1px; background:#4a4d4f; margin:0 13px; }
.scroll-cue { position:absolute; bottom:28px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:11px; color:#777; text-transform:uppercase; font-size:.58rem; letter-spacing:.18em; }
.scroll-cue span { width:36px; height:1px; background:#666; position:relative; overflow:hidden; }
.scroll-cue span::after { content:""; position:absolute; inset:0; background:#fff; transform:translateX(-100%); animation:scrollCue 2.2s infinite; }
@keyframes scrollCue { 55%,100% { transform:translateX(100%); } }

.instrument-stage { position:relative; min-height:680px; display:grid; place-items:center; perspective:1300px; }
.instrument-shadow { position:absolute; width:68%; height:22%; bottom:8%; left:18%; background:rgba(0,0,0,.75); filter:blur(45px); transform:rotate(-8deg); border-radius:50%; }
.instrument { width:min(530px, 92%); aspect-ratio: .89; position:relative; transform:rotateX(7deg) rotateY(-8deg) rotateZ(3deg); transform-style:preserve-3d; transition:transform .18s ease-out; filter:drop-shadow(0 35px 50px rgba(0,0,0,.45)); }
.panel { position:absolute; inset:0 22px; padding:30px 34px 31px; border-radius:22px 22px 30px 30px; background:linear-gradient(105deg, #191b1d 0%, #0e0f10 50%, #1a1c1e 100%); border:1px solid #272a2c; box-shadow: inset 0 1px 0 rgba(255,255,255,.08), inset 0 0 35px rgba(255,255,255,.015); overflow:hidden; }
.panel::before { content:""; position:absolute; inset:0; opacity:.16; background:repeating-linear-gradient(92deg, rgba(255,255,255,.03) 0 1px, transparent 1px 4px); pointer-events:none; }
.wood-side { position:absolute; top:6px; bottom:5px; width:34px; border-radius:19px; z-index:-1; background:linear-gradient(90deg, #2f1e18, var(--wood), #3a251c); box-shadow:inset 0 0 0 1px rgba(255,255,255,.06), inset 7px 0 14px rgba(255,255,255,.04); }
.wood-side::after { content:""; position:absolute; inset:0; border-radius:inherit; background:repeating-linear-gradient(83deg, transparent 0 8px, rgba(255,255,255,.025) 9px 10px, transparent 11px 17px); }
.wood-left { left:0; transform:translateZ(-10px); }
.wood-right { right:0; transform:translateZ(-10px); }
.panel-topline { display:flex; align-items:center; justify-content:space-between; color:#d4d4d0; font-size:.55rem; letter-spacing:.18em; position:relative; z-index:2; }
.mini-logo { font-weight:800; }
.prototype-tag { color:#646769; }
.ab-control { height:42px; display:flex; justify-content:center; align-items:center; gap:8px; position:relative; z-index:2; color:#8e9092; margin:2px 0 4px; }
.ab-control small { position:absolute; bottom:0; left:50%; transform:translateX(-50%); font-size:.42rem; letter-spacing:.18em; white-space:nowrap; }
.ab-label { font-size:.45rem; }
.led { width:5px; height:5px; border-radius:50%; background:#313335; box-shadow:0 0 0 1px rgba(255,255,255,.08); }
.led.active { background:#f1f0eb; box-shadow:0 0 8px rgba(255,255,255,.7); }
.toggle { width:34px; height:11px; background:#070808; border:1px solid #2d3032; border-radius:5px; box-shadow:inset 0 2px 5px #000; position:relative; }
.toggle i { position:absolute; width:14px; height:15px; left:3px; top:-3px; border-radius:4px; background:linear-gradient(#2a2c2e,#111); border:1px solid #35383a; box-shadow:2px 3px 5px rgba(0,0,0,.8); transition:.3s; }
.oled { position:relative; height:112px; border-radius:8px; padding:9px; background:#030405; border:2px solid #08090a; box-shadow:0 0 0 1px #282b2d, inset 0 0 22px rgba(255,255,255,.035), 0 9px 18px rgba(0,0,0,.4); z-index:2; overflow:hidden; }
.oled::before { content:""; position:absolute; inset:0; background:linear-gradient(120deg, rgba(255,255,255,.04), transparent 28%); pointer-events:none; }
.oled-wave { width:100%; height:100%; overflow:visible; }
.wave-path { stroke-dasharray:7 3; animation:waveDash 7s linear infinite; }
@keyframes waveDash { to { stroke-dashoffset:-100; } }
.oled-state { fill:#fff; fill-opacity:.45; font-size:9px; letter-spacing:2px; }
.knobs { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; padding:24px 0 17px; position:relative; z-index:2; }
.control { text-align:center; color:#a6a7a7; font-size:.42rem; letter-spacing:.08em; transition:.25s; }
.control span { display:block; margin-top:9px; }
.knob { width:50px; height:50px; margin:auto; border-radius:50%; background:radial-gradient(circle at 42% 32%, #313335, #111315 63%, #050606 64%); border:1px solid #383a3c; box-shadow:0 7px 10px rgba(0,0,0,.68), inset 0 1px 0 rgba(255,255,255,.12); position:relative; transition:.25s; }
.knob::after { content:""; position:absolute; inset:5px; border-radius:50%; border:1px solid rgba(255,255,255,.03); }
.knob i { position:absolute; width:1px; height:12px; background:#858788; top:5px; left:50%; transform-origin:50% 20px; transform:rotate(-30deg); opacity:.45; }
.control.active { color:#fff; }
.control.active .knob { transform:translateY(-2px); box-shadow:0 7px 18px rgba(191,108,76,.26), inset 0 1px 0 rgba(255,255,255,.14); border-color:#6f4b3d; }
.pads { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; position:relative; z-index:2; }
.pads button { aspect-ratio:1.12; border:1px solid #2d3032; border-radius:6px; color:#737678; background:linear-gradient(145deg,#202224,#101112); box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 5px 7px rgba(0,0,0,.58); font-size:.36rem; letter-spacing:.05em; cursor:pointer; transition:.12s; }
.pads button:hover { color:#c6c7c5; border-color:#444749; }
.pads button:active, .pads button.active { transform:translateY(2px); color:#fff; background:#181a1c; box-shadow:inset 0 3px 7px rgba(0,0,0,.8); }
.fader-block { display:grid; grid-template-columns:12px 1fr 12px; align-items:center; gap:8px; margin:25px 16px 0; color:#6f7274; font-size:.42rem; position:relative; z-index:2; }
.fader-block small { position:absolute; top:25px; left:50%; transform:translateX(-50%); white-space:nowrap; font-size:.38rem; letter-spacing:.15em; }
.fader { height:7px; border-radius:6px; background:#050606; border:1px solid #252729; box-shadow:inset 0 2px 4px #000; position:relative; }
.fader::after { content:""; position:absolute; inset:2px 12%; background:linear-gradient(90deg, rgba(255,255,255,.08), rgba(255,255,255,.32), rgba(255,255,255,.08)); height:1px; }
.fader i { position:absolute; left:45%; top:50%; width:24px; height:33px; transform:translate(-50%,-50%); border-radius:5px; background:repeating-linear-gradient(90deg,#1c1e20 0 2px,#343638 2px 3px); border:1px solid #3c3f41; box-shadow:0 5px 8px #000; }

.section-index { color:#737679; font-size:.63rem; letter-spacing:.2em; text-transform:uppercase; margin-bottom:28px; }
.manifest { background:#efeee8; color:#111315; }
.manifest-grid { display:grid; grid-template-columns:.55fr 1.25fr 1fr; gap:70px; align-items:start; }
.manifest .section-index { color:#6a6d6d; }
.kicker { color:#6b6c6b; font-family:Georgia,serif; font-style:italic; font-size:1.2rem; line-height:1.5; margin:0 0 38px; }
.manifest h2, .section-heading h2, .workflow h2, .ab-copy h2, .roadmap h2, .contact h2 { margin:0; font-size:clamp(2.6rem,5.1vw,5.2rem); line-height:.98; letter-spacing:-.055em; font-weight:580; }
.manifest-copy > p:last-child { color:#5d5f60; max-width:680px; font-size:1.08rem; line-height:1.75; }
.manifest-statements { border-top:1px solid rgba(0,0,0,.18); }
.manifest-statements article { padding:22px 0; display:grid; grid-template-columns:38px 1fr; column-gap:12px; border-bottom:1px solid rgba(0,0,0,.13); }
.manifest-statements article span { grid-row:1 / 3; color:#8d8e8b; font-size:.66rem; }
.manifest-statements h3 { margin:0 0 7px; font-size:1.12rem; }
.manifest-statements p { margin:0; color:#6b6d6d; font-size:.92rem; line-height:1.55; }

.dimensions { background:#0b0c0d; }
.section-heading { display:grid; grid-template-columns:1.45fr .55fr; gap:80px; align-items:end; margin-bottom:70px; }
.section-heading p { color:var(--muted); line-height:1.7; margin:0 0 7px; max-width:430px; }
.dimension-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.dimension-card { min-height:510px; padding:28px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); display:flex; flex-direction:column; position:relative; overflow:hidden; transition:background .3s, transform .3s; --scale-progress:50%; --scale-travel:2.5%; --scale-duration:4.2s; }
.dimension-card:hover { background:#111315; transform:translateY(-5px); }
.dimension-card[data-dimension-card="mass"] { --scale-progress:34%; --scale-duration:4.8s; }
.dimension-card[data-dimension-card="tension"] { --scale-progress:68%; --scale-duration:3.6s; }
.dimension-card[data-dimension-card="motion"] { --scale-progress:58%; --scale-duration:4.1s; }
.dimension-card[data-dimension-card="space"] { --scale-progress:79%; --scale-duration:5.2s; }
.dimension-number { color:#606366; font-size:.62rem; }
.dimension-visual { height:190px; display:grid; place-items:center; position:relative; isolation:isolate; }
.dimension-visual::before, .dimension-visual::after, .dimension-visual span { content:""; display:block; position:absolute; left:50%; top:50%; border:1px solid rgba(255,255,255,.25); }
.mass-visual::before { width:110px; height:110px; border-radius:50%; box-shadow:inset 0 0 40px rgba(255,255,255,.05); transform:translate(-50%,-50%); animation:massPulse 5.2s ease-in-out infinite; }
.mass-visual::after { width:58px; height:58px; border-radius:50%; background:rgba(255,255,255,.07); transform:translate(-50%,-50%); animation:massCore 3.8s ease-in-out infinite; }
.mass-visual span { width:12px; height:12px; border-radius:50%; background:#fff; border:0; box-shadow:0 0 25px rgba(255,255,255,.6); transform:translate(-50%,-50%); animation:massDot 2.8s ease-in-out infinite; }
@keyframes massPulse { 0%,100% { transform:translate(-50%,-50%) scale(.94); opacity:.55; } 50% { transform:translate(-50%,-50%) scale(1.06); opacity:1; } }
@keyframes massCore { 0%,100% { transform:translate(-50%,-50%) scale(.92); opacity:.55; } 50% { transform:translate(-50%,-50%) scale(1.12); opacity:.92; } }
@keyframes massDot { 0%,100% { transform:translate(-50%,-50%) scale(.92); } 50% { transform:translate(-50%,-50%) scale(1.24); } }
.tension-visual::before { width:128px; height:1px; border:0; background:linear-gradient(90deg,transparent,#fff,transparent); transform:translate(-50%,-50%) rotate(-18deg) scaleX(.86); animation:tensionLineA 3.2s ease-in-out infinite alternate; }
.tension-visual::after { width:128px; height:1px; border:0; background:linear-gradient(90deg,transparent,#fff,transparent); transform:translate(-50%,-50%) rotate(18deg) scaleX(.86); animation:tensionLineB 3.2s ease-in-out infinite alternate; }
.tension-visual span { width:76px; height:76px; transform:translate(-50%,-50%) rotate(45deg) scale(.92); border-color:rgba(191,108,76,.65); animation:tensionCore 2.7s ease-in-out infinite alternate; }
@keyframes tensionLineA { from { transform:translate(-50%,-50%) rotate(-18deg) scaleX(.82); opacity:.5; } to { transform:translate(-50%,-50%) rotate(-11deg) scaleX(1.08); opacity:1; } }
@keyframes tensionLineB { from { transform:translate(-50%,-50%) rotate(18deg) scaleX(.82); opacity:.5; } to { transform:translate(-50%,-50%) rotate(11deg) scaleX(1.08); opacity:1; } }
@keyframes tensionCore { from { transform:translate(-50%,-50%) rotate(45deg) scale(.88); } to { transform:translate(-50%,-50%) rotate(45deg) scale(1.06); } }
.motion-visual::before { width:130px; height:70px; border-radius:50%; border-color:rgba(255,255,255,.22); transform:translate(-50%,-50%) rotate(-12deg); animation:motionRingA 8s linear infinite; }
.motion-visual::after { width:92px; height:118px; border-radius:50%; transform:translate(-50%,-50%) rotate(30deg); animation:motionRingB 9s linear infinite reverse; }
.motion-visual span { width:10px; height:10px; border-radius:50%; background:#fff; border:0; box-shadow:0 0 16px rgba(255,255,255,.55); transform:translate(calc(-50% + 58px),-50%); animation:motionDot 4.2s linear infinite; will-change:transform; }
@keyframes motionDot {
  0%,100% { transform:translate(calc(-50% + 58px),-50%); }
  12.5% { transform:translate(calc(-50% + 41px),calc(-50% - 24px)); }
  25% { transform:translate(-50%,calc(-50% - 34px)); }
  37.5% { transform:translate(calc(-50% - 41px),calc(-50% - 24px)); }
  50% { transform:translate(calc(-50% - 58px),-50%); }
  62.5% { transform:translate(calc(-50% - 41px),calc(-50% + 24px)); }
  75% { transform:translate(-50%,calc(-50% + 34px)); }
  87.5% { transform:translate(calc(-50% + 41px),calc(-50% + 24px)); }
}
@keyframes motionRingA { from { transform:translate(-50%,-50%) rotate(-12deg); } to { transform:translate(-50%,-50%) rotate(348deg); } }
@keyframes motionRingB { from { transform:translate(-50%,-50%) rotate(30deg); } to { transform:translate(-50%,-50%) rotate(-330deg); } }
.space-visual::before { width:124px; height:124px; border-radius:50%; transform:translate(-50%,-50%) scale(.94); animation:spaceField 6s ease-in-out infinite; }
.space-visual::after { width:78px; height:78px; border-radius:50%; transform:translate(-50%,-50%); animation:spaceFieldInner 4.5s ease-in-out infinite reverse; }
.space-visual span { width:34px; height:34px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.4),transparent 70%); border:0; box-shadow:0 0 40px rgba(255,255,255,.18); transform:translate(-50%,-50%); animation:spaceCore 5.5s ease-in-out infinite; }
@keyframes spaceField { 0%,100% { transform:translate(-50%,-50%) scale(.92); opacity:.45; } 50% { transform:translate(-50%,-50%) scale(1.08); opacity:.95; } }
@keyframes spaceFieldInner { 0%,100% { transform:translate(-50%,-50%) scale(.9); opacity:.42; } 50% { transform:translate(-50%,-50%) scale(1.14); opacity:.82; } }
@keyframes spaceCore { 0%,100% { transform:translate(-50%,-50%) scale(.86); filter:blur(0px); } 50% { transform:translate(-50%,-50%) scale(1.16); filter:blur(.4px); } }
.dimension-card h3 { margin:12px 0 15px; font-size:1.55rem; letter-spacing:.05em; }
.dimension-card > p { color:#929496; line-height:1.65; font-size:.94rem; margin:0; }
.dimension-scale { margin-top:auto; padding-top:30px; display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center; color:#65686a; font-size:.56rem; text-transform:uppercase; letter-spacing:.1em; }
.dimension-scale i { height:1px; position:relative; background:linear-gradient(90deg,rgba(255,255,255,.1),rgba(255,255,255,.6)); }
.dimension-scale i::after { content:""; position:absolute; left:var(--scale-progress); top:50%; width:8px; height:8px; border-radius:50%; background:#fff; box-shadow:0 0 12px rgba(255,255,255,.45); transform:translate(-50%,-50%) scale(.96); animation:scaleMarker var(--scale-duration) ease-in-out infinite; will-change:left,transform,opacity; }
@keyframes scaleMarker {
  0%,100% { left:calc(var(--scale-progress) - var(--scale-travel)); transform:translate(-50%,-50%) scale(.94); opacity:.72; }
  50% { left:calc(var(--scale-progress) + var(--scale-travel)); transform:translate(-50%,-50%) scale(1.18); opacity:1; }
}

.workflow { background:#17191b; overflow:hidden; }
.workflow::before { content:""; position:absolute; width:800px; height:800px; border:1px solid rgba(255,255,255,.04); border-radius:50%; left:-360px; top:50%; transform:translateY(-50%); box-shadow:0 0 0 90px rgba(255,255,255,.012),0 0 0 180px rgba(255,255,255,.008); }
.workflow-layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:100px; position:relative; z-index:2; }
.workflow-copy { position:sticky; top:140px; align-self:start; }
.workflow-copy > p { color:var(--muted); line-height:1.7; font-size:1.05rem; max-width:520px; }
.workflow-note { display:flex; align-items:center; gap:12px; margin-top:42px; color:#8d8f91; font-size:.72rem; }
.workflow-note span { width:9px; height:9px; border:1px solid #9da0a1; border-radius:50%; box-shadow:inset 0 0 0 2px #17191b; background:#d9d9d5; }
.workflow-steps { list-style:none; padding:0; margin:0; border-top:1px solid var(--line); }
.workflow-steps li { min-height:140px; display:grid; grid-template-columns:58px 160px 1fr; align-items:center; border-bottom:1px solid var(--line); transition:.25s; }
.workflow-steps li:hover { padding-left:12px; background:rgba(255,255,255,.018); }
.workflow-steps span { color:#5f6264; font-size:.62rem; }
.workflow-steps strong { letter-spacing:.1em; font-size:.9rem; }
.workflow-steps p { margin:0; color:#96989a; line-height:1.55; }

.ab-section { background:#efeee8; color:#111315; }
.ab-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:110px; align-items:center; }
.ab-visual { height:530px; position:relative; display:flex; align-items:center; justify-content:center; }
.state-card { width:210px; height:280px; border:1px solid rgba(0,0,0,.2); background:#e7e5de; padding:26px; display:flex; flex-direction:column; justify-content:space-between; box-shadow:0 20px 60px rgba(0,0,0,.08); position:absolute; }
.state-card span { color:#787a79; font-size:.58rem; letter-spacing:.16em; }
.state-card strong { font-size:1.7rem; font-weight:500; }
.state-card i { width:78px; height:78px; border:1px solid #777; border-radius:50%; align-self:center; }
.state-a { left:5%; transform:rotate(-7deg); }
.state-b { right:5%; transform:rotate(7deg); background:#1a1c1d; color:#f0efea; border-color:#333; }
.state-b span { color:#8f9292; }
.state-b i { border-color:#aaa; box-shadow:inset 0 0 20px rgba(255,255,255,.06); }
.morph-axis { width:54%; position:relative; z-index:3; display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center; color:#747676; font-size:.65rem; }
.morph-axis > div { height:8px; border:1px solid rgba(0,0,0,.3); border-radius:8px; background:#d4d2cb; position:relative; }
.morph-axis > div::after { content:""; position:absolute; left:8%; right:8%; top:50%; height:1px; background:#595b5b; }
.morph-axis i { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:30px; height:42px; border-radius:6px; background:#151718; border:1px solid #303234; box-shadow:0 5px 12px rgba(0,0,0,.35); z-index:2; }
.ab-copy p { color:#5f6161; line-height:1.75; font-size:1.04rem; }
.ab-copy p strong { color:#141616; }
.ab-principle { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:14px; margin-top:38px; color:#777978; text-transform:uppercase; font-size:.6rem; letter-spacing:.16em; }
.ab-principle i { height:1px; background:linear-gradient(90deg,#aaa,var(--accent),#333); }

.instrument-section { background:#0b0c0d; }
.instrument-content { display:grid; grid-template-columns:1.05fr .95fr; gap:75px; align-items:center; }
.concept-image { margin:0; position:relative; overflow:hidden; border-radius:18px; background:#111; border:1px solid var(--line); }
.concept-image::after { content:""; position:absolute; inset:0; box-shadow:inset 0 0 80px rgba(0,0,0,.35); pointer-events:none; }
.concept-image img { width:100%; aspect-ratio:.78; object-fit:cover; object-position:center 45%; filter:saturate(.72) contrast(1.04); }
.concept-image figcaption { position:absolute; z-index:2; left:18px; bottom:16px; padding:9px 12px; border-radius:999px; background:rgba(7,8,9,.7); backdrop-filter:blur(8px); color:#a8aaab; font-size:.64rem; letter-spacing:.06em; }
.spec-list { border-top:1px solid var(--line); }
.spec-list article { display:grid; grid-template-columns:46px 1fr; padding:26px 0; border-bottom:1px solid var(--line); }
.spec-list article > span { color:#626567; font-size:.62rem; padding-top:3px; }
.spec-list h3 { margin:0 0 8px; font-size:1.14rem; font-weight:600; }
.spec-list p { margin:0; color:#929496; line-height:1.6; }

.roadmap { background:#17191b; }
.roadmap-grid { display:grid; grid-template-columns:1fr 1fr; gap:100px; }
.roadmap-copy p { color:var(--muted); line-height:1.7; max-width:570px; }
.roadmap-list { border-top:1px solid var(--line); }
.roadmap-list article { display:grid; grid-template-columns:48px 1fr; align-items:center; min-height:94px; border-bottom:1px solid var(--line); }
.roadmap-list article > span { color:#5c5f61; font-size:.6rem; }
.roadmap-list article div { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.roadmap-list strong { font-size:.96rem; }
.roadmap-list small { color:#737679; }
.roadmap-list .current { position:relative; }
.roadmap-list .current::before { content:""; position:absolute; left:-1px; width:2px; height:34%; background:var(--accent); }
.roadmap-list .current small { color:#d08a6e; }

.company-section { background:#efeee8; color:#111315; }
.company-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:100px; align-items:start; }
.company-lockup { position:sticky; top:140px; }
.company-kicker { margin:0 0 28px; color:#6b6d6d; font-family:Georgia,serif; font-style:italic; font-size:1.18rem; }
.company-section h2 { margin:0; max-width:620px; font-size:clamp(2.7rem,5vw,5.2rem); line-height:.98; letter-spacing:-.055em; font-weight:580; }
.company-copy > p { margin:0 0 44px; color:#5f6161; font-size:1.08rem; line-height:1.75; }
.company-copy > p strong { color:#111315; letter-spacing:.08em; }
.company-principles { border-top:1px solid rgba(0,0,0,.18); }
.company-principles article { display:grid; grid-template-columns:42px 120px 1fr; gap:14px; align-items:start; padding:25px 0; border-bottom:1px solid rgba(0,0,0,.13); }
.company-principles span { color:#8d8e8b; font-size:.63rem; padding-top:4px; }
.company-principles h3 { margin:0; font-size:1rem; }
.company-principles p { margin:0; color:#666867; line-height:1.55; font-size:.92rem; }


/* v0.6 — DZAYER LABS community layer */
.origin-note { margin:0 0 42px; padding:24px 26px; border-left:2px solid var(--accent); background:rgba(0,0,0,.035); }
.origin-note > span { display:block; margin-bottom:10px; color:#8b8d8c; font-size:.56rem; letter-spacing:.18em; }
.origin-note p { margin:0; color:#5f6161; line-height:1.65; font-size:.94rem; }
.origin-note strong { color:#111315; letter-spacing:.06em; }

.community-section { background:#111315; overflow:hidden; }
.community-section::before { content:""; position:absolute; width:820px; height:820px; left:-390px; top:50%; transform:translateY(-50%); border:1px solid rgba(255,255,255,.035); border-radius:50%; box-shadow:0 0 0 100px rgba(255,255,255,.01),0 0 0 200px rgba(255,255,255,.006); }
.community-shell { position:relative; z-index:2; }
.community-heading { display:grid; grid-template-columns:1.25fr .75fr; gap:80px; align-items:end; margin-bottom:66px; }
.community-heading h2 { margin:0; max-width:900px; font-size:clamp(2.7rem,5.15vw,5.4rem); line-height:.98; letter-spacing:-.055em; font-weight:580; }
.community-heading > p { margin:0 0 8px; color:var(--muted); line-height:1.72; font-size:1.02rem; }
.community-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.community-card { min-height:300px; padding:32px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); display:flex; flex-direction:column; transition:background .25s,transform .25s; }
.community-card:hover { background:rgba(255,255,255,.02); transform:translateY(-4px); }
.community-card > span { color:#686b6d; font-size:.58rem; letter-spacing:.17em; }
.community-card h3 { margin:auto 0 18px; font-size:1.85rem; letter-spacing:-.03em; font-weight:560; }
.community-card p { margin:0; color:#96989a; line-height:1.65; font-size:.94rem; }
.community-cta { margin-top:38px; padding-top:32px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:40px; }
.community-cta p { margin:0; max-width:730px; color:#85888a; line-height:1.65; }
.community-cta strong { color:#ecebe6; }
.profile-field { display:block; margin-bottom:26px; }
.profile-field > span,.signup-form > label[for="email"] { display:block; color:#8d8f91; font-size:.68rem; text-transform:uppercase; letter-spacing:.13em; margin-bottom:10px; }
.profile-field select { width:100%; height:54px; padding:0 42px 0 0; border:0; border-bottom:1px solid #55595b; border-radius:0; outline:0; background:transparent; color:#e9e8e3; font:inherit; appearance:none; cursor:pointer; background-image:linear-gradient(45deg,transparent 50%,#777 50%),linear-gradient(135deg,#777 50%,transparent 50%); background-position:calc(100% - 13px) 24px,calc(100% - 7px) 24px; background-size:6px 6px,6px 6px; background-repeat:no-repeat; }
.profile-field select:focus { border-color:#c7c6c0; }
.profile-field select option { color:#111; background:#fff; }

.contact { background:#0b0c0d; padding-bottom:80px; }
.contact-card { min-height:390px; border:1px solid var(--line); border-radius:var(--radius); padding:65px; display:grid; grid-template-columns:1fr .85fr; gap:80px; align-items:center; background:linear-gradient(125deg,#17191b,#0d0e0f 60%); position:relative; overflow:hidden; }
.contact-card::after { content:""; position:absolute; width:420px; height:420px; border:1px solid rgba(255,255,255,.05); border-radius:50%; right:-160px; top:-180px; box-shadow:0 0 0 70px rgba(255,255,255,.012); }
.contact-copy, .signup-form { position:relative; z-index:2; }
.contact-copy p:last-child { color:var(--muted); line-height:1.7; max-width:520px; }
.signup-form > label[for="email"] { display:block; color:#8d8f91; font-size:.68rem; text-transform:uppercase; letter-spacing:.13em; margin-bottom:10px; }
.field-row { display:grid; grid-template-columns:1fr auto; border-bottom:1px solid #55595b; }
.field-row input { min-width:0; height:60px; background:transparent; color:#fff; border:0; outline:0; font-size:1.05rem; }
.field-row input::placeholder { color:#5f6264; }
.field-row button { border:0; background:transparent; color:#fff; font-weight:700; text-transform:uppercase; font-size:.72rem; letter-spacing:.1em; cursor:pointer; padding:0 0 0 22px; }
.field-row button:hover { color:#d99a80; }
.consent { display:flex; gap:10px; align-items:flex-start; margin-top:17px; color:#777a7c; font-size:.72rem; line-height:1.4; }
.consent input { accent-color:var(--accent); margin-top:2px; }
.form-status { min-height:20px; color:#d39a84; font-size:.75rem; }
.hidden-field { display:none; }

.site-footer { background:#0b0c0d; padding:30px 0 42px; }
.footer-inner { border-top:1px solid var(--line); padding-top:28px; display:flex; justify-content:space-between; align-items:center; color:#6d7072; font-size:.7rem; }
.footer-inner > div { display:flex; gap:18px; align-items:center; }
.footer-inner strong { color:#e2e2de; letter-spacing:.18em; }
.footer-inner a:hover { color:#fff; }

.reveal { opacity:0; transform:translateY(26px); transition:opacity .8s cubic-bezier(.2,.75,.25,1), transform .8s cubic-bezier(.2,.75,.25,1); transition-delay:var(--delay,0ms); }
.reveal.visible { opacity:1; transform:none; }

@media (max-width: 1040px) {
  .hero-grid { grid-template-columns:1fr; }
  .hero-copy { padding-top:40px; }
  .instrument-stage { min-height:660px; }
  .manifest-grid { grid-template-columns:1fr 1fr; }
  .manifest-grid > .section-index { grid-column:1 / -1; }
  .dimension-grid { grid-template-columns:repeat(2,1fr); }
  .workflow-layout, .ab-grid, .instrument-content, .roadmap-grid { gap:60px; }
  .state-card { width:180px; height:250px; }
  .contact-card { grid-template-columns:1fr; gap:45px; }
}

@media (max-width: 820px) {
  .section-pad { padding:95px 0; }
  .menu-toggle { display:block; z-index:3; }
  .main-nav { position:fixed; inset:0; display:flex; flex-direction:column; justify-content:center; gap:28px; background:rgba(9,10,11,.97); transform:translateY(-100%); opacity:0; transition:.28s; font-size:.9rem; }
  .main-nav.open { transform:none; opacity:1; }
  .nav-cta { margin-top:10px; }
  .hero { min-height:auto; padding-top:125px; padding-bottom:100px; }
  .hero h1 { font-size:clamp(4.2rem,16vw,6.3rem); }
  .instrument-stage { min-height:600px; }
  .section-heading, .workflow-layout, .ab-grid, .instrument-content, .roadmap-grid, .company-grid { grid-template-columns:1fr; }
  .section-heading { gap:30px; }
  .workflow-copy, .company-lockup { position:relative; top:auto; }
  .ab-visual { order:2; }
  .ab-copy { order:1; }
  .instrument-content { gap:45px; }
  .contact-card { padding:42px; }
  .footer-inner { flex-direction:column; align-items:flex-start; gap:18px; }
}

@media (max-width: 620px) {
  .shell { width:min(100% - 28px,var(--max)); }
  .header-inner { height:72px; }
  .brand { gap:8px; }
  .brand-mark { width:25px; height:25px; }
  .brand-wordmark strong { font-size:.78rem; }
  .brand-wordmark small { font-size:.43rem; }
  .hero { padding-top:105px; }
  .hero h1 { letter-spacing:-.07em; }
  .hero-lead { font-size:1rem; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .button { width:100%; }
  .hero-proof { font-size:.54rem; }
  .instrument-stage { min-height:500px; margin-inline:-28px; overflow:visible; }
  .instrument { width:440px; max-width:106vw; transform:rotateX(5deg) rotateY(-4deg) rotateZ(2deg) scale(.88); }
  .panel { padding:24px 28px; }
  .oled { height:92px; }
  .knobs { padding:18px 0 14px; gap:6px; }
  .knob { width:43px; height:43px; }
  .pads { gap:7px; }
  .fader-block { margin-top:20px; }
  .manifest-grid { grid-template-columns:1fr; gap:40px; }
  .dimension-grid { grid-template-columns:1fr; }
  .dimension-card { min-height:460px; }
  .workflow-steps li { grid-template-columns:38px 115px 1fr; min-height:125px; }
  .workflow-steps p { font-size:.85rem; }
  .ab-visual { height:420px; }
  .state-card { width:145px; height:220px; padding:20px; }
  .state-card strong { font-size:1.35rem; }
  .state-a { left:0; }
  .state-b { right:0; }
  .morph-axis { width:62%; }
  .contact-card { padding:34px 24px; }
  .field-row { grid-template-columns:1fr; }
  .field-row button { height:48px; padding:0; text-align:left; }
  .concept-image img { aspect-ratio:.75; }
  .company-principles article { grid-template-columns:32px 90px 1fr; gap:10px; }
}


@media (max-width:900px) {
  .community-heading { grid-template-columns:1fr; gap:28px; }
  .community-grid { grid-template-columns:1fr; }
  .community-card { min-height:240px; }
  .community-cta { align-items:flex-start; flex-direction:column; }
}
@media (max-width:620px) {
  .community-heading h2 { font-size:clamp(2.75rem,12vw,4.3rem); }
  .community-card { min-height:230px; padding:28px 24px; }
  .community-cta .button { width:100%; }
  .origin-note { padding:21px 20px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .reveal { opacity:1; transform:none; }
}

/* v0.4 — Physics Lab and navigation feedback */
.scroll-progress { position:absolute; left:0; right:0; bottom:-1px; height:1px; overflow:hidden; pointer-events:none; }
.scroll-progress i { display:block; height:100%; width:100%; background:linear-gradient(90deg,#f2f1ec,var(--accent)); transform:scaleX(0); transform-origin:left center; }
.main-nav a.active:not(.nav-cta) { color:var(--text); }
.main-nav a.active:not(.nav-cta)::after { content:""; display:block; height:1px; margin-top:5px; background:var(--accent); }
.dimension-card:focus-visible { outline:1px solid rgba(255,255,255,.7); outline-offset:-3px; background:#111315; }
.dimension-number { display:flex; justify-content:space-between; align-items:center; }
.dimension-number output { color:#b9bbb9; font-variant-numeric:tabular-nums; letter-spacing:.12em; }
.dimension-card.is-active { background:#111315; }
.dimension-card.is-active::after { content:"ACTIVE FIELD"; position:absolute; right:18px; top:50%; writing-mode:vertical-rl; color:rgba(255,255,255,.16); letter-spacing:.18em; font-size:.5rem; }

.physics-lab { background:#111315; overflow:hidden; }
.physics-lab::before { content:""; position:absolute; width:760px; height:760px; border-radius:50%; border:1px solid rgba(255,255,255,.035); right:-350px; top:50%; transform:translateY(-50%); box-shadow:0 0 0 95px rgba(255,255,255,.01),0 0 0 190px rgba(255,255,255,.007); }
.lab-grid { display:grid; grid-template-columns:.82fr 1.18fr; gap:86px; align-items:center; position:relative; z-index:2; }
.lab-copy h2 { margin:0; font-size:clamp(2.7rem,5vw,5.15rem); line-height:.97; letter-spacing:-.055em; font-weight:580; }
.lab-copy > p:not(.eyebrow) { max-width:560px; color:var(--muted); line-height:1.75; font-size:1.04rem; }
.lab-disclaimer { display:flex; align-items:center; gap:12px; margin-top:34px; color:#777a7c; font-size:.7rem; }
.lab-disclaimer span { width:8px; height:8px; border-radius:50%; border:1px solid #777; box-shadow:inset 0 0 0 2px #111315; background:#e5e4de; }
.lab-console { border:1px solid var(--line); border-radius:24px; overflow:hidden; background:#0a0b0c; box-shadow:0 34px 85px rgba(0,0,0,.34); }
.field-stage { --mass-scale:1; --space-scale:1; --tension-spread:42px; --motion-speed:5s; --space-inner-scale:.82; --mass-glow:48px; min-height:450px; position:relative; display:grid; place-items:center; overflow:hidden; border-bottom:1px solid var(--line); background:radial-gradient(circle at 50% 48%,rgba(255,255,255,.055),transparent 22%),#090a0b; }
.field-grid { position:absolute; inset:0; opacity:.22; background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px); background-size:44px 44px; mask-image:radial-gradient(circle,#000 20%,transparent 72%); }
.field-ring { position:absolute; left:50%; top:48%; border:1px solid rgba(255,255,255,.22); border-radius:50%; transform:translate(-50%,-50%) scale(var(--space-scale)); transition:transform .22s ease-out,opacity .22s; }
.field-ring-outer { width:236px; height:236px; opacity:.48; box-shadow:0 0 58px rgba(255,255,255,.035); }
.field-ring-inner { width:142px; height:142px; opacity:.72; transform:translate(-50%,-50%) scale(var(--space-inner-scale)); }
.field-tension { position:absolute; left:50%; top:48%; width:250px; height:1px; background:linear-gradient(90deg,transparent,rgba(191,108,76,.12),rgba(255,255,255,.7),rgba(191,108,76,.12),transparent); transform-origin:center; transition:transform .22s ease-out,opacity .22s; }
.tension-a { transform:translate(-50%,calc(-50% - var(--tension-spread))) rotate(17deg); }
.tension-b { transform:translate(-50%,calc(-50% + var(--tension-spread))) rotate(-17deg); }
.field-core { position:absolute; left:50%; top:48%; width:58px; height:58px; border-radius:50%; transform:translate(-50%,-50%) scale(var(--mass-scale)); transition:transform .22s ease-out,box-shadow .22s; background:radial-gradient(circle at 38% 34%,#fff,#c9c8c1 13%,#484a4b 37%,#101112 69%); box-shadow:0 0 var(--mass-glow) rgba(255,255,255,.17),inset 0 0 20px rgba(255,255,255,.28); z-index:3; }
.field-rotor { position:absolute; left:50%; top:48%; width:calc(150px * var(--space-scale)); height:calc(90px * var(--space-scale)); border-radius:50%; transform:translate(-50%,-50%) rotate(0deg); animation:fieldOrbit var(--motion-speed) linear infinite; transition:width .22s,height .22s; z-index:4; }
.field-rotor i { position:absolute; right:-5px; top:50%; width:10px; height:10px; border-radius:50%; transform:translateY(-50%); background:#fff; box-shadow:0 0 18px rgba(255,255,255,.75); }
@keyframes fieldOrbit { to { transform:translate(-50%,-50%) rotate(360deg); } }
.field-readout { position:absolute; left:24px; right:24px; bottom:22px; display:flex; justify-content:space-between; align-items:end; color:#5e6264; font-size:.58rem; letter-spacing:.16em; }
.field-readout strong { color:#d8d8d2; font-size:.68rem; font-variant-numeric:tabular-nums; font-weight:600; }
.lab-controls { display:grid; grid-template-columns:1fr 1fr; }
.lab-control { padding:25px 26px 22px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); cursor:ew-resize; }
.lab-control:nth-child(even) { border-right:0; }
.lab-control:nth-last-child(-n+2) { border-bottom:0; }
.lab-control > span { display:flex; justify-content:space-between; align-items:center; margin-bottom:17px; }
.lab-control strong { font-size:.72rem; letter-spacing:.12em; }
.lab-control output { color:#aaa; font-size:.68rem; font-variant-numeric:tabular-nums; }
.lab-control input { width:100%; height:20px; margin:0; appearance:none; background:transparent; cursor:ew-resize; touch-action:none; }
.lab-control input::-webkit-slider-runnable-track { height:1px; background:linear-gradient(90deg,rgba(255,255,255,.2),rgba(255,255,255,.72)); }
.lab-control input::-webkit-slider-thumb { appearance:none; width:13px; height:13px; border-radius:50%; margin-top:-6px; background:#f4f3ed; border:3px solid #141617; box-shadow:0 0 0 1px #eee,0 0 13px rgba(255,255,255,.28); }
.lab-control input::-moz-range-track { height:1px; background:linear-gradient(90deg,rgba(255,255,255,.2),rgba(255,255,255,.72)); }
.lab-control input::-moz-range-thumb { width:8px; height:8px; border-radius:50%; background:#f4f3ed; border:3px solid #141617; box-shadow:0 0 0 1px #eee; }
.lab-control small { display:grid; grid-template-columns:auto 1fr auto; gap:9px; align-items:center; color:#5e6264; text-transform:uppercase; letter-spacing:.11em; font-size:.5rem; }
.lab-control small i { height:1px; background:rgba(255,255,255,.08); }
.lab-control.is-active { background:rgba(255,255,255,.018); }

@media (max-width: 900px) {
  .lab-grid { grid-template-columns:1fr; gap:48px; }
  .field-stage { min-height:420px; }
}
@media (max-width: 620px) {
  .physics-lab { padding-top:100px; }
  .lab-copy h2 { font-size:clamp(2.8rem,13vw,4.4rem); }
  .lab-copy > p:not(.eyebrow) { font-size:.98rem; }
  .lab-console { margin-inline:-1px; border-radius:18px; }
  .field-stage { min-height:350px; }
  .field-ring-outer { width:190px; height:190px; }
  .field-ring-inner { width:112px; height:112px; }
  .field-tension { width:205px; }
  .lab-controls { grid-template-columns:1fr; }
  .lab-control,.lab-control:nth-child(even),.lab-control:nth-last-child(-n+2) { border-right:0; border-bottom:1px solid var(--line); padding:23px 22px 20px; }
  .lab-control:last-child { border-bottom:0; }
  .field-readout { left:18px; right:18px; }
  .main-nav a.active:not(.nav-cta)::after { display:none; }
}


/* Pages utilitaires et déploiement contrôlé */
.consent a { color:#bfc1c2; text-decoration:underline; text-underline-offset:3px; }
.consent a:hover { color:#fff; }
.footer-links { display:flex; gap:20px; align-items:center; }
.utility-page { min-height:100vh; background:#0b0c0d; color:#efeee8; }
.utility-main { min-height:calc(100vh - 90px); display:grid; place-items:center; padding:140px 0 80px; }
.utility-card { width:min(760px,100%); border:1px solid var(--line); border-radius:var(--radius); padding:clamp(28px,6vw,64px); background:linear-gradient(145deg,#17191b,#0d0e0f 65%); }
.utility-card .eyebrow { margin-bottom:22px; }
.utility-card h1 { margin:0 0 24px; font-size:clamp(2.6rem,8vw,5rem); line-height:.98; letter-spacing:-.055em; font-weight:580; }
.utility-card h2 { margin:34px 0 12px; font-size:1.25rem; }
.utility-card p, .utility-card li { color:#999b9d; line-height:1.75; }
.utility-card ul { padding-left:20px; }
.utility-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:34px; }
.utility-note { margin-top:28px; padding-top:22px; border-top:1px solid var(--line); color:#747779!important; font-size:.78rem; }
@media (max-width:620px) { .footer-links { width:100%; justify-content:space-between; } .utility-main { padding-top:105px; } }


/* v0.6.1 — transparence produit, FAQ et préparation social preview */
.build-status { background:#0d0f10; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.build-status-inner { min-height:88px; display:grid; grid-template-columns:repeat(4,1fr); }
.build-status-inner > div { display:grid; grid-template-columns:12px 1fr; grid-template-rows:auto auto; column-gap:10px; align-content:center; padding:18px 24px; border-right:1px solid var(--line); }
.build-status-inner > div:first-child { border-left:1px solid var(--line); }
.build-status-inner strong { font-size:.68rem; text-transform:uppercase; letter-spacing:.1em; font-weight:700; }
.build-status-inner small { grid-column:2; color:#707477; margin-top:5px; font-size:.68rem; }
.status-dot { grid-row:1 / 3; width:7px; height:7px; margin-top:4px; border-radius:50%; background:#e5e4de; box-shadow:0 0 12px rgba(255,255,255,.32); }
.status-dot.status-live { background:var(--accent); box-shadow:0 0 12px rgba(191,108,76,.48); }
.status-dot.status-active { animation:statusPulse 2.2s ease-in-out infinite; }
.status-dot.status-muted { background:#484c4e; box-shadow:none; }
@keyframes statusPulse { 0%,100% { opacity:.55; transform:scale(.85); } 50% { opacity:1; transform:scale(1.15); } }
.faq-section { background:#efeee8; color:#111315; }
.faq-layout { display:grid; grid-template-columns:.78fr 1.22fr; gap:95px; align-items:start; }
.faq-heading { position:sticky; top:130px; }
.faq-heading h2 { margin:0; font-size:clamp(2.7rem,5vw,5rem); line-height:.98; letter-spacing:-.055em; font-weight:580; }
.faq-heading > p:last-child { color:#666968; line-height:1.7; max-width:470px; margin-top:25px; }
.faq-list { border-top:1px solid rgba(0,0,0,.22); }
.faq-list details { border-bottom:1px solid rgba(0,0,0,.16); }
.faq-list summary { list-style:none; cursor:pointer; padding:27px 48px 27px 0; position:relative; font-size:1.05rem; font-weight:680; line-height:1.35; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::before,.faq-list summary::after { content:""; position:absolute; right:8px; top:50%; width:16px; height:1px; background:#3c3f3f; transition:transform .22s; }
.faq-list summary::after { transform:rotate(90deg); }
.faq-list details[open] summary::after { transform:rotate(0deg); }
.faq-list details p { color:#5f6261; line-height:1.75; margin:0; padding:0 54px 27px 0; max-width:820px; }
.faq-list details p strong { color:#1d2020; }
.faq-list summary:focus-visible { outline:2px solid rgba(0,0,0,.7); outline-offset:5px; }
@media (max-width:900px) {
  .build-status-inner { grid-template-columns:1fr 1fr; }
  .build-status-inner > div:nth-child(2) { border-right:1px solid var(--line); }
  .build-status-inner > div:nth-child(n+3) { border-top:1px solid var(--line); }
  .faq-layout { grid-template-columns:1fr; gap:44px; }
  .faq-heading { position:relative; top:auto; }
}
@media (max-width:620px) {
  .build-status-inner { grid-template-columns:1fr; }
  .build-status-inner > div,.build-status-inner > div:first-child,.build-status-inner > div:nth-child(2) { border-left:1px solid var(--line); border-right:1px solid var(--line); border-top:1px solid var(--line); padding:16px 18px; }
  .build-status-inner > div:first-child { border-top:0; }
  .faq-list summary { padding:24px 42px 24px 0; font-size:1rem; }
  .faq-list details p { padding-right:8px; }
  .footer-links { flex-wrap:wrap; }
}


/* v0.7.1 — correctif SEO des données structurées */
.utility-card a:not(.button) { color:#efeee8; text-decoration-color:#666a6d; text-underline-offset:3px; }
.utility-card a:not(.button):hover { text-decoration-color:#efeee8; }
.utility-card address { color:#999b9d; line-height:1.75; font-style:normal; }
@media (max-width:620px) { .utility-card .utility-actions .button { width:100%; } }
