/* Shared vertical rhythm from the FitnessPoint reference. */
:root{
  --space-title-subtitle:6px;
  --space-label-control:8px;
  --space-content-action:12px;
  --space-item-row:16px;
  --space-heading-content:24px;
  --section-heading-gap:68px;
  --section-inset:calc(var(--section-heading-gap) / 2);
  --space-cta-gap:28px;
  --card-padding:21px;
}

/* Adjacent sections share one gap instead of adding two full paddings. */
#contenido>.section{padding-block:var(--section-inset)}
#contenido>.section:first-child{padding-top:var(--section-heading-gap)}
#contenido>.section:nth-last-child(2){padding-bottom:var(--space-cta-gap)}
.hero{padding-top:52px;padding-bottom:var(--section-inset)}
.hero-copy{padding-block:0}
.hero-actions{margin-top:28px}
.benefit-cards{margin-top:var(--space-heading-content);padding-bottom:0}

/* Introductory labels, headings and the content they introduce. */
.section-heading{margin-bottom:var(--space-heading-content)}
.overview-copy>p,.faq-section .faq-intro>p{margin-top:var(--space-title-subtitle)}
.split-heading{row-gap:var(--space-title-subtitle)}

/* Equivalent cards use the same inset, row gap and text spacing. */
.benefit-cards,.audience-grid,.steps,.faq-section .faq-list{row-gap:var(--space-item-row)}
.page-inicio .benefit-card,.page-inicio .audience-card{padding:var(--card-padding)}
.page-inicio .benefit-card{min-height:128px;padding:18px}
.benefit-copy p{margin-top:var(--space-title-subtitle)}
.audience-card h3{margin:var(--space-content-action) 0 var(--space-title-subtitle);min-height:0}
.audience-card .text-link{margin-top:var(--space-content-action)}

/* Implementation: plain numbers, directly on the card. */
.steps{margin:0}
.steps li{display:grid;grid-template-rows:auto auto 1fr;align-content:start;padding:var(--card-padding)}
.step-number{position:static;display:block;width:auto;height:auto;margin:0 0 var(--space-content-action);padding:0;background:none;border:0;border-radius:0;box-shadow:none;color:var(--sky);font-size:1.5rem;line-height:1;font-weight:700}
.steps .step-title{margin-bottom:var(--space-title-subtitle)}
.steps p{margin:0}
.steps li:not(:last-child)::after{top:33px}

/* Modules and overview follow the same heading / content / action spacing. */
.feature-detail-copy{padding:29px}
.feature-result{padding:29px}
.feature-detail{min-height:0}
.feature-kicker,.result-label{margin-bottom:var(--space-content-action)}
.feature-detail .feature-title,.feature-result p{margin-bottom:0;margin-top:0}
.feature-detail .feature-title{margin-bottom:var(--space-title-subtitle)}
.feature-caption{margin-top:var(--space-content-action)}
.result-icon{margin:0 0 var(--space-content-action)}
.feature-result p{margin-top:var(--space-title-subtitle)}
.overview-grid{row-gap:var(--space-heading-content)}
.check-list{margin:20px 0}
.check-list li{margin:0 0 10px}
.check-list li:last-child{margin-bottom:0}

/* FAQ composition is preserved with the shared spacing scale. */
.faq-section .faq-intro .text-link{margin-top:var(--space-content-action)}
.faq-section .faq-list{margin-top:var(--space-heading-content)}
.faq-section .faq-list summary{min-height:128px;padding:var(--card-padding);gap:var(--space-heading-content)}
.faq-section .faq-list details p{padding:0 var(--card-padding) var(--card-padding)}
.demo-form{padding:29px}
.demo-form input,.demo-form select,.demo-form textarea{margin:var(--space-label-control) 0 var(--space-item-row)}
.form-note,.form-status{margin-top:var(--space-content-action)}

/* CTA and footer retain the compact spacing established from FitnessPoint. */
.closing-cta{padding-bottom:var(--space-cta-gap)}

@media(max-width:1000px){
  :root{--section-heading-gap:58px}
  .hero{padding-top:46px}
}
@media(max-width:720px){
  :root{--section-heading-gap:44px;--space-cta-gap:22px}
  .hero{padding-top:38px}
  .hero-grid{row-gap:var(--space-heading-content)}
  .demo-form,.feature-detail-copy,.feature-result{padding:var(--card-padding)}
}
@media(max-width:650px){
  .split-heading>p{margin-top:var(--space-title-subtitle)}
  .steps li{grid-template-columns:32px minmax(0,1fr);grid-template-rows:auto auto;column-gap:var(--space-item-row)}
  .step-number{grid-row:1/3;margin:0}
  .steps .step-title,.steps p{grid-column:2}
  .faq-section .faq-list summary{min-height:112px;gap:var(--space-item-row)}
}

/* Neutral contact section: the heading leads; only the form has a card surface. */
.contact-section{background:#fff}
.demo-form{border:1px solid rgba(36,38,93,.12);box-shadow:0 10px 26px rgba(36,38,93,.091)}

/* Questions and demo form share one aligned, responsive section. */
.faq-contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px;align-items:start}
.faq-contact-grid .faq-column{min-width:0;padding:0;background:transparent;overflow:visible}
.faq-contact-grid .faq-column::before{content:none}
.faq-contact-grid .faq-intro{position:static;text-align:left;max-width:none;margin:0 0 var(--space-heading-content)}
.faq-contact-grid .faq-list{grid-template-columns:1fr;gap:var(--space-item-row);margin-top:0}
.faq-contact-grid .faq-list details{border:1px solid rgba(36,38,93,.14);border-radius:10px;background:#fff;box-shadow:0 3px 10px rgba(36,38,93,.035)}
.faq-contact-grid .faq-list details:hover,.faq-contact-grid .faq-list details[open]{border-color:rgba(36,38,93,.14);box-shadow:0 5px 14px rgba(36,38,93,.05)}
.faq-contact-grid .faq-list summary{min-height:52px;padding:16px;gap:16px;border-radius:10px}
.faq-contact-grid .faq-list details p{padding:0 16px 16px}
.demo-column{min-width:0}
.demo-intro{margin-bottom:var(--space-heading-content)}
.demo-intro p{margin-top:var(--space-title-subtitle);color:var(--muted)}
.faq-contact-grid .demo-form{padding:24px}
@media(max-width:1000px){.faq-contact-grid{gap:28px}}
@media(max-width:720px){.faq-contact-grid{grid-template-columns:1fr;gap:32px}}
