/* ============================================================
   MARIA CRISTINA COMAN — Design System v3
   ============================================================ */
:root {
  --gold:      #c8963c;
  --gold-light:#e8b86d;
  --gold-pale: #fdf3e3;
  --green:     #4a9e6b;
  --plum:      #6b5470;

  --bg:        #faf7f2;
  --surface:   #ffffff;
  --surface-2: #f2ede4;
  --border:    #e4dace;

  --text:      #1c1914;
  --text-2:    #3e3529;
  --text-3:    #7a6f60;

  --display: 'Cormorant Garamond', serif;
  --body:    'Mulish', sans-serif;

  --r-sm: 6px; --r-md: 14px; --r-lg: 24px; --r-xl: 48px;
  --sh-sm: 0 2px 12px rgba(0,0,0,.07);
  --sh-md: 0 6px 30px rgba(0,0,0,.11);
  --sh-lg: 0 16px 56px rgba(0,0,0,.14);
  --t: .28s cubic-bezier(.4,0,.2,1);
  --nav-h: 76px;
}

/* ── Reset ───────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html  { scroll-behavior:smooth }
body  { font-family:var(--body); background:var(--bg); color:var(--text); line-height:1.7; font-size:18px; overflow-x:hidden }
img   { max-width:100%; display:block }
a     { text-decoration:none; color:inherit }
button{ cursor:pointer; border:none; background:none; font-family:inherit }
ul,ol { list-style:none }

/* ── Typography ──────────────────────────────────────────── */
h1,h2,h3,h4,h5 { font-family:var(--display); font-weight:500; line-height:1.18; color:var(--text) }
h1 { font-size:clamp(2.8rem,5.5vw,5.2rem); font-weight:400 }
h2 { font-size:clamp(2.1rem,3.8vw,3.4rem); font-weight:400 }
h3 { font-size:clamp(1.5rem,2.4vw,2.1rem); font-weight:400 }
h4 { font-size:1.3rem }
p  { font-size:1.05rem; line-height:1.85; color:var(--text-2) }
strong { font-weight:700 }
.italic { font-style:italic }

/* ── Layout ──────────────────────────────────────────────── */
.container    { width:100%; max-width:1180px; margin:0 auto; padding:0 28px }
.container-sm { max-width:780px; margin:0 auto; padding:0 28px }
.section      { padding:100px 0 }
.section-sm   { padding:68px 0 }

/* ── Navigation ──────────────────────────────────────────── */
.nav {
  position:fixed; top:0; left:0; right:0; height:var(--nav-h);
  z-index:1000; transition:background var(--t), box-shadow var(--t);
}
/* Transparent on homepage hero — JS adds .scrolled when user scrolls */
.nav.solid, .nav.scrolled {
  background:var(--bg);
  box-shadow:0 2px 20px rgba(0,0,0,.08);
}
.nav-inner { display:flex; align-items:center; justify-content:space-between; height:100% }
.nav-logo img { height:46px; width:auto }
.nav-links { display:flex; align-items:center; gap:24px }
.nav-links a {
  font-size:.82rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--text); position:relative; padding:4px 0; transition:color var(--t);
}
.nav-links a::after {
  content:''; position:absolute; bottom:-2px; left:0; right:0; height:2px;
  background:var(--gold); transform:scaleX(0); transition:transform var(--t);
}
.nav-links a:hover, .nav-links a.active { color:var(--gold) }
.nav-links a:hover::after, .nav-links a.active::after { transform:scaleX(1) }
/* CTA button in nav */
.nav-cta {
  background:var(--gold) !important; color:#fff !important;
  padding:11px 22px !important; border-radius:var(--r-xl) !important;
  font-size:.8rem !important; font-weight:700 !important; letter-spacing:.06em !important;
  transition:background var(--t), transform var(--t) !important; white-space:nowrap;
}
.nav-cta::after { display:none !important }
.nav-cta:hover  { background:#a87830 !important; transform:translateY(-1px) !important }
.hamburger { display:none; flex-direction:column; gap:5px; padding:8px; cursor:pointer }
.hamburger span { display:block; width:24px; height:2px; background:var(--text); border-radius:2px; transition:var(--t) }
@media(max-width:920px) {
  .hamburger { display:flex }
  .nav-links {
    position:fixed; top:var(--nav-h); left:0; right:0;
    background:var(--bg); flex-direction:column; align-items:flex-start;
    padding:24px 28px 36px; gap:16px;
    transform:translateY(-110%); transition:transform var(--t);
    box-shadow:var(--sh-md); border-top:1px solid var(--border);
  }
  .nav-links.open { transform:translateY(0) }
  .nav-links a { font-size:1rem }
}

/* ── Buttons ─────────────────────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:15px 34px; border-radius:var(--r-xl);
  font-family:var(--body); font-size:.92rem; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase;
  transition:all var(--t); cursor:pointer; white-space:nowrap; border:2px solid transparent;
}
.btn-primary { background:var(--text); color:#fff; border-color:var(--text) }
.btn-primary:hover { background:var(--gold); border-color:var(--gold); transform:translateY(-2px); box-shadow:0 8px 28px rgba(200,150,60,.35) }
.btn-gold    { background:var(--gold); color:#fff; border-color:var(--gold) }
.btn-gold:hover { background:#a87830; border-color:#a87830; transform:translateY(-2px); box-shadow:0 8px 28px rgba(200,150,60,.35) }
.btn-outline { background:transparent; color:var(--text); border-color:var(--text) }
.btn-outline:hover { background:var(--text); color:#fff; transform:translateY(-2px) }
.btn-outline-gold { background:transparent; color:var(--gold); border-color:var(--gold) }
.btn-outline-gold:hover { background:var(--gold); color:#fff; transform:translateY(-2px) }
.btn-ghost { background:transparent; color:var(--text); border-color:var(--border) }
.btn-ghost:hover { background:var(--surface-2); transform:translateY(-2px) }
.btn-sm  { padding:10px 22px; font-size:.82rem }
.btn-lg  { padding:18px 44px; font-size:1rem }
.btn-danger { background:#fef0f0; color:#c0392b; border:1px solid #f5c6c6; padding:8px 16px; border-radius:var(--r-sm); font-size:.82rem; font-weight:600; cursor:pointer }

/* ── Cards ───────────────────────────────────────────────── */
.card {
  background:var(--surface); border-radius:var(--r-lg);
  padding:40px; box-shadow:var(--sh-sm); border:1px solid var(--border);
  transition:box-shadow var(--t), transform var(--t);
}
.card:hover { box-shadow:var(--sh-md); transform:translateY(-3px) }

/* ── Section label ───────────────────────────────────────── */
.section-label {
  display:inline-flex; align-items:center; gap:10px;
  font-size:.76rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold); margin-bottom:14px;
}
.section-label::before { content:''; width:28px; height:2px; background:var(--gold); flex-shrink:0 }

/* ── Hero ────────────────────────────────────────────────── */
.hero {
  min-height:100vh; display:flex; align-items:center;
  padding-top:var(--nav-h); background:var(--surface-2);
  position:relative; overflow:hidden;
}
.hero::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(ellipse 70% 90% at 75% 40%, rgba(200,150,60,.13) 0%, transparent 60%),
    radial-gradient(ellipse 50% 60% at 10% 70%, rgba(107,84,112,.07) 0%, transparent 55%);
}
.hero-content {
  position:relative; z-index:1;
  display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; padding:72px 0;
}
.hero-eyebrow {
  display:inline-flex; align-items:center; gap:10px;
  font-size:.78rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold); margin-bottom:18px;
}
.hero-eyebrow::before { content:''; width:28px; height:2px; background:var(--gold) }
.hero-text h1 { margin-bottom:20px }
.hero-text p  { font-size:1.15rem; margin-bottom:36px; max-width:460px }
.hero-buttons { display:flex; gap:14px; flex-wrap:wrap }
.hero-image-wrap { position:relative }
.hero-image-wrap::before {
  content:''; position:absolute; inset:-16px;
  background:linear-gradient(135deg, var(--gold-pale), transparent 60%);
  border-radius:var(--r-xl); z-index:0;
}
.hero-image { position:relative; z-index:1; border-radius:var(--r-xl); overflow:hidden; aspect-ratio:4/5 }
.hero-image img { width:100%; height:100%; object-fit:cover; object-position:top }
.hero-stats {
  position:absolute; bottom:-20px; left:-10px; right:-10px;
  display:flex; gap:10px; z-index:2;
}
.hero-stat {
  background:var(--surface); border-radius:var(--r-md); padding:16px 18px;
  text-align:center; flex:1; box-shadow:var(--sh-md); border:1px solid var(--border);
}
.hero-stat-num   { font-family:var(--display); font-size:2rem; font-weight:600; color:var(--gold); line-height:1 }
.hero-stat-label { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--text-3); margin-top:4px }
@media(max-width:920px){
  .hero-content { grid-template-columns:1fr; gap:48px; padding:48px 0 88px }
  .hero-image-wrap { order:-1 }
  .hero-stats { position:static; margin-top:14px }
}

/* ── Page header ─────────────────────────────────────────── */
.page-header {
  background:var(--surface-2); padding:130px 0 72px;
  border-bottom:1px solid var(--border); position:relative; overflow:hidden;
}
.page-header::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 60% 80% at 70% 30%, rgba(200,150,60,.1) 0%, transparent 60%);
}
.page-header-inner { position:relative; z-index:1 }
.page-header h1 { color:var(--text); margin-bottom:14px }
.page-header p  { font-size:1.1rem; max-width:560px; color:var(--text-2) }

/* ── Services ────────────────────────────────────────────── */
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px }
@media(max-width:920px){ .services-grid { grid-template-columns:1fr } }
.service-card { background:var(--surface); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sh-sm); transition:all var(--t); border:1px solid var(--border) }
.service-card:hover { transform:translateY(-6px); box-shadow:var(--sh-lg) }
.service-card-top  { padding:40px 36px 28px }
.service-card-foot { padding:18px 36px 32px; border-top:1px solid var(--border) }
.svc-icon { width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:20px }
.svc-icon-a { background:rgba(200,150,60,.12) }
.svc-icon-b { background:rgba(74,158,107,.12) }
.svc-icon-c { background:rgba(107,84,112,.10) }

/* ── Testimonials slider ─────────────────────────────────── */
/* CRITICAL: wrapper must be block with width set so 100% in slides resolves */
.testimonials-wrap { position:relative; width:100%; overflow:hidden }
.testimonials-track {
  display:flex; width:100%;
  transition:transform .55s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}
.testimonial-slide {
  /* Each slide takes EXACTLY 100% of the wrapper — never shrinks */
  flex:0 0 100%; min-width:100%; width:100%;
  box-sizing:border-box; padding:0 6px;
}
.testimonial-card {
  background:var(--surface); border-radius:var(--r-lg); padding:44px 48px;
  border-left:4px solid var(--gold); box-shadow:var(--sh-sm);
}
.testimonial-text {
  font-family:var(--display); font-size:1.45rem; font-style:italic; font-weight:400;
  color:var(--text); line-height:1.65; margin-bottom:24px;
}
.testimonial-author { font-size:.88rem; font-weight:700; color:var(--gold); text-transform:uppercase; letter-spacing:.12em }
.slider-dots { display:flex; justify-content:center; gap:10px; margin-top:28px }
.slider-dot {
  width:9px; height:9px; border-radius:50%; background:var(--border);
  cursor:pointer; transition:background var(--t), transform var(--t); border:none;
}
.slider-dot.active { background:var(--gold); transform:scale(1.45) }
.slider-arrows { display:flex; justify-content:center; gap:12px; margin-top:20px }
.slider-arrow {
  width:46px; height:46px; border-radius:50%; background:var(--surface);
  border:2px solid var(--border); display:flex; align-items:center; justify-content:center;
  font-size:1.1rem; cursor:pointer; transition:all var(--t); color:var(--text);
}
.slider-arrow:hover { background:var(--gold); border-color:var(--gold); color:#fff }

/* ── About ───────────────────────────────────────────────── */
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start }
@media(max-width:920px){ .about-grid { grid-template-columns:1fr; gap:40px } }
.about-image-wrap { position:relative }
.about-image { border-radius:var(--r-xl); overflow:hidden }
.about-image img { width:100%; aspect-ratio:3/4; object-fit:cover; object-position:top }
.about-badge {
  position:absolute; bottom:28px; right:-16px;
  background:var(--text); color:#fff; border-radius:var(--r-lg);
  padding:22px 26px; text-align:center; box-shadow:var(--sh-md);
}
.about-badge-num  { font-family:var(--display); font-size:2.4rem; font-weight:600; color:var(--gold); line-height:1 }
.about-badge-text { font-size:.72rem; font-weight:700; letter-spacing:.07em; color:rgba(255,255,255,.7); text-transform:uppercase; margin-top:4px }
@media(max-width:920px){ .about-badge { right:0 } }

/* ── Forms ───────────────────────────────────────────────── */
.form-group { margin-bottom:22px }
.form-group label {
  display:block; font-size:.84rem; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; color:var(--text); margin-bottom:9px;
}
.form-control {
  width:100%; padding:15px 18px;
  background:var(--surface); border:2px solid var(--border);
  border-radius:var(--r-md); font-family:var(--body); font-size:1rem;
  color:var(--text); transition:border-color var(--t), box-shadow var(--t); outline:none;
}
.form-control:focus { border-color:var(--gold); box-shadow:0 0 0 4px rgba(200,150,60,.12) }
textarea.form-control { resize:vertical; min-height:130px }
.form-check { display:flex; gap:12px; align-items:flex-start }
.form-check input[type=checkbox] { width:18px; height:18px; flex-shrink:0; accent-color:var(--gold); margin-top:3px }
.form-check label { font-size:.92rem; text-transform:none; letter-spacing:0; font-weight:400; color:var(--text-2) }

/* ── Booking ─────────────────────────────────────────────── */
.booking-wrap { display:grid; grid-template-columns:1fr 1.35fr; gap:52px; align-items:start }
@media(max-width:920px){ .booking-wrap { grid-template-columns:1fr } }
.session-types { display:grid; gap:14px; margin-bottom:28px }
.session-type-card {
  border:2px solid var(--border); border-radius:var(--r-md);
  padding:18px 22px; cursor:pointer; transition:all var(--t);
  display:flex; align-items:center; gap:16px;
}
.session-type-card:hover, .session-type-card.active { border-color:var(--gold); background:var(--gold-pale) }
.svc-type-icon { width:44px; height:44px; border-radius:50%; background:var(--surface-2); display:flex; align-items:center; justify-content:center; font-size:1.2rem; flex-shrink:0 }
.session-type-card h4 { font-size:1rem; margin-bottom:3px }
.session-type-card p  { font-size:.86rem; margin:0 }
.calendar-wrap { background:var(--surface); border-radius:var(--r-lg); padding:32px; box-shadow:var(--sh-sm); border:1px solid var(--border) }
.calendar-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:22px }
.calendar-header h3 { font-size:1.2rem; margin:0 }
.cal-nav { width:36px; height:36px; border-radius:50%; background:var(--surface-2); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background var(--t); border:none; font-size:1rem; color:var(--text) }
.cal-nav:hover { background:var(--border) }
.cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:3px }
.cal-day-label { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; text-align:center; color:var(--text-3); padding:7px 0 }
.cal-day { aspect-ratio:1; display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:.9rem; font-weight:500; transition:all var(--t) }
.cal-day.available { cursor:pointer }
.cal-day.available:hover { background:var(--surface-2) }
.cal-day.today    { background:var(--surface-2); font-weight:700 }
.cal-day.selected { background:var(--gold); color:#fff }
.cal-day.past, .cal-day.empty, .cal-day.weekend { color:var(--border); cursor:default }
.time-slots { margin-top:22px }
.time-slots h4 { margin-bottom:14px; font-size:1rem }
.slot-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px }
.slot { padding:10px; border:2px solid var(--border); border-radius:var(--r-sm); font-size:.84rem; font-weight:600; text-align:center; cursor:pointer; transition:all var(--t) }
.slot:hover:not(.taken) { border-color:var(--gold); background:var(--gold-pale) }
.slot.selected { background:var(--gold); color:#fff; border-color:var(--gold) }
.slot.taken    { background:var(--surface-2); color:var(--text-3); cursor:not-allowed; border-color:var(--border) }
@media(max-width:600px){ .slot-grid { grid-template-columns:repeat(3,1fr) } }

/* ── Dashboard ───────────────────────────────────────────── */
.dashboard-layout { display:grid; grid-template-columns:256px 1fr; min-height:calc(100vh - var(--nav-h)); margin-top:var(--nav-h) }
@media(max-width:1024px){ .dashboard-layout { grid-template-columns:1fr } }
.sidebar { background:var(--surface); border-right:1px solid var(--border); padding:32px 20px; position:sticky; top:var(--nav-h); height:calc(100vh - var(--nav-h)); overflow-y:auto }
@media(max-width:1024px){ .sidebar { position:static; height:auto } }
.sidebar-user { text-align:center; padding-bottom:22px; border-bottom:1px solid var(--border); margin-bottom:20px }
.sidebar-avatar { width:68px; height:68px; border-radius:50%; background:var(--gold-pale); margin:0 auto 12px; display:flex; align-items:center; justify-content:center; font-size:1.8rem; font-family:var(--display); color:var(--gold) }
.sidebar-user h4 { font-size:1.1rem; margin-bottom:4px }
.sidebar-user p  { font-size:.88rem; color:var(--text-3) }
.sidebar-nav a { display:flex; align-items:center; gap:12px; padding:11px 14px; border-radius:var(--r-md); font-size:.92rem; font-weight:600; color:var(--text-2); transition:all var(--t); margin-bottom:3px }
.sidebar-nav a:hover { background:var(--surface-2); color:var(--text) }
.sidebar-nav a.active { background:var(--gold-pale); color:var(--gold) }
.sidebar-nav .nav-icon { font-size:1.1rem; width:22px; text-align:center }
.dashboard-main { padding:40px; background:var(--bg) }
@media(max-width:600px){ .dashboard-main { padding:24px 16px } }
.stats-row { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-bottom:30px }
@media(max-width:900px){ .stats-row { grid-template-columns:repeat(2,1fr) } }
.stat-box { background:var(--surface); border-radius:var(--r-md); padding:24px; box-shadow:var(--sh-sm); border:1px solid var(--border) }
.stat-num   { font-family:var(--display); font-size:2.5rem; font-weight:600; color:var(--gold); line-height:1; margin-bottom:5px }
.stat-label { font-size:.8rem; font-weight:700; color:var(--text-3); text-transform:uppercase; letter-spacing:.08em }
.data-table { background:var(--surface); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sh-sm); border:1px solid var(--border) }
.data-table table { width:100%; border-collapse:collapse }
.data-table th { font-size:.76rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); padding:14px 22px; text-align:left; border-bottom:1px solid var(--border); background:var(--surface-2) }
.data-table td { padding:15px 22px; font-size:.94rem; border-bottom:1px solid var(--surface-2) }
.data-table tr:last-child td { border-bottom:none }
.badge { display:inline-block; padding:4px 11px; border-radius:20px; font-size:.74rem; font-weight:700; letter-spacing:.04em }
.badge-upcoming  { background:rgba(200,150,60,.12); color:#7a5010 }
.badge-completed { background:rgba(74,158,107,.12); color:#2d6b4e }
.badge-cancelled { background:rgba(192,57,43,.08);  color:#7a2d24 }
.badge-free      { background:rgba(107,84,112,.1);  color:var(--plum) }
.meeting-card { background:var(--surface); border-radius:var(--r-lg); padding:26px; display:flex; align-items:center; gap:22px; box-shadow:var(--sh-sm); border:1px solid var(--border); margin-bottom:14px; transition:all var(--t) }
.meeting-card:hover { box-shadow:var(--sh-md) }
.meeting-date-box { background:var(--text); color:#fff; border-radius:var(--r-md); width:62px; text-align:center; padding:10px 6px; flex-shrink:0 }
.meeting-date-day   { font-family:var(--display); font-size:1.8rem; line-height:1 }
.meeting-date-month { font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; opacity:.75 }
.meeting-info   { flex:1 }
.meeting-info h4{ font-size:1.05rem; margin-bottom:4px }
.meeting-info p { font-size:.9rem; margin:0 }

/* ── Alerts ──────────────────────────────────────────────── */
.alert { padding:16px 20px; border-radius:var(--r-md); font-size:.98rem; font-weight:500; display:flex; align-items:flex-start; gap:12px; margin-bottom:20px }
.alert-info    { background:rgba(200,150,60,.1);  color:#6b4a10; border-left:4px solid var(--gold) }
.alert-success { background:rgba(74,158,107,.1);  color:#1e5c3a; border-left:4px solid var(--green) }
.alert-warning { background:rgba(200,150,60,.12); color:#7a4f10; border-left:4px solid var(--gold-light) }
.alert-error   { background:rgba(192,57,43,.08);  color:#7a2d24; border-left:4px solid #c0392b }

/* ── Highlight / CTA box ─────────────────────────────────── */
.highlight-box {
  background:var(--text); border-radius:var(--r-xl); padding:64px;
  color:#fff; text-align:center; position:relative; overflow:hidden;
}
.highlight-box::before {
  content:''; position:absolute; top:-60px; right:-60px;
  width:240px; height:240px; border-radius:50%; background:rgba(200,150,60,.14); pointer-events:none;
}
.highlight-box h2 { color:#fff; margin-bottom:14px }
.highlight-box p  { color:rgba(255,255,255,.75); margin-bottom:32px; font-size:1.1rem }
@media(max-width:600px){ .highlight-box { padding:44px 26px } }

/* ── Footer ──────────────────────────────────────────────── */
.footer { background:var(--text); color:rgba(255,255,255,.65); padding:80px 0 40px }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:48px; padding-bottom:56px; border-bottom:1px solid rgba(255,255,255,.1) }
@media(max-width:920px){ .footer-grid { grid-template-columns:1fr 1fr } }
@media(max-width:600px){ .footer-grid { grid-template-columns:1fr } }
.footer h4 { color:#fff; font-size:.78rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; margin-bottom:18px; font-family:var(--body) }
.footer-links a { display:block; font-size:.92rem; color:rgba(255,255,255,.6); margin-bottom:10px; transition:color var(--t) }
.footer-links a:hover { color:var(--gold) }
.footer-logo img { height:46px; filter:brightness(10); opacity:.85; margin-bottom:16px }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; padding-top:28px; font-size:.84rem }
.footer-bottom a { color:var(--gold) }
@media(max-width:600px){ .footer-bottom { flex-direction:column; gap:12px; text-align:center } }

/* ── Contact ─────────────────────────────────────────────── */
.contact-grid { display:grid; grid-template-columns:1fr 1.4fr; gap:72px; align-items:start }
@media(max-width:920px){ .contact-grid { grid-template-columns:1fr; gap:40px } }
.contact-info-item { display:flex; gap:16px; margin-bottom:26px }
.contact-info-icon { width:48px; height:48px; border-radius:var(--r-md); background:var(--gold-pale); display:flex; align-items:center; justify-content:center; font-size:1.2rem; flex-shrink:0 }
.contact-info-text h4 { font-size:.86rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; margin-bottom:3px }
.contact-info-text p  { font-size:.94rem; margin:0 }

/* ── Tab switcher ────────────────────────────────────────── */
.tab-switcher { display:flex; background:var(--surface-2); border-radius:var(--r-xl); padding:4px; margin-bottom:30px }
.tab-btn { flex:1; padding:12px; border-radius:var(--r-xl); font-weight:700; font-size:.88rem; letter-spacing:.05em; transition:all var(--t); background:transparent; color:var(--text-3); border:none; cursor:pointer }
.tab-btn.active { background:var(--surface); color:var(--text); box-shadow:var(--sh-sm) }

/* ── Blog ────────────────────────────────────────────────── */
.blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:30px }
@media(max-width:920px){ .blog-grid { grid-template-columns:1fr } }
.blog-card { background:var(--surface); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sh-sm); transition:all var(--t); border:1px solid var(--border) }
.blog-card:hover { transform:translateY(-4px); box-shadow:var(--sh-md) }
.blog-card-img { height:180px; background:var(--surface-2); overflow:hidden; display:flex; align-items:center; justify-content:center }
.blog-card-img img { width:100%; height:100%; object-fit:cover }
.blog-card-body { padding:28px }
.blog-cat { font-size:.74rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); margin-bottom:10px }
.blog-card h3 { font-size:1.2rem; margin-bottom:10px; line-height:1.35 }
.blog-card h3 a { color:var(--text); transition:color var(--t) }
.blog-card h3 a:hover { color:var(--gold) }
.blog-card p { font-size:.92rem; margin-bottom:18px }
.read-more { font-size:.82rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--text); display:inline-flex; align-items:center; gap:6px; transition:gap var(--t),color var(--t) }
.read-more:hover { color:var(--gold); gap:10px }

/* ── Turnstile placeholder (shown when key not configured) ── */
.turnstile-placeholder { background:var(--surface-2); border:2px dashed var(--border); border-radius:var(--r-md); padding:16px 20px; font-size:.84rem; color:var(--text-3); margin-bottom:16px }

/* ── Utilities ───────────────────────────────────────────── */
.divider     { height:1px; background:var(--border); margin:28px 0 }
.text-center { text-align:center }
.text-gold   { color:var(--gold) }
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:28px }
@media(max-width:700px){ .grid-2 { grid-template-columns:1fr } }
.mt-8{margin-top:8px} .mt-16{margin-top:16px} .mt-24{margin-top:24px} .mt-32{margin-top:32px} .mt-48{margin-top:48px}
.mb-8{margin-bottom:8px} .mb-16{margin-bottom:16px} .mb-24{margin-bottom:24px} .mb-32{margin-bottom:32px} .mb-48{margin-bottom:48px}
.animate-up { opacity:0; transform:translateY(26px); transition:opacity .65s ease,transform .65s ease }
.animate-up.visible { opacity:1; transform:translateY(0) }
.d1{transition-delay:.08s} .d2{transition-delay:.16s} .d3{transition-delay:.24s}

/* ── Loader ──────────────────────────────────────────────── */
.page-loader { position:fixed; inset:0; background:var(--text); display:flex; align-items:center; justify-content:center; z-index:9999; transition:opacity .45s ease,visibility .45s ease }
.page-loader.hidden { opacity:0; visibility:hidden; pointer-events:none }
.loader-logo { height:54px; filter:brightness(10); animation:pulse 1.4s ease-in-out infinite }
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.55;transform:scale(.95)} }

@media(max-width:600px){
  .section { padding:64px 0 }
  h1 { font-size:2.4rem }
  h2 { font-size:2rem }
  .card { padding:26px }
  .stats-row { grid-template-columns:1fr 1fr }
}