:root {
  color-scheme: light;
  --paper: #fff8ec;
  --paper-deep: #f2e4cc;
  --paper-soft: #fbf3e6;
  --ink: #432918;
  --ink-soft: #68513f;
  --green: #466235;
  --line: #ddcbb1;
  --white: #fffdf8;
  --serif: "Be Vietnam Pro", system-ui, sans-serif;
  --sans: "Be Vietnam Pro", system-ui, sans-serif;
  --wrap: min(1280px, calc(100% - 64px));
  --radius: 20px;
  --shadow: 0 18px 50px rgb(67 41 24 / 9%);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 16px/1.55 var(--sans); -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.wrap { width: var(--wrap); margin-inline: auto; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position: fixed; z-index: 50; top: 8px; left: 8px; padding: 12px 16px; transform: translateY(-150%); background: var(--ink); color: var(--white); border-radius: 6px; }
.skip-link:focus { transform: translateY(0); }
.site-header { position: fixed; top: 0; left:0; right:0; z-index: 20; height: 76px; background: var(--paper); border-bottom: 1px solid var(--line); }
.header-inner { height: 100%; display:flex; align-items:center; justify-content:space-between; gap:32px; }
.wordmark { display:inline-flex; align-items:center; gap:10px; font:400 25px/1 var(--serif); white-space:nowrap; }
.wordmark-logo { display:block; width:34px; height:34px; flex:0 0 34px; background:var(--green); -webkit-mask:url('assets/logo-bot-sen.svg') center / contain no-repeat; mask:url('assets/logo-bot-sen.svg') center / contain no-repeat; }
.main-nav > div { display:flex; align-items:center; gap:38px; }
.main-nav { display:flex; align-items:center; margin-left:auto; margin-right:14px; }
.main-nav a, .mobile-menu a:not(.button) { position:relative; font-size:14px; color:var(--ink-soft); }
.main-nav a::after, .mobile-menu a:not(.button)::after { content:""; position:absolute; left:0; right:100%; bottom:-5px; height:1px; background:var(--green); transition:right .22s ease; }
.main-nav a:hover::after, .mobile-menu a:not(.button):hover::after { right:0; }
.button { display:inline-flex; min-height:52px; align-items:center; justify-content:center; gap:26px; padding:0 22px; border:1px solid var(--green); border-radius:999px; background:var(--green); color:var(--white); font-size:15px; font-weight:500; line-height:1.15; cursor:pointer; transition:transform .18s ease, background-color .18s ease, color .18s ease; }
.button:hover { transform:translateY(-2px); background:#354d28; }
.button:active { transform:translateY(1px) scale(.99); }
.button:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, summary:focus-visible { outline:3px solid #9ab486; outline-offset:3px; }
.button-small { min-height:42px; padding-inline:18px; font-size:14px; }
.button-secondary { background:transparent; color:var(--ink); border-color:var(--line); }
.button-secondary:hover { background:var(--paper-deep); color:var(--ink); }
.arrow { font-size:19px; line-height:0; transition:transform .18s ease; }
.button:hover .arrow, .footer-order-link:hover span { transform:translate(2px,-2px); }
.menu-button { display:none; width:44px; height:44px; border:1px solid var(--line); border-radius:50%; background:transparent; align-items:center; justify-content:center; flex-direction:column; gap:5px; }
.menu-button span { width:16px; height:1px; background:var(--ink); }
.mobile-buy-button { display:none; }
.mobile-menu { display:none; }
.hero { position:relative; min-height:100svh; padding:96px 0 22px; display:flex; align-items:flex-start; overflow:visible; }
.hero-layout { position:relative; display:grid; grid-template-columns:minmax(0, 5fr) minmax(0, 6fr); align-items:center; gap:clamp(50px, 8vw, 124px); }
.hero-copy { max-width:510px; padding:10px 0; }
.eyebrow { display:flex; align-items:center; gap:10px; margin:0 0 23px; color:var(--green); font-size:13px; font-weight:600; letter-spacing:.07em; }
.eyebrow-mark { width:21px; height:1px; background:currentColor; }
h1, h2, h3, p { margin-top:0; }
h1, h2 { font-family:var(--serif); font-weight:400; letter-spacing:-.018em; }
h1 { max-width:540px; margin-bottom:22px; font-size:clamp(58px, 6.05vw, 86px); line-height:.98; }
.hero-intro { max-width:440px; margin-bottom:30px; color:var(--ink-soft); font-size:18px; line-height:1.6; }
.hero-footnote { margin:18px 0 0; color:var(--ink-soft); font-size:13px; }
.hero-image-frame { position:relative; width:min(100%, 420px); justify-self:center; aspect-ratio:941 / 1672; overflow:visible; border-radius:0; background:transparent; }
.hero-image { width:100%; height:auto; object-fit:contain; object-position:center; }



.scroll-cue { position:absolute; bottom:22px; left:50%; display:flex; gap:12px; align-items:center; color:var(--ink-soft); font-size:12px; transform:translateX(-50%); }
.scroll-cue span:last-child { color:var(--green); font-size:18px; }
.section { min-height:100svh; height:100svh; padding:112px 0 72px; display:flex; align-items:center; }
.section-heading { max-width:690px; }
.section-heading .eyebrow { margin-bottom:18px; }
@media (min-width:768px) and (max-width:1023px) { .gallery-grid { grid-template-columns:repeat(3, minmax(0, 1fr)); } }
h2 { max-width:720px; margin-bottom:18px; font-size:clamp(46px, 5.2vw, 68px); line-height:1.02; }
.section-intro { max-width:590px; margin-bottom:0; color:var(--ink-soft); font-size:17px; line-height:1.65; }
.gallery-section { height:auto; min-height:100svh; display:block; padding:116px 0 84px; background:var(--paper-soft); }
.gallery-grid { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:18px; margin-top:48px; align-items:start; }
.gallery-image { width:100%; height:auto; object-fit:contain; border:0; border-radius:0; }
.gallery-poster { position:relative; container-type:inline-size; }
.gallery-poster .gallery-image { width:100%; }
.gallery-countdown { position:absolute; top:19.2%; left:30.4%; width:39.2%; height:6.2%; display:grid; place-items:center; border:1px solid #a96820; border-radius:9%; background:linear-gradient(90deg, #4b2410, #633012 50%, #4b2410); box-shadow:inset 0 0 0 2px rgb(255 198 87 / 18%); color:#ffe08a; font-family:var(--serif); font-size:clamp(10px, 12cqw, 40px); font-weight:700; letter-spacing:.03em; line-height:1; pointer-events:none; }
.section-ingredients { background:var(--paper); }
.ingredients-layout { display:block; margin-top:36px; }
.ingredient-list { display:grid; gap:0; padding:0; margin:0; list-style:none; counter-reset:ingredient; }
.ingredient-list li { position:relative; min-height:64px; display:flex; align-items:center; gap:18px; border-bottom:1px solid var(--line); font-size:16px; }
.ingredient-list li:first-child { border-top:1px solid var(--line); }
.ingredient-list li::before { counter-increment:ingredient; content:"0" counter(ingredient); color:var(--green); font:400 16px/1 var(--serif); }

.section-prep { background:var(--paper); }
.prep-heading { display:block; }
.step-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; padding:0; margin:64px 0 0; list-style:none; border-top:1px solid var(--line); }
.step-list li { min-height:177px; padding:24px 30px 16px 0; border-bottom:1px solid var(--line); }
.step-list li+li { padding-left:30px; border-left:1px solid var(--line); }
.step-number { display:block; margin-bottom:27px; color:var(--green); font:400 18px/1 var(--serif); }
.step-list h3 { margin-bottom:9px; font:400 26px/1.15 var(--serif); }
.step-list p { max-width:310px; margin-bottom:0; color:var(--ink-soft); font-size:15px; }
.gallery-section .section-heading { margin-bottom:0; }
.section-combos { background:var(--paper-deep); }
.section-order { padding-top:92px; padding-bottom:56px; background:var(--paper); }
.order-heading { max-width:760px; }
.order-heading .section-intro { max-width:660px; }
#order-form { margin-top:18px; }
.combo-grid { padding:0; margin:0; border:0; }
.combo-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.combo-card { position:relative; display:flex; align-items:center; min-height:150px; padding:23px; border:1px solid #d5c1a4; border-radius:16px; background:var(--paper); cursor:pointer; transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.combo-card:hover { transform:translateY(-2px); }
.combo-card.is-selected { border:2px solid var(--green); padding:22px; box-shadow:0 8px 24px rgb(70 98 53 / 9%); }
.combo-card input { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; }
.combo-card:focus-within { outline:3px solid #9ab486; outline-offset:3px; }
.combo-topline { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:24px; }
.combo-continue { margin-top:22px; min-width:220px; }
.selected-combo { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 20px; margin:26px 0 0; border:1px solid var(--line); border-radius:12px; background:var(--paper-soft); }
.selected-combo>div { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
.selected-label { color:var(--ink-soft); font-size:13px; }
.selected-combo strong { font-weight:600; }
.selected-price { font-variant-numeric:tabular-nums; }
.selected-combo a { color:var(--green); font-size:13px; text-decoration:underline; text-underline-offset:4px; }
.combo-quantity { color:var(--green); font-size:12px; font-weight:600; }
.combo-badge { padding:5px 8px; border-radius:99px; background:#e6ebdd; color:#354d28; font-size:11px; }
.combo-name { display:block; margin-bottom:6px; font:400 25px/1.15 var(--serif); }
.combo-price { display:block; font-size:19px; font-weight:600; font-variant-numeric:tabular-nums; }
.combo-shipping { display:block; margin-top:7px; color:var(--ink-soft); font-size:13px; }
.combo-topline, .combo-name, .combo-price, .combo-shipping { display:none; }
.combo-mobile-summary { display:block; padding-right:6px; font-size:18px; font-weight:600; line-height:1.45; }
.order-form-panel { margin-top:0; padding:22px 28px 20px; border:1px solid #d5c1a4; border-radius:16px; background:var(--white); }
.form-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid var(--line); }
.form-heading>div { display:flex; align-items:center; gap:14px; }
.form-step { color:var(--green); font:400 17px/1 var(--serif); }
.form-heading h3 { margin:0; font:400 27px/1.1 var(--serif); }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:13px 20px; }
.field { display:grid; gap:7px; color:var(--ink); font-size:13px; font-weight:500; }
.field b { color:#a13f23; }
.field > span { display:flex; align-items:baseline; gap:5px; }
.field em { margin-left:5px; color:var(--ink-soft); font-size:12px; font-style:normal; font-weight:400; }
.field-wide { grid-column:1/-1; }
.field input, .field textarea, .field select { width:100%; min-height:48px; padding:11px 13px; border:1px solid #d8c7b0; border-radius:7px; background:#fffefa; color:var(--ink); font-size:15px; font-weight:400; }
.field textarea { min-height:66px; resize:vertical; }
.field select { cursor:pointer; }
.field input::placeholder, .field textarea::placeholder { color:#8b7c6b; }
.order-bottom { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:17px; }
.form-error { margin:14px 0 0; color:#9a321f; font-size:14px; }
.section-policies { background:var(--paper-soft); }
.policies-layout { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(52px, 9vw, 136px); align-items:start; }
.policy-list { border-top:1px solid var(--line); }
.policy-item { border-bottom:1px solid var(--line); }
.policy-item summary { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:22px 0; cursor:pointer; list-style:none; font-size:17px; font-weight:500; }
.policy-item summary::-webkit-details-marker { display:none; }
.policy-item summary::after { content:"+"; color:var(--green); font-size:21px; font-weight:400; }
.policy-item[open] summary::after { content:"−"; }
.policy-item p { max-width:600px; padding:0 40px 20px 0; margin:0; color:var(--ink-soft); font-size:15px; line-height:1.65; }
.site-footer { padding:70px 0 24px; background:#432918; color:#fff8ec; }
.footer-main { display:grid; grid-template-columns:1fr 1.2fr auto; align-items:start; gap:36px; }
.footer-wordmark { color:var(--paper); }
.footer-wordmark .wordmark-logo { background:#dce4ce; }
.footer-note { max-width:430px; margin:2px 0 0; color:#e0d2c2; font-size:14px; }
.footer-order-link { display:inline-flex; gap:14px; align-items:center; color:var(--paper); font-size:14px; }
.footer-order-link span { display:inline-block; color:#dce4ce; transition:transform .18s ease; }
.footer-bottom { grid-column:1/-1; display:flex; justify-content:space-between; gap:20px; padding-top:24px; margin-top:14px; border-top:1px solid rgb(255 248 236 / 22%); color:#e0d2c2; font-size:12px; }
.review-dialog { width:min(560px, calc(100% - 32px)); max-height:min(90svh, 820px); padding:0; border:1px solid var(--line); border-radius:20px; background:var(--paper); color:var(--ink); box-shadow:0 24px 80px rgb(30 20 10 / 24%); }
.review-dialog::backdrop { background:rgb(40 28 18 / 48%); }
.dialog-content { position:relative; padding:34px; }
.dialog-close { position:absolute; top:16px; right:16px; width:38px; height:38px; border:1px solid var(--line); border-radius:50%; background:transparent; color:var(--ink); font-size:24px; line-height:1; cursor:pointer; }
.dialog-content .eyebrow { margin:0 0 10px; }
.dialog-content h2 { max-width:440px; padding-right:35px; margin:0 0 25px; font-size:40px; }
.review-summary { display:grid; grid-template-columns:110px 1fr; gap:0; margin:0; border-top:1px solid var(--line); }
.review-summary dt, .review-summary dd { padding:11px 0; margin:0; border-bottom:1px solid var(--line); font-size:14px; }
.review-summary dt { color:var(--ink-soft); }
.review-summary dd { overflow-wrap:anywhere; font-weight:500; }
.dialog-note { margin:20px 0 0; color:var(--ink-soft); font-size:13px; }
.dialog-actions { display:flex; gap:12px; justify-content:flex-end; margin-top:24px; }
.dialog-actions .button { min-height:48px; padding-inline:17px; font-size:14px; }
.success-view { min-height:100svh; padding:112px 0 80px; background:linear-gradient(180deg, var(--paper) 0%, var(--paper-soft) 100%); }
.success-copy { width:min(680px, 100%); text-align:center; }
.success-heading { display:grid; justify-items:center; }
.success-copy h1 { max-width:680px; margin:0; font-size:clamp(42px, 6vw, 68px); }
.success-copy .hero-intro { max-width:560px; margin:16px auto 0; }
.success-request { margin:16px 0 0; color:var(--ink-soft); font-size:14px; }
.success-order-card { margin:38px auto 0; padding:25px clamp(18px, 4vw, 34px); border:2px solid var(--ink); background:rgb(255 253 248 / 84%); text-align:left; box-shadow:8px 8px 0 rgb(70 98 53 / 14%); }
.success-order-card h2 { margin:0 0 17px; color:var(--green); font-size:20px; font-weight:700; letter-spacing:.07em; text-align:center; text-transform:uppercase; }
.success-order-details { display:grid; grid-template-columns:132px 1fr; margin:0; border-top:1px solid var(--line); }
.success-order-details dt, .success-order-details dd { min-width:0; margin:0; padding:11px 0; border-bottom:1px solid var(--line); font-size:15px; line-height:1.35; overflow-wrap:anywhere; }
.success-order-details dt { color:var(--ink-soft); }
.success-order-details dd { font-weight:600; }
.success-progress { position:relative; display:grid; gap:0; max-width:510px; padding:29px 0 4px; margin:0 auto; list-style:none; text-align:left; }
.success-progress::before { position:absolute; top:49px; bottom:28px; left:18px; width:1px; background:var(--line); content:""; }
.success-progress li { position:relative; display:grid; grid-template-columns:38px 1fr; gap:15px; align-items:start; padding:0 0 22px; }
.success-step-number { position:relative; z-index:1; display:grid; place-items:center; width:37px; height:37px; border:1px solid var(--green); border-radius:50%; background:var(--paper); color:var(--green); font-size:14px; font-weight:700; }
.success-progress h3 { margin:1px 0 3px; font-size:16px; text-transform:uppercase; }
.success-progress p { margin:0; color:var(--ink-soft); font-size:14px; line-height:1.45; }
.success-delivery { max-width:560px; padding-top:6px; margin:0 auto; border-top:1px solid var(--line); }
.success-delivery h2 { margin:22px 0 6px; color:var(--green); font-size:19px; text-transform:uppercase; }
.success-delivery p { margin:0; color:var(--ink-soft); font-size:15px; line-height:1.55; }
.success-copy > .button { margin-top:28px; }
.toast { position:fixed; z-index:30; right:20px; bottom:20px; max-width:min(420px, calc(100% - 40px)); padding:15px 19px; border:1px solid var(--line); border-radius:12px; background:var(--paper); box-shadow:var(--shadow); color:var(--ink); font-size:14px; }
[hidden] { display:none !important; }
@media (min-width:1500px) { :root { --wrap:min(1280px, calc(100% - 160px)); } }
@media (max-width:1023px) {
  :root { --wrap:calc(100% - 96px); }
  .site-header { height:68px; }
  .hero { min-height:100svh; padding:92px 0 24px; }
  .hero-layout { grid-template-columns:minmax(0, 5fr) minmax(0, 6fr); gap:32px; }
  .hero-image-frame { width:min(100%, 320px); }
  h1 { font-size:clamp(54px, 7vw, 70px); }

  
  .section { padding:100px 0 70px; }
  .policies-layout { gap:48px; }
  .combo-card { padding:18px; }
  .combo-card.is-selected { padding:17px; }
  .combo-name { font-size:22px; }
  .order-form-panel { padding:24px; }
}
@media (max-width:767px) {
  :root { --wrap:calc(100% - 48px); }
  html { scroll-padding-top:64px; }
  .site-header { height:64px; }
  .header-inner { gap:10px; }
  .wordmark { font-size:23px; }
  .main-nav, .header-inner>.button { display:none; }
  .mobile-buy-button { position:fixed; z-index:25; right:0; bottom:0; left:0; display:inline-flex; min-height:58px; border-radius:0; font-size:16px; box-shadow:0 -8px 22px rgb(67 41 24 / 14%); }
  .menu-button { display:flex; margin-left:auto; }
  .mobile-menu:not([hidden]) { position:absolute; top:64px; left:0; right:0; display:grid; gap:0; padding:10px 24px 22px; border-bottom:1px solid var(--line); background:var(--paper); }
  .mobile-menu [data-mobile-links] { display:grid; }
  .mobile-menu a:not(.button) { padding:15px 0; border-bottom:1px solid var(--line); font-size:16px; }
  .mobile-menu .button { margin-top:16px; }
  .site-footer { padding-bottom:88px; }
  .hero { min-height:0; height:auto; padding:86px 0 28px; align-items:flex-start; }
  .hero-layout { display:flex; flex-direction:column; align-items:stretch; gap:24px; }
  .hero-image-frame { display:none; }
  .hero-copy { padding:0; }
  .eyebrow { margin-bottom:14px; font-size:12px; }
  h1 { max-width:540px; margin-bottom:13px; font-size:clamp(48px, 13vw, 64px); line-height:.98; }
  .hero-intro { max-width:480px; margin-bottom:18px; font-size:16px; line-height:1.52; }
  .hero .button { min-height:48px; }
  .hero-footnote { margin-top:11px; font-size:12px; }
  .hero-image-frame { width:min(100%, 180px); height:auto; aspect-ratio:941 / 1672; margin-inline:auto; }
  .hero-image { height:auto; }
  .scroll-cue { display:none; }
  .section { min-height:0; height:auto; padding:52px 0 40px; display:block; }
  .gallery-section { padding:76px 0 56px; }
  .gallery-grid { grid-template-columns:1fr; gap:24px; margin-top:28px; }
  .section-heading { max-width:600px; }
  .section-heading .eyebrow { margin-bottom:13px; }
  h2 { margin-bottom:14px; font-size:clamp(42px, 10vw, 56px); }
  .section-intro { font-size:16px; }
  .ingredients-layout { margin-top:25px; }
  .ingredient-list li { min-height:48px; gap:14px; font-size:15px; }


  .step-list { grid-template-columns:1fr; margin-top:28px; }
  .step-list li, .step-list li+li { display:grid; grid-template-columns:34px 1fr; column-gap:12px; min-height:0; padding:17px 0; border-left:0; }
  .step-number { grid-row:1/3; margin:3px 0 0; }
  .step-list h3 { margin-bottom:4px; font-size:23px; }
  .step-list p { font-size:14px; }
  #order-form { margin-top:13px; }
  .section-order { padding-top:68px; padding-bottom:48px; }
  .selected-combo { gap:10px; padding:13px; margin-top:20px; flex-wrap:wrap; }
  .selected-combo>div { gap:7px; }
  .combo-continue { width:100%; margin-top:16px; }
  .combo-cards { grid-template-columns:1fr; gap:10px; }
  .section-combos { padding-top:66px; }
  .combo-card, .combo-card.is-selected { min-height:0; padding:15px 16px; }
  .combo-mobile-summary { display:block; padding-right:6px; font-size:16px; font-weight:600; line-height:1.45; }
  .order-form-panel { padding:19px 16px; }
  .form-heading { align-items:flex-start; padding-bottom:15px; margin-bottom:16px; }
  .form-heading h3 { font-size:23px; }
  .form-step { font-size:15px; }

  .form-grid { grid-template-columns:1fr; gap:12px; }
  .field-wide { grid-column:auto; }
  .field input { min-height:44px; padding:9px 10px; font-size:14px; }
  .field textarea { min-height:58px; }
  .field-wide { grid-column:auto; }
  .field input, .field textarea { min-height:46px; font-size:16px; }
  .order-bottom { align-items:stretch; flex-direction:column; gap:15px; margin-top:16px; }
  .order-bottom .button { width:100%; }
  .policies-layout { grid-template-columns:1fr; gap:30px; }
  .policy-item summary { padding:18px 0; font-size:16px; }
  .policy-item p { padding-right:24px; font-size:14px; }
  .site-footer { padding:46px 0 20px; }
  .footer-main { grid-template-columns:1fr auto; gap:19px 14px; }
  .footer-wordmark { grid-column:1/-1; }
  .footer-note { max-width:360px; font-size:13px; }
  .footer-order-link { align-self:start; font-size:13px; }
  .footer-bottom { flex-direction:column; gap:8px; margin-top:7px; font-size:11px; }
  .success-view { padding:90px 0 54px; }
  .success-order-card { margin-top:30px; }
  .success-order-details { grid-template-columns:104px 1fr; }
  .dialog-content { padding:28px 20px 22px; }
  .dialog-content h2 { font-size:34px; }
  .review-summary { grid-template-columns:94px 1fr; }
  .review-summary dt, .review-summary dd { font-size:13px; }
  .dialog-actions { flex-direction:column-reverse; }
  .dialog-actions .button { width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}