/* enrichment_v1 · Enrichment (ENRICHMENT_SPEC_v1 + SITE_PAGES_COMMON_v1 + Designer calls 05:09; template: educator_club_v1). Layout only: no text here. */
main > section.band{padding-top:72px!important;padding-bottom:72px!important}
main > section.hero{padding-top:56px!important;padding-bottom:72px!important}
main > section#contact{padding-top:96px!important;padding-bottom:96px!important}
main .sec-head{margin-bottom:32px}
main .sec-head h2{margin-bottom:0}
main > section.band > .wrap > :first-child{margin-top:0!important}
main > section.band > .wrap > :last-child,main > section.band > .wrap > :last-child > :last-child{margin-bottom:0!important}
/* frosted cards (C3) */
main .en-g3 > .card,main .en-opts > li,main .en-cta,#responsible-learning-together .intro{
  background:rgba(255,255,255,.66)!important;border:1px solid #D6DCE8;border-radius:22px;box-shadow:0 8px 24px rgba(20,32,74,.08);
  backdrop-filter:saturate(160%) blur(18px);-webkit-backdrop-filter:saturate(160%) blur(18px)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  main .en-g3 > .card,main .en-opts > li,main .en-cta,#responsible-learning-together .intro{background:#fff!important}}
.hero .hero-photo{border:1px solid #D6DCE8;border-radius:22px;padding:10px;background:rgba(255,255,255,.66);box-shadow:0 8px 24px rgba(20,32,74,.08);overflow:hidden}
.hero .hero-photo img{border-radius:14px}
h1,h2,h3,h4{text-wrap:balance} main p,main li{text-wrap:pretty}
main .card > :last-child,#responsible-learning-together .intro > :last-child,.en-cta > :last-child{margin-bottom:0!important}
main .en-g3 > .card > p:last-of-type{margin-bottom:0!important}
main .card > .btn-row,main .card > a.btn{margin-top:auto}
main .en-g3 figure.photo{margin:16px 0 0!important}
main .en-g3 figure.photo figcaption:empty{display:none}
main .en-g3 > .card > h3{margin-bottom:0}
/* 4 · options: frosted list items, title over description (same words, one item per option) */
ol.en-opts{list-style:none;padding:0;margin:24px 0}
ol.en-opts > li{padding:16px 20px;min-height:44px;display:flex;flex-direction:column;justify-content:center;gap:4px;margin:0}
ol.en-opts > li::before{display:none!important}
ol.en-opts .li-t{display:block}
#responsible-learning-together .intro{padding:24px}
.en-cta{padding:24px;text-align:center}
.en-cta .btn-row{justify-content:center}
@media (min-width:769px){
  /* 2 · make something real 4/4/4; 3 · partner model 4/4/4 joined by a thin connector line */
  .en-g3{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:24px!important;align-items:stretch;width:100%!important;max-width:none!important}
  main .en-g3 > .card:last-child{grid-column:auto!important;width:auto!important;justify-self:stretch!important}
  main .en-g3 > .card{padding-bottom:16px!important}
  .en-partner{position:relative}
  .en-partner::before{content:"";position:absolute;left:16%;right:16%;top:48px;height:2px;background:#D6DCE8;z-index:0}
  .en-partner > .card{position:relative;z-index:1}
  /* 4 · flexible by design 5/7: heading left; text, options (2-col) and photo right */
  #flexible-by-design .wrap{display:grid;grid-template-columns:5fr 7fr;gap:24px;align-items:start}
  #flexible-by-design .wrap > .sec-head{margin-bottom:0}
  #flexible-by-design .intro{max-width:none;margin:0}
  #flexible-by-design ol.en-opts{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  #flexible-by-design .intro > .photo{margin:0;max-width:calc(100% * 7 / 12 * 12 / 7)}
  #flexible-by-design .intro > .photo img{width:100%;height:auto;max-height:300px;object-fit:cover;border-radius:18px}
  /* 5 · responsible 5/7 */
  #responsible-learning-together .wrap{display:grid;grid-template-columns:5fr 7fr;gap:24px;align-items:start}
  #responsible-learning-together .wrap > .sec-head{margin-bottom:0}
  #responsible-learning-together .intro{max-width:none;margin:0}
  /* 6 · FAQ 5/7 */
  #before-you-begin .wrap{display:grid;grid-template-columns:5fr 7fr;gap:24px;align-items:start}
  #before-you-begin .wrap > .sec-head{margin-bottom:0}
  #before-you-begin .faq{max-width:none;margin:0}
  /* 7 · next step: 8-col centred CTA card */
  #bring-your-community-s-ideas-to-life .wrap > .sec-head{text-align:center;max-width:calc(8/12*100%);margin-left:auto;margin-right:auto}
  .en-cta{max-width:calc(8/12*100%);margin-left:auto!important;margin-right:auto!important}
  /* 8 · contact 6/6 */
  #contact .wrap{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
  #contact .wrap > .sec-head{margin-bottom:0}
  #contact .intro{max-width:none;margin:0}
}
#before-you-begin .faq summary{padding-top:10px;padding-bottom:10px;min-height:44px}
@media (max-width:768px){
  main > section.band{padding-top:40px!important;padding-bottom:40px!important}
  main > section.hero{padding-top:32px!important;padding-bottom:40px!important}
  main > section#contact{padding-top:40px!important;padding-bottom:40px!important}
  main .sec-head{margin-bottom:24px}
  .hero .hero-photo img{max-height:260px;width:100%;object-fit:cover}
  main [data-mobswipe]{align-items:stretch}
  main .en-g3[data-mobswipe]{width:100%!important;max-width:100%!important}
  main [data-mobswipe] > .card{display:flex;flex-direction:column;height:auto}
  main [data-mobswipe] > .card > figure.photo{flex:1 1 auto;display:flex;flex-direction:column;min-height:0}
  main [data-mobswipe] > .card > figure.photo img{flex:1 1 auto;height:auto;min-height:100%;object-fit:cover}
  main [data-mobswipe] > .card:not(:has(> figure.photo)){justify-content:space-evenly}
  ol.en-opts{--mobswipe-w:80%}
  #flexible-by-design .intro > .photo img{max-height:220px;width:100%;object-fit:cover}
  #responsible-learning-together .intro,.en-cta{padding:20px}
}
/* every edge passed the cap at 72 / 40 (contact at 96) -> both sides at the 56 / 32 floor */
@media (min-width:769px){main > section.band,main > section#contact{padding-top:56px!important;padding-bottom:56px!important}main > section.hero{padding-bottom:56px!important}}
@media (max-width:768px){main > section.band,main > section#contact{padding-top:32px!important;padding-bottom:32px!important}main > section.hero{padding-bottom:32px!important}}
