:root { --cream:#f7efdc; --paper:#eee1c4; --olive:#687037; --olive-dark:#4d5426; --brown:#4b2b17; --muted:#756b59; --white:#fffdf7; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--brown); background:var(--cream); font-family:Georgia, 'Times New Roman', serif; font-size:16px; line-height:1.6; }
a { color:inherit; }
.container { width:min(100% - 40px, 680px); margin-inline:auto; }
.hero { padding:30px 0 42px; overflow:hidden; }
.eyebrow { margin:0 0 14px; color:var(--olive-dark); font-family:Arial, sans-serif; font-size:.69rem; font-weight:700; letter-spacing:.14em; line-height:1.35; text-transform:uppercase; }
.eyebrow span { color:#9a8d72; padding-inline:3px; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-weight:400; letter-spacing:-.035em; line-height:1.08; }
h1 { max-width:500px; margin-bottom:17px; font-size:clamp(2.65rem, 12vw, 4.65rem); }
h2 { margin-bottom:17px; font-size:clamp(2rem, 9vw, 3rem); }
h3 { margin-bottom:4px; font-size:1.16rem; font-weight:400; line-height:1.25; }
.lot-date { margin-bottom:15px; color:var(--olive-dark); font-size:1.05rem; }
.lot-date span { padding-inline:6px; color:#b2a788; }
.intro,.section-copy { max-width:530px; font-size:1.08rem; line-height:1.62; }
.intro { margin-bottom:25px; }
.button { display:inline-flex; min-height:50px; align-items:center; justify-content:center; gap:11px; padding:12px 20px; border-radius:3px; font-family:Arial,sans-serif; font-size:.84rem; font-weight:700; letter-spacing:.035em; text-decoration:none; transition:background-color .2s ease, transform .2s ease; }
.button--olive { color:var(--white); background:var(--olive-dark); }
.hero__image-wrap { position:relative; margin-top:36px; }
.bread-placeholder { display:flex; align-items:center; justify-content:center; overflow:hidden; border:1px solid rgba(75,43,23,.14); border-radius:18px; color:rgba(75,43,23,.72); background:linear-gradient(125deg,#d7bf91 0%,#b87940 43%,#75431f 76%,#d6ad70 100%); text-align:center; }
.bread-placeholder::before { width:52%; height:46%; position:absolute; border:2px solid rgba(255,250,230,.38); border-radius:50%; content:""; transform:rotate(-14deg); }
.bread-placeholder span { z-index:1; padding:7px 14px; border-radius:3px; color:var(--white); background:rgba(75,43,23,.55); font-family:Arial,sans-serif; font-size:.67rem; font-weight:700; letter-spacing:.09em; line-height:1.5; text-transform:uppercase; }
.bread-placeholder--hero { position:relative; min-height:335px; }
.bread-image--hero {
    display: block;
    width: 100%;
    height: 335px;
    object-fit: cover;
    object-position: center 48%;
    border: 1px solid rgba(75, 43, 23, .14);
    border-radius: 18px;
}
.lot-badge { position:absolute; right:17px; bottom:-19px; display:flex; width:82px; height:82px; flex-direction:column; align-items:center; justify-content:center; border:1px solid var(--paper); border-radius:50%; color:var(--cream); background:var(--olive-dark); box-shadow:0 4px 18px rgba(60,43,22,.2); font-family:Arial,sans-serif; line-height:1; }
.lot-badge span { font-size:.61rem; font-weight:700; letter-spacing:.14em; }
.lot-badge strong { margin-top:5px; font-family:Georgia,serif; font-size:2rem; font-weight:400; }
.section { padding:70px 0; }
.section--paper { background:var(--paper); }
.video-placeholder { display:flex; min-height:230px; flex-direction:column; align-items:center; justify-content:center; margin-top:30px; padding:24px; border:1px solid rgba(75,43,23,.17); border-radius:15px; color:var(--white); background:linear-gradient(140deg,rgba(77,84,38,.96),rgba(75,43,23,.95)), repeating-linear-gradient(45deg,transparent 0 10px,rgba(255,255,255,.02) 10px 11px); text-align:center; }
.play-mark { display:grid; width:47px; height:47px; place-items:center; margin-bottom:13px; border:1px solid rgba(255,255,255,.72); border-radius:50%; padding-left:2px; font-size:.95rem; }
.video-placeholder p { margin-bottom:3px; font-size:1.2rem; }
.video-placeholder small { color:#eee5cf; font-family:Arial,sans-serif; font-size:.68rem; letter-spacing:.04em; }
.video-placeholder small span { padding-inline:2px; }
.section--identity { padding-bottom:65px; }
.facts { display:grid; grid-template-columns:1fr; margin:30px 0 38px; border-top:1px solid rgba(75,43,23,.25); }
.facts div { display:grid; grid-template-columns:42% 1fr; padding:14px 0; border-bottom:1px solid rgba(75,43,23,.25); }
.facts dt { font-family:Arial,sans-serif; font-size:.67rem; font-weight:700; letter-spacing:.11em; text-transform:uppercase; }
.facts dd { margin:0; color:var(--olive-dark); font-size:1.08rem; }
.ingredients { padding:24px 23px; border-left:3px solid var(--olive); background:rgba(238,225,196,.55); }
.ingredients h3 { color:var(--olive-dark); }
.ingredients p { margin:0; font-size:1.05rem; }
.section--taste { padding-block:64px; background:var(--cream); }
.taste-note { margin-top:30px; padding:24px 0 0; border-top:1px solid rgba(75,43,23,.25); }
.taste-note p { max-width:610px; margin-bottom:16px; font-size:1.05rem; }
.taste-note p:last-child { margin-bottom:0; color:var(--muted); }
.serving-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:11px; margin-top:30px; }
.serving-grid figure { min-width:0; margin:0; }
.serving-image { display:block; width:100%; aspect-ratio:.78; border:1px solid rgba(75,43,23,.14); border-radius:10px; object-fit:cover; object-position:center; }
.serving-placeholder { display:grid; aspect-ratio:.78; place-items:center; border:1px solid rgba(75,43,23,.14); border-radius:10px; color:var(--olive-dark); background:linear-gradient(135deg,rgba(104,112,55,.28),rgba(238,225,196,.8)); }
.serving-placeholder span { padding:5px 7px; border:1px solid rgba(77,84,38,.4); border-radius:2px; font-family:Arial,sans-serif; font-size:.6rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.serving-grid figcaption { margin-top:9px; font-size:.86rem; line-height:1.28; }
.timeline { position:relative; margin:32px 0 0; padding:0; list-style:none; }
.timeline::before { position:absolute; top:11px; bottom:15px; left:17px; width:1px; background:rgba(104,112,55,.5); content:""; }
.timeline li { position:relative; display:grid; grid-template-columns:50px 1fr; gap:15px; padding-bottom:29px; }
.timeline li:last-child { padding-bottom:0; }
.timeline li > span { z-index:1; display:grid; width:35px; height:35px; place-items:center; border-radius:50%; color:var(--cream); background:var(--olive-dark); font-family:Arial,sans-serif; font-size:.62rem; font-weight:700; }
.timeline p { margin:0; color:var(--muted); font-size:1.01rem; }
.section--bread { padding:72px 0; }
.bread-story { display:grid; gap:38px; }
.bread-placeholder--detail { position:relative; min-height:270px; }
.signature { margin:29px 0 0; color:var(--olive-dark); font-size:2rem; font-style:italic; line-height:1; }
.care-list { margin:30px 0 0; padding:0; list-style:none; }
.care-list li { position:relative; padding:0 0 18px 30px; font-size:1.07rem; }
.care-list li::before { position:absolute; top:.6em; left:0; width:10px; height:10px; border:1px solid var(--olive-dark); border-radius:50%; background:var(--cream); content:""; }
.closing { padding:68px 0 55px; color:var(--cream); background:var(--olive-dark); text-align:center; }
.closing .eyebrow { color:#e5d9bb; }
.closing h2 { max-width:480px; margin-inline:auto; }
.closing p:not(.eyebrow) { max-width:390px; margin:0 auto 27px; font-size:1.08rem; }
.button--light { color:var(--olive-dark); background:var(--cream); }
.instagram { display:block; width:max-content; margin:22px auto 0; border-bottom:1px solid rgba(247,239,220,.55); font-family:Arial,sans-serif; font-size:.83rem; text-underline-offset:4px; }
@media (min-width:640px) { .container { width:min(100% - 80px, 960px); } .hero { padding-top:55px; } .hero__content { max-width:960px; } 
.bread-image--hero {
    height: 460px;
}
.bread-placeholder--hero { min-height:460px; }
.section { padding:92px 0; } .facts { grid-template-columns:repeat(3,1fr); } .facts div { display:block; padding:18px 16px 18px 0; border-bottom:0; } .facts div + div { padding-left:20px; border-left:1px solid rgba(75,43,23,.25); } .facts dd { margin-top:7px; } .bread-story { grid-template-columns:1fr 1fr; align-items:center; } .bread-placeholder--detail { min-height:350px; } }
@media (hover:hover) { .button:hover { transform:translateY(-2px); } .button--olive:hover { background:#3e441d; } .button--light:hover { background:#fffdf7; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; } }