/* =============================================================================
   DİJİTAL KURDISTAN NEWS — Editorial design system
   Built on the Pezkuwi / Kurdish brandbook: kesk green, sor red, zer gold,
   Newroz flame, deep-navy frosted surfaces. Dark, premium, Al-Jazeera-grade.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,500;1,600&family=JetBrains+Mono:wght@400;500;600&family=Noto+Serif:ital,wght@0,400;0,500;0,600;1,400&display=swap');

:root{
  /* Kurdish national palette */
  --kesk:#009639; --kesk-bright:#2FC864; --kesk-700:#017A2F; --kesk-900:#013D1A;
  --sor:#E2231A;  --sor-bright:#FF4D4D;  --sor-700:#A30E1F;
  --zer:#FDB813;  --zer-bright:#FFD600;  --zer-600:#D9A400;
  --fire:#FF7A00; --info:#2AB0F2;
  --tint:153,158,199;

  /* Backgrounds — deep navy, never flat black */
  --bg:#070A1C; --bg-2:#05081C; --bg-3:#0B0F26; --bg-band:#04060F;
  --grad-screen:radial-gradient(140% 90% at 50% -8%, rgba(0,150,57,.10) 0%, rgba(7,10,28,0) 55%);

  /* Frosted surfaces */
  --surface:rgba(var(--tint),.055);
  --surface-2:rgba(var(--tint),.10);
  --surface-3:rgba(var(--tint),.16);
  --border:rgba(var(--tint),.14);
  --border-soft:rgba(var(--tint),.08);
  --border-strong:rgba(var(--tint),.26);

  /* Ink */
  --ink:rgba(255,255,255,.93);
  --ink-2:rgba(255,255,255,.64);
  --ink-3:rgba(255,255,255,.42);
  --ink-4:rgba(255,255,255,.28);

  /* Type */
  --display:'Space Grotesk',system-ui,sans-serif;
  --sans:'Plus Jakarta Sans',system-ui,sans-serif;
  --serif:'Noto Serif',Georgia,serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;

  --flame-h:linear-gradient(90deg,#009639 0%,#FF7A00 42%,#FDB813 72%,#E2231A 100%);
  --flame-v:linear-gradient(0deg,#1B5E20 0%,#FF6F00 32%,#FFD600 62%,#D32F2F 100%);

  --container:1320px;
  --gutter:clamp(16px,4vw,40px);
  --shadow-card:0 10px 30px rgba(0,0,0,.40);
  --shadow-pop:0 20px 60px rgba(0,0,0,.55);
  --ease:cubic-bezier(.4,0,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); background-image:var(--grad-screen);
  background-attachment:fixed;
  color:var(--ink); font-family:var(--sans);
  font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
button{font-family:inherit; cursor:pointer;}
::selection{background:rgba(0,150,57,.32); color:#fff;}

.wrap{max-width:var(--container); margin:0 auto; padding-inline:var(--gutter);}
.num{font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1;}
.mono{font-family:var(--mono);}

/* ---------- Utility top bar ------------------------------------------------ */
.util{background:var(--bg-band); border-bottom:1px solid var(--border-soft); font-size:12.5px;}
.util__row{display:flex; align-items:center; gap:18px; height:38px; color:var(--ink-3);}
.util__date{font-family:var(--mono); letter-spacing:.01em; text-transform:uppercase; font-size:11.5px;}
.util__spacer{flex:1;}
.util__link{color:var(--ink-3); transition:color .15s var(--ease); white-space:nowrap;}
.util__link:hover{color:var(--ink);}
.util__sep{width:1px; height:14px; background:var(--border); }

.lang{display:inline-flex; align-items:center; gap:2px; background:var(--surface); border:1px solid var(--border); border-radius:999px; padding:3px;}
.lang button{
  border:0; background:transparent; color:var(--ink-3); font-weight:700;
  font-size:11px; letter-spacing:.06em; padding:3px 10px; border-radius:999px;
  transition:all .15s var(--ease);
}
.lang button.is-active{background:var(--kesk); color:#fff; box-shadow:0 2px 10px rgba(0,150,57,.4);}
.lang button:not(.is-active):hover{color:var(--ink);}

/* ---------- Masthead ------------------------------------------------------- */
.masthead{position:relative;}
.masthead::after{content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:var(--flame-h); opacity:.9;}
.masthead__row{display:flex; align-items:center; gap:28px; padding-block:22px;}
.brand{display:flex; align-items:center; gap:14px;}
.brand__mark{
  width:52px; height:52px; flex:none; border-radius:50%;
  background:radial-gradient(circle at 50% 38%, #11152E, #05081C 78%);
  border:1px solid var(--border-strong); display:grid; place-items:center;
  box-shadow:0 0 34px rgba(253,184,19,.18), inset 0 0 18px rgba(0,0,0,.6);
}
.brand__mark img{width:30px; height:30px; filter:drop-shadow(0 2px 8px rgba(255,122,0,.5));}
.brand__name{line-height:1;}
.brand__kicker{font-family:var(--mono); font-size:10px; letter-spacing:.34em; color:var(--zer); text-transform:uppercase; display:block; margin-bottom:5px;}
.brand__word{font-family:var(--display); font-weight:700; font-size:clamp(22px,2.4vw,30px); letter-spacing:-.02em; color:#fff; display:block;}
.brand__word b{color:var(--kesk-bright); font-weight:700;}

.masthead__spacer{flex:1;}
.weather{display:flex; flex-direction:column; gap:3px; text-align:right; font-size:12px; color:var(--ink-3);}
.weather b{color:var(--ink); font-family:var(--display); font-size:15px;}
.btn-sub{
  display:inline-flex; align-items:center; gap:8px; background:var(--kesk); color:#fff;
  font-weight:700; font-size:13.5px; padding:11px 20px; border:0; border-radius:999px;
  box-shadow:0 8px 24px rgba(0,150,57,.34); transition:all .15s var(--ease); white-space:nowrap;
}
.btn-sub:hover{background:var(--kesk-bright); transform:translateY(-1px);}
.btn-sub:active{transform:scale(.98);}
.search-btn{
  width:42px; height:42px; border-radius:50%; border:1px solid var(--border);
  background:var(--surface); color:var(--ink-2); display:grid; place-items:center; transition:all .15s var(--ease);
}
.search-btn:hover{color:#fff; border-color:var(--border-strong); background:var(--surface-2);}

/* ---------- Primary nav ---------------------------------------------------- */
.nav{position:sticky; top:0; z-index:60; background:rgba(5,8,28,.86); backdrop-filter:blur(16px) saturate(140%); border-block:1px solid var(--border); transition:box-shadow .2s var(--ease);}
.nav.is-stuck{box-shadow:0 12px 30px rgba(0,0,0,.5);}
.nav__row{display:flex; align-items:center; gap:4px; height:54px; overflow-x:auto; scrollbar-width:none;}
.nav__row::-webkit-scrollbar{display:none;}
.nav__brand{display:none; align-items:center; gap:10px; font-family:var(--display); font-weight:700; font-size:16px; letter-spacing:-.01em; padding-right:18px; margin-right:8px; border-right:1px solid var(--border); white-space:nowrap;}
.nav__brand img{width:24px; height:24px;}
.nav.is-stuck .nav__brand{display:flex;}
.nav a{
  position:relative; padding:8px 14px; font-weight:600; font-size:14px; color:var(--ink-2);
  white-space:nowrap; border-radius:8px; transition:color .15s var(--ease);
}
.nav a::after{content:""; position:absolute; left:14px; right:14px; bottom:-1px; height:2px; background:var(--kesk-bright); transform:scaleX(0); transform-origin:left; transition:transform .2s var(--ease);}
.nav a:hover{color:#fff;}
.nav a:hover::after{transform:scaleX(1);}
.nav a.is-active{color:#fff;}
.nav a.is-active::after{transform:scaleX(1);}
.nav__more{margin-left:auto;}

/* ---------- Breaking ticker ------------------------------------------------ */
.ticker{display:flex; align-items:stretch; background:var(--bg-band); border-bottom:1px solid var(--border-soft); height:46px; overflow:hidden;}
.ticker__tag{display:inline-flex; align-items:center; gap:8px; background:var(--sor); color:#fff; font-weight:800; font-size:12px; letter-spacing:.07em; text-transform:uppercase; padding-inline:18px; flex:none; position:relative; white-space:nowrap;}
.ticker__tag::after{content:""; position:absolute; right:-8px; top:0; bottom:0; width:0; border-style:solid; border-width:23px 0 23px 8px; border-color:transparent transparent transparent var(--sor);}
.live-dot{width:7px; height:7px; border-radius:50%; background:#fff; box-shadow:0 0 0 0 rgba(255,255,255,.7); animation:pulse 1.8s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.6);}70%{box-shadow:0 0 0 7px rgba(255,255,255,0);}100%{box-shadow:0 0 0 0 rgba(255,255,255,0);}}
.ticker__view{flex:1; overflow:hidden; position:relative;}
.ticker__items{display:flex; flex-direction:column; transition:transform .55s var(--ease-out);}
.ticker__item{height:46px; display:flex; align-items:center; gap:14px; padding-left:22px; font-size:14px; color:var(--ink);}
.ticker__item time{font-family:var(--mono); font-size:11.5px; color:var(--zer); flex:none;}
.ticker__item span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.ticker__nav{display:flex; align-items:center; border-left:1px solid var(--border-soft);}
.ticker__nav button{width:42px; height:46px; background:transparent; border:0; color:var(--ink-3); display:grid; place-items:center; transition:color .15s var(--ease);}
.ticker__nav button:hover{color:#fff;}

/* ---------- Photo wells (duotone placeholder system) ----------------------- */
.photo{position:relative; overflow:hidden; background:#0A0E22; border-radius:10px; isolation:isolate;}
.photo::before{content:""; position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(95% 75% at 30% 8%, rgba(255,255,255,.16), transparent 52%),
    var(--photo-grad, linear-gradient(145deg,#15583A 0%,#0E1E52 52%,#2A1014 100%));
}
.photo::after{content:""; position:absolute; inset:0; z-index:1; opacity:.26; mix-blend-mode:overlay; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");
}
.photo .ridge{position:absolute; left:0; right:0; bottom:0; height:58%; z-index:1; opacity:.92;
  background:linear-gradient(180deg, rgba(6,9,22,.2), rgba(4,6,15,.96));
  clip-path:polygon(0 64%,12% 40%,24% 58%,38% 26%,52% 52%,66% 22%,80% 48%,92% 30%,100% 44%,100% 100%,0 100%);
}
.photo .ridge::before{content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, var(--ridge-rim, rgba(0,150,57,.4)) 0 1.5px, transparent 2px);
  clip-path:inherit; opacity:.7;}
.photo .sun{position:absolute; top:16%; left:60%; width:54px; height:54px; border-radius:50%; z-index:1;
  background:radial-gradient(circle, rgba(255,238,170,1), rgba(253,184,19,.7) 38%, rgba(255,122,0,.22) 62%, transparent 74%);
  filter:blur(.5px); opacity:.92;}
.photo--green{--photo-grad:linear-gradient(145deg,#16633E 0%,#0D1E54 54%,#073A1F 100%); --ridge-rim:rgba(47,200,100,.5);}
.photo--red{--photo-grad:linear-gradient(145deg,#5A141E 0%,#0E1A4A 55%,#2A0C12 100%); --ridge-rim:rgba(229,52,80,.5);}
.photo--gold{--photo-grad:linear-gradient(145deg,#5A4310 0%,#0E1A4A 60%,#2A1A06 100%); --ridge-rim:rgba(253,184,19,.55);}
.photo--blue{--photo-grad:linear-gradient(145deg,#0E4366 0%,#0C1748 58%,#06203A 100%); --ridge-rim:rgba(42,176,242,.5);}
.photo--fire{--photo-grad:linear-gradient(145deg,#5E2E08 0%,#0E1A4A 58%,#2E1606 100%); --ridge-rim:rgba(255,122,0,.55);}
.photo--night{--photo-grad:linear-gradient(145deg,#1A2150 0%,#0C1130 55%,#070A1C 100%); --ridge-rim:rgba(153,158,199,.4);}
.photo__live{position:absolute; top:12px; left:12px; z-index:2; display:inline-flex; align-items:center; gap:6px; background:var(--sor); color:#fff; font-weight:800; font-size:10.5px; letter-spacing:.06em; padding:4px 9px; border-radius:5px;}
.photo__dur{position:absolute; bottom:12px; right:12px; z-index:2; font-family:var(--mono); font-size:11px; background:rgba(4,6,15,.7); border:1px solid var(--border); padding:3px 7px; border-radius:5px; color:#fff;}
.photo__play{position:absolute; inset:0; display:grid; place-items:center; z-index:2;}
.photo__play span{width:54px; height:54px; border-radius:50%; background:rgba(4,6,15,.5); border:1.5px solid rgba(255,255,255,.7); display:grid; place-items:center; backdrop-filter:blur(4px); transition:transform .2s var(--ease);}
a:hover .photo__play span{transform:scale(1.08); background:var(--kesk);}

/* ---------- Kicker / meta -------------------------------------------------- */
.kicker{font-family:var(--sans); font-weight:800; font-size:11.5px; letter-spacing:.10em; text-transform:uppercase; color:var(--kesk-bright); display:inline-flex; align-items:center; gap:7px;}
.kicker::before{content:""; width:14px; height:2px; background:currentColor; border-radius:2px;}
.kicker--red{color:var(--sor-bright);} .kicker--gold{color:var(--zer);} .kicker--blue{color:var(--info);} .kicker--fire{color:var(--fire);}
.meta{font-family:var(--mono); font-size:11.5px; color:var(--ink-3); display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.meta .dot{width:3px; height:3px; border-radius:50%; background:var(--ink-4);}

/* ---------- Article cards -------------------------------------------------- */
.card{display:flex; flex-direction:column; gap:12px;}
.card a.card__media{display:block;}
.card .photo{aspect-ratio:16/10;}
.card__title{font-family:var(--display); font-weight:600; letter-spacing:-.015em; line-height:1.18; color:var(--ink); transition:color .15s var(--ease);}
.card__title:hover{color:#fff;}
a:hover .card__title{color:#fff; text-decoration:underline; text-decoration-color:var(--kesk-bright); text-underline-offset:4px; text-decoration-thickness:2px;}
.card__dek{font-size:14.5px; color:var(--ink-2); line-height:1.5;}
.card .photo img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease-out);}
.card a.card__media:hover .photo img{transform:scale(1.05);}

.card--lg .card__title{font-size:clamp(28px,3vw,40px); line-height:1.08;}
.card--md .card__title{font-size:20px;}
.card--sm .card__title{font-size:16.5px; font-weight:600;}

/* horizontal list row */
.row{display:grid; grid-template-columns:118px 1fr; gap:14px; align-items:start; padding-block:18px; border-top:1px solid var(--border-soft);}
.row:first-child{border-top:0;}
.row .photo{aspect-ratio:1/1; border-radius:8px;}
.row .card__title{font-size:16px;}

/* ---------- Section header ------------------------------------------------- */
.shead{display:flex; align-items:center; gap:16px; margin:0 0 22px;}
.shead h2{font-family:var(--display); font-weight:700; font-size:22px; letter-spacing:-.01em; margin:0; color:#fff; display:inline-flex; align-items:center; gap:11px;}
.shead h2::before{content:""; width:4px; height:22px; border-radius:3px; background:var(--accent,var(--kesk));}
.shead .line{flex:1; height:1px; background:var(--border);}
.shead a{font-size:13px; font-weight:700; color:var(--ink-3); display:inline-flex; align-items:center; gap:5px; transition:color .15s var(--ease); white-space:nowrap;}
.shead a:hover{color:var(--kesk-bright);}
.sec{padding-block:clamp(34px,5vw,56px);}
.sec--band{background:var(--bg-2); border-block:1px solid var(--border-soft);}

/* ---------- Hero ----------------------------------------------------------- */
.hero{display:grid; grid-template-columns:1.55fr 1fr; gap:34px; padding-top:34px;}
.hero__lead .photo{aspect-ratio:16/9; border-radius:12px; margin-bottom:20px;}
.hero__lead .card__dek{font-size:17px; max-width:62ch;}
.hero__side{display:flex; flex-direction:column;}
.hero__side .row:first-child{border-top:0; padding-top:0;}

/* ---------- Market strip (PezkuwiChain) ------------------------------------ */
.market{background:var(--bg-band); border-block:1px solid var(--border-soft);}
.market__row{display:flex; align-items:stretch; gap:0; overflow-x:auto; scrollbar-width:none;}
.market__row::-webkit-scrollbar{display:none;}
.market__tag{display:flex; align-items:center; gap:8px; padding-right:20px; margin-right:4px; border-right:1px solid var(--border); flex:none; color:var(--zer); font-weight:800; font-size:11px; letter-spacing:.10em; text-transform:uppercase;}
.tick{display:flex; align-items:center; gap:10px; padding:13px 22px; border-right:1px solid var(--border-soft); flex:none;}
.tick__sym{font-family:var(--display); font-weight:700; font-size:13px; color:#fff;}
.tick__price{font-family:var(--mono); font-size:13px; color:var(--ink-2);}
.tick__chg{font-family:var(--mono); font-size:12px; font-weight:600; padding:2px 7px; border-radius:5px;}
.up{color:var(--kesk-bright); background:rgba(47,200,100,.12);}
.down{color:var(--sor-bright); background:rgba(229,52,80,.12);}

/* ---------- Most read / live aside ----------------------------------------- */
.panel{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:22px;}
.panel__head{font-family:var(--display); font-weight:700; font-size:16px; color:#fff; margin:0 0 6px; display:flex; align-items:center; gap:9px;}
.mostread{counter-reset:mr; display:flex; flex-direction:column;}
.mostread a{display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:start; padding-block:15px; border-top:1px solid var(--border-soft);}
.mostread a:first-of-type{border-top:0;}
.mostread a::before{counter-increment:mr; content:counter(mr); font-family:var(--display); font-weight:700; font-size:26px; line-height:.8; color:var(--kesk-bright); opacity:.55; min-width:24px;}
.mostread .t{font-weight:600; font-size:15px; line-height:1.32; color:var(--ink); transition:color .15s var(--ease);}
.mostread a:hover .t{color:#fff;}

.livebox{background:linear-gradient(160deg, rgba(226,35,26,.12), rgba(5,8,28,.2)); border:1px solid rgba(226,35,26,.3);}
.live-badge{display:inline-flex; align-items:center; gap:7px; background:var(--sor); color:#fff; font-weight:800; font-size:11px; letter-spacing:.06em; padding:4px 10px; border-radius:6px;}

/* ---------- Opinion / quote ------------------------------------------------ */
.opinion{display:flex; gap:16px; align-items:flex-start; padding-block:18px; border-top:1px solid var(--border-soft);}
.opinion:first-child{border-top:0;}
.opinion__av{width:46px; height:46px; flex:none; border-radius:50%; background:var(--surface-2); border:1px solid var(--border); display:grid; place-items:center; font-family:var(--display); font-weight:700; color:var(--zer);}
.opinion .q{font-family:var(--serif); font-style:italic; font-size:16px; line-height:1.4; color:var(--ink); margin:0 0 7px;}
.opinion .by{font-size:12.5px; color:var(--ink-3); font-weight:600;}

/* ---------- Footer --------------------------------------------------------- */
.footer{background:var(--bg-2); border-top:1px solid var(--border); margin-top:30px; position:relative;}
.footer::before{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--flame-h); opacity:.85;}
.footer__top{display:grid; grid-template-columns:1.5fr repeat(4,1fr); gap:36px; padding-block:48px;}
.footer__brand .brand{margin-bottom:16px;}
.footer__brand p{color:var(--ink-3); font-size:13.5px; line-height:1.6; max-width:34ch;}
.footer__col h4{font-family:var(--sans); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); margin:0 0 14px;}
.footer__col a{display:block; color:var(--ink-2); font-size:13.5px; padding-block:6px; transition:color .15s var(--ease);}
.footer__col a:hover{color:var(--kesk-bright);}
.footer__bottom{border-top:1px solid var(--border-soft); padding-block:22px; display:flex; align-items:center; gap:16px; flex-wrap:wrap; color:var(--ink-3); font-size:12.5px;}
.footer__bottom .util__spacer{flex:1;}

/* ---------- Article page --------------------------------------------------- */
.article{max-width:1180px; margin:0 auto; padding-inline:var(--gutter);}
.crumbs{display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--ink-3); padding-top:30px;}
.crumbs a:hover{color:var(--kesk-bright);}
.article__head{max-width:820px; margin:18px 0 26px;}
.article__title{font-family:var(--display); font-weight:700; font-size:clamp(30px,4.4vw,52px); line-height:1.05; letter-spacing:-.022em; color:#fff; margin:14px 0 18px;}
.article__dek{font-family:var(--serif); font-size:clamp(18px,2vw,22px); line-height:1.5; color:var(--ink-2);}
.byline{display:flex; align-items:center; gap:14px; margin-top:24px; padding-top:20px; border-top:1px solid var(--border);}
.byline__av{width:46px; height:46px; border-radius:50%; background:var(--surface-2); border:1px solid var(--border); display:grid; place-items:center; font-family:var(--display); font-weight:700; color:var(--zer); flex:none;}
.byline__who b{display:block; font-size:14.5px; color:var(--ink);}
.byline__who span{font-family:var(--mono); font-size:11.5px; color:var(--ink-3);}
.byline__share{margin-left:auto; display:flex; gap:8px;}
.byline__share button{width:38px; height:38px; border-radius:50%; border:1px solid var(--border); background:var(--surface); color:var(--ink-2); display:grid; place-items:center; transition:all .15s var(--ease);}
.byline__share button:hover{color:#fff; border-color:var(--kesk); background:var(--surface-2);}

.figure{margin:0 0 8px;}
.figure .photo{aspect-ratio:16/9; border-radius:12px;}
.figure figcaption{font-size:12.5px; color:var(--ink-3); padding:10px 2px; display:flex; gap:8px; font-family:var(--mono);}
.figure figcaption b{color:var(--ink-2); font-weight:600;}

.article__body{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:48px; padding-block:34px; align-items:start;}
.prose{max-width:none; font-family:var(--serif); font-size:19px; line-height:1.74; color:rgba(255,255,255,.82);}
.prose>p{margin:0 0 24px;}
.prose>p:first-of-type::first-letter{font-family:var(--display); font-weight:700; font-size:62px; line-height:.78; float:left; padding:6px 12px 0 0; color:var(--kesk-bright);}
.prose h3{font-family:var(--display); font-weight:700; font-size:24px; color:#fff; margin:38px 0 14px; letter-spacing:-.01em;}
.prose a{color:var(--kesk-bright); text-decoration:underline; text-underline-offset:3px;}
.prose blockquote{margin:34px 0; padding:6px 0 6px 26px; border-left:3px solid; border-image:var(--flame-v) 1; font-family:var(--display); font-style:normal; font-weight:600; font-size:25px; line-height:1.3; color:#fff;}
.prose .pull-by{display:block; font-family:var(--mono); font-size:12px; color:var(--zer); margin-top:12px; font-weight:500;}
.aside-sticky{position:sticky; top:74px; display:flex; flex-direction:column; gap:26px;}
.tags{display:flex; flex-wrap:wrap; gap:9px; padding-top:8px;}
.tag{font-size:12.5px; font-weight:600; color:var(--ink-2); background:var(--surface); border:1px solid var(--border); padding:7px 14px; border-radius:999px; transition:all .15s var(--ease);}
.tag:hover{color:#fff; border-color:var(--kesk); background:var(--surface-2);}

/* ---------- Category page -------------------------------------------------- */
.cathead{padding:40px 0 28px; border-bottom:1px solid var(--border); position:relative;}
.cathead h1{font-family:var(--display); font-weight:700; font-size:clamp(34px,5vw,56px); letter-spacing:-.022em; margin:10px 0 12px; color:#fff;}
.cathead p{color:var(--ink-2); font-size:16px; max-width:60ch; line-height:1.55;}
.chips{display:flex; gap:9px; flex-wrap:wrap; padding:22px 0 4px;}
.chip{font-size:13px; font-weight:600; color:var(--ink-2); background:var(--surface); border:1px solid var(--border); padding:8px 16px; border-radius:999px; transition:all .15s var(--ease);}
.chip:hover{color:#fff; border-color:var(--border-strong);}
.chip.is-active{background:var(--kesk); color:#fff; border-color:var(--kesk); box-shadow:0 6px 18px rgba(0,150,57,.3);}

.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:30px 28px;}
.grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:28px 24px;}
.grid-2{display:grid; grid-template-columns:repeat(2,1fr); gap:30px;}
.divcol{display:grid; grid-template-columns:1.55fr 1px 1fr; gap:34px;}
.vline{background:var(--border-soft);}

/* ---------- Search overlay ------------------------------------------------- */
.search-overlay{position:fixed; inset:0; z-index:200; background:rgba(4,6,15,.74); backdrop-filter:blur(10px); display:flex; align-items:flex-start; justify-content:center; padding-top:14vh; opacity:0; visibility:hidden; transition:opacity .2s var(--ease);}
.search-overlay.open{opacity:1; visibility:visible;}
.search-overlay__box{width:min(680px,90vw); transform:translateY(-12px); transition:transform .25s var(--ease-out);}
.search-overlay.open .search-overlay__box{transform:none;}
.search-overlay__field{display:flex; align-items:center; gap:14px; background:var(--bg-3); border:1px solid var(--border-strong); border-radius:16px; padding:18px 22px; box-shadow:var(--shadow-pop);}
.search-overlay__field input{flex:1; background:transparent; border:0; outline:0; color:#fff; font-family:var(--display); font-size:22px; font-weight:500;}
.search-overlay__field input::placeholder{color:var(--ink-4);}
.search-overlay__close{width:38px; height:38px; border-radius:50%; border:1px solid var(--border); background:var(--surface); color:var(--ink-2); display:grid; place-items:center;}
.search-overlay__sug{margin-top:18px; display:flex; gap:9px; flex-wrap:wrap;}
.search-overlay__sug span{font-size:11px; color:var(--ink-3); align-self:center; font-family:var(--mono); letter-spacing:.06em; text-transform:uppercase;}
.search-overlay__sug a{font-size:13px; font-weight:600; color:var(--ink-2); background:var(--surface); border:1px solid var(--border); padding:7px 13px; border-radius:999px;}
.search-overlay__sug a:hover{color:#fff; border-color:var(--kesk);}

.reveal{opacity:0; transform:translateY(14px);}
.reveal.in{opacity:1; transform:none; transition:opacity .6s var(--ease-out), transform .6s var(--ease-out);}

/* ---------- Responsive ----------------------------------------------------- */
@media (max-width:1080px){
  .hero{grid-template-columns:1fr; gap:26px;}
  .footer__top{grid-template-columns:1fr 1fr 1fr; }
  .footer__brand{grid-column:1/-1;}
  .article__body{grid-template-columns:1fr;}
  .aside-sticky{position:static; flex-direction:row; flex-wrap:wrap;}
  .aside-sticky>*{flex:1; min-width:260px;}
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .divcol{grid-template-columns:1fr;}
  .vline{display:none;}
}
@media (max-width:760px){
  .grid-3,.grid-4,.grid-2{grid-template-columns:1fr 1fr;}
  .masthead__row{flex-wrap:wrap; gap:16px;}
  .weather{display:none;}
  .util__row{gap:12px;}
  .util__hide{display:none;}
  .card--lg .card__title{font-size:26px;}
  .prose{font-size:18px;}
}
@media (max-width:520px){
  .grid-3,.grid-4,.grid-2{grid-template-columns:1fr;}
  .footer__top{grid-template-columns:1fr 1fr;}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important; transition-duration:.001ms !important;}
  .ticker__items{transition:none;}
}

/* =============================================================================
   COMPARISON TABLE — opinion/columns (T-NPoS vs classic PoS)
   ========================================================================== */
.prose .cmp{width:100%; border-collapse:collapse; margin:30px 0; font-size:14px;
  border:1px solid var(--border); border-radius:14px; overflow:hidden; display:table;}
.prose .cmp thead th{font-family:var(--display); font-weight:700; font-size:13px; letter-spacing:-.01em;
  text-align:left; padding:14px 15px; background:rgba(255,255,255,.03); color:#fff; border-bottom:1px solid var(--border);}
.prose .cmp thead th.is-pez{color:var(--kesk-bright); background:rgba(0,150,57,.10);}
.prose .cmp tbody td, .prose .cmp td{padding:14px 15px; border-bottom:1px solid var(--border); vertical-align:top; line-height:1.5; color:var(--ink-2);}
.prose .cmp tr:last-child td{border-bottom:0;}
.prose .cmp td.feat{font-family:var(--display); font-weight:700; color:#fff; white-space:nowrap;}
.prose .cmp td.is-pez{color:var(--ink); background:rgba(0,150,57,.045);}
.prose .cmp td.is-pez b{color:var(--kesk-bright);}
.prose .cmp td .old{color:var(--sor-bright); font-weight:600;}
@media (max-width:680px){
  .prose .cmp, .prose .cmp thead, .prose .cmp tbody, .prose .cmp th, .prose .cmp td, .prose .cmp tr{display:block;}
  .prose .cmp thead{display:none;}
  .prose .cmp tr{border-bottom:1px solid var(--border); padding:6px 0;}
  .prose .cmp td{border:0; padding:7px 14px;}
  .prose .cmp td.feat{padding-top:12px; font-size:15px;}
  .prose .cmp td.is-pez::before{content:"PezkuwiChain · "; color:var(--kesk-bright); font-weight:700;}
  .prose .cmp td:not(.feat):not(.is-pez)::before{content:"Klasik PoS · "; color:var(--sor-bright); font-weight:600;}
}
.prose ul.lede{margin:18px 0; padding-left:0; list-style:none; display:flex; flex-direction:column; gap:12px;}
.prose ul.lede li{position:relative; padding-left:26px; line-height:1.6;}
.prose ul.lede li::before{content:""; position:absolute; left:0; top:10px; width:11px; height:11px; border-radius:3px;
  background:linear-gradient(135deg,var(--kesk),var(--zer));}
.prose ul.lede li b{color:#fff;}

/* Lead / closing emphasis paragraph in opinion columns (markup-free for i18n) */
.prose .lead{font-family:var(--display); font-weight:600; font-size:clamp(18px,2vw,22px);
  line-height:1.5; color:#fff; letter-spacing:-.01em;}