/* ============================================================================
   SAMSUN HABER SERVİSİ — v7 EK BİLEŞENLER
   Yatay manşet · Numaralı manşet (temiz) · Geniş günün haberleri ·
   Sidebar son dakika/süperlig/anket · Video grid
   ========================================================================== */

/* ==================== YATAY MANŞET ==================== */
.ymanset{position:relative;height:250px;border-radius:var(--radius-lg);overflow:hidden;background:var(--navy);margin-bottom:22px;box-shadow:var(--shadow-sm)}
.ymanset__slide{position:absolute;inset:0;display:flex;opacity:0;visibility:hidden;transition:opacity .5s}
.ymanset__slide.on{opacity:1;visibility:visible}
.ymanset__text{flex:0 0 42%;max-width:42%;padding:30px 28px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(135deg,var(--navy),var(--navy-2));color:#fff}
.ymanset__cat{align-self:flex-start;background:var(--brand);color:#fff;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;padding:5px 12px;border-radius:4px;margin-bottom:12px}
.ymanset__title{color:#fff;font-size:24px;font-weight:900;line-height:1.2;letter-spacing:-.3px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ymanset__spot{color:rgba(255,255,255,.8);font-size:13.5px;margin-top:10px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ymanset__date{color:rgba(255,255,255,.65);font-size:12px;margin-top:12px}
.ymanset__img{flex:1;position:relative;overflow:hidden}
.ymanset__img::before{content:"";position:absolute;left:0;top:0;bottom:0;width:60px;background:linear-gradient(90deg,var(--navy),transparent);z-index:2}
.ymanset__img img{width:100%;height:100%;object-fit:cover}
.ymanset__nav{position:absolute;right:16px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:6px;z-index:3}
.ymanset__num{width:30px;height:30px;border-radius:5px;background:rgba(255,255,255,.2);color:#fff;font-size:13px;font-weight:800;font-variant-numeric:tabular-nums;transition:.15s;backdrop-filter:blur(4px)}
.ymanset__num.on,.ymanset__num:hover{background:var(--brand)}

/* ==================== NUMARALI MANŞET (temiz — ok/dots yok) ==================== */
.nmanset{margin-bottom:22px}
.nmanset__stage{position:relative;aspect-ratio:16/9;border-radius:var(--radius-lg);overflow:hidden;background:#1a1a1a;box-shadow:var(--shadow-sm)}
/* Gerçek foto-carousel: track yatay kayar (kararma/atlama yok) */
.nmanset__track{display:flex;height:100%;transition:transform .55s cubic-bezier(.4,0,.2,1);will-change:transform}
.nmanset__slide{position:relative;flex:0 0 100%;width:100%;height:100%;display:block}
.nmanset__slide img{width:100%;height:100%;object-fit:cover}
.nmanset__shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(9,20,35,.92) 0%,rgba(9,20,35,.35) 45%,transparent 75%)}
.nmanset__cap{position:absolute;left:0;right:0;bottom:0;padding:34px 30px 26px;z-index:2}
.nmanset__cat{display:inline-block;background:var(--brand);color:#fff;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;padding:5px 12px;border-radius:4px;margin-bottom:12px}
.nmanset__title{color:#fff;font-size:30px;font-weight:900;line-height:1.18;letter-spacing:-.4px;text-shadow:0 2px 14px rgba(0,0,0,.5);max-width:85%}
.nmanset__progress{position:absolute;top:0;left:0;right:0;height:3px;background:rgba(255,255,255,.2);z-index:3}
.nmanset__progress span{display:block;height:100%;width:0;background:var(--brand)}
.nmanset__nums{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:2px;background:var(--line);border-radius:0 0 var(--radius-lg) var(--radius-lg);overflow:hidden}
.nmanset__num{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--surface);text-align:left;transition:.15s;border-top:3px solid transparent}
.nmanset__num .n{font-size:19px;font-weight:900;color:var(--brand);font-variant-numeric:tabular-nums;flex-shrink:0}
.nmanset__num .t{font-size:12.5px;font-weight:700;color:var(--ink);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nmanset__num.on,.nmanset__num:hover{background:var(--surface-2);border-top-color:var(--brand)}
.nmanset__num.on .t{color:var(--brand)}

/* ==================== GÜNÜN HABERLERİ (geniş 4'lü) ==================== */
.gh4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.gh4-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;transition:.16s;height:100%}
.gh4-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.gh4-card__img{position:relative;aspect-ratio:16/10;overflow:hidden}
.gh4-card__img img{width:100%;height:100%;object-fit:cover;transition:.4s}
.gh4-card:hover .gh4-card__img img{transform:scale(1.05)}
.gh4-card__cat{position:absolute;left:0;bottom:0;background:var(--brand);color:#fff;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;padding:4px 10px}
.gh4-card__b{padding:12px 13px 14px;display:flex;flex-direction:column;gap:8px;flex:1}
.gh4-card__t{font-size:15px;font-weight:800;line-height:1.3;color:var(--ink);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.gh4-card:hover .gh4-card__t{color:var(--brand)}
.gh4-card__d{font-size:11.5px;color:var(--muted);margin-top:auto}

/* ==================== SIDEBAR: son dakika + süperlig + anket ==================== */
.live-dot{width:8px;height:8px;border-radius:50%;background:#fff;display:inline-block;animation:pulse 1.2s infinite;margin-right:2px}
.sd2-item{display:flex;gap:10px;padding:11px 0;border-bottom:1px dashed var(--line);align-items:flex-start}
.sd2-item:last-child{border-bottom:none}
.sd2-item__t{color:var(--brand);font-weight:800;font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap;padding-top:1px}
.sd2-item__x{font-size:13px;font-weight:600;line-height:1.35;color:var(--ink)}
.sd2-item:hover .sd2-item__x{color:var(--brand)}
.puan-mini{width:100%;border-collapse:collapse;font-size:12.5px}
.puan-mini th{font-size:10.5px;color:var(--muted);text-transform:uppercase;padding:6px 4px;font-weight:700;text-align:center}
.puan-mini td{padding:7px 4px;border-top:1px solid var(--line);text-align:center;color:var(--text)}
.puan-mini td:nth-child(2){display:flex;align-items:center;gap:7px;font-weight:600;color:var(--ink);text-align:left}
.puan-mini td img{width:18px;height:18px;object-fit:contain}
.puan-mini tr.ss{background:rgba(224,30,38,.08)}
.puan-mini tr.ss td{color:var(--brand);font-weight:800}
.anket-soru{font-size:14.5px;font-weight:700;color:var(--ink);margin-bottom:12px;line-height:1.4}
.anket-secenek{display:flex;align-items:center;gap:9px;padding:9px 12px;border:1px solid var(--line-2);border-radius:6px;cursor:pointer;margin-bottom:7px;font-size:13.5px;transition:.15s}
.anket-secenek:hover{border-color:var(--brand);background:var(--surface-2)}

/* ==================== VİDEO grid ==================== */
.vid-grid{display:grid;grid-template-columns:2fr 1fr 1fr;grid-auto-rows:1fr;gap:14px}
.vid-card{position:relative;border-radius:8px;overflow:hidden;display:block;min-height:150px}
.vid-card--big{grid-row:span 2}
.vid-card__img{position:absolute;inset:0}
.vid-card__img img{width:100%;height:100%;object-fit:cover;transition:.4s}
.vid-card:hover .vid-card__img img{transform:scale(1.05)}
.vid-card::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.85),transparent 55%)}
.vid-card__play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;background:rgba(224,30,38,.92);display:flex;align-items:center;justify-content:center;z-index:2}
.vid-card--big .vid-card__play{width:64px;height:64px}
.vid-card__play svg{width:20px;height:20px}
.vid-card__t{position:absolute;left:0;right:0;bottom:0;padding:14px;color:#fff;font-size:14px;font-weight:800;line-height:1.3;z-index:2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vid-card--big .vid-card__t{font-size:19px}
.kat-lead__cat{display:inline-block;background:var(--brand);color:#fff;font-size:11px;font-weight:800;text-transform:uppercase;padding:4px 10px;border-radius:3px;margin-bottom:8px}

/* ==================== HEADER: Haber Gönder + belirgin üst bar ==================== */
.mh-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.mh-send{display:inline-flex;align-items:center;gap:8px;height:50px;padding:0 18px;border:1.5px solid var(--navy);color:var(--navy);font-weight:800;font-size:13px;border-radius:8px;transition:.15s;white-space:nowrap}
.mh-send:hover{background:var(--navy);color:#fff}
.mh-send svg{width:17px;height:17px}
html[data-theme="dark"] .mh-send{border-color:var(--line-2);color:var(--text)}

/* üst bilgi barını daha belirgin yap */
.topbar{background:linear-gradient(var(--surface),var(--surface-2));border-bottom:2px solid var(--line-2)}
.topbar__in{height:46px}
.tb-date{font-weight:700;color:var(--ink)}
.tb-weather{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:4px 13px 4px 9px;border-left:1px solid var(--line)}
.tb-market .mk{background:var(--surface);border:1px solid var(--line);border-radius:7px;padding:5px 11px}
.tb-market .mk__v{font-size:13px}
.tb-follow{color:var(--ink);font-weight:800}

@media(max-width:980px){
    .mh-send span{display:none}
    .mh-send{height:44px;padding:0 12px}
}

/* ==================== PAYLAŞIM (marka ikonlu) ==================== */
.paylas-kutu{margin:26px 0;padding:18px 20px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-lg)}
.paylas-kutu__t{font-size:12.5px;font-weight:800;color:var(--ink);text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px}
.share-btn-emoji svg{width:17px;height:17px}
.share-btn-emoji--twitter{background:#000}
.share-btn-emoji--telegram{background:#2aabee}

/* ==================== KATEGORİ SAYFASI ==================== */
.kat-hero{background:var(--navy);color:#fff;padding:26px 0}
.kat-hero__in{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.kat-hero__dot{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.kat-hero h1{color:#fff;font-size:30px;margin:0}
.kat-hero__desc{color:rgba(255,255,255,.75);font-size:14px;margin-top:4px;max-width:640px}
.kat-hero__count{margin-left:auto;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:8px 16px;font-weight:800}
.kat-layout{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:start;padding:24px 0 40px}
.kat-layout__side{display:flex;flex-direction:column;gap:20px;position:sticky;top:12px}
@media(max-width:980px){.kat-layout{grid-template-columns:1fr}.kat-layout__side{position:static}}

/* ==================== YAN DİK REKLAM (skyscraper) ==================== */
/* Sabit yan reklam rayları — site ortalı (1240px container) gutter'a hizalı,
   header/footer'ı örtmez: header altından başlar, footer görününce gizlenir (JS). */
/* Box formatı: içerik 1180px, yan raylar gutter'a hizalı (1180/2=590), 140px genişlik */
.yan-reklam{position:fixed;top:200px;z-index:40;display:none;max-height:calc(100vh - 230px);overflow:hidden;transition:opacity .25s}
.yan-reklam--sol{left:max(6px, calc(50% - 590px - 148px))}
.yan-reklam--sag{right:max(6px, calc(50% - 590px - 148px))}
.yan-reklam .reklam-alani{margin-bottom:12px}
.yan-reklam img{max-width:140px;width:140px;border-radius:8px;box-shadow:var(--shadow-sm);display:block}
.yan-reklam.gizle{opacity:0;pointer-events:none}
/* Gutter'a sığan çözünürlükte göster (1180 + 2×148 ≈ 1476) */
@media(min-width:1480px){.yan-reklam{display:block}}
.ad-strip .reklam-alani{margin:6px 0}
.ad-strip img{max-width:100%;border-radius:8px}

/* ==================== KATEGORİ MOZAİK (masonry) ==================== */
.kat-mozaik{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr);gap:12px;aspect-ratio:16/7}
.kmz{position:relative;border-radius:10px;overflow:hidden;display:block}
.kmz--big{grid-column:span 2;grid-row:span 2}
.kmz img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:.4s}
.kmz:hover img{transform:scale(1.05)}
.kmz__sh{position:absolute;inset:0;background:linear-gradient(to top,rgba(9,20,35,.92),transparent 62%);z-index:1}
.kmz__t{position:absolute;left:0;right:0;bottom:0;padding:12px;color:#fff;font-weight:800;font-size:13px;line-height:1.3;z-index:2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.kmz--big .kmz__t{font-size:21px;padding:18px;-webkit-line-clamp:3}
.kmz__ext{position:absolute;top:8px;left:8px;background:rgba(9,20,35,.75);color:#fff;font-size:9px;font-weight:700;padding:3px 7px;border-radius:3px;z-index:2}

/* ==================== KATEGORİ SATIR (eşit kartlar) ==================== */
.kat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.krow-card{background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow:hidden;display:block;transition:.16s}
.krow-card:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.krow-card__img{position:relative;aspect-ratio:16/10;overflow:hidden}
.krow-card__img img{width:100%;height:100%;object-fit:cover;transition:.4s}
.krow-card:hover .krow-card__img img{transform:scale(1.05)}
.krow-card__cat{position:absolute;left:0;bottom:0;color:#fff;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;padding:4px 9px}
.krow-card__t{padding:12px 13px 15px;font-size:14.5px;font-weight:800;line-height:1.3;color:var(--ink);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.krow-card:hover .krow-card__t{color:var(--brand)}

@media(max-width:980px){
    .kat-mozaik{grid-template-columns:1fr 1fr;aspect-ratio:auto;grid-auto-rows:130px}
    .kmz--big{grid-column:span 2;grid-row:span 2}
    .kat-row{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
    .kat-row{grid-template-columns:1fr 1fr}
    .kat-mozaik{grid-auto-rows:110px}
    .kmz--big .kmz__t{font-size:16px}
}

/* ==================== responsive ==================== */
@media(max-width:980px){
    .gh4{grid-template-columns:repeat(2,1fr)}
    .vid-grid{grid-template-columns:1fr 1fr}.vid-card--big{grid-row:auto;grid-column:span 2}
    .nmanset__nums{grid-template-columns:1fr 1fr}
    .ymanset{height:auto}
    .ymanset__slide{position:relative;flex-direction:column;opacity:1;visibility:visible;display:none}
    .ymanset__slide.on{display:flex}
    .ymanset__text{flex:none;max-width:100%}.ymanset__title{font-size:19px}
    .ymanset__img{height:180px}.ymanset__img::before{display:none}
}
@media(max-width:560px){
    .gh4{grid-template-columns:1fr 1fr}
    .vid-grid{grid-template-columns:1fr}.vid-card--big{grid-column:auto}
    .nmanset__nums{grid-template-columns:1fr}.nmanset__title{font-size:19px}
}

/* ==================== MOBİL SAĞLAMLAŞTIRMA ==================== */
@media(max-width:768px){
    /* Masthead sadeleşsin — logo + arama ikonu + kompakt aksiyonlar */
    .mh-in{gap:10px;padding:12px 0;flex-wrap:nowrap}
    .mh-logo .logo-word{font-size:23px;letter-spacing:-.5px}
    .mh-logo .logo-sub{font-size:7.5px;letter-spacing:1.2px}
    .masthead__spacer,.mh-spacer{flex:1}
    .mh-actions{gap:7px;margin-left:auto}
    .mh-live__t{display:none}            /* Canlı Yayın sadece ikon */
    .mh-live{padding:0;width:44px;justify-content:center;gap:0}
    .mh-live__ic{margin:0}
    .mh-send{padding:0 11px}
    .tb-follow{display:none}
    .topbar__date{font-size:11px}
    .topbar__in{gap:8px}
    /* numaralı manşet çok uzamasın */
    .nmanset__nums{max-height:270px;overflow-y:auto}
    /* mozaik mobilde daha derli toplu */
    .kat-mozaik{grid-template-columns:1fr 1fr;grid-auto-rows:120px}
    .kmz--big{grid-column:span 2;grid-row:span 1}
    .kmz--big .kmz__t{font-size:15px}
    /* kategori/sayfa başlıkları */
    .kat-hero h1{font-size:22px}.kat-hero__count{margin-left:0}
    .sayfa-baslik-alani{padding:24px 0}.sayfa-baslik-alani h1{font-size:24px}
    .haber-detay,.haber-icerik-alan{padding:16px}
    .haber-icerik{font-size:17px}
    /* alt bar ile çakışma */
    body{padding-bottom:60px}
}
@media(max-width:420px){
    .mh-send span{display:none}
    .mh-send{width:44px;padding:0;justify-content:center}
    .mh-logo .logo-word{font-size:20px}
    .gh4{grid-template-columns:1fr}
    .kat-mozaik{grid-template-columns:1fr;grid-auto-rows:150px}.kmz--big{grid-column:auto}
    .haber-baslik{font-size:22px}
}