/* Reading hierarchy and mobile funnel. Original palette and copy are retained. */
:root { --space-xs: 8px; --space-sm: 16px; --space-md: 24px; --space-lg: 32px; --space-xl: 64px; }
h1, h2, h3 { text-wrap: balance; }
p, li { text-wrap: pretty; }
.section { padding-block: clamp(48px, 6vw, 80px); }
.section-intro { max-width: 760px; }
.section-intro h2 { font-size: clamp(32px, 3.6vw, 46px); line-height: 1.16; }
.section-intro > p { max-width: 65ch; }
.hero::before { background: radial-gradient(ellipse at 80% 42%, rgba(213,138,58,.16), transparent 60%); }
.hero-glow { display: none; }
.hero-inner { grid-template-columns: 1.12fr .88fr; grid-template-areas: 'heading product' 'action product' 'context product'; gap: 24px 48px; padding-block: 56px 40px; min-height: 0; }
.hero-heading { grid-area: heading; }
.hero-heading h1 { font-size: clamp(40px, 4.6vw, 60px); line-height: 1.08; }
.hero-product { grid-area: product; align-self: center; }
.hero-action { grid-area: action; }
.hero-facts { margin-top: 16px; gap: 8px 16px; }
.hero-facts span { padding: 0; border: 0; border-radius: 0; font-size: 12px; color: var(--cream); }
.hero-context { grid-area: context; max-width: 560px; }
.hero-bottom { padding-block: 16px; }
.journey-nav { background: var(--cream); border-bottom: 1px solid var(--line); }
.journey-nav > div { display: flex; justify-content: center; gap: 40px; }
.journey-nav a { display: inline-flex; align-items: center; min-height: 56px; padding: 8px 12px; font-size: 14px; font-weight: 700; text-decoration: none; }
.journey-nav a:hover { color: var(--accent-strong); }

/* Native disclosures work with touch, keyboard, and without JavaScript. */
.read-more { border: 0; border-top: 1px solid var(--line); background: transparent; }
.read-more > summary{ position: relative; min-height: 48px; padding: 12px 32px 12px 0; cursor: pointer; list-style: none; }
.read-more > summary { color: var(--accent-strong); font-size: 14px; font-weight: 700; }
.read-more > summary::-webkit-details-marker{ display: none; }
.read-more > summary::after{ position: absolute; top: 12px; right: 4px; content: '+'; font-family: var(--sans); font-size: 22px; font-weight: 400; line-height: 24px; }
.read-more[open] > summary::after{ content: '−'; }
 .hero-context { border-color: rgba(255,252,247,.2); }
.hero-context p { margin: 0 0 12px; font-size: 16px; line-height: 1.6; }
.hero-context .hero-daily { margin: 0; }
.section--espresso summary:focus-visible, .hero summary:focus-visible { outline-color: #e7b56d; }

/* Recognisable situations: short rows instead of a wall of small cards. */
#problema > .layout-wrap { max-width: 960px; }
#problema .section-intro { margin-bottom: 24px; }
#problema .situation-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 32px; }
#problema .situation-card--brief { flex-direction: row; align-items: baseline; gap: 16px; padding: 16px 0; border: 0; border-top: 1px solid var(--line); box-shadow: none; background: transparent; }
#problema .situation-card--brief h3 { margin: 0; font-size: 17px; font-weight: 500; line-height: 1.5; }
#problema .card-number { font-size: 13px; }
.pain-bridge .section-aside { font-family: var(--sans); font-size: 16px; font-style: normal; max-width: 65ch; text-align: left; }
.pain-bridge { display: flex; gap: 32px; align-items: center; margin-top: 24px; }
.pain-bridge .section-aside { margin: 0; }
.pain-bridge .button { flex: 0 0 auto; margin: 0; }

/* Each official cover travels with its own description. */
#producto { background: var(--cream); padding-bottom: 48px; }
.product-pair { gap: 32px; }
.product-card { display: grid; grid-template-columns: 120px minmax(0,1fr); align-content: start; column-gap: 24px; padding: 0; border: 0; background: transparent; }
.product-card__cover { grid-column: 1; grid-row: 1 / 4; align-self: start; }
.product-card__cover img { width: 120px; height: auto; filter: drop-shadow(0 8px 8px rgba(53,37,29,.12)); }
.product-card > .detail-kicker, .product-card > h3, .product-card > .product-descriptor { grid-column: 2; }
.product-card > .detail-kicker { margin: 0 0 8px; }
.product-card > h3 { margin: 0; font-size: 28px; }
.product-card > .product-descriptor { margin-block: 12px 0; font-size: 11px; line-height: 1.6; }
.product-card > .product-deck, .product-card > .product-card__detail { grid-column: 1 / -1; }
.product-card .product-deck { margin: 24px 0 16px; font-family: var(--sans); font-size: 17px; line-height: 1.6; }
.product-card__detail p { margin: 8px 0 0; color: var(--muted); font-size: 16px; }
.product-card__detail .product-hook { margin-top: 0; color: var(--accent-strong); font-size: 12px; font-weight: 800; }
.product-caption { margin-top: 24px; font-size: 12px; color: var(--muted); text-align: center; }
.product-previews { margin: 0; border: 0; padding-block: 64px 48px; }
.product-preview { border: 0; box-shadow: none; }
.product-preview__copy { padding: 24px; }
.product-preview__copy > p:not(.detail-kicker) { font-size: 16px; }
.product-preview .text-link { font-size: 14px; }
.product-previews__note { max-width: 76ch; margin: 24px auto 0; line-height: 1.6; }
#contenido { padding-block: 0 48px; }
#contenido .section-intro { margin-bottom: 24px; }
#contenido .section-intro h2 { font-size: 28px; }
.book-details { gap: 24px; align-items: start; }

#metodo { background: var(--paper); }
.method-steps--four { gap: 24px; }
.method-steps--four li, .method-steps--four li + li { padding: 0; border: 0; }
.method-steps p { font-size: 16px; }
.method-steps h3 { font-family: var(--sans); font-weight: 700; font-size: 18px; }
.method-count { width: 40px; height: 40px; font-size: 16px; }
#transformacion { background: var(--espresso-2); }
.before-after-grid { grid-template-columns: 1fr; gap: 0; }
.before-after-card { display: grid; grid-template-columns: 1fr 1.2fr; gap: 32px; min-height: 0; padding: 24px 0; border: 0; border-top: 1px solid rgba(255,252,247,.2); background: transparent; }
.before-after-card p, .before-after-card p + p { margin: 0; padding: 0; border: 0; font-size: 16px; }
.before-after-card p:first-child { color: rgba(255,252,247,.7); }
.before-after-card p + p { color: var(--paper); }
.before-after-card p span { margin-bottom: 8px; font-size: 11px; }
#transformacion .section-aside { font-size: 18px; }

/* A small cover for each digital tool; no inflated stacks or physical-book claims. */
.bonus-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 40px; }
.bonus-card { display: grid; grid-template-columns: 144px minmax(0,1fr); align-items: start; gap: 24px; min-height: 0; padding: 32px 0; border: 0; border-top: 1px solid rgba(255,252,247,.2); background: transparent; }
.bonus-card:last-child { grid-column: 1 / -1; max-width: 680px; }
.bonus-card__copy > span { color: #e7b56d; font-size: 11px; font-weight: 750; letter-spacing: .12em; }
.bonus-card h3 { margin: 8px 0 12px; color: var(--paper); font-family: var(--serif); font-size: 25px; font-weight: 500; line-height: 1.2; }
.bonus-card p { margin: 0; color: rgba(255,252,247,.84); font-size: 16px; line-height: 1.6; }
.bonus-cover { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: space-between; width: 144px; min-height: 208px; padding: 16px 12px; color: var(--espresso); background: var(--cream); border: 1px solid rgba(255,252,247,.3); box-shadow: 4px 4px 0 var(--espresso-soft), 0 12px 20px rgba(0,0,0,.16); text-align: center; }
.bonus-cover::before { position: absolute; inset: 7px; border: 1px solid currentColor; opacity: .25; content: ''; pointer-events: none; }
.bonus-cover__brand { font-size: 6px; font-weight: 750; letter-spacing: .09em; }
.bonus-cover svg { width: 44px; height: 44px; margin-block: 16px 12px; }
.bonus-cover__title { display: block; max-width: 15ch; font-family: var(--serif); font-size: 15px; font-weight: 500; line-height: 1.18; text-wrap: balance; }
.bonus-cover__number { margin-top: 16px; font-size: 7px; font-weight: 700; letter-spacing: .16em; }
.bonus-cover--2, .bonus-cover--5 { background: var(--accent-pale); }
.bonus-cover--3, .bonus-cover--6 { background: var(--accent-strong); color: var(--paper); }
.bonus-cover--4, .bonus-cover--7 { background: var(--espresso-soft); color: var(--cream); }

/* Keep the price beside the contents, with the full argument below. */
.summary-card { display: grid; grid-template-columns: 1.1fr .9fr; gap: 40px; max-width: none; padding: 40px; box-shadow: none; }
.summary-top { align-items: center; min-height: 0; padding-bottom: 24px; }
.summary-top h3 { font-size: 30px; }
.summary-list { grid-template-columns: 1fr; }
.summary-offer { display: flex; flex-direction: column; align-items: stretch; justify-content: center; gap: 16px; margin: 0; padding: 0 0 0 32px; border: 0; border-left: 1px solid var(--line); }
.summary-value b { max-width: none; font-size: 23px; }
.summary-price { text-align: left; }
.summary-price strong { margin: 12px 0; font-size: clamp(48px,5vw,64px); }
.summary-price > span { font-size: 14px; }
.summary-price__currency { margin-left: 0; }
.purchase-trust { grid-template-columns: 1fr 1fr; }
.purchase-trust li { font-size: 12px; }
.summary-offer .button { white-space: normal; }
.value-justification { margin: 24px 0 0; padding: 0; background: transparent; }
.value-justification .value-offer-card, .value-comparison > div { background: transparent; border: 0; padding: 24px 0; }
.value-offer-grid { column-gap: 40px; }
.value-items li, .value-offer-card > p:not(.value-offer-card__product), .value-comparison p { font-size: 15px; }
.value-justification__intro { font-size: 16px; }
.security-card { padding: 0; background: transparent; border: 0; }
.security-grid { gap: 32px; }
.security-card p { font-size: 16px; }
.guarantee-card { margin-top: 40px; }
.guarantee-card__copy > p:not(.eyebrow) { font-size: 16px; }
.fit-grid { align-items: start; gap: 24px; }
.fit-card { padding: 0; border-bottom: 1px solid var(--line); background: transparent; }
.fit-card .check-list { margin-top: 16px; }
.fit-card .check-list li { font-size: 16px; }
.fit-card .check-list strong { font-weight: 500; }
.value-question-copy { max-width: 65ch; padding-bottom: 24px; font-size: 16px; text-align: left; }
.faq-list details p { max-width: 65ch; }
.after-steps--five li { background: transparent; border: 0; border-top: 1px solid var(--line); padding: 16px 0; }
.after-steps--five { gap: 24px; }
.offer-card { background: transparent; box-shadow: none; padding-inline: 0; }
.offer-copy h2 { font-size: 64px; }

@media (max-width: 900px) {
  .hero-inner { gap: 24px; }
  .bonus-card { grid-template-columns: 112px minmax(0,1fr); gap: 20px; }
  .bonus-cover { width: 112px; min-height: 176px; padding: 14px 10px; }
  .bonus-cover__title { font-size: 12px; }
  .bonus-cover svg { width: 36px; height: 36px; margin-block: 12px; }
  .bonus-cover__brand { font-size: 5px; }
  .bonus-card h3 { font-size: 22px; }
  .summary-card { gap: 24px; padding: 24px; }
  .summary-offer { padding-left: 24px; }
  .product-card { grid-template-columns: 96px minmax(0,1fr); column-gap: 16px; }
  .product-card > h3 { font-size: 24px; }
}
@media (max-width: 680px) {
  .section-intro--center { text-align: left; }
  .section-intro--center > p:last-child { margin-inline: 0; }
  .hero-inner { grid-template-columns: minmax(0,1fr); grid-template-areas: 'heading' 'product' 'action' 'context'; gap: 24px; padding-block: 32px 24px; }
  .hero-heading h1 { font-size: clamp(34px,9.2vw,40px); }
  .hero-heading .eyebrow { display: none; }
  .hero-lede { font-size: 16px; line-height: 1.55; }
  .hero-product { max-width: 280px; justify-self: center; }
  .book-pair--hero { width: 260px; }
  .book-labels { margin-top: 8px; gap: 8px; flex-wrap: nowrap; }
  .book-labels span { padding: 0; border: 0; border-radius: 0; font-size: 9px; line-height: 1.5; }
  .hero-action .button { width: 100%; }
  .hero-facts { gap: 8px 16px; justify-content: center; }
  .hero-facts span { font-size: 12px; }
  .hero-context { width: 100%; }
  .journey-nav > div { width: calc(100% - 16px); gap: 0; justify-content: space-between; }
  .journey-nav a { min-height: 52px; padding: 8px; font-size: 12px; }
#problema .situation-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 20px; }
  #problema .situation-card--brief { padding: 16px 0; }
  #problema .situation-card--brief h3 { font-size: 17px; }
  .pain-bridge { flex-direction: column; align-items: stretch; gap: 24px; }
  .product-pair { gap: 32px; }
  .product-card { grid-template-columns: 96px minmax(0,1fr); }
  .product-card > h3 { font-size: 25px; }
  .product-card .product-deck { font-size: 16px; }
  .product-card__cover img { width: 96px; }
  .product-previews { padding-block: 48px 32px; }
  .product-previews__grid { gap: 24px; }
  .product-preview__copy { padding: 20px; }
  .product-previews__note { text-align: left; font-size: 12px; }
  .book-details { grid-template-columns: 1fr; gap: 0; }
  #contenido .section-intro h2 { font-size: 26px; }
  .method-steps--four { grid-template-columns: 1fr; gap: 0; }
  .method-steps--four li, .method-steps--four li + li, .method-steps--four li:nth-child(3) { display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 8px 16px; padding: 24px 0; border: 0; border-top: 1px solid var(--line); }
  .method-steps h3 { margin: 0; font-size: 18px; align-self: center; }
  .method-steps p { grid-column: 2; }
  .method-count { grid-row: 1 / 3; }
  .formula { font-size: 10px; letter-spacing: .05em; }
  .formula span { padding-inline: 4px; }
  .before-after-card { grid-template-columns: .85fr 1.15fr; gap: 20px; padding-block: 24px; }
  .before-after-card p { font-size: 16px; }
  .bonus-grid { grid-template-columns: 1fr; }
  .bonus-card { grid-template-columns: 104px minmax(0,1fr); gap: 20px; padding: 24px 0; }
  .bonus-cover { width: 104px; min-height: 168px; }
  .bonus-cover__title { font-size: 11px; }
  .bonus-card:last-child { grid-column: auto; }
  .bonus-card h3 { font-size: 23px; }
  .bonus-card p { font-size: 16px; }
  .summary-card { grid-template-columns: minmax(0,1fr); padding: 24px 20px; }
  .summary-top h3 { font-size: 28px; }
  .summary-offer { padding: 24px 0 0; border: 0; border-top: 1px solid var(--line); }
  .summary-price strong { font-size: 56px; }
  .summary-price > span { font-size: 14px; }
  .summary-value b { font-size: 23px; }
  .summary-list { gap: 0; }
  .summary-list small { font-size: 14px; }
  .summary-price__currency { max-width: none; }
  .summary-offer .button { white-space: normal; font-size: 14px; }
  .value-offer-grid { grid-template-columns: 1fr; gap: 0; }
  .value-offer-card { border-bottom: 1px solid var(--line); }
  .security-grid { grid-template-columns: 1fr; gap: 24px; }
  .security-card { padding: 0; }
  .security-card h3 { margin: 8px 0; }
  .security-card__number { display: none; }
  .guarantee-card { padding: 24px; }
  .fit-grid { grid-template-columns: 1fr; gap: 0; }
  .fit-card { padding: 0; }
  .fit-card + .fit-card { border-top: 0; }
  .faq-grid { gap: 24px; }
  .after-steps--five { grid-template-columns: 1fr; gap: 0; }
  .after-steps--five li { display: flex; gap: 16px; align-items: baseline; }
  .after-steps--five h3 { margin: 0; font-family: var(--sans); font-size: 16px; }
  .offer-copy h2 { font-size: 56px; }
}
@media (max-width: 360px) {
  .bonus-card { grid-template-columns: 88px minmax(0,1fr); gap: 16px; }
  .bonus-cover { width: 88px; min-height: 150px; padding: 12px 8px; }
  .bonus-cover__title { font-size: 10px; }
  .bonus-cover svg { width: 32px; height: 32px; }
  .bonus-card h3 { font-size: 21px; }
  .bonus-cover__brand { letter-spacing: 0; font-size: 4px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Conversion hierarchy: arguments stay in the reading path; only FAQs and
   the duplicated package itemisation use progressive disclosure. */
.hero-context { padding-top: 16px; border-top: 1px solid rgba(255,252,247,.2); }
.hero-context .hero-hook { font-style: normal; }
.hero-context .hero-daily { color: var(--cream); }
.hero-context .hero-daily strong { font-weight: 650; }
#comparacion .section-intro { max-width: 840px; }
#comparacion .section-intro > p:not(.eyebrow):not(.same-woman-lede) { max-width: 65ch; margin: 16px auto 0; color: var(--muted); font-size: 16px; line-height: 1.6; }
.same-woman-visual { max-width: 960px; }
.comparison-explanation { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; max-width: 960px; margin: 0 auto 24px; }
.comparison-explanation p { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.6; }
.decision-grid { gap: 24px; max-width: 960px; }
.decision-card { padding: 24px; }
.decision-card li { font-size: 16px; }
#problema .situation-card--brief { align-items: start; }
#problema .situation-card--brief strong { font-weight: 750; }
#solucion .why-half-card { padding: 24px; }
.why-half-card .eyebrow { font-size: 12px; }
.why-half-card p:not(.eyebrow) { font-size: 16px; }
.why-half-card p:nth-of-type(2) { color: var(--espresso); font-size: 20px; font-family: var(--serif); }
.why-half-card strong { font-weight: 700; color: var(--ink); }
.order-card li { padding: 12px 0; border: 0; font-size: 16px; }
.order-card .solution-close { font-size: 20px; }
.product-card__detail { padding-top: 16px; border-top: 1px solid var(--line); }
.content-panel { padding: 24px; border: 0; background: var(--cream); }
.content-panel:nth-child(2) { background: var(--accent-pale); }
.content-panel .detail-kicker { margin-bottom: 12px; }
.content-panel h3 { font-size: 28px; }
.content-panel .detail-intro { margin-bottom: 24px; font-size: 16px; }
.content-panel .check-list { gap: 12px; }
.content-panel .check-list li { font-size: 16px; }
.content-panel .check-list strong { font-weight: 750; color: var(--ink); }
.content-panel .detail-benefit { font-size: 20px; }
.before-after-grid { max-width: 960px; margin-inline: auto; }
.value-recognition { display: grid; grid-template-columns: .85fr 1.15fr; gap: 64px; align-items: start; }
.value-recognition .section-intro { margin-bottom: 0; }
.value-question-copy { margin: 0; padding: 0; font-size: 17px; }
.value-question-copy p:first-child { margin-top: 0; }
.value-question-copy .pain-highlight { padding: 24px 0; border: 0; background: transparent; color: var(--espresso); font-family: var(--serif); font-size: 25px; line-height: 1.4; }
.bonus-card p + p { margin-top: 12px; }
.bonus-card p strong { color: var(--paper); font-weight: 700; }
#ciclo .layout-wrap { max-width: 1040px; }
#ciclo .cycle-content > p { font-size: 16px; }
#ciclo .plain-list li { font-size: 16px; }
#ciclo .cycle-lede { font-family: var(--serif); font-size: 32px; }
.offer-rationale { max-width: 800px; margin: 0 auto 32px; }
.offer-rationale .eyebrow { margin-bottom: 12px; }
.offer-rationale h2 { margin: 0; font-family: var(--serif); font-weight: 500; font-size: clamp(26px,3vw,34px); line-height: 1.25; }
.offer-rationale .value-justification__intro { margin-top: 16px; }
.offer-rationale .value-justification__highlight { font-size: 22px; text-align: left; }
.value-justification { border: 0; }
.offer-breakdown > summary { padding-block: 20px; }
.offer-breakdown > summary::after { top: 20px; }
.security-card p + p { margin-top: 12px; }
.fit-card { padding: 24px 0; }
.fit-card h3 { margin: 0 0 20px; }
.fit-card .check-list { gap: 16px; }
.story-copy { max-width: 65ch; }
.story-copy > p:not(.eyebrow) { font-size: 16px; }
.story-grid { align-items: start; }

@media (max-width: 680px) {
  .hero-inner { row-gap: 20px; }
  .hero-context .hero-daily { font-size: 16px; }
  #comparacion .section-intro > p:not(.eyebrow):not(.same-woman-lede) { margin-inline: 0; }
  .same-woman-visual { margin-bottom: 24px; }
  .comparison-explanation { grid-template-columns: 1fr; gap: 16px; }
  .decision-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
  .decision-card { padding: 16px 12px; }
  .decision-card h3 { font-size: 12px; letter-spacing: .035em; min-height: 36px; }
  .decision-card li { padding-left: 16px; font-size: 16px; line-height: 1.5; }
  #problema .situation-card--brief { gap: 0; }
  #problema .card-number { display: none; }
  #problema .situation-card--brief h3 { font-size: 16px; }
  .order-card ol { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
  .order-card .solution-close { font-size: 19px; }
  .book-details { gap: 24px; }
  .content-panel { padding: 24px 20px; }
  .value-recognition { grid-template-columns: minmax(0,1fr); gap: 24px; }
  .value-question-copy { font-size: 16px; }
  .value-question-copy .pain-highlight { font-size: 23px; }
  .offer-rationale { margin-bottom: 24px; }
  .offer-rationale h2 { font-size: 28px; }
  .fit-grid { gap: 16px; }
  .story-mark { display: none; }
  .story-grid { grid-template-columns: 1fr; gap: 0; }
}
@media (max-width: 360px) {
  .decision-grid { gap: 12px; }
  .decision-card { padding-inline: 8px; }
  .decision-card li { padding-left: 0; }
  .decision-card li::before { display: none; }
}