/* Visual refinement, product images, grocery planning and fixed-time offer. */
[hidden]{display:none!important}

.sale-bar{background:#a9533e;color:#fffdf8}
.sale-bar-inner{min-height:43px;display:flex;align-items:center;justify-content:center;gap:26px;font-size:11px;font-weight:700;letter-spacing:.01em}
.sale-bar-inner>span{display:inline-flex;align-items:center;gap:10px}
.sale-bar-inner b{display:inline-block;border:1px solid #eacbbd;padding:2px 7px;border-radius:2px;font-weight:800}
.sale-bar-inner strong{font-variant-numeric:tabular-nums;letter-spacing:.11em;font-size:15px;font-weight:800}
.sale-bar-inner a{border-bottom:1px solid #eed5c8;padding-bottom:2px}
.sale-bar.expired{background:#445d50}

.hero-discount{display:flex;align-items:center;flex-wrap:wrap;gap:11px;margin:0 0 24px}
.sale-chip{display:inline-flex;align-items:center;justify-content:center;background:#b55a44;color:#fff!important;font-size:12px;font-weight:800;line-height:1;border-radius:2px;padding:7px 10px;white-space:nowrap}
.hero-discount s{color:#899186;font-size:14px}
.hero-discount strong{font-size:22px;color:var(--green);letter-spacing:-.035em}
.hero-discount-label{font-size:11px;color:#7b897d}

/* The source image has HTML width/height attributes for layout stability.
   Its CSS width shrinks inside the mockup, so reset height too: otherwise
   object-fit:cover crops the portrait page to its center strip. */
.book-cover{display:block;width:100%;height:auto;aspect-ratio:799/1200;object-fit:contain;object-position:center}

/* Full-size food illustrations are extracted from the original PDF.
   Do not crop complete portrait PDF pages into a landscape container. */
.inside-photo{display:block;width:min(100%,390px);height:auto;aspect-ratio:638/425;margin:38px 0 0;overflow:hidden;position:relative;background:#f2eee6}
.inside-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;opacity:1}
.inside-photo figcaption{position:absolute;bottom:11px;left:11px;padding:7px 10px;background:#fffefa;color:var(--green);font-size:9px;letter-spacing:.1em;font-weight:800}

.savings{background:#f7f1e9;overflow:hidden}
.savings-grid{display:grid;grid-template-columns:1fr .92fr;gap:95px;align-items:center}
.savings h2{max-width:590px;margin:23px 0 24px}
.savings-copy>p{font-size:16px;line-height:1.85;color:#697368;max-width:540px}
.savings-facts{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin:35px 0 0;max-width:480px}
.savings-facts div{display:flex;gap:13px;align-items:center;padding-top:15px;border-top:1px solid #d3c9b8}
.savings-facts strong{font-family:var(--serif);font-size:45px;font-weight:400;color:var(--terracotta);line-height:1}
.savings-facts span{font-size:11px;line-height:1.45;color:#6b7469;font-weight:700}
.savings-photos{height:390px;position:relative;display:flex;align-items:start;justify-content:end}
.savings-main-photo{display:block;width:90%;height:310px;object-fit:cover;object-position:center;border:9px solid #fffdf8;box-shadow:16px 20px 0 #e2dccf}
.savings-small-photo{position:absolute;width:52%;height:155px;bottom:0;left:0;object-fit:cover;object-position:center;border:7px solid #fffdf8;box-shadow:0 8px 24px rgba(54,50,34,.12)}
.savings-photo-caption{position:absolute;bottom:-20px;right:0;font-size:10px;letter-spacing:.12em;color:#8b887c;font-weight:800}
.savings-calculator{display:grid;grid-template-columns:1.15fr .85fr;margin-top:85px;background:#fffdf8;border:1px solid #e5ddcf}
.calculator-entry{padding:38px 45px}
.calculator-entry h3{margin:17px 0 27px;color:var(--green);font-size:24px;letter-spacing:-.04em;line-height:1.4}
.calculator-entry label{display:block;max-width:390px;font-size:13px;font-weight:700;line-height:1.65;color:#657064}
.calculator-second-label{margin-top:31px}
.range-row{display:flex;align-items:center;gap:27px;margin-top:22px}
.range-row input[type=range]{width:100%;height:6px;border-radius:0;cursor:pointer;accent-color:#b55a44}
.range-row output{min-width:95px;text-align:right;color:var(--green);font-size:17px;font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums}
.range-ends{display:flex;justify-content:space-between;max-width:calc(100% - 120px);font-size:10px;color:#93988d;margin-top:11px}
.calculator-result{background:#2b5444;color:white;padding:38px 42px;display:flex;flex-direction:column;justify-content:center}
.calculator-result>span{font-size:10px;font-weight:800;letter-spacing:.13em;color:#dae5d8}
.calculator-result .result-period{display:flex;flex-direction:column;gap:0;padding:12px 0}
.calculator-result .result-period-month{border-top:1px solid rgba(255,255,255,.22);margin-top:8px;padding-top:21px}
.calculator-result .result-period strong{font-family:var(--serif);font-size:clamp(47px,4.1vw,63px);letter-spacing:-.07em;font-weight:400;line-height:1.2;color:#fff7e8;font-variant-numeric:tabular-nums}
.calculator-result .result-period>span{font-size:13px;font-weight:700;color:#dfebde}
.calculator-result p{font-size:11px;line-height:1.7;color:#c9d9cc;margin:12px 0 0}
.savings-source{padding-top:18px;font-size:11px;line-height:1.7;color:#88877c}
.savings-source a{text-decoration:underline;text-underline-offset:2px}
.steps-delivery{margin:34px 0 0;padding-top:20px;border-top:1px solid #bec5b9;color:#556557;font-size:13px;font-weight:700}

/* Keep the entire portrait page visible, with predictable proportions. */
.preview-stage{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:40px;padding:46px 22px 5px}
.preview-paper{min-width:0;align-self:center;padding:10px 5px 20px}
.page-zoom{width:min(100%,410px);max-width:410px;transform:none;box-shadow:14px 17px 28px rgba(33,59,42,.15)}
.page-zoom:hover{transform:translateY(-3px)}
.page-zoom img{width:100%;height:auto;aspect-ratio:799/1200;object-fit:contain;background:#fff}
.preview-copy h3{font-size:clamp(31px,3.1vw,42px)}
.preview-paper .zoom-label{bottom:12px;right:12px}

.purchase-discount{display:flex;align-items:center;gap:10px;margin:19px 0 4px;flex-wrap:wrap}
.purchase-discount>span:last-child{color:#8b907f;font-size:10px;line-height:1.5}
.purchase-box h3{margin-top:15px}
.old-price{display:flex;align-items:baseline;gap:11px;margin:20px 0 -12px}
.old-price s{font-size:19px;color:#9da49b}
.old-price span{color:#a0a69c;font-size:10px}
.purchase-countdown{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#eee9de;border:1px solid #e2d7c9;padding:12px 14px;margin:12px 0 20px;color:#7c695a;font-size:11px;font-weight:800}
.purchase-countdown strong{font-size:20px;color:#a84c38;letter-spacing:.065em;font-variant-numeric:tabular-nums;white-space:nowrap}
.purchase-box .price{padding:15px 0 3px}
.mobile-buy b{font-size:9px;padding:2px 5px;background:#b55a44;color:white;border-radius:2px;margin-left:4px}

@media(max-width:1100px){
  .savings-grid{gap:50px}
  .savings-photos{height:345px}
  .savings-main-photo{height:270px}
  .savings-small-photo{height:145px}
  .preview-stage{gap:22px;padding:35px 12px 0}
}

@media(max-width:800px){
  .inside-photo{display:block;width:min(100%,480px);margin-top:27px}
  .savings-grid{grid-template-columns:1fr;gap:30px}
  .savings-copy>p{max-width:600px}
  .savings-photos{height:310px;max-width:520px;width:100%;margin:0 auto}
  .savings-main-photo{width:85%;height:250px}
  .savings-small-photo{height:130px;width:45%}
  .savings-calculator{grid-template-columns:1fr;margin-top:58px}
  .calculator-result{padding:27px 35px}
  .calculator-result .result-period strong{font-size:60px}
  .preview-stage{grid-template-columns:1fr;gap:23px;padding:24px 12px 0}
  .preview-copy h3{font-size:32px}
  .page-zoom{width:min(100%,390px)}
}

@media(max-width:560px){
  .sale-bar-inner{gap:12px;justify-content:space-between;min-height:42px;font-size:9px}
  .sale-bar-inner b{font-size:10px;padding:3px 5px}
  .sale-bar-inner strong{font-size:13px;letter-spacing:.04em}
  .sale-bar-inner a{display:none}
  .hero-discount{gap:8px;margin:0 0 20px}
  .hero-discount strong{font-size:19px}
  .hero-discount-label{width:100%;font-size:10px}
  .inside-photo{display:block;width:100%;margin-top:25px}
  .savings-facts{gap:20px;margin-top:28px}
  .savings-facts strong{font-size:38px}
  .savings-facts span{font-size:10px}
  .savings-photos{height:250px}
  .savings-main-photo{width:89%;height:205px;border-width:6px;box-shadow:9px 12px 0 #e2dccf}
  .savings-small-photo{height:106px;border-width:5px;bottom:8px}
  .savings-photo-caption{font-size:8px;bottom:-10px}
  .savings-calculator{margin-top:45px}
  .calculator-entry{padding:29px 23px}
  .calculator-entry h3{font-size:20px;margin:14px 0 18px}
  .calculator-entry label{font-size:12px}
  .range-row{gap:14px}
  .range-row output{min-width:75px;font-size:15px}
  .range-ends{max-width:calc(100% - 90px)}
  .calculator-result{padding:26px 23px}
  .calculator-result .result-period strong{font-size:49px}
  .preview-panel{padding-bottom:23px}
  .preview-paper{padding:0 1px 6px}
  .page-zoom{width:min(100%,330px);max-width:none;box-shadow:10px 12px 18px rgba(33,59,42,.14)}
  .preview-copy h3{font-size:29px}
  .purchase-discount{margin-top:17px}
  .purchase-countdown{padding:11px 10px}
  .purchase-countdown strong{font-size:16px}
  .purchase-box .price strong{font-size:70px}
  .mobile-buy>div span{font-size:10px}
}