:root{
  --maroon:#771215; --maroon-dark:#5c0e11; --gold:#c69e21; --gold-soft:#d8b44e;
  --cream:#faf6ef; --surface:#ffffff; --panel:#f6efe4; --ink:#2b2422; --muted:#6b5f5a; --line:#e7ddd0;
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--surface);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--serif);font-weight:700;line-height:1.12;margin:0;letter-spacing:.01em}
a{color:inherit}
img{max-width:100%}
.wrap{max-width:1140px;margin:0 auto;padding:0 24px}
.btn{display:inline-block;background:var(--gold);color:#3a2c06;font-weight:700;text-decoration:none;padding:14px 30px;border-radius:4px;font-size:14px;letter-spacing:.08em;text-transform:uppercase;border:none;cursor:pointer;transition:filter .15s}
.btn:hover{filter:brightness(1.06)}
.btn-outline{background:transparent;border:1.5px solid var(--gold);color:var(--gold)}
.btn-maroon{background:var(--maroon);color:#fff}
.kick{color:var(--gold);font-weight:700;letter-spacing:.22em;text-transform:uppercase;font-size:12.5px}

/* Header */
header.top{position:sticky;top:0;z-index:50;background:var(--maroon);color:#fff;box-shadow:0 2px 16px rgba(0,0,0,.22)}
.topbar{display:flex;align-items:center;justify-content:space-between;height:78px;gap:18px}
.brand{display:flex;align-items:center;text-decoration:none;color:#fff}
.brand img{height:50px;display:block}
.brand .name{font-family:var(--serif);font-weight:700;font-size:27px;letter-spacing:.04em}
.brand .name span{color:var(--gold)}
nav.main{display:flex;align-items:center;gap:30px}
nav.main a{color:#f3e7e1;text-decoration:none;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:6px 0;border-bottom:2px solid transparent;transition:.15s}
nav.main a:hover,nav.main a.active{color:#fff;border-bottom-color:var(--gold)}
.menu-btn{display:none;background:none;border:1.5px solid rgba(255,255,255,.5);color:#fff;border-radius:6px;padding:7px 11px;font-size:18px;cursor:pointer}

/* Hero */
.hero{position:relative;background:linear-gradient(rgba(255,255,255,.32),rgba(255,255,255,.50)),url('images/legacy-guild-hero.jpg') center/cover no-repeat;color:var(--ink);overflow:hidden;text-align:center}
.logo-badge{display:inline-block;background:var(--maroon);border-radius:16px;padding:22px 30px;margin:0 auto 26px;box-shadow:0 12px 32px rgba(92,14,17,.28)}
.logo-badge img{width:124px;height:auto;display:block}
.hero .wrap{position:relative;z-index:2;padding:96px 24px 104px;max-width:900px}
.hero .eyebrow{color:#9a7b1a;letter-spacing:.28em;text-transform:uppercase;font-size:13px;font-weight:700;margin-bottom:20px}
.hero h1{font-size:62px;line-height:1.04;color:var(--maroon)}
.hero p{font-size:20px;color:#4a3f3a;margin:24px auto 34px;max-width:680px}
.hero-cta{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.rule{width:70px;height:3px;background:var(--gold);margin:0 auto 22px;border:0}

/* Sections */
section{padding:84px 0}
.sec-head{text-align:center;max-width:820px;margin:0 auto 54px}
.sec-head h2{font-size:44px;color:var(--maroon)}
.sec-head p{color:var(--muted);font-size:18px;margin-top:16px}
.panel{background:var(--panel)}
.cream{background:var(--cream)}
.lead-statement{font-family:var(--serif);font-size:30px;line-height:1.35;color:var(--maroon);text-align:center;max-width:920px;margin:0 auto;font-weight:600}

/* Intro */
.intro{max-width:860px;margin:0 auto;text-align:center}
.intro p{font-size:18px;color:var(--ink);margin:0 0 20px}
.crit{display:inline-block;background:var(--maroon);color:#fff;border-radius:10px;padding:18px 34px;font-family:var(--serif);font-size:25px;font-weight:600;margin-top:20px;box-shadow:0 10px 26px rgba(92,14,17,.22)}

/* Features grid */
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.fcard{background:var(--gold);border:none;border-radius:12px;padding:38px 32px;text-align:center;transition:transform .15s,box-shadow .15s}
.fcard:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(119,18,21,.2)}
.fcard .ic{width:78px;height:78px;margin:0 auto 14px;display:flex;align-items:center;justify-content:center}
.fcard .ic img{width:64px;height:64px;object-fit:contain}
.fcard h3{font-size:27px;color:#fff;margin-bottom:10px}
.fcard p{color:#5c0e11;font-size:16px;margin:0}

/* Quote band */
.band{background:var(--maroon);color:#fff;text-align:center}
.band .wrap{max-width:880px}
.band h2{font-size:40px;color:#fff;margin-bottom:18px}
.band p{font-size:19px;color:#f0e3dd}

/* About */
.about .wrap{display:grid;grid-template-columns:1fr 320px;gap:56px;align-items:center}
.about p{font-size:18px;color:var(--ink);margin:0 0 20px}
.about .crest{display:flex;justify-content:center}
.about .crest img{max-width:260px;height:auto}

/* Contact */
.contact .wrap{display:grid;grid-template-columns:1fr 1fr;gap:54px}
.contact h2{font-size:40px;color:var(--maroon);margin-bottom:10px}
.contact .lead{color:var(--muted);font-size:18px;margin-bottom:26px}
.cinfo div{margin-bottom:14px;font-size:16px}
.cinfo b{color:var(--maroon)}
.cinfo a{color:var(--maroon);font-weight:600;text-decoration:none}
form label{display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--maroon);margin:0 0 6px}
form input,form textarea{width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:7px;font-family:inherit;font-size:15px;margin-bottom:16px;background:#fff}
form textarea{min-height:120px;resize:vertical}

footer{background:var(--maroon-dark);color:#e9d9d3;padding:40px 0;font-size:14px;text-align:center}
footer .fname{font-family:var(--serif);font-size:24px;color:#fff;letter-spacing:.04em;margin-bottom:8px}
footer .fname span{color:var(--gold)}
footer a{color:var(--gold-soft);text-decoration:none}

@media(max-width:920px){
  nav.main{position:fixed;top:78px;left:0;right:0;background:var(--maroon-dark);flex-direction:column;align-items:flex-start;gap:0;padding:8px 24px 18px;display:none}
  nav.main.open{display:flex}
  nav.main a{width:100%;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.1)}
  .menu-btn{display:block}
  .hero h1{font-size:42px}
  .hero .wrap{padding:74px 24px 80px}
  .sec-head h2{font-size:34px}
  .feat{grid-template-columns:1fr}
  .about .wrap,.contact .wrap{grid-template-columns:1fr;gap:34px}
  .about .crest{order:-1}
}