:root { --green:#0b8f55; --green-dark:#07683f; --green-soft:#dff7e9; --ink:#13231b; --muted:#68766f; --cream:#f7f8f3; --line:#dfe7e2; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:var(--font-geist),Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.site-header { width:min(1180px,calc(100% - 48px)); height:92px; margin:0 auto; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:32px; }
.brand { display:inline-flex; align-items:center; width:max-content; gap:10px; }
.brand img { width:54px; height:54px; object-fit:contain; }
.brand span { font-size:10px; font-weight:800; letter-spacing:.24em; color:var(--green); }
nav { display:flex; gap:34px; font-size:14px; font-weight:650; }
nav a { transition:color .2s ease; } nav a:hover { color:var(--green); }
.header-cta { justify-self:end; padding:12px 19px; border:1px solid var(--ink); border-radius:999px; font-size:13px; font-weight:750; }
.hero { position:relative; overflow:hidden; min-height:650px; display:grid; grid-template-columns:minmax(0,1fr) minmax(430px,.9fr); align-items:center; gap:50px; width:min(1180px,calc(100% - 48px)); margin:0 auto; padding:62px 0 76px; }
.hero-copy { position:relative; z-index:2; }
.eyebrow { display:flex; align-items:center; gap:10px; color:var(--green-dark); font-size:12px; font-weight:800; letter-spacing:.14em; }
.eyebrow span { width:26px; height:2px; background:var(--green); }
.hero h1 { margin:24px 0 22px; font-size:clamp(54px,6vw,86px); line-height:.96; letter-spacing:-.065em; font-weight:820; }
.hero h1 em { color:var(--green); font-style:normal; }
.hero-copy>p { max-width:570px; margin:0; color:var(--muted); font-size:19px; line-height:1.65; }
.hero-actions { display:flex; align-items:center; gap:28px; margin-top:34px; }
.primary-button { padding:16px 24px; border-radius:14px; background:var(--green); color:#fff; font-size:15px; font-weight:780; box-shadow:0 12px 28px rgb(11 143 85 / 22%); }
.text-link { font-size:14px; font-weight:720; } .text-link span { margin-left:5px; color:var(--green); }
.trust-row { display:flex; flex-wrap:wrap; gap:24px; margin-top:44px; padding-top:24px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }
.trust-row b { display:block; color:var(--ink); font-size:13px; margin-bottom:3px; }
.hero-visual { min-height:515px; position:relative; display:grid; place-items:center; }
.halo { position:absolute; border-radius:50%; } .halo-one { width:470px; height:470px; background:var(--green-soft); } .halo-two { width:330px; height:330px; border:1px solid rgb(11 143 85 / 18%); }
.phone { position:relative; z-index:2; width:278px; padding:10px; border-radius:38px; background:#101914; box-shadow:0 34px 70px rgb(19 35 27 / 25%); transform:rotate(3deg); }
.phone-top { height:28px; padding:4px 12px 0; display:flex; justify-content:space-between; color:#fff; font-size:10px; font-weight:700; }
.phone-top i { width:52px; height:16px; border-radius:999px; background:#020504; }
.phone-content { min-height:440px; border-radius:27px; padding:20px 16px; background:#fff; overflow:hidden; }
.location-label { font-size:7px; font-weight:800; color:#9aa39e; letter-spacing:.13em; } .location { margin-top:3px; font-size:11px; font-weight:800; } .location span { color:var(--green); }
.search { margin:16px 0 18px; padding:11px 12px; border-radius:10px; background:#f0f3f1; color:#99a19d; font-size:8px; }
.phone-heading { font-size:17px; font-weight:820; letter-spacing:-.03em; }
.phone-categories { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin:14px 0 20px; }
.mini-category { display:grid; justify-items:center; gap:5px; font-size:7px; font-weight:700; }
.mini-category span { display:grid; place-items:center; width:40px; height:40px; border-radius:13px; background:var(--green-soft); color:var(--green-dark); font-size:15px; font-weight:850; }
.nearby-label { display:flex; justify-content:space-between; font-size:11px; font-weight:800; } .nearby-label span { color:var(--green); font-size:8px; }
.store-preview { margin-top:10px; border:1px solid #edf0ee; border-radius:14px; overflow:hidden; }
.store-image { height:90px; position:relative; background:linear-gradient(145deg,#163b2b,#5fa16e); }
.store-image::before,.store-image::after { content:''; position:absolute; border-radius:999px; background:#f1b24c; transform:rotate(-10deg); }
.store-image::before { width:88px; height:22px; left:25px; top:31px; } .store-image::after { width:70px; height:18px; right:20px; top:46px; background:#e76742; }
.store-image span { position:absolute; z-index:2; left:12px; top:10px; color:#fff; font-size:8px; font-weight:800; }
.store-meta { display:flex; justify-content:space-between; align-items:center; padding:10px; } .store-meta b { display:block; font-size:9px; } .store-meta small { display:block; margin-top:2px; color:#919a95; font-size:7px; }
.store-meta strong { padding:6px 7px; border-radius:8px; background:var(--green-soft); color:var(--green-dark); font-size:8px; }
.floating-card { position:absolute; z-index:3; display:flex; align-items:center; gap:8px; padding:13px 16px; border:1px solid rgb(255 255 255 / 70%); border-radius:14px; background:rgb(255 255 255 / 88%); box-shadow:0 18px 38px rgb(19 35 27 / 14%); backdrop-filter:blur(12px); }
.floating-card span { display:block; color:var(--muted); font-size:9px; } .floating-time { top:88px; right:0; display:block; } .floating-time b { font-size:16px; }
.floating-live { bottom:88px; left:4px; font-size:11px; font-weight:750; } .floating-live i { width:8px; height:8px; border-radius:50%; background:#20c676; box-shadow:0 0 0 5px rgb(32 198 118 / 14%); }
.service-strip { width:min(1180px,calc(100% - 48px)); margin:0 auto 70px; display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); border-radius:22px; background:#fff; overflow:hidden; }
.service-strip article { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:14px; padding:23px 26px; border-right:1px solid var(--line); }
.service-strip article:last-child { border-right:0; } .service-strip article>span { display:grid; place-items:center; width:44px; height:44px; border-radius:14px; background:var(--green-soft); color:var(--green-dark); font-weight:850; }
.service-strip h2 { margin:0; font-size:14px; } .service-strip p { margin:3px 0 0; color:var(--muted); font-size:11px; } .service-strip article>b { color:#a2aca7; font-weight:500; }
.stores-section,.steps-section,.applications-section,.download-section,footer { width:min(1180px,calc(100% - 48px)); margin-inline:auto; }
.stores-section { padding:86px 0 92px; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:32px; }
.section-heading>p { max-width:390px; margin:0; color:var(--muted); font-size:14px; line-height:1.6; }
.section-kicker { display:block; margin-bottom:10px; color:var(--green); font-size:11px; font-weight:850; letter-spacing:.16em; }
.section-heading h2,.steps-section h2,.partner-section h2,.download-section h2 { margin:0; font-size:clamp(34px,4vw,52px); line-height:1.02; letter-spacing:-.045em; }
.store-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.store-card { overflow:hidden; border:1px solid var(--line); border-radius:22px; background:#fff; transition:transform .2s ease,box-shadow .2s ease; }
.store-card:hover { transform:translateY(-4px); box-shadow:0 22px 45px rgb(19 35 27 / 10%); }
.store-cover { position:relative; height:178px; padding:18px; background:linear-gradient(145deg,#d9f5e5,#80c99d); }
.cover-drinks { background:linear-gradient(145deg,#dcecff,#7ba9d9); }
.cover-ice-cream { background:linear-gradient(145deg,#fff0d8,#f3b565); }
.store-logo { display:grid; place-items:center; width:64px; height:64px; border:5px solid rgb(255 255 255 / 68%); border-radius:20px; background:#fff; color:var(--green); box-shadow:0 8px 22px rgb(19 35 27 / 12%); font-size:23px; font-weight:900; }
.open-pill { position:absolute; right:16px; top:16px; padding:7px 10px; border-radius:999px; background:#fff; color:var(--green-dark); font-size:10px; font-weight:800; }
.store-card-copy { padding:21px 22px 23px; }
.store-category { color:var(--green); font-size:10px; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }
.store-card h3 { margin:6px 0 8px; font-size:21px; letter-spacing:-.025em; }
.store-card p { min-height:38px; margin:0; color:var(--muted); font-size:13px; line-height:1.5; }
.store-facts { display:flex; gap:8px; margin:18px 0 10px; }
.store-facts span { padding:7px 9px; border-radius:9px; background:var(--green-soft); color:var(--green-dark); font-size:10px; font-weight:800; }
.store-card small { color:#8b9690; font-size:10px; }
.catalog-state { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:24px; color:var(--muted); font-size:11px; }
.catalog-state i { width:7px; height:7px; border-radius:50%; background:#b5bdb9; }.catalog-state i.online { background:#20c676; box-shadow:0 0 0 4px rgb(32 198 118 / 13%); }
.steps-section { padding:92px 0; border-top:1px solid var(--line); }
.section-heading.compact { margin-bottom:40px; }
.steps-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.steps-grid article { padding:30px; border-radius:20px; background:#fff; }
.steps-grid b { color:var(--green); font-size:12px; letter-spacing:.12em; }.steps-grid h3 { margin:30px 0 9px; font-size:19px; }.steps-grid p { margin:0; color:var(--muted); font-size:13px; line-height:1.6; }
.partner-section { width:min(1250px,calc(100% - 32px)); margin:0 auto; padding:72px max(36px,calc((100% - 1100px)/2)); display:grid; grid-template-columns:1.2fr .8fr; align-items:center; gap:80px; border-radius:28px; background:var(--green-dark); color:#fff; }
.section-kicker.light { color:#8de5b5; }.partner-copy p { max-width:590px; margin:22px 0 0; color:#c2ddce; line-height:1.7; }
.partner-actions { display:grid; gap:12px; }.partner-actions a { display:flex; justify-content:space-between; padding:18px 20px; border:1px solid rgb(255 255 255 / 18%); border-radius:14px; background:rgb(255 255 255 / 8%); font-size:13px; font-weight:750; }.partner-actions span { color:#8de5b5; }
.applications-section { padding:100px 0 30px; scroll-margin-top:30px; }
.application-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; align-items:start; }
.application-form { scroll-margin-top:30px; padding:28px; border:1px solid var(--line); border-radius:24px; background:#fff; box-shadow:0 18px 45px rgb(19 35 27 / 6%); }
.form-heading { display:flex; align-items:center; gap:14px; padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid var(--line); }
.form-heading>span { display:grid; place-items:center; flex:0 0 42px; width:42px; height:42px; border-radius:13px; background:var(--green-soft); color:var(--green-dark); font-size:12px; font-weight:900; }
.form-heading h3 { margin:0 0 4px; font-size:21px; letter-spacing:-.025em; }.form-heading p { margin:0; color:var(--muted); font-size:12px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.form-grid label { display:grid; gap:7px; color:#415149; font-size:11px; font-weight:800; }.form-grid .wide { grid-column:1/-1; }
.form-grid input,.form-grid select,.form-grid textarea { width:100%; border:1px solid #d8e3dc; border-radius:11px; padding:12px 13px; background:#fbfcfa; color:var(--ink); font:inherit; outline:0; resize:vertical; }
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus { border-color:var(--green); box-shadow:0 0 0 3px rgb(11 143 85 / 10%); }
.consent { display:flex; align-items:flex-start; gap:9px; margin:17px 0; color:var(--muted); font-size:11px; line-height:1.5; }.consent input { margin-top:2px; accent-color:var(--green); }
.application-form>button { width:100%; border:0; border-radius:12px; padding:14px 18px; background:var(--green); color:#fff; font-weight:850; cursor:pointer; }.application-form>button:disabled { opacity:.58; cursor:wait; }
.form-status { min-height:18px; margin:11px 0 0; color:var(--muted); font-size:11px; line-height:1.45; }.form-status.success { color:var(--green-dark); }.form-status.error { color:#a33c32; }
.website-field { position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; opacity:0!important; }
.download-section { padding:105px 0; display:flex; align-items:center; justify-content:space-between; gap:50px; }.download-section p { max-width:520px; margin:22px 0 0; color:var(--muted); line-height:1.65; }
.download-badge { display:flex; align-items:center; gap:14px; padding:17px 22px; border-radius:17px; background:var(--ink); color:#fff; box-shadow:0 18px 38px rgb(19 35 27 / 18%); }.download-badge>span { display:grid; place-items:center; width:45px; height:45px; border-radius:12px; background:var(--green); font-weight:900; }.download-badge small,.download-badge b { display:block; }.download-badge small { margin-bottom:3px; color:#acb8b1; font-size:8px; letter-spacing:.1em; }.download-badge b { font-size:15px; }
footer { position:relative; display:grid; grid-template-columns:2fr 1fr 1fr; gap:50px; padding:45px 0 78px; border-top:1px solid var(--line); }.footer-brand img { width:70px; }.footer-brand p { color:var(--muted); font-size:12px; }footer>div:not(.footer-brand) { display:grid; align-content:start; gap:10px; font-size:12px; }footer>div>b { margin-bottom:4px; }footer>div a,footer>div span { color:var(--muted); }footer>small { position:absolute; bottom:28px; left:0; color:#909b95; font-size:10px; }
@media(max-width:860px){.site-header{grid-template-columns:1fr auto;height:78px}nav{display:none}.hero{grid-template-columns:1fr;padding-top:44px}.hero-copy{text-align:center}.eyebrow,.hero-actions,.trust-row{justify-content:center}.hero-copy>p{margin-inline:auto}.hero-visual{min-height:545px}.service-strip{grid-template-columns:1fr}.service-strip article{border-right:0;border-bottom:1px solid var(--line)}.service-strip article:last-child{border-bottom:0}.store-grid,.steps-grid,.application-grid{grid-template-columns:1fr}.section-heading{align-items:start;flex-direction:column;gap:14px}.store-card{display:grid;grid-template-columns:180px 1fr}.store-cover{height:100%}.partner-section{grid-template-columns:1fr;gap:40px}.download-section{align-items:flex-start;flex-direction:column}footer{grid-template-columns:1.5fr 1fr 1fr}}
@media(max-width:520px){.site-header,.hero,.service-strip,.stores-section,.steps-section,.applications-section,.download-section,footer{width:min(100% - 28px,1180px)}.header-cta{padding:10px 14px;font-size:11px}.brand img{width:46px;height:46px}.brand span{display:none}.hero h1{font-size:52px}.hero-copy>p{font-size:16px}.hero-actions{flex-direction:column;gap:18px}.trust-row{gap:14px}.hero-visual{transform:scale(.92);margin:-18px 0}.floating-time{right:-10px}.floating-live{left:-10px}.stores-section,.steps-section{padding:64px 0}.applications-section{padding:70px 0 20px}.application-form{padding:22px 18px}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}.store-card{display:block}.store-cover{height:150px}.partner-section{width:calc(100% - 20px);padding:50px 24px}.download-section{padding:70px 0}footer{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
