/*!
 * Turla360 — About sayfası özel stilleri
 * Önceden views/front/about.php içindeki <style> bloğundaydı.
 * Tailwind utility'leriyle birlikte kullanılır (layout/spacing Tailwind'de,
 * karmaşık kompenentler burada).
 */

/* HERO */
.abt-hero { background: var(--navy, #0f2044); position: relative; overflow: hidden; }
.abt-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 70% 60% at 100% 0%, rgba(37,99,235,.25), transparent 55%), radial-gradient(ellipse 60% 70% at 0% 100%, rgba(200,140,0,.08), transparent 55%); }
.abt-hero::after { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size:60px 60px; }

.abt-tag-dot { width:7px; height:7px; border-radius:50%; background:#22d3ee; box-shadow:0 0 8px #22d3ee; }

.abt-h1 { font-family: var(--head); font-size: clamp(36px, 5vw, 56px); letter-spacing:-.04em; }
.abt-h1 em { font-style:italic; font-family: var(--serif); color: transparent; background: linear-gradient(135deg, #fbbf24, #f59e0b); -webkit-background-clip: text !important; background-clip: text !important; font-weight:600; }

.abt-h2 { font-family: var(--head); font-size: clamp(26px, 3.5vw, 36px); letter-spacing:-.03em; }
.abt-h2 em { font-style:italic; font-family: var(--serif); color:#2563eb; font-weight:600; }

.abt-label { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:#2563eb; display:flex; align-items:center; gap:6px; }
.abt-label::before { content:''; width:18px; height:2.5px; background:#2563eb; border-radius:2px; }

/* Values — hover lift */
.abt-val { transition:.25s; }
.abt-val:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(12,15,20,.1); border-color:#d0cac0; }

/* Timeline — dikey çizgi */
.abt-timeline { position:relative; }
.abt-timeline::before { content:''; position:absolute; left:20px; top:0; bottom:0; width:2px; background:#e5e7eb; border-radius:1px; }
.abt-tl-item { transition:.25s; }
.abt-tl-item:hover .abt-tl-dot { border-color:#2563eb; background:#eff6ff; }

/* Team card hover */
.abt-tm { transition:.25s; }
.abt-tm:hover { transform: translateY(-3px); box-shadow: 0 10px 32px rgba(12,15,20,.08); }
.abt-tm-av { font-family: var(--head); }

/* CTA */
.abt-cta { background:#0f2044; position:relative; overflow:hidden; }
.abt-cta::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 80% 80% at 50% 100%, rgba(37,99,235,.2), transparent 70%); }
.abt-cta-h { font-family: var(--head); }

/* Responsive (Tailwind'in breakpoint'leri yerine ek ince ayar) */
@media (max-width: 600px) {
  .abt-kpis { flex-direction: column; }
  .abt-kpi { border-right:none !important; border-bottom: 1px solid rgba(255,255,255,.08); }
  .abt-kpi:last-child { border-bottom: none; }
}