:root {
  --bg: #f4eee8;
  --paper: #fbf7f2;
  --forest: #0f4943;
  --forest-deep: #0a322e;
  --clay: #a35e57;
  --sand: #ddd4cc;
  --ink: #1d2624;
  --muted: #5d6663;
  --line: rgba(20, 40, 36, 0.12);
  --shadow: 0 30px 60px rgba(8, 25, 22, 0.12);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: "Inter", system-ui, sans-serif; color: var(--ink); background: var(--bg); }
a { color: inherit; text-decoration: none; }
.shell,.shell-wide { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.shell-wide { width: min(1320px, calc(100% - 48px)); }
.site-header { position: sticky; top: 0; z-index: 20; display: flex; justify-content: space-between; align-items: center; padding: 18px 24px; backdrop-filter: blur(14px); background: rgba(244, 238, 232, 0.84); border-bottom: 1px solid rgba(255,255,255,0.28); }
.brand { font-family: "Cormorant Garamond", serif; font-size: 2rem; letter-spacing: 0.08em; text-transform: uppercase; }
.brand span { display: block; font-family: "Inter", sans-serif; font-size: 0.7rem; letter-spacing: 0.45em; margin-top: 3px; }
nav { display: flex; gap: 24px; align-items: center; font-size: 0.96rem; }
.nav-cta { border: 1px solid rgba(15,73,67,.18); padding: 12px 16px; border-radius: 999px; background: rgba(255,255,255,0.6); }
.hero { position: relative; min-height: 94vh; display: grid; align-items: end; overflow: hidden; }
.hero-backdrop { position: absolute; inset: 0; background-image: linear-gradient(180deg, rgba(6,28,25,.26), rgba(6,28,25,.7)), url('assets/hero-court.jpg'); background-size: cover; background-position: center center; }
.hero-content { position: relative; z-index: 1; padding: 120px 0 88px; color: #fff7f0; max-width: 760px; }
.eyebrow { text-transform: uppercase; letter-spacing: .28em; font-size: .76rem; margin: 0 0 18px; opacity: .88; }
h1,h2,h3 { font-family: "Cormorant Garamond", serif; margin: 0; font-weight: 600; }
h1 { font-size: clamp(3.4rem, 7vw, 6rem); line-height: .96; }
h2 { font-size: clamp(2.2rem, 4.2vw, 4rem); line-height: .98; }
h3 { font-size: 2.6rem; }
.lede,p,li { font-size: 1.05rem; line-height: 1.8; }
.hero-actions,.pill-row,.membership-highlights { display: flex; flex-wrap: wrap; gap: 14px; }
.hero-actions { margin-top: 30px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 999px; padding: 14px 22px; font-weight: 600; transition: transform .2s ease, opacity .2s ease; border: 0; cursor: pointer; }
.button:hover { transform: translateY(-1px); }
.button-solid { background: var(--forest); color: #fff; }
.button-ghost { background: rgba(255,255,255,.12); color: #fff; border: 1px solid rgba(255,255,255,.25); }
.button-full { width: 100%; }
.intro,.split-feature,.wellness,.location,.cta,.membership-layout { padding: 96px 0; }
.intro { display: grid; gap: 40px; grid-template-columns: 1.2fr .9fr; align-items: start; }
.intro-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.intro-stats article,.panel-dark,.panel-light,.form-card { border-radius: 28px; box-shadow: var(--shadow); }
.intro-stats article { background: var(--paper); padding: 28px; border: 1px solid var(--line); }
.intro-stats strong { display: block; font-family: "Cormorant Garamond", serif; font-size: 2.8rem; color: var(--forest); }
.story-band,.temperature,.miami { display: grid; grid-template-columns: 1fr 1.15fr; align-items: stretch; gap: 0; margin-bottom: 40px; }
.panel-dark,.panel-light { padding: 60px; display: flex; flex-direction: column; justify-content: center; }
.panel-dark { background: var(--forest-deep); color: #f6efe8; }
.panel-light { background: var(--paper); border: 1px solid var(--line); }
.story-image,.image-card,.wellness-image,.temperature-image,.miami-image,.membership-visual,.location-image { min-height: 420px; border-radius: 28px; background-size: cover; background-repeat: no-repeat; background-position: center center; box-shadow: var(--shadow); }
.story-image { border-radius: 0 28px 28px 0; }
.image-lobby { background-image: url('assets/lobby.jpg'); background-position: center center; }
.image-overhead { background-image: url('assets/overhead-courts.jpg'); background-position: center center; min-height: 640px; }
.temperature-image { background-image: url('assets/player-72.jpg'); background-position: 68% center; min-height: 560px; border-radius: 0 28px 28px 0; }
.temperature-copy { border-radius: 28px 0 0 28px; }
.temperature-badge { font-family: "Cormorant Garamond", serif; font-size: clamp(4rem, 10vw, 7rem); line-height: .8; color: var(--forest); margin-bottom: 16px; }
.wellness-stack { display: grid; gap: 22px; }
.image-spa { background-image: url('assets/spa.jpg'); min-height: 280px; }
.image-gym { background-image: url('assets/gym.jpg'); min-height: 280px; }
.miami-image { background-image: url('assets/club-band.jpg'); background-position: center center; border-radius: 28px 0 0 28px; }
.membership-visual { background-image: linear-gradient(180deg, rgba(10,50,46,.18), rgba(10,50,46,.25)), url('assets/exterior-night.jpg'); background-position: center center; min-height: 320px; margin-top: 28px; }
.location-image-top { background-image: url('assets/exterior-night.jpg'); background-position: center center; }
.location-image-bottom { background-image: url('assets/clay-court.jpg'); background-position: center center; }
.split-feature,.wellness,.location,.membership-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 42px; align-items: center; }
.feature-copy,.wellness-copy,.location-copy,.membership-copy { padding-right: 8px; }
.court-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; margin: 28px 0; }
.court-grid article { background: rgba(255,255,255,.55); border: 1px solid var(--line); border-radius: 24px; padding: 24px; }
.court-grid p,.court-grid h3 { margin: 0; }
.supporting-copy { color: var(--muted); }
ul { padding-left: 20px; }
.location-stack { display: grid; gap: 22px; }
.location-image { min-height: 280px; }
.pill-row span,.membership-highlights span { padding: 10px 14px; border-radius: 999px; background: rgba(15,73,67,.08); border: 1px solid rgba(15,73,67,.1); }
.cta { display: flex; justify-content: space-between; gap: 30px; align-items: center; border-top: 1px solid var(--line); }
.site-footer { padding: 40px 0 60px; display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid var(--line); }
.footer-links { display: flex; gap: 20px; flex-wrap: wrap; align-content: start; }
.form-card { background: var(--paper); padding: 26px; border: 1px solid var(--line); }
.membership-form { display: grid; gap: 16px; }
.membership-form label { display: grid; gap: 8px; font-size: .95rem; color: var(--muted); }
.membership-form input,.membership-form select,.membership-form textarea { width: 100%; border: 1px solid rgba(15,73,67,.14); border-radius: 18px; padding: 14px 16px; font: inherit; background: #fff; color: var(--ink); }
.form-note { font-size: .88rem; color: var(--muted); margin: 0; }
@media (max-width: 980px) {
  nav { gap: 14px; font-size: .9rem; }
  .intro,.split-feature,.wellness,.location,.membership-layout,.story-band,.temperature,.miami,.cta,.site-footer { grid-template-columns: 1fr; display: grid; }
  .site-header { flex-direction: column; gap: 14px; }
  .story-image,.temperature-image,.miami-image,.temperature-copy { border-radius: 28px; }
  .cta { align-items: start; }
}
@media (max-width: 720px) {
  .shell,.shell-wide { width: min(100% - 28px, 1180px); }
  nav { flex-wrap: wrap; justify-content: center; }
  .court-grid,.intro-stats { grid-template-columns: 1fr; }
  .intro,.split-feature,.wellness,.location,.membership-layout { padding: 72px 0; }
  .panel-dark,.panel-light,.form-card { padding: 28px; }
  .hero-content { padding: 92px 0 70px; }
}