/* Montserrat, self-hosted (latin). Google serves one variable file for all weights. */
@font-face{
  font-family:'Montserrat';
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url('fonts/montserrat-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Montserrat';
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url('fonts/montserrat-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  --navy:#280071;
  --navy-deep:#1c0050;
  --sbi-blue:#00A9E0;
  --sbi-blue-text:#0080A9;
  --tint:#EAF7FD;
  --tint-2:#DCF0FA;
  --ink:#1B1230;
  --slate:#5C5A72;
  --line:#DDE1F0;
  --white:#FFFFFF;
  --gold:#C99A3E;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Montserrat',Arial,sans-serif;
  color:var(--ink);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
}
a{color:var(--sbi-blue-text);}
img{max-width:100%;display:block;}

.skip-link{
  position:absolute;left:-9999px;top:0;z-index:1000;
  background:var(--navy);color:#fff;font-weight:700;font-size:14px;
  padding:12px 20px;border-radius:0 0 8px 0;text-decoration:none;
}
.skip-link:focus{left:0;}
#main:focus{outline:none;}

.topbar{
  background:var(--navy-deep);
  color:#d9c9ff;
  font-size:12.5px;
  padding:7px 32px;
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:4px 16px;
  letter-spacing:.02em;
}
.topbar a{color:#d9c9ff;text-decoration:underline;}
.topbar a:hover{color:#fff;}

header.hero{
  background:linear-gradient(180deg,var(--navy) 0%, var(--navy) 55%, var(--navy-deep) 100%);
  color:#fff;
  padding:22px 32px 72px;
}
.herolanding{max-width:1180px;margin:40px auto 0;}
.herolanding h1{font-size:clamp(28px,4.4vw,46px);line-height:1.08;font-weight:800;margin:0 0 14px;max-width:20ch;}
.herolanding p.lede{max-width:60ch;font-size:16px;line-height:1.6;color:#e3d9f7;margin:0;}
.brandrow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  max-width:1180px;
  margin:0 auto;
}
.brandmark{display:flex;align-items:center;gap:12px;}
.brandmark img{height:34px;width:auto;background:#fff;padding:5px 8px;border-radius:6px;}
nav.quicklinks{display:flex;gap:22px;flex-wrap:wrap;font-size:13.5px;font-weight:600;}
nav.quicklinks a{color:#e3d6ff;text-decoration:none;padding:6px 0;border-bottom:2px solid transparent;}
nav.quicklinks a:hover{border-bottom-color:var(--gold);color:#fff;}

.herobody{max-width:1180px;margin:44px auto 0;}
.herobody h1{
  font-size:clamp(30px,4.4vw,50px);
  line-height:1.08;
  font-weight:800;
  max-width:14ch;
  margin:0 0 14px;
}
.herobody p.lede{
  max-width:56ch;
  font-size:16.5px;
  line-height:1.6;
  color:#e3d9f7;
  font-weight:400;
  margin:0 0 26px;
}
.heropills{display:flex;gap:10px;flex-wrap:wrap;}
.heropills span{
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.25);
  padding:6px 14px;
  border-radius:100px;
  font-size:12.5px;
  font-weight:600;
  color:#f1ecfb;
}

/* ---- sub-page shell ---- */
.subnav{
  background:var(--navy-deep);color:#d9c9ff;font-size:12.5px;
  padding:11px 32px;display:flex;justify-content:space-between;gap:16px;
  flex-wrap:wrap;align-items:center;letter-spacing:.01em;
}
.subnav a{color:#fff;text-decoration:underline;}
.subnav .backlink{font-weight:700;text-decoration:none;}
.subnav .backlink:hover{border-bottom:2px solid var(--gold);}
.page{max-width:940px;margin:0 auto;padding:40px 32px 88px;}
.pagehead{border-bottom:1px solid var(--line);padding-bottom:22px;margin-bottom:40px;}
.pagehead h1{
  font-size:clamp(26px,4vw,38px);font-weight:800;color:var(--navy);
  margin:0 0 10px;letter-spacing:-.015em;line-height:1.1;
}
.pagelede{font-size:15.5px;line-height:1.65;color:var(--slate);max-width:64ch;margin:0;}

/* ---- landing tile grid ---- */
.hubgrid{
  max-width:1120px;margin:-44px auto 0;padding:0 32px;position:relative;z-index:2;
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
}
@media(max-width:900px){.hubgrid{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.hubgrid{grid-template-columns:1fr;}}
.hubtile{
  display:flex;flex-direction:column;gap:9px;
  background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px 20px;
  text-decoration:none;color:var(--ink);
  box-shadow:0 14px 34px -20px rgba(27,18,48,.3);
  transition:border-color .15s,transform .15s;
}
.hubtile:hover{border-color:var(--sbi-blue);transform:translateY(-2px);}
.hubtile b{font-weight:800;font-size:16px;color:var(--navy);line-height:1.25;}
.hubtile span{font-size:13px;color:var(--slate);line-height:1.55;flex:1;}
.hubtile .contents{font-size:11px;color:var(--sbi-blue-text);font-weight:700;letter-spacing:.02em;}
.hubtile .ticon{
  width:30px;height:30px;padding:6px;box-sizing:content-box;
  color:var(--sbi-blue-text);background:var(--tint);border-radius:9px;
  transition:background .15s,color .15s;
}
.hubtile:hover .ticon{background:var(--sbi-blue);color:#fff;}

main{min-width:0;}
section.block{margin-bottom:64px;scroll-margin-top:22px;}
.blockhead{
  display:flex;align-items:baseline;gap:14px;
  border-bottom:1px solid var(--line);
  padding-bottom:12px;margin-bottom:24px;
}
.blockhead h2{
  font-size:24px;font-weight:800;color:var(--navy);margin:0;
}
.blockhead h3{
  font-size:16px;font-weight:800;color:var(--navy);margin:0;
}
.blockhead .tag{font-size:12.5px;color:var(--slate);font-weight:500;}
p.intro{color:var(--slate);font-size:14.5px;line-height:1.65;max-width:70ch;margin-top:-8px;margin-bottom:22px;}

.needinput{
  border:1.5px dashed #C9B8EE;
  background:var(--tint);
  color:var(--navy);
  border-radius:10px;
  padding:14px 18px;
  font-size:13px;
  font-weight:600;
  margin-bottom:20px;
}
.needinput span{font-weight:400;color:var(--slate);display:block;margin-top:2px;}
.flag{
  border:1.5px solid #E0A93B;
  background:#FFF8EA;
  color:#6B4E00;
  border-radius:10px;
  padding:12px 18px;
  font-size:12.5px;
  font-weight:600;
  margin-bottom:20px;
}
.flag.sm{font-size:13px;line-height:1.65;}
.flag .note{display:block;font-weight:400;color:#6B4E00;margin-top:6px;}
.flag a{color:#007CA3;}

/* ---- collapsible approval notice ---- */
.flagbox{
  border:1.5px solid #E0A93B;background:#FFF8EA;border-radius:10px;
  padding:0;margin-bottom:20px;overflow:hidden;
}
.flagbox summary{
  list-style:none;cursor:pointer;padding:12px 18px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  font-size:13px;font-weight:600;color:#6B4E00;
}
.flagbox summary::-webkit-details-marker{display:none;}
.flagbox summary b{font-weight:700;}
.flagbox .chev{
  display:flex;align-items:center;gap:4px;flex:0 0 auto;
  font-size:11.5px;font-weight:700;color:var(--navy);white-space:nowrap;
}
.flagbox .chev svg{width:14px;height:14px;transition:transform .15s;}
.flagbox[open] .chev svg{transform:rotate(180deg);}
.flagbox .flagbody{
  padding:0 18px 14px;font-size:12.5px;font-weight:600;color:#6B4E00;
  border-top:1px solid #F0DFAE;padding-top:12px;
}

.brandgrid{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;}
@media(max-width:820px){.brandgrid{grid-template-columns:1fr;}}
.swatchrow{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:6px;}
.swatch{width:190px;}
.swatch .chip{height:74px;border-radius:8px;border:1px solid rgba(0,0,0,.06);}
.swatch .label{font-size:12.5px;font-weight:700;margin-top:8px;}
.swatch .code{font-size:11px;color:var(--slate);font-family:monospace;line-height:1.5;}
.typeblock{background:var(--tint);border-radius:10px;padding:22px 24px;}
.typeblock .sample{font-weight:800;font-size:26px;color:var(--navy);margin:0 0 2px;}
.typeblock .meta{font-size:12.5px;color:var(--slate);margin-bottom:16px;}
.typeblock .sample2{font-weight:500;font-size:15px;color:var(--ink);}
.logobox{
  border:1px solid var(--line);border-radius:10px;
  padding:26px;display:flex;align-items:center;justify-content:center;
  min-height:110px;background:#fff;
}
.logobox.dark{background:var(--navy);}
.logobox img{max-height:64px;}
.rulelist{margin:18px 0 0;padding:0;list-style:none;}
.rulelist li{
  font-size:13.5px;line-height:1.6;color:var(--ink);
  padding:10px 0 10px 22px;border-top:1px solid var(--line);position:relative;
}
.rulelist li:before{
  content:"";position:absolute;left:0;top:16px;width:7px;height:7px;background:var(--sbi-blue);border-radius:50%;
}

.peoplegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
@media(max-width:820px){.peoplegrid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.peoplegrid{grid-template-columns:1fr;}}
.personcard{border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.personcard .photo{
  aspect-ratio:4/5;background:var(--tint);overflow:hidden;
}
.personcard .photo img{width:100%;height:100%;object-fit:cover;object-position:top center;}
.personcard .info{padding:14px 16px 18px;}
.personcard .name{font-weight:700;font-size:14.5px;color:var(--navy);margin:0 0 2px;}
.personcard .role{font-size:12.5px;color:var(--sbi-blue-text);font-weight:600;margin:0 0 8px;}
.personcard .bio{font-size:12.5px;color:var(--slate);line-height:1.6;}
#team .personcard{background:var(--tint);border-color:var(--tint-2);}
#team .personcard .info{padding:18px 18px 20px;}
#team .personcard .role{font-size:14px;color:var(--navy);font-weight:800;margin-bottom:8px;}
.personcard .dlminirow{display:flex;gap:8px;margin-top:10px;}
.personcard .dlmini{
  display:inline-flex;align-items:center;font-size:11.5px;font-weight:700;
  color:var(--sbi-blue-text);text-decoration:none;border:1px solid var(--sbi-blue);
  border-radius:100px;padding:11px 16px;min-height:22px;
}
.personcard .dlmini:hover{background:var(--sbi-blue);color:#fff;}

.proggrid{display:flex;flex-direction:column;gap:14px;}
.progrow{
  display:grid;grid-template-columns:300px 1fr auto;gap:22px;align-items:center;
  border:1px solid var(--line);border-radius:12px;padding:16px 18px;
}
.progrow .plock{
  background:#fff;border:1px solid var(--line);border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  min-height:70px;padding:12px 16px;
}
.progrow .plock img{max-width:100%;max-height:46px;width:auto;}
.progrow .plock.pending{font-size:11px;color:var(--slate);font-weight:600;text-align:center;line-height:1.4;}
.progrow .pname,.briefcard .pname{font-weight:800;color:var(--navy);font-size:14.5px;margin-bottom:3px;}
.progrow .pname .pfull,.briefcard .pname .pfull{font-weight:500;color:var(--slate);font-size:12px;}
.progrow .pdesc,.briefcard .pdesc{color:var(--ink);font-size:13px;line-height:1.6;}
.briefcard .pdesc + .pdesc{margin-top:10px;}
.progrow .ptag,.briefcard .ptag{display:inline-block;font-size:11px;color:var(--sbi-blue-text);font-weight:700;margin-top:6px;}
.progrow .ppp,.briefcard .ppp{display:block;font-size:11.5px;color:var(--slate);font-style:italic;line-height:1.5;margin-top:6px;}
.progrow .pdl{
  display:inline-flex;align-items:center;
  font-size:11.5px;font-weight:700;color:var(--sbi-blue-text);text-decoration:none;white-space:nowrap;
  border:1px solid var(--sbi-blue);border-radius:100px;padding:12px 16px;align-self:center;
}
.progrow .pdl:hover{background:var(--sbi-blue);color:#fff;}
.progrow .plink{
  display:inline-block;margin-top:8px;font-size:12px;font-weight:700;
  color:var(--sbi-blue-text);text-decoration:none;
}
.progrow .plink:hover{text-decoration:underline;}
@media(max-width:760px){
  .progrow{grid-template-columns:1fr;gap:12px;}
  .progrow .pdl{justify-self:start;}
}

.briefgrid{display:flex;flex-direction:column;gap:14px;}
.briefcard{border:1px solid var(--line);border-radius:12px;padding:16px 18px;}
.briefcard .blocklink{
  display:inline-block;margin-top:8px;font-size:12px;font-weight:700;
  color:var(--sbi-blue-text);text-decoration:none;
}
.briefcard .blocklink:hover{text-decoration:underline;}

.pmore{margin-top:8px;}
.pmore summary{
  cursor:pointer;font-size:12px;font-weight:700;color:var(--sbi-blue-text);
  list-style:none;display:inline-block;
}
.pmore summary::-webkit-details-marker{display:none;}
.pmore summary::before{content:"+ ";}
.pmore[open] summary::before{content:"– ";}
.pmore summary:hover{text-decoration:underline;}
.pmore .pfull-text{
  margin-top:10px;padding:14px 16px;background:var(--tint);border-radius:10px;
  font-size:12.5px;color:var(--ink);line-height:1.65;
}
.pmore .pstat{
  display:block;margin-top:8px;font-size:12px;font-weight:700;color:var(--navy);
}
.progfoot{margin-top:16px;font-size:12.5px;color:var(--slate);}

.reportrow{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  border:1px solid var(--line);border-radius:10px;padding:16px 20px;margin-bottom:10px;
}
.reportrow .rmeta{font-size:13.5px;font-weight:700;color:var(--ink);}
.reportrow .rsub{font-size:12px;color:var(--slate);font-weight:500;margin-top:2px;}
.rbtnrow{display:flex;gap:8px;flex:0 0 auto;}
.rbtn{
  display:inline-flex;align-items:center;
  font-size:12.5px;font-weight:700;color:var(--sbi-blue-text);text-decoration:none;
  border:1px solid var(--sbi-blue);border-radius:100px;padding:12px 18px;white-space:nowrap;
}
.rbtn:hover{background:var(--sbi-blue);color:#fff;}
.rbtn.ghost{color:var(--slate);border-color:var(--line);}
.rbtn.ghost:hover{background:var(--slate);color:#fff;border-color:var(--slate);}

.doclist{display:flex;flex-direction:column;gap:12px;}
.doccard{
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;
  border:1px solid var(--line);border-radius:10px;padding:16px 20px;
}
.doccard .ficon{
  width:38px;height:38px;border-radius:8px;background:var(--tint);
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:var(--navy);flex:0 0 auto;
}
.doccard .dname{font-size:14px;font-weight:700;color:var(--ink);}
.doccard .ddesc{font-size:12.5px;color:var(--slate);margin-top:3px;line-height:1.5;}
.doccard a.dl{
  display:inline-flex;align-items:center;justify-content:center;
  font-size:12.5px;font-weight:700;color:#fff;background:var(--navy);
  text-decoration:none;padding:12px 18px;border-radius:8px;white-space:nowrap;
}
.doccard a.dl:hover{background:var(--sbi-blue);}
.doccard a.dl.ghost{background:transparent;color:var(--navy);border:1px solid var(--line);}
.doccard a.dl.ghost:hover{background:var(--tint);}
@media(max-width:480px){
  .reportrow{flex-direction:column;align-items:flex-start;}
  .doccard{grid-template-columns:1fr;}
  .doccard .dlrow{width:100%;justify-content:center;}
  .doccard a.dl{display:block;text-align:center;}
}

.socialrow{display:flex;gap:12px;flex-wrap:wrap;margin-top:4px;}
.socialrow a{
  display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:100px;
  padding:13px 18px;font-size:12.5px;font-weight:700;color:var(--ink);text-decoration:none;
}
.socialrow a:hover{border-color:var(--sbi-blue);color:var(--sbi-blue-text);}
.socialrow .dot{width:7px;height:7px;border-radius:50%;background:var(--sbi-blue);}

.contactstrip{
  margin-top:26px;background:var(--navy);color:#fff;border-radius:12px;
  padding:22px 26px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
}
.contactstrip .ct1{font-size:15px;font-weight:700;}
.contactstrip .ct2{font-size:12.5px;color:#e3d9f7;margin-top:3px;}
.contactstrip a{color:#fff;font-weight:700;font-size:13.5px;text-decoration:none;border-bottom:2px solid var(--gold);}
.contactstrip .ctemails{display:flex;flex-wrap:wrap;gap:6px 14px;}
.contactstrip a{overflow-wrap:anywhere;}

footer{
  border-top:1px solid var(--line);padding:26px 32px;text-align:center;
  font-size:12px;color:var(--slate);
}


/* ---- per-section freshness stamp ---- */
.stamp{
  font-size:11px;color:var(--slate);font-weight:600;letter-spacing:.02em;
  margin-top:18px;padding-top:12px;border-top:1px dashed var(--line);
}

/* ---- colour swatches: click to copy ---- */
.swatch button.chipbtn{
  display:block;width:190px;text-align:left;padding:0;border:0;background:none;
  font:inherit;color:inherit;cursor:pointer;
}
.swatch button.chipbtn .chip{
  height:74px;border-radius:8px;border:1px solid rgba(0,0,0,.06);
  transition:transform .12s;
}
.swatch button.chipbtn:hover .chip{transform:translateY(-2px);}
.swatch button.chipbtn:focus-visible{outline:2px solid var(--sbi-blue);outline-offset:3px;border-radius:8px;}
.swatch .copyhint{font-size:10.5px;color:var(--sbi-blue-text);font-weight:700;margin-top:4px;letter-spacing:.02em;}

/* ---- logo do / don't ---- */
.dodont{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px;}
@media(max-width:700px){.dodont{grid-template-columns:1fr;}}
.dodont .col{border:1px solid var(--line);border-radius:10px;padding:16px 18px;}
.dodont .col h3{
  margin:0 0 10px;font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:800;
}
.dodont .do h3{color:#1F7A3D;}
.dodont .dont h3{color:#B23A2E;}
.dodont ul{margin:0;padding:0;list-style:none;}
.dodont li{font-size:12.5px;line-height:1.55;color:var(--ink);padding:6px 0 6px 18px;position:relative;}
.dodont li:before{position:absolute;left:0;top:6px;font-weight:800;}
.dodont .do li:before{content:"\2713";color:#1F7A3D;}
.dodont .dont li:before{content:"\00d7";color:#B23A2E;font-size:15px;line-height:1;}

/* ---- boilerplate copy blocks ---- */
.boiler{display:flex;flex-direction:column;gap:12px;}
.boilercard{border:1px solid var(--line);border-radius:10px;padding:16px 18px;background:var(--tint);}
.boilercard .btag{
  font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;font-weight:800;color:var(--navy);
  display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;
}
.boilercard p{margin:0;font-size:13.5px;line-height:1.65;color:var(--ink);}
.copybtn{
  font-size:11px;font-weight:700;color:var(--sbi-blue-text);background:#fff;
  border:1px solid var(--sbi-blue);border-radius:100px;padding:4px 12px;cursor:pointer;letter-spacing:.02em;
}
.copybtn:hover{background:var(--sbi-blue);color:#fff;}
.copybtn:focus-visible{outline:2px solid var(--navy);outline-offset:2px;}

:focus-visible{outline:2px solid var(--sbi-blue);outline-offset:2px;}
@media (prefers-reduced-motion:reduce){*{transition:none!important;}}

/* ---- small layout helpers (replaces former inline styles) ---- */
section.block.flush{margin-bottom:0;}
.blockhead.gap-top{margin-top:40px;}
p.intro.gap-top{margin-top:22px;}
.doclist.gap-top{margin-top:20px;}
.chip.navy{background:var(--navy);}
.chip.blue{background:var(--sbi-blue);}
.typeblock .sample-alt{font-family:Arial,sans-serif;font-weight:700;font-size:18px;margin-bottom:4px;color:var(--ink);}
.typeblock .meta.flush{margin-bottom:0;}
.logobox.dark img{filter:brightness(0) invert(1);}
.pdl.off,.rbtn.off{opacity:.45;pointer-events:none;}
.dlrow{display:flex;gap:8px;flex-wrap:wrap;}

/* ---- funder logo grid ---- */
.fundergrid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px;
}
@media(max-width:760px){.fundergrid{grid-template-columns:repeat(3,1fr);}}
@media(max-width:520px){.fundergrid{grid-template-columns:repeat(2,1fr);}}
.funderbox{
  position:relative;
  border:1px solid var(--line);border-radius:10px;padding:16px 14px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  background:#fff;min-height:110px;
}
.funderbox img{max-width:100%;max-height:44px;width:auto;object-fit:contain;}
.funderbox span{font-size:11px;font-weight:600;color:var(--slate);text-align:center;line-height:1.3;}
.funderbox .fdl{
  position:absolute;top:-10px;right:-10px;width:32px;height:32px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;font-weight:700;color:var(--slate);text-decoration:none;
  border:1px solid var(--line);background:#fff;
  box-shadow:0 1px 4px rgba(0,0,0,.12);
}
.funderbox .fdl:hover{background:var(--tint);color:var(--sbi-blue-text);border-color:var(--sbi-blue);}

/* ---- internal/external audience tags ---- */
.tag.audience{
  font-size:11px;font-weight:700;padding:4px 10px;border-radius:100px;letter-spacing:.01em;
}
.tag.audience.internal{background:#EAF7FD;color:#0C78A6;}
.tag.audience.external{background:#EDF6EC;color:#1F7A3D;}
.tag.audience.mixed{background:#FBF1DE;color:#8A5A00;}
.hubtile .tag.audience{flex:0 0 auto;align-self:flex-start;}