:root{
  --green:#3fb618;
  --green-d:#2e9e10;
  --purple:#8b2fd6;
  --red:#e23b3b;
  --dark:#3a3a3a;
  --yellow:#ffe14d;
  --yellow-d:#ffd21f;
  --banner-red:#d4111a;
  --ink:#1d1d1d;
  --muted:#777;
  --line:#e6e6e6;
  --star:#ffb400;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Segoe UI",Roboto,Arial,Helvetica,sans-serif;
  color:var(--ink);
  background:#fff;
  line-height:1.4;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}

/* Merkezi mobil kolon */
.page{max-width:480px;margin:0 auto;background:#fff;overflow:hidden}
.strip{line-height:0;font-size:0;background:#fff}

/* ---- Yeni gorsel tabanli duzen ---- */
.strip{line-height:0;font-size:0;background:#fff}
.strip img,.strip .slot-img{width:100%;display:block;margin:0}
.strip.logobar{background:#fff;text-align:center;line-height:0}
.strip.logobar img,.strip.logobar .slot-img{width:100%;height:auto;display:block}
.promo-link{display:block;cursor:pointer}

/* Hero beyaz cerceve */
.hero-frame{background:#fff;padding:12px}
.hero-frame img,.hero-frame .slot-img{width:100%;display:block;border-radius:12px;
  border:1px solid #eee;box-shadow:0 3px 12px rgba(0,0,0,.08)}
.hero-frame .img-slot{border-radius:12px}

/* ---- Header foto (en ust banner) ---- */
.site-head{line-height:0;background:#fff}
.site-head .fphoto .img-slot{min-height:150px;border-radius:0}

/* ---- Ust foto ortak ---- */
.feature-photos{background:#fff}
.fphoto{position:relative;margin:0;line-height:0}
.fphoto img,.fphoto .slot-img{width:100%;display:block;object-fit:cover}
.fphoto .img-slot{border-radius:0;border-left:none;border-right:none;min-height:180px}
.fcap{position:absolute;left:0;right:0;bottom:0;line-height:1.2;
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.78));
  color:#fff;font-weight:800;font-size:19px;text-align:center;
  padding:34px 16px 16px;text-shadow:0 2px 6px rgba(0,0,0,.5)}

/* ---- Ust banner (eski - hala kullanilabilir) ---- */
.top-banner{
  background:#c9a06a url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='6' height='6'><rect width='6' height='6' fill='%23bd9256'/><path d='M0 0h3v3H0zM3 3h3v3H3z' fill='%23b98d4d' opacity='.5'/></svg>");
  padding:14px 16px;position:relative;min-height:120px;display:flex;align-items:center;
}
.top-banner .tb-text{position:relative;z-index:2}
.tb-tag{background:var(--banner-red);color:#fff;font-weight:800;font-size:13px;
  padding:3px 10px;border-radius:4px;display:inline-block;letter-spacing:.5px}
.tb-big{color:#fff;font-weight:900;font-size:40px;line-height:1;margin:6px 0;
  text-shadow:2px 2px 0 rgba(0,0,0,.25)}
.tb-sub{background:var(--banner-red);color:#fff;font-weight:800;font-size:13px;
  padding:3px 10px;border-radius:4px;display:inline-block}
.top-banner .tb-img{position:absolute;right:0;top:0;bottom:0;width:45%;z-index:1}
.top-banner .tb-img img,.top-banner .tb-img .img-slot{height:100%;width:100%;object-fit:cover}

/* ---- Header ---- */
.header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:#fff}
.brand small{display:block;background:var(--yellow-d);color:#333;font-size:8px;font-weight:800;
  padding:1px 6px;border-radius:3px;width:max-content;letter-spacing:.5px;margin-bottom:2px}
.brand b{font-size:22px;font-weight:800}
.brand b .light{font-weight:400}
.header .icons{display:flex;gap:16px;font-size:18px;color:#333}
.header .icons span{cursor:pointer}

/* ---- Hero gorsel ---- */
.hero{background:#000;padding:0 0 4px}
.hero-bar{height:5px;background:linear-gradient(90deg,#e23b3b,#ff6a6a)}
.hero-img{padding:14px}
.hero-img .img-slot,.hero-img img{border-radius:10px;width:100%;object-fit:cover}

/* ---- Rozetler ---- */
.badges{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px}
.badge{display:flex;align-items:center;gap:8px;color:#fff;font-weight:800;font-size:13px;
  border-radius:10px;padding:12px 12px;line-height:1.1}
.badge .b-ico{font-size:16px;opacity:.95}
.badge.green{background:var(--green)}
.badge.purple{background:var(--purple)}
.badge.dark{background:var(--dark)}
.badge.red{background:var(--red)}

/* ---- Puan satiri ---- */
.rating-row{display:flex;align-items:center;gap:10px;padding:4px 16px 10px}
.rating-left .stars{color:var(--star);font-size:16px;letter-spacing:1px}
.rating-left small{color:var(--muted);font-size:11px}
.rating-mid{flex:1;font-size:13px;font-weight:700;line-height:1.15}
.rating-badge{background:#2d2f6b;color:#fff;border-radius:10px;text-align:center;
  padding:8px 10px;min-width:74px}
.rating-badge b{display:block;font-size:16px}
.rating-badge small{font-size:9px;opacity:.85}

/* ---- Siparis butonu satiri ---- */
.cta-row{display:flex;gap:10px;align-items:stretch;padding:6px 16px 18px}
.cta-btn{flex:1;background:linear-gradient(180deg,var(--green),var(--green-d));color:#fff;
  border:none;border-radius:30px;font-weight:900;font-size:24px;padding:16px;cursor:pointer;
  box-shadow:0 4px 0 rgba(0,0,0,.15);letter-spacing:.5px;text-align:center}
.cta-btn:active{transform:translateY(2px);box-shadow:0 2px 0 rgba(0,0,0,.15)}
.cta-free{background:var(--yellow);border-radius:14px;display:flex;align-items:center;
  gap:6px;padding:8px 12px;font-weight:900;color:#333;font-size:13px;line-height:1;max-width:140px}
.cta-free .arrow{font-size:20px}

/* ---- 2.5 kilo bolumu (koyu) ---- */
.mega{background:#1c1c1c url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40'><rect width='40' height='40' fill='%231c1c1c'/></svg>");color:#fff;padding:22px 16px}
.mega h2{font-size:30px;font-weight:900;line-height:1.05;margin:0}
.mega h2 .y{color:var(--yellow)}
.mega .plus{color:#fff;font-weight:800;font-size:17px;margin-top:2px}
.mega .ribbon{background:var(--yellow);color:#222;font-weight:800;font-size:14px;
  padding:6px 12px;border-radius:6px;display:inline-block;margin-top:10px}
.mega-body{display:flex;gap:12px;margin-top:16px;align-items:flex-start}
.mega-left{flex:1}
.mega-left .lead b{font-size:18px}
.mega-left .lead{font-size:13px;color:#ddd;margin-bottom:10px}
.mega-left .badge-img{border-radius:10px;overflow:hidden}
.mega-right{width:48%}
.mega-right .img-slot,.mega-right img{border-radius:10px}
.mega-seal{width:70px;height:70px;border-radius:50%;border:2px solid var(--yellow);
  color:var(--yellow);display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-weight:900;font-size:10px;text-align:center;margin:10px 0}
.mega-seal b{font-size:22px}
.mega-feats{margin-top:14px}
.mega-feats .mf{display:flex;align-items:center;gap:10px;border-bottom:1px solid #444;padding:10px 0;font-weight:700;font-size:13px}
.mega-feats .dot{width:12px;height:12px;border-radius:50%;background:#fff;flex:none}

/* ---- 2.5KG gonderiyoruz kutu ---- */
.pack-box{background:#c62222;border-radius:12px;margin:16px;padding:14px;color:#fff}
.pack-box .pb-title{background:var(--yellow);color:#222;font-weight:800;text-align:center;
  border-radius:8px;padding:8px;font-size:15px;margin-bottom:12px}
.pack-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pack-item{text-align:center}
.pack-item .pi-name{background:#8f1616;border-radius:6px;font-size:10px;font-weight:700;
  padding:3px 2px;margin-bottom:6px}
.pack-item .img-slot,.pack-item img{border-radius:8px;background:#fff}

/* ---- Yesil onay listesi ---- */
.check-list{padding:6px 16px 16px}
.check-item{display:flex;gap:10px;padding:14px 0;border-bottom:1px solid var(--line)}
.check-item .ci-ico{color:var(--green);font-size:18px;flex:none;margin-top:1px}
.check-item p{margin:0;font-size:14px}

/* ---- Yorum vurgu basligi ---- */
.section-title{padding:18px 16px 6px}
.section-title .st-1{color:#4a4a4a;font-weight:600;font-size:20px}
.section-title .st-2{font-weight:800;font-size:22px}

/* ---- Magaza galeri ---- */
.gallery{padding:12px 16px}
.gallery .g-main{border-radius:10px;overflow:hidden;position:relative}
.gallery .g-float{position:absolute;right:10px;bottom:10px;width:45%;border:3px solid #fff;
  border-radius:10px;overflow:hidden;box-shadow:0 3px 10px rgba(0,0,0,.3)}

/* ---- Aracisiz bolumu ---- */
.direct{padding:20px 16px 6px}
.direct .kicker{letter-spacing:3px;font-size:12px;color:#444;font-weight:600}
.direct h3{font-size:30px;margin:6px 0 2px;font-weight:800}
.direct h3 .r{color:var(--red)}

/* ---- Yorum dagilim barlari ---- */
.rev-bars{padding:8px 16px 4px}
.rb{display:flex;align-items:center;gap:10px;margin:6px 0;font-size:13px}
.rb .rb-star{width:56px;color:var(--star);white-space:nowrap}
.rb .rb-track{flex:1;height:12px;background:#eee;border-radius:6px;overflow:hidden}
.rb .rb-fill{height:100%;background:var(--yellow-d)}
.rb .rb-num{width:52px;text-align:right;color:#333;font-weight:600}

/* ---- Yorum kartlari ---- */
.reviews{padding:10px 16px}
.rev-card{border:1px solid #eee;border-radius:12px;padding:14px;margin-bottom:14px;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.rev-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.rev-head .rh-stars{color:var(--star)}
.rev-head .rh-badge{display:flex;align-items:center;gap:4px;color:#2e9e10;font-size:11px;font-weight:600}
.rev-card p{font-size:13px;margin:0 0 12px;color:#333}
.rev-card .rev-name{color:#999;font-size:12px;border-top:1px solid #f0f0f0;padding-top:8px}

/* ---- Yeni paket kartlari (cerceveli) ---- */
.pick{padding:14px 12px 4px}
.pick .pick-label{font-size:12px;color:#666;margin-bottom:8px;font-weight:600}
.pkg-card{display:block;padding:10px;margin:0 0 16px;background:#fdfbe0;
  border:2px solid #efe3a3;border-radius:16px;cursor:pointer;transition:.15s;line-height:0;position:relative}
.pkg-card.selected{background:#e6f6df;border-color:#5cbf4f;box-shadow:0 0 0 3px rgba(92,191,79,.35)}
.pkg-card img,.pkg-card .slot-img{width:100%;display:block;border-radius:10px}
.pkg-card .img-slot{border-radius:10px}
.pkg-badge{position:absolute;right:12px;bottom:12px;background:#5cbf4f;color:#fff;padding:6px 14px;
  border-radius:20px;font-size:12px;font-weight:700;display:none;letter-spacing:.5px;z-index:10}
.pkg-card.selected .pkg-badge{display:block;animation:slideIn .3s ease}

/* ---- Esnek galeri ---- */
.gallery-item{display:block;line-height:0;background:#fff}
.gallery-item img{width:100%;height:auto;display:block}
.searchable-select{position:relative;width:100%}
.searchable-select .search-input{width:100%;border:1px solid #ccc;border-radius:6px;padding:12px;
  font-size:16px;font-family:inherit;background:#fff}
.searchable-select .search-input:disabled{background:#f2f2f2;color:#999}
.dropdown-list{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #ccc;
  border-top:none;border-radius:0 0 6px 6px;max-height:200px;overflow-y:auto;display:none;
  z-index:1000;box-shadow:0 4px 6px rgba(0,0,0,.1)}
.dropdown-list.show{display:block}
.dropdown-item{padding:10px 12px;cursor:pointer;border-bottom:1px solid #f0f0f0;
  font-size:15px;color:#333}
.dropdown-item:hover{background:#f9f9f9;color:#111}
.dropdown-item.selected{background:#e6f6df;color:#2f6d22;font-weight:600}
.pick{padding:10px 16px 4px}
.pick .pick-label{font-size:11px;color:#666;margin-bottom:6px}
.pick-card{border:2px solid #e6e6cf;border-radius:12px;padding:16px;margin-bottom:16px;
  display:flex;gap:12px;align-items:center;position:relative;background:#fbfbe8;transition:.15s}
.pick-card.alt{background:#fff;border-color:#eee}
.pick-card .pc-body{flex:1}
.pick-card h4{margin:0 0 8px;font-size:19px;font-weight:800}
.pick-card .hq{background:#4a2f00;color:#ffd54a;font-weight:800;font-size:12px;
  padding:4px 12px;border-radius:20px;display:inline-block;margin-bottom:8px}
.pick-card .pc-feat{font-size:12px;display:flex;gap:6px;margin:4px 0;color:#333}
.pick-card .pc-feat .c{color:var(--green)}
.pick-card .pc-price{font-size:26px;font-weight:900;margin-top:8px}
.pick-card .pc-price small{display:block;font-size:11px;color:#666;font-weight:600}
.pick-card .pc-img{width:34%}
.pick-card .pc-img .img-slot,.pick-card .pc-img img{border-radius:8px}
.pick-sel{position:absolute;right:14px;bottom:14px}
.pick-btn{border:none;border-radius:8px;font-weight:800;font-size:14px;padding:10px 16px;cursor:pointer;color:#fff}
.pick-btn.on{background:var(--green)}
.pick-btn.off{background:var(--red)}
.pick-card .tick{position:absolute;right:110px;bottom:20px;font-size:26px;color:#111}

/* ---- Odeme + form ---- */
.order{padding:12px 16px 20px;border:2px solid #d7ead0;border-radius:10px;margin:10px 16px;background:#fbfffa}
.order h5{margin:0 0 8px;font-size:13px;font-weight:700}
.pay-opt{border:1px solid #ddd;border-radius:8px;padding:14px;margin-bottom:10px;background:#f6f6f6;
  display:flex;gap:10px;align-items:flex-start;cursor:pointer;font-size:13px}
.pay-opt input{margin-top:3px}
.pay-opt b{font-weight:800}
.form-group{margin-bottom:12px}
.form-group label{display:block;font-size:12px;font-weight:700;margin-bottom:4px}
.form-group input,.form-group select,.form-group textarea{
  width:100%;border:1px solid #ccc;border-radius:6px;padding:12px;font-size:16px;font-family:inherit;background:#fff}
.form-group select{appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='3'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:right 12px center;padding-right:36px}
.form-group select:disabled{background-color:#f2f2f2;color:#999}
.form-group textarea{min-height:80px;resize:vertical}
.submit-btn{width:100%;background:#4a8f2f;color:#fff;border:none;border-radius:8px;
  padding:17px;font-size:18px;font-weight:700;letter-spacing:.5px;cursor:pointer;
  -webkit-tap-highlight-color:rgba(0,0,0,.1)}
.submit-btn:active{background:#3f7d28}
.submit-btn:hover{background:#3f7d28}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---- Footer gorseli ---- */
.kutu-strip{background:#fff;padding:8px 0 4px;text-align:center}
.kutu-strip img,.kutu-strip .slot-img{width:auto;max-width:78%;max-height:360px;
  display:inline-block;border-radius:10px;box-shadow:0 3px 12px rgba(0,0,0,.12)}
.foot{padding:0 0 20px;background:#fff;border-top:6px solid #111}
.foot .strip img,.foot .strip .slot-img{width:100%;display:block}
.foot-note{text-align:center;color:#aaa;font-size:11px;margin-top:14px;padding:0 20px}

/* ---- Sabit yan butonlar (yukari cik + whatsapp) ---- */
.fabs{position:fixed;right:16px;bottom:18px;z-index:9999;display:flex;flex-direction:column;gap:12px;align-items:center}
.page .fabs{}
.fab{width:52px;height:52px;border-radius:50%;border:none;cursor:pointer;display:flex;
  align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.28);
  font-size:26px;color:#fff;text-decoration:none;transition:transform .12s}
.fab:active{transform:scale(.94)}
.fab.wa{background:#25d366}
.fab.top{background:#2f2f2f;font-weight:700;line-height:1}
@media(min-width:520px){ .fabs{right:calc(50% - 240px + 16px)} }
.foot-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px 20px;margin-bottom:20px}
.foot-item h6{margin:0 0 4px;font-size:16px;font-weight:800;line-height:1.1;color:#222}
.foot-item h6 .lt{font-weight:400;color:#666}
.foot-item p{margin:0;font-size:12px;color:#666;line-height:1.4}
.foot-ssl{display:flex;align-items:center;justify-content:center;gap:10px;color:#888;
  font-weight:800;font-size:12px;border:1px solid #ddd;border-radius:8px;padding:10px;width:max-content;margin:0 auto}
.foot-note{text-align:center;color:#aaa;font-size:11px;margin-top:18px}

/* ---- Bos gorsel yer tutucu ---- */
.img-slot{width:100%;background:repeating-linear-gradient(45deg,#f3f3f3,#f3f3f3 10px,#ececec 10px,#ececec 20px);
  border:2px dashed #cfcfcf;border-radius:8px;display:flex;flex-direction:column;align-items:center;
  justify-content:center;color:#9a9a9a;gap:6px;text-align:center;padding:10px;min-height:80px}
.img-slot-ico{font-size:26px;opacity:.5}
.img-slot-text{font-size:11px;font-weight:600}
.slot-img{width:100%;object-fit:cover}

/* ---- Basari mesaji ---- */
.flash-ok{background:#e7f7e7;border:1px solid #b6e3b6;color:#256b25;padding:16px;
  border-radius:10px;margin:16px;font-size:14px;text-align:center;font-weight:600}

@media(max-width:380px){
  .tb-big{font-size:33px}
  .mega h2{font-size:25px}
  .cta-btn{font-size:20px}
}

@keyframes slideIn{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}
