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

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

:root{
  --gold:#d4af37;
  --gold-light:#e8c547;
  --cream:#faf0d7;
  --bg:#0c0b08;
  --surface:#141210;
  --card:#1e1b15;
  --text:#ede4cc;
  --dim:#a89e84;
  --border:rgba(212,175,55,.2);
}

html{scroll-behavior:smooth}
body{font-family:'Cinzel',serif;background:var(--bg);color:var(--text);line-height:1.8;overflow-x:hidden}
a{color:var(--gold);text-decoration:none;transition:.2s}
a:hover{color:var(--gold-light)}

/* HEADER */
.classic-hdr{position:sticky;top:0;z-index:900;background:rgba(12,11,8,.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.hdr-row{max-width:1440px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:70px;padding:0 1.5rem}
.crest{display:flex;align-items:center;gap:.6rem;font-weight:700;font-size:1.3rem;color:var(--gold);letter-spacing:2px;text-transform:uppercase}
.crest svg{width:36px;height:36px}
.nav-classic{list-style:none;display:flex;gap:1.8rem}
.nav-classic a{font-weight:500;font-size:.85rem;color:var(--dim);letter-spacing:1.5px;text-transform:uppercase}
.nav-classic a:hover,.nav-classic a.act{color:var(--gold)}
.burger-classic{display:none;background:none;border:none;cursor:pointer;padding:4px}
.burger-classic span{display:block;width:24px;height:2px;background:var(--gold);margin:5px 0;border-radius:1px;transition:.3s}

/* HERO */
.regal-hero{
  min-height:560px;display:flex;align-items:center;justify-content:center;
  text-align:center;padding:5rem 1.5rem;
  background:linear-gradient(180deg,#0c0b08 0%,#1a1710 50%,#0c0b08 100%);
  position:relative;
}
.regal-hero::before{
  content:'';position:absolute;top:0;left:0;right:0;bottom:0;
  background:url("data:image/svg+xml,%3Csvg width='40' height='40' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20 0v40M0 20h40' stroke='%23d4af37' stroke-width='.2' opacity='.06'/%3E%3C/svg%3E");
  pointer-events:none;
}
.hero-regal{position:relative;z-index:2;max-width:780px}
.hero-regal h1{font-size:2.6rem;font-weight:800;margin-bottom:1rem;color:var(--gold);letter-spacing:2px}
.hero-regal p{font-size:1rem;color:var(--dim);margin-bottom:2rem}
.btn-regal{
  display:inline-block;padding:.9rem 2.8rem;
  border:2px solid var(--gold);color:var(--gold);
  font-family:inherit;font-weight:700;font-size:.9rem;
  letter-spacing:2px;text-transform:uppercase;
  background:transparent;border-radius:0;cursor:pointer;transition:.25s;
}
.btn-regal:hover{background:var(--gold);color:var(--bg)}

/* PILLARS */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;max-width:1440px;margin:3rem auto;padding:0 1.5rem}
.pillar{background:var(--card);padding:2rem 1.5rem;text-align:center;border:1px solid var(--border)}
.pillar .sym{font-size:2rem;margin-bottom:.6rem}
.pillar h3{font-size:.9rem;color:var(--gold);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:.4rem}
.pillar p{font-size:.9rem;color:var(--dim)}

/* GAME */
.game-hall{max-width:1440px;margin:3rem auto 4rem;padding:0 1.5rem}
.game-hall h2{text-align:center;font-size:1.5rem;color:var(--gold);letter-spacing:2px;text-transform:uppercase;margin-bottom:1.2rem}
.game-border{border:2px solid var(--border);background:#000;overflow:hidden}
.game-border iframe{display:block;width:100%;height:600px;border:none}

/* NARRATIVE */
.narrative{background:var(--surface);padding:4rem 1.5rem;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.narr-inner{max-width:1440px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr;gap:3rem;align-items:start}
.narr-inner h2{font-size:1.5rem;color:var(--gold);letter-spacing:1.5px;margin-bottom:1rem}
.narr-inner p{color:var(--dim);font-size:.95rem;margin-bottom:.9rem}
.side-list{background:var(--card);padding:2rem 1.5rem;border:1px solid var(--border)}
.side-list h3{font-size:.85rem;color:var(--gold);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:1rem}
.side-list ul{list-style:none}
.side-list li{color:var(--dim);font-size:.9rem;padding:.5rem 0;border-bottom:1px solid var(--border)}
.side-list li:last-child{border-bottom:none}

/* VIRTUES */
.virtues{max-width:1440px;margin:4rem auto;padding:0 1.5rem}
.virtues h2{text-align:center;font-size:1.5rem;color:var(--gold);letter-spacing:2px;text-transform:uppercase;margin-bottom:2rem}
.virtue-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.virtue{background:var(--card);padding:2rem 1.5rem;border:1px solid var(--border);border-top:3px solid var(--gold);transition:.2s}
.virtue:hover{transform:translateY(-3px)}
.virtue .sym{font-size:1.6rem;margin-bottom:.5rem}
.virtue h3{font-size:.85rem;color:var(--gold);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:.4rem}
.virtue p{font-size:.88rem;color:var(--dim)}

/* PAGE */
.text-page{max-width:920px;margin:3rem auto;padding:0 1.5rem}
.text-page h1{font-size:2rem;color:var(--gold);letter-spacing:1.5px;margin-bottom:1rem}
.text-page h2{font-size:1.15rem;color:var(--gold-light);letter-spacing:1px;margin:2rem 0 .7rem}
.text-page p,.text-page li{color:var(--dim);font-size:.95rem;margin-bottom:.7rem}
.text-page ul{padding-left:1.4rem;margin-bottom:1rem}

/* PLAY */
.play-intro{padding:3rem 1.5rem 1rem;text-align:center}
.play-intro h1{font-size:2rem;color:var(--gold);letter-spacing:2px;margin-bottom:.4rem}
.play-intro p{color:var(--dim);max-width:640px;margin:0 auto}
.play-embed{max-width:1440px;margin:2rem auto 3rem;padding:0 1.5rem}
.play-detail{max-width:800px;margin:0 auto 3rem;padding:0 1.5rem}
.play-detail h2{font-size:1.1rem;color:var(--gold);letter-spacing:1.5px;margin-bottom:.5rem}
.play-detail p{color:var(--dim);font-size:.92rem}

/* FOOTER */
.regal-foot{background:var(--surface);border-top:1px solid var(--border);padding:2.5rem 1.5rem;text-align:center}
.regal-foot p{color:var(--dim);font-size:.85rem;margin-bottom:.5rem}
.rg-row{display:flex;justify-content:center;gap:2rem;flex-wrap:wrap;margin-bottom:.6rem}
.rg-row a{color:var(--gold);font-size:.85rem;letter-spacing:1px}

/* AGE */
.age-veil{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:9999;display:flex;align-items:center;justify-content:center}
.age-crest{background:var(--card);border:2px solid var(--gold);padding:2.5rem 2rem;text-align:center;max-width:430px;width:90%}
.age-crest h2{color:var(--gold);font-size:1.3rem;letter-spacing:1.5px;margin-bottom:.8rem}
.age-crest p{color:var(--dim);font-size:.92rem;margin-bottom:1.4rem}
.age-pair{display:flex;gap:1rem;justify-content:center}
.age-pair button{padding:.7rem 2.4rem;font-family:inherit;font-weight:700;font-size:.9rem;border:none;cursor:pointer;letter-spacing:1.5px;text-transform:uppercase;transition:.2s}
.btn-proceed{background:var(--gold);color:var(--bg)}
.btn-proceed:hover{background:var(--gold-light)}
.btn-exit{background:#2a2720;color:var(--dim);border:1px solid var(--border)}
.btn-exit:hover{background:#3a3730}
.blocked{color:#ef5350;font-weight:600;font-size:.85rem;margin-top:.7rem;display:none}

@media(max-width:768px){
  .burger-classic{display:block}
  .nav-classic{display:none;position:absolute;top:70px;left:0;right:0;background:rgba(12,11,8,.98);flex-direction:column;padding:1.2rem;gap:.8rem;border-bottom:1px solid var(--border)}
  .nav-classic.open{display:flex}
  .hero-regal h1{font-size:1.8rem}
  .pillars{grid-template-columns:1fr}
  .narr-inner{grid-template-columns:1fr}
  .virtue-grid{grid-template-columns:1fr}
  .game-border iframe{height:380px}
  .regal-hero{min-height:auto;padding:3rem 1rem}
}