/* Ember Studio — Local yoga studio landing page
 * Warm, earthy, editorial. Cormorant Garamond + DM Sans.
 * Color: warm cream bg, terracotta/sage accents, natural textures.
 */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=DM+Sans:wght@300;400;500&display=swap');

:root {
  --e-bg:        #f8f4ef;
  --e-bg-warm:   #f2ece3;
  --e-bg-card:   #ede8e1;
  --e-border:    rgba(120,90,60,0.12);
  --e-terra:     #c38b64;
  --e-terra-mid: #8b5e3c;
  --e-sage:      #7c9e8f;
  --e-ink:       #2a2420;
  --e-ink-mid:   #5a4f47;
  --e-ink-faint: #9e9188;
  --e-font-ser:  'Cormorant Garamond', Georgia, serif;
  --e-font-sans: 'DM Sans', sans-serif;
  --r:           8px;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { font-size:16px; scroll-behavior:smooth; }
body {
  background: var(--e-bg);
  color: var(--e-ink);
  font-family: var(--e-font-sans);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { text-decoration:none; color:inherit; }

/* ── NAV ──────────────────────────────────────────────── */
.e-nav {
  position:sticky; top:0; z-index:100;
  background:rgba(248,244,239,0.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--e-border);
}
.e-nav-inner {
  max-width:1100px; margin:0 auto; padding:0 2rem;
  display:flex; align-items:center; justify-content:space-between;
  height:64px;
}
.e-logo {
  font-family:var(--e-font-ser); font-size:1.4rem;
  font-weight:400; letter-spacing:0.06em;
  color:var(--e-ink); text-transform:lowercase;
}
.e-logo span { color:var(--e-terra); font-style:italic; }
.e-nav-links { display:flex; align-items:center; gap:2rem; }
.e-nav-links a {
  font-size:0.875rem; font-weight:400; color:var(--e-ink-mid);
  transition:color 0.2s; letter-spacing:0.04em;
}
.e-nav-links a:hover { color:var(--e-ink); }
.e-nav-cta {
  background:var(--e-terra) !important; color:#fff !important;
  padding:0.5rem 1.2rem; border-radius:100px;
  font-size:0.85rem; font-weight:500;
  transition:background 0.2s;
}
.e-nav-cta:hover { background:var(--e-terra-mid) !important; }

/* ── HERO ─────────────────────────────────────────────── */
.e-hero {
  position:relative; overflow:hidden;
  min-height:90vh; display:flex; align-items:center;
  padding:4rem 2rem;
}
.e-hero-texture {
  position:absolute; inset:0; pointer-events:none; opacity:0.4;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(195,139,100,0.12) 0%, transparent 60%),
    radial-gradient(circle at 80% 70%, rgba(124,158,143,0.1) 0%, transparent 60%);
}
.e-hero-inner {
  max-width:1100px; margin:0 auto; width:100%;
  display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center;
}
.e-hero-tag {
  font-size:0.78rem; font-weight:500; letter-spacing:0.16em;
  text-transform:uppercase; color:var(--e-terra);
  margin-bottom:1.25rem;
}
.e-headline {
  font-family:var(--e-font-ser);
  font-size:clamp(3rem,6vw,5rem);
  font-weight:300; line-height:1.05;
  letter-spacing:-0.01em; margin-bottom:1.5rem;
  color:var(--e-ink);
}
.e-headline em {
  font-style:italic; color:var(--e-terra);
  font-weight:300;
}
.e-sub {
  font-size:1.05rem; color:var(--e-ink-mid);
  line-height:1.8; max-width:420px;
  margin-bottom:2.25rem;
}
.e-hero-actions { display:flex; align-items:center; gap:1.25rem; flex-wrap:wrap; margin-bottom:3rem; }
.e-btn-primary {
  background:var(--e-terra); color:#fff;
  padding:0.7rem 1.75rem; border-radius:100px;
  font-size:0.9rem; font-weight:500;
  transition:background 0.2s, transform 0.2s;
}
.e-btn-primary:hover { background:var(--e-terra-mid); transform:translateY(-1px); }
.e-btn-text {
  font-size:0.9rem; color:var(--e-ink-mid);
  transition:color 0.2s;
}
.e-btn-text:hover { color:var(--e-ink); }
.e-hero-stats {
  display:flex; align-items:center; gap:2rem;
}
.e-stat { display:flex; flex-direction:column; }
.e-stat-num {
  font-family:var(--e-font-ser); font-size:2.25rem;
  font-weight:300; color:var(--e-ink); line-height:1;
}
.e-stat-label { font-size:0.75rem; color:var(--e-ink-faint); margin-top:3px; letter-spacing:0.06em; }
.e-stat-divider { width:1px; height:40px; background:var(--e-border); }

/* ── HERO PHOTO ───────────────────────────────────────── */
.e-hero-photo { position:relative; }
.e-photo-frame {
  background: linear-gradient(135deg, var(--e-bg-warm) 0%, var(--e-bg-card) 100%);
  border:1px solid var(--e-border);
  border-radius:24px; overflow:hidden;
  aspect-ratio:4/5; position:relative;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 8px 16px 48px rgba(42,36,32,0.1);
}
.e-photo-placeholder {
  display:flex; align-items:center; justify-content:center;
  width:100%; height:100%;
}
.e-pose-svg {
  width:60%; height:auto; opacity:0.6;
}
.e-photo-tag {
  position:absolute; bottom:20px; left:20px; right:20px;
  background:rgba(248,244,239,0.92);
  backdrop-filter:blur(8px);
  border-radius:12px; padding:12px 16px;
  display:flex; justify-content:space-between; align-items:center;
}
.e-photo-tag span { font-size:0.875rem; font-weight:500; color:var(--e-ink); }
.e-ptag-time { font-size:0.78rem; color:var(--e-terra); }

/* ── SCHEDULE ─────────────────────────────────────────── */
.e-schedule {
  background:var(--e-bg-warm);
  border-top:1px solid var(--e-border);
  border-bottom:1px solid var(--e-border);
}
.e-schedule-inner { max-width:1100px; margin:0 auto; padding:4rem 2rem; }
.e-section-label {
  font-size:0.72rem; font-weight:500; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--e-terra);
  display:block; margin-bottom:1.75rem;
}
.e-schedule-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; margin-bottom:2rem; }
.e-sched-day { }
.e-day-label {
  font-size:0.7rem; font-weight:500; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--e-ink-faint);
  display:block; padding-bottom:0.75rem;
  border-bottom:2px solid var(--e-terra); margin-bottom:1rem;
}
.e-sched-slot {
  padding:0.75rem; border-radius:var(--r);
  margin-bottom:0.5rem; border:1px solid var(--e-border);
  background:var(--e-bg); cursor:pointer;
  transition:border-color 0.2s, background 0.2s;
}
.e-sched-slot:hover { border-color:var(--e-terra); background:var(--e-bg-warm); }
.e-sched-slot.full { opacity:0.55; cursor:default; }
.e-slot-time {
  display:block; font-size:0.7rem; font-weight:500;
  color:var(--e-ink-faint); letter-spacing:0.04em;
}
.e-slot-name {
  display:block; font-size:0.875rem; font-weight:500;
  color:var(--e-ink); margin:2px 0;
}
.e-slot-spots { font-size:0.72rem; color:var(--e-sage); font-weight:500; }
.e-full { color:var(--e-ink-faint) !important; }
.e-full-schedule {
  font-size:0.875rem; color:var(--e-terra);
  font-weight:500; transition:opacity 0.2s;
}
.e-full-schedule:hover { opacity:0.75; }

/* ── CLASSES + TESTIMONIALS ───────────────────────────── */
.e-section-inner { max-width:1100px; margin:0 auto; padding:6rem 2rem; }
.e-section-heading {
  font-family:var(--e-font-ser);
  font-size:clamp(2rem,4vw,3rem);
  font-weight:300; line-height:1.15;
  letter-spacing:-0.01em; margin-bottom:2.5rem;
}
.e-classes-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.e-class-card {
  border-radius:16px; overflow:hidden;
  border:1px solid var(--e-border);
  background:var(--e-bg);
  transition:transform 0.25s, box-shadow 0.25s;
}
.e-class-card:hover { transform:translateY(-4px); box-shadow:0 12px 32px rgba(42,36,32,0.1); }
.e-class-color { height:110px; }
.e-class-body { padding:1.25rem 1.5rem 1.75rem; }
.e-class-body h3 {
  font-family:var(--e-font-ser); font-size:1.35rem;
  font-weight:400; margin-bottom:0.35rem;
}
.e-class-meta {
  display:flex; gap:1rem;
  font-size:0.75rem; font-weight:500; letter-spacing:0.06em;
  text-transform:uppercase; color:var(--e-ink-faint);
  margin-bottom:0.75rem;
}
.e-class-body p { font-size:0.875rem; color:var(--e-ink-mid); line-height:1.7; }

/* ── TESTIMONIALS ─────────────────────────────────────── */
.e-testimonials { background:var(--e-bg-warm); border-top:1px solid var(--e-border); border-bottom:1px solid var(--e-border); }
.e-testi-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
.e-testi {
  background:var(--e-bg); border:1px solid var(--e-border);
  border-radius:16px; padding:2rem;
}
.e-testi p {
  font-family:var(--e-font-ser); font-size:1.15rem;
  font-weight:300; line-height:1.7; font-style:italic;
  color:var(--e-ink); margin-bottom:1.25rem;
}
.e-testi footer { font-size:0.8rem; color:var(--e-terra); font-weight:500; }

/* ── MEMBERSHIP ───────────────────────────────────────── */
.e-membership-sub {
  font-size:1rem; color:var(--e-ink-mid); max-width:480px;
  margin-bottom:2.5rem; line-height:1.75;
}
.e-plans { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.e-plan {
  background:var(--e-bg-warm); border:1px solid var(--e-border);
  border-radius:16px; padding:1.75rem; position:relative;
  transition:border-color 0.2s;
}
.e-plan.featured { border-color:var(--e-terra); }
.e-plan-badge {
  position:absolute; top:-12px; left:50%; transform:translateX(-50%);
  background:var(--e-terra); color:#fff;
  font-size:0.7rem; font-weight:600; padding:3px 10px;
  border-radius:100px; white-space:nowrap; letter-spacing:0.06em;
}
.e-plan-name {
  font-size:0.75rem; font-weight:500; text-transform:uppercase;
  letter-spacing:0.12em; color:var(--e-ink-faint); margin-bottom:0.75rem;
}
.e-plan-price {
  font-family:var(--e-font-ser); font-size:2.5rem;
  font-weight:300; color:var(--e-ink); line-height:1; margin-bottom:0.5rem;
}
.e-plan-price span { font-size:1rem; color:var(--e-ink-faint); }
.e-plan p { font-size:0.85rem; color:var(--e-ink-mid); margin-bottom:1.5rem; line-height:1.65; }
.e-btn-plan {
  display:block; text-align:center;
  padding:0.6rem 1rem; border-radius:100px;
  font-size:0.875rem; font-weight:500;
  border:1px solid var(--e-terra); color:var(--e-terra);
  transition:all 0.2s;
}
.e-btn-plan:hover { background:var(--e-terra); color:#fff; }
.e-btn-plan.solid { background:var(--e-terra); color:#fff; }
.e-btn-plan.solid:hover { background:var(--e-terra-mid); }

/* ── FOOTER ───────────────────────────────────────────── */
.e-footer {
  background:var(--e-ink); color:var(--e-bg);
  padding:3rem 2rem;
}
.e-footer-inner { max-width:1100px; margin:0 auto; }
.e-footer .e-logo { color:var(--e-bg); margin-bottom:0.75rem; }
.e-footer .e-logo span { color:var(--e-terra); }
.e-address {
  font-style:normal; font-size:0.875rem;
  color:rgba(248,244,239,0.5); line-height:1.65;
  margin-bottom:1.5rem;
}
.e-footer-copy {
  font-size:0.78rem; color:rgba(248,244,239,0.3);
}
.e-footer-copy a { color:var(--e-terra); text-decoration:none; }

/* ── RESPONSIVE ───────────────────────────────────────── */
@media (max-width:900px) {
  .e-hero-inner { grid-template-columns:1fr; }
  .e-hero-photo { display:none; }
  .e-schedule-grid { grid-template-columns:1fr 1fr; }
  .e-classes-grid { grid-template-columns:1fr; }
  .e-testi-grid { grid-template-columns:1fr; }
  .e-plans { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .e-schedule-grid { grid-template-columns:1fr; }
  .e-nav-links a:not(.e-nav-cta) { display:none; }
}