@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300;400;600;800&family=Inter:wght@300;400;500;600&display=swap');

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

:root{
  --ice:#7dd3fc;--frost:#bae6fd;--glacier:#0c4a6e;--deep:#0a1628;
  --glass:rgba(12,74,110,0.25);--glass-border:rgba(125,211,252,0.2);
  --text:#e0f2fe;--muted:#7dd3fc99;
}

html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;background:linear-gradient(170deg,#0a1628 0%,#0c2d4e 40%,#0e3e5c 100%);color:var(--text);line-height:1.75;overflow-x:hidden;min-height:100vh}
h1,h2,h3{font-family:'Raleway',sans-serif;font-weight:800}
a{color:var(--ice);text-decoration:none;transition:.3s}
a:hover{color:var(--frost)}

/* NAV */
.frost-nav{
  position:fixed;top:0;width:100%;z-index:999;
  background:rgba(10,22,40,0.85);backdrop-filter:blur(16px);
  border-bottom:1px solid var(--glass-border);
  height:66px;display:flex;align-items:center;justify-content:space-between;padding:0 2.5rem;
}
.frost-brand{font-family:'Raleway',sans-serif;font-weight:800;font-size:1.4rem;color:var(--ice);display:flex;align-items:center;gap:8px}
.frost-brand svg{width:26px;height:26px}
.frost-links{list-style:none;display:flex;gap:1.8rem}
.frost-links a{font-size:.82rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);font-weight:500}
.frost-links a:hover,.frost-links a.active{color:var(--ice)}
.frost-ham{display:none;background:none;border:none;cursor:pointer}
.frost-ham span{display:block;width:24px;height:2px;background:var(--ice);margin:5px 0;transition:.3s}

/* HERO */
.cryo-hero{
  min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;
  padding:100px 2rem 60px;position:relative;
}
.cryo-hero::before{content:'';position:absolute;top:20%;left:50%;transform:translateX(-50%);width:600px;height:600px;background:radial-gradient(circle,rgba(125,211,252,0.06),transparent 70%);pointer-events:none}
.cryo-hero h1{font-size:clamp(2rem,5vw,3.5rem);margin-bottom:1rem;position:relative}
.cryo-hero h1 span{color:var(--frost)}
.cryo-hero p{color:var(--muted);font-size:1.1rem;max-width:640px;margin:0 auto 2rem;position:relative}

.ice-tags{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center;margin-bottom:2.5rem}
.ice-tag{
  background:var(--glass);border:1px solid var(--glass-border);backdrop-filter:blur(8px);
  padding:.5rem 1.2rem;border-radius:8px;font-size:.82rem;color:var(--ice)}

.ice-btn{
  display:inline-block;padding:.9rem 2.5rem;background:linear-gradient(135deg,rgba(125,211,252,0.2),rgba(186,230,253,0.1));
  border:1px solid var(--glass-border);backdrop-filter:blur(8px);color:var(--frost);
  font-family:'Raleway',sans-serif;font-weight:700;font-size:.85rem;text-transform:uppercase;
  letter-spacing:2px;border-radius:12px;cursor:pointer;transition:.3s}
.ice-btn:hover{background:linear-gradient(135deg,rgba(125,211,252,0.3),rgba(186,230,253,0.2));transform:translateY(-2px)}

/* GLASS CARD */
.glass-section{padding:80px 2rem;max-width:1200px;margin:0 auto}
.glass-section h2{font-size:clamp(1.4rem,3vw,2.1rem);text-align:center;margin-bottom:.75rem}
.glass-sub{text-align:center;color:var(--muted);max-width:640px;margin:0 auto 3rem}

.glass-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem}
.glass-card{
  background:var(--glass);border:1px solid var(--glass-border);backdrop-filter:blur(12px);
  border-radius:16px;padding:2rem;transition:.3s}
.glass-card:hover{border-color:var(--ice);transform:translateY(-3px)}
.glass-card h3{font-size:1.05rem;color:var(--frost);margin-bottom:.75rem}
.glass-card p{color:var(--muted);font-size:.95rem}

/* GAME */
.cryo-game{max-width:960px;margin:2rem auto}
.cryo-game iframe{width:100%;height:570px;border:1px solid var(--glass-border);border-radius:14px;background:rgba(0,0,0,0.3)}

/* BAND */
.cryo-band{
  background:var(--glass);border-top:1px solid var(--glass-border);border-bottom:1px solid var(--glass-border);
  backdrop-filter:blur(10px);padding:3rem 2rem;text-align:center;margin:2rem 0}
.cryo-band h2{color:var(--frost);margin-bottom:1rem}
.cryo-band p{color:var(--muted);max-width:700px;margin:0 auto}

/* FOOTER */
.cryo-footer{
  background:rgba(8,16,30,0.9);border-top:1px solid var(--glass-border);
  padding:3rem 2rem;text-align:center}
.cryo-footer p{color:var(--muted);font-size:.9rem;margin-bottom:.4rem}
.cryo-flinks{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap;margin-top:1rem}
.cryo-flinks a{color:var(--muted);font-size:.85rem}
.cryo-flinks a:hover{color:var(--ice)}

/* TEXT */
.cryo-txt{padding:110px 2rem 60px;max-width:860px;margin:0 auto}
.cryo-txt h1{font-size:clamp(1.6rem,3vw,2.4rem);margin-bottom:1.5rem}
.cryo-txt h2{font-size:1.2rem;color:var(--frost);margin:2rem 0 .75rem;text-align:left}
.cryo-txt p,.cryo-txt li{color:var(--muted);margin-bottom:1rem}
.cryo-txt ul{padding-left:1.5rem}

/* AGE */
.cryo-gate{position:fixed;inset:0;z-index:9999;background:rgba(8,16,30,0.96);display:flex;align-items:center;justify-content:center}
.cryo-gate-box{
  background:var(--glass);border:1px solid var(--glass-border);backdrop-filter:blur(16px);
  border-radius:18px;padding:3rem;text-align:center;max-width:420px;width:90%}
.cryo-gate-box h2{font-size:1.4rem;margin-bottom:1rem;color:var(--frost)}
.cryo-gate-box p{color:var(--muted);margin-bottom:2rem}
.cryo-gate-btns{display:flex;gap:1rem;justify-content:center}
.cryo-gate-btns .enter{padding:.7rem 2rem;background:rgba(125,211,252,0.2);border:1px solid var(--ice);color:var(--frost);border-radius:10px;cursor:pointer;font-weight:600}
.cryo-gate-btns .leave{padding:.7rem 2rem;background:transparent;border:1px solid var(--glass-border);color:var(--muted);border-radius:10px;cursor:pointer}

.hidden{display:none!important}

@media(max-width:768px){
  .frost-links{display:none;flex-direction:column;position:absolute;top:66px;left:0;width:100%;background:rgba(10,22,40,0.95);backdrop-filter:blur(16px);padding:1.5rem 2.5rem;gap:1rem;border-bottom:1px solid var(--glass-border)}
  .frost-links.open{display:flex}
  .frost-ham{display:block}
  .cryo-game iframe{height:320px}
  .frost-nav{padding:0 1.5rem}
}