/* ---------- Home ---------- */
.hero{overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding-block:clamp(40px,6vw,84px)}
.hero h1{color:var(--on-hero)}
.hero-art{position:relative;height:460px}
.ha{position:absolute;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.ha svg{width:100%;height:100%;display:block}
.ha1{width:56%;height:78%;inset-inline-start:2%;top:6%;border-radius:var(--arch)}
.ha2{width:42%;height:42%;inset-inline-end:2%;top:0;border-radius:50%}
.ha3{width:44%;height:50%;inset-inline-end:0;bottom:2%;border-radius:22px;transform:rotate(3deg)}
.ha4{width:34%;height:30%;inset-inline-start:38%;bottom:0;border-radius:22px;transform:rotate(-4deg);border:4px solid var(--hero-bg-2)}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr}.hero-art{height:320px}}
.story{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(24px,5vw,64px);align-items:center}
.story-art{border-radius:var(--arch);overflow:hidden;aspect-ratio:3/4;max-height:520px;box-shadow:var(--shadow-2)} .story-art svg{width:100%;height:100%;display:block}
@media (max-width:760px){.story{grid-template-columns:1fr}.story-art{max-width:300px}}
.tico{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--surface-3);color:var(--brand-text)}
.tico .ico{width:22px;height:22px}
.trust.t0 .tico{background:#f9dce5;color:#6d2e46}.trust.t1 .tico{background:#d9efe7;color:#1f6b56}.trust.t2 .tico{background:#fcecc9;color:#9a6208}.trust.t3 .tico{background:#dce8f8;color:#2a5aa0}
.cta-band{display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:clamp(24px,4vw,44px);border:0}
/* ---------- Collections ---------- */
.coll{display:flex;flex-direction:column;gap:8px;color:var(--ink);text-decoration:none!important}
.coll-art{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:8px;aspect-ratio:4/3}
.coll-art .art{border-radius:14px;aspect-ratio:auto;height:100%}.coll-art .art:first-child{grid-row:1/3}
.coll:hover h3{color:var(--brand-text)}
/* ---------- Studio / artist page ---------- */
.studio-cover{height:clamp(110px,18vw,200px);overflow:hidden}.studio-cover svg{width:100%;height:100%;display:block}
.studio-head{display:flex;gap:22px;align-items:flex-end;flex-wrap:wrap;margin-top:-52px}
/* ---------- Artwork page ---------- */
.pdp{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(22px,4vw,56px);align-items:start}
@media (max-width:860px){.pdp{grid-template-columns:1fr}}
.pdp-art{aspect-ratio:1;border-radius:var(--r-lg)} .pdp-art svg{width:100%;height:100%}
.thumb{width:84px;border:2px solid transparent;border-radius:14px;padding:0;background:none}.thumb[aria-pressed=true]{border-color:var(--brand)}.thumb .art{border-radius:11px}
.price-big{font-family:var(--font-display);font-size:2rem;font-weight:800}.price-big s{font-size:1.1rem;color:var(--muted);font-weight:500}
.buybox{padding:18px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface)}
.artist-strip{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.buybar{display:none}
@media (max-width:900px){.buybar{display:flex;position:fixed;inset-inline:0;bottom:calc(66px + env(safe-area-inset-bottom,0px));z-index:54;background:var(--surface);border-top:1px solid var(--line);padding:10px max(16px,env(safe-area-inset-left,0px));justify-content:space-between;align-items:center;gap:12px}}
/* ---------- Cart / checkout ---------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:32px;align-items:start}
@media (max-width:900px){.split{grid-template-columns:1fr}}
.summary{position:sticky;top:calc(100px + env(safe-area-inset-top,0px))} @media (max-width:900px){.summary{position:static}}
.cartrow{display:grid;grid-template-columns:96px 1fr auto;gap:16px;align-items:start;padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md)}
.cartrow .art{width:96px;height:96px;aspect-ratio:1}
@media (max-width:520px){.cartrow{grid-template-columns:72px 1fr}.cartrow .art{width:72px;height:72px}.cartrow>b{grid-column:2}}
.confirm{display:flex;flex-direction:column;align-items:center;text-align:center;gap:18px;padding-bottom:60px}
.confirm-ico{width:84px;height:84px;border-radius:50%;background:var(--ok-bg);color:var(--ok);display:grid;place-items:center}.confirm-ico .ico{width:40px;height:40px;stroke-width:2.4}
.orderrow{display:flex;gap:16px;align-items:center;padding:14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);color:var(--ink);text-decoration:none!important}
.orderrow:hover{border-color:var(--brand-text);box-shadow:var(--shadow-1)}
.orderrow .art{flex:none;border-radius:14px}
/* ---------- Auth ---------- */
.auth{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,72px);align-items:center;padding-block:clamp(28px,5vw,64px)}
.auth-art{position:relative;border-radius:var(--arch);overflow:hidden;aspect-ratio:4/5;max-height:620px;box-shadow:var(--shadow-2)}.auth-art svg{width:100%;height:100%;display:block}
.auth-quote{position:absolute;inset-inline:0;bottom:0;padding:70px 28px 28px;background:linear-gradient(transparent,rgba(58,19,36,.88));color:#fff;font-family:var(--font-display);font-size:1.4rem;line-height:1.25}.auth-quote span{font-family:var(--font-body);font-size:.85rem;opacity:.8}
.auth-form{max-width:480px}
@media (max-width:860px){.auth{grid-template-columns:1fr}.auth-art{display:none}}
.plist{margin:0;padding-inline-start:20px;display:flex;flex-direction:column;gap:10px;color:var(--ink-2)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px}.faq summary::after{content:"+";font-weight:800;color:var(--brand-text)}.faq[open] summary::after{content:"−"}
.sell-art,.about-art{border-radius:var(--arch);overflow:hidden;max-width:380px;aspect-ratio:3/4;justify-self:center;box-shadow:0 18px 50px rgba(0,0,0,.3);width:100%}.sell-art .ha,.about-art svg{position:static!important;width:100%!important;height:100%!important;transform:none!important;border-radius:0!important}.sell-art .ha svg,.about-art svg{width:100%;height:100%}
/* ---------- Messages ---------- */
.chat{display:grid;grid-template-columns:340px 1fr;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);overflow:hidden;min-height:540px}
.threads{border-inline-end:1px solid var(--line);display:flex;flex-direction:column}
.thread{display:flex;gap:12px;align-items:center;padding:14px 16px;border:0;border-bottom:1px solid var(--line);background:none;width:100%;text-align:start}.thread:hover,.thread.on{background:var(--surface-2)}
.convo{display:flex;flex-direction:column;min-width:0}
.msgs{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:12px;max-height:440px}
.msg{max-width:78%;align-self:flex-start;background:var(--surface-3);padding:10px 14px;border-radius:16px 16px 16px 4px}.msg span{display:block;font-size:.72rem;color:var(--muted);margin-top:4px}
.msg.me{align-self:flex-end;background:var(--brand);color:var(--on-brand);border-radius:16px 16px 4px 16px}.msg.me span{color:rgba(255,255,255,.75)}
.msgform{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line);align-items:center}
@media (max-width:760px){.chat{grid-template-columns:1fr}.threads{border:0}.convo{display:none}main.showchat .threads{display:none}main.showchat .convo{display:flex}}
.notif{display:flex;gap:14px;align-items:center;width:100%;text-align:start;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md)}.notif.un{background:var(--surface-2);border-color:var(--line-2)}.notif:hover{border-color:var(--brand-text)}
.udot{width:10px;height:10px;border-radius:50%;background:var(--brand-text);flex:none}
.starbtn{border:0;background:none;color:var(--line-2);padding:2px}.starbtn .ico{width:34px;height:34px}.starbtn[aria-pressed=true]{color:var(--saffron)}
.task{display:flex;gap:12px;align-items:center;padding:12px;border-radius:12px;color:var(--ink);text-decoration:none!important;background:var(--surface-2)}.task:hover{background:var(--surface-3)}
.cta-band{background:linear-gradient(160deg,var(--hero-bg),var(--hero-bg-2))!important;color:var(--on-hero)}
.cta-band h2{color:var(--on-hero)}.cta-band p{color:var(--on-hero-2)}