/* Perfect Scents catalogue, rebranded to the new identity (matches the homepage).
   Scoped to .catalogue-page, loaded after the global storefront styles so it wins.
   Re-skin only: no structure, script or pricing changes. */

.catalogue-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: her logo, brand nav ---- */
.catalogue-page .site-header{background:linear-gradient(#f5ecdb 62%,transparent); color:var(--ink)}
.catalogue-page .brand{flex-direction:row; align-items:center}
.catalogue-page .brand-main,.catalogue-page .brand-sub{display:none}
.catalogue-page .brand::before{content:""; display:block; width:150px; height:50px;
  background:url('/brand/perfect-scents-logo-transparent.png') left center / contain no-repeat}
.catalogue-page .site-header nav a{color:var(--ink-soft); font-weight:600}
.catalogue-page .site-header nav a::after{background:var(--gold)}
.catalogue-page .menu-toggle span:not(.sr-only){background:var(--ink)}
.catalogue-page .cart-button{background:var(--night)}
.catalogue-page .cart-button b{background:var(--metal); color:#14100a}

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

/* ---- hero + mode switch ---- */
.catalogue-page .catalogue-hero{background:radial-gradient(circle at 78% 30%,rgba(255,255,255,.85),transparent 30%),linear-gradient(135deg,#ede3d0,#fdf8ee)}
.catalogue-page .catalogue-hero:after{color:rgba(138,100,20,.05); font-family:var(--b-display)}
.catalogue-page .catalogue-hero h1{font-size:clamp(2.8rem,8vw,5.6rem)}
.catalogue-page .catalogue-hero .eyebrow{color:var(--g1)}
.catalogue-page .catalogue-hero>p:not(.eyebrow){color:var(--ink-soft)}
.catalogue-page .mode-switch{border-color:rgba(22,18,10,.18); background:rgba(255,255,255,.5)}
.catalogue-page .mode-switch button.active{color:#fff}
.catalogue-page .mode-switch i{background:var(--night)}

/* ---- tools ---- */
.catalogue-page .search-field input:focus{border-color:var(--g1)}
.catalogue-page .family-filters button{border-color:rgba(22,18,10,.14)}
.catalogue-page .family-filters button.active{background:var(--night); color:#fff}

/* ---- product cards ---- */
.catalogue-page .product-grid{background:rgba(22,18,10,.12); border-color:rgba(22,18,10,.12)}
.catalogue-page .product-card{background:var(--cream-2)}
.catalogue-page .product-visual{background:#f4efe4}
/* Uniform presentation: every product shown whole, centred, on the same field with equal padding, regardless of the source photo's size or orientation. */
.catalogue-page .product-photo{object-fit:contain; padding:24px; box-sizing:border-box; background:#f4efe4}
.catalogue-page .product-meta p{color:var(--g1)}
.catalogue-page .product-meta h3{font-family:var(--b-serif)}
.catalogue-page .product-buy strong{font-family:var(--b-serif)}
.catalogue-page .product-buy strong{color:var(--g1)}
.catalogue-page .product-buy button{border-color:var(--g1); color:var(--g1)}
.catalogue-page .product-buy button:hover{background:var(--metal); color:#14100a; border-color:transparent}

/* ---- trade banner: navy ---- */
.catalogue-page .trade-banner{background:var(--night); color:var(--bone)}
.catalogue-page .trade-banner .eyebrow{color:var(--g3)}
.catalogue-page .trade-banner h2 em{background:var(--metal); -webkit-background-clip:text; background-clip:text; color:transparent}
.catalogue-page .trade-banner p:not(.eyebrow){color:rgba(246,239,226,.8)}

/* ---- cart drawer ---- */
.catalogue-page .cart-drawer{background:var(--cream-2); color:var(--ink)}
.catalogue-page .cart-head h2{font-family:var(--b-display); text-transform:uppercase; letter-spacing:-.01em}
.catalogue-page .cart-line span{color:var(--g1)}
.catalogue-page .cart-line h3,.catalogue-page .cart-line>strong{font-family:var(--b-serif)}
.catalogue-page .cart-empty p{font-family:var(--b-serif)}
.catalogue-page .cart-summary strong{font-family:var(--b-display); font-weight:900}

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

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

/* ---- footer ---- */
.catalogue-page .catalogue-footer{background:var(--night); color:rgba(246,239,226,.6); padding:30px 5vw; display:flex; justify-content:space-between; font-size:8px; text-transform:uppercase; letter-spacing:.13em}
.catalogue-page .catalogue-footer a{color:var(--g3)}

/* explicit cart remove control */
.catalogue-page .cart-remove{background:none;border:0;padding:0;margin-top:6px;font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--g1);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.catalogue-page .cart-remove:hover{color:#9a3426}