/* ElsharqNews Classic - minimal custom CSS (fast, GPU-only animations) */
html{-webkit-text-size-adjust:100%}
body{font-family:'IBM Plex Sans Arabic',sans-serif;background:#F2F4F7}
img{max-width:100%}
main,aside{min-width:0}
.classic-title{border-right:4px solid #C8102E;padding-right:12px;font-weight:800;color:#0F2A4A}
.news-card{background:#fff;border:1px solid #e5e7eb;border-radius:8px;overflow:hidden}
.news-card:hover{box-shadow:0 4px 14px rgba(15,42,74,.12)}
.news-card img{background:#e5e7eb}
.ticker-wrap{overflow:hidden;white-space:nowrap;max-width:100%;min-width:0}
.ticker-move{display:inline-block;animation:ticker 30s linear infinite;will-change:transform}
@keyframes ticker{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
@media(max-width:768px){.ticker-move{animation-duration:18s}}
a{transition:color .15s}
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}
.no-scrollbar::-webkit-scrollbar{display:none}

/* ===== Brand header with animated globe ===== */
.brand-head{position:relative;overflow:hidden;isolation:isolate;
background:linear-gradient(135deg,#0F2A4A 0%,#16395f 55%,#0a1e36 100%)}
.brand-head::before{content:'';position:absolute;inset-inline:0;top:0;height:3px;
background:linear-gradient(to left,#C8102E,#e0445e,#C8102E);z-index:3}
.brand-globe{position:absolute;z-index:0;pointer-events:none;user-select:none;
width:clamp(240px,42vw,440px);height:clamp(240px,42vw,440px);
inset-inline-end:clamp(-140px,-8vw,-40px);top:50%;margin-top:calc(clamp(240px,42vw,440px)/-2);
opacity:.16;animation:globe-float 9s ease-in-out infinite alternate;will-change:transform}
@keyframes globe-float{from{transform:translateY(-10px)}to{transform:translateY(12px)}}
.brand-orbit{position:absolute;z-index:0;pointer-events:none;border:1px dashed rgba(255,255,255,.28);
border-radius:9999px;width:clamp(300px,52vw,560px);height:clamp(300px,52vw,560px);
inset-inline-end:clamp(-170px,-10vw,-60px);top:50%;margin-top:calc(clamp(300px,52vw,560px)/-2);
opacity:.5;animation:orbit-spin 26s linear infinite;will-change:transform}
.brand-orbit i{position:absolute;top:-4px;right:50%;width:8px;height:8px;border-radius:9999px;
background:#e0445e;box-shadow:0 0 10px 2px rgba(224,68,94,.8)}
@keyframes orbit-spin{to{transform:rotate(360deg)}}
.brand-glow{position:absolute;z-index:0;pointer-events:none;width:60vw;height:60vw;max-width:640px;max-height:640px;
inset-inline-start:-20vw;top:-30vw;border-radius:9999px;opacity:.5;
background:radial-gradient(circle,rgba(59,130,246,.22),transparent 65%)}
.logo-badge{background:#fff;border-radius:16px;padding:8px;display:inline-flex;flex-shrink:0;
box-shadow:0 6px 18px rgba(0,0,0,.35);animation:logo-float 6s ease-in-out infinite;will-change:transform}
@keyframes logo-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.person-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);
backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:10px;
padding:.55rem .8rem;min-width:0;transition:border-color .2s,background .2s}
.person-card:hover{border-color:rgba(224,68,94,.6);background:rgba(255,255,255,.12)}
.brand-search input{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);color:#fff}
.brand-search input::placeholder{color:rgba(255,255,255,.6)}
.brand-search input:focus{outline:none;border-color:#e0445e;box-shadow:0 0 0 3px rgba(200,16,46,.35);background:rgba(255,255,255,.14)}
.chip{display:inline-block;font-size:11px;font-weight:700;color:#dbe4f0;background:rgba(255,255,255,.1);
border:1px solid rgba(255,255,255,.14);border-radius:9999px;padding:.15rem .7rem;white-space:nowrap}
.chip:hover{color:#fff;border-color:rgba(224,68,94,.7)}

/* Entrance */
.anim-rise{opacity:0;animation:rise .7s cubic-bezier(.2,.7,.3,1) forwards;will-change:transform,opacity}
.anim-rise.d1{animation-delay:.12s}.anim-rise.d2{animation-delay:.24s}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* Article body typography (responsive) */
.article-content{color:#1f2937;font-size:.95rem;line-height:1.9;overflow-wrap:break-word}
.article-content p{margin:0 0 1rem}
.article-content h2{font-size:1.25rem;font-weight:800;color:#0F2A4A;margin:1.4rem 0 .7rem}
.article-content h3{font-size:1.1rem;font-weight:700;color:#0F2A4A;margin:1.2rem 0 .6rem}
.article-content img,.article-content video,.article-content iframe{max-width:100%;height:auto;border-radius:8px;margin:.8rem auto;display:block}
.article-content ul,.article-content ol{margin:0 1.2rem 1rem 0;padding:0}
.article-content li{margin-bottom:.4rem}
.article-content blockquote{border-right:3px solid #C8102E;background:#f8fafc;padding:.7rem 1rem;margin:0 0 1rem;border-radius:6px;color:#334155}
.article-content a{color:#C8102E;font-weight:700}
@media(min-width:640px){.article-content{font-size:1rem}}
@media(min-width:1024px){.article-content{font-size:1.05rem}.article-content h2{font-size:1.4rem}}

/* Diagonal split for صح وغلط slider (line from top-right to bottom-left) */
.fc-clip-false{clip-path:polygon(0 0,100% 0,0 100%)}
.fc-clip-true{clip-path:polygon(100% 0,100% 100%,0 100%)}

/* Small screens */
@media(max-width:640px){
.brand-globe{opacity:.12}
.brand-orbit{opacity:.35}
.classic-title{font-size:1rem}
}
/* More-categories smooth expand/collapse */
#more-cats-menu{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .38s cubic-bezier(.2,.7,.3,1),opacity .3s ease}
#more-cats-menu.open{grid-template-rows:1fr;opacity:1}
#more-cats-menu>div{overflow:hidden;min-height:0}
/* Continuously animated 3D SVGs (nav special buttons) */
@keyframes svg-twinkle{0%,100%{transform:scale(1) rotate(0deg)}50%{transform:scale(1.28) rotate(14deg)}}
.anim-twinkle{animation:svg-twinkle 1.8s ease-in-out infinite;transform-origin:center;will-change:transform}
@keyframes svg-write{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(12deg) translateY(-1.5px)}}
.anim-write{animation:svg-write 2.2s ease-in-out infinite;transform-origin:bottom center;will-change:transform}
@media(prefers-reduced-motion:reduce){
.ticker-move,.brand-globe,.brand-orbit,.logo-badge,.anim-rise{animation:none!important}
.anim-rise{opacity:1}
#more-cats-menu{transition:none}
.anim-twinkle,.anim-write{animation:none!important}
}