/* Layout and section rhythm */
.container { width: min(calc(100% - 2.5rem), var(--container)); margin-inline: auto; }
.container--narrow { width: min(calc(100% - 2.5rem), var(--narrow)); margin-inline: auto; }
.section { position: relative; padding-block: var(--space-10); }
.section--paper { background: var(--paper); }
.section--dark { overflow: hidden; background: var(--forest-1000); color: #fff; }
.section--dark::before { content: ""; position: absolute; width: 36rem; aspect-ratio: 1; right: -16rem; top: -19rem; border-radius: 50%; background: rgb(201 231 122 / .09); filter: blur(4px); }
.section-head { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(18rem, .7fr); gap: 4rem; align-items: end; margin-bottom: var(--space-8); }
.section-head h2 { max-width: 18ch; margin-bottom: 0; }
.section-head p { color: var(--muted); margin: 0; }
.section--dark .section-head p { color: #b9c8c2; }
.eyebrow { display: flex; align-items: center; gap: .7rem; color: var(--leaf-600); font-size: var(--step--1); font-weight: 850; letter-spacing: .17em; text-transform: uppercase; }
.eyebrow::before { content: ""; width: 2.25rem; height: 1px; background: currentColor; }

/* Header and navigation */
.site-header { position: sticky; top: 0; z-index: var(--z-header); height: var(--header); background: rgb(251 248 239 / .72); border-bottom: 1px solid transparent; backdrop-filter: blur(18px) saturate(1.25); transition: background var(--ease-out), box-shadow var(--ease-out), border-color var(--ease-out); }
.site-header.is-scrolled { background: rgb(255 254 250 / .94); border-color: rgb(23 35 31 / .08); box-shadow: 0 12px 36px rgb(10 42 33 / .07); }
.nav-wrap { height: 100%; display: flex; align-items: center; gap: 1.4rem; }
.brand { display: inline-flex; align-items: center; gap: .72rem; color: var(--forest-900); font-size: .94rem; font-weight: 900; letter-spacing: .12em; text-decoration: none; }
.brand img { width: 2.35rem; height: 2.35rem; filter: drop-shadow(0 8px 12px rgb(10 42 33 / .16)); }
.nav { display: flex; align-items: center; gap: clamp(.65rem, 1.2vw, 1.2rem); margin-left: auto; }
.nav > a { position: relative; padding: .8rem .05rem; color: #33423c; font-size: .8rem; font-weight: 760; text-decoration: none; white-space: nowrap; }
.nav > a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: .52rem; height: 2px; background: var(--leaf-500); transition: right var(--ease-out); }
.nav > a:hover::after, .nav > a[aria-current="page"]::after { right: 0; }
.nav > a[aria-current="page"] { color: var(--forest-900); }
.lang { display: flex; padding: .2rem; border: 1px solid var(--line); border-radius: var(--radius-pill); background: rgb(255 255 255 / .58); }
.lang a { min-width: 2.1rem; padding: .35rem .45rem; border-radius: var(--radius-pill); font-size: .7rem; font-weight: 850; text-align: center; text-decoration: none; }
.lang a[aria-current="true"] { background: var(--forest-900); color: #fff; }
.menu-toggle { display: none; width: 2.8rem; height: 2.8rem; margin-left: auto; padding: .62rem; border: 1px solid var(--line); border-radius: 50%; background: var(--paper); }
.menu-toggle span { display: block; width: 100%; height: 2px; margin: .28rem 0; background: var(--forest-900); transition: transform var(--ease-out), opacity var(--ease-out); }
.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(.38rem) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-.38rem) rotate(-45deg); }

/* Buttons */
.button { position: relative; display: inline-flex; justify-content: center; align-items: center; gap: .65rem; min-height: 3.2rem; padding: .78rem 1.3rem; overflow: hidden; border: 1px solid transparent; border-radius: var(--radius-sm); background: var(--forest-900); color: #fff; box-shadow: 0 10px 22px rgb(16 60 47 / .15); text-decoration: none; font-size: .84rem; font-weight: 820; transition: transform var(--ease-out), background var(--ease-out), box-shadow var(--ease-out), border-color var(--ease-out); }
.button::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 28%, rgb(255 255 255 / .17), transparent 72%); transform: translateX(-120%); transition: transform 650ms ease; }
.button:hover { transform: translateY(-3px); background: var(--forest-800); box-shadow: 0 16px 30px rgb(16 60 47 / .22); }
.button:hover::after { transform: translateX(120%); }
.button:active { transform: translateY(-1px); }
.button--light { background: #fff; color: var(--forest-900); }
.button--ghost { background: transparent; border-color: currentColor; color: inherit; box-shadow: none; }
.button--store { min-width: 0; min-height: 0; padding: 0; overflow: visible; border: 0; border-radius: .72rem; background: transparent; box-shadow: none; }
.button--store::after { display: none; }
.button--store:hover { background: transparent; box-shadow: none; }
.store-badge { display: block; width: auto; max-width: 100%; object-fit: contain; }
.store-badge--app { height: 2.75rem; }
.store-badge--google { height: 4.1rem; margin-block: -.675rem; }

/* Editorial hero */
.hero { position: relative; min-height: calc(100svh - var(--header)); padding: clamp(2.5rem, 5vw, 5.5rem) 0 4.5rem; overflow: clip; background: radial-gradient(circle at 78% 38%, rgb(201 231 122 / .34), transparent 22rem), linear-gradient(145deg, var(--ivory), #f4ead9 72%, #e9f0df); }
.hero::before { content: ""; position: absolute; width: 38rem; height: 38rem; left: -25rem; bottom: -29rem; border: 1px solid rgb(16 60 47 / .14); border-radius: 50%; box-shadow: 0 0 0 5rem rgb(16 60 47 / .025), 0 0 0 10rem rgb(16 60 47 / .02); }
.hero-grid { display: grid; grid-template-columns: repeat(12, 1fr); align-items: center; min-height: 43rem; }
.hero-copy { position: relative; z-index: 5; grid-column: 1 / span 7; grid-row: 1; align-self: center; padding-block: 2rem; }
.hero-copy::after { content: ""; position: absolute; z-index: -1; width: 10rem; height: 16rem; right: 1rem; top: -3rem; background: url("../svg/botanical-sprig.svg") center / contain no-repeat; opacity: .16; transform: rotate(18deg); pointer-events: none; }
.hero h1 { max-width: 9.5ch; margin: 1.15rem 0 1.6rem; color: var(--forest-1000); text-wrap: balance; }
.lang-ru .hero h1 { max-width: 10.5ch; font-size: clamp(3.7rem, 2.45rem + 3.2vw, 6rem); }
.hero h1::first-line { color: var(--forest-900); }
.hero-copy > p:not(.eyebrow):not(.hero-note) { max-width: 32rem; color: var(--slate); font-size: var(--step-1); }
.hero-actions, .store-row { display: flex; flex-wrap: wrap; gap: .75rem; }
.hero-actions { margin-top: 1.8rem; }
.hero-note { display: flex; align-items: center; gap: .65rem; margin-top: 1.5rem; color: var(--slate); font-size: .83rem; font-weight: 700; }
.hero-note::before { content: ""; width: .6rem; height: .6rem; flex: 0 0 auto; border-radius: 50%; background: var(--leaf-500); box-shadow: 0 0 0 6px rgb(107 166 83 / .14); }
.hero-visual { position: relative; z-index: 2; grid-column: 6 / -1; grid-row: 1; min-height: 43rem; }
.hero-visual::before { content: "PELIN"; position: absolute; right: 4%; top: 8%; z-index: 4; display: grid; place-items: center; width: 8.5rem; aspect-ratio: 1; border: 1px solid rgb(255 255 255 / .5); border-radius: 50%; background: rgb(10 42 33 / .78); color: var(--pistachio); box-shadow: var(--shadow-mid); backdrop-filter: blur(12px); font: 900 .76rem/1 var(--font-display); letter-spacing: .16em; }
.hero-visual::after { content: ""; position: absolute; left: 4%; top: 12%; width: 26%; height: 46%; border-radius: 2rem; background: linear-gradient(160deg, rgb(255 255 255 / .88), rgb(232 240 225 / .82)); box-shadow: var(--shadow-mid); transform: rotate(-10deg); }
.hero-photo { position: absolute; inset: 2.5rem 0 1.5rem 8%; width: 92%; height: calc(100% - 4rem); object-fit: cover; object-position: 62% center; border-radius: 46% 8% 30% 11% / 28% 12% 32% 14%; box-shadow: var(--shadow-deep); }
.hero-visual .phone { left: 6%; bottom: -.5rem; width: 15.8rem; transform: rotate(-5.5deg); }
.phone { position: absolute; z-index: 6; width: 14.8rem; padding: .62rem; border: 3px solid #26332e; border-radius: 2.55rem; background: #0d1713; box-shadow: 0 34px 64px rgb(4 20 15 / .35); }
.phone-screen { min-height: 28rem; padding: 1rem; overflow: hidden; border-radius: 1.95rem; background: #f8f5ec; color: var(--charcoal); }
.phone-bar { width: 3.2rem; height: .3rem; margin: 0 auto 1rem; border-radius: 1rem; background: #18211d; }
.app-greeting { font-size: .8rem; font-weight: 850; }
.app-banner { position: relative; margin: .75rem 0; padding: 1rem; overflow: hidden; border-radius: 1.05rem; background: var(--forest-900); color: #fff; }
.app-banner::after { content: ""; position: absolute; width: 5rem; aspect-ratio: 1; right: -2.5rem; bottom: -3rem; border-radius: 50%; background: var(--pistachio); opacity: .22; }
.app-banner small { color: #dfe9e4; }
.app-banner b { display: block; margin-top: .2rem; font-size: 1.12rem; line-height: 1.3; }
.app-cats { display: grid; grid-template-columns: repeat(3, 1fr); gap: .42rem; }
.app-cat { padding: .55rem .18rem; border: 1px solid #e5dfd3; border-radius: .7rem; background: #fff; text-align: center; font-size: .58rem; }
.app-cat span { display: grid; place-items: center; width: 1.7rem; height: 1.7rem; margin: 0 auto .3rem; border-radius: 50%; background: var(--sage-100); font-size: 0; }
.app-cat span::before { content: ""; width: .62rem; height: .62rem; border-radius: 42% 58% 55% 45%; background: var(--leaf-500); transform: rotate(35deg); }
.app-cat:nth-child(2) span { background: #f8ded7; }
.app-cat:nth-child(2) span::before { border-radius: 50%; background: var(--tomato); }
.app-cat:nth-child(3) span { background: #e7eef0; }
.app-cat:nth-child(3) span::before { border-radius: .15rem .15rem .35rem .35rem; background: #85aaba; }
.app-order { margin-top: .75rem; padding: .7rem; border: 1px solid #e5dfd3; border-radius: .8rem; background: #fff; font-size: .62rem; }
.app-progress { height: .28rem; margin: .55rem 0; border-radius: 1rem; background: #dbe4d6; }
.app-progress::after { content: ""; display: block; width: 68%; height: 100%; border-radius: inherit; background: var(--leaf-500); }
.floating-card { position: absolute; right: -1.5rem; bottom: 4.5rem; z-index: 8; width: 13rem; padding: 1.1rem; border: 1px solid rgb(255 255 255 / .7); border-radius: var(--radius-md); background: rgb(255 254 250 / .91); box-shadow: var(--shadow-mid); backdrop-filter: blur(14px); font-size: .72rem; }
.floating-card::after { content: ""; position: absolute; inset: auto 1rem .72rem; height: .25rem; border-radius: 1rem; background: linear-gradient(90deg, var(--leaf-500) 72%, var(--sage-100) 72%); }
.floating-card strong { display: block; margin-bottom: .32rem; color: var(--forest-900); font-size: .92rem; }
.pulse { display: inline-block; width: .55rem; height: .55rem; margin-right: .3rem; border-radius: 50%; background: var(--leaf-500); box-shadow: 0 0 0 5px rgb(107 166 83 / .13); }

/* Trust rail */
.trust-strip { position: relative; z-index: 10; margin-top: -1.7rem; background: transparent; color: var(--forest-1000); }
.trust-strip::after { content: ""; position: absolute; right: max(1.25rem, calc((100vw - var(--container)) / 2 - 1.5rem)); top: 50%; width: 4.7rem; height: 4.7rem; background: url("../svg/trust-seal.svg") center / contain no-repeat; filter: drop-shadow(0 10px 18px rgb(7 30 24 / .2)); transform: translate(45%, -50%) rotate(8deg); }
.trust-strip .container { border: 1px solid rgb(16 60 47 / .12); border-radius: var(--radius-md); background: rgb(255 254 250 / .93); box-shadow: var(--shadow-soft); backdrop-filter: blur(12px); }
.trust-list { display: grid; grid-template-columns: repeat(5, 1fr); margin: 0; padding: .9rem 0; list-style: none; }
.trust-list li { display: flex; align-items: center; justify-content: center; min-height: 3.7rem; padding: .55rem 1rem; border-right: 1px solid var(--line); font-size: .75rem; font-weight: 780; text-align: center; }
.trust-list li::before { content: ""; width: .48rem; height: .48rem; margin-right: .52rem; border: 2px solid var(--leaf-500); border-radius: 50%; box-shadow: inset 0 0 0 2px var(--paper); background: var(--pistachio); }
.trust-list li:last-child { border: 0; }

/* Category bento */
.category-grid { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: 9.5rem; gap: .9rem; }
.category { position: relative; grid-column: span 3; min-height: 0; padding: 1.5rem; overflow: hidden; border: 0; border-radius: var(--radius-md); background-color: var(--forest-900); background-image: linear-gradient(180deg, rgb(7 30 24 / .04) 20%, rgb(7 30 24 / .83) 100%), url("../images/pelin-market-harvest.webp"); background-size: auto 100%; background-position: left center; box-shadow: inset 0 0 0 1px rgb(255 255 255 / .12); color: #fff; transition: transform var(--ease-out), box-shadow var(--ease-out), background-size 700ms ease; }
.category:hover { z-index: 2; transform: translateY(-5px); background-size: auto 106%; box-shadow: var(--shadow-mid); }
.category:nth-child(1) { grid-column: span 7; grid-row: span 3; background-size: cover; background-position: 12% center; }
.category:nth-child(2) { grid-column: span 5; grid-row: span 2; background-position: 49% center; }
.category:nth-child(3) { grid-column: span 5; grid-row: span 2; background-position: 88% center; }
.category:nth-child(4) { grid-column: span 4; grid-row: span 2; background-position: 94% center; }
.category:nth-child(5) { grid-column: span 3; grid-row: span 2; background-position: 72% center; }
.category:nth-child(6) { grid-column: span 5; grid-row: span 2; background-position: 57% center; }
.category:nth-child(7) { grid-column: span 4; grid-row: span 2; background-position: 95% center; }
.category:nth-child(8) { grid-column: span 3; grid-row: span 2; background-image: linear-gradient(145deg, rgb(16 60 47 / .88), rgb(7 30 24 / .95)), url("../images/pelin-market-harvest.webp"); }
.category h3 { position: absolute; left: 1.5rem; right: 1.5rem; bottom: 2.8rem; margin: 0; font-size: clamp(1.2rem, 2vw, 2.15rem); letter-spacing: -.04em; text-shadow: 0 2px 12px rgb(0 0 0 / .25); }
.category p { position: absolute; left: 1.5rem; right: 1.5rem; bottom: .8rem; margin: 0; overflow: hidden; color: #dbe6e1; font-size: .75rem; white-space: nowrap; text-overflow: ellipsis; }
.category .tag { display: inline-flex; padding: .32rem .6rem; border: 1px solid rgb(255 255 255 / .32); border-radius: var(--radius-pill); background: rgb(7 30 24 / .32); color: #fff; font-size: .62rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; backdrop-filter: blur(6px); }
.category-mark { display: none; }

/* Connected journey */
.steps { counter-reset: step; display: grid; grid-template-columns: repeat(4, 1fr); position: relative; gap: 1.5rem; padding-top: 2.5rem; }
.steps::before { content: ""; position: absolute; left: 9%; right: 9%; top: 4.55rem; height: 5.5rem; border-top: 2px dashed var(--leaf-500); border-radius: 50%; opacity: .55; }
.step { position: relative; min-height: 18rem; padding: 6.6rem 1rem 1rem 0; }
.step:nth-child(even) { transform: translateY(3.5rem); }
.step::before { counter-increment: step; content: "0" counter(step); position: absolute; left: 0; top: 0; z-index: 2; display: grid; place-items: center; width: 4.2rem; height: 4.2rem; border: 1px solid rgb(255 255 255 / .8); border-radius: 1.25rem; background: var(--forest-900); color: var(--pistachio); box-shadow: var(--shadow-soft); font-weight: 900; transform: rotate(-7deg); }
.step:nth-child(even)::before { background: var(--tomato); color: #fff; transform: rotate(7deg); }
.step h3 { max-width: 12ch; margin-bottom: .75rem; font-size: var(--step-2); }
.step p { color: var(--muted); font-size: .86rem; }

/* App product showcase */
.app-showcase { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; gap: 6rem; align-items: center; }
.screen-stack { position: relative; display: flex; align-items: center; justify-content: center; min-height: 39rem; perspective: 1000px; }
.screen-stack::before { content: ""; position: absolute; inset: 12% 8%; border-radius: 50%; background: radial-gradient(circle, rgb(201 231 122 / .25), transparent 67%); filter: blur(12px); }
.screen-stack::after { content: ""; position: absolute; inset: 7% 2%; border: 1px dashed rgb(201 231 122 / .22); border-radius: 50%; transform: rotate(-9deg); }
.screen-stack .phone { position: relative; left: auto; bottom: auto; width: 16rem; transform: translateX(1.4rem) rotate(-8deg); }
.screen-stack .phone:nth-child(2) { z-index: 5; width: 14.8rem; margin-left: -5rem; transform: translateY(3rem) rotate(8deg); }
.feature-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.5rem; padding: 0; list-style: none; }
.feature-list li { position: relative; padding: 1.25rem 0 1.25rem 1.25rem; border-top: 1px solid rgb(255 255 255 / .18); }
.feature-list li::before { content: ""; position: absolute; left: 0; top: 1.65rem; width: .45rem; height: .45rem; border-radius: 50%; background: var(--coral); }
.feature-list strong { display: block; margin-bottom: .28rem; color: var(--pistachio); }
.feature-list span { color: #bac9c3; font-size: .83rem; }

/* Logistics control room */
.logistics { position: relative; display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(2.5rem, 6vw, 6rem); align-items: center; padding: clamp(2.5rem, 6vw, 6.5rem); overflow: hidden; border-radius: var(--radius-lg); background: var(--forest-1000); color: #fff; box-shadow: var(--shadow-mid); }
.logistics::after { content: ""; position: absolute; width: 20rem; aspect-ratio: 1; left: -11rem; bottom: -12rem; border: 1px solid rgb(201 231 122 / .2); border-radius: 50%; box-shadow: 0 0 0 3rem rgb(201 231 122 / .025), 0 0 0 6rem rgb(201 231 122 / .02); }
.logistics > div:first-child { position: relative; z-index: 2; }
.logistics h2 { max-width: 10ch; }
.logistics p { color: #b9c8c2; }
.route-map { position: relative; z-index: 2; min-height: 32rem; overflow: hidden; border: 1px solid rgb(255 255 255 / .18); border-radius: 1.8rem; background: linear-gradient(90deg, rgb(7 30 24 / .7), transparent 60%), url("../images/pelin-careful-packing.webp") center / cover; box-shadow: 0 30px 70px rgb(0 0 0 / .28); }
.route-map::after { content: ""; position: absolute; inset: 0; background: url("../svg/route-network.svg") center / 112% auto no-repeat; opacity: .72; pointer-events: none; }
.route-line { position: absolute; inset: 12% 8%; border: 2px dashed var(--pistachio); border-radius: 50% 28% 44% 31%; opacity: .8; transform: rotate(-8deg); animation: routeGlow 3s ease-in-out infinite alternate; }
.route-dot { position: absolute; z-index: 2; width: 1rem; height: 1rem; border: 4px solid #fff; border-radius: 50%; background: var(--tomato); box-shadow: 0 0 0 7px rgb(215 84 67 / .25); }
.route-dot:nth-child(2) { left: 18%; top: 28%; }
.route-dot:nth-child(3) { right: 15%; top: 35%; }
.route-dot:nth-child(4) { left: 45%; bottom: 17%; }
.van { position: absolute; left: 42%; top: 38%; display: grid; place-items: center; width: 4.8rem; height: 3.4rem; border-radius: .8rem; background: var(--pistachio); font-size: 0; box-shadow: var(--shadow-soft); }
.van::before { content: ""; width: 2.8rem; height: 1.55rem; border-radius: .25rem .65rem .25rem .25rem; background: var(--forest-900); box-shadow: -.7rem 1.25rem 0 -.45rem var(--forest-900), 1.55rem 1.25rem 0 -.45rem var(--forest-900); }
.status-card { position: absolute; z-index: 3; padding: .95rem 1.1rem; border: 1px solid rgb(255 255 255 / .24); border-radius: .9rem; background: rgb(255 254 250 / .9); color: var(--forest-1000); box-shadow: var(--shadow-soft); backdrop-filter: blur(10px); font-size: .72rem; }
.status-card--a { right: 1.2rem; bottom: 1.2rem; }
.status-card--b { left: 1.2rem; top: 1.2rem; }
.check-list { padding: 0; list-style: none; }
.check-list li { position: relative; padding: .7rem 0 .7rem 1.8rem; border-bottom: 1px solid rgb(255 255 255 / .15); color: #dbe5e1; }
.check-list li::before { content: ""; position: absolute; left: 0; top: 1rem; width: .72rem; height: .38rem; border-left: 2px solid var(--pistachio); border-bottom: 2px solid var(--pistachio); transform: rotate(-45deg); }
@keyframes routeGlow { to { filter: drop-shadow(0 0 8px rgb(201 231 122 / .65)); opacity: 1; } }

/* Payment */
.payment-panel { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; gap: 4rem; align-items: center; padding: clamp(2.5rem, 6vw, 5.5rem); overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(135deg, var(--sage-100), var(--paper) 55%, #f8e8dc); }
.payment-panel::before { content: "✓"; position: absolute; right: 42%; top: 1.5rem; display: grid; place-items: center; width: 3.4rem; height: 3.4rem; border-radius: 50%; background: var(--forest-900); color: var(--pistachio); box-shadow: var(--shadow-soft); font-weight: 900; }
.payment-panel h2 { max-width: 13ch; }
.payment-marks { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; padding: 2rem; border-radius: 1.45rem; background: var(--forest-900); box-shadow: var(--shadow-mid); transform: rotate(2deg); }
.payment-marks::before { content: "••••  2048"; grid-column: 1 / -1; padding: .4rem 0 1.2rem; color: #d9e5df; font: 700 .84rem/1 var(--font-body); letter-spacing: .15em; }
.payment-mark { padding: 1.05rem; border: 1px solid rgb(255 255 255 / .15); border-radius: .7rem; background: rgb(255 255 255 / .09); color: #fff; text-align: center; font-size: .82rem; font-weight: 850; letter-spacing: .02em; }

/* Download centerpiece */
.download { position: relative; display: grid; grid-template-columns: 1.1fr auto .6fr; gap: 3.5rem; align-items: center; padding: clamp(3rem, 6vw, 6.5rem); overflow: hidden; border-radius: var(--radius-lg); background: radial-gradient(circle at 84% 25%, rgb(201 231 122 / .2), transparent 15rem), var(--forest-950); color: #fff; box-shadow: var(--shadow-deep); }
.download::before { content: ""; position: absolute; right: -5rem; bottom: -13rem; width: 30rem; aspect-ratio: 1; border: 1px solid rgb(201 231 122 / .2); border-radius: 50%; box-shadow: 0 0 0 3.5rem rgb(201 231 122 / .035), 0 0 0 7rem rgb(201 231 122 / .025); }
.download h2 { max-width: 12ch; }
.download p { color: #bdccc6; }
.download > * { position: relative; z-index: 2; }
.qr-card { width: 14.5rem; padding: .85rem; border: .65rem solid #fff; border-radius: 1.4rem; background: #fff; color: var(--forest-900); box-shadow: 0 0 0 1px rgb(201 231 122 / .35), 0 24px 55px rgb(0 0 0 / .28); transform: rotate(-3deg); transition: transform var(--ease-spring); }
.qr-card:hover { transform: rotate(0) scale(1.035); }
.qr-card img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; }
.qr-card a { display: block; padding-top: .45rem; text-align: center; font-size: .7rem; font-weight: 850; }
.download .mini-phone { position: relative; display: grid; place-items: center; height: 19rem; border: 4px solid #33473f; border-radius: 2.4rem; background: linear-gradient(160deg, #f5f1e7, #dfeadb); color: transparent; box-shadow: 0 30px 60px rgb(0 0 0 / .3); font-size: 0; transform: rotate(9deg); }
.download .mini-phone::before { content: "PELIN"; color: var(--forest-900); font: 900 1rem/1 var(--font-display); letter-spacing: .15em; }
.download .mini-phone::after { content: ""; position: absolute; left: 1.2rem; right: 1.2rem; bottom: 1.2rem; height: 5rem; border-radius: 1rem; background: url("../images/pelin-market-harvest.webp") 50% center / 200% auto; }

/* FAQ and closing CTA */
.faq-list { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-question { display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: center; width: 100%; padding: 1.55rem 0; border: 0; background: transparent; color: var(--charcoal); text-align: left; font-size: 1rem; font-weight: 820; cursor: pointer; }
.faq-question span:last-child { display: grid; place-items: center; width: 2.15rem; height: 2.15rem; border: 1px solid var(--line); border-radius: 50%; color: var(--leaf-600); font-size: 1.2rem; transition: transform var(--ease-out), background var(--ease-out); }
.faq-question[aria-expanded="true"] span:last-child { background: var(--sage-100); transform: rotate(180deg); }
.faq-answer { padding: 0 4rem 1.6rem 0; color: var(--muted); }
.faq-answer p { margin-bottom: 0; }
.js .faq-answer[hidden] { display: none; }
.final-cta { position: relative; padding: var(--space-10) 1rem; overflow: hidden; background: var(--pistachio); color: var(--forest-1000); text-align: center; }
.final-cta::before, .final-cta::after { content: ""; position: absolute; border: 1px solid rgb(16 60 47 / .16); border-radius: 50%; }
.final-cta::before { width: 26rem; height: 26rem; left: -15rem; top: -16rem; box-shadow: 0 0 0 3rem rgb(16 60 47 / .03); }
.final-cta::after { width: 17rem; height: 17rem; right: -7rem; bottom: -10rem; }
.final-cta h2 { position: relative; z-index: 1; max-width: 14ch; margin-inline: auto; }
.final-cta p { position: relative; z-index: 1; margin-inline: auto; }
.final-cta .button { position: relative; z-index: 1; }

/* Footer */
.site-footer { position: relative; padding: 5.5rem 0 1.5rem; overflow: hidden; background: var(--forest-1000); color: #fff; }
.site-footer::before { content: ""; position: absolute; width: 34rem; height: 34rem; right: -16rem; top: -25rem; border: 1px solid rgb(201 231 122 / .16); border-radius: 50%; box-shadow: 0 0 0 4rem rgb(201 231 122 / .025), 0 0 0 8rem rgb(201 231 122 / .02); }
.footer-grid { position: relative; display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 4rem; }
.footer-grid > div:first-child { padding-right: 2rem; }
.footer-title { margin-bottom: 1.2rem; color: var(--pistachio); font-size: .7rem; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }
.footer-links { padding: 0; list-style: none; }
.footer-links li { margin: .65rem 0; }
.footer-links a { position: relative; color: #c6d2cd; font-size: .84rem; text-decoration: none; transition: color var(--ease-out); }
.footer-links a:hover { color: #fff; }
.footer-note { max-width: 29rem; margin-top: 1.2rem; color: #a9bbb3; font-size: .84rem; }
.footer-bottom { display: flex; justify-content: space-between; gap: 1rem; margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid var(--line-dark); color: #91a69d; font-size: .72rem; }
.back-top { position: fixed; right: 1rem; bottom: 1rem; z-index: 30; display: grid; place-items: center; width: 3rem; height: 3rem; border: 1px solid rgb(255 255 255 / .2); border-radius: 50%; background: var(--forest-900); color: #fff; box-shadow: var(--shadow-soft); opacity: 0; pointer-events: none; cursor: pointer; transition: opacity var(--ease-out), transform var(--ease-out); }
.back-top.is-visible { opacity: 1; pointer-events: auto; }
.back-top:hover { transform: translateY(-4px); }

/* Produce-only editorial updates */
.category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 34rem; }
.category, .category:nth-child(n) { grid-column: auto; grid-row: auto; background-size: cover; background-position: center; }
.category:nth-child(1) { background-image: linear-gradient(180deg, rgb(7 30 24 / .03) 22%, rgb(7 30 24 / .9) 100%), url("../images/pelin-fruits.webp"); }
.category:nth-child(2) { background-image: linear-gradient(180deg, rgb(7 30 24 / .03) 22%, rgb(7 30 24 / .9) 100%), url("../images/pelin-vegetables.webp"); }
.category h3 { bottom: 5.2rem; font-size: clamp(2rem, 4vw, 3.65rem); }
.category p { bottom: 1.4rem; max-width: 42rem; min-height: 2.6rem; overflow: visible; white-space: normal; text-overflow: clip; }
.category .tag { position: relative; z-index: 1; }
.produce-gallery { display: grid; grid-template-columns: 1.35fr .85fr; grid-template-rows: repeat(2, 18rem); gap: .9rem; }
.produce-gallery figure { position: relative; min-width: 0; margin: 0; overflow: hidden; border-radius: var(--radius-md); background: var(--forest-900); box-shadow: var(--shadow-soft); }
.produce-gallery__wide { grid-row: 1 / -1; }
.produce-gallery img { width: 100%; height: 100%; object-fit: cover; }
.produce-gallery figcaption { position: absolute; inset: auto 0 0; display: grid; gap: .25rem; padding: 3.5rem 1.5rem 1.35rem; background: linear-gradient(transparent, rgb(7 30 24 / .92)); color: #fff; }
.produce-gallery figcaption strong { font-family: var(--font-display); font-size: var(--step-1); }
.produce-gallery figcaption span { color: #d7e2de; font-size: .78rem; }
.payment-mark { display: grid; place-items: center; min-height: 5.7rem; padding: .7rem; }
.payment-mark img { display: block; width: min(100%, 10rem); height: auto; border-radius: .75rem; }
.route-map { background-image: linear-gradient(90deg, rgb(7 30 24 / .72), transparent 62%), url("../images/pelin-produce-delivery.webp"); }
.editorial-pair { display: grid; grid-template-columns: 1.15fr .85fr; gap: .9rem; }
.editorial-pair figure { position: relative; min-height: 28rem; margin: 0; overflow: hidden; border-radius: var(--radius-md); background: var(--forest-900); box-shadow: var(--shadow-soft); }
.editorial-pair figure:nth-child(2) { margin-top: 3rem; }
.editorial-pair img { width: 100%; height: 100%; object-fit: cover; }
.editorial-pair figcaption { position: absolute; inset: auto 0 0; padding: 3rem 1.4rem 1.25rem; background: linear-gradient(transparent, rgb(7 30 24 / .9)); color: #eef4f1; font-size: .82rem; }
.editorial-pair--compact { margin-top: 3rem; }
.editorial-pair--compact figure { min-height: 22rem; }

/* Progressive reveal */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 700ms ease, transform 700ms cubic-bezier(.2,.75,.2,1); }
.reveal:nth-child(2) { transition-delay: 70ms; }
.reveal:nth-child(3) { transition-delay: 140ms; }
.reveal:nth-child(4) { transition-delay: 210ms; }
.reveal:nth-child(5) { transition-delay: 280ms; }
.reveal:nth-child(6) { transition-delay: 350ms; }
.reveal.is-visible { opacity: 1; transform: none; }
.noscript { padding: .75rem 1rem; background: #fff3cd; color: #4b3e06; text-align: center; font-size: .82rem; }