:root{--bg:#faf8f4;--bg2:#f1ede6;--line:#e4ded4;--ink:#2e2d2b;--mute:#7a756d;--gold:#a8653d;--cu:#8f5232;--serif:"Cormorant Garamond",Georgia,serif;--sans:"Inter",system-ui,sans-serif;--mono:"JetBrains Mono",ui-monospace,monospace}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:300 16px/1.65 var(--sans);letter-spacing:.01em}
a{color:inherit;text-decoration:none}img,svg{max-width:100%;display:block}
.wrap{max-width:1240px;margin:0 auto;padding:0 28px}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.notice{background:var(--bg2);color:var(--gold);text-align:center;font:500 12px var(--mono);letter-spacing:.12em;padding:8px;text-transform:uppercase}
header{position:sticky;top:0;z-index:20;background:rgba(250,248,244,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px;gap:24px}
.logo{font:400 26px var(--serif);letter-spacing:.06em}.logo b{color:var(--gold);font-weight:500}
.logo small{display:block;font:400 9px var(--mono);letter-spacing:.3em;color:var(--mute);margin-top:-4px}
.menu{display:flex;gap:30px;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.menu a:hover,.menu a.on{color:var(--gold)}
.tools{display:flex;gap:18px;align-items:center;font-size:13px}.cartc{border:1px solid var(--line);padding:6px 12px}
.burger{display:none;background:none;border:0;color:var(--ink);font-size:24px}
h1,h2,h3{font-family:var(--serif);font-weight:300;line-height:1.08}
h1{font-size:clamp(46px,7vw,96px)}h2{font-size:clamp(34px,4.4vw,58px)}h3{font-size:28px}
.gold{color:var(--gold);font-style:italic}
section{padding:140px 0;border-bottom:1px solid var(--line)}
.hero{padding:90px 0 110px;background:linear-gradient(180deg,#fff 0,var(--bg) 100%)}
.hero .g{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center}
.lead{font-size:19px;color:var(--mute);max-width:520px;margin:26px 0 36px}
.btn{display:inline-block;border:1px solid var(--gold);padding:15px 28px;font:500 12px var(--mono);letter-spacing:.16em;text-transform:uppercase;transition:.25s;cursor:pointer;background:none;color:var(--ink)}
.btn.f{background:var(--gold);color:#fff}.btn:hover{background:var(--cu);border-color:var(--cu);color:#fff}
.row{display:flex;gap:14px;flex-wrap:wrap}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.card{background:var(--bg);padding:38px;display:flex;flex-direction:column;gap:14px}
.card:hover{background:var(--bg2)}.card .vis{aspect-ratio:1/1;background:var(--bg2);display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.price{font:500 15px var(--mono);color:var(--ink)}.price em{font-style:normal;color:var(--mute);font-size:10px;margin-left:8px}
.dose{width:100%;border-collapse:collapse;font-size:14px}.dose td{padding:13px 0;border-bottom:1px solid var(--line)}
.dose td:last-child{text-align:right;font-family:var(--mono);color:var(--gold)}
.sec-h{display:flex;justify-content:space-between;align-items:end;margin-bottom:56px;gap:30px;flex-wrap:wrap}.sec-h p{max-width:440px;color:var(--mute)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.stats div{padding:30px 20px;border-right:1px solid var(--line)}.stats b{display:block;font:400 42px var(--serif);color:var(--gold)}
.ph{border:1px dashed #d6c8b8;color:var(--mute);font:11px var(--mono);letter-spacing:.1em;text-align:center;padding:6px}
details{border-bottom:1px solid var(--line);padding:22px 0}summary{cursor:pointer;font:400 22px var(--serif);list-style:none;display:flex;justify-content:space-between}
summary:after{content:"+";color:var(--gold)}details[open] summary:after{content:"–"}details p{color:var(--mute);margin-top:12px;max-width:760px}
form input,form select{width:100%;background:#fff;border:1px solid var(--line);color:var(--ink);padding:15px;font:inherit;margin-bottom:12px}
.disc{font-size:12px;color:var(--mute);border:1px solid var(--line);padding:18px;margin-top:30px}
footer{padding:80px 0 40px;font-size:14px;color:var(--mute)}footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:50px}
footer h4{font:500 11px var(--mono);letter-spacing:.2em;color:var(--gold);text-transform:uppercase;margin-bottom:16px}footer li{list-style:none;margin:8px 0}
.crumb{padding:26px 0;font:11px var(--mono);letter-spacing:.14em;color:var(--mute);text-transform:uppercase}
.pd{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;padding-bottom:100px}
.pd .vis{background:var(--bg2);aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;position:sticky;top:100px}
.opt{display:flex;gap:10px;margin:24px 0}.opt label{flex:1;border:1px solid var(--line);padding:16px;cursor:pointer}.opt input{accent-color:var(--gold);margin-right:8px}
.toast{position:fixed;bottom:24px;right:24px;background:var(--gold);color:#fff;padding:14px 22px;font:500 12px var(--mono);opacity:0;transition:.3s;z-index:50}.toast.s{opacity:1}
[dir=rtl] .dose td:last-child{text-align:left}
@media(max-width:900px){.menu{display:none}.menu.open{display:flex;flex-direction:column;position:absolute;top:72px;left:0;right:0;background:var(--bg);padding:24px 28px;border-bottom:1px solid var(--line)}.burger{display:block}
.hero .g,.grid2,.pd{grid-template-columns:1fr;gap:40px}.grid3{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}footer .cols{grid-template-columns:1fr 1fr}section{padding:70px 0}.pd .vis{position:static}}

.card{background:#fff}.card:hover{background:var(--bg)}
.vis img,.pd .vis img{width:100%;height:100%;object-fit:cover}
.card .vis,.pd .vis{background:#fff;overflow:hidden}
.hero .vis{aspect-ratio:4/3;overflow:hidden}
.wide{aspect-ratio:21/9;overflow:hidden;margin-top:80px}.wide img{width:100%;height:100%;object-fit:cover}
.stats b{font-weight:300}
.logo{font-weight:300}
/* Adobe Stock backgrounds */
.bg-curve,.bg-bars,.bg-rings{position:relative;background-size:cover;background-position:center}
.bg-curve{background-image:linear-gradient(90deg,rgba(244,241,234,.92) 0,rgba(244,241,234,.6) 55%,rgba(244,241,234,.25) 100%),url(img/bg-curve.jpg)}
.bg-bars{background-image:linear-gradient(90deg,rgba(244,241,234,.95) 0,rgba(244,241,234,.75) 60%,rgba(244,241,234,.4) 100%),url(img/bg-copper-bars.jpg)}
.bg-rings{background-image:linear-gradient(rgba(244,241,234,.82),rgba(244,241,234,.82)),url(img/bg-rings.jpg)}
.band{padding:100px 0}
@media(max-width:800px){.bg-curve,.bg-bars{background-image:linear-gradient(rgba(244,241,234,.88),rgba(244,241,234,.88)),url(img/bg-curve.jpg)}.bg-bars{background-image:linear-gradient(rgba(244,241,234,.9),rgba(244,241,234,.9)),url(img/bg-copper-bars.jpg)}}
/* Transparent packshots */
.vis{background:transparent!important}
.vis img.pk{width:auto!important;height:auto!important;max-width:100%;object-fit:contain!important;margin:0 auto;filter:drop-shadow(0 18px 22px rgba(60,40,25,.16)) drop-shadow(0 3px 5px rgba(60,40,25,.10))}
.hero .vis{aspect-ratio:auto!important;overflow:visible!important;display:flex;align-items:center;justify-content:center}
.hero .vis img.pk{max-height:460px}
.card .vis{aspect-ratio:auto!important;height:280px;overflow:visible!important;background:var(--bg)!important;border-radius:2px}
.card:hover .vis{background:var(--bg2)!important}
.card .vis img.pk{max-height:240px;max-width:86%}
.pd .vis{aspect-ratio:auto!important;min-height:520px;overflow:visible!important;background:radial-gradient(ellipse at 50% 55%,#efe9df 0,rgba(244,241,234,0) 70%)!important}
.pd .vis img.pk{max-height:460px;max-width:88%}
@media(max-width:900px){.hero .vis img.pk,.pd .vis img.pk{max-height:280px}.pd .vis{min-height:320px}.card .vis{height:240px}.card .vis img.pk{max-height:210px}}
.card .vis,.card:hover .vis{background:transparent!important}
.pd .vis{align-self:start;height:560px;min-height:0}
@media(max-width:900px){.pd .vis{height:320px}}
.pd .vis{background:transparent!important}
