/*
 * The Schools Challenge: Sponsors page.
 * Load after screenNEW.css and home.css.
 * Scoped to body#sponsors; header, navigation and footer are untouched.
 */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@500;600&display=swap');

body#sponsors > #container {
  --tsc-navy:#192b6d;
  --tsc-blue:#2f5caa;
  --tsc-sky:#91c5ed;
  --tsc-pale:#edf6fc;
  --tsc-ink:#172243;
  --tsc-muted:#5e6981;
  --tsc-line:rgba(25,43,109,.16);
  --tsc-serif:'Playfair Display',Georgia,serif;
  --tsc-sans:'DM Sans',Arial,sans-serif;
  box-sizing:border-box;
  width:min(1000px,calc(100% - 2*clamp(18px,4vw,56px)))!important;
  max-width:1000px!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:clamp(42px,6vw,70px) 0 clamp(56px,8vw,88px)!important;
  background:transparent!important;
  color:var(--tsc-ink);
  font:400 16px/1.7 var(--tsc-sans);
  -webkit-font-smoothing:antialiased;
}

body#sponsors > #container::before {
  content:'';
  position:fixed;
  z-index:-2;
  inset:0;
  background:linear-gradient(180deg,var(--tsc-pale) 0,#fff 720px);
}

body#sponsors > #container *,
body#sponsors > #container *::before,
body#sponsors > #container *::after { box-sizing:border-box; }

body#sponsors #sponsorscontent {
  float:none!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
}

body#sponsors #sponsorsintro {
  float:none!important;
  width:100%!important;
  max-width:none!important;
  margin:0 auto clamp(28px,4vw,42px)!important;
  padding:0!important;
  text-align:center!important;
}

body#sponsors #sponsorsintro h1 {
  margin:0 0 18px!important;
  padding:0!important;
  color:var(--tsc-navy)!important;
  font:500 clamp(2.4rem,5vw,4.1rem)/1.08 var(--tsc-serif)!important;
  letter-spacing:-.03em;
  text-align:center!important;
}

body#sponsors #sponsorsintro h1 br,
body#sponsors #sponsorsintro p br:first-child { display:none!important; }

body#sponsors #sponsorsintro p.indent20 {
  max-width:740px;
  margin:0 auto!important;
  padding:0!important;
  color:var(--tsc-muted)!important;
  font:400 clamp(1rem,1.7vw,1.12rem)/1.72 var(--tsc-sans)!important;
  text-align:center!important;
}

body#sponsors #becomeasponsor {
  width:100%!important;
  max-width:none!important;
  margin:0 auto clamp(38px,5vw,56px)!important;
  padding:clamp(22px,3.5vw,31px)!important;
  border:1px solid var(--tsc-line)!important;
  border-left:5px solid var(--tsc-blue)!important;
  background:#fff!important;
  color:var(--tsc-muted)!important;
  font:500 1rem/1.7 var(--tsc-sans)!important;
  text-align:center!important;
  box-shadow:0 9px 26px rgba(25,43,109,.065);
}

body#sponsors #becomeasponsor strong { color:var(--tsc-navy);font-weight:700; }
body#sponsors #sponsorscontent > .clearallclass { display:none!important; }

/* Sponsor tiers */
body#sponsors .sponsorsection {
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-auto-flow:dense;
  gap:16px;
  float:none!important;
  width:100%!important;
  min-height:0!important;
  margin:0 0 24px!important;
  padding:clamp(22px,3.5vw,34px)!important;
  border:1px solid var(--tsc-line)!important;
  border-top:5px solid var(--tsc-navy)!important;
  background:#fff!important;
  box-shadow:0 10px 30px rgba(25,43,109,.06);
}

body#sponsors .sponsorsection#platinum { background:var(--tsc-pale)!important; }

body#sponsors .sponsorsection > h2.centered {
  grid-column:1/-1;
  width:100%!important;
  margin:0 0 8px!important;
  padding:0 0 16px!important;
  border-bottom:2px solid var(--tsc-sky)!important;
  color:var(--tsc-navy)!important;
  font:500 clamp(1.55rem,3vw,2.25rem)/1.2 var(--tsc-serif)!important;
  letter-spacing:-.02em;
  text-align:left!important;
}

body#sponsors .sponsorsection > .sponsorwidecolleft,
body#sponsors .sponsorsection > .sponsornarrowcolright { display:contents!important; }
body#sponsors .sponsorsection > .clearallclass { display:none!important; }

body#sponsors .sponsorwidecolleft > a,
body#sponsors .sponsornarrowcolright > a {
  position:relative;
  display:flex!important;
  align-items:center;
  justify-content:center;
  width:100%!important;
  min-width:0;
  height:190px!important;
  margin:0!important;
  padding:18px!important;
  overflow:hidden;
  border:1px solid var(--tsc-line)!important;
  background:#fff!important;
  text-decoration:none!important;
  box-shadow:0 6px 18px rgba(25,43,109,.045);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}

body#sponsors .sponsorwidecolleft > a { grid-column:span 2; }
body#sponsors .sponsornarrowcolright > a { grid-column:span 1; }

body#sponsors .sponsorwidecolleft > a:hover,
body#sponsors .sponsornarrowcolright > a:hover { transform:translateY(-3px);border-color:var(--tsc-sky)!important;box-shadow:0 12px 25px rgba(25,43,109,.12); }

body#sponsors .sponsorsection a:focus-visible { outline:3px solid var(--tsc-sky);outline-offset:3px; }

body#sponsors .sponsorsection img.sponsorpageimage,
body#sponsors .sponsorsection a > img {
  display:block!important;
  width:auto!important;
  max-width:100%!important;
  height:auto!important;
  max-height:154px!important;
  margin:auto!important;
  border:0!important;
  object-fit:contain!important;
}

/* Sections containing one active wide partner are centred. */
body#sponsors #partner .sponsorwidecolleft > a,
body#sponsors #gold .sponsorwidecolleft > a {
  grid-column:1/-1;
  width:min(100%,650px)!important;
  justify-self:center;
}

@media (max-width:760px) {
  body#sponsors .sponsorsection { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body#sponsors .sponsorwidecolleft > a { grid-column:span 2; }
  body#sponsors .sponsornarrowcolright > a { grid-column:span 1; }
  body#sponsors #partner .sponsorwidecolleft > a,
  body#sponsors #gold .sponsorwidecolleft > a { grid-column:1/-1; }
}

@media (max-width:520px) {
  body#sponsors > #container { width:calc(100% - 30px)!important;padding:36px 0 56px!important; }
  body#sponsors #sponsorsintro h1 { font-size:2.3rem!important; }
  body#sponsors #becomeasponsor { padding:21px 18px!important;text-align:left!important; }
  body#sponsors #becomeasponsor br { display:none!important; }
  body#sponsors .sponsorsection { grid-template-columns:1fr;padding:20px 14px!important;gap:11px; }
  body#sponsors .sponsorsection > h2.centered { grid-column:1;text-align:center!important; }
  body#sponsors .sponsorwidecolleft > a,
  body#sponsors .sponsornarrowcolright > a,
  body#sponsors #partner .sponsorwidecolleft > a,
  body#sponsors #gold .sponsorwidecolleft > a { grid-column:1;height:150px!important; }
  body#sponsors .sponsorsection img.sponsorpageimage,
  body#sponsors .sponsorsection a > img { max-height:118px!important; }
}

@media (prefers-reduced-motion:reduce) {
  body#sponsors > #container *,body#sponsors > #container *::before,body#sponsors > #container *::after { transition:none!important; }
}
