
/* ============================= ABOUT PAGE — page hero (calmer, documentary feel) ============================= */
.phero{ position:relative; background:var(--surface); color:var(--ink); padding:clamp(7.5rem,13vw,9.5rem) 0 clamp(3.5rem,7vw,5rem); overflow:hidden; border-bottom:1px solid var(--border); }
.phero .wrap{ position:relative; z-index:1; }
.phero .logo-lockup{ height:64px; width:auto; margin-bottom:1.6rem; }
.phero h1{ color:var(--ink); font-family:var(--font-hero); font-weight:700; font-size:clamp(2.4rem,4.8vw,3.7rem); line-height:1.03; letter-spacing:0.002em; max-width:20ch; }
.phero .sub{ color:var(--ink-soft); font-size:1.08rem; line-height:1.65; max-width:62ch; margin-top:1.2rem; }
.phero .loc-strip{ display:flex; gap:clamp(1.2rem,3vw,2.4rem); flex-wrap:wrap; margin-top:2.4rem; padding-top:1.5rem; border-top:1px solid var(--border); }
.phero .loc-strip .v{ font-family:var(--font-mono); font-weight:600; font-size:1.05rem; color:var(--ink); }
.phero .loc-strip .l{ font-size:0.76rem; color:var(--muted); margin-top:0.15rem; }

/* ============================= WHO WE ARE ============================= */
.who-grid{ display:grid; grid-template-columns:0.95fr 1.05fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
@media (max-width:900px){ .who-grid{ grid-template-columns:1fr; } }
.who-grid .photo{ border-radius:var(--radius-l); overflow:hidden; border:1px solid var(--border); box-shadow:var(--shadow-1); }
.who-grid .photo img{ width:100%; display:block; }
.who-grid p{ font-size:1.02rem; line-height:1.75; color:var(--ink-soft); margin-top:1rem; }

/* ============================= CERTS SHOWCASE ============================= */
.certs-big{ margin-top:2.6rem; border:1px solid var(--border-strong); border-radius:var(--radius-l); overflow:hidden; background:#fff; box-shadow:var(--shadow-1); }
.certs-big img{ width:100%; display:block; }
.timeline{ list-style:none; margin:2.6rem 0 0; padding:0; display:flex; flex-direction:column; gap:0; }
.timeline li{ display:grid; grid-template-columns:110px 1fr; gap:1.4rem; padding:1.1rem 0; border-bottom:1px solid var(--border); }
.timeline li:last-child{ border-bottom:none; }
.timeline .yr{ font-family:var(--font-mono); font-weight:600; color:var(--blue-strong); font-size:0.98rem; }
.timeline .ev b{ color:var(--ink); }
.timeline .ev{ color:var(--ink-soft); font-size:0.95rem; line-height:1.55; }
.pspecs{ display:grid; grid-template-columns:1fr 1fr; gap:0 2.4rem; margin-top:1.8rem; padding-top:1.4rem; border-top:1px solid var(--border); }
.pspec-row{ display:flex; justify-content:space-between; align-items:baseline; gap:1rem; padding:0.48rem 0; border-bottom:1px dashed var(--border); }
.pspec-row .k{ font-size:0.82rem; color:var(--muted); }
.pspec-row .v{ font-family:var(--font-mono); font-size:0.82rem; font-weight:600; color:var(--ink); text-align:right; }
@media (max-width:640px){ .pspecs{ grid-template-columns:1fr; } }


/* ============================= CERT BAND (gerçek sertifika/tesis fotoğrafları, sayfa üstünde geniş kayar bant) ============================= */
.hero-carousel{ position:relative; overflow:hidden; }
.hero-carousel .hc-slide{ position:absolute; inset:0; opacity:0; transition:opacity .7s ease; }
.hero-carousel .hc-slide.active{ opacity:1; }
.hero-carousel img{ width:100%; height:100%; object-fit:cover; display:block; }
.hc-arrow{ position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:36px; height:36px; border-radius:50%; background:rgba(1,56,73,0.55); border:1px solid rgba(255,255,255,0.3); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background .15s ease; }
.hc-arrow:hover{ background:rgba(1,56,73,0.85); }
.hc-arrow.prev{ left:0.9rem; } .hc-arrow.next{ right:0.9rem; }
.hc-dots{ position:absolute; right:1.1rem; bottom:1.1rem; display:flex; gap:0.4rem; z-index:2; }
.hc-dots button{ width:7px; height:7px; padding:0; border-radius:50%; border:1px solid rgba(255,255,255,0.6); background:rgba(255,255,255,0.25); cursor:pointer; }
.hc-dots button.active{ background:#fff; }

.cert-band{ width:100%; height:clamp(300px,40vw,520px); background:var(--deep); border-bottom:1px solid rgba(255,255,255,0.08); }
.cert-band img{ object-fit:contain; padding:clamp(1.2rem,4vw,3rem) clamp(1.5rem,7vw,6rem); box-sizing:border-box; }
.cert-band .hero-caption{ left:clamp(1rem,4vw,2.4rem); bottom:clamp(1rem,3vw,1.6rem); }

/* ============================= HERO GLOW — enerjik ağ/sinyal dekorasyonu ============================= */
.hero-glow{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.hero-glow svg{ width:100%; height:100%; display:block; }
.hg-nodes circle{ transform-box:fill-box; transform-origin:center; filter:drop-shadow(0 0 4px currentColor) drop-shadow(0 0 11px currentColor); animation:hgNodePulse 2.2s ease-in-out infinite; }
@keyframes hgPulse{ 0%,100%{ opacity:.4; } 50%{ opacity:1; } }
@keyframes hgNodePulse{ 0%,100%{ opacity:.5; transform:scale(1); } 50%{ opacity:1; transform:scale(1.55); } }
.hg-lines path{ stroke-dasharray:10 6; stroke-linecap:round; animation:hgFlow 6.5s linear infinite; }
@keyframes hgFlow{ to{ stroke-dashoffset:-560; } }
.hg-lines[stroke="#1F9DD9"]{ color:#1F9DD9; }
.hg-lines[stroke="#6AC6B7"]{ color:#6AC6B7; }
.hg-lines[stroke-opacity="0.16"]{ stroke-opacity:0.24; }
.hg-lines[stroke-opacity="0.35"]{ stroke-opacity:0.42; }
.hg-lines path{ stroke-width:1.5px; filter:drop-shadow(0 0 1.2px currentColor); }
.hg-photons circle{ filter:drop-shadow(0 0 1.6px currentColor) drop-shadow(0 0 5px currentColor); animation-name:hgPhotonFade; animation-timing-function:linear; animation-iteration-count:infinite; }
@keyframes hgPhotonFade{ 0%,100%{ opacity:0; } 12%,55%{ opacity:1; } 90%{ opacity:0; } }

/* diyagram düğümlerine / sinyal halkalarına ince neon parıltısı */
.big-diagram svg circle[fill="none"], .lorawan-diagram svg circle[fill="none"]{ animation:hgPulse 2.8s ease-in-out infinite; }
.big-diagram svg rect[fill="none"], .lorawan-diagram svg rect[fill="none"]{ filter:drop-shadow(0 0 5px rgba(106,198,183,0.28)); }

.hero-glow.light .hg-nodes circle{ filter:none; animation:hgNodePulseLight 2.5s ease-in-out infinite; }
@keyframes hgNodePulseLight{ 0%,100%{ opacity:.42; transform:scale(1); } 50%{ opacity:1; transform:scale(1.45); } }

.section{ overflow:hidden; }
.section > .wrap{ position:relative; z-index:1; }

/* ============================= MISYON & VIZYON (light 2-col card grid, same idiom as .pillar-grid/.diff-grid) ============================= */
.mv-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-m); overflow:hidden; margin-top:2.6rem; }
@media (max-width:700px){ .mv-grid{ grid-template-columns:1fr; } }
.mv-card{ background:var(--surface); padding:1.9rem 1.9rem; }
.mv-card .mv-icon{ width:42px; height:42px; border-radius:10px; background:linear-gradient(145deg, var(--blue-soft), rgba(31,157,217,0.3)); box-shadow:0 0 0 1px rgba(31,157,217,0.25), 0 10px 22px -12px rgba(31,157,217,0.6); display:flex; align-items:center; justify-content:center; color:var(--blue-strong); margin-bottom:1.1rem; }
.mv-card .mv-icon svg{ width:20px; height:20px; }
.mv-card h3{ font-size:1.15rem; margin:0 0 0.6rem; }
.mv-card p{ font-size:0.92rem; color:var(--ink-soft); line-height:1.65; }
