/* ===== LOCAL FONTS ===== */
@font-face {
  font-family: 'Syne';
  src: url('../fonts/syne-latin-400-normal.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Syne';
  src: url('../fonts/syne-latin-700-normal.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Syne';
  src: url('../fonts/syne-latin-800-normal.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Sans';
  src: url('../fonts/ibm-plex-sans-latin-300-normal.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Sans';
  src: url('../fonts/ibm-plex-sans-latin-400-normal.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Sans';
  src: url('../fonts/ibm-plex-sans-latin-500-normal.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* ===== CSS VARIABLES ===== */
:root {
  --white: #ffffff;
  --light: #f7f9fb;
  --light-2: #edf2f7;
  --ink: #0d1b2a;
  --ink-2: #1e3448;
  --ink-3: #3d5166;
  --muted: #7a8fa0;
  --rule: #dce7ef;
  --teal: #0b7a6e;
  --teal-light: #e0f4f2;
  --teal-mid: #1a9e8f;
  --amber: #e8943a;
  --font-display: 'Syne', sans-serif;
  --font-body: 'IBM Plex Sans', system-ui, sans-serif;
  --transition: 0.28s cubic-bezier(0.4,0,0.2,1);
  --max-w: 1200px;
}

/* ===== RESET ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html{overflow-x:hidden}
body{font-family:var(--font-body);color:var(--ink);background:var(--white);line-height:1.6;overflow-x:hidden;max-width:100vw}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
ul{list-style:none}
button{cursor:pointer;border:none;background:none;font-family:inherit}

/* ===== UTILITIES ===== */
.container{max-width:var(--max-w);margin:0 auto;padding:0 32px}
.section-eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:0.7rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:var(--teal);margin-bottom:18px}
.section-eyebrow::after{content:'';display:block;width:32px;height:2px;background:var(--teal)}
.section-title{font-family:var(--font-display);font-size:clamp(2rem,4vw,3.2rem);font-weight:800;line-height:1.1;color:var(--ink);margin-bottom:20px;letter-spacing:-0.02em}
.section-title em{font-style:normal;color:var(--teal)}
.section-title span{color:var(--amber)}
.section-desc{font-size:0.95rem;color:var(--ink-3);max-width:560px;line-height:1.8}
.section-header{margin-bottom:60px}
.section-header.centered{text-align:center}
.section-header.centered .section-eyebrow{justify-content:center}
.section-header.centered .section-desc{margin:0 auto}

/* ===== BUTTONS ===== */
.btn-primary{display:inline-flex;align-items:center;gap:10px;background:var(--teal);color:#fff;font-size:0.82rem;font-weight:600;letter-spacing:0.04em;padding:14px 28px;border-radius:4px;transition:var(--transition)}
.btn-primary:hover{background:var(--teal-mid)}
.btn-secondary{display:inline-flex;align-items:center;gap:8px;border:2px solid var(--ink);color:var(--ink);font-size:0.82rem;font-weight:600;letter-spacing:0.04em;padding:12px 28px;border-radius:4px;transition:var(--transition)}
.btn-secondary:hover{background:var(--ink);color:#fff}
.btn-outline{display:inline-flex;align-items:center;gap:8px;border:2px solid var(--teal);color:var(--teal);font-size:0.82rem;font-weight:600;letter-spacing:0.04em;padding:12px 28px;border-radius:4px;transition:var(--transition)}
.btn-outline:hover{background:var(--teal);color:#fff}
.btn-ghost{display:inline-flex;align-items:center;gap:8px;color:var(--ink-3);font-size:0.82rem;font-weight:500;padding:12px 0;transition:var(--transition)}
.btn-ghost:hover{color:var(--teal)}
.btn-whatsapp{display:inline-flex;align-items:center;gap:10px;background:#25D366;color:#fff;font-size:0.88rem;font-weight:600;padding:14px 28px;border-radius:4px;transition:var(--transition)}
.btn-whatsapp:hover{background:#1fb557}
.btn-phone{display:inline-flex;align-items:center;gap:10px;border:2px solid rgba(255,255,255,0.35);color:#fff;font-size:0.88rem;font-weight:500;padding:12px 28px;border-radius:4px;transition:var(--transition)}
.btn-phone:hover{border-color:#fff}

/* ===== HEADER ===== */
.site-header{position:fixed;top:0;left:0;right:0;z-index:100;transition:var(--transition)}
.site-header.scrolled{background:rgba(255,255,255,0.97);backdrop-filter:blur(16px);box-shadow:0 1px 0 var(--rule)}
.header-inner{max-width:var(--max-w);margin:0 auto;padding:20px 32px;display:flex;align-items:center;gap:40px}
.logo{flex:1;display:flex;align-items:center;gap:12px}
.logo-mark{width:36px;height:36px;background:var(--teal);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.logo-mark svg{width:20px;height:20px;color:#fff}
.logo-text{}
.logo-main{display:block;font-family:var(--font-display);font-size:1.05rem;font-weight:800;letter-spacing:-0.01em;color:var(--white);transition:color var(--transition)}
.site-header.scrolled .logo-main{color:var(--ink)}
.logo-sub{display:block;font-size:0.6rem;letter-spacing:0.14em;text-transform:uppercase;color:rgba(255,255,255,0.55);margin-top:1px;transition:color var(--transition)}
.site-header.scrolled .logo-sub{color:var(--muted)}
.main-nav{display:flex;gap:32px}
.main-nav a{font-size:0.8rem;font-weight:500;letter-spacing:0.02em;color:rgba(255,255,255,0.8);transition:color var(--transition);position:relative;padding-bottom:2px}
.main-nav a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--teal);transition:width var(--transition)}
.main-nav a:hover{color:var(--white)}
.main-nav a:hover::after{width:100%}
.site-header.scrolled .main-nav a{color:var(--ink-3)}
.site-header.scrolled .main-nav a:hover{color:var(--teal)}
.header-cta{display:flex;align-items:center;gap:8px;background:var(--teal);color:#fff;font-size:0.78rem;font-weight:600;padding:10px 20px;border-radius:4px;transition:var(--transition);white-space:nowrap}
.header-cta:hover{background:var(--teal-mid)}
.hamburger{display:none;flex-direction:column;gap:5px;padding:4px}
.hamburger span{display:block;width:22px;height:2px;background:var(--white);transition:var(--transition)}
.site-header.scrolled .hamburger span{background:var(--ink)}

/* ===== HERO ===== */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;background:var(--ink-2);overflow:hidden;padding:120px 0 80px}
.hero::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--ink) 0%,var(--ink-2) 60%,#0b4a42 100%)}
/* Geometric shapes */
.hero-geo{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hero-geo-1{position:absolute;right:-80px;top:-80px;width:520px;height:520px;border:1px solid rgba(11,122,110,0.15);border-radius:50%}
.hero-geo-2{position:absolute;right:40px;top:40px;width:360px;height:360px;border:1px solid rgba(11,122,110,0.25);border-radius:50%}
.hero-geo-3{position:absolute;right:160px;top:160px;width:200px;height:200px;background:rgba(11,122,110,0.08);border-radius:50%}
.hero-geo-4{position:absolute;left:-100px;bottom:-100px;width:400px;height:400px;border:1px solid rgba(255,255,255,0.04);transform:rotate(45deg)}
.hero-content{position:relative;max-width:var(--max-w);margin:0 auto;padding:0 32px;display:grid;grid-template-columns:1fr 420px;gap:80px;align-items:center}
.hero-tag{display:inline-flex;align-items:center;gap:8px;background:rgba(11,122,110,0.2);border:1px solid rgba(11,122,110,0.35);color:var(--teal-mid);font-size:0.68rem;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;padding:8px 16px;border-radius:100px;margin-bottom:28px;animation:fadeUp 0.6s ease both}
.hero-title{font-family:var(--font-display);font-size:clamp(3rem,6vw,6rem);font-weight:800;line-height:1;color:#fff;letter-spacing:-0.03em;margin-bottom:28px;animation:fadeUp 0.6s 0.1s ease both}
.hero-title .accent{color:var(--teal-mid);display:block}
.hero-title .sub{font-size:0.55em;font-weight:400;color:rgba(255,255,255,0.5);display:block;letter-spacing:0;margin-top:8px}
.hero-desc{font-size:1rem;color:rgba(255,255,255,0.6);max-width:460px;line-height:1.8;margin-bottom:40px;animation:fadeUp 0.6s 0.2s ease both}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;animation:fadeUp 0.6s 0.3s ease both}
/* Hero panel */
.hero-panel{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);backdrop-filter:blur(8px);border-radius:8px;overflow:hidden;animation:fadeUp 0.6s 0.2s ease both}
.hero-panel-header{background:var(--teal);padding:20px 24px;display:flex;align-items:center;gap:10px}
.hero-panel-header span{font-size:0.7rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.85)}
.hero-panel-body{padding:0}
.hero-panel-item{display:flex;align-items:center;gap:16px;padding:18px 24px;border-bottom:1px solid rgba(255,255,255,0.07);transition:background var(--transition)}
.hero-panel-item:last-child{border-bottom:none}
.hero-panel-item:hover{background:rgba(255,255,255,0.04)}
.hero-panel-num{font-family:var(--font-display);font-size:0.75rem;font-weight:800;color:var(--teal-mid);width:24px;flex-shrink:0}
.hero-panel-label{font-size:0.85rem;color:rgba(255,255,255,0.75);flex:1}
.hero-panel-arrow{font-size:0.8rem;color:rgba(255,255,255,0.3)}

/* ===== NUMBERS BAR ===== */
.numbers-bar{background:var(--teal);padding:32px 0}
.numbers-inner{max-width:var(--max-w);margin:0 auto;padding:0 32px;display:grid;grid-template-columns:repeat(4,1fr);gap:1px}
.num-item{text-align:center;padding:8px 24px;border-right:1px solid rgba(255,255,255,0.2)}
.num-item:last-child{border-right:none}
.num-val{font-family:var(--font-display);font-size:2.5rem;font-weight:800;color:#fff;line-height:1;letter-spacing:-0.02em}
.num-val sup{font-size:1rem;font-weight:400}
.num-label{font-size:0.72rem;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.9);margin-top:6px}

/* ===== INTRO ===== */
.intro-section{padding:100px 0;background:var(--white)}
.intro-grid{display:grid;grid-template-columns:5fr 4fr;gap:80px;align-items:center}
.intro-text h2{font-family:var(--font-display);font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:800;color:var(--ink);margin-bottom:24px;letter-spacing:-0.02em;line-height:1.15}
.intro-text h2 em{font-style:normal;color:var(--teal)}
.intro-text p{font-size:0.97rem;color:var(--ink-3);line-height:1.85;margin-bottom:16px}
.intro-cta{margin-top:36px;display:flex;gap:16px;flex-wrap:wrap}
.intro-visual{position:relative}
.intro-card-stack{display:flex;flex-direction:column;gap:1px}
.intro-card{background:var(--light);padding:28px 32px;border-left:3px solid transparent;transition:var(--transition)}
.intro-card:hover{border-left-color:var(--teal);background:var(--white)}
.intro-card-num{font-family:var(--font-display);font-size:0.72rem;font-weight:800;color:var(--teal);margin-bottom:8px;letter-spacing:0.1em}
.intro-card h3{font-family:var(--font-display);font-size:1rem;font-weight:700;color:var(--ink);margin-bottom:4px}
.intro-card p{font-size:0.83rem;color:var(--muted)}

/* ===== HIZMETLER ===== */
.services-section{padding:100px 0;background:var(--ink)}
.services-section .section-eyebrow{color:var(--teal-mid)}
.services-section .section-desc{color:rgba(255,255,255,0.6)}
.services-section .section-eyebrow::after{background:var(--teal-mid)}
.services-section .section-title{color:#fff}
.services-section .section-title em{color:var(--teal-mid)}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,0.07);margin-bottom:48px}
.service-card{background:var(--ink);padding:44px 36px;position:relative;overflow:hidden;transition:background var(--transition)}
.service-card:hover{background:var(--ink-2)}
.service-card-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:24px}
.service-card-icon{width:44px;height:44px;background:rgba(11,122,110,0.15);border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--teal-mid)}
.service-card-icon svg{width:22px;height:22px}
.service-card-num{font-family:var(--font-display);font-size:0.7rem;font-weight:800;color:rgba(255,255,255,0.15);letter-spacing:0.1em}
.service-card h3{font-family:var(--font-display);font-size:1.15rem;font-weight:700;color:#fff;margin-bottom:12px;letter-spacing:-0.01em}
.service-card p{font-size:0.85rem;color:rgba(255,255,255,0.45);line-height:1.75;margin-bottom:24px}
.service-card-link{font-size:0.78rem;font-weight:600;color:var(--teal-mid);display:inline-flex;align-items:center;gap:6px;transition:gap var(--transition)}
.service-card:hover .service-card-link{gap:10px}
.services-cta-row{display:flex;justify-content:center}

/* ===== SÜREÇ ===== */
.process-section{padding:100px 0;background:var(--light)}
.process-timeline{display:grid;grid-template-columns:repeat(4,1fr);position:relative;gap:0;margin-top:60px}
.process-timeline::before{content:'';position:absolute;top:32px;left:12.5%;right:12.5%;height:2px;background:var(--rule)}
.process-step{padding:0 24px;text-align:center;position:relative}
.process-dot{width:64px;height:64px;border-radius:50%;background:var(--white);border:2px solid var(--rule);display:flex;align-items:center;justify-content:center;margin:0 auto 24px;position:relative;z-index:1;transition:var(--transition)}
.process-step:hover .process-dot{background:var(--teal);border-color:var(--teal)}
.process-dot-num{font-family:var(--font-display);font-size:1rem;font-weight:800;color:var(--ink-3);transition:color var(--transition)}
.process-step:hover .process-dot-num{color:#fff}
.process-step h3{font-family:var(--font-display);font-size:1rem;font-weight:700;color:var(--ink);margin-bottom:10px;letter-spacing:-0.01em}
.process-step p{font-size:0.83rem;color:var(--muted);line-height:1.7}

/* ===== BÖLGELER ===== */
.areas-section{padding:100px 0;background:var(--white)}
.areas-intro{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:end;margin-bottom:48px}
.areas-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.area-card{background:var(--light);padding:24px;border-radius:6px;transition:var(--transition);display:flex;flex-direction:column;gap:4px;border:1px solid transparent}
.area-card:hover{background:var(--teal);border-color:var(--teal);transform:translateY(-2px);box-shadow:0 8px 24px rgba(11,122,110,0.2)}
.area-name{font-family:var(--font-display);font-size:1rem;font-weight:700;color:var(--ink);transition:color var(--transition);letter-spacing:-0.01em}
.area-card:hover .area-name{color:#fff}
.area-sub{font-size:0.72rem;color:var(--muted);transition:color var(--transition)}
.area-card:hover .area-sub{color:rgba(255,255,255,0.7)}
.area-arr{font-size:0.75rem;font-weight:600;color:var(--teal);margin-top:8px;transition:color var(--transition)}
.area-card:hover .area-arr{color:rgba(255,255,255,0.8)}

/* ===== NEDEN BİZ ===== */
.why-section{padding:100px 0;background:var(--ink)}
.why-section .section-eyebrow{color:var(--amber)}
.why-section .section-eyebrow::after{background:var(--amber)}
.why-section .section-title{color:#fff}
.why-section .section-title em{color:var(--teal-mid)}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,0.07)}
.why-card{background:var(--ink);padding:40px 32px;transition:background var(--transition)}
.why-card:hover{background:rgba(255,255,255,0.04)}
.why-card-icon{width:40px;height:40px;margin-bottom:20px;color:var(--teal-mid)}
.why-card-icon svg{width:40px;height:40px}
.why-card h3{font-family:var(--font-display);font-size:0.95rem;font-weight:700;color:#fff;margin-bottom:10px;letter-spacing:-0.01em}
.why-card p{font-size:0.83rem;color:rgba(255,255,255,0.6);line-height:1.75}

/* ===== CTA ===== */
.cta-banner{padding:100px 0;background:var(--teal);position:relative;overflow:hidden}
.cta-banner::before{content:'';position:absolute;right:-100px;top:-100px;width:400px;height:400px;border:1px solid rgba(255,255,255,0.1);border-radius:50%}
.cta-banner::after{content:'';position:absolute;right:50px;top:50px;width:240px;height:240px;border:1px solid rgba(255,255,255,0.15);border-radius:50%}
.cta-inner{position:relative;display:flex;align-items:center;justify-content:space-between;gap:48px}
.cta-text h2{font-family:var(--font-display);font-size:clamp(1.8rem,3.5vw,3rem);font-weight:800;color:#fff;line-height:1.1;margin-bottom:12px;letter-spacing:-0.02em}
.cta-text h2 em{font-style:normal;color:rgba(255,255,255,0.9)}
.cta-text p{color:rgba(255,255,255,0.9);font-size:0.95rem}
.cta-actions{display:flex;gap:12px;flex-shrink:0;flex-wrap:wrap}
.cta-banner .btn-whatsapp{background:#fff;border:2px solid #fff;color:var(--ink)}
.cta-banner .btn-whatsapp:hover{background:#25D366;border-color:#25D366;color:#fff}

/* ===== FAQ ===== */
.faq-section{padding:100px 0;background:var(--white)}
.faq-layout{display:grid;grid-template-columns:5fr 4fr;gap:80px}
.faq-list{display:flex;flex-direction:column}
.faq-item{border-bottom:1px solid var(--rule)}
.faq-item:first-child{border-top:1px solid var(--rule)}
.faq-q{width:100%;text-align:left;font-family:var(--font-display);font-size:1rem;font-weight:700;color:var(--ink);padding:22px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;letter-spacing:-0.01em;cursor:pointer}
.faq-q::after{content:'+';font-size:1.4rem;color:var(--teal);flex-shrink:0;line-height:1;transition:transform var(--transition)}
.faq-item.open .faq-q::after{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height 0.4s ease,padding 0.3s ease}
.faq-item.open .faq-a{max-height:200px;padding-bottom:22px}
.faq-a p{font-size:0.9rem;color:var(--ink-3);line-height:1.8}
.faq-side{padding-top:4px}
.faq-side h3{font-family:var(--font-display);font-size:1.8rem;font-weight:800;color:var(--ink);margin-bottom:16px;line-height:1.15;letter-spacing:-0.02em}
.faq-side h3 em{font-style:normal;color:var(--teal)}
.faq-side p{font-size:0.9rem;color:var(--ink-3);line-height:1.8;margin-bottom:32px}
.faq-contact-box{background:var(--teal-light);border-left:3px solid var(--teal);padding:24px}
.faq-contact-box p{font-size:0.85rem;color:var(--ink-3);margin-bottom:12px}
.faq-contact-box a{font-size:1.1rem;font-family:var(--font-display);font-weight:800;color:var(--teal);display:block}

/* ===== FOOTER ===== */
.site-footer{background:var(--ink);padding:80px 0 0}
.footer-top{display:grid;grid-template-columns:2.5fr 1fr 1fr 1.5fr;gap:60px;padding-bottom:60px;border-bottom:1px solid rgba(255,255,255,0.07)}
.footer-logo-wrap{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.footer-logo-mark{width:32px;height:32px;background:var(--teal);display:flex;align-items:center;justify-content:center}
.footer-logo-mark svg{width:18px;height:18px;color:#fff}
.footer-logo-text{font-family:var(--font-display);font-size:1.05rem;font-weight:800;color:#fff;letter-spacing:-0.01em}
.footer-brand p{font-size:0.85rem;color:rgba(255,255,255,0.6);line-height:1.7;margin-bottom:24px}
.footer-social{display:flex;gap:12px}
.footer-social a{width:36px;height:36px;border:1px solid rgba(255,255,255,0.15);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.6);border-radius:4px;transition:var(--transition)}
.footer-social a:hover{background:var(--teal);border-color:var(--teal);color:#fff}
.footer-nav h4{font-size:0.65rem;font-weight:600;letter-spacing:0.15em;text-transform:uppercase;color:#26b5a5;margin-bottom:20px}
.footer-nav ul{display:flex;flex-direction:column;gap:10px}
.footer-nav a{font-size:0.85rem;color:rgba(255,255,255,0.6);transition:color var(--transition)}
.footer-nav a:hover{color:#fff}
.footer-contact h4{font-size:0.65rem;font-weight:600;letter-spacing:0.15em;text-transform:uppercase;color:#26b5a5;margin-bottom:20px}
.footer-contact p{margin-bottom:10px}
.footer-contact a{font-size:0.9rem;color:rgba(255,255,255,0.6);transition:color var(--transition)}
.footer-contact a:hover{color:#fff}
.footer-contact p:last-child{font-size:0.82rem;color:rgba(255,255,255,0.6)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:24px 0;font-size:0.73rem;color:rgba(255,255,255,0.6)}

/* ===== WA FLOAT ===== */
.wa-float{position:fixed;bottom:28px;right:28px;z-index:200;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 24px rgba(37,211,102,0.35);transition:transform var(--transition);animation:fadeUp 1s 1s ease both}
.wa-float:hover{transform:scale(1.1)}

/* ===== PAGE HERO ===== */
.page-hero{padding:150px 0 72px;background:var(--ink);position:relative;overflow:hidden}
.page-hero::after{content:'';position:absolute;right:-80px;top:-80px;width:400px;height:400px;border:1px solid rgba(11,122,110,0.1);border-radius:50%}
.page-hero-inner{position:relative;z-index:1}
.page-hero h1{font-family:var(--font-display);font-size:clamp(2.2rem,5vw,4rem);font-weight:800;color:#fff;margin:12px 0 16px;line-height:1.05;letter-spacing:-0.03em}
.page-hero h1 em{font-style:normal;color:var(--teal-mid)}
.page-hero p{color:rgba(255,255,255,0.5);max-width:520px;font-size:0.95rem;line-height:1.8}
.page-breadcrumb{font-size:0.72rem;color:rgba(255,255,255,0.35);margin-bottom:12px;display:flex;align-items:center;gap:8px}
.page-breadcrumb a{color:rgba(255,255,255,0.45);transition:color var(--transition)}
.page-breadcrumb a:hover{color:var(--teal-mid)}

/* ===== INNER PAGES ===== */
.content-section{padding:80px 0;background:var(--white)}
.content-grid{display:grid;grid-template-columns:3fr 2fr;gap:80px;align-items:start}
.content-body h2{font-family:var(--font-display);font-size:2rem;font-weight:800;color:var(--ink);margin-bottom:20px;letter-spacing:-0.02em;line-height:1.15}
.content-body h2 em{font-style:normal;color:var(--teal)}
.content-body p{font-size:0.95rem;color:var(--ink-3);line-height:1.85;margin-bottom:16px}
.content-list{display:flex;flex-direction:column;gap:10px;margin:24px 0 36px}
.content-list li{font-size:0.9rem;color:var(--ink-3);padding-left:20px;position:relative}
.content-list li::before{content:'';position:absolute;left:0;top:8px;width:8px;height:2px;background:var(--teal)}
.side-box{background:var(--light);padding:36px;border-radius:6px}
.side-box-dark{background:var(--ink);padding:40px;border-radius:6px}
.side-box h4{font-family:var(--font-display);font-size:1rem;font-weight:700;color:var(--ink);margin-bottom:16px;letter-spacing:-0.01em}
.side-box-dark h4{color:#fff}
.service-links{display:flex;flex-direction:column;gap:2px}
.service-link-item{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:var(--white);font-size:0.85rem;color:var(--ink-3);border-radius:4px;transition:var(--transition)}
.service-link-item:hover{background:var(--teal);color:#fff}
.service-link-item span{font-size:0.8rem;color:var(--teal)}
.service-link-item:hover span{color:rgba(255,255,255,0.7)}

/* ===== ABOUT ===== */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.about-text h2{font-family:var(--font-display);font-size:2.2rem;font-weight:800;color:var(--ink);margin-bottom:24px;letter-spacing:-0.02em;line-height:1.1}
.about-text h2 em{font-style:normal;color:var(--teal)}
.about-values{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:40px}
.about-value{background:var(--light);padding:24px;border-radius:6px;border-top:3px solid var(--teal)}
.about-value h4{font-family:var(--font-display);font-size:0.9rem;font-weight:700;color:var(--ink);margin-bottom:6px}
.about-value p{font-size:0.82rem;color:var(--muted);line-height:1.6}
.about-nums{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.about-num-card{background:var(--ink);padding:36px;text-align:center}
.about-num-card:nth-child(2){background:var(--teal)}
.about-num-card:nth-child(3){background:var(--teal)}
.about-num-card:nth-child(4){background:var(--ink-2)}
.about-num-val{font-family:var(--font-display);font-size:3rem;font-weight:800;color:#fff;line-height:1;letter-spacing:-0.03em}
.about-num-label{font-size:0.7rem;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.9);margin-top:8px}

/* ===== CONTACT ===== */
.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px}
.contact-info h2{font-family:var(--font-display);font-size:2rem;font-weight:800;color:var(--ink);margin-bottom:20px;letter-spacing:-0.02em}
.contact-info h2 em{font-style:normal;color:var(--teal)}
.contact-items{display:flex;flex-direction:column;gap:20px;margin-top:40px}
.contact-item{display:flex;gap:16px;align-items:flex-start}
.contact-icon{width:44px;height:44px;background:var(--teal-light);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--teal)}
.contact-body h4{font-size:0.72rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.contact-body a,.contact-body p{font-size:0.95rem;color:var(--ink-3);font-weight:500}
.contact-body a:hover{color:var(--teal)}
.contact-cta{background:var(--teal);padding:48px;border-radius:8px}
.contact-cta h3{font-family:var(--font-display);font-size:1.8rem;font-weight:800;color:#fff;margin-bottom:12px;letter-spacing:-0.02em;line-height:1.1}
.contact-cta p{color:rgba(255,255,255,0.7);font-size:0.88rem;line-height:1.75;margin-bottom:28px}
.contact-cta .btn-whatsapp{background:#fff;border:2px solid #fff;color:var(--ink);width:100%;justify-content:center;margin-bottom:10px}
.contact-cta .btn-whatsapp:hover{background:#25D366;border-color:#25D366}
.contact-cta .btn-phone{width:100%;justify-content:center;border-color:rgba(255,255,255,0.25)}

/* ===== DISTRICT PAGE ===== */
.district-layout{display:grid;grid-template-columns:3fr 2fr;gap:64px;align-items:start}

/* ===== ANIMATIONS ===== */
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}

/* ===== RESPONSIVE ===== */
@media(max-width:1024px){
  .hero-content{grid-template-columns:1fr;gap:48px}
  .hero-panel{display:none}
  .numbers-inner{grid-template-columns:repeat(2,1fr)}
  .intro-grid{grid-template-columns:1fr}
  .services-grid{grid-template-columns:1fr 1fr}
  .process-timeline{grid-template-columns:1fr 1fr;gap:32px}
  .process-timeline::before{display:none}
  .areas-intro{grid-template-columns:1fr}
  .areas-grid{grid-template-columns:repeat(3,1fr)}
  .why-grid{grid-template-columns:1fr 1fr}
  .footer-top{grid-template-columns:1fr 1fr;gap:40px}
  .faq-layout{grid-template-columns:1fr}
  .about-grid{grid-template-columns:1fr}
  .contact-layout{grid-template-columns:1fr}
  .content-grid{grid-template-columns:1fr}
  .district-layout{grid-template-columns:1fr}
}
@media(max-width:768px){
  .container{padding:0 20px}
  .main-nav{display:none;position:fixed;inset:0;background:var(--ink);flex-direction:column;align-items:center;justify-content:center;gap:32px;z-index:9999;overflow:hidden}
  .main-nav.open{display:flex}
  .main-nav.open a{color:#fff!important;font-size:1.3rem}
  .main-nav.open a::after{display:none}
  .main-nav a{font-size:1.3rem;font-family:var(--font-display);font-weight:800;color:#fff!important}
  .hamburger{display:flex}
  .header-cta{display:none}
  .services-grid{grid-template-columns:1fr}
  .why-grid{grid-template-columns:1fr}
  .areas-grid{grid-template-columns:1fr 1fr}
  .cta-inner{flex-direction:column;text-align:center}
  .cta-actions{flex-direction:column;width:100%}
  .cta-actions a{justify-content:center}
  .footer-top{grid-template-columns:1fr}
  .about-values{grid-template-columns:1fr}
  .about-nums{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  .areas-grid{grid-template-columns:1fr}
  .numbers-inner{grid-template-columns:1fr 1fr}
  .hero-actions{flex-direction:column}
  .hero-actions a{width:100%;justify-content:center}
}

/* Mobile menu close button */
.nav-close{display:none;position:fixed;top:24px;right:24px;width:44px;height:44px;align-items:center;justify-content:center;color:#fff;cursor:pointer;background:none;border:none;font-size:1.8rem;line-height:1;z-index:10000}
@media(max-width:768px){
  .nav-close{display:flex}
}