/* ArtSoulCafe – Anca Schmittner. Mobile first.
   Colours come from the admin panel (inline :root variables in index.php); these are the defaults. */
:root{
  --bg:#0F2E33; --bg2:#0A1F23; --surface:#1B383D; --accent:#D1A54A; --accent-soft:#DEBE7D; --accent-ink:#D1A54A; --accent2:#3E9C96;
  --text:#F2ECDF; --muted:#A7ADA6; --on-accent:#0B2024; --shadow:rgba(0,0,0,.6); --sold:#B4457A;
  --line:color-mix(in srgb,var(--accent) 30%,transparent);
  --display:'Gloock',Georgia,serif; --body:'Instrument Sans',system-ui,sans-serif; --script:'Mrs Saint Delafield',cursive;
  --pad:clamp(16px,5vw,64px); --max:1320px;
  --edge:url("data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1200 40%22 preserveAspectRatio=%22none%22><path d=%22M0 40 L0 24.8 L8 28.6 L14 28.4 L24 25.3 L35 25.4 L45 25.3 L52 27.7 L66 24.0 L75 27.3 L90 25.6 L100 28.2 L107 27.2 L116 21.6 L123 23.2 L137 23.5 L149 28.8 L158 29.5 L165 26.6 L173 32.7 L183 31.1 L195 33.1 L204 36.1 L217 31.2 L229 32.1 L244 31.2 L253 31.3 L260 25.2 L273 19.8 L284 16.6 L297 20.2 L309 19.7 L318 17.7 L330 16.6 L340 19.1 L356 17.3 L368 15.2 L381 20.9 L397 22.8 L406 19.2 L419 15.4 L429 15.4 L437 13.6 L450 12.0 L459 12.7 L473 8.1 L484 10.8 L499 12.4 L513 8.7 L524 10.6 L538 18.0 L546 13.4 L554 15.7 L565 21.0 L574 18.2 L584 23.0 L596 29.4 L609 26.9 L621 28.5 L627 30.1 L641 29.1 L655 24.1 L665 20.9 L677 19.9 L684 20.8 L692 21.9 L698 19.3 L706 20.6 L715 20.9 L730 27.7 L738 26.1 L747 28.6 L754 33.8 L770 33.0 L781 30.9 L788 33.3 L797 37.1 L804 30.3 L820 32.5 L827 31.4 L834 30.0 L849 29.2 L862 21.6 L872 18.9 L886 19.8 L899 16.9 L908 20.5 L924 21.1 L938 21.8 L951 18.1 L962 20.0 L968 17.7 L977 19.7 L990 25.0 L1001 24.1 L1017 22.1 L1026 14.6 L1034 12.9 L1043 14.9 L1058 14.1 L1068 11.3 L1082 5.9 L1095 12.7 L1109 12.7 L1120 9.8 L1133 13.8 L1147 21.9 L1157 19.4 L1173 24.7 L1181 20.8 L1188 27.7 L1200 40 Z M175 26.9 q30 -3.0 59 0 l0 2 q-30 2 -59 0Z M420 21.9 q8 -1.0 17 0 l0 2 q-8 2 -17 0Z M1165 23.7 q18 -3.8 36 0 l0 2 q-18 2 -36 0Z M521 27.7 q26 -1.6 51 0 l0 2 q-26 2 -51 0Z M302 17.3 q11 -2.8 22 0 l0 2 q-11 2 -22 0Z M311 19.5 q8 -3.7 17 0 l0 2 q-8 2 -17 0Z M425 20.2 q20 -3.7 39 0 l0 2 q-20 2 -39 0Z M505 28.5 q18 -2.6 35 0 l0 2 q-18 2 -35 0Z M628 12.3 q16 -1.5 32 0 l0 2 q-16 2 -32 0Z M5 26.4 q9 -2.4 19 0 l0 2 q-9 2 -19 0Z M870 22.0 q13 -2.6 26 0 l0 2 q-13 2 -26 0Z M667 26.1 q8 -2.7 15 0 l0 2 q-8 2 -15 0Z M298 17.0 q24 -2.5 49 0 l0 2 q-24 2 -49 0Z M674 25.7 q28 -2.3 56 0 l0 2 q-28 2 -56 0Z M735 21.1 q18 -3.1 36 0 l0 2 q-18 2 -36 0Z M543 21.6 q17 -3.8 34 0 l0 2 q-17 2 -34 0Z M839 27.8 q29 -1.8 57 0 l0 2 q-29 2 -57 0Z M671 29.0 q26 -1.4 52 0 l0 2 q-26 2 -52 0Z M146 20.0 q7 -1.7 14 0 l0 2 q-7 2 -14 0Z M88 24.1 q25 -3.7 49 0 l0 2 q-25 2 -49 0Z M185 24.9 q22 -1.4 43 0 l0 2 q-22 2 -43 0Z M1059 29.4 q10 -3.9 21 0 l0 2 q-10 2 -21 0Z M478 20.8 q30 -3.5 59 0 l0 2 q-30 2 -59 0Z M194 19.8 q18 -2.0 36 0 l0 2 q-18 2 -36 0Z M235 17.7 q23 -1.1 46 0 l0 2 q-23 2 -46 0Z M665 19.9 q5 -2.0 11 0 l0 2 q-5 2 -11 0Z%22/></svg>"); --stroke:url("data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 300 30%22><path fill-rule=%22evenodd%22 d=%22M4.0 14.1 L11.3 12.1 L18.6 11.8 L25.9 10.3 L33.2 10.3 L40.5 11.2 L47.8 10.7 L55.1 10.1 L62.4 9.9 L69.7 9.5 L77.0 9.6 L84.3 9.5 L91.6 8.6 L98.9 9.3 L106.2 8.9 L113.5 8.7 L120.8 8.0 L128.1 7.9 L135.4 8.3 L142.7 6.9 L150.0 8.0 L157.3 7.3 L164.6 6.9 L171.9 6.4 L179.2 6.6 L186.5 6.6 L193.8 6.8 L201.1 6.4 L208.4 6.6 L215.7 6.7 L223.0 6.4 L230.3 6.7 L237.6 6.0 L244.9 7.3 L252.2 6.6 L259.5 8.5 L266.8 8.1 L274.1 8.9 L281.4 8.4 L288.7 8.5 L296.0 8.7 L296.0 9.9 L288.7 8.9 L281.4 8.5 L274.1 8.6 L266.8 9.9 L259.5 9.1 L252.2 11.9 L244.9 13.3 L237.6 12.7 L230.3 14.4 L223.0 14.6 L215.7 16.0 L208.4 17.4 L201.1 16.8 L193.8 18.9 L186.5 19.4 L179.2 20.1 L171.9 20.2 L164.6 20.5 L157.3 20.9 L150.0 21.6 L142.7 21.7 L135.4 21.9 L128.1 23.6 L120.8 23.7 L113.5 24.1 L106.2 24.2 L98.9 23.6 L91.6 22.9 L84.3 23.7 L77.0 22.7 L69.7 23.6 L62.4 23.5 L55.1 22.0 L47.8 22.1 L40.5 21.5 L33.2 20.5 L25.9 20.7 L18.6 18.6 L11.3 18.3 L4.0 15.6Z M146 21.0 l16 -1.4 l0 1z M170 9.4 l14 -0.9 l0 1z M173 10.9 l11 -0.2 l0 1z M98 20.5 l28 -0.9 l0 1z M135 15.2 l23 -0.6 l0 1z M160 16.4 l29 -0.7 l0 1z M128 17.6 l15 -1.0 l0 1z M264 15.3 l21 -1.5 l0 1z%22/></svg>");
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:400 1.0625rem/1.65 var(--body);overflow-x:hidden}
body.grain::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:100;background-image:url("data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%22220%22 height=%22220%22><filter id=%22n%22><feTurbulence type=%22fractalNoise%22 baseFrequency=%22.85%22 numOctaves=%223%22 stitchTiles=%22stitch%22/><feColorMatrix values=%220 0 0 0 .5  0 0 0 0 .5  0 0 0 0 .5  0 0 0 .55 0%22/></filter><rect width=%22100%25%22 height=%22100%25%22 filter=%22url%28%23n%29%22/></svg>");opacity:.07;mix-blend-mode:overlay}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.05;margin:0;letter-spacing:-.01em}
h2{font-size:clamp(2.2rem,7vw,4.2rem)}
p{margin:0 0 1em}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:2px solid var(--accent-soft);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--accent);color:var(--on-accent);padding:8px 14px;z-index:99}
.skip:focus{left:8px}
.lead{font-size:clamp(1.08rem,2.4vw,1.25rem);max-width:38em}

/* Brush stroke under section titles */
.brush{position:relative;display:inline-block;padding-bottom:.28em}
.brush::after{content:"";position:absolute;left:-3%;bottom:-.02em;width:min(106%,340px);height:.5em;background:var(--accent2);-webkit-mask:var(--stroke) no-repeat left/100% 100%;mask:var(--stroke) no-repeat left/100% 100%;opacity:.95;z-index:-1}
.brush{z-index:0}

/* Painted edge between sections with different backgrounds */
.edge{position:relative}
.commission.edge,.voices.edge,.events.edge{--edge-c:var(--bg)}
.edge::before{content:"";position:absolute;left:0;right:0;top:-30px;height:32px;background:var(--edge-c,var(--bg2));-webkit-mask:var(--edge) no-repeat center/100% 100%;mask:var(--edge) no-repeat center/100% 100%;pointer-events:none}
.edge.flip::before{transform:scaleX(-1)}

/* Gold-leaf flecks */
.flecks{position:absolute;pointer-events:none;color:var(--accent);z-index:0}
.flecks svg{width:100%;height:100%;overflow:visible}
body:not(.has-flecks) .flecks{display:none}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 26px;border-radius:999px;text-decoration:none;font-weight:600;font-size:1rem;border:1px solid transparent;transition:background .2s,color .2s,border-color .2s}
.btn.gold{background:var(--accent);color:var(--on-accent)}
.btn.gold:hover{background:var(--accent-soft)}
.btn.ghost{border-color:var(--line);color:var(--text);background:transparent}
.btn.ghost:hover{border-color:var(--accent);color:var(--accent-ink)}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.actions.center{justify-content:center}

/* Header */
.top{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px var(--pad);padding-top:max(12px,env(safe-area-inset-top));border-bottom:1px solid color-mix(in srgb,var(--accent) 16%,transparent)}
.top::before{content:"";position:absolute;inset:0;z-index:-1;background:color-mix(in srgb,var(--bg2) 86%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.brand,.menu-btn{position:relative;z-index:2}
.brand{text-decoration:none;display:flex;flex-direction:column;line-height:1}
.brand-name{font-family:var(--display);font-size:1.35rem}
.brand-sub{font-size:.78rem;color:var(--accent-ink);margin-top:4px;letter-spacing:.04em}
.menu-btn{display:flex;align-items:center;gap:10px;background:none;border:1px solid var(--line);border-radius:999px;padding:9px 16px;min-height:44px}
.menu-icon{width:18px;height:10px;border-top:1.5px solid currentColor;border-bottom:1.5px solid currentColor}
.nav{position:fixed;inset:0;background:var(--bg2);display:flex;flex-direction:column;justify-content:center;padding:90px var(--pad) 40px;gap:4px;transform:translateY(-100%);visibility:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),visibility 0s .35s;z-index:1}
.nav.open{transform:none;visibility:visible;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.nav a{font-family:var(--display);font-size:2.3rem;text-decoration:none;padding:6px 0}
.nav a.lang{font-family:var(--body);font-size:1rem;color:var(--accent-ink);margin-top:22px}
@media (min-width:1000px){
  .menu-btn{display:none}
  .nav{position:static;transform:none;visibility:visible;flex-direction:row;align-items:center;background:none;padding:0;gap:26px;z-index:auto}
  .nav a{font-family:var(--body);font-size:.95rem;padding:4px 0;border-bottom:1px solid transparent}
  .nav a:hover{border-color:var(--accent)}
  .nav a.lang{margin:0 0 0 8px;font-size:.95rem}
}

/* Hero: the room takes on the colours of the painting on show */
.hero-wrap{position:relative;overflow:hidden;isolation:isolate}
.glow{position:absolute;inset:-10%;z-index:-1;pointer-events:none}
.glow span{position:absolute;inset:0;background-size:cover;background-position:center;filter:blur(70px) saturate(1.35);opacity:0;transition:opacity 1.6s ease;transform:scale(1.1)}
.glow span.on{opacity:.42}
.glow::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 70% 40%,transparent 0%,color-mix(in srgb,var(--bg) 55%,transparent) 55%,var(--bg) 92%)}
body:not(.has-glow) .glow{display:none}
.hero{position:relative;display:grid;gap:30px;padding:28px var(--pad) 84px;max-width:var(--max);margin:0 auto}
.hero-art{position:relative}
.hero .flecks{inset:-30px -10px auto auto;width:62%;height:70%}
.stage{--sh:min(56vh,560px);position:relative;height:var(--sh);display:grid;place-items:center;isolation:isolate}
.stage-item{position:absolute;inset:0;display:grid;place-items:center;background:none;border:0;padding:0;opacity:0;transition:opacity 1.1s ease;pointer-events:none}
.stage-item.on{opacity:1;pointer-events:auto}
.stage-item img{max-height:var(--sh);width:auto;max-width:100%;object-fit:contain;box-shadow:0 34px 70px -24px var(--shadow),0 0 0 1px color-mix(in srgb,var(--accent) 70%,transparent),0 0 0 9px color-mix(in srgb,var(--bg2) 90%,transparent),0 0 0 10px color-mix(in srgb,var(--accent) 60%,transparent)}
.stage-sign{position:absolute;right:-1%;bottom:-46px;font-family:var(--script);font-size:clamp(2.6rem,9vw,4.2rem);color:var(--accent-soft);transform:rotate(-7deg);pointer-events:none;line-height:1;z-index:2;text-shadow:0 2px 14px color-mix(in srgb,var(--bg) 70%,transparent)}
.stage-bar{position:relative;z-index:2;display:flex;flex-direction:column;gap:14px;margin-top:38px}
.stage-caption{flex:1;min-width:0;margin:0;font-size:.95rem;color:var(--muted)}
.stage-now{color:var(--accent-ink)}
#stage-title{font-family:var(--display);font-size:1.15rem;color:var(--text)}
.stage-dots{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px}
.stage-dots button{flex:0 0 auto;width:52px;height:52px;padding:0;border:1px solid transparent;border-radius:6px;overflow:hidden;background:var(--surface);opacity:.55;transition:opacity .2s,border-color .2s}
.stage-dots button img{width:100%;height:100%;object-fit:cover}
.stage-dots button.on{opacity:1;border-color:var(--accent)}
.kicker{color:var(--accent-ink);font-size:1rem;margin-bottom:14px}
.hero h1{font-size:clamp(3rem,12.5vw,7.6rem);line-height:.93;margin-bottom:24px;text-wrap:balance}
.hero h1 .line2{display:block;padding-left:.6em}
@media (min-width:1000px){
  .hero{grid-template-columns:5fr 6fr;align-items:center;gap:56px;padding-top:48px;min-height:calc(100vh - 70px)}
  .hero-text{order:-1}
  .stage{--sh:min(66vh,700px)}
  .stage-bar{flex-direction:row;align-items:center;justify-content:space-between}
}
@media (prefers-reduced-motion:reduce){.stage-item,.glow span{transition:none}html{scroll-behavior:auto}}

/* Works */
.works{background:var(--bg2);padding:72px var(--pad) 80px;--edge-c:var(--bg2)}
.works-head{max-width:var(--max);margin:0 auto 28px;display:grid;gap:14px}
.works-head p{color:var(--muted);max-width:36em;margin:0}
@media (min-width:900px){.works-head{grid-template-columns:1fr 1fr;align-items:end}}
.filters{max-width:var(--max);margin:0 auto 30px;display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.filters::-webkit-scrollbar,.stage-dots::-webkit-scrollbar{display:none}
@media (max-width:640px){.filters{margin-right:calc(var(--pad)*-1);padding-right:var(--pad)}}
.chip{flex:0 0 auto;scroll-snap-align:start;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--line);background:transparent;font-size:.95rem;white-space:nowrap}
.chip small{color:var(--accent-ink);margin-left:4px;font-size:.8rem}
.chip.on{background:var(--text);color:var(--bg);border-color:var(--text)}
.chip.on small{color:var(--bg);opacity:.7}
.grid{max-width:var(--max);margin:0 auto;columns:2;column-gap:14px}
@media (min-width:700px){.grid{columns:3;column-gap:24px}}
@media (min-width:1100px){.grid{columns:4;column-gap:30px}}
.work{break-inside:avoid;margin:0 0 26px}
.work[hidden]{display:none}
.work-link{display:block;text-decoration:none}
.work-img{display:block;background:var(--surface);padding:5px;box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 35%,transparent),0 18px 30px -18px var(--shadow);transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s}
.work-img img{width:100%;height:100%;object-fit:cover}
.work-link:hover .work-img,.work-link:focus-visible .work-img{transform:translateY(-4px);box-shadow:0 0 0 1px var(--accent),0 26px 40px -18px var(--shadow)}
.work-title{display:block;font-family:var(--display);font-size:1.12rem;line-height:1.2;margin-top:12px}
.work-meta{display:block;font-size:.84rem;color:var(--muted);line-height:1.4;margin-top:4px}
.tag{display:inline-block;font-size:.75rem;padding:1px 8px;border-radius:999px;margin-left:4px;vertical-align:1px}
.tag-sold{background:var(--sold);color:#fff}
.tag-reserved{border:1px solid var(--accent);color:var(--accent-ink)}
.tag-request{border:1px solid var(--muted);color:var(--muted)}
.more-wrap{text-align:center;margin-top:24px}
.shown{color:var(--muted);font-size:.9rem;margin-top:12px}

/* Commission */
.commission{position:relative;display:grid;gap:36px;padding:96px var(--pad);max-width:var(--max);margin:0 auto}
.com-art{margin:0;position:relative}
.com-art img{width:100%;max-height:72vh;object-fit:contain;object-position:left;filter:drop-shadow(0 30px 40px var(--shadow))}
.com-art figcaption{font-size:.85rem;color:var(--muted);margin-top:12px}
.com-text h2{margin-bottom:26px}
.steps{list-style:none;padding:0;margin:30px 0 32px;counter-reset:s;display:grid;gap:18px}
.steps li{counter-increment:s;display:grid;grid-template-columns:44px 1fr;column-gap:14px}
.steps li::before{content:counter(s);grid-row:span 2;width:44px;height:44px;border-radius:50%;border:1px solid var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-family:var(--display);font-size:1.2rem}
.steps strong{font-weight:600}
.steps span{color:var(--muted);font-size:.98rem}
@media (min-width:900px){.commission{grid-template-columns:1fr 1fr;align-items:center;gap:72px}}

/* About */
.about{background:var(--surface);padding:96px var(--pad);display:grid;gap:48px;--edge-c:var(--surface)}
.portrait{margin:0 0 24px;position:relative;max-width:440px;isolation:isolate}
.splash{position:absolute;inset:-12% -24% -12% -22%;z-index:-1;pointer-events:none}
.splash svg{width:100%;height:100%}
.portrait img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:top;border-radius:220px 220px 4px 4px;box-shadow:0 30px 50px -24px var(--shadow)}
.portrait .flecks{inset:-6% -12% auto auto;width:70%;height:60%}
.signature{font-family:var(--script);font-size:3.4rem;color:var(--accent-soft);position:absolute;bottom:-26px;right:-6px;line-height:1;transform:rotate(-6deg)}
.about-text{max-width:40em}
.about-text h2{margin-bottom:26px}
.about blockquote{font-family:var(--display);font-size:clamp(1.3rem,3.6vw,1.75rem);line-height:1.3;margin:0 0 26px;color:var(--accent-soft)}
.facts{margin:34px 0 0;display:grid;border-top:1px solid var(--line)}
.facts div{display:grid;gap:2px;padding:14px 0;border-bottom:1px solid var(--line)}
.facts dt{color:var(--accent-ink);font-weight:600;font-size:.95rem}
.facts dd{margin:0;font-size:.98rem}
@media (min-width:600px){.facts div{grid-template-columns:150px 1fr;gap:18px}}
@media (min-width:900px){.about{grid-template-columns:minmax(300px,440px) 1fr;gap:90px;align-items:start;justify-content:center}.portrait{position:sticky;top:120px}}

/* Voices */
.voices{padding:84px var(--pad);max-width:var(--max);margin:0 auto}
.voices h2{font-size:clamp(1.9rem,5vw,2.8rem);margin-bottom:34px}
.voice-row{display:grid;gap:28px}
.voice{margin:0;padding-left:20px;border-left:2px solid var(--accent2)}
.voice blockquote{margin:0 0 12px;font-size:1.05rem}
.voice figcaption{color:var(--muted);font-size:.9rem}
@media (min-width:900px){.voice-row{grid-template-columns:repeat(3,1fr);gap:40px}}

/* Courses */
.courses{background:var(--bg2);padding:96px var(--pad);--edge-c:var(--bg2)}
.courses-head{max-width:var(--max);margin:0 auto 32px;display:grid;gap:14px}
.courses-head p{color:var(--muted);max-width:38em;margin:0}
.course-row{display:grid;grid-auto-flow:column;grid-auto-columns:82%;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);margin:0 calc(var(--pad)*-1) 32px;padding:0 var(--pad) 8px;scrollbar-width:thin;scrollbar-color:var(--accent2) transparent}
.course{scroll-snap-align:start}
.course img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:2px;margin-bottom:14px}
.course h3{font-size:1.45rem;margin-bottom:8px}
.course p{color:var(--muted);font-size:.96rem}
.courses>.btn{display:flex;width:max-content;margin:0 auto}
@media (min-width:700px){.course-row{grid-auto-columns:42%}}
@media (min-width:1100px){.course-row{grid-auto-flow:row;grid-template-columns:repeat(5,1fr);overflow:visible;margin:0 auto 40px;padding:0;max-width:var(--max)}.courses-head{grid-template-columns:1fr 1fr;align-items:end}}

/* Exhibitions & press */
.events{padding:96px var(--pad);max-width:var(--max);margin:0 auto}
.events-head{display:grid;gap:14px;margin-bottom:30px}
.events-head p{color:var(--muted);max-width:36em;margin:0}
@media (min-width:900px){.events-head{grid-template-columns:1fr 1fr;align-items:end}}
.upcoming{display:grid;gap:16px;margin-bottom:40px}
@media (min-width:800px){.upcoming{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}}
.up-card{position:relative;display:grid;grid-template-columns:1fr auto;column-gap:16px;align-content:start;padding:24px;border:1px solid var(--accent);border-radius:4px;background:radial-gradient(ellipse at 0 0,color-mix(in srgb,var(--accent) 16%,transparent),transparent 60%),var(--surface)}
.up-card>*{grid-column:1}
.up-card .ev-img{grid-column:2;grid-row:1/span 6;align-self:start}
.up-label{color:var(--accent-ink);font-size:.9rem;margin:0 0 6px}
.up-date{font-family:var(--display);font-size:clamp(1.8rem,6vw,2.6rem);line-height:1;margin:0 0 10px}
.up-card h3{font-family:var(--body);font-weight:600;font-size:1.1rem;line-height:1.35;margin-bottom:4px}
.ev-filters{margin:0 0 10px}
.ev-list{list-style:none;margin:0;padding:0}
.ev{display:grid;grid-template-columns:96px 1fr;gap:4px 16px;padding:20px 0;border-bottom:1px solid var(--line)}
.ev[hidden]{display:none}
.ev time{color:var(--accent-ink);font-size:.92rem;padding-top:24px}
.ev-body{min-width:0}
.ev h3{font-family:var(--body);font-weight:500;font-size:1.06rem;line-height:1.4;margin:0}
.ev-type{display:inline-block;font-size:.76rem;padding:1px 9px;border-radius:999px;border:1px solid var(--line);color:var(--muted);margin-bottom:6px}
.ev-type.ev-press{border-color:var(--accent2);color:var(--text)}
.ev-type.ev-vernissage{border-color:var(--accent);color:var(--accent-ink)}
.ev-place{color:var(--muted);font-size:.92rem;margin:2px 0 0}
.ev-text{font-size:.96rem;margin:8px 0 0;max-width:42em}
.ev-link{display:inline-block;margin-top:8px;color:var(--accent-ink);font-size:.95rem;text-underline-offset:3px}
.ev .ev-img{grid-column:2;justify-self:start;margin-top:10px}
.ev-img{padding:0;border:0;background:var(--surface);border-radius:3px;overflow:hidden;cursor:zoom-in}
.ev-img img{width:120px;height:120px;object-fit:cover}
@media (min-width:700px){.ev{grid-template-columns:150px 1fr auto;align-items:start}.ev time{font-size:1rem}.ev .ev-img{grid-column:3;grid-row:1;margin:0}.ev-img img{width:140px;height:105px}}
.clip{background:transparent;max-width:min(96vw,1100px);max-height:94vh;overflow:visible}
.clip img{max-width:100%;max-height:90vh;margin:auto;border-radius:3px}

/* Contact */
.contact{position:relative;overflow:hidden;isolation:isolate;text-align:center;padding:110px var(--pad) 120px;background:radial-gradient(ellipse at 50% 0%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 60%),var(--surface);--edge-c:var(--surface)}
.contact .flecks{inset:-10px -10px auto auto;width:min(46%,520px);height:150px;opacity:.85}
.contact>*:not(.flecks){position:relative;z-index:1}
.contact h2{font-size:clamp(2.6rem,10vw,5.5rem);margin-bottom:22px}
.contact .lead{margin:0 auto 26px}
.mail{display:inline-block;font-family:var(--display);font-size:clamp(1.15rem,4.6vw,2rem);color:var(--accent-soft);text-decoration:none;border-bottom:1px solid var(--line);word-break:break-all}
.place{color:var(--muted);margin-top:30px;font-size:.95rem}
.contact .signature{position:static;display:block;margin-top:34px;transform:rotate(-4deg);font-size:3rem}

/* Footer */
.foot{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;padding:26px var(--pad) max(26px,env(safe-area-inset-bottom));background:var(--bg2);color:var(--muted);font-size:.88rem}
.linkish{background:none;border:0;padding:0;text-decoration:underline;color:var(--muted);font-size:.88rem}

/* Dialogs */
dialog{border:0;padding:0;color:var(--text)}
dialog::backdrop{background:color-mix(in srgb,var(--bg2) 88%,black)}
.x{position:absolute;top:max(12px,env(safe-area-inset-top));right:12px;width:46px;height:46px;border-radius:50%;background:color-mix(in srgb,var(--bg2) 75%,transparent);border:1px solid var(--line);z-index:3}
.x::before,.x::after{content:"";position:absolute;left:50%;top:50%;width:18px;height:1.5px;background:var(--text);transform:translate(-50%,-50%) rotate(45deg)}
.x::after{transform:translate(-50%,-50%) rotate(-45deg)}
.sheet{background:var(--surface);max-width:640px;width:calc(100% - 24px);padding:40px 26px 30px;border-radius:6px}
.sheet h2{font-size:2rem;margin-bottom:12px}
.sheet h3{font-family:var(--body);font-weight:600;font-size:1rem;color:var(--accent-ink);margin:20px 0 6px}
.viewer{width:100%;max-width:100%;height:100%;max-height:100%;margin:0;background:var(--bg2);overflow-y:auto;overscroll-behavior:contain}
.viewer[open]{display:grid;grid-template-rows:auto auto}
.v-media{position:relative;display:grid;place-items:center;height:68vh;height:68svh;padding:56px 10px 12px;background:radial-gradient(closest-side,color-mix(in srgb,var(--accent) 14%,transparent),transparent)}
.v-media img{max-width:100%;max-height:calc(68svh - 68px);object-fit:contain;touch-action:pan-y;transition:opacity .25s;box-shadow:0 24px 50px -20px var(--shadow)}
.v-media img.fade{opacity:.2}
.v-nav{position:absolute;top:50%;width:46px;height:46px;border-radius:50%;background:color-mix(in srgb,var(--bg2) 70%,transparent);border:1px solid var(--line)}
.v-nav::before{content:"";position:absolute;left:50%;top:50%;width:11px;height:11px;border-left:1.5px solid var(--text);border-bottom:1.5px solid var(--text)}
.v-prev{left:10px}.v-prev::before{transform:translate(-35%,-50%) rotate(45deg)}
.v-next{right:10px}.v-next::before{transform:translate(-65%,-50%) rotate(-135deg)}
.v-info{padding:22px var(--pad) 110px;max-width:680px}
.v-cat{color:var(--accent-ink);font-size:.92rem;margin-bottom:6px}
.v-info h2{font-size:clamp(1.9rem,6vw,2.8rem);margin-bottom:18px}
.v-meta{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:0 0 20px;font-size:.95rem}
.v-meta dt{color:var(--muted)}
.v-meta dd{margin:0}
.v-actions{position:fixed;left:0;right:0;bottom:0;display:flex;gap:10px;padding:12px var(--pad) max(12px,env(safe-area-inset-bottom));background:linear-gradient(transparent,var(--bg2) 30%)}
.v-actions .btn.gold{flex:1}
@media (min-width:1000px){
  .viewer[open]{grid-template-columns:1fr 440px;grid-template-rows:1fr;overflow:hidden}
  .v-media{height:100vh;padding:40px 80px}
  .v-media img{max-height:calc(100vh - 80px)}
  .v-info{overflow-y:auto;padding:90px 40px 40px;border-left:1px solid var(--line)}
  .v-actions{position:static;padding:10px 0 0;background:none}
  .v-prev{left:20px}.v-next{right:20px}
}
section[id]{scroll-margin-top:72px}