/* Goodboy Gallery R16 design system: tokens, chrome, buttons and shared motion.
   Motion vocabulary carried over from the live goodboygallery.co theme (goodest-foundation.css):
   breathing atmosphere, rising hero copy and the card shine sweep. */
@font-face{font-family:Figtree;src:url('/assets/fonts/figtree.ttf') format('truetype');font-style:normal;font-weight:300 900;font-display:swap}
@font-face{font-family:Figtree;src:url('/assets/fonts/figtree-italic.ttf') format('truetype');font-style:italic;font-weight:300 900;font-display:swap}
@font-face{font-family:Fraunces;src:url('/assets/fonts/fraunces.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:Fraunces;src:url('/assets/fonts/fraunces-italic.ttf') format('truetype');font-style:italic;font-weight:100 900;font-display:swap}

:root{
  --cream:#f6efe4; --paper:#fbf7f0; --sand:#ece2d2; --ink:#16110d; --ink-2:#3b3027; --muted:#776a5c;
  --line:rgba(22,17,13,.12); --line-2:rgba(22,17,13,.22); --rust:#8c4a2b; --gold:#b8924d; --gold-soft:#d9c196;
  --night:#120e0b;
  --disp:Fraunces,'Iowan Old Style',Georgia,serif; --sans:Figtree,system-ui,-apple-system,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.22,1,.36,1); --ease-out:cubic-bezier(.16,1,.3,1);
  --r-sm:10px; --r:18px; --r-lg:28px;
  --shadow-lift:0 2px 6px rgba(22,17,13,.06),0 28px 56px -18px rgba(22,17,13,.28);
  --gutter:clamp(16px,4vw,56px); --max:1320px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html[data-text=lg]{font-size:112.5%}
body{margin:0;background:var(--cream);color:var(--ink);font:400 1rem/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--rust);outline-offset:3px;border-radius:6px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:10px 16px;border-radius:999px;text-decoration:none}
.skip:focus{top:12px}
.v-wrap{width:min(100% - var(--gutter)*2,var(--max));margin-inline:auto}

/* ---- Type ---- */
.v-eyebrow{font:600 .74rem/1.2 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin:0 0 14px}
.v-eyebrow.on-dark{color:rgba(255,248,238,.72)}
.v-display,.v-h2,.v-h3{font-family:var(--disp);font-variation-settings:'opsz' 144,'SOFT' 50;font-weight:560;letter-spacing:-.02em;line-height:.98;margin:0;text-wrap:balance}
.v-display{font-size:clamp(3rem,8.2vw,7.6rem)}
.v-h2{font-size:clamp(2.3rem,5.4vw,4.6rem)}
.v-h3{font-size:clamp(1.5rem,2.4vw,2.1rem);line-height:1.08}
.v-display em,.v-h2 em,.v-h3 em{font-style:italic;font-weight:480;color:var(--rust);font-variation-settings:'opsz' 144,'SOFT' 100}
.on-dark em{color:var(--gold-soft)}
.v-lede{font-size:clamp(1.05rem,1.4vw,1.25rem);line-height:1.55;color:var(--ink-2);max-width:38ch;margin:18px 0 0}
.v-fine{font-size:.86rem;color:var(--muted)}

/* ---- Buttons ---- */
.v-btn{--bg:var(--ink);--fg:#fff8ee;display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:0 1.6em;border-radius:999px;border:1.5px solid var(--bg);background:var(--bg);color:var(--fg);font:600 1rem/1 var(--sans);text-decoration:none;cursor:pointer;transition:transform .35s var(--ease),background .3s,color .3s,box-shadow .35s var(--ease);position:relative;overflow:hidden;isolation:isolate}
.v-btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.28) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s var(--ease);z-index:-1}
.v-btn:hover::after{transform:translateX(120%)}
.v-btn:hover{transform:translateY(-2px);box-shadow:0 14px 30px -14px rgba(22,17,13,.6)}
.v-btn:active{transform:translateY(0) scale(.98)}
.v-btn svg{width:1.15em;height:1.15em;flex:none;transition:transform .35s var(--ease)}
.v-btn:hover svg.arrow{transform:translateX(4px)}
.v-btn.light{--bg:#fff8ee;--fg:var(--ink)}
.v-btn.ghost{--bg:transparent;--fg:var(--ink);border-color:var(--line-2)}
.v-btn.ghost.on-dark{--fg:#fff8ee;border-color:rgba(255,248,238,.5)}
.v-btn.lg{min-height:62px;padding:0 2em;font-size:1.08rem}
.v-btn[disabled]{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
.v-link{display:inline-flex;align-items:center;gap:.45em;font-weight:600;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1.5px no-repeat;transition:background-size .45s var(--ease);padding-bottom:2px}
.v-link:hover{background-size:100% 1.5px}
.v-link svg{width:1em;height:1em;transition:transform .35s var(--ease)}
.v-link:hover svg{transform:translateX(3px)}

.h-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}

/* ---- Announcement + header ---- */
.v-announce{background:var(--night);color:#f1e7d8;text-align:center;font:500 .78rem/16px var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:9px 16px}
.v-announce b{color:var(--gold-soft);font-weight:600}
.v-header{position:sticky;top:0;z-index:50;transition:background .4s,box-shadow .4s,color .4s,backdrop-filter .4s}
.v-header-in{display:flex;align-items:center;gap:clamp(16px,3vw,40px);min-height:74px}
.v-logo{display:block;flex:none;line-height:0}
.v-logo img{height:58px;width:auto}
.v-logo .on-light{display:block}.v-logo .on-dark{display:none}
.v-nav{display:flex;gap:clamp(14px,2.2vw,30px);margin-right:auto}
.v-nav a{font:600 .82rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;padding:10px 0;background:linear-gradient(currentColor,currentColor) 0 100%/0 1.5px no-repeat;transition:background-size .45s var(--ease)}
.v-nav a:hover,.v-nav a[aria-current=page]{background-size:100% 1.5px}
.v-tools{display:flex;align-items:center;gap:8px;margin-left:auto}
.v-iconbtn{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:999px;border:0;background:transparent;cursor:pointer;text-decoration:none;position:relative;transition:background .3s}
.v-iconbtn:hover{background:rgba(22,17,13,.07)}
.v-iconbtn svg{width:22px;height:22px}
.v-count{position:absolute;top:4px;right:2px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:var(--rust);color:#fff;font:700 .7rem/19px var(--sans);text-align:center}
.v-count[data-n="0"]{display:none}
.v-menubtn{display:none}
.v-header{background:rgba(246,239,228,.86);backdrop-filter:saturate(1.4) blur(14px);box-shadow:0 1px 0 var(--line)}
/* Over a photo hero the header starts clear and light, then settles once scrolled. */
.v-header.over:not(.scrolled){background:transparent;backdrop-filter:none;box-shadow:none;color:#fff8ee}
@media (hover:none){.v-header{background:rgba(246,239,228,.97);-webkit-backdrop-filter:none;backdrop-filter:none}}
.v-header.over:not(.scrolled) .v-logo .on-light{display:none}
.v-header.over:not(.scrolled) .v-logo .on-dark{display:block}
.v-header.over:not(.scrolled) .v-iconbtn:hover{background:rgba(255,255,255,.14)}
.v-header.over{position:sticky;top:0;margin-bottom:-74px}
.v-sheet{position:fixed;inset:0;z-index:80;background:var(--cream);padding:24px var(--gutter);display:flex;flex-direction:column;gap:6px;transform:translateY(-100%);transition:transform .55s var(--ease);visibility:hidden}
.v-sheet.open{transform:none;visibility:visible}
.v-sheet a{font:500 2.2rem/1.2 var(--disp);text-decoration:none;padding:8px 0;border-bottom:1px solid var(--line)}
.v-sheet .close{align-self:flex-end;margin-bottom:18px}
@media (max-width:900px){.v-nav{display:none}.v-menubtn{display:inline-grid}.v-logo img{height:46px}.v-header-in{min-height:64px}.v-header.over{margin-bottom:-64px}}

/* ---- Reveal on scroll ---- */
[data-d="1"]{--d:1}[data-d="2"]{--d:2}[data-d="3"]{--d:3}[data-d="4"]{--d:4}[data-d="5"]{--d:5}[data-d="6"]{--d:6}[data-d="7"]{--d:7}[data-d="8"]{--d:8}
[data-dur="60"]{--dur:60s}[data-dur="70"]{--dur:70s}[data-dur="90"]{--dur:90s}
[data-reveal]{opacity:0;transform:translate3d(0,28px,0);transition:opacity .9s var(--ease-out),transform 1.1s var(--ease-out);transition-delay:calc(var(--d,0) * 90ms)}
[data-reveal=fade]{transform:none}
[data-reveal=scale]{transform:scale(.96)}
[data-reveal].in{opacity:1;transform:none}
.split-line{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.split-line>span{display:inline-block;transform:translateY(105%);transition:transform 1.1s var(--ease-out);transition-delay:calc(var(--d,0) * 110ms)}
.in .split-line>span,.split-line.in>span{transform:none}

/* ---- Atmosphere (live theme: gd-atmosphere-*) ---- */
.v-atmos{position:absolute;inset:-10%;pointer-events:none;background:radial-gradient(40% 50% at 20% 30%,rgba(255,214,150,.42),transparent 70%),radial-gradient(35% 40% at 85% 15%,rgba(255,236,200,.35),transparent 70%),radial-gradient(50% 45% at 50% 110%,rgba(140,74,43,.22),transparent 70%);animation:atmos-breathe 14s ease-in-out infinite;mix-blend-mode:soft-light}
@keyframes atmos-breathe{0%,100%{opacity:.58;transform:scale(1) translate3d(0,0,0)}50%{opacity:.95;transform:scale(1.08) translate3d(-1.4rem,.8rem,0)}}

/* ---- Card shine (live theme: gd-product-card-shine) ---- */
.v-shine{position:relative;overflow:hidden}
.v-shine::after{content:"";position:absolute;inset:-20% -40%;background:linear-gradient(100deg,transparent 35%,rgba(255,252,245,.55) 50%,transparent 65%);opacity:0;transform:translateX(-68%) skewX(-10deg);pointer-events:none}
@media (hover:hover){.v-shine:hover::after{animation:shine 1s var(--ease) both}}
@keyframes shine{0%{opacity:0;transform:translateX(-68%) skewX(-10deg)}38%{opacity:.75}100%{opacity:0;transform:translateX(68%) skewX(-10deg)}}

/* ---- Marquee ---- */
.v-marquee{overflow:hidden;white-space:nowrap;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.v-marquee-track{display:inline-flex;gap:0;animation:marquee var(--dur,48s) linear infinite}
.v-marquee:hover .v-marquee-track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---- Footer ---- */
.v-foot{background:var(--night);border-top:1px solid rgba(239,229,214,.1);color:#efe5d6;padding:clamp(56px,8vw,110px) 0 28px;position:relative;overflow:hidden}
.v-foot-mark{display:block;height:118px;width:auto;opacity:.96;margin:0 auto clamp(40px,5vw,64px)}
.v-foot-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:clamp(24px,4vw,64px)}
.v-foot h2{font:600 .74rem/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold-soft);margin:0 0 18px}
.v-foot ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.v-foot a{text-decoration:none;color:#efe5d6;opacity:.86}
.v-foot a:hover{opacity:1;text-decoration:underline}
.v-foot .tag{font:italic 500 clamp(1.6rem,2.6vw,2.4rem)/1.1 var(--disp);margin:0 0 14px}
.v-foot .tag em{color:var(--gold-soft)}
.v-foot-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;border-top:1px solid rgba(239,229,214,.16);margin-top:clamp(40px,6vw,72px);padding-top:22px;font-size:.84rem;opacity:.7}
.v-foot .textbtn{background:none;border:1px solid rgba(239,229,214,.3);color:inherit;border-radius:999px;padding:6px 14px;cursor:pointer}
@media (max-width:520px){.v-foot-mark{height:110px}}
@media (max-width:820px){.v-foot-grid{grid-template-columns:1fr 1fr}.v-foot-grid>div:first-child{grid-column:1/-1}}

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  [data-reveal],.split-line>span{opacity:1;transform:none}
}
