@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=Karla:wght@400;500;600;700&display=swap');

:root {
  --radius-card: 24px;
  --radius-image: 16px;
  --radius-input: 12px;
  --shadow-card: 0 1px 2px rgba(0,0,0,0.05);
  --space-section: clamp(4rem, 7vw, 6rem);
  --type-body: 1.06rem;
  --type-small: .9rem;
  --type-eyebrow: .74rem;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: var(--color-background); color: var(--color-text-primary); font-family: var(--font-body); font-size: var(--type-body); line-height: 1.55; }
h1,h2,h3,h4 { font-family: var(--font-display); font-weight: 600; line-height: 1.1; text-wrap: balance; }
h1 { font-size: clamp(2.2rem, 4.5vw, 3rem); }
h2 { font-size: 1.9rem; }
h3 { font-size: 1.4rem; }
p { text-wrap: pretty; }
.font-display { font-family: var(--font-display); }
.eyebrow { color: var(--color-accent); font-size: var(--type-eyebrow); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.section-pad { padding-block: var(--space-section); }
.section-heading::first-letter, .hero-heading::first-letter { color: var(--color-accent); font-size: 1.35em; }
.logo-mark { height: 2.5rem; width: 2.5rem; object-fit: contain; }
.site-nav a { transition: color .2s ease; }
.site-nav a:hover { color: var(--color-accent); }
.nav-toggle { background: transparent; border: 0; color: var(--color-primary); }
.btn-action { background: var(--color-surface); color: var(--color-primary); border: 0; border-radius: 12px; box-shadow: inset 0 -2px 0 rgba(0,0,0,.08); transition: background-color .2s ease, transform .2s ease; }
.btn-action:hover { background: #fff; transform: translateY(-1px); }
.btn-accent { background: var(--color-accent); color: #fff; }
.btn-accent:hover { background: #dda90b; color: #fff; }
.card-soft { border-radius: var(--radius-card); box-shadow: var(--shadow-card); background: var(--color-surface); }
.rounded-image { border-radius: var(--radius-image); }
.form-input { border: 0; border-radius: var(--radius-input); background: var(--color-surface); color: var(--color-text-primary); box-shadow: inset 0 1px 2px rgba(0,0,0,.05); }
.form-input:focus { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.highlight-strip { background: var(--color-primary); color: #fff; }
.highlight-strip span { color: #fff; }
.cookie-banner { position: fixed; z-index: 50; inset-inline: 1rem; bottom: 1rem; max-width: 44rem; margin-inline: auto; padding: 1rem 1.25rem; border-radius: 16px; background: var(--color-surface); box-shadow: 0 8px 30px rgba(17,21,24,.14); }
.cookie-banner[hidden] { display: none; }
.confirmation { border-radius: 16px; background: #edf6e8; color: #29412a; }
.footer-row { border-top: 1px solid rgba(21,23,24,.08); }
.footer-link { color: var(--color-text-secondary); transition: color .2s ease; }
.footer-link:hover { color: var(--color-accent); }
iframe { border: 0; border-radius: var(--radius-image); }
@media (max-width: 767px) { .mobile-menu { display: none; } .mobile-menu.is-open { display: block; } }
@media (min-width: 768px) { .mobile-menu { display: flex !important; } }
