/* November refinements: continuous surfaces, integrated navigation, still scenes. */
.energy-experience {
  --header-height: 86px;
}
.energy-experience .site-header {
  position: sticky;
  top: 0;
  height: var(--header-height);
  margin-bottom: calc(-1 * var(--header-height));
  color: #f4f6ef;
  background: linear-gradient(180deg, #0b1a1480, #0b1a1418);
  border-bottom: 1px solid transparent;
  box-shadow: none;
  transition: background .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.energy-experience .site-header.is-scrolled,
.energy-experience .site-header.menu-open {
  background: #15251eea;
  border-bottom-color: #dce9cf21;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 8px 30px #07130e0d;
}
.energy-experience .site-header .brand {
  background: transparent;
}
.energy-experience .site-header .brand img {
  filter: url(#header-logo-transparency);
}
.energy-experience .site-header nav {
  color: #f4f6ef;
}
.energy-experience .site-header .button.small {
  background: #d4edb819;
  border-color: #e1edda70;
  color: #f5f8ef;
  box-shadow: none;
}
.energy-experience .site-header .button.small:hover {
  background: #d4edb82e;
}
.energy-experience .site-header .menu-toggle {
  color: #f4f6ef;
  border-color: #dce9cf66;
  background: #10251d20;
}
.energy-experience .hero {
  height: 100svh;
  min-height: 760px;
}
.energy-experience .hero-copy {
  padding-top: clamp(150px, 19vh, 215px);
}
.energy-experience .hero-shade {
  background: linear-gradient(90deg, #07130ed9 0%, #0b191a9c 30%, #10231d0a 72%),
              linear-gradient(0deg, #06130de6, transparent 36%);
}
.energy-experience .hero-bottom {
  grid-template-columns: minmax(280px, 1fr) auto;
}
/* The scenes are photographs/renderings; no false animation controls or idle zoom. */
.energy-experience .hero-visual img,
.energy-experience .scene-depth img {
  animation: none !important;
  transform: none;
}
.energy-experience .ecosystem,
.energy-experience .method,
.energy-experience .partnerships,
.energy-experience .installation-works {
  background: var(--paper);
}
.energy-experience .industrial-chapter {
  position: relative;
  background: #101a15;
}
.energy-experience .industrial-chapter::after {
  content: '';
  display: block;
  height: 20px;
  background: linear-gradient(180deg, #101a15, var(--paper));
  pointer-events: none;
}
.energy-experience .industrial-inner {
  padding-bottom: clamp(58px, 6vw, 90px);
}
.energy-experience .industrial-offer {
  background: #dce9cf06;
  border-color: #c8d9bb30;
}

/* Change only the size of the existing territory line. */
.energy-experience .hero-bottom .service-area { font-size: 18px; }

/* Only the dash offset moves; the SVG and its geometry remain stationary. */
.energy-experience .energy-flow svg { animation: none; transform: none; }
.energy-experience .energy-flow svg path {
  animation: app-energy-current 12s linear infinite;
  animation-play-state: paused;
}
.energy-experience .energy-flow.scene-in-view svg path { animation-play-state: running; }
@keyframes app-energy-current {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: -60; }
}

/* Compact company footer: all layout rules stay inside this final section. */
.energy-experience .site-footer {
  display: block;
  padding: 32px var(--space) 18px;
  background: #fff;
  color: var(--ink);
}
.site-footer .footer-inner { max-width: 1160px; margin: 0 auto; }
.site-footer .footer-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 32px;
  padding-bottom: 24px;
}
.site-footer .footer-branding { min-width: 0; }
.site-footer .footer-branding .brand { width: 196px; height: 60px; }
.site-footer .footer-branding .brand img { width: 230px; left: -17px; filter: none; }
.site-footer .footer-branding p { margin: 8px 0 0; font-size: 13px; line-height: 1.6; }
.site-footer .footer-reach {
  display: grid;
  grid-template-columns: auto auto;
  gap: 12px 30px;
  margin: 0;
}
.site-footer .footer-reach > div,
.site-footer .footer-offices > div { min-width: 0; }
.site-footer .footer-reach dt { color: #677260; font-size: 11px; line-height: 1.5; }
.site-footer .footer-reach dd { margin: 0; }
.site-footer .footer-reach a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: 15px;
  font-weight: 500;
  text-underline-offset: 4px;
  overflow-wrap: anywhere;
}
.site-footer .footer-offices {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px 52px;
  margin: 0;
  padding: 22px 0;
  border-top: 1px solid #d9e1d3;
}
.site-footer .footer-offices dt { margin-bottom: 6px; font-size: 13px; font-weight: 600; line-height: 1.5; }
.site-footer .footer-offices dd { margin: 0; color: #677260; font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
.site-footer .footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px 24px;
  padding-top: 12px;
  border-top: 1px solid #d9e1d3;
}
.site-footer .footer-legal { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 12px; line-height: 1.7; color: #677260; }
.site-footer .footer-legal strong { color: var(--ink); font-weight: 600; }
.site-footer .footer-utility { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; }
.site-footer .footer-utility a { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 0; font-size: 12px; text-underline-offset: 4px; }
.site-footer .footer-utility .back-top { margin: 0; }
@media (max-width: 1000px) {
  .site-footer .footer-reach { grid-template-columns: minmax(0, 1fr); gap: 4px; }
}
@media (max-width: 600px) {
  .energy-experience .site-footer { padding: 26px var(--space) 16px; }
  .site-footer .footer-top { grid-template-columns: minmax(0, 1fr); gap: 24px; padding-bottom: 20px; }
  .site-footer .footer-reach { gap: 8px; }
  .site-footer .footer-reach a { font-size: 16px; }
  .site-footer .footer-offices { grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 20px 0; }
  .site-footer .footer-legal { flex-direction: column; gap: 3px; }
  .site-footer .footer-bottom { align-items: flex-start; gap: 10px; padding-top: 16px; }
  .site-footer .footer-utility { width: 100%; justify-content: space-between; gap: 8px 20px; }
}
@media (max-width: 900px) {
  .energy-experience { --header-height: 78px; }
  .energy-experience .site-header nav {
    top: calc(var(--header-height) - 1px);
    background: #15251ef5;
    border-bottom: 1px solid #dce9cf33;
    box-shadow: 0 16px 26px #07130e24;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
  }
  .energy-experience .site-header nav a:not(.button) { color: #f4f6ef; }
  .energy-experience .hero { min-height: 750px; }
  .energy-experience .hero-copy { padding-top: 155px; }
}
@media (max-width: 600px) {
  .energy-experience { --header-height: 72px; }
  .energy-experience .hero { height: auto; min-height: 870px; }
  .energy-experience .hero-copy { padding: 130px var(--space) 330px; }
  .energy-experience .hero-visual img { object-position: center 62%; }
  .energy-experience .hero-shade {
    background: linear-gradient(180deg, #07150ed9 0%, #07150eaf 34%, #0a1a1429 65%, #0a1b11ed 100%);
  }
  .energy-experience .hero-bottom { grid-template-columns: 1fr; bottom: 50px; }
  .energy-experience .industrial-chapter::after { height: 14px; }
  .energy-experience .hero-bottom .service-area { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .energy-experience .site-header { transition: none; }
  .energy-experience .energy-flow svg path { animation: none !important; }
}