/* ============================================
   Garden Sporting Center — Homepage
   Brand: Poppins type, green palette
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

:root {
  /* Brand palette (from Brand Guidelines v1.0) */
  --gsc-dark:   #12332C;  /* Pantone 627 C */
  --gsc-mid:    #026747;  /* Pantone 342 C */
  --gsc-bright: #4AB278;  /* Pantone 7723 C */
  --gsc-soft:   #BCDDC5;  /* Pantone 566 C */

  /* Warm neutrals (caldo & familiare) */
  --paper:    #FAF7F2;    /* warm off-white */
  --paper-2:  #F2EDE3;    /* warm sand */
  --ink:      #12332C;
  --ink-soft: #41544D;
  --ink-mute: #7A8985;
  --hairline: rgba(18, 51, 44, 0.12);

  /* Surfaces */
  --surface:    #FFFFFF;
  --surface-2:  var(--paper);

  /* Type scale */
  --fs-display: clamp(48px, 6.5vw, 96px);
  --fs-h1: clamp(40px, 4.6vw, 72px);
  --fs-h2: clamp(32px, 3.4vw, 52px);
  --fs-h3: clamp(22px, 1.8vw, 28px);
  --fs-body: 17px;
  --fs-small: 14px;

  /* Spacing */
  --pad-page: clamp(24px, 5vw, 80px);
  --r-sm: 10px;
  --r-md: 18px;
  --r-lg: 28px;
  --r-xl: 40px;

  --shadow-soft: 0 1px 2px rgba(18,51,44,.04), 0 8px 24px rgba(18,51,44,.06);
  --shadow-lift: 0 1px 2px rgba(18,51,44,.06), 0 18px 50px rgba(18,51,44,.12);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: 'Poppins', system-ui, sans-serif;
  font-size: var(--fs-body);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-wrap: pretty;
}

img { max-width: 100%; display: block; }

a { color: inherit; text-decoration: none; }

h1, h2, h3, h4 {
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.05;
  margin: 0;
  text-wrap: balance;
}

p { margin: 0; }

/* ============================================
   Buttons
   ============================================ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 24px;
  border-radius: 999px;
  font-weight: 500;
  font-size: 15px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease;
  white-space: nowrap;
}
.btn-primary {
  background: var(--gsc-dark);
  color: #fff;
}
.btn-primary:hover { background: var(--gsc-mid); transform: translateY(-1px); }
.btn-bright {
  background: var(--gsc-bright);
  color: var(--gsc-dark);
}
.btn-bright:hover { background: #3ea069; transform: translateY(-1px); }
.btn-ghost {
  background: transparent;
  color: var(--gsc-dark);
  border-color: var(--gsc-dark);
}
.btn-ghost:hover { background: var(--gsc-dark); color: #fff; }
.btn-light {
  background: rgba(255,255,255,.95);
  color: var(--gsc-dark);
  backdrop-filter: blur(8px);
}
.btn-light:hover { background: #fff; }
.btn-on-dark {
  background: #fff; color: var(--gsc-dark);
}
.btn-on-dark:hover { background: var(--gsc-soft); }

.btn .arrow { font-size: 18px; transition: transform .25s ease; }
.btn:hover .arrow { transform: translateX(4px); }

/* ============================================
   Generic
   ============================================ */
.eyebrow {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gsc-mid);
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.eyebrow::before {
  content: "";
  width: 24px;
  height: 1px;
  background: var(--gsc-mid);
}

.section-pad {
  padding-left: var(--pad-page);
  padding-right: var(--pad-page);
}

/* Reveal on scroll — disabled inside DesignCanvas; show immediately */
.reveal {
  opacity: 1;
  transform: none;
  transition: opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1);
}
.reveal.in {
  opacity: 1;
  transform: none;
}

/* ============================================
   Image placeholder (warm, brand-toned)
   ============================================ */
.ph {
  position: relative;
  background: linear-gradient(135deg, var(--gsc-soft) 0%, #d8eadc 60%, #c2dcc8 100%);
  overflow: hidden;
  border-radius: var(--r-md);
}
.ph::before {
  content: "";
  position: absolute; inset: 0;
  background-image:
    repeating-linear-gradient(135deg, rgba(18,51,44,.04) 0 2px, transparent 2px 14px);
  pointer-events: none;
}
.ph::after {
  content: attr(data-label);
  position: absolute;
  inset: auto 16px 14px 16px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gsc-dark);
  opacity: .5;
}
/* Variant tones */
.ph.warm   { background: linear-gradient(135deg, #f3e6d2, #e9d3b0 60%, #dec18d); }
.ph.water  { background: linear-gradient(160deg, #cfe9f0, #aedbe8 60%, #7fc4d6); }
.ph.dark   { background: linear-gradient(135deg, #1d4a40, #12332C 60%, #0a221c); }
.ph.dark::after { color: #BCDDC5; }
.ph.bright { background: linear-gradient(135deg, #6cc78f, #4AB278 60%, #2f8e58); }
.ph.bright::after { color: #fff; opacity: .8; }
.ph.sand   { background: linear-gradient(135deg, #ece2cf, #ddccab 60%, #c8b487); }

/* Subtle figure overlay (silhouette hint) */
.ph .fig {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 96px;
  color: rgba(18,51,44,.08);
  font-weight: 700;
  letter-spacing: -0.06em;
}
.ph.dark .fig, .ph.bright .fig { color: rgba(255,255,255,.08); }
/* ============================================
   Header — sticky, with mega menu hint
   ============================================ */
.gsc-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(250, 247, 242, 0.85);
  backdrop-filter: saturate(140%) blur(14px);
  -webkit-backdrop-filter: saturate(140%) blur(14px);
  border-bottom: 1px solid var(--hairline);
  transition: background .3s ease;
}
.gsc-header.is-dark {
  background: rgba(18, 51, 44, 0.7);
  border-bottom-color: rgba(255,255,255,.1);
  color: #fff;
}
.gsc-header-inner {
  max-width: 1480px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 28px;
  padding: 16px var(--pad-page);
}
.gsc-logo {
  display: flex;
  align-items: center;
  gap: 12px;
}
.gsc-logo img { height: 44px; width: auto; }
.gsc-logo .lockup {
  display: flex;
  flex-direction: column;
  line-height: 1;
}
.gsc-logo .lockup b {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.gsc-logo .lockup span {
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-top: 2px;
}
.gsc-header.is-dark .gsc-logo .lockup span { color: rgba(255,255,255,.6); }

.gsc-nav {
  display: flex;
  gap: 4px;
  margin-left: auto;
}
.gsc-nav a {
  padding: 10px 16px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: background .2s ease, color .2s ease;
  white-space: nowrap;
}
.gsc-nav a:hover { background: rgba(18,51,44,.06); }
.gsc-header.is-dark .gsc-nav a:hover { background: rgba(255,255,255,.1); }
.gsc-nav a .chev {
  font-size: 10px;
  opacity: .55;
}

.gsc-header-actions {
  display: flex;
  gap: 10px;
  align-items: center;
}
.gsc-header-actions .pill-link {
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--ink-soft);
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid var(--hairline);
  white-space: nowrap;
}
.gsc-header.is-dark .pill-link {
  color: rgba(255,255,255,.85);
  border-color: rgba(255,255,255,.18);
}
.gsc-header-actions .pill-link:hover { background: rgba(18,51,44,.06); }
.gsc-header.is-dark .pill-link:hover { background: rgba(255,255,255,.08); }

/* Topbar (utility) */
.gsc-topbar {
  background: var(--gsc-dark);
  color: #fff;
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px var(--pad-page);
  letter-spacing: .02em;
  white-space: nowrap;
}
.gsc-topbar .left, .gsc-topbar .right {
  display: flex;
  align-items: center;
  gap: 18px;
}
.gsc-topbar a:hover { color: var(--gsc-bright); }

/* Mobile header simplification */
.mobile .gsc-nav { display: none; }
.mobile .gsc-header-actions .pill-link { display: none; }
.mobile .gsc-burger { display: inline-flex; }
.gsc-burger {
  display: none;
  width: 42px; height: 42px;
  align-items: center; justify-content: center;
  border-radius: 999px;
  border: 1px solid var(--hairline);
  background: transparent;
  cursor: pointer;
}
.gsc-burger span {
  display: block; width: 18px; height: 2px;
  background: currentColor;
  position: relative;
}
.gsc-burger span::before, .gsc-burger span::after {
  content:""; position:absolute; left:0; width:18px; height:2px; background: currentColor;
}
.gsc-burger span::before { top: -6px; }
.gsc-burger span::after { top: 6px; }

/* ============================================
   HERO — three variants
   ============================================ */
.gsc-hero {
  position: relative;
  overflow: hidden;
}

/* Variant: full-bleed image overlay (Lloyd-style) */
.hero-fullbleed {
  height: 86vh;
  min-height: 620px;
  max-height: 820px;
  color: #fff;
  display: flex;
  align-items: flex-end;
  position: relative;
}
.hero-fullbleed .ph {
  position: absolute;
  inset: 0;
  border-radius: 0;
}
.hero-fullbleed .scrim {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(18,51,44,.05) 0%, rgba(18,51,44,.0) 30%, rgba(18,51,44,.55) 70%, rgba(18,51,44,.85) 100%),
    radial-gradient(ellipse at 30% 60%, rgba(18,51,44,.45), transparent 60%);
}
.hero-fullbleed .copy {
  position: relative;
  padding: 0 var(--pad-page) clamp(56px, 6vw, 96px);
  max-width: 1480px;
  margin: 0 auto;
  width: 100%;
}
.hero-fullbleed h1 {
  font-size: var(--fs-display);
  max-width: 14ch;
  margin-bottom: 24px;
  font-weight: 600;
}
.hero-fullbleed .lede {
  font-size: clamp(18px, 1.4vw, 22px);
  max-width: 56ch;
  color: rgba(255,255,255,.92);
  font-weight: 300;
  margin-bottom: 36px;
}
.hero-fullbleed .actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.hero-fullbleed .scroll-cue {
  position: absolute;
  right: var(--pad-page);
  bottom: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: rgba(255,255,255,.7);
  writing-mode: vertical-rl;
}
.scroll-cue .line {
  width: 1px; height: 60px;
  background: linear-gradient(rgba(255,255,255,.6), transparent);
  display: block;
}

/* Variant: split */
.hero-split {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 0;
  background: var(--paper);
  min-height: 720px;
  align-items: stretch;
}
.hero-split .copy {
  padding: clamp(48px, 6vw, 110px) var(--pad-page);
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 720px;
}
.hero-split h1 {
  font-size: var(--fs-h1);
  margin: 18px 0 22px;
}
.hero-split .lede {
  font-size: 19px;
  color: var(--ink-soft);
  margin-bottom: 32px;
  max-width: 50ch;
}
.hero-split .actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-split .visual {
  position: relative;
  min-height: 600px;
}
.hero-split .visual .ph { position: absolute; inset: 24px 24px 24px 0; border-radius: var(--r-lg); }
.hero-split .visual .badge {
  position: absolute;
  bottom: 60px; left: -40px;
  background: #fff;
  padding: 18px 22px;
  border-radius: var(--r-md);
  box-shadow: var(--shadow-lift);
  display: flex;
  align-items: center;
  gap: 14px;
  z-index: 2;
}
.hero-split .visual .badge .num {
  font-size: 32px;
  font-weight: 600;
  color: var(--gsc-mid);
  line-height: 1;
}
.hero-split .visual .badge small {
  font-size: 12px;
  color: var(--ink-mute);
  display: block;
}

/* Variant: editorial — large centered title */
.hero-editorial {
  background: var(--paper);
  padding: clamp(80px, 10vw, 140px) var(--pad-page) clamp(40px, 4vw, 60px);
  text-align: center;
  position: relative;
}
.hero-editorial .eyebrow { justify-content: center; margin-bottom: 28px; }
.hero-editorial h1 {
  font-size: clamp(56px, 8vw, 132px);
  letter-spacing: -0.035em;
  line-height: 0.96;
  max-width: 16ch;
  margin: 0 auto;
  font-weight: 600;
}
.hero-editorial h1 em {
  font-style: italic;
  font-weight: 400;
  color: var(--gsc-mid);
}
.hero-editorial .lede {
  font-size: 19px;
  color: var(--ink-soft);
  max-width: 60ch;
  margin: 28px auto 36px;
}
.hero-editorial .actions { display: inline-flex; gap: 12px; }
.hero-editorial .strip {
  margin-top: clamp(60px, 6vw, 100px);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  height: clamp(280px, 28vw, 420px);
}
.hero-editorial .strip .ph {
  border-radius: var(--r-lg);
}
.hero-editorial .strip .ph:nth-child(1) { transform: translateY(40px); }
.hero-editorial .strip .ph:nth-child(2) { transform: translateY(-10px); }
.hero-editorial .strip .ph:nth-child(3) { transform: translateY(20px); }
.hero-editorial .strip .ph:nth-child(4) { transform: translateY(-30px); }

/* Mobile hero adjustments */
.mobile .hero-fullbleed { height: auto; min-height: 0; }
.mobile .hero-fullbleed .copy { padding: 60vh 24px 40px; }
.mobile .hero-fullbleed .scroll-cue { display: none; }
.mobile .hero-split { grid-template-columns: 1fr; min-height: 0; }
.mobile .hero-split .visual { min-height: 380px; }
.mobile .hero-split .visual .ph { inset: 0 16px 0 16px; }
.mobile .hero-split .visual .badge { left: 24px; bottom: 24px; }
.mobile .hero-editorial .strip { grid-template-columns: repeat(2, 1fr); height: 380px; }
.mobile .hero-editorial .strip .ph { transform: none !important; }

/* ============================================
   Stat bar (under hero)
   ============================================ */
.gsc-statbar {
  background: var(--gsc-dark);
  color: #fff;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  padding: 28px var(--pad-page);
  gap: 12px;
}
.gsc-statbar .stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.gsc-statbar .stat .num {
  font-size: 32px;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--gsc-bright);
  font-feature-settings: "tnum";
}
.gsc-statbar .stat .label {
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.65);
}
.mobile .gsc-statbar { grid-template-columns: repeat(2, 1fr); gap: 24px; }
/* ============================================
   Feature sections — alternating image/copy blocks
   ============================================ */
.gsc-section {
  padding: clamp(80px, 8vw, 140px) var(--pad-page);
  max-width: 1480px;
  margin: 0 auto;
}
.gsc-section.tight { padding-top: clamp(60px, 5vw, 80px); padding-bottom: clamp(60px, 5vw, 80px); }
.gsc-section.full {
  max-width: none;
}

.section-header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: clamp(40px, 4vw, 64px);
  flex-wrap: wrap;
}
.section-header h2 {
  font-size: var(--fs-h2);
  max-width: 18ch;
  margin-top: 12px;
}
.section-header .desc {
  max-width: 46ch;
  color: var(--ink-soft);
  font-size: 17px;
}

/* Feature row — alternating */
.feature-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(40px, 6vw, 96px);
  align-items: center;
  margin-bottom: clamp(80px, 9vw, 140px);
}
.feature-row:last-child { margin-bottom: 0; }
.feature-row.reverse { direction: rtl; }
.feature-row.reverse > * { direction: ltr; }

.feature-row .visual {
  position: relative;
  aspect-ratio: 5/4;
  border-radius: var(--r-lg);
  overflow: visible;
}
.feature-row .visual .ph {
  position: absolute;
  inset: 0;
  border-radius: var(--r-lg);
}
.feature-row .visual .meta-card {
  position: absolute;
  background: #fff;
  border-radius: var(--r-md);
  padding: 16px 18px;
  box-shadow: var(--shadow-lift);
  display: flex;
  gap: 14px;
  align-items: center;
  z-index: 2;
}
.feature-row .visual .meta-card.bottom-right {
  right: -24px; bottom: -28px;
}
.feature-row .visual .meta-card.top-left {
  left: -24px; top: 32px;
}
.feature-row .visual .meta-card .glyph {
  width: 42px; height: 42px;
  border-radius: 12px;
  background: var(--gsc-soft);
  display: grid; place-items: center;
  color: var(--gsc-dark);
}
.feature-row .visual .meta-card .glyph.dark { background: var(--gsc-dark); color: #fff; }
.feature-row .visual .meta-card .meta-text { line-height: 1.3; }
.feature-row .visual .meta-card .meta-text b { font-weight: 600; font-size: 14px; display: block; }
.feature-row .visual .meta-card .meta-text small { color: var(--ink-mute); font-size: 12px; }

.feature-row .copy .eyebrow { margin-bottom: 22px; }
.feature-row .copy h3 {
  font-size: clamp(32px, 3vw, 48px);
  margin-bottom: 24px;
  max-width: 16ch;
}
.feature-row .copy .body {
  color: var(--ink-soft);
  font-size: 17px;
  margin-bottom: 28px;
  max-width: 52ch;
}
.feature-row .copy .bullets {
  list-style: none;
  padding: 0;
  margin: 0 0 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.feature-row .copy .bullets li {
  display: flex;
  gap: 12px;
  font-size: 15px;
  color: var(--ink-soft);
  align-items: flex-start;
}
.feature-row .copy .bullets li::before {
  content: "";
  flex: none;
  width: 8px; height: 8px;
  background: var(--gsc-bright);
  border-radius: 50%;
  margin-top: 8px;
}

.mobile .feature-row { grid-template-columns: 1fr; gap: 32px; margin-bottom: 80px; }
.mobile .feature-row.reverse { direction: ltr; }
.mobile .feature-row .visual .meta-card.bottom-right { right: 16px; bottom: -16px; }
.mobile .feature-row .visual .meta-card.top-left { left: 16px; top: 16px; }

/* ============================================
   Pillar tiles (Fitness/Acqua/Junior big tiles)
   ============================================ */
.pillar-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 16px;
}
.pillar-tile {
  position: relative;
  border-radius: var(--r-lg);
  overflow: hidden;
  min-height: 460px;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 32px;
  cursor: pointer;
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease;
}
.pillar-tile:hover { transform: translateY(-4px); box-shadow: var(--shadow-lift); }
.pillar-tile .ph { position: absolute; inset: 0; border-radius: 0; transition: transform .8s ease; }
.pillar-tile:hover .ph { transform: scale(1.04); }
.pillar-tile .scrim {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(18,51,44,0) 0%, rgba(18,51,44,.15) 40%, rgba(18,51,44,.85) 100%);
}
.pillar-tile .content {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.pillar-tile .tag {
  align-self: flex-start;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.3);
  backdrop-filter: blur(6px);
  padding: 6px 12px;
  border-radius: 999px;
}
.pillar-tile h3 {
  font-size: clamp(28px, 2.4vw, 38px);
  font-weight: 600;
  max-width: 14ch;
}
.pillar-tile .blurb {
  font-size: 15px;
  color: rgba(255,255,255,.85);
  max-width: 38ch;
}
.pillar-tile .cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  margin-top: 10px;
}
.pillar-tile .cta .arrow {
  display: inline-grid; place-items: center;
  width: 32px; height: 32px;
  border-radius: 50%;
  background: rgba(255,255,255,.2);
  border: 1px solid rgba(255,255,255,.4);
  transition: background .25s ease, transform .25s ease;
}
.pillar-tile:hover .cta .arrow { background: var(--gsc-bright); border-color: var(--gsc-bright); transform: translateX(4px); color: var(--gsc-dark); }

/* tile sizes (12 col) */
.pillar-tile.size-large { grid-column: span 8; min-height: 560px; }
.pillar-tile.size-medium { grid-column: span 4; min-height: 560px; }
.pillar-tile.size-half { grid-column: span 6; min-height: 460px; }

.mobile .pillar-grid { grid-template-columns: 1fr; }
.mobile .pillar-tile { grid-column: 1 / -1 !important; min-height: 380px !important; padding: 24px; }

/* ============================================
   Evolness — branded callout
   ============================================ */
.evolness {
  background: var(--gsc-dark);
  color: #fff;
  border-radius: var(--r-xl);
  padding: clamp(48px, 6vw, 88px);
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 64px;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.evolness::before {
  content: "";
  position: absolute;
  right: -120px; top: -120px;
  width: 480px; height: 480px;
  background: radial-gradient(circle, var(--gsc-bright), transparent 60%);
  opacity: .25;
  filter: blur(20px);
}
.evolness .copy { position: relative; z-index: 1; }
.evolness .eyebrow { color: var(--gsc-bright); }
.evolness .eyebrow::before { background: var(--gsc-bright); }
.evolness h2 {
  font-size: clamp(40px, 4.4vw, 64px);
  margin: 18px 0 24px;
  max-width: 14ch;
}
.evolness h2 em {
  font-style: normal;
  color: var(--gsc-bright);
}
.evolness h2 sup { font-size: 0.45em; vertical-align: super; opacity: .7; }
.evolness .lede {
  color: rgba(255,255,255,.78);
  font-size: 18px;
  margin-bottom: 32px;
  max-width: 48ch;
}
.evolness .pillars {
  list-style: none; padding: 0; margin: 0 0 36px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
.evolness .pillars li {
  border: 1px solid rgba(255,255,255,.15);
  border-radius: var(--r-md);
  padding: 18px;
}
.evolness .pillars li b {
  display: block; color: var(--gsc-bright);
  font-weight: 500; font-size: 13px;
  letter-spacing: .12em; text-transform: uppercase;
  margin-bottom: 8px;
}
.evolness .pillars li span {
  font-size: 14px;
  color: rgba(255,255,255,.7);
}
.evolness .visual {
  position: relative;
  aspect-ratio: 1/1.05;
  border-radius: var(--r-lg);
}
.evolness .visual .ph { border-radius: var(--r-lg); position: absolute; inset: 0; }
.evolness .visual .floating {
  position: absolute;
  bottom: 24px; right: -32px;
  background: var(--gsc-bright);
  color: var(--gsc-dark);
  padding: 18px 22px;
  border-radius: var(--r-md);
  box-shadow: var(--shadow-lift);
  font-weight: 500;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 12px;
}
.evolness .visual .floating .num {
  font-size: 28px;
  font-weight: 600;
}

.mobile .evolness { grid-template-columns: 1fr; gap: 32px; padding: 32px; }
.mobile .evolness .pillars { grid-template-columns: 1fr; }
.mobile .evolness .visual .floating { right: 16px; bottom: 16px; }

/* ============================================
   Steven — secondary club section
   ============================================ */
.steven {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border-radius: var(--r-xl);
  overflow: hidden;
  background: var(--paper-2);
}
.steven .copy {
  padding: clamp(40px, 5vw, 72px);
  display: flex; flex-direction: column; justify-content: center;
}
.steven .copy .pretitle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: 20px;
}
.steven .copy .pretitle .dot { width: 8px; height: 8px; background: var(--gsc-bright); border-radius: 50%; }
.steven .copy h3 {
  font-size: clamp(36px, 3.6vw, 56px);
  margin-bottom: 20px;
  max-width: 14ch;
}
.steven .copy .body {
  color: var(--ink-soft);
  margin-bottom: 32px;
  max-width: 50ch;
  font-size: 17px;
}
.steven .copy .quick {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px;
  margin-bottom: 32px;
}
.steven .copy .quick div {
  border-top: 1px solid var(--hairline);
  padding-top: 16px;
}
.steven .copy .quick b {
  display: block; font-size: 22px; font-weight: 600;
  color: var(--gsc-mid); margin-bottom: 4px;
}
.steven .copy .quick small {
  font-size: 13px; color: var(--ink-mute);
}
.steven .visual {
  position: relative;
  min-height: 480px;
}
.steven .visual .ph { position: absolute; inset: 0; border-radius: 0; }
.steven .visual .corner-badge {
  position: absolute; top: 24px; right: 24px;
  background: rgba(255,255,255,.94);
  padding: 10px 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .04em;
  display: inline-flex; align-items: center; gap: 8px;
}
.steven .visual .corner-badge .pulse {
  width: 8px; height: 8px; background: var(--gsc-bright); border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(74,178,120,.6);
  animation: pulse 2s infinite;
}
@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(74,178,120,.5); }
  70% { box-shadow: 0 0 0 12px rgba(74,178,120,0); }
  100% { box-shadow: 0 0 0 0 rgba(74,178,120,0); }
}

.mobile .steven { grid-template-columns: 1fr; }
.mobile .steven .visual { min-height: 320px; }
/* ============================================
   Pricing / Orari + Testimonials + Footer
   ============================================ */
.pricing {
  display: grid;
  grid-template-columns: 1.1fr 1fr 1fr;
  gap: 16px;
}
.pricing .lead {
  background: var(--gsc-soft);
  border-radius: var(--r-lg);
  padding: clamp(32px, 3vw, 48px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 360px;
}
.pricing .lead h3 {
  font-size: clamp(28px, 2.4vw, 38px);
  margin-bottom: 16px;
  max-width: 12ch;
}
.pricing .lead p { color: var(--ink-soft); margin-bottom: 24px; max-width: 36ch; }
.pricing .card {
  background: #fff;
  border-radius: var(--r-lg);
  padding: clamp(28px, 2.5vw, 40px);
  display: flex;
  flex-direction: column;
  border: 1px solid var(--hairline);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.pricing .card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lift);
  border-color: transparent;
}
.pricing .card .label {
  font-size: 12px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--gsc-mid); margin-bottom: 16px;
}
.pricing .card h4 {
  font-size: 24px;
  margin-bottom: 8px;
  font-weight: 600;
}
.pricing .card .price {
  display: flex; align-items: baseline; gap: 6px;
  margin: 24px 0 8px;
}
.pricing .card .price .num { font-size: 56px; font-weight: 600; color: var(--gsc-dark); letter-spacing: -0.03em; line-height: 1; }
.pricing .card .price .cur { font-size: 24px; color: var(--gsc-mid); font-weight: 500; }
.pricing .card .price small { font-size: 13px; color: var(--ink-mute); margin-left: 6px; }
.pricing .card ul {
  list-style: none; padding: 0; margin: 16px 0 24px;
  font-size: 14px; color: var(--ink-soft);
  display: flex; flex-direction: column; gap: 8px;
}
.pricing .card ul li { display: flex; gap: 8px; }
.pricing .card ul li::before { content: "✓"; color: var(--gsc-bright); font-weight: 700; }
.pricing .card .foot { margin-top: auto; }

.mobile .pricing { grid-template-columns: 1fr; }

/* ============================================
   Testimonials
   ============================================ */
.testimonials-wrap {
  background: var(--paper-2);
  padding: clamp(80px, 8vw, 120px) 0;
}
.testimonials-wrap .head {
  max-width: 1480px;
  margin: 0 auto clamp(40px, 4vw, 64px);
  padding: 0 var(--pad-page);
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
}
.testimonials-wrap .head h2 { font-size: var(--fs-h2); max-width: 18ch; }
.testimonials-wrap .controls {
  display: flex; gap: 8px;
}
.testimonials-wrap .controls button {
  width: 48px; height: 48px;
  border-radius: 50%;
  border: 1px solid var(--gsc-dark);
  background: transparent;
  color: var(--gsc-dark);
  cursor: pointer;
  font-size: 18px;
  transition: background .2s, color .2s;
}
.testimonials-wrap .controls button:hover { background: var(--gsc-dark); color: #fff; }

.testimonials-track {
  display: flex;
  gap: 20px;
  padding: 0 var(--pad-page);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-padding: var(--pad-page);
  scrollbar-width: none;
}
.testimonials-track::-webkit-scrollbar { display: none; }
.testimonial-card {
  flex: none;
  width: clamp(320px, 30vw, 440px);
  background: #fff;
  border-radius: var(--r-lg);
  padding: 32px;
  scroll-snap-align: start;
  display: flex; flex-direction: column;
  gap: 18px;
}
.testimonial-card .stars { color: var(--gsc-bright); font-size: 14px; letter-spacing: 2px; }
.testimonial-card blockquote {
  margin: 0;
  font-size: 18px;
  line-height: 1.5;
  font-weight: 400;
  color: var(--ink);
}
.testimonial-card .author {
  display: flex; align-items: center; gap: 12px; margin-top: auto; padding-top: 20px;
  border-top: 1px solid var(--hairline);
}
.testimonial-card .avatar {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--gsc-soft);
  display: grid; place-items: center;
  font-weight: 600; color: var(--gsc-dark);
  font-size: 14px;
}
.testimonial-card .who b { display: block; font-size: 14px; font-weight: 600; }
.testimonial-card .who small { font-size: 12px; color: var(--ink-mute); }

/* ============================================
   Footer
   ============================================ */
.gsc-footer {
  background: var(--gsc-dark);
  color: #fff;
  padding: clamp(60px, 6vw, 100px) var(--pad-page) 0;
}
.gsc-footer .top {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
  gap: 48px;
  max-width: 1480px;
  margin: 0 auto;
  padding-bottom: clamp(48px, 5vw, 80px);
}
.gsc-footer .brand-block .lockup {
  display: flex; align-items: center; gap: 12px; margin-bottom: 24px;
}
.gsc-footer .brand-block .lockup img { height: 48px; width: auto; }
.gsc-footer .brand-block .lockup b { font-size: 16px; font-weight: 600; }
.gsc-footer .brand-block p {
  color: rgba(255,255,255,.65);
  max-width: 32ch;
  font-size: 14px;
  margin-bottom: 24px;
}
.gsc-footer .newsletter {
  display: flex;
  gap: 8px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 999px;
  padding: 6px;
  max-width: 360px;
}
.gsc-footer .newsletter input {
  flex: 1;
  background: transparent;
  border: 0;
  color: #fff;
  padding: 10px 14px;
  font: inherit;
  font-size: 14px;
  outline: none;
}
.gsc-footer .newsletter input::placeholder { color: rgba(255,255,255,.5); }
.gsc-footer .newsletter button {
  background: var(--gsc-bright);
  color: var(--gsc-dark);
  border: 0;
  border-radius: 999px;
  padding: 10px 20px;
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background .2s;
}
.gsc-footer .newsletter button:hover { background: #fff; }

.gsc-footer .col h4 {
  font-size: 13px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--gsc-bright); margin-bottom: 18px; font-weight: 500;
}
.gsc-footer .col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.gsc-footer .col ul a { font-size: 14px; color: rgba(255,255,255,.78); transition: color .2s; }
.gsc-footer .col ul a:hover { color: var(--gsc-bright); }

.gsc-footer .bot {
  border-top: 1px solid rgba(255,255,255,.12);
  padding: 24px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  color: rgba(255,255,255,.55);
  max-width: 1480px;
  margin: 0 auto;
  flex-wrap: wrap;
  gap: 16px;
}
.gsc-footer .bot .legal { display: flex; gap: 24px; }

.mobile .gsc-footer .top { grid-template-columns: 1fr 1fr; gap: 32px; }
.mobile .gsc-footer .brand-block { grid-column: 1 / -1; }

/* ============================================
   Sticky CTA (floating)
   ============================================ */
.sticky-cta {
  position: fixed;
  bottom: 24px; right: 24px;
  z-index: 40;
  background: var(--gsc-bright);
  color: var(--gsc-dark);
  padding: 14px 22px 14px 18px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-weight: 500;
  font-size: 14px;
  box-shadow: 0 12px 36px rgba(18,51,44,.25);
  cursor: pointer;
  transition: transform .25s ease, box-shadow .25s ease;
}
.sticky-cta:hover { transform: translateY(-3px); box-shadow: 0 16px 42px rgba(18,51,44,.32); }
.sticky-cta .glyph {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--gsc-dark);
  color: var(--gsc-bright);
  display: grid; place-items: center;
  font-size: 16px;
}
.sticky-cta b { font-weight: 600; }
.sticky-cta small { font-size: 11px; opacity: .7; display: block; line-height: 1; }

/* ============================================
   Quick promo bar
   ============================================ */
.promo-bar {
  background: var(--gsc-bright);
  color: var(--gsc-dark);
  padding: 12px var(--pad-page);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-size: 13px;
  font-weight: 500;
}
.promo-bar .badge {
  background: var(--gsc-dark); color: var(--gsc-bright);
  padding: 3px 10px; border-radius: 999px;
  font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
}
.promo-bar a { text-decoration: underline; text-underline-offset: 3px; }
/* ============================================
   Schools grid
   ============================================ */
.schools-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.school-card {
  background: #fff;
  border-radius: var(--r-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--hairline);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  cursor: pointer;
}
.school-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lift);
  border-color: transparent;
}
.school-card .ph {
  position: relative;
  aspect-ratio: 4/5;
  border-radius: 0;
}
.school-card .school-body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
}
.school-card h4 {
  font-size: 22px;
  font-weight: 600;
  margin: 0;
}
.school-card p {
  color: var(--ink-soft);
  font-size: 14px;
  flex: 1;
}
.school-card .school-link {
  font-size: 14px;
  font-weight: 500;
  color: var(--gsc-mid);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
}
.school-card:hover .school-link { color: var(--gsc-dark); }
.school-card:hover .school-link .arrow { transform: translateX(4px); }
.school-card .school-link .arrow { transition: transform .2s; }

.mobile .schools-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
.mobile .school-card .school-body { padding: 16px; }
.mobile .school-card h4 { font-size: 18px; }

/* ============================================
   Pre-footer CTA strip
   ============================================ */
.cta-strip-wrap {
  padding: 0 var(--pad-page) clamp(60px, 6vw, 100px);
  max-width: 1480px;
  margin: 0 auto;
}
.cta-strip {
  background: var(--gsc-dark);
  color: #fff;
  border-radius: var(--r-xl);
  padding: clamp(40px, 5vw, 72px);
  display: grid;
  grid-template-columns: 1.1fr 2fr;
  gap: 56px;
  align-items: center;
}
.cta-strip .big h2 {
  font-size: clamp(36px, 3.6vw, 56px);
  margin-top: 16px;
}
.cta-strip .opts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.cta-strip .opt {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--r-md);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: background .25s ease, border-color .25s ease, transform .25s ease;
}
.cta-strip .opt:hover {
  background: rgba(255,255,255,.1);
  border-color: var(--gsc-bright);
  transform: translateY(-3px);
}
.cta-strip .opt-num {
  font-size: 12px;
  letter-spacing: .14em;
  color: var(--gsc-bright);
  font-weight: 500;
}
.cta-strip .opt h5 {
  font-size: 18px;
  font-weight: 600;
  margin: 6px 0 4px;
}
.cta-strip .opt p {
  font-size: 13px;
  color: rgba(255,255,255,.65);
  flex: 1;
}
.cta-strip .opt .link {
  font-size: 13px;
  font-weight: 500;
  color: var(--gsc-bright);
  margin-top: 12px;
}

.mobile .cta-strip { grid-template-columns: 1fr; gap: 32px; padding: 28px; }
.mobile .cta-strip .opts { grid-template-columns: 1fr; }
/* ============================================
   MOBILE — overrides scoped to .gsc-page.mobile
   The artboard is 390px wide but `--pad-page` and
   `clamp()` font-sizes use vw based on the host
   viewport. We force mobile-appropriate values here.
   ============================================ */

.gsc-page.mobile {
  /* Tighter page padding, fixed (not vw-based) */
  --pad-page: 20px;

  /* Mobile-tuned type scale */
  --fs-display: 44px;
  --fs-h1: 36px;
  --fs-h2: 28px;
  --fs-h3: 20px;
  --fs-body: 16px;

  width: 100%;
  overflow-x: hidden;
}

/* ─── Topbar ─── */
.mobile .gsc-topbar {
  font-size: 11px;
  padding: 8px 16px;
  gap: 8px;
  white-space: normal;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
}
.mobile .gsc-topbar .left,
.mobile .gsc-topbar .right {
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}
.mobile .gsc-topbar .right { display: none; } /* keep only address + phone */

/* ─── Promo bar ─── */
.mobile .promo-bar {
  flex-direction: column;
  gap: 8px;
  padding: 12px 16px;
  font-size: 12px;
  text-align: center;
  line-height: 1.4;
}
.mobile .promo-bar .badge { font-size: 10px; }

/* ─── Header ─── */
.mobile .gsc-header-inner {
  padding: 12px 16px;
  gap: 12px;
}
.mobile .gsc-logo img { height: 36px; }
.mobile .gsc-logo .lockup b { font-size: 12px; }
.mobile .gsc-logo .lockup span { font-size: 9px; letter-spacing: .14em; }
.mobile .gsc-header-actions { margin-left: auto; gap: 8px; }
.mobile .gsc-header-actions .btn {
  padding: 10px 14px;
  font-size: 13px;
}
.mobile .gsc-burger { width: 38px; height: 38px; }

/* ─── Hero split ─── */
.mobile .hero-split { min-height: 0; }
.mobile .hero-split .copy {
  padding: 32px 20px 28px;
  max-width: 100%;
}
.mobile .hero-split h1 { font-size: 38px; line-height: 1.05; }
.mobile .hero-split .lede { font-size: 16px; margin-bottom: 24px; }
.mobile .hero-split .actions { gap: 10px; }
.mobile .hero-split .actions .btn { font-size: 14px; padding: 12px 18px; }
.mobile .hero-split .visual {
  min-height: 320px;
  margin: 0 20px 80px; /* room for the badge that hangs below */
}
.mobile .hero-split .visual .ph {
  inset: 0;
  border-radius: var(--r-md);
}
.mobile .hero-split .visual .badge {
  left: 16px;
  right: 16px;
  bottom: -40px;
  padding: 14px 16px;
  gap: 12px;
}
.mobile .hero-split .visual .badge .num { font-size: 26px; }

/* ─── Statbar ─── */
.mobile .gsc-statbar {
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  padding: 24px 20px;
}
.mobile .gsc-statbar .stat .num { font-size: 24px; }
.mobile .gsc-statbar .stat .label { font-size: 11px; }

/* ─── Sections — tighter vertical rhythm ─── */
.mobile .gsc-section {
  padding: 56px 20px;
}
.mobile .section-header {
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}
.mobile .section-header h2 { font-size: 28px; max-width: 100%; }
.mobile .section-header .desc { font-size: 15px; max-width: 100%; }

/* ─── Pillars ─── */
.mobile .pillar-tile h3 { font-size: 26px; max-width: 100%; }
.mobile .pillar-tile .blurb { font-size: 14px; max-width: 100%; }

/* ─── Evolness ─── */
.mobile .evolness {
  padding: 32px 24px;
  border-radius: var(--r-lg);
  gap: 24px;
}
.mobile .evolness h2 {
  font-size: 36px;
  line-height: 1.05;
  max-width: 100%;
  word-break: normal;
  overflow-wrap: break-word;
}
.mobile .evolness .lede { font-size: 15px; max-width: 100%; }
.mobile .evolness .pillars { gap: 10px; margin-bottom: 24px; }
.mobile .evolness .pillars li { padding: 14px; }
.mobile .evolness .pillars li b { font-size: 11px; }
.mobile .evolness .pillars li span { font-size: 13px; }
.mobile .evolness .visual {
  margin-right: 32px; /* space for floating badge */
}
.mobile .evolness .visual .floating {
  right: -16px;
  padding: 12px 16px;
  font-size: 13px;
}
.mobile .evolness .visual .floating .num { font-size: 22px; }

/* ─── Steven ─── */
.mobile .steven { padding: 0; gap: 0; }
.mobile .steven .copy { padding: 32px 20px; }
.mobile .steven .copy h3 { font-size: 28px !important; max-width: 100% !important; line-height: 1.05; }
.mobile .steven .copy .body { font-size: 15px; max-width: 100%; }
.mobile .steven .copy .quick { gap: 12px; margin-bottom: 24px; }
.mobile .steven .copy .quick b { font-size: 18px; }
.mobile .steven .visual { min-height: 280px; }

/* ─── Schools ─── */
.mobile .gsc-section .schools-grid { gap: 12px; }

/* ─── Pricing ─── */
.mobile .pricing { padding: 0; }
.mobile .pricing .lead h2 { font-size: 28px; max-width: 100%; }
.mobile .pricing .lead p { font-size: 15px; max-width: 100%; }

/* ─── Testimonials ─── */
.mobile .testimonials-wrap .head { padding: 0 20px; flex-direction: column; align-items: flex-start; gap: 16px; }
.mobile .testimonials-wrap .head h2 { font-size: 28px; max-width: 100%; }

/* ─── Footer ─── */
.mobile .gsc-footer { padding: 48px 20px 0; }
.mobile .gsc-footer .top { padding: 0; gap: 24px; }
.mobile .gsc-footer .bot { padding: 24px 0; flex-direction: column; align-items: flex-start; gap: 12px; }
.mobile .gsc-footer .newsletter { max-width: 100%; }

/* ─── CTA strip (still defined though removed from page; kept for safety) ─── */
.mobile .cta-strip { padding: 28px 20px; }
.mobile .cta-strip h2 { font-size: 32px; }

/* ─── Sticky CTA (smaller on mobile) ─── */
.mobile .sticky-cta { font-size: 13px; padding: 12px 16px; }

/* ─── Hero-fullbleed mobile copy padding override ─── */
.mobile .hero-fullbleed .copy { padding: 320px 20px 32px; }
.mobile .hero-fullbleed h1 { font-size: 40px; max-width: 100%; }
.mobile .hero-fullbleed .lede { font-size: 15px; max-width: 100%; }

/* ─── Tame any rogue clamp/vw text on cards ─── */
.mobile h1, .mobile h2, .mobile h3 { word-break: normal; overflow-wrap: break-word; }
.mobile .feature-row .copy h3 { font-size: 28px; max-width: 100%; }
.mobile .feature-row .copy .body { font-size: 15px; max-width: 100%; }
/* ============================================
   Garden Sporting Center — Pagina Corsi
   New sections: hero corsi, lista corsi (accordion per categoria),
   orari/abbonamenti (riusa pattern del servizio), faq, contatti.
   Reuses tokens from styles.css.
   ============================================ */

/* ---------- Hero corsi ---------- */
.crs-hero {
  position: relative;
  min-height: 640px;
  height: 80vh;
  max-height: 820px;
  color: #fff;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}
.crs-hero .ph { position: absolute; inset: 0; border-radius: 0; }
.crs-hero .scrim {
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(18,51,44,.55) 0%, rgba(18,51,44,.05) 30%, rgba(18,51,44,.25) 60%, rgba(18,51,44,.92) 100%);
}
.crs-hero .copy {
  position: relative;
  width: 100%;
  max-width: 1480px;
  margin: 0 auto;
  padding: 0 var(--pad-page) clamp(40px, 5vw, 72px);
}
.crs-hero .copy .breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.78);
  margin-bottom: 28px;
}
.crs-hero .copy .breadcrumb .sep { opacity: .4; }
.crs-hero h1 {
  font-size: var(--fs-display);
  max-width: 14ch;
  margin-bottom: 22px;
  font-weight: 600;
}
.crs-hero .lede {
  font-size: clamp(17px, 1.2vw, 20px);
  max-width: 50ch;
  color: rgba(255,255,255,.92);
  font-weight: 300;
  margin-bottom: 28px;
}
.crs-hero .actions { display: flex; gap: 12px; flex-wrap: wrap; }

/* Right-side: stats + jump-to-category */
.crs-hero .side {
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding-bottom: 6px;
}
.crs-hero .stat-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  padding: 22px 0;
  border-top: 1px solid rgba(255,255,255,.18);
  border-bottom: 1px solid rgba(255,255,255,.18);
}
.crs-hero .stat .num {
  font-size: clamp(28px, 2.6vw, 40px);
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--gsc-bright);
  display: block;
  line-height: 1;
}
.crs-hero .stat small {
  font-size: 12px;
  letter-spacing: .08em;
  color: rgba(255,255,255,.7);
  text-transform: uppercase;
  display: block;
  margin-top: 8px;
}
.crs-hero .jump {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.crs-hero .jump .tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.22);
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}
.crs-hero .jump .tag:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.4); }
.crs-hero .jump .tag .dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--gsc-bright);
  flex: none;
}

.mobile .crs-hero { height: auto; min-height: 0; max-height: none; }
.mobile .crs-hero .copy {
  grid-template-columns: 1fr;
  padding: 56vh 24px 36px;
  gap: 32px;
}
.mobile .crs-hero .stat-row { grid-template-columns: repeat(3, 1fr); gap: 8px; }
.mobile .crs-hero .stat .num { font-size: 26px; }

/* ============================================
   Lista corsi — categorie con accordion
   ============================================ */
.crs-list-wrap {
  padding: clamp(80px, 8vw, 120px) var(--pad-page);
  max-width: 1480px;
  margin: 0 auto;
}
.crs-list-intro {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: clamp(32px, 5vw, 96px);
  align-items: end;
  margin-bottom: clamp(48px, 5vw, 80px);
}
.crs-list-intro h2 {
  font-size: var(--fs-h2);
  margin-top: 14px;
  max-width: 14ch;
}
.crs-list-intro p {
  color: var(--ink-soft);
  font-size: 17px;
  max-width: 52ch;
}
.crs-list-intro .meta {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-top: 18px;
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
.crs-list-intro .meta span::before {
  content: "·";
  margin-right: 24px;
  color: var(--hairline);
}
.crs-list-intro .meta span:first-child::before { content: ""; margin: 0; }

/* Sticky category nav */
.crs-catnav {
  position: sticky;
  top: 0;
  background: var(--paper);
  z-index: 5;
  margin: 0 calc(-1 * var(--pad-page)) clamp(40px, 4vw, 64px);
  padding: 18px var(--pad-page);
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
  display: flex;
  align-items: center;
  gap: 24px;
  overflow-x: auto;
  scrollbar-width: none;
}
.crs-catnav::-webkit-scrollbar { display: none; }
.crs-catnav .label {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-mute);
  flex: none;
}
.crs-catnav .links {
  display: flex;
  gap: 6px;
  flex: 1;
}
.crs-catnav .links a {
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-soft);
  white-space: nowrap;
  border: 1px solid transparent;
  transition: background .2s, color .2s, border-color .2s;
}
.crs-catnav .links a:hover {
  background: #fff;
  border-color: var(--hairline);
  color: var(--gsc-dark);
}
.crs-catnav .links a.active {
  background: var(--gsc-dark);
  color: #fff;
}
.crs-catnav .count {
  flex: none;
  font-size: 12px;
  color: var(--ink-mute);
  font-feature-settings: "tnum";
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  letter-spacing: .04em;
}
.mobile .crs-catnav .count { display: none; }
.mobile .crs-catnav .label { display: none; }

/* Categoria block */
.crs-category {
  margin-bottom: clamp(56px, 6vw, 96px);
  scroll-margin-top: 80px;
}
.crs-category:last-child { margin-bottom: 0; }
.crs-category .cat-head {
  display: grid;
  grid-template-columns: 56px 1fr auto;
  align-items: center;
  gap: 20px;
  padding-bottom: 24px;
  margin-bottom: 28px;
  border-bottom: 1px solid var(--hairline);
}
.crs-category .cat-head .icon {
  width: 56px; height: 56px;
  border-radius: 14px;
  display: grid; place-items: center;
  font-size: 22px;
  font-weight: 700;
  background: var(--gsc-soft);
  color: var(--gsc-dark);
}
.crs-category .cat-head .icon.dark {
  background: var(--gsc-dark);
  color: var(--gsc-bright);
}
.crs-category .cat-head .icon.bright {
  background: var(--gsc-bright);
  color: var(--gsc-dark);
}
.crs-category .cat-head .icon.water {
  background: #cfe9f0;
  color: #1f5664;
}
.crs-category .cat-head .icon.warm {
  background: #f3e6d2;
  color: #7a5b2a;
}
.crs-category .cat-head h3 {
  font-size: clamp(28px, 2.4vw, 40px);
  margin: 0;
  font-weight: 600;
}
.crs-category .cat-head .desc {
  display: block;
  font-size: 14px;
  color: var(--ink-soft);
  font-weight: 400;
  margin-top: 6px;
  letter-spacing: 0;
  max-width: 52ch;
}
.crs-category .cat-head .pill {
  flex: none;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-mute);
  background: #fff;
  border: 1px solid var(--hairline);
  padding: 8px 14px;
  border-radius: 999px;
}

/* Accordion list */
.crs-accordion {
  display: flex;
  flex-direction: column;
}
.crs-item {
  border-bottom: 1px solid var(--hairline);
}
.crs-item:first-child { border-top: 1px solid var(--hairline); }
.crs-item summary {
  list-style: none;
  cursor: pointer;
  padding: 22px 0;
  display: grid;
  grid-template-columns: 80px 1.6fr 1fr auto;
  align-items: center;
  gap: 24px;
  transition: background .2s ease;
}
.crs-item summary::-webkit-details-marker { display: none; }
.crs-item summary:hover .name { color: var(--gsc-mid); }
.crs-item summary .thumb {
  width: 80px; height: 60px;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
  flex: none;
}
.crs-item summary .thumb .ph { position: absolute; inset: 0; border-radius: 0; }
.crs-item summary .thumb .ph::after { display: none; }
.crs-item summary .thumb .ph .fig { font-size: 28px; }
.crs-item summary .name {
  font-size: clamp(20px, 1.6vw, 26px);
  font-weight: 500;
  color: var(--gsc-dark);
  letter-spacing: -0.01em;
  transition: color .2s ease;
}
.crs-item summary .name small {
  display: block;
  font-size: 13px;
  color: var(--ink-mute);
  font-weight: 400;
  margin-top: 4px;
  letter-spacing: 0;
  text-transform: none;
}
.crs-item summary .tags {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.crs-item summary .tag {
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 500;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--paper-2);
  color: var(--ink-soft);
  white-space: nowrap;
}
.crs-item summary .tag.lvl-1 { background: rgba(74,178,120,.16); color: #1d6e3e; }
.crs-item summary .tag.lvl-2 { background: rgba(2,103,71,.14); color: var(--gsc-mid); }
.crs-item summary .tag.lvl-3 { background: rgba(18,51,44,.10); color: var(--gsc-dark); }
.crs-item summary .icon {
  flex: none;
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 1px solid var(--hairline);
  display: grid; place-items: center;
  position: relative;
  transition: background .25s ease, border-color .25s ease;
}
.crs-item summary .icon::before,
.crs-item summary .icon::after {
  content: "";
  position: absolute;
  background: var(--gsc-dark);
  transition: transform .3s ease, background .25s ease;
}
.crs-item summary .icon::before { width: 14px; height: 1.5px; }
.crs-item summary .icon::after { width: 1.5px; height: 14px; }
.crs-item[open] summary .icon {
  background: var(--gsc-dark);
  border-color: var(--gsc-dark);
}
.crs-item[open] summary .icon::before,
.crs-item[open] summary .icon::after { background: #fff; }
.crs-item[open] summary .icon::after { transform: rotate(90deg); }

/* Expanded content */
.crs-item .body {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: clamp(24px, 3vw, 48px);
  padding: 4px 0 36px;
  align-items: start;
}
.crs-item .body .visual {
  position: relative;
  border-radius: var(--r-md);
  overflow: hidden;
  aspect-ratio: 4/3;
}
.crs-item .body .visual .ph {
  position: absolute; inset: 0; border-radius: 0;
}
.crs-item .body .visual .ph .fig { font-size: 84px; }
.crs-item .body .text p {
  color: var(--ink-soft);
  font-size: 16px;
  line-height: 1.65;
  margin-bottom: 18px;
  max-width: 56ch;
}
.crs-item .body .text p + p { margin-top: -4px; }
.crs-item .body .specs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: 22px 0 26px;
  padding: 22px 0;
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
}
.crs-item .body .specs .spec .lab {
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-mute);
  font-weight: 500;
  display: block;
  margin-bottom: 6px;
}
.crs-item .body .specs .spec b {
  font-size: 15px;
  font-weight: 500;
  color: var(--gsc-dark);
  display: block;
}
.crs-item .body .specs .spec .bar {
  display: inline-flex;
  gap: 3px;
  margin-top: 4px;
}
.crs-item .body .specs .spec .bar i {
  width: 18px; height: 6px;
  border-radius: 2px;
  background: var(--hairline);
}
.crs-item .body .specs .spec .bar i.on { background: var(--gsc-mid); }
.crs-item .body .text .actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.crs-item .body .text .trainers {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px dashed var(--hairline);
}
.crs-item .body .text .trainers .avatars {
  display: inline-flex;
}
.crs-item .body .text .trainers .avatars .av {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--gsc-soft);
  color: var(--gsc-dark);
  display: grid; place-items: center;
  font-size: 11px;
  font-weight: 600;
  border: 2px solid var(--paper);
  margin-left: -8px;
}
.crs-item .body .text .trainers .avatars .av:first-child { margin-left: 0; }
.crs-item .body .text .trainers small {
  font-size: 13px;
  color: var(--ink-soft);
}
.crs-item .body .text .trainers small b { color: var(--gsc-dark); font-weight: 500; }

/* Mobile compact */
.mobile .crs-list-intro { grid-template-columns: 1fr; gap: 24px; align-items: start; }
.mobile .crs-catnav { gap: 12px; padding: 14px var(--pad-page); }
.mobile .crs-category .cat-head { grid-template-columns: 48px 1fr; gap: 14px; }
.mobile .crs-category .cat-head .pill { display: none; }
.mobile .crs-category .cat-head .icon { width: 48px; height: 48px; font-size: 18px; }
.mobile .crs-item summary { grid-template-columns: 56px 1fr auto; gap: 14px; padding: 18px 0; }
.mobile .crs-item summary .thumb { width: 56px; height: 56px; }
.mobile .crs-item summary .tags { display: none; }
.mobile .crs-item summary .name { font-size: 17px; }
.mobile .crs-item .body { grid-template-columns: 1fr; gap: 20px; }
.mobile .crs-item .body .specs { grid-template-columns: repeat(2, 1fr); }
/* ============================================
   GSC — Pagina Personal Training
   Hero, lista trainer (accordion 1 PT per riga), pacchetti, FAQ.
   Riusa tokens da styles.css e pattern dal servizio/corsi.
   ============================================ */

/* ---------- Hero PT (variante crs-hero) ---------- */
.pt-hero {
  position: relative;
  min-height: 640px;
  height: 80vh;
  max-height: 820px;
  color: #fff;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}
.pt-hero .ph { position: absolute; inset: 0; border-radius: 0; }
.pt-hero .scrim {
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(18,51,44,.55) 0%, rgba(18,51,44,.05) 30%, rgba(18,51,44,.25) 60%, rgba(18,51,44,.92) 100%);
}
.pt-hero .copy {
  position: relative;
  width: 100%;
  max-width: 1480px;
  margin: 0 auto;
  padding: 0 var(--pad-page) clamp(40px, 5vw, 72px);
}
.pt-hero .breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.78);
  margin-bottom: 28px;
}
.pt-hero .breadcrumb .sep { opacity: .4; }
.pt-hero h1 {
  font-size: var(--fs-display);
  max-width: 14ch;
  margin-bottom: 22px;
  font-weight: 600;
}
.pt-hero .lede {
  font-size: clamp(17px, 1.2vw, 20px);
  max-width: 50ch;
  color: rgba(255,255,255,.92);
  font-weight: 300;
  margin-bottom: 28px;
}
.pt-hero .actions { display: flex; gap: 12px; flex-wrap: wrap; }
.pt-hero .side {
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding-bottom: 6px;
}
.pt-hero .stat-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  padding: 22px 0;
  border-top: 1px solid rgba(255,255,255,.18);
  border-bottom: 1px solid rgba(255,255,255,.18);
}
.pt-hero .stat .num {
  font-size: clamp(28px, 2.6vw, 40px);
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--gsc-bright);
  display: block;
  line-height: 1;
}
.pt-hero .stat small {
  font-size: 12px;
  letter-spacing: .08em;
  color: rgba(255,255,255,.7);
  text-transform: uppercase;
  display: block;
  margin-top: 8px;
}
.pt-hero .jump { display: flex; flex-wrap: wrap; gap: 8px; }
.pt-hero .jump .tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.22);
  color: #fff;
  font-size: 13px;
  font-weight: 500;
}
.pt-hero .jump .tag .dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--gsc-bright); flex: none;
}
.mobile .pt-hero { height: auto; min-height: 0; max-height: none; }
.mobile .pt-hero .copy {
  grid-template-columns: 1fr;
  padding: 56vh 24px 36px;
  gap: 32px;
}
.mobile .pt-hero .stat .num { font-size: 26px; }

/* ============================================
   Lista PT
   ============================================ */
.pt-list-wrap {
  padding: clamp(80px, 8vw, 120px) var(--pad-page) clamp(80px, 8vw, 120px);
  max-width: 1480px;
  margin: 0 auto;
}
.pt-list-intro {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: clamp(32px, 5vw, 96px);
  align-items: end;
  margin-bottom: clamp(40px, 4vw, 64px);
}
.pt-list-intro h2 {
  font-size: var(--fs-h2);
  margin-top: 14px;
  max-width: 14ch;
}
.pt-list-intro p {
  color: var(--ink-soft);
  font-size: 17px;
  max-width: 56ch;
}
.pt-list-intro .meta {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-top: 18px;
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
.pt-list-intro .meta span::before {
  content: "·";
  margin-right: 24px;
  color: var(--hairline);
}
.pt-list-intro .meta span:first-child::before { content: ""; margin: 0; }

/* Filter nav */
.pt-filter {
  margin: 0 calc(-1 * var(--pad-page)) clamp(32px, 3vw, 48px);
  padding: 18px var(--pad-page);
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
  display: flex;
  align-items: center;
  gap: 24px;
  overflow-x: auto;
  scrollbar-width: none;
}
.pt-filter::-webkit-scrollbar { display: none; }
.pt-filter .label {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-mute);
  flex: none;
}
.pt-filter .links { display: flex; gap: 6px; flex: 1; }
.pt-filter .links a {
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-soft);
  white-space: nowrap;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
}
.pt-filter .links a:hover {
  background: #fff;
  border-color: var(--hairline);
  color: var(--gsc-dark);
}
.pt-filter .links a.active {
  background: var(--gsc-dark);
  color: #fff;
  border-color: var(--gsc-dark);
}
.pt-filter .count {
  flex: none;
  font-size: 12px;
  color: var(--ink-mute);
  font-feature-settings: "tnum";
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  letter-spacing: .04em;
}
.mobile .pt-filter .label,
.mobile .pt-filter .count { display: none; }

/* Trainer rows — accordion 1 PT per riga */
.pt-rows {
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--hairline);
  margin-bottom: clamp(48px, 5vw, 72px);
}
.pt-row {
  border-bottom: 1px solid var(--hairline);
  background: var(--paper);
  transition: background .25s ease;
}
.pt-row.open { background: #fff; }
.pt-row .row-summary {
  width: 100%;
  background: transparent;
  border: 0;
  padding: 18px 0;
  display: grid;
  grid-template-columns: 64px 1.6fr 1.4fr 36px;
  align-items: center;
  gap: 24px;
  cursor: pointer;
  font: inherit;
  text-align: left;
  color: inherit;
}
.pt-row .row-summary:hover .ident h3 { color: var(--gsc-mid); }
.pt-row .thumb {
  width: 64px; height: 64px;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  flex: none;
}
.pt-row .thumb .ph { position: absolute; inset: 0; border-radius: 0; }
.pt-row .thumb .ph::after { display: none; }
.pt-row .thumb .ph .fig { font-size: 26px; }
.pt-row .ident h3 {
  font-size: clamp(20px, 1.5vw, 24px);
  font-weight: 500;
  margin: 0;
  letter-spacing: -0.01em;
  color: var(--gsc-dark);
  transition: color .2s ease;
}
.pt-row .ident .role {
  font-size: 13px;
  color: var(--ink-mute);
  margin-top: 4px;
  letter-spacing: 0;
}
.pt-row .row-specs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}
.pt-row .row-specs .spec {
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 500;
  padding: 5px 11px;
  border-radius: 999px;
  background: var(--paper-2);
  color: var(--ink-soft);
  white-space: nowrap;
}
.pt-row .chev {
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 1px solid var(--hairline);
  display: grid; place-items: center;
  position: relative;
  transition: background .25s ease, border-color .25s ease;
  justify-self: end;
}
.pt-row .chev::before,
.pt-row .chev::after {
  content: "";
  position: absolute;
  background: var(--gsc-dark);
  transition: transform .3s ease, background .25s ease;
}
.pt-row .chev::before { width: 14px; height: 1.5px; }
.pt-row .chev::after { width: 1.5px; height: 14px; }
.pt-row.open .chev {
  background: var(--gsc-dark);
  border-color: var(--gsc-dark);
}
.pt-row.open .chev::before,
.pt-row.open .chev::after { background: #fff; }
.pt-row.open .chev::after { transform: rotate(90deg); }

.pt-row .row-body {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: clamp(28px, 3vw, 48px);
  padding: 8px 0 36px;
  align-items: start;
}
.pt-row .body-photo {
  border-radius: var(--r-md);
  overflow: hidden;
  position: relative;
  aspect-ratio: 4/5;
}
.pt-row .body-photo .ph {
  position: absolute; inset: 0; border-radius: 0;
}
.pt-row .body-photo .ph .fig { font-size: 88px; }
.pt-row .body-cols {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: clamp(24px, 3vw, 56px);
}
.pt-row .bio-text {
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
  color: var(--gsc-dark);
  font-weight: 400;
  text-wrap: pretty;
  max-width: 52ch;
}
.pt-row .body-cols h4 {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin: 0 0 14px;
}
.pt-row .bul-list {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 10px;
}
.pt-row .bul-list li {
  font-size: 16px;
  color: var(--gsc-dark);
  font-weight: 400;
  position: relative;
  padding-left: 20px;
  line-height: 1.45;
}
.pt-row .bul-list li::before {
  content: "→";
  position: absolute;
  left: 0;
  color: var(--gsc-mid);
  font-weight: 600;
}
.pt-row .form-list {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column;
  border-top: 1px solid var(--hairline);
}
.pt-row .form-list li {
  border-bottom: 1px solid var(--hairline);
  padding: 12px 0;
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 16px;
  align-items: baseline;
}
.pt-row .form-list .lab {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.pt-row .form-list .v {
  font-size: 15px;
  color: var(--gsc-dark);
  font-weight: 400;
  line-height: 1.45;
}

/* Mobile */
.mobile .pt-row .row-summary {
  grid-template-columns: 56px 1fr 36px;
  gap: 14px;
  padding: 16px 0;
}
.mobile .pt-row .thumb { width: 56px; height: 56px; }
.mobile .pt-row .row-specs { display: none; }
.mobile .pt-row .ident h3 { font-size: 17px; }
.mobile .pt-row .ident .role { font-size: 12px; }
.mobile .pt-row .row-body {
  grid-template-columns: 1fr;
  gap: 20px;
  padding-bottom: 28px;
}
.mobile .pt-row .body-photo { aspect-ratio: 4/3; max-width: 220px; }
.mobile .pt-row .body-cols { grid-template-columns: 1fr; gap: 24px; }

/* ============================================
   Pacchetti
   ============================================ */
.pt-pack-wrap {
  background: var(--paper-2);
  padding: clamp(80px, 8vw, 120px) var(--pad-page);
}
.pt-pack {
  max-width: 1480px;
  margin: 0 auto;
}
.pt-pack .pack-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px, 5vw, 80px);
  margin-bottom: clamp(40px, 4vw, 64px);
  align-items: end;
}
.pt-pack .pack-intro h2 {
  font-size: var(--fs-h2);
  margin-top: 14px;
}
.pt-pack .pack-intro p {
  color: var(--ink-soft);
  font-size: 17px;
  max-width: 52ch;
  margin-bottom: 24px;
}
.pt-pack .pack-intro b { color: var(--gsc-dark); font-weight: 600; }
.pt-pack .hint-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  border-top: 1px solid var(--hairline);
  padding-top: 22px;
}
.pt-pack .hint .lab {
  display: block;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: 6px;
}
.pt-pack .hint b {
  font-size: 15px;
  font-weight: 500;
  color: var(--gsc-dark);
}

.pt-pack .pack-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 32px;
}
.pt-pack .pack {
  background: #fff;
  border: 1px solid var(--hairline);
  border-radius: var(--r-md);
  padding: 28px 28px 32px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: relative;
  transition: transform .25s ease, box-shadow .25s ease;
}
.pt-pack .pack:hover { transform: translateY(-3px); box-shadow: var(--shadow-soft); }
.pt-pack .pack.best {
  background: var(--gsc-dark);
  color: #fff;
  border-color: var(--gsc-dark);
}
.pt-pack .pack .ribbon {
  position: absolute;
  top: -12px;
  right: 24px;
  background: var(--gsc-bright);
  color: var(--gsc-dark);
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.pt-pack .pack .head {
  display: flex; justify-content: space-between; align-items: center;
}
.pt-pack .pack .head .num b {
  font-size: 36px;
  font-weight: 600;
  letter-spacing: -0.03em;
  display: inline;
  color: inherit;
}
.pt-pack .pack .head .num small {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-left: 8px;
}
.pt-pack .pack.best .head .num small { color: var(--gsc-soft); }
.pt-pack .pack .head .tag {
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 500;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--paper-2);
  color: var(--ink-soft);
}
.pt-pack .pack.best .head .tag {
  background: rgba(255,255,255,.10);
  color: var(--gsc-bright);
}
.pt-pack .pack .price-row {
  display: flex;
  align-items: baseline;
  gap: 6px;
  border-top: 1px solid var(--hairline);
  padding-top: 14px;
  margin-top: 4px;
}
.pt-pack .pack.best .price-row { border-color: rgba(255,255,255,.14); }
.pt-pack .pack .price-row .cur {
  font-size: 22px;
  font-weight: 500;
  color: var(--ink-soft);
}
.pt-pack .pack.best .price-row .cur { color: var(--gsc-soft); }
.pt-pack .pack .price-row .num {
  font-size: 56px;
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1;
}
.pt-pack .pack .price-row small {
  font-size: 13px;
  color: var(--ink-mute);
  margin-left: 4px;
}
.pt-pack .pack.best .price-row small { color: var(--gsc-soft); opacity: .8; }
.pt-pack .pack .per {
  font-size: 13px;
  color: var(--ink-mute);
}
.pt-pack .pack .per b {
  color: var(--gsc-dark);
  font-weight: 600;
}
.pt-pack .pack.best .per { color: rgba(255,255,255,.7); }
.pt-pack .pack.best .per b { color: var(--gsc-bright); }

.pt-pack .pack ul {
  list-style: none; padding: 0; margin: 8px 0 0;
  display: flex; flex-direction: column; gap: 10px;
  border-top: 1px solid var(--hairline);
  padding-top: 18px;
}
.pt-pack .pack.best ul { border-color: rgba(255,255,255,.14); }
.pt-pack .pack ul li {
  font-size: 14px;
  position: relative;
  padding-left: 22px;
  color: var(--ink-soft);
  line-height: 1.5;
}
.pt-pack .pack.best ul li { color: rgba(255,255,255,.9); }
.pt-pack .pack ul li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--gsc-mid);
  font-weight: 700;
}
.pt-pack .pack.best ul li::before { color: var(--gsc-bright); }
.pt-pack .pack .note {
  font-size: 13px;
  color: var(--ink-mute);
  font-style: italic;
  border-top: 1px dashed var(--hairline);
  padding-top: 14px;
  margin-top: 6px;
}
.pt-pack .pack.best .note {
  color: rgba(255,255,255,.7);
  border-color: rgba(255,255,255,.14);
}
.pt-pack .pack .btn {
  margin-top: 8px;
  justify-content: center;
}

.pt-pack .pack-foot {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
  background: #fff;
  border: 1px solid var(--hairline);
  border-radius: var(--r-md);
  overflow: hidden;
}
.pt-pack .pack-foot .cell {
  padding: 22px 24px;
  border-right: 1px solid var(--hairline);
}
.pt-pack .pack-foot .cell:last-child { border-right: 0; }
.pt-pack .pack-foot .cell .lab {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-mute);
  display: block;
  margin-bottom: 6px;
}
.pt-pack .pack-foot .cell b {
  font-size: 16px;
  font-weight: 500;
  color: var(--gsc-dark);
  display: block;
  margin-bottom: 4px;
  letter-spacing: -0.01em;
}
.pt-pack .pack-foot .cell small {
  font-size: 12px;
  color: var(--ink-mute);
  line-height: 1.4;
  display: block;
}

.mobile .pt-pack .pack-intro { grid-template-columns: 1fr; gap: 16px; align-items: start; }
.mobile .pt-pack .hint-row { grid-template-columns: 1fr; gap: 14px; }
.mobile .pt-pack .pack-grid { grid-template-columns: 1fr; gap: 14px; }
.mobile .pt-pack .pack-foot { grid-template-columns: 1fr; }
.mobile .pt-pack .pack-foot .cell {
  border-right: 0;
  border-bottom: 1px solid var(--hairline);
}
.mobile .pt-pack .pack-foot .cell:last-child { border-bottom: 0; }
/* ============================================
   Garden Sporting Center — Service detail page
   New sections only. Reuses tokens from styles.css
   ============================================ */

/* ---------- Hero (service variant) ---------- */
.svc-hero {
  position: relative;
  height: 78vh;
  min-height: 560px;
  max-height: 760px;
  color: #fff;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}
.svc-hero.center { align-items: center; text-align: center; }
.svc-hero .ph { position: absolute; inset: 0; border-radius: 0; }
.svc-hero .scrim {
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(18,51,44,.45) 0%, rgba(18,51,44,0) 30%, rgba(18,51,44,.20) 55%, rgba(18,51,44,.85) 100%);
}
.svc-hero.center .scrim {
  background:
    radial-gradient(ellipse at 50% 50%, rgba(18,51,44,.55), rgba(18,51,44,.15) 50%, rgba(18,51,44,.7) 100%);
}
.svc-hero .copy {
  position: relative;
  padding: 0 var(--pad-page) clamp(56px, 6vw, 96px);
  max-width: 1480px;
  margin: 0 auto;
  width: 100%;
}
.svc-hero.center .copy { padding: 0 var(--pad-page); display: flex; flex-direction: column; align-items: center; }
.svc-hero .breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.78);
  margin-bottom: 28px;
}
.svc-hero .breadcrumb a { opacity: .8; transition: opacity .2s; }
.svc-hero .breadcrumb a:hover { opacity: 1; }
.svc-hero .breadcrumb .sep { opacity: .4; }
.svc-hero .breadcrumb .eyebrow-inline {
  color: #BCDDC5;
  font-size: inherit;
  letter-spacing: inherit;
  font-weight: 600;
  margin: 0;
  padding-left: 4px;
  gap: 14px;
}
.svc-hero .breadcrumb .eyebrow-inline::before {
  background: #BCDDC5;
  opacity: .7;
  width: 36px;
}
.svc-hero h1 {
  font-size: var(--fs-display);
  max-width: 16ch;
  margin-bottom: 22px;
  font-weight: 600;
}
.svc-hero.center h1 { max-width: 18ch; }
.svc-hero .lede {
  font-size: clamp(17px, 1.2vw, 20px);
  max-width: 56ch;
  color: rgba(255,255,255,.92);
  font-weight: 300;
  margin-bottom: 32px;
}
.svc-hero.center .lede { margin-left: auto; margin-right: auto; }
.svc-hero .actions { display: flex; gap: 12px; flex-wrap: wrap; }
.svc-hero.center .actions { justify-content: center; }

.mobile .svc-hero { height: auto; min-height: 0; max-height: none; }
.mobile .svc-hero .copy { padding: 56vh 24px 36px; }
.mobile .svc-hero.center .copy { padding: 80px 24px 60px; }

/* ============================================
   50/50 Service blocks (reuses .feature-row from features stylesheet,
   but adds wrapper + intro)
   ============================================ */
.svc-blocks { padding: clamp(80px, 8vw, 120px) var(--pad-page); max-width: 1480px; margin: 0 auto; }
.svc-blocks .feature-row { margin-bottom: clamp(80px, 9vw, 140px); }
.svc-blocks .feature-row:last-child { margin-bottom: 0; }

/* Number indicator on each block */
.feature-row .number {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 13px;
  letter-spacing: .12em;
  color: var(--gsc-mid);
  display: inline-flex; align-items: center; gap: 12px;
  margin-bottom: 18px;
  font-weight: 500;
}
.feature-row .number::before {
  content: ""; width: 28px; height: 1px; background: var(--gsc-mid);
}

/* ============================================
   Orari + Abbonamenti
   ============================================ */
.svc-schedule-wrap {
  background: var(--paper-2);
  padding: clamp(80px, 8vw, 120px) var(--pad-page);
}
.svc-schedule {
  max-width: 1480px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: clamp(32px, 4vw, 56px);
  align-items: stretch;
}

.schedule-card {
  background: #fff;
  border-radius: var(--r-lg);
  padding: clamp(32px, 3vw, 48px);
  display: flex;
  flex-direction: column;
}
.schedule-card .head {
  display: flex; align-items: end; justify-content: space-between;
  gap: 24px; flex-wrap: wrap;
  margin-bottom: 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--hairline);
}
.schedule-card .head h3 {
  font-size: clamp(26px, 2.2vw, 36px);
  margin-bottom: 8px;
  max-width: 16ch;
}
.schedule-card .head p { color: var(--ink-soft); font-size: 14px; max-width: 38ch; }
.schedule-card .week-toggle {
  display: inline-flex;
  background: var(--paper);
  border: 1px solid var(--hairline);
  border-radius: 999px;
  padding: 4px;
  font-size: 13px;
  font-weight: 500;
}
.schedule-card .week-toggle button {
  border: 0;
  background: transparent;
  padding: 8px 16px;
  border-radius: 999px;
  cursor: pointer;
  color: var(--ink-soft);
  font: inherit;
}
.schedule-card .week-toggle button.active {
  background: var(--gsc-dark); color: #fff;
}

/* Preview placeholder (instead of inline table — invites PDF download) */
.schedule-preview {
  position: relative;
  border-radius: var(--r-md);
  overflow: hidden;
  aspect-ratio: 16/9;
  border: 1px solid var(--hairline);
}
.schedule-preview .ph {
  position: absolute;
  inset: 0;
  border-radius: 0;
}
.schedule-preview .ph .fig {
  font-size: 132px;
  font-weight: 700;
  color: rgba(18,51,44,.10);
  letter-spacing: 0.02em;
}
.schedule-preview-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 22px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(250,247,242,0) 50%, rgba(250,247,242,.7) 100%);
}
.schedule-preview .lock-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border: 1px solid var(--hairline);
  border-radius: 999px;
  padding: 8px 16px 8px 12px;
  font-size: 12px;
  font-weight: 500;
  color: var(--gsc-dark);
  box-shadow: var(--shadow-soft);
}
.schedule-preview .lock-pill .dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--gsc-bright);
  flex: none;
}
.mobile .schedule-preview { aspect-ratio: 4/3; }

.schedule-table {
  display: grid;
  grid-template-columns: 110px repeat(7, 1fr);
  font-size: 13px;
  border: 1px solid var(--hairline);
  border-radius: var(--r-md);
  overflow: hidden;
}
.schedule-table .cell {
  padding: 10px 8px;
  border-right: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
  min-height: 44px;
  display: flex; align-items: center; justify-content: center;
  text-align: center;
  background: #fff;
}
.schedule-table .cell:nth-child(8n) { border-right: 0; }
.schedule-table .cell.row-last { border-bottom: 0; }
.schedule-table .cell.head {
  background: var(--paper-2);
  font-weight: 600;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.schedule-table .cell.time {
  background: var(--paper);
  font-weight: 500;
  color: var(--ink-soft);
  font-feature-settings: "tnum";
  justify-content: flex-start;
  padding-left: 14px;
}
.schedule-table .cell .pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.2;
  width: 100%;
  max-width: 100%;
}
.schedule-table .cell .pill.fit {
  background: rgba(74,178,120,.16); color: var(--gsc-dark);
}
.schedule-table .cell .pill.cor {
  background: rgba(2,103,71,.14); color: var(--gsc-mid);
}
.schedule-table .cell .pill.nuo {
  background: rgba(127,196,214,.25); color: #1f5664;
}
.schedule-table .cell .pill.muted {
  background: var(--paper);
  color: var(--ink-mute);
  font-style: italic;
}

.schedule-card .legend {
  display: flex; gap: 16px; flex-wrap: wrap;
  margin-top: 18px;
  font-size: 12px; color: var(--ink-mute);
}
.schedule-card .legend span { display: inline-flex; align-items: center; gap: 8px; }
.schedule-card .legend .sw { width: 12px; height: 12px; border-radius: 4px; }
.schedule-card .legend .fit { background: rgba(74,178,120,.6); }
.schedule-card .legend .cor { background: var(--gsc-mid); }
.schedule-card .legend .nuo { background: #7fc4d6; }

.schedule-card .download {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid var(--hairline);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.schedule-card .download .info {
  display: flex; align-items: center; gap: 14px;
}
.schedule-card .download .glyph {
  width: 44px; height: 44px;
  border-radius: 12px;
  background: var(--gsc-soft);
  color: var(--gsc-dark);
  display: grid; place-items: center;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .04em;
}
.schedule-card .download .info b { font-size: 14px; font-weight: 600; display: block; }
.schedule-card .download .info small { font-size: 12px; color: var(--ink-mute); }

/* Abbonamento card */
.subscribe-card {
  background: var(--gsc-dark);
  color: #fff;
  border-radius: var(--r-lg);
  padding: clamp(32px, 3vw, 48px);
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}
.subscribe-card::before {
  content: "";
  position: absolute;
  right: -100px; top: -100px;
  width: 360px; height: 360px;
  background: radial-gradient(circle, var(--gsc-bright), transparent 60%);
  opacity: .22;
  filter: blur(20px);
  pointer-events: none;
}
.subscribe-card > * { position: relative; z-index: 1; }
.subscribe-card .eyebrow { color: var(--gsc-bright); margin-bottom: 22px; }
.subscribe-card .eyebrow::before { background: var(--gsc-bright); }
.subscribe-card h3 {
  font-size: clamp(28px, 2.4vw, 40px);
  margin-bottom: 14px;
  max-width: 14ch;
}
.subscribe-card p {
  color: rgba(255,255,255,.78);
  font-size: 15px;
  margin-bottom: 28px;
  max-width: 40ch;
}
.subscribe-card .price-row {
  display: flex; align-items: baseline; gap: 6px;
  margin-bottom: 24px;
}
.subscribe-card .price-row .num {
  font-size: 64px; font-weight: 600; color: #fff;
  letter-spacing: -0.03em; line-height: 1;
}
.subscribe-card .price-row .cur { font-size: 24px; color: var(--gsc-bright); }
.subscribe-card .price-row small { font-size: 13px; color: rgba(255,255,255,.6); margin-left: 8px; }
.subscribe-card ul {
  list-style: none; padding: 0; margin: 0 0 32px;
  font-size: 14px; color: rgba(255,255,255,.85);
  display: flex; flex-direction: column; gap: 10px;
}
.subscribe-card ul li { display: flex; gap: 10px; align-items: flex-start; }
.subscribe-card ul li::before {
  content: "✓"; color: var(--gsc-bright); font-weight: 700; flex: none;
}
.subscribe-card .actions { margin-top: auto; display: flex; flex-direction: column; gap: 10px; }
.subscribe-card .micro {
  text-align: center;
  font-size: 12px;
  color: rgba(255,255,255,.55);
  margin-top: 6px;
}

.mobile .svc-schedule { grid-template-columns: 1fr; }
.mobile .schedule-table { grid-template-columns: 80px repeat(7, 1fr); font-size: 11px; }
.mobile .schedule-table .cell { padding: 8px 4px; min-height: 38px; }
.mobile .schedule-table .cell .pill { font-size: 10px; padding: 3px 4px; }

/* ============================================
   FAQ accordion
   ============================================ */
.svc-faq {
  padding: clamp(80px, 8vw, 120px) var(--pad-page);
  max-width: 1480px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1.6fr;
  gap: clamp(32px, 5vw, 96px);
  align-items: start;
}
.svc-faq .faq-intro h2 {
  font-size: var(--fs-h2);
  margin: 14px 0 22px;
  max-width: 14ch;
}
.svc-faq .faq-intro p {
  color: var(--ink-soft);
  font-size: 16px;
  margin-bottom: 28px;
  max-width: 36ch;
}
.svc-faq .faq-intro .help-card {
  background: var(--paper-2);
  border-radius: var(--r-md);
  padding: 22px;
  display: flex;
  gap: 16px;
  align-items: center;
}
.svc-faq .faq-intro .help-card .glyph {
  width: 48px; height: 48px;
  background: var(--gsc-dark);
  color: var(--gsc-bright);
  border-radius: 12px;
  display: grid; place-items: center;
  font-size: 18px;
  flex: none;
}
.svc-faq .faq-intro .help-card b { display: block; font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.svc-faq .faq-intro .help-card small { font-size: 13px; color: var(--ink-soft); display: block; line-height: 1.4; }

.faq-list {
  display: flex;
  flex-direction: column;
}
.faq-item {
  border-top: 1px solid var(--hairline);
}
.faq-item:last-child { border-bottom: 1px solid var(--hairline); }
.faq-item summary {
  list-style: none;
  cursor: pointer;
  padding: 28px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  font-size: clamp(17px, 1.2vw, 20px);
  font-weight: 500;
  color: var(--gsc-dark);
  transition: color .2s ease;
}
.faq-item summary:hover { color: var(--gsc-mid); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary .icon {
  flex: none;
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 1px solid var(--hairline);
  display: grid; place-items: center;
  position: relative;
  transition: background .25s ease, border-color .25s ease, transform .3s ease;
}
.faq-item summary .icon::before,
.faq-item summary .icon::after {
  content: "";
  position: absolute;
  background: var(--gsc-dark);
  transition: transform .3s ease, background .25s ease;
}
.faq-item summary .icon::before { width: 14px; height: 1.5px; }
.faq-item summary .icon::after { width: 1.5px; height: 14px; }
.faq-item[open] summary .icon {
  background: var(--gsc-dark);
  border-color: var(--gsc-dark);
}
.faq-item[open] summary .icon::before,
.faq-item[open] summary .icon::after { background: #fff; }
.faq-item[open] summary .icon::after { transform: rotate(90deg); }
.faq-item .answer {
  padding: 0 80px 32px 0;
  color: var(--ink-soft);
  font-size: 16px;
  line-height: 1.65;
  max-width: 64ch;
}
.faq-item .answer p + p { margin-top: 12px; }
.faq-item .answer ul {
  margin: 12px 0 0;
  padding-left: 18px;
  color: var(--ink-soft);
}
.faq-item .answer ul li { margin-bottom: 6px; }

.mobile .svc-faq { grid-template-columns: 1fr; gap: 32px; }
.mobile .faq-item summary { font-size: 16px; padding: 22px 0; gap: 16px; }
.mobile .faq-item .answer { padding-right: 0; padding-bottom: 24px; font-size: 15px; }

/* ============================================
   Contatti
   ============================================ */
.svc-contact-wrap {
  background: var(--gsc-dark);
  color: #fff;
  padding: clamp(80px, 8vw, 120px) var(--pad-page);
}
.svc-contact {
  max-width: 1480px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: clamp(40px, 5vw, 80px);
  align-items: stretch;
}
.svc-contact .info { display: flex; flex-direction: column; gap: 28px; }
.svc-contact .info .eyebrow { color: var(--gsc-bright); }
.svc-contact .info .eyebrow::before { background: var(--gsc-bright); }
.svc-contact .info h2 {
  font-size: var(--fs-h2);
  max-width: 14ch;
  margin-top: 8px;
}
.svc-contact .info > p {
  color: rgba(255,255,255,.72);
  font-size: 16px;
  max-width: 44ch;
}
.svc-contact .info .blocks {
  display: grid; grid-template-columns: 1fr 1fr; gap: 18px;
  margin-top: 8px;
}
.svc-contact .info .block {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--r-md);
  padding: 20px;
}
.svc-contact .info .block .lab {
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gsc-bright);
  font-weight: 500;
  margin-bottom: 8px;
  display: block;
}
.svc-contact .info .block b { display: block; font-size: 16px; font-weight: 500; line-height: 1.4; }
.svc-contact .info .block small { font-size: 13px; color: rgba(255,255,255,.62); display: block; margin-top: 4px; }

.svc-contact .map-ph {
  border-radius: var(--r-md);
  aspect-ratio: 16/8;
  margin-top: auto;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
}

.contact-form {
  background: #fff;
  color: var(--ink);
  border-radius: var(--r-lg);
  padding: clamp(28px, 2.8vw, 44px);
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.contact-form h3 {
  font-size: clamp(22px, 1.8vw, 28px);
  margin-bottom: 4px;
}
.contact-form .sub {
  font-size: 14px;
  color: var(--ink-soft);
  margin-bottom: 12px;
}
.contact-form .row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.contact-form .field {
  display: flex; flex-direction: column; gap: 6px;
}
.contact-form .field label {
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-mute);
  font-weight: 500;
}
.contact-form .field input,
.contact-form .field select,
.contact-form .field textarea {
  background: var(--paper);
  border: 1px solid var(--hairline);
  border-radius: var(--r-sm);
  padding: 12px 14px;
  font: inherit;
  font-size: 15px;
  color: var(--ink);
  outline: none;
  transition: border-color .2s ease, background .2s ease;
}
.contact-form .field input:focus,
.contact-form .field select:focus,
.contact-form .field textarea:focus {
  border-color: var(--gsc-mid);
  background: #fff;
}
.contact-form .field textarea { resize: vertical; min-height: 120px; }
.contact-form .field select {
  appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%2312332C' stroke-width='1.5' fill='none'/></svg>");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 38px;
}
.contact-form .privacy {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 13px;
  color: var(--ink-soft);
  line-height: 1.5;
}
.contact-form .privacy input { margin-top: 3px; accent-color: var(--gsc-mid); }
.contact-form .privacy a { color: var(--gsc-mid); text-decoration: underline; text-underline-offset: 3px; }
.contact-form .submit {
  margin-top: 6px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.contact-form .submit small { font-size: 12px; color: var(--ink-mute); }

.mobile .svc-contact { grid-template-columns: 1fr; gap: 32px; }
.mobile .svc-contact .info .blocks { grid-template-columns: 1fr; }
.mobile .contact-form .row { grid-template-columns: 1fr; }
/* GSC chrome additions: mobile menu, footer */

.gsc-burger {
  display: none;
  width: 44px; height: 44px;
  border: 1px solid var(--hairline);
  background: transparent;
  border-radius: 999px;
  position: relative;
  cursor: pointer;
}
.gsc-burger span,
.gsc-burger::before,
.gsc-burger::after {
  content: '';
  position: absolute; left: 12px; right: 12px;
  height: 2px; background: var(--gsc-dark);
  transition: transform .25s ease, opacity .25s ease;
}
.gsc-burger::before { top: 14px; }
.gsc-burger span    { top: 21px; }
.gsc-burger::after  { top: 28px; }
.gsc-burger.is-open::before { top: 21px; transform: rotate(45deg); }
.gsc-burger.is-open::after  { top: 21px; transform: rotate(-45deg); }
.gsc-burger.is-open span    { opacity: 0; }

.gsc-mobile-menu {
  position: fixed;
  inset: 0;
  background: var(--paper);
  z-index: 49;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 80px 24px 40px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
}
.gsc-mobile-menu.is-open {
  opacity: 1;
  pointer-events: auto;
}
.gsc-mobile-menu a {
  font-size: 22px;
  font-weight: 600;
  color: var(--gsc-dark);
}
.gsc-mobile-menu .btn { font-size: 16px; }

@media (max-width: 980px) {
  .gsc-nav, .gsc-header-actions .pill-link { display: none; }
  .gsc-burger { display: inline-flex; align-items: center; justify-content: center; }
}

/* Footer */
.gsc-footer {
  background: var(--gsc-dark);
  color: rgba(255,255,255,.75);
  padding: 80px var(--pad-page) 40px;
  margin-top: 60px;
}
.gsc-footer-inner {
  max-width: 1480px; margin: 0 auto;
  display: grid; gap: 40px;
}
.gsc-footer-brand p {
  max-width: 380px;
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,.65);
}
.gsc-footer-cols {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 40px;
  padding-top: 32px;
  border-top: 1px solid rgba(255,255,255,.08);
}
.gsc-footer-col h4 {
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gsc-bright);
  margin-bottom: 18px;
  font-weight: 500;
}
.gsc-footer-col ul { list-style: none; padding: 0; margin: 0; }
.gsc-footer-col li { margin-bottom: 10px; }
.gsc-footer-col a, .gsc-footer-col span {
  font-size: 14px;
  color: rgba(255,255,255,.7);
  transition: color .2s ease;
}
.gsc-footer-col a:hover { color: var(--gsc-bright); }
.gsc-footer-legal {
  font-size: 12px;
  color: rgba(255,255,255,.45);
  line-height: 1.7;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,.06);
}
.gsc-footer-legal p { margin: 0; }
.gsc-footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.06);
  flex-wrap: wrap;
  gap: 16px;
}
.gsc-copyright {
  font-size: 12px;
  color: rgba(255,255,255,.4);
}

/* Admin editor: nascondi UI lang picker (non rilevante per sito IT-only) */
.dcms-ui-lang-picker { display: none !important; }

/* =============================================
   NAV DROPDOWN — mouseover sotto-sezioni
   ============================================= */
.gsc-nav-group {
  position: relative;
}
.gsc-nav-group > .gsc-nav-trigger {
  /* eredita stile da .gsc-nav a */
  cursor: default;
}
.gsc-nav-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 280px;
  padding: 12px;
  background: #FFFFFF;
  border: 1px solid var(--hairline);
  border-radius: var(--r-md);
  box-shadow: 0 12px 32px rgba(18,51,44,.10), 0 2px 6px rgba(18,51,44,.04);
  display: flex;
  flex-direction: column;
  gap: 2px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity .18s ease, visibility .18s ease, transform .18s ease;
  z-index: 100;
}
.gsc-nav-group:hover > .gsc-nav-dropdown,
.gsc-nav-group:focus-within > .gsc-nav-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
/* Bridge zone per evitare gap di hover tra trigger e dropdown */
.gsc-nav-dropdown::before {
  content: "";
  position: absolute;
  top: -10px;
  left: 0;
  right: 0;
  height: 10px;
}
.gsc-nav-dropdown a {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 10px 14px;
  border-radius: var(--r-sm);
  text-align: left;
  text-decoration: none;
  color: var(--gsc-dark);
  transition: background .15s ease;
  white-space: normal;
}
.gsc-nav-dropdown-label,
.gsc-nav-dropdown-desc {
  text-align: left;
  width: 100%;
}
.gsc-nav-dropdown a:hover {
  background: var(--paper-2);
}
.gsc-nav-dropdown-label {
  font-size: 14px;
  font-weight: 500;
  color: var(--gsc-dark);
}
.gsc-nav-dropdown-desc {
  font-size: 12px;
  color: var(--ink-mute);
  line-height: 1.35;
}
.gsc-header.is-dark .gsc-nav-dropdown {
  background: #0f2924;
  border-color: rgba(255,255,255,.08);
}
.gsc-header.is-dark .gsc-nav-dropdown a:hover { background: rgba(255,255,255,.06); }
.gsc-header.is-dark .gsc-nav-dropdown-label { color: #fff; }
.gsc-header.is-dark .gsc-nav-dropdown-desc { color: rgba(255,255,255,.55); }

/* Mobile menu sub-items */
.gsc-mobile-menu .gsc-mobile-sub {
  font-size: 14px;
  font-weight: 400;
  color: var(--ink-soft);
  padding-left: 20px;
  margin-top: -6px;
}