:root{
  --paper:#f6f3ec;--paper-2:#eee9de;--white:#fffdf9;--ink:#191f1c;--ink-2:#3a423d;--muted:#646c66;
  --line:#e0d9cc;--line-2:#cdc4b4;--forest:#1f3a2e;--forest-2:#15281f;--gold:#c08a2c;--gold-d:#9c6f1f;--gold-l:#f2a93b;
  --f-serif:'Gambetta',Georgia,serif;--f-sans:'General Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --t-xs:clamp(.75rem,.72rem + .12vw,.82rem);--t-sm:clamp(.88rem,.86rem + .12vw,.95rem);--t-base:clamp(1rem,.97rem + .15vw,1.08rem);
  --t-lg:clamp(1.12rem,1.04rem + .35vw,1.3rem);--t-xl:clamp(1.5rem,1.2rem + 1.3vw,2.25rem);--t-2xl:clamp(2.1rem,1.4rem + 2.8vw,3.9rem);
  --t-hero:clamp(2.8rem,1.4rem + 5vw,6.4rem);--r:22px;--max:1280px;--ease:cubic-bezier(.2,.8,.2,1);
  --shadow:0 1px 2px rgba(25,31,28,.05),0 18px 50px -20px rgba(25,31,28,.25)
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;font-family:var(--f-sans);font-size:var(--t-base);line-height:1.6;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--f-serif);font-weight:500;line-height:1.08;margin:0;letter-spacing:-.01em;text-wrap:balance}
p{margin:0}
.wrap{width:min(100% - 2.5rem,var(--max));margin-inline:auto}
svg{width:1.1em;height:1.1em;flex:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.eyebrow{font-size:var(--t-xs);font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-d);margin-bottom:.9rem}
.eyebrow.light{color:var(--gold-l)}

/* sample switcher bar */
.sbar{position:relative;z-index:60;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;padding:.55rem 1.25rem;background:#0f1a15;color:#d9e1db;font-size:var(--t-xs)}
.sbar .back{color:#fff;font-weight:500}.sbar .nm{opacity:.7}
.sbar nav{margin-left:auto;display:flex;gap:.35rem;flex-wrap:wrap}
.sbar nav a{padding:.25rem .7rem;border-radius:999px;border:1px solid rgba(255,255,255,.18)}
.sbar nav a.on{background:var(--gold-l);color:#1a140a;border-color:transparent;font-weight:600}
@media (max-width:640px){.sbar .nm{display:none}.sbar nav a{padding:.2rem .55rem}}

/* brand */
.brand{display:inline-flex;align-items:center;gap:.6rem;color:var(--forest)}
.brand svg{width:38px;height:38px}
.brand span{display:flex;flex-direction:column;line-height:1}
.brand b{font-weight:600;font-size:1.2rem;letter-spacing:-.01em;color:var(--ink)}
.brand small{font-size:.66rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);margin-top:.3rem}
.brand.on-dark{color:#fff}.brand.on-dark b{color:#fff}.brand.on-dark small{color:var(--gold-l)}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(246,243,236,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:1.5rem;height:74px}
.nav .links{display:flex;gap:1.8rem;margin-left:auto;font-size:var(--t-sm);font-weight:500;color:var(--ink-2)}
.nav .links a:hover{color:var(--ink)}
.nav .btn{margin-left:0}
@media (max-width:820px){.nav .links{display:none}.nav .btn{margin-left:auto}.nav .btn span{display:none}.nav .btn.sm{padding:.7rem}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;padding:.9rem 1.4rem;border-radius:999px;border:1px solid transparent;font-weight:500;font-size:var(--t-sm);cursor:pointer;white-space:nowrap;transition:transform .2s var(--ease),background .2s,border-color .2s}
.btn:hover{transform:translateY(-1px)}.btn:active{transform:none}
.btn.sm{padding:.65rem 1.05rem}
.btn.ink{background:var(--forest);color:#fff}.btn.ink:hover{background:var(--forest-2)}
.btn.gold{background:var(--gold-l);color:#1d150a}.btn.gold:hover{background:#e79b2c}
.btn.line{border-color:var(--line-2);background:transparent;color:var(--ink)}.btn.line:hover{border-color:var(--ink)}
.lnk{display:inline-flex;align-items:center;gap:.45rem;font-weight:500;font-size:var(--t-sm);color:var(--forest);border-bottom:1px solid currentColor;padding-bottom:2px}

/* listing card */
.card{background:var(--white);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.card .ph{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--paper-2)}
.card .ph img{width:100%;height:100%;object-fit:cover}
.card .tag{position:absolute;left:.8rem;top:.8rem;padding:.3rem .65rem;border-radius:999px;background:rgba(255,253,249,.92);font-size:.7rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.card .fav{position:absolute;right:.7rem;top:.7rem;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,253,249,.92);display:grid;place-items:center;cursor:pointer;color:var(--ink)}
.card .fav[aria-pressed=true]{color:#b23b3b}.card .fav[aria-pressed=true] svg{fill:currentColor}
.card .cb{padding:1rem 1.1rem 1.15rem}
.card .pr{font-family:var(--f-serif);font-size:1.5rem;font-weight:500;display:block;line-height:1.1}
.card .fx{display:flex;gap:.9rem;margin:.35rem 0 .45rem;font-size:var(--t-sm);color:var(--ink-2)}
.card .fx span+span{position:relative}
.card .ar{display:flex;align-items:center;gap:.35rem;font-size:var(--t-sm);color:var(--muted)}
.card[hidden]{display:none}

/* seller form */
.vform{display:grid;grid-template-columns:1fr 1fr;gap:1rem;background:var(--white);border-radius:var(--r);padding:clamp(1.3rem,3vw,2.2rem);box-shadow:var(--shadow);color:var(--ink)}
.vform .full{grid-column:1/-1}
.vform label{display:flex;flex-direction:column;gap:.4rem;font-size:var(--t-sm);font-weight:500}
.vform input,.vform select{width:100%;padding:.85rem 1rem;border-radius:12px;border:1px solid var(--line-2);background:#fff;font-size:1rem}
.vform input:focus,.vform select:focus{outline:2px solid var(--gold);outline-offset:0;border-color:transparent}
.vform .fnote{font-size:var(--t-xs);color:var(--muted);text-align:center}
.vform .fnote.ok{color:var(--forest);font-weight:500}
@media (max-width:560px){.vform{grid-template-columns:1fr}}

/* footer */
.ft{background:var(--forest-2);color:#c9d4cc;padding:3.5rem 0 2rem;margin-top:5rem;font-size:var(--t-sm)}
.ft-top{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;flex-wrap:wrap;padding-bottom:2rem;border-bottom:1px solid rgba(255,255,255,.1)}
.ft-c{display:flex;gap:1.5rem;flex-wrap:wrap}.ft-c a:hover{color:#fff}
.ft-b{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-top:1.4rem;color:#9fb3a6;font-size:var(--t-xs)}
.ft-b span{display:inline-flex;align-items:center;gap:.4rem}
.idx-note{margin-top:1.2rem;font-size:var(--t-xs);color:#7f958a;max-width:80ch}

/* listing grid: 4-up, 2-up, then a swipeable row on phones */
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.2rem}
@media (max-width:1080px){.grid4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.grid4{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:.9rem;margin-inline:-1.25rem;padding:0 1.25rem .5rem;scrollbar-width:none}
  .grid4::-webkit-scrollbar{display:none}.grid4>.card{flex:0 0 82%;scroll-snap-align:start}}
