/*
Theme Name: AOSIS New
Theme URI: https://aosis.org
Author: AOSIS
Description: Custom theme for the Alliance of Small Island States — V8 layout (contained hero, pillar grid, Instagram rail, event mode). Reads documents and video live from Sanity via the AOSIS Sanity Data plugin.
Version: 1.5.18
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.1
Text Domain: aosis
*/

:root{
  --blue:#0B5FB0; --blue2:#0A3D73; --black:#111111; --white:#ffffff;
  --climate:#2E9B4F; --ocean:#1565C0; --sustdev:#C8362B; --legal:#7A3E9D; --fellowship:#E8B11E;
  --disp:"Archivo Narrow",Arial,sans-serif;
  --grot:"Inter",Arial,sans-serif; --sans:"Inter",sans-serif;
}
*{box-sizing:border-box;}html,body{margin:0;padding:0;}
body{background:var(--white);color:var(--black);font-family:var(--sans);line-height:1.5;-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
/* Links typed into the WordPress page editor must look like links. The global
   rule above intentionally strips link styling (for nav, cards, footer, etc.),
   so editable body-content areas need it restored explicitly. Add any new
   body-text wrapper class to this list. */
.itext a,.histbody a,.pageintro a,.lead a,.fellowlead-text a,.ilblurb a,.page-body a{
  color:var(--blue);text-decoration:underline;text-underline-offset:2px;
}
.itext a:hover,.histbody a:hover,.pageintro a:hover,.lead a:hover,.fellowlead-text a:hover,.ilblurb a:hover,.page-body a:hover{
  color:var(--blue2);
}
.wrap{max-width:1200px;margin:0 auto;padding:0 44px;}
.cap{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:11px;}

header{border-bottom:3px solid var(--black);}
.bar{display:flex;align-items:center;justify-content:space-between;padding:20px 44px;}
.brand{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:24px;color:var(--blue);}
nav{display:flex;gap:30px;align-items:center;}
nav a{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:12.5px;}
nav a.active,nav a:hover{color:var(--blue);}
/* dropdown submenus */
.mainnav .navitem.has-sub{position:relative;display:inline-flex;align-items:center;}
.mainnav .navitem.has-sub > a::after{content:"\25BE";font-size:8px;margin-left:5px;opacity:.6;}
.mainnav .submenu{position:absolute;top:100%;left:0;background:#fff;border:1px solid #e2e2e2;border-top:3px solid var(--blue);box-shadow:0 10px 28px rgba(8,30,55,.16);min-width:210px;padding:6px 0;display:none;flex-direction:column;gap:0;z-index:60;}
.mainnav .navitem.has-sub:hover .submenu{display:flex;}
.mainnav .submenu a{padding:9px 18px;font-size:12px;letter-spacing:.04em;white-space:nowrap;color:var(--ink,var(--black));}
.mainnav .submenu a:hover{background:#f3f7fb;color:var(--blue);}
/* mobile hamburger (hidden on desktop) */
.navtoggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;background:none;border:none;cursor:pointer;padding:0;}
.navtoggle span{display:block;width:24px;height:3px;background:var(--black);margin:0 auto;}
header .bar{position:relative;}

/* LOW GRAPHIC HERO — slim blue band, identity statement, not a big feature */
.ghero{background:var(--blue);color:#fff;position:relative;overflow:hidden;}
.ghero .wrap{padding:30px 44px;position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:30px;}
.ghero h1{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:40px;line-height:.92;margin:0;}
.ghero p{font-family:var(--grot);font-weight:600;font-size:14px;color:rgba(255,255,255,.9);margin:8px 0 0;max-width:46ch;}
.ghero .wave{position:absolute;right:-180px;top:-260px;width:560px;height:560px;border-radius:50%;border:2px solid rgba(255,255,255,.14);z-index:1;
  box-shadow:0 0 0 20px transparent,0 0 0 22px rgba(255,255,255,.10),0 0 0 44px transparent,0 0 0 46px rgba(255,255,255,.10),0 0 0 70px transparent,0 0 0 72px rgba(255,255,255,.10);}

/* SECTION heads */
.section{padding:0 0 8px;}
.shead{display:flex;align-items:flex-end;justify-content:space-between;padding:42px 0 18px;}
.shead a{color:var(--blue);}

/* STATEMENTS columns */
.cols{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--black);}
.col{padding:20px 24px 30px;border-right:1px solid var(--black);}
.col:last-child{border-right:0;}
.col .num{font-family:var(--disp);font-weight:800;font-size:30px;color:var(--blue);line-height:1;margin:0 0 12px;}
.col .t{font-family:var(--grot);font-weight:700;font-size:18px;line-height:1.18;margin:0;}
.col .dt{font-size:12px;color:#666;margin-top:10px;text-transform:uppercase;letter-spacing:.06em;}

/* LOW FEATURED-STATEMENT BAND — slim horizontal, type-led, blue block + thin photo edge (toned) */
.featband{display:grid;grid-template-columns:1.4fr 1fr;border-top:1px solid var(--black);border-bottom:1px solid var(--black);}
.featband .txt{background:var(--blue);color:#fff;padding:30px 34px;display:flex;flex-direction:column;justify-content:center;}
.featband .k{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:rgba(255,255,255,.85);margin:0 0 12px;}
.featband h3{font-family:var(--disp);font-weight:800;font-size:36px;line-height:.98;margin:0;}
.featband .dt{font-family:var(--grot);font-weight:600;font-size:12.5px;color:rgba(255,255,255,.85);margin:14px 0 0;text-transform:uppercase;letter-spacing:.05em;}
.featband .ph{background-size:cover;background-position:center;min-height:200px;filter:saturate(0.78);}

/* FILM — portrait frames, toned to b/w so colour comes from the design not photos */
.films{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--black);}
.film{border-right:1px solid var(--black);position:relative;aspect-ratio:4/5;background-size:cover;background-position:center;filter:saturate(0.78);}
.film:last-child{border-right:0;}
.film .play{position:absolute;top:14px;right:14px;width:38px;height:38px;border:2px solid var(--white);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--white);font-size:12px;}
.film .cap{position:absolute;left:0;right:0;bottom:0;background:var(--blue);color:var(--white);font-family:var(--grot);font-weight:700;font-size:12px;padding:10px 13px;text-transform:uppercase;letter-spacing:.03em;}

/* PRESS + NEWS two-up */
.rows{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--black);}
.rowcol{border-right:1px solid var(--black);}.rowcol:last-child{border-right:0;}
.rowcol .rh{padding:18px 24px 4px;}
.row{display:flex;justify-content:space-between;gap:18px;padding:16px 24px;border-bottom:1px solid #e0e0e0;}
.row .t{font-family:var(--grot);font-weight:600;font-size:16px;line-height:1.2;}
.row .dt{font-size:11px;color:#666;flex:none;text-transform:uppercase;letter-spacing:.05em;}

footer{border-top:3px solid var(--black);margin-top:4px;padding:40px 0;}
footer .fr{display:flex;justify-content:space-between;align-items:flex-start;gap:30px;flex-wrap:wrap;}
footer .footbrand{display:flex;align-items:center;gap:16px;max-width:60%;}
footer .footbrand .palau{width:62px;height:62px;flex:none;}
footer .fb-line1{font-family:var(--grot);font-weight:700;font-size:14px;letter-spacing:.02em;color:var(--blue2);}
footer .fb-line1 strong{font-weight:800;}
footer .fb-line2{font-family:var(--grot);font-weight:600;font-size:12.5px;line-height:1.5;color:#555;margin-top:6px;}
footer .social{display:flex;gap:22px;}footer .social a{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:12px;}

@media(max-width:900px){
  .navtoggle{display:flex;}
  nav.mainnav{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border-top:1px solid var(--black);border-bottom:1px solid var(--black);flex-direction:column;gap:0;padding:8px 0;z-index:80;box-shadow:0 12px 28px rgba(8,30,55,.16);}
  nav.mainnav.open{display:flex;}
  nav.mainnav > a, .mainnav .navitem.has-sub{padding:12px 24px;width:100%;}
  .mainnav .navitem.has-sub{display:flex;flex-direction:column;align-items:flex-start;}
  .mainnav .navitem.has-sub > a::after{content:"";}
  .mainnav .submenu{position:static;display:flex;border:none;box-shadow:none;padding:4px 0 4px 16px;min-width:0;}
  .mainnav .navitem.has-sub:hover .submenu{display:flex;}
  .ghero .wrap{flex-direction:column;align-items:flex-start;}.ghero h1{font-size:30px;}
  .cols{grid-template-columns:1fr;}.col{border-right:0;border-bottom:1px solid var(--black);}
  .featband{grid-template-columns:1fr;}.featband .ph{min-height:200px;order:-1;}
  .films{grid-template-columns:1fr 1fr;}.rows{grid-template-columns:1fr;}.rowcol{border-right:0;}}

.herobtn{flex:none;font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:13px;color:#fff;background:var(--blue2);padding:14px 22px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.25);}
.herobtn:hover{background:var(--blue2);}


/* logo lockup: mark + stacked wordmark (Poppins ~ Canva Sans stand-in) */
.lockup{display:flex;align-items:center;gap:13px;}
.lmark{width:50px;height:50px;flex:none;display:flex;align-items:center;justify-content:center;}
.lmark-img{width:50px;height:50px;display:block;}

.lword{font-family:var(--disp);font-weight:800;text-transform:uppercase;color:var(--black);font-size:22px;line-height:.9;letter-spacing:.01em;}
.lword .thin{font-weight:300;}


/* ============================================================
   AOSIS New v1.5 — INTERIOR PAGES (authoritative, written
   against the real class names emitted by each template).
   ============================================================ */

/* ---------- page banners (all interior pages) ---------- */
.pbanner{background:var(--blue2);color:#fff;margin-top:4px;border-bottom:1px solid var(--black);}
.pbanner + .wrap > *:first-child,.pbanner + div > *:first-child{border-top:0;}
.pbanner .pbin{max-width:1200px;margin:0 auto;padding:36px 44px;}
.pbanner.hassub .pbin{padding-bottom:0;}
.pbanner .pbeyebrow{font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.14em;font-size:11px;opacity:.85;margin-bottom:12px;}
.pbanner h1{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:60px;line-height:.86;margin:0;}
.pbanner p{font-family:var(--grot);font-size:14px;opacity:.94;margin:12px 0 0;max-width:62ch;line-height:1.55;}
.pbanner.issue-climate{background:var(--climate);}
.pbanner.issue-ocean{background:var(--ocean);}
.pbanner.issue-sustdev{background:var(--sustdev);}
.pbanner.issue-legal{background:var(--legal);}
.subnav{display:flex;flex-wrap:wrap;margin-top:24px;border-top:1px solid rgba(255,255,255,.3);}
.subnav a{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:12px;color:#fff;opacity:.7;padding:14px 0;margin-right:26px;border-top:3px solid transparent;margin-top:-1px;}
.subnav a.on{opacity:1;border-top:3px solid #fff;}
.subnav a:hover{opacity:1;}
/* A banner carrying something on the right (the Fellowship applications flag). */
.pbanner .pbmain{min-width:0;}
.pbanner.hasaside .pbin{display:grid;grid-template-columns:1fr 300px;gap:36px;align-items:start;}
.applyflag{background:var(--fellowship);color:var(--black);padding:18px 20px;}
.applyflag .afhead{font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:11px;display:block;}
.applyflag .aftext{font-family:var(--grot);font-size:13px;line-height:1.5;color:var(--black);opacity:1;max-width:none;margin:8px 0 0;}
.applyflag .afacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.applyflag a{font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:11px;padding:9px 13px;text-decoration:none;line-height:1;}
.applyflag .afbtn{background:var(--black);color:#fff;}
.applyflag .aflink{border:1.5px solid var(--black);color:var(--black);}
.applyflag a:hover{opacity:.85;}
@media(max-width:900px){.pbanner h1{font-size:36px;}.pbanner.hasaside .pbin{grid-template-columns:1fr;}}

/* ---------- ISSUE PAGES (_issue-page.php) ---------- */
/* top row: picture | text | team */
.issuetop{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1.3fr 260px;border-bottom:1px solid var(--black);}
/* The picture keeps a fixed 4:3 shape and sits at the top of its column, so
   a long block of text beside it can't stretch it vertically. */
/* margin, not padding: the picture is a background image, so padding would
   just be filled by the image. This holds it off the column rule. */
.issuetop .ipic{background:#cdd8e4 center/cover;aspect-ratio:4/3;align-self:start;margin-right:4px;}
.issuetop .itext{padding:30px 34px;border-left:1px solid var(--black);border-right:1px solid var(--black);}
.issuetop .itext h2{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:26px;margin:0 0 12px;line-height:.95;}
.issuetop .itext p{font-size:15px;line-height:1.7;margin:0 0 12px;}
.issuetop .iteam{padding:26px 24px;}
.issuetop .iteam h3{font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:11px;color:#888;margin:0 0 16px;}
.itm{display:flex;gap:12px;align-items:center;margin-bottom:14px;}
.iav{width:42px;height:42px;flex:none;background:var(--blue);color:#fff;font-family:var(--disp);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:14px;background-size:cover;background-position:center;}
.inm{font-weight:700;font-size:13px;}
.iti{font-size:10px;color:#777;text-transform:uppercase;letter-spacing:.03em;}
.iempty{font-size:12px;color:#999;font-style:italic;}
/* second row: Recent | In Pictures */
.issuesplit{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--black);}
.issuesplit .col{padding:16px 26px;}
.issuesplit .col:first-child{border-right:1px solid var(--black);}
.shead h2,.ch{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:30px;line-height:.9;margin:0 0 10px;}
.issuesplit .drow{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:baseline;padding:12px 0;border-bottom:1px solid #e0e0e0;text-decoration:none;color:var(--black);}
.issuesplit .drow:hover .dtitle{color:var(--blue);}
.issuesplit .dtitle{font-size:13.5px;font-weight:600;line-height:1.3;}
.issuesplit .dmeta{font-size:10px;color:#999;text-transform:uppercase;white-space:nowrap;}
.issuesplit .more{display:inline-block;margin-top:12px;font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:10.5px;color:var(--blue);}
.photogrid-empty{padding:26px 4px;color:#8a949f;text-align:center;}
.photogrid-empty p{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:18px;color:var(--blue2);}
.photogrid-empty span{font-size:11px;line-height:1.5;display:block;margin-top:8px;}
/* third row: video */
.issuevid{max-width:1200px;margin:0 auto;padding:16px 26px 30px;}
.issuevid .ch{margin-bottom:12px;}
.issuevid .vrow{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;}
.vtile{position:relative;aspect-ratio:9/16;background-size:cover;background-position:center;filter:saturate(.8);}
.vtile .play{position:absolute;top:11px;right:11px;z-index:2;width:26px;height:26px;border:2px solid #fff;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;font-size:9px;}
.vtile .vc{position:absolute;left:0;right:0;bottom:0;z-index:2;color:#fff;font-family:var(--grot);font-weight:700;font-size:10.5px;padding:9px 11px;line-height:1.2;}
.vtile::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(8,30,55,.78));}
@media(max-width:900px){.issuetop,.issuesplit{grid-template-columns:1fr;}.issuetop .ipic{margin-right:0;}.issuetop .itext{border-left:0;border-right:0;border-top:1px solid var(--black);border-bottom:1px solid var(--black);}.issuesplit .col:first-child{border-right:0;border-bottom:1px solid var(--black);}}

/* ---------- DOCUMENTS (documents.php) ---------- */
.libwrap{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:240px 1fr;border-top:1px solid var(--black);}
.facets{border-right:1px solid var(--black);padding:0;}
.fgroup{padding:0 20px;margin:0 0 14px;}
.fgroup:first-of-type{padding-top:16px;}
.fgroup > strong,.fgroup b,.facets h3,.facets h4,.facets .lbl-group{font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:10px;color:#888;margin:0 0 9px;display:block;}
.facets ul,.facets li{list-style:none;margin:0;padding:0;}
.facets a,.facets .fitem{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:12.5px;padding:2px 0;line-height:1.3;color:#333;text-decoration:none;}
.facets a:hover{color:var(--blue);}
.facets a.on{color:var(--blue);font-weight:700;}
/* The whole row is the toggle; the cross is what says so. Only on the
   selected ones, so an unselected list stays quiet. */
.facets .fx{flex:none;width:12px;font-size:11px;line-height:1.3;color:var(--blue);}
.facets a:not(.on) .lbl{padding-left:22px;}
.facets a.on:hover .fx{color:var(--black);}
.facets .lbl{flex:1;}
.facets .ct{font-size:10px;color:#aaa;}
.clearall{display:inline-block;margin:2px 20px 16px;font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:10px;color:var(--blue);}
.results,.rbody{min-width:0;}
.searchform{display:flex;align-items:center;gap:8px;padding:0 20px;min-height:46px;border-bottom:1px solid var(--black);}
.searchform input[type=search],.searchform input[type=text]{flex:1;min-width:0;border:0;padding:0;background:none;font-family:var(--grot);font-size:13px;color:var(--black);}
.searchform input::placeholder{color:#999;opacity:1;}
.searchform button{flex:none;border:0;background:var(--blue2);color:#fff;font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:10px;padding:7px 11px;cursor:pointer;}
.searchform button:hover{background:var(--blue);}
.rcount{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:11px;color:#888;padding:0 26px;min-height:46px;display:flex;align-items:center;border-bottom:1px solid #e0e0e0;margin:0;}
.rcard{display:grid;grid-template-columns:118px 116px 1fr;gap:16px;align-items:start;padding:12px 26px;border-bottom:1px solid #e0e0e0;text-decoration:none;color:var(--black);}
/* Three fixed columns: date, type tag, title. The tag is a grid item, which
   would otherwise stretch to fill its whole column — start-align it so the
   pill hugs its text, and nudge it down onto the title's first baseline. */
.rcard > .rkind{justify-self:start;margin-top:2px;}
.rcard:hover{background:#f5f8fc;}
.rcard:hover .rtitle{color:var(--blue);}
.rkind{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:9px;color:#fff;padding:3px 8px;line-height:1.3;display:inline-block;background:var(--blue);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;}
.rtitle{font-size:14px;font-weight:600;line-height:1.4;}
.rmeta,.rforum{font-family:var(--grot);font-size:10px;color:#999;text-transform:uppercase;letter-spacing:.03em;margin-top:3px;}
.rdate{font-size:11px;color:#888;text-transform:uppercase;white-space:nowrap;padding-top:2px;}
.rpager{padding:20px 26px;display:flex;gap:10px;}
.rpager a,.rpager .prev,.rpager .next{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:11px;padding:8px 14px;border:1.5px solid var(--black);}
@media(max-width:900px){.libwrap{grid-template-columns:1fr;}.facets{border-right:0;border-bottom:1px solid var(--black);}}
@media(max-width:600px){.rcard{grid-template-columns:1fr;gap:8px;}}

/* ---------- FELLOWSHIP (fellowship.php) ---------- */
body:not(.page-fellowship) .fellowlead{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1.4fr;border-top:1px solid var(--black);border-bottom:1px solid var(--black);}
body:not(.page-fellowship) .fellowlead-img{background:#c9d6e2 center/cover;min-height:300px;}
body:not(.page-fellowship) .fellowlead-text{padding:34px 44px;display:flex;flex-direction:column;justify-content:center;}
body:not(.page-fellowship) .fellowlead-text p{font-size:14px;line-height:1.6;color:#333;max-width:46ch;}
.fellowtw{align-self:flex-start;margin-top:14px;font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:11px;color:var(--blue);}
.fellowlogo{max-width:130px;height:auto;margin-top:16px;}
.fellowcontactrow{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--black);}
body:not(.page-fellowship) .fellowteam{padding:26px 44px;border-right:1px solid var(--black);}
body:not(.page-fellowship) .fellowteam .shead,.fellowteam h3{font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:12px;color:#888;margin-bottom:16px;}
body:not(.page-fellowship) .fellowteam .itm{display:flex;gap:13px;align-items:center;margin-bottom:13px;}
body:not(.page-fellowship) .fellowteam .iav{width:44px;height:44px;}
body:not(.page-fellowship) .fellowteam .iav-email{background:var(--blue2);}
body:not(.page-fellowship) .applybody{padding:26px 44px;background:#eef4fb;display:flex;flex-direction:column;justify-content:center;}
body:not(.page-fellowship) .applytag{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:9px;color:#fff;padding:3px 8px;line-height:1.3;display:inline-block;align-self:flex-start;margin-bottom:12px;}
body:not(.page-fellowship) .applytag-closed{background:#e0e0e0;color:#555;}
body:not(.page-fellowship) .applytag-open{background:var(--blue);color:#fff;}
.applybtn{align-self:flex-start;margin-top:14px;background:var(--blue2);color:#fff;font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:12px;padding:12px 18px;text-decoration:none;}
.applydeadline,.applynext{font-size:13px;color:#555;margin-top:10px;}
/* stats */
body:not(.page-fellowship) .stats{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--black);}
body:not(.page-fellowship) .stats .stat{padding:28px 44px;border-right:1px solid var(--black);}
body:not(.page-fellowship) .stats .stat:last-child{border-right:0;}
body:not(.page-fellowship) .stats .stat .n{font-family:var(--disp);font-weight:800;font-size:60px;line-height:.85;color:var(--blue);}
body:not(.page-fellowship) .stats .stat .l{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:11px;margin-top:8px;}
/* spotlight reels */
body:not(.page-fellowship) .spotlight{max-width:1200px;margin:0 auto;}
body:not(.page-fellowship) .spotlight .shead,.spotlight h2{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:30px;padding:16px 44px 12px;}
body:not(.page-fellowship) .reelgrid{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid var(--black);border-bottom:1px solid var(--black);}
body:not(.page-fellowship) .reel{position:relative;aspect-ratio:9/16;background-size:cover;background-position:center;filter:saturate(.85);border-right:1px solid #fff;display:block;}
body:not(.page-fellowship) .reel:last-child{border-right:0;}
body:not(.page-fellowship) .reel::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(8,30,55,.7));}
.reelcap{position:absolute;left:0;right:0;bottom:0;z-index:2;color:#fff;font-family:var(--grot);font-weight:700;font-size:10px;padding:8px 9px;line-height:1.2;}
body:not(.page-fellowship) .fellowfilter,.fsel{padding:8px 44px;font-family:var(--grot);font-size:13px;}
body:not(.page-fellowship) .fbtn{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:11px;padding:8px 12px;border:1.5px solid var(--black);background:#fff;margin:0 6px 6px 0;display:inline-block;cursor:pointer;}
body:not(.page-fellowship) .fbtn.active{background:var(--blue2);color:#fff;border-color:var(--blue2);}
@media(max-width:900px){.fellowlead,.fellowcontactrow,.stats{grid-template-columns:1fr;}.fellowteam,.stats .stat{border-right:0;border-bottom:1px solid var(--black);}.reelgrid{grid-template-columns:1fr 1fr 1fr;}}

/* ---------- STAFF (staff.php) ---------- */
.stafffilter{max-width:1200px;margin:0 auto;padding:16px 44px;border-top:1px solid var(--black);border-bottom:1px solid var(--black);display:flex;gap:8px;flex-wrap:wrap;}
body:not(.page-fellowship) .sgrid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);}
body:not(.page-fellowship) .scard{border-right:1px solid var(--black);border-bottom:1px solid var(--black);padding:20px 22px;display:flex;gap:14px;align-items:flex-start;text-decoration:none;color:var(--black);cursor:pointer;}
body:not(.page-fellowship) .sgrid > *:nth-child(3n),.sgrid .scard:nth-child(3n){border-right:0;}
body:not(.page-fellowship) .scard .av,.sgrid .av{width:64px;height:64px;flex:none;background:var(--blue) center/cover;color:#fff;font-family:var(--disp);font-weight:800;font-size:20px;display:flex;align-items:center;justify-content:center;}
body:not(.page-fellowship) .scard .sinfo{min-width:0;} .scard .nm,.sgrid .nm{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:18px;line-height:1;}
body:not(.page-fellowship) .scard .ti,.sgrid .ti{font-size:12px;color:#666;margin-top:5px;}
body:not(.page-fellowship) .scard .em{display:block;font-size:11px;color:var(--blue);margin-top:6px;word-break:break-word;}
body:not(.page-fellowship) .ttag{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:9px;color:#fff;padding:3px 8px;line-height:1.3;display:inline-block;margin-top:10px;background:var(--blue);}
.readbio{font-size:11px;color:var(--blue);margin-top:8px;display:inline-block;}
.staffmodal-backdrop{position:fixed;inset:0;background:rgba(8,30,55,.55);z-index:200;display:flex;align-items:center;justify-content:center;padding:20px;}
.staffmodal-panel{background:#fff;max-width:560px;width:100%;padding:34px;position:relative;max-height:85vh;overflow:auto;}
.staffmodal-x{position:absolute;top:16px;right:16px;font-size:22px;cursor:pointer;background:none;border:0;}
.staffmodal-av{width:80px;height:80px;background:var(--blue) center/cover;color:#fff;font-family:var(--disp);font-weight:800;font-size:26px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.staffmodal-name{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:26px;line-height:1;}
.staffmodal-title{font-size:13px;color:#666;margin-top:4px;}
.staffmodal-team{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:9px;color:#fff;padding:3px 8px;line-height:1.3;display:inline-block;margin-top:8px;background:var(--blue);}
.staffmodal-bio{font-size:15px;line-height:1.7;margin-top:16px;}
.staffmodal-email{display:inline-block;margin-top:14px;font-family:var(--grot);font-weight:700;font-size:13px;color:var(--blue);}
@media(max-width:900px){.sgrid{grid-template-columns:1fr;}.sgrid > *:nth-child(3n){border-right:0;}.scard{border-right:0;}}

/* ---------- MEMBERS (members.php) ---------- */
.mgrid{max-width:1200px;margin:0 auto;}
.region{border-bottom:1px solid var(--black);padding:24px 44px;}
.region h3,.region .rtitle{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:24px;color:var(--blue);margin-bottom:16px;}
.region .fl,.region ul{display:grid;grid-template-columns:repeat(4,1fr);gap:10px 20px;list-style:none;margin:0;padding:0;}
.region .mitem,.region li{font-size:14px;font-weight:500;padding:4px 0;}
@media(max-width:900px){.region .fl,.region ul{grid-template-columns:1fr 1fr;}}

/* ---------- MEDIA (media.php) — 2/3+1/3 then 1/2+1/2 ---------- */
.shead{display:flex;justify-content:space-between;align-items:baseline;padding:16px 26px 12px;border-bottom:1px solid #e0e0e0;}
.shead .cap{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:10.5px;color:var(--blue);}
/* row 1: press (2/3) | team (1/3) */
.mediarow1{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr;border-top:1px solid var(--black);border-bottom:1px solid var(--black);}
.mr-press{border-right:1px solid var(--black);}
.prlist a,.prlist .pr{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:baseline;padding:14px 26px;border-bottom:1px solid #e0e0e0;text-decoration:none;color:var(--black);}
.prlist a:last-child{border-bottom:0;}
.prlist a:hover .prt{color:var(--blue);}
.prt{font-size:14px;font-weight:600;}
.prd{font-size:11px;color:#aaa;text-transform:uppercase;white-space:nowrap;}
.mteam{padding:12px 26px 18px;}
.mteam .itm{display:flex;gap:12px;align-items:flex-start;margin-bottom:16px;}
.mteam .iav{width:52px;height:52px;flex:none;background:var(--blue) center/cover;color:#fff;font-family:var(--disp);font-weight:800;font-size:17px;display:flex;align-items:center;justify-content:center;}
.mteam .inm{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:16px;line-height:1;}
.mteam .iti{font-size:11px;color:#666;margin-top:4px;text-transform:uppercase;letter-spacing:.03em;}
.mteam .cem{display:block;font-size:11px;color:var(--blue);margin-top:5px;word-break:break-word;}
/* row 2: pictures (1/2) | videos (1/2) */
.mediarow2{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--black);}
.mr-pics{border-right:1px solid var(--black);}
.linkgrid{display:grid;grid-template-columns:1fr 1fr;}
.linkgrid .tile{position:relative;aspect-ratio:1/1;background-size:cover;background-position:center;}
.linkgrid .tile::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(8,30,55,.8));}
.tcap{position:absolute;left:0;right:0;bottom:0;z-index:2;color:#fff;font-family:var(--grot);font-weight:700;font-size:11px;padding:9px;}
.vidgrid{display:grid;grid-template-columns:1fr 1fr;}
.vidgrid .vid{position:relative;aspect-ratio:9/16;background-size:cover;background-position:center;filter:saturate(.82);}
.vidgrid .vid::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(8,30,55,.8));}
.vidgrid .play{position:absolute;top:11px;right:11px;z-index:2;width:26px;height:26px;border:2px solid #fff;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;font-size:9px;}
.vcap{position:absolute;left:0;right:0;bottom:0;z-index:2;color:#fff;font-family:var(--grot);font-weight:700;font-size:10.5px;padding:9px;line-height:1.2;}
@media(max-width:900px){.mediarow1,.mediarow2{grid-template-columns:1fr;}.mr-press,.mr-pics{border-right:0;border-bottom:1px solid var(--black);}}

/* ---------- EVENTS (events.php) ---------- */
.evcur{max-width:1200px;margin:0 auto;background:var(--blue2);color:#fff;padding:24px 44px;border-top:1px solid var(--black);display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.evcur .live{display:inline-flex;align-items:center;gap:9px;font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.1em;font-size:12px;}
.evcur .dot{width:10px;height:10px;border-radius:50%;background:#E2403A;box-shadow:0 0 0 0 rgba(226,64,58,.7);animation:evpulse 1.6s infinite;}
@keyframes evpulse{70%{box-shadow:0 0 0 10px rgba(226,64,58,0);}}
.evcur .go{margin-left:auto;background:#fff;color:var(--blue2);font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:11px;padding:11px 16px;text-decoration:none;}
.evgrid{max-width:1200px;margin:0 auto;border-top:1px solid var(--black);}
.evc{display:grid;grid-template-columns:130px 1fr auto;gap:20px;align-items:baseline;padding:16px 44px;border-bottom:1px solid #e0e0e0;text-decoration:none;color:var(--black);}
.evc:hover{background:#f5f8fc;}
.evc .yr{font-family:var(--disp);font-weight:800;font-size:20px;color:var(--blue);}
.evc .m{font-size:15px;font-weight:600;}
.evc .s{font-size:11px;color:#999;text-transform:uppercase;white-space:nowrap;}

/* ---------- ABOUT / HISTORY (about.php, history.php) ---------- */
.chair{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:200px 1fr;gap:26px;padding:34px 44px;border-top:1px solid var(--black);border-bottom:1px solid var(--black);align-items:center;}
.chair .pav,.chair .cav{width:160px;height:160px;background:#cdd8e4 center/cover;}
.chair .nm{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:32px;line-height:.95;}
.chair .role{font-size:14px;color:#666;margin-top:8px;}
.prev{max-width:1200px;margin:0 auto;padding:24px 0;}
.prev .shead,.prev h2{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:30px;padding:0 44px 16px;}
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--black);}
.pcell{padding:20px 24px;border-right:1px solid #e0e0e0;border-bottom:1px solid #e0e0e0;}
.pav{width:64px;height:64px;background:#cdd8e4 center/cover;margin-bottom:10px;}
.pinfo .nm{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:16px;line-height:1;}
.pinfo .ct{font-size:11px;color:#777;margin-top:4px;}
/* .pageintro is the optional editable intro on Events and Media. It shares
   the History page's prose styling and renders only when Sanity has text. */
.histbody,.pageintro{max-width:900px;margin:0 auto;padding:38px 44px;border-top:1px solid var(--black);}
.histbody h2,.pageintro h2{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:30px;margin:26px 0 12px;}
.histbody h2:first-child,.pageintro h2:first-child{margin-top:0;}
.histbody p,.histbody .lead,.pageintro p,.pageintro .lead{font-size:16px;line-height:1.75;margin-bottom:16px;}
.histbody .lead,.pageintro .lead{font-size:18px;font-weight:500;}
.placeholder-note{background:#fffbe8;padding:10px 14px;font-size:12px;color:#8a7a2a;margin-top:16px;}
@media(max-width:900px){.chair{grid-template-columns:1fr;}.pgrid{grid-template-columns:1fr 1fr;}}

/* ---------- SINGLE DOCUMENT (single-document.php) ---------- */
.dochead{background:var(--blue2);color:#fff;margin-top:4px;border-bottom:1px solid var(--black);}
.dochead .wrap,.dochead-inner{max-width:1200px;margin:0 auto;padding:34px 44px;display:grid;grid-template-columns:1fr 300px;gap:30px;align-items:center;}
.dochead-text .kind,.dochead .kind{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:11px;opacity:.9;margin-bottom:10px;display:inline-block;}
.dochead-text h1,.dochead h1{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:42px;line-height:.9;margin:0;}
.dochead .meta{font-size:13px;opacity:.9;margin-top:14px;text-transform:uppercase;letter-spacing:.04em;}
.dochead .speaker{font-size:13px;opacity:.9;margin-top:5px;}
.dochero-video,.dochead-media{aspect-ratio:16/9;background:#000 center/cover;}
.doclayout{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 320px;}
.doccontent{border-right:1px solid var(--black);padding:30px 40px 50px 44px;font-size:15.5px;line-height:1.75;}
.doccontent p{margin:0 0 16px;}
.dockeypoints{background:#eef4fb;border:2px solid var(--blue2);padding:18px 20px;margin-bottom:24px;}
.summaryhead{font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:12px;color:var(--blue2);margin-bottom:8px;}
.summarybody{font-size:15px;line-height:1.6;font-weight:500;}
.docside{padding:30px 44px 30px 30px;}
.docside .detail .r{display:block;border-bottom:1px solid #e0e0e0;padding:9px 0;}

.docside .k{display:block;font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:10px;color:#999;}
.docside .v{display:block;font-size:13px;font-weight:600;margin-top:3px;}
.dlbtn{display:block;background:var(--blue2);color:#fff;text-align:center;font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:12px;padding:13px;margin-bottom:10px;text-decoration:none;}
.dlbtn.alt{background:#fff;color:var(--blue2);box-shadow:inset 0 0 0 2px var(--blue2);}
.related{max-width:1200px;margin:0 auto;}
.related .shead,.related h2{font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:26px;padding:20px 44px 12px;border-top:1px solid var(--black);}
.relgrid{display:grid;grid-template-columns:repeat(3,1fr);}
.relc{padding:18px 24px;border-right:1px solid #e0e0e0;border-bottom:1px solid #e0e0e0;text-decoration:none;color:var(--black);}
.relc:hover .t{color:var(--blue);}
.relc .kind{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:9px;color:#fff;padding:3px 8px;line-height:1.3;display:inline-block;background:var(--blue);}
.relc .t{font-size:13px;font-weight:600;line-height:1.3;margin-top:8px;}
.relc .d{font-size:10px;color:#aaa;text-transform:uppercase;margin-top:5px;}
@media(max-width:900px){.dochead .wrap,.dochead-inner,.doclayout,.relgrid{grid-template-columns:1fr;}.doccontent{border-right:0;}}

/* ---------- OUR WORK LANDING (issues.php) ---------- */
.issuelanding{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--black);border-bottom:1px solid var(--black);}
.issuelanding .ilpic{background:#cdd8e4 center/cover;min-height:360px;}
.issuelanding .ilright{display:grid;grid-template-columns:1fr 1fr;}
.issuelanding .iltile{position:relative;aspect-ratio:1/1;background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:20px;border-left:1px solid var(--black);border-bottom:1px solid var(--black);text-decoration:none;}
.issuelanding .iltile::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(8,30,55,.8));}
.issuelanding .iltext{position:relative;z-index:2;color:#fff;font-family:var(--disp);font-weight:800;text-transform:uppercase;font-size:26px;line-height:.95;}
.issuelanding .illinks{padding:20px;}
@media(max-width:900px){.issuelanding{grid-template-columns:1fr;}.issuelanding .ilpic{min-height:220px;}}

/* ---------- FELLOWSHIP hero (uses ghero fellowhero, keep solid blue) ---------- */

.pbanner.fellowbanner{background:var(--fellowship);color:var(--black);}
.fellowhero-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;}
.fellowbanner .fellowlogo{max-width:140px;height:auto;}


.frole{font-size:11px;color:#777;text-transform:uppercase;letter-spacing:.03em;}
.itm-email .iav{background:var(--blue2);}

/* ---------- STAFF modal container ---------- */
.staffmodal{display:none;position:fixed;inset:0;z-index:200;}
.staffmodal.open,.staffmodal[aria-hidden="false"]{display:flex;align-items:center;justify-content:center;padding:20px;}
.staffmodal-head{display:flex;flex-direction:column;align-items:flex-start;}

/* single-letter/nested helpers already covered by parent selectors:
   .n .l (stats), .k .v (docside/detail), .m .s (evc), .t .r .d (relc) — no-op safeguards */
.evc .m{font-size:15px;font-weight:600;} .evc .s{font-size:11px;color:#999;text-transform:uppercase;}
.pinfo .ct{font-size:11px;color:#777;} 
.dochero-watch{display:inline-block;margin-top:12px;font-family:var(--grot);font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:12px;color:#fff;background:rgba(255,255,255,.15);box-shadow:inset 0 0 0 2px rgba(255,255,255,.6);padding:10px 16px;text-decoration:none;}

/* ---------- spacing between page elements ----------
   One system across the whole site, matching the home page: every block
   OPENS with a rule and never CLOSES with one. The next block's rule closes
   the one above it, and the footer's 3px line closes the last block on the
   page. Gap is 4px, the same as the home page's column paddings, so the
   vertical rules inside a block read as running on into the next.
   The exception is handled below: the first block after a coloured banner
   drops its top rule, because the banner already draws one. */
.issuetop,.issuesplit,.issuevid,.libwrap,.stats,.mediarow1,.mediarow2,.commsgrid,.evgrid,.chair,.prev,.histbody,.pageintro,.sgrid,.stafffilter,.mgrid,.issuelanding,.applyband{margin-top:4px;}
.issuetop,.issuesplit,.issuevid,.libwrap,.stats,.mediarow1,.mediarow2,.commsgrid,.evgrid,.chair,.prev,.histbody,.pageintro,.sgrid,.stafffilter,.mgrid,.issuelanding{border-top:1px solid var(--black);border-bottom:0;}
.featband{border-bottom:0;}
.wrap > .issuetop,.wrap > .issuesplit{border-top:1px solid var(--black);}
.applyband{max-width:1200px;margin:4px auto 0;}
.applyband .applybox{margin:0;border:1px solid var(--black);padding:26px 30px;}
.applyband .applytag{font-family:var(--grot);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:9px;padding:3px 8px;line-height:1.3;display:inline-block;margin-bottom:12px;}
.applyband .applytag-open{background:var(--blue);color:#fff;}
.applyband .applytag-closed{background:#e0e0e0;color:#555;}
.applyband .applybody p{font-size:15px;line-height:1.7;margin:0 0 10px;}
.applyband .applybody p:last-child{margin-bottom:0;}
.issuetop .itext p{font-size:15px;line-height:1.7;}
