/* Deeper Heaven's product page (0.17.0, look "product_deeper"), after product.css and deeper.css: the product kit
   in the colours of /deeper-heaven/. The page carries th-product_deeper and th-deeper, so deeper.css gives the night
   page, the header, the footer and its own sections (the praise, the parts, the author); this sheet puts the buy box
   and the product sections on the night: card panels, gold for the button and the accents, Cormorant for titles. */

.th-product_deeper{
  --pd-red:var(--gold);--pd-rose:var(--goldlt);--pd-line:rgba(255,255,255,.18);--pd-soft:rgba(217,176,106,.1);--pd-text:var(--txt2);
  --cta:var(--gold);--ctah:var(--goldlt);--night:#0F0D16;--serif:var(--disp);
}
.th-product_deeper .sec-pd-crumbs{background:var(--deep);border-bottom:1px solid var(--nrule)}
.th-product_deeper .pd-crumbs nav,.th-product_deeper .pd-crumbs nav a{color:var(--txt3)}
.th-product_deeper .pd-crumbs nav span[aria-current]{color:var(--txt)}
.th-product_deeper .pd-ul{color:var(--txt);border-bottom-color:var(--gold)}
.th-product_deeper .pd-ul:hover{color:var(--goldlt)}

/* the hero: the night sky, a few stars, the gold */
.th-product_deeper .pd-hero{background:
  radial-gradient(1.5px 1.5px at 12% 22%,rgba(255,255,255,.7),transparent 60%),
  radial-gradient(1px 1px at 28% 68%,rgba(255,255,255,.55),transparent 60%),
  radial-gradient(1.5px 1.5px at 44% 12%,rgba(255,255,255,.6),transparent 60%),
  radial-gradient(1px 1px at 63% 82%,rgba(255,255,255,.5),transparent 60%),
  radial-gradient(1.5px 1.5px at 78% 30%,rgba(255,255,255,.65),transparent 60%),
  radial-gradient(1px 1px at 91% 58%,rgba(255,255,255,.5),transparent 60%),
  radial-gradient(1px 1px at 6% 86%,rgba(255,255,255,.45),transparent 60%),
  radial-gradient(1px 1px at 55% 45%,rgba(255,255,255,.35),transparent 60%),
  radial-gradient(ellipse 70% 80% at 22% 50%,#2A2340 0%,#17131F 50%,#0F0D16 85%);color:var(--txt2)}
.th-product_deeper .pd-cv{box-shadow:0 30px 70px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.06)}
.th-product_deeper .pd-kicker{color:var(--gold);letter-spacing:.2em}
.th-product_deeper .pd-title{font-family:var(--disp);font-weight:500;color:#F7F2E8}
.th-product_deeper .pd-sub{color:var(--goldlt)}
.th-product_deeper .pd-credits{color:var(--txt3)}
.th-product_deeper .pd-strap{color:var(--txt)}
.th-product_deeper .pd-also{color:var(--txt2)}
.th-product_deeper .pd-also:hover{color:var(--goldlt)}

/* the buy box on a card */
.th-product_deeper .pd-box{background:var(--card2);color:var(--txt);box-shadow:0 24px 60px rgba(0,0,0,.6),inset 0 0 0 1px var(--nrule2)}
.th-product_deeper .pd-buying{border-bottom-color:var(--nrule)}
.th-product_deeper .pd-buying-k,.th-product_deeper .pd-ed-note,.th-product_deeper .pd-buy-note{color:var(--txt3)}
.th-product_deeper .pd-buying-t b,.th-product_deeper .pd-buying-l{color:var(--txt)}
.th-product_deeper .pd-ed,.th-product_deeper .pd-add{background:transparent;box-shadow:inset 0 0 0 1px var(--pd-line);color:var(--txt)}
.th-product_deeper .pd-ed.on,.th-product_deeper .pd-ed:has(input:checked),.th-product_deeper .pd-add:has(input:checked){background:var(--pd-soft);box-shadow:inset 0 0 0 2px var(--gold)}
.th-product_deeper .pd-ed-price{color:var(--txt2)}
.th-product_deeper .pd-ed.on .pd-ed-price,.th-product_deeper .pd-ed:has(input:checked) .pd-ed-price{color:var(--goldlt)}
.th-product_deeper .pd-ed-price s,.th-product_deeper .pd-add-p s{color:var(--txt3)}
.th-product_deeper .pd-sum{background:rgba(255,255,255,.05);color:var(--txt2)}
.th-product_deeper .pd-qty input{background:transparent;color:var(--txt);border-color:var(--pd-line)}
.th-product_deeper .pd-qty,.th-product_deeper .pd-qty label{color:var(--txt2)}
.th-product_deeper .pd-btn,.th-product_deeper a.pd-btn{background:var(--gold);color:#15121C;border-radius:6px}
.th-product_deeper .pd-btn:hover{background:var(--goldlt);color:#15121C}
.th-product_deeper .pd-btn.line{background:none;color:var(--txt);box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
.th-product_deeper .pd-msg{color:var(--rose)}
.th-product_deeper .pd-add-n,.th-product_deeper .pd-add-t b{color:var(--txt)}

/* the product sections on the night */
.th-product_deeper .pd-eyebrow{color:var(--gold);letter-spacing:.2em}
.th-product_deeper .pd-h2{font:500 clamp(30px,4vw,44px)/1.08 var(--disp);color:#F7F2E8}
.th-product_deeper .pd-h3{font:500 26px/1.2 var(--disp);color:#F7F2E8}
.th-product_deeper .pd-prose p,.th-product_deeper .pd-head-text p{color:var(--txt2)}
.th-product_deeper .pd-aside{background:var(--card);border-top-color:var(--gold)}
.th-product_deeper .pd-aside h3{color:var(--txt);font-family:var(--sans)}
.th-product_deeper .pd-aside li{color:var(--txt2)}
.th-product_deeper .pd-aside li::before{background:var(--gold)}
.th-product_deeper .pd-contents,.th-product_deeper .bg-white .pd-contents{background:var(--card);border-color:var(--nrule2)}
.th-product_deeper .pd-contents-t{color:var(--txt)}
.th-product_deeper .pd-contents-n,.th-product_deeper .pd-contents-l,.th-product_deeper .pd-contents-pg,.th-product_deeper .pd-contents-list li.sub{color:var(--txt3)}
.th-product_deeper .pd-contents-list li{color:var(--txt2);border-bottom-color:var(--nrule)}
.th-product_deeper .pd-contents-list li.h{color:var(--gold)}
.th-product_deeper .pd-info dl div{border-top-color:var(--nrule)}
.th-product_deeper .pd-info dt{color:var(--txt3)}
.th-product_deeper .pd-info dd{color:var(--txt)}
.th-product_deeper .pd-line p{color:var(--txt2)}
.th-product_deeper .pd-close-h{font-family:var(--disp);color:#F7F2E8}
.th-product_deeper .pd-close-l{color:var(--txt3)}
.th-product_deeper .sec-pd-closing{background:var(--deep)}
/* the added-to-cart panel stays light, as on every product page */
.th-product_deeper .pd-dr .pd-btn.line{color:var(--ink,#1B2532);box-shadow:inset 0 0 0 1.5px #1B2532}