:root{
  --bg:#1a1208; --bg-2:#0f0a05; --fg:#f5ead6; --muted:#a89479;
  --primary:#d4a55a; --accent:#c2632d; --border:rgba(212,165,90,.2);
  --font-display:"Cormorant Garamond",Georgia,serif;
  --font-body:"Inter",system-ui,sans-serif;
  --shadow-glow:0 30px 80px -20px rgba(194,99,45,.5);
  --gradient-warm:radial-gradient(ellipse at top,#3a2614 0%,#1a1208 60%);
  --gradient-hero:linear-gradient(180deg,rgba(15,10,5,.2),rgba(15,10,5,.85) 70%,#0f0a05 100%);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--gradient-warm);color:var(--fg);line-height:1.5;min-height:100vh}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 1.5rem}
.container-sm{max-width:900px;margin:0 auto;padding:0 1.5rem}

/* NAV */
header.site{position:absolute;top:0;left:0;right:0;z-index:20}
header.site nav{display:flex;align-items:center;justify-content:space-between;padding:1.5rem;max-width:1280px;margin:0 auto}
.brand{display:flex;align-items:center;gap:.75rem}
.brand img{height:56px;width:56px;border-radius:50%;background:rgba(0,0,0,.4);padding:4px;outline:1px solid rgba(212,165,90,.3)}
.brand span{font-family:var(--font-display);font-style:italic;color:var(--primary);font-size:1.1rem;letter-spacing:.02em}
nav ul{display:none;gap:2rem;list-style:none;text-transform:uppercase;letter-spacing:.2em;font-size:.8rem;color:var(--muted)}
nav ul a:hover{color:var(--primary)}
@media(min-width:768px){nav ul{display:flex}}

/* HERO */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;text-align:center}
.hero .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.7}
.hero .overlay{position:absolute;inset:0;background:var(--gradient-hero)}
.hero .inner{position:relative;z-index:10;max-width:900px;padding:0 1.5rem}
.eyebrow{font-size:.75rem;text-transform:uppercase;letter-spacing:.4em;color:var(--primary);margin-bottom:1.5rem}
.hero h1{font-family:var(--font-display);font-weight:500;font-size:clamp(3rem,8vw,6rem);line-height:1.05}
.italic-primary{font-style:italic;color:var(--primary)}
.quote{font-family:var(--font-display);font-style:italic;font-size:1.25rem;color:var(--muted);max-width:640px;margin:2rem auto 0;line-height:1.6}
.quote small{display:block;font-style:normal;font-size:.75rem;letter-spacing:.2em;margin-top:.5rem}
.cta-group{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-top:2.5rem}
.btn{padding:.85rem 2rem;font-size:.8rem;text-transform:uppercase;letter-spacing:.2em;border-radius:999px;transition:transform .2s;display:inline-block;border:none;cursor:pointer}
.btn-primary{background:var(--primary);color:#1a1208;box-shadow:var(--shadow-glow)}
.btn-primary:hover{transform:scale(1.05)}
.btn-outline{border:1px solid rgba(212,165,90,.4);color:var(--primary)}
.btn-outline:hover{background:rgba(212,165,90,.1)}
.scroll-hint{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);font-size:.7rem;text-transform:uppercase;letter-spacing:.3em;color:var(--muted)}

/* SECTIONS */
section{padding:8rem 0}
.section-eyebrow{font-size:.75rem;text-transform:uppercase;letter-spacing:.4em;color:var(--accent);margin-bottom:1rem;text-align:center}
.section-eyebrow.left{text-align:left}
h2{font-family:var(--font-display);font-size:clamp(2.25rem,5vw,3rem);line-height:1.1;margin-bottom:3rem;text-align:center}
h2.left{text-align:left;margin-bottom:2rem}
.about{display:grid;gap:4rem;align-items:center}
@media(min-width:768px){.about{grid-template-columns:1fr 1fr}}
.about p{color:var(--muted);margin-bottom:1.25rem;line-height:1.7}
.about .highlight{color:var(--primary)}
.about-img{position:relative}
.about-img img{border-radius:.5rem;box-shadow:0 25px 50px -12px rgba(0,0,0,.5);outline:1px solid rgba(212,165,90,.2)}

/* TIMELINE */
.timeline-wrap{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:rgba(15,10,5,.5)}
.timeline-row{display:grid;grid-template-columns:1fr 3fr;gap:2rem;padding:1.5rem 0;border-top:1px solid var(--border)}
.timeline-row:first-child{border-top:none}
@media(min-width:768px){.timeline-row{gap:4rem}}
.timeline-year{font-family:var(--font-display);font-size:1.5rem;color:var(--primary)}
.timeline-text{color:var(--muted)}

/* CARDS */
.cards{display:grid;gap:1.5rem}
@media(min-width:768px){.cards{grid-template-columns:repeat(3,1fr)}}
.card{position:relative;overflow:hidden;border-radius:.75rem;border:1px solid rgba(212,165,90,.25);background:rgba(15,10,5,.4);padding:2rem;transition:all .3s}
.card:hover{transform:translateY(-4px);border-color:rgba(212,165,90,.5)}
.card .num{font-family:var(--font-display);font-size:3rem;color:rgba(212,165,90,.5);margin-bottom:1.5rem}
.card h3{font-family:var(--font-display);font-size:1.5rem;margin-bottom:.75rem}
.card p{font-size:.9rem;color:var(--muted);line-height:1.6}

/* STODOLA */
.stodola{position:relative;overflow:hidden;text-align:center}
.stodola .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.25}
.stodola .overlay{position:absolute;inset:0;background:rgba(15,10,5,.8)}
.stodola .inner{position:relative;max-width:800px;margin:0 auto;padding:0 1.5rem}
.stodola p{color:var(--muted);font-size:1.125rem;line-height:1.7;margin:0 auto 2.5rem;max-width:640px}

/* CONTACT */
.contact{display:grid;gap:4rem}
@media(min-width:768px){.contact{grid-template-columns:1fr 1fr}}
.hours-row{display:flex;justify-content:space-between;padding-bottom:.75rem;border-bottom:1px solid var(--border);font-size:1.1rem;margin-bottom:1rem}
.hours-row .label{color:var(--muted)}
.hours-row .val{color:var(--primary)}
.contact-info{color:var(--muted);font-size:1.1rem;line-height:1.7}
.contact-info a{color:var(--primary)}
.contact-info a:hover{opacity:.7}

/* FOOTER */
footer{border-top:1px solid var(--border);background:rgba(15,10,5,.6);padding:2.5rem 0;color:var(--muted);font-size:.875rem}
footer .inner{display:flex;flex-direction:column;align-items:center;gap:1rem;justify-content:space-between}
@media(min-width:768px){footer .inner{flex-direction:row}}
footer .brand img{height:40px;width:40px}
