:root{
  --navy:#16224E;
  --navy-2:#1E2E66;
  --yellow:#F5C518;
  --yellow-soft:#FFDE5C;
  --bg:#F6F7FB;
  --ink:#1B2137;
  --muted:#5A6280;
  --white:#FFFFFF;
  --wa:#1EBE5D;
  --radius:16px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:"Manrope",system-ui,-apple-system,sans-serif;
  background:var(--bg);
  color:var(--ink);
  line-height:1.6;
  padding-bottom:76px; /* sabit alt bar payı */
}
h1,h2,.display{
  font-family:"Anton","Arial Narrow",sans-serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.01em;
  line-height:1.08;
}
a{color:inherit}
img{max-width:100%}
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px;border-radius:6px}

/* ---- Sarı fırça darbesi (imza öğesi) ---- */
.swipe{
  position:relative;
  display:inline-block;
  padding:.04em .18em;
  color:var(--navy);
  z-index:0;
  white-space:nowrap;
}
.swipe::before{
  content:"";
  position:absolute;inset:0;
  z-index:-1;
  background:var(--yellow);
  clip-path:polygon(2% 18%, 99% 0%, 100% 80%, 96% 96%, 3% 100%, 0% 70%);
  transform:rotate(-1.2deg);
}

.wrap{max-width:1060px;margin:0 auto;padding:0 20px}

/* ---- Üst şerit ---- */
.topbar{
  background:var(--navy);
  color:#fff;
  font-size:.85rem;
  font-weight:600;
}
.topbar .wrap{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:8px;padding-bottom:8px;gap:12px;
}
.topbar a{text-decoration:none}
.topbar .tel:hover{color:var(--yellow)}

/* ---- Hero ---- */
.hero{
  background:
    radial-gradient(1100px 500px at 85% -10%, var(--navy-2), transparent 60%),
    var(--navy);
  color:#fff;
  padding:56px 0 64px;
  position:relative;
  overflow:hidden;
}
.hero .eyebrow{
  color:var(--yellow);
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:.8rem;
  margin-bottom:14px;
}
.hero h1{
  font-size:clamp(2.4rem, 7.5vw, 4.6rem);
  max-width:14ch;
}
.hero h1 .swipe{color:var(--navy)}
.hero .sub{
  margin-top:18px;
  font-size:clamp(1rem, 2.6vw, 1.2rem);
  color:#D9DEF2;
  max-width:44ch;
}
.hero .sub strong{color:#fff}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 26px;
  border-radius:999px;
  font-weight:800;
  font-size:1.05rem;
  text-decoration:none;
  transition:transform .15s ease;
}
.btn:active{transform:scale(.97)}
.btn svg{flex:none}
.btn-call{background:var(--yellow);color:var(--navy)}
.btn-call:hover{background:var(--yellow-soft)}
.btn-wa{background:var(--wa);color:#fff}
.btn-wa:hover{background:#23d668}
.hero .not{margin-top:14px;font-size:.85rem;color:#9AA4C8}

/* süpürge izi: heronun altındaki sarı şerit */
.hero::after{
  content:"";
  position:absolute;left:0;right:0;bottom:0;height:10px;
  background:var(--yellow);
  clip-path:polygon(0 40%, 100% 0, 100% 100%, 0 100%);
}

/* ---- Bölümler ---- */
section{padding:56px 0}
.kicker{
  color:var(--muted);
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:.78rem;
  margin-bottom:10px;
}
h2{font-size:clamp(1.7rem, 4.5vw, 2.5rem);color:var(--navy);margin-bottom:26px}

/* Hizmet kartları */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.card{
  background:var(--white);
  border-radius:var(--radius);
  padding:26px 22px;
  box-shadow:0 2px 14px rgba(22,34,78,.07);
  border-top:4px solid var(--yellow);
}
.card .ic{
  width:52px;height:52px;border-radius:14px;
  background:var(--navy);
  display:grid;place-items:center;
  margin-bottom:16px;
}
.card h3{font-size:1.08rem;color:var(--navy);margin-bottom:8px}
.card p{font-size:.94rem;color:var(--muted)}

/* Evlere servis */
.service{background:var(--white)}
.service .split{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}
.service ul{list-style:none;display:grid;gap:14px}
.service li{
  display:flex;gap:12px;align-items:flex-start;
  font-weight:600;
}
.service li::before{
  content:"✓";
  flex:none;
  width:26px;height:26px;border-radius:8px;
  background:var(--yellow);color:var(--navy);
  display:grid;place-items:center;
  font-weight:800;
  transform:rotate(-4deg);
}
.service .big-num{
  background:var(--navy);
  border-radius:var(--radius);
  color:#fff;
  padding:34px 28px;
  text-align:center;
}
.service .big-num .display{font-size:clamp(2.2rem,6vw,3.4rem);color:var(--yellow)}
.service .big-num p{color:#C9D0EA;margin-top:8px;font-size:.95rem}

/* SSS */
details{
  background:var(--white);
  border-radius:12px;
  margin-bottom:12px;
  box-shadow:0 1px 8px rgba(22,34,78,.06);
}
summary{
  cursor:pointer;
  padding:18px 20px;
  font-weight:800;
  color:var(--navy);
  list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:12px;
}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:"Anton";font-size:1.3rem;color:var(--yellow);transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}
details .a{padding:0 20px 18px;color:var(--muted)}
details .a a{color:var(--navy);font-weight:700}

/* İletişim */
.contact{background:var(--navy);color:#fff}
.contact h2{color:#fff}
.contact .kicker{color:var(--yellow)}
.people{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.person{
  background:var(--navy-2);
  border-radius:var(--radius);
  padding:26px 24px;
  border:1px solid rgba(245,197,24,.25);
}
.person .name{font-weight:800;font-size:1.15rem}
.person .num{
  font-family:"Anton";
  font-size:1.5rem;
  letter-spacing:.03em;
  color:var(--yellow);
  display:block;margin:10px 0 16px;
  text-decoration:none;
}
.person .row{display:flex;gap:10px;flex-wrap:wrap}
.person .btn{padding:11px 20px;font-size:.95rem}
.insta{
  margin-top:26px;
  display:inline-flex;align-items:center;gap:10px;
  color:#D9DEF2;text-decoration:none;font-weight:700;
}
.insta:hover{color:var(--yellow)}

footer{
  background:var(--navy);
  color:#8D97BF;
  font-size:.82rem;
  padding:18px 0 26px;
  border-top:1px solid rgba(255,255,255,.08);
}

/* ---- Sabit alt bar (mobil dönüşüm çubuğu) ---- */
.dockbar{
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  display:flex;
  box-shadow:0 -4px 20px rgba(22,34,78,.25);
}
.dockbar a{
  flex:1;
  display:flex;align-items:center;justify-content:center;gap:8px;
  padding:17px 8px;
  font-weight:800;
  font-size:1.02rem;
  text-decoration:none;
}
.dock-call{background:var(--yellow);color:var(--navy)}
.dock-wa{background:var(--wa);color:#fff}

@media (min-width:820px){
  body{padding-bottom:0}
  .dockbar{display:none}
}
@media (max-width:819px){
  .service .split{grid-template-columns:1fr}
  .topbar .slogan{display:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .btn{transition:none}
}

/* ---- İç sayfalar ---- */
.page-hero{padding:40px 0 48px}
.page-hero h1{font-size:clamp(2rem,6vw,3.4rem);max-width:20ch}
.crumb{font-size:.85rem;color:#9AA4C8;margin-bottom:16px}
.crumb a{color:#D9DEF2;text-decoration:none}
.crumb a:hover{color:var(--yellow)}
.prose{max-width:70ch}
.prose p{margin-bottom:16px;color:var(--ink)}
.prose h2{margin-top:36px}
.prose ul{margin:0 0 16px 22px}
.prose li{margin-bottom:8px}
.table-wrap{overflow-x:auto;margin:24px 0}
table.price{width:100%;border-collapse:collapse;background:var(--white);border-radius:var(--radius);overflow:hidden;box-shadow:0 2px 14px rgba(22,34,78,.07);min-width:480px}
table.price th{background:var(--navy);color:#fff;text-align:left;padding:14px 18px;font-size:.9rem;letter-spacing:.04em;text-transform:uppercase}
table.price td{padding:14px 18px;border-bottom:1px solid #EDEFF6}
table.price tr:last-child td{border-bottom:none}
table.price .fiyat{font-weight:800;color:var(--navy);white-space:nowrap}
.cta-band{background:var(--navy);border-radius:var(--radius);color:#fff;padding:30px 28px;margin:40px 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px}
.cta-band .t{font-family:"Anton";text-transform:uppercase;font-size:1.4rem;letter-spacing:.02em}
.footnav{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:12px}
.footnav a{color:#C9D0EA;text-decoration:none;font-weight:600}
.footnav a:hover{color:var(--yellow)}

/* ---- Kampanya şeridi (yönetim panelinden açılır/kapanır) ---- */
#kampanya-serit{background:var(--yellow);color:var(--navy)}
#kampanya-serit:empty{display:none}
.kampanya-metin{
  padding:10px 0;
  font-weight:800;
  font-size:.95rem;
  text-align:center;
  letter-spacing:.01em;
}

/* ---- Müşteri yorumları (yönetim panelinden eklenir) ---- */
#yorumlar-alani:empty{display:none}
#yorumlar-alani{background:var(--white);padding:56px 0}
.yorumlar{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.yorum{
  margin:0;
  background:var(--bg);
  border-radius:var(--radius);
  padding:24px 22px;
  border-left:4px solid var(--yellow);
}
.yorum blockquote{
  margin:0 0 14px;
  font-size:1rem;
  line-height:1.65;
  color:var(--ink);
}
.yorum blockquote::before{content:"“";font-family:"Anton";font-size:1.6rem;color:var(--yellow);line-height:0;margin-right:2px;vertical-align:-.15em}
.yorum figcaption{
  font-weight:800;
  font-size:.88rem;
  color:var(--navy);
}

/* ---- Harita / işletme bilgileri (yönetim panelinden açılır) ---- */
#harita-alani:empty{display:none}
#harita-alani{padding:56px 0;background:var(--bg)}
.harita-kutu{
  display:grid;
  grid-template-columns:1fr 280px;
  gap:24px;
  align-items:start;
  background:#fff;
  border-radius:var(--radius);
  padding:28px 26px;
  box-shadow:0 2px 14px rgba(22,34,78,.07);
}
.harita-kutu .adres{
  font-size:1.05rem;
  font-weight:600;
  color:var(--ink);
  margin-bottom:18px;
  max-width:38ch;
}
.btn-yorum{background:var(--navy);color:#fff}
.btn-yorum:hover{background:var(--navy-2)}
.saatler{background:var(--bg);border-radius:12px;padding:18px 18px 14px}
.saat-baslik{
  font-weight:800;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);margin-bottom:10px;
}
.saat-satir{
  display:flex;justify-content:space-between;gap:12px;
  padding:7px 0;border-bottom:1px solid #EDEFF6;font-size:.92rem;
}
.saat-satir:last-child{border-bottom:none}
.saat-satir strong{color:var(--navy);white-space:nowrap}
@media(max-width:760px){
  .harita-kutu{grid-template-columns:1fr;padding:22px 20px}
}