/* STANDARDIZED GLOBAL RESET */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-tap-highlight-color: transparent;
}
/* Kill any stray horizontal overflow globally */
html, body {overflow-x: hidden}

html {
  scroll-behavior: smooth;
  scroll-padding-top: var(--header-height);
  -webkit-text-size-adjust: 100%;
  height: 100%;
  scrollbar-gutter: stable both-edges; /* prevent layout shift from scrollbar */
  overflow-y: scroll; /* reserve scrollbar width across platforms */
}

/* Fallback for browsers without scrollbar-gutter support */
@supports not (scrollbar-gutter: stable) {
  html { overflow-y: scroll; }
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
  background: #000;
  color: #f0f0f0;
  min-height: 100vh;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight: 400;
  letter-spacing: -0.01em;
  overflow-x: hidden;
  position: relative;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
}

/* Prevent any full-width element from causing horizontal scroll */
img, video, .snap-section, .section-inner, .hero, header, footer{max-width:100%}
.page-index #hero .hero-bg, .page-index #hero .hero-bg canvas{max-width:none !important}
*:not(svg):not(path){box-sizing:border-box}

/* STANDARDIZED GLOBAL VARIABLES - TÜM SAYFALAR İÇİN AYNI */
:root {
  --black: #000;
  --white: #f0f0f0;
  --accent: #6b7280;
  --accent-fade: rgba(107,114,128,.45);
  --accent-light: #9ca3af;
  --accent-dark: #4b5563;
  --card-bg: rgba(255,255,255,.05);
  --divider: rgba(255,255,255,.1);
  --font-heading: 'Plus Jakarta Sans', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
  --header-height: 45px;
  --container-padding: 0.375rem;
  --footer-min-height: 340px;
  --footer-gap: 3.5rem;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

p {
  line-height: 1.7;
  letter-spacing: -0.01em;
  color: #c9c9c9; /* improved readability on dark bg */
}

a {
  color: inherit;
  text-decoration: none;
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
a::after {
  display: none !important;
}
header a::after, nav a::after, .logo a::after {
  display: none !important;
  content: none !important;
}

@media (hover: hover) {
  a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 0;
    height: 2px;
    background: var(--accent);
    transition: .3s;
  }
  a:hover::after {
    width: 100%;
  }
}

img {
  max-width: 100%;
  height: auto;
  display: block;
  user-select: none;
}

/* ===== BUTTONS - WORLD STANDARDS ===== */
/* Base button: consistent sizing, alignment, and motion */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  font-weight:600;
  border-radius:999px;
  padding:.9rem 1.6rem;
  line-height:1;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  transition: background .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease, transform .06s ease;
}
.btn:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(185,28,28,.35)}
.btn:active{transform:translateY(.5px) scale(.99)}
.btn[disabled], .btn.disabled, .btn:disabled{opacity:.6;pointer-events:none}
.btn-primary {
  border: 1px solid rgba(240,240,240,.3);
  background: linear-gradient(180deg, #f8f8f8 0%, #f0f0f0 100%);
  color: #0f0f0f;
  padding: .4rem .8rem;
  border-radius: 6px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .08s ease;
  font-family: var(--font-body);
  font-size: .8rem;
  letter-spacing: -0.01em;
  min-height: 28px;
  min-width: 80px;
  touch-action: manipulation;
  box-shadow: 0 2px 10px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.6);
}

@media (min-width: 768px) {
  .btn-primary {
    padding: .45rem .9rem;
    font-size: .8rem;
  }
}

.btn-primary:hover {
  background: linear-gradient(180deg, #ffffff 0%, #f6f6f6 100%);
  color: #0a0a0a;
  border-color: rgba(240,240,240,.6);
  box-shadow: 0 8px 22px rgba(0,0,0,.28), 0 2px 10px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.8);
  transform: translateY(-2px) scale(1.01);
}

.btn-secondary{
  border:1px solid rgba(255,255,255,.6);
  background:transparent;
  color:#fff;
  border-radius:999px;
}
.btn-secondary:hover{background:rgba(255,255,255,.08);border-color:#fff}

.btn-outline{border:1px solid rgba(255,255,255,.6);background:transparent;color:#fff;border-radius:999px}
.btn-outline:hover{background:rgba(255,255,255,.08);border-color:#fff}

.btn-sm{padding:.6rem 1.1rem;min-height:36px;font-size:.92rem}
.btn-lg{padding:1.1rem 2.2rem;min-height:52px;font-size:1.02rem}

.btn-primary:hover::after {
  width: 0;
}

.btn-primary:active {
  transform: translateY(0) scale(.995);
  box-shadow: 0 2px 8px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.55);
}

.btn-primary:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px rgba(185,28,28,.4), 0 4px 12px rgba(0,0,0,.15);
}

/* ===== MAIN CONTENT - PROFESSIONAL LAYOUT ===== */
main {padding-top:calc(var(--header-height) + 3rem);padding-left:var(--container-padding);padding-right:var(--container-padding);max-width:1200px;margin:0 auto;flex:1 0 auto;padding-bottom:var(--footer-gap)}

/* Ensure consistent space above footer regardless of last element margins */
main > *:last-child { margin-bottom: 0 !important; }
/* Hard align main content to viewport edges on desktop */
@media (min-width: 1024px){
  main{padding-left:0;padding-right:0}
}

@media (max-width: 768px){main{padding-top:calc(var(--header-height) + 2rem);padding-left:1rem;padding-right:1rem}}

@media (max-width: 480px){main{padding-top:calc(var(--header-height) + 1.5rem);padding-left:.75rem;padding-right:.75rem}}

/* ===== HEADER - ABSOLUTELY FIXED, NO MOVEMENT ===== */
header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: var(--header-height) !important;
  z-index: 1000 !important;
  background: rgba(0,0,0,.95) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border-bottom: 1px solid rgba(255,255,255,.1) !important;
  transition: none !important;
  transform: none !important;
  padding-left: .125rem;
}

.nav{max-width:1200px;margin:0 auto;padding:0 var(--container-padding);display:flex;justify-content:space-between;align-items:center;height:100%;gap:1rem}

@media (min-width: 768px) {
.nav {
    gap: 2rem;
  }
}

@media (min-width: 992px) {
  .nav {
    gap: 3rem;
  }
}

@media (min-width: 1200px) {
  .nav {
    gap: 4rem;
  }
}
nav ul {
  margin-top: 2px;
}

/* Active nav minimal underline */
nav li a.active, nav li a[aria-current="page"] {
  position: relative;
}
nav li a.active::after, nav li a[aria-current="page"]::after {
  content: "";
  position: absolute; left: 0; bottom: -2px; height: 2px; width: 100%;
  background: var(--accent);
}

.logo img {
  width: 90px;
  height: auto;
  margin-top: 6px;
}

.mobile-menu-toggle {
  display: block;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  z-index: 1001;
  position: relative;
}

.hamburger {
  display: block;
  position: relative;
  width: 28px;
  height: 24px;
}

.hamburger span {
  display: block;
  position: absolute;
  height: 2px;
  width: 100%;
  background: var(--white);
  border-radius: 2px;
  opacity: 1;
  left: 0;
  transform: rotate(0deg);
  transition: .25s ease-in-out;
}

.hamburger span:nth-child(1) {
  top: 0;
}

.hamburger span:nth-child(2) {
  top: 11px;
}

.hamburger span:nth-child(3) {
  top: 22px;
}

.mobile-menu-toggle.active .hamburger span:nth-child(1) {
  top: 11px;
  transform: rotate(135deg);
}

.mobile-menu-toggle.active .hamburger span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

.mobile-menu-toggle.active .hamburger span:nth-child(3) {
  top: 11px;
  transform: rotate(-135deg);
}

nav ul {
  position: fixed;
  top: var(--header-height);
  right: -100%;
  width: 80%;
  max-width: 320px;
  height: calc(100vh - var(--header-height));
  background: rgba(0,0,0,.98);
  backdrop-filter: blur(10px);
  list-style: none;
  display: flex;
  flex-direction: column;
  padding: 2rem 0;
  gap: 0;
  transition: right 0.3s ease-in-out;
  overflow-y: auto;
  box-shadow: -5px 0 15px rgba(0,0,0,.3);
}

nav ul.active {
  right: 0;
}

nav li {
  opacity: 0;
  transform: translateX(20px);
  transition: all 0.3s ease-in-out;
}

nav ul.active li {
  opacity: 1;
  transform: translateX(0);
}

nav ul.active li:nth-child(1) { transition-delay: 0.1s; }
nav ul.active li:nth-child(2) { transition-delay: 0.15s; }
nav ul.active li:nth-child(3) { transition-delay: 0.2s; }
nav ul.active li:nth-child(4) { transition-delay: 0.25s; }
nav ul.active li:nth-child(5) { transition-delay: 0.3s; }
nav ul.active li:nth-child(6) { transition-delay: 0.35s; }
nav ul.active li:nth-child(7) { transition-delay: 0.4s; }

nav li a {
  display: block;
  padding: 1rem 2rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-size: 0.9rem;
  border-bottom: none;
  transition: all 0.3s;
}

nav li a:active {
  background: rgba(255,255,255,.05);
}

body.menu-open {
  overflow: hidden;
}

.mobile-menu-overlay {
  position: fixed;
  top: var(--header-height);
  left: 0;
  width: 100%;
  height: calc(100vh - var(--header-height));
  background: rgba(0,0,0,.5);
  display: none;
  z-index: 999;
}

.mobile-menu-overlay.active {
  display: block;
}

@media (min-width: 768px) {
  .logo img {
    width: 140px;
  }
  
  .mobile-menu-toggle {
    display: none;
  }
  
  .mobile-menu-overlay {
    display: none !important;
  }
  
  nav ul {
    position: static;
    width: auto;
    max-width: none;
    height: var(--header-height);
    background: none;
    backdrop-filter: none;
    flex-direction: row;
    align-items: center; /* vertically center menu items within header */
    padding: 0;
    gap: 1.5rem;
    transition: none;
    overflow: visible;
    box-shadow: none;
  }
  /* Slight visual lowering without breaking header layout */
  nav ul { padding-top: 3px; }
  
  nav li {
    opacity: 1;
    transform: none;
  }
  
  nav li a {
    padding: 0 0.8rem;
    border-bottom: none;
    font-size: 0.8rem;
    line-height: 1;
    height: var(--header-height);
    display: flex;
    align-items: center;
  }
  
  nav li a:hover {
    color: var(--accent-light);
    background: none;
  }
  
  body.menu-open {
    overflow: auto;
    position: static;
  }
}

@media (min-width: 992px) {
  .logo img {
    width: 108px;
  }
  nav ul {
    gap: 1.1rem;
  }
  nav li a {
    padding: 0.5rem 0;
  }
  nav li.nav-contact {
    margin-left: -0.8rem;
  }
  nav li a:hover {
    text-decoration: none !important;
  }
  .logo a:hover {
    text-decoration: none !important;
    border-bottom: none !important;
  }
}

/* Hero Section */
.hero {
  min-height: 100vh;
  padding: calc(var(--header-height) + 3rem) 0 3rem; /* remove horizontal padding to avoid side gaps */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: #000;
  position: relative;
}

.hero h1 {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: clamp(2rem, 6vw, 4.5rem);
  letter-spacing: -0.03em;
  line-height: 1.1;
  margin-bottom: 1.6rem;
}

.hero p {
  max-width: 100%;
  color: #b3b3b3;
  margin-bottom: 2rem;
  font-size: 1rem;
  line-height: 1.7;
  letter-spacing: -0.01em;
  font-weight: 400;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 768px) {
  .hero{padding:9rem var(--container-padding) 6rem}
  .hero h1 {
    margin-bottom: 1.8rem;
  }
  .hero p {
    max-width: 720px;
    font-size: 1.125rem;
    margin-bottom: 2.5rem;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Homepage hero – subtle animated background (pure CSS, visible) */
.page-index #hero{position:relative;overflow:visible;min-height:100vh;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding-left:0;padding-right:0}
.page-index #hero .section-inner{position:relative;z-index:5;max-width:1200px;margin:0 auto;padding-left:var(--container-padding);padding-right:var(--container-padding)}
.page-index #hero .hero-bg{position:absolute !important;top:0 !important;left:calc(-50vw + 50%) !important;width:100vw !important;height:100% !important;z-index:1 !important;pointer-events:none !important;margin:0 !important;padding:0 !important;transform:none !important;opacity:0 !important;transition:opacity 0.3s ease !important}
.page-index #hero .hero-bg.active{opacity:1 !important}
.page-index #hero .hero-bg::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;background:radial-gradient(1200px 520px at 50% 40%, rgba(0,0,0,.0), rgba(0,0,0,.25) 70%, rgba(0,0,0,.45))}
.page-index #hero .hero-bg canvas{position:absolute !important;top:0 !important;left:0 !important;z-index:1 !important;width:100vw !important;height:100% !important;display:block !important;pointer-events:none !important;filter: blur(1.2px) saturate(1.08) contrast(1.08) opacity(.9) !important;margin:0 !important;padding:0 !important;transform:none !important}
/* removed intel panels and ticker */
.page-index #hero::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:none;animation:none}
@media (prefers-reduced-motion: reduce){.page-index #hero::before{animation:none}}
@keyframes heroDrift{0%{transform:translate3d(-1%, -1%, 0) scale(1.02)}100%{transform:translate3d(1%, 1%, 0) scale(1.04)}}
@media (prefers-reduced-motion: reduce){.page-index #hero::before{animation:none}}

/* Removed background animations for a clean corporate look */
.snap-section.has-anim::before{content:none}

/* Logo Wall - Professional Background Effects */
.logo-wall-wrap {
  padding: 3rem var(--container-padding);
  position: relative;
  overflow: hidden;
  background: #000;
  min-height: 100vh;
  isolation: isolate; /* ensure overlays blend only within section */
}

/* Force full-bleed for the references section */
#leaders, .page-index #leaders {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Animated aurora + vignette background (primary layer) */
.logo-wall-wrap::before { content: none; animation: none; }

/* Subtle grid + vignette + micro-noise (secondary layer) */
.logo-wall-wrap::after { content: none; animation: none; }

/* Play animations only when the section is revealed in viewport */
.logo-wall-wrap.is-visible::before,
.logo-wall-wrap.is-visible::after { animation-play-state: running; }

/* Aurora drift: slow background movement to avoid harsh loops */
@keyframes auroraDrift {
  0%, 100% { background-position: 50% 50%, 50% 50%, 0% 50%; opacity: 0.97; }
  25%      { background-position: 56% 44%, 44% 56%, 100% 54%; opacity: 1; }
  50%      { background-position: 46% 58%, 58% 46%, 50% 100%; opacity: 0.98; }
  75%      { background-position: 54% 46%, 46% 54%, 50% 0%;   opacity: 1; }
}

/* Grid float: imperceptible drift for professional feel */
@keyframes gridFloat {
  0%, 100% { transform: translate3d(0,0,0) scale(1); opacity: .35; }
  25%      { transform: translate3d(6px,-4px,0) scale(1.005); opacity: .38; }
  50%      { transform: translate3d(-4px,6px,0) scale(.995); opacity: .33; }
  75%      { transform: translate3d(3px,-2px,0) scale(1.002); opacity: .36; }
}

.logo-wall {
  max-width: 1320px;
  margin: auto;
  border-radius: 16px;
  padding: 2.5rem 1rem;
  position: relative;
  overflow: hidden;
  background: transparent;
  z-index: 3;
}

.logo-wall h2 {
  font-family: var(--font-heading);
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 2.5rem;
  position: relative;
  letter-spacing: -0.02em;
  z-index: 4;
}

.logo-wall h2::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -12px;
  width: 70px;
  height: 3px;
  background: var(--accent-fade);
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
  border-radius: 2px;
  transition: transform .35s;
}

.logo-wall h2:hover::after {
  transform: translateX(-50%) scaleX(1);
}

.logo-slider { display:flex; gap:2rem; animation: scroll 25s linear infinite; align-items:center; padding:0 1rem; position:relative; z-index:4 }
@media(max-width:640px){ .logo-slider{ animation-duration: 30s } }

.logo-slider:hover {
  animation-play-state: paused;
}

.logo-slider img {
  height: 40px;
  max-width: 120px;
  width: auto;
  object-fit: contain;
  flex: 0 0 auto;
  filter: invert(1) grayscale(1) brightness(1.5) contrast(1.1);
  opacity: .88;
  transition: opacity .2s ease, transform .2s ease, filter .2s ease;
}

@media (min-width: 768px) {
  .logo-wall-wrap {
    padding: 5rem 1rem 6rem;
  }
  .logo-wall {
    border-radius: 26px;
    padding: 3.5rem 0;
  }
  .logo-wall h2 {
    font-size: 2.5rem;
    margin-bottom: 3.5rem;
  }
  .logo-slider {
    gap: 4rem;
  }
  .logo-slider img {
    height: 60px;
    max-width: 150px;
    opacity: .90;
  }
.logo-slider img:hover { opacity: .98; transform: translateY(-2px); filter: invert(1) grayscale(.85) brightness(1.6) contrast(1.12); }
}

@keyframes scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* Certificates Section */
.team-cert-wrap {
  padding: 6rem 1rem;
}

.team-cert {
  max-width: 1320px;
  margin: auto;
  display: flex;
  gap: 3rem;
  align-items: center;
  justify-content: space-between;
}

.cert-text {
  flex: 0 0 40%;
}

.team-cert h2 {
  font-family: var(--font-heading);
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 1.4rem;
  position: relative;
  display: inline-block;
  letter-spacing: -0.02em;
}

.team-cert h2::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -10px;
  width: 70px;
  height: 3px;
  background: var(--accent-fade);
  border-radius: 2px;
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
  transition: transform .35s;
}

.team-cert h2:hover::after {
  transform: translateX(-50%) scaleX(1);
}

.team-cert p {
  color: #b3b3b3;
  font-size: 1.05rem;
  max-width: 420px;
  line-height: 1.7;
  letter-spacing: -0.01em;
}

.cert-grid {
  display: grid;
  grid-template-columns: repeat(3, 140px);
  grid-auto-rows: 140px;
  gap: 1.2rem;
}

.cert-grid img {
  width: auto;
  height: 90%;
  margin: auto;
  object-fit: contain;
  filter: grayscale(1) brightness(.85);
  transition: .3s;
}

.cert-grid img:hover {
  filter: none;
}

@media (max-width: 960px) {
  .team-cert {
    flex-direction: column;
    text-align: center;
    gap: 3rem;
  }
  .cert-text {
    flex: none;
  }
}

@media (max-width: 640px) {
  .team-cert-wrap {
    padding: 3rem var(--container-padding);
  }
  .team-cert h2 {
    font-size: 2rem;
  }
  .cert-grid {
    grid-template-columns: repeat(3, 110px);
    grid-auto-rows: 110px;
    gap: 1rem;
  }
}

/* Services Section */
.services-wrap {
  padding: 3rem var(--container-padding) 1rem;
  text-align: center;
}

.services-wrap h2 {
  font-family: var(--font-heading);
  font-size: 2rem;
  font-weight: 700;
  margin: 0 auto 1rem;
  position: relative;
  display: inline-block;
  letter-spacing: -0.02em;
}

.services-wrap h2::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -10px;
  width: 70px;
  height: 3px;
  background: var(--accent-fade);
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
  border-radius: 2px;
  transition: transform .35s;
}

.services-wrap h2:hover::after {
  transform: translateX(-50%) scaleX(1);
}

.services-subtitle {
  color: #b3b3b3;
  font-size: 1rem;
  max-width: 100%;
  margin: 0 auto 2.5rem;
  line-height: 1.7;
  letter-spacing: -0.01em;
  font-weight: 400;
  padding: 0 1rem;
}

.services-grid {display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:1.1rem;max-width:1320px;margin:0 auto;justify-items:stretch}

.service-card {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  transition: all .35s ease;
  background: #0a0a0a;
  display: flex;
  flex-direction: column;
  width: 100%;
  touch-action: manipulation;
}
.service-card::after{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:linear-gradient(90deg, rgba(255,255,255,.0), var(--accent), rgba(255,255,255,.0));transform:scaleX(0);transform-origin:center;transition:transform .35s ease}

.service-card.hidden {
  display: none;
}

.service-card:active {
  transform: scale(0.98);
}

@media (hover: hover) {
  .service-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0,0,0,.6);
  }
  .service-card:hover::after{transform:scaleX(1)}
}

.service-card-image {
  height: 56%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  filter: brightness(.4) contrast(.9);
  transition: filter .35s ease, transform .4s ease;
  will-change: transform;
}

.service-card:hover .service-card-image {
  filter: brightness(.8) contrast(1);
  transform: scale(1.02);
}

.service-card-image::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 30px;
  background: linear-gradient(transparent, #0a0a0a);
}

.service-card-content {
  height: 46%;
  padding: 1rem;
  background: #0a0a0a;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.service-card h3 {
  font-family: var(--font-heading);
  font-size: .98rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: .5rem;
  line-height: 1.3;
  letter-spacing: -0.02em;
  position: relative;
}

.service-card h3::after{content:none}

.service-card p {
  color: #c7c7c7;
  font-size: .86rem;
  line-height: 1.6;
  margin-bottom: .5rem;
  flex-grow: 1;
  letter-spacing: -0.01em;
}

.service-card-link {
  color: var(--accent);
  font-weight: 600;
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  transition: all .25s;
  margin-top: auto;
}

.service-card-link:hover {
  color: var(--accent-light);
  gap: .8rem;
}

.service-card-link::after {
  content: "→";
  font-size: .9rem;
  transition: transform .25s;
}

.service-card-link:hover::after {
  transform: translateX(3px);
}

@media (min-width: 640px) {.services-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}}

@media (min-width: 768px) {
  .services-wrap {
    padding: 6rem 1rem 1rem;
  }
  .services-wrap h2 {
    font-size: 2.5rem;
    margin-bottom: 1.2rem;
  }
  .services-subtitle {
    font-size: 1.05rem;
    max-width: 640px;
    margin-bottom: 3.5rem;
  }
  .service-card-content {
    padding: 1.5rem;
  }
  .service-card h3 {
    font-size: 1.15rem;
    margin-bottom: .6rem;
  }
  .service-card p {
    font-size: .9rem;
    margin-bottom: 1rem;
  }
  .service-card-link {
    font-size: .8rem;
  }
}

@media (min-width: 1024px) {.services-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem}}

/* Remove manual placement so rows flow 3-by-3 cleanly */
@media (min-width: 1024px) {#servicesGrid .under-ddos,#servicesGrid .under-vm,#servicesGrid .under-consult{grid-column:auto;justify-self:stretch;max-width:none}}

/* Services stacked - hide images, show text-only */
.services-grid.services-stacked .service-card-image {
  display: none;
}

.services-grid.services-stacked .service-card-content {
  height: auto;
  padding: 1.1rem 1.2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: .35rem;
}

.services-grid.services-stacked .service-card {
  height: 200px;
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.08);
  border-left: 3px solid rgba(255,255,255,.06);
}

.services-grid.services-stacked .service-card h3 {
  font-size: 1.12rem;
  margin-bottom: .25rem;
  position: relative;
  letter-spacing: -0.02em;
  font-weight: 800;
}

.services-grid.services-stacked .service-card h3::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -8px;
  width: 56px;
  height: 3px;
  background: var(--accent);
  transform: translateX(-50%);
  border-radius: 2px;
  opacity: .85;
}

.services-grid.services-stacked .service-card p {
  font-size: .94rem;
  color: #e0e0e0;
  margin: .5rem 0;
  max-width: 560px;
}

@media(hover:hover) {
  .services-grid.services-stacked .service-card:hover {
    box-shadow: 0 18px 40px rgba(0,0,0,.5);
    border-color: rgba(255,255,255,.18);
    border-left-color: var(--accent);
    transform: translateY(-6px) scale(1.01);
  }
}

@media(min-width:1200px){
  .services-grid.services-stacked .under-ddos{grid-column:2}
  .services-grid.services-stacked .under-consult{grid-column:3}
  .services-grid.services-stacked .under-istihbarat{grid-column:2}
  .services-grid.services-stacked .under-mudahale{grid-column:3}
}

/* CVE Alerts Section */
.cve-alerts-wrap {padding:5rem var(--container-padding) 4rem;background:radial-gradient(1200px 400px at 50% -200px, rgba(255,255,255,.06), rgba(255,255,255,0) 60%), #000;overflow:hidden}

.cve-alerts-container {
  max-width: 1320px;
  margin: 0 auto;
  text-align: center;
}

.cve-alerts-container h2 {font-family:var(--font-heading);font-size:2.1rem;font-weight:700;margin:0 auto 1rem;position:relative;display:inline-block;letter-spacing:-0.02em}

.cve-alerts-container h2::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -10px;
  width: 70px;
  height: 3px;
  background: var(--accent-fade);
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
  border-radius: 2px;
  transition: transform .35s;
}

.cve-alerts-container h2:hover::after {
  transform: translateX(-50%) scaleX(1);
}

.cve-filters{display:flex;gap:.6rem;justify-content:center;align-items:center;margin-top:.8rem;flex-wrap:wrap}
.cve-filters .chip{height:30px;min-height:0 !important;min-width:0 !important;padding:0 .8rem;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#ddd;font-size:.85rem;line-height:1;display:inline-grid;place-items:center;grid-auto-flow:column;gap:.4rem;cursor:pointer;transition:background .2s ease,border-color .2s ease,color .2s ease;user-select:none}
.cve-filters .chip .count{color:#c2c2c2;font-size:.75rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:.05rem .35rem}
.cve-filters .chip:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}
.cve-filters .chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cve-filters .chip.active{background:linear-gradient(180deg, rgba(185,28,28,.28), rgba(185,28,28,.16));border-color:rgba(185,28,28,.45);color:#fff}
/* color-coded hover/active by risk */
.cve-filters .chip[data-risk="critical"]:hover{background:rgba(239,68,68,.18);border-color:rgba(239,68,68,.45);color:#fff}
.cve-filters .chip[data-risk="high"]:hover{background:rgba(245,158,11,.18);border-color:rgba(245,158,11,.45);color:#fff}
.cve-filters .chip[data-risk="medium"]:hover{background:rgba(59,130,246,.18);border-color:rgba(59,130,246,.45);color:#fff}
.cve-filters .chip.active[data-risk="critical"]{background:linear-gradient(180deg, rgba(239,68,68,.32), rgba(239,68,68,.18));border-color:rgba(239,68,68,.55)}
.cve-filters .chip.active[data-risk="high"]{background:linear-gradient(180deg, rgba(245,158,11,.32), rgba(245,158,11,.18));border-color:rgba(245,158,11,.55)}
.cve-filters .chip.active[data-risk="medium"]{background:linear-gradient(180deg, rgba(59,130,246,.32), rgba(59,130,246,.18));border-color:rgba(59,130,246,.55)}
.cve-filters .chip.active .count{background:rgba(255,255,255,.18);color:#e8e8e8}

.cve-slider-container{overflow:hidden;position:relative;margin-top:2.5rem;padding:6px 0;max-width:100vw}
.cve-slider-container::before,.cve-slider-container::after{content:"";position:absolute;top:0;bottom:0;width:60px;pointer-events:none;z-index:2}
.cve-slider-container::before{left:0;background:linear-gradient(90deg,#000,rgba(0,0,0,0))}
.cve-slider-container::after{right:0;background:linear-gradient(270deg,#000,rgba(0,0,0,0))}

.cve-slider {
  display: flex;
  gap: 1rem;
  animation: cveScroll 18s linear infinite;
  align-items: stretch;
  padding: 0 0.5rem;
}

.cve-slider:hover { animation-play-state: running; }

.cve-card {flex:0 0 220px;background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.10);border-radius:12px;padding:1rem;cursor:pointer;transition:all .25s ease;position:relative;touch-action:manipulation;will-change:box-shadow;box-shadow:0 8px 18px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.05) inset}
.cve-card::before{content:"";position:absolute;inset:0;border-radius:16px;padding:1px;background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.04));-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.0;transition:opacity .25s}
.cve-card:hover::before,.cve-card.touch-hover::before{opacity:.45}
@media (hover: hover) {
  /* depth without vertical movement */
  .cve-card:hover { transform: none; box-shadow: 0 14px 30px rgba(0,0,0,.5); border-color: rgba(255,255,255,.18); }
}
.cve-card .risk-icon{position:absolute;top:.65rem;right:.65rem;width:20px;height:20px;border-radius:50%;display:none;place-items:center;font-size:.75rem}
.cve-card.critical .risk-icon{display:grid;background:rgba(239,68,68,.18);color:#ef4444}
.cve-card.high .risk-icon{display:grid;background:rgba(245,158,11,.18);color:#f59e0b}
.cve-card.medium .risk-icon{display:grid;background:rgba(59,130,246,.18);color:#3b82f6}
.cve-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.cve-card:active {
  transform: scale(0.98);
}

@media (hover: hover) {
  .cve-card:hover {
    transform: translateY(-4px);
    border-color: var(--accent);
    box-shadow: 0 8px 25px rgba(0,0,0,.4);
  }
}

.cve-card.critical {
  border-left: 3px solid #ef4444;
}

.cve-card.high {
  border-left: 3px solid #f59e0b;
}

.cve-card.medium {
  border-left: 3px solid #3b82f6;
}

/* CVE legend */
.cve-legend{display:flex;gap:.9rem;justify-content:center;align-items:center;color:#bdbdbd;margin-top:1rem;font-size:.9rem}
.cve-legend .item{display:inline-flex;align-items:center;gap:.45rem}
.cve-legend .dot{display:inline-block;width:10px;height:10px;border-radius:50%}
.cve-legend .dot.crit{background:#ef4444}
.cve-legend .dot.high{background:#f59e0b}
.cve-legend .dot.med{background:#3b82f6}

.cve-risk-badge {
  font-size: .65rem;
  font-weight: 600;
  padding: .25rem .6rem;
  border-radius: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: 0.8rem;
  display: inline-block;
  font-family: var(--font-body);
}

.cve-risk-badge.critical {
  background: rgba(239,68,68,.2);
  color: #ef4444;
}

.cve-risk-badge.high {
  background: rgba(245,158,11,.2);
  color: #f59e0b;
}

.cve-risk-badge.medium {
  background: rgba(59,130,246,.2);
  color: #3b82f6;
}

.cve-id {
  font-family: var(--font-body);
  font-size: .8rem;
  font-weight: 600;
  color: #888;
  margin-bottom: .4rem;
  letter-spacing: .02em;
}

.cve-card h4 {
  font-family: var(--font-heading);
  font-size: 1.05rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.3;
  letter-spacing: -0.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (min-width: 768px) {
  .cve-alerts-wrap {
    padding: 7rem 1rem 6rem;
  }
  .cve-alerts-container h2 {
    font-size: 2.5rem;
    margin-bottom: 1.2rem;
  }
  .cve-slider-container {
    margin-top: 3.5rem;
  }
  .cve-slider {
    gap: 1.5rem;
  }
  .cve-card {
    flex: 0 0 280px;
    padding: 1.5rem;
  }
  .cve-risk-badge {
    font-size: .7rem;
    padding: .3rem .8rem;
    margin-bottom: 1rem;
  }
  .cve-id {
    font-size: .85rem;
    margin-bottom: .5rem;
  }
  .cve-card h4 {
    font-size: 1.15rem;
  }
}

/* Seamless infinite loop without visible resets */
@keyframes cveScroll {0%{transform:translateX(0)}100%{transform:translateX(-50%)}}


/* CTA Section */
.cta-wrap {
  padding: 3rem var(--container-padding);
}

.cta-box {
  max-width: 1320px;
  margin: auto;
  border-radius: 16px;
  padding: 2.5rem 1.5rem;
  position: relative;
  text-align: center;
  color: #fff;
  background: #000 url('assets/bg-service-grid.png') center/cover no-repeat;
}

/* remove CTA glow overlay */
.cta-box::before { content: none; }

.cta-box h3 {
  font-family: var(--font-heading);
  font-size: 1.75rem;
  font-weight: 700;
  margin-bottom: 1.2rem;
  letter-spacing: -0.02em;
  position: relative;
  z-index: 1;
}

.cta-box p {
  color: #d3d3d3;
  margin-bottom: 1.8rem;
  max-width: 100%;
  font-size: 1rem;
  line-height: 1.7;
  letter-spacing: -0.01em;
  position: relative;
  z-index: 1;
}

.cta-box{ text-align:center }

.cta-box .btn-primary{display:inline-block}
.cta-box .btn-secondary{display:inline-block;border:1px solid rgba(255,255,255,.6);color:#fff;border-radius:28px;padding:.9rem 1.6rem;font-weight:600;margin-left:.6rem;transition:.25s}
.cta-box .btn-secondary:hover{background:rgba(255,255,255,.08);border-color:#fff}

.cta-bullets{display:flex;flex-wrap:wrap;gap:.6rem 1rem;justify-content:center;margin:1rem 0 1.2rem}
.cta-bullets .item{display:inline-flex;align-items:center;gap:.45rem;color:#d3d3d3;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:.45rem .75rem;font-size:.9rem}
.cta-bullets .item i{color:var(--accent)}

.cta-actions{display:flex;justify-content:center;align-items:center;margin-bottom:1.2rem}

.cta-trust{display:flex;flex-wrap:wrap;gap:.5rem .8rem;justify-content:center;color:#aaa}
.cta-trust .badge{display:inline-flex;align-items:center;gap:.4rem;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:8px;padding:.35rem .6rem;font-size:.8rem}
.cta-trust .badge i{color:var(--accent)}

/* remove süreç grid */

/* CTA highlighted offer */
@keyframes bordoPulse{0%,100%{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.04)}50%{border-color:rgba(185,28,28,.5);background:rgba(153,27,27,.08)}}
@keyframes bordoPulseStrong{0%,100%{border-color:rgba(185,28,28,.30);background:rgba(153,27,27,.06)}50%{border-color:rgba(185,28,28,.65);background:rgba(153,27,27,.14)}}
.cta-offer{display:flex;align-items:center;gap:1rem;max-width:720px;margin:2.2rem auto 0;border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:1rem 1.2rem;box-shadow:0 14px 32px rgba(0,0,0,.35);transition:box-shadow .25s ease, transform .25s ease;position:relative;overflow:hidden;animation:bordoPulse 1.4s ease-in-out infinite}
.cta-offer::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(120deg, rgba(255,255,255,.18), rgba(255,255,255,.06));-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.0;transition:opacity .25s ease}
.cta-offer::after{content:"";position:absolute;top:-120%;left:-40%;width:60%;height:360%;background:linear-gradient(60deg, rgba(255,255,255,.06), rgba(255,255,255,0));transform:rotate(12deg);opacity:0;transition:opacity .35s ease}
@media(hover:hover){ .cta-offer:hover{ border-color: rgba(185,28,28,.45) } }
@media(hover:hover){ .cta-offer:hover::before{opacity:.6} }
@media(hover:hover){ .cta-offer:hover::after{opacity:.22} }

.cta-offer .offer-icon{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.10);display:grid;place-items:center;color:#fff;box-shadow:inset 0 0 0 2px rgba(255,255,255,.08);transition:box-shadow .25s ease, transform .25s ease, background .25s ease}
@media(hover:hover){ .cta-offer:hover .offer-icon{ box-shadow: 0 0 0 3px rgba(255,255,255,.08), 0 12px 28px rgba(0,0,0,.35), inset 0 0 0 2px rgba(255,255,255,.18); background:rgba(255,255,255,.12); transform:translateY(-1px) } }

.cta-offer .offer-copy{text-align:center;margin-left:.2rem}
.cta-offer .offer-copy strong{display:block;font-size:1.05rem}
.cta-offer .offer-copy small{color:#cfcfcf}
/* Sync tags pulse with card */
.cta-offer .offer-tags .tag{animation:bordoPulse 2s ease-in-out infinite}
.offer-tags{display:flex;flex-wrap:wrap;gap:.4rem .5rem;margin-top:.5rem}
.offer-tags .tag{display:inline-flex;align-items:center;gap:.35rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);border-radius:999px;padding:.35rem .6rem;font-size:.85rem;color:#ddd;transition:transform .2s ease, background .2s ease, border-color .2s ease}
.offer-tags .tag i{color:var(--accent)}
.offer-tags .tag:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
@media(hover:hover){ .offer-tags .tag:hover{ transform:translateY(-2px); background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.20); color:#fff } }
.cta-box{text-align:center}
.cta-offer{justify-content:center}
@media(hover:hover){ .cta-offer:hover{ transform:translateY(-4px); box-shadow:0 22px 46px rgba(0,0,0,.45) } }

/* Outside call-to-action button: place as sibling under card */
.cta-offer-wrap{position:relative;display:flex;justify-content:center;margin-bottom:4.5rem}
.cta-offer-wrap .cta-external-btn{position:absolute;left:50%;bottom:-60px;transform:translateX(-50%);z-index:5}
.cta-offer-wrap .cta-external-btn .btn-primary{
  animation:bordoPulse 1.4s ease-in-out infinite;
  background: linear-gradient(180deg, #f8f8f8 0%, #f0f0f0 100%) !important;
  color: #0f0f0f !important;
  border: 1px solid rgba(240,240,240,.6) !important;
  display:inline-flex;align-items:center;justify-content:center;
  font-weight:600; opacity:1; text-shadow:none;
}
@media (max-width: 768px){
  .cta-offer-wrap{margin-bottom:5rem}
  .cta-offer-wrap .cta-external-btn{bottom:-50px}
}

/* KPI counter hover depth */
.cta-counters .counter-item{transition:box-shadow .25s ease, transform .25s ease}
@media(hover:hover){ .cta-counters .counter-item:hover{ transform:translateY(-3px); box-shadow:0 12px 28px rgba(0,0,0,.35) } }

@media (min-width: 768px) {
  .cta-wrap {
    padding: 5rem 1rem;
  }
  .cta-box {
    border-radius: 26px;
    padding: 4rem 2rem;
  }
  .cta-box h3 {
    font-size: 2rem;
    margin-bottom: 1.4rem;
  }
  .cta-box p {
    max-width: 720px;
    margin-inline: auto;
    font-size: 1.05rem;
    margin-bottom: 2.2rem;
  }
}

/* Modal Styles */
.modal.hidden {
  display: none;
}

.modal {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.85);
  z-index: 2000;
  padding: 1rem;
}

.modal-box {
  background: #111;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  padding: 2rem 1.5rem;
  max-width: 90%;
  width: 100%;
  text-align: center;
  position: relative;
  max-height: 90vh;
  overflow-y: auto;
}

.modal-title {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 1.2rem;
  letter-spacing: -0.02em;
}

.modal-text {
  color: #b3b3b3;
  margin-bottom: 1.8rem;
  font-size: 0.95rem;
  line-height: 1.7;
  letter-spacing: -0.01em;
}

.modal-close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background: none;
  border: none;
  font-size: 1.5rem;
  color: #888;
  cursor: pointer;
  padding: 0.5rem;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-close:hover {
  color: var(--accent);
}

.btn-close {
  background: var(--accent);
  border: none;
  color: #fff;
  padding: .8rem 1.5rem;
  border-radius: 7px;
  font-weight: 500;
  cursor: pointer;
  font-family: var(--font-body);
  letter-spacing: -0.01em;
  min-height: 44px;
}

@media (min-width: 768px) {
  .modal-box {
    max-width: 560px;
    padding: 2.8rem 2.2rem;
  }
  .modal-title {
    font-size: 2rem;
    margin-bottom: 1.4rem;
  }
  .modal-text {
    font-size: 1rem;
    margin-bottom: 2.2rem;
  }
  .modal-close {
    font-size: 1.8rem;
    right: 1.2rem;
  }
  .btn-close {
    padding: .7rem 1.8rem;
  }
}

/* STANDARDIZED FOOTER */
footer {
  background: #0a0a0a;
  color: #999;
  margin-top: 0;
  font-size: .86rem;
  padding-top: 0;
  padding-bottom: 0;
  border-top: 1px solid rgba(255,255,255,.08); /* unify left edge visually */
}

/* Footer acts like a snap section on snap-enabled pages */
/* Footer participates in snap without changing its layout; let content above determine when it comes into view */
.page-index footer,
.page-kurumsal footer,
.page-blog footer,
.page-iletisim footer{
  scroll-snap-align: start;
  scroll-snap-stop: always;
  min-height: auto;
}

.footer-grid {max-width:1200px;margin:0 auto;padding:3.5rem var(--container-padding);display:grid;row-gap:2.5rem;column-gap:3.2rem;grid-template-columns:minmax(280px,1fr) 220px 220px 220px;align-items:start}

.footer-brand img {
  width: 140px;
  margin-bottom: 1.2rem;
}

.footer-brand p {
  font-size: .86rem;
  line-height: 1.6;
  letter-spacing: -0.01em;
  color: #999;
}

.footer-links h3 {
  font-family: var(--font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: .7rem;
  color: #fff;
  letter-spacing: -0.02em;
  margin-top: 14px; /* lowered slightly more for better logo alignment */
}

.footer-links ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

.footer-links ul li a {
  font-size: .88rem;
  letter-spacing: -0.01em;
  color: #999;
  transition: color .2s;
}

.footer-links ul li a:hover {
  color: #fff;
}

.footer-links a::after {
  background: var(--accent);
}

/* Footer Services grid layout */
.footer-links .services-list{list-style:none;margin:0;padding:0;column-gap:1.6rem}
.footer-links .services-list li{break-inside:avoid;margin:0;padding:0}
.footer-links .services-list a{font-size:.88rem;letter-spacing:-0.01em;color:#999;transition:color .2s;display:inline;line-height:1.4;margin:0;padding:0;white-space:nowrap}
.footer-links .services-list a:hover{color:#fff}


.social a {
  color: #999;
  font-size: 1.1rem;
  margin-right: 1.2rem;
  transition: color .2s;
}

.social a:hover {
  color: var(--accent);
}

hr.separator {
  border: none;
  border-top: 1px solid #222;
  margin: 0;
}

.footer-meta {
  max-width: 1200px;
  margin: auto;
  padding: 1.2rem 1rem;
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  justify-content: center;
  font-size: .85rem;
  letter-spacing: -0.01em;
}

.footer-meta a {
  color: #888;
  transition: color .2s;
}

.footer-meta a:hover {
  color: var(--accent);
}

@media (max-width: 768px) {
  .footer-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
    text-align: center;
  }
  .footer-links .services-list{column-count:1;column-gap:1rem}
  .footer-brand img {
    margin: 0 auto 1.2rem;
  }
  .social a {
    margin: 0 0.6rem;
  }
}

/* Responsive columns for Hizmetler */
@media (min-width: 768px){
  .footer-links .services-list{column-count:2;column-gap:1.8rem}
}
@media (min-width: 992px){
  .footer-links .services-list{column-count:2;column-gap:2rem}
}

/* Nudge the İletişim column slightly right on desktop */
@media (min-width: 992px) {
  /* grid handles alignment; remove margin nudges */
  .footer-grid > .footer-links:last-child { margin-left: 0; padding-left: 0; }
  .footer-grid > .footer-links.services-compact { margin-left: 0; }
  /* Narrow brand text block + first column */
  .footer-grid{ grid-template-columns: 300px 1fr 1fr 1fr; }
  .footer-brand{ max-width: 300px; }
  .footer-brand p{ max-width: 300px; }
  /* remove extra left padding entirely to stick to container edge */
  .footer-grid > .footer-links{ padding-left: 0; }
  .footer-links h3{ margin-left: 0; }
}

/* Accessibility & Performance */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ===== FULL-BLEED OVERRIDE (NO SIDE GAPS) ===== */
html, body{width:100%;max-width:100%;overflow-x:hidden}
/* Keep outer wrappers full-bleed, inner containers handle centering */
header, footer, .snap-section{
  margin-left:0 !important; margin-right:0 !important;
  padding-left:0 !important; padding-right:0 !important;
  max-width:100% !important; width:100% !important;
}

button:focus-visible, 
a:focus-visible,
.service-card:focus-visible,
.cve-card:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.skip-to-content {
  position: absolute;
  top: -100%;
  left: 0;
  background: var(--accent);
  color: #fff;
  padding: 0.8rem 1.5rem;
  text-decoration: none;
  z-index: 10000;
  border-radius: 0 0 8px 0;
}

.skip-to-content:focus {
  top: 0;
}

::selection {
  background: var(--accent);
  color: #fff;
}

::-moz-selection {
  background: var(--accent);
  color: #fff;
}

button, 
a, 
input, 
select, 
textarea {
  min-height: 44px;
  min-width: 44px;
}

.loading {
  opacity: 0.6;
  pointer-events: none;
}

[data-transition] {
  transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

@media print {
  header, footer, .cta-wrap, .modal {
    display: none !important;
  }
  
  body {
    font-size: 12pt;
    color: #000;
    background: #fff;
  }
  
  .hero, .services-wrap, .team-cert-wrap {
    page-break-inside: avoid;
  }
}

/* ===== Blog Page Layout (scoped) ===== */
.page-blog .blog-wrap{max-width:1200px;margin:0 auto;padding-left:var(--container-padding);padding-right:var(--container-padding)}
.page-blog #cve-analyses .posts-grid,.page-blog section .posts-grid{max-width:980px}
/* Use global .page-title for blog heading consistency with Kurumsal */
.page-blog .blog-wrap .blog-subtitle{text-align:center;color:#b3b3b3;margin-bottom:2rem}
.page-blog #cve-analyses{margin-bottom:3rem}
.page-blog #cve-analyses h2,.page-blog #tech-articles h2{text-align:center;font-size:1.4rem;margin:0 auto 1rem auto}
.page-blog .posts-grid{display:grid;grid-template-columns:1fr;gap:1rem;max-width:1100px;margin:0 auto}
.page-blog .post-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:1rem;transition:.25s}
.page-blog .post-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.35)}
.page-blog .post-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.6rem}
.page-blog .badge{font-size:.65rem;padding:.2rem .5rem;border-radius:10px;text-transform:uppercase;letter-spacing:.08em}
.page-blog .badge.critical{background:rgba(239,68,68,.2);color:#ef4444}
.page-blog .badge.high{background:rgba(245,158,11,.2);color:#f59e0b}
.page-blog .badge.medium{background:rgba(59,130,246,.2);color:#3b82f6}
.page-blog .post-title{font-family:var(--font-heading);font-size:.95rem;font-weight:700;margin-bottom:.25rem}
.page-blog .post-meta{color:#888;font-size:.75rem}
.page-blog .post-excerpt{color:#b3b3b3;font-size:.8rem;margin-top:.4rem}
.page-blog .pager{display:flex;gap:.6rem;justify-content:center;align-items:center;margin:1rem 0 1.6rem}
.page-blog .pager button{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#fff;border-radius:12px;padding:.28rem .6rem;font-size:.78rem;min-width:28px}
.page-blog .pager .num{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;padding:0}
.page-blog .pager .num.active{background:#fff;color:#000;border-color:#fff}
.page-blog .pager .dots{opacity:.6;padding:0 .2rem}
.page-blog .pager button[disabled]{opacity:.45;cursor:not-allowed}
@media(min-width:768px){
  .page-blog #cveGrid{grid-template-columns:repeat(2,1fr);gap:1rem}
  .page-blog #articlesGrid{grid-template-columns:repeat(2,1fr);gap:1rem}
}
@media(min-width:992px){
  .page-blog #cveGrid{grid-template-columns:repeat(3,1fr)}
  .page-blog #articlesGrid{grid-template-columns:repeat(2,1fr)}
}

/* ===== Kurumsal Page Exact Layout Tweaks ===== */
.page-title{
  text-align:center;
  font-size:2.5rem;
  margin:0 auto 2rem auto;
  display:block;
  width:100%;
  font-family:var(--font-heading);
  font-weight:700;
  letter-spacing:-0.02em;
}
.kurumsal-section .section-inner{width:100%;max-width:none;margin:0;padding:0;margin-top:-11rem}
.page-kurumsal .page-title { 
  padding-top: 0; 
  margin-bottom: 2rem; 
}
 
.about-card{
  max-width:960px;
  margin:0 auto 6rem auto;
}
/* Kurumsal başlık ve paragraf aralıkları */
.about-card h2{
  font-size:1.9rem;
  font-weight:700;
  margin-bottom:2rem; /* ~2 br boşluk etkisi */
}
.about-card p{
  margin-bottom:1rem; /* her paragraf sonrası ~1 br boşluk */
  line-height:1.75;
}
 
.values-grid{display:grid;grid-template-columns:repeat(1,minmax(200px,1fr));gap:.8rem;max-width:980px;margin:3.5rem auto 1.6rem auto;padding:0 1rem}
.values-grid .value{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:.85rem;text-align:center;transition:all .3s ease;box-shadow:0 8px 20px rgba(0,0,0,.35), 0 4px 12px rgba(0,0,0,.25), 0 2px 6px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.08)}
.values-grid .value:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(0,0,0,.5), 0 10px 20px rgba(0,0,0,.35), 0 4px 10px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.12);background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.15)}
.values-grid .value .icon{width:28px;height:28px;border-radius:9px;background:rgba(255,255,255,.06);display:grid;place-items:center;color:var(--accent);margin:0 auto .45rem}
.values-grid .value h3{font-family:var(--font-heading);font-size:.95rem;margin-bottom:.15rem}
.values-grid .value p{color:#cfcfcf;font-size:.9rem}
@media(min-width:768px){.values-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:992px){.values-grid{grid-template-columns:repeat(4,1fr)}}
 
 
.cert-show{padding:0 1rem 2rem;text-align:center}
.cert-show h3{font-family:var(--font-heading);font-size:2rem;font-weight:700;margin:2rem 0 2.5rem;position:relative;display:inline-block;letter-spacing:-0.02em}
.cert-show h3::after{content:"";position:absolute;left:50%;bottom:-12px;width:70px;height:3px;background:var(--accent-fade);border-radius:2px;transform:translateX(-50%) scaleX(0);transform-origin:center;transition:transform .35s}
.cert-show h3:hover::after{transform:translateX(-50%) scaleX(1)}
.page-kurumsal .cert-grid{display:flex;gap:2rem;justify-content:center;overflow-x:auto;padding:0 1.25rem .5rem;scrollbar-width:none;scroll-snap-type:x mandatory}
.page-kurumsal .cert-grid::-webkit-scrollbar{display:none}
.page-kurumsal .cert-grid img{height:84px;width:auto;flex:0 0 auto;object-fit:contain;filter:grayscale(1) brightness(.85);transition:.3s;scroll-snap-align:center}
.page-kurumsal .cert-grid img:hover{filter:none;transform:translateY(-4px)}
/* Two-row centered layout for Kurumsal certificates */
.page-kurumsal .cert-rows{display:flex;flex-direction:column;gap:1.25rem;align-items:center}
.page-kurumsal .cert-row{display:flex;gap:1.2rem;justify-content:center;align-items:center;flex-wrap:nowrap}
.page-kurumsal .cert-row img{height:68px;width:auto;object-fit:contain;filter:grayscale(1) brightness(.85);transition:.3s}
@media (max-width: 1200px){
  .page-kurumsal .cert-row img{height:56px}
  .page-kurumsal .cert-row{gap:0.8rem}
}
@media (max-width: 640px){
  .page-kurumsal .cert-grid img{height:54px}
  .page-kurumsal .cert-row img{height:54px}
  .page-kurumsal .cert-row{gap:0.5rem;flex-wrap:wrap}
}

/* Scroll Reveal (home only) */
@media (prefers-reduced-motion: no-preference) {
  .reveal { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; }
  .reveal-up { transform: translateY(28px); }
  .reveal-left { transform: translateX(-28px); }
  .reveal-right { transform: translateX(28px); }
  .reveal.is-visible { opacity: 1; transform: none; }
  .reveal [data-reveal-item] { opacity: 0; transform: translateY(16px); }
  .reveal.reveal-left [data-reveal-item] { transform: translateX(-16px); }
  .reveal.reveal-right [data-reveal-item] { transform: translateX(16px); }
  .reveal.is-visible [data-reveal-item] { opacity: 1; transform: none; transition: opacity .6s ease, transform .6s ease; }
}

/* Home scroll-snap layout (section-by-section view) */
.page-index,.page-blog,.page-iletisim,.page-kurumsal{scroll-snap-type:y proximity}
@media (prefers-reduced-motion: reduce) {
  .page-index,
  .page-blog,
  .page-iletisim,
  .page-kurumsal { scroll-snap-type: none; }
}
/* Remove extra top padding so snap height math is exact */
.page-index main,
.page-blog main,
.page-iletisim main,
.page-kurumsal main { padding-top: var(--header-height); }

/* Center every section vertically and horizontally within the viewport */
.page-index .snap-section,
.page-blog .snap-section,
.page-iletisim .snap-section,
.page-index .snap-section,
.page-blog .snap-section,
.page-iletisim .snap-section,
.page-kurumsal .snap-section {
  scroll-snap-align: center;
  scroll-snap-stop: always;
  scroll-margin-top: var(--header-height);
  min-height: calc(100vh - var(--header-height));
  display: flex;
  align-items: center;
  justify-content: center;
}
/* Ensure inner content keeps its own natural width (no stretching) */
.page-index .snap-section > *,.page-blog .snap-section > *,.page-iletisim .snap-section > *,.page-kurumsal .snap-section > *{margin-left:0;margin-right:0}

/* Remove previous services-specific alignment override */
/* .page-index .services-wrap.snap-section{ align-items: flex-start; } */

/* Optional block-flow section to avoid flex centering issues on complex layouts */
.page-index .snap-section--block { display: block; justify-content: initial; align-items: initial; }

/* Prevent hero CTA button from stretching */
.hero .btn-primary { display: inline-block; width: auto; }

/* Homepage button refinements (more compact, professional) */
.page-index .btn-primary,
.page-index .btn-secondary{ /* remove forced shrink to allow global system */ }
.page-index .cta-box .btn-secondary{padding:.55rem 1.1rem !important; font-size:.9rem !important; min-height:36px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important;}
.page-index .cta-actions{gap:.5rem}

/* Prevent underline animation on CTA links styled as buttons */
.btn-secondary:hover::after{width:0}

.page-index .snap-section .section-inner{max-width:none;margin:0;width:100%;max-height:none;overflow:visible;padding:0;left:0;right:0}

/* Homepage visual polish */
.page-index .snap-section{position:relative;overflow:hidden;margin-left:0;margin-right:0;min-height:100vh;display:flex;align-items:center}
.page-index .snap-section .section-inner{position:relative;z-index:1}
/* remove glow overlay on all sections */
.page-index .snap-section::before{content:none}
.page-index .snap-section:not(:last-of-type)::after{content:"";position:absolute;left:50%;bottom:14px;width:22px;height:22px;border-bottom:2px solid rgba(255,255,255,.35);border-right:2px solid rgba(255,255,255,.35);transform:translateX(-50%) rotate(45deg);opacity:.65;animation:arrowBounce 1.6s ease-in-out infinite;pointer-events:none;max-width:100vw}
@keyframes arrowBounce{0%,100%{transform:translateX(-50%) translateY(0) rotate(45deg)}50%{transform:translateX(-50%) translateY(6px) rotate(45deg)}}

/* Optional grid backdrop for dense sections */
.page-index .has-grid::before{content:"";position:absolute;inset:0;background:
  linear-gradient(rgba(255,255,255,.04), rgba(255,255,255,.04)),
  repeating-linear-gradient(0deg, transparent 0 23px, rgba(255,255,255,.06) 24px),
  repeating-linear-gradient(90deg, transparent 0 23px, rgba(255,255,255,.06) 24px);
opacity:.18;pointer-events:none;z-index:0}

/* Animate section headings underline when revealed */
.page-index .reveal.is-visible h2::after,
.page-index .reveal.is-visible h3::after{transform:translateX(-50%) scaleX(1) !important}

/* Gentle card outline on hover for services */
.page-index .service-card{position:relative}
.page-index .service-card::before{content:"";position:absolute;inset:0;border-radius:16px;padding:1px;background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.04));-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.0;transition:opacity .25s}
.page-index .service-card:hover::before{opacity:.6}

/* Denser certificates grid with cards */
.page-index #teamcerts .cert-grid{display:grid;grid-template-columns:repeat(3, 1fr);grid-auto-rows:100px;row-gap:0;column-gap:0;padding:0}
@media (min-width: 768px){.page-index #teamcerts .cert-grid{grid-template-columns:repeat(3, 1fr);grid-auto-rows:120px;row-gap:0;column-gap:0}}
@media (min-width: 992px){.page-index #teamcerts .cert-grid{grid-template-columns:repeat(3, 1fr);grid-auto-rows:130px;row-gap:0;column-gap:0}}
@media (min-width: 1200px){.page-index #teamcerts .cert-grid{grid-template-columns:repeat(3, 1fr)}}
.page-index #teamcerts .cert-card{background:#000;border:0;border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:.25s;padding:0;outline:0}
.page-index #teamcerts .cert-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.35)}
.page-index #teamcerts .cert-card img{max-height:88%;max-width:88%;object-fit:contain;filter:grayscale(1) brightness(1.35) contrast(1.08) drop-shadow(0 0 1px rgba(0,0,0,.85));transition:filter .25s ease}
.page-index #teamcerts .cert-grid .cert-card:last-child{padding:.05rem;overflow:visible}
.page-index #teamcerts .cert-grid .cert-card:last-child img{max-height:100%;max-width:100%;transform:scale(1.4);transform-origin:center}
.page-index #teamcerts .cert-grid .cert-card:nth-child(3){overflow:visible}
.page-index #teamcerts .cert-grid .cert-card:nth-child(3) img{transform:scale(1.1);transform-origin:center}
.page-index #teamcerts .cert-card .cert-tag{margin-top:.4rem;color:#bdbdbd;font-size:.8rem;letter-spacing:.02em}
.page-index #teamcerts .cert-card:hover img{filter:none}

/* CTIA visibility and hover colorization (last cert assumed CTIA) */
.page-index #teamcerts .cert-grid .cert-card:last-child img{
  /* ensure clear edges on dark background */
  filter: grayscale(1) brightness(1.05) contrast(1.1) drop-shadow(0 0 1px rgba(0,0,0,.85)) drop-shadow(0 2px 4px rgba(0,0,0,.6));
}
.page-index #teamcerts .cert-grid .cert-card:last-child:hover img{
  /* keep natural (white) logo, only enhance separation */
  filter: drop-shadow(0 0 1px rgba(0,0,0,.85)) drop-shadow(0 2px 4px rgba(0,0,0,.6));
}

/* CTA counters */
.cta-counters{display:flex;justify-content:center;gap:1.4rem;flex-wrap:wrap;margin:.6rem 0 1.2rem}
.cta-counters .counter-item{min-width:120px;text-align:center;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:.8rem .9rem}
.cta-counters .counter-item .num{font-family:var(--font-heading);font-weight:800;font-size:1.6rem}
.cta-counters .counter-item .suffix{margin-left:.15rem;color:#bfbfbf}
.cta-counters .counter-item small{display:block;margin-top:.2rem;color:#b3b3b3}

/* References dense logo grid */
.page-index .logo-grid{max-width:1100px;margin:1rem auto 0;display:grid;grid-template-columns:repeat(2, minmax(120px,1fr));gap:1rem 1.5rem;align-items:center;justify-items:center}
@media(min-width:768px){.page-index .logo-grid{grid-template-columns:repeat(4, 1fr)}}
@media(min-width:992px){.page-index .logo-grid{grid-template-columns:repeat(6, 1fr)}}
.page-index .logo-grid .logo-item{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:.9rem 1rem;height:80px;display:flex;align-items:center;justify-content:center;transition:.25s}
.page-index .logo-grid .logo-item:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.35)}
.page-index .logo-grid .logo-item img{height:36px;max-width:120px;object-fit:contain;filter:grayscale(1) brightness(1.1) contrast(1.05);opacity:.9;transition:.25s}
.page-index .logo-grid .logo-item:hover img{filter:none;opacity:1}

/* Professional marquee for references */
.page-index .marquee{position:relative;overflow:hidden;max-width:1200px;margin:1rem auto 0;padding:1rem 0}
.page-index .marquee::before,.page-index .marquee::after{content:"";position:absolute;top:0;bottom:0;width:80px;z-index:2;pointer-events:none}
.page-index .marquee::before{left:0;background:linear-gradient(90deg,#000,rgba(0,0,0,0))}
.page-index .marquee::after{right:0;background:linear-gradient(270deg,#000,rgba(0,0,0,0))}
.page-index .marquee-track{display:flex;gap:2.5rem;align-items:center;animation:marquee 22s linear infinite}
.page-index .marquee:hover .marquee-track{animation-play-state:paused}
.page-index .marquee img{height:40px;max-width:140px;object-fit:contain;filter:invert(1) grayscale(1) brightness(1.6) contrast(1.1);opacity:.9;transition:.25s}
.page-index .marquee img:hover{opacity:1;filter:invert(1) grayscale(.3) brightness(1.9) contrast(1.15)}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* Remove grid backdrop for references to avoid visible lines */
.page-index #leaders.has-grid::before{display:none}
/* Disable glow overlay for References section */
.page-index #leaders.snap-section::before{content:none}

/* Ensure references slider area is always visible */
.page-index #leaders .logo-slider{min-height:60px}

/* References copy block - UPDATED v2 */
.page-index .ref-copy{max-width:900px;margin:3.6rem auto 0;text-align:center;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-left:none !important;border-radius:12px;padding:1rem 1.2rem 1rem 1.5rem;box-shadow:0 4px 12px rgba(0,0,0,.3),0 12px 32px rgba(0,0,0,.4),0 2px 8px rgba(107,114,128,.12);transition:all .35s ease;position:relative;overflow:hidden;z-index:4}
.page-index .ref-copy::before{content:"" !important;position:absolute !important;left:0 !important;top:0 !important;bottom:0 !important;width:4px !important;background:rgba(127,29,29,.4) !important;border-radius:12px 0 0 12px !important;transition:all .35s ease !important}
.page-index .ref-copy:hover{box-shadow:0 8px 20px rgba(0,0,0,.4),0 24px 60px rgba(0,0,0,.55),0 4px 16px rgba(107,114,128,.18);transform:translateY(-6px);border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.05)}
.page-index .ref-copy:hover::before{background:linear-gradient(180deg, #b91c1c, #991b1b, #7f1d1d) !important;width:5px !important;top:0 !important;bottom:0 !important;opacity:1 !important}
.page-index .ref-copy h3{font-family:var(--font-heading);font-weight:700;font-size:1.4rem;margin-bottom:.6rem;letter-spacing:-0.01em;position:relative;z-index:1}
.page-index .ref-copy p{color:#c9c9c9;line-height:1.8;position:relative;z-index:1}
/* Ref CTA and metrics */
.ref-cta{margin:1rem 0 0;display:flex;justify-content:center;position:relative;z-index:4}
.ref-metrics{display:grid;grid-template-columns:repeat(2,minmax(100px,1fr));gap:.6rem;max-width:680px;margin:1rem auto 0;position:relative;z-index:4}
.ref-metrics .metric{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:.6rem .75rem;text-align:center;transition:all .25s ease;box-shadow:0 4px 12px rgba(0,0,0,.2)}
.ref-metrics .metric:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.35);border-color:rgba(255,255,255,.15)}
.ref-metrics .metric strong{font-family:var(--font-heading);font-weight:800;font-size:1.1rem}
.ref-metrics .metric small{display:block;margin-top:.1rem;color:#b3b3b3;font-size:.85rem}
@media(min-width:768px){.ref-metrics{grid-template-columns:repeat(4,1fr)}}
/* Assurance strip */
.assure-strip{display:flex;flex-wrap:wrap;gap:.6rem .8rem;justify-content:center;margin:1rem 0 0}
.assure-strip .assure{display:inline-flex;align-items:center;gap:.45rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:.5rem .8rem;color:#d7d7d7;font-size:.9rem}
.assure-strip .assure i{color:var(--accent)}
/* Value blocks (ref-copy altı) */
.value-blocks{}
/* Process steps */
.process-steps{display:grid;grid-template-columns:repeat(1,minmax(160px,1fr));gap:.9rem;max-width:980px;margin:1.2rem auto 0}
.process-steps .step{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:1rem 1.1rem;text-align:center;transition:.25s}
.process-steps .step:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.35)}
.process-steps .step .icon{width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,.06);display:grid;place-items:center;margin:0 auto .6rem;color:var(--accent)}
.process-steps .step h4{font-family:var(--font-heading);font-size:1rem;margin-bottom:.25rem}
.process-steps .step p{color:#b8b8b8;font-size:.95rem}
@media(min-width:640px){.process-steps{grid-template-columns:repeat(3,1fr)}}
@media(min-width:992px){.process-steps{grid-template-columns:repeat(5,1fr)}}
/* CTA actions under process */
.ref-actions{display:flex;justify-content:center;align-items:center;gap:.6rem;margin-top:1rem}
/* Reference stats */
.page-index .ref-stats{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:1rem}
.page-index .ref-stats .stat-item{min-width:140px;text-align:center;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:.7rem .9rem}
.page-index .ref-stats .stat-item .num{font-family:var(--font-heading);font-weight:800;font-size:1.4rem}
.page-index .ref-stats .stat-item .suffix{margin-left:.15rem;color:#bbb}
.page-index .ref-stats .stat-item small{display:block;margin-top:.15rem;color:#a9a9a9}

/* Pro KPI rings */
.page-index .ref-stats-pro{display:grid;grid-template-columns:repeat(2, minmax(180px,1fr));gap:1.2rem;max-width:900px;margin:1.2rem auto 0;justify-items:center}
@media(min-width:768px){.page-index .ref-stats-pro{grid-template-columns:repeat(4,1fr)}}
.page-index .stat-pro{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:1rem;display:flex;flex-direction:column;align-items:center;gap:.6rem;min-height:160px}
.page-index .stat-pro .meta strong{font-size:.95rem}
.page-index .stat-pro .meta small{color:#a9a9a9}
.page-index .ring{position:relative;width:96px;height:96px;border-radius:50%;background:
  conic-gradient(var(--accent) 0deg, var(--accent) 0deg, rgba(255,255,255,.08) 0deg);
  display:grid;place-items:center}
.page-index .ring::after{content:"";position:absolute;inset:8px;border-radius:50%;background:#000}
.page-index .ring span{position:relative;color:#fff;font-weight:800}

/* Reference charts strip */
.page-index .ref-charts{display:grid;grid-template-columns:repeat(1, minmax(260px,1fr));gap:1rem;max-width:900px;margin:1.2rem auto 0}
@media(min-width:768px){.page-index .ref-charts{grid-template-columns:repeat(3,1fr)}}
.page-index .chart-card{height:280px;min-height:280px}
/* Visual areas EXACT height */
.chart-card.gauge .g-wrap{height:160px}
.chart-card.mttr-lines .mttr-svg{height:160px}
.chart-card.radar .radar-svg{height:160px;width:200px}
/* Uniform layout for chart cards */
.page-index .chart-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:1.2rem;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.6rem}
/* Visual areas fixed height */
.chart-card.gauge .g-wrap{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;height:140px;width:100%}
/* remove any leftover gauge-text spacing */
.chart-card.gauge .gauge-text{display:none}

/* Bigger radar visual and prominence order */
.chart-card.radar .radar-svg{height:170px;width:200px}
.r-med{fill:rgba(245,158,11,.25);stroke:#f59e0b;stroke-width:1.8;transition:fill .25s ease, stroke .25s ease}
.r-high{fill:rgba(239,68,68,.40);stroke:#ef4444;stroke-width:2.2;transition:fill .25s ease, stroke .25s ease}
.r-crit{fill:rgba(220,38,38,.60);stroke:#dc2626;stroke-width:2.6;transition:fill .25s ease, stroke .25s ease}
.chart-card.radar:hover .r-med{fill:rgba(245,158,11,.40);stroke:#fbbf24}
.chart-card.radar:hover .r-high{fill:rgba(239,68,68,.55);stroke:#f87171}
.chart-card.radar:hover .r-crit{fill:rgba(220,38,38,.75);stroke:#ef4444}

/* Titles/meta block: identical across all cards */
.page-index .chart-card .meta{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;margin-top:0;min-height:56px}

/* Gauge value overlay (removed from layout flow) */
.chart-card.gauge .gauge-text{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0;min-height:0}

/* Bars */
.bars .bars-wrap{display:flex;gap:.35rem;align-items:flex-end;justify-content:center;height:120px;width:100%;max-width:280px;margin:0 auto}
.bars .bar{flex:1;background:linear-gradient(180deg, var(--accent), rgba(255,255,255,.1));height:var(--h);border-radius:6px 6px 0 0;transition:height .6s ease, background .25s ease}
.chart-card:hover .bars .bar{background:linear-gradient(180deg, var(--accent-light), rgba(255,255,255,.12))}

/* Sparkline */
.spark-svg{width:100%;height:120px;display:block;margin:0 auto;max-width:320px}
.spark-path{fill:none;stroke:var(--accent);stroke-width:2;opacity:.9;transition:stroke .25s ease}
.chart-card:hover .spark-path{stroke:var(--accent-light)}

/* Analytics row */
.page-index .ref-analytics{display:grid;grid-template-columns:repeat(1, minmax(260px,1fr));gap:1rem;max-width:900px;margin:1rem auto 0}
@media(min-width:768px){.page-index .ref-analytics{grid-template-columns:1fr 1fr}}
.radar-svg{width:200px;height:200px;display:block;margin:0 auto}
.r-grid{fill:none;stroke:rgba(255,255,255,.12);stroke-width:1}
.r-shape{fill:rgba(59,130,246,.18);stroke:var(--accent);stroke-width:2;transition:fill .25s ease, stroke .25s ease}
.chart-card:hover .r-shape{fill:rgba(59,130,246,.35);stroke:var(--accent-light)}
.r-label{fill:#bdbdbd;font-size:.8rem}
.r-med{fill:rgba(245,158,11,.28);stroke:#f59e0b;stroke-width:2;transition:fill .25s ease, stroke .25s ease}
.r-high{fill:rgba(239,68,68,.30);stroke:#ef4444;stroke-width:2;transition:fill .25s ease, stroke .25s ease}
.r-crit{fill:rgba(220,38,38,.45);stroke:#dc2626;stroke-width:2;transition:fill .25s ease, stroke .25s ease}
.chart-card.radar:hover .r-med{fill:rgba(245,158,11,.45);stroke:#fbbf24}
.chart-card.radar:hover .r-high{fill:rgba(239,68,68,.45);stroke:#f87171}
.chart-card.radar:hover .r-crit{fill:rgba(220,38,38,.65);stroke:#ef4444}

/* Donut chart */
.donut .donut-graph{position:relative;width:140px;height:140px;border-radius:50%;background:conic-gradient(#ef4444 0deg, #ef4444 108deg, #f59e0b 108deg, #f59e0b 270deg, #3b82f6 270deg)}
.donut .donut-hole{position:absolute;inset:18px;border-radius:50%;background:#000;display:grid;place-items:center}
.donut .donut-hole .donut-total{color:#fff;font-weight:700;font-size:.95rem}
.donut .donut-legend{margin-top:.4rem;color:#bdbdbd;display:flex;gap:.8rem;justify-content:center;align-items:center}
.donut .donut-legend .dot{display:inline-block;width:10px;height:10px;border-radius:50%}
.donut .donut-legend .dot.crit{background:#ef4444}
.donut .donut-legend .dot.high{background:#f59e0b}
.donut .donut-legend .dot.med{background:#3b82f6}
.chart-card.donut:hover .donut-graph{filter:saturate(1.3) brightness(1.1)}

/* Hover colorization (global for charts) */
.page-index .chart-card:hover .gauge-text strong,
.page-index .chart-card:hover .meta strong{color:#fff}

/* Analytical Donut */
.donut .donut-wrap{position:relative;width:220px;height:220px}
.donut .donut-svg{position:relative;width:220px;height:220px;display:block}
.d-bg{fill:none;stroke:rgba(255,255,255,.08);stroke-width:20}
.d-seg{fill:none;stroke-width:20;transform:rotate(-90deg);transform-origin:110px 110px;transition:stroke-dasharray 1s ease, stroke .25s ease}
.d-seg.crit{stroke:#ef4444}
.d-seg.high{stroke:#f59e0b}
.d-seg.med{stroke:#3b82f6}
.donut .donut-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.donut .donut-center strong{font-size:1.4rem}
.donut .donut-center small{color:#a9a9a9}
.d-ticks line{stroke:rgba(255,255,255,.1);stroke-width:1}
.chart-card.donut:hover .d-seg.crit{stroke:#f87171}
.chart-card.donut:hover .d-seg.high{stroke:#fbbf24}
.chart-card.donut:hover .d-seg.med{stroke:#60a5fa}
.donut .donut-legend{margin-top:.4rem;color:#bdbdbd;display:grid;grid-template-columns:auto auto;gap:.4rem .8rem;justify-content:center;align-items:center}
.donut .donut-legend .dot{display:inline-block;width:10px;height:10px;border-radius:50%}
.donut .donut-legend .dot.crit{background:#ef4444}
.donut .donut-legend .dot.high{background:#f59e0b}
.donut .donut-legend .dot.med{background:#3b82f6}

/* Multi-series line chart */
.lines-svg{width:100%;height:160px;display:block}
.lines-svg .grid line{stroke:rgba(255,255,255,.08);stroke-width:1}
.series{fill:none;stroke-width:2.5;opacity:.95}
.series.crit{stroke:#ef4444}
.series.high{stroke:#f59e0b}
.series.med{stroke:#3b82f6}
.chart-card.lines:hover .series.crit{stroke:#f87171}
.chart-card.lines:hover .series.high{stroke:#fbbf24}
.chart-card.lines:hover .series.med{stroke:#60a5fa}
.line-legend{margin-top:.4rem;color:#bdbdbd;display:flex;gap:1rem;justify-content:center;align-items:center}
.line-legend .dot{display:inline-block;width:10px;height:10px;border-radius:50%}
.line-legend .dot.crit{background:#ef4444}
.line-legend .dot.high{background:#f59e0b}
.line-legend .dot.med{background:#3b82f6}

/* MTTR single-series line */
.mttr-svg{width:100%;height:160px;display:block}
.mttr-svg .grid line{stroke:rgba(255,255,255,.08);stroke-width:1}
.mttr-series{fill:none;stroke:#58a6ff;stroke-width:2.5;opacity:.95;transition:stroke .25s ease}
.chart-card.mttr-lines:hover .mttr-series{stroke:#79c0ff}
.r-dot{fill:#fff;opacity:.9}
.r-dot.crit{fill:#dc2626}
.r-dot.high{fill:#ef4444}
.r-dot.med{fill:#f59e0b}

/* SLA colorization */
.chart-card.gauge .g-fg{stroke:#22c55e}
.chart-card.gauge .gauge-text strong{color:#22c55e}
.chart-card.gauge:hover .g-fg{stroke:#86efac}

/* MTTR dots and labels */
.mttr-dots circle{fill:#79c0ff;stroke:#ffffff;stroke-width:1;opacity:.95}
.chart-card.mttr-lines:hover .mttr-dots circle{fill:#9cd1ff}
.mttr-svg .mttr-label{fill:#bdbdbd;font-size:10px;dominant-baseline:middle;text-anchor:middle}
/* Radar indicator dots (axis points) */
.r-ind{stroke:#000;stroke-width:1;opacity:.95}
.r-ind.crit{fill:#dc2626}
.r-ind.high{fill:#ef4444}
.r-ind.med{fill:#f59e0b}

/* Grouped bars (Bulgu Trendleri) */
.barsg-svg{width:100%;height:160px;display:block}
.barsg-svg .grid line{stroke:rgba(255,255,255,.08);stroke-width:1}
/* Professional palette */
.barsg-crit rect{fill:#dc2626;transition:fill .25s ease}
.barsg-high rect{fill:#ef4444;transition:fill .25s ease}
.barsg-med  rect{fill:#f59e0b;transition:fill .25s ease}
.chart-card.bars-group:hover .barsg-crit rect{fill:#ef4444}
.chart-card.bars-group:hover .barsg-high rect{fill:#f87171}
.chart-card.bars-group:hover .barsg-med rect{fill:#fbbf24}
/* Axis labels */
.barsg-label{fill:rgba(255,255,255,.65);font-size:10px;letter-spacing:.2px}

/* Success Gauge (Başarı Oranı) */
.sgauge-svg{width:120px;height:120px}
.sg-bg{fill:none;stroke:rgba(255,255,255,.08);stroke-width:10}
.sg-fg{fill:none;stroke:#22c55e;stroke-width:10;stroke-linecap:round;transition:stroke-dasharray 1s ease, stroke .25s ease}
.success-gauge .sg-text{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);font-weight:800;color:#22c55e}
.chart-card.success-gauge .g-wrap{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;height:160px;width:100%}
.chart-card.success-gauge:hover .sg-fg{stroke:#86efac}

/* Satisfaction bar */
.satbar-svg{width:100%;height:160px;display:block}
.sat-track{fill:rgba(255,255,255,.08)}
.sat-fill{fill:#3b82f6;transition:width 1000ms ease, fill .25s ease}
.chart-card.satisfaction-bar:hover .sat-fill{fill:#60a5fa}

/* Enhanced Success Gauge */
.chart-card.success-gauge .g-wrap{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;height:160px;width:100%}
.sg-fg{stroke:url(#gaugeGrad)}
.sg-target{stroke:rgba(255,255,255,.5);stroke-width:2;transform-origin:60px 60px}
.spark-svg{width:100%;height:60px;margin-top:.2rem}
.spark-path{fill:none;stroke:#60a5fa;stroke-width:2;opacity:.9}
.chart-card.success-gauge:hover .spark-path{stroke:#93c5fd}

/* Satisfaction 12-month line with band */
.satlines-svg{width:100%;height:160px;display:block}
.sat-band{fill:rgba(59,130,246,.18);stroke:none}
.sat-line{fill:none;stroke:#3b82f6;stroke-width:2.5}
.chart-card.satisfaction-lines:hover .sat-line{stroke:#60a5fa}
.sat-dots circle{fill:#3b82f6;stroke:#fff;stroke-width:1}

/* small tooltip style (native title is enough; custom can be added later) */
/* Maintain equal card heights */
.page-index .ref-charts .chart-card{height:280px;min-height:280px}

/* success gauge tick hover accent */
.chart-card.success-gauge:hover .sg-bg{stroke:rgba(255,255,255,.12)}

/* Satisfaction bar container spacing */
.chart-card.satisfaction-bar .meta strong{display:block}

/* Line charts (success & satisfaction) */
.succ-lines-svg,.satlines-svg{width:100%;height:160px;display:block}
.succ-line{fill:none;stroke:#22c55e;stroke-width:2.5}
.chart-card.success-lines:hover .succ-line{stroke:#86efac}
.succ-dots circle{fill:#22c55e;stroke:#fff;stroke-width:1}
.succ-labels text,.sat-labels text{fill:#bdbdbd;font-size:10px;dominant-baseline:hanging;text-anchor:middle}

/* Control Chart styles */
.control-svg{width:100%;height:160px;display:block}
.control-svg .grid line{stroke:rgba(255,255,255,.08);stroke-width:1}
.ctl-guideline{stroke-width:2}
.ctl-guideline.ucl,.ctl-guideline.lcl{stroke:#ef4444}
.ctl-guideline.cl{stroke:#22c55e}
.ctl-line{fill:none;stroke:#3b82f6;stroke-width:2.5}
.ctl-dots circle{fill:#3b82f6;stroke:#fff;stroke-width:1}
.ctl-tag{fill:#bdbdbd;font-size:10px}
.ctl-val{fill:#bdbdbd;font-size:10px;text-anchor:end}
.ctl-ylabel,.ctl-xlabel{fill:#bdbdbd;font-size:10px}

/* Supply Line styles */
.supply-svg{width:100%;height:160px;display:block}
.axis{stroke:rgba(255,255,255,.6);stroke-width:1.5}
.supply-svg .grid line{stroke:rgba(255,255,255,.08);stroke-width:1}
.supply-hlines line,.supply-vlines line{stroke:rgba(255,255,255,.2);stroke-dasharray:3 3}
.supply-line{fill:none;stroke:#2563eb;stroke-width:2.5}
.supply-dots circle{fill:#ef476f;stroke:#fff;stroke-width:1.5}
.supply-labels text{fill:#bdbdbd;font-size:10px;text-anchor:middle}
.axis-xlabel,.axis-ylabel{fill:#bdbdbd;font-size:10px}

/* Center titles in chart meta */
.page-index .chart-card .meta{align-items:center;justify-content:center;text-align:center;min-height:56px}
.page-index .chart-card .meta strong{font-size:1rem}

/* Larger, outlined value labels */
.value-label{fill:#e5e7eb;font-size:11px;font-weight:700;text-anchor:middle;paint-order:stroke;stroke:#000;stroke-width:2;stroke-linejoin:round}
.value-label.alt{dominant-baseline:hanging}

/* Increase control/supply axis labels */
.ctl-ylabel,.ctl-xlabel,.axis-xlabel,.axis-ylabel{font-size:11px;fill:#c8c8c8}

/* Make charts side-by-side on desktop for more width per chart content */
@media(min-width:768px){
  .page-index .ref-charts{grid-template-columns:1fr 1fr}
}

/* Stagger helpers: we will alternate label placement via JS adding .above/.below */
.value-label.above{transform:translateY(-8px)}
.value-label.below{transform:translateY(6px)}

/* Axis labels for success/satisfaction */
.succ-ylabels-left text,.sat-ylabels-left text{fill:#cfcfcf;font-size:10px;text-anchor:end}
.succ-ylabels-right text,.sat-ylabels-right text{fill:#cfcfcf;font-size:10px;text-anchor:start}
.succ-xlabels text,.sat-xlabels text{fill:#cfcfcf;font-size:10px;text-anchor:middle}

/* DDoS Live Map */
.ddos-wrap{}, .ddos-map{}, #ddosCanvas{}, .ddos-legend{}, .ddos-controls{}, .ddos-note{}

/* Leaflet map container override inside ddos */
.ddos-map .leaflet-container{}

/* Red Team offer refinement */
.cta-offer{max-width:680px}
.offer-tags{justify-content:center}
.offer-tags .tag{background:rgba(153,27,27,.10);border-color:rgba(153,27,27,.25);color:#e8e8e8}
.offer-tags .tag i{color:#b91c1c}
@media(hover:hover){ .cta-offer:hover{ border-color:rgba(153,27,27,.65); background:linear-gradient(180deg, rgba(153,27,27,.08), rgba(255,255,255,.04)) } }
@media(hover:hover){ .offer-tags .tag:hover{ background:rgba(153,27,27,.18); border-color:rgba(153,27,27,.35); color:#fff } }

/* Red Team tag hover behavior: neutral by default, burgundy on hover */
.offer-tags{justify-content:center}
.offer-tags .tag{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.10);color:#ddd}
.offer-tags .tag i{color:var(--accent);transition:color .2s ease}
@media(hover:hover){ .offer-tags .tag:hover{ background:rgba(153,27,27,.18); border-color:rgba(153,27,27,.35); color:#fff } }
@media(hover:hover){ .offer-tags .tag:hover i{ color:#b91c1c } }

/* Make inner tags react when the entire offer card is hovered */
@media(hover:hover){
  .cta-offer:hover .offer-tags .tag{
    background: rgba(153,27,27,.14);
    border-color: rgba(153,27,27,.32);
    color: #fff;
  }
  .cta-offer:hover .offer-tags .tag i{
    color: #b91c1c;
  }
}

/* Services: text-only variant */
.services-grid.text-only{counter-reset:svc;gap:1.2rem}
.services-grid.text-only .service-card{height:200px;position:relative;counter-increment:svc;background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08)}
.services-grid.text-only .service-card::before{content:"";position:absolute;inset:0;border-radius:16px;padding:1px;background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.06));-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.35;pointer-events:none}
.services-grid.text-only .service-card::after{content:none}
.services-grid.text-only .service-card-image{display:none}
.services-grid.text-only .service-card-content{height:auto;padding:1.1rem 1.2rem;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:.35rem}
.services-grid.text-only .service-card h3{font-size:1.12rem;margin-bottom:.25rem;position:relative;letter-spacing:-0.02em;font-weight:800}
.services-grid.text-only .service-card h3::after{content:none}
.services-grid.text-only .service-card p{font-size:.94rem;color:#e0e0e0;margin:.5rem 0;max-width:560px}
.services-grid.text-only .service-card-link{margin-top:.3rem;background:transparent;border:1px solid var(--accent);color:var(--accent);padding:.55rem 1rem;border-radius:999px;font-weight:700}
@media(hover:hover){
  .services-grid.text-only .service-card:hover .service-card-link{background:var(--accent);border-color:var(--accent);color:#fff}
  .services-grid.text-only .service-card:hover{box-shadow:0 18px 40px rgba(0,0,0,.5);border-color:rgba(255,255,255,.18);transform:translateY(-6px) scale(1.01)}
  .services-grid.text-only .service-card:hover::after{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.28);color:#fff}
}
.services-grid.text-only .service-card h3,
.services-grid.text-only .service-card p,
.services-grid.text-only .service-badge,
.services-grid.text-only .service-card-link{margin-left:auto;margin-right:auto}

.service-badge{display:inline-flex;align-items:center;gap:.4rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);border-radius:999px;padding:.25rem .6rem;font-size:.72rem;color:#cfcfcf;margin-bottom:.4rem}
.service-badge::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent)}
/* Accent border + hover polish */
/* remove legacy accent border */
.service-card{border-left:0}
@media(hover:hover){.service-card:hover{border-left-color:transparent}}

/* Modern Services (icon-first, text-only) */
/* Services Grid - Square Cards with Icons */
.services-grid .service-card { /* rectangular professional card */
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
  display: flex;
  flex-direction: column;
  padding: 0; /* content handles its own padding */
  box-shadow:
    0 8px 20px rgba(0,0,0,.42),             /* soft outer */
    0 0 0 1px rgba(255,255,255,.06) inset,  /* crisp edge */
    0 -1px 0 rgba(0,0,0,.25) inset;         /* base shading */
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

/* Ensure hidden cards are actually hidden (override layout rule above) */
.services-grid .service-card.hidden { display: none !important; }

.services-grid .service-icon {width:24px;height:24px;border-radius:4px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);display:grid;place-items:center;color:#cfcfcf;transition:all .2s ease}

.services-grid .service-icon i {
  font-size: .9rem;
  transition: all .25s ease;
}

.services-grid .service-card-content {height:100%;padding:1rem 1.1rem;display:grid;grid-template-columns:28px 1fr;grid-template-rows:auto auto;grid-column-gap:.7rem;align-items:center}

.services-grid .service-card h3 {grid-column:2;grid-row:1;font-size:1.02rem;font-weight:800;letter-spacing:-0.01em;margin:0;color:#f5f5f5}

.services-grid .service-card p {grid-column:2;grid-row:2;font-size:.88rem;color:#d0d0d0;margin:.55rem 0 0;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* place icon in first column spanning rows */
.services-grid .service-card .service-icon{grid-column:1;grid-row:1;align-self:center}

/* remove thin top gray line */
.services-grid .service-card::after{content:none !important}
/* remove left accent bar on hover and default */
.services-grid .service-card{border-left:0 !important}
@media(hover:hover){.services-grid .service-card:hover{border-left-color:transparent !important}}

@media (hover: hover) {
  .services-grid .service-card:hover {transform: translateY(-4px);box-shadow: 0 16px 34px rgba(0,0,0,.46), 0 0 0 1px rgba(255,255,255,.08) inset, 0 -1px 0 rgba(0,0,0,.32) inset;border-color: rgba(255,255,255,.15)}
  .services-grid .service-card:hover .service-icon {background: linear-gradient(135deg, #b91c1c, #7f1d1d);border-color: #b91c1c;color: #fff;transform: scale(1.06)}
}

/* Focus-visible: accessible outline without visual clutter */
.services-grid .service-card:focus-within {outline: 2px solid rgba(185,28,28,.5); outline-offset: 2px}

/* Motion sensitivity: reduce movement */
@media (prefers-reduced-motion: reduce) {
  .services-grid .service-card {transition: box-shadow .22s ease, border-color .22s ease}
  .services-grid .service-card:hover {transform: none}
}
@media(min-width:1024px){.services-grid{grid-template-columns:repeat(3,1fr)}}

@keyframes svcFloat{0%{transform:translateY(0)}100%{transform:translateY(-4px)}}
@keyframes svcSheen{0%{