/* Khabar Express premium static theme for The Hindi Pioneer */

:root{
  --kx-red:#a91d1d;
  --kx-navy:#8f1f1f;
  --kx-navy-deep:#6a1313;
  --kx-mustard:#f0a202;
  --kx-cream:#fbfaf7;
  --kx-ink:#1c1a16;
  --kx-serif:'Noto Serif Devanagari', serif;
  --kx-sans:'Noto Sans Devanagari', sans-serif;
}

*{ margin:0; padding:0; box-sizing:border-box; }
.sr-only{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--kx-sans);
  color:var(--kx-ink);
  background:var(--kx-cream);
  min-height:100%;
  line-height:1.65;
  font-size:15.5px;
}
img{ max-width:100%; display:block; }
a{ text-decoration:none; color:inherit; }
button{ font-family:var(--kx-sans); cursor:pointer; }
::selection{ background:var(--kx-mustard); color:#241a05; }

/* ============ TOPBAR ============ */
.kx-topbar{ background:var(--kx-navy-deep); color:rgba(255,255,255,0.6); font-size:12.5px; }
.kx-topbar .inner{ max-width:1180px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; padding:8px 24px; }
.kx-topbar .social{ display:flex; gap:14px; align-items:center; }
.kx-topbar .social a{ color:rgba(255,255,255,0.75); font-size:13px; transition:color .2s; }
.kx-topbar .social a:hover{ color:#fff; }
.kx-topbar .social .sicon{ display:inline-flex; align-items:center; justify-content:center; width:24px; height:22px; border-radius:4px; }
.kx-topbar .social .sicon svg{ display:block; }
.kx-topbar .social .sicon:hover{ color:var(--kx-mustard); background:rgba(255,255,255,0.06); }
.kx-topbar .epaper-link{ display:flex; align-items:center; gap:7px; color:rgba(255,255,255,0.8); font-weight:600; }
.kx-topbar .epaper-link:hover{ color:var(--kx-mustard); }
.kx-topbar .sep{ width:1px; height:12px; background:rgba(255,255,255,0.2); }

/* ============ HEADER ============ */
.kx-header{ background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.05); }
.kx-header .inner{ max-width:1180px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; padding:20px 24px; gap:16px; }
.kx-logo img{ height:50px; width:auto; display:block; background:#fff; padding:8px 16px; border-radius:10px; }
.kx-logo .tagline{ font-family:var(--kx-sans); font-size:13px; color:#8a8374; margin-top:7px; letter-spacing:0.03em; }
.kx-header-right{ display:flex; align-items:center; gap:12px; }
.kx-searchbox{ display:flex; align-items:center; gap:8px; background:#fff; border:1px solid #e0d5ba; border-radius:24px; padding:9px 18px; color:#9a9284; font-size:14px; min-width:240px; }
.kx-searchbox input{ background:none; border:none; color:var(--kx-ink); outline:none; font-family:var(--kx-sans); font-size:14px; width:100%; }
.kx-searchbox input::placeholder{ color:#b3a98f; }
.kx-subscribe{ background:var(--kx-mustard); color:#241a05; border:none; border-radius:24px; padding:10px 22px; font-weight:700; font-size:14px; white-space:nowrap; transition:transform .15s ease, box-shadow .2s; }
.kx-subscribe:hover{ transform:translateY(-1px); box-shadow:0 8px 20px rgba(240,162,2,.35); }
.kx-hamburger{ display:none; align-items:center; justify-content:center; background:#f6f2e8; border:none; border-radius:3px; width:38px; height:38px; cursor:pointer; color:var(--kx-ink); font-size:19px; }

/* ============ NAV ============ */
.kx-nav{ max-width:1180px; margin:0 auto; display:flex; align-items:center; gap:12px 14px; flex-wrap:wrap; padding:13px 24px; font-weight:600; font-size:14px; border-top:1px solid #f0ead8; }
.kx-nav a{ color:var(--kx-ink); padding:4px 0; position:relative; opacity:.85; transition:opacity .2s; white-space:nowrap; }
.kx-nav a:hover{ opacity:1; }
.kx-nav a.active{ opacity:1; }
.kx-nav a.active::after, .kx-nav a:hover::after{ content:''; position:absolute; left:0; right:0; bottom:-9px; height:3px; background:var(--kx-mustard); border-radius:2px; }
.kx-drop{ position:relative; }
.kx-drop .note{ font-size:11px; font-weight:500; color:#a49a85; margin-left:3px; }
.kx-drop .arr{ font-size:10px; color:#8f8571; margin-left:3px; }
.kx-drop-panel{ position:absolute; top:calc(100% + 12px); left:0; display:grid; gap:2px 16px; background:#fff; border:1px solid #f0ead8; border-top:3px solid var(--kx-red); border-radius:8px; box-shadow:0 18px 44px rgba(0,0,0,.16); padding:16px; z-index:80; opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .18s, transform .18s, visibility .18s; max-height:340px; overflow:auto; }
.kx-drop:hover .kx-drop-panel, .kx-drop:focus-within .kx-drop-panel{ opacity:1; visibility:visible; transform:translateY(0); }
.kx-drop-panel.up{ width:680px; grid-template-columns:repeat(4,1fr); }
.kx-drop-panel.uk{ width:460px; grid-template-columns:repeat(3,1fr); }
.kx-drop-panel.ncr{ width:280px; grid-template-columns:1fr; }
.kx-drop-panel.ep{ width:230px; grid-template-columns:1fr; }
.kx-drop-panel a{ padding:7px 9px; border-radius:5px; font-size:13.5px; font-weight:500; opacity:1; }
.kx-drop-panel a::after{ content:none; }
.kx-drop-panel a:hover{ background:#f6f2e8; color:var(--kx-red); }
.kx-drop-panel a.on{ color:var(--kx-red); font-weight:700; background:#fdf6ea; }
.kx-nav .kx-all{ margin-left:auto; background:var(--kx-navy); color:#fff !important; padding:6px 16px; border-radius:20px; font-size:13px; }
.kx-nav a.kx-all::after{ content:none; }
.kx-nav .kx-all:hover{ background:var(--kx-navy-deep); }
.kx-nav .admin-link{ margin-left:auto; background:#f6f2e8; border:1px solid #e0d5ba; border-radius:4px; padding:6px 14px; font-size:13px; display:flex; align-items:center; gap:6px; }
.kx-nav .admin-link::after{ content:none; }
.kx-mobile-menu{ background:#fff; padding:6px 8px 14px; display:none; }
.kx-mobile-menu a{ display:block; width:100%; text-align:left; border-bottom:1px solid #f0ead8; color:var(--kx-ink); padding:12px 14px; font-size:15px; }
@media (max-width:900px){
  .kx-nav{ flex-wrap:nowrap; overflow-x:auto; gap:14px; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .kx-nav::-webkit-scrollbar{ display:none; }
  .kx-drop-panel{ display:none; }
  .kx-nav .kx-all{ margin-left:0; }
  .kx-hamburger{ display:none; }
  .kx-searchbox{ display:none; }
  .kx-mobile-menu{ display:none; }
}

/* ============ TICKER ============ */
.kx-ticker{ background:var(--kx-red); color:#fff; display:flex; align-items:stretch; overflow:hidden; }
.kx-ticker .label{ background:var(--kx-navy-deep); padding:10px 18px; display:flex; align-items:center; gap:8px; font-weight:700; font-size:13.5px; flex-shrink:0; white-space:nowrap; letter-spacing:.02em; }
.kx-live-dot{ width:7px; height:7px; border-radius:50%; background:#fff; display:inline-block; animation:kx-pulse 1.6s ease-in-out infinite; }
@keyframes kx-pulse{ 0%,100%{ opacity:1; } 50%{ opacity:0.35; } }
.kx-ticker .viewport{ overflow:hidden; white-space:nowrap; flex:1; position:relative; }
.kx-ticker .track{ display:inline-block; white-space:nowrap; padding:9px 0; font-size:14.5px; padding-left:100%; animation:kx-scroll 42s linear infinite; }
@keyframes kx-scroll{ from{ transform:translateX(0);} to{ transform:translateX(-100%);} }
.kx-ticker .track a{ color:#fff; margin-right:52px; }
.kx-ticker .track a:hover{ text-decoration:underline; text-underline-offset:3px; }
@media (prefers-reduced-motion:reduce){ .kx-ticker .track{ animation:none; padding-left:0; } .kx-live-dot{ animation:none; } }

/* ============ HERO SLIDER ============ */
.kx-slider{ position:relative; aspect-ratio:21/9; border-radius:16px; overflow:hidden; box-shadow:0 20px 46px rgba(106,19,19,0.18); margin-bottom:38px; background:var(--kx-navy-deep); }
.kx-slides{ position:absolute; inset:0; }
.kx-slide{ position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .7s ease; color:#fff; display:block; }
.kx-slide.on{ opacity:1; visibility:visible; z-index:1; }
.kx-slide .simg{ width:100%; height:100%; object-fit:cover; display:block; }
.kx-slide .sovl{ position:absolute; inset:auto 0 0 0; background:linear-gradient(to top, rgba(48,9,9,.95) 0%, rgba(48,9,9,.4) 60%, transparent 100%); padding:30px 36px; }
.kx-slide .stitle{ font-family:var(--kx-serif); font-weight:900; font-size:32px; line-height:1.22; margin:12px 0 8px; color:#fff; }
.kx-slide:hover .stitle{ text-decoration:underline; text-decoration-color:var(--kx-mustard); text-underline-offset:5px; }
.kx-slide .ssum{ font-size:15.5px; line-height:1.6; color:rgba(255,255,255,.85); max-width:740px; }
.kx-slide .smeta{ display:flex; align-items:center; gap:8px; margin-top:12px; font-size:12.5px; color:rgba(255,255,255,.7); }
.snav{ position:absolute; top:50%; transform:translateY(-50%); z-index:5; width:42px; height:42px; border-radius:50%; border:none; background:rgba(48,9,9,.55); color:#fff; font-size:16px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s, opacity .2s; opacity:0; }
.kx-slider:hover .snav{ opacity:1; }
.snav:hover{ background:var(--kx-red); }
.snav.prev{ left:18px; }
.snav.next{ right:18px; }
.sdots{ position:absolute; bottom:16px; left:50%; transform:translateX(-50%); z-index:5; display:flex; gap:8px; }
.sdot{ width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.45); cursor:pointer; transition:background .2s, transform .2s; }
.sdot.on{ background:var(--kx-mustard); transform:scale(1.3); }

/* ============ HOME LAYOUT ============ */
.kx-home-wrap{ max-width:1360px; width:100%; margin:0 auto; padding:30px 24px 70px; }
.kx-home{ display:grid; grid-template-columns:280px minmax(0,1fr) 300px; gap:36px; align-items:start; }
.kx-home-main{ min-width:0; }
.kx-panel{ display:flex; flex-direction:column; gap:26px; position:sticky; top:24px; }
.kx-epromo{ background:var(--kx-navy); }
.kx-epromo a{ display:flex; align-items:center; justify-content:center; }
.kx-epromo img{ height:64px; width:auto; background:#fff; padding:8px 14px; border-radius:8px; }

/* ============ HOME BLOCK VARIANTS ============ */
.kx-block-kicker{ display:grid; grid-template-columns:1.5fr 1fr; gap:32px; }
.kx-block-kicker .kx-feature-main .f-title{ font-size:23px; }
.kx-block-kicker .kx-feature-main .f-sum{ font-size:13.5px; }
.kx-block-aside{ border-left:1px solid #e7e1d3; padding-left:26px; display:flex; flex-direction:column; }
.kx-block-split{ display:grid; grid-template-columns:1fr 1.15fr; gap:32px; align-items:stretch; }
.kx-block-side{ display:flex; flex-direction:column; }
.kx-split-item{ display:flex; align-items:flex-start; gap:14px; padding:11px 0; border-bottom:1px solid #ece7d9; }
.kx-split-item:first-child{ padding-top:0; }
.kx-split-item:last-child{ padding-bottom:0; border-bottom:none; }
.kx-split-item .thumb{ flex:0 0 118px; height:74px; border-radius:10px; overflow:hidden; background:#f0ecdf; }
.kx-split-item .thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.kx-split-item .body{ display:flex; flex-direction:column; }
.kx-split-item .t{ font-family:var(--kx-serif); font-weight:700; font-size:15.5px; line-height:1.42; color:var(--kx-ink); transition:color .2s; }
.kx-split-item:hover .t{ color:var(--kx-red); }
.kx-split-item .d{ font-size:11.5px; color:#b3a98f; margin-top:5px; }
.kx-mini{ padding:12px 0; border-bottom:1px solid #ece7d9; display:block; }
.kx-mini:last-child{ border-bottom:none; }
.kx-mini .t{ display:block; font-family:var(--kx-serif); font-weight:700; font-size:15.5px; line-height:1.45; color:var(--kx-ink); transition:color .2s; }
.kx-mini:hover .t{ color:var(--kx-red); }
.kx-mini .d{ display:block; font-size:11.5px; color:#b3a98f; margin-top:4px; }
.kx-block-rows{ background:#fff; border:1px solid #ece7d9; border-radius:14px; padding:4px 22px; }
.kx-block-rows .kx-listitem{ padding:18px 0; }
.kx-block-rows .kx-listitem .li-img{ width:250px; }
.kx-block-mini{ background:#fff; border:1px solid #ece7d9; border-radius:14px; padding:4px 20px; }
.kx-block-duo{ display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.kx-block-duo .kx-card.tall .body .ktitle{ font-size:22px; }

/* ============ CONTAINER ============ */
.kx-container{ max-width:1180px; margin:0 auto; padding:32px 24px 70px; }

/* ============ TAGS ============ */
.kx-tag{ display:inline-block; font-size:12px; padding:4px 11px; border-radius:3px; font-weight:700; letter-spacing:0.02em; }
.kx-tag.red{ background:var(--kx-red); color:#fff; }
.kx-tag.navy{ background:var(--kx-navy); color:#fff; }
.kx-tag.mustard{ background:var(--kx-mustard); color:#241a05; }

/* ============ HOME FEATURE HERO ============ */
.kx-feature{ display:grid; grid-template-columns:2fr 1fr; gap:34px; margin-bottom:46px; align-items:stretch; }
.kx-feature-main{ position:relative; border-radius:16px; overflow:hidden; box-shadow:0 20px 46px rgba(106,19,19,0.18); display:block; background:var(--kx-navy-deep); }
.kx-feature-main .img{ width:100%; aspect-ratio:16/9; object-fit:cover; display:block; transition:transform .5s ease; }
.kx-feature-main:hover .img{ transform:scale(1.035); }
.kx-feature-main .ovl{ position:absolute; inset:auto 0 0 0; background:linear-gradient(to top, rgba(48,9,9,.94) 0%, rgba(48,9,9,.38) 58%, transparent 100%); padding:26px 30px 26px; color:#fff; }
.kx-feature-main .f-title{ font-family:var(--kx-serif); font-weight:900; font-size:33px; line-height:1.22; margin:13px 0 10px; color:#fff; transition:color .2s; }
.kx-feature-main:hover .f-title{ text-decoration:underline; text-decoration-color:var(--kx-mustard); text-underline-offset:6px; }
.kx-feature-main .f-sum{ font-size:15.5px; line-height:1.58; color:rgba(255,255,255,.85); max-width:660px; }
.kx-feature-main .f-meta{ display:flex; align-items:center; gap:8px; margin-top:13px; font-size:12.5px; color:rgba(255,255,255,.7); }

.kx-feature-side{ border-left:1px solid #e7e1d3; padding-left:28px; display:flex; flex-direction:column; }
.kx-feature-side .head{ display:flex; align-items:center; gap:9px; font-family:var(--kx-serif); font-weight:800; font-size:18px; color:var(--kx-navy); border-bottom:2px solid var(--kx-navy); padding-bottom:11px; margin-bottom:4px; }
.kx-update{ border-bottom:1px dashed #e3dccb; padding:13px 0; }
.kx-update:last-child{ border-bottom:none; }
.kx-update .btitle{ font-family:var(--kx-serif); font-weight:700; font-size:16px; line-height:1.4; margin-top:7px; transition:color .2s; }
.kx-update:hover .btitle{ color:var(--kx-red); }
.kx-update .view-all-btn{ margin-top:14px; }

/* ============ SECTION HEAD ============ */
.kx-section-head{ display:flex; align-items:center; gap:13px; margin:0 0 24px; }
.kx-section-head .bar{ width:6px; height:32px; background:var(--kx-red); border-radius:4px; flex-shrink:0; }
.kx-section-head .kx-section-title{ font-family:var(--kx-serif); font-size:24px; font-weight:800; color:var(--kx-navy); letter-spacing:.01em; }
.kx-section-link{ margin-left:auto; font-size:14px; font-weight:700; color:var(--kx-red); display:inline-flex; align-items:center; gap:5px; transition:gap .2s; }
.kx-section-link:hover{ gap:9px; }

/* ============ CARDS ============ */
.kx-card{ display:block; border:none; cursor:pointer; text-align:left; width:100%; background:none; }
.kx-card:hover .img{ box-shadow:0 14px 30px rgba(106,19,19,0.18); }
.kx-card:hover .ktitle{ color:var(--kx-red); }
.kx-card .img{ overflow:hidden; width:100%; aspect-ratio:16/9; object-fit:cover; object-position:center; display:block; background:#eee; border-radius:12px; transition:box-shadow .25s ease, transform .35s ease; }
.kx-card:hover .img{ transform:translateY(-3px); }
.kx-card .ph{ width:100%; aspect-ratio:16/9; display:flex; flex-direction:column; align-items:center; justify-content:center; color:rgba(255,255,255,0.85); position:relative; overflow:hidden; border-radius:12px; }
.kx-card .ph .ic{ position:relative; font-size:30px; }
.kx-card .ph .cat{ position:relative; margin-top:9px; font-size:12px; letter-spacing:0.04em; color:rgba(255,255,255,0.75); }
.kx-card .body{ padding:12px 2px 2px; }
.kx-card .body .tag{ margin-bottom:8px; }
.kx-card .body .ktitle{ font-family:var(--kx-serif); font-weight:700; font-size:18.5px; line-height:1.34; color:var(--kx-ink); transition:color .2s; }
.kx-card .body .sum{ font-size:14.5px; color:#5a5344; margin-top:9px; line-height:1.62; }
.kx-card .body .meta{ font-size:12.5px; color:#9a9284; margin-top:10px; display:flex; align-items:center; gap:5px; }
.kx-card.tall .img, .kx-card.tall .ph{ aspect-ratio:16/9; }
.kx-card.tall .body .ktitle{ font-size:26px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

.kx-grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.kx-more-bottom{ display:flex; justify-content:center; margin-top:10px; }
.kx-more-bottom a{ display:inline-block; background:var(--kx-navy); color:#fff; font-weight:700; font-size:15.5px; padding:15px 44px; border-radius:44px; transition:background .2s, transform .2s; }
.kx-more-bottom a:hover{ background:var(--kx-red); transform:translateY(-2px); }
.kx-grid-lead{ display:grid; grid-template-columns:1.5fr 1fr; gap:36px; margin-bottom:40px; }

/* ============ CITY BLOCKS ============ */
.kx-cityblock{ display:flex; flex-direction:column; gap:6px; }
.kx-cityblock .city-title{ display:flex; align-items:center; gap:8px; font-family:var(--kx-serif); font-weight:800; font-size:18px; color:var(--kx-navy); margin-bottom:10px; padding-bottom:10px; border-bottom:2px solid var(--kx-mustard); }
.kx-cityblock .city-title::before{ content:''; width:9px; height:9px; border-radius:50%; background:var(--kx-red); }
.kx-cityitem{ border-bottom:1px solid #ece7d9; padding:11px 0; }
.kx-cityitem:last-child{ border-bottom:none; }
.kx-cityitem .btitle{ font-family:var(--kx-serif); font-weight:700; font-size:15px; line-height:1.42; transition:color .2s; }
.kx-cityitem:hover .btitle{ color:var(--kx-red); }
.kx-empty{ font-size:14px; color:#9a9284; }

/* ============ PAGES (latest/category/article) ============ */
.kx-page{ max-width:1360px; width:100%; margin:0 auto; padding:30px 24px 70px; }
.kx-page-wide{ max-width:1360px; width:100%; margin:0 auto; padding:30px 24px 70px; }
.kx-page > h1{ font-family:var(--kx-serif); font-weight:900; font-size:32px; margin-bottom:24px; color:var(--kx-ink); }
.kx-list{ display:flex; flex-direction:column; gap:26px; }
.kx-list > div{ border-bottom:1px solid #ece7d9; padding-bottom:24px; }

/* ============ CATEGORY BANNER + LIST ============ */
.kx-cat-wrap{ max-width:1360px; width:100%; margin:0 auto; padding:0 24px 120px; }
.kx-cat-banner{ position:relative; border-radius:18px; overflow:hidden; background:linear-gradient(120deg, #a32020 0%, #6a1313 60%, #490a0a 100%); padding:44px 40px; margin:30px 0 36px; color:#fff; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; box-shadow:0 18px 40px rgba(106,19,19,.2); }
.kx-cat-banner::before{ content:''; position:absolute; top:-60px; right:-40px; width:240px; height:240px; border-radius:50%; background:radial-gradient(circle, rgba(240,162,2,.25), transparent 70%); }
.kx-cat-banner::after{ content:''; position:absolute; bottom:-80px; left:30%; width:220px; height:220px; border-radius:50%; background:radial-gradient(circle, rgba(255,255,255,.06), transparent 70%); }
.kx-cat-banner>div{ position:relative; z-index:1; display:flex; align-items:center; gap:16px; min-width:0; flex-wrap:wrap; }
.kx-cat-banner h1{ font-family:var(--kx-serif); font-weight:900; font-size:40px; margin:0; position:relative; z-index:1; white-space:nowrap; }
.kx-cat-banner .sub{ color:rgba(255,255,255,.72); font-size:15px; margin-top:8px; position:relative; z-index:1; }
.kx-cat-banner .count{ background:var(--kx-mustard); color:#241a05; font-weight:800; font-size:14.5px; padding:9px 22px; border-radius:40px; position:relative; z-index:1; white-space:nowrap; flex-shrink:0; }

.kx-cat-layout{ display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:44px; align-items:start; }
.kx-cat-main{ min-width:0; }
.kx-cat-chips{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.kx-cat-chip{ background:#fff; border:1px solid #ece7d9; border-radius:12px; padding:14px 16px; display:flex; flex-direction:column; gap:4px; transition:box-shadow .2s, transform .2s, border-color .2s; }
.kx-cat-chip:hover{ box-shadow:0 10px 22px rgba(106,19,19,.12); transform:translateY(-2px); border-color:#e0d5ba; }
.kx-cat-chip .n{ font-family:var(--kx-serif); font-weight:800; font-size:15px; color:var(--kx-ink); }
.kx-cat-chip:hover .n{ color:var(--kx-red); }
.kx-cat-chip .c{ font-size:12px; color:#b3a98f; }

/* ============ PAGER ============ */
.kx-pager{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px; margin:34px 0 10px; }
.kx-pager .pg{ min-width:40px; height:40px; padding:0 14px; display:inline-flex; align-items:center; justify-content:center; border:1px solid #e0d5ba; border-radius:9px; background:#fff; font-weight:700; font-size:14px; color:var(--kx-ink); transition:background .15s, color .15s, border-color .15s; }
.kx-pager .pg:hover{ background:var(--kx-red); color:#fff; border-color:var(--kx-red); }
.kx-pager .pg.on{ background:var(--kx-red); color:#fff; border-color:var(--kx-red); }
.kx-pager .pg.prev, .kx-pager .pg.next{ color:var(--kx-red); }
.kx-pager .pg.prev:hover, .kx-pager .pg.next:hover{ color:#fff; }
.kx-pager .pgdots{ display:inline-flex; align-items:center; font-size:14px; color:#b3a98f; padding:0 4px; }

.kx-listitem{ display:flex; gap:18px; padding:16px 0; border-bottom:1px solid #ece7d9; align-items:flex-start; }
.kx-listitem:first-child{ padding-top:8px; }
.kx-listitem .li-img{ width:128px; flex-shrink:0; display:block; overflow:hidden; border-radius:10px; }
.kx-listitem .li-img img{ width:100%; aspect-ratio:3/2; object-fit:cover; transition:transform .4s ease; display:block; }
.kx-listitem:hover .li-img img{ transform:scale(1.04); }
.kx-listitem:hover .li-img{ box-shadow:0 8px 20px rgba(106,19,19,.14); }
.kx-listitem .li-title{ display:block; font-family:var(--kx-serif); font-weight:800; font-size:17px; line-height:1.38; margin:2px 0 6px; color:var(--kx-ink); transition:color .2s; }
.kx-listitem .li-title:hover{ color:var(--kx-red); text-decoration:underline; text-decoration-color:var(--kx-mustard); text-underline-offset:4px; }
.kx-listitem .li-sum{ font-size:13.5px; color:#5a5344; line-height:1.6; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.kx-listitem .li-meta{ margin-top:8px; font-size:12px; color:#9a9284; display:flex; align-items:center; gap:6px; }
@media (max-width:760px){
  .kx-listitem{ gap:14px; padding:14px 0; }
  .kx-listitem .li-img{ width:110px; }
  .kx-listitem .li-title{ font-size:15.5px; }
  .kx-listitem .li-sum{ font-size:12.5px; -webkit-line-clamp:2; }
}

/* ============ ARTICLE ============ */
.kx-breadcrumb{ font-size:13px; color:#9a9284; margin-bottom:16px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.kx-breadcrumb a{ color:var(--kx-navy); font-weight:600; }
.kx-breadcrumb a:hover{ color:var(--kx-red); text-decoration:underline; }
.kx-breadcrumb .arr{ color:#cfc7b3; }
.kx-article-wrap{ max-width:1360px; width:100%; margin:0 auto; padding:30px 24px 70px; }
.kx-article-main{ min-width:0; }
.kx-article{ max-width:none; margin:0; padding:0; }
.kx-article h1{ font-family:var(--kx-serif); font-weight:900; font-size:40px; line-height:1.2; margin:15px 0 10px; color:var(--kx-ink); }
.kx-article .meta{ font-size:14.5px; color:#9a9284; margin-bottom:24px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.kx-article .hero{ width:100%; max-width:760px; height:auto; display:block; margin:0 auto; background:#eee; border-radius:16px; box-shadow:0 18px 40px rgba(106,19,19,0.14); }
.kx-article .kx-hero{ max-width:760px; margin:0 auto; }
.kx-article .kx-hero .hero{ max-width:100%; }
.kx-article .kx-hero figcaption{ font-family:var(--kx-sans); font-size:15px; line-height:1.55; color:#8a8374; text-align:center; padding:12px 10px 0; }
.kx-article .content{ font-family:var(--kx-sans); font-size:20px; line-height:1.9; color:#2b2820; margin-top:26px; }
.kx-article .content p{ margin-bottom:20px; }
.kx-article .content p:first-child::first-letter{ }
.kx-article .content h2{ font-family:var(--kx-serif); font-weight:800; font-size:27px; margin:26px 0 12px; color:var(--kx-navy); }
.kx-article .content h3{ font-family:var(--kx-serif); font-weight:700; font-size:23px; margin:22px 0 10px; color:var(--kx-ink); }
.kx-article .content img{ max-width:760px; height:auto; margin:18px auto; display:block; border-radius:12px; }
.kx-article .content ul,.kx-article .content ol{ margin:12px 0 20px 24px; }
.kx-article .content strong{ color:var(--kx-ink); }
.kx-share{ display:flex; align-items:center; gap:12px; margin-top:32px; padding-top:22px; border-top:1px solid #ece7d9; font-size:15px; color:#5a5344; flex-wrap:wrap; font-weight:600; }
.kx-share a{ width:42px; height:42px; border-radius:50%; background:var(--kx-navy); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:16px; transition:transform .15s ease; }
.kx-share a:hover{ transform:translateY(-3px); }
.kx-share a.whatsapp{ background:#25D366; }
.kx-related{ margin-top:36px; padding-top:32px; border-top:1px solid #ece7d9; }

/* ============ SIDEBAR ============ */
.kx-aside{ display:flex; flex-direction:column; gap:26px; position:sticky; top:24px; }
.kx-side-widget{ background:#fff; border:1px solid #ece7d9; border-radius:14px; padding:20px; box-shadow:0 6px 18px rgba(106,19,19,.05); }
.kx-side-widget .head{ display:flex; align-items:center; gap:8px; font-family:var(--kx-serif); font-weight:800; font-size:16.5px; color:var(--kx-navy); border-bottom:2px solid var(--kx-navy); padding-bottom:9px; margin-bottom:8px; }
.kx-side-widget .head::before{ content:''; width:7px; height:18px; background:var(--kx-red); border-radius:3px; flex-shrink:0; }
.kx-side-item{ display:block; padding:10px 0; border-bottom:1px solid #f1ecdf; }
.kx-side-item:last-child{ border-bottom:none; }
.kx-side-item .t{ display:block; font-family:var(--kx-serif); font-weight:700; font-size:14.5px; line-height:1.45; color:var(--kx-ink); transition:color .2s; }
.kx-side-item:hover .t{ color:var(--kx-red); }
.kx-side-item .d{ display:block; font-size:11.5px; color:#b3a98f; margin-top:3px; }
.kx-side-cats{ display:flex; flex-direction:column; gap:2px; }
.kx-side-cat{ display:flex; align-items:center; justify-content:space-between; padding:9px 10px; border-radius:8px; font-size:14px; font-weight:600; color:var(--kx-ink); transition:background .15s, color .15s; }
.kx-side-cat:hover{ background:#f6f2e8; color:var(--kx-red); }
.kx-side-cat.on{ background:var(--kx-navy); color:#fff; }
.kx-side-cat span{ color:#b3a98f; font-size:12px; }
.kx-side-cat.on span{ color:rgba(255,255,255,.6); }
.kx-side-ad{ border:1px dashed #d8cfba; border-radius:10px; height:210px; display:flex; align-items:center; justify-content:center; color:#b3a98f; font-size:12px; letter-spacing:.12em; background:repeating-linear-gradient(45deg,#faf8f2,#faf8f2 12px,#f4f0e4 12px,#f4f0e4 24px); }
.kx-back-top{ position:fixed; right:24px; bottom:24px; width:46px; height:46px; border-radius:50%; background:var(--kx-red); color:#fff; border:none; cursor:pointer; font-size:20px; display:none; align-items:center; justify-content:center; box-shadow:0 6px 18px rgba(169,29,29,.4); z-index:50; }
.kx-back-top.show{ display:flex; }
.kx-back-top:hover{ background:var(--kx-navy); }

/* ============ EPAPER ============ */
.kx-tabs{ display:flex; gap:6px; margin-bottom:28px; border-bottom:2px solid var(--kx-navy); }
.kx-tabs .tab{ padding:10px 22px; background:transparent; color:var(--kx-ink); border:none; cursor:pointer; font-weight:700; font-size:15px; border-bottom:2px solid transparent; margin-bottom:-2px; }
.kx-tabs .tab.active{ background:var(--kx-navy); color:#fff; }

/* ============ INFO / SEARCH ============ */
.kx-info h1{ font-family:var(--kx-serif); font-weight:900; font-size:30px; margin-bottom:18px; color:var(--kx-ink); }
.kx-info h2{ font-family:var(--kx-serif); font-size:21px; margin:20px 0 10px; color:var(--kx-navy); }
.kx-info p{ margin-bottom:14px; color:#2b2820; font-size:16px; }
.kx-contact{ max-width:1040px; }
.kx-contact > h1{ font-family:var(--kx-serif); font-weight:900; font-size:30px; margin-bottom:10px; color:var(--kx-ink); }
.kx-contact-intro{ font-size:16px; color:#4a4436; max-width:640px; margin-bottom:28px; line-height:1.7; }
.kx-contact-grid{ display:grid; grid-template-columns:1.15fr 1fr; gap:36px; align-items:start; }
.kx-contact-info .cx{ display:flex; gap:14px; align-items:flex-start; margin-bottom:20px; }
.kx-contact-info .cx .ic{ width:46px; height:46px; flex-shrink:0; border-radius:12px; background:var(--kx-red); color:#fff !important; display:inline-flex; align-items:center; justify-content:center; font-size:20px; font-weight:700; }
.kx-contact-info .cx b{ display:block; font-size:14px; color:var(--kx-ink-soft); margin-bottom:2px; }
.kx-contact-info .cx a{ font-family:var(--kx-serif); font-size:16.5px; font-weight:700; color:var(--kx-ink); }
.kx-contact-info .cx a:hover{ color:var(--kx-red); }
.kx-contact-info .cx p{ margin:0; font-size:15px; color:#33302a; }
.kx-contact-info .cx p.editor-name{ font-family:var(--kx-serif); font-weight:700; font-size:16.5px; color:var(--kx-navy); line-height:1.5; }
.kx-contact-info .cx p.editor-name span{ font-size:13px; color:var(--kx-red); font-weight:600; display:block; }
.kx-contact-form{ background:#fff; border:1px solid #e6e0ce; border-top:3px solid var(--kx-red); border-radius:12px; padding:22px; margin-top:26px; box-shadow:0 10px 28px rgba(106,19,19,.06); }
.kx-contact-form h3{ font-family:var(--kx-serif); font-weight:800; font-size:18px; margin:0 0 14px; color:var(--kx-navy); }
.kx-contact-form input,.kx-contact-form textarea{ width:100%; box-sizing:border-box; border:1px solid #dbd3be; border-radius:8px; padding:11px 13px; margin-bottom:12px; font-family:var(--kx-sans); font-size:14.5px; color:var(--kx-ink); background:#fcfbf7; }
.kx-contact-form input:focus,.kx-contact-form textarea:focus{ outline:none; border-color:var(--kx-red); background:#fff; }
.kx-contact-form textarea{ resize:vertical; }
.kx-btn{ background:var(--kx-red); color:#fff; border:none; border-radius:8px; padding:11px 22px; font-weight:700; font-size:15px; cursor:pointer; width:100%; }
.kx-btn:hover{ background:var(--kx-navy-deep); }
.kx-contact-photo{ border-radius:16px; overflow:hidden; box-shadow:0 18px 44px rgba(0,0,0,.16); position:sticky; top:90px; }
.kx-contact-photo img{ display:block; width:100%; height:100%; object-fit:cover; }
.kx-contact-caption{ background:var(--kx-red); color:#fff; text-align:center; padding:16px 14px; font-family:var(--kx-serif); }
.kx-contact-caption .kx-cc-label{ display:block; font-weight:600; font-size:13.5px; opacity:.9; letter-spacing:.6px; text-transform:uppercase; }
.kx-contact-caption .kx-cc-name{ display:block; font-weight:900; font-size:28px; line-height:1.25; margin-top:3px; color:#fff; }
.kx-policy{ max-width:820px; }
.kx-policy > h1{ font-family:var(--kx-serif); font-weight:900; font-size:30px; color:var(--kx-ink); margin-bottom:6px; }
.kx-policy-date{ font-size:13px; color:var(--kx-ink-soft); margin-bottom:18px; border-bottom:2px solid var(--kx-red); display:inline-block; padding-bottom:6px; }
.kx-policy-lead{ font-size:16.5px; color:#3a362c; margin-bottom:26px; line-height:1.75; background:#fff; border-left:4px solid var(--kx-red); border-radius:6px; padding:14px 18px; box-shadow:0 6px 18px rgba(106,19,19,.05); }
.kx-psec{ margin-bottom:22px; }
.kx-psec h2{ font-family:var(--kx-serif); font-weight:800; font-size:20px; color:var(--kx-navy); margin:0 0 8px; display:flex; align-items:baseline; gap:10px; }
.kx-psec h2:before{ content:"•"; color:var(--kx-red); font-size:24px; }
.kx-psec p{ margin:0 0 9px; color:#2b2820; font-size:15.5px; line-height:1.8; padding-left:24px; }
.kx-search-hero{ text-align:center; padding:24px 0 14px; }
.kx-search-hero h1{ font-family:var(--kx-serif); font-weight:900; font-size:32px; margin-bottom:20px; }
.kx-searchbox-lite{ max-width:520px; margin:0 auto; display:flex; align-items:center; gap:8px; background:#fff; border:1px solid #cfc7b3; border-radius:28px; padding:12px 18px; box-shadow:0 8px 24px rgba(106,19,19,.08); }
.kx-searchbox-lite input{ border:none; outline:none; width:100%; font-family:var(--kx-sans); font-size:16px; }
.kx-search-results{ margin-top:28px; text-align:left; max-width:740px; margin-left:auto; margin-right:auto; }
.kx-sresult{ display:flex; gap:16px; padding:14px 0; border-bottom:1px solid #ece7d9; align-items:center; }
.kx-sresult img{ width:88px; height:62px; object-fit:cover; border-radius:8px; flex-shrink:0; }
.kx-sresult .tt{ font-family:var(--kx-serif); font-weight:700; font-size:16.5px; line-height:1.38; color:var(--kx-ink); }
.kx-sresult .tt:hover{ color:var(--kx-red); }
.kx-sresult .cc{ font-size:12.5px; color:#9a9284; margin-top:3px; }

/* ============ FOOTER ============ */
.kx-footer{ background:#0d0d0f; color:#c7cbd6; margin-top:40px; font-family:var(--kx-sans); }
.hp-footer__grid{ max-width:1180px; margin:0 auto; padding:48px 24px 40px; display:grid; grid-template-columns:1.5fr 1fr 1fr 1.1fr 1fr; gap:32px; }
.hp-footer__grid h2{ font-family:var(--kx-serif); font-weight:800; color:#fff; font-size:16px; margin-bottom:16px; letter-spacing:.4px; padding-bottom:8px; border-bottom:2px solid var(--kx-red); display:inline-block; }
.hp-footer__grid ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.hp-footer__grid ul a{ color:rgba(255,255,255,0.66); font-size:14px; transition:color .15s,padding-left .15s; }
.hp-footer__grid ul a:hover{ color:#fff; padding-left:4px; }
.hp-footer__brand img{ height:34px; background:#fff; padding:6px 12px; border-radius:8px; }
.hp-footer__brand p{ font-size:14px; line-height:1.75; color:rgba(255,255,255,0.6); max-width:300px; margin:16px 0 18px; }
.hp-footer__social{ display:flex; gap:10px; }
.hp-footer__social a{ border:1px solid rgba(255,255,255,0.18); color:#fff; font-size:12.5px; padding:7px 14px; border-radius:20px; transition:all .15s; }
.hp-footer__social a:hover{ background:var(--kx-red); border-color:var(--kx-red); }
.kx-footer-bottom{ border-top:1px solid rgba(255,255,255,0.1); }
.kx-footer-bottom .inner{ max-width:1180px; margin:0 auto; padding:18px 24px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; font-size:13px; color:rgba(255,255,255,0.5); }
.kx-footer-bottom p{ margin:0; }
.kx-footer-bottom a{ color:rgba(255,255,255,0.5); }
.kx-footer-bottom a:hover{ color:#fff; }

/* ============ RESPONSIVE ============ */
@media (max-width:1200px){
  .kx-home{ grid-template-columns:1fr; }
  .kx-home-main{ order:0; }
  .kx-panel{ position:static; order:1; }
  .kx-block-kicker, .kx-block-split{ grid-template-columns:1fr; }
  .kx-block-aside{ border-left:none; padding-left:0; margin-top:4px; }
}
@media (max-width:900px){
  .kx-feature{ grid-template-columns:1fr; }
  .kx-feature-side{ border-left:none; padding-left:0; }
  .kx-grid-3{ grid-template-columns:repeat(2,1fr); }
  .kx-cat-banner{ padding:32px 24px; }
  .kx-cat-banner h1{ font-size:30px; }
  .kx-article h1{ font-size:32px; }
  .kx-article .content img{ max-width:100%; height:auto; }
  .kx-article .content figure{ max-width:100%; }
  .kx-article .content iframe{ max-width:100%; }
  .kx-article .content table{ display:block; max-width:100%; overflow-x:auto; }
  .kx-article-wrap, .kx-cat-layout{ grid-template-columns:1fr; gap:32px; }
  .kx-cat-chips{ grid-template-columns:repeat(3,1fr); }
  .kx-aside{ position:static; }
  .kx-feature-main .f-title{ font-size:26px; }
  .kx-slider{ aspect-ratio:16/9; }
  .kx-slide .stitle{ font-size:24px; }
  .hp-footer__grid{ grid-template-columns:repeat(2,1fr); gap:28px; }
  .kx-contact-grid{ grid-template-columns:1fr; gap:28px; }
  .kx-contact-photo{ position:static; }
}
@media (max-width:640px){
  .kx-grid-3{ grid-template-columns:1fr; }
  .kx-cat-chips{ grid-template-columns:1fr; }
  .kx-container,.kx-page,.kx-page-wide,.kx-article-wrap,.kx-cat-wrap,.kx-home-wrap{ padding-left:16px; padding-right:16px; }
  .kx-feature-main .ovl{ padding:18px 18px; }
  .kx-feature-main .f-title{ font-size:22px; }
  .kx-cat-banner{ padding:26px 18px; }
  .kx-cat-banner h1{ font-size:24px; white-space:normal; }
  .kx-cat-banner .count{ font-size:13px; padding:8px 16px; }
  .kx-cat-banner .sub{ font-size:13px; margin-top:6px; }
  .kx-home{ grid-template-columns:1fr; }
  .kx-slider{ aspect-ratio:16/10; }
  .kx-slide .sovl{ padding:16px 18px; }
  .kx-slide .stitle{ font-size:19px; }
  .kx-slide .ssum{ display:none; }
  .hp-footer__grid{ grid-template-columns:1fr; gap:24px; }
  .hp-footer__brand p{ max-width:none; }
  .kx-footer-bottom .inner{ flex-direction:column; text-align:center; }
  .snav{ display:none; }
  .kx-block-duo{ grid-template-columns:1fr; }
}

/* ============ E-PAPER ============ */
.ep-sub{ display:block; font-size:14px; font-weight:500; color:var(--kx-ink-soft); margin-top:6px; }
.kx-ep-grid{ display:none; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; margin-top:20px; }
.kx-ep-grid:first-of-type{ display:grid; }
.kx-ep-card{ display:block; background:#fff; border:1px solid #e7e0d0; border-radius:10px; overflow:hidden; box-shadow:0 4px 16px rgba(0,0,0,.06); transition:transform .18s, box-shadow .18s; }
.kx-ep-card:hover{ transform:translateY(-3px); box-shadow:0 10px 26px rgba(0,0,0,.12); }
.kx-ep-card .cov{ display:block; position:relative; aspect-ratio:3/4; background:linear-gradient(135deg,#f3ede2,#e7dfd0); }
.kx-ep-card .cov img{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:10px; }
.kx-ep-card .lab{ display:block; padding:9px 10px 11px; }
.kx-ep-card .lab b{ display:block; font-size:14px; color:var(--kx-ink); }
.kx-ep-card .lab i{ font-style:normal; font-size:12px; color:var(--kx-red); font-weight:600; }

/* ---- viewer ---- */
.kx-ep-top{ display:flex; align-items:center; height:56px; padding:0 16px; background:#fff; border-bottom:1px solid #ece5d6; }
.kx-ep-top .kx-logo img{ height:38px; width:auto; display:block; background:#fff; padding:6px 14px; border-radius:8px; }
.kx-ep-view{ display:flex; flex-direction:column; height:calc(100vh - 56px); }
.kx-ep-bar{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; background:#fff; border-bottom:1px solid #ece5d6; padding:9px 16px; }
.kx-ep-back{ color:var(--kx-red); font-weight:700; font-size:14px; }
.kx-ep-title{ display:flex; flex-direction:column; line-height:1.1; margin-right:auto; }
.kx-ep-title span{ color:var(--kx-ink); font-weight:700; }
.kx-ep-title #ep-dt{ font-weight:500; font-size:12px; color:var(--kx-ink-soft); }
.kx-ep-nav{ display:flex; align-items:center; gap:8px; }
.kx-ep-nav .ep-page{ font-size:13px; color:#fff; display:flex; align-items:center; gap:5px; }
.kx-ep-nav .ep-page em, .kx-ep-nav .ep-page b{ color:#fff; font-style:normal; font-weight:700; }
.kx-ep-nav input#ep-cur{ width:38px; text-align:center; border:1px solid #fff; border-radius:5px; padding:4px 2px; font-size:13px; color:#000; background:#fff; font-weight:700; }
.kx-ep-nav button, .kx-ep-tools button, .kx-ep-tools a{ border:1px solid #ddd2bd; background:#fff; color:var(--kx-ink); width:34px; height:34px; border-radius:6px; display:inline-flex; align-items:center; justify-content:center; font-size:16px; cursor:pointer; }
.kx-ep-nav button:hover, .kx-ep-tools button:hover, .kx-ep-tools a:hover{ background:#f6f2e8; border-color:var(--kx-red); color:var(--kx-red); }
.kx-ep-tools{ display:flex; align-items:center; gap:7px; }
.kx-ep-tools button#ep-crop{ width:auto; padding:0 12px; font-size:13px; font-weight:700; color:var(--kx-red); }
.kx-ep-tools button#ep-ff{ width:auto; padding:0 10px; font-size:12px; font-weight:700; color:var(--kx-red); }
.kx-ep-wrap{ flex:1; display:flex; min-height:0; background:#3a3737; position:relative; }
.kx-ep-thumbs{ width:104px; flex-shrink:0; overflow-y:auto; background:#2e2b2b; border-left:1px solid #4a4646; display:flex; flex-direction:column; gap:6px; padding:8px 6px; }
.kx-ep-thumbs::-webkit-scrollbar{ width:5px; }
.kx-ep-thumbs::-webkit-scrollbar-thumb{ background:#605b5b; border-radius:3px; }
.kx-ep-th{ cursor:pointer; border:2px solid transparent; border-radius:6px; overflow:hidden; background:#1c1a1a; position:relative; flex-shrink:0; transition:border-color .15s, box-shadow .15s; }
.kx-ep-th canvas{ display:block; width:100%; height:auto; }
.kx-ep-th .kx-ep-th-num{ position:absolute; bottom:0; left:0; right:0; background:rgba(10,5,5,.72); color:#fff; font-size:10px; font-weight:700; text-align:center; padding:2px 0; }
.kx-ep-th.on{ border-color:var(--kx-mustard); box-shadow:0 0 8px rgba(240,162,2,.45); }
.kx-ep-th:hover{ border-color:rgba(240,162,2,.55); }
.kx-ep-stage-box{ flex:1; position:relative; display:flex; min-width:0; min-height:0; }
.kx-ep-stage{ flex:1; overflow:auto; position:relative; cursor:grab; display:block; touch-action:none; overscroll-behavior:none; -webkit-user-select:none; user-select:none; }
.kx-crop-overlay{ position:absolute; inset:0; pointer-events:none; z-index:7; }
.kx-crop{ display:none; position:absolute; border:2px solid #fff; outline:1px solid rgba(240,162,2,.7); background:rgba(255,255,255,.06); cursor:move; z-index:5; touch-action:none; pointer-events:auto; }
.kx-ep-curpg{ position:sticky; left:12px; bottom:12px; float:left; margin-top:-34px; margin-left:12px; z-index:8; background:rgba(20,10,10,.78); color:#fff; font-weight:700; font-size:13px; padding:5px 12px; border-radius:20px; pointer-events:none; letter-spacing:.3px; }
.kx-ep-stage.cropping{ cursor:crosshair; padding-bottom:118px; }
.kx-ep-stage.cropping #ep-canvas{ margin-bottom:0; }
#ep-canvas{ box-shadow:0 8px 40px rgba(0,0,0,.5); background:#fff; transform-origin:0 0; margin:24px auto; display:block; touch-action:none; }
.kx-crop.cropping-dim{ box-shadow:0 0 0 9999px rgba(8,5,5,.55); }
.kx-crop .kx-ch{ position:absolute; width:12px; height:12px; background:#f0a202; border:2px solid #fff; border-radius:2px; box-shadow:0 1px 3px rgba(0,0,0,.5); z-index:2; }
.kx-ch.nw{ left:-7px; top:-7px; cursor:nwse-resize; }
.kx-ch.n{ left:calc(50% - 6px); top:-7px; cursor:ns-resize; }
.kx-ch.ne{ right:-7px; top:-7px; cursor:nesw-resize; }
.kx-ch.e{ right:-7px; top:calc(50% - 6px); cursor:ew-resize; }
.kx-ch.se{ right:-7px; bottom:-7px; cursor:nwse-resize; }
.kx-ch.s{ left:calc(50% - 6px); bottom:-7px; cursor:ns-resize; }
.kx-ch.sw{ left:-7px; bottom:-7px; cursor:nesw-resize; }
.kx-ch.w{ left:-7px; top:calc(50% - 6px); cursor:ew-resize; }
.kx-crop .kx-crop-dim{ position:absolute; left:0; top:-24px; background:#8f1f1f; color:#fff; font-size:12px; padding:2px 8px; border-radius:4px; pointer-events:none; white-space:nowrap; }
.kx-crop-bar{ position:fixed; left:50%; bottom:20px; transform:translateX(-50%); z-index:70; background:#fff; border:1px solid #ece5d6; border-top:3px solid var(--kx-red); border-radius:10px; box-shadow:0 16px 44px rgba(0,0,0,.3); padding:10px 14px; display:flex; align-items:center; gap:8px; }
.kx-crop-bar[hidden]{ display:none; }
.kx-crop-bar span{ font-size:13px; color:var(--kx-ink-soft); margin-right:6px; }
.kx-crop-bar button{ border:1px solid #ddd2bd; background:#fff; color:var(--kx-red); font-weight:700; border-radius:7px; padding:7px 14px; font-size:13px; cursor:pointer; }
.kx-crop-bar button:hover{ background:var(--kx-red); color:#fff; border-color:var(--kx-red); }
.kx-crop-bar #kx-crop-x{ color:var(--kx-ink-soft); font-weight:600; background:#f6f2e8; }
.kx-crop-bar #kx-crop-x:hover{ background:#e9e0ce; color:var(--kx-ink); }
.kx-ep-load{ position:fixed; top:56px; left:0; right:0; z-index:60; background:rgba(20,10,10,.88); color:#fff; text-align:center; padding:10px; letter-spacing:.2px; }
.kx-share-toast{ position:fixed; left:50%; bottom:86px; transform:translateX(-50%) translateY(20px); z-index:95; background:var(--kx-navy-deep); color:#fff; font-size:13.5px; padding:10px 16px; border-radius:9px; box-shadow:0 14px 34px rgba(0,0,0,.35); opacity:0; pointer-events:none; transition:opacity .25s ease, transform .25s ease; max-width:92vw; text-align:center; }
.kx-share-toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }
.kx-share-modal{ position:fixed; inset:0; z-index:90; background:rgba(8,5,5,.62); display:flex; align-items:center; justify-content:center; padding:20px; }
.kx-share-modal[hidden]{ display:none; }
.kx-share-modal-in{ background:#fff; border-radius:14px; max-width:560px; width:100%; max-height:92vh; overflow:auto; padding:20px 22px; position:relative; box-shadow:0 26px 70px rgba(0,0,0,.4); }
.kx-share-modal-in h3{ margin:0 0 14px; font-size:18px; color:var(--kx-red); }
.kx-share-x{ position:absolute; top:10px; right:12px; border:none; background:none; color:var(--kx-ink-soft); font-size:26px; line-height:1; cursor:pointer; }
.kx-share-x:hover{ color:var(--kx-ink); }
.kx-share-pv{ background:#fff; border:1px solid #ece5d6; border-radius:10px; padding:10px; }
.kx-share-pv canvas{ display:block; margin:0 auto; max-width:100%; height:auto; box-shadow:0 2px 8px rgba(0,0,0,.14); }
.kx-share-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; }
.kx-share-actions button{ border:none; border-radius:8px; padding:10px 20px; font-weight:700; font-size:14px; cursor:pointer; }
.kx-share-actions #kx-share-send{ background:var(--kx-red); color:#fff; flex:1; }
.kx-share-actions #kx-share-send:hover{ background:var(--kx-navy-deep); }
.kx-share-actions #kx-share-copy{ background:#fff; color:var(--kx-red); border:1px solid #ddd2bd; flex:1; }
.kx-share-actions #kx-share-copy:hover{ background:var(--kx-red); color:#fff; }
.kx-share-actions #kx-share-cancel{ background:#f6f2e8; color:var(--kx-ink-soft); }
.kx-share-actions #kx-share-cancel:hover{ background:#e9e0ce; color:var(--kx-ink); }
.kx-crop-share{ padding:34px 16px 60px; }
.kx-crop-share .kx-cs-head{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:14px; }
.kx-crop-share .kx-cs-head h1{ font-size:24px; margin:0; }
.kx-crop-share .kx-cs-info{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; background:var(--kx-red); color:#fff; font-weight:700; font-size:15px; padding:9px 14px; border-radius:8px; width:fit-content; margin-bottom:12px; }
.kx-crop-share .kx-cs-info .dot{ opacity:.7; }
.kx-crop-share .kx-cs-note{ color:var(--kx-ink-soft); font-size:13.5px; margin:0 0 16px; }
.kx-crop-share .kx-cs-note a{ color:var(--kx-red); font-weight:700; }
.kx-crop-share .kx-cs-share{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.kx-crop-share .kx-cs-share > span{ font-size:14px; font-weight:700; color:var(--kx-ink); }
.kx-crop-share .kx-cs-share a{ display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%; transition:transform .15s ease; }
.kx-crop-share .kx-cs-share a:hover{ transform:translateY(-3px); }
.kx-crop-share .kx-cs-share a#cs-wa{ background:#25D366; }
.kx-crop-share .kx-cs-share a#cs-fb{ background:#1877F2; }
.kx-crop-share .kx-cs-share a#cs-x{ background:#111; }
.kx-crop-share .kx-cs-share a svg{ color:#fff; display:block; }
.kx-crop-share .kx-cs-share button{ border:1px solid #ddd2bd; background:#fff; color:var(--kx-red); font-weight:700; font-size:13px; padding:8px 14px; border-radius:20px; cursor:pointer; }
.kx-crop-share .kx-cs-share button:hover{ background:var(--kx-red); color:#fff; border-color:var(--kx-red); }
.kx-crop-share .kx-cs-box{ background:#fff; border:1px solid #ece5d6; border-radius:10px; padding:12px; box-shadow:0 10px 30px rgba(0,0,0,.08); }
.kx-crop-share .kx-cs-box canvas{ display:block; margin:0 auto; max-width:100%; height:auto; box-shadow:0 2px 8px rgba(0,0,0,.14); }
.kx-crop-share .kx-cs-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }
.kx-crop-share .kx-cs-actions button{ border:none; background:var(--kx-red); color:#fff; font-weight:700; font-size:14px; padding:10px 22px; border-radius:8px; cursor:pointer; }
.kx-crop-share .kx-cs-actions button:hover{ background:var(--kx-navy-deep); }
.kx-ep-share{ position:fixed; right:18px; bottom:18px; z-index:90; background:#fff; border:1px solid #ece5d6; border-top:3px solid var(--kx-red); border-radius:10px; box-shadow:0 18px 44px rgba(0,0,0,.25); padding:14px 16px; max-width:320px; }
.kx-ep-share strong{ display:block; font-size:14px; margin-bottom:6px; }
.kx-ep-share .kx-ep-shurl{ display:block; font-size:12px; color:var(--kx-ink-soft); margin-bottom:8px; word-break:break-word; }
.kx-ep-share button{ display:block; width:100%; text-align:left; background:#f6f2e8; border:1px solid #e7e0d0; border-radius:6px; padding:7px 9px; margin-top:6px; font-size:13px; color:var(--kx-ink); cursor:pointer; }
.kx-ep-share button code{ color:var(--kx-red); font-weight:700; }
.kx-ep-share button[data-k="close"]{ background:transparent; border-color:transparent; color:var(--kx-red); font-weight:700; text-align:center; }
@media (max-width:700px){
  .kx-ep-view{ height:calc(100vh - 56px); }
  .kx-ep-thumbs{ display:none; }
  .kx-ep-tools{ gap:4px; }
  .kx-ep-nav button, .kx-ep-tools button, .kx-ep-tools a{ width:30px; height:30px; }
  .kx-ep-tools button#ep-crop{ width:auto; padding:0 10px; font-size:12px; }
  .kx-ep-tools button#ep-ff{ width:auto; padding:0 8px; font-size:11px; }
  .kx-ep-title{ margin-right:4px; }
  .kx-crop-bar{ left:8px; right:8px; transform:none; bottom:8px; flex-wrap:wrap; justify-content:center; padding:8px 8px; gap:6px; }
  .kx-crop-bar span{ width:100%; text-align:center; margin-right:0; font-size:12px; }
  .kx-crop-bar button{ padding:8px 10px; font-size:12px; flex:1 1 auto; min-width:0; }
  .kx-ep-stage.cropping{ padding-bottom:170px; }
}

/* --- newsletter subscribe form --- */
.kx-sub-form{ max-width:520px; margin:6px 0 0; }
.kx-sub-label{ display:block; font-size:14px; font-weight:700; color:var(--kx-ink); margin-bottom:8px; }
.kx-sub-row{ display:flex; gap:10px; flex-wrap:wrap; }
.kx-sub-input{ flex:1 1 260px; min-width:0; padding:13px 15px; border:1px solid #ddd2bd; border-radius:9px; font-size:15px; font-family:inherit; color:var(--kx-ink); background:#fff; }
.kx-sub-input:focus{ outline:none; border-color:var(--kx-red); box-shadow:0 0 0 3px rgba(122,20,20,.1); }
.kx-sub-btn{ flex:0 0 auto; border:none; background:var(--kx-red); color:#fff; font-weight:700; font-size:15px; padding:13px 26px; border-radius:9px; cursor:pointer; font-family:inherit; transition:background .15s ease; }
.kx-sub-btn:hover{ background:var(--kx-navy-deep); }
.kx-sub-note{ padding:12px 16px; border-radius:9px; font-size:15px; font-weight:600; margin:0 0 18px; }
.kx-sub-ok{ background:#e8f5ec; color:#1c6e4f; border:1px solid #b9e0c7; }
.kx-sub-err{ background:#fdeaea; color:#a32020; border:1px solid #f2bcbc; }
@media (max-width:520px){ .kx-sub-btn{ width:100%; } }
.kx-ep-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 16px;margin:16px 0 8px;padding:12px 6px;border-top:1px solid #ece6d6}.kx-ep-pg-info{font-size:14px;font-weight:600;color:#6b6455;letter-spacing:.3px}.kx-ep-pg-btns{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.kx-ep-pg-btns button{background:#fff;border:1px solid #d9d3c3;color:#3c382e;min-width:36px;height:36px;padding:0 12px;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .15s}.kx-ep-pg-btns button:hover{background:#a32020;border-color:#a32020;color:#fff}.kx-ep-pg-cur{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 8px;border-radius:8px;background:#a32020;color:#fff;font-weight:700;font-size:14px}

/* ============ ARTICLE 2-COLUMN + HERO FIX ============ */
.kx-article-wrap{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:36px;align-items:start;max-width:1360px;width:100%;margin:0 auto;padding:30px 24px 70px}
.kx-article-main{min-width:0}
.kx-article h1{font-size:38px}
.kx-article .hero{max-width:100%;height:auto;margin:0 auto}
.kx-article .kx-hero{max-width:100%}
.kx-article .content img{max-width:100%;height:auto}
@media (max-width:1024px){
  .kx-article-wrap{grid-template-columns:1fr;gap:32px}
  .kx-aside{position:static}
  .kx-article h1{font-size:29px}
}

/* ============ AUTHOR PROFILE ============ */
.author-link{color:var(--kx-navy);font-weight:700;border-bottom:1px dotted #b9ad92}
.author-link:hover{color:var(--kx-red)}
.kx-author-page{max-width:900px}
.kx-au-head{display:flex;gap:22px;align-items:center;background:#fff;border:1px solid #ece7d9;border-radius:16px;padding:26px;box-shadow:0 6px 18px rgba(106,19,19,.05);margin-bottom:30px}
.kx-au-avatar{width:84px;height:84px;border-radius:50%;background:linear-gradient(135deg,#a91d1d,#6a1313);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--kx-serif);font-size:36px;font-weight:900;flex-shrink:0}
.kx-au-info h1{font-family:var(--kx-serif);font-size:30px;font-weight:900;margin:0 0 6px}
.kx-au-meta{font-size:14px;color:#6b6455}
.kx-au-meta b{color:var(--kx-red)}
.kx-au-about{font-size:14px;color:#8a8374;margin:8px 0 0}
.kx-au-list{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.kx-au-item{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid #ece7d9;border-radius:12px;padding:12px 14px;transition:box-shadow .15s}
.kx-au-item:hover{box-shadow:0 8px 22px rgba(0,0,0,.08)}
.kx-au-item img{width:110px;height:70px;object-fit:cover;border-radius:8px;flex-shrink:0;background:#f3ede2}
.kx-au-item .t{display:block;font-family:var(--kx-serif);font-weight:700;font-size:16px;line-height:1.4;color:var(--kx-ink)}
.kx-au-item:hover .t{color:var(--kx-red)}
.kx-au-item .d{display:block;font-size:12px;color:#b3a98f;margin-top:4px}
.kx-au-empty{color:#8a8374;padding:20px}
@media (max-width:640px){.kx-au-head{flex-direction:column;text-align:center;gap:14px}.kx-au-item img{width:86px;height:58px}}

/* ============ BYLINE (network + author) ============ */
.kx-byline{ font-size:14.5px; color:#8a8374; margin-bottom:24px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.kx-byline-net{ color:var(--kx-navy); font-weight:700; }
.kx-byline-sep{ color:#c9c0ac; }
.kx-byline-upd{ color:#8a8374; }
.kx-byline .author-link{ color:var(--kx-navy); font-weight:700; border-bottom:1px dotted #b9ad92; }
.kx-byline .author-link:hover{ color:var(--kx-red); }
.kx-au-avatar img{ width:100%; height:100%; object-fit:cover; border-radius:50%; }
.kx-au-role,.kx-au-span{ color:#8a8374; }
.kx-au-head + .kx-section-head{ margin-top:6px; }
.kx-author-page .kx-pager{ margin-top:26px; }
@media (max-width:640px){ .kx-byline{ font-size:12.5px; gap:5px 7px; } }
