/* =========================================================
   TOKENS
========================================================= */
:root{
  --anthracite-deep:#10141a;
  --anthracite:#1a212c;
  --anthracite-soft:#232b38;
  --steel-blue:#1e5aa8;
  --sky:#4fa3e3;
  --alu-grey:#9aa3ac;
  --alu-grey-soft:#c4cad0;
  --glass-white:#f5f8fa;
  --white:#ffffff;
  --line:rgba(154,163,172,0.22);
  --line-light:rgba(16,20,26,0.10);
  --shadow-sm: 0 2px 10px rgba(16,20,26,0.06);
  --shadow-md: 0 12px 40px rgba(16,20,26,0.10);
  --shadow-lg: 0 24px 60px rgba(16,20,26,0.16);
  --whatsapp: #25d366;
  --font-display: 'Space Grotesk', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;
  --ease: cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family: var(--font-body);
  color: var(--anthracite);
  background: var(--glass-white);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
button{font-family:inherit; cursor:pointer; border:none; background:none;}
.container{max-width:1240px; margin:0 auto; padding:0 clamp(20px,5vw,48px);}
h1,h2,h3,h4{font-family:var(--font-display); font-weight:600; letter-spacing:-0.01em; color:var(--anthracite-deep);}
.eyebrow{
  font-family:var(--font-mono); font-size:12.5px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--steel-blue); display:flex; align-items:center; gap:10px; margin-bottom:14px;
}
.eyebrow::before{content:''; width:22px; height:1px; background:var(--steel-blue); display:inline-block;}
section{position:relative;}
.section-pad{padding:clamp(64px,10vw,120px) 0;}
.section-head{max-width:640px; margin-bottom:56px;}
.section-head h2{font-size:clamp(28px,4vw,42px); line-height:1.15;}
.section-head p{margin-top:16px; color:#525b66; font-size:16.5px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}
.section-head.center .eyebrow{justify-content:center;}
.section-head.center .eyebrow::before{display:none;}

.reveal{opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease), transform .7s var(--ease);}
.reveal.in-view{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
  *{animation:none !important;}
}

/* corner-joint signature motif -------------------------------------- */
.joint{position:absolute; width:26px; height:26px; pointer-events:none;}
.joint svg{width:100%; height:100%;}
.joint.tl{top:-1px; left:-1px;}
.joint.br{bottom:-1px; right:-1px; transform:scale(-1,-1);}

/* CTA banners -------------------------------------------------------- */
.cta-band{
  background:var(--anthracite-deep); color:var(--white);
  padding:44px clamp(24px,5vw,56px); display:flex; flex-wrap:wrap; gap:24px;
  align-items:center; justify-content:space-between; margin-top:0;
  position:relative; overflow:hidden;
}
.cta-band h3{color:var(--white); font-size:clamp(19px,2.4vw,25px); max-width:520px; font-weight:600; line-height:1.3; position:relative; z-index:1;}
.cta-band .btn{flex-shrink:0; position:relative; z-index:1;}
.profile-watermark{position:absolute; right:-30px; bottom:-40px; width:170px; height:170px; color:var(--sky); opacity:0.07; z-index:0; pointer-events:none;}

/* =========================================================
   NAVBAR
========================================================= */
.navbar{position:fixed; top:0; left:0; right:0; z-index:1000; padding:20px 0; transition: background .4s var(--ease), padding .4s var(--ease), box-shadow .4s var(--ease);}
.navbar.scrolled{
  background:rgba(16,20,26,0.9); backdrop-filter:blur(14px) saturate(140%); -webkit-backdrop-filter:blur(14px) saturate(140%);
  padding:12px 0; box-shadow:0 8px 30px rgba(0,0,0,0.18);
}
.logo-img{transition:height .4s var(--ease);}
.navbar.scrolled .logo-img{height:36px;}
.nav-inner{display:flex; align-items:center; justify-content:space-between;}
.logo{display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-weight:700; font-size:19px; color:var(--white); letter-spacing:0.01em;}
.logo-img{height:44px; width:auto; display:block;}
.nav-links{display:flex; gap:30px; align-items:center;}
.nav-links a{color:var(--alu-grey-soft); font-size:14px; font-weight:500; position:relative; padding:4px 0; transition:color .3s;}
.nav-links a::after{content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--sky); transition:width .3s var(--ease);}
.nav-links a:hover{color:var(--white);}
.nav-links a:hover::after{width:100%;}
.nav-cta{display:flex; align-items:center; gap:8px; background:var(--whatsapp); color:var(--white); padding:10px 20px; border-radius:30px; font-size:14px; font-weight:600; transition:transform .3s var(--ease), box-shadow .3s var(--ease);}
.nav-cta:hover{transform:translateY(-2px); box-shadow:0 8px 24px rgba(37,211,102,0.35);}
.burger{display:none; width:26px; height:20px; position:relative; z-index:1100;}
.burger span{position:absolute; left:0; width:100%; height:2px; background:var(--white); transition:.35s;}
.burger span:nth-child(1){top:0;} .burger span:nth-child(2){top:9px;} .burger span:nth-child(3){top:18px;}
.burger.open span:nth-child(1){transform:translateY(9px) rotate(45deg);}
.burger.open span:nth-child(2){opacity:0;}
.burger.open span:nth-child(3){transform:translateY(-9px) rotate(-45deg);}

.mobile-nav{position:fixed; inset:0; background:var(--anthracite-deep); z-index:1050; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:28px; transform:translateY(-100%); transition:transform .5s var(--ease);}
.mobile-nav.open{transform:translateY(0);}
.mobile-nav a{color:var(--white); font-family:var(--font-display); font-size:24px; font-weight:600;}
.mobile-nav .nav-cta{margin-top:10px;}

/* =========================================================
   HERO — gerçek fotoğraf + koyu overlay
========================================================= */
.hero{
  min-height:100vh; min-height:100svh; display:flex; align-items:center; position:relative; overflow:hidden;
  padding-top:110px;
  background-image:
    linear-gradient(180deg, rgba(9,12,17,0.72) 0%, rgba(9,12,17,0.58) 40%, rgba(9,12,17,0.82) 100%),
    url('images/hero.jpg');
  background-size:cover; background-position:center 50%;
}
/* HERO GÖRSELİ NASIL DEĞİŞTİRİLİR: yukarıdaki url('images/hero.jpg') kısmını
   images/ klasörüne eklediğiniz başka bir fotoğrafın adıyla değiştirin. */
.hero-inner{position:relative; z-index:2; width:100%; max-width:760px;}
.hero-tags{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:26px;}
.hero-tag{font-family:var(--font-mono); font-size:11.5px; letter-spacing:0.06em; color:var(--sky); border:1px solid rgba(79,163,227,0.4); padding:6px 12px; border-radius:2px; background:rgba(9,12,17,0.4); backdrop-filter:blur(3px);}
.hero h1{font-size:clamp(36px,5.4vw,62px); line-height:1.06; color:var(--white); letter-spacing:-0.02em; text-shadow:0 4px 30px rgba(0,0,0,0.35);}
.hero h1 .hl{color:var(--sky);}
.hero .sub{margin-top:22px; font-size:clamp(16px,1.6vw,18.5px); color:var(--alu-grey-soft); max-width:560px; font-weight:400;}
.hero-cta-row{display:flex; flex-wrap:wrap; gap:16px; margin-top:38px;}
.btn{display:inline-flex; align-items:center; gap:10px; padding:16px 30px; font-size:15.5px; font-weight:600; border-radius:2px; transition:transform .3s var(--ease), box-shadow .3s var(--ease), background .3s; white-space:nowrap;}
.btn-primary{background:var(--whatsapp); color:var(--white);}
.btn-primary:hover{transform:translateY(-3px); box-shadow:0 14px 34px rgba(37,211,102,0.32);}
.btn-outline{border:1px solid rgba(255,255,255,0.32); color:var(--white); background:rgba(255,255,255,0.05);}
.btn-outline:hover{background:rgba(255,255,255,0.12); transform:translateY(-3px);}
.btn svg{width:20px; height:20px;}

.trust-strip{display:flex; flex-wrap:wrap; gap:22px; margin-top:46px; padding-top:30px; border-top:1px solid rgba(255,255,255,0.16);}
.trust-strip .t-item{display:flex; align-items:center; gap:9px; color:var(--alu-grey-soft); font-size:13.5px; font-weight:500;}
.trust-strip .t-item svg{width:17px; height:17px; color:var(--sky); flex-shrink:0;}

.scroll-cue{position:absolute; bottom:34px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:10px; color:var(--alu-grey-soft); font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.1em; z-index:3;}
.scroll-cue .line{width:1px; height:34px; background:linear-gradient(var(--sky), transparent);}
@media (prefers-reduced-motion:no-preference){.scroll-cue .line{animation:pulse-line 2s ease-in-out infinite;}}
@keyframes pulse-line{0%,100%{opacity:.4;} 50%{opacity:1;}}

@media (max-width:940px){
  .nav-links{display:none;}
  .burger{display:block;}
  .trust-strip{gap:16px 22px;}
}
@media (max-width:760px){
  .hero{flex-direction:column; justify-content:center; padding-bottom:40px;}
  .scroll-cue{position:static; transform:none; left:auto; bottom:auto; margin:32px 0 0;}
}
@media (max-width:520px){
  .navbar .nav-cta{display:none !important;}
  .logo-img{height:34px;}
}

/* =========================================================
   SERVICES — fotoğraflı kartlar
========================================================= */
.services-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:clamp(20px,4vw,28px); background:transparent; border:none;}
.service-card{background:var(--white); position:relative; overflow:visible; transition:transform .35s var(--ease), box-shadow .35s var(--ease); border:1px solid var(--line-light); border-radius:14px; box-shadow:var(--shadow-sm);}
.service-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-md);}
.svc-photo{position:relative; height:260px; overflow:hidden; border-radius:14px 14px 0 0; background:linear-gradient(135deg, var(--glass-white), #e7edf1); display:flex; align-items:center; justify-content:center;}
.svc-photo img{width:100%; height:100%; object-fit:contain; padding:6px; transition:transform .6s var(--ease);}
.service-card:hover .svc-photo img{transform:scale(1.06);}
.svc-photo::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(16,20,26,0) 66%, rgba(16,20,26,0.42)); pointer-events:none;}
.svc-icon-badge{
  position:absolute; top:238px; left:24px; width:44px; height:44px; background:var(--white);
  border:1px solid var(--line-light); display:flex; align-items:center; justify-content:center; color:var(--steel-blue);
  box-shadow:var(--shadow-sm); z-index:2; border-radius:10px;
}
.svc-icon-badge svg{width:22px; height:22px;}
.service-card-body{padding:34px 26px 28px;}
.service-card h3{font-size:17.5px; margin-bottom:8px;}
.service-card p{font-size:13.8px; color:#6b7480;}

@media (max-width:480px){
  .svc-photo{height:240px;}
  .svc-icon-badge{top:218px;}
  .service-card-body{padding:26px 22px 24px;}
}

/* =========================================================
   GALLERY — masonry (Pinterest tarzı), en üstte
========================================================= */
.filters{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:36px;}
.filter-btn{padding:10px 20px; border:1px solid var(--line-light); font-size:13.5px; font-weight:500; color:#525b66; border-radius:30px; transition:.3s var(--ease);}
.filter-btn:hover{border-color:var(--steel-blue); color:var(--steel-blue);}
.filter-btn.active{background:var(--anthracite-deep); color:var(--white); border-color:var(--anthracite-deep);}

.masonry{column-count:3; column-gap:18px;}
.gallery-item{
  break-inside:avoid; margin-bottom:18px; position:relative; overflow:hidden; cursor:pointer;
  border:1px solid var(--line-light);
  user-select:none; -webkit-user-select:none; -moz-user-select:none;
}
.gallery-item.hidden-item{display:none;}
.gallery-item img{width:100%; display:block; transition:transform .6s var(--ease); -webkit-user-drag:none; user-drag:none; pointer-events:none;}
.gallery-overlay{
  position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end; padding:20px;
  background:linear-gradient(0deg, rgba(9,12,17,0.88) 0%, rgba(9,12,17,0.15) 55%, transparent 75%);
  opacity:0; transition:opacity .4s var(--ease);
}
.gallery-item:hover .gallery-overlay{opacity:1;}
.gallery-item:hover img{transform:scale(1.06);}
.gallery-overlay span.cat{font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--sky); margin-bottom:6px;}
.gallery-overlay h4{color:var(--white); font-size:16px; font-weight:600; margin-bottom:4px;}
.gallery-overlay .op{color:var(--alu-grey-soft); font-size:12.5px; margin-bottom:12px;}
.gallery-overlay .examine{display:inline-flex; align-items:center; gap:6px; color:var(--white); font-size:12.5px; font-weight:600; width:fit-content;}
.gallery-overlay .examine svg{width:14px; height:14px;}

.gallery-note{margin-top:26px; font-size:13.5px; color:#7a828c; font-family:var(--font-mono); border-left:2px solid var(--steel-blue); padding-left:14px;}

@media (max-width:940px){.masonry{column-count:2;}}
@media (max-width:600px){.masonry{column-count:1;}}

/* lightbox */
.lightbox{position:fixed; inset:0; background:rgba(9,12,17,0.95); z-index:2000; display:none; align-items:center; justify-content:center; padding:32px; user-select:none; -webkit-user-select:none;}
.lightbox.open{display:flex;}
.lightbox-inner{max-width:820px; width:100%; color:var(--white); text-align:center;}
.lightbox-inner img{width:100%; max-height:74vh; object-fit:contain; border:1px solid var(--line); -webkit-user-drag:none; user-drag:none;}
.lightbox-cap{margin-top:18px; font-size:14px; color:var(--alu-grey-soft);}
.lightbox-close{position:fixed; top:28px; right:28px; width:44px; height:44px; border:1px solid rgba(255,255,255,0.25); display:flex; align-items:center; justify-content:center; color:var(--white); transition:.3s;}
.lightbox-close:hover{background:rgba(255,255,255,0.1);}
.lightbox-close svg{width:20px; height:20px;}
.lightbox-nav{position:fixed; top:50%; transform:translateY(-50%); width:52px; height:52px; border:1px solid rgba(255,255,255,0.25); display:flex; align-items:center; justify-content:center; color:var(--white); cursor:pointer; transition:.3s; z-index:2001; user-select:none; -webkit-user-select:none;}
.lightbox-nav:hover{background:rgba(255,255,255,0.1);}
.lightbox-nav svg{width:22px; height:22px;}
.lightbox-prev{left:28px;}
.lightbox-next{right:28px;}
.lightbox-nav.hidden{display:none;}
.lightbox-counter{margin-top:14px; font-family:var(--font-mono); font-size:12px; letter-spacing:.06em; color:var(--sky);}
.gallery-item{position:relative;}
.gallery-photo-count{position:absolute; top:10px; right:10px; background:rgba(9,12,17,0.72); color:var(--white); font-family:var(--font-mono); font-size:11.5px; padding:4px 9px; display:flex; align-items:center; gap:5px; z-index:2;}
.gallery-photo-count svg{width:13px; height:13px;}
@media (max-width:640px){ .lightbox-nav{width:42px; height:42px;} .lightbox-prev{left:10px;} .lightbox-next{right:10px;} }

/* =========================================================
   WHY US
========================================================= */
.why-section{background:var(--anthracite-deep); color:var(--white);}
.why-section .section-head h2{color:var(--white);}
.why-section .section-head p{color:var(--alu-grey-soft);}
.why-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:2px; background:rgba(255,255,255,0.06);}
.why-item{background:var(--anthracite-deep); padding:32px 26px; display:flex; flex-direction:column; gap:16px;}
.why-icon{width:42px; height:42px; color:var(--sky); display:flex; align-items:center;}
.why-icon svg{width:100%; height:100%;}
.why-item h4{color:var(--white); font-size:16px; font-weight:600;}
.why-item p{font-size:13.5px; color:var(--alu-grey);}

/* =========================================================
   SERVICE AREAS
========================================================= */
.areas-section{background:var(--glass-white);}
.areas-wrap{display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;}
.areas-list{display:grid; grid-template-columns:repeat(3,1fr); gap:10px 18px;}
.areas-list li{font-size:14px; color:#454d57; padding:9px 0; border-bottom:1px solid var(--line-light); display:flex; align-items:center; gap:8px;}
.areas-list li svg{width:13px; height:13px; color:var(--steel-blue); flex-shrink:0;}
.areas-photo{aspect-ratio:1; overflow:hidden; position:relative; border:1px solid var(--line-light);}
.areas-photo img{width:100%; height:100%; object-fit:cover;}
.areas-photo .ap-badge{
  position:absolute; bottom:18px; left:18px; background:rgba(16,20,26,0.82); color:var(--white);
  padding:12px 18px; font-family:var(--font-mono); font-size:12px; letter-spacing:0.04em;
}
@media (max-width:860px){.areas-wrap{grid-template-columns:1fr;} .areas-photo{order:-1; max-width:340px; margin:0 auto;}}
@media (max-width:560px){.areas-list{grid-template-columns:1fr 1fr;}}
.areas-wrap-noimg{display:block;}
.areas-list-wide{grid-template-columns:repeat(5,1fr); max-width:1080px; margin:0 auto;}
@media (max-width:900px){.areas-list-wide{grid-template-columns:repeat(3,1fr);}}
@media (max-width:760px){.areas-list-wide{grid-template-columns:repeat(2,1fr);}}

/* =========================================================
   ABOUT
========================================================= */
.about-wrap{display:grid; grid-template-columns:0.95fr 1.05fr; gap:60px; align-items:center;}
.about-photo{position:relative;}
.about-photo img{width:100%; aspect-ratio:4/5; object-fit:cover; border:1px solid var(--line-light);}
.about-badge{
  position:absolute; bottom:-1px; right:-1px; background:var(--anthracite-deep); color:var(--white);
  padding:26px 30px;
}
.about-badge .num{font-family:var(--font-display); font-size:44px; font-weight:700; color:var(--sky); line-height:1;}
.about-badge .lbl{font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--alu-grey-soft); margin-top:6px;}
.about-text p{color:#454d57; font-size:16px; margin-bottom:18px;}
.about-points{margin-top:26px; display:grid; grid-template-columns:1fr 1fr; gap:16px 26px;}
.about-points li{display:flex; align-items:center; gap:10px; font-size:14.5px; font-weight:500; color:var(--anthracite);}
.about-points li svg{width:16px; height:16px; color:var(--steel-blue); flex-shrink:0;}
.about-text .btn{margin-top:30px;}
@media (max-width:860px){.about-wrap{grid-template-columns:1fr;} .about-points{grid-template-columns:1fr;} .about-photo img{aspect-ratio:16/10;}}
.about-wrap-noimg{display:block; max-width:760px; margin:0 auto; text-align:left;}
.about-stat{display:flex; align-items:baseline; gap:12px; margin-bottom:22px;}
.about-stat .num{font-family:var(--font-display); font-size:40px; font-weight:700; color:var(--steel-blue); line-height:1;}
.about-stat .lbl{font-family:var(--font-mono); font-size:11.5px; letter-spacing:0.06em; text-transform:uppercase; color:#7a828c;}

/* =========================================================
   CONTACT
========================================================= */
.contact-section{background:var(--anthracite-deep); color:var(--white);}
.contact-section .section-head h2{color:var(--white);}
.contact-section .section-head p{color:var(--alu-grey-soft);}
.contact-wrap{display:grid; grid-template-columns:1fr 1.1fr; gap:50px;}
@media (max-width:860px){.contact-wrap{grid-template-columns:1fr;} .map-wrap{min-height:300px;} .map-wrap iframe{min-height:300px;}}
.contact-cards{display:grid; gap:2px; background:rgba(255,255,255,0.06);}
.contact-card{background:var(--anthracite-deep); padding:24px 26px; display:flex; gap:18px; align-items:flex-start; transition:background .3s;}
.contact-card:hover{background:#171e28;}
.contact-card .cc-icon{width:22px; height:22px; color:var(--sky); flex-shrink:0; margin-top:2px;}
.contact-card .cc-icon svg{width:100%; height:100%;}
.contact-card h4{font-size:14px; font-family:var(--font-mono); letter-spacing:0.04em; text-transform:uppercase; color:var(--alu-grey); margin-bottom:6px; font-weight:500;}
.contact-card p, .contact-card a{font-size:15.5px; color:var(--white); font-weight:500;}
.map-wrap{border:1px solid rgba(255,255,255,0.1); min-height:380px; position:relative;}
.map-wrap iframe{width:100%; height:100%; min-height:380px; border:0; filter:grayscale(0.3) contrast(1.05);}

/* =========================================================
   FOOTER
========================================================= */
footer{background:#0b0e13; color:var(--alu-grey); padding:56px 0 26px;}
.footer-top{display:flex; flex-wrap:wrap; justify-content:space-between; gap:40px; padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,0.08);}
.footer-brand .logo{margin-bottom:14px;}
.footer-brand p{max-width:320px; font-size:14px; color:#727b86;}
.footer-col h5{font-family:var(--font-mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--alu-grey-soft); margin-bottom:18px;}
.footer-col a, .footer-col p{display:block; font-size:14px; color:#8a929c; margin-bottom:10px;}
.footer-col a:hover{color:var(--sky);}
.footer-social{display:flex; gap:12px; margin-top:6px;}
.footer-social a{width:38px; height:38px; border:1px solid rgba(255,255,255,0.12); display:flex; align-items:center; justify-content:center; transition:.3s;}
.footer-social a:hover{border-color:var(--sky); color:var(--sky);}
.footer-social svg{width:16px; height:16px;}
.footer-bottom{display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; padding-top:24px; font-size:12.5px; color:#5c636c;}
.footer-cols{display:flex; gap:70px; flex-wrap:wrap;}
@media (max-width:640px){.footer-cols{gap:36px 50px;}}

/* =========================================================
   FLOATING WHATSAPP
========================================================= */
.fab-whatsapp{
  position:fixed; bottom:26px; right:26px; z-index:900; width:60px; height:60px; border-radius:50%; background:var(--whatsapp);
  display:flex; align-items:center; justify-content:center; color:var(--white); box-shadow:0 10px 30px rgba(37,211,102,0.4);
  transition:transform .3s var(--ease);
}
.fab-whatsapp:hover{transform:scale(1.08);}
.fab-whatsapp svg{width:28px; height:28px;}
.fab-whatsapp::before{content:''; position:absolute; inset:0; border-radius:50%; background:var(--whatsapp); z-index:-1; opacity:0.55;}
@media (prefers-reduced-motion:no-preference){.fab-whatsapp::before{animation:fab-pulse 2.4s ease-out infinite;}}
@keyframes fab-pulse{0%{transform:scale(1); opacity:0.5;} 100%{transform:scale(1.7); opacity:0;}}
@media (max-width:640px){.fab-whatsapp{width:52px; height:52px; bottom:18px; right:18px;}}

/* =========================================================
   HİZMET SAYFALARI (alt sayfalar) — ek bileşenler
========================================================= */
.page-hero{
  min-height:46vh; display:flex; align-items:flex-end; position:relative; overflow:hidden;
  padding-top:110px; padding-bottom:56px;
  background-size:cover; background-position:center 50%;
}
.page-hero::before{content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(9,12,17,0.55) 0%, rgba(9,12,17,0.86) 100%);}
.page-hero .container{position:relative; z-index:1;}
.breadcrumb{font-family:var(--font-mono); font-size:12px; letter-spacing:.04em; color:var(--sky); margin-bottom:18px;}
.breadcrumb a{color:var(--alu-grey-soft); text-decoration:none; border-bottom:1px dotted rgba(255,255,255,0.3);}
.breadcrumb a:hover{color:var(--white);}
.page-hero h1{color:var(--white); font-family:var(--font-display); font-weight:600; font-size:clamp(30px,4.2vw,52px); line-height:1.08; max-width:760px;}
.page-hero .sub{color:var(--alu-grey-soft); max-width:620px; margin-top:16px; font-size:16.5px; line-height:1.6;}
.feature-list{display:grid; grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); gap:16px; margin-top:32px;}
.feature-item{display:flex; gap:12px; align-items:flex-start; padding:20px; border:1px solid var(--line-light); background:var(--white);}
.feature-item svg{width:20px; height:20px; color:var(--sky); flex-shrink:0; margin-top:2px;}
.feature-item h4{font-size:15.5px; margin-bottom:4px;}
.feature-item p{font-size:13.8px; color:var(--anthracite-soft); line-height:1.55;}
.faq-item{border-bottom:1px solid var(--line-light); padding:20px 0;}
.faq-item summary{cursor:pointer; font-weight:600; font-size:16px; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:'+'; font-size:22px; color:var(--sky); flex-shrink:0; transition:transform .3s;}
.faq-item[open] summary::after{transform:rotate(45deg);}
.faq-item p{margin-top:12px; color:var(--anthracite-soft); font-size:14.5px; line-height:1.65;}
.related-services{display:flex; flex-wrap:wrap; gap:10px; margin-top:24px;}
.related-services a{
  font-family:var(--font-mono); font-size:12.5px; letter-spacing:.03em; padding:9px 16px;
  border:1px solid var(--line-light); color:var(--anthracite); text-decoration:none; transition:.25s;
}
.related-services a:hover{background:var(--anthracite-deep); color:var(--white); border-color:var(--anthracite-deep);}
.mini-gallery{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:18px;
  margin-top:32px;
}
.mini-gallery .gallery-item{
  margin:0;
  break-inside:auto;
  background:#f3f5f7;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
}
.mini-gallery .gallery-item img{
  width:100%;
  height:auto;
  object-fit:contain;
  object-position:center;
  aspect-ratio:auto;
  transform:none;
}
.mini-gallery .gallery-item:hover img{transform:none;}
@media (max-width:640px){
  .mini-gallery{grid-template-columns:1fr; gap:14px;}
}