/* ═══ VARIABLES ═══ */
:root {
  --blue-dark:   #1a4a7a;
  --blue-mid:    #2563a8;
  --blue-light:  #3b82c4;
  --blue-pale:   #5ba3d9;
  --blue-soft:   #d0e8f7;
  --blue-bg:     #eaf4fb;
  --serif: Georgia, 'Times New Roman', serif;
  --sans:  Helvetica, Arial, sans-serif;
  --ease:  cubic-bezier(.22,1,.36,1);
  --tr:    .35s;
}
[data-theme="dark"] {
  color-scheme: dark;
  /* Night palette, one step lighter than the original near-black (#07121e):
     deep navy that still reads as "dark" but keeps sections and cards distinguishable. */
  --bg:      #0f2034; --bg2: #142a44; --bg3: #193352;
  --card:    #1a3555; --card-h: #204166;
  --bdr:     rgba(255,255,255,.09); --bdr-h: rgba(91,163,217,.45);
  --t1: #e3eefa; --t2: #86a9cb; --t3: #5c7fa2;
  --nav-bg:  rgba(15,32,52,.88);
  --accent:  var(--blue-light);
  --accent-g: rgba(59,130,196,.14);
}
[data-theme="light"] {
  color-scheme: light;
  --bg:      #f0f7fd; --bg2: #ffffff; --bg3: #e4f0fa;
  --card:    #ffffff; --card-h: #f5faff;
  --bdr:     rgba(26,74,122,.09); --bdr-h: rgba(26,74,122,.28);
  --t1: #0d1e30; --t2: #3a5878; --t3: #7a9ab8;
  --nav-bg:  rgba(240,247,253,.92);
  --accent:  var(--blue-dark);
  --accent-g: rgba(26,74,122,.1);
}


/* ── VIDEO BG ── */
.hero-video-bg{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;z-index:0}
.hero-video-bg video{width:100%;height:100%;object-fit:cover;opacity:1}
.hero-video-overlay{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(
    to right,
    rgba(4,12,26,.78) 0%,
    rgba(4,12,26,.62) 50%,
    rgba(4,12,26,.50) 100%
  )
}

/* ── HERO matnlari video ustida ── */
#hero .hero-badge{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.28);color:#fff}
#hero .bp{background:#7ec8f5}
#hero .hero-title{color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.7),0 1px 4px rgba(0,0,0,.9)}
#hero .hero-title em{color:#7ec8f5;text-shadow:0 2px 16px rgba(0,0,0,.7)}
#hero .hero-desc{color:rgba(255,255,255,.88);font-weight:300;text-shadow:0 1px 5px rgba(0,0,0,.5)}
#hero .hero-badge{text-shadow:0 1px 6px rgba(0,0,0,.6)}
#hero .btn-g{color:#fff;border-color:rgba(255,255,255,.38);background:rgba(255,255,255,.1)}
#hero .btn-g:hover{border-color:#fff;background:rgba(255,255,255,.2);color:#fff}
#hero .hero-stats{border-top-color:rgba(255,255,255,.2)}
#hero .snum{color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.8)}
#hero .snum .pl{color:#7ec8f5}
#hero .slbl{color:rgba(255,255,255,.75);text-shadow:0 1px 6px rgba(0,0,0,.7)}
/* canvas particles hidden when video shown */
#hero-canvas{z-index:1}
.hero-mesh{z-index:1}
.hero-grid{z-index:1}
/* AOS fix - force hardware acceleration */
[data-aos]{will-change:transform,opacity}
[data-aos].aos-animate{transform:none!important}

/* AOS offline fallback */
@keyframes aosUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@keyframes aosLeft{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:translateX(0)}}
@keyframes aosRight{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:translateX(0)}}
.aos-animate[data-aos="fade-up"]{animation:aosUp .65s both}
.aos-animate[data-aos="fade-left"]{animation:aosLeft .65s both}
.aos-animate[data-aos="fade-right"]{animation:aosRight .65s both}

/* ═══ FX: SCROLL PROGRESS BAR ═══ */
.scroll-prog{position:fixed;top:0;left:0;height:3px;width:0;z-index:9999;background:linear-gradient(90deg,var(--blue-dark),var(--blue-light),var(--blue-pale));box-shadow:0 0 14px rgba(59,130,196,.55);transition:width .12s linear;pointer-events:none}

/* ═══ FX: 3D TILT (cards rotate on mouse) ═══ */
.tilt{transform-style:preserve-3d;transform:perspective(900px) rotateX(0) rotateY(0) translateZ(0);transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s}
.tilt-inner{transform:translateZ(28px);transition:transform .35s cubic-bezier(.22,1,.36,1)}

/* ═══ FX: MAGNETIC BUTTONS ═══ */
.magnetic{position:relative;will-change:transform;transition:transform .25s cubic-bezier(.22,1,.36,1),box-shadow .25s}

/* ═══ FX: SHIMMER LOAD on images ═══ */
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
.news-featured-img,.nli-thumb,.j-card-img,.pub-ico{position:relative}
.news-featured-img::before,.nli-thumb::before,.j-card-img::before,.pub-ico::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.18) 50%,transparent 70%);
  background-size:200% 100%;
  animation:shimmer 2.4s infinite;
  pointer-events:none;z-index:1;opacity:0;transition:opacity .4s;
}
.news-featured-img.loading::before,.nli-thumb.loading::before,.j-card-img.loading::before,.pub-ico.loading::before{opacity:1}

/* ═══ FX: IMAGE OVERLAY REVEAL on hover (news featured) ═══ */
.news-featured-img::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(13,30,48,0) 30%,rgba(13,30,48,.78) 100%);
  opacity:0;transition:opacity .45s var(--ease);z-index:2;pointer-events:none;
}
.news-featured:hover .news-featured-img::after{opacity:1}
.news-featured-img .reveal-tag{
  position:absolute;left:1.1rem;bottom:1.1rem;z-index:3;
  font-size:.7rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  color:#fff;
  padding:.42rem .85rem;border:1px solid rgba(255,255,255,.45);border-radius:30px;
  background:rgba(255,255,255,.08);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  transform:translateY(14px);opacity:0;
  transition:opacity .45s var(--ease) .05s,transform .45s var(--ease) .05s;
}
.news-featured:hover .news-featured-img .reveal-tag{transform:translateY(0);opacity:1}

/* ═══ FX: GLOW ACCENTS + ANIMATED GRADIENT BORDER on cards ═══ */
.j-card,.news-featured{position:relative;isolation:isolate}
.j-card::before,.news-featured::before{
  content:'';position:absolute;inset:-1px;border-radius:inherit;z-index:-1;
  background:conic-gradient(from var(--ang,0deg),transparent 0%,rgba(59,130,196,.55) 18%,transparent 36%,transparent 64%,rgba(94,180,232,.45) 82%,transparent 100%);
  opacity:0;transition:opacity .5s;
  -webkit-mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);
          mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);
  -webkit-mask-composite:xor;mask-composite:exclude;
  padding:1px;
  animation:angSpin 6s linear infinite;
}
@property --ang{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes angSpin{to{--ang:360deg}}
.j-card:hover::before,.news-featured:hover::before{opacity:1}
.j-card:hover,.news-featured:hover{box-shadow:0 22px 60px rgba(26,74,122,.18),0 0 0 1px rgba(59,130,196,.18)}

/* ═══ FX: STAGGER REVEAL ═══ */
@keyframes staggerIn{from{opacity:0;transform:translateY(22px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
.stagger>*{opacity:0;animation:staggerIn .7s cubic-bezier(.22,1,.36,1) forwards}
.stagger.in>*:nth-child(1){animation-delay:.05s}
.stagger.in>*:nth-child(2){animation-delay:.13s}
.stagger.in>*:nth-child(3){animation-delay:.21s}
.stagger.in>*:nth-child(4){animation-delay:.29s}
.stagger.in>*:nth-child(5){animation-delay:.37s}
.stagger.in>*:nth-child(6){animation-delay:.45s}
.stagger.in>*:nth-child(7){animation-delay:.53s}
.stagger.in>*:nth-child(8){animation-delay:.61s}

/* ═══ FX: SECTION ACCENT GLOW (subtle) ═══ */
#news::before,#publications::before,#journals::before,#partners::before{
  content:'';position:absolute;left:50%;top:0;transform:translateX(-50%);
  width:min(720px,80%);height:1px;
  background:linear-gradient(90deg,transparent,rgba(59,130,196,.4),transparent);
  pointer-events:none;
}
#news,#publications,#journals,#partners{position:relative}

/* ═══ FX: HERO PARALLAX layers (mouse-driven) ═══ */
.hero-video-bg{transition:transform .35s cubic-bezier(.22,1,.36,1)}
.hero-inner{transform-style:preserve-3d}
.hero-title,.hero-desc,.hero-badge,.hero-acts,.hero-stats{will-change:transform}

/* ═══ FX: BUTTON RIPPLE GLOW on press ═══ */
.btn-p,.btn-g{position:relative;overflow:hidden}
.btn-p::after,.btn-g::after{
  content:'';position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.45) 0%,transparent 60%);
  transform:translate(-50%,-50%);pointer-events:none;
  transition:width .55s ease,height .55s ease,opacity .6s ease;
  opacity:0;
}
.btn-p:active::after,.btn-g:active::after{width:280px;height:280px;opacity:1;transition:width 0s,height 0s,opacity .1s}

/* ═══ FX: REDUCE MOTION ═══ */
@media(prefers-reduced-motion:reduce){
  .tilt,.magnetic,.j-card::before,.news-featured::before,.stagger>*{
    animation:none!important;transition:none!important;transform:none!important;
  }
  .scroll-prog{display:none}
}

/* ═══ RESET ═══ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--bg);color:var(--t1);overflow-x:hidden;transition:background var(--tr),color var(--tr);font-size:16px;line-height:1.68;-webkit-text-size-adjust:100%}
img,svg,video,canvas{max-width:100%;height:auto}
video{height:100%}
::selection{background:rgba(37,99,168,.2)}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
img{max-width:100%;display:block}
*:focus-visible{outline:2px solid var(--blue-mid);outline-offset:3px;border-radius:3px}
.container{max-width:1280px;margin:0 auto;padding:0 clamp(1rem,3.5vw,2rem)}
.skip-link{position:absolute;top:-100%;left:1rem;background:var(--blue-mid);color:#fff;padding:.6rem 1.25rem;border-radius:6px;font-weight:600;z-index:9999;transition:top .2s}
.skip-link:focus{top:1rem}

/* ═══ CURSOR ═══ */

/* ═══ PROGRESS BAR ═══ */
#pbar{position:fixed;top:0;left:0;height:2px;background:linear-gradient(90deg,var(--blue-dark),var(--blue-pale));z-index:9999;width:0%;pointer-events:none}
/* Breadcrumb pinned over the hero video (static — does not change on scroll) */
.hero-crumb{
  position:absolute;top:clamp(82px,11vh,106px);
  left:clamp(.9rem,2.2vw,1.9rem);
  z-index:3;pointer-events:none;
}
.hero-crumb-inner{
  display:inline-flex;align-items:center;gap:.5rem;pointer-events:auto;
  padding:.42rem .95rem .42rem .72rem;border-radius:100px;
  background:rgba(7,18,30,.42);
  -webkit-backdrop-filter:blur(12px) saturate(1.4);
  backdrop-filter:blur(12px) saturate(1.4);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 8px 28px rgba(7,18,30,.32);
  color:#fff;font-size:.82rem;font-weight:600;letter-spacing:.2px;white-space:nowrap;
}
.hero-crumb-home{display:inline-flex;align-items:center;color:#fff;opacity:.85;transition:opacity .2s,transform .2s}
.hero-crumb-home:hover{opacity:1;transform:translateY(-1px);color:#fff}
.hero-crumb-home svg{width:15px;height:15px}
.hero-crumb-sep{opacity:.45;font-size:1rem;line-height:1}
.hero-crumb-cur{font-weight:700}
@media(max-width:560px){
  .hero-crumb{top:clamp(72px,11vh,92px)}
  .hero-crumb-inner{font-size:.74rem;padding:.34rem .8rem .34rem .6rem}
}

/* ═══════════════════════════════
   HEADER
═══════════════════════════════ */
#hdr{
  position:fixed;top:0;left:0;right:0;z-index:500;
  background:var(--nav-bg);
  backdrop-filter:blur(20px) saturate(1.5);
  -webkit-backdrop-filter:blur(20px) saturate(1.5);
  border-bottom:1px solid var(--bdr);
  transition:background var(--tr),box-shadow .3s;
}
#hdr.sc{box-shadow:0 4px 40px rgba(0,0,0,.12)}
#hdr > .container{max-width:none;padding:0 clamp(1rem,2vw,2rem)}

#hdr,#hdr *,#ftr,#ftr *,.mob-nav,.mob-nav *{font-family:'Untitled Sans', Helvetica, Arial, sans-serif}
#hdr .nav-item>a,#hdr .dropdown a,#hdr .dropdown-title,#hdr .lang-btn,#hdr .btn-proposal{text-transform:uppercase;letter-spacing:.6px}

.nav-wrap{display:flex;align-items:center;height:72px;gap:1rem;flex-wrap:nowrap;min-width:0}

/* Logo */
.logo{display:flex;align-items:center;gap:.75rem;flex-shrink:0;padding:0 1.5rem 0 0;border-right:1px solid var(--bdr);margin-right:1rem}
.logo-ico{width:48px;height:48px;background:linear-gradient(135deg,var(--blue-dark),var(--blue-mid));border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 3px 14px rgba(26,74,122,.28);color:#fff}
.logo-ico svg{width:26px;height:26px}
.logo-txt{display:flex;flex-direction:column;line-height:1.15}
.logo-txt strong{font-size:1.05rem;font-weight:700;letter-spacing:.5px;color:var(--t1)}
.logo-txt span{font-size:.7rem;color:var(--t2);font-weight:400;letter-spacing:.2px}

/* Nav links */
.nav-links{display:flex;align-items:center;gap:0;list-style:none;flex:1 1 auto;min-width:0}
.nav-item{position:relative;height:100%;display:flex;align-items:center}
.nav-item>a{
  display:flex;align-items:center;gap:.3rem;
  padding:.3rem .8rem;
  font-size:.82rem;font-weight:700;color:var(--t2);
  border-radius:6px;white-space:nowrap;
  transition:color var(--tr),background var(--tr);
  height:42px;
}
.nav-item>a svg{width:15px;height:15px;opacity:.6;flex-shrink:0}
.nav-item>a svg:last-child{width:12px;height:12px}
.nav-item:hover>a,.nav-item>a:hover,.nav-item>a[aria-current]{color:var(--accent);background:var(--accent-g)}

/* Dropdown */
.dropdown{
  position:absolute;top:calc(100% + 6px);left:0;
  background:var(--card);border:1px solid var(--bdr);
  border-radius:12px;padding:.5rem;min-width:230px;
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translateY(6px);
  transition:opacity .22s,transform .22s,visibility .22s;
  box-shadow:0 20px 55px rgba(0,0,0,.12);
  z-index:100;
}
.dropdown::before{
  content:'';position:absolute;top:-10px;left:0;right:0;height:10px;
  background:transparent;
}
.has-sub:hover .dropdown,.has-sub:focus-within .dropdown{opacity:1;visibility:visible;pointer-events:all;transform:translateY(0)}
.has-sub{position:relative}
.has-sub::after{
  content:'';position:absolute;left:0;right:0;top:100%;height:8px;
  background:transparent;
}
.dropdown a{display:flex;align-items:center;gap:.55rem;padding:.52rem .9rem;font-size:.86rem;color:var(--t2);border-radius:7px;transition:background var(--tr),color var(--tr)}
.dropdown a svg{width:14px;height:14px;color:var(--blue-mid);opacity:.6;flex-shrink:0}
.dropdown a:hover{background:var(--bg3);color:var(--accent)}
.dropdown a:hover svg{opacity:1}
.dropdown-title{font-size:.72rem;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--t3);padding:.4rem .8rem .2rem;margin-top:.2rem}

/* Nav right */
.nav-right{display:flex;align-items:center;gap:.5rem;margin-left:auto;padding-left:1rem;border-left:1px solid var(--bdr);flex-shrink:0}
.lang-sw{display:flex;gap:2px;background:var(--bg3);border-radius:7px;padding:2px}
.lang-btn{background:none;border:none;padding:.28rem .65rem;font-size:.76rem;font-weight:700;color:var(--t3);border-radius:5px;letter-spacing:.4px;transition:background var(--tr),color var(--tr)}
.lang-btn.act{background:var(--bg2);color:var(--accent);box-shadow:0 1px 4px rgba(0,0,0,.1)}
.ico-btn{background:transparent;border:1px solid var(--bdr);width:40px;height:40px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:var(--t2);transition:all var(--tr)}
.ico-btn:hover{background:var(--accent-g);color:var(--accent);border-color:var(--bdr-h)}
.ico-btn svg{width:19px;height:19px}

/* ── Til dropdown (select uslubida, ico-btn'ga mos) ── */
.lang-dd{position:relative;display:inline-flex}
.lang-dd-toggle{
  display:inline-flex;align-items:center;gap:.32rem;
  height:40px;padding:0 .55rem;
  background:transparent;border:1px solid var(--bdr);border-radius:9px;
  color:var(--t2);font-weight:700;font-size:.78rem;letter-spacing:.5px;
  cursor:pointer;transition:all var(--tr);
}
.lang-dd-toggle:hover{background:var(--accent-g);color:var(--accent);border-color:var(--bdr-h)}
.lang-dd-globe{width:16px;height:16px;flex-shrink:0}
.lang-dd-chev{width:11px;height:11px;opacity:.6;transition:transform .25s var(--ease)}
.lang-dd.is-open .lang-dd-chev{transform:rotate(180deg)}
.lang-dd.is-open .lang-dd-toggle{background:var(--accent-g);color:var(--accent);border-color:var(--bdr-h)}
.lang-dd-menu{
  position:absolute;top:calc(100% + 9px);right:0;
  min-width:178px;padding:6px;
  background:var(--card);border:1px solid var(--bdr);border-radius:12px;
  box-shadow:0 14px 44px rgba(0,0,0,.18);
  opacity:0;visibility:hidden;transform:translateY(-8px) scale(.98);
  transform-origin:top right;
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s;
  z-index:600;
}
.lang-dd.is-open .lang-dd-menu{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.lang-dd-item{
  display:flex;align-items:center;justify-content:space-between;gap:1.25rem;
  padding:.55rem .75rem;border-radius:8px;text-decoration:none;
  color:var(--t1);font-size:.86rem;font-weight:500;
  transition:background var(--tr),color var(--tr);
}
.lang-dd-item:hover{background:var(--bg3);color:var(--accent)}
.lang-dd-code{font-size:.7rem;font-weight:700;color:var(--t3);letter-spacing:.6px}
.lang-dd-item:hover .lang-dd-code{color:var(--accent)}
.lang-dd-item.is-act{background:linear-gradient(135deg,var(--blue-dark),var(--blue-mid));color:#fff}
.lang-dd-item.is-act .lang-dd-code{color:rgba(255,255,255,.82)}

.btn-proposal{display:inline-flex;align-items:center;gap:.4rem;background:var(--blue-dark);color:#fff;border:none;padding:.48rem 1.15rem;border-radius:7px;font-size:.84rem;font-weight:600;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}
.btn-proposal svg{width:16px;height:16px}
.btn-proposal:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(26,74,122,.35);background:var(--blue-mid)}

/* Burger */
.burger{display:none;background:none;border:1px solid var(--bdr);width:34px;height:34px;border-radius:8px;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.burger span{display:block;width:18px;height:1.5px;background:var(--t1);border-radius:1px;transition:transform .3s,opacity .3s}
.burger.op span:nth-child(1){transform:rotate(45deg) translate(4px,4px)}
.burger.op span:nth-child(2){opacity:0}
.burger.op span:nth-child(3){transform:rotate(-45deg) translate(4px,-4px)}

/* Mob nav */
.mob-nav{display:none;position:fixed;top:68px;left:0;right:0;background:var(--bg);z-index:499;padding:1.25rem 1.5rem 1.5rem;max-height:calc(100dvh - 68px);overflow-y:auto;box-shadow:0 26px 50px rgba(0,0,0,.16);border-bottom:1px solid var(--bdr);opacity:0;transform:translateY(-6px);transition:opacity .28s,transform .28s;pointer-events:none}
.mob-nav.op{opacity:1;transform:none;pointer-events:all}
.mob-nav ul{list-style:none;display:flex;flex-direction:column}
.mob-nav>ul>li>a{display:flex;align-items:center;gap:.65rem;padding:.95rem .5rem;font-size:1.05rem;font-weight:500;border-bottom:1px solid var(--bdr);color:var(--t2);transition:color var(--tr)}
.mob-nav>ul>li>a svg{width:18px;height:18px;color:var(--blue-mid)}
.mob-nav>ul>li>a:hover{color:var(--accent)}

/* ── Mobil menyu — keng ekranlarda avtomatik ko'p ustun (685px=2 → 1785px=5) ── */
@media(min-width:685px){
  .mob-nav>ul{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(290px,1fr));
    gap:0 1.5rem;
    align-items:start;
  }
}

/* Mob nav — collapsible parents */
.mob-has-sub{border-bottom:1px solid var(--bdr)}
.mob-sub-toggle{
  display:flex;align-items:center;justify-content:space-between;
  width:100%;background:none;border:none;cursor:pointer;
  padding:.95rem .5rem;font-size:1.05rem;font-weight:500;
  color:var(--t2);text-align:left;transition:color var(--tr);
}
.mob-sub-toggle:hover,.mob-sub-toggle.op{color:var(--accent)}
.mob-sub-label{display:flex;align-items:center;gap:.65rem}
.mob-sub-label svg{width:18px;height:18px;color:var(--blue-mid);flex-shrink:0}
.mob-chev{transition:transform .28s;color:var(--t3);flex-shrink:0}
.mob-sub-toggle.op .mob-chev{transform:rotate(180deg);color:var(--accent)}
.mob-sub{
  max-height:0;overflow:hidden;
  transition:max-height .35s ease,padding .25s ease;
  padding:0 0 0 .65rem;margin:0;
  border-left:2px solid var(--bdr);
  margin-left:.85rem;
}
.mob-sub.op{max-height:1200px;padding:.4rem 0 .85rem .65rem}
.mob-sub li{display:block}
.mob-sub li a{
  display:flex;align-items:center;gap:.6rem;
  padding:.62rem .55rem;font-size:.92rem;font-weight:500;
  color:var(--t2);border-radius:6px;transition:background var(--tr),color var(--tr);
}
.mob-sub li a:hover{background:var(--bg3);color:var(--accent)}
.mob-sub li a svg{width:14px;height:14px;color:var(--blue-mid);opacity:.7;flex-shrink:0}
.mob-sub li a:hover svg{opacity:1}
.mob-sub-title{
  font-size:.7rem;font-weight:700;letter-spacing:1.1px;text-transform:uppercase;
  color:var(--t3);padding:.7rem .55rem .25rem;margin-top:.15rem;
}
.mob-cta{
  margin-top:.75rem;background:var(--blue-dark);color:#fff!important;
  border-radius:9px;justify-content:center;border-bottom:none!important;
  padding:.85rem 1rem!important;font-weight:600!important;
}
.mob-cta:hover{background:var(--blue-mid);color:#fff!important}
.mob-cta svg{color:#fff!important}

/* ═══════════════════════════════
   TICKER
═══════════════════════════════ */
.ticker{background:linear-gradient(90deg,var(--blue-dark),var(--blue-mid));padding:.6rem 0;overflow:hidden}
.ticker-track{display:flex;white-space:nowrap;animation:tick 42s linear infinite}
.ticker-track:hover{animation-play-state:paused}
.t-item{display:inline-flex;align-items:center;gap:.65rem;padding:0 2.5rem;font-size:.82rem;font-weight:500;color:rgba(255,255,255,.92);flex-shrink:0}
.t-item svg{width:13px;height:13px;opacity:.7;flex-shrink:0}
@keyframes tick{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ═══════════════════════════════
   HERO
═══════════════════════════════ */
#hero{min-height:82vh;display:flex;align-items:center;padding:90px 0 50px;position:relative;overflow:hidden;background:#07121e}
#hero-canvas{position:absolute;inset:0;pointer-events:none;opacity:.7}
.hero-mesh{display:none}
.hero-grid{display:none}
.hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,400px);gap:3.5rem;align-items:center;max-width:none}

/* Solo hero: title left, divider, description right — three columns over the video */
.hero-inner--solo{display:grid;grid-template-columns:minmax(0,1.6fr) auto minmax(290px,1fr);gap:clamp(1.2rem,3vw,2.8rem);align-items:center;max-width:none}
.hero-inner--solo .hero-title{font-size:clamp(1.75rem,3.55vw,3.35rem);line-height:1.12;margin-bottom:0;text-align:right;overflow-wrap:break-word}
.hero-inner--solo .hero-desc{max-width:none;font-size:clamp(1.02rem,1.4vw,1.22rem);margin-bottom:0}
.hero-divider{
  align-self:stretch;width:1px;min-height:120px;border-radius:1px;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.3) 15%,rgba(201,169,97,.6) 50%,rgba(255,255,255,.3) 85%,transparent);
}
/* Hero entrance animations — title slides in from the left, right column from the right */
@keyframes heroSlideInLeft{
  0%{opacity:0;transform:translateX(-110px)}
  100%{opacity:1;transform:translateX(0)}
}
@keyframes heroSlideInRight{
  0%{opacity:0;transform:translateX(110px)}
  100%{opacity:1;transform:translateX(0)}
}
.hero-title-wrap{min-width:0;animation:heroSlideInLeft 1.05s cubic-bezier(.16,1,.3,1) both}
/* Right column: description + "go to news" button */
.hero-rightcol{
  display:flex;flex-direction:column;align-items:flex-start;gap:1.5rem;min-width:0;
  animation:heroSlideInRight 1.05s cubic-bezier(.16,1,.3,1) .22s both;
}
@media(prefers-reduced-motion:reduce){
  .hero-title-wrap,.hero-rightcol{animation:none}
}
.hero-news-btn{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.55rem 1rem .55rem .55rem;border-radius:100px;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  color:#fff;font-size:.86rem;font-weight:600;letter-spacing:.2px;white-space:nowrap;
  transition:transform .25s,background .25s,border-color .25s,box-shadow .25s;
}
.hero-news-btn:hover{
  transform:translateY(-2px);color:#fff;
  background:rgba(255,255,255,.17);border-color:rgba(255,255,255,.42);
  box-shadow:0 12px 30px rgba(7,18,30,.42);
}
.hero-news-btn-ic{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,var(--blue-mid),var(--blue-dark));color:#fff;
}
.hero-news-btn-ic svg{width:15px;height:15px}
.hero-news-btn-arr{display:inline-flex;align-items:center;opacity:.8;transition:transform .25s}
.hero-news-btn-arr svg{width:15px;height:15px}
.hero-news-btn:hover .hero-news-btn-arr{transform:translateY(3px)}
@media(max-width:1100px){
  .hero-inner--solo{grid-template-columns:1fr;gap:1.6rem}
  .hero-inner--solo .hero-title{text-align:left}
  .hero-divider{display:none}
}

.hero-badge{display:inline-flex;align-items:center;gap:.5rem;background:rgba(37,99,168,.1);border:1px solid rgba(37,99,168,.22);color:var(--blue-mid);padding:.3rem .9rem;border-radius:100px;font-size:.72rem;font-weight:600;letter-spacing:.4px;margin-bottom:1.6rem}
.bp{width:6px;height:6px;border-radius:50%;background:var(--blue-mid);animation:bpulse 2s infinite;flex-shrink:0}
@keyframes bpulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.75)}}

.hero-title{font-family:var(--serif);font-size:clamp(1.9rem,3.5vw,3.2rem);line-height:1.12;letter-spacing:-.3px;margin-bottom:1.35rem;font-weight:700;color:var(--t1)}
.hero-title em{font-style:italic;color:var(--blue-mid)}

.hero-desc{font-size:1.1rem;color:var(--t2);max-width:540px;line-height:1.82;margin-bottom:2rem;font-weight:400}

.hero-acts{display:flex;gap:.75rem;flex-wrap:wrap;align-items:center;margin-bottom:2.75rem}
.btn-p{display:inline-flex;align-items:center;gap:.45rem;background:var(--blue-dark);color:#fff;padding:.78rem 1.75rem;border-radius:9px;font-weight:600;font-size:.875rem;border:none;transition:transform .2s,box-shadow .2s,background .2s}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 10px 36px rgba(26,74,122,.38);background:var(--blue-mid)}
.btn-p svg{width:15px;height:15px}
.btn-g{display:inline-flex;align-items:center;gap:.45rem;background:transparent;color:var(--t1);padding:.78rem 1.5rem;border-radius:9px;font-weight:500;font-size:.875rem;border:1px solid var(--bdr);transition:border-color var(--tr),background var(--tr),color var(--tr)}
.btn-g:hover{border-color:var(--blue-mid);color:var(--blue-mid);background:var(--accent-g)}
.btn-g svg{width:15px;height:15px}

/* Stats */
.hero-stats{display:flex;gap:2.5rem;flex-wrap:wrap;padding-top:2.25rem;border-top:1px solid var(--bdr)}
.stat{display:flex;flex-direction:column;gap:.18rem}
.snum{font-family:var(--serif);font-size:1.9rem;font-weight:700;color:var(--t1);letter-spacing:-1px;line-height:1;display:flex;align-items:baseline;gap:.1rem}
.snum .pl{color:var(--blue-mid);font-family:var(--sans);font-size:1.3rem;font-weight:700}
.slbl{font-size:.72rem;color:var(--t2)}

/* Hero card */
.hero-card{background:var(--card);border:1px solid var(--bdr);border-radius:18px;padding:1.6rem;box-shadow:0 20px 70px rgba(26,74,122,.1);position:relative;overflow:hidden}
.hero-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--blue-dark),var(--blue-pale))}
.card-lbl{font-size:.65rem;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--t3);margin-bottom:1.1rem;display:flex;align-items:center;gap:.45rem}
.card-lbl svg{width:12px;height:12px;color:var(--blue-mid)}
.ind-list{display:flex;flex-direction:column;gap:.85rem}
.ind-item{display:flex;flex-direction:column;gap:.38rem}
.ind-row{display:flex;justify-content:space-between;align-items:baseline}
.ind-name{font-size:.77rem;color:var(--t2);font-weight:500}
.ind-val{font-size:.82rem;font-weight:700;color:var(--t1)}
.ind-bar{height:3px;background:var(--bg3);border-radius:2px;overflow:hidden}
.ind-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--blue-dark),var(--blue-pale));width:0%;transition:width 1.5s var(--ease)}
hr.div{border:none;border-top:1px solid var(--bdr);margin:1.1rem 0}
.news-mini{display:flex;flex-direction:column;gap:.65rem}
.nmi{display:flex;gap:.65rem;align-items:flex-start}
.nmi-ico{width:30px;height:30px;border-radius:7px;background:var(--accent-g);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.nmi-ico svg{width:13px;height:13px;color:var(--blue-mid)}
.nmi-txt{font-size:.74rem;color:var(--t2);line-height:1.5}
.nmi-txt strong{color:var(--t1);font-weight:600;display:block;margin-bottom:.06rem}

/* ═══════════════════════════════
   SECTION HELPERS
═══════════════════════════════ */
.s-lbl{font-size:.66rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--blue-mid);margin-bottom:.8rem;display:flex;align-items:center;gap:.45rem}
.s-lbl::before{content:'';width:16px;height:2px;background:var(--blue-mid);border-radius:1px}
.s-title{font-family:var(--serif);font-size:clamp(2rem,3.5vw,3rem);font-weight:700;letter-spacing:-.3px;line-height:1.15;margin-bottom:.9rem;color:var(--t1)}
.s-desc{font-size:.9rem;color:var(--t2);line-height:1.82;max-width:500px}
.link-all{display:inline-flex;align-items:center;gap:.38rem;font-size:.8rem;font-weight:600;color:var(--blue-mid);padding:.52rem 1.1rem;border:1px solid rgba(37,99,168,.25);border-radius:7px;transition:background var(--tr),gap var(--tr)}
.link-all svg{width:13px;height:13px;transition:transform var(--tr)}
.link-all:hover{background:var(--accent-g)}
.link-all:hover svg{transform:translateX(3px)}

/* ═══════════════════════════════
   NEWS SECTION
═══════════════════════════════ */
#news{padding:5.5rem 0;background:var(--bg)}
.news-hdr{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:2.25rem;flex-wrap:wrap;gap:1rem}

/* Editorial 2-col layout: big + list */
.news-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}
.news-featured{display:flex;flex-direction:column;gap:0;border:1px solid var(--bdr);border-radius:4px;overflow:hidden;background:var(--card);transition:box-shadow .3s}
.news-featured:hover{box-shadow:0 8px 32px rgba(26,74,122,.1)}
.news-featured-img{height:240px;background:var(--blue-dark);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
.news-featured-img svg{color:rgba(255,255,255,.18);width:56px;height:56px}
.news-featured-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.news-featured:hover .news-featured-img img{transform:scale(1.04)}
.news-featured-body{padding:1.6rem}
.news-featured-cat{font-size:.68rem;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;color:var(--blue-mid);margin-bottom:.75rem}
.news-featured-body h3{font-family:var(--serif);font-size:1.22rem;font-weight:700;line-height:1.38;color:var(--t1);margin-bottom:.9rem;transition:color var(--tr)}
.news-featured:hover h3{color:var(--accent)}
.news-featured-body p{font-size:.84rem;color:var(--t2);line-height:1.72;margin-bottom:1.1rem}
.news-featured-meta{display:flex;align-items:center;justify-content:space-between;padding-top:.9rem;border-top:1px solid var(--bdr)}
.news-featured-date{font-size:.72rem;color:var(--t3);display:flex;align-items:center;gap:.35rem}
.news-featured-date svg{width:12px;height:12px}
.news-more{display:inline-flex;align-items:center;gap:.32rem;font-size:.75rem;font-weight:600;color:var(--blue-mid);transition:gap var(--tr)}
.news-more svg{width:13px;height:13px;transition:transform var(--tr)}
.news-featured:hover .news-more svg{transform:translateX(4px)}

/* Right: vertical list */
.news-list{display:flex;flex-direction:column}
.news-list-item{display:flex;gap:1rem;padding:1.1rem 0;border-bottom:1px solid var(--bdr);cursor:pointer;transition:background var(--tr);align-items:flex-start;position:relative}
.news-list-item:first-child{border-top:1px solid var(--bdr)}
.news-list-item::before{content:'';position:absolute;left:-1rem;top:0;bottom:0;width:2px;background:var(--blue-mid);transform:scaleY(0);transform-origin:top;transition:transform .25s var(--ease)}
.news-list-item:hover::before{transform:scaleY(1)}
.nli-thumb{width:120px;height:96px;border-radius:3px;background:var(--blue-dark);flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.nli-thumb img{width:100%;height:100%;object-fit:cover}
.nli-thumb svg{color:rgba(255,255,255,.25);width:30px;height:30px}
.nli-body{flex:1;min-width:0}
.nli-cat{font-size:.65rem;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--blue-mid);margin-bottom:.3rem}
.nli-title{font-size:.88rem;font-weight:600;color:var(--t1);line-height:1.42;margin-bottom:.38rem;transition:color var(--tr);display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.news-list-item:hover .nli-title{color:var(--accent)}
.nli-date{font-size:.68rem;color:var(--t3)}

/* Thumb variants */
.nli-thumb:nth-child(1){background:#0d2a4a}
.news-list-item:nth-child(2) .nli-thumb{background:#162040}
.news-list-item:nth-child(3) .nli-thumb{background:#0f2235}

.news-tag{font-size:.68rem;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--blue-mid)}
.news-views{display:flex;align-items:center;gap:.28rem;font-size:.7rem;color:var(--t3)}
.news-views svg{width:11px;height:11px}
.news-date{font-size:.7rem;color:var(--t3);display:inline-flex;align-items:center;gap:.3rem}
.news-date svg{width:11px;height:11px}
.news-footer{display:flex;justify-content:space-between;align-items:center;margin-top:auto}

@media(max-width:900px){.news-grid{grid-template-columns:1fr}}
@media(max-width:600px){.news-featured-img{height:180px}.news-featured-body{padding:1.2rem}}

/* ═══════════════════════════════
   PUBLICATIONS
═══════════════════════════════ */
#publications{padding:5.5rem 0;background:var(--bg2)}
.pub-hdr{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:0;flex-wrap:wrap;gap:1rem}
.pub-list{margin-top:1.75rem}
.pub-item{
  display:grid;
  grid-template-columns:2.2rem 4.5rem 1fr auto;
  align-items:center;
  gap:1rem;
  padding:1.1rem 1rem;
  border-bottom:1px solid var(--bdr);
  cursor:pointer;
  transition:background var(--tr);
  border-left:3px solid transparent;
}
.pub-item:first-child{border-top:1px solid var(--bdr)}
.pub-item:hover{background:var(--bg3);border-left-color:var(--blue-mid)}
.pub-item:hover .ptitle{color:var(--accent)}
.pub-item:hover .parr svg{transform:translateX(4px);color:var(--blue-mid)}
.pub-n{font-size:.75rem;font-weight:700;color:var(--t3);text-align:center;font-variant-numeric:tabular-nums}
.pub-ico{width:68px;height:68px;border-radius:3px;background:var(--blue-dark);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.pub-ico img{width:100%;height:100%;object-fit:cover}
.pub-ico svg{width:24px;height:24px;color:rgba(255,255,255,.65)}
.pub-body{min-width:0}
.ptitle{font-size:.92rem;font-weight:600;margin-bottom:.3rem;transition:color var(--tr);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--t1)}
.pmeta{font-size:.72rem;color:var(--t3);display:flex;gap:.75rem;flex-wrap:wrap;align-items:center}
.ptag{font-size:.65rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--blue-mid)}
.parr{color:var(--t3);flex-shrink:0}
.parr svg{width:16px;height:16px;transition:transform var(--tr),color var(--tr)}

/* ═══════════════════════════════
   JOURNALS
═══════════════════════════════ */
#journals{padding:5.5rem 0;background:var(--bg)}
.journals-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;margin-top:2rem}
.j-card{
  display:flex;flex-direction:column;
  border:1px solid var(--bdr);
  overflow:hidden;
  transition:box-shadow .3s,border-color .3s,transform .3s;
  background:var(--card);
  border-radius:3px;
}
.j-card:hover{
  box-shadow:0 12px 40px rgba(26,74,122,.14);
  border-color:var(--bdr-h);
  transform:translateY(-4px);
}
/* Journal cover - looks like a real journal */
.j-card-img{
  height:380px;overflow:hidden;position:relative;flex-shrink:0;
  background:var(--bg3);
  display:flex;align-items:center;justify-content:center;
  padding:.5rem;
}
.j-card-img img{width:100%;height:100%;object-fit:contain;transition:transform .4s}
.j-card:hover .j-card-img img{transform:scale(1.04)}
.j-card-img-placeholder{
  width:100%;height:100%;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:.65rem;
  padding:1.25rem;
  background:var(--blue-dark);
  position:relative;
}
.j-card-img-placeholder::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.04) 0%,transparent 100%);
  border-bottom:2px solid rgba(255,255,255,.1);
}
.j-card-img-placeholder::after{
  content:'IMRS';
  position:absolute;top:.9rem;left:1rem;
  font-size:.6rem;font-weight:800;letter-spacing:2.5px;
  color:rgba(255,255,255,.35);
}
.j-card-img-placeholder svg{
  color:rgba(255,255,255,.2);width:32px;height:32px;position:relative;
}
.j-card-img-placeholder .j-issue{
  position:relative;
  font-family:var(--serif);font-size:1.05rem;font-weight:700;
  color:rgba(255,255,255,.9);text-align:center;line-height:1.3;
}
.j-card-img-placeholder .j-year-label{
  position:relative;
  font-size:.62rem;letter-spacing:1px;text-transform:uppercase;
  color:rgba(255,255,255,.45);
}
.j-card-body{
  padding:.9rem 1rem 1rem;
  flex:1;display:flex;flex-direction:column;justify-content:space-between;
  border-top:3px solid var(--blue-mid);
}
.j-card-body h4{font-size:.82rem;font-weight:600;color:var(--t1);line-height:1.4;transition:color var(--tr);margin-bottom:.3rem}
.j-card:hover h4{color:var(--accent)}
.j-card-year{font-size:.68rem;color:var(--t3);font-weight:500}
@media(max-width:900px){.journals-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:500px){.journals-grid{grid-template-columns:1fr 1fr}}

/* ═══════════════════════════════
   INFOGRAPHICS
═══════════════════════════════ */
#infographics{padding:6rem 0}
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem;margin-top:2.25rem}
.info-card{border:1px solid var(--bdr);border-radius:12px;overflow:hidden;position:relative;aspect-ratio:4/3;background:var(--bg3);transition:transform .3s,box-shadow .3s}
.info-card:hover{transform:translateY(-3px);box-shadow:0 14px 44px rgba(26,74,122,.12)}
.info-card-placeholder{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;padding:1rem;text-align:center}
.info-card-placeholder svg{width:32px;height:32px;color:var(--blue-mid);opacity:.5}
.info-card-placeholder p{font-size:.75rem;color:var(--t2);line-height:1.4}

/* ═══════════════════════════════
   PARTNERS
═══════════════════════════════ */
#partners{padding:5rem 0;background:var(--bg2);border-top:1px solid var(--bdr);border-bottom:1px solid var(--bdr)}
.p-lbl{text-align:center;font-size:.67rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--t3);margin-bottom:2.25rem}
.p-sub{text-align:center;font-size:.75rem;color:var(--t2);margin-bottom:1.25rem;font-weight:600}
.swiper-partners .swiper-slide{display:flex;align-items:center;justify-content:center;width:auto!important}
.p-logo{display:flex;align-items:center;justify-content:center;padding:.9rem 1.6rem;border:1px solid var(--bdr);border-radius:9px;height:96px;min-width:170px;background:var(--card);transition:border-color var(--tr),box-shadow var(--tr),transform var(--tr)}
.p-logo img{max-height:64px;max-width:150px;width:auto;height:auto;object-fit:contain;filter:grayscale(15%);opacity:.92;transition:filter var(--tr),opacity var(--tr)}
.p-logo:hover{border-color:var(--bdr-h);box-shadow:0 8px 28px rgba(26,74,122,.12);transform:translateY(-2px)}
.p-logo:hover img{filter:grayscale(0);opacity:1}

/* ═══════════════════════════════
   CTA
═══════════════════════════════ */
#cta{padding:5.5rem 0;background:linear-gradient(135deg,var(--blue-dark) 0%,var(--blue-mid) 55%,var(--blue-light) 100%);position:relative;overflow:hidden;text-align:center}
#cta::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:48px 48px}
.cta-in{position:relative;z-index:1}
.cta-in .s-lbl{color:rgba(255,255,255,.55);justify-content:center}
.cta-in .s-lbl::before{background:rgba(255,255,255,.45)}
.cta-in h2{font-family:var(--serif);font-size:clamp(1.9rem,3.8vw,3rem);color:#fff;font-weight:700;margin-bottom:.9rem}
.cta-in p{font-size:.93rem;color:rgba(255,255,255,.75);margin-bottom:1.85rem;max-width:480px;margin-left:auto;margin-right:auto}
.btn-w{display:inline-flex;align-items:center;gap:.45rem;background:#fff;color:var(--blue-dark);padding:.82rem 1.9rem;border-radius:9px;font-weight:700;font-size:.875rem;border:none;transition:transform .2s,box-shadow .2s}
.btn-w:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,.2)}
.btn-w svg{width:15px;height:15px}

/* ═══════════════════════════════
   FOOTER
═══════════════════════════════ */
#ftr{background:#0b1a2b ;color:rgba(255,255,255,.85);padding:4.5rem 0 0}
.ftr-grid{display:grid;grid-template-columns:1.8fr 1fr 1fr 1.1fr;gap:3rem;margin-bottom:3rem}

/* Brand */
.ftr-logo{display:flex;align-items:center;gap:.7rem;margin-bottom:1.1rem}
.ftr-logo-ico{width:44px;height:44px;background:rgba(255,255,255,.15);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff;border:1px solid rgba(255,255,255,.2)}
.ftr-logo-ico svg{width:20px;height:20px}
.ftr-logo-txt strong{font-size:1.05rem;font-weight:700;letter-spacing:.5px;color:#fff}
.ftr-logo-txt span{font-size:.72rem;color:rgba(255,255,255,.55);display:block;letter-spacing:.2px}
.ftr-desc{font-size:.9rem;color:rgba(255,255,255,.6);line-height:1.82;max-width:260px;margin-bottom:1.25rem}
.ftr-address{font-size:.88rem;color:rgba(255,255,255,.65);line-height:1.75;margin-bottom:1.25rem;display:flex;flex-direction:column;gap:.5rem}
.ftr-address span{display:flex;align-items:flex-start;gap:.5rem}
.ftr-address span svg{width:14px;height:14px;flex-shrink:0;margin-top:2px;opacity:.7;color:var(--blue-pale)}
.socials{display:flex;gap:.45rem;flex-wrap:wrap}
.soc-a{display:flex;align-items:center;gap:.45rem;padding:.44rem .88rem;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);border-radius:7px;font-size:.82rem;font-weight:500;color:rgba(255,255,255,.8);transition:background var(--tr),border-color var(--tr),color var(--tr);white-space:nowrap}
.soc-a svg{width:14px;height:14px;flex-shrink:0}
.soc-a:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.3);color:#fff}

/* Footer col */
.fcol h4{font-size:.76rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:1.1rem;padding-bottom:.55rem;border-bottom:1px solid rgba(255,255,255,.1)}
.fcol ul{list-style:none;display:flex;flex-direction:column;gap:.5rem}
.fcol a{font-size:.9rem;color:rgba(255,255,255,.65);display:flex;align-items:center;gap:.4rem;transition:color var(--tr),gap var(--tr)}
.fcol a svg{width:11px;height:11px;opacity:0;transition:opacity var(--tr);flex-shrink:0;color:var(--blue-pale)}
.fcol a:hover{color:#fff;gap:.58rem}
.fcol a:hover svg{opacity:1}

/* Footer bottom */
.ftr-bot{border-top:1px solid rgba(255,255,255,.1);padding:1.35rem 0;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.ftr-bot p{font-size:.83rem;color:rgba(255,255,255,.45)}
.fbot-links{display:flex;gap:1.4rem;list-style:none}
.fbot-links a{font-size:.83rem;color:rgba(255,255,255,.45);transition:color var(--tr)}
.fbot-links a:hover{color:rgba(255,255,255,.8)}

/* ═══════════════════════════════
   SCROLL TOP
═══════════════════════════════ */
#stb{position:fixed;bottom:1.75rem;right:1.75rem;width:42px;height:42px;background:var(--blue-mid);border:none;border-radius:11px;z-index:400;display:flex;align-items:center;justify-content:center;color:#fff;opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity var(--tr),transform var(--tr),box-shadow .2s}
#stb.sh{opacity:1;pointer-events:all;transform:none}
#stb:hover{box-shadow:0 6px 22px rgba(37,99,168,.4)}
#stb svg{width:17px;height:17px}

/* ═══════════════════════════════
   RESPONSIVE
═══════════════════════════════ */

/* ── Large desktop (≤1700px) — start trimming nav ── */
@media(max-width:1700px){
  .nav-item>a{padding:.3rem .62rem;font-size:.82rem}
  .nav-item>a svg{width:14px;height:14px}
  .nav-item>a svg:last-child{width:11px;height:11px}
  .logo{padding-right:1rem;margin-right:.5rem}
  .nav-right{gap:.4rem}
}

/* ── ≤1500px — 8 ta bo'lim sig'ishi uchun: yetakchi ikonlarni yashiramiz, ixchamlashtiramiz ── */
@media(max-width:1500px){
  .nav-item>a{padding:.3rem .5rem;font-size:.8rem;gap:.2rem}
  .nav-item>a svg:first-child{display:none}        /* yetakchi ikon — yashirin */
  .nav-item>a svg:last-child{width:10px;height:10px}
  .logo-img{height:38px}
  .logo{padding-right:.7rem;margin-right:.3rem}
  .lang-dd-globe{display:none}                      /* til tugmasi — ixcham (globus yashirin) */
  .lang-dd-toggle{padding:0 .45rem;gap:.25rem}
  .ico-btn{width:36px;height:36px}
  .ico-btn svg{width:17px;height:17px}
  .btn-proposal{padding:.4rem .75rem;font-size:.78rem}
  .btn-proposal svg{width:13px;height:13px}
  .nav-right{gap:.3rem;padding-left:.5rem}
}

/* ── ≤1400px — yana tig'izroq (burger 1340px da yoqiladi) ── */
@media(max-width:1400px){
  .nav-item>a{padding:.3rem .4rem;font-size:.76rem}
}

/* ── ≤1785px — burger (mobil menyu): 8 ta bo'lim sig'masligi uchun ── */
@media(max-width:1785px){
  .nav-links{display:none}
  .burger{display:flex}
  .mob-nav{display:block;top:68px}
  .logo{margin-right:auto;border-right:none;padding-right:1rem}
}

/* ── Hero / grid breakpoints decoupled from nav ── */
@media(max-width:1100px){
  .hero-inner{grid-template-columns:1fr;gap:2.5rem}
  .hero-card{display:none}
  .news-grid{grid-template-columns:repeat(2,1fr)}
  .journals-grid{grid-template-columns:repeat(3,1fr)}
  .ftr-grid{grid-template-columns:1.5fr 1fr 1fr;gap:2rem}
  .ftr-grid > div:nth-child(4){grid-column:1/-1}
}

/* ── Tablet portrait / mobile landscape (≤900px) ── */
@media(max-width:900px){
  .mob-nav{top:64px}
  .nav-wrap{height:64px}
  .news-grid{grid-template-columns:1fr}
  .logo{padding-right:1rem;margin-right:auto;border-right:none}
  .logo-ico{width:38px;height:38px}
  .logo-ico svg{width:18px;height:18px}
  .logo-txt strong{font-size:.95rem}
  .logo-txt span{font-size:.65rem}
  .ticker{padding:.5rem 0}
  .t-item{padding:0 1.5rem;font-size:.78rem}
  .ftr-grid{grid-template-columns:1fr 1fr;gap:2rem}
  .ftr-grid > div:nth-child(1){grid-column:1/-1}
  .ftr-grid > div:nth-child(4){grid-column:auto}
  .journals-grid{grid-template-columns:repeat(2,1fr)}
  .info-grid{grid-template-columns:repeat(2,1fr)}
  #hero{min-height:auto;padding:90px 0 50px}
  .hero-title{font-size:clamp(1.7rem,5.5vw,2.8rem)}
  .hero-desc{font-size:1rem}
  .hero-stats{gap:1.75rem}
  .news-list-item::before{display:none}
  #news,#publications,#journals,#partners{padding:4rem 0}
  #cta{padding:4.5rem 0}
  .pub-item{grid-template-columns:2rem 2.4rem 1fr auto;gap:.75rem;padding:1rem .5rem}
  .ptitle{font-size:.88rem}
}

/* ── Mobile (≤640px) ── */
@media(max-width:640px){
  .news-grid,.info-grid{grid-template-columns:1fr}
  .ftr-grid{grid-template-columns:1fr 1fr;gap:1.75rem}
  .ftr-grid > div:nth-child(1){grid-column:1/-1}
  .hero-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem 1.5rem;padding-top:1.75rem}
  #hero{padding:80px 0 40px}
  .hero-title{font-size:clamp(1.6rem,7vw,2.4rem);line-height:1.18;margin-bottom:1rem}
  .hero-title br{display:none}
  .hero-desc{font-size:.95rem;line-height:1.7;margin-bottom:1.5rem}
  .hero-badge{font-size:.66rem;padding:.28rem .75rem;margin-bottom:1.2rem}
  .hero-acts{margin-bottom:2rem;gap:.6rem}
  .btn-p,.btn-g{padding:.72rem 1.25rem;font-size:.84rem}
  .snum{font-size:1.55rem}
  .snum .pl{font-size:1.05rem}
  .slbl{font-size:.7rem}
  .s-title{font-size:clamp(1.55rem,5.5vw,2.1rem)}
  .news-hdr,.pub-hdr{margin-bottom:1.5rem}
  .news-featured-img{height:200px}
  .news-featured-body{padding:1.2rem}
  .news-featured-body h3{font-size:1.1rem}
  .nli-thumb{width:96px;height:80px}
  .nli-title{font-size:.85rem}
  .pub-item{grid-template-columns:1.6rem 3.4rem 1fr;gap:.65rem;padding:.95rem .35rem}
  .pub-item .parr{display:none}
  .ptitle{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.86rem;line-height:1.4}
  .pmeta{font-size:.68rem;gap:.55rem}
  .pub-ico{width:54px;height:54px}
  .j-card-img{height:340px}
  #ftr{padding:3.5rem 0 0}
  .ftr-logo-ico{width:36px;height:36px}
  .ftr-logo-txt strong{font-size:.95rem}
  .ftr-address{font-size:.84rem}
  .fcol a{font-size:.86rem}
  .ftr-bot{flex-direction:column;align-items:flex-start;gap:.75rem;padding:1.1rem 0}
  .fbot-links{flex-wrap:wrap;gap:.9rem 1.1rem}
  #stb{bottom:1rem;right:1rem;width:40px;height:40px}
  .ticker{padding:.45rem 0}
  .t-item{padding:0 1.1rem;font-size:.74rem}
}

/* ── Small mobile (≤480px) ── */
@media(max-width:480px){
  .nav-wrap{height:60px}
  .mob-nav{top:60px}
  .logo-txt span{display:none}
  .nav-right .lang-sw{display:none}
  .nav-right{padding-left:.5rem;gap:.4rem}
  .ico-btn{width:32px;height:32px}
  .ico-btn svg{width:14px;height:14px}
  .burger{width:32px;height:32px}
  .btn-proposal{padding:.4rem .55rem;font-size:0;gap:0}
  .btn-proposal svg{width:15px;height:15px;margin:0}
  #hero{padding:75px 0 36px}
  .hero-acts{flex-direction:column;align-items:stretch}
  .hero-acts .btn-p,.hero-acts .btn-g{justify-content:center;width:100%}
  .ftr-grid{grid-template-columns:1fr}
  .ftr-grid > div:nth-child(1){grid-column:auto}
  .socials{gap:.4rem}
  .soc-a{padding:.4rem .7rem;font-size:.78rem}
  .journals-grid{grid-template-columns:1fr 1fr;gap:1rem}
  .j-card-img{height:300px}
  .pub-item{grid-template-columns:1.4rem 3rem 1fr;gap:.55rem;padding:.85rem .25rem}
  .pub-n{font-size:.7rem}
  .pub-ico{width:46px;height:46px}
  .news-featured-img{height:170px}
  .news-featured-body{padding:1rem}
  .news-list-item{padding:.9rem 0;gap:.75rem}
  .nli-thumb{width:88px;height:74px}
  .container{padding:0 1rem}
  .swiper-partners .swiper-slide .p-logo{padding:.7rem 1.1rem;height:78px;min-width:140px}
  .swiper-partners .swiper-slide .p-logo img{max-height:50px;max-width:120px}
  .cta-in h2{font-size:clamp(1.55rem,6.5vw,2.2rem)}
  .cta-in p{font-size:.86rem}
  .btn-w{padding:.72rem 1.5rem;font-size:.82rem}
}

/* ── Extra small (≤360px) ── */
@media(max-width:360px){
  .container{padding:0 .85rem}
  .logo-ico{width:34px;height:34px}
  .logo-ico svg{width:16px;height:16px}
  .logo-txt strong{font-size:.88rem}
  .hero-title{font-size:1.45rem}
  .hero-desc{font-size:.9rem}
  .hero-stats{grid-template-columns:1fr 1fr;gap:1rem}
  .snum{font-size:1.4rem}
  .journals-grid{grid-template-columns:1fr;gap:.9rem}
  .j-card-img{height:360px}
  .news-featured-img{height:150px}
  .pub-item{grid-template-columns:2rem 1fr;padding:.8rem .2rem}
  .pub-item .pub-ico{display:none}
  .ftr-bot p,.fbot-links a{font-size:.78rem}
}

/* ── Landscape phones (short height) ── */
@media(max-height:500px) and (orientation:landscape){
  #hero{min-height:auto;padding:90px 0 40px}
  .hero-stats{gap:1.25rem;padding-top:1.5rem}
}

/* ── Print ── */
@media print{
  #hdr,.ticker,#stb,.mob-nav,#pbar,.hero-crumb,.hero-video-bg,.hero-video-overlay{display:none!important}
  body{background:#fff;color:#000}
  #hero{padding:1rem 0;min-height:auto;background:#fff}
}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.15s!important}.ticker-track{animation:none}}

/* ═══════════════════════════════════════════════════
   POLISH PASS — Typography (1) + Cards/Colors (3)
═══════════════════════════════════════════════════ */

/* ── Extended palette: gold accent + deeper navy ── */
:root{
  --gold:        #c9a961;
  --gold-soft:   #e6d4a3;
  --gold-warm:   #b08d3f;
  --navy-deep:   #082242;
  --ink:         #051628;
}
[data-theme="light"]{
  --shadow-1: 0 1px 2px rgba(13,30,48,.04);
  --shadow-2: 0 4px 10px rgba(13,30,48,.05);
  --shadow-3: 0 14px 36px rgba(13,30,48,.08);
  --shadow-4: 0 32px 72px rgba(26,74,122,.10);
  --inner-glow: inset 0 1px 0 rgba(255,255,255,.85);
  --section-grad: radial-gradient(circle at 50% -10%, rgba(59,130,196,.06) 0%, transparent 55%);
}
[data-theme="dark"]{
  --shadow-1: 0 1px 2px rgba(0,0,0,.4);
  --shadow-2: 0 6px 16px rgba(0,0,0,.4);
  --shadow-3: 0 18px 48px rgba(0,0,0,.5);
  --shadow-4: 0 36px 80px rgba(0,0,0,.6);
  --inner-glow: inset 0 1px 0 rgba(255,255,255,.06);
  --section-grad: radial-gradient(circle at 50% -10%, rgba(59,130,196,.10) 0%, transparent 55%);
}

/* ── SECTION NUMBERING (01 / 02 / 03 / 04) ── */
body{counter-reset: section}
#news .s-lbl, #publications .s-lbl, #journals .s-lbl, #partners .p-lbl{
  counter-increment: section;
  position:relative;padding-left:0;
  font-size:.7rem;letter-spacing:2.6px;font-weight:700;
  display:inline-flex;align-items:center;gap:.7rem;
  color:var(--blue-mid);
}
#news .s-lbl::before, #publications .s-lbl::before, #journals .s-lbl::before, #partners .p-lbl::before{
  content: counter(section, decimal-leading-zero);
  width:auto;height:auto;background:none;
  font-family: var(--serif);
  font-size:1.05rem;font-weight:800;font-style:italic;
  letter-spacing:0;
  color:var(--gold-warm);
  padding-right:.65rem;
  border-right:1px solid var(--bdr);
  line-height:1;
  display:inline-block;
}
[data-theme="dark"] #news .s-lbl::before,
[data-theme="dark"] #publications .s-lbl::before,
[data-theme="dark"] #journals .s-lbl::before,
[data-theme="dark"] #partners .p-lbl::before{color:var(--gold-soft)}

/* ── SECTION TITLE: gradient text + bigger display ── */
.s-title{
  font-family: var(--serif);
  font-size: clamp(2.2rem, 4vw, 3.6rem);
  font-weight: 700;
  letter-spacing: -.6px;
  line-height: 1.08;
  margin-top:.35rem;margin-bottom:.9rem;
  background: linear-gradient(135deg, var(--t1) 0%, var(--t1) 45%, var(--blue-mid) 100%);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
          color: transparent;
  position: relative;
  display: inline-block;
}
[data-theme="dark"] .s-title{
  background: linear-gradient(135deg, #ffffff 0%, #cfe1f5 50%, var(--blue-pale) 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}
.s-title::after{
  content:'';position:absolute;left:0;bottom:-.45rem;
  width:48px;height:3px;border-radius:2px;
  background: linear-gradient(90deg, var(--gold-warm), var(--gold) 60%, transparent);
}

/* ── PARTNERS subhead refinement ── */
.p-sub{
  font-family: var(--serif);
  font-size: clamp(1.6rem, 2.6vw, 2.4rem);
  font-weight: 700;letter-spacing:-.4px;line-height:1.15;
  margin-top:.35rem;color:var(--t1);
}

/* ── SECTION BACKGROUND ATMOSPHERE (subtle warm-cool gradient) ── */
#news, #publications, #journals, #partners{
  background-image: var(--section-grad);
  background-repeat: no-repeat;
  background-size: 100% 60%;
  background-position: top center;
}

/* ── SECTION DIVIDER (refined gradient line w/ accent dot) ── */
#news::before, #publications::before, #journals::before, #partners::before{
  width: min(900px, 84%);
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity: .55;
}

/* ── CARDS: multi-layer depth + inner glow + softer corners ── */
.news-featured, .j-card{
  border-radius: 12px;
  box-shadow: var(--shadow-1), var(--shadow-2);
  background: var(--card);
}
.news-featured:hover, .j-card:hover{
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3), var(--shadow-4), var(--inner-glow), 0 0 0 1px rgba(59,130,196,.18);
  border-color: transparent;
}
.j-card-body{
  border-top: 0;
  position: relative;
}
.j-card-body::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold-warm) 70%, var(--gold));
  opacity:.95;
}

/* ── NEWS LIST items: refined hover + gold accent ── */
.news-list-item::before{
  background: linear-gradient(180deg, var(--blue-mid), var(--gold));
  width:3px;
}
.nli-thumb{border-radius:6px;box-shadow:var(--shadow-1)}

/* ── PUBLICATIONS rows: refined ── */
.pub-item{transition: background var(--tr), border-left-color .25s var(--ease), padding-left .25s var(--ease)}
.pub-item:hover{
  background: linear-gradient(90deg, var(--accent-g), transparent 70%);
  border-left-color: var(--gold-warm);
  padding-left: 1.35rem;
}
.pub-ico{border-radius:7px;box-shadow:var(--shadow-1)}
.pub-n{
  font-family: var(--serif);font-style:italic;font-weight:700;
  font-size: 1rem; color: var(--gold-warm);
}

/* ── HERO TITLE polish ── */
#hero .hero-title em{
  background: linear-gradient(135deg, #7ec8f5 0%, #c9a961 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  color: transparent;
  font-style: italic;
  text-shadow:none;
  position:relative;
  display:inline-block;
}
#hero .hero-title em::after{
  content:'';position:absolute;left:0;right:.2em;bottom:-.05em;height:2px;
  background: linear-gradient(90deg, transparent, rgba(201,169,97,.6), transparent);
  opacity:.8;
}
#hero .hero-badge{
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.32);
  backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);
  box-shadow: 0 6px 20px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.18);
}
#hero .bp{background:#c9a961;box-shadow:0 0 12px rgba(201,169,97,.6)}

/* ── HERO STATS: glassmorphic + serif numerals ── */
.hero-stats{gap:1.5rem 2rem}
.snum{
  font-family: var(--serif);
  font-size: clamp(1.9rem, 3vw, 2.4rem);
  font-weight: 700;letter-spacing:-1px;
}
#hero .snum .pl{color:#c9a961;font-style:italic;font-family:var(--serif)}

/* ── BUTTONS: refined with gold accent ── */
.btn-p{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  box-shadow: 0 6px 18px rgba(26,74,122,.32), inset 0 1px 0 rgba(255,255,255,.16);
  border-radius:11px;
}
.btn-p:hover{
  background: linear-gradient(135deg, var(--blue-mid), var(--blue-light));
  box-shadow: 0 12px 36px rgba(26,74,122,.42), inset 0 1px 0 rgba(255,255,255,.22);
}
.btn-g{border-radius:11px}

/* ── LINK-ALL pill: accent gold dot ── */
.link-all{
  position:relative;
  border-color: var(--bdr);
  background: var(--card);
  box-shadow: var(--shadow-1);
  border-radius: 100px;padding:.55rem 1.15rem .55rem 1.5rem;
}
.link-all::before{
  content:'';position:absolute;left:.7rem;top:50%;transform:translateY(-50%);
  width:6px;height:6px;border-radius:50%;background:var(--gold);
  box-shadow:0 0 8px rgba(201,169,97,.65);
}

/* ── REVEAL TAG (news featured hover) — gold accent ── */
.news-featured-img .reveal-tag{
  background: linear-gradient(135deg, rgba(255,255,255,.12), rgba(201,169,97,.18));
  border-color: rgba(201,169,97,.55);
}

/* ── JOURNAL card year badge ── */
.j-card-year{
  display:inline-flex;align-items:center;gap:.4rem;
  font-family: var(--serif);font-style:italic;
}
.j-card-year::before{
  content:'';width:5px;height:5px;border-radius:50%;
  background: var(--gold);box-shadow: 0 0 6px rgba(201,169,97,.55);
}

/* ── FOOTER polish ── */
#ftr{position:relative;overflow:hidden}
#ftr::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity:.45;
}
.ftr-logo-ico{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  box-shadow: 0 6px 20px rgba(26,74,122,.32), inset 0 1px 0 rgba(255,255,255,.18);
}

/* ── CTA section gold dot ── */
.cta-in h2{position:relative;display:inline-block}

/* ── Mobile typography adjustments ── */
@media(max-width:600px){
  .s-title{font-size:clamp(1.7rem, 6vw, 2.4rem)}
  .s-title::after{width:36px}
  #news .s-lbl::before, #publications .s-lbl::before, #journals .s-lbl::before, #partners .p-lbl::before{font-size:.92rem;padding-right:.55rem}
}

/* ═══════════════════════════════════════════════════
   LOGO IMAGES — theme-aware (header) + footer
═══════════════════════════════════════════════════ */
.logo{display:inline-flex;align-items:center}
.logo-img{height:46px;width:auto;display:block;transition:opacity .25s ease}
.logo-img-dark{display:none}
[data-theme="dark"] .logo-img-light{display:none}
[data-theme="dark"] .logo-img-dark{display:block}
.logo:hover .logo-img{opacity:.86}

.ftr-logo{margin-bottom:1.2rem}
.ftr-logo-img{height:48px;width:auto;display:block;max-width:100%}

/* Mobile sizing */
@media(max-width:900px){
  .logo-img{height:34px}
  .ftr-logo-img{height:42px}
}
@media(max-width:480px){
  .logo-img{height:30px}
  .ftr-logo-img{height:38px}
}

/* ═══════════════════════════════════════════════════
   HERO SIDE — Glassmorphic featured journal card
═══════════════════════════════════════════════════ */
.hero-side{display:flex;justify-content:flex-end;position:relative;z-index:3}
.hero-feature{
  position:relative;display:flex;flex-direction:column;gap:1.1rem;
  width:100%;max-width:380px;padding:1.4rem 1.4rem 1.25rem;
  background: linear-gradient(160deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 20px;
  backdrop-filter: blur(22px) saturate(140%);
  -webkit-backdrop-filter: blur(22px) saturate(140%);
  box-shadow:
    0 30px 70px rgba(4,12,26,.45),
    0 8px 28px rgba(4,12,26,.3),
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(0,0,0,.18);
  overflow:hidden;
  transition: transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s, border-color .5s;
  isolation:isolate;
}
.hero-feature::before{
  content:'';position:absolute;inset:-1px;border-radius:inherit;z-index:-1;pointer-events:none;
  background: conic-gradient(from 120deg, transparent, rgba(126,200,245,.5), rgba(201,169,97,.4), transparent 60%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  padding:1px; opacity:.55;
}
.hero-feature:hover{
  transform: translateY(-6px);
  border-color: rgba(255,255,255,.32);
  box-shadow:
    0 42px 90px rgba(4,12,26,.55),
    0 12px 36px rgba(4,12,26,.35),
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 -1px 0 rgba(0,0,0,.18);
}
.hf-shine{
  position:absolute;top:-40%;left:-30%;width:60%;height:180%;
  background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,.18) 50%, transparent 60%);
  transform: rotate(8deg);
  pointer-events:none;opacity:0;transition:opacity .6s, transform 1.2s cubic-bezier(.22,1,.36,1);
  z-index:1;
}
.hero-feature:hover .hf-shine{opacity:1; transform: rotate(8deg) translateX(280%)}

.hf-top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.hf-label{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.66rem;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;
  color: rgba(255,255,255,.82);
}
.hf-dot{
  width:7px;height:7px;border-radius:50%;
  background: var(--gold);
  box-shadow: 0 0 10px rgba(201,169,97,.7);
  animation: bpulse 2s infinite;
}
.hf-badge{
  font-family: var(--serif);font-style:italic;
  font-size:.85rem;font-weight:700;
  padding:.28rem .7rem;border-radius:30px;
  color:#fff;
  background: linear-gradient(135deg, rgba(201,169,97,.25), rgba(126,200,245,.18));
  border: 1px solid rgba(255,255,255,.28);
  letter-spacing:.5px;
}
.hf-cover{
  position:relative;border-radius:12px;overflow:hidden;
  aspect-ratio: 5/6.5;
  background: rgba(0,0,0,.18);
  box-shadow: 0 14px 38px rgba(0,0,0,.4), inset 0 0 0 1px rgba(255,255,255,.08);
}
.hf-cover img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition: transform .8s cubic-bezier(.22,1,.36,1);
}
.hero-feature:hover .hf-cover img{transform: scale(1.05)}
.hf-cover::after{
  content:'';position:absolute;inset:0;
  background: linear-gradient(180deg, transparent 60%, rgba(0,0,0,.45));
  pointer-events:none;
}
.hf-meta{display:flex;flex-direction:column;gap:.25rem;color:#fff}
.hf-title{
  font-family: var(--serif);
  font-size:1.05rem;font-weight:700;line-height:1.32;
  color:#fff;letter-spacing:-.2px;
}
.hf-sub{
  font-size:.74rem;color:rgba(255,255,255,.72);
  letter-spacing:.3px;
}
.hf-foot{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding-top:.85rem;
  border-top:1px solid rgba(255,255,255,.14);
}
.hf-cta{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:.82rem;font-weight:600;color:#fff;
  transition: gap .25s var(--ease);
}
.hf-cta svg{transition: transform .25s var(--ease)}
.hero-feature:hover .hf-cta{gap:.65rem}
.hero-feature:hover .hf-cta svg{transform: translateX(3px)}
.hf-tag{
  font-size:.68rem;font-weight:600;letter-spacing:1px;
  color: rgba(201,169,97,.95);text-transform:uppercase;
}

/* News variant — landscape cover, tighter footer */
.hero-feature--news .hf-cover{aspect-ratio:16/10}
.hero-feature--news .hf-title{font-size:1rem;line-height:1.38;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ── Hero responsive: stack on tablet ── */
@media(max-width:1024px){
  .hero-inner{grid-template-columns: 1fr; gap:2.5rem; max-width:720px}
  .hero-side{justify-content:flex-start}
  .hero-feature{max-width:420px}
}
@media(max-width:600px){
  .hero-feature{padding:1.1rem 1.1rem 1rem;border-radius:16px}
  .hf-cover{aspect-ratio: 5/5.5}
}
/* ═══════════════════════════════════════════════════
   PAGE HERO (inner pages — Tarix etc.)
═══════════════════════════════════════════════════ */
.page-hero{
  position:relative;
  padding: 9.5rem 0 7.5rem;
  background: linear-gradient(135deg, var(--blue-dark) 0%, var(--navy-deep) 70%, var(--ink) 100%);
  color: #fff;
  overflow: hidden;
  isolation: isolate;
}
.page-hero::before{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(circle at 18% 28%, rgba(126,200,245,.18) 0%, transparent 45%),
    radial-gradient(circle at 82% 72%, rgba(201,169,97,.14) 0%, transparent 50%);
}
.page-hero::after{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:
    linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse at center, #000 30%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 70%);
  opacity: .55;
}
.page-hero .container{position:relative; z-index:2}

.breadcrumb{
  display:inline-flex; flex-wrap:wrap; gap:.5rem; align-items:center;
  font-size:.78rem; color: rgba(255,255,255,.72);
  margin-bottom: 1.6rem; letter-spacing:.4px;
}
.breadcrumb a{color: rgba(255,255,255,.78); transition: color .2s}
.breadcrumb a:hover{color:#fff}
.breadcrumb svg{width:11px; height:11px; opacity:.5}
.breadcrumb [aria-current]{color: var(--gold-soft); font-weight:600}

.page-hero-grid{
  display:grid; grid-template-columns: 1.2fr .8fr; gap: 3rem; align-items:end;
}
.page-hero-eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.7rem; font-weight:700; letter-spacing:2.5px; text-transform:uppercase;
  color: var(--gold-soft);
  margin-bottom: 1.1rem;
}
.page-hero-eyebrow::before{
  content:''; width:24px; height:1.5px; background: var(--gold); border-radius:1px;
}
.page-hero-title{
  font-family: var(--serif);
  font-size: clamp(2.4rem, 5vw, 2.4rem);
  font-weight: 700; letter-spacing: -.8px; line-height: 1.05;
  margin-bottom: 1.25rem;
  color:#fff;
}
.page-hero-title em{
  font-style: italic;
  background: linear-gradient(135deg, #7ec8f5 0%, var(--gold) 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.page-hero-sub{
  font-size: 1.02rem;
  color: rgba(255,255,255,.78);
  max-width: 640px;
  line-height: 1.78;
}
.page-hero-meta{
  display:grid; grid-template-columns: repeat(2,1fr); gap: 1.25rem 1.5rem;
  padding: 1.5rem 1.6rem;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 18px;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14);
}
.page-hero-meta .stat{display:flex; flex-direction:column; gap:.2rem}
.page-hero-meta .snum{
  font-family: var(--serif);font-weight:700;
  font-size: 2.1rem; color: #fff; letter-spacing:-.6px; line-height:1;
  display:flex; align-items:baseline; gap:.15rem;
}
.page-hero-meta .snum .pl{color: var(--gold); font-style:italic}
.page-hero-meta .slbl{
  font-size:.72rem; color: rgba(255,255,255,.62);
  letter-spacing:.6px; text-transform:uppercase;font-weight:600;
}

@media(max-width:900px){
  .page-hero{padding: 7rem 0 5rem}
  .page-hero-grid{grid-template-columns: 1fr; gap: 2rem}
}
@media(max-width:600px){
  .page-hero{padding: 6.5rem 0 4.5rem}
  .page-hero-meta{padding: 1.1rem 1.1rem; gap: 1rem}
  .page-hero-meta .snum{font-size: 1.6rem}
}

/* ═══════════════════════════════════════════════════
   TIMELINE — chronological history
═══════════════════════════════════════════════════ */
#timeline{padding: 6rem 0; position: relative; background: var(--bg)}
#timeline::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width: min(900px, 84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55;
}

.tl-wrap{
  position:relative; max-width: 1000px; margin: 3rem auto 0;
  padding: 1rem 0;
}
.tl-line{
  position:absolute; left:50%; top:0; bottom:0; width:2px;
  background: linear-gradient(180deg, transparent 0%, var(--bdr-h) 6%, var(--gold) 50%, var(--bdr-h) 94%, transparent 100%);
  transform: translateX(-50%); pointer-events:none;
}
.tl-item{
  position:relative;
  display:grid;
  grid-template-columns: 1fr 60px 1fr;
  gap: 1.5rem;
  padding: 1.6rem 0;
  align-items: center;
}
.tl-item:nth-child(odd) .tl-card{grid-column: 1; text-align: right}
.tl-item:nth-child(odd) .tl-card-year{justify-content:flex-end}
.tl-item:nth-child(even) .tl-card{grid-column: 3}
.tl-dot-wrap{
  grid-column: 2; display:flex;justify-content:center;align-items:center;
  position: relative; z-index: 2;
}
.tl-dot{
  width: 16px; height:16px; border-radius:50%;
  background: var(--bg);
  border: 3px solid var(--gold);
  box-shadow: 0 0 0 5px var(--bg), 0 0 18px rgba(201,169,97,.55);
  transition: transform .3s, box-shadow .3s;
}
.tl-item:hover .tl-dot{
  transform: scale(1.25);
  box-shadow: 0 0 0 5px var(--bg), 0 0 28px rgba(201,169,97,.85);
}
.tl-card{
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 12px;
  padding: 1.35rem 1.5rem;
  box-shadow: var(--shadow-1), var(--shadow-2);
  transition: transform .35s var(--ease), box-shadow .35s, border-color .35s;
  position:relative;
}
.tl-card::before{
  content:''; position:absolute; top:24px;
  width:0; height:0; border-style:solid;
}
.tl-item:nth-child(odd) .tl-card::before{
  right:-9px;
  border-width: 8px 0 8px 9px;
  border-color: transparent transparent transparent var(--bdr);
}
.tl-item:nth-child(odd) .tl-card::after{
  content:''; position:absolute; top:25px; right:-7px;
  border-style:solid;
  border-width: 7px 0 7px 7px;
  border-color: transparent transparent transparent var(--card);
}
.tl-item:nth-child(even) .tl-card::before{
  left:-9px;
  border-width: 8px 9px 8px 0;
  border-color: transparent var(--bdr) transparent transparent;
}
.tl-item:nth-child(even) .tl-card::after{
  content:''; position:absolute; top:25px; left:-7px;
  border-style:solid;
  border-width: 7px 7px 7px 0;
  border-color: transparent var(--card) transparent transparent;
}
.tl-card:hover{
  transform: translateY(-4px);
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3), 0 0 0 1px rgba(201,169,97,.25);
  border-color: transparent;
}
.tl-card-year{
  display:flex; align-items:baseline; gap:.5rem;
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 2rem; color: var(--gold-warm); line-height: 1;
  margin-bottom: .55rem;
  letter-spacing: -.5px;
}
[data-theme="dark"] .tl-card-year{color: var(--gold-soft)}
.tl-card-title{
  font-family: var(--serif); font-size: 1.05rem; font-weight: 700;
  color: var(--t1); line-height: 1.35; margin-bottom: .55rem;
  letter-spacing: -.1px;
}
.tl-card-desc{
  font-size: .87rem; color: var(--t2); line-height: 1.7;
}
.tl-card-tag{
  display:inline-flex; align-items:center; gap:.35rem;
  margin-top: .8rem;
  font-size:.65rem; font-weight: 700; letter-spacing: 1.4px; text-transform:uppercase;
  color: var(--blue-mid);
}
.tl-card-tag::before{
  content:''; width:5px; height:5px; border-radius:50%; background: var(--blue-mid);
}

/* Mobile timeline: single column with line on left */
@media(max-width: 720px){
  .tl-wrap{padding-left: 1rem}
  .tl-line{left: 1.4rem; transform: none}
  .tl-item{
    grid-template-columns: 2.8rem 1fr;
    gap: 1rem; padding: 1.1rem 0;
  }
  .tl-dot-wrap{grid-column:1; justify-content:flex-start; padding-left: .35rem}
  .tl-item:nth-child(odd) .tl-card,
  .tl-item:nth-child(even) .tl-card{
    grid-column: 2; text-align: left;
  }
  .tl-item:nth-child(odd) .tl-card-year,
  .tl-item:nth-child(even) .tl-card-year{justify-content: flex-start}
  .tl-item:nth-child(odd) .tl-card::before,
  .tl-item:nth-child(odd) .tl-card::after{
    left:-9px; right:auto;
    border-width: 8px 9px 8px 0;
    border-color: transparent var(--bdr) transparent transparent;
  }
  .tl-item:nth-child(odd) .tl-card::after{
    left:-7px; border-width: 7px 7px 7px 0;
    border-color: transparent var(--card) transparent transparent;
  }
  .tl-card{padding: 1.1rem 1.2rem}
  .tl-card-year{font-size: 1.7rem}
  .tl-card-title{font-size: 1rem}
}

/* ═══════════════════════════════════════════════════
   MISSION / VALUE BLOCK (Tarix page bottom)
═══════════════════════════════════════════════════ */
#mission{padding: 6rem 0; background: var(--bg2); position: relative}
.mission-grid{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem; margin-top: 2.5rem;
}
.mission-card{
  position:relative;
  padding: 1.8rem 1.6rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 14px;
  box-shadow: var(--shadow-1), var(--shadow-2);
  transition: transform .35s var(--ease), box-shadow .35s, border-color .35s;
}
.mission-card:hover{
  transform: translateY(-5px);
  box-shadow: var(--shadow-1), var(--shadow-3), var(--shadow-4);
  border-color: transparent;
}
.mission-card::before{
  content:''; position:absolute; top:0; left:1.6rem; right:1.6rem; height:3px;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold));
  border-radius: 0 0 3px 3px;
}
.mission-ico{
  width: 48px; height: 48px;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  border-radius: 12px; color: #fff;
  margin-bottom: 1.1rem;
  box-shadow: 0 6px 18px rgba(26,74,122,.32), inset 0 1px 0 rgba(255,255,255,.18);
}
.mission-ico svg{width: 22px; height: 22px}
.mission-card h3{
  font-family: var(--serif);
  font-size: 1.15rem; font-weight: 700;
  color: var(--t1);
  margin-bottom: .55rem; line-height: 1.35;
}
.mission-card p{
  font-size: .9rem; color: var(--t2); line-height: 1.7;
}
@media(max-width: 900px){.mission-grid{grid-template-columns: 1fr 1fr}}
@media(max-width: 600px){.mission-grid{grid-template-columns: 1fr}}

/* ═══════════════════════════════════════════════════
   LEADERSHIP — Director + Deputies (rahbariyat.html)
═══════════════════════════════════════════════════ */
#leaders{padding: 6rem 0; position: relative; background: var(--bg)}
#leaders::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width: min(900px, 84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55;
}

/* Director — featured large card */
.director-card{
  display:grid;
  grid-template-columns: minmax(280px, 380px) 1fr;
  gap: 2.5rem;
  align-items: stretch;
  margin-top: 2.5rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3);
  position: relative;
  isolation: isolate;
}
.director-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:4px;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold) 70%, var(--gold-warm));
  z-index: 1;
}
.director-photo{
  position: relative;
  background: linear-gradient(180deg, var(--blue-dark), var(--ink));
  overflow: hidden;
  min-height: 460px;
}
.director-photo img{
  width:100%; height:100%; object-fit: cover; object-position: center top; display:block;
}
.director-photo::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 60%, rgba(13,30,48,.6));
  pointer-events:none;
}
.director-photo-tag{
  position: absolute; left: 1.2rem; bottom: 1.1rem; z-index: 2;
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.66rem; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color:#fff;
  padding:.42rem .85rem; border-radius: 30px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.32);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.director-photo-tag::before{
  content:''; width:6px; height:6px; border-radius:50%; background: var(--gold);
  box-shadow: 0 0 8px rgba(201,169,97,.7);
}

.director-body{padding: 2rem 2rem 2rem 0; display:flex; flex-direction:column; gap: 1.1rem}
.director-eyebrow{
  font-size:.7rem; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gold-warm);
  display:inline-flex; align-items:center; gap:.55rem;
}
.director-eyebrow::before{
  content:''; width:24px; height: 1.5px; border-radius: 1px;
  background: var(--gold-warm);
}
.director-name{
  font-family: var(--serif);
  font-size: clamp(1.6rem, 2.5vw, 2.2rem);
  font-weight: 700; letter-spacing: -.5px; line-height: 1.18;
  color: var(--t1);
}
.director-pos{
  font-size: 1rem; color: var(--blue-mid); font-weight: 600;
  display:inline-flex; align-items:center; gap:.5rem;
}
.director-bio{
  font-size: .92rem; line-height: 1.78; color: var(--t2);
}
.director-meta{
  display: grid; grid-template-columns: 1fr 1fr;
  gap: .9rem 1.5rem;
  padding-top: 1.1rem;
  border-top: 1px solid var(--bdr);
}
.dm-item{display:flex; align-items:center; gap:.75rem; min-width:0}
.dm-ico{
  width: 38px; height: 38px; flex-shrink: 0;
  display:flex; align-items:center; justify-content:center;
  background: var(--accent-g);
  border-radius: 10px; color: var(--blue-mid);
}
.dm-ico svg{width: 16px; height: 16px}
.dm-text{display:flex; flex-direction:column; gap:.05rem; min-width: 0}
.dm-label{font-size:.66rem; letter-spacing:1.4px; text-transform:uppercase; color: var(--t3); font-weight:700}
.dm-value{font-size:.86rem; color: var(--t1); font-weight: 600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.dm-value a{color:inherit; transition: color .2s}
.dm-value a:hover{color: var(--accent)}

/* Bio timeline mini */
.director-bio-list{
  display:flex; flex-direction:column; gap:.5rem;
  padding: 1rem 1.1rem;
  background: var(--bg3);
  border-radius: 10px;
  border-left: 3px solid var(--gold);
}
.director-bio-list li{
  display:flex; gap:.7rem; font-size:.84rem; color: var(--t2); line-height: 1.55;
  list-style:none;
}
.director-bio-list li b{
  font-family: var(--serif); font-style: italic; color: var(--gold-warm);
  font-weight: 800; min-width: 55px; letter-spacing: .3px;
}

/* Deputies grid */
.leaders-grid{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem; margin-top: 2.5rem;
}
.leader-card{
  display:flex; flex-direction: column;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: var(--shadow-1), var(--shadow-2);
  transition: transform .35s var(--ease), box-shadow .35s, border-color .35s;
  position: relative;
  isolation: isolate;
}
.leader-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold));
  opacity:.85; z-index: 1;
}
.leader-card:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3), var(--shadow-4);
  border-color: transparent;
}
.leader-photo{
  height: 280px; position: relative; overflow: hidden;
  background: linear-gradient(180deg, var(--blue-dark), var(--ink));
}
.leader-photo img{
  width:100%; height:100%; object-fit: cover; object-position: center top;
  transition: transform .6s var(--ease);
}
.leader-card:hover .leader-photo img{transform: scale(1.05)}
.leader-photo::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 55%, rgba(13,30,48,.55));
  pointer-events:none;
}
.leader-body{
  padding: 1.4rem 1.5rem 1.5rem;
  display:flex; flex-direction: column; gap: .65rem;
  flex: 1;
}
.leader-pos{
  font-size:.66rem; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
  color: var(--gold-warm);
  display:inline-flex; align-items:center; gap:.5rem;
}
.leader-pos::before{
  content:''; width:18px; height:1.5px; background: var(--gold-warm); border-radius: 1px;
}
.leader-name{
  font-family: var(--serif);
  font-size: 1.18rem; font-weight: 700; line-height: 1.3;
  color: var(--t1); letter-spacing: -.2px;
}
.leader-resp{
  font-size: .86rem; color: var(--t2); line-height: 1.65;
  flex: 1;
}
.leader-edu{
  font-size:.78rem; color: var(--t3); line-height: 1.55;
  padding: .65rem .85rem;
  background: var(--bg3);
  border-radius: 8px;
  border-left: 2px solid var(--bdr-h);
}
.leader-edu b{color: var(--blue-mid); font-weight: 700}
.leader-contact{
  display:flex; flex-direction:column; gap:.4rem;
  padding-top:.85rem;
  border-top: 1px solid var(--bdr);
}
.leader-contact a{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.82rem; color: var(--t1); font-weight: 500;
  transition: color .2s;
}
.leader-contact a:hover{color: var(--accent)}
.leader-contact svg{width: 14px; height: 14px; color: var(--blue-mid); flex-shrink:0}

/* Contact / Hotline strip */
.contact-strip{
  margin-top: 4rem;
  display:grid; grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  padding: 1.5rem;
  background: linear-gradient(135deg, var(--blue-dark), var(--navy-deep));
  border-radius: 16px;
  color:#fff;
  position: relative; overflow:hidden;
}
.contact-strip::before{
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(circle at 20% 30%, rgba(126,200,245,.12) 0%, transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(201,169,97,.08) 0%, transparent 50%);
  pointer-events:none;
}
.cs-item{
  display:flex; align-items:center; gap:.85rem;
  position:relative; z-index:1;
}
.cs-ico{
  width: 42px; height: 42px; flex-shrink: 0;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 11px;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.cs-ico svg{width: 17px; height: 17px}
.cs-text{display:flex;flex-direction:column;gap:.1rem; min-width: 0}
.cs-lbl{font-size:.66rem; color: rgba(255,255,255,.65); letter-spacing: 1.4px; text-transform: uppercase; font-weight: 600}
.cs-val{font-size:.92rem; color:#fff; font-weight: 600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cs-val a{color:inherit;transition: color .2s}
.cs-val a:hover{color: var(--gold-soft)}

/* Responsive */
@media(max-width: 900px){
  .director-card{grid-template-columns: 1fr; gap: 0}
  .director-photo{min-height: 380px}
  .director-body{padding: 1.5rem}
  .director-meta{grid-template-columns: 1fr}
  .leaders-grid{grid-template-columns: 1fr 1fr}
  .contact-strip{grid-template-columns: 1fr 1fr}
}
@media(max-width: 600px){
  .leaders-grid{grid-template-columns: 1fr}
  .contact-strip{grid-template-columns: 1fr; padding: 1.2rem}
  .leader-photo{height: 240px}
  .director-photo{min-height: 320px}
}

/* ═══════════════════════════════════════════════════
   ORGANIZATIONAL STRUCTURE (tuzilma.html)
═══════════════════════════════════════════════════ */
#org-tree{padding: 6rem 0; position: relative; background: var(--bg)}
#org-tree::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width: min(900px, 84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55;
}

/* Tree wrapper */
.org-tree{
  margin-top: 3rem;
  display:flex;flex-direction:column;align-items:center;gap:2.5rem;
  position:relative;
}

/* Tiers */
.org-tier{
  display:grid; gap: 1.25rem;
  width: 100%;
  position: relative;
}
.org-tier-top{grid-template-columns: 1fr 1.4fr 1fr; max-width: 980px}
.org-tier-top:has(.org-card:only-child){display:flex; justify-content:center}
.org-tier-top:has(.org-card:only-child) .org-card{width: 100%; max-width: 320px}

/* Tier 2 + Tier 3 — deputies with their projects, each in its own connected branch */
.org-branches{
  display:grid; gap: 2rem;
  width: 100%; max-width: 1200px;
  align-items: start;
}
.org-branch{display:flex; flex-direction:column; align-items:center}
.org-branch .org-card{width:100%}
.org-branch-rail{
  width:2px; height:28px;
  background: linear-gradient(180deg, var(--gold) 0%, var(--gold-warm) 100%);
  margin: -1px 0 0;
}
.org-branch-list{
  display:flex; flex-direction:column; gap:.65rem;
  width:100%; margin-top: -1px;
}
.org-leaf{
  position: relative;
  padding: .8rem 1rem;
  background: var(--bg3);
  border: 1px solid var(--bdr);
  border-radius: 9px;
  font-size:.82rem; font-weight:500; line-height:1.4;
  color: var(--t1); text-align:center;
  transition: background .25s, border-color .25s, transform .25s;
}
.org-leaf:hover{background: var(--card); border-color: var(--bdr-h); transform: translateX(2px)}
.org-leaf::before{
  content:''; position:absolute; left:50%; top:-.65rem; transform:translateX(-50%);
  width:2px; height:.65rem;
  background: linear-gradient(180deg, var(--gold-warm), transparent);
}
.org-branch-list .org-leaf:first-child::before{display:none}

.org-card{
  position: relative;
  padding: 1.3rem 1.4rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 14px;
  box-shadow: var(--shadow-1), var(--shadow-2);
  transition: transform .35s var(--ease), box-shadow .35s, border-color .35s;
  text-align: center;
  display:flex;flex-direction:column;align-items:center;gap:.65rem;
  isolation: isolate;
}
.org-card:hover{
  transform: translateY(-5px);
  box-shadow: var(--shadow-1), var(--shadow-3);
  border-color: rgba(201,169,97,.35);
}
.org-card-ico{
  width: 44px; height: 44px;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  border-radius: 11px; color: #fff;
  box-shadow: 0 5px 16px rgba(26,74,122,.32), inset 0 1px 0 rgba(255,255,255,.18);
}
.org-card-ico svg{width: 20px; height: 20px}
.org-card-label{
  font-size:.66rem; letter-spacing:1.8px; text-transform:uppercase;
  color: var(--gold-warm); font-weight:700;
}
.org-card-title{
  font-family: var(--serif);
  font-size:1.05rem; font-weight: 700; line-height: 1.32;
  color: var(--t1);
}
/* Featured Director */
.org-card.lead{
  background: linear-gradient(135deg, var(--blue-dark), var(--navy-deep));
  color:#fff;
  border-color: transparent;
  padding: 1.6rem 1.5rem;
  position: relative; overflow: hidden;
}
.org-card.lead::before{
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(circle at 20% 30%, rgba(126,200,245,.16) 0%, transparent 55%),
    radial-gradient(circle at 80% 70%, rgba(201,169,97,.14) 0%, transparent 55%);
  pointer-events:none;
}
.org-card.lead .org-card-ico{
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  color: var(--ink);
}
.org-card.lead .org-card-label{color: var(--gold-soft)}
.org-card.lead .org-card-title{color:#fff; font-size: 1.18rem}

/* Connector lines */
.org-line{
  height: 36px; width: 2px;
  background: linear-gradient(180deg, transparent, var(--gold) 50%, transparent);
  margin: -1rem 0; pointer-events:none;
}
.org-rail{
  width: 100%; max-width: 1200px; height: 32px; position: relative;
  margin: -.5rem 0;
  pointer-events:none;
}
.org-rail::before{
  content:''; position:absolute; top: 0; left: 12.5%; right: 12.5%; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold-warm) 8%, var(--gold) 50%, var(--gold-warm) 92%, transparent);
}
.org-rail::after{
  content:''; position:absolute; left:50%; top:0; bottom:0; width: 2px;
  background: linear-gradient(180deg, var(--gold) 0%, var(--gold-warm) 100%);
  transform: translateX(-50%);
}

/* Deputy variants */
.org-card.dep-1 .org-card-ico{background:linear-gradient(135deg,#1a4a7a,#3b82c4)}
.org-card.dep-2 .org-card-ico{background:linear-gradient(135deg,#205988,#4f9ad6)}
.org-card.dep-3 .org-card-ico{background:linear-gradient(135deg,#264f7a,#3b82c4)}
.org-card.dep-4 .org-card-ico{background:linear-gradient(135deg,#1f4d80,#5ba3d9)}
.org-card.dep-5 .org-card-ico{background:linear-gradient(135deg,#2c5c8a,#6bb0de)}

/* Responsive */
@media(max-width: 900px){
  .org-tier-top{grid-template-columns: 1fr}
  .org-branches{grid-template-columns: 1fr !important}
  .org-rail{display:none}
  .org-branch-rail{display:none}
  .org-subleaf-list{margin-left: .6rem; padding-left: .6rem}
}

/* ═══════════════════════════════════════════════════
   DOCUMENTS LIST (laws, decrees, resolutions, anti-corruption)
═══════════════════════════════════════════════════ */
#docs{padding: 6rem 0; position: relative; background: var(--bg)}
#docs::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width: min(900px, 84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55;
}
.docs-toolbar{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  margin-top: 2.5rem; margin-bottom: 1.6rem;
  flex-wrap: wrap;
}
.docs-search{
  position:relative; flex:1; max-width: 380px;
  min-width: 220px;
}
.docs-search svg{
  position:absolute; left:.95rem; top:50%; transform:translateY(-50%);
  width:15px; height:15px; color: var(--t3); pointer-events:none;
}
.docs-search input{
  width:100%; padding:.78rem 1rem .78rem 2.5rem;
  border: 1px solid var(--bdr); border-radius: 11px;
  background: var(--card); color: var(--t1);
  font-size:.88rem; font-family: inherit;
  transition: border-color .25s, box-shadow .25s;
}
.docs-search input:focus{outline:none; border-color: var(--blue-mid); box-shadow: 0 0 0 3px var(--accent-g)}
.docs-search input::placeholder{color: var(--t3)}
.docs-count{
  font-size:.82rem; color: var(--t2);
  display:inline-flex; align-items:center; gap:.5rem;
}
.docs-count b{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  color: var(--gold-warm);
  font-size: 1.1rem;
}

.docs-list{display: flex; flex-direction: column; gap: .85rem; margin-top: 1rem}
.doc-item{
  display:grid;
  grid-template-columns: 3rem 1fr auto;
  align-items:center; gap: 1.1rem;
  padding: 1.2rem 1.4rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 12px;
  box-shadow: var(--shadow-1);
  transition: transform .3s var(--ease), box-shadow .3s, border-color .3s;
  position: relative;
  isolation: isolate;
}
.doc-item:hover{
  transform: translateY(-2px);
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3);
  border-color: rgba(201,169,97,.32);
}
.doc-item::before{
  content:''; position:absolute; left:0; top:1.1rem; bottom: 1.1rem; width: 3px;
  background: linear-gradient(180deg, var(--blue-mid), var(--gold));
  border-radius: 0 3px 3px 0;
  opacity: 0; transform: scaleY(.6);
  transform-origin: center;
  transition: opacity .25s, transform .25s var(--ease);
}
.doc-item:hover::before{opacity: 1; transform: scaleY(1)}

.doc-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  color: var(--gold-warm);
  font-size: 1.4rem; line-height:1;
  text-align:center; letter-spacing:-.5px;
}
.doc-body{display:flex; flex-direction: column; gap:.45rem; min-width: 0}
.doc-meta-top{
  display:inline-flex; align-items:center; gap:.65rem;
  font-size:.66rem; letter-spacing:1.4px; text-transform: uppercase; font-weight: 700;
  color: var(--blue-mid);
}
.doc-meta-top .doc-date{color: var(--t3); letter-spacing: .4px; text-transform: none; font-weight: 600}
.doc-meta-top::before{
  content:''; width:6px; height:6px; border-radius:50%; background: var(--blue-mid);
}
.doc-title{
  font-family: var(--serif);
  font-size: 1.02rem; font-weight: 700;
  color: var(--t1); line-height: 1.45;
  letter-spacing: -.1px;
}
.doc-meta-bot{
  display: flex; flex-wrap: wrap; gap: .85rem;
  font-size: .76rem; color: var(--t3);
  align-items: center;
}
.doc-meta-bot span{display:inline-flex; align-items:center; gap:.4rem}
.doc-meta-bot svg{width: 12px; height: 12px}
.doc-num-badge{
  font-family: var(--serif); font-style:italic; font-weight: 700;
  color: var(--gold-warm); font-size: .82rem;
}

.doc-action{
  display:inline-flex; align-items:center; gap:.45rem;
  padding: .7rem 1.1rem;
  font-size: .82rem; font-weight: 600;
  color: var(--blue-mid);
  background: var(--accent-g);
  border: 1px solid rgba(37,99,168,.25);
  border-radius: 100px;
  white-space: nowrap;
  transition: background .25s, color .25s, gap .25s var(--ease), transform .25s;
}
.doc-action svg{width: 13px; height: 13px; transition: transform .25s}
.doc-item:hover .doc-action{
  background: var(--blue-mid); color: #fff;
  border-color: var(--blue-mid);
  gap: .65rem;
}
.doc-item:hover .doc-action svg{transform: translateX(2px)}

/* External tag */
.doc-tag-ext{
  display:inline-flex; align-items:center; gap:.32rem;
  font-size:.66rem; letter-spacing: 1px; text-transform: uppercase;
  color: var(--t3); font-weight: 600;
}
.doc-tag-ext svg{width:11px;height:11px}

/* Empty state */
.docs-empty{
  text-align: center; padding: 3rem 1rem;
  color: var(--t3); font-size: .9rem;
}

/* Categories filter chips */
.docs-chips{display:flex; flex-wrap:wrap; gap:.5rem; margin-top: 1rem}
.docs-chip{
  display:inline-flex; align-items:center; gap:.4rem;
  padding: .45rem .9rem; border-radius: 30px;
  font-size: .76rem; font-weight: 600;
  color: var(--t2);
  background: var(--card);
  border: 1px solid var(--bdr);
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
}
.docs-chip.act,.docs-chip:hover{
  background: var(--blue-mid); color: #fff; border-color: var(--blue-mid);
}

@media(max-width: 720px){
  .doc-item{grid-template-columns: 2.5rem 1fr; gap: .85rem; padding: 1rem 1.1rem}
  .doc-action{grid-column: 2; justify-self: start; padding: .55rem .9rem; font-size: .78rem}
  .doc-num{font-size: 1.2rem}
  .doc-title{font-size: .95rem}
}

/* ═══════════════════════════════════════════════════
   CONFERENCES (konferensiyalar.html)
═══════════════════════════════════════════════════ */
#conferences{padding: 6rem 0; position: relative; background: var(--bg)}
#conferences::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width: min(900px, 84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55;
}
.conf-featured{
  display:grid; grid-template-columns: 1.3fr 1fr; gap: 0;
  margin-top: 3rem; background: var(--card);
  border: 1px solid var(--bdr); border-radius: 16px; overflow:hidden;
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3);
  position: relative; isolation: isolate;
}
.conf-featured::before{
  content:''; position:absolute; top:0; left:0; right:0; height:4px; z-index:2;
  background: linear-gradient(90deg, var(--gold-warm), var(--gold), var(--blue-mid));
}
.conf-feat-img{
  position: relative; min-height: 380px;
  background: linear-gradient(135deg, var(--blue-dark), var(--ink));
  overflow:hidden;
}
.conf-feat-img img{width:100%;height:100%;object-fit:cover;display:block; transition: transform .8s var(--ease)}
.conf-featured:hover .conf-feat-img img{transform: scale(1.04)}
.conf-feat-img::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 50%, rgba(13,30,48,.55));
  pointer-events:none;
}
.conf-feat-status{
  position:absolute; top:1.2rem; left:1.2rem; z-index:2;
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.45rem 1rem; border-radius: 30px;
  font-size:.66rem; font-weight: 700; letter-spacing:1.6px; text-transform: uppercase;
  color:#fff;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.32);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.conf-feat-status.live::before{
  content:''; width:7px; height:7px; border-radius:50%; background: var(--gold);
  box-shadow: 0 0 10px rgba(201,169,97,.7);
  animation: bpulse 2s infinite;
}
.conf-feat-body{padding: 2rem; display:flex; flex-direction:column; gap:1rem}
.conf-feat-eyebrow{
  font-size:.7rem; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gold-warm);
}
.conf-feat-title{
  font-family: var(--serif);
  font-size: clamp(1.4rem, 2vw, 1.85rem);
  font-weight: 700; line-height: 1.25; letter-spacing: -.4px;
  color: var(--t1);
}
.conf-feat-desc{font-size:.93rem; color: var(--t2); line-height: 1.7}
.conf-feat-meta{
  display: grid; grid-template-columns: 1fr 1fr;
  gap: .8rem 1.2rem; padding-top: 1.1rem;
  border-top: 1px solid var(--bdr);
}
.conf-feat-meta .dm-item .dm-ico{background: var(--accent-g); color: var(--blue-mid)}
.conf-feat-cta{display:flex; gap:.65rem; flex-wrap:wrap; margin-top:.4rem}

/* Conference list (archive) */
.conf-list{display:flex;flex-direction:column;gap:.85rem;margin-top:2rem}
.conf-row{
  display:grid; grid-template-columns: 110px 1fr auto;
  gap: 1.4rem; align-items:center;
  padding: 1.2rem 1.4rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 12px;
  transition: transform .3s var(--ease), box-shadow .3s, border-color .3s;
  position: relative;
}
.conf-row:hover{
  transform: translateY(-2px);
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3);
  border-color: rgba(201,169,97,.32);
}
.conf-date{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding: .85rem;
  background: var(--bg3);
  border-radius: 10px;
  text-align:center;
  border: 1px solid var(--bdr);
}
.conf-date-day{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1.6rem; color: var(--gold-warm); line-height: 1;
}
.conf-date-mon{
  font-size:.66rem; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--blue-mid); font-weight: 700; margin-top:.25rem;
}
.conf-date-year{font-size:.7rem; color: var(--t3); margin-top:.2rem}
.conf-info{display:flex; flex-direction:column; gap:.35rem; min-width:0}
.conf-cat{
  font-size:.66rem; letter-spacing: 1.6px; text-transform: uppercase;
  font-weight: 700; color: var(--blue-mid);
}
.conf-title{
  font-family: var(--serif); font-size: 1.02rem; font-weight: 700;
  color: var(--t1); line-height: 1.4;
}
.conf-loc{font-size:.78rem; color: var(--t3); display:inline-flex; align-items:center; gap:.4rem}
.conf-loc svg{width:12px;height:12px;flex-shrink:0}

/* ═══════════════════════════════════════════════════
   MATERIALS COLLECTION (materiallar.html)
═══════════════════════════════════════════════════ */
#materials{padding: 6rem 0; position: relative; background: var(--bg)}
#materials::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width: min(900px, 84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55;
}
.mat-grid{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: 1.4rem; margin-top: 3rem;
}
.mat-card{
  position: relative; display:flex; flex-direction:column; gap:.9rem;
  padding: 1.6rem 1.5rem 1.5rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 14px;
  box-shadow: var(--shadow-1), var(--shadow-2);
  transition: transform .35s var(--ease), box-shadow .35s, border-color .35s;
  isolation: isolate;
}
.mat-card::before{
  content:''; position:absolute; top:0; left:1.5rem; right:1.5rem; height:3px;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold));
  border-radius: 0 0 3px 3px;
}
.mat-card:hover{
  transform: translateY(-5px);
  box-shadow: var(--shadow-1), var(--shadow-3), var(--shadow-4);
  border-color: transparent;
}
.mat-card-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 2.4rem; color: var(--gold-warm);
  line-height: 1; letter-spacing: -.5px;
}
.mat-card-tag{
  font-size:.66rem; letter-spacing: 2px; text-transform: uppercase; font-weight: 700;
  color: var(--blue-mid);
  display:inline-flex; align-items:center; gap:.5rem;
}
.mat-card-tag::before{
  content:''; width: 18px; height: 1.5px; background: var(--blue-mid); border-radius: 1px;
}
.mat-card-title{
  font-family: var(--serif);
  font-size: 1.05rem; font-weight: 700; line-height: 1.4;
  color: var(--t1); flex: 1;
}
.mat-card-meta{
  display:flex; flex-wrap: wrap; gap: .6rem 1rem;
  padding-top: .85rem; border-top: 1px solid var(--bdr);
  font-size:.76rem; color: var(--t3);
}
.mat-card-meta span{display:inline-flex; align-items:center; gap:.4rem}
.mat-card-meta svg{width:12px;height:12px}
.mat-card-link{
  display:inline-flex; align-items:center; gap:.45rem;
  font-size:.82rem; font-weight: 600; color: var(--blue-mid);
  margin-top:.5rem;
  transition: gap .25s var(--ease), color .25s;
}
.mat-card-link svg{width: 13px; height: 13px; transition: transform .25s}
.mat-card:hover .mat-card-link{gap:.7rem; color: var(--accent)}
.mat-card:hover .mat-card-link svg{transform: translateX(3px)}

@media(max-width: 900px){.mat-grid{grid-template-columns: 1fr 1fr}}
@media(max-width: 600px){.mat-grid{grid-template-columns: 1fr}}

/* ═══════════════════════════════════════════════════
   PHOTO GALLERY (fotogalereya.html)
═══════════════════════════════════════════════════ */
#photo-gallery{padding: 6rem 0; position: relative; background: var(--bg)}
#photo-gallery::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width: min(900px, 84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55;
}
.albums-grid{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: 1.4rem; margin-top: 3rem;
}
.album-card{
  position: relative;
  display:flex; flex-direction:column;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 14px;
  overflow:hidden;
  box-shadow: var(--shadow-1), var(--shadow-2);
  transition: transform .35s var(--ease), box-shadow .35s, border-color .35s;
  cursor: pointer;
}
.album-card:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow-1), var(--shadow-3), var(--shadow-4);
  border-color: transparent;
}
.album-thumb{
  position: relative; height: 240px;
  background: linear-gradient(135deg, var(--blue-dark), var(--ink));
  overflow: hidden;
}
.album-thumb img{
  width:100%;height:100%;object-fit:cover;
  transition: transform .7s var(--ease);
}
.album-card:hover .album-thumb img{transform: scale(1.06)}
.album-thumb::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 50%, rgba(13,30,48,.7));
  pointer-events:none;
}
.album-count{
  position:absolute; top: 1rem; right: 1rem; z-index:2;
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.4rem .8rem; border-radius: 30px;
  font-size:.7rem; font-weight: 700;
  color:#fff;
  background: rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.album-count svg{width:13px;height:13px}
.album-overlay{
  position:absolute; left:1.1rem; right:1.1rem; bottom:1rem; z-index:2;
  display:flex; flex-direction:column; gap:.2rem;
  color:#fff;
  transform: translateY(8px);
  opacity:.9;
  transition: transform .35s, opacity .35s;
}
.album-card:hover .album-overlay{transform:translateY(0); opacity:1}
.album-date{
  font-size:.66rem; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--gold-soft); font-weight: 700;
}
.album-title{
  font-family: var(--serif); font-size: 1.05rem; font-weight: 700; line-height: 1.32;
}
.album-body{
  padding: 1rem 1.3rem 1.2rem;
  display:flex; align-items:center; justify-content:space-between;
}
.album-cat{
  font-size:.66rem; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--blue-mid); font-weight: 700;
}
.album-arrow{
  display:inline-flex; align-items:center;
  color: var(--blue-mid);
  transition: transform .25s, color .25s;
}
.album-arrow svg{width:16px;height:16px}
.album-card:hover .album-arrow{transform: translateX(4px); color: var(--accent)}

@media(max-width: 900px){.albums-grid{grid-template-columns: 1fr 1fr}}
@media(max-width: 600px){
  .albums-grid{grid-template-columns: 1fr}
  .album-thumb{height:200px}
}

/* ═══════════════════════════════════════════════════
   VIDEO GALLERY (videogalereya.html)
═══════════════════════════════════════════════════ */
#video-gallery{padding: 6rem 0; position: relative; background: var(--bg)}
#video-gallery::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width: min(900px, 84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55;
}
.videos-grid{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: 1.4rem; margin-top: 3rem;
}
.video-card{
  display:flex;flex-direction:column;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 14px; overflow:hidden;
  box-shadow: var(--shadow-1), var(--shadow-2);
  transition: transform .35s var(--ease), box-shadow .35s, border-color .35s;
  cursor:pointer;
}
.video-card:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow-1), var(--shadow-3), var(--shadow-4);
  border-color: transparent;
}
.video-thumb{
  position:relative; aspect-ratio: 16/9;
  background: linear-gradient(135deg, var(--blue-dark), var(--ink));
  overflow:hidden;
}
.video-thumb img{
  width:100%;height:100%;object-fit:cover;
  transition: transform .7s var(--ease), filter .35s;
  filter: brightness(.88);
}
.video-card:hover .video-thumb img{transform: scale(1.07); filter: brightness(1)}
.video-play{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width: 64px; height: 64px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.18);
  border: 1.5px solid rgba(255,255,255,.5);
  border-radius:50%;
  color:#fff;
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 8px 28px rgba(0,0,0,.4);
  transition: transform .35s var(--ease), background .25s, border-color .25s;
  z-index: 2;
}
.video-card:hover .video-play{
  transform: translate(-50%,-50%) scale(1.12);
  background: var(--gold);
  border-color: var(--gold-soft);
  color: var(--ink);
}
.video-play svg{width:22px;height:22px;margin-left:3px}
.video-duration{
  position:absolute; bottom:.85rem; right:.85rem; z-index:2;
  padding:.28rem .6rem; border-radius: 5px;
  font-size:.72rem; font-weight:700;
  color:#fff;
  background: rgba(0,0,0,.65);
  letter-spacing:.4px;
}
.video-body{padding: 1.1rem 1.2rem 1.3rem; display:flex; flex-direction:column; gap:.4rem}
.video-cat{
  font-size:.66rem; letter-spacing: 1.6px; text-transform: uppercase; font-weight: 700;
  color: var(--gold-warm);
}
.video-title{
  font-family: var(--serif);
  font-size: 1rem; font-weight: 700; line-height: 1.4;
  color: var(--t1);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.video-meta{
  display:flex; gap: .9rem;
  font-size:.74rem; color: var(--t3);
  padding-top:.5rem; border-top: 1px solid var(--bdr); margin-top:.3rem;
}
.video-meta span{display:inline-flex; align-items:center; gap:.35rem}
.video-meta svg{width:11px;height:11px}

@media(max-width: 900px){.videos-grid{grid-template-columns: 1fr 1fr}}
@media(max-width: 600px){.videos-grid{grid-template-columns: 1fr}}

/* Conferences responsive */
@media(max-width: 900px){
  .conf-featured{grid-template-columns: 1fr}
  .conf-feat-img{min-height: 280px}
  .conf-row{grid-template-columns: 80px 1fr; gap: 1rem; padding: 1rem}
  .conf-row .doc-action,.conf-row .conf-row-cta{grid-column: 2; justify-self: start}
}

/* ═══════════════════════════════════════════════════
   NEWS ARCHIVE (yangiliklar.html)
═══════════════════════════════════════════════════ */
#news-archive{padding: 6rem 0; position: relative; background: var(--bg)}
#news-archive::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width: min(900px, 84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55;
}

/* Filter chips toolbar */
.na-toolbar{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap: 1rem; margin-top: 2.5rem; margin-bottom: 1rem;
}
.na-chips{display:flex; flex-wrap:wrap; gap:.5rem}
.na-chip{
  display:inline-flex; align-items:center; gap:.4rem;
  padding: .55rem 1.1rem; border-radius: 30px;
  font-size: .8rem; font-weight: 600;
  color: var(--t2);
  background: var(--card);
  border: 1px solid var(--bdr);
  cursor: pointer;
  transition: background .25s, color .25s, border-color .25s, transform .2s;
}
.na-chip svg{width:13px;height:13px}
.na-chip:hover{transform: translateY(-1px)}
.na-chip.act, .na-chip:hover{
  background: var(--blue-mid); color: #fff; border-color: var(--blue-mid);
}
.na-chip-count{
  display:inline-flex; align-items:center; justify-content:center;
  min-width: 22px; padding: 0 .35rem; height: 18px;
  border-radius: 30px;
  background: var(--accent-g); color: var(--blue-mid);
  font-size: .68rem; font-weight: 700;
}
.na-chip.act .na-chip-count{background: rgba(255,255,255,.22); color: #fff}

/* Featured (top news) */
.na-featured{
  display:grid; grid-template-columns: 1.4fr 1fr; gap: 0;
  margin: 2rem 0;
  background: var(--card);
  border: 1px solid var(--bdr); border-radius: 16px; overflow:hidden;
  box-shadow: var(--shadow-1), var(--shadow-2);
  transition: transform .35s var(--ease), box-shadow .35s, border-color .35s;
  position: relative; isolation: isolate;
}
.na-featured:hover{
  transform: translateY(-4px);
  box-shadow: var(--shadow-1), var(--shadow-3), var(--shadow-4);
  border-color: transparent;
}
.na-featured::before{
  content:''; position:absolute; top:0; left:0; right:0; height:4px; z-index:2;
  background: linear-gradient(90deg, var(--gold-warm), var(--gold), var(--blue-mid));
}
.na-featured-img{
  position: relative; min-height: 380px;
  background: linear-gradient(135deg, var(--blue-dark), var(--ink));
  overflow:hidden;
}
.na-featured-img img{width:100%;height:100%;object-fit:cover;display:block; transition: transform .8s var(--ease)}
.na-featured:hover .na-featured-img img{transform: scale(1.05)}
.na-featured-img::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 50%, rgba(13,30,48,.6));
  pointer-events:none;
}
.na-featured-tag{
  position:absolute; top:1.2rem; left:1.2rem; z-index:2;
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.45rem 1rem; border-radius: 30px;
  font-size:.66rem; font-weight: 700; letter-spacing:1.6px; text-transform: uppercase;
  color:#fff;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.32);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.na-featured-tag::before{
  content:''; width:7px; height:7px; border-radius:50%; background: var(--gold);
  box-shadow: 0 0 10px rgba(201,169,97,.7);
  animation: bpulse 2s infinite;
}
.na-featured-body{padding: 2rem; display:flex; flex-direction:column; gap:1rem; justify-content:center}
.na-featured-cat{
  font-size:.7rem; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gold-warm);
}
.na-featured-title{
  font-family: var(--serif);
  font-size: clamp(1.4rem, 2.2vw, 2rem);
  font-weight: 700; line-height: 1.22; letter-spacing: -.4px;
  color: var(--t1);
  transition: color .25s;
}
.na-featured:hover .na-featured-title{color: var(--accent)}
.na-featured-desc{font-size:.95rem; color: var(--t2); line-height: 1.7}
.na-featured-meta{
  display:flex; gap: 1.2rem; padding-top: 1rem;
  border-top: 1px solid var(--bdr);
  font-size:.78rem; color: var(--t3);
}
.na-featured-meta span{display:inline-flex; align-items:center; gap:.4rem}
.na-featured-meta svg{width:13px;height:13px}
.na-featured-cta{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.85rem; font-weight: 600; color: var(--blue-mid);
  margin-top:.4rem;
  transition: gap .25s var(--ease);
}
.na-featured-cta svg{width: 14px; height: 14px; transition: transform .25s}
.na-featured:hover .na-featured-cta{gap: .8rem}
.na-featured:hover .na-featured-cta svg{transform: translateX(4px)}

/* News archive grid */
.na-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-top: 2rem;
}
.na-card{
  display: flex; flex-direction: column;
  background: var(--card);
  border: 1px solid var(--bdr); border-radius: 12px;
  overflow: hidden;
  box-shadow: var(--shadow-1);
  transition: transform .35s var(--ease), box-shadow .35s, border-color .35s;
  cursor: pointer;
  isolation: isolate;
}
.na-card:hover{
  transform: translateY(-5px);
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3);
  border-color: rgba(201,169,97,.32);
}
.na-card-img{
  position: relative; height: 200px;
  background: linear-gradient(135deg, var(--blue-dark), var(--ink));
  overflow: hidden;
}
.na-card-img img{
  width:100%;height:100%;object-fit:cover;
  transition: transform .65s var(--ease);
}
.na-card:hover .na-card-img img{transform: scale(1.06)}
.na-card-img::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 60%, rgba(13,30,48,.45));
  pointer-events:none;
}
.na-card-cat{
  position:absolute; top:.85rem; left:.85rem; z-index:2;
  font-size:.62rem; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase;
  color:#fff;
  padding:.32rem .7rem; border-radius: 30px;
  background: rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.na-card-body{
  padding: 1.2rem 1.3rem 1.3rem;
  display:flex; flex-direction:column; gap:.6rem;
  flex: 1;
}
.na-card-date{
  font-size:.7rem; color: var(--t3); font-weight: 600;
  display:inline-flex; align-items:center; gap:.4rem;
}
.na-card-date svg{width:11px;height:11px}
.na-card-title{
  font-family: var(--serif);
  font-size: 1rem; font-weight: 700; line-height: 1.4;
  color: var(--t1);
  transition: color .25s;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  flex: 1;
}
.na-card:hover .na-card-title{color: var(--accent)}
.na-card-meta{
  display:flex; justify-content:space-between; align-items:center;
  padding-top: .8rem; border-top: 1px solid var(--bdr);
  margin-top: auto;
}
.na-card-views{
  font-size:.72rem; color: var(--t3);
  display:inline-flex; align-items:center; gap:.35rem;
}
.na-card-views svg{width:11px;height:11px}
.na-card-arrow{
  color: var(--blue-mid);
  display:inline-flex; align-items:center;
  transition: transform .25s, color .25s;
}
.na-card-arrow svg{width:15px;height:15px}
.na-card:hover .na-card-arrow{transform: translateX(4px); color: var(--accent)}

/* Pagination */
.na-pagination{
  display:flex; justify-content:center; align-items:center; gap: .35rem;
  margin-top: 3rem; flex-wrap: wrap;
}
.na-page{
  min-width: 40px; height: 40px;
  display:inline-flex; align-items:center; justify-content:center;
  padding: 0 .65rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 9px;
  font-size: .85rem; font-weight: 600;
  color: var(--t2);
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.na-page:hover{transform: translateY(-2px); border-color: var(--bdr-h)}
.na-page.act{
  background: var(--blue-mid); color: #fff; border-color: var(--blue-mid);
  box-shadow: 0 6px 18px rgba(26,74,122,.28);
}
.na-page.dots{border:none; background:transparent; cursor: default; pointer-events:none}
.na-page svg{width:14px;height:14px}

@media(max-width: 900px){
  .na-grid{grid-template-columns: 1fr 1fr}
  .na-featured{grid-template-columns: 1fr}
  .na-featured-img{min-height: 240px}
  .na-toolbar{flex-direction:column;align-items:stretch}
}
@media(max-width: 600px){
  .na-grid{grid-template-columns: 1fr}
  .na-page{min-width: 36px; height: 36px; font-size: .8rem}
}

/* ═══════════════════════════════════════════════════
   ARTICLE PAGE (yangilik.html — single news detail)
═══════════════════════════════════════════════════ */
.article-hero{
  position: relative;
  padding: 8rem 0 4rem;
  color: #fff;
  overflow: hidden;
  isolation: isolate;
}
.article-hero-bg{
  position: absolute; inset: 0; z-index: 0;
}
.article-hero-bg img{
  width: 100%; height: 100%; object-fit: cover; display: block;
  filter: brightness(.55) saturate(110%);
}
.article-hero-bg::after{
  content: ''; position: absolute; inset: 0;
  background:
    radial-gradient(circle at 18% 28%, rgba(126,200,245,.18) 0%, transparent 50%),
    linear-gradient(180deg, rgba(7,18,30,.65) 0%, rgba(13,30,48,.85) 100%);
}
.article-hero .container{position:relative; z-index:2}

.article-cat{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.5rem 1rem; border-radius: 30px;
  font-size:.66rem; font-weight: 700; letter-spacing:1.8px; text-transform: uppercase;
  color:#fff;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.32);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  margin-bottom: 1.4rem;
}
.article-cat::before{
  content:''; width:7px; height:7px; border-radius:50%; background: var(--gold);
  box-shadow: 0 0 10px rgba(201,169,97,.7);
  animation: bpulse 2s infinite;
}
.article-title{
  font-family: var(--serif);
  font-size: clamp(1.9rem, 4vw, 3.4rem);
  font-weight: 700; letter-spacing: -.7px; line-height: 1.1;
  color: #fff;
  max-width: 920px;
  margin-bottom: 1.6rem;
}
.article-title em{
  font-style: italic;
  background: linear-gradient(135deg, #7ec8f5 0%, var(--gold) 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.article-meta{
  display:flex; flex-wrap:wrap; gap: 1.5rem;
  font-size:.85rem; color: rgba(255,255,255,.78);
  padding-top: 1.4rem;
  border-top: 1px solid rgba(255,255,255,.18);
  max-width: 920px;
}
.article-meta-item{display:inline-flex; align-items:center; gap:.5rem}
.article-meta-item svg{width:14px;height:14px; opacity:.75}
.article-meta-item b{color:#fff;font-weight:600}

/* Body */
#article-body{padding: 5rem 0; background: var(--bg)}
.article-wrap{
  max-width: 760px; margin: 0 auto;
  position: relative;
}
.article-lead{
  font-family: var(--serif);
  font-size: 1.18rem;
  line-height: 1.65;
  color: var(--t1);
  font-weight: 500;
  margin-bottom: 2rem;
  padding-left: 1.2rem;
  border-left: 3px solid var(--gold);
  font-style: italic;
}
.article-content{font-size: 1.02rem; line-height: 1.85; color: var(--t1)}
.article-content p{margin-bottom: 1.4rem}
.article-content h2{
  font-family: var(--serif);
  font-size: 1.7rem; font-weight: 700; letter-spacing: -.3px;
  color: var(--t1); margin: 2.5rem 0 1rem;
  position: relative; padding-left: .9rem;
}
.article-content h2::before{
  content:''; position:absolute; left:0; top: 8px; bottom: 8px; width: 4px;
  background: linear-gradient(180deg, var(--blue-mid), var(--gold));
  border-radius: 2px;
}
.article-content h3{
  font-family: var(--serif);
  font-size: 1.25rem; font-weight: 700;
  color: var(--t1); margin: 1.8rem 0 .8rem;
}
.article-content ul, .article-content ol{
  margin: 1rem 0 1.4rem 0; padding-left: 1.4rem;
}
.article-content li{margin-bottom: .55rem; line-height: 1.7}
.article-content li::marker{color: var(--gold-warm); font-weight: 700}
.article-content blockquote{
  margin: 2rem 0; padding: 1.4rem 1.8rem;
  background: var(--bg3);
  border-left: 4px solid var(--gold);
  border-radius: 0 12px 12px 0;
  font-family: var(--serif); font-style: italic; font-size: 1.05rem;
  color: var(--t1);
  position: relative;
}
.article-content blockquote::before{
  content: '"';
  position: absolute; top: -8px; left: 1rem;
  font-family: var(--serif);
  font-size: 4rem; color: var(--gold);
  line-height: 1;
  opacity: .4;
}
.article-content strong, .article-content b{color: var(--t1); font-weight: 700}
.article-content a{
  color: var(--blue-mid); font-weight: 500;
  border-bottom: 1px solid rgba(37,99,168,.4);
  transition: border-color .2s;
}
.article-content a:hover{border-bottom-color: var(--blue-mid)}

.article-figure{
  margin: 2rem 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: var(--shadow-1), var(--shadow-2);
}
.article-figure img{width:100%; display:block; height:auto}
.article-figure figcaption{
  padding: .9rem 1.1rem;
  background: var(--bg3);
  font-size: .82rem; color: var(--t3);
  font-style: italic;
  text-align: center;
}

/* Tags + share + author */
.article-tags{
  display:flex; flex-wrap:wrap; gap:.5rem;
  margin-top: 2rem;
}
.article-tag{
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.42rem .9rem; border-radius: 30px;
  font-size:.76rem; font-weight: 600;
  color: var(--blue-mid);
  background: var(--accent-g);
  border: 1px solid rgba(37,99,168,.18);
  transition: background .2s, color .2s;
}
.article-tag:hover{background: var(--blue-mid); color: #fff}

.article-share{
  display:flex; align-items:center; gap:.65rem;
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--bdr);
}
.article-share-lbl{
  font-size:.7rem; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--t3); font-weight: 700;
  margin-right: .4rem;
}
.share-btn{
  width: 38px; height: 38px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius: 9px;
  background: var(--card);
  border: 1px solid var(--bdr);
  color: var(--t2);
  transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.share-btn:hover{
  background: var(--blue-mid); color: #fff; border-color: var(--blue-mid);
  transform: translateY(-2px);
}
.share-btn svg{width:15px;height:15px}

/* Article navigation (prev/next) */
.article-nav{
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
  margin: 4rem auto 0;
  max-width: 760px;
}
.article-nav-card{
  display:flex; flex-direction:column; gap:.4rem;
  padding: 1.2rem 1.4rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 12px;
  transition: transform .25s, box-shadow .25s, border-color .25s;
  cursor: pointer;
}
.article-nav-card:hover{
  transform: translateY(-3px);
  box-shadow: var(--shadow-1), var(--shadow-2);
  border-color: rgba(201,169,97,.32);
}
.article-nav-lbl{
  font-size: .68rem; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--blue-mid); font-weight: 700;
  display:inline-flex; align-items:center; gap:.4rem;
}
.article-nav-lbl svg{width:12px;height:12px}
.article-nav-card.prev{text-align: left}
.article-nav-card.next{text-align: right}
.article-nav-card.next .article-nav-lbl{justify-content: flex-end}
.article-nav-title{
  font-family: var(--serif);
  font-size: .98rem; font-weight: 700; line-height: 1.4;
  color: var(--t1);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* Related news */
#article-related{padding: 5rem 0; background: var(--bg2)}

@media(max-width: 720px){
  .article-hero{padding: 7rem 0 3rem}
  .article-meta{gap: .85rem 1.2rem; font-size: .8rem}
  .article-content{font-size: .96rem}
  .article-lead{font-size: 1.05rem; padding-left: .9rem}
  .article-nav{grid-template-columns: 1fr}
  .article-nav-card.next{text-align: left}
  .article-nav-card.next .article-nav-lbl{justify-content: flex-start}
}

/* ═══════════════════════════════════════════════════
   ARTICLE ATTACHMENTS (PDFs / files in yangilik.html)
═══════════════════════════════════════════════════ */
.article-attachments{
  margin: 2.5rem 0;
  padding: 1.5rem 1.6rem;
  background: linear-gradient(135deg, var(--bg3), var(--card));
  border: 1px solid var(--bdr);
  border-radius: 14px;
  position: relative;
}
.article-attachments::before{
  content:''; position:absolute; top:0; left:1.6rem; right:1.6rem; height:3px;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold));
  border-radius: 0 0 3px 3px;
}
.article-attachments h3{
  font-family: var(--serif);
  font-size: 1.05rem; font-weight: 700;
  color: var(--t1);
  margin-bottom: 1rem;
  display:flex; align-items:center; gap:.6rem;
}
.article-attachments h3 svg{width: 18px; height: 18px; color: var(--gold-warm)}
.attachment-list{display:flex; flex-direction:column; gap:.7rem}

.attachment-item{
  display:grid; grid-template-columns: 56px 1fr auto; gap: 1rem;
  align-items: center;
  padding: 1rem 1.1rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 10px;
  transition: transform .25s var(--ease), box-shadow .25s, border-color .25s;
  text-decoration: none;
  color: inherit;
}
.attachment-item:hover{
  transform: translateY(-2px);
  border-color: rgba(201,169,97,.35);
  box-shadow: var(--shadow-1), var(--shadow-2);
}
.attachment-ico{
  width: 56px; height: 64px;
  position: relative;
  background: linear-gradient(135deg, #d83b3b, #b02323);
  border-radius: 6px;
  display:flex; align-items:flex-end; justify-content:center;
  padding-bottom: .65rem;
  color:#fff;
  box-shadow: 0 4px 12px rgba(176,35,35,.3), inset 0 1px 0 rgba(255,255,255,.2);
  flex-shrink: 0;
}
.attachment-ico::before{
  content: '';
  position: absolute;
  top: 0; right: 0;
  border-style: solid;
  border-width: 0 14px 14px 0;
  border-color: transparent rgba(255,255,255,.25) transparent transparent;
}
.attachment-ico-label{
  font-size: .7rem; font-weight: 800; letter-spacing: .8px;
}
/* Variants for other file types */
.attachment-ico.video{background: linear-gradient(135deg, #2563a8, #1a4a7a)}
.attachment-ico.doc{background: linear-gradient(135deg, #2b6fb5, #1e5489)}
.attachment-ico.zip{background: linear-gradient(135deg, #7a5a1f, #b08d3f)}

.attachment-info{display:flex; flex-direction:column; gap:.3rem; min-width:0}
.attachment-name{
  font-family: var(--serif);
  font-size: .98rem; font-weight: 700;
  color: var(--t1); line-height: 1.35;
  word-break: break-word;
}
.attachment-meta{
  display:flex; flex-wrap:wrap; gap: .55rem 1rem;
  font-size: .76rem; color: var(--t3);
  align-items: center;
}
.attachment-meta span{display:inline-flex; align-items:center; gap:.35rem}
.attachment-meta svg{width: 12px; height: 12px}
.attachment-meta-tag{
  font-size:.66rem; letter-spacing:1.2px; text-transform:uppercase;
  font-weight: 700; color: var(--blue-mid);
}

.attachment-action{
  display:inline-flex; align-items:center; gap:.45rem;
  padding: .65rem 1.05rem;
  font-size: .8rem; font-weight: 600;
  color: var(--blue-mid);
  background: var(--accent-g);
  border: 1px solid rgba(37,99,168,.22);
  border-radius: 30px;
  white-space: nowrap;
  transition: background .25s, color .25s, gap .25s var(--ease);
}
.attachment-action svg{width:13px;height:13px;transition: transform .25s}
.attachment-item:hover .attachment-action{
  background: var(--blue-mid); color:#fff; border-color: var(--blue-mid);
  gap:.6rem;
}
.attachment-item:hover .attachment-action svg{transform: translateY(2px)}

/* Inline PDF preview (optional iframe) */
.pdf-preview{
  margin: 1.5rem 0 0;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--bdr);
  box-shadow: var(--shadow-1), var(--shadow-2);
  background: var(--bg3);
}
.pdf-preview-hdr{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding: .85rem 1.2rem;
  background: var(--card);
  border-bottom: 1px solid var(--bdr);
  font-size: .82rem; color: var(--t2);
}
.pdf-preview-hdr b{color: var(--t1); font-weight: 700}
.pdf-preview-hdr svg{width:14px;height:14px;color: var(--gold-warm)}
.pdf-preview iframe{
  width: 100%; height: 720px;
  border: 0; display: block;
  background: var(--bg3);
}
.pdf-preview-toggle{
  background: transparent; border: 1px solid var(--bdr);
  padding: .4rem .9rem; border-radius: 7px;
  font-size: .76rem; font-weight: 600; color: var(--t2);
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
}
.pdf-preview-toggle:hover{background: var(--accent-g); color: var(--blue-mid); border-color: var(--blue-mid)}

@media(max-width: 600px){
  .attachment-item{grid-template-columns: 48px 1fr; gap: .85rem; padding: .85rem}
  .attachment-action{grid-column: 2; justify-self: start; padding: .5rem .9rem}
  .attachment-ico{width:48px; height:56px}
  .pdf-preview iframe{height: 480px}
}

/* ═══ JOURNALS — Featured + Bento Grid ═══ */
.jrn-section{position:relative; padding:6rem 0 7rem; overflow:hidden}
.jrn-bg-mesh{
  position:absolute; inset:0; pointer-events:none; opacity:.5; z-index:0;
  background:
    radial-gradient(60% 50% at 12% 20%, rgba(59,130,196,.16), transparent 60%),
    radial-gradient(50% 40% at 92% 80%, rgba(94,180,232,.14), transparent 65%);
}
[data-theme="dark"] .jrn-bg-mesh{opacity:.35}
.jrn-section .container{position:relative; z-index:1}
.jrn-hdr{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:1rem; margin-bottom:2.5rem}

/* Featured hero card */
.jrn-hero{
  position:relative; display:grid; grid-template-columns:auto 1fr;
  gap:3rem; align-items:center; padding:2.5rem 2.75rem;
  background:linear-gradient(135deg, rgba(255,255,255,.85), rgba(255,255,255,.6));
  border:1px solid var(--bdr); border-radius:22px;
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  box-shadow:0 20px 50px rgba(26,74,122,.10);
  overflow:hidden;
  transition:transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s;
  text-decoration:none;
}
[data-theme="dark"] .jrn-hero{
  background:linear-gradient(135deg, rgba(22,34,55,.85), rgba(15,24,40,.6));
  box-shadow:0 20px 50px rgba(0,0,0,.35);
}
.jrn-hero:hover{transform:translateY(-4px); box-shadow:0 30px 70px rgba(26,74,122,.18)}
.jrn-hero::before{
  content:''; position:absolute; left:-30%; top:-30%; width:60%; height:60%;
  background:conic-gradient(from 0deg, transparent, rgba(59,130,196,.18), transparent 50%);
  filter:blur(40px); pointer-events:none;
  animation:jrnRotate 22s linear infinite;
}
@keyframes jrnRotate{to{transform:rotate(360deg)}}

.jrn-hero-cover{
  position:relative; width:260px; aspect-ratio:3/4; border-radius:14px;
  overflow:hidden; flex-shrink:0;
  transform:rotate(-3deg);
  transition:transform .6s cubic-bezier(.22,1,.36,1), box-shadow .5s;
  box-shadow:0 30px 60px -20px rgba(0,0,0,.4), 0 18px 35px -15px rgba(26,74,122,.3);
}
.jrn-hero-cover::after{
  content:''; position:absolute; left:0; top:0; bottom:0; width:14px;
  background:linear-gradient(90deg, rgba(0,0,0,.16), transparent);
  pointer-events:none; z-index:2;
}
.jrn-hero-cover img{width:100%; height:100%; object-fit:cover; display:block}
.jrn-hero-fallback{
  width:100%; height:100%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color:#fff;
}
.jrn-hero-fallback span{font-size:2.4rem; font-weight:800; letter-spacing:3px}
.jrn-hero-fallback small{font-size:.85rem; opacity:.85; letter-spacing:1.4px; text-transform:uppercase; margin-top:.4rem}
.jrn-img-missing{background:linear-gradient(135deg, var(--blue-dark), var(--blue-mid))}
.jrn-hero-glare{
  position:absolute; inset:0; pointer-events:none; z-index:2;
  background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.4) 48%, transparent 62%);
  background-size:240% 100%; background-position:-40% 0;
  transition:background-position 1.1s ease; mix-blend-mode:overlay;
}
.jrn-hero:hover .jrn-hero-cover{transform:rotate(-1deg) translateY(-6px); box-shadow:0 40px 80px -20px rgba(0,0,0,.5), 0 22px 45px -15px rgba(26,74,122,.4)}
.jrn-hero:hover .jrn-hero-glare{background-position:140% 0}

.jrn-hero-info{position:relative; z-index:2; max-width:520px}
.jrn-hero-tag{
  display:inline-flex; align-items:center; gap:.45rem;
  font-size:.7rem; font-weight:800; letter-spacing:1.6px; text-transform:uppercase;
  color:var(--blue-mid); padding:.4rem .85rem;
  background:rgba(59,130,196,.1); border:1px solid rgba(59,130,196,.22);
  border-radius:30px; margin-bottom:1rem;
}
.jrn-hero-dot{width:6px; height:6px; background:var(--blue-mid); border-radius:50%; box-shadow:0 0 0 4px rgba(59,130,196,.18); animation:jrnPulse 2s infinite}
@keyframes jrnPulse{0%,100%{box-shadow:0 0 0 4px rgba(59,130,196,.18)}50%{box-shadow:0 0 0 8px rgba(59,130,196,.05)}}
.jrn-hero-num{
  display:inline-block; margin-left:.5rem; vertical-align:middle;
  font-size:.78rem; font-weight:800; letter-spacing:.5px;
  background:linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color:#fff; padding:.32rem .75rem; border-radius:8px;
  box-shadow:0 4px 12px rgba(26,74,122,.3);
}
.jrn-hero-title{
  font-family:'Cormorant Garamond', Georgia, serif;
  font-size:clamp(1.7rem, 2.4vw, 2.4rem); line-height:1.18;
  color:var(--t1); margin:.6rem 0 .65rem; font-weight:600; letter-spacing:-.5px;
}
.jrn-hero-period{font-size:1.02rem; color:var(--t2); margin:0 0 1.2rem; font-style:italic; opacity:.85}
.jrn-hero-meta{display:flex; flex-wrap:wrap; gap:1.1rem; margin-bottom:1.5rem}
.jrn-hero-meta span{
  display:inline-flex; align-items:center; gap:.45rem;
  font-size:.85rem; color:var(--t2); font-weight:500;
}
.jrn-hero-meta svg{color:var(--blue-mid); opacity:.75; flex-shrink:0}
.jrn-hero-cta{
  display:inline-flex; align-items:center; gap:.55rem;
  background:linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color:#fff; font-size:.95rem; font-weight:600;
  padding:.8rem 1.6rem; border-radius:11px;
  transition:gap .3s, box-shadow .3s;
  box-shadow:0 10px 26px -8px rgba(26,74,122,.5);
}
.jrn-hero:hover .jrn-hero-cta{gap:.85rem; box-shadow:0 14px 32px -8px rgba(26,74,122,.6)}

/* Bento grid for rest */
.jrn-grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
  gap:1.25rem; margin-top:2rem;
}
.jrn-card{
  position:relative; display:flex; flex-direction:column;
  background:var(--bg2); border:1px solid var(--bdr); border-radius:16px;
  overflow:hidden; text-decoration:none;
  transition:transform .45s cubic-bezier(.22,1,.36,1), box-shadow .45s, border-color .45s;
}
.jrn-card:hover{transform:translateY(-6px); border-color:rgba(59,130,196,.35); box-shadow:0 22px 50px -10px rgba(26,74,122,.22)}
.jrn-card-cover{
  position:relative; aspect-ratio:3/4; overflow:hidden;
  background:linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
}
.jrn-card-cover img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .65s cubic-bezier(.22,1,.36,1);
}
.jrn-card:hover .jrn-card-cover img{transform:scale(1.05)}
.jrn-card-fallback{
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:800; font-size:1.4rem; letter-spacing:2.5px;
}
.jrn-card-num{
  position:absolute; top:.85rem; left:.85rem; z-index:2;
  font-size:.74rem; font-weight:800; letter-spacing:.5px;
  background:rgba(255,255,255,.95); color:var(--blue-dark);
  padding:.32rem .72rem; border-radius:30px;
  box-shadow:0 4px 12px rgba(0,0,0,.18);
}
.jrn-card-glare{
  position:absolute; inset:0; pointer-events:none; z-index:1;
  background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.32) 48%, transparent 62%);
  background-size:240% 100%; background-position:-40% 0;
  transition:background-position 1s ease; mix-blend-mode:overlay;
}
.jrn-card:hover .jrn-card-glare{background-position:140% 0}
.jrn-card-body{
  display:flex; align-items:center; justify-content:space-between;
  gap:.75rem; padding:.95rem 1.1rem;
}
.jrn-card-time{margin:0; font-size:.85rem; color:var(--t2); font-weight:500; line-height:1.3}
.jrn-card-arrow{
  flex-shrink:0; width:30px; height:30px; border-radius:50%;
  background:var(--bg3); color:var(--blue-mid);
  display:flex; align-items:center; justify-content:center;
  transition:background .3s, color .3s, transform .3s;
}
.jrn-card:hover .jrn-card-arrow{background:var(--blue-mid); color:#fff; transform:translateX(3px)}

@media(max-width:900px){
  .jrn-hero{grid-template-columns:1fr; padding:2rem; gap:2rem; text-align:center}
  .jrn-hero-cover{margin:0 auto}
  .jrn-hero-info{margin:0 auto}
  .jrn-hero-meta{justify-content:center}
}
@media(max-width:640px){
  .jrn-section{padding:4rem 0 5rem}
  .jrn-hero{padding:1.5rem; gap:1.5rem}
  .jrn-hero-cover{width:200px}
  .jrn-hero-title{font-size:1.5rem}
  .jrn-grid{grid-template-columns:repeat(2, 1fr); gap:.85rem}
  .jrn-card-body{padding:.7rem .85rem}
  .jrn-card-time{font-size:.76rem}
}

/* ═══ PARTNERS — Dual marquee + glassmorphism ═══ */
.partners-section{position:relative; padding:5.5rem 0 6rem; overflow:hidden}
.partners-bg{position:absolute; inset:0; pointer-events:none; z-index:0}
.partners-orb{position:absolute; border-radius:50%; filter:blur(80px); opacity:.35}
.partners-orb-a{width:520px; height:520px; background:radial-gradient(circle, rgba(59,130,196,.4), transparent 65%); top:-150px; left:-100px; animation:partnersFloat 14s ease-in-out infinite}
.partners-orb-b{width:440px; height:440px; background:radial-gradient(circle, rgba(94,180,232,.35), transparent 65%); bottom:-120px; right:-80px; animation:partnersFloat 18s ease-in-out infinite reverse}
@keyframes partnersFloat{0%,100%{transform:translate(0,0)}50%{transform:translate(40px,30px)}}
.partners-section .container{position:relative; z-index:1}

.partners-hdr{text-align:center; margin-bottom:3rem}
.partners-hdr .p-lbl{
  display:inline-block; font-size:.72rem; font-weight:800; letter-spacing:2.5px;
  text-transform:uppercase; color:var(--blue-mid); margin-bottom:.85rem;
  padding:.4rem 1rem; background:rgba(59,130,196,.1); border-radius:30px;
}
.partners-title{
  font-family:'Cormorant Garamond', Georgia, serif;
  font-size:clamp(2rem, 3.5vw, 3rem); font-weight:600; letter-spacing:-.5px;
  color:var(--t1); margin:0 0 1.75rem; line-height:1.1;
}
.partners-stats{
  display:inline-flex; gap:2rem; align-items:center;
  padding:1rem 2rem; background:var(--bg2); border:1px solid var(--bdr);
  border-radius:18px; box-shadow:0 10px 30px rgba(26,74,122,.08);
}
.pstat{display:flex; flex-direction:column; align-items:center; gap:.15rem}
.pstat-num{
  font-family:'Cormorant Garamond', Georgia, serif;
  font-size:1.85rem; font-weight:700; line-height:1;
  background:linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.pstat-lbl{font-size:.7rem; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; color:var(--t3)}
.pstat-divider{width:1px; height:36px; background:var(--bdr)}

.partners-rows{display:flex; flex-direction:column; gap:1.25rem}
.partners-marquee{overflow:hidden; padding:6px 0; mask-image:linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%); -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%)}
.partners-track{
  display:flex; gap:18px; width:max-content;
  animation:partnersScroll 38s linear infinite;
  will-change:transform;
}
.partners-row-bot .partners-track{animation:partnersScrollR 44s linear infinite}
.partners-marquee:hover .partners-track{animation-play-state:paused}
@keyframes partnersScroll{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
@keyframes partnersScrollR{
  from{transform:translateX(-50%)}
  to{transform:translateX(0)}
}
@media(prefers-reduced-motion:reduce){
  .partners-track{animation:none}
}

.p-card{
  display:flex; align-items:center; gap:1rem;
  padding:1rem 1.4rem; min-width:240px; height:88px;
  background:linear-gradient(135deg, rgba(255,255,255,.85) 0%, rgba(255,255,255,.55) 100%);
  border:1px solid var(--bdr);
  border-radius:16px;
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  box-shadow:0 8px 26px rgba(26,74,122,.06);
  transition:transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s, border-color .35s;
  position:relative; overflow:hidden;
  text-decoration:none; color:inherit; cursor:pointer;
}
.p-card-ext{
  position:absolute; top:.55rem; right:.55rem;
  width:24px; height:24px; border-radius:50%;
  background:rgba(26,74,122,.08); color:var(--accent);
  display:flex; align-items:center; justify-content:center;
  opacity:0; transform:translate(2px,-2px) scale(.85);
  transition:opacity .3s var(--ease), transform .3s var(--ease), background .3s var(--ease);
  pointer-events:none;
}
.p-card-ext svg{width:13px; height:13px}
.p-card:hover .p-card-ext{opacity:1; transform:translate(0,0) scale(1); background:var(--accent); color:#fff}
[data-theme="dark"] .p-card-ext{background:rgba(255,255,255,.08)}
[data-theme="dark"] .p-card{
  background:linear-gradient(135deg, rgba(28,40,60,.85) 0%, rgba(18,28,44,.55) 100%);
  box-shadow:0 8px 26px rgba(0,0,0,.3);
}
.p-card-shine{
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.4) 50%, transparent 65%);
  background-size:250% 100%; background-position:-50% 0;
  transition:background-position .9s ease;
}
.p-card:hover{transform:translateY(-4px) scale(1.02); border-color:rgba(59,130,196,.35); box-shadow:0 18px 42px rgba(26,74,122,.18)}
.p-card:hover .p-card-shine{background-position:150% 0}
.p-card-logo{
  width:60px; height:60px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:#fff; border-radius:12px; padding:.5rem;
  box-shadow:0 3px 10px rgba(0,0,0,.06);
}
.p-card-logo img{max-width:100%; max-height:100%; object-fit:contain; display:block}
.p-card-info{display:flex; flex-direction:column; gap:.15rem; min-width:0}
.p-card-name{font-size:1rem; font-weight:700; color:var(--t1); line-height:1.2; white-space:nowrap}
.p-card-desc{font-size:.78rem; color:var(--t2); line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:160px}

@media(max-width:640px){
  .partners-section{padding:4rem 0 5rem}
  .partners-stats{flex-wrap:wrap; gap:1rem 1.5rem; padding:.85rem 1.4rem}
  .pstat-divider{display:none}
  .pstat-num{font-size:1.5rem}
  .p-card{min-width:200px; padding:.85rem 1.1rem; height:76px}
  .p-card-logo{width:50px; height:50px}
  .p-card-name{font-size:.9rem}
  .p-card-desc{font-size:.72rem; max-width:130px}
}

/* ── PAGE DETAIL ARTICLE ── */
#page-body,
#pages-list,
#publications-list,
#pub-cats,
#photo-gallery,
#video-gallery,
#journals-list,
#timeline,
#mission{padding:3rem 0 5rem}
.page-article{
  background:var(--card); border:1px solid var(--bdr); border-radius:24px;
  padding:clamp(1.25rem, 3vw, 2.5rem);
  box-shadow:var(--shadow-1, 0 6px 30px rgba(20,30,60,.06));
  max-width:980px; margin:0 auto;
  overflow: hidden; /* clip CKEditor overflowing content */
  isolation: isolate;
}
.page-article-img{margin:0 0 1.75rem; border-radius:18px; overflow:hidden}
.page-article-img img{width:100%; height:auto; display:block; object-fit:cover}
.page-article-content{
  font-size:1.05rem; line-height:1.75; color:var(--t1);
  max-width: 100%;
  overflow-wrap: break-word;
  word-wrap: break-word;
}
/* Clear floats so footer/share/nav don't sit beside floating content */
.page-article-content::after{
  content: ''; display: block; clear: both;
}
/* Constrain any floated/positioned children */
.page-article-content > *,
.page-article-content table,
.page-article-content img,
.page-article-content iframe,
.page-article-content video,
.page-article-content embed,
.page-article-content object{
  max-width: 100% !important;
  height: auto;
}
/* Tables: scroll horizontally if too wide instead of overflowing */
.page-article-content table{
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  width: 100%;
}
.page-article-content > *:first-child{margin-top:0}
.page-article-content > *:last-child{margin-bottom:0}
.page-article-content h1,
.page-article-content h2,
.page-article-content h3,
.page-article-content h4,
.page-article-content h5{
  margin:2rem 0 1rem; line-height:1.25; color:var(--t1); font-weight:700;
}
.page-article-content h1{font-size:clamp(1.5rem,2.4vw,2rem)}
.page-article-content h2{font-size:clamp(1.35rem,2.1vw,1.75rem)}
.page-article-content h3{font-size:clamp(1.2rem,1.8vw,1.4rem)}
.page-article-content p{margin:0 0 1.1rem; color:var(--t1)}
.page-article-content strong,
.page-article-content b{font-weight:700; color:var(--t1)}
.page-article-content em,
.page-article-content i{font-style:italic}
.page-article-content small{font-size:.85em; color:var(--t2)}
.page-article-content hr{
  border:0; height:1px; background:linear-gradient(90deg, transparent, var(--bdr), transparent);
  margin:2rem 0;
}
.page-article-content code{
  background:var(--bg3); color:var(--accent);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.92em; padding:.15em .4em; border-radius:6px;
}
.page-article-content pre{
  background:#0f1226; color:#e9ecf5; padding:1rem 1.2rem; border-radius:12px;
  overflow-x:auto; margin:1.25rem 0; line-height:1.55; font-size:.92em;
  border:1px solid var(--bdr);
}
.page-article-content pre code{background:transparent; color:inherit; padding:0}

/* Links */
.page-article-content a{
  position:relative; color:var(--accent); font-weight:600;
  text-decoration:none;
  background-image:linear-gradient(currentColor, currentColor);
  background-size:100% 1px; background-repeat:no-repeat; background-position:0 100%;
  transition:color .25s ease, background-size .25s ease, opacity .25s ease;
  padding-bottom:1px;
  word-break:break-word;
}
.page-article-content a:hover{
  color:var(--accent); background-size:0 1px; opacity:.85;
}
/* External link icon */
.page-article-content a[target="_blank"]:not([href$=".pdf"]):not([href$=".PDF"]):not([href$=".doc"]):not([href$=".docx"]):not([href$=".xls"]):not([href$=".xlsx"]):not([href$=".ppt"]):not([href$=".pptx"]):not([href$=".zip"]):not([href$=".rar"]):not([href$=".7z"])::after{
  content:""; display:inline-block; width:.9em; height:.9em; margin-left:.25em; vertical-align:-1px;
  background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/><polyline points='15 3 21 3 21 9'/><line x1='10' y1='14' x2='21' y2='3'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/><polyline points='15 3 21 3 21 9'/><line x1='10' y1='14' x2='21' y2='3'/></svg>") center/contain no-repeat;
  opacity:.75;
}

/* Document/file links — turn into pill cards */
.page-article-content a[href$=".pdf"],
.page-article-content a[href$=".PDF"],
.page-article-content a[href$=".doc"],
.page-article-content a[href$=".docx"],
.page-article-content a[href$=".DOC"],
.page-article-content a[href$=".DOCX"],
.page-article-content a[href$=".xls"],
.page-article-content a[href$=".xlsx"],
.page-article-content a[href$=".XLS"],
.page-article-content a[href$=".XLSX"],
.page-article-content a[href$=".ppt"],
.page-article-content a[href$=".pptx"],
.page-article-content a[href$=".PPT"],
.page-article-content a[href$=".PPTX"],
.page-article-content a[href$=".zip"],
.page-article-content a[href$=".rar"],
.page-article-content a[href$=".7z"],
.page-article-content a[href$=".ZIP"],
.page-article-content a[href$=".RAR"]{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.55rem .95rem .55rem .8rem;
  margin:.25rem .35rem .25rem 0;
  background:var(--card); color:var(--t1);
  border:1px solid var(--bdr); border-radius:12px;
  font-weight:600; font-size:.92em; line-height:1.3;
  background-image:none; padding-bottom:.55rem;
  box-shadow:0 1px 3px rgba(0,0,0,.04);
  transition:transform .2s ease, box-shadow .25s ease, border-color .25s ease;
}
.page-article-content a[href$=".pdf"]::before,
.page-article-content a[href$=".PDF"]::before,
.page-article-content a[href$=".doc"]::before,
.page-article-content a[href$=".docx"]::before,
.page-article-content a[href$=".DOC"]::before,
.page-article-content a[href$=".DOCX"]::before,
.page-article-content a[href$=".xls"]::before,
.page-article-content a[href$=".xlsx"]::before,
.page-article-content a[href$=".XLS"]::before,
.page-article-content a[href$=".XLSX"]::before,
.page-article-content a[href$=".ppt"]::before,
.page-article-content a[href$=".pptx"]::before,
.page-article-content a[href$=".PPT"]::before,
.page-article-content a[href$=".PPTX"]::before,
.page-article-content a[href$=".zip"]::before,
.page-article-content a[href$=".rar"]::before,
.page-article-content a[href$=".7z"]::before,
.page-article-content a[href$=".ZIP"]::before,
.page-article-content a[href$=".RAR"]::before{
  content:""; display:inline-block; width:1.15em; height:1.15em; flex-shrink:0;
  background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/><polyline points='14 2 14 8 20 8'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/><polyline points='14 2 14 8 20 8'/></svg>") center/contain no-repeat;
}
.page-article-content a[href$=".pdf"],
.page-article-content a[href$=".PDF"]{color:#e02d3c; border-color:rgba(224,45,60,.30); background:rgba(224,45,60,.06)}
.page-article-content a[href$=".doc"],
.page-article-content a[href$=".docx"],
.page-article-content a[href$=".DOC"],
.page-article-content a[href$=".DOCX"]{color:#1a73e8; border-color:rgba(26,115,232,.30); background:rgba(26,115,232,.06)}
.page-article-content a[href$=".xls"],
.page-article-content a[href$=".xlsx"],
.page-article-content a[href$=".XLS"],
.page-article-content a[href$=".XLSX"]{color:#0f9d58; border-color:rgba(15,157,88,.30); background:rgba(15,157,88,.06)}
.page-article-content a[href$=".ppt"],
.page-article-content a[href$=".pptx"],
.page-article-content a[href$=".PPT"],
.page-article-content a[href$=".PPTX"]{color:#d97706; border-color:rgba(217,119,6,.30); background:rgba(217,119,6,.06)}
.page-article-content a[href$=".zip"],
.page-article-content a[href$=".rar"],
.page-article-content a[href$=".7z"],
.page-article-content a[href$=".ZIP"],
.page-article-content a[href$=".RAR"]{color:#9c6cd8; border-color:rgba(156,108,216,.30); background:rgba(156,108,216,.06)}
[data-theme="dark"] .page-article-content a[href$=".pdf"],
[data-theme="dark"] .page-article-content a[href$=".PDF"]{color:#ff6b78}
[data-theme="dark"] .page-article-content a[href$=".doc"],
[data-theme="dark"] .page-article-content a[href$=".docx"],
[data-theme="dark"] .page-article-content a[href$=".DOC"],
[data-theme="dark"] .page-article-content a[href$=".DOCX"]{color:#5fa3f7}
[data-theme="dark"] .page-article-content a[href$=".xls"],
[data-theme="dark"] .page-article-content a[href$=".xlsx"]{color:#3ec78b}
[data-theme="dark"] .page-article-content a[href$=".ppt"],
[data-theme="dark"] .page-article-content a[href$=".pptx"]{color:#ffae45}
.page-article-content a[href$=".pdf"]:hover,
.page-article-content a[href$=".PDF"]:hover,
.page-article-content a[href$=".doc"]:hover,
.page-article-content a[href$=".docx"]:hover,
.page-article-content a[href$=".DOC"]:hover,
.page-article-content a[href$=".DOCX"]:hover,
.page-article-content a[href$=".xls"]:hover,
.page-article-content a[href$=".xlsx"]:hover,
.page-article-content a[href$=".XLS"]:hover,
.page-article-content a[href$=".XLSX"]:hover,
.page-article-content a[href$=".ppt"]:hover,
.page-article-content a[href$=".pptx"]:hover,
.page-article-content a[href$=".PPT"]:hover,
.page-article-content a[href$=".PPTX"]:hover,
.page-article-content a[href$=".zip"]:hover,
.page-article-content a[href$=".rar"]:hover,
.page-article-content a[href$=".7z"]:hover,
.page-article-content a[href$=".ZIP"]:hover,
.page-article-content a[href$=".RAR"]:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(0,0,0,.18);
  opacity:1;
}

/* Lists */
.page-article-content ul,
.page-article-content ol{padding-left:1.5rem; margin:0 0 1.1rem; color:var(--t1)}
.page-article-content li{margin:.4rem 0}
.page-article-content ul li::marker{color:var(--accent)}
.page-article-content ol li::marker{color:var(--accent); font-weight:700}

/* Media */
.page-article-content img{max-width:100%; height:auto; border-radius:14px; margin:1.25rem 0; box-shadow:0 6px 20px rgba(0,0,0,.18)}
.page-article-content figure{margin:1.5rem 0}
.page-article-content figure img{margin:0}
.page-article-content figcaption{
  margin-top:.6rem; font-size:.85rem; color:var(--t2); text-align:center; font-style:italic;
}

.page-article-content blockquote{
  border-left:4px solid var(--accent); padding:.85rem 1.2rem;
  margin:1.5rem 0; background:var(--accent-g);
  border-radius:0 14px 14px 0;
  color:var(--t1); font-style:italic; font-size:1.05em;
  position:relative;
}
.page-article-content blockquote::before{
  content:"\201C"; position:absolute; left:.5rem; top:-.2rem;
  font-size:3rem; color:var(--accent); opacity:.25; font-family:Georgia,serif; line-height:1;
}
.page-article-content blockquote p:last-child{margin-bottom:0}

/* Tables */
.page-article-content table{
  width:100%; border-collapse:separate; border-spacing:0; margin:1.5rem 0;
  border:1px solid var(--bdr); border-radius:14px; overflow:hidden;
  font-size:.95em; background:var(--card);
}
.page-article-content thead th{
  background:var(--bg3);
  font-weight:700; color:var(--t1);
  text-transform:uppercase; font-size:.78em; letter-spacing:.05em;
}
.page-article-content th,
.page-article-content td{padding:.85rem 1.1rem; border-bottom:1px solid var(--bdr); text-align:left; vertical-align:top; color:var(--t1)}
.page-article-content tr:last-child td{border-bottom:0}
.page-article-content tbody tr:hover{background:var(--accent-g)}

.page-article-content iframe{max-width:100%; border-radius:14px; margin:1.25rem 0; border:0}

/* Make sure CKEditor inline styles don't override link cards' display */
.page-article-content [style*="text-align"] a[href$=".pdf"],
.page-article-content [style*="text-align"] a[href$=".PDF"],
.page-article-content [style*="text-align"] a[href$=".doc"],
.page-article-content [style*="text-align"] a[href$=".docx"]{display:inline-flex}

.page-article-pdf{
  margin-top:2rem; border:1px solid var(--bdr); border-radius:18px;
  background:var(--bg3); overflow:hidden;
}
.pdf-head{
  display:flex; align-items:center; gap:1rem;
  padding:1rem 1.25rem; border-bottom:1px solid var(--bdr);
  flex-wrap:wrap;
}
.pdf-ico{
  width:46px; height:46px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#ff5e62 0%,#ff2d55 100%); color:#fff; flex-shrink:0;
}
.pdf-ico svg{width:22px; height:22px}
.pdf-info{display:flex; flex-direction:column; gap:.1rem; flex:1; min-width:0}
.pdf-label{font-size:.7rem; font-weight:700; letter-spacing:.1em; color:var(--t2); text-transform:uppercase}
.pdf-name{font-size:.95rem; font-weight:600; color:var(--t1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pdf-frame{width:100%; height:720px; border:0; display:block; background:#1a1d2e}

.page-article-video{margin-top:2rem; border-radius:18px; overflow:hidden}
.video-frame{position:relative; padding-bottom:56.25%; height:0; background:#000; border-radius:18px; overflow:hidden}
.video-frame iframe{position:absolute; top:0; left:0; width:100%; height:100%; border:0}

.page-article-foot{
  margin-top:2rem; padding-top:1.5rem; border-top:1px solid var(--bdr);
  display:flex; align-items:center; justify-content:space-between; gap:1.25rem; flex-wrap:wrap;
}
.foot-meta{display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap}
.foot-date,
.foot-views{
  display:inline-flex; align-items:center; gap:.45rem;
  font-size:.88rem; color:var(--t2);
}
.foot-date svg,
.foot-views svg{width:16px; height:16px; flex-shrink:0}

.page-nav{
  display:grid; grid-template-columns:1fr 1fr; gap:1.25rem;
  max-width:980px; margin:2.5rem auto 0;
}
.page-nav-item{
  --nav-accent: var(--accent);
  position:relative; display:grid; align-items:center; gap:.85rem 1rem;
  padding:1.25rem 1.5rem;
  background:var(--card);
  border:1px solid var(--bdr); border-radius:20px;
  text-decoration:none; color:inherit; isolation:isolate; overflow:hidden;
  transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease, border-color .3s ease;
}
.page-nav-item::before{
  content:""; position:absolute; inset:0; z-index:-1; opacity:0;
  background:radial-gradient(80% 120% at var(--gx,0%) 50%, var(--accent-g), transparent 60%);
  transition:opacity .35s ease;
}
.page-nav-item::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background:linear-gradient(90deg, transparent, var(--nav-accent), transparent);
  transform:scaleX(0); transform-origin:center; transition:transform .35s ease;
}
.page-nav-item:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px rgba(0,0,0,.18);
  border-color:var(--bdr-h);
}
.page-nav-item:hover::before{opacity:1}
.page-nav-item:hover::after{transform:scaleX(1)}

.page-nav-arrow{
  width:44px; height:44px; flex-shrink:0; border-radius:14px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--accent-g);
  color:var(--nav-accent);
  transition:transform .3s cubic-bezier(.2,.8,.2,1), background .3s ease, color .3s ease;
}
.page-nav-arrow svg{width:20px; height:20px; transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.page-nav-item:hover .page-nav-arrow{
  background:var(--nav-accent); color:#fff;
}

/* Prev: arrow on left, text on right, left-aligned */
.page-nav-prev{--gx:0%; grid-template-columns:auto 1fr; text-align:left}
.page-nav-prev .nav-text{display:flex; flex-direction:column; gap:.3rem; min-width:0}
.page-nav-prev:hover .page-nav-arrow svg{transform:translateX(-3px)}

/* Next: text on left, arrow on right, right-aligned */
.page-nav-next{--gx:100%; grid-template-columns:1fr auto; text-align:right}
.page-nav-next .nav-text{display:flex; flex-direction:column; gap:.3rem; align-items:flex-end; min-width:0}
.page-nav-next:hover .page-nav-arrow svg{transform:translateX(3px)}

.nav-label{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.7rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--nav-accent);
  padding:.2rem .55rem; border-radius:999px;
  background:var(--accent-g); width:fit-content;
}
.nav-title{
  font-size:1.02rem; font-weight:700; color:var(--t1); line-height:1.35;
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; word-break:break-word;
  transition:color .3s ease;
}
.page-nav-item:hover .nav-title{color:var(--nav-accent)}

@media(max-width:768px){
  .page-nav{grid-template-columns:1fr; gap:.85rem; margin-top:2rem}
  .page-nav-item{padding:1rem 1.15rem; border-radius:16px}
  .page-nav-prev,
  .page-nav-next{grid-template-columns:auto 1fr; text-align:left}
  .page-nav-next .nav-text{align-items:flex-start; text-align:left}
  .page-nav-next{order:1}
  .page-nav-next .page-nav-arrow{order:0}
  .page-nav-arrow{width:40px; height:40px; border-radius:12px}
  .nav-title{font-size:.95rem}
}

@media(max-width:768px){
  .page-article{padding:1.25rem; border-radius:18px}
  .page-article-content{font-size:1rem; line-height:1.7}
  .pdf-frame{height:480px}
  .page-nav{grid-template-columns:1fr}
  .page-nav-prev,
  .page-nav-next{padding-left:3.2rem; padding-right:1.2rem; align-items:flex-start; text-align:left}
  .page-nav-next > svg{right:auto; left:1.1rem}
  .page-article-foot{flex-direction:column; align-items:flex-start}
}

/* ── PHOTO GALLERY ── */
#photo-gallery{padding:3rem 0 5rem}
.photo-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
  gap:1rem;
  margin-top:2rem;
}
.photo-card{
  position:relative; display:block; overflow:hidden;
  border-radius:18px; aspect-ratio:4/3; background:#0f1226;
  text-decoration:none; color:#fff; isolation:isolate;
  box-shadow:0 6px 20px rgba(20,30,60,.08);
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease;
}
.photo-card:hover{transform:translateY(-4px); box-shadow:0 18px 40px rgba(20,30,60,.18)}
.photo-card-img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .65s cubic-bezier(.2,.8,.2,1), filter .35s ease;
}
.photo-card:hover .photo-card-img{transform:scale(1.08); filter:brightness(.85)}
.photo-card-overlay{
  position:absolute; inset:0; padding:1rem 1.2rem;
  display:flex; flex-direction:column; justify-content:flex-end;
  background:linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,.75) 100%);
  opacity:1; transition:background .35s ease;
}
.photo-card:hover .photo-card-overlay{
  background:linear-gradient(180deg, rgba(10,30,80,.15) 0%, rgba(0,0,0,.85) 100%);
}
.photo-card-meta{
  transform:translateY(8px); opacity:.9; transition:transform .35s ease, opacity .35s ease;
  display:flex; flex-direction:column; gap:.2rem;
}
.photo-card:hover .photo-card-meta{transform:translateY(0); opacity:1}
.photo-card-title{
  margin:0; font-size:1rem; font-weight:700; line-height:1.3; color:#fff;
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  text-shadow:0 2px 8px rgba(0,0,0,.4);
}
.photo-card-note{
  margin:0; font-size:.82rem; color:rgba(255,255,255,.85); line-height:1.4;
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.photo-card-zoom{
  position:absolute; top:1rem; right:1rem;
  width:42px; height:42px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.92); color:var(--ac, #0a64f4);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  transform:scale(.7) rotate(-90deg); opacity:0;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), opacity .35s ease;
  box-shadow:0 6px 18px rgba(0,0,0,.18);
}
.photo-card-zoom svg{width:18px; height:18px}
.photo-card:hover .photo-card-zoom{transform:scale(1) rotate(0); opacity:1}

/* ── LIGHTBOX ── */
.ph-lightbox{
  position:fixed; inset:0; z-index:9999;
  background:rgba(8,10,28,.92);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition:opacity .3s ease;
  padding:5rem 4rem;
}
.ph-lightbox.is-open{opacity:1; pointer-events:auto}
.ph-lb-stage{
  position:relative; max-width:100%; max-height:100%;
  display:flex; flex-direction:column; align-items:center; gap:1rem;
  margin:0;
}
.ph-lb-img{
  max-width:100%; max-height:calc(100vh - 11rem); display:block;
  border-radius:14px; box-shadow:0 30px 80px rgba(0,0,0,.5);
  background:#0f1226; object-fit:contain;
  animation:phLbIn .35s cubic-bezier(.2,.8,.2,1);
}
@keyframes phLbIn{from{opacity:0; transform:scale(.96)} to{opacity:1; transform:scale(1)}}
.ph-lb-cap{
  display:flex; flex-direction:column; align-items:center; gap:.2rem;
  color:#fff; text-align:center; max-width:720px;
}
.ph-lb-title{font-size:1rem; font-weight:700}
.ph-lb-note{font-size:.85rem; color:rgba(255,255,255,.75)}
.ph-lb-counter{
  font-size:.75rem; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.55); margin-top:.35rem;
}
.ph-lb-close,
.ph-lb-nav{
  position:absolute; z-index:2;
  width:48px; height:48px; border-radius:50%; border:0; cursor:pointer;
  background:rgba(255,255,255,.10); color:#fff;
  display:flex; align-items:center; justify-content:center;
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  transition:background .25s ease, transform .25s ease;
}
.ph-lb-close svg,
.ph-lb-nav svg{width:22px; height:22px}
.ph-lb-close:hover,
.ph-lb-nav:hover{background:rgba(255,255,255,.22); transform:scale(1.06)}
.ph-lb-close{top:1.25rem; right:1.25rem}
.ph-lb-prev{left:1.25rem; top:50%; transform:translateY(-50%)}
.ph-lb-next{right:1.25rem; top:50%; transform:translateY(-50%)}
.ph-lb-prev:hover{transform:translateY(-50%) scale(1.06)}
.ph-lb-next:hover{transform:translateY(-50%) scale(1.06)}

@media(max-width:768px){
  .photo-grid{grid-template-columns:repeat(auto-fill, minmax(160px, 1fr)); gap:.65rem}
  .photo-card{aspect-ratio:1/1; border-radius:14px}
  .photo-card-overlay{padding:.7rem .85rem}
  .photo-card-title{font-size:.85rem}
  .photo-card-note{display:none}
  .photo-card-zoom{width:34px; height:34px; top:.6rem; right:.6rem}
  .photo-card-zoom svg{width:14px; height:14px}
  .ph-lightbox{padding:4rem .75rem}
  .ph-lb-close{top:.75rem; right:.75rem; width:40px; height:40px}
  .ph-lb-prev{left:.5rem; width:40px; height:40px}
  .ph-lb-next{right:.5rem; width:40px; height:40px}
  .ph-lb-img{max-height:calc(100vh - 9rem); border-radius:10px}
}

/* ── VIDEO GALLERY ── */
#video-gallery{padding:3rem 0 5rem}
.video-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
  gap:1.25rem;
  margin-top:2rem;
}
.video-card{
  position:relative; display:block; overflow:hidden;
  border-radius:18px; aspect-ratio:16/9; background:#0f1226;
  border:0; padding:0; cursor:pointer; isolation:isolate; color:#fff;
  box-shadow:0 6px 22px rgba(20,30,60,.10);
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease;
  font:inherit;
}
.video-card:hover{transform:translateY(-4px); box-shadow:0 22px 50px rgba(20,30,60,.20)}
.video-card-thumb{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .65s cubic-bezier(.2,.8,.2,1), filter .35s ease;
}
.video-card-thumb--ph{background:linear-gradient(135deg,#13182f 0%,#1d2548 100%)}
.video-card:hover .video-card-thumb{transform:scale(1.06); filter:brightness(.75)}
.video-card-overlay{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(180deg, rgba(8,10,28,.18) 0%, rgba(8,10,28,.55) 100%);
  transition:background .35s ease;
}
.video-card:hover .video-card-overlay{background:linear-gradient(180deg, rgba(8,10,28,.35) 0%, rgba(8,10,28,.75) 100%)}
.video-play{
  width:72px; height:72px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.95); color:#e02d3c;
  box-shadow:0 14px 36px rgba(0,0,0,.35);
  transition:transform .35s cubic-bezier(.2,.8,.2,1), background .25s ease, color .25s ease;
}
.video-play svg{width:30px; height:30px; margin-left:4px}
.video-card:hover .video-play{transform:scale(1.12); background:#fff; color:#c4242f}
.video-card-badge{
  position:absolute; top:.85rem; left:.85rem;
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.3rem .6rem; border-radius:8px;
  background:rgba(8,10,28,.65); color:#fff;
  font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.video-card-badge svg{width:14px; height:14px; color:#ff2d55}

/* ── VIDEO LIGHTBOX ── */
.vd-lightbox{
  position:fixed; inset:0; z-index:9999;
  background:rgba(8,10,28,.93);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition:opacity .3s ease;
  padding:5rem 4rem;
}
.vd-lightbox.is-open{opacity:1; pointer-events:auto}
.vd-lb-stage{
  width:100%; max-width:1100px;
  display:flex; flex-direction:column; align-items:center; gap:1rem;
}
.vd-lb-frame{
  position:relative; width:100%; padding-bottom:56.25%; height:0;
  border-radius:14px; overflow:hidden;
  box-shadow:0 30px 80px rgba(0,0,0,.5); background:#000;
  animation:vdLbIn .35s cubic-bezier(.2,.8,.2,1);
}
@keyframes vdLbIn{from{opacity:0; transform:scale(.96)} to{opacity:1; transform:scale(1)}}
.vd-lb-iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.vd-lb-counter{
  font-size:.75rem; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.55);
}
.vd-lb-close,
.vd-lb-nav{
  position:absolute; z-index:2;
  width:48px; height:48px; border-radius:50%; border:0; cursor:pointer;
  background:rgba(255,255,255,.10); color:#fff;
  display:flex; align-items:center; justify-content:center;
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  transition:background .25s ease, transform .25s ease;
}
.vd-lb-close svg,
.vd-lb-nav svg{width:22px; height:22px}
.vd-lb-close:hover,
.vd-lb-nav:hover{background:rgba(255,255,255,.22); transform:scale(1.06)}
.vd-lb-close{top:1.25rem; right:1.25rem}
.vd-lb-prev{left:1.25rem; top:50%; transform:translateY(-50%)}
.vd-lb-next{right:1.25rem; top:50%; transform:translateY(-50%)}
.vd-lb-prev:hover{transform:translateY(-50%) scale(1.06)}
.vd-lb-next:hover{transform:translateY(-50%) scale(1.06)}

@media(max-width:768px){
  .video-grid{grid-template-columns:1fr; gap:.85rem}
  .video-card{border-radius:14px}
  .video-play{width:56px; height:56px}
  .video-play svg{width:22px; height:22px; margin-left:3px}
  .video-card-badge{top:.6rem; left:.6rem; padding:.22rem .5rem; font-size:.65rem}
  .vd-lightbox{padding:4rem .75rem}
  .vd-lb-close{top:.75rem; right:.75rem; width:40px; height:40px}
  .vd-lb-prev{left:.5rem; width:40px; height:40px}
  .vd-lb-next{right:.5rem; width:40px; height:40px}
}

/* ── PUB FILES (attached files list inside publication detail) ── */
.pub-files{
  margin-top:2rem; padding:1.25rem 1.5rem;
  background:var(--bg3); border:1px solid var(--bdr); border-radius:18px;
}
.pub-files-title{
  display:flex; align-items:center; gap:.55rem;
  margin:0 0 1rem; font-size:1rem; font-weight:700; color:var(--t1);
}
.pub-files-title svg{width:18px; height:18px; color:var(--accent)}
.pub-files-list{display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:.7rem}
.pub-file{
  --f-color: var(--accent);
  display:grid; grid-template-columns:42px 1fr auto; align-items:center; gap:.85rem;
  padding:.7rem .9rem; background:var(--card);
  border:1px solid var(--bdr); border-radius:12px;
  text-decoration:none; color:var(--t1);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.pub-file:hover{
  transform:translateY(-2px); box-shadow:0 10px 28px rgba(0,0,0,.10);
  border-color:var(--bdr-h);
}
.pub-file-ico{
  width:42px; height:42px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  background:color-mix(in srgb, var(--f-color) 14%, transparent); color:var(--f-color);
  flex-shrink:0;
}
.pub-file-ico svg{width:20px; height:20px}
.pub-file-info{display:flex; flex-direction:column; gap:.05rem; min-width:0}
.pub-file-label{
  font-size:.65rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--f-color);
}
.pub-file-name{font-size:.92rem; font-weight:600; color:var(--t1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pub-file-arrow{
  width:32px; height:32px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--accent-g); color:var(--accent); flex-shrink:0;
  transition:transform .25s ease, background .25s ease, color .25s ease;
}
.pub-file-arrow svg{width:14px; height:14px}
.pub-file:hover .pub-file-arrow{background:var(--accent); color:#fff; transform:translateY(-2px)}
.pub-file--pdf{--f-color:#e02d3c}
.pub-file--doc{--f-color:#1a73e8}
.pub-file--xls{--f-color:#0f9d58}
.pub-file--ppt{--f-color:#d97706}
.pub-file--zip{--f-color:#9c6cd8}
[data-theme="dark"] .pub-file--pdf{--f-color:#ff6b78}
[data-theme="dark"] .pub-file--doc{--f-color:#5fa3f7}
[data-theme="dark"] .pub-file--xls{--f-color:#3ec78b}
[data-theme="dark"] .pub-file--ppt{--f-color:#ffae45}

/* ── PAGINATION (publications list) ── */
.pub-pagination{
  display:flex; align-items:center; justify-content:center; gap:.5rem;
  margin:3rem auto 0; flex-wrap:wrap;
}
.pub-page-numbers{
  display:flex; align-items:center; gap:.35rem;
  list-style:none; margin:0; padding:0;
}
.pub-page,
.pub-page-nav{
  display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  min-width:42px; height:42px; padding:0 .9rem;
  background:var(--card); border:1px solid var(--bdr); border-radius:11px;
  color:var(--t1); text-decoration:none; font-weight:600; font-size:.92rem;
  transition:transform .2s ease, background .25s ease, color .25s ease, border-color .25s ease;
}
.pub-page-nav svg{width:16px; height:16px}
.pub-page:hover,
.pub-page-nav:hover{
  background:var(--accent-g); color:var(--accent); border-color:var(--bdr-h);
  transform:translateY(-2px);
}
.pub-page.is-current{
  background:var(--accent); color:#fff; border-color:var(--accent);
  cursor:default;
}
.pub-page-nav.is-disabled{
  opacity:.4; pointer-events:none;
}
.pub-page-dots{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:42px; height:42px; color:var(--t2); font-weight:600;
}

/* conf-meta-row inside publications list */
.conf-meta-row{display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-top:.4rem}

/* ── PUBLICATION CATEGORY GRID ── */
#pub-cats{padding:3rem 0 5rem}
.pub-cat-grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
  gap:1.5rem; margin-top:2.5rem;
}
.pub-cat-card{
  display:flex; flex-direction:column; overflow:hidden;
  background:var(--card); border:1px solid var(--bdr); border-radius:20px;
  text-decoration:none; color:inherit; isolation:isolate;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, border-color .35s ease;
  position:relative;
}
.pub-cat-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:3px; z-index:2;
  background:linear-gradient(90deg, var(--accent), transparent);
  transform:scaleX(0); transform-origin:left; transition:transform .4s ease;
}
.pub-cat-card:hover{
  transform:translateY(-6px);
  box-shadow:0 22px 50px rgba(0,0,0,.14);
  border-color:var(--bdr-h);
}
.pub-cat-card:hover::before{transform:scaleX(1)}

.pub-cat-img{
  position:relative; aspect-ratio:16/10; overflow:hidden;
  background:linear-gradient(135deg, var(--bg3), var(--card));
}
.pub-cat-img img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .65s cubic-bezier(.2,.8,.2,1), filter .35s ease;
}
.pub-cat-card:hover .pub-cat-img img{transform:scale(1.06)}
.pub-cat-img-ph{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  color:var(--accent); opacity:.4;
}
.pub-cat-img-ph svg{width:60px; height:60px}
.pub-cat-badge{
  position:absolute; top:1rem; left:1rem; z-index:2;
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.3rem .7rem; border-radius:999px;
  background:rgba(255,255,255,.92); color:var(--accent);
  font-size:.65rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  box-shadow:0 4px 12px rgba(0,0,0,.10);
}
[data-theme="dark"] .pub-cat-badge{background:rgba(15,32,53,.88); color:var(--accent)}

.pub-cat-body{
  padding:1.4rem 1.5rem 1.5rem;
  display:flex; flex-direction:column; gap:.65rem; flex:1;
}
.pub-cat-title{
  margin:0; font-size:1.1rem; font-weight:700; line-height:1.35; color:var(--t1);
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  transition:color .3s ease;
}
.pub-cat-card:hover .pub-cat-title{color:var(--accent)}
.pub-cat-desc{
  margin:0; font-size:.88rem; color:var(--t2); line-height:1.55;
  display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
  flex:1;
}
.pub-cat-cta{
  display:inline-flex; align-items:center; gap:.4rem;
  margin-top:.5rem; font-size:.85rem; font-weight:700; color:var(--accent);
  letter-spacing:.02em;
  transition:gap .25s ease;
}
.pub-cat-cta svg{width:14px; height:14px; transition:transform .25s ease}
.pub-cat-card:hover .pub-cat-cta{gap:.65rem}
.pub-cat-card:hover .pub-cat-cta svg{transform:translateX(3px)}

@media(max-width:768px){
  .pub-cat-grid{grid-template-columns:1fr; gap:1rem}
  .pub-cat-card{border-radius:16px}
  .pub-cat-body{padding:1.1rem 1.2rem 1.25rem}
  .pub-cat-title{font-size:1rem}
}

@media(max-width:768px){
  .pub-files-list{grid-template-columns:1fr}
  .pub-pagination{gap:.35rem}
  .pub-page,
  .pub-page-nav{min-width:38px; height:38px; padding:0 .7rem; font-size:.85rem}
  .pub-page-nav span{display:none}
}

/* ═══════════════════════════════════════════════════════════════
   FOOTER — 2026 MODERN REDESIGN (premium effects, same palette)
═══════════════════════════════════════════════════════════════ */
#ftr{
  position:relative;
  background:
    radial-gradient(1200px 600px at 8% -10%, rgba(37,99,168,.28), transparent 60%),
    radial-gradient(900px 500px at 92% 110%, rgba(91,163,217,.18), transparent 65%),
    radial-gradient(700px 400px at 50% 50%, rgba(201,169,97,.06), transparent 70%),
    linear-gradient(180deg, #0a1828 0%, #0b1a2b 45%, #081522 100%);
  overflow:hidden;
  isolation:isolate;
}

/* Animated mesh background */
#ftr::before{
  content:'';
  position:absolute; inset:0;
  background:
    radial-gradient(2px 2px at 20% 30%, rgba(255,255,255,.18), transparent),
    radial-gradient(1px 1px at 60% 70%, rgba(201,169,97,.35), transparent),
    radial-gradient(1.5px 1.5px at 80% 20%, rgba(91,163,217,.4), transparent),
    radial-gradient(1px 1px at 30% 80%, rgba(255,255,255,.15), transparent),
    radial-gradient(2px 2px at 90% 60%, rgba(201,169,97,.25), transparent);
  background-size: 100% 100%;
  opacity:.55;
  z-index:-1;
  animation: ftr-stars 22s ease-in-out infinite alternate;
  height:auto;
}
@keyframes ftr-stars{
  0%   { transform: translate3d(0,0,0); opacity:.45; }
  50%  { opacity:.7; }
  100% { transform: translate3d(-20px,-10px,0); opacity:.5; }
}

/* Floating decorative orbs */
#ftr::after{
  content:'';
  position:absolute;
  width:520px; height:520px; border-radius:50%;
  top:-200px; right:-160px;
  background: radial-gradient(circle, rgba(37,99,168,.22), transparent 70%);
  filter: blur(40px);
  z-index:-1;
  animation: ftr-orb 14s ease-in-out infinite alternate;
  pointer-events:none;
}
@keyframes ftr-orb{
  0%   { transform: translate(0,0) scale(1);   opacity:.55; }
  100% { transform: translate(-40px,30px) scale(1.08); opacity:.85; }
}

/* Top gold shimmer line */
#ftr > .container{ position:relative; z-index:2; }
#ftr .container::before{
  content:'';
  position:absolute;
  top:-4.5rem; left:0; right:0;
  height:1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(201,169,97,.0) 10%,
    rgba(201,169,97,.55) 30%,
    rgba(201,169,97,.95) 50%,
    rgba(201,169,97,.55) 70%,
    rgba(201,169,97,0) 90%,
    transparent 100%);
  background-size: 200% 100%;
  animation: ftr-shimmer 6s linear infinite;
  box-shadow: 0 0 18px rgba(201,169,97,.45);
}
@keyframes ftr-shimmer{
  0%   { background-position: -100% 0; }
  100% { background-position:  100% 0; }
}

/* Override the older ::before single line so it doesn't double */
#ftr::before{ pointer-events:none; }

/* Grid spacing — slight breathing room */
.ftr-grid{ padding-top:1.2rem; }

/* ── Brand block ── */
.ftr-logo-img{
  filter: drop-shadow(0 6px 18px rgba(37,99,168,.45));
  transition: filter .4s var(--ease), transform .4s var(--ease);
}
.ftr-logo:hover .ftr-logo-img{
  filter: drop-shadow(0 10px 28px rgba(91,163,217,.6));
  transform: translateY(-2px);
}
.ftr-desc{
  position:relative;
  padding-left:.85rem;
  border-left:2px solid transparent;
  /* background-image: linear-gradient(180deg, rgba(201,169,97,.7), rgba(91,163,217,.35)); */
  background-clip: padding-box, border-box;
  border-image: linear-gradient(180deg, rgba(201,169,97,.65), rgba(91,163,217,.25)) 1;
}

/* ── Address — pill rows with hover glow ── */
.ftr-address{ gap:.45rem; }
.ftr-address span{
  position:relative;
  padding:.5rem .75rem;
  border-radius:9px;
  background: linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  border:1px solid rgba(255,255,255,.06);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: background .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease);
}
.ftr-address span:hover{
  background: linear-gradient(135deg, rgba(91,163,217,.13), rgba(37,99,168,.08));
  border-color: rgba(91,163,217,.32);
  transform: translateX(3px);
}
.ftr-address span svg{
  transition: color .3s var(--ease), transform .3s var(--ease), filter .3s var(--ease);
}
.ftr-address span:hover svg{
  color: var(--gold-soft);
  filter: drop-shadow(0 0 6px rgba(201,169,97,.65));
  transform: scale(1.12);
}
.ftr-address span a{
  position:relative;
  background-image: linear-gradient(90deg, var(--gold-soft), var(--gold-soft));
  background-size: 0% 1px;
  background-position: 0 100%;
  background-repeat: no-repeat;
  transition: background-size .35s var(--ease), color .3s var(--ease);
}
.ftr-address span:hover a{
  color: #fff !important;
  background-size: 100% 1px;
}

/* ── Social buttons — premium glass with sweep ── */
.socials{ gap:.55rem; margin-top:.25rem; }
.soc-a{
  position:relative; overflow:hidden;
  background: linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.025));
  border:1px solid rgba(255,255,255,.12);
  padding:.55rem 1rem;
  border-radius:10px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 4px 14px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.08);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease), color .3s var(--ease);
}
.soc-a::before{
  content:'';
  position:absolute; inset:0;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.18) 50%, transparent 70%);
  transform: translateX(-120%);
  transition: transform .7s var(--ease);
  pointer-events:none;
}
.soc-a::after{
  content:'';
  position:absolute; inset:-1px;
  border-radius:inherit;
  padding:1px;
  background: linear-gradient(135deg, rgba(91,163,217,.5), rgba(201,169,97,.45));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity:0;
  transition: opacity .35s var(--ease);
  pointer-events:none;
}
.soc-a:hover{
  transform: translateY(-3px);
  color:#fff;
  box-shadow: 0 12px 28px rgba(37,99,168,.35), inset 0 1px 0 rgba(255,255,255,.18);
  border-color: transparent;
}
.soc-a:hover::before{ transform: translateX(120%); }
.soc-a:hover::after{ opacity:1; }
.soc-a svg{ transition: transform .35s var(--ease), color .3s var(--ease); }
.soc-a:hover svg{
  transform: rotate(-8deg) scale(1.1);
  color: var(--gold-soft);
}

/* ── Column headers — animated gold dot + underline ── */
.fcol h4{
  position:relative;
  padding-left:1rem;
  padding-bottom:.7rem;
  border-bottom:1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.55);
}
.fcol h4::before{
  content:'';
  position:absolute; left:0; top:.42rem;
  width:6px; height:6px; border-radius:50%;
  background: var(--gold);
  box-shadow: 0 0 0 0 rgba(201,169,97,.55);
  animation: ftr-pulse 2.6s ease-in-out infinite;
}
.fcol h4::after{
  content:'';
  position:absolute; left:0; bottom:-1px;
  width:0; height:1px;
  background: linear-gradient(90deg, var(--gold), var(--blue-pale));
  transition: width .8s var(--ease);
}
.fcol:hover h4::after{ width:60%; }
@keyframes ftr-pulse{
  0%, 100% { box-shadow: 0 0 0 0 rgba(201,169,97,.55); transform: scale(1); }
  50%      { box-shadow: 0 0 0 8px rgba(201,169,97,0);   transform: scale(1.15); }
}

/* ── Link rows — slide indicator + gradient hover ── */
.fcol ul{ gap:.15rem; }
.fcol li{
  position:relative;
  border-radius:6px;
  transition: background .3s var(--ease);
}
.fcol li::before{
  content:'';
  position:absolute; left:0; top:50%; transform: translateY(-50%);
  width:0; height:2px;
  background: linear-gradient(90deg, var(--gold), transparent);
  border-radius:2px;
  transition: width .35s var(--ease);
  pointer-events:none;
}
.fcol li:hover::before{ width:14px; }
.fcol a{
  padding:.42rem .55rem .42rem .55rem;
  border-radius:6px;
  transition: color .3s var(--ease), padding-left .35s var(--ease), background .3s var(--ease);
}
.fcol li:hover a{
  padding-left:1.35rem;
  background: linear-gradient(90deg, rgba(91,163,217,.08), transparent);
  color:#fff;
}
.fcol a svg{
  transition: opacity .3s var(--ease), transform .3s var(--ease), color .3s var(--ease);
  margin-left:auto;
}
.fcol a:hover svg{
  color: var(--gold-soft);
  transform: translateX(3px);
}

/* ── Bottom bar — gradient border + subtle shimmer ── */
.ftr-bot{
  position:relative;
  margin-top:1rem;
  border-top: none;
  padding:1.6rem 0 1.4rem;
}
.ftr-bot::before{
  content:'';
  position:absolute;
  top:0; left:50%; transform: translateX(-50%);
  width:100%; height:1px;
  background: linear-gradient(90deg,
    transparent,
    rgba(255,255,255,.12) 20%,
    rgba(201,169,97,.45) 50%,
    rgba(255,255,255,.12) 80%,
    transparent);
}
.ftr-bot p{
  color: rgba(255,255,255,.55);
  font-size:.85rem;
  letter-spacing:.2px;
}
.fbot-links{ gap:1.2rem; }
.fbot-links a{
  position:relative;
  font-size:.83rem;
  color: rgba(255,255,255,.5);
  padding:.25rem 0;
  transition: color .3s var(--ease);
}
.fbot-links a::after{
  content:'';
  position:absolute; left:0; bottom:0;
  width:0; height:1px;
  background: linear-gradient(90deg, var(--gold-soft), var(--blue-pale));
  transition: width .35s var(--ease);
}
.fbot-links a:hover{ color:#fff; }
.fbot-links a:hover::after{ width:100%; }

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce){
  #ftr::before, #ftr::after,
  #ftr .container::before,
  .fcol h4::before{ animation: none; }
}

/* ── Mobile adjustments ── */
@media(max-width:768px){
  #ftr::after{ width:300px; height:300px; top:-120px; right:-100px; }
  .ftr-address span{ padding:.45rem .65rem; }
  .soc-a{ padding:.5rem .85rem; }
  .ftr-bot{ padding:1.2rem 0 1.1rem; }
}

/* ═══════════════════════════════════════════════════════════════
   LANGUAGE SWITCHER — 2026 premium segmented control
═══════════════════════════════════════════════════════════════ */
.lang-sw{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:1px;
  padding:3px;
  border-radius:100px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.01)),
    var(--bg3);
  border:1px solid var(--bdr);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -1px 0 rgba(0,0,0,.03),
    0 1px 2px rgba(13,30,48,.04);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  overflow:hidden;
  isolation:isolate;
}

/* Subtle gradient accent border on hover */
.lang-sw::before{
  content:'';
  position:absolute; inset:-1px;
  border-radius:inherit;
  padding:1px;
  background: linear-gradient(135deg, rgba(91,163,217,.45), rgba(201,169,97,.4));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity:0;
  transition: opacity .35s var(--ease);
  pointer-events:none;
  z-index:1;
}
.lang-sw:hover::before{ opacity:1; }

/* Inner shimmer on hover */
.lang-sw::after{
  content:'';
  position:absolute; inset:0;
  background: linear-gradient(120deg, transparent 35%, rgba(255,255,255,.08) 50%, transparent 65%);
  transform: translateX(-120%);
  transition: transform .9s var(--ease);
  pointer-events:none;
  border-radius:inherit;
  z-index:1;
}
.lang-sw:hover::after{ transform: translateX(120%); }

/* Each language pill */
.lang-btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:34px;
  padding:.34rem .7rem;
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.6px;
  color:var(--t3);
  border-radius:100px;
  background:transparent;
  border:none;
  cursor:pointer;
  transition: color .3s var(--ease), transform .25s var(--ease);
  z-index:2;
}
.lang-btn:hover:not(.act){
  color:var(--t1);
  transform: translateY(-1px);
}

/* Active state — premium gradient pill with glow */
.lang-btn.act{
  color:#fff;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  box-shadow:
    0 4px 12px rgba(26,74,122,.35),
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 0 rgba(0,0,0,.12);
  transform: translateY(0);
}

/* Active gold accent dot */
.lang-btn.act::after{
  content:'';
  position:absolute;
  bottom:-2px;
  left:50%;
  transform: translateX(-50%);
  width:14px;
  height:2px;
  border-radius:2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  box-shadow: 0 0 8px rgba(201,169,97,.6);
  animation: lang-glow 2.4s ease-in-out infinite;
}
@keyframes lang-glow{
  0%, 100% { opacity:.6; transform: translateX(-50%) scaleX(.85); }
  50%      { opacity:1;  transform: translateX(-50%) scaleX(1.15); }
}

/* Subtle inner glow ring on active */
.lang-btn.act::before{
  content:'';
  position:absolute; inset:0;
  border-radius:inherit;
  background: radial-gradient(ellipse at center, rgba(126,200,245,.18), transparent 70%);
  pointer-events:none;
}

/* Dark theme — adjust colors */
[data-theme="dark"] .lang-sw{
  background:
    linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.01)),
    rgba(15,32,53,.7);
  border-color: rgba(255,255,255,.08);
}
[data-theme="dark"] .lang-btn.act{
  background: linear-gradient(135deg, var(--blue-mid), var(--blue-light));
  box-shadow:
    0 4px 14px rgba(59,130,196,.45),
    inset 0 1px 0 rgba(255,255,255,.2);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .lang-btn.act::after{ animation: none; }
  .lang-sw::after{ display: none; }
}

/* Smaller laptops — keep compact */
@media(max-width:1550px){
  .lang-btn{ padding:.3rem .6rem; font-size:.72rem; min-width:32px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   2026 PREMIUM POLISH PASS
   - Page hero: animated orbs, floating particles, glow title
   - Photo / video / journal / news / publications cards: premium hover
   - Goal: "oxxo" wow factor while keeping the same palette
═══════════════════════════════════════════════════════════════════════ */

/* ── PAGE HERO — animated background + floating orbs ── */
.page-hero{
  background:
    radial-gradient(1100px 600px at 12% -15%, rgba(37,99,168,.32), transparent 55%),
    radial-gradient(900px 500px at 90% 110%, rgba(91,163,217,.22), transparent 60%),
    radial-gradient(700px 400px at 50% 50%, rgba(201,169,97,.08), transparent 70%),
    linear-gradient(135deg, var(--blue-dark) 0%, var(--navy-deep) 65%, var(--ink) 100%);
}

/* Existing ::before dot grid is kept; we add a layered animated stars layer */
.page-hero .container::after{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(2px 2px at 18% 26%, rgba(255,255,255,.22), transparent 60%),
    radial-gradient(1.4px 1.4px at 64% 32%, rgba(201,169,97,.42), transparent 60%),
    radial-gradient(1.6px 1.6px at 82% 18%, rgba(126,200,245,.42), transparent 60%),
    radial-gradient(1px 1px at 36% 78%, rgba(255,255,255,.18), transparent 60%),
    radial-gradient(2px 2px at 92% 62%, rgba(201,169,97,.32), transparent 60%),
    radial-gradient(1.2px 1.2px at 8% 60%, rgba(126,200,245,.32), transparent 60%);
  opacity:.7;
  animation: ph-stars 26s ease-in-out infinite alternate;
}
@keyframes ph-stars{
  0%   { transform: translate3d(0,0,0); opacity:.55; }
  50%  { opacity:.85; }
  100% { transform: translate3d(-22px,-12px,0); opacity:.65; }
}

/* Floating decorative orb (top-left) — soft blue glow */
.page-hero > .container{ position:relative; }

/* Inject animated orbs via pseudo-elements on .container so we don't need HTML changes */
.page-hero .container::before{
  /* Already used elsewhere? safe — page-hero has no rule on .container::before */
  content:'';
  position:absolute;
  width:560px; height:560px; border-radius:50%;
  top:-220px; left:-160px;
  background: radial-gradient(circle, rgba(126,200,245,.22), transparent 65%);
  filter: blur(50px);
  pointer-events:none;
  z-index:0;
  animation: ph-orb-a 16s ease-in-out infinite alternate;
}
@keyframes ph-orb-a{
  0%   { transform: translate(0,0) scale(1); opacity:.55; }
  100% { transform: translate(40px,30px) scale(1.08); opacity:.85; }
}

/* Page-hero TITLE — gold underline glow on em */
.page-hero-title em{
  position:relative; display:inline-block;
}
.page-hero-title em::after{
  content:''; position:absolute;
  left:0; right:.15em; bottom:-.05em; height:2px;
  background: linear-gradient(90deg, transparent, rgba(201,169,97,.7), rgba(126,200,245,.55), transparent);
  filter: blur(.3px);
  opacity:.85;
}

/* Page hero stat cards inside meta — glassmorphic hover */
.page-hero-meta .stat{
  position:relative; padding:.4rem .6rem;
  border-radius:10px;
  transition: background .35s var(--ease), transform .35s var(--ease);
}
.page-hero-meta .stat:hover{
  background: linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  transform: translateY(-2px);
}
.page-hero-meta .snum{
  background: linear-gradient(135deg, #ffffff 0%, #cfe1f5 60%, var(--gold-soft) 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Eyebrow gold dot pulse */
.page-hero-eyebrow::before{
  background: linear-gradient(90deg, var(--gold-warm), var(--gold));
  box-shadow: 0 0 8px rgba(201,169,97,.5);
}

/* Breadcrumb — plain text, no box */

/* ═════════════════════════════════════════════
   UNIVERSAL CARD ENHANCEMENTS — gradient border on hover
   Apply to: photo-card, video-card, na-card, na-featured, jrn-card, jrn-hero,
             conf-row, conf-featured, na-chip, doc-item
═════════════════════════════════════════════ */

/* Photo cards — premium zoom + gold ring on hover */
.photo-card{
  isolation:isolate;
  transition: transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s var(--ease);
}
.photo-card::after{
  content:''; position:absolute; inset:0; border-radius:inherit;
  padding:1.5px;
  background: conic-gradient(from 200deg, transparent 0%, rgba(201,169,97,.55) 25%, rgba(126,200,245,.55) 50%, rgba(201,169,97,.55) 75%, transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity:0;
  transition: opacity .45s var(--ease);
  z-index:3; pointer-events:none;
  animation: card-spin 8s linear infinite;
}
@keyframes card-spin{
  to { transform: rotate(360deg); }
}
.photo-card:hover{
  transform: translateY(-6px) scale(1.01);
  box-shadow: 0 24px 56px rgba(20,30,60,.32), 0 0 0 1px rgba(201,169,97,.18);
}
.photo-card:hover::after{ opacity:1; }
.photo-card-zoom{
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(230,212,163,.85));
  color: var(--blue-dark);
  box-shadow: 0 10px 28px rgba(0,0,0,.35), 0 0 0 1px rgba(201,169,97,.4);
}

/* Video cards — pulsing play button + gold glow on hover */
.video-card{
  transition: transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s var(--ease);
}
.video-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 28px 60px rgba(20,30,60,.4), 0 0 0 1px rgba(201,169,97,.22);
}
.video-card::after{
  content:''; position:absolute; inset:0; border-radius:inherit;
  background: linear-gradient(135deg, transparent 60%, rgba(201,169,97,.3));
  opacity:0;
  transition: opacity .4s var(--ease);
  pointer-events:none; z-index:1;
}
.video-card:hover::after{ opacity:1; }
.video-play{
  background: rgba(255,255,255,.96);
  color: #e02d3c;
  box-shadow: 0 14px 36px rgba(0,0,0,.45), 0 0 0 6px rgba(255,255,255,.12);
  position:relative;
}
.video-play::before{
  content:''; position:absolute; inset:-12px;
  border-radius:50%;
  border: 1.5px solid rgba(255,255,255,.4);
  animation: play-pulse 2.4s ease-in-out infinite;
}
@keyframes play-pulse{
  0%, 100% { transform: scale(.95); opacity:.65; }
  50%      { transform: scale(1.15); opacity:0; }
}
.video-card:hover .video-play{
  background: linear-gradient(135deg, var(--gold-soft), var(--gold));
  color: var(--ink);
  transform: translate(-50%,-50%) scale(1.18);
  box-shadow: 0 18px 44px rgba(201,169,97,.45), 0 0 0 8px rgba(201,169,97,.18);
}

/* News archive cards — hover lift + gold accent line */
.na-card{
  position:relative; isolation:isolate;
}
.na-card::before{
  content:''; position:absolute;
  top:0; left:50%; right:50%; height:2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  transition: left .5s var(--ease), right .5s var(--ease);
  z-index:3; pointer-events:none;
}
.na-card:hover::before{ left:0; right:0; }
.na-card-cat{
  background: linear-gradient(135deg, rgba(0,0,0,.55), rgba(26,74,122,.55));
  border-color: rgba(201,169,97,.35);
}
.na-card:hover .na-card-cat{
  background: linear-gradient(135deg, rgba(201,169,97,.85), rgba(176,141,63,.85));
  color:#fff;
  border-color: transparent;
}

/* News chips — hover with shimmer */
.na-chip{
  position:relative; overflow:hidden;
  transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease), transform .25s var(--ease);
}
.na-chip::before{
  content:''; position:absolute; inset:0;
  background: linear-gradient(120deg, transparent 35%, rgba(255,255,255,.18) 50%, transparent 65%);
  transform: translateX(-120%);
  transition: transform .7s var(--ease);
  pointer-events:none;
}
.na-chip:hover::before{ transform: translateX(120%); }
.na-chip.act{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  border-color: transparent;
  box-shadow: 0 6px 18px rgba(26,74,122,.32), inset 0 1px 0 rgba(255,255,255,.18);
}

/* na-featured — extra premium */
.na-featured{
  position:relative; isolation:isolate;
}
.na-featured::after{
  content:''; position:absolute; inset:0; border-radius:inherit;
  padding:1.5px;
  background: conic-gradient(from 0deg, transparent, rgba(201,169,97,.5), rgba(126,200,245,.5), transparent 60%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity:0;
  transition: opacity .5s var(--ease);
  pointer-events:none; z-index:3;
  animation: card-spin 12s linear infinite;
}
.na-featured:hover::after{ opacity:.9; }

/* Pagination buttons — premium */
.na-page, .pub-page, .pub-page-nav{
  position:relative; overflow:hidden;
}
.na-page::before, .pub-page::before{
  content:''; position:absolute; inset:0;
  background: linear-gradient(120deg, transparent 35%, rgba(91,163,217,.16) 50%, transparent 65%);
  transform: translateX(-120%);
  transition: transform .5s var(--ease);
  pointer-events:none;
}
.na-page:hover::before, .pub-page:hover::before{ transform: translateX(120%); }
.na-page.act, .pub-page.is-current{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  border-color: transparent;
  box-shadow: 0 6px 18px rgba(26,74,122,.32), inset 0 1px 0 rgba(255,255,255,.18);
}

/* ═════════════════════════════════════════════
   JOURNALS — Hero with 3D book tilt + gold shimmer
═════════════════════════════════════════════ */
.jrn-hero{
  position:relative; isolation:isolate;
}
.jrn-hero::after{
  content:''; position:absolute; inset:-1px; border-radius:inherit;
  padding:1.5px;
  background: conic-gradient(from 90deg, rgba(201,169,97,.4), rgba(126,200,245,.45), rgba(201,169,97,.4), transparent 70%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity:0;
  transition: opacity .45s var(--ease);
  pointer-events:none; z-index:3;
  animation: card-spin 14s linear infinite;
}
.jrn-hero:hover::after{ opacity:.85; }
.jrn-hero-cover{
  perspective: 1200px;
  transform-style: preserve-3d;
}
.jrn-hero-num{
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  box-shadow: 0 4px 14px rgba(201,169,97,.4), inset 0 1px 0 rgba(255,255,255,.25);
}

/* Journal cards — gold ring on hover */
.jrn-card{
  position:relative; isolation:isolate;
}
.jrn-card::after{
  content:''; position:absolute; inset:0; border-radius:inherit;
  padding:1.5px;
  background: conic-gradient(from 180deg, transparent 0%, rgba(201,169,97,.5) 30%, rgba(126,200,245,.5) 70%, transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity:0;
  transition: opacity .45s var(--ease);
  pointer-events:none; z-index:3;
  animation: card-spin 10s linear infinite;
}
.jrn-card:hover::after{ opacity:1; }
.jrn-card-num{
  background: linear-gradient(135deg, rgba(255,255,255,.97), rgba(230,212,163,.85));
  color: var(--blue-dark);
  box-shadow: 0 6px 16px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.5);
  font-weight:800;
}

/* ═════════════════════════════════════════════
   PUBLICATIONS / PAGES — conf-* card enhancements
═════════════════════════════════════════════ */
.conf-featured{
  position:relative; isolation:isolate;
}
.conf-featured::after{
  content:''; position:absolute; inset:0; border-radius:inherit;
  padding:1.5px;
  background: conic-gradient(from 60deg, transparent, rgba(201,169,97,.5), rgba(126,200,245,.5), transparent 60%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity:0;
  transition: opacity .5s var(--ease);
  pointer-events:none; z-index:3;
  animation: card-spin 12s linear infinite;
}
.conf-featured:hover::after{ opacity:.9; }
.conf-feat-status.live{
  background: linear-gradient(135deg, rgba(201,169,97,.28), rgba(126,200,245,.18));
  border-color: rgba(201,169,97,.55);
}

/* conf-row — premium row hover */
.conf-row{
  position:relative; isolation:isolate;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.conf-row::before{
  content:''; position:absolute;
  left:0; top:0; bottom:0;
  width:0;
  background: linear-gradient(180deg, var(--blue-mid), var(--gold));
  border-radius: 12px 0 0 12px;
  transition: width .35s var(--ease);
  pointer-events:none; z-index:1;
}
.conf-row:hover::before{ width:4px; }
.conf-date{
  position:relative; overflow:hidden;
  transition: background .3s var(--ease), border-color .3s var(--ease);
}
.conf-row:hover .conf-date{
  background: linear-gradient(135deg, var(--accent-g), rgba(201,169,97,.08));
  border-color: rgba(201,169,97,.4);
}
.conf-row:hover .conf-date-day{
  text-shadow: 0 0 12px rgba(201,169,97,.45);
}

/* doc-item — extra polish (used on laws too) */
.doc-item{
  position:relative; isolation:isolate;
}
.doc-item::after{
  content:''; position:absolute; inset:0; border-radius:inherit;
  background: linear-gradient(135deg, transparent 60%, rgba(201,169,97,.06));
  opacity:0;
  transition: opacity .35s var(--ease);
  pointer-events:none;
}
.doc-item:hover::after{ opacity:1; }
.doc-action{
  position:relative; overflow:hidden;
}
.doc-action::before{
  content:''; position:absolute; inset:0;
  background: linear-gradient(120deg, transparent 35%, rgba(255,255,255,.22) 50%, transparent 65%);
  transform: translateX(-120%);
  transition: transform .55s var(--ease);
  pointer-events:none;
}
.doc-item:hover .doc-action::before{ transform: translateX(120%); }

/* ═════════════════════════════════════════════
   AOS-LIKE ENTRY ANIMATIONS for non-AOS contexts
═════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce){
  .page-hero .container::before,
  .page-hero .container::after,
  .photo-card::after, .na-featured::after,
  .jrn-hero::after, .jrn-card::after,
  .conf-featured::after,
  .video-play::before{
    animation: none;
  }
}

/* ── Mobile adjustments for new effects ── */
@media(max-width:768px){
  .page-hero .container::before{ width:300px; height:300px; top:-120px; left:-100px; }
  .video-play::before{ display:none; }
  .photo-card::after, .na-featured::after,
  .jrn-hero::after, .jrn-card::after,
  .conf-featured::after{ animation-duration: 14s; }
}

/* ═══════════════════════════════════════════════════════════════════════
   PROTECTION (PhD/DSc defenses) — defense list
═══════════════════════════════════════════════════════════════════════ */
#defenses{padding:6rem 0; position:relative; background:var(--bg)}
#defenses::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width: min(900px, 84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55;
}
.def-list{display:flex; flex-direction:column; gap:1.1rem; margin-top:3rem; max-width: 1100px; margin-left:auto; margin-right:auto}
.def-card{
  position:relative; isolation:isolate;
  display:grid; grid-template-columns: 140px 1fr auto; gap: 1.6rem;
  align-items:center;
  padding:1.4rem 1.6rem 1.4rem 1.4rem;
  background: var(--card);
  border:1px solid var(--bdr); border-radius:16px;
  box-shadow: var(--shadow-1), var(--shadow-2);
  transition: transform .35s var(--ease), box-shadow .35s, border-color .35s;
  overflow:hidden;
}
.def-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold) 70%, var(--gold-warm));
  opacity:.95;
}
.def-card:hover{
  transform: translateY(-4px);
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3), var(--shadow-4);
  border-color: rgba(201,169,97,.32);
}
.def-photo{
  position:relative;
  width: 130px; height: 170px;
  border-radius: 12px;
  overflow:hidden;
  background: linear-gradient(180deg, var(--blue-dark), var(--ink));
  box-shadow: 0 6px 18px rgba(0,0,0,.18), inset 0 0 0 1px rgba(255,255,255,.05);
}
.def-photo img{
  width:100%; height:100%; object-fit: cover; object-position: center top;
  transition: transform .55s var(--ease);
}
.def-card:hover .def-photo img{transform: scale(1.06)}
.def-photo::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 60%, rgba(13,30,48,.5));
  pointer-events:none;
}
.def-info{display:flex; flex-direction:column; gap:.55rem; min-width:0}
.def-degree{
  display:inline-flex; align-items:center; gap:.45rem;
  font-size:.66rem; font-weight:800; letter-spacing:1.8px; text-transform:uppercase;
  color:#fff; padding:.32rem .8rem; border-radius:30px;
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  box-shadow: 0 4px 12px rgba(201,169,97,.3), inset 0 1px 0 rgba(255,255,255,.25);
  width:fit-content;
}
.def-degree::before{
  content:''; width:5px; height:5px; border-radius:50%; background:#fff;
  box-shadow: 0 0 5px rgba(255,255,255,.7);
}
.def-name{
  font-family: var(--serif);
  font-size: 1.18rem; font-weight: 700; color: var(--t1); line-height: 1.3;
  letter-spacing:-.2px;
}
.def-theme{
  font-size:.92rem; color:var(--t2); line-height: 1.6;
  display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.def-meta{
  display:flex; flex-wrap:wrap; gap:.55rem 1.1rem;
  padding-top:.65rem; border-top:1px solid var(--bdr);
  font-size:.78rem; color: var(--t3);
}
.def-meta span{display:inline-flex; align-items:center; gap:.4rem}
.def-meta svg{width:13px; height:13px; color: var(--blue-mid); opacity:.8}
.def-card .def-action{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.7rem 1.05rem;
  font-size:.82rem; font-weight:600; color: var(--blue-mid);
  background: var(--accent-g);
  border:1px solid rgba(37,99,168,.22);
  border-radius:100px;
  transition: background .25s, color .25s, gap .25s var(--ease);
  white-space:nowrap;
}
.def-card .def-action svg{width:13px; height:13px; transition: transform .25s}
.def-card:hover .def-action{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color:#fff; border-color: transparent; gap:.65rem;
  box-shadow: 0 6px 16px rgba(26,74,122,.32);
}
.def-card:hover .def-action svg{transform: translateX(2px)}

/* Bulk download CTA */
.def-cta{
  margin-top:2.5rem; max-width: 760px; margin-left:auto; margin-right:auto;
  padding: 2rem;
  background: linear-gradient(135deg, var(--blue-dark), var(--navy-deep));
  border-radius:18px;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem;
  position:relative; overflow:hidden;
  box-shadow: var(--shadow-3);
}
.def-cta::before{
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(circle at 18% 28%, rgba(126,200,245,.18) 0%, transparent 50%),
    radial-gradient(circle at 82% 72%, rgba(201,169,97,.14) 0%, transparent 50%);
  pointer-events:none;
}
.def-cta-text{position:relative; z-index:1; color:#fff}
.def-cta-text h3{
  font-family: var(--serif); font-size:1.2rem; font-weight:700; line-height:1.3;
  margin-bottom:.25rem;
}
.def-cta-text p{font-size:.85rem; color:rgba(255,255,255,.72)}
.def-cta a{
  position:relative; z-index:1;
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.8rem 1.5rem; border-radius:11px;
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  color: var(--ink); font-weight:700; font-size:.88rem;
  box-shadow: 0 8px 24px rgba(201,169,97,.4), inset 0 1px 0 rgba(255,255,255,.25);
  transition: transform .25s var(--ease), box-shadow .25s;
}
.def-cta a:hover{transform:translateY(-2px); box-shadow:0 12px 32px rgba(201,169,97,.5)}
.def-cta a svg{width:14px; height:14px}

@media(max-width:768px){
  .def-card{grid-template-columns: 90px 1fr; gap:1rem; padding:1rem}
  .def-card .def-action{grid-column: 1 / -1; justify-self: start; padding:.55rem .9rem}
  .def-photo{width:90px; height:120px}
  .def-name{font-size:1rem}
  .def-cta{padding:1.4rem; flex-direction:column; align-items:flex-start}
}

/* ═══════════════════════════════════════════════════════════════════════
   INFOGRAPHICS — gallery list
═══════════════════════════════════════════════════════════════════════ */
#infographics-list{padding:6rem 0; position:relative; background:var(--bg)}
#infographics-list::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width: min(900px, 84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55;
}
.ig-grid{
  display:grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap:1.25rem; margin-top:3rem;
}
.ig-card{
  position:relative; isolation:isolate;
  display:flex; flex-direction:column;
  background: var(--card);
  border:1px solid var(--bdr); border-radius:16px;
  overflow:hidden;
  box-shadow: var(--shadow-1);
  transition: transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s var(--ease), border-color .35s;
  text-decoration:none;
}
.ig-card:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3), var(--shadow-4);
  border-color: transparent;
}
.ig-card::after{
  content:''; position:absolute; inset:0; border-radius:inherit;
  padding:1.5px;
  background: conic-gradient(from 200deg, transparent 0%, rgba(201,169,97,.5) 30%, rgba(126,200,245,.5) 60%, transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  opacity:0;
  transition: opacity .45s var(--ease);
  pointer-events:none; z-index:3;
  animation: card-spin 9s linear infinite;
}
.ig-card:hover::after{opacity:1}
.ig-img{
  position:relative; aspect-ratio: 4/5; overflow:hidden;
  background: linear-gradient(135deg, var(--blue-dark), var(--ink));
}
.ig-img img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition: transform .65s cubic-bezier(.22,1,.36,1);
}
.ig-card:hover .ig-img img{transform:scale(1.05)}
.ig-img::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 55%, rgba(13,30,48,.5));
  pointer-events:none;
}
.ig-zoom{
  position:absolute; top:.85rem; right:.85rem; z-index:3;
  width:38px; height:38px; border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background: rgba(255,255,255,.92); color: var(--blue-dark);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  transform: scale(.6) rotate(-90deg); opacity:0;
  transition: transform .35s cubic-bezier(.22,1,.36,1), opacity .35s;
  box-shadow: 0 4px 14px rgba(0,0,0,.2);
}
.ig-zoom svg{width:15px; height:15px}
.ig-card:hover .ig-zoom{transform:scale(1) rotate(0); opacity:1}
.ig-body{
  padding: 1rem 1.2rem 1.2rem;
  display:flex; flex-direction:column; gap:.5rem;
  flex:1;
}
.ig-title{
  font-family: var(--serif);
  font-size:.95rem; font-weight:700; line-height:1.4;
  color: var(--t1);
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  transition: color .25s;
}
.ig-card:hover .ig-title{color: var(--accent)}
.ig-cta{
  display:inline-flex; align-items:center; gap:.4rem; margin-top:auto;
  font-size:.78rem; font-weight:600; color: var(--blue-mid);
  letter-spacing:.02em;
  transition: gap .25s var(--ease), color .25s;
}
.ig-cta svg{width:13px; height:13px; transition: transform .25s}
.ig-card:hover .ig-cta{gap:.65rem; color: var(--accent)}
.ig-card:hover .ig-cta svg{transform: translateX(3px)}

@media(max-width:600px){
  .ig-grid{grid-template-columns: 1fr 1fr; gap:.85rem}
  .ig-body{padding:.75rem .9rem .95rem}
  .ig-title{font-size:.85rem}
}

/* ═══════════════════════════════════════════════════════════════════════
   SINGLE INFOGRAPHIC — detail
═══════════════════════════════════════════════════════════════════════ */
#ig-single{padding:5rem 0; background: var(--bg)}
.ig-single-wrap{
  max-width: 980px; margin:0 auto;
  display:grid; grid-template-columns: minmax(280px, 480px) 1fr;
  gap:2.5rem; align-items:flex-start;
}
.ig-single-img{
  position: relative; isolation:isolate;
  border-radius: 18px; overflow:hidden;
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3);
  background: var(--bg3);
  transition: transform .4s var(--ease);
}
.ig-single-img:hover{transform: translateY(-4px)}
.ig-single-img img{width:100%; height:auto; display:block; cursor:zoom-in}
.ig-single-info{display:flex; flex-direction:column; gap:1rem}
.ig-single-content{
  font-size: 1rem; line-height: 1.78; color: var(--t1);
}
.ig-single-content p{margin-bottom: 1rem}
.ig-tags{
  display:flex; flex-wrap:wrap; gap:.5rem;
  padding-top: 1.2rem; border-top: 1px solid var(--bdr);
}
.ig-tag{
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.45rem .9rem; border-radius:30px;
  font-size:.78rem; font-weight:600;
  color: var(--blue-mid);
  background: var(--accent-g);
  border:1px solid rgba(37,99,168,.18);
  transition: background .25s, color .25s, transform .2s;
}
.ig-tag:hover{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff; border-color: transparent;
  transform: translateY(-2px);
}
.ig-tag::before{content:'#'; opacity:.75}

@media(max-width:760px){
  .ig-single-wrap{grid-template-columns:1fr; gap:1.5rem}
  .ig-single-img{max-width:100%}
}

/* ═══════════════════════════════════════════════════════════════════════
   JOURNAL DETAIL — single journal page
═══════════════════════════════════════════════════════════════════════ */
.jrn-detail{padding: 5rem 0 6rem; background: var(--bg)}
.jrn-detail-wrap{
  max-width: 1100px; margin: 0 auto;
  display:grid; grid-template-columns: 320px 1fr; gap: 3rem;
  align-items: flex-start;
}
.jrn-detail-aside{
  position: sticky; top: 90px;
  display:flex; flex-direction:column; gap: 1.2rem;
}
.jrn-detail-cover{
  position:relative;
  aspect-ratio: 3/4; border-radius: 14px;
  overflow:hidden;
  box-shadow: 0 30px 60px -20px rgba(0,0,0,.4), 0 18px 35px -15px rgba(26,74,122,.3);
  transform: rotate(-2deg);
  transition: transform .55s cubic-bezier(.22,1,.36,1);
}
.jrn-detail-cover:hover{transform: rotate(-0.5deg) translateY(-4px)}
.jrn-detail-cover img{width:100%; height:100%; object-fit: cover; display:block}
.jrn-detail-cover::after{
  content:''; position:absolute; left:0; top:0; bottom:0; width:14px;
  background: linear-gradient(90deg, rgba(0,0,0,.18), transparent);
  pointer-events:none;
}
.jrn-detail-fallback{
  width:100%; height:100%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color:#fff; font-family: var(--serif);
}
.jrn-detail-fallback span{font-size:2.2rem; font-weight:800; letter-spacing:3px}
.jrn-detail-fallback small{font-size:.78rem; opacity:.85; letter-spacing:1.2px; text-transform:uppercase; margin-top:.4rem}

.jrn-detail-actions{display:flex; flex-direction:column; gap:.6rem}
.jrn-action-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  padding:.85rem 1.2rem; border-radius:11px;
  font-size:.88rem; font-weight:600;
  border:1px solid var(--bdr);
  transition: transform .2s, box-shadow .2s, background .2s, border-color .2s;
}
.jrn-action-btn svg{width:15px; height:15px}
.jrn-action-btn.primary{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color:#fff; border-color: transparent;
  box-shadow: 0 6px 18px rgba(26,74,122,.32), inset 0 1px 0 rgba(255,255,255,.16);
}
.jrn-action-btn.primary:hover{transform: translateY(-2px); box-shadow: 0 12px 28px rgba(26,74,122,.42)}
.jrn-action-btn.gold{
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  color: var(--ink); border-color: transparent; font-weight:700;
  box-shadow: 0 6px 18px rgba(201,169,97,.4);
}
.jrn-action-btn.gold:hover{transform: translateY(-2px); box-shadow: 0 12px 28px rgba(201,169,97,.5)}
.jrn-action-btn.ghost{
  background: var(--card); color: var(--t1);
}
.jrn-action-btn.ghost:hover{
  border-color: var(--bdr-h); background: var(--bg3);
  transform: translateY(-2px);
}

.jrn-detail-main{display:flex; flex-direction:column; gap: 1.5rem; min-width: 0}
.jrn-detail-eyebrow{
  font-size:.7rem; font-weight:800; letter-spacing:2.4px; text-transform:uppercase;
  color: var(--gold-warm);
  display:inline-flex; align-items:center; gap:.5rem;
}
.jrn-detail-eyebrow::before{content:''; width:24px; height:1.5px; background:var(--gold); border-radius:1px}
.jrn-detail-title{
  font-family: var(--serif);
  font-size: clamp(1.6rem, 2.8vw, 2.4rem);
  font-weight:700; letter-spacing:-.4px; line-height:1.18;
  color: var(--t1);
}
.jrn-detail-period{
  font-family: var(--serif); font-style: italic;
  font-size: 1.05rem; color: var(--t2);
}
.jrn-detail-stats{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1rem;
  padding:1.4rem 1.6rem;
  background: var(--bg3);
  border-radius:14px;
  border:1px solid var(--bdr);
}
.jrn-stat{display:flex; flex-direction:column; gap:.15rem}
.jrn-stat-num{
  font-family: var(--serif); font-weight:700;
  font-size: 1.5rem; color: var(--t1); line-height:1;
  letter-spacing:-.4px;
  display:inline-flex; align-items:baseline; gap:.25rem;
}
.jrn-stat-num em{font-style:italic; color: var(--gold-warm); font-size:.8em}
.jrn-stat-lbl{
  font-size:.66rem; letter-spacing:1.4px; text-transform:uppercase;
  color: var(--t3); font-weight:700;
}

.jrn-pdf-frame{
  margin-top:.5rem;
  border:1px solid var(--bdr); border-radius:18px;
  overflow:hidden;
  background: var(--bg3);
  box-shadow: var(--shadow-1), var(--shadow-2);
}
.jrn-pdf-head{
  display:flex; align-items:center; gap:.85rem;
  padding:.95rem 1.25rem;
  background: var(--card);
  border-bottom:1px solid var(--bdr);
}
.jrn-pdf-ico{
  width:38px; height:42px; flex-shrink:0;
  border-radius:7px;
  background: linear-gradient(135deg, #d83b3b, #b02323);
  color:#fff;
  display:flex; align-items:flex-end; justify-content:center;
  padding-bottom:.4rem; font-size:.62rem; font-weight:800; letter-spacing:.6px;
  box-shadow: 0 4px 10px rgba(176,35,35,.3), inset 0 1px 0 rgba(255,255,255,.2);
}
.jrn-pdf-info{display:flex;flex-direction:column;gap:.05rem; flex:1; min-width:0}
.jrn-pdf-info b{color:var(--t1);font-size:.92rem;font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.jrn-pdf-info span{font-size:.7rem; letter-spacing:1.2px; text-transform:uppercase; color:var(--t3); font-weight:700}
.jrn-pdf-frame iframe{
  width:100%; height: 720px; border:0; display:block; background: #1a1d2e;
}

.jrn-meta-list{display:flex; flex-direction:column; gap:.85rem; margin-top: 1rem}
.jrn-meta-row{
  padding: 1rem 1.2rem;
  background: var(--card);
  border:1px solid var(--bdr); border-radius:12px;
  transition: transform .25s, border-color .25s, box-shadow .25s;
}
.jrn-meta-row:hover{
  transform: translateX(4px);
  border-color: rgba(201,169,97,.3);
  box-shadow: var(--shadow-1), var(--shadow-2);
}
.jrn-meta-label{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.66rem; letter-spacing:1.6px; text-transform:uppercase;
  font-weight:700; color: var(--blue-mid);
  margin-bottom:.4rem;
}
.jrn-meta-label::before{
  content:''; width:6px; height:6px; border-radius:50%; background:var(--gold);
  box-shadow: 0 0 6px rgba(201,169,97,.55);
}
.jrn-meta-value{font-size:.92rem; color:var(--t1); line-height:1.7}

@media(max-width:900px){
  .jrn-detail-wrap{grid-template-columns:1fr; gap:2rem}
  .jrn-detail-aside{position:static; max-width:380px; margin:0 auto}
  .jrn-pdf-frame iframe{height:480px}
}

/* ═══════════════════════════════════════════════════════════════════════
   CONTACTS PAGE — premium form
═══════════════════════════════════════════════════════════════════════ */
#contacts-section{padding: 5rem 0 6rem; background: var(--bg); position:relative}
.contacts-wrap{
  max-width: 1100px; margin: 0 auto;
  display:grid; grid-template-columns: 1fr 1.2fr; gap: 2.5rem;
  align-items: flex-start;
}

.contacts-info{
  display:flex; flex-direction:column; gap:1.1rem;
  padding: 2rem;
  background: linear-gradient(135deg, var(--blue-dark), var(--navy-deep));
  color:#fff; border-radius: 20px;
  position:relative; overflow:hidden;
  box-shadow: var(--shadow-3);
  isolation: isolate;
}
.contacts-info::before{
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(circle at 20% 30%, rgba(126,200,245,.16) 0%, transparent 55%),
    radial-gradient(circle at 80% 70%, rgba(201,169,97,.12) 0%, transparent 55%);
  pointer-events:none;
}
.contacts-info > *{position:relative; z-index:1}
.contacts-info-eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.7rem; font-weight:800; letter-spacing:2.5px; text-transform:uppercase;
  color: var(--gold-soft);
}
.contacts-info-eyebrow::before{content:''; width:24px; height:1.5px; background: var(--gold); border-radius:1px}
.contacts-info h2{
  font-family: var(--serif);
  font-size: clamp(1.5rem, 2.4vw, 2rem); font-weight:700;
  line-height:1.2; letter-spacing:-.4px;
  color:#fff;
}
.contacts-info p{font-size:.95rem; color:rgba(255,255,255,.78); line-height:1.75}
.contacts-list{display:flex; flex-direction:column; gap:.85rem; margin-top:.5rem}
.contact-item{
  display:flex; align-items:flex-start; gap:.9rem;
  padding: .9rem 1.1rem;
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  transition: background .25s, border-color .25s, transform .25s;
}
.contact-item:hover{
  background: rgba(255,255,255,.1);
  border-color: rgba(201,169,97,.45);
  transform: translateX(3px);
}
.contact-item-ico{
  width:38px; height:38px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.18);
  border-radius:10px; color:#fff;
}
.contact-item-ico svg{width:15px; height:15px}
.contact-item:hover .contact-item-ico{
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  color: var(--ink); border-color:transparent;
}
.contact-item-text{display:flex;flex-direction:column;gap:.1rem; min-width:0; flex:1}
.contact-item-lbl{font-size:.66rem; letter-spacing:1.4px; text-transform:uppercase; font-weight:700; color: rgba(255,255,255,.62)}
.contact-item-val{font-size:.92rem; color:#fff; font-weight:500; word-break:break-word}
.contact-item-val a{color:#fff; transition:color .2s}
.contact-item-val a:hover{color: var(--gold-soft)}

/* Form panel */
.contacts-form{
  padding: 2rem 2.2rem;
  background: var(--card);
  border:1px solid var(--bdr); border-radius: 20px;
  box-shadow: var(--shadow-1), var(--shadow-2);
  position:relative; isolation:isolate;
}
.contacts-form::before{
  content:''; position:absolute; top:0; left:2.2rem; right:2.2rem; height:3px;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold));
  border-radius: 0 0 3px 3px;
}
.contacts-form-eyebrow{
  font-size:.7rem; font-weight:800; letter-spacing:2.5px; text-transform:uppercase;
  color: var(--gold-warm);
  display:inline-flex; align-items:center; gap:.5rem; margin-bottom: .65rem;
}
.contacts-form-eyebrow::before{content:''; width:24px; height:1.5px; background:var(--gold-warm); border-radius:1px}
.contacts-form h2{
  font-family: var(--serif);
  font-size: clamp(1.4rem, 2.2vw, 1.85rem); font-weight: 700;
  line-height:1.25; color: var(--t1);
  margin-bottom:.55rem;
}
.contacts-form > p.lead{font-size:.92rem; color: var(--t2); line-height:1.65; margin-bottom:1.5rem}

.cf-row{display:grid; grid-template-columns: 1fr 1fr; gap: 1rem}
.cf-field{display:flex; flex-direction:column; gap:.4rem; margin-bottom:1rem}
.cf-field--full{grid-column: 1 / -1}
.cf-label{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.74rem; letter-spacing:.5px; font-weight:700;
  color: var(--t2); text-transform:uppercase;
}
.cf-label svg{width:13px; height:13px; color:var(--blue-mid); opacity:.85}
.cf-input, .cf-textarea{
  width:100%;
  padding: .85rem 1.1rem;
  font-size:.94rem; font-family: inherit;
  color: var(--t1);
  background: var(--bg3);
  border:1px solid var(--bdr); border-radius: 10px;
  transition: border-color .25s, background .25s, box-shadow .25s;
}
.cf-input::placeholder, .cf-textarea::placeholder{color: var(--t3)}
.cf-input:focus, .cf-textarea:focus{
  outline:none;
  border-color: var(--blue-mid);
  background: var(--card);
  box-shadow: 0 0 0 3px var(--accent-g);
}
.cf-textarea{resize:vertical; min-height: 140px; line-height:1.6}
.cf-actions{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; margin-top:.5rem}
.cf-note{font-size:.78rem; color:var(--t3)}
.cf-submit{
  display:inline-flex; align-items:center; gap:.55rem;
  padding: .9rem 1.6rem; border-radius: 11px;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color:#fff; font-weight:600; font-size:.92rem; border:none;
  cursor:pointer;
  box-shadow: 0 8px 22px rgba(26,74,122,.35), inset 0 1px 0 rgba(255,255,255,.18);
  transition: transform .2s, box-shadow .2s, background .25s;
}
.cf-submit svg{width:15px; height:15px; transition: transform .25s}
.cf-submit:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(26,74,122,.45);
  background: linear-gradient(135deg, var(--blue-mid), var(--blue-light));
}
.cf-submit:hover svg{transform: translateX(3px)}

/* Alerts */
.cf-alert{
  margin-bottom: 1.2rem;
  padding: .9rem 1.1rem;
  border-radius: 11px;
  font-size:.88rem; font-weight:500;
  display:flex; align-items:flex-start; gap:.6rem;
  border: 1px solid;
}
.cf-alert svg{width:16px; height:16px; flex-shrink:0; margin-top:2px}
.cf-alert--success{
  background: rgba(15,157,88,.08);
  border-color: rgba(15,157,88,.32);
  color: #0f9d58;
}
.cf-alert--error{
  background: rgba(224,45,60,.08);
  border-color: rgba(224,45,60,.32);
  color: #c4242f;
}
[data-theme="dark"] .cf-alert--success{color:#3ec78b}
[data-theme="dark"] .cf-alert--error{color:#ff6b78}

@media(max-width:900px){
  .contacts-wrap{grid-template-columns:1fr; gap:1.5rem}
  .contacts-info, .contacts-form{padding:1.5rem}
  .cf-row{grid-template-columns:1fr; gap:0}
}

/* ═══════════════════════════════════════════════════════════════════════
   SEARCH RESULTS PAGE
═══════════════════════════════════════════════════════════════════════ */
#search-results{padding:5rem 0 6rem; background:var(--bg); position:relative}
#search-results::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width: min(900px, 84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55;
}
.sr-toolbar{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  flex-wrap:wrap;
  max-width: 920px; margin: 0 auto 2rem;
}
.sr-search{position:relative; flex:1; min-width:240px; max-width:520px}
.sr-search svg{
  position:absolute; left:1rem; top:50%; transform:translateY(-50%);
  width:16px; height:16px; color: var(--t3); pointer-events:none;
}
.sr-search input{
  width:100%; padding:.85rem 1rem .85rem 2.6rem;
  border:1px solid var(--bdr); border-radius: 100px;
  background: var(--card); color: var(--t1);
  font-size:.92rem; font-family: inherit;
  transition: border-color .25s, box-shadow .25s, background .25s;
}
.sr-search input:focus{
  outline:none; border-color: var(--blue-mid);
  box-shadow: 0 0 0 3px var(--accent-g);
}
.sr-tabs{display:flex; gap:.4rem; flex-wrap:wrap}
.sr-tab{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.5rem 1rem; border-radius:30px;
  font-size:.78rem; font-weight:600;
  color: var(--t2); background: var(--card);
  border:1px solid var(--bdr); cursor:pointer;
  transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.sr-tab .sr-tab-count{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:22px; height:18px;
  padding:0 .35rem;
  border-radius:30px; background: var(--accent-g); color: var(--blue-mid);
  font-size:.66rem; font-weight:700;
}
.sr-tab:hover{transform: translateY(-1px)}
.sr-tab.act, .sr-tab:hover{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color:#fff; border-color: transparent;
  box-shadow: 0 6px 16px rgba(26,74,122,.32);
}
.sr-tab.act .sr-tab-count{background: rgba(255,255,255,.22); color:#fff}

.sr-summary{
  max-width: 920px; margin: 0 auto 2rem;
  text-align:center;
}
.sr-summary p{font-size:.95rem; color: var(--t2)}
.sr-summary b{color: var(--t1); font-weight:700}
.sr-summary .sr-q{
  display:inline-block;
  background: linear-gradient(135deg, var(--accent-g), rgba(201,169,97,.1));
  padding:.2rem .65rem; border-radius:6px;
  color: var(--blue-mid); font-weight:700;
  border: 1px solid rgba(201,169,97,.18);
}

.sr-section{
  max-width: 920px; margin: 0 auto 2.5rem;
}
.sr-section-hdr{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  margin-bottom:1.2rem;
  padding-bottom:.7rem;
  border-bottom: 1px solid var(--bdr);
}
.sr-section-hdr h3{
  font-family: var(--serif);
  font-size: 1.2rem; font-weight:700; color: var(--t1);
  display:inline-flex; align-items:center; gap:.6rem;
}
.sr-section-hdr h3 svg{width:18px; height:18px; color: var(--gold-warm)}
.sr-section-hdr .sr-count{
  font-family: var(--serif); font-style:italic; font-weight:800;
  font-size: 1.1rem; color: var(--gold-warm);
}
.sr-list{display:flex; flex-direction:column; gap:.85rem}
.sr-item{
  position:relative; isolation:isolate;
  display:grid; grid-template-columns: 1fr auto;
  gap:.9rem;
  padding: 1.1rem 1.4rem;
  background: var(--card);
  border:1px solid var(--bdr); border-radius:12px;
  text-decoration:none;
  transition: transform .25s var(--ease), box-shadow .25s, border-color .25s;
}
.sr-item:hover{
  transform: translateY(-2px);
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3);
  border-color: rgba(201,169,97,.32);
}
.sr-item::before{
  content:''; position:absolute; left:0; top:1.1rem; bottom:1.1rem; width:3px;
  background: linear-gradient(180deg, var(--blue-mid), var(--gold));
  border-radius: 0 3px 3px 0;
  opacity: 0; transform: scaleY(.6);
  transition: opacity .25s, transform .25s var(--ease);
}
.sr-item:hover::before{opacity:1; transform: scaleY(1)}
.sr-item-body{display:flex; flex-direction:column; gap:.4rem; min-width:0}
.sr-item-cat{
  font-size:.66rem; letter-spacing:1.4px; text-transform:uppercase;
  font-weight:700; color: var(--blue-mid);
}
.sr-item-title{
  font-family: var(--serif);
  font-size:1.02rem; font-weight:700; line-height:1.4;
  color: var(--t1);
  letter-spacing:-.1px;
  transition: color .2s;
}
.sr-item:hover .sr-item-title{color: var(--accent)}
.sr-item-title mark{
  background: linear-gradient(180deg, transparent 50%, rgba(201,169,97,.45) 50%);
  color: inherit; padding: 0 .15em;
}
.sr-item-desc{
  font-size:.86rem; color: var(--t2); line-height: 1.65;
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.sr-item-arrow{
  display:inline-flex; align-items:center; justify-content:center;
  align-self: center;
  width:36px; height:36px; border-radius:50%;
  background: var(--accent-g); color: var(--blue-mid);
  transition: background .25s, color .25s, transform .25s;
}
.sr-item-arrow svg{width:14px; height:14px}
.sr-item:hover .sr-item-arrow{
  background: var(--blue-mid); color:#fff;
  transform: translateX(3px);
}

.sr-empty{
  text-align:center; padding: 3rem 1rem;
  color: var(--t2); font-size:.95rem;
  max-width: 520px; margin: 0 auto;
}
.sr-empty-ico{
  width:72px; height:72px; margin: 0 auto 1.1rem;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background: var(--accent-g); color: var(--blue-mid);
}
.sr-empty-ico svg{width:30px; height:30px}
.sr-empty h3{
  font-family: var(--serif);
  font-size: 1.3rem; font-weight: 700;
  margin-bottom:.5rem; color: var(--t1);
}

@media(max-width:600px){
  .sr-toolbar{flex-direction:column; align-items:stretch}
  .sr-section-hdr h3{font-size:1.05rem}
  .sr-item{padding:.95rem 1.1rem}
}

/* ═══════════════════════════════════════════════════════════════════════
   NEWS SECTION (index) — 2026 EDITORIAL PREMIUM
═══════════════════════════════════════════════════════════════════════ */
.nx-section{
  position: relative;
  padding: 6rem 0 6.5rem;
  background:
    radial-gradient(900px 500px at 8% 0%, rgba(37,99,168,.06), transparent 60%),
    radial-gradient(800px 460px at 92% 100%, rgba(201,169,97,.05), transparent 65%),
    var(--bg);
  overflow: hidden;
  isolation: isolate;
}
.nx-section::before{
  content:''; position:absolute; left:50%; top:0; transform:translateX(-50%);
  width:min(900px,84%); height:1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity:.55; z-index:1;
}

/* Floating decorative orbs */
.nx-deco{
  position:absolute; border-radius:50%; pointer-events:none;
  filter: blur(60px); opacity:.55; z-index:0;
}
.nx-deco-a{
  width:480px; height:480px; top:-200px; left:-180px;
  background: radial-gradient(circle, rgba(37,99,168,.18), transparent 65%);
  animation: nx-orb-a 16s ease-in-out infinite alternate;
}
.nx-deco-b{
  width:420px; height:420px; bottom:-180px; right:-160px;
  background: radial-gradient(circle, rgba(201,169,97,.14), transparent 65%);
  animation: nx-orb-b 18s ease-in-out infinite alternate;
}
@keyframes nx-orb-a{ 0%{transform:translate(0,0) scale(1);opacity:.5} 100%{transform:translate(40px,30px) scale(1.08);opacity:.85} }
@keyframes nx-orb-b{ 0%{transform:translate(0,0) scale(1);opacity:.5} 100%{transform:translate(-30px,-40px) scale(1.06);opacity:.8} }

.nx-section .container{position:relative; z-index:2}

/* ── HEADER ── */
.nx-hdr{
  display:flex; justify-content:space-between; align-items:flex-end;
  flex-wrap: wrap; gap: 1.5rem;
  margin-bottom: 2.75rem;
}
.nx-hdr-l{max-width: 620px}
.nx-hdr .s-lbl{
  display:inline-flex; align-items:center; gap:.85rem;
}
.nx-live{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.66rem; font-weight:800; letter-spacing:1.4px; text-transform:uppercase;
  padding:.28rem .7rem;
  border-radius:30px;
  background: linear-gradient(135deg, rgba(224,45,60,.14), rgba(224,45,60,.06));
  color: #e02d3c;
  border:1px solid rgba(224,45,60,.32);
}
[data-theme="dark"] .nx-live{color:#ff6b78; background:linear-gradient(135deg, rgba(255,107,120,.14), rgba(255,107,120,.06))}
.nx-live-dot{
  width:6px; height:6px; border-radius:50%;
  background:currentColor;
  box-shadow: 0 0 0 0 currentColor;
  animation: nx-pulse 1.8s ease-out infinite;
}
@keyframes nx-pulse{
  0%   { box-shadow: 0 0 0 0 currentColor; opacity:1; }
  70%  { box-shadow: 0 0 0 8px transparent; opacity:.7; }
  100% { box-shadow: 0 0 0 0 transparent; opacity:1; }
}
.nx-title{margin-top:.4rem; margin-bottom:.85rem}
.nx-title-accent{
  font-style:italic;
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
.nx-desc{font-size:.95rem; color:var(--t2); line-height:1.7; max-width:520px}

.nx-all{position:relative; align-self:flex-end}

/* ── GRID ── */
.nx-grid{
  display:grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 2rem;
  align-items: stretch;
}

/* ── FEATURED CARD ── */
.nx-feat{
  position: relative; isolation:isolate;
  display:flex; flex-direction:column;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 18px;
  overflow:hidden;
  text-decoration: none; color: inherit;
  box-shadow: var(--shadow-1), var(--shadow-2);
  transition: transform .45s var(--ease), box-shadow .45s, border-color .35s;
}
.nx-feat:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3), var(--shadow-4);
  border-color: transparent;
}
.nx-feat::before{
  content:''; position:absolute; top:0; left:0; right:0; height:4px; z-index:3;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold) 70%, var(--gold-warm));
}
.nx-feat::after{
  content:''; position:absolute; inset:0; border-radius:inherit;
  padding:1.5px;
  background: conic-gradient(from 90deg, transparent, rgba(201,169,97,.5), rgba(126,200,245,.5), transparent 65%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity:0; transition: opacity .5s var(--ease);
  pointer-events:none; z-index:4;
  animation: card-spin 14s linear infinite;
}
.nx-feat:hover::after{opacity:.95}

.nx-feat-img{
  position:relative;
  aspect-ratio: 16/9;
  overflow:hidden;
  background: linear-gradient(135deg, var(--blue-dark), var(--ink));
}
.nx-feat-img img{
  width:100%; height:100%; object-fit: cover; display:block;
  transition: transform .8s cubic-bezier(.22,1,.36,1), filter .35s;
  filter: brightness(.98);
}
.nx-feat:hover .nx-feat-img img{transform: scale(1.06); filter: brightness(1.05)}
.nx-feat-img::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 45%, rgba(13,30,48,.65));
  pointer-events:none;
}
.nx-feat-num{
  position:absolute; top:1rem; left:1.2rem; z-index:2;
  font-family: var(--serif); font-style:italic; font-weight:800;
  font-size: 2.2rem; line-height:1;
  color: rgba(255,255,255,.9);
  text-shadow: 0 4px 18px rgba(0,0,0,.4);
  letter-spacing:-.02em;
}
.nx-feat-tag{
  position:absolute; top:1.15rem; right:1.2rem; z-index:2;
  display:inline-flex; align-items:center; gap:.45rem;
  font-size:.66rem; font-weight:800; letter-spacing:1.6px; text-transform:uppercase;
  padding:.42rem .85rem; border-radius:30px;
  color:#fff;
  background: linear-gradient(135deg, rgba(201,169,97,.32), rgba(255,255,255,.12));
  border: 1px solid rgba(255,255,255,.32);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 6px 18px rgba(0,0,0,.25);
}
.nx-feat-tag .nx-live-dot{
  width:6px; height:6px; background: var(--gold);
  box-shadow: 0 0 8px rgba(201,169,97,.7);
}

.nx-feat-body{
  flex: 1;
  display:flex; flex-direction:column; gap:.85rem;
  padding: 1.6rem 1.8rem 1.8rem;
}
.nx-feat-cat{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.7rem; font-weight:800; letter-spacing:2px; text-transform:uppercase;
  color: var(--blue-mid);
  width: fit-content;
}
.nx-feat-cat::before{
  content:''; width:18px; height:1.5px; background: var(--blue-mid); border-radius:1px;
}
.nx-feat-title{
  font-family: var(--serif);
  font-size: clamp(1.3rem, 2.2vw, 1.85rem);
  font-weight: 700;
  line-height: 1.22; letter-spacing:-.4px;
  color: var(--t1);
  transition: color .25s;
}
.nx-feat:hover .nx-feat-title{color: var(--accent)}
.nx-feat-desc{
  font-size:.95rem; color: var(--t2); line-height: 1.72;
  display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.nx-feat-foot{
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:1rem;
  padding-top: 1rem;
  margin-top: auto;
  border-top: 1px solid var(--bdr);
}
.nx-feat-meta{display:flex; flex-wrap:wrap; gap:.4rem 1rem; color: var(--t3); font-size:.8rem}
.nx-feat-meta span{display:inline-flex; align-items:center; gap:.4rem}
.nx-feat-meta svg{width:13px; height:13px; opacity:.85}
.nx-feat-cta{
  display:inline-flex; align-items:center; gap:.45rem;
  font-size:.86rem; font-weight: 700; color: var(--blue-mid);
  letter-spacing:.02em;
  transition: gap .3s var(--ease), color .25s;
}
.nx-feat-cta svg{width:14px; height:14px; transition: transform .3s var(--ease)}
.nx-feat:hover .nx-feat-cta{gap:.7rem; color: var(--accent)}
.nx-feat:hover .nx-feat-cta svg{transform: translateX(4px)}

/* ── LIST ── */
.nx-list{
  display:flex; flex-direction:column; gap:.9rem;
}
.nx-item{
  position:relative; isolation:isolate;
  display:grid;
  grid-template-columns: 2.2rem 110px 1fr 32px;
  align-items:center;
  gap: 1rem;
  padding: 1rem 1.1rem 1rem .85rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 14px;
  text-decoration: none; color: inherit;
  box-shadow: var(--shadow-1);
  overflow: hidden;
  transition: transform .35s var(--ease), box-shadow .35s, border-color .35s;
}
.nx-item::before{
  content:''; position:absolute;
  left:0; top:0; bottom:0; width: 0;
  background: linear-gradient(180deg, var(--blue-mid), var(--gold));
  border-radius: 14px 0 0 14px;
  transition: width .35s var(--ease);
  pointer-events:none; z-index:1;
}
.nx-item::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(120deg, transparent 35%, rgba(255,255,255,.08) 50%, transparent 65%);
  transform: translateX(-130%);
  transition: transform .8s var(--ease);
  pointer-events:none; z-index:1;
}
.nx-item:hover{
  transform: translateY(-3px);
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3);
  border-color: rgba(201,169,97,.32);
}
.nx-item:hover::before{ width: 4px; }
.nx-item:hover::after{ transform: translateX(120%); }

.nx-item-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1.5rem; line-height:1;
  color: var(--gold-warm);
  text-align:center;
  letter-spacing:-.02em;
  transition: color .25s, transform .35s var(--ease);
}
.nx-item:hover .nx-item-num{transform: scale(1.1)}
[data-theme="dark"] .nx-item-num{color: var(--gold-soft)}

.nx-item-thumb{
  position: relative;
  width: 110px; height: 78px;
  border-radius: 9px; overflow:hidden;
  background: linear-gradient(135deg, var(--blue-dark), var(--ink));
  flex-shrink: 0;
}
.nx-item-thumb img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition: transform .55s cubic-bezier(.22,1,.36,1);
}
.nx-item:hover .nx-item-thumb img{transform: scale(1.08)}
.nx-item-thumb-ph{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  color: rgba(255,255,255,.3);
}
.nx-item-thumb-ph svg{width:24px; height:24px}
.nx-item-thumb::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 60%, rgba(13,30,48,.45));
  pointer-events:none;
}

.nx-item-body{display:flex; flex-direction:column; gap:.3rem; min-width:0}
.nx-item-cat{
  font-size:.62rem; letter-spacing:1.4px; text-transform:uppercase;
  font-weight: 700; color: var(--blue-mid);
}
.nx-item-title{
  font-family: var(--serif);
  font-size: .96rem; font-weight: 700;
  line-height: 1.38; color: var(--t1); letter-spacing:-.1px;
  display:-webkit-box; -webkit-line-clamp: 2; line-clamp:2; -webkit-box-orient: vertical; overflow:hidden;
  transition: color .25s;
}
.nx-item:hover .nx-item-title{color: var(--accent)}
.nx-item-meta{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.72rem; color: var(--t3);
}
.nx-item-meta svg{width:11px; height:11px; opacity:.8; flex-shrink:0}
.nx-item-dot{margin: 0 .15rem; opacity:.6}

.nx-item-arrow{
  width:32px; height:32px; flex-shrink:0;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background: var(--accent-g);
  color: var(--blue-mid);
  transition: background .25s, color .25s, transform .3s var(--ease);
}
.nx-item-arrow svg{width:14px; height:14px}
.nx-item:hover .nx-item-arrow{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color:#fff;
  transform: translateX(3px);
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce){
  .nx-deco-a, .nx-deco-b, .nx-feat::after, .nx-live-dot, .nx-item::after{ animation: none; }
}

/* ── Responsive ── */
@media(max-width: 1100px){
  .nx-grid{grid-template-columns: 1fr; gap:1.5rem}
  .nx-list{flex-direction: row; flex-wrap:wrap}
  .nx-item{flex:1 1 320px; min-width:280px}
}
@media(max-width: 720px){
  .nx-section{padding: 4rem 0 4.5rem}
  .nx-hdr{margin-bottom:2rem}
  .nx-feat-body{padding: 1.25rem 1.35rem 1.4rem}
  .nx-feat-num{font-size: 1.7rem; top:.7rem; left:.85rem}
  .nx-feat-tag{font-size:.6rem; padding:.32rem .65rem; top:.85rem; right:.85rem}
  .nx-item{
    grid-template-columns: 1.6rem 88px 1fr 28px;
    gap: .75rem;
    padding: .75rem .9rem .75rem .65rem;
  }
  .nx-item-num{font-size: 1.15rem}
  .nx-item-thumb{width: 88px; height: 64px}
  .nx-item-title{font-size:.88rem}
  .nx-item-arrow{width: 28px; height: 28px}
  .nx-item-arrow svg{width:12px; height:12px}
}
@media(max-width: 420px){
  .nx-list{flex-direction:column}
  .nx-item{flex: 0 0 auto; min-width:0}
}

/* ═══════════════════════════════════════════════════════════════════════
   HEADER — 2026 SCIENTIFIC INSTITUTE PREMIUM
═══════════════════════════════════════════════════════════════════════ */
#hdr{
  background:
    linear-gradient(180deg, var(--nav-bg) 0%, var(--nav-bg) 100%);
  border-bottom: 1px solid transparent;
  position:fixed;
  isolation: isolate;
  transition: background .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}

/* ══ HEADER: footer rangi (to'q ko'k) — shaffof/translyutsent + blur, oq matn ══
   Qaytarish uchun shu blokni o'chiring (#hdr asl oq foniga qaytadi) */
#hdr, #hdr.sc{
  background: linear-gradient(180deg, rgba(10,24,40,.55) 0%, rgba(11,26,43,.48) 100%);
  backdrop-filter: blur(16px) saturate(1.4);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  border-bottom-color: rgba(255,255,255,.08);
}
#hdr::before{ opacity: 0; }
/* Logo — oq (dark) variant */
#hdr .logo-img-light{ display: none; }
#hdr .logo-img-dark{ display: block; }
/* Menyu havolalari */
#hdr .nav-item>a{ color: rgba(255,255,255,.9); }
#hdr .nav-item>a svg{ opacity: .85; }
#hdr .nav-item:hover>a,
#hdr .nav-item>a:hover,
#hdr .nav-item>a[aria-current]{ color: #fff; background: rgba(255,255,255,.12); }
/* Til dropdown tugmasi + ikon tugmalari + burger — oq */
#hdr .ico-btn,
#hdr .lang-dd-toggle{ color: #fff; border-color: rgba(255,255,255,.28); }
#hdr .ico-btn:hover,
#hdr .lang-dd-toggle:hover,
#hdr .lang-dd.is-open .lang-dd-toggle{ background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.45); color: #fff; }
#hdr .burger span{ background: #fff; }
/* ══ /HEADER footer rangi ══ */

/* Subtle academic pattern (top fine line + dot pattern) */
#hdr::before{
  content:'';
  position:absolute; inset:0;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(26,74,122,.05) 1px, transparent 0);
  background-size: 22px 22px;
  opacity: 0;
  transition: opacity .4s var(--ease);
  pointer-events: none;
  z-index:-1;
}
[data-theme="dark"] #hdr::before{
  background-image: radial-gradient(circle at 1px 1px, rgba(126,200,245,.05) 1px, transparent 0);
}
#hdr:hover::before{opacity:.6}

/* Bottom premium gradient line — replaces simple border */
#hdr::after{
  content:'';
  position:absolute; left:0; right:0; bottom:0;
  height:1px;
  background: linear-gradient(90deg,
    transparent 0%,
    var(--bdr) 18%,
    rgba(26,74,122,.18) 50%,
    var(--bdr) 82%,
    transparent 100%);
  pointer-events:none;
}
[data-theme="dark"] #hdr::after{
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.06) 18%, rgba(126,200,245,.22) 50%, rgba(255,255,255,.06) 82%, transparent);
}

/* On scroll — denser shadow + tilla shimmer line on top */
#hdr.sc{
  box-shadow:
    0 6px 30px rgba(13,30,48,.08),
    0 1px 4px rgba(13,30,48,.06);
}
[data-theme="dark"] #hdr.sc{
  box-shadow:
    0 6px 30px rgba(0,0,0,.45),
    0 1px 4px rgba(0,0,0,.3);
}
#hdr.sc::before{opacity:.85}

/* Top tilla accent — flows on scroll */
#hdr .nav-wrap{position:relative}
#hdr .nav-wrap::before{
  content:'';
  position:absolute;
  left:0; right:0; top:-1px;
  height:1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(201,169,97,0) 25%,
    rgba(201,169,97,.55) 50%,
    rgba(201,169,97,0) 75%,
    transparent 100%);
  background-size: 200% 100%;
  opacity:0;
  transition: opacity .5s var(--ease);
  pointer-events:none;
}
#hdr.sc .nav-wrap::before{
  opacity: 1;
  animation: hdr-shimmer 7s linear infinite;
}
@keyframes hdr-shimmer{
  0%   { background-position: -100% 0; }
  100% { background-position:  100% 0; }
}

/* ── LOGO — institutional glow + serif accent ── */
.logo{position:relative; padding-right:1.5rem; margin-right:1rem}
.logo-img{transition: filter .35s var(--ease), transform .35s var(--ease)}
.logo:hover .logo-img{
  transform: translateY(-1px);
  filter: drop-shadow(0 6px 18px rgba(26,74,122,.32));
}
[data-theme="dark"] .logo:hover .logo-img{
  filter: drop-shadow(0 6px 18px rgba(126,200,245,.45));
}
.logo::before{
  content:'';
  position:absolute; right:0; top:50%; transform: translateY(-50%);
  width:1px; height:0;
  background: linear-gradient(180deg, transparent, var(--gold) 30%, var(--blue-mid) 70%, transparent);
  opacity:.55;
  transition: height .35s var(--ease);
}
.logo:hover::before{height:34px}

/* Border-right replaced with subtle gradient hint */
.logo{border-right: none}

/* ── NAV LINKS — premium with animated gold underline ── */
.nav-item > a{
  position:relative;
  border-radius: 8px;
  overflow: hidden;
  isolation: isolate;
  transition: color .3s var(--ease), background .3s var(--ease);
}
.nav-item > a::before{
  content:'';
  position:absolute;
  left:50%; right:50%;
  bottom: 4px;
  height:2px;
  background: linear-gradient(90deg, var(--gold-warm), var(--gold), var(--blue-mid));
  border-radius:2px;
  transition: left .35s var(--ease), right .35s var(--ease), opacity .25s;
  opacity:0;
  pointer-events:none;
}
.nav-item:hover > a::before,
.nav-item > a:hover::before,
.nav-item > a[aria-current]::before{
  left: 18%; right: 18%;
  opacity: 1;
}
.nav-item > a[aria-current]{
  color: var(--accent);
  background: linear-gradient(135deg, var(--accent-g), rgba(201,169,97,.06));
}
.nav-item > a svg:first-child{
  transition: transform .35s var(--ease), color .25s;
}
.nav-item:hover > a svg:first-child{
  transform: scale(1.1) rotate(-3deg);
  color: var(--accent);
}
.nav-item > a svg:last-child{
  transition: transform .35s var(--ease);
}
.nav-item:hover > a svg:last-child{
  transform: rotate(180deg);
  color: var(--gold-warm);
}

/* ── DROPDOWN — premium glass with gold accent ── */
.dropdown{
  background:
    linear-gradient(180deg, rgba(255,255,255,.6), rgba(255,255,255,.3)),
    var(--card);
  border: 1px solid var(--bdr);
  border-radius: 14px;
  padding: .6rem;
  min-width: 250px;
  backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  box-shadow:
    0 24px 60px rgba(13,30,48,.14),
    0 8px 22px rgba(13,30,48,.08),
    inset 0 1px 0 rgba(255,255,255,.5);
  overflow: visible;
}
[data-theme="dark"] .dropdown{
  background:
    linear-gradient(180deg, rgba(15,32,53,.85), rgba(7,18,30,.7)),
    var(--card);
  box-shadow:
    0 24px 60px rgba(0,0,0,.55),
    0 8px 22px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.06);
}
[data-theme="dark"] .dropdown a{color:#fff}
[data-theme="dark"] .dropdown a svg{color:#7ec8f5; opacity:.85}

/* Animated gradient border on dropdown */
.dropdown::after{
  content:'';
  position:absolute; inset:-1px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(201,169,97,.55), rgba(91,163,217,.45) 60%, transparent);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  pointer-events:none;
  opacity: .65;
}

/* Tilla cap on top of dropdown */
.dropdown .dropdown-title:first-child,
.dropdown a:first-child{ position:relative; }

/* Dropdown link rows */
.dropdown a{
  position:relative;
  padding: .58rem 1rem .58rem .9rem;
  border-radius: 9px;
  transition: background .25s, color .25s, padding-left .25s var(--ease);
  isolation: isolate;
}
.dropdown a::before{
  content:'';
  position:absolute;
  left: .35rem; top:50%; transform: translateY(-50%);
  width: 0; height: 14px;
  background: linear-gradient(180deg, var(--gold-warm), var(--gold));
  border-radius: 2px;
  transition: width .25s var(--ease);
  pointer-events:none;
}
.dropdown a:hover{
  background: linear-gradient(135deg, var(--accent-g), rgba(201,169,97,.06));
  padding-left: 1.15rem;
}
.dropdown a:hover::before{ width: 3px; }
.dropdown a svg{
  transition: transform .25s var(--ease), opacity .2s, color .2s;
}
.dropdown a:hover svg{
  opacity: 1;
  transform: scale(1.12);
  color: var(--gold-warm);
}
.dropdown-title{
  position:relative;
  padding: .55rem .9rem .3rem 1.1rem;
  margin-top: .15rem;
  color: var(--gold-warm);
  font-family: var(--serif);
  font-style: italic;
  font-weight: 800;
  font-size: .76rem;
  letter-spacing: 1.4px;
  text-transform: uppercase;
}
[data-theme="dark"] .dropdown-title{color: var(--gold-soft)}
.dropdown-title::before{
  content:'';
  position:absolute; left:.3rem; top: 50%; transform: translateY(-15%);
  width: 14px; height: 1.5px;
  background: linear-gradient(90deg, var(--gold-warm), transparent);
  border-radius: 2px;
}
.dropdown-title a{
  display:inline-block;
  padding: 0;
  background: none;
  color: inherit;
  font-family: inherit;
  font-style: inherit;
  font-weight: inherit;
  text-transform: inherit;
  letter-spacing: inherit;
}
.dropdown-title a::before{ display:none }
.dropdown-title a:hover{ color: var(--blue-mid); padding-left:0; background:transparent }

/* ── ICON BUTTONS — premium hover ── */
.ico-btn{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transition: background .3s, color .3s, border-color .3s, transform .25s var(--ease);
}
.ico-btn::before{
  content:'';
  position:absolute; inset:0;
  background: radial-gradient(circle at center, rgba(201,169,97,.18), transparent 70%);
  opacity: 0;
  transition: opacity .35s var(--ease);
  pointer-events:none;
}
.ico-btn:hover{
  transform: translateY(-1px);
  border-color: rgba(201,169,97,.35);
  color: var(--accent);
}
.ico-btn:hover::before{opacity:1}
.ico-btn svg{
  transition: transform .3s var(--ease);
  position: relative; z-index: 1;
}
.ico-btn:hover svg{transform: scale(1.1)}

/* ── PROPOSAL BUTTON — premium gold gradient ── */
.btn-proposal{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  box-shadow: 0 6px 16px rgba(26,74,122,.3), inset 0 1px 0 rgba(255,255,255,.18);
  border-radius: 9px;
  transition: transform .25s var(--ease), box-shadow .3s, background .3s;
}
.btn-proposal::before{
  content:'';
  position:absolute; inset:0;
  background: linear-gradient(120deg, transparent 35%, rgba(255,255,255,.22) 50%, transparent 65%);
  transform: translateX(-130%);
  transition: transform .8s var(--ease);
  pointer-events:none;
  z-index:0;
}
.btn-proposal::after{
  content:'';
  position:absolute; inset:-1px;
  border-radius: inherit;
  padding: 1.5px;
  background: linear-gradient(135deg, rgba(201,169,97,.55), rgba(126,200,245,.45));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: 0;
  transition: opacity .3s var(--ease);
  pointer-events: none;
}
.btn-proposal > *{position:relative; z-index:1}
.btn-proposal:hover{
  transform: translateY(-2px);
  background: linear-gradient(135deg, var(--blue-mid), var(--blue-light));
  box-shadow: 0 12px 28px rgba(26,74,122,.42), inset 0 1px 0 rgba(255,255,255,.22);
}
.btn-proposal:hover::before{transform: translateX(130%)}
.btn-proposal:hover::after{opacity:1}
.btn-proposal svg{
  transition: transform .3s var(--ease);
}
.btn-proposal:hover svg{transform: rotate(-12deg) scale(1.1)}

/* ── BURGER — premium spring ── */
.burger{
  transition: border-color .3s, background .25s, transform .2s;
  position: relative;
  isolation: isolate;
}
.burger::before{
  content:'';
  position:absolute; inset:0;
  background: radial-gradient(circle, rgba(201,169,97,.18), transparent 70%);
  opacity: 0;
  transition: opacity .3s;
  pointer-events: none;
}
.burger:hover{border-color: rgba(201,169,97,.45)}
.burger:hover::before{opacity:1}
.burger span{transition: transform .35s var(--ease), background .25s}
.burger:hover span{background: var(--gold-warm)}

/* ── SCROLL: when scrolled — header gets a tiny gold pulse on first scroll ── */
@keyframes hdr-pulse-once{
  0%, 100% { box-shadow: 0 6px 30px rgba(13,30,48,.08); }
  50%      { box-shadow: 0 6px 30px rgba(201,169,97,.18), 0 0 0 1px rgba(201,169,97,.12); }
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce){
  #hdr.sc .nav-wrap::before,
  .btn-proposal::before{ animation: none; }
}

/* ── Mobile/tablet adjustments ── */
@media(max-width:1340px){
  .nav-item > a::before{display:none}
}
@media(max-width:900px){
  .logo::before{display:none}
}

/* ═══════════════════════════════════════════════════════════════════════
   PUBLICATIONS — ACADEMIC INDEX (Variant 6)
   Two-column "Library Catalog" skeleton: sticky filters + year-grouped entries
═══════════════════════════════════════════════════════════════════════ */

/* ── COMPACT HERO ── */
.pix-hero{
  padding: 2.4rem 0 1.4rem;
  position: relative;
  background: linear-gradient(180deg, var(--bg2), var(--bg));
  border-bottom: 1px solid var(--bdr);
}
.pix-hero .breadcrumb{
  display:flex; align-items:center; gap:.45rem; flex-wrap:wrap;
  font-size:.78rem; color: var(--t3); margin-bottom: 1.2rem;
}
.pix-hero .breadcrumb a{ color: var(--t2); text-decoration:none; transition: color var(--tr); }
.pix-hero .breadcrumb a:hover{ color: var(--accent); }
.pix-hero .breadcrumb svg{ width:11px; height:11px; opacity:.5; }
.pix-hero .breadcrumb [aria-current]{ color: var(--blue-mid); font-weight:600; }

.pix-hero-row{
  display:grid; grid-template-columns: 1fr auto;
  gap: 2rem; align-items:end;
}
.pix-hero-info{ min-width:0; }
.pix-hero-eyebrow{
  font-size:.7rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0 0 .6rem;
}
.pix-hero-title{
  font-family: var(--serif);
  font-size: clamp(1.7rem, 3.2vw, 2.6rem);
  font-weight: 800; line-height: 1.1; letter-spacing: -1px;
  color: var(--t1); margin: 0;
}
.pix-hero-title::before{
  content:''; display:inline-block; vertical-align: middle;
  width: 5px; height: clamp(1.4rem, 2.4vw, 2rem);
  margin-right: .85rem; margin-bottom: .15em;
  background: linear-gradient(180deg, var(--gold), var(--gold-warm));
  border-radius: 2px;
}
.pix-hero-sub{
  font-size: .94rem; color: var(--t2); margin:.7rem 0 0;
  max-width: 60ch; line-height: 1.6;
}
.pix-hero-stats{
  list-style:none; padding:0; margin:0;
  display:flex; align-items:flex-end; gap: 1.6rem;
}
.pix-hero-stats li{
  display:flex; flex-direction:column;
  padding-right: 1.6rem; border-right: 1px solid var(--bdr);
}
.pix-hero-stats li:last-child{ border-right:none; padding-right:0; }
.pix-hero-stats-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1.55rem; color: var(--gold-warm); line-height: 1;
  letter-spacing: -.5px;
}
.pix-hero-stats-lbl{
  font-size: .65rem; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--t3); font-weight: 700; margin-top:.35rem;
}

/* ── SECTION SHELL ── */
#pix-section{ padding: 3rem 0 5rem; background: var(--bg); }

.pix-shell{
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 2.4rem;
  align-items: flex-start;
}

/* ── SIDEBAR ── */
.pix-side{
  position: sticky;
  top: 92px;
  align-self: start;
}
.pix-side-inner{
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 14px;
  padding: 1.3rem 1.2rem 1.1rem;
  display:flex; flex-direction:column; gap: 1.4rem;
  max-height: calc(100vh - 110px);
  overflow-y: auto;
  scrollbar-width: thin;
  position: relative;
  isolation: isolate;
}
.pix-side-inner::-webkit-scrollbar{ width:5px; }
.pix-side-inner::-webkit-scrollbar-thumb{ background: var(--bdr); border-radius: 4px; }

/* Decorative left accent strip */
.pix-side-inner::before{
  content:'';
  position:absolute; left:0; top:1.3rem; bottom:1.3rem; width:3px;
  background: linear-gradient(180deg, var(--gold) 0%, var(--blue-mid) 100%);
  border-radius: 0 3px 3px 0;
  opacity:.6;
  pointer-events:none;
}

/* Search */
.pix-search{
  position:relative;
  display:flex; align-items:center;
}
.pix-search svg{
  position:absolute; left:.85rem;
  width:14px; height:14px; color: var(--t3); pointer-events:none;
}
.pix-search input{
  width:100%;
  padding: .7rem .85rem .7rem 2.3rem;
  background: var(--bg3);
  border: 1px solid var(--bdr);
  border-radius: 9px;
  font-size: .85rem;
  color: var(--t1);
  font-family: inherit;
  transition: border-color var(--tr), background var(--tr);
}
.pix-search input::placeholder{ color: var(--t3); }
.pix-search input:focus{
  outline:none;
  border-color: var(--blue-mid);
  background: var(--bg2);
}

/* Filter group */
.pix-filter{ display:flex; flex-direction:column; gap:.55rem; }
.pix-filter-h{
  display:flex; align-items:center; gap:.55rem;
  font-size:.62rem; font-weight: 800; letter-spacing: 2.6px; text-transform: uppercase;
  color: var(--blue-mid); margin: 0;
  font-family: var(--sans);
}
.pix-filter-h-mark{
  width:6px; height:6px; border-radius:50%;
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  box-shadow: 0 0 8px rgba(201,169,97,.5);
}

.pix-filter-list{
  list-style:none; padding:0; margin:0;
  display:flex; flex-direction:column; gap: 2px;
}
.pix-filter-item{
  display:grid; grid-template-columns: auto 1fr auto;
  align-items:center; gap:.7rem;
  width:100%;
  padding: .55rem .7rem;
  background: transparent;
  border: none;
  border-radius: 7px;
  font-size: .84rem; font-weight: 500;
  color: var(--t2);
  cursor: pointer;
  text-align:left;
  text-decoration:none;
  font-family: inherit;
  transition: background var(--tr), color var(--tr), padding var(--tr);
  position: relative;
}
.pix-filter-item:hover{
  background: var(--accent-g);
  color: var(--t1);
  padding-left: .9rem;
}
.pix-filter-mark{
  width: 6px; height: 6px; border-radius: 2px;
  background: var(--bdr);
  transition: background var(--tr), height var(--tr), transform var(--tr);
}
.pix-filter-item:hover .pix-filter-mark{ background: var(--gold); height: 14px; }
.pix-filter-name{
  flex:1; min-width:0;
  overflow:hidden; text-overflow: ellipsis; white-space:nowrap;
}
.pix-filter-count{
  font-size: .68rem; font-weight: 700;
  color: var(--t3); letter-spacing: .5px;
  background: var(--bg3);
  padding: .15rem .45rem;
  border-radius: 100px;
  min-width: 28px; text-align:center;
  transition: background var(--tr), color var(--tr);
}
.pix-filter-item.is-active{
  background: linear-gradient(90deg, rgba(201,169,97,.12), transparent);
  color: var(--blue-dark);
  font-weight: 700;
}
.pix-filter-item.is-active .pix-filter-mark{
  background: linear-gradient(180deg, var(--gold), var(--gold-warm));
  height: 18px;
  box-shadow: 0 0 8px rgba(201,169,97,.5);
}
.pix-filter-item.is-active .pix-filter-count{
  background: var(--blue-mid); color: #fff;
}

[data-theme="dark"] .pix-filter-item.is-active{ color: #fff; }

/* Sidebar foot */
.pix-side-foot{
  display:flex; justify-content:space-between; align-items:center;
  padding-top:.9rem;
  border-top: 1px dashed var(--bdr);
  font-size:.72rem;
}
.pix-side-foot-lbl{ color: var(--t3); letter-spacing:1.2px; text-transform: uppercase; font-weight: 700; }
.pix-side-foot-val{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  color: var(--gold-warm); font-size: 1rem;
}

/* Mobile sidebar toggle */
.pix-side-toggle{
  display:none;
  align-items:center; gap:.6rem;
  padding:.7rem 1.1rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 10px;
  font-size: .85rem; font-weight: 700; color: var(--t1);
  font-family: inherit;
  margin-bottom: 1rem;
  cursor: pointer;
  transition: border-color var(--tr), background var(--tr);
}
.pix-side-toggle:hover{ border-color: var(--blue-mid); }
.pix-side-toggle svg{ width:16px; height:16px; }

/* ── MAIN COLUMN ── */
.pix-main{ min-width: 0; }

.pix-main-toolbar{
  display:flex; justify-content:space-between; align-items:flex-end;
  gap: 1.5rem; flex-wrap:wrap;
  padding-bottom: 1.4rem;
  border-bottom: 2px solid var(--bdr);
  margin-bottom: 2.5rem;
  position: relative;
}
.pix-main-toolbar::after{
  content:''; position:absolute; left:0; bottom:-2px;
  width: 80px; height: 2px;
  background: linear-gradient(90deg, var(--gold), var(--gold-warm));
}
.pix-toolbar-eyebrow{
  font-size:.66rem; letter-spacing: 2.4px; text-transform: uppercase;
  color: var(--blue-mid); font-weight: 800; margin: 0 0 .35rem;
}
.pix-toolbar-title{
  font-family: var(--serif); font-style: italic;
  font-size: clamp(1.4rem, 2.5vw, 1.95rem); font-weight: 800;
  color: var(--t1); margin: 0; line-height: 1.1;
}
.pix-toolbar-count{
  font-size: .82rem; color: var(--t2); margin: 0;
  white-space: nowrap;
}
.pix-toolbar-count b{ color: var(--gold-warm); font-weight: 800; font-size: 1.05rem; }

/* Year group */
.pix-yeargroup{ margin-bottom: 3rem; }
.pix-yeargroup:last-child{ margin-bottom: 0; }

.pix-yearhead{
  display:flex; align-items:center; gap: 1.2rem;
  margin-bottom: 1.2rem;
}
.pix-yearhead-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: clamp(2rem, 3.5vw, 2.8rem); line-height: 1;
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -1.5px;
  flex-shrink: 0;
}
.pix-yearhead-line{
  flex: 1; height: 1px;
  background: linear-gradient(90deg, var(--bdr) 0%, transparent 100%);
  position: relative;
}
.pix-yearhead-line::before{
  content:''; position:absolute; left:0; top:50%; transform: translateY(-50%);
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--gold); box-shadow: 0 0 8px rgba(201,169,97,.5);
}
.pix-yearhead-count{
  font-size: .68rem; letter-spacing: 2px; text-transform: uppercase;
  font-weight: 800; color: var(--t3);
  flex-shrink: 0;
}

/* Entries */
.pix-entries{
  list-style:none; padding:0; margin:0;
  display:flex; flex-direction: column;
}

.pix-entry{
  border-bottom: 1px dashed var(--bdr);
  transition: background var(--tr);
}
.pix-entry:first-child{ border-top: 1px dashed var(--bdr); }

.pix-entry-link{
  display:grid;
  grid-template-columns: 80px 1fr;
  gap: 1.6rem;
  padding: 1.6rem .4rem 1.6rem 1rem;
  text-decoration: none;
  color: inherit;
  position: relative;
  isolation: isolate;
  transition: padding var(--tr), background var(--tr);
}
.pix-entry-link::before{
  content:''; position:absolute; left:0; top:50%; transform: translateY(-50%) scaleY(0);
  width: 3px; height: 60%;
  background: linear-gradient(180deg, var(--gold), var(--gold-warm));
  border-radius: 2px;
  transform-origin: center;
  transition: transform .35s var(--ease);
}
.pix-entry-link:hover{
  background: linear-gradient(90deg, var(--accent-g), transparent 80%);
  padding-left: 1.4rem;
}
.pix-entry-link:hover::before{ transform: translateY(-50%) scaleY(1); }

/* Entry number */
.pix-entry-num{
  font-family: var(--serif);
  font-size: 1.1rem; font-weight: 800;
  color: var(--t3);
  letter-spacing: 1px;
  padding-top: .4rem;
  font-feature-settings: "tnum";
  position: relative;
  transition: color var(--tr), transform var(--tr);
}
.pix-entry-num::before{
  content:'№'; font-size: .68rem; vertical-align: super;
  margin-right: 2px; color: var(--blue-mid); font-style: italic;
}
.pix-entry-link:hover .pix-entry-num{
  color: var(--gold-warm);
  transform: translateX(-2px);
}

.pix-entry-content{ display:flex; flex-direction:column; gap:.5rem; min-width:0; }

.pix-entry-meta{
  display:flex; align-items:center; gap:.55rem; flex-wrap:wrap;
  font-size:.74rem; color: var(--t3);
}
.pix-entry-cat{
  font-size:.62rem; font-weight: 800; letter-spacing: 2px; text-transform: uppercase;
  color: var(--blue-mid);
  padding: .18rem .55rem;
  background: var(--accent-g);
  border-radius: 3px;
}
.pix-entry-dot{
  width: 3px; height: 3px; border-radius: 50%;
  background: var(--t3);
}
.pix-entry-date{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.78rem;
}
.pix-entry-date svg{ width:12px; height:12px; opacity:.7; }

.pix-entry-title{
  font-family: var(--serif);
  font-size: clamp(1.05rem, 1.5vw, 1.22rem);
  font-weight: 700; line-height: 1.4;
  color: var(--t1);
  margin: .15rem 0;
  letter-spacing: -.2px;
  transition: color var(--tr);
}
.pix-entry-link:hover .pix-entry-title{ color: var(--blue-dark); }
[data-theme="dark"] .pix-entry-link:hover .pix-entry-title{ color: #fff; }

.pix-entry-abstract{
  font-size: .88rem; line-height: 1.65;
  color: var(--t2);
  margin: .15rem 0 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
          line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.pix-entry-foot{
  display:flex; align-items:center; gap:.7rem; flex-wrap:wrap;
  margin-top:.5rem;
}
.pix-entry-tag{
  display:inline-flex; align-items:center; gap:.35rem;
  font-size:.72rem; font-weight: 600; color: var(--t3);
  padding: .25rem .55rem;
  background: var(--bg3);
  border-radius: 4px;
}
.pix-entry-tag svg{ width:11px; height:11px; }
.pix-entry-tag-pdf{
  color: var(--gold-warm);
  background: rgba(201,169,97,.12);
  font-weight: 800; letter-spacing: 1.2px;
}

.pix-entry-cta{
  margin-left:auto;
  display:inline-flex; align-items:center; gap:.4rem;
  font-size: .72rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
  color: var(--blue-mid);
  transition: gap var(--tr), color var(--tr);
}
.pix-entry-cta svg{ width:13px; height:13px; transition: transform var(--tr); }
.pix-entry-link:hover .pix-entry-cta{ gap:.6rem; color: var(--gold-warm); }
.pix-entry-link:hover .pix-entry-cta svg{ transform: translateX(4px); }

/* Empty */
.pix-empty{
  text-align:center; padding: 3rem 0; color: var(--t2);
  font-style: italic;
}

/* ── PAGINATION ── */
.pix-pagination{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; flex-wrap:wrap;
  margin-top: 3rem; padding-top: 2rem;
  border-top: 1px dashed var(--bdr);
}
.pix-pg-nav{
  display:inline-flex; align-items:center; gap:.5rem;
  padding: .65rem 1.1rem;
  font-size:.82rem; font-weight: 600;
  color: var(--t1); text-decoration: none;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 8px;
  transition: all var(--tr);
}
.pix-pg-nav:hover:not(.is-disabled){
  border-color: var(--blue-mid);
  background: var(--accent-g);
}
.pix-pg-nav.is-disabled{ opacity:.4; pointer-events:none; }
.pix-pg-nav svg{ width:14px; height:14px; }

.pix-pg-numbers{
  list-style:none; padding:0; margin:0;
  display:flex; align-items:center; gap:.35rem;
}
.pix-pg, .pix-pg-dots{
  display:inline-flex; align-items:center; justify-content:center;
  min-width: 38px; height: 38px;
  padding: 0 .6rem;
  font-size: .85rem; font-weight: 700;
  color: var(--t2); text-decoration: none;
  border-radius: 8px;
  transition: all var(--tr);
  font-family: var(--serif);
}
.pix-pg:hover{ background: var(--accent-g); color: var(--blue-mid); }
.pix-pg.is-current{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff;
  box-shadow: 0 4px 12px rgba(37,99,168,.3);
}
.pix-pg-dots{ color: var(--t3); cursor:default; }

/* ═════════════════════════════════════════
   PUBLICATIONS — Responsive
═════════════════════════════════════════ */
@media (max-width: 980px){
  .pix-shell{
    grid-template-columns: 1fr;
    gap: 1.4rem;
  }
  .pix-side{
    position: static;
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s var(--ease);
  }
  .pix-side.is-open{ max-height: 1200px; }
  .pix-side-inner{ max-height: none; }
  .pix-side-toggle{ display:inline-flex; }

  .pix-hero-row{
    grid-template-columns: 1fr;
    gap: 1.4rem;
  }
  .pix-hero-stats{
    flex-wrap: wrap;
    gap: 1rem;
  }
  .pix-hero-stats li{
    padding-right: 1rem;
  }
}
@media (max-width: 640px){
  .pix-entry-link{
    grid-template-columns: 56px 1fr;
    gap: 1rem;
    padding: 1.2rem .25rem 1.2rem .8rem;
  }
  .pix-entry-num{ font-size:.95rem; padding-top:.2rem; }
  .pix-yearhead-num{ font-size: 1.7rem; }
  .pix-entry-title{ font-size: 1rem; }
  .pix-entry-abstract{ font-size: .82rem; -webkit-line-clamp: 3; line-clamp: 3; }
  .pix-pagination{ justify-content: center; }
  .pix-main-toolbar{ flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce){
  .pix-entry-link,
  .pix-entry-link *,
  .pix-side-inner,
  .pix-pg-nav,
  .pix-filter-item{ transition: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   ARCHIVES (NEWS) — MAGAZINE SPREAD
   Cover story + side latest + asymmetric mosaic grid
═══════════════════════════════════════════════════════════════════════ */

/* ── MASTHEAD ── */
.nax-masthead{
  padding: 2.4rem 0 1.8rem;
  background: var(--bg2);
  border-bottom: 1px solid var(--bdr);
  position: relative;
}
.nax-masthead .breadcrumb{
  display:flex; align-items:center; gap:.45rem; flex-wrap:wrap;
  font-size:.78rem; color: var(--t3); margin-bottom: 1.4rem;
}
.nax-masthead .breadcrumb a{ color: var(--t2); text-decoration:none; transition: color var(--tr); }
.nax-masthead .breadcrumb a:hover{ color: var(--accent); }
.nax-masthead .breadcrumb svg{ width:11px; height:11px; opacity:.5; }
.nax-masthead .breadcrumb [aria-current]{ color: var(--blue-mid); font-weight:600; }

.nax-masthead-row{
  display:grid; grid-template-columns: 1fr auto;
  gap: 2rem; align-items: end;
}
.nax-issue-no{
  font-size:.7rem; font-weight: 800; letter-spacing: 3px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0 0 .5rem;
  display:inline-flex; align-items:center; gap:.65rem;
}
.nax-issue-no::before{
  content:''; width: 22px; height: 1.5px;
  background: var(--gold-warm);
}
.nax-masthead-title{
  font-family: var(--serif);
  font-size: clamp(2rem, 5vw, 3.4rem);
  font-weight: 800; line-height: 1; letter-spacing: -1.5px;
  color: var(--t1); margin: 0;
  text-transform: uppercase;
}
.nax-masthead-r{
  display:flex; align-items:center; gap: 1rem;
}
.nax-mh-rule{
  width: 1.5px; height: 60px;
  background: linear-gradient(180deg, transparent, var(--gold), transparent);
}
.nax-masthead-meta{
  font-size: .8rem; color: var(--t2); margin: 0;
  font-family: var(--serif); font-style: italic;
}
.nax-masthead-meta b{ color: var(--gold-warm); font-style: normal; font-weight: 800; font-size: 1.1rem; }
.nax-mh-sep{ color: var(--t3); margin: 0 .5rem; }

/* ── Masthead bilan rasm foni (admin /page-heroes orqali) ── */
.nax-masthead[style*="--ph-bg"]{
  padding-bottom: 9rem;
  background-image:
    linear-gradient(180deg, rgba(11,26,43,.92) 0%, rgba(11,26,43,.45) 28%, rgba(11,26,43,.55) 100%),
    linear-gradient(135deg, rgba(11,26,43,.7) 0%, rgba(11,26,43,.42) 55%, rgba(11,26,43,.85) 100%),
    var(--ph-bg);
  background-size: cover;
  background-repeat: no-repeat;
  border-bottom: 0;
}
.nax-masthead[style*="--ph-bg"] .breadcrumb,
.nax-masthead[style*="--ph-bg"] .breadcrumb a,
.nax-masthead[style*="--ph-bg"] .breadcrumb svg{ color: rgba(255,255,255,.92); }
.nax-masthead[style*="--ph-bg"] .breadcrumb a:hover{ color: #fff; }
.nax-masthead[style*="--ph-bg"] .breadcrumb [aria-current]{ color: var(--gold-soft); }
.nax-masthead[style*="--ph-bg"] .breadcrumb,
.nax-masthead[style*="--ph-bg"] .nax-masthead-title{ text-shadow: 0 1px 14px rgba(0,0,0,.5); }
.nax-masthead[style*="--ph-bg"] .nax-masthead-title{ color: #fff; }
.nax-masthead[style*="--ph-bg"] .nax-masthead-meta{ color: rgba(255,255,255,.88); }

/* ── COVER STORY ── */
.nax-cover{ padding: 3rem 0 2.5rem; background: var(--bg); }

.nax-cover-grid{
  display:grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr);
  gap: 2.5rem;
  align-items: stretch;
}

.nax-cover-main{
  display:flex; flex-direction: column;
  text-decoration: none; color: inherit;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 4px;
  overflow: hidden;
  position: relative; isolation: isolate;
  transition: transform .45s var(--ease), box-shadow .45s var(--ease);
}
.nax-cover-main:hover{
  transform: translateY(-4px);
  box-shadow: 0 28px 60px rgba(13,30,48,.18);
}

.nax-cover-img{
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: linear-gradient(135deg, var(--blue-dark), var(--ink));
}
/* Blurred fill background — same image scaled + blurred so card is never empty */
.nax-cover-img::before{
  content:''; position:absolute; inset:-6%;
  background-image: var(--img);
  background-size: cover;
  background-position: center;
  filter: blur(28px) brightness(.7) saturate(1.15);
  transform: scale(1.1);
  z-index: 0;
  pointer-events: none;
}
.nax-cover-img img{
  position: relative; z-index: 1;
  width:100%; height:100%;
  object-fit: contain; /* show full image — no cropping */
  display: block;
  transition: transform .8s var(--ease), filter .35s;
  filter: saturate(.98) drop-shadow(0 14px 30px rgba(0,0,0,.35));
}
.nax-cover-main:hover .nax-cover-img img{
  transform: scale(1.03);
  filter: saturate(1.08) drop-shadow(0 18px 36px rgba(0,0,0,.45));
}
.nax-cover-img::after{
  content:''; position:absolute; inset:0; z-index: 2;
  background: linear-gradient(180deg, transparent 65%, rgba(13,30,48,.4));
  pointer-events:none;
}

.nax-cover-badge{
  position:absolute; top: 1.2rem; left: 1.2rem; z-index:2;
  display:inline-flex; align-items:center; gap:.55rem;
  padding: .45rem 1rem;
  background: rgba(255,255,255,.95);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border-radius: 2px;
  font-size:.65rem; font-weight: 800; letter-spacing: 2.2px; text-transform: uppercase;
  color: var(--blue-dark);
  box-shadow: 0 4px 14px rgba(13,30,48,.18);
}
.nax-cover-badge-dot{
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 8px rgba(201,169,97,.7);
  animation: nax-pulse 2s infinite;
}
@keyframes nax-pulse{ 0%,100%{ opacity:1; transform:scale(1); } 50%{ opacity:.6; transform:scale(.85); } }

.nax-cover-fold{
  position:absolute; top:0; right:0; z-index:2;
  width: 60px; height: 60px;
  background: linear-gradient(225deg, var(--gold) 0%, var(--gold) 50%, transparent 50%);
  opacity: 0;
  transition: opacity .4s var(--ease);
}
.nax-cover-main:hover .nax-cover-fold{ opacity:.8; }

.nax-cover-body{
  padding: 1.8rem 2rem 2rem;
  display:flex; flex-direction: column; gap: .8rem;
  flex: 1;
}
.nax-cover-cat{
  font-size:.7rem; font-weight: 800; letter-spacing: 2.6px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0;
  display:inline-flex; align-items:center; gap:.55rem;
}
.nax-cover-cat::after{
  content:''; flex:1; height:1px; background: linear-gradient(90deg, var(--gold), transparent); max-width: 60px;
}
.nax-cover-title{
  font-family: var(--serif);
  font-size: clamp(1.4rem, 2.6vw, 2.05rem);
  font-weight: 800; line-height: 1.18; letter-spacing: -.8px;
  color: var(--t1);
  margin: 0;
  transition: color var(--tr);
}
.nax-cover-main:hover .nax-cover-title{ color: var(--blue-dark); }
[data-theme="dark"] .nax-cover-main:hover .nax-cover-title{ color: #fff; }

.nax-cover-desc{
  font-size: .98rem; color: var(--t2); line-height: 1.65;
  margin: 0;
  font-family: var(--serif);
  display: -webkit-box;
  -webkit-line-clamp: 3; line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.nax-cover-foot{
  display:flex; align-items:center; gap: 1.4rem; flex-wrap: wrap;
  margin-top: auto; padding-top: 1rem;
  border-top: 1px solid var(--bdr);
  font-size: .78rem; color: var(--t3);
}
.nax-cover-foot svg{ width:13px; height:13px; opacity:.7; }
.nax-cover-date, .nax-cover-views{
  display:inline-flex; align-items:center; gap:.45rem;
}
.nax-cover-cta{
  margin-left:auto;
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.78rem; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase;
  color: var(--blue-mid);
  transition: gap var(--tr), color var(--tr);
}
.nax-cover-main:hover .nax-cover-cta{ gap: .8rem; color: var(--gold-warm); }
.nax-cover-cta svg{ width:14px; height:14px; transition: transform var(--tr); }
.nax-cover-main:hover .nax-cover-cta svg{ transform: translateX(4px); }

/* ── SIDE LATEST ── */
.nax-side{
  display: flex; flex-direction: column;
  background: linear-gradient(180deg, var(--card), var(--bg2));
  border: 1px solid var(--bdr);
  border-left: 4px solid transparent;
  border-image: linear-gradient(180deg, var(--gold) 0%, var(--blue-mid) 100%) 1;
  border-radius: 0 4px 4px 0;
  padding: 1.6rem 1.5rem 1.4rem;
  position: relative;
}

.nax-side-head{
  display:flex; align-items:center; gap:.7rem;
  padding-bottom: 1rem;
  border-bottom: 2px solid var(--bdr);
  margin-bottom: 1rem;
  position: relative;
}
.nax-side-head::after{
  content:''; position:absolute; bottom:-2px; left:0;
  width: 40px; height: 2px;
  background: var(--gold);
}
.nax-side-bullet{
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 10px rgba(201,169,97,.6);
  flex-shrink: 0;
}
.nax-side-title{
  font-family: var(--serif); font-style: italic;
  font-size: 1.1rem; font-weight: 800; color: var(--t1);
  margin: 0; letter-spacing: -.3px;
}

.nax-side-list{
  list-style: none; padding: 0; margin: 0;
  display:flex; flex-direction: column;
  flex: 1;
}
.nax-side-list li{
  border-bottom: 1px dashed var(--bdr);
}
.nax-side-list li:last-child{ border-bottom: none; }

.nax-side-item{
  display:grid; grid-template-columns: 36px 1fr;
  gap: .9rem;
  padding: .85rem 0;
  text-decoration: none;
  color: inherit;
  transition: padding var(--tr);
  position: relative;
}
.nax-side-item:hover{ padding-left: .35rem; }

.nax-side-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1.5rem; line-height: 1;
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -1px;
  transition: transform var(--tr);
}
.nax-side-item:hover .nax-side-num{ transform: scale(1.15); }

.nax-side-text{ display:flex; flex-direction: column; gap: .3rem; min-width: 0; }
.nax-side-h{
  font-family: var(--serif);
  font-size: .92rem; font-weight: 700; line-height: 1.35;
  color: var(--t1); margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3; line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color var(--tr);
}
.nax-side-item:hover .nax-side-h{ color: var(--blue-mid); }
.nax-side-date{
  font-size:.7rem; color: var(--t3); letter-spacing: .4px;
}

.nax-side-all{
  display:inline-flex; align-items:center; gap:.5rem;
  margin-top: 1rem;
  padding: .6rem 1rem;
  background: transparent;
  border: 1px solid var(--bdr);
  border-radius: 100px;
  font-size: .72rem; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase;
  color: var(--blue-mid);
  text-decoration: none;
  transition: all var(--tr);
  align-self: flex-start;
}
.nax-side-all:hover{
  background: var(--blue-mid); color: #fff; border-color: transparent;
  gap: .7rem;
}
.nax-side-all svg{ width:13px; height:13px; transition: transform var(--tr); }
.nax-side-all:hover svg{ transform: translateX(3px); }

/* ── TOOLBAR ── */
.nax-toolbar-sec{ padding: 1.4rem 0; border-top: 1px dashed var(--bdr); border-bottom: 1px dashed var(--bdr); background: var(--bg2); }
.nax-toolbar{
  display: flex; align-items: center; gap: 1rem;
  flex-wrap: wrap;
}
.nax-chips{
  display:flex; gap: .5rem;
  flex-wrap: wrap;
  flex: 1;
  min-width: 0;
}
.nax-chip{
  display:inline-flex; align-items:center; gap:.55rem;
  padding: .55rem 1rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 100px;
  font-size: .78rem; font-weight: 600;
  color: var(--t2);
  text-decoration: none;
  transition: all var(--tr);
  white-space: nowrap;
}
.nax-chip:hover{
  border-color: var(--blue-mid);
  color: var(--blue-mid);
  transform: translateY(-2px);
}
.nax-chip.is-active{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  border-color: transparent;
  color: #fff;
  box-shadow: 0 6px 16px rgba(37,99,168,.3);
}
.nax-chip-count{
  font-size: .68rem; font-weight: 700;
  padding: .1rem .45rem;
  border-radius: 100px;
  background: var(--bg3);
  color: var(--t3);
  letter-spacing: .3px;
}
.nax-chip.is-active .nax-chip-count{ background: rgba(255,255,255,.22); color: #fff; }

.nax-search{
  position: relative;
  flex: 0 0 280px;
}
.nax-search svg{
  position: absolute; left: .85rem; top: 50%; transform: translateY(-50%);
  width: 14px; height: 14px;
  color: var(--t3);
  pointer-events: none;
}
.nax-search input{
  width: 100%;
  padding: .65rem 1rem .65rem 2.3rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 100px;
  font-size: .85rem;
  color: var(--t1);
  font-family: inherit;
  transition: border-color var(--tr);
}
.nax-search input:focus{
  outline: none;
  border-color: var(--blue-mid);
}

/* ── MOSAIC GRID ── */
.nax-mosaic-sec{ padding: 3rem 0 5rem; background: var(--bg); }

.nax-mosaic-head{
  display:flex; align-items:center; gap: 1.4rem;
  margin-bottom: 2.5rem;
  padding-bottom: 1.4rem;
  border-bottom: 2px solid var(--bdr);
  position: relative;
}
.nax-mosaic-head::after{
  content:''; position:absolute; left:0; bottom:-2px;
  width: 80px; height: 2px;
  background: linear-gradient(90deg, var(--gold), var(--gold-warm));
}
.nax-mh-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: clamp(2.4rem, 4vw, 3.4rem); line-height: 1;
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -2px;
  flex-shrink: 0;
}
.nax-mh-eyebrow{
  font-size: .68rem; font-weight: 800; letter-spacing: 2.4px; text-transform: uppercase;
  color: var(--blue-mid); margin: 0 0 .3rem;
}
.nax-mh-title{
  font-family: var(--serif); font-style: italic;
  font-size: clamp(1.4rem, 2.5vw, 1.95rem); font-weight: 800;
  color: var(--t1); margin: 0; line-height: 1;
}

/* Grid: 3-column with asymmetric spans */
.nax-mosaic{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.6rem;
}

.nax-card{
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  background: var(--card);
  border: 1px solid var(--bdr);
  transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .35s;
}
.nax-card:hover{
  transform: translateY(-4px);
  border-color: var(--gold);
  box-shadow: 0 22px 48px rgba(13,30,48,.16);
}

.nax-card-link{
  display:flex; flex-direction: column;
  text-decoration: none; color: inherit;
  height: 100%;
}

/* Wide cards (2 col span) — every 5th card on desktop */
.nax-mosaic > .nax-card:nth-child(5n+1){
  grid-column: span 2;
}
.nax-mosaic > .nax-card:nth-child(5n+1) .nax-card-link{
  flex-direction: row;
}
.nax-mosaic > .nax-card:nth-child(5n+1) .nax-card-img{
  flex: 0 0 50%; aspect-ratio: auto;
}
.nax-mosaic > .nax-card:nth-child(5n+1) .nax-card-body{
  flex: 1; justify-content: center;
}

.nax-card-img{
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: linear-gradient(135deg, var(--bg3), var(--bg2));
}
/* Blurred image fill — never shows empty card */
.nax-card-img::before{
  content:''; position:absolute; inset:-6%;
  background-image: var(--img);
  background-size: cover;
  background-position: center;
  filter: blur(22px) brightness(.78) saturate(1.1);
  transform: scale(1.1);
  z-index: 0;
  pointer-events: none;
}
.nax-card-img img{
  position: relative; z-index: 1;
  width: 100%; height: 100%;
  object-fit: contain; /* show entire image — no cropping */
  display: block;
  transition: transform .7s var(--ease), filter .35s;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.28));
}
.nax-card:hover .nax-card-img img{ transform: scale(1.06); filter: saturate(1.05); }

.nax-card-img-ph{
  position:absolute; inset: 0;
  display:flex; align-items:center; justify-content:center;
  color: rgba(37,99,168,.25);
}

.nax-card-stamp{
  position: absolute; top: 1rem; left: 1rem;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: 56px; height: 56px;
  background: rgba(255,255,255,.95);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border-radius: 4px;
  box-shadow: 0 6px 14px rgba(13,30,48,.15);
  font-family: var(--serif);
}
.nax-card-stamp-d{
  font-style: italic; font-weight: 800; font-size: 1.5rem; line-height: 1;
  color: var(--gold-warm);
}
.nax-card-stamp-m{
  font-size: .6rem; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--blue-dark); margin-top: .15rem;
}

.nax-card-body{
  padding: 1.2rem 1.3rem 1.2rem;
  display: flex; flex-direction: column; gap: .5rem;
  flex: 1;
}
.nax-card-cat{
  font-size:.62rem; font-weight: 800; letter-spacing: 2px; text-transform: uppercase;
  color: var(--blue-mid); margin: 0;
}
.nax-card-title{
  font-family: var(--serif);
  font-size: 1.05rem; font-weight: 700; line-height: 1.35;
  color: var(--t1); margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3; line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color var(--tr);
}
.nax-card:hover .nax-card-title{ color: var(--blue-mid); }

/* Wide cards: bigger title */
.nax-mosaic > .nax-card:nth-child(5n+1) .nax-card-title{
  font-size: 1.3rem;
  -webkit-line-clamp: 4; line-clamp: 4;
}

.nax-card-desc{
  font-size: .85rem; color: var(--t2); line-height: 1.55;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2; line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.nax-mosaic > .nax-card:not(:nth-child(5n+1)) .nax-card-desc{ display: none; }

.nax-card-foot{
  display:flex; align-items:center; justify-content: space-between;
  margin-top: auto; padding-top: .8rem;
  border-top: 1px dashed var(--bdr);
  font-size: .72rem; color: var(--t3);
}
.nax-card-views{
  display:inline-flex; align-items:center; gap:.35rem;
}
.nax-card-views svg{ width:11px; height:11px; }

/* ── PAGINATION (progress meter) ── */
.nax-pg{
  display:flex; align-items:center; gap: 1.2rem;
  margin-top: 3rem; padding-top: 2rem;
  border-top: 1px dashed var(--bdr);
}
.nax-pg-nav{
  display:inline-flex; align-items:center; gap:.5rem;
  padding: .65rem 1.1rem;
  font-size:.78rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
  color: var(--t1); text-decoration: none;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 100px;
  transition: all var(--tr);
}
.nax-pg-nav:hover:not(.is-disabled){
  border-color: var(--blue-mid);
  background: var(--accent-g);
}
.nax-pg-nav.is-disabled{ opacity:.4; pointer-events:none; }
.nax-pg-nav svg{ width:13px; height:13px; }
.nax-pg-meter{
  flex: 1; height: 4px;
  background: var(--bg3);
  border-radius: 100px;
  overflow: hidden;
  position: relative;
  max-width: 280px;
}
.nax-pg-meter-fill{
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold));
  border-radius: 100px;
  transition: width .5s var(--ease);
  box-shadow: 0 0 8px rgba(201,169,97,.5);
}
.nax-pg-info{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  color: var(--gold-warm); font-size: 1rem;
  letter-spacing: .5px;
}

/* ═════════════════════════════════════════
   ARCHIVES — Responsive
═════════════════════════════════════════ */
@media (max-width: 1024px){
  .nax-cover-grid{ grid-template-columns: 1fr; }
  .nax-side{
    border-image: none;
    border-left: 1px solid var(--bdr);
    border-top: 4px solid var(--gold);
    border-radius: 4px;
  }
}
@media (max-width: 820px){
  .nax-mosaic{ grid-template-columns: repeat(2, 1fr); }
  .nax-mosaic > .nax-card:nth-child(5n+1){ grid-column: span 2; }
  .nax-mosaic > .nax-card:nth-child(5n+1) .nax-card-link{ flex-direction: column; }
  .nax-mosaic > .nax-card:nth-child(5n+1) .nax-card-img{ flex: 0 0 auto; aspect-ratio: 16/9; }

  .nax-masthead-row{ grid-template-columns: 1fr; gap: 1rem; }
  .nax-mh-rule{ display: none; }
}
@media (max-width: 560px){
  .nax-mosaic{ grid-template-columns: 1fr; gap: 1.1rem; }
  .nax-mosaic > .nax-card:nth-child(5n+1){ grid-column: auto; }
  .nax-cover-body{ padding: 1.4rem 1.4rem 1.5rem; }
  .nax-mosaic-head{ flex-wrap: wrap; gap: 1rem; }
  .nax-pg{ flex-wrap: wrap; justify-content: center; }
  .nax-pg-meter{ order: 3; flex: 1 0 100%; }
  .nax-search{ flex: 1 0 100%; }
}

@media (prefers-reduced-motion: reduce){
  .nax-cover-badge-dot{ animation: none; }
  .nax-card, .nax-card *,
  .nax-cover-main, .nax-cover-main *,
  .nax-side-item, .nax-side-item *,
  .nax-chip{ transition: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   LAWS — OFFICIAL DOCUMENT REGISTRY
   Tabular layout with stamp/seal aesthetic
═══════════════════════════════════════════════════════════════════════ */

/* ── HERO ── */
.lwx-hero{
  padding: 2.5rem 0 1.6rem;
  background: linear-gradient(180deg, var(--bg2), var(--bg));
  border-bottom: 1px solid var(--bdr);
  position: relative;
}
.lwx-hero .breadcrumb{
  display:flex; align-items:center; gap:.45rem; flex-wrap:wrap;
  font-size:.78rem; color: var(--t3); margin-bottom: 1.2rem;
}
.lwx-hero .breadcrumb a{ color: var(--t2); text-decoration:none; transition: color var(--tr); }
.lwx-hero .breadcrumb a:hover{ color: var(--accent); }
.lwx-hero .breadcrumb svg{ width:11px; height:11px; opacity:.5; }
.lwx-hero .breadcrumb [aria-current]{ color: var(--blue-mid); font-weight:600; }

.lwx-hero-row{
  display:grid; grid-template-columns: 1fr auto;
  gap: 2rem; align-items:center;
}
.lwx-hero-eyebrow{
  font-size:.7rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0 0 .55rem;
}
.lwx-hero-title{
  font-family: var(--serif);
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 800; line-height: 1.1; letter-spacing: -.8px;
  color: var(--t1); margin: 0;
}
.lwx-hero-sub{
  font-size: .92rem; color: var(--t2); margin:.7rem 0 0;
  max-width: 65ch; line-height: 1.6;
}

/* Decorative seal/stamp on right of hero */
.lwx-seal{
  position: relative;
  width: 130px; height: 130px;
  display:flex; align-items:center; justify-content:center;
  flex-shrink: 0;
}
.lwx-seal-ring{
  position:absolute; inset: 0;
  border-radius: 50%;
  border: 2px solid rgba(201,169,97,.4);
}
.lwx-seal-ring-1{
  border-style: dashed;
  animation: lwx-rotate 18s linear infinite;
}
.lwx-seal-ring-2{
  inset: 10px;
  border-style: solid;
  border-color: rgba(37,99,168,.3);
  border-width: 1.5px;
  animation: lwx-rotate 24s linear infinite reverse;
}
@keyframes lwx-rotate{ to { transform: rotate(360deg); } }

.lwx-seal-core{
  position: relative; z-index: 1;
  width: 96px; height: 96px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff;
  display:flex; flex-direction: column; align-items:center; justify-content:center;
  gap: .15rem;
  box-shadow: 0 8px 24px rgba(37,99,168,.25), inset 0 -3px 0 rgba(0,0,0,.15);
}
.lwx-seal-letters{
  font-family: var(--serif); font-style: italic;
  font-size: .65rem; font-weight: 800; letter-spacing: 2.5px;
  color: var(--gold);
}
.lwx-seal-num{
  font-family: var(--serif);
  font-size: 1.85rem; font-weight: 800; line-height: 1;
  letter-spacing: -1px;
}
.lwx-seal-lbl{
  font-size: .55rem; letter-spacing: 1.5px; text-transform: uppercase;
  font-weight: 700; opacity: .85;
}

/* ── REGISTRY BANNER ── */
.lwx-banner-sec{ padding: 2rem 0 .5rem; background: var(--bg); }
.lwx-banner{
  display:grid;
  grid-template-columns: auto 1fr auto;
  gap: 2rem;
  align-items: center;
  padding: 1.6rem 2rem;
  background: linear-gradient(135deg, var(--card), var(--bg2));
  border: 1.5px solid var(--bdr);
  border-radius: 6px;
  position: relative;
  isolation: isolate;
  box-shadow: var(--shadow-1), var(--shadow-2);
}
.lwx-banner::before{
  content:'';
  position:absolute; top:0; left:0; right:0; height: 3px;
  background: linear-gradient(90deg, var(--gold-warm), var(--gold), var(--blue-mid));
}
.lwx-banner::after{
  content:'';
  position:absolute; top: -8px; right: -8px;
  width: 60px; height: 60px;
  background: radial-gradient(circle, rgba(201,169,97,.15) 0%, transparent 70%);
  pointer-events: none;
}
.lwx-banner-stamp{
  width: 56px; height: 56px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  display:flex; align-items:center; justify-content:center;
  color: #fff;
  flex-shrink: 0;
  box-shadow: 0 6px 14px rgba(201,169,97,.35);
}
.lwx-banner-stamp svg{ width: 28px; height: 28px; }

.lwx-banner-text{ min-width: 0; }
.lwx-banner-eyebrow{
  font-size:.66rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--blue-mid); margin: 0 0 .35rem;
}
.lwx-banner-title{
  font-family: var(--serif); font-style: italic;
  font-size: clamp(1.3rem, 2.4vw, 1.85rem);
  font-weight: 800; line-height: 1.15; color: var(--t1);
  margin: 0;
}

.lwx-banner-stats{
  display:flex; gap: 1.4rem;
  flex-shrink: 0;
}
.lwx-stat{
  display:flex; flex-direction: column;
  padding-left: 1.4rem;
  border-left: 1px solid var(--bdr);
}
.lwx-stat:first-child{ border-left: none; padding-left: 0; }
.lwx-stat-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1.6rem; line-height: 1;
  color: var(--gold-warm); letter-spacing: -.5px;
}
.lwx-stat-lbl{
  font-size: .62rem; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--t3); font-weight: 700; margin-top: .35rem;
}

/* ── REGISTRY SECTION ── */
.lwx-registry-sec{ padding: 2rem 0 5rem; background: var(--bg); }

/* Toolbar */
.lwx-tools{
  display:flex; justify-content: space-between; align-items: flex-start;
  gap: 1.5rem; margin-bottom: 1.4rem;
  flex-wrap: wrap;
}
.lwx-cats{
  display:flex; gap: .4rem;
  flex-wrap: wrap; flex: 1; min-width: 0;
}
.lwx-cat{
  display:inline-flex; align-items:center; gap:.55rem;
  padding: .5rem .95rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 4px;
  font-size: .8rem; font-weight: 600;
  color: var(--t2);
  text-decoration: none;
  transition: all var(--tr);
}
.lwx-cat-mark{
  width: 5px; height: 14px;
  background: var(--bdr);
  border-radius: 1px;
  transition: background var(--tr);
}
.lwx-cat:hover{
  border-color: var(--blue-mid);
  color: var(--blue-mid);
  background: var(--accent-g);
}
.lwx-cat:hover .lwx-cat-mark{ background: var(--gold); }
.lwx-cat.is-active{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff;
  border-color: transparent;
}
.lwx-cat.is-active .lwx-cat-mark{ background: var(--gold); }

.lwx-tools-r{
  display:flex; gap: .8rem; align-items: center;
  flex-wrap: wrap;
}

.lwx-yfilter{
  display:flex; gap: 2px;
  padding: 3px;
  background: var(--bg3);
  border-radius: 4px;
  border: 1px solid var(--bdr);
}
.lwx-yf-btn{
  padding: .4rem .8rem;
  background: transparent;
  border: none;
  border-radius: 3px;
  font-size: .76rem; font-weight: 700;
  color: var(--t3);
  cursor: pointer;
  font-family: inherit;
  transition: all var(--tr);
}
.lwx-yf-btn:hover{ color: var(--blue-mid); }
.lwx-yf-btn.is-active{
  background: var(--card);
  color: var(--blue-dark);
  box-shadow: 0 1px 3px rgba(13,30,48,.08);
}

.lwx-search{
  position: relative;
  flex: 0 0 240px;
}
.lwx-search svg{
  position: absolute; left: .85rem; top: 50%; transform: translateY(-50%);
  width: 14px; height: 14px;
  color: var(--t3);
  pointer-events: none;
}
.lwx-search input{
  width: 100%;
  padding: .55rem .9rem .55rem 2.3rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 4px;
  font-size: .82rem;
  color: var(--t1);
  font-family: inherit;
  transition: border-color var(--tr);
}
.lwx-search input:focus{
  outline: none;
  border-color: var(--blue-mid);
}

/* ── TABLE ── */
.lwx-table{
  background: var(--card);
  border: 1.5px solid var(--bdr);
  border-radius: 6px;
  overflow: hidden;
  box-shadow: var(--shadow-1), var(--shadow-2);
  position: relative;
}

.lwx-thead{
  display: grid;
  grid-template-columns: 90px 110px 1fr 130px 50px;
  gap: 1.2rem;
  padding: .85rem 1.4rem;
  background: linear-gradient(180deg, var(--bg3), var(--bg2));
  border-bottom: 2px solid var(--bdr);
}
.lwx-th{
  font-size: .62rem; font-weight: 800; letter-spacing: 2.4px; text-transform: uppercase;
  color: var(--blue-mid);
}
.lwx-th-num{ text-align: left; }
.lwx-th-act{ text-align: right; }

.lwx-rows{
  list-style: none; padding: 0; margin: 0;
}
.lwx-row{
  border-bottom: 1px solid var(--bdr);
  transition: background var(--tr);
  position: relative;
}
.lwx-row:last-child{ border-bottom: none; }
.lwx-row:nth-child(even){ background: var(--bg3); }

/* Hover effect: gold left bar + zoom */
.lwx-row::before{
  content:'';
  position:absolute; left:0; top:0; bottom:0;
  width: 0;
  background: linear-gradient(180deg, var(--gold), var(--gold-warm));
  transition: width .3s var(--ease);
  z-index: 1;
}
.lwx-row:hover{
  background: var(--accent-g);
}
.lwx-row:hover::before{ width: 4px; }

.lwx-row-link{
  display: grid;
  grid-template-columns: 90px 110px 1fr 130px 50px;
  gap: 1.2rem;
  align-items: center;
  padding: 1.05rem 1.4rem;
  text-decoration: none;
  color: inherit;
  position: relative;
  z-index: 0;
}

/* Cells */
.lwx-cell-num{
  display:flex; align-items: baseline; gap: .25rem;
  font-family: var(--serif);
  font-style: italic; font-weight: 800;
}
.lwx-num-prefix{
  font-size: .7rem; color: var(--blue-mid); font-style: italic;
  vertical-align: super;
}
.lwx-num-val{
  font-size: 1.4rem; line-height: 1;
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -.5px;
}

.lwx-cell-date{
  display:flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center;
  padding: .4rem 0;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 4px;
  min-height: 56px;
  position: relative;
}
.lwx-row:nth-child(even) .lwx-cell-date{ background: var(--bg2); }
.lwx-cell-date::before{
  content:''; position:absolute; top:0; left:0; right:0; height: 4px;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold));
  border-radius: 4px 4px 0 0;
}
.lwx-date-day{
  font-family: var(--serif); font-weight: 800;
  font-size: 1.1rem; color: var(--t1); line-height: 1;
  margin-top: .35rem;
}
.lwx-date-mon{
  font-size: .58rem; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--blue-mid); font-weight: 800; margin-top: .15rem;
}
.lwx-date-year{
  font-size: .6rem; color: var(--t3); margin-top: .1rem; font-weight: 600;
}

.lwx-cell-title{
  display:flex; flex-direction: column; gap: .35rem;
  min-width: 0;
}
.lwx-cat-tag{
  display:inline-flex; align-self: flex-start;
  font-size: .58rem; font-weight: 800; letter-spacing: 1.8px; text-transform: uppercase;
  padding: .15rem .5rem;
  background: var(--accent-g);
  color: var(--blue-mid);
  border-radius: 2px;
}
.lwx-title{
  font-family: var(--serif);
  font-size: .98rem; font-weight: 700; line-height: 1.4;
  color: var(--t1); margin: 0;
  transition: color var(--tr);
}
.lwx-row:hover .lwx-title{ color: var(--blue-dark); }
[data-theme="dark"] .lwx-row:hover .lwx-title{ color: #fff; }
.lwx-doc-no{
  font-size: .7rem; color: var(--t3);
  font-family: var(--serif); font-style: italic; font-weight: 600;
}

.lwx-cell-source{ display: flex; align-items: center; }
.lwx-source-badge{
  display:inline-flex; align-items:center; gap:.4rem;
  padding: .35rem .7rem;
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  color: #fff;
  font-size: .68rem; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase;
  border-radius: 3px;
  box-shadow: 0 2px 6px rgba(201,169,97,.3);
  transition: transform var(--tr), box-shadow var(--tr);
}
.lwx-source-badge svg{ width: 12px; height: 12px; }
.lwx-row:hover .lwx-source-badge{
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(201,169,97,.5);
}

.lwx-cell-act{ display:flex; justify-content: flex-end; }
.lwx-arrow{
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--bg3);
  border: 1px solid var(--bdr);
  display:flex; align-items:center; justify-content:center;
  color: var(--t3);
  transition: all var(--tr);
}
.lwx-arrow svg{ width: 14px; height: 14px; transition: transform var(--tr); }
.lwx-row:hover .lwx-arrow{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  border-color: transparent;
  color: #fff;
  box-shadow: 0 4px 10px rgba(37,99,168,.3);
}
.lwx-row:hover .lwx-arrow svg{ transform: translateX(3px); }

.lwx-empty-msg{
  text-align: center; padding: 3rem 1rem;
  color: var(--t2); font-style: italic;
}

/* ═════════════════════════════════════════
   LAWS — Responsive
═════════════════════════════════════════ */
@media (max-width: 1024px){
  .lwx-thead,
  .lwx-row-link{
    grid-template-columns: 70px 90px 1fr 100px 40px;
    gap: .9rem;
  }
}
@media (max-width: 820px){
  .lwx-hero-row{ grid-template-columns: 1fr; gap: 1.2rem; }
  .lwx-seal{ width: 100px; height: 100px; align-self: flex-start; }
  .lwx-seal-core{ width: 76px; height: 76px; }
  .lwx-seal-num{ font-size: 1.4rem; }

  .lwx-banner{
    grid-template-columns: auto 1fr;
    gap: 1.2rem;
  }
  .lwx-banner-stats{
    grid-column: 1 / -1;
    border-top: 1px dashed var(--bdr);
    padding-top: 1rem;
  }

  .lwx-thead{ display: none; }
  .lwx-row-link{
    grid-template-columns: 60px 1fr;
    grid-template-areas:
      "num date"
      "title title"
      "source action";
    gap: .8rem 1rem;
    padding: 1rem;
  }
  .lwx-cell-num{ grid-area: num; align-self: center; }
  .lwx-cell-date{ grid-area: date; flex-direction: row; gap: .5rem; padding: .35rem .6rem; min-height: auto; align-self: flex-start; }
  .lwx-cell-date::before{ display: none; }
  .lwx-date-day{ margin-top: 0; font-size: 1rem; }
  .lwx-cell-title{ grid-area: title; }
  .lwx-cell-source{ grid-area: source; }
  .lwx-cell-act{ grid-area: action; }
}
@media (max-width: 560px){
  .lwx-banner{ grid-template-columns: 1fr; padding: 1.2rem; }
  .lwx-banner-stamp{ align-self: flex-start; }
  .lwx-banner-stats{ flex-wrap: wrap; gap: 1rem; }
  .lwx-search{ flex: 1 0 100%; }
  .lwx-cats{ overflow-x: auto; flex-wrap: nowrap; }
  .lwx-cat{ flex-shrink: 0; }
}

@media (prefers-reduced-motion: reduce){
  .lwx-seal-ring-1, .lwx-seal-ring-2{ animation: none; }
  .lwx-row, .lwx-row *,
  .lwx-cat{ transition: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   JOURNALS — 3D BOOKSHELF
   Featured 3D book + horizontal scrolling archive shelf
═══════════════════════════════════════════════════════════════════════ */

/* ── HERO ── */
.jrx-hero{
  padding: 2.4rem 0 1.6rem;
  background: linear-gradient(180deg, var(--bg2), var(--bg));
  border-bottom: 1px solid var(--bdr);
}
.jrx-hero .breadcrumb{
  display:flex; align-items:center; gap:.45rem; flex-wrap:wrap;
  font-size:.78rem; color: var(--t3); margin-bottom: 1.2rem;
}
.jrx-hero .breadcrumb a{ color: var(--t2); text-decoration:none; transition: color var(--tr); }
.jrx-hero .breadcrumb a:hover{ color: var(--accent); }
.jrx-hero .breadcrumb svg{ width:11px; height:11px; opacity:.5; }
.jrx-hero .breadcrumb [aria-current]{ color: var(--blue-mid); font-weight:600; }

.jrx-hero-row{
  display:grid; grid-template-columns: 1fr auto;
  gap: 2rem; align-items: end;
}
.jrx-hero-eyebrow{
  font-size:.7rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0 0 .55rem;
}
.jrx-hero-title{
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3.4vw, 2.7rem);
  font-weight: 800; line-height: 1.1; letter-spacing: -1px;
  color: var(--t1); margin: 0;
}
.jrx-hero-sub{
  font-size: .94rem; color: var(--t2); margin:.7rem 0 0;
  max-width: 60ch; line-height: 1.6;
}

.jrx-hero-r{
  display:flex; gap: 1.2rem;
}
.jrx-hero-stat{
  display:flex; flex-direction: column; align-items:center;
  padding: .8rem 1.4rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 8px;
  min-width: 90px;
}
.jrx-hero-stat b{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1.7rem; line-height: 1;
  color: var(--gold-warm); letter-spacing: -.5px;
}
.jrx-hero-stat span{
  font-size: .58rem; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--t3); font-weight: 700; margin-top: .35rem;
}

/* ── FEATURED ISSUE ── */
.jrx-feat-sec{
  padding: 4rem 0 4.5rem;
  background:
    radial-gradient(ellipse at 30% 30%, rgba(201,169,97,.06), transparent 50%),
    radial-gradient(ellipse at 70% 70%, rgba(37,99,168,.06), transparent 50%),
    var(--bg);
  position: relative;
}

.jrx-feat{
  display:grid;
  grid-template-columns: minmax(280px, 360px) 1fr;
  gap: 4rem;
  align-items: center;
}

.jrx-feat-cover-wrap{
  display: flex; justify-content: center; align-items: center;
  perspective: 1600px;
  text-decoration: none;
}

/* ── 3D BOOK ── */
.jrx-book{
  position: relative;
  transform-style: preserve-3d;
  transform: rotateY(-25deg) rotateX(2deg);
  transition: transform .7s var(--ease);
  width: 240px;
  aspect-ratio: 3 / 4;
}
.jrx-book-lg{ width: 320px; }

.jrx-book-cover{
  position: absolute; inset: 0;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  border-radius: 2px 6px 6px 2px;
  overflow: hidden;
  box-shadow:
    0 1px 2px rgba(0,0,0,.15),
    0 12px 30px rgba(13,30,48,.3);
  z-index: 3;
}
.jrx-book-cover img{
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.jrx-book-cover.is-fallback{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
}
.jrx-book-cover.is-fallback img{ display: none; }

.jrx-book-fallback{
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .8rem;
  color: #fff;
  text-align: center;
  padding: 2rem 1.5rem;
}
.jrx-book-fb-letters{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1.6rem; letter-spacing: 4px;
  color: var(--gold);
  border-top: 1.5px solid var(--gold);
  border-bottom: 1.5px solid var(--gold);
  padding: .35rem 1rem;
}
.jrx-book-fb-num{
  font-family: var(--serif);
  font-size: 2.4rem; font-weight: 800; line-height: 1;
}
.jrx-book-fb-time{
  font-size: .68rem; letter-spacing: 2px; text-transform: uppercase;
  font-weight: 600; opacity: .85;
}

/* Book glare/shine effect on the cover */
.jrx-book-glare{
  position: absolute; inset: 0;
  background: linear-gradient(120deg,
    transparent 30%,
    rgba(255,255,255,.15) 50%,
    transparent 70%);
  pointer-events: none;
  z-index: 4;
  opacity: 0;
  transition: opacity .5s var(--ease);
}
.jrx-book-cover::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(0,0,0,.18) 0%, transparent 8%);
  pointer-events: none;
  z-index: 3;
}

/* Spine on the left side (visible due to rotation) */
.jrx-book-spine{
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 28px;
  background: linear-gradient(90deg, var(--spine-c1, var(--blue-dark)), var(--spine-c2, var(--blue-mid)));
  transform: rotateY(-90deg) translateZ(14px);
  transform-origin: left;
  border-radius: 2px 0 0 2px;
  box-shadow: inset -2px 0 6px rgba(0,0,0,.3);
  z-index: 2;
}
.jrx-book-spine::before,
.jrx-book-spine::after{
  content:''; position:absolute; left: 4px; right: 4px;
  height: 1px;
  background: rgba(201,169,97,.6);
}
.jrx-book-spine::before{ top: 12%; }
.jrx-book-spine::after{ bottom: 12%; }

/* Pages stack on the right side (visible at angle) */
.jrx-book-pages{
  position: absolute;
  right: 0; top: 2px; bottom: 2px;
  width: 24px;
  transform: rotateY(90deg) translateZ(12px);
  transform-origin: right;
  background: repeating-linear-gradient(
    90deg,
    #f0e8d6 0px, #f0e8d6 1px,
    #d8d0bc 1px, #d8d0bc 2px
  );
  border-radius: 0 2px 2px 0;
  z-index: 2;
}

.jrx-feat-cover-wrap:hover .jrx-book{
  transform: rotateY(-15deg) rotateX(0deg) translateY(-8px);
}
.jrx-feat-cover-wrap:hover .jrx-book-glare{ opacity: 1; }

/* ── FEATURED INFO ── */
.jrx-feat-body{
  display:flex; flex-direction: column; gap: 1rem;
  align-items: flex-start;
  min-width: 0;
}
.jrx-feat-tag{
  display:inline-flex; align-items:center; gap:.5rem;
  padding: .35rem .85rem;
  background: var(--accent-g);
  border: 1px solid rgba(201,169,97,.3);
  border-radius: 100px;
  font-size: .65rem; font-weight: 800; letter-spacing: 2.2px; text-transform: uppercase;
  color: var(--gold-warm);
}
.jrx-feat-tag-dot{
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 8px rgba(201,169,97,.7);
  animation: jrx-pulse 2s infinite;
}
@keyframes jrx-pulse{ 0%,100%{ opacity:1; transform:scale(1); } 50%{ opacity:.5; transform:scale(.8); } }

.jrx-feat-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 2.6rem; line-height: 1;
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -1.5px;
  margin: 0;
}
.jrx-feat-title{
  font-family: var(--serif);
  font-size: clamp(1.5rem, 2.6vw, 2.1rem);
  font-weight: 800; line-height: 1.2; letter-spacing: -.5px;
  color: var(--t1); margin: 0;
}
.jrx-feat-period{
  font-family: var(--serif); font-style: italic;
  font-size: 1.05rem; color: var(--t2); margin: 0;
}

.jrx-feat-meta{
  list-style: none; padding: 0; margin: 1rem 0 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 1rem;
  width: 100%;
  padding-top: 1rem;
  border-top: 1px dashed var(--bdr);
}
.jrx-feat-meta li{
  display:flex; flex-direction: column;
}
.jrx-feat-meta-lbl{
  font-size: .58rem; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--blue-mid); font-weight: 800; margin-bottom: .25rem;
}
.jrx-feat-meta-val{
  font-family: var(--serif); font-weight: 700;
  font-size: 1.05rem; color: var(--t1);
}

.jrx-feat-cta{
  display:inline-flex; align-items:center; gap: .55rem;
  margin-top: 1rem;
  padding: .9rem 1.6rem;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff;
  font-size: .82rem; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase;
  border-radius: 4px;
  text-decoration: none;
  box-shadow: 0 8px 22px rgba(37,99,168,.28);
  transition: transform var(--tr), box-shadow var(--tr), gap var(--tr);
  position: relative; overflow: hidden;
}
.jrx-feat-cta::before{
  content:''; position:absolute; inset:0;
  background: linear-gradient(120deg, transparent 35%, rgba(255,255,255,.25) 50%, transparent 65%);
  transform: translateX(-120%);
  transition: transform .7s var(--ease);
}
.jrx-feat-cta:hover{
  transform: translateY(-3px);
  box-shadow: 0 14px 32px rgba(37,99,168,.4);
  gap: .8rem;
}
.jrx-feat-cta:hover::before{ transform: translateX(120%); }
.jrx-feat-cta svg{ width: 14px; height: 14px; }

/* ── BOOKSHELF ── */
.jrx-shelf-sec{ padding: 3rem 0 5rem; background: var(--bg); }

.jrx-shelf-head{
  display:flex; justify-content: space-between; align-items: flex-end;
  gap: 1.5rem;
  margin-bottom: 2rem;
  flex-wrap: wrap;
}
.jrx-shelf-eyebrow{
  font-size: .68rem; font-weight: 800; letter-spacing: 2.4px; text-transform: uppercase;
  color: var(--blue-mid); margin: 0 0 .35rem;
}
.jrx-shelf-title{
  font-family: var(--serif); font-style: italic;
  font-size: clamp(1.4rem, 2.5vw, 1.95rem);
  font-weight: 800; color: var(--t1);
  margin: 0; line-height: 1.1;
}
.jrx-shelf-nav{ display: flex; gap: .55rem; }
.jrx-shelf-nav-btn{
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--card);
  border: 1px solid var(--bdr);
  display:flex; align-items:center; justify-content:center;
  color: var(--t1);
  cursor: pointer;
  transition: all var(--tr);
}
.jrx-shelf-nav-btn:hover{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff; border-color: transparent;
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(37,99,168,.25);
}
.jrx-shelf-nav-btn svg{ width: 14px; height: 14px; }

.jrx-shelf{
  position: relative;
  padding: 2.5rem 0 1rem;
}

.jrx-shelf-track{
  display: flex; gap: 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 1.5rem 0.5rem 3rem;
  perspective: 1400px;
  cursor: grab;
  scrollbar-width: thin;
  scrollbar-color: var(--bdr) transparent;
}
.jrx-shelf-track.is-grabbing{ cursor: grabbing; }
.jrx-shelf-track::-webkit-scrollbar{ height: 6px; }
.jrx-shelf-track::-webkit-scrollbar-track{ background: transparent; }
.jrx-shelf-track::-webkit-scrollbar-thumb{ background: var(--bdr); border-radius: 100px; }

/* Shelf base — wooden line */
.jrx-shelf-base{
  position: absolute;
  left: 0; right: 0;
  bottom: 4rem;
  height: 6px;
  background: linear-gradient(90deg, transparent, var(--blue-dark), var(--blue-dark), transparent);
  opacity: .4;
  border-radius: 3px;
  pointer-events: none;
}
.jrx-shelf-base::after{
  content:''; position:absolute; left:5%; right:5%; top: 100%;
  height: 12px;
  background: linear-gradient(180deg, rgba(13,30,48,.18), transparent);
  filter: blur(8px);
}

/* Each book in the shelf */
.jrx-book-item{
  flex: 0 0 auto;
  width: 180px;
  display: flex; flex-direction: column; align-items: center;
  text-decoration: none;
  scroll-snap-align: start;
  user-select: none;
}
.jrx-book-item .jrx-book{
  width: 180px;
  transform: rotateY(-15deg) rotateX(0deg);
  transition: transform .55s var(--ease);
}
.jrx-book-item:hover .jrx-book{
  transform: rotateY(-3deg) translateY(-12px);
}
.jrx-book-item:hover .jrx-book-glare{ opacity: 1; }

.jrx-book-label{
  margin-top: 1rem;
  text-align: center;
  display:flex; flex-direction: column; gap: .2rem;
  width: 100%;
}
.jrx-book-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1rem; color: var(--gold-warm);
  letter-spacing: -.3px;
}
.jrx-book-time{
  font-size: .68rem; color: var(--t3); letter-spacing: 1.2px;
  text-transform: uppercase; font-weight: 600;
}

.jrx-shelf-hint{
  text-align: center;
  font-size: .76rem; color: var(--t3);
  display:inline-flex; align-items:center; gap: .5rem;
  width: 100%; justify-content: center;
  margin-top: .5rem;
  font-style: italic;
}
.jrx-shelf-hint svg{ width: 14px; height: 14px; opacity: .6; }

.jrx-empty{ padding: 3rem 0; text-align: center; color: var(--t2); }

/* ═════════════════════════════════════════
   JOURNALS — Responsive
═════════════════════════════════════════ */
@media (max-width: 980px){
  .jrx-feat{ grid-template-columns: 1fr; gap: 2.5rem; justify-items: center; text-align: left; }
  .jrx-feat-body{ width: 100%; }
  .jrx-hero-row{ grid-template-columns: 1fr; gap: 1.4rem; }
}
@media (max-width: 640px){
  .jrx-book-lg{ width: 240px; }
  .jrx-book-item{ width: 140px; }
  .jrx-book-item .jrx-book{ width: 140px; }
  .jrx-feat-num{ font-size: 2rem; }
  .jrx-shelf-nav{ gap: .35rem; }
  .jrx-shelf-nav-btn{ width: 38px; height: 38px; }
}

@media (prefers-reduced-motion: reduce){
  .jrx-feat-tag-dot{ animation: none; }
  .jrx-book{ transition: none !important; transform: none !important; }
  .jrx-book-spine, .jrx-book-pages{ display: none; }
  .jrx-feat-cta::before{ display: none; }
}

/* ═══════════════════════════════════════════════════════════════════════
   INFOGRAPHICS — BENTO GRID
   Mixed-size cells (Apple-style modular layout) with zoom + reveal effects
═══════════════════════════════════════════════════════════════════════ */

/* ── HERO ── */
.igx-hero{
  padding: 2.6rem 0 2rem;
  background: linear-gradient(135deg, var(--bg2) 0%, var(--bg) 100%);
  border-bottom: 1px solid var(--bdr);
  position: relative;
  overflow: hidden;
}
.igx-hero .breadcrumb{
  display:flex; align-items:center; gap:.45rem; flex-wrap:wrap;
  font-size:.78rem; color: var(--t3); margin-bottom: 1.2rem;
  position: relative; z-index: 2;
}
.igx-hero .breadcrumb a{ color: var(--t2); text-decoration:none; transition: color var(--tr); }
.igx-hero .breadcrumb a:hover{ color: var(--accent); }
.igx-hero .breadcrumb svg{ width:11px; height:11px; opacity:.5; }
.igx-hero .breadcrumb [aria-current]{ color: var(--blue-mid); font-weight:600; }

.igx-hero-row{
  display:grid; grid-template-columns: 1fr auto;
  gap: 2rem; align-items:center;
  position: relative; z-index: 2;
}
.igx-hero-l{ min-width: 0; }
.igx-hero-eyebrow{
  display:inline-flex; align-items:center; gap: .55rem;
  font-size:.7rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0 0 .55rem;
}
.igx-hero-eyebrow-mark{
  width: 8px; height: 8px;
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  border-radius: 2px;
  box-shadow: 0 0 10px rgba(201,169,97,.6);
}
.igx-hero-title{
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3.4vw, 2.7rem);
  font-weight: 800; line-height: 1.1; letter-spacing: -1px;
  color: var(--t1); margin: 0;
}
.igx-hero-sub{
  font-size: .94rem; color: var(--t2); margin:.7rem 0 0;
  max-width: 60ch; line-height: 1.6;
}

/* Decorative cubes on right */
.igx-hero-r{
  position: relative;
  width: 200px; height: 160px;
  flex-shrink: 0;
}
.igx-hero-cube{
  position: absolute;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--blue-mid), var(--blue-dark));
  box-shadow: 0 4px 12px rgba(37,99,168,.18);
  animation: igx-float 6s ease-in-out infinite;
}
.igx-cube-1{ width: 70px; height: 70px; top: 10px; left: 0; animation-delay: 0s; }
.igx-cube-2{
  width: 50px; height: 50px; top: 0; right: 30px;
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  animation-delay: -1.5s;
}
.igx-cube-3{
  width: 40px; height: 40px; bottom: 20px; right: 0;
  background: linear-gradient(135deg, var(--blue-light), var(--blue-pale));
  animation-delay: -3s;
}
.igx-cube-4{
  width: 32px; height: 32px; bottom: 0; left: 50px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  animation-delay: -2.2s;
}
.igx-cube-5{
  width: 26px; height: 26px; top: 50px; left: 110px;
  border-radius: 4px;
  background: var(--card);
  border: 2px solid var(--gold);
  animation-delay: -4s;
}
@keyframes igx-float{
  0%, 100%{ transform: translateY(0) rotate(0deg); }
  50%{ transform: translateY(-10px) rotate(8deg); }
}

.igx-hero-count{
  position: absolute;
  inset: auto 0 30px auto;
  width: 90px; height: 90px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  box-shadow: 0 12px 30px rgba(37,99,168,.3);
  z-index: 2;
}
.igx-hero-count-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1.7rem; line-height: 1; color: var(--gold);
  letter-spacing: -1px;
}
.igx-hero-count-lbl{
  font-size: .55rem; letter-spacing: 1.5px; text-transform: uppercase;
  font-weight: 700; opacity: .85; margin-top: .25rem; text-align: center;
  padding: 0 .25rem; line-height: 1.2;
}

/* ── BENTO GRID ── */
.igx-bento-sec{ padding: 3rem 0 5rem; background: var(--bg); }

.igx-bento{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 220px;
  grid-auto-flow: dense;
  gap: 1.2rem;
}

.igx-cell{
  position: relative;
  display: flex;
  border-radius: 14px;
  overflow: hidden;
  background: var(--card);
  border: 1px solid var(--bdr);
  text-decoration: none;
  color: inherit;
  transition: transform .45s var(--ease), box-shadow .45s var(--ease), border-color .35s;
  isolation: isolate;
}
.igx-cell:hover{
  transform: translateY(-4px);
  border-color: var(--gold);
  box-shadow: 0 22px 50px rgba(13,30,48,.16);
}

/* Default cell (1x1): image top, body bottom */
.igx-cell{
  flex-direction: column;
}
.igx-cell-img{
  position: relative;
  flex: 1 1 60%;
  background: linear-gradient(135deg, var(--bg3), var(--bg2));
  overflow: hidden;
}
.igx-cell-img img{
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .8s var(--ease), filter .35s;
}
.igx-cell:hover .igx-cell-img img{ transform: scale(1.06); filter: saturate(1.1); }
.igx-cell-img::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, transparent 60%, rgba(13,30,48,.4));
  pointer-events:none; opacity: 0;
  transition: opacity .35s var(--ease);
}
.igx-cell:hover .igx-cell-img::after{ opacity: 1; }

.igx-cell-ph{
  position: absolute; inset: 0;
  display:flex; align-items:center; justify-content:center;
  color: rgba(37,99,168,.25);
}
.igx-cell-ph svg{ width: 56px; height: 56px; }

.igx-cell-num{
  position: absolute; top: .8rem; left: .8rem; z-index: 2;
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1rem;
  padding: .25rem .55rem;
  background: rgba(255,255,255,.95);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border-radius: 4px;
  color: var(--gold-warm);
  letter-spacing: -.3px;
  box-shadow: 0 2px 8px rgba(13,30,48,.15);
}

.igx-cell-zoom{
  position: absolute; top: .8rem; right: .8rem; z-index: 2;
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(255,255,255,.95);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center;
  color: var(--blue-dark);
  box-shadow: 0 2px 8px rgba(13,30,48,.15);
  opacity: 0; transform: translateY(-8px);
  transition: opacity .35s var(--ease), transform .35s var(--ease);
}
.igx-cell:hover .igx-cell-zoom{ opacity: 1; transform: translateY(0); }
.igx-cell-zoom svg{ width: 14px; height: 14px; transition: transform .3s var(--ease); }
.igx-cell:hover .igx-cell-zoom svg{ transform: rotate(45deg); }

.igx-cell-body{
  display: flex; flex-direction: column; gap: .4rem;
  padding: .9rem 1rem 1rem;
  position: relative; z-index: 1;
  background: var(--card);
}
.igx-cell-tag{
  font-size: .58rem; font-weight: 800; letter-spacing: 2px; text-transform: uppercase;
  color: var(--blue-mid);
}
.igx-cell-title{
  font-family: var(--serif);
  font-size: .94rem; font-weight: 700; line-height: 1.35;
  color: var(--t1); margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2; line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color var(--tr);
}
.igx-cell:hover .igx-cell-title{ color: var(--blue-mid); }
.igx-cell-cta{
  display:inline-flex; align-items:center; gap: .35rem;
  font-size: .68rem; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase;
  color: var(--gold-warm);
  margin-top: auto;
  transition: gap var(--tr);
}
.igx-cell-cta svg{ width: 11px; height: 11px; transition: transform var(--tr); }
.igx-cell:hover .igx-cell-cta{ gap: .55rem; }
.igx-cell:hover .igx-cell-cta svg{ transform: translateX(3px); }

/* HERO cell — 2x2 with body overlaid on image */
.igx-cell.is-hero{
  grid-column: span 2; grid-row: span 2;
}
.igx-cell.is-hero .igx-cell-img{
  position: absolute; inset: 0; flex: none;
}
.igx-cell.is-hero .igx-cell-img::after{
  background: linear-gradient(180deg, transparent 30%, rgba(13,30,48,.85));
  opacity: 1;
}
.igx-cell.is-hero .igx-cell-body{
  position: relative; z-index: 2;
  margin-top: auto;
  background: transparent;
  padding: 1.6rem 1.8rem 1.6rem;
  color: #fff;
}
.igx-cell.is-hero .igx-cell-tag{
  color: var(--gold);
  display:inline-flex; align-items:center; gap:.4rem;
  background: rgba(255,255,255,.12);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  padding: .3rem .65rem;
  border-radius: 100px;
  align-self: flex-start;
}
.igx-cell.is-hero .igx-cell-title{
  font-size: clamp(1.3rem, 2vw, 1.7rem);
  font-weight: 800;
  -webkit-line-clamp: 4; line-clamp: 4;
  color: #fff !important;
  letter-spacing: -.4px;
}
.igx-cell.is-hero .igx-cell-cta{ color: var(--gold); }
.igx-cell.is-hero .igx-cell-num{
  font-size: 1.2rem;
  background: rgba(0,0,0,.4);
  color: var(--gold);
  border: 1px solid rgba(255,255,255,.2);
}

/* WIDE cell — 2x1 (horizontal) */
.igx-cell.is-wide{
  grid-column: span 2;
  flex-direction: row;
}
.igx-cell.is-wide .igx-cell-img{
  flex: 0 0 50%; height: 100%;
}
.igx-cell.is-wide .igx-cell-body{
  flex: 1; justify-content: center;
  padding: 1.2rem 1.4rem;
}
.igx-cell.is-wide .igx-cell-title{
  font-size: 1.05rem;
  -webkit-line-clamp: 3; line-clamp: 3;
}

/* TALL cell — 1x2 (vertical, taller) */
.igx-cell.is-tall{
  grid-row: span 2;
}
.igx-cell.is-tall .igx-cell-img{ flex: 1 1 75%; }
.igx-cell.is-tall .igx-cell-title{
  -webkit-line-clamp: 3; line-clamp: 3;
}

/* ═════════════════════════════════════════
   INFOGRAPHICS — Responsive
═════════════════════════════════════════ */
@media (max-width: 1100px){
  .igx-bento{ grid-template-columns: repeat(3, 1fr); }
  .igx-cell.is-hero{ grid-column: span 2; grid-row: span 2; }
  .igx-cell.is-wide{ grid-column: span 2; }
}
@media (max-width: 820px){
  .igx-bento{ grid-template-columns: repeat(2, 1fr); grid-auto-rows: 200px; }
  .igx-cell.is-hero{ grid-column: span 2; grid-row: span 2; }
  .igx-cell.is-wide{ grid-column: span 2; flex-direction: column; }
  .igx-cell.is-wide .igx-cell-img{ flex: 1 1 60%; }
  .igx-cell.is-tall{ grid-row: span 1; }

  .igx-hero-row{ grid-template-columns: 1fr; }
  .igx-hero-r{ display: none; }
}
@media (max-width: 540px){
  .igx-bento{ grid-template-columns: 1fr; grid-auto-rows: 240px; }
  .igx-cell.is-hero, .igx-cell.is-wide, .igx-cell.is-tall{ grid-column: auto; grid-row: auto; }
  .igx-cell.is-hero{ grid-row: span 2; }
}

@media (prefers-reduced-motion: reduce){
  .igx-hero-cube{ animation: none; }
  .igx-cell, .igx-cell *{ transition: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   PHOTOS — PINTEREST MOSAIC + KEN BURNS
   CSS columns masonry with framed photos and slow-zoom hover
═══════════════════════════════════════════════════════════════════════ */

/* ── HERO ── */
.phx-hero{
  padding: 2.4rem 0 2rem;
  background: linear-gradient(180deg, var(--bg2), var(--bg));
  border-bottom: 1px solid var(--bdr);
}
.phx-hero .breadcrumb{
  display:flex; align-items:center; gap:.45rem; flex-wrap:wrap;
  font-size:.78rem; color: var(--t3); margin-bottom: 1.2rem;
}
.phx-hero .breadcrumb a{ color: var(--t2); text-decoration:none; transition: color var(--tr); }
.phx-hero .breadcrumb a:hover{ color: var(--accent); }
.phx-hero .breadcrumb svg{ width:11px; height:11px; opacity:.5; }
.phx-hero .breadcrumb [aria-current]{ color: var(--blue-mid); font-weight:600; }

.phx-hero-row{
  display:grid; grid-template-columns: 1fr auto;
  gap: 2rem; align-items:center;
}
.phx-hero-eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.7rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0 0 .55rem;
}
.phx-hero-aperture{
  width: 24px; height: 24px;
  display:flex; align-items:center; justify-content:center;
  color: var(--gold-warm);
  animation: phx-spin 12s linear infinite;
}
.phx-hero-aperture svg{ width:18px; height:18px; }
@keyframes phx-spin{ to{ transform: rotate(360deg); } }

.phx-hero-title{
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3.2vw, 2.6rem);
  font-weight: 800; line-height: 1.1; letter-spacing: -1px;
  color: var(--t1); margin: 0;
}
.phx-hero-sub{
  font-size: .94rem; color: var(--t2); margin:.7rem 0 0;
  max-width: 60ch; line-height: 1.6;
}
.phx-hero-tags{
  display:flex; gap:.5rem; flex-wrap: wrap; margin-top: 1rem;
}
.phx-hero-tag{
  display:inline-flex; align-items:center;
  padding: .3rem .8rem;
  border: 1px solid var(--bdr);
  border-radius: 100px;
  font-size: .7rem; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase;
  color: var(--t2);
  background: var(--card);
}

/* Decorative film strip */
.phx-hero-r{
  flex-shrink: 0;
}
.phx-filmstrip{
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  padding: 12px 8px;
  background: #1a1a1a;
  border-radius: 4px;
  width: 240px;
  position: relative;
}
.phx-filmstrip::before,
.phx-filmstrip::after{
  content:'';
  position: absolute; left: 0; right: 0;
  height: 8px;
  background-image:
    repeating-linear-gradient(90deg, transparent 0 8px, rgba(255,255,255,.4) 8px 14px);
}
.phx-filmstrip::before{ top: 2px; }
.phx-filmstrip::after{ bottom: 2px; }

.phx-film-cell{
  aspect-ratio: 1;
  background: #2a2a2a;
  border-radius: 2px;
  overflow: hidden;
}
.phx-film-cell img{
  width: 100%; height: 100%; object-fit: cover;
  filter: saturate(.85) contrast(.95);
}

/* ── GALLERY ── */
.phx-gallery-sec{ padding: 3.5rem 0 5rem; background: var(--bg); }

.phx-gallery-head{
  position: relative;
  text-align: center;
  padding: 1.4rem;
  border: 1px solid var(--bdr);
  margin-bottom: 2.5rem;
  background: var(--card);
}
.phx-gallery-corner{
  position: absolute;
  width: 18px; height: 18px;
  border: 2px solid var(--gold);
}
.phx-corner-tl{ top: -2px; left: -2px; border-right: none; border-bottom: none; }
.phx-corner-tr{ top: -2px; right: -2px; border-left: none; border-bottom: none; }
.phx-corner-bl{ bottom: -2px; left: -2px; border-right: none; border-top: none; }
.phx-corner-br{ bottom: -2px; right: -2px; border-left: none; border-top: none; }

.phx-gallery-eyebrow{
  font-size:.66rem; font-weight: 800; letter-spacing: 3px; text-transform: uppercase;
  color: var(--blue-mid); margin: 0 0 .35rem;
}
.phx-gallery-title{
  font-family: var(--serif); font-style: italic;
  font-size: clamp(1.4rem, 2.5vw, 1.85rem); font-weight: 800;
  color: var(--t1); margin: 0; line-height: 1.1;
}

/* ── MOSAIC (CSS columns masonry) ── */
.phx-mosaic{
  column-count: 4;
  column-gap: 1.2rem;
}
@media (max-width: 1100px){ .phx-mosaic{ column-count: 3; } }
@media (max-width: 760px){  .phx-mosaic{ column-count: 2; } }
@media (max-width: 460px){  .phx-mosaic{ column-count: 1; } }

.phx-tile{
  display: block;
  position: relative;
  margin: 0 0 1.2rem;
  break-inside: avoid;
  page-break-inside: avoid;
  text-decoration: none;
  color: inherit;
  isolation: isolate;
}

.phx-tile-frame{
  position: relative;
  background: #fff;
  padding: 8px 8px 36px;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow:
    0 2px 6px rgba(13,30,48,.08),
    0 12px 28px rgba(13,30,48,.12);
  overflow: hidden;
  transition: transform .55s var(--ease), box-shadow .55s var(--ease), border-color .35s;
}
[data-theme="dark"] .phx-tile-frame{
  background: var(--card); border-color: var(--bdr);
}

.phx-tile:hover .phx-tile-frame{
  transform: translateY(-6px) rotate(-.4deg);
  box-shadow:
    0 4px 10px rgba(13,30,48,.1),
    0 28px 56px rgba(201,169,97,.18);
  border-color: var(--gold);
}

/* Inner gold thread border */
.phx-tile-frame::before{
  content:''; position: absolute;
  top: 6px; left: 6px; right: 6px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity: .4;
  z-index: 2;
}
.phx-tile-frame::after{
  content:''; position: absolute;
  bottom: 34px; left: 6px; right: 6px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity: .4;
  z-index: 2;
}

.phx-tile-img{
  width: 100%; height: auto; display: block;
  object-fit: cover;
  transition: transform 8s linear, filter .4s var(--ease);
  filter: saturate(.95);
}
.phx-tile:hover .phx-tile-img{
  transform: scale(1.08);
  filter: saturate(1.1);
}

.phx-tile-num{
  position: absolute; top: 14px; left: 14px;
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1rem;
  padding: .25rem .55rem;
  background: rgba(255,255,255,.95);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border-radius: 2px;
  color: var(--gold-warm);
  letter-spacing: -.3px;
  z-index: 3;
  box-shadow: 0 2px 6px rgba(13,30,48,.18);
  opacity: .9;
}

/* Caption (below frame) */
.phx-tile-cap{
  position: absolute;
  bottom: 8px; left: 8px; right: 8px;
  height: 26px;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 .35rem;
  font-family: var(--serif);
  pointer-events: none;
}
.phx-tile-cap-inner{
  flex: 1; min-width: 0;
  overflow: hidden;
}
.phx-tile-title{
  font-family: var(--serif); font-style: italic;
  font-size: .82rem; font-weight: 700; line-height: 1;
  color: var(--t1); margin: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.phx-tile-note{
  display: none;
  font-size: .68rem; color: var(--t3);
}

.phx-tile-zoom{
  width: 24px; height: 24px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  flex-shrink: 0;
  opacity: 0; transform: scale(.6) rotate(-90deg);
  transition: opacity .35s var(--ease), transform .35s var(--ease);
}
.phx-tile-zoom svg{ width: 12px; height: 12px; }
.phx-tile:hover .phx-tile-zoom{ opacity: 1; transform: scale(1) rotate(0); }

/* ═════════════════════════════════════════
   PHOTOS — Responsive
═════════════════════════════════════════ */
@media (max-width: 820px){
  .phx-hero-row{ grid-template-columns: 1fr; gap: 1.4rem; }
  .phx-hero-r{ display: none; }
}

@media (prefers-reduced-motion: reduce){
  .phx-hero-aperture{ animation: none; }
  .phx-tile-frame, .phx-tile-img,
  .phx-tile-zoom{ transition: none !important; }
  .phx-tile:hover .phx-tile-frame{ transform: none; }
  .phx-tile:hover .phx-tile-img{ transform: none; }
}

/* ═══════════════════════════════════════════════════════════════════════
   VIDEOS — CINEMATIC NETFLIX-STYLE
   Dark spotlight + horizontal row carousels + tile grid
═══════════════════════════════════════════════════════════════════════ */

.vdx-hero{
  padding: 2.4rem 0 1.6rem;
  background:
    radial-gradient(ellipse at 30% 50%, rgba(37,99,168,.12), transparent 50%),
    radial-gradient(ellipse at 80% 50%, rgba(201,169,97,.08), transparent 50%),
    var(--bg2);
  border-bottom: 1px solid var(--bdr);
  position: relative;
}

.vdx-breadcrumb{
  display:flex; align-items:center; gap:.45rem; flex-wrap:wrap;
  font-size:.78rem; color: var(--t3); margin-bottom: 1.2rem;
}
.vdx-breadcrumb a{ color: var(--t2); text-decoration:none; transition: color var(--tr); }
.vdx-breadcrumb a:hover{ color: var(--accent); }
.vdx-breadcrumb svg{ width:11px; height:11px; opacity:.5; }
.vdx-breadcrumb [aria-current]{ color: var(--blue-mid); font-weight:600; }

.vdx-hero-content{
  max-width: 720px;
}
.vdx-hero-eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.7rem; font-weight: 800; letter-spacing: 3px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0 0 .5rem;
}
.vdx-rec-dot{
  width: 9px; height: 9px; border-radius: 50%;
  background: #e74c3c;
  box-shadow: 0 0 12px rgba(231,76,60,.7);
  animation: vdx-rec 1.6s infinite;
}
@keyframes vdx-rec{ 0%,100%{ opacity:1; } 50%{ opacity:.3; } }

.vdx-hero-title{
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3.4vw, 2.8rem);
  font-weight: 800; line-height: 1.1; letter-spacing: -1px;
  color: var(--t1); margin: 0;
}
.vdx-hero-sub{
  font-size: .94rem; color: var(--t2); margin:.7rem 0 1.2rem;
  line-height: 1.6;
}
.vdx-hero-stats{
  display:flex; gap: 1rem; flex-wrap: wrap;
}
.vdx-stat{
  display:flex; flex-direction: column;
  padding: .55rem 1rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 6px;
  min-width: 80px;
}
.vdx-stat b{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1.3rem; line-height: 1;
  color: var(--gold-warm); letter-spacing: -.3px;
}
.vdx-stat span{
  font-size: .58rem; letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--t3); font-weight: 700; margin-top: .3rem;
}

/* ── SPOTLIGHT ── */
.vdx-spotlight-sec{ padding: 2.5rem 0; background: var(--bg); }

.vdx-spotlight{
  display: block;
  position: relative;
  width: 100%;
  aspect-ratio: 21 / 9;
  border-radius: 6px;
  overflow: hidden;
  background: #0a0a0a;
  border: none;
  cursor: pointer;
  isolation: isolate;
  box-shadow:
    0 1px 3px rgba(0,0,0,.2),
    0 18px 50px rgba(13,30,48,.35);
  font-family: inherit;
  padding: 0;
}
.vdx-spot-bg{
  position: absolute; inset: 0;
  background-image: var(--bg-img);
  background-size: cover;
  background-position: center;
  filter: saturate(.85) contrast(1.05);
  transition: transform 1.2s var(--ease), filter .5s var(--ease);
  z-index: 0;
}
.vdx-spotlight:hover .vdx-spot-bg{
  transform: scale(1.04);
  filter: saturate(1) contrast(1.08);
}
.vdx-spotlight::before{
  content:''; position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(180deg, rgba(0,0,0,.2) 0%, transparent 30%, transparent 60%, rgba(0,0,0,.85) 100%),
    linear-gradient(90deg, rgba(0,0,0,.6) 0%, transparent 50%);
  pointer-events: none;
}

.vdx-spot-inner{
  position: relative; z-index: 2;
  padding: clamp(1.4rem, 3vw, 2.6rem);
  height: 100%;
  display: flex; flex-direction: column; justify-content: flex-end;
  color: #fff;
}

.vdx-spot-badge{
  display:inline-flex; align-items:center; gap: .55rem;
  align-self: flex-start;
  padding: .35rem .85rem;
  background: rgba(255,255,255,.12);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 100px;
  font-size: .65rem; font-weight: 800; letter-spacing: 2.2px; text-transform: uppercase;
  margin-bottom: .9rem;
}
.vdx-spot-badge-dot{
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 8px rgba(201,169,97,.7);
}

.vdx-spot-title{
  font-family: var(--serif);
  font-size: clamp(1.4rem, 3vw, 2.4rem);
  font-weight: 800; line-height: 1.15; letter-spacing: -.5px;
  color: #fff; margin: 0 0 1.2rem;
  max-width: 60%;
}
@media (max-width:720px){ .vdx-spot-title{ max-width: 100%; } }

.vdx-spot-cta{
  display: inline-flex; align-items: center; gap: .8rem;
  align-self: flex-start;
}
.vdx-spot-play{
  width: 56px; height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  color: #fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 12px 28px rgba(201,169,97,.45);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease);
  position: relative;
}
.vdx-spot-play::before{
  content:''; position:absolute; inset: -8px;
  border-radius: 50%;
  border: 2px solid rgba(201,169,97,.4);
  animation: vdx-pulse 2s infinite;
}
@keyframes vdx-pulse{
  0%{ transform: scale(.9); opacity:1; }
  100%{ transform: scale(1.4); opacity:0; }
}
.vdx-spot-play svg{ width: 22px; height: 22px; margin-left: 3px; }
.vdx-spotlight:hover .vdx-spot-play{ transform: scale(1.1); }
.vdx-spot-cta-text{
  font-size: .8rem; font-weight: 800; letter-spacing: 1.6px; text-transform: uppercase;
  color: #fff;
}

/* Cinema corners */
.vdx-spot-corner{
  position: absolute;
  width: 28px; height: 28px;
  border: 2px solid var(--gold);
  z-index: 2;
}
.vdx-corner-tl{ top: 14px; left: 14px; border-right: none; border-bottom: none; }
.vdx-corner-tr{ top: 14px; right: 14px; border-left: none; border-bottom: none; }
.vdx-corner-bl{ bottom: 14px; left: 14px; border-right: none; border-top: none; }
.vdx-corner-br{ bottom: 14px; right: 14px; border-left: none; border-top: none; }

/* ── ROW SECTIONS ── */
.vdx-row-sec, .vdx-grid-sec{ padding: 2.5rem 0; background: var(--bg); }
.vdx-grid-sec{ padding-bottom: 5rem; }

.vdx-row-head{
  display:flex; align-items: flex-end; gap: 1rem;
  margin-bottom: 1.5rem;
  flex-wrap: wrap;
}
.vdx-row-eyebrow{
  font-size: .68rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--blue-mid); margin: 0;
}
.vdx-row-title{
  font-family: var(--serif); font-style: italic;
  font-size: clamp(1.4rem, 2.5vw, 1.85rem); font-weight: 800;
  color: var(--t1); margin: 0; line-height: 1;
  flex: 1;
  position: relative;
  padding-right: 1rem;
  border-right: 4px solid transparent;
}
.vdx-row-eyebrow + .vdx-row-title{
  flex: 0 1 auto;
}

.vdx-row-nav{ display:flex; gap: .4rem; }
.vdx-row-btn{
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--card);
  border: 1px solid var(--bdr);
  display:flex; align-items:center; justify-content:center;
  color: var(--t1);
  cursor: pointer;
  transition: all var(--tr);
}
.vdx-row-btn:hover{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff; border-color: transparent;
}
.vdx-row-btn svg{ width: 13px; height: 13px; }

/* Horizontal row of tiles */
.vdx-row{
  overflow: hidden;
  position: relative;
}
.vdx-row-track{
  display: flex; gap: 1.1rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 0 .5rem 1rem;
  margin: 0 -.5rem;
  cursor: grab;
  scrollbar-width: thin;
}
.vdx-row-track.is-grabbing{ cursor: grabbing; }
.vdx-row-track::-webkit-scrollbar{ height: 4px; }
.vdx-row-track::-webkit-scrollbar-thumb{ background: var(--bdr); border-radius: 100px; }

.vdx-row-track .vdx-tile{
  flex: 0 0 280px;
  scroll-snap-align: start;
}

/* TILE — cinematic card */
.vdx-tile{
  display: block;
  background: transparent;
  border: none;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  padding: 0;
  user-select: none;
}

.vdx-tile-thumb{
  position: relative;
  aspect-ratio: 16 / 9;
  border-radius: 6px;
  overflow: hidden;
  background: linear-gradient(135deg, #0a0a0a, #1a1a1a);
  border: 1px solid var(--bdr);
  isolation: isolate;
  transition: transform .4s var(--ease), border-color .35s, box-shadow .4s;
}
.vdx-tile-thumb img{
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .6s var(--ease), filter .35s;
  filter: saturate(.9) brightness(.92);
}
.vdx-tile:hover .vdx-tile-thumb{
  transform: translateY(-4px) scale(1.02);
  border-color: var(--gold);
  box-shadow: 0 18px 38px rgba(13,30,48,.25), 0 0 0 1px rgba(201,169,97,.3);
}
.vdx-tile:hover .vdx-tile-thumb img{
  transform: scale(1.06);
  filter: saturate(1.1) brightness(1.05);
}

/* Cinematic black bars top + bottom (subtle) */
.vdx-tile-grade{
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(180deg, rgba(0,0,0,.5) 0%, transparent 18%, transparent 82%, rgba(0,0,0,.5) 100%);
  pointer-events: none;
}

.vdx-tile-play{
  position: absolute;
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 56px; height: 56px;
  border-radius: 50%;
  background: rgba(255,255,255,.95);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  color: var(--blue-dark);
  z-index: 2;
  box-shadow: 0 8px 22px rgba(0,0,0,.4);
  transition: transform .35s var(--ease), background .3s;
}
.vdx-tile-play svg{ width: 18px; height: 18px; margin-left: 2px; }
.vdx-tile:hover .vdx-tile-play{
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  color: #fff;
  transform: translate(-50%, -50%) scale(1.1);
}

/* Timecode label (decorative) */
.vdx-tile-tc{
  position: absolute;
  bottom: 8px; right: 10px;
  font-family: var(--sans);
  font-size: .65rem; font-weight: 700; letter-spacing: .5px;
  color: var(--gold);
  z-index: 2;
  padding: .15rem .4rem;
  background: rgba(0,0,0,.55);
  border-radius: 2px;
  pointer-events: none;
}

.vdx-tile-meta{
  display:flex; align-items:center; gap: .55rem;
  margin-top: .65rem;
  font-size: .7rem;
  color: var(--t3);
  font-weight: 700;
}
.vdx-tile-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  color: var(--gold-warm);
  font-size: .85rem;
}
.vdx-tile-dot{
  width: 3px; height: 3px; border-radius: 50%;
  background: var(--t3);
}
.vdx-tile-yt{
  letter-spacing: 1px; text-transform: uppercase;
  font-size: .62rem; font-weight: 700;
}

/* ── GRID ── */
.vdx-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.4rem;
}

.vdx-empty{ padding: 3rem 0; text-align: center; color: var(--t2); }

/* ═════════════════════════════════════════
   VIDEOS — Responsive
═════════════════════════════════════════ */
@media (max-width: 820px){
  .vdx-spotlight{ aspect-ratio: 16 / 9; }
  .vdx-spot-corner{ width: 18px; height: 18px; }
  .vdx-row-track .vdx-tile{ flex: 0 0 240px; }
  .vdx-row-head{ gap: .6rem; }
}
@media (max-width: 560px){
  .vdx-row-track .vdx-tile{ flex: 0 0 75%; }
  .vdx-grid{ grid-template-columns: 1fr; }
  .vdx-spot-play{ width: 46px; height: 46px; }
  .vdx-spot-play svg{ width: 18px; height: 18px; }
}

@media (prefers-reduced-motion: reduce){
  .vdx-rec-dot{ animation: none; }
  .vdx-spot-play::before{ animation: none; }
  .vdx-tile, .vdx-tile *,
  .vdx-spotlight, .vdx-spotlight *{ transition: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   CONTACTS — GLASSMORPHISM + MAP
   Interactive map background + floating glass info cards + glass form
═══════════════════════════════════════════════════════════════════════ */

/* ── HERO ── */
.ctx-hero{
  padding: 2.4rem 0 2rem;
  background:
    radial-gradient(ellipse at 20% 50%, rgba(37,99,168,.08), transparent 50%),
    radial-gradient(ellipse at 80% 50%, rgba(201,169,97,.06), transparent 50%),
    var(--bg2);
  border-bottom: 1px solid var(--bdr);
}
.ctx-hero .breadcrumb{
  display:flex; align-items:center; gap:.45rem; flex-wrap:wrap;
  font-size:.78rem; color: var(--t3); margin-bottom: 1.2rem;
}
.ctx-hero .breadcrumb a{ color: var(--t2); text-decoration:none; transition: color var(--tr); }
.ctx-hero .breadcrumb a:hover{ color: var(--accent); }
.ctx-hero .breadcrumb svg{ width:11px; height:11px; opacity:.5; }
.ctx-hero .breadcrumb [aria-current]{ color: var(--blue-mid); font-weight:600; }

.ctx-hero-row{
  display:grid; grid-template-columns: 1fr auto;
  gap: 2rem; align-items:center;
}
.ctx-hero-eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.7rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0 0 .55rem;
}
.ctx-hero-pin{
  width: 22px; height: 22px;
  display:flex; align-items:center; justify-content:center;
  color: var(--gold-warm);
  animation: ctx-bounce 2s infinite;
}
.ctx-hero-pin svg{ width:18px; height:18px; }
@keyframes ctx-bounce{
  0%, 100%{ transform: translateY(0); }
  50%{ transform: translateY(-4px); }
}

.ctx-hero-title{
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3.2vw, 2.6rem);
  font-weight: 800; line-height: 1.1; letter-spacing: -1px;
  color: var(--t1); margin: 0;
}
.ctx-hero-sub{
  font-size: .94rem; color: var(--t2); margin:.7rem 0 0;
  max-width: 65ch; line-height: 1.6;
}

/* Decorative radar */
.ctx-hero-r{ flex-shrink: 0; }
.ctx-radar{
  position: relative;
  width: 140px; height: 140px;
  display:flex; align-items:center; justify-content:center;
}
.ctx-radar-ring{
  position:absolute; inset: 0;
  border-radius: 50%;
  border: 1.5px solid rgba(37,99,168,.4);
  animation: ctx-radar 3s infinite;
}
.ctx-r1{ animation-delay: 0s; }
.ctx-r2{ animation-delay: -1s; }
.ctx-r3{ animation-delay: -2s; }
@keyframes ctx-radar{
  0%{ transform: scale(.3); opacity: 1; border-color: var(--gold); }
  100%{ transform: scale(1); opacity: 0; border-color: var(--blue-mid); }
}
.ctx-radar-core{
  position: relative; z-index: 2;
  width: 56px; height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: var(--gold);
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 8px 22px rgba(37,99,168,.3);
}
.ctx-radar-core svg{ width: 24px; height: 24px; }

/* ── STAGE (map + content) ── */
.ctx-stage-sec{ padding: 0; background: var(--bg); }
.ctx-stage{
  position: relative;
  min-height: 760px;
  isolation: isolate;
}

/* Map background */
.ctx-map{
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
.ctx-map iframe{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  border: none;
  filter: contrast(.95) saturate(.85) brightness(.96);
}
[data-theme="dark"] .ctx-map iframe{
  filter: contrast(1.1) saturate(.4) brightness(.45) invert(.92) hue-rotate(180deg);
}
.ctx-map-mask{
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(7,18,30,0) 0%, rgba(7,18,30,.05) 50%, var(--bg) 100%),
    linear-gradient(90deg, var(--bg) 0%, rgba(7,18,30,0) 30%, rgba(7,18,30,0) 70%, var(--bg) 100%);
  pointer-events: none;
}
[data-theme="light"] .ctx-map-mask{
  background:
    linear-gradient(180deg, rgba(240,247,253,0) 0%, rgba(240,247,253,.1) 50%, var(--bg) 100%),
    linear-gradient(90deg, var(--bg) 0%, rgba(240,247,253,0) 25%, rgba(240,247,253,0) 75%, var(--bg) 100%);
}

/* Glass grid above map */
.ctx-grid{
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(0, 1.5fr);
  gap: 2rem;
  padding: 4rem 0 5rem;
  align-items: start;
}

/* ── INFO PANEL (glass cards stack) ── */
.ctx-info{
  display:flex; flex-direction: column; gap: 1rem;
}

.ctx-info-head{
  padding: 1.5rem 1.6rem;
  background: rgba(255,255,255,.65);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
          backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(255,255,255,.6);
  border-radius: 14px;
  box-shadow: 0 12px 36px rgba(13,30,48,.12), inset 0 1px 0 rgba(255,255,255,.7);
  position: relative; isolation: isolate;
}
[data-theme="dark"] .ctx-info-head{
  background: rgba(15,32,53,.65);
  border-color: rgba(126,200,245,.18);
  box-shadow: 0 12px 36px rgba(0,0,0,.4);
}
.ctx-info-head::before{
  content:''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--gold-warm), var(--gold), var(--blue-mid));
  border-radius: 14px 14px 0 0;
}

.ctx-info-eyebrow{
  font-size: .68rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0 0 .35rem;
}
.ctx-info-title{
  font-family: var(--serif);
  font-size: 1.3rem; font-weight: 800; line-height: 1.2;
  color: var(--t1); margin: 0 0 .65rem;
  letter-spacing: -.3px;
}
.ctx-info-sub{
  font-size: .88rem; color: var(--t2); line-height: 1.55;
  margin: 0;
}

.ctx-cards{
  list-style: none; padding: 0; margin: 0;
  display:flex; flex-direction: column; gap: .7rem;
}

.ctx-card{
  display: grid; grid-template-columns: 48px 1fr;
  gap: 1rem;
  align-items: center;
  padding: 1.05rem 1.2rem;
  background: rgba(255,255,255,.7);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
          backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 12px;
  box-shadow: 0 8px 28px rgba(13,30,48,.1);
  transition: transform var(--tr), box-shadow var(--tr), border-color .35s;
  position: relative; overflow: hidden;
}
[data-theme="dark"] .ctx-card{
  background: rgba(15,32,53,.6);
  border-color: rgba(126,200,245,.15);
  box-shadow: 0 8px 28px rgba(0,0,0,.3);
}
.ctx-card:hover{
  transform: translateY(-3px) translateX(4px);
  border-color: rgba(201,169,97,.5);
  box-shadow: 0 16px 40px rgba(201,169,97,.18);
}
.ctx-card::before{
  content:''; position:absolute; left: 0; top: 0; bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--gold), var(--gold-warm));
  transform: scaleY(0); transform-origin: top;
  transition: transform .35s var(--ease);
}
.ctx-card:hover::before{ transform: scaleY(1); }

.ctx-card-ico{
  width: 48px; height: 48px; border-radius: 12px;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: var(--gold);
  display:flex; align-items:center; justify-content:center;
  flex-shrink: 0;
  box-shadow: 0 6px 14px rgba(37,99,168,.25), inset 0 -2px 0 rgba(0,0,0,.15);
}
.ctx-card-ico svg{ width: 20px; height: 20px; }

.ctx-card-text{ display:flex; flex-direction: column; gap: .2rem; min-width: 0; }
.ctx-card-lbl{
  font-size: .58rem; font-weight: 800; letter-spacing: 2px; text-transform: uppercase;
  color: var(--blue-mid);
}
.ctx-card-val{
  font-family: var(--serif);
  font-size: .98rem; font-weight: 600; line-height: 1.4;
  color: var(--t1); text-decoration: none;
  transition: color var(--tr);
}
a.ctx-card-val:hover{ color: var(--gold-warm); }

/* ── FORM (glass) ── */
.ctx-form-wrap{
  padding: 2rem 2.2rem 2.2rem;
  background: rgba(255,255,255,.72);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
          backdrop-filter: blur(24px) saturate(180%);
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(13,30,48,.18), inset 0 1px 0 rgba(255,255,255,.7);
  position: relative; isolation: isolate;
  overflow: hidden;
}
[data-theme="dark"] .ctx-form-wrap{
  background: rgba(15,32,53,.7);
  border-color: rgba(126,200,245,.18);
  box-shadow: 0 24px 60px rgba(0,0,0,.5);
}

.ctx-form-wrap::before{
  content:''; position:absolute; top:0; left:0; right:0; height: 4px;
  background: linear-gradient(90deg, var(--gold-warm), var(--gold), var(--blue-mid));
  border-radius: 18px 18px 0 0;
  z-index: 1;
}

.ctx-form-head{ margin-bottom: 1.6rem; }
.ctx-form-eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size: .68rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--blue-mid); margin: 0 0 .4rem;
}
.ctx-form-eyebrow-mark{
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 8px rgba(201,169,97,.6);
}
.ctx-form-title{
  font-family: var(--serif); font-style: italic;
  font-size: clamp(1.4rem, 2.5vw, 1.85rem); font-weight: 800;
  color: var(--t1); margin: 0; line-height: 1.1;
}
.ctx-form-sub{
  font-size: .88rem; color: var(--t2); margin: .5rem 0 0; line-height: 1.6;
}

/* Alerts */
.ctx-alert{
  display: grid; grid-template-columns: auto 1fr;
  gap: 1rem; align-items: flex-start;
  padding: 1rem 1.2rem;
  border-radius: 10px;
  margin-bottom: 1.2rem;
  font-size: .86rem;
}
.ctx-alert svg{ width: 22px; height: 22px; flex-shrink: 0; margin-top: 2px; }
.ctx-alert strong{ display: block; margin-bottom: .2rem; }
.ctx-alert-err{
  background: rgba(231,76,60,.08);
  border: 1px solid rgba(231,76,60,.3);
  color: #c0392b;
}
.ctx-alert-ok{
  background: rgba(46,204,113,.08);
  border: 1px solid rgba(46,204,113,.3);
  color: #27ae60;
}

/* Form fields with floating labels */
.ctx-form{ display: flex; flex-direction: column; gap: 1rem; }
.ctx-row{
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
}
.ctx-field{ position: relative; }
.ctx-field-full{ }

.ctx-input, .ctx-textarea{
  width: 100%;
  padding: 1.1rem 1rem .55rem;
  background: rgba(255,255,255,.6);
  border: 1.5px solid rgba(13,30,48,.1);
  border-radius: 10px;
  font-size: .92rem;
  color: var(--t1);
  font-family: inherit;
  transition: border-color var(--tr), background var(--tr), box-shadow var(--tr);
  resize: vertical;
}
[data-theme="dark"] .ctx-input,
[data-theme="dark"] .ctx-textarea{
  background: rgba(15,32,53,.6);
  border-color: rgba(126,200,245,.15);
}
.ctx-textarea{ min-height: 130px; padding-top: 1.4rem; }

.ctx-input:focus, .ctx-textarea:focus{
  outline: none;
  border-color: var(--gold);
  background: rgba(255,255,255,.85);
  box-shadow: 0 0 0 4px rgba(201,169,97,.15);
}
[data-theme="dark"] .ctx-input:focus,
[data-theme="dark"] .ctx-textarea:focus{
  background: rgba(15,32,53,.85);
}

.ctx-label{
  position: absolute;
  top: 1rem; left: 1rem;
  display:inline-flex; align-items:center; gap:.4rem;
  font-size: .92rem; font-weight: 500;
  color: var(--t3);
  pointer-events: none;
  transform-origin: left top;
  transition: transform .25s var(--ease), color .2s var(--ease);
}
.ctx-label svg{ width: 14px; height: 14px; }

.ctx-input:focus + .ctx-label,
.ctx-input:not(:placeholder-shown) + .ctx-label,
.ctx-textarea:focus + .ctx-label,
.ctx-textarea:not(:placeholder-shown) + .ctx-label{
  transform: translateY(-.5rem) scale(.78);
  color: var(--blue-mid);
}

/* Submit row */
.ctx-actions{
  display:flex; align-items: center; justify-content: space-between;
  gap: 1rem;
  margin-top: .5rem;
  flex-wrap: wrap;
}
.ctx-note{
  font-size: .76rem; color: var(--t3);
  font-style: italic;
}

.ctx-submit{
  display:inline-flex; align-items:center; gap: .55rem;
  padding: .9rem 1.6rem;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff;
  border: none;
  border-radius: 100px;
  font-size: .82rem; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase;
  cursor: pointer;
  font-family: inherit;
  box-shadow: 0 10px 24px rgba(37,99,168,.32);
  transition: transform var(--tr), box-shadow var(--tr), gap var(--tr);
  position: relative; overflow: hidden;
}
.ctx-submit::before{
  content:''; position: absolute; inset: 0;
  background: linear-gradient(120deg, transparent 35%, rgba(255,255,255,.25) 50%, transparent 65%);
  transform: translateX(-120%);
  transition: transform .7s var(--ease);
}
.ctx-submit:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 32px rgba(37,99,168,.45);
  gap: .8rem;
}
.ctx-submit:hover::before{ transform: translateX(120%); }
.ctx-submit svg{ width: 14px; height: 14px; }

/* ═════════════════════════════════════════
   CONTACTS — Responsive
═════════════════════════════════════════ */
@media (max-width: 980px){
  .ctx-grid{ grid-template-columns: 1fr; gap: 1.6rem; padding: 2.5rem 0 4rem; }
  .ctx-stage{ min-height: auto; }
  .ctx-map{ position: relative; aspect-ratio: 16/9; min-height: 280px; }
  .ctx-map-mask{ display: none; }
  .ctx-hero-row{ grid-template-columns: 1fr; gap: 1.4rem; }
  .ctx-hero-r{ display: none; }
}
@media (max-width: 640px){
  .ctx-row{ grid-template-columns: 1fr; }
  .ctx-form-wrap{ padding: 1.5rem 1.4rem 1.6rem; }
  .ctx-actions{ flex-direction: column; align-items: flex-start; }
  .ctx-submit{ width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce){
  .ctx-hero-pin, .ctx-radar-ring{ animation: none; }
  .ctx-card, .ctx-input, .ctx-textarea, .ctx-label, .ctx-submit, .ctx-submit::before{ transition: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   PAGES — VACANCIES (Job Board)
   Used when category slug is vacancies/vakansiya/jobs
═══════════════════════════════════════════════════════════════════════ */

.vcx-hero{
  padding: 2.6rem 0 2rem;
  background: linear-gradient(180deg, var(--bg2), var(--bg));
  border-bottom: 1px solid var(--bdr);
}
.vcx-hero .breadcrumb{
  display:flex; align-items:center; gap:.45rem; flex-wrap:wrap;
  font-size:.78rem; color: var(--t3); margin-bottom: 1.2rem;
}
.vcx-hero .breadcrumb a{ color: var(--t2); text-decoration:none; transition: color var(--tr); }
.vcx-hero .breadcrumb a:hover{ color: var(--accent); }
.vcx-hero .breadcrumb svg{ width:11px; height:11px; opacity:.5; }
.vcx-hero .breadcrumb [aria-current]{ color: var(--blue-mid); font-weight:600; }

.vcx-hero-row{
  display:grid; grid-template-columns: 1fr auto;
  gap: 2rem; align-items: center;
}
.vcx-hero-eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.7rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0 0 .55rem;
}
.vcx-hero-eyebrow-mark{
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 8px rgba(201,169,97,.6);
  animation: vcx-pulse 2s infinite;
}
@keyframes vcx-pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.4; } }

.vcx-hero-title{
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3.4vw, 2.7rem);
  font-weight: 800; line-height: 1.1; letter-spacing: -1px;
  color: var(--t1); margin: 0;
}
.vcx-hero-sub{
  font-size: .94rem; color: var(--t2); margin:.7rem 0 1rem;
  max-width: 60ch; line-height: 1.6;
}
.vcx-hero-meta{
  display:flex; align-items:center; gap: 1.4rem; flex-wrap: wrap;
  margin-top: .8rem;
  font-size: .82rem; color: var(--t2);
}
.vcx-hero-meta-i{ display:inline-flex; align-items:center; gap:.45rem; }
.vcx-hero-meta-i svg{ width: 14px; height: 14px; color: var(--blue-mid); }
.vcx-hero-meta-i b{ color: var(--gold-warm); font-family: var(--serif); font-style: italic; font-weight: 800; font-size: 1.05rem; }

.vcx-hero-card{
  width: 130px; height: 130px;
  display:flex; flex-direction: column; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff;
  border-radius: 16px;
  box-shadow: 0 16px 36px rgba(37,99,168,.3);
  position: relative; overflow: hidden;
  transform: rotate(-3deg);
}
.vcx-hero-card::before{
  content:''; position:absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--gold-warm), var(--gold));
}
.vcx-hero-card-num{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 3rem; line-height: 1; color: var(--gold);
  letter-spacing: -2px;
}
.vcx-hero-card-lbl{
  font-size: .65rem; letter-spacing: 1.6px; text-transform: uppercase;
  font-weight: 700; opacity: .95; text-align: center; margin-top: .35rem;
  line-height: 1.3;
}

/* ── BOARD ── */
.vcx-board-sec{ padding: 3rem 0 5rem; background: var(--bg); }

.vcx-board-head{
  display:flex; justify-content: space-between; align-items: center;
  gap: 1.2rem;
  margin-bottom: 1.8rem;
  padding-bottom: 1.2rem;
  border-bottom: 2px solid var(--bdr);
  position: relative;
  flex-wrap: wrap;
}
.vcx-board-head::after{
  content:''; position:absolute; left:0; bottom:-2px;
  width: 60px; height: 2px;
  background: linear-gradient(90deg, var(--gold), var(--gold-warm));
}
.vcx-board-title{
  font-family: var(--serif); font-style: italic;
  font-size: clamp(1.3rem, 2.2vw, 1.7rem);
  font-weight: 800; line-height: 1.1;
  color: var(--t1); margin: 0;
}
.vcx-board-search{
  position: relative;
  flex: 0 1 280px;
}
.vcx-board-search svg{
  position: absolute; left: .85rem; top: 50%; transform: translateY(-50%);
  width: 14px; height: 14px;
  color: var(--t3);
  pointer-events: none;
}
.vcx-board-search input{
  width: 100%;
  padding: .6rem 1rem .6rem 2.3rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 100px;
  font-size: .85rem;
  color: var(--t1);
  font-family: inherit;
  transition: border-color var(--tr);
}
.vcx-board-search input:focus{
  outline: none; border-color: var(--blue-mid);
}

/* Job cards */
.vcx-jobs{
  display:flex; flex-direction: column; gap: 1rem;
}

.vcx-job{
  position: relative;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 14px;
  overflow: hidden;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s;
}
.vcx-job::before{
  content:''; position:absolute; left:0; top:0; bottom:0;
  width: 0;
  background: linear-gradient(180deg, var(--gold), var(--gold-warm));
  transition: width .35s var(--ease);
  z-index: 1;
}
.vcx-job:hover{
  transform: translateX(4px) translateY(-2px);
  border-color: var(--gold);
  box-shadow: 0 16px 36px rgba(13,30,48,.12);
}
.vcx-job:hover::before{ width: 4px; }

.vcx-job-link{
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 1.4rem;
  align-items: center;
  padding: 1.4rem 1.6rem;
  text-decoration: none;
  color: inherit;
  position: relative;
  z-index: 0;
}

.vcx-job-icon{
  width: 56px; height: 56px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: var(--gold);
  display:flex; align-items:center; justify-content:center;
  flex-shrink: 0;
  box-shadow: 0 6px 14px rgba(37,99,168,.25), inset 0 -2px 0 rgba(0,0,0,.15);
  transition: transform var(--tr);
}
.vcx-job:hover .vcx-job-icon{ transform: rotate(-6deg) scale(1.05); }
.vcx-job-icon svg{ width: 26px; height: 26px; }

.vcx-job-c{ display:flex; flex-direction: column; gap: .5rem; min-width: 0; }
.vcx-job-meta-top{
  display:flex; align-items:center; gap:.55rem; flex-wrap: wrap;
  font-size:.74rem;
}
.vcx-tag{
  display:inline-flex; align-items:center;
  font-size: .6rem; font-weight: 800; letter-spacing: 1.8px; text-transform: uppercase;
  padding: .22rem .55rem;
  border-radius: 4px;
}
.vcx-tag-new{
  background: linear-gradient(135deg, #2ecc71, #27ae60);
  color: #fff;
  animation: vcx-shake 4s infinite;
}
@keyframes vcx-shake{
  0%, 90%, 100%{ transform: rotate(0deg); }
  92%{ transform: rotate(-3deg); }
  94%{ transform: rotate(3deg); }
  96%{ transform: rotate(-2deg); }
  98%{ transform: rotate(2deg); }
}
.vcx-tag-cat{
  background: var(--accent-g);
  color: var(--blue-mid);
}
.vcx-job-date{
  display:inline-flex; align-items:center; gap:.35rem;
  color: var(--t3);
}
.vcx-job-date svg{ width: 12px; height: 12px; opacity: .7; }

.vcx-job-title{
  font-family: var(--serif);
  font-size: clamp(1.05rem, 1.5vw, 1.22rem);
  font-weight: 700; line-height: 1.35;
  color: var(--t1); margin: 0;
  letter-spacing: -.2px;
  transition: color var(--tr);
}
.vcx-job:hover .vcx-job-title{ color: var(--blue-dark); }
[data-theme="dark"] .vcx-job:hover .vcx-job-title{ color: #fff; }

.vcx-job-desc{
  font-size: .88rem; color: var(--t2); line-height: 1.55;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2; line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.vcx-job-tags{
  display:flex; align-items: center; gap: 1rem; flex-wrap: wrap;
  margin-top: .35rem;
  padding-top: .55rem;
  border-top: 1px dashed var(--bdr);
}
.vcx-tag-info{
  display:inline-flex; align-items:center; gap: .4rem;
  font-size: .72rem; color: var(--t3); font-weight: 600;
}
.vcx-tag-info svg{ width: 12px; height: 12px; color: var(--blue-mid); opacity: .8; }

.vcx-job-r{ display: flex; }
.vcx-job-cta{
  display:inline-flex; align-items:center; gap: .5rem;
  padding: .85rem 1.4rem;
  background: var(--accent-g);
  border: 1.5px solid var(--blue-mid);
  border-radius: 100px;
  color: var(--blue-mid);
  font-size: .76rem; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase;
  white-space: nowrap;
  transition: all var(--tr);
}
.vcx-job-cta svg{ width: 14px; height: 14px; transition: transform var(--tr); }
.vcx-job:hover .vcx-job-cta{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff;
  border-color: transparent;
  gap: .7rem;
  box-shadow: 0 8px 18px rgba(37,99,168,.3);
}
.vcx-job:hover .vcx-job-cta svg{ transform: translateX(4px); }

.vcx-empty{
  text-align: center; padding: 3rem 0; color: var(--t2);
  font-style: italic;
}

/* Vacancies — Responsive */
@media (max-width: 820px){
  .vcx-job-link{ grid-template-columns: 56px 1fr; gap: 1rem; padding: 1.2rem 1.2rem; }
  .vcx-job-r{ grid-column: 1 / -1; justify-self: flex-start; margin-top: .4rem; padding-top: .8rem; border-top: 1px dashed var(--bdr); width: 100%; }
  .vcx-hero-row{ grid-template-columns: 1fr; gap: 1.4rem; }
  .vcx-hero-card{ align-self: flex-start; transform: none; }
}
@media (max-width: 480px){
  .vcx-job-icon{ width: 44px; height: 44px; border-radius: 10px; }
  .vcx-job-icon svg{ width: 20px; height: 20px; }
  .vcx-job-cta{ width: 100%; justify-content: center; }
}

/* ═══════════════════════════════════════════════════════════════════════
   PAGES — WEBINAR (Event Timeline)
   Used when category slug is webinar/vebinar
═══════════════════════════════════════════════════════════════════════ */

.wbx-hero{
  padding: 2.6rem 0 2rem;
  background:
    radial-gradient(ellipse at 80% 50%, rgba(37,99,168,.08), transparent 50%),
    var(--bg2);
  border-bottom: 1px solid var(--bdr);
}
.wbx-hero .breadcrumb{
  display:flex; align-items:center; gap:.45rem; flex-wrap:wrap;
  font-size:.78rem; color: var(--t3); margin-bottom: 1.2rem;
}
.wbx-hero .breadcrumb a{ color: var(--t2); text-decoration:none; transition: color var(--tr); }
.wbx-hero .breadcrumb a:hover{ color: var(--accent); }
.wbx-hero .breadcrumb svg{ width:11px; height:11px; opacity:.5; }
.wbx-hero .breadcrumb [aria-current]{ color: var(--blue-mid); font-weight:600; }

.wbx-hero-row{
  display:grid; grid-template-columns: 1fr auto;
  gap: 2rem; align-items: center;
}
.wbx-hero-eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.7rem; font-weight: 800; letter-spacing: 2.8px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0 0 .55rem;
}
.wbx-online-dot{
  width: 9px; height: 9px; border-radius: 50%;
  background: #e74c3c;
  box-shadow: 0 0 12px rgba(231,76,60,.7);
  animation: wbx-rec 1.6s infinite;
}
@keyframes wbx-rec{ 0%,100%{ opacity:1; } 50%{ opacity:.3; } }

.wbx-hero-title{
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3.4vw, 2.7rem);
  font-weight: 800; line-height: 1.1; letter-spacing: -1px;
  color: var(--t1); margin: 0;
}
.wbx-hero-sub{
  font-size: .94rem; color: var(--t2); margin:.7rem 0 1rem;
  max-width: 60ch; line-height: 1.6;
}
.wbx-hero-stats{
  display:flex; gap: 1.2rem;
}
.wbx-hero-stat{
  display:flex; flex-direction: column;
  padding: .55rem 1.1rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 8px;
}
.wbx-hero-stat b{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1.4rem; line-height: 1;
  color: var(--gold-warm); letter-spacing: -.3px;
}
.wbx-hero-stat span{
  font-size: .58rem; letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--t3); font-weight: 700; margin-top: .3rem;
}

/* Decorative screen */
.wbx-hero-r{ flex-shrink: 0; }
.wbx-screen{
  width: 200px;
  background: #0a0a0a;
  border-radius: 8px 8px 4px 4px;
  overflow: hidden;
  box-shadow: 0 14px 32px rgba(13,30,48,.25);
}
.wbx-screen-bar{
  display:flex; align-items: center; gap: .35rem;
  padding: .5rem .8rem;
  background: #1a1a1a;
}
.wbx-screen-dot{
  width: 8px; height: 8px; border-radius: 50%;
  background: rgba(255,255,255,.3);
}
.wbx-screen-dot:nth-child(1){ background: #e74c3c; }
.wbx-screen-dot:nth-child(2){ background: #f39c12; }
.wbx-screen-dot:nth-child(3){ background: #2ecc71; }

.wbx-screen-body{
  position: relative;
  height: 110px;
  background: linear-gradient(135deg, #1a3a5c, #0a1a2c);
  overflow: hidden;
}
.wbx-screen-blob{
  position: absolute;
  width: 80px; height: 80px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--gold) 0%, transparent 70%);
  filter: blur(20px);
  opacity: .6;
  top: 10%; left: 10%;
  animation: wbx-blob 6s ease-in-out infinite;
}
.wbx-blob-2{
  background: radial-gradient(circle, var(--blue-pale) 0%, transparent 70%);
  top: 40%; left: 50%;
  animation-delay: -3s;
}
@keyframes wbx-blob{
  0%,100%{ transform: translate(0,0); }
  50%{ transform: translate(30px,20px); }
}
.wbx-screen-rec{
  position: absolute; top: .5rem; right: .65rem;
  font-size: .58rem; letter-spacing: 1.5px;
  color: #fff;
  background: rgba(231,76,60,.85);
  padding: .15rem .4rem;
  border-radius: 2px;
  font-weight: 800;
}

/* ── TIMELINE ── */
.wbx-timeline-sec{ padding: 3rem 0 5rem; background: var(--bg); position: relative; }

.wbx-timeline-head{
  position: relative;
  padding-bottom: 1rem;
  margin-bottom: 2.5rem;
  text-align: center;
}
.wbx-timeline-line{
  display: block;
  width: 60px; height: 3px;
  background: linear-gradient(90deg, var(--gold), var(--gold-warm));
  margin: 0 auto .8rem;
  border-radius: 100px;
}
.wbx-timeline-title{
  font-family: var(--serif); font-style: italic;
  font-size: clamp(1.4rem, 2.5vw, 1.85rem);
  font-weight: 800; color: var(--t1);
  margin: 0; line-height: 1.1;
}

.wbx-events{
  list-style: none; padding: 0; margin: 0;
  position: relative;
  display: flex; flex-direction: column;
  gap: 1.5rem;
}
.wbx-events::before{
  content:''; position: absolute;
  left: 50%; top: 0; bottom: 0;
  width: 2px;
  background: repeating-linear-gradient(180deg, var(--bdr) 0 8px, transparent 8px 16px);
  transform: translateX(-50%);
}

.wbx-event{
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  gap: 0;
}
.wbx-event.is-left .wbx-event-card{ grid-column: 1; margin-right: 2rem; }
.wbx-event.is-right .wbx-event-card{ grid-column: 2; margin-left: 2rem; }

/* Peg on timeline */
.wbx-event-peg{
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--card);
  border: 2px solid var(--gold);
  display:flex; align-items:center; justify-content:center;
  z-index: 1;
  box-shadow: 0 0 0 4px var(--bg);
}
.wbx-event-peg-inner{
  width: 10px; height: 10px; border-radius: 50%;
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  box-shadow: 0 0 8px rgba(201,169,97,.7);
  transition: transform var(--tr);
}
.wbx-event:hover .wbx-event-peg-inner{ transform: scale(1.4); }

.wbx-event-card{
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 0;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none; color: inherit;
  position: relative;
  transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .35s;
}
.wbx-event-card:hover{
  transform: translateY(-4px);
  border-color: var(--gold);
  box-shadow: 0 18px 38px rgba(13,30,48,.14);
}

/* Date stamp */
.wbx-event-date{
  display:flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 1rem .5rem;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff;
  text-align: center;
  position: relative;
}
.wbx-event-date::before{
  content:''; position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, var(--gold-warm), var(--gold));
}
.wbx-event-day{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1.85rem; line-height: 1; color: var(--gold);
  letter-spacing: -1px;
}
.wbx-event-mon{
  font-size: .58rem; letter-spacing: 1.6px; text-transform: uppercase;
  font-weight: 800; margin-top: .35rem; opacity: .9;
}
.wbx-event-year{
  font-size: .6rem; opacity: .7; margin-top: .15rem; font-weight: 600;
}

/* Body */
.wbx-event-body{
  padding: 1rem 1.3rem 1.1rem;
  display: flex; flex-direction: column; gap: .45rem;
}
.wbx-event-meta{
  display:flex; align-items:center; gap:.5rem; flex-wrap: wrap;
}
.wbx-event-tag{
  display:inline-flex; align-items:center; gap: .4rem;
  font-size: .6rem; font-weight: 800; letter-spacing: 1.6px; text-transform: uppercase;
  padding: .2rem .55rem;
  background: var(--accent-g);
  color: var(--blue-mid);
  border-radius: 3px;
}
.wbx-event-tag svg{ width: 11px; height: 11px; }
.wbx-event-tag-video{
  background: linear-gradient(135deg, #e74c3c, #c0392b);
  color: #fff;
}
.wbx-event-title{
  font-family: var(--serif);
  font-size: 1.02rem; font-weight: 700; line-height: 1.35;
  color: var(--t1); margin: 0;
  letter-spacing: -.2px;
  transition: color var(--tr);
}
.wbx-event-card:hover .wbx-event-title{ color: var(--blue-mid); }

.wbx-event-desc{
  font-size: .82rem; color: var(--t2); line-height: 1.55;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2; line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.wbx-event-foot{
  display:flex; justify-content: space-between; align-items: center;
  margin-top: auto;
  padding-top: .55rem;
  border-top: 1px dashed var(--bdr);
  font-size: .72rem;
}
.wbx-event-time{
  display:inline-flex; align-items:center; gap: .35rem;
  color: var(--t3); font-weight: 600;
}
.wbx-event-time svg{ width: 12px; height: 12px; }
.wbx-event-cta{
  display:inline-flex; align-items:center; gap: .4rem;
  font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
  font-size: .7rem;
  color: var(--gold-warm);
  transition: gap var(--tr);
}
.wbx-event-cta svg{ width: 12px; height: 12px; transition: transform var(--tr); }
.wbx-event-card:hover .wbx-event-cta{ gap: .55rem; }
.wbx-event-card:hover .wbx-event-cta svg{ transform: translateX(3px); }

.wbx-empty{
  text-align: center; padding: 3rem 0; color: var(--t2);
  font-style: italic;
}

/* Webinar — Responsive */
@media (max-width: 820px){
  .wbx-events::before{ left: 20px; }
  .wbx-event{ grid-template-columns: 1fr; }
  .wbx-event-peg{ left: 20px; transform: translate(-50%, -50%); }
  .wbx-event.is-left .wbx-event-card,
  .wbx-event.is-right .wbx-event-card{
    grid-column: 1; margin-left: 50px; margin-right: 0;
  }
  .wbx-hero-row{ grid-template-columns: 1fr; gap: 1.4rem; }
  .wbx-hero-r{ display: none; }
}
@media (max-width: 480px){
  .wbx-event-card{ grid-template-columns: 70px 1fr; }
  .wbx-event-day{ font-size: 1.4rem; }
}

/* ═══════════════════════════════════════════════════════════════════════
   PAGES — DEFAULT (Zigzag Stories)
   Used for any other category (not vacancies/webinar)
═══════════════════════════════════════════════════════════════════════ */

.pgx-hero{
  padding: 2.6rem 0 2rem;
  background: linear-gradient(180deg, var(--bg2), var(--bg));
  border-bottom: 1px solid var(--bdr);
}
.pgx-hero .breadcrumb{
  display:flex; align-items:center; gap:.45rem; flex-wrap:wrap;
  font-size:.78rem; color: var(--t3); margin-bottom: 1.2rem;margin-top: 2rem;
}
.pgx-hero .breadcrumb a{ color: var(--t2); text-decoration:none; transition: color var(--tr); }
.pgx-hero .breadcrumb a:hover{ color: var(--accent); }
.pgx-hero .breadcrumb svg{ width:11px; height:11px; opacity:.5; }
.pgx-hero .breadcrumb [aria-current]{ color: var(--blue-mid); font-weight:600; }

.pgx-hero-row{
  display:grid; grid-template-columns: 1fr auto;
  gap: 2rem; align-items: center;
}
.pgx-hero-eyebrow{
  font-size:.7rem; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase;
  color: var(--gold-warm); margin: 0 0 .55rem;
}
.pgx-hero-title{
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3.4vw, 2.7rem);
  font-weight: 800; line-height: 1.1; letter-spacing: -1px;
  color: var(--t1); margin: 0;
}
.pgx-hero-sub{
  font-size: .94rem; color: var(--t2); margin:.7rem 0 0;
  max-width: 60ch; line-height: 1.6;
}

/* Decorative blocks */
.pgx-hero-r{
  position: relative;
  width: 160px; height: 130px;
  flex-shrink: 0;
}
.pgx-hero-deco-1, .pgx-hero-deco-2, .pgx-hero-deco-3{
  position: absolute;
  border-radius: 8px;
}
.pgx-hero-deco-1{
  width: 60px; height: 60px;
  top: 10px; left: 0;
  background: linear-gradient(135deg, var(--blue-mid), var(--blue-dark));
  transform: rotate(-12deg);
}
.pgx-hero-deco-2{
  width: 50px; height: 50px;
  top: 0; right: 30px;
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  transform: rotate(8deg);
}
.pgx-hero-deco-3{
  width: 36px; height: 36px;
  bottom: 10px; right: 0;
  background: var(--card);
  border: 2px solid var(--gold);
  transform: rotate(-15deg);
}
.pgx-hero-num{
  position: absolute;
  bottom: 5px; left: 30px;
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 3.2rem; line-height: 1;
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -2px;
}

/* ── ZIGZAG STORIES ── */
.pgx-stories-sec{ padding: 3rem 0 5rem; background: var(--bg); }

.pgx-stories{
  display:flex; flex-direction: column;
  gap: 3rem;
}

.pgx-story{
  position: relative;
}

.pgx-story-link{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  align-items: center;
  text-decoration: none;
  color: inherit;
  padding: 1rem;
  border-radius: 14px;
  transition: background .35s var(--ease);
}
.pgx-story.is-r .pgx-story-link{
  direction: rtl;
}
.pgx-story.is-r .pgx-story-link > *{ direction: ltr; }

.pgx-story-link:hover{
  background: var(--accent-g);
}

/* Image */
.pgx-story-img{
  position: relative;
  aspect-ratio: 4 / 3;
  border-radius: 12px;
  overflow: hidden;
  background: linear-gradient(135deg, var(--bg3), var(--bg2));
  isolation: isolate;
  box-shadow: 0 12px 30px rgba(13,30,48,.1);
  transition: transform .4s var(--ease), box-shadow .4s var(--ease);
}
.pgx-story-link:hover .pgx-story-img{
  transform: translateY(-4px);
  box-shadow: 0 22px 50px rgba(13,30,48,.18);
}
.pgx-story-img img{
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .8s var(--ease), filter .35s;
  filter: saturate(.95);
}
.pgx-story-link:hover .pgx-story-img img{
  transform: scale(1.05);
  filter: saturate(1.1);
}
.pgx-story-img-ph{
  position: absolute; inset: 0;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: var(--gold);
}
.pgx-story-img-ph-letters{
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 4rem; line-height: 1;
}

.pgx-story-num{
  position: absolute; top: 1rem; left: 1rem;
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1rem;
  padding: .25rem .55rem;
  background: rgba(255,255,255,.95);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border-radius: 4px;
  color: var(--gold-warm);
  letter-spacing: -.3px;
  z-index: 2;
  box-shadow: 0 2px 8px rgba(13,30,48,.18);
}

/* Body */
.pgx-story-body{
  display:flex; flex-direction: column; gap: .7rem;
  min-width: 0;
  padding: .5rem 0;
}
.pgx-story-meta{
  display:flex; align-items:center; gap:.6rem; flex-wrap: wrap;
  font-size:.74rem; color: var(--t3);
}
.pgx-story-cat{
  font-size:.62rem; font-weight: 800; letter-spacing: 2px; text-transform: uppercase;
  color: var(--blue-mid);
  padding: .18rem .55rem;
  background: var(--accent-g);
  border-radius: 3px;
}
.pgx-story-dot{
  width: 3px; height: 3px; border-radius: 50%;
  background: var(--t3);
}

.pgx-story-title{
  font-family: var(--serif);
  font-size: clamp(1.3rem, 2.2vw, 1.7rem);
  font-weight: 800; line-height: 1.2;
  color: var(--t1); margin: 0;
  letter-spacing: -.4px;
  transition: color var(--tr);
}
.pgx-story-link:hover .pgx-story-title{ color: var(--blue-dark); }
[data-theme="dark"] .pgx-story-link:hover .pgx-story-title{ color: #fff; }

.pgx-story-desc{
  font-size: .92rem; color: var(--t2); line-height: 1.65;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3; line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.pgx-story-foot{
  display:flex; align-items: center; gap: 1rem; flex-wrap: wrap;
  margin-top: .5rem;
  padding-top: .65rem;
  border-top: 1px dashed var(--bdr);
  font-size: .76rem;
}
.pgx-story-views{
  display:inline-flex; align-items:center; gap: .35rem;
  color: var(--t3);
}
.pgx-story-views svg{ width: 13px; height: 13px; opacity: .7; }

.pgx-story-pdf{
  font-size: .62rem; font-weight: 800; letter-spacing: 1.4px;
  padding: .2rem .55rem;
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  color: #fff;
  border-radius: 3px;
}

.pgx-story-cta{
  margin-left: auto;
  display:inline-flex; align-items:center; gap:.45rem;
  font-size: .72rem; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase;
  color: var(--gold-warm);
  transition: gap var(--tr);
}
.pgx-story-cta svg{ width: 13px; height: 13px; transition: transform var(--tr); }
.pgx-story-link:hover .pgx-story-cta{ gap: .65rem; }
.pgx-story-link:hover .pgx-story-cta svg{ transform: translateX(4px); }

.pgx-empty{
  text-align: center; padding: 3rem 0; color: var(--t2);
  font-style: italic;
}

/* Default — Responsive */
@media (max-width: 820px){
  .pgx-story-link{ grid-template-columns: 1fr; gap: 1.2rem; padding: 0; }
  .pgx-story.is-r .pgx-story-link{ direction: ltr; }
  .pgx-stories{ gap: 2rem; }
  .pgx-hero-row{ grid-template-columns: 1fr; gap: 1.4rem; }
  .pgx-hero-r{ display: none; }
}

@media (prefers-reduced-motion: reduce){
  .vcx-tag-new, .vcx-hero-eyebrow-mark{ animation: none; }
  .wbx-online-dot, .wbx-screen-blob{ animation: none; }
  .vcx-job, .vcx-job *,
  .wbx-event, .wbx-event *,
  .pgx-story, .pgx-story *{ transition: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   PUBLICATION DETAIL — 2026 PREMIUM MAGAZINE STYLE (pubx-)
═══════════════════════════════════════════════════════════════════════ */

/* ── Reading progress bar (fixed top) ── */
.pubx-progress{
  position: fixed; top: 0; left: 0; right: 0;
  height: 3px;
  background: rgba(13,30,48,.05);
  z-index: 9998;
  pointer-events: none;
}
.pubx-progress span{
  display: block;
  height: 100%; width: 0%;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold) 60%, var(--gold-warm));
  box-shadow: 0 0 12px rgba(201,169,97,.6);
  transition: width .12s linear;
}
[data-theme="dark"] .pubx-progress{ background: rgba(255,255,255,.04); }

.pubx-doc{
  position: relative;
  isolation: isolate;
}

/* ═══ HERO ═══ */
.pubx-hero{
  position: relative;
  padding: 7rem 0 6rem;
  color: #fff;
  overflow: hidden;
  isolation: isolate;
  background: linear-gradient(135deg, var(--blue-dark) 0%, var(--navy-deep) 60%, var(--ink) 100%);
}
.pubx-hero-bg{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.pubx-hero-img{
  position:absolute; inset:-6%;
  background-image: var(--cover);
  background-size: cover;
  background-position: center;
  filter: blur(38px) brightness(.45) saturate(1.2);
  transform: scale(1.1);
  opacity: .9;
}
.pubx-hero:not([style*="--cover"]) .pubx-hero-img{ display:none; }
.pubx-hero-vignette{
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 18% 20%, rgba(126,200,245,.18) 0%, transparent 50%),
    radial-gradient(circle at 82% 80%, rgba(201,169,97,.18) 0%, transparent 55%),
    linear-gradient(180deg, rgba(7,18,30,.55) 0%, rgba(13,30,48,.78) 100%);
}

/* Decorative geometric shapes */
.pubx-deco{ position:absolute; border-radius:50%; filter: blur(50px); pointer-events:none; }
.pubx-deco-1{
  width: 460px; height: 460px;
  top: -180px; left: -120px;
  background: radial-gradient(circle, rgba(126,200,245,.32), transparent 65%);
  animation: pubx-orb 18s ease-in-out infinite alternate;
}
.pubx-deco-2{
  width: 380px; height: 380px;
  bottom: -160px; right: -100px;
  background: radial-gradient(circle, rgba(201,169,97,.28), transparent 65%);
  animation: pubx-orb 22s ease-in-out infinite alternate-reverse;
}
.pubx-deco-3{
  width: 300px; height: 300px;
  top: 40%; right: 20%;
  background: radial-gradient(circle, rgba(91,163,217,.18), transparent 70%);
  animation: pubx-orb 26s ease-in-out infinite alternate;
}
@keyframes pubx-orb{
  0%   { transform: translate(0,0) scale(1); opacity: .6; }
  100% { transform: translate(40px, 30px) scale(1.08); opacity: .95; }
}

.pubx-hero-particles{
  position:absolute; inset:0;
  width:100%; height:100%;
  z-index:1;
  pointer-events:none;
  display:block;
}
.pubx-hero .container{ position:relative; z-index:2; }
.pubx-bc{
  display: inline-flex; flex-wrap: wrap; gap: .5rem;
  align-items: center;
  font-size: .8rem;
  color: rgba(255,255,255,.7);
  margin-bottom: 2rem;
  padding: .5rem 1rem;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 100px;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.pubx-bc a{ color: rgba(255,255,255,.78); transition: color .2s; }
.pubx-bc a:hover{ color: #fff; }
.pubx-bc svg{ width: 11px; height: 11px; opacity: .5; }

.pubx-hero-inner{ max-width: 920px; }

/* Meta chip row */
.pubx-hero-meta-row{
  display: flex; flex-wrap: wrap; gap: .55rem;
  margin-bottom: 1.6rem;
}
.pubx-chip{
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .42rem .9rem;
  border-radius: 100px;
  font-size: .75rem; font-weight: 600;
  color: rgba(255,255,255,.85);
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  letter-spacing: .3px;
  transition: background .25s, border-color .25s, transform .2s;
}
.pubx-chip svg{ width: 13px; height: 13px; opacity: .85; }
.pubx-chip:hover{
  background: rgba(255,255,255,.14);
  border-color: rgba(201,169,97,.45);
  transform: translateY(-1px);
}
.pubx-chip-cat{
  background: linear-gradient(135deg, rgba(201,169,97,.28), rgba(126,200,245,.18));
  border-color: rgba(201,169,97,.5);
  color: #fff;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: .68rem;
}
.pubx-chip-dot{
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 10px rgba(201,169,97,.7);
  animation: bpulse 2s infinite;
}

/* HERO TITLE */
.pubx-hero-title{
  font-family: var(--serif);
  font-size: clamp(1.25rem, 2.2vw, 1.9rem);
  font-weight: 700;
  letter-spacing: -.4px;
  line-height: 1.22;
  color: #fff;
  margin-bottom: 1.25rem;
  text-wrap: balance;
}
.pubx-hero-lede{
  font-size: clamp(1rem, 1.4vw, 1.18rem);
  line-height: 1.65;
  color: rgba(255,255,255,.82);
  max-width: 760px;
  margin-bottom: 2.4rem;
  font-weight: 400;
}

/* Byline row */
.pubx-byline{
  display: flex; align-items: center; gap: 1rem;
  flex-wrap: wrap;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255,255,255,.14);
  max-width: 760px;
}
.pubx-byline-avatar{
  width: 46px; height: 46px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  color: var(--ink);
  font-family: var(--serif);
  font-weight: 800;
  font-size: .76rem;
  letter-spacing: 1px;
  box-shadow: 0 6px 18px rgba(201,169,97,.4), inset 0 1px 0 rgba(255,255,255,.3);
  flex-shrink: 0;
}
.pubx-byline-info{ display: flex; flex-direction: column; gap: .15rem; flex: 1; min-width: 0; }
.pubx-byline-name{
  font-size: .92rem; font-weight: 600; color: #fff;
  font-family: var(--serif);
}
.pubx-byline-meta{
  font-size: .76rem; color: rgba(255,255,255,.62);
  letter-spacing: .3px;
}
.pubx-byline-cta{
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .65rem 1.1rem;
  border-radius: 100px;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.22);
  color: #fff;
  font-size: .82rem; font-weight: 600;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  transition: background .25s, border-color .25s, transform .2s;
}
.pubx-byline-cta svg{ width: 14px; height: 14px; }
.pubx-byline-cta:hover{
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  border-color: transparent;
  color: var(--ink);
  transform: translateY(-2px);
}

/* Hero scroll indicator */
.pubx-hero-scroll{
  position: absolute; bottom: 1.5rem; left: 50%;
  transform: translateX(-50%);
  color: rgba(255,255,255,.5);
  z-index: 2;
  animation: pubx-bob 2.4s ease-in-out infinite;
}
.pubx-hero-scroll svg{ width: 22px; height: 22px; }
@keyframes pubx-bob{
  0%, 100% { transform: translate(-50%, 0); opacity: .5; }
  50%      { transform: translate(-50%, 6px); opacity: 1; }
}

/* ═══ STAGE: 3-col grid ═══ */
.pubx-stage{
  background: var(--bg);
  padding: 4.5rem 0 5rem;
  position: relative;
}
.pubx-grid{
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) 320px;
  gap: 2.5rem;
  align-items: flex-start;
}

/* ═══ SHARE DOCK (left, sticky) ═══ */
.pubx-dock{
  position: sticky; top: 96px;
  width: 64px;
  align-self: flex-start;
}
.pubx-dock-inner{
  display: flex; flex-direction: column; align-items: center;
  gap: .6rem;
  padding: 1rem .65rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 100px;
  box-shadow: var(--shadow-1), var(--shadow-2);
}
.pubx-dock-lbl{
  writing-mode: vertical-rl;
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: var(--gold-warm);
  margin: .3rem 0 .15rem;
}
.pubx-dock-btn{
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: var(--bg3);
  border: 1px solid transparent;
  color: var(--t2);
  cursor: pointer;
  transition: background .25s, color .25s, border-color .25s, transform .2s;
  position: relative;
}
.pubx-dock-btn svg{ width: 15px; height: 15px; }
.pubx-dock-btn:hover{
  background: var(--blue-mid);
  color: #fff;
  transform: translateY(-2px) scale(1.06);
  border-color: rgba(201,169,97,.45);
}
.pubx-dock-btn-accent{
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  color: var(--ink);
  box-shadow: 0 4px 12px rgba(201,169,97,.32);
}
.pubx-dock-btn-accent:hover{
  background: linear-gradient(135deg, var(--gold), var(--gold-soft));
  color: var(--ink);
  transform: translateY(-2px) scale(1.08);
  box-shadow: 0 8px 22px rgba(201,169,97,.5);
}
.pubx-dock-divider{
  width: 24px; height: 1px;
  background: var(--bdr);
  margin: .15rem 0;
}
#pubxCopyLink.is-done{
  background: #10b981;
  color: #fff;
}
#pubxCopyLink.is-done svg{ animation: pubx-pop .3s var(--ease); }
@keyframes pubx-pop{
  0%   { transform: scale(.6); }
  60%  { transform: scale(1.18); }
  100% { transform: scale(1); }
}

/* ═══ BODY ═══ */
.pubx-body{
  min-width: 0;
  max-width: 760px;
}

/* Cover image figure */
.pubx-cover{
  margin: 0 0 2.5rem;
}
.pubx-cover-frame{
  position: relative;
  aspect-ratio: 16/9;
  overflow: hidden;
  border-radius: 18px;
  background: linear-gradient(135deg, var(--blue-dark), var(--ink));
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3);
}
.pubx-cover-frame img{
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .8s cubic-bezier(.22,1,.36,1);
}
.pubx-cover:hover .pubx-cover-frame img{ transform: scale(1.04); }
.pubx-cover figcaption{
  margin-top: .85rem;
  font-size: .78rem;
  color: var(--t3);
  text-align: center;
  letter-spacing: .3px;
  font-style: italic;
}

/* Article content typography polish */
.pubx-content{
  font-size: 1.08rem;
  line-height: 1.82;
  color: var(--t1);
  font-family: Georgia, 'Times New Roman', serif;
}
.pubx-content > p:first-of-type::first-letter{
  font-family: var(--serif);
  font-size: 4em;
  float: left;
  line-height: .85;
  margin: .15em .12em 0 0;
  font-weight: 700;
  color: var(--gold-warm);
  text-shadow: 0 4px 18px rgba(201,169,97,.18);
}
[data-theme="dark"] .pubx-content > p:first-of-type::first-letter{ color: var(--gold-soft); }
.pubx-content blockquote{
  position: relative;
  margin: 2.5rem 0;
  padding: 1.6rem 2rem 1.6rem 3rem;
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.18rem;
  line-height: 1.55;
  color: var(--t1);
  background: linear-gradient(135deg, var(--bg3), var(--card));
  border-left: 4px solid var(--gold);
  border-radius: 0 16px 16px 0;
  box-shadow: var(--shadow-1);
}
.pubx-content blockquote::before{
  content: '"';
  position: absolute; top: -.3rem; left: 1rem;
  font-family: var(--serif);
  font-size: 4.5rem;
  color: var(--gold);
  opacity: .45;
  line-height: 1;
}

/* ═══ PDF showcase ═══ */
.pubx-pdf{
  margin-top: 3rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3);
  position: relative;
}
.pubx-pdf::before{
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, #d83b3b, var(--gold-warm) 50%, var(--blue-mid));
  z-index: 1;
}
.pubx-pdf-head{
  display: flex; align-items: center; gap: 1.1rem;
  padding: 1.2rem 1.5rem;
  background: var(--bg3);
  border-bottom: 1px solid var(--bdr);
  flex-wrap: wrap;
}
.pubx-pdf-ico{
  width: 52px; height: 60px;
  flex-shrink: 0;
  position: relative;
  background: linear-gradient(135deg, #d83b3b, #b02323);
  border-radius: 7px;
  color: #fff;
  display: flex; align-items: flex-end; justify-content: center;
  padding-bottom: .55rem;
  font-size: .62rem; font-weight: 800; letter-spacing: .8px;
  box-shadow: 0 6px 18px rgba(176,35,35,.32), inset 0 1px 0 rgba(255,255,255,.22);
}
.pubx-pdf-ico::before{
  content: '';
  position: absolute; top: 0; right: 0;
  border-style: solid;
  border-width: 0 14px 14px 0;
  border-color: transparent rgba(255,255,255,.32) transparent transparent;
  border-radius: 0 7px 0 0;
}
.pubx-pdf-ico svg{ width: 22px; height: 22px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.pubx-pdf-info{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .25rem; }
.pubx-pdf-label{
  font-size: .66rem; letter-spacing: 1.6px; text-transform: uppercase;
  font-weight: 700; color: var(--gold-warm);
}
.pubx-pdf-name{
  font-family: var(--serif);
  font-size: 1.05rem; font-weight: 700;
  color: var(--t1); line-height: 1.3;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pubx-pdf-btn{
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .75rem 1.3rem;
  border-radius: 11px;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff;
  font-weight: 600; font-size: .88rem;
  box-shadow: 0 6px 18px rgba(26,74,122,.32), inset 0 1px 0 rgba(255,255,255,.18);
  transition: transform .2s var(--ease), box-shadow .25s, background .3s;
  white-space: nowrap;
}
.pubx-pdf-btn svg{ width: 14px; height: 14px; }
.pubx-pdf-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(26,74,122,.45);
  background: linear-gradient(135deg, var(--blue-mid), var(--blue-light));
}
.pubx-pdf-frame{
  width: 100%; height: 720px;
  border: 0; display: block;
  background: #1a1d2e;
}

/* Files list */
.pubx-files{
  margin-top: 2.5rem;
  padding: 1.5rem 1.6rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 16px;
  position: relative;
}
.pubx-files::before{
  content:''; position:absolute; top:0; left:1.6rem; right:1.6rem; height:3px;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold));
  border-radius: 0 0 3px 3px;
}
.pubx-files-title{
  display: flex; align-items: center; gap: .55rem;
  font-family: var(--serif);
  font-size: 1.05rem; font-weight: 700;
  color: var(--t1);
  margin-bottom: 1.1rem;
}
.pubx-files-title svg{ width: 18px; height: 18px; color: var(--gold-warm); }
.pubx-files-list{
  display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: .7rem;
}
.pubx-file{
  --c: var(--accent);
  display: grid; grid-template-columns: 42px 1fr auto;
  align-items: center; gap: .8rem;
  padding: .75rem .9rem;
  background: var(--bg3);
  border: 1px solid var(--bdr);
  border-radius: 11px;
  text-decoration: none;
  color: var(--t1);
  transition: transform .25s, box-shadow .25s, border-color .25s;
}
.pubx-file:hover{
  transform: translateY(-2px);
  border-color: rgba(201,169,97,.4);
  box-shadow: var(--shadow-1), var(--shadow-2);
  background: var(--card);
}
.pubx-file-ico{
  width: 42px; height: 42px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--c) 14%, transparent);
  color: var(--c);
  flex-shrink: 0;
}
.pubx-file-ico svg{ width: 18px; height: 18px; }
.pubx-file-info{ display: flex; flex-direction: column; gap: .05rem; min-width: 0; }
.pubx-file-label{
  font-size: .62rem; letter-spacing: 1.4px; text-transform: uppercase;
  font-weight: 800; color: var(--c);
}
.pubx-file-name{
  font-size: .9rem; font-weight: 600; color: var(--t1);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pubx-file-arrow{
  width: 30px; height: 30px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--accent-g);
  color: var(--blue-mid);
  flex-shrink: 0;
  transition: background .25s, color .25s, transform .25s;
}
.pubx-file-arrow svg{ width: 13px; height: 13px; }
.pubx-file:hover .pubx-file-arrow{
  background: var(--blue-mid); color: #fff;
  transform: translateX(2px);
}
.pubx-file--pdf{ --c: #e02d3c; }
.pubx-file--doc{ --c: #1a73e8; }
.pubx-file--xls{ --c: #0f9d58; }
.pubx-file--ppt{ --c: #d97706; }
.pubx-file--zip{ --c: #9c6cd8; }
[data-theme="dark"] .pubx-file--pdf{ --c: #ff6b78; }
[data-theme="dark"] .pubx-file--doc{ --c: #5fa3f7; }
[data-theme="dark"] .pubx-file--xls{ --c: #3ec78b; }
[data-theme="dark"] .pubx-file--ppt{ --c: #ffae45; }

/* Video frame */
.pubx-video{ margin-top: 2.5rem; }
.pubx-video-frame{
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  border-radius: 18px;
  overflow: hidden;
  background: #000;
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3);
}
.pubx-video-frame iframe{
  position: absolute; top: 0; left: 0;
  width: 100%; height: 100%;
  border: 0;
}

/* Bottom: tags + cite */
.pubx-bottom{ margin-top: 3rem; }
.pubx-tags{
  display: flex; align-items: center; gap: .8rem;
  flex-wrap: wrap;
  padding: 1.2rem 0;
  border-top: 1px solid var(--bdr);
  border-bottom: 1px solid var(--bdr);
  margin-bottom: 2.2rem;
}
.pubx-tags-lbl{
  font-size: .68rem; letter-spacing: 1.6px; text-transform: uppercase;
  font-weight: 700; color: var(--t3);
}
.pubx-chip-topic{
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .5rem 1rem;
  border-radius: 100px;
  font-size: .85rem; font-weight: 600;
  color: var(--blue-mid);
  background: var(--accent-g);
  border: 1px solid rgba(37,99,168,.2);
  transition: background .25s, color .25s, border-color .25s, gap .25s var(--ease), transform .2s;
}
.pubx-chip-topic svg{ width: 13px; height: 13px; transition: transform .25s; }
.pubx-chip-topic:hover{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff; border-color: transparent;
  gap: .65rem;
  transform: translateY(-2px);
}
.pubx-chip-topic:hover svg{ transform: translateX(3px); }

/* Cite this card */
.pubx-cite{
  position: relative;
  padding: 1.5rem 1.7rem;
  background: linear-gradient(135deg, var(--bg3), var(--card));
  border: 1px solid var(--bdr);
  border-radius: 16px;
  isolation: isolate;
}
.pubx-cite::before{
  content:''; position:absolute; top: 0; left: 1.7rem; right: 1.7rem; height: 3px;
  background: linear-gradient(90deg, var(--gold-warm), var(--gold), var(--blue-mid));
  border-radius: 0 0 3px 3px;
}
.pubx-cite-head{
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap;
  margin-bottom: .8rem;
}
.pubx-cite-eyebrow{
  display: inline-flex; align-items: center; gap: .55rem;
  font-size: .68rem; font-weight: 800; letter-spacing: 1.6px; text-transform: uppercase;
  color: var(--gold-warm);
}
.pubx-cite-eyebrow svg{ width: 16px; height: 16px; }
.pubx-cite-copy{
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .5rem .9rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 100px;
  font-size: .76rem; font-weight: 600;
  color: var(--t2);
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s;
}
.pubx-cite-copy svg{ width: 13px; height: 13px; }
.pubx-cite-copy:hover{
  background: var(--accent-g);
  color: var(--blue-mid);
  border-color: var(--blue-mid);
}
.pubx-cite-copy.is-done{
  background: #10b981; color: #fff; border-color: transparent;
}
.pubx-cite-text{
  font-family: var(--serif);
  font-size: .94rem;
  line-height: 1.7;
  color: var(--t1);
  margin: 0;
}
.pubx-cite-text em{ color: var(--blue-mid); font-style: italic; }

/* ═══ META SIDEBAR (right, sticky) ═══ */
.pubx-meta{
  position: sticky; top: 96px;
  align-self: flex-start;
}
.pubx-meta-card{
  position: relative;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--shadow-1), var(--shadow-2);
  isolation: isolate;
}
.pubx-meta-card::before{
  content:''; position:absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--blue-mid), var(--gold));
  z-index: 1;
}
.pubx-meta-cover{
  position: relative;
  aspect-ratio: 16/10;
  background: linear-gradient(135deg, var(--blue-dark), var(--ink));
  background-image: var(--c);
  background-size: cover;
  background-position: center;
}
.pubx-meta-cover::after{
  content:''; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(13,30,48,.1) 0%, rgba(13,30,48,.55) 100%);
}
.pubx-meta-list{
  padding: 1.2rem 1.4rem;
  display: flex; flex-direction: column;
}
.pubx-meta-row{
  display: flex; align-items: center; justify-content: space-between;
  gap: .85rem;
  padding: .75rem 0;
  border-bottom: 1px solid var(--bdr);
  font-size: .85rem;
}
.pubx-meta-row:last-child{ border-bottom: 0; }
.pubx-meta-lbl{
  font-size: .66rem; letter-spacing: 1.4px; text-transform: uppercase;
  font-weight: 700; color: var(--t3);
  flex-shrink: 0;
}
.pubx-meta-val{
  font-family: var(--serif);
  font-weight: 700;
  color: var(--t1);
  text-align: right;
  letter-spacing: -.1px;
}
.pubx-meta-cta{
  display: flex; align-items: center; justify-content: center; gap: .5rem;
  margin: 0 1.4rem 1.4rem;
  padding: .85rem 1.1rem;
  border-radius: 11px;
  background: linear-gradient(135deg, var(--gold-warm), var(--gold));
  color: var(--ink);
  font-weight: 700; font-size: .88rem;
  letter-spacing: .3px;
  box-shadow: 0 6px 16px rgba(201,169,97,.32), inset 0 1px 0 rgba(255,255,255,.32);
  transition: transform .25s var(--ease), box-shadow .3s;
}
.pubx-meta-cta svg{ width: 14px; height: 14px; }
.pubx-meta-cta:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(201,169,97,.45);
}

/* ═══ PREV/NEXT NAV ═══ */
.pubx-pagenav{
  background: var(--bg2);
  border-top: 1px solid var(--bdr);
  padding: 3.5rem 0 5rem;
  position: relative;
}
.pubx-pagenav::before{
  content:''; position:absolute; left: 50%; top: 0; transform: translateX(-50%);
  width: min(900px, 84%); height: 1px;
  background: linear-gradient(90deg, transparent, var(--bdr-h) 35%, var(--gold) 50%, var(--bdr-h) 65%, transparent);
  opacity: .55;
}
.pubx-pagenav-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
  max-width: 1100px;
  margin: 0 auto;
}
.pubx-pagenav-item{
  position: relative; isolation: isolate;
  display: grid; align-items: center; gap: 1rem;
  padding: 1.4rem 1.6rem;
  background: var(--card);
  border: 1px solid var(--bdr);
  border-radius: 18px;
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  transition: transform .3s var(--ease), box-shadow .3s, border-color .3s;
}
.pubx-pagenav-item::before{
  content:''; position:absolute; inset: 0; z-index: -1;
  opacity: 0;
  background: radial-gradient(80% 120% at var(--gx,0%) 50%, var(--accent-g), transparent 60%);
  transition: opacity .35s;
}
.pubx-pagenav-item:hover{
  transform: translateY(-4px);
  border-color: rgba(201,169,97,.32);
  box-shadow: var(--shadow-1), var(--shadow-2), var(--shadow-3);
}
.pubx-pagenav-item:hover::before{ opacity: 1; }
.pubx-pagenav-prev{ grid-template-columns: auto 1fr; --gx: 0%; text-align: left; }
.pubx-pagenav-next{ grid-template-columns: 1fr auto; --gx: 100%; text-align: right; }
.pubx-pagenav-arrow{
  width: 46px; height: 46px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 14px;
  background: var(--accent-g);
  color: var(--blue-mid);
  flex-shrink: 0;
  transition: transform .3s var(--ease), background .3s, color .3s;
}
.pubx-pagenav-arrow svg{ width: 20px; height: 20px; }
.pubx-pagenav-item:hover .pubx-pagenav-arrow{
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color: #fff;
}
.pubx-pagenav-prev:hover .pubx-pagenav-arrow{ transform: translateX(-3px); }
.pubx-pagenav-next:hover .pubx-pagenav-arrow{ transform: translateX(3px); }
.pubx-pagenav-text{ display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
.pubx-pagenav-next .pubx-pagenav-text{ align-items: flex-end; }
.pubx-pagenav-lbl{
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .66rem; letter-spacing: 2px; text-transform: uppercase;
  font-weight: 800; color: var(--gold-warm);
  width: fit-content;
  padding: .25rem .6rem;
  background: var(--accent-g);
  border-radius: 100px;
}
.pubx-pagenav-title{
  font-family: var(--serif);
  font-size: 1rem; font-weight: 700;
  color: var(--t1);
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color .25s;
}
.pubx-pagenav-item:hover .pubx-pagenav-title{ color: var(--accent); }

/* ═══ Reduced motion ═══ */
@media (prefers-reduced-motion: reduce){
  .pubx-deco-1, .pubx-deco-2, .pubx-deco-3,
  .pubx-hero-scroll, .pubx-chip-dot{ animation: none; }
}

/* ═══ Responsive ═══ */
@media (max-width: 1180px){
  .pubx-grid{
    grid-template-columns: 56px minmax(0, 1fr) 280px;
    gap: 1.8rem;
  }
  .pubx-meta{ width: 280px; }
}
@media (max-width: 1024px){
  .pubx-grid{
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .pubx-dock{
    position: static;
    width: auto;
    align-self: stretch;
    order: 3;
  }
  .pubx-dock-inner{
    flex-direction: row;
    border-radius: 14px;
    padding: .75rem 1rem;
    flex-wrap: wrap;
    justify-content: center;
  }
  .pubx-dock-lbl{ writing-mode: horizontal-tb; margin-right: .35rem; }
  .pubx-dock-divider{ width: 1px; height: 24px; }
  .pubx-meta{
    position: static;
    align-self: stretch;
    order: 2;
  }
  .pubx-body{ order: 1; max-width: none; }
}
@media (max-width: 720px){
  .pubx-hero{ padding: 5rem 0 4rem; }
  .pubx-stage{ padding: 3rem 0 4rem; }
  .pubx-pdf-frame{ height: 480px; }
  .pubx-pagenav-grid{ grid-template-columns: 1fr; }
  .pubx-pagenav-next{ grid-template-columns: auto 1fr; text-align: left; }
  .pubx-pagenav-next .pubx-pagenav-text{ align-items: flex-start; }
  .pubx-pagenav-next:hover .pubx-pagenav-arrow{ transform: translateX(-3px); }
  .pubx-content > p:first-of-type::first-letter{ font-size: 3.2em; }
  .pubx-content blockquote{ padding: 1.2rem 1.3rem 1.2rem 2.3rem; }
}

/* ═══════════════════════════════════════════════
   NWX — News single (cinematic editorial)
   Effects: spotlight cursor + Ken Burns + 3D tilt
═══════════════════════════════════════════════ */
.nwx-progress{
  position:fixed; top:0; left:0; right:0; height:3px; z-index:9999;
  background: rgba(0,0,0,.06); pointer-events:none;
}
.nwx-progress span{
  display:block; height:100%; width:0%;
  background: linear-gradient(90deg, var(--gold), var(--gold-warm,#d4b97a), #fff);
  box-shadow: 0 0 18px rgba(201,169,97,.55);
  transition: width .12s linear;
}

/* HERO */
.nwx-hero{
  position:relative;
  padding: 7rem 0 6rem;
  color:#fff;
  overflow:hidden;
  isolation:isolate;
  background: radial-gradient(circle at 30% 20%, #102a44 0%, #07111e 60%, #050a13 100%);
  --mx: 50%; --my: 50%;
}
.nwx-hero-bg{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.nwx-hero-img{
  position:absolute; inset:-3%;
  background-image: var(--cover);
  background-size: cover;
  background-position: center;
  filter: blur(18px) brightness(.4) saturate(1.1);
  transform: scale(1.08);
  opacity:.85;
  animation: nwx-kenburns 24s ease-in-out infinite alternate;
}
.nwx-hero:not([style*="--cover"]) .nwx-hero-img{ display:none; }
@keyframes nwx-kenburns{
  0%   { transform: scale(1.06) translate(0, 0); }
  100% { transform: scale(1.16) translate(-1.5%, -1%); }
}
.nwx-hero-grid{
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(126,200,245,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(126,200,245,.06) 1px, transparent 1px);
  background-size: 84px 84px;
  -webkit-mask: radial-gradient(ellipse at center, #000 30%, transparent 80%);
          mask: radial-gradient(ellipse at center, #000 30%, transparent 80%);
  opacity: .45;
}
.nwx-hero-vignette{
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse at top, rgba(7,18,30,.35) 0%, transparent 60%),
    linear-gradient(180deg, rgba(7,18,30,.4) 0%, rgba(7,18,30,.85) 100%);
}
.nwx-hero-spot{
  position:absolute; inset:0;
  background: radial-gradient(circle 380px at var(--mx) var(--my),
                rgba(201,169,97,.25) 0%,
                rgba(126,200,245,.1) 35%,
                transparent 70%);
  opacity: 0;
  transition: opacity .4s ease;
  mix-blend-mode: screen;
}
.nwx-hero.is-active .nwx-hero-spot{ opacity: 1; }
.nwx-hero-noise{
  position:absolute; inset:0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .12 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  mix-blend-mode: overlay;
  opacity: .45;
  pointer-events:none;
}

.nwx-hero-inner{ position:relative; z-index:2; max-width: 1080px; }
.nwx-bc{
  display:inline-flex; flex-wrap:wrap; gap:.5rem; align-items:center;
  font-size:.78rem; color: rgba(255,255,255,.72);
  margin-bottom: 1.6rem;
  padding: .5rem .95rem;
  border:1px solid rgba(255,255,255,.12);
  border-radius:100px;
  background: rgba(255,255,255,.04);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}
.nwx-bc a{ color: rgba(255,255,255,.85); text-decoration:none; letter-spacing:.2px; }
.nwx-bc a:hover{ color: var(--gold); }
.nwx-bc svg{ color: rgba(255,255,255,.4); }
.nwx-bc span[aria-current]{ color: var(--gold); font-weight:600; }

.nwx-hero-meta{
  display:flex; flex-wrap:wrap; align-items:center; gap:.9rem;
  font-size:.78rem; color: rgba(255,255,255,.78);
  letter-spacing:.4px; margin-bottom: 1rem;
}
.nwx-chip{
  display:inline-flex; align-items:center; gap:.55rem;
  padding: .42rem .9rem;
  border:1px solid rgba(201,169,97,.32);
  border-radius:100px;
  background: rgba(201,169,97,.08);
  color: var(--gold);
  font-weight:600; letter-spacing:1.2px; text-transform:uppercase; font-size:.7rem;
}
.nwx-chip .dot{
  width:6px; height:6px; border-radius:50%; background: var(--gold);
  box-shadow: 0 0 0 0 rgba(201,169,97,.6);
  animation: nwx-pulse 2s ease-in-out infinite;
}
@keyframes nwx-pulse{
  0%,100% { box-shadow: 0 0 0 0 rgba(201,169,97,.55); }
  50%     { box-shadow: 0 0 0 7px rgba(201,169,97,0); }
}
.nwx-divider{ width:4px; height:4px; border-radius:50%; background: rgba(255,255,255,.3); }
.nwx-time{ font-size:.82rem; }

.nwx-hero-title{
  font-family: var(--serif);
  font-size: clamp(1.15rem, 1.9vw, 1.55rem);
  font-weight: 700;
  letter-spacing: -.2px;
  line-height: 1.32;
  color: #fff;
  margin: 0 0 1.1rem;
  text-wrap: balance;
  max-width: 880px;
}
.nwx-hero-lede{
  font-family: var(--serif);
  font-size: clamp(.92rem, 1.1vw, 1.04rem);
  line-height: 1.62;
  color: rgba(255,255,255,.82);
  max-width: 720px;
  margin-bottom: 1.6rem;
}

.nwx-stats{
  display:flex; flex-wrap:wrap; gap: 2rem;
  padding-top: 1.2rem;
  border-top: 1px solid rgba(255,255,255,.1);
}
.nwx-stat{ display:flex; flex-direction:column; gap:.18rem; }
.nwx-stat-num{
  font-family: var(--serif);
  font-size: 1.45rem; font-weight: 700;
  color: var(--gold);
  letter-spacing: -.4px;
  line-height: 1;
}
.nwx-stat-lbl{
  font-size: .68rem;
  color: rgba(255,255,255,.55);
  letter-spacing: 1.4px;
  text-transform: uppercase;
  font-weight: 600;
}

.nwx-scroll{ display: none; }
.nwx-scroll span{
  width: 3px; height: 8px; border-radius: 2px;
  background: var(--gold);
  animation: nwx-scrolldot 1.8s ease-in-out infinite;
}
@keyframes nwx-scrolldot{
  0%   { transform: translateY(0); opacity: 1; }
  60%  { transform: translateY(10px); opacity: 0; }
  61%  { transform: translateY(0); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

/* DOC GRID */
.nwx-doc{
  padding: 5rem 0 4rem;
  position: relative;
  background: var(--bg, #fff);
}
.nwx-doc-grid{
  display: grid;
  grid-template-columns: 64px minmax(0, 760px) 280px;
  gap: 3rem;
  align-items: start;
  margin: 0 auto;
}
.nwx-doc-grid > *{ min-width: 0; }

/* Sticky share rail */
.nwx-share{
  position: sticky; top: 110px;
  display:flex; flex-direction:column; align-items:center; gap: .9rem;
}
.nwx-share-cap{
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size:.66rem; letter-spacing: 2px;
  color: var(--t2);
  text-transform: uppercase; font-weight: 700;
}
.nwx-share-list{
  display:flex; flex-direction:column; gap: .5rem;
  padding-top: 1.1rem;
  border-top: 1px solid var(--bdr);
  width: 100%;
  align-items: center;
}
.nwx-share-list a, .nwx-share-list button{
  width: 38px; height: 38px; border-radius: 50%;
  display:flex; align-items:center; justify-content:center;
  background: rgba(37,99,168,.06);
  border: 1px solid var(--bdr);
  color: var(--blue-mid, #2563a8);
  cursor: pointer;
  transition: transform .25s, background .2s, color .2s, border-color .2s;
}
.nwx-share-list a:hover, .nwx-share-list button:hover{
  background: var(--blue-mid, #2563a8); color: #fff;
  border-color: var(--blue-mid, #2563a8);
  transform: translateY(-2px);
}
#nwxCopy.is-done{
  background: var(--gold); color:#fff; border-color: var(--gold);
}

/* Article body */
.nwx-article{ font-family: var(--serif); }
.nwx-video{
  margin: 0 0 2.5rem;
  border-radius: 14px; overflow: hidden;
  position: relative; aspect-ratio: 16/9;
  background: #07111e;
  box-shadow: 0 24px 60px rgba(7,18,30,.18);
}
.nwx-video iframe{ position:absolute; inset:0; width:100%; height:100%; border:none; }

.nwx-body{
  font-family: var(--serif);
  font-size: 1.08rem;
  line-height: 1.85;
  color: var(--t1);
  letter-spacing: .1px;
  overflow: hidden;
}
.nwx-body > p:first-of-type::first-letter{
  font-family: var(--serif);
  float: left;
  font-size: 4.2rem;
  line-height: .9;
  font-weight: 700;
  color: var(--gold);
  margin: .35rem .55rem 0 0;
}
.nwx-body p, .nwx-body div{ margin: 0 0 1.2rem; max-width: 100%; }
.nwx-body h2, .nwx-body h3, .nwx-body h4, .nwx-body h5{
  font-family: var(--serif) !important;
  font-weight: 700 !important;
  letter-spacing: -.3px;
  line-height: 1.25;
  color: var(--t1);
  margin: 2.4rem 0 .8rem;
}
.nwx-body h2{ font-size: 1.55rem; }
.nwx-body h3{ font-size: 1.28rem; }
.nwx-body h4, .nwx-body h5{ font-size: 1.08rem; color: var(--blue-mid, #2563a8); }
.nwx-body ul, .nwx-body ol{ margin: 0 0 1.3rem 1.5rem; }
.nwx-body li{ margin-bottom: .55rem; }
.nwx-body li::marker{ color: var(--gold); }
.nwx-body blockquote{
  margin: 1.8rem 0;
  padding: 1.1rem 1.4rem;
  border-left: 3px solid var(--gold);
  background: rgba(201,169,97,.06);
  border-radius: 0 12px 12px 0;
  font-style: italic;
  color: var(--t2);
}
.nwx-body img{
  max-width: 100% !important;
  height: auto;
  border-radius: 12px;
  margin: 1.5rem auto;
  display: block;
  box-shadow: 0 14px 32px rgba(7,18,30,.12);
}
.nwx-body a{
  color: var(--blue-mid, #2563a8);
  border-bottom: 1px solid rgba(37,99,168,.3);
  text-decoration: none;
  transition: border-color .2s;
}
.nwx-body a:hover{ border-bottom-color: var(--gold); }
.nwx-body table{
  width: 100%;
  border-collapse: collapse;
  margin: 1.6rem 0;
  font-size: .92rem;
  border: 1px solid var(--bdr);
  border-radius: 10px;
  overflow: hidden;
}
.nwx-body th, .nwx-body td{ padding: .75rem 1rem; border: 1px solid var(--bdr); }
.nwx-body th{
  background: rgba(37,99,168,.06);
  font-weight: 600;
  color: var(--blue-mid, #2563a8);
}

/* Files */
.nwx-files{
  margin: 3rem 0 0;
  padding: 1.8rem 0 0;
  border-top: 1px solid var(--bdr);
}
.nwx-files-head{
  display:flex; align-items:center; gap: .9rem;
  margin-bottom: 1.4rem;
}
.nwx-files-rule{ width: 32px; height: 2px; background: var(--gold); }
.nwx-files-head h3{
  font-family: var(--serif);
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--t1);
  margin: 0;
}
.nwx-files-list{ list-style: none; padding: 0; margin: 0; }
.nwx-files-list li{ border-bottom: 1px solid var(--bdr); }
.nwx-files-list a{
  display: grid;
  grid-template-columns: 60px 1fr auto;
  gap: 1.2rem;
  align-items: center;
  padding: 1.2rem .4rem;
  color: var(--t1);
  text-decoration: none;
  transition: padding .25s, color .2s;
}
.nwx-files-list a:hover{ padding-left: 1rem; color: var(--blue-mid, #2563a8); }
.nwx-f-num{
  font-family: var(--serif);
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--gold);
  letter-spacing: -.4px;
}
.nwx-f-info{ display:flex; flex-direction:column; gap:.2rem; min-width: 0; }
.nwx-f-name{
  font-family: var(--sans);
  font-size: .98rem;
  font-weight: 600;
  color: var(--t1);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.nwx-f-meta{
  font-size: .68rem;
  color: var(--t2);
  letter-spacing: 1.4px;
  text-transform: uppercase;
  font-weight: 700;
}
.nwx-f-arrow{
  width: 38px; height: 38px; border-radius: 50%;
  display:flex; align-items:center; justify-content:center;
  border: 1px solid var(--bdr);
  color: var(--blue-mid, #2563a8);
  transition: transform .3s, background .2s, color .2s, border-color .2s;
}
.nwx-files-list a:hover .nwx-f-arrow{
  background: var(--blue-mid, #2563a8);
  border-color: var(--blue-mid, #2563a8);
  color: #fff;
  transform: translateX(4px);
}

/* Sticky meta sidebar */
.nwx-meta{ position: sticky; top: 110px; }
.nwx-meta-card{
  position: relative;
  border-radius: 14px;
  padding: 1.6rem 1.4rem;
  background: linear-gradient(160deg, rgba(255,255,255,.85), rgba(248,250,253,.6));
  border: 1px solid rgba(37,99,168,.12);
  box-shadow: 0 16px 38px rgba(7,18,30,.08);
  overflow: hidden;
  isolation: isolate;
}
.nwx-meta-cover{
  position: absolute; inset: 0; z-index: -1;
  background-image: var(--c);
  background-size: cover;
  background-position: center;
  opacity: .12;
  filter: saturate(1.1);
}
.nwx-meta-cap{
  display:inline-block;
  font-size: .66rem;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--gold);
  margin-bottom: .55rem;
}
.nwx-meta-title{
  font-family: var(--serif);
  font-size: 1.08rem;
  font-weight: 700;
  letter-spacing: -.2px;
  color: var(--t1);
  margin: 0 0 1.1rem;
  line-height: 1.32;
}
.nwx-meta-list{
  list-style: none; padding: 0; margin: 0 0 1.3rem;
  border-top: 1px solid var(--bdr);
}
.nwx-meta-list li{
  display:flex; justify-content:space-between; align-items:baseline;
  padding: .65rem 0;
  border-bottom: 1px solid var(--bdr);
  font-size: .82rem;
}
.nwx-meta-list li span{ color: var(--t2); letter-spacing: .4px; }
.nwx-meta-list li b{ color: var(--t1); font-weight: 600; font-family: var(--serif); }
.nwx-meta-back{
  display:inline-flex; align-items:center; gap: .45rem;
  font-size: .78rem;
  font-weight: 600;
  color: var(--blue-mid, #2563a8);
  padding: .55rem 1rem;
  border-radius: 100px;
  border: 1px solid var(--bdr);
  text-decoration: none;
  transition: gap .25s, background .2s, border-color .2s, color .2s;
}
.nwx-meta-back:hover{
  background: var(--blue-mid, #2563a8); color: #fff; border-color: var(--blue-mid, #2563a8);
  gap: .65rem;
}

/* Prev / Next */
.nwx-nav{
  padding: 4rem 0 5rem;
  background: linear-gradient(180deg, var(--bg, #fff) 0%, var(--bg2, #f8fafd) 100%);
}
.nwx-nav-head{ text-align: center; margin-bottom: 2.4rem; }
.nwx-eyebrow{
  display:inline-block;
  font-size: .72rem;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--gold);
  margin-bottom: .6rem;
}
.nwx-nav-head h2{
  font-family: var(--serif);
  font-size: clamp(1.4rem, 2.4vw, 2rem);
  font-weight: 700;
  letter-spacing: -.5px;
  color: var(--t1);
  margin: 0;
}
.nwx-nav-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.6rem;
  max-width: 980px;
  margin: 0 auto;
}
.nwx-nav-grid.is-single{ grid-template-columns: minmax(0, 480px); justify-content: center; }
.nwx-nav-card{
  position: relative;
  display: grid;
  grid-template-rows: auto 200px auto auto;
  gap: .85rem;
  padding: 1.4rem;
  border-radius: 16px;
  background: linear-gradient(160deg, rgba(255,255,255,.85), rgba(248,250,253,.6));
  border: 1px solid rgba(37,99,168,.14);
  box-shadow: 0 16px 38px rgba(7,18,30,.08);
  text-decoration: none;
  color: var(--t1);
  overflow: hidden;
  transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s, border-color .25s;
  transform-style: preserve-3d;
  --mx: 50%; --my: 50%;
}
.nwx-nav-card::before{
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(circle 240px at var(--mx) var(--my), rgba(201,169,97,.18) 0%, transparent 60%);
  opacity: 0;
  transition: opacity .35s;
  pointer-events: none;
}
.nwx-nav-card:hover{
  border-color: rgba(201,169,97,.45);
  box-shadow: 0 28px 60px rgba(7,18,30,.18);
}
.nwx-nav-card:hover::before{ opacity: 1; }
.nwx-nav-dir{
  display:inline-flex; align-items:center; gap: .4rem;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--blue-mid, #2563a8);
  width: fit-content;
  position: relative; z-index: 1;
}
.nwx-nav-card.next .nwx-nav-dir{ margin-left: auto; }
.nwx-nav-thumb{
  width: 100%; height: 100%;
  border-radius: 12px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(37,99,168,.08), rgba(201,169,97,.08));
  position: relative; z-index: 1;
}
.nwx-nav-thumb img{
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .8s cubic-bezier(.22,1,.36,1), filter .35s;
  filter: saturate(.9);
}
.nwx-nav-card:hover .nwx-nav-thumb img{ transform: scale(1.06); filter: saturate(1.05); }
.nwx-nav-title{
  font-family: var(--serif);
  font-size: 1.08rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--t1);
  margin: 0;
  letter-spacing: -.2px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
          line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  position: relative; z-index: 1;
}
.nwx-nav-card.next .nwx-nav-title{ text-align: right; }
.nwx-nav-date{
  font-size: .76rem;
  color: var(--t2);
  letter-spacing: .3px;
  position: relative; z-index: 1;
}
.nwx-nav-card.next .nwx-nav-date{ text-align: right; }

/* Dark mode */
[data-theme="dark"] .nwx-doc{ background: var(--bg, #07111e); }
[data-theme="dark"] .nwx-meta-card,
[data-theme="dark"] .nwx-nav-card{
  background: linear-gradient(160deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border-color: rgba(126,200,245,.14);
  color: #e8eef9;
}
[data-theme="dark"] .nwx-meta-list li b,
[data-theme="dark"] .nwx-nav-title{ color: #fff; }
[data-theme="dark"] .nwx-share-list a,
[data-theme="dark"] .nwx-share-list button{
  background: rgba(255,255,255,.04);
  border-color: rgba(126,200,245,.14);
  color: #7ec8f5;
}
[data-theme="dark"] .nwx-share-list a:hover,
[data-theme="dark"] .nwx-share-list button:hover{
  background: var(--gold); color: #fff; border-color: var(--gold);
}
[data-theme="dark"] .nwx-files-list a:hover{ color: #7ec8f5; }
[data-theme="dark"] .nwx-f-arrow{ border-color: rgba(126,200,245,.14); color: #7ec8f5; }
[data-theme="dark"] .nwx-f-num{ color: var(--gold); }
[data-theme="dark"] .nwx-progress{ background: rgba(255,255,255,.04); }

/* Responsive */
@media (max-width: 1100px){
  .nwx-doc-grid{ grid-template-columns: minmax(0, 1fr) 280px; }
  .nwx-share{ display: none; }
}
@media (max-width: 880px){
  .nwx-hero{ padding: 5rem 0 4rem; }
  .nwx-hero-title{ font-size: clamp(1.3rem, 5vw, 1.85rem); }
  .nwx-doc-grid{ grid-template-columns: 1fr; gap: 2rem; }
  .nwx-meta{ position: static; }
  .nwx-doc{ padding: 3rem 0 2rem; }
  .nwx-stats{ gap: 1.5rem; }
  .nwx-stat-num{ font-size: 1.4rem; }
  .nwx-nav-grid{ grid-template-columns: 1fr; }
  .nwx-scroll{ display: none; }
}
@media (max-width: 560px){
  .nwx-hero{ padding: 4.5rem 0 2.5rem; }
  .nwx-bc{ font-size: .72rem; padding: .4rem .7rem; }
  .nwx-files-list a{ grid-template-columns: 40px 1fr 32px; gap: .85rem; }
  .nwx-f-num{ font-size: 1.2rem; }
  .nwx-body > p:first-of-type::first-letter{ font-size: 3.2rem; }
}
@media (prefers-reduced-motion: reduce){
  .nwx-hero-img{ animation: none; }
  .nwx-chip .dot{ animation: none; }
  .nwx-scroll span{ animation: none; }
}

/* ═══════════════════════════════════════════════
   HEADER FX — Logo radar pulse + magnetic nav
═══════════════════════════════════════════════ */
#hdr .logo{
  position: relative;
  isolation: isolate;
}
#hdr .logo::before,
#hdr .logo::after{
  content: "";
  position: absolute;
  top: 50%; left: 28px;
  width: 14px; height: 14px;
  border-radius: 50%;
  border: 1px solid rgba(201,169,97,.55);
  transform: translate(-50%, -50%) scale(1);
  opacity: 0;
  pointer-events: none;
  z-index: -1;
  animation: hdr-radar 4.4s cubic-bezier(.22,1,.36,1) infinite;
}
#hdr .logo::after{ animation-delay: 2.2s; }
@keyframes hdr-radar{
  0%   { transform: translate(-50%, -50%) scale(.6); opacity: 0; border-width: 1.5px; }
  10%  { opacity: .7; }
  100% { transform: translate(-50%, -50%) scale(4.4); opacity: 0; border-width: 0.5px; }
}

/* Magnetic nav links — smooth return */
#hdr .nav-links > .nav-item > a,
#hdr .btn-proposal{
  transition: transform .35s cubic-bezier(.22,1,.36,1), color .25s, background .25s, border-color .25s;
  will-change: transform;
}

/* ═══════════════════════════════════════════════
   FOOTER FX — Dot grid + parallax spotlight (Variant B)
═══════════════════════════════════════════════ */
#ftr{ position: relative; isolation: isolate; --mx: 50%; --my: 50%; overflow: hidden; }

#ftr.has-fx::before,
#ftr.has-fx::after{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

/* Dot grid — base layer, parallax shifted */
#ftr.has-fx::before{
  background-image: radial-gradient(circle at center, rgba(201,169,97,.22) 1.2px, transparent 1.6px);
  background-size: 26px 26px;
  background-position: 0 0;
  -webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 85%);
          mask-image: radial-gradient(ellipse at center, #000 30%, transparent 85%);
  opacity: .8;
  transform: translate(calc((var(--mx) - 50%) * -0.08), calc((var(--my) - 50%) * -0.08));
  transition: transform .25s ease-out;
}

/* Spotlight glow that follows mouse */
#ftr.has-fx::after{
  background: radial-gradient(circle 480px at var(--mx) var(--my),
                rgba(201,169,97,.18) 0%,
                rgba(126,200,245,.08) 40%,
                transparent 70%);
  mix-blend-mode: screen;
  opacity: 0;
  transition: opacity .5s ease;
}
#ftr.has-fx:hover::after{ opacity: 1; }

/* Make footer content sit above effects */
#ftr > *{ position: relative; z-index: 1; }

/* Mobile: disable magnetic & lighten effects */
@media (max-width: 980px){
  #hdr .nav-links > .nav-item > a{ transform: none !important; }
}
@media (prefers-reduced-motion: reduce){
  #hdr .logo::before, #hdr .logo::after{ animation: none; opacity: 0; }
  #ftr.has-fx::before{ transition: none; transform: none; }
  #ftr.has-fx::after{ transition: none; }
}

/* ═══════════════════════════════════════════════
   HEADER — DFF-style structural refinements
   (logo bottom underline + vertical dividers between right-side controls)
═══════════════════════════════════════════════ */

/* Logo: o'ng vertikal chiziq olinadi, ostidan kichik gorizontal aksent qo'shiladi */
#hdr .logo{
  border-right: none !important;
  padding-right: 1.25rem;
}
#hdr .logo::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 14px;
  width: 38px;
  height: 2px;
  background: linear-gradient(90deg,
    var(--blue-mid) 0%,
    var(--blue-pale) 60%,
    transparent 100%);
  border-radius: 2px;
  opacity: .72;
  pointer-events: none;
  /* logo radar pulse animation override — top/scale qaytalashidan saqlash uchun */
  top: auto;
  transform: none;
  border: none;
  border-radius: 2px;
}
[data-theme="dark"] #hdr .logo::after{
  background: linear-gradient(90deg,
    var(--blue-pale) 0%,
    rgba(126,200,245,.6) 60%,
    transparent 100%);
}

/* Right-side controls: chap chiziq olinadi, o'rniga har bir element orasida vertikal ajratgich */
#hdr .nav-right{
  border-left: none !important;
  padding-left: .5rem;
  gap: 0;
}
#hdr .nav-right > *{
  position: relative;
  margin: 0 .35rem;
}
#hdr .nav-right > * + *::before{
  content: "";
  position: absolute;
  left: -.4rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 22px;
  background: var(--bdr);
  pointer-events: none;
}
[data-theme="dark"] #hdr .nav-right > * + *::before{
  background: rgba(255,255,255,.08);
}

/* Mobil ≤900px — ajratgichlarni yumshatamiz, joy tor */
@media (max-width: 900px){
  #hdr .nav-right{ padding-left: .25rem; }
  #hdr .nav-right > *{ margin: 0 .25rem; }
  #hdr .nav-right > * + *::before{ left: -.28rem; height: 18px; }
}

/* ═══════════════════════════════════════════════
   FOOTER — kichik "Taklif yuborish" ftr-bot ichidagi link
   Joriy fbot-links style'ini meros oladi, alohida ajralib turmaydi.
   Faqat birinchi havolaga sof kichik aksent (subtle accent) beriladi.
═══════════════════════════════════════════════ */
.fbot-links li:first-child a{
  color: rgba(255,255,255,.72);
  font-weight: 500;
}
.fbot-links li:first-child a:hover{
  color: #fff;
}

/* ═══════════════════════════════════════════════════════════════
   PRESS HUB — /press (Economist-style overview)
   prefix: .prx-
═══════════════════════════════════════════════════════════════ */

/* ── MASTHEAD ── */
.prx-masthead{padding:2.4rem 0 1.6rem;border-bottom:1px solid var(--bdr);position:relative;overflow:hidden}
.prx-masthead::before{content:"";position:absolute;inset:0;background:radial-gradient(800px 360px at 12% -20%,var(--accent-g),transparent 60%),radial-gradient(700px 320px at 95% 110%,var(--accent-g),transparent 60%);pointer-events:none;z-index:0}
.prx-masthead > .container{position:relative;z-index:1}
/* Breadcrumb on the light masthead — readable dark text only */
.prx-masthead .breadcrumb{color:var(--t2)}
.prx-masthead .breadcrumb a{color:var(--t2)}
.prx-masthead .breadcrumb a:hover{color:var(--blue-mid)}
.prx-masthead .breadcrumb [aria-current]{color:var(--blue-mid)}
.prx-mh-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:3rem;align-items:end;padding:1.6rem 0 1.4rem}
.prx-mh-eyebrow{display:inline-flex;align-items:center;gap:.55rem;font-size:.74rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin:0 0 1rem}
.prx-mh-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-g);animation:prxPulse 2.4s ease-in-out infinite}
@keyframes prxPulse{0%,100%{box-shadow:0 0 0 0 var(--accent-g)}50%{box-shadow:0 0 0 8px transparent}}
.prx-mh-title{font-family:var(--serif);font-size:clamp(2.2rem,5vw,4rem);line-height:1.04;letter-spacing:-1px;font-weight:700;color:var(--t1);margin:0 0 1rem}
.prx-mh-sub{font-size:1.02rem;color:var(--t2);max-width:560px;line-height:1.7;margin:0}
.prx-mh-r{display:flex;flex-direction:column;align-items:flex-end;gap:1.2rem}
.prx-mh-rule{width:140px;height:3px;background:linear-gradient(90deg,transparent,var(--accent),transparent);border-radius:2px}
/* editorial / institutional stats — restrained, monochrome with gold accent */
.prx-mh-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:0;width:100%;margin:0;padding:.6rem 0;border-top:1px solid var(--bdr);border-bottom:1px solid var(--bdr)}
.prx-mh-stat{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:.55rem;padding:1.1rem 1rem;text-decoration:none;color:inherit;border-right:1px solid var(--bdr);transition:background var(--tr)}
.prx-mh-stat:last-child{border-right:none}
.prx-mh-stat::before{content:"";position:absolute;left:0;bottom:-1px;width:0;height:2px;background:var(--gold);transition:width .45s var(--ease)}
.prx-mh-stat:hover{background:var(--bg3)}
.prx-mh-stat:hover::before{width:100%}
.prx-stat-idx{font-family:var(--serif);font-style:italic;font-size:.78rem;font-weight:700;color:var(--gold-warm,var(--gold));letter-spacing:.02em;line-height:1}
.prx-stat-lbl{font-size:.66rem;text-transform:uppercase;letter-spacing:.16em;color:var(--t2);font-weight:700;line-height:1.4;margin:0}
.prx-stat-num{font-family:var(--serif);font-size:2.1rem;font-weight:700;color:var(--t1);line-height:1;letter-spacing:-1.5px;margin:0;transition:color var(--tr)}
.prx-mh-stat:hover .prx-stat-num{color:var(--accent)}

/* ── Masthead — rasm/video fon (admin /page-heroes orqali) ── */
.prx-masthead.has-media{ border-bottom:0; }
.prx-masthead.has-media::before{ display:none; } /* dekorativ gradientni o'chiramiz */

/* Video fon qatlami */
.prx-mh-video{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; z-index:0; pointer-events:none;
}
.prx-mh-media-overlay{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(11,26,43,.9) 0%, rgba(11,26,43,.5) 30%, rgba(11,26,43,.78) 100%),
    linear-gradient(135deg, rgba(11,26,43,.55) 0%, rgba(11,26,43,.35) 55%, rgba(11,26,43,.8) 100%);
}

/* Rasm fon (video bo'lmaganda, --ph-bg orqali) */
.prx-masthead.has-media[style*="--ph-bg"]{
  background-image:
    linear-gradient(180deg, rgba(11,26,43,.9) 0%, rgba(11,26,43,.5) 30%, rgba(11,26,43,.78) 100%),
    linear-gradient(135deg, rgba(11,26,43,.55) 0%, rgba(11,26,43,.35) 55%, rgba(11,26,43,.8) 100%),
    var(--ph-bg);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}

/* Media ustida matnlar — oq */
.prx-masthead.has-media .breadcrumb,
.prx-masthead.has-media .breadcrumb a,
.prx-masthead.has-media .breadcrumb svg{ color:rgba(255,255,255,.92); }
.prx-masthead.has-media .breadcrumb a:hover{ color:#fff; }
.prx-masthead.has-media .breadcrumb [aria-current]{ color:var(--gold-soft); }
.prx-masthead.has-media .prx-mh-title,
.prx-masthead.has-media .prx-stat-num{ color:#fff; }
.prx-masthead.has-media .prx-mh-sub,
.prx-masthead.has-media .prx-stat-lbl{ color:rgba(255,255,255,.85); }
.prx-masthead.has-media .prx-mh-title{ text-shadow:0 1px 16px rgba(0,0,0,.5); }
.prx-masthead.has-media .prx-mh-stat{ border-right-color:rgba(255,255,255,.18); }
.prx-masthead.has-media .prx-mh-stat:hover{ background:rgba(255,255,255,.08); }
.prx-masthead.has-media .prx-mh-stat:hover .prx-stat-num{ color:var(--gold-soft); }
.prx-masthead.has-media .prx-mh-rule{ background:linear-gradient(180deg,transparent,rgba(255,255,255,.5),transparent); }
.prx-masthead.has-media .prx-tabs{ border-top-color:rgba(255,255,255,.22); }

/* ── QUICK-JUMP TABS ── */
.prx-tabs{display:flex;flex-wrap:wrap;gap:.55rem;padding:1.1rem 0 0;border-top:1px dashed var(--bdr);margin-top:1rem}
.prx-tab{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.05rem;font-size:.82rem;font-weight:600;color:var(--t2);background:var(--bg2);border:1px solid var(--bdr);border-radius:999px;transition:all var(--tr);text-decoration:none;white-space:nowrap}
.prx-tab svg{width:14px;height:14px;flex-shrink:0}
.prx-tab:hover{color:var(--accent);border-color:var(--bdr-h);background:var(--accent-g)}
.prx-tab.is-active{color:#fff;background:var(--accent);border-color:var(--accent);box-shadow:0 4px 14px var(--accent-g)}
.prx-tab.is-active:hover{color:#fff}

/* ── SECTION HEAD (shared) ── */
.prx-sec-head{display:flex;align-items:center;gap:1.2rem;padding:0 0 1.5rem;margin:0 0 1.8rem;border-bottom:1px solid var(--bdr);position:relative}
.prx-sec-head::after{content:"";position:absolute;bottom:-1px;left:0;width:80px;height:2px;background:var(--accent);border-radius:2px}
.prx-sec-num{font-family:var(--serif);font-size:2.4rem;font-weight:700;color:var(--accent);opacity:.55;line-height:1;letter-spacing:-1.5px;flex-shrink:0}
.prx-sec-eyebrow{font-size:.7rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--t2);margin:0 0 .35rem}
.prx-sec-title{font-family:var(--serif);font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:700;color:var(--t1);margin:0;line-height:1.1;letter-spacing:-.5px}
.prx-sec-all{margin-left:auto;display:inline-flex;align-items:center;gap:.5rem;font-size:.82rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);text-decoration:none;padding:.6rem 1rem;border:1px solid var(--bdr);border-radius:8px;transition:all var(--tr);white-space:nowrap}
.prx-sec-all svg{width:14px;height:14px;transition:transform .3s var(--ease)}
.prx-sec-all:hover{color:#fff;background:var(--accent);border-color:var(--accent)}
.prx-sec-all:hover svg{transform:translateX(3px)}

/* ── COVER STORY (news) ── */
.prx-cover-sec{padding:2.6rem 0 2rem}
.prx-cover-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:2rem;align-items:start}
.prx-cover-main{display:block;text-decoration:none;color:inherit;background:var(--bg2);border:1px solid var(--bdr);border-radius:14px;overflow:hidden;transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color var(--tr)}
.prx-cover-main:hover{transform:translateY(-4px);border-color:var(--bdr-h);box-shadow:0 20px 50px -20px rgba(0,0,0,.25)}
.prx-cover-img{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--bg3)}
.prx-cover-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.prx-cover-main:hover .prx-cover-img img{transform:scale(1.04)}
.prx-cover-img-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--t3)}
.prx-cover-img-ph svg{width:64px;height:64px}
.prx-cover-badge{position:absolute;top:1rem;left:1rem;display:inline-flex;align-items:center;gap:.45rem;padding:.45rem .85rem;background:rgba(0,0,0,.75);color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border-radius:999px;backdrop-filter:blur(6px)}
.prx-cover-badge-dot{width:6px;height:6px;border-radius:50%;background:#ef4444;box-shadow:0 0 0 0 rgba(239,68,68,.6);animation:prxBlink 1.6s ease-in-out infinite}
@keyframes prxBlink{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.55)}50%{box-shadow:0 0 0 8px transparent}}
.prx-cover-body{padding:1.6rem 1.7rem 1.7rem}
.prx-cover-cat{font-size:.7rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin:0 0 .65rem}
.prx-cover-title{font-family:var(--serif);font-size:clamp(1.4rem,2.3vw,1.85rem);line-height:1.18;letter-spacing:-.5px;color:var(--t1);margin:0 0 .85rem;font-weight:700}
.prx-cover-desc{color:var(--t2);font-size:.96rem;line-height:1.65;margin:0 0 1.1rem}
.prx-cover-foot{display:flex;align-items:center;flex-wrap:wrap;gap:1.1rem;padding-top:1rem;border-top:1px solid var(--bdr)}
.prx-cover-date,.prx-cover-views{display:inline-flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--t2)}
.prx-cover-date svg,.prx-cover-views svg{width:14px;height:14px}
.prx-cover-cta{margin-left:auto;display:inline-flex;align-items:center;gap:.45rem;font-size:.82rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.05em}
.prx-cover-cta svg{width:14px;height:14px;transition:transform .3s var(--ease)}
.prx-cover-main:hover .prx-cover-cta svg{transform:translateX(4px)}

/* ── NEWS LIST (right column) ── */
.prx-news-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.65rem}
.prx-news-item{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:.85rem;padding:.85rem .9rem;background:var(--bg2);border:1px solid var(--bdr);border-radius:11px;text-decoration:none;color:inherit;transition:all var(--tr)}
.prx-news-item:hover{background:var(--card-h);border-color:var(--bdr-h);transform:translateX(3px)}
.prx-news-num{font-family:var(--serif);font-size:1.2rem;font-weight:700;color:var(--accent);opacity:.65;line-height:1}
.prx-news-text{min-width:0}
.prx-news-h{font-family:var(--serif);font-size:.98rem;font-weight:600;color:var(--t1);margin:0 0 .25rem;line-height:1.32;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.prx-news-date{font-size:.74rem;color:var(--t2)}
.prx-news-thumb{width:54px;height:54px;border-radius:8px;overflow:hidden;flex-shrink:0;background:var(--bg3)}
.prx-news-thumb img{width:100%;height:100%;object-fit:cover}

/* ── CONFERENCES TIMELINE ── */
.prx-conf-sec{padding:2.4rem 0;background:linear-gradient(180deg,transparent,var(--bg3) 50%,transparent)}
.prx-timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.15rem}
.prx-tl-item{display:grid;grid-template-columns:120px 32px 1fr;gap:1rem;align-items:stretch;position:relative}
.prx-tl-date{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:.95rem .55rem;background:var(--bg2);border:1px solid var(--bdr);border-radius:11px;text-align:center}
.prx-tl-day{font-family:var(--serif);font-size:2rem;font-weight:700;color:var(--t1);line-height:1;letter-spacing:-1px}
.prx-tl-mon{font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-top:.35rem}
.prx-tl-year{font-size:.7rem;color:var(--t2);margin-top:.2rem}
.prx-tl-stem{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:1.7rem;position:relative}
.prx-tl-bullet{width:14px;height:14px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-g);flex-shrink:0;z-index:1}
.prx-tl-line{flex:1;width:2px;background:var(--bdr);margin-top:.5rem}
.prx-tl-item:last-child .prx-tl-line{display:none}
.prx-tl-card{display:flex;gap:1.1rem;padding:1.05rem 1.2rem;background:var(--bg2);border:1px solid var(--bdr);border-radius:12px;text-decoration:none;color:inherit;transition:all var(--tr);position:relative;overflow:hidden}
.prx-tl-card::before{content:"";position:absolute;top:1.7rem;left:-8px;width:14px;height:14px;background:var(--bg2);border-left:1px solid var(--bdr);border-bottom:1px solid var(--bdr);transform:rotate(45deg);transition:background var(--tr),border-color var(--tr);z-index:1}
.prx-tl-card:hover{transform:translateX(4px);border-color:var(--bdr-h);background:var(--card-h);box-shadow:0 12px 28px -16px rgba(0,0,0,.18)}
.prx-tl-card:hover::before{background:var(--card-h);border-color:var(--bdr-h)}
.prx-tl-thumb{position:relative;flex-shrink:0;width:160px;aspect-ratio:4/3;border-radius:9px;overflow:hidden;background:var(--bg3);align-self:center}
.prx-tl-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.prx-tl-card:hover .prx-tl-thumb img{transform:scale(1.06)}
.prx-tl-body{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}
.prx-tl-tag{font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 .55rem}
.prx-tl-title{font-family:var(--serif);font-size:1.18rem;font-weight:700;color:var(--t1);margin:0 0 .55rem;line-height:1.25}
.prx-tl-desc{color:var(--t2);font-size:.9rem;line-height:1.6;margin:0 0 .85rem;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.prx-tl-cta{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.05em;margin-top:auto}
.prx-tl-cta svg{width:13px;height:13px;transition:transform .3s var(--ease)}
.prx-tl-card:hover .prx-tl-cta svg{transform:translateX(3px)}

/* ── MATERIALS GRID ── */
.prx-mat-sec{padding:2.6rem 0}
.prx-mat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.4rem}
.prx-mat-card{display:flex;flex-direction:column;background:var(--bg2);border:1px solid var(--bdr);border-radius:13px;text-decoration:none;color:inherit;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color var(--tr);position:relative;overflow:hidden}
.prx-mat-card:hover{transform:translateY(-5px);border-color:var(--bdr-h);box-shadow:0 22px 48px -22px rgba(0,0,0,.28)}
.prx-mat-cover{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(135deg,var(--bg3),var(--accent-g))}
.prx-mat-cover img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.prx-mat-card:hover .prx-mat-cover img{transform:scale(1.07)}
.prx-mat-cover-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--accent);opacity:.55}
.prx-mat-cover-ph svg{width:48px;height:48px}
.prx-mat-cover-tag{position:absolute;top:.85rem;left:.85rem;display:inline-block;padding:.35rem .75rem;background:rgba(0,0,0,.72);color:#fff;font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;border-radius:999px;backdrop-filter:blur(6px)}
.prx-mat-body{flex:1;display:flex;flex-direction:column;padding:1.2rem 1.25rem 1.3rem}
.prx-mat-title{font-family:var(--serif);font-size:1.08rem;font-weight:700;color:var(--t1);margin:0 0 .55rem;line-height:1.32;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.prx-mat-desc{color:var(--t2);font-size:.86rem;line-height:1.6;margin:0 0 1rem;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex:1}
.prx-mat-foot{display:flex;align-items:center;gap:.6rem;padding-top:.85rem;border-top:1px dashed var(--bdr)}
.prx-mat-date{display:inline-flex;align-items:center;gap:.4rem;font-size:.76rem;color:var(--t2)}
.prx-mat-date svg{width:13px;height:13px}
.prx-mat-arrow{margin-left:auto;width:30px;height:30px;border-radius:50%;background:var(--accent-g);color:var(--accent);display:inline-flex;align-items:center;justify-content:center;transition:transform .3s var(--ease),background var(--tr),color var(--tr)}
.prx-mat-arrow svg{width:14px;height:14px}
.prx-mat-card:hover .prx-mat-arrow{background:var(--accent);color:#fff;transform:translateX(3px)}

/* ── SHARED IMAGE PLACEHOLDER (when no image available) ── */
.prx-img-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--blue-dark),var(--blue-mid));color:var(--gold)}
.prx-img-ph-letter{font-family:var(--serif);font-style:italic;font-weight:800;font-size:3.4rem;line-height:1;letter-spacing:-1px}
.prx-tl-thumb .prx-img-ph-letter{font-size:2.2rem}

/* ── PHOTO GALLERY (uniform grid + carousel) ── */
.prx-photo-sec{padding:2.6rem 0;background:linear-gradient(180deg,transparent,var(--bg3) 50%,transparent)}

/* shared tile/slide visuals */
.prx-photo-tile,.prx-photo-slide{position:relative;display:block;overflow:hidden;border-radius:12px;background:var(--bg3);text-decoration:none;aspect-ratio:4/3;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.prx-photo-tile img,.prx-photo-slide img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease),filter var(--tr);display:block}
.prx-photo-tile:hover,.prx-photo-slide:hover{transform:translateY(-3px);box-shadow:0 18px 40px -22px rgba(0,0,0,.3)}
.prx-photo-tile:hover img,.prx-photo-slide:hover img{transform:scale(1.06)}
.prx-photo-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:.95rem;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.78));opacity:0;transition:opacity var(--tr)}
.prx-photo-tile:hover .prx-photo-overlay,.prx-photo-slide:hover .prx-photo-overlay{opacity:1}
.prx-photo-zoom{position:absolute;top:.85rem;right:.85rem;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.95);color:#0d1e30;display:flex;align-items:center;justify-content:center;transform:scale(.6);transition:transform .35s var(--ease)}
.prx-photo-zoom svg{width:16px;height:16px}
.prx-photo-tile:hover .prx-photo-zoom,.prx-photo-slide:hover .prx-photo-zoom{transform:scale(1)}
.prx-photo-cap{font-size:.82rem;color:#fff;font-weight:600;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* uniform grid for ≤4 photos (compact tiles, never stretch) */
.prx-photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,200px));gap:.7rem;justify-content:start}

/* carousel for 5+ photos — 6 visible on desktop */
.prx-photo-carousel{position:relative;padding:0 0 2rem}
.prx-photo-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 5 * 10px) / 6);gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:.3rem .1rem .8rem}
.prx-photo-track::-webkit-scrollbar{display:none}
.prx-photo-slide{scroll-snap-align:start}
.prx-photo-nav{position:absolute;top:calc(50% - 1.2rem);width:46px;height:46px;border-radius:50%;background:var(--bg2);border:1px solid var(--bdr);color:var(--t1);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 22px -8px rgba(0,0,0,.35);transition:all var(--tr);z-index:3}
.prx-photo-nav svg{width:20px;height:20px}
.prx-photo-nav:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-50%) scale(1.06)}
.prx-photo-prev{left:-18px;transform:translateY(-50%)}
.prx-photo-next{right:-18px;transform:translateY(-50%)}
.prx-photo-dots{display:flex;justify-content:center;gap:.45rem;margin-top:1.2rem}
.prx-photo-dot{width:8px;height:8px;border-radius:50%;background:var(--bdr);border:none;padding:0;cursor:pointer;transition:all var(--tr)}
.prx-photo-dot.is-active{background:var(--accent);transform:scale(1.3)}
.prx-photo-dot:hover{background:var(--bdr-h)}

/* ── VIDEO GRID ── */
.prx-video-sec{padding:2.8rem 0 3rem}
.prx-video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1.2rem}
.prx-video-card{display:block;padding:0;background:transparent;border:none;text-align:left;cursor:pointer;color:inherit;transition:transform .35s var(--ease)}
.prx-video-card:hover{transform:translateY(-4px)}
.prx-video-thumb{position:relative;display:block;aspect-ratio:16/9;border-radius:13px;overflow:hidden;background:#000;border:1px solid var(--bdr)}
.prx-video-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease),filter .35s var(--ease)}
.prx-video-card:hover .prx-video-thumb img{transform:scale(1.06);filter:brightness(.7)}
.prx-video-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.96);color:var(--accent);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 28px rgba(0,0,0,.45);transition:transform .35s var(--ease),background var(--tr)}
.prx-video-play svg{width:24px;height:24px;margin-left:3px}
.prx-video-card:hover .prx-video-play{transform:translate(-50%,-50%) scale(1.1);background:var(--accent);color:#fff}
.prx-video-meta{display:flex;align-items:center;justify-content:space-between;padding:.85rem .15rem 0}
.prx-video-tag{font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.prx-video-num{font-family:var(--serif);font-size:.95rem;font-weight:700;color:var(--t2);letter-spacing:-.5px}

/* ── VIDEO MODAL ── */
.prx-video-modal{position:fixed;inset:0;background:rgba(4,12,26,.92);z-index:9999;display:flex;align-items:center;justify-content:center;padding:2rem;opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s}
.prx-video-modal.is-open{opacity:1;visibility:visible}
.prx-video-modal-inner{width:100%;max-width:1100px;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000;box-shadow:0 30px 80px rgba(0,0,0,.6);transform:scale(.94);transition:transform .35s var(--ease)}
.prx-video-modal.is-open .prx-video-modal-inner{transform:scale(1)}
.prx-video-modal-frame,.prx-video-modal-frame iframe{width:100%;height:100%;border:0;display:block}
.prx-video-modal-close{position:absolute;top:1.4rem;right:1.4rem;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background var(--tr)}
.prx-video-modal-close:hover{background:rgba(255,255,255,.22)}
.prx-video-modal-close svg{width:22px;height:22px}

/* ── RESPONSIVE ── */
@media (max-width:1024px){
  .prx-mh-grid{grid-template-columns:1fr;gap:1.6rem}
  .prx-mh-r{align-items:flex-start;width:100%}
  .prx-mh-rule{align-self:flex-start}
  .prx-mh-stats{grid-template-columns:repeat(5,1fr)}
  .prx-cover-grid{grid-template-columns:1fr;gap:1.6rem}
  .prx-photo-track{grid-auto-columns:calc((100% - 4 * 10px) / 5)}
  .prx-photo-prev{left:-10px}
  .prx-photo-next{right:-10px}
}
@media (max-width:900px){
  .prx-photo-track{grid-auto-columns:calc((100% - 3 * 10px) / 4)}
  .prx-tl-thumb{width:120px;aspect-ratio:1/1}
  .prx-tl-thumb .prx-img-ph-letter{font-size:1.7rem}
}
@media (max-width:768px){
  .prx-photo-track{grid-auto-columns:calc((100% - 2 * 10px) / 3)}
  .prx-masthead{padding:1.6rem 0 1.2rem}
  .prx-mh-stats{grid-template-columns:repeat(3,1fr)}
  .prx-mh-stat{padding:.85rem .8rem;border-bottom:1px solid var(--bdr)}
  .prx-mh-stat:nth-child(3){border-right:none}
  .prx-mh-stat:nth-last-child(-n+2){border-bottom:none}
  .prx-stat-num{font-size:1.7rem}
  .prx-tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:.4rem;-webkit-overflow-scrolling:touch}
  .prx-tabs::-webkit-scrollbar{display:none}
  .prx-sec-head{flex-wrap:wrap}
  .prx-sec-num{font-size:1.8rem}
  .prx-sec-all{margin-left:0;width:100%;justify-content:space-between;margin-top:.6rem;order:3}
  .prx-cover-body{padding:1.2rem}
  .prx-tl-item{grid-template-columns:80px 22px 1fr;gap:.65rem}
  .prx-tl-day{font-size:1.5rem}
  .prx-tl-card{flex-direction:column;padding:0;gap:0}
  .prx-tl-thumb{width:100%;aspect-ratio:16/9;border-radius:11px 11px 0 0}
  .prx-tl-body{padding:1rem 1.1rem 1.1rem}
  .prx-tl-card::before{top:1.4rem;width:11px;height:11px;left:-7px}
  .prx-tl-card.has-img::before{display:none}
  .prx-video-modal{padding:1rem}
  .prx-video-modal-close{top:.8rem;right:.8rem}
}
@media (max-width:560px){
  .prx-photo-track{grid-auto-columns:calc((100% - 10px) / 2)}
  .prx-photo-prev{left:6px}
  .prx-photo-next{right:6px}
}
@media (max-width:480px){
  .prx-mh-stats{grid-template-columns:repeat(2,1fr)}
  .prx-mh-stat:nth-child(2n){border-right:none}
  .prx-mh-stat:nth-child(2n+1){border-right:1px solid var(--bdr)}
  .prx-mh-stat:nth-last-child(-n+1){border-bottom:none}
  .prx-news-item{grid-template-columns:28px 1fr;gap:.7rem;padding:.75rem}
  .prx-news-thumb{display:none}
}

/* ═══════════════════════════════════════════════════════════════
   ADMINISTRATIONS — /administrations (uniform leadership grid)
   prefix: .adm-
═══════════════════════════════════════════════════════════════ */
.adm-grid{
  display:flex; flex-direction:column;
  gap:1.4rem;
  margin:2.5rem 0 3rem;
}
.adm-card{
  display:grid;
  grid-template-columns:240px 1fr;
  align-items:start;
  gap:0;
  background:var(--bg2);
  border:1px solid var(--bdr);
  border-radius:14px;
  overflow:hidden;
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color var(--tr);
}
.adm-card:hover{
  transform:translateY(-3px);
  border-color:var(--bdr-h);
  box-shadow:0 22px 48px -22px rgba(8,15,30,.22);
}
.adm-card-photo{
  position:relative;
  aspect-ratio:4/5;
  width:100%;
  align-self:start;
  overflow:hidden;
  background:var(--bg3);
}
.adm-card-photo img{
  width:100%; height:100%;
  object-fit:cover; object-position:center top;
  transition:transform .8s var(--ease), filter var(--tr);
}
.adm-card:hover .adm-card-photo img{ transform:scale(1.04); filter:saturate(1.05) }
.adm-card-photo::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, transparent 70%, rgba(8,15,30,.08));
  pointer-events:none;
}
.adm-card-photo-ph{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color:var(--gold);
}
.adm-card-photo-letter{
  font-family:var(--serif); font-style:italic; font-weight:800;
  font-size:4.5rem; line-height:1;
}
.adm-card-body{
  display:flex; flex-direction:column;
  padding:1.5rem 1.8rem 1.6rem;
  min-width:0;
}
.adm-card-pos{
  font-size:.7rem; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent);
  margin:0 0 .55rem;
  line-height:1.4;
}
.adm-card-name{
  font-family:var(--serif);
  font-size:1.18rem; font-weight:700;
  color:var(--t1);
  margin:0 0 .8rem;
  line-height:1.25;
  letter-spacing:-.3px;
}
.adm-card-duties{
  font-size:.86rem;
  color:var(--t2);
  line-height:1.6;
  margin:0 0 1rem;
  display:-webkit-box;
  -webkit-line-clamp:3; line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  flex:1;
}
.adm-card-contact{
  list-style:none; margin:0 0 1rem; padding:.85rem 0 0;
  border-top:1px dashed var(--bdr);
  display:flex; flex-direction:column; gap:.45rem;
}
.adm-card-contact li{
  display:flex; align-items:center; gap:.55rem;
  font-size:.78rem; color:var(--t2);
  line-height:1.4;
}
.adm-card-contact svg{ width:13px; height:13px; flex-shrink:0; color:var(--accent) }
.adm-card-contact a{
  color:inherit; text-decoration:none;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  transition:color var(--tr);
}
.adm-card-contact a:hover{ color:var(--accent) }

/* "Batafsil" pill — slightly smaller in card */
.adm-card .leader-bio-btn{ margin-top:auto; align-self:flex-start; font-size:.74rem; padding:.55rem 1.05rem }

@media (max-width:768px){
  .adm-card{ grid-template-columns:180px 1fr }
  .adm-card-body{ padding:1.2rem 1.3rem }
}
@media (max-width:560px){
  .adm-card{ grid-template-columns:1fr }
  .adm-card-photo{ aspect-ratio:16/10 }
  .adm-card-photo-letter{ font-size:4rem }
  .adm-card-body{ padding:1.2rem 1.3rem 1.4rem }
}

/* ═══════════════════════════════════════════════════════════════
   EMPLOYEES — /employees (team-of-leader accordion, reuses .adm-)
   prefix: .emp-
═══════════════════════════════════════════════════════════════ */
.adm-vacant-tag{
  position:absolute; top:.85rem; left:.85rem;
  display:inline-block; padding:.35rem .75rem;
  background:rgba(201,169,97,.95); color:#1a1a1a;
  font-size:.66rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  border-radius:999px; backdrop-filter:blur(6px);
}
.adm-card-name-vacant{ color:var(--t2); font-style:italic }
.emp-project-label{
  display:inline-block; margin-right:.4rem;
  font-size:.78rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-warm,#b08d3f);
}
.emp-email-label{
  display:inline-block;
  font-size:.78rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold-warm,#b08d3f);
}

/* /employees scope — slightly larger, more readable typography */
#employees .adm-card-pos{ font-size:.82rem; letter-spacing:.18em }
#employees .adm-card-name{ font-size:1.35rem }
#employees .adm-card-duties{ font-size:1rem; line-height:1.65 }
#employees .adm-card-contact li{ font-size:.92rem; gap:.6rem }
#employees .adm-card-contact svg{ width:15px; height:15px }
#employees .emp-team-name{ font-size:1.08rem }
#employees .emp-team-pos{ font-size:.86rem }
#employees .emp-team-mail{ font-size:.86rem; gap:.45rem }
#employees .emp-team-mail svg{ width:13px; height:13px }
#employees .emp-team-title{ font-size:.82rem }

/* Team panel inside the accordion */
.emp-team{
  padding:1.1rem 1.25rem 1.25rem;
  background:linear-gradient(180deg, rgba(37,99,168,.04), rgba(201,169,97,.04));
  border:1px solid var(--bdr,rgba(8,15,30,.08));
  border-left:3px solid var(--gold,#c9a961);
  border-radius:10px;
}
.emp-team-title{
  display:flex; align-items:center; gap:.55rem;
  font-size:.72rem; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--accent);
  margin:0 0 1rem;
  padding-bottom:.85rem;
  border-bottom:1px dashed var(--bdr);
}
.emp-team-title svg{ width:14px; height:14px }
.emp-team-count{
  margin-left:auto;
  display:inline-flex; align-items:center; justify-content:center;
  min-width:24px; height:24px;
  padding:0 .55rem;
  background:var(--accent); color:#fff;
  font-size:.72rem; font-weight:700;
  border-radius:999px;
  letter-spacing:0;
}
.emp-team-list{
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:.7rem;
}
.emp-team-item{
  display:grid; grid-template-columns:54px 1fr auto;
  gap:.85rem;
  align-items:center;
  padding:.7rem .8rem;
  background:var(--bg2);
  border:1px solid var(--bdr);
  border-radius:10px;
  transition:background var(--tr), border-color var(--tr);
}
.emp-team-item:hover{ background:var(--card-h); border-color:var(--bdr-h) }
.emp-team-photo{
  position:relative;
  width:54px; height:54px;
  border-radius:50%;
  overflow:hidden;
  background:var(--bg3);
  flex-shrink:0;
}
.emp-team-photo img{ width:100%; height:100%; object-fit:cover; object-position:center top }
.emp-team-ph{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  color:var(--gold);
}
.emp-team-letter{
  font-family:var(--serif); font-style:italic; font-weight:800;
  font-size:1.5rem; line-height:1;
}
.emp-team-text{ min-width:0 }
.emp-team-name{
  font-family:var(--serif);
  font-size:.98rem; font-weight:700;
  color:var(--t1);
  margin:0 0 .15rem;
  line-height:1.25;
}
.emp-team-name-vacant{ color:var(--t2); font-style:italic; font-weight:600 }
.emp-team-pos{
  font-size:.74rem; color:var(--t2);
  margin:0 0 .25rem;
  line-height:1.4;
}
.emp-team-mail{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:.74rem; color:var(--accent);
  text-decoration:none;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  max-width:100%;
  transition:color var(--tr);
}
.emp-team-mail:hover{ color:var(--blue-mid); text-decoration:underline }
.emp-team-mail svg{ width:11px; height:11px; flex-shrink:0 }
.emp-team-vacant{
  align-self:center;
  display:inline-block;
  padding:.3rem .65rem;
  background:rgba(201,169,97,.18); color:var(--gold-warm,#b08d3f);
  font-size:.62rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  border-radius:999px;
  white-space:nowrap;
}

@media (max-width:560px){
  .emp-team-item{ grid-template-columns:44px 1fr; gap:.7rem }
  .emp-team-photo{ width:44px; height:44px }
  .emp-team-letter{ font-size:1.25rem }
  .emp-team-vacant{ grid-column:1 / -1; justify-self:start; margin-top:.3rem }
}

/* ═══════════════════════════════════════════════════════════════
   SCIENCE HUB — /science (extends prx- design system)
   prefix: .sci-
═══════════════════════════════════════════════════════════════ */

/* council-info card (when category has no pages) */
.sci-council-sec{padding:2.6rem 0}
.sci-council-card{display:grid;grid-template-columns:140px 1fr;gap:1.6rem;align-items:center;padding:1.7rem 1.9rem;background:var(--bg2);border:1px solid var(--bdr);border-radius:14px;text-decoration:none;color:inherit;transition:all var(--tr);position:relative;overflow:hidden}
.sci-council-card::after{content:"";position:absolute;inset:0;background:radial-gradient(420px 160px at 110% -20%,var(--accent-g),transparent 70%);pointer-events:none;opacity:.6;transition:opacity var(--tr)}
.sci-council-card:hover{transform:translateY(-3px);border-color:var(--bdr-h);box-shadow:0 18px 40px -22px rgba(0,0,0,.22)}
.sci-council-card:hover::after{opacity:1}
.sci-council-emblem{position:relative;z-index:1;width:140px;height:140px;border-radius:14px;background:linear-gradient(135deg,var(--blue-dark),var(--blue-mid));color:var(--gold);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.sci-council-emblem svg{width:60px;height:60px}
.sci-council-body{position:relative;z-index:1;min-width:0}
.sci-council-tag{font-size:.7rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin:0 0 .55rem}
.sci-council-title{font-family:var(--serif);font-size:clamp(1.2rem,2vw,1.5rem);font-weight:700;color:var(--t1);margin:0 0 .65rem;line-height:1.25;letter-spacing:-.3px}
.sci-council-desc{color:var(--t2);font-size:.95rem;line-height:1.65;margin:0 0 1rem;max-width:580px}
.sci-council-cta{display:inline-flex;align-items:center;gap:.45rem;font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--accent)}
.sci-council-cta svg{width:14px;height:14px;transition:transform .3s var(--ease)}
.sci-council-card:hover .sci-council-cta svg{transform:translateX(4px)}

/* dissertation protection (scholars) grid */
.sci-protect-sec{padding:2.6rem 0 3rem;background:linear-gradient(180deg,transparent,var(--bg3) 50%,transparent)}
.sci-pro-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.3rem}
.sci-pro-card{display:flex;flex-direction:column;background:var(--bg2);border:1px solid var(--bdr);border-radius:13px;overflow:hidden;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color var(--tr)}
.sci-pro-card:hover{transform:translateY(-4px);border-color:var(--bdr-h);box-shadow:0 18px 40px -22px rgba(0,0,0,.24)}
.sci-pro-photo{position:relative;aspect-ratio:1/1;background:linear-gradient(135deg,var(--blue-dark),var(--blue-mid));overflow:hidden}
.sci-pro-photo img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.sci-pro-card:hover .sci-pro-photo img{transform:scale(1.05)}
.sci-pro-degree{position:absolute;top:.85rem;left:.85rem;display:inline-block;padding:.35rem .75rem;background:rgba(0,0,0,.78);color:var(--gold-soft,#e6d4a3);font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;border-radius:999px;backdrop-filter:blur(6px);font-family:var(--serif);font-style:italic}
.sci-pro-body{padding:1.15rem 1.25rem 1.3rem;display:flex;flex-direction:column;flex:1}
.sci-pro-name{font-family:var(--serif);font-size:1.1rem;font-weight:700;color:var(--t1);margin:0 0 .55rem;line-height:1.3}
.sci-pro-theme{font-style:italic;color:var(--t2);font-size:.88rem;line-height:1.55;margin:0 0 1rem;display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:1}
.sci-pro-meta{display:flex;flex-direction:column;gap:.4rem;padding-top:.85rem;border-top:1px dashed var(--bdr)}
.sci-pro-place,.sci-pro-date{display:inline-flex;align-items:center;gap:.45rem;font-size:.78rem;color:var(--t2)}
.sci-pro-place svg,.sci-pro-date svg{width:13px;height:13px;flex-shrink:0;color:var(--accent)}

@media (max-width:768px){
  .sci-council-card{grid-template-columns:1fr;padding:1.3rem;text-align:center;gap:1.1rem}
  .sci-council-emblem{width:96px;height:96px;margin:0 auto}
  .sci-council-emblem svg{width:42px;height:42px}
  .sci-council-cta{justify-content:center}
}

/* ═══════════════════════════════════════════════
   BATAFSIL — premium pill button (gold→blue stroke)
═══════════════════════════════════════════════ */
.leader-bio-btn{
  position:relative;isolation:isolate;
  margin-top:1rem;display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--sans,inherit);
  font-size:.78rem;font-weight:600;letter-spacing:.4px;text-transform:uppercase;
  color:var(--blue-mid,#2563a8);
  background:rgba(255,255,255,.55);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border:none;border-radius:100px;
  padding:.65rem 1.25rem;cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 4px 14px rgba(37,99,168,.12);
  transition:transform .35s cubic-bezier(.22,1,.36,1),
             box-shadow .35s cubic-bezier(.22,1,.36,1),
             color .25s,gap .25s;
  overflow:hidden;
}
.leader-bio-btn::before{
  content:'';position:absolute;inset:0;border-radius:inherit;z-index:-1;
  padding:1px;
  background:conic-gradient(from var(--bio-ang,0deg),
              rgba(201,169,97,.85) 0%,
              rgba(37,99,168,.6) 35%,
              rgba(126,200,245,.7) 55%,
              rgba(201,169,97,.85) 100%);
  -webkit-mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);
          mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:bioAng 5s linear infinite;
}
@property --bio-ang{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes bioAng{to{--bio-ang:360deg}}
.leader-bio-btn::after{
  content:'';position:absolute;top:0;left:-30%;width:30%;height:100%;
  background:linear-gradient(115deg,transparent,rgba(255,255,255,.55) 50%,transparent);
  transform:translateX(-120%) skewX(-12deg);
  pointer-events:none;transition:transform .8s cubic-bezier(.22,1,.36,1);
}
.leader-bio-btn:hover{
  transform:translateY(-2px);
  gap:.75rem;
  color:#0d1e30;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),
             0 12px 30px rgba(37,99,168,.22),
             0 4px 10px rgba(201,169,97,.18);
}
.leader-bio-btn:hover::after{transform:translateX(420%) skewX(-12deg)}
.leader-bio-btn:active{transform:translateY(0) scale(.98)}
.leader-bio-btn svg{transition:transform .35s cubic-bezier(.22,1,.36,1)}
.leader-bio-btn:hover svg{transform:translateX(4px)}

[data-theme="dark"] .leader-bio-btn{
  background:rgba(255,255,255,.06);
  color:#cfe1f5;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 4px 14px rgba(0,0,0,.3);
}
[data-theme="dark"] .leader-bio-btn:hover{
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),
             0 12px 32px rgba(0,0,0,.4),
             0 4px 10px rgba(126,200,245,.2);
}

@media(prefers-reduced-motion:reduce){
  .leader-bio-btn::before{animation:none}
  .leader-bio-btn::after{display:none}
  .leader-bio-btn,.leader-bio-btn:hover{transform:none;transition:color .2s}
}

/* ═══════════════════════════════════════════════
   BIO ACCORDION — inline expand below button
═══════════════════════════════════════════════ */
.adm-bio-toggle .adm-bio-label-hide{display:none}
.adm-bio-toggle.is-open .adm-bio-label-show{display:none}
.adm-bio-toggle.is-open .adm-bio-label-hide{display:inline}
.adm-bio-chev{transition:transform .35s cubic-bezier(.22,1,.36,1)}
.adm-bio-toggle.is-open .adm-bio-chev{transform:rotate(180deg)}
.adm-bio-toggle:hover svg.adm-bio-chev{transform:translateX(0)}
.adm-bio-toggle.is-open:hover svg.adm-bio-chev{transform:rotate(180deg)}

.adm-card-bio{
  max-height:0;
  overflow:hidden;
  transition:max-height .55s cubic-bezier(.22,1,.36,1);
  margin-top:.85rem;
}
.adm-card-bio[hidden]{display:none}
.adm-card-bio-inner{
  position:relative;
  padding:1.1rem 1.25rem 1.2rem;
  background:linear-gradient(180deg, rgba(37,99,168,.04), rgba(201,169,97,.04));
  border:1px solid var(--bdr,rgba(8,15,30,.08));
  border-left:3px solid var(--gold,#c9a961);
  border-radius:10px;
  font-size:.92rem; line-height:1.78; color:var(--t1);
}
.adm-card-bio-inner p{margin:0 0 .85rem}
.adm-card-bio-inner p:last-child{margin-bottom:0}
.adm-card-bio-inner ul,.adm-card-bio-inner ol{margin:0 0 1rem 1.4rem;padding:0}
.adm-card-bio-inner li{margin-bottom:.5rem;line-height:1.7}
.adm-card-bio-inner li::marker{color:var(--gold,#c9a961)}
.adm-card-bio-inner b,.adm-card-bio-inner strong{color:var(--blue-mid,#2563a8);font-weight:700}
.adm-card-bio-inner a{color:var(--blue-mid,#2563a8);text-decoration:underline;text-decoration-color:rgba(37,99,168,.35);text-underline-offset:3px;transition:text-decoration-color .25s}
.adm-card-bio-inner a:hover{text-decoration-color:var(--gold,#c9a961)}
.adm-card-bio-inner h1,.adm-card-bio-inner h2,.adm-card-bio-inner h3,.adm-card-bio-inner h4{font-family:var(--serif,Georgia,serif);margin:1rem 0 .5rem;line-height:1.3}
.adm-card-bio-inner h3,.adm-card-bio-inner h4{font-size:1rem;color:var(--blue-mid,#2563a8)}
.adm-card-bio-inner img{max-width:100%;height:auto;border-radius:6px;margin:.5rem 0}

[data-theme="dark"] .adm-card-bio-inner{
  background:linear-gradient(180deg, rgba(126,200,245,.06), rgba(201,169,97,.06));
  color:#e8eef9;
}
[data-theme="dark"] .adm-card-bio-inner b,
[data-theme="dark"] .adm-card-bio-inner strong,
[data-theme="dark"] .adm-card-bio-inner h3,
[data-theme="dark"] .adm-card-bio-inner h4{color:#7ec8f5}
[data-theme="dark"] .adm-card-bio-inner a{color:#7ec8f5}

@media(prefers-reduced-motion:reduce){
  .adm-card-bio{transition:none}
  .adm-bio-chev{transition:none}
}

/* ══ HEADER SEARCH OVERLAY ══ */
.search-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:flex-start;justify-content:center;padding:clamp(4rem,12vh,9rem) 1rem 2rem;opacity:0;transition:opacity .22s ease}
.search-overlay[hidden]{display:none!important}
.search-overlay.is-open{opacity:1}
.search-overlay__backdrop{position:absolute;inset:0;background:rgba(8,14,28,.62);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%)}
.search-overlay__panel{position:relative;width:100%;max-width:720px;transform:translateY(-12px) scale(.985);transition:transform .26s cubic-bezier(.2,.8,.2,1)}
.search-overlay.is-open .search-overlay__panel{transform:translateY(0) scale(1)}
.search-overlay__form{display:flex;align-items:center;gap:.6rem;background:var(--bg,#fff);border:1px solid var(--bdr,#e5e7eb);border-radius:14px;padding:.55rem .65rem .55rem 1rem;box-shadow:0 30px 80px -20px rgba(0,0,0,.45),0 8px 24px -10px rgba(0,0,0,.25)}
.search-overlay__icon{flex-shrink:0;color:var(--t2,#475569)}
.search-overlay__input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--t1,#0f172a);font-size:clamp(1rem,1.3vw,1.15rem);font-family:inherit;padding:.7rem .25rem;letter-spacing:.2px}
.search-overlay__input::placeholder{color:var(--t2,#64748b);opacity:.85}
.search-overlay__submit{flex-shrink:0;background:var(--accent,#0a66c2);color:#fff;border:0;border-radius:10px;padding:.65rem 1.1rem;font-weight:600;font-family:inherit;font-size:.85rem;letter-spacing:.6px;text-transform:uppercase;cursor:pointer;transition:filter .15s ease,transform .15s ease}
.search-overlay__submit:hover{filter:brightness(1.08)}
.search-overlay__submit:active{transform:translateY(1px)}
.search-overlay__close{flex-shrink:0;background:transparent;border:0;color:var(--t2,#64748b);width:38px;height:38px;border-radius:9px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,color .15s ease}
.search-overlay__close:hover{background:var(--accent-g,rgba(10,102,194,.08));color:var(--accent,#0a66c2)}

[data-theme="dark"] .search-overlay__backdrop{background:rgba(2,6,16,.7)}
[data-theme="dark"] .search-overlay__form{background:#0f1626;border-color:#1f2a40;box-shadow:0 30px 80px -20px rgba(0,0,0,.7),0 8px 24px -10px rgba(0,0,0,.5)}
[data-theme="dark"] .search-overlay__input{color:#e6eefb}
[data-theme="dark"] .search-overlay__input::placeholder{color:#8aa0c2}

@media (max-width:640px){
  .search-overlay{padding-top:clamp(3rem,8vh,5rem)}
  .search-overlay__form{padding:.4rem .45rem .4rem .85rem;gap:.4rem;border-radius:12px}
  .search-overlay__submit{padding:.55rem .8rem;font-size:.78rem}
  .search-overlay__input{font-size:1rem;padding:.6rem .25rem}
}

@media (prefers-reduced-motion:reduce){
  .search-overlay,.search-overlay__panel{transition:none}
}

/* ── Fixed-header clearance: keep masthead/breadcrumb out from under #hdr ── */
.pix-hero,.nax-masthead,.lwx-hero,.jrx-hero,.igx-hero,.phx-hero,
.ctx-hero,.vcx-hero,.wbx-hero,.pgx-hero,.prx-masthead{
  padding-top:5.6rem;
}
@media(max-width:900px){
  .pix-hero,.nax-masthead,.lwx-hero,.jrx-hero,.igx-hero,.phx-hero,
  .ctx-hero,.vcx-hero,.wbx-hero,.pgx-hero,.prx-masthead{
    padding-top:4.6rem;
  }
}

/* ── page-hero background photo (per page via inline --ph-bg; falls back to gradient) ── */
.page-hero[style*="--ph-bg"]{
  background-image:
    linear-gradient(135deg, rgba(11,26,43,.88) 0%, rgba(11,26,43,.66) 55%, rgba(11,26,43,.9) 100%),
    var(--ph-bg);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
/* On photo heroes, hide the decorative grid + star dots so the image stays clean */
.page-hero[style*="--ph-bg"]::after,
.page-hero[style*="--ph-bg"] .container::after{display:none}
/* Continuous motion for the hero copy (title + paragraphs) */
@keyframes phFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes phShimmer{to{background-position:200% center}}
.page-hero .page-hero-grid > div:first-child{
  animation:phFloat 7s ease-in-out infinite;
  will-change:transform;
}
.page-hero .page-hero-title em{
  background-size:200% auto;
  animation:phShimmer 5s linear infinite;
}
@media(prefers-reduced-motion:reduce){
  .page-hero .page-hero-grid > div:first-child,
  .page-hero .page-hero-title em{animation:none}
}

/* ═══════════════════════════════════════════════
   HEADER v3 — 5 bandli ixcham menyu + mega-panel
   Ranglar o'zgarmagan: to'q ko'k fon, oq matn, tilla aksent.
   Qaytarish uchun shu blokni oxirigacha o'chiring.
═══════════════════════════════════════════════ */
/* Logo: bezak chiziq va "radar" olib tashlandi */
#hdr .logo::before,
#hdr .logo::after{ content: none; animation: none; }

/* O'ng blok: ajratgich chiziqlarsiz, ramkasiz tugmalar */
#hdr .nav-right{ gap: .25rem; padding-left: 0; }
#hdr .nav-right > *{ margin: 0; }
#hdr .nav-right > * + *::before{ content: none; }
#hdr .ico-btn,
#hdr .lang-dd-toggle,
#hdr .burger{ border-color: transparent; background: none; }
#hdr .ico-btn{ border-radius: 50%; }
#hdr .lang-dd-toggle{ border-radius: 999px; }
#hdr .ico-btn:hover,
#hdr .lang-dd-toggle:hover,
#hdr .lang-dd.is-open .lang-dd-toggle,
#hdr .burger:hover{ background: rgba(255,255,255,.12); border-color: transparent; color: #fff; transform: none; }

/* Scroll qilinganda va mega-panel ochiqligida — zichroq fon */
#hdr.sc,
#hdr:has(.has-sub:hover),
#hdr:has(.has-sub:focus-within){
  background: rgba(11,26,43,.94);
  border-bottom-color: rgba(255,255,255,.08);
}

@media (min-width: 1101px){
  /* 5 ta band sig'adi — burger faqat ≤1100px da */
  /* align-items:stretch — <li> header balandligini to'liq egallaydi, havola va panel orasida hover uzilmaydi */
  #hdr .nav-links{ display: flex; align-self: stretch; align-items: stretch; gap: .15rem; }
  #hdr .burger{ display: none; }
  .mob-nav{ display: none; }

  #hdr .nav-wrap{ height: 72px; gap: 2.25rem; transition: height .35s var(--ease); }
  #hdr.sc .nav-wrap{ height: 60px; }
  #hdr .logo{ padding-right: 0; margin-right: 0; }
  #hdr .logo-img{ transition: height .35s var(--ease), opacity .25s ease; }
  #hdr.sc .logo-img{ height: 38px; }

  /* Yuqori daraja havolalari: ikonkasiz, oddiy registr, yengil vazn */
  #hdr .nav-item{ position: static; display: flex; align-items: center; height: auto; }
  #hdr .has-sub::after{ content: none; }
  #hdr .nav-item > a{
    height: auto; padding: .5rem .9rem; gap: .4rem;
    font-size: .95rem; font-weight: 500; letter-spacing: 0; text-transform: none;
    color: rgba(255,255,255,.82); background: none; border-radius: 0;
    transform: none !important;
  }
  #hdr .nav-item > a svg,
  #hdr .nav-item:hover > a svg{
    display: block; width: 11px; height: 11px; opacity: .55;
    color: inherit; transform: none; transition: transform .3s var(--ease), opacity .25s;
  }
  #hdr .has-sub:hover > a svg,
  #hdr .has-sub:focus-within > a svg{ transform: rotate(180deg); opacity: 1; }
  #hdr .nav-item:hover > a,
  #hdr .nav-item > a:hover,
  #hdr .nav-item > a[aria-current]{ color: #fff; background: none; }

  /* Tilla chiziq — chapdan o'ngga chiziladi */
  #hdr .nav-item > a::after{ content: none; }
  #hdr .nav-item > a::before,
  #hdr .nav-item:hover > a::before,
  #hdr .nav-item > a:hover::before,
  #hdr .nav-item > a[aria-current]::before{
    display: block; left: .9rem; right: .9rem; bottom: 2px; height: 1.5px;
    background: var(--gold); border-radius: 0; opacity: 1;
    transform: scaleX(0); transform-origin: left center;
    transition: transform .4s var(--ease);
  }
  #hdr .nav-item:hover > a::before,
  #hdr .nav-item:focus-within > a::before,
  #hdr .nav-item > a[aria-current]::before{ transform: scaleX(1); }

  /* Mega-panel — to'liq kenglikda, header ostidan ochiladi */
  #hdr .mega{
    /* .nav-wrap ichida joylashadi — konteyner padding'ini qoplab, ekran chetigacha cho'ziladi */
    position: absolute; top: 100%; z-index: 10;
    left: calc(-1 * clamp(1rem,2vw,2rem)); right: calc(-1 * clamp(1rem,2vw,2rem));
    background: #0b1a2b;
    border-top: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 30px 60px rgba(4,12,22,.35);
    opacity: 0; visibility: hidden; pointer-events: none;
    transform: translateY(-8px);
    transition: opacity .25s var(--ease), transform .35s var(--ease), visibility 0s .25s;
  }
  #hdr .has-sub:hover > .mega,
  #hdr .has-sub:focus-within > .mega{
    opacity: 1; visibility: visible; pointer-events: auto; transform: none;
    transition: opacity .25s var(--ease), transform .35s var(--ease), visibility 0s;
  }
  #hdr .mega-in{
    display: grid; grid-template-columns: 300px minmax(0, 860px);
    justify-content: start; gap: 4rem;
    padding: 2.5rem clamp(1rem,2vw,2rem) 2.75rem;
  }
  #hdr .mega-intro{ padding-right: 2.5rem; border-right: 1px solid rgba(255,255,255,.08); }
  #hdr .mega-title{
    display: block; font-family: var(--serif); font-size: 1.75rem; font-weight: 400;
    line-height: 1.2; color: #fff;
  }
  #hdr .mega-desc{ margin-top: .8rem; font-size: .9rem; line-height: 1.6; color: rgba(255,255,255,.6); }
  #hdr .mega-all{
    display: inline-flex; align-items: center; gap: .5rem; margin-top: 1.4rem;
    font-size: .85rem; font-weight: 500; color: var(--gold-soft);
    transition: color .25s, gap .3s var(--ease);
  }
  #hdr .mega-all:hover{ color: #fff; gap: .8rem; }
  #hdr .mega-cols{
    display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr);
    gap: 3rem; align-items: start;
  }
  #hdr .mega-col--wide{ grid-column: span 2; }
  #hdr .mega-h{
    display: block; margin-bottom: .85rem;
    font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
    color: rgba(255,255,255,.45); transition: color .25s;
  }
  #hdr a.mega-h:hover{ color: var(--gold-soft); }
  #hdr .mega-list{ display: flex; flex-direction: column; }
  #hdr .mega-col--wide .mega-list{ display: block; columns: 2; column-gap: 3rem; }
  #hdr .mega-list a{
    display: block; padding: .45rem 0; break-inside: avoid;
    font-size: .98rem; line-height: 1.4; color: rgba(255,255,255,.85);
    transition: color .2s, transform .3s var(--ease);
  }
  #hdr .mega-list a:hover,
  #hdr .mega-list a:focus-visible{ color: #fff; transform: translateX(5px); }
}

/* Mobil/planshetda mega-panel ishlatilmaydi (mob-nav bor) */
@media (max-width: 1100px){
  #hdr .mega{ display: none; }
}
@media (prefers-reduced-motion: reduce){
  #hdr .nav-wrap, #hdr .logo-img, #hdr .mega, #hdr .mega-list a,
  #hdr .nav-item > a::before{ transition: none; }
}
/* ═══ /HEADER v3 ═══ */

/* ═══════════════════════════════════════════════
   HOME v3 — infografika bo'limi (to'q fon).
   Mavjud o'zgaruvchilar ishlatilgan — ranglar saytning qolgan qismi bilan bir xil.
═══════════════════════════════════════════════ */
.hx-sec{ position: relative; padding: 5.5rem 0; }

/* Bo'lim raqamlari (01, 02, …) — yangi bo'limlar ham sanoqqa qo'shiladi */
#infograph .s-lbl{
  counter-increment: section;
  position: relative; padding-left: 0;
  font-size: .7rem; letter-spacing: 2.6px; font-weight: 700;
  display: inline-flex; align-items: center; gap: .7rem;
  color: var(--blue-mid);
}
#infograph .s-lbl::before{
  content: counter(section, decimal-leading-zero);
  width: auto; height: auto; background: none;
  font-family: var(--serif); font-size: 1.05rem; font-weight: 800; font-style: italic;
  letter-spacing: 0; color: var(--gold-warm);
  padding-right: .65rem; border-right: 1px solid var(--bdr);
  line-height: 1; display: inline-block;
}

/* ── To'q bo'lim (footer bilan bir xil fon) ── */
.hx-dark{
  background: linear-gradient(180deg, #0a1828 0%, #0b1a2b 45%, #081522 100%);
  color: #fff;
}
.hx-dark .s-title{ background: none; -webkit-text-fill-color: #fff; color: #fff; }
.hx-dark .s-desc{ color: rgba(255,255,255,.6); }
#infograph .s-lbl{ color: var(--blue-pale); }
#infograph .s-lbl::before{ color: var(--gold-soft); border-right-color: rgba(255,255,255,.16); }
.hx-dark .link-all{
  background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.18);
  color: #fff; box-shadow: none;
}
.hx-dark .link-all:hover{ background: rgba(255,255,255,.14); }

/* ── Infografika ── */
.igh-grid{
  display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 1.25rem; margin-top: 2.5rem;
}
.igh-card{
  position: relative; display: block; overflow: hidden; min-height: 0;
  background: #0f2035; border: 1px solid rgba(255,255,255,.08); border-radius: 14px;
  transition: border-color .3s;
}
.igh-card:first-child{ grid-row: 1 / 3; aspect-ratio: 16 / 9; }
.igh-card:hover{ border-color: rgba(255,255,255,.3); }
.igh-card img{
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .7s var(--ease);
}
.igh-card:hover img{ transform: scale(1.03); }
.igh-cap{
  position: absolute; left: 0; right: 0; bottom: 0;
  display: flex; flex-direction: column; gap: .25rem;
  padding: 2.5rem 1.1rem .95rem;
  background: linear-gradient(180deg, rgba(8,21,34,0), rgba(8,21,34,.92));
}
.igh-date{ font-size: .72rem; letter-spacing: .08em; color: var(--gold-soft); }
.igh-title{
  font-size: .9rem; font-weight: 500; line-height: 1.35; color: #fff;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.igh-card:first-child .igh-title{ font-size: 1.05rem; }
.igh-grid--flat{ grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); grid-template-rows: auto; }
.igh-grid--flat .igh-card,
.igh-grid--flat .igh-card:first-child{ grid-row: auto; aspect-ratio: 16 / 9; }

@media (max-width: 900px){
  .hx-sec{ padding: 4rem 0; }
  .igh-grid{ grid-template-columns: 1fr; grid-template-rows: auto; }
  .igh-card, .igh-card:first-child{ grid-row: auto; aspect-ratio: 16 / 9; }
}
@media (prefers-reduced-motion: reduce){
  .igh-card img{ transition: none; }
}
/* ═══ /HOME v3 ═══ */

/* ══════════════════════════════════════════════════════════════
   NEWS SECTION — entrance reveal
   .nx-anim is added by app.js (so content stays visible without JS),
   .is-in when the grid scrolls into view. Animations fill "backwards"
   only, so hover transforms keep working once they have finished.
   ══════════════════════════════════════════════════════════════ */
.nx-grid.nx-anim:not(.is-in) .nx-feat,
.nx-grid.nx-anim:not(.is-in) .nx-item{opacity:0}

.nx-grid.nx-anim.is-in .nx-feat{animation: nxFeatIn 1s var(--ease) backwards}
.nx-grid.nx-anim.is-in .nx-feat-img{animation: nxWipe 1.1s cubic-bezier(.77,0,.18,1) .15s backwards}
.nx-grid.nx-anim.is-in .nx-feat-img img{animation: nxZoomOut 1.8s var(--ease) .15s backwards}
.nx-grid.nx-anim.is-in .nx-feat-num{animation: nxPop .7s var(--ease) .85s backwards}
.nx-grid.nx-anim.is-in .nx-feat-tag{animation: nxPop .7s var(--ease) .95s backwards}
.nx-grid.nx-anim.is-in .nx-feat::before{animation: nxLine 1s var(--ease) .5s backwards; transform-origin: left center}
.nx-grid.nx-anim.is-in .nx-feat-body > *{animation: nxRise .75s var(--ease) backwards}
.nx-grid.nx-anim.is-in .nx-feat-body > *:nth-child(1){animation-delay:.55s}
.nx-grid.nx-anim.is-in .nx-feat-body > *:nth-child(2){animation-delay:.65s}
.nx-grid.nx-anim.is-in .nx-feat-body > *:nth-child(3){animation-delay:.75s}
.nx-grid.nx-anim.is-in .nx-feat-body > *:nth-child(4){animation-delay:.85s}

.nx-grid.nx-anim.is-in .nx-item{
  animation: nxItemIn .85s var(--ease) backwards;
  animation-delay: calc(.3s + var(--nx-i, 0) * .11s);
}
.nx-grid.nx-anim.is-in .nx-item-num{
  animation: nxPop .6s var(--ease) backwards;
  animation-delay: calc(.6s + var(--nx-i, 0) * .11s);
}
.nx-grid.nx-anim.is-in .nx-item-thumb{
  animation: nxWipe .8s cubic-bezier(.77,0,.18,1) backwards;
  animation-delay: calc(.45s + var(--nx-i, 0) * .11s);
}
.nx-grid.nx-anim.is-in .nx-item-thumb img{
  animation: nxZoomOut 1.2s var(--ease) backwards;
  animation-delay: calc(.45s + var(--nx-i, 0) * .11s);
}

@keyframes nxFeatIn{
  from{opacity:0; transform: translateY(46px) scale(.965); filter: blur(10px)}
  to{opacity:1; transform:none; filter:none}
}
@keyframes nxItemIn{
  from{opacity:0; transform: translateX(56px); filter: blur(8px)}
  60%{opacity:1; filter:none}
  to{opacity:1; transform:none; filter:none}
}
@keyframes nxWipe{
  from{clip-path: inset(0 100% 0 0)}
  to{clip-path: inset(0 0 0 0)}
}
@keyframes nxZoomOut{
  from{transform: scale(1.22)}
  to{transform: scale(1)}
}
@keyframes nxRise{
  from{opacity:0; transform: translateY(18px)}
  to{opacity:1; transform:none}
}
@keyframes nxPop{
  from{opacity:0; transform: scale(.6)}
  60%{opacity:1; transform: scale(1.08)}
  to{opacity:1; transform: scale(1)}
}
@keyframes nxLine{
  from{transform: scaleX(0)}
  to{transform: scaleX(1)}
}

@media (max-width: 900px){
  @keyframes nxItemIn{
    from{opacity:0; transform: translateY(28px); filter: blur(6px)}
    to{opacity:1; transform:none; filter:none}
  }
}
@media (prefers-reduced-motion: reduce){
  .nx-grid.nx-anim .nx-feat,
  .nx-grid.nx-anim .nx-item{opacity:1 !important}
  .nx-grid.nx-anim *,
  .nx-grid.nx-anim *::before{animation: none !important}
}
/* ══════════════════════════════════════════════════════════════
   HOME — section entrance reveals (one idea per section)
   app.js adds .rv-anim to every [data-rv] (content stays visible without JS),
   numbers the children with --rv-i and adds .is-in on scroll.
   Keyframes mostly define only "from", so each element lands on its own
   resting style and hover effects keep working afterwards.
   ══════════════════════════════════════════════════════════════ */

/* hidden until revealed */
.rv-anim:not(.is-in)[data-rv="board"] .pub-item,
.rv-anim:not(.is-in)[data-rv="iris"] .igh-card,
.rv-anim:not(.is-in)[data-rv="book"],
.rv-anim:not(.is-in)[data-rv="shelf"] .jrn-card,
.rv-anim:not(.is-in)[data-rv="count"] .pstat,
.rv-anim:not(.is-in)[data-rv="count"] .pstat-divider,
.rv-anim:not(.is-in)[data-rv="lanes"] .partners-marquee{opacity:0}

/* ── Publications: rows flip down like a departure board ── */
[data-rv="board"]{perspective: 1400px}
.rv-anim.is-in[data-rv="board"] .pub-item{
  transform-origin: 50% 0;
  animation: rvFlipDown .85s var(--ease) backwards;
  animation-delay: calc(var(--rv-i, 0) * .09s);
}
.rv-anim.is-in[data-rv="board"] .pub-n{
  animation: rvFromLeft .6s var(--ease) backwards;
  animation-delay: calc(.3s + var(--rv-i, 0) * .09s);
}
.rv-anim.is-in[data-rv="board"] .pub-ico{
  animation: rvSpinIn .75s var(--ease) backwards;
  animation-delay: calc(.32s + var(--rv-i, 0) * .09s);
}
.rv-anim.is-in[data-rv="board"] .pmeta{
  animation: rvRise .6s var(--ease) backwards;
  animation-delay: calc(.45s + var(--rv-i, 0) * .09s);
}
.rv-anim.is-in[data-rv="board"] .parr{
  animation: rvFromLeft .6s var(--ease) backwards;
  animation-delay: calc(.55s + var(--rv-i, 0) * .09s);
}
@keyframes rvFlipDown{
  from{opacity:0; transform: rotateX(-82deg) translateY(-10px)}
  55%{opacity:1}
}
@keyframes rvSpinIn{
  from{opacity:0; transform: scale(.35) rotate(-28deg)}
  70%{opacity:1; transform: scale(1.06) rotate(3deg)}
}
@keyframes rvFromLeft{
  from{opacity:0; transform: translateX(-18px)}
}
@keyframes rvRise{
  from{opacity:0; transform: translateY(16px)}
}

/* ── Infographics: each tile opens like a camera iris ── */
.rv-anim.is-in[data-rv="iris"] .igh-card{
  animation: rvIris 1.15s cubic-bezier(.65,0,.2,1) backwards;
  animation-delay: calc(var(--rv-i, 0) * .14s);
}
.rv-anim.is-in[data-rv="iris"] .igh-card img{
  animation: rvZoomSettle 1.7s var(--ease) backwards;
  animation-delay: calc(var(--rv-i, 0) * .14s);
}
.rv-anim.is-in[data-rv="iris"] .igh-cap{
  animation: rvCapUp .7s var(--ease) backwards;
  animation-delay: calc(.65s + var(--rv-i, 0) * .14s);
}
@keyframes rvIris{
  from{opacity:1; clip-path: circle(0% at 50% 50%)}
  to{opacity:1; clip-path: circle(72% at 50% 50%)}
}
@keyframes rvZoomSettle{
  from{transform: scale(1.28) rotate(2deg)}
}
@keyframes rvCapUp{
  from{opacity:0; transform: translateY(100%)}
}

/* ── Journal: the featured issue swings open like a book cover ── */
.rv-anim.is-in[data-rv="book"]{animation: rvBookCard .9s var(--ease) backwards}
.rv-anim.is-in[data-rv="book"] .jrn-hero-cover{
  transform-origin: 0 50%;
  animation: rvBookOpen 1.35s cubic-bezier(.2,.9,.25,1) .2s backwards;
}
.rv-anim.is-in[data-rv="book"] .jrn-hero-info > *{animation: rvFromRight .75s var(--ease) backwards}
.rv-anim.is-in[data-rv="book"] .jrn-hero-info > *:nth-child(1){animation-delay:.5s}
.rv-anim.is-in[data-rv="book"] .jrn-hero-info > *:nth-child(2){animation-delay:.58s}
.rv-anim.is-in[data-rv="book"] .jrn-hero-info > *:nth-child(3){animation-delay:.66s}
.rv-anim.is-in[data-rv="book"] .jrn-hero-info > *:nth-child(4){animation-delay:.74s}
.rv-anim.is-in[data-rv="book"] .jrn-hero-info > *:nth-child(5){animation-delay:.82s}
.rv-anim.is-in[data-rv="book"] .jrn-hero-info > *:nth-child(6){animation-delay:.9s}
@keyframes rvBookCard{
  from{opacity:0; transform: translateY(34px) scale(.98)}
}
@keyframes rvBookOpen{
  from{opacity:0; transform: perspective(1100px) rotateY(-68deg) rotate(-3deg)}
  45%{opacity:1}
}
@keyframes rvFromRight{
  from{opacity:0; transform: translateX(38px)}
}

/* ── Journal archive: issues drop onto the shelf, tilting alternately ── */
.rv-anim.is-in[data-rv="shelf"] .jrn-card{
  animation: rvShelfL .95s cubic-bezier(.2,1.1,.3,1) backwards;
  animation-delay: calc(var(--rv-i, 0) * .1s);
}
.rv-anim.is-in[data-rv="shelf"] .jrn-card:nth-child(even){animation-name: rvShelfR}
.rv-anim.is-in[data-rv="shelf"] .jrn-card-num{
  animation: rvStamp .55s var(--ease) backwards;
  animation-delay: calc(.55s + var(--rv-i, 0) * .1s);
}
@keyframes rvShelfL{
  from{opacity:0; transform: translateY(-70px) rotate(-9deg) scale(.9)}
  60%{opacity:1}
}
@keyframes rvShelfR{
  from{opacity:0; transform: translateY(-70px) rotate(9deg) scale(.9)}
  60%{opacity:1}
}
@keyframes rvStamp{
  from{opacity:0; transform: scale(2.2)}
}

/* ── Partners: numbers count up, the two logo lanes glide in from opposite sides ── */
.rv-anim.is-in[data-rv="count"] .pstat{animation: rvRise .7s var(--ease) backwards}
.rv-anim.is-in[data-rv="count"] .pstat:nth-child(3){animation-delay:.12s}
.rv-anim.is-in[data-rv="count"] .pstat:nth-child(5){animation-delay:.24s}
.rv-anim.is-in[data-rv="count"] .pstat-divider{
  transform-origin: 50% 0;
  animation: rvGrowY .6s var(--ease) .3s backwards;
}
.rv-anim.is-in[data-rv="lanes"] .partners-row-top{animation: rvLaneL 1.3s var(--ease) backwards}
.rv-anim.is-in[data-rv="lanes"] .partners-row-bot{animation: rvLaneR 1.3s var(--ease) .18s backwards}
@keyframes rvGrowY{
  from{opacity:0; transform: scaleY(0)}
}
@keyframes rvLaneL{
  from{opacity:0; transform: translateX(-140px); filter: blur(6px)}
}
@keyframes rvLaneR{
  from{opacity:0; transform: translateX(140px); filter: blur(6px)}
}

@media (prefers-reduced-motion: reduce){
  .rv-anim[data-rv="board"] .pub-item,
  .rv-anim[data-rv="iris"] .igh-card,
  .rv-anim[data-rv="book"],
  .rv-anim[data-rv="shelf"] .jrn-card,
  .rv-anim[data-rv="count"] .pstat,
  .rv-anim[data-rv="count"] .pstat-divider,
  .rv-anim[data-rv="lanes"] .partners-marquee{opacity:1 !important; animation: none !important}
  .rv-anim[data-rv]:not([data-rv="lanes"]) *{animation: none !important}
}
/* ══════════════════════════════════════════════════════════════
   PUBX hero — "indicator chart" backdrop (replaces the old particle canvas)
   Pure SVG + CSS: the lines draw once, bars rise, points appear,
   then one soft pulse keeps travelling along the main trend line.
   ══════════════════════════════════════════════════════════════ */
.pubx-hero-chart{
  position:absolute; inset:0; width:100%; height:100%;
  z-index:1; pointer-events:none; display:block;
  opacity:.9;
}
.pubx-chart-grid line{
  stroke: rgba(255,255,255,.07); stroke-width:1; stroke-dasharray: 3 9;
  vector-effect: non-scaling-stroke;
}
.pubx-chart-bars rect{
  fill: rgba(126,200,245,.10);
  transform-box: fill-box; transform-origin: 50% 100%;
  animation: pubxBarUp 1.1s var(--ease) backwards;
}
.pubx-chart-bars rect:nth-child(1){animation-delay:.9s}
.pubx-chart-bars rect:nth-child(2){animation-delay:1.02s}
.pubx-chart-bars rect:nth-child(3){animation-delay:1.14s}
.pubx-chart-bars rect:nth-child(4){animation-delay:1.26s}
.pubx-chart-bars rect:nth-child(5){animation-delay:1.38s}
.pubx-chart-bars rect:nth-child(6){animation-delay:1.5s}
.pubx-chart-bars rect:nth-child(7){animation-delay:1.62s}
.pubx-chart-bars rect:nth-child(8){animation-delay:1.74s}

.pubx-chart-line{
  fill:none; stroke-linecap:round; stroke-linejoin:round;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: 1; stroke-dashoffset: 0;
  animation: pubxDraw 3.2s cubic-bezier(.6,.05,.25,1) backwards;
}
.pubx-chart-line--gold{ stroke: rgba(201,169,97,.62); stroke-width: 2.2; animation-delay:.35s }
.pubx-chart-line--blue{ stroke: rgba(126,200,245,.38); stroke-width: 1.6; animation-delay:.75s }
.pubx-chart-forecast{
  fill:none; stroke: rgba(255,255,255,.2); stroke-width:1.2; stroke-dasharray: 2 8;
  vector-effect: non-scaling-stroke;
  animation: pubxFade 1.6s ease 2.4s backwards;
}
.pubx-chart-area{
  fill: url(#pubxChartArea);
  animation: pubxFade 2s ease 2.2s backwards;
}
.pubx-chart-dots circle{
  fill: #0b1a2b; stroke: rgba(230,212,163,.9); stroke-width: 1.8;
  transform-box: fill-box; transform-origin: center;
  animation: pubxDot .6s var(--ease) backwards;
}
.pubx-chart-dots circle:nth-child(1){animation-delay:1.25s}
.pubx-chart-dots circle:nth-child(2){animation-delay:1.9s}
.pubx-chart-dots circle:nth-child(3){animation-delay:2.55s}
.pubx-chart-dots circle:nth-child(4){animation-delay:3.15s}
.pubx-chart-pulse{ animation: pubxFade .8s ease 3.6s backwards }
.pubx-chart-pulse-halo{ fill: rgba(201,169,97,.20) }
.pubx-chart-pulse-core{ fill: #f3dfa6 }

@keyframes pubxDraw{ from{ stroke-dashoffset: 1 } }
@keyframes pubxFade{ from{ opacity: 0 } }
@keyframes pubxBarUp{ from{ transform: scaleY(0); opacity:0 } }
@keyframes pubxDot{ from{ transform: scale(0); opacity:0 } 70%{ transform: scale(1.35) } }

@media (max-width: 900px){
  .pubx-hero-chart{ opacity:.5 }
}
@media (prefers-reduced-motion: reduce){
  .pubx-hero-chart *{ animation: none !important }
  .pubx-chart-pulse{ display:none }
}
/* Footer: WWW.UZ top-rating counter */
.ftr-counter{display:inline-flex; line-height:0; border-radius:4px; overflow:hidden; opacity:.85; transition:opacity .25s, transform .25s}
.ftr-counter:hover{opacity:1; transform:translateY(-1px)}
.ftr-counter img{display:block; width:88px; height:31px}

/* ══════════════════════════════════════════════════════════════
   PGX hero — "orbits" backdrop (page-category listings)
   Rings unfold from the centre once, then rotate very slowly in
   alternating directions. Colours follow the theme variables.
   ══════════════════════════════════════════════════════════════ */
.pgx-hero--orbit{ position:relative; overflow:hidden; isolation:isolate; }
.pgx-hero--orbit .container{ position:relative; z-index:1; }
.pgx-hero-orbit{
  position:absolute; z-index:0; pointer-events:none;
  width:560px; height:560px;
  top:50%; right:max(-120px, calc((100vw - 1320px) / 2 - 150px));
  transform: translateY(-50%);
  -webkit-mask-image: radial-gradient(circle at 50% 50%, #000 38%, transparent 72%);
          mask-image: radial-gradient(circle at 50% 50%, #000 38%, transparent 72%);
}
.pgx-hero-orbit circle{ fill:none; stroke: var(--accent); stroke-width:1.1; opacity:.2; }
.pgx-hero-orbit .pgx-orbit-dashed{ stroke-dasharray: 4 10; opacity:.26; }
.pgx-hero-orbit .pgx-orbit-dotted{ stroke-dasharray: 1 9; stroke-linecap:round; stroke-width:1.6; opacity:.28; }
.pgx-hero-orbit .pgx-orbit-node{ stroke:none; opacity:.85; }
.pgx-hero-orbit .pgx-orbit-node--gold{ fill: var(--gold-warm); }
.pgx-hero-orbit .pgx-orbit-node--blue{ fill: var(--blue-light); }
.pgx-orbit-axes line{ stroke: var(--accent); stroke-width:1; stroke-dasharray: 2 12; opacity:.12; animation: pgxFade 1.6s ease 1.2s backwards; }

.pgx-orbit-ring, .pgx-orbit-spin{ transform-origin: 260px 260px; }
.pgx-orbit-ring{ animation: pgxOrbitIn 1.5s var(--ease) backwards; }
.pgx-orbit-ring--1{ animation-delay:.15s }
.pgx-orbit-ring--2{ animation-delay:.38s }
.pgx-orbit-ring--3{ animation-delay:.61s }
.pgx-orbit-ring--4{ animation-delay:.84s }
.pgx-orbit-spin--a{ animation: pgxSpin 48s linear infinite; }
.pgx-orbit-spin--b{ animation: pgxSpin 76s linear infinite reverse; }
.pgx-orbit-spin--c{ animation: pgxSpin 110s linear infinite; }
.pgx-orbit-spin--d{ animation: pgxSpin 160s linear infinite reverse; }

@keyframes pgxOrbitIn{ from{ opacity:0; transform: scale(.35) rotate(-70deg) } }
@keyframes pgxSpin{ to{ transform: rotate(360deg) } }
@keyframes pgxFade{ from{ opacity:0 } }

@media (max-width: 900px){ .pgx-hero-orbit{ width:380px; height:380px; right:-140px; opacity:.6 } }
@media (max-width: 560px){ .pgx-hero-orbit{ display:none } }

/* ══════════════════════════════════════════════════════════════
   PIX hero — "data streams" backdrop (publication registry)
   Three thin ribbons along the bottom edge drift sideways at
   different speeds; edges fade out so they never touch the text.
   ══════════════════════════════════════════════════════════════ */
.pix-hero--flow{ overflow:hidden; isolation:isolate; padding-bottom: 4.2rem; }
.pix-hero--flow .container{ position:relative; z-index:1; }
.pix-hero-flow{
  position:absolute; left:0; right:0; bottom:0; z-index:0; pointer-events:none;
  width:100%; height:68px; display:block;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 82%, transparent 100%), linear-gradient(0deg, #000 60%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 82%, transparent 100%), linear-gradient(0deg, #000 60%, transparent 100%);
  -webkit-mask-composite: source-in; mask-composite: intersect;
  animation: pixFlowIn 1.6s var(--ease) .2s backwards;
}
.pix-hero-flow path{ fill:none; stroke-linecap:round; vector-effect: non-scaling-stroke; }
.pix-flow--a path{ stroke: var(--gold-warm); stroke-width:1.6; opacity:.5; }
.pix-flow--b path{ stroke: var(--accent);    stroke-width:1.3; opacity:.3; }
.pix-flow--c path{ stroke: var(--blue-light); stroke-width:1;  opacity:.24; stroke-dasharray: 3 9; }
.pix-flow--a{ animation: pixDriftA 34s linear infinite; }
.pix-flow--b{ animation: pixDriftB 52s linear infinite reverse; }
.pix-flow--c{ animation: pixDriftC 80s linear infinite; }

@keyframes pixDriftA{ to{ transform: translateX(-800px) } }
@keyframes pixDriftB{ to{ transform: translateX(-640px) } }
@keyframes pixDriftC{ to{ transform: translateX(-1000px) } }
@keyframes pixFlowIn{ from{ opacity:0; transform: translateY(26px) } }

@media (prefers-reduced-motion: reduce){
  .pgx-hero-orbit *, .pix-hero-flow, .pix-hero-flow *{ animation: none !important }
}
/* ══════════════════════════════════════════════════════════════
   PHX hero — "bokeh" backdrop (photo gallery)
   Soft out-of-focus lights snap into focus once, then drift.
   ══════════════════════════════════════════════════════════════ */
.phx-hero--bokeh{ position:relative; overflow:hidden; isolation:isolate; }
.phx-hero--bokeh .container{ position:relative; z-index:1; }
.phx-hero-bokeh{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.phx-bk{
  position:absolute; border-radius:50%;
  background: radial-gradient(circle, var(--bk, rgba(201,169,97,.34)) 0%, var(--bk, rgba(201,169,97,.34)) 42%, transparent 70%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.14);
  animation:
    phxFocus 1.8s var(--ease) backwards,
    phxDrift var(--dur, 22s) ease-in-out var(--delay, 0s) infinite alternate;
}
.phx-bk--1{ width:150px; height:150px; left:46%;  top:-34px;   --bk: rgba(201,169,97,.26); --dur:24s; --dx:34px;  --dy:22px;  animation-delay:.10s, 1.9s }
.phx-bk--2{ width:86px;  height:86px;  left:58%;  top:54%;     --bk: rgba(91,163,217,.26); --dur:19s; --dx:-26px; --dy:-18px; animation-delay:.25s, 2.05s }
.phx-bk--3{ width:210px; height:210px; right:-50px; top:-70px; --bk: rgba(59,130,196,.18); --dur:30s; --dx:-40px; --dy:26px;  animation-delay:.40s, 2.2s }
.phx-bk--4{ width:54px;  height:54px;  left:39%;  top:62%;     --bk: rgba(201,169,97,.34); --dur:16s; --dx:20px;  --dy:-14px; animation-delay:.55s, 2.35s }
.phx-bk--5{ width:118px; height:118px; right:16%; bottom:-46px;--bk: rgba(201,169,97,.20); --dur:27s; --dx:28px;  --dy:-22px; animation-delay:.70s, 2.5s }
.phx-bk--6{ width:38px;  height:38px;  left:66%;  top:16%;     --bk: rgba(91,163,217,.34); --dur:14s; --dx:-16px; --dy:14px;  animation-delay:.85s, 2.65s }
.phx-bk--7{ width:70px;  height:70px;  right:33%; top:8%;      --bk: rgba(59,130,196,.20); --dur:21s; --dx:18px;  --dy:20px;  animation-delay:1s, 2.8s }

@keyframes phxFocus{ from{ opacity:0; transform: scale(1.9); filter: blur(14px) } }
@keyframes phxDrift{ to{ transform: translate(var(--dx, 20px), var(--dy, 14px)) scale(1.07) } }
@media (max-width: 760px){ .phx-bk--1, .phx-bk--2, .phx-bk--4, .phx-bk--7{ display:none } }

/* ══════════════════════════════════════════════════════════════
   VDX hero — "waveform" backdrop (video gallery)
   An audio-track strip: bars breathe gently, a playhead glides over.
   ══════════════════════════════════════════════════════════════ */
.vdx-hero--wave .container{ position:relative; }
.vdx-hero--wave .vdx-hero-content{ position:relative; z-index:1; }
.vdx-hero-wave{
  position:absolute; right:0; top:50%; z-index:0; pointer-events:none;
  width:min(46%, 520px); height:108px;
  transform: translateY(-38%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 22%, #000 88%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0%, #000 22%, #000 88%, transparent 100%);
}
.vdx-wave-bars{ position:absolute; inset:0; display:flex; align-items:center; justify-content:space-between; gap:3px; }
.vdx-wave-bars span{
  flex:1 1 0; min-width:2px; max-width:5px;
  height: calc(var(--h, .5) * 100%);
  border-radius: 3px;
  background: linear-gradient(180deg, var(--gold-warm), var(--blue-light));
  opacity:.34;
  transform-origin: 50% 50%;
  animation:
    vdxBarIn .7s var(--ease) calc(.25s + var(--i, 0) * .022s) backwards,
    vdxBar var(--d, 2s) ease-in-out var(--s, 0s) infinite alternate;
}
.vdx-wave-head{
  position:absolute; top:-6px; bottom:-6px; left:0; width:2px; border-radius:2px;
  background: linear-gradient(180deg, transparent, var(--gold-warm) 25%, var(--gold-warm) 75%, transparent);
  box-shadow: 0 0 14px rgba(201,169,97,.55);
  opacity:.75;
  animation: vdxHead 9s linear 1.4s infinite backwards;
}
@keyframes vdxBarIn{ from{ opacity:0; transform: scaleY(0) } }
@keyframes vdxBar{ from{ transform: scaleY(.42) } to{ transform: scaleY(1) } }
@keyframes vdxHead{ from{ left:8% ; opacity:0 } 6%{ opacity:.75 } 94%{ opacity:.75 } to{ left:94%; opacity:0 } }
@media (max-width: 980px){ .vdx-hero-wave{ display:none } }

/* ══════════════════════════════════════════════════════════════
   FOOTER — quiet decoration
   A glint along the top edge, an outlined wordmark behind the
   bottom bar, and columns that rise in once when scrolled to.
   ══════════════════════════════════════════════════════════════ */
#ftr > .ftr-glint{
  position:absolute; top:0; left:0; right:0; height:1px; z-index:1; pointer-events:none;
  background: linear-gradient(90deg, transparent, rgba(201,169,97,.38) 30%, rgba(126,200,245,.3) 70%, transparent);
  overflow:hidden;
}
.ftr-glint::after{
  content:''; position:absolute; top:-1px; bottom:-1px; left:0; width:220px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.95), transparent);
  filter: blur(.4px);
  animation: ftrGlint 11s cubic-bezier(.45,0,.2,1) 1.5s infinite;
}
@keyframes ftrGlint{
  0%{ transform: translateX(-240px); opacity:0 }
  8%{ opacity:1 }
  55%{ opacity:1 }
  62%, 100%{ transform: translateX(100vw); opacity:0 }
}

#ftr > .ftr-mark{
  position:absolute; left:50%; bottom:-34px; z-index:-1; pointer-events:none;
  width:min(1180px, 96vw); height:auto;
  transform: translateX(-50%);
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 45%, transparent 92%);
          mask-image: linear-gradient(180deg, #000 0%, #000 45%, transparent 92%);
}
.ftr-mark text{
  font-family: var(--serif); font-size: 300px; font-weight: 700; font-style: italic;
  letter-spacing: -6px; fill: none; stroke-width: 1.2;
}
.ftr-mark-base{ stroke: rgba(255,255,255,.055); }
.ftr-mark-sheen{
  stroke-dasharray: 260 1500;
  animation: ftrMark 16s linear infinite;
  opacity:.9;
}
@keyframes ftrMark{ from{ stroke-dashoffset: 1760 } to{ stroke-dashoffset: 0 } }

/* columns rise in once (uses the shared [data-rv] observer in app.js) */
.rv-anim:not(.is-in)[data-rv="footer"] > div{ opacity:0 }
.rv-anim.is-in[data-rv="footer"] > div{
  animation: ftrColIn .9s var(--ease) backwards;
  animation-delay: calc(var(--rv-i, 0) * .12s);
}
@keyframes ftrColIn{ from{ opacity:0; transform: translateY(26px) } }

@media (max-width: 700px){ #ftr > .ftr-mark{ bottom:-12px } }
@media (prefers-reduced-motion: reduce){
  .phx-bk, .vdx-wave-bars span, .vdx-wave-head, .ftr-glint::after, .ftr-mark-sheen{ animation: none !important }
  .vdx-wave-head, .ftr-glint::after, .ftr-mark-sheen{ display:none }
  .rv-anim[data-rv="footer"] > div{ opacity:1 !important; animation: none !important }
}
/* ══════════════════════════════════════════════════════════════
   PHOTO HEROES — quiet effects over an uploaded background image
   (.page-hero / .nax-masthead / .prx-masthead with --ph-bg, no video)
   app.js injects one <span class="ph-fx"> per hero:
     .ph-fx-img    slow "Ken Burns" drift of the same picture
     .ph-fx-sheen  a soft band of light that crosses now and then
     .ph-fx-c      four viewfinder corners that settle into place once
     .ph-fx-line   a thin gold line flowing along the bottom edge
   Nothing here covers the picture: every layer is a hairline or a
   few-percent highlight.
   ══════════════════════════════════════════════════════════════ */
.ph-has-fx{ position:relative; overflow:hidden; isolation:isolate; }
.ph-has-fx > .container{ position:relative; z-index:2; }
.ph-fx{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; display:block; }
.ph-fx > *{ position:absolute; display:block; }

/* picture: same image as the hero background, drifting very slowly */
.ph-fx-img{
  inset:0;
  background-image: var(--ph-bg);
  background-size: cover; background-repeat: no-repeat;
  background-position: var(--ph-pos, center);
  transform-origin: 62% 42%;
  animation:
    phFxIn 1.4s var(--ease) backwards,
    phFxKen 32s ease-in-out 1.4s infinite alternate;
  will-change: transform;
}
/* the same dark veil the hero puts over its own background */
.ph-fx-veil{ inset:0; }
.page-hero   > .ph-fx .ph-fx-veil{ background: linear-gradient(135deg, rgba(11,26,43,.88) 0%, rgba(11,26,43,.66) 55%, rgba(11,26,43,.9) 100%); }
.nax-masthead > .ph-fx .ph-fx-veil{ background:
  linear-gradient(180deg, rgba(11,26,43,.92) 0%, rgba(11,26,43,.45) 28%, rgba(11,26,43,.55) 100%),
  linear-gradient(135deg, rgba(11,26,43,.7) 0%, rgba(11,26,43,.42) 55%, rgba(11,26,43,.85) 100%); }
.prx-masthead > .ph-fx .ph-fx-veil{ background:
  linear-gradient(180deg, rgba(11,26,43,.9) 0%, rgba(11,26,43,.5) 30%, rgba(11,26,43,.78) 100%),
  linear-gradient(135deg, rgba(11,26,43,.55) 0%, rgba(11,26,43,.35) 55%, rgba(11,26,43,.8) 100%); }

/* light band */
.ph-fx-sheen{
  top:-20%; bottom:-20%; left:0; width:34%;
  background: linear-gradient(100deg, transparent 0%, rgba(255,255,255,.055) 38%, rgba(230,212,163,.10) 50%, rgba(255,255,255,.055) 62%, transparent 100%);
  transform: translateX(-140%) skewX(-14deg);
  animation: phFxSheen 14s cubic-bezier(.45,0,.25,1) 2.2s infinite;
}

/* viewfinder corners */
.ph-fx-c{
  width:30px; height:30px;
  border: 0 solid rgba(230,212,163,.72);
  animation: phFxCorner 1.3s var(--ease) .5s backwards;
}
.ph-fx-c--tl{ top:104px;  left:26px;  border-top-width:1.5px;    border-left-width:1.5px;  --fx:-16px; --fy:-16px; }
.ph-fx-c--tr{ top:104px;  right:26px; border-top-width:1.5px;    border-right-width:1.5px; --fx:16px;  --fy:-16px; }
.ph-fx-c--bl{ bottom:26px; left:26px;  border-bottom-width:1.5px; border-left-width:1.5px;  --fx:-16px; --fy:16px; }
.ph-fx-c--br{ bottom:26px; right:26px; border-bottom-width:1.5px; border-right-width:1.5px; --fx:16px;  --fy:16px; }

/* bottom hairline */
.ph-fx-line{
  left:0; right:0; bottom:0; height:2px;
  background: linear-gradient(90deg, transparent 0%, rgba(201,169,97,.0) 10%, rgba(201,169,97,.85) 35%, rgba(126,200,245,.7) 50%, rgba(201,169,97,.85) 65%, rgba(201,169,97,.0) 90%, transparent 100%);
  background-size: 200% 100%;
  opacity:.75;
  animation: phFxIn 1.6s ease 1s backwards, phFxFlow 9s linear infinite;
}

@keyframes phFxIn{ from{ opacity:0 } }
@keyframes phFxKen{ from{ transform: scale(1) translate3d(0,0,0) } to{ transform: scale(1.075) translate3d(-1.2%, -.8%, 0) } }
@keyframes phFxSheen{
  0%{ transform: translateX(-140%) skewX(-14deg) }
  22%, 100%{ transform: translateX(440%) skewX(-14deg) }
}
@keyframes phFxCorner{ from{ opacity:0; transform: translate(var(--fx, 0), var(--fy, 0)) scale(1.5) } }
@keyframes phFxFlow{ from{ background-position: 200% 0 } to{ background-position: 0 0 } }

@media (max-width: 760px){
  .ph-fx-c{ width:20px; height:20px }
  .ph-fx-c--tl, .ph-fx-c--tr{ top:84px }
  .ph-fx-c--tl, .ph-fx-c--bl{ left:14px }
  .ph-fx-c--tr, .ph-fx-c--br{ right:14px }
  .ph-fx-c--bl, .ph-fx-c--br{ bottom:14px }
}
/* ══════════════════════════════════════════════════════════════
   STRUCTURE PAGE — org chart, premium pass
   Same shape as before (director → five branches → their units);
   only the surface changes: real connectors with travelling light,
   numbered glass cards, accent colour per branch, staged entrance.
   ══════════════════════════════════════════════════════════════ */
#org-tree{ overflow: hidden; isolation: isolate; }

/* branch accent colours */
.org-branch:nth-child(1){ --dc:#2563a8 }
.org-branch:nth-child(2){ --dc:#3b82c4 }
.org-branch:nth-child(3){ --dc:#b08d3f }
.org-branch:nth-child(4){ --dc:#4f9ad6 }
.org-branch:nth-child(5){ --dc:#c9a961 }
.org-branch:nth-child(n+6){ --dc:#3b82c4 }

/* ── Director ── */
.org-tree[data-rv="org"] .org-tier-top .org-card.lead{
  max-width: 360px; padding: 2rem 1.75rem 1.8rem;
  border-radius: 20px;
  background: linear-gradient(140deg, #1d5288 0%, var(--navy-deep) 62%, var(--ink) 100%);
  box-shadow: 0 26px 60px -18px rgba(13,30,48,.55), 0 0 0 1px rgba(255,255,255,.06) inset;
  overflow: visible;
}
.org-tree[data-rv="org"] .org-card.lead::before{ border-radius: inherit; }
/* slow gold/blue ring around the director card */
.org-tree[data-rv="org"] .org-card.lead::after{
  content:''; position:absolute; inset:-1px; border-radius: inherit; padding:1.5px; pointer-events:none;
  background: conic-gradient(from var(--org-a, 0deg), transparent 0deg, rgba(201,169,97,.95) 50deg, rgba(126,200,245,.8) 110deg, transparent 170deg, transparent 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  animation: orgRing 9s linear infinite;
}
@property --org-a{ syntax:'<angle>'; inherits:false; initial-value:0deg; }
@keyframes orgRing{ to{ --org-a: 360deg } }
.org-card-halo{
  position:absolute; left:50%; top:50%; z-index:-1; pointer-events:none;
  width: 150%; aspect-ratio: 1.6 / 1; transform: translate(-50%, -50%);
  background: radial-gradient(closest-side, rgba(59,130,196,.22), transparent 72%);
  animation: orgHalo 6s ease-in-out infinite alternate;
}
@keyframes orgHalo{ from{ opacity:.55; transform: translate(-50%,-50%) scale(.94) } to{ opacity:1; transform: translate(-50%,-50%) scale(1.06) } }
.org-tree[data-rv="org"] .org-card.lead .org-card-ico{ width:54px; height:54px; border-radius:15px; }
.org-tree[data-rv="org"] .org-card.lead .org-card-title{ font-size:1.42rem; letter-spacing:-.3px; }

/* ── Connectors (desktop tree) ── */
@media (min-width: 901px){
  .org-tree[data-rv="org"]{ gap: 0; }
  .org-tree[data-rv="org"] .org-rail{ height: 76px; margin: 0; }
  /* stem from the director down to the bus line */
  .org-tree[data-rv="org"] .org-rail::after{
    top:0; bottom:auto; height:38px; width:2px;
    background: linear-gradient(180deg, var(--gold) 0%, var(--gold-warm) 100%);
    transform-origin: 50% 0;
  }
  /* bus line: from the centre of the first branch to the centre of the last */
  .org-tree[data-rv="org"] .org-rail::before{
    top:37px; height:2px;
    left:  calc((100% - (var(--org-n, 5) - 1) * 2rem) / (2 * var(--org-n, 5)));
    right: calc((100% - (var(--org-n, 5) - 1) * 2rem) / (2 * var(--org-n, 5)));
    background:
      linear-gradient(90deg, transparent 0%, rgba(255,255,255,.95) 50%, transparent 100%) 0 0 / 22% 100% no-repeat,
      linear-gradient(90deg, var(--gold-warm), var(--gold) 50%, var(--gold-warm));
    transform-origin: 50% 50%;
    animation: orgBus 5.5s linear 2.2s infinite;
  }
  /* drop from the bus line to each branch card, with a node on the line */
  .org-tree[data-rv="org"] .org-branch{ position:relative; }
  .org-tree[data-rv="org"] .org-branch::before{
    content:''; position:absolute; left:50%; top:-38px; width:2px; height:38px; margin-left:-1px;
    background: linear-gradient(180deg, var(--gold-warm), var(--dc, var(--gold)));
    transform-origin: 50% 0;
  }
  .org-tree[data-rv="org"] .org-branch::after{
    content:''; position:absolute; left:50%; top:-43px; width:10px; height:10px; margin-left:-5px;
    border-radius:50%; background: var(--bg); border:2px solid var(--gold);
    box-shadow: 0 0 0 4px rgba(201,169,97,.14);
  }
}
@keyframes orgBus{ from{ background-position: -30% 0, 0 0 } to{ background-position: 130% 0, 0 0 } }

/* ── Branch (deputy / department) cards ── */
.org-tree[data-rv="org"] .org-branch > .org-card{
  padding: 1.5rem 1.2rem 1.25rem;
  border-radius: 16px;
  background: linear-gradient(180deg, var(--card), var(--card-h));
  border: 1px solid var(--bdr);
  overflow: hidden; isolation: isolate;
}
.org-tree[data-rv="org"] .org-branch > .org-card::before{
  content:''; position:absolute; left:0; right:0; top:0; height:4px; z-index:1;
  background: linear-gradient(90deg, var(--dc), color-mix(in srgb, var(--dc) 45%, var(--gold)));
}
.org-tree[data-rv="org"] .org-branch > .org-card::after{
  content:''; position:absolute; right:-40px; top:-40px; width:140px; height:140px; border-radius:50%; z-index:-1;
  background: radial-gradient(circle, color-mix(in srgb, var(--dc) 22%, transparent), transparent 70%);
  transition: transform .6s var(--ease);
}
.org-tree[data-rv="org"] .org-branch > .org-card:hover{ border-color: color-mix(in srgb, var(--dc) 55%, transparent); }
.org-tree[data-rv="org"] .org-branch > .org-card:hover::after{ transform: scale(1.5); }
.org-tree[data-rv="org"] .org-branch .org-card-ico{
  background: linear-gradient(135deg, var(--dc), color-mix(in srgb, var(--dc) 55%, #0b1a2b));
  box-shadow: 0 8px 20px -6px color-mix(in srgb, var(--dc) 70%, transparent), inset 0 1px 0 rgba(255,255,255,.22);
}
.org-card-num{
  position:absolute; right:.9rem; top:.75rem;
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 1.9rem; line-height:1; letter-spacing:-1px;
  color: var(--dc); opacity:.22;
  transition: opacity .35s, transform .35s var(--ease);
}
.org-card:hover .org-card-num{ opacity:.5; transform: translateY(-2px); }
.org-card-count{
  display:inline-flex; align-items:center; gap:.35rem;
  margin-top:.35rem; padding:.22rem .6rem;
  font-size:.72rem; font-weight:700; letter-spacing:.3px;
  color: var(--dc);
  background: color-mix(in srgb, var(--dc) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--dc) 26%, transparent);
  border-radius: 100px;
}
.org-card-count svg{ width:12px; height:12px; }

.org-tree[data-rv="org"] .org-branch-rail{
  height: 26px;
  background: linear-gradient(180deg, var(--dc), color-mix(in srgb, var(--dc) 40%, transparent));
}

/* ── Units ── */
.org-tree[data-rv="org"] .org-branch-list{ gap:.6rem; }
.org-tree[data-rv="org"] .org-leaf{
  display:grid; grid-template-columns:auto 1fr; align-items:center; gap:.7rem;
  padding:.72rem .85rem .72rem .75rem;
  text-align:left;
  background: var(--card);
  border:1px solid var(--bdr);
  border-left: 3px solid color-mix(in srgb, var(--dc) 70%, transparent);
  border-radius: 11px;
  box-shadow: var(--shadow-1);
  transition: transform .3s var(--ease), box-shadow .3s, border-color .3s, background .3s;
}
.org-tree[data-rv="org"] .org-leaf:hover{
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--dc) 45%, transparent);
  border-left-color: var(--dc);
  box-shadow: var(--shadow-1), var(--shadow-2);
  background: var(--card-h);
}
.org-tree[data-rv="org"] .org-leaf::before{
  background: linear-gradient(180deg, color-mix(in srgb, var(--dc) 70%, transparent), transparent);
}
.org-leaf-n{
  min-width: 2.1rem; text-align:center;
  font-family: var(--serif); font-style: italic; font-weight: 700; font-size:.82rem;
  color: var(--dc);
  padding:.18rem .3rem; border-radius:7px;
  background: color-mix(in srgb, var(--dc) 10%, transparent);
}
.org-leaf-t{ font-size:.82rem; font-weight:500; line-height:1.4; color: var(--t1); }

/* ── Staged entrance (shared [data-rv] observer) ── */
.rv-anim:not(.is-in)[data-rv="org"] .org-card.lead,
.rv-anim:not(.is-in)[data-rv="org"] .org-rail,
.rv-anim:not(.is-in)[data-rv="org"] .org-branch{ opacity:0 }

.rv-anim.is-in[data-rv="org"] .org-card.lead{ animation: orgLeadIn .9s var(--ease) backwards; }
.rv-anim.is-in[data-rv="org"] .org-rail::after{ animation: orgGrowY .45s var(--ease) .55s backwards; }
.rv-anim.is-in[data-rv="org"] .org-rail::before{ animation: orgGrowX .7s var(--ease) .95s backwards, orgBus 5.5s linear 2.2s infinite; }
.rv-anim.is-in[data-rv="org"] .org-branch{
  animation: orgBranchIn .75s var(--ease) backwards;
  animation-delay: calc(1.35s + var(--rv-i, 0) * .1s);
}
.rv-anim.is-in[data-rv="org"] .org-leaf{
  animation: orgLeafIn .55s var(--ease) backwards;
  animation-delay: calc(1.75s + var(--rv-i, 0) * .1s + var(--l, 0) * .05s);
}
.org-leaf:nth-child(2){--l:1} .org-leaf:nth-child(3){--l:2} .org-leaf:nth-child(4){--l:3}
.org-leaf:nth-child(5){--l:4} .org-leaf:nth-child(6){--l:5} .org-leaf:nth-child(7){--l:6}
.org-leaf:nth-child(8){--l:7} .org-leaf:nth-child(9){--l:8} .org-leaf:nth-child(n+10){--l:9}

@keyframes orgLeadIn{ from{ opacity:0; transform: translateY(-18px) scale(.9) } }
@keyframes orgGrowY{ from{ transform: translateX(-50%) scaleY(0) } }
@keyframes orgGrowX{ from{ transform: scaleX(0) } }
@keyframes orgBranchIn{ from{ opacity:0; transform: translateY(26px) } }
@keyframes orgLeafIn{ from{ opacity:0; transform: translateY(12px) } }

@media (max-width: 900px){
  .org-tree[data-rv="org"]{ gap: 1.5rem; }
  .org-tree[data-rv="org"] .org-branch-list{ margin-top:.8rem; }
}
@media (prefers-reduced-motion: reduce){
  .rv-anim[data-rv="org"] .org-card.lead, .rv-anim[data-rv="org"] .org-rail, .rv-anim[data-rv="org"] .org-branch{ opacity:1 !important }
  .org-tree[data-rv="org"] *, .org-tree[data-rv="org"] *::before, .org-tree[data-rv="org"] *::after{ animation: none !important }
}
/* structure page: brighter branch accents on the dark theme */
[data-theme="dark"] .org-branch:nth-child(1){ --dc:#6aa8e0 }
[data-theme="dark"] .org-branch:nth-child(2){ --dc:#7ec8f5 }
[data-theme="dark"] .org-branch:nth-child(3){ --dc:#c9a961 }
[data-theme="dark"] .org-branch:nth-child(4){ --dc:#5ba3d9 }
[data-theme="dark"] .org-branch:nth-child(5){ --dc:#e6d4a3 }
[data-theme="dark"] .org-branch:nth-child(n+6){ --dc:#7ec8f5 }

/* night theme: partner counters were dark-blue on dark */
[data-theme="dark"] .pstat-num{ background: linear-gradient(135deg, #e3eefa, #7ec8f5); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ══════════════════════════════════════════════════════════════
   HEADER mega-panel — opening choreography
   The panel still opens on hover / keyboard focus exactly as before;
   these rules only describe HOW it appears: the sheet unrolls from
   under the header, a gold line is drawn across its top edge, then
   the intro, the column headings and the links arrive in sequence.
   Keyframes define only "from", so hover states keep working.
   ══════════════════════════════════════════════════════════════ */
@media (min-width: 1101px){
  #hdr .mega{ overflow: hidden; }
  /* gold line across the top edge */
  #hdr .mega::before{
    content:''; position:absolute; left:0; right:0; top:0; height:2px; z-index:2; pointer-events:none;
    background: linear-gradient(90deg, var(--gold) 0%, rgba(126,200,245,.9) 45%, transparent 85%);
    transform: scaleX(0); transform-origin: 0 50%;
  }
  /* soft light in the far corner */
  #hdr .mega::after{
    content:''; position:absolute; right:-140px; top:-180px; width:560px; height:560px; z-index:0; pointer-events:none;
    border-radius:50%;
    background: radial-gradient(circle, rgba(59,130,196,.22), transparent 68%);
    opacity:0;
  }
  #hdr .mega-in{ position:relative; z-index:1; }

  #hdr .has-sub:hover > .mega,
  #hdr .has-sub:focus-within > .mega{ animation: megaSheet .55s cubic-bezier(.2,.85,.25,1) backwards; }
  #hdr .has-sub:hover > .mega::before,
  #hdr .has-sub:focus-within > .mega::before{ transform: scaleX(1); transition: transform .8s cubic-bezier(.6,0,.2,1) .1s; }
  #hdr .has-sub:hover > .mega::after,
  #hdr .has-sub:focus-within > .mega::after{ opacity:1; animation: megaGlow 1.4s var(--ease) backwards; }

  /* intro: title, text, link */
  #hdr .has-sub:hover .mega-intro > *,
  #hdr .has-sub:focus-within .mega-intro > *{ animation: megaRise .6s var(--ease) backwards; }
  #hdr .has-sub:hover .mega-intro > *:nth-child(1),
  #hdr .has-sub:focus-within .mega-intro > *:nth-child(1){ animation-delay:.12s }
  #hdr .has-sub:hover .mega-intro > *:nth-child(2),
  #hdr .has-sub:focus-within .mega-intro > *:nth-child(2){ animation-delay:.2s }
  #hdr .has-sub:hover .mega-intro > *:nth-child(3),
  #hdr .has-sub:focus-within .mega-intro > *:nth-child(3){ animation-delay:.28s }
  /* the divider next to the intro grows downward */
  #hdr .mega-intro{ position:relative; border-right-color: transparent; }
  #hdr .mega-intro::after{
    content:''; position:absolute; right:-1px; top:0; bottom:0; width:1px;
    background: linear-gradient(180deg, rgba(201,169,97,.55), rgba(255,255,255,.08) 55%, transparent);
    transform-origin: 50% 0;
  }
  #hdr .has-sub:hover .mega-intro::after,
  #hdr .has-sub:focus-within .mega-intro::after{ animation: megaGrowY .7s var(--ease) .15s backwards; }

  /* column headings, then links in a cascade */
  #hdr .has-sub:hover .mega-h,
  #hdr .has-sub:focus-within .mega-h{ animation: megaRise .5s var(--ease) backwards; animation-delay: calc(.2s + var(--c, 0) * .07s); }
  #hdr .has-sub:hover .mega-list a,
  #hdr .has-sub:focus-within .mega-list a{
    animation: megaLink .45s var(--ease) backwards;
    animation-delay: calc(.26s + var(--c, 0) * .07s + var(--k, 0) * .035s);
  }
  #hdr .mega-col:nth-child(2){ --c:1 } #hdr .mega-col:nth-child(3){ --c:2 } #hdr .mega-col:nth-child(4){ --c:3 }
  #hdr .mega-list a:nth-child(2){--k:1} #hdr .mega-list a:nth-child(3){--k:2} #hdr .mega-list a:nth-child(4){--k:3}
  #hdr .mega-list a:nth-child(5){--k:4} #hdr .mega-list a:nth-child(6){--k:5} #hdr .mega-list a:nth-child(7){--k:6}
  #hdr .mega-list a:nth-child(8){--k:7} #hdr .mega-list a:nth-child(9){--k:8} #hdr .mega-list a:nth-child(10){--k:9}
  #hdr .mega-list a:nth-child(n+11){--k:10}
}
@keyframes megaSheet{ from{ clip-path: inset(0 0 100% 0) } to{ clip-path: inset(0 0 0 0) } }
@keyframes megaGlow{ from{ opacity:0; transform: translate(80px, -40px) scale(.7) } }
@keyframes megaRise{ from{ opacity:0; transform: translateY(14px) } }
@keyframes megaLink{ from{ opacity:0; transform: translateX(-12px) } }
@keyframes megaGrowY{ from{ transform: scaleY(0) } }
@media (prefers-reduced-motion: reduce){
  #hdr .mega, #hdr .mega *, #hdr .mega::before, #hdr .mega::after, #hdr .mega-intro::after{ animation: none !important; transition: none !important; }
}
/* ══════════════════════════════════════════════════════════════
   Mobile fixes found in the pre-release pass
   ══════════════════════════════════════════════════════════════ */
/* /contacts: the map kept a 280px minimum height with a 16:9 ratio, which forced it
   to ~498px wide on phones and cut its right side off. */
@media (max-width: 640px){
  .ctx-map{ aspect-ratio: auto; min-height: 0; height: 260px; width: 100%; }
}
/* Elements that slide in from the side must never create a sideways scroll while they wait. */
html{ overflow-x: clip; }
/* Article bodies: a long unbreakable run (a URL, or words glued with non-breaking spaces)
   must wrap inside the column instead of being cut off at its edge. */
.nwx-body, .pubx-content, .page-article-content,
.nwx-body *, .pubx-content *, .page-article-content *{ overflow-wrap: anywhere; }
.nwx-body table, .pubx-content table, .page-article-content table{ max-width: 100%; }
/* ══════════════════════════════════════════════════════════════
   LEADERSHIP + STAFF cards (/administrations, /employees) — premium pass
   Same structure (photo, role, name, text, contacts, expandable panel);
   only the surface changes. Both pages share the .adm-* classes.
   ══════════════════════════════════════════════════════════════ */
.adm-grid{ counter-reset: adm; gap: 1.6rem; }

.adm-card{
  counter-increment: adm;
  position: relative; isolation: isolate;
  grid-template-columns: 236px 1fr;
  align-items: stretch;
  gap: 1.75rem;
  padding: 14px;
  background: linear-gradient(180deg, var(--bg2), var(--card-h));
  border: 1px solid var(--bdr);
  border-radius: 22px;
  box-shadow: var(--shadow-1), var(--shadow-2);
  overflow: hidden;
  transition: transform .45s var(--ease), box-shadow .45s, border-color .45s;
}
[data-theme="light"] .adm-card{ background: linear-gradient(180deg, #ffffff, #f7fbff); }
/* accent rail on the left edge, grows on hover */
.adm-card::before{
  content:''; position:absolute; left:0; top:22px; bottom:22px; width:3px; z-index:2;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(180deg, var(--gold), var(--blue-light));
  transform: scaleY(.28); transform-origin: 50% 0;
  transition: transform .6s var(--ease);
}
/* gold/blue ring that appears on hover */
.adm-card::after{
  content:''; position:absolute; inset:0; border-radius: inherit; padding:1.5px; z-index:3; pointer-events:none;
  background: conic-gradient(from 120deg, transparent 0%, rgba(201,169,97,.7) 22%, rgba(126,200,245,.6) 48%, transparent 72%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity:0; transition: opacity .5s var(--ease);
}
.adm-card:hover{
  transform: translateY(-4px);
  border-color: transparent;
  box-shadow: var(--shadow-1), var(--shadow-3), 0 30px 70px -30px rgba(26,74,122,.28);
}
.adm-card:hover::before{ transform: scaleY(1); }
.adm-card:hover::after{ opacity:1; }

/* photo: framed, with a soft veil and a slow zoom on hover */
.adm-card-photo{
  aspect-ratio: 4 / 5;
  border-radius: 14px;
  box-shadow: 0 18px 36px -18px rgba(8,15,30,.45);
  align-self: start;
}
.adm-card-photo img{ width:100%; height:100%; object-fit:cover; display:block; transition: transform .9s var(--ease), filter .5s; }
.adm-card:hover .adm-card-photo img{ transform: scale(1.05); }
.adm-card-photo::after{
  background:
    linear-gradient(180deg, transparent 58%, rgba(8,21,34,.42) 100%),
    linear-gradient(135deg, rgba(126,200,245,.10), transparent 40%);
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.16);
}
/* viewfinder corner on the photo */
.adm-card-photo::before{
  content:''; position:absolute; left:12px; bottom:12px; width:22px; height:22px; z-index:2; pointer-events:none;
  border-left:1.5px solid rgba(230,212,163,.85); border-bottom:1.5px solid rgba(230,212,163,.85);
  opacity:.0; transform: translate(-6px, 6px);
  transition: opacity .4s, transform .5s var(--ease);
}
.adm-card:hover .adm-card-photo::before{ opacity:1; transform:none; }

/* body */
.adm-card-body{
  position: relative;
  padding: .9rem 1.4rem .9rem 0;
}
/* big index numeral in the corner (01, 02, …) */
.adm-card-body::after{
  content: counter(adm, decimal-leading-zero);
  position:absolute; right:1.1rem; top:.2rem; z-index:-1; pointer-events:none;
  font-family: var(--serif); font-style: italic; font-weight: 800;
  font-size: 3.4rem; line-height:1; letter-spacing:-2px;
  color: var(--gold-warm); opacity:.14;
  transition: opacity .4s, transform .5s var(--ease);
}
.adm-card:hover .adm-card-body::after{ opacity:.3; transform: translateY(-3px); }

.adm-card-pos{
  display:inline-flex; align-items:center; gap:.5rem; align-self:flex-start;
  margin:0 0 .75rem; padding:.34rem .8rem .34rem .65rem;
  font-size:.66rem; letter-spacing:.14em;
  color: var(--accent);
  background: var(--accent-g);
  border: 1px solid color-mix(in srgb, var(--accent) 22%, transparent);
  border-radius: 100px;
  max-width: calc(100% - 4.5rem);
}
.adm-card-pos::before{
  content:''; width:6px; height:6px; border-radius:50%; flex-shrink:0;
  background: var(--gold); box-shadow: 0 0 0 3px rgba(201,169,97,.18);
}
.adm-card-name{
  font-size: clamp(1.2rem, 1.7vw, 1.5rem);
  letter-spacing:-.3px; line-height:1.2;
  margin:0 0 .85rem;
  transition: color .3s;
}
.adm-card:hover .adm-card-name{ color: var(--accent); }
.adm-card-duties{ font-size:.9rem; line-height:1.68; max-width: 78ch; }

/* contacts as chips */
.adm-card-contact{
  flex-direction: row; flex-wrap: wrap; gap:.5rem;
  border-top: 0; padding: .2rem 0 0; margin: 0 0 1.1rem;
}
.adm-card-contact li{
  padding:.42rem .8rem;
  background: var(--bg3);
  border: 1px solid var(--bdr);
  border-radius: 100px;
  font-size:.8rem; color: var(--t1);
  transition: background .25s, border-color .25s, transform .3s var(--ease);
  min-width:0; max-width:100%;
}
.adm-card-contact li:hover{ background: var(--accent-g); border-color: var(--bdr-h); transform: translateY(-1px); }

/* /employees: the project line as a quiet tag block */
.adm-card-duties:has(.emp-project-label){
  display:block; -webkit-line-clamp: unset; line-clamp: unset;
  padding:.7rem .9rem;
  background: linear-gradient(90deg, rgba(201,169,97,.10), transparent 85%);
  border-left: 2px solid var(--gold);
  border-radius: 0 10px 10px 0;
  color: var(--t1); font-size:.9rem;
}
.emp-project-label{ display:block; margin:0 0 .2rem; font-size:.62rem; letter-spacing:.2em; }

/* /administrations: the director's card leads in the institute colours */
#leaders .adm-card:first-child{
  background: linear-gradient(140deg, #1d5288 0%, var(--navy-deep) 60%, var(--ink) 100%);
  border-color: transparent;
  box-shadow: 0 30px 70px -28px rgba(13,30,48,.6);
}
#leaders .adm-card:first-child .adm-card-name{ color:#fff; font-size: clamp(1.35rem, 2vw, 1.75rem); }
#leaders .adm-card:first-child:hover .adm-card-name{ color: var(--gold-soft); }
#leaders .adm-card:first-child .adm-card-duties{ color: rgba(255,255,255,.78); }
#leaders .adm-card:first-child .adm-card-pos{ color: var(--gold-soft); background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.16); }
#leaders .adm-card:first-child .adm-card-contact li{ background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.14); color:#fff; }
#leaders .adm-card:first-child .adm-card-contact li:hover{ background: rgba(255,255,255,.16); }
#leaders .adm-card:first-child .adm-card-contact svg{ color: var(--gold-soft); }
#leaders .adm-card:first-child .adm-card-body::after{ color:#fff; opacity:.12; }
#leaders .adm-card:first-child::before{ transform: scaleY(1); background: linear-gradient(180deg, var(--gold), var(--gold-warm)); }
#leaders .adm-card:first-child .adm-card-bio-inner{ background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); color: rgba(255,255,255,.86); }
#leaders .adm-card:first-child .adm-card-bio-inner *{ color: inherit; }

/* team panel: members in two columns when there is room */
.emp-team{ border-radius: 14px; }
.emp-team-list{ display:grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap:.65rem; }
.emp-team-item{
  border-radius: 12px;
  transition: background .25s, border-color .25s, transform .3s var(--ease), box-shadow .3s;
}
.emp-team-item:hover{ transform: translateY(-2px); box-shadow: var(--shadow-1), var(--shadow-2); }
.emp-team-photo{ box-shadow: 0 0 0 2px var(--bg2), 0 0 0 3px rgba(201,169,97,.5); }

@media (max-width: 900px){
  .adm-card{ grid-template-columns: 190px 1fr; gap: 1.2rem; }
  .adm-card-body::after{ font-size: 2.6rem; }
}
@media (max-width: 560px){
  .adm-card{ grid-template-columns: 1fr; gap: .4rem; padding: 12px; }
  .adm-card-photo{ aspect-ratio: 4 / 3.6; }
  .adm-card-body{ padding: .9rem .4rem .5rem; }
  .adm-card-pos{ max-width: calc(100% - 3.5rem); }
}
/* cards: show the whole text (the old 3-line clamp cut a line in half), and never stretch it */
.adm-card-duties{
  display:block; -webkit-line-clamp: unset; line-clamp: unset; -webkit-box-orient: initial;
  max-height:none; overflow:visible; flex: 0 0 auto;
}
.adm-card-duties:has(.emp-project-label){ align-self: flex-start; min-width: min(100%, 420px); }
/* director's card: the expand button in the card's own colours */
#leaders .adm-card:first-child .leader-bio-btn{
  color:#fff; background: rgba(255,255,255,.10);
  border-color: rgba(230,212,163,.55);
  box-shadow: none;
}
#leaders .adm-card:first-child .leader-bio-btn:hover{ color:#0d1e30; background: var(--gold-soft); }
/* /administrations: no index numerals in the card corner */
#leaders .adm-card-body::after{ content:none; }
#leaders .adm-card-pos{ max-width:100%; }
/* team members: the address must always be readable in full. The envelope icon already says
   "email", so the word itself is dropped here and the address may wrap instead of being cut. */
.emp-team-mail .emp-email-label{ display:none; }
.emp-team-mail,
#employees .emp-team-mail{
  display:flex; align-items:flex-start; white-space:normal; overflow:visible; text-overflow:clip;
  overflow-wrap:anywhere; line-height:1.35;
}
.emp-team-mail svg{ margin-top:.2em; }
.emp-team-list{ grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); }
/* Header logo: the stacked mark (plate + two lines of text) needs more height than the old
   wide one to stay readable. It fills the bar, leaving a small margin above and below. */
#hdr .logo-img{ height: 56px; }
@media (max-width: 900px){ #hdr .logo-img{ height: 54px; } }
@media (max-width: 480px){ #hdr .logo-img{ height: 50px; } }
/* Desktop: the bar itself is taller so the logo can be big enough for the institute name
   to be read, while still keeping clear space above and below it. It slims down on scroll. */
@media (min-width: 1101px){
  #hdr .nav-wrap{ height: 100px; }
  #hdr .logo-img{ height: 82px; }
  #hdr.sc .nav-wrap{ height: 66px; }
  #hdr.sc .logo-img{ height: 54px; }
  /* page tops that start right under the fixed bar need the extra room too */
  .pix-hero,.nax-masthead,.lwx-hero,.jrx-hero,.igx-hero,.phx-hero,
  .ctx-hero,.vcx-hero,.wbx-hero,.pgx-hero,.prx-masthead{ padding-top: 7.4rem; }
  .hero-crumb{ top: 116px; }
  .ph-fx-c--tl, .ph-fx-c--tr{ top: 118px; }

  /* Divider between the logo and the menu: a hairline that fades at both ends (gold into
     blue, like the other rules on the site). */
  #hdr .logo{ position: relative; }
  #hdr .logo::after{
    content:''; position:absolute; top:14%; bottom:14%; right:-1.125rem; width:1px;
    left:auto; height:auto; border:0; border-radius:0; opacity:1; transform:none; animation:none;
    background: linear-gradient(180deg, transparent 0%, rgba(201,169,97,.75) 28%, rgba(126,200,245,.55) 72%, transparent 100%);
    pointer-events:none;
  }
}
/* ══════════════════════════════════════════════════════════════
   NOTICE BOARD (dsx-) — /pages/for-doctoral-students
   Announcements grouped by year on a date rail, the newest one
   featured on top, and PDF-only pages collected in a side panel.
   ══════════════════════════════════════════════════════════════ */
.dsx-sec{ padding: 2.6rem 0 5rem; background: var(--bg); }
.dsx-sec [hidden]{ display:none !important; }

/* toolbar */
.dsx-tools{
  display:flex; align-items:center; justify-content:space-between; gap:1rem 1.5rem; flex-wrap:wrap;
  padding-bottom:1.4rem; margin-bottom:2rem; border-bottom:1px solid var(--bdr);
}
.dsx-chips{ display:flex; flex-wrap:wrap; gap:.45rem; }
.dsx-chip{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.5rem .95rem; border-radius:100px;
  font-family: var(--serif); font-size:.9rem; font-weight:700; font-style:italic;
  color: var(--t2); background: var(--card); border:1px solid var(--bdr);
  transition: color .25s, background .25s, border-color .25s, transform .25s var(--ease), box-shadow .25s;
}
.dsx-chip span{
  font-family: var(--sans); font-style:normal; font-size:.68rem; font-weight:700;
  padding:.08rem .45rem; border-radius:100px; background: var(--accent-g); color: var(--accent);
}
.dsx-chip:hover{ color: var(--accent); border-color: var(--bdr-h); transform: translateY(-1px); }
.dsx-chip.is-active{
  color:#fff; border-color:transparent;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  box-shadow: 0 6px 18px rgba(26,74,122,.3), inset 0 1px 0 rgba(255,255,255,.18);
}
.dsx-chip.is-active span{ background: rgba(255,255,255,.2); color:#fff; }
.dsx-search{ position:relative; flex: 0 1 320px; min-width: 220px; }
.dsx-search svg{ position:absolute; left:.95rem; top:50%; transform:translateY(-50%); width:15px; height:15px; color: var(--t3); pointer-events:none; }
.dsx-search input{
  width:100%; padding:.68rem 1rem .68rem 2.5rem;
  background: var(--card); border:1px solid var(--bdr); border-radius:100px;
  font: inherit; font-size:.88rem; color: var(--t1);
  transition: border-color .25s, box-shadow .25s;
}
.dsx-search input::placeholder{ color: var(--t3); }
.dsx-search input:focus{ outline:none; border-color: var(--blue-mid); box-shadow: 0 0 0 3px var(--accent-g); }

/* layout */
.dsx-grid{ display:grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 2.5rem; align-items:start; }
.dsx-grid--solo{ grid-template-columns: minmax(0, 1fr); max-width: 940px; margin: 0 auto; }
.dsx-tools--solo{ max-width: 940px; margin-left:auto; margin-right:auto; }
.dsx-search{ margin-left:auto; }
/* a category that holds only PDF documents: the panel becomes the page */
.dsx-grid--docs{ grid-template-columns: minmax(0, 1fr); }
.dsx-grid--docs .dsx-aside{ position:static; }
.dsx-grid--docs .dsx-docs-list{ max-height:none; display:grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap:.25rem; padding:.75rem; }
.dsx-grid--docs .dsx-doc{ padding:.9rem .85rem; }
.dsx-grid--docs .dsx-doc-t{ font-size:.95rem; }
.dsx-main{ min-width:0; }

/* featured (newest) announcement */
.dsx-lead{ margin-bottom: 2.6rem; }
.dsx-lead-link{
  position:relative; isolation:isolate; overflow:hidden;
  display:grid; grid-template-columns: 250px minmax(0, 1fr);
  color:#fff; border-radius:20px;
  background: linear-gradient(140deg, #1d5288 0%, var(--navy-deep) 62%, var(--ink) 100%);
  box-shadow: 0 28px 64px -28px rgba(13,30,48,.6);
  transition: transform .45s var(--ease), box-shadow .45s;
}
.dsx-lead-link:not(:has(.dsx-lead-img)){ grid-template-columns: 1fr; }
.dsx-lead-link::before{
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(circle at 12% 0%, rgba(126,200,245,.2), transparent 50%),
    radial-gradient(circle at 100% 100%, rgba(201,169,97,.18), transparent 52%);
}
.dsx-lead-link::after{
  content:''; position:absolute; left:0; right:0; top:0; height:3px;
  background: linear-gradient(90deg, var(--gold), var(--gold-warm) 40%, transparent 85%);
}
.dsx-lead-link:hover{ transform: translateY(-4px); box-shadow: 0 36px 76px -28px rgba(13,30,48,.7); }
.dsx-lead-img{ position:relative; overflow:hidden; min-height: 230px; background: var(--ink); }
.dsx-lead-img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition: transform .9s var(--ease); }
.dsx-lead-link:hover .dsx-lead-img img{ transform: scale(1.05); }
.dsx-lead-img::after{ content:''; position:absolute; inset:0; background: linear-gradient(90deg, transparent 55%, rgba(8,34,66,.7)); }
.dsx-lead-body{ display:flex; flex-direction:column; gap:.8rem; padding: 1.8rem 2rem 1.7rem; min-width:0; }
.dsx-lead-tag{
  display:inline-flex; align-items:center; gap:.55rem; align-self:flex-start;
  font-size:.66rem; font-weight:800; letter-spacing:1.8px; text-transform:uppercase; color: var(--gold-soft);
}
.dsx-lead-tag i{ width:7px; height:7px; border-radius:50%; background: var(--gold); box-shadow: 0 0 10px rgba(201,169,97,.7); animation: bpulse 2s infinite; }
.dsx-lead-title{ font-family: var(--serif); font-size: clamp(1.25rem, 2vw, 1.65rem); font-weight:700; line-height:1.25; letter-spacing:-.3px; color:#fff; margin:0; overflow-wrap:anywhere; }
.dsx-lead-desc{
  font-size:.93rem; line-height:1.68; color: rgba(255,255,255,.76); margin:0;
  display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.dsx-lead-foot{ display:flex; align-items:center; gap:.8rem; margin-top:auto; padding-top:1rem; border-top:1px solid rgba(255,255,255,.14); }
.dsx-cta{
  margin-left:auto; display:inline-flex; align-items:center; gap:.45rem;
  font-size:.74rem; font-weight:800; letter-spacing:1.3px; text-transform:uppercase; color: var(--gold-soft);
  transition: gap .3s var(--ease);
}
.dsx-cta svg{ width:14px; height:14px; }
.dsx-lead-link:hover .dsx-cta{ gap:.75rem; }
.dsx-pdf{
  display:inline-flex; align-items:center; padding:.16rem .5rem; border-radius:4px;
  font-size:.6rem; font-weight:800; letter-spacing:1.2px;
  color:#fff; background: linear-gradient(135deg, #d83b3b, #b02323);
}

/* year heading */
.dsx-year{ margin-bottom: 2.4rem; }
.dsx-year:last-of-type{ margin-bottom:0; }
.dsx-year-h{ display:flex; align-items:center; gap:1.1rem; margin-bottom:.6rem; }
.dsx-year-num{
  font-family: var(--serif); font-style:italic; font-weight:800; line-height:1; letter-spacing:-1.5px;
  font-size: clamp(1.9rem, 3vw, 2.5rem);
  background: linear-gradient(135deg, var(--gold), var(--gold-warm));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.dsx-year-line{ flex:1; height:1px; background: linear-gradient(90deg, var(--bdr-h), transparent); }
.dsx-year-count{
  min-width:28px; text-align:center; padding:.18rem .55rem; border-radius:100px;
  font-size:.7rem; font-weight:700; color: var(--accent); background: var(--accent-g);
}

/* feed: rows on a dotted date rail */
.dsx-feed{ list-style:none; margin:0; padding:0; position:relative; }
.dsx-feed::before{
  content:''; position:absolute; left:31px; top:14px; bottom:14px; width:2px;
  background: repeating-linear-gradient(180deg, var(--bdr-h) 0 5px, transparent 5px 11px);
}
.dsx-item-link{
  position:relative;
  display:grid; grid-template-columns: 64px minmax(0, 1fr) auto 34px; align-items:center; gap:1.2rem;
  padding: .95rem 1rem .95rem 0; border-radius:14px;
  color:inherit; transition: background .3s, transform .35s var(--ease), box-shadow .35s;
}
.dsx-item-link:hover{ background: var(--card); transform: translateX(4px); box-shadow: var(--shadow-1), var(--shadow-2); }
.dsx-date{
  position:relative; z-index:1;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  width:64px; height:64px; border-radius:14px;
  background: var(--card); border:1px solid var(--bdr); box-shadow: 0 0 0 5px var(--bg);
  transition: background .3s, border-color .3s;
}
.dsx-date b{ font-family: var(--serif); font-style:italic; font-size:1.45rem; font-weight:800; line-height:1; color: var(--gold-warm); transition: color .3s; }
.dsx-date i{ font-style:normal; font-size:.58rem; font-weight:800; letter-spacing:1.4px; text-transform:uppercase; color: var(--blue-mid); margin-top:.2rem; transition: color .3s; }
[data-theme="dark"] .dsx-date b{ color: var(--gold-soft); }
[data-theme="dark"] .dsx-date i{ color: var(--blue-pale); }
.dsx-item-link:hover .dsx-date{ background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid)); border-color:transparent; }
.dsx-item-link:hover .dsx-date b{ color: var(--gold-soft); }
.dsx-item-link:hover .dsx-date i{ color: rgba(255,255,255,.85); }
.dsx-item-body{ display:flex; flex-direction:column; gap:.3rem; min-width:0; }
.dsx-item-title{
  font-family: var(--serif); font-size:1.04rem; font-weight:700; line-height:1.35; letter-spacing:-.1px; color: var(--t1); margin:0;
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere;
  transition: color .25s;
}
.dsx-item-link:hover .dsx-item-title{ color: var(--accent); }
.dsx-item-desc{
  font-size:.86rem; line-height:1.55; color: var(--t2); margin:0;
  display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.dsx-item-meta{ display:flex; align-items:center; gap:.8rem; font-size:.72rem; color: var(--t3); }
.dsx-item-meta:empty{ display:none; }
.dsx-item-meta > span:not(.dsx-pdf){ display:inline-flex; align-items:center; gap:.35rem; }
.dsx-item-meta svg{ width:12px; height:12px; }
.dsx-thumb{ width:104px; height:72px; border-radius:10px; overflow:hidden; background: var(--bg3); box-shadow: var(--shadow-1); }
.dsx-thumb img{ width:100%; height:100%; object-fit:cover; transition: transform .7s var(--ease); }
.dsx-item-link:hover .dsx-thumb img{ transform: scale(1.08); }
.dsx-arrow{
  grid-column: 4;
  width:34px; height:34px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color: var(--blue-mid); background: var(--accent-g);
  transition: background .25s, color .25s, transform .3s var(--ease);
}
.dsx-arrow svg{ width:14px; height:14px; }
.dsx-item-link:hover .dsx-arrow{ color:#fff; background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid)); transform: translateX(3px); }

/* documents panel */
.dsx-aside{ position:sticky; top:96px; min-width:0; }
.dsx-docs{
  position:relative; overflow:hidden;
  background: var(--card); border:1px solid var(--bdr); border-radius:18px;
  box-shadow: var(--shadow-1), var(--shadow-2);
}
.dsx-docs::before{ content:''; position:absolute; left:0; right:0; top:0; height:3px; background: linear-gradient(90deg, var(--blue-mid), var(--gold)); }
.dsx-docs-h{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.85rem; padding:1.3rem 1.25rem 1.1rem; border-bottom:1px dashed var(--bdr); }
.dsx-docs-ico{
  width:42px; height:42px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  color: var(--gold-soft); background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
  box-shadow: 0 6px 16px rgba(26,74,122,.3), inset 0 1px 0 rgba(255,255,255,.18);
}
.dsx-docs-ico svg{ width:20px; height:20px; }
.dsx-docs-h h3{ font-family: var(--serif); font-size:1.05rem; font-weight:700; line-height:1.25; color: var(--t1); margin:0; }
.dsx-docs-h p{ font-size:.74rem; line-height:1.45; color: var(--t3); margin:.2rem 0 0; }
.dsx-docs-count{ font-family: var(--serif); font-style:italic; font-weight:800; font-size:1.5rem; line-height:1; color: var(--gold-warm); }
.dsx-docs-list{ list-style:none; margin:0; padding:.5rem; max-height: calc(100vh - 250px); overflow-y:auto; scrollbar-width:thin; }
.dsx-doc{
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.75rem;
  padding:.7rem .7rem; border-radius:11px; color:inherit;
  transition: background .25s, transform .3s var(--ease);
}
.dsx-doc:hover{ background: var(--accent-g); transform: translateX(3px); }
.dsx-doc-badge{
  position:relative; width:34px; height:40px; border-radius:5px;
  display:flex; align-items:flex-end; justify-content:center; padding-bottom:.32rem;
  font-size:.52rem; font-weight:800; letter-spacing:.6px; color:#fff;
  background: linear-gradient(135deg, #d83b3b, #b02323);
  box-shadow: 0 4px 10px rgba(176,35,35,.28), inset 0 1px 0 rgba(255,255,255,.2);
}
.dsx-doc-badge::before{ content:''; position:absolute; top:0; right:0; border-style:solid; border-width:0 10px 10px 0; border-color: transparent rgba(255,255,255,.3) transparent transparent; }
.dsx-doc-t{
  font-size:.86rem; font-weight:600; line-height:1.4; color: var(--t1); min-width:0; overflow-wrap:anywhere;
  display:-webkit-box; -webkit-line-clamp:3; line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
  transition: color .25s;
}
.dsx-doc:hover .dsx-doc-t{ color: var(--accent); }
.dsx-doc-go{ color: var(--t3); transition: color .25s, transform .3s var(--ease); }
.dsx-doc-go svg{ width:14px; height:14px; display:block; }
.dsx-doc:hover .dsx-doc-go{ color: var(--gold-warm); transform: translate(2px, -2px); }

@media (max-width: 1100px){
  .dsx-grid{ grid-template-columns: minmax(0, 1fr); gap:2rem; }
  .dsx-aside{ position:static; order:-1; }
  .dsx-docs-list{ max-height:none; display:grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
  /* the panel sits above the announcements here, so a long list scrolls inside itself
     instead of pushing the announcements far down the page */
  .dsx-grid:not(.dsx-grid--docs) .dsx-docs-list{ max-height: 292px; overflow-y:auto; }
}
@media (max-width: 700px){
  .dsx-search{ flex: 1 0 100%; }
  .dsx-chips{ flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; width:100%; padding-bottom:.2rem; }
  .dsx-chips::-webkit-scrollbar{ display:none; }
  .dsx-chip{ flex-shrink:0; }
  .dsx-lead-link{ grid-template-columns: 1fr; }
  .dsx-lead-img{ min-height:0; aspect-ratio: 16 / 9; }
  .dsx-lead-img::after{ background: linear-gradient(180deg, transparent 55%, rgba(8,34,66,.7)); }
  .dsx-lead-body{ padding: 1.3rem 1.25rem 1.3rem; }
  .dsx-feed::before{ left:25px; }
  .dsx-item-link{ grid-template-columns: 52px minmax(0, 1fr); gap:.85rem; padding:.8rem .4rem .8rem 0; }
  .dsx-date{ width:52px; height:52px; border-radius:12px; }
  .dsx-date b{ font-size:1.15rem; }
  .dsx-thumb, .dsx-arrow{ display:none; }
  .dsx-item-title{ font-size:.96rem; }
}
@media (prefers-reduced-motion: reduce){
  .dsx-lead-tag i{ animation:none; }
  .dsx-sec *, .dsx-sec *::before{ transition:none !important; }
}
/* ══════════════════════════════════════════════════════════════
   SITE MAP — full-screen overview opened from the header button
   The header stays on top; the sheet unrolls from under it and the
   groups arrive one after another. html.smap-open is set by the
   script in partials/header.blade.php.
   ══════════════════════════════════════════════════════════════ */
/* button: three lines that cross into an X while the map is open */
#hdr .smap-btn{ display:none; }
.smap-ico{ position:relative; display:block; width:18px; height:14px; }
.smap-ico i{
  position:absolute; left:0; right:0; height:1.6px; border-radius:2px; background: currentColor;
  transition: transform .4s var(--ease), opacity .25s, top .4s var(--ease), width .4s var(--ease);
}
.smap-ico i:nth-child(1){ top:0; }
.smap-ico i:nth-child(2){ top:6px; right:auto; width:70%; }
.smap-ico i:nth-child(3){ top:12px; }
#hdr .smap-btn:hover .smap-ico i:nth-child(2){ width:100%; }
html.smap-open .smap-ico i:nth-child(1){ top:6px; transform: rotate(45deg); }
html.smap-open .smap-ico i:nth-child(2){ opacity:0; }
html.smap-open .smap-ico i:nth-child(3){ top:6px; transform: rotate(-45deg); }
html.smap-open #hdr .smap-btn{ background: rgba(255,255,255,.14); color: var(--gold-soft); }

.smap{
  position:fixed; inset:0; z-index:498;
  padding: 100px 0 0;
  overflow-y:auto; overscroll-behavior: contain;
  color:#fff;
  background:
    radial-gradient(900px 520px at 88% 8%, rgba(59,130,196,.22), transparent 62%),
    radial-gradient(760px 480px at 6% 96%, rgba(201,169,97,.12), transparent 60%),
    linear-gradient(180deg, #0a1828 0%, #0b1a2b 45%, #081522 100%);
  visibility:hidden; opacity:0; pointer-events:none;
  clip-path: inset(0 0 100% 0);
  transition: clip-path .6s cubic-bezier(.7,0,.2,1), opacity .3s ease, visibility 0s linear .6s;
}
html.smap-open .smap{
  visibility:visible; opacity:1; pointer-events:auto;
  clip-path: inset(0 0 0 0);
  transition: clip-path .6s cubic-bezier(.2,.85,.25,1), opacity .25s ease, visibility 0s;
}
/* the bar turns solid over the sheet, and its own menu panels stay out of the way */
html.smap-open #hdr{ background: #0b1a2b; border-bottom-color: rgba(255,255,255,.08); }
html.smap-open #hdr .mega{ display:none; }

.smap-in{ max-width: 1440px; margin: 0 auto; padding: 2.6rem clamp(1.25rem, 3vw, 3rem) 4rem; }
.smap-head{ display:flex; align-items:baseline; gap:1rem; padding-bottom:1.4rem; margin-bottom:2.2rem; position:relative; }
.smap-head::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1px;
  background: linear-gradient(90deg, var(--gold) 0%, rgba(126,200,245,.7) 30%, rgba(255,255,255,.08) 65%, transparent 100%);
  transform-origin: 0 50%;
}
.smap-eyebrow{ font-size:.7rem; font-weight:800; letter-spacing:3px; color: var(--gold-soft); }
.smap-title{ font-family: var(--serif); font-style: italic; font-weight:700; font-size: clamp(1.6rem, 2.6vw, 2.3rem); line-height:1.1; letter-spacing:-.4px; color:#fff; margin:0; }

.smap-cols{ columns: 4; column-gap: 3rem; }
.smap-group{ break-inside: avoid; padding-bottom: 2.4rem; }
.smap-h{
  display:flex; align-items:baseline; gap:.7rem;
  margin:0 0 .9rem; padding-bottom:.7rem;
  border-bottom:1px solid rgba(255,255,255,.1);
  font-family: var(--sans); font-size:.78rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; line-height:1.35;
  color:#fff;
}
.smap-h a{ color:inherit; transition: color .25s; }
.smap-h a:hover{ color: var(--gold-soft); }
.smap-n{ font-family: var(--serif); font-style: italic; font-weight:800; font-size:1rem; letter-spacing:0; color: var(--gold); flex-shrink:0; }
.smap-list{ list-style:none; margin:0; padding:0; }
.smap-list a{
  position:relative; display:block;
  padding:.42rem 0 .42rem 1.05rem;
  font-size:.98rem; line-height:1.4; color: rgba(255,255,255,.8);
  transition: color .2s, transform .3s var(--ease);
}
.smap-list a::before{
  content:''; position:absolute; left:0; top:.95em; width:6px; height:1.5px; border-radius:2px;
  background: rgba(126,200,245,.6);
  transition: width .3s var(--ease), background .25s;
}
.smap-list a:hover, .smap-list a:focus-visible{ color:#fff; transform: translateX(5px); }
.smap-list a:hover::before, .smap-list a:focus-visible::before{ width:11px; background: var(--gold); }

/* staged arrival ("from" only, so hover keeps working afterwards) */
html.smap-open .smap-head > *{ animation: megaRise .6s var(--ease) .18s backwards; }
html.smap-open .smap-head::after{ animation: megaGrowX .9s cubic-bezier(.6,0,.2,1) .2s backwards; }
html.smap-open .smap-group{ animation: megaRise .6s var(--ease) backwards; animation-delay: calc(.26s + var(--g, 0) * .06s); }
@keyframes megaGrowX{ from{ transform: scaleX(0) } }

/* Footer: the same stacked SVG mark as the header, tall enough for its name to be read */
.ftr-logo-img{ height: 92px; }
@media (max-width: 900px){ .ftr-logo-img{ height: 84px; } }
@media (max-width: 480px){ .ftr-logo-img{ height: 76px; } }

/* Header (desktop bar): menu text and the controls on the right, one step larger */
@media (min-width: 1101px){
  #hdr .nav-item > a{ font-size: 1.05rem; padding: .55rem 1rem; }
  #hdr .nav-item > a svg, #hdr .nav-item:hover > a svg{ width: 12px; height: 12px; }
  #hdr .nav-item > a::before, #hdr .nav-item:hover > a::before,
  #hdr .nav-item > a:hover::before, #hdr .nav-item > a[aria-current]::before{ left: 1rem; right: 1rem; }
  #hdr .ico-btn{ width: 46px; height: 46px; }
  #hdr .ico-btn svg{ width: 22px; height: 22px; }
  #hdr .lang-dd-toggle{ height: 46px; padding: 0 .8rem; font-size: .92rem; gap: .4rem; }
  #hdr .lang-dd-globe{ display:block; width: 19px; height: 19px; }
  #hdr .lang-dd-chev{ width: 12px; height: 12px; }
  #hdr .smap-ico{ width: 21px; height: 16px; }
  #hdr .smap-ico i{ height: 1.8px; }
  #hdr .smap-ico i:nth-child(2){ top: 7px; }
  #hdr .smap-ico i:nth-child(3){ top: 14px; }
  html.smap-open #hdr .smap-ico i:nth-child(1), html.smap-open #hdr .smap-ico i:nth-child(3){ top: 7px; }
  #hdr .nav-right{ gap: .35rem; }
}
/* small laptops: keep the larger text from crowding the bar */
@media (min-width: 1101px) and (max-width: 1280px){
  #hdr .nav-item > a{ font-size: .96rem; padding: .5rem .7rem; }
  #hdr .nav-wrap{ gap: 1.5rem; }
}

/* the button belongs to the desktop bar; below it the burger menu already lists everything */
@media (min-width: 1101px){ #hdr .smap-btn{ display:flex; } }
@media (max-width: 1500px){ .smap-cols{ columns: 3; column-gap: 2.5rem; } }
@media (max-width: 1100px){ .smap{ display:none; } }
@media (prefers-reduced-motion: reduce){
  .smap, html.smap-open .smap{ transition: opacity .15s, visibility 0s; clip-path:none; }
  html.smap-open .smap-head > *, html.smap-open .smap-head::after, html.smap-open .smap-group{ animation:none; }
  .smap-ico i{ transition:none; }
}