@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600&family=Source+Sans+3:wght@400;600&display=swap');

:root { --black:#080808; --wine:#8c2331; --paper:#f7f4ee; --ink:#28211f; --muted:#837875; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:'Source Sans 3',sans-serif; font-size:16px; }
a { color:inherit; text-decoration:none; }
.sidebar { background:var(--black); color:#fff; display:flex; flex-direction:column; height:100vh; left:0; padding:38px 40px 28px; position:fixed; top:0; width:248px; z-index:10; }
.side-logo { display:block; margin:4px 0 61px; width:132px; }
.side-logo img { filter:invert(1); width:132px; }
.side-nav { display:grid; gap:17px; }
.side-nav a { color:#aaa; font-family:'Playfair Display',serif; font-size:18px; transition:color .2s; }
.side-nav a:hover,.side-nav .active { color:#fff; }
.side-note { color:#777; font-size:9px; letter-spacing:.18em; line-height:1.6; margin:auto 0 0; }
main { margin-left:248px; }
.hero { background:url('assets/hero-pequod.jpg') center 42% / cover no-repeat; height:100vh; min-height:680px; position:relative; }
.hero::after { background:linear-gradient(90deg,rgba(0,0,0,.12),transparent 56%); content:''; inset:0; position:absolute; }
.hero-copy { color:#fff; left:8%; position:absolute; top:42%; z-index:1; }
.small-label,.eyebrow { font-size:11px; font-weight:600; letter-spacing:.21em; margin:0 0 17px; text-transform:uppercase; }
.hero h1 { font-family:'Playfair Display',Georgia,serif; font-size:clamp(66px,7.6vw,118px); font-weight:400; letter-spacing:-.055em; line-height:.86; margin:0; }
.scroll-mark { border:1px solid rgba(255,255,255,.7); border-radius:50%; bottom:30px; color:#fff; display:grid; font-size:22px; height:45px; place-items:center; position:absolute; right:36px; width:45px; z-index:1; }
.section { padding:110px 8%; }
.eyebrow { color:var(--wine); }
.eyebrow.light { color:#d7aa8a; }
.product-grid { display:grid; gap:28px; grid-template-columns:repeat(4,1fr); margin:55px 0; }
.product-card { text-align:center; }
.product-card img { height:230px; margin:auto; max-width:100%; object-fit:contain; transition:transform .4s; }
.product-card:hover img { transform:translateY(-9px); }
.card-line { background:#d9d0c8; height:1px; margin:23px 0 17px; }
h2 { font-family:'Playfair Display',Georgia,serif; font-size:23px; font-weight:500; line-height:1.06; margin:0; }
.product-card p { color:var(--muted); font-size:14px; line-height:1.45; margin:14px auto 0; max-width:205px; }
.button-link { border-bottom:1px solid var(--wine); color:var(--wine); display:inline-flex; font-size:12px; font-weight:600; gap:42px; letter-spacing:.08em; padding:0 1px 8px; text-transform:uppercase; }
.button-link span { font-size:17px; line-height:.7; }
.brand-section { background:#241c19; color:#fff; display:grid; grid-template-columns:1fr 1.05fr; min-height:580px; }
.brand-intro { padding:105px 16%; }
.brand-intro h2,.shop-copy h2,.benefits h2,.online-shop h2 { font-family:'Playfair Display',Georgia,serif; font-size:clamp(45px,5.3vw,76px); font-weight:400; letter-spacing:-.05em; line-height:.93; margin:0; }
em { color:#bd7e54; font-style:normal; }
.brand-intro > p:not(.eyebrow) { color:#c8bbb3; line-height:1.65; margin:30px 0; max-width:400px; }
.inverse { border-color:#fff; color:#fff; }
.brand-art { background:url('assets/home_wine2_sectionbg1.jpg') center / cover; min-height:420px; }
.collections { background:#ede9e3; padding-top:105px; padding-bottom:105px; }
.collection-row { align-items:center; border-top:1px solid #cfc6bc; display:grid; gap:25px; grid-template-columns:60px minmax(160px,.65fr) 1.4fr; padding:27px 0; }
.collection-row:last-child { border-bottom:1px solid #cfc6bc; }
.collection-row span { color:var(--wine); font-size:12px; letter-spacing:.12em; }
.collection-row h2 { font-size:35px; }
.collection-row p { color:var(--muted); margin:0; }
.benefits { background:linear-gradient(90deg,rgba(20,17,15,.75),rgba(20,17,15,.18)),url('assets/home_wine2_sectionbg3.jpg') center / cover; color:#fff; min-height:590px; padding:115px 10%; }
.benefits-copy { max-width:480px; }
.benefits-copy > p:not(.eyebrow) { color:#eee1d7; line-height:1.65; margin:25px 0; }
.benefit-links { display:grid; gap:14px; margin-top:32px; }
.benefit-links a { border-bottom:1px solid rgba(255,255,255,.45); display:flex; font-size:14px; justify-content:space-between; padding-bottom:8px; }
.shop-section { display:grid; grid-template-columns:1fr 1fr; min-height:560px; }
.shop-image { background:#d8d0c8; display:grid; min-height:460px; place-items:center; }
.shop-image img { max-height:440px; max-width:80%; object-fit:contain; }
.shop-copy { align-self:center; padding:80px 18%; }
.shop-copy > p:not(.eyebrow) { font-size:20px; line-height:1.45; margin:27px 0 8px; }
.shop-copy .muted { color:var(--muted); font-size:15px; margin-top:0; }
.shop-copy .button-link { margin-top:22px; }
.online-shop { align-items:center; background:url('assets/home_wine2_sectionbg5.jpg') center / cover; color:#fff; display:grid; gap:80px; grid-template-columns:.72fr 1.28fr; min-height:510px; padding:8% 13%; }
.online-shop > img { filter:invert(1); max-width:220px; width:100%; }
.online-shop div > p:not(.eyebrow) { color:#eee6de; line-height:1.65; margin:25px 0; max-width:420px; }
footer { background:#151313; color:#c9c1b9; display:grid; gap:38px; grid-template-columns:1.1fr 1fr 1fr .7fr; padding:70px 8% 35px; position:relative; }
footer > img { filter:invert(1); max-width:125px; }
footer strong { color:#fff; display:block; font-family:'Playfair Display',serif; font-size:15px; font-weight:400; margin-bottom:14px; }
footer p,footer a { color:#9c938c; display:block; font-size:13px; line-height:1.55; margin:0 0 7px; }
footer small { bottom:15px; color:#68615c; font-size:10px; grid-column:1 / -1; letter-spacing:.07em; }
.menu-toggle { display:none; }
@media (max-width:900px) { .sidebar { padding-left:25px; padding-right:25px; width:200px; } main { margin-left:200px; } .product-grid { grid-template-columns:repeat(2,1fr); } .brand-intro { padding:85px 12%; } }
@media (max-width:680px) { body { font-size:15px; } .sidebar { box-shadow:12px 0 30px rgba(0,0,0,.25); transform:translateX(-100%); transition:transform .25s; width:230px; } body.menu-open .sidebar { transform:translateX(0); } main { margin-left:0; } .menu-toggle { background:#090909; border:0; display:grid; gap:5px; padding:17px 15px; position:fixed; right:0; top:0; z-index:20; } .menu-toggle span { background:#fff; display:block; height:1px; width:24px; } .hero { min-height:610px; } .hero-copy { left:9%; top:43%; } .hero h1 { font-size:70px; } .section { padding:75px 9%; } .product-grid { gap:38px 20px; margin:42px 0; } .product-card img { height:175px; } .product-card p { font-size:13px; } .brand-section,.shop-section,.online-shop { grid-template-columns:1fr; } .brand-intro,.shop-copy { padding:75px 10%; } .brand-art { min-height:290px; } .collection-row { gap:8px; grid-template-columns:32px 1fr; } .collection-row p { grid-column:2; } .benefits { min-height:560px; padding:85px 10%; } .shop-image { min-height:350px; } .online-shop { gap:40px; padding:75px 10%; } footer { grid-template-columns:1fr 1fr; padding:55px 10% 30px; } footer > img { grid-column:1 / -1; } }
