:root { --navy:#17213f; --ink:#1c2440; --muted:#687189; --paper:#f7f7f4; --teal:#22a9d1; --line:#dfe2e4; --serif:Georgia, 'Times New Roman', serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--paper); font-family:'DM Sans',sans-serif; } .container { width:min(1180px, calc(100% - 72px)); margin:auto; }
.site-header { position:fixed; z-index:30; top:0; width:100%; } .nav-wrap { display:flex; align-items:center; justify-content:space-between; height:110px; border-bottom:1px solid rgba(23,33,63,.16); } .brand img { display:block; width:168px; height:auto; mix-blend-mode:multiply; } .main-nav { display:flex; align-items:center; gap:38px; font-size:13px; font-weight:600; } a { color:inherit; text-decoration:none; } .main-nav a { transition:color .2s; } .main-nav a:hover { color:var(--teal); } .nav-contact { display:flex; align-items:center; gap:12px; padding-left:28px; border-left:1px solid rgba(23,33,63,.2); } .nav-contact span, .button span { font-size:18px; } .menu-toggle { display:none; }
.hero { min-height:700px; padding:170px 0 30px; background:linear-gradient(110deg,#e9edf0 0%,#f7f7f4 62%); overflow:hidden; } .hero-grid { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:80px; } .eyebrow,.section-label { color:var(--teal); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; } .eyebrow { display:flex; gap:10px; align-items:center; } .eyebrow span { width:28px; height:2px; background:var(--teal); } h1,h2,h3,p { margin-top:0; } h1,h2 { font-family:'Space Grotesk',sans-serif; letter-spacing:-.05em; } h1 { max-width:590px; margin:28px 0 24px; font-size:clamp(48px,6vw,78px); line-height:1.03; font-weight:600; } h1 em,h2 em { color:var(--teal); font-family:var(--serif); font-weight:400; } .hero-text { max-width:460px; margin-bottom:34px; color:var(--muted); font-size:16px; line-height:1.7; } .button { display:inline-flex; align-items:center; justify-content:space-between; gap:44px; min-width:190px; padding:17px 20px; font-size:13px; font-weight:700; transition:transform .2s,background .2s; } .button:hover { transform:translateY(-3px); } .button-dark { color:white; background:var(--navy); } .button-light { color:var(--navy); background:white; }
.hero-art { position:relative; height:450px; overflow:hidden; border-radius:6px; background:var(--navy); box-shadow:0 40px 80px -30px rgba(16,24,50,.45); } .hero-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:28% 62%; display:block; }
@keyframes draw-line { to { stroke-dashoffset:0; } }
@keyframes pulse-dot { 0%,100% { transform:scale(1); opacity:1; } 50% { transform:scale(1.6); opacity:.6; } }
@keyframes float-dot { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-14px); } }
.hero-foot { display:flex; justify-content:flex-end; margin-top:80px; color:#81899a; font-size:11px; letter-spacing:.04em; text-transform:uppercase; } .scroll-mark { color:var(--ink); transition:color .2s; } .scroll-mark:hover { color:var(--teal); } .scroll-mark b { display:inline-block; padding-left:10px; color:var(--teal); font-size:18px; transition:transform .2s; } .scroll-mark:hover b { transform:translateY(3px); }
.hero-actions { display:flex; align-items:center; gap:32px; flex-wrap:wrap; margin-bottom:36px; } .link-inline { display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:700; color:var(--navy); } .link-inline span { font-size:15px; color:var(--teal); }
.trust-pills { display:flex; flex-wrap:wrap; gap:10px; } .trust-pills span, .trust-pills a { padding:9px 16px; border:1px solid rgba(23,33,63,.18); border-radius:999px; color:var(--navy); font-size:12px; font-weight:600; background:rgba(255,255,255,.5); transition:border-color .2s,background .2s,color .2s; } .trust-pills a:hover { border-color:var(--teal); color:var(--teal); background:white; }
.stat-strip { padding:38px 0; background:var(--navy); } .stat-strip-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; } .stat-strip-grid div { display:flex; flex-direction:column; align-items:flex-start; gap:7px; padding:0 28px; border-left:1px solid rgba(255,255,255,.15); } .stat-strip-grid div:first-child { border-left:0; padding-left:0; } .stat-strip-grid strong { font:600 26px 'Space Grotesk'; color:#71c8de; white-space:nowrap; letter-spacing:-.03em; } .stat-strip-grid span { color:#bcc6d4; font-size:12px; line-height:1.4; }

.intro { padding:145px 0; } .intro-grid { display:grid; grid-template-columns:28% 1fr; gap:50px; } h2 { margin-bottom:28px; font-size:clamp(42px,5vw,68px); line-height:1.05; font-weight:600; } h2 span { color:#8a94a2; } .large-copy { max-width:510px; color:var(--muted); font-size:20px; line-height:1.65; }
.approach-points { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:56px; max-width:720px; } .approach-points strong { display:block; margin-bottom:10px; font:600 16px 'Space Grotesk'; color:var(--navy); } .approach-points p { margin:0; color:var(--muted); font-size:13px; line-height:1.6; }
.services { padding:115px 0 140px; background:#e9edf0; } .section-heading { display:flex; align-items:end; justify-content:space-between; margin-bottom:60px; } .section-heading h2 { margin-bottom:0; } .heading-note { max-width:260px; margin:0 0 5px; color:var(--muted); font-size:14px; line-height:1.6; }.service-list { border-top:1px solid #c9d0d5; }.service-item { display:grid; grid-template-columns:90px 1fr 45px; align-items:start; gap:22px; padding:28px 0; border-bottom:1px solid #c9d0d5; scroll-margin-top:90px; }.service-no { padding-top:6px; color:var(--teal); font-size:12px; font-weight:700; }.service-item h3 { margin:0 0 8px; font:600 26px 'Space Grotesk'; letter-spacing:-.04em; }.service-item p { margin:0; color:var(--muted); font-size:14px; }.service-item>a { padding-top:2px; font-size:25px; text-align:right; transition:color .2s,transform .2s; }.service-item>a:hover { color:var(--teal); transform:translate(3px,-3px); }
.service-toggle { display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; padding:0; border:0; background:none; font:inherit; color:inherit; text-align:left; cursor:pointer; }
.service-toggle:hover, .service-toggle[aria-expanded="true"] { color:var(--teal); }
.service-plus { position:relative; width:14px; height:14px; flex:none; }
.service-plus::before,.service-plus::after { content:''; position:absolute; top:50%; left:50%; background:var(--teal); border-radius:1px; transition:transform .25s ease; }
.service-plus::before { width:14px; height:2px; transform:translate(-50%,-50%); }
.service-plus::after { width:2px; height:14px; transform:translate(-50%,-50%); }
.service-toggle[aria-expanded="true"] .service-plus::after { transform:translate(-50%,-50%) scaleY(0); }
.service-tag-btn { padding:0; border:0; background:none; font:inherit; color:inherit; cursor:pointer; }
.service-tag-btn:hover, .service-tag-btn[aria-expanded="true"] { color:var(--teal); }
.service-item>div { cursor:pointer; }
.service-panel { display:grid; grid-template-rows:0fr; transition:grid-template-rows .35s ease; cursor:auto; }
.service-panel.is-open { grid-template-rows:1fr; }
.service-panel-inner { overflow:hidden; }
.service-desc { padding-top:24px; }
.service-desc h4 { margin:0 0 10px; font:600 16px 'Space Grotesk'; color:var(--navy); letter-spacing:-.01em; }
.sectors { padding:130px 0; } .sector-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:#dfe2e4; border:1px solid #dfe2e4; } .sector-card { padding:32px 26px; background:var(--paper); transition:background .25s; } .sector-card:hover { background:#eef4f6; } .sector-card span { color:var(--teal); font-size:12px; font-weight:700; } .sector-card h3 { margin:14px 0 10px; font:600 18px 'Space Grotesk'; letter-spacing:-.02em; } .sector-card p { margin:0; color:var(--muted); font-size:13px; line-height:1.55; }
.sector-decor { position:relative; grid-column:span 2; min-height:190px; padding:28px 26px; overflow:hidden; background:var(--navy); color:white; display:flex; align-items:flex-end; transition:transform .2s; }
.sector-decor:hover { transform:translateY(-3px); }
.sector-decor-svg { position:absolute; inset:0; width:100%; height:100%; opacity:.9; }
.sector-decor-line { stroke-dasharray:700; stroke-dashoffset:700; animation:draw-line 1.8s ease-out .3s both; }
.sector-decor-dot { animation:pulse-dot 2.4s ease-in-out 1.6s infinite; transform-origin:275px 46px; }
.sector-decor-particles circle { animation:float-dot 5s ease-in-out infinite; }
.sector-decor-particles circle:nth-child(2) { animation-delay:1.1s; }
.sector-decor-particles circle:nth-child(3) { animation-delay:2.2s; }
.sector-decor-copy { position:relative; z-index:1; display:block; max-width:280px; }
.sector-decor-copy strong { display:block; margin-bottom:6px; font:600 16px 'Space Grotesk'; }
.sector-decor-copy em { display:flex; align-items:center; gap:8px; color:#bcc6d4; font-size:12.5px; font-style:normal; line-height:1.55; }
.sector-decor-copy em b { color:#71c8de; font-size:15px; transition:transform .2s; }
.sector-decor:hover .sector-decor-copy em b { transform:translate(3px,-3px); }

.site-header.is-static { position:sticky; background:var(--paper); }
.article-page { padding:64px 0 0; }
.article-head { max-width:760px; margin:0 auto 46px; }
.article-back { display:inline-flex; align-items:center; gap:8px; margin-bottom:26px; color:var(--muted); font-size:13px; font-weight:600; transition:color .2s; }
.article-back:hover { color:var(--teal); }
.article-head h1 { margin:14px 0 18px; font-size:clamp(32px,5vw,50px); line-height:1.12; }
.article-lead { max-width:640px; color:var(--muted); font-size:18px; line-height:1.6; }
.article-body { max-width:760px; margin:0 auto; padding-bottom:70px; color:#3a4258; font-size:16px; line-height:1.8; }
.article-body h2 { margin:44px 0 16px; font-size:25px; letter-spacing:-.03em; color:var(--ink); }
.article-body p { margin:0 0 20px; }
.article-body ul { margin:0 0 24px; padding-left:20px; }
.article-body li { margin-bottom:8px; }
.article-cta { max-width:760px; margin:0 auto 100px; padding-top:28px; border-top:1px solid #e3e6e8; }
@media (max-width:760px) { .article-page { padding:44px 0 0; } .article-head { margin-bottom:32px; } .article-body { font-size:15px; } .article-body h2 { font-size:22px; } .article-cta { margin-bottom:70px; } .jump-nav { right:16px; bottom:16px; } }

.jump-nav { position:fixed; right:24px; bottom:24px; z-index:40; }
.jump-nav-toggle { width:48px; height:48px; border:0; border-radius:50%; background:var(--navy); color:white; font-size:18px; line-height:1; cursor:pointer; box-shadow:0 10px 24px -8px rgba(16,24,50,.5); opacity:0; transform:translateY(10px); pointer-events:none; transition:opacity .25s,transform .25s,background .2s; }
.jump-nav.is-visible .jump-nav-toggle { opacity:1; transform:none; pointer-events:auto; }
.jump-nav-toggle:hover { background:var(--teal); }
.jump-nav-menu { position:absolute; right:0; bottom:60px; min-width:190px; padding:8px; background:var(--paper); border:1px solid #dfe2e4; border-radius:10px; box-shadow:0 20px 40px -16px rgba(16,24,50,.35); opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .2s,transform .2s,visibility .2s; }
.jump-nav.is-open .jump-nav-menu { opacity:1; visibility:visible; transform:none; }
.jump-nav-menu a { display:block; padding:9px 12px; border-radius:6px; color:var(--ink); font-size:13px; font-weight:600; transition:background .15s,color .15s; }
.jump-nav-menu a:first-child { margin-bottom:4px; padding-bottom:12px; border-bottom:1px solid #e7eaec; border-radius:6px 6px 0 0; color:var(--teal); }
.jump-nav-menu a:hover { background:#eef4f6; color:var(--teal); }

.insights { padding:130px 0; background:#e9edf0; } .insight-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; } .insight-card { display:flex; flex-direction:column; gap:14px; padding:34px; background:var(--paper); border:1px solid #d7dcdf; } .insight-tag { align-self:flex-start; padding:5px 12px; border-radius:999px; background:rgba(34,169,209,.12); color:var(--teal); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; } .insight-card h3 { margin:0; font:600 21px 'Space Grotesk'; letter-spacing:-.03em; line-height:1.25; } .insight-card p { margin:0; color:var(--muted); font-size:13px; line-height:1.6; flex-grow:1; } .insight-card a { display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:700; color:var(--navy); } .insight-card a span { color:var(--teal); transition:transform .2s; } .insight-card a:hover span { transform:translate(3px,-3px); }

.career { padding:130px 0; background:var(--teal); } .career-inner { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; } .career h2 { color:white; } .career h2 em { color:var(--navy); font-style:normal; } .career-copy p { max-width:420px; margin:0 0 30px; color:rgba(16,24,50,.75); font-size:16px; line-height:1.65; }

.about { padding:140px 0; background:var(--navy); color:white; }.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:100px; }.about .section-label { color:#71c8de; }.about h2 { font-size:clamp(46px,5vw,72px); }.about h2 em { color:#71c8de; }.about-copy { padding-top:50px; }.about-copy>p { max-width:440px; color:#bcc6d4; font-size:20px; line-height:1.65; }.kgk-link { margin-top:48px; }
.contact { padding:125px 0; background:var(--teal); }.contact-inner { text-align:center; }.contact .section-label { color:var(--navy); }.contact h2 { margin:22px 0 36px; color:white; font-size:clamp(48px,6vw,84px); }.contact h2 em { color:var(--navy); }.contact .button { text-align:left; }
footer { padding:54px 0 26px; background:#111932; color:white; }.footer-grid { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:20px; }.footer-brand img { width:155px; height:auto; }.footer-grid p,.footer-grid div { color:white; font-size:12px; }.footer-grid div { display:flex; justify-content:flex-end; gap:22px; }.footer-grid div a:hover { color:#71c8de; }.footer-bottom { display:flex; justify-content:space-between; margin-top:50px; padding-top:20px; border-top:1px solid rgba(255,255,255,.15); color:white; font-size:11px; }
.service-item p { max-width:620px; }
.service-item ul { display:flex; flex-wrap:wrap; gap:8px 24px; margin:16px 0 0; padding:0; color:var(--ink); font-size:12px; list-style:none; }
.service-item li::before { content:'+'; padding-right:6px; color:var(--teal); font-weight:700; }
.contact-details { display:flex; justify-content:center; gap:42px; margin-top:44px; color:white; font-size:13px; line-height:1.6; text-align:left; }
.contact-details a, .contact-details span { font-weight:700; }
.reveal { animation:rise .8s both; }.hero-art { animation-delay:.15s; } @keyframes rise { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:none; } }
.reveal-on-scroll { opacity:0; transform:translateY(30px); transition:opacity .7s ease-out,transform .7s cubic-bezier(.22,1,.36,1); }
.reveal-on-scroll.in-view { opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce) { .reveal-on-scroll { opacity:1; transform:none; transition:none; } }
@media (max-width:760px) { .container { width:min(100% - 40px,520px); }.nav-wrap { height:82px; }.brand img { width:142px; }.menu-toggle { display:flex; flex-direction:column; gap:5px; padding:10px 0 10px 10px; border:0; background:transparent; cursor:pointer; }.menu-toggle span { display:block; width:25px; height:2px; background:var(--navy); }.main-nav { position:absolute; top:82px; left:0; right:0; display:none; flex-direction:column; align-items:flex-start; gap:0; padding:16px 20px 22px; background:var(--paper); box-shadow:0 12px 20px rgba(23,33,63,.08); }.main-nav.is-open { display:flex; }.main-nav a { width:100%; padding:12px 0; }.nav-contact { padding:12px 0; border-left:0; }.hero { min-height:auto; padding:130px 0 28px; }.hero-grid,.intro-grid,.about-grid { grid-template-columns:1fr; gap:45px; }.hero-art { height:290px; }.hero-foot { margin-top:55px; }.scroll-mark { display:flex; align-items:center; }.intro { padding:90px 0; }.large-copy { font-size:18px; }.services { padding:85px 0; }.section-heading { display:block; margin-bottom:40px; }.heading-note { margin-top:22px; }.service-item { grid-template-columns:35px 1fr 25px; gap:10px; }.service-item h3 { font-size:21px; }.service-item p { font-size:13px; line-height:1.5; }.service-desc { padding-top:18px; }.about { padding:90px 0; }.about-copy { padding-top:0; }.kgk-link { margin-top:34px; }.contact { padding:90px 0; }.contact h2 { font-size:47px; }.contact-details { flex-direction:column; align-items:center; gap:16px; margin-top:34px; text-align:center; }.footer-grid { grid-template-columns:1fr; gap:20px; }.footer-grid div { justify-content:flex-start; flex-wrap:wrap; }.footer-bottom { gap:15px; flex-direction:column; margin-top:35px; }.hero-art { height:260px; }.hero-actions { gap:20px; margin-bottom:28px; }.stat-strip-grid { grid-template-columns:repeat(2,1fr); gap:24px 16px; }.stat-strip-grid div { border-left:0; padding:0; }.approach-points { grid-template-columns:1fr; gap:24px; margin-top:36px; }.sectors { padding:80px 0; }.sector-grid { grid-template-columns:repeat(2,1fr); }.insights { padding:80px 0; }.insight-grid { grid-template-columns:1fr; gap:18px; }.career { padding:80px 0; }.career-inner { grid-template-columns:1fr; gap:30px; } }
@media (min-width:761px) {
  main > section:not(.stat-strip) { min-height:100vh; min-height:100svh; display:flex; flex-direction:column; justify-content:center; }
  .hero-grid { flex:1; align-content:center; }
}

/* Üst menü aşağı kaydırılınca sabit kalır; arka plan ve gölge kazanıp incelir. */
html { scroll-padding-top:76px; }
.site-header { transition:background .25s,box-shadow .25s; } .nav-wrap { transition:height .25s,border-color .25s; } .brand img { transition:width .25s; }
.site-header.is-scrolled { background:var(--paper); box-shadow:0 12px 30px -20px rgba(16,24,50,.45); }
.site-header.is-scrolled .nav-wrap { height:76px; border-bottom-color:transparent; }
.site-header.is-scrolled .brand img { width:132px; }
@media (max-width:760px) { .main-nav { top:100%; } .site-header.is-scrolled .nav-wrap { height:66px; } .site-header.is-scrolled .brand img { width:118px; } }

/* Masaüstünde hero + istatistik şeridi birlikte tam bir ekran yüksekliği. */
@media (min-width:761px) {
  .first-screen { display:flex; flex-direction:column; min-height:100vh; min-height:100svh; }
  .first-screen .hero { position:relative; flex:1; display:flex; flex-direction:column; min-height:0; padding:calc(110px + clamp(10px,3vh,48px)) 0 clamp(16px,3vh,40px); }
  .hero h1 { font-size:clamp(44px,min(6vw,7.8vh),78px); margin:clamp(14px,2.4vh,28px) 0 clamp(12px,2.2vh,24px); }
  .hero-text { margin-bottom:clamp(18px,3vh,34px); }
  .hero-actions { margin-bottom:clamp(18px,3.2vh,36px); }
  .hero-art { height:clamp(300px,50vh,450px); }
  .hero-foot { position:absolute; left:0; right:0; bottom:clamp(12px,2.2vh,26px); margin:0 auto; }
  .stat-strip { padding:clamp(22px,3.6vh,38px) 0; }
}
@media (min-width:761px) and (max-width:1100px) {
  .hero-grid { gap:44px; }
  .hero h1 { font-size:clamp(40px,min(5.2vw,7.8vh),78px); }
  .hero-text { font-size:15px; line-height:1.6; }
}
