/* ==== Reset / temel ==== */
*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font:15px/1.55 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Inter,Arial,sans-serif;color:#111;background:#fff}
img{max-width:100%;height:auto;display:block}
.container{max-width:min(1140px,92vw);margin:0 auto;padding:0 12px}

/* =========================================
   HERO – full-bleed
========================================= */
.hero{position:relative;border-bottom:1px solid #eee}
.hero-bleed{width:100vw;margin-left:50%;transform:translateX(-50%);min-height:clamp(320px,56vw,720px);isolation:isolate}
.hero-img{display:block;width:100vw;max-width:none;height:clamp(320px,56vw,720px);object-fit:cover;object-position:center}
.hero-bleed::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.28));pointer-events:none}
.hero-title{position:absolute;left:clamp(12px, 4vw, 24px);bottom:clamp(12px, 3.6vw, 22px);margin:0;color:#fff;font-weight:800;font-size:clamp(22px,3.6vw,36px);text-shadow:0 4px 16px rgba(0,0,0,.6);z-index:1}

/* ==== Özellikler ==== */
.section-title{margin:24px 0 16px;text-align:center;font-weight:800;font-size:clamp(18px,2.2vw,22px)}
.features{list-style:none;margin:0;padding:18px 10px;border:1px solid #eee;border-radius:16px;display:grid;gap:18px 26px;grid-template-columns:repeat(3,1fr)}
.feature{display:grid;grid-template-columns:auto 1fr;gap:10px 12px;align-items:start}
.feature .dot{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid #e6e8ef;background:#f8fafc;box-shadow:0 6px 16px rgba(0,0,0,.06)}
.feature .dot::before{content:"✓";font-weight:800;color:#e11d48} /* kırmızı */
.feature b{display:block;font-size:15px}
.feature small{display:block;opacity:.7}
@media (max-width:900px){.features{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.features{grid-template-columns:1fr}}
.cta{text-align:center;margin:18px 0 10px;font-size:clamp(16px,2.2vw,18px);font-weight:700}

/* ==== Carousel ==== */
.carousel{position:relative;margin:18px 0 32px}
.carousel-viewport{overflow:hidden;border-radius:16px;border:1px solid #eef1f4;box-shadow:0 12px 28px rgba(0,0,0,.08)}
.carousel-track{display:flex;transition:transform .38s ease}
.slide{min-width:100%;user-select:none}
.slide img{width:100%;aspect-ratio:16/9;object-fit:cover}

/* oklar & noktalar */
.car-nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:999px;border:1px solid rgba(255,255,255,.25);background:rgba(0,0,0,.45);color:#fff;display:grid;place-items:center;cursor:pointer;font-size:22px;backdrop-filter:blur(6px)}
.car-prev{left:10px}.car-next{right:10px}
@media (max-width:720px){.car-nav{width:42px;height:42px;font-size:20px}.car-prev{left:8px}.car-next{right:8px}}
.car-dots{display:flex;gap:10px;justify-content:center;margin-top:12px}
.car-dots button{width:10px;height:10px;border-radius:999px;border:0;cursor:pointer;background:#d1d5db}
.car-dots button[aria-current="true"]{background:#e11d48;transform:scale(1.25)} /* kırmızı */

/* ==== Lightbox (opsiyonel) ==== */
.lightbox[hidden]{display:none}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.9);display:grid;grid-template-rows:1fr auto;z-index:1000}
.lb-stage{display:grid;place-items:center;padding:16px}
.lb-stage img{max-width:96vw;max-height:86vh;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.lb-bar{display:flex;justify-content:center;gap:10px;padding:10px 0 16px}
.lb-btn{color:#fff;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);padding:10px 12px;border-radius:10px;cursor:pointer}