:root { --purple:#3e1263; --plum:#4d1d68; --pink:#ee1496; --cream:#fcfbf5; --line:#eee8dd; --copy:#655f68; }
* { box-sizing:border-box; }
body { margin:0; background:var(--cream); color:#4c4650; font:14px/1.45 "DM Sans",Arial,sans-serif; }
img { display:block; max-width:100%; } a { color:inherit; }
.reading-announcement { height:29px; display:grid; place-items:center; padding:0 12px; background:#430a68; color:#fff; font:700 11px/1 Lora,Georgia,serif; letter-spacing:.035em; }
.reading-header { height:42px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 22px; background:#fffefa; border-bottom:1px solid #f2ede4; }
.header-left { display:flex; align-items:center; }.menu-mark { display:grid; gap:3px; width:18px; padding:2px 0; border:0; background:transparent; cursor:pointer; }.menu-mark i { display:block; width:13px; height:1px; background:#6a6470; }.reading-brand img,.reading-footer img { width:142px; filter:brightness(0) saturate(100%) invert(14%) sepia(75%) saturate(4650%) hue-rotate(274deg) brightness(75%); }.header-locale { justify-self:end; display:flex; gap:17px; color:#77717a; font-size:10px; white-space:nowrap; }
.product-shell { width:min(1030px,calc(100% - 40px)); margin:28px auto 54px; display:grid; grid-template-columns:minmax(0,1.12fr) minmax(265px,.69fr); gap:32px; align-items:start; }.product-gallery { min-width:0; }.product-image-frame { overflow:hidden; border-radius:6px; background:#301150; }.product-image-frame img { width:100%; aspect-ratio:1; object-fit:cover; }.gallery-tiles { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:15px; }.gallery-tiles article { min-height:142px; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:16px; border-radius:5px; background:linear-gradient(145deg,#f8f0fa,#eef0fe); color:#4c226d; text-align:center; opacity:.72; }.gallery-tiles span { margin-bottom:8px; color:#d72099; font:34px/1 Lora,Georgia,serif; }.gallery-tiles strong { font:700 15px/1.1 Lora,Georgia,serif; }.gallery-tiles small { margin-top:6px; color:#766a7e; font-size:10px; }
.product-info { position:sticky; top:15px; }.rating { padding:5px 0 10px; margin:0 0 18px; border-bottom:1px solid var(--line); color:#f1ab1f; font-size:14px; letter-spacing:1px; }.rating strong { margin-left:6px; color:#625b67; font-size:12px; letter-spacing:0; }.rating span { color:#8a828d; font-size:11px; letter-spacing:0; }
h1,h2,h3 { font-family:Lora,Georgia,serif; } h1 { margin:0 0 15px; color:#3f115f; font-size:clamp(34px,4vw,54px); font-weight:700; line-height:.9; letter-spacing:-.055em; } h1 em { display:block; color:#ed1493; font-style:italic; }.lead { max-width:300px; margin:0 0 20px; color:#6f6872; font:italic 15px/1.35 Lora,Georgia,serif; }.benefit-list { display:grid; gap:9px; padding:0; margin:0 0 20px; list-style:none; color:#655d68; font-size:12px; font-weight:600; }.benefit-list li::before { display:inline-grid; width:17px; height:17px; margin-right:9px; place-items:center; border:1px solid #8c5a98; border-radius:50%; color:#8c5a98; content:"♡"; font-size:10px; }
.reading-cta { display:block; padding:12px 14px; border-radius:5px; background:#eb1693; color:#fff; text-align:center; text-decoration:none; font-size:14px; font-weight:700; box-shadow:0 4px 8px #76106a30; }.reading-cta span { margin-left:4px; }.reading-cta small { display:block; color:#ffe1f3; font-size:9px; line-height:1.25; }.reading-cta:hover { background:#cd087c; }.purchase-note { display:flex; align-items:center; justify-content:space-between; margin:10px 0 7px; color:#67606a; font-size:10px; font-weight:700; }.purchase-note::after { color:#847a87; content:"No risk, ever."; font-weight:400; }.payment-list { display:flex; flex-wrap:wrap; justify-content:center; gap:5px; margin:7px 0 15px; }.payment-list span { min-width:27px; padding:2px 3px; border-radius:2px; background:#f1f0f3; color:#605166; font-size:7px; font-weight:700; text-align:center; }
.product-trust { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }.product-trust div { min-height:69px; display:grid; place-items:center; align-content:center; gap:4px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); text-align:center; }.product-trust b { color:#8c5b9d; font-size:17px; line-height:1; }.product-trust span { color:#655968; font-size:8px; font-weight:700; line-height:1.2; }
.product-accordions { margin-top:20px; }.product-accordions details { border-bottom:1px solid var(--line); }.product-accordions summary { display:flex; justify-content:space-between; align-items:center; padding:16px 0; color:#441367; cursor:pointer; font-size:12px; font-weight:700; list-style:none; }.product-accordions summary::-webkit-details-marker { display:none; }.product-accordions summary b { display:grid; width:21px; height:21px; place-items:center; border:1px solid #b786c6; border-radius:50%; color:#7d4295; font-size:15px; font-weight:400; }.product-accordions p { margin:0; padding:0 4px 15px; color:#6e6670; font-size:11px; }
.details-section { width:min(630px,calc(100% - 40px)); margin:0 auto; padding:4px 0 44px; }.section-intro { margin:0 auto 26px; text-align:center; }.section-intro > p,.promise-copy > p:first-child,.fit-section > div > p,.final-cta > p:first-child { margin:0 0 7px; color:#ec1294; font-size:10px; font-weight:700; letter-spacing:.12em; }.section-intro h2,.promise-copy h2,.fit-section h2,.final-cta h2 { margin:0; color:#42115f; font-size:clamp(25px,3vw,37px); line-height:1.08; }.detail-grid,.faq-list { width:100%; }.detail-grid details,.faq-list details { margin:8px 0; overflow:hidden; border:1px solid #e9e0ec; border-radius:5px; background:#fffefa; }.detail-grid summary,.faq-list summary { padding:13px 16px; color:#441367; cursor:pointer; font-size:12px; font-weight:700; }.detail-grid details > div,.faq-list details > p { padding:0 16px 13px; margin:0; color:#6a626c; font-size:12px; }.detail-grid ul { margin:0; padding-left:17px; }.detail-grid a,.faq-list a { color:#e81291; font-weight:700; }
.promise-section { width:min(640px,calc(100% - 40px)); margin:0 auto; overflow:hidden; border-top:3px solid #451268; border-radius:7px; background:#fff; box-shadow:0 7px 20px #46155d12; }.promise-section > img { display:none; }.promise-copy { padding:42px 55px 31px; text-align:center; }.promise-copy h2 { font-size:28px; }.promise-copy > p:not(:first-child) { margin:18px auto 0; color:#726a73; font-size:12px; }.promise-steps { display:grid; gap:0; margin:25px -55px -31px; border-top:1px solid #eee8ea; text-align:left; }.promise-steps div { position:relative; min-height:83px; padding:19px 23px 17px 57px; border-bottom:1px solid #eee8ea; }.promise-steps b { position:absolute; left:24px; top:21px; display:grid; width:20px; height:20px; place-items:center; border-radius:50%; background:linear-gradient(135deg,#ab61c0,#4f147b); color:#fff; font:700 10px Lora,Georgia,serif; }.promise-steps h3 { margin:0 0 4px; color:#4b1a69; font:700 12px/1.2 "DM Sans",Arial,sans-serif; }.promise-steps p { margin:0; color:#68616a; font-size:11px; }.emotion-note { width:min(640px,calc(100% - 40px)); margin:18px auto 65px; padding:17px 20px; border:1px solid #efd9db; border-radius:6px; background:#fff4f4; color:#5b275d; }.emotion-note strong { font:italic 700 15px Lora,Georgia,serif; }.emotion-note p { margin:7px 0 0; color:#756a70; font-size:12px; }
.testimonials-section { padding:56px 20px; background:#faf4e8; }.testimonial-grid { width:min(900px,100%); margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.testimonial-grid blockquote { margin:0; padding:20px; border-radius:8px; background:#fffefa; box-shadow:0 5px 12px #4b1b5d10; }.testimonial-grid blockquote > div { color:#ee1496; letter-spacing:2px; font-size:11px; }.testimonial-grid h3 { margin:10px 0 6px; color:#481769; font-size:16px; }.testimonial-grid p { min-height:75px; margin:0; color:#645b66; font-size:12px; }.testimonial-grid footer { margin-top:10px; color:#7d7180; font-size:11px; font-weight:700; }.testimonial-grid footer span { color:#ed1493; }
.how-section { padding:65px 20px; background:#fffefa; }.how-grid { width:min(820px,100%); margin:0 auto; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:40px; list-style:none; text-align:center; }.how-grid span { display:grid; width:43px; height:43px; margin:0 auto 13px; place-items:center; border:1px solid #e51194; border-radius:50%; color:#e51194; font:600 18px Lora,Georgia,serif; }.how-grid h3 { margin:0 0 6px; color:#471667; font-size:16px; }.how-grid p { margin:0; color:#67606a; font-size:12px; }
.fit-section { display:grid; grid-template-columns:1fr 1fr; gap:46px; padding:64px max(20px,calc((100vw - 850px)/2)); background:linear-gradient(120deg,#f4e8f6,#fbe9f2); }.fit-section ul { padding:0; list-style:none; }.fit-section li { position:relative; padding:8px 0 8px 25px; border-bottom:1px solid #ffffff8e; color:#625a65; font-size:12px; }.yes-list li::before,.not-for li::before { position:absolute; left:0; color:#2b9458; content:"✓"; font-weight:700; }.not-for li::before { color:#bd2c68; content:"×"; font-size:17px; line-height:1.1; }.not-for > p { color:#a6356c!important; }
.faq-section { padding:63px 20px; background:#fffefa; }.faq-list { width:min(660px,100%); margin:0 auto; }.final-cta { padding:68px 20px; background:#411064; color:#fff; text-align:center; }.final-cta h2 { color:#fff; }.final-cta > p:not(:first-child) { max-width:430px; margin:12px auto 22px; color:#e6dbe9; font-size:13px; }.final-cta .reading-cta { width:min(360px,100%); margin:0 auto 10px; }.final-cta > small { color:#e1d1e6; font-size:11px; }.reading-footer { padding:30px 20px; background:#2b093e; color:#d8c9de; text-align:center; }.reading-footer img { margin:0 auto 12px; }.reading-footer p { margin:0 0 12px; font-size:11px; }.reading-footer nav { display:flex; justify-content:center; gap:16px; }.reading-footer a { color:#fff; font-size:11px; text-decoration:none; }
@media (max-width:760px) { .reading-header { padding:0 15px; }.header-locale { gap:8px; font-size:8px; }.reading-brand img { width:120px; }.product-shell { width:min(100% - 28px,550px); margin:22px auto 42px; grid-template-columns:1fr; gap:24px; }.product-info { position:static; }.rating { margin-bottom:13px; }.gallery-tiles article { min-height:102px; }.gallery-tiles span { font-size:24px; }.gallery-tiles strong { font-size:12px; }.promise-copy { padding:36px 24px 27px; }.promise-steps { margin-left:-24px; margin-right:-24px; margin-bottom:-27px; }.testimonial-grid,.how-grid { grid-template-columns:1fr; }.testimonial-grid p { min-height:0; }.fit-section { grid-template-columns:1fr; gap:28px; padding:55px 24px; }.details-section { width:min(100% - 28px,630px); }.product-trust div { min-height:63px; } }

.gallery-tiles .gallery-image { display:block; min-height:0; aspect-ratio:1; padding:0; overflow:hidden; background:#f8f0fa; opacity:1; }
.gallery-tiles .gallery-image img { display:block; width:100%; height:100%; object-fit:cover; }

/* Product gallery: mirrors the reference's active image with selectable thumbnails. */
.product-gallery { width:min(100%,900px); margin-inline:auto; }
.product-image-frame { width:min(600px,100%); margin-inline:auto; border-radius:14px; }
.gallery-carousel { position:relative; width:min(900px,100%); margin:26px auto 0; padding:0; }
.gallery-window { overflow:hidden; }
.gallery-tiles { display:flex; gap:13px; margin:0; transition:transform .28s ease; will-change:transform; }
.gallery-tiles .gallery-image { flex:0 0 calc((100% - 39px)/4); min-height:0; aspect-ratio:1; padding:0; border:0; border-radius:9px; background:#f6ecfa; cursor:pointer; opacity:1; }
.gallery-tiles .gallery-image:hover,.gallery-tiles .gallery-image:focus-visible { outline:3px solid #d997e8; outline-offset:3px; }
.gallery-tiles .gallery-image[aria-current="true"] { outline:3px solid #6a237d; outline-offset:3px; }
.gallery-nav { position:absolute; z-index:1; top:50%; display:none; width:25px; height:42px; padding:0; place-items:center; transform:translateY(-50%); border:0; background:transparent; color:#6b6670; cursor:pointer; font:36px/1 Arial,sans-serif; }
.gallery-nav:disabled { cursor:default; opacity:.32; }.gallery-prev { left:1px; }.gallery-next { right:1px; }

@media (max-width:1100px) {
  .product-shell { width:min(900px,calc(100% - 48px)); grid-template-columns:1fr; gap:34px; }
  .product-info { width:min(640px,100%); margin-inline:auto; }
}
@media (max-width:480px) {
  .gallery-carousel { padding:0 29px; }
  .gallery-tiles { gap:13px; }
  .gallery-tiles .gallery-image { flex-basis:calc((100% - 13px)/2); }
  .gallery-nav { display:grid; font-size:31px; }
}