:root{--bg:#000;--fg:#fff;--mut:#8a8a8a;--line:#262626;--card:#0a0a0a;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:env(safe-area-inset-top,0px);scroll-behavior:smooth}
*,*:before,*:after{box-sizing:inherit}
body{margin:0;background:#000;color:#fff;font-family:Archivo,Helvetica,Arial,sans-serif;line-height:1.5}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
:focus-visible{outline:2px solid #fff;outline-offset:3px}
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;display:flex;justify-content:space-between;align-items:center;padding:18px 5vw;background:rgba(0,0,0,.85);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.logo{font-weight:900;letter-spacing:.18em;font-size:18px}
nav{display:flex;gap:28px;align-items:center;font-size:14px;color:var(--mut)}
nav a:hover{color:#fff}
.cartbtn{background:none;border:1px solid #fff;color:#fff;padding:8px 16px;border-radius:0}
.cartbtn:hover{background:#fff;color:#000}
.hero{min-height:88vh;display:flex;flex-direction:column;justify-content:center;padding:8vh 5vw;position:relative;overflow:hidden}
.hero h1{font-size:clamp(48px,11vw,168px);line-height:.92;font-weight:900;letter-spacing:-.04em;margin:0}
.hero h1 span{display:block;color:transparent;-webkit-text-stroke:2px #fff}
.hero p{max-width:44ch;color:var(--mut);font-size:18px;margin:28px 0 36px}
.cta{display:inline-block;background:#fff;color:#000;padding:16px 36px;font-weight:800;border:0}
.cta:hover{background:#d9d9d9}
.glow{position:absolute;right:-10vw;top:10%;width:50vw;height:50vw;max-width:640px;max-height:640px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.14),transparent 65%);pointer-events:none;transition:transform .2s}
.marquee{overflow:hidden;border-block:1px solid var(--line);padding:16px 0;white-space:nowrap}
.marquee div{display:inline-block;animation:slide 28s linear infinite;font-weight:800;font-size:20px;letter-spacing:.12em}
.marquee span{margin:0 28px;color:var(--mut)}
@keyframes slide{to{transform:translateX(-50%)}}
section{padding:10vh 5vw}
h2{font-size:clamp(32px,5vw,64px);letter-spacing:-.03em;margin:0 0 12px;font-weight:900}
.sub{color:var(--mut);margin:0 0 40px;max-width:52ch}
.tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}
.tab{background:none;color:var(--mut);border:1px solid var(--line);padding:10px 22px}
.tab[aria-selected=true]{background:#fff;color:#000;border-color:#fff}
.routine{border:1px solid var(--line);padding:32px;min-height:140px;background:var(--card)}
.routine h3{margin:0 0 8px;font-size:24px}
.routine p{color:var(--mut);margin:0 0 16px;max-width:60ch}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}
.card{border:1px solid var(--line);background:var(--card);transition:border-color .2s}
.card:hover{border-color:#fff}
.img{aspect-ratio:1;display:grid;place-items:center;font-size:72px;background:#050505;border-bottom:1px solid var(--line);transition:transform .4s}
.card:hover .img{transform:scale(1.06)}
.imgw{overflow:hidden}
.info{padding:18px;display:flex;justify-content:space-between;align-items:flex-end;gap:10px}
.info h3{margin:0;font-size:17px}
.info small{color:var(--mut)}
.add{background:#fff;color:#000;border:0;padding:9px 14px;font-weight:800}
.add:hover{background:#cfcfcf}
.vals{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:40px;border-top:1px solid var(--line);padding-top:40px}
.vals h3{margin:0 0 8px;font-size:22px}
.vals p{margin:0;color:var(--mut)}
.signup{text-align:center;border-top:1px solid var(--line)}
.signup form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:24px}
.signup input{background:#000;border:1px solid #fff;color:#fff;padding:15px 18px;min-width:min(320px,100%);font:inherit}
.msg{margin-top:14px;color:var(--mut);min-height:24px}
footer{padding:40px 5vw;border-top:1px solid var(--line);display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;color:var(--mut);font-size:14px}
.drawer{position:fixed;top:0;right:0;height:100%;width:min(400px,100%);background:#000;border-left:1px solid #fff;z-index:50;transform:translateX(100%);transition:transform .35s;display:flex;flex-direction:column;padding:24px;padding-top:calc(24px + env(safe-area-inset-top,0px))}
.drawer.open{transform:none}
.drawer h3{margin:0 0 16px;font-size:20px;letter-spacing:.1em}
#items{flex:1;overflow:auto}
.row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}
.row button{background:none;border:0;color:var(--mut);margin-left:10px}
.empty{color:var(--mut)}
.tot{display:flex;justify-content:space-between;font-weight:800;padding:16px 0}
.close{align-self:flex-end;background:none;border:0;color:#fff;font-size:28px;line-height:1}
.reveal{opacity:0;transform:translateY(18px);transition:.7s}
.reveal.in{opacity:1;transform:none}
@media(max-width:640px){nav a{display:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

.pgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:40px;align-items:start}
.pgrid select{background:#000;color:#fff;border:1px solid #fff;padding:12px;width:100%;margin:16px 0;font:inherit}
.pgrid img,.img img{width:100%;height:100%;object-fit:cover;display:block}
.rich{color:var(--mut);max-width:60ch}
.pager{margin-top:32px;color:var(--mut)}
.hide{display:none}
.tab-panel[hidden]{display:none}