/* Homepage sections added for the October 2026 edition */
.hero-facts{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 14px}
.hero-facts li{font-size:11px;font-weight:700;line-height:1;padding:8px 12px;border-radius:999px;background:var(--white);border:1px solid var(--line);color:var(--ink)}
.hero-facts li:last-child{background:var(--accent-l);border-color:#c9d2ff;color:var(--blue)}

.pain-section{padding-bottom:20px}
.pain-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.pain-card{display:grid;grid-template-columns:1fr 1fr;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:var(--white)}
.pain-before,.pain-after{padding:26px 26px 28px}
.pain-after{background:var(--green)}
.pain-label{display:block;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px;color:var(--muted)}
.pain-after .pain-label{color:#3b5a24}
.pain-before p{font-size:15px;line-height:1.45;font-weight:650;color:#6f766c;text-decoration:line-through;text-decoration-color:#c9cfc2;text-decoration-thickness:1.5px}
.pain-after p{font-size:13px;line-height:1.7;font-weight:600;color:var(--ink)}

.update-section{background:var(--blue);color:#fff}
.update-section .section-kicker{color:#dfe5ff}
.update-section .sec-head>p:not(.section-kicker){color:#dfe5ff}
.update-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:80px;align-items:start}
.update-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.update-card{padding:28px;border-radius:14px;background:#ffffff14;border:1px solid #ffffff38}
.update-tag{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:6px 10px;border-radius:999px;background:var(--green);color:var(--ink);margin-bottom:18px}
.update-card h3{font-size:22px;line-height:1.2;letter-spacing:-.03em}
.update-card p{font-size:12px;line-height:1.85;color:#e4e9ff;margin-top:12px}

.outcome-section{background:#e7ebdf}
.outcome-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid #cbd3c1}
.outcome{padding:30px 28px 32px 0;border-bottom:1px solid #cbd3c1}
.outcome b{display:block;font-family:var(--display);font-size:64px;line-height:1;font-weight:650;letter-spacing:-.06em;color:var(--blue)}
.outcome p{font-size:13px;line-height:1.7;margin-top:14px;max-width:280px}
.outcome-cta{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:44px}
.outcome-cta p{font-size:12px;color:var(--muted)}

@media(max-width:1100px){
  .pain-card{grid-template-columns:1fr}
  .update-layout{grid-template-columns:1fr;gap:40px}
}
@media(max-width:899px){
  .pain-grid{grid-template-columns:1fr}
  .pain-card{grid-template-columns:1fr 1fr}
  .outcome-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .outcome b{font-size:52px}
}
@media(max-width:640px){
  .pain-card{grid-template-columns:1fr}
  .pain-before,.pain-after{padding:22px}
  .update-grid{grid-template-columns:1fr}
  .update-card{padding:24px}
  .outcome{padding:24px 16px 26px 0}
  .outcome b{font-size:44px}
  .outcome p{font-size:12px}
  .outcome-cta .btn{width:100%}
}
.outcome-cta .btn{background:var(--green);color:var(--ink)}

/* Offer panel: book stage */
.offer-story .offer-stage{position:relative;height:440px;margin:22px 0 18px;display:grid;place-items:center}
.offer-stage::before{content:'';position:absolute;inset:-20px -60px;background-image:radial-gradient(#ffffff38 .8px,transparent .8px);background-size:22px 22px;opacity:.55;pointer-events:none}
.offer-orbit{position:absolute;width:400px;height:400px;border:1px solid #ffffff38;border-radius:50%;transform:rotateX(62deg) rotateZ(-18deg);top:50%;left:50%;margin:-200px 0 0 -200px}
.offer-page{position:absolute;width:168px;border-radius:4px;box-shadow:0 16px 32px #0a1c8a59;z-index:2;background:#fff}
.offer-page-l{left:6%;top:12%;transform:rotate(-13deg)}
.offer-page-r{right:6%;top:16%;transform:rotate(11deg)}
.offer-stage .offer-book{position:relative;right:auto;top:auto;margin:0;width:232px;z-index:3;transform:translateY(24px) rotate(-2deg);transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.offer.in-view .offer-stage .offer-book{transform:translateY(0) rotate(-6deg)}
.offer-stage .offer-book img{box-shadow:18px 28px 42px #061a8a80,-3px 2px 0 #ffffff55}
.offer-sticker{position:absolute;right:15%;bottom:6%;width:84px;height:84px;border-radius:50%;background:var(--green);color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(12deg);z-index:4;font-size:10px;line-height:1.1;box-shadow:0 10px 22px #0a1c8a40}
.offer-sticker b{font-family:var(--display);font-size:34px;font-weight:650;letter-spacing:-.06em}
.offer-chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px;position:relative;z-index:2}
.offer-chips li{font-size:11px;font-weight:700;line-height:1;padding:9px 13px;border-radius:999px;background:#ffffff1c;border:1px solid #ffffff45;color:#fff}
@media(prefers-reduced-motion:reduce){.offer-stage .offer-book,.offer.in-view .offer-stage .offer-book{transform:rotate(-6deg);transition:none}}
@media(max-width:1100px){
  .offer-story .offer-stage{height:380px}
  .offer-stage .offer-book{width:200px}
  .offer-page{width:140px}
}
@media(max-width:640px){
  .offer-story .offer-stage{height:300px;margin:16px 0 12px}
  .offer-orbit{width:280px;height:280px;margin:-140px 0 0 -140px}
  .offer-stage .offer-book{width:150px}
  .offer-page{width:104px}
  .offer-page-l{left:2%}
  .offer-page-r{right:2%}
  .offer-sticker{width:64px;height:64px;right:8%}
  .offer-sticker b{font-size:26px}
  .offer-story>p:last-child{max-width:none;margin-top:0}
}

/* Hero: flipping book */
.flipbook{--fbw:212px;--fbh:calc(var(--fbw)*1.4167);position:relative;z-index:3;width:calc(var(--fbw)*2);height:var(--fbh);transition:opacity .5s ease}
.flipbook.is-fading{opacity:0}
.fb-tilt{width:100%;height:100%;transform-style:preserve-3d;transform:rotateX(calc(12deg + var(--tilt-y,0deg))) rotateY(var(--tilt-x,0deg)) rotateZ(-4deg);transition:transform .4s ease-out}
.fb-spread{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.65,0,.35,1)}
.flipbook.is-closed .fb-spread{transform:translateX(-25%)}
.fb-half{position:absolute;top:0;width:50%;height:100%;overflow:hidden;background:#fff}
.fb-left{left:0;border-radius:6px 0 0 6px;box-shadow:-14px 26px 40px #051b8e55;transition:opacity .45s ease}
.fb-right{left:50%;border-radius:0 6px 6px 0;box-shadow:14px 26px 40px #051b8e55}
.flipbook.is-closed .fb-left{opacity:0}
.flipbook.is-closed .fb-right{border-radius:3px 7px 7px 3px}
.fb-img{display:block;width:100%;height:100%;object-fit:cover}
.fb-left::after,.fb-right::after{content:'';position:absolute;inset:0;pointer-events:none}
.fb-left::after{background:linear-gradient(to left,#0000002e,#00000008 9%,transparent 22%)}
.fb-right::after{background:linear-gradient(to right,#00000033,#0000000a 8%,transparent 20%)}
.flipbook.is-closed .fb-right::after{background:linear-gradient(to right,#ffffff30,transparent 4%)}
.fb-spine{position:absolute;left:50%;top:0;width:2px;height:100%;margin-left:-1px;background:#00000026;z-index:1;transition:opacity .45s}
.flipbook.is-closed .fb-spine{opacity:0}
.fb-leaf{position:absolute;left:50%;top:0;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;transform:rotateY(0deg);display:none;z-index:5}
.fb-leaf.active{display:block}
.fb-leaf.turned{transform:rotateY(-180deg);transition:transform 1.1s cubic-bezier(.45,.05,.25,1)}
.fb-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;background:#fff}
.fb-front{border-radius:0 6px 6px 0}
.fb-back{transform:rotateY(180deg);border-radius:6px 0 0 6px}
.fb-face::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(to right,#00000030,transparent 30%);opacity:.8}
.fb-back::after{background:linear-gradient(to left,#00000030,transparent 30%)}
.motion-paused .fb-leaf.turned{transition-duration:.01s}
@media(max-width:1100px){.flipbook{--fbw:180px}}
@media(max-width:899px){.flipbook{--fbw:150px}}
@media(max-width:640px){.flipbook{--fbw:138px}}
@media(max-width:360px){.flipbook{--fbw:120px}}
@media(prefers-reduced-motion:reduce){.fb-spread,.fb-leaf,.fb-tilt{transition:none}}

/* Stop sideways panning on phones (the tilted ribbon pokes out by a pixel) */
html,body,main{overflow-x:clip}
@supports not (overflow:clip){main{overflow-x:hidden}}
