
:root{
  --maxw:1200px;
  --brand:#af0000;   /* EraGöz koyu mavi */
  --accent:#6a0101;  /* Aqua/teal vurgu */
  --brand-dark:#af0000;
  --brand-soft:#6a0101;
  --text:#0f172a;
  --muted:#64748b;
}

*{ box-sizing:border-box; }
body{ margin:0; font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; line-height:1.6; color:var(--text); background:#ffffff; }
a{ color:var(--brand); text-decoration:none; }
header{ position:sticky; top:0; backdrop-filter:saturate(120%) blur(6px); background:rgba(255,255,255,0.8); border-bottom:1px solid #e2e8f0; z-index:10; }
.nav{ max-width:var(--maxw); margin:0 auto; display:flex; align-items:center; justify-content:space-between; padding:14px 20px; }
.logo{ font-weight:800; letter-spacing:.3px; }
.nav a{ margin-left:18px; font-weight:600; color:var(--text); }
.nav a:hover{ color:var(--brand); }
.hero{ position:relative; display:grid; place-items:center; min-height:64vh; color:white; text-align:center; }
.hero::before{ content:""; position:absolute; inset:0;z-index:0;}
.hero-img{ position:absolute; inset:0; background-size:cover; background-position:center; filter:contrast(1.05) brightness(.8); z-index:-1; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:56px 20px; }
.hero h1{ font-size:clamp(28px,4vw,46px); margin:0 0 12px; }
.hero p{ margin:0 auto 22px; max-width:800px; color:#e2e8f0; }
.cta{ display:inline-block; padding:12px 18px; border-radius:14px; background:linear-gradient(135deg, var(--brand), var(--accent)); color:white; font-weight:700; }
.grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:20px; }
.card{ grid-column:span 12; background:#ffffff; border:1px solid #e2e8f0; border-radius:18px; padding:22px; box-shadow:0 6px 20px rgba(2,6,23,.05); }
.card h3{ margin-top:0; }
@media(min-width:768px){
  .card{ grid-column:span 6; }
}
@media(min-width:1024px){
  .card{ grid-column:span 4; }
}
.section-title{ font-size:clamp(22px,3vw,32px); margin:0 0 12px; }
.muted{ color:#64748b; }
.split{ display:grid; gap:22px; grid-template-columns:1fr; }
@media(min-width:992px){ .split{ grid-template-columns:1.2fr .8fr; } }
footer{ border-top:1px solid #e2e8f0; background:var(--brand-soft); }
.footer-inner{ max-width:var(--maxw); margin:0 auto; padding:30px 20px; color:#334155; display:grid; gap:8px; }
.badge{ display:inline-block; padding:6px 10px; border-radius:999px; background:#e0f2fe; color:#0369a1; font-weight:700; font-size:12px; letter-spacing:.3px; }
.services-hero{ background:#020617; color:white; padding:0px; }
.breadcrumbs a{ color:#93c5fd; }
.pre{ white-space:pre-wrap; }


.form{ display:grid; gap:14px; max-width:720px; }
.input, .select, .textarea{ width:100%; padding:12px 14px; border:1px solid #e2e8f0; border-radius:12px; font:inherit; }
.button{ display:inline-block; padding:12px 18px; border-radius:14px; background:linear-gradient(135deg, var(--brand), var(--accent)); color:white; font-weight:700; border:none; cursor:pointer; }
.map-grid{ display:grid; grid-template-columns:1fr; gap:20px; }
@media(min-width:992px){ .map-grid{ grid-template-columns:1fr 1fr; } }
.map-iframe{ width:100%; height:260px; border:0; border-radius:14px; box-shadow:0 6px 20px rgba(2,6,23,.05); }
.address-card .title{ font-weight:700; margin:0 0 6px; }
address{ font-style:normal; color:#334155; }


.fixbar{ position:fixed; bottom:0; left:0; right:0; background:#0b1220; color:white;
  display:flex; justify-content:space-around; align-items:center; padding:10px 8px; z-index:50;
  border-top:1px solid rgba(255,255,255,0.12); }
.fixbtn{ display:flex; flex-direction:column; align-items:center; gap:4px; font-weight:700; font-size:12px; color:white; text-decoration:none; }
.fixbtn svg{ width:22px; height:22px; }
@media(min-width:768px){ .fixbar{ display:none; } }
body{ padding-bottom:68px; } /* prevent overlap on mobile */


.menu-toggle{ display:none; background:none; border:none; cursor:pointer; }
.menu-toggle svg{ width:28px; height:28px; color:var(--text); }
.nav .links{ display:flex; gap:18px; }
@media(max-width:768px){
  .menu-toggle{ display:block; }
  .nav .links{ 
    position:fixed; top:60px; right:0; background:white; flex-direction:column;
    align-items:flex-start; width:200px; padding:20px; box-shadow:0 4px 20px rgba(0,0,0,0.15);
    transform:translateX(100%); transition:transform .3s ease; height:calc(100vh - 60px); overflow-y:auto;
  }
  .nav .links.open{ transform:translateX(0); }
  .nav a{ display:block; padding:10px 0; width:100%; color:var(--text); font-weight:600; }
}
/* Brand theming */
.nav a:hover{ color:var(--accent); }
.logo{ color:var(--brand-dark); }
.cta{ background:linear-gradient(135deg, var(--brand), var(--accent)); }
.services-hero{ background:var(--brand-dark); }
.badge{ background:rgba(17,179,207,0.15); color:var(--brand-dark); }
.fixbar{ background:var(--brand-dark); }
a{ color:var(--brand); }
