:root{--cream:#E5DECA;--card:#F2EDDD;--ocean:#7E9DA2;--sage:#9DAF8E;--avocado:#898433;--olive:#45441A;--ink:#282C15}
*{box-sizing:border-box;margin:0;padding:0}
body{color:var(--ink);font-family:'Jost','Futura',-apple-system,sans-serif;font-weight:300;-webkit-font-smoothing:antialiased;
background:
 radial-gradient(1500px 820px at 50% -8%, rgba(255,250,240,.9), transparent 62%),
 radial-gradient(1150px 700px at 50% 15%, rgba(237,158,138,.36), transparent 68%),
 radial-gradient(2000px 1200px at 50% 12%, rgba(199,212,168,.26), transparent 74%),
 linear-gradient(180deg, #EFE8D4 0%, var(--cream) 40%, #DDD2B6 100%);
background-attachment:fixed}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.05;z-index:0;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E")}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
background:radial-gradient(130% 100% at 50% 40%, transparent 58%, rgba(140,96,58,.09) 86%, rgba(96,66,38,.14) 100%)}
.wrap{position:relative;z-index:1}
.sans{font-family:'Jost','Futura',-apple-system,sans-serif}
.wrap{max-width:1180px;margin:0 auto;padding:0 22px}
.topnav{display:flex;align-items:center;justify-content:space-between;padding:26px 0 10px;flex-wrap:wrap;gap:12px}
.brandline{display:flex;align-items:center;gap:14px}
.brandline .word{font-family:'Jost',sans-serif;font-weight:300;font-size:17px;letter-spacing:5px;text-transform:lowercase}
.navlinks{display:flex;gap:5px 16px;flex-wrap:wrap;max-width:760px;justify-content:flex-end}
.navlinks a{font-family:'Jost',sans-serif;font-weight:300;font-size:9.5px;letter-spacing:2px;text-decoration:none;color:var(--olive);line-height:2}
.navlinks a:hover,.navlinks a.here{color:var(--ink);border-bottom:1px solid var(--avocado)}
header.hero{text-align:center;padding:50px 0 10px}
.heroart{position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate}
.display{position:relative;font-family:'Jost',sans-serif;font-weight:300;font-size:clamp(46px,9vw,104px);letter-spacing:.22em;text-transform:lowercase;line-height:1;margin-right:-.22em;
color:var(--olive)}
.display em{font-style:italic;font-weight:300;letter-spacing:.06em}
h1{font-family:'Jost',sans-serif;font-weight:300;font-size:clamp(13px,1.8vw,17px);letter-spacing:.5em;line-height:1.5;color:var(--olive);text-transform:uppercase;margin-top:20px}
.eyebrow{font-family:'Jost',sans-serif;font-weight:300;font-size:11px;letter-spacing:5px;color:var(--avocado);margin-bottom:20px;text-transform:uppercase}
.intro{max-width:600px;margin:16px auto 0;font-size:15px;line-height:1.75;letter-spacing:.04em;color:#4a4a2e}
.disclosure{font-family:'Jost',sans-serif;font-size:10.5px;letter-spacing:.6px;color:var(--ocean);margin:16px 0 0}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(252px,1fr));gap:24px;padding-bottom:60px}
.card{background:linear-gradient(180deg, rgba(255,253,246,.9) 0%, rgba(248,242,226,.78) 100%);backdrop-filter:blur(6px);border:1px solid rgba(69,68,26,.10);border-top-color:rgba(255,255,252,.9);border-radius:12px;padding:20px;display:flex;flex-direction:column;transition:transform .3s ease, box-shadow .3s ease;box-shadow:inset 0 1px 0 rgba(255,255,255,.75), 0 1px 2px rgba(69,68,26,.08), 0 14px 38px rgba(96,84,40,.13)}
.card:hover{transform:translateY(-4px);box-shadow:inset 0 1px 0 rgba(255,255,255,.8), 0 2px 4px rgba(69,68,26,.08), 0 30px 60px rgba(96,84,40,.20), 0 0 0 5px rgba(228,148,128,.18)}
.imgwrap{background:radial-gradient(80% 90% at 50% 40%, #FFFEF8 0%, #F3ECD7 78%, #EBE2C8 100%);border-radius:8px;height:206px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;box-shadow:inset 0 2px 10px rgba(120,104,52,.10), inset 0 -1px 0 rgba(255,255,255,.7)}
.imgwrap img{max-width:86%;max-height:194px;object-fit:contain;mix-blend-mode:multiply}
.chip{font-family:'Jost',sans-serif;font-size:9.5px;letter-spacing:2.6px;color:var(--ocean);margin-bottom:7px}
.brand{font-family:'Jost',sans-serif;font-size:13px;letter-spacing:1.2px;text-transform:uppercase}
.pname{font-family:'Jost',sans-serif;font-weight:300;font-size:14px;letter-spacing:.05em;margin:3px 0 14px;color:#3c3c22}
.swaps{font-family:'Jost',sans-serif;font-weight:300;font-style:italic;font-size:12px;letter-spacing:.04em;color:var(--avocado);margin-bottom:8px;min-height:17px}
.blurb{font-family:'Jost',sans-serif;font-weight:300;font-size:13px;line-height:1.65;letter-spacing:.02em;color:#55553a;flex:1;margin-bottom:14px}
.shopbtn{font-family:'Jost',sans-serif;margin-top:auto;padding-top:12px;text-align:center;background:linear-gradient(180deg, #545226 0%, #45441A 60%, #3B3A15 100%);color:var(--cream);text-decoration:none;border-radius:999px;padding:12px 0;box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 8px 20px rgba(69,68,26,.22);margin-top:auto;font-size:11px;letter-spacing:2.4px;transition:box-shadow .25s, transform .25s}
.shopbtn:hover{background:var(--ink)}
.crosslinks{border-top:1px solid #d8cfb4;padding:34px 0 8px;text-align:center}
.crosslinks p{font-family:'Jost',sans-serif;font-size:10px;letter-spacing:3px;color:var(--avocado);margin-bottom:14px}
.crosslinks nav{display:flex;gap:10px 26px;justify-content:center;flex-wrap:wrap}
.crosslinks a{font-family:'Jost',sans-serif;font-weight:300;font-size:12px;letter-spacing:2.4px;text-transform:uppercase;color:var(--olive);text-decoration:none}
.crosslinks a:hover{color:var(--ink)}
footer{padding:26px 0 44px;text-align:center;font-family:'Jost',sans-serif;font-size:10.5px;letter-spacing:.8px;color:var(--ocean)}

.filters{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:0 0 30px}
.filters select,.filters button{font-family:'Jost',sans-serif;font-weight:300;font-size:11px;letter-spacing:1.8px;color:var(--olive);background:rgba(251,248,238,.8);backdrop-filter:blur(4px);border:1px solid rgba(69,68,26,.14);border-radius:999px;padding:11px 22px;cursor:pointer;appearance:none;-webkit-appearance:none;transition:border-color .2s, box-shadow .2s;text-align:center;text-align-last:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.7), 0 4px 12px rgba(96,84,40,.08)}
.filters select:hover,.filters button:hover{border-color:var(--avo);box-shadow:0 6px 18px rgba(69,68,26,.08)}
.filters button{letter-spacing:2.4px}


/* ---- masthead ---- */
.masthead{position:relative;z-index:2;background:rgba(253,250,243,.92);backdrop-filter:blur(8px);box-shadow:0 1px 0 rgba(69,68,26,.08)}
.brandcenter{text-align:center;padding:30px 20px 16px}
.brandcenter .word{font-family:'Jost',sans-serif;font-weight:300;font-size:24px;letter-spacing:8px;text-transform:lowercase;color:var(--ink)}
.tagline{font-family:'Jost',sans-serif;font-size:10.5px;letter-spacing:5px;color:var(--ocean);text-transform:uppercase;margin:10px 0 16px}
.tabstrip{border-top:1px solid rgba(69,68,26,.10)}
.tabstrip .grouptabs{display:flex;justify-content:center;flex-wrap:wrap;gap:0;max-width:1180px;margin:0 auto}
.tabstrip .grouptabs a{font-family:'Jost',sans-serif;font-weight:300;font-size:11px;letter-spacing:2.6px;color:var(--olive);text-decoration:none;
 background:transparent;border:none;border-left:1px solid rgba(69,68,26,.10);border-radius:0;box-shadow:none;padding:16px 24px;transition:color .2s,background .2s}
.tabstrip .grouptabs a:first-child{border-left:none}
.tabstrip .grouptabs a:hover{color:var(--ink);background:rgba(157,175,142,.08)}
.tabstrip .grouptabs a.here{color:var(--ink);background:rgba(157,175,142,.14);box-shadow:inset 0 -2px 0 var(--avocado)}

/* ---- full-bleed glow banner ---- */
.banner{position:relative;overflow:hidden;width:100%;padding:64px 22px 52px;
 background:
  radial-gradient(64% 36% at 50% 40%, rgba(255,243,212,.8), transparent 72%),
  linear-gradient(180deg,#F4ECD4 0%,#EBDFBF 46%,#E2D2AC 100%);
 box-shadow:inset 0 14px 34px rgba(96,84,40,.07), inset 0 -18px 40px rgba(96,74,36,.12)}
.banner::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
 background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221400%22%20height%3D%22600%22%3E%3Cfilter%20id%3D%22w%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.0028%200.042%22%20numOctaves%3D%223%22%20seed%3D%2211%22%2F%3E%3CfeColorMatrix%20values%3D%220%200%200%200%201%20%200%200%200%200%200.98%20%200%200%200%200%200.93%20%200.55%200.55%200.55%200%20-0.5%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url%28%23w%29%22%2F%3E%3C%2Fsvg%3E");background-size:180% 105%;
 mix-blend-mode:soft-light;opacity:.95;animation:flow1 26s linear infinite alternate}
.banner::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
 background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221400%22%20height%3D%22600%22%3E%3Cfilter%20id%3D%22w%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.0016%200.03%22%20numOctaves%3D%222%22%20seed%3D%224%22%2F%3E%3CfeColorMatrix%20type%3D%22saturate%22%20values%3D%220%22%2F%3E%3CfeComponentTransfer%3E%3CfeFuncA%20type%3D%22linear%22%20slope%3D%220.85%22%20intercept%3D%220%22%2F%3E%3C%2FfeComponentTransfer%3E%3C%2Ffilter%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url%28%23w%29%22%2F%3E%3C%2Fsvg%3E");background-size:240% 130%;
 mix-blend-mode:overlay;opacity:.42;animation:flow2 38s linear infinite alternate}
@keyframes flow1{from{background-position:0% 30%}to{background-position:100% 60%}}
@keyframes flow2{from{background-position:100% 70%}to{background-position:0% 30%}}
@media (prefers-reduced-motion: reduce){.banner::before,.banner::after{animation:none}}
.bansky{position:absolute;inset:-30%;pointer-events:none}
.bansky i{position:absolute;border-radius:50%;filter:blur(52px);will-change:transform,opacity;display:block}
.bansky .b1{width:52%;height:74%;left:28%;top:12%;
 background:radial-gradient(closest-side, rgba(238,150,130,.5), rgba(238,150,130,0));
 animation:bdrift1 18s ease-in-out infinite alternate}
.bansky .b2{width:62%;height:96%;left:-14%;top:-14%;
 background:radial-gradient(closest-side, rgba(202,210,158,.46), rgba(196,212,160,0));
 animation:bdrift2 24s ease-in-out infinite alternate}
.bansky .b3{width:48%;height:78%;right:-10%;top:18%;
 background:radial-gradient(closest-side, rgba(255,236,208,.66), rgba(255,236,212,0));
 animation:bdrift3 21s ease-in-out infinite alternate}
.bansky .b4{width:30%;height:52%;left:44%;top:48%;
 background:radial-gradient(closest-side, rgba(236,168,148,.48), rgba(236,168,148,0));
 animation:bdrift4 15s ease-in-out infinite alternate}
@keyframes bdrift1{0%{transform:translate(-14%,4%) scale(.9);opacity:.55}100%{transform:translate(18%,-8%) scale(1.28);opacity:.95}}
@keyframes bdrift2{0%{transform:translate(2%,6%) scale(1.12);opacity:.9}100%{transform:translate(20%,-10%) scale(.86);opacity:.5}}
@keyframes bdrift3{0%{transform:translate(6%,12%) scale(.92);opacity:.6}100%{transform:translate(-18%,-6%) scale(1.24);opacity:1}}
@keyframes bdrift4{0%{transform:translate(-12%,10%) scale(.85);opacity:.4}100%{transform:translate(14%,-12%) scale(1.18);opacity:.8}}
@media (prefers-reduced-motion: reduce){.bansky i{animation:none}}
.bancontent{max-width:1180px;margin:0 auto;text-align:center}

/* ---- banner search + pills ---- */
.bansearch{display:flex;max-width:780px;margin:34px auto 0;border-radius:999px;overflow:hidden;
 box-shadow:0 20px 48px rgba(96,84,40,.20), inset 0 1px 0 rgba(255,255,255,.8)}
.bansearch input{flex:1;min-width:0;border:none;outline:none;padding:19px 28px;background:#FFFDF6;color:var(--ink);
 font-family:'Jost',sans-serif;font-weight:300;font-size:14.5px;letter-spacing:.06em}
.bansearch input::placeholder{color:#9a936f}
.bansearch button{border:none;cursor:pointer;background:linear-gradient(180deg,#545226,#3B3A15);color:var(--cream);
 font-family:'Jost',sans-serif;font-size:12px;letter-spacing:2.6px;padding:0 36px}
.banpills{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:24px}
.banpills .bp{font-family:'Jost',sans-serif;font-weight:300;font-size:12.5px;letter-spacing:1.6px;text-decoration:none;border-radius:999px;padding:13px 28px;transition:transform .2s, box-shadow .2s}
.banpills .solid{background:rgba(255,253,246,.85);color:var(--olive);box-shadow:0 10px 26px rgba(96,84,40,.14)}
.banpills .line{border:1px solid rgba(69,68,26,.35);color:var(--olive)}
.banpills .bp:hover{transform:translateY(-2px)}

.bancontent{position:relative;z-index:1}

/* ---- group tabs ---- */
.grouptabs{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;max-width:820px}
.grouptabs a{font-family:'Jost',sans-serif;font-weight:300;font-size:10.5px;letter-spacing:2.4px;text-decoration:none;color:var(--olive);
 background:rgba(251,248,238,.6);backdrop-filter:blur(4px);border:1px solid rgba(69,68,26,.15);border-radius:999px;padding:9px 18px;
 transition:background .25s,color .25s,border-color .25s;box-shadow:inset 0 1px 0 rgba(255,255,255,.65), 0 3px 10px rgba(96,84,40,.07)}
.grouptabs a:hover{border-color:var(--avocado)}
.grouptabs a.here{background:var(--olive);color:var(--cream);border-color:var(--olive);box-shadow:0 8px 20px rgba(69,68,26,.22)}

/* ---- the favorites ---- */
.faves{text-align:center;margin:26px 0 30px}
.faves .eyebrow{margin-bottom:8px}
.favetitle{font-family:'Jost',sans-serif;font-weight:300;font-size:clamp(20px,3vw,30px);letter-spacing:.14em;color:var(--olive);text-transform:lowercase;margin-bottom:22px}
.faverow{display:grid;grid-auto-flow:column;grid-auto-columns:min(292px,80vw);gap:22px;overflow-x:auto;padding:8px 6px 18px;scroll-snap-type:x proximity;text-align:left}
.faverow::-webkit-scrollbar{height:6px}
.faverow::-webkit-scrollbar-thumb{background:rgba(137,132,51,.25);border-radius:3px}
.faverow .card{scroll-snap-align:center;border-color:rgba(137,132,51,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.8), 0 1px 2px rgba(69,68,26,.08), 0 18px 44px rgba(96,84,40,.16)}
.faverow .chip::before{content:"\2605  ";color:#CE9070;font-size:9px}