/* ===== DESIGN TOKENS CSS ===== */
/* Shared colors, fonts, and spacing. Change these to restyle the entire site. */
:root { color-scheme: dark; --bg:#151515; --surface:#202020; --text:#f1eee9; --muted:#aaa59f; --line:#44413e; --accent:#d4bba0; --max:1380px; }

/* ===== GLOBAL CSS ===== */
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--text); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
img { max-width:100%; display:block; }
:focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
.skip-link { position:absolute; top:-60px; left:15px; z-index:10; padding:12px; background:white; color:black; }
.skip-link:focus { top:15px; }

/* ===== NAV CSS ===== */
.site-header { max-width:var(--max); margin:auto; padding:30px 5%; display:flex; justify-content:space-between; align-items:center; gap:24px; border-bottom:1px solid var(--line); }
.wordmark { font-size:clamp(17px,2vw,24px); letter-spacing:.22em; font-weight:700; text-decoration:none; white-space:nowrap; }
.wordmark span { font-weight:400; }
.main-nav { display:flex; flex-wrap:wrap; gap:clamp(16px,3vw,38px); }
.main-nav a { font-size:12px; letter-spacing:.12em; text-transform:uppercase; text-decoration:none; color:var(--muted); padding:7px 0; transition:color .2s; }
.main-nav a:hover,.main-nav a.active { color:var(--text); }

/* ===== INTRO CSS ===== */

/* ===== INTRO CSS ===== */
/* Homepage introduction and featured artwork layout */

.intro {
    max-width: var(--max);
    margin: 0 auto;
    padding: 90px 5% 110px;

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 65px;
    align-items: center;
}

/* ===== INTRO TEXT CSS ===== */
/* Controls the left column */

.intro-content {
    min-width: 0;
}

.eyebrow,
.overline {
    display: flex;
    align-items: center;
    gap: 14px;
    color: var(--accent);
    letter-spacing: .28em;
    font-size: 11px;
    font-weight: 700;
}

.eyebrow-line {
    width: 36px;
    height: 1px;
    background: var(--accent);
}

.intro h1 {
    font-size: clamp(48px, 5.5vw, 86px);
    line-height: 1.08;
    letter-spacing: -.055em;
    font-weight: 400;
    margin: 30px 0 25px;
}

.intro h1 em,
.series-section h2 em {
    font-family: Georgia, serif;
    font-weight: 400;
    color: var(--accent);
}

.intro p {
    color: var(--muted);
    font-size: clamp(15px, 1.7vw, 19px);
    line-height: 1.7;
    margin: 0;
}

/* ===== FEATURED ARTWORK CSS ===== */
/* Controls Villains image and caption */

.intro-artwork {
    margin: 0;
    min-width: 0;
}

.intro-artwork img {
    width: 100%;
    max-height: 650px;
    object-fit: contain;
    display: block;
}

.intro-artwork figcaption {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    padding-top: 16px;
    color: var(--muted);
    font-size: 12px;
    letter-spacing: .08em;
}

/* ===== INTRO RESPONSIVE CSS ===== */
/* Stacks text and painting on smaller screens */

@media (max-width: 900px) {
    .intro {
        grid-template-columns: 1fr;
        gap: 45px;
        padding-top: 65px;
        padding-bottom: 80px;
    }

    .intro h1 {
        font-size: clamp(48px, 9vw, 80px);
    }

    .intro-artwork {
        max-width: 650px;
        width: 100%;
        margin: 0 auto;
    }
}


/* ===== GALLERY CSS ===== */
.gallery-section { max-width:var(--max); margin:auto; padding:0 5% 110px; }
.section-heading { display:flex; justify-content:space-between; align-items:baseline; gap:15px; padding:0 0 20px; border-bottom:1px solid var(--line); margin-bottom:35px; }
.section-heading h2 { font-size:clamp(23px,3vw,34px); font-weight:400; margin:0; }
.section-heading span { font-size:10px; letter-spacing:.22em; color:var(--muted); }
.art-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:65px 34px; }
.art-card { margin:0; min-width:0; }
.art-card--wide { grid-column:1 / -1; }
.art-card img { width:100%; height:clamp(290px,43vw,560px); object-fit:contain; background:var(--surface); padding:clamp(12px,2vw,28px); }
.art-card--wide img { height:clamp(380px,65vw,760px); }
.art-card figcaption { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:10px 24px; padding:18px 2px 0; }
.art-card figcaption span { font-size:clamp(15px,1.6vw,20px); }
.art-card figcaption small { color:var(--muted); font-size:12px; }

/* ===== SERIES PREVIEW CSS ===== */
.series-section { border-top:1px solid var(--line); max-width:var(--max); margin:0 auto; padding:85px 5% 105px; display:grid; grid-template-columns:1.3fr 1fr; gap:50px; align-items:end; }
.series-section h2 { font-size:clamp(38px,5vw,72px); font-weight:400; letter-spacing:-.045em; line-height:1.12; margin:20px 0 0; }
.series-section p { color:var(--muted); line-height:1.9; font-size:16px; max-width:440px; margin:0; }

/* ===== FOOTER CSS ===== */
.site-footer { border-top:1px solid var(--line); padding:28px 5%; display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; color:var(--muted); font-size:11px; letter-spacing:.08em; }

/* ===== MOBILE RESPONSIVE CSS ===== */
@media (max-width:700px) {
  .site-header { flex-direction:column; align-items:flex-start; padding-top:25px; }
  .main-nav { gap:22px; }
  .intro { padding-top:70px; }
  .art-grid { grid-template-columns:1fr; gap:42px; }
  .art-card--wide { grid-column:auto; }
  .art-card img,.art-card--wide img { height:auto; max-height:650px; aspect-ratio:4/5; }
  .series-section { grid-template-columns:1fr; gap:25px; padding-top:65px; }
  .section-heading span { display:none; }
}

/* ===== REDUCED MOTION CSS ===== */
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .main-nav a { transition:none; } }


/* ===== ABOUT / CV / PRESS CSS ===== */
/* The artist-information page shares the site's global design tokens and navigation. */
.about-main { max-width:var(--max); margin:0 auto; padding:0 5% 110px; }
.about-page-intro { padding:85px 0 55px; border-bottom:1px solid var(--line); }
.about-page-intro h1 { font-size:clamp(45px,6vw,82px); font-weight:400; letter-spacing:-.055em; line-height:1.1; margin:25px 0 18px; }
.about-page-intro h1 em { font-family:Georgia,serif; color:var(--accent); font-weight:400; }
.about-page-intro p { color:var(--muted); font-size:16px; line-height:1.7; margin:0; }
.about-tabs { display:flex; flex-wrap:wrap; gap:clamp(24px,4vw,60px); border-bottom:1px solid var(--line); margin:0 0 54px; }
.about-tab { background:transparent; border:0; border-bottom:2px solid transparent; border-radius:0; color:var(--muted); cursor:pointer; font:inherit; font-size:12px; letter-spacing:.16em; text-transform:uppercase; padding:24px 0 18px; }
.about-tab:hover, .about-tab.active { color:var(--text); }
.about-tab.active { border-bottom-color:var(--accent); }
.about-panel[hidden] { display:none !important; }
.about-panel { max-width:1100px; }
.about-heading { font-size:clamp(30px,4vw,50px); font-weight:400; letter-spacing:-.035em; margin:0 0 12px; }
.about-subtitle { color:var(--accent); font-family:Georgia,serif; font-style:italic; font-size:clamp(17px,2vw,23px); margin:0 0 35px; }
.about-portrait { max-width:600px; margin:0 0 48px; }
.about-portrait img { max-height:690px; width:100%; object-fit:contain; object-position:left center; }
.artist-bio { max-width:830px; }
.artist-bio p { font-size:clamp(15px,1.4vw,18px); line-height:1.95; color:var(--text); margin:0 0 26px; }
.cv-content, .press-content { margin-top:38px; }
.cv-section, .press-section { border-top:1px solid var(--line); padding:28px 0 36px; }
.cv-section h2, .press-section h2 { font-size:clamp(20px,2.4vw,29px); font-weight:400; margin:0 0 23px; }
.cv-entry, .cv-list li { color:var(--text); font-size:14px; line-height:1.8; margin:0 0 13px; }
.cv-list { padding-left:22px; margin:0; }
.cv-content a, .press-content a { color:var(--accent); text-decoration:underline; text-decoration-color:var(--line); text-underline-offset:4px; overflow-wrap:anywhere; }
.cv-content a:hover, .press-content a:hover { text-decoration-color:var(--accent); }
.press-entry { display:grid; grid-template-columns:minmax(125px,190px) minmax(0,1fr); gap:15px 30px; padding:23px 0; border-bottom:1px solid var(--line); }
.press-entry:last-child { border-bottom:0; }
.press-date { color:var(--muted); font-size:12px; letter-spacing:.045em; line-height:1.7; }
.press-entry h3 { font-weight:400; font-size:clamp(16px,1.8vw,21px); margin:0 0 7px; line-height:1.5; }
.press-entry p { margin:0 0 7px; color:var(--muted); font-size:13px; line-height:1.6; }
.press-subitems { padding-left:18px; margin:10px 0 0; }
.press-subitems li { line-height:1.7; margin-bottom:5px; font-size:13px; }
@media (max-width:700px) {
  .about-main { padding-bottom:65px; }
  .about-page-intro { padding:65px 0 36px; }
  .about-tabs { margin-bottom:35px; }
  .about-portrait { margin-bottom:35px; }
  .press-entry { grid-template-columns:1fr; gap:5px; }
}

/* ===== STICKY NAV CSS ===== */
/* Keeps the shared navigation visible while scrolling. */
.site-header { position:sticky; top:0; z-index:100; max-width:none; padding-left:max(5%, calc((100% - var(--max))/2 + 5%)); padding-right:max(5%, calc((100% - var(--max))/2 + 5%)); background:var(--bg); }

/* ===== GALLERIES PAGE CSS ===== */
/* Introductory heading and the three series preview images. */
.galleries-main { max-width:var(--max); margin:auto; padding:76px 5% 120px; }
.galleries-intro { margin-bottom:58px; }
.galleries-intro h1 { font-size:clamp(48px,6vw,82px); line-height:1.1; font-weight:400; letter-spacing:-.05em; margin:22px 0 16px; }
.galleries-intro h1 em { font-family:Georgia,serif; color:var(--accent); font-weight:400; }
.galleries-intro p { color:var(--muted); font-size:16px; line-height:1.7; margin:0; }
.galleries-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(22px,3vw,48px); align-items:start; }
.gallery-series { min-width:0; margin:0; }
.gallery-series a { display:block; text-decoration:none; }
.gallery-series-image { height:clamp(260px,32vw,440px); display:flex; align-items:center; justify-content:center; overflow:hidden; background:var(--surface); }
.gallery-series-image img { width:100%; height:100%; object-fit:contain; transition:transform .35s ease; }
.gallery-series a:hover img, .gallery-series a:focus-visible img { transform:scale(1.035); }
.gallery-series figcaption { display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding-top:20px; border-top:1px solid var(--line); margin-top:18px; }
.gallery-series-title { font-size:clamp(18px,2vw,25px); letter-spacing:-.025em; }
.gallery-series-arrow { color:var(--accent); font-size:20px; }
.gallery-series-work { display:block; margin-top:9px; color:var(--muted); font-size:12px; letter-spacing:.04em; }

/* ===== GALLERIES RESPONSIVE CSS ===== */
@media (max-width:850px) { .galleries-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .galleries-main { padding-top:55px; } }
@media (max-width:580px) { .galleries-grid { grid-template-columns:1fr; gap:48px; } .gallery-series-image { height:auto; min-height:260px; } .gallery-series-image img { height:auto; max-height:490px; } .galleries-main { padding-bottom:80px; } }
@media (prefers-reduced-motion:reduce) { .gallery-series-image img { transition:none; } }


/* ===== COLLECTION PAGE CSS ===== */
/* Shared layout for individual series pages such as Slices of Life. */
.collection-main { max-width:var(--max); margin:0 auto; padding:70px 5% 115px; }
.collection-intro { padding-bottom:65px; }
.collection-back,.collection-return a { display:inline-block; color:var(--accent); font-size:12px; letter-spacing:.08em; text-decoration:none; }
.collection-back { margin-bottom:45px; }
.collection-back:hover,.collection-return a:hover { text-decoration:underline; text-underline-offset:5px; }
.collection-intro h1 { font-size:clamp(48px,6vw,82px); line-height:1.1; font-weight:400; letter-spacing:-.05em; margin:22px 0 16px; }
.collection-intro h1 em { font-family:Georgia,serif; color:var(--accent); font-weight:400; }
.collection-intro p { color:var(--muted); font-size:16px; line-height:1.7; margin:0; }

/* ===== COLLECTION ARTWORK GRID CSS ===== */
/* Two paintings per row on desktop, one per row on mobile. Images are never cropped. */
.collection-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:90px 48px; }
.collection-artwork { min-width:0; }
.collection-figure { margin:0; }
.collection-figure img { width:100%; height:clamp(340px,42vw,610px); object-fit:contain; background:var(--surface); }
.collection-figure figcaption { margin-top:22px; }
.collection-figure h2 { font-size:clamp(21px,2.3vw,30px); font-weight:400; line-height:1.3; margin:0; }

/* ===== ARTWORK DETAILS CSS ===== */
/* Edit each artwork's description and metadata directly in its HTML section. */
.artwork-details { margin-top:16px; padding-top:18px; border-top:1px solid var(--line); }
.artwork-description { color:var(--muted); font-size:14px; line-height:1.8; margin:0 0 20px; }
.artwork-specs { display:grid; gap:10px; margin:0; }
.artwork-specs div { display:grid; grid-template-columns:110px minmax(0,1fr); gap:14px; font-size:13px; line-height:1.6; }
.artwork-specs dt { color:var(--muted); }
.artwork-specs dd { margin:0; overflow-wrap:anywhere; }
.collection-return { border-top:1px solid var(--line); margin-top:95px; padding-top:30px; }

/* ===== COLLECTION RESPONSIVE CSS ===== */
@media (max-width:700px) {
  .collection-main { padding-top:45px; padding-bottom:75px; }
  .collection-intro { padding-bottom:45px; }
  .collection-back { margin-bottom:32px; }
  .collection-grid { grid-template-columns:1fr; gap:65px; }
  .collection-figure img { height:auto; max-height:620px; }
  .collection-return { margin-top:70px; }
}

/* ===== INSTALLATIONS PAGE CSS ===== */
/* Exhibition photos only: no captions, metadata, or cropping. */
.installations-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:34px; align-items:start; }
.installation-photo { margin:0; min-width:0; }
.installation-photo img { display:block; width:100%; height:auto; background:var(--surface); }

/* ===== INSTALLATIONS LINK CSS ===== */
/* Keeps the three painting collections separate from exhibition documentation. */
.installations-link { margin-top:70px; padding-top:24px; border-top:1px solid var(--line); }
.installations-link a { display:inline-flex; gap:14px; align-items:center; color:var(--accent); font-size:16px; text-decoration:none; }
.installations-link a:hover { text-decoration:underline; text-underline-offset:5px; }
@media (max-width:700px) { .installations-grid { grid-template-columns:1fr; gap:24px; } .installations-link { margin-top:50px; } }

/* ===== REVIEWS PAGE CSS ===== */
.reviews-main { padding-bottom:35px; }
.reviews-section { margin-bottom:100px; }
.reviews-section-heading { margin-bottom:35px; }
.reviews-section-heading h2 { font-family:Georgia,serif; font-size:clamp(28px,3.5vw,46px); font-weight:400; margin:15px 0 0; }
/* ===== PRESS REVIEWS CSS ===== */
.press-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.press-quote { margin:0; padding:clamp(25px,3.5vw,48px); background:var(--surface); border-top:1px solid var(--line); display:flex; flex-direction:column; justify-content:space-between; }
.press-quote p { font:clamp(18px,1.8vw,23px)/1.65 Georgia,serif; margin:0 0 28px; }
.press-quote footer,.review-copy footer,.collector-general footer { color:var(--accent); font-size:12px; letter-spacing:.08em; line-height:1.6; }
/* ===== COLLECTOR REVIEWS CSS ===== */
.collector-reviews { display:grid; gap:52px; }
.collector-review { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:clamp(28px,5vw,75px); border-bottom:1px solid var(--line); padding-bottom:52px; }
.collector-review:nth-child(even) .review-artwork { order:2; }
.review-artwork { margin:0; }
.review-artwork img { width:100%; max-height:620px; object-fit:contain; }
.review-artwork figcaption { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.16em; padding-top:14px; }
.review-copy blockquote,.collector-general blockquote { margin:20px 0 0; }
.review-copy p,.collector-general p { font-size:clamp(16px,1.5vw,19px); line-height:1.85; margin:0 0 24px; }
.collector-general { max-width:880px; margin:20px auto 0; padding:clamp(25px,5vw,60px); background:var(--surface); }
/* ===== REVIEWS MOBILE CSS ===== */
@media(max-width:760px) { .press-grid,.collector-review { grid-template-columns:1fr; } .collector-review:nth-child(even) .review-artwork { order:0; } .reviews-section { margin-bottom:65px; } .collector-reviews { gap:35px; } .collector-review { padding-bottom:35px; } }

/* ===== INVISIBILITY PROJECT PAGE CSS ===== */
.invisibility-main { padding-bottom:90px; }
.invisibility-feature { margin:0 0 105px; }
.invisibility-feature-heading { max-width:850px; margin:0 auto 38px; text-align:center; }
.invisibility-feature-heading h2,.invisibility-story h2,.invisibility-reading h2,.invisibility-support h2 { font:400 clamp(32px,4.8vw,66px)/1.14 Georgia,serif; margin:16px 0 20px; }
.invisibility-feature-heading h2 em,.invisibility-story h2 em,.invisibility-reading h2 em,.invisibility-support h2 em { font-weight:400; }
.invisibility-feature-heading p { color:var(--muted); line-height:1.7; }
/* ===== FEATURED PAINTING CSS ===== */
.invisibility-painting { max-width:1000px; margin:0 auto; }
.invisibility-painting a { display:block; }
.invisibility-painting img { display:block; width:100%; height:auto; }
.invisibility-painting figcaption { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; color:var(--muted); font-size:12px; line-height:1.7; margin-top:16px; }
.invisibility-painting figcaption strong { color:var(--text); font-weight:500; }
.invisibility-not-for-sale { text-align:center; color:var(--accent); font-size:12px; text-transform:uppercase; letter-spacing:.16em; margin-top:32px; }
/* ===== PROJECT STORY CSS ===== */
.invisibility-story { display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,7vw,110px); border-top:1px solid var(--line); padding:80px 0 100px; }
.invisibility-story-copy p { font-size:clamp(17px,1.55vw,20px); line-height:1.85; margin:0 0 24px; }
/* ===== FURTHER READING CSS ===== */
.invisibility-reading { background:var(--surface); padding:clamp(28px,5vw,70px); margin-bottom:70px; }
.invisibility-reading p,.invisibility-support p { max-width:700px; line-height:1.85; font-size:18px; }
.invisibility-article-link { display:inline-flex; align-items:center; gap:16px; color:var(--accent); margin-top:18px; padding-bottom:8px; border-bottom:1px solid currentColor; text-decoration:none; }
.invisibility-article-link:hover { color:var(--text); }
/* ===== ONGOING PROJECT / SUPPORT CSS ===== */
.invisibility-support { text-align:center; max-width:780px; margin:0 auto; padding:40px 0 25px; }
.invisibility-support p { margin:0 auto; }
/* ===== INVISIBILITY MOBILE CSS ===== */
@media (max-width:760px) { .invisibility-feature { margin-bottom:65px; } .invisibility-story { grid-template-columns:1fr; padding:55px 0 65px; } .invisibility-reading { margin-bottom:40px; } .invisibility-painting figcaption { display:block; } }

/* ===== COMMISSIONS PAGE CSS ===== */
.commissions-main .collection-intro { max-width:920px; }
.commissions-main .collection-intro p { max-width:760px; }
.commission-cta,.commission-submit { display:inline-flex; align-items:center; justify-content:center; gap:20px; background:var(--accent); color:#151515; border:1px solid var(--accent); padding:17px 24px; text-decoration:none; font:600 12px/1.4 Arial,sans-serif; text-transform:uppercase; letter-spacing:.12em; cursor:pointer; transition:background .2s,color .2s; }
.commission-cta { margin-top:24px; }
.commission-cta:hover,.commission-submit:hover { background:transparent; color:var(--accent); }
.commission-submit:disabled { opacity:.55; cursor:wait; }
.commission-inquiry { border-top:1px solid var(--line); padding:75px 0 110px; scroll-margin-top:110px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:clamp(30px,7vw,110px); }
.commission-inquiry-intro h2 { font:400 clamp(34px,4.5vw,60px)/1.18 Georgia,serif; margin:18px 0 25px; }
.commission-inquiry-intro p { color:var(--muted); font-size:18px; line-height:1.8; }
.commission-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:23px; }
.commission-field { display:flex; flex-direction:column; gap:10px; }
.commission-full { grid-column:1/-1; }
.commission-field label { color:var(--text); font-size:12px; letter-spacing:.08em; }
.commission-field input,.commission-field select,.commission-field textarea { width:100%; min-width:0; background:#202020; color:var(--text); border:1px solid #49413d; border-radius:0; padding:14px 15px; font:16px/1.5 Arial,sans-serif; }
.commission-field textarea { resize:vertical; }
.commission-field input:focus-visible,.commission-field select:focus-visible,.commission-field textarea:focus-visible,.commission-submit:focus-visible,.commission-cta:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.commission-form-note { color:var(--muted); font-size:12px; line-height:1.65; margin:18px 0; }
.commission-form-status { color:var(--accent); line-height:1.6; }
@media(max-width:900px) { .commission-inquiry { grid-template-columns:1fr; } }
@media(max-width:540px) { .commission-form-grid { grid-template-columns:1fr; } }
/* ===== END COMMISSIONS PAGE CSS ===== */

/* ===== UPDATED NAV CSS ===== */
/* Shared desktop navigation and dropdown menus */

.site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 24px;
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--bg);
  border-bottom: 1px solid var(--line);
}

.main-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: nowrap;
  gap: clamp(10px, 1.4vw, 22px);
}

.main-nav > a,
.nav-dropdown > summary {
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  padding: 10px 0;
}

.main-nav a:hover,
.nav-dropdown summary:hover,
.main-nav a.active {
  color: var(--accent);
}

/* ===== WORKS DROPDOWN CSS ===== */

.nav-dropdown {
  position: relative;
}

.nav-dropdown > summary {
  list-style: none;
}

.nav-dropdown > summary::-webkit-details-marker {
  display: none;
}

.dropdown-content {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 190px;
  padding: 12px;
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: 0 12px 28px rgba(0,0,0,.35);
  z-index: 1100;
}

.dropdown-content a {
  display: block;
  padding: 12px;
  color: var(--muted);
  font-size: 12px;
  text-decoration: none;
  white-space: nowrap;
}

.dropdown-content a:hover {
  color: var(--accent);
  background: var(--bg);
}

/* ===== MOBILE NAV CSS ===== */
/* Hamburger menu replaces desktop navigation */

.mobile-nav {
  display: none;
}

@media (max-width: 1100px) {

  .site-header {
    flex-direction: row;
    align-items: center;
    padding: 20px 5%;
  }

  .main-nav {
    display: none;
  }

  .mobile-nav {
    display: block;
    margin-left: auto;
    position: relative;
  }

  .mobile-nav > summary {
    cursor: pointer;
    list-style: none;
    color: var(--accent);
    font-size: 13px;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: 10px;
  }

  .mobile-nav > summary::-webkit-details-marker {
    display: none;
  }

  .mobile-nav nav {
    position: absolute;
    right: 0;
    top: 100%;
    width: min(300px, 85vw);
    max-height: 75vh;
    overflow-y: auto;
    padding: 18px;
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: 0 12px 28px rgba(0,0,0,.35);
  }

  .mobile-nav nav > a,
  .mobile-nav .nav-dropdown > summary {
    display: block;
    padding: 13px 8px;
    color: var(--text);
    text-decoration: none;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .08em;
  }

  .mobile-nav .dropdown-content {
    position: static;
    box-shadow: none;
    border: none;
    border-left: 1px solid var(--accent);
    margin-left: 10px;
    padding: 4px 8px;
  }

  .mobile-nav a:hover,
  .mobile-nav summary:hover {
    color: var(--accent);
  }
}

/* ===== ARTIST LOGIN FOOTER LINK ===== */
.site-footer .artist-footer-login { color: var(--muted); text-decoration: none; font-size: 11px; letter-spacing: .04em; white-space: nowrap; }
.site-footer .artist-footer-login:hover, .site-footer .artist-footer-login:focus-visible { color: var(--accent); text-decoration: underline; }
.site-footer { flex-wrap: wrap; gap: 12px 24px; }
/* ===== COLLECT ART FOOTER SPACING ===== */
.collect-site-footer { margin-top: 50px; padding-bottom: 38px; }

/* ===== HOMEPAGE NEWSLETTER SIGNUP CSS ===== */
.newsletter-signup { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(24px,5vw,80px); align-items:center; padding:clamp(42px,6vw,92px) 6%; margin:30px auto 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--surface); }
.newsletter-signup h2 { margin:12px 0 18px; font-size:clamp(30px,4vw,58px); line-height:1.1; }
.newsletter-signup__copy p { max-width:460px; color:var(--muted); line-height:1.7; }
.newsletter-signup__form label { display:block; margin-bottom:10px; font-size:12px; letter-spacing:.07em; text-transform:uppercase; }
.newsletter-signup__fields { display:flex; gap:10px; }
.newsletter-signup__fields input { flex:1; min-width:0; padding:14px 16px; color:var(--text); background:var(--bg); border:1px solid var(--line); border-radius:0; font:inherit; }
.newsletter-signup__fields button { padding:14px 22px; border:1px solid var(--line); background:var(--accent); color:var(--bg); font:inherit; font-weight:600; cursor:not-allowed; opacity:.6; }
.newsletter-signup__note { color:var(--muted); font-size:12px; line-height:1.6; margin-top:12px; }
.site-footer .newsletter-footer-link { color:var(--muted); text-decoration:none; font-size:11px; letter-spacing:.04em; }
.site-footer .newsletter-footer-link:hover, .site-footer .newsletter-footer-link:focus-visible { color:var(--accent); text-decoration:underline; }
@media(max-width:720px) { .newsletter-signup { grid-template-columns:1fr; } .newsletter-signup__fields { flex-direction:column; } .newsletter-signup__fields button { width:100%; } }
/* ===== END NEWSLETTER SIGNUP CSS ===== */


/* ===== Newsletter Floating Notification ===== */
.newsletter-toast[hidden] { display: none !important; }
.newsletter-toast {
  position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 9999;
  display: flex; align-items: flex-start; gap: 1rem;
  width: min(390px, calc(100vw - 2rem)); padding: 1.15rem 1.25rem;
  background: #22201e; color: #f7f2e9; border: 1px solid #a99570;
  border-radius: 10px; box-shadow: 0 12px 38px rgba(0,0,0,.35);
}
.newsletter-toast__content { flex: 1; }
.newsletter-toast__title { display: block; font-size: 1.05rem; margin-bottom: .4rem; }
.newsletter-toast__message { margin: 0; line-height: 1.5; font-size: .93rem; }
.newsletter-toast__close { border: 0; background: transparent; color: inherit; cursor: pointer; font-size: 1.65rem; line-height: 1; padding: 0 .2rem; }
.newsletter-toast__close:focus-visible { outline: 2px solid #e3c48d; outline-offset: 3px; }
.newsletter-toast--error { border-color: #d49a91; }
@media (max-width: 480px) { .newsletter-toast { right: 1rem; bottom: 1rem; } }