/* A focused typography and section-edge study on the restored Gymnos layout. */
@font-face {
  font-family: 'Barlow Gymnos';
  src: url('./assets/fonts/Barlow-Regular.woff') format('woff');
  font-style: normal; font-weight: 400; font-display: swap;
}
@font-face {
  font-family: 'Barlow Gymnos';
  src: url('./assets/fonts/Barlow-SemiBold.woff') format('woff');
  font-style: normal; font-weight: 600; font-display: swap;
}
@font-face {
  font-family: 'Barlow Gymnos';
  src: url('./assets/fonts/Barlow-Bold.woff') format('woff');
  font-style: normal; font-weight: 700 900; font-display: swap;
}
@font-face {
  font-family: 'Barlow Gymnos Display';
  src: url('./assets/fonts/BarlowSemiCondensed-ExtraBold.woff') format('woff');
  font-style: normal; font-weight: 700 900; font-display: swap;
}
@font-face {
  font-family: 'Barlow Gymnos Display';
  src: url('./assets/fonts/BarlowSemiCondensed-ExtraBoldItalic.woff') format('woff');
  font-style: italic; font-weight: 700 900; font-display: swap;
}
:root {
  --display: 'Barlow Gymnos Display', 'Arial Narrow', sans-serif;
  --sans: 'Barlow Gymnos', Arial, sans-serif;
  --turn-action: 14px;
  --turn-card: 32px;
  --turn-section: 90px;
  --turn-contact: 130px;
}
body { font-kerning: normal; }
.hero h1 { letter-spacing: -.025em; line-height: .94; }
.hero h1 em,.section-title em,.place-copy h2 em,.contact-section h2 em {
  font-style: italic;
}
.section-title,.place-copy h2,.hours-section h2,.contact-section h2 {
  letter-spacing: -.025em; line-height: .94;
}
.route-overlay h3,.activity-feature-title,.services-heading,.included h3 {
  letter-spacing: -.02em; line-height: .96;
}
.activity-trigger strong { letter-spacing: -.015em; }
.hero-photo-tag b { letter-spacing: -.035em; }
.hero-visual-bottom span { letter-spacing: -.015em; line-height: .94; }
.price-feature strong,.hours-art-number { letter-spacing: -.025em; }
.schedule-panel-head h3 { letter-spacing: -.02em; line-height: .96; }

/* The club and its training choices share one continuous dark surface. */
main { background: #1d281c; }
.promise-band { border-bottom: 0; }
.routes-section { background: var(--ink); }

/* A raised ledge introduces activities without clipping any content. */
.activities-section { position: relative; background: #f5f2e9; }
.activities-section::before {
  content: ''; position: absolute; left: 0; right: 0; top: -59px;
  height: 60px; background: #f5f2e9; pointer-events: none;
  clip-path: polygon(0 100%, 0 60%, 54% 60%, calc(54% + 36px) 0, 100% 0, 100% 100%);
}
.activities-section .section-topline { border-top: 0; }

/* Hours sit inside a shaped panel on the same canvas as prices. */
.hours-section { background: #f5f2e9; isolation: isolate; }
.hours-section::before {
  content: ''; position: absolute; z-index: -1;
  inset: 0 clamp(0px, 1.2vw, 24px);
  background: #a8b75f; border-radius: var(--turn-section) 0 var(--turn-section) 0;
  pointer-events: none;
}
.pricing-section { background: #f5f2e9; }
.pricing-section .section-topline { border-top: 0; }

/* A broad turn brings the gallery into contact; only the surface is rounded. */
.contact-section { border-top-left-radius: var(--turn-contact); }

/* The same opposing corners scale from section surfaces to cards and actions. */
.button,.hero .button-dark,.site-nav .nav-cta {
  border-radius: var(--turn-action) 0 var(--turn-action) 0;
}
.route,.activity-feature,.price-feature,.contact-card,.hours-art {
  border-radius: var(--turn-card) 0 var(--turn-card) 0;
}
.activity-feature-art { border-bottom-right-radius: var(--turn-card); }

@media (max-width: 980px) {
  .activity-list .activity-item { border-radius: 24px 0 24px 0; }
  .activity-inline-photo { border-bottom-right-radius: 23px; overflow: hidden; }
}

@media (max-width: 760px) {
  :root {
    --turn-action: 12px;
    --turn-card: 26px;
    --turn-section: 52px;
    --turn-contact: 64px;
  }
  .activities-section::before {
    top: -31px; height: 32px;
    clip-path: polygon(0 100%, 0 60%, 52% 60%, calc(52% + 20px) 0, 100% 0, 100% 100%);
  }
  .hours-section::before { inset-inline: 0; }
  .hero h1 { line-height: .95; }
  .contact-section h2 em { white-space: normal; }
  .filter { font-size: 11px; }
  .price-feature strong small { display: inline-block; white-space: nowrap; }
  html[lang="es"] .hours-section h2,
  html[lang="es"] .pricing-section .section-title { font-size: clamp(41px, 12vw, 67px); }
}
