/* Shared page opening: Become a Customer green (#276749) and white text. */
body.sky-north.sg-colour-header #main-content { padding-top:0; }
.sg-colour-header .sg-page {
  --sg-hero-background:var(--sky-hero-background);
  --sg-hero-ink:var(--sky-hero-ink);
  max-width:none; width:100%; margin:0; padding:0 0 96px;
}
.sg-colour-header .sg-page > :not(.sg-intro):not(.sg-about-hero) {
  width:calc(100% - 64px); max-width:1120px; margin-inline:auto;
}
.sg-colour-header .sg-page > :is(.sg-intro,.sg-about-hero) {
  width:100%; max-width:none; margin:0; border:0;
  min-height:490px;
  padding:174px max(32px,calc((100% - 1120px) / 2)) 76px;
  background:var(--sg-hero-background); color:var(--sg-hero-ink);
}
.sg-colour-header .sg-page > :is(.sg-intro,.sg-about-hero) .sg-eyebrow { color:var(--sg-hero-ink); }
.sg-colour-header .sg-page > :is(.sg-intro,.sg-about-hero) .sg-eyebrow::before { background:var(--sg-hero-ink); }
body.sky-north.sg-colour-header #wrapwrap .sg-page > :is(.sg-intro,.sg-about-hero) h1 {
  color:var(--sg-hero-ink); font-size:clamp(48px,5vw,72px); line-height:1.06;
}
.sg-colour-header .sg-page > :is(.sg-intro,.sg-about-hero) h1 em { color:var(--sg-hero-ink); }
.sg-colour-header .sg-intro .sg-intro-lead { color:var(--sg-hero-ink); font-size:18px; line-height:1.7; max-width:380px; }
.sg-colour-header .sg-about-hero .sg-about-copy > p { color:var(--sg-hero-ink); }
.sg-colour-header .sg-privacy > .sg-intro .sg-policy-date { color:var(--sg-hero-ink); }
.sg-colour-header .sg-about-photo img { max-height:460px; }
.sg-colour-header .sg-page > :is(.sg-form-layout,.sg-faq,.sg-value-list,.sg-prose) { margin-top:56px; }
.sg-colour-header .sg-page > .sg-faq { max-width:880px; }
.sg-colour-header .sg-page > .sg-prose { max-width:760px; }
.sg-colour-header .sg-page > .sg-section:nth-child(2) { margin-top:0; padding-top:64px; border-top:0; }
@media (min-width:768px) and (max-width:1023px) {
  .sg-colour-header .sg-page > :is(.sg-intro,.sg-about-hero) {
    padding-top:148px; padding-bottom:60px; min-height:440px;
  }
}
@media (max-width:767px) {
  .sg-colour-header .sg-page { margin:0; padding-top:0; padding-bottom:64px; }
  .sg-colour-header .sg-page > :not(.sg-intro):not(.sg-about-hero) { width:calc(100% - 48px); }
  .sg-colour-header .sg-page > :is(.sg-intro,.sg-about-hero) {
    grid-template-columns:1fr; gap:24px; min-height:0; padding:136px 24px 48px;
  }
  body.sky-north.sg-colour-header #wrapwrap .sg-page > :is(.sg-intro,.sg-about-hero) h1 { font-size:clamp(42px,9.4vw,58px); }
  .sg-colour-header .sg-intro .sg-intro-lead { font-size:16px; max-width:520px; }
  .sg-colour-header .sg-page > :is(.sg-form-layout,.sg-faq,.sg-value-list,.sg-prose) { margin-top:32px; }
  .sg-colour-header .sg-page > .sg-section:nth-child(2) { padding-top:40px; }
}
@media (max-width:359px) {
  .sg-colour-header .sg-page > :not(.sg-intro):not(.sg-about-hero) { width:calc(100% - 32px); }
  .sg-colour-header .sg-page > :is(.sg-intro,.sg-about-hero) { padding-inline:16px; }
}

/* Match the shared page hero height while preserving all content. */
@media(min-width:1024px) {
 .sg-colour-header .sg-about > .sg-about-hero { min-height:490px; padding-top:148px; padding-bottom:48px; }
 body.sky-north.sg-colour-header #wrapwrap .sg-about > .sg-about-hero h1 { font-size:50px; margin-bottom:16px; }
 .sg-about-hero .sg-eyebrow { margin-bottom:16px!important; }
 .sg-about-hero .sg-lead { font-size:18px; line-height:1.5; margin-bottom:12px!important; }
 .sg-colour-header .sg-about-hero .sg-about-copy > p:last-child { max-width:none; font-size:15px; line-height:1.6; }
 .sg-colour-header .sg-about-hero .sg-about-photo img { height:270px; max-height:270px; aspect-ratio:auto; }
}
@media(min-width:768px) and (max-width:1023px) {
 .sg-colour-header .sg-about > .sg-about-hero { min-height:440px; padding-top:128px; padding-bottom:32px; grid-template-columns:1.6fr 1fr; gap:24px; }
 body.sky-north.sg-colour-header #wrapwrap .sg-about > .sg-about-hero h1 { font-size:40px; margin-bottom:14px; }
 .sg-about-hero .sg-eyebrow { margin-bottom:14px!important; }
 .sg-about-hero .sg-lead { font-size:17px; line-height:1.5; margin-bottom:10px!important; }
 .sg-colour-header .sg-about-hero .sg-about-copy > p:last-child { max-width:none; font-size:14px; line-height:1.6; }
 .sg-colour-header .sg-about-hero .sg-about-photo img { height:248px; max-height:248px; aspect-ratio:auto; }
}