/* Celsitudo Studio: home page only. Shared rules live in site.css. */
/* ---------- curtain (intro) ---------- */
.curtain{position:fixed;inset:0;z-index:100;pointer-events:none}
.curtain i{position:absolute;left:0;right:0;height:50.5%;background:var(--night)}
.curtain i:first-child{top:0}.curtain i:last-child{bottom:0}
.curtain b{position:absolute;left:6%;right:6%;top:50%;height:22px;margin-top:-11px;background:var(--meander-gold) repeat-x center/22px 22px;transform-origin:center;transform:scaleX(0);z-index:2}
.curtain .mono{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-150px 0 0 -32px;z-index:2}
.curtain .mono path,.curtain .mono rect{fill:none;stroke:var(--gold);stroke-width:1.2}
.curtain .word{position:absolute;left:0;right:0;top:50%;margin-top:-64px;z-index:2;text-align:center;font:400 clamp(20px,3vw,30px)/1 var(--display);letter-spacing:.42em;color:var(--bone);padding-left:.42em;white-space:nowrap}
.curtain .word span{display:inline-block}

/* ---------- hero: the temple ---------- */
.hero{position:relative;height:320vh}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:radial-gradient(120% 80% at 50% 110%,#3a2414 0%,transparent 55%),linear-gradient(180deg,#08101b 0%,#0e1520 38%,#1b1510 78%,var(--night) 100%)}
#sky{position:absolute;inset:0;width:100%;height:100%;display:block}
.moon{position:absolute;right:5%;top:44%;width:clamp(56px,7vw,96px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 38% 36%,#fffaf0,#e9dcc4 55%,#bfae90);box-shadow:0 0 60px 10px rgba(255,236,200,.18),0 0 180px 60px rgba(255,236,200,.07)}
.hero-copy{position:absolute;inset:calc(96px + env(safe-area-inset-top,0px)) 0 auto;z-index:3;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(20px,4vw,64px);align-items:end}
.hero-copy .label{display:flex;gap:12px;align-items:center;margin-bottom:18px}
.hero-copy .label::before{content:"";width:34px;height:1px;background:var(--gold)}
.hero-h{font-size:clamp(44px,6.3vw,100px);line-height:.98;letter-spacing:-.01em;color:var(--bone)}
.hero-h .ln{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.hero-h .ln > span{display:inline-block}
.hero-h .it{font-size:1.08em}
.hero-side .lede{color:var(--bone-dim)}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.temple{position:absolute;left:50%;bottom:-1.5%;width:min(1120px,92vw,calc((100vh - 330px) * 1.613));width:min(1120px,92vw,calc((100svh - 330px) * 1.613));aspect-ratio:1000/620;transform:translateX(-50%);transform-origin:50% 66%;z-index:2}
.temple svg{width:100%;height:100%;display:block;overflow:visible}
.marble-veil{position:absolute;inset:0;z-index:4;background:var(--marble);opacity:0;pointer-events:none}
.marble-veil::before{content:"";position:absolute;inset:0;background:var(--marble-tex);background-size:1400px;opacity:.28}
.scroll-cue{position:absolute;left:50%;bottom:calc(22px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:5;font:400 11px/1 var(--caps);letter-spacing:.3em;color:var(--bone-dim);display:flex;flex-direction:column;align-items:center;gap:10px}
.scroll-cue i{width:1px;height:38px;background:linear-gradient(var(--gold),transparent);animation:drip 2.2s var(--ease) infinite;transform-origin:top}
@keyframes drip{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
@media (max-width:860px){
  .hero-copy{grid-template-columns:1fr;gap:18px}
  .temple{width:118vw;bottom:-1%}
  .scroll-cue{display:none}
  .moon{top:auto;bottom:36%;right:6%}
  .hero-side .lede{font-size:15.5px}
}

/* ---------- inscription (manifesto) ---------- */
.inscription{position:relative;height:230vh}
.inscription-pin{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center}
.inscription .label{margin-bottom:30px;color:var(--clay)}
.carved{font:400 clamp(30px,4.5vw,64px)/1.14 var(--display);max-width:22ch;letter-spacing:-.005em}
.carved .w{display:inline-block}
.js .carved .w{opacity:.12;filter:blur(3px)}
.carved .w.k{font-family:var(--italic);font-style:italic;font-weight:500;color:var(--clay)}
.gloss{display:flex;gap:16px;align-items:baseline;margin-top:40px;color:var(--ink-dim);font-size:15px;flex-wrap:wrap}
.gloss b{font:400 30px/1 var(--greek);color:var(--ink)}

/* ---------- muses: the amphora ---------- */
.muses{position:relative;height:560vh;background:var(--night)}
.muses-pin{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.muses-pin::before{content:"";position:absolute;left:50%;top:55%;width:min(900px,120vw);aspect-ratio:1;transform:translate(-75%,-50%);background:radial-gradient(circle,rgba(196,98,45,.22),transparent 62%);pointer-events:none}
.muses-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:center}
.vase-box{display:grid;place-items:center}
#vase{width:min(40vw,500px,62vh);aspect-ratio:1/1.32;display:block}
.muse-head{margin-bottom:26px}
.muse-caps{display:grid}
.muse{grid-area:1/1;opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease);pointer-events:none}
.muse.on{opacity:1;transform:none;pointer-events:auto}
.muse .who{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:6px}
.muse .who .gnum{color:var(--gold);font-size:22px}
.muse .who b{font:400 clamp(22px,2vw,28px)/1 var(--greek);color:var(--clay-hi)}
.muse .who span{font:400 13px/1 var(--caps);letter-spacing:.22em;text-transform:uppercase;color:var(--bone-dim)}
.muse h3{font-size:clamp(36px,4.6vw,68px);line-height:1;margin:16px 0 18px}
.muse p{color:var(--bone-dim);font-size:clamp(16.5px,1.3vw,19px);max-width:44ch}
.muse .app{display:inline-flex;gap:10px;align-items:center;margin-top:22px;padding:9px 14px;border:1px solid var(--line-d);font:400 12.5px/1 var(--caps);letter-spacing:.18em;text-transform:uppercase;color:var(--bone)}
.muse .app i{width:6px;height:6px;background:var(--gold);transform:rotate(45deg)}
.muse-pips{display:flex;gap:10px;margin-top:34px}
.muse-pips i{width:10px;height:10px;border:1px solid var(--gold);transform:rotate(45deg);transition:background .4s}
.muse-pips i.on{background:var(--gold)}
@media (max-width:860px){
  .muses-grid{grid-template-columns:1fr;gap:18px}
  #vase{width:min(56vw,300px,38vh)}
  .muse h3{font-size:clamp(30px,8vw,40px);margin:10px 0 10px}
  .muse p{font-size:15.5px}
  .muse-head{margin-bottom:12px}
  .muse-pips{margin-top:18px}
}

/* ---------- pantheon (apps) ---------- */
.pantheon{padding-block:clamp(90px,12vw,170px)}
.pan-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:end;margin-bottom:clamp(48px,6vw,90px)}
.pan-head .label{margin-bottom:18px;color:var(--clay)}
.niches{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(16px,2vw,28px)}
.niche{position:relative;display:flex;flex-direction:column;border-radius:999px 999px 6px 6px;background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.2));border:1px solid var(--line-m);padding:clamp(28px,3vw,40px) clamp(22px,2.4vw,32px) 28px;box-shadow:inset 0 30px 60px -30px rgba(28,22,18,.25);transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
.niche:hover{transform:translateY(-8px);box-shadow:inset 0 30px 60px -30px rgba(28,22,18,.25),0 30px 60px -30px rgba(28,22,18,.45)}
.niche .arch{position:relative;aspect-ratio:1;border-radius:999px 999px 4px 4px;background:radial-gradient(80% 70% at 50% 100%,color-mix(in srgb,var(--hue) 40%,transparent),transparent 70%),linear-gradient(180deg,#d8cfbf,#f2ece2);display:grid;place-items:center;overflow:hidden;border:1px solid var(--line-m)}
.niche .arch::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.55) 48%,transparent 60%);transform:translateX(-120%);transition:transform 1.1s var(--ease)}
.niche:hover .arch::after{transform:translateX(120%)}
.medal{position:relative;width:52%;aspect-ratio:1;border-radius:24%;padding:5px;background:var(--gold-grad);box-shadow:0 22px 40px -14px rgba(28,22,18,.55);transition:transform .7s var(--ease)}
.niche:hover .medal{transform:translateY(-8px)}
.medal img,.medal svg{width:100%;height:100%;border-radius:21%;display:block}
.plinth{width:64%;height:12px;margin:-1px auto 0;background:linear-gradient(#cfc5b4,#b5aa97);border-radius:0 0 3px 3px}
.niche .num{position:absolute;top:18px;left:50%;transform:translateX(-50%);font:400 18px/1 var(--greek);color:var(--ink-dim);z-index:2}
.niche .row{display:flex;justify-content:space-between;gap:12px;margin-top:22px;font:400 12px/1.3 var(--caps);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-dim)}
.niche .row b{font-weight:400;color:var(--clay)}
.niche h3{font-size:clamp(26px,2.3vw,32px);line-height:1.05;margin-top:12px}
.niche p{color:var(--ink-dim);font-size:15.5px;margin-top:10px;flex:1}
.niche .foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line-m)}
.status{display:inline-flex;align-items:center;gap:8px;font:400 12px/1 var(--caps);letter-spacing:.16em;text-transform:uppercase}
.status i{width:7px;height:7px;transform:rotate(45deg);background:var(--ink-dim)}
.status.live i{background:#3f7d4e}
.status.soon i{background:var(--gold)}
.status.dev i{background:var(--clay);animation:blink 1.6s infinite}
.status.idea i{background:transparent;border:1px solid var(--ink)}
@keyframes blink{50%{opacity:.3}}
.niche .go{font:400 12.5px/1 var(--caps);letter-spacing:.18em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--clay);padding-bottom:3px}
.niche .go[aria-disabled="true"]{color:var(--ink-dim);border-color:transparent}
.niche.idea{background:transparent;border-style:dashed;border-color:rgba(28,22,18,.3)}
@media (max-width:860px){.pan-head{grid-template-columns:1fr}}

/* ---------- virtues ---------- */
.virtues{padding-block:clamp(90px,12vw,170px);background:var(--night)}
.virtues .label{margin-bottom:18px}
.v-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line-d);border:1px solid var(--line-d);margin-top:clamp(40px,6vw,80px)}
.virtue{position:relative;background:var(--night);padding:clamp(28px,3.4vw,52px);min-width:0;overflow:hidden}
.virtue .band{position:absolute;left:0;right:0;top:0;height:14px;background:var(--meander-gold) repeat-x left center/14px 14px;opacity:.7;clip-path:inset(0 100% 0 0)}
.virtue .gw{font:400 clamp(48px,6vw,92px)/1 var(--greek);margin-top:14px;display:block}
.virtue .tr{display:flex;gap:14px;align-items:baseline;margin-top:16px;flex-wrap:wrap}
.virtue .tr span{font:400 13px/1 var(--caps);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.virtue .tr em{font-family:var(--italic);font-size:20px;color:var(--bone-dim)}
.virtue p{margin-top:16px;color:var(--bone-dim);max-width:46ch}
.virtue:hover .gw{filter:drop-shadow(0 0 18px rgba(212,165,76,.35))}
@media (max-width:760px){.v-grid{grid-template-columns:1fr}}

/* ---------- odyssey (process) ---------- */
.odyssey{position:relative;padding-block:clamp(90px,12vw,170px);background:linear-gradient(180deg,var(--night),#0b1622 30%,#0b1622 70%,var(--night));overflow:hidden}
.odyssey .head{max-width:760px;margin-bottom:clamp(50px,7vw,100px)}
.odyssey .label{margin-bottom:18px}
.voyage{position:relative}
#route{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
#route .sea{fill:none;stroke:rgba(239,231,218,.12);stroke-width:2;stroke-dasharray:2 10;stroke-linecap:round}
#route .wake{fill:none;stroke:var(--gold);stroke-width:2.2;stroke-linecap:round}
#ship{transform-box:fill-box}
.stop{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 140px minmax(0,1fr);align-items:center;min-height:min(46vh,380px)}
.stop .node{grid-column:2;justify-self:center;width:18px;height:18px;border:1px solid var(--gold);background:var(--night);transform:rotate(45deg);position:relative;z-index:2;transition:background .4s}
.stop.lit .node{background:var(--gold);box-shadow:0 0 20px rgba(212,165,76,.6)}
.stop:nth-child(odd) .node{translate:-46px 0}
.stop:nth-child(even) .node{translate:46px 0}
.stop .txt{grid-row:1;max-width:420px}
.stop:nth-child(odd) .txt{grid-column:1;justify-self:end;text-align:right}
.stop:nth-child(even) .txt{grid-column:3}
.stop .gnum{display:block;font-size:44px;line-height:1;color:var(--gold);opacity:.9}
.stop h3{font-size:clamp(28px,3vw,42px);margin:10px 0 10px}
.stop p{color:var(--bone-dim)}
@media (max-width:760px){
  .stop{grid-template-columns:56px minmax(0,1fr);min-height:0;padding-block:34px}
  .stop .node,.stop:nth-child(odd) .node,.stop:nth-child(even) .node{grid-column:1;translate:0 0;justify-self:center;align-self:start;margin-top:14px}
  .stop .txt,.stop:nth-child(odd) .txt,.stop:nth-child(even) .txt{grid-column:2;justify-self:start;text-align:left}
}

/* ---------- oracle (contact) ---------- */
.oracle{position:relative;padding-block:clamp(90px,12vw,170px);overflow:hidden;background:radial-gradient(70% 60% at 78% 70%,rgba(196,98,45,.2),transparent 70%),var(--night)}
.oracle .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(36px,6vw,90px);align-items:center}
.oracle .label{margin-bottom:18px}
.oracle .lede{margin-top:22px}
.tripod{position:relative;height:320px;display:grid;place-items:end center}
.tripod svg{width:220px;height:auto}
.smoke{position:absolute;left:50%;bottom:170px;width:120px;height:120px;margin-left:-60px;border-radius:50%;background:radial-gradient(circle,rgba(239,231,218,.18),transparent 65%);filter:blur(12px);animation:smoke 6s linear infinite;opacity:0}
.smoke:nth-child(2){animation-delay:-2s}.smoke:nth-child(3){animation-delay:-4s}
@keyframes smoke{0%{transform:translate(0,40px) scale(.5);opacity:0}20%{opacity:.9}100%{transform:translate(30px,-200px) scale(1.8);opacity:0}}
.flame{position:absolute;left:50%;bottom:150px;width:46px;height:60px;margin-left:-23px;border-radius:50% 50% 45% 45%/60% 60% 40% 40%;background:radial-gradient(circle at 50% 75%,#fff2c4,var(--gold) 35%,var(--clay) 70%,transparent 72%);filter:blur(1px);animation:flick .18s infinite alternate;transform-origin:50% 100%}
@keyframes flick{to{transform:scale(1.06,.92) skewX(3deg)}}
@media (max-width:860px){.oracle .wrap{grid-template-columns:1fr}.tripod{height:240px;order:-1}}


/* ---------- added: richer opening ---------- */
.parallax{position:absolute;inset:0;will-change:transform}
.rays{position:absolute;left:50%;bottom:6%;width:min(1400px,160vw);aspect-ratio:1.4;transform:translateX(-50%);z-index:1;pointer-events:none;opacity:0;
  background:conic-gradient(from 180deg at 50% 100%,transparent 0deg,rgba(241,208,136,.16) 8deg,transparent 14deg,transparent 22deg,rgba(241,208,136,.1) 27deg,transparent 33deg,transparent 150deg,rgba(241,208,136,.12) 156deg,transparent 162deg,transparent 170deg,rgba(241,208,136,.18) 175deg,transparent 181deg,transparent 190deg,rgba(241,208,136,.1) 196deg,transparent 203deg,transparent 330deg,rgba(241,208,136,.14) 336deg,transparent 342deg);
  -webkit-mask:radial-gradient(70% 90% at 50% 100%,#000 30%,transparent 75%);mask:radial-gradient(70% 90% at 50% 100%,#000 30%,transparent 75%);animation:rays 18s linear infinite alternate}
@keyframes rays{to{filter:hue-rotate(-8deg);transform:translateX(-50%) rotate(3deg)}}
.shooting{position:absolute;top:12%;left:18%;width:160px;height:2px;background:linear-gradient(90deg,rgba(255,248,230,0),rgba(255,248,230,.9));transform:rotate(18deg);opacity:0;z-index:1;pointer-events:none}
.muses{background:var(--marble)}
.muses-pin{background:var(--night)}
.js .muses-pin{clip-path:circle(0% at 30% 55%)}
.niche{cursor:pointer}
.niche h3 a::after{content:"";position:absolute;inset:0;border-radius:inherit}
.niche .go{position:relative;z-index:1}
a.app:hover{border-color:var(--gold);color:var(--gold-hi)}
.oracle .consent{max-width:520px}
@media (prefers-reduced-motion:reduce){.js .muses-pin{clip-path:none}}