/*
 * tracing.css — v1
 * Modernización de Tracing Solutions — Target Consulting
 * Patrón: archivo independiente cargado después de style.css
 */

:root {
  --tc-blue-deep:   #0B1F4A;
  --tc-blue-mid:    #1A3A7A;
  --tc-blue-accent: #1E5FD3;
  --tc-teal:        #0D8C6D;
  --tc-teal-light:  #E6F6F2;
  --tc-cream:       #F4F6FA;
  --tc-white:       #FFFFFF;
  --tc-text:        #1F2937;
  --tc-text-mid:    #374151;
  --tc-text-muted:  #6B7280;
  --tc-border:      rgba(11,31,74,0.09);
  --tc-shadow:      0 4px 24px rgba(11,31,74,0.08);
  --tc-transition:  0.25s cubic-bezier(0.4,0,0.2,1);
}

/* ══════════════════════════════════════════
   CORRECCIÓN MARGIN-TOP NEGATIVO
   ══════════════════════════════════════════ */
section.hizmetlerr-bolumu,
.boslukhm {
  margin-top: 0 !important;
}

/* ══════════════════════════════════════════
   SECCIÓN PRINCIPAL
   ══════════════════════════════════════════ */
section.hizmetlerr-bolumu {
  background: var(--tc-cream) !important;
  padding: 60px 0 80px !important;
}

/* ══════════════════════════════════════════
   SIDEBAR DE SERVICIOS
   ══════════════════════════════════════════ */
.sidebar-service {
  background: var(--tc-white) !important;
  border-radius: 16px !important;
  padding: 8px !important;
  box-shadow: var(--tc-shadow) !important;
  border: 1px solid var(--tc-border) !important;
  overflow: hidden !important;
}

.sidebar-service .menu-service {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 13px 18px !important;
  border-radius: 10px !important;
  margin-bottom: 4px !important;
  cursor: pointer !important;
  transition: background var(--tc-transition), color var(--tc-transition) !important;
  border: none !important;
  background: transparent !important;
}

.sidebar-service .menu-service:hover {
  background: var(--tc-cream) !important;
}

.sidebar-service .menu-service.menuactive {
  background: linear-gradient(135deg, var(--tc-blue-accent), var(--tc-blue-mid)) !important;
  box-shadow: 0 4px 14px rgba(30,95,211,0.3) !important;
}

.sidebar-service .menu-service a {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--tc-text-mid) !important;
  text-decoration: none !important;
  line-height: 1.35 !important;
  pointer-events: none !important;
}

.sidebar-service .menu-service.menuactive a {
  color: var(--tc-white) !important;
}

.sidebar-service .menu-service i {
  color: var(--tc-text-muted) !important;
  font-size: 12px !important;
  flex-shrink: 0 !important;
  margin-left: 8px !important;
}

.sidebar-service .menu-service.menuactive i {
  color: rgba(255,255,255,0.7) !important;
}

/* ══════════════════════════════════════════
   FORMULARIO CALLBACK
   ══════════════════════════════════════════ */
.callbackform {
  background: var(--tc-white) !important;
  border-radius: 20px !important;
  padding: 28px 24px !important;
  box-shadow: var(--tc-shadow) !important;
  border: 1px solid var(--tc-border) !important;
}

.callbackform .h2-baslik-popup {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: var(--tc-blue-deep) !important;
  margin: 0 0 6px !important;
}

.callbackform .paragraf-popup {
  font-size: 13px !important;
  color: var(--tc-text-muted) !important;
  margin: 0 0 20px !important;
}

.callbackform .form-popup__grup {
  margin-bottom: 14px !important;
  position: relative !important;
}

.callbackform .form-popup__input {
  width: 100% !important;
  padding: 12px 14px !important;
  font-size: 13px !important;
  font-family: 'Poppins', sans-serif !important;
  color: var(--tc-text-mid) !important;
  background: var(--tc-cream) !important;
  border: 1.5px solid var(--tc-border) !important;
  border-radius: 10px !important;
  outline: none !important;
  box-sizing: border-box !important;
  transition: border-color var(--tc-transition), box-shadow var(--tc-transition) !important;
}

.callbackform .form-popup__input:focus {
  border-color: var(--tc-blue-accent) !important;
  background: var(--tc-white) !important;
  box-shadow: 0 0 0 3px rgba(30,95,211,0.10) !important;
}

.callbackform .form-popup__label {
  font-size: 11px !important;
  color: var(--tc-text-muted) !important;
  margin-top: 4px !important;
  display: block !important;
}

.callbackform .custom-button {
  width: 100% !important;
  padding: 13px !important;
  background: linear-gradient(135deg, var(--tc-blue-accent), var(--tc-blue-mid)) !important;
  color: var(--tc-white) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  font-family: 'Poppins', sans-serif !important;
  border: none !important;
  border-radius: 10px !important;
  cursor: pointer !important;
  letter-spacing: 0.5px !important;
  box-shadow: 0 4px 14px rgba(30,95,211,0.3) !important;
  transition: transform var(--tc-transition), box-shadow var(--tc-transition) !important;
}

.callbackform .custom-button:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 22px rgba(30,95,211,0.4) !important;
}

/* ══════════════════════════════════════════
   IMAGEN PRINCIPAL
   ══════════════════════════════════════════ */
.galeri__gorsel--3 {
  border-radius: 20px !important;
  box-shadow: 0 12px 40px rgba(11,31,74,0.15) !important;
  width: 100% !important;
  height: auto !important;
}

/* ══════════════════════════════════════════
   TÍTULO PRINCIPAL
   ══════════════════════════════════════════ */
.h2-baslik-anasayfa-ozel {
  font-size: clamp(1.3rem, 2.5vw, 1.9rem) !important;
  font-weight: 800 !important;
  color: var(--tc-blue-deep) !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em !important;
}

/* ══════════════════════════════════════════
   PÁRRAFO DESCRIPCIÓN
   ══════════════════════════════════════════ */
section.hizmetlerr-bolumu .paragraf {
  font-size: 15px !important;
  color: var(--tc-text-mid) !important;
  line-height: 1.8 !important;
}

/* Ocultar divider imagen fea */
.divider {
  display: none !important;
}

/* ══════════════════════════════════════════
   TARJETAS DE CARACTERÍSTICAS (paketler4)
   ══════════════════════════════════════════ */
.tabloozellik {
  display: flex !important;
  gap: 20px !important;
  flex-wrap: wrap !important;
}

.tabloozellik .tablo--1-ve-2 {
  flex: 1 1 240px !important;
  float: none !important;
}

.paketler4 {
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: var(--tc-shadow) !important;
  border: 1px solid var(--tc-border) !important;
  transition: transform var(--tc-transition), box-shadow var(--tc-transition) !important;
  height: 220px !important;
}

.paketler4:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 16px 40px rgba(11,31,74,0.14) !important;
}

.paketler4__on--onyazi {
  background: linear-gradient(135deg, var(--tc-blue-deep), var(--tc-blue-mid)) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
  padding: 32px !important;
}

.paketler4__on--onyazi .icon i {
  font-size: 40px !important;
  color: rgba(255,255,255,0.25) !important;
  display: block !important;
  margin-bottom: 16px !important;
}

.paketler4__on--onyazi .baslik-3 {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: var(--tc-white) !important;
  text-align: center !important;
  margin: 0 !important;
}

.paketler4__on--arkayazi {
  background: var(--tc-white) !important;
  padding: 28px !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
}

.paketler4__on--arkayazi .baslik-orta {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--tc-blue-deep) !important;
  margin: 0 0 10px !important;
}

.paketler4__on--arkayazi .services-kutu2--yazi1 {
  font-size: 13px !important;
  color: var(--tc-text-muted) !important;
  line-height: 1.7 !important;
  margin: 0 !important;
}

/* ══════════════════════════════════════════
   BOSLUK — ocultar espaciadores excesivos
   ══════════════════════════════════════════ */
.boslukhm { display: none !important; }
.bosluk3  { margin-top: 20px !important; }
.bosluk333 { margin-top: 8px !important; }