/* Generated by build.py from Claude Design's export — tokens copied verbatim from tokens/*.css */
/* Fraunces (variable, opsz 9–144) + Inter (variable) — self-hosted from Google Fonts, latin + latin-ext */
@font-face{font-family:'Fraunces';font-style:italic;font-weight:300 600;font-display:swap;src:url('/assets/fonts/Fraunces-italic-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:300 600;font-display:swap;src:url('/assets/fonts/Fraunces-italic-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 600;font-display:swap;src:url('/assets/fonts/Fraunces-normal-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 600;font-display:swap;src:url('/assets/fonts/Fraunces-normal-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 600;font-display:swap;src:url('/assets/fonts/Inter-normal-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 600;font-display:swap;src:url('/assets/fonts/Inter-normal-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
/* Esmée Peets — colour. Deep aubergine canvas + saturated pigment accents. Source: esmee-peets-site/assets/styles.css + design-tokens.json */
:root{
  /* canvas */
  --bg:#140f1c;
  --bg-soft:#1c1527;
  --surface:#241b34;
  --surface-2:#2c2140;
  --bg-deep:#0c0911;
  --line:rgba(246,239,228,0.12);
  /* ink */
  --ink:#f6efe4;
  --ink-dim:#c8bcd6;
  --ink-faint:#8d80a1;
  /* pigment accents (v1) */
  --coral:#ff6b52;
  --gold:#f2b544;
  --violet:#9b7bff;
  --teal:#34d7b9;
  --rose:#ff8fb1;
  /* signature accent — re-weighted from Esmée's grade 12 acrylic series (design-tokens.json) */
  --berry:#a8477a;
  --rose-dust:#e1acb1;
  --mauve:#c08594;

  /* semantic */
  --surface-page:var(--bg);
  --surface-soft:var(--bg-soft);
  --surface-card:var(--surface);
  --surface-hover:var(--surface-2);
  --surface-header:rgba(20,15,28,0.72);
  --surface-scrim:rgba(12,9,17,0.92);
  --surface-glass:rgba(246,239,228,0.08);
  --border-subtle:var(--line);
  --text-heading:var(--ink);
  --text-body:var(--ink-dim);
  --text-meta:var(--ink-faint);
  --text-on-light:var(--bg);
  --text-ph-label:rgba(20,15,28,0.75);
  --accent-primary:var(--coral);
  --accent-signature:var(--berry);
  --accent-underline:var(--gold);
  --accent-email:var(--gold);
  --accent-separator:var(--gold);
  --cursor-dot:var(--gold);
  --selection-bg:var(--coral);

  /* hero mesh — four drifting radial washes */
  --grad-1:radial-gradient(circle at 20% 20%, rgba(255,107,82,0.55), transparent 55%); /* @kind color */
  --grad-2:radial-gradient(circle at 80% 30%, rgba(155,123,255,0.5), transparent 55%); /* @kind color */
  --grad-3:radial-gradient(circle at 50% 80%, rgba(52,215,185,0.4), transparent 55%); /* @kind color */
  --grad-4:radial-gradient(circle at 85% 85%, rgba(242,181,68,0.4), transparent 55%); /* @kind color */
  /* signature mesh — berry / rose / violet, closer to the real paintings */
  --grad-sig-1:radial-gradient(circle at 20% 25%, rgba(168,71,122,0.7), transparent 55%); /* @kind color */
  --grad-sig-2:radial-gradient(circle at 80% 30%, rgba(255,143,177,0.45), transparent 55%); /* @kind color */
  --grad-sig-3:radial-gradient(circle at 45% 85%, rgba(155,123,255,0.4), transparent 55%); /* @kind color */
  --grad-sig-4:radial-gradient(circle at 88% 85%, rgba(255,107,82,0.35), transparent 55%); /* @kind color */

  /* artwork placeholders (135°) */
  --ph-1:linear-gradient(135deg, #ff6b52, #f2b544); /* @kind color */
  --ph-2:linear-gradient(135deg, #9b7bff, #34d7b9); /* @kind color */
  --ph-3:linear-gradient(135deg, #f2b544, #ff8fb1); /* @kind color */
  --ph-4:linear-gradient(135deg, #34d7b9, #9b7bff); /* @kind color */
  --ph-5:linear-gradient(135deg, #ff8fb1, #ff6b52); /* @kind color */
  --ph-6:linear-gradient(135deg, #f2b544, #34d7b9); /* @kind color */
  --ph-7:linear-gradient(135deg, #ff6b52, #9b7bff); /* @kind color */
  --ph-8:linear-gradient(135deg, #34d7b9, #f2b544); /* @kind color */
  --ph-portrait:linear-gradient(160deg, #2c2140, #ff6b52 140%); /* @kind color */

  /* page-transition curtain panels (160°) */
  --curtain-1:linear-gradient(160deg, var(--coral), var(--violet)); /* @kind color */
  --curtain-2:linear-gradient(160deg, var(--gold), var(--coral)); /* @kind color */
  --curtain-3:linear-gradient(160deg, var(--teal), var(--violet)); /* @kind color */
  --curtain-4:linear-gradient(160deg, var(--rose), var(--gold)); /* @kind color */
}
/* Fraunces (serif display) + Inter (sans body) */
:root{
  --serif:'Fraunces', Georgia, serif;
  --sans:'Inter', -apple-system, sans-serif;
  --font-display:var(--serif);
  --font-body:var(--sans);

  --fs-hero:clamp(3.2rem, 9vw, 8rem);
  --fs-contact:clamp(2.6rem, 8vw, 6rem);
  --fs-h1:clamp(2.6rem, 6vw, 4.4rem);
  --fs-about-h1:clamp(2.4rem, 5vw, 3.6rem);
  --fs-footer-cta:clamp(2rem, 5vw, 3.4rem);
  --fs-h2:clamp(1.8rem, 3.4vw, 2.6rem);
  --fs-split-h2:clamp(1.8rem, 3vw, 2.4rem);
  --fs-statement:clamp(1.6rem, 3.4vw, 2.6rem);
  --fs-email:clamp(1.4rem, 3vw, 2rem);
  --fs-lightbox-title:1.8rem;
  --fs-bio-lead:1.3rem;
  --fs-marquee:1.3rem;
  --fs-wordmark:1.25rem;
  --fs-lead:1.05rem;
  --fs-work-title:1.05rem;
  --fs-body:1rem;
  --fs-cv:.92rem;
  --fs-small:.9rem;
  --fs-nav:.85rem;
  --fs-btn:.82rem;
  --fs-lightbox-meta:.82rem;
  --fs-footer:.8rem;
  --fs-meta:.78rem;
  --fs-pill:.78rem;
  --fs-eyebrow:.72rem;
  --fs-ph-label:.68rem;
  --fs-cursor:.65rem;

  --fw-light:300; /* @kind font */
  --fw-regular:400; /* @kind font */
  --fw-heading:500; /* @kind font */
  --fw-semibold:600; /* @kind font */

  --lh-body:1.6; /* @kind font */
  --lh-heading:1.05; /* @kind font */

  --tr-heading:-0.01em; /* @kind font */
  --tr-wordmark:0.02em; /* @kind font */
  --tr-eyebrow:0.28em; /* @kind font */
  --tr-cue:.2em; /* @kind font */
  --tr-cursor:.18em; /* @kind font */
  --tr-ph-label:.12em; /* @kind font */
  --tr-btn:.08em; /* @kind font */
  --tr-nav:.06em; /* @kind font */
  --tr-pill:.06em; /* @kind font */
}
/* Layout + spacing — exact values from the v1 site (rem-based, vw gutters) */
:root{
  --gutter:6vw; /* @kind spacing */
  --gutter-mobile-nav:8vw; /* @kind spacing */
  --max-w:1240px; /* @kind spacing */
  --max-w-lightbox:1100px; /* @kind spacing */
  --max-w-contact:780px; /* @kind spacing */

  --section-y:7rem; /* @kind spacing */
  --page-head-top:9rem; /* @kind spacing */
  --contact-head-top:10rem; /* @kind spacing */
  --header-y:1.6rem; /* @kind spacing */
  --header-y-scrolled:1rem; /* @kind spacing */

  --space-3xs:.2rem;
  --space-2xs:.5rem;
  --space-xs:.6rem;
  --space-sm:.9rem;
  --space-md:1.1rem;
  --space-lg:1.6rem;
  --space-xl:2rem;
  --space-2xl:2.4rem;
  --space-3xl:3rem;
  --space-4xl:4rem;

  --grid-gap:1.8rem; /* @kind spacing */
  --strip-gap:1.6rem; /* @kind spacing */
  --split-gap:4rem; /* @kind spacing */

  --radius-sm:6px;
  --radius-md:10px;
  --radius-pill:999px;

  --ratio-art:4/5; /* @kind other */
  --ratio-portrait:3/4; /* @kind other */

  --hit-round:44px; /* @kind spacing */
  --z-header:500; /* @kind other */
  --z-lightbox:800; /* @kind other */
  --z-grain:998; /* @kind other */
  --z-cursor:999; /* @kind other */
  --z-curtain:1000; /* @kind other */
}
/* Motion — long, soft deceleration. Nothing bounces. */
:root{
  --ease:cubic-bezier(.22,1,.36,1); /* @kind other */
  --ease-soft:cubic-bezier(.16,.84,.44,1); /* @kind other */
  --dur-micro:.25s; /* @kind other */
  --dur-hover:.35s; /* @kind other */
  --dur-nav:.5s; /* @kind other */
  --dur-reveal:.9s; /* @kind other */
  --dur-stagger:.8s; /* @kind other */
  --dur-curtain-in:.55s; /* @kind other */
  --dur-curtain-out:.6s; /* @kind other */
  --dur-mesh:22s; /* @kind other */
  --dur-marquee:28s; /* @kind other */
  --reveal-y:28px; /* @kind spacing */
  --stagger-step:.07s; /* @kind other */
}
@keyframes ep-mesh-drift{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-2%,3%,0) scale(1.08)}100%{transform:translate3d(3%,-2%,0) scale(1.02)}}
@keyframes ep-rise{from{transform:translateY(110%)}to{transform:translateY(0)}}
@keyframes ep-fade-up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes ep-cue-drip{0%{top:-100%}60%{top:100%}100%{top:100%}}
@keyframes ep-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes ep-curtain-in{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes ep-curtain-out{from{transform:scaleY(1)}to{transform:scaleY(0)}}
@keyframes ep-pop{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){:root{--dur-mesh:0s;--dur-marquee:0s}}
/* page styles (dc <helmet>) */
html,body{margin:0;background:#140f1c;color:#f6efe4;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
::selection{background:var(--coral);color:var(--bg)}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--gold)}
body.ep-cursor,body.ep-cursor *{cursor:none!important}
input,textarea,button{font:inherit;color:inherit}
/* dc runtime rules */
html,body{height:100%;margin:0}#dc-root,#dc-root>.sc-host{height:100%}
@media print{@page{margin:.5cm}figure,table{break-inside:avoid}#dc-root,#dc-root>.sc-host{height:auto}*,::before,::after{print-color-adjust:exact;backdrop-filter:none!important;animation-delay:-99s!important;animation-duration:.001s!important;animation-iteration-count:1!important;animation-fill-mode:both!important;animation-play-state:running!important;transition-duration:0s!important}}
.scp0:hover{color:var(--ink) !important}
.scp1:hover{background:var(--gold) !important;color:var(--bg) !important}
.scp2:hover{background:var(--surface-2) !important}
.scp3:hover{transform:scale(1.05) !important}
.scp4:hover{transform:scale(1.06) !important;filter:saturate(1.1) brightness(.95) !important}
.scp5:hover{background:var(--ink) !important;color:var(--bg) !important}
.scp6:hover{border-color:var(--ink-faint) !important;color:var(--ink) !important}
.scp7:hover{transform:scale(1.04) !important}
.scp8:hover{color:var(--ink) !important;border-color:var(--ink-faint) !important}
.scp9:focus{border-bottom-color:var(--gold) !important}
.scpa:hover{background:var(--gold) !important}
/* store: sold / reserved cards (handoff spec) — muted status label; sold artwork at 60% */
article[data-status="sold"] img{opacity:.6}
article[data-status="sold"]>div:nth-child(2)>div:last-child,article[data-status="reserved"]>div:nth-child(2)>div:last-child{color:var(--ink-faint)!important}
/* narrow phones: 4 nav links + wordmark on one row; nav wraps below rather than overflowing */
@media (max-width:520px){header{flex-wrap:wrap!important;row-gap:.5rem!important;column-gap:.75rem!important}header>a{white-space:nowrap;font-size:1.1rem!important}header>nav{gap:.7rem!important;font-size:.7rem!important;letter-spacing:.04em!important}}
/* arriving from an internal link: curtain starts closed (no flash before site.js runs) */
html.ep-arrive [data-curtain]>span{transform:scaleY(1)!important}
