/* Ordering-first homepage. Shared shop and checkout styles stay in styles.css. */
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('../fonts/inter-latin-variable.woff2') format('woff2');
}
.home-page {
  --home-green: #008b29;
  --home-green-hover: #007321;
  --home-ink: #062c27;
  --home-muted: #52616c;
  --home-surface: #fff;
  --home-line: #e5eeea;
  color: var(--home-ink);
  background: var(--home-surface);
}
.home-page h1, .home-page h2, .home-page h3, .home-page h4 { color: var(--home-ink); }
.home-page p { color: var(--home-muted); }
.home-container { width: min(1600px, calc(100% - 80px)); margin-inline: auto; }
.home-page :focus-visible { outline: 3px solid var(--blue); outline-offset: 5px; }
.home-skip { position: fixed; top: -80px; left: 20px; z-index: 200; background: white; padding: 12px 20px; }
.home-skip:not(:focus) { clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; white-space: nowrap; padding: 0; }
.home-skip:focus { top: 12px; }
.home-header { position: sticky; top: 0; z-index: 60; background: var(--home-surface); border-bottom: 1px solid var(--home-line); }
.home-header-inner { height: 100px; display: flex; align-items: center; justify-content: space-between; gap: 36px; }
.home-brand { flex: 0 0 auto; }
.home-brand img { width: 77px; height: 88px; object-fit: contain; }
.home-nav { display: flex; align-items: center; gap: clamp(24px, 3vw, 48px); margin-right: auto; margin-left: 64px; }
.home-nav a { position: relative; padding: 12px 0; font-size: calc(1rem + var(--readability-size-step, 0rem)); font-weight: 600; color: var(--home-muted); }
.home-nav a:hover, .home-nav a[aria-current] { color: var(--home-green); }
.home-nav a[aria-current]::after { content: ''; position: absolute; bottom: 5px; left: 0; right: 0; height: 2px; background: currentColor; }
.home-header-actions { display: flex; align-items: center; gap: 18px; }
.home-phone { display: inline-flex; align-items: center; gap: 12px; white-space: nowrap; background: var(--home-green); border-radius: 24px; padding: 14px 24px; color: #fff; font-size: calc(1.25rem + var(--readability-size-step, 0rem)); font-weight: 750; }
.home-phone i { font-size: 27px; }
.home-phone:hover { background: var(--home-green-hover); }
.home-page .home-cart { border: 0; box-shadow: none; background: transparent; color: var(--home-ink); font-size: 22px; width: 40px; height: 44px; }
.home-page .cart-count { background: var(--home-green); }
.home-menu-toggle { display: none; border: 0; background: transparent; color: var(--home-ink); width: 44px; height: 44px; font-size: 26px; }
.home-hero { position: relative; isolation: isolate; overflow: hidden; background: radial-gradient(ellipse at 63% 30%, #36a95c, #087b30 47%, #06381b 100%); }
.home-hero::before { content: ''; position: absolute; z-index: -1; width: 94%; height: 145%; top: -46%; left: -29%; background: linear-gradient(115deg, #fff 12%, #f3fbfc 66%, #e1f6f4); border-radius: 0 0 68% 0; }
.home-hero::after { content: ''; position: absolute; z-index: -2; left: 0; right: -10%; bottom: -112px; height: 170px; border-radius: 50% 50% 0 0; background: linear-gradient(100deg, #53b777, #078738); transform: rotate(-4deg); }
.home-hero-inner { position: relative; min-height: 540px; display: grid; grid-template-columns: 57% 43%; grid-template-rows: 1fr auto; padding-block: 68px 66px; }
.home-hero-copy { grid-column: 1; z-index: 2; }
.home-slogan { color: var(--home-green) !important; font-size: calc(0.9375rem + var(--readability-size-step, 0rem)); line-height: 1.4; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; margin: 0 0 13px; }
.home-hero h1 { font-size: clamp(65px, 7.7vw, 110px); font-weight: 850; line-height: .98; letter-spacing: -.055em; }
.home-hero h1 span { display: block; font-size: clamp(40px, 4.7vw, 66px); letter-spacing: -.045em; color: var(--home-green); line-height: 1.12; margin-top: 6px; }
.home-hero-description { max-width: 590px; font-size: clamp(18px, 1.9vw, 24px); line-height: 1.45; margin-top: 22px; }
.home-hero-media { grid-column: 2; grid-row: 1 / 3; align-self: end; position: relative; z-index: 1; margin: 0 -40px -42px -56px; }
.home-hero-media img { width: 100%; height: auto; filter: drop-shadow(0 15px 9px rgba(0, 35, 10, .14)); }
.home-hero-actions { display: flex; align-items: center; gap: 14px; grid-column: 1; z-index: 2; margin-top: 30px; }
.home-button { display: inline-flex; justify-content: center; align-items: center; gap: 13px; min-height: 58px; padding: 15px 25px; border: 1.5px solid var(--home-green); border-radius: 999px; color: #fff; background: var(--home-green); font-size: calc(1.0625rem + var(--readability-size-step, 0rem)); line-height: 1.35; font-weight: 700; transition: background-color .18s, color .18s, border-color .18s, transform .18s; cursor: pointer; }
.home-button:hover { background: var(--home-green-hover); transform: translateY(-2px); }
.home-button > i:first-child { font-size: 23px; }
.home-button > .fa-chevron-right { font-size: 13px; margin-left: 5px; }
.home-button-outline { color: var(--home-ink); background: rgba(255,255,255,.7); }
.home-button-outline > i { color: var(--home-green); }
.home-button-outline:hover { background: #e5f7eb; }
.home-hero-actions:has(.home-button:is(:hover, :focus-visible)) .home-button:not(.home-button-outline) { background: var(--home-surface); color: var(--home-ink); }
.home-hero-actions:has(.home-button:is(:hover, :focus-visible)) .home-button-outline { background: var(--home-green); color: #fff; }
.home-hero-actions:has(.home-button:is(:hover, :focus-visible)) .home-button-outline > i { color: currentColor; }
.home-button:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.home-trust { border-bottom: 1px solid var(--home-line); background: var(--home-surface); }
.home-trust-inner { display: grid; grid-template-columns: repeat(3, 1fr); padding-block: 32px; }
.home-trust-item { display: flex; align-items: center; justify-content: center; gap: 20px; padding: 0 24px; position: relative; }
.home-trust-item + .home-trust-item::before { content: ''; position: absolute; left: 0; height: 54px; width: 1px; background: var(--home-line); }
.home-trust-icon { display: grid; place-items: center; flex: 0 0 72px; height: 72px; border-radius: 50%; background: #ecf9f0; color: var(--home-green); font-size: 29px; }
.home-trust-item strong { display: block; font-size: calc(1.0625rem + var(--readability-size-step, 0rem)); line-height: 1.3; letter-spacing: -.02em; }
.home-trust-item p { font-size: calc(0.875rem + var(--readability-size-step, 0rem)); margin-top: 5px; white-space: nowrap; }
.home-order { padding-block: 66px; scroll-margin-top: 24px; }
.home-section-heading { text-align: center; margin-bottom: 42px; }
.home-section-heading h2 { font-size: clamp(32px, 4vw, 46px); font-weight: 800; letter-spacing: -.045em; }
.home-section-heading p { font-size: calc(1.0625rem + var(--readability-size-step, 0rem)); margin-top: 14px; }
.home-products { display: grid; grid-template-columns: repeat(3, 1fr); }
.home-product { text-align: center; padding: 0 38px; min-width: 0; }
.home-product + .home-product { border-left: 1px solid var(--home-line); }
.home-product-media { height: 285px; display: flex; align-items: end; justify-content: center; margin-bottom: 22px; }
.home-product-media img { height: 100%; width: 100%; object-fit: contain; object-position: center bottom; }
.home-product[data-size='9kg'] .home-product-media img { height: 78%; }
.home-product[data-size='19kg'] .home-product-media img { height: 90%; }
.home-product h3 { font-size: 28px; font-weight: 800; }
.home-product-description { min-height: 47px; max-width: 240px; margin: 10px auto 0; font-size: calc(0.9375rem + var(--readability-size-step, 0rem)); line-height: 1.5; }
.home-product-price { color: var(--home-green); font-size: 30px; font-weight: 800; line-height: 1.3; margin: 14px 0; }
.home-quantity { display: inline-flex; align-items: center; border: 1px solid var(--home-line); background: #f5f8f7; border-radius: 12px; overflow: hidden; margin-bottom: 15px; }
.home-quantity button { width: 44px; height: 44px; display: grid; place-items: center; border: none; background: transparent; color: var(--home-ink); }
.home-quantity button:hover { background: #e1f1e6; }
.home-quantity button:disabled { opacity: .4; cursor: not-allowed; }
.home-quantity span { width: 34px; font-weight: 650; }
.home-product .home-button { width: 100%; min-height: 50px; font-size: calc(0.9375rem + var(--readability-size-step, 0rem)); padding: 12px 20px; }
.home-product-stock { font-size: calc(0.8125rem + var(--readability-size-step, 0rem)); color: var(--home-muted); min-height: 20px; margin-top: 10px; }
.home-order-next { text-align: center; margin-top: 36px; }
.home-order-next p { font-size: calc(0.875rem + var(--readability-size-step, 0rem)); margin-top: 18px; }
.home-text-link { color: var(--home-green); text-decoration: underline; text-underline-offset: 4px; font-weight: 600; }
.home-loading { grid-column: 1 / -1; text-align: center; padding: 50px 0; }
.home-steps { background: #effaf4; padding: 34px 0; }
.home-steps ol { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 42px; }
.home-steps li { display: flex; align-items: flex-start; gap: 18px; }
.home-step-number { width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 48px; border-radius: 50%; background: #cff2dc; color: var(--home-green); font-size: 24px; font-weight: 800; }
.home-steps h3 { font-size: 17px; font-weight: 750; margin: 3px 0 9px; }
.home-steps p { font-size: calc(0.875rem + var(--readability-size-step, 0rem)); }
.home-footer { padding: 38px 0 24px; background: var(--home-surface); }
.home-footer-top { display: grid; grid-template-columns: 1.2fr 1.4fr 1fr 1.4fr; gap: 48px; }
.home-footer-brand img { height: 90px; width: 80px; object-fit: contain; }
.home-footer h2 { font-size: 15px; line-height: 1.4; font-weight: 700; letter-spacing: 0; margin: 8px 0 12px; }
.home-footer p, .home-footer a { font-size: calc(0.8125rem + var(--readability-size-step, 0rem)); line-height: 1.9; }
.home-footer a:hover { color: var(--home-green); }
.home-footer ul { padding: 0; margin: 0; list-style: none; }
.home-footer-links { columns: 2; column-gap: 24px; }
.home-footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid var(--home-line); margin-top: 28px; padding-top: 20px; }
.home-footer-bottom p, .home-footer-bottom a, .home-footer-bottom button { font-size: calc(0.75rem + var(--readability-size-step, 0rem)); }
.home-footer-utilities { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.home-footer-utilities button { display: inline-flex; gap: 6px; align-items: center; padding: 4px 0; border: 0; background: transparent; color: var(--home-muted); }
.home-page .cookie-notice { border-color: var(--home-line); }
.home-page .cookie-notice .btn-primary { background: var(--home-green); box-shadow: none; }
html[data-theme='dark'] .home-page { --home-ink: #edf8f1; --home-muted: #b4c6c0; --home-surface: #0b201b; --home-line: #294039; --home-green: #49d97c; --home-green-hover: #2bc065; background: var(--home-surface); }
html[data-theme='dark'] .home-page .home-cart { background: transparent; color: var(--home-ink); }
html[data-theme='dark'] .home-skip { color: #062c27; }
html[data-theme='dark'] .home-hero { background: radial-gradient(ellipse at 63% 30%, #276641, #0d492b 47%, #062d19 100%); }
html[data-theme='dark'] .home-hero::before { background: linear-gradient(115deg, #0d251e, #183c31); }
html[data-theme='dark'] .home-button, html[data-theme='dark'] .home-phone { color: #062c27; }
html[data-theme='dark'] .home-button-outline { color: var(--home-ink); background: #132d25; }
html[data-theme='dark'] .home-hero-actions:has(.home-button:is(:hover, :focus-visible)) .home-button-outline { color: #062c27; background: var(--home-green); }
html[data-theme='dark'] .home-trust-icon, html[data-theme='dark'] .home-quantity, html[data-theme='dark'] .home-steps { background: #153429; }
html[data-theme='dark'] .home-step-number { background: #23593b; }
html[data-theme='dark'] .home-quantity button:hover { background: #24523a; }
@media (min-width: 1600px) { .home-hero-inner { min-height: 590px; } .home-hero-media { margin-right: -55px; margin-left: -85px; } }
@media (max-width: 1100px) {
  .home-container { width: calc(100% - 48px); }
  .home-nav { margin-left: 16px; gap: 24px; }
  .home-phone { font-size: calc(1rem + var(--readability-size-step, 0rem)); padding: 13px 17px; }
  .home-hero-inner { min-height: 495px; padding-block: 54px; }
  .home-hero-media { margin-right: -24px; margin-left: -40px; }
  .home-hero-actions { gap: 10px; }
  .home-hero-actions .home-button { padding-inline: 19px; font-size: calc(0.9375rem + var(--readability-size-step, 0rem)); }
  .home-trust-item { padding-inline: 12px; gap: 13px; }
  .home-trust-icon { flex-basis: 57px; height: 57px; font-size: 25px; }
  .home-trust-item strong { font-size: calc(0.9375rem + var(--readability-size-step, 0rem)); }
  .home-trust-item p { font-size: calc(0.75rem + var(--readability-size-step, 0rem)); }
  .home-product { padding-inline: 24px; }
  .home-product-media { height: 245px; }
  .home-footer-top { gap: 26px; }
}
@media (max-width: 800px) {
  .home-header .cart-preview { display: none; }
  .home-header-inner { height: 82px; gap: 16px; }
  .home-brand img { height: 72px; width: 66px; }
  .home-header-actions { gap: 10px; }
  .home-menu-toggle { display: grid; place-items: center; }
  .home-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; margin: 0; padding: 18px 24px 24px; background: var(--home-surface); box-shadow: 0 20px 24px rgba(0,40,20,.1); border-top: 1px solid var(--home-line); }
  .home-nav.is-open { display: grid; gap: 4px; }
  .home-nav a { padding: 12px 8px; }
  .home-nav a[aria-current]::after { display: none; }
  .home-hero-inner { grid-template-columns: 1fr; padding-top: 35px; padding-bottom: 24px; }
  .home-hero { background: radial-gradient(ellipse at 70% 30%, #2e9e51, #0b6d30); }
  .home-hero::before { width: 165%; height: 80%; top: -6%; left: -50%; border-radius: 0 0 85% 0; }
  .home-hero::after { bottom: 115px; height: 130px; }
  .home-slogan { font-size: calc(0.75rem + var(--readability-size-step, 0rem)); margin-bottom: 14px; }
  .home-hero h1 { font-size: clamp(64px, 11vw, 92px); }
  .home-hero h1 span { font-size: clamp(44px, 7.7vw, 65px); max-width: 540px; }
  .home-hero-description { font-size: calc(1.1875rem + var(--readability-size-step, 0rem)); max-width: 460px; margin-top: 18px; }
  .home-hero-media { grid-column: 1; grid-row: 2; width: min(100%, 540px); margin: 4px auto 0; }
  .home-hero-actions { grid-column: 1; grid-row: 3; margin-top: 20px; position: relative; }
  .home-hero-actions::before { content: ''; position: absolute; z-index: -1; inset: -16px -24px -26px; border-radius: 30px 30px 0 0; background: var(--home-surface); }
  .home-hero-actions .home-button { flex: 1; background: var(--home-green); }
  .home-hero-actions .home-button-outline { background: var(--home-surface); }
  .home-trust-inner { padding-block: 25px; }
  .home-trust-item { flex-direction: column; text-align: center; gap: 10px; padding-inline: 10px; }
  .home-trust-item + .home-trust-item::before { height: 62px; top: 42px; }
  .home-trust-item p { white-space: normal; line-height: 1.45; }
  .home-trust-item strong { font-size: calc(0.875rem + var(--readability-size-step, 0rem)); }
  .home-trust-icon { flex: 0 0 54px; width: 54px; height: 54px; }
  .home-product { padding-inline: 16px; }
  .home-product-media { height: 205px; }
  .home-product-description { min-height: 68px; font-size: calc(0.8125rem + var(--readability-size-step, 0rem)); }
  .home-product .home-button { font-size: calc(0.8125rem + var(--readability-size-step, 0rem)); gap: 8px; padding-inline: 12px; }
  .home-product .home-button i { font-size: 17px; }
  .home-steps ol { gap: 24px; }
  .home-steps li { gap: 12px; }
  .home-step-number { flex-basis: 36px; width: 36px; height: 36px; font-size: 20px; }
  .home-steps h3 { font-size: 15px; }
  .home-steps p { font-size: calc(0.8125rem + var(--readability-size-step, 0rem)); }
  .home-footer-top { grid-template-columns: 1fr 1fr; gap: 20px 40px; }
  .home-footer-bottom { align-items: flex-start; flex-direction: column; gap: 12px; }
}
@media (max-width: 540px) {
  .home-container { width: calc(100% - 40px); }
  .home-header-inner { gap: 8px; }
  .home-brand img { width: 58px; height: 69px; }
  .home-header-actions { gap: 5px; }
  .home-phone { font-size: calc(0.8125rem + var(--readability-size-step, 0rem)); padding: 11px 12px; gap: 7px; border-radius: 18px; }
  .home-phone i { font-size: 21px; }
  .home-page .home-cart { width: 34px; font-size: 19px; }
  .home-menu-toggle { width: 36px; font-size: 25px; }
  .home-hero h1 { font-size: 70px; }
  .home-hero h1 span { font-size: 49px; max-width: 350px; }
  .home-hero-description { font-size: calc(1.0625rem + var(--readability-size-step, 0rem)); max-width: 310px; margin-top: 16px; }
  .home-hero-media { margin-top: 4px; width: calc(100% + 12px); margin-left: -6px; }
  .home-hero-actions { flex-direction: column; gap: 12px; margin-top: 20px; }
  .home-hero-actions .home-button { width: 100%; min-height: 54px; font-size: calc(1.0625rem + var(--readability-size-step, 0rem)); }
  .home-trust-inner { width: calc(100% - 20px); }
  .home-trust-item { padding-inline: 7px; }
  .home-trust-item strong { font-size: calc(0.8125rem + var(--readability-size-step, 0rem)); max-width: 108px; margin-inline: auto; }
  .home-trust-item p { font-size: max(0.6875rem, var(--readability-small-floor, 0.6875rem), calc(0.6875rem + var(--readability-size-step, 0rem))); }
  .home-order { padding-block: 42px; }
  .home-section-heading { margin-bottom: 24px; }
  .home-section-heading h2 { font-size: 31px; }
  .home-section-heading p { font-size: calc(0.875rem + var(--readability-size-step, 0rem)); max-width: 300px; margin-inline: auto; }
  .home-products { grid-template-columns: 1fr; gap: 0; }
  .home-product { display: grid; grid-template-columns: 34% 1fr; column-gap: 22px; padding: 26px 0; text-align: left; }
  .home-product + .home-product { border-left: 0; border-top: 1px solid var(--home-line); }
  .home-product-media { grid-row: 1 / 6; height: 200px; align-self: center; margin: 0; overflow: hidden; }
  .home-product-media img { width: 185%; max-width: none; flex-shrink: 0; }
  .home-product h3 { font-size: 24px; }
  .home-product-description { margin: 7px 0 0; min-height: 0; max-width: none; }
  .home-product-price { font-size: 25px; margin: 10px 0; }
  .home-product-controls { grid-column: 2; }
  .home-quantity { margin-bottom: 10px; }
  .home-product .home-button { font-size: calc(0.875rem + var(--readability-size-step, 0rem)); }
  .home-product-stock { grid-column: 2; min-height: 0; }
  .home-product-stock:empty { display: none; }
  .home-order-next { margin-top: 12px; }
  .home-order-next .home-button { width: 100%; font-size: calc(1rem + var(--readability-size-step, 0rem)); }
  .home-steps ol { grid-template-columns: 1fr; gap: 23px; }
  .home-steps li { gap: 16px; }
  .home-steps h3 { font-size: 16px; margin-bottom: 5px; }
  .home-footer-top { grid-template-columns: 1fr 1fr; gap: 22px 20px; }
  .home-footer-top > div:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
  .home-footer-top > div:nth-child(3) { grid-column: 2; grid-row: 1; }
  .home-footer-top > div:last-child { grid-column: 1 / -1; }
  .home-footer-links { columns: 3; }
  .home-footer-utilities { gap: 12px; }
}
@media (max-width: 360px) {
  .home-container { width: calc(100% - 28px); }
  .home-phone { font-size: calc(0.75rem + var(--readability-size-step, 0rem)); padding-inline: 9px; }
  .home-header-actions { gap: 1px; }
  .home-hero h1 { font-size: 64px; }
  .home-hero h1 span { font-size: 44px; }
  .home-slogan { font-size: max(0.625rem, var(--readability-small-floor, 0.625rem), calc(0.625rem + var(--readability-size-step, 0rem))); }
}
@media (prefers-reduced-motion: reduce) { .home-button { transition: none; } .home-page { scroll-behavior: auto; } }