:root {
  --ove-paper: #f3efdf;
  --ove-ink: #35472a;
  --ove-grove: #3f5034;
  --ove-pistachio: #dde2ba;
  --ove-clay: #be6848;
  --ove-linen: #e7dfce;
  --ove-honey: #dfb86c;
}
html { scroll-padding-top: 110px; }
body { background: var(--ove-paper); color: var(--ove-ink); font-family: 'OveFinal', serif !important; }
/* Use the local brand fonts throughout, including legacy utility classes. */
body p, body a, body button, body input, body select, body textarea,
body label, body li, body span, body .font-body, body .graza-body,
body .graza-tagline, body .graza-fun-fact, body .font-sans {
  font-family: 'OveFinal', serif !important;
}
body h1, body h2, body h3, body h4, body h5, body h6, body .ove-hero h1 em,
body .graza-headline, body .font-display {
  font-family: 'Atelia', serif !important;
  font-weight: 400;
}
body::after { content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 10000; opacity: .035; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%2354432a' filter='url(%23n)' opacity='.5' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
button, select { cursor: pointer; }
button:disabled { cursor: not-allowed; }
:focus-visible { outline: 3px solid var(--ove-clay); outline-offset: 5px; }
.skip-link { position: fixed; left: 25px; top: -100px; z-index: 10001; padding: 12px 20px; background: var(--ove-paper); color: var(--ove-ink); }
.skip-link:focus { top: 20px; }
.font-body, .graza-body, .graza-tagline, .font-sans { font-family: 'OveFinal', serif; }
.graza-body { font-size: 16px; line-height: 1.7; }
.graza-tagline { font-size: 12px; line-height: 1.5; letter-spacing: .12em; }
.graza-headline { font-weight: 400; letter-spacing: -.045em; line-height: 1.08; }
.text-brand-orange { color: var(--ove-clay); }
.text-brand-green, .text-text-dark { color: var(--ove-ink); }
.text-warm-gray { color: #66705a; }
.bg-cream, .bg-brand-cream { background-color: var(--ove-paper); }
.bg-soft-beige { background-color: var(--ove-linen); }
.bg-brand-green, .bg-text-dark { background-color: var(--ove-grove); }
.border-brand-green { border-color: var(--ove-ink); }
.doodle, .bg-infusion-icon, #floating-o-icon, #heads-up-icon { display: none !important; }
.scroll-fade-up, .scroll-fade-in, .scroll-scale-in, .scroll-slide-left, .scroll-slide-right, .stagger-children > *, .fade-in { opacity: 1; transform: none; }
.animate-marquee { animation: none; }
.ove-nav { top: 22px !important; left: 3%; width: 94% !important; background: rgba(243,239,223,.96) !important; color: var(--ove-ink); border-radius: 5px; border: 1px solid rgba(53,71,42,.15); box-shadow: 0 6px 24px #28351f0c; z-index: 50; }
.ove-nav > div:first-child { max-width: none; padding: 12px 25px; min-height: 66px; }
.ove-wordmark { display: block; flex-shrink: 0; }
.ove-header-logo { display: block; width: 100px; height: auto; filter: brightness(0) saturate(100%) invert(24%) sepia(16%) saturate(1079%) hue-rotate(52deg) brightness(92%) contrast(88%); }
.ove-nav .font-body { font-family: 'OveFinal', serif; font-size: 14px; text-transform: none; letter-spacing: .02em; color: var(--ove-ink); }
.ove-nav .space-x-10 { gap: 27px; }
.ove-nav .space-x-10 > * { margin-left: 0 !important; }
.ove-nav a:hover { color: var(--ove-clay); }
.ove-nav .ove-offer { background: var(--ove-pistachio) !important; border-radius: 2px; padding: 10px 15px; }
.ove-nav button { color: var(--ove-ink); }
#mobile-menu { top: 78px; background: var(--ove-paper); border: 1px solid #35472a26; border-radius: 4px; max-height: calc(100dvh - 110px); overflow: auto; }
#mobile-menu .font-body { font-size: 17px; }
.ove-hero { min-height: 100dvh; display: grid; grid-template-columns: 46% 54%; position: relative; padding: 0 !important; background: var(--ove-grove); color: var(--ove-paper); overflow: hidden; }
.ove-hero-copy { padding: 125px 5vw 85px 6vw; display: flex; flex-direction: column; justify-content: center; position: relative; z-index: 2; min-width: 0; }
.ove-eyebrow { font: 11px/1.5 'OveFinal', serif; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 28px; }
.ove-hero h1 { font-family: 'Atelia', serif; font-size: clamp(48px, 5.1vw, 80px); font-weight: 400; line-height: 1.08; letter-spacing: -.04em; margin: 0 0 24px; }
.ove-hero h1 em { color: var(--ove-honey); font-style: normal; }
.ove-hero-copy > p:not(.ove-eyebrow) { max-width: 315px; font-size: 15px; line-height: 1.7; color: #e0e1cb; }
.ove-hero-actions { margin-top: 28px; display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.ove-button { padding: 16px 23px; display: inline-flex; align-items: center; justify-content: space-between; gap: 38px; background: var(--ove-paper); color: var(--ove-ink); font-size: 12px; border: 1px solid transparent; border-radius: 3px; }
.ove-button:hover { background: var(--ove-pistachio); }
.ove-text-link { font-size: 12px; border-bottom: 1px solid currentColor; padding-bottom: 4px; }
.ove-hero-media { position: relative; min-width: 0; background: #aaa286 url('attached_assets/WhatsApp_Image_2026-09-22_at_23.53.16_1790840381595.jpeg') center/cover; }
.ove-hero-media video { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; object-position: 50% 50%; }
.ove-hero-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg,#27332375,transparent 38%); pointer-events: none; }
.ove-media-label { position: absolute; bottom: 36px; left: 30px; z-index: 2; font-size: 11px; letter-spacing: .1em; color: var(--ove-paper); }
.ove-video-controls { position: absolute; bottom: 29px; right: 28px; z-index: 3; display: flex; gap: 8px; }
.ove-video-controls button { min-height: 42px; padding: 10px 13px; border: 1px solid #f3efdf88; background: #35472a8c; border-radius: 3px; color: var(--ove-paper); font: 11px 'OveFinal', serif; backdrop-filter: blur(10px); }
.ove-hero-foot { position: absolute; bottom: 30px; left: 6vw; font-size: 10px; letter-spacing: .13em; }
.ove-values { padding: 22px 6vw !important; background: var(--ove-pistachio) !important; }
.ove-values .animate-marquee { display: flex; justify-content: space-between; white-space: normal; gap: 20px; }
.ove-values span { margin: 0 !important; color: var(--ove-ink); font-size: 10px; letter-spacing: .12em; }
.ove-values span:nth-child(n+9) { display: none; }
.ove-intro { padding: 125px 6vw 120px !important; background: var(--ove-paper); }
.ove-intro-heading { display: grid; grid-template-columns: 1fr 2fr; align-items: start; gap: 40px; margin-bottom: 70px; }
.ove-intro h2, .ove-keeping h2 { font-family: 'Atelia', serif; font-size: clamp(44px,5.4vw,80px); line-height: 1.1; letter-spacing: -.045em; font-weight: 400; }
.ove-intro-gallery { display: grid; grid-template-columns: 1.25fr 1fr; gap: 8vw; align-items: center; }
.ove-image-window { position: relative; overflow: hidden; background: var(--ove-linen); }
.ove-image-window img { width: 100%; height: 100%; object-fit: cover; }
.ove-intro-gallery .ove-image-window { aspect-ratio: 4/4.6; }
.ove-intro-notes { padding-top: 50px; }
.ove-intro-notes .ove-image-window { aspect-ratio: 4/3; margin-bottom: 30px; }
.ove-intro-notes .ove-image-window img { object-position: center 72%; }
.ove-intro-notes h3 { font-family: 'Atelia', serif; font-size: 36px; line-height: 1.2; margin-bottom: 15px; }
.ove-intro-notes p { max-width: 360px; font-size: 15px; line-height: 1.8; }
.ove-caption { font-size: 10px; letter-spacing: .08em; margin-top: 17px; display: flex; justify-content: space-between; }
.ove-origin { height: 85vh; min-height: 520px; padding: 0 !important; position: relative; overflow: hidden; color: var(--ove-paper); }
.ove-origin .ove-landscape { position: absolute; inset: -15% 0; width: 100%; height: 130%; object-fit: cover; }
.ove-origin::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg,#263823a6,#34422e15 90%); }
.ove-origin-copy { position: relative; z-index: 2; height: 100%; padding: 80px 6vw; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; }
.ove-origin h2 { font-family: 'Atelia',serif; font-size: clamp(52px,7vw,100px); max-width: 800px; line-height: 1.06; letter-spacing: -.04em; margin-bottom: 25px; }
.ove-origin-copy > p:last-child { max-width: 360px; font-size: 14px; line-height: 1.7; }
#infusions { background: var(--ove-pistachio); padding: 110px 0; }
#infusions .max-w-7xl, #products .max-w-7xl, #story .max-w-7xl, #showcase .max-w-7xl { max-width: 1440px; padding-left: 6vw; padding-right: 6vw; }
#infusions h2, #products h2 { font-size: clamp(46px,5.4vw,76px); color: var(--ove-ink); }
#infusions .max-w-2xl > p, #products .max-w-2xl > p { font-size: 16px; max-width: 490px; }
.graza-fun-fact { transform: none; background: none; color: var(--ove-ink); border-left: 1px solid #35472a55; border-radius: 0; padding: 0 0 0 24px; font-family: 'OveFinal', serif; font-size: 13px; line-height: 1.8; margin: 0 0 8px; }
#infusions .stagger-children { grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 5vw; row-gap: 0; }
#infusions .stagger-children > div { background: transparent; border: none; border-top: 1px solid #35472a40; padding: 25px 0; display: grid; grid-template-columns: 1.05fr 1fr; column-gap: 15px; cursor: default; }
#infusions .stagger-children > div > div { grid-row: span 2; margin: 0; gap: 18px; }
#infusions .stagger-children h3 { font-size: 25px; color: var(--ove-ink); }
#infusions .stagger-children img { width: 48px; height: 58px; }
#infusions .stagger-children p { font-size: 13px; color: var(--ove-ink); padding-top: 0; }
#infusions .stagger-children p:last-child { font-size: 11px; color: #66705a; padding-top: 5px; margin-top: 0; }
#infusions .stagger-children > div:hover { background: transparent; color: inherit; }
.ove-philosophy { height: 76vh !important; min-height: 480px; padding: 0 !important; }
.ove-philosophy .parallax-slow { inset: -15% 0; }
.ove-philosophy .bg-brand-green\/70 { background: #28351f45; }
.ove-philosophy h2 { font-size: clamp(52px,6.5vw,94px); line-height: 1.05; }
.ove-philosophy .graza-body { font-size: 11px; letter-spacing: .1em; }
#showcase { background: #e9e0d0; padding: 100px 0 80px; min-height: 0; }
#showcase .graza-headline { font-size: clamp(48px,5.5vw,80px); }
#showcase-description { font-size: 15px; max-width: 410px; }
#showcase-perfect { font-size: 12px; }
#showcase-image { width: 100%; max-width: 470px; height: 100%; mix-blend-mode: multiply; }
#showcase .showcase-dot { width: 30px; height: 30px; border: 9px solid #e9e0d0; }
#showcase .showcase-name { font-size: 12px; line-height: 1.8; padding: 8px 4px; }
.graza-btn, .graza-btn-outline { font-family: 'OveFinal',serif; font-size: 11px; padding: 16px 24px; border-width: 1px; letter-spacing: .08em; border-radius: 2px; background: var(--ove-grove); border-color: var(--ove-grove); color: var(--ove-paper); transition: none; }
.graza-btn-outline { background: none; color: var(--ove-ink); }
.graza-btn:hover, .graza-btn-outline:hover { background: var(--ove-clay); border-color: var(--ove-clay); color: var(--ove-paper); }
#products { padding: 120px 0; background: var(--ove-paper); }
#products .stagger-children { gap: 80px 5vw; }
#products .group > div:first-child { padding: 30px; background: #e5e4cf; border-radius: 3px; margin-bottom: 25px; }
#products .group:nth-child(2) > div:first-child { background: #e9d9d2; }
#products .group:nth-child(3) > div:first-child { background: #d7dfd5; }
#products .group:nth-child(4) > div:first-child { background: #e9ddb8; }
#products .group > div:first-child img { height: clamp(280px,34vw,500px); mix-blend-mode: multiply; }
#products .group > div:first-child span { background: transparent; color: var(--ove-ink); font-size: 10px; }
#products .group h3 { font-size: 32px; }
#products .group > p { font-size: 13px; min-height: 40px; }
#products select { border: 1px solid #35472a55; background: transparent; border-radius: 2px; padding: 14px; font-size: 13px; color: var(--ove-ink); }
#products input[type=number] { font-size: 14px; height: 36px; border-radius: 2px; background: transparent; border-color: #35472a55; }
#products .group button { border-radius: 2px; background: var(--ove-grove); color: var(--ove-paper); font-size: 11px; }
#products .group .w-8 { background: var(--ove-linen); color: var(--ove-ink); width: 36px; height: 36px; }
#products .group > button { padding: 17px; }
#products .group > button:hover { background: var(--ove-clay); }
.ove-keeping { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; background: var(--ove-pistachio); padding: 100px 6vw !important; align-items: center; }
.ove-keeping .ove-image-window { aspect-ratio: 1; }
.ove-keeping p:not(.ove-eyebrow) { margin: 25px 0; font-size: 15px; max-width: 390px; line-height: 1.8; }
.ove-keeping .ove-button { background: var(--ove-grove); color: var(--ove-paper); }
#story { padding: 120px 0; background: var(--ove-grove); }
#story .grid { gap: 8vw; align-items: center; }
#story .graza-headline { font-size: clamp(48px,5vw,72px); }
#story .graza-body { font-size: 14px; line-height: 1.85; }
#story .graza-tagline { color: var(--ove-honey); font-size: 11px; }
#story .mt-8 { background: transparent; color: var(--ove-honey); padding: 24px 0 0; border-top: 1px solid #f3efdf50; transform: none; font-size: 12px; text-transform: none; }
#story .mt-8 img { display: none; }
#story img { max-height: 750px; border-radius: 3px; }
footer { background: #303e29 !important; padding: 28px 0 16px !important; }
footer .grid { gap: 24px; margin-bottom: 18px; }
footer .border-t { padding-top: 12px; }
footer .graza-body { font-size: 12px; }
footer .graza-tagline { font-size: 16px; color: var(--ove-honey); }
footer h4 { font-size: 18px !important; margin-bottom: 8px; }
footer ul { display: grid; grid-template-columns: repeat(2, max-content); gap: 8px 18px; }
footer ul > li { margin: 0 !important; }
footer .bg-gray-700 { background: #536149; }
footer a[target=_blank] { flex-shrink: 0; }
.ove-footer-logo { display: block; float: left; height: 36px; width: auto; margin: 2px 14px 8px 0; }
#floating-cart { z-index: 49; }
#floating-cart button { border-radius: 3px; background: var(--ove-clay); }
#floating-cart .graza-body { font-size: 11px; }
#floating-cart-count { background: var(--ove-paper); color: var(--ove-ink); }
#order-popup, #collection-cart-popup, #success-popup { z-index: 70; backdrop-filter: blur(7px); }
#order-popup > div, #collection-cart-popup > div, #success-popup > div { background: var(--ove-paper); border-radius: 4px; box-shadow: 0 20px 90px #26382340; max-height: 88dvh; overflow-y: auto; }
#order-popup input { background: #e9e4d6; color: var(--ove-ink); border-color: #35472a55; border-radius: 2px; }
#order-popup .text-gray-700, #order-popup .text-gray-500 { color: var(--ove-ink); }
#order-summary { background: var(--ove-linen); border-radius: 2px; }
#signup-overlay > div:first-child { background: var(--ove-grove) !important; }
#signup-overlay > div:last-child { background: var(--ove-paper) !important; }
#signup-overlay { overflow-y: auto; }
#signup-overlay p, #signup-overlay input, #signup-overlay button { font-family: 'OveFinal', serif !important; }
#signup-overlay input, #signup-overlay button { border-radius: 2px !important; }
.ove-reveal { opacity: 1; transform: none; }
.ove-motion .ove-reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s ease; }
.ove-motion .ove-reveal.is-visible { opacity: 1; transform: none; }
@media (min-width: 1600px) { .ove-hero-copy { padding-left: 8vw; } }
@media (max-width: 1023px) {
  .ove-hero { grid-template-columns: 48% 52%; }
  .ove-hero-copy { padding-left: 5vw; padding-right: 4vw; }
  .ove-hero h1 { font-size: clamp(44px,5.2vw,58px); }
  .ove-nav .space-x-10 { gap: 15px; }
  #infusions .stagger-children > div { grid-template-columns: 1fr; }
  #infusions .stagger-children > div > div { grid-row: auto; margin-bottom: 10px; }
}
@media (max-width: 767px) {
  html { scroll-padding-top: 100px; }
  .ove-nav { top: 14px !important; left: 4%; width: 92% !important; }
  .ove-nav > div:first-child { padding: 9px 18px; min-height: 58px; }
  .ove-header-logo { width: 86px; }
  .ove-hero { min-height: 100dvh; display: block; }
  .ove-hero-media { position: absolute; inset: 0; }
  .ove-hero-media::after { background: linear-gradient(0deg,#293820ec, #29382038 65%,#29382020); }
  .ove-hero-copy { min-height: 100dvh; justify-content: flex-end; padding: 112px 7vw 118px; pointer-events: none; }
  .ove-hero-copy a { pointer-events: auto; }
  .ove-hero .ove-eyebrow { margin-bottom: 20px; }
  .ove-hero h1 { font-size: clamp(42px,10.5vw,62px); line-height: 1.08; max-width: 450px; margin-bottom: 18px; }
  .ove-hero-copy > p:not(.ove-eyebrow) { font-size: 13px; max-width: 300px; color: var(--ove-paper); }
  .ove-hero-actions { margin-top: 22px; gap: 20px; }
  .ove-hero-foot { display: none; }
  .ove-video-controls { right: 6vw; bottom: max(24px, env(safe-area-inset-bottom)); }
  .ove-media-label { left: 7vw; bottom: max(37px, calc(env(safe-area-inset-bottom) + 13px)); font-size: 8px; max-width: 105px; line-height: 1.5; }
  .ove-values { padding: 24px 7vw !important; }
  .ove-values .animate-marquee { flex-wrap: wrap; gap: 12px 20px; }
  .ove-values span { width: calc(50% - 10px); font-size: 9px; }
  .ove-values span:nth-child(even) { display: none; }
  .ove-intro { padding: 75px 7vw !important; }
  .ove-intro-heading { grid-template-columns: 1fr; gap: 0; margin-bottom: 38px; }
  .ove-intro h2 { font-size: 44px; }
  .ove-intro-gallery { grid-template-columns: 1fr; gap: 38px; }
  .ove-intro-notes { padding-top: 0; }
  .ove-intro-notes h3 { font-size: 32px; }
  .ove-origin { height: 75dvh; min-height: 480px; }
  .ove-origin-copy { padding: 60px 7vw; }
  .ove-origin h2 { font-size: 52px; }
  #infusions, #products, #showcase, #story { padding: 70px 0; }
  #infusions .max-w-7xl, #products .max-w-7xl, #showcase .max-w-7xl, #story .max-w-7xl { padding: 0 7vw; }
  #infusions h2, #products h2 { font-size: 46px; }
  #infusions .stagger-children { grid-template-columns: 1fr; }
  #infusions .stagger-children > div { grid-template-columns: 1fr 1fr; padding: 24px 0; }
  #infusions .stagger-children > div > div { grid-row: span 2; gap: 12px; margin-bottom: 0; }
  #infusions .stagger-children h3 { font-size: 22px; }
  #infusions .stagger-children img { width: 38px; height: 45px; }
  #infusions .stagger-children p { font-size: 11px; }
  #infusions .stagger-children p:last-child { font-size: 10px; }
  #infusions .mb-16, #products .mb-16 { margin-bottom: 35px; }
  .graza-fun-fact { max-width: 100%; font-size: 12px; }
  .ove-philosophy { height: 65dvh !important; }
  .ove-philosophy h2 { font-size: 48px; }
  #showcase .grid { gap: 30px; }
  #showcase .grid > div:last-child { height: 320px; }
  #showcase .graza-headline { font-size: 48px; }
  #products .stagger-children { grid-template-columns: 1fr; gap: 50px; }
  #products .group > div:first-child { padding: 25px; }
  #products .group > div:first-child img { height: 340px; }
  #products .group h3 { font-size: 29px; }
  .ove-keeping { grid-template-columns: 1fr; padding: 70px 7vw !important; gap: 35px; }
  .ove-keeping h2 { font-size: 48px; }
  #story .grid { gap: 35px; }
  #story h2 { text-align: left; margin-bottom: 28px; font-size: 48px; }
  #story p { font-size: 13px; line-height: 1.8; }
  #story .grid > div:first-child { order: 0; }
  #story .grid > div:last-child { order: 1; }
  footer .grid { grid-template-columns: 1fr 1fr; gap: 18px; }
  footer .grid > div:first-child { grid-column: 1 / -1; }
  footer .flex { flex-direction: row; gap: 15px; }
  footer .border-t.flex { flex-direction: column; align-items: flex-start; text-align: left; gap: 4px; }
  #floating-cart { bottom: 16px; right: 16px; }
  #floating-cart button { padding: 13px 18px; }
}
@media (min-width: 768px) and (max-height: 760px) {
  .ove-hero-copy { padding-top: 118px; padding-bottom: 70px; }
  .ove-hero .ove-eyebrow { margin-bottom: 22px; }
  .ove-hero h1 { font-size: clamp(44px,4.8vw,68px); margin-bottom: 20px; }
  .ove-hero-copy > p:not(.ove-eyebrow) { font-size: 14px; }
  .ove-hero-actions { margin-top: 24px; }
}
@media (max-width: 359px) {
  .ove-hero-copy { padding-left: 6vw; padding-right: 6vw; }
  .ove-hero-actions { gap: 16px; }
  .ove-hero-actions .ove-button { padding: 14px 18px; gap: 20px; }
  .ove-media-label { max-width: 85px; }
  .ove-video-controls { gap: 6px; }
  .ove-video-controls button { padding: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .ove-motion .ove-reveal { opacity: 1; transform: none; }
}