/* =============================================================
   ICAR - Indian Institute of Pulses Research, Kanpur
   Homepage stylesheet — refined professional edition
   Layout follows the approved reference layout; visual system
   elevated for a modern, credible institutional feel.
   ============================================================= */

/* ---------- 1. Design tokens ---------- */
:root{
  /* greens */
  --green-deep:#0f4d2e;
  --green-deep-2:#0b3b22;
  --green:#1f7a44;
  --green-mid:#3d9c5c;
  --green-bright:#5cb874;
  --green-wash:#eef6ee;
  --green-wash-2:#f5faf3;

  /* nav gradient */
  --nav-top:#2f8a4d;
  --nav-bot:#1c6b3b;
  --nav-hover:#0f4d2e;

  /* accents */
  --gold:#e0a01b;
  --gold-deep:#b97d08;
  --saffron:#e07b00;

  /* accent used as TEXT on a light surface — themed independently of the
     same greens used as button/bar BACKGROUNDS, so dark mode stays legible */
  --accent-ink:#0f4d2e;
  --accent-ink-2:#1f7a44;
  --accent-warm:#b97d08;

  /* blues (headings / students) */
  --blue-band:#e7f0fa;
  --blue-head:#1a5fa8;
  --blue-deep:#0f4680;

  /* neutrals */
  --ink:#15241a;
  --ink-soft:#33463a;
  --muted:#5d6f64;
  --line:#e0e8dd;
  --line-soft:#eef2ea;
  --surface:#ffffff;
  --page:#ffffff;
  --paper:#f5f8f2;
  --panel:#eef3ec;

  --footer-bg:#12211a;
  --footer-bg-2:#0c1712;
  --footer-ink:#dfe8e0;
  --footer-muted:#9db0a3;
  --footer-line:rgba(255,255,255,.12);

  --shadow-1:0 1px 2px rgba(15,45,25,.06), 0 1px 3px rgba(15,45,25,.05);
  --shadow-2:0 8px 24px rgba(15,45,25,.10);
  --shadow-3:0 20px 50px rgba(15,45,25,.20);
  --ring:0 0 0 3px rgba(31,122,68,.16);

  --r-sm:6px; --r-md:12px; --r-lg:18px; --r-xl:24px;
  --wrap:1320px;
  --fs:100%;              /* driven by the A- / A / A+ control */

  --font-display:'Sora','Yantramanav','Segoe UI',sans-serif;
  --font-hi:'Mukta','Segoe UI',sans-serif;
  --font-body:'Mukta','Segoe UI',sans-serif;

  --ease:cubic-bezier(.22,.61,.36,1);
}

/* -------------------------------------------------------------
   Colour themes — the four swatches in the utility bar.
   Every theme restates the full token set so switching between
   any two of them repaints the whole page, not just part of it.
   ------------------------------------------------------------- */

/* Theme: green — the institute's own colours (also the default) */
[data-theme="green"]{
  --green-deep:#0f4d2e; --green-deep-2:#0b3b22; --green:#1f7a44;
  --green-mid:#3d9c5c; --green-bright:#5cb874;
  --green-wash:#eef6ee; --green-wash-2:#f5faf3;
  --accent-ink:#0f4d2e; --accent-ink-2:#1f7a44; --accent-warm:#b97d08;
  --gold:#e0a01b; --gold-deep:#b97d08; --saffron:#e07b00;
  --blue-band:#e7f0fa; --blue-head:#1a5fa8; --blue-deep:#0f4680;
  --ink:#15241a; --ink-soft:#33463a; --muted:#5d6f64;
  --line:#e0e8dd; --line-soft:#eef2ea;
  --surface:#ffffff; --page:#ffffff; --paper:#f5f8f2; --panel:#eef3ec;
  --nav-top:#2f8a4d; --nav-bot:#1c6b3b; --nav-hover:#0f4d2e;
  --footer-bg:#12211a; --footer-bg-2:#0c1712; --footer-ink:#dfe8e0;
  --footer-muted:#9db0a3; --footer-line:rgba(255,255,255,.12);
  --shadow-1:0 1px 2px rgba(15,45,25,.06), 0 1px 3px rgba(15,45,25,.05);
  --shadow-2:0 8px 24px rgba(15,45,25,.10);
  --shadow-3:0 20px 50px rgba(15,45,25,.20);
  --ring:0 0 0 3px rgba(31,122,68,.16);
}

/* Theme: light — the same content on a pale, low-contrast chrome.
   The navigation inverts to white with green lettering, which is the
   change you see first. */
[data-theme="light"]{
  --green-wash:#f4f9f2; --green-wash-2:#fafcf8;
  --paper:#fbfdfa; --panel:#f3f8f1;
  --surface:#ffffff; --page:#ffffff;
  --line:#e6ece2; --line-soft:#f2f6ef;
  --nav-top:#ffffff; --nav-bot:#f2f7ef; --nav-hover:#e6f0e2;
  --shadow-1:0 1px 2px rgba(15,45,25,.05);
  --shadow-2:0 6px 18px rgba(15,45,25,.07);
  --shadow-3:0 16px 38px rgba(15,45,25,.12);
}
[data-theme="light"] .mainnav{box-shadow:0 1px 0 var(--line), 0 4px 14px rgba(15,45,25,.07)}
[data-theme="light"] .mainnav__link,
[data-theme="light"] .mainnav__item--home a{color:var(--green-deep)}
[data-theme="light"] .mainnav__item--home svg{fill:var(--green-deep)}
[data-theme="light"] .mainnav__item{border-right-color:rgba(15,77,46,.10)}
[data-theme="light"] .mainnav__item:hover>.mainnav__link,
[data-theme="light"] .mainnav__link[aria-expanded="true"],
[data-theme="light"] .mainnav__item.is-current>.mainnav__link,
[data-theme="light"] .mainnav__item--home a:hover,
[data-theme="light"] .mainnav__item--home.is-current>a{background:var(--green-wash)}

/* Theme: high contrast — black on white, navy for anything active,
   no tints, no shadows. */
[data-theme="contrast"]{
  --green-deep:#000; --green-deep-2:#000; --green:#000;
  --green-mid:#000; --green-bright:#000;
  --green-wash:#fff; --green-wash-2:#fff;
  --accent-ink:#000; --accent-ink-2:#000; --accent-warm:#00308f;
  --gold:#00308f; --gold-deep:#00308f; --saffron:#00308f;
  --blue-band:#e6e6e6; --blue-head:#00308f; --blue-deep:#00308f;
  --ink:#000; --ink-soft:#000; --muted:#1a1a1a;
  --line:#000; --line-soft:#000;
  --surface:#fff; --page:#fff; --paper:#fff; --panel:#fff;
  --nav-top:#000; --nav-bot:#000; --nav-hover:#00308f;
  --footer-bg:#000; --footer-bg-2:#000; --footer-ink:#fff;
  --footer-muted:#fff; --footer-line:#fff;
  --shadow-1:none; --shadow-2:none; --shadow-3:none;
  --ring:0 0 0 3px rgba(0,48,143,.45);
}
[data-theme="contrast"] .mainnav__link,
[data-theme="contrast"] .mainnav__item--home a{color:#fff}
[data-theme="contrast"] .secthead__title{color:#000}

/* Theme: dark. The greens that carry white lettering stay dark; the
   greens used as lettering are lifted, which is why --accent-ink is a
   separate token. */
[data-theme="dark"]{
  --green-wash:#18271f; --green-wash-2:#152019;
  --accent-ink:#7fd39a; --accent-ink-2:#95dcac; --accent-warm:#f0c257;
  --green-bright:#7fd39a;
  --gold:#f0c257; --gold-deep:#f0c257;
  --blue-band:#16324c; --blue-head:#8ec2f5; --blue-deep:#bcdcff;
  --ink:#e8f1ea; --ink-soft:#cde0d2; --muted:#9fb6a6;
  --line:#2a3b30; --line-soft:#22302a;
  --surface:#152019; --page:#0d1511; --paper:#111a15; --panel:#1a271f;
  --nav-top:#1c5334; --nav-bot:#0f3a22; --nav-hover:#2f8a4d;
  --footer-bg:#0a120d; --footer-bg-2:#060c09;
  --shadow-1:0 1px 3px rgba(0,0,0,.55);
  --shadow-2:0 8px 24px rgba(0,0,0,.5);
  --shadow-3:0 20px 50px rgba(0,0,0,.6);
  --ring:0 0 0 3px rgba(127,211,154,.25);
}
[data-theme="dark"] .mainnav__link,
[data-theme="dark"] .mainnav__item--home a{color:#eaf6e6}
/* The masthead wordmark is one piece of artwork with black English
   lettering on a transparent ground, so it disappears on a dark masthead.
   Stand it on a light plate rather than ship a second copy of the logo. */
[data-theme="dark"] .brandmark{
  background:#fff; border-radius:var(--r-md);
  padding:.45rem .85rem;
}

/* ---------- 2. Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{font-size:var(--fs); scroll-behavior:smooth}
body{
  margin:0;
  background:var(--page);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:1.02rem;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button{font:inherit; cursor:pointer; border:0; background:none; color:inherit}
select,input{font:inherit}
h1,h2,h3,h4{font-family:var(--font-display); font-weight:700; margin:0; line-height:1.18; letter-spacing:-.01em}
.wrap{width:min(100% - 2.2rem, var(--wrap)); margin-inline:auto}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
:focus-visible{outline:3px solid var(--gold); outline-offset:2px; border-radius:3px}
::selection{background:var(--green-mid); color:#fff}

.skip-link{
  position:absolute; left:1rem; top:-4rem; z-index:200;
  background:var(--green-deep); color:#fff; padding:.7rem 1.1rem; border-radius:0 0 var(--r-sm) var(--r-sm);
  font-weight:700; transition:top .2s;
}
.skip-link:focus{top:0}

/* ---------- 3. Utility bar ---------- */
.utilbar{
  background:linear-gradient(90deg,var(--green-deep),var(--green-deep-2));
  color:#eaf5ea; position:relative; z-index:80;
}
.utilbar__inner{display:flex; align-items:center; gap:1rem; justify-content:flex-end; min-height:38px; flex-wrap:wrap; padding-block:.3rem}
.utilbar__social{display:flex; gap:6px; list-style:none; margin:0; padding:0; margin-right:auto}
.soc{display:grid; place-items:center; width:28px; height:28px; border-radius:50%; color:#fff; transition:transform .2s var(--ease), box-shadow .2s}
.soc svg{width:15px; height:15px; fill:currentColor}
.soc:hover{transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,.25)}
.soc--fb{background:#1877f2} .soc--ig{background:radial-gradient(circle at 30% 110%,#fdf497,#fd5949 45%,#d6249f 70%,#285aeb)} .soc--x{background:#000} .soc--yt{background:#ff0000}
.soc--in{background:#0a66c2}

.utilbar__tools{display:flex; align-items:center; gap:.55rem; flex-wrap:wrap}
.swatches{display:flex; gap:4px}
.sw{
  display:grid; place-items:center;
  width:28px; height:28px; padding:0;
  background:transparent; color:#eaf5ea;
  border:1px solid rgba(255,255,255,.3); border-radius:var(--r-sm);
  transition:background .18s, border-color .18s, color .18s, transform .18s;
}
.sw svg{
  width:15px; height:15px;
  fill:none; stroke:currentColor; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round;
}
.sw svg .solid{fill:currentColor; stroke:none}
.sw:hover{background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.5); transform:translateY(-1px)}
.sw.is-active{background:var(--gold); border-color:var(--gold); color:#3a2a00}

.util-ico{display:grid; place-items:center; width:28px; height:28px; border:1px solid rgba(255,255,255,.3); border-radius:var(--r-sm); color:#eaf5ea; transition:background .18s,border-color .18s}
.util-ico:hover{background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.5)}
.util-ico svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.util-ico svg path{fill:none}

.fontsize{display:flex; gap:3px}
.fontsize button{
  width:28px; height:26px; border:1px solid rgba(255,255,255,.3); border-radius:var(--r-sm);
  font-family:var(--font-display); font-weight:700; color:#eaf5ea; line-height:1; transition:background .18s;
}
.fontsize button:hover{background:rgba(255,255,255,.14)}
.fontsize sup{font-size:.6em}

.lang select{
  border:1px solid rgba(255,255,255,.4); border-radius:var(--r-sm); padding:.2rem 1.5rem .2rem .5rem;
  background:rgba(255,255,255,.08); color:#fff; font-weight:600;
  -webkit-appearance:none; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right .3rem center; background-size:16px;
}
.lang select option{color:#111}

/* ---------- 4. Masthead ---------- */
.masthead{background:var(--surface); position:relative}
.masthead::after{content:""; position:absolute; left:0; right:0; bottom:0; height:3px;
  background:linear-gradient(90deg,var(--gold),var(--green-bright),var(--green),var(--green-deep))}
.masthead__inner{display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:1.3rem; padding:.85rem 0 .95rem}
.brandmark{display:block; transition:transform .3s var(--ease)}
.brandmark:hover{transform:scale(1.04)}
.brandmark img{width:150px; height:auto; object-fit:contain}
.titleblock{text-align:center}
.titleblock__hi{
  font-family:var(--font-hi); font-weight:700; color:var(--accent-ink);
  font-size:clamp(1.1rem,2.1vw,1.62rem); margin:0; letter-spacing:.01em;
}
.titleblock__hi span{color:var(--accent-warm)}
.titleblock__hi-sub{font-size:clamp(.78rem,1.15vw,.95rem); color:var(--muted); margin:.05rem 0 .18rem}
.titleblock__en{
  font-family:var(--font-display); font-weight:800; color:var(--accent-ink);
  font-size:clamp(1.05rem,2.05vw,1.68rem); letter-spacing:.005em; text-transform:uppercase;
}
.titleblock__en-sub{font-family:var(--font-display); font-weight:600; color:var(--accent-ink-2); font-size:clamp(.8rem,1.2vw,1rem); margin:.12rem 0 0}

.searchbox{position:relative; display:flex; align-items:center}
.searchbox__ico{position:absolute; left:.85rem; width:17px; height:17px; fill:var(--green); z-index:2}
.searchbox input{
  width:250px; padding:.6rem 5.2rem .6rem 2.4rem;
  border:1.5px solid var(--line); border-radius:999px; background:var(--paper); color:var(--ink);
  transition:border-color .2s, box-shadow .2s, background .2s;
}
.searchbox input:focus{outline:none; border-color:var(--green-mid); background:#fff; box-shadow:var(--ring)}
.searchbox__btn{
  position:absolute; right:4px; top:4px; bottom:4px; padding:0 1.1rem;
  background:linear-gradient(180deg,var(--green),var(--green-deep)); color:#fff; font-weight:600; border-radius:999px;
  font-size:.85rem; transition:filter .2s;
}
.searchbox__btn:hover{filter:brightness(1.08)}

.navtoggle{display:none; align-items:center; gap:.5rem; padding:.5rem .8rem; border:1.5px solid var(--green); border-radius:var(--r-md); color:var(--accent-ink); font-weight:700}
.navtoggle__bars{display:grid; gap:3px}
.navtoggle__bars i{display:block; width:18px; height:2px; background:currentColor; border-radius:2px}

/* ---------- 5. Primary nav + mega menu ---------- */
.mainnav{
  background:linear-gradient(180deg,var(--nav-top),var(--nav-bot));
  position:sticky; top:0; z-index:60; box-shadow:0 2px 10px rgba(15,45,25,.18);
}
.mainnav>.wrap{position:relative}
.mainnav__list{display:flex; list-style:none; margin:0; padding:0}
.mainnav__item{flex:1 1 auto; border-right:1px solid rgba(255,255,255,.16)}
.mainnav__item:last-child{border-right:0}
.mainnav__item--home{flex:0 0 66px}
.mainnav__item--home a{display:grid; place-items:center; height:100%; padding:.6rem; transition:background .2s}
.mainnav__item--home a:hover{background:rgba(0,0,0,.16)}
.mainnav__item--home svg{width:24px; height:24px; fill:#fff}

.mainnav__link{
  position:relative; display:flex; align-items:center; justify-content:center; text-align:center;
  width:100%; min-height:54px; padding:.5rem .55rem;
  font-family:var(--font-display); font-weight:600; font-size:.82rem;
  letter-spacing:.04em; text-transform:uppercase; color:#fff;
  transition:background .2s;
}
.mainnav__link::before{
  content:""; position:absolute; left:50%; bottom:0; height:3px; width:0; transform:translateX(-50%);
  background:var(--gold); transition:width .25s var(--ease);
}
.mainnav__item:hover>.mainnav__link,
.mainnav__link[aria-expanded="true"]{background:rgba(0,0,0,.20)}
.mainnav__item:hover>.mainnav__link::before,
.mainnav__link[aria-expanded="true"]::before{width:70%}
/* Current section, set by $active_menu in includes/header.php */
.mainnav__item.is-current>.mainnav__link{background:rgba(0,0,0,.20)}
.mainnav__item.is-current>.mainnav__link::before{width:70%}
.mainnav__item--home.is-current>a{background:rgba(0,0,0,.20)}

/* dropdown is anchored to the nav container (.mainnav > .wrap), not to the
   individual item — this keeps every panel aligned to the page grid and
   prevents the off-screen clipping / horizontal-scroll bug. */
.mega{
  position:absolute; left:0; right:0; top:100%;
  background:linear-gradient(180deg,#fff,var(--green-wash-2));
  border-top:3px solid var(--gold);
  border-radius:0 0 var(--r-lg) var(--r-lg);
  box-shadow:var(--shadow-3);
  opacity:0; visibility:hidden; transform:translateY(-10px); overflow:hidden;
  transition:opacity .2s var(--ease), transform .2s var(--ease), visibility .2s;
  z-index:70;
}
.mainnav__item:hover .mega,
.mainnav__item.is-open .mega{opacity:1; visibility:visible; transform:translateY(0)}

/* Single-level menus: a headed panel anchored to its own nav item, with the
   links set in two columns once there are four or more of them. */
.mainnav__item.has-drop{position:relative}
.mega.mega--panel{
  left:0; right:auto; width:max-content;
  min-width:300px; max-width:min(580px,calc(100vw - 2.5rem));
  padding:1.15rem 1.5rem 1.25rem;
}
.mega.mega--panel.mega--right{left:auto; right:0}
.mega__title{
  font-family:var(--font-display); font-weight:700; font-size:1.02rem; line-height:1.3;
  color:var(--accent-ink); margin:0 0 .8rem; padding-bottom:.6rem;
  border-bottom:2px solid var(--green-wash);
}
.mega__list{list-style:none; margin:0; padding:0; display:grid; gap:.1rem}
.mega__list--2{grid-template-columns:1fr 1fr; gap:.1rem 1.6rem}
.mega__list a{
  display:block; padding:.42rem .65rem; border-radius:var(--r-sm);
  color:var(--ink-soft); font-weight:500; font-size:.94rem; line-height:1.35;
  transition:background .15s, color .15s, transform .15s;
}
.mega__list a:hover{background:var(--green-wash); color:var(--accent-ink); transform:translateX(4px)}
@media (max-width:980px){
  .mega.mega--panel{width:auto; min-width:0; max-width:none; padding:0}
  .mega__title{color:#eaf6e6; margin:0; padding:.85rem 1.4rem .5rem; border-bottom-color:rgba(255,255,255,.18)}
  .mega__list{padding:.3rem 1rem .8rem}
  .mega__list--2{grid-template-columns:1fr}
  .mega__list a{color:#d6ead0}
  .mega__list a:hover{background:rgba(255,255,255,.1); color:#fff}
}

.mega__grid{display:grid; gap:.6rem 1.8rem; padding:1rem 0 1.1rem}
.mega__grid--2{grid-template-columns:repeat(2,1fr)}
.mega__grid--3{grid-template-columns:repeat(3,1fr)}
.mega__grid--4{grid-template-columns:repeat(4,1fr)}
.mega__grid--5{grid-template-columns:repeat(5,1fr)}
.mega__grid--6{grid-template-columns:repeat(6,1fr)}
.mega__grid--7{grid-template-columns:repeat(7,1fr)}

.mega__head{
  display:block; font-family:var(--font-display); font-weight:700;
  font-size:.98rem; line-height:1.3; color:var(--accent-ink); letter-spacing:.01em;
  padding-bottom:.55rem; margin:0 0 .15rem; position:relative;
}
.mega__head::after{content:""; position:absolute; left:0; bottom:0; width:26px; height:2.5px; background:var(--green-bright); border-radius:2px; transition:width .25s var(--ease)}
a.mega__head:hover{color:var(--accent-ink-2)}
a.mega__head:hover::after{width:100%}
/* About Us (6-col): give heads a uniform height so sub-item lists line up.
   3.25rem fits a two-line heading (2×1.3em text + .55rem underline gap). */
.mega__grid--6 .mega__head,
.mega__grid--7 .mega__head{min-height:2.95rem}
@media (max-width:1180px){.mega__grid--6 .mega__head,.mega__grid--7 .mega__head{min-height:0}}
/* Standalone entries (Overview, Cadre Strength) have no child list, so they
   fill their column as a card instead of leaving a headline floating over
   dead space. */
.mega__col--solo{display:flex}
.mega__tile{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.55rem;
  text-align:center; padding:1rem 1.15rem; border:1px solid var(--line); border-radius:var(--r-md);
  background:linear-gradient(180deg,#fff,var(--green-wash)); box-shadow:var(--shadow-1);
  transition:border-color .18s, box-shadow .18s, transform .18s;
}
.mega__tile:hover{border-color:var(--green-mid); box-shadow:var(--shadow-2); transform:translateY(-2px)}
.mega__tile-label{
  font-family:var(--font-display); font-weight:700; font-size:.98rem;
  line-height:1.3; color:var(--accent-ink); transition:color .18s;
}
.mega__tile:hover .mega__tile-label{color:var(--accent-ink-2)}

.mega__links{list-style:none; margin:.35rem 0 0; padding:0; display:grid; gap:.15rem}
.mega__links a{display:flex; align-items:center; gap:.55rem; color:var(--ink-soft); font-weight:500; padding:.28rem .5rem; border-radius:var(--r-sm); transition:color .15s, background .15s, transform .15s}
.mega__links a:hover{color:var(--accent-ink); background:var(--green-wash); transform:translateX(3px)}

.mi{width:16px; height:16px; flex:none; background:var(--green); mask-size:contain; -webkit-mask-size:contain; mask-repeat:no-repeat; -webkit-mask-repeat:no-repeat}
.mi--lg{width:26px; height:26px}
.mi--doc{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8zm0 2.5L17.5 8H14zM8 12h8v2H8zm0 4h8v2H8zm0-8h4v2H8z'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8zm0 2.5L17.5 8H14zM8 12h8v2H8zm0 4h8v2H8zm0-8h4v2H8z'/%3E%3C/svg%3E")}
.mi--person{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a4 4 0 1 0-4-4 4 4 0 0 0 4 4zm0 2c-3.3 0-8 1.7-8 4.5V21h16v-2.5c0-2.8-4.7-4.5-8-4.5z'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12a4 4 0 1 0-4-4 4 4 0 0 0 4 4zm0 2c-3.3 0-8 1.7-8 4.5V21h16v-2.5c0-2.8-4.7-4.5-8-4.5z'/%3E%3C/svg%3E")}
.mi--pin{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 14.5 9 2.5 2.5 0 0 1 12 11.5z'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 14.5 9 2.5 2.5 0 0 1 12 11.5z'/%3E%3C/svg%3E")}
.mi--group{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 11a3 3 0 1 0-3-3 3 3 0 0 0 3 3zm8 0a3 3 0 1 0-3-3 3 3 0 0 0 3 3zM2 20v-1.5C2 16.3 5.3 15 8 15s6 1.3 6 3.5V20zm14 0v-1.5a4.5 4.5 0 0 0-1.6-3.3c2.5.2 5.6 1.4 5.6 3.3V20z'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 11a3 3 0 1 0-3-3 3 3 0 0 0 3 3zm8 0a3 3 0 1 0-3-3 3 3 0 0 0 3 3zM2 20v-1.5C2 16.3 5.3 15 8 15s6 1.3 6 3.5V20zm14 0v-1.5a4.5 4.5 0 0 0-1.6-3.3c2.5.2 5.6 1.4 5.6 3.3V20z'/%3E%3C/svg%3E")}
.mi--gear{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 8a4 4 0 1 0 4 4 4 4 0 0 0-4-4zm9 4-2-1.2.3-2.3-2.2-.9-1.3-1.9-2.3.5L12 3l-1.5 2.2-2.3-.5L6.9 6.6l-2.2.9L5 9.8 3 12l2 2.2-.3 2.3 2.2.9 1.3 1.9 2.3-.5L12 21l1.5-2.2 2.3.5 1.3-1.9 2.2-.9-.3-2.3z'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 8a4 4 0 1 0 4 4 4 4 0 0 0-4-4zm9 4-2-1.2.3-2.3-2.2-.9-1.3-1.9-2.3.5L12 3l-1.5 2.2-2.3-.5L6.9 6.6l-2.2.9L5 9.8 3 12l2 2.2-.3 2.3 2.2.9 1.3 1.9 2.3-.5L12 21l1.5-2.2 2.3.5 1.3-1.9 2.2-.9-.3-2.3z'/%3E%3C/svg%3E")}

/* ---------- 5b. Nav caret ---------- */
.caret{
  width:6px; height:6px; flex:none; margin-left:.1rem;
  border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px); opacity:.8;
  transition:transform .25s var(--ease);
}
.mainnav__link{gap:.4rem}
.mainnav__item:hover>.mainnav__link .caret,
.mainnav__link[aria-expanded="true"] .caret{transform:rotate(-135deg) translateY(-1px)}

/* ---------- 6. Floating rail ---------- */
/* Each entry is an icon that slides out to show its label on hover or focus;
   the Contact Us entry under the social icons stays open as a labelled tab. */
.rail{position:fixed; right:0; top:40%; z-index:55; display:flex; flex-direction:column; align-items:flex-end; gap:0; filter:drop-shadow(0 6px 14px rgba(0,0,0,.2))}
.rail__i{
  display:flex; align-items:center; gap:.55rem; height:34px; max-width:34px; padding:0 9px;
  color:#fff; white-space:nowrap; overflow:hidden; text-decoration:none;
  font-family:var(--font-display); font-weight:700; font-size:.78rem; letter-spacing:.02em;
  transition:max-width .25s var(--ease), filter .15s;
}
.rail__i:first-child{border-top-left-radius:var(--r-md)}
.rail__i:last-child{border-bottom-left-radius:var(--r-md)}
.rail__i svg{flex:none; width:16px; height:16px; fill:currentColor}
.rail__label{opacity:0; transition:opacity .2s}
.rail__i:hover,.rail__i:focus-visible{max-width:200px}
.rail__i:hover .rail__label,.rail__i:focus-visible .rail__label{opacity:1}
.rail__i--x{background:#000} .rail__i--ig{background:#e1306c} .rail__i--fb{background:#1877f2}
.rail__i--in{background:#0a66c2} .rail__i--yt{background:#ff0000}
.rail__i--login{background:var(--green)}
.rail__i--fb2{background:var(--gold-deep)}
.rail__i--phone{background:#f2b705; color:#13301f}
.rail__i:hover{filter:brightness(1.1)}

/* ---------- 7. Hero ---------- */
.hero{position:relative; margin:1rem auto 0; width:min(100% - 2.2rem, var(--wrap))}
.hero__viewport{position:relative; aspect-ratio:2567/1040; overflow:hidden; border-radius:var(--r-lg); background:var(--green-wash); box-shadow:var(--shadow-2)}
.hero__slide{
  position:absolute; inset:0; background-size:cover; background-position:center;
  opacity:0; transform:scale(1.06); transition:opacity 1s var(--ease), transform 7s linear;
  display:flex; align-items:flex-end; justify-content:flex-start; padding:0 0 4% 0;
}
.hero__slide::after{content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(8,30,16,.72) 0%,rgba(8,30,16,.32) 42%,rgba(8,30,16,0) 68%)}
.hero__slide.is-active{opacity:1; transform:scale(1)}
.hero__caption{
  position:relative; z-index:2; color:#fff; margin-left:clamp(1rem,4vw,3.4rem);
  max-width:min(60%,620px); text-align:left;
}
.hero__eyebrow{
  display:inline-block; font-family:var(--font-display); font-weight:700; text-transform:uppercase;
  letter-spacing:.16em; font-size:.74rem; color:#fff;
  padding:.42rem 1rem; border:1.5px solid rgba(255,255,255,.6); border-radius:999px; margin-bottom:1rem;
  background:rgba(0,0,0,.25); backdrop-filter:blur(4px); font-weight:600;
}
.hero__title{
  font-family:var(--font-display); font-weight:900; color:#fff;
  font-size:clamp(1.5rem,4.2vw,3rem); margin:0; line-height:1.12; letter-spacing:-.02em;
  text-shadow:0 4px 24px rgba(0,0,0,.5);
}
/* Devanagari captions need the Hindi face and a looser line box */
.hero__title--hi{font-family:var(--font-hi); letter-spacing:0; line-height:1.3; font-weight:700}
.hero__eyebrow--hi{font-family:var(--font-hi); text-transform:none; letter-spacing:.01em; font-size:.88rem; padding:.36rem 1rem; font-weight:600}
.hero__more{
  display:inline-flex; align-items:center; gap:.5rem; margin-top:1.1rem;
  font-family:var(--font-display); font-weight:700; font-size:.9rem; color:var(--accent-ink);
  background:#fff; padding:.6rem 1.3rem; border-radius:999px; box-shadow:var(--shadow-2);
  transition:transform .2s var(--ease), box-shadow .2s, background .2s, color .2s;
}
.hero__more svg{width:17px; height:17px; fill:currentColor; transition:transform .2s var(--ease)}
.hero__more:hover{transform:translateY(-2px); background:var(--gold); color:#3a2600}
.hero__more:hover svg{transform:translateX(4px)}

.hero__nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:46px; height:46px; border-radius:50%; background:rgba(255,255,255,.85); color:var(--accent-ink); font-size:1.1rem;
  display:grid; place-items:center; box-shadow:var(--shadow-2); transition:background .2s, transform .2s;
}
.hero__nav--prev{left:1rem} .hero__nav--next{right:1rem}
.hero__nav:hover{background:#fff; transform:translateY(-50%) scale(1.08)}
.hero__dots{position:absolute; bottom:1rem; left:50%; transform:translateX(-50%); display:flex; gap:8px; z-index:3}
.hero__dots button{width:10px; height:10px; border-radius:999px; background:rgba(255,255,255,.55); border:0; transition:width .25s var(--ease), background .25s}
.hero__dots button[aria-selected="true"]{width:30px; background:var(--gold)}

/* ---------- 8. Marquee Ticker ---------- */
.ticker{
  width:min(100% - 2.2rem, var(--wrap)); margin:1rem auto 0;
  background:var(--surface); border:1px solid var(--line);
  display:flex; align-items:center; gap:0; overflow:hidden; border-radius:var(--r-lg);
  box-shadow:var(--shadow-1);
}
.ticker__label{
  flex:none; display:flex; align-items:center; gap:.5rem;
  background:linear-gradient(180deg,var(--green),var(--green-deep)); color:#fff;
  font-family:var(--font-display); font-weight:700; text-transform:uppercase;
  letter-spacing:.08em; font-size:.74rem; padding:.75rem 1.2rem;
  border-radius:var(--r-lg) 0 0 var(--r-lg);
}
.ticker__pulse{width:9px; height:9px; border-radius:50%; background:#ffd75e;
  box-shadow:0 0 0 0 rgba(255,215,94,.7); animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,215,94,.7)}70%{box-shadow:0 0 0 8px rgba(255,215,94,0)}100%{box-shadow:0 0 0 0 rgba(255,215,94,0)}}
.ticker__viewport{flex:1; overflow:hidden}
.ticker__track{display:inline-flex; gap:1.4rem; align-items:center; white-space:nowrap;
  padding-left:100%; animation:marquee 40s linear infinite; font-weight:600; color:var(--ink-soft)}
.ticker__track a{transition:color .15s; color:var(--accent-ink-2)}
.ticker__track a:hover{text-decoration:underline}
.ticker__sep{color:var(--gold)}
.ticker.is-paused .ticker__track{animation-play-state:paused}
.ticker__pause{flex:none; padding:.5rem .95rem; color:var(--accent-ink); font-size:.7rem; cursor:pointer}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-100%)}}

/* ---------- 8b. Two Separate Professional Boxes ---------- */
.updates-wrapper{
  width:min(100% - 2.2rem, var(--wrap)); margin:3rem auto 0; padding-bottom:2rem;
}

.updates-grid{
  display:grid; grid-template-columns:1.12fr 1fr; gap:2.2rem; align-items:stretch;
}

/* About Us Box - Left */
.updates-about-box{
  background:#fff; border:1px solid #e2e8e0;
  padding:2.4rem 2.4rem; border-radius:var(--r-lg);
  box-shadow:0 2px 8px rgba(0,0,0,.08);
  display:flex; flex-direction:column; position:relative;
}
.about-title{
  font-family:var(--font-display); font-weight:800; font-size:1.7rem;
  color:var(--green); margin:0 0 .5rem; letter-spacing:-.02em;
  line-height:1.25;
}
.about-subtitle{
  font-family:var(--font-display); font-weight:600; font-size:1.05rem;
  color:#667c73; margin:0 0 1.4rem;
}
.about-divider{
  width:60px; height:4px; background:linear-gradient(90deg,var(--gold),var(--green));
  border-radius:2px; margin-bottom:1.4rem;
}
.about-text{
  font-size:.975rem; line-height:1.8; color:#334d45; margin-bottom:auto;
  flex:1;
}
.about-text p{margin:.85rem 0}
.about-text p:first-child{margin-top:0}
.about-readmore{
  display:inline-flex; align-items:center; gap:.4rem; margin-top:1.1rem; align-self:flex-end;
  color:var(--green); font-weight:700; font-size:.95rem; background:none; border:0; padding:0;
  text-decoration:underline; text-underline-offset:3px; transition:color .2s ease;
}
.about-readmore:hover{color:var(--green-deep)}
.about-readmore svg{width:16px; height:16px; fill:none; stroke:currentColor; transition:transform .2s ease}
.about-readmore:hover svg{transform:translateX(3px)}

/* Announcements Box - Right */
.updates-announcements-box{
  background:#fff; border:1px solid #dce4e0;
  border-radius:var(--r-lg); box-shadow:0 3px 12px rgba(0,0,0,.09);
  display:flex; flex-direction:column; overflow:hidden; position:relative;
}

.updates-tabs{
  display:grid; grid-template-columns:repeat(3,1fr); gap:0;
  list-style:none; margin:0; padding:0;
  background:linear-gradient(180deg,#f9fbfa 0%,#f4f8f6 100%);
  border-bottom:2px solid #dce4e0;
}
.updates-tab{
  padding:1.4rem 1rem; text-align:center; font-family:var(--font-display);
  font-weight:700; font-size:.93rem; color:#5a6d66; background:transparent;
  border:none; cursor:pointer; position:relative; transition:all .35s ease;
  text-transform:none; letter-spacing:.02em; text-decoration:none;
}
.updates-tab + .updates-tab{border-left:1px solid #dce4e0}
.updates-tab:hover{
  background:rgba(16,154,101,.08); color:var(--green);
}
.updates-tab.is-active,
.updates-tab.is-active:hover{
  background:linear-gradient(180deg,var(--green) 0%,var(--green-deep) 100%); color:#fff;
  border-left-color:transparent; box-shadow:inset 0 -3px 0 rgba(0,0,0,.12);
}
.updates-tab.is-active + .updates-tab{border-left-color:transparent}

.updates-tab-panel{
  display:none; flex:1 0 auto; height:290px; position:relative; overflow:hidden; background:#fff;
}
.updates-tab-panel.is-active{display:block}
.updates-tab-panel.is-static{height:auto}
.updates-tab-panel::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:var(--updates-fade,22px);
  background:linear-gradient(180deg,rgba(255,255,255,0),#fff 60%); pointer-events:none;
}

.updates-tab-panel.is-static::after{display:none}
.updates-announcements-box:has(.updates-tab-panel.is-active.is-static) .updates-controls{display:none}
.updates-list{list-style:none; margin:0; padding:0; will-change:transform}
.updates-list.is-animating{transition:transform .55s cubic-bezier(.4,0,.2,1)}
.updates-item{border-bottom:1px solid #eef2ef}
.updates-link{
  display:flex; align-items:flex-start; gap:.85rem;
  padding:.95rem 1.5rem; color:var(--ink); font-weight:500; font-size:.95rem;
  text-decoration:none; transition:background .2s ease;
}
.updates-link::before{
  content:''; flex:none; width:17px; height:17px; margin-top:.22rem; background:var(--green);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 3.2v17.6c0 .7-.8 1.1-1.4.7L7 17H4a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2h3l5.6-4.5c.6-.4 1.4 0 1.4.7zM16 9a3 3 0 0 1 0 6v-1.7a1.3 1.3 0 0 0 0-2.6zm0-3.6A6.6 6.6 0 0 1 16 18.6v-1.7a4.9 4.9 0 0 0 0-9.8z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 3.2v17.6c0 .7-.8 1.1-1.4.7L7 17H4a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2h3l5.6-4.5c.6-.4 1.4 0 1.4.7zM16 9a3 3 0 0 1 0 6v-1.7a1.3 1.3 0 0 0 0-2.6zm0-3.6A6.6 6.6 0 0 1 16 18.6v-1.7a4.9 4.9 0 0 0 0-9.8z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.updates-link-text{
  flex:1; line-height:1.55; color:#1f4a3a; word-break:break-word;
  text-decoration:underline; text-decoration-color:rgba(16,154,101,.35);
  text-underline-offset:3px; transition:color .2s ease, text-decoration-color .2s ease;
}
.updates-link:hover{background:rgba(16,154,101,.05)}
.updates-link:hover .updates-link-text{color:var(--green); text-decoration-color:var(--green)}
.updates-badge{
  flex:none; display:inline-flex; align-items:center; justify-content:center;
  font-size:.62rem; font-weight:800; text-transform:uppercase; color:#fff;
  background:var(--green); padding:.3rem .6rem; border-radius:3px;
  white-space:nowrap; margin-top:.15rem; letter-spacing:.06em;
}

.updates-footer{
  flex:none; display:flex; align-items:center; justify-content:flex-end; gap:.9rem;
  padding:.75rem 1.3rem; border-top:1px solid #e3eae5; background:#f6faf7;
}
.updates-controls{display:inline-flex; gap:3px}
.updates-ctrl{
  width:32px; height:32px; display:inline-flex; align-items:center; justify-content:center;
  background:var(--green); color:#fff; border:0; border-radius:3px; cursor:pointer;
  transition:background .2s ease, transform .2s ease;
}
.updates-ctrl:hover{background:var(--green-deep)}
.updates-ctrl:active{transform:scale(.94)}
.updates-ctrl svg{width:13px; height:13px; fill:currentColor}
.updates-ctrl .icon-play{display:none}
.updates-ctrl[aria-pressed="true"] .icon-pause{display:none}
.updates-ctrl[aria-pressed="true"] .icon-play{display:block}
.updates-view-all{
  display:inline-flex; align-items:center; color:var(--green); font-weight:700;
  font-size:.92rem; text-decoration:underline; text-underline-offset:3px;
  transition:color .2s ease;
}
.updates-view-all:hover{color:var(--green-deep)}

@media (max-width:1100px){
  .updates-grid{grid-template-columns:1fr; gap:1.8rem}
  .updates-about-box{padding:2.2rem}
  .about-title{font-size:1.45rem}
  .updates-tabs{grid-template-columns:repeat(3,1fr)}
}

@media (max-width:768px){
  .updates-grid{gap:1.5rem}
  .updates-about-box{padding:1.8rem}
  .about-title{font-size:1.3rem}
  .about-readmore{align-self:flex-end}
  .updates-tabs{grid-template-columns:1fr}
  .updates-tab{padding:.85rem 1rem; font-size:.85rem}
  .updates-link{padding:.85rem 1.2rem; font-size:.9rem}
}

/* ---------- 8b. Director's Desk Section ---------- */
.section--director{
  background:linear-gradient(135deg,var(--green-wash-2) 0%,var(--green-wash) 100%);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.director-layout{
  display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:flex-start;
}
.director-col--content{
  padding:2rem; background:#fff; border:1px solid var(--line);
  border-radius:var(--r-lg); box-shadow:var(--shadow-1);
}
.director-head{margin-bottom:1.8rem; padding-bottom:1.5rem; border-bottom:2px solid var(--line-soft)}
.director-title{
  font-family:var(--font-display); font-weight:800; font-size:1.5rem;
  color:var(--accent-ink); margin:0 0 .5rem; letter-spacing:-.01em; line-height:1.25;
}
.director-subtitle{
  font-family:var(--font-body); font-weight:600; font-size:.95rem; color:var(--ink-soft);
  margin:0; letter-spacing:.01em;
}
.director-body{margin-top:0}
.director-text{
  font-size:.98rem; line-height:1.68; color:var(--ink); margin:0 0 1.5rem;
}
.director-text p{margin:.7rem 0}
.director-text p:first-child{margin-top:0}
.director-text p:last-child{margin-bottom:0}
.director-col--image{
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--r-lg); overflow:hidden;
}
.director-col--image img{
  width:100%; height:auto; display:block; object-fit:cover;
  border-radius:var(--r-lg);
}

@media (max-width:968px){
  .director-layout{grid-template-columns:1fr; gap:2rem}
  .director-col--content{padding:1.5rem}
  .director-col--image{max-width:400px; margin:0 auto}
}

/* ---------- 9. Sections & headings ---------- */
.section{padding:2.6rem 0 2.9rem}
.section--stats{padding-top:2.2rem}
.section--research{background:var(--paper); border-block:1px solid var(--line-soft)}
.section--sdg{background:linear-gradient(180deg,var(--green-wash-2),#fff)}
.section--ext{background:var(--surface); border-top:1px solid var(--line)}

.secthead{margin-bottom:1.5rem}
.secthead--tight{margin-bottom:.9rem}
.secthead--center{text-align:center; margin-bottom:2rem}
.secthead--center .secthead__title::after{left:50%; transform:translateX(-50%)}
.secthead--pad{padding-top:.4rem}
.secthead__eyebrow{
  display:inline-block; font-family:var(--font-display); font-weight:700; text-transform:uppercase;
  letter-spacing:.16em; font-size:.72rem; color:var(--accent-ink-2); margin-bottom:.5rem;
}
.secthead__title{
  position:relative; color:var(--accent-ink); font-size:clamp(1.5rem,2.6vw,2.05rem); padding-bottom:.7rem;
}
.secthead__title::after{content:""; position:absolute; left:0; bottom:0; width:64px; height:4px; border-radius:4px;
  background:linear-gradient(90deg,var(--gold),var(--green-bright))}
.secthead__sub{color:var(--muted); margin:.85rem auto 0; max-width:620px; font-size:1.02rem}

/* compact bar-style heading for the three-up columns */
.secthead--bar{margin-bottom:1rem}
.secthead--bar .secthead__title{
  font-size:1.25rem; padding:.55rem 0 .55rem 1rem; color:var(--accent-ink);
  border-left:5px solid var(--gold); background:linear-gradient(90deg,var(--green-wash),transparent);
  border-radius:0 var(--r-sm) var(--r-sm) 0;
}
.secthead--bar .secthead__title::after{display:none}

.readmore{
  display:inline-flex; align-items:center; gap:.45rem; margin-top:.9rem; color:var(--accent-ink); font-weight:700; font-size:.92rem;
  transition:gap .2s var(--ease), color .2s;
}
.readmore svg{width:16px; height:16px; fill:currentColor}
.readmore:hover{color:var(--accent-ink-2); gap:.75rem}

.btn{
  display:inline-flex; align-items:center; gap:.5rem; background:linear-gradient(180deg,var(--green),var(--green-deep)); color:#fff; font-weight:700;
  padding:.6rem 1.3rem; border-radius:999px; box-shadow:var(--shadow-1); transition:transform .2s var(--ease), box-shadow .2s, filter .2s;
}
.btn:hover{transform:translateY(-2px); box-shadow:var(--shadow-2); filter:brightness(1.05)}
.btn--sm{padding:.42rem 1rem; font-size:.85rem}

/* ---------- 10. Statistics + corners ---------- */
.stats-row{display:grid; grid-template-columns:minmax(300px,30%) 1fr; gap:1.8rem; align-items:start}

.statbox{display:flex; flex-direction:column}
.statgrid{
  list-style:none; margin:0; padding:1rem;
  display:grid; grid-template-columns:repeat(4,1fr); gap:.7rem;
  border:1px solid var(--line); border-radius:var(--r-lg); background:var(--surface); box-shadow:var(--shadow-1);
}
.statgrid li{
  display:grid; justify-items:center; gap:.15rem; text-align:center; padding:.7rem .3rem;
  border-radius:var(--r-md); background:var(--green-wash-2); border:1px solid transparent;
  transition:transform .2s var(--ease), box-shadow .2s, border-color .2s, background .2s;
}
.statgrid li:hover{transform:translateY(-3px); background:#fff; border-color:var(--line); box-shadow:var(--shadow-2)}
.statgrid__ico{display:grid; place-items:center; width:46px; height:46px; border-radius:50%; background:radial-gradient(circle at 50% 35%,#fff,var(--green-wash)); margin-bottom:.15rem}
.statgrid__ico img{width:30px; height:30px; object-fit:contain; mix-blend-mode:multiply}
.statgrid__n{font-family:var(--font-display); font-weight:800; font-size:1.4rem; color:var(--accent-ink); line-height:1}
.statgrid__l{font-size:.74rem; color:var(--muted); font-weight:600}
[data-theme="dark"] .statgrid__ico img{mix-blend-mode:normal; filter:invert(1) hue-rotate(180deg) brightness(1.4)}

.corners{display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem}
/* ABI & ITMU: title + subtitle on top, diagram image, then the four tags */
.corner--abi{background:var(--surface)}
.abi__head{display:flex; align-items:center; gap:.65rem; padding:.85rem 1rem .8rem; background:var(--green-wash); border-bottom:1px solid var(--line-soft)}
.abi__icon{flex:none; display:grid; place-items:center; width:38px; height:38px; border-radius:50%; background:var(--green); color:#fff}
.abi__icon svg{width:24px; height:24px; fill:currentColor}
.abi__title{font-family:var(--font-display); font-weight:800; color:var(--accent-ink); font-size:1.15rem; line-height:1.05; letter-spacing:.01em}
.abi__sub{color:var(--ink-soft); font-size:.72rem; line-height:1.25; margin-top:.2rem}
.abi__img{display:block; width:100%; height:auto; padding:.7rem .7rem .35rem; margin:auto}
.abi__tags{
  list-style:none; margin:.35rem .75rem .85rem; padding:.35rem .6rem; display:grid; grid-template-columns:1fr;
  background:var(--green-wash-2); border:1px solid var(--line-soft); border-radius:var(--r-md);
}
.abi__tags li{
  display:flex; align-items:center; gap:.6rem; min-width:0; padding:.5rem .1rem;
  font-family:var(--font-display); font-weight:600; font-size:.86rem; color:var(--ink-soft); line-height:1.2;
}
.abi__tags li + li{border-top:1px solid var(--line-soft)}
.abi__tico{flex:none; display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:#fff; color:var(--accent-ink-2); box-shadow:inset 0 0 0 1px var(--line)}
.abi__tico svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
/* Kisaan / Students circular badge images */
.corner__badge{display:block; width:100%; max-width:210px; height:auto; margin:auto; transition:transform .3s var(--ease)}
.corner__body:hover .corner__badge,.corner__body:focus-visible .corner__badge{transform:translateY(-4px) scale(1.05)}
.corner{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--shadow-1); transition:transform .22s var(--ease), box-shadow .22s}
.corner:hover{transform:translateY(-4px); box-shadow:var(--shadow-2)}
.corner--students{}
.corner__head{
  display:flex; align-items:center; justify-content:center; gap:.5rem; padding:.7rem .9rem;
  background:var(--green-wash); color:var(--accent-ink); border-bottom:1px solid var(--line-soft);
  font-family:var(--font-display); font-weight:700; font-size:.98rem;
}
.corner--students .corner__head{background:#e8f1fb; color:var(--blue-deep)}
.corner__head svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.corner__body{width:100%; padding:1.4rem .8rem 1.6rem; display:grid; place-items:center; flex:1}
.corner__disc{
  position:relative; display:grid; place-items:center; gap:.25rem;
  width:150px; height:150px; border-radius:50%;
  background:radial-gradient(circle at 50% 38%, #ffffff 0%, var(--green-wash) 100%);
  box-shadow:inset 0 0 0 1px var(--line), var(--shadow-1);
  transition:transform .3s var(--ease), box-shadow .3s;
}
.corner__disc::before{content:""; position:absolute; inset:8px; border-radius:50%; border:2px dashed rgba(31,122,68,.28)}
.corner--students .corner__disc{background:radial-gradient(circle at 50% 38%, #ffffff 0%, #e3eefb 100%)}
.corner--students .corner__disc::before{border-color:rgba(26,95,168,.3)}
.corner__body:hover .corner__disc,.corner__body:focus-visible .corner__disc{transform:translateY(-4px) scale(1.04); box-shadow:var(--shadow-2)}
.corner__disc svg{width:40px; height:40px; fill:none; stroke:var(--green); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round}
.corner--students .corner__disc svg{stroke:var(--blue-head)}
.corner__name{font-family:var(--font-display); font-weight:700; color:var(--accent-ink); font-size:.9rem; text-align:center; line-height:1.15}
.corner--students .corner__name{color:var(--blue-deep)}
.corner__panel{
  margin:0 .8rem .9rem; padding:.75rem .9rem; background:var(--green-wash-2);
  border:1px solid var(--green-mid); border-radius:var(--r-md); font-size:.86rem; font-weight:600; color:var(--ink-soft);
  animation:slide-down .25s var(--ease);
}
.corner--students .corner__panel{background:#eef5fd; border-color:var(--blue-head)}
.corner__panel p{margin:0}

/* ---------- 11. Research ---------- */
.research{display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem}
.rcard{}
.rcard__btn{
  display:flex; flex-direction:column; width:100%; height:100%; text-align:left; border:1px solid var(--line); border-radius:var(--r-lg);
  overflow:hidden; background:var(--surface); box-shadow:var(--shadow-1);
  transition:box-shadow .25s var(--ease), transform .25s var(--ease), border-color .25s;
}
.rcard__btn:hover,.rcard__btn[aria-expanded="true"]{box-shadow:var(--shadow-2); transform:translateY(-5px); border-color:var(--green-mid)}
.rcard__media{position:relative; overflow:hidden; display:block}
.rcard__media::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(15,45,25,.28)); opacity:0; transition:opacity .3s}
.rcard__btn:hover .rcard__media::after{opacity:1}
.rcard__media img{width:100%; aspect-ratio:16/10; object-fit:cover; transition:transform .5s var(--ease)}
.rcard__btn:hover .rcard__media img{transform:scale(1.07)}
.rcard__title{
  position:relative; display:block; padding:.85rem 2.4rem .95rem 1rem; background:var(--surface); flex:1;
  font-family:var(--font-display); font-weight:700; font-size:1rem; color:var(--accent-ink); line-height:1.28;
}
.rcard__title small{display:block; font-weight:500; font-size:.78rem; color:var(--muted); margin-top:.2rem; font-family:var(--font-body)}
.rcard__go{
  position:absolute; right:.9rem; top:.9rem; width:26px; height:26px; border-radius:50%;
  display:grid; place-items:center; background:var(--green-wash); color:var(--accent-ink-2); font-size:1.2rem; font-weight:400; line-height:1;
  transition:transform .25s var(--ease), background .25s, color .25s;
}
.rcard__btn:hover .rcard__go{background:var(--gold); color:#fff; transform:rotate(90deg)}
.rcard__btn[aria-expanded="true"] .rcard__title{background:linear-gradient(180deg,var(--green),var(--green-deep)); color:#fff}
.rcard__btn[aria-expanded="true"] .rcard__title small{color:#cfe6d4}
.rcard__btn[aria-expanded="true"] .rcard__go{background:#fff; color:var(--accent-ink); transform:rotate(45deg)}
.rcard__btn--link{text-decoration:none; color:inherit; cursor:pointer}
.rcard__go--arrow{font-size:1rem}
.rcard__btn--link:hover .rcard__go--arrow{transform:translateX(3px)}
.rcard__btn--static{cursor:default}
.rcard__btn--static:hover{transform:none; box-shadow:var(--shadow-1); border-color:var(--line)}
.rcard__btn--static:hover .rcard__media img{transform:none}
.rcard__btn--static:hover .rcard__media::after{opacity:0}

.focus{
  grid-column:1 / -1; background:var(--surface); border:1px solid var(--line); border-left:5px solid var(--gold);
  padding:1.3rem 1.5rem 1.4rem; border-radius:var(--r-md); box-shadow:var(--shadow-1);
  animation:slide-down .28s var(--ease);
}
.focus h3{font-size:.95rem; text-transform:uppercase; letter-spacing:.08em; color:var(--accent-ink); margin-bottom:.7rem; display:flex; align-items:center; gap:.5rem}
.focus h3::before{content:""; width:20px; height:3px; background:var(--gold); border-radius:2px}
.focus ul{margin:0; padding:0; list-style:none; display:grid; gap:.55rem}
.focus li{color:var(--ink-soft); padding-left:1.6rem; position:relative}
.focus li::before{content:""; position:absolute; left:0; top:.5em; width:9px; height:9px; border-radius:50%; background:var(--green-bright); box-shadow:0 0 0 3px var(--green-wash)}
.focus .readmore{margin-top:.9rem}
@keyframes slide-down{from{opacity:0; transform:translateY(-8px)} to{opacity:1; transform:none}}

/* ---------- 11b. Scientist profiles ---------- */
.section--scientists{background:var(--paper); border-block:1px solid var(--line-soft)}
.scientists{display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem}
.scicard__btn{
  display:flex; flex-direction:column; align-items:center; text-align:center; width:100%; height:100%;
  gap:.35rem; padding:1.5rem 1rem 1.3rem; background:var(--surface); border:1px solid var(--line);
  border-top:4px solid var(--green-mid); border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  transition:box-shadow .25s var(--ease), transform .25s var(--ease), border-color .25s;
}
.scicard__btn:hover,.scicard__btn[aria-expanded="true"]{box-shadow:var(--shadow-2); transform:translateY(-5px); border-top-color:var(--gold)}
.scicard__avatar{width:112px; height:112px; border-radius:50%; overflow:hidden; box-shadow:inset 0 0 0 1px var(--line), var(--shadow-1); margin-bottom:.4rem}
.scicard__avatar img{width:100%; height:100%; object-fit:cover; display:block}
.scicard__name{font-family:var(--font-display); font-weight:700; color:var(--accent-ink); font-size:1.02rem; line-height:1.2}
.scicard__role{color:var(--muted); font-size:.85rem; line-height:1.3; flex:1}
.scicard__view{
  display:inline-block; margin-top:.55rem; padding:.4rem 1rem; border-radius:999px; font-size:.82rem; font-weight:700;
  color:#fff; background:linear-gradient(180deg,var(--green),var(--green-deep)); box-shadow:var(--shadow-1); transition:filter .2s, transform .2s var(--ease);
}
.scicard__btn:hover .scicard__view{filter:brightness(1.06); transform:translateY(-1px)}
.scicard__btn[aria-expanded="true"] .scicard__view{background:linear-gradient(180deg,var(--gold),var(--gold-deep))}

.scidetail{
  margin-top:1.4rem; background:var(--surface); border:1px solid var(--line); border-left:5px solid var(--gold);
  padding:1.4rem 1.6rem 1.6rem; border-radius:var(--r-md); box-shadow:var(--shadow-1); animation:slide-down .28s var(--ease);
}
.scidetail__top{display:grid; grid-template-columns:1fr auto; gap:1.4rem; align-items:start; padding-bottom:1.1rem; margin-bottom:1.1rem; border-bottom:1px solid var(--line-soft)}
.scidetail__id{display:flex; gap:1.1rem; align-items:center}
.scidetail__id img{width:96px; height:96px; border-radius:50%; object-fit:cover; box-shadow:inset 0 0 0 1px var(--line), var(--shadow-1)}
.scidetail__idtext h3{color:var(--accent-ink); font-size:1.25rem; line-height:1.2}
.scidetail__role{color:var(--accent-ink-2); font-weight:600; font-size:.95rem; margin-top:.15rem}
.scidetail__dept{color:var(--ink-soft); font-size:.9rem; margin-top:.1rem}
.scidetail__contact{display:flex; flex-wrap:wrap; gap:.3rem 1.2rem; margin-top:.5rem; color:var(--muted); font-size:.85rem}
.scidetail__links{list-style:none; margin:0; padding:0; display:grid; gap:.5rem; min-width:210px}
.scidetail__links a{display:block; padding:.5rem .8rem; background:var(--green-wash); border:1px solid var(--line); border-radius:var(--r-sm); color:var(--accent-ink); font-weight:600; font-size:.85rem; transition:background .2s, color .2s}
.scidetail__links a:hover{background:var(--green); color:#fff}
.scidetail__h{font-size:.9rem; text-transform:uppercase; letter-spacing:.07em; color:var(--accent-ink); margin:1rem 0 .55rem; display:flex; align-items:center; gap:.5rem}
.scidetail__h::before{content:""; width:20px; height:3px; background:var(--gold); border-radius:2px}
.scidetail__list{margin:0; padding:0; list-style:none; display:grid; gap:.45rem}
.scidetail__list li{position:relative; padding-left:1.6rem; color:var(--ink-soft)}
.scidetail__list li::before{content:""; position:absolute; left:0; top:.5em; width:9px; height:9px; border-radius:50%; background:var(--green-bright); box-shadow:0 0 0 3px var(--green-wash)}
.scidetail__areas{margin:0; padding:0; list-style:none; display:grid; grid-template-columns:repeat(2,1fr); gap:.5rem}
.scidetail__areas li{position:relative; padding-left:1.7rem; color:var(--ink-soft); font-size:.92rem}
.scidetail__areas li::before{content:"\2713"; position:absolute; left:0; top:0; color:var(--accent-ink-2); font-weight:700}
.scidetail__statement{color:var(--ink-soft); line-height:1.55; max-width:70ch}

@media (max-width:980px){
  .scientists{grid-template-columns:repeat(2,1fr)}
  .scidetail__top{grid-template-columns:1fr}
  .scidetail__links{min-width:0}
}
@media (max-width:640px){
  .scientists{grid-template-columns:1fr}
  .scidetail__id{flex-direction:column; text-align:center}
  .scidetail__contact{justify-content:center}
  .scidetail__areas{grid-template-columns:1fr}
}

/* ---------- 12. Three-column strip ---------- */
.three{display:grid; grid-template-columns:1fr 1fr 1fr; gap:1.8rem}
.story__viewport{position:relative; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; background:var(--surface); box-shadow:var(--shadow-1)}
.story__slide{margin:0; display:none}
.story__slide.is-active{display:block}
.story__slide img{width:100%; aspect-ratio:16/10; object-fit:cover}
.story__slide figcaption{padding:.7rem .9rem; font-size:.86rem; color:var(--muted); background:var(--surface)}
.story__dots{display:flex; gap:7px; justify-content:center; margin-top:.7rem}
.story__dots button{width:9px; height:9px; border-radius:999px; border:0; background:var(--line); transition:width .25s var(--ease), background .25s}
.story__dots button[aria-selected="true"]{width:26px; background:var(--green)}

.mediacard,.pubcard{display:block; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; background:var(--surface); box-shadow:var(--shadow-1); transition:box-shadow .22s, transform .22s var(--ease)}
.mediacard:hover,.pubcard:hover{box-shadow:var(--shadow-2); transform:translateY(-3px)}
.mediacard img,.pubcard img{width:100%; object-fit:contain; margin-inline:auto}
.mediacard img{max-height:340px; width:auto; padding:.6rem}
.three__col{align-self:start}
.pubcard__meta{font-size:.88rem; color:var(--muted); margin:.7rem 0 0}

/* ---------- 13. SDG + advisory ---------- */
.sdgrow{display:grid; grid-template-columns:1.1fr .9fr; gap:2.2rem; align-items:start}
.sdggrid{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5,1fr); gap:.9rem}
.sdggrid button{width:100%; border-radius:var(--r-md); overflow:hidden; box-shadow:var(--shadow-1); transition:transform .22s var(--ease), box-shadow .22s}
.sdggrid img{width:100%; display:block}
.sdggrid button:hover,.sdggrid button[aria-expanded="true"]{transform:translateY(-5px); box-shadow:var(--shadow-2)}
.sdggrid button[aria-expanded="true"]{outline:3px solid var(--gold); outline-offset:2px}
.sdgpanel{
  margin-top:1.2rem; background:var(--surface); border:1px solid var(--line); border-left:5px solid var(--green);
  padding:1.2rem 1.4rem 1.3rem; border-radius:var(--r-md); box-shadow:var(--shadow-1); animation:slide-down .28s var(--ease);
}
.sdgpanel h3{font-size:1.05rem; color:var(--accent-ink); margin-bottom:.6rem}
.sdgpanel ul{margin:0; padding:0; list-style:none; display:grid; gap:.45rem}
.sdgpanel li{color:var(--ink-soft); padding-left:1.6rem; position:relative}
.sdgpanel li::before{content:""; position:absolute; left:0; top:.5em; width:9px; height:9px; border-radius:50%; background:var(--green-bright); box-shadow:0 0 0 3px var(--green-wash)}
.sdgpanel .readmore{margin-top:.8rem}

.advisory{border:1px solid var(--line); border-radius:var(--r-lg); background:var(--surface); overflow:hidden; box-shadow:var(--shadow-1)}
.advisory__head{background:linear-gradient(180deg,var(--green),var(--green-deep)); color:#fff; font-size:1.08rem; text-align:center; padding:.7rem 1rem; font-family:var(--font-display); font-weight:700}
.advisory__body{display:grid; grid-template-columns:1.05fr .95fr; gap:1.1rem; padding:1.1rem}
.advisory__map{width:100%; object-fit:contain; align-self:start; border-radius:var(--r-md); border:1px solid var(--line-soft)}
.advisory__form{display:grid; gap:.35rem; align-content:start}
.advisory__form label{font-size:.8rem; color:var(--muted); font-weight:700; margin-top:.3rem}
.advisory__form select{
  padding:.5rem .7rem; border:1.5px solid var(--line); border-radius:var(--r-sm); background:var(--paper); color:var(--ink); width:100%;
  -webkit-appearance:none; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231f7a44'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right .5rem center; background-size:18px;
  transition:border-color .2s, box-shadow .2s;
}
.advisory__form select:focus{outline:none; border-color:var(--green-mid); box-shadow:var(--ring)}
.advisory__reslabel{margin:.8rem 0 .2rem; font-weight:700; font-size:.85rem; color:var(--accent-ink)}
.advisory__result{list-style:none; margin:0; padding:0; display:grid; gap:.3rem; font-size:.9rem; color:var(--ink-soft)}
.advisory__result li{display:flex; align-items:center; gap:.5rem; padding:.3rem .6rem; background:var(--green-wash-2); border-radius:var(--r-sm)}
.advisory__result li::before{content:""; width:8px; height:8px; border-radius:50%; background:var(--gold); flex:none}
#advView{justify-self:start; margin-top:.75rem}

/* ---------- 14. External links ---------- */
.extwrap{display:flex; align-items:center; gap:.6rem}
.ext{
  list-style:none; margin:0; padding:.6rem 0; display:flex; gap:1rem; overflow-x:auto;
  scroll-behavior:smooth; scrollbar-width:none; flex:1;
}
.ext::-webkit-scrollbar{display:none}
.ext li{flex:0 0 auto}
.ext a{display:grid; place-items:center; height:76px; min-width:120px; padding:.5rem 1rem; border:1px solid var(--line); border-radius:var(--r-md); background:var(--surface); transition:border-color .2s, box-shadow .2s, transform .2s var(--ease)}
.ext a:hover{border-color:var(--green-mid); box-shadow:var(--shadow-2); transform:translateY(-3px)}
.ext img{max-height:54px; width:auto; object-fit:contain}
.ext__nav{width:40px; height:40px; flex:none; border-radius:50%; background:var(--green-wash); color:var(--accent-ink); font-size:1.1rem; display:grid; place-items:center; transition:background .2s, transform .2s}
.ext__nav:hover{background:var(--green); color:#fff; transform:scale(1.06)}
.paygate{display:flex; justify-content:center; padding-top:1rem}
.paygate__link{border:1px solid var(--line); border-radius:var(--r-md); padding:.6rem 1.2rem; background:var(--surface); box-shadow:var(--shadow-1); transition:transform .2s var(--ease), box-shadow .2s}
.paygate__link:hover{transform:translateY(-3px); box-shadow:var(--shadow-2)}
.paygate img{max-height:54px; width:auto}

/* ---------- 15. Footer ---------- */
.footer{background:linear-gradient(180deg,var(--footer-bg),var(--footer-bg-2)); color:var(--footer-ink); margin-top:0; position:relative}
.footer::before{content:""; position:absolute; left:0; right:0; top:0; height:4px;
  background:linear-gradient(90deg,var(--gold),var(--green-bright),var(--green))}
.footer__top{display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; padding:1.6rem 0}
.visitors__label{font-family:var(--font-display); font-weight:700; color:var(--gold); margin:0 0 .35rem; font-size:1.05rem}
.visitors__count{display:flex; gap:4px; margin:0}
.visitors__count span{
  display:grid; place-items:center; width:26px; height:30px; border-radius:var(--r-sm);
  font-family:var(--font-display); font-weight:700; background:rgba(255,255,255,.06); border:1px solid var(--footer-line);
}
.visitors__count span:nth-child(1){color:#7ec8ff}.visitors__count span:nth-child(2){color:#ff9a9a}
.visitors__count span:nth-child(3){color:#8affa0}.visitors__count span:nth-child(4){color:#c9a3ff}
.visitors__count span:nth-child(5){color:#ffd27e}.visitors__count span:nth-child(6){color:#7ec8ff}

.footer__services{list-style:none; margin:0; padding:0; display:flex; gap:1.9rem; flex-wrap:wrap}
.footer__services a{display:grid; justify-items:center; gap:.35rem; font-size:.88rem; color:var(--footer-muted); transition:color .18s, transform .18s}
.footer__services svg{width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; transition:stroke .18s}
.footer__services a:hover{color:#fff; transform:translateY(-2px)}
.footer__services a:hover svg{stroke:var(--gold)}
.footer__social{list-style:none; margin:0; padding:0; display:flex; gap:.5rem}
.footer__social .soc{width:32px; height:32px}

.footer__nav{border-block:1px solid var(--footer-line)}
.footer__nav ul{list-style:none; margin:0; padding:.85rem 0; display:flex; flex-wrap:wrap; gap:.2rem 0}
.footer__nav a{color:var(--footer-ink); font-weight:500; transition:color .15s}
.footer__nav li+li::before{content:""; display:inline-block; width:4px; height:4px; border-radius:50%; background:var(--gold); margin:0 .9rem; vertical-align:middle; opacity:.7}
.footer__nav a:hover{color:var(--gold)}

.footer__legal{display:flex; align-items:center; gap:1.4rem; flex-wrap:wrap; padding:1.2rem 0}
.footer__copy{margin:0; font-size:.9rem; flex:1 1 340px; line-height:1.5; color:var(--footer-muted)}
.footer__updated{margin:0; color:#ffd97a; font-weight:600}
.footer__badges{display:flex; gap:.7rem; align-items:center}
.footer__badge{height:74px; width:auto; background:#fff; padding:6px 10px; border-radius:10px; box-shadow:var(--shadow-1)}
/* Rajbhasa Committee logo in the footer top row */
.footer__rslogo{flex:none; display:inline-flex}
.footer__rslogo img{width:56px; height:56px; border-radius:50%; background:#fff; padding:2px; box-shadow:var(--shadow-1); transition:transform .2s var(--ease)}
.footer__rslogo:hover img{transform:translateY(-2px) scale(1.05)}

.footer__policies{background:rgba(0,0,0,.35); font-size:.74rem}
.footer__policies .wrap{display:flex; flex-wrap:wrap; padding:.55rem 0}
.footer__policies a{padding:.15rem .7rem; border-right:1px solid var(--footer-line); color:#bcd3ff; transition:color .15s}
.footer__policies a:last-child{border-right:0}
.footer__policies a:hover{color:#fff}

/* ---------- 16. Back to top ---------- */
.totop{
  position:fixed; right:16px; bottom:18px; z-index:58;
  width:46px; height:46px; border-radius:50%; background:linear-gradient(180deg,var(--green),var(--green-deep)); color:#fff;
  box-shadow:var(--shadow-2); opacity:0; pointer-events:none; transition:opacity .25s, transform .25s var(--ease);
  transform:translateY(10px);
}
.totop:hover{transform:translateY(-3px)}
.totop.is-visible{opacity:1; pointer-events:auto; transform:none}
.totop.is-visible:hover{transform:translateY(-3px)}

/* ---------- 16b. Inner pages: banner, prose, data table, facts, gallery ----------
   Shared furniture for every non-home page. */
.pagehead{
  position:relative; overflow:hidden; color:#fff;
  background:linear-gradient(115deg,var(--green-deep-2),var(--green-deep) 42%,var(--green) 100%);
  border-bottom:4px solid var(--gold); padding:2.1rem 0 2.4rem;
}
.pagehead::after{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.16;
  background:radial-gradient(58% 130% at 88% 0%,#fff,transparent 62%);
}
.pagehead>.wrap{position:relative; z-index:1}
.crumbs{display:flex; flex-wrap:wrap; align-items:center; list-style:none; margin:0 0 .75rem; padding:0; font-size:.85rem; color:#bfdcc4}
.crumbs li+li::before{content:"›"; margin:0 .5rem; opacity:.6}
.crumbs a{color:#bfdcc4; transition:color .15s}
.crumbs a:hover{color:#fff; text-decoration:underline}
.crumbs [aria-current="page"]{color:var(--gold); font-weight:600}
.pagehead__title{color:#fff; font-size:clamp(1.5rem,3vw,2.2rem); line-height:1.18}
.pagehead__sub{margin-top:.65rem; max-width:74ch; color:#d9ecdb; font-size:1.01rem; line-height:1.6}

.prose p{color:var(--ink-soft); font-size:1.02rem; line-height:1.85; margin-bottom:1.05rem}
.prose p:last-child{margin-bottom:0}
.subhead{
  font-family:var(--font-display); font-weight:700; color:var(--accent-ink); font-size:1.08rem;
  margin:0 0 1rem; padding-left:.85rem; border-left:4px solid var(--gold);
}

.tablewrap{
  overflow-x:auto; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-md); box-shadow:var(--shadow-1);
}
.dtable{width:100%; min-width:660px; border-collapse:collapse}
.dtable th,.dtable td{padding:.85rem 1.1rem; text-align:left; font-size:.97rem; border-bottom:1px solid var(--line-soft)}
.dtable thead th{
  background:linear-gradient(180deg,var(--green),var(--green-deep)); color:#fff; border-bottom:0;
  font-family:var(--font-display); font-weight:700; font-size:.85rem; letter-spacing:.05em;
  text-transform:uppercase; white-space:nowrap;
}
.dtable tbody tr:nth-child(even){background:var(--green-wash-2)}
.dtable tbody tr:hover{background:var(--green-wash)}
.dtable tbody tr:last-child td{border-bottom:0}
.dtable__num{width:66px; text-align:center; color:var(--muted); font-weight:700}
.dtable__name{font-weight:700; color:var(--accent-ink); white-space:nowrap}
.dtable a{color:var(--accent-ink-2); font-weight:600; word-break:break-word}
.dtable a:hover{color:var(--accent-ink); text-decoration:underline}
.rolepill{
  display:inline-block; padding:.22rem .75rem; border-radius:999px; white-space:nowrap;
  font-size:.79rem; font-weight:700; letter-spacing:.02em;
  background:var(--green-wash); color:var(--accent-ink); border:1px solid var(--line);
}
.rolepill--lead{background:#fdf1d6; color:var(--accent-warm); border-color:#f0dcae}

.factgrid{display:grid; grid-template-columns:repeat(5,1fr); gap:1rem}
.fact{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md);
  box-shadow:var(--shadow-1); padding:1.25rem 1rem; text-align:center;
  transition:transform .2s var(--ease), box-shadow .2s, border-color .2s;
}
.fact:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-color:var(--green-bright)}
.fact__n{font-family:var(--font-display); font-weight:800; font-size:2.05rem; line-height:1; color:var(--accent-ink)}
.fact__l{margin-top:.5rem; color:var(--muted); font-size:.89rem; line-height:1.45}

.gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem}
.gallery figure{
  margin:0; overflow:hidden; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-md); box-shadow:var(--shadow-1);
  transition:transform .2s var(--ease), box-shadow .2s;
}
.gallery figure:hover{transform:translateY(-3px); box-shadow:var(--shadow-2)}
.gallery img{display:block; width:100%; height:225px; object-fit:cover; transition:transform .35s var(--ease)}
.gallery figure:hover img{transform:scale(1.05)}
.gallery figcaption{padding:.72rem .95rem; color:var(--muted); font-size:.88rem; line-height:1.4}

.bullets{margin:0; padding-left:1.15rem; color:var(--ink-soft); line-height:1.7}
.bullets li{margin-bottom:.4rem}
.bullets li::marker{color:var(--green-bright)}
.bullets--tight li{margin-bottom:.2rem}

.chips{display:flex; flex-wrap:wrap; gap:.5rem; list-style:none; margin:0; padding:0}
.chips li,.chips .chip{
  padding:.35rem .95rem; border-radius:999px; font-weight:600; font-size:.9rem;
  color:var(--accent-ink); background:var(--green-wash); border:1px solid var(--line);
}

.cardgrid{display:grid; grid-template-columns:repeat(2,1fr); gap:1.2rem}
.infocard{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md);
  box-shadow:var(--shadow-1); padding:1.3rem 1.4rem;
}
.infocard__head{
  font-family:var(--font-display); font-weight:700; color:var(--accent-ink); font-size:1.02rem;
  margin:0 0 .7rem; padding-bottom:.5rem; border-bottom:2px solid var(--green-wash);
}

/* Scientist profile card */
.profile{
  display:grid; grid-template-columns:132px 1fr; gap:1.5rem; align-items:start;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md);
  box-shadow:var(--shadow-1); padding:1.4rem; margin-bottom:1.2rem;
}
.profile--nophoto{grid-template-columns:1fr}
.profile__photo{width:132px; height:158px; object-fit:cover; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--green-wash)}
.profile__name{font-family:var(--font-display); font-weight:700; font-size:1.12rem; color:var(--accent-ink)}
.profile__role{margin:.25rem 0 0; color:var(--accent-ink-2); font-weight:600; font-size:.94rem}
.profile__meta{margin:.5rem 0 0; display:flex; flex-wrap:wrap; gap:.4rem 1.2rem; font-size:.9rem; color:var(--muted)}
.profile__meta a{color:var(--accent-ink-2); font-weight:600; word-break:break-word}
.profile__meta a:hover{color:var(--accent-ink); text-decoration:underline}
.profile__block{margin-top:1rem}
.profile__label{
  font-family:var(--font-display); font-weight:700; font-size:.74rem; letter-spacing:.08em;
  text-transform:uppercase; color:var(--accent-ink-2); margin:0 0 .35rem;
}
.profile__block p{margin:0; color:var(--ink-soft); line-height:1.65}

/* ---------- 17. Responsive ---------- */
@media (max-width:1180px){
  .mainnav__link{font-size:.74rem; letter-spacing:.02em; padding-inline:.3rem}
  .mega__grid--7{grid-template-columns:repeat(4,1fr)}
  .mega__grid--6{grid-template-columns:repeat(3,1fr)}
  .mega__grid--5{grid-template-columns:repeat(3,1fr)}
  .stats-row{grid-template-columns:1fr}
  .statgrid{grid-template-columns:repeat(8,1fr)}
  .hero__caption{max-width:75%}
  .factgrid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:980px){
  .navtoggle{display:flex}
  .masthead__inner{grid-template-columns:auto 1fr auto; row-gap:.7rem}
  .masthead__right{grid-column:1 / -1; order:3}
  .searchbox{width:100%}
  .searchbox input{width:100%}

  .mainnav{position:static; max-height:0; overflow:hidden; transition:max-height .3s ease}
  .mainnav.is-open{max-height:82vh; overflow-y:auto}
  .mainnav__list{flex-direction:column}
  .mainnav__item{border-bottom:1px solid rgba(255,255,255,.15)}
  .mainnav__item::after{display:none}
  .mainnav__item--home{flex:none}
  .mainnav__item--home a{justify-content:flex-start; padding-inline:1.1rem}
  .mainnav__link{justify-content:space-between; min-height:46px; text-align:left; padding-inline:1.1rem}
  .mainnav__link::before{display:none}
  .mainnav__link::after{content:"+"; font-size:1.3rem; line-height:1}
  .mainnav__link[aria-expanded="true"]::after{content:"–"}
  .caret{display:none}
  .mega{
    position:static; width:auto; margin:0; opacity:1; visibility:visible; transform:none;
    box-shadow:none; border-top:0; display:none; background:rgba(0,0,0,.14);
  }
  .mainnav__item.is-open .mega{display:block}
  .mainnav__item:hover .mega{display:none}
  .mainnav__item.is-open:hover .mega{display:block}
  .mega__grid{grid-template-columns:1fr!important; gap:.4rem; padding:.8rem 1.4rem}
  .mega__head{color:#eaf6e6}
  .mega__head::after{background:var(--gold)}
  .mega__links a{color:#d6ead0}
  .mega__links a:hover{background:rgba(255,255,255,.1); color:#fff}
  .mi{background:#9fd0a2}
  .mega__tile{background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.18); box-shadow:none; flex-direction:row; align-items:center; padding:.7rem 1rem}
  .mega__tile:hover{transform:none; border-color:rgba(255,255,255,.35)}
  .mega__tile-label{color:#eaf6e6}
  .mega__tile:hover .mega__tile-label{color:#fff}
  .mi--lg{width:20px; height:20px}


  .three{grid-template-columns:1fr 1fr}
  .three__col:last-child{grid-column:1 / -1}
  .sdgrow{grid-template-columns:1fr}
  .research{grid-template-columns:repeat(2,1fr)}
  .corners{grid-template-columns:repeat(2,1fr)}
  .rail{display:none}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .cardgrid{grid-template-columns:1fr}
  .pagehead{padding:1.6rem 0 1.8rem}
  .hero__caption{max-width:80%}
}
@media (max-width:640px){
  body{font-size:1rem}
  .utilbar__inner{justify-content:center}
  .utilbar__social{margin-right:0}
  .masthead__inner{grid-template-columns:auto 1fr}
  .navtoggle{grid-column:2; justify-self:end}
  .titleblock{grid-column:1 / -1; order:2}
  .brandmark img{width:100px}
  .hero{margin-top:.6rem}
  .hero__viewport{aspect-ratio:4/3; border-radius:var(--r-md)}
  .hero__slide::after{background:linear-gradient(180deg,rgba(8,30,16,.15),rgba(8,30,16,.75))}
  .hero__slide{align-items:flex-end; padding-bottom:6%}
  .hero__caption{max-width:92%; margin-left:0; padding-inline:clamp(1rem,4vw,1.4rem)}
  .hero__nav{width:38px; height:38px}
  .ticker{border-radius:var(--r-md)}
  .ticker__label{border-radius:var(--r-md) 0 0 var(--r-md)}
  .statgrid{grid-template-columns:repeat(4,1fr)}
  .research{grid-template-columns:1fr}
  .corners{grid-template-columns:1fr}
  .three{grid-template-columns:1fr}
  .three__col:last-child{grid-column:auto}
  .sdggrid{grid-template-columns:repeat(3,1fr)}
  .advisory__body{grid-template-columns:1fr}
  .footer__top{justify-content:center; text-align:center}
  .footer__services{gap:1.2rem; justify-content:center}
  .footer__legal{justify-content:center; text-align:center}
  .factgrid{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:1fr}
  .cardgrid{grid-template-columns:1fr}
  .profile{grid-template-columns:1fr; gap:1rem}
  .profile__photo{width:120px; height:144px}
  .gallery img{height:200px}
}

/* ---------- 18. Motion & print ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important; scroll-behavior:auto!important}
  .ticker__track{animation:none; padding-left:0}
  .hero__slide{transform:none!important}
}
@media print{
  .utilbar,.mainnav,.rail,.totop,.hero__nav,.hero__dots,.ticker__pause,.ext__nav,.navtoggle{display:none!important}
  body{color:#000; background:#fff}
  .footer{background:#fff; color:#000}
  a[href^="http"]::after{content:" (" attr(href) ")"; font-size:.75em}
}

/* ---------- 16c. Crop Improvement: variety catalogue ----------
   Filter chips over a card grid; each card carries the plot photograph,
   a seed inset and the release specification. */
.croptabs{display:flex; flex-wrap:wrap; gap:.55rem; margin-bottom:1.6rem}
.croptab{
  display:inline-flex; align-items:center; gap:.5rem; padding:.5rem 1.1rem; border-radius:999px;
  border:1px solid var(--line); background:var(--surface); box-shadow:var(--shadow-1);
  font-family:var(--font-display); font-weight:700; font-size:.88rem; color:var(--ink-soft);
  transition:background .2s, color .2s, border-color .2s, transform .2s var(--ease);
}
.croptab:hover{border-color:var(--green-bright); color:var(--accent-ink); transform:translateY(-1px)}
.croptab__n{
  font-size:.72rem; font-weight:800; padding:.05rem .45rem; border-radius:999px;
  background:var(--green-wash); color:var(--accent-ink);
}
.croptab.is-active{background:linear-gradient(180deg,var(--green),var(--green-deep)); color:#fff; border-color:transparent}
.croptab.is-active .croptab__n{background:rgba(255,255,255,.22); color:#fff}

.vargrid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem}
.varcard{
  display:flex; flex-direction:column; overflow:hidden; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  transition:transform .2s var(--ease), box-shadow .2s, border-color .2s;
}
.varcard:hover{transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:var(--green-bright)}
.varcard[hidden]{display:none}
.varcard__media{position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--green-wash)}
.varcard__media img{width:100%; height:100%; object-fit:cover; transition:transform .45s var(--ease)}
.varcard:hover .varcard__media img:not(.varcard__seed){transform:scale(1.06)}
.varcard__tag{
  position:absolute; top:.8rem; left:.8rem; display:inline-flex; align-items:center; gap:.4rem;
  padding:.26rem .7rem; border-radius:999px; background:rgba(8,30,16,.7); backdrop-filter:blur(4px);
  color:#ffe6a6; font-family:var(--font-display); font-weight:700; font-size:.7rem; letter-spacing:.05em;
}
.varcard__media img.varcard__seed{
  position:absolute; right:.8rem; bottom:.8rem; width:66px; height:66px; border-radius:50%;
  object-fit:cover; border:3px solid #fff; box-shadow:var(--shadow-2); background:#fff;
}
.varcard__body{display:flex; flex-direction:column; gap:.75rem; padding:1rem 1.15rem 1.2rem; flex:1}
.varcard__name{font-family:var(--font-display); font-weight:700; font-size:1.02rem; line-height:1.32; color:var(--accent-ink)}
.varspecs{display:grid; grid-template-columns:1fr 1fr; gap:.6rem .9rem; list-style:none; margin:0; padding:0}
.varspecs li{min-width:0}
.varspec__k{
  display:block; font-family:var(--font-display); font-weight:700; font-size:.66rem;
  text-transform:uppercase; letter-spacing:.09em; color:var(--muted); margin-bottom:.1rem;
}
.varspec__v{display:block; font-size:.88rem; font-weight:600; color:var(--ink); line-height:1.35}
.varcard__note{
  margin:0; padding-top:.75rem; border-top:1px dashed var(--line);
  font-size:.86rem; line-height:1.6; color:var(--ink-soft);
}
.varcard__note b{color:var(--accent-ink)}
.varempty{padding:2rem 0; color:var(--muted); text-align:center}

.cardgrid--3{grid-template-columns:repeat(3,1fr)}

@media (max-width:1180px){
  .vargrid{grid-template-columns:repeat(2,1fr)}
  .cardgrid--3{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  .vargrid{grid-template-columns:1fr}
  .cardgrid--3{grid-template-columns:1fr}
  .varspecs{grid-template-columns:1fr 1fr}
  .croptab{font-size:.82rem; padding:.42rem .9rem}
}

/* ---------- 16d. Crop Production: research theme blocks ---------- */
.themelist{display:grid; grid-template-columns:minmax(0,1fr); gap:1.4rem}
.themecard{
  min-width:0;
  background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--green-mid);
  border-radius:var(--r-md); box-shadow:var(--shadow-1); padding:1.35rem 1.5rem 1.45rem;
  transition:box-shadow .2s, border-left-color .2s;
}
.themecard:hover{box-shadow:var(--shadow-2); border-left-color:var(--gold)}
.themecard__head{display:flex; align-items:center; gap:.75rem; margin-bottom:.95rem}
.themecard__n{
  flex:none; display:grid; place-items:center; min-width:28px; height:28px; padding:0 .5rem;
  border-radius:999px; background:linear-gradient(180deg,var(--green),var(--green-deep));
  color:#fff; font-family:var(--font-display); font-weight:800; font-size:.8rem;
}
.themecard__t{font-family:var(--font-display); font-weight:700; font-size:1.06rem; line-height:1.32; color:var(--accent-ink)}
.themecard__sub{
  font-family:var(--font-display); font-weight:700; font-size:.74rem; letter-spacing:.08em;
  text-transform:uppercase; color:var(--accent-ink-2); margin:1.05rem 0 .45rem;
}
.themecard__sub:first-of-type{margin-top:0}
.themecard .gallery{margin-top:1.1rem}
.themecard .gallery img{height:200px}

/* compact tiles for products, machinery and instruments */
.tilegrid{display:grid; gap:1.1rem}
.tilegrid--5{grid-template-columns:repeat(5,1fr)}
.tilegrid--3{grid-template-columns:repeat(3,1fr)}
.tile{
  display:flex; flex-direction:column; overflow:hidden; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r-md); box-shadow:var(--shadow-1);
  transition:transform .2s var(--ease), box-shadow .2s, border-color .2s;
}
.tile:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-color:var(--green-bright)}
.tile__media{aspect-ratio:4/3; overflow:hidden; background:var(--green-wash)}
.tile__media img{width:100%; height:100%; object-fit:cover; transition:transform .4s var(--ease)}
.tile:hover .tile__media img{transform:scale(1.06)}
.tile__label{
  padding:.62rem .8rem .7rem; font-family:var(--font-display); font-weight:700;
  font-size:.85rem; line-height:1.35; color:var(--accent-ink); text-align:center;
}

/* numbered technology list */
.technos{display:grid; grid-template-columns:1fr 1fr; gap:.5rem 1.6rem; list-style:none; margin:0; padding:0; counter-reset:tech}
.technos li{
  counter-increment:tech; display:flex; gap:.7rem; align-items:baseline;
  padding:.5rem .2rem; border-bottom:1px dashed var(--line); color:var(--ink-soft); line-height:1.5;
}
.technos li::before{
  content:counter(tech); flex:none; min-width:1.6rem; text-align:center;
  font-family:var(--font-display); font-weight:800; font-size:.78rem; color:var(--accent-ink-2);
}

@media (max-width:1180px){
  .tilegrid--5{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:760px){
  .tilegrid--5,.tilegrid--3{grid-template-columns:repeat(2,1fr)}
  .technos{grid-template-columns:1fr}
  .themecard{padding:1.1rem 1.15rem 1.2rem}
}

/* ---------- 16e. Table variants ----------
   --fit  : column widths are declared, so the table can never grow past its
            container and the wrapper never needs to scroll on desktop.
   --stack: below the tablet breakpoint each row becomes its own card, with the
            column name printed from the cell's data-label. */
.dtable--fit{table-layout:fixed; min-width:0; width:100%}
.dtable--fit th,.dtable--fit td{white-space:normal; word-break:break-word; vertical-align:top}
.dtable--fit thead th{white-space:normal}

@media (max-width:760px){
  .tablewrap:has(.dtable--stack){overflow-x:visible; border:0; background:none; box-shadow:none}
  .dtable--stack{min-width:0; display:block; width:100%; table-layout:auto}
  .dtable--stack colgroup{display:none}
  .dtable--stack tbody{display:block; width:100%}
  .dtable--stack thead{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
  .dtable--stack tbody tr{
    display:block; margin-bottom:.9rem; padding:.9rem 1rem;
    background:var(--surface); border:1px solid var(--line);
    border-radius:var(--r-md); box-shadow:var(--shadow-1);
  }
  .dtable--stack tbody tr:nth-child(even){background:var(--surface)}
  .dtable--stack tbody td{display:block; padding:.3rem 0 !important; border:0}
  .dtable--stack tbody td::before{
    content:attr(data-label); display:block;
    font-family:var(--font-display); font-weight:700; font-size:.66rem;
    text-transform:uppercase; letter-spacing:.09em; color:var(--muted); margin-bottom:.1rem;
  }
  .dtable--stack tbody td:empty{display:none}
}

/* ---------- 16f. Certificate cards (ITMU patents) ---------- */
.certgrid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.4rem}
.certcard{
  display:flex; flex-direction:column; overflow:hidden; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  transition:transform .2s var(--ease), box-shadow .2s, border-color .2s;
}
.certcard:hover{transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:var(--green-bright)}
.certcard__media{
  position:relative; background:linear-gradient(180deg,var(--green-wash-2),var(--green-wash));
  border-bottom:1px solid var(--line); padding:.9rem; display:grid; place-items:center;
}
.certcard__media img{width:100%; height:290px; object-fit:contain; object-position:top}
.certcard__badge{
  position:absolute; top:.75rem; right:.75rem; padding:.24rem .7rem; border-radius:999px;
  background:linear-gradient(180deg,var(--green),var(--green-deep)); color:#fff;
  font-family:var(--font-display); font-weight:700; font-size:.68rem; letter-spacing:.05em;
  text-transform:uppercase; box-shadow:var(--shadow-1);
}
.certcard__body{display:flex; flex-direction:column; gap:.75rem; padding:1rem 1.15rem 1.2rem; flex:1}
.certcard__title{font-family:var(--font-display); font-weight:700; font-size:.98rem; line-height:1.35; color:var(--accent-ink)}
.certmeta{display:grid; gap:.5rem; list-style:none; margin:0; padding:.75rem 0 0; border-top:1px dashed var(--line)}
.certmeta li{display:flex; justify-content:space-between; gap:.8rem; font-size:.86rem}
.certmeta b{
  flex:none; font-family:var(--font-display); font-weight:700; font-size:.66rem;
  text-transform:uppercase; letter-spacing:.08em; color:var(--muted); align-self:center;
}
.certmeta span{text-align:right; font-weight:600; color:var(--ink)}

/* status pill used in the full patent listing */
.statuspill{
  display:inline-block; padding:.22rem .7rem; border-radius:999px; white-space:nowrap;
  font-size:.78rem; font-weight:700; border:1px solid var(--line);
  background:var(--green-wash); color:var(--accent-ink);
}
.statuspill--filed{background:#fdf1d6; color:var(--accent-warm); border-color:#f0dcae}

@media (max-width:1180px){ .certgrid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:760px){ .certgrid{grid-template-columns:minmax(0,1fr)} }

/* four-up stat row (inline grid-template on .factgrid would defeat the
   responsive steps below, so it gets its own class) */
.factgrid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1180px){ .factgrid--4{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){ .factgrid--4{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ---------- 16g. Partner / agreement cards (ITMU licensing) ---------- */
.factgrid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:760px){ .factgrid--3{grid-template-columns:1fr} }

.orggrid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem}
.orggrid--wide{grid-template-columns:repeat(3,minmax(0,1fr))}
.orgcard{
  display:flex; gap:.85rem; align-items:flex-start; padding:.95rem 1.1rem;
  background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--green-mid);
  border-radius:var(--r-md); box-shadow:var(--shadow-1);
  transition:transform .18s var(--ease), box-shadow .18s, border-left-color .18s;
}
.orgcard:hover{transform:translateY(-2px); box-shadow:var(--shadow-2); border-left-color:var(--gold)}
.orgcard__n{
  flex:none; display:grid; place-items:center; width:26px; height:26px; border-radius:50%;
  background:var(--green-wash); color:var(--accent-ink);
  font-family:var(--font-display); font-weight:800; font-size:.74rem;
}
.orgcard__name{font-family:var(--font-display); font-weight:700; font-size:.92rem; line-height:1.35; color:var(--accent-ink)}
.orgcard__note{margin:.2rem 0 0; font-size:.82rem; color:var(--muted); line-height:1.4}

/* partner logo wall keeps the artwork's own dark ground */
.logowall{
  padding:1.6rem; border-radius:var(--r-lg); box-shadow:var(--shadow-2);
  background:linear-gradient(180deg,#0d1a12,#050a07); border:1px solid rgba(255,255,255,.08);
}
.logowall img{width:100%; height:auto; display:block; border-radius:var(--r-sm)}

@media (max-width:1180px){ .orggrid{grid-template-columns:repeat(3,minmax(0,1fr))} .orggrid--wide{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:760px){ .orggrid,.orggrid--wide{grid-template-columns:1fr} .logowall{padding:.9rem} }

/* ---------- 16h. Technology transfer cards (ITMU) ---------- */
.techlist{display:grid; grid-template-columns:minmax(0,1fr); gap:1.5rem}
.techcard{
  display:grid; grid-template-columns:300px minmax(0,1fr); gap:0;
  overflow:hidden; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  transition:transform .2s var(--ease), box-shadow .2s, border-color .2s;
}
.techcard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-color:var(--green-bright)}
.techcard__media{
  position:relative; background:linear-gradient(180deg,var(--green-wash-2),var(--green-wash));
  border-right:1px solid var(--line); display:grid; place-items:center; padding:1rem;
}
.techcard__media img{width:100%; height:230px; object-fit:contain}
.techcard__n{
  position:absolute; top:.8rem; left:.8rem; display:grid; place-items:center;
  width:30px; height:30px; border-radius:50%; color:#fff;
  background:linear-gradient(180deg,var(--green),var(--green-deep));
  font-family:var(--font-display); font-weight:800; font-size:.82rem; box-shadow:var(--shadow-1);
}
.techcard__body{padding:1.3rem 1.5rem 1.4rem; display:flex; flex-direction:column; gap:.7rem}
.techcard__title{font-family:var(--font-display); font-weight:700; font-size:1.08rem; line-height:1.32; color:var(--accent-ink)}
.techcard__text{margin:0; color:var(--ink-soft); font-size:.94rem; line-height:1.7}

/* event timeline */
.timeline{list-style:none; margin:0; padding:0 0 0 1.4rem; border-left:2px solid var(--green-wash)}
.timeline li{position:relative; padding:0 0 1.15rem 1.1rem}
.timeline li::before{
  content:""; position:absolute; left:-1.65rem; top:.35rem; width:11px; height:11px;
  border-radius:50%; background:var(--green-mid); box-shadow:0 0 0 3px var(--green-wash);
}
.timeline__date{
  display:block; font-family:var(--font-display); font-weight:700; font-size:.7rem;
  letter-spacing:.08em; text-transform:uppercase; color:var(--accent-ink-2); margin-bottom:.15rem;
}
.timeline__what{color:var(--ink-soft); line-height:1.6}

@media (max-width:900px){
  .techcard{grid-template-columns:minmax(0,1fr)}
  .techcard__media{border-right:0; border-bottom:1px solid var(--line)}
  .techcard__media img{height:210px}
}

/* ---------- 16i. Table filter bar ---------- */
.filterbar{display:flex; flex-wrap:wrap; align-items:center; gap:.9rem; margin-bottom:1.4rem}
.filterbar__search{
  display:flex; align-items:center; gap:.6rem; flex:1 1 260px; max-width:380px;
  background:var(--surface); border:1.5px solid var(--line); border-radius:999px;
  padding:.5rem .6rem .5rem 1rem; transition:border-color .2s, box-shadow .2s;
}
.filterbar__search:focus-within{border-color:var(--green-mid); box-shadow:var(--ring)}
.filterbar__search svg{width:17px; height:17px; flex:none; fill:var(--muted)}
.filterbar__search input{flex:1; min-width:0; border:0; outline:0; background:none; font-size:.94rem; color:var(--ink)}
.filterbar__count{font-size:.88rem; color:var(--muted)}
.filterbar__count b{color:var(--accent-ink)}
.dtable tbody tr[hidden]{display:none}

/* ---------- 16j. Variety catalogue additions ---------- */
.varcard__name span{
  display:block; margin-top:.15rem; font-family:var(--font-body); font-weight:600;
  font-size:.83rem; color:var(--muted); letter-spacing:0;
}
/* Composite plates are wider than the 16:10 frame — show them whole. */
.varcard__media--fit{background:#fff}
.varcard__media--fit img{object-fit:contain}
.varcard:hover .varcard__media--fit img{transform:none}
.varxtra{
  margin:0; padding-top:.75rem; border-top:1px dashed var(--line);
  display:grid; gap:.5rem; font-size:.83rem; line-height:1.55;
}
.varxtra div{display:grid; grid-template-columns:auto 1fr; gap:.5rem; align-items:baseline}
.varxtra dt{
  font-family:var(--font-display); font-weight:700; font-size:.66rem; white-space:nowrap;
  text-transform:uppercase; letter-spacing:.08em; color:var(--muted); padding-top:.12rem;
}
.varxtra dd{margin:0; color:var(--ink-soft); min-width:0}

/* ---------- 16k. Partner logo carousel ---------- */
.lcar{position:relative}
.lcar__viewport{
  overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory;
  scroll-behavior:smooth; scrollbar-width:none; -ms-overflow-style:none;
  border-radius:var(--r-lg);
}
.lcar__viewport::-webkit-scrollbar{display:none}
.lcar__track{display:flex; gap:1rem; padding:.2rem}
.lcar__item{
  flex:0 0 calc((100% - 5rem) / 6); scroll-snap-align:start;
  display:flex; align-items:center; justify-content:center;
  aspect-ratio:16/10; margin:0; padding:1rem 1.1rem; min-width:0; overflow:hidden;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md);
  box-shadow:var(--shadow-1); transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s;
}
.lcar__item:hover{transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:var(--green-bright)}
.lcar__item img{
  max-width:100%; max-height:100%; width:auto; height:auto;
  object-fit:contain; mix-blend-mode:multiply;
}
.lcar__btn{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:42px; height:42px; display:grid; place-items:center;
  border:1px solid var(--line); border-radius:50%; cursor:pointer;
  background:var(--surface); color:var(--accent-ink); box-shadow:var(--shadow-2);
  transition:background .2s, color .2s, opacity .2s;
}
.lcar__btn:hover{background:var(--green-deep); color:#fff; border-color:transparent}
.lcar__btn:disabled{opacity:.32; cursor:default}
.lcar__btn:disabled:hover{background:var(--surface); color:var(--accent-ink); border-color:var(--line)}
.lcar__btn svg{width:17px; height:17px; fill:currentColor}
.lcar__btn--prev{left:-19px}
.lcar__btn--next{right:-19px}
.lcar__dots{display:flex; justify-content:center; flex-wrap:wrap; gap:.45rem; margin-top:1.4rem}
.lcar__dot{
  width:8px; height:8px; padding:0; border:0; border-radius:50%;
  background:var(--line); cursor:pointer; transition:width .25s var(--ease), background .25s;
}
.lcar__dot.is-active{width:24px; border-radius:999px; background:var(--green)}

@media (max-width:1180px){ .lcar__item{flex-basis:calc((100% - 3rem) / 4)} }
@media (max-width:860px){  .lcar__item{flex-basis:calc((100% - 2rem) / 3)} }
@media (max-width:560px){
  .lcar__item{flex-basis:calc((100% - 1rem) / 2)}
  .lcar__btn--prev{left:-8px}
  .lcar__btn--next{right:-8px}
}

/* Infographic figure used by the MoU / MoA sections */
.infofig{margin:0 0 2rem; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:1.4rem; box-shadow:var(--shadow-1)}
.infofig img{display:block; width:100%; height:auto; border-radius:var(--r-sm)}
.infofig figcaption{margin-top:.9rem; text-align:center; font-size:.86rem; color:var(--muted)}

/* ---------- 16l. Org card, icon variant ---------- */
.orgcard--ico{align-items:center; gap:1rem; padding:1rem 1.15rem 1rem 1rem; position:relative}
.orgcard__ico{
  flex:none; width:54px; height:54px; border-radius:50%; overflow:hidden;
  display:grid; place-items:center; background:transparent;
}
.orgcard__ico img{width:100%; height:100%; object-fit:contain; display:block}
.orgcard--ico .orgcard__name{padding-right:1.5rem}
.orgcard__seq{
  position:absolute; top:.5rem; right:.7rem;
  font-family:var(--font-display); font-weight:800; font-size:.68rem;
  letter-spacing:.05em; color:var(--muted); opacity:.5;
}
@media (max-width:760px){ .orgcard__ico{width:46px; height:46px} }

/* ---------- 16m. National campaign page ---------- */
.gallery--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.gallery--2 img{height:320px}

/* Collapsible Hindi version of a report */
.hindibox{
  margin-top:2.2rem; background:var(--surface); border:1px solid var(--line);
  border-left:4px solid var(--gold); border-radius:var(--r-md); box-shadow:var(--shadow-1);
}
.hindibox summary{
  cursor:pointer; list-style:none; padding:.95rem 1.25rem;
  font-family:var(--font-hi); font-weight:700; font-size:1rem; color:var(--accent-ink);
  display:flex; align-items:center; gap:.6rem;
}
.hindibox summary::-webkit-details-marker{display:none}
.hindibox summary::before{
  content:''; width:0; height:0; flex:none;
  border-left:7px solid var(--green-mid); border-top:5px solid transparent; border-bottom:5px solid transparent;
  transition:transform .2s var(--ease);
}
.hindibox[open] summary::before{transform:rotate(90deg)}
.hindibox summary:hover{color:var(--accent-ink-2)}
.hindibox .prose{padding:0 1.25rem 1.35rem; margin:0}
.prose--hi{font-family:var(--font-hi)}
.prose--hi p{line-height:1.95; text-align:justify}

/* Newspaper clippings */
.pressgrid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.2rem; align-items:start}
.presscard{
  margin:0; background:#fff; border:1px solid var(--line); border-radius:var(--r-md);
  box-shadow:var(--shadow-1); padding:.7rem; overflow:hidden;
  transition:transform .2s var(--ease), box-shadow .2s;
}
.presscard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2)}
.presscard img{display:block; width:100%; height:auto; border-radius:var(--r-sm)}
.presscard figcaption{
  padding:.7rem .3rem .2rem; font-family:var(--font-hi); font-size:.88rem;
  color:var(--muted); line-height:1.5; text-align:center;
}

@media (max-width:900px){
  .gallery--2{grid-template-columns:1fr}
  .gallery--2 img{height:260px}
  .pressgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:600px){ .pressgrid{grid-template-columns:1fr} }

/* ---------- 16n. Research projects table ---------- */
.prj__name{display:block; font-weight:700; color:var(--accent-ink); line-height:1.45}
.prj__tag{
  display:inline-block; margin-top:.4rem; padding:.16rem .55rem; border-radius:999px;
  background:var(--green-wash); color:var(--accent-ink); border:1px solid var(--line);
  font-family:var(--font-display); font-weight:700; font-size:.66rem;
  text-transform:uppercase; letter-spacing:.07em;
}
.prj__subs{
  margin:.55rem 0 0; padding-left:1rem; list-style:disc;
  color:var(--ink-soft); font-size:.84rem; line-height:1.6;
}
.prj__subs li{margin-bottom:.15rem}

/* ---------- 16o. Consultancy / contract project cards ---------- */
.conslist{display:grid; gap:1.1rem}
.conscard{
  display:flex; gap:1.15rem; align-items:flex-start; padding:1.35rem 1.5rem;
  background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--green-mid);
  border-radius:var(--r-md); box-shadow:var(--shadow-1);
  transition:transform .18s var(--ease), box-shadow .18s, border-left-color .18s;
}
.conscard:hover{transform:translateY(-2px); box-shadow:var(--shadow-2); border-left-color:var(--gold)}
.conscard__n{
  flex:none; display:grid; place-items:center; width:44px; height:44px; border-radius:50%;
  background:linear-gradient(180deg,var(--green),var(--green-deep)); color:#fff;
  font-family:var(--font-display); font-weight:800; font-size:.86rem;
}
.conscard__body{flex:1; min-width:0; display:flex; flex-direction:column; gap:.9rem}
.conscard__title{
  margin:0; font-family:var(--font-display); font-weight:700; font-size:1.02rem;
  line-height:1.5; color:var(--accent-ink);
}
.conscard__meta{grid-template-columns:1fr 1fr; gap:.7rem 1.4rem}
@media (max-width:760px){
  .conscard{padding:1.1rem 1.15rem; gap:.9rem}
  .conscard__n{width:36px; height:36px; font-size:.76rem}
  .conscard__meta{grid-template-columns:1fr}
}

/* ---------- 16p. Form download cards ---------- */
.dlgrid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem}
.dlcard{
  display:flex; gap:1.25rem; align-items:flex-start; padding:1.5rem 1.6rem;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1); transition:transform .18s var(--ease), box-shadow .18s, border-color .18s;
}
.dlcard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-color:var(--green-bright)}
.dlcard__ico{
  flex:none; position:relative; display:grid; place-items:center;
  width:60px; height:60px; border-radius:var(--r-md);
  background:var(--green-wash); color:var(--accent-ink);
}
.dlcard__ico svg{width:30px; height:30px; fill:currentColor}
.dlcard__type{
  position:absolute; bottom:-8px; left:50%; transform:translateX(-50%);
  padding:.1rem .45rem; border-radius:4px;
  background:var(--green-deep); color:#fff;
  font-family:var(--font-display); font-weight:800; font-size:.58rem; letter-spacing:.08em;
}
.dlcard__body{flex:1; min-width:0}
.dlcard__title{
  margin:0 0 .5rem; font-family:var(--font-display); font-weight:700;
  font-size:1.04rem; line-height:1.4; color:var(--accent-ink);
}
.dlcard__note{margin:0 0 1.1rem; color:var(--ink-soft); font-size:.9rem; line-height:1.7}
.dlcard .btn svg{fill:currentColor}
@media (max-width:900px){ .dlgrid{grid-template-columns:1fr} }

/* AICRP network icon for the About Us mega band */
.mi--net{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92s2.92-1.31 2.92-2.92-1.31-2.92-2.92-2.92z'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92s2.92-1.31 2.92-2.92-1.31-2.92-2.92-2.92z'/%3E%3C/svg%3E")}

/* Keep the icon on the first line when a mega link wraps to two lines */
.mega__links a{align-items:flex-start}
.mega__links a .mi{margin-top:.18rem}

/* Overview + Cadre Strength share one column: stack the tiles instead of
   sitting them at opposite ends of the band. */
.mega__col--solo{flex-direction:column; gap:.7rem}
.mega__col--solo .mega__tile{padding:.9rem 1rem; gap:.45rem}
.mega__col--solo .mega__tile .mi--lg{width:24px; height:24px}
@media (max-width:1180px){ .mega__col--solo{flex-direction:row} }

/* ---------- 16q. AICRP crop research target cards ---------- */
.croplist{display:grid; gap:1.2rem}
.cropcard{
  display:grid; grid-template-columns:340px minmax(0,1fr); gap:0;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1); overflow:hidden;
  transition:transform .2s var(--ease), box-shadow .2s, border-color .2s;
}
.cropcard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-color:var(--green-bright)}
.cropcard--nopic{grid-template-columns:minmax(0,1fr)}
.cropcard__media{background:#fff; display:flex; align-items:center; justify-content:center; padding:.9rem; border-right:1px solid var(--line)}
.cropcard__media img{max-width:100%; max-height:250px; width:auto; height:auto; object-fit:contain; display:block; border-radius:var(--r-sm)}
.cropcard__body{padding:1.5rem 1.7rem}
.cropcard__title{
  display:flex; align-items:center; gap:.7rem; margin:0 0 .9rem;
  font-family:var(--font-display); font-weight:700; font-size:1.14rem; color:var(--accent-ink);
}
.cropcard__n{
  flex:none; display:grid; place-items:center; width:30px; height:30px; border-radius:50%;
  background:linear-gradient(180deg,var(--green),var(--green-deep)); color:#fff;
  font-size:.78rem; font-weight:800;
}
@media (max-width:900px){
  .cropcard{grid-template-columns:minmax(0,1fr)}
  .cropcard__media{border-right:0; border-bottom:1px solid var(--line)}
  .cropcard__media img{max-height:230px}
  .cropcard__body{padding:1.2rem 1.25rem}
}

/* ---------- 16r. AICRP Kharif Pulses ---------- */
.timeline--wide{max-width:none}
.timeline--wide .timeline__date{min-width:6.5rem}

.mapfig{
  margin:0; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg);
  padding:1.2rem; box-shadow:var(--shadow-1);
}
.mapfig img{display:block; width:100%; height:auto; border-radius:var(--r-sm)}
.mapfig figcaption{margin-top:.9rem; text-align:center; font-size:.86rem; color:var(--muted); line-height:1.5}
.mapfig--wide img{max-height:none}

.kcrops{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem}
.kcrop{
  display:flex; flex-direction:column; overflow:hidden;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1); transition:transform .2s var(--ease), box-shadow .2s, border-color .2s;
}
.kcrop:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-color:var(--green-bright)}
.kcrop__media{background:var(--green-wash); aspect-ratio:16/9; overflow:hidden}
.kcrop__media img{width:100%; height:100%; object-fit:cover; display:block}
.kcrop__body{padding:1.25rem 1.4rem 1.35rem; display:flex; flex-direction:column; gap:.8rem; flex:1}
.kcrop__title{margin:0; font-family:var(--font-display); font-weight:700; font-size:1.12rem; color:var(--accent-ink)}
.kcrop__stats{display:flex; flex-wrap:wrap; gap:.5rem}
.kcrop__stats span{
  padding:.32rem .8rem; border-radius:999px; background:var(--green-wash);
  border:1px solid var(--line); font-size:.83rem; color:var(--ink-soft);
}
.kcrop__stats b{color:var(--accent-ink); font-weight:800}

.yearbox{margin-top:auto; border-top:1px dashed var(--line); padding-top:.8rem}
.yearbox summary{
  cursor:pointer; list-style:none; display:flex; align-items:center; gap:.5rem;
  font-family:var(--font-display); font-weight:700; font-size:.86rem; color:var(--accent-ink);
}
.yearbox summary::-webkit-details-marker{display:none}
.yearbox summary::before{
  content:''; width:0; height:0; flex:none;
  border-left:6px solid var(--green-mid); border-top:4px solid transparent; border-bottom:4px solid transparent;
  transition:transform .2s var(--ease);
}
.yearbox[open] summary::before{transform:rotate(90deg)}
.yearbox summary:hover{color:var(--accent-ink-2)}
.yearlist{list-style:none; margin:.9rem 0 0; padding:0; display:grid; gap:.7rem}
.yearlist li{display:grid; grid-template-columns:5.2rem minmax(0,1fr); gap:.7rem; align-items:baseline}
.yearlist__y{
  font-family:var(--font-display); font-weight:800; font-size:.8rem; color:var(--accent-ink);
}
.yearlist__y em{font-style:normal; font-weight:600; color:var(--muted)}
.yearlist__n{font-size:.83rem; line-height:1.65; color:var(--ink-soft)}

@media (max-width:900px){
  .kcrops{grid-template-columns:1fr}
  .yearlist li{grid-template-columns:1fr; gap:.15rem}
}

/* ---------- 16s. Library ---------- */
.misscard{
  padding:1.6rem 1.7rem; border-radius:var(--r-lg); box-shadow:var(--shadow-2);
  background:linear-gradient(160deg,var(--green),var(--green-deep)); color:#fff;
}
.misscard__label{
  margin:0 0 .7rem; font-family:var(--font-display); font-weight:800; font-size:.7rem;
  text-transform:uppercase; letter-spacing:.12em; color:var(--gold);
}
.misscard__text{margin:0; font-size:1.02rem; line-height:1.8; color:rgba(255,255,255,.94)}

.holdcard{
  padding:1.6rem 1.7rem; background:var(--surface); border:1px solid var(--line);
  border-top:4px solid var(--green-mid); border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  transition:transform .18s var(--ease), box-shadow .18s, border-top-color .18s;
}
.holdcard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-top-color:var(--gold)}
.holdcard__n{
  margin:0; font-family:var(--font-display); font-weight:800; font-size:2.6rem;
  line-height:1; color:var(--accent-ink); letter-spacing:-.02em;
}
.holdcard__label{
  margin:.4rem 0 0; font-family:var(--font-display); font-weight:700; font-size:.74rem;
  text-transform:uppercase; letter-spacing:.1em; color:var(--muted);
}
.holdcard__note{margin:1rem 0 .9rem; color:var(--ink-soft); font-size:.92rem; line-height:1.75}

.onos{
  display:flex; gap:1.4rem; align-items:center; margin-top:1.4rem;
  padding:1.5rem 1.7rem; border-radius:var(--r-lg);
  background:var(--surface); border:1px solid var(--line); border-left:5px solid var(--gold);
  box-shadow:var(--shadow-1);
}
.onos__badge{
  flex:none; display:grid; place-items:center; width:76px; height:76px; border-radius:50%;
  background:linear-gradient(180deg,var(--gold),var(--gold-deep,#b8860b)); color:#fff;
  font-family:var(--font-display); font-weight:800; font-size:.98rem; letter-spacing:.03em;
  box-shadow:var(--shadow-1);
}
.onos__title{
  margin:0 0 .4rem; font-family:var(--font-display); font-weight:700;
  font-size:1.08rem; color:var(--accent-ink);
}
.onos__text{margin:0; color:var(--ink-soft); line-height:1.75}
@media (max-width:640px){
  .onos{flex-direction:column; align-items:flex-start; gap:1rem}
  .holdcard__n{font-size:2.2rem}
}

/* ---------- 16t. Regional centre — staff grid & paired tables ---------- */
.bikstaff{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.2rem; margin-bottom:2.2rem}
.bikstaff .profile{grid-template-columns:96px minmax(0,1fr); margin-bottom:0}
.bikstaff .profile__photo{width:96px; height:116px}

.biktables{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.6rem; align-items:start}
.biktables > *{min-width:0}

@media (max-width:1200px){
  .biktables{grid-template-columns:1fr}
}
@media (max-width:1000px){
  .bikstaff{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .bikstaff{grid-template-columns:1fr}
  .bikstaff .profile{grid-template-columns:1fr}
  .bikstaff .profile__photo{width:120px; height:144px}
}

/* ---------- 16u. Plant Biotechnology — achievement groups & scientist dossiers ---------- */
.achgroups{display:grid; gap:1.2rem}
.achgroup{
  background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--green-mid);
  border-radius:var(--r-lg); box-shadow:var(--shadow-1); padding:1.35rem 1.5rem;
  transition:border-left-color .18s, box-shadow .18s;
}
.achgroup:hover{border-left-color:var(--gold); box-shadow:var(--shadow-2)}
.achgroup__head{
  display:flex; align-items:center; gap:.7rem; margin:0 0 1rem;
  font-family:var(--font-display); font-weight:700; font-size:1.06rem; color:var(--accent-ink);
}
.achgroup__n{
  flex:none; display:grid; place-items:center; width:28px; height:28px; border-radius:50%;
  background:var(--green-wash); color:var(--accent-ink);
  font-family:var(--font-display); font-weight:800; font-size:.78rem;
}
.achgroup .bullets{margin:0}
@media (min-width:900px){
  .achgroup .bullets{columns:2; column-gap:2.2rem}
  .achgroup .bullets li{break-inside:avoid; -webkit-column-break-inside:avoid}
}

.scilist{display:grid; gap:1.5rem}
.scicard{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1); overflow:hidden;
  transition:transform .18s var(--ease), box-shadow .18s;
}
.scicard:hover{transform:translateY(-2px); box-shadow:var(--shadow-2)}
.scicard__top{
  display:grid; grid-template-columns:126px minmax(0,1fr); gap:1.4rem;
  padding:1.4rem 1.6rem; background:var(--green-wash); border-bottom:1px solid var(--line);
}
.scicard__photo{
  width:126px; height:152px; object-fit:cover; border-radius:var(--r-sm);
  border:1px solid var(--line); background:#fff;
}
.scicard__name{
  margin:0; font-family:var(--font-display); font-weight:700; font-size:1.2rem; color:var(--accent-ink);
}
.scicard__role{margin:.25rem 0 0; color:var(--accent-ink-2); font-weight:600; font-size:.94rem}
.scicard__field{
  margin:.9rem 0 0; display:grid; gap:.55rem;
}
.scicard__field p{margin:0; color:var(--ink-soft); font-size:.92rem; line-height:1.7}
.scicard__field b{color:var(--accent-ink); font-weight:700}
.scicard__mails{margin:.9rem 0 0; display:flex; flex-wrap:wrap; gap:.4rem .9rem; font-size:.88rem}
.scicard__mails a{color:var(--accent-ink-2); font-weight:600; word-break:break-word}
.scicard__mails a:hover{color:var(--accent-ink); text-decoration:underline}
.scicard__body{padding:1.2rem 1.6rem 1.4rem; display:grid; gap:.4rem}

.scidet{border-top:1px dashed var(--line); padding-top:.85rem}
.scidet:first-child{border-top:0; padding-top:0}
.scidet summary{
  cursor:pointer; list-style:none; display:flex; align-items:center; gap:.55rem;
  font-family:var(--font-display); font-weight:700; font-size:.9rem; color:var(--accent-ink);
  padding:.25rem 0;
}
.scidet summary::-webkit-details-marker{display:none}
.scidet summary::before{
  content:''; width:0; height:0; flex:none;
  border-left:6px solid var(--green-mid); border-top:4px solid transparent; border-bottom:4px solid transparent;
  transition:transform .2s var(--ease);
}
.scidet[open] summary::before{transform:rotate(90deg)}
.scidet summary:hover{color:var(--accent-ink-2)}
.scidet__count{
  margin-left:.15rem; font-size:.72rem; font-weight:700; color:var(--muted);
  background:var(--green-wash); border-radius:999px; padding:.1rem .5rem;
}
.scidet .bullets{margin:.7rem 0 .9rem}
.scidet .bullets li{font-size:.9rem}
.scisub{margin:.9rem 0 .35rem; font-family:var(--font-display); font-weight:700; font-size:.86rem; color:var(--accent-ink)}
.scisub:first-child{margin-top:.2rem}

.scilinks{display:flex; flex-wrap:wrap; gap:.5rem; margin:.7rem 0 .3rem}

@media (max-width:640px){
  .scicard__top{grid-template-columns:1fr; gap:1rem}
  .scicard__photo{width:120px; height:146px}
}

/* ---------- 16v. Thematic research programme pages ---------- */
.proghero{display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:2.2rem; align-items:center}
.proghero__fig{
  margin:0; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg);
  padding:.85rem; box-shadow:var(--shadow-1);
}
.proghero__fig img{display:block; width:100%; height:auto; border-radius:var(--r-sm)}
.proghero__fig figcaption{margin-top:.75rem; text-align:center; font-size:.84rem; color:var(--muted)}
.proghero .prose{margin:0}

.pacegrid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.1rem}
.pacecard{
  position:relative; overflow:hidden; padding:1.4rem 1.4rem 1.5rem;
  background:var(--surface); border:1px solid var(--line); border-top:4px solid var(--green-mid);
  border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  transition:transform .18s var(--ease), box-shadow .18s, border-top-color .18s;
}
.pacecard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-top-color:var(--gold)}
.pacecard__k{
  display:block; font-family:var(--font-display); font-weight:800; font-size:2.6rem; line-height:1;
  color:var(--accent-ink); letter-spacing:-.02em;
}
.pacecard__t{
  margin:.4rem 0 .7rem; font-family:var(--font-display); font-weight:700;
  font-size:1.02rem; color:var(--accent-ink);
}
.pacecard__n{margin:0; color:var(--ink-soft); font-size:.9rem; line-height:1.75}

.xlinks{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem}
.xlink{
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.9rem; align-items:center;
  padding:1.1rem 1.25rem; background:var(--surface); border:1px solid var(--line);
  border-left:4px solid var(--green-mid); border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  color:inherit; text-decoration:none;
  transition:transform .18s var(--ease), box-shadow .18s, border-left-color .18s;
}
.xlink:hover{transform:translateY(-2px); box-shadow:var(--shadow-2); border-left-color:var(--gold)}
.xlink__t{display:block; margin:0; font-family:var(--font-display); font-weight:700; font-size:.98rem; color:var(--accent-ink)}
.xlink__n{display:block; margin:.3rem 0 0; color:var(--ink-soft); font-size:.86rem; line-height:1.6}
.xlink__go{
  flex:none; display:grid; place-items:center; width:30px; height:30px; border-radius:50%;
  background:var(--green-wash); color:var(--accent-ink); font-weight:800; font-size:.95rem;
}
.xlink:hover .xlink__go{background:var(--gold); color:#fff}

.gallery--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.gallery--4 img{height:168px}
.gallery--fit img{object-fit:contain; background:#fff; padding:.6rem}

@media (max-width:1000px){
  .proghero{grid-template-columns:1fr}
  .pacegrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .xlinks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery--4{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:640px){
  .pacegrid,.xlinks{grid-template-columns:1fr}
  .gallery--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery--4 img{height:130px}
}

/* ---------- 16w. Product / machinery showcase cards ---------- */
.pgrid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.15rem}
.pcard{
  position:relative; display:flex; flex-direction:column; overflow:hidden;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1);
  transition:transform .2s var(--ease), box-shadow .2s, border-color .2s;
}
.pcard:hover{transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:var(--gold)}
.pcard__media{
  position:relative; flex:none; height:190px; overflow:hidden;
  display:flex; align-items:center; justify-content:center; padding:1.1rem;
  background:linear-gradient(160deg,#fbfdf8 0%,#eef4e9 100%);
  border-bottom:1px solid var(--line);
}
.pcard__media img{
  max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain;
  border-radius:var(--r-sm); border:1px solid rgba(0,0,0,.07);
  filter:drop-shadow(0 5px 12px rgba(0,0,0,.12));
  transition:transform .35s var(--ease);
}
.pcard:hover .pcard__media img{transform:scale(1.06)}
.pcard__tag{
  position:absolute; z-index:2; top:.7rem; left:.7rem; padding:.24rem .62rem; border-radius:999px;
  background:rgba(255,255,255,.94); border:1px solid var(--line);
  font-family:var(--font-display); font-weight:700; font-size:.65rem;
  text-transform:uppercase; letter-spacing:.09em; color:var(--accent-ink);
}
.pcard__i{
  position:absolute; z-index:2; top:.7rem; right:.7rem; display:grid; place-items:center;
  width:25px; height:25px; border-radius:50%; background:var(--green-deep); color:#fff;
  font-family:var(--font-display); font-weight:800; font-size:.7rem;
}
.pcard__body{padding:.95rem 1.1rem 1.1rem; display:flex; flex-direction:column; gap:.35rem}
.pcard__t{
  margin:0; font-family:var(--font-display); font-weight:700; font-size:.96rem;
  line-height:1.35; color:var(--accent-ink);
}
.pcard__n{margin:0; color:var(--muted); font-size:.83rem; line-height:1.55}

.plegend{display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1.5rem}
.plegend span{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.34rem .8rem; border-radius:999px;
  background:var(--surface); border:1px solid var(--line);
  font-family:var(--font-display); font-weight:700; font-size:.72rem;
  text-transform:uppercase; letter-spacing:.07em; color:var(--accent-ink);
}
.plegend b{
  font-family:var(--font-display); font-weight:800; font-size:.72rem;
  color:var(--gold-deep,#b8860b);
}

@media (max-width:1100px){ .pgrid{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:820px){ .pgrid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:520px){
  .pgrid{grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem}
  .pcard__media{height:135px; padding:.75rem}
  .pcard__body{padding:.75rem .85rem .9rem}
  .pcard__t{font-size:.86rem}
}

/* ---------- 16x. Responsive audit fixes ---------- */


/* Four stat tiles cannot fit below ~420px — the icon alone is 46px. */
@media (max-width:430px){
  .statgrid{grid-template-columns:repeat(2,1fr); padding:.8rem; gap:.6rem}
}

/* Carousel arrows sat 19px outside .wrap, which only has an 18px gutter. */
.lcar__btn--prev{left:-14px}
.lcar__btn--next{right:-14px}

/* Staff card grids: keep these off inline styles so the mobile rules can win. */
.staffgrid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.2rem; margin-bottom:2rem}
.staffgrid .profile{grid-template-columns:96px minmax(0,1fr); margin-bottom:0}
.staffgrid .profile__photo{width:96px; height:116px}
@media (max-width:1000px){ .staffgrid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){
  .staffgrid{grid-template-columns:1fr}
  .staffgrid .profile{grid-template-columns:1fr}
  .staffgrid .profile__photo{width:120px; height:144px}
}

/* Micro-labels that were rendering below 11px. */
.dlcard__type,.varspec__k,.pcard__tag,.orgcard__seq,.certcard__badge,.prj__tag,.hero__eyebrow{
  font-size:.7rem;
}

/* Never let a media element push the page wider than its column. */
img,svg,video,canvas,iframe{max-width:100%}
table{max-width:100%}

/* ---------- 16y. Nav: hamburger up to 1120px ----------
   Eleven top-level items need ~1045px of track but the wrap only offers 989px at a
   1024px viewport, so the last item was being clipped on iPad landscape. The layout
   rules stay at their own breakpoints — this block moves ONLY the navigation. */
@media (max-width:1180px){
  .navtoggle{display:flex}
  .masthead__inner{grid-template-columns:auto 1fr auto; row-gap:.7rem}
  .masthead__right{grid-column:1 / -1; order:3}
  .searchbox{width:100%}
  .searchbox input{width:100%}

  .mainnav{position:static; max-height:0; overflow:hidden; transition:max-height .3s ease}
  .mainnav.is-open{max-height:82vh; overflow-y:auto}
  .mainnav__list{flex-direction:column}
  .mainnav__item{flex:none; border-right:0; border-bottom:1px solid rgba(255,255,255,.15)}
  .mainnav__item::after{display:none}
  .mainnav__item--home{flex:none}
  .mainnav__item--home a{justify-content:flex-start; padding-inline:1.1rem}
  .mainnav__link{justify-content:space-between; min-height:46px; text-align:left; padding:.5rem 1.1rem; font-size:.82rem; letter-spacing:.04em}
  .mainnav__link::before{display:none}
  .mainnav__link::after{content:"+"; font-size:1.3rem; line-height:1}
  .mainnav__link[aria-expanded="true"]::after{content:"–"}
  .caret{display:none}

  .mega{
    position:static; width:auto; margin:0; opacity:1; visibility:visible; transform:none;
    box-shadow:none; border-top:0; display:none; background:rgba(0,0,0,.14); left:auto!important;
  }
  .mainnav__item.is-open .mega{display:block}
  .mainnav__item:hover .mega{display:none}
  .mainnav__item.is-open:hover .mega{display:block}
  .mega.mega--panel{width:auto; min-width:0; max-width:none; padding:0}
  .mega__title{color:#eaf6e6; margin:0; padding:.85rem 1.4rem .5rem; border-bottom-color:rgba(255,255,255,.18)}
  .mega__list{padding:.3rem 1rem .8rem}
  .mega__list--2{grid-template-columns:1fr}
  .mega__list a{color:#d6ead0}
  .mega__list a:hover{background:rgba(255,255,255,.1); color:#fff}
  .mega__grid{grid-template-columns:1fr!important; gap:.4rem; padding:.8rem 1.4rem}
  .mega__head{color:#eaf6e6}
  .mega__head::after{background:var(--gold)}
  .mega__links a{color:#d6ead0}
  .mega__links a:hover{background:rgba(255,255,255,.1); color:#fff}
  .mi{background:#9fd0a2}
  .mega__tile{background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.18); box-shadow:none; flex-direction:row; align-items:center; padding:.7rem 1rem}
  .mega__tile:hover{transform:none; border-color:rgba(255,255,255,.35)}
  .mega__tile-label{color:#eaf6e6}
  .mega__tile:hover .mega__tile-label{color:#fff}
  .mi--lg{width:20px; height:20px}
  .mega__col--solo{flex-direction:column}
}

/* Big stat numbers ("10,000+") outgrew their tile on 320px phones. */
@media (max-width:430px){
  .fact{padding:.9rem .6rem}
  .fact__n{font-size:1.5rem}
  .fact__l{font-size:.82rem; margin-top:.35rem}
}

/* Touch targets: the theme swatches were 20x15, under the 24x24 minimum. Keep the
   swatch itself small visually but give it a full-size hit area on touch widths. */
@media (max-width:1180px){
  .swatches{gap:5px}
  .sw{width:30px; height:30px}
  .sw svg{width:17px; height:17px}
  .fontsize button{width:30px; height:28px}
  .util-ico{width:30px; height:30px}
}

/* ---------- 16z. Director profile ---------- */
.dirhero{
  display:grid; grid-template-columns:300px minmax(0,1fr); gap:2.2rem; align-items:center;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-2); padding:1.8rem 2rem;
}
.dirhero__fig{margin:0}
.dirhero__fig img{
  display:block; width:100%; height:auto; border-radius:var(--r-lg);
  border:1px solid var(--line); background:#fff;
}
.dirhero__name{
  margin:0; font-family:var(--font-display); font-weight:800;
  font-size:clamp(1.5rem,2.4vw,2rem); line-height:1.15; color:var(--accent-ink);
}
.dirhero__full{margin:.45rem 0 0; color:var(--muted); font-size:.95rem}
.dirhero__role{
  display:inline-block; margin:.9rem 0 0; padding:.4rem 1rem; border-radius:999px;
  background:var(--green-wash); color:var(--accent-ink);
  font-family:var(--font-display); font-weight:700; font-size:.9rem;
}
.dirhero__meta{margin:1.3rem 0 0; display:grid; gap:.6rem}
.dirhero__meta a,.dirhero__meta span{color:var(--ink-soft); font-size:.95rem}
.dirhero__meta a{color:var(--accent-ink-2); font-weight:600; word-break:break-word}
.dirhero__meta a:hover{color:var(--accent-ink); text-decoration:underline}
.dirhero__row{display:flex; align-items:center; gap:.6rem}
.dirhero__row svg{flex:none; width:17px; height:17px; fill:var(--green-mid)}

.varlist{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem}
.varpill{
  padding:1.05rem 1.15rem; background:var(--surface); border:1px solid var(--line);
  border-left:4px solid var(--green-mid); border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  transition:transform .18s var(--ease), box-shadow .18s, border-left-color .18s;
}
.varpill:hover{transform:translateY(-2px); box-shadow:var(--shadow-2); border-left-color:var(--gold)}
.varpill__n{
  margin:0; font-family:var(--font-display); font-weight:700; font-size:1.02rem; color:var(--accent-ink);
}
.varpill__t{margin:.4rem 0 0; color:var(--ink-soft); font-size:.86rem; line-height:1.6}

@media (max-width:1000px){ .varlist{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:820px){
  .dirhero{grid-template-columns:1fr; gap:1.5rem; padding:1.4rem}
  .dirhero__fig{max-width:270px}
}
@media (max-width:560px){ .varlist{grid-template-columns:1fr} }

/* ---------- 17a. Former directors — tenure list ---------- */
.eraband{
  display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:.6rem 1.2rem;
  padding:1rem 1.4rem; border-radius:var(--r-lg) var(--r-lg) 0 0;
  background:linear-gradient(160deg,var(--green),var(--green-deep)); color:#fff;
}
.eraband__t{
  margin:0; font-family:var(--font-display); font-weight:700; font-size:1.06rem; color:#fff;
}
.eraband__m{
  margin:0; font-family:var(--font-display); font-weight:700; font-size:.76rem;
  text-transform:uppercase; letter-spacing:.09em; color:var(--gold);
}
.tenurelist{
  display:grid; gap:0; border:1px solid var(--line); border-top:0;
  border-radius:0 0 var(--r-lg) var(--r-lg); overflow:hidden; box-shadow:var(--shadow-1);
}
.tenure{
  display:grid; grid-template-columns:44px minmax(0,1fr) auto; gap:1rem; align-items:center;
  padding:.95rem 1.4rem; background:var(--surface); border-top:1px solid var(--line);
  transition:background .16s;
}
.tenure:first-child{border-top:0}
.tenure:nth-child(even){background:var(--green-wash-2,#f7faf5)}
.tenure:hover{background:var(--green-wash)}
.tenure__n{
  display:grid; place-items:center; width:32px; height:32px; border-radius:50%;
  background:var(--green-wash); color:var(--accent-ink);
  font-family:var(--font-display); font-weight:800; font-size:.82rem;
}
.tenure__name{
  margin:0; font-family:var(--font-display); font-weight:700; font-size:1rem;
  color:var(--accent-ink); line-height:1.35;
}
.tenure__tag{
  display:inline-block; margin-left:.5rem; padding:.14rem .55rem; border-radius:999px;
  background:var(--gold); color:#fff;
  font-family:var(--font-display); font-weight:700; font-size:.66rem;
  text-transform:uppercase; letter-spacing:.08em; vertical-align:middle;
}
.tenure__period{
  margin:0; font-family:var(--font-display); font-weight:600; font-size:.9rem;
  color:var(--ink-soft); white-space:nowrap;
}
@media (max-width:640px){
  .tenure{grid-template-columns:32px minmax(0,1fr); gap:.7rem; padding:.85rem 1rem}
  .tenure__period{grid-column:2; margin-top:.15rem; font-size:.85rem}
  .eraband{padding:.9rem 1rem}
}

/* ---------- 17b. Masthead: single centred logo lockup ---------- */
/* The emblem + four-line title block is replaced by the official horizontal lockup.
   Flex (not grid) with an empty left item: both side items take `flex:1 1 0` with
   `min-width:0`, so they always share the leftover space equally and the logo sits
   dead centre. A `1fr auto 1fr` grid does NOT work here — the search box's
   min-content width inflates the right column and pushes the logo off centre. */
.masthead__inner{
  display:flex; align-items:center; gap:1rem 1.3rem;
  padding:1.05rem 0 1.15rem;
}
.masthead__spacer{display:block; flex:1 1 0; min-width:0}
/* The anchor itself carries the width. If only the <img> is sized with a percentage,
   the anchor takes its full max-content width and pushes the Menu button onto its own
   row on mobile. The mobile caps subtract room for the hamburger. */
.brandmark{flex:0 0 auto; display:block; width:clamp(260px,33vw,480px); max-width:100%; transition:transform .3s var(--ease)}
.brandmark img,
.brandmark__logo{display:block; width:100%; height:auto; object-fit:contain}
.masthead__right{flex:1 1 0; min-width:0; display:flex; justify-content:flex-end}
.masthead__right .searchbox{max-width:100%}
.masthead__right .searchbox input{width:100%; max-width:250px; min-width:0}

@media (max-width:1180px){
  .masthead__inner{flex-wrap:wrap; padding:.9rem 0 1rem}
  .masthead__spacer{display:none}
  .brandmark{width:min(400px,calc(100% - 125px))}
  .navtoggle{flex:0 0 auto; margin-left:auto}
  .masthead__right{flex:0 0 100%; order:3; justify-content:stretch}
  .masthead__right .searchbox{width:100%}
  .masthead__right .searchbox input{max-width:none}
}
@media (max-width:640px){
  .brandmark{width:min(300px,calc(100% - 125px))}
}
@media (max-width:430px){
  .brandmark{width:min(230px,calc(100% - 125px))}
}

/* ---------- 17c. Cadre strength ---------- */
.cadregrid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.2rem}
.cadrecard{
  padding:1.3rem 1.4rem; background:var(--surface); border:1px solid var(--line);
  border-top:4px solid var(--green-mid); border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  transition:transform .18s var(--ease), box-shadow .18s, border-top-color .18s;
}
.cadrecard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-top-color:var(--gold)}
.cadrecard__t{
  margin:0 0 .9rem; font-family:var(--font-display); font-weight:700;
  font-size:1.05rem; color:var(--accent-ink);
}
.cadrebar{
  display:flex; height:12px; border-radius:999px; overflow:hidden;
  background:var(--green-wash); border:1px solid var(--line);
}
.cadrebar__f{background:linear-gradient(90deg,var(--green),var(--green-deep))}
.cadrebar__v{background:repeating-linear-gradient(45deg,#e6ded0,#e6ded0 5px,#efe9df 5px,#efe9df 10px)}
.cadrekeys{display:flex; flex-wrap:wrap; gap:.4rem 1.3rem; margin:.85rem 0 0}
.cadrekey{display:flex; align-items:baseline; gap:.4rem; font-size:.88rem; color:var(--muted)}
.cadrekey b{font-family:var(--font-display); font-weight:800; font-size:1.05rem; color:var(--accent-ink)}
.cadrekey--v b{color:var(--gold-deep,#b8860b)}
.cadrecard__pc{
  margin:.75rem 0 0; font-family:var(--font-display); font-weight:700;
  font-size:.8rem; text-transform:uppercase; letter-spacing:.07em; color:var(--muted);
}
@media (max-width:1000px){ .cadregrid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){ .cadregrid{grid-template-columns:1fr} }

/* ---------- 17d. Masthead logo at full available width ---------- */
/* The lockup is 700x132 with no padding of its own, so it is shown at its
   native width on desktop (sharp, no upscaling) and allowed to fill the whole
   row on every narrower screen. object-fit:contain keeps it uncropped. */
.brandmark{flex:0 1 auto; width:700px; max-width:100%}
@media (max-width:1180px){
  .brandmark{width:calc(100% - 118px); max-width:700px}
}
@media (max-width:640px){
  .brandmark{width:calc(100% - 112px)}
}
@media (max-width:430px){
  .brandmark{width:calc(100% - 106px)}
}

/* ---------- 17e. Masthead: logo left, search right ---------- */
/* Replaces the centred arrangement: the spacer that balanced the logo is gone,
   so the lockup sits flush at the start of the wrap at its full native width. */
.masthead__spacer{display:none}

/* ---------- 17f. Genesis ---------- */
.tline{position:relative; margin:0; padding:0 0 0 2.6rem; list-style:none}
.tline::before{
  content:""; position:absolute; left:.72rem; top:.55rem; bottom:.55rem; width:2px;
  background:linear-gradient(180deg,var(--green-mid),var(--green-deep));
}
.tstep{position:relative; padding:0 0 1.9rem}
.tstep:last-child{padding-bottom:0}
.tstep::before{
  content:""; position:absolute; left:-2.6rem; top:.5rem; width:1.5rem; height:1.5rem;
  border-radius:50%; background:var(--surface);
  border:3px solid var(--green); box-shadow:0 0 0 4px var(--green-wash);
}
.tstep__y{
  display:inline-block; margin:0 0 .45rem; padding:.2rem .75rem;
  font-family:var(--font-display); font-weight:800; font-size:.92rem; letter-spacing:.04em;
  color:#fff; background:var(--green-deep); border-radius:999px;
}
.tstep__y--soft{background:var(--gold-deep)}
.tstep__t{margin:0; color:var(--ink-soft); line-height:1.75}

/* Pulses Research Network */
.pnet{display:grid; gap:1.1rem; justify-items:center}
.pnet__top{
  padding:.85rem 2.2rem; text-align:center; border-radius:999px;
  background:linear-gradient(135deg,var(--green-deep),var(--green));
  color:#fff; font-family:var(--font-display); font-weight:800; font-size:1.12rem;
  box-shadow:var(--shadow-2);
}
.pnet__fork{width:100%; height:36px; position:relative}
/* stem down from the pill, then a bar that splits to a leg above each branch */
.pnet__fork::before{content:""; position:absolute; top:0; left:50%; margin-left:-1px; width:2px; height:18px; background:var(--green-mid)}
.pnet__fork::after{content:""; position:absolute; top:17px; left:25%; right:25%; height:2px; background:var(--green-mid)}
.pnet__fork span{content:""; position:absolute; top:17px; width:2px; height:19px; background:var(--green-mid)}
.pnet__fork span:first-child{left:25%}
.pnet__fork span:last-child{left:75%}
.pnet__cols{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.4rem; width:100%; align-items:start}
.pbranch{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1); overflow:hidden;
}
.pbranch__h{
  margin:0; padding:.85rem 1.2rem; text-align:center;
  background:var(--green-wash); border-bottom:1px solid var(--line);
  font-family:var(--font-display); font-weight:800; font-size:1.02rem; color:var(--accent-ink);
}
.pbranch__l{margin:0; padding:.5rem .6rem 1rem; list-style:none}
.pbranch__l li{
  display:flex; align-items:baseline; gap:.7rem;
  padding:.62rem .8rem; border-radius:var(--r-sm); color:var(--ink-soft); line-height:1.55;
}
.pbranch__l li + li{border-top:1px solid var(--line-soft)}
.pbranch__l b{font-family:var(--font-display); font-weight:800; color:var(--accent-ink)}
.pbranch__y{
  margin-left:auto; flex:none; font-family:var(--font-display); font-weight:700;
  font-size:.85rem; color:var(--accent-warm);
}
@media (max-width:720px){
  .pnet__cols{grid-template-columns:1fr}
  .pnet__fork{display:none}
}

/* ---------- 17g. Vision & Mandate ---------- */
.vstate{
  position:relative; padding:3.1rem clamp(1.6rem,5vw,4.2rem);
  background:linear-gradient(135deg,var(--green-deep) 0%,var(--green) 62%,var(--green-mid) 100%);
  border-radius:var(--r-xl); box-shadow:var(--shadow-3); overflow:hidden;
}
.vstate::after{
  content:""; position:absolute; right:-70px; bottom:-90px; width:290px; height:290px;
  border-radius:50%; background:rgba(255,255,255,.06);
}
.vstate__q{
  display:block; font-family:var(--font-display); font-weight:800;
  font-size:clamp(3rem,7vw,5rem); line-height:.7; color:var(--gold); opacity:.85;
}
.vstate__t{
  position:relative; z-index:1; margin:.6rem 0 0;
  font-family:var(--font-display); font-weight:600; color:#fff;
  font-size:clamp(1.18rem,2.3vw,1.75rem); line-height:1.62; letter-spacing:.002em;
}
.vstate__rule{
  position:relative; z-index:1; display:block; width:82px; height:4px; margin:1.7rem 0 0;
  border-radius:999px; background:var(--gold);
}
.vstate__by{
  position:relative; z-index:1; margin:.85rem 0 0;
  font-size:.9rem; letter-spacing:.09em; text-transform:uppercase;
  font-weight:700; color:rgba(255,255,255,.8);
}

.mandgrid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem}
.mandcard{
  display:flex; gap:1.15rem; padding:1.5rem 1.6rem;
  background:var(--surface); border:1px solid var(--line);
  border-top:4px solid var(--green-mid); border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  transition:transform .18s var(--ease), box-shadow .18s, border-top-color .18s;
}
.mandcard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-top-color:var(--gold)}
.mandcard__n{
  flex:none; width:2.7rem; height:2.7rem; display:grid; place-items:center;
  border-radius:50%; background:var(--green-wash); color:var(--accent-ink);
  font-family:var(--font-display); font-weight:800; font-size:1.05rem;
}
.mandcard__t{margin:.35rem 0 0; color:var(--ink-soft); line-height:1.75}

.croplist{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.9rem}
.croppill{
  display:flex; align-items:center; gap:.8rem; padding:.9rem 1.1rem;
  background:var(--surface); border:1px solid var(--line); border-radius:999px;
  box-shadow:var(--shadow-1); transition:transform .18s var(--ease), box-shadow .18s, border-color .18s;
}
.croppill:hover{transform:translateY(-2px); box-shadow:var(--shadow-2); border-color:var(--green-mid)}
.croppill__n{
  flex:none; width:1.75rem; height:1.75rem; display:grid; place-items:center; border-radius:50%;
  background:var(--green-deep); color:#fff;
  font-family:var(--font-display); font-weight:700; font-size:.78rem;
}
.croppill__t{font-family:var(--font-display); font-weight:600; color:var(--accent-ink); font-size:.98rem}
@media (max-width:1000px){ .croplist{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:760px){ .mandgrid{grid-template-columns:1fr} .croplist{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:400px){ .croplist{grid-template-columns:1fr} }

/* ---------- 17h. Committee membership ---------- */
.memgrid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem}
.memcard{
  display:flex; flex-direction:column; padding:1.35rem 1.5rem;
  background:var(--surface); border:1px solid var(--line);
  border-left:4px solid var(--green-mid); border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  transition:transform .18s var(--ease), box-shadow .18s, border-left-color .18s;
}
.memcard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-left-color:var(--gold)}
.memcard--chair{border-left-color:var(--gold)}
.memcard__top{display:flex; align-items:flex-start; gap:1rem; flex-wrap:wrap}
.memcard__name{
  margin:0; flex:1 1 auto; min-width:0;
  font-family:var(--font-display); font-weight:700; font-size:1.06rem; color:var(--accent-ink);
}
.memcard__role{
  flex:none; padding:.28rem .8rem; border-radius:999px;
  font-family:var(--font-display); font-weight:700; font-size:.76rem;
  letter-spacing:.05em; text-transform:uppercase;
  color:var(--accent-ink); background:var(--green-wash); border:1px solid var(--line);
}
.memcard__role--chair{color:#fff; background:var(--green-deep); border-color:var(--green-deep)}
.memcard__role--sec{color:#fff; background:var(--gold-deep); border-color:var(--gold-deep)}
.memcard__aff{margin:.7rem 0 0; color:var(--ink-soft); line-height:1.7; font-size:.95rem}
@media (max-width:760px){ .memgrid{grid-template-columns:1fr} }

/* ---------- 17i. Extra committee role pills ---------- */
.memcard__role--exo{color:var(--accent-ink-2); background:#fff; border-color:var(--green-mid)}
.memcard__role--nonoff{color:var(--accent-warm); background:#fdf6e6; border-color:#eed9a8}
.memcard--exo{border-left-color:var(--green)}
.memcard--nonoff{border-left-color:var(--gold)}
.memcard__n{
  flex:none; align-self:flex-start; min-width:1.7rem; height:1.7rem; padding:0 .4rem;
  display:grid; place-items:center; border-radius:999px;
  background:var(--green-wash); color:var(--accent-ink);
  font-family:var(--font-display); font-weight:800; font-size:.8rem;
}

/* ---------- 17j. Long unbroken tokens in committee cards ---------- */
/* Source text carries slash-joined runs like "crop(s)/divisions/programmes/
   commodity/livestock" with no space; without this they push the card wider
   than the viewport on small screens. */
/* overflow-wrap:anywhere (not break-word) — only "anywhere" also shrinks the
   element's min-content size, which is what the grid track measures. */
.mandcard__t,.memcard__name,.memcard__aff,.tstep__t{overflow-wrap:anywhere; min-width:0}
@media (max-width:760px){ .mandgrid{grid-template-columns:minmax(0,1fr)} }

/* ---------- 17k. Publication archives (Annual Report, Newsletter) ---------- */
.pubfeat{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:1.3rem}
.pubfeat__card{
  display:flex; flex-direction:column; gap:.85rem; min-width:0;
  padding:1.75rem 1.85rem; border-radius:var(--r-lg); text-decoration:none;
  background:linear-gradient(160deg,var(--green),var(--green-deep)); color:#fff;
  box-shadow:var(--shadow-2);
  transition:transform .18s var(--ease), box-shadow .18s;
}
.pubfeat__card:hover{transform:translateY(-3px); box-shadow:var(--shadow-3)}
.pubfeat__tag{
  align-self:flex-start; padding:.24rem .75rem; border-radius:999px;
  background:var(--gold); color:#3d2b00;
  font-family:var(--font-display); font-weight:800; font-size:.66rem;
  letter-spacing:.12em; text-transform:uppercase;
}
.pubfeat__y{
  margin:0; font-family:var(--font-display); font-weight:800;
  font-size:2.3rem; line-height:1.1; letter-spacing:-.02em; overflow-wrap:anywhere;
}
.pubfeat__t{margin:0; font-size:1rem; line-height:1.6; color:rgba(255,255,255,.92); overflow-wrap:anywhere}
.pubfeat__go{
  margin-top:.4rem; display:inline-flex; align-items:center; gap:.45rem;
  font-family:var(--font-display); font-weight:700; font-size:.8rem;
  letter-spacing:.08em; text-transform:uppercase; color:var(--gold);
}

.yearlist{display:grid; gap:.85rem}
.yearblock{
  display:grid; grid-template-columns:150px minmax(0,1fr); gap:1.3rem; align-items:center;
  padding:1.1rem 1.35rem; background:var(--surface);
  border:1px solid var(--line); border-left:4px solid var(--green-mid);
  border-radius:var(--r-lg); box-shadow:var(--shadow-1);
  transition:box-shadow .18s, border-left-color .18s;
}
.yearblock:hover{box-shadow:var(--shadow-2); border-left-color:var(--gold)}
.yearblock__y{
  margin:0; font-family:var(--font-display); font-weight:800;
  font-size:1.28rem; line-height:1.2; color:var(--accent-ink); letter-spacing:-.01em;
}
.yearblock__n{
  display:block; margin-top:.2rem; font-family:var(--font-display); font-weight:700;
  font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted);
}
.issues{display:flex; flex-wrap:wrap; gap:.55rem; min-width:0}
.issue{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.5rem .95rem; border-radius:999px;
  background:var(--green-wash); border:1px solid var(--line);
  color:var(--accent-ink); text-decoration:none;
  font-family:var(--font-display); font-weight:700; font-size:.85rem;
  transition:background .18s, color .18s, border-color .18s, transform .18s var(--ease);
}
.issue::before{
  content:""; flex:none; width:13px; height:15px; background:currentColor;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-size:contain; mask-size:contain;
  -webkit-mask-position:center; mask-position:center;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zm2 16H8v-2h8v2zm0-4H8v-2h8v2zm-3-5V3.5L18.5 9H13z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zm2 16H8v-2h8v2zm0-4H8v-2h8v2zm-3-5V3.5L18.5 9H13z'/%3E%3C/svg%3E");
}
.issue:hover{background:var(--green-deep); border-color:var(--green-deep); color:#fff; transform:translateY(-2px)}
.issue__lang{
  padding:.08rem .42rem; border-radius:4px; background:rgba(15,77,46,.1);
  font-size:.66rem; letter-spacing:.06em; text-transform:uppercase;
}
.issue:hover .issue__lang{background:rgba(255,255,255,.2)}
@media (max-width:700px){
  .yearblock{grid-template-columns:minmax(0,1fr); gap:.75rem; align-items:start}
  .pubfeat__y{font-size:1.9rem}
}

/* ---------- 17l. Book cards (Publications > Books) ---------- */
.bookgrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr)); gap:1.3rem}
.bookcard{
  position:relative; display:flex; flex-direction:column; min-width:0; overflow:hidden;
  padding:1.5rem 1.6rem 1.35rem 2.15rem; text-decoration:none;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1);
  transition:transform .18s var(--ease), box-shadow .18s, border-color .18s;
}
.bookcard::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:9px;
  background:linear-gradient(180deg,var(--green-mid),var(--green-deep));
  transition:background .18s;
}
.bookcard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-color:var(--green-mid)}
.bookcard:hover::before{background:linear-gradient(180deg,var(--gold),var(--gold-deep))}
.bookcard__t{
  margin:0 0 1.1rem; font-family:var(--font-display); font-weight:700;
  font-size:1.05rem; line-height:1.45; color:var(--accent-ink); overflow-wrap:anywhere;
}
.bookcard__foot{
  margin-top:auto; display:flex; align-items:center; justify-content:space-between;
  gap:.7rem; flex-wrap:wrap;
}
.bookcard__type{
  flex:none; padding:.3rem .72rem; border-radius:999px;
  background:var(--green-wash); border:1px solid var(--line); color:var(--accent-ink);
  font-family:var(--font-display); font-weight:700; font-size:.68rem;
  letter-spacing:.09em; text-transform:uppercase;
}
.bookcard__type--web{background:#fdf6e6; border-color:#eed9a8; color:var(--accent-warm)}
.bookcard__go{
  flex:none; font-family:var(--font-display); font-weight:700; font-size:.74rem;
  letter-spacing:.08em; text-transform:uppercase; color:var(--accent-ink-2);
  transition:color .18s;
}
.bookcard:hover .bookcard__go{color:var(--accent-warm)}

/* ---------- 17m. Year archive, card-grid variant ----------
   The row layout in 17k suits the newsletter, where every year carries four
   quarter pills and fills the line. The annual reports carry only one or two
   editions a year, so a full-width row leaves most of it empty — these years
   are laid out as a grid of compact cards instead. */
.yearlist--cols{grid-template-columns:repeat(auto-fill,minmax(min(100%,252px),1fr)); gap:1.1rem}
.yearlist--cols .yearblock{
  grid-template-columns:minmax(0,1fr); align-items:start;
  gap:.9rem; padding:1.3rem 1.4rem;
}
.yearlist--cols .yearblock__head{
  display:flex; align-items:baseline; justify-content:space-between; gap:.6rem; flex-wrap:wrap;
  padding-bottom:.8rem; border-bottom:1px dashed var(--line-soft,var(--line));
}
.yearlist--cols .yearblock__y{font-size:1.55rem}
.yearlist--cols .yearblock__n{margin-top:0}
.yearlist--cols .issue{font-size:.82rem; padding:.46rem .82rem}

/* ---------- 17n. Document pages (Vision 2050, IIPR At a Glance) ---------- */
.doclead{display:grid; grid-template-columns:290px minmax(0,1fr); gap:2.2rem; align-items:start}
.doccover{
  position:relative; display:flex; flex-direction:column; gap:.65rem; overflow:hidden;
  aspect-ratio:1/1.414; padding:1.7rem 1.5rem 1.5rem 1.75rem;
  border-radius:var(--r-lg); box-shadow:var(--shadow-3); color:#fff;
  background:linear-gradient(165deg,var(--green),var(--green-deep));
}
.doccover::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:10px;
  background:linear-gradient(180deg,var(--gold),var(--gold-deep));
}
.doccover__org{
  font-family:var(--font-display); font-weight:800; font-size:.63rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--gold); line-height:1.5;
}
.doccover__t{
  margin:.2rem 0 0; font-family:var(--font-display); font-weight:800;
  font-size:2.15rem; line-height:1.06; letter-spacing:-.025em; overflow-wrap:anywhere;
}
.doccover__rule{width:52px; height:3px; border-radius:2px; background:var(--gold)}
.doccover__sub{margin:0; font-size:.9rem; line-height:1.6; color:rgba(255,255,255,.88)}
.doccover__foot{
  margin:auto 0 0; font-size:.74rem; line-height:1.6;
  color:rgba(255,255,255,.7); letter-spacing:.02em;
}

.docmeta{margin:1.5rem 0 1.7rem; border-top:1px solid var(--line)}
.docmeta__row{
  display:grid; grid-template-columns:180px minmax(0,1fr); gap:1rem;
  padding:.72rem .1rem; border-bottom:1px solid var(--line);
}
.docmeta__k{
  font-family:var(--font-display); font-weight:700; font-size:.71rem;
  letter-spacing:.09em; text-transform:uppercase; color:var(--muted); padding-top:.15rem;
}
.docmeta__v{color:var(--ink-soft); font-size:.95rem; line-height:1.65; overflow-wrap:anywhere}
.docact{display:flex; flex-wrap:wrap; gap:.75rem}
.btn--ghost{
  background:transparent; color:var(--accent-ink);
  border:1.5px solid var(--green-mid); box-shadow:none;
}
.btn--ghost:hover{background:var(--green-wash); filter:none}

.pdfbox{
  border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden;
  box-shadow:var(--shadow-2); background:var(--surface);
}
.pdfbox__bar{
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  padding:.85rem 1.25rem; background:var(--green-deep); color:#fff;
}
.pdfbox__name{
  font-family:var(--font-display); font-weight:700; font-size:.9rem;
  display:flex; align-items:center; gap:.55rem; min-width:0; overflow-wrap:anywhere;
}
.pdfbox__open{
  flex:none; color:var(--gold); text-decoration:none;
  font-family:var(--font-display); font-weight:700; font-size:.74rem;
  letter-spacing:.09em; text-transform:uppercase;
}
.pdfbox__open:hover{color:#fff}
.pdfbox iframe{display:block; width:100%; height:min(78vh,840px); border:0; background:#f2f4f1}
.pdfbox__note{
  margin:0; padding:.8rem 1.25rem; border-top:1px solid var(--line);
  color:var(--muted); font-size:.85rem; line-height:1.6;
}
@media (max-width:900px){
  .doclead{grid-template-columns:minmax(0,1fr); gap:1.6rem}
  .doccover{max-width:290px}
  .pdfbox iframe{height:min(68vh,600px)}
}
@media (max-width:520px){
  .docmeta__row{grid-template-columns:minmax(0,1fr); gap:.2rem}
  .doccover__t{font-size:1.8rem}
}

/* ---------- 17o. Hindi-edition pill on book/bulletin cards ---------- */
.bookcard__type--hi{background:#fdf6e6; border-color:#eed9a8; color:var(--accent-warm)}

/* ---------- 17p. Gene Bank ---------- */
.gbbar{
  display:inline-block; vertical-align:middle; width:min(160px,42vw); height:9px;
  border-radius:999px; background:var(--green-wash); border:1px solid var(--line);
  overflow:hidden;
}
.gbbar__f{display:block; height:100%; background:linear-gradient(90deg,var(--green-mid),var(--green-deep))}
.gbbar__pc{
  margin-left:.6rem; font-family:var(--font-display); font-weight:700;
  font-size:.82rem; color:var(--muted); white-space:nowrap;
}

.gbgrid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem; align-items:start}
.gbblock{min-width:0}
.gbblock__h{
  display:flex; align-items:baseline; justify-content:space-between; gap:.8rem; flex-wrap:wrap;
  margin:0 0 .8rem; padding-bottom:.55rem; border-bottom:2px solid var(--green-mid);
  font-family:var(--font-display); font-weight:700; font-size:1.06rem; color:var(--accent-ink);
}
.gbblock__h span{
  flex:none; font-size:.68rem; font-weight:700; letter-spacing:.09em;
  text-transform:uppercase; color:var(--muted);
}
.gbnote{
  margin:.75rem 0 0; padding:.7rem .9rem; border-radius:var(--r-md);
  background:#fdf6e6; border:1px solid #eed9a8;
  color:var(--accent-warm); font-size:.85rem; line-height:1.6;
}

.gbshots{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.3rem}
.gbshots img{
  display:block; width:100%; height:100%; aspect-ratio:4/3; object-fit:cover;
  border-radius:var(--r-lg); border:1px solid var(--line); box-shadow:var(--shadow-2);
}
@media (max-width:900px){
  .gbgrid{grid-template-columns:minmax(0,1fr)}
  .gbshots{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  .gbbar{width:min(90px,30vw)}
  .gbbar__pc{margin-left:.4rem; font-size:.76rem}
}

/* ---------- 17q. Facility photo galleries and tariff tables ---------- */
.gallery{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:1.3rem}
.gallery img{
  display:block; width:100%; aspect-ratio:4/3; object-fit:cover;
  border-radius:var(--r-lg); border:1px solid var(--line); box-shadow:var(--shadow-2);
}
.gallery__wide{grid-column:1/-1; aspect-ratio:auto}
.gallery img.gallery__wide{aspect-ratio:3.44/1}

.dtable th.dtable__rate,
.dtable td.dtable__rate{
  text-align:right; white-space:nowrap;
  font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1;
}
.rate--na{color:var(--muted)}
@media (max-width:700px){
  .gallery img.gallery__wide{aspect-ratio:2.4/1}
}

/* Fixed two-column gallery, so a full-width photo does not strand the row below it. */
.gallery--2{grid-template-columns:repeat(2,minmax(0,1fr))}
/* Three cards across, rather than two plus a widow. */
.mandgrid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){
  .mandgrid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:620px){
  .gallery--2{grid-template-columns:minmax(0,1fr)}
  .mandgrid--3{grid-template-columns:minmax(0,1fr)}
}

/* ---------- 17r. Captioned equipment shots and instrument chips ---------- */
.shots{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr)); gap:1.2rem}
.shots figure{
  margin:0; display:flex; flex-direction:column; overflow:hidden;
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-lg); box-shadow:var(--shadow-1);
}
/* These are small source photographs, so they are contained rather than cropped. */
.shots img{
  display:block; width:100%; height:190px; object-fit:contain;
  background:var(--green-wash); padding:.55rem;
}
.shots figcaption{
  padding:.8rem 1rem; border-top:1px solid var(--line);
  font-family:var(--font-display); font-weight:700; font-size:.85rem;
  line-height:1.45; color:var(--accent-ink);
}

.chips__lead{margin:1.6rem 0 .8rem; color:var(--muted); font-size:.92rem}
.chips{display:flex; flex-wrap:wrap; gap:.55rem; margin:0; padding:0; list-style:none}
.chips li{
  padding:.45rem .9rem; border-radius:999px;
  background:var(--surface); border:1px solid var(--line);
  font-size:.85rem; line-height:1.4; color:var(--ink-soft); box-shadow:var(--shadow-1);
}
.chips--solid li{
  background:var(--green-deep); border-color:var(--green-deep); color:#fff;
  font-family:var(--font-display); font-weight:700;
}
@media (max-width:520px){
  .shots{grid-template-columns:minmax(0,1fr)}
  .shots img{height:210px}
}

/* ---------- 17s. Masthead: static logo, wider search field ---------- */
/* The lockup no longer grows on hover — it is an identity mark, not a control. */
.brandmark,
.brandmark:hover{transform:none; transition:none}

/* Below 1180px the field already spans the row, so only widen it on desktop. */
@media (min-width:1181px){
  .masthead__right .searchbox input,
  .searchbox input{width:380px; max-width:none}
}

/* ---------- 17t. Notice tables: document links and the "New" flag ---------- */
.doclink{color:var(--accent-ink); font-weight:600; text-decoration:none}
.doclink:hover{color:var(--accent-warm); text-decoration:underline}
.newpill{
  display:inline-block; margin-left:.55rem; padding:.12rem .55rem; border-radius:999px;
  background:var(--gold); border:1px solid var(--gold-deep); color:var(--accent-warm);
  font-family:var(--font-display); font-weight:800; font-size:.64rem;
  letter-spacing:.09em; text-transform:uppercase; vertical-align:middle;
}

/* ---------- 17u. Statutory documents: conditions, form fields, signatures ---------- */
/* Numbered conditions of an agreement — long prose, so a list, not cards. */
.terms{counter-reset:term; list-style:none; margin:0; padding:0; display:grid; grid-template-columns:minmax(0,1fr); gap:1rem}
.terms li{
  counter-increment:term; position:relative;
  padding:1.3rem 1.5rem 1.3rem 3.9rem;
  background:var(--surface); border:1px solid var(--line);
  border-left:3px solid var(--green-mid); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1);
  color:var(--ink-soft); font-size:.97rem; line-height:1.8;
  overflow-wrap:break-word; min-width:0;
}
.terms li::before{
  content:counter(term); position:absolute; left:1.15rem; top:1.3rem;
  width:1.8rem; height:1.8rem; border-radius:50%;
  background:var(--green-deep); color:#fff;
  display:grid; place-items:center;
  font-family:var(--font-display); font-weight:800; font-size:.78rem;
}

/* A blank on a printed form, shown as a rule rather than left empty. */
.fillcell{display:block; min-width:8rem; height:1.2rem; border-bottom:1px dashed var(--line)}
/* The same blank, but sitting inline inside a sentence. */
.blankline{
  display:inline-block; vertical-align:baseline;
  width:min(100%,24rem); height:1.05em; margin:0 .15rem;
  border-bottom:1px dashed var(--line);
}

.ticklist{list-style:none; margin:0; padding:0; display:grid; gap:.45rem}
.ticklist li{position:relative; padding-left:1.15rem; font-size:.93rem; line-height:1.6; color:var(--ink-soft)}
.ticklist li::before{
  content:""; position:absolute; left:0; top:.6em;
  width:.42rem; height:.42rem; border-radius:50%; background:var(--gold-deep);
}

.signgrid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem}
.signcard{
  background:var(--surface); border:1px solid var(--line);
  border-top:4px solid var(--gold); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1); padding:1.5rem 1.6rem;
}
.signcard__h{
  margin:0 0 .25rem; font-family:var(--font-display); font-weight:800;
  font-size:.68rem; letter-spacing:.13em; text-transform:uppercase; color:var(--accent-warm);
}
.signcard__r{
  margin:0 0 1.25rem; font-family:var(--font-display); font-weight:700;
  font-size:1.05rem; line-height:1.35; color:var(--accent-ink);
}
.signfields{list-style:none; margin:0; padding:0; display:grid; gap:1rem}
.signfields li{display:grid; gap:.4rem}
.signfields span{font-size:.8rem; line-height:1.45; color:var(--muted)}
.signfields i{display:block; height:0; border-bottom:1px dashed var(--line)}

/* A quoted extract from a statute. */
.lawbox{
  background:var(--surface); border:1px solid var(--line);
  border-left:3px solid var(--gold); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1); padding:1.7rem 1.9rem;
}
.alist{
  list-style:lower-alpha; margin:0; padding-left:1.5rem;
  display:grid; gap:.9rem; color:var(--ink-soft); font-size:.97rem; line-height:1.8;
}
.alist>li::marker{color:var(--accent-ink); font-weight:700}
.alist ol{list-style:lower-roman; margin:.9rem 0 0; padding-left:1.5rem; display:grid; gap:.6rem}
.alist ol>li::marker{color:var(--accent-warm); font-weight:700}

@media (max-width:760px){
  .signgrid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:520px){
  .terms li{padding:1.15rem 1.15rem 1.15rem 3.4rem; font-size:.94rem}
  .terms li::before{left:.9rem; top:1.15rem}
  .lawbox{padding:1.3rem 1.35rem}
}

/* ---------- 17w. Policy reading column, contact cards, embedded map ---------- */
/* Statutory prose reads better in a narrower measure than the full grid. */
.wrap--read{width:min(100% - 2.2rem, 960px)}

.contactgrid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.2rem}
.contactgrid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ccard{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:1.9rem 1.5rem;
  background:var(--surface); border:1px solid var(--line);
  border-top:4px solid var(--green-mid); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1); transition:transform .25s var(--ease), box-shadow .25s var(--ease);
}
.ccard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-top-color:var(--gold)}
.ccard__ico{
  width:54px; height:54px; margin-bottom:1.05rem; border-radius:50%;
  display:grid; place-items:center;
  background:var(--green-wash); color:var(--accent-ink);
}
.ccard__ico svg{width:23px; height:23px; fill:currentColor}
.ccard__t{
  margin:0 0 .6rem; font-family:var(--font-display); font-weight:800;
  font-size:.72rem; letter-spacing:.13em; text-transform:uppercase; color:var(--accent-warm);
}
.ccard__v{color:var(--ink-soft); font-size:.95rem; line-height:1.7; overflow-wrap:break-word; min-width:0}
.ccard__v p{margin:0 0 .3rem}
.ccard__v p:last-child{margin-bottom:0}
.ccard__v a{color:var(--accent-ink); font-weight:600; text-decoration:none}
.ccard__v a:hover{color:var(--accent-warm); text-decoration:underline}

.mapwrap{
  overflow:hidden; border:1px solid var(--line);
  border-radius:var(--r-lg); box-shadow:var(--shadow-2); background:var(--green-wash);
}
.mapwrap iframe{display:block; width:100%; height:440px; border:0}

@media (max-width:1000px){
  .contactgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  .contactgrid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  .contactgrid,
  .contactgrid--3{grid-template-columns:minmax(0,1fr)}
  .mapwrap iframe{height:340px}
}

/* ---------- 17x. Full-bleed hero band ---------- */
/* The hero and the announcements strip run edge to edge and sit flush under
   the navigation, as one banner band. Their inner content still lines up with
   the site content column, so nothing looks adrift on a wide monitor. */
.hero{width:100%; margin:0}
.hero__viewport{
  width:100%; border-radius:0; box-shadow:none;
  /* The banner artwork is 2000x810, so the ratio is kept and only capped. */
  height:auto; max-height:min(78vh,720px);
}
.hero__caption{
  width:min(100% - 2.2rem, var(--wrap));
  max-width:none; margin-inline:auto;
}
.hero__caption .hero__title{max-width:660px}
.hero__nav--prev{left:clamp(1rem,3.2vw,2.6rem)}
.hero__nav--next{right:clamp(1rem,3.2vw,2.6rem)}

.ticker{
  width:100%; margin:0; border-radius:0; box-shadow:none;
  border-left:0; border-right:0; border-top:0;
  padding-inline:max(1.1rem, calc((100% - var(--wrap)) / 2));
}
.ticker__label{border-radius:0}

@media (max-width:1180px){
  .hero__viewport{max-height:min(70vh,560px)}
}
@media (max-width:960px){
  .hero{margin:0}
  .hero__viewport{border-radius:0; max-height:none}
  .ticker{border-radius:0; padding-inline:0}
  .ticker__label{border-radius:0}
}

/* ---------- 17y. Announcements band ---------- */
/* A white full-bleed strip left the green label floating with white beside it.
   The strip is now a solid band in the institute green, so the label reads as
   part of it and the row anchors the hero to the content below. */
.ticker{
  background:var(--green-deep);
  border:0; border-top:3px solid var(--gold);
  min-height:56px;
}
.ticker__label{
  align-self:stretch; display:flex; align-items:center;
  background:var(--gold); color:#3a2600;
  font-size:.74rem; letter-spacing:.1em; padding:.85rem 1.3rem;
}
/* The live dot has to read against gold, not against green. */
.ticker__pulse{
  background:var(--green-deep);
  box-shadow:0 0 0 0 rgba(15,77,46,.55); animation:pulseDark 1.8s infinite;
}
@keyframes pulseDark{
  0%{box-shadow:0 0 0 0 rgba(15,77,46,.55)}
  70%{box-shadow:0 0 0 8px rgba(15,77,46,0)}
  100%{box-shadow:0 0 0 0 rgba(15,77,46,0)}
}
.ticker__viewport{padding-left:1.3rem}
.ticker__track{color:rgba(255,255,255,.94); font-weight:500}
.ticker__track a{color:rgba(255,255,255,.94)}
.ticker__track a:hover{color:var(--gold); text-decoration:underline}
.ticker__sep{color:var(--gold)}
.ticker__pause{
  color:rgba(255,255,255,.75); border-radius:6px;
  transition:color .2s, background .2s;
}
.ticker__pause:hover{color:#fff; background:rgba(255,255,255,.12)}

@media (max-width:620px){
  .ticker{min-height:50px}
  .ticker__label{padding:.7rem .95rem; font-size:.68rem; letter-spacing:.07em}
  .ticker__viewport{padding-left:.9rem}
}
@media (max-width:520px){
  /* On a phone the label must not crowd out the message it introduces. */
  .ticker__label{padding:.6rem .8rem; font-size:.61rem; letter-spacing:.03em; gap:.4rem}
  .ticker__pulse{width:7px; height:7px}
  .ticker__viewport{padding-left:.75rem}
  .ticker__pause{padding:.5rem .6rem}
}

/* ---------- 17z. Announcements band, refined ---------- */
/* The saturated gold chip on solid green read as an alert banner. This is the
   quieter institutional treatment: a tinted full-bleed band with hairline
   rules, the label set as typography with a divider rather than a block, and
   gold kept for the live dot and the separators only. Tokens are used
   throughout so the contrast and dark themes still resolve correctly. */
.ticker{
  background:var(--paper);
  border:0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  min-height:54px; box-shadow:none;
}
.ticker__label{
  align-self:center;
  background:none; color:var(--accent-ink);
  font-family:var(--font-display); font-weight:800;
  font-size:.68rem; letter-spacing:.16em; text-transform:uppercase;
  padding:0 1.15rem 0 0; margin-right:1.15rem;
  border-right:1px solid var(--line);
}
.ticker__pulse{
  width:8px; height:8px; background:var(--gold-deep);
  box-shadow:0 0 0 0 rgba(176,120,10,.5); animation:pulseGold 2s infinite;
}
@keyframes pulseGold{
  0%{box-shadow:0 0 0 0 rgba(176,120,10,.5)}
  70%{box-shadow:0 0 0 7px rgba(176,120,10,0)}
  100%{box-shadow:0 0 0 0 rgba(176,120,10,0)}
}
.ticker__viewport{padding-left:0}
.ticker__track{color:var(--ink-soft); font-weight:500}
.ticker__track a{color:var(--ink-soft)}
.ticker__track a:hover{color:var(--accent-ink); text-decoration:underline}
.ticker__sep{color:var(--accent-warm)}
.ticker__pause{
  color:var(--muted); border-radius:6px;
  transition:color .2s, background .2s;
}
.ticker__pause:hover{color:var(--accent-ink); background:rgba(15,77,46,.07)}

@media (max-width:520px){
  .ticker{min-height:48px}
  .ticker__label{
    font-size:.6rem; letter-spacing:.1em;
    padding-right:.75rem; margin-right:.75rem; gap:.4rem;
  }
  .ticker__pulse{width:7px; height:7px}
  .ticker__viewport{padding-left:0}
}

/* ---------- 17aa. Laboratory photo cards, refined ---------- */
/* The source photographs are only 189-330px wide. In full-width cards they sat
   marooned in a large empty plate, so the cards now hug the pictures and the
   row centres itself. Contain is kept rather than cover because these are
   instrument photographs where cropping would cut the equipment. */
.shots{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),280px));
  justify-content:center;
  gap:1.3rem;
  margin-top:2rem;
}
.shots figure{transition:transform .25s var(--ease), box-shadow .25s var(--ease)}
.shots figure:hover{transform:translateY(-3px); box-shadow:var(--shadow-2)}
.shots img{
  width:100%; height:auto; aspect-ratio:3/2;
  object-fit:contain; padding:0; background:var(--green-wash);
}
.shots figcaption{text-align:center; font-size:.83rem; line-height:1.5}

@media (max-width:520px){
  .shots{grid-template-columns:minmax(0,1fr); max-width:320px; margin-inline:auto}
  .shots img{aspect-ratio:3/2}
}

/* ---------- 17ab. Photo cards at a middle size ---------- */
/* The training photographs are 350px wide, so their cards can be a little
   larger than the laboratory ones without upscaling into softness. */
.shots--md{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),340px))}
@media (max-width:520px){
  .shots--md{grid-template-columns:minmax(0,1fr); max-width:340px; margin-inline:auto}
}

/* ---------- 17ac. Image buttons sit flush in their card ---------- */
/* These cards are <button> elements, so they were still carrying the browser's
   default 1px 6px padding. That left a hairline of card colour around every
   picture — visible as a gap down the sides of the research tiles. The images
   are meant to bleed to the card edge. */
.rcard__btn,
.sdggrid button{padding:0}

/* ---------- 17ad. Statutory document pages ----------
   Disclaimer, Privacy Statement, Copyright Policy and Accessibility
   Statement. Each is a short legal text, so it is set as a document:
   a sticky rail carrying the other three on the left, and a single
   measured column of type on the right. The heavy panels these pages
   used before (.lawbox, .terms) are kept for mta.php, which still
   needs them; nothing here touches those. */

.section--doc{padding-top:3.2rem}

.docgrid{
  display:grid;
  grid-template-columns:250px minmax(0,1fr);
  gap:3.6rem;
  align-items:start;
}

/* ----- the rail ----- */
.docnav{position:sticky; top:5rem; display:grid; gap:1.9rem}
.docnav__grp{margin:0}
.docnav__label{
  margin:0 0 .7rem .75rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.66rem; letter-spacing:.15em; text-transform:uppercase;
  color:var(--accent-warm);
}
.docnav__list{list-style:none; margin:0; padding:0; display:grid; gap:.15rem}
.docnav__list a{
  display:grid; gap:.15rem;
  padding:.6rem .8rem;
  border-left:2px solid transparent; border-radius:0 var(--r-sm) var(--r-sm) 0;
  transition:background .18s var(--ease), border-color .18s, color .18s;
}
.docnav__t{
  font-family:var(--font-display); font-weight:600; font-size:.9rem;
  line-height:1.35; color:var(--ink-soft);
}
.docnav__n{font-size:.76rem; line-height:1.45; color:var(--muted)}
.docnav__list a:hover{background:var(--green-wash); border-left-color:var(--green-mid)}
.docnav__list a:hover .docnav__t{color:var(--accent-ink)}
.docnav__list .is-current a{
  background:var(--green-wash); border-left-color:var(--green);
}
.docnav__list .is-current .docnav__t{color:var(--accent-ink); font-weight:800}
.docnav__list--plain a{padding-block:.45rem}

/* ----- the document ----- */
.docbody{min-width:0}

.dochead{
  margin:0 0 2.4rem;
  padding-bottom:1.5rem;
  border-bottom:2px solid var(--line);
}
.dochead__k{
  margin:0 0 .45rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.68rem; letter-spacing:.15em; text-transform:uppercase;
  color:var(--accent-warm);
}
.dochead__t{
  margin:0;
  font-size:clamp(1.5rem,2.6vw,2.05rem); line-height:1.15;
  color:var(--accent-ink);
}
.dochead__meta{
  display:flex; flex-wrap:wrap; gap:.5rem 1.6rem;
  margin:1rem 0 0;
}
.dochead__meta span{
  position:relative; font-size:.8rem; color:var(--muted);
}
.dochead__meta span+span::before{
  content:""; position:absolute; left:-.85rem; top:.45em;
  width:3px; height:3px; border-radius:50%; background:var(--line);
}

/* Contents list, shown only where a page has more than one section. */
.doctoc{
  margin:0 0 2.4rem;
  padding:1.1rem 1.3rem;
  background:var(--green-wash); border-radius:var(--r-md);
}
.doctoc__label{
  margin:0 0 .55rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.66rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-warm);
}
.doctoc__list{margin:0; padding-left:1.2rem; display:grid; gap:.35rem}
.doctoc__list li::marker{color:var(--accent-ink); font-weight:700; font-size:.85rem}
.doctoc__list a{
  font-size:.92rem; line-height:1.5; color:var(--accent-ink);
  text-decoration:underline; text-decoration-color:var(--line);
  text-underline-offset:3px; transition:text-decoration-color .18s;
}
.doctoc__list a:hover{text-decoration-color:var(--green-mid)}

/* Numbered clauses. The rule between them does the work the box used to,
   without the weight. */
.clauses{counter-reset:cl; list-style:none; margin:0; padding:0}
.clauses>li{
  counter-increment:cl; position:relative;
  padding:0 0 2rem 3.6rem;
  margin:0 0 2rem;
  border-bottom:1px solid var(--line-soft);
}
.clauses>li:last-child{border-bottom:0; margin-bottom:0; padding-bottom:0}
.clauses>li::before{
  content:counter(cl,decimal-leading-zero);
  position:absolute; left:0; top:-.1rem;
  font-family:var(--font-display); font-weight:800;
  font-size:1.3rem; letter-spacing:-.03em; line-height:1;
  color:var(--accent-ink); opacity:.42;
}
.clauses__h{
  margin:0 0 .5rem;
  font-family:var(--font-display); font-weight:700;
  font-size:1.02rem; line-height:1.3; color:var(--accent-ink);
}
.clauses__b{
  margin:0;
  font-size:.99rem; line-height:1.85; color:var(--ink-soft);
  overflow-wrap:break-word;
}

/* Headed sections, for a policy written as prose under headings. */
.docsec{
  padding-bottom:2.2rem; margin-bottom:2.2rem;
  border-bottom:1px solid var(--line-soft);
  scroll-margin-top:5rem;
}
.docsec:last-of-type{border-bottom:0; margin-bottom:0; padding-bottom:0}
.docsec__n{
  margin:0 0 .5rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.68rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-warm);
}
.docsec__t{
  margin:0 0 .9rem;
  font-size:1.24rem; line-height:1.3; color:var(--accent-ink);
}
.docsec__b{
  margin:0;
  font-size:.99rem; line-height:1.85; color:var(--ink-soft);
  overflow-wrap:break-word;
}
.docsec--tools{
  margin-top:2.6rem; padding-top:2.2rem;
  border-top:1px solid var(--line-soft); border-bottom:0;
}

/* The opening paragraph of a statement, set larger than the body. */
.docopen{
  margin:0 0 1.7rem;
  padding-left:1.3rem;
  border-left:3px solid var(--gold);
  font-size:1.09rem; line-height:1.8; color:var(--ink);
}
.docprose p{
  margin:0 0 1.15rem;
  font-size:.99rem; line-height:1.85; color:var(--ink-soft);
}
.docprose p:last-child{margin-bottom:0}

/* Term and definition, for a short list of named things. */
.doclist{margin:0; display:grid; gap:.15rem}
.doclist dt{
  font-family:var(--font-display); font-weight:700;
  font-size:.95rem; color:var(--accent-ink);
  padding-top:.9rem; border-top:1px solid var(--line-soft);
}
.doclist dt:first-child{border-top:0; padding-top:0}
.doclist dd{
  margin:.25rem 0 .9rem;
  font-size:.92rem; line-height:1.7; color:var(--ink-soft);
}
.doclist dd:last-child{margin-bottom:0}

/* Close of the document. */
.docfoot{
  margin-top:2.8rem; padding-top:1.5rem;
  border-top:2px solid var(--line);
  display:flex; flex-wrap:wrap; align-items:center;
  justify-content:space-between; gap:.9rem 1.6rem;
}
.docfoot__t{margin:0; font-size:.9rem; line-height:1.6; color:var(--muted)}
.docfoot__go{
  flex:none;
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.55rem 1.1rem; border-radius:999px;
  background:linear-gradient(180deg,var(--green),var(--green-deep)); color:#fff;
  font-family:var(--font-display); font-weight:700; font-size:.85rem;
  box-shadow:var(--shadow-1);
  transition:transform .2s var(--ease), filter .2s;
}
.docfoot__go:hover{transform:translateY(-1px); filter:brightness(1.06)}

@media (max-width:1080px){
  .docgrid{grid-template-columns:220px minmax(0,1fr); gap:2.6rem}
}
@media (max-width:900px){
  .docgrid{grid-template-columns:minmax(0,1fr); gap:2.4rem}
  .docbody{max-width:none}
  /* The rail stops being a rail and becomes a row of links above the text. */
  .docnav{position:static; gap:1.4rem}
  .docnav__label{margin-left:0}
  .docnav__list{grid-template-columns:repeat(2,minmax(0,1fr)); gap:.5rem}
  .docnav__list a{
    border:1px solid var(--line); border-left-width:2px;
    border-radius:var(--r-sm); background:var(--surface);
  }
  .docnav__list--plain{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  .docnav__list,
  .docnav__list--plain{grid-template-columns:minmax(0,1fr)}
  .docnav__n{display:none}
  .clauses>li{padding-left:0; padding-top:2.4rem}
  .clauses>li::before{top:0}
  .docfoot__go{width:100%; justify-content:center}
}
@media print{
  .docnav,.docfoot__go{display:none!important}
  .docgrid{grid-template-columns:minmax(0,1fr)}
}

/* ---------- 17ae. Linkage charts (Collaborations) ----------
   The institute publishes its linkages as a flat JPEG. It is redrawn here
   as inline SVG so the partner names stay real text — selectable, findable
   and readable by a screen reader — and so the chart is crisp at any width
   and follows whichever colour theme the visitor has chosen. */

.hubwrap{
  margin:0;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  box-shadow:var(--shadow-1);
  padding:1.6rem 1.4rem 1.1rem;
}
.hubwrap__cap{
  margin:.9rem 0 0;
  text-align:center;
  font-family:var(--font-display); font-weight:800;
  font-size:.7rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent-warm);
}

.hub{display:block; width:100%; height:auto}

/* Spokes run outward from the hub. */
.hub__spoke{stroke:var(--green-mid); stroke-width:1.6; fill:none}
.hub__head{fill:var(--green-mid)}

/* Partner pills. */
.hub__node rect{
  fill:var(--green-wash);
  stroke:var(--green-mid); stroke-width:1.4;
}
.hub__node text{
  fill:var(--accent-ink);
  font-family:var(--font-display); font-weight:700;
  font-size:15px; text-anchor:middle;
}

/* The institute at the centre. */
.hub__core rect{fill:var(--green-deep); stroke:none}
.hub__core text{
  fill:#fff;
  font-family:var(--font-display); font-weight:800;
  font-size:19px; letter-spacing:.04em; text-anchor:middle;
}

/* A note about the source artwork, set apart from the institute's own words. */
.hubnote{
  margin:1.1rem 0 0;
  padding-left:1rem;
  border-left:3px solid var(--gold);
  font-size:.88rem; line-height:1.65; color:var(--muted);
}
.hubnote strong{color:var(--accent-ink); font-weight:700}

@media (max-width:760px){
  .hubwrap{padding:1.1rem .8rem .8rem}
  .hub__node text{font-size:16px}
  .hub__core text{font-size:20px}
}

/* ---------- 17af. Long-form research pages ----------
   Success Stories and Research Achievements. Both are long documents made
   of headed sections, so they share one set of parts: a section head with
   its own number, a measured prose column, figures with captions, and a
   note style for anything that is an observation about the source rather
   than the institute's own words. */

/* ----- section head ----- */
.storyhead{margin:0 0 1.6rem; padding-bottom:1.1rem; border-bottom:2px solid var(--line)}
.storyhead__n{
  margin:0 0 .45rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.68rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent-warm);
}
.storyhead__t{
  margin:0;
  font-size:clamp(1.3rem,2.4vw,1.85rem); line-height:1.22;
  color:var(--accent-ink);
}

/* ----- prose ----- */
.storyprose{max-width:none}
.storyprose p{
  margin:0 0 1.15rem;
  font-size:1rem; line-height:1.85; color:var(--ink-soft);
  text-align:justify; hyphens:auto;
}
.storyprose p:last-child{margin-bottom:0}
.storyprose strong{color:var(--accent-ink); font-weight:700}

/* ----- figures ----- */
.storyfig{
  margin:0 0 1.8rem;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1); overflow:hidden;
}
.storyfig img{width:100%; height:auto; display:block}
.storyfig figcaption{
  padding:.85rem 1.2rem 1rem;
  font-size:.86rem; line-height:1.55; color:var(--muted);
  border-top:1px solid var(--line-soft);
}
/* A chart is artwork with margins of its own — let it breathe, do not bleed. */
.storyfig--chart img{padding:1rem 1.2rem 0; background:var(--surface)}
/* A small figure should not be stretched to the width of the page. */
.storyfig--sm{max-width:320px; margin-inline:auto; margin-block:1.8rem}

/* ----- a note about the source, set apart from the institute's own words ----- */
.srcnote{
  margin:1.3rem 0 0;
  padding:.95rem 1.2rem;
  background:var(--green-wash); border-left:3px solid var(--gold);
  border-radius:0 var(--r-sm) var(--r-sm) 0;
  font-size:.88rem; line-height:1.7; color:var(--muted);
}
.srcnote strong{color:var(--accent-ink); font-weight:700}

/* ----- a lettered achievement list: bold label, then the body ----- */
.achlist{list-style:none; margin:0 0 2.6rem; padding:0}
.achlist>li{
  padding:0 0 1.5rem;
  margin:0 0 1.5rem;
  border-bottom:1px solid var(--line-soft);
}
.achlist>li:last-child{border-bottom:0; margin-bottom:0; padding-bottom:0}
.achlist__t{
  margin:0 0 .4rem;
  font-family:var(--font-display); font-weight:700;
  font-size:1.02rem; line-height:1.3; color:var(--accent-ink);
}
.achlist__b{
  margin:0 0 .8rem;
  font-size:.97rem; line-height:1.8; color:var(--ink-soft);
}
.achlist__b:last-child{margin-bottom:0}

/* ----- sub-heading inside a long section ----- */
.subhead2{
  margin:3rem 0 .5rem;
  font-size:1.16rem; line-height:1.3; color:var(--accent-ink);
}
.subhead2::after{
  content:""; display:block; width:44px; height:3px; border-radius:3px;
  margin-top:.55rem;
  background:linear-gradient(90deg,var(--gold),var(--green-mid));
}

/* ----- outreach cards ----- */
.achgrid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.4rem}
.achcard{
  position:relative;
  background:var(--surface); border:1px solid var(--line);
  border-top:3px solid var(--green-mid); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1);
  padding:1.5rem 1.6rem 1.6rem;
}
.achcard__n{
  margin:0 0 .5rem;
  font-family:var(--font-display); font-weight:800;
  font-size:1.25rem; line-height:1; letter-spacing:-.03em;
  color:var(--accent-ink); opacity:.42;
}
.achcard__t{
  margin:0 0 .7rem;
  font-size:1.04rem; line-height:1.32; color:var(--accent-ink);
}
.achcard__b{
  margin:0;
  font-size:.93rem; line-height:1.75; color:var(--ink-soft);
  text-align:justify; hyphens:auto;
}

/* ----- variants of parts that already exist ----- */
.factgrid--tight{margin-top:1.8rem}
.xlinks--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.mandcard__s{
  margin:.4rem 0 0;
  font-size:.86rem; line-height:1.6; color:var(--muted);
}
/* Long entries need more room than the short tick items the list was built for. */
.ticklist--lg li{
  padding-left:1.5rem; margin-bottom:.85rem;
  font-size:.97rem; line-height:1.8;
}
.ticklist--lg li::before{top:.72em; width:.5rem; height:.5rem}
.ticklist--2{grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 2.4rem}

/* A grouped data table: the crop spans its varieties. */
.dtable__group{
  vertical-align:top; white-space:nowrap;
  background:var(--green-wash); color:var(--accent-ink);
  font-family:var(--font-display); font-weight:700;
  text-align:left;
}
.dtable__count{
  display:inline-block; margin-left:.45rem;
  padding:.05rem .45rem; border-radius:999px;
  background:var(--surface); border:1px solid var(--line);
  font-size:.72rem; font-weight:700; color:var(--muted);
}
.dtable__grouprow th{
  background:var(--green-wash); color:var(--accent-ink);
  font-family:var(--font-display); font-weight:800;
  font-size:.78rem; letter-spacing:.09em; text-transform:uppercase;
  text-align:left;
}

@media (max-width:900px){
  .achgrid{grid-template-columns:minmax(0,1fr)}
  .xlinks--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ticklist--2{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  .xlinks--3{grid-template-columns:minmax(0,1fr)}
  .storyprose p,.achcard__b{text-align:left; hyphens:none}
  .storyfig--sm{max-width:100%}
}

/* A four-across variant of the numbered card grid. */
.mandgrid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1080px){ .mandgrid--4{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:560px){ .mandgrid--4{grid-template-columns:minmax(0,1fr)} }

/* These pages run the full site width, like every other page: the site's
   own .prose carries no measure either. */

/* ---------- 17ag. Story spread ----------
   A story opens as a spread: a numbered head, then the photograph beside
   the opening paragraph and the figures that matter, then the body text in
   a measured column. Stacking a full-width photograph above a wall of
   justified prose is what this replaces. */

.shead{
  display:flex; align-items:flex-start; gap:1.2rem;
  margin:0 0 2rem; padding-bottom:1.2rem;
  border-bottom:2px solid var(--line);
}
.shead__n{
  flex:none;
  font-family:var(--font-display); font-weight:800;
  font-size:clamp(2.1rem,4vw,3rem); line-height:.9; letter-spacing:-.04em;
  color:var(--accent-ink); opacity:.26;
}
.shead__k{
  margin:0 0 .3rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.7rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent-warm);
}
.shead__t{
  margin:0;
  font-size:clamp(1.28rem,2.3vw,1.75rem); line-height:1.24;
  color:var(--accent-ink);
}

/* ----- the spread itself ----- */
.slead{
  display:grid; grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:2.6rem; align-items:start;
  margin:0 0 2.6rem;
}
.slead--flip .slead__fig{order:2}
.slead__fig{
  margin:0;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-2); overflow:hidden;
}
.slead__fig img{
  display:block; width:100%;
  /* The photographs are wider than they are tall; cap the height so one of
     them cannot fill a whole screen on its own. */
  height:clamp(240px,30vw,430px); object-fit:cover;
}
.slead__fig figcaption{
  padding:.8rem 1.1rem .95rem;
  font-size:.84rem; line-height:1.55; color:var(--muted);
  border-top:1px solid var(--line-soft);
}
.slead__body{padding-top:.2rem}
.slead__p{
  margin:0 0 1.5rem;
  font-size:1.1rem; line-height:1.75; color:var(--ink);
}

/* A story that opens on text rather than a picture. */
.slead--text{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}

/* ----- the figures that matter, beside the opening paragraph ----- */
.kstats{
  list-style:none; margin:0; padding:1.4rem 0 0;
  border-top:1px solid var(--line);
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.3rem 1.6rem;
}
.kstats--4{border-top:0; padding-top:0; align-content:start}
.kstat{margin:0}
.kstat__n{
  margin:0;
  font-family:var(--font-display); font-weight:800;
  font-size:1.55rem; line-height:1; letter-spacing:-.02em;
  color:var(--accent-ink);
}
.kstat__n span{font-size:.9rem; font-weight:700; color:var(--muted); letter-spacing:0}
.kstat__l{
  margin:.35rem 0 0;
  font-size:.83rem; line-height:1.5; color:var(--muted);
}

/* Ragged right reads more evenly than justified text at this measure. */
.storyprose p,.achcard__b{text-align:left; hyphens:none}

@media (max-width:900px){
  .slead,.slead--text{grid-template-columns:minmax(0,1fr); gap:1.8rem}
  .slead--flip .slead__fig{order:0}
  .slead__fig img{height:clamp(220px,46vw,340px)}
  .kstats--4{border-top:1px solid var(--line); padding-top:1.4rem}
}
@media (max-width:560px){
  .shead{gap:.85rem}
  .kstats{grid-template-columns:minmax(0,1fr); gap:1.1rem}
}

/* ---------- 17ah. NER Sub Plan ----------
   Photograph grids and the farmer profile cards. The source publishes each
   farmer as a 13-row two-column table; a card carries the same fields in a
   form that survives a phone screen. */

.nergrid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.2rem}
.nergrid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.nershot{
  margin:0;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1); overflow:hidden;
}
.nershot img{
  display:block; width:100%;
  height:clamp(170px,15vw,220px); object-fit:cover;
}
.nergrid--2 .nershot img{height:clamp(180px,17vw,240px)}
.nershot figcaption{
  padding:.7rem .9rem .8rem;
  font-size:.82rem; line-height:1.5; color:var(--muted);
  border-top:1px solid var(--line-soft);
}

/* ----- farmer profile cards ----- */
.nerfarmers{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.4rem;
  margin-top:1.8rem;
}
.nerfarmer{
  display:flex; flex-direction:column;
  background:var(--surface); border:1px solid var(--line);
  border-top:3px solid var(--green-mid); border-radius:var(--r-lg);
  box-shadow:var(--shadow-1);
  padding:1.4rem 1.5rem 1.5rem;
}
.nerfarmer__head{display:flex; gap:1rem; align-items:flex-start; margin-bottom:1.1rem}
.nerfarmer__photo{
  flex:none; width:74px; height:74px; object-fit:cover;
  border-radius:var(--r-md); border:1px solid var(--line);
}
.nerfarmer__n{
  margin:0 0 .15rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.78rem; letter-spacing:.1em; color:var(--accent-ink); opacity:.42;
}
.nerfarmer__t{
  margin:0 0 .2rem;
  font-size:1.02rem; line-height:1.25; color:var(--accent-ink);
}
.nerfarmer__meta{margin:0 0 .45rem; font-size:.82rem; color:var(--muted)}
.nerfarmer__crop{
  margin:0;
  font-family:var(--font-display); font-weight:700; font-size:.85rem;
  color:var(--accent-ink-2);
}
.nerfarmer__crop span{
  display:inline-block; margin-left:.3rem;
  padding:.1rem .5rem; border-radius:999px;
  background:var(--green-wash); border:1px solid var(--line);
  font-size:.74rem; font-weight:600; color:var(--muted);
}

/* The numbers, as label-over-value pairs rather than table rows. */
.nerfarmer__facts{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.85rem 1rem;
  margin:0 0 1.2rem; padding:1rem 0 0;
  border-top:1px solid var(--line-soft);
}
.nerfarmer__facts dt{
  margin:0 0 .12rem;
  font-size:.72rem; letter-spacing:.05em; text-transform:uppercase;
  color:var(--muted);
}
.nerfarmer__facts dd{
  margin:0;
  font-family:var(--font-display); font-weight:700;
  font-size:.95rem; line-height:1.3; color:var(--ink);
}
.nerfarmer__facts .is-profit dd{color:var(--accent-ink); font-size:1.08rem}

.nerfarmer__lbl{
  margin:0 0 .25rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.66rem; letter-spacing:.13em; text-transform:uppercase;
  color:var(--accent-warm);
}
.nerfarmer__b{
  margin:0 0 1rem;
  font-size:.86rem; line-height:1.65; color:var(--ink-soft);
}
.nerfarmer__b:last-child{margin-bottom:0}

@media (max-width:1080px){
  .nergrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nerfarmers{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nershot img{height:clamp(180px,24vw,240px)}
}
@media (max-width:700px){
  .nergrid,.nergrid--2,.nerfarmers{grid-template-columns:minmax(0,1fr)}
  .nershot img{height:clamp(200px,52vw,280px)}
}
@media (max-width:420px){
  .nerfarmer__facts{grid-template-columns:minmax(0,1fr)}
}

/* A three-across photo grid, and a figure with no caption bar. */
.nergrid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.nershot--plain img{height:clamp(190px,17vw,250px)}
@media (max-width:1080px){ .nergrid--3{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:700px){ .nergrid--3{grid-template-columns:minmax(0,1fr)} }

/* A numbered card that carries a title AND a line of explanation. The base
   .mandcard is a flex row, so a third child lands beside the title and
   squeezes it to a few characters wide; here the number keeps its column
   and the two texts stack in the second. */
.mandcard--stack{
  display:grid; grid-template-columns:auto minmax(0,1fr);
  column-gap:1.15rem; align-items:start;
}
.mandcard--stack .mandcard__n{grid-column:1; grid-row:1 / span 2}
.mandcard--stack .mandcard__t{
  grid-column:2; grid-row:1;
  margin:.45rem 0 0;
  font-family:var(--font-display); font-weight:700;
  font-size:1.02rem; line-height:1.3; color:var(--accent-ink);
  overflow-wrap:break-word;
}
.mandcard--stack .mandcard__s{grid-column:2; grid-row:2; margin-top:.4rem}

/* ---------- 17ai. E-Pulses Data Book indexes ----------
   Two pages that are almost entirely links to PDF data sheets. The source
   publishes them as one long borderless table; here each section is its own
   block and each sheet is a card, so 121 links stay scannable. */

/* ----- jump-to-section chips ----- */
.dbjump{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.7rem;
}
.dbjump a{
  display:flex; align-items:center; gap:.7rem;
  padding:.6rem .9rem;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md);
  text-decoration:none; color:var(--ink-soft);
  transition:border-color .18s, background .18s, transform .18s;
}
.dbjump a:hover{border-color:var(--green-mid); background:var(--green-wash); transform:translateY(-1px)}
.dbjump__n{
  flex:none; width:1.7rem; height:1.7rem; display:grid; place-items:center;
  border-radius:var(--r-sm); background:var(--green-wash); color:var(--accent-ink);
  font-family:var(--font-display); font-weight:800; font-size:.8rem;
}
.dbjump a:hover .dbjump__n{background:var(--surface)}
.dbjump__t{font-size:.86rem; line-height:1.4}

/* ----- one section ----- */
.dbsec{margin:0 0 2.8rem}
.dbsec:last-of-type{margin-bottom:0}
.dbsec__head{
  display:flex; align-items:center; gap:.9rem;
  margin:0 0 1.1rem; padding-bottom:.8rem;
  border-bottom:2px solid var(--line);
}
.dbsec__n{
  flex:none; width:2.2rem; height:2.2rem; display:grid; place-items:center;
  border-radius:var(--r-sm);
  background:linear-gradient(160deg,var(--green-mid),var(--green-deep)); color:#fff;
  font-family:var(--font-display); font-weight:800; font-size:.95rem;
}
.dbsec__t{
  margin:0; flex:1 1 auto; min-width:0;
  font-size:1.06rem; line-height:1.3; color:var(--accent-ink);
}
.dbsec__c{
  flex:none;
  padding:.2rem .6rem; border-radius:999px;
  background:var(--green-wash); border:1px solid var(--line);
  font-size:.74rem; font-weight:700; color:var(--muted); white-space:nowrap;
}

/* ----- the sheet links ----- */
.doclinks{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem}
.doclinks--one{grid-template-columns:minmax(0,1fr)}
.doclink{
  display:flex; align-items:center; gap:.8rem;
  padding:.8rem 1rem;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md);
  box-shadow:var(--shadow-1); text-decoration:none;
  transition:border-color .18s, box-shadow .18s, transform .18s;
}
.doclink:hover{border-color:var(--green-mid); box-shadow:var(--shadow-2); transform:translateY(-2px)}
.doclink__n{
  flex:none; min-width:2.6rem; text-align:center;
  padding:.15rem .35rem; border-radius:var(--r-sm);
  background:var(--green-wash); color:var(--accent-ink);
  font-family:var(--font-display); font-weight:700; font-size:.78rem;
}
.doclink__t{
  flex:1 1 auto; min-width:0;
  font-size:.9rem; line-height:1.45; color:var(--ink-soft);
}
.doclink:hover .doclink__t{color:var(--accent-ink)}
.doclink__go{
  flex:none;
  padding:.2rem .45rem; border-radius:var(--r-sm);
  background:var(--gold); color:#3a2a00;
  font-family:var(--font-display); font-weight:800;
  font-size:.66rem; letter-spacing:.06em;
}

/* ----- where the figures come from ----- */
.dbsource{
  margin:2.6rem 0 0; padding:1.3rem 1.5rem;
  background:var(--green-wash); border-left:3px solid var(--gold);
  border-radius:0 var(--r-md) var(--r-md) 0;
}
.dbsource__k{
  margin:0 0 .5rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.68rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-warm);
}
.dbsource ul{margin:0; padding-left:1.1rem}
.dbsource li{font-size:.9rem; line-height:1.7; color:var(--ink-soft)}
.dbsource__note{
  margin:.8rem 0 0;
  font-size:.85rem; line-height:1.65; color:var(--muted);
}

/* A qualifier that rides along with the page title. */
.pagehead__qual{
  display:inline-block; margin-left:.5rem;
  padding:.15rem .7rem; border-radius:999px;
  background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.3);
  font-size:.5em; letter-spacing:.08em; text-transform:uppercase;
  vertical-align:middle;
}

@media (max-width:1080px){
  .dbjump{grid-template-columns:repeat(2,minmax(0,1fr))}
  .doclinks{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  .dbjump,.doclinks{grid-template-columns:minmax(0,1fr)}
  .dbsec__head{flex-wrap:wrap}
  .dbsec__t{flex:1 1 100%; order:3}
}
.xlinks--2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:760px){ .xlinks--2{grid-template-columns:minmax(0,1fr)} }

/* ---------- 17aj. AICRP overview ----------
   The institute's AICRP page is a short paragraph followed by a two-item list,
   each item carrying its own Project Coordinator reports. These panels give the
   two projects equal weight and hang their reports underneath. */
.projgrid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem}
.projcard{
  display:flex; flex-direction:column;
  padding:1.6rem 1.7rem 1.6rem;
  background:var(--surface); border:1px solid var(--line);
  border-top:3px solid var(--green-mid);
  border-radius:var(--r-md); box-shadow:var(--shadow-1);
  transition:box-shadow .18s, transform .18s;
}
.projcard:hover{box-shadow:var(--shadow-2); transform:translateY(-2px)}
.projcard__k{
  margin:0 0 .5rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.68rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-warm);
}
.projcard__t{
  margin:0 0 1.3rem;
  font-family:var(--font-display); font-weight:700;
  font-size:clamp(1.1rem,1.6vw,1.32rem); line-height:1.3;
  letter-spacing:-.01em; color:var(--accent-ink);
}
.projcard__t a{color:inherit; text-decoration:none}
.projcard__t a:hover{color:var(--accent-warm); text-decoration:underline}
.projcard__lbl{
  /* Hangs the label and its links together at the foot of the panel, so a card
     with one report lines up with a card carrying two. */
  margin:auto 0 .7rem; padding-top:1rem; border-top:1px solid var(--line);
  font-family:var(--font-display); font-weight:700;
  font-size:.7rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted);
}
/* The reports stack one per row inside a panel, whatever the page-level default. */
.projcard .doclinks{grid-template-columns:minmax(0,1fr)}
.projcard .doclink__n{min-width:4.6rem; font-size:.72rem}

@media (max-width:860px){
  .projgrid{grid-template-columns:minmax(0,1fr)}
}

/* ---------- 17ak. IIPR in Media (press clippings) ----------
   The clippings arrive at wildly different shapes — a landscape half-page, a
   full column 941x1600, a near-square. A uniform grid would crop the tall one
   past legibility, so each gets its own spread: the scan on one side at its own
   aspect ratio, its masthead and headline on the other, sides alternating. */
.cliplist{display:grid; gap:3.4rem; margin:0}
.clip{
  display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:2.4rem; align-items:start;
}
.clip--flip .clip__fig{order:2}

/* A white mount, like a cutting pasted on a sheet. */
.clip__fig{
  margin:0; padding:.7rem;
  background:#fff; border:1px solid var(--line);
  border-radius:var(--r-md); box-shadow:var(--shadow-2);
}
.clip__fig img{
  display:block; margin:0 auto;
  max-width:100%; width:auto; height:auto;
  max-height:720px;
  border-radius:var(--r-sm);
}
.clip__body{padding-top:.3rem}
.clip__n{
  display:block; margin:0 0 .55rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.68rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-warm);
}
.clip__pub{
  margin:0 0 .3rem;
  font-family:var(--font-hi); font-weight:700;
  font-size:clamp(1.15rem,1.7vw,1.4rem); line-height:1.35;
  color:var(--accent-ink);
}
.clip__pub em{font-style:normal; color:var(--muted); font-size:.8em; font-weight:500}
.clip__date{
  margin:0 0 1.1rem; padding-bottom:1.1rem; border-bottom:1px solid var(--line);
  font-size:.86rem; color:var(--muted);
}
.clip__head{
  margin:0 0 .9rem;
  font-family:var(--font-hi); font-weight:700;
  font-size:clamp(1.05rem,1.5vw,1.24rem); line-height:1.55;
  color:var(--ink);
}
.clip__facts{list-style:none; margin:0 0 1.3rem; padding:0; display:grid; gap:.65rem}
.clip__facts li{display:flex; gap:.75rem; align-items:baseline; font-size:.9rem; line-height:1.6}
.clip__k{
  flex:none; min-width:5.4rem;
  font-family:var(--font-display); font-weight:700;
  font-size:.66rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted);
}
.clip__v{color:var(--ink-soft)}
.clip__v--hi{font-family:var(--font-hi)}
.clip__go{
  display:inline-flex; align-items:center; gap:.45rem;
  font-family:var(--font-display); font-weight:700; font-size:.82rem;
  color:var(--accent-ink); text-decoration:none;
  border-bottom:2px solid var(--gold); padding-bottom:.15rem;
}
.clip__go:hover{color:var(--accent-warm)}

@media (max-width:960px){
  .clip{grid-template-columns:minmax(0,1fr); gap:1.5rem}
  .clip--flip .clip__fig{order:0}
  .clip__fig img{max-height:620px}
}
@media (max-width:560px){
  .cliplist{gap:2.6rem}
  .clip__fig{padding:.45rem}
  .clip__k{min-width:4.6rem}
}

/* ---------- 17al. Home corner cards, always open ----------
   These three cards used to hide their contents behind a click. The contents
   now sit on the page, so the card body is a plain block rather than a button
   and each card carries its own list underneath the badge. */
.corner__body--tight{padding:1rem .8rem .6rem}

/* ----- Kisaan corner: the five destinations ----- */
.cornerlinks{list-style:none; margin:0 .8rem 1rem; padding:0; display:grid; gap:.4rem}
.cornerlinks a{
  display:flex; align-items:center; justify-content:space-between; gap:.6rem;
  padding:.6rem .85rem;
  background:var(--green-wash-2); border:1px solid var(--line-soft); border-radius:var(--r-md);
  font-family:var(--font-display); font-weight:600; font-size:.88rem;
  color:var(--accent-ink); text-decoration:none;
  transition:background .18s, border-color .18s, transform .18s;
}
.cornerlinks a:hover{background:var(--green-wash); border-color:var(--green-mid); transform:translateX(2px)}
.cornerlinks__go{flex:none; color:var(--accent-warm); font-weight:800; font-size:.9rem}

/* ----- ABI & ITMU: the two menus, item for item ----- */
.abigroups{
  margin:0 .75rem .85rem; padding:.85rem .95rem;
  background:var(--green-wash-2); border:1px solid var(--line-soft); border-radius:var(--r-md);
  display:grid; gap:.95rem;
}
.abigroup__k{
  margin:0 0 .45rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.66rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-warm);
}
.abigroup__l{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.35rem}
.abigroup__l a,.abigroup__l span{
  display:inline-block; padding:.3rem .6rem;
  background:#fff; border:1px solid var(--line); border-radius:999px;
  font-size:.78rem; line-height:1.3; color:var(--accent-ink); text-decoration:none;
  transition:border-color .18s, color .18s;
}
.abigroup__l a:hover{border-color:var(--green-mid); color:var(--accent-warm)}
/* Items with no page behind them yet read as labels, not as links. */
.abigroup__l span{color:var(--muted); background:transparent; border-style:dashed}

/* ----- Students corner: the institute's own note ----- */
.cornerdl{margin:0 .8rem .3rem; padding:0}
.cornerdl dt{
  font-family:var(--font-display); font-weight:700; font-size:.82rem;
  color:var(--blue-deep); margin-top:.7rem;
}
.cornerdl dt:first-child{margin-top:0}
.cornerdl dd{margin:.2rem 0 0; font-size:.82rem; line-height:1.55; color:var(--ink-soft)}
.cornerdl dd a{color:var(--blue-head); word-break:break-word}
.cornermore{
  display:inline-flex; align-items:center; gap:.4rem; margin:.9rem .8rem 1rem;
  font-family:var(--font-display); font-weight:700; font-size:.82rem;
  color:var(--blue-deep); text-decoration:none;
  border-bottom:2px solid var(--blue-head); padding-bottom:.12rem; align-self:flex-start;
}
.cornermore:hover{color:var(--accent-warm); border-color:var(--gold)}

/* ----- The two current cover pages, in the Publications column ----- */
.pubcovers{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.9rem}
.pubmore{display:flex; flex-wrap:wrap; gap:.3rem 1.4rem; margin-top:.4rem}
.pubcover{display:flex; flex-direction:column; text-decoration:none}
.pubcover img{
  display:block; width:100%; height:auto;
  border:1px solid var(--line); border-radius:var(--r-sm);
  box-shadow:var(--shadow-1);
  transition:transform .22s var(--ease), box-shadow .22s;
}
.pubcover:hover img{transform:translateY(-3px); box-shadow:var(--shadow-2)}
.pubcover__t{
  margin-top:.55rem;
  font-family:var(--font-display); font-weight:700; font-size:.82rem; line-height:1.3;
  color:var(--accent-ink);
}
.pubcover:hover .pubcover__t{color:var(--accent-warm)}
.pubcover__s{margin-top:.15rem; font-size:.72rem; line-height:1.35; color:var(--muted)}

@media (max-width:1000px){ .corners{grid-template-columns:repeat(2,1fr)} }
@media (max-width:700px){ .corners{grid-template-columns:minmax(0,1fr)} }

/* ---------- 17am. Student Corner ---------- */
.stprog{margin:0 0 2.8rem}
.stprog:last-child{margin-bottom:0}
.stfacts{
  list-style:none; margin:1.4rem 0 0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:.9rem;
}
.stfacts li{
  padding:.95rem 1.1rem;
  background:var(--surface); border:1px solid var(--line);
  border-left:3px solid var(--green-mid); border-radius:0 var(--r-md) var(--r-md) 0;
  box-shadow:var(--shadow-1);
}
.stfacts__k{
  display:block; margin-bottom:.3rem;
  font-family:var(--font-display); font-weight:700;
  font-size:.66rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent-warm);
}
.stfacts__v{display:block; font-size:.92rem; line-height:1.6; color:var(--ink-soft)}
.stapply{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.4rem}
.stapply__box{
  padding:1.5rem 1.6rem;
  background:var(--surface); border:1px solid var(--line);
  border-top:3px solid var(--gold); border-radius:var(--r-md); box-shadow:var(--shadow-1);
}
.stapply__k{
  margin:0 0 .6rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.68rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-warm);
}
.stapply__b{margin:0; font-size:.98rem; line-height:1.8; color:var(--ink-soft)}
.stapply__b a{color:var(--accent-ink); font-weight:600; word-break:break-word}
@media (max-width:820px){ .stapply{grid-template-columns:minmax(0,1fr)} }

/* Each corner card is now as tall as its own contents. Without this the grid
   stretches all three to match the tallest, and the extra height collects as a
   gap between the badge and the list beneath it. */
.corners{align-items:start}
/* The two covers differ in proportion, so hang their captions off the bottom
   instead of the foot of the taller image. */
.pubcover__t{margin-top:auto; padding-top:.55rem}

/* One form, one box — a single card should not sit in a half-width column. */
.dlgrid--one{grid-template-columns:minmax(0,1fr)}
.stapply--one{grid-template-columns:minmax(0,1fr); margin-top:2rem}

/* A stand-in for the scientists who supply no photograph — the same footprint
   as .scicard__photo so the card grid does not shift. */
.scicard__mono{
  display:grid; place-items:center;
  width:126px; height:152px; border-radius:var(--r-sm);
  border:1px solid var(--line); background:var(--surface);
  font-family:var(--font-display); font-weight:800; font-size:3.2rem; line-height:1;
  color:var(--accent-ink); opacity:.32;
}

/* ---------- 17an. Documentary figures ----------
   Diagrams, screenshots and facility photographs are read, not decorated: none
   may be cropped and none upscaled past its own resolution. Block 17q's
   .gallery does the opposite — a 4:3 box with object-fit:cover — so these
   carry their own component instead. */
.figset{display:grid; gap:1.2rem; margin:1.6rem 0 0}
.figset--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.docfig{
  display:flex; flex-direction:column; margin:0; overflow:hidden;
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-md); box-shadow:var(--shadow-1);
}
/* Grows so a pair of figures of unequal height still line their captions up. */
.docfig__m{flex:1; display:flex; align-items:center; justify-content:center; padding:.7rem; background:#fff}
.docfig img{
  display:block; margin:0 auto;
  width:auto;  max-width:100%;
  height:auto; max-height:760px;
  /* Both are resets of block 17q, which would otherwise crop to 4:3. */
  aspect-ratio:auto; object-fit:contain;
  border:0; border-radius:var(--r-sm); box-shadow:none;
}
.docfig figcaption{
  padding:.75rem 1rem; border-top:1px solid var(--line-soft);
  color:var(--muted); font-size:.88rem; line-height:1.5;
}
@media (max-width:760px){
  .figset--2{grid-template-columns:minmax(0,1fr)}
  .docfig img{max-height:520px}
}

/* ---------- 17ao. Dated events with their photographs ---------- */
.evlist{list-style:none; margin:0; padding:0; display:grid; gap:2.2rem}
.ev{padding-bottom:2.2rem; border-bottom:1px solid var(--line)}
.ev:last-child{padding-bottom:0; border-bottom:0}
.ev__head{display:grid; grid-template-columns:11rem minmax(0,1fr); gap:1.4rem; align-items:baseline}
.ev__date{
  font-family:var(--font-display); font-weight:800;
  font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--accent-warm);
}
.ev__what{margin:0; color:var(--ink-soft); font-size:1rem; line-height:1.75}
.ev .figset{margin-left:12.4rem}
.figset--1{grid-template-columns:minmax(0,1fr)}
.figset--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){
  .ev__head{grid-template-columns:minmax(0,1fr); gap:.35rem}
  .ev .figset{margin-left:0}
  .figset--3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:600px){
  .figset--3{grid-template-columns:minmax(0,1fr)}
}

/* Product photographs are of the product: keep the tile shape for the grid, but
   fit the whole thing inside it rather than cropping into it. */
.tilegrid--fit .tile__media{background:#fff}
.tilegrid--fit .tile__media img{object-fit:contain; padding:.4rem}
.tilegrid--fit .tile:hover .tile__media img{transform:none}

/* A lone photograph should not float in a full-width card. */
.ev .figset--1{max-width:34rem}

/* ---------- 17ap. Publication shelf ----------
   Three titles, one card each. The covers differ in proportion, so each sits
   whole on a fixed-height mount rather than being cropped to a common box. */
.pubshelf{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem;
}
.pubbook{
  display:flex; flex-direction:column;
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-md); box-shadow:var(--shadow-1); overflow:hidden;
  transition:transform .2s var(--ease), box-shadow .2s;
}
.pubbook:hover{transform:translateY(-3px); box-shadow:var(--shadow-2)}
.pubbook__cover{
  --mount:340px;
  display:flex; align-items:center; justify-content:center;
  height:var(--mount); padding:1.4rem;
  background:linear-gradient(180deg, var(--green-wash) 0%, var(--green-wash-2) 100%);
  border-bottom:1px solid var(--line-soft);
}
.pubbook__cover img{
  display:block; width:auto; max-width:100%; height:auto;
  /* A px cap, not 100%: a percentage max-height against a grid/flex area is not
     reliably resolved, and the tall pocket guide overflowed the mount. */
  max-height:calc(var(--mount) - 2.8rem);
  aspect-ratio:auto; object-fit:contain;
  border-radius:2px; box-shadow:0 6px 18px rgba(0,0,0,.22), 0 1px 0 rgba(0,0,0,.1);
}
.pubbook__body{padding:1.15rem 1.3rem 1.4rem}
.pubbook__kind{
  margin:0 0 .4rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.64rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-warm);
}
.pubbook__title{
  margin:0 0 .5rem;
  font-family:var(--font-display); font-weight:700;
  font-size:1rem; line-height:1.35; color:var(--accent-ink);
}
.pubbook__note{margin:0; color:var(--ink-soft); font-size:.86rem; line-height:1.6}
@media (max-width:900px){
  .pubshelf{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:620px){
  .pubshelf{grid-template-columns:minmax(0,1fr)}
  .pubbook__cover{--mount:300px}
}

/* Two formats of the same form sit side by side; the second is secondary. */
.dlcard__actions{display:flex; flex-wrap:wrap; gap:.6rem}

/* ---------- 17aq. Forms and circulars library ---------- */
.formbar{
  display:grid; gap:1rem; margin:0 0 2.2rem; padding:1.3rem 1.4rem;
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-md); box-shadow:var(--shadow-1);
}
.formbar__search{position:relative; display:flex; align-items:center}
.formbar__search svg{
  position:absolute; left:.95rem; width:18px; height:18px;
  fill:var(--muted); pointer-events:none;
}
.formbar__search input{
  width:100%; padding:.8rem 1rem .8rem 2.8rem;
  font:inherit; font-size:.98rem; color:var(--ink);
  background:var(--green-wash-2); border:1px solid var(--line); border-radius:999px;
}
.formbar__search input:focus{outline:2px solid var(--green-mid); outline-offset:1px; background:var(--surface)}
.formchips{display:flex; flex-wrap:wrap; gap:.45rem}
.formchip{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.42rem .85rem; cursor:pointer;
  background:transparent; border:1px solid var(--line); border-radius:999px;
  font-family:var(--font-display); font-weight:600; font-size:.82rem; color:var(--ink-soft);
  transition:background .16s, border-color .16s, color .16s;
}
.formchip span{
  padding:.05rem .38rem; border-radius:999px;
  background:var(--green-wash); color:var(--accent-ink);
  font-size:.7rem; font-weight:700;
}
.formchip:hover{border-color:var(--green-mid); color:var(--accent-ink)}
.formchip.is-on{background:var(--accent-ink); border-color:var(--accent-ink); color:#fff}
.formchip.is-on span{background:rgba(255,255,255,.2); color:#fff}
.formbar__count{margin:0; font-size:.84rem; color:var(--muted)}

.formgroup{margin:0 0 2rem}
.formgroup[hidden]{display:none}
.formgroup__t{
  display:flex; align-items:center; gap:.6rem;
  margin:0 0 .9rem; padding-bottom:.55rem; border-bottom:1px solid var(--line);
  font-family:var(--font-display); font-weight:700; font-size:1.02rem; color:var(--accent-ink);
}
.formgroup__t span{
  padding:.1rem .45rem; border-radius:999px;
  background:var(--green-wash); color:var(--accent-ink);
  font-size:.7rem; font-weight:700;
}
.formlist{list-style:none; margin:0; padding:0; display:grid; gap:.55rem}
.formrow{display:flex; align-items:stretch; gap:.5rem}
.formrow[hidden]{display:none}
.formrow__main{
  flex:1 1 auto; min-width:0;
  display:flex; align-items:center; gap:.9rem;
  padding:.75rem 1rem;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md);
  box-shadow:var(--shadow-1); text-decoration:none;
  transition:border-color .16s, box-shadow .16s, transform .16s;
}
.formrow__main:hover{border-color:var(--green-mid); box-shadow:var(--shadow-2); transform:translateX(2px)}
.formrow__kind{
  flex:none; min-width:3.1rem; text-align:center;
  padding:.2rem .4rem; border-radius:var(--r-sm);
  font-family:var(--font-display); font-weight:800; font-size:.68rem; letter-spacing:.04em;
  background:var(--green-wash); color:var(--accent-ink);
}
.formrow__kind--doc,.formrow__kind--docx{background:#e8f1fb; color:var(--blue-deep)}
.formrow__kind--jpg{background:#fdf3e3; color:var(--accent-warm)}
.formrow__t{
  flex:1 1 auto; min-width:0;
  display:flex; align-items:center; flex-wrap:wrap; gap:.5rem;
  font-size:.93rem; line-height:1.45; color:var(--ink-soft);
}
.formrow__main:hover .formrow__t{color:var(--accent-ink)}
.formrow__new{
  padding:.08rem .42rem; border-radius:999px;
  background:var(--gold); color:#3a2a00;
  font-family:var(--font-display); font-weight:800; font-size:.62rem;
  letter-spacing:.08em; text-transform:uppercase;
}
.formrow__go{flex:none; color:var(--accent-warm); font-weight:700; font-size:.9rem}
.formrow__alt{
  flex:none; display:flex; align-items:center; padding:0 .9rem;
  background:var(--green-wash-2); border:1px solid var(--green-mid); border-radius:var(--r-md);
  font-family:var(--font-display); font-weight:700; font-size:.72rem;
  color:var(--accent-ink); text-decoration:none;
}
.formrow__alt:hover{background:var(--green-wash)}
.formempty{
  margin:0; padding:1.6rem; text-align:center;
  color:var(--muted); font-size:.95rem;
  background:var(--surface); border:1px dashed var(--line); border-radius:var(--r-md);
}
.formempty[hidden]{display:none}

@media (max-width:560px){
  .formrow{flex-wrap:wrap}
  .formrow__alt{flex:1 1 100%; justify-content:center; padding:.5rem}
}

/* ---------- 17ar. Newly added forms ----------
   The handful the institute flags as new, lifted out of the 25 so they are not
   hunted for. They stay in their groups below as well. */
.newgrid{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.2rem;
}
.newcard{
  display:flex; flex-direction:column;
  padding:1.3rem 1.4rem 1.4rem;
  background:var(--surface); border:1px solid var(--line);
  border-top:3px solid var(--gold);
  border-radius:var(--r-md); box-shadow:var(--shadow-1);
  transition:transform .18s var(--ease), box-shadow .18s;
}
.newcard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2)}
.newcard__top{display:flex; align-items:center; justify-content:space-between; gap:.6rem; margin-bottom:.9rem}
.newcard__kind{
  padding:.2rem .5rem; border-radius:var(--r-sm);
  background:var(--green-wash); color:var(--accent-ink);
  font-family:var(--font-display); font-weight:800; font-size:.68rem; letter-spacing:.04em;
}
.newcard__kind--doc,.newcard__kind--docx{background:#e8f1fb; color:var(--blue-deep)}
.newcard__kind--jpg{background:#fdf3e3; color:var(--accent-warm)}
.newcard__flag{
  padding:.12rem .5rem; border-radius:999px;
  background:var(--gold); color:#3a2a00;
  font-family:var(--font-display); font-weight:800; font-size:.62rem;
  letter-spacing:.09em; text-transform:uppercase;
}
.newcard__t{
  margin:0 0 1.2rem;
  font-family:var(--font-display); font-weight:700;
  font-size:1rem; line-height:1.4; color:var(--accent-ink);
}
.newcard__go{
  margin-top:auto; align-self:flex-start;
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.5rem .95rem; border-radius:999px;
  background:var(--accent-ink); color:#fff; text-decoration:none;
  font-family:var(--font-display); font-weight:700; font-size:.8rem;
  transition:background .16s;
}
.newcard__go:hover{background:var(--accent-warm); color:#fff}

@media (max-width:1000px){ .newgrid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:560px){ .newgrid{grid-template-columns:minmax(0,1fr)} }

/* ---------- 17as. The "new" flag, animated ----------
   The institute marks these with an animated GIF; this is the same signal done
   in CSS — a slow gold pulse with a light sweep across the badge. The global
   prefers-reduced-motion rule above stills all of it. */
@keyframes newglow{
  0%,100%{box-shadow:0 0 0 0 rgba(230,168,42,.55)}
  50%    {box-shadow:0 0 0 5px rgba(230,168,42,0)}
}
@keyframes newsweep{
  0%  {transform:translateX(-130%)}
  55%,100%{transform:translateX(230%)}
}
@keyframes newrise{
  from{opacity:0; transform:translateY(14px)}
  to  {opacity:1; transform:none}
}

.formrow__new,.newcard__flag,.tender__new,.rti__new{
  position:relative; overflow:hidden;
  animation:newglow 2.4s ease-in-out infinite;
}
.formrow__new::after,.newcard__flag::after,.tender__new::after,.rti__new::after{
  content:""; position:absolute; inset:0 auto 0 0; width:38%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.85), transparent);
  animation:newsweep 2.4s ease-in-out infinite;
}
/* The badges in the list share one rhythm; the cards are offset so the four
   read as a set rather than a flash. */
.newcard:nth-child(2) .newcard__flag,
.newcard:nth-child(2) .newcard__flag::after{animation-delay:.18s}
.newcard:nth-child(3) .newcard__flag,
.newcard:nth-child(3) .newcard__flag::after{animation-delay:.36s}
.newcard:nth-child(4) .newcard__flag,
.newcard:nth-child(4) .newcard__flag::after{animation-delay:.54s}

.newcard{animation:newrise .5s var(--ease) both}
.newcard:nth-child(2){animation-delay:.07s}
.newcard:nth-child(3){animation-delay:.14s}
.newcard:nth-child(4){animation-delay:.21s}

/* ---------- 17at. Hero caption legibility ----------
   The side gradient alone is not enough when a slide is pale where the caption
   sits — the AGM photograph puts a white podium exactly there. A bottom scrim
   and a gold rule give every caption the same footing. */
.hero__slide::after{
  background:
    linear-gradient(90deg, rgba(8,30,16,.74) 0%, rgba(8,30,16,.34) 42%, rgba(8,30,16,0) 68%),
    linear-gradient(0deg,  rgba(8,30,16,.80) 0%, rgba(8,30,16,.30) 26%, rgba(8,30,16,0) 54%);
}
.hero__caption{
  border-left:3px solid var(--gold);
  padding-left:clamp(.9rem,1.6vw,1.35rem);
}
.hero__title{text-shadow:0 1px 3px rgba(0,0,0,.55), 0 3px 16px rgba(0,0,0,.5)}
.hero__eyebrow{text-shadow:none}

/* ---------- 17au. Tenders ----------
   Ten bid documents that all look alike in a table; as rows they carry their
   location, GeM number, month and size, and group under the month posted. */
.tenderbar{display:grid; gap:.85rem; margin:0 0 2.2rem}
.tenderchips{display:flex; flex-wrap:wrap; gap:.45rem}

.tmonth{margin:0 0 2.2rem}
.tmonth[hidden]{display:none}
.tmonth__t{
  display:flex; align-items:center; gap:.6rem;
  margin:0 0 1rem; padding-bottom:.55rem; border-bottom:1px solid var(--line);
  font-family:var(--font-display); font-weight:700; font-size:1.02rem; color:var(--accent-ink);
}
.tmonth__t span{
  padding:.1rem .45rem; border-radius:999px;
  background:var(--green-wash); color:var(--accent-ink);
  font-size:.7rem; font-weight:700;
}
.tmonth__new{
  padding:.12rem .5rem; border-radius:999px;
  background:var(--gold); color:#3a2a00; font-style:normal;
  font-family:var(--font-display); font-weight:800; font-size:.62rem;
  letter-spacing:.09em; text-transform:uppercase;
}

.tenderlist{list-style:none; margin:0; padding:0; display:grid; gap:.7rem}
.tender{
  display:grid; grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center; gap:1.1rem;
  padding:1rem 1.2rem;
  background:var(--surface); border:1px solid var(--line);
  border-left:3px solid var(--green-mid);
  border-radius:var(--r-md); box-shadow:var(--shadow-1);
  transition:border-color .16s, box-shadow .16s, transform .16s;
}
.tender:hover{box-shadow:var(--shadow-2); transform:translateX(2px)}
.tender[hidden]{display:none}
.tender__n{
  font-family:var(--font-display); font-weight:800; font-size:1.05rem;
  color:var(--accent-ink); opacity:.3;
}
.tender__t{
  margin:0 0 .45rem;
  font-family:var(--font-display); font-weight:700;
  font-size:.98rem; line-height:1.45; color:var(--accent-ink);
}
.tender__meta{display:flex; flex-wrap:wrap; gap:.4rem .55rem; margin:0; font-size:.76rem}
.tender__meta span{
  padding:.14rem .5rem; border-radius:999px;
  background:var(--green-wash-2); color:var(--ink-soft);
  border:1px solid var(--line-soft); line-height:1.5;
}
.tender__place{
  background:var(--green-wash)!important; color:var(--accent-ink)!important;
  font-weight:700;
}
.tender__gem{font-variant-numeric:tabular-nums}
.tender__gem--plain{font-style:italic}
.tender__close{color:var(--muted)!important}
.tender__go{
  flex:none; display:inline-flex; align-items:center; gap:.45rem; white-space:nowrap;
  padding:.55rem 1rem; border-radius:999px;
  background:var(--accent-ink); color:#fff; text-decoration:none;
  font-family:var(--font-display); font-weight:700; font-size:.82rem;
  transition:background .16s;
}
.tender__go em{font-style:normal; font-weight:600; opacity:.72; font-size:.74rem}
.tender__go:hover{background:var(--accent-warm); color:#fff}
.tenderempty{
  margin:0 0 2rem; padding:1.6rem; text-align:center;
  color:var(--muted); font-size:.95rem;
  background:var(--surface); border:1px dashed var(--line); border-radius:var(--r-md);
}
.tenderempty[hidden]{display:none}

@media (max-width:760px){
  .tender{grid-template-columns:auto minmax(0,1fr); row-gap:.85rem}
  .tender__go{grid-column:1 / -1; justify-content:center}
}

/* Titles like "Chemicals/Glassware/Plasticware/Sequencing" have no spaces to
   break at, and pushed the row wider than a phone at 414px and below. */
.tender__body{min-width:0}
.tender__t{overflow-wrap:anywhere}
.tender__meta span{overflow-wrap:anywhere}
@media (max-width:420px){
  .tender__go{white-space:normal; text-align:center}
}

/* The institute flags every open tender as new, so the badge sits inline after
   each title and shares the pulse/sweep from block 17as. */
.tender__new{
  display:inline-block; margin-left:.55rem; vertical-align:middle;
  padding:.1rem .46rem; border-radius:999px;
  background:var(--gold); color:#3a2a00;
  font-family:var(--font-display); font-weight:800; font-size:.6rem;
  letter-spacing:.09em; text-transform:uppercase;
}
/* Staggered so ten badges read as a list, not a strobe. */
.tender:nth-child(2n) .tender__new,.tender:nth-child(2n) .tender__new::after{animation-delay:.3s}
.tender:nth-child(3n) .tender__new,.tender:nth-child(3n) .tender__new::after{animation-delay:.6s}
.tender:nth-child(4n) .tender__new,.tender:nth-child(4n) .tender__new::after{animation-delay:.9s}

/* ---------- 17av. RTI disclosures ----------
   A statutory list: the numbering is the institute's and must stay visible, so
   these are numbered rows rather than a table. Entries recorded NIL are not
   links and are styled so they read as "nothing to disclose", not as broken. */
.rtilist{list-style:none; margin:0; padding:0; display:grid; gap:.55rem; counter-reset:none}
.rti{
  display:grid; grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center; gap:1rem;
  padding:.85rem 1.1rem;
  background:var(--surface); border:1px solid var(--line);
  border-left:3px solid var(--green-mid);
  border-radius:var(--r-md); box-shadow:var(--shadow-1);
  transition:border-color .16s, box-shadow .16s, transform .16s;
}
.rti:hover{box-shadow:var(--shadow-2); transform:translateX(2px)}
.rti--nil{
  border-left-color:var(--line); background:var(--green-wash-2);
  box-shadow:none;
}
.rti--nil:hover{transform:none; box-shadow:none}
.rti__n{
  font-family:var(--font-display); font-weight:800; font-size:.95rem;
  color:var(--accent-ink); opacity:.32; font-variant-numeric:tabular-nums;
}
.rti__t{
  min-width:0; font-size:.95rem; line-height:1.5; color:var(--ink-soft);
  text-decoration:none; overflow-wrap:anywhere;
}
a.rti__t:hover{color:var(--accent-ink); text-decoration:underline; text-underline-offset:3px}
.rti--nil .rti__t{color:var(--muted)}
.rti__kind{
  flex:none; padding:.18rem .55rem; border-radius:999px; white-space:nowrap;
  font-family:var(--font-display); font-weight:700; font-size:.66rem;
  letter-spacing:.06em; text-transform:uppercase;
}
.rti__kind--pdf{background:var(--gold); color:#3a2a00}
.rti__kind--page{background:var(--green-wash); color:var(--accent-ink)}
.rti__kind--nil{background:transparent; color:var(--muted); border:1px dashed var(--line)}
.rti__new{
  display:inline-block; margin-left:.5rem; vertical-align:middle;
  padding:.1rem .46rem; border-radius:999px;
  background:var(--gold); color:#3a2a00;
  font-family:var(--font-display); font-weight:800; font-size:.6rem;
  letter-spacing:.09em; text-transform:uppercase;
}
@media (max-width:600px){
  .rti{grid-template-columns:auto minmax(0,1fr); row-gap:.55rem}
  .rti__kind{grid-column:2; justify-self:start}
}

/* ---------- 17aw. Jobs ----------
   Reuses the tender row; adds the featured current notice and the muted row for
   the one archive entry the institute publishes without a document. */
.jobnow{
  display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:1.6rem;
  position:relative; padding:1.7rem 1.9rem;
  background:linear-gradient(135deg, var(--accent-ink) 0%, #123f22 100%);
  border-radius:var(--r-lg); box-shadow:var(--shadow-2);
  text-decoration:none; overflow:hidden;
  transition:transform .2s var(--ease), box-shadow .2s;
}
.jobnow:hover{transform:translateY(-3px); box-shadow:0 18px 40px rgba(8,30,16,.28)}
.jobnow__flag{
  position:absolute; top:1.1rem; right:1.3rem;
  padding:.14rem .55rem; border-radius:999px;
  background:var(--gold); color:#3a2a00;
  font-family:var(--font-display); font-weight:800; font-size:.62rem;
  letter-spacing:.09em; text-transform:uppercase;
}
.jobnow__k{
  margin:0 0 .35rem;
  font-family:var(--font-display); font-weight:800;
  font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:#ffe6a6;
}
.jobnow__t{
  margin:0 0 .55rem;
  font-family:var(--font-display); font-weight:800; color:#fff;
  font-size:clamp(1.3rem,2.4vw,1.85rem); line-height:1.2; letter-spacing:-.01em;
}
.jobnow__s{margin:0; color:rgba(255,255,255,.82); font-size:.94rem; line-height:1.7; max-width:56ch}
.jobnow__go{
  flex:none; display:inline-flex; align-items:center; gap:.5rem; white-space:nowrap;
  padding:.7rem 1.3rem; border-radius:999px;
  background:#fff; color:var(--accent-ink);
  font-family:var(--font-display); font-weight:700; font-size:.88rem;
}
.jobnow__go em{font-style:normal; font-weight:600; opacity:.6; font-size:.78rem}
.jobnow:hover .jobnow__go{background:var(--gold); color:#3a2600}

.jyear{margin:0 0 2.2rem}
.jyear[hidden]{display:none}
/* The entry with no document is not a dead link — it reads as a plain notice. */
.tender--none{border-left-color:var(--line); background:var(--green-wash-2); box-shadow:none}
.tender--none:hover{transform:none; box-shadow:none}
.tender--none .tender__t{color:var(--ink-soft); font-weight:600}
.jobempty{
  margin:0 0 2rem; padding:1.6rem; text-align:center;
  color:var(--muted); font-size:.95rem;
  background:var(--surface); border:1px dashed var(--line); border-radius:var(--r-md);
}
.jobempty[hidden]{display:none}

@media (max-width:780px){
  .jobnow{grid-template-columns:minmax(0,1fr); gap:1.2rem}
  .jobnow__go{justify-content:center}
}

/* ---------- 17ay. Research highlight cards (pulse-gem.php, plant-biotechnology.php salient achievements) ----------
   One card per achievement: numbered head, prose, optional key-figure chips, source citation, and a
   figure set that never crops (figures are chromatograms / infographics). */
.rhlist{display:grid; gap:1.6rem}
.rhl{
  background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--green);
  border-radius:var(--r-md); box-shadow:var(--shadow-1); padding:1.6rem 1.7rem; min-width:0;
  transition:box-shadow .22s var(--ease), border-color .22s;
}
.rhl:hover{box-shadow:var(--shadow-2); border-left-color:var(--gold)}
.rhl__head{display:flex; align-items:flex-start; gap:.85rem; margin:0 0 .9rem}
.rhl__n{
  flex:none; width:2.1rem; height:2.1rem; border-radius:50%; display:grid; place-items:center;
  background:var(--green-deep); color:#fff; font:700 .92rem/1 var(--font-display);
}
.rhl__t{margin:0; font:700 1.14rem/1.4 var(--font-display); color:var(--accent-ink); padding-top:.25rem; overflow-wrap:anywhere; min-width:0}
.rhl__body{color:var(--ink-soft); line-height:1.8}
.rhl__body p{margin:0 0 .8rem}
.rhl__body p:last-child{margin-bottom:0}
.rhl__stats{list-style:none; margin:1.1rem 0 0; padding:0; display:flex; flex-wrap:wrap; gap:.6rem}
.rhl__stats li{
  background:var(--green-wash); border:1px solid var(--line); border-radius:999px; padding:.4rem .9rem;
  font-size:.86rem; color:var(--ink-soft); min-width:0; overflow-wrap:anywhere;
}
.rhl__stats b{color:var(--accent-ink); font-family:var(--font-display)}
.rhl__cite{margin:1rem 0 0; font-size:.84rem; color:var(--muted)}
.rhl__cite span{display:inline-block; background:var(--paper); border:1px solid var(--line); border-radius:var(--r-sm); padding:.15rem .55rem; margin:.15rem .3rem .15rem 0; color:var(--accent-warm); font-weight:600}
.rhl--split{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:1.8rem; align-items:start}
.rhl--split .rhl__figs{margin-top:0}
.rhl__figs{display:grid; gap:1.2rem; margin-top:1.4rem; grid-template-columns:minmax(0,1fr)}
.rhl__figs--2{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); align-items:start}
.rhl__fig{margin:0; background:var(--paper); border:1px solid var(--line); border-radius:var(--r-sm); padding:.7rem; min-width:0}
.rhl__fig a{display:block}
.rhl__fig img{display:block; width:100%; height:auto; aspect-ratio:auto; object-fit:contain; border-radius:4px; background:#fff}
.rhl__fig figcaption{margin-top:.6rem; font-size:.84rem; line-height:1.55; color:var(--muted); text-align:center}
.rhl__fig figcaption b{color:var(--accent-ink)}
@media (max-width:900px){
  .rhl--split,.rhl__figs--2{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:520px){
  .rhl{padding:1.2rem 1.1rem}
  .rhl__t{font-size:1.02rem}
}
/* SDG panel commitment line (17ay) */
.sdgpanel__lead{margin:-.2rem 0 .75rem; font-weight:600; font-style:italic; color:var(--accent-warm); line-height:1.6}
.sdgpanel li{line-height:1.7}

/* ---------- 17az. Mandate crop photo grid (mandate.php) ---------- */
.cropgrid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.1rem}
.cropfig{
  margin:0; display:flex; flex-direction:column; overflow:hidden; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r-md); box-shadow:var(--shadow-1);
  transition:transform .2s var(--ease), box-shadow .2s, border-color .2s;
}
.cropfig:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-color:var(--green-bright)}
.cropfig__media{aspect-ratio:4/3; overflow:hidden; background:var(--green-wash); display:grid; place-items:center}
.cropfig__media img{display:block; width:100%; height:100%; object-fit:cover; transition:transform .4s var(--ease)}
.cropfig:hover .cropfig__media img{transform:scale(1.06)}
.cropfig__media svg{width:36%; height:auto; color:var(--green-mid); opacity:.8}
.cropfig__label{
  display:flex; align-items:center; justify-content:center; gap:.55rem; padding:.72rem .8rem .78rem;
  font-family:var(--font-display); font-weight:700; font-size:1rem; line-height:1.3; color:var(--accent-ink);
}
.cropfig__n{
  flex:none; width:1.55rem; height:1.55rem; display:grid; place-items:center; border-radius:50%;
  background:var(--green-deep); color:#fff; font-size:.74rem; font-weight:700;
}
@media (max-width:1000px){ .cropgrid{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:640px){ .cropgrid{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ---------- 17ba. Equipment gallery with larger captions (plant-biotechnology.php) ---------- */
.gallery--captions-lg figcaption{
  font-size:1.08rem; font-weight:600; color:var(--accent-ink); line-height:1.45; padding:.85rem 1rem .95rem;
}

/* ---------- 17bb. Pulses Innovation Hub (abi.php) ---------- */
.abiabout{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:2rem; align-items:start}
.abiabout__logos{display:grid; gap:1rem; justify-items:center}
.abiabout__logos img{max-width:220px; width:100%; height:auto}
.abiabout__logos img + img{max-width:150px}
.abidomains{display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:2rem; align-items:center}
.abidomains__fig{margin:0}
.abidomains__fig img{width:100%; height:auto; border-radius:50%; box-shadow:var(--shadow-2)}
.cta{
  display:flex; align-items:center; justify-content:space-between; gap:1.4rem; flex-wrap:wrap;
  padding:1.3rem 1.5rem; background:var(--surface); border:1px solid var(--line);
  border-left:5px solid var(--green); border-radius:var(--r-md); box-shadow:var(--shadow-1);
}
.cta__title{margin:0; font-family:var(--font-display); font-weight:700; font-size:1.08rem; color:var(--accent-ink)}
.cta__sub{margin:.25rem 0 0; color:var(--ink-soft); line-height:1.6}
.abistages{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1.1rem; counter-reset:stage}
.abistage{
  position:relative; padding:1.2rem 1.1rem 1.1rem; background:var(--surface); border:1px solid var(--line);
  border-top:4px solid var(--green); border-radius:var(--r-md); box-shadow:var(--shadow-1);
  transition:transform .2s var(--ease), box-shadow .2s;
}
.abistage:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-top-color:var(--gold)}
.abistage__n{
  display:grid; place-items:center; width:2.1rem; height:2.1rem; border-radius:50%;
  background:var(--green-deep); color:#fff; font-family:var(--font-display); font-weight:800; font-size:.95rem;
}
.abistage__t{margin:.75rem 0 .5rem; font-family:var(--font-display); font-weight:700; font-size:1.02rem; color:var(--accent-ink); line-height:1.3}
.abistage .bullets li{font-size:.9rem}
.abiact + .abiact{margin-top:2rem}
.abiact .subhead{margin:0 0 .9rem}
.abiteam{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:1.1rem}
.abiperson{
  text-align:center; padding:1.3rem .9rem 1.1rem; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r-md); box-shadow:var(--shadow-1); transition:transform .2s var(--ease), box-shadow .2s;
}
.abiperson:hover{transform:translateY(-3px); box-shadow:var(--shadow-2)}
.abiperson__photo{width:120px; height:120px; border-radius:50%; object-fit:cover; display:block; margin:0 auto .8rem; background:var(--green-wash)}
.abiperson__name{margin:0; font-family:var(--font-display); font-weight:700; font-size:.98rem; color:var(--accent-ink); line-height:1.3}
.abiperson__role{margin:.3rem 0 0; font-size:.84rem; color:var(--muted); line-height:1.4}
@media (max-width:1100px){
  .abistages{grid-template-columns:repeat(3,minmax(0,1fr))}
  .abiteam{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:860px){
  .abiabout,.abidomains{grid-template-columns:1fr}
  .abidomains__fig{max-width:320px; margin:0 auto}
}
@media (max-width:640px){
  .abistages{grid-template-columns:1fr}
  .abiteam{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------- 17bc. Division "About" spread (plant-biotechnology.php) ----------
   The introduction runs beside its four key figures, so the text column and
   the figures share one width instead of a narrow paragraph over a wide row. */
.divabout{display:grid; grid-template-columns:minmax(0,1fr) 400px; gap:2.4rem; align-items:start}
.divabout .prose p{max-width:none}
.divabout__facts{grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin:0; position:sticky; top:6rem}
.divabout__facts .fact{min-height:132px; display:flex; flex-direction:column; justify-content:center}
@media (max-width:1100px){ .divabout{grid-template-columns:minmax(0,1fr) 320px} }
@media (max-width:860px){
  .divabout{grid-template-columns:1fr}
  .divabout__facts{position:static; grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:560px){ .divabout__facts{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* Facilities & equipment cards with larger, more legible text. */
.orggrid--lg .orgcard__name{font-size:1.08rem; line-height:1.35}
.orggrid--lg .orgcard__note{font-size:1rem; line-height:1.65; color:var(--ink-soft); margin-top:.4rem}

/* Paired tables (.biktables) share a row, so they fit their column instead of forcing the 660px table minimum. */
.biktables .dtable{min-width:0; table-layout:fixed}
.biktables .dtable th,.biktables .dtable td{white-space:normal; word-break:break-word}

/* ---------- 17bd. Mobile masthead: logo and Menu button share one row ----------
   The button is ~93px wide plus the 21px gap, so the logo must leave at least
   114px; the earlier 106-118px allowances let the button wrap onto its own line. */
@media (max-width:1180px){
  .masthead__inner{gap:.8rem 1rem}
  .brandmark{width:calc(100% - 116px); max-width:700px}
  .navtoggle{flex:0 0 auto; margin-left:auto}
}
@media (max-width:640px){ .brandmark{width:calc(100% - 116px)} }
@media (max-width:430px){ .brandmark{width:calc(100% - 112px)} }

/* Certificate metadata rows wrap on narrow cards instead of overflowing. */
.certmeta li{flex-wrap:wrap}
.certmeta span{overflow-wrap:anywhere; min-width:0}
@media (max-width:480px){ .certmeta span{text-align:left; flex:1 1 100%} }

/* Research focus panel directly under its card on a one-column layout. */
@media (max-width:760px){ .focus{margin-top:-.4rem} }

/* Certificate cards: one per row on phones (the inline 4-column grid is for desktop). */
@media (max-width:640px){ .certgrid{grid-template-columns:1fr!important} .certcard__media img{height:auto; max-height:320px} }
@media (min-width:641px) and (max-width:900px){ .certgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important} }

/* SDG tiles: the five icons are supplied at slightly different sizes, so give every tile the same square box. */
.sdggrid button{aspect-ratio:1/1; display:block}
.sdggrid img{width:100%; height:100%; object-fit:cover}

/* ---------- 17be. Crop Protection: achievements with figures, formulation cards ---------- */
.achlist{display:grid; gap:1rem}
.ach{display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:1.2rem; align-items:center; padding:1rem 1.1rem; background:var(--green-wash); border-radius:var(--r-md)}
.ach--text{grid-template-columns:1fr}
.ach__text{margin:0; color:var(--ink-soft); line-height:1.75}
.ach__fig{margin:0; text-align:center}
.ach__fig img{display:block; width:100%; max-height:200px; object-fit:contain; background:#fff; border-radius:var(--r-sm, 8px); border:1px solid var(--line)}
.ach__fig figcaption{margin-top:.45rem; font-size:.8rem; color:var(--muted); line-height:1.4}
.figgal{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-top:1.2rem}
.figgal figure{margin:0; background:#fff; border:1px solid var(--line); border-radius:var(--r-md); padding:.6rem}
.figgal img{display:block; width:100%; height:auto; max-height:260px; object-fit:contain}
.figgal figcaption{margin-top:.5rem; font-size:.82rem; color:var(--muted); text-align:center; line-height:1.4}
.biogrid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem}
.biocard{display:grid; grid-template-columns:150px minmax(0,1fr); background:var(--surface); border:1px solid var(--line); border-left:5px solid var(--green); border-radius:var(--r-md); box-shadow:var(--shadow-1); overflow:hidden; transition:transform .2s var(--ease), box-shadow .2s}
.biocard:hover{transform:translateY(-3px); box-shadow:var(--shadow-2); border-left-color:var(--gold)}
.biocard--nopic{grid-template-columns:1fr}
.biocard__media{display:grid; place-items:center; padding:1rem; background:var(--green-wash); border-right:1px solid var(--line)}
.biocard__media img{max-width:100%; max-height:170px; object-fit:contain}
.biocard__body{padding:1.1rem 1.25rem 1.2rem}
.biocard__name{margin:0 0 .5rem; display:flex; align-items:center; gap:.6rem; font-family:var(--font-display); font-weight:700; font-size:1.06rem; color:var(--accent-ink); line-height:1.3}
.biocard__n{flex:none; width:1.7rem; height:1.7rem; display:grid; place-items:center; border-radius:50%; background:var(--green-deep); color:#fff; font-size:.78rem}
.biocard__desc{margin:0; color:var(--ink-soft); line-height:1.7; font-size:.95rem}
@media (max-width:1100px){ .ach{grid-template-columns:minmax(0,1fr) 220px} }
@media (max-width:860px){
  .biogrid{grid-template-columns:1fr}
  .figgal{grid-template-columns:1fr}
  .ach{grid-template-columns:1fr}
  .ach__fig{max-width:360px; margin:0 auto}
}
@media (max-width:480px){ .biocard{grid-template-columns:1fr} .biocard__media{border-right:0; border-bottom:1px solid var(--line)} }

/* ---------- 17bf. State-wise advisory: detail panel in place of the map ---------- */
.advisory__pane{position:relative; min-width:0; align-self:stretch}
.advisory__pane .advisory__map{height:100%}
.advdetail{
  display:flex; flex-direction:column; height:100%; max-height:420px; min-height:300px;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden;
  animation:slide-down .25s var(--ease);
}
.advdetail__head{display:flex; align-items:flex-start; justify-content:space-between; gap:.8rem; padding:.85rem 1rem .7rem; background:var(--green-wash); border-bottom:1px solid var(--line)}
.advdetail__eyebrow{margin:0; font-family:var(--font-display); font-weight:700; font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:var(--green)}
.advdetail__title{margin:.15rem 0 0; font-family:var(--font-display); font-weight:800; font-size:1.05rem; line-height:1.25; color:var(--accent-ink)}
.advdetail__sep{color:var(--gold); margin:0 .2rem}
.advdetail__count{margin:.2rem 0 0; font-size:.78rem; color:var(--muted)}
.advdetail__back{flex:none; width:2rem; height:2rem; border:1px solid var(--line); border-radius:50%; background:#fff; color:var(--accent-ink); font-size:1.1rem; line-height:1; cursor:pointer}
.advdetail__back:hover{background:var(--green-wash-2); border-color:var(--green-mid)}
.advdetail__list{list-style:none; margin:0; padding:.7rem .8rem; display:grid; gap:.55rem; overflow:auto; flex:1}
.advdetail__list .advcard{
  display:grid; gap:.3rem; padding:.65rem .8rem .7rem;
  background:var(--green-wash-2); border:1px solid var(--line-soft); border-left:4px solid var(--gold); border-radius:var(--r-sm);
}
.advcard__name{font-family:var(--font-display); font-weight:700; font-size:.95rem; color:var(--accent-ink); line-height:1.3}
.advcard__metas{display:flex; flex-wrap:wrap; gap:.25rem .9rem; font-size:.8rem; color:var(--ink-soft)}
.advcard__meta b,.advcard__area b{font-weight:700; color:var(--muted); font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; margin-right:.25rem}
.advcard__area{font-size:.8rem; color:var(--ink-soft); line-height:1.45}
.advcard__link{font-size:.8rem; font-weight:700; color:var(--green); text-decoration:none; justify-self:start}
.advcard__link:hover{text-decoration:underline}
.advcard__link svg{width:12px; height:12px; vertical-align:-1px}
.advdetail__list .advisory__empty{background:var(--surface); border:1px dashed var(--line); color:var(--muted); font-size:.86rem; line-height:1.5; padding:.7rem .8rem; border-radius:var(--r-sm)}
.advdetail__more{display:block; padding:.65rem 1rem; border-top:1px solid var(--line); background:var(--green-wash); font-family:var(--font-display); font-weight:700; font-size:.82rem; color:var(--accent-ink); text-decoration:none}
.advdetail__more:hover{background:var(--green-wash-2)}
.advisory__result li.advisory__empty{background:var(--surface); border:1px dashed var(--line); color:var(--muted); font-size:.84rem; line-height:1.45}
.advisory__result li.advisory__empty::before{display:none}
#advView[disabled]{opacity:.55; cursor:not-allowed}
.varcard.is-target{outline:3px solid var(--gold); outline-offset:3px}
@media (max-width:640px){ .advdetail{max-height:none} }
.advisory__result li.advisory__more{background:none; color:var(--green); font-weight:700; font-size:.82rem}
.advisory__result li.advisory__more::before{display:none}
/* The pane shows either the map or the detail panel, never both; the map keeps its natural height. */
.advdetail[hidden],.advisory__map[hidden]{display:none!important}
.advisory__pane .advisory__map{height:auto}
.advisory__pane{align-self:start}
@media (max-width:640px){ .advdetail{max-height:70vh} }

/* ---------- 17bg. State-wise advisory: live map pane ---------- */
.advmap{display:flex; flex-direction:column; height:100%; min-height:360px; border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; background:#f3f7f1}
.advmap[hidden]{display:none!important}
.advmap__canvas{flex:1; min-height:300px}
.advmap__bar{display:flex; align-items:center; justify-content:space-between; gap:.8rem; padding:.6rem .8rem; background:var(--green-wash); border-top:1px solid var(--line)}
.advmap__info{font-size:.84rem; color:var(--ink-soft); line-height:1.4}
.advmap__info b{color:var(--accent-ink)}
.advmap__all{flex:none}
.advmap__all[hidden]{display:none}
.advmap__bubble{font:600 .85rem/1.4 var(--font-body, sans-serif); color:#1a2b1f; padding:.1rem .2rem}
.gm-style .gm-style-iw-c{border-radius:10px; padding:10px 14px!important}
.gm-style .gm-style-iw-d{overflow:hidden!important}
@media (max-width:640px){ .advmap{min-height:320px} .advmap__canvas{min-height:260px} }.advmap__canvas.is-unavailable{display:grid; place-items:center; padding:1.5rem; background:var(--green-wash)}
.advmap__fallback{max-width:28ch; text-align:center; font-size:.9rem; line-height:1.6; color:var(--ink-soft)}

/* Leaflet fallback pins and popup */
.advmap__pin{background:none!important; border:0!important}
.advmap__pin svg{display:block; filter:drop-shadow(0 1px 2px rgba(0,0,0,.25))}
.leaflet-container{font-family:inherit; background:#dfe9ea}
.leaflet-popup-content{margin:.6rem .9rem}
.leaflet-popup-content-wrapper{border-radius:10px}

/* Google draws in a hidden layer until its tiles arrive; the pane shows a quiet loading note meanwhile. */
.advmap__canvas{position:relative}
.advmap__layer{position:absolute; inset:0; visibility:hidden}
.advmap__layer.is-visible{visibility:visible}
.advmap__canvas.is-loading::after{content:attr(data-loading); position:absolute; inset:0; display:grid; place-items:center; font-size:.9rem; color:var(--muted); background:#eef3ee; pointer-events:none}
.advmap__canvas.is-ready.is-loading::after{display:none}

/* ---------- 17bh. Publications covers: equal-height cards ---------- */
/* The two cover scans differ in proportion (A4 report, squarer newsletter), so each
   sits in the same 3:4 frame, cropped from the top edge, inside a matching card. */
.pubcovers{gap:1rem; align-items:stretch}
.pubcover{
  border:1px solid var(--line); border-radius:var(--r-lg); background:var(--surface);
  box-shadow:var(--shadow-1); overflow:hidden;
  transition:transform .22s var(--ease), box-shadow .22s;
}
.pubcover:hover{transform:translateY(-3px); box-shadow:var(--shadow-2)}
.pubcover img{
  aspect-ratio:3 / 4; height:auto; object-fit:cover; object-position:top center;
  border:0; border-radius:0; box-shadow:none; transform:none; transition:none;
  border-bottom:1px solid var(--line); background:#f3f6f3;
}
.pubcover:hover img{transform:none; box-shadow:none}
.pubcover__t{margin-top:0; padding:.7rem .8rem 0; font-size:.86rem}
.pubcover__s{padding:0 .8rem .75rem; margin-top:.2rem}
.pubcover__t:last-child{padding-bottom:.75rem}
.three__col .pubcard__meta{margin-top:.9rem; font-size:.84rem}
.three__col .pubmore{margin-top:.55rem; padding-top:.7rem; border-top:1px solid var(--line)}

/* ---------- 17bi. External links: full-width auto-scrolling strip ---------- */
/* The list is rendered twice and slides left by exactly half its width, so the
   loop is seamless. It pauses under the pointer or keyboard focus; readers who
   prefer reduced motion get a still, swipeable row instead. */
.extwrap--marquee{display:block; width:100%; overflow:hidden; padding-block:.4rem;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.extwrap--marquee .ext{
  width:max-content; overflow:visible; flex:none; padding:.6rem 0; gap:1.2rem; padding-right:1.2rem;
  animation:ext-marquee var(--ext-dur,40s) linear infinite; will-change:transform;
}
.extwrap--marquee:hover .ext,.extwrap--marquee:focus-within .ext{animation-play-state:paused}
@keyframes ext-marquee{from{transform:translateX(0)} to{transform:translateX(-50%)}}
/* The strip keeps moving even under a reduced-motion setting (the client asked for
   autoplay); it still pauses on hover and focus, and the logos stay reachable. */
@media (prefers-reduced-motion:reduce){
  .extwrap--marquee .ext{animation:ext-marquee var(--ext-dur,40s) linear infinite!important}
  .extwrap--marquee:hover .ext,.extwrap--marquee:focus-within .ext{animation-play-state:paused!important}
}

/* ---------- 17bj. Statutory pages: intro paragraph and official details ---------- */
.docintro{font-size:1.05rem; line-height:1.7; color:var(--ink-soft); margin:0 0 1.8rem; padding:1rem 1.2rem; border-left:4px solid var(--gold); background:var(--green-wash); border-radius:0 var(--r-md) var(--r-md) 0}
.docsec--official{margin-top:2.2rem; padding-top:1.8rem; border-top:1px solid var(--line)}
.officialdl{display:grid; grid-template-columns:max-content minmax(0,1fr); gap:.45rem 1.4rem; margin:1rem 0 0; font-size:.95rem}
.officialdl dt{font-family:var(--font-display); font-weight:700; color:var(--accent-ink)}
.officialdl dd{margin:0; color:var(--ink-soft); overflow-wrap:anywhere}
.officialdl a{color:var(--accent-ink-2); font-weight:600}
.officialdl a:hover{text-decoration:underline}
@media (max-width:600px){ .officialdl{grid-template-columns:minmax(0,1fr); gap:.1rem 0} .officialdl dd{margin-bottom:.6rem} }

/* ---------- 17bk. Consistent type across the site ----------
   Same face, weight, size and colour for every title, heading, sub-heading and
   body line, whichever page template produced it. Layout is untouched. */
:root{--t-page:clamp(1.5rem,3vw,2.2rem); --t-section:clamp(1.5rem,2.6vw,2.05rem); --t-sub:1.1rem; --t-body:1rem; --t-small:.875rem; --t-eyebrow:.72rem}
.pagehead__title{font-family:var(--font-display); font-weight:700; font-size:var(--t-page); color:#fff}
.secthead__title,.dochead__t{font-family:var(--font-display); font-weight:700; font-size:var(--t-section); color:var(--accent-ink)}
.secthead--bar .secthead__title{font-size:1.25rem}
.themecard__t,.achgroup__head,.docsec__t,.scicard__name,.orgcard__name,.infocard__head,.rhl__head,.profile__name,.profilecard__name,.profileblock__h,.pubcover__t,.abi__title,.corner__head,.clauses__h,.ccard__t,.xlink__t,.yearblock__y,.pubfeat__t{font-family:var(--font-display); font-weight:700; font-size:var(--t-sub); line-height:1.3; color:var(--accent-ink)}
.prose p,.prose li,.docsec__b,.clauses__b,.biocard__desc,.orgcard__note,.secthead__sub,.docfoot__t,.docintro,.officialdl{font-size:var(--t-body); line-height:1.65; color:var(--ink-soft)}
.secthead__sub{color:var(--muted)}
.secthead__eyebrow,.dochead__k,.docnav__label,.abigroup__k,.docsec__n,.doctoc__label,.themecard__sub,.scisub{font-family:var(--font-display); font-weight:700; text-transform:uppercase; letter-spacing:.14em; font-size:var(--t-eyebrow); color:var(--accent-ink-2)}
.pubcard__meta,.rhl__cite,.srcnote,.profile__dept,.profilecard__disc,.fact__l,.dochead__meta{font-size:var(--t-small); color:var(--muted)}
.scicard__role,.profile__role,.profilecard__role{font-size:var(--t-small); font-weight:600; color:var(--accent-ink-2)}
.prose h2{font-size:var(--t-section)} .prose h3{font-size:1.3rem} .prose h4{font-size:var(--t-sub)}
.prose h2,.prose h3,.prose h4{font-family:var(--font-display); font-weight:700; color:var(--accent-ink); line-height:1.25}
[data-theme="contrast"] .themecard__t,[data-theme="contrast"] .docsec__t,[data-theme="contrast"] .secthead__eyebrow{color:#000}
[data-theme="dark"] .prose p,[data-theme="dark"] .prose li,[data-theme="dark"] .docsec__b,[data-theme="dark"] .clauses__b{color:var(--ink-soft)}
/* Sub-headings that older rules sized on their own. */
main .orgcard__name,main .biocard__name,main .subhead,.orggrid--lg .orgcard__name{font-family:var(--font-display); font-weight:700; font-size:var(--t-sub); line-height:1.3; color:var(--accent-ink)}
.scicard__field p,.scicard__mails{font-size:var(--t-small)}

/* ---------- 17am. Home corner cards: one profile-card design for all three ----------
   Ringed circular image with an icon badge, centred title / sub-title / rule,
   then the card's own content and a centred footer link pinned to the bottom. */
.corners{align-items:start; gap:1.4rem}
.corner{
  position:relative; align-items:center; text-align:center; padding:1.9rem 1.25rem 1.35rem;
  background:#fff; border:1px solid #e3eae5; border-radius:18px; overflow:visible;
  box-shadow:0 6px 22px rgba(20,60,40,.07);
}
.corner:hover{transform:translateY(-4px); box-shadow:0 12px 30px rgba(20,60,40,.12)}
.corner__media{position:relative; display:block; width:164px; height:164px; margin:0 auto 1.15rem; text-decoration:none}
.corner__ring{
  display:block; width:100%; height:100%; border-radius:50%; overflow:hidden; background:#fff; padding:7px;
  border:1px solid #e1e8e3; box-shadow:0 0 0 5px #fff, 0 0 0 6px #e8efe9, 0 10px 24px rgba(20,60,40,.10);
  transition:transform .3s var(--ease), box-shadow .3s;
}
.corner__media:hover .corner__ring{transform:scale(1.04); box-shadow:0 0 0 5px #fff, 0 0 0 6px var(--green-mid), 0 14px 28px rgba(20,60,40,.14)}
.corner__ring img.corner__badge{display:block; width:100%; height:100%; max-width:none; margin:0; object-fit:cover; border-radius:50%; transition:none}
.corner__ring img.corner__badge--contain{object-fit:contain; padding:8px; border-radius:0}
.corner__ico{
  position:absolute; right:2px; bottom:8px; width:40px; height:40px; border-radius:50%;
  display:grid; place-items:center; color:#fff; border:3px solid #fff;
  background:linear-gradient(180deg,var(--green),var(--green-deep)); box-shadow:0 4px 10px rgba(0,0,0,.16);
}
.corner__ico svg{width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.corner--abi .corner__ico svg{fill:currentColor; stroke:none; width:22px; height:22px}
.corner__title{font-family:var(--font-display); font-weight:800; font-size:1.22rem; line-height:1.2; color:var(--accent-ink); margin:0}
.corner__sub{margin:.4rem auto 0; max-width:30ch; font-size:.82rem; line-height:1.45; color:var(--muted)}
.corner__rule{display:block; width:44px; height:3px; border-radius:3px; margin:.85rem auto 1rem; background:linear-gradient(90deg,var(--gold),var(--green-bright))}
.corner__content{width:100%; text-align:left}

/* Kisaan: hairline link rows */
.cornerlinks{margin:0; gap:0}
.cornerlinks a{
  padding:.62rem .2rem; background:transparent; border:0; border-bottom:1px solid #eef2ef; border-radius:0;
  font-size:.9rem; color:var(--ink);
}
.cornerlinks li:last-child a{border-bottom:0}
.cornerlinks a:hover{background:transparent; color:var(--green); transform:translateX(3px)}
.cornerlinks__go{color:var(--green)}

/* ABI & ITMU: the same hairline rows, then the chip groups */
.abi__tags{margin:0; padding:0; background:transparent; border:0; border-radius:0}
.abi__tags li{padding:.5rem .2rem; font-size:.9rem; color:var(--ink)}
.abi__tags li + li{border-top:1px solid #eef2ef}
.abi__tico{background:var(--green-wash); box-shadow:none}
.abigroups{margin:.9rem 0 0; padding:.9rem 0 0; background:transparent; border:0; border-top:1px solid #eef2ef; border-radius:0; gap:.8rem}

/* Students: headed paragraphs in the same ink */
.cornerdl{margin:0}
.cornerdl dt{color:var(--accent-ink); font-size:.9rem}
.cornerdl dd{font-size:.86rem}
.cornerdl dd a{color:var(--green)}

/* Footer link: centred, pinned to the bottom so all three line up */
.cornermore{
  margin:auto auto 0; padding:1.1rem 0 0; align-self:center; border-bottom:0;
  color:var(--green); font-size:.9rem; text-decoration:underline; text-underline-offset:3px;
}
.cornermore:hover{color:var(--green-deep); border-color:transparent}

@media (max-width:700px){
  .corner{padding:1.6rem 1.1rem 1.2rem}
  .corner__media{width:148px; height:148px}
}

/* ---------- 17an. Mega menu: compact dark panel anchored under its item ----------
   Column headings with a thin rule, plain links, vertical dividers between
   columns; no icons. Mobile (≤980px) keeps the stacked accordion above. */
@media (min-width:981px){
  .mainnav__item.has-mega{position:relative}
  .mega,
  .mega.mega--panel{
    left:0; right:auto; width:max-content; min-width:0; max-width:calc(100vw - 20px);
    background:var(--green-deep); color:#fff;
    border-top:3px solid var(--gold); border-radius:0 0 6px 6px;
    box-shadow:0 14px 34px rgba(0,0,0,.28);
  }
  .mega.mega--panel.mega--right{left:auto; right:0}
  .mega__grid.wrap{
    width:auto; max-width:none; margin:0; padding:1.15rem .5rem 1.25rem;
    display:flex; gap:0;
  }
  .mega__col{
    flex:none; min-width:168px; max-width:240px; padding:0 1.2rem;
    border-left:1px solid rgba(255,255,255,.16);
  }
  .mega__col:first-child{border-left:0}
  .mega__head,
  .mega__grid--6 .mega__head,
  .mega__grid--7 .mega__head{
    min-height:0; margin:0 0 .5rem; padding-bottom:.45rem;
    font-size:.95rem; color:#fff; border-bottom:1px solid rgba(255,255,255,.32);
  }
  .mega__head::after{display:none}
  .mega__links{margin:0; gap:0}
  .mega__links a,
  .mega__list a{
    display:block; padding:.32rem 0; border-radius:0; background:none;
    color:#e9f3ea; font-size:.9rem; font-weight:500; line-height:1.35;
    transition:color .15s;
  }
  .mega__links a:hover,
  .mega__list a:hover{background:none; color:var(--gold); transform:none}
  .mega__links a .mi,.mega__list a .mi,.mega__tile .mi{display:none}
  .mega__col--solo{display:block}
  .mega__tile{
    display:block; padding:.32rem 0; border:0; border-radius:0; background:none; box-shadow:none;
    text-align:left; transform:none;
  }
  .mega__tile:hover{transform:none; box-shadow:none}
  .mega__tile-label{color:#e9f3ea; font-weight:500; font-size:.9rem}
  .mega__tile:hover .mega__tile-label{color:var(--gold)}
  .mega.mega--panel{padding:1rem 1.4rem 1.15rem; min-width:230px}
  .mega__title{color:#fff; font-size:.95rem; margin:0 0 .5rem; padding-bottom:.45rem; border-bottom:1px solid rgba(255,255,255,.32)}
  .mega__list--2{gap:0 1.8rem}
}
@media (min-width:981px) and (max-width:1180px){
  .mega__grid.wrap{display:grid; grid-template-columns:repeat(3,minmax(168px,max-content))}
  .mega__col{max-width:none}
  .mega__col:nth-child(3n+1){border-left:0}
  .mega__col{margin-bottom:.9rem}
}

/* ---------- 17ao. Statistics band: full-width dark photo strip ----------
   Gold icon, large white figure and an uppercase label per stat, in one row;
   a centred yellow pill button to the full dashboard underneath. */
.section--stats{padding-top:0}
.section--stats>.wrap{padding-top:2.8rem}
.statband{
  position:relative; isolation:isolate; color:#fff; padding:3.1rem 0 2.9rem;
  background:#0b2414 var(--statband-bg,none) center/cover no-repeat;
}
.statband::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg,rgba(5,22,12,.84),rgba(7,30,16,.9));
}
.statband__title{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.statband__list{list-style:none; margin:0 auto; padding:0; max-width:1100px; display:grid; grid-template-columns:repeat(4,1fr); gap:2.2rem 1.5rem}
.statband__item{min-width:0}
.statband__inner{display:flex; align-items:center; gap:1rem; color:inherit; text-decoration:none}
a.statband__inner:hover .statband__n{color:var(--gold)}
.statband__ico{flex:none; width:84px; height:84px; display:grid; place-items:center; border-radius:14px; background:rgba(255,255,255,.07); box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
/* The stat icons are dark line-art on white PNGs: invert them (white lines on
   black), tint the lines gold, then screen-blend so the black drops out. */
.statband__ico img{
  width:72px; height:72px; object-fit:contain; mix-blend-mode:screen;
  filter:invert(1) sepia(1) saturate(5) hue-rotate(358deg) brightness(1.15) contrast(1.25) drop-shadow(0 0 .7px #ffd54a);
}
.statband__text{display:block; min-width:0}
.statband__n{display:block; font-family:var(--font-display); font-weight:700; font-size:2.2rem; line-height:1.05; color:#fff; transition:color .2s}
.statband__l{display:block; margin-top:.35rem; font-family:var(--font-display); font-weight:700; font-size:.9rem; line-height:1.3; letter-spacing:.04em; text-transform:uppercase; color:#f1f6f0}
.statband__cta{display:flex; justify-content:center; margin-top:2.5rem}
.statband__btn{
  display:inline-flex; align-items:center; gap:1rem; padding:1.05rem 2.8rem; border-radius:999px;
  background:linear-gradient(180deg,#ffd54a,var(--gold)); color:var(--green-deep);
  font-family:var(--font-display); font-weight:800; font-size:1.45rem; letter-spacing:.01em;
  text-decoration:none; border:2px solid rgba(255,255,255,.25);
  box-shadow:0 12px 28px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.45);
  transition:transform .2s var(--ease), box-shadow .2s, filter .2s;
}
.statband__btn:hover{transform:translateY(-3px); box-shadow:0 18px 36px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.45); filter:brightness(1.04)}
.statband__btn:focus-visible{outline:3px solid #fff; outline-offset:3px}
.statband__btn svg{width:26px; height:26px; fill:currentColor}
[data-theme="dark"] .statband__ico img{filter:invert(1) sepia(1) saturate(5) hue-rotate(358deg) brightness(1.08)}
@media (max-width:1180px){
  .statband__list{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:700px){
  .statband{padding:2.4rem 0}
  .statband__list{grid-template-columns:repeat(2,1fr)}
  .statband__n{font-size:1.6rem}
  .statband__ico{width:52px; height:52px}
  .statband__ico img{width:52px; height:52px}
  .statband__btn{font-size:1.1rem; padding:.85rem 2rem}
}

/* ---------- 17ap. Pulse varieties: flip cards per crop ----------
   Photo in front; hover / focus turns the card to the count and link. */
.section--varieties{background:var(--paper); border-block:1px solid var(--line-soft)}
.flipgrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1.4rem}
.flipcard{display:block; perspective:1400px; aspect-ratio:4/3; color:inherit; text-decoration:none; outline-offset:4px}
.flipcard__inner{
  position:relative; display:block; width:100%; height:100%; border-radius:var(--r-lg);
  transform-style:preserve-3d; transition:transform .7s cubic-bezier(.4,.15,.2,1), box-shadow .3s;
  box-shadow:var(--shadow-1);
}
.flipcard:hover .flipcard__inner,
.flipcard:focus-visible .flipcard__inner{transform:rotateY(180deg); box-shadow:var(--shadow-3)}
.flipcard__front,.flipcard__back{
  position:absolute; inset:0; display:flex; flex-direction:column; border-radius:inherit; overflow:hidden;
  -webkit-backface-visibility:hidden; backface-visibility:hidden;
}
.flipcard__front{background:#dfe9e2; border:1px solid var(--line)}
.flipcard__front img{display:block; width:100%; height:100%; object-fit:cover}
.flipcard__name{
  position:absolute; left:0; right:0; bottom:0; padding:2.4rem 1.1rem .9rem;
  font-family:var(--font-display); font-weight:700; font-size:1.1rem; color:#fff;
  background:linear-gradient(180deg,transparent,rgba(8,36,20,.88));
}
.flipcard__front--plain{
  align-items:center; justify-content:center; gap:.8rem;
  background:linear-gradient(150deg,#fff,var(--green-wash)); color:var(--accent-ink);
}
.flipcard__glyph{width:78px; height:78px; border-radius:50%; display:grid; place-items:center; background:#fff; box-shadow:var(--shadow-1), inset 0 0 0 1px var(--line)}
.flipcard__glyph svg{width:38px; height:38px; fill:none; stroke:var(--green); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.flipcard__front--plain .flipcard__name{position:static; padding:0; background:none; color:var(--accent-ink); font-size:1.2rem}
.flipcard__back{
  transform:rotateY(180deg); align-items:center; justify-content:center; text-align:center; padding:1.4rem;
  color:#fff; background:linear-gradient(160deg,var(--green),var(--green-deep));
}
.flipcard__count{font-family:var(--font-display); font-weight:800; font-size:3.4rem; line-height:1; color:var(--gold)}
.flipcard__what{margin-top:.55rem; font-family:var(--font-display); font-weight:700; font-size:1.15rem; line-height:1.3; letter-spacing:.04em; text-transform:uppercase}
.flipcard__cta{margin-top:1.1rem; padding:.45rem 1.15rem; border:1.5px solid rgba(255,255,255,.7); border-radius:999px; font-weight:700; font-size:.86rem}
.varieties__more{text-align:center; margin-top:1.6rem}
@media (prefers-reduced-motion:reduce){.flipcard__inner{transition:none}}
@media (max-width:700px){.flipgrid{grid-template-columns:repeat(2,1fr); gap:.9rem} .flipcard__count{font-size:2.4rem} .flipcard__what{font-size:.9rem} .flipcard__name{font-size:.95rem; padding:1.8rem .8rem .6rem}}

/* ---------- 17aq. Director's Desk: photo beside the heading ---------- */
.about-head{display:flex; align-items:center; gap:1.4rem; margin-bottom:1.3rem}
.about-photo{
  flex:none; width:128px; height:128px; border-radius:18px; overflow:hidden; background:#eef3ef;
  box-shadow:0 0 0 4px #fff, 0 0 0 5px var(--line), 0 10px 24px rgba(20,60,40,.16);
}
.about-photo img{display:block; width:100%; height:100%; object-fit:cover; object-position:top center}
.about-head__text{min-width:0}
.about-head .about-title{margin-bottom:.3rem}
.about-head .about-subtitle{margin-bottom:.85rem}
.about-head .about-divider{margin-bottom:0}
@media (max-width:700px){
  .about-head{gap:1rem}
  .about-photo{width:96px; height:96px; border-radius:14px}
}

/* ---------- 17ar. Statistics band: premium finish ----------
   Glass tiles per figure, gold-disc icons (the line-art PNGs multiply onto the
   disc so their white background vanishes), gold small-caps labels and a
   glowing pill button with the icon in a dark roundel. */
.statband{padding:3.4rem 0 3.2rem}
.statband::before{background:linear-gradient(180deg,rgba(4,20,11,.88),rgba(6,28,15,.94))}
.statband__list{gap:1.1rem; max-width:1140px}
.statband__inner{
  padding:1.05rem 1.2rem; border-radius:18px; gap:1.1rem;
  background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.12); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  box-shadow:0 10px 26px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .25s var(--ease), border-color .25s, box-shadow .25s;
}
.statband__item:hover .statband__inner{
  transform:translateY(-4px); border-color:rgba(255,213,74,.45);
  box-shadow:0 16px 34px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.1);
}
.statband__ico{
  width:76px; height:76px; border-radius:50%;
  background:radial-gradient(circle at 32% 28%,#fff0a8 0%,#ffd54a 38%,#f2b705 70%,#c98d00 100%);
  box-shadow:0 8px 18px rgba(0,0,0,.4), inset 0 2px 3px rgba(255,255,255,.65), inset 0 -4px 8px rgba(120,70,0,.28);
}
.statband__ico img,
[data-theme="dark"] .statband .statband__ico img{
  width:44px; height:44px; mix-blend-mode:multiply; opacity:.95;
  filter:brightness(1.12) contrast(1.9);
}
.statband__ico.is-tinted img,
[data-theme="dark"] .statband .statband__ico.is-tinted img{
  mix-blend-mode:normal; filter:drop-shadow(0 1px 0 rgba(255,255,255,.35)); opacity:1;
}
.statband__ico svg{
  width:40px; height:40px; fill:#0b3d22;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.4)) drop-shadow(0 2px 3px rgba(0,0,0,.18));
}
@media (max-width:700px){.statband__ico svg{width:30px; height:30px}}
.statband__n{font-size:2.3rem; letter-spacing:-.01em; text-shadow:0 2px 8px rgba(0,0,0,.35)}
.statband__l{color:#ffd54a; font-size:.78rem; letter-spacing:.12em; margin-top:.3rem}
.statband__cta{margin-top:2.6rem}
.statband__btn{
  position:relative; overflow:hidden; gap:1.1rem; padding:.8rem .9rem .8rem 2.4rem; font-size:1.35rem;
  background:linear-gradient(180deg,#ffe27a 0%,#ffd54a 45%,#f2b705 100%); color:#0b3d22; border:0;
  box-shadow:0 0 0 6px rgba(255,213,74,.16), 0 16px 34px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.7);
}
.statband__btn::after{
  content:""; position:absolute; top:0; left:-60%; width:40%; height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-20deg); transition:left .6s ease;
}
.statband__btn:hover::after{left:120%}
.statband__btn:hover{
  transform:translateY(-3px);
  box-shadow:0 0 0 8px rgba(255,213,74,.2), 0 22px 44px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.7);
}
.statband__btn svg{
  width:44px; height:44px; padding:11px; border-radius:50%; background:var(--green-deep); fill:#ffd54a;
  box-shadow:0 4px 10px rgba(0,0,0,.3);
}
@media (max-width:700px){
  .statband__inner{padding:.8rem .9rem; gap:.8rem}
  .statband__ico{width:58px; height:58px}
  .statband__ico img{width:34px; height:34px}
  .statband__btn{font-size:1.1rem; padding:.6rem .7rem .6rem 1.6rem}
  .statband__btn svg{width:36px; height:36px; padding:9px}
}

/* ---------- 17as. External links: arrows + pause around the auto-scroll ---------- */
.extbar{display:flex; align-items:center; gap:.7rem; width:min(100% - 2.2rem, var(--wrap)); margin:0 auto}
.extbar .extwrap--marquee{flex:1; min-width:0}
.extwrap--marquee.is-js .ext{animation:none!important}
.ext__nav{border:0; cursor:pointer; font-size:1.5rem; line-height:1; background:var(--green); color:#fff; box-shadow:var(--shadow-1)}
.ext__nav:hover{background:var(--green-deep); color:#fff}
.extctl{display:flex; justify-content:center; margin-top:.5rem}
.ext__pause{
  width:36px; height:36px; border:0; border-radius:8px; cursor:pointer;
  display:grid; place-items:center; background:var(--green-deep); color:#fff; box-shadow:var(--shadow-1);
  transition:background .2s, transform .2s;
}
.ext__pause:hover{background:var(--green); transform:scale(1.05)}
.ext__pause svg{width:14px; height:14px; fill:currentColor}
.ext__pause .icon-play{display:none}
.ext__pause.is-paused .icon-pause{display:none}
.ext__pause.is-paused .icon-play{display:block}
@media (max-width:700px){.ext__nav{display:none} .extbar{width:100%}}

/* ---------- 17at. Newsletter: latest issues as news cards ---------- */
.secthead--split{display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; flex-wrap:wrap}
.viewall{
  display:inline-flex; align-items:center; gap:.4rem; padding:.5rem 1.05rem; border:1.5px solid var(--green); border-radius:999px;
  color:var(--green); font-weight:700; font-size:.88rem; text-decoration:none; transition:background .2s, color .2s;
}
.viewall:hover{background:var(--green); color:#fff}
.newsgrid{display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem}
.newscard{
  display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden;
  box-shadow:var(--shadow-1); transition:transform .22s var(--ease), box-shadow .22s;
}
.newscard:hover{transform:translateY(-4px); box-shadow:var(--shadow-2)}
.newscard__cover{
  position:relative; display:flex; flex-direction:column; justify-content:flex-end; aspect-ratio:4/3; padding:1.1rem 1.2rem;
  color:#fff; text-decoration:none; overflow:hidden; background:linear-gradient(150deg,var(--green) 0%,var(--green-deep) 75%);
}
.newscard__cover::before{content:""; position:absolute; right:-28%; bottom:-45%; width:82%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(255,213,74,.38),transparent 65%)}
.newscard__cover::after{content:""; position:absolute; left:1.2rem; right:1.2rem; top:2.9rem; height:1px; background:rgba(255,255,255,.3)}
.newscard__mast{position:absolute; top:1rem; left:1.2rem; font-family:var(--font-display); font-weight:700; font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:#ffd54a}
.newscard__name{position:relative; font-family:var(--font-display); font-weight:800; font-size:1.45rem; line-height:1.05}
.newscard__period{position:relative; margin-top:.45rem; font-size:.9rem; font-weight:600; color:#e5f1e8}
.newscard__new{position:absolute; top:.9rem; right:.9rem; background:#ffd54a; color:#0b3d22; font-size:.62rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; padding:.25rem .55rem; border-radius:3px}
.newscard__pdf{position:absolute; right:1rem; bottom:1rem; padding:.2rem .5rem; border:1px solid rgba(255,255,255,.55); border-radius:4px; font-size:.62rem; font-weight:800; letter-spacing:.1em}
.newscard__body{padding:.95rem 1.1rem 1.1rem; display:flex; flex-direction:column; gap:.4rem; flex:1}
.newscard__date{display:flex; align-items:center; gap:.4rem; margin:0; font-size:.8rem; color:var(--muted); font-weight:600}
.newscard__date svg{width:14px; height:14px; fill:var(--green)}
.newscard__t{margin:0; font-family:var(--font-display); font-weight:700; font-size:.98rem; line-height:1.35}
.newscard__t a{color:var(--accent-ink); text-decoration:none}
.newscard__t a:hover{color:var(--green)}
.newscard__go{margin-top:auto; padding-top:.3rem; color:var(--green); font-weight:700; font-size:.85rem; text-decoration:underline; text-underline-offset:3px}
@media (max-width:1000px){.newsgrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.newsgrid{grid-template-columns:1fr}}
