@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;600;700&family=Karla:wght@400;500;700&display=swap');

:root{
  --bg:#FFFFFF;
  --bg-alt:#F7F5F0;
  --text:#2B2B2B;
  --accent:#C0392B;   /* fire-red accent, used sparingly like the original's fire branding */
  --olive:#8C9A6B;
  --line:#E4E0D8;
}

*{box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:'Karla', Arial, sans-serif;
  line-height:1.7;
}

a{color:var(--accent); text-decoration:underline;}
a:hover{opacity:.8;}
a:focus-visible, button:focus-visible{outline:2px solid var(--accent); outline-offset:3px;}

h1,h2,h3,h4{
  font-family:'Playfair Display', Georgia, serif;
  font-weight:600;
  line-height:1.2;
  margin:0 0 .5em;
  color:var(--text);
}

h1{font-size:clamp(2rem,4.5vw,2.9rem); text-align:center;}
h2{font-size:clamp(1.3rem,2.6vw,1.7rem);}
h3{font-size:1.15rem;}

p{margin:0 0 1em; max-width:70ch;}

.wrap{max-width:900px; margin:0 auto; padding:0 24px;}

/* Nav - mimics the original's simple top bar with a dropdown */
header.site{
  background:#fff;
  border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:10;
}
.nav-inner{
  max-width:1100px; margin:0 auto; padding:16px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  flex-wrap:wrap;
}
.brand{
  display:flex; align-items:center; gap:8px;
  font-family:'Playfair Display', serif; font-weight:600; font-size:1.1rem;
  color:var(--text); text-decoration:none;
}
nav.links{display:flex; flex-wrap:wrap; gap:2px; font-size:.85rem; text-transform:uppercase; letter-spacing:.04em;}
nav.links details{position:relative;}
nav.links summary{list-style:none; cursor:pointer; padding:10px 12px; border-radius:2px; display:inline-block;}
nav.links summary::-webkit-details-marker{display:none;}
nav.links a{
  color:var(--text); text-decoration:none; padding:10px 12px; display:inline-block;
}
nav.links a:hover, nav.links summary:hover{color:var(--accent);}
nav.links .submenu{
  position:absolute; left:0; top:100%; background:#fff;
  border:1px solid var(--line); padding:6px; min-width:210px;
  display:flex; flex-direction:column; box-shadow:0 4px 10px rgba(0,0,0,.06);
}
nav.links .submenu a{text-transform:none; letter-spacing:0; font-size:.88rem;}

/* Inactive banner */
.status-banner{
  background:var(--bg-alt);
  border-left:3px solid var(--accent);
  padding:14px 18px;
  margin:28px 0;
  font-size:.95rem;
}
.status-banner strong{color:var(--accent);}

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* Full-bleed hero banner */
.hero-banner{width:100%; overflow:hidden; border-bottom:1px solid var(--line);}
.hero-banner img{width:100%; height:auto; max-height:70vh; object-fit:cover; display:block;}

/* Hero */
.hero{padding:56px 0 32px; text-align:center; border-bottom:1px solid var(--line);}
.eyebrow{
  text-transform:uppercase; letter-spacing:.12em; font-size:.78rem;
  color:var(--accent); font-weight:700; margin-bottom:12px; display:block; text-align:center;
}
.hero p{margin-left:auto; margin-right:auto; text-align:center;}

.divider{border:none; border-top:1px solid var(--line); margin:36px 0;}

section{padding:8px 0 32px;}

/* Cards */
.card-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:18px; margin:20px 0;}
.card{
  background:var(--bg-alt); border:1px solid var(--line);
  border-radius:2px; padding:20px;
}
.card h3{margin-top:0;}

img{max-width:100%; height:auto; display:block;}
.gallery{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; margin:20px 0;}
.gallery img{width:100%; height:150px; object-fit:cover;}

ul.plain{padding-left:1.2em;}
ul.plain li{margin-bottom:.5em;}

.btn{
  display:inline-block; background:var(--accent); color:#fff; font-weight:700;
  text-decoration:none; padding:10px 22px; border-radius:2px; margin:6px 8px 6px 0;
  text-transform:uppercase; letter-spacing:.05em; font-size:.82rem;
}
.btn.ghost{background:#fff; border:1px solid var(--accent); color:var(--accent);}

footer.site{
  border-top:1px solid var(--line);
  padding:32px 0 50px; margin-top:40px; font-size:.88rem; color:#666; text-align:center;
}
footer.site p{margin:0 0 .4em; max-width:none;}

@media (max-width:640px){
  nav.links{font-size:.78rem;}
}

/* Full-bleed helper (breaks out of the centered .wrap container) */
.bleed{margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); width:100vw;}

/* Event highlights: alternating text/image rows */
.highlights-title{text-align:center; padding:44px 24px 8px; margin:0;}
.highlight-row{display:grid; grid-template-columns:1fr 1fr;}
.highlight-text{background:var(--bg-alt); padding:56px 6vw; display:flex; flex-direction:column; justify-content:center;}
.highlight-text h3{color:var(--olive); font-size:clamp(1.8rem,3.5vw,2.4rem); margin-bottom:.3em;}
.highlight-sub{font-weight:600; color:var(--text); margin-bottom:1em;}
.highlight-image-wrap{background:var(--olive); padding:32px; display:flex; align-items:center; justify-content:center;}
.highlight-image-wrap img{width:100%; max-width:460px; aspect-ratio:1/1; height:auto; object-fit:cover; border-radius:2px;}
.highlight-actions{display:flex; gap:12px; flex-wrap:wrap; margin-top:8px;}
.highlight-actions .btn{background:var(--olive);}
.highlight-actions .btn.ghost{background:transparent; border:1px solid var(--olive); color:var(--olive);}

@media (max-width:760px){
  .highlight-row{grid-template-columns:1fr;}
  .highlight-row .highlight-text, .highlight-row.reverse .highlight-text{order:2;}
  .highlight-row .highlight-image-wrap, .highlight-row.reverse .highlight-image-wrap{order:1;}
}