/* News-portal layer (loaded after style.css): masthead, category bar, lead story, list + sidebar, footer. */
:root{--news:#1d5a45;--news-dk:#123b2d;--hot:#c8102e}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--news:#6fc7a2;--news-dk:#0b1a14;--hot:#ff4d63}}
body{background:var(--paper)}
.wrap{max-width:74rem}
/* top bar */
.topbar{background:var(--news-dk);color:#cfe3d9;font-size:.8rem}
.tb-in{max-width:74rem;margin:0 auto;padding:.4rem clamp(16px,4vw,32px);display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.tb-links{display:flex;gap:1rem;align-items:center}.tb-links a{color:#cfe3d9;text-decoration:none}.tb-links a:hover{color:#fff;text-decoration:underline}
.topbar .lang{border-color:#ffffff33;background:transparent}.topbar .lang button{color:#cfe3d9;padding:.3rem .65rem}.topbar .lang button[aria-pressed="true"]{background:#fff;color:var(--news-dk)}
/* masthead */
.mast{background:var(--sheet);border-bottom:3px solid var(--news);position:sticky;top:0;z-index:6}
.mast-in{max-width:74rem;margin:0 auto;padding:.9rem clamp(16px,4vw,32px);display:flex;justify-content:space-between;align-items:center;gap:1rem}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--ink)}
.brand-mark{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:8px;background:var(--news);color:#fff;font:800 1.1rem var(--f-display);letter-spacing:-.02em}
.brand-txt{font:800 1.7rem/1 var(--f-display);letter-spacing:-.02em;display:flex;flex-direction:column}
.brand-txt b{color:var(--news)}.brand-txt small{font:500 .7rem/1.3 var(--f-body);color:var(--muted);letter-spacing:0;margin-top:.25rem}
.menu-btn{display:none;border:1px solid var(--line);background:var(--sheet);color:var(--ink);padding:.5rem .8rem;border-radius:8px;font:600 .9rem var(--f-body);cursor:pointer}
.cats{border-top:1px solid var(--line);background:var(--sheet)}
.cats-in{max-width:74rem;margin:0 auto;padding-inline:clamp(16px,4vw,32px);display:flex;gap:0;overflow-x:auto}
.cats a{padding:.75rem 1.1rem;text-decoration:none;color:var(--ink);font-weight:600;font-size:.92rem;text-transform:uppercase;letter-spacing:.04em;border-bottom:3px solid transparent;margin-bottom:-1px;white-space:nowrap}
.cats a:hover,.cats a[aria-current="page"]{color:var(--news);border-bottom-color:var(--news)}
/* ticker */
.ticker{display:flex;align-items:center;gap:.9rem;margin-top:1.2rem;border:1px solid var(--line);background:var(--sheet);border-radius:6px;overflow:hidden}
.tk-label{background:var(--hot);color:#fff;font:700 .75rem var(--f-body);text-transform:uppercase;letter-spacing:.08em;padding:.6rem .9rem}
.tk-text{padding:.5rem .2rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* lead story */
.kick{font:700 .75rem var(--f-body);text-transform:uppercase;letter-spacing:.08em;color:var(--hot)}
.lead{display:grid;grid-template-columns:1.35fr 1fr;gap:1.6rem;margin-top:1.4rem;padding-bottom:1.6rem;border-bottom:1px solid var(--line);align-items:center}
.lead-img{display:block;border-radius:8px;overflow:hidden;background:#0c1a14}
.lead-img img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .5s}
.lead:hover .lead-img img{transform:scale(1.03)}
.lead-tx{display:grid;gap:.7rem}
.lead-tx h2{font-size:clamp(1.7rem,3.2vw,2.5rem);line-height:1.12;letter-spacing:-.02em}
.lead-tx h2 a{color:var(--ink);text-decoration:none}.lead-tx h2 a:hover{color:var(--news)}
.lead-tx .sum{color:var(--muted);font-size:1.05rem}
.lead-tx .cap{font-size:.75rem;color:var(--muted)}
/* columns */
.cols{display:grid;grid-template-columns:minmax(0,1fr) 20rem;gap:2.2rem;margin-top:1.8rem}
.sec{font:800 1.05rem var(--f-display);text-transform:uppercase;letter-spacing:.05em;padding-bottom:.6rem;margin-bottom:1rem;border-bottom:2px solid var(--ink);position:relative}
.sec:after{content:"";position:absolute;left:0;bottom:-2px;width:3.5rem;height:2px;background:var(--hot)}
.sec.big{font-size:1.6rem;margin-top:2rem}
.col-main .row{display:grid;grid-template-columns:15rem 1fr;gap:1.1rem;padding:1.1rem 0;border-bottom:1px solid var(--line);text-decoration:none;color:inherit}
.col-main .row img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:6px;display:block}
.col-main .row h3{font-size:1.3rem;line-height:1.2;margin:.25rem 0 .4rem;color:var(--ink)}
.col-main .row:hover h3{color:var(--news)}
.col-main .row .sum{color:var(--muted);font-size:.95rem;margin-bottom:.4rem}
.col-main.wide{max-width:56rem}
.empty{color:var(--muted);padding:1rem 0}
/* sidebar */
.box{margin-bottom:2rem}
.mini{display:flex;gap:.8rem;padding:.7rem 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);align-items:flex-start}
.mini .num{font:800 1.6rem/1 var(--f-display);color:var(--news);min-width:1.6rem}
.mini b{display:block;line-height:1.3}.mini small{color:var(--muted)}.mini:hover b{color:var(--news)}
.about p,.sub p{color:var(--muted);margin-bottom:.8rem;font-size:.95rem}
.btn-news{display:inline-block;background:var(--news);color:#fff;padding:.55rem 1.1rem;border-radius:6px;font-weight:700;text-decoration:none}
.more{font-weight:700}
/* footer */
footer.site{background:var(--news-dk);color:#cfe3d9;margin-top:3rem;padding:0}
.ft{max-width:74rem;margin:0 auto;padding:2.4rem clamp(16px,4vw,32px);display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem}
.ft a{display:block;color:#cfe3d9;text-decoration:none;padding:.2rem 0}.ft a:hover{color:#fff;text-decoration:underline}
.ft h4{margin:0 0 .6rem;color:#fff;font-size:.85rem;text-transform:uppercase;letter-spacing:.08em}
.ft p{margin-top:.8rem;max-width:28rem;font-size:.92rem}
.ft .brand{color:#fff;display:flex}.ft .brand-mark{background:#fff;color:var(--news-dk)}.ft .brand-txt b{color:#9be3c3}
.ft-bot{border-top:1px solid #ffffff22;text-align:center;padding:1rem;font-size:.82rem}
/* responsive */
@media (max-width:880px){
  .lead{grid-template-columns:1fr}.cols{grid-template-columns:1fr}
  .col-main .row{grid-template-columns:8.5rem 1fr;gap:.8rem}.col-main .row h3{font-size:1.05rem}.col-main .row .sum{display:none}
  .ft{grid-template-columns:1fr 1fr}.ft-brand{grid-column:1/-1}
  .brand-txt{font-size:1.4rem}.brand-txt small{display:none}
  .menu-btn{display:block}.cats{display:none}.cats.open{display:block}.cats-in{flex-direction:column}.cats a{border-bottom:1px solid var(--line)}
}

/* categories */
.c-adaptif{--cc:#1d5a45}.c-pentaksiran{--cc:#b9780a}.c-profil{--cc:#2f6fb3}.c-teknologi-baharu{--cc:#7a4fb0}.c-panduan{--cc:#c8102e}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){} :root:not([data-theme="light"]) .c-adaptif{--cc:#6fc7a2}:root:not([data-theme="light"]) .c-pentaksiran{--cc:#f0b545}:root:not([data-theme="light"]) .c-profil{--cc:#6aa9ec}:root:not([data-theme="light"]) .c-teknologi-baharu{--cc:#b697e8}:root:not([data-theme="light"]) .c-panduan{--cc:#ff6b7f}}
:root[data-theme="dark"] .c-adaptif{--cc:#6fc7a2}:root[data-theme="dark"] .c-pentaksiran{--cc:#f0b545}:root[data-theme="dark"] .c-profil{--cc:#6aa9ec}:root[data-theme="dark"] .c-teknologi-baharu{--cc:#b697e8}:root[data-theme="dark"] .c-panduan{--cc:#ff6b7f}
.kick[class*="c-"]{color:var(--cc)}
.cat-chip{display:inline-block;font:700 .72rem var(--f-body);text-transform:uppercase;letter-spacing:.06em;color:var(--cc,var(--news));border:1.5px solid var(--cc,var(--news));border-radius:999px;padding:.18rem .7rem;text-decoration:none;background:transparent;transition:background .15s,color .15s}
.cat-chip:hover{background:var(--cc,var(--news));color:#fff}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:1rem 0 .4rem}.chips-l{font-size:.85rem;color:var(--muted)}
.cat-head{padding:2rem 0 .6rem;border-bottom:3px solid var(--cc);margin-bottom:.6rem}.cat-head h1{font-size:clamp(1.8rem,4vw,2.6rem);color:var(--ink);margin:.2rem 0 .5rem}.cat-head .eyebrow{color:var(--cc)}.cat-head .lede{font-size:1.05rem;max-width:44rem}
.cat-li{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.6rem .2rem .6rem .8rem;border-bottom:1px solid var(--line);border-left:4px solid var(--cc);margin-bottom:.35rem;text-decoration:none;color:var(--ink);font-weight:600;font-size:.92rem;background:var(--sheet);border-radius:0 6px 6px 0}
.cat-li:hover{background:color-mix(in srgb,var(--cc) 10%,var(--sheet))}.cat-li b{font:700 .8rem var(--f-mono);color:var(--cc);padding-right:.7rem}
.meta .cat-chip{margin-right:.2rem}
.cats a[aria-current="page"]{border-bottom-color:var(--news)}

/* logo */
.brand .lg{width:2.9rem;height:2.9rem;flex:none;display:block;filter:drop-shadow(0 2px 6px rgba(29,90,69,.35));transition:transform .3s}
.brand:hover .lg{transform:rotate(-6deg) scale(1.05)}
.brand-txt{font-size:2rem;letter-spacing:-.03em}
.lg-spark{transform-box:fill-box;transform-origin:center;animation:lgsp 2.6s ease-in-out infinite}
@keyframes lgsp{50%{transform:scale(1.35)}}
@media (prefers-reduced-motion:reduce){.lg-spark{animation:none}}
.ft .brand .lg{filter:none}
@media (max-width:880px){.brand .lg{width:2.5rem;height:2.5rem}.brand-txt{font-size:1.7rem}}

/* logo v3: open book + network, one-line wordmark */
.brand{white-space:nowrap;flex:none}.brand-txt{white-space:nowrap;flex-direction:row;display:inline-block;line-height:1}
.lg-p1{fill:var(--news)}.lg-p2{fill:#3aa07a}.lg-ln{stroke:var(--news)}.lg-n{fill:var(--news)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .lg-p2{fill:#4fb88f}}
:root[data-theme="dark"] .lg-p2{fill:#4fb88f}
.ft .lg-p1,.ft .lg-n{fill:#9be3c3}.ft .lg-ln{stroke:#9be3c3}.ft .lg-p2{fill:#4fb88f}
.brand .lg{filter:none;width:2.7rem;height:2.7rem}
.brand-tag{margin-right:auto;margin-left:1.1rem;padding-left:1.1rem;border-left:2px solid var(--line);font-size:.78rem;line-height:1.35;color:var(--muted);max-width:14rem}
.mast-in{justify-content:flex-start}.menu-btn{margin-left:auto}
@media (max-width:1000px){.brand-tag{display:none}}

/* logo v4: AIED letter ligature */
.brand .lg.mono{width:auto;height:2.7rem;aspect-ratio:128/62;display:block}
.lg-s{fill:none;stroke:var(--news);stroke-width:6.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0;animation:lgdraw 1.1s cubic-bezier(.5,0,.2,1) both}
@keyframes lgdraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.lg-sp{fill:#f0b545;transform-box:fill-box;transform-origin:center;animation:lgsp 2.6s ease-in-out infinite}
.lg-nd{fill:#f0b545}
.ft .lg-s{stroke:#9be3c3}
.brand:hover .lg.mono{transform:none}.brand:hover .lg-s{stroke:var(--hot)}.ft .brand:hover .lg-s{stroke:#fff}
@media (prefers-reduced-motion:reduce){.lg-s{animation:none}}
@media (max-width:880px){.brand .lg.mono{height:2.3rem}}

/* logo v5: letters carry icons (cap, pencil, circuit, AI spark) */
.brand .lg.mono{height:3.1rem;aspect-ratio:148/72}
.lg-s{stroke-width:7}.lg-t{fill:none;stroke:#f0b545;stroke-width:1.8;stroke-linecap:round}
.lg-y{fill:#f0b545}.lg-y2{fill:#d99a21}.lg-f{fill:var(--news)}.lg-d{fill:var(--ink)}
.lg-y{transform-box:fill-box;transform-origin:center}
.ft .lg-f{fill:#9be3c3}.ft .lg-d{fill:#cfe3d9}
@media (max-width:880px){.brand .lg.mono{height:2.6rem}}

/* logo v6: simple ligature wordmark (A+I and E+D fused), one colour */
.brand .lg.mono{height:2.6rem;aspect-ratio:130/64;color:var(--news);display:block}
.lg-k{fill:none;stroke:currentColor;stroke-width:7;stroke-linejoin:miter;stroke-miterlimit:10;stroke-linecap:butt;stroke-dasharray:none;animation:none}
.ft .brand .lg.mono{color:#9be3c3}
.brand:hover .lg.mono{color:var(--hot)}.ft .brand:hover .lg.mono{color:#fff}
@media (max-width:880px){.brand .lg.mono{height:2.2rem}}

/* logo v7: stacked AI/ED badge + one-line AIED wordmark */
.brand .lg.tile{width:2.9rem;height:2.9rem;aspect-ratio:1;flex:none;display:block;color:inherit;filter:drop-shadow(0 3px 8px rgba(15,58,43,.3))}
.brand:hover .lg.tile{transform:rotate(-4deg) scale(1.05);transition:transform .25s}
.brand .brand-txt{font:800 2rem/1 var(--f-display);letter-spacing:-.03em;display:inline-block;white-space:nowrap}
.ft .brand .lg.tile{filter:none}
@media (max-width:880px){.brand .lg.tile{width:2.5rem;height:2.5rem}.brand .brand-txt{font-size:1.7rem}}

/* logo v8: tight one-line AIED wordmark, A+I and E+D fused */
.brand .lg.word{height:2.5rem;aspect-ratio:118/64;display:block;filter:none}
.brand:hover .lg.word{transform:none}
.lg-k{fill:none;stroke:currentColor;stroke-width:7;stroke-linejoin:miter;stroke-miterlimit:10;stroke-linecap:butt}
.lg-ai{color:var(--ink)}.lg-ed{color:var(--news)}
.ft .lg-ai{color:#fff}.ft .lg-ed{color:#9be3c3}
.brand:hover .lg-ed{color:var(--hot)}.ft .brand:hover .lg-ed{color:#fff}
@media (max-width:880px){.brand .lg.word{height:2.1rem}}
