
:root{
  --bg:#fbfbf8;
  --paper:#ffffff;
  --text:#13161b;
  --muted:#6f747b;
  --line:#e9ece6;
  --green:#2E6B3E;
  --green-dark:#0E4429;
  --green-soft:#eef4ed;
  --green-soft-2:#f5f8f1;
  --green-light:#16CD6E;
  --shadow:0 24px 60px rgba(21, 38, 16, .08);
  --radius-xl:28px;
  --radius-lg:24px;
  --radius-md:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Poppins",system-ui,sans-serif;
  background:var(--bg);
  color:var(--text);
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
.container{width:min(1240px, calc(100% - 80px)); margin:0 auto}
.section-pad{padding:42px 0}
.site-header{
  position:sticky; top:0; z-index:50; background:rgba(251,251,248,.88); backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(0,0,0,.03)
}
.header-inner{height:64px; display:flex; align-items:center; justify-content:space-between; gap:28px}
.brand{display:flex; align-items:center; gap:12px; font-weight:800; font-size:24px; color:#2E6B3E}
.brand-mark{width:42px;height:42px;display:inline-grid;place-items:center}
.brand-mark svg{width:42px;height:42px}
.nav{display:flex; align-items:center; gap:38px; font-weight:600; color:#2c3136}
.nav a{font-size:15px}
.header-actions{display:flex; align-items:center; gap:14px}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  border-radius:999px; padding:13px 22px; font-size:15px; font-weight:700;
  border:1px solid transparent; transition:.2s ease;
}
.btn-primary{background:#16CD6E; color:#06311d; border:none; box-shadow:0 10px 24px rgba(22,205,110,.30)}
.btn-ghost{background:transparent; color:#0E4429; border-color:rgba(14,68,41,.20)}
.btn-outline{border-color:#a6c5aa; background:#fff; color:var(--green); min-width:210px}
.btn.light{background:#0E4429; color:#fff; align-self:flex-start}
.partner-btn{background:#fff; border:none; color:#0E4429; align-self:flex-start; box-shadow:0 8px 20px rgba(0,0,0,.14)}
.hero{padding:34px 0 22px}
.hero-grid{display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:12px}
.hero-copy{padding:40px 0 30px}
.hero-copy h1{margin:0 0 26px; font-size:54px; line-height:1.06; font-weight:800; letter-spacing:-1.4px}
.hero-copy h1 span{color:var(--green)}
.hero-copy p{max-width:520px; margin:0 0 26px; color:#5f666d; font-size:18px; line-height:1.6}
.store-row{display:flex; align-items:center; gap:16px; flex-wrap:wrap}
.store{
  min-width:190px; height:64px; padding:0 20px; border-radius:14px; border:1px solid #d7ddd6;
  display:inline-flex; align-items:center; gap:14px; font-weight:800; background:#fff;
}
.store b{font-size:29px; line-height:1}
.store span{display:flex; flex-direction:column; font-size:20px; line-height:1.1}
.store small{font-size:12px; letter-spacing:.06em; font-weight:700; color:#6c7076; margin-top:4px}
.store-green{background:var(--green); color:#fff; border-color:transparent}
.store-green small{color:#d8ece0}
.store .play{width:26px;height:26px; display:inline-block; background:linear-gradient(45deg,#34a853 10%, #fbbc04 55%, #ea4335 85%); clip-path:polygon(0 0, 100% 50%, 0 100%)}
.social-proof{margin-top:22px; display:flex; align-items:center; gap:14px; color:#6f757b; font-size:16px}
.social-proof b{color:#252a30}
.faces{display:flex; align-items:center}
.faces i{width:30px;height:30px;border-radius:50%; border:3px solid var(--bg); margin-left:-8px; background:linear-gradient(135deg,#ddc0ab,#8b5131)}
.faces i:first-child{margin-left:0}
.faces i:nth-child(2){background:linear-gradient(135deg,#f2c9aa,#83522c)}
.faces i:nth-child(3){background:linear-gradient(135deg,#e2b17f,#6f3f24)}
.faces i:nth-child(4){background:linear-gradient(135deg,#e6cfb2,#52341f)}
.hero-visual{position:relative; min-height:730px}
.hero-orb{position:absolute; inset:80px 20px 70px 20px; border-radius:50%; background:radial-gradient(circle at center, rgba(196,220,190,.55) 0, rgba(226,235,220,.45) 38%, rgba(244,247,241,.35) 62%, rgba(244,247,241,0) 72%)}
.hero-phone{position:absolute; width:70%; min-width:450px; right:90px; top:20px; z-index:2; filter:drop-shadow(0 30px 44px rgba(0,0,0,.12))}
.hero-deco{position:absolute; z-index:1}
.burger-float{width:235px; left:10px; top:260px}
.flower-float{width:205px; left:10px; top:510px}
.basket-float{width:255px; right:20px; top:290px}
.section-head.center{text-align:center; margin-bottom:30px}
.section-head.left{text-align:left}
.section-head h2{margin:0 0 12px; font-size:42px; line-height:1.1; letter-spacing:-1px; font-weight:700}
.section-head h2 span{color:var(--green)}
.section-head p{margin:0; color:var(--muted); font-size:17px}
.category-wrap{display:grid; grid-template-columns:54px 1fr 54px; align-items:center; gap:18px}
.round-nav{width:46px;height:46px;border:none;border-radius:50%; background:#2E6B3E; color:#fff; font-size:34px; line-height:1; cursor:pointer; display:grid; place-items:center; box-shadow:0 8px 20px rgba(46,107,62,.18)}
.round-nav.muted{background:#eef2ec; color:#bcc4ba; box-shadow:none}
.category-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:18px}
.cat-card{background:#fff; border:1px solid #e7ece6; border-radius:24px; height:196px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; box-shadow:0 10px 24px rgba(11,34,18,.04)}
.cat-card img{width:108px; height:108px; object-fit:contain}
.cat-card strong{font-size:18px; font-weight:600}
.centered-wrap{display:flex; justify-content:center; margin-top:28px}
.how-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center}
.how-copy h2{margin:0 0 12px; font-size:42px; line-height:1.1; letter-spacing:-1px; font-weight:700}
.how-copy h2 span{color:var(--green)}
.how-copy>p{margin:0; font-size:16px; color:var(--muted)}
.mini-line{display:block; width:34px; height:4px; background:#a7cfa9; border-radius:8px; margin:24px 0 26px}
.steps-row{display:grid; grid-template-columns:1fr 80px 1fr 80px 1fr; align-items:start; gap:0}
.step-connector{height:0; margin-top:57px; border-top:4px dashed #d4e2d2}
.step-item{max-width:232px}
.step-badge{width:124px;height:124px;border-radius:50%; background:var(--green-soft); display:grid; place-items:center; color:var(--green); margin-bottom:22px}
.step-badge svg{width:54px;height:54px; fill:currentColor}
.step-item h3{margin:0 0 12px; font-size:18px; line-height:1.25; font-weight:700}
.step-item p{margin:0; color:var(--muted); font-size:15px; line-height:1.6}
.courier-card{position:relative; background:#fff; border-radius:34px; overflow:visible; padding:0; box-shadow:var(--shadow)}
.courier-card img{width:100%; border-radius:34px}
.dots{position:absolute; right:-28px; bottom:-22px; width:124px; height:104px; background-image:radial-gradient(#d4e4d2 1.8px, transparent 1.8px); background-size:16px 16px; z-index:-1}
.campaign-band{display:grid; grid-template-columns:1.2fr 1fr 1fr 1fr; gap:18px; background:linear-gradient(135deg,#0E4429 0%, #2E6B3E 100%); border-radius:28px; padding:24px; box-shadow:var(--shadow)}
.campaign-lead{color:#fff; display:flex; flex-direction:column; justify-content:center; padding:10px 8px}
.campaign-lead h2{margin:0 0 16px; font-size:38px; line-height:1.08; letter-spacing:-0.8px; font-weight:700}
.campaign-lead p{margin:0 0 22px; color:#e7f4e7; font-size:16px; max-width:290px}
.promo-card{position:relative; min-height:242px; background:rgba(255,255,255,.92); border-radius:24px; padding:20px; overflow:hidden}
.promo-card span{display:block; color:#4f585e; font-size:15px; margin-bottom:14px; font-weight:600}
.promo-card strong{display:block; font-size:42px; line-height:1; letter-spacing:-1px; color:#2E6B3E; margin-bottom:14px}
.promo-card small{font-size:15px; color:#5d646b}
.promo-card img{position:absolute; right:-8px; bottom:-2px; width:120px}
.cities-grid{display:grid; grid-template-columns:1.1fr 1fr 1fr; gap:18px; align-items:stretch}
.city-head{padding-top:16px}
.city-card{position:relative; border-radius:24px; overflow:hidden; min-height:206px; box-shadow:var(--shadow)}
.city-card img{width:100%; height:100%; object-fit:cover}
.city-overlay{position:absolute; inset:auto 0 0 0; padding:18px 18px 16px; color:#fff; background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.65) 100%)}
.city-overlay strong{display:block; font-size:28px; margin-bottom:4px; font-weight:800}
.city-overlay span{font-size:16px; color:#dce5db}
.coming-city{background:#fff; border:1px solid #edf0ec; border-radius:24px; padding:28px; display:flex; flex-direction:column; justify-content:space-between; min-height:206px}
.coming-icon{width:44px; height:44px; border-radius:12px; background:#f2f6f1; display:grid; place-items:center; color:var(--green); font-size:26px; margin-bottom:12px}
.coming-city strong{font-size:34px; line-height:1.05; color:#2E6B3E}
.partner-band{display:grid; grid-template-columns:1.05fr 1.25fr; align-items:stretch; gap:0; border-radius:28px; overflow:hidden; background:radial-gradient(125% 125% at 85% 120%, #1BAB5D 0%, #1A7E4D 46%, #155C3C 100%); box-shadow:var(--shadow)}
.partner-copy{padding:42px 36px; color:#fff; display:flex; flex-direction:column; justify-content:center}
.partner-copy h2{margin:0 0 18px; font-size:40px; line-height:1.1; letter-spacing:-1px; font-weight:700}
.partner-copy p{margin:0 0 26px; font-size:17px; line-height:1.6; color:#ecf7ea; max-width:460px}
.partner-visual{display:flex; align-items:flex-end; justify-content:flex-end; padding:16px 16px 0 0}
.partner-visual img{width:100%; max-width:860px; border-top-left-radius:18px; border-top-right-radius:18px}
.download-band{display:grid; grid-template-columns:1fr auto 300px; align-items:center; gap:24px; background:#fff; border-radius:28px; padding:24px 28px; box-shadow:var(--shadow); overflow:hidden}
.qr-box{width:90px; height:90px; border-radius:16px; background:#fff; border:1px solid #dae2d8; display:grid; place-items:center}
.qr-grid{width:58px;height:58px; background:
  linear-gradient(90deg,#111 12px,transparent 12px) 0 0/19px 19px,
  linear-gradient(#111 12px,transparent 12px) 0 0/19px 19px,
  radial-gradient(circle at 5px 5px,#111 0 4px,transparent 5px) 0 0/19px 19px;
  filter:contrast(1.2)
}
.download-copy h2{margin:0 0 10px; font-size:36px; line-height:1.08; letter-spacing:-0.8px}
.download-copy p{margin:0; font-size:16px; color:var(--muted); max-width:280px; line-height:1.5}
.download-stores .store{height:58px; min-width:174px}
.download-stores .store span{font-size:18px}
.download-stores .store small{font-size:11px}
.store.dark{background:#0f1011; color:#fff; border:none}
.store.dark small{color:#cfd2d7}
.download-phone{align-self:end; justify-self:end; margin-bottom:-68px; width:270px}
.download-phone img{width:100%}
@media (max-width: 1180px){
  .container{width:min(100% - 40px, 1240px)}
  .hero-grid,.how-grid,.partner-band{grid-template-columns:1fr}
  .hero-visual{min-height:640px}
  .hero-phone{right:50%; transform:translateX(50%)}
  .burger-float{left:40px}
  .flower-float{left:10px}
  .basket-float{right:50px}
  .campaign-band{grid-template-columns:1fr 1fr}
  .cities-grid{grid-template-columns:1fr 1fr}
  .download-band{grid-template-columns:1fr; }
  .download-stores{grid-column:1 / -1}
  .download-phone{grid-column:2; width:200px; margin-bottom:-50px}
}
@media (max-width: 900px){
  .nav{display:none}
  .header-inner{height:auto; padding:16px 0; flex-wrap:wrap}
  .header-actions{width:100%; justify-content:flex-end}
  .hero-copy h1,.section-head h2,.how-copy h2,.campaign-lead h2,.partner-copy h2{font-size:34px}
  .hero-copy p,.partner-copy p{font-size:18px}
  .hero-visual{min-height:530px}
  .hero-phone{min-width:340px; width:75%}
  .category-grid{grid-template-columns:repeat(2,1fr)}
  .category-wrap{grid-template-columns:1fr}
  .round-nav{display:none}
  .steps-row{grid-template-columns:1fr; gap:24px}
  .step-connector{display:none}
  .step-item{max-width:none}
  .step-badge{width:104px; height:104px}
  .campaign-band{grid-template-columns:1fr}
  .cities-grid{grid-template-columns:1fr}
  .coming-city{min-height:180px}
  .download-band{grid-template-columns:1fr}
  .download-phone{grid-column:auto; width:210px; justify-self:center; margin-bottom:-46px}
}


.hero-visual{display:flex; align-items:center; justify-content:center;}
.hero-orb{inset:72px 30px 70px 30px;}
.hero-phone{position:relative; width:min(100%, 760px); min-width:0; right:auto; top:auto; transform:none; filter:drop-shadow(0 28px 40px rgba(0,0,0,.12));}
.hero-deco,.burger-float,.flower-float,.basket-float{display:none !important;}
.steps-row{display:grid; grid-template-columns:1fr 96px 1fr 96px 1fr; align-items:start; gap:0; margin-top:6px;}
.step-item{max-width:250px; text-align:left;}
.step-img{width:132px; height:132px; object-fit:contain; margin:0 0 20px; display:block;}
.step-connector{height:0; margin-top:66px; border-top:4px dashed #d4e2d2;}
.step-badge{display:none;}
@media (max-width: 900px){
  .hero-phone{width:min(100%, 520px);}
  .steps-row{grid-template-columns:1fr; gap:24px;}
  .step-connector{display:none;}
  .step-item{max-width:none;}
  .step-img{width:118px;height:118px; margin-bottom:16px;}
}


/* Final polish overrides */
.hero{padding:38px 0 26px;}
.hero-grid{align-items:center; gap:24px;}
.hero-visual-clean{min-height:auto; display:flex; align-items:center; justify-content:center;}
.hero-composite{width:min(100%, 730px); height:auto; display:block; filter:drop-shadow(0 22px 36px rgba(0,0,0,.08));}
.hero-orb,.hero-phone,.hero-deco{display:none !important;}
.how-grid{align-items:center;}
.courier-card{background:linear-gradient(180deg,#ffffff 0%, #f8faf8 100%); padding:14px 8px 0; min-height:620px; display:flex; align-items:flex-end; justify-content:center;}
.courier-card img{max-height:600px; width:auto; max-width:100%; object-fit:contain;}
.dots{right:-18px; bottom:-14px;}
.partner-band-simple{display:block; background:radial-gradient(125% 125% at 85% 120%, #1BAB5D 0%, #1A7E4D 46%, #155C3C 100%);}
.partner-copy-simple{max-width:720px; padding:48px 42px;}
.partner-actions{display:flex; gap:14px; flex-wrap:wrap; margin-top:8px;}
.partner-alt{border-color:rgba(255,255,255,.55); background:rgba(255,255,255,.12); color:#fff;}
.download-band{grid-template-columns:1fr auto 320px; align-items:center; overflow:visible;}
.download-art{align-self:end; justify-self:end; width:340px; margin-bottom:-34px;}
.download-composite{width:100%; height:auto; display:block; filter:drop-shadow(0 16px 26px rgba(0,0,0,.08));}
.download-phone{display:none !important;}
@media (max-width: 1180px){
  .download-band{grid-template-columns:1fr;}
  .download-art{grid-column:2; width:260px; margin-bottom:-20px;}
}
@media (max-width: 900px){
  .hero-composite{width:min(100%, 520px);} 
  .courier-card{min-height:auto; padding-top:18px;}
  .courier-card img{max-height:460px;}
  .download-art{grid-column:auto; width:220px; justify-self:center; margin-bottom:-16px;}
  .partner-copy-simple{padding:36px 24px;}
}

/* final website overrides */
.hero-composite{width:min(100%, 760px);}
.courier-card{background:transparent; box-shadow:none; min-height:0; padding:0; display:flex; align-items:center; justify-content:center;}
.courier-card img{width:min(100%, 540px); max-width:100%; height:auto; border-radius:28px;}
.dots{display:none;}
.partner-copy-simple p{max-width:760px;}
@media (max-width:900px){.courier-card img{width:min(100%, 420px);}}


/* --- güncellemeler --- */
.store{display:inline-flex; align-items:center; gap:12px; height:auto; min-width:0; padding:12px 20px; border-radius:16px; border:none; background:#0E4429; color:#fff; box-shadow:0 10px 24px rgba(14,68,41,.18); transition:transform .15s ease, background .15s ease}
.store:hover{transform:translateY(-2px); background:#0a3320}
.store-ico{width:26px; height:26px; flex:none}
.store-txt{display:flex; flex-direction:column; align-items:flex-start; line-height:1.05}
.store-txt small{font-size:11px; font-weight:600; letter-spacing:.04em; opacity:.85; color:#fff; margin:0}
.store-txt b{font-size:18px; font-weight:800; color:#fff}
.download-stores .store{height:auto; min-width:0}
.category-wrap{display:block}
.cat-more{display:block; text-align:center; color:#6f747b; font-weight:500; font-size:16px}


.btn-primary:hover{transform:translateY(-2px)}
.btn-ghost:hover{background:rgba(14,68,41,.06)}
.partner-btn:hover{transform:translateY(-2px)}


/* resmi beyaz store badge'leri (App Store / Google Play) */
.store{background:#fff; color:#0b0b0c; border:1.6px solid #0b0b0c; border-radius:12px; padding:9px 18px; box-shadow:0 6px 16px rgba(0,0,0,.08)}
.store:hover{background:#fff; transform:translateY(-2px)}
.store-google{border-color:#e3e3e3}
.store-ico{width:30px; height:30px; flex:none}
.store-txt small{color:#1a1a1a; opacity:1; font-weight:600}
.store-txt b{color:#0b0b0c; font-size:20px; font-weight:700; letter-spacing:-.2px}
.download-stores .store{height:auto; min-width:0}

/* badge resmi orantı ince ayar */
.store{height:60px; padding:0 22px; gap:14px; border-radius:13px; align-items:center; min-width:0}
.store-ico{height:34px; width:auto}
.store-apple .store-ico{height:32px}
.store-txt{gap:2px}
.store-txt small{font-size:13px; font-weight:500; letter-spacing:.2px; color:#1a1a1a}
.store-txt b{font-size:22px; font-weight:600; letter-spacing:-.3px; line-height:1; color:#0b0b0c}
.download-stores .store{height:60px}

/* kurye foto: yuvarlak köşe + sağa hizalı */
.courier-card{display:flex; align-items:center; justify-content:flex-end; background:transparent; box-shadow:none; padding:0; overflow:visible}
.courier-card img{width:min(100%,560px); height:auto; border-radius:24px; margin:0}


/* gerçek badge görselleri */
.store-row{display:flex; align-items:center; gap:14px; flex-wrap:wrap}
.store-img{display:inline-block; line-height:0; transition:transform .15s ease}
.store-img:hover{transform:translateY(-2px)}
.store-img img{height:56px; width:auto; display:block}
.download-stores .store-img img{height:56px}

/* kurye foto FINAL: kolonu doldur, sağ kenar hizalı, köşe kırpılmış */
.courier-card{display:block; background:transparent; box-shadow:none; padding:0; margin:0; overflow:hidden; border-radius:24px; min-height:0}
.courier-card img{width:100%; height:auto; max-height:none; object-fit:cover; border-radius:24px; display:block; margin:0}

/* indir badge'lerini kutusunda ortala */
.download-stores{justify-self:center; align-self:center; justify-content:center}

/* indir badge'leri: kartın tam yatay ortasında */
.download-band{position:relative}
.download-stores{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); justify-self:auto; align-self:auto}

/* indir: badge'ler kopyanın ALTINDA, sol alanda ortalı; telefon sağda */
.download-band{grid-template-columns:1fr 340px; align-items:center}
.download-copy{grid-column:1; grid-row:1}
.download-stores{position:static; transform:none; left:auto; top:auto; grid-column:1; grid-row:2; justify-self:center; align-self:auto; margin-top:24px}
.download-art{grid-column:2; grid-row:1 / span 2; justify-self:end; align-self:end}

/* indir: badge grubu kartın TAM ortasında (simetrik kolonlar), telefon sağda çakışmadan */
.download-band{grid-template-columns:1fr auto 1fr; align-items:center; position:static; gap:20px}
.download-copy{grid-column:1; grid-row:1; justify-self:start; align-self:center}
.download-stores{position:static; transform:none; left:auto; top:auto; grid-column:2; grid-row:1; justify-self:center; align-self:center; margin:0}
.download-art{grid-column:3; grid-row:1; justify-self:end; align-self:center; width:300px; margin-bottom:0}

/* hero "Çok Yakında" rozeti */
.hero-badge{display:inline-flex; align-items:center; gap:9px; background:#e9f9ef; color:#0E4429; font-weight:700; font-size:13px; letter-spacing:.06em; text-transform:uppercase; padding:8px 16px; border-radius:999px; border:1px solid rgba(14,68,41,.12); margin-bottom:20px}
.hero-badge .dot{width:8px; height:8px; border-radius:50%; background:#16CD6E; box-shadow:0 0 0 4px rgba(22,205,110,.18)}
