/* ==========================================================================
   زی‌لنز | Zlens — News theme stylesheet
   Hand-crafted, production CSS (RTL, responsive, fast)
   ========================================================================== */

/* ---------- Fonts ---------- */
@font-face{font-family:Vazirmatn;src:url(../fonts/Vazirmatn-Light.woff2) format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:Vazirmatn;src:url(../fonts/Vazirmatn-Regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Vazirmatn;src:url(../fonts/Vazirmatn-Medium.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Vazirmatn;src:url(../fonts/Vazirmatn-SemiBold.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Vazirmatn;src:url(../fonts/Vazirmatn-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Vazirmatn;src:url(../fonts/Vazirmatn-ExtraBold.woff2) format("woff2");font-weight:800;font-style:normal;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  --brand-50:#fff1f2;--brand-100:#ffe1e4;--brand-300:#ffa0ad;--brand-400:#fb6a7e;
  --brand-500:#ef3a55;--brand-600:#d6173a;--brand-700:#b40e30;
  --ink:#16181d;--ink-soft:#3a3f4b;--ink-mute:#6b7280;
  --paper:#fbfbfc;--line:#ececef;--white:#fff;
  --max:1280px;
  --shadow-card:0 1px 2px rgba(16,18,29,.04),0 8px 24px -12px rgba(16,18,29,.12);
  --shadow-pop:0 12px 40px -12px rgba(16,18,29,.22);
  --radius:.75rem;--radius-lg:1rem;--radius-xl:1.25rem;
  --header-h:6.25rem;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:Vazirmatn,Tahoma,sans-serif;font-size:14px;line-height:1.7;
  color:var(--ink);background:#fff;letter-spacing:-.01em;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;background:none;border:none;color:inherit}
input,textarea{font:inherit}
ul{list-style:none}
::selection{background:var(--brand-600);color:#fff}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#d8d8de;border-radius:999px;border:2px solid #fff}
::-webkit-scrollbar-thumb:hover{background:#c2c2ca}
img.lazy-fade{opacity:0;transition:opacity .5s}
img.lazy-fade.is-loaded{opacity:1}

/* ---------- Layout ---------- */
.container{max-width:var(--max);margin:0 auto;padding:0 1rem;width:100%}
@media(min-width:640px){.container{padding:0 1.5rem}}
.section{padding:2rem 0}
.band{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper)}
.band--dark{background:var(--ink);color:#fff;border-color:rgba(255,255,255,.08)}

.grid{display:grid;gap:1.5rem}
.cols-12{display:grid;grid-template-columns:repeat(12,1fr);gap:1.5rem}
.span-8{grid-column:span 12}
.span-7{grid-column:span 12}
.span-5{grid-column:span 12}
.span-4{grid-column:span 12}
@media(min-width:1024px){
  .span-8{grid-column:span 8}.span-7{grid-column:span 7}
  .span-5{grid-column:span 5}.span-4{grid-column:span 4}
}
.grid-4{grid-template-columns:1fr}
.grid-3{grid-template-columns:1fr}
.grid-2{grid-template-columns:1fr}
@media(min-width:640px){.grid-4{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.grid-4{grid-template-columns:repeat(4,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}}
.gap-y-lg{row-gap:1.75rem}

/* ---------- Helpers ---------- */
.card{border:1px solid var(--line);background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-card)}
.muted{color:var(--ink-mute)}
.sticky-side{position:sticky;top:calc(var(--header-h) + 1rem)}
.clamp-1{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* ---------- Section header ---------- */
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:1.25rem}
.sec-head__title{display:flex;align-items:center;gap:.625rem;font-size:1.0625rem;font-weight:800}
.sec-head__bar{width:.375rem;height:1.25rem;border-radius:999px;background:var(--brand-600)}
.sec-head__more{display:inline-flex;align-items:center;gap:.125rem;font-size:.75rem;font-weight:600;color:var(--ink-mute);transition:color .2s}
.sec-head__more:hover{color:var(--brand-600)}
.sec-head__more svg{width:1rem;height:1rem}

/* ---------- Chips ---------- */
.chip{display:inline-flex;align-items:center;gap:.375rem;border-radius:.375rem;padding:.25rem .625rem;font-size:.6875rem;font-weight:700;color:#fff;background:var(--brand-600)}
.dot{display:inline-flex;align-items:center;gap:.375rem;font-size:.6875rem;font-weight:700;color:var(--brand-600)}
.dot::before{content:"";width:.375rem;height:.375rem;border-radius:999px;background:currentColor}
.tag{display:inline-block;border-radius:999px;background:var(--paper);padding:.375rem .75rem;font-size:.6875rem;font-weight:500;color:var(--ink-soft);transition:color .2s}
.tag:hover{color:var(--brand-600)}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.375rem;border-radius:var(--radius);padding:.625rem 1.25rem;font-size:.8125rem;font-weight:700;background:var(--brand-600);color:#fff;transition:background .2s}
.btn:hover{background:var(--brand-700)}
.btn--ink{background:var(--ink)}.btn--ink:hover{background:var(--ink-soft)}
.btn--block{width:100%}
.icon-btn{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:.625rem;border:1px solid var(--line);color:var(--ink);transition:.2s}
.icon-btn:hover{border-color:rgba(22,24,29,.2)}

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header{position:sticky;top:0;z-index:50}
.topbar{background:var(--ink);color:rgba(255,255,255,.8);font-size:.6875rem;display:none}
@media(min-width:1024px){.topbar{display:block}}
.topbar__in{display:flex;align-items:center;justify-content:space-between;height:2.25rem}
.topbar__left{display:flex;align-items:center;gap:.5rem}
.topbar__left svg{width:.875rem;height:.875rem}
.topbar .sep{width:1px;height:.75rem;background:rgba(255,255,255,.2);margin:0 .5rem}
.topbar nav{display:flex;gap:1rem}
.topbar nav a:hover{color:#fff}

.masthead{position:relative;border-bottom:1px solid var(--line);background:rgba(255,255,255,.9);backdrop-filter:blur(8px);transition:box-shadow .3s}
.site-header.is-scrolled .masthead{box-shadow:var(--shadow-card)}
.masthead__in{display:flex;align-items:center;gap:.75rem;height:4rem}

/* brand */
.brand{display:inline-flex;align-items:center;gap:.5rem;flex-shrink:0;user-select:none}
.brand__mark{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:.75rem;background:var(--brand-600);color:#fff;box-shadow:var(--shadow-card)}
.brand__mark svg{width:1.25rem;height:1.25rem}
.brand__name{font-size:1.25rem;font-weight:800;line-height:1;letter-spacing:-.02em}
.brand__tag{font-size:10px;font-weight:500;color:var(--ink-mute);margin-top:2px}
.brand--light .brand__name{color:#fff}
.brand--light .brand__tag{color:rgba(255,255,255,.6)}

/* desktop nav */
.mainnav{display:none;flex:1;align-items:center;margin-right:.5rem}
@media(min-width:1024px){.mainnav{display:flex}}
.mainnav>ul{display:flex;align-items:center;gap:.125rem}
.nav-item{position:static}
.nav-link{display:block;border-radius:.625rem;padding:.5rem .75rem;font-size:.8125rem;font-weight:600;color:var(--ink-soft);transition:color .2s}
.nav-item:hover .nav-link,.nav-link:hover{color:var(--brand-600)}

/* mega menu */
.mega{position:absolute;left:0;right:0;top:100%;z-index:40;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s}
.nav-item:hover .mega{opacity:1;visibility:visible;transform:none}
.mega__inner{margin-top:1px;border:1px solid var(--line);background:#fff;border-radius:0 0 1rem 1rem;box-shadow:var(--shadow-pop);overflow:hidden;display:grid;grid-template-columns:1fr 2fr}
.mega__aside{border-left:1px solid var(--line);background:var(--paper);padding:1.25rem}
.mega__badge{display:inline-flex;align-items:center;gap:.5rem;border-radius:.625rem;padding:.25rem .625rem;font-size:.75rem;font-weight:700;color:#fff;margin-bottom:.75rem}
.mega__desc{font-size:.75rem;line-height:1.6;color:var(--ink-mute);margin-bottom:1rem}
.mega__subs a{display:flex;align-items:center;justify-content:space-between;border-radius:.375rem;padding:.375rem .5rem;font-size:.8125rem;color:var(--ink-soft)}
.mega__subs a:hover{background:#fff;color:var(--brand-600)}
.mega__subs svg{width:1rem;height:1rem;opacity:.4}
.mega__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding:1.25rem}
.mega__card .thumb{aspect-ratio:16/10;border-radius:.5rem;overflow:hidden;background:var(--line);margin-bottom:.5rem}
.mega__card h4{font-size:.8125rem;font-weight:600;line-height:1.5}
.mega__card:hover h4{color:var(--brand-600)}

/* actions */
.masthead__actions{display:flex;flex:1;align-items:center;justify-content:flex-end;gap:.5rem}
@media(min-width:1024px){.masthead__actions{flex:none}}
.search-trigger{display:flex;align-items:center;gap:.5rem;border:1px solid var(--line);border-radius:.625rem;padding:.5rem .75rem;font-size:.75rem;color:var(--ink-mute);transition:.2s}
.search-trigger:hover{border-color:rgba(22,24,29,.2);color:var(--ink)}
.search-trigger svg{width:1rem;height:1rem}
.search-trigger .kbd{border:1px solid var(--line);border-radius:.25rem;padding:.06rem .35rem;font-size:.625rem}
.search-trigger .label,.search-trigger .kbd{display:none}
@media(min-width:640px){.search-trigger .label{display:inline}}
@media(min-width:1024px){.search-trigger .kbd{display:inline}}
.header-cta{display:none}
@media(min-width:640px){.header-cta{display:inline-flex}}
.menu-toggle{display:grid}
@media(min-width:1024px){.menu-toggle{display:none}}

/* ---------- Search overlay ---------- */
.overlay{position:fixed;inset:0;z-index:60;background:rgba(22,24,29,.4);backdrop-filter:blur(4px);display:none}
.overlay.is-open{display:block;animation:fade .2s ease}
.overlay__panel{max-width:42rem;margin:6rem auto 0;background:#fff;border-radius:1rem;box-shadow:var(--shadow-pop);overflow:hidden}
.overlay__form{display:flex;align-items:center;gap:.75rem;border-bottom:1px solid var(--line);padding:0 1.25rem}
.overlay__form svg{width:1.25rem;height:1.25rem;color:var(--ink-mute)}
.overlay__form input{height:4rem;flex:1;border:none;outline:none;background:none;font-size:1rem}
.overlay__close{display:grid;place-items:center;width:2rem;height:2rem;border-radius:.375rem;color:var(--ink-mute)}
.overlay__close:hover{background:var(--paper)}
.overlay__body{padding:1.25rem}
.overlay__body p{font-size:.6875rem;font-weight:700;color:var(--ink-mute);margin-bottom:.75rem}
.overlay__sug{display:flex;flex-wrap:wrap;gap:.5rem}
.overlay__sug a{border:1px solid var(--line);border-radius:999px;padding:.375rem .75rem;font-size:.75rem;color:var(--ink-soft)}
.overlay__sug a:hover{border-color:var(--brand-300);color:var(--brand-600)}

/* ---------- Mobile drawer ---------- */
.drawer{position:fixed;inset:0;z-index:60;display:none}
.drawer.is-open{display:block}
.drawer__scrim{position:absolute;inset:0;background:rgba(22,24,29,.4);backdrop-filter:blur(4px)}
.drawer__panel{position:absolute;top:0;bottom:0;right:0;width:20rem;max-width:85%;background:#fff;box-shadow:var(--shadow-pop);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .25s}
.drawer.is-open .drawer__panel{transform:none}
.drawer__head{display:flex;align-items:center;justify-content:space-between;height:4rem;border-bottom:1px solid var(--line);padding:0 1rem}
.drawer__nav{flex:1;overflow-y:auto;padding:.75rem}
.drawer__nav a{display:flex;align-items:center;gap:.75rem;border-radius:.625rem;padding:.625rem .75rem;font-size:.8125rem;font-weight:600;color:var(--ink-soft)}
.drawer__nav a:hover{background:var(--paper)}
.drawer__ico{display:grid;place-items:center;width:2rem;height:2rem;border-radius:.625rem;color:#fff}
.drawer__foot{border-top:1px solid var(--line);padding:1rem}

/* ==========================================================================
   TICKER
   ========================================================================== */
.ticker{border-bottom:1px solid var(--line);background:var(--paper)}
.ticker__in{display:flex;align-items:center;gap:.75rem;height:2.75rem}
.ticker__label{display:flex;flex-shrink:0;align-items:center;gap:.375rem;border-radius:.375rem;background:var(--brand-600);padding:.25rem .625rem;font-size:.6875rem;font-weight:700;color:#fff;z-index:1}
.ticker__label svg{width:.875rem;height:.875rem}
.ticker__mask{position:relative;flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(to left,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(to left,transparent,#000 6%,#000 94%,transparent)}
.ticker__track{display:flex;width:max-content;align-items:center;gap:2rem;animation:ticker 38s linear infinite}
.ticker__mask:hover .ticker__track{animation-play-state:paused}
.ticker__track a{display:flex;flex-shrink:0;align-items:center;gap:.5rem;font-size:.75rem;color:var(--ink-soft)}
.ticker__track a:hover{color:var(--brand-600)}
.ticker__track a::before{content:"";width:.375rem;height:.375rem;border-radius:999px;background:var(--brand-400)}

/* ==========================================================================
   CARDS
   ========================================================================== */
.thumb{position:relative;display:block;overflow:hidden;background:var(--line)}
.thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.group:hover .thumb img,.hero:hover .thumb img{transform:scale(1.05)}

/* hero */
.nabz-hero-wrap{height:340px}
@media(min-width:640px){.nabz-hero-wrap{height:440px}}
@media(min-width:1024px){.nabz-hero-wrap{height:480px}}
.hero{position:relative;display:block;height:100%;overflow:hidden;border-radius:1.25rem;background:var(--line)}
.hero .thumb{height:100%;aspect-ratio:16/10}
@media(min-width:1024px){.hero .thumb{aspect-ratio:auto}}
.hero__overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(22,24,29,.9),rgba(22,24,29,.3) 55%,transparent)}
.hero__body{position:absolute;left:0;right:0;bottom:0;padding:1.25rem}
@media(min-width:640px){.hero__body{padding:1.75rem}}
.hero__title{margin-top:.75rem;font-size:1.375rem;font-weight:800;line-height:1.35;color:#fff}
@media(min-width:640px){.hero__title{font-size:1.625rem}}
.hero__excerpt{margin-top:.5rem;max-width:42rem;font-size:.8125rem;color:rgba(255,255,255,.8)}
.hero__meta{margin-top:.75rem;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.6875rem;color:rgba(255,255,255,.7)}

/* vertical card */
.post{display:flex;flex-direction:column;height:100%}
.post__media{position:relative;aspect-ratio:16/10;border-radius:.75rem;overflow:hidden;margin-bottom:.75rem;background:var(--line)}
.post__media .chip{position:absolute;top:.75rem;right:.75rem}
.post__title{font-size:.875rem;font-weight:700;line-height:1.6}
.post:hover .post__title,.group:hover .post__title{color:var(--brand-600)}
.post__title{transition:color .2s}
.post__excerpt{margin-top:.375rem;flex:1;font-size:.75rem;line-height:1.55;color:var(--ink-mute)}
.post__meta{margin-top:.75rem;border-top:1px solid var(--line);padding-top:.625rem}
.meta{display:flex;align-items:center;gap:.75rem;font-size:.6875rem;color:var(--ink-mute)}
.meta span{display:flex;align-items:center;gap:.25rem}
.meta svg{width:.75rem;height:.75rem}

/* wide card */
.wide{display:grid;grid-template-columns:5fr 7fr;gap:1rem}
@media(min-width:640px){.wide{grid-template-columns:4fr 8fr}}
.wide__media{position:relative;aspect-ratio:4/3;border-radius:.75rem;overflow:hidden;background:var(--line)}
.wide__body{display:flex;flex-direction:column}
.wide__title{margin-top:.375rem;font-size:1rem;font-weight:700;line-height:1.6;transition:color .2s}
@media(min-width:640px){.wide__title{font-size:1.0625rem}}
.group:hover .wide__title{color:var(--brand-600)}
.wide__excerpt{margin-top:.375rem;flex:1;font-size:.75rem;line-height:1.55;color:var(--ink-mute)}
@media(min-width:640px){.wide__excerpt{font-size:.8125rem}}

/* list card */
.lcard{display:flex;align-items:flex-start;gap:.75rem}
.lcard__rank{display:grid;place-items:center;width:1.75rem;height:1.75rem;flex-shrink:0;border-radius:.625rem;background:var(--paper);font-size:.875rem;font-weight:800;color:var(--brand-600)}
.lcard__media{position:relative;width:5rem;aspect-ratio:1;flex-shrink:0;border-radius:.625rem;overflow:hidden;background:var(--line)}
.lcard__body{min-width:0;flex:1}
.lcard__title{margin-top:.25rem;font-size:.8125rem;font-weight:600;line-height:1.5;transition:color .2s}
.group:hover .lcard__title{color:var(--brand-600)}

/* headline */
.headline{display:flex;align-items:flex-start;gap:.625rem;border-bottom:1px solid var(--line);padding:.625rem 0}
.headline:last-child{border-bottom:none}
.headline::before{content:"";margin-top:.55rem;width:.375rem;height:.375rem;flex-shrink:0;border-radius:999px;background:var(--brand-400)}
.headline span{font-size:.8125rem;font-weight:500;line-height:1.55;color:var(--ink-soft);transition:color .2s}
.headline:hover span{color:var(--brand-600)}

/* side widget heading */
.widget-title{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:800;margin-bottom:1rem}
.widget-title svg{width:1rem;height:1rem;color:var(--brand-600)}
.stack>*+*{margin-top:1rem}

/* ---------- quick nav chips (home) ---------- */
.quicknav{display:flex;flex-wrap:wrap;gap:.5rem}
.quicknav a{display:flex;align-items:center;gap:.5rem;border:1px solid var(--line);background:#fff;border-radius:.75rem;padding:.5rem .75rem;font-size:.75rem;font-weight:600;color:var(--ink-soft);box-shadow:var(--shadow-card);transition:.2s}
.quicknav a:hover{transform:translateY(-2px);color:var(--ink)}
.quicknav .ico{display:grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:.5rem;color:#fff}
.quicknav .ico svg{width:.875rem;height:.875rem}

/* ---------- editors band ---------- */
.editor-card{display:block;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);border-radius:.75rem;padding:1rem;transition:background .2s}
.editor-card:hover{background:rgba(255,255,255,.1)}
.editor-card .k{font-size:.6875rem;font-weight:700;color:var(--brand-300)}
.editor-card h3{margin-top:.5rem;font-size:.875rem;font-weight:700;line-height:1.6;color:#fff}
.editor-card p{margin-top:.5rem;font-size:.75rem;color:rgba(255,255,255,.55)}

/* category subs row */
.subs-row{display:flex;flex-wrap:wrap;gap:.375rem;margin-bottom:.5rem}
.subs-row .s{border-radius:999px;background:var(--paper);padding:.25rem .625rem;font-size:.6875rem;font-weight:500;color:var(--ink-soft)}

/* ==========================================================================
   CATEGORY / ARCHIVE banner
   ========================================================================== */
.cat-banner{border-bottom:1px solid var(--line)}
.cat-banner__in{padding:2.25rem 0}
.crumbs{display:flex;align-items:center;gap:.375rem;font-size:.6875rem;color:var(--ink-mute);margin-bottom:.75rem}
.crumbs a:hover{color:var(--brand-600)}
.cat-head{display:flex;align-items:center;gap:.75rem}
.cat-head__ico{display:grid;place-items:center;width:3rem;height:3rem;border-radius:1rem;color:#fff;box-shadow:var(--shadow-card)}
.cat-head__ico svg{width:1.5rem;height:1.5rem}
.cat-head h1{font-size:1.375rem;font-weight:800}
.cat-head p{margin-top:.25rem;font-size:.8125rem;color:var(--ink-mute)}
.cat-pills{margin-top:1.25rem;display:flex;flex-wrap:wrap;gap:.5rem}
.cat-pills .p{border:1px solid var(--line);background:#fff;border-radius:999px;padding:.375rem .75rem;font-size:.75rem;font-weight:500;color:var(--ink-soft)}
.filter-pill{border:1px solid var(--line);border-radius:999px;padding:.375rem .75rem;font-size:.75rem;font-weight:600;color:var(--ink-soft);transition:.2s}
.filter-pill:hover{color:var(--ink)}
.filter-pill.is-active{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ==========================================================================
   SINGLE
   ========================================================================== */
.article-head{padding-top:1.75rem}
.single-title{margin-top:.75rem;font-size:1.375rem;font-weight:800;line-height:1.35}
@media(min-width:640px){.single-title{font-size:1.75rem}}
.single-lead{margin-top:.75rem;font-size:1rem;line-height:2;color:var(--ink-soft)}
.single-meta{margin-top:1.25rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:.75rem 0}
.single-meta__info{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;font-size:.6875rem;color:var(--ink-mute)}
.single-meta__info span{display:flex;align-items:center;gap:.375rem}
.single-meta__info svg{width:.875rem;height:.875rem}
.single-figure{position:relative;margin-top:1.5rem;aspect-ratio:16/9;border-radius:1.25rem;overflow:hidden;background:var(--line)}
.figure-cap{margin-top:.5rem;font-size:.6875rem;color:var(--ink-mute)}

.share{display:flex;align-items:center;gap:.5rem}
.share .lbl{font-size:.6875rem;font-weight:700;color:var(--ink-mute)}
.share button,.share a{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:.625rem;border:1px solid var(--line);color:var(--ink-soft);transition:.2s}
.share button:hover,.share a:hover{border-color:var(--brand-300);color:var(--brand-600)}
.share svg{width:1rem;height:1rem}

.entry{margin-top:1.75rem;font-size:.9375rem}
.entry p{margin-bottom:1.25rem;line-height:2.1;color:var(--ink-soft)}
.entry p:first-child{font-size:1rem;line-height:2.15;color:var(--ink)}
.entry h2{font-size:1.25rem;font-weight:800;margin:1.75rem 0 .75rem}
.entry h3{font-size:1.0625rem;font-weight:700;margin:1.5rem 0 .5rem}
.entry ul,.entry ol{margin:0 1.25rem 1.25rem;color:var(--ink-soft);line-height:2}
.entry li{margin-bottom:.5rem;list-style:disc}
.entry ol li{list-style:decimal}
.entry a{color:var(--brand-600);font-weight:600}
.entry img{border-radius:.75rem;margin:1rem 0}
.entry blockquote{border-right:3px solid var(--brand-600);background:var(--paper);padding:1rem 1.25rem;border-radius:.5rem;margin:1.25rem 0;color:var(--ink)}

.tags-row{margin-top:2rem;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;border-top:1px solid var(--line);padding-top:1.25rem}
.tags-row svg{width:1rem;height:1rem;color:var(--ink-mute)}
.authorbox{margin-top:1.75rem;display:flex;align-items:center;gap:1rem;border:1px solid var(--line);background:var(--paper);border-radius:1.25rem;padding:1.25rem}
.authorbox__avatar{display:grid;place-items:center;width:3.5rem;height:3.5rem;border-radius:999px;background:var(--brand-600);color:#fff;font-size:1.125rem;font-weight:800;flex-shrink:0;overflow:hidden}
.authorbox__avatar img{width:100%;height:100%;object-fit:cover}
.authorbox p.n{font-size:.875rem;font-weight:700}
.authorbox p.b{margin-top:.25rem;font-size:.75rem;color:var(--ink-mute)}

.mini-news{overflow:hidden}
.mini-news__head{background:var(--brand-600);color:#fff;padding:1rem 1.25rem}
.mini-news__head p:first-child{font-size:.875rem;font-weight:800}
.mini-news__head p:last-child{margin-top:.25rem;font-size:.75rem;color:rgba(255,255,255,.8)}
.mini-news form{padding:1.25rem}
.mini-news input{height:2.5rem;width:100%;border:1px solid var(--line);border-radius:.625rem;padding:0 .75rem;font-size:.8125rem;outline:none;margin-bottom:.5rem}
.mini-news input:focus{border-color:var(--brand-300)}

/* ==========================================================================
   PAGES (about/contact/etc)
   ========================================================================== */
.page-wrap{max-width:48rem;margin:0 auto;padding:3rem 0}
.page-wrap.wide{max-width:var(--max)}
.page-title{font-size:1.75rem;font-weight:800}
@media(min-width:640px){.page-title{font-size:2rem}}
.field{height:2.75rem;width:100%;border:1px solid var(--line);border-radius:.625rem;padding:0 .75rem;font-size:.8125rem;outline:none}
.field:focus,textarea.field:focus{border-color:var(--brand-300)}
textarea.field{height:auto;padding:.75rem}
.stat{border:1px solid var(--line);background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-card);padding:1.25rem;text-align:center}
.stat .n{font-size:1.5rem;font-weight:800;color:var(--brand-600)}
.stat .t{margin-top:.25rem;font-size:.75rem;color:var(--ink-mute)}

/* pagination */
.pager{display:flex;justify-content:center;gap:.5rem;margin-top:2.5rem;flex-wrap:wrap}
.pager .page-numbers{display:grid;place-items:center;min-width:2.5rem;height:2.5rem;padding:0 .75rem;border:1px solid var(--line);border-radius:.625rem;font-size:.8125rem;font-weight:600;color:var(--ink-soft)}
.pager .page-numbers:hover{border-color:var(--brand-300);color:var(--brand-600)}
.pager .page-numbers.current{background:var(--brand-600);color:#fff;border-color:var(--brand-600)}

/* empty state */
.empty{margin-top:2.5rem;border:1px dashed var(--line);border-radius:1.25rem;padding:2.5rem;text-align:center;color:var(--ink-mute);font-size:.8125rem}

/* 404 */
.nf{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;text-align:center;padding:5rem 0}
.nf__code{font-size:4.5rem;font-weight:800;color:var(--brand-600)}
.nf h1{margin-top:1rem;font-size:1.25rem;font-weight:800}
.nf p{margin-top:.5rem;max-width:24rem;font-size:.8125rem;color:var(--ink-mute)}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{margin-top:4rem;border-top:1px solid var(--line);background:var(--ink);color:rgba(255,255,255,.7)}
.foot-news{border-bottom:1px solid rgba(255,255,255,.1)}
.foot-news__in{display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:1rem;padding:2rem 0;text-align:center}
@media(min-width:768px){.foot-news__in{flex-direction:row;text-align:right}}
.foot-news h3{font-size:1.0625rem;font-weight:800;color:#fff}
.foot-news p{margin-top:.25rem;font-size:.8125rem;color:rgba(255,255,255,.6)}
.foot-news form{display:flex;width:100%;max-width:28rem;gap:.5rem}
.foot-news input{height:2.75rem;flex:1;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.05);border-radius:.625rem;padding:0 1rem;font-size:.8125rem;color:#fff;outline:none}
.foot-news input::placeholder{color:rgba(255,255,255,.4)}
.foot-news input:focus{border-color:rgba(255,255,255,.4)}
.foot-news .btn{background:var(--brand-600)}.foot-news .btn:hover{background:var(--brand-500)}

.foot-main{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;padding:3rem 0}
@media(min-width:768px){.foot-main{grid-template-columns:repeat(12,1fr)}}
.foot-brand{grid-column:span 2}
@media(min-width:768px){.foot-brand{grid-column:span 3}}
.foot-brand p{margin-top:1rem;max-width:20rem;font-size:.75rem;line-height:1.7;color:rgba(255,255,255,.55)}
.foot-social{margin-top:1.25rem;display:flex;gap:.5rem}
.foot-social a{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:.625rem;border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.7);transition:.2s}
.foot-social a:hover{background:rgba(255,255,255,.1);color:#fff}
.foot-social svg{width:1rem;height:1rem}
.foot-col{grid-column:span 1}
@media(min-width:768px){.foot-col{grid-column:span 2}}
.foot-col.lg{grid-column:span 2}
@media(min-width:768px){.foot-col.lg{grid-column:span 3}}
.foot-col h4{font-size:.75rem;font-weight:700;color:#fff;margin-bottom:.75rem}
.foot-col li+li{margin-top:.5rem}
.foot-col a{font-size:.75rem;color:rgba(255,255,255,.55);transition:color .2s}
.foot-col a:hover{color:#fff}
.foot-bottom{border-top:1px solid rgba(255,255,255,.1)}
.foot-bottom__in{display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:.5rem;padding:1rem 0;font-size:.6875rem;color:rgba(255,255,255,.4)}
@media(min-width:640px){.foot-bottom__in{flex-direction:row}}

/* ---------- animations ---------- */
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.ticker__track{animation:none}*{scroll-behavior:auto!important}}

/* WP core alignment helpers used inside .entry */
.entry .alignleft{float:right;margin:0 0 1rem 1rem}
.entry .alignright{float:left;margin:0 1rem 1rem 0}
.entry .aligncenter{display:block;margin:1rem auto}
.wp-caption-text,.entry figcaption{font-size:.6875rem;color:var(--ink-mute);text-align:center;margin-top:.35rem}

/* ==========================================================================
   RESPONSIVE POLISH & LAYOUT REFINEMENTS (v1.1)
   Tidier boxes on desktop, no overflow / clutter on mobile.
   ========================================================================== */

/* The header is only 4rem tall until the topbar appears (>=1024). Match the
   sticky offset to the real height so widgets don't stick too low on mobile. */
:root{--header-h:4rem}
@media(min-width:1024px){:root{--header-h:6.25rem}}

/* Never let oversized embeds break the article width on small screens. */
.entry img,.entry iframe,.entry video,.entry embed,.entry object{max-width:100%;height:auto}
.entry iframe{width:100%;aspect-ratio:16/9}
.entry pre{overflow-x:auto;background:var(--paper);border:1px solid var(--line);border-radius:.5rem;padding:1rem;margin:1.25rem 0;font-size:.8125rem;direction:ltr;text-align:left}
.entry table{display:block;width:100%;overflow-x:auto;border-collapse:collapse;margin:1.25rem 0;font-size:.8125rem}
.entry th,.entry td{border:1px solid var(--line);padding:.5rem .75rem;text-align:right}
.entry figure{margin:1.25rem 0}.entry figure img{margin:0}

/* Keep the hero readable: a long title must not clip the meta row. */
.hero__title{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media(min-width:1024px){.hero__title{-webkit-line-clamp:2}}

/* Quick-nav becomes a single tidy scroll-row on phones instead of a tall wrap. */
@media(max-width:639px){
  .quicknav{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:.25rem}
  .quicknav::-webkit-scrollbar{display:none}
  .quicknav a{flex-shrink:0}
}

/* Single-post meta: stack the share row under the info on small screens so the
   space-between layout doesn't leave awkward gaps. */
@media(max-width:639px){
  .single-meta{justify-content:flex-start}
  .single-meta__info{gap:.75rem 1rem}
  .share{width:100%;flex-wrap:wrap;gap:.5rem}
}

/* Footer: hide the blank placeholder heading on mobile (no empty gap). */
@media(max-width:767px){.foot-col h4.is-empty{display:none}}

/* Wide card stacks (image over text) on very small screens to avoid cramping. */
@media(max-width:479px){
  .wide{grid-template-columns:1fr;gap:.75rem}
  .wide__media{aspect-ratio:16/9}
}

/* Mega menu never runs off-screen on shorter laptops. */
@media(min-width:1024px){
  .mega__inner{max-height:calc(100vh - var(--header-h) - 1rem);overflow:auto}
}