/* Poatz Resources – shared look (black / grain / blurred statues / glass) */
:root{
  --bg:#050505;--fg:#f2f0eb;--mut:rgba(242,240,235,.56);--dim:rgba(242,240,235,.28);
  --line:rgba(242,240,235,.1);--line2:rgba(242,240,235,.22);
  --sans:'Inter',system-ui,sans-serif;--mono:'JetBrains Mono',ui-monospace,monospace;
  --ease:cubic-bezier(.16,1,.3,1);--r:22px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);scroll-behavior:smooth}
body{background:var(--bg);color:var(--fg);font:300 14px/1.6 var(--sans);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}
::selection{background:var(--fg);color:var(--bg)}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit;color:inherit;background:none;border:0;outline:0}
button{cursor:pointer}

#bg{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.statue{position:absolute;opacity:0;transition:opacity 2.4s var(--ease);will-change:transform}
.loaded .statue{opacity:var(--o)}
.statue img{display:block;width:100%;height:100%;object-fit:cover;filter:blur(3px)}
.statue .drift{width:100%;height:100%;animation:breathe 30s ease-in-out infinite alternate}
@keyframes breathe{to{transform:scale(1.06) translateY(-1.5%)}}
#venus{--o:.45;left:-3vw;bottom:-8vh;height:112vh;aspect-ratio:760/1900;-webkit-mask:linear-gradient(90deg,#000 50%,transparent 98%);mask:linear-gradient(90deg,#000 50%,transparent 98%)}
#venus img{-webkit-mask:linear-gradient(0deg,transparent,#000 25%);mask:linear-gradient(0deg,transparent,#000 25%)}
#apollo{--o:.4;right:-5vw;top:-4vh;height:96vh;aspect-ratio:2/3;-webkit-mask:radial-gradient(ellipse 70% 65% at 60% 42%,#000 35%,transparent 72%);mask:radial-gradient(ellipse 70% 65% at 60% 42%,#000 35%,transparent 72%)}
#laocoon{--o:.09;left:50%;top:2vh;width:min(980px,90vw);aspect-ratio:1100/964;translate:-50% 0;-webkit-mask:radial-gradient(ellipse 55% 55% at 45% 38%,#000 25%,transparent 70%);mask:radial-gradient(ellipse 55% 55% at 45% 38%,#000 25%,transparent 70%)}
#laocoon img{filter:blur(5px)}
#vignette{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse 80% 70% at 50% 45%,transparent 30%,rgba(0,0,0,.8) 100%),linear-gradient(180deg,rgba(0,0,0,.3),transparent 20%,transparent 70%,rgba(0,0,0,.9))}
#grain{position:fixed;inset:-50%;z-index:2;pointer-events:none;opacity:.15;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1s steps(6) infinite}
@keyframes grain{0%,100%{transform:none}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-5%)}60%{transform:translate(-6%,-2%)}80%{transform:translate(5%,4%)}}

.wrap{position:relative;z-index:10;max-width:1320px;margin:0 auto;padding:0 clamp(16px,4vw,48px)}
header.top{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:24px 0;font:400 10.5px var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--mut);flex-wrap:wrap}
header.top a{padding:7px 14px;border:1px solid var(--line);border-radius:999px;transition:all .4s}
header.top a:hover,header.top a.on{color:var(--fg);border-color:var(--line2);background:rgba(255,255,255,.04)}

.glass{position:relative;border:1px solid rgba(255,255,255,.12);border-radius:var(--r);
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.018));
  backdrop-filter:blur(26px) saturate(1.3);-webkit-backdrop-filter:blur(26px) saturate(1.3);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 30px 80px -30px rgba(0,0,0,.9)}

.btn{position:relative;z-index:0;overflow:hidden;display:inline-flex;align-items:center;gap:10px;font:400 10.5px var(--mono);letter-spacing:.26em;text-transform:uppercase;padding:15px 26px;border:1px solid var(--line2);border-radius:999px;white-space:nowrap;transition:color .45s var(--ease),border-color .45s;background:rgba(255,255,255,.035)}
.btn::before{content:"";position:absolute;inset:0;background:var(--fg);transform:translateY(101%);transition:transform .5s var(--ease);z-index:-1}
.btn:hover{color:var(--bg);border-color:var(--fg)}.btn:hover::before{transform:none}
.btn.solid{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.btn.solid::before{background:var(--bg)}.btn.solid:hover{color:var(--fg)}
.btn.sm{padding:8px 14px;font-size:9.5px;letter-spacing:.2em}

.eyebrow{font:400 10.5px var(--mono);letter-spacing:.42em;text-transform:uppercase;color:var(--mut)}
.chip{padding:8px 14px;border-radius:999px;border:1px solid var(--line);font:400 11px var(--mono);letter-spacing:.06em;transition:all .3s;color:var(--mut)}
.chip:hover{border-color:var(--line2);color:var(--fg)}
.chip.on{background:var(--fg);color:var(--bg);border-color:var(--fg)}

.rv{opacity:0;transform:translateY(28px);filter:blur(6px);transition:opacity 1.2s var(--ease),transform 1.2s var(--ease),filter 1.2s var(--ease)}
.rv.in{opacity:1;transform:none;filter:none}

footer{position:relative;z-index:10;padding:60px 0 40px}
footer .hr{height:1px;background:linear-gradient(90deg,transparent,var(--line2),transparent);margin-bottom:22px}
footer .row{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font:400 10.5px var(--mono);letter-spacing:.28em;text-transform:uppercase;color:var(--dim)}

.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);opacity:0;z-index:60;padding:12px 20px;border-radius:999px;font:400 11px var(--mono);letter-spacing:.14em;transition:all .5s var(--ease);pointer-events:none}
.toast.on{opacity:1;transform:translate(-50%,0)}

@media (max-width:700px){#venus{--o:.28}#apollo{--o:.24}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none;filter:none}}
