@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,400;0,6..96,500;0,6..96,600;1,6..96,400&family=Pinyon+Script&family=Jost:wght@300;400;500&display=swap');
:root{--cream:#f6efe3;--paper:#fbf7ef;--olive:#3d4a2c;--bottle:#26372a;--ink:#16140f;--gold:#b8924a;--gold2:#d9bb7c;--rust:#a8532f;--navy:#1d2a4a;--line:rgba(22,20,15,.18)}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--paper);color:var(--ink);font-family:Jost,sans-serif;font-weight:300;font-size:17px;line-height:1.65}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.serif{font-family:'Bodoni Moda',serif}
.script{font-family:'Pinyon Script',cursive;font-weight:400}
.eyebrow{font-size:12px;letter-spacing:.32em;text-transform:uppercase;font-weight:500;color:var(--rust)}
.wrap{max-width:1240px;margin:0 auto;padding:0 48px}
/* announcement + nav */
.bar{background:var(--bottle);color:var(--gold2);text-align:center;font-size:12px;letter-spacing:.28em;text-transform:uppercase;padding:10px}
nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:18px 48px;border-bottom:1px solid var(--line);background:var(--paper)}
nav .l,nav .r{display:flex;gap:34px;font-size:13px;letter-spacing:.18em;text-transform:uppercase}
nav .r{justify-content:flex-end;align-items:center}
.brand{display:flex;flex-direction:column;align-items:center}
.brand img{width:64px;height:64px;border-radius:50%}
.btn{display:inline-block;padding:15px 30px;font-size:12.5px;letter-spacing:.24em;text-transform:uppercase;font-weight:500;border:1px solid var(--ink);transition:.2s}
.btn.solid{background:var(--ink);color:var(--cream)}
.btn.gold{background:var(--gold);border-color:var(--gold);color:#fff}
.btn.ghost-l{border-color:var(--gold2);color:var(--cream)}
.btn.sm{padding:10px 18px;font-size:11px}
/* divider */
.div{display:flex;align-items:center;gap:14px;color:var(--gold);margin:22px 0}
.div:before,.div:after{content:"";height:1px;background:currentColor;flex:1;opacity:.7}
.div i{width:8px;height:8px;border:1px solid currentColor;transform:rotate(45deg)}
.div.c{max-width:260px;margin-left:auto;margin-right:auto}
.div.l:before{flex:0 0 0}
/* titles */
.edit{line-height:.9}
.edit .script{display:block;font-size:64px;color:var(--rust);margin-bottom:-10px;padding-left:6px}
.edit .serif{font-size:104px;font-weight:500;letter-spacing:-.02em}
.hname{font-family:'Bodoni Moda';color:var(--rust);font-size:20px}
.hname b{font-weight:500}
h2.t{font-family:'Bodoni Moda';font-weight:400;font-size:52px;line-height:1.08;letter-spacing:-.01em}
h2.t em{font-style:italic;color:var(--olive)}
section{padding:120px 0}
/* hero */
.hero{display:grid;grid-template-columns:1.05fr 1fr;min-height:760px;background:var(--cream)}
.hero .copy{padding:110px 72px 90px 96px;display:flex;flex-direction:column;justify-content:center;position:relative}
.hero p.lead{font-size:19px;max-width:440px;margin:6px 0 38px;color:#3a362d}
.hero .imgs{position:relative;overflow:hidden}
.hero .imgs .a{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:30% 50%}
.hero .tag{position:absolute;left:-1px;bottom:48px;background:var(--paper);padding:20px 28px;border-left:3px solid var(--gold)}
.diya{position:absolute;top:44px;left:96px;font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--olive)}
.ctas{display:flex;gap:16px;align-items:center}
/* story */
.story{display:grid;grid-template-columns:420px 1fr;gap:96px;align-items:center}
.story .ph{position:relative}
.story .ph img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:saturate(.92)}
.story .ph:after{content:"";position:absolute;inset:18px -18px -18px 18px;border:1px solid var(--gold);z-index:-1}
.story blockquote{font-family:'Bodoni Moda';font-style:italic;font-size:34px;line-height:1.3;color:var(--olive);margin:24px 0}
.sig{font-family:'Pinyon Script';font-size:44px;color:var(--rust)}
/* why */
.dark{background:var(--bottle);color:var(--cream)}
.dark h2.t em{color:var(--gold2)}
.why{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(217,187,124,.35);margin-top:64px}
.why div{padding:40px 30px 10px 0;border-right:1px solid rgba(217,187,124,.2);margin-right:30px}
.why div:last-child{border:0}
.why .n{font-family:'Bodoni Moda';color:var(--gold2);font-size:15px;letter-spacing:.1em}
.why h3{font-family:'Bodoni Moda';font-weight:400;font-size:26px;margin:14px 0 10px}
.why p{font-size:15.5px;opacity:.82}
/* hampers */
.head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:56px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}
.card .im{aspect-ratio:4/5;overflow:hidden;background:#e9e0cf;position:relative}
.card .im img{width:100%;height:100%;object-fit:cover}
.card .meta{padding:22px 2px 0}
.card h3{font-family:'Bodoni Moda';font-weight:400;font-size:30px;margin:4px 0 6px}
.card p{font-size:15px;color:#4a463c}
.card .price{display:flex;justify-content:space-between;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.badge{position:absolute;top:16px;left:16px;background:var(--paper);font-size:11px;letter-spacing:.22em;text-transform:uppercase;padding:7px 12px}
.ph-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;height:100%;border:1px dashed rgba(168,83,47,.55);background:repeating-linear-gradient(135deg,#efe6d6 0 14px,#ece2d0 14px 28px);color:var(--rust)}
.ph-slot .script{font-size:46px;line-height:1}
.ph-slot small{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:#7b6a52;margin-top:10px}
.placeholder{background:#f3e3c8;color:#7a4a1c;font-weight:500;padding:1px 7px;border-radius:2px;font-size:.92em}
/* how */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:64px;counter-reset:s}
.steps div{padding:0 30px;border-left:1px solid var(--line)}
.steps .num{font-family:'Pinyon Script';font-size:60px;color:var(--gold);line-height:1}
.steps h4{font-family:'Bodoni Moda';font-weight:400;font-size:24px;margin:8px 0}
.steps p{font-size:15.5px;color:#4a463c}
/* logos */
.logos{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;margin-top:40px}
.logos span{height:84px;border:1px dashed var(--line);display:flex;align-items:center;justify-content:center;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#8a8170}
/* cta */
.cta{position:relative;background:var(--olive);color:var(--cream);overflow:hidden}
.cta .in{display:grid;grid-template-columns:1fr 460px;gap:80px;align-items:center}
.cta img{width:100%;aspect-ratio:1/1;object-fit:cover;border:10px solid var(--paper);transform:rotate(2deg);box-shadow:0 30px 60px rgba(0,0,0,.3)}
footer{background:var(--ink);color:#cfc6b4;padding:80px 0 40px;font-size:14.5px}
footer .g{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px}
footer h5{color:var(--gold2);font-size:12px;letter-spacing:.28em;text-transform:uppercase;font-weight:500;margin-bottom:16px}
footer li{list-style:none;margin:6px 0}
footer .bot{border-top:1px solid #333;margin-top:60px;padding-top:24px;display:flex;justify-content:space-between;font-size:12.5px;letter-spacing:.08em}
/* page hero small */
.phero{background:var(--cream);padding:100px 0 80px;text-align:center}
.phero p{max-width:620px;margin:0 auto;color:#4a463c}
.crumb{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:#7b6a52;padding:22px 48px}
.filters{display:flex;justify-content:center;gap:12px;margin-top:40px}
.filters span{padding:9px 20px;border:1px solid var(--line);font-size:12px;letter-spacing:.2em;text-transform:uppercase}
.filters span.on{background:var(--ink);color:var(--cream);border-color:var(--ink)}
/* detail */
.pd{display:grid;grid-template-columns:1.1fr 1fr;gap:80px}
.gal{display:grid;grid-template-columns:96px 1fr;gap:16px}
.gal .th{display:flex;flex-direction:column;gap:14px}
.gal .th img,.gal .th div{width:96px;height:120px;object-fit:cover}
.gal .th div{border:1px dashed var(--line);font-size:10px;letter-spacing:.15em;display:flex;align-items:center;justify-content:center;text-align:center;color:#8a8170;text-transform:uppercase}
.gal .main{aspect-ratio:4/5;object-fit:cover;width:100%}
.inside li{list-style:none;padding:13px 0;border-bottom:1px solid var(--line);display:flex;gap:16px;font-size:16px}
.inside li:before{content:"◆";color:var(--gold);font-size:9px;padding-top:7px}
.opt{border:1px solid var(--line);padding:22px 24px;margin-top:-1px;display:flex;justify-content:space-between;gap:20px}
.opt h5{font-family:'Bodoni Moda';font-weight:400;font-size:20px}
.opt p{font-size:14.5px;color:#4a463c}
.opt .chk{width:20px;height:20px;border:1px solid var(--ink);flex:none;margin-top:5px}
.opt .chk.on{background:var(--olive);border-color:var(--olive);box-shadow:inset 0 0 0 3px var(--paper)}
.facts{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);margin:28px 0}
.facts div{padding:16px 18px;border-right:1px solid var(--line)}
.facts div:last-child{border:0}
.facts small{display:block;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#7b6a52}
/* form */
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:26px 28px}
.fgrid .full{grid-column:1/-1}
label{display:block;font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;font-weight:500;margin-bottom:8px;color:#4a463c}
.in-f{width:100%;border:0;border-bottom:1px solid rgba(22,20,15,.35);background:transparent;padding:10px 0;font:inherit;color:#8a8170}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chips span{padding:9px 16px;border:1px solid var(--line);font-size:13.5px}
.chips span.on{background:var(--olive);color:var(--cream);border-color:var(--olive)}
.formcard{background:#fff;padding:56px;box-shadow:0 1px 0 var(--line),0 30px 80px rgba(60,50,30,.08)}
.dm{display:flex;gap:14px;margin-top:30px}
.dm a{flex:1;display:flex;align-items:center;gap:12px;justify-content:center;padding:16px;border:1px solid var(--gold2);color:var(--cream);font-size:12.5px;letter-spacing:.2em;text-transform:uppercase}
.hero{grid-template-columns:1.3fr 1fr}
.hero .imgs{margin:48px 48px 48px 0;outline:1px solid var(--gold);outline-offset:-14px}
.hero .imgs .a{filter:contrast(1.03) saturate(1.05)}
.dark .card p{color:rgba(246,239,227,.75)}.dark .card .hname{color:#d9bb7c}.dark .card .price{border-color:rgba(217,187,124,.3)}
.im.swap img.b{position:absolute;inset:0;opacity:0;transition:opacity .5s}
.im.swap:hover img.b{opacity:1}
.im .inset{position:absolute;right:14px;bottom:14px;width:92px;background:var(--paper);padding:5px 5px 2px;box-shadow:0 8px 20px rgba(0,0,0,.25);text-align:center;transition:opacity .3s}
.im .inset img{width:100%;height:96px;object-fit:cover}
.im .inset em{font-family:'Pinyon Script';font-style:normal;font-size:19px;color:var(--rust);line-height:1.4}
.im.swap:hover .inset{opacity:0}
