:root{
  --ink:#0d0d0f;
  --ink-soft:#17171a;
  --paper:#f3efe7;
  --paper-dim:#c9c3b6;
  --gold:#d9b26a;
  --coral:#ff5a4e;
  --sage:#8fae8b;
  --line:rgba(243,239,231,.14);
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--ink);color:var(--paper);font-family:'Manrope',sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased;}
h1,h2,h3,.display{font-family:'Cormorant Garamond',serif;font-weight:500;letter-spacing:.01em;margin:0;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;background:none;border:none;color:inherit;}
img{max-width:100%;display:block;}
::selection{background:var(--coral);color:#fff;}

/* ================= ANIMATED BACKGROUND ================= */
.bg-layer{position:fixed;inset:0;z-index:-3;overflow:hidden;background:
  radial-gradient(1000px 700px at 12% -8%, #201a14 0%, transparent 60%),
  radial-gradient(900px 800px at 105% 15%, #1a1620 0%, transparent 55%),
  linear-gradient(180deg,var(--ink) 0%, var(--ink-soft) 100%);}
.blob{position:absolute;border-radius:44% 56% 62% 38%/48% 44% 56% 52%;filter:blur(4px);opacity:.35;mix-blend-mode:screen;animation:morph 18s var(--ease) infinite, drift 30s ease-in-out infinite;}
.blob.b1{width:42vw;height:42vw;top:-12vw;left:-10vw;background:radial-gradient(circle at 30% 30%, var(--coral), transparent 70%);}
.blob.b2{width:36vw;height:36vw;bottom:-14vw;right:-8vw;background:radial-gradient(circle at 60% 40%, var(--gold), transparent 72%);animation-duration:24s,34s;animation-delay:-6s,-10s;}
.blob.b3{width:24vw;height:24vw;top:40%;left:55%;background:radial-gradient(circle at 40% 40%, var(--sage), transparent 72%);opacity:.25;animation-duration:16s,22s;}
@keyframes morph{0%,100%{border-radius:44% 56% 62% 38%/48% 44% 56% 52%;}33%{border-radius:62% 38% 45% 55%/40% 62% 38% 60%;}66%{border-radius:38% 62% 55% 45%/58% 40% 60% 42%;}}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(2.5vw,-2vw) scale(1.08);}}
.grain{position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.06;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
.motes{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;}
.mote{position:absolute;bottom:-8vh;border-radius:50%;background:radial-gradient(circle, rgba(217,178,106,.9), transparent 70%);animation:rise linear infinite;}
@keyframes rise{0%{transform:translateY(0) translateX(0);opacity:0;}10%{opacity:.8;}90%{opacity:.4;}100%{transform:translateY(-112vh) translateX(var(--drift,16px));opacity:0;}}
.brush{position:fixed;z-index:-1;pointer-events:none;opacity:.12;stroke:var(--paper);stroke-width:1.4;fill:none;}

/* ================= HEADER ================= */
header{position:sticky;top:0;z-index:60;backdrop-filter:blur(14px) saturate(1.3);background:rgba(13,13,15,.72);border-bottom:1px solid var(--line);}
.nav-wrap{max-width:1320px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:18px 30px;gap:20px;}
.logo{display:flex;align-items:center;gap:12px;cursor:pointer;}
.logo .mark{width:34px;height:34px;border-radius:50%;border:1.4px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:17px;color:var(--gold);}
.logo b{font-family:'Cormorant Garamond',serif;font-size:22px;letter-spacing:.03em;}
.logo small{display:block;font-size:9px;letter-spacing:.32em;color:var(--paper-dim);text-transform:uppercase;margin-top:1px;}
nav.links{display:flex;gap:34px;align-items:center;}
nav.links a{position:relative;font-size:12.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--paper-dim);padding:6px 0;cursor:pointer;}
nav.links a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--gold);transition:width .35s var(--ease);}
nav.links a:hover{color:var(--paper);}
nav.links a:hover::after{width:100%;}
.nav-icons{display:flex;align-items:center;gap:14px;}
.icon-btn{position:relative;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;transition:transform .25s var(--ease),background .25s,border-color .25s;}
.icon-btn:hover{transform:translateY(-2px) scale(1.05);border-color:var(--gold);}
.icon-btn svg{width:16px;height:16px;stroke:var(--paper);}
.count{position:absolute;top:-5px;right:-5px;background:var(--coral);color:#fff;font-size:10px;font-weight:800;min-width:17px;height:17px;border-radius:50%;display:flex;align-items:center;justify-content:center;transform:scale(0);transition:transform .3s var(--ease);}
.count.show{transform:scale(1);}

/* ================= ROUTES ================= */
main{position:relative;min-height:70vh;}

/* ================= HERO ================= */
.hero{max-width:1320px;margin:0 auto;padding:100px 30px 20px;text-align:center;position:relative;}
.hero .eyebrow{color:var(--gold);font-weight:700;letter-spacing:.28em;text-transform:uppercase;font-size:11px;}
.hero h1{font-size:clamp(38px,6.4vw,78px);line-height:1.02;margin-top:18px;font-style:italic;}
.hero h1 span{font-style:normal;color:var(--gold);}
.hero p{color:var(--paper-dim);max-width:560px;margin:20px auto 0;font-size:15.5px;line-height:1.75;}
.hero-cta{display:flex;gap:16px;justify-content:center;margin-top:34px;flex-wrap:wrap;}
.marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:60px;padding:16px 0;}
.marquee-track{display:flex;gap:50px;white-space:nowrap;width:max-content;animation:scroll-x 26s linear infinite;}
.marquee-track span{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:18px;color:var(--paper-dim);}
.marquee-track span b{color:var(--gold);font-style:normal;}
@keyframes scroll-x{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ================= BUTTONS ================= */
.btn{border-radius:2px;padding:15px 30px;font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;display:inline-flex;align-items:center;gap:10px;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s,color .25s;border:1.4px solid var(--paper);}
.btn-primary{background:var(--paper);color:var(--ink);}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 16px 30px -14px rgba(217,178,106,.5);background:var(--gold);border-color:var(--gold);}
.btn-primary.added{background:var(--sage);border-color:var(--sage);color:#0d1b10;}
.btn-outline{background:transparent;color:var(--paper);}
.btn-outline:hover{background:var(--paper);color:var(--ink);transform:translateY(-3px);}
.btn svg{width:15px;height:15px;}

/* ================= SECTION HEADS ================= */
.section-head{max-width:1320px;margin:0 auto;padding:80px 30px 26px;text-align:center;}
.section-head .eyebrow{color:var(--gold);font-weight:700;letter-spacing:.24em;text-transform:uppercase;font-size:11px;}
.section-head h2{font-size:clamp(30px,4.6vw,48px);margin-top:12px;font-style:italic;}
.section-head p{color:var(--paper-dim);max-width:560px;margin:14px auto 0;font-size:14.5px;line-height:1.7;}

/* ================= ARTWORK GRID ================= */
.grid{max-width:1320px;margin:0 auto;padding:20px 30px 100px;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:28px;}
.piece{position:relative;cursor:pointer;border:1px solid var(--line);background:var(--ink-soft);transition:transform .4s var(--ease),border-color .4s;}
.piece:hover{transform:translateY(-8px);border-color:var(--gold);}
.piece .frame{position:relative;aspect-ratio:4/5;overflow:hidden;}
.piece .frame img{width:100%;height:100%;object-fit:contain;transition:transform .7s var(--ease),filter .5s;filter:saturate(.94);}
.piece:hover .frame img{transform:scale(1.07);filter:saturate(1.08);}
.piece .frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(13,13,15,.85) 100%);opacity:0;transition:opacity .4s;}
.piece:hover .frame::after{opacity:1;}
.tag{position:absolute;top:14px;right:14px;background:rgba(13,13,15,.75);backdrop-filter:blur(6px);border:1px solid var(--line);color:var(--gold);font-family:'Cormorant Garamond',serif;font-size:15px;padding:6px 12px;letter-spacing:.02em;}
.avail{position:absolute;top:14px;left:14px;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;padding:5px 10px;border-radius:100px;background:rgba(143,174,139,.18);color:var(--sage);border:1px solid rgba(143,174,139,.4);}
.avail.sold{background:rgba(255,90,78,.16);color:var(--coral);border-color:rgba(255,90,78,.4);}
.piece .meta{padding:18px 18px 20px;}
.piece .meta b{display:block;font-family:'Cormorant Garamond',serif;font-size:20px;font-style:italic;margin-bottom:4px;}
.piece .meta span{font-size:12px;color:var(--paper-dim);letter-spacing:.02em;}

/* ================= ARTWORK DETAIL ================= */
.crumb{max-width:1320px;margin:22px auto 0;padding:0 30px;font-size:11.5px;color:var(--paper-dim);display:flex;gap:8px;flex-wrap:wrap;letter-spacing:.04em;text-transform:uppercase;}
.crumb a{cursor:pointer;}
.crumb a:hover{color:var(--gold);}
.detail{max-width:1320px;margin:0 auto;padding:30px 30px 100px;display:grid;grid-template-columns:1.15fr .85fr;gap:70px;}
@media(max-width:920px){.detail{grid-template-columns:1fr;gap:36px;padding:20px 18px 60px;}}
.stage{position:relative;border:1px solid var(--line);background:var(--ink-soft);aspect-ratio:4/5;overflow:hidden;}
.stage img{width:100%;height:100%;object-fit:contain;transition:transform .8s var(--ease);}
.stage:hover img{transform:scale(1.045);}
.shine{position:absolute;inset:0;background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.18) 50%,transparent 58%);transform:translateX(-120%);pointer-events:none;}
.stage:hover .shine{animation:sweep 1.2s var(--ease);}
@keyframes sweep{to{transform:translateX(120%);}}
.info .eyebrow{font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;display:block;}
.info h1{font-size:clamp(30px,4.4vw,46px);font-style:italic;line-height:1.08;margin-bottom:8px;}
.info .artist{font-size:15px;color:var(--paper-dim);margin-bottom:22px;}
.info .artist b{color:var(--paper);font-weight:600;}
.spec-row{display:flex;flex-wrap:wrap;gap:22px;margin-bottom:24px;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.spec{font-size:12px;}
.spec label{display:block;color:var(--paper-dim);text-transform:uppercase;letter-spacing:.12em;font-size:10px;margin-bottom:5px;}
.price{font-family:'Cormorant Garamond',serif;font-size:30px;color:var(--gold);margin-bottom:20px;}
.desc{font-size:15px;line-height:1.85;color:var(--paper-dim);margin-bottom:30px;}
.desc strong{color:var(--paper);font-weight:600;}
.cta-row{display:flex;gap:14px;margin-bottom:30px;flex-wrap:wrap;}
.cta-row .btn{flex:1;justify-content:center;}
.trust{display:flex;gap:20px;flex-wrap:wrap;font-size:11.5px;color:var(--paper-dim);}
.trust span{display:flex;align-items:center;gap:6px;}
.trust svg{width:14px;height:14px;stroke:var(--gold);}

/* ================= PANEL PAGES ================= */
.panel{max-width:720px;margin:0 auto;padding:90px 30px 120px;text-align:center;}
.panel .icon-lg{width:60px;height:60px;margin:0 auto 24px;border-radius:50%;border:1.4px solid var(--gold);display:flex;align-items:center;justify-content:center;}
.panel .icon-lg svg{width:24px;height:24px;stroke:var(--gold);}
.panel h2{font-size:clamp(28px,4.4vw,40px);font-style:italic;margin-bottom:14px;}
.panel p{color:var(--paper-dim);font-size:14.5px;line-height:1.8;max-width:480px;margin:0 auto 28px;}
.form{max-width:480px;margin:0 auto;text-align:left;display:flex;flex-direction:column;gap:14px;}
.form input,.form textarea{width:100%;background:var(--ink-soft);border:1px solid var(--line);color:var(--paper);padding:14px 16px;font-family:inherit;font-size:14px;border-radius:2px;}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--gold);}
.form textarea{min-height:110px;resize:vertical;}
.form label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--paper-dim);}

.saved-line{display:flex;gap:16px;align-items:center;text-align:left;background:var(--ink-soft);border:1px solid var(--line);padding:14px;margin-bottom:14px;}
.saved-line img{width:64px;height:80px;object-fit:contain;background:var(--ink);}

/* ================= IMAGE UPLOAD ================= */
.upload-btn{position:absolute;bottom:14px;right:14px;width:38px;height:38px;border-radius:50%;background:rgba(13,13,15,.8);backdrop-filter:blur(6px);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;transition:transform .25s var(--ease),border-color .25s,background .25s;z-index:5;}
.upload-btn:hover{border-color:var(--gold);background:rgba(13,13,15,.95);transform:scale(1.08);}
.upload-btn svg{width:17px;height:17px;stroke:var(--gold);}
.stage .upload-btn{bottom:18px;right:18px;width:44px;height:44px;}
.stage .upload-btn svg{width:19px;height:19px;}
.saved-line .meta b{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:16px;display:block;}
.saved-line .meta span{font-size:12px;color:var(--paper-dim);}

/* ================= ARTISTS / EXHIBITIONS ================= */
.artist-card{background:var(--ink-soft);border:1px solid var(--line);padding:26px 22px;text-align:center;transition:transform .3s var(--ease),border-color .3s;cursor:pointer;}
.artist-card:hover{transform:translateY(-6px);border-color:var(--gold);}
.artist-card .avatar{width:64px;height:64px;border-radius:50%;margin:0 auto 16px;background:conic-gradient(from 0deg,var(--coral),var(--gold),var(--sage),var(--coral));}
.artist-card b{display:block;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:19px;margin-bottom:6px;}
.artist-card span{font-size:12px;color:var(--paper-dim);}

/* ================= FOOTER ================= */
footer{border-top:1px solid var(--line);padding:60px 30px 30px;background:var(--ink-soft);}
.footer-wrap{max-width:1320px;margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:40px;}
.footer-wrap p{max-width:280px;font-size:13px;color:var(--paper-dim);line-height:1.75;margin-top:14px;}
footer .cols{display:flex;gap:60px;flex-wrap:wrap;}
footer .col h4{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:16px;}
footer .col a{display:block;font-size:13.5px;color:var(--paper-dim);margin-bottom:10px;cursor:pointer;}
footer .col a:hover{color:var(--paper);}
.footer-bottom{max-width:1320px;margin:40px auto 0;padding-top:22px;border-top:1px solid var(--line);font-size:11.5px;color:var(--paper-dim);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;letter-spacing:.03em;}

/* ================= TOAST ================= */
.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,150%);background:var(--paper);color:var(--ink);padding:14px 26px;border-radius:2px;font-size:12.5px;font-weight:700;letter-spacing:.04em;z-index:200;display:flex;align-items:center;gap:10px;transition:transform .5s var(--ease);box-shadow:0 24px 50px -20px rgba(0,0,0,.6);}
.toast.show{transform:translate(-50%,0);}
.toast svg{width:15px;height:15px;stroke:var(--coral);}

@media(max-width:760px){nav.links{display:none;}.footer-wrap{flex-direction:column;}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}}

/* ================= MULTI-PAGE ADJUSTMENTS ================= */
/* .piece and .artist-card are real <a> links now (not JS-routed divs) */
.piece{display:block;}
.artist-card{display:block;}
.saved-line a{display:flex;gap:16px;align-items:center;flex:1;color:inherit;text-decoration:none;}