/* =========================
   ROOT & BASE VARIABLES
   ========================= */
   
   .section-title{
       text-align:left !important;
   }
   
   .section-sub{
       text-align:left !important;
   }
:root{
  /* Senin renklerin */
  --primary: #122e5c;
  --dark:#0f0f0f;
  --text:#1a1a1a;
  --muted: #535353;
  --bg:#ffffff;
  --shade: #f5f5f5;
  --ok:#0a7f2e;

  /* Ek yardımcı değişkenler (seninkileri etkilemez) */
  --line:#e6e7eb;
  --radius:14px;
  --radius-sm:10px;
  --shadow:0 10px 30px rgba(0,0,0,.08);
  --shadow-sm:0 6px 18px rgba(0,0,0,.06);
}

*{box-sizing:border-box;}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}

/* =========================
   LAYOUT
   ========================= */
.container{width:min(1200px,92%);margin:0 auto}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap: 12px;}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media (max-width:1000px){.grid-2{grid-template-columns:1fr}}
@media (max-width:900px){.grid-4{grid-template-columns: 1fr;}}

/* =========================
   BUTTONS & BADGES
   ========================= */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:14px 18px;border-radius:8px;border:1px solid transparent;
  font-weight:600;cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
  will-change:transform, box-shadow;
}
.btn-primary{background: var(--primary);color:#fff;box-shadow:0 6px 16px rgba(2,121,126,.18)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(2,121,126,.22)}
.btn-light{background:#fff;border-color:#e5e7eb}
.btn-light:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.btn:focus,.close:focus,input:focus{outline:2px solid #8ab4ff;outline-offset:2px}

.badge{display:inline-block;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700}
.badge-save{background:#e9ffed;color: var(--primary);border: 1px solid #bcdcc2;}

/* =========================
   TOPBAR
   ========================= */
.topbar{background:#fff;border-bottom:1px solid #eee;padding:8px 0;}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.brand{display:flex;gap:10px;align-items:center}
.brand img{max-width:120px}
.head-actions{display:flex;gap:10px;align-items:center}

/* Header campaign inline */
.header-campaign{
  display:flex;align-items:center;gap:10px;
  background:#fff8f2;border:1px solid #ffe2cc;border-radius:8px;
  padding:8px 14px;white-space:nowrap;overflow-x:auto;scrollbar-width:none
}
.header-campaign::-webkit-scrollbar{display:none}
.hc-title{color:#b00000;font-weight:700}
.hc-sub{color:#334155}
.hc-divider{color:#999}
.hc-timer{font-weight:700;font-variant-numeric:tabular-nums}
.hc-spots{color:#111;font-weight:600}

/* =========================
   HERO
   ========================= */
.hero{position:relative;background:#ffffff;}
.hero-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center;padding:28px 0}
@media (max-width:1000px){.hero-inner{grid-template-columns:1fr}}
.hero h1{font-size:clamp(26px,4.2vw,44px);line-height:1.1;margin:18px 0}
.hero p{color:var(--muted);font-size:clamp(14px,2.6vw,18px);margin:18px 0}
.cta-row{display:flex;margin-top:2rem;gap:10px;flex-wrap: wrap;flex-direction: column;}
.trust{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin:12px 0 18px}
.trust img{height: 80px;margin-right:1rem}

.hero-card{background:#fff;border:1px solid #eee;border-radius:14px;padding:10px;width:100%;margin-left:auto;margin-right:auto;box-shadow:var(--shadow-sm)}
.hero-slider{display:grid;grid-auto-flow:column;grid-auto-columns:100%;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;border-radius:10px}
.hero-slider img{width:100%;height: 317px;object-fit:cover;object-position:50% 5%;scroll-snap-align:center;border-radius:10px}
.slider-dots{display:flex;gap:6px;justify-content:center;margin-top:8px}
.slider-dots i{width:8px;height:8px;border-radius:50%;background:#ddd}
.slider-dots i.active{background:var(--primary)}

/* =========================
   SECTIONS, CARDS, LISTS
   ========================= */
section{padding:60px 0;}
.section-muted{background:var(--shade)}
.section-title{font-size:clamp(22px,3vw,30px);margin:0 0 6px}
.section-sub{color:var(--muted);margin:14px 0 38px;max-width:600px;}

.card{
  border:1px solid #eee;border-radius:12px;padding:32px;background:#fff;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#dcdde2}
.cards .card .icon{width:28px;height:28px;opacity:.9;margin-bottom:8px}

.list{display:grid;gap:10px;margin:0;padding:0}
.list li{list-style:none;padding-left:28px;position:relative}
.list li:before{content:"";position:absolute;left:0;top:2px;width:16px;height:16px;border-radius:50%;background:var(--ok)}

.doc{width:100%;height:260px;object-fit:cover;border-radius:10px;margin-bottom:2rem;}
.doc-price {object-fit: contain;background:black;width:100%;height:260px;border-radius:10px;margin-bottom: 2rem;}

/* =========================
   BEFORE & AFTER
   ========================= */
.bna{display:grid;grid-template-columns: repeat(4,1fr);gap:10px}
@media (max-width:900px){.bna{grid-template-columns:repeat(2,1fr)}}
a.bna-item img{border-radius:12px;border:3px solid #ffffff;transition:transform .18s ease, box-shadow .18s ease}
a.bna-item:hover img{transform:scale(1.02);box-shadow:var(--shadow)}

/* =========================
   TABLE
   ========================= */
table{width:100%;border-collapse:separate;border-spacing:0 10px}
th,td{text-align:left;padding:14px;background:#fff;border:1px solid #eee}
th{background:#fafafa;font-weight:700}

/* =========================
   MODAL & FORM
   ========================= */
.modal{position:fixed;inset:0;background:rgba(15,15,15,.55);display:none;align-items:center;justify-content:center;padding:20px;z-index:50}
.modal.open{display:flex}
.modal-card{width:min(560px,100%);background:#fff;border-radius:14px;border:1px solid #e5e7eb;padding:20px;box-shadow:var(--shadow)}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.close{background:none;border:0;font-size:22px;cursor:pointer}
.form{display:grid;gap:12px;margin-top:8px}
.field{display:flex;flex-direction:column;gap:6px}
label{font-weight:600}
input[type="text"],input[type="tel"]{height:48px;border:1px solid #e5e7eb;border-radius:10px;padding:0 14px;font-size:16px;transition:border-color .18s ease, box-shadow .18s ease}
input[type="text"]:focus,input[type="tel"]:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(2,121,126,.12)}
.legal{font-size:12px;color:var(--muted);margin-top:2rem !important;}
.note{font-size:12px;color:#0b5;display:none}
.note.show{display:block}
.m0{margin:0}
.m6{margin:6px 0 10px}

/* =========================
   STICKY CTA (MOBILE)
   ========================= */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;display:none;gap:10px;background:#fff;border-top:1px solid #eee;padding:10px;z-index:40}
.sticky-cta .btn{flex:1}
@media (max-width:900px){.sticky-cta{display:flex}}

/* =========================
   WHATSAPP FLOAT
   ========================= */
.wa-float{position:fixed;right:14px;bottom:82px;z-index:41}
@media (max-width:900px){.wa-float{display:none}} /* mobilde gizle */

/* =========================
   FOOTER
   ========================= */
.footer{padding:22px 0;border-top:1px solid #eee;display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap}

/* =========================
   LIGHTBOX
   ========================= */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.9);display:none;align-items:center;justify-content:center;z-index:60;padding:20px}
.lightbox.open{display:flex}
.lightbox-content{max-width:min(920px,92vw);max-height:86vh;margin:0;text-align:center;color:#fff}
.lightbox-content img{max-width:100%;max-height:80vh;display:block;margin:0 auto;border-radius:8px;box-shadow:var(--shadow)}
.lightbox-content figcaption{margin-top:8px;font-size:14px;opacity:.9}
.lightbox-close{position:absolute;top:16px;right:16px;background:#fff;border:1px solid #e5e7eb;border-radius:999px;width:40px;height:40px;font-size:22px;cursor:pointer;box-shadow:var(--shadow-sm)}
.lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);background:#fff;border:1px solid #e5e7eb;border-radius:999px;width:42px;height:42px;font-size:20px;cursor:pointer;box-shadow:var(--shadow-sm)}
.lightbox-nav.prev{left:16px}
.lightbox-nav.next{right:16px}
@media (max-width:900px){.lightbox-nav{display:none}}

/* =========================
   COUNTDOWN
   ========================= */
#countdown{ background:#fff; }
#countdown .countdown-wrap{
}
#countdown .countdown-item{
  text-align:center;
  min-width: 23.3%;
  padding:10px 8px;
  border:1px solid #e5e7eb;
  border-radius:10px;
  background: #f5f5f5;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
}
#countdown .count-num{
  font-size:34px; font-weight:800; line-height:1; letter-spacing:1px;
  display:block;
}
#countdown .count-label{ font-size:12px; color:#6b7280; text-transform:uppercase; }
#countdown .count-sep{ font-size:26px; font-weight:700; color:#9ca3af; }

#countdown .spots{ margin-top:8px; }
#countdown .spots-text{/* display:flex; *//* gap:8px; *//* align-items:baseline; *//* justify-content:center; *//* margin: 25px 0px; */}
#countdown .spots-bar{
}
#countdown .spots-fill{
  height:100%;
  background: var(--primary);
  width:88%; /* 88% dolu, 12 spot kaldı görseli */
}

/* =========================
   PERKS MEDIA
   ========================= */
#perks .card-media{
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 16px;
  align-items: stretch;
}
#perks .card-media .media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8px;
  object-position: 22% 50%;
}
#perks .card-media .content{
  display: grid;
  align-content: start;
  gap: 10px;
}
@media (max-width: 900px){
  #perks .card-media{ grid-template-columns: 1fr; }
}
figure.media {padding:0 !important;margin:0;}

/* =========================
   EDGE ACTIONS (RIGHT STRIP)
   ========================= */
.edge-actions{
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: grid;
  gap: 10px;
  z-index: 70;
  pointer-events: none;
}
.edge-actions .edge-btn{
  pointer-events: auto;
  position: relative;
  width: 48px;
  height: 220px;
  border: 0;
  border-radius: 10px 0 0 10px;
  color: #fff;
  background: #b00000;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
  transform: rotate(0deg);
  transform-origin: right center;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
}
.edge-actions .edge-btn span{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  letter-spacing: .2px;
  white-space: nowrap;
  font-size: 14px;
  rotate: 90deg;
}
.edge-actions .edge-primary{background:#b00000;}
.edge-actions .edge-whatsapp{background:#25D366;}
.edge-actions .edge-dark{background: var(--primary);}
.edge-actions .edge-dark #edge-cd{font-weight:800;font-style:normal}
.edge-actions .edge-dark #edge-spots{font-style:normal;opacity:.85;font-weight:600}
.edge-actions .edge-btn:hover{filter:brightness(1.03)}

@media (max-width: 900px){
  .edge-actions{ display:none; }
  /* Mobil üst şerit varyasyonu (istersen aç) */
  .edge-actions{
    position: fixed; top:0; left:0; right:0; transform:none;
    display:flex; gap:8px; padding:6px;
    background:rgba(255,255,255,.7); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
    z-index:90; pointer-events:auto;
  }
  .edge-actions .edge-btn{
    transform:none; width:30%; height:33px; border-radius:10px; flex:1 1 0; padding:0 10px;
    box-shadow:0 4px 12px rgba(0,0,0,.12); rotate:0deg;
  }
  .edge-actions .edge-btn span{font-size:11px;font-weight:700;letter-spacing:.2px;white-space:nowrap;rotate:0deg}
  .edge-actions .edge-dark #edge-spots{opacity:.9;margin-left:6px}
  button.edge-btn.edge-primary.js-open-form{display:none}
}

/* =========================
   TYPO & SMALL TWEAKS
   ========================= */
h3{margin-top:0}
h2{margin:12px 0}
img.button-svg{max-width:28px;filter:invert(1);rotate:28deg;margin-right:12px}
button.btn.btn-primary.js-open-form{min-width:182px}
input#phone{width:100%}

/* =========================
   REVEAL ANIMATIONS
   (IntersectionObserver uyumlu)
   ========================= */
:root { --reveal-distance: 22px; }
.reveal{opacity: 1;transform:translateY(var(--reveal-distance));transition:transform .8s ease, opacity .8s ease;transition-delay:var(--reveal-delay,0ms);will-change:transform,opacity}
.reveal.is-visible{opacity:1;transform:none}
.reveal-up{transform:translateY(var(--reveal-distance))}
.reveal-right{transform:translateX(24px)}
.reveal-zoom{transform:scale(.96)}
@media (prefers-reduced-motion: reduce){
  .reveal,.reveal.is-visible{opacity:1;transform:none;transition:none}
}

/* =========================
   PRICE BADGE (yeşil etiket)
   ========================= */
.price{
  display:inline-flex; align-items:center; width:100%;
  gap:8px; background:#f9f9f9; border:1px solid #e0e0e0;
  border-radius:6px; padding:6px 12px; margin:0 0 18px 0;
  font-weight:600; font-family:"Inter", sans-serif;
}
.price-old{color:#999;font-size:.95rem;text-decoration:line-through}
.price-new{
  background:#24d366; color:#fff; font-weight:700; padding:4px 10px;
  border-radius:4px; font-size:1rem; line-height:1.2; box-shadow:0 2px 4px rgba(0,0,0,0.08)
}
.card:hover .price-new{transform:scale(1.05);transition:all .25s ease;background:#19ad51}
span.price-old{color:#b00000}

/* =========================
   MOBILE TWEAKS
   ========================= */
@media (max-width: 768px){
  .topbar-inner{flex-direction:column;align-items:center;gap:10px;text-align:center}
  .topbar{display:none}
  figure.hero-card.reveal.reveal-zoom.is-visible{margin-top: 1rem;}
  figure.hero-card{order:-1}
  .topbar{z-index:99999;position:relative}
  .header-campaign{flex-wrap:wrap;justify-content:center;white-space:normal;display:none}
  .container.footer{}
}

/* =========================
   MICRO INTERACTIONS
   ========================= */
.card h3{display:flex;align-items:center;gap:8px}
.card h3::after{content:"";flex:1;height:1px;background:linear-gradient(90deg, rgba(0,0,0,0.10), rgba(0,0,0,0));margin-left:6px}
.card:hover h3::after{background:linear-gradient(90deg, rgba(2,121,126,.35), rgba(0,0,0,0))}

/* ========== Root & Reset ========== */
:root{
  --brand: #122e5c;
  --brand-ink: #122e5c;
  --ink:#1b1f23;
  --muted:#6b7280;
  --bg:#ffffff;
  --bg-alt: #f5f5f5;
  --card:#ffffff;
  --line:#e6e7eb;
  --radius:14px;
  --radius-sm:10px;
  --shadow:0 10px 30px rgba(0,0,0,.08);
  --shadow-sm:0 6px 18px rgba(0,0,0,.06);
  --container:1160px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:400 16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img,video{}
a{text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:var(--container);margin:0 auto;padding: 0 12px;}

/* ========== Topbar ========== */
.topbar{position:sticky; top:0; z-index:50; backdrop-filter:saturate(1.2) blur(10px); background:rgba(255,255,255,.82); border-bottom:1px solid var(--line)}
.topbar .topbar-inner{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:10px 0}
.topbar .brand img{height:34px}
.header-campaign{display:flex; align-items:center; gap:10px; font-size:.925rem; color:var(--muted)}
.header-campaign b{color:var(--ink)}
.hc-divider{opacity:.5}
.head-actions .btn{white-space:nowrap}

/* ========== Badges & Buttons ========== */
.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;font-weight:600;font-size: .7rem;border-radius:999px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.badge-save{}

.btn{display:inline-flex; align-items:center; gap:8px; cursor:pointer; border:0; border-radius:10px; padding:12px 16px; font-weight:700; transition:transform .18s ease, box-shadow .18s ease, background .18s ease}
.btn img.button-svg{height:18px}
.btn-primary{color:#fff;box-shadow: 0 6px 16px rgb(18 46 92 / 27%);}
.btn-primary:hover{transform:translateY(-1px);box-shadow: 0 10px 22px rgb(2 121 126 / 29%);background: #1a468e;}
.btn-light{background: #f5f5f5;color: black;border: 1px solid #5f5f5f;}
.btn-light:hover{transform:translateY(-1px); box-shadow:var(--shadow-sm)}

/* ========== Hero ========== */
.hero{
  padding:48px 0 22px;
  background: radial-gradient(1000px 600px at 80% -5%, rgb(18 46 92 / 29%), transparent 60%), linear-gradient(#fff, #fff);
}
.hero-inner{display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center}
.hero h1{margin:10px 0 6px; font-size:44px; line-height:1.1; letter-spacing:-.02em}
.hero h2{margin:0 0 12px; color:#2b2f36; font-weight:600}
.hero p{color:#4a4f57}
.trust{display:flex; gap:12px; align-items:center; margin:14px 0}
.cta-row{}

/* — hero card & slider (scroll-snap ile uyumlu) — */
.hero-card{margin:0;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);}

.hero-slider::-webkit-scrollbar{display:none}
.slider-dots{display:flex; gap:6px; justify-content:center; margin-top:8px}
.slider-dots i{width:8px; height:8px; border-radius:50%; background:#d4d4d8}
.slider-dots i.active{}

/* ========== Sections ========== */
.section-muted{background:var(--bg-alt)}
section{padding:54px 0}
.section-title{font-size:28px; margin:0 0 8px}
.section-sub{color:var(--muted); margin:0 0 22px}

/* ========== Cards & Grids ========== */
.cards, .grid-2, .grid-4{display:grid; gap:18px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:20px;
  box-shadow:var(--shadow-sm);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.card:hover{transform:translateY(-4px); box-shadow:var(--shadow); border-color:#dcdde2}
.card .icon{height:34px; width:auto; opacity:.9}
ul.list{margin:10px 0 0; padding:0 0 0 18px}
img.doc, img.doc-price{border-radius:12px; margin-bottom:12px}
#packages .card .doc-price{aspect-ratio:16/9; object-fit:cover} /* paket görsellerine düzgün kırpma */

/* ========== PRICE (badge) ========== */
.price{
  display:inline-flex;
  align-items:center;
  gap:10px;
  background:#fff;
  border: 1px dashed rgb(2 121 126);
  border-radius:999px;
  padding:8px 12px;
  margin:10px 0 14px;
  box-shadow: 0 4px 14px rgb(2 121 126 / 24%);
}
.price-old{color:#9b9faa; font-size:.95rem; text-decoration:line-through}
.price-new{color:#fff;font-weight:800;padding:6px 12px;border-radius:999px;letter-spacing:.2px}
.card:hover .price-new{transform:translateY(-1px); transition:transform .18s ease}

/* ========== Before & After grid ========== */
.bna{display:grid; grid-template-columns:repeat(4,1fr); gap:12px}
.bna .bna-item img{border-radius:12px; box-shadow:var(--shadow-sm); transition:transform .18s ease, box-shadow .18s ease}
.bna .bna-item:hover img{transform:scale(1.02); box-shadow:var(--shadow)}

/* ========== Lightbox ========== */
.lightbox{position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,.6); backdrop-filter:blur(4px); z-index:60; padding:20px}
.lightbox[aria-hidden="false"]{display:flex}
.lightbox-content{margin:0; max-width:min(90vw,1000px)}
.lightbox-content img{width:100%; border-radius:12px; box-shadow:var(--shadow)}
.lightbox-close,.lightbox-nav{position:absolute; top:18px; background:#fff; border:0; width:40px; height:40px; border-radius:999px; box-shadow:var(--shadow); cursor:pointer}
.lightbox-close{right:18px}
.lightbox-nav.prev{left:18px; top:50%; transform:translateY(-50%)}
.lightbox-nav.next{right:18px; top:50%; transform:translateY(-50%)}

/* ========== Countdown ========== */
.countdown-wrap{display:flex; align-items:center; gap:10px; justify-content:center; padding:6px 10px; border:1px dashed var(--line); border-radius:12px; background:#fff}
.countdown-item{display:grid; place-items:center; padding:6px 10px; min-width:72px; border-radius:10px; background:linear-gradient(#fff,#f9fafb); border:1px solid var(--line)}
.count-num{font-size:20px; font-weight:800}
.count-label{font-size:.8rem; color:var(--muted)}
.count-sep{opacity:.4}
.spots{display:flex; align-items:center; justify-content:space-between; gap:12px; margin:14px 0}
.spots-text{display:grid;}
.spots-bar{flex:1;height:8px;background: #b0000042;border-radius:999px;width: 100%;overflow:hidden;}
.spots-fill{height:100%; background:linear-gradient(90deg, var(--brand), #ff6a6a)}

/* ========== Payments cards ========== */
#payments .card h3{margin:6px 0 8px}
#payments .list li{margin:6px 0}

/* ========== Table ========== */
table{width:100%; border-collapse:separate; border-spacing:0; overflow:hidden; border-radius:12px}
thead th{background: var(--primary);color:#fff;text-align:left;padding:12px}
tbody td{padding:12px; border-bottom:1px solid var(--line); background:#fff}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover td{background:#fafafa}

/* ========== Edge Actions ========== */
.edge-actions{right:14px;z-index: 90;}
.edge-btn{transform-origin:right center; transform:rotate(-90deg); background:#fff; border:1px solid var(--line); border-radius:10px; padding:8px 12px; box-shadow:var(--shadow-sm); cursor:pointer}
.edge-primary{background:var(--brand); color:#fff; border-color:transparent}
.edge-dark{background:#0f172a; color:#fff; border-color:#0f172a}
.edge-whatsapp{background:#22c55e; color:#fff; border-color:#22c55e}
.edge-btn:hover{filter:brightness(.96)}

/* ========== Sticky CTA (mobile) ========== */
.sticky-cta{
  position:sticky; bottom:0; z-index:45; padding:10px 14px; display:none;
  background:rgba(255,255,255,.94); backdrop-filter:blur(8px); border-top:1px solid var(--line)
}
@media (max-width: 860px){ .sticky-cta{display:flex; gap:10px; justify-content:space-between} }

/* ========== Modal ========== */
.modal{position:fixed;inset: 0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.5);z-index:70;padding:20px}
.modal-card{
  width:min(620px,94vw); background:#fff; border-radius:16px; border:1px solid var(--line);
  box-shadow:var(--shadow); padding:18px
}
.modal-head{display:flex; align-items:center; justify-content:space-between; gap:10px}
.modal .m6{margin:8px 0 12px; color:var(--muted)}
.form .field{display:grid; gap:6px; margin:10px 0}
.form input{height:46px; border:1px solid var(--line); border-radius:10px; padding:0 12px; outline:none}
.form input:focus{border-color:var(--brand); box-shadow:0 0 0 3px rgba(176,0,0,.15)}
.note{display:none; font-size:.9rem; color:var(--muted); margin-top:8px}

/* ========== Footer ========== */
footer{padding: 1.2rem;border-top:1px solid var(--line);background:#fff}
footer nav{display:flex; gap:14px}
footer a{color:#4b5563}
footer a:hover{color:var(--brand)}

/* ========== Accessibility focus ========== */
:focus-visible{outline:3px solid rgba(176,0,0,.35); outline-offset:2px}

/* ========== Section specific tweaks ========== */
#perks .card-media{}
#perks .media img{box-shadow:var(--shadow-sm)}

/* ========== Utilities ========== */
.m0{margin:0}
.m6{margin:6px 0}
[aria-live="polite"]{contain:layout paint}

/* ========== Reveal animations (compatible with existing JS) ========== */
.reveal{}
.reveal.is-visible{}
.reveal-right{transform:translateX(24px)}
.reveal-zoom{transform:scale(.96)}
@media (prefers-reduced-motion: reduce){
  .reveal,.reveal.is-visible{opacity:1; transform:none; transition:none}
}

/* ========== Responsive ========== */
@media (max-width: 1100px){
  .hero-inner{grid-template-columns:1fr; gap:20px}
  .hero h1{font-size:38px}
  .grid-4{grid-template-columns: repeat(1,1fr);}
  #perks .card-media{grid-template-columns:1fr}
}

@media (min-width: 1100px){
  .cta-row {flex-direction: row;}
  #countdown .spots-text {
    display: flex;
    gap: 8px;
    align-items: baseline;
    justify-content: center;
    margin: 25px 0px;
  }
  .hero-slider img { height: 498px; }
}

@media (max-width: 720px){
  section{padding:40px 0}
  .grid-2{grid-template-columns:1fr}
  .bna{grid-template-columns:repeat(2,1fr)}
  .hero h1{font-size: 36px;max-width: 80%;margin-top: 1rem;margin-bottom: 1rem;}
  .edge-actions{}
  .hero-card{padding:8px}
  .hero-slider img{}
  .countdown-item.reveal.reveal-up.is-visible { min-width: 19% !important; }
  #countdown .count-num { font-size: 26px; }
  #countdown .count-label { font-size: 8px; margin-top: 4px; }
  .spots.reveal.reveal-up.is-visible { margin-top: 16px !important; margin-bottom: 16px !important; }
}

/* ========== Small cosmetic micro-interactions ========== */
.card h3{display:flex; align-items:center; gap:8px}
.card h3::after{content:""; flex:1; height:1px; background:linear-gradient(90deg, rgba(0,0,0,0.10), rgba(0,0,0,0)); margin-left:6px}
.card:hover h3::after{background: linear-gradient(90deg, rgb(2 121 126 / 46%), rgba(0, 0, 0, 0));}

small.left { text-align: left; }
small.right { text-align: right; float: right; }

div#lightbox {
    z-index: 99999;
}

div#leadModal {
    z-index: 9999;
}

.stories-container {
      max-width: 1200px;
      margin: 0 auto;
    }

    .stories-strip {
      position: relative;
      overflow-x: auto;
      overflow-y: hidden;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: thin;
      scrollbar-color: #ccc transparent;
    }

    .stories-strip::-webkit-scrollbar {
      height: 6px;
    }

    .stories-strip::-webkit-scrollbar-track {
      background: transparent;
    }

    .stories-strip::-webkit-scrollbar-thumb {
      background: #ccc;
      border-radius: 3px;
    }

    .stories-list {
      display: flex;
      gap: 12px;
      padding: 10px 0;
      list-style: none;
    }
.stories-strip {
    padding: 0;
}
    .story-card {
      position: relative;
      width: calc((100% - 36px) / 3.5);
      aspect-ratio: 9 / 16;
      flex-shrink: 0;
      border-radius: 12px;
      overflow: hidden;
      cursor: pointer;
      transition: transform 0.2s;
    }

    .story-card:hover {
    }

    .story-card:focus {
      outline: 3px solid #667eea;
      outline-offset: 2px;
    }

    .story-thumbnail {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .story-overlay {
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.3);
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      transition: opacity 0.2s;
    }

    .story-card:hover .story-overlay {
      opacity: 1;
    }

    .play-icon {
      width: 48px;
      height: 48px;
      background: rgba(255, 255, 255, 0.9);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .play-icon::after {
      content: '';
      width: 0;
      height: 0;
      border-left: 16px solid #333;
      border-top: 10px solid transparent;
      border-bottom: 10px solid transparent;
      margin-left: 4px;
    }

    .modal {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.95);
      z-index: 9999;
      align-items: center;
      justify-content: center;
    }

    .modal.active {
      display: flex;
    }

    .modal-content {
      position: relative;
      width: 100%;
      height: 100%;
      max-width: 500px;
      max-height: 100vh;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }

    .progress-bar {
      position: absolute;
      top: 20px;
      left: 20px;
      right: 20px;
      height: 3px;
      background: rgba(255, 255, 255, 0.3);
      border-radius: 2px;
      overflow: hidden;
      z-index: 10;
    }

    .progress-fill {
      height: 100%;
      background: #fff;
      width: 0%;
      transition: width 0.1s linear;
    }

    .modal-video {
      width: 100%;
      height: 100%;
      object-fit: contain;
      background: #000;
    }

    .modal-controls {
      position: absolute;
      bottom: 40px;
      left: 50%;
      transform: translateX(-50%);
      display: flex;
      gap: 12px;
      z-index: 10;
    }

    .control-btn {
      width: 48px;
      height: 48px;
      background: rgba(255, 255, 255, 0.2);
      backdrop-filter: blur(10px);
      border: 1px solid rgba(255, 255, 255, 0.3);
      border-radius: 50%;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.2s;
      color: #fff;
      font-size: 18px;
    }

    .control-btn:hover {
      background: rgba(255, 255, 255, 0.3);
      transform: scale(1.1);
    }

    .control-btn:focus {
      outline: 2px solid #fff;
      outline-offset: 2px;
    }

    .close-btn {
      position: absolute;
      top: 20px;
      right: 20px;
      width: 40px;
      height: 40px;
      background: rgba(255, 255, 255, 0.2);
      backdrop-filter: blur(10px);
      border: 1px solid rgba(255, 255, 255, 0.3);
      border-radius: 50%;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
      font-size: 24px;
      z-index: 10;
    }

    .close-btn:hover {
      background: rgba(255, 255, 255, 0.3);
    }

    .nav-area {
      position: absolute;
      top: 0;
      bottom: 0;
      width: 30%;
      cursor: pointer;
      z-index: 5;
    }

    .nav-area.prev {
      left: 0;
    }

    .nav-area.next {
      right: 0;
    }

    .error-message {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background: rgba(255, 59, 48, 0.9);
      color: #fff;
      padding: 16px 24px;
      border-radius: 8px;
      font-size: 14px;
      z-index: 20;
      text-align: center;
    }

    @media (max-width: 768px) {
      .story-card {
        width: calc((100% - 12px) / 1.5);
      }

      p.wd-reviews-text {
    max-width: 85%;
}

      footer {
    text-align: center;
    width: 100%;
}

small.right {
    float: none;
    width: 100%;
    text-align: center;
    display: block;
    position: relative;
}

small.left {
}
      header.hero {
    padding-top: 4rem;
}

footer {
    padding-top: 1.2rem;
    padding-bottom: 1.2rem;
}

      .modal-content {
        max-width: 100%;
      }

      .control-btn {
        width: 44px;
        height: 44px;
      }
    }
    

/* Nav buttons wrapper context */
.stories-container{ position:relative; }

/* Desktop nav buttons */
.stories-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width: 50px;
  height: 50px;
  border-radius:50%;
  border:1px solid #e5e7eb;
  background:#fff;
  box-shadow:0 6px 18px rgba(0,0,0,.12);
  display:grid;
  place-items:center;
  cursor:pointer;
  z-index:3;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.stories-nav span{
  font-size:20px;
  line-height:1;
  font-weight:700;
  color:#111827;
}
.stories-nav:hover{
  transform:translateY(-50%) scale(1.06);
  box-shadow:0 10px 22px rgba(0,0,0,.16);
}
.stories-nav:active{
  transform:translateY(-50%) scale(0.98);
}

/* Konumlar */
.stories-nav.prev{ left:-6px; }
.stories-nav.next{ right:-6px; }

/* Şeridin üstünde tıklanabilir kalsın */
.stories-strip{ position:relative; z-index:1; }

    :root {
        --dp-primary: #004a99;
        --dp-accent: #00a9e0;
        --dp-bg: #ffffff;
        --dp-border: #efefef;
    }

   
b#hc-left {
    color: #009600;
}

/* ====== Reviews component (isolated) ====== */
.wd-reviews { padding: 54px 0; }
.wd-reviews-title { margin: 0 0 8px; font-size: 28px; }
.wd-reviews-sub { margin: 0 0 18px; color: var(--muted); }

/* rail + strip */
.wd-reviews-rail { position: relative; }
.wd-reviews-strip {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: clamp(240px, 28vw, 320px);
  gap: 14px;
  padding: 6px 6px 12px;
  margin: 0;
  list-style: none;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}
.wd-reviews-strip::-webkit-scrollbar { height: 8px; }
.wd-reviews-strip::-webkit-scrollbar-thumb {
  background: #d1d5db; border-radius: 4px;
}
.wd-reviews-strip::-webkit-scrollbar-track { background: transparent; }

/* card */
.wd-reviews-card{
  scroll-snap-align: start;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 2rem;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  display: grid;
  gap: 10px;
}
.wd-reviews-head{ display: grid; grid-template-columns: 44px 1fr; gap: 10px; align-items: center; }
.wd-reviews-avatar{
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-weight: 800;
  letter-spacing: .4px;
  background: linear-gradient(135deg, #122e5c, #f5f5f5);
  color:#fff;
}
.wd-reviews-name{ font-weight: 700; }

/* stars */
.wd-reviews-stars{
  position: relative; height: 18px; width: 112px; /* 5 yıldız x 22px + aralık */
  display: inline-block;
}
.wd-reviews-stars-bg,
.wd-reviews-stars-fill{
  position: absolute; inset: 0;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="110" height="20" viewBox="0 0 110 20" fill="none"><g fill="%23000"><path d="M10 0l2.94 6.01 6.64.97-4.79 4.67 1.13 6.59L10 15.88 4.08 18.24l1.13-6.59L.42 6.98l6.64-.97L10 0Z"/><use href="%23s" x="22"/><use href="%23s" x="44"/><use href="%23s" x="66"/><use href="%23s" x="88"/></g><defs><path id="s" d="M10 0l2.94 6.01 6.64.97-4.79 4.67 1.13 6.59L10 15.88 4.08 18.24l1.13-6.59L.42 6.98l6.64-.97L10 0Z"/></defs></svg>') center/contain no-repeat;
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="110" height="20" viewBox="0 0 110 20" fill="none"><g fill="%23000"><path d="M10 0l2.94 6.01 6.64.97-4.79 4.67 1.13 6.59L10 15.88 4.08 18.24l1.13-6.59L.42 6.98l6.64-.97L10 0Z"/><use href="%23s" x="22"/><use href="%23s" x="44"/><use href="%23s" x="66"/><use href="%23s" x="88"/></g><defs><path id="s" d="M10 0l2.94 6.01 6.64.97-4.79 4.67 1.13 6.59L10 15.88 4.08 18.24l1.13-6.59L.42 6.98l6.64-.97L10 0Z"/></defs></svg>') center/contain no-repeat;
}
.wd-reviews-stars-bg{ background: #e5e7eb; }
.wd-reviews-stars-fill{
  background: #fbbf24; /* amber */
  width: 0%; overflow: hidden;
}
.wd-reviews-score{
  margin-left: 6px; font-weight: 700; font-size: 12px; color:#374151;
  vertical-align: top;
}

/* text */
.wd-reviews-text{margin: 0;font-size: 14px;}

/* nav buttons (desktop) */
.wd-reviews-nav{
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 40px; height: 40px; border-radius: 50%;
  border:1px solid var(--line); background:#fff; color:#111827;
  display:grid; place-items:center; cursor:pointer; box-shadow:0 6px 18px rgba(0,0,0,.12);
  z-index: 2;
}
.wd-reviews-nav:hover{ transform: translateY(-50%) scale(1.06); }
.wd-reviews-nav.is-prev{ left: -6px; }
.wd-reviews-nav.is-next{ right: -6px; }

/* responsive */
@media (max-width: 860px){
  .wd-reviews-strip{ grid-auto-columns: 80%; }
  .wd-reviews-nav{ display: none; }
}

.wd-reviews-meta {
    display: flex;
    align-items: center;
    gap: 1rem;
}

strong.wd-reviews-name {
    width: 100%;
}

.edge-actions .edge-btn span {
    color: white;
}



.video-testimonials {
                display: flex;
                gap: 16px;
                overflow-x: auto;
                scroll-snap-type: x mandatory;
                padding-bottom: 16px;
            }

            .video-testimonials > * {
                flex: 0 0 auto;
                min-width: 300px;
                height: 533px;
                scroll-snap-align: start;
            }
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
    
            
