/* ---------- reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; }

/* ---------- accessibility ---------- */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 3px; }
.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 100;
  background: var(--accent); color: #fff; padding: .6rem 1rem;
  font-weight: 600; text-decoration: none; border-radius: 0 0 6px 0;
}
.skip-link:focus { left: 0; }
main:focus { outline: none; }
[aria-current="page"] { color: var(--accent) !important; font-weight: 600; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* ---------- theme variables ---------- */
:root {
  --bg: #f4f7fa; --bg-alt: #e8eef5; --text: #1a2a3a; --muted: #6b7d8e;
  --border: #d6dde6; --nav-bg: rgba(244,247,250,.92);
  --accent: #4a6fa5; --accent-soft: rgba(74,111,165,.12);
  --heading: "Space Grotesk", system-ui, sans-serif;
  --body:    "DM Sans", system-ui, sans-serif;
  --radius: 10px;
}

/* ---------- moods ---------- */
.mood-warm { --bg:#faf8f4; --bg-alt:#f5f0e8; --text:#3d2b1f; --muted:#8a7e72; --border:#e8e0d4; --nav-bg:rgba(250,248,244,.92); }
.mood-cool { --bg:#f4f7fa; --bg-alt:#e8eef5; --text:#1a2a3a; --muted:#6b7d8e; --border:#d6dde6; --nav-bg:rgba(244,247,250,.92); }
.mood-dark { --bg:#16191d; --bg-alt:#1e2227; --text:#e4e8ed; --muted:#8a95a0; --border:#2c3239; --nav-bg:rgba(22,25,29,.95); }

/* ---------- accents ---------- */
.accent-amber  { --accent:#c8956c; --accent-soft:rgba(200,149,108,.12); }
.accent-forest { --accent:#4a8a6a; --accent-soft:rgba( 74,138,106,.12); }
.accent-slate  { --accent:#4a6fa5; --accent-soft:rgba( 74,111,165,.12); }
.accent-ocean  { --accent:#2e8bb0; --accent-soft:rgba( 46,139,176,.12); }
.accent-berry  { --accent:#8a4a7a; --accent-soft:rgba(138, 74,122,.12); }

/* ---------- fonts ---------- */
.font-serif { --heading:"DM Serif Display",Georgia,serif; --body:"DM Sans",system-ui,sans-serif; }
.font-sans  { --heading:"Space Grotesk",system-ui,sans-serif; --body:"DM Sans",system-ui,sans-serif; }
.font-mono  { --heading:"JetBrains Mono",ui-monospace,monospace; --body:"JetBrains Mono",ui-monospace,monospace; }

/* ---------- base ---------- */
body { background:var(--bg); color:var(--text); font-family:var(--body); line-height:1.6; min-height:100vh; display:flex; flex-direction:column; }
h1,h2,h3 { font-family:var(--heading); font-weight:600; line-height:1.2; margin:0 0 .5em; }
h1 { font-size:clamp(2rem,4.5vw,3.2rem); }
h2 { font-size:clamp(1.4rem,2.5vw,1.9rem); }
h3 { font-size:1.1rem; }
p  { margin:0 0 1em; }
.muted { color:var(--muted); }
.container { max-width:960px; margin:0 auto; padding:0 1.25rem; width:100%; }

/* ---------- header ---------- */
.site-header { background:var(--nav-bg); backdrop-filter:blur(10px); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:10; }
.nav { display:flex; align-items:center; gap:1.5rem; padding:.85rem 1.25rem; }
.brand { font-family:var(--heading); font-size:1.15rem; font-weight:700; flex-shrink:0; }
.links { display:flex; gap:1.25rem; flex:1; }
.links a { color:var(--muted); font-size:.95rem; }
.links a:hover { color:var(--accent); text-decoration:none; }

/* ---------- buttons ---------- */
.btn {
  display:inline-block; padding:.65rem 1.4rem; border-radius:6px;
  background:var(--accent); color:#fff; font-family:var(--body);
  font-weight:600; font-size:.95rem; cursor:pointer; border:none;
  text-decoration:none; transition:opacity .15s;
}
.btn:hover { opacity:.87; text-decoration:none; }
.btn-sm   { padding:.4rem .9rem; font-size:.85rem; }
.btn-outline { background:transparent; color:var(--accent); border:1.5px solid var(--accent); }
.btn-outline:hover { background:var(--accent-soft); }
.btn-disabled { background:var(--bg-alt); color:var(--muted); cursor:default; border:1.5px solid var(--border); }
.btn-disabled:hover { opacity:1; }

/* ---------- hero ---------- */
.hero { padding:4.5rem 0 3.5rem; }
.hero.has-bg { background: linear-gradient(105deg, rgba(15,23,36,0.88) 0%, rgba(15,23,36,0.45) 45%, rgba(15,23,36,0.2) 100%), var(--hero-bg) center / cover no-repeat; }
.hero.has-bg .hero-inner { position: relative; z-index: 1; }
.hero .subtitle { color:var(--muted); font-size:1.15rem; max-width:50ch; margin-bottom:1.5rem; }
.layout-center { text-align:center; }
.layout-center .subtitle { margin-left:auto; margin-right:auto; }
.layout-left   { text-align:left; }

/* ---------- sections ---------- */
.section { padding:2.5rem 0; border-top:1px solid var(--border); }
.section-head { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:1.25rem; }
.section-head h2 { margin:0; }
.link-more { color:var(--accent); font-size:.9rem; }
.page-header { padding:2.5rem 0 1rem; }
.page-header .subtitle { color:var(--muted); font-size:1.05rem; }

/* ---------- course cards (home teaser) ---------- */
.course-grid { display:grid; gap:1rem; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); }
.course-card { border:1px solid var(--border); border-radius:var(--radius); padding:1.1rem 1.25rem; background:var(--bg-alt); display:flex; flex-direction:column; gap:.6rem; }
.course-card.course-full { opacity:.6; }
.course-card-top { display:flex; justify-content:space-between; align-items:flex-start; gap:.5rem; }
.course-name { font-weight:600; font-family:var(--heading); }
.course-meta { display:flex; flex-wrap:wrap; gap:.4rem .8rem; font-size:.85rem; color:var(--muted); }
.course-price { color:var(--text); font-weight:600; }

/* ---------- course table (courses page) ---------- */
.courses-table { display:flex; flex-direction:column; gap:.75rem; }
.course-row { display:grid; grid-template-columns:1fr auto auto; gap:1rem 1.5rem; align-items:center; padding:1.1rem 1.25rem; border:1px solid var(--border); border-radius:var(--radius); background:var(--bg-alt); }
.course-row.course-full { opacity:.55; }
.cr-name { font-weight:600; font-family:var(--heading); margin-bottom:.2rem; }
.cr-desc { font-size:.875rem; color:var(--muted); }
.cr-date { font-weight:500; font-size:.9rem; }
.cr-duration { font-size:.85rem; }
.cr-right { display:flex; flex-direction:column; align-items:flex-end; gap:.4rem; }
.cr-price { font-weight:700; font-size:1rem; }
@media(max-width:680px) { .course-row { grid-template-columns:1fr; } .cr-right { align-items:flex-start; flex-direction:row; flex-wrap:wrap; align-items:center; } }

/* ---------- badges ---------- */
.badge { display:inline-block; padding:.2rem .55rem; border-radius:20px; font-size:.75rem; font-weight:600; white-space:nowrap; }
.badge-ok   { background:#d1fae5; color:#065f46; }
.badge-low  { background:#fef3c7; color:#92400e; }
.badge-full { background:#fee2e2; color:#991b1b; }

/* ---------- packages ---------- */
.package-grid { display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); }
.package-card { border:1px solid var(--border); border-radius:var(--radius); padding:1.5rem; background:var(--bg-alt); display:flex; flex-direction:column; gap:.6rem; position:relative; }
.package-highlight { border-color:var(--accent); background:var(--accent-soft); }
.pkg-tag { position:absolute; top:-11px; left:50%; transform:translateX(-50%); background:var(--accent); color:#fff; font-size:.75rem; font-weight:700; padding:.2rem .7rem; border-radius:20px; white-space:nowrap; }
.pkg-name { font-family:var(--heading); font-size:1.2rem; font-weight:700; }
.pkg-price { font-size:1.6rem; font-weight:700; }
.pkg-orig { color:var(--muted); font-size:.85rem; text-decoration:line-through; }
.pkg-includes { list-style:none; padding:0; margin:.4rem 0 .8rem; font-size:.9rem; display:flex; flex-direction:column; gap:.3rem; }
.pkg-includes li::before { content:"✓ "; color:var(--accent); }

/* ---------- à la carte ---------- */
.ala-carte { border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; }
.ac-row { display:flex; justify-content:space-between; padding:.7rem 1rem; font-size:.9rem; }
.ac-row:nth-child(odd) { background:var(--bg-alt); }
.ac-row span:last-child { font-weight:600; }

/* ---------- booking form ---------- */
.booking-form { max-width:600px; display:flex; flex-direction:column; gap:1.1rem; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; }
@media(max-width:520px) { .form-row { grid-template-columns:1fr; } }
.form-group { display:flex; flex-direction:column; gap:.35rem; }
.form-group label { font-size:.875rem; font-weight:600; }
.form-group input,
.form-group select,
.form-group textarea {
  padding:.6rem .8rem; border:1.5px solid var(--border); border-radius:6px;
  background:var(--bg); color:var(--text); font-family:var(--body); font-size:.95rem;
  transition:border-color .15s;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus { outline:none; border-color:var(--accent); }
.form-group textarea { resize:vertical; min-height:80px; }
.form-footer { display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap; }
.form-note { font-size:.82rem; color:var(--muted); margin:0; }
.required { color:#dc2626; }

/* ---------- alerts ---------- */
.alert { padding:.9rem 1.1rem; border-radius:var(--radius); margin-bottom:1.5rem; font-size:.95rem; }
.alert-success { background:#d1fae5; color:#065f46; border:1px solid #a7f3d0; }
.alert-error   { background:#fee2e2; color:#991b1b; border:1px solid #fca5a5; }
.alert-info    { background:var(--accent-soft); color:var(--text); border:1px solid var(--border); }

/* ---------- contact ---------- */
.contact-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem; margin-top:1rem; }
@media(max-width:500px) { .contact-grid { grid-template-columns:1fr; } }
.contact-grid .label { display:block; color:var(--muted); font-size:.8rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:.2rem; }
.contact-grid a { color:var(--accent); }

/* ---------- about ---------- */
.about { padding:2.5rem 0; border-top:1px solid var(--border); }
.about p { max-width:60ch; color:var(--muted); }

/* ---------- footer ---------- */
.site-footer { margin-top:auto; border-top:1px solid var(--border); padding:1.75rem 0; color:var(--muted); font-size:.875rem; }
.footer-inner { display:flex; gap:2rem; align-items:flex-start; flex-wrap:wrap; }
.footer-inner > div { line-height:1.8; }
.footer-inner a:hover { color:var(--accent); }
.copyright { margin-top:auto; margin-left:auto; }

/* ---------- preview banner ---------- */
.preview-banner { position:sticky; top:0; z-index:20; background:#fde68a; color:#78350f; padding:.65rem 1rem; text-align:center; font-weight:500; border-bottom:2px solid #f59e0b; }
