/* Perfect Scents bundle builder, rebranded to the new identity (matches /preview2).
   Scoped to .bundle-page and loaded after the global storefront styles so it wins.
   No structural or backend change: this only re-skins the existing page. */

.bundle-page{
  --night:#0a1020; --night-2:#0d1526; --night-3:#18223c;
  --cream:#f5ecdb; --cream-2:#fdf8ee; --ink:#16120a; --ink-soft:#4a4335;
  --g1:#8a6414; --g3:#e9c65f; --gold:#d4a72c; --bone:#f6efe2; --sage:#84b59f;
  --metal:linear-gradient(103deg,#8a6414 0%,#c9992c 20%,#f6e4a6 42%,#e3b845 58%,#a2761a 76%,#f0d47f 100%);
  --b-display:"Archivo Black","Helvetica Neue","Arial Black",system-ui,sans-serif;
  --b-serif:"Didot","Bodoni MT","Hoefler Text",Garamond,Georgia,serif;
  --b-sans:ui-sans-serif,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--cream); color:var(--ink); font-family:var(--b-sans);
}

/* ---- header ---- */
.bundle-page .site-header{background:linear-gradient(#f5ecdb 62%,transparent); color:var(--ink)}
.bundle-page .brand{flex-direction:row; align-items:center}
.bundle-page .brand-main,.bundle-page .brand-sub{display:none}
.bundle-page .brand::before{content:""; display:block; width:150px; height:52px;
  background:url('/brand/perfect-scents-logo-transparent.png') left center / contain no-repeat}
.bundle-page .site-header nav a{color:var(--ink-soft); font-weight:600}
.bundle-page .site-header nav a::after{background:var(--gold)}
.bundle-page .dark-cta{color:#14100a; border:0; background:var(--metal); border-radius:3px; font-weight:800}
.bundle-page .dark-cta span{color:#14100a}
.bundle-page .menu-toggle span:not(.sr-only){background:var(--ink)}

/* ---- shared type ---- */
.bundle-page h1,.bundle-page h2{font-family:var(--b-display); font-weight:900;
  letter-spacing:-.02em; text-transform:uppercase; line-height:.98}
.bundle-page h1 em,.bundle-page h2 em{font-style:normal;
  background:var(--metal); -webkit-background-clip:text; background-clip:text; color:transparent}
.bundle-page .eyebrow{color:var(--g1)}
.bundle-page .eyebrow>span{background:var(--gold)}
.bundle-page .panel-no{color:var(--g1)}

/* ---- hero ---- */
.bundle-page .bundle-hero{background:radial-gradient(circle at 78% 30%,rgba(255,255,255,.85),transparent 30%),linear-gradient(135deg,#ede3d0,#fdf8ee)}
.bundle-page .bundle-hero:after{content:"BUNDLES"; color:rgba(138,100,20,.05); font-family:var(--b-display); font-weight:900}
.bundle-page .bundle-hero h1{font-size:clamp(2.6rem,8vw,5.6rem); line-height:.95}
.bundle-page .bundle-hero>div>p:last-child{color:var(--ink-soft)}
.bundle-page .bundle-principle{border-color:rgba(22,18,10,.18)}
.bundle-page .bundle-principle>strong{border-color:rgba(22,18,10,.12)}
.bundle-page .bundle-principle i{color:var(--g1)}

/* ---- schedule: the three bundle-type cards, now a navy gallery ---- */
.bundle-page .bundle-schedule{background:var(--night); color:var(--bone)}
.bundle-page .bundle-schedule .eyebrow{color:var(--g3)}
.bundle-page .schedule-intro h2{font-size:clamp(2rem,4.6vw,3.3rem); margin:1rem 0 1.3rem}
.bundle-page .schedule-intro>p:last-child{color:rgba(246,239,226,.8)}
.bundle-page .bundle-options{background:transparent; border:0; gap:16px}
.bundle-page .bundle-option{color:var(--bone); border-radius:14px; border:1px solid rgba(212,167,44,.16);
  background:
    repeating-linear-gradient(135deg,rgba(255,255,255,.02) 0 2px,transparent 2px 6px),
    linear-gradient(160deg,rgba(255,255,255,.05),transparent 42%),
    var(--night-2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 24px rgba(0,0,0,.28);
  transition:transform .13s ease,border-color .25s,box-shadow .25s}
.bundle-page .bundle-option:hover{transform:translateY(-3px); border-color:rgba(233,198,95,.42);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 32px rgba(0,0,0,.36)}
.bundle-page .bundle-option.active{border-color:rgba(233,198,95,.6);
  box-shadow:inset 0 0 0 1px rgba(233,198,95,.35),0 12px 26px rgba(0,0,0,.32)}
.bundle-page .bundle-option:active{transform:translateY(0) scale(.978)}
.bundle-page .bundle-option.active:after{color:var(--g3)}
.bundle-page .bundle-option>span{color:rgba(246,239,226,.72)}
.bundle-page .bundle-option>span b{font-family:var(--b-display); font-weight:900;
  background:var(--metal); -webkit-background-clip:text; background-clip:text; color:transparent}
.bundle-page .bundle-option dt{color:rgba(246,239,226,.6)}
.bundle-page .bundle-option dd{font-family:var(--b-serif); color:#fff}
.bundle-page .bundle-option>small{color:var(--sage)}
.bundle-page .bundle-option.unavailable>small{color:#d8a48a}
.bundle-page .bundle-size-heading h3{font-family:var(--b-display); text-transform:uppercase; letter-spacing:-.01em}

/* ---- builder ---- */
.bundle-page .bundle-builder .eyebrow{color:var(--g1)}
.bundle-page .builder-heading h2{font-size:clamp(2.2rem,6vw,4rem)}
.bundle-page .bundle-autofill{color:var(--ink); border-color:rgba(22,18,10,.2)}
.bundle-page .tier-picker{background:var(--cream-2); border-color:rgba(22,18,10,.1)}
.bundle-page .tier-heading{border-color:rgba(22,18,10,.1)}
.bundle-page .tier-kicker,.bundle-page .bundle-product>div:first-child>span{color:var(--g1)}
.bundle-page .tier-heading h3{font-family:var(--b-serif)}
.bundle-page .tier-heading>strong{font-family:var(--b-serif)}
.bundle-page .tier-heading>strong b{color:var(--g1)}
.bundle-page .bundle-product h4{font-family:var(--b-serif)}
.bundle-page .customer-upgrade-control{color:var(--ink-soft)}
.bundle-page .inventory-alert{background:#fbefd0; border-color:#e2c877; color:#6d551b}

/* ---- summary sidebar: navy ---- */
.bundle-page .bundle-summary{background:var(--night); color:var(--bone)}
.bundle-page .bundle-summary .panel-no{color:var(--g3)}
.bundle-page .summary-size strong{font-family:var(--b-display); font-weight:900;
  background:var(--metal); -webkit-background-clip:text; background-clip:text; color:transparent}
.bundle-page .summary-size span{color:rgba(246,239,226,.72)}
.bundle-page .bundle-summary dt{color:rgba(246,239,226,.72)}
.bundle-page .curated-preview>span,.bundle-page .confirmed-mix>span{color:var(--g3)}
.bundle-page .curated-preview p,.bundle-page .confirmed-mix p{color:rgba(246,239,226,.78)}
.bundle-page .curated-preview p b,.bundle-page .confirmed-mix p b{color:#fff}
.bundle-page .summary-total>span{color:rgba(246,239,226,.72)}
.bundle-page .summary-total strong{font-family:var(--b-display); font-weight:900; color:#fff; letter-spacing:-.01em}

/* ---- buttons ---- */
.bundle-page .button-primary{background:var(--metal); color:#14100a}
.bundle-page .button-primary span{color:#14100a}
.bundle-page .button-ghost:hover{border-color:var(--gold)}

/* ---- order dialog + payment panel ---- */
.bundle-page .order-dialog{background:var(--cream-2); color:var(--ink)}
.bundle-page .order-dialog h2{font-family:var(--b-display); text-transform:uppercase;
  letter-spacing:-.02em; font-size:clamp(1.9rem,5vw,2.9rem)}
.bundle-page .order-success h3{font-family:var(--b-display); text-transform:uppercase; letter-spacing:-.01em}
.bundle-page .confirmed-mix{background:var(--night)}
.bundle-page .bundle-success .button-ghost{color:var(--ink); border-color:rgba(22,18,10,.2)}

/* ---- footer ---- */
.bundle-page .bundle-footer{background:var(--night); color:rgba(246,239,226,.6)}
.bundle-page .bundle-footer a{color:var(--g3)}

  /* bundle picker product thumbnails */
  .bundle-page .bundle-product{gap:14px}
  .bundle-page .bundle-product>div:not(.bundle-quantity){flex:1;min-width:0}
  .bundle-page .bundle-thumb{margin:0;flex:0 0 auto;width:54px;height:54px;border-radius:6px;overflow:hidden;background:#0e1626}
  .bundle-page .bundle-thumb img{width:100%;height:100%;object-fit:cover;display:block}
  .bundle-page .bundle-thumb-empty{display:block;width:100%;height:100%;background:linear-gradient(135deg,#18223c,#0d1526)}