:root {
    --cream: #fff7e8;
    --cream-soft: #fffaf1;
    --cream-deep: #f1dfbe;
    --green: #0f513b;
    --green-deep: #073727;
    --green-soft: #dce9d8;
    --orange: #f26a20;
    --orange-dark: #cc4f21;
    --saffron: #f8a532;
    --ink: #162f25;
    --muted: #607067;
    --line: rgba(15, 81, 59, .16);
    --white: #fffdf8;
    --shadow: 0 18px 45px rgba(30, 68, 50, .1);
    --max-width: 1240px;
    --radius-lg: 28px;
    --radius-md: 18px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif; font-size: 16px; line-height: 1.5; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid var(--saffron); outline-offset: 3px; }
img { display: block; max-width: 100%; }
.container { width: min(var(--max-width), calc(100% - 64px)); min-width: 0; margin-inline: auto; }
.sr-only { 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; top: 10px; left: 12px; z-index: 100; padding: 9px 14px; border-radius: 8px; color: var(--white); background: var(--green); transform: translateY(-150%); transition: transform .2s ease; }
.skip-link:focus { transform: translateY(0); }
.icon { width: 21px; height: 21px; display: inline-block; vertical-align: middle; fill: none; }
.live-region { position: fixed; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255, 247, 232, .94); border-bottom: 1px solid rgba(15, 81, 59, .1); backdrop-filter: blur(13px); }
.header-inner { min-height: 78px; display: flex; align-items: center; gap: 25px; }
.wordmark { display: inline-flex; flex: 0 0 auto; width: 185px; align-items: center; }
.wordmark img { width: 100%; height: auto; }
.primary-nav { display: flex; align-items: center; justify-content: center; gap: clamp(12px, 1.8vw, 27px); margin-left: auto; font-size: 13px; font-weight: 800; }
.primary-nav a { position: relative; padding: 8px 0; white-space: nowrap; }
.primary-nav a::after { position: absolute; right: 100%; bottom: 0; left: 0; height: 2px; content: ""; background: var(--orange); transition: right .2s ease; }
.primary-nav a:hover::after { right: 0; }
.nav-toggle { display: none; border: 0; padding: 8px; color: var(--green); background: transparent; }
.header-cta { flex: 0 0 auto; min-height: 45px !important; padding-inline: 16px !important; border-radius: 13px !important; font-size: 13px; }

.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 12px 22px; border: 0; border-radius: 15px; font-weight: 900; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); box-shadow: 0 9px 18px rgba(21, 56, 42, .12); }
.button .icon { width: 19px; height: 19px; transition: transform .2s ease; }
.button:hover .icon { transform: translateX(3px); }
.button-orange { color: var(--white); background: var(--orange); }
.button-orange:hover { background: var(--orange-dark); }
.button-outline { color: var(--green); border: 2px solid var(--green); background: transparent; }
.text-link { color: var(--green); font-weight: 900; }
.text-link .icon { margin-left: 5px; color: var(--orange); transition: transform .2s ease; }
.text-link:hover .icon { transform: translateX(3px); }
.section-space { padding: 92px 0; }
.eyebrow { margin: 0 0 17px; display: flex; align-items: center; gap: 11px; color: var(--orange-dark); font-size: 11px; font-weight: 900; letter-spacing: 3px; text-transform: uppercase; }
.eyebrow span { width: 35px; height: 2px; display: inline-block; background: currentColor; }
.eyebrow i { width: 45px; height: 2px; display: inline-block; background: currentColor; }
.eyebrow-orange { color: var(--orange); }
h1, h2, h3, p { margin-top: 0; overflow-wrap: anywhere; }
h1, h2, h3 { font-family: "Arial Rounded MT Bold", "Trebuchet MS", "Avenir Next", Arial, sans-serif; font-weight: 800; }
h1, h2 { letter-spacing: -.065em; line-height: .96; }
h1 { max-width: 650px; margin-bottom: 20px; color: var(--green-deep); font-size: clamp(48px, 5.3vw, 78px); }
h1 em, h2 em, h3 em { color: var(--orange-dark); font-style: normal; }
h2 { margin-bottom: 0; color: var(--green-deep); font-size: clamp(36px, 4.5vw, 60px); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; }
.section-lead { max-width: 395px; margin: 0 0 3px; color: var(--muted); font-size: 16px; }

/* Hero: the approved poster/mascot composition now carries the opportunity. */
.hero { min-height: clamp(610px, calc(100svh - 78px), 760px); background: var(--cream); }
.hero-grid { min-height: inherit; display: grid; grid-template-columns: minmax(0, 46fr) minmax(0, 54fr); align-items: center; gap: clamp(20px, 3vw, 48px); }
.hero-copy { max-width: 620px; padding: 58px 0; }
.hero-intro { max-width: 490px; margin-bottom: 27px; color: #315045; font-size: clamp(17px, 1.5vw, 21px); line-height: 1.38; }
.hero-intro strong { color: var(--green-deep); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 11px; }
.hero-trust { display: flex; align-items: center; gap: 13px; margin-top: 29px; color: var(--green); font-size: 13px; font-weight: 800; }
.hero-trust span { display: inline-flex; align-items: center; gap: 6px; }
.hero-trust .icon { width: 17px; height: 17px; color: var(--orange); }
.hero-trust i { width: 1px; height: 20px; background: #ddc8a8; }
.hero-visual { position: relative; width: 100%; height: min(635px, calc(100svh - 110px)); min-height: 520px; overflow: hidden; isolation: isolate; border-radius: 24px; }






.hero-poster h2 em { color: var(--orange); }








.hero-mascot { position: absolute; z-index: 5; right: 1%; bottom: 4%; width: 45%; height: 66%; object-fit: contain; object-position: center bottom; filter: saturate(1.04) contrast(1.02) drop-shadow(0 13px 0 rgba(29, 44, 37, .18)); }

.snapshot-strip { padding: 18px 0; color: var(--cream); background: var(--green); }
.snapshot-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; }
.snapshot-ticket { min-height: 74px; display: grid; align-content: center; gap: 1px; padding: 8px 22px; border-right: 1px dashed rgba(255, 247, 232, .37); }
.snapshot-ticket:first-child { border-left: 1px dashed rgba(255, 247, 232, .37); }
.snapshot-ticket span { color: #f4c77d; font-size: 10px; font-weight: 900; letter-spacing: 1.7px; text-transform: uppercase; }
.snapshot-ticket strong { color: var(--cream); font-size: clamp(19px, 2vw, 26px); line-height: 1; }
.snapshot-ticket small { color: #d7e4d2; font-size: 11px; font-weight: 700; }
.snapshot-ticket-accent strong { color: #ffbb62; }

.why-section { background: var(--cream-soft); }
.why-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 38px; }
.why-card { position: relative; min-height: 204px; display: flex; flex-direction: column; align-items: flex-start; overflow: hidden; padding: 23px 24px 20px; border-radius: 17px; }
.why-card::after { position: absolute; right: -45px; bottom: -58px; width: 155px; height: 155px; border: 1px solid currentColor; border-radius: 50%; content: ""; opacity: .17; box-shadow: 0 0 0 14px rgba(255,255,255,.08), 0 0 0 29px rgba(255,255,255,.08); }
.why-card .icon { width: 30px; height: 30px; margin: 5px 0 14px; }
.why-card h3 { margin-bottom: 7px; font-size: 21px; }
.why-card p { max-width: 300px; margin: 0; font-size: 13px; line-height: 1.35; }
.why-number { position: absolute; top: 17px; right: 19px; font-size: 11px; font-weight: 900; letter-spacing: .16em; opacity: .65; }
.why-card-green { color: var(--cream); background: var(--green); }.why-card-green h3, .why-card-green p { color: var(--cream); }.why-card-green .icon { color: #ffbf66; }
.why-card-orange { color: var(--ink); background: var(--orange); }.why-card-orange .icon { color: var(--green-deep); }
.why-card-cream { color: var(--green-deep); background: #f5e5c5; }.why-card-cream .icon { color: var(--orange); }
.why-card-dark { color: var(--cream); background: var(--green-deep); }.why-card-dark h3, .why-card-dark p { color: var(--cream); }.why-card-dark .icon { color: #ffbd62; }

.models-section { background: #f3e6cb; }
.model-tabs { display: flex; width: min(480px, 100%); margin: 36px auto 0; padding: 5px; border: 1px solid rgba(15,81,59,.15); border-radius: 17px; background: rgba(255,253,248,.75); }
.model-tab { flex: 1; display: grid; gap: 2px; padding: 14px 12px; border: 0; border-radius: 13px; color: var(--green); background: transparent; text-align: left; transition: background .25s ease, color .25s ease, transform .25s ease; }
.model-tab span { font-size: 22px; font-weight: 900; line-height: 1; }.model-tab small { font-size: 11px; font-weight: 800; }.model-tab.is-active { color: var(--cream); background: var(--green); transform: translateY(-2px); }
.model-stage { display: grid; grid-template-columns: minmax(0, .98fr) minmax(0, 1.02fr); align-items: center; gap: clamp(24px, 4.5vw, 64px); max-width: 1180px; margin: 30px auto 0; padding: clamp(24px, 3.2vw, 42px) clamp(22px, 4.2vw, 58px); overflow: hidden; border: 2px solid var(--green-deep); border-radius: 22px; background: var(--cream); box-shadow: 8px 8px 0 rgba(7,55,39,.12); }
.model-visual { position: relative; width: 100%; max-width: 560px; min-width: 0; margin: 0 auto; overflow: hidden; border: 2px solid var(--green-deep); border-radius: 16px; background: var(--green-deep); box-shadow: 0 13px 30px rgba(7,55,39,.2); }
.model-visual img { width: 100%; height: auto; aspect-ratio: 1400 / 876; object-fit: contain; background: var(--green-deep); transition: opacity .2s ease; }
.model-visual figcaption { position: static; display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding: 12px 16px 13px; color: var(--cream); background: var(--green-deep); }
.model-visual-label { font-size: 15px; font-weight: 900; }.model-visual-measure { color: #ffd18c; font-size: 11px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.model-panels { min-height: 0; position: relative; }.model-panel[hidden] { display: none; }.model-kicker { margin-bottom: 10px; color: var(--orange-dark); font-size: 11px; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }.model-panel h3 { margin-bottom: 14px; color: var(--green-deep); font-size: clamp(31px, 3.4vw, 46px); line-height: .94; }.model-panel > p:not(.model-kicker) { max-width: 420px; margin-bottom: 22px; color: var(--muted); }.model-panel dl { display: flex; gap: 32px; margin: 0 0 24px; }.model-panel dl div { display: grid; gap: 2px; }.model-panel dt { color: var(--muted); font-size: 11px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }.model-panel dd { margin: 0; color: var(--green-deep); font-size: 20px; font-weight: 900; }.models-footnote { margin: 17px 0 0; color: var(--muted); font-size: 12px; }

.space-section { background: var(--green-deep); }.space-grid { display: grid; grid-template-columns: minmax(0, .84fr) minmax(0, 1.16fr); align-items: center; gap: clamp(28px, 5vw, 72px); max-width: 1120px; }.space-copy { color: var(--cream); }.space-copy h2 { margin-bottom: 21px; color: var(--cream); font-size: clamp(35px, 4.1vw, 54px); }.space-copy > p:not(.eyebrow) { max-width: 430px; margin-bottom: 23px; color: #d6e4d2; }.space-copy .text-link { color: #ffbd62; }.space-copy .text-link .icon { color: #ffbd62; }
.format-render { position: relative; display: grid; grid-template-rows: auto auto; width: 100%; max-width: 720px; min-width: 0; margin: 0; overflow: hidden; border: 2px solid rgba(255,247,232,.4); border-radius: 16px; background: #0b3325; box-shadow: 0 15px 30px rgba(0,0,0,.18); }
.format-render img { width: 100%; height: auto; aspect-ratio: 1400 / 876; object-fit: contain; background: #0b3325; }
.format-render figcaption { display: grid; gap: 3px; padding: 13px 16px 15px; color: var(--cream); background: #0b3325; }.format-render figcaption span { color: #ffd18c; font-size: 12px; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }.format-render figcaption small { color: #d6e4d2; font-size: 11px; line-height: 1.35; }

.menu-section { scroll-margin-top: 90px; background: var(--cream-soft); }

.tea-origin-section { background: #efe2ca; }.tea-origin-layout { display: grid; grid-template-columns: 1.3fr .7fr; gap: 18px; margin-top: 34px; }.tea-origin-feature { position: relative; min-height: 250px; overflow: hidden; border-radius: 16px; background: var(--green-deep); }.tea-origin-feature > img { width: 100%; height: 100%; min-height: 250px; object-fit: cover; opacity: .72; }.tea-origin-feature > div { position: absolute; right: 24px; bottom: 20px; left: 24px; color: var(--cream); }.tea-origin-feature .eyebrow { margin-bottom: 8px; color: #ffd18c; }.tea-origin-feature > div > p:last-child { max-width: 360px; margin: 0; font-family: Georgia, serif; font-size: clamp(22px, 2.7vw, 34px); line-height: 1.08; }.tea-origin-categories { padding: 24px 27px; border-left: 1px solid var(--line); }.tea-label { margin: 0 0 10px; color: var(--orange-dark); font-size: 10px; font-weight: 900; letter-spacing: 2px; text-transform: uppercase; }.tea-origin-categories ul { display: grid; gap: 0; margin: 0 0 17px; padding: 0; list-style: none; }.tea-origin-categories li { padding: 12px 0; border-bottom: 1px solid var(--line); color: var(--green-deep); font-size: 12px; font-weight: 900; letter-spacing: .08em; }.tea-origin-categories li:first-child { border-top: 1px solid var(--line); }.tea-origin-categories .text-link { font-size: 13px; }.tea-origin-products { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; margin-top: 20px; }.tea-origin-products article { display: grid; grid-template-rows: auto 1fr; gap: 11px; padding-bottom: 13px; border-bottom: 1px solid var(--line); }.tea-origin-products img { width: 100%; aspect-ratio: 1; object-fit: cover; background: var(--cream-soft); }.tea-origin-products h3 { margin: 0; color: var(--green-deep); font-size: 17px; line-height: 1.1; }

.story-section, .process-section { scroll-margin-top: 90px; }.story-photo-wrap { position: relative; height: clamp(250px, 24vw, 330px); overflow: hidden; margin: 35px 0 0; border: 2px solid var(--green-deep); border-radius: 21px; background: var(--green-deep); box-shadow: 9px 9px 0 rgba(7,55,39,.1); }.story-photo-wrap img { width: 100%; height: 100%; object-fit: cover; opacity: .74; }.story-photo-wrap::after { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, rgba(7,55,39,.88) 0%, rgba(7,55,39,.44) 42%, transparent 78%); }.story-photo-wrap figcaption { position: absolute; z-index: 1; bottom: 28px; left: clamp(20px, 4vw, 42px); max-width: 510px; color: var(--cream); font-family: Georgia, serif; font-size: clamp(24px, 3.1vw, 41px); line-height: .98; }.story-photo-stamp { position: absolute; z-index: 2; top: 21px; right: 23px; padding: 7px 10px; border: 1px solid rgba(255,247,232,.72); color: #ffe0a2; font-size: 9px; font-weight: 900; letter-spacing: .16em; transform: rotate(2deg); }
.story-timeline { position: relative; margin-top: 62px; }.story-timeline-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 25px; margin-bottom: 24px; padding-bottom: 13px; border-bottom: 1px solid var(--line); }.story-timeline-heading .eyebrow { flex: 0 0 auto; margin: 0; }.story-timeline-heading > p:last-child { max-width: 440px; margin: 0; color: var(--muted); font-family: Georgia, serif; font-size: 15px; line-height: 1.25; }.story-events { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 35px 0 0; list-style: none; }.story-events::before { position: absolute; top: 14px; right: 7%; left: 7%; height: 2px; content: ""; background: repeating-linear-gradient(90deg, var(--orange) 0 7px, transparent 7px 13px); }.story-event { position: relative; min-width: 0; }.story-event::before { position: absolute; z-index: 1; top: -28px; left: 15px; width: 14px; height: 14px; content: ""; border: 3px solid var(--cream-soft); border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 2px var(--orange); }.story-event:nth-child(even)::before { background: var(--green); box-shadow: 0 0 0 2px var(--green); }.story-event-date { min-height: 70px; display: flex; align-items: flex-start; gap: 10px; padding: 0 4px 13px 1px; border-bottom: 2px solid var(--green-deep); color: var(--green-deep); }.story-event-index { display: grid; place-items: center; width: 27px; height: 27px; flex: 0 0 auto; border: 1px solid currentColor; border-radius: 50%; color: var(--orange-dark); font-size: 10px; font-weight: 900; }.story-event-date time, .story-event-wordmark { color: var(--green-deep); font-size: clamp(22px, 2.5vw, 34px); font-weight: 900; letter-spacing: -.06em; line-height: .9; }.story-event-date small { color: var(--orange-dark); font-size: 11px; letter-spacing: .12em; }.story-event-wordmark { font-size: 12px; letter-spacing: .1em; line-height: 1.06; }.story-event-card { min-height: 185px; padding: 17px 3px 0 1px; }.story-event-label { display: block; margin-bottom: 12px; color: var(--orange-dark); font-size: 9px; font-weight: 900; letter-spacing: .14em; }.story-event-card h3 { margin-bottom: 8px; color: var(--green-deep); font-size: clamp(20px, 2vw, 25px); line-height: .98; }.story-event-card p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.38; }.story-event-final { padding: 13px 14px 0; border: 2px solid var(--green-deep); background: var(--saffron); box-shadow: 5px 5px 0 rgba(7,55,39,.13); }.story-event-final::before { top: -30px; left: 27px; }.story-event-final .story-event-date { border-bottom-color: var(--ink); }.story-event-final .story-event-card { min-height: 169px; }.story-event-final .story-event-label { color: var(--green-deep); }.story-event-final .story-event-card p { color: var(--ink); }.story-event-final .text-link { display: inline-flex; margin-top: 17px; font-size: 12px; }

.locations-section { background: #f8edda; }.location-intro { display: flex; align-items: end; justify-content: space-between; gap: 30px; }.location-intro h2 { margin-bottom: 13px; }.location-intro p:not(.eyebrow) { margin: 0; color: var(--muted); }.search-field { min-width: 265px; height: 49px; display: flex; align-items: center; gap: 10px; padding: 0 14px; border: 1px solid var(--line); border-radius: 13px; background: var(--white); color: var(--green); }.search-field .icon { width: 19px; height: 19px; }.search-field input { width: 100%; border: 0; outline: 0; color: var(--ink); background: transparent; }.search-field input::placeholder { color: #8a918c; }.location-layout { display: grid; grid-template-columns: 1.05fr .95fr; gap: 24px; margin-top: 34px; }.map-card { position: relative; min-height: 348px; overflow: hidden; border-radius: 22px; background: #e8ebd9; }.map-card iframe { width: 100%; height: 100%; min-height: 348px; display: block; border: 0; filter: saturate(.72) sepia(.11); }.map-caption { position: absolute; right: 17px; bottom: 17px; left: 17px; display: grid; gap: 2px; padding: 11px 14px; border-radius: 10px; background: rgba(255,253,248,.93); box-shadow: 0 7px 16px rgba(13,61,42,.1); }.map-caption strong { color: var(--green-deep); }.map-caption span { color: var(--muted); font-size: 12px; }.map-caption a { width: fit-content; margin-top: 3px; color: var(--orange-dark); font-size: 12px; font-weight: 900; }.map-caption .icon { width: 14px; height: 14px; }.location-list { display: grid; align-content: center; gap: 9px; }.location-card { display: grid; grid-template-columns: 41px 1fr auto; align-items: center; gap: 11px; min-height: 66px; padding: 9px 13px; border: 1px solid rgba(15,81,59,.1); border-radius: 13px; background: var(--white); }.location-card[hidden] { display: none; }.location-dot { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: var(--green); }.location-dot.tone-leaf { background: #d8ebd6; }.location-dot.tone-sun { background: #ffebbb; }.location-dot.tone-orange { background: #ffe0c2; }.location-dot.tone-chai { background: #eed6be; }.location-dot .icon { width: 19px; height: 19px; }.location-card h3 { margin-bottom: 2px; color: var(--green-deep); font-size: 15px; }.location-card p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.25; }.location-card > a { color: var(--orange); }.location-card > a .icon { width: 20px; height: 20px; }.locations-toggle { width: fit-content; margin: 2px 0 0 49px; padding: 5px 0; border: 0; color: var(--green); background: transparent; font-size: 12px; font-weight: 900; }.locations-toggle .icon { width: 15px; height: 15px; margin-left: 5px; }.city-prompt { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-top: 36px; padding: 20px 23px; border: 1px dashed var(--green); border-radius: 15px; background: rgba(255,253,248,.62); }.city-prompt label { color: var(--green-deep); font-size: 20px; font-weight: 900; }.city-prompt > div { display: flex; gap: 9px; }.city-prompt input { width: 230px; min-height: 47px; padding: 0 13px; border: 1px solid var(--line); border-radius: 11px; outline: 0; background: var(--white); }

.process-section { position: relative; overflow: hidden; background: var(--cream-soft); }.process-section::before { position: absolute; top: 0; right: 0; width: 42%; height: 100%; content: ""; pointer-events: none; opacity: .42; background-image: radial-gradient(rgba(15,81,59,.16) 1px, transparent 1px); background-size: 13px 13px; mask-image: linear-gradient(90deg, transparent, #000); }.process-journey { position: relative; margin-top: 45px; padding: 28px 25px 24px; border: 2px solid var(--green-deep); border-radius: 24px; background: #f8edda; box-shadow: 9px 9px 0 rgba(7,55,39,.12); }.process-journey-rail { position: absolute; z-index: 0; top: 76px; right: 12px; bottom: 20px; left: 12px; pointer-events: none; }.process-journey-rail svg { width: 100%; height: 100%; overflow: visible; }.process-route-shadow, .process-route-line { fill: none; stroke-linecap: round; stroke-linejoin: round; }.process-route-shadow { stroke: rgba(15,81,59,.1); stroke-width: 11; }.process-route-line { stroke: var(--green); stroke-width: 2.5; stroke-dasharray: 7 10; animation: routeDrift 18s linear infinite; }.process-route-marker { position: absolute; top: -15px; padding: 5px 8px; border: 1px solid var(--green); color: var(--green); background: var(--cream-soft); font-size: 8px; font-weight: 900; letter-spacing: .15em; }.process-route-marker-start { left: 3%; transform: rotate(-5deg); }.process-route-marker-end { right: 3%; transform: rotate(4deg); }.process-journey-intro { position: relative; z-index: 2; width: min(285px, 100%); min-height: 116px; margin: 0 auto 25px; padding: 14px 125px 16px 17px; border: 2px solid var(--green-deep); background: var(--orange); box-shadow: 5px 5px 0 rgba(7,55,39,.16); transform: rotate(-1deg); }.process-journey-kicker { display: block; margin-bottom: 6px; color: var(--cream); font-size: 9px; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }.process-journey-intro p { margin: 0; color: var(--cream); font-family: Georgia, serif; font-size: 17px; line-height: 1.03; }.process-mascot { position: absolute; right: -9px; bottom: -13px; width: 119px; height: 143px; object-fit: contain; object-position: center bottom; filter: drop-shadow(3px 4px 0 rgba(7,55,39,.16)); }.process-steps { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 17px; margin: 0; padding: 0; list-style: none; }.process-ticket { position: relative; min-width: 0; min-height: 184px; display: flex !important; flex-direction: column; padding: 17px 17px 16px; border: 2px solid var(--green-deep); background: var(--cream); box-shadow: 5px 5px 0 rgba(7,55,39,.11); }.process-ticket:nth-child(2), .process-ticket:nth-child(5) { transform: translateY(24px) rotate(1deg); }.process-ticket:nth-child(3), .process-ticket:nth-child(6) { transform: rotate(-1deg); }.process-ticket::before, .process-ticket::after { position: absolute; top: 45%; width: 9px; height: 18px; content: ""; border: 2px solid var(--green-deep); border-radius: 50%; background: #f8edda; transform: translateY(-50%); }.process-ticket::before { left: -7px; border-left: 0; }.process-ticket::after { right: -7px; border-right: 0; }.process-ticket-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-bottom: 13px; border-bottom: 1px dashed rgba(15,81,59,.35); }.process-ticket-stamp { width: 35px; height: 35px; display: grid; place-items: center; flex: 0 0 auto; border: 2px solid var(--orange); border-radius: 50%; color: var(--orange-dark); font-size: 11px; font-weight: 900; transform: rotate(-7deg); }.process-ticket-label { color: var(--muted); font-size: 8px; font-weight: 900; letter-spacing: .14em; text-align: right; }.process-ticket-copy { padding-top: 15px; }.process-ticket-copy strong { display: block; margin-bottom: 7px; color: var(--green-deep); font-size: clamp(17px, 1.65vw, 22px); line-height: .98; }.process-ticket-copy p { max-width: 230px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.35; }.process-ticket-edge { position: absolute; right: 17px; bottom: 13px; width: 26px; height: 3px; background: var(--orange); transform: rotate(-3deg); }.process-note { max-width: 800px; margin: 29px 0 0; color: var(--muted); font-size: 12px; }
@keyframes routeDrift { to { stroke-dashoffset: -200; } }

.selector-section { background: var(--green-deep); }.selector-card { display: grid; grid-template-columns: .75fr 1.25fr; gap: clamp(35px, 7vw, 90px); padding: clamp(30px, 5vw, 65px); border-radius: 24px; color: var(--cream); background: #12513b; box-shadow: 8px 8px 0 rgba(3,29,20,.2); }.selector-intro h2 { margin-bottom: 17px; color: var(--cream); }.selector-intro > p:not(.eyebrow) { color: #d8e5d4; font-size: 15px; }.model-selector { display: grid; gap: 19px; }.model-selector fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }.model-selector legend, .selector-city label { display: block; margin-bottom: 9px; color: #ffd17d; font-size: 12px; font-weight: 900; letter-spacing: .1em; }.choice-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }.choice-grid label { position: relative; min-width: 0; }.choice-grid input { position: absolute; opacity: 0; }.choice-grid span { min-height: 47px; display: grid; place-items: center; padding: 8px; border: 1px solid rgba(255,247,232,.33); border-radius: 9px; color: var(--cream); background: rgba(255,247,232,.06); font-size: 12px; font-weight: 800; text-align: center; cursor: pointer; }.choice-grid input:checked + span { border-color: #ffd17d; color: var(--green-deep); background: #ffd17d; }.selector-city input { width: 100%; min-height: 47px; padding: 0 12px; border: 1px solid rgba(255,247,232,.3); border-radius: 9px; outline: 0; color: var(--cream); background: rgba(255,247,232,.08); }.selector-city input::placeholder { color: #bdd1bd; }.selector-result { min-height: 69px; display: grid; align-content: center; gap: 3px; padding: 10px 14px; border-left: 3px solid #ffd17d; background: rgba(255,247,232,.08); }.selector-result strong { color: #ffd17d; font-size: 17px; }.selector-result span { color: #d8e5d4; font-size: 12px; }.model-selector .button:disabled { cursor: not-allowed; opacity: .5; }.model-selector .button { width: fit-content; }

.faq-section { background: #f3e6cb; }.faq-grid { display: grid; grid-template-columns: .75fr 1.25fr; align-items: start; gap: clamp(35px, 8vw, 120px); }.faq-intro { max-width: 360px; margin: 20px 0 25px; color: var(--muted); }.faq-list { display: grid; gap: 9px; }.faq-list details { border-bottom: 1px solid rgba(15,81,59,.18); }.faq-list summary { position: relative; padding: 16px 36px 16px 0; color: var(--green-deep); font-size: 17px; font-weight: 900; cursor: pointer; list-style: none; }.faq-list summary::-webkit-details-marker { display: none; }.faq-list summary::after { position: absolute; top: 12px; right: 2px; content: "+"; color: var(--orange); font-size: 26px; font-weight: 400; }.faq-list details[open] summary::after { content: "–"; }.faq-list details p { max-width: 640px; margin: -3px 0 15px; color: var(--muted); font-size: 14px; }

.enquiry-section { background: var(--cream); }.enquiry-grid { display: grid; grid-template-columns: .75fr 1.25fr; align-items: start; gap: clamp(35px, 7vw, 100px); }.enquiry-copy h2 { margin-bottom: 20px; }.enquiry-copy > p:not(.eyebrow) { max-width: 380px; margin-bottom: 26px; color: var(--muted); font-size: 16px; }.enquiry-contact { display: grid; gap: 8px; color: var(--green); font-weight: 900; }.enquiry-contact a { display: inline-flex; align-items: center; gap: 8px; }.enquiry-contact .icon { width: 18px; height: 18px; color: var(--orange); }.enquiry-form-wrap { position: relative; padding: 28px; border-radius: 18px; background: #f1dfbe; }.enquiry-form { position: relative; }.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px 13px; }.form-row { min-width: 0; display: grid; gap: 6px; }.form-row label, .form-row legend { color: var(--green-deep); font-size: 12px; font-weight: 900; }.form-row label span { color: var(--orange); }.form-row input, .form-row select, .form-row textarea { width: 100%; min-height: 45px; padding: 10px 12px; border: 1px solid rgba(15,81,59,.2); border-radius: 9px; outline: 0; color: var(--ink); background: var(--white); }.form-row textarea { min-height: 94px; resize: vertical; }.form-row select { appearance: auto; }.form-full { grid-column: 1 / -1; }.form-row fieldset { min-width: 0; border: 0; }.inline-options { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 6px; }.inline-options label { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; }.inline-options input { width: 16px; min-height: 16px; accent-color: var(--orange); }.enquiry-form > .button { margin-top: 19px; }.form-status { min-height: 21px; margin: 9px 0 0; color: var(--orange-dark); font-size: 13px; font-weight: 800; }.form-status.is-error { color: #9d3126; }.form-privacy { margin: 10px 0 0; color: var(--muted); font-size: 11px; }.honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }.form-success { padding: 30px 10px; text-align: center; }.form-success[hidden] { display: none; }.success-mark { width: 55px; height: 55px; display: grid; place-items: center; margin: 0 auto 16px; border-radius: 50%; color: var(--cream); background: var(--green); font-size: 30px; }.form-success h3 { margin-bottom: 8px; color: var(--green-deep); font-size: 25px; }.form-success p { margin: 0; color: var(--muted); }

.contact-section { background: var(--cream-soft); }.contact-card { display: grid; grid-template-columns: .9fr 1.1fr; gap: 40px; padding: 42px clamp(25px, 6vw, 70px); border-radius: 21px; background: #ecddc1; }.contact-card h2 { margin-bottom: 0; }.contact-details > p { max-width: 450px; margin: 5px 0 18px; color: var(--muted); }.contact-links { display: flex; flex-wrap: wrap; gap: 10px 21px; }.contact-links a { display: inline-flex; align-items: center; gap: 6px; color: var(--green); font-size: 14px; font-weight: 900; }.contact-links .icon { width: 16px; height: 16px; color: var(--orange); }
.site-footer { color: #d8e6d4; background: var(--green-deep); }.footer-top { display: grid; grid-template-columns: 1.2fr .85fr .95fr 1fr; gap: 30px; padding-top: 54px; padding-bottom: 45px; }.wordmark-light { width: 185px; }.footer-brand p { max-width: 260px; margin: 15px 0 0; color: #bcd2ba; font-family: Georgia, serif; font-style: italic; }.footer-column h2 { margin-bottom: 16px; color: #ffca78; font-size: 15px; letter-spacing: 0; }.footer-links { display: grid; justify-items: start; gap: 9px; font-size: 13px; font-weight: 700; }.footer-links a:hover { color: #ffca78; }.footer-column > p { margin: 0 0 12px; color: #bcd2ba; font-size: 13px; }.footer-column > p .icon { width: 15px; height: 15px; vertical-align: -.2em; color: #ffca78; }.footer-contact .icon { width: 15px; height: 15px; color: #ffca78; }.footer-bottom { min-height: 53px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-top: 1px solid rgba(219,235,212,.18); color: #a7c3a6; font-size: 11px; }
.desktop-franchise-cta { position: fixed; z-index: 45; top: 42%; right: 0; transform: rotate(-90deg) translateX(42%); transform-origin: right bottom; }.desktop-franchise-cta a { display: inline-flex; gap: 12px; align-items: center; padding: 11px 18px; border-radius: 11px 11px 0 0; color: var(--cream); background: var(--orange); font-size: 12px; font-weight: 900; box-shadow: 0 4px 14px rgba(43,54,35,.2); }.desktop-franchise-cta span { font-size: 19px; }.mobile-sticky-cta { display: none; }

.not-found-page { min-height: 100svh; display: grid; place-items: center; padding: 30px; background: var(--cream); }
.not-found-card { width: min(600px, 100%); padding: 52px; border: 2px solid var(--green-deep); border-radius: 20px; background: var(--cream-soft); box-shadow: 8px 8px 0 rgba(7,55,39,.13); }
.not-found-card > img { width: min(220px, 70%); margin-bottom: 38px; }
.not-found-card h1 { font-size: clamp(43px, 6vw, 68px); }
.not-found-card > p:not(.eyebrow) { max-width: 400px; margin-bottom: 24px; color: var(--muted); }
.js [data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity .62s ease, transform .62s cubic-bezier(.2,.7,.2,1); }.js [data-reveal].is-visible { opacity: 1; transform: none; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .hero-visual:hover .hero-visual:hover .hero-mascot { animation: mascotDrift 5.8s ease-in-out infinite; } }
@keyframes posterDrift { 0%,100% { transform: rotate(-1.4deg) translateY(0); } 50% { transform: rotate(-.8deg) translateY(-3px); } }
@keyframes mascotDrift { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-4px) rotate(.35deg); } }

@media (max-width: 1100px) {
    .container { width: min(var(--max-width), calc(100% - 40px)); }
    .primary-nav { gap: 8px; font-size: 11px; }
    .header-inner { gap: 14px; }
    .wordmark { width: 145px; }
    .header-cta { padding-inline: 12px !important; }
    .why-card { padding-inline: 19px; }
}
@media (max-width: 800px) {
    .section-space { padding: 66px 0; }
    .hero { min-height: 0; }.hero-grid { grid-template-columns: 1fr; gap: 0; }.hero-copy { padding: 48px 0 31px; }.hero-copy h1 { max-width: 650px; font-size: clamp(46px, 11vw, 68px); }.hero-intro { font-size: 17px; }.hero-visual { height: auto; min-height: 0; aspect-ratio: 1.12; margin-bottom: 24px; }.hero-mascot { width: 43%; }
    .snapshot-grid { grid-template-columns: repeat(3, 1fr); }.snapshot-ticket { padding-inline: 14px; }.snapshot-ticket:nth-child(4) { border-left: 1px dashed rgba(255,247,232,.37); }.snapshot-ticket:nth-child(n+4) { margin-top: 11px; }.snapshot-ticket strong { font-size: 19px; }
    .section-heading { display: block; }.section-lead { margin-top: 17px; }.why-grid { grid-template-columns: repeat(2, 1fr); }.model-stage { grid-template-columns: 1fr; gap: 25px; }.model-visual { max-width: 560px; }.space-grid, .selector-card, .faq-grid, .enquiry-grid { grid-template-columns: 1fr; gap: 35px; }.space-copy { max-width: 600px; }.format-render { max-width: 700px; }.location-layout { grid-template-columns: 1fr; }.map-card, .map-card iframe { min-height: 275px; }.city-prompt { align-items: stretch; flex-direction: column; gap: 15px; }.city-prompt > div { width: 100%; }.city-prompt input { flex: 1; width: auto; }.selector-card { padding: 32px 26px; }.contact-card { grid-template-columns: 1fr; }
    .desktop-franchise-cta { display: none; }.mobile-sticky-cta { position: fixed; right: 13px; bottom: 13px; left: 13px; z-index: 48; min-height: 49px; display: flex; align-items: center; justify-content: center; gap: 10px; border-radius: 13px; color: var(--cream); background: var(--orange); box-shadow: 0 7px 22px rgba(43,54,35,.23); font-size: 14px; font-weight: 900; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(110%); transition: opacity .25s ease, visibility .25s ease, transform .25s ease; }.mobile-sticky-cta.is-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }.mobile-sticky-cta .icon { width: 18px; height: 18px; }.site-footer { padding-bottom: 70px; }.enquiry-section { padding-bottom: 130px; }.footer-top { grid-template-columns: repeat(2, 1fr); }.footer-brand { grid-column: 1 / -1; }
    .nav-toggle { display: block; order: -1; }.nav-toggle .icon { width: 24px; height: 24px; }.primary-nav { position: absolute; top: calc(100% + 1px); right: 0; left: 0; display: grid; gap: 0; padding: 7px 16px 15px; background: var(--cream); border-bottom: 1px solid var(--line); box-shadow: 0 10px 20px rgba(20,52,37,.08); transform: translateY(-135%); transition: transform .25s ease; }.primary-nav.is-open { transform: translateY(0); }.primary-nav a { padding: 12px 6px; border-bottom: 1px solid var(--line); font-size: 14px; }.primary-nav a:last-child { border-bottom: 0; }.header-inner { min-height: 69px; justify-content: space-between; }.wordmark { width: 160px; }.header-cta { min-height: 40px !important; font-size: 12px; }
}
@media (max-width: 520px) {
    .container { width: calc(100% - 32px); }.section-space { padding: 57px 0; }.eyebrow { gap: 7px; font-size: 10px; letter-spacing: 2px; }.eyebrow span { width: 24px; }.eyebrow i { display: none; }.hero-copy { padding-top: 40px; }.hero-copy h1 { margin-bottom: 16px; font-size: clamp(42px, 13vw, 61px); }.hero-intro { font-size: 16px; }.hero-actions { display: grid; grid-template-columns: 1fr; }.hero-actions .button { width: 100%; }.hero-trust { gap: 8px; font-size: 10px; }.hero-trust .icon { width: 14px; height: 14px; }.hero-visual { aspect-ratio: .98; }.hero-mascot { right: 0; bottom: 3%; width: 42%; height: 62%; }.snapshot-grid { grid-template-columns: repeat(2, 1fr); }.snapshot-ticket { min-height: 69px; padding-inline: 12px; }.snapshot-ticket:nth-child(3) { border-left: 1px dashed rgba(255,247,232,.37); }.snapshot-ticket:nth-child(4) { margin-top: 0; }.snapshot-ticket:nth-child(5) { grid-column: 1 / -1; margin-top: 10px; border-left: 1px dashed rgba(255,247,232,.37); }.snapshot-ticket strong { font-size: 18px; }.why-grid { grid-template-columns: 1fr; }.why-card { min-height: 170px; }.why-card p { max-width: none; }.model-tabs { margin-top: 27px; }.model-tab { padding: 11px 9px; }.model-tab span { font-size: 20px; }.model-stage { margin-top: 21px; padding: 24px 16px 27px; }.model-visual figcaption { align-items: flex-start; flex-direction: column; gap: 3px; padding: 12px 13px 13px; }.model-panel h3 { font-size: 35px; }.model-panel dl { gap: 20px; }.model-panel dd { font-size: 17px; }.format-render figcaption { padding-inline: 13px; }.location-intro h2 { font-size: 41px; }.location-search { width: 100%; margin-top: 20px; }.location-card { grid-template-columns: 35px 1fr auto; gap: 8px; padding-inline: 10px; }.location-dot { width: 34px; height: 34px; }.location-card h3 { font-size: 14px; }.location-card p { font-size: 10px; }.city-prompt > div { display: grid; }.city-prompt input { width: 100%; }.choice-grid { grid-template-columns: 1fr; }.choice-grid span { min-height: 42px; }.selector-card { padding: 28px 19px; }.selector-result strong { font-size: 15px; }.model-selector .button { width: 100%; }.form-grid { grid-template-columns: 1fr; }.form-full { grid-column: auto; }.enquiry-form-wrap { padding: 21px 16px; }.inline-options { gap: 11px; }.contact-card { padding: 30px 22px; }.contact-card h2 { font-size: 39px; }.footer-top { grid-template-columns: 1fr; gap: 27px; }.footer-brand { grid-column: auto; }.footer-bottom { min-height: 70px; align-items: flex-start; flex-direction: column; justify-content: center; font-size: 10px; }.mobile-sticky-cta { bottom: max(13px, env(safe-area-inset-bottom)); }.wordmark { width: 130px; }
}

/* Mobile overflow guardrails: every layout child is allowed to shrink inside the viewport. */
.snapshot-grid, .why-grid, .tea-origin-layout, .tea-origin-products, .story-events, .form-grid, .choice-grid { min-width: 0; }
.story-event, .tea-origin-products article, .why-card, .form-row, .model-panel, .section-heading { min-width: 0; }
@media (max-width: 800px) {
    .snapshot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .why-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .location-intro { display: block; min-width: 0; }
    .location-search, .search-field { width: 100%; min-width: 0; }
    .location-search { margin-top: 22px; }
}
@media (max-width: 520px) {
    .snapshot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .why-grid, .form-grid, .choice-grid { grid-template-columns: minmax(0, 1fr); }
    .header-cta { display: none; }
    .header-inner { gap: 8px; }
    .nav-toggle { flex: 0 0 35px; padding-inline: 4px; }
    .wordmark { flex: 0 1 auto; width: 130px; }
    .hero, main, .site-footer { min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto !important; }
    *, *::before, *::after { animation: none !important; transition: none !important; }
    .js [data-reveal], .js [data-reveal].is-visible { opacity: 1; transform: none; }
}
@media (max-width: 800px) {
    .tea-origin-layout { grid-template-columns: 1fr; }
    .tea-origin-categories { padding: 22px 0 0; border-left: 0; }
    .tea-origin-products { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
    .story-photo-wrap { height: 190px; }
    .story-photo-wrap figcaption { right: 15px; bottom: 16px; left: 18px; font-size: 22px; }
    .tea-origin-feature { min-height: 220px; }
    .tea-origin-feature > img { min-height: 220px; }
    .tea-origin-products h3 { font-size: 15px; }
}

@media (max-width: 800px) {
    .story-timeline { margin-top: 48px; }
    .story-timeline-heading { display: block; }
    .story-timeline-heading > p:last-child { margin-top: 12px; }
    .story-events { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 27px 15px; }
    .story-event-final { grid-column: 1 / -1; }
    .process-journey { margin-top: 35px; padding: 23px 16px 21px; }
    .process-journey-intro { margin-bottom: 27px; }
    .process-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px 13px; }
    .process-ticket:nth-child(2), .process-ticket:nth-child(5) { transform: none; }
}

@media (max-width: 520px) {
    .story-photo-wrap { height: 205px; border-radius: 16px; }
    .story-photo-wrap figcaption { right: 18px; bottom: 20px; left: 18px; font-size: 25px; }
    .story-photo-stamp { top: 14px; right: 14px; padding: 5px 7px; font-size: 7px; }
    .story-timeline { margin-top: 42px; }
    .story-events { grid-template-columns: 1fr; gap: 19px; padding-top: 13px; }
    .story-events::before { top: 13px; right: auto; bottom: 16px; left: 14px; width: 2px; height: auto; background: repeating-linear-gradient(180deg, var(--orange) 0 7px, transparent 7px 13px); }
    .story-event, .story-event-final { grid-column: auto; padding-left: 37px; }
    .story-event::before, .story-event-final::before { top: 7px; left: 8px; }
    .story-event-date { min-height: 52px; align-items: center; padding-bottom: 10px; }
    .story-event-card, .story-event-final .story-event-card { min-height: 0; padding-top: 14px; }
    .story-event-final { padding-top: 12px; padding-right: 12px; }
    .process-journey { margin-right: -1px; margin-left: -1px; padding: 18px 11px 17px; border-radius: 18px; }
    .process-journey-rail { display: none; }
    .process-journey-intro { width: 100%; min-height: 104px; margin-bottom: 20px; padding: 13px 112px 13px 14px; }
    .process-journey-intro p { font-size: 16px; }
    .process-mascot { width: 104px; height: 129px; }
    .process-steps { grid-template-columns: 1fr; gap: 13px; }
    .process-ticket, .process-ticket:nth-child(2), .process-ticket:nth-child(3), .process-ticket:nth-child(5), .process-ticket:nth-child(6) { min-height: 0; transform: none; }
    .process-ticket-copy p { max-width: none; }
}

.brand-hero { min-height: clamp(610px, calc(100svh - 78px), 760px); background: #fff7e8; }
.brand-hero .hero-grid { grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr); }
.brand-hero .hero-copy { max-width: 650px; }
.brand-hero .hero-intro { max-width: 505px; }
.brand-hero .hero-franchise-prompt { max-width: 460px; margin: 18px 0 0; color: var(--muted); font-size: 13px; line-height: 1.4; }
.brand-hero .hero-franchise-prompt a { display: inline-flex; align-items: center; gap: 4px; color: var(--green); font-weight: 900; }
.brand-hero .hero-franchise-prompt .icon { width: 15px; height: 15px; color: var(--orange); }
.brand-hero-visual { overflow: visible; border-radius: 28px; background: var(--green-deep); box-shadow: 12px 14px 0 rgba(7,55,39,.12); }
.brand-hero-visual::before { position: absolute; inset: 20px; z-index: 0; border: 1px solid rgba(255,247,232,.28); border-radius: 22px; content: ""; }
.hero-photo { position: absolute; z-index: 1; overflow: hidden; border: 3px solid var(--ink); background: var(--green); box-shadow: 8px 9px 0 rgba(7,55,39,.24); }
.hero-photo img { width: 100%; height: 100%; object-fit: cover; }
.hero-photo-main { top: 8%; right: 13%; bottom: 12%; left: 10%; transform: rotate(-2.2deg); }
.hero-photo-detail { right: 3%; bottom: 8%; width: 42%; height: 34%; transform: rotate(3deg); }
.hero-note-card { position: absolute; z-index: 4; top: 7%; left: 3%; width: 43%; padding: 15px 17px; border: 3px solid var(--ink); color: var(--cream); background: var(--orange); box-shadow: 6px 7px 0 rgba(7,55,39,.2); transform: rotate(-3deg); }
.hero-note-card span { display: flex; align-items: center; gap: 6px; margin-bottom: 9px; color: #ffe1ab; font-size: 9px; font-weight: 900; letter-spacing: .12em; }
.hero-note-card .icon { width: 16px; height: 16px; }
.hero-note-card strong { display: block; font-size: clamp(18px, 2.2vw, 28px); line-height: .95; }
.hero-note-card em { color: var(--green-deep); font-style: normal; }
.brand-hero .hero-mascot { z-index: 5; right: -3%; bottom: 2%; width: 35%; height: 58%; filter: drop-shadow(0 10px 0 rgba(7,55,39,.2)); }

.outlet-films { color: var(--ink); background: #f3e6cb; }
.film-mosaic { display: grid; grid-template-columns: minmax(0, 1.03fr) minmax(0, .97fr); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 38px; }
.film-card { min-width: 0; overflow: hidden; border: 1px solid rgba(7,55,39,.13); border-radius: 20px; background: var(--green-deep); box-shadow: 0 11px 28px rgba(30,68,50,.08); }
.film-card-lead { grid-row: 1 / span 2; }
.film-frame { position: relative; overflow: hidden; border-radius: inherit; background: var(--green-deep); }
.film-card-lead .film-frame { height: 100%; }
.film-card-support .film-frame { aspect-ratio: 16 / 9; }
.film-poster, .film-frame video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.film-poster { z-index: 0; }
.film-frame video { z-index: 1; display: block; background: var(--green-deep); }
.film-frame video.is-static { opacity: 0; }
.film-frame::after { position: absolute; z-index: 2; inset: 0; pointer-events: none; content: ""; background: linear-gradient(180deg, rgba(7,55,39,.12), transparent 55%, rgba(7,55,39,.62)); }
.film-toggle { position: absolute; z-index: 4; right: 13px; bottom: 13px; width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; padding: 7px; border: 1px solid rgba(255,247,232,.62); border-radius: 999px; color: var(--cream); background: rgba(7,55,39,.58); font-size: 10px; font-weight: 900; backdrop-filter: blur(5px); }
.film-toggle:hover { color: var(--green-deep); background: var(--cream); }
.film-toggle span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.film-toggle .icon { width: 16px; height: 16px; }
.film-index { position: absolute; z-index: 4; top: 13px; left: 14px; color: var(--cream); font-size: 11px; font-weight: 900; letter-spacing: .15em; }

.franchise-bridge { color: var(--cream); background: var(--green-deep); }
.franchise-bridge.section-space { padding-block: 76px; }
.franchise-bridge-inner { display: grid; grid-template-columns: 1fr 1fr; align-items: end; gap: clamp(25px, 8vw, 130px); padding: clamp(28px, 4vw, 50px); border: 1px solid rgba(255,247,232,.2); border-radius: 24px; background: #12513b; box-shadow: 9px 9px 0 rgba(3,29,20,.2); }
.franchise-bridge h2 { color: var(--cream); }
.franchise-bridge .eyebrow { color: #ffcc78; }
.franchise-bridge-copy p { max-width: 500px; margin: 0 0 22px; color: #d8e5d4; font-size: 15px; }

@media (max-width: 800px) {
    .brand-hero .hero-grid { grid-template-columns: 1fr; }
    .brand-hero .hero-visual { height: auto; min-height: 0; aspect-ratio: 1.04; margin-bottom: 24px; }
    .brand-hero .hero-mascot { width: 32%; height: 55%; }
    .film-mosaic { grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; }
    .film-card-lead { grid-row: auto; grid-column: 1 / -1; }
    .film-card-lead .film-frame { height: auto; aspect-ratio: 16 / 10; }
    .franchise-bridge.section-space { padding-block: 58px; }
    .franchise-bridge-inner { grid-template-columns: 1fr; align-items: start; gap: 24px; }
}
@media (max-width: 520px) {
    .brand-hero .hero-copy { padding-bottom: 25px; }
    .brand-hero .hero-visual { aspect-ratio: .94; }
    .brand-hero .hero-mascot { width: 37%; height: 58%; }
    .hero-note-card { width: 52%; padding: 11px 12px; }
    .hero-note-card span { margin-bottom: 6px; font-size: 7px; }
    .hero-note-card strong { font-size: 18px; }
    .film-mosaic { display: grid; grid-template-columns: 1fr; gap: 13px; margin-top: 28px; }
    .film-card-lead { grid-column: auto; }
    .film-card-lead .film-frame, .film-card-support .film-frame { height: auto; aspect-ratio: 16 / 10; }
    .franchise-bridge-inner { padding: 25px 20px; }
    .franchise-bridge h2 { font-size: 39px; }
}

/* Hero carousel */
.hero-carousel { position: relative; min-height: inherit; display: flex; flex-direction: column; }
.hero-slides { min-height: inherit; flex: 1 1 auto; display: flex; }
.hero-slide { width: 100%; min-height: inherit; display: grid; grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr); align-items: center; gap: clamp(24px, 4vw, 58px); padding: 26px 0 80px; }
.hero-slide[hidden] { display: none; }
.hero-slide > .hero-copy { min-width: 0; }
.hero-slide h2 { max-width: 650px; margin: 0 0 20px; color: var(--green-deep); font-size: clamp(46px, 5.3vw, 78px); }
.hero-slide-story, .hero-slide-franchise { grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); }
.hero-feature-visual { position: relative; width: 100%; min-width: 0; margin: 0; overflow: hidden; border: 2px solid var(--green-deep); border-radius: 24px; background: var(--green-deep); box-shadow: 10px 11px 0 rgba(7,55,39,.14); aspect-ratio: 1586 / 992; }
.hero-feature-visual img { width: 100%; height: 100%; object-fit: cover; }
.hero-feature-visual::after { position: absolute; inset: 0; pointer-events: none; content: ""; background: linear-gradient(180deg, transparent 50%, rgba(7,55,39,.62)); }
.hero-feature-visual figcaption { position: absolute; z-index: 1; right: 22px; bottom: 18px; left: 22px; color: var(--cream); font-family: Georgia, serif; font-size: clamp(20px, 2.3vw, 31px); line-height: 1; }
.hero-model-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; max-width: 520px; margin-top: 25px; }
.hero-model-list span { display: grid; gap: 3px; padding: 11px 12px; border-left: 3px solid var(--orange); background: rgba(255,255,255,.62); }
.hero-model-list strong { color: var(--green-deep); font-size: 13px; }
.hero-model-list small { color: var(--muted); font-size: 11px; line-height: 1.25; }
.hero-controls { position: absolute; z-index: 6; right: 0; bottom: 22px; left: 0; display: flex; align-items: center; gap: 9px; }
.hero-control { width: 36px; height: 36px; display: inline-grid; place-items: center; padding: 7px; border: 1px solid rgba(7,55,39,.25); border-radius: 50%; color: var(--green-deep); background: rgba(255,253,248,.78); }
.hero-control:hover { color: var(--cream); background: var(--green); }
.hero-control .icon { width: 17px; height: 17px; }
.hero-dots { display: flex; align-items: center; gap: 7px; margin-inline: 2px auto; }
.hero-dot { width: 10px; height: 10px; padding: 0; border: 1px solid var(--green); border-radius: 50%; background: transparent; }
.hero-dot.is-active { width: 28px; border-radius: 8px; background: var(--orange); }

/* Menu Explorer: one category at a time, with a tactile rail and a floating food visual. */
.menu-section.section-space { padding-bottom: clamp(88px, 7vw, 112px); }
.menu-section .container { min-width: 0; }
@media (min-width: 801px) {
    .menu-section .container { padding-right: clamp(20px, 3vw, 46px); }
}
.menu-explorer { position: relative; min-width: 0; margin-top: 38px; }
.menu-explorer-header { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.menu-explorer-kicker { margin: 0; color: var(--orange-dark); font-size: 10px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.menu-explorer-total { margin: 0; color: var(--muted); font-size: 12px; font-weight: 800; }
.menu-explorer-total span { color: var(--green-deep); font-size: 18px; }
.menu-rail-shell { position: relative; margin-top: 15px; border-bottom: 1px solid rgba(15, 81, 59, .18); }
.menu-rail { display: flex; align-items: stretch; gap: 7px; min-width: 0; overflow-x: auto; padding: 0 2px 10px; scrollbar-color: var(--orange) rgba(15, 81, 59, .1); scrollbar-width: thin; overscroll-behavior-x: contain; }
.menu-rail::-webkit-scrollbar { height: 5px; }
.menu-rail::-webkit-scrollbar-track { background: rgba(15, 81, 59, .08); }
.menu-rail::-webkit-scrollbar-thumb { border-radius: 99px; background: var(--orange); }
.menu-tab { min-width: 142px; min-height: 76px; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; align-content: center; gap: 2px 9px; flex: 0 0 auto; padding: 12px 14px; border: 1px solid rgba(15, 81, 59, .18); border-radius: 15px 15px 8px 8px; color: var(--green-deep); background: rgba(255, 253, 248, .66); text-align: left; transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease; }
.menu-tab:hover { border-color: var(--orange); transform: translateY(-2px); }
.menu-tab.is-active { border-color: var(--green-deep); color: var(--cream); background: var(--green-deep); box-shadow: 4px 5px 0 rgba(7, 55, 39, .13); transform: translateY(-2px); }
.menu-tab-number { grid-row: 1 / span 2; align-self: start; color: var(--orange); font-size: 11px; font-weight: 900; letter-spacing: .1em; }
.menu-tab.is-active .menu-tab-number { color: #ffd18c; }
.menu-tab-label { min-width: 0; font-size: 13px; font-weight: 900; line-height: 1.06; }
.menu-tab small { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.menu-tab.is-active small { color: #cfe1cc; }
.menu-explorer-stage { display: grid; grid-template-columns: minmax(0, .87fr) minmax(0, 1.13fr); align-items: stretch; gap: 18px; min-width: 0; margin-top: 21px; }
.menu-feature-visual { --menu-visual-safe-bottom: clamp(110px, 20%, 136px); --menu-image-scale: 1; --menu-image-x: 0%; --menu-image-y: 0%; --menu-image-rotation: -4deg; position: relative; isolation: isolate; min-width: 0; min-height: clamp(390px, 39vw, 560px); overflow: hidden; margin: 0; border: 1px solid rgba(7, 55, 39, .22); border-radius: 25px; color: var(--cream); background: var(--green-deep); box-shadow: 10px 11px 0 rgba(7, 55, 39, .12); }
.menu-feature-visual::before { position: absolute; inset: 15px; z-index: -1; border: 1px solid rgba(255, 247, 232, .24); border-radius: 19px; content: ""; }
.menu-feature-image-wrap { position: absolute; z-index: 1; top: 7%; right: 5%; bottom: var(--menu-visual-safe-bottom); left: 5%; display: grid; place-items: center; transform: translate3d(var(--menu-parallax-x, 0), var(--menu-parallax-y, 0), 0); transition: transform .22s ease-out; will-change: transform; }
.menu-feature-image-wrap::before { position: absolute; width: 71%; height: 71%; border-radius: 50%; content: ""; background: radial-gradient(circle, rgba(248, 165, 50, .95) 0 47%, rgba(248, 165, 50, .26) 48% 61%, transparent 62%); opacity: .86; }
.menu-feature-image-wrap img { position: relative; min-width: 0; min-height: 0; width: min(100%, 520px); height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; border: 0; border-radius: 0; filter: drop-shadow(0 14px 0 rgba(0, 0, 0, .16)) drop-shadow(0 10px 20px rgba(0, 0, 0, .22)); mix-blend-mode: normal; transform: translate3d(var(--menu-image-x, 0%), var(--menu-image-y, 0%), 0) rotate(var(--menu-image-rotation, -4deg)) scale(var(--menu-image-scale, 1)); animation: menuFoodFloat 6s ease-in-out infinite; }
.menu-feature-visual[data-menu-shape="portrait"] { --menu-image-scale: .94; --menu-image-y: -1%; }
.menu-feature-visual[data-menu-shape="square"] { --menu-image-scale: .96; --menu-image-y: -1%; }
.menu-feature-visual[data-menu-shape="landscape"] { --menu-image-scale: .98; }
/* Optical tuning for transparent canvases whose visible subject sits off-centre. */
.menu-feature-visual[data-menu-key="tea-coffee"] { --menu-image-scale: .97; --menu-image-x: -3%; --menu-image-y: -2%; }
.menu-feature-visual[data-menu-key="cold-coffee-shakes"] { --menu-image-scale: .9; --menu-image-x: -2%; --menu-image-y: -4%; }
.menu-feature-visual[data-menu-key="iced-tea-coolers"] { --menu-image-scale: .91; --menu-image-x: -1%; --menu-image-y: -3%; }
.menu-feature-visual[data-menu-key="samosas"] { --menu-image-x: -4%; }
.menu-feature-visual[data-menu-key="buns"] { --menu-image-x: -1.5%; }
.menu-feature-visual[data-menu-key="wraps"] { --menu-image-x: 1%; }
.menu-feature-visual[data-menu-key="pasta"] { --menu-image-scale: .93; --menu-image-x: -1%; --menu-image-y: -2%; }
.menu-feature-visual[data-menu-key="desserts"] { --menu-image-scale: .96; --menu-image-x: -3%; --menu-image-y: 1%; }
.menu-feature-ring { position: absolute; z-index: 0; display: block; border: 1px solid rgba(255, 247, 232, .27); border-radius: 50%; pointer-events: none; }
.menu-feature-ring-one { top: 8%; right: -18%; width: 270px; height: 270px; }
.menu-feature-ring-two { bottom: -12%; left: -13%; width: 235px; height: 235px; border-style: dashed; opacity: .6; }
.menu-feature-spark { position: absolute; z-index: 2; top: 16%; left: 12%; color: #ffd18c; font-size: 28px; transform: rotate(12deg); }
.menu-feature-visual figcaption { position: absolute; z-index: 3; right: 24px; bottom: 22px; left: 24px; display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.menu-feature-visual figcaption span { font-family: Georgia, serif; font-size: clamp(27px, 3vw, 42px); line-height: .95; }
.menu-feature-visual figcaption small { color: #ffd18c; font-size: 10px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.menu-details { min-width: 0; padding: clamp(23px, 3.5vw, 43px) clamp(21px, 4vw, 55px) clamp(21px, 3.5vw, 39px); border: 1px solid rgba(15, 81, 59, .18); border-radius: 25px; background: var(--white); box-shadow: 0 12px 28px rgba(30, 68, 50, .07); }
.menu-detail[hidden] { display: none; }
.menu-detail.is-active { animation: menuDetailIn .34s ease both; }
.menu-detail-kicker { margin: 0 0 13px; color: var(--orange-dark); font-size: 10px; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
.menu-detail h3 { max-width: 600px; margin: 0; color: var(--green-deep); font-size: clamp(35px, 4.1vw, 61px); letter-spacing: -.06em; line-height: .92; }
.menu-detail-meta { display: flex; flex-wrap: wrap; gap: 9px 16px; margin: 18px 0 16px; color: var(--muted); font-size: 10px; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.menu-detail-meta span:first-child { color: var(--orange-dark); }
.menu-items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(16px, 3vw, 36px); margin: 0; padding: 0; list-style: none; }
.menu-items li { min-width: 0; display: grid; grid-template-columns: 25px minmax(0, 1fr); align-items: start; gap: 8px; padding: 12px 0 11px; border-top: 1px solid rgba(15, 81, 59, .16); }
.menu-item-number { color: var(--orange); font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.menu-item-name { min-width: 0; color: var(--green-deep); font-size: clamp(14px, 1.25vw, 17px); font-weight: 900; line-height: 1.12; overflow-wrap: anywhere; }
.menu-explorer-controls { display: flex; align-items: center; gap: 11px; margin-top: 20px; }
.menu-control { width: 42px; height: 42px; display: inline-grid; place-items: center; flex: 0 0 auto; padding: 9px; border: 1px solid rgba(7, 55, 39, .27); border-radius: 50%; color: var(--green-deep); background: var(--cream-soft); }
.menu-control:hover { color: var(--cream); background: var(--green-deep); }
.menu-control .icon { width: 18px; height: 18px; }
.menu-progress { min-width: 0; display: flex; align-items: center; gap: 13px; flex: 1 1 auto; color: var(--muted); font-size: 10px; font-weight: 900; letter-spacing: .12em; }
.menu-progress-track { position: relative; display: block; width: min(260px, 32vw); height: 3px; overflow: hidden; border-radius: 99px; background: rgba(15, 81, 59, .16); }
.menu-progress-track i { display: block; width: 5.56%; height: 100%; border-radius: inherit; background: var(--orange); transition: width .25s ease; }
.menu-category-note { max-width: 760px; margin: 23px 0 0; color: var(--muted); font-size: 13px; }
@keyframes menuFoodFloat { 0%, 100% { transform: translate3d(var(--menu-image-x, 0%), var(--menu-image-y, 0%), 0) rotate(var(--menu-image-rotation, -4deg)) scale(var(--menu-image-scale, 1)); } 50% { transform: translate3d(var(--menu-image-x, 0%), calc(var(--menu-image-y, 0%) - 8px), 0) rotate(calc(var(--menu-image-rotation, -4deg) + 2deg)) scale(var(--menu-image-scale, 1)); } }
@keyframes menuDetailIn { from { opacity: .45; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.tea-origin-section.section-space { padding-top: 0; }
.tea-origin-feature > img { opacity: .92; }
.tea-origin-products { gap: 15px; }
.tea-origin-products { align-items: start; }
.tea-origin-products article { grid-template-rows: auto auto; align-self: start; gap: 10px; padding: 10px 10px 14px; border: 1px solid rgba(15,81,59,.12); border-radius: 15px; background: rgba(255,253,248,.46); }
.tea-origin-products img { height: auto; aspect-ratio: 3 / 4; object-fit: contain; padding: 5px; border-radius: 10px; background: #f7f0e4; }
.tea-origin-products h3 { padding-inline: 3px; }
.section-lead .icon { width: 18px; height: 18px; color: var(--orange); vertical-align: -.22em; }
.footer-bottom a { color: #ffd18c; font-weight: 800; }

@media (max-width: 800px) {
    .hero-slide, .hero-slide-story, .hero-slide-franchise { grid-template-columns: 1fr; gap: 0; padding: 26px 0 78px; }
    .hero-slide .hero-copy { padding: 24px 0 28px; }
    .hero-feature-visual { max-width: 700px; }
    .hero-model-list { max-width: none; }
    .menu-explorer-stage { grid-template-columns: 1fr; gap: 15px; }
    .menu-feature-visual { min-height: clamp(315px, 58vw, 470px); }
    .menu-details { padding: 28px clamp(20px, 5vw, 42px) 25px; }
    .hero-controls { bottom: 15px; }
}
@media (max-width: 520px) {
    .hero-slide .hero-copy { padding: 18px 0 24px; }
    .hero-slide h2 { font-size: clamp(42px, 13vw, 61px); }
    .hero-feature-visual { border-radius: 17px; }
    .hero-feature-visual figcaption { right: 16px; bottom: 14px; left: 16px; font-size: 21px; }
    .hero-model-list { grid-template-columns: 1fr; }
    .menu-section.section-space { padding-bottom: 118px; }
    .menu-explorer { margin-top: 28px; }
    .menu-tab { min-width: 132px; min-height: 70px; padding: 11px 12px; }
    .menu-tab-label { font-size: 12px; }
    .menu-feature-visual { min-height: 315px; border-radius: 18px; }
    .menu-feature-visual::before { inset: 11px; border-radius: 14px; }
    .menu-feature-visual { --menu-visual-safe-bottom: 104px; }
    .menu-feature-image-wrap { top: 7%; bottom: var(--menu-visual-safe-bottom); }
    .menu-feature-image-wrap img { width: min(100%, 350px); height: min(100%, 320px); }
    .menu-feature-visual figcaption { right: 18px; bottom: 18px; left: 18px; align-items: start; flex-direction: column; gap: 5px; }
    .menu-feature-visual figcaption span { font-size: 31px; }
    .menu-details { padding: 24px 17px 19px; border-radius: 18px; }
    .menu-detail h3 { font-size: clamp(35px, 11vw, 49px); }
    .menu-detail-meta { margin-top: 15px; }
    .menu-items { grid-template-columns: 1fr; }
    .menu-items li { min-height: 45px; align-items: center; }
    .menu-item-name { font-size: 15px; }
    .menu-explorer-controls { margin-top: 16px; }
    .menu-control { width: 44px; height: 44px; }
    .menu-progress { gap: 8px; font-size: 9px; }
    .menu-progress-track { width: auto; flex: 1 1 auto; }
    .hero-controls { gap: 7px; }
    .hero-control { width: 33px; height: 33px; }
}

/* Tea Origin: let the heading introduce a measured two-part feature. */
.tea-origin-section.section-space { padding-top: clamp(62px, 7vw, 92px); }
.tea-origin-section.section-space { padding-bottom: clamp(44px, 4vw, 58px); }
.story-section.section-space { padding-top: clamp(56px, 5vw, 70px); }
.tea-origin-section .section-heading { align-items: end; gap: clamp(24px, 5vw, 70px); }
.tea-origin-section .section-heading h2 { font-size: clamp(40px, 4vw, 56px); line-height: .98; }
.tea-origin-section .section-lead { max-width: 380px; }
.tea-origin-layout { margin-top: clamp(25px, 3vw, 38px); align-items: stretch; }
.tea-origin-feature { min-height: 270px; }
.tea-origin-feature > img { min-height: 0; height: 100%; }
.tea-origin-categories { min-width: 0; padding: 25px 0 18px 27px; }
.tea-origin-products { margin-top: 27px; }

/* Timeline: five factual milestones, with enough room for dates at every width. */
.story-timeline { margin-top: clamp(45px, 5vw, 62px); }
.story-events { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 15px; }
.story-event-date { min-height: 85px; }
.story-event-date time { font-size: clamp(19px, 2.1vw, 29px); line-height: .98; }
.story-event-card { min-height: 216px; padding-top: 17px; }
.story-event-card h3 { font-size: clamp(18px, 1.65vw, 22px); line-height: 1.02; }
.story-event-card p { font-size: 12px; line-height: 1.4; }
.story-event-final { padding: 13px 14px 0; border: 2px solid var(--green-deep); background: var(--saffron); box-shadow: 5px 5px 0 rgba(7, 55, 39, .13); }
.story-event-final::before { top: -30px; left: 27px; }
.story-event-final .story-event-date { border-bottom-color: var(--ink); }
.story-event-final .story-event-card { min-height: 202px; }
.story-event-final .story-event-label { color: var(--green-deep); }
.story-event-final .story-event-card p { color: var(--ink); }

@media (max-width: 1000px) {
    .story-events { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 27px 15px; }
    .story-event-final { grid-column: 1 / -1; }
    .story-event-final .story-event-card { min-height: 0; }
}
@media (max-width: 800px) {
    .tea-origin-layout { grid-template-columns: 1fr; }
    .tea-origin-feature { min-height: 250px; }
    .tea-origin-categories { padding: 22px 0 0; border-left: 0; }
}
@media (max-width: 520px) {
    .tea-origin-section.section-space { padding-top: 57px; }
    .tea-origin-section.section-space { padding-bottom: 42px; }
    .story-section.section-space { padding-top: 52px; }
    .tea-origin-section .section-heading h2 { font-size: clamp(39px, 12vw, 52px); }
    .tea-origin-feature { min-height: 220px; }
    .tea-origin-feature > img { min-height: 220px; }
    .story-events { grid-template-columns: 1fr; gap: 19px; padding-top: 13px; }
    .story-events::before { top: 13px; right: auto; bottom: 16px; left: 14px; width: 2px; height: auto; background: repeating-linear-gradient(180deg, var(--orange) 0 7px, transparent 7px 13px); }
    .story-event, .story-event-final { grid-column: auto; padding-left: 37px; }
    .story-event::before, .story-event-final::before { top: 7px; left: 8px; }
    .story-event-date { min-height: 52px; align-items: center; padding-bottom: 10px; }
    .story-event-card, .story-event-final .story-event-card { min-height: 0; padding-top: 14px; }
    .story-event-final { padding-top: 12px; padding-right: 12px; }
}