:root{
  --brand: #1a2a44; /* deep navy */
  --accent: #c6a664; /* brass */
  --bg: #f8f7f3; /* off-white */
  --ink: #222;
  --ink-muted: #585858;
  --surface: #ffffff;
  --radius: 16px;
  --shadow: 0 12px 30px rgba(0,0,0,.08);
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#0f141c; --surface:#101826; --ink:#f1f5f9; --ink-muted:#cbd5e1; --shadow: 0 12px 30px rgba(0,0,0,.35) }
}
*{box-sizing:border-box}
html{font-size:16px; scroll-behavior:smooth}
body{margin:0;font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";background:var(--bg);color:var(--ink);line-height:1.6}
a{color:var(--brand); text-decoration: none}
a:hover{text-decoration: underline}
.container{max-width:1160px;margin:0 auto;padding:24px}
.header{position:sticky;top:0;z-index:1000;backdrop-filter:saturate(1.2) blur(8px);background:rgba(255,255,255,.7);border-bottom:1px solid rgba(0,0,0,.06)}
@media (prefers-color-scheme: dark){ .header{background:rgba(16,24,38,.6)} }
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:14px;font-weight:850;letter-spacing:.2px}
.brand .mark{width:40px;height:40px;border-radius:50%;background: conic-gradient(from 180deg at 50% 50%, var(--accent), var(--brand)); box-shadow: var(--shadow)}
.menu{display:flex;flex-wrap:wrap;gap:8px}
.menu a{padding:10px 14px;border-radius:12px}
.menu .cta{background:var(--accent);color:#111;border:1px solid transparent;font-weight:800}
.menu-toggle{display:none}
@media (max-width: 880px){
  .menu{display:none;flex-direction:column;width:100%}
  .menu.open{display:flex}
  .menu-toggle{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid rgba(0,0,0,.12);border-radius:12px;background:var(--surface);color:var(--ink)}
}
.hero{
  position:relative; isolation:isolate;
  padding: clamp(60px, 10vw, 120px) 0 48px;
  background: linear-gradient(180deg, var(--surface), transparent 65%);
}
.hero .bg-art{
  position:absolute; inset:0; z-index:-1; opacity:.65;
  background-image: url('assets/leafy-pattern.svg'), url('assets/string-lights.svg');
  background-repeat: repeat, no-repeat;
  background-position: center, top center;
  background-size: auto, cover;
  mask-image: radial-gradient(70% 60% at 50% 0%, black 40%, transparent 70%);
}
.hero h1{font-size: clamp(2.2rem, 5vw, 3.6rem); margin: 0 0 8px}
.hero p{color:var(--ink-muted); margin: 0 0 20px; font-size: clamp(1rem, 2vw, 1.2rem)}
.badges{display:flex; flex-wrap:wrap; gap:10px}
.badge{display:inline-flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid rgba(0,0,0,.06); background:var(--surface); border-radius:999px; box-shadow: var(--shadow)}
.badge img{width:20px;height:20px}
.grid{display:grid; grid-template-columns: repeat(12, 1fr); gap: 22px}
.card{grid-column: span 6; background: var(--surface); border:1px solid rgba(0,0,0,.06); border-radius: var(--radius); box-shadow: var(--shadow); overflow: clip; transform: translateZ(0)}
.card > .pad{padding:18px}
@media (max-width: 880px){ .card{ grid-column: 1 / -1 } }
.card h3{margin:0 0 6px}
.card.reveal{opacity:0; transform: translateY(12px); transition: all .6s cubic-bezier(.2,.8,.2,1)}
.card.reveal.visible{opacity:1; transform: translateY(0)}
.kicker{letter-spacing:.14em; text-transform:uppercase; font-size:.8rem; color: var(--ink-muted)}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:12px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;border:1px solid rgba(0,0,0,.1);background:var(--surface);color:var(--ink);font-weight:700}
.btn.primary{background:var(--brand); color:white; border-color:transparent}
.btn.accent{background:var(--accent); color:#111; border-color:transparent}
.table{width:100%; border-collapse: collapse; font-variant-numeric: tabular-nums}
.table th,.table td{padding:10px 12px; border-bottom:1px solid rgba(0,0,0,.07); text-align:left}
.section{margin-top:36px}
.small{font-size:.92rem; color: var(--ink-muted)}
.notice{padding:12px 14px; border-left:4px solid var(--accent); background: rgba(198,166,100,.08); border-radius: 10px}
.footer{margin-top:56px; background:var(--surface); border-top:1px solid rgba(0,0,0,.06)}
.footer .cols{display:grid; grid-template-columns: repeat(3,1fr); gap:18px}
@media (max-width: 880px){ .footer .cols{grid-template-columns: 1fr} }
.hero-img{
  width:100%; aspect-ratio: 16/9; border-radius: var(--radius);
  background: linear-gradient(135deg, rgba(198,166,100,.12), rgba(26,42,68,.12)), repeating-linear-gradient(45deg, rgba(26,42,68,.08), rgba(26,42,68,.08) 8px, rgba(26,42,68,.06) 8px, rgba(26,42,68,.06) 16px);
  border:1px dashed rgba(0,0,0,.1);
}
/* Accessibility helpers */
.visually-hidden{position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}