/* Homepage hero data-center cutaway graphic removed per Sean Park's request (relayed by Han Ju Lee). */
.hero-cutaway-stage{display:none!important;}

/* Homepage white "positioning" strip below the hero removed; its copy now lives under the hero H1 instead (see tge-home-icon-fix.js). */
section:has(.hero-positioning-copy){display:none!important;}

/* Separate the paired project photos without altering their imagery. */
main img[alt="Solar arrays beside TransGrid battery storage"]{border-left:3px solid #fff;box-sizing:border-box;}
@media(max-width:1023px){
 main img[alt="Solar arrays beside TransGrid battery storage"]{border-left:0;border-top:3px solid #fff;}
 body header.tge-global-header .tge-global-mobile-menu{
  top:0!important;bottom:0;left:auto!important;right:0!important;
  width:min(380px,calc(100% - 24px));height:100dvh;max-height:100dvh!important;
  border-radius:20px 0 0 20px!important;padding:80px 24px 32px!important;
  background:#101637!important;z-index:3;box-shadow:-20px 0 60px #0006;
 }
 html.tge-menu-open header.tge-global-header::before{content:'';position:fixed;inset:0;background:#03071b99;backdrop-filter:blur(4px);z-index:2;}
 body header.tge-global-header .tge-global-mobile-menu:not([hidden]){animation:mobile-drawer-in .22s ease-out;}
 body header.tge-global-header .mobile-nav-group>ul{display:block!important;padding:2px 0 14px!important;}
 body header.tge-global-header .mobile-nav-group{border:0!important;margin:0 0 6px!important;padding:0!important;}
 /* Section labels for grouped categories (e.g. "Our Capabilities", "About Us") — these are non-interactive triggers, not destinations. */
 body header.tge-global-header .mobile-nav-group>button.tge-global-mobile-heading{padding:14px 10px 4px!important;color:#a79fd6!important;font-size:12px!important;font-weight:700!important;min-height:auto!important;letter-spacing:.12em;}
 /* Direct top-level page links (Projects, News, Careers) are primary nav items and read at full size. */
 body header.tge-global-header .mobile-nav-group>a.tge-global-mobile-heading{padding:15px 10px!important;color:#fff!important;font-size:20px!important;font-weight:700!important;min-height:54px!important;letter-spacing:0;text-transform:none;}
 .mobile-submenu-toggle,.mobile-nav-group>.tge-global-mobile-heading::after{display:none!important;}
 body header.tge-global-header .tge-global-mobile-menu .tge-global-dropdown-link{padding:13px 12px!important;font-size:17px!important;font-weight:500!important;min-height:50px;}
 body header.tge-global-header .tge-global-mobile-menu .tge-global-dropdown-link:active{background:#ffffff12;}
 body header.tge-global-header .tge-global-mobile-cta{margin-top:18px!important;min-height:56px!important;border:0!important;border-radius:12px!important;background:linear-gradient(120deg,#1c2b4a,#2f6fae)!important;font-size:16px!important;font-weight:700!important;letter-spacing:.04em!important;}
 .mobile-drawer-close{position:absolute;right:20px;top:20px;width:44px;height:44px;border:1px solid #ffffff40;border-radius:50%;background:transparent;color:#fff;font-size:28px;line-height:1;}
 body header.tge-global-header .tge-global-mobile-toggle{border:0!important;background:transparent;border-radius:50%;width:44px;height:44px;gap:6px;}
 .tge-global-mobile-toggle span{width:22px!important;height:2px!important;border-radius:2px;}
 .tge-global-mobile-toggle span:nth-child(2){display:block;}
 body footer a[aria-label="TransGrid Energy on LinkedIn"]{box-sizing:border-box;width:44px!important;height:44px!important;min-width:44px;min-height:44px;flex:0 0 44px;border-radius:50%;padding:0!important;display:inline-flex;align-items:center;justify-content:center;}
 body footer a[aria-label="TransGrid Energy on LinkedIn"] svg{width:18px!important;height:18px!important;flex:0 0 18px;}
 main h2{font-size:clamp(26px,5.8vw,32px)!important;line-height:1.2!important;text-wrap:pretty;}
 main :is(.eyebrow,.press-eyebrow,.t-eyebrow){font-size:11px!important;line-height:1.5!important;letter-spacing:.09em!important;max-width:38ch;}
 main>.hero,main>.ipp-hero,main>.press-hero,main>[data-page-layer=hero]{min-height:0!important;height:auto!important;}
 main>.hero .hero-content,main>.ipp-hero>div:not([aria-hidden]),main>[data-page-layer=hero]>.page-gutter{min-height:0!important;padding-top:112px!important;padding-bottom:44px!important;}
 body main>.hero h1,body main>.ipp-hero h1,body main>[data-page-layer=hero] h1{font-size:clamp(32px,7.5vw,42px)!important;line-height:1.13!important;max-width:22ch;}
 main>.hero .hero-text{font-size:16px!important;line-height:1.65!important;margin-top:24px!important;}
 .release-hero{padding:112px 0 40px!important;min-height:0!important;}
 body main .press-hero.release-hero h1{font-size:clamp(25px,5.4vw,32px)!important;line-height:1.28!important;font-weight:500!important;max-width:32ch!important;text-wrap:pretty;}
 .release-hero .release-back{display:inline-flex;margin-bottom:24px;min-height:44px;align-items:center;}
 main>section:has(.hero-positioning-copy)>div{padding-top:32px!important;padding-bottom:32px!important;}
 main>section:has(img[alt="NVIDIA"])>div{padding-top:28px!important;padding-bottom:28px!important;row-gap:24px!important;}
 main>section.relative.bg-background:has(img[alt^="EnergyFluo"]){display:flex;flex-direction:column;}
 main>section.relative.bg-background:has(img[alt^="EnergyFluo"])>div:first-child{display:none;}
 main>section.relative.bg-background:has(img[alt^="EnergyFluo"]) .absolute.top-0{position:static!important;margin:0 -24px;padding:28px 24px;background:linear-gradient(90deg,#2f3e5f,#227aa8);}
 main>section.relative.bg-background:has(img[alt^="EnergyFluo"]) .absolute.top-0 h2{margin-bottom:0;}
}
@keyframes mobile-drawer-in{from{transform:translateX(100%)}to{transform:translateX(0)}}
/* Keep the answer copy comfortably inside the campus card at laptop widths. */
@media(min-width:1024px){
 main div:has(>img[alt="Data center campus at night"]){min-height:480px;}
 main img[alt="Data center campus at night"]{height:480px!important;object-fit:cover;object-position:center;}
 main div:has(>img[alt="Data center campus at night"])>div.absolute.z-20{top:40.56%!important;bottom:11.66%!important;}
}
@media(prefers-reduced-motion:reduce){body header.tge-global-header .tge-global-mobile-menu:not([hidden]){animation:none}}
/* Approved September content pass: shared cleanup and rebalanced layouts. */
header a[href*="/customer-login/"],
header a[href*="/about/leadership/"],
footer li:has(> a[href*="/customer-login/"]),
footer li:has(> a[href*="/about/leadership/"]) {
  display: none !important;
}

.contact-brief-grid {
  grid-template-columns: minmax(0, 1fr) !important;
}

.contact-form-wrap {
  width: min(100%, 920px);
  margin-inline: auto;
}

.energyfluo h3 img {
  display: block;
  width: min(100%, 250px);
  height: auto;
  filter: brightness(0) invert(1);
}

.tge-home-trusted-label {
  grid-column: 1 / -1;
  margin: 0 0 8px;
  color: #6a6f87;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  text-align: center;
  text-transform: uppercase;
}

.tge-home-energyfluo-logo {
  display: block;
  width: min(100%, 198px);
  height: auto;
  margin: 20px 0 0 auto;
}

.tge-energyfluo-dashboard-frame {
  overflow: hidden;
}

.tge-energyfluo-dashboard-frame > img:first-child {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 0 auto;
  clip-path: inset(0 0 0 0 round 10px);
}

/* Demand curve starts near the viewport and completes as one concise sequence. */
.demand-curve .dc-fill {
  transition-duration: .55s !important;
  transition-delay: .12s !important;
}

.demand-curve .dc-line {
  transition-duration: 1.05s !important;
  transition-delay: .05s !important;
}

.demand-curve .dc-before {
  transition-delay: .35s !important;
}

.demand-curve .dc-after {
  transition-delay: .78s !important;
}

.demand-curve .dc-bolt-before {
  transition-delay: .5s !important;
}

.demand-curve .dc-bolt-after {
  transition-delay: 1.05s !important;
}

/* IPP metrics use the full card and center their paired value/label. */
.ipp-metric {
  align-content: center !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center;
}

.tge-project-single-card {
  grid-template-columns: minmax(0, 760px) !important;
}

@media (max-width: 620px) {
  body:has(.hero-positioning-copy) main > section.relative.isolate:first-child h1 {
    font-size: 30px !important;
    line-height: 1.06 !important;
  }

  body:has(.hero-positioning-copy) main > section.relative.isolate:first-child h1 span {
    white-space: nowrap;
  }

  body:has(.hero-positioning-copy) .hero-cutaway-stage {
    display: none !important;
  }

  .tge-home-energyfluo-logo {
    width: 162px;
    margin-top: 14px;
  }

  .tge-energyfluo-dashboard-frame > img:first-child {
    margin-top: 0;
  }
}

/* Approved homepage partner bar: one restrained row with project-approved brands. */
main > section:has(.tge-home-trusted-label) {
  position: static;
  z-index: auto;
  border-bottom: 1px solid #e1e3ea !important;
  background: #fff;
}

main > section:has(.tge-home-trusted-label) > div {
  display: grid !important;
  grid-template-columns: max-content 128px 101px 122px !important;
  align-items: center;
  justify-content: start;
  column-gap: 48px !important;
  row-gap: 0 !important;
  max-width: 1280px !important;
  padding-top: 38px !important;
  padding-bottom: 38px !important;
  border: 0;
}

@media (min-width: 1024px) {
  body:has(.hero-positioning-copy) .hero-cutaway {
    bottom: -8.5rem !important;
    right: -2rem !important;
    width: clamp(500px, 43vw, 610px) !important;
  }
}

.tge-home-trusted-label {
  grid-column: auto;
  margin: 0;
  align-self: center;
  color: #8b8d94;
  font-size: 11px !important;
  font-weight: 600;
  letter-spacing: .01em;
  line-height: 1;
  text-align: left;
  text-transform: none;
  white-space: nowrap;
  flex: 0 0 auto;
}

/* Trim transparent asset padding in layout so the visible marks have equal gaps. */
body main p.tge-home-trusted-label {
  font-size: 12px !important;
  line-height: 1.15 !important;
}

main > section:has(.tge-home-trusted-label) > div > div {
  position: relative;
  flex: 0 0 auto;
  overflow: hidden;
}
main > section:has(.tge-home-trusted-label) > div > div:has(img[alt="Microsoft"]) {
  width: 128px;
  aspect-ratio: 128 / 28;
}
main > section:has(.tge-home-trusted-label) > div > div:has(img[alt="Qcells"]) {
  width: 101px;
  aspect-ratio: 97 / 27;
}
main > section:has(.tge-home-trusted-label) > div > div:has(img[alt="Prime Group Holdings"]) {
  width: 122px;
  aspect-ratio: 1883 / 434;
}
main > section:has(.tge-home-trusted-label) > div > div > img {
  position: absolute;
  max-width: none;
  max-height: none !important;
}
main > section:has(.tge-home-trusted-label) img[alt="Microsoft"] {
  width: 118.75% !important;
  left: -9.375%;
  top: -39.2857%;
}
main > section:has(.tge-home-trusted-label) img[alt="Qcells"] {
  width: 125.7732% !important;
  left: -13.4021%;
  top: -48.1481%;
}
main > section:has(.tge-home-trusted-label) img[alt="Prime Group Holdings"] {
  width: 100% !important;
  left: 0;
  top: 0;
}

main > section:has(.tge-home-trusted-label) img {
  width: auto !important;
  max-width: 100%;
  height: auto !important;
  max-height: 38px;
  opacity: .72 !important;
}

main > section:has(.tge-home-trusted-label) img[alt="Prime Group Holdings"] {
  max-height: 42px;
  opacity: .9 !important;
  filter: brightness(.9) contrast(1.04);
}

@media (max-width: 620px) {
  main > section:has(.tge-home-trusted-label) > div {
    display: grid !important;
    grid-template-columns: max-content 78px 61px 74px !important;
    justify-content: space-between;
    column-gap: 10px !important;
    padding: 30px 12px !important;
  }

  body main p.tge-home-trusted-label {
    font-size: 9px !important;
    line-height: 1.15;
  }

  main > section:has(.tge-home-trusted-label) img {
    max-height: 25px;
  }

  main > section:has(.tge-home-trusted-label) img[alt="Prime Group Holdings"] {
    max-height: 28px;
  }
  main > section:has(.tge-home-trusted-label) > div > div:has(img[alt="Microsoft"]) { width: 78px; }
  main > section:has(.tge-home-trusted-label) > div > div:has(img[alt="Qcells"]) { width: 61px; }
  main > section:has(.tge-home-trusted-label) > div > div:has(img[alt="Prime Group Holdings"]) { width: 74px; }
}

/* The Answer: one compact blackout-versus-powered campus scene, visually tied
   to the demand curve above it. The two rails continue the existing marker
   positions and terminate inside the corresponding powered/blackout buildings. */
.demand-curve {
  position: relative;
  z-index: 3;
  isolation: isolate;
}

main > section:has(.demand-curve) > div > div:first-child {
  z-index: 40 !important;
}

.demand-curve::before,
.demand-curve::after {
  content: "";
  position: absolute;
  width: 15px;
  transform: translateX(-50%);
  pointer-events: none;
  z-index: 30;
  color: currentColor;
  background:
    linear-gradient(currentColor, currentColor) center top / 2px calc(100% - 5px) no-repeat,
    radial-gradient(circle at 50% 100%, currentColor 0 4px, #fff 4.5px 7px, transparent 7.5px);
  filter: drop-shadow(0 1px 1px rgba(8, 15, 45, .18));
}

.demand-curve::before {
  left: 12.9%;
  top: 83.8%;
  height: calc(16.2% + clamp(72px, 5.6vw, 88px));
  color: #1f8a44;
}

.demand-curve::after {
  left: 64.9%;
  top: 38.4%;
  height: calc(61.6% + clamp(194px, 16vw, 232px));
  color: #bd444f;
}

main div:has(> img[alt="Data center campus with one dark facility beside powered buildings"]) {
  position: relative;
  min-height: 0;
  margin-top: -10px !important;
  overflow: hidden !important;
  border-radius: 24px;
  background: #080f2d;
}

main img[alt="Data center campus with one dark facility beside powered buildings"] {
  display: block;
  width: 100%;
  height: clamp(280px, 28.6vw, 360px) !important;
  object-fit: cover;
  object-position: center;
}

@media (min-width: 1024px) {
  main div:has(> img[alt="Data center campus with one dark facility beside powered buildings"]) {
    min-height: clamp(280px, 28.6vw, 360px);
    margin-top: -14px !important;
  }

  main div:has(> img[alt="Data center campus with one dark facility beside powered buildings"]) > div.absolute.z-20 {
    inset: 0 auto 0 0 !important;
    width: min(50%, 610px);
    align-items: center;
    background: linear-gradient(90deg, rgba(8, 15, 45, .96) 0%, rgba(8, 15, 45, .82) 66%, rgba(8, 15, 45, 0) 100%);
  }

  main div:has(> img[alt="Data center campus with one dark facility beside powered buildings"]) > div.absolute.z-20 > div {
    padding: 0 48px 0 64px;
  }
}

@media (max-width: 1023px) {
  .demand-curve::before {
    height: calc(16.2% + clamp(78px, 24vw, 124px));
  }

  .demand-curve::after {
    height: calc(61.6% + clamp(140px, 42vw, 204px));
  }

  main div:has(> img[alt="Data center campus with one dark facility beside powered buildings"]) {
    border-radius: 24px 24px 0 0;
  }

  main img[alt="Data center campus with one dark facility beside powered buildings"] {
    height: clamp(210px, 54vw, 300px) !important;
    object-position: 66% center;
  }
}

/* VPP: stronger phase hierarchy and deliberate light-blue system actions. */
.tge-home-trusted-label {
  display: none !important;
}

main > section:has(.tge-home-trusted-label) {
  display: none !important;
}

.vpp-capacity-card .vpp-card-label,
.capacity-card .card-label {
  font-size: 16px !important;
  line-height: 1.35 !important;
  letter-spacing: .08em;
}

.vpp-action-card .vpp-card-label,
.action-card .card-label {
  color: #c9eaff !important;
  font-size: 15px !important;
  line-height: 1.4 !important;
  letter-spacing: .08em;
}

@media (max-width: 620px) {
  .vpp-capacity-card .vpp-card-label,
  .capacity-card .card-label,
  .vpp-action-card .vpp-card-label,
  .action-card .card-label {
    font-size: 14px !important;
  }
}

/* Homepage hero: taller on mobile so the video reads, with a tighter gap to the next section. */
@media (max-width: 767px) {
  main > section[class="relative isolate lg:h-[800px]"] {
    height: 68vh !important;
    height: 68dvh !important;
  }
  main > section.border-b.bg-background > div[class*="pb-24"][class*="pt-14"] {
    padding-top: 28px !important;
    padding-bottom: 32px !important;
  }
}
