:root {
  --forest: #244b35;
  --deep: #173d2e;
  --ink: #233d2e;
  --muted: #526052;
  --cream: #f7f4eb;
  --paper: #fffdf7;
  --yellow: #f0ce79;
  --gold: #8b621e;
  --line: #d7dbcd;
  --serif: 'Lora', Georgia, serif;
  --sans: 'DM Sans', Arial, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-padding-block: 1.5rem 8rem; scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font: 1.25rem/1.65 var(--sans); }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
img { display: block; max-width: 100%; height: auto; }
p, figure { margin: 0; }
h1, h2, h3 { margin: 0; font-weight: 500; hyphens: auto; }
h1, h2, h3, p, a, figcaption, span { overflow-wrap: anywhere; }
h1, h2 { font-family: var(--serif); line-height: 1.2; }
h1 { font-size: clamp(2.5rem, 4.25vw, 3.65rem); letter-spacing: -.025em; }
h2 { font-size: clamp(2rem, 3.35vw, 2.875rem); letter-spacing: -.018em; }
h1 em, h2 em { font-weight: 400; }
h2 em { color: #4d6444; }
h3 { font-size: 1.375rem; line-height: 1.35; font-weight: 650; }
strong { font-weight: 700; }
svg.icon { width: 1.5rem; height: 1.5rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.icon-library { position: absolute; width: 0; height: 0; overflow: hidden; }
.wrap { width: min(76rem, calc(100% - 6rem)); margin-inline: auto; }
.section { padding-block: 5rem; }
.eyebrow { display: flex; align-items: center; gap: .75rem; font-size: 1.0625rem; font-weight: 600; line-height: 1.5; color: var(--forest); margin-bottom: 1rem; }
.eyebrow>span { width: 1.75rem; height: 1px; background: var(--gold); flex-shrink: 0; }
.text-link { display: inline-flex; align-items: center; gap: .75rem; min-height: 3rem; text-decoration: underline; text-underline-offset: .3em; text-decoration-thickness: 1px; font-size: 1.125rem; font-weight: 550; }
.text-link:hover { text-decoration-thickness: 2px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 1.25rem; min-height: 4rem; padding: 1rem 1.75rem; border: 1px solid var(--forest); border-radius: .625rem; background: var(--forest); color: #fff; font-size: 1.25rem; font-weight: 700; line-height: 1.4; text-align: center; box-shadow: 0 3px 0 #10291a; transition: background .18s, box-shadow .18s; }
.button:hover { background: var(--deep); box-shadow: 0 4px 0 #10291a, 0 8px 18px #153b281f; }
.button .icon { transition: transform .18s; }
.button:hover .icon { transform: translateX(4px); }
.button:active { box-shadow: 0 1px 0 #10291a; }
.button-gold { color: #183525; background: var(--yellow); border-color: var(--yellow); box-shadow: 0 3px 0 #b69545; }
.button-gold:hover { background: #ffdf8a; box-shadow: 0 4px 0 #b69545, 0 8px 18px #153b2814; }
.button-gold:active { box-shadow: 0 1px 0 #b69545; }
a, button, summary { touch-action: manipulation; }
:focus-visible { outline: 3px solid #965707; outline-offset: 5px; }
.hero :focus-visible, .offer-card :focus-visible { outline-color: var(--yellow); }
main:focus { outline: none; }
.site-header { background: var(--paper); }
.header { display: flex; justify-content: space-between; align-items: center; gap: 2rem; padding-block: 1rem; }
.brand { display: inline-flex; align-items: center; gap: .875rem; min-height: 3rem; }
.brand img { width: 3.75rem; height: 3.75rem; border-radius: 50%; object-fit: cover; outline: 1px solid #b9a173; outline-offset: 3px; }
.brand>span { font: 500 2rem/1.1 var(--serif); letter-spacing: -.02em; }
.brand small { display: block; margin-top: .375rem; font: 400 1rem/1.2 var(--sans); letter-spacing: 0; color: var(--muted); }
.header nav { display: flex; align-items: center; gap: 2rem; }
.nav-link { display: inline-flex; align-items: center; min-height: 3rem; font-size: 1.125rem; }
.nav-link:hover { text-decoration: underline; text-underline-offset: .35em; }
.header-cta { display: inline-flex; align-items: center; justify-content: center; gap: 1.25rem; min-height: 3.25rem; padding: .625rem 1.25rem; border: 1px solid #a7b4a0; border-radius: .5rem; font-size: 1.125rem; font-weight: 650; transition: background .18s; }
.header-cta:hover { background: #eaf0e3; }
.header-cta .icon { width: 1.25rem; height: 1.25rem; }
.hero { position: relative; isolation: isolate; background: #173d2e; color: var(--paper); border-bottom: 1px solid #9c87534d; }
.hero::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at 90% 25%, #4b65414d, transparent 65%); pointer-events: none; }
.hero-layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); grid-template-areas: 'copy visual' 'purchase visual'; gap: 1.75rem 4rem; align-items: start; padding-block: 3.5rem; }
.hero-copy { grid-area: copy; min-width: 0; animation: arrive .45s ease both; }
.hero .eyebrow { color: #e8d5a6; font-weight: 500; margin-bottom: 1.5rem; }
.hero .eyebrow .icon { color: var(--yellow); width: 1.375rem; height: 1.375rem; }
.hero h1 { max-width: none; font-size: clamp(3.25rem, 4.8vw, 4.25rem); letter-spacing: -.035em; font-weight: 500; line-height: 1.1; hyphens: none; }
.hero-promise { display: block; text-wrap: balance; }
.hero-continuation { display: block; margin-top: 1rem; max-width: 33ch; font-size: .68em; line-height: 1.25; letter-spacing: -.01em; text-wrap: pretty; color: #eef1e7; }
.hero h1 em { color: var(--yellow); }
.headline-benefit { color: #f6d78c; }
.headline-volume { color: #ffe3a0; font-weight: 600; text-decoration: underline; text-decoration-color: #bd985c; text-decoration-thickness: .06em; text-underline-offset: .14em; }
.hero-description { max-width: 42ch; color: #dce5d7; margin-top: 1.5rem; font-size: 1.5rem; line-height: 1.5; }
.hero-purchase { grid-area: purchase; min-width: 0; }
.hero-buy-panel { padding: 1.375rem 1.5rem 1.25rem; background: #fffaf0; color: var(--deep); border: 1px solid #e7d9b9; border-radius: 1rem; box-shadow: 0 14px 30px #071c2526; }
.hero .hero-buy-button { display: flex; width: 100%; gap: 1rem; justify-content: space-between; padding: 1rem 1.25rem; min-height: 4rem; border-radius: .625rem; background: #25583c; border-color: #25583c; box-shadow: 0 3px 0 #153c28; font-size: 1.25rem; }
.hero .hero-buy-button:hover { background: #173f2a; box-shadow: 0 3px 0 #102f1f, 0 5px 12px #214e2c24; }
.hero .hero-buy-button .icon { display: block; width: 1.75rem; height: 1.75rem; }
.hero-buy-panel :focus-visible { outline-color: #965707; }
.hero-purchase-assurances { display: flex; flex-wrap: wrap; gap: .625rem 1.25rem; justify-content: space-between; margin-top: 1.125rem; }
.hero-purchase-assurances p { display: flex; align-items: center; gap: .5rem; color: #4c5b43; font-size: 1rem; line-height: 1.45; }
.hero-purchase-assurances p:first-child { flex: 1 1 16rem; }
.hero-purchase-assurances p:last-child { flex: 0 1 auto; }
.hero-purchase-assurances strong { font-weight: 650; }
.hero-purchase-assurances .icon { color: #7a652e; width: 1.25rem; height: 1.25rem; }
.hero-link { margin-top: .875rem; color: #e5e8dc; font-size: 1.0625rem; }
.hero-link>span { color: var(--yellow); font-size: 1.5rem; }
.hero-visual { grid-area: visual; min-width: 0; width: 100%; align-self: center; animation: arrive .6s ease both; }
.hero-product-stage { position: relative; padding: .625rem .625rem 4.25rem; border: 1px solid #e5d5ad80; border-radius: 9rem 9rem 1.25rem 1.25rem; background: #f6efde; box-shadow: 0 24px 64px #071c253b; }
.portrait-frame { overflow: hidden; border-radius: 8.5rem 8.5rem .75rem .75rem; }
.portrait-frame>img { width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center; }
.hero-product-info { position: absolute; bottom: 1rem; left: -1.25rem; right: 1.25rem; display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; gap: 1.125rem; padding: 1.125rem 1.25rem; background: #fcf8eb; border: 1px solid #ccb887; border-radius: .75rem; box-shadow: 0 8px 20px #142c281f; color: var(--forest); }
.hero-product-count { min-width: 0; }
.hero-product-count>strong { display: block; font: 500 3rem/1 var(--serif); letter-spacing: -.05em; color: #355337; }
.hero-product-count>strong>span { font: 400 .55em/1 var(--serif); vertical-align: super; color: #94681e; margin-left: .1em; }
.hero-product-count>span { display: block; font-size: 1rem; line-height: 1.35; margin-top: .375rem; max-width: 15ch; color: #586145; }
.hero-product-format { display: flex; align-items: flex-start; gap: .5rem; border-left: 1px solid #d5cbae; padding-left: 1.125rem; font-size: 1rem; line-height: 1.5; color: #576145; }
.hero-product-format strong { display: block; font-weight: 650; color: #284c33; }
.hero-product-format .icon { color: #8e6b2f; margin-top: .125rem; width: 1.25rem; height: 1.25rem; }
.hero-visual figcaption { color: #d7e0ce; font-size: 1rem; line-height: 1.5; margin-top: 1rem; text-align: center; }
.contents { background: var(--cream); }
.care-section { background: #f5f2e8; border-block: 1px solid #e1ddce; }
.care-section .section-heading { max-width: 54rem; }
.care-section .eyebrow { color: #876025; }
.care-catalog { max-width: 64rem; margin-inline: auto; }
.care-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.care-card { position: relative; display: grid; grid-template-columns: 4rem minmax(0, 1fr); grid-template-rows: auto 1fr auto; align-items: center; gap: 1rem 1.125rem; min-width: 0; padding: 1.75rem; border: 1px solid #d9dece; border-radius: .5rem 1.75rem .5rem .5rem; background: var(--paper); box-shadow: 0 4px 0 #e7e4d7; }
.care-card::before { content: ''; position: absolute; top: -1px; left: 1.75rem; width: 2.75rem; height: 3px; background: #b78a3e; }
.care-copy { display: contents; }
.care-emblem { display: grid; place-items: center; width: 4rem; aspect-ratio: 1; border-radius: 1.125rem 1.125rem .375rem 1.125rem; background: #edf1e5; border: 1px solid #dce3cf; }
.care-emblem img { width: 2.875rem; height: 2.875rem; }
.care-number { position: absolute; top: .75rem; right: 1rem; color: #897044; font: 500 1rem/1 var(--serif); }
.care-card h3 { grid-column: 2; padding-right: .5rem; color: var(--forest); font: 500 1.5rem/1.25 var(--serif); letter-spacing: -.025em; hyphens: none; }
.care-card p { grid-column: 1 / -1; align-self: start; color: #4c594c; font: 400 1.25rem/1.55 var(--sans); }
.care-tags { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .5rem 1rem; list-style: none; padding: 1rem 0 0; margin: 0; border-top: 1px solid #e3e5d9; }
.care-tags li { display: inline-flex; align-items: center; gap: .5rem; color: #40543e; font: 550 1rem/1.4 var(--sans); }
.care-tags li::before { content: ''; width: .25rem; height: .25rem; flex-shrink: 0; border-radius: 50%; background: #a7782f; }
.care-more { margin-top: 1.25rem; display: flex; flex-direction: column; }
.care-more summary { order: 2; display: flex; align-items: center; justify-content: center; gap: 1rem; min-height: 3.75rem; list-style: none; border: 1px solid #9bac90; border-radius: .5rem; padding: 1rem 1.5rem; margin-top: .5rem; color: var(--forest); background: #ebefdf; cursor: pointer; font-size: 1.125rem; font-weight: 650; line-height: 1.4; }
.care-more summary::-webkit-details-marker { display: none; }
.care-more summary:hover { background: #e1e8d2; }
.care-more-icon { display: grid; place-items: center; width: 1.75rem; height: 1.75rem; border: 1px solid #a2b190; border-radius: 50%; flex-shrink: 0; font-size: 1.5rem; line-height: 1; }
.care-more-open, .care-more[open] .care-more-closed { display: none; }
.care-more[open] .care-more-open { display: inline; }
.care-more[open] .care-more-icon { transform: rotate(45deg); }
.care-more[open] summary { margin-top: 1.75rem; }
.care-more .care-card:last-child { grid-column: 1 / -1; }
.care-closing { display: flex; justify-content: center; align-items: center; gap: 1.25rem; margin-top: 1.75rem; padding: 1.5rem; border-radius: .5rem; background: var(--deep); color: #e3e9d9; text-align: left; font-size: 1.125rem; }
.care-closing .icon { color: var(--yellow); width: 2rem; height: 2rem; }
.care-closing strong { color: var(--paper); font-weight: 600; }
@media (max-width: 58rem) {
  .care-card { padding: 1.5rem; gap: .875rem; }
  .care-card h3 { font-size: 1.375rem; }
}
@media (max-width: 44rem) {
  .care-list { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .care-card { padding: 1.5rem 1.25rem; grid-template-columns: 3.5rem minmax(0, 1fr); gap: 1rem; }
  .care-card::before { left: 1.25rem; }
  .care-emblem { width: 3.5rem; }
  .care-emblem img { width: 2.625rem; height: 2.625rem; }
  .care-card h3 { font-size: 1.5rem; }
  .care-tags { gap: .5rem .875rem; }
  .care-more summary { padding: 1rem; }
  .care-closing { align-items: flex-start; padding: 1.25rem; gap: .875rem; }
  .care-closing .icon { margin-top: .2rem; width: 1.5rem; height: 1.5rem; }
}
.offer-section { background: #eee8d8; border-block: 1px solid #ddd5c2; }
.offer-layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 5rem; align-items: center; }
.offer-copy>p:not(.eyebrow) { margin-top: 1.5rem; max-width: 42ch; color: var(--muted); }
.offer-card { background: var(--deep); color: var(--paper); border: 1px solid #31563e; border-radius: 1.25rem; padding: 2.25rem; box-shadow: 0 20px 50px #15342417; }
.offer-card-heading { display: flex; align-items: center; gap: .875rem; padding-bottom: 1.5rem; border-bottom: 1px solid #64795c; }
.offer-card-heading .icon { color: var(--yellow); width: 1.75rem; height: 1.75rem; }
.offer-card h3 { font-size: 1.375rem; }
.price-block { padding-block: 1.5rem; }
.price-before { font-size: 1.125rem; color: #e2e8d7; }
.price { margin-block: .375rem; color: var(--paper); font-size: clamp(2.75rem, 4.5vw, 4rem); font-weight: 650; line-height: 1.2; letter-spacing: -.025em; }
.one-payment { font-size: 1.125rem; }
.offer-card .button { width: 100%; }
.purchase-note { margin-top: 1rem; font-size: 1rem; line-height: 1.5; color: #e2e8d7; text-align: center; }
.offer-assurances { display: grid; gap: .75rem; border-top: 1px solid #64795c; padding-top: 1.25rem; margin-top: 1.5rem; }
.offer-assurances p { display: flex; align-items: flex-start; gap: .625rem; font-size: 1rem; line-height: 1.5; }
.offer-assurances .icon { color: var(--yellow); width: 1.25rem; height: 1.25rem; margin-top: .125rem; }
.guarantee-section { padding-block: 3rem; background: var(--paper); border-bottom: 1px solid var(--line); }
.guarantee-layout { display: grid; grid-template-columns: minmax(0, 18rem) minmax(0, 1fr); gap: 3rem; align-items: center; max-width: 63rem; }
.guarantee-layout h2 { font-size: clamp(1.875rem, 2.5vw, 2.25rem); }
.guarantee-layout>div>p:not(.eyebrow) { margin-top: 1rem; max-width: 60ch; color: var(--muted); }
.guarantee-layout .eyebrow { color: var(--gold); }
.guarantee-seal { position: relative; isolation: isolate; width: min(100%, 18rem); padding: 1.75rem 1.5rem; display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); align-items: center; gap: 1.125rem; border: 1px solid #aa915a; border-radius: 1.125rem; background: var(--deep); color: var(--paper); box-shadow: 0 14px 30px #193a2814, 0 3px 7px #193a2810; }
.guarantee-seal::before { content: ''; position: absolute; inset: .375rem; border: 1px solid #a58d545c; border-radius: .75rem; pointer-events: none; z-index: -1; }
.guarantee-period { min-width: 0; display: flex; flex-direction: column; align-items: center; text-align: center; }
.guarantee-period strong { color: var(--yellow); font: 500 4.5rem/1 var(--serif); font-variant-numeric: lining-nums; }
.guarantee-period>span { margin-top: .5rem; font-size: 1.125rem; line-height: 1.4; }
.guarantee-caption { min-width: 0; padding-left: 1.125rem; border-left: 1px solid #a58d547d; display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; }
.guarantee-caption .icon { width: 1.625rem; height: 1.625rem; color: var(--yellow); }
.guarantee-caption>span { font-size: 1rem; line-height: 1.55; font-weight: 500; }
.section-heading { margin-bottom: 2.5rem; }
.faq-section { background: #eeefe5; border-top: 1px solid var(--line); }
.faq-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.3fr); gap: 4rem; align-items: start; }
.faq-intro>p:last-child { margin-top: 1.25rem; max-width: 25ch; color: var(--muted); }
.faq-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; }
.faq-list details { min-width: 0; border: 1px solid #cad2c0; border-radius: .75rem; background: var(--paper); transition: border-color .18s, background .18s; }
.faq-list details:hover { border-color: #8b9b7c; }
.faq-list details[open] { border-color: #899d75; box-shadow: inset 3px 0 0 #6c8355; }
.faq-list summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 4.625rem; padding: 1.125rem 1.25rem; font-size: 1.25rem; font-weight: 600; cursor: pointer; line-height: 1.4; border-radius: .75rem; overflow-wrap: anywhere; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: #eaf0e3; color: var(--forest); font-size: 1.5rem; line-height: 1; font-weight: 400; transition: transform .2s; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details>p { margin: 0; padding: 0 1.25rem 1.25rem; max-width: 60ch; color: var(--muted); }
.footer { padding-block: 2rem 8rem; font-size: 1rem; color: var(--muted); border-top: 1px solid var(--line); }
.footer-top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.25rem; color: var(--forest); }
.footer .brand .icon { width: 2rem; height: 2rem; }
.footer p { max-width: 90ch; margin-top: .75rem; }
.mobile-offer { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; position: fixed; z-index: 10; width: min(62rem, calc(100% - 3rem)); left: 50%; bottom: 1rem; transform: translateX(-50%); padding: 1rem 1.5rem; border: 1px solid #adbda4; border-radius: .875rem; background: var(--paper); box-shadow: 0 8px 30px #193a2833; visibility: hidden; overflow: clip; }
.mobile-offer.is-visible { visibility: visible; }
.mobile-offer>span { display: flex; flex-direction: column; line-height: 1.4; }
.mobile-offer strong { font-size: 1.5rem; }
.mobile-offer>span>span { font-size: 1rem; }
.mobile-offer .button { font-size: 1.125rem; min-height: 3.5rem; padding: .875rem 1.5rem; }
.sticky-detail { font-size: 1.125rem; }
.skip-link { position: fixed; top: 1rem; left: 1rem; z-index: 30; padding: 1rem; background: var(--paper); color: var(--deep); transform: translateY(-200%); }
.skip-link:focus { transform: translateY(0); }
.checkout-dialog { width: min(90%, 30rem); border: 1px solid var(--line); padding: 3rem 2rem 2rem; border-radius: 1rem; color: var(--ink); background: var(--paper); }
.checkout-dialog::backdrop { background: #12281baa; }
.checkout-dialog h2, .checkout-dialog p { margin-bottom: 1rem; }
.dialog-close { position: absolute; right: .5rem; top: .5rem; width: 3rem; height: 3rem; border: 0; background: transparent; color: var(--ink); font-size: 2rem; }

/* Full sales sequence: each block has its own rhythm and visual role. */
.check-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .75rem; }
.check-list li { display: flex; align-items: flex-start; gap: .75rem; min-width: 0; }
.check-list li>span { min-width: 0; }
.check-list .icon { width: 1.25rem; height: 1.25rem; margin-top: .35rem; }
.topic-strip { background: #e6dcc5; border-bottom: 1px solid #cbb997; padding-block: 1.125rem; }
.topic-strip ul { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 2rem; justify-content: center; font-size: 1.0625rem; font-weight: 600; }
.topic-strip li { display: flex; align-items: center; gap: .625rem; }
.topic-strip li::before { content: '✦'; color: var(--gold); font-size: .9em; }
.centered-heading { max-width: 54rem; margin-inline: auto; text-align: center; }
.centered-heading .eyebrow { justify-content: center; }
.section-intro { margin-top: 1.25rem; color: var(--muted); max-width: 57ch; }
.centered-heading .section-intro { margin-inline: auto; }
.three-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.three-cards>* { min-width: 0; }
.obstacles { background: var(--paper); }
.editorial-card { border-top: 2px solid #b6a17a; padding: 1.5rem 1rem 0 0; }
.card-number { display: block; color: var(--gold); font: 400 2.5rem/1.1 var(--serif); margin-bottom: 1rem; }
.editorial-card p { margin-top: .75rem; color: var(--muted); }
.audience-section { background: #e9eddf; border-block: 1px solid #cfd7c5; }
.audience-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 4rem; align-items: center; }
.audience-layout>* { min-width: 0; }
.audience-list { gap: 1.125rem; }
.audience-list .icon { color: var(--forest); }
.audience-note { font-size: 1rem; line-height: 1.6; padding-top: 1.25rem; margin-top: 1.5rem; border-top: 1px solid #b8c5aa; color: var(--muted); }
.content-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1.25rem; }
.content-card { min-width: 0; grid-column: span 2; padding: 1.75rem; background: var(--paper); border: 1px solid #d1d8c7; border-radius: .75rem; }
.content-card:nth-child(n+4) { grid-column: span 3; }
.content-card>.icon { width: 2rem; height: 2rem; margin-bottom: 1rem; color: var(--forest); }
.content-card p { margin-top: .625rem; color: var(--muted); }
.content-highlight { background: var(--deep); color: var(--paper); border-color: var(--forest); }
.content-highlight p { color: #e2e8d7; }
.content-total { display: block; color: var(--yellow); font: 500 2.5rem/1.1 var(--serif); margin-bottom: .75rem; }
.advantages-section { background: #eee8d8; border-block: 1px solid #d6cbb3; }
.advantage-card { border: 1px solid #cbbd9f; border-radius: 1rem; overflow: hidden; background: var(--paper); }
.advantage-visual { min-height: 10rem; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 1rem; background: #e0d4b6; color: var(--deep); font: 500 1.5rem/1.3 var(--serif); padding: 1.5rem; text-align: center; border-bottom: 1px solid #cbbd9f; }
.advantage-visual .icon { width: 2.75rem; height: 2.75rem; stroke-width: 1.3; }
.advantage-card:nth-child(2) .advantage-visual { background: #dfe6d6; }
.advantage-card:nth-child(3) .advantage-visual { background: var(--deep); color: var(--yellow); }
.card-body { padding: 1.5rem; }
.card-body p { margin-top: .75rem; color: var(--muted); }
.section-purchase { text-align: center; margin-top: 2.5rem; }
.section-purchase .button { margin-top: 1.25rem; }
.persona-section { background: var(--paper); }
.persona-layout { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.2fr); gap: 4rem; align-items: center; }
.persona-layout>* { min-width: 0; }
.persona-photo { max-width: 30rem; }
.persona-photo img { border-radius: 1rem 5rem 1rem 1rem; border: 1px solid #c7b289; padding: .5rem; }
.persona-photo figcaption { margin-top: .75rem; text-align: center; font-size: 1rem; color: var(--muted); }
.persona-description { margin-top: 1rem; color: var(--muted); }
.persona-signature { font: italic 400 1.375rem/1.5 var(--serif); color: var(--gold); margin-top: 1.5rem; }
.product-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 1.75rem 0 0; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.product-facts>div { min-width: 0; display: flex; flex-direction: column-reverse; gap: .5rem; }
.product-facts dt { font-size: 1rem; color: var(--muted); }
.product-facts dd { margin: 0; font: 500 1.625rem/1.2 var(--serif); color: var(--forest); }
.gallery-section { background: #eef0e6; border-top: 1px solid var(--line); }
.card-rail { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3rem) / 3); gap: 1.5rem; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x mandatory; padding-bottom: .75rem; scrollbar-width: thin; scrollbar-color: #8b9d80 #dce2d3; }
.card-rail>* { min-width: 0; scroll-snap-align: start; }
.device-gallery figure { background: var(--paper); border: 1px solid #c5cfb9; border-radius: .875rem; overflow: hidden; }
.device-gallery img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.device-gallery figcaption { padding: 1.25rem; }
.device-gallery figcaption strong { display: block; font-size: 1.25rem; font-weight: 650; }
.device-gallery figcaption span { display: block; margin-top: .25rem; font-size: 1.125rem; color: var(--muted); }
.rail-controls { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; margin-top: 1.25rem; }
.rail-controls[hidden] { display: none; }
.rail-controls p { font-size: 1rem; color: var(--muted); }
.rail-buttons { display: flex; flex-wrap: wrap; gap: .75rem; }
.rail-buttons button { border: 1px solid #899b79; border-radius: .5rem; color: var(--forest); background: var(--paper); font-size: 1rem; font-weight: 600; padding: .75rem 1rem; min-height: 3rem; }
.rail-buttons button:disabled { opacity: .5; cursor: default; }
.rail-buttons button:not(:disabled):hover { background: #e0e8d9; }
.practical-section { background: var(--paper); }
.practical-grid article { padding: 1.75rem; border: 1px solid #d1d8c7; border-radius: .875rem; background: var(--cream); }
.practical-grid article>.icon { width: 2rem; height: 2rem; margin-bottom: 1rem; color: var(--gold); }
.practical-grid article p { margin-top: .75rem; color: var(--muted); }
.offer-checklist { margin-top: 1.75rem; gap: 1rem; }
.offer-checklist .icon { color: var(--forest); }
.guarantee-cta { margin-top: 1.5rem; }
.closing-section { background: var(--deep); color: var(--paper); text-align: center; }
.closing-copy { max-width: 54rem; }
.closing-copy .eyebrow { justify-content: center; color: var(--yellow); }
.closing-copy h2 em { color: var(--yellow); }
.closing-copy>p:not(.eyebrow) { max-width: 49ch; margin: 1.5rem auto; }
.closing-copy .button { margin-top: .25rem; }
.closing-copy .closing-reassurance { font-size: 1rem; color: #e2e8d7; }
.closing-brand { display: inline-flex; align-items: center; gap: 1rem; text-align: left; margin-top: 1rem; padding-top: 1.5rem; border-top: 1px solid #64795c; }
.closing-brand img { width: 3.5rem; height: 3.5rem; object-fit: cover; border-radius: 50%; }
.closing-brand>span { font: 500 1.5rem/1.2 var(--serif); }
.closing-brand small { display: block; font: 400 1rem/1.5 var(--sans); margin-top: .375rem; color: #e2e8d7; }
.closing-section :focus-visible { outline-color: var(--yellow); }

@keyframes arrive { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (max-width: 68rem) {
  .wrap { width: calc(100% - 4rem); }
  .contents-layout, .offer-layout { gap: 3rem; }
  .offer-card { padding: 1.75rem; }
  .offer-copy h2 { font-size: 2.375rem; }
  .section { padding-block: 4rem; }
  .header nav { gap: 1.5rem; }
  .faq-layout { gap: 2.5rem; }
}
@media (max-width: 51rem) {
  .wrap { width: calc(100% - 3rem); }
  .header { gap: 1rem; }
  .header .nav-link { display: none; }
  .contents h2 { font-size: 2rem; }
  .offer-layout { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .offer-copy { max-width: 40rem; }
  .offer-copy h2 { font-size: 2.5rem; }
  .offer-card { width: min(100%, 34rem); justify-self: center; padding: 2rem; }
  .guarantee-layout { grid-template-columns: minmax(0, 16rem) minmax(0, 1fr); gap: 2rem; }
  .guarantee-seal { width: min(100%, 16rem); padding: 1.5rem 1.125rem; gap: .875rem; }
  .guarantee-caption { padding-left: .875rem; }
  .faq-layout { grid-template-columns: minmax(0, 1fr); gap: 1.75rem; }
  .faq-intro h2 br { display: none; }
  .faq-intro>p:last-child { max-width: none; margin-top: .875rem; }
  .footer { padding-bottom: calc(8rem + env(safe-area-inset-bottom)); }
  .mobile-offer { width: auto; border-radius: 0; transform: none; display: flex; align-items: center; justify-content: space-between; gap: .75rem; position: fixed; z-index: 10; left: 0; right: 0; bottom: 0; padding: .875rem 1rem calc(.875rem + env(safe-area-inset-bottom)); border-top: 1px solid #adbda4; background: var(--paper); box-shadow: 0 -5px 24px #193a281f; visibility: hidden; overflow: clip; }
  .sticky-detail { display: none; }
  .mobile-offer.is-visible { visibility: visible; }
  .mobile-offer>span { display: flex; flex-direction: column; line-height: 1.4; }
  .mobile-offer strong { font-size: 1.5rem; }
  .mobile-offer>span>span { font-size: 1rem; }
  .mobile-offer .button { font-size: 1.125rem; padding: .875rem 1rem; min-height: 3.5rem; }
}
@media (max-width: 38rem) {
  .wrap { width: calc(100% - 2.5rem); }
  .section { padding-block: 2.75rem; }
  .header { padding-block: 1rem; flex-wrap: wrap; }
  .brand img { width: 2.875rem; height: 2.875rem; }
  .brand { gap: .75rem; }
  .brand>span { font-size: 1.625rem; }
  .brand small { font-size: 1rem; }
  .header-cta { font-size: 1rem; min-height: 3rem; padding: .5rem .75rem; }
  .header-cta .icon { display: none; }
  .button { padding-inline: 1.125rem; gap: .875rem; }
  .button .icon { display: none; }
  .contents h2 { font-size: 2.125rem; }
  .offer-copy h2 { font-size: 2.125rem; }
  .offer-copy>p:not(.eyebrow) { margin-top: 1rem; }
  .offer-card { padding: 1.5rem; border-radius: 1rem; }
  .offer-card-heading { gap: .75rem; padding-bottom: 1.25rem; }
  .offer-card h3 { font-size: 1.25rem; }
  .offer-card .button { padding-inline: .75rem; }
  .price { font-size: 3rem; }
  .guarantee-section { padding-block: 2.5rem; }
  .guarantee-layout { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .guarantee-seal { width: min(100%, 21rem); padding: 1.5rem; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
  .guarantee-caption>span { font-size: 1.125rem; }
  .guarantee-layout h2 { font-size: 2.125rem; }
  .guarantee-layout h2 br { display: none; }
  .faq-intro h2 { font-size: 2.125rem; }
  .faq-list summary { padding: 1.125rem 1rem; gap: .75rem; }
  .faq-list details>p { padding: 0 1rem 1.25rem; }
  .footer-top { flex-wrap: wrap; }
}
@media (max-width: 23rem) {
  .wrap { width: calc(100% - 2rem); }
  .brand img { width: 2.5rem; height: 2.5rem; }
  .brand>span { font-size: 1.5rem; }
  .header { gap: .75rem; }
  .offer-card { padding: 1.25rem; }
  .mobile-offer { gap: .5rem; padding-inline: .75rem; }
  .mobile-offer .button { padding-inline: .75rem; }
}
@media (max-width: 20rem), (max-height: 30rem) {
  .mobile-offer { display: none; }
  .footer { padding-bottom: 2rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .button:hover .icon { transform: none; }
}

@media (max-width: 68rem) {
  .audience-layout, .persona-layout { gap: 2.5rem; }
  .three-cards, .card-rail { gap: 1rem; }
  .card-rail { grid-auto-columns: calc((100% - 2rem) / 3); }
  .content-card, .card-body, .practical-grid article { padding: 1.25rem; }
  .product-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 51rem) {
  .audience-layout, .persona-layout { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .persona-photo { width: min(100%, 24rem); justify-self: center; }
  .three-cards { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .editorial-card { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 1rem; padding-top: 1.25rem; }
  .editorial-card .card-number { grid-row: span 2; margin: 0; }
  .editorial-card p { grid-column: 2; margin-top: .5rem; }
  .content-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .content-card { grid-column: span 1; }
  .content-card:nth-child(n+4) { grid-column: span 1; }
  .content-card:last-child { grid-column: span 2; }
  .advantage-card { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1fr); }
  .advantage-visual { min-height: 0; border-bottom: 0; border-right: 1px solid #cbbd9f; font-size: 1.25rem; padding: 1.25rem; }
  .card-rail { grid-auto-columns: calc((100% - 1rem) / 2); }
}
@media (max-width: 38rem) {
  .section-heading { margin-bottom: 1.75rem; }
  .centered-heading { text-align: left; }
  .centered-heading .eyebrow { justify-content: flex-start; }
  .centered-heading h2 br, .audience-layout h2 br, .persona-layout h2 br { display: none; }
  .topic-strip { padding-block: 1rem; }
  .topic-strip ul { justify-content: flex-start; gap: .375rem 1.25rem; font-size: 1rem; }
  .content-grid { grid-template-columns: minmax(0, 1fr); }
  .content-card, .content-card:nth-child(n+4), .content-card:last-child { grid-column: 1; }
  .advantage-card { grid-template-columns: minmax(0, 1fr); }
  .advantage-visual { min-height: 0; flex-direction: row; justify-content: flex-start; padding: 1.125rem 1.25rem; border-right: 0; border-bottom: 1px solid #cbbd9f; }
  .advantage-visual .icon { width: 2rem; height: 2rem; }
  .persona-photo { max-width: 20rem; }
  .persona-photo img { border-radius: 1rem 3rem 1rem 1rem; }
  .card-rail { grid-auto-columns: 88%; gap: 1rem; }
  .section-purchase { margin-top: 1.75rem; text-align: left; }
  .section-purchase .button, .guarantee-cta { width: 100%; }
  .closing-copy h2 br { display: none; }
  .closing-brand { text-align: left; }
}

/* Hero: purchase stays next to the promise, with the product visible alongside on desktop. */
@media (max-width: 68rem) {
  .hero-layout { column-gap: 2.5rem; padding-block: 2.75rem; }
  .hero h1 { font-size: 3.5rem; }
  .hero-continuation { font-size: 2.375rem; }
  .hero-product-stage { border-radius: 7rem 7rem 1.25rem 1.25rem; }
  .portrait-frame { border-radius: 6.5rem 6.5rem .75rem .75rem; }
  .hero-product-info { left: -.75rem; right: .75rem; gap: .75rem; padding: 1rem; }
  .hero-product-format { padding-left: .75rem; }
  .hero-product-format .icon { display: none; }
}
@media (max-width: 58rem) {
  .hero-layout { grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); grid-template-areas: 'copy visual' 'purchase purchase'; gap: 1.75rem 2rem; }
  .hero h1 { font-size: 3rem; }
  .hero-continuation { font-size: 2.25rem; }
  .hero-purchase-assurances p:first-child { flex: 0 1 auto; }
}
@media (max-width: 44rem) {
  .hero-layout { grid-template-columns: minmax(0, 1fr); grid-template-areas: 'copy' 'purchase' 'visual'; gap: 1.25rem; padding-block: 2rem; }
  .hero .eyebrow { font-size: 1rem; margin-bottom: 1rem; gap: .625rem; }
  .hero h1 { font-size: 2.75rem; letter-spacing: -.03em; }
  .hero-continuation { margin-top: 1rem; font-size: 2rem; line-height: 1.3; max-width: 34ch; }
  .hero-description { margin-top: 1.25rem; font-size: 1.5rem; }
  .hero-buy-panel { display: block; padding: 1.25rem; border-radius: .875rem; }
  .hero .hero-buy-button { padding: 1rem; gap: .5rem; }
  .hero-purchase-assurances { justify-content: flex-start; border: 0; padding: 0; margin-top: 1rem; gap: .5rem; }
  .hero-purchase-assurances p { flex-basis: 100%; }
  .hero-link { margin-top: .75rem; }
  .hero-visual { max-width: 34rem; justify-self: center; }
  .hero-product-stage { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr); align-items: stretch; gap: 1rem; padding: .625rem; border-radius: 2.75rem .875rem .875rem .875rem; }
  .portrait-frame { border-radius: 2.25rem .375rem .375rem .375rem; }
  .portrait-frame>img { height: 100%; min-height: 12rem; aspect-ratio: auto; object-fit: cover; }
  .hero-product-info { position: static; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: .75rem; padding: .625rem .5rem .625rem 0; background: none; border: 0; box-shadow: none; }
  .hero-product-count>strong { font-size: 2.5rem; }
  .hero-product-count>span { font-size: 1rem; }
  .hero-product-format { border: 0; padding: .75rem 0 0; border-top: 1px solid #d5cbae; font-size: 1rem; line-height: 1.4; }
  .hero-product-format strong { display: none; }
  .hero-visual figcaption { margin-top: .75rem; }
}
@media (max-width: 23rem) {
  .hero h1 { font-size: 2.5rem; }
  .hero-buy-panel { padding: 1rem; }
  .hero-product-stage { gap: .75rem; }
}