
.chocolate-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:8%;align-items:center;padding-block:48px 58px}.chocolate-hero .eyebrow{margin:28px 0 18px;color:var(--muted)}.chocolate-hero h1{font-size:clamp(42px,5vw,70px);line-height:1.05}.chocolate-hero h1 em{color:var(--copper)}.chocolate-hero p{max-width:490px;color:var(--muted);font-size:16px;line-height:1.85;margin-top:24px}.chocolate-hero-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-top:28px}.chocolate-hero-actions>span{font-size:11px;color:var(--muted)}.chocolate-hero figure{position:relative;overflow:hidden;background:var(--light);border-radius:42% 42% 4px 4px}.chocolate-hero figure>img{width:100%;height:490px;object-fit:cover;transition:transform .8s}.chocolate-hero figure:hover>img{transform:scale(1.03)}.chocolate-hero figcaption{position:absolute;bottom:18px;left:18px;right:18px;background:var(--paper);padding:16px 20px}.chocolate-hero figcaption span{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}.chocolate-hero figcaption strong{display:block;font:400 23px/1.3 var(--serif);margin-top:5px}.chocolate-selection{padding-block:28px 64px}.chocolate-section-head{display:flex;justify-content:space-between;align-items:end;gap:20px}.chocolate-section-head .eyebrow{color:var(--muted);margin-bottom:14px}.chocolate-section-head>p{font-size:12px;color:var(--muted)}.chocolate-filterbar{margin:28px 0 30px;padding-block:14px;border-block:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.chocolate-filters{display:flex;gap:5px;flex-wrap:wrap}.chocolate-filters button{background:transparent;border:1px solid transparent;padding:10px 15px;min-height:44px;font-size:12px;transition:background .2s,color .2s}.chocolate-filters button[aria-pressed=true]{background:var(--green);color:var(--paper)}.chocolate-filters button:hover{border-color:var(--green)}[data-chocolate-count]{font-size:11px;color:var(--muted);white-space:nowrap}.chocolate-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 28px}.chocolate-card{display:flex;flex-direction:column;scroll-margin-top:120px;min-width:0}.chocolate-photo{overflow:hidden;position:relative;background:var(--light)}.chocolate-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform .55s}.chocolate-card:hover .chocolate-photo img{transform:scale(1.035)}.chocolate-photo>span{position:absolute;top:13px;left:13px;background:var(--paper);padding:5px 9px;font-size:9px;letter-spacing:.04em}.chocolate-copy{padding-top:18px;display:flex;flex-direction:column;flex:1}.chocolate-origin{display:flex;justify-content:space-between;gap:8px;font-size:9px;color:var(--muted);margin-bottom:9px}.chocolate-origin strong{font-weight:500;white-space:nowrap}.chocolate-copy h2{font-size:29px}.chocolate-notes{font-size:12px;color:var(--copper);margin-top:12px}.chocolate-description{font-size:12px;color:var(--muted);line-height:1.8;margin-top:12px;margin-bottom:16px}.chocolate-details{border-top:1px solid var(--line);margin-top:auto;font-size:11px}.chocolate-details summary{cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:space-between;list-style:none}.chocolate-details summary::-webkit-details-marker{display:none}.chocolate-details[open] summary span{transform:rotate(45deg)}.chocolate-details p{color:var(--muted);line-height:1.8;padding:0 0 12px}.chocolate-buy{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:15px;gap:10px}.chocolate-buy strong{font-size:17px;font-weight:500}.chocolate-buy small{font-size:11px;color:var(--muted)}.chocolate-buy .button{font-size:12px;padding:9px 15px;min-height:44px}.chocolate-attribution{margin-top:36px;font-size:10px;color:var(--muted);max-width:690px}.chocolate-status:empty{display:none}.chocolate-status{margin-bottom:20px;font-size:13px;color:var(--copper)}.chocolate-pairing{background:var(--green);color:var(--paper);padding-block:50px}.chocolate-pairing>.wrap{display:flex;align-items:center;justify-content:space-between;gap:30px}.chocolate-pairing .eyebrow{color:#c6cec4;margin-bottom:18px}.chocolate-pairing p{color:#c6cec4;max-width:480px;font-size:13px;margin-top:20px}.chocolate-cart-line .meta{font-size:12px}.chocolate-cart-line img{object-fit:cover;width:74px;height:92px}.chocolate-cart-line .cart-quantity{display:flex;gap:14px;align-items:center;margin-top:10px;font-size:12px}.chocolate-cart-line .cart-quantity>div{display:flex;align-items:center;border:1px solid var(--line)}.chocolate-cart-line .cart-quantity button{background:none;border:0;min-width:38px;min-height:38px}.chocolate-cart-line .cart-quantity span{padding-inline:8px}
@media(max-width:1000px){.chocolate-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.chocolate-hero{gap:5%}.chocolate-hero figure>img{height:420px}.chocolate-filterbar{align-items:start}.chocolate-section-head{display:block}.chocolate-section-head>p{margin-top:14px}}
@media(max-width:600px){.chocolate-hero{grid-template-columns:1fr;padding-block:26px 35px;gap:28px}.chocolate-hero .eyebrow{font-size:9px;margin-top:24px}.chocolate-hero h1{font-size:44px}.chocolate-hero p{font-size:14px;margin-top:18px}.chocolate-hero figure{border-radius:30% 30% 3px 3px}.chocolate-hero figure>img{height:360px}.chocolate-hero figcaption strong{font-size:21px}.chocolate-section-head h2{font-size:34px}.chocolate-filterbar{display:block;margin-block:23px}.chocolate-filters{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:12px}.chocolate-filters button{padding:10px 8px;text-align:center;font-size:11px;border-color:var(--line)}.chocolate-grid{grid-template-columns:1fr;gap:36px}.chocolate-photo img{aspect-ratio:1/1.05}.chocolate-copy h2{font-size:31px}.chocolate-description{font-size:14px}.chocolate-details{font-size:12px}.chocolate-buy .button{padding-inline:22px}.chocolate-pairing>.wrap{display:block}.chocolate-pairing .button{margin-top:25px}}
@media(prefers-reduced-motion:reduce){.chocolate-photo img,.chocolate-hero figure>img,.chocolate-filters button{transition:none}.chocolate-card:hover .chocolate-photo img,.chocolate-hero figure:hover>img{transform:none}}
