/* ============================================================================
   CONCEPT 2 — "The Move, Refined" : Tracy's dark editorial look, sharpened.
   Same moody near-black + gold world as concept 1, but a designer has been over it: a
   crisper true-black, a lighter and larger display, uppercase letter-spaced section
   headings each finished with a short centred gold rule, a hairline under the header,
   more generous vertical rhythm, and a calmer button. Standalone (layered over style.css).
   ---------------------------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Jost:wght@300;400;500&display=swap');

:root {
  --light: #0e0d0b !important;      /* crisper, cooler near-black */
  --ink: #ede7db !important;
  --muted: #a49a86 !important;
  --accent: #cda85a !important;     /* champagne gold */
  --accent-strong: #cda85a !important;
  --line: rgba(255, 255, 255, .10) !important;
  --heading-font: 'Cormorant Garamond', Didot, 'Playfair Display', Georgia, serif !important;
  --body-font: 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

body { background: var(--light); color: var(--ink); letter-spacing: .2px; }

/* Lighter, larger display; airy line-height */
h1, h2, h3 { font-weight: 400; }
.hero.has-image { padding: 150px 24px; }
.hero h1 { font-size: 58px; font-weight: 300; letter-spacing: 1px; line-height: 1.12; }
.hero p { font-size: 18px; letter-spacing: .3px; }

/* Headings -> cream */
h1, h2, h3,
.hero h1, .intro h2, .services h2, .gallery h2, .card h3, .feature-text h2, .contact h2,
.founder-text h2, .quote blockquote, .stats h2, .shop h2, .shop-title,
.blog-index h2, .article-wrap h1, .article-wrap h2 { color: #f4efe2; }
a { color: var(--ink); }

/* Signature refinement: uppercase, letter-spaced section headings with a centred gold rule */
.services h2, .gallery h2, .shop h2, .stats h2 {
  text-transform: uppercase; letter-spacing: 5px; font-size: 20px; font-weight: 400;
  padding-bottom: 18px; margin-bottom: 34px; position: relative;
}
.services h2::after, .gallery h2::after, .shop h2::after, .stats h2::after {
  content: ""; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
  width: 46px; height: 1px; background: var(--accent);
}
.feature-text h2 { font-size: 34px; }

/* Nav: uppercase, wide tracking, hairline under the whole header */
.site-header { padding: 26px 24px; border-bottom: 1px solid rgba(255,255,255,.08); max-width: none; }
.site-header, .cta-band, .hero.split { padding-left: max(24px, 5vw); padding-right: max(24px, 5vw); }
.nav a { text-transform: uppercase; letter-spacing: 2px; font-size: 12px; color: #cfc7b6; }
.nav a:hover, .nav a.active { color: var(--accent); }
.kicker, .quote cite, .shop-tag { color: var(--accent); letter-spacing: 3px; }

/* Logo */
.logo.logo-img img { height: 58px; width: auto; display: block; }

/* Dark bands -> pure-ish black */
.site-footer, .cta-band, .stats-band { background: #070605; }
.services, .shop { background: transparent; }

/* Cards: flat, hairline, with a thin gold top accent on hover */
.card, .shop-card, .post-card {
  background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.10); border-radius: 4px;
}
.shop-card { border-radius: 4px; }
.card:hover, .shop-card:hover { border-color: rgba(205,168,90,.5); }
.card p, .founder-text p, .feature-text p, .intro p, .section-sub, .shop-desc,
.contact p, .quote cite { color: #bcb2a0; }

/* Buttons: quiet outline-to-fill gold */
.btn, .shop-btn, .nav-cta {
  background: transparent; color: var(--accent) !important; border: 1px solid var(--accent);
  border-radius: 2px; letter-spacing: 1.5px; text-transform: uppercase; font-size: 12.5px;
}
.btn { padding: 14px 30px; }
.btn:hover, .shop-btn:hover, .nav-cta:hover { background: var(--accent); color: #0e0d0b !important; }
.cta-band .btn:hover { background: #fff; color: #0e0d0b !important; border-color: #fff; }
.btn-ghost { color: #f4efe2 !important; border-color: rgba(255,255,255,.5); }

/* Heroes: refined gradient, cream copy */
.hero.has-image::before { background: linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.72) 100%); }
.hero.has-image h1 { font-weight: 300; }

/* Stat band numbers keep the serif; refine spacing */
.stat-num { color: #f4efe2; font-weight: 500; }
.stat-lab { letter-spacing: .5px; }
.stat-ic { color: var(--accent); }

/* Footer */
.site-footer, .site-footer .fmeta, .site-footer .fcontact, .site-footer .fnav a { color: #bcb2a0; }
.site-footer .fname { color: #f4efe2; letter-spacing: 2px; }

/* Shop specifics */
.shop-price { color: #f4efe2; }
.shop-note { background: rgba(255,255,255,.03); border-color: rgba(255,255,255,.10); color: #bcb2a0; }
.shop-badge { background: rgba(205,168,90,.92); color: #0e0d0b; letter-spacing: 1.5px; }
.contact .details, .contact .details a { color: var(--ink); }

@media (max-width: 640px) {
  .hero h1 { font-size: 40px; }
  .site-header { flex-direction: column; gap: 14px; }
}