/* Personal style book: page feature, compact lead preview and accessible reader. */
.stylebook{background:#edece4;color:#2d352d;padding:88px 0;scroll-margin-top:100px;overflow:hidden}
.stylebook__layout{display:grid;grid-template-columns:1fr 1.12fr;gap:64px;align-items:center}
.stylebook__eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.16em;color:#626d59}
.stylebook h2{font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(42px,4.8vw,66px);font-weight:500;line-height:1.04;margin:20px 0}
.stylebook__intro{font-size:15px;line-height:1.8;color:#60645a;max-width:470px}
.stylebook__benefits{list-style:none;padding:0;margin:26px 0;display:grid;gap:16px}
.stylebook__benefits li{display:flex;gap:17px;align-items:baseline}
.stylebook__benefits li>span{font-size:11px;color:#7e856e}
.stylebook__benefits strong{font-size:14px;font-weight:600}
.stylebook__benefits p{font-size:12px;line-height:1.6;color:#676c60;margin:4px 0 0}
.stylebook__actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.stylebook__textButton{background:none;border:0;padding:12px 0;font:inherit;font-size:12px;color:#3d4935;text-decoration:underline;text-underline-offset:5px;cursor:pointer}
.stylebook__note{font-size:11px;line-height:1.7;color:#707467;margin-top:16px}
.stylebook__sampleLabel{display:flex;justify-content:space-between;gap:16px;font-size:10px;letter-spacing:.04em;color:#6a7161;margin-bottom:20px}
.stylebook__spread{display:block;position:relative;width:100%;padding:9px;border:1px solid #d9d9cc;background:#f9f8f2;transform:rotate(-2deg);box-shadow:12px 18px 0 #dcded0,0 25px 45px #2e35271a;cursor:pointer;color:#fff}
.stylebook__spread img{display:block;width:100%;height:auto}
.stylebook__zoom{position:absolute;right:20px;bottom:20px;background:#303b2df0;border:1px solid #ffffff40;padding:10px 13px;border-radius:3px;font-size:10px;letter-spacing:.02em}
.stylebook__caption{font-family:"Cormorant Garamond",Georgia,serif;font-size:27px;line-height:1.1;margin:37px 0 24px}
.stylebook__caption span{font-family:Manrope,Arial,sans-serif;font-size:11px;color:#707467}
.stylebook__thumbnails{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.stylebook__thumbnails button{background:none;border:0;padding:0;text-align:left;cursor:pointer;color:#555f4e;font:inherit;font-size:10px}
.stylebook__thumbnails img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border:3px solid #faf9f4;transition:box-shadow .2s}
.stylebook__thumbnails span{display:block;padding-top:8px}
.stylebook__example{font-size:10px;color:#777e6d;line-height:1.7;margin:18px 0 0}
.bookLead{display:flex;align-items:center;gap:13px;padding:12px;background:#eeeee5;border:1px solid #d9decf;border-radius:12px;margin:0 0 18px;color:#35412e}
.bookLead__image{flex:0 0 100px;overflow:hidden;border:0;padding:0;background:#fff;border-radius:5px;cursor:pointer}
.bookLead__image img{display:block;width:100%;height:auto}
.bookLead strong{font-size:13px}.bookLead p{font-size:11px;line-height:1.6;color:#68705e;margin:4px 0}
.bookLead div>button{border:0;padding:3px 0;background:none;font:inherit;font-size:11px;text-decoration:underline;text-underline-offset:3px;color:#415335;cursor:pointer;min-height:30px}
.leadModal--quiz .bookLead{display:none}
html.bookReaderOpen{overflow:hidden}
.bookReader{width:min(1120px,calc(100% - 40px));max-width:none;max-height:calc(100dvh - 40px);padding:0;border:1px solid #d6dacb;border-radius:18px;background:#f7f6f0;color:#35412e;box-shadow:0 30px 100px #0006;overflow:auto}
.bookReader::backdrop{background:#152015c9;backdrop-filter:blur(6px)}
.bookReader__header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 24px;border-bottom:1px solid #dce0d4}
.bookReader__title{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:28px;margin:0}
.bookReader__subtitle{font-size:11px;color:#747c68;margin:5px 0 0}
.bookReader__close,.bookReader__arrow{border:1px solid #d0d6c7;background:transparent;color:#35412e;border-radius:50%;width:44px;height:44px;flex-shrink:0;font-size:22px;cursor:pointer}
.bookReader__figure{margin:0;padding:22px 24px 8px;text-align:center}
.bookReader__page{display:block;width:100%;height:auto;max-height:62dvh;object-fit:contain;background:#eeede7}
.bookReader__imageArea{overflow:auto;max-height:62dvh;overscroll-behavior:contain}
.bookReader__zoom{border:0;background:none;font:inherit;font-size:11px;padding:12px;color:#4b5a3c;text-decoration:underline;text-underline-offset:4px;cursor:pointer;min-height:44px}
.bookReader--zoomed .bookReader__page{width:1100px;max-width:none;max-height:none}
.bookReader__caption{font-size:12px;line-height:1.6;margin:12px auto 0;max-width:680px;color:#647057;min-height:40px}
.bookReader__nav{display:flex;align-items:center;justify-content:center;gap:24px;padding:12px 20px 22px}
.bookReader__count{font-size:12px;min-width:50px;text-align:center}
.bookReader__arrow:disabled{opacity:.3;cursor:default}
.bookReader__footer{border-top:1px solid #dce0d4;padding:16px 24px;display:flex;gap:16px;align-items:center;justify-content:space-between;font-size:12px}
.bookReader__footer p{margin:0;line-height:1.6;color:#6b745f}
.bookReader :focus-visible,.stylebook :focus-visible,.bookLead :focus-visible{outline:3px solid #84956c;outline-offset:4px}
@media(max-width:900px){.stylebook{padding:58px 0}.stylebook__layout{gap:35px;grid-template-columns:1fr}.stylebook__copy{max-width:600px}.stylebook__visual{max-width:640px}.stylebook__intro{max-width:none}.stylebook__spread{transform:rotate(-1deg)}.stylebook__sampleLabel{margin-bottom:16px}}
@media(max-width:520px){.stylebook{padding:42px 0}.stylebook__layout{gap:30px}.stylebook h2{font-size:43px;margin:15px 0}.stylebook__intro{font-size:13px;line-height:1.8}.stylebook__benefits{gap:13px;margin:22px 0}.stylebook__benefits p{font-size:11px}.stylebook__actions{gap:4px;align-items:stretch;flex-direction:column}.stylebook__actions .btn{width:100%;white-space:normal}.stylebook__textButton{text-align:center;min-height:44px}.stylebook__note{text-align:center;margin:8px 0 0}.stylebook__zoom{font-size:9px;bottom:14px;right:14px;padding:8px}.stylebook__caption{margin-top:30px;font-size:24px}.stylebook__thumbnails{gap:9px}.stylebook__thumbnails button{font-size:9px}.stylebook__sampleLabel{font-size:9px}.bookLead{gap:10px;padding:10px;margin-bottom:14px}.bookLead__image{flex-basis:78px}.bookLead strong{font-size:12px}.bookLead p{font-size:10px;margin:3px 0}.bookLead div>button{font-size:10px}.bookReader{width:calc(100% - 16px);max-height:calc(100dvh - 16px);border-radius:12px}.bookReader__header{padding:15px 13px;gap:10px}.bookReader__title{font-size:24px}.bookReader__subtitle{font-size:10px}.bookReader__figure{padding:16px 10px 0}.bookReader__page{max-height:55dvh}.bookReader__caption{font-size:11px;padding:0 7px;min-height:56px}.bookReader__nav{padding:12px}.bookReader__footer{padding:14px;flex-direction:column;text-align:center}.bookReader__footer .btn{width:100%}}
@media(prefers-reduced-motion:reduce){.stylebook__thumbnails img{transition:none}}
/* Put the actual result before the detailed benefits on small screens. */
@media(max-width:900px){
  .stylebook__layout{gap:0}
  .stylebook__copy{display:contents}
  .stylebook__eyebrow{order:1}
  .stylebook h2{order:2}
  .stylebook__intro{order:3;margin:0 0 26px}
  .stylebook__visual{order:4;margin-bottom:6px}
  .stylebook__benefits{order:5}
  .stylebook__actions{order:6}
  .stylebook__note{order:7}
}