/* imaginAge section - own colour scheme (peach + purple, Raleway). Loaded after style.css on /imaginage-*/ pages */
@font-face{font-family:"Raleway";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/raleway-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Raleway";font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/raleway-latin-600-normal.woff2) format("woff2")}

body.imag{--purple:#483b8b;--peach:#fbe0d6;--orange:#f1855a;background:transparent;color:#333;font:400 15px/25.8px "Raleway",Arial,sans-serif}
.imag-top{background:var(--peach);height:120px;text-align:center;padding-top:10px}
.imag-top a{display:inline-block;line-height:0}
.imag-top img{width:150px;height:100px}
.imag-nav{background:var(--purple);position:sticky;top:0;z-index:50}
.imag-nav ul{list-style:none;margin:0 auto;padding:0;display:flex;justify-content:center;gap:52px;flex-wrap:wrap;max-width:1140px}
.imag-nav a{display:flex;align-items:center;gap:8px;height:60px;padding:0 22px;color:#fff;text-decoration:none;font:600 15px/1 "Raleway",Arial,sans-serif}
.imag-nav a:hover,.imag-nav a:focus-visible,.imag-nav a[aria-current="page"]{background:var(--orange);color:#fff}
.imag-nav a:focus-visible{outline:3px solid #fff;outline-offset:-3px}
.imag-nav svg{width:15px;height:15px;fill:currentColor;flex:none}
.imag main{padding:40px 0 60px}
.imag p{margin:0 0 20px}
.imag a{color:#333}
.imag a:hover,.imag a:focus{color:var(--purple)}
.imag-title{font:600 30px/36px "Raleway",Arial,sans-serif;color:var(--purple);margin:0 0 20px}
.imag-title.center{text-align:center}
.imag-lead{font:600 20px/34.4px "Raleway",Arial,sans-serif;color:var(--purple)}
.imag-sub{font:600 20px/24px "Raleway",Arial,sans-serif;color:var(--purple);text-align:center;margin:0 0 20px}
.imag-small{font-size:14px;line-height:24px}
.imag-h2{font:600 22px/1.4 "Raleway",Arial,sans-serif;color:var(--purple);margin:30px 0 20px}
.imag-h2 a{color:var(--purple)}
.imag-cols{display:grid;gap:44px;align-items:start}
.imag-cols-half{grid-template-columns:1fr 1fr;margin:0 0 20px}
.imag-cols-3{grid-template-columns:repeat(3,1fr)}
.imag-cols-3 img{display:block;width:100%;height:auto;margin-top:6px}
.imag-cols-help,.imag-cols-care,.imag-cols-form{grid-template-columns:704fr 352fr}
.imag-cols-help img{display:block;width:100%;height:auto;margin-bottom:6px}
.imag-side{padding-top:15px;text-align:center}
.imag-side p{font:400 20px/34.4px "Raleway",Arial,sans-serif;color:var(--purple)}
.imag-side a{color:#333}
.imag-wide-video{margin:20px 0 14px}
.supporters{margin:10px 0 0}
.supporters img{max-width:100%;height:auto}
.imag-rule{border:0;border-top:1px dashed rgba(72,59,139,.28);border-bottom:1px dashed rgba(72,59,139,.28);height:22px;margin:20px 0}
.imag-carousel{margin:0}
.imag-carousel .carousel-track{gap:13px;padding:0}
.imag-carousel li{flex:0 0 calc((100% - 26px)/3);height:auto;aspect-ratio:1}
.imag-carousel img{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover}
.imag-vrow{display:grid;grid-template-columns:792fr 264fr;gap:44px;align-items:start;margin:63px 0 20px}
.imag-vrow.flip{grid-template-columns:264fr 792fr}
.imag-vtext h2{font:400 24px/36px var(--head-font);color:var(--heading);margin:0 0 26px}
.imag-quotes{display:grid;grid-template-columns:1fr 1fr;gap:44px;margin-top:40px;align-items:start}
.imag-quote{margin:0 0 30px}
.imag-quote blockquote{position:relative;margin:0;padding:21px 22px;background:#f4845a;color:#fff;font:400 16px/25px "Raleway",Arial,sans-serif;border:0}
.imag-quote blockquote p{margin:0}
.imag-quote blockquote::after{content:"";position:absolute;left:20px;bottom:-12px;border:12px solid transparent;border-top-color:#f4845a;border-bottom:0}
.imag-quote figcaption{padding:20px 0 0 44px;font-size:13px;line-height:20px;color:var(--purple)}
.imag-form label{display:block;font-size:15px;line-height:23px;color:#333;margin:0 0 6px}
.imag-form .f2{display:grid;grid-template-columns:1fr 1fr;gap:20px 29px;margin-bottom:20px}
.imag-form input,.imag-form textarea{width:100%;height:40px;padding:6px 12px;border:1px solid #d2d2d2;border-radius:0;background:#fff;font:15px "Raleway",Arial,sans-serif;color:#333}
.imag-form textarea{height:100px;resize:vertical}
.imag-form input:focus,.imag-form textarea:focus{border-color:var(--purple);outline:2px solid rgba(72,59,139,.3)}
.imag-req{font-size:12px;line-height:18px;margin:20px 0}
.imag .btn{background:var(--red);padding:12px 36px;font:600 12px "Raleway",Arial,sans-serif;letter-spacing:.04em;border-radius:0}
.imag-foot{background:var(--purple);border-top:5px solid var(--orange);color:#fff;text-align:center;padding:24px 20px 85px}
.imag-foot p{margin:0 0 18px;font:400 15px/1.6 "Raleway",Arial,sans-serif}
.imag-foot a{display:inline-block;line-height:0}
.imag-foot img{width:196px;height:auto}

@media (max-width:900px){
  .imag-cols,.imag-cols-3,.imag-cols-half,.imag-cols-help,.imag-cols-care,.imag-cols-form,.imag-vrow,.imag-vrow.flip,.imag-quotes{grid-template-columns:1fr;gap:20px}
  .imag-vrow{margin:36px 0 10px}
  .imag-vrow.flip .imag-vtext{order:2}
  .imag-nav ul{gap:0}
  .imag-nav a{padding:0 14px;height:48px;font-size:14px}
  .imag-carousel li{flex-basis:calc((100% - 13px)/2)}
  .imag-form .f2{grid-template-columns:1fr}
}
@media (max-width:520px){
  .imag-top img{width:120px;height:80px}
  .imag-top{height:100px}
  .imag-title{font-size:25px;line-height:30px}
}

/* nav links stay white (beats .imag a) */
.imag .imag-nav a,.imag .imag-nav a:hover,.imag .imag-nav a:focus{color:#fff}
/* home: spacing around the trailer row matches live */
.imag-cols-half{margin-top:41px;margin-bottom:30px}
/* connecting: live sizes (diagram 20px lower, video 1100x700) */
.imag-cols-3 img{margin-top:26px}
.imag-wide-video{margin-bottom:32px}
.imag-wide-video .video{aspect-ratio:1100/700}
@media(max-width:900px){.imag-wide-video .video{aspect-ratio:16/9}}
/* care: trailer is 352x211 on live; quotes start 32px lower */
.imag-cols-care .video{aspect-ratio:352/211}
.imag-quotes{margin-top:72px}
/* videos page: live row spacing */
.imag-vrow{margin-top:83px}
.imag-title+.imag-vrow{margin-top:119px}
@media(max-width:900px){.imag-vrow,.imag-title+.imag-vrow{margin:36px 0 10px}}
/* contact: live spacing (labels 9px above inputs, 48px between rows, 71px message box, 43px button) */
.imag-intro{margin:40px 0 34px}
.imag-form label{margin-bottom:9px}
.imag-form .f2{gap:48px 29px;margin-bottom:48px}
.imag-form textarea{height:71px}
.imag-form .btn{height:43px;min-width:106px;padding:0 24px}
.imag-form .imag-check{margin:0 0 28px}
.imag-form .imag-check input{max-width:120px}