@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=DM+Serif+Display:ital@0;1&display=swap');

:root { --ink:#171217; --wine:#2c111e; --cream:#f3eadb; --rust:#b54726; --acid:#cbdc36; --line:rgba(23,18,23,.24); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:"DM Sans",Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.site-header { height:82px; display:flex; align-items:center; justify-content:space-between; padding:0 4vw; border-bottom:1px solid var(--line); position:relative; z-index:3; }
.wordmark { font-size:20px; font-weight:600; letter-spacing:-.05em; }.wordmark span { font-family:"DM Serif Display",serif; font-style:italic; font-weight:400; }
nav { display:flex; gap:32px; font-size:12px; text-transform:uppercase; letter-spacing:.12em; } nav a:hover,.contact-link:hover { opacity:.55; }
.contact-link { font-size:12px; border-bottom:1px solid; padding-bottom:3px; }
.hero { min-height:780px; padding:86px 4vw 44px; position:relative; overflow:hidden; border-bottom:1px solid var(--line); }
.kicker,.section-label,.edition { font-size:10px; letter-spacing:.2em; font-weight:600; }
.hero h1,.intro h2,.taste-guide h2,.newsletter h2 { font-family:"DM Serif Display",serif; font-weight:400; letter-spacing:-.055em; line-height:.82; margin:36px 0; }
.hero h1 { font-size:clamp(88px,14vw,190px); max-width:920px; position:relative; z-index:1; }.hero h1 em { color:var(--rust); font-weight:400; }
.hero-bottom { margin-top:55px; display:flex; align-items:flex-end; gap:32px; position:relative; z-index:2; }.hero-bottom p { max-width:470px; line-height:1.65; font-size:15px; }
.button { display:inline-flex; padding:18px 22px; font-size:11px; letter-spacing:.12em; font-weight:600; }.button-primary { background:var(--ink); color:var(--cream); }.button:hover { transform:translateY(-2px); }
.liquorice-mark { position:absolute; width:500px; height:500px; right:-40px; top:155px; transform:rotate(-12deg); }.coil { position:absolute; inset:0; border:40px solid var(--ink); border-radius:50%; box-shadow:inset 0 0 0 3px #352d34,0 14px 25px rgba(0,0,0,.2); }.coil.two { inset:75px; }.coil.three { inset:150px; }.edition { position:absolute; right:4vw; bottom:46px; writing-mode:vertical-rl; }
.intro { padding:110px 4vw 70px; display:grid; grid-template-columns:1fr 2fr; }.intro h2 { font-size:clamp(55px,7vw,104px); margin:0 0 42px; }.lede { max-width:600px; line-height:1.7; color:#5f565b; }
.collection-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.collection-card { min-height:560px; padding:24px; border-right:1px solid var(--line); display:flex; flex-direction:column; }.collection-card:last-child { border-right:0; }.collection-card>p { text-transform:uppercase; font-size:10px; letter-spacing:.18em; }.collection-card h3 { font-family:"DM Serif Display",serif; font-size:40px; font-weight:400; margin:10px 0 28px; }.card-art { height:250px; order:-1; margin:-24px -24px 22px; display:grid; place-items:center; overflow:hidden; }.card-art span { font-family:"DM Serif Display",serif; font-size:170px; font-style:italic; transform:rotate(-8deg); }.acid .card-art { background:var(--acid); }.rust .card-art { background:var(--rust); color:var(--cream); }.cream .card-art { background:var(--ink); color:var(--cream); }.card-footer { margin-top:auto; display:flex; justify-content:space-between; gap:28px; align-items:end; }.card-footer span { font-size:13px; line-height:1.6; color:#5f565b; }.card-footer a { font-size:25px; border:1px solid var(--ink); border-radius:50%; min-width:48px; height:48px; display:grid; place-items:center; }.card-footer a:hover { background:var(--ink); color:var(--cream); }
.taste-guide { background:var(--wine); color:var(--cream); display:grid; grid-template-columns:1fr 1fr; padding:110px 4vw; gap:10vw; }.taste-guide h2 { font-size:clamp(70px,9vw,130px); }.taste-guide h2 em { color:var(--acid); }.guide-copy>p:not(.section-label) { max-width:460px; line-height:1.7; opacity:.72; }.button-light { border:1px solid rgba(243,234,219,.5); margin-top:25px; }.taste-guide ol { list-style:none; margin:0; padding:0; }.taste-guide li { display:grid; grid-template-columns:50px 1fr; border-top:1px solid rgba(243,234,219,.3); padding:30px 0; }.taste-guide li span { font-size:11px; opacity:.5; }.taste-guide li strong { font-family:"DM Serif Display",serif; font-size:42px; font-weight:400; }.taste-guide li p { grid-column:2; margin:8px 0 0; opacity:.6; font-size:13px; }
.story { padding:120px 4vw; }.story blockquote { font-family:"DM Serif Display",serif; font-size:clamp(48px,7vw,96px); line-height:1; max-width:1150px; margin:55px 0; }.story-copy { display:grid; grid-template-columns:1fr 1fr; gap:8vw; margin-left:34%; line-height:1.7; }.disclosure { font-size:11px; color:#6d6268; }
.newsletter { background:var(--acid); padding:80px 4vw; display:grid; grid-template-columns:1fr 1fr; gap:10vw; align-items:end; }.newsletter h2 { font-size:72px; margin:22px 0 0; }.newsletter label { display:block; font-size:12px; margin-bottom:18px; }.newsletter form>div { display:flex; border-bottom:1px solid var(--ink); }.newsletter input { flex:1; border:0; background:transparent; padding:18px 0; outline:none; }.newsletter button { border:0; background:transparent; font-weight:600; cursor:pointer; }
footer { background:var(--ink); color:var(--cream); padding:55px 4vw; display:flex; justify-content:space-between; align-items:end; font-size:11px; } footer div { line-height:1.8; } footer div p,footer>p { opacity:.5; margin:0; }
@media(max-width:800px){ .site-header nav{display:none}.hero{min-height:690px;padding-top:70px}.hero h1{font-size:26vw}.liquorice-mark{width:290px;height:290px;right:-100px;top:330px}.coil{border-width:25px}.coil.two{inset:45px}.coil.three{inset:90px}.hero-bottom{align-items:start;flex-direction:column}.intro,.taste-guide,.newsletter{grid-template-columns:1fr}.intro{gap:32px}.collection-grid{grid-template-columns:1fr}.collection-card{border-right:0;border-bottom:1px solid var(--line)}.story-copy{margin-left:0;grid-template-columns:1fr}.newsletter{gap:50px}footer{align-items:start;flex-direction:column;gap:35px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button:hover{transform:none}}