:root {
  --bg:#0b1117; --panel:#151d25; --panel-soft:#1b2530; --text:#f5f7fb; --muted:#aeb8c5;
  --accent:#73f4b2; --accent2:#7694ff; --pink:#ff67ce; --border:#34414e; --paper:#e4ebed; --ink:#14222c;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
html,body { margin:0; min-height:100%; background:var(--bg); color:var(--text); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
body { background:radial-gradient(circle at 20% 0,#1b302e 0,transparent 38rem),var(--bg); }
button,a,input { font:inherit; }
a { color:inherit; }
.section-shell { width:min(1240px,calc(100% - 40px)); margin-inline:auto; }
.section-kicker,.eyebrow { margin:0 0 1.3rem; color:var(--accent); letter-spacing:.2em; font-size:.72rem; font-weight:900; }
.hidden { display:none!important; }
.primary-button,.secondary-button { display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:999px; padding:.9rem 1.4rem; text-decoration:none; font-weight:800; cursor:pointer; }
.primary-button { color:#06130d; background:linear-gradient(135deg,var(--accent),#d9ffe9); box-shadow:0 .7rem 2rem #73f4b226; }
.secondary-button { color:white; background:#252c38; }
.text-button { color:var(--text); font-weight:800; text-decoration:none; padding:.9rem .2rem; border-bottom:1px solid #ffffff44; }

/* Sticky public navigation */
.site-nav { position:fixed; z-index:50; inset:0 0 auto; height:78px; padding:0 max(22px,calc((100vw - 1240px)/2)); display:flex; align-items:center; justify-content:space-between; gap:2rem; background:rgba(7,8,11,.78); border-bottom:1px solid #ffffff12; backdrop-filter:blur(18px); }
.brand { display:grid; grid-template-columns:auto auto; align-items:baseline; text-decoration:none; line-height:.8; letter-spacing:-.07em; }
.brand-ai { color:#fff; font-size:1.55rem; font-weight:950; text-shadow:0 0 16px #369bff; }
.brand-foti { color:#fff; font-size:1.55rem; font-weight:800; font-style:italic; text-shadow:0 0 14px var(--pink); }
.brand small { grid-column:1/-1; margin-top:.45rem; color:#9ba4b4; font-size:.54rem; letter-spacing:.15em; text-transform:uppercase; font-style:normal; }
.nav-links { display:flex; align-items:center; gap:1.6rem; }
.nav-links a { color:#c5ccd6; text-decoration:none; font-size:.9rem; font-weight:700; }
.nav-links a:hover { color:#fff; }
.nav-links .nav-mail { color:#06130d; background:var(--accent); border-radius:999px; padding:.7rem 1rem; }

/* Hero */
.showcase-hero { min-height:clamp(460px,55vh,560px); padding:110px 0 52px; position:relative; overflow:hidden; display:grid; align-items:center; }
.showcase-hero:before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#91a8ff20 1px,transparent 1px),linear-gradient(#91a8ff20 1px,transparent 1px); background-size:70px 70px; mask-image:linear-gradient(#000,transparent 96%); }
.hero-glow { position:absolute; width:min(70vw,850px); aspect-ratio:1; right:-15%; top:-30%; border-radius:50%; background:radial-gradient(circle,#6e8cff3d,transparent 66%); filter:blur(10px); }
.hero-content { position:relative; }
.hero-content h1 { max-width:1000px; margin:0; font-size:clamp(3.7rem,8.2vw,7.2rem); line-height:.86; letter-spacing:-.068em; }
.hero-content h1 span { color:transparent; -webkit-text-stroke:1px #9beaca; text-shadow:0 0 50px #73f4b21c; }
.hero-lead { max-width:760px; margin:1.65rem 0; color:#c3cbd5; font-size:clamp(1rem,1.6vw,1.25rem); line-height:1.55; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:1.4rem; }

/* Shared section headings */
.section-heading { display:grid; grid-template-columns:1.25fr .75fr; gap:clamp(2rem,8vw,7rem); align-items:end; margin-bottom:2.2rem; }
.section-heading h2,.story-grid h2,.contact-panel h2 { margin:0; font-size:clamp(2.7rem,6vw,5.8rem); line-height:.96; letter-spacing:-.06em; }
.section-heading>p { color:var(--muted); font-size:1.1rem; line-height:1.65; margin:0; }

/* Six-stage demo */
.showcase-demo { padding:52px 0 110px; background:#111923; border-top:1px solid #ffffff12; }
.showcase-list { display:grid; gap:clamp(3rem,7vw,6rem); }
.message-card { padding:2rem; border:1px solid var(--border); background:var(--panel); border-radius:1.5rem; text-align:center; }
.reveal { --clip:0%; position:relative; }
.stage-stack { position:relative; aspect-ratio:3/2; border-radius:clamp(1rem,3vw,2.5rem); overflow:hidden; background:#111; box-shadow:0 2rem 5rem #0008; border:1px solid #ffffff22; touch-action:pan-y; }
.stage-layer { position:absolute; inset:0; }
.stage-layer img { width:100%; height:100%; object-fit:cover; display:block; }
.reveal-line { position:absolute; z-index:10; top:0; bottom:0; left:calc(var(--progress)*100%); width:3px; background:white; box-shadow:0 0 1.2rem white; pointer-events:none; }
.reveal-line:after { content:"↔"; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); display:grid; place-items:center; width:3.2rem; height:3.2rem; border-radius:50%; background:white; color:#111; font-weight:900; }
.sweep { position:absolute; z-index:9; inset:0 auto 0 -20%; width:18%; background:linear-gradient(90deg,transparent,#fff8,transparent); mix-blend-mode:screen; animation:sweep 2.2s ease-in-out infinite; pointer-events:none; }
@keyframes sweep { to { left:120%; } }
.reveal-range { position:absolute; z-index:12; inset:0; width:100%; height:calc(100% - 4rem); opacity:0; cursor:ew-resize; }
.stage-labels { height:4rem; display:grid; grid-template-columns:repeat(6,1fr); gap:.25rem; align-items:center; margin-top:.6rem; }
.stage-labels span { text-align:center; color:#727b89; font-size:clamp(.55rem,1.5vw,.9rem); font-weight:800; transition:.2s; }
.stage-labels span.active { color:var(--accent); transform:scale(1.05); }

/* Features */
.experience-section { padding:120px 0; color:var(--ink); background:linear-gradient(180deg,#e4ebed,#dbe4e7); }
.light-heading .section-kicker { color:#08785b; }
.light-heading>p { color:#40515f; }
.feature-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; border:1px solid #b9c7ca; background:#b9c7ca; }
.feature-card { padding:2rem; background:var(--paper); min-height:310px; }
.feature-card>span { display:inline-grid; place-items:center; width:2.4rem; height:2.4rem; border-radius:50%; background:var(--ink); color:var(--accent); font-size:.75rem; font-weight:900; }
.feature-card h3 { margin:4rem 0 1rem; font-size:1.45rem; }
.feature-card p { color:#40515f; line-height:1.55; }

/* Story */
.story-section { padding:130px 0; background:#142522; }
.story-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(3rem,10vw,9rem); }
.story-copy { color:#b9cbc9; font-size:1.13rem; line-height:1.7; }
.story-copy p:first-child { margin-top:0; }
.value-list { list-style:none; margin:2rem 0; padding:0; display:grid; gap:.8rem; }
.value-list li { border-left:2px solid var(--accent); padding-left:1rem; }
.value-list strong { color:white; }
.manifest-link { display:inline-block; margin-top:1rem; color:var(--accent); font-weight:900; text-underline-offset:.35rem; }

/* Space plan */
.space-section { padding:120px 0; background:#101820; }
.floorplan-wrap { display:grid; grid-template-columns:minmax(0,2fr) minmax(230px,.7fr); border:1px solid #50606d; border-radius:2rem; overflow:hidden; background:#111c25; }
.floorplan { width:100%; height:auto; min-height:520px; border-right:1px solid var(--border); }
.plan-dimension,.plan-label,.plan-small,.plan-note,.plan-tiny { fill:#94a3b8; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.12em; }
.plan-dimension { font-size:20px; fill:#fff; }.plan-label{font-size:16px}.plan-small{font-size:13px}.plan-tiny{font-size:10px}.plan-note{font-size:12px}.bright{fill:#fff}
.dimension-line { stroke:#b7c1ca; stroke-width:2; }.greenscreen{fill:#35dc90}.lamp circle{fill:#ffe39a;stroke:#fff;stroke-width:4}.lamp path{fill:#ffe39a45;stroke:#ffe39a;stroke-width:2}.light-direction,.camera-direction{fill:none;stroke:#73f4b2;stroke-width:3;stroke-dasharray:7 7}.people{fill:#75aaff}.photo-group{fill:#75aaff}.waiting-group{fill:#d681ff}.station-box{fill:#202e3c;stroke:#7694ff;stroke-width:3}.station-divider{stroke:#7694ff;stroke-width:2;stroke-dasharray:6 5}.camera rect{fill:#ff67ce;stroke:#ffd2f2;stroke-width:2}.camera circle{fill:#17202a;stroke:#fff;stroke-width:2}.camera path{fill:none;stroke:#ff67ce;stroke-width:4}
.space-notes { padding:2rem; display:grid; align-content:center; gap:1.8rem; }
.space-notes div { display:grid; gap:.25rem; padding-bottom:1.2rem; border-bottom:1px solid var(--border); }
.space-notes div:last-child { border:0; }
.space-notes b { color:var(--accent); font-size:1.8rem; }.space-notes span{color:var(--muted);line-height:1.4}

/* Contact */
.contact-section { padding:120px 0; color:var(--ink); background:linear-gradient(135deg,#dbf9e9,#dce5ff); }
.contact-panel { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(3rem,10vw,9rem); }
.contact-section .section-kicker { color:#08785b; }
.contact-copy { font-size:1.1rem; line-height:1.65; color:#354652; }
.contact-copy strong { color:#0b1820; }
.mail-cta { margin-top:1.5rem; display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:1.3rem 1.5rem; background:var(--ink); color:#fff; text-decoration:none; font-size:clamp(1.1rem,3vw,2rem); font-weight:900; border-radius:1rem; }
.mail-cta span { color:var(--accent); }
.site-footer { padding:2rem 0; border-top:1px solid #ffffff18; }
.site-footer .section-shell { display:flex; justify-content:space-between; gap:1rem; color:var(--muted); font-size:.85rem; }
.site-footer a { color:white; }

/* Viewer */
.viewer-header { text-align:center; padding:clamp(2rem,6vw,5rem) 1.2rem 2rem; }
.viewer-header h1 { font-size:clamp(2rem,7vw,5rem); line-height:1; margin:.2em 0; }
.viewer-header p { color:var(--muted); font-size:clamp(1rem,2vw,1.3rem); }
.gallery { width:min(1100px,100%); margin:auto; padding:1rem; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.photo-card { background:var(--panel); border:1px solid var(--border); border-radius:1.4rem; overflow:hidden; }
.photo-open { width:100%; height:100%; min-height:260px; padding:0; border:0; background:#050608; cursor:zoom-in; }
.photo-open img { display:block; width:100%; height:100%; aspect-ratio:3/2; object-fit:contain; }
.photo-modal { position:fixed; inset:0; z-index:60; background:rgba(0,0,0,.94); display:flex; align-items:center; justify-content:center; padding:1rem 1rem 6.5rem; }
.photo-modal img { max-width:100%; max-height:calc(100vh - 8rem); object-fit:contain; }
.modal-open { overflow:hidden; }
.close-button { position:fixed; right:max(1rem,env(safe-area-inset-right)); top:max(1rem,env(safe-area-inset-top)); z-index:2; width:3rem; height:3rem; border:1px solid #ffffff55; border-radius:50%; background:#111c; color:white; font-size:2rem; cursor:pointer; }
.download-button { position:fixed; left:50%; bottom:max(1.2rem,env(safe-area-inset-bottom)); transform:translateX(-50%); min-width:min(80vw,320px); font-size:1.15rem; }
.center-page { display:grid; place-items:center; padding:1rem; }

/* Admin */
.admin-page { padding-bottom:7rem; }
.admin-header { padding:2rem; display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.admin-header h1 { margin:0; }.admin-header p{color:var(--muted)}
.admin-grid { padding:1rem 2rem; display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:1rem; }
.admin-card { display:grid; background:var(--panel); border:2px solid var(--border); border-radius:1rem; overflow:hidden; }
.admin-card.selected { border-color:var(--accent); box-shadow:0 0 0 3px #73f4b233; }
.admin-select-label { position:relative; display:grid; cursor:pointer; }
.admin-select-label input { position:absolute; z-index:2; top:.8rem; right:.8rem; width:1.6rem; height:1.6rem; accent-color:#4ade80; }
.admin-select-label img { width:100%; aspect-ratio:3/2; object-fit:cover; }.admin-select-label>span{padding:.9rem;font-weight:800}
.job-open-button { margin:0 .8rem .8rem; padding:.75rem; color:#dce5ff; background:#252c38; border-radius:.7rem; text-align:center; text-decoration:none; font-size:.85rem; font-weight:800; }
.job-open-button:hover { background:#344054; }.job-open-button[aria-disabled=true]{opacity:.35;pointer-events:none}
.sticky-save { position:fixed; z-index:40; left:0; right:0; bottom:0; padding:1rem 2rem; display:flex; align-items:center; justify-content:center; gap:2rem; background:#080a0ded; border-top:1px solid var(--border); backdrop-filter:blur(12px); }

@media(max-width:900px) {
  .section-heading,.story-grid,.contact-panel,.floorplan-wrap { grid-template-columns:1fr; }
  .feature-grid { grid-template-columns:repeat(2,1fr); }
  .floorplan { border-right:0; border-bottom:1px solid var(--border); }
  .nav-links>a:not(.nav-mail) { display:none; }
}
@media(max-width:700px) {
  .section-shell { width:min(100% - 28px,1240px); }
  .site-nav { height:70px; padding-inline:14px; }.brand small{display:none}.nav-links{gap:.5rem}.nav-links .nav-mail{font-size:.78rem;padding:.6rem .75rem}
  .showcase-hero { min-height:510px; padding:104px 0 48px; }.hero-content h1{font-size:clamp(3.45rem,17vw,5.5rem)}
  .showcase-demo,.experience-section,.story-section,.space-section,.contact-section { padding:80px 0; }
  .section-heading { align-items:start; }.feature-grid{grid-template-columns:1fr}.feature-card{min-height:240px}.feature-card h3{margin-top:2.5rem}
  .gallery { grid-template-columns:1fr; }.admin-header{align-items:flex-start;flex-direction:column}.admin-grid{padding:1rem}.sticky-save{justify-content:space-between;padding:1rem}
  .stage-labels span { writing-mode:vertical-rl; height:3rem; }.stage-labels{height:5rem;align-items:start}.reveal-range{height:calc(100% - 5rem)}
  .floorplan { min-height:0; }.space-notes{grid-template-columns:1fr 1fr;padding:1.2rem;gap:1rem}.space-notes b{font-size:1.4rem}
  .site-footer .section-shell { flex-direction:column; }.contact-panel h2,.section-heading h2,.story-grid h2{font-size:clamp(2.7rem,14vw,4.5rem)}
}