/* Maison Baluth pre-launch — all atmosphere is generated with type, light and SVG. */
:root { --black:#050505; --paper:#f5f2ec; --muted:rgba(255,255,255,.65); --faint:rgba(245,242,236,.16); --rose:#c9906f; --serif:"Cormorant Garamond",Georgia,serif; --sans:"Inter",Arial,sans-serif; }
* { box-sizing:border-box; }
html { background:var(--black); scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; background:var(--black); color:var(--paper); font-family:var(--sans); }
body::before { content:""; position:fixed; z-index:20; inset:0; pointer-events:none; background:radial-gradient(ellipse at center,transparent 38%,rgba(0,0,0,.48) 100%); }
a { color:inherit; text-decoration:none; } button,input { font:inherit; } em { color:var(--rose); font-weight:400; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.grain { position:fixed; z-index:19; inset:-40%; pointer-events:none; opacity:.055; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E"); animation:grain 1.1s steps(2) infinite; }
.pointer-light { position:fixed; z-index:1; left:var(--pointer-x,50%); top:var(--pointer-y,50%); width:42rem; height:42rem; pointer-events:none; background:radial-gradient(circle,rgba(201,144,111,.045),transparent 62%); transform:translate(-50%,-50%); transition:left 1.7s ease-out,top 1.7s ease-out; }

/* Opening */
.hero { position:relative; display:grid; min-height:100svh; overflow:hidden; place-items:center; isolation:isolate; text-align:center; }
.hero__light { position:absolute; z-index:-1; width:80vw; height:28vh; top:34%; left:-70%; background:linear-gradient(90deg,transparent,rgba(201,144,111,.07),transparent); filter:blur(24px); transform:rotate(-10deg); animation:cross-light 16s ease-in-out infinite; }
.hero__inner { display:flex; width:min(100%,56rem); align-items:center; flex-direction:column; padding:3rem 1.5rem; }.logo { display:block; mix-blend-mode:screen; object-fit:contain; }.logo--hero { width:clamp(7rem,13vw,11rem); animation:breathe 7s ease-in-out infinite; }.hero__kicker,.closing__eyebrow { margin:clamp(2.5rem,5vh,4.5rem) 0 0; color:var(--muted); font-size:9px; letter-spacing:.22em; text-transform:uppercase; }.hero h1 { margin:1.1rem 0 0; font-family:var(--serif); font-size:clamp(3.9rem,8vw,8.5rem); font-weight:400; letter-spacing:-.05em; line-height:.84; }.hero__note { margin:1.5rem 0 0; color:var(--muted); font-size:.76rem; }.quiet-button { display:inline-flex; gap:1rem; align-items:center; margin-top:2.4rem; padding:1rem 1.2rem; border:1px solid var(--faint); font-size:9px; letter-spacing:.16em; text-transform:uppercase; transition:background .45s,color .45s,border .45s; }.quiet-button span { color:var(--rose); font-size:1rem; }.quiet-button:hover { border-color:var(--paper); background:var(--paper); color:var(--black); }.scroll-mark { position:absolute; bottom:2rem; left:50%; display:flex; align-items:center; flex-direction:column; gap:.7rem; color:var(--muted); font-size:8px; letter-spacing:.16em; text-transform:uppercase; transform:translateX(-50%); }.scroll-mark i { width:1px; height:2.2rem; background:linear-gradient(var(--muted),transparent); }

/* Time passes before the first creation is revealed. */
.first-line { height:190vh; }.first-line__stage,.blueprint__stage,.idea__stage,.principles__stage { position:sticky; top:0; display:grid; width:100%; height:100svh; place-items:center; overflow:hidden; }.first-line__label { position:absolute; top:clamp(1.5rem,5vw,4.5rem); left:clamp(1.5rem,6vw,7rem); margin:0; color:var(--muted); font-size:8px; letter-spacing:.18em; text-transform:uppercase; }.dial-outline { position:absolute; width:clamp(19rem,31vw,31rem); opacity:.1; }.dial-outline path { fill:none; stroke:var(--paper); stroke-width:1.25; vector-effect:non-scaling-stroke; }.time-mark { position:relative; display:block; width:clamp(13rem,24vw,22rem); height:clamp(13rem,24vw,22rem); }.seconds-hand { position:absolute; bottom:50%; left:calc(50% - .5px); width:1px; height:48%; background:#a51d24; box-shadow:0 0 16px rgba(165,29,36,.48); transform-origin:50% 100%; animation:seconds-rotation 60s linear infinite; }.time-mark b { position:absolute; top:calc(50% - 3px); left:calc(50% - 3px); width:6px; height:6px; border-radius:50%; background:#a51d24; box-shadow:0 0 12px rgba(165,29,36,.55); }

/* Unfinished technical drawing */
.blueprint { height:300vh; }.blueprint__stage { background:#060606; }.blueprint__label { position:absolute; top:clamp(1.5rem,5vw,4.5rem); left:clamp(1.5rem,6vw,7rem); margin:0; color:var(--muted); font-size:8px; letter-spacing:.18em; text-transform:uppercase; }.drawing { width:min(86vw,75rem); overflow:visible; }.drawing path,.drawing circle { fill:none; stroke-linecap:round; }.drawing__guides path,.drawing__guides circle { stroke:rgba(245,242,236,.12); stroke-width:1; stroke-dasharray:5 10; }.drawing__primary path { stroke:rgba(245,242,236,.72); stroke-width:1.25; }.drawing__measurements path { stroke:rgba(201,144,111,.72); stroke-width:1; }.drawing__measurements text { fill:rgba(201,144,111,.72); font-family:var(--sans); font-size:10px; letter-spacing:2px; }.drawing__points circle { fill:var(--rose); stroke:none; }.blueprint__foot { position:absolute; right:clamp(1.5rem,6vw,7rem); bottom:clamp(1.8rem,5vw,4.5rem); margin:0; color:var(--muted); font-family:var(--serif); font-size:clamp(1.2rem,2vw,1.8rem); line-height:1.05; text-align:right; }

/* Language is the main object of the page. */
.idea { height:220vh; }.idea__stage { padding:2rem; text-align:center; }.idea__line { max-width:66rem; margin:0; font-family:var(--serif); font-size:clamp(3.4rem,8vw,8.6rem); letter-spacing:-.055em; line-height:.86; }.idea__line .word { display:inline-block; margin-right:.18em; opacity:.08; }.principles { height:410vh; }.principles__stage { padding:2rem; text-align:center; }.principle { position:absolute; width:100%; margin:0; font-family:var(--serif); font-size:clamp(4rem,10vw,10rem); letter-spacing:-.06em; line-height:.82; opacity:0; }.principles__count { position:absolute; right:clamp(1.5rem,6vw,7rem); bottom:clamp(1.8rem,5vw,4.5rem); color:var(--muted); font-size:8px; letter-spacing:.17em; }

/* The deliberately unrevealed moment. */
.anticipation { position:relative; display:grid; min-height:115svh; place-items:center; overflow:hidden; background:#030303; text-align:center; }.anticipation__spotlight { position:absolute; width:70vw; height:70vw; background:radial-gradient(circle,rgba(201,144,111,.1),rgba(201,144,111,.018) 28%,transparent 65%); filter:blur(12px); animation:spotlight 18s ease-in-out infinite; }.anticipation p { z-index:1; margin:0; font-family:var(--serif); font-size:clamp(3rem,7vw,7rem); letter-spacing:-.05em; line-height:.86; opacity:.88; }

/* Closing invitation */
.closing { display:grid; min-height:100svh; place-items:center; padding:5rem 1.5rem; text-align:center; }.closing__inner { display:flex; width:min(100%,43rem); align-items:center; flex-direction:column; }.logo--closing { width:clamp(8rem,16vw,12rem); }.closing__eyebrow { margin-top:2rem; }.closing h2 { margin:1.1rem 0 0; font-family:var(--serif); font-size:clamp(4rem,8vw,8rem); font-weight:400; letter-spacing:-.05em; line-height:.84; }.signup { display:flex; width:min(100%,29rem); margin-top:3rem; border-bottom:1px solid var(--faint); }.signup input { min-width:0; flex:1; padding:1rem 0; border:0; outline:0; background:transparent; color:var(--paper); font-size:.76rem; }.signup input::placeholder { color:var(--muted); }.signup input:focus { box-shadow:inset 0 -1px var(--rose); }.signup__honeypot { position:absolute; width:1px; height:1px; padding:0!important; border:0!important; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); }.signup button { border:0; background:transparent; color:var(--paper); cursor:pointer; font-size:9px; letter-spacing:.14em; text-transform:uppercase; transition:opacity .25s; }.signup button:disabled { cursor:wait; opacity:.45; }.signup button span { margin-left:.5rem; color:var(--rose); font-size:1rem; }.form-message { min-height:1.2rem; margin:1rem 0 0; color:var(--rose); font-size:.72rem; } footer { display:flex; justify-content:space-between; padding:1.6rem clamp(1.5rem,6vw,7rem); border-top:1px solid rgba(245,242,236,.07); color:var(--muted); font-size:8px; letter-spacing:.14em; text-transform:uppercase; }

/* JavaScript only hides motion targets after the document remains usable. */
.js .dial-outline,.js .drawing,.js .idea__line,.js .principle { visibility:hidden; }
@keyframes breathe { 50% { transform:scale(1.035); opacity:.88; } } @keyframes cross-light { 50% { transform:translateX(245vw) rotate(-10deg); } } @keyframes spotlight { 50% { transform:translate(22vw,-8vh) scale(1.18); } } @keyframes seconds-rotation { to { transform:rotate(360deg); } } @keyframes grain { 0% { transform:translate(0,0); } 25% { transform:translate(3%,-2%); } 50% { transform:translate(-2%,4%); } 75% { transform:translate(4%,2%); } }
@media (max-width:700px) { .hero h1 { font-size:clamp(3.8rem,15vw,5.8rem); }.first-line { height:160vh; }.blueprint { height:220vh; }.drawing { width:136vw; }.drawing__measurements text { font-size:13px; }.blueprint__foot { max-width:9rem; }.idea { height:170vh; }.idea__line { font-size:clamp(3.6rem,15vw,5.7rem); }.principles { height:330vh; }.principle { padding:0 1.3rem; font-size:clamp(3.9rem,16vw,5.9rem); }.anticipation { min-height:90svh; }.anticipation p { font-size:clamp(3.5rem,14vw,5.2rem); }.signup { margin-top:2.4rem; }.signup button { white-space:nowrap; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important; } }
