/* =========================================
   KOMUT ROTASI — ANA SAYFA CSS
   Fluid tasarım — clamp + auto-fit grid
   ========================================= */

@keyframes fadeUp   { from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);} }
@keyframes blink    { 0%,100%{opacity:1;}50%{opacity:0;} }
@keyframes dot      { 0%,100%{opacity:1;transform:scale(1);}50%{opacity:.4;transform:scale(.7);} }
@keyframes floatOrb { 0%,100%{transform:translate(0,0) scale(1);}33%{transform:translate(30px,-20px) scale(1.05);}66%{transform:translate(-20px,15px) scale(.97);} }
@keyframes scanline { 0%{transform:translateY(-100%);}100%{transform:translateY(100vh);} }
@keyframes gradShift{ 0%,100%{background-position:0% 50%;}50%{background-position:100% 50%;} }
@keyframes discoverShift {
  0% { background-position: 0% 50%; box-shadow: 0 14px 34px rgba(0,212,255,.28), 0 0 0 2px rgba(255,255,255,.12); }
  33% { background-position: 50% 50%; box-shadow: 0 14px 34px rgba(255,107,53,.28), 0 0 0 2px rgba(255,255,255,.16); }
  66% { background-position: 100% 50%; box-shadow: 0 14px 34px rgba(16,185,129,.28), 0 0 0 2px rgba(255,255,255,.14); }
  100% { background-position: 0% 50%; box-shadow: 0 14px 34px rgba(0,212,255,.28), 0 0 0 2px rgba(255,255,255,.12); }
}

/* Ana sayfa terminal yukseklik kesin son override */
html body .hero .hero-right .hero-terminal {
  max-height: none !important;
  min-height: clamp(320px, 30vw, 455px) !important;
}

html body .hero .hero-right .hero-terminal .terminal-body,
html body .hero .hero-right .hero-terminal #termBody {
  height: clamp(280px, 25vw, 400px) !important;
  min-height: clamp(280px, 25vw, 400px) !important;
  max-height: min(52vh, 430px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* Terminal son duzeltme: onceki responsive bloklarin kesme/ellipsis kurallarini ezer */
.hero-terminal .terminal-body,
.hero-terminal #termBody {
  min-height: clamp(260px, 24vw, 390px) !important;
  height: clamp(260px, 24vw, 390px) !important;
  max-height: min(46vh, 430px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-width: thin !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  font-size: clamp(.6rem, .74vw, .82rem) !important;
  line-height: 1.48 !important;
}

.hero-terminal .terminal-body .tl,
.hero-terminal #termBody .tl {
  display: block !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: visible !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
}

.hero-terminal .tl-muted,
.hero-terminal .terminal-body .tl-muted,
.hero-terminal #termBody .tl-muted {
  color: #8b9bb4 !important;
}

.hero-terminal .terminal-body .tl-course-row,
.hero-terminal #termBody .tl-course-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(82px, auto) !important;
  column-gap: .45rem !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
  white-space: normal !important;
}

.hero-terminal .terminal-body .tl-course-row .tl-name,
.hero-terminal #termBody .tl-course-row .tl-name,
.hero-terminal .terminal-body .tl-course-row .tl-tag,
.hero-terminal #termBody .tl-course-row .tl-tag {
  min-width: 0 !important;
  overflow: visible !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
}

/* ── AMBIENT ── */
.ambient {
  position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(ellipse 60% 40% at 15% 25%, var(--hero-orb1) 0%, transparent 60%),
    radial-gradient(ellipse 50% 50% at 85% 75%, var(--hero-orb2) 0%, transparent 60%),
    radial-gradient(ellipse 40% 30% at 50% 10%, var(--hero-orb3) 0%, transparent 60%);
  transition:background .35s;
}

.wrap { position:relative; z-index:1; }

/* ── HERO ── */
.hero-section {
  position: relative; overflow: hidden;
  border-bottom: 1px solid var(--border);
  height: calc(100vh - clamp(56px, 4.5vw, 78px));
  display: flex; flex-direction: column; justify-content: center;
}

.hero-bg { position:absolute; inset:0; pointer-events:none; z-index:0; }
.hero-orb { position:absolute; border-radius:50%; filter:blur(80px); animation:floatOrb 12s ease-in-out infinite; }
.hero-orb-1 { width:min(700px,60vw); height:min(700px,60vw); background:radial-gradient(circle,var(--hero-orb1) 0%,transparent 70%); top:-200px; left:-100px; animation-delay:0s; }
.hero-orb-2 { width:min(500px,45vw); height:min(500px,45vw); background:radial-gradient(circle,var(--hero-orb2) 0%,transparent 70%); top:100px; right:100px; animation-delay:-4s; }
.hero-orb-3 { width:min(350px,30vw); height:min(350px,30vw); background:radial-gradient(circle,var(--hero-orb3) 0%,transparent 70%); bottom:-50px; left:40%; animation-delay:-8s; }

.hero-scan { position:absolute; inset:0; pointer-events:none; z-index:1; overflow:hidden; }
.hero-scan::after {
  content:''; position:absolute; left:0; right:0; height:120px;
  background:linear-gradient(to bottom,transparent,rgba(255,255,255,.018),transparent);
  animation:scanline 6s linear infinite;
}

.hero-inner {
  width: min(94vw, 1800px);
  margin-inline: auto;
  position:relative; z-index:2;
  /* Alt padding ticker yüksekliği kadar artırıldı — istatistikler ticker'a binmez */
  padding: clamp(2rem, 4vw, 5rem) clamp(3rem, 6vw, 8rem) clamp(2rem, 4vw, 5rem) clamp(1rem, 2vw, 2rem);
  display:flex; gap:clamp(1.5rem, 3vw, 4rem); align-items:center;
}

.hero-left {
  flex:1.2; min-width:0;
  animation:fadeUp .5s .05s both;
  
}

.hero-badge {
  display:inline-flex; align-items:center; gap:8px;
  font-family:'JetBrains Mono',monospace;
  font-size:clamp(9px, .65vw, 12px);
  font-weight:600; color:var(--accent); letter-spacing:2px; text-transform:uppercase;
  background:rgba(0,212,255,.1); border:1px solid rgba(0,212,255,.35);
  padding:clamp(5px,.5vw,9px) clamp(12px,1.2vw,20px); border-radius:30px; margin-bottom:clamp(.5rem,1vw,1rem);
  box-shadow:0 0 24px rgba(0,212,255,.12);
}
.hero-badge-dot {
  width:7px; height:7px; border-radius:50%;
  background:var(--accent); animation:dot 1.5s ease-in-out infinite;
  box-shadow:0 0 8px rgba(0,212,255,.8);
}

.hero-h1 {
  /* clamp: min 1.8rem, ideal 4vw, max 4.5rem — ekrana göre otomatik büyür */
  font-size: clamp(2rem, 4vw, 4.8rem);
  font-weight:800; line-height:1.04; letter-spacing:-.04em;
  margin-bottom:clamp(.8rem,1.5vw,1.4rem); animation:fadeUp .6s .1s ease both;
}
.h1-plain { display:block; color:var(--text); }
.h1-glow {
  display:block;
  background:linear-gradient(135deg,#3d8bff 0%,#a855f7 50%,#00d4a0 100%);
  background-size:200% auto;
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  animation:gradShift 5s linear infinite;
  filter:drop-shadow(0 0 30px rgba(61,139,255,.4));
}

.hero-desc {
  color:var(--text2); font-size: clamp(1rem, 1.2vw, 1.25rem);
  margin-bottom:clamp(.6rem,1.2vw,1.4rem); max-width:min(760px, 52vw); line-height:1.7;
  animation:fadeUp .6s .2s ease both;
}
.hero-desc-line { display:block; min-height:1.7em; }
.hero-type-part { display:inline; }
.hero-desc-arrow {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0 .5rem;
  color:var(--accent);
  font-size:.85em;
  opacity:0;
  transform:translateX(-4px);
  transition:opacity .18s ease, transform .18s ease;
}
.hero-desc-arrow.show {
  opacity:1;
  transform:translateX(0);
}
.hero-desc-arrow-long { color:#10b981; }
.hero-desc-line.typing::after {
  content:'';
  display:inline-block;
  width:2px; height:1em;
  margin-left:3px;
  background:var(--accent);
  vertical-align:-.12em;
  animation:blink .75s step-end infinite;
}

.hero-actions { display:flex; align-items:center; gap:clamp(.6rem,1.2vw,1.2rem); flex-wrap:wrap; margin-bottom:clamp(.6rem,1.2vw,1.4rem); }

.hero-actions .hero-cta {
  /* Aynı yeşil→limon→amber tonlarının bir kademe koyusu: açık limon/amber
     uçlarda beyaz yazı iki temada da ~2.0'dı, şimdi ≥4.9 (25 Eylül 2026). */
  background:
    linear-gradient(135deg, #15803d 0%, #4d7c0f 48%, #b45309 100%) !important;
  background-size: 240% 240% !important;
  background-position: 0% 50%;
  color:#fff; padding:clamp(.6rem,1vw,1.1rem) clamp(1.2rem,2vw,2.5rem); border-radius:12px;
  font-weight:700; font-size:clamp(.82rem,1vw,1.05rem); border:none; cursor:pointer;
  text-decoration:none; transition:all .3s; font-family:'Sora',sans-serif;
  box-shadow:0 10px 32px rgba(22,163,74,.28), 0 0 0 3px rgba(132,204,22,.14);
  display:inline-flex; align-items:center; gap:.6rem; letter-spacing:-.01em;
  animation: heroCtaAkis 4s ease-in-out infinite;
  overflow: hidden;
  position: relative;
  isolation: isolate;
}
.hero-actions .hero-cta:hover {
  transform:translateY(-3px);
  background-position: 100% 50% !important;
  box-shadow:0 14px 42px rgba(245,158,11,.3), 0 0 0 4px rgba(132,204,22,.16);
}

.hero-actions .hero-cta::after {
  content: '';
  position: absolute;
  inset: -40% auto -40% -70%;
  width: 42%;
  transform: skewX(-18deg);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .74), transparent);
  opacity: .68;
  z-index: -1;
  animation: heroCtaIsik 3s ease-in-out infinite;
}

.hero-cta-outline {
  background:rgba(255,255,255,.04); color:var(--text);
  padding:clamp(.6rem,1vw,1.1rem) clamp(1rem,1.8vw,2.2rem); border-radius:12px;
  font-weight:600; font-size:clamp(.82rem,1vw,1.05rem); cursor:pointer;
  border:1px solid rgba(255,255,255,.15); transition:all .3s;
  text-decoration:none; font-family:'Sora',sans-serif;
  display:inline-flex; align-items:center; gap:.6rem;
  backdrop-filter:blur(8px); letter-spacing:-.01em;
}
.hero-cta-outline:hover { border-color:var(--accent); color:var(--accent); background:rgba(0,212,255,.08); box-shadow:0 4px 20px rgba(0,212,255,.15); }

.hero-cta-giris {
  background: linear-gradient(135deg, #0891b2, var(--primary, #00d4ff), #2563eb);
  background-size: 220% 220%;
  color: #fff;
  padding: clamp(.6rem, 1vw, 1.1rem) clamp(1rem, 1.8vw, 2.2rem);
  border-radius: 12px;
  font-weight: 800;
  font-size: clamp(.82rem, 1vw, 1.05rem);
  border: 1px solid rgba(255, 255, 255, .22);
  text-decoration: none;
  font-family: 'Sora', sans-serif;
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  backdrop-filter: blur(8px);
  letter-spacing: 0;
  box-shadow: 0 12px 34px rgba(var(--primary-rgb, 0, 212, 255), .28), 0 0 0 4px rgba(37, 99, 235, .1);
  transition: all .3s;
  animation: heroGirisParla 4s ease-in-out infinite;
  overflow: hidden;
  position: relative;
  isolation: isolate;
}

.hero-cta-giris:hover {
  transform: translateY(-3px);
  background-position: 100% 50%;
  border-color: rgba(255, 255, 255, .36);
  box-shadow: 0 16px 44px rgba(37, 99, 235, .32), 0 0 0 5px rgba(var(--primary-rgb, 0, 212, 255), .14);
}

.hero-cta-giris::after {
  content: '';
  position: absolute;
  inset: -40% auto -40% -70%;
  width: 42%;
  transform: skewX(-18deg);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .78), transparent);
  opacity: .72;
  z-index: -1;
  animation: heroGirisIsik 2.8s ease-in-out infinite;
}

@keyframes heroCtaAkis {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

@keyframes heroCtaIsik {
  0% { left: -70%; opacity: 0; }
  18% { opacity: .68; }
  48% { left: 128%; opacity: .42; }
  100% { left: 128%; opacity: 0; }
}

@keyframes heroGirisParla {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

@keyframes heroGirisIsik {
  0% { left: -70%; opacity: 0; }
  18% { opacity: .72; }
  48% { left: 128%; opacity: .45; }
  100% { left: 128%; opacity: 0; }
}

.hero-stats { display:flex; align-items:center; gap:clamp(1rem,2.5vw,3rem); animation:fadeUp .6s .35s ease both; flex-wrap:wrap; }
.hero-stat { display:flex; flex-direction:column; gap:.15rem; }
.hero-stat-val { font-family:'JetBrains Mono',monospace; font-size:clamp(1.1rem,1.8vw,2rem); font-weight:800; color:var(--text); line-height:1; }
.hero-stat-val span { color:var(--accent); }
.hero-stat-lbl { font-size:clamp(.6rem,.72vw,.78rem); color:var(--text3); text-transform:uppercase; letter-spacing:.1em; font-weight:600; }
.hero-stat-sep { width:1px; height:36px; background:var(--border); }

.hero-right {
  flex:1; min-width:0;
  display:flex; flex-direction:column; gap:clamp(.6rem,1vw,1rem);
  animation:fadeUp .5s .18s both;
  padding-top:clamp(.5rem,1.5vw,1.5rem);
  padding-left: clamp(2rem, 3vw, 4rem);
}

/* ── TERMİNAL ── */
.hero-terminal {
  position:relative;
  left:clamp(1.5rem, 3vw, 4rem);
  background:var(--card); border:1px solid var(--border);
  border-radius: 14px; overflow:hidden;
  box-shadow:var(--glow), 0 40px 80px rgba(0,0,0,.5);
  animation:fadeUp .6s .2s ease both;
}
.terminal-bar {
  background: #1e2232;
  padding: clamp(.5rem,.75vw,.85rem) clamp(.75rem,1vw,1.1rem);
  display: flex; align-items: center; gap: .5rem;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.terminal-dots { display:flex; gap:6px; }
.terminal-dot { width:clamp(9px,1vw,13px); height:clamp(9px,1vw,13px); border-radius:50%; }
.td-r { background:#ff5f57; }
.td-y { background:#febc2e; }
.td-g { background:#28c840; }
.terminal-title { margin-left:auto; font-size:clamp(.62rem,.72vw,.78rem); color:var(--text3); font-family:'JetBrains Mono',monospace; }
.terminal-body {
  padding: clamp(.8rem,1.25vw,1.5rem) clamp(1rem,1.5vw,1.8rem);
  font-family: 'JetBrains Mono', monospace;
  font-size: clamp(.78rem, .95vw, 1.05rem);
  line-height: 1.8;
  background: #12151f;
  color: #cdd5e0;
  min-height: clamp(180px, 20vw, 280px);
  overflow-y: auto;
}

.tl { display:block !important; margin-bottom:2px; opacity:0; max-width:100%; overflow-wrap:anywhere; white-space:normal !important; }
.tl.show { opacity:1; }
.tl-p { color:var(--accent); flex-shrink:0; font-weight:700; }
.tl-cmd { color:#e4eaf8; }
.tl-ok { color:#00d4a0; }
.tl-warn { color:#ffa940; }
.tl-hi { color:var(--accent); }
.tl-muted { color:#8b9bb4 !important; }
.tl-name { display:inline-block; min-width:210px; color:#00d4ff; }
.tl-arrow { display:inline-block; color:#fb923c; padding:0 .55rem; font-weight:900; white-space:nowrap; }
.tl-tag { font-weight:700; }
.tl-tag-learn { color:#10b981; }
.tl-tag-build { color:#f59e0b; }
.tl-tag-mobile { color:#a78bfa; }
.tl-tag-code { color:#60a5fa; }
.tl-tag-track { color:#f472b6; }
.tl-tag-help { color:#f87171; }
.terminal-body .tl-course-row,
#termBody .tl-course-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(90px, auto);
  align-items: baseline;
  column-gap: .7rem;
  width: 100%;
  white-space: normal;
}
.terminal-body .tl-course-row .tl-name,
#termBody .tl-course-row .tl-name {
  min-width: 0;
  font-weight: 800;
  overflow-wrap: anywhere;
}
.terminal-body .tl-course-row .tl-arrow,
#termBody .tl-course-row .tl-arrow {
  justify-self: center;
}
.terminal-body .tl-course-row .tl-tag,
#termBody .tl-course-row .tl-tag {
  justify-self: end;
  text-align: right;
  white-space: normal;
  font-weight: 900;
}
.tl-cursor {
  display:inline-block; width:8px; height:clamp(12px,1vw,16px);
  background:var(--accent); vertical-align:middle; margin-left:2px;
  animation:blink .9s step-end infinite;
}
.hero-mini-card {
  background:var(--card); border:1px solid var(--border); border-radius:12px;
  padding:clamp(.7rem,1vw,1.2rem) clamp(.8rem,1.1vw,1.3rem);
  display:flex; align-items:center; gap:clamp(.5rem,.85vw,1rem);
  transition:border-color .2s, transform .2s; position:relative; overflow:hidden;
}
.hero-mini-card::before {
  content:''; position:absolute; inset:0; opacity:0;
  background:radial-gradient(ellipse 80% 70% at 0% 0%,color-mix(in srgb,var(--accent) 8%,transparent),transparent);
  transition:opacity .3s;
}
.hero-mini-card:hover { border-color:color-mix(in srgb,var(--accent) 40%,transparent); transform:translateY(-2px); }
.hero-mini-card:hover::before { opacity:1; }

/* ── SECTION ── */
.section { padding-block: clamp(.8rem,1.5vw,1.5rem) clamp(1rem,2vw,2rem); }
.section:has(.modules-grid) { padding-bottom:0; }
.section-head { margin-bottom:clamp(.8rem,1.2vw,1.4rem); text-align: center; }
.section-label {
  display:inline-flex; align-items:center; gap:.4rem; justify-content: center;
  font-size:clamp(.6rem,.68vw,.75rem); font-family:'JetBrains Mono',monospace; font-weight:700;
  color:color-mix(in srgb, var(--accent) 75%, var(--text1)); text-transform:uppercase; letter-spacing:.12em; margin-bottom:.65rem;
}
.section-label::before { content:''; width:16px; height:1px; background:var(--accent); }
.section-label::after { content:''; width:16px; height:1px; background:var(--accent); }
.section-title { font-size:clamp(1.2rem,1.75vw,2rem); font-weight:800; letter-spacing:-.03em; color:var(--text); }
.section-title span { background:linear-gradient(135deg,var(--accent),var(--accent2)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.section-sub { font-size:clamp(.78rem,.92vw,1rem); color:var(--text2); margin-top:.4rem; margin-inline: auto; max-width: 600px; }

/* ── KİŞİSEL DEVAM ŞERİDİ ──
   Öğrenci Merkezi ana sayfada kart değil, veriye bağlı bir şerittir:
   kap (#anaDevam) boş ve `hidden` gelir; yalnız bu cihazda kayıtlı
   ilerleme varsa anasayfa.js içini doldurup görünür yapar.
   Renkler CLAUDE.md §7 gereği yalnız tema değişkenlerinden gelir. */
.ana-devam { margin-bottom:clamp(.8rem,1.5vw,1.6rem); animation:fadeUp .5s both; }
.ana-devam-ic {
  display:flex; align-items:center; flex-wrap:wrap;
  gap:clamp(.7rem,1.2vw,1.4rem);
  padding:clamp(.7rem,1vw,1.1rem) clamp(.9rem,1.4vw,1.5rem);
  background:var(--card); border:1px solid var(--border);
  border-left:3px solid var(--primary); border-radius:var(--r);
}
.ana-devam-ikon {
  width:clamp(32px,2.4vw,40px); height:clamp(32px,2.4vw,40px); flex-shrink:0;
  border-radius:10px; display:grid; place-items:center;
  background:rgba(var(--primary-rgb),.12); color:var(--primary);
  font-size:clamp(.9rem,1vw,1.1rem);
}
.ana-devam-metin { flex:1 1 12rem; min-width:0; }
.ana-devam-baslik { font-size:clamp(.82rem,.95vw,1rem); font-weight:800; color:var(--text); letter-spacing:-.02em; }
.ana-devam-alt { margin-top:.18rem; font-family:'JetBrains Mono',monospace; font-size:clamp(.62rem,.72vw,.78rem); color:var(--text3); }
.ana-devam-cubuk { flex:1 1 8rem; height:6px; border-radius:999px; background:var(--border2); overflow:hidden; }
/* Genişlik satır içi style ile değil, JS'te CSSOM üzerinden yazılır:
   CSP style-src 'self' satır içi style özniteliğini engeller. */
.ana-devam-dolgu {
  display:block; height:100%; width:0; border-radius:999px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  transition:width .6s ease;
}
.ana-devam-eylem { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.ana-devam-btn {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.38rem .85rem; border-radius:999px;
  border:1px solid var(--border); text-decoration:none;
  font-size:clamp(.68rem,.78vw,.82rem); font-weight:700; color:var(--text2);
  transition:color .2s, border-color .2s, background .2s;
}
.ana-devam-btn:hover { color:var(--text); border-color:var(--primary); }
.ana-devam-btn-birincil {
  background:rgba(var(--primary-rgb),.12);
  border-color:rgba(var(--primary-rgb),.35);
  color:var(--primary);
}
.ana-devam-btn-birincil:hover { background:rgba(var(--primary-rgb),.2); color:var(--primary); }

@media (max-width:600px) {
  .ana-devam-cubuk { flex-basis:100%; order:3; }
  .ana-devam-eylem { order:4; width:100%; }
  .ana-devam-btn   { flex:1 1 auto; justify-content:center; }
}

/* ── MODULE CARDS ──
   auto-fit: ekran genişliğine göre otomatik sütun sayısı
   minmax(min(280px, 100%), 1fr): en az 280px, kalan alanı eşit böl */
.modules-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:clamp(.5rem,.75vw,1rem);
}

.mod-card {
  background:var(--card); border:2px solid var(--mc-border,var(--border)); border-radius:var(--r);
  border-top:4px solid var(--mc-solid,var(--border));
  padding:clamp(.7rem,1vw,1.2rem); cursor:pointer; text-decoration:none;
  position:relative; overflow:hidden;
  transition:transform .25s, border-color .25s, box-shadow .25s;
  display:flex; flex-direction:column; gap:.5rem;
  animation:fadeUp .5s both;
}
.mod-card::after {
  content:''; position:absolute; inset:0 0 auto 0; height:70px;
  background:linear-gradient(180deg,var(--mc,rgba(0,212,255,.06)),transparent);
  pointer-events:none;
}
.mod-card::before {
  content:''; position:absolute; inset:0; opacity:0;
  background:radial-gradient(ellipse 80% 60% at var(--mx,50%) var(--my,50%),var(--mc,rgba(0,212,255,.06)),transparent 70%);
  transition:opacity .3s; pointer-events:none;
}
.mod-card:hover { transform:translateY(-4px); box-shadow:0 12px 40px rgba(0,0,0,.35); }
.mod-card:hover::before { opacity:1; }
.mod-card:nth-child(1){animation-delay:.05s;} .mod-card:nth-child(2){animation-delay:.1s;}
.mod-card:nth-child(3){animation-delay:.15s;} .mod-card:nth-child(4){animation-delay:.2s;}
.mod-card:nth-child(5){animation-delay:.25s;} .mod-card:nth-child(6){animation-delay:.3s;}

.mod-icon-wrap { width:clamp(44px,3.6vw,58px); height:clamp(44px,3.6vw,58px); border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:clamp(1.5rem,2.4vw,2.1rem); line-height:1; flex-shrink:0; position:relative; background:transparent; }
.mod-icon-wrap span { font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif; }

/* 24 Eylül 2026: önce Yapay Zeka kartında denenip onaylanan düzen, altı
   modül kartının tamamına yayıldı (index.html'deki .emoji-fon sınıfı).
   Emoji çerçevesiz, kart yüksekliğince büyük, soluk bir fon olarak sola
   hizalanıyor; kart metni sağa yaslı, en üstten başlayıp emojinin üzerine
   yazılıyor. Seçici .mc-* renk bloklarından SONRA geldiği için değil,
   daha yüksek özgüllükle (.mod-card.emoji-fon) kazanıyor: yoksa .mc-cyan
   gibi renk sınıflarının ikon çerçevesi geri geliyor. Konumlandırma
   .mod-head'e değil karta göre yapılır. */
.mod-card.emoji-fon .mod-icon-wrap {
  /* Emoji kartın tüm yüksekliğini kaplar; footer satırının da altından
     geçer. Footer yazıları bunun üstünde kalın/renkli yazılarak
     belirginleştirilir (aşağıdaki .mod-meta / .mod-pill kuralları). */
  position:absolute; inset:0 auto 0 .35rem; width:auto; height:auto;
  border:0; border-radius:0; background:transparent;
  /* Glif, kutudan büyük olursa kırpılıp "taşmış" görünüyor; ölçülen
     kutu yüksekliğine sığacak boyut seçildi (24 Eylül 2026). */
  font-size:clamp(5rem,13.5vw,10.5rem); opacity:.32;
  overflow:hidden; pointer-events:none; z-index:0;
}
/* Telefon emojisinin renkli uygulama ızgarası diğer emojilere göre çok
   daha "kalabalık"; aynı opaklıkta alt satır yazısının arkasında desen
   gürültüsü yapıyor. Yalnız bu kartta biraz daha soluk (25 Eylül 2026). */
.mod-card.emoji-fon.mc-violet .mod-icon-wrap { opacity:.2; }
.mod-card.emoji-fon .mod-head { justify-content:flex-end; }
.mod-card.emoji-fon .mod-arrow,
.mod-card.emoji-fon .mod-head + div,
.mod-card.emoji-fon .mod-footer { position:relative; z-index:2; }

/* Modül adı: ortada-yukarıda, modül rengine bağlı yatay kapsül rozet
   (kullanıcının gönderdiği "AKTİF PLATFORM" rozeti örnek alındı).
   Renk sabiti yok; hepsi kartın --mc-solid değişkeninden türetiliyor. */
.mod-card.emoji-fon .mod-head + div {
  display:flex; flex-direction:column; align-items:flex-end;
  text-align:right; gap:.5rem;
}
.mod-card.emoji-fon .mod-name {
  order:-1; margin-top:0;
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.42rem 1.05rem; border-radius:999px;
  background:color-mix(in srgb, var(--mc-solid) 12%, var(--card));
  border:1.5px solid color-mix(in srgb, var(--mc-solid) 45%, transparent);
  color:var(--mc-solid);
  font-family:'JetBrains Mono',monospace;
  font-size:clamp(.72rem,.88vw,.92rem); font-weight:800;
  letter-spacing:.09em; text-transform:uppercase;
}
.mod-card.emoji-fon .mod-name::before {
  content:''; width:.46rem; height:.46rem; border-radius:50%;
  background:currentColor; flex-shrink:0;
}
/* Footer satırı artık emojinin üzerinde duruyor: metin kalınlaştırılıp
   modül rengine bağlanıyor, durum rozetinin zemini de biraz kapatıcı
   yapılıyor ki soluk emoji desenine karışmasın. */
.mod-card.emoji-fon .mod-meta {
  font-weight:700; color:var(--mc-solid);
}
.mod-card.emoji-fon .mod-pill {
  font-weight:800;
  background:color-mix(in srgb, var(--mc-solid) 16%, var(--card));
}
.mod-head { display:flex; align-items:flex-start; justify-content:space-between; gap:.5rem; }
.mod-arrow { color:var(--text3); font-size:clamp(.8rem,.9vw,1rem); transition:color .2s,transform .2s; flex-shrink:0; margin-top:.2rem; }
.mod-card:hover .mod-arrow { color:var(--accent); transform:translate(2px,-2px); }
.mod-tag { display:inline-flex; align-items:center; gap:.35rem; padding:.18rem .6rem; border-radius:20px; font-size:clamp(.58rem,.65vw,.72rem); font-family:'JetBrains Mono',monospace; font-weight:700; text-transform:uppercase; letter-spacing:.06em; border:1px solid currentColor; }
.mod-name { font-size:clamp(.88rem,1.08vw,1.2rem); font-weight:800; color:var(--text); letter-spacing:-.02em; margin-top:.5rem; }
.mod-desc { font-size:clamp(.72rem,.82vw,.9rem); color:var(--text2); line-height:1.6; }
.mod-footer { display:flex; align-items:center; justify-content:space-between; padding-top:.5rem; border-top:1px solid var(--border2); margin-top:auto; }
.mod-meta { font-size:clamp(.62rem,.72vw,.78rem); color:var(--text3); font-family:'JetBrains Mono',monospace; }
.mod-pill { padding:.18rem .65rem; border-radius:20px; font-size:clamp(.58rem,.66vw,.72rem); font-weight:700; font-family:'JetBrains Mono',monospace; }

/* 24 Eylül 2026: kullanıcı 6 karttan 3'ünün (cyan/mavi/primary) aynı mavi
   aileden olup birbirinden ayrışmadığını, renklerin daha koyu ve
   çerçevelerin daha belirgin olmasını istedi. Altı kart artık 6 ayrı renk
   ailesinden (camgöbeği, mor, yeşil, amber, kurumsal mavi, kırmızı), hepsi
   koyu/doygun tonda; çerçeve rengi %35→%55 opaklığa çıktı. */
.mc-cyan   { --mc:rgba(14,116,144,.08); --mc-border:rgba(14,116,144,.55); --mc-solid:#0e7490; }
.mc-cyan   .mod-icon-wrap { border:1.5px solid rgba(14,116,144,.45); color:#0e7490; }
.mc-cyan   .mod-tag  { color:#0e7490; border-color:rgba(14,116,144,.5); }
.mc-cyan   .mod-pill { background:rgba(14,116,144,.14); color:#0e7490; }
.mc-violet { --mc:rgba(124,58,237,.08); --mc-border:rgba(124,58,237,.55); --mc-solid:#7c3aed; }
.mc-violet .mod-icon-wrap { border:1.5px solid rgba(124,58,237,.45); color:#7c3aed; }
.mc-violet .mod-tag  { color:#7c3aed; border-color:rgba(124,58,237,.5); }
.mc-violet .mod-pill { background:rgba(124,58,237,.14); color:#7c3aed; }
.mc-green  { --mc:rgba(21,128,61,.08); --mc-border:rgba(21,128,61,.55); --mc-solid:#15803d; }
.mc-green  .mod-icon-wrap { border:1.5px solid rgba(21,128,61,.45); color:#15803d; }
.mc-green  .mod-tag  { color:#15803d; border-color:rgba(21,128,61,.5); }
.mc-green  .mod-pill { background:rgba(21,128,61,.14); color:#15803d; }
/* .mc-orange kaldırıldı: tek kullanıcısı ana sayfadaki Öğrenci Merkezi
   kartıydı, o kart da şeride dönüştü. Çağıranı kalmayan yüzey
   bırakılmaz (CLAUDE.md §8.1). */
/* .mc-blue sınıf adı tarihseldir (Programlama Eğitimi); mavi aile üç kartta
   (cyan/blue/primary) çakıştığı için rengi amber'a çevrildi, sınıf adı
   (tek kullanıcı: index.html) HTML tarafında iz sürmeyi kolaylaştırmak
   için değiştirilmedi. */
.mc-blue   { --mc:rgba(180,83,9,.08); --mc-border:rgba(180,83,9,.55); --mc-solid:#b45309; }
.mc-blue   .mod-icon-wrap { border:1.5px solid rgba(180,83,9,.45); color:#b45309; }
.mc-blue   .mod-tag  { color:#b45309; border-color:rgba(180,83,9,.5); }
.mc-blue   .mod-pill { background:rgba(180,83,9,.14); color:#b45309; }
.mc-red    { --mc:rgba(185,28,28,.08); --mc-border:rgba(185,28,28,.55); --mc-solid:#b91c1c; }
.mc-red    .mod-icon-wrap { border:1.5px solid rgba(185,28,28,.45); color:#b91c1c; }
.mc-red    .mod-tag  { color:#b91c1c; border-color:rgba(185,28,28,.5); }
.mc-red    .mod-pill { background:rgba(185,28,28,.14); color:#b91c1c; }

/* Bilişim Defteri kartı. Yukarıdaki altı sınıf renkleri sabit taşır;
   bu yeni sınıf CLAUDE.md §7 gereği renk hard-code etmez ve aktif
   temanın birincil rengine bağlanır. */
.mc-primary { --mc:rgba(var(--primary-rgb),.08); --mc-border:rgba(var(--primary-rgb),.55); --mc-solid:var(--primary); }
.mc-primary .mod-icon-wrap { border:1.5px solid rgba(var(--primary-rgb),.45); color:var(--primary); }
.mc-primary .mod-tag  { color:var(--primary); border-color:rgba(var(--primary-rgb),.5); }
.mc-primary .mod-pill { background:rgba(var(--primary-rgb),.14); color:var(--primary); }

/* Yukarıdaki altı renk açık tema için koyulaştırıldı (24 Eylül 2026); aynı
   kurallar koyu temada da geçerli olduğu için siyah zeminde etiket/rozet
   metni kararıp okunmaz hâle geliyordu. Koyu temada aynı kimlik rengi
   --text1 (beyaz) ile açılır; yeni renk sabiti tanımlanmaz. */
[data-theme="siber"] .mod-card .mod-tag,
[data-theme=""] .mod-card .mod-tag,
[data-theme="siber"] .mod-card .mod-pill,
[data-theme=""] .mod-card .mod-pill,
[data-theme="siber"] .mod-card.emoji-fon .mod-name,
[data-theme=""] .mod-card.emoji-fon .mod-name,
[data-theme="siber"] .mod-card.emoji-fon .mod-meta,
[data-theme=""] .mod-card.emoji-fon .mod-meta {
  color:color-mix(in srgb, var(--mc-solid) 42%, var(--text1));
}
[data-theme="siber"] .mod-card.emoji-fon .mod-pill,
[data-theme=""] .mod-card.emoji-fon .mod-pill {
  background:color-mix(in srgb, var(--mc-solid) 26%, var(--card));
}
[data-theme="siber"] .mod-card .mod-icon-wrap,
[data-theme=""] .mod-card .mod-icon-wrap {
  border-color:color-mix(in srgb, var(--mc-solid) 62%, var(--text1));
}

.panel { background:var(--card); border:1px solid var(--border); border-radius:var(--r); overflow:hidden; }

/* ── TICKER ── */

.tbadge { padding:.15rem .5rem; border-radius:4px; font-size:clamp(.56rem,.65vw,.7rem); font-weight:700; }
.tb-yeni  { background:rgba(16,185,129,.12); color:#10b981; border:1px solid rgba(16,185,129,.2); }
.tb-arac  { background:rgba(245,158,11,.12); color:#f59e0b; border:1px solid rgba(245,158,11,.2); }

.ticker-badge {
  display:inline-flex;
  align-items:center;
  padding:.14rem .45rem;
  border-radius:6px;
  border:1px solid currentColor;
  color:#d05010;
  font-size:.86em;
  font-weight:800;
  letter-spacing:.04em;
}
/* Ticker temaya göre ters renkte (koyu temada krem, açık temada koyu);
   sabit turuncu iki zeminde de eşik altındaydı (3.37 / ~3.9). Aynı turuncu
   koyu temada koyulaştırılır, açık temada açılır (25 Eylül 2026). */
[data-theme="siber"] .ticker-badge,
[data-theme=""] .ticker-badge { color:color-mix(in srgb, #d05010 70%, black); }
[data-theme="corporate"] .ticker-badge { color:color-mix(in srgb, #d05010 60%, white); }
.ticker-item::after { content:'' !important; margin-left:0 !important; }
.ticker-sep {
  display:inline-flex;
  align-items:center;
  color:var(--ticker-sep, #a47755);
  padding-right:clamp(10px, 1.4vw, 22px);
}
.ticker-all {
  flex-shrink:0;
  display:flex;
  align-items:center;
  gap:.45rem;
  padding:0 clamp(12px, 1.2vw, 20px);
  color:var(--ticker-link, #f6ead7);
  font-family:'JetBrains Mono', monospace;
  font-size:clamp(.6rem, .68vw, .78rem);
  font-weight:800;
  text-decoration:none;
  border-left:1px solid var(--ticker-border, rgba(255,255,255,.12));
  background:var(--ticker-link-bg, rgba(255,255,255,.04));
}
a.ticker-item:hover,
.ticker-all:hover { color:var(--ticker-link-hover, var(--accent)) !important; }

/* ── RESPONSIVE ── */
/* Tablet: kartlar 2 sütun */
@media (max-width:900px) {
  .hero-inner { flex-direction:column; }
  .hero-right { padding-left:0; }
  .hero-terminal { left:0; }
  .hero-desc { max-width:520px; }
  .modules-grid { grid-template-columns:repeat(2, 1fr); }
}
@media (min-width:901px) {
  .hero-desc-line { white-space:nowrap; }
}
/* Mobil: kartlar tek sütun */
@media (max-width:600px) {
  .modules-grid { grid-template-columns:1fr; }
  .hero-h1    { font-size: clamp(2rem, 4vw, 4.8rem); }
  .hero-stats { gap:1rem; }
}

/* Telefon görünümü: hero, terminal ve Keşfet aynı anda erişilebilir kalır. */
@media (max-width: 700px) {
  html,
  body {
    height: auto !important;
    min-height: 100%;
    overflow-y: auto !important;
  }

  .hero-section {
    height: auto;
    min-height: 100svh;
    justify-content: flex-start;
    padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px));
    overflow: visible;
  }

  .hero-inner {
    width: min(100%, 100vw);
    padding: .9rem 1rem 7.2rem;
    gap: .85rem;
    align-items: stretch;
  }

  .hero-badge {
    margin-bottom: .55rem;
    padding: 5px 11px;
    letter-spacing: 1.5px;
  }

  .hero-h1 {
    font-size: clamp(2rem, 8vw, 2.55rem) !important;
    line-height: 1.05;
    margin-bottom: .75rem;
  }

  .hero-desc {
    max-width: 100%;
    font-size: .92rem;
    line-height: 1.55;
    margin-bottom: .8rem;
  }

  .hero-desc-line {
    min-height: 0;
  }

  .hero-actions {
    gap: .55rem;
    margin-bottom: .85rem;
  }

  .hero-cta,
  .hero-cta-outline,
  .hero-cta-giris {
    min-height: 38px;
    padding: .55rem .8rem;
    font-size: .78rem;
    border-radius: 8px;
  }

  .hero-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .45rem;
    align-items: start;
  }

  .hero-stat-sep {
    display: none;
  }

  .hero-stat-val {
    font-size: 1rem;
  }

  .hero-stat-lbl {
    font-size: .56rem;
    line-height: 1.25;
    letter-spacing: .08em;
  }

  .hero-right {
    padding: 0;
    gap: .6rem;
  }

  .hero-terminal {
    left: 0;
    width: 100%;
    max-height: 232px;
    border-radius: 12px !important;
  }

  .terminal-bar {
    padding: .42rem .7rem;
  }

  .terminal-title {
    font-size: .56rem;
  }

  .terminal-body {
    min-height: 148px;
    max-height: 184px;
    padding: .55rem .65rem;
    font-size: .62rem !important;
    line-height: 1.45 !important;
  }

  .tl,
  .terminal-body .tl {
    margin-bottom: 2px;
  }

  .tl-name {
    min-width: 0;
    margin-right: .35rem;
  }

  .tl-tag {
    display: inline-block;
  }

  .scroll-down-btn {
    position: fixed;
    bottom: calc(42px + env(safe-area-inset-bottom, 0px));
    z-index: 10000;
    color: var(--accent);
  }
}

@media (max-width: 390px) {
  .hero-inner {
    padding-top: .65rem;
  }

  .hero-h1 {
    font-size: clamp(1.8rem, 7.6vw, 2.22rem) !important;
  }

  .hero-terminal {
    max-height: 210px;
  }

  .terminal-body {
    min-height: 132px;
    max-height: 160px;
  }
}

@media (max-height: 720px) and (max-width: 700px) {
  .hero-inner {
    padding-bottom: 6.4rem;
  }

  .hero-terminal {
    max-height: 194px;
  }

  .terminal-body {
    min-height: 118px;
    max-height: 144px;
  }
}

/* ── TERMİNAL RENKLERİ & AÇIK TEMA UYUMU ── */
.hero-terminal {
  background: #12151f !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}
.terminal-bar { background: #1e2232 !important; }
.terminal-title { color: #8b9bb4 !important; }
.terminal-body { background: #12151f !important; color: #cdd5e0 !important; }
.terminal-body * { background: transparent !important; }
.terminal-body .tl-p  { color: #00d4ff !important; }
.terminal-body .tl-ok { color: #10b981 !important; }
.terminal-body .tl-warn { color: #f59e0b !important; }
.terminal-body .tl-muted { color: #556070 !important; }

[data-theme="corporate"] .hero-terminal { background: #1a1e2e !important; }

[data-theme="corporate"] .terminal-bar { background: #222842 !important; }

[data-theme="corporate"] .terminal-body { background: #1a1e2e !important; }

/* Açık tema — hero metin renkleri */

[data-theme="corporate"] .hero-h1,
[data-theme="corporate"] .h1-plain  { color: #0d1a2e !important; }
[data-theme="corporate"] .h1-glow   { color: #2563eb !important; }
[data-theme="corporate"] .hero-desc { color: #1e3a5a !important; }
[data-theme="corporate"] .hero-badge { color: #1e3a5a !important; background: rgba(37,99,235,.1) !important; border-color: rgba(37,99,235,.3) !important; }
[data-theme="corporate"] .hero-badge-dot { background: #2563eb !important; }
[data-theme="corporate"] .hero-stat-val { color: #2563eb !important; }
[data-theme="corporate"] .hero-stat-lbl { color: #3a5070 !important; }
[data-theme="corporate"] .hero-stat-sep { background: rgba(37,99,235,.25) !important; }

/* Ticker yazı boyutu override */
.ticker-item {
  font-size: clamp(.72rem, .85vw, .95rem) !important;
}
.tbadge {
  font-size: clamp(.62rem, .72vw, .8rem) !important;
}

/* ── SCROLL DOWN BUTONU ── */
.scroll-down-btn {
  position: absolute;
  bottom: clamp(50px, 6vh, 80px);
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 8px;
  color: var(--text3);
  transition: color .2s;
  z-index: 10;
}
.scroll-down-btn:hover { color: var(--accent); }

@keyframes whl {
  0%   { transform: translateY(0); opacity: 1; }
  55%  { transform: translateY(9px); opacity: 0; }
  56%  { transform: translateY(0); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

.scroll-chevrons {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.scroll-chevrons span {
  display: block;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  animation: chv 1.8s ease-in-out infinite;
}
.scroll-chevrons span:nth-child(1) { animation-delay: 0s; }
.scroll-chevrons span:nth-child(2) { animation-delay: .2s; }

@keyframes chv {
  0%, 55%, 100% { opacity: .2; }
  25% { opacity: .9; }
}

/* Scroll sonrası buton gizlenir */
html.icerik-acik .scroll-down-btn,
body.icerik-acik .scroll-down-btn {
  display: none !important;
  pointer-events: none !important;
}

body:not(.icerik-acik) .main-wrap {
  display: none !important;
}

/* ── MAIN-WRAP (scroll sonrası görünür) ── */
.main-wrap {
  padding: clamp(1.5rem, 3vw, 3rem) clamp(2rem, 5vw, 6rem);
  max-width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

/* ── Eski footer CSS kaldırıldı — rota-components.css yönetir ── */

@media (max-width: 700px) {
  .scroll-down-btn {
    position: fixed !important;
    bottom: calc(42px + env(safe-area-inset-bottom, 0px)) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 10000 !important;
  }
}

/* Mobil ana sayfa kesin düzeltme: telefon tarayıcı çubukları ve ticker üstünde çalışır. */
@media (max-width: 700px) {
  html,
  body {
    height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
  }

  body.icerik-acik {
    height: auto !important;
    overflow-y: auto !important;
  }

  html.icerik-acik {
    height: auto !important;
    overflow-y: auto !important;
  }

  .hero-section {
    height: auto !important;
    min-height: auto !important;
    overflow: visible !important;
    padding-bottom: 118px !important;
  }

  .hero-inner {
    width: 100% !important;
    padding: .65rem 1rem 2.2rem !important;
    gap: .65rem !important;
    align-items: stretch !important;
  }

  .hero-left,
  .hero-right {
    width: 100% !important;
    padding: 0 !important;
    min-width: 0 !important;
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  .hero-badge,
  .hero-h1,
  .hero-desc,
  .hero-actions,
  .hero-stats {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  .hero-badge {
    margin-bottom: .45rem !important;
    font-size: .72rem !important;
  }

  .hero-h1 {
    font-size: clamp(2.15rem, 9.2vw, 2.9rem) !important;
    line-height: 1.03 !important;
    margin-bottom: .7rem !important;
  }

  .hero-desc {
    font-size: .98rem !important;
    line-height: 1.52 !important;
    margin-bottom: .75rem !important;
  }

  .hero-desc-arrow {
    margin-inline: .28rem !important;
  }

  .hero-actions {
    margin-bottom: .62rem !important;
  }

  .hero-cta,
  .hero-cta-outline,
  .hero-cta-giris {
    min-height: 38px !important;
    padding: .54rem .82rem !important;
    font-size: .8rem !important;
  }

  .hero-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .32rem !important;
    margin-bottom: .12rem !important;
  }

  .hero-stat {
    min-width: 0 !important;
  }

  .hero-stat-val {
    font-size: 1.08rem !important;
    word-break: break-word !important;
  }

  .hero-stat-lbl {
    font-size: .56rem !important;
    line-height: 1.18 !important;
    letter-spacing: .06em !important;
    overflow-wrap: anywhere !important;
  }

  .hero-terminal {
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    max-height: 260px !important;
    margin-top: .25rem !important;
    border-radius: 10px !important;
    align-self: stretch !important;
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  .terminal-bar {
    min-height: 28px !important;
    padding: .34rem .56rem !important;
  }

  .terminal-dot {
    width: 8px !important;
    height: 8px !important;
  }

  .terminal-title {
    font-size: .5rem !important;
  }

  .terminal-body,
  #termBody {
    height: 222px !important;
    min-height: 222px !important;
    max-height: 222px !important;
    padding: .56rem .68rem !important;
    font-size: .62rem !important;
    line-height: 1.42 !important;
    overflow: hidden !important;
    scrollbar-width: none !important;
  }

  .terminal-body::-webkit-scrollbar,
  #termBody::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
  }

  .terminal-body::-webkit-scrollbar-thumb,
  #termBody::-webkit-scrollbar-thumb {
    background: rgba(var(--primary-rgb), .55) !important;
    border-radius: 999px !important;
  }

  .tl,
  .terminal-body .tl {
    margin-bottom: 1px !important;
  }

  .tl-name {
    min-width: 0 !important;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    vertical-align: baseline !important;
  }

  .tl-tag {
    font-size: .95em !important;
  }

  .terminal-body .tl-course-row,
  #termBody .tl-course-row {
    display: grid !important;
    grid-template-columns: minmax(94px, 1fr) auto minmax(74px, auto) !important;
    align-items: baseline !important;
    column-gap: .35rem !important;
    width: 100% !important;
    white-space: nowrap !important;
  }

  .terminal-body .tl-course-row .tl-name,
  #termBody .tl-course-row .tl-name {
    color: #00d4ff !important;
    font-weight: 800 !important;
  }

  .terminal-body .tl-course-row .tl-arrow,
  #termBody .tl-course-row .tl-arrow {
    color: #fb923c !important;
    font-size: .92em !important;
    letter-spacing: .02em !important;
    padding: 0 !important;
    white-space: nowrap !important;
  }

  .terminal-body .tl-course-row .tl-tag,
  #termBody .tl-course-row .tl-tag {
    justify-self: end !important;
    text-align: right !important;
    white-space: nowrap !important;
    font-weight: 900 !important;
  }

  .scroll-down-btn {
    bottom: calc(44px + env(safe-area-inset-bottom, 0px)) !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 36px !important;
    padding: .48rem .9rem !important;
    gap: .35rem !important;
    border: 1px solid rgba(255,255,255,.42) !important;
    border-radius: 999px !important;
    background:
      linear-gradient(135deg, rgba(8, 13, 28, .96), rgba(24, 30, 50, .96)) padding-box,
      linear-gradient(135deg, #00d4ff, #ff6b35, #10b981) border-box !important;
    background-size: 100% 100%, 240% 240% !important;
    color: #fff !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.6) !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.34), 0 0 0 2px rgba(255,255,255,.12) !important;
    backdrop-filter: blur(14px) !important;
    animation: discoverShift 4.8s ease-in-out infinite !important;
  }

  .scroll-down-btn::after {
    content: "↓";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.1rem;
    height: 1.1rem;
    border-radius: 999px;
    background: #fff;
    color: #111827;
    font-size: .9rem;
    font-weight: 900;
    line-height: 1;
  }

  .scroll-chevrons {
    display: none !important;
  }

  .ticker-wrap {
    height: 34px !important;
  }

  .ticker-label,
  .ticker-all {
    padding-inline: 10px !important;
    font-size: .54rem !important;
  }

  body.icerik-acik .main-wrap {
    display: block !important;
    padding: 1.25rem 1rem 5.5rem !important;
    min-height: auto !important;
  }

  body.icerik-acik .section {
    width: 100% !important;
    padding-inline: 0 !important;
  }

  body.icerik-acik .modules-grid {
    grid-template-columns: minmax(0, min(100%, 360px)) !important;
    justify-content: center !important;
    justify-items: center !important;
    gap: .85rem !important;
  }

  body.icerik-acik .mod-card {
    width: min(100%, 360px) !important;
    margin-inline: auto !important;
  }
}

@media (max-width: 380px), (max-height: 720px) and (max-width: 700px) {
  .hero-terminal {
    max-height: 220px !important;
  }

  .terminal-body,
  #termBody {
    height: 182px !important;
    min-height: 182px !important;
    max-height: 182px !important;
    font-size: .58rem !important;
    overflow: hidden !important;
    scrollbar-width: none !important;
  }
}

@media (max-width: 700px) {
  .terminal-body,
  #termBody {
    overflow: hidden !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }

  .terminal-body::-webkit-scrollbar,
  #termBody::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }
}

/* iPad / orta tablet: hero yukarida, terminal tasmasiz, Kesfet gorunur. */
@media (min-width: 701px) and (max-width: 900px) {
  html,
  body {
    height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
  }

  body.icerik-acik,
  html.icerik-acik {
    height: auto !important;
    overflow-y: auto !important;
  }

  .hero-section {
    height: calc(100svh - clamp(56px, 4.5vw, 78px)) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    justify-content: flex-start !important;
    padding-bottom: 0 !important;
  }

  .hero-inner {
    width: 100% !important;
    height: calc(100svh - clamp(56px, 4.5vw, 78px) - 34px) !important;
    min-height: 0 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: .65rem !important;
    padding: .75rem clamp(1rem, 3vw, 1.75rem) 3.9rem !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .hero-left,
  .hero-right {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  .hero-right {
    display: flex !important;
    justify-content: center !important;
  }

  .hero-badge {
    margin-bottom: .35rem !important;
  }

  .hero-h1 {
    font-size: clamp(2rem, 5.4vw, 3rem) !important;
    line-height: 1.03 !important;
    margin-bottom: .48rem !important;
  }

  .hero-desc {
    max-width: 100% !important;
    font-size: clamp(.86rem, 1.85vw, 1rem) !important;
    line-height: 1.42 !important;
    margin-bottom: .5rem !important;
  }

  .hero-actions {
    margin-bottom: .48rem !important;
  }

  .hero-stats {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .45rem !important;
    margin-bottom: 0 !important;
  }

  .hero-stat-sep {
    display: none !important;
  }

  .hero-terminal {
    left: 0 !important;
    width: 100% !important;
    max-width: 720px !important;
    max-height: 272px !important;
    margin: 0 auto !important;
    align-self: center !important;
    overflow: hidden !important;
  }

  .terminal-body,
  #termBody {
    height: 226px !important;
    min-height: 226px !important;
    max-height: 226px !important;
    width: 100% !important;
    overflow: hidden !important;
    overflow-x: hidden !important;
    scrollbar-width: none !important;
    font-size: clamp(.62rem, 1.2vw, .76rem) !important;
    line-height: 1.38 !important;
    padding: .62rem .78rem !important;
  }

  .terminal-body .tl,
  #termBody .tl {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .terminal-body .tl-course-row,
  #termBody .tl-course-row {
    grid-template-columns: minmax(0, 1fr) auto minmax(68px, max-content) !important;
    column-gap: .32rem !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .terminal-body .tl-course-row .tl-name,
  #termBody .tl-course-row .tl-name {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .terminal-body .tl-course-row .tl-arrow,
  #termBody .tl-course-row .tl-arrow {
    padding: 0 !important;
    letter-spacing: 0 !important;
  }

  .terminal-body .tl-course-row .tl-tag,
  #termBody .tl-course-row .tl-tag {
    min-width: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: clip !important;
  }

  .scroll-down-btn {
    position: fixed !important;
    left: 50% !important;
    bottom: calc(44px + env(safe-area-inset-bottom, 0px)) !important;
    transform: translateX(-50%) !important;
    z-index: 10000 !important;
    display: inline-flex !important;
  }
}

/* Ana sayfa terminal yukseklik en son override */
html body .hero .hero-right .hero-terminal {
  max-height: none !important;
  min-height: clamp(320px, 30vw, 455px) !important;
}

html body .hero .hero-right .hero-terminal .terminal-body,
html body .hero .hero-right .hero-terminal #termBody {
  height: clamp(280px, 25vw, 400px) !important;
  min-height: clamp(280px, 25vw, 400px) !important;
  max-height: min(52vh, 430px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* Ana sayfa terminal yukseklik final override */
body .hero .hero-terminal,
body .hero-right .hero-terminal {
  max-height: none !important;
  min-height: clamp(310px, 29vw, 445px) !important;
}

body .hero .hero-terminal .terminal-body,
body .hero .hero-terminal #termBody,
body .hero-right .hero-terminal .terminal-body,
body .hero-right .hero-terminal #termBody {
  height: clamp(270px, 24vw, 390px) !important;
  min-height: clamp(270px, 24vw, 390px) !important;
  max-height: min(50vh, 420px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

@media (max-width: 1199px) {
  .ticker-wrap {
    display: none !important;
  }
}

@media (min-width: 701px) and (max-width: 900px) and (max-height: 780px) {
  .hero-badge,
  .hero-stats {
    display: none !important;
  }

  .hero-inner {
    gap: .5rem !important;
    padding-top: .55rem !important;
    padding-bottom: 3.6rem !important;
  }

  .hero-h1 {
    font-size: clamp(1.8rem, 4.8vw, 2.55rem) !important;
    margin-bottom: .34rem !important;
  }

  .hero-desc {
    font-size: clamp(.76rem, 1.55vw, .9rem) !important;
    line-height: 1.34 !important;
    margin-bottom: .36rem !important;
  }

  .hero-actions {
    margin-bottom: .32rem !important;
  }

  .hero-terminal {
    max-height: 294px !important;
  }

  .terminal-body,
  #termBody {
    height: 248px !important;
    min-height: 248px !important;
    max-height: 248px !important;
    line-height: 1.34 !important;
  }
}

/* iPad Pro 10.5 yatay: 1112 x 834 CSS px civari. */
@media (min-width: 901px) and (max-width: 1180px) and (min-height: 760px) and (max-height: 900px) {
  html,
  body {
    height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
  }

  body.icerik-acik,
  html.icerik-acik {
    height: auto !important;
    overflow-y: auto !important;
  }

  .hero-section {
    height: calc(100svh - clamp(56px, 4.5vw, 78px)) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    justify-content: flex-start !important;
  }

  .hero-inner {
    width: min(96vw, 1120px) !important;
    height: calc(100svh - clamp(56px, 4.5vw, 78px) - 34px) !important;
    min-height: 0 !important;
    align-items: center !important;
    gap: clamp(1rem, 2vw, 1.8rem) !important;
    padding: .8rem 1.4rem 3.7rem !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .hero-left,
  .hero-right {
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  .hero-right {
    display: flex !important;
    justify-content: center !important;
  }

  .hero-badge {
    margin-bottom: .35rem !important;
  }

  .hero-h1 {
    font-size: clamp(2rem, 3.8vw, 3.05rem) !important;
    line-height: 1.03 !important;
    margin-bottom: .46rem !important;
  }

  .hero-desc {
    max-width: 100% !important;
    font-size: clamp(.82rem, 1.1vw, .98rem) !important;
    line-height: 1.42 !important;
    margin-bottom: .5rem !important;
  }

  .hero-actions {
    margin-bottom: .45rem !important;
  }

  .hero-stats {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .45rem !important;
    margin-bottom: 0 !important;
  }

  .hero-stat-sep {
    display: none !important;
  }

  .hero-terminal {
    left: 0 !important;
    width: 100% !important;
    max-width: 590px !important;
    max-height: 328px !important;
    margin: 0 auto !important;
    overflow: hidden !important;
  }

  .terminal-body,
  #termBody {
    height: 280px !important;
    min-height: 280px !important;
    max-height: 280px !important;
    width: 100% !important;
    overflow: hidden !important;
    overflow-x: hidden !important;
    scrollbar-width: none !important;
    font-size: clamp(.58rem, .85vw, .74rem) !important;
    line-height: 1.42 !important;
    padding: .62rem .78rem !important;
  }

  .terminal-body .tl,
  #termBody .tl {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .terminal-body .tl-course-row,
  #termBody .tl-course-row {
    grid-template-columns: minmax(0, 1fr) auto minmax(68px, max-content) !important;
    column-gap: .32rem !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .terminal-body .tl-course-row .tl-name,
  #termBody .tl-course-row .tl-name {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .terminal-body .tl-course-row .tl-arrow,
  #termBody .tl-course-row .tl-arrow {
    padding: 0 !important;
    letter-spacing: 0 !important;
  }

  .terminal-body .tl-course-row .tl-tag,
  #termBody .tl-course-row .tl-tag {
    min-width: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: clip !important;
  }

  .scroll-down-btn {
    position: fixed !important;
    left: 50% !important;
    bottom: calc(44px + env(safe-area-inset-bottom, 0px)) !important;
    transform: translateX(-50%) !important;
    z-index: 10000 !important;
    display: inline-flex !important;
  }
}

/* Ana sayfa terminal yukseklik dosya sonu override */
html body .hero .hero-right .hero-terminal {
  max-height: none !important;
  min-height: clamp(320px, 30vw, 455px) !important;
}

html body .hero .hero-right .hero-terminal .terminal-body,
html body .hero .hero-right .hero-terminal #termBody {
  height: clamp(280px, 25vw, 400px) !important;
  min-height: clamp(280px, 25vw, 400px) !important;
  max-height: min(52vh, 430px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* Buyuk ekran terminalinde gereksiz ic kaydirma cubugunu kapatir. */
@media (min-width: 1200px) {
  html body .hero-section .hero-right .hero-terminal {
    min-height: clamp(360px, 23vw, 445px) !important;
    max-height: min(48vh, 445px) !important;
  }

  html body .hero-section .hero-right .hero-terminal .terminal-body,
  html body .hero-section .hero-right .hero-terminal #termBody {
    height: clamp(312px, 20vw, 392px) !important;
    min-height: clamp(312px, 20vw, 392px) !important;
    max-height: none !important;
    overflow: hidden !important;
    scrollbar-width: none !important;
    font-size: clamp(.6rem, .68vw, .78rem) !important;
    line-height: 1.46 !important;
    padding-block: clamp(.72rem, .85vw, 1rem) !important;
  }

  html body .hero-section .hero-right .hero-terminal .terminal-body::-webkit-scrollbar,
  html body .hero-section .hero-right .hero-terminal #termBody::-webkit-scrollbar {
    display: none !important;
  }
}

/* ── Akilli Tahta (1920px+) ── */
@media (min-width: 1920px) {
  .hero-inner { max-width: 1600px; margin-inline: auto; }
  .modules-grid { max-width: 1600px; margin-inline: auto; }
  .section { max-width: 1700px; margin-inline: auto; }
}

/* ═══════════════════════════════════════
   HAREKET AZALTMA — sayfaya özel istisna
   rota-components.css sonundaki global blok buradaki kuralı yenemez,
   çünkü sayfa CSS dosyası daha sonra yüklenir. 700px altında
   .scroll-down-btn sonsuz discoverShift animasyonu çalıştırıyor;
   hareket azaltma tercihinde durdurulur.
   ═══════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  .scroll-down-btn {
    animation: none !important;
  }
}

/* F6-14-S007: sayfa govdesi - icerik acikken kaydirmayi ac/kapat */
html[data-module="anasayfa"],
html[data-module="anasayfa"] body {
  height: 100%;
  overflow: hidden;
}

html[data-module="anasayfa"] body.icerik-acik {
  overflow-y: auto;
  scroll-behavior: smooth;
}

/* Açık tema: alan kartlarının kimlik renkleri (etiket, ikon) açık
   zeminde okunur kalsın diye paylaşılan rozet oranıyla karıştırılır.
   .mc-primary zaten temanın --primary rengini kullanır. */
[data-theme="corporate"] .mc-cyan .mod-icon-wrap,
[data-theme="corporate"] .mc-cyan .mod-tag { color: color-mix(in srgb, #00d4ff var(--rozet-yazi-orani, 100%), var(--text1)); }
[data-theme="corporate"] .mc-violet .mod-icon-wrap,
[data-theme="corporate"] .mc-violet .mod-tag { color: color-mix(in srgb, #a78bfa var(--rozet-yazi-orani, 100%), var(--text1)); }
[data-theme="corporate"] .mc-green .mod-icon-wrap,
[data-theme="corporate"] .mc-green .mod-tag { color: color-mix(in srgb, #10b981 var(--rozet-yazi-orani, 100%), var(--text1)); }
[data-theme="corporate"] .mc-blue .mod-icon-wrap,
[data-theme="corporate"] .mc-blue .mod-tag { color: color-mix(in srgb, #60a5fa var(--rozet-yazi-orani, 100%), var(--text1)); }
[data-theme="corporate"] .mc-red .mod-icon-wrap,
[data-theme="corporate"] .mc-red .mod-tag { color: color-mix(in srgb, #f87171 var(--rozet-yazi-orani, 100%), var(--text1)); }

/* .mod-pill kendi rengiyle boyanmis SOLUK bir zeminin (rgba(...,.12))
   uzerinde tam bir kelime tasiyor; %100 ham renk zeminle karisip
   silikleşiyor (gorsel testle dogrulandi, 24 Eylul 2026). Okunur kalmasi
   icin sabit %40 karisimda tutuluyor. */
[data-theme="corporate"] .mc-cyan   .mod-pill { color: color-mix(in srgb, #00d4ff 40%, var(--text1)); }
[data-theme="corporate"] .mc-violet .mod-pill { color: color-mix(in srgb, #a78bfa 40%, var(--text1)); }
[data-theme="corporate"] .mc-green  .mod-pill { color: color-mix(in srgb, #10b981 40%, var(--text1)); }
[data-theme="corporate"] .mc-blue   .mod-pill { color: color-mix(in srgb, #60a5fa 40%, var(--text1)); }
[data-theme="corporate"] .mc-red    .mod-pill { color: color-mix(in srgb, #f87171 40%, var(--text1)); }

/* Koyu tema CTA okunurluğu (25 Eylül 2026): .hero-cta-giris parlak camgöbeği uçta beyaz
   yazı 1.77'ye düşüyordu. .btn-primary desenindeki gibi degrade uçları %50
   siyahla karışır; açık temadaki mavi görünüm değişmez. background-size ve
   animasyon korunsun diye yalnız background-image ezilir. */
[data-theme="siber"] .hero-cta-giris,
[data-theme=""] .hero-cta-giris {
  background-image: linear-gradient(135deg,
    color-mix(in srgb, #0891b2 50%, black),
    color-mix(in srgb, var(--primary, #00d4ff) 50%, black),
    color-mix(in srgb, #2563eb 50%, black));
}