/* /quiz/ and /bundles/ (deep-commerce). Ink #24215C, accents per product via --acc. */
.ix{--ink:#24215C;--e:cubic-bezier(.2,.7,.2,1);color:var(--ink);padding:3.5rem 0 6rem}
.ix .eyebrow{letter-spacing:.14em;text-transform:uppercase;font-size:.75rem;font-weight:700;color:#34307A}
.ix-sr,.ix .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ix-top h1{font-size:clamp(2.4rem,6vw,5rem);line-height:1;letter-spacing:-.04em;margin:.6rem 0 .8rem}
.ix-top h1 span{display:block;color:#34307A;opacity:.72}
.ix-lede{font-size:1.1rem;opacity:.8;margin:0 0 1.5rem;max-width:56ch}.ix-lede a,.ix a.accent{color:#34307A;font-weight:600}
.ix-disclaimer{font-size:.88rem;line-height:1.5;background:#fff;border-radius:1rem;padding:.8rem 1rem;margin:.8rem 0 0;max-width:72ch;color:var(--ink)}
.ix-fda{font-size:.78rem;opacity:.7;margin-top:2.5rem;max-width:90ch}
.ix .btn:focus-visible,.ix-opt:focus-within,.bx-item:focus-visible{outline:2px solid #34307A;outline-offset:3px}
/* ---- quiz ---- */
.ix-progress{margin:2rem 0 1rem}.ix-bar{height:6px;border-radius:9px;background:rgba(36,33,92,.1);overflow:hidden}
.ix-bar span{display:block;height:100%;background:#34307A;border-radius:inherit;transform-origin:left;transition:transform .6s var(--e)}
.ix-progress ol{list-style:none;padding:0;margin:.7rem 0 0;display:flex;justify-content:space-between;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;opacity:.75}
.ix-progress li{opacity:.5;transition:opacity .3s}.ix-progress li.on{opacity:1}
.ix-card{background:#fff;border-radius:2rem;padding:clamp(1.4rem,4vw,3.5rem);min-height:min(70vh,640px);display:flex;flex-direction:column;box-shadow:0 40px 80px -60px rgba(36,33,92,.45)}
.ix-step{border:0;margin:0;padding:0;min-width:0;flex:1}
.ix-step.ix-in{animation:ix-in .55s var(--e)}
@keyframes ix-in{from{opacity:0;transform:translateX(40px)}}
.ix-legend{padding:0;display:flex;flex-direction:column;gap:.4rem;margin-bottom:.6rem}
.ix-num{font-size:.85rem;font-weight:700;letter-spacing:.1em;color:#34307A}
.ix-h{font-size:clamp(1.9rem,4.4vw,3.4rem);line-height:1.02;letter-spacing:-.035em;font-weight:700;outline:none;color:var(--ink)}
.ix-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:1rem;margin-top:1rem}
.ix-grid-pics{grid-template-columns:repeat(5,minmax(0,1fr))}
.ix-opt{position:relative;display:flex;flex-direction:column;gap:.9rem;padding:1.2rem;border-radius:1.5rem;cursor:pointer;background:color-mix(in srgb,var(--acc) 6%,#fff);border:2px solid transparent;transition:transform .35s var(--e),border-color .25s,box-shadow .35s;animation:ix-pop .5s var(--e) both}
.ix-step .ix-opt:nth-child(2){animation-delay:60ms}.ix-step .ix-opt:nth-child(3){animation-delay:120ms}.ix-step .ix-opt:nth-child(4){animation-delay:180ms}.ix-step .ix-opt:nth-child(5){animation-delay:240ms}
@keyframes ix-pop{from{opacity:0;transform:translateY(16px) scale(.97)}}
.ix-opt:hover{transform:translateY(-4px);box-shadow:0 24px 40px -30px color-mix(in srgb,var(--acc) 80%,transparent)}
.ix-opt input{position:absolute;opacity:0;pointer-events:none}
.ix-opt-art{display:grid;place-items:center;width:3.2rem;height:3.2rem;border-radius:1rem;background:#fff;color:var(--acc)}
.ix-ico{width:1.6rem;height:1.6rem}
.ix-pic{padding:0;overflow:hidden}.ix-pic .ix-opt-art{width:100%;height:auto;aspect-ratio:1;border-radius:0;background:color-mix(in srgb,var(--acc) 12%,#fff);overflow:hidden}
.ix-pic img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--e)}.ix-pic:hover img{transform:scale(1.06)}
.ix-pic .ix-opt-box{padding:0 1.1rem 1.2rem}
.ix-opt-box{display:flex;flex-direction:column;gap:.3rem}.ix-opt-box b{font-size:1.1rem;letter-spacing:-.01em;line-height:1.2}.ix-opt-box small{font-size:.85rem;opacity:.75}
.ix-tick{position:absolute;top:.9rem;right:.9rem;width:1.7rem;height:1.7rem;border-radius:50%;background:#fff;border:2px solid rgba(36,33,92,.18);transition:transform .3s cubic-bezier(.3,1.6,.5,1),background .2s}
.ix-opt:has(input:checked){border-color:var(--acc);background:color-mix(in srgb,var(--acc) 12%,#fff)}
.ix-opt:has(input:checked) .ix-tick{background:var(--acc);border-color:var(--acc);transform:scale(1.15)}
.ix-opt:has(input:checked) .ix-tick::after{content:'';position:absolute;left:.48rem;top:.25rem;width:.4rem;height:.75rem;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.ix-nav{display:flex;align-items:center;gap:1rem;justify-content:space-between;border-top:1px solid rgba(36,33,92,.1);padding-top:1.4rem;margin-top:2rem}
.ix-nav .btn{padding:1rem 1.8rem;font-size:1rem}.ix-err{color:#A3263E;font-weight:600;font-size:.92rem}
/* result */
.ix-result .ix-h{margin:.3rem 0 1.4rem}
.ix-recs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:1.25rem}
.ix-rec{border-radius:1.75rem;overflow:hidden;background:color-mix(in srgb,var(--acc) 8%,#fff);display:flex;flex-direction:column}
.ix-rec-img{display:block;aspect-ratio:1;overflow:hidden;background:color-mix(in srgb,var(--acc) 14%,#fff)}.ix-rec-img img{width:100%;height:100%;object-fit:cover}
.ix-rec>div{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.ix-rec h3{margin:0;font-size:1.7rem;letter-spacing:-.03em}.ix-rec h3 em{font-style:normal;opacity:.6}.ix-rec p{margin:0;font-size:.95rem;line-height:1.5}
.ix-rec-foot{display:flex;align-items:center;gap:1rem;margin-top:auto;padding-top:.6rem}.ix-rec-foot b{font-size:1.4rem;margin-right:auto}.ix-rec-foot a{color:var(--ink);font-weight:600}
.ix-reveal .ix-rec{animation:ix-rise .8s var(--e) both;animation-delay:var(--d)}
.ix-reveal .ix-rec-img img{animation:ix-zoom 1.4s var(--e) both;animation-delay:var(--d)}
.ix-reveal .ix-warn{animation:ix-pop .6s var(--e) both}
@keyframes ix-rise{from{opacity:0;transform:translateY(60px) rotate(1.5deg)}}
@keyframes ix-zoom{from{transform:scale(1.25)}}
.ix-note{background:#fff;border-radius:.8rem;padding:.6rem .8rem;font-size:.88rem!important;border-left:3px solid var(--acc,#34307A)}
.ix-warn{background:#FFF6E5;border-radius:1.25rem;padding:1.2rem 1.4rem;margin-bottom:1.5rem;color:#3d2a00}
.ix-warn ul{margin:.6rem 0 0;padding:0;list-style:none;display:grid;gap:.7rem}.ix-warn li{background:#fff;border-radius:.8rem;padding:.7rem .9rem;font-size:.92rem;line-height:1.5}
.ix-warn .eyebrow{display:block;color:#5c3d00;margin-bottom:.2rem}
.ix-all{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:1.5rem;padding:1.4rem 1.6rem;border-radius:1.5rem;background:#24215C;color:#fff}
.ix-all .eyebrow{color:#C9C6FF}.ix-all b{display:block;font-size:2rem}.ix-all small{opacity:.8}.ix-all .btn-dark{background:#fff;color:#24215C}
.ix-link{font:inherit;background:none;border:0;text-decoration:underline;cursor:pointer;color:#34307A;font-weight:600}
/* ---- bundles ---- */
.bx{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:2rem;align-items:start;margin-top:1.5rem}
.bx-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.bx-item{position:relative;font:inherit;color:var(--ink);text-align:left;border:2px solid transparent;cursor:pointer;padding:0;border-radius:1.75rem;overflow:hidden;background:color-mix(in srgb,var(--acc) 7%,#fff);display:flex;flex-direction:column;transition:transform .4s var(--e),border-color .25s,box-shadow .4s;animation:ix-pop .6s var(--e) both;animation-delay:calc(var(--i)*70ms)}
.bx-item:hover{transform:translateY(-5px);box-shadow:0 30px 50px -36px color-mix(in srgb,var(--acc) 80%,transparent)}
.bx-item[aria-pressed=true]{border-color:var(--acc);background:color-mix(in srgb,var(--acc) 13%,#fff)}
.bx-img{display:block;aspect-ratio:4/3;overflow:hidden}.bx-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--e)}
.bx-item:hover .bx-img img{transform:scale(1.06)}
.bx-txt{display:flex;flex-direction:column;gap:.25rem;padding:1rem 1.2rem 1.2rem}
.bx-sys{display:inline-flex;align-items:center;gap:.35rem;font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.8}.bx-ico{width:1em;height:1em}
.bx-txt b{font-size:1.45rem;letter-spacing:-.03em}.bx-txt em{font-style:normal;opacity:.6}.bx-txt small{font-size:.88rem;opacity:.8}
.bx-tog{position:absolute;top:.9rem;right:.9rem;width:2.4rem;height:2.4rem;border-radius:50%;background:#fff;box-shadow:0 6px 16px -8px rgba(0,0,0,.3);transition:background .25s,transform .35s cubic-bezier(.3,1.6,.5,1)}
.bx-tog i::before,.bx-tog i::after{content:'';position:absolute;left:50%;top:50%;width:.9rem;height:2px;background:var(--ink);border-radius:2px;transform:translate(-50%,-50%);transition:transform .35s var(--e),background .2s}
.bx-tog i::after{transform:translate(-50%,-50%) rotate(90deg)}
.bx-item[aria-pressed=true] .bx-tog{background:var(--acc);transform:rotate(180deg) scale(1.08)}
.bx-item[aria-pressed=true] .bx-tog i::before{width:.45rem;transform:translate(-95%,0) rotate(45deg);background:#fff}
.bx-item[aria-pressed=true] .bx-tog i::after{width:.85rem;transform:translate(-30%,-.2rem) rotate(-50deg);background:#fff}
.bx-sum{position:sticky;top:5.5rem;background:#fff;border-radius:2rem;padding:1.5rem;box-shadow:0 40px 80px -60px rgba(36,33,92,.5);display:flex;flex-direction:column;gap:1.1rem}
.bx-shelf{position:relative;height:230px;border-radius:1.4rem;background:linear-gradient(180deg,#EEEDF7,#F7F6FB 70%);overflow:hidden}
.bx-board{position:absolute;left:6%;right:6%;bottom:34px;height:12px;border-radius:4px;background:#24215C;box-shadow:0 14px 18px -8px rgba(36,33,92,.45)}
.bx-ghosts,.bx-bottles{position:absolute;left:8%;right:8%;bottom:46px;display:flex;justify-content:center;align-items:flex-end;gap:2%}
.bx-ghosts i{width:16%;aspect-ratio:3/4;border:2px dashed rgba(36,33,92,.18);border-radius:.8rem .8rem .3rem .3rem;transition:opacity .4s}
.bx-shelf.full .bx-ghosts{opacity:0}
.bx-hint{position:absolute;left:0;right:0;top:1rem;text-align:center;margin:0;font-size:.85rem;font-weight:600;opacity:.6;transition:opacity .3s}.bx-shelf.full .bx-hint{opacity:0}
.bx-b{width:19%;max-width:110px;display:block;animation:bx-drop .7s cubic-bezier(.3,1.4,.5,1) both;transform-origin:bottom}
.bx-b img{width:100%;height:auto;display:block;filter:drop-shadow(0 10px 8px rgba(20,18,50,.22))}
.bx-b.out{animation:bx-out .35s ease-in forwards}
@keyframes bx-drop{0%{opacity:0;transform:translateY(-180px) rotate(-8deg)}70%{opacity:1;transform:translateY(0) scaleY(.92)}100%{transform:none}}
@keyframes bx-out{to{opacity:0;transform:translateY(-30px) scale(.8)}}
.bx-shelf.ship .bx-b{animation:bx-ship .9s var(--e) both}.bx-shelf.ship .bx-b:nth-child(2){animation-delay:60ms}.bx-shelf.ship .bx-b:nth-child(3){animation-delay:120ms}
@keyframes bx-ship{40%{transform:translateY(-14px)}100%{transform:none}}
.bx-day{display:flex;flex-wrap:wrap;gap:.35rem;min-height:1.2rem}
.bx-day i{width:1.3rem;height:.6rem;border-radius:9px;background:var(--acc);animation:ix-pop .4s var(--e) both;animation-delay:var(--d)}
.bx-day i.sg{width:1rem;height:.7rem;opacity:.85}.bx-day i.pw{width:.9rem;height:.9rem;border-radius:50%}
.bx-months{display:flex;background:#F1F0F7;border-radius:999px;padding:.25rem}
.bx-months label{flex:1;position:relative;cursor:pointer}.bx-months input{position:absolute;opacity:0}
.bx-months span{display:block;text-align:center;padding:.55rem;border-radius:999px;font-weight:600;font-size:.9rem;transition:background .25s,color .25s}
.bx-months input:checked+span{background:#24215C;color:#fff}.bx-months input:focus-visible+span{outline:2px solid #34307A;outline-offset:2px}
.bx-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin:0}
.bx-stats div{background:#F7F6FB;border-radius:1rem;padding:.8rem}.bx-stats dt{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700;opacity:.75}
.bx-stats dd{margin:.2rem 0 0;font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.bump{animation:bx-bump .45s cubic-bezier(.3,1.6,.5,1)}@keyframes bx-bump{40%{transform:scale(1.12)}}
.bx-add{padding:1.05rem;font-size:1rem;width:100%}.bx-add[disabled]{opacity:.4;cursor:not-allowed}
.bx-sum .note{font-size:.8rem;opacity:.7;margin:0;text-align:center}
@media (max-width:960px){.bx{grid-template-columns:1fr}.bx-sum{position:sticky;top:auto;bottom:.75rem;order:-1;z-index:3;padding:1rem;gap:.7rem}.bx-shelf{height:150px}.bx-board{bottom:20px}.bx-ghosts,.bx-bottles{bottom:32px}.bx-b{max-width:70px}.bx-sum .note,.bx-day{display:none}.bx-stats dd{font-size:1.3rem}.bx-stats div{padding:.5rem .6rem}
.ix-grid-pics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.bx-list{grid-template-columns:1fr 1fr;gap:.6rem}.bx-txt{padding:.7rem .8rem .9rem}.bx-txt b{font-size:1.1rem}.bx-txt small{font-size:.78rem}.bx-sys{font-size:.62rem}.bx-tog{width:2rem;height:2rem;top:.6rem;right:.6rem}
.ix{padding:2rem 0 4rem}.ix-progress ol{font-size:.6rem}.ix-progress li:not(.on){visibility:hidden}.ix-card{border-radius:1.5rem;min-height:0}.ix-grid{gap:.6rem}.ix-opt{padding:.9rem;flex-direction:row;align-items:center}.ix-pic{flex-direction:column;align-items:stretch;padding:0}.ix-opt-art{flex:none;width:2.6rem;height:2.6rem}.ix-pic .ix-opt-box{padding:0 .8rem .9rem}.ix-opt-box b{font-size:1rem;padding-right:1.6rem}.ix-pic .ix-opt-box b{padding-right:0}.ix-opt-box small{font-size:.78rem}.ix-tick{top:50%;margin-top:-.85rem}.ix-pic .ix-tick{top:.7rem;margin-top:0}}
@media (prefers-reduced-motion:reduce){.ix *,.ix *::before,.ix *::after{animation:none!important;transition:none!important}}
.ix-nav [hidden]{display:none!important}.ixq .ix-top h1.eyebrow{font-size:.8rem;margin:0;line-height:1.4;letter-spacing:.14em}
.ix-opt-art svg{width:1.7rem;height:1.7rem}
