:root{
  --bg: #0a0d13;
  --panel: #131a26;
  --panel-soft: #161d2a;
  --border: rgba(255,255,255,.08);
  --text: #f3f5f7;
  --muted: #9aa7b6;
  --accent: #ff6a00;              /* Borusan turuncusu */
  --accent-soft: rgba(255,106,0,.15);
  --prev: #5b8dd6;                /* önceki dönem serisi */
  --red: #f2555a;                 /* düşen / olumsuz */
  --teal: #33c2a3;
  --blue: #4f8cff;
  --font: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
}
*{box-sizing:border-box;}
html,body{
  margin:0; padding:0; background:#05070b; color:var(--text); font-family:var(--font);
  width:100%; height:100%; overflow:hidden;
}

/* ==================== SABİT 1920×1080 SAHNE ====================
   Sunum birebir 1920×1080 px olarak kurulur ve pencereye `transform: scale()`
   ile sığdırılır (`fitStage()`, `--s`). Hangi ekranda açılırsa açılsın slaytlar
   aynı görünür; içerik pencere yüksekliğine göre taşmaz, sadece küçülür.

   ⚠ Bu yüzden CSS'te `vw`/`vh` birimi ve viewport `@media` kırılımı KULLANILMAZ:
   sahne sabit, viewport değişken. Ölçüler px cinsinden yazılır. (2026-08-26'da
   akışkan yerleşimden buna geçildi; eski `vw` clamp'ları 1920'deki değerlerine,
   `min-width:1500px` kırılımı koşulsuz kurallara çevrildi.) */
:root{
  --slide-w: 1920px;
  --slide-h: 1080px;
}
#stage{
  position:fixed; left:50%; top:50%;
  width:var(--slide-w); height:var(--slide-h);
  transform: translate(-50%,-50%) scale(var(--s,1));
  transform-origin: center center;
  background:var(--bg); overflow:hidden;
  box-shadow:0 0 90px rgba(0,0,0,.6);
}

#page{
  position:absolute; inset:0;
  width:var(--slide-w); height:var(--slide-h);
  overflow-y:auto; overflow-x:hidden;
  scroll-snap-type: y mandatory;
  scrollbar-width:none;
}
#page::-webkit-scrollbar{ display:none; }

/* Bölüm yüksekliği SABİT: min-height ile büyüyebilseydi içerik sahneyi aşar,
   iki slayt arası kaydırma pozisyonu mümkün hale gelirdi. */
.sec{
  position:relative; height:var(--slide-h); flex:none; overflow:hidden;
  scroll-snap-align:start;
  display:flex; flex-direction:column; border-bottom:1px solid rgba(255,255,255,.04);
}
.sec-body{ position:relative; flex:1; display:flex; flex-direction:column; padding:56px 88px 64px; min-height:0; z-index:2;}

.bg-media{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.bg-overlay{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(6,8,12,.55) 0%, rgba(6,8,12,.4) 45%, rgba(6,8,12,.9) 100%); }

.kicker{
  display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase; color:var(--accent); margin-bottom:16px;
}
.kicker::before{ content:""; width:20px; height:2px; background:var(--accent); display:inline-block; }

/* ---- section banner (for former dividers used as carousel headers) ---- */
.sec-banner{
  padding:28px 88px 20px; position:relative; z-index:2;
  background: linear-gradient(120deg, rgba(255,106,0,.16), rgba(255,106,0,.02));
  border-bottom:1px solid var(--border);
}
.sec-banner .badge{
  display:inline-block; background:var(--accent); color:#fff; font-weight:700; font-size:13px;
  padding:6px 14px; border-radius:8px; margin-bottom:12px;
}
.sec-banner h2{ font-size:48px; font-weight:800; margin:0; letter-spacing:-.01em; }

/* ---- HERO ---- */
.hero .sec-body{ justify-content:flex-end; padding-bottom:100px; }
.hero h1{ font-size:84px; line-height:1.02; font-weight:800; margin:0 0 18px; max-width:1000px; letter-spacing:-.01em; }
.hero p{ font-size:22px; color:#e7ecf1; margin:0; max-width:700px; }

/* ---- PARTNERS ---- */
.partners .sec-body{ justify-content:flex-end; padding-bottom:88px; }
.partners .bg-overlay{ background:linear-gradient(180deg, rgba(6,8,12,.12) 0%, rgba(6,8,12,.18) 45%, rgba(6,8,12,.72) 100%); }
.logo-row{ display:flex; flex-wrap:wrap; gap:16px; }
.logo-chip{ background:#fff; border-radius:12px; padding:14px 22px; display:flex; align-items:center; box-shadow:0 10px 30px rgba(0,0,0,.35); }
.logo-chip.logo-chip-dark{ background:#12161f; box-shadow:0 10px 30px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.08) inset; }
.logo-chip img{ height:32px; width:auto; display:block; object-fit:contain; }

/* ---- QUOTES ---- */
.quotes .sec-body{ justify-content:center; max-width:1100px; margin:0 auto; }
.quote-card{ background:var(--panel); border:1px solid var(--border); border-left:4px solid var(--accent);
  border-radius:14px; padding:24px 28px; margin-bottom:16px; font-size:21px; line-height:1.45; font-weight:600; }

/* ---- TIMELINE ---- */
.timeline h1{ font-size:34px; font-weight:800; margin:0 0 22px; }
.month-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; flex:1; min-height:0; }
.month-card{ background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:16px 18px;
  border-top:3px solid var(--accent); display:flex; flex-direction:column; gap:9px; overflow:hidden; }
.month-card:nth-child(2){ border-top-color:var(--teal); }
.month-card:nth-child(3){ border-top-color:var(--blue); }
.month-card:nth-child(4){ border-top-color:#c084fc; }
.month-card:nth-child(5){ border-top-color:#facc15; }
.month-card:nth-child(6){ border-top-color:#f472b6; }
.month-card .month-label{ font-weight:800; font-size:15px; color:#fff; }
.month-item{ display:flex; gap:9px; align-items:flex-start; font-size:13px; line-height:1.4; color:#dbe2ea; }
.month-item .ic{ flex:none; width:18px; height:18px; color:var(--accent); margin-top:1px; }
.month-item b{ color:#fff; }

/* ---- ICON GRID ---- */
.icongrid .sec-body{ justify-content:center; }
.icongrid h1{ font-size:42px; font-weight:800; margin:0 0 10px; max-width:800px; }
.icongrid .sub{ color:#e7ecf1; max-width:760px; margin:0 0 26px; font-size:14.5px; }
.icon-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:12px; }
.icon-cell{ background:rgba(19,26,38,.72); backdrop-filter:blur(6px); border:1px solid var(--border);
  border-radius:14px; padding:18px 12px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:9px; }
.icon-cell .ic-circle{ width:42px; height:42px; border-radius:50%; background:var(--accent-soft); color:var(--accent);
  display:flex; align-items:center; justify-content:center; }
.icon-cell .ic-circle svg{ width:21px; height:21px; }
.icon-cell span{ font-size:12.5px; font-weight:700; color:#fff; }

/* ---- STANDALONE DIVIDER/HERO (used for ya-sonra) ---- */
.divider .sec-body{ justify-content:center; }
.divider .badge{ display:inline-block; background:var(--accent); color:#fff; font-weight:700; font-size:14px; padding:8px 16px; border-radius:8px; margin-bottom:20px; }
.divider h1{ font-size:76px; font-weight:800; margin:0; }

/* ---- CHART (single) ---- */
.chart .sec-body{ justify-content:center; align-items:center; gap:16px; }
.chart .badge{ align-self:flex-start; background:var(--accent); color:#fff; font-weight:700; font-size:13px; padding:7px 14px; border-radius:8px; }
.chart-frame{ flex:1; width:100%; display:flex; align-items:center; justify-content:center; min-height:0; cursor:zoom-in; }
.chart-frame img{ max-width:100%; max-height:712.8px; border-radius:14px; box-shadow:0 20px 60px rgba(0,0,0,.45); border:1px solid var(--border); }
.chart-foot{ display:flex; align-items:center; justify-content:space-between; gap:20px; width:100%; }
.chart-note{ color:#c7d0da; font-size:13px; max-width:760px; background:var(--panel); border-radius:10px; padding:11px 15px; border:1px solid var(--border);}
.chart-cta{ background:var(--accent); color:#fff; font-weight:800; padding:11px 20px; border-radius:10px; font-size:13.5px; white-space:nowrap; }

/* ---- CHARTINSIGHT (merged) ---- */
.chartinsight .sec-body{ gap:14px; }
.chartinsight .badge{ align-self:flex-start; background:var(--accent); color:#fff; font-weight:700; font-size:13px; padding:7px 14px; border-radius:8px; }
.chartinsight h2{ font-size:30px; font-weight:800; margin:6px 0 4px; }
.chartinsight .ci-note{ color:#c7d0da; font-size:13.5px; max-width:900px; margin-bottom:6px; }
.chartinsight .ci-body{ display:grid; grid-template-columns:.85fr 1.15fr; gap:22px; flex:1; min-height:0; }
.chartinsight .ci-image{ display:flex; align-items:center; justify-content:center; cursor:zoom-in; }
.chartinsight .ci-image img{ max-width:100%; max-height:604.8px; border-radius:12px; border:1px solid var(--border); }
.insight-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; align-content:start; }
.insight-card{ background:var(--panel); border:1px solid var(--border); border-left:4px solid var(--accent); border-radius:12px; padding:14px 18px; }
.insight-card:nth-child(2n){ border-left-color:var(--teal); }
.insight-card h3{ margin:0 0 6px; font-size:15.5px; font-weight:800; color:#fff; }
.insight-card p{ margin:0; font-size:12.8px; line-height:1.48; color:#d7dee6; }

/* ---- CLOSING ---- */
.closing h1{ font-size:34px; font-weight:800; margin:0 0 22px; max-width:1000px;
  background:var(--accent); display:inline-block; padding:13px 20px; border-radius:10px; }
.closing-list{ columns:2; column-gap:24px; flex:1; overflow:auto; }
.closing-item{ break-inside:avoid; display:flex; gap:11px; margin-bottom:14px; font-size:13.8px; line-height:1.48; color:#dde4ea;
  background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:13px 15px; }
.closing-item .num{ flex:none; color:var(--accent); font-weight:800; }

/* ---- CAROUSEL ---- */
.carousel-wrap{ flex:1; min-height:0; display:flex; flex-direction:column; position:relative; }
.carousel-viewport{ flex:1; min-height:0; overflow:hidden; position:relative; }
.carousel-track{ position:absolute; inset:0; display:flex; transition: transform .38s cubic-bezier(.4,0,.2,1); }
.car-item{ flex:0 0 100%; height:100%; display:flex; align-items:center; justify-content:center; padding:6px 70px; }
.car-item .car-video-wrap{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; position:relative; }
.car-item .car-video-wrap::before{
  content:""; position:absolute; inset:6% 12%; z-index:0; border-radius:26px;
  background: radial-gradient(ellipse at center, rgba(255,90,31,.28) 0%, rgba(79,140,255,.14) 45%, transparent 72%);
  filter: blur(28px); pointer-events:none;
}
.car-video-frame{
  position:relative; z-index:1; max-width:100%; max-height:100%;
  padding:2.5px; border-radius:19px;
  background: linear-gradient(135deg, var(--accent), rgba(79,140,255,.7) 55%, var(--teal));
  box-shadow:0 24px 70px rgba(0,0,0,.55);
  display:flex;
}
.car-item video{
  display:block; max-width:100%; max-height:100%; width:100%; height:100%;
  border-radius:17px; background:#000; object-fit:contain;
}
.car-video-tag{
  position:absolute; top:10px; left:10px; z-index:2; display:flex; align-items:center; gap:6px;
  background:rgba(10,13,19,.72); backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.12);
  color:#fff; font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase;
  padding:5px 10px 5px 8px; border-radius:20px;
}
.car-video-tag .dot{ width:6px; height:6px; border-radius:50%; background:#ff4d4d; box-shadow:0 0 0 0 rgba(255,77,77,.6); animation: liveDot 1.6s ease-in-out infinite; }
@keyframes liveDot{ 0%,100%{ box-shadow:0 0 0 0 rgba(255,77,77,.55);} 50%{ box-shadow:0 0 0 5px rgba(255,77,77,0);} }
.car-item img{ max-width:100%; max-height:100%; border-radius:14px; box-shadow:0 20px 60px rgba(0,0,0,.45); border:1px solid var(--border); cursor:zoom-in; }
.car-note{ position:absolute; left:50%; bottom:8px; transform:translateX(-50%); color:#e5cdb8; background:rgba(255,90,31,.14);
  border:1px solid rgba(255,90,31,.34); border-radius:10px; padding:9px 16px; font-size:12.5px; max-width:80%; text-align:center; }

.car-arrow{ position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%;
  background:rgba(10,13,19,.55); border:1px solid var(--border); color:#fff; display:flex; align-items:center; justify-content:center;
  cursor:pointer; z-index:5; backdrop-filter:blur(4px); transition:background .2s ease; }
.car-arrow:hover{ background:rgba(255,90,31,.55); }
.car-arrow svg{ width:20px; height:20px; }
.car-arrow.prev{ left:14px; }
.car-arrow.next{ right:14px; }
.car-arrow.disabled{ opacity:.25; pointer-events:none; }

.car-dots{ display:flex; gap:7px; justify-content:center; padding:10px 0 0; }
.car-dot{ width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.25); cursor:pointer; transition: background .2s ease, transform .2s ease; }
.car-dot.active{ background:var(--accent); transform:scale(1.3); }

.sec-kicker-row{ display:flex; align-items:center; justify-content:space-between; padding:0 88px; margin-top:44px; }

/* ---- CHROME ---- */
#progress-track{ position:fixed; top:0; left:0; right:0; height:3px; background:rgba(255,255,255,.08); z-index:60; }
#progress-fill{ height:100%; background:var(--accent); width:0%; transition:width .2s ease; }

#dot-rail{ position:fixed; right:22px; top:50%; transform:translateY(-50%); z-index:55; display:flex; flex-direction:column; gap:10px; }
.rail-dot{ width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.22); cursor:pointer; position:relative; transition: background .2s ease, transform .2s ease; }
.rail-dot.active{ background:var(--accent); transform:scale(1.5); }
.rail-dot .rail-label{ position:absolute; right:20px; top:50%; transform:translateY(-50%); background:rgba(10,13,19,.9); border:1px solid var(--border);
  color:#fff; font-size:12px; padding:6px 10px; border-radius:8px; white-space:nowrap; opacity:0; pointer-events:none; transition:opacity .15s ease; }
.rail-dot:hover .rail-label{ opacity:1; }

#tool-rail{ position:fixed; left:22px; bottom:22px; z-index:55; display:flex; gap:10px; }
.tool-btn{ width:42px; height:42px; border-radius:50%; border:1px solid var(--border); background:rgba(19,26,38,.75);
  backdrop-filter:blur(6px); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.tool-btn:hover{ background:rgba(255,90,31,.5); }
.tool-btn svg{ width:19px; height:19px; }

#sec-label{ position:fixed; left:22px; top:20px; z-index:55; font-size:12.5px; font-weight:700; color:var(--muted); letter-spacing:.06em; text-transform:uppercase; }
#sec-label b{ color:#fff; }

/* ---- MENU OVERLAY ---- */
#menu-overlay{ position:fixed; inset:0; z-index:80; background:rgba(6,8,13,.9); backdrop-filter:blur(10px); display:none; align-items:center; justify-content:center; }
#menu-overlay.open{ display:flex; }
#menu-panel{ width:880px; max-height:864px; overflow:auto; }
#menu-panel h2{ font-size:13px; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); margin:0 0 16px; }
.menu-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.menu-item{ background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:15px 17px; cursor:pointer; transition: transform .15s ease, background .15s ease; }
.menu-item:hover{ background:var(--panel-soft); transform:translateY(-2px); }
.menu-item .mi-num{ color:var(--accent); font-weight:800; font-size:12px; }
.menu-item .mi-title{ color:#fff; font-weight:700; font-size:14px; margin-top:4px; }

/* ---- LIGHTBOX ---- */
#lightbox{ position:fixed; inset:0; z-index:90; background:rgba(4,5,8,.94); display:none; align-items:center; justify-content:center; cursor:zoom-out; padding:40px; }
#lightbox.open{ display:flex; }
#lightbox img{ max-width:100%; max-height:100%; border-radius:10px; box-shadow:0 30px 90px rgba(0,0,0,.6); }

/* Açık katmanların içinde kaydırma gerekebiliyor; zincirlenip arkadaki sahneyi
   kaydırmasınlar diye taşma burada durdurulur. */
#menu-panel, .act-pop-c, .mo-shell, .mo-body, .car-item-scroll, .sec-body{ overscroll-behavior: contain; }



/* ---- MATRIX (interactive treemap) ---- */
.matrix .sec-body{ gap:12px; }
.matrix .badge{ align-self:flex-start; background:var(--accent); color:#fff; font-weight:700; font-size:13px; padding:7px 14px; border-radius:8px; }
.matrix h2{ font-size:30px; font-weight:800; margin:6px 0 2px; }
.mx-wrap{ flex:1; display:flex; flex-direction:column; min-height:0; gap:10px; }
.mx-tabs{ display:flex; gap:8px; flex-wrap:wrap; }
.mx-tab{
  background:var(--panel); border:1px solid var(--border); color:#c9d2db; font-weight:700; font-size:13px;
  padding:8px 16px; border-radius:9px; cursor:pointer; transition: background .2s ease, color .2s ease;
}
.mx-tab.active{ background:var(--accent); color:#fff; border-color:var(--accent); }
.mx-tab:hover:not(.active){ background:var(--panel-soft); }
.mx-canvas{ position:relative; flex:1; min-height:220px; border-radius:14px; overflow:hidden; border:1px solid var(--border); background:#0d1220; }
.mx-box{
  position:absolute; box-sizing:border-box; border:1.5px solid rgba(6,8,13,.55);
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  padding:6px; cursor:pointer; transition: left .55s cubic-bezier(.4,0,.2,1), top .55s cubic-bezier(.4,0,.2,1), width .55s cubic-bezier(.4,0,.2,1), height .55s cubic-bezier(.4,0,.2,1), filter .15s ease;
  color:#fff;
}
.mx-box:hover{ filter:brightness(1.14); z-index:3; }
.mx-box .mx-label{ font-weight:800; font-size:12.5px; line-height:1.2; text-shadow:0 1px 3px rgba(0,0,0,.4); }
.mx-box .mx-value{ font-size:11.5px; font-weight:700; background:rgba(0,0,0,.28); padding:2px 8px; border-radius:6px; margin-top:4px; }
.mx-box-small .mx-label{ display:none; }
.ci-note{ color:#c7d0da; font-size:13px; max-width:900px; }
#mx-tooltip{
  position:absolute; transform:translate(-50%,-100%); background:#12161f; border:1px solid var(--border);
  border-radius:10px; padding:8px 12px; font-size:12.5px; pointer-events:none; opacity:0; transition:opacity .15s ease;
  z-index:20; white-space:nowrap; box-shadow:0 10px 30px rgba(0,0,0,.4);
}
#mx-tooltip.show{ opacity:1; }
#mx-tooltip b{ display:block; color:#fff; font-size:12.5px; }
#mx-tooltip span{ color:var(--accent); font-weight:800; font-size:13px; }
.mx-cards{ margin-top:8px; }
.mx-cards .insight-card{ font-size:12.6px; }

/* ---- POP TABLE ---- */
.poptable .sec-body{ gap:12px; }
.pt-title{ font-size:36px; font-weight:800; margin:0 0 6px; }
.pt-summary{ display:flex; gap:14px; flex-wrap:wrap; }
.pt-sum-box{ background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:12px 18px; display:flex; flex-direction:column; gap:4px; }
.pt-sum-box span{ color:var(--muted); font-size:11.5px; text-transform:uppercase; letter-spacing:.06em; font-weight:700; }
.pt-sum-box b{ font-size:20px; font-weight:800; }
.pt-sum-box b.big{ font-size:28px; color:var(--accent); }
.pt-table-wrap{ flex:1; overflow:auto; border:1px solid var(--border); border-radius:14px; }
.pt-table{ width:100%; border-collapse:collapse; font-size:14px; }
.pt-table thead th{ text-align:left; padding:12px 18px; color:var(--muted); font-size:11.5px; text-transform:uppercase;
  letter-spacing:.06em; background:var(--panel-soft); position:sticky; top:0; }
.pt-table tbody td{ padding:12px 18px; border-top:1px solid var(--border); }
.pt-row{ cursor:pointer; transition: background .15s ease; }
.pt-row:hover{ background:rgba(255,90,31,.08); }
.pt-plat{ display:flex; align-items:center; gap:10px; font-weight:700; }
.pt-ic{ width:20px; height:20px; color:var(--accent); flex:none; }
.pt-strong{ font-weight:800; }
.pt-pct{ font-weight:800; padding:3px 10px; border-radius:7px; font-size:12.5px; }
.pt-pct.up{ color:#33c2a3; background:rgba(51,194,163,.14); }
.pt-pct.down{ color:#f87171; background:rgba(248,113,113,.14); }
.pt-hint{ color:var(--muted); font-size:12px; text-align:right; }


.mx-tabs-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.mx-total{ color:var(--muted); font-size:12.5px; font-weight:700; }

/* ---- month-grid variants ---- */
.month-grid-5{ grid-template-columns:repeat(5,1fr); }
.month-grid-6{ grid-template-columns:repeat(3,1fr); }

/* ---- STORYBOARD ---- */
.storyboard .sec-body{ gap:10px; }
.storyboard .badge{ align-self:flex-start; background:var(--accent); color:#fff; font-weight:700; font-size:13px; padding:7px 14px; border-radius:8px; }
.storyboard h2{ font-size:32px; font-weight:800; margin:4px 0 8px; }
.sb-grid{ display:grid; gap:16px; flex:1; min-height:0; }
.sb-cols-2{ grid-template-columns:1fr 1fr; }
.sb-cols-3{ grid-template-columns:repeat(3,1fr); }
.sb-col{ display:flex; flex-direction:column; gap:10px; overflow:auto; }
.sb-col-head{ display:flex; align-items:center; gap:10px; margin-bottom:2px; }
.sb-ic{ width:30px; height:30px; border-radius:9px; background:var(--accent-soft); color:var(--accent); display:flex; align-items:center; justify-content:center; flex:none; }
.sb-ic svg{ width:17px; height:17px; }
.sb-col-head h3{ font-size:14.5px; font-weight:800; margin:0; letter-spacing:.02em; text-transform:uppercase; color:#fff; }
.sb-block{ background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:13px 16px; }
.sb-block h4{ margin:0 0 5px; font-size:13.5px; font-weight:800; color:var(--accent); }
.sb-block p{ margin:0; font-size:12.6px; line-height:1.5; color:#d7dee6; }
.sb-block p b{ color:#fff; }
.sb-highlight{ background:linear-gradient(120deg, rgba(255,90,31,.16), rgba(255,90,31,.04)); border-color:rgba(255,90,31,.3); font-size:13px; font-weight:600; color:#f3d9ca; line-height:1.5; }
.sb-highlight b{ color:var(--accent); }
.sg-label{ font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); margin-bottom:8px; }
.sg-row{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; padding:6px 0; border-top:1px solid var(--border); flex-wrap:wrap; }
.sg-row:first-of-type{ border-top:none; }
.sg-name{ font-size:12.5px; color:#c9d2db; }
.sg-value{ font-size:15px; font-weight:800; color:var(--teal); }
.sg-detail{ width:100%; font-size:11px; color:var(--muted); }

/* ---- ICONCARDS ---- */
.iconcards .sec-body{ gap:8px; }
.iconcards .badge{ align-self:flex-start; background:var(--accent); color:#fff; font-weight:700; font-size:13px; padding:7px 14px; border-radius:8px; }
.iconcards h2{ font-size:32px; font-weight:800; margin:4px 0 0; }
.ic-sub{ color:var(--muted); font-size:13px; font-weight:700; margin-bottom:6px; }
.ic-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; flex:1; min-height:0; }
.ic-card{ background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:16px 18px; overflow:auto; }
.ic-card-head{ display:flex; align-items:center; gap:10px; margin-bottom:8px; flex-wrap:wrap; }
.ic-card-icon{ width:32px; height:32px; border-radius:9px; background:var(--accent-soft); color:var(--accent); display:flex; align-items:center; justify-content:center; flex:none; }
.ic-card-icon svg{ width:17px; height:17px; }
.ic-card-head h4{ font-size:15px; font-weight:800; margin:0; flex:1; }
.ic-card-badge{ background:rgba(51,194,163,.16); color:var(--teal); font-weight:800; font-size:12px; padding:4px 10px; border-radius:7px; }
.ic-card p{ margin:0; font-size:12.8px; line-height:1.5; color:#d7dee6; }
.ic-card p b{ color:#fff; }

/* ---- SHIFT (before/after) ---- */
.shift .sec-body{ gap:10px; }
.shift h2{ font-size:32px; font-weight:800; margin:4px 0 8px; }
.shift-grid{ display:grid; grid-template-columns:1fr auto 1fr; gap:18px; flex:1; min-height:0; align-items:stretch; }
.shift-panel{ display:flex; flex-direction:column; gap:8px; min-height:0; }
.shift-panel-label{ font-weight:800; font-size:13.5px; color:#fff; background:rgba(255,255,255,.06); padding:8px 14px; border-radius:9px; border-left:3px solid var(--accent); }
.shift-panel-label.accent2{ border-left-color:var(--teal); }
.shift-note{ font-size:12.2px; color:#c7d0da; line-height:1.4; }
.shift-note b{ color:var(--accent); }
.shift-canvas{ flex:1; min-height:180px; }
.shift-arrow{ align-self:center; width:40px; height:40px; border-radius:50%; background:var(--panel); border:1px solid var(--border); color:var(--accent); display:flex; align-items:center; justify-content:center; overflow:visible;
  box-shadow:0 0 0 0 rgba(255,90,31,.4); animation: arrowPulse 2.4s ease-in-out infinite; }
.shift-arrow-ic{ display:flex; animation: arrowNudge 1.6s ease-in-out infinite; }
.shift-arrow svg{ width:18px; height:18px; }
@keyframes arrowNudge{ 0%,100%{ transform:translateX(0); } 50%{ transform:translateX(4px); } }
@keyframes arrowPulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(255,90,31,.35); } 50%{ box-shadow:0 0 0 9px rgba(255,90,31,0); } }

/* ---- carousel scrollable rich items ---- */
.car-item.car-item-scroll{ display:block; overflow-y:auto; align-items:stretch; justify-content:stretch; padding:4px 64px 8px; }



/* ==================== MOTION LAYER ==================== */
.reveal{ opacity:0; transform:translateY(18px); }
.sec-active .reveal{ animation: revealUp .65s cubic-bezier(.16,1,.3,1) forwards; animation-delay: var(--d,0s); }
@keyframes revealUp{ to{ opacity:1; transform:translateY(0); } }

.sec-body, .sec-banner{ opacity:0; transform:translateY(26px); transition: opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.sec-active .sec-body, .sec-active .sec-banner{ opacity:1; transform:translateY(0); }

.mx-box{ opacity:0; transform:scale(.86); }
.sec-active .mx-box{ animation: mxIn .5s cubic-bezier(.16,1,.3,1) forwards; animation-delay: var(--d,0s); }
@keyframes mxIn{ to{ opacity:1; transform:scale(1); } }
/* once user switches tabs, boxes are repositioned via inline style/JS and should just be visible (no re-play) */
.mx-box.mx-live{ opacity:1; transform:none; animation:none; }

.car-item img, .car-item video{ transition: transform .5s cubic-bezier(.16,1,.3,1); }
.carousel-wrap:hover .car-item img{ transform:scale(1.015); }

/* progress bar shimmer */
#progress-fill{ position:relative; overflow:hidden; }
#progress-fill::after{
  content:""; position:absolute; inset:0; background:linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
  width:60px; animation: shimmerMove 2.2s ease-in-out infinite;
}
@keyframes shimmerMove{ 0%{ transform:translateX(-80px); } 100%{ transform:translateX(220px); } }

/* rail dot pulse */
.rail-dot.active{ animation: railPulse 1.8s ease-in-out infinite; }
.sec-active @keyframes railPulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(255,90,31,.5); } 50%{ box-shadow:0 0 0 5px rgba(255,90,31,0); } }

/* banner sheen */
.sec-banner{ position:relative; overflow:hidden; }
.sec-banner::before{
  content:""; position:absolute; top:0; bottom:0; width:120px; left:-140px;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.10), transparent);
  animation: sheenMove 5s ease-in-out infinite;
}
@keyframes sheenMove{ 0%{ left:-140px; } 45%{ left:110%; } 100%{ left:110%; } }

/* count-up targets */
.count-num{ display:inline-block; font-variant-numeric:tabular-nums; }

/* card hover lift, applies broadly */
.quote-card, .month-card, .icon-cell, .insight-card, .sb-block, .ic-card, .closing-item, .logo-chip{
  transition: transform .28s cubic-bezier(.16,1,.3,1), box-shadow .28s ease, background .2s ease;
}
.quote-card:hover, .month-card:hover, .icon-cell:hover, .insight-card:hover, .sb-block:hover, .ic-card:hover, .logo-chip:hover{
  transform:translateY(-4px); box-shadow:0 14px 34px rgba(0,0,0,.35);
}

/* hero / divider text stagger (gated on section becoming active) */
.hero h1, .divider h1, .sec-banner h2{ opacity:0; transform:translateY(14px); }
.sec-active .hero h1, .sec-active .divider h1, .sec-active .sec-banner h2{
  animation: revealUp .7s cubic-bezier(.16,1,.3,1) forwards; animation-delay:.08s;
}
.hero p{ opacity:0; transform:translateY(14px); }
.sec-active .hero p{ animation: revealUp .7s cubic-bezier(.16,1,.3,1) forwards; animation-delay:.2s; }
.divider .badge, .sec-banner .badge{ opacity:0; transform:translateY(14px); }
.sec-active .divider .badge, .sec-active .sec-banner .badge{
  animation: revealUp .55s cubic-bezier(.16,1,.3,1) forwards;
}

/* icongrid stagger already handled via .reveal */
@media (prefers-reduced-motion: reduce){
  .reveal, .sec-body, .sec-banner, .mx-box, .hero h1, .hero p, .divider h1, .divider .badge{ animation:none !important; transition:none !important; opacity:1 !important; transform:none !important; }

  /* TUZAK — aynı ortalama tuzağının üçüncü yüzü, bu sefer erişilebilirlik ayarında.
     Balonlar `translate(-50%,-50%)` ile ortalanıyor; yukarıdaki toplu kuralın
     `transform:none !important`i onu da siliyor ve her balon kendi yarıçapı kadar
     kayıp komşusuyla çakışıyordu. Sistem "hareketi azalt" açık bir makinede bölüm 11
     bu yüzden bozuk görünüyordu. Animasyon kapanır, konumlandırma korunur. */
  .bb-node.reveal{ transform:translate(-50%,-50%) !important; }
  .bb-node.bb-gone{ opacity:0 !important; transform:translate(-50%,-50%) scale(.3) !important; }
}

/* ---- closing head (centered banner variant) ---- */
.sec-banner-center{ text-align:center; display:flex; flex-direction:column; align-items:center; gap:14px; padding:44px 40px 30px; }
.sec-banner-center h2{ font-size:46px; font-weight:800; margin:0; text-shadow:0 0 24px rgba(255,90,31,.25); }
.badge-pill{ background:var(--accent); color:#fff; font-weight:800; font-size:13.5px; padding:10px 22px; border-radius:999px; letter-spacing:.03em; box-shadow:0 8px 24px rgba(255,90,31,.35); }

/* ---- cardpage color variants ---- */
.ic-card.cc-teal{ border-top:3px solid var(--teal); }
.ic-card.cc-teal .ic-card-icon{ background:rgba(51,194,163,.16); color:var(--teal); }
.ic-card.cc-orange{ border-top:3px solid var(--accent); }
.ic-card.cc-orange .ic-card-icon{ background:var(--accent-soft); color:var(--accent); }
.ic-card.cc-blue{ border-top:3px solid var(--blue); }
.ic-card.cc-blue .ic-card-icon{ background:rgba(79,140,255,.16); color:var(--blue); }
.ic-card.cc-pink{ border-top:3px solid #f472b6; }
.ic-card.cc-pink .ic-card-icon{ background:rgba(244,114,182,.16); color:#f472b6; }
.ic-card.cc-purple{ border-top:3px solid #a78bfa; }
.ic-card.cc-purple .ic-card-icon{ background:rgba(167,139,250,.16); color:#a78bfa; }
.ic-card.cc-cyan{ border-top:3px solid #22d3ee; }
.ic-card.cc-cyan .ic-card-icon{ background:rgba(34,211,238,.16); color:#22d3ee; }
.ic-card.cc-red{ border-top:3px solid #f87171; }
.ic-card.cc-red .ic-card-icon{ background:rgba(248,113,113,.16); color:#f87171; }

.car-item.cardpage{ align-items:stretch; }
.car-item.cardpage .ic-grid{ height:100%; }

/* ---- morph ghost (5 -> 6 transition) ---- */
.morph-ghost{
  pointer-events:none; display:flex; align-items:center; justify-content:center; text-align:center;
  color:#fff; font-size:10.5px; font-weight:800; padding:4px; overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.35); line-height:1.15;
}

/* ---- BUBBLES (kelime bulutu) ---- */
.bubbles .sec-body{ gap:7px; padding-top:40px; padding-bottom:40px; }
.bubbles .badge{ align-self:flex-start; background:var(--accent); color:#fff; font-weight:700; font-size:13px; padding:7px 14px; border-radius:8px; }
.bubbles h2{ font-size:28px; font-weight:800; margin:2px 0 0; }
.bb-bar{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:2px; }
.bb-scan{ display:inline-flex; align-items:center; gap:7px; background:var(--panel); border:1px solid var(--border);
  color:#c9d2db; font-size:12px; font-weight:700; padding:7px 13px; border-radius:999px; white-space:nowrap; }
.bb-chips{ display:flex; gap:7px; flex-wrap:wrap; }
.bb-chip{ display:inline-flex; align-items:center; gap:6px; background:var(--panel); border:1px solid var(--border);
  color:#aeb8c4; font-size:11.5px; font-weight:800; letter-spacing:.02em; padding:7px 14px; border-radius:999px;
  cursor:pointer; transition:background .18s ease, color .18s ease, border-color .18s ease; }
.bb-chip .bb-dot{ width:7px; height:7px; border-radius:50%; background:var(--bbc,#888); }
.bb-chip:hover{ background:var(--panel-soft); color:#fff; }
.bb-chip.active{ color:#fff; border-color:var(--bbc,var(--accent)); background:color-mix(in srgb, var(--bbc,#ff5a1f) 22%, #0f1420); }
.bb-chip[data-tier="all"].active{ background:var(--accent); border-color:var(--accent); }

.bb-canvas{ position:relative; width:100%; flex:1; min-height:0; margin-top:4px; display:flex; }
.bb-stage{ position:relative; margin:auto; }
.bb-node{ container-type:inline-size; position:absolute; transform:translate(-50%,-50%); aspect-ratio:1/1; border-radius:50%; cursor:pointer;
  display:flex; align-items:center; justify-content:center; text-align:center; color:#fff; cursor:default;
  background:var(--bbc);   /* color-mix desteklemeyen tarayıcı için düz renk yedeği */
  background:radial-gradient(circle at 34% 28%, color-mix(in srgb, var(--bbc) 82%, #fff 18%), var(--bbc) 62%, color-mix(in srgb, var(--bbc) 74%, #000 26%) 100%);
  box-shadow:0 10px 26px rgba(0,0,0,.42), inset 0 -6px 14px rgba(0,0,0,.18);
  transition:opacity .4s ease, filter .25s ease, transform .45s cubic-bezier(.16,1,.3,1), left .55s cubic-bezier(.16,1,.3,1), top .55s cubic-bezier(.16,1,.3,1), width .55s cubic-bezier(.16,1,.3,1); }
.bb-node:hover{ filter:brightness(1.12); transform:translate(-50%,-50%) scale(1.04); z-index:5; }
.bb-in{ display:flex; flex-direction:column; align-items:center; gap:3px; padding:7px; line-height:1.14; }
.bb-label{ font-size:18px; font-size:clamp(9px,12.5cqw,22px); font-weight:800; letter-spacing:.01em; text-shadow:0 1px 4px rgba(0,0,0,.35); }
.bb-val{ font-size:14px; font-size:clamp(8px,9cqw,15px); font-weight:800; background:rgba(0,0,0,.28); padding:1px 9px; border-radius:999px; }
.bb-node.bb-gone{ opacity:0; transform:translate(-50%,-50%) scale(.3); pointer-events:none; }



/* ---- bubble detay popup ---- */
.bb-pop{ position:absolute; inset:0; z-index:20; display:flex; align-items:center; justify-content:center;
  background:rgba(6,8,13,.72); backdrop-filter:blur(5px); opacity:0; pointer-events:none;
  transition:opacity .22s ease; }
.bb-pop[hidden]{ display:none; }
.bb-pop.open{ opacity:1; pointer-events:auto; }
.bb-pop-c{ width:min(620px,92%); max-height:92%; overflow:auto; background:#111826; border:1px solid var(--border);
  border-radius:16px; box-shadow:0 26px 70px rgba(0,0,0,.6); transform:translateY(10px); transition:transform .28s cubic-bezier(.16,1,.3,1); }
.bb-pop.open .bb-pop-c{ transform:translateY(0); }
.bb-pop-x{ position:absolute; top:12px; right:14px; z-index:2; width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,.09); border:1px solid var(--border); color:#fff; font-size:19px; line-height:1; cursor:pointer; }
.bb-pop-x:hover{ background:rgba(255,90,31,.6); }
.bb-pop-head{ padding:18px 22px 14px; border-bottom:1px solid var(--border); border-left:5px solid var(--bbc,var(--accent)); border-radius:16px 16px 0 0; }
.bb-pop-head h3{ margin:0; font-size:20px; font-weight:800; color:#fff; }
.bb-pop-tier{ display:inline-block; margin-top:6px; font-size:11px; font-weight:800; letter-spacing:.03em;
  color:var(--bbc,var(--accent)); background:rgba(255,255,255,.06); padding:4px 11px; border-radius:999px; }
.bb-pop-body{ padding:16px 22px 20px; }
.bb-pop-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:16px; }
.bb-pop-stats div{ background:var(--panel); border:1px solid var(--border); border-radius:11px; padding:11px 13px; }
.bb-pop-stats b{ display:block; font-size:21px; font-weight:800; color:#fff; }
.bb-pop-stats span{ font-size:11px; color:var(--muted); }
.bb-pop-split{ margin-bottom:16px; }
.bb-split-head{ display:flex; justify-content:space-between; font-size:11.5px; font-weight:700; color:#c9d2db; margin-bottom:6px; }
.bb-split-sub{ color:var(--muted); font-weight:600; margin:5px 0 0; }
.bb-split-bar{ height:9px; border-radius:999px; background:#33c2a3; overflow:hidden; }
.bb-split-bar i{ display:block; height:100%; background:var(--accent); }
.bb-pop-ex h4{ margin:0 0 9px; font-size:11.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); }
.bb-pop-ex ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.bb-pop-ex li{ background:var(--panel); border:1px solid var(--border); border-radius:11px; padding:11px 13px; }
.bb-ex-meta{ display:flex; align-items:center; gap:9px; margin-bottom:5px; font-size:11px; color:var(--muted); }
.bb-ex-src{ font-size:10px; font-weight:800; padding:3px 9px; border-radius:999px; }
.bb-src-k{ background:rgba(255,90,31,.18); color:var(--accent); }
.bb-src-b{ background:rgba(51,194,163,.18); color:var(--teal); }
.bb-ex-txt{ display:block; font-size:12.4px; line-height:1.5; color:#d7dee6; }
.bb-pop-empty{ color:var(--muted); font-size:13px; margin:0; }


/* ═══════════════════════════════════════════════════════
   PR BİLEŞENLERİ
   ═══════════════════════════════════════════════════════ */

/* ---- ortak: sekme satırı ---- */
.pr-tabs-row{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin:4px 0 12px; }
.pr-tabs{ display:flex; gap:7px; flex-wrap:wrap; }
.pr-tab{ background:var(--panel); border:1px solid var(--border); color:var(--muted);
  border-radius:9px; padding:7px 14px; font:inherit; font-size:13px; font-weight:600; cursor:pointer;
  transition:background .18s ease, color .18s ease, border-color .18s ease; }
.pr-tab:hover{ color:#fff; border-color:rgba(255,255,255,.2); }
.pr-tab.active{ background:var(--accent); border-color:var(--accent); color:#fff; }

/* ---- HERO ek: kicker + büyük rakamlar ---- */
.hero-kicker{ font-size:13px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(255,255,255,.92); margin-bottom:12px; }
.hero-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:32px; max-width:1180px; }
.hero-stat{ background:rgba(10,13,19,.42); backdrop-filter:blur(9px); border:1px solid rgba(255,255,255,.16);
  border-radius:14px; padding:18px 20px; display:flex; flex-direction:column; gap:3px; }
.hero-stat b{ font-size:44px; font-weight:800; line-height:1.05; color:#fff; letter-spacing:-.02em; }
.hero-stat span{ font-size:13px; font-weight:600; color:rgba(255,255,255,.94); }
.hero-stat em{ font-size:11.5px; font-style:normal; color:rgba(255,255,255,.7); }

/* ---- GAUGE: hedef-gerçekleşme ---- */
.gauge .sec-body{ gap:8px; }
.gg-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; flex:1; min-height:0; align-content:center; }
.gg-card{ background:var(--panel); border:1px solid var(--border); border-radius:16px;
  padding:22px 24px 20px; display:flex; flex-direction:column; gap:14px; }
.gg-head{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.gg-head h4{ margin:0; font-size:15.5px; font-weight:700; color:#fff; }
.gg-pct{ font-size:34px; font-weight:800; color:var(--accent); letter-spacing:-.02em; line-height:1; }
.gg-track{ position:relative; height:14px; border-radius:8px; background:rgba(255,255,255,.07); overflow:visible; }
.gg-fill{ position:absolute; inset:0 auto 0 0; width:0; border-radius:8px;
  background:linear-gradient(90deg,#e8380d,var(--accent)); transition:width 1.1s cubic-bezier(.16,1,.3,1) .25s; }
.sec-active .gg-fill{ width:var(--w); }
.gg-marker{ position:absolute; top:-6px; bottom:-6px; width:2px; background:#fff; opacity:.85;
  transform:translateX(-1px); border-radius:2px; }
.gg-marker::after{ content:""; position:absolute; top:-4px; left:50%; transform:translateX(-50%);
  width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent; border-top:5px solid #fff; }
.gg-scale{ position:relative; height:15px; font-size:11px; color:var(--muted); }
.gg-scale > span:first-child{ position:absolute; left:0; }
.gg-scale > span:last-child{ position:absolute; right:0; }
.gg-mk-lbl{ position:absolute; transform:translateX(-50%); white-space:nowrap; color:#fff; font-weight:600; }
.gg-nums{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding-top:4px;
  border-top:1px solid var(--border); }
.gg-nums div{ display:flex; flex-direction:column; gap:2px; }
.gg-nums span{ font-size:11px; color:var(--muted); }
.gg-nums b{ font-size:15px; font-weight:700; color:#fff; }
.gg-nums b.neg{ color:var(--red); }
.gg-rate{ display:flex; gap:9px; align-items:flex-start; background:rgba(242,85,90,.10);
  border:1px solid rgba(242,85,90,.24); border-radius:10px; padding:10px 12px; font-size:12.5px;
  line-height:1.45; color:#f3d2d3; }
.gg-rate b{ color:#fff; }
.gg-rate-ic{ flex:none; width:16px; height:16px; color:var(--red); margin-top:1px; }
.gg-rate-ic svg{ width:100%; height:100%; }
.gg-foot{ font-size:13px; line-height:1.55; color:#cfd8e2; background:var(--panel-soft);
  border:1px solid var(--border); border-left:none; border-radius:12px; padding:13px 18px; margin-top:6px; }
.gg-foot b{ color:#fff; }

/* ---- SERIES: sekmeli sütun grafiği ---- */
.series .sec-body{ gap:6px; }
.sv-wrap{ display:flex; flex-direction:column; flex:1; min-height:0; }
.sv-plot{ flex:1; min-height:0; }
.sv-svg{ width:100%; height:100%; display:block; }
.sv-grid{ stroke:rgba(255,255,255,.08); stroke-width:1; }
.sv-base{ stroke:rgba(255,255,255,.22); stroke-width:1; }
.sv-axis{ fill:var(--muted); font-size:11px; font-family:var(--font); }
.sv-band{ fill:#f2a3a5; font-size:11px; font-weight:600; font-family:var(--font); }
.sv-null{ fill:none; stroke:rgba(255,255,255,.3); stroke-width:1; stroke-dasharray:2 2; }
.sv-bar{ transform-box:fill-box; transform-origin:bottom; transform:scaleY(0); }
.sec-active .sv-bar{ animation:svGrow .7s cubic-bezier(.16,1,.3,1) forwards; animation-delay:var(--d); }
@keyframes svGrow{ to{ transform:scaleY(1); } }
.sv-a{ fill:var(--prev); }
.sv-b{ fill:var(--accent); }
.sv-legend{ display:flex; gap:16px; font-size:12px; color:var(--muted); align-items:center; flex-wrap:wrap; }
.sv-legend span{ display:flex; align-items:center; gap:6px; }
.sv-key{ width:11px; height:11px; border-radius:3px; display:inline-block; }
.sv-key-a{ background:var(--prev); }
.sv-key-b{ background:var(--accent); }
.sv-key-n{ background:transparent; border:1px dashed rgba(255,255,255,.45); }
.sv-axis-row{ display:flex; }
.sv-cell{ flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; padding-top:6px; min-width:0; }
.sv-cat{ font-size:11.5px; font-weight:600; color:#dbe2ea; white-space:nowrap; }
.sv-cell-empty .sv-cat{ color:#55606d; }
.sv-chip{ font-size:10.5px; font-weight:700; padding:2px 6px; border-radius:5px; white-space:nowrap; }
.sv-chip.up{ background:rgba(51,194,163,.16); color:var(--teal); }
.sv-chip.down{ background:rgba(242,85,90,.16); color:var(--red); }
.sv-chip-void{ background:rgba(255,255,255,.06); color:#6b7684; }
.sv-summary{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:14px; padding-top:13px;
  border-top:1px solid var(--border); }
.sv-sum{ display:flex; flex-direction:column; gap:2px; }
.sv-sum span{ font-size:11px; color:var(--muted); }
.sv-sum b{ font-size:19px; font-weight:800; color:#dbe2ea; }
.sv-sum-hi b{ color:#fff; }
.sv-arrow{ width:18px; height:18px; color:var(--muted); }
.sv-arrow svg{ width:100%; height:100%; }
.sv-delta{ font-size:17px; font-weight:800; padding:5px 12px; border-radius:9px; }
.sv-delta.down{ background:rgba(242,85,90,.14); color:var(--red); }
.sv-delta.up{ background:rgba(51,194,163,.14); color:var(--teal); }
.sv-mnote{ font-size:12px; color:var(--muted); line-height:1.45; flex:1; min-width:240px; }

/* ---- RANKBARS: sıralama çubukları ---- */
.rankbars .sec-body{ gap:6px; }
.rb-wrap{ flex:1; min-height:0; display:flex; flex-direction:column; }
.rb-list{ display:flex; flex-direction:column; gap:7px; flex:1; justify-content:center; }
.rb-row{ display:grid; grid-template-columns:26px 178px 1fr 128px; align-items:center; gap:12px;
  padding:5px 10px; border-radius:9px; border:1px solid transparent; }
.rb-rank{ font-size:12px; font-weight:800; color:var(--muted); text-align:center;
  background:rgba(255,255,255,.05); border-radius:6px; padding:3px 0; }
.rb-label{ font-size:13.5px; font-weight:600; color:#dbe2ea; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rb-bar{ height:17px; background:rgba(255,255,255,.05); border-radius:5px; overflow:hidden; }
.rb-bar i{ display:block; height:100%; width:0; border-radius:5px; background:var(--prev);
  transition:width .85s cubic-bezier(.16,1,.3,1) .15s; }
.sec-active .rb-bar i, .car-item .rb-bar i{ width:var(--w); }
.rb-val{ font-size:13.5px; font-weight:700; color:#e7ecf1; text-align:right; font-variant-numeric:tabular-nums; }
.rb-hi{ background:rgba(255,106,0,.10); border-color:rgba(255,106,0,.34); }
.rb-hi .rb-bar i{ background:linear-gradient(90deg,#e8380d,var(--accent)); }
.rb-hi .rb-label, .rb-hi .rb-val{ color:#fff; }
.rb-hi .rb-rank{ background:var(--accent); color:#fff; }
.rb-good{ background:rgba(51,194,163,.10); border-color:rgba(51,194,163,.34); }
.rb-good .rb-bar i{ background:var(--teal); }
.rb-good .rb-label, .rb-good .rb-val{ color:#fff; }
.rb-good .rb-rank{ background:var(--teal); color:#08201b; }
.rb-note{ font-size:12px; color:var(--muted); line-height:1.5; margin-top:10px; padding-top:10px;
  border-top:1px solid var(--border); }

/* ---- STACKBARS: yığılmış oran ---- */
.stackbars .sec-body{ gap:6px; }
.sk-legend{ display:flex; gap:16px; font-size:12px; color:var(--muted); flex-wrap:wrap; }
.sk-legend span{ display:flex; align-items:center; gap:6px; }
.sk-legend i{ width:11px; height:11px; border-radius:3px; }
.sk-collabel{ font-size:12px; color:var(--muted); font-weight:600; }
.sk-list{ display:flex; flex-direction:column; gap:8px; flex:1; justify-content:center; min-height:0; }
.sk-row{ display:grid; grid-template-columns:178px 1fr 56px; align-items:center; gap:12px;
  padding:5px 10px; border-radius:9px; border:1px solid transparent; }
.sk-label{ font-size:13.5px; font-weight:600; color:#dbe2ea; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sk-bar{ display:flex; height:24px; border-radius:6px; overflow:hidden; background:rgba(255,255,255,.05); }
.sk-seg{ display:flex; align-items:center; justify-content:center; width:0; min-width:0;
  transition:width .85s cubic-bezier(.16,1,.3,1) .15s; }
.sec-active .sk-seg, .car-item .sk-seg{ width:var(--w); }
.sk-seg span{ font-size:11px; font-weight:700; color:rgba(255,255,255,.95); white-space:nowrap; }
.sk-pct{ font-size:13.5px; font-weight:800; color:#e7ecf1; text-align:right; font-variant-numeric:tabular-nums; }
.sk-hi{ background:rgba(255,106,0,.10); border-color:rgba(255,106,0,.34); }
.sk-hi .sk-label, .sk-hi .sk-pct{ color:#fff; }

/* ---- DUALSHARE: emek payı ↔ etki payı ---- */
.dualshare .sec-body{ gap:6px; }
.ds-grid{ display:grid; grid-template-columns:minmax(0,1fr) 460px; gap:26px; flex:1; min-height:0; align-items:stretch; }
.ds-chart{ display:flex; flex-direction:column; min-height:0; }
.ds-heads{ display:flex; justify-content:space-between; font-size:12.5px; font-weight:700;
  color:#dbe2ea; margin-bottom:8px; }
.ds-svg{ width:100%; flex:1; min-height:0; display:block; }
.ds-rib{ opacity:0; }
.sec-active .ds-rib, .car-item .ds-rib{ animation:dsFade .7s ease forwards; animation-delay:var(--d); }
@keyframes dsFade{ to{ opacity:.24; } }
.ds-col{ opacity:0; }
.sec-active .ds-col, .car-item .ds-col{ animation:dsCol .55s ease forwards; animation-delay:var(--d); }
@keyframes dsCol{ to{ opacity:1; } }
.ds-in{ fill:#fff; font-size:13px; font-weight:800; font-family:var(--font); }
.ds-side{ display:flex; flex-direction:column; gap:10px; min-height:0; }
.ds-leg{ display:flex; flex-direction:column; gap:6px; }
.ds-leg-row{ display:grid; grid-template-columns:12px minmax(0,1fr) auto auto; gap:10px; align-items:center;
  background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:9px 12px; }
.ds-leg-row i{ width:12px; height:12px; border-radius:3px; }
.ds-leg-name{ font-size:13px; font-weight:700; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ds-leg-nums{ font-size:11.5px; color:var(--muted); white-space:nowrap; }
.ds-mult{ font-size:13px; font-weight:800; padding:2px 8px; border-radius:6px; white-space:nowrap; }
.ds-mult.up{ background:rgba(51,194,163,.16); color:var(--teal); }
.ds-mult.down{ background:rgba(242,85,90,.16); color:var(--red); }
.ds-mult.flat{ background:rgba(255,255,255,.08); color:#c3ccd6; }
.ds-side .insight-card{ margin:0; }

/* ---- poptable ek ---- */
.pt-row-link{ cursor:pointer; }
.pt-sum-box b.pt-pct{ display:inline-block; }

/* ---- 1920×1080 ince ayar ---- */
/* (eski min-width:1500px kırılımı: sabit 1920 sahnede her zaman geçerli) */
  .rb-row{ grid-template-columns:30px 200px 1fr 150px; padding:7px 12px; }
  .sk-row{ grid-template-columns:200px 1fr 64px; padding:7px 12px; }
  .rb-label,.sk-label{ font-size:15px; }
  .rb-val,.sk-pct{ font-size:15px; }
  .rb-bar{ height:20px; }
  .sk-bar{ height:28px; }
  .gg-card{ padding:26px 28px 24px; }
  .sv-cat{ font-size:12.5px; }


/* ---- karusel içinde tam bileşen: içerik doğal yüksekliğini alır, öğe kendi içinde kayar ---- */
.car-item.car-item-scroll{ display:flex; flex-direction:column; gap:6px; align-items:stretch; }
.car-item-scroll > .badge, .car-item-scroll > .kicker, .car-item-scroll > h1, .car-item-scroll > h2,
.car-item-scroll > .ci-note, .car-item-scroll > .pr-tabs-row, .car-item-scroll > .pt-summary{ flex:none; }
.car-item-scroll .rb-list, .car-item-scroll .sk-list, .car-item-scroll .month-grid,
.car-item-scroll .ic-grid, .car-item-scroll .sb-grid, .car-item-scroll .gg-grid{ flex:none; }
.car-item-scroll .rb-wrap, .car-item-scroll .sv-wrap{ flex:none; }
.car-item-scroll .mx-wrap{ flex:1; min-height:420px; }
.car-item-scroll .pt-table-wrap{ flex:none; overflow:visible; }
.car-item-scroll .insight-grid{ flex:none; }
.car-item-scroll::-webkit-scrollbar{ width:8px; }
.car-item-scroll::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.14); border-radius:4px; }
.car-item-scroll{ scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.14) transparent; }

/* karusel içindeki başlık boyutları biraz küçülsün */
.car-item-scroll h1{ font-size:30px; margin:0 0 6px; }
.car-item-scroll h2{ font-size:28px; margin:2px 0 4px; font-weight:800; }

/* ═══════ yerleşim düzeltmeleri (1920×1080 doğrulaması sonrası) ═══════ */

/* SVG'ye kesin yükseklik: viewBox'lı bir <svg> width:100% ile kendi en-boy oranına
   düşüyor ve kabın altında boşluk bırakıyordu. Mutlak konum bunu kesinleştirir. */
.sv-plot{ position:relative; }
.sv-svg{ position:absolute; inset:0; width:100%; height:100%; }

/* Sıralama ve yığın satırları boş alanı paylaşsın — ortalanıp üstte/altta
   büyük boşluk bırakmak yerine bölümü dolduruyorlar. */
.rb-list, .sk-list{ justify-content:stretch; }
.rb-row, .sk-row{ flex:1 1 0; min-height:34px; }
.car-item-scroll .rb-row, .car-item-scroll .sk-row{ flex:none; }

/* Hedef kartları: başlık üstte kalsın, kart+dipnot kalan alanda ortalansın */
.gg-grid{ flex:none; margin-top:auto; }
.gg-foot{ margin-bottom:auto; margin-top:16px; }

/* Karusel öğesi: içerik kısa ise ortalansın, uzunsa üstten başlayıp kaysın.
   'safe' anahtar sözcüğü, taşma durumunda üstün kırpılmasını engeller. */
.car-item.car-item-scroll{ justify-content:safe center; padding-bottom:46px; }

/* Kapak: logo koyu katmanın altında kalmasın — yalnızca alt üçte bir koyulaşsın */
.hero .bg-overlay{
  background:linear-gradient(180deg, rgba(6,8,12,0) 0%, rgba(6,8,12,.06) 42%,
    rgba(6,8,12,.62) 74%, rgba(6,8,12,.93) 100%);
}
.hero h1{ text-shadow:0 2px 24px rgba(0,0,0,.55); }
.hero p{ text-shadow:0 1px 12px rgba(0,0,0,.6); }
.hero-kicker{ text-shadow:0 1px 10px rgba(0,0,0,.7); }

/* Bölüm etiketi (#sec-label) sabit olarak sol üstte duruyor; başlık bandının
   rozeti onun altından başlamalı. */
.sec-banner{ padding-top:44px; padding-bottom:20px; }
.car-item.car-item-scroll{ padding-bottom:38px; }

/* Hedef kartları boş alanı doldursun — üç kart dikeyde gerilir, içerik
   kart içinde dağıtılır. Böylece bölümde büyük ölü alan kalmıyor. */
.gg-grid{ flex:1; align-content:stretch; margin-top:0; }
.gg-card{ justify-content:center; gap:22px; padding:34px 32px; }
.gg-pct{ font-size:48px; }
.gg-head h4{ font-size:17px; }
.gg-track{ height:18px; }
.gg-nums b{ font-size:17px; }
.gg-nums span{ font-size:11.5px; }
.gg-rate{ font-size:13px; padding:12px 14px; }
.gg-foot{ margin-bottom:0; margin-top:18px; }

/* ---- gauge: aylık tempo karşılaştırması ---- */
.gg-card{ justify-content:flex-start; gap:14px; }
.gg-pace{ margin-top:auto; padding-top:14px; border-top:1px solid var(--border);
  display:flex; flex-direction:column; gap:11px; }
.gg-pace-label{ font-size:11px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); }
.gg-pace-item{ display:flex; flex-direction:column; gap:5px; }
.gg-pace-top{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.gg-pace-top span{ font-size:12px; color:#c3ccd6; }
.gg-pace-top b{ font-size:16px; font-weight:800; color:#fff; font-variant-numeric:tabular-nums; }
.gg-pace-top b.neg{ color:var(--red); }
.gg-pace-bar{ height:9px; border-radius:5px; background:rgba(255,255,255,.06); overflow:hidden; }
.gg-pace-bar i{ display:block; height:100%; width:0; border-radius:5px;
  transition:width .9s cubic-bezier(.16,1,.3,1) .4s; }
.sec-active .gg-pace-bar i{ width:var(--w); }
.gg-pace-bar i.now{ background:var(--teal); }
.gg-pace-bar i.need{ background:var(--red); }

/* ---- son yerleşim ayarı: kartlar içeriğe göre boyutlansın, ızgara ortalansın ---- */
.gg-grid{ align-content:center; }
.gg-pace{ margin-top:0; }
.car-item-scroll.cardpage .ic-grid{ height:auto; align-content:center; }
.car-item-scroll .ic-card{ align-self:start; }
.pt-pct.flat{ background:rgba(255,255,255,.08); color:#c3ccd6; }

/* ═══════ REVİZYON: logo katmanı · metrik açıklaması · eylem katmanı ═══════ */

/* ---- kapak logosu: bağımsız katman, metinle çakışmaz ---- */
.hero-logo{
  position:absolute; left:88px; top:70px; z-index:3;
  width:400px; height:auto; display:block;
  filter:drop-shadow(0 4px 22px rgba(0,0,0,.30));
}

/* ---- metrik açıklaması: aktif sekmenin ne ölçtüğünü anlatır ---- */
.pr-desc{
  display:flex; align-items:flex-start; gap:10px;
  background:rgba(255,106,0,.07); border:1px solid rgba(255,106,0,.20);
  border-radius:10px; padding:10px 14px; margin:0 0 12px;
  font-size:12.5px; line-height:1.5; color:#dbe2ea;
  transition:background .2s ease, border-color .2s ease;
}
.pr-desc-off{ display:none; }
.pr-desc-ic{ flex:none; width:16px; height:16px; color:var(--accent); margin-top:1px; }
.pr-desc-ic svg{ width:100%; height:100%; }
.pr-desc-t{ flex:1; }
.mx-wrap .pr-desc{ margin:0 0 10px; }
.car-item-scroll .pr-desc{ flex:none; }

/* ---- NE YAPABİLİRİZ? butonu ---- */
.gg-act{
  display:flex; align-items:center; justify-content:center; gap:8px;
  width:100%; margin-top:2px; padding:11px 16px; cursor:pointer;
  font:inherit; font-size:12.5px; font-weight:800; letter-spacing:.06em;
  color:#06231d; background:linear-gradient(135deg,#3ddab4,#33c2a3);
  border:none; border-radius:10px;
  box-shadow:0 6px 18px rgba(51,194,163,.22);
  transition:transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
.gg-act:hover{ transform:translateY(-1px); box-shadow:0 10px 26px rgba(51,194,163,.34); filter:brightness(1.06); }
.gg-act:active{ transform:translateY(0); }
.gg-act-ic{ width:15px; height:15px; display:block; }
.gg-act-ic svg{ width:100%; height:100%; }

/* ---- eylem katmanı ---- */
.act-pop{
  position:fixed; inset:0; z-index:95;
  display:flex; align-items:center; justify-content:center; padding:40px;
  background:rgba(6,8,13,.86); backdrop-filter:blur(8px);
  opacity:0; pointer-events:none; transition:opacity .22s ease;
}
.act-pop[hidden]{ display:none; }
.act-pop.open{ opacity:1; pointer-events:auto; }
.act-pop-c{
  position:relative; width:880px; max-height:950.4px; overflow:auto;
  background:#111826; border:1px solid var(--border); border-radius:18px;
  box-shadow:0 30px 90px rgba(0,0,0,.65);
  transform:translateY(14px); transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.act-pop.open .act-pop-c{ transform:translateY(0); }
.act-pop-c::-webkit-scrollbar{ width:9px; }
.act-pop-c::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.14); border-radius:5px; }
.act-pop-x{
  position:absolute; top:14px; right:16px; z-index:2; width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,.09); border:1px solid var(--border); color:#fff;
  font-size:20px; line-height:1; cursor:pointer; transition:background .18s ease;
}
.act-pop-x:hover{ background:rgba(51,194,163,.6); }
.act-pop-head{
  padding:26px 30px 20px; border-bottom:1px solid var(--border);
  border-top:4px solid var(--teal); border-radius:18px 18px 0 0;
  background:linear-gradient(160deg, rgba(51,194,163,.10), transparent 70%);
}
.act-pop-kicker{
  font-size:11.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--teal); margin-bottom:8px;
}
.act-pop-head h3{ margin:0 0 8px; font-size:25px; font-weight:800; color:#fff; letter-spacing:-.01em; padding-right:40px; }
.act-pop-head p{ margin:0; font-size:13.5px; line-height:1.55; color:#c3ccd6; }
.act-pop-head p b{ color:#fff; }
.act-pop-body{ padding:20px 30px 26px; }
.act-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.act-list li{
  display:grid; grid-template-columns:34px 1fr; gap:14px; align-items:start;
  background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:14px 16px;
  opacity:0; transform:translateY(8px);
  animation:actIn .42s cubic-bezier(.16,1,.3,1) forwards; animation-delay:var(--d);
}
@keyframes actIn{ to{ opacity:1; transform:translateY(0); } }
.act-n{
  font-size:12px; font-weight:800; color:var(--teal); background:rgba(51,194,163,.14);
  border-radius:7px; padding:5px 0; text-align:center;
}
.act-list h4{ margin:0 0 5px; font-size:14.5px; font-weight:800; color:#fff; }
.act-list p{ margin:0; font-size:12.8px; line-height:1.55; color:#d0d8e1; }
.act-list p b{ color:#fff; }
.act-foot{
  margin-top:14px; padding:13px 16px; font-size:12.8px; line-height:1.55; color:#f0d6c8;
  background:rgba(255,106,0,.09); border:1px solid rgba(255,106,0,.24); border-radius:11px;
}
.act-foot b{ color:#fff; }



/* ---- shift: alt kartlar ve dipnot (kanal stratejisi sayfası) ---- */
.car-item-scroll.shift{ gap:8px; }
.shift-cards{ flex:none; grid-template-columns:repeat(3,1fr); margin-top:2px; }
.shift-cards .insight-card:nth-child(3n+2){ border-left-color:var(--teal); }
.shift-cards .insight-card:nth-child(3n){ border-left-color:var(--blue); }
.car-item-scroll .shift-grid{ flex:none; min-height:250px; }
.car-item-scroll .shift-canvas{ min-height:200px; }

/* ---- shift: lejant + tıklanabilir kutular ---- */
.shift-legend{ display:flex; flex-wrap:wrap; gap:8px 16px; padding-top:9px; }
.shift-leg{ display:flex; align-items:center; gap:7px; font-size:12px; color:#c3ccd6;
  cursor:pointer; border-radius:6px; padding:2px 6px 2px 2px; transition:background .16s ease, color .16s ease; }
.shift-leg:hover{ background:rgba(255,255,255,.07); color:#fff; }
.shift-leg i{ width:11px; height:11px; border-radius:3px; flex:none; }
.shift-leg b{ color:#fff; font-variant-numeric:tabular-nums; }
.mx-clickable .mx-box{ cursor:pointer; }
.mx-clickable .mx-box:hover{ filter:brightness(1.1); }

/* ---- detay katmanı (shift kutuları) ---- */
.det-pop .act-pop-head{ border-top-color:var(--dc,var(--accent));
  background:linear-gradient(160deg, rgba(255,255,255,.07), transparent 70%); }
.det-pop .act-pop-kicker{ color:var(--dc,var(--accent)); }
.det-pop .act-pop-x:hover{ background:var(--dc,var(--accent)); }
.det-val{ display:inline-block; margin-left:10px; font-size:17px; font-weight:800;
  color:var(--dc,var(--accent)); background:rgba(255,255,255,.07);
  padding:3px 11px; border-radius:8px; vertical-align:middle; font-variant-numeric:tabular-nums; }
.det-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px; margin-bottom:16px; }
.det-stats div{ background:var(--panel); border:1px solid var(--border); border-radius:11px; padding:11px 13px; }
.det-stats span{ display:block; font-size:11px; color:var(--muted); margin-bottom:3px; }
.det-stats b{ font-size:18px; font-weight:800; color:#fff; font-variant-numeric:tabular-nums; }
.det-points{ display:flex; flex-direction:column; gap:11px; }
.det-point{ background:var(--panel); border:1px solid var(--border); border-left:3px solid var(--dc,var(--accent));
  border-radius:11px; padding:13px 16px; opacity:0; transform:translateY(8px);
  animation:actIn .42s cubic-bezier(.16,1,.3,1) forwards; animation-delay:var(--d); }
.det-point h4{ margin:0 0 5px; font-size:14px; font-weight:800; color:#fff; }
.det-point p{ margin:0; font-size:12.8px; line-height:1.55; color:#d0d8e1; }
.det-point p b{ color:#fff; }
.shift-hint{ color:#c7d0da; font-size:12.5px; margin:0 0 6px; }
.shift-hint::before{ content:"↳ "; color:var(--accent); font-weight:700; }
.bb-pop-note{ margin:0 0 16px; font-size:12.8px; line-height:1.55; color:#c9d2db;
  background:rgba(255,255,255,.04); border:1px solid var(--border); border-radius:11px; padding:12px 14px; }
.bb-pop-note b{ color:#fff; }
.bb-ex-src.bb-src-y{ background:rgba(240,180,61,.18); color:#f0b43d; }

/* ═══════ REFERANS KODDAKİ TUZAK: balon ortalamasının ezilmesi ═══════
   .reveal animasyonu `forwards` ile bittiğinde son kare `transform:translateY(0)`
   uygular. Animasyonla gelen değer, normal bildirimlerden önceliklidir; bu yüzden
   .bb-node'un `translate(-50%,-50%)` ortalaması eziliyor ve her balon kendi
   yarıçapı kadar sağa/aşağı kayıyordu (sahne dışına 100px'e varan taşma).
   Çözüm: balonlarda transform'a hiç dokunmayan, yalnızca opaklığı animasyonlayan
   ayrı bir belirme kullan. Böylece taban, :hover ve .bb-gone transformları çalışır. */
.bb-node.reveal{ opacity:0; transform:translate(-50%,-50%); }
.sec-active .bb-node.reveal,
.car-item .bb-node.reveal{ animation:bbFade .55s ease forwards; animation-delay:var(--d,0s); }
@keyframes bbFade{ to{ opacity:1; } }

/* ═══════ AY IZGARASI ve AY DETAY KATMANI ═══════ */

.monthgrid .sec-body{ gap:8px; }
.mg-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:12px; flex:1; min-height:0; align-content:center; }
.mg-tile{
  display:flex; flex-direction:column; gap:10px; text-align:left; cursor:pointer;
  background:var(--panel); border:1px solid var(--border); border-top:3px solid var(--mgc,var(--accent));
  border-radius:14px; padding:16px 15px 14px; font:inherit; color:inherit;
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.mg-tile:hover{ transform:translateY(-3px); background:var(--panel-soft);
  border-color:var(--mgc,var(--accent)); box-shadow:0 14px 34px rgba(0,0,0,.42); }
.mg-name{ font-size:14px; font-weight:800; color:#fff; letter-spacing:.01em; }
.mg-big{ display:flex; align-items:baseline; gap:6px; }
.mg-big b{ font-size:40px; font-weight:800; color:var(--mgc,var(--accent)); line-height:1; letter-spacing:-.02em; }
.mg-big i{ font-style:normal; font-size:11.5px; color:var(--muted); }
.mg-rows{ display:flex; flex-direction:column; gap:5px; padding-top:9px; border-top:1px solid var(--border); }
.mg-row{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
.mg-row span{ font-size:11px; color:var(--muted); }
.mg-row b{ font-size:12.5px; font-weight:700; color:#e7ecf1; font-variant-numeric:tabular-nums; }
.mg-delta{ align-self:flex-start; font-size:11px; font-weight:800; padding:3px 8px; border-radius:6px; }
.mg-delta.up{ background:rgba(51,194,163,.16); color:var(--teal); }
.mg-delta.down{ background:rgba(242,85,90,.16); color:var(--red); }
.mg-delta.flat{ background:rgba(255,255,255,.07); color:#c3ccd6; }
.mg-cta{ display:flex; align-items:center; gap:6px; margin-top:auto; padding-top:9px;
  border-top:1px solid var(--border); font-size:11px; font-weight:700; color:var(--muted);
  letter-spacing:.04em; text-transform:uppercase; transition:color .18s ease; }
.mg-cta svg{ width:13px; height:13px; }
.mg-tile:hover .mg-cta{ color:var(--mgc,var(--accent)); }

/* ---- ay detay katmanı ---- */
.mo-pop{
  position:fixed; inset:0; z-index:96; display:flex; align-items:center; justify-content:center; padding:26px;
  background:rgba(6,8,13,.90); backdrop-filter:blur(9px);
  opacity:0; pointer-events:none; transition:opacity .24s ease;
}
.mo-pop[hidden]{ display:none; }
.mo-pop.open{ opacity:1; pointer-events:auto; }
.mo-shell{
  position:relative; width:1760px; height:950px;
  display:flex; flex-direction:column; min-height:0;
  background:var(--bg); border:1px solid var(--border); border-top:4px solid var(--mgc,var(--accent));
  border-radius:18px; box-shadow:0 34px 100px rgba(0,0,0,.7); overflow:hidden;
  transform:translateY(16px) scale(.985); transition:transform .32s cubic-bezier(.16,1,.3,1);
}
.mo-pop.open .mo-shell{ transform:translateY(0) scale(1); }
.mo-x{
  position:absolute; top:16px; right:18px; z-index:6; width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,.09); border:1px solid var(--border); color:#fff;
  font-size:22px; line-height:1; cursor:pointer; transition:background .18s ease;
}
.mo-x:hover{ background:var(--mgc,var(--accent)); }
.mo-head{ flex:none; padding:20px 70px 16px 30px; border-bottom:1px solid var(--border);
  background:linear-gradient(150deg, color-mix(in srgb, var(--mgc,var(--accent)) 14%, transparent), transparent 65%); }
.mo-kicker{ font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--mgc,var(--accent)); margin-bottom:5px; }
.mo-head h3{ margin:0 0 9px; font-size:26px; font-weight:800; color:#fff; letter-spacing:-.01em; }
.mo-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.mo-chips span{ font-size:11.5px; color:var(--muted); background:rgba(255,255,255,.05);
  border:1px solid var(--border); border-radius:999px; padding:4px 11px; }
.mo-chips b{ color:#fff; font-weight:800; font-variant-numeric:tabular-nums; }
.mo-body{ flex:1; min-height:0; display:flex; flex-direction:column; }
.mo-body .carousel-wrap{ flex:1; min-height:0; }
.mo-body .car-item{ padding:6px 58px; }
.mo-body .car-item-scroll{ padding:10px 54px 30px; }
.mo-body .car-dots{ padding:8px 0 12px; }
.mo-body .car-item-scroll h1{ font-size:27px; }
.mo-body .car-item-scroll h2{ font-size:25px; }




/* ---- ay katmanı: animasyonlar .sec-active'e bağlı, katman içinde o sınıf yok ---- */
.mo-body .reveal{ animation:revealUp .6s cubic-bezier(.16,1,.3,1) forwards; animation-delay:var(--d,0s); }
.mo-body .rb-bar i, .mo-body .sk-seg{ width:var(--w); }
.mo-body .gg-fill{ width:var(--w); }
.mo-body .gg-pace-bar i{ width:var(--w); }
.mo-body .sv-bar{ animation:svGrow .7s cubic-bezier(.16,1,.3,1) forwards; animation-delay:var(--d); }
.mo-body .ds-rib{ animation:dsFade .7s ease forwards; animation-delay:var(--d); }
.mo-body .ds-col{ animation:dsCol .55s ease forwards; animation-delay:var(--d); }
.mo-body .bb-node.reveal{ animation:bbFade .55s ease forwards; animation-delay:var(--d,0s); }
.mo-body .mx-box{ animation:mxIn .5s cubic-bezier(.16,1,.3,1) forwards; animation-delay:var(--d,0s); }
.mg-top{ display:flex; flex-direction:column; gap:3px; padding-top:9px; border-top:1px solid var(--border);
  font-size:11.5px; line-height:1.35; color:#dbe2ea; }
.mg-top i{ font-style:normal; font-size:9.5px; font-weight:700; letter-spacing:.07em;
  text-transform:uppercase; color:var(--muted); }

/* ═══════════ REVİZYON KATMANI (Ağustos 2026) ═══════════ */

/* ---- gauge: üç kart (Basılı Erişim · Online Erişim · Basılı Net Etki) ---- */
.gg-grid{ grid-template-columns:repeat(3,1fr); gap:18px; }

/* Hedefi tanımlanmamış metrik kartı */
.gg-chip{ flex:none; font-size:10.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  color:var(--muted); background:rgba(255,255,255,.06); border:1px solid var(--border);
  border-radius:999px; padding:4px 9px; white-space:nowrap; }
.gg-nt-big{ display:flex; flex-direction:column; gap:3px; padding:6px 0 2px; }
.gg-nt-big b{ font-size:42px; font-weight:800; color:#fff;
  letter-spacing:-.02em; line-height:1.02; font-variant-numeric:tabular-nums; }
.gg-nt-big span{ font-size:11.5px; color:var(--muted); }
.gg-rate-info{ background:rgba(91,141,214,.10); border-color:rgba(91,141,214,.26); color:#cfdcef; }
.gg-rate-info .gg-rate-ic{ color:var(--prev); }
.gg-card-nt .gg-act{ margin-top:auto; }

/* ---- statband: mecra x metrik künye bandı (3 x 3) ---- */
.stb{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:4px 0 2px; }
.stb-group{ background:var(--panel); border:1px solid var(--border); border-top:2px solid var(--c);
  border-radius:12px; padding:11px 14px 12px; display:flex; flex-direction:column; gap:8px; }
.stb-head{ display:flex; align-items:center; gap:7px; }
.stb-head h4{ margin:0; font-size:12px; font-weight:800; letter-spacing:.08em;
  text-transform:uppercase; color:#fff; }
.stb-ic{ width:15px; height:15px; color:var(--c); flex:none; }
.stb-ic svg{ width:100%; height:100%; }
.stb-cells{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.stb-cell{ display:flex; flex-direction:column; gap:1px; min-width:0; }
.stb-cell + .stb-cell{ border-left:1px solid var(--border); padding-left:10px; }
.stb-l{ font-size:10.5px; color:var(--muted); letter-spacing:.02em; }
.stb-cell b{ font-size:27px; font-weight:800; color:#fff;
  letter-spacing:-.02em; line-height:1.08; font-variant-numeric:tabular-nums; }
.stb-cell em{ font-size:10.5px; font-style:normal; color:#9aa7b6; line-height:1.3; }
.stb-void b{ color:var(--muted); }
.stb-void em{ color:#7d8a99; font-style:italic; }
.stb-note{ font-size:11.5px; line-height:1.5; color:var(--muted); margin:2px 0 0; }
.stb-note b{ color:#cfd8e2; }

/* Tempo sayfası artık band + grafik taşıyor; grafik biraz daha kısa duruyor */
.car-item-scroll .sv-wrap{ flex:1; min-height:0; }

/* ---- storyboard içi sayfa atlama butonu ---- */
.sb-jump{ margin-top:9px; display:inline-flex; align-items:center; gap:7px;
  background:rgba(255,106,0,.11); border:1px solid rgba(255,106,0,.32); color:#ffc79a;
  border-radius:9px; padding:8px 12px; font:inherit; font-size:12.5px; font-weight:700;
  cursor:pointer; text-align:left; line-height:1.3; transition:background .18s, border-color .18s, color .18s; }
.sb-jump:hover{ background:rgba(255,106,0,.2); border-color:rgba(255,106,0,.55); color:#fff; }
.sb-jump-ic{ flex:none; width:14px; height:14px; color:var(--accent); }
.sb-jump-ic svg{ width:100%; height:100%; }

/* Başlığı olmayan bölüm bandı (12 · Lider İletişimi) — rozet tek başına kalır */
.sec-banner-slim{ padding-bottom:10px; }

/* İki eksenli dağılımda şerit grafiği tüm yüksekliği kaplamasın — iki bantlı
   görünüm gereksiz devasa duruyordu. Sağ sütundaki kartlarla dengeli kalıyor. */
.ds-grid{ align-items:center; }
.ds-chart{ max-height:600px; }
.ds-svg{ min-height:360px; }

/* ---- kapak: rakam kutuları kalktı, tipografi büyüdü ---- */
.hero-logo{ width:460px; }
.hero-kicker{ font-size:23px; letter-spacing:.15em; margin-bottom:20px; }
.hero h1{ font-size:116px; max-width:1500px; margin-bottom:26px; }
.hero p{ font-size:33px; max-width:1100px; color:#f1f5f8; }
.hero .sec-body{ padding-bottom:120px; }

/* Künye bandı: mecraya göre hücre sayısı değişir (online ve TV'de net etki ölçülmüyor) */
.stb-cells-2{ grid-template-columns:repeat(2,1fr); }
.stb-cells-4{ grid-template-columns:repeat(4,1fr); }

/* ---- series: yazı katmanı (SVG dışında, gerilmeyen) ---- */
.sv-over{ position:absolute; inset:0; pointer-events:none; }
.sv-ytick{ position:absolute; left:0; transform:translateY(-50%); text-align:right;
  font-size:12.5px; color:var(--muted); font-variant-numeric:tabular-nums; line-height:1; }
.sv-bandlbl{ position:absolute; text-align:center; font-size:13px; font-weight:700;
  color:#f2a3a5; letter-spacing:.01em; line-height:1.3; padding:0 8px; }

/* ---- künye bandı: dar ekranda rakamlar birbirine girmesin ----
   1) gruplar sığmayınca alt satıra iner (3 → 2 → 1 sütun)
   2) büyük rakam kabına göre küçülür; taban 19px değil 15px, çünkü
      "28.863.329" gibi on karakterlik bir sayı 19px'te dar hücreye sığmıyordu
   3) container query destekleyen tarayıcıda ölçü kabın kendisinden alınır */
.stb{ grid-template-columns:repeat(auto-fit, minmax(360px, 1fr)); }
.stb-cell{ overflow:hidden; }
.stb-cell b{ font-size:27px; white-space:nowrap; }
.stb-cells{ container-type:inline-size; }
.stb-cells{ gap:8px; }
.stb-cell + .stb-cell{ padding-left:8px; }
/* Hücrenin gerçek metin genişliği = kabın 1/n'i eksi sabit boşluklar; punto
   bundan türetiliyor. Sabit px'i cqi'den düşmezsek dar ekranda boşluklar
   oransal olarak büyüyüp rakamı taşırıyor. */
.stb-cells-3 .stb-cell b{ font-size:min(27px, calc((33.33cqi - 13.33px) / 6.4)); }
.stb-cells-2 .stb-cell b{ font-size:min(27px, calc((50cqi - 12px) / 6.4)); }

/* ═══════════ RAKİP: 2025 ↔ 2026 karşılaştırma ═══════════ */

/* --- sıralama çubukları: karşılaştırmalı hâl --- */
.rb-legend{ display:flex; align-items:center; gap:18px; font-size:11.5px; color:var(--muted);
  padding:0 12px 5px; flex:none; }
.rb-legend span{ display:inline-flex; align-items:center; gap:6px; }
.rb-key{ width:14px; height:9px; border-radius:2px; flex:none; }
.rb-key-now{ background:var(--prev); }
.rb-key-prev{ background:rgba(255,255,255,.20); }
.rb-key-neg{ background:#8e2b2f; }
.rb-setd{ margin-left:auto; }
.rb-setd b{ color:#e7ecf1; }

.rb-row-cmp{ grid-template-columns:26px 168px 1fr 118px 66px 74px; }
/* (eski min-width:1500px kırılımı: sabit 1920 sahnede her zaman geçerli) */
 .rb-row-cmp{ grid-template-columns:30px 190px 1fr 140px 74px 84px; } 


.rb-bar{ position:relative; overflow:visible; }
/* geçen yıl: dolu çubuğun arkasında, tam yükseklikte soluk bant */
.rb-ghost{ position:absolute; left:0; top:0; bottom:0; width:0; border-radius:5px;
  background:rgba(255,255,255,.13); transition:width 1s cubic-bezier(.16,1,.3,1) .1s; }
.sec-active .rb-ghost, .car-item .rb-ghost, .mo-body .rb-ghost{ width:var(--w); }
.rb-ghost em{ position:absolute; right:0; top:-2px; bottom:-2px; width:2px;
  background:rgba(255,255,255,.45); border-radius:2px; }
/* bu yıl: önde, ince ve dikeyde ortalanmış.
   TUZAK: yüzdelik margin-top, kabın YÜKSEKLİĞİNE değil GENİŞLİĞİNE göre
   hesaplanır — 20%, 20px'lik çubukta 4px değil 237px eder ve dolu çubuğu
   sayfanın aşağısına atar. Ortalama flex ile yapılıyor. */
.rb-row-cmp .rb-bar{ display:flex; align-items:center; }
.rb-row-cmp .rb-bar i{ position:relative; z-index:1; height:60%; }
/* olumsuz pay, dolu çubuğun sağ ucunda */
.rb-bar i u{ position:absolute; right:0; top:0; bottom:0; background:#8e2b2f;
  border-radius:0 5px 5px 0; text-decoration:none; }

.rb-val{ display:flex; flex-direction:column; align-items:flex-end; line-height:1.15; }
.rb-val em{ font-size:11px; font-style:normal; font-weight:600; color:var(--muted); }
.rb-delta{ font-size:12px; font-weight:800; text-align:right; font-variant-numeric:tabular-nums; }
.rb-delta.up{ color:var(--teal); }
.rb-delta.down{ color:var(--red); }
.rb-move{ display:inline-flex; align-items:center; justify-content:center; gap:2px;
  font-size:11.5px; font-weight:800; border-radius:6px; padding:3px 5px;
  font-variant-numeric:tabular-nums; white-space:nowrap; }
.rb-move i{ font-style:normal; font-size:9px; }
.rb-move.up{ background:rgba(51,194,163,.16); color:var(--teal); }
.rb-move.down{ background:rgba(242,85,90,.16); color:var(--red); }
.rb-move.flat{ background:rgba(255,255,255,.06); color:var(--muted); }

/* --- bump: sıra değişim grafiği --- */
.bp-wrap{ display:flex; flex-direction:column; flex:1; min-height:0; gap:10px; }
.bp-heads{ display:flex; align-items:center; justify-content:space-between; flex:none;
  font-size:12.5px; font-weight:700; color:var(--muted); letter-spacing:.05em;
  text-transform:uppercase; padding:0 4px; }
.bp-metric{ color:#fff; background:rgba(255,106,0,.14); border:1px solid rgba(255,106,0,.3);
  border-radius:999px; padding:4px 14px; letter-spacing:.03em; }
.bp-stage{ position:relative; flex:1; min-height:340px; }
.bp-svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.bp-line{ fill:none; stroke:rgba(255,255,255,.16); stroke-width:2; stroke-linecap:round; }
.bp-line.up{ stroke:rgba(51,194,163,.55); }
.bp-line.down{ stroke:rgba(242,85,90,.5); }
.bp-line.flat{ stroke:rgba(255,255,255,.16); }
.bp-line-hi{ stroke:var(--accent); stroke-width:4; }

.bp-node{ position:absolute; transform:translateY(-50%); display:flex; align-items:baseline; gap:9px;
  background:var(--panel); border:1px solid var(--border); border-radius:9px;
  padding:7px 12px; width:26%; }
.bp-prev{ left:0; justify-content:flex-end; text-align:right; }
.bp-now{ right:0; }
.bp-r{ font-size:12px; font-weight:800; color:var(--muted); font-variant-numeric:tabular-nums; flex:none; }
.bp-n{ font-size:13.5px; font-weight:600; color:#dbe2ea; white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis; flex:1; }
.bp-prev .bp-n{ text-align:right; }
.bp-v{ font-size:12px; font-weight:700; color:#9aa7b6; font-variant-numeric:tabular-nums; flex:none; }
.bp-mv{ font-style:normal; font-size:10.5px; font-weight:800; flex:none; }
.bp-mv.up{ color:var(--teal); }
.bp-mv.down{ color:var(--red); }
.bp-hi{ background:rgba(255,106,0,.14); border-color:rgba(255,106,0,.42); }
.bp-hi .bp-n, .bp-hi .bp-v{ color:#fff; }
.bp-hi .bp-r{ color:var(--accent); }
.bp-node.reveal{ opacity:0; }
.sec-active .bp-node.reveal, .car-item .bp-node.reveal{ animation:bbFade .5s ease forwards; animation-delay:var(--d,0s); }

/* Karşılaştırmalı sıralama sayfası bir lejant ve iki sütun daha taşıyor;
   satırlar biraz sıkışarak 1080'e sığıyor. Yalnızca lejantı olan listede geçerli. */
.rb-legend + .rb-list{ gap:5px; }
.rb-row-cmp{ padding-top:5px; padding-bottom:5px; }
/* (eski min-width:1500px kırılımı: sabit 1920 sahnede her zaman geçerli) */
 .rb-row-cmp{ padding:5px 12px; } 

/* Kart sayısına göre sütun: üç kart tek satırda kalsın */
.insight-grid.ic-3{ grid-template-columns:repeat(3,1fr); }

/* ═══════ SES PAYI (sharebars) ═══════ */
.sb2-wrap{ display:flex; flex-direction:column; flex:1; min-height:0; }
.sb2-legend{ display:flex; align-items:center; gap:20px; font-size:11.5px; color:var(--muted);
  padding:0 12px 6px; flex:none; }
.sb2-legend > span{ display:inline-flex; align-items:center; gap:7px; }
.sb2-k{ width:15px; height:9px; border-radius:2px; flex:none; }
.sb2-k-old{ background:rgba(255,255,255,.28); }
.sb2-k-new{ background:var(--prev); }
.sb2-set{ margin-left:auto; }
.sb2-set b{ color:#e7ecf1; font-weight:700; }
.sb2-setd{ font-style:normal; font-weight:800; color:var(--red); }

.sb2-list{ display:flex; flex-direction:column; flex:1; gap:5px; justify-content:stretch; }
.sb2-row{ display:grid; grid-template-columns:26px 168px 1fr 74px 96px 74px; align-items:center;
  gap:14px; padding:5px 12px; border:1px solid transparent; border-radius:10px; flex:1 1 0; min-height:34px; }
/* (eski min-width:1500px kırılımı: sabit 1920 sahnede her zaman geçerli) */
 .sb2-row{ grid-template-columns:30px 190px 1fr 82px 104px 84px; } 

.sb2-hi{ background:rgba(255,106,0,.10); border-color:rgba(255,106,0,.34); }
.sb2-rank{ font-size:12px; font-weight:800; color:var(--muted); text-align:center;
  background:rgba(255,255,255,.06); border-radius:6px; padding:3px 0; }
.sb2-hi .sb2-rank{ background:var(--accent); color:#fff; }
.sb2-name{ font-size:14px; font-weight:600; color:#dbe2ea; white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis; }
.sb2-hi .sb2-name{ color:#fff; font-weight:700; }

.sb2-bars{ display:flex; flex-direction:column; gap:4px; }
.sb2-t{ display:block; height:11px; background:rgba(255,255,255,.05); border-radius:3px; overflow:hidden; }
.sb2-t i{ display:block; height:100%; width:0; border-radius:3px;
  transition:width .95s cubic-bezier(.16,1,.3,1) .15s; }
.sec-active .sb2-t i, .car-item .sb2-t i, .mo-body .sb2-t i{ width:var(--w); }
.sb2-old{ background:rgba(255,255,255,.28); }
.sb2-new{ background:var(--prev); }
.sb2-hi .sb2-new{ background:linear-gradient(90deg,#e8380d,var(--accent)); }

.sb2-pct{ display:flex; flex-direction:column; align-items:flex-end; line-height:1.25;
  font-variant-numeric:tabular-nums; }
.sb2-pct em{ font-style:normal; font-size:11.5px; color:var(--muted); }
.sb2-pct b{ font-size:15px; font-weight:800; color:#e7ecf1; }
.sb2-hi .sb2-pct b{ color:#fff; }
.sb2-d{ font-size:12px; font-weight:800; text-align:right; font-variant-numeric:tabular-nums; }
.sb2-d.up{ color:var(--teal); }
.sb2-d.down{ color:var(--red); }
.sb2-move{ display:inline-flex; align-items:center; justify-content:center; gap:2px;
  font-size:11.5px; font-weight:800; border-radius:6px; padding:3px 5px;
  font-variant-numeric:tabular-nums; white-space:nowrap; }
.sb2-move i{ font-style:normal; font-size:9px; }
.sb2-move.up{ background:rgba(51,194,163,.16); color:var(--teal); }
.sb2-move.down{ background:rgba(242,85,90,.16); color:var(--red); }
.sb2-move.flat{ background:rgba(255,255,255,.06); color:var(--muted); }

/* TUZAK (tekrar): karusel içindeki her tam bileşenin sarmalayıcısı `flex:none`
   olmalı. `.sb2-wrap` bu listeye eklenmemişti; 1512px altındaki ekranlarda
   `flex:1 + min-height:0` ile içeriğinin altına sıkışıp satırları kırpıyor,
   yazılar çubukların üstüne biniyordu. */
.car-item-scroll .sb2-wrap, .car-item-scroll .bp-wrap{ flex:none; }
.car-item-scroll .sb2-list, .car-item-scroll .sb2-row{ flex:none; }
.car-item-scroll .bp-stage{ flex:none; height:420px; }

/* Satır, iki satırlık yüzde sütununu barındıracak kadar yüksek olmalı */
.sb2-row{ min-height:42px; }
.sb2-pct{ line-height:1.15; }
.sb2-pct em{ font-size:11px; }
.sb2-pct b{ font-size:14.5px; }
/* (eski min-width:1500px kırılımı: sabit 1920 sahnede her zaman geçerli) */
 .sb2-pct b{ font-size:15px; } 


/* 1500px altındaki ekranlarda yüzde sütunu tek satıra iner — sekiz satırda
   ~80px kazandırıyor, bölüm dizüstü ekranında da kaydırmasız kalıyor. */


/* Ses payı sayfası dizüstü ekranlarda da kaydırmasız kalsın diye çerçeve
   öğeleri (not, açıklama, kartlar) sıkışır. Veri alanına dokunulmaz. */


/* Balon detayında dört künye varsa 3+1 yerine 2x2 dizilsin */
.bb-pop-stats-4{ grid-template-columns:repeat(2,1fr); }

/* TUZAK — aynı tuzağın ikinci yüzü, bu sefer opaklıkta.
   `.reveal` animasyonu `forwards` ile bittiğinde son karesi (opacity:1) kalıcı
   olur ve `.bb-gone`un `opacity:0`ını ezer. Üstüne, dosyanın sonundaki
   `.bb-node.reveal` kuralı eşit özgüllükte olduğu için `.bb-gone`un
   `scale(.3)` transform'unu da eziyordu. Sonuç: kademe filtresine basıldığında
   elenen balonlar tam boyda görünür kalıp seçili balonlarla çakışıyordu.
   Çözüm: animasyonu iptal et (!important animasyonu da geçer) ve kuralı sona al. */
.bb-node.bb-gone{
  animation:none !important;
  opacity:0;
  transform:translate(-50%,-50%) scale(.3);
  pointer-events:none;
}

/* Tiraj tablosu karusel sayfasında 1080'e sığmıyordu (+27px, küçük ekranlarda
   daha fazla): satır dolgusu karusel içinde daraltıldı ve tablo kalan yüksekliği
   satırlara paylaştırıyor — sayfa içi kaydırma kalkıyor, tablo kabı dolduruyor. */
.car-item-scroll .pt-table-wrap{ flex:1 1 auto; min-height:0; overflow:hidden; }
.car-item-scroll .pt-table{ height:100%; }
.car-item-scroll .pt-table thead th,
.car-item-scroll .pt-table tbody td{ padding-top:9px; padding-bottom:9px; }

/* Sunum dizüstünde de açılıyor. 1920×1080'de her şey yerinde ama 1680×1050 ve
   1440×900'de birkaç karusel sayfası kaydırma gerektiriyordu. Aşağıdaki iki kural
   yalnızca kısa/dar ekranlarda devreye girer, hedef çözünürlükte hiçbir şey değişmez. */



/* ═══════════════ Z ile büyüteç ═══════════════ */
/* İmleç, kip açıkken her öğenin üstünde büyüteç olmalı; içerikteki cursor:pointer
   ve cursor:zoom-out kuralları bunu ezdiği için !important zorunlu.
   Sol alttaki araç düğmeleri dışarıda bırakıldı — kipten düğmeyle de çıkılabiliyor. */
.zoom-armed, .zoom-armed *{
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><g fill='none' stroke='%23000' stroke-opacity='.5' stroke-width='4.5' stroke-linecap='round'><circle cx='13' cy='13' r='8'/><path d='M19 19l7.5 7.5'/></g><g fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round'><circle cx='13' cy='13' r='8'/><path d='M19 19l7.5 7.5'/></g><path d='M13 9.4v7.2M9.4 13h7.2' stroke='%23ff6a00' stroke-width='2.6' stroke-linecap='round'/></svg>") 13 13, zoom-in !important;
}
.zoom-on, .zoom-on *{
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'><g fill='none' stroke='%23000' stroke-opacity='.5' stroke-width='4.5' stroke-linecap='round'><circle cx='13' cy='13' r='8'/><path d='M19 19l7.5 7.5'/></g><g fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round'><circle cx='13' cy='13' r='8'/><path d='M19 19l7.5 7.5'/></g><circle cx='13' cy='13' r='1.7' fill='%23ff6a00' stroke='none'/></svg>") 13 13, zoom-in !important;
}
.zoom-armed #tool-rail, .zoom-armed #tool-rail *{ cursor:pointer !important; }

/* Büyütme kip boyunca kaydırmayı kilitler: ölçeklenen bölüm #page'in kaydırma
   alanını büyütüp sahneyi kaydırmasın. */
#page.zoom-lock{ overflow:hidden; }

#zoom-hint{
  position:fixed; left:50%; bottom:24px; transform:translateX(-50%); z-index:120;
  background:rgba(19,26,38,.94); border:1px solid rgba(255,106,0,.5); color:#fff;
  font-size:12.5px; font-weight:700; letter-spacing:.02em; white-space:nowrap;
  padding:9px 18px; border-radius:999px; box-shadow:0 12px 34px rgba(0,0,0,.5);
  pointer-events:none;
}
#zoom-hint[hidden]{ display:none; }
