/* ============ SPLASH SCREEN — "The Gate" ============ */
body.splash-active{ overflow:hidden !important; }

.splash{
 position:fixed; inset:0; z-index:10000;
}

/* Door panels */
.splash-door{
 position:absolute; top:0; bottom:0;
 width:50%;
 background:#181613;
 overflow:hidden;
}
/* Diamond lattice pattern */
.splash-door::before{
 content:""; position:absolute; inset:0;
 background:
  repeating-linear-gradient( 45deg, transparent 0 27px, rgba(160,136,88,.04) 27px 28px),
  repeating-linear-gradient(-45deg, transparent 0 27px, rgba(160,136,88,.04) 27px 28px);
}
/* Decorative inner frame line */
.splash-door::after{
 content:""; position:absolute;
 top:50%; transform:translateY(-50%);
 width:1px; height:60vh;
 background:linear-gradient(180deg, transparent, rgba(160,136,88,.18) 20%, rgba(160,136,88,.18) 80%, transparent);
}
.splash-door--left{
 left:0;
 border-right:1px solid rgba(160,136,88,.15);
}
.splash-door--left::after{ right:44px; }
.splash-door--right{
 right:0;
 border-left:1px solid rgba(160,136,88,.15);
}
.splash-door--right::after{ left:44px; }

/* Opening animation */
.splash.is-opening .splash-door--left{
 animation:sp-dl .9s cubic-bezier(.65,0,.12,1) forwards;
}
.splash.is-opening .splash-door--right{
 animation:sp-dr .9s cubic-bezier(.65,0,.12,1) forwards;
}
@keyframes sp-dl{ to{ transform:translateX(-101%); } }
@keyframes sp-dr{ to{ transform:translateX(101%); } }

/* Center content */
.splash-center{
 position:absolute; top:50%; left:50%;
 transform:translate(-50%,-50%);
 z-index:2;
 display:flex; flex-direction:column;
 align-items:center; gap:20px;
}
.splash-logo{
 height:46px; width:auto;
 opacity:0; animation:sp-in .7s ease .1s forwards;
}
.splash-tagline{
 font-family:"Figtree",system-ui,sans-serif;
 font-size:10px; letter-spacing:.34em;
 text-transform:uppercase;
 color:rgba(247,245,240,.4);
 opacity:0; animation:sp-in .5s ease .45s forwards;
}
@keyframes sp-in{ to{ opacity:1; } }

/* Geometric SVG pattern */
.splash-geo{
 width:300px; height:300px;
 position:absolute; top:50%; left:50%;
 transform:translate(-50%,-50%);
 z-index:1;
}
.splash-geo .gl{
 fill:none;
 stroke:rgba(160,136,88,.4);
 stroke-width:.7;
 stroke-dasharray:1;
 stroke-dashoffset:1;
 animation:sp-draw var(--d,1.5s) ease-out var(--t,.2s) forwards;
}
.splash-geo .gl.bright{
 stroke:rgba(198,168,116,.6);
 stroke-width:.9;
}
@keyframes sp-draw{ to{ stroke-dashoffset:0; } }

/* Radial glow */
.splash-glow{
 position:absolute; top:50%; left:50%;
 transform:translate(-50%,-50%);
 width:440px; height:440px;
 background:radial-gradient(circle, rgba(160,136,88,.1) 0%, transparent 65%);
 z-index:0;
 opacity:0; animation:sp-in 1.2s ease .3s forwards;
}

/* Grain */
.splash-grain{
 position:absolute; inset:0;
 pointer-events:none; opacity:.15;
 mix-blend-mode:overlay; z-index:3;
 background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='.6'/></svg>");
}

/* Fade center on open */
.splash.is-opening .splash-center,
.splash.is-opening .splash-geo,
.splash.is-opening .splash-glow{
 animation:sp-out .35s ease forwards;
}
@keyframes sp-out{
 to{ opacity:0; transform:translate(-50%,-50%) scale(.92); }
}

/* Skip / tap prompt */
.splash-skip{
 position:absolute; bottom:30px; left:50%;
 transform:translateX(-50%); z-index:4;
 font-family:"Figtree",system-ui,sans-serif;
 font-size:10px; letter-spacing:.24em;
 text-transform:uppercase;
 color:rgba(247,245,240,.28);
 background:none; border:0; padding:10px 16px;
 cursor:pointer;
 opacity:0; animation:sp-in .5s ease 1.4s forwards;
 transition:color .3s;
}
.splash-skip:hover{ color:rgba(198,168,116,.65); }

/* Mobile: same left/right gate as desktop, smaller centre geometry */
@media(max-width:760px){
 .splash-door--left::after{ right:24px; }
 .splash-door--right::after{ left:24px; }
 .splash-geo{ width:220px; height:220px; }
 .splash-glow{ width:320px; height:320px; }
}