/* ============================================================
   Michal Ava, Intuitive Abstract Painter · Design system
   Palette: violet and white (approved by the artist, 30/07/2026)
   Type: Fraunces (display, soft contemporary serif) + Inter (body)
   Motion: studio 21st system, ease-luxe everywhere
   ============================================================ */

@font-face {
  font-family: 'Fraunces';
  src: url('../fonts/fraunces-var.woff2') format('woff2');
  font-weight: 300 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Fraunces';
  src: url('../fonts/fraunces-italic-var.woff2') format('woff2');
  font-weight: 300 700; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('../fonts/inter-var.woff2') format('woff2');
  font-weight: 400 600; font-style: normal; font-display: swap;
}

:root {
  --bg: #FCFBFE;
  --bg2: #F5F1FB;
  --card: #FFFFFF;
  --border: #E5DEF2;
  --border-soft: #EFEAF8;
  --text: #241F2A;
  --text-l: #3E3844;
  --mark: #591CAD;
  --accent: #6B21B8;
  --accent-deep: #4C1288;
  --teal: #1F6E62;
  --ink: #241F2A;
  --display: 'Fraunces', Georgia, serif;
  --body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-luxe: cubic-bezier(0.16, 1, 0.3, 1);
  --g: clamp(1.25rem, 4vw, 3.5rem);
  --hero-justify: flex-start;
  --hero-text-align: left;
  --title-transform: none;
  --grid-min: 240px;
  --section-gap: clamp(5rem, 11vw, 9.5rem);
  --nav-transform: uppercase;
  --maxw: 1280px;
  --radius: 12px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  background: var(--bg); color: var(--text);
  font-family: var(--body); font-weight: 400;
  font-size: 1rem; line-height: 1.72;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img { max-width: 100%; display: block; pointer-events: none; user-select: none; -webkit-user-drag: none; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; }
::selection { background: rgba(107,33,184,.20); color: var(--ink); }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 3px; }

h1, h2, h3, h4 { font-family: var(--display); font-weight: 480; line-height: 1.1; letter-spacing: -0.01em; }

.wrap { max-width: var(--maxw); margin-inline: auto; padding-inline: var(--g); }
.section { padding-block: var(--section-gap); }
.section-h {
  font-family: var(--body); font-size: .72rem; font-weight: 600;
  letter-spacing: .3em; text-transform: uppercase; color: var(--accent);
  margin-bottom: 1.1rem;
}
.section-title {
  font-size: clamp(2.1rem, 4.8vw, 3.6rem);
  text-transform: var(--title-transform); letter-spacing: -0.015em;
  color: var(--ink); margin-bottom: 1.4rem;
}
.section-title em { font-style: italic; font-weight: 420; color: var(--accent); }
.hero-title em { font-style: italic; font-weight: 420; color: #F6D3E5; }
.section-sub { color: var(--text-l); max-width: 58ch; }
.center { text-align: center; }
.center .section-sub { margin-inline: auto; }

/* ---------- Motion system (21st) ---------- */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s var(--ease-luxe), transform .7s var(--ease-luxe); }
.reveal.is-visible { opacity: 1; transform: none; }
.reveal-scale { opacity: 0; transform: translateY(20px) scale(0.96); transition: opacity .8s var(--ease-luxe), transform .8s var(--ease-luxe); }
.reveal-scale.is-visible { opacity: 1; transform: none; }
.section-title .w {
  display: inline-block; opacity: 0; filter: blur(4px); transform: translateY(10px);
  transition: opacity .45s ease-out, filter .45s ease-out, transform .45s ease-out;
  transition-delay: calc(var(--wi, 0) * 90ms);
}
.is-visible .section-title .w, .is-visible.section-title .w { opacity: 1; filter: none; transform: none; }

/* ---------- Nav ---------- */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.2rem var(--g);
  transition: background .45s var(--ease-luxe), box-shadow .45s var(--ease-luxe), padding .45s var(--ease-luxe);
}
.nav.scrolled {
  background: rgba(251,248,243,.88);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  box-shadow: 0 1px 0 var(--border-soft);
  padding-block: .8rem;
}
.nav-logo { font-family: var(--display); font-size: 1.3rem; font-weight: 500; letter-spacing: .02em; color: var(--mark); display: flex; align-items: center; gap: .6rem; }
.nav-logo svg { width: 26px; height: 26px; color: var(--accent); }
/* Monogramma AVA dell'artista: due A che condividono la V centrale, come lo scriveva da bambina */
.nav-logo svg.mark { width: 40px; height: 26px; color: var(--mark); }
.footer-brand .mark { width: 46px; height: 30px; color: var(--mark); display: block; margin-bottom: .5rem; }
.nav-links { display: flex; align-items: center; gap: 2.2rem; list-style: none; }
.nav-links a {
  font-size: .76rem; font-weight: 600; letter-spacing: .18em;
  text-transform: var(--nav-transform); color: var(--text-l);
  position: relative; padding-block: .3rem; transition: color .35s var(--ease-luxe);
}
.nav-links a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1.5px;
  background: var(--accent); transform: scaleX(0); transform-origin: left;
  transition: transform .45s var(--ease-luxe);
}
.nav-links a:hover, .nav-links a.active { color: var(--ink); }
.nav-links a:hover::after, .nav-links a.active::after { transform: scaleX(1); }

/* Over the hero the nav sits on a dark image: force light text until scrolled */
body.hero-active .nav:not(.scrolled) .nav-logo { color: #FDFBF7; text-shadow: 0 1px 14px rgba(20,10,25,.5); }
body.hero-active .nav:not(.scrolled) .nav-logo svg { color: #FDFBF7; }
body.hero-active .nav:not(.scrolled) .nav-links a { color: rgba(253,251,247,.85); text-shadow: 0 1px 10px rgba(20,10,25,.5); }
body.hero-active .nav:not(.scrolled) .nav-links a:hover { color: #FDFBF7; }
body.hero-active .nav:not(.scrolled) .nav-hamburger { color: #FDFBF7; }
body.hero-active .nav:not(.scrolled) .lang-toggle { border-color: rgba(253,251,247,.45); }
body.hero-active .nav:not(.scrolled) .lang-toggle button { color: rgba(253,251,247,.85); }
body.hero-active .nav:not(.scrolled) .lang-toggle button.active { background: #FDFBF7; color: var(--ink); }
body.hero-active .nav.scrolled .nav-logo { color: var(--mark) !important; text-shadow: none !important; }
body.hero-active .nav.scrolled .nav-logo svg { color: var(--mark) !important; }
body.hero-active .nav.scrolled .nav-links a { color: var(--text-l) !important; text-shadow: none !important; }
body.hero-active .nav.scrolled .nav-links a:hover, body.hero-active .nav.scrolled .nav-links a.active { color: var(--ink) !important; }
body.hero-active .nav.scrolled .nav-hamburger { color: var(--ink) !important; }

.lang-toggle {
  display: flex; gap: .15rem; border: 1px solid var(--border); border-radius: 999px; padding: .18rem;
  transition: border-color .35s var(--ease-luxe);
}
.lang-toggle button {
  background: none; border: 0; color: var(--text-l); font-size: .68rem; font-weight: 600;
  letter-spacing: .12em; padding: .28rem .7rem; border-radius: 999px; cursor: pointer;
  transition: background .3s var(--ease-luxe), color .3s var(--ease-luxe);
}
.lang-toggle button.active { background: var(--accent); color: #FDFBF7; }
.nav-hamburger {
  display: none; background: none; border: 0; color: var(--ink); cursor: pointer;
  width: 44px; height: 44px; align-items: center; justify-content: center;
}
body.menu-open .nav-hamburger { opacity: 0; pointer-events: none; visibility: hidden; }

.nav-mobile {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  width: 100vw; height: 100vh; height: 100dvh;
  background: var(--bg); z-index: 10001;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2rem;
  opacity: 0; visibility: hidden; transition: opacity .45s var(--ease-luxe), visibility .45s;
}
.nav-mobile.open { opacity: 1; visibility: visible; }
.nav-mobile a {
  font-family: var(--display); font-size: 2.1rem; font-weight: 480; letter-spacing: 0;
  color: var(--ink) !important; opacity: 0; transform: translateY(18px);
  transition: opacity .5s var(--ease-luxe), transform .5s var(--ease-luxe);
}
.nav-mobile.open a { opacity: 1; transform: none; }
.nav-mobile .lang-toggle { margin-top: 1rem; }
.nav-close {
  position: absolute; top: 1.2rem; right: var(--g);
  width: 48px; height: 48px; font-size: 1.8rem; line-height: 1;
  background: none; border: none; color: var(--ink); z-index: 10002;
  -webkit-tap-highlight-color: rgba(0,0,0,.08); touch-action: manipulation; cursor: pointer;
}
.nav-close:hover { color: var(--accent); }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: 100vh; min-height: 100svh; display: flex; align-items: center; justify-content: var(--hero-justify); overflow: hidden; background: var(--ink); }
.hero-bg { position: absolute; inset: 0; }
.hero-bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 38%; transform: scale(1.06); }
.hero.loaded .hero-bg img { animation: kenburns 16s var(--ease-luxe) forwards; }
@keyframes kenburns { from { transform: scale(1.12); } to { transform: scale(1.0); } }
.hero-veil { position: absolute; inset: 0; background:
  linear-gradient(to right, rgba(30,16,32,.62) 0%, rgba(30,16,32,.28) 46%, rgba(30,16,32,.08) 100%),
  linear-gradient(to bottom, rgba(30,16,32,.35) 0%, rgba(30,16,32,0) 32%, rgba(30,16,32,.14) 72%, rgba(30,16,32,.66) 100%); }
.hero-vignette { position: absolute; inset: 0; background: radial-gradient(ellipse at 30% 55%, transparent 42%, rgba(18,9,20,.42) 100%); }
.hero-inner { position: relative; z-index: 2; text-align: var(--hero-text-align); padding-inline: var(--g); max-width: 980px; }
.hero-kicker {
  font-size: .74rem; font-weight: 600; letter-spacing: .34em; text-transform: uppercase;
  color: #F5CFE2; margin-bottom: 1.6rem;
  opacity: 0; animation: fadeIn 1s var(--ease-luxe) .25s forwards;
}
.hero-title {
  font-family: var(--display); font-size: clamp(3.1rem, 9.5vw, 7rem); font-weight: 460;
  letter-spacing: -0.02em; color: #FDFBF7; line-height: 1.02;
}
.hero-title .line { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.hero-title .line > span { display: inline-block; will-change: transform; }
.hero-sub {
  color: rgba(253,251,247,.86); font-size: clamp(1rem, 1.6vw, 1.2rem); margin-top: 1.6rem; max-width: 46ch;
  opacity: 0; animation: fadeIn 1s var(--ease-luxe) .9s forwards;
}
.hero-ctas { display: flex; gap: 1rem; justify-content: var(--hero-justify); flex-wrap: wrap; margin-top: 2.6rem;
  opacity: 0; animation: fadeIn 1s var(--ease-luxe) 1.15s forwards; }
@keyframes fadeIn { to { opacity: 1; } }
.hero-scroll {
  position: absolute; bottom: 2rem; left: 0; right: 0; margin-inline: auto; width: fit-content;
  z-index: 2; display: flex; flex-direction: column; align-items: center; gap: .5rem;
  color: rgba(253,251,247,.75); font-size: .68rem; letter-spacing: .3em; text-transform: uppercase;
  opacity: 0; animation: fadeIn 1.2s var(--ease-luxe) 1.6s forwards;
}
.hero-scroll svg { animation: scrollNudge 2.4s var(--ease-luxe) infinite; }
@keyframes scrollNudge { 0%,100% { transform: translateY(0); } 50% { transform: translateY(7px); } }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  font-size: .76rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  padding: .95rem 2.1rem; border-radius: 999px; cursor: pointer; border: 1px solid transparent;
  transition: transform .5s var(--ease-luxe), box-shadow .5s var(--ease-luxe), background .35s, color .35s, border-color .35s;
  position: relative; overflow: hidden;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn-primary { background: var(--accent); color: #FDFBF7; }
.btn-primary:hover { background: var(--accent-deep); box-shadow: 0 14px 30px -14px rgba(162,48,111,.6); }
.btn-ghost { background: transparent; color: var(--ink); border-color: rgba(36,31,42,.3); }
.btn-ghost:hover { border-color: var(--accent); color: var(--accent); }
.hero .btn-ghost { color: #FDFBF7; border-color: rgba(253,251,247,.5); }
.hero .btn-ghost:hover { border-color: #FDFBF7; color: #FDFBF7; background: rgba(253,251,247,.12); }
.btn svg { width: 16px; height: 16px; flex: none; }
.btn[disabled] { opacity: .55; cursor: default; transform: none !important; }

/* ---------- Marquee ---------- */
.marquee-section { border-block: 1px solid var(--border-soft); padding-block: 26px; overflow: hidden; background: var(--bg2); }
.marquee { display: flex; }
.marquee-track { display: flex; align-items: center; gap: 44px; white-space: nowrap; padding-right: 44px; animation: marquee 38s linear infinite; }
.marquee-track span { font-family: var(--display); font-style: italic; font-weight: 420; font-size: clamp(1.1rem, 2vw, 1.55rem); color: var(--text-l); letter-spacing: .01em; }
.marquee-track .dot { color: var(--accent); display: flex; }
.marquee-track .dot svg { width: 10px; height: 10px; }
.marquee:hover .marquee-track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* ---------- Works grid ---------- */
.works-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(var(--grid-min), 1fr)); gap: clamp(1.4rem, 3vw, 2.6rem); align-items: start; }
.work-card {
  background: var(--card); border: 1px solid var(--border-soft); border-radius: var(--radius); overflow: hidden;
  transition: transform .5s var(--ease-luxe), box-shadow .5s var(--ease-luxe), border-color .5s var(--ease-luxe);
  position: relative; display: block;
  box-shadow: 0 10px 30px -24px rgba(60,30,55,.35);
}
.work-card:hover { transform: translateY(-6px); box-shadow: 0 34px 60px -32px rgba(90,35,75,.35); border-color: var(--border); }
.work-card-img { overflow: hidden; position: relative; background: var(--bg2); }
.work-card-img img { width: 100%; height: auto; max-height: 460px; object-fit: cover; object-position: center; transition: transform 1.1s var(--ease-luxe); }
.work-card:hover .work-card-img img { transform: scale(1.05); }
.work-card-body { padding: 1.3rem 1.4rem 1.5rem; }
.work-card-title { font-family: var(--display); font-size: 1.4rem; font-weight: 500; color: var(--ink); letter-spacing: -.01em; }
.work-card-meta { font-size: .82rem; color: var(--text-l); margin-top: .35rem; }
.work-card-row { display: flex; align-items: center; justify-content: space-between; margin-top: .9rem; gap: .8rem; }
.work-card-price { font-family: var(--display); font-size: 1.1rem; font-weight: 520; color: var(--accent); }
.status-badge {
  display: inline-flex; align-items: center; gap: .45rem;
  font-size: .64rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  color: var(--text-l); border: 1px solid var(--border); border-radius: 999px; padding: .28rem .75rem;
  position: relative; overflow: hidden; background: var(--card);
}
.status-badge .sdot { width: 7px; height: 7px; border-radius: 50%; background: var(--teal); position: relative; }
.status-badge.available .sdot { background: #2E8B67; animation: dotPulse 2.2s ease-in-out infinite; }
.status-badge.reserved .sdot { background: #C0862B; }
.status-badge.sold .sdot { background: #A64B3C; }
.status-badge.exhibition .sdot { background: #6B21B8; }
@keyframes dotPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(46,139,103,.45); } 50% { box-shadow: 0 0 0 5px rgba(46,139,103,0); } }
.status-badge.available::after {
  content: ""; position: absolute; inset: 0; transform: translateX(-130%) skewX(-20deg);
  background: linear-gradient(90deg, transparent, rgba(162,48,111,.14), transparent);
  animation: badgeShine 4.5s ease-in-out infinite;
}
@keyframes badgeShine { 0%, 55% { transform: translateX(-130%) skewX(-20deg); } 80%, 100% { transform: translateX(130%) skewX(-20deg); } }

/* Cursor "View" pill */
.cursor-pill {
  position: fixed; z-index: 9000; pointer-events: none;
  background: var(--ink); color: #FDFBF7; font-size: .68rem; font-weight: 600;
  letter-spacing: .2em; text-transform: uppercase; padding: .55rem 1.1rem; border-radius: 999px;
  transform: translate(-50%, -50%) scale(0); transition: transform .4s var(--ease-luxe); will-change: left, top;
}
.cursor-pill.on { transform: translate(-50%, -50%) scale(1); }
@media (hover: none) { .cursor-pill { display: none; } }

/* ---------- Filters (also reused for frame selector) ---------- */
.filter-row { display: flex; gap: .6rem; flex-wrap: wrap; margin: 2.2rem 0 3rem; }
.filter-btn {
  background: none; border: 1px solid var(--border); color: var(--text-l); cursor: pointer;
  font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  padding: .6rem 1.35rem; border-radius: 999px; transition: all .35s var(--ease-luxe);
}
.filter-btn:hover { border-color: var(--accent); color: var(--ink); }
.filter-btn.active { background: var(--accent); border-color: var(--accent); color: #FDFBF7; }

/* ---------- About / process / stats ---------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem, 6vw, 6rem); align-items: center; }
.about-media { border-radius: var(--radius); overflow: hidden; border: 1px solid var(--border-soft); position: relative; box-shadow: 0 24px 60px -36px rgba(90,35,75,.4); }
.about-media img { width: 100%; }
.about-body p { color: var(--text-l); margin-bottom: 1.1rem; }
.stats-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-top: 2.6rem; border-top: 1px solid var(--border-soft); padding-top: 2rem; }
.stat-n { font-family: var(--display); font-size: clamp(2rem, 4vw, 3rem); font-weight: 460; color: var(--accent); line-height: 1; }
.stat-l { font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--text-l); margin-top: .5rem; }

.process-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.4rem, 3vw, 2.4rem); margin-top: 3rem; }
.process-card { background: var(--card); border: 1px solid var(--border-soft); border-radius: var(--radius); padding: 2.2rem 1.9rem; transition: transform .5s var(--ease-luxe), box-shadow .5s var(--ease-luxe); box-shadow: 0 10px 30px -26px rgba(60,30,55,.4); }
.process-card:hover { transform: translateY(-6px); box-shadow: 0 26px 50px -30px rgba(90,35,75,.3); }
.process-card svg { width: 34px; height: 34px; color: var(--accent); margin-bottom: 1.3rem; }
.process-card h3 { font-size: 1.3rem; font-weight: 520; color: var(--ink); margin-bottom: .7rem; }
.process-card p { font-size: .92rem; color: var(--text-l); }
.process-num { font-family: var(--display); color: var(--border); font-size: 2.2rem; float: right; line-height: 1; }

/* ---------- Journey / exhibitions ---------- */
.exh-list { border-top: 1px solid var(--border-soft); margin-top: 2.5rem; }
.exh-item { display: grid; grid-template-columns: 90px 1fr auto; gap: 1.4rem; align-items: baseline; padding: 1.35rem 0; border-bottom: 1px solid var(--border-soft); transition: background .35s var(--ease-luxe), padding-inline .35s var(--ease-luxe); }
.exh-item:hover { background: var(--bg2); padding-inline: 1rem; }
.exh-year { font-family: var(--display); color: var(--accent); font-size: 1.15rem; font-weight: 500; }
.exh-title { font-family: var(--display); color: var(--ink); font-size: 1.2rem; font-weight: 480; }
.exh-venue { color: var(--text-l); font-size: .88rem; }

/* ---------- Contact ---------- */
.contact-band { background: var(--bg2); border-block: 1px solid var(--border-soft); }
.contact-cols { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem, 6vw, 6rem); }
.contact-line { display: flex; align-items: center; gap: 1rem; padding: 1.05rem 0; border-bottom: 1px solid var(--border-soft); color: var(--text-l); }
.contact-line svg { width: 20px; height: 20px; color: var(--accent); flex: none; }
.contact-line a { color: var(--ink); transition: color .3s; }
.contact-line a:hover { color: var(--accent); }
.contact-line .cl-label { font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; display: block; }

.form-field { margin-bottom: 1.2rem; }
.form-field label { display: block; font-size: .7rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--text-l); margin-bottom: .5rem; }
.form-field input, .form-field textarea {
  width: 100%; background: var(--card); border: 1px solid var(--border); border-radius: 8px;
  color: var(--text); font-family: var(--body); font-size: .95rem; padding: .85rem 1rem;
  transition: border-color .3s var(--ease-luxe), box-shadow .3s var(--ease-luxe);
}
.form-field input:focus, .form-field textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(162,48,111,.12); }
.form-field textarea { min-height: 130px; resize: vertical; }
.form-note { font-size: .8rem; color: var(--text-l); margin-top: 1rem; }
.form-success { display: none; background: rgba(46,139,103,.1); border: 1px solid rgba(46,139,103,.4); color: #1F5E45; border-radius: 8px; padding: 1rem 1.2rem; font-size: .92rem; margin-top: 1rem; }
.hp-field { position: absolute; left: -9999px; opacity: 0; height: 0; overflow: hidden; }

/* ---------- Footer ---------- */
footer { border-top: 1px solid var(--border-soft); padding: 3.5rem var(--g) 2.5rem; background: var(--bg2); }
.footer-inner { max-width: var(--maxw); margin-inline: auto; display: flex; flex-wrap: wrap; gap: 2rem; align-items: flex-start; justify-content: space-between; }
.footer-brand { font-family: var(--display); font-weight: 500; color: var(--mark); font-size: 1.15rem; }
.footer-brand span { display: block; font-family: var(--body); font-weight: 600; font-size: .7rem; letter-spacing: .22em; text-transform: uppercase; color: var(--text-l); margin-top: .45rem; }
.footer-nav { display: flex; gap: 1.6rem; flex-wrap: wrap; }
.footer-nav a { font-size: .74rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--text-l); transition: color .3s; }
.footer-nav a:hover { color: var(--accent); }
.footer-meta { width: 100%; display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; border-top: 1px solid var(--border-soft); margin-top: 2.2rem; padding-top: 1.6rem; color: var(--text-l); font-size: .76rem; }

/* ---------- Cookie banner ---------- */
.cookie-banner {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 10005;
  background: rgba(255,255,255,.97); border-top: 1px solid var(--border);
  padding: 1.1rem var(--g); display: none; align-items: center; gap: 1.4rem; flex-wrap: wrap;
  transform: translateY(110%); transition: transform .6s var(--ease-luxe);
  box-shadow: 0 -14px 40px -30px rgba(60,30,55,.4);
}
.cookie-banner.show { display: flex; transform: translateY(0); }
.cookie-banner p { font-size: .84rem; color: var(--text-l); flex: 1 1 320px; }
.cookie-banner a { color: var(--accent); text-decoration: underline; }
.cookie-banner .btn { padding: .6rem 1.4rem; }

/* ---------- Work detail ---------- */
.work-layout { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2.5rem, 5vw, 5rem); align-items: start; }
.work-figure { border-radius: var(--radius); overflow: hidden; border: 1px solid var(--border-soft); background: var(--bg2); cursor: zoom-in; position: relative; box-shadow: 0 24px 60px -36px rgba(90,35,75,.4); }
.work-figure img { width: 100%; height: auto; }
.work-figure .zoom-hint { position: absolute; right: 1rem; bottom: 1rem; background: rgba(251,248,243,.85); border: 1px solid var(--border); border-radius: 999px; width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; color: var(--ink); }
.work-figure .zoom-hint svg { width: 18px; height: 18px; }
.work-title { font-size: clamp(2.1rem, 4vw, 3.1rem); font-weight: 480; color: var(--ink); letter-spacing: -.015em; }
.work-price { font-family: var(--display); font-size: 1.7rem; font-weight: 500; color: var(--accent); margin: 1.1rem 0 1.6rem; }
.meta-table { width: 100%; border-collapse: collapse; margin: 1.4rem 0 1.8rem; }
.meta-table td { padding: .7rem 0; border-bottom: 1px solid var(--border-soft); font-size: .9rem; }
.meta-table td:first-child { color: var(--text-l); font-size: .7rem; letter-spacing: .18em; text-transform: uppercase; width: 42%; }
.work-desc { color: var(--text-l); margin-bottom: 1.8rem; }
.badges-col { display: flex; flex-direction: column; gap: .7rem; margin: 1.8rem 0; }
.badge-line { display: flex; align-items: center; gap: .7rem; font-size: .84rem; color: var(--text-l); }
.badge-line svg { width: 18px; height: 18px; color: var(--teal); flex: none; }
.buy-row { display: flex; gap: .8rem; flex-wrap: wrap; }
.prev-next-nav { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: 2.2rem; }
.prev-next-nav .btn { flex: 0 0 auto; }

/* ---------- View in Room ---------- */
.room-section { margin-top: var(--section-gap); padding-top: 3rem; border-top: 1px solid var(--border-soft); }
/* 8/5 = the native aspect ratio of the room photos (1200x750): with cover the
   photo is shown whole, uncropped, so the wall_center_* percentages land on the
   exact spot of the wall they were measured on. */
.room-scene { position: relative; width: 100%; background: #000; overflow: hidden; aspect-ratio: 8/5; margin-bottom: 1.2rem; border-radius: var(--radius); }
.room-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; pointer-events: none; }
.room-art-wrap {
  position: absolute;
  box-shadow: 0 14px 38px rgba(0,0,0,.42), 0 4px 12px rgba(0,0,0,.28);
  transition: left .5s var(--ease-luxe), top .5s var(--ease-luxe), width .5s var(--ease-luxe), padding .35s ease, background .35s ease;
}
.room-art-wrap img { width: 100%; height: 100%; display: block; object-fit: fill; }
.room-art-wrap.frame-dark, .room-art-wrap.frame-wood, .room-art-wrap.frame-gold, .room-art-wrap.frame-white {
  box-shadow: 0 14px 38px rgba(0,0,0,.42), 0 4px 12px rgba(0,0,0,.28),
    inset 0 0 0 .5px rgba(0,0,0,.35);
}
.room-art-wrap.frame-dark  { padding: .7%;  background: linear-gradient(135deg, #3a2f26, #1a120c 60%, #0d0805); }
.room-art-wrap.frame-wood  { padding: .85%; background: linear-gradient(135deg, #8a6038, #4a3018 60%, #2a1a0c); }
.room-art-wrap.frame-gold  { padding: .85%; background: linear-gradient(135deg, #f0d27a, #c2962f 50%, #8a6312); }
.room-art-wrap.frame-white { padding: .7%;  background: linear-gradient(135deg, #ffffff, #ece6db); }
.room-art-wrap.frame-none { padding: 0; background: transparent; }
.room-thumbs { display: flex; gap: .7rem; flex-wrap: wrap; }
.room-thumb {
  width: 84px; height: 56px; border-radius: 6px; background-size: cover; background-position: center;
  border: 2px solid transparent; opacity: .6; transition: all .35s var(--ease-luxe);
  pointer-events: auto; cursor: pointer;
}
.room-thumb:hover { opacity: 1; }
.room-thumb.active { border-color: var(--accent); opacity: 1; }
.ar-row { display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; margin-top: 1.6rem; }
.ar-hint { font-size: .8rem; color: var(--text-l); max-width: 40ch; }

/* QR modal */
.qr-modal { position: fixed; inset: 0; z-index: 10010; background: rgba(24,14,26,.8); display: none; align-items: center; justify-content: center; padding: 1.5rem; }
.qr-modal.open { display: flex; }
.qr-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 2.2rem; max-width: 380px; text-align: center; }
.qr-card h3 { color: var(--ink); font-size: 1.4rem; margin-bottom: .6rem; }
.qr-card p { color: var(--text-l); font-size: .88rem; margin-bottom: 1.4rem; }
.qr-card img, .qr-card canvas { margin: 0 auto 1.4rem; background: #fff; padding: 10px; border-radius: 6px; width: 200px; height: 200px; }

/* Lightbox */
.lightbox { position: fixed; inset: 0; z-index: 10008; background: rgba(24,14,26,.94); display: none; align-items: center; justify-content: center; cursor: zoom-out; }
.lightbox.open { display: flex; }
.lightbox img { max-width: 92vw; max-height: 92vh; width: auto; height: auto; pointer-events: none; transition: transform .3s var(--ease-luxe); }
.lightbox-close { position: absolute; top: 1.2rem; right: 1.5rem; background: none; border: none; color: #FDFBF7; font-size: 2rem; cursor: pointer; z-index: 2; }

/* ---------- Shop (original works) ---------- */
.print-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: clamp(1.4rem, 3vw, 2.4rem); align-items: start; }
.print-card { background: var(--card); border: 1px solid var(--border-soft); border-radius: var(--radius); overflow: hidden; transition: transform .5s var(--ease-luxe), box-shadow .5s var(--ease-luxe); box-shadow: 0 10px 30px -24px rgba(60,30,55,.35); }
.print-card:hover { transform: translateY(-6px); box-shadow: 0 26px 50px -30px rgba(90,35,75,.35); }
.print-card-img { background: var(--bg2); overflow: hidden; }
.print-card-img img { width: 100%; height: auto; max-height: 420px; object-fit: cover; transition: transform 1.1s var(--ease-luxe); }
.print-card:hover .print-card-img img { transform: scale(1.05); }
.print-card-body { padding: 1.3rem 1.4rem 1.5rem; }
.print-card-body h3 { font-size: 1.25rem; font-weight: 520; color: var(--ink); }
.print-card-body .pc-meta { font-size: .82rem; color: var(--text-l); margin-top: .3rem; }
.print-price { font-family: var(--display); color: var(--accent); font-size: 1.35rem; font-weight: 520; margin: 1rem 0; }
.pc-actions { display: flex; gap: .6rem; flex-wrap: wrap; }
.pc-actions .btn { flex: 1 1 auto; padding-inline: 1.2rem; }

/* Bilingual static blocks */
.lang-en, .lang-fr, .lang-es { display: none; }
html[lang="en"] .lang-en, html[lang="fr"] .lang-fr, html[lang="es"] .lang-es { display: block; }

/* ---------- Legal / 404 ---------- */
.legal-body { max-width: 760px; }
.legal-body h2 { color: var(--ink); font-size: 1.5rem; margin: 2.4rem 0 .8rem; }
.legal-body p, .legal-body li { color: var(--text-l); font-size: .95rem; margin-bottom: .8rem; }
.legal-body ul { padding-left: 1.2rem; }
.page-head { padding-top: clamp(8rem, 16vh, 11rem); }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .nav-links { display: none; }
  .nav-hamburger { display: flex; }
  .split, .contact-cols, .work-layout { grid-template-columns: 1fr; }
  .process-grid { grid-template-columns: 1fr; }
  .exh-item { grid-template-columns: 64px 1fr; }
  .exh-venue { grid-column: 2; }
}
@media (max-width: 768px) {
  .prev-next-nav { gap: .6rem; margin-top: 1.25rem; }
  .prev-next-nav .btn { flex: 1 1 0; min-width: 0; padding: .85rem .5rem; font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .stats-row { grid-template-columns: repeat(3, 1fr); gap: .8rem; }
}

/* ---------- Reduced motion (mandatory guard) ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal, .reveal-scale, .section-title .w, .hero-kicker, .hero-sub, .hero-ctas, .hero-scroll {
    opacity: 1 !important; transform: none !important; filter: none !important; transition: none !important; animation: none !important;
  }
  .hero-title .line > span { transform: none !important; }
  .marquee-track { animation: none !important; }
}