.bundles { padding:36px 0 128px; scroll-margin-top:40px; }
.bundles-heading { max-width:1000px; margin:0 auto 54px; text-align:center; }
.bundles-heading h2 { margin:0; font-size:clamp(29px,3.3vw,44px); line-height:1.16; font-weight:750; letter-spacing:-.035em; text-wrap:balance; }
.bundles-handwritten { display:block; margin-bottom:7px; font-family:'Orange Marker',Manrope,sans-serif; color:var(--accent); font-size:1.2em; font-weight:400; letter-spacing:0; transform:rotate(-1.5deg); }
.bundles-heading p { margin:22px 0 0; color:#aaa; font-size:18px; line-height:1.5; font-weight:500; }
.bundle-catalog-stage { perspective:1600px; }
.bundle-catalog { position:relative; isolation:isolate; display:grid; grid-template-columns:257px minmax(0,1fr); gap:32px; padding:34px; border-radius:32px; }
.bundle-catalog[data-tilting] { will-change:transform; }
.bundle-catalog>.author-glare { z-index:3; contain:paint; }
.bundle-catalog::before { content:''; position:absolute; z-index:-1; inset:0; border-radius:inherit; background:#0b0b0bed; filter:blur(2px); box-shadow:0 28px 65px -18px #000b; pointer-events:none; }
.bundle-navigation { min-width:0; }
.bundle-tabs { display:grid; gap:4px; }
.bundle-tab { display:grid; grid-template-columns:27px minmax(0,1fr); align-items:center; gap:10px; min-height:44px; padding:9px 12px; border-radius:11px; color:#9e9e98; font-size:15px; line-height:1.35; font-weight:550; transition:color .2s,background .2s; }
.bundle-tab:hover { color:#f3f0e7; background:#ffffff06; }
.bundle-tab[aria-selected='true'] { color:#f3f0e7; background:#c74d2826; }
.bundle-tab:focus-visible { outline:2px solid #eaff00; outline-offset:3px; }
.bundle-tab-number { font-family:'Orange Marker',Manrope,sans-serif; color:#62625c; font-size:21px; font-weight:400; }
.bundle-tab[aria-selected='true'] .bundle-tab-number { color:#ed7950; }
.bundle-navigation-note { margin:22px 12px 0; color:#b5bcae; font-size:14px; }
.bundle-mobile-guide { display:none; }
.bundle-panels { min-width:0; }
.bundle-panel { min-width:0; scroll-margin-top:32px; }
.bundle-panel[hidden] { display:none; }
.bundle-panel:focus-visible { outline:2px solid #eaff00; outline-offset:8px; border-radius:12px; }
.bundle-panel+.bundle-panel { margin-top:50px; }
.bundle-catalog[data-ready='true'] .bundle-panel { margin-top:0; }
.bundle-panel.is-entering { animation:bundle-enter .28s ease-out both; }
@keyframes bundle-enter { from { opacity:0; transform:translateY(7px); } to { opacity:1; transform:translateY(0); } }
.bundle-preview { position:relative; margin:0; }
.bundle-stage { position:relative; container-type:inline-size; display:grid; place-items:center; overflow:hidden; width:100%; aspect-ratio:1.9; max-height:390px; border-radius:20px; background:radial-gradient(ellipse at 45% 70%,#4b503138,transparent 70%),#171916; user-select:none; }
.bundle-canvas { position:relative; width:100%; height:100%; font-size:min(2cqw,14px); color:#2b302b; }
.bundle-preview figcaption { position:absolute; bottom:12px; right:16px; color:#b9beaf; font-size:12px; letter-spacing:.01em; }
.bundle-detail { padding:27px 3px 0; }
.bundle-title-row { display:flex; gap:20px; align-items:baseline; justify-content:space-between; }
.bundle-detail h3 { margin:0; color:#f1f1ed; font-size:29px; line-height:1.2; letter-spacing:-.035em; font-weight:700; }
.bundle-price { flex:none; margin:0; color:#dfebaa; font-size:20px; line-height:1.25; font-weight:650; text-align:right; white-space:nowrap; }
.bundle-price span { display:block; margin-top:5px; color:#b9c1ae; font-size:14px; font-weight:500; }
.bundle-description { margin:16px 0 0; max-width:570px; color:#b3b3b3; font-size:18px; line-height:1.55; font-weight:500; }
.bundle-detail--wrapped { container-type:inline-size; }
.bundle-detail--wrapped .bundle-description,.bundle-detail--wrapped .bundle-audience { text-wrap:balance; }
.bundle-copy-break { display:none; }
/* Keep authored phrase breaks when they fit; balance the whole paragraph on narrow cards. */
@container(min-width:520px) { .bundle-copy-break { display:initial; } }
.bundle-audience { margin:15px 0 0; color:#b1b9a8; font-size:15px; line-height:1.6; }
.bundle-included { display:flex; gap:10px; align-items:center; margin:22px 0 0; color:#d0d1c5; font-size:14px; line-height:1.4; }
.bundle-included svg { flex:none; width:17px; height:17px; color:#d9e7a6; }
/* Small interface studies, labelled as examples rather than product screenshots. */
.demo-window { position:absolute; left:7%; top:10%; width:86%; height:75%; overflow:hidden; border-radius:1em; background:#e8e7df; box-shadow:0 1.4em 2.5em #0007; transform:rotate(-1.2deg); }
.demo-bar { height:2.8em; display:flex; align-items:center; gap:.7em; padding:0 1.1em; color:#75786d; background:#d8d9d0; font-size:.88em; }
.demo-dots { display:flex; gap:.3em; margin-right:.3em; }
.demo-dots i { display:block; width:.42em; height:.42em; border-radius:50%; background:#a6a99a; }
.demo-bar-label { margin-left:auto; font-size:.8em; color:#939687; }
.demo-layout { display:grid; grid-template-columns:18% minmax(0,1fr); height:calc(100% - 2.5em); }
.demo-sidebar { display:flex; flex-direction:column; gap:1.2em; padding:1.6em .9em; background:#dfe0d7; color:#878b7d; font-size:.75em; }
.demo-sidebar b { color:#334035; font-weight:700; }
.demo-workspace { min-width:0; padding:1.5em; }
.demo-workspace h4,.demo-window h4 { margin:0 0 1em; font-size:1.3em; font-weight:750; letter-spacing:-.03em; }
.demo-board { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.7em; }
.demo-column-label { display:block; margin-bottom:.7em; color:#787e70; font-size:.72em; }
.demo-deal { padding:.85em .8em; margin-bottom:.7em; border-radius:.5em; background:#f6f5ee; box-shadow:0 .1em .2em #30372008; font-size:.8em; }
.demo-deal strong { display:block; margin:.6em 0 .4em; font-weight:700; }
.demo-deal small { color:#919586; font-size:.85em; }
.demo-source { color:#7b816f; font-size:.7em; text-transform:uppercase; letter-spacing:.05em; }
.demo-deal.is-lime { background:#d1deab; }
.demo-deal.is-orange { background:#edc7b2; }
.demo-check { display:inline-grid; place-items:center; width:1.5em; height:1.5em; border-radius:50%; background:#c8d997; color:#3b4b24; font-size:1em; }
.demo-toast { position:absolute; display:flex; align-items:center; gap:.8em; right:5%; bottom:11%; padding:1em 1.3em; border-radius:.7em; color:#dae3c8; background:#2b3828; box-shadow:0 .7em 1.8em #0005; font-size:.8em; transform:rotate(1deg); }
.demo-course .demo-sidebar { gap:.9em; }
.demo-video { position:relative; display:flex; flex-direction:column; justify-content:center; min-height:10em; padding:1.5em; border-radius:.6em; background:#253029; color:#dae3c8; }
.demo-video small { color:#9fae90; font-size:.75em; }
.demo-video strong { margin:.7em 0; font-size:1.7em; line-height:1.2; font-weight:650; }
.demo-play { position:absolute; right:1.3em; bottom:1.3em; width:2.8em; height:2.8em; border-radius:50%; background:#cfddb2; display:grid; place-items:center; }
.demo-play::before { content:''; margin-left:.2em; border-left:.75em solid #32412d; border-top:.45em solid transparent; border-bottom:.45em solid transparent; }
.demo-progress { height:.35em; margin-top:1.2em; border-radius:1em; background:#d3d5c8; overflow:hidden; }
.demo-progress::before { content:''; display:block; width:42%; height:100%; background:#7a8f58; }
.demo-phone { position:absolute; width:38%; height:91%; top:3%; left:16%; padding:.65em; border-radius:2.5em; background:#262925; box-shadow:0 1.6em 3em #0007; transform:rotate(-5deg); }
.demo-phone-screen { position:relative; height:100%; overflow:hidden; border-radius:1.9em; padding:1.8em 1em 1em; background:#e8e7df; }
.demo-island { position:absolute; top:.55em; width:3.8em; height:.65em; border-radius:1em; background:#282d26; left:50%; transform:translateX(-50%); }
.demo-phone-header { display:flex; align-items:center; gap:.65em; margin:.5em 0 1.25em; font-size:.86em; font-weight:700; }
.demo-avatar { display:inline-grid; place-items:center; flex:none; width:2.3em; height:2.3em; border-radius:50%; background:#cbd7b7; color:#566445; font-size:.8em; }
.demo-library-card { margin:.8em 0; padding:1em; border-radius:.75em; background:#d6ddc5; }
.demo-library-card:nth-of-type(2) { background:#e9c5af; }
.demo-library-card small { display:block; color:#6e7a5d; font-size:.6em; }
.demo-library-card strong { display:block; margin-top:.5em; font-size:.9em; line-height:1.3; }
.demo-chip { display:inline-block; padding:.5em .8em; border-radius:.5em; background:#c7d8a5; font-size:.7em; font-weight:650; }
.demo-float-note { position:absolute; top:31%; right:9%; width:37%; padding:1.8em; border-radius:.9em; background:#d7dfc1; box-shadow:0 1em 2em #0005; transform:rotate(4deg); }
.demo-float-note strong { display:block; margin:.8em 0; font-size:1.35em; line-height:1.25; font-weight:700; }
.demo-float-note small { color:#6b775c; font-size:.8em; line-height:1.5; }
.demo-chat { display:flex; flex-direction:column; gap:.8em; font-size:.8em; line-height:1.5; }
.demo-bubble { align-self:flex-start; max-width:90%; padding:.9em; border-radius:.9em .9em .9em .2em; background:#f7f5eb; }
.demo-bubble.user { align-self:flex-end; border-radius:.9em .9em .2em .9em; background:#cedbad; }
.demo-bubble small { display:block; margin-top:.5em; color:#859172; font-size:.8em; }
.demo-mini-report { position:absolute; top:24%; right:7%; width:40%; padding:1.6em; border-radius:.8em; color:#d4dec1; background:#2e3a2d; box-shadow:0 1em 2em #0006; transform:rotate(3deg); }
.demo-mini-report h4 { margin:0 0 1.5em; font-size:1.1em; font-weight:650; }
.demo-report-row { margin:1.1em 0; font-size:.75em; }
.demo-report-row i { display:block; height:.5em; margin-top:.65em; width:var(--size,80%); border-radius:1em; background:#bdce99; }
.demo-report-row:nth-child(3) i { background:#d98c65; }
.demo-agenda { padding:1.4em 1.7em; }
.demo-agenda-title { display:flex; justify-content:space-between; margin-bottom:1.3em; font-size:1.2em; font-weight:700; }
.demo-event { display:grid; grid-template-columns:3.5em 1fr; gap:1em; align-items:start; padding:.8em 0; font-size:.9em; }
.demo-event time { color:#8f9383; font-size:.85em; }
.demo-event span { padding:.75em 1em; border-radius:.5em; background:#d4dfbb; }
.demo-event:nth-child(3) span { background:#efd1bd; }
.demo-ad-stats { display:flex; gap:2em; padding-bottom:1.2em; }
.demo-ad-stats span { color:#7d8272; font-size:.75em; }
.demo-ad-stats strong { display:block; margin-top:.4em; color:#394735; font-size:1.8em; font-weight:750; }
.demo-chart { display:flex; align-items:end; gap:.6em; height:8em; padding:.8em 0 0; border-bottom:1px solid #c6ccba; }
.demo-chart i { flex:1; height:var(--bar,50%); background:#adc18b; border-radius:.25em .25em 0 0; }
.demo-chart i:nth-child(3n) { background:#d59873; }
.demo-chart-labels { display:flex; justify-content:space-between; margin-top:.7em; font-size:.7em; color:#7e8472; }
.demo-posts { display:grid; grid-template-columns:repeat(3,1fr); gap:.8em; padding:1.7em; }
.demo-post { padding:1em; border-radius:.7em; background:#f4f2e8; }
.demo-post small { color:#949888; font-size:.7em; }
.demo-post p { margin:.9em 0; font-size:.85em; line-height:1.45; }
.demo-post-status { display:inline-block; margin-top:1em; color:#5e7450; font-size:.7em; }
.demo-receipt { margin:.4em 0; padding:.85em; border-radius:.6em; border:1px solid #c5cdbb; }
.demo-receipt strong { display:block; font-size:.85em; }
.demo-receipt small { font-size:.7em; }
.demo-payment .demo-avatar { color:#a94235; background:#edcec2; }
.demo-payment-note { background:#e1e8cb; }
.demo-payment-note .demo-check { width:2.6em; height:2.6em; }
.demo-carousel { position:absolute; width:37%; height:74%; top:13%; left:31%; padding:1.7em; border-radius:.8em; box-shadow:0 1.1em 2em #0004; background:#e4e7d6; transform:rotate(-2deg); }
.demo-carousel.back-left { left:12%; transform:rotate(-13deg); background:#ccdab1; }
.demo-carousel.back-right { left:50%; transform:rotate(11deg); background:#d68159; }
.demo-carousel small { font-size:.75em; color:#61714f; }
.demo-carousel strong { display:block; margin-top:2.1em; font-size:1.6em; line-height:1.18; letter-spacing:-.035em; }
.demo-carousel i { display:block; height:.45em; width:90%; border-radius:1em; background:#4f5d402b; margin-top:1.2em; }
.demo-carousel i+i { width:65%; margin-top:.7em; }
.demo-carousel.back-right small { color:#713e29; }
.demo-landing-body { display:grid; grid-template-columns:1.1fr 1fr; gap:2em; padding:2em; }
.demo-landing-copy { padding-top:.5em; }
.demo-landing-copy small { font-size:.7em; color:#8b917c; }
.demo-landing-copy strong { display:block; margin:.7em 0; font-size:2em; line-height:1.05; font-weight:750; letter-spacing:-.04em; }
.demo-landing-copy p { color:#7a826c; font-size:.8em; line-height:1.45; }
.demo-landing-form { padding:1.4em; border-radius:.7em; background:#d5ddc7; }
.demo-landing-form b { display:block; font-size:1em; margin-bottom:1em; }
.demo-input { padding:.8em; margin:.7em 0; border-radius:.4em; background:#e8eddd; color:#99a18c; font-size:.75em; }
.demo-submit { padding:.85em; margin-top:1em; border-radius:.5em; background:#41513b; color:#d8e4c8; text-align:center; font-size:.8em; }
@media(min-width:1500px) { .bundle-catalog { grid-template-columns:275px minmax(0,1fr); gap:40px; } .bundle-tab { font-size:16px; min-height:47px; } }
@media(max-width:1050px) { .bundle-catalog { grid-template-columns:220px minmax(0,1fr); padding:28px; gap:24px; } .bundle-tab { font-size:14px; padding:9px 8px; gap:7px; } .bundle-detail h3 { font-size:25px; } .bundle-title-row { display:block; } .bundle-price { display:flex; gap:10px; align-items:baseline; margin-top:12px; text-align:left; font-size:19px; } .bundle-description { font-size:17px; } }
@media(max-width:760px) {
  .bundles { padding:32px 0 80px; scroll-margin-top:28px; }
  .bundles-heading { margin-bottom:32px; }
  .bundles-heading h2 { font-size:clamp(27px,5.5vw,37px); line-height:1.18; }
  .bundles-heading h2 br { display:none; }
  .bundles-handwritten { margin-bottom:12px; font-size:clamp(22px,7vw,42px); }
  .bundles-heading p { margin-top:18px; font-size:16px; }
  .bundle-catalog { display:block; padding:20px; border-radius:25px; transform:none; }
  .bundle-catalog>.author-glare { display:none; }
  .bundle-navigation { margin-bottom:22px; }
  .bundle-catalog[data-ready='true'] { padding:0; }
  .bundle-catalog[data-ready='true']::before { display:none; }
  .bundle-catalog[data-ready='true'] .bundle-navigation { display:none; }
  .bundle-catalog[data-ready='true'] .bundle-mobile-guide { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 2px 14px; }
  .bundle-mobile-note { color:#b5bcae; font-size:14px; }
  .bundle-mobile-guide .reviews-swipe-hint { flex-direction:row; gap:4px; width:auto; height:38px; font-size:12px; }
  .bundle-mobile-guide .reviews-swipe-hint svg { width:68px; height:34px; }
  .bundle-mobile-guide .reviews-swipe-hand { animation-play-state:paused; }
  .bundle-mobile-guide.is-in-view .reviews-swipe-hand { animation-play-state:running; }
  .bundle-mobile-guide[data-used='true'] .reviews-swipe-hand { animation:none; }
  .bundle-catalog[data-ready='true'] .bundle-panels { --bundle-bleed:23px; position:relative; display:flex; align-items:stretch; gap:12px; width:calc(100% + var(--bundle-bleed)); overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; scrollbar-width:none; border-radius:24px 0 0 24px; }
  .bundle-catalog[data-ready='true'] .bundle-panels::-webkit-scrollbar { display:none; }
  .bundle-catalog[data-ready='true'] .bundle-panels::after { content:''; flex:0 0 calc(16px + var(--bundle-bleed)); }
  .bundle-catalog[data-ready='true'] .bundle-panels:focus-visible { outline:2px solid #eaff00; outline-offset:4px; }
  .bundle-catalog[data-ready='true'] .bundle-panel { flex:0 0 calc(100% - 28px - var(--bundle-bleed)); padding:16px; border:1px solid #cbd0b40d; border-radius:24px; background:#0b0e0ded; scroll-snap-align:start; scroll-snap-stop:always; }
  .bundle-catalog[data-ready='true'] .bundle-price { flex-wrap:wrap; gap:3px 10px; }
  .bundle-catalog[data-ready='true'] .bundle-price span { white-space:normal; }
  .bundle-catalog[data-ready='true'] .bundle-detail { padding-top:20px; }
  .bundle-stage { border-radius:14px; aspect-ratio:1.4; }
  .bundle-canvas { font-size:2.25cqw; }
  .bundle-preview figcaption { right:10px; bottom:8px; font-size:11px; }
  .demo-window { left:4%; width:92%; top:10%; height:75%; }
  .demo-phone { width:42%; left:11%; height:89%; top:4%; }
  .demo-float-note { right:4%; width:43%; padding:1.4em; }
  .demo-mini-report { right:4%; width:43%; }
  .demo-posts { gap:.6em; padding:1.3em; }
  .demo-carousel { height:72%; }
  .bundle-detail { padding:23px 0 0; }
  .bundle-detail h3 { font-size:25px; }
  .bundle-title-row { display:block; }
  .bundle-price { margin-top:13px; }
  .bundle-description { font-size:17px; }
  .bundle-audience { font-size:14px; margin-top:13px; }
  .bundle-included { margin-top:19px; font-size:13px; }
}
@media(max-width:380px) { .bundle-catalog[data-ready='true'] .bundle-panels { --bundle-bleed:19px; } .bundle-catalog { padding:16px; } .bundle-detail h3 { font-size:23px; } .bundle-description { font-size:16px; } .bundles-heading h2 { font-size:26px; } }
@media(prefers-reduced-motion:reduce) { .bundle-panel.is-entering { animation:none; } .bundle-tab { transition:none; } }
@media(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce) { .bundle-catalog { transform:none!important; } .bundle-catalog>.author-glare { display:none; } }