/* SATUBranding — Shared Stylesheet */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;700;900&family=Cormorant+Garamond:ital,wght@1,300&family=DM+Sans:wght@300;400&display=swap');

/* ── Reset ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{background:#070707;color:#F4F2EE;font-family:'DM Sans',system-ui,sans-serif;font-weight:300;line-height:1.7;cursor:none;overflow-x:hidden}
img{display:block;width:100%;object-fit:cover}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:none;background:none;border:none;padding:0;color:inherit}

/* ── Tokens ── */
:root{
  --neon:#00FF88;--neon-dim:rgba(0,255,136,.12);
  --black:#070707;--ink:#0F0F0F;--ink2:#171717;
  --white:#F4F2EE;--cream:#ECEAE4;--linen:#DDDAD3;
  --stone:#858178;--stone2:#4A4640;
  --dp:'Space Grotesk',system-ui,sans-serif;
  --sr:'Cormorant Garamond',Georgia,serif;
  --bd:'DM Sans',system-ui,sans-serif;
  --ez:cubic-bezier(0.16,1,0.3,1);
}

/* ── Cursor ── */
#cd{position:fixed;top:0;left:0;width:7px;height:7px;background:var(--neon);border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%)}
#cr{position:fixed;top:0;left:0;width:34px;height:34px;border:1px solid var(--neon);border-radius:50%;pointer-events:none;z-index:9998;opacity:.4;transform:translate(-50%,-50%);transition:width .25s var(--ez),height .25s var(--ez),opacity .25s}

/* ── Reveal ── */
.rev{opacity:0;transform:translateY(40px);transition:opacity .9s var(--ez),transform .9s var(--ez)}.rev.in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}.d4{transition-delay:.4s}.d5{transition-delay:.55s}

/* ── Utility ── */
.ey{font-family:var(--bd);font-size:.62rem;font-weight:400;letter-spacing:.22em;text-transform:uppercase;color:var(--stone)}
.gl{display:inline-block;width:20px;height:1px;background:var(--neon);vertical-align:middle;margin-right:10px}
.container{max-width:1240px;margin:0 auto;padding:0 clamp(1.5rem,4vw,4.5rem)}
section{padding:clamp(5rem,10vw,9rem) 0}
.light{background:var(--cream)}
.light h1,.light h2,.light h3,.light h4{color:#18140F}
.light p{color:#4A4038}
.light .ey{color:var(--stone2)}

/* ── Buttons ── */
.btn-n{font-family:var(--bd);font-size:.7rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;padding:.9rem 2.6rem;border:1px solid var(--neon);color:var(--neon);cursor:none;transition:background .25s,color .25s;display:inline-block}
.btn-n:hover{background:var(--neon);color:var(--black)}
.btn-w{font-family:var(--bd);font-size:.7rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;padding:.9rem 2.6rem;border:1px solid rgba(244,242,238,.2);color:var(--white);cursor:none;transition:background .25s,border-color .25s;display:inline-block}
.btn-w:hover{background:var(--neon);border-color:var(--neon);color:var(--black)}
.btn-dk{font-family:var(--bd);font-size:.7rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;padding:.9rem 2.6rem;background:#18140F;border:1px solid #18140F;color:var(--cream);cursor:none;transition:background .25s,border-color .25s;display:inline-block}
.btn-dk:hover{background:var(--neon);border-color:var(--neon);color:var(--black)}
.mag{display:inline-block;transition:transform .45s var(--ez)}

/* ── Nav ── */
#nav{position:fixed;top:0;left:0;right:0;z-index:600;display:flex;align-items:center;justify-content:space-between;padding:1.8rem clamp(1.5rem,4vw,4.5rem);transition:padding .4s,background .4s}
#nav.sc{background:rgba(7,7,7,.96);backdrop-filter:blur(20px);padding-top:1.1rem;padding-bottom:1.1rem;border-bottom:1px solid rgba(255,255,255,.05)}
.n-logo{font-family:var(--dp);font-size:.95rem;font-weight:900;letter-spacing:.05em;color:var(--white)}
.n-logo em{color:var(--neon);font-style:normal}
.n-r{display:flex;align-items:center;gap:1.5rem}
.lang-sw{display:flex;gap:.15rem}
.lang-btn{font-family:var(--bd);font-size:.58rem;font-weight:400;letter-spacing:.1em;text-transform:uppercase;color:rgba(244,242,238,.3);padding:.28rem .5rem;cursor:none;transition:color .2s;border:1px solid transparent}
.lang-btn.active{color:var(--neon);border-color:rgba(0,255,136,.3)}
.lang-btn:hover{color:var(--white)}
.n-cta{font-family:var(--bd);font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;color:var(--stone);transition:color .2s}
.n-cta:hover{color:var(--white)}
.ham{width:26px;display:flex;flex-direction:column;gap:6px;cursor:none}
.ham span{display:block;height:1px;background:var(--white);transition:transform .45s var(--ez),opacity .3s;transform-origin:center}
.mo .ham span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.mo .ham span:nth-child(2){opacity:0}
.mo .ham span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ── Overlay ── */
#ov{position:fixed;inset:0;z-index:500;background:var(--black);display:flex;align-items:center;clip-path:inset(0 0 100% 0);transition:clip-path .7s var(--ez);pointer-events:none;overflow:hidden}
#ov.open{clip-path:inset(0 0 0% 0);pointer-events:all}
.ov-links{padding:0 clamp(2rem,6vw,6rem);flex:1}
.ov-link{display:block;font-family:var(--dp);font-weight:900;font-size:clamp(2.5rem,7vw,6.5rem);line-height:1.1;letter-spacing:-.025em;color:rgba(244,242,238,.1);cursor:none;transition:color .3s var(--ez),transform .35s var(--ez);padding:.1rem 0}
.ov-link:hover{color:var(--white);transform:translateX(14px)}
.ov-link.active-page{color:rgba(0,255,136,.4)}
.ov-foot{position:absolute;bottom:2.5rem;left:0;right:0;display:flex;justify-content:space-between;padding:0 clamp(1.5rem,4vw,4.5rem)}
.ov-foot-l{font-family:var(--bd);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--stone);line-height:2}
.ov-foot-r a{display:block;font-family:var(--bd);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);margin-bottom:.3rem;transition:color .2s}
.ov-foot-r a:hover{color:var(--neon)}

/* ── Page Hero (inner pages) ── */
.page-hero{padding:clamp(8rem,15vh,11rem) 0 clamp(4rem,7vh,6rem);background:var(--black);position:relative;overflow:hidden}
.ph-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);background-size:80px 80px;pointer-events:none}
.ph-orb{position:absolute;top:-20%;right:-10%;width:50vw;height:50vw;background:radial-gradient(ellipse,rgba(0,255,136,.1) 0%,transparent 65%);filter:blur(60px);animation:orbMove 16s ease-in-out infinite alternate;pointer-events:none}
@keyframes orbMove{0%{transform:translate(0,0) scale(1)}50%{transform:translate(-5%,8%) scale(1.1)}100%{transform:translate(5%,-5%) scale(.95)}}
.ph-kicker{margin-bottom:1.5rem}
.ph-title{font-family:var(--dp);font-weight:900;font-size:clamp(2.8rem,8vw,7.5rem);line-height:.92;letter-spacing:-.03em;color:var(--white)}
.ph-title em{color:var(--neon);font-style:normal}
.ph-sub{font-family:var(--sr);font-style:italic;font-size:clamp(1rem,1.8vw,1.35rem);color:rgba(244,242,238,.45);max-width:520px;margin-top:1.5rem;line-height:1.55}

/* ── Section divider ── */
.divider{height:1px;background:linear-gradient(to right,transparent,rgba(0,255,136,.25),transparent);margin:0}

/* ── Ticker ── */
.tick-wrap{overflow:hidden;padding:.8rem 0}
.tt{display:flex;white-space:nowrap;animation:tk 32s linear infinite}
.tt:hover{animation-play-state:paused}
@keyframes tk{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ti{font-family:var(--sr);font-size:.9rem;font-style:italic;color:rgba(244,242,238,.2);padding:0 2rem;display:inline-flex;align-items:center;gap:1rem;flex-shrink:0}
.ts{width:4px;height:4px;background:var(--neon);border-radius:50%;opacity:.5;flex-shrink:0}

/* ── Footer ── */
footer{background:var(--black);border-top:1px solid rgba(255,255,255,.05);padding:4.5rem clamp(1.5rem,4vw,4.5rem) 2.5rem}
.ft-in{max-width:1240px;margin:0 auto}
.ft-g{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;padding-bottom:3rem;border-bottom:1px solid rgba(255,255,255,.06);margin-bottom:2rem}
.ft-logo{font-family:var(--dp);font-size:1.2rem;font-weight:900;color:var(--white);margin-bottom:.8rem}
.ft-logo em{color:var(--neon);font-style:normal}
.ft-desc{font-size:.75rem;color:rgba(244,242,238,.28);line-height:1.8;max-width:200px}
.ft-col h5{font-family:var(--bd);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--stone);margin-bottom:1.2rem}
.ft-col a{display:block;font-size:.78rem;color:rgba(244,242,238,.35);margin-bottom:.55rem;transition:color .2s}
.ft-col a:hover{color:var(--neon)}
.ft-bot{display:flex;justify-content:space-between;align-items:center}
.ft-copy{font-size:.68rem;color:rgba(244,242,238,.2)}
.ft-tag{font-family:var(--sr);font-size:.85rem;font-style:italic;color:rgba(0,255,136,.3)}

/* ── Responsive ── */
@media(max-width:1024px){
  .ft-g{grid-template-columns:1fr 1fr;gap:2.5rem}
}
@media(max-width:640px){
  .ft-g{grid-template-columns:1fr}
  .ft-bot{flex-direction:column;gap:.5rem;text-align:center}
  .n-cta,.lang-sw{display:none}
}