:root{--gold:#c79a3b; 
 --gold2:#e1b85c; 
 --ink:#10171d; 
 --ink2:#172129; 
 --text:#152532; 
 --muted:#647482; 
 --white:#fff; 
 --line:#dce3e8; 
 --soft:#f5f7f8; 
 --radius:14px; 
 --shadow:0 14px 40px rgba(15,27,35,.12); 
 --container:1180px
 } 
 
*{box-sizing:border-box
 } 
 
html{scroll-behavior:smooth;
scroll-padding-top:96px
 } 
 
body{margin:0; 
 font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif; 
 color:var(--text); 
 background:#fff; 
 line-height:1.6
 } 
 
img{max-width:100%; 
 height:auto; 
 display:block
 } 
 
a{color:inherit; 
 text-decoration:none
 } 
 
.container{width:min(var(--container),calc(100% - 40px)); 
 margin-inline:auto
 } 
 
.topbar{height:38px; 
 background:#10161b; 
 color:#e8edf0; 
 font-size:12px
 } 
 
.topbar .container{height:100%; 
 display:flex; 
 align-items:center; 
 justify-content:space-between
 } 
 
.top-items{display:flex; 
 gap:34px; 
 align-items:center
 } 
 
.top-item{display:flex; 
 align-items:center; 
 gap:8px; 
 white-space:nowrap
 } 
 
.top-icon{color:var(--gold2); 
 font-size:15px
 } 
 
.top-phone{font-weight:800; 
 letter-spacing:.2px
 } 
 
.top-wa{background:#1fb85b; 
 border-radius:999px; 
 padding:5px 14px; 
 color:#fff; 
 font-weight:800
 } 
 
.site-header{position:sticky;
top:0;
z-index:1000;
background:linear-gradient(180deg,#0b1217 0%,#111b22 100%);
border-bottom:1px solid rgba(255,255,255,.12);
box-shadow:0 8px 24px rgba(0,0,0,.16);
backdrop-filter:blur(8px)
} 
 
.nav{min-height:86px; 
 display:flex; 
 align-items:center; 
 gap:34px
 } 
 
.brand{width:190px;
flex:0 0 190px;
align-self:center;
margin-top:0
} 
 
.brand img{width:175px; 
 height:auto; 
 filter:drop-shadow(0 5px 10px rgba(0,0,0,.45))
 } 
 
.main-nav{margin-left:auto;
display:flex;
align-items:center;
gap:4px;
height:86px
} 
 
.main-nav>a{color:#fff; 
 font-size:14px; 
 font-weight:700; 
 padding:33px 16px 30px; 
 position:relative; 
 white-space:nowrap
 } 
 
.main-nav>a:hover,.main-nav>a.active{color:var(--gold2)
 } 
 
.main-nav>a.active:after{content:""; 
 position:absolute; 
 left:16px; 
 right:16px; 
 bottom:0; 
 height:3px; 
 background:var(--gold2); 
 border-radius:4px
 } 
 
.nav-call{margin-left:14px!important; 
 background:linear-gradient(135deg,#b98322,#e0b85b); 
 border-radius:999px; 
 padding:12px 24px!important; 
 color:#fff!important; 
 box-shadow:0 8px 20px rgba(0,0,0,.2)
 } 
 
.nav-call:after{display:none
 } 
 
.menu-toggle{display:none
 } 
 
.hero{min-height:510px; 
 position:relative; 
 background-image:linear-gradient(90deg,rgba(7,13,18,.94) 0%,rgba(7,13,18,.86) 38%,rgba(7,13,18,.25) 72%,rgba(7,13,18,.45) 100%),url('../images/akincilingir-kapi-kilit-1600.webp'); 
 background-size:cover; 
 background-position:center right; 
 color:#fff; 
 display:flex; 
 align-items:center; 
 padding-top:0
 } 
 
.hero:after{content:""; 
 position:absolute; 
 inset:auto 0 0; 
 height:70px; 
 background:linear-gradient(transparent,rgba(7,13,18,.18)); 
 pointer-events:none
 } 
 
.hero-content{position:relative; 
 z-index:2; 
 padding:58px 0 66px
 } 
 
.eyebrow{display:inline-block; 
 color:var(--gold2); 
 font-size:13px; 
 font-weight:900; 
 letter-spacing:2.5px; 
 margin-bottom:7px
 } 
 
.hero h1{font-size:clamp(38px,4.3vw,61px); 
 line-height:1.03; 
 letter-spacing:-1.8px; 
 margin:0 0 18px; 
 max-width:670px
 } 
 
.hero h1 strong{font-weight:900
 } 
 
.hero p{font-size:17px; 
 line-height:1.65; 
 max-width:590px; 
 color:#e8edf0; 
 margin:0 0 27px
 } 
 
.hero-actions{display:flex; 
 gap:13px; 
 flex-wrap:wrap
 } 
 
.btn{display:inline-flex; 
 align-items:center; 
 justify-content:center; 
 gap:10px; 
 border-radius:999px; 
 padding:13px 30px; 
 font-weight:800; 
 font-size:14px; 
 border:1px solid transparent; 
 transition:.2s transform,.2s box-shadow
 } 
 
.btn:hover{transform:translateY(-2px)
 } 
 
.btn-primary{background:linear-gradient(135deg,#b77e1d,#dfb458); 
 color:#fff; 
 box-shadow:0 9px 24px rgba(0,0,0,.24)
 } 
 
.btn-whatsapp{background:rgba(12,20,25,.55); 
 color:#fff; 
 border-color:rgba(255,255,255,.75)
 } 
 
.trust-row{display:flex; 
 gap:23px; 
 margin-top:24px; 
 flex-wrap:wrap; 
 color:#dce4e8; 
 font-size:12px; 
 font-weight:700
 } 
 
.trust-row span:before{content:"✓"; 
 color:var(--gold2); 
 margin-right:7px
 } 
 
.quick-bar{background:#fff; 
 box-shadow:0 7px 25px rgba(20,34,43,.08); 
 position:relative; 
 z-index:5
 } 
 
.quick-grid{display:grid; 
 grid-template-columns:repeat(6,1fr); 
 min-height:118px
 } 
 
.quick-item{display:flex; 
 align-items:center; 
 justify-content:center; 
 gap:10px; 
 padding:20px 12px; 
 position:relative; 
 text-align:center
 } 
 
.quick-item:not(:last-child):after{content:""; 
 position:absolute; 
 right:0; 
 top:31px; 
 height:56px; 
 width:1px; 
 background:#d6dde2
 } 
 
.quick-icon{width:50px; 
 height:50px; 
 border:2px solid #edf1f3; 
 border-radius:50%; 
 display:grid; 
 place-items:center; 
 color:#0e2535; 
 flex:0 0 50px
 } 
 
.quick-icon svg{width:28px; 
 height:28px
 } 
 
.quick-copy strong{display:block; 
 font-size:14px; 
 line-height:1.25
 } 
 
.quick-copy small{display:block; 
 color:#6b7b86; 
 font-size:11px; 
 margin-top:3px
 } 
 
.section{padding:70px 0
 } 
 
.section-head{margin-bottom:35px
 } 
 
.section-head.center{text-align:center
 } 
 
.section-head .eyebrow{color:var(--gold)
 } 
 
.section-head h2{font-size:38px; 
 line-height:1.12; 
 margin:4px 0 12px; 
 letter-spacing:-1px
 } 
 
.section-head h2 span{font-weight:900
 } 
 
.section-head p{max-width:730px; 
 color:var(--muted); 
 margin:0
 } 
 
.split-intro{display:grid; 
 grid-template-columns:1.02fr 1fr; 
 gap:55px; 
 align-items:center
 } 
 
.intro-image{position:relative; 
 border-radius:8px; 
 overflow:hidden; 
 box-shadow:var(--shadow)
 } 
 
.intro-image img{width:100%; 
 aspect-ratio:1.55; 
 object-fit:cover
 } 
 
.intro-copy .eyebrow{color:var(--gold)
 } 
 
.intro-copy h2{font-size:35px; 
 line-height:1.15; 
 margin:0 0 14px
 } 
 
.intro-copy p{color:var(--muted); 
 margin:0 0 25px
 } 
 
.benefits{display:grid; 
 grid-template-columns:repeat(4,1fr); 
 border-top:1px solid var(--line); 
 padding-top:20px; 
 gap:12px
 } 
 
.benefit{display:flex; 
 gap:10px; 
 align-items:center
 } 
 
.benefit-icon{width:38px; 
 height:38px; 
 display:grid; 
 place-items:center; 
 color:#172b39
 } 
 
.benefit strong{display:block; 
 font-size:13px
 } 
 
.benefit small{color:#71808a; 
 font-size:10px
 } 
 
.dark-section{background:radial-gradient(circle at 15% 20%,rgba(199,154,59,.08),transparent 28%),linear-gradient(135deg,#111a20,#0c1318); 
 color:#fff; 
 padding:72px 0
 } 
 
.services-head{display:flex; 
 align-items:end; 
 justify-content:space-between; 
 gap:20px; 
 margin-bottom:24px
 } 
 
.services-head h2{color:#fff; 
 margin:4px 0 0
 } 
 
.services-head .btn-outline{border:1px solid var(--gold); 
 color:#fff; 
 padding:10px 18px; 
 border-radius:999px; 
 font-size:12px; 
 font-weight:800
 } 
 
.service-grid{display:grid; 
 grid-template-columns:repeat(6,1fr); 
 gap:12px
 } 
 
.service-card{border:1px solid rgba(255,255,255,.45); 
 border-radius:6px; 
 overflow:hidden; 
 background:#131d23; 
 position:relative; 
 min-width:0; 
 box-shadow:0 10px 24px rgba(0,0,0,.18)
 } 
 
.service-card .service-img{width:100%; 
 aspect-ratio:1/1.12; 
 object-fit:cover
 } 
 
.service-card .service-body{padding:11px 12px 13px
 } 
 
.service-card h3{font-size:13px; 
 line-height:1.25; 
 margin:0 0 5px; 
 color:#fff
 } 
 
.service-card p{font-size:10px; 
 line-height:1.4; 
 color:#aebbc2; 
 margin:0 0 8px
 } 
 
.service-link{font-size:11px; 
 font-weight:800; 
 color:var(--gold2)
 } 
 
.area-section{padding:0
 } 
 
.area-wrap{display:grid; 
 grid-template-columns:1.35fr .65fr
 } 
 
.area-main{padding:58px 50px 58px max(20px,calc((100vw - var(--container))/2)); 
 background:#fff
 } 
 
.area-side{background-image:linear-gradient(rgba(9,17,22,.55),rgba(9,17,22,.68)),url('../images/akincilingir-kapi-kilit-1200.webp'); 
 background-size:cover; 
 background-position:center; 
 display:flex; 
 align-items:center; 
 justify-content:center; 
 padding:40px
 } 
 
.area-main h2{font-size:30px; 
 margin:0 0 12px
 } 
 
.area-main p{color:var(--muted); 
 max-width:620px; 
 font-size:14px
 } 
 
.district-list{list-style:none; 
 padding:0; 
 margin:25px 0 0; 
 display:grid; 
 grid-template-columns:repeat(3,minmax(0,1fr)); 
 gap:7px 28px
 } 
 
.district-list li{font-size:12px; 
 color:#53636e
 } 
 
.district-list li:before{content:"•"; 
 color:var(--gold); 
 font-weight:900; 
 margin-right:7px
 } 
 
.area-side-card{color:#fff; 
 text-align:center
 } 
 
.area-side-card .mini{font-size:12px; 
 font-weight:800; 
 letter-spacing:1px
 } 
 
.area-side-card h3{font-size:30px; 
 margin:7px 0 17px
 } 
 
.area-side-card .phone{font-size:27px; 
 font-weight:900; 
 white-space:nowrap
 } 
 
.area-side-card .btn{margin-top:20px
 } 
 
.faq{background:#f7f9fa
 } 
 
.faq-grid{display:grid; 
 grid-template-columns:1fr 1fr; 
 gap:14px 20px
 } 
 
.faq details{background:#fff; 
 border:1px solid var(--line); 
 border-radius:10px; 
 padding:0 18px
 } 
 
.faq summary{cursor:pointer; 
 font-weight:800; 
 padding:18px 0; 
 list-style:none
 } 
 
.faq summary::-webkit-details-marker{display:none
 } 
 
.faq summary:after{content:"+"; 
 float:right; 
 color:var(--gold); 
 font-size:20px
 } 
 
.faq details[open] summary:after{content:"−"
 } 
 
.faq details p{color:var(--muted); 
 font-size:14px; 
 margin:0 0 18px
 } 
 
.cta-section{padding:54px 0; 
 background:linear-gradient(135deg,#f4f6f7,#fff)
 } 
 
.cta-inner{display:flex; 
 align-items:center; 
 justify-content:space-between; 
 gap:30px
 } 
 
.cta-inner h2{font-size:34px; 
 margin:0 0 6px
 } 
 
.cta-inner p{color:var(--muted); 
 margin:0
 } 
 
.seo-context{font-size:12px; 
 color:#77858d; 
 margin:20px 0 0
 } 
 
.seo-context a{color:#92702a; 
 font-weight:700
 } 
 
footer{background:#0f181e; 
 color:#bac6cc
 } 
 
.footer-main{display:grid; 
 grid-template-columns:1.2fr .7fr .9fr; 
 gap:50px; 
 padding:42px 0
 } 
 
.footer-brand img{width:150px; 
 margin-bottom:12px
 } 
 
.footer-main h4{color:#fff; 
 margin:0 0 13px; 
 font-size:14px
 } 
 
.footer-main a{display:block; 
 font-size:12px; 
 margin:7px 0; 
 color:#bac6cc
 } 
 
.footer-main a:hover{color:var(--gold2)
 } 
 
.footer-note{font-size:12px; 
 max-width:350px
 } 
 
.copyright{border-top:1px solid rgba(255,255,255,.08); 
 padding:15px 0; 
 font-size:11px; 
 text-align:center; 
 color:#819099
 } 
 
.page-hero{padding:70px 0 65px; 
 background:linear-gradient(90deg,rgba(8,14,19,.94),rgba(8,14,19,.56)),url('../images/akincilingir-kapi-kilit-1600.webp') center/cover; 
 color:#fff
 } 
 
.page-hero h1{font-size:45px; 
 line-height:1.1; 
 margin:0 0 12px
 } 
 
.page-hero p{max-width:680px; 
 color:#dce4e8; 
 margin:0
 } 
 
.breadcrumbs{font-size:12px; 
 color:#aab6bc; 
 margin-bottom:12px
 } 
 
.breadcrumbs a{color:#fff
 } 
 
.detail{display:grid; 
 grid-template-columns:1.1fr .9fr; 
 gap:45px; 
 align-items:start
 } 
 
.detail-image{border-radius:12px; 
 overflow:hidden; 
 box-shadow:var(--shadow)
 } 
 
.detail-image img{width:100%; 
 aspect-ratio:1.45; 
 object-fit:cover
 } 
 
.detail-copy h2{font-size:32px; 
 line-height:1.15; 
 margin:0 0 14px
 } 
 
.detail-copy p{color:var(--muted)
 } 
 
.detail-list{padding-left:19px; 
 color:#53636e
 } 
 
.detail-list li{margin:7px 0
 } 
 
.detail-cta{margin-top:24px; 
 display:flex; 
 gap:10px; 
 flex-wrap:wrap
 } 
 
.page-area{background:#f7f9fa
 } 
 
.area-box{border:1px solid var(--line); 
 border-radius:14px; 
 background:#fff; 
 padding:30px
 } 
 
.area-box h3{margin:0 0 8px
 } 
 
.area-box p{color:var(--muted)
 } 
 
@media(max-width:1050px){.main-nav>a{padding-inline:10px
 } 
 
.nav-call{padding-inline:17px!important
 } 
 
.brand{width:175px; 
 flex-basis:175px
 } 
 
.service-grid{grid-template-columns:repeat(3,1fr)
 } 
 
.quick-grid{grid-template-columns:repeat(3,1fr)
 } 
 
.quick-item:nth-child(3):after{display:none
 } 
 
.area-wrap{grid-template-columns:1fr
 } 
 
.area-main{padding:55px 30px
 } 
 
.area-side{min-height:330px
 } 
 
.benefits{grid-template-columns:repeat(2,1fr)
 } 
 

 } 
 
@media(max-width:760px){.container{width:min(var(--container),calc(100% - 28px))
 } 
 
.topbar{height:auto; 
 min-height:38px
 } 
 
.top-items{width:100%; 
 justify-content:space-between; 
 gap:8px
 } 
 
.top-item:nth-child(2){display:none
 } 
 
.top-phone{font-size:11px
 } 
 
.top-wa{padding:5px 10px; 
 font-size:10px
 } 
 
.site-header{top:0
 } 
 
.nav{min-height:72px
 } 
 
.brand{width:150px; 
 flex-basis:150px
 } 
 
.brand img{width:145px
 } 
 
.menu-toggle{display:grid; 
 margin-left:auto; 
 width:42px; 
 height:42px; 
 border:1px solid rgba(255,255,255,.35); 
 border-radius:9px; 
 background:rgba(0,0,0,.2); 
 color:#fff; 
 font-size:22px; 
 place-items:center
 } 
 
.main-nav{display:none; 
 position:absolute; 
 top:70px; 
 left:0; 
 right:0; 
 height:auto; 
 background:#10171c; 
 padding:8px 14px 16px; 
 flex-direction:column; 
 align-items:stretch; 
 gap:0
 } 
 
.main-nav.open{display:flex
 } 
 
.main-nav>a{padding:12px 10px; 
 border-bottom:1px solid rgba(255,255,255,.07)
 } 
 
.main-nav>a.active:after{display:none
 } 
 
.nav-call{margin:8px 0 0!important; 
 text-align:center
 } 
 
.hero{min-height:640px; 
 padding-top:0; 
 background-position:63% center
 } 
 
.hero-content{padding:75px 0 55px
 } 
 
.hero h1{font-size:39px; 
 letter-spacing:-1px
 } 
 
.hero p{font-size:15px
 } 
 
.trust-row{gap:10px 16px
 } 
 
.quick-grid{grid-template-columns:repeat(2,1fr); 
 min-height:auto
 } 
 
.quick-item{padding:17px 8px
 } 
 
.quick-item:nth-child(even):after{display:none
 } 
 
.quick-item:nth-child(odd):after{display:block; 
 right:0
 } 
 
.quick-icon{width:42px; 
 height:42px; 
 flex-basis:42px
 } 
 
.section{padding:52px 0
 } 
 
.section-head h2,.intro-copy h2{font-size:29px
 } 
 
.split-intro{grid-template-columns:1fr; 
 gap:28px
 } 
 
.benefits{grid-template-columns:repeat(2,1fr)
 } 
 
.services-head{align-items:start; 
 flex-direction:column
 } 
 
.service-grid{grid-template-columns:repeat(2,1fr); 
 gap:10px
 } 
 
.service-card .service-body{padding:10px
 } 
 
.service-card h3{font-size:12px
 } 
 
.service-card p{font-size:9px
 } 
 
.area-main{padding:46px 18px
 } 
 
.area-main h2{font-size:27px
 } 
 
.district-list{grid-template-columns:repeat(2,1fr); 
 gap:6px 15px
 } 
 
.area-side{min-height:280px; 
 padding:25px
 } 
 
.area-side-card h3{font-size:25px
 } 
 
.area-side-card .phone{font-size:22px
 } 
 
.faq-grid{grid-template-columns:1fr
 } 
 
.cta-inner{align-items:flex-start; 
 flex-direction:column
 } 
 
.cta-inner h2{font-size:29px
 } 
 
.footer-main{grid-template-columns:1fr 1fr; 
 gap:30px
 } 
 
.footer-brand{grid-column:1/-1
 } 
 
.page-hero{padding:55px 0 50px
 } 
 
.page-hero h1{font-size:36px
 } 
 
.detail{grid-template-columns:1fr; 
 gap:25px
 } 
 

 } 
 
@media(max-width:430px){.top-phone{display:none
 } 
 
.top-items{justify-content:flex-end
 } 
 
.hero{min-height:675px
 } 
 
.hero h1{font-size:35px
 } 
 
.hero-actions .btn{width:100%
 } 
 
.quick-grid{grid-template-columns:1fr 1fr
 } 
 
.quick-copy strong{font-size:12px
 } 
 
.service-grid{grid-template-columns:1fr 1fr
 } 
 
.footer-main{grid-template-columns:1fr
 } 
 
.district-list{grid-template-columns:1fr 1fr
 } 
 

 } 
 

/* Hizmet kartı başlıkları da tıklanabilir: görsel kart linkleriyle aynı hedefe gider. */
.service-title {
  color: inherit;
  text-decoration: none;
  transition: color .2s ease;
}
.service-title:hover,
.service-title:focus-visible {
  color: var(--gold);
  text-decoration: none;
}
.service-title:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 4px;
  border-radius: 3px;
}