:root{--night:#2c2a5e;--night-dk:#1e1c45;--dusk:#514dbb;--ink:#23233a;--slate:#5f5f78;--mist:#f4f4fb;--card:#ffffff;--line:#e1e1ef;--gold:#d9962e}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Public Sans',system-ui,sans-serif;background:var(--mist);color:var(--ink);line-height:1.65;font-size:16px}
h1,h2,h3,h4{font-family:'Fraunces',Georgia,serif;font-weight:600;line-height:1.25;color:var(--ink)}
a{color:var(--dusk);text-decoration:none}
img{max-width:100%;display:block}
.frame{max-width:1120px;margin:0 auto;padding:0 22px}

/* header */
.dr-head{background:var(--night);color:#fff}
.dr-head .frame{display:flex;align-items:center;justify-content:space-between;min-height:66px;gap:18px}
.dr-wordmark{font-family:'Fraunces',serif;font-size:1.35rem;font-weight:600;color:#fff;letter-spacing:.02em}
.dr-wordmark em{font-style:normal;color:#b9b4f2}
.dr-links{display:flex;gap:26px;align-items:center}
.dr-links a{color:#d6d4f0;font-size:.93rem;font-weight:500}
.dr-links a:hover,.dr-links a.on{color:#fff}
.dr-burger{display:none;background:none;border:1px solid #55519a;color:#fff;border-radius:8px;padding:6px 12px;font-size:1.05rem;cursor:pointer}
@media(max-width:840px){
  .dr-burger{display:block}
  .dr-links{display:none;position:absolute;top:66px;left:0;right:0;background:var(--night-dk);flex-direction:column;padding:18px 22px;gap:16px;z-index:50;align-items:flex-start}
  .dr-links.open{display:flex}
  .dr-head{position:relative}
}

/* hero */
.dr-hero{background:linear-gradient(160deg,var(--night) 0%,var(--night-dk) 55%,#191738 100%);color:#fff;padding:74px 0 82px;position:relative;overflow:hidden}
.dr-hero::after{content:"";position:absolute;inset:0;background-image:radial-gradient(#ffffff33 1px,transparent 1.5px),radial-gradient(#ffffff22 1px,transparent 1.5px);background-size:190px 130px,120px 170px;background-position:20px 30px,80px 90px;pointer-events:none}
.dr-hero .frame{position:relative;z-index:1;max-width:760px;text-align:center}
.dr-eyebrow{display:inline-block;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:#b9b4f2;margin-bottom:18px}
.dr-hero h1{font-size:clamp(1.9rem,4.4vw,3rem);color:#fff;margin-bottom:18px}
.dr-hero p{color:#cfcde8;font-size:1.08rem;max-width:600px;margin:0 auto 30px}
.dr-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.dr-cta{display:inline-block;background:#fff;color:var(--night);font-weight:700;padding:13px 30px;border-radius:999px;font-size:.95rem}
.dr-cta:hover{background:#e9e7fb}
.dr-cta.ghost{background:transparent;color:#fff;border:1px solid #6d68b5}
.dr-cta.ghost:hover{border-color:#fff}

/* sections */
.dr-sec{padding:60px 0}
.dr-sec.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.dr-sec h2{font-size:1.7rem;margin-bottom:8px}
.dr-sub{color:var(--slate);max-width:640px;margin-bottom:34px}

/* category tiles */
.dr-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}
.dr-tile{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px 26px 24px;position:relative;transition:box-shadow .18s,transform .18s;display:block;color:inherit}
.dr-tile:hover{box-shadow:0 14px 34px rgba(44,42,94,.13);transform:translateY(-3px)}
.dr-tile .tagline{display:inline-block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dusk);background:#edecfb;border-radius:999px;padding:3px 12px;margin-bottom:14px}
.dr-tile h3{font-size:1.22rem;margin-bottom:8px}
.dr-tile p{color:var(--slate);font-size:.92rem;margin-bottom:14px}
.dr-tile .go{font-weight:600;font-size:.9rem}

/* product cards */
.dr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:20px}
.dr-card{background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .18s,transform .18s}
.dr-card:hover{box-shadow:0 14px 34px rgba(44,42,94,.13);transform:translateY(-3px)}
.dr-card .pic{background:#fff;padding:24px;display:flex;align-items:center;justify-content:center}
.dr-card .pic img{max-height:190px;object-fit:contain}
.dr-card .body{padding:4px 20px 20px;display:flex;flex-direction:column;flex:1}
.dr-card h3{font-size:1.02rem;margin-bottom:6px}
.dr-card h3 a{color:inherit}
.dr-card h3 a:hover{color:var(--dusk)}
.dr-card .blurb{color:var(--slate);font-size:.86rem;flex:1;margin-bottom:12px}
.dr-meta{display:flex;align-items:baseline;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.dr-price{font-family:'Fraunces',serif;font-size:1.25rem;font-weight:600}
.dr-stars{color:var(--gold);font-size:.86rem;letter-spacing:.05em}
.dr-count{color:var(--slate);font-size:.8rem}
.dr-shop{display:block;text-align:center;background:var(--dusk);color:#fff;font-weight:600;border-radius:10px;padding:11px 0;font-size:.9rem}
.dr-shop:hover{background:var(--night)}

/* why band */
.dr-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.dr-band>div{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px 24px}
.dr-band h3{font-size:1rem;margin-bottom:8px}
.dr-band p{color:var(--slate);font-size:.88rem}
.dr-band .n{display:inline-flex;width:34px;height:34px;border-radius:50%;background:var(--night);color:#fff;align-items:center;justify-content:center;font-family:'Fraunces',serif;margin-bottom:12px}

/* FAQ */
.dr-qa{max-width:760px}
.dr-qa details{background:var(--card);border:1px solid var(--line);border-radius:14px;margin-bottom:12px;padding:0 22px}
.dr-qa summary{cursor:pointer;font-weight:600;padding:16px 0;list-style:none;position:relative;padding-right:30px}
.dr-qa summary::after{content:"+";position:absolute;right:2px;top:14px;font-size:1.25rem;color:var(--dusk)}
.dr-qa details[open] summary::after{content:"−"}
.dr-qa details p{color:var(--slate);font-size:.93rem;padding-bottom:18px}

/* breadcrumbs + PDP */
.dr-crumbs{font-size:.83rem;color:var(--slate);margin:26px 0 8px}
.dr-crumbs a{color:var(--slate)}
.dr-crumbs a:hover{color:var(--dusk)}
.dr-pdp{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:44px;padding:26px 0 60px;align-items:start}
@media(max-width:840px){.dr-pdp{grid-template-columns:1fr}}
.dr-pdp .photo{background:#fff;border:1px solid var(--line);border-radius:20px;padding:34px;display:flex;align-items:center;justify-content:center;position:sticky;top:20px}
.dr-pdp .photo img{max-height:430px;object-fit:contain}
.dr-pdp h1{font-size:1.65rem;margin-bottom:12px}
.dr-pdp .full-title{color:var(--slate);font-size:.9rem;margin-bottom:16px}
.dr-pdp .dr-meta{margin-bottom:18px}
.dr-pdp .dr-price{font-size:1.7rem}
.dr-feats{margin:20px 0 26px}
.dr-feats li{margin:0 0 10px 22px;color:#39394f;font-size:.94rem}
.dr-buy{display:inline-block;background:var(--dusk);color:#fff;font-weight:700;border-radius:12px;padding:15px 42px;font-size:1rem}
.dr-buy:hover{background:var(--night)}
.dr-fineprint{color:var(--slate);font-size:.8rem;margin-top:12px}

/* docs (service pages) */
.dr-doc{max-width:780px;padding:34px 0 64px}
.dr-doc h1{font-size:1.9rem;margin-bottom:14px}
.dr-doc h2{font-size:1.25rem;margin:30px 0 10px}
.dr-doc p{margin-bottom:14px;color:#39394f}
.dr-doc ul{padding-left:22px;margin-bottom:14px}
.dr-doc li{margin-bottom:8px;color:#39394f}
.dr-doc .lede{font-size:1.06rem;color:var(--slate);max-width:660px}
.dr-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin:24px 0 10px}
.dr-facts>div{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.dr-facts h3{font-size:.98rem;margin-bottom:6px}
.dr-facts p{font-size:.86rem;margin:0;color:var(--slate)}
.dr-callout{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--dusk);border-radius:12px;padding:14px 18px;margin:20px 0;font-size:.92rem;color:#39394f}

/* footer */
.dr-foot{background:var(--night-dk);color:#b9b7d8;padding:52px 0 40px;margin-top:30px}
.dr-foot .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:38px}
@media(max-width:760px){.dr-foot .cols{grid-template-columns:1fr}}
.dr-foot h4{color:#fff;font-size:.95rem;margin-bottom:14px}
.dr-foot a{display:block;color:#b9b7d8;font-size:.9rem;margin-bottom:9px}
.dr-foot a:hover{color:#fff}
.dr-foot p{font-size:.85rem;line-height:1.7}
.dr-foot .legal{border-top:1px solid #39366b;margin-top:36px;padding-top:20px;font-size:.8rem;color:#8f8cb8;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}