@font-face {
    font-family:Lato;
    src:url('fonts/lato-regular.woff2') format('woff2');
    font-weight:400;
    font-style:normal;
    font-display:swap;
}

@font-face {
    font-family:Lato;
    src:url('fonts/lato-700.ttf') format('truetype');
    font-weight:700 900;
    font-style:normal;
    font-display:swap;
}

@font-face {
    font-family:Lato;
    src:url('fonts/lato-600.ttf') format('truetype');
    font-weight:600;
    font-style:normal;
    font-display:swap;
}

:root {
    --ink:#14243c;
    --blue:#355ce8;
    --blue-dark:#2347c4;
    --white:#fff;
    --porcelain:#f5f7fb;
    --muted:#5c6779;
    --line:#e0e5ef;
    --sky:#dcecff;
    --mint:#dceee5;
    --green:#285e49;
    --radius:24px;
}

* {
    box-sizing:border-box;
}

html {
    scroll-behavior:smooth;
    scroll-padding-top:115px;
}

body {
    margin:0;
    background:var(--white);
    color:var(--ink);
    font-family:Lato,Arial,sans-serif;
    font-size:16px;
    line-height:1.65;
    -webkit-font-smoothing:antialiased;
}

a {
    color:inherit;
    text-decoration:none;
}

button,input,select,textarea {
    font:inherit;
}

button,a,input,summary {
    -webkit-tap-highlight-color:transparent;
}

button,summary {
    cursor:pointer;
}

img {
    display:block;
    max-width:100%;
    height:auto;
}

button {
    color:inherit;
}

svg {
    display:block;
}

h1,h2,h3,p {
    margin:0;
}

h1,h2,h3 {
    line-height:1.12;
    letter-spacing:-.035em;
    font-weight:700;
    text-wrap:balance;
}

h1 {
    font-size:clamp(48px,5.65vw,80px);
}

h2 {
    font-size:clamp(34px,3.6vw,50px);
}

h3 {
    font-size:25px;
}

p {
    color:var(--muted);
    text-wrap:pretty;
}

a,button {
    -webkit-tap-highlight-color:transparent;
}

a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible {
    outline:3px solid var(--blue);
    outline-offset:5px;
}

::selection {
    background:var(--sky);
    color:var(--ink);
}

[hidden] {
    display:none!important;
}

.site-container {
    width:min(100% - 96px,1280px);
    margin-inline:auto;
}

.icon-library {
    position:absolute;
    width:0;
    height:0;
    overflow:hidden;
}

.icon {
    width:23px;
    height:23px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
    flex-shrink:0;
}

.skip-link {
    position:fixed;
    top:-80px;
    left:20px;
    z-index:1000;
    background:var(--white);
    padding:12px 20px;
}

.skip-link:focus {
    top:12px;
}

.utility-bar {
    background:var(--porcelain);
    font-size:12px;
    color:#59677f;
    border-bottom:1px solid #edf0f6;
}

.utility-inner {
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:33px;
}

.utility-inner a {
    font-weight:700;
}

.site-header {
    background:rgba(255,255,255,.97);
    position:sticky;
    top:0;
    z-index:50;
    border-bottom:1px solid transparent;
    transition:box-shadow .25s,border-color .25s;
}

.site-header.is-scrolled {
    border-color:var(--line);
    box-shadow:0 4px 20px #14243c05;
}

.header-inner {
    height:96px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:32px;
}

.site-logo {
    width:194px;
    flex-shrink:0;
}

.site-logo img {
    width:100%;
    height:58px;
    object-fit:contain;
}

.desktop-nav {
    display:flex;
    align-items:center;
    gap:29px;
    margin-left:auto;
    font-size:14px;
    font-weight:600;
}

.desktop-nav a {
    position:relative;
    padding-block:13px;
    white-space:nowrap;
}

.desktop-nav a:after {
    content:'';
    position:absolute;
    bottom:6px;
    left:0;
    right:0;
    height:2px;
    background:var(--blue);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .22s;
}

.desktop-nav a:hover:after,.desktop-nav a[aria-current=page]:after {
    transform:scaleX(1);
}

.header-actions {
    display:flex;
    align-items:center;
    gap:25px;
}

.login-link {
    display:flex;
    align-items:center;
    gap:7px;
    font-size:14px;
    white-space:nowrap;
}

.login-link .icon {
    width:19px;
    height:19px;
}

.button {
    display:inline-flex;
    justify-content:center;
    align-items:center;
    gap:21px;
    padding:16px 23px;
    min-height:56px;
    border:1px solid transparent;
    border-radius:8px;
    font-size:14px;
    font-weight:700;
    line-height:1.4;
    transition:background .2s,box-shadow .2s;
    cursor:pointer;
}

.button .icon {
    width:19px;
    height:19px;
    transition:transform .2s;
}

.button:hover .icon {
    transform:translate(2px,-2px);
}

.button-primary {
    background:var(--blue);
    color:var(--white);
}

.button-primary:hover {
    background:var(--blue-dark);
    box-shadow:0 6px 20px #355ce828;
}

.button-secondary {
    border-color:var(--line);
    background:var(--white);
}

.button-white {
    background:var(--white);
    color:var(--ink);
}

.button-dark {
    background:var(--ink);
    color:var(--white);
}

.button-dark:hover {
    background:#233954;
}

.header-cta {
    padding:12px 17px;
    min-height:45px;
    gap:13px;
}

.menu-toggle {
    display:none;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:6px;
    background:none;
    border:1px solid var(--line);
    border-radius:7px;
    width:44px;
    height:44px;
}

.menu-toggle span {
    width:19px;
    height:1.5px;
    background:var(--ink);
    transition:transform .2s;
}

.menu-toggle[aria-expanded=true] span:first-child {
    transform:translateY(3.75px) rotate(45deg);
}

.menu-toggle[aria-expanded=true] span:last-child {
    transform:translateY(-3.75px) rotate(-45deg);
}

.mobile-nav {
    padding:12px 24px 24px;
    border-top:1px solid var(--line);
    background:var(--white);
    max-height:calc(100dvh - 90px);
    overflow:auto;
}

.mobile-nav a {
    display:block;
    padding:12px 0;
    border-bottom:1px solid var(--line);
}

.status-dot {
    display:inline-block;
    width:7px;
    height:7px;
    background:var(--blue);
    border-radius:50%;
    flex-shrink:0;
}

.home-hero {
    display:grid;
    grid-template-columns:1.12fr 1fr;
    gap:48px;
    align-items:center;
    min-height:710px;
    padding-top:40px;
    padding-bottom:66px;
}

.hero-kicker {
    display:flex;
    align-items:center;
    gap:11px;
    font-size:13px;
    font-weight:600;
    color:var(--ink);
    margin-bottom:25px;
}

.hero-kicker .status-dot {
    box-shadow:0 0 0 5px #355ce811;
}

.hero-copy h1 {
    font-size:clamp(52px,5.15vw,75px);
    line-height:1.06;
    letter-spacing:-.058em;
    margin-bottom:27px;
}

.hero-copy h1 span {
    display:block;
}

.hero-description {
    max-width:460px;
    font-size:17px;
    line-height:1.75;
}

.hero-actions {
    display:flex;
    align-items:center;
    gap:22px;
    flex-wrap:wrap;
    margin-top:31px;
}

.text-link {
    display:inline-flex;
    align-items:center;
    gap:12px;
    font-size:14px;
    font-weight:700;
    color:var(--ink);
    text-decoration:underline;
    text-decoration-color:transparent;
    text-underline-offset:5px;
    transition:text-decoration-color .2s;
}

.text-link:hover {
    text-decoration-color:currentColor;
}

.text-link .icon {
    width:20px;
    height:20px;
}

.hero-promise {
    display:flex;
    gap:12px;
    margin-top:43px;
    align-items:center;
}

.hero-promise p {
    font-size:12px;
    line-height:1.65;
}

.hero-promise strong,.hero-promise span {
    display:block;
}

.hero-promise strong {
    font-weight:600;
    color:var(--ink);
}

.promise-icon {
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:var(--porcelain);
    width:41px;
    height:41px;
    color:var(--blue);
}

.promise-icon .icon {
    width:21px;
    height:21px;
}

.hero-visual {
    position:relative;
    height:590px;
    min-width:0;
}

.hero-photo {
    position:absolute;
    inset:0;
    border-radius:17px 17px 85px 17px;
    overflow:hidden;
    background:var(--sky);
}

.hero-photo:after {
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,#355ce800 50%,#1123443b);
}

.hero-photo img {
    width:100%;
    height:112%;
    object-fit:cover;
    object-position:57% center;
    transform:translateY(calc(-20px + var(--hero-shift,0px)));
    will-change:transform;
}

.connection-orbit {
    position:absolute;
    inset:-36px -35px -45px;
    width:calc(100% + 70px);
    height:calc(100% + 80px);
    pointer-events:none;
    overflow:visible;
}

.connection-orbit path {
    stroke:#fff;
    stroke-opacity:.65;
    stroke-width:1.5;
    stroke-dasharray:1500;
    stroke-dashoffset:0;
}

.connection-orbit circle {
    fill:var(--blue);
    stroke:white;
    stroke-width:5;
}

.floating-label {
    position:absolute;
    display:flex;
    align-items:center;
    gap:11px;
    background:rgba(255,255,255,.97);
    border:1px solid #ffffffa0;
    border-radius:12px;
    padding:11px 16px 11px 10px;
    box-shadow:0 8px 35px #14243c0d;
    font-size:13px;
    font-weight:700;
}

.symbol-box {
    width:33px;
    height:33px;
    display:grid;
    place-items:center;
    background:#edf2ff;
    color:var(--blue);
    border-radius:8px;
}

.symbol-box .icon {
    width:19px;
    height:19px;
}

.label-signal {
    top:79px;
    left:-29px;
}

.label-energy {
    right:-20px;
    bottom:161px;
}

.label-energy .symbol-box {
    background:var(--mint);
    color:var(--green);
}

.hero-caption {
    position:absolute;
    bottom:26px;
    left:25px;
    right:33px;
    display:flex;
    align-items:center;
    gap:13px;
    color:var(--white);
}

.hero-caption .caption-mark {
    font-size:42px;
    border-right:1px solid #ffffff55;
    padding-right:15px;
    line-height:1;
    font-weight:400;
}

.hero-caption div {
    display:flex;
    flex-direction:column;
    line-height:1.7;
}

.hero-caption div span {
    font-size:11px;
}

.hero-caption strong {
    font-size:14px;
    font-weight:600;
}

.hero-caption>.icon {
    margin-left:auto;
}

.trust-strip {
    background:var(--porcelain);
    border-block:1px solid #ecf0f7;
}

.trust-inner {
    display:flex;
    align-items:center;
    gap:45px;
    min-height:87px;
    justify-content:space-between;
}

.trust-inner p {
    font-size:13px;
    max-width:215px;
    line-height:1.5;
}

.trust-inner>div {
    display:flex;
    align-items:center;
    gap:10px;
    font-size:13px;
    font-weight:600;
}

.trust-inner .icon {
    width:18px;
    height:18px;
    color:var(--blue);
}

.section {
    padding-top:105px;
    padding-bottom:105px;
}

.eyebrow {
    font-size:13px;
    font-weight:700;
    color:var(--blue);
    letter-spacing:0;
    margin-bottom:19px;
}

.section-heading h2 {
    max-width:650px;
}

.section-heading>p:not(.eyebrow) {
    max-width:630px;
    margin-top:23px;
}

.heading-row {
    display:grid;
    grid-template-columns:1.4fr 1fr;
    gap:100px;
    align-items:end;
    margin-bottom:45px;
}

.heading-row>p {
    font-size:15px;
    max-width:370px;
    justify-self:end;
    margin-bottom:4px;
}

.service-symbol {
    height:44px;
    width:44px;
    border-radius:12px;
    background:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:var(--blue);
}

.service-symbol .icon {
    width:24px;
    height:24px;
}

.round-arrow {
    width:35px;
    height:35px;
    display:grid;
    place-items:center;
    transition:transform .25s;
    border-radius:50%;
    background:#ffffff75;
}

.round-arrow .icon {
    width:19px;
    height:19px;
}

.services-footnote {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    margin-top:29px;
    font-size:13px;
    color:var(--muted);
}

.energy-feature {
    background:var(--porcelain);
    padding-block:80px;
}

.energy-feature-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:90px;
    align-items:center;
}

.energy-feature-image {
    position:relative;
    height:510px;
    overflow:hidden;
    border-radius:22px 22px 22px 90px;
    background:#b89361;
}

.energy-feature-image img {
    width:100%;
    height:100%;
    object-fit:cover;
}

.image-note {
    position:absolute;
    bottom:28px;
    left:30px;
    display:flex;
    align-items:center;
    gap:10px;
    background:var(--white);
    padding:12px 17px;
    border-radius:8px;
    font-size:12px;
    font-weight:700;
}

.image-note .icon {
    color:var(--green);
    width:18px;
    height:18px;
}

.energy-feature-copy h2 {
    margin-bottom:24px;
}

.energy-feature-copy>p:not(.eyebrow) {
    font-size:15px;
}

.feature-list {
    list-style:none;
    padding:0;
    margin:24px 0 32px;
}

.feature-list li {
    font-size:14px;
    margin-block:13px;
    padding-left:27px;
    position:relative;
    color:var(--ink);
}

.feature-list li:before {
    content:'';
    width:9px;
    height:5px;
    transform:rotate(-45deg);
    border-left:1.5px solid var(--blue);
    border-bottom:1.5px solid var(--blue);
    position:absolute;
    top:8px;
    left:2px;
}

.process-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:58px;
    margin-top:52px;
}

.process-grid article {
    border-top:1px solid var(--line);
    padding-top:26px;
    position:relative;
}

.process-grid article:before {
    content:'';
    position:absolute;
    top:-1px;
    left:0;
    height:2px;
    background:var(--blue);
    width:0;
    transition:width 1.1s ease;
}

.process-section.is-in-view article:before {
    width:100%;
}

.process-section.is-in-view article:nth-child(2):before {
    transition-delay:.2s;
}

.process-section.is-in-view article:nth-child(3):before {
    transition-delay:.4s;
}

.step-number {
    display:block;
    font-size:13px;
    color:var(--blue);
    font-weight:700;
    margin-bottom:25px;
}

.process-grid h3 {
    margin-bottom:14px;
}

.process-grid p {
    font-size:14px;
    max-width:330px;
}

.about-teaser {
    background:#edf2ff;
    border-radius:var(--radius);
    padding:58px 64px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:90px;
}

.about-teaser h2 {
    font-size:43px;
    margin-bottom:26px;
}

.about-teaser-content>.icon {
    color:var(--blue);
    width:30px;
    height:30px;
    margin-bottom:18px;
}

.about-teaser-content>p {
    font-size:17px;
    color:#3c4d6b;
    line-height:1.8;
}

.team-preview {
    margin-top:28px;
    display:flex;
    align-items:center;
    gap:16px;
}

.team-avatars {
    display:flex;
    flex-shrink:0;
    padding-left:5px;
}

.team-avatars img {
    width:44px;
    height:44px;
    object-fit:cover;
    object-position:center 23%;
    border:3px solid #edf2ff;
    border-radius:50%;
    margin-left:-5px;
}

.team-preview>span {
    max-width:145px;
    font-size:11px;
    line-height:1.6;
    color:#4b5c7a;
}

.faq-section {
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:100px;
}

.faq-section .section-heading .text-link {
    margin-top:25px;
    font-size:13px;
    color:var(--blue);
}

.faq-list details {
    border-bottom:1px solid var(--line);
}

.faq-list details:first-child {
    border-top:1px solid var(--line);
}

.faq-list summary {
    list-style:none;
    display:flex;
    gap:30px;
    justify-content:space-between;
    padding:23px 0;
    font-size:15px;
    font-weight:700;
    line-height:1.5;
}

.faq-list summary::-webkit-details-marker {
    display:none;
}

.faq-plus {
    position:relative;
    flex-shrink:0;
    width:16px;
    height:16px;
    margin-top:3px;
}

.faq-plus:before,.faq-plus:after {
    content:'';
    position:absolute;
    left:0;
    top:7px;
    background:var(--blue);
    width:14px;
    height:1.5px;
}

.faq-plus:after {
    transform:rotate(90deg);
    transition:transform .2s;
}

.faq-list details[open] .faq-plus:after {
    transform:rotate(0);
}

.faq-list details[open] summary {
    color:var(--blue);
}

.faq-list details>p {
    font-size:14px;
    line-height:1.8;
    padding:0 35px 24px 0;
}

.closing-cta {
    background:var(--blue);
    color:white;
    overflow:hidden;
    position:relative;
}

.closing-cta:after {
    content:'';
    width:590px;
    height:590px;
    border:1px solid #ffffff25;
    border-radius:50%;
    position:absolute;
    right:-70px;
    top:-140px;
    pointer-events:none;
}

.closing-inner {
    padding-block:66px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:50px;
    position:relative;
    z-index:1;
}

.closing-cta .eyebrow {
    color:#e2e9ff;
    margin-bottom:13px;
}

.closing-cta h2 {
    font-size:40px;
    max-width:620px;
}

.closing-inner>.button {
    flex-shrink:0;
}

.site-footer {
    background:#fafbfd;
    padding-top:67px;
}

.footer-grid {
    display:grid;
    grid-template-columns:1.65fr 1fr .8fr 1.2fr;
    gap:58px;
    padding-bottom:55px;
}

.footer-brand img {
    width:188px;
    height:57px;
    object-fit:contain;
    margin-bottom:20px;
}

.footer-brand p {
    font-size:14px;
    max-width:215px;
    line-height:1.7;
    margin-bottom:21px;
}

.location {
    display:flex;
    align-items:center;
    gap:8px;
    font-size:10px;
    color:var(--muted);
}

.location .status-dot {
    width:5px;
    height:5px;
}

.footer-grid h3 {
    font-size:14px;
    font-weight:700;
    letter-spacing:0;
    margin-bottom:22px;
    margin-top:10px;
}

.footer-grid>div>a:not(:has(img)) {
    display:block;
    font-size:13px;
    margin:10px 0;
    color:var(--muted);
    width:fit-content;
}

.footer-grid>div>a:hover {
    color:var(--blue);
}

address {
    font-size:13px;
    font-style:normal;
    line-height:1.8;
    color:var(--muted);
    margin-top:17px;
}

.footer-hours {
    font-size:12px;
    margin-top:11px;
}

.footer-bottom {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    border-top:1px solid var(--line);
    padding-block:23px;
    color:var(--muted);
}

.footer-bottom small {
    font-size:11px;
}

.footer-bottom>div {
    display:flex;
    align-items:center;
    gap:27px;
    font-size:11px;
}

.back-top {
    width:32px;
    height:32px;
    display:grid;
    place-items:center;
    border:1px solid var(--line);
    border-radius:50%;
}

.back-top .icon {
    width:16px;
    height:16px;
    transform:rotate(-90deg);
}

/* Interior pages share the same typography and generous, content-led rhythm. */
.page-hero {
    padding-top:65px;
    padding-bottom:65px;
}

.page-hero h1 {
    max-width:970px;
}

.lead {
    font-size:18px;
    line-height:1.8;
    max-width:720px;
    margin-top:28px;
}

.page-hero .lead {
    max-width:760px;
}

.service-directory {
    padding-bottom:80px;
}

.benefit-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:45px;
    margin-top:50px;
}

.benefit-grid article {
    padding-top:25px;
    border-top:1px solid #d7dfed;
}

.benefit-grid h3 {
    font-size:25px;
    margin-bottom:17px;
}

.benefit-grid p {
    font-size:15px;
    line-height:1.8;
}

.service-hero {
    display:grid;
    grid-template-columns:1.05fr 1fr;
    gap:70px;
    align-items:center;
    padding-block:65px 85px;
}

.service-hero h1 {
    font-size:clamp(45px,4.7vw,68px);
    margin-top:25px;
}

.service-hero .lead {
    font-size:16px;
    margin-block:25px 30px;
}

.breadcrumb {
    display:inline-block;
    color:var(--blue);
    font-size:13px;
    border-bottom:1px solid #355ce84d;
}

.service-hero-photo {
    height:500px;
    position:relative;
    border-radius:22px 22px 80px 22px;
    overflow:hidden;
}

.service-hero-photo img {
    width:100%;
    height:100%;
    object-fit:cover;
}

.service-photo-label {
    position:absolute;
    bottom:28px;
    left:28px;
    background:var(--white);
    border-radius:8px;
    padding:12px 20px;
    font-size:13px;
    font-weight:700;
}

.service-benefits {
    background:var(--porcelain);
}

.benefit-check {
    display:flex;
    align-items:center;
    justify-content:center;
    width:37px;
    height:37px;
    background:#e3eaff;
    border-radius:50%;
    color:var(--blue);
    margin-bottom:22px;
}

.benefit-check .icon {
    width:20px;
    height:20px;
}

.service-detail-section {
    display:grid;
    grid-template-columns:1fr 1.1fr;
    gap:95px;
}

.scope-list article {
    display:flex;
    gap:18px;
    border-bottom:1px solid var(--line);
    padding-block:25px;
}

.scope-list article:first-child {
    padding-top:0;
}

.scope-list .icon {
    color:var(--blue);
    margin-top:2px;
}

.scope-list h3 {
    font-size:23px;
    margin-bottom:12px;
}

.scope-list p {
    font-size:15px;
}

.consultation-band {
    padding:45px 50px;
    display:flex;
    align-items:center;
    gap:45px;
    border-radius:20px;
    background:#edf2ff;
    justify-content:space-between;
}

.consultation-band h2 {
    font-size:32px;
}

.consultation-band p {
    font-size:15px;
    max-width:750px;
    margin-top:15px;
}

.consultation-band .button {
    flex-shrink:0;
}

.split-section {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:75px;
    align-items:center;
}

.split-section img {
    width:100%;
    max-height:600px;
    object-fit:cover;
    border-radius:22px;
}

.split-section h2 {
    margin-bottom:24px;
}

.split-section p+p {
    margin-top:20px;
}

.split-section .button {
    margin-top:30px;
}

.team-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:28px;
    margin-top:40px;
}

.team-card img {
    width:100%;
    height:400px;
    object-fit:cover;
    object-position:top;
    border-radius:16px;
}

.team-card h3 {
    font-size:26px;
    margin-top:23px;
}

.team-card p {
    font-size:13px;
    margin-top:9px;
}

.team-card a {
    display:inline-block;
    font-size:14px;
    color:var(--blue);
    margin-top:12px;
}

.contact-layout {
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:90px;
    align-items:start;
    padding-bottom:90px;
}

.contact-form {
    background:var(--porcelain);
    padding:38px;
    border-radius:22px;
}

.contact-form h2 {
    font-size:30px;
    margin-bottom:15px;
}

.contact-form>p {
    font-size:14px;
    margin-bottom:27px;
}

.form-field {
    display:flex;
    flex-direction:column;
    gap:7px;
    margin-bottom:19px;
    min-width:0;
}

.form-field label {
    font-size:13px;
    font-weight:700;
}

.form-field input,.form-field textarea,.form-field select {
    width:100%;
    border:1px solid #ccd5e3;
    border-radius:6px;
    background:white;
    color:var(--ink);
    padding:12px 13px;
    font-size:15px;
    min-height:48px;
}

.form-field textarea {
    min-height:130px;
    resize:vertical;
}

.field-row {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:19px;
}

.contact-form input[type=checkbox] {
    accent-color:var(--blue);
    width:18px;
    height:18px;
    flex-shrink:0;
}

.contact-form label:has(input[type=checkbox]) {
    display:flex;
    align-items:start;
    gap:10px;
    line-height:1.7;
    font-size:12px;
    color:var(--muted);
    margin-block:14px 24px;
}

.contact-form label:has(input[type=checkbox]) a {
    color:var(--blue);
    text-decoration:underline;
}

.contact-form button[type=submit] {
    width:100%;
}

.contact-form small {
    font-size:12px;
}

.contact-form [role=status] {
    padding:15px;
    background:var(--mint);
    color:var(--green);
    border-radius:8px;
    margin-top:22px;
    font-size:14px;
}

.contact-details h2 {
    font-size:32px;
    margin-bottom:25px;
}

.contact-details a {
    color:var(--blue);
}

.contact-details p {
    margin-top:15px;
}

.legal-content {
    max-width:870px;
    padding-bottom:90px;
}

.legal-content section {
    padding-block:23px;
    border-top:1px solid var(--line);
}

.legal-content h2 {
    font-size:27px;
    margin-bottom:18px;
}

.legal-content h3 {
    font-size:20px;
    margin:20px 0 12px;
}

.legal-content p {
    margin-bottom:16px;
    font-size:15px;
}

.legal-content a {
    color:var(--blue);
    text-decoration:underline;
    text-underline-offset:3px;
}

.legal-content ul {
    font-size:15px;
    color:var(--muted);
    padding-left:20px;
}

.legal-content address {
    font-size:16px;
}

.legal-content dl {
    display:grid;
    grid-template-columns:160px 1fr;
    gap:8px 20px;
    font-size:15px;
}

.legal-content dt {
    font-weight:700;
}

.legal-content dd {
    margin:0;
    color:var(--muted);
}

@media(min-width:1600px) {
    .site-container {
        max-width:1380px;
    }
    .home-hero {
        gap:80px;
        min-height:795px;
    }
    .hero-copy h1 {
        font-size:85px;
    }
    .hero-visual {
        height:645px;
    }
    .hero-description {
        font-size:19px;
    }
    .desktop-nav {
        gap:35px;
    }
}

@media(max-width:1200px) {
    .site-container {
        width:calc(100% - 64px);
    }
    .header-inner {
        gap:23px;
    }
    .desktop-nav {
        gap:21px;
        font-size:13px;
    }
    .header-actions {
        gap:20px;
    }
    .site-logo {
        width:169px;
    }
    .header-cta {
        display:none;
    }
    .home-hero {
        gap:38px;
        min-height:650px;
    }
    .hero-copy h1 {
        font-size:clamp(50px,5.5vw,65px);
    }
    .hero-visual {
        height:535px;
    }
    .hero-description {
        font-size:16px;
    }
    .hero-actions {
        gap:18px;
    }
    .hero-actions>.text-link {
        font-size:12px;
    }
    .hero-actions .button {
        padding:15px 17px;
        font-size:13px;
    }
    .trust-inner {
        gap:23px;
    }
    .trust-inner>div {
        font-size:12px;
    }
    .heading-row {
        gap:55px;
    }
    .energy-feature-grid {
        gap:50px;
    }
    .energy-feature-image {
        height:480px;
    }
    .about-teaser {
        padding:48px;
        gap:60px;
    }
    .faq-section {
        gap:60px;
    }
    .footer-grid {
        gap:32px;
    }
    .service-hero {
        gap:45px;
    }
    .service-hero-photo {
        height:450px;
    }
    .contact-layout {
        gap:50px;
    }
    .team-card img {
        height:340px;
    }
}

@media(max-width:900px) {
    .desktop-nav,.header-cta {
        display:none;
    }
    .menu-toggle {
        display:flex;
    }
    .header-inner {
        height:80px;
    }
    .home-hero {
        grid-template-columns:1fr 1fr;
        gap:32px;
        min-height:570px;
        padding-top:30px;
        padding-bottom:45px;
    }
    .hero-copy h1 {
        font-size:49px;
    }
    .hero-visual {
        height:470px;
    }
    .hero-caption {
        left:20px;
        right:20px;
        bottom:20px;
    }
    .hero-caption strong {
        font-size:11px;
    }
    .hero-caption .caption-mark {
        font-size:32px;
    }
    .hero-caption div span {
        font-size:9px;
    }
    .hero-description {
        font-size:15px;
    }
    .hero-promise {
        margin-top:30px;
    }
    .hero-promise p {
        font-size:10px;
    }
    .label-signal {
        top:40px;
        left:-16px;
    }
    .label-energy {
        right:-15px;
        bottom:125px;
    }
    .floating-label {
        font-size:11px;
        padding:8px 11px 8px 8px;
        gap:8px;
    }
    .trust-inner {
        flex-wrap:wrap;
        justify-content:flex-start;
        gap:12px 25px;
        padding-block:20px;
    }
    .trust-inner p {
        max-width:none;
        flex-basis:100%;
        font-size:12px;
    }
    .section {
        padding-block:75px;
    }
    .heading-row {
        gap:30px;
        grid-template-columns:1.2fr 1fr;
    }
    .energy-feature {
        padding-block:60px;
    }
    .energy-feature-grid {
        gap:35px;
    }
    .energy-feature-image {
        height:480px;
    }
    .energy-feature-copy h2 {
        font-size:37px;
    }
    .feature-list li {
        font-size:13px;
    }
    .process-grid {
        gap:32px;
    }
    .process-grid h3 {
        font-size:22px;
    }
    .about-teaser {
        padding:38px;
        gap:35px;
    }
    .about-teaser h2 {
        font-size:36px;
    }
    .about-teaser-content>p {
        font-size:15px;
    }
    .faq-section {
        gap:45px;
    }
    .faq-list summary {
        font-size:14px;
    }
    .closing-cta h2 {
        font-size:33px;
    }
    .closing-inner {
        gap:30px;
    }
    .closing-inner>.button {
        font-size:12px;
        padding-inline:17px;
    }
    .footer-grid {
        grid-template-columns:1.3fr 1fr;
        gap:30px 80px;
    }
    .footer-grid>div:nth-child(3) {
        grid-column:2;
        grid-row:1;
    }
    .footer-grid>div:nth-child(2) {
        grid-row:2;
    }
    .footer-grid>div:nth-child(4) {
        grid-row:2;
    }
    .service-hero {
        grid-template-columns:1.15fr 1fr;
        gap:30px;
    }
    .service-hero h1 {
        font-size:48px;
    }
    .service-hero-photo {
        height:450px;
    }
    .service-hero .lead {
        font-size:15px;
    }
    .service-detail-section {
        gap:45px;
    }
    .benefit-grid {
        gap:30px;
    }
    .benefit-grid h3 {
        font-size:23px;
    }
    .consultation-band {
        padding:35px;
        gap:25px;
        flex-wrap:wrap;
    }
    .split-section {
        gap:40px;
    }
    .team-card img {
        height:285px;
    }
    .team-card h3 {
        font-size:23px;
    }
    .contact-layout {
        gap:35px;
        grid-template-columns:.8fr 1.2fr;
    }
    .contact-form {
        padding:27px;
    }
    .field-row {
        grid-template-columns:1fr;
        gap:0;
    }
}

@media(max-width:650px) {
    html {
        scroll-padding-top:90px;
    }
    .site-container {
        width:calc(100% - 40px);
    }
    .utility-inner {
        font-size:10px;
        min-height:29px;
    }
    .utility-inner>span {
        max-width:230px;
    }
    .header-inner {
        height:73px;
        gap:15px;
    }
    .site-logo {
        width:159px;
    }
    .site-logo img {
        height:49px;
    }
    .header-actions {
        gap:16px;
    }
    .login-link {
        font-size:12px;
        gap:5px;
    }
    .login-link .icon {
        width:16px;
        height:16px;
    }
    .menu-toggle {
        width:39px;
        height:39px;
    }
    .home-hero {
        grid-template-columns:1fr;
        gap:40px;
        padding-top:34px;
        padding-bottom:40px;
        min-height:0;
    }
    .hero-kicker {
        font-size:12px;
        margin-bottom:20px;
    }
    .hero-copy h1 {
        font-size:clamp(43px,10.7vw,63px);
        line-height:1.04;
        margin-bottom:21px;
        max-width:520px;
    }
    .hero-description {
        font-size:15px;
        max-width:390px;
        line-height:1.75;
    }
    .hero-actions {
        margin-top:25px;
        gap:15px 22px;
    }
    .hero-actions .button {
        min-height:53px;
        font-size:13px;
        padding-inline:18px;
    }
    .hero-actions .text-link {
        font-size:12px;
    }
    .hero-promise {
        margin-top:28px;
    }
    .hero-promise p {
        font-size:11px;
    }
    .hero-visual {
        height:395px;
        margin-inline:0;
    }
    .hero-photo {
        border-radius:15px 15px 60px 15px;
    }
    .hero-photo img {
        object-position:center center;
    }
    .connection-orbit {
        inset:-10px -15px;
        width:calc(100% + 30px);
        height:calc(100% + 20px);
        overflow:hidden;
    }
    .label-signal {
        top:35px;
        left:-8px;
    }
    .label-energy {
        right:-8px;
        bottom:115px;
    }
    .hero-caption {
        bottom:25px;
        left:23px;
        right:26px;
    }
    .hero-caption strong {
        font-size:13px;
    }
    .hero-caption div span {
        font-size:10px;
    }
    .hero-caption .caption-mark {
        font-size:36px;
    }
    .trust-inner {
        gap:15px 20px;
        padding-block:20px;
    }
    .trust-inner p {
        font-size:12px;
    }
    .trust-inner>div {
        font-size:11px;
        gap:6px;
    }
    .trust-inner .icon {
        width:15px;
        height:15px;
    }
    .section {
        padding-block:62px;
    }
    .eyebrow {
        font-size:12px;
        margin-bottom:15px;
    }
    h2 {
        font-size:35px;
        letter-spacing:-.04em;
    }
    .heading-row {
        grid-template-columns:1fr;
        gap:22px;
        margin-bottom:30px;
    }
    .heading-row>p {
        font-size:14px;
        max-width:none;
        justify-self:start;
        margin:0;
    }
    .service-symbol {
        height:43px;
        width:43px;
    }
    .services-footnote {
        align-items:start;
        flex-direction:column;
        gap:13px;
        font-size:12px;
        margin-top:23px;
    }
    .energy-feature {
        padding-block:45px;
    }
    .energy-feature-grid {
        grid-template-columns:1fr;
        gap:32px;
    }
    .energy-feature-image {
        height:330px;
        border-radius:15px 15px 15px 60px;
    }
    .image-note {
        left:20px;
        bottom:20px;
        font-size:11px;
        padding:10px 13px;
    }
    .energy-feature-copy h2 {
        font-size:36px;
        max-width:500px;
    }
    .energy-feature-copy>p:not(.eyebrow) {
        font-size:14px;
    }
    .feature-list li {
        font-size:13px;
    }
    .process-grid {
        grid-template-columns:1fr;
        gap:30px;
        margin-top:30px;
    }
    .process-grid article {
        padding-left:50px;
        padding-top:20px;
    }
    .step-number {
        position:absolute;
        left:0;
        top:20px;
    }
    .process-grid h3 {
        font-size:24px;
        margin-bottom:11px;
    }
    .process-grid p {
        font-size:14px;
        max-width:none;
    }
    .about-teaser {
        padding:30px 26px;
        grid-template-columns:1fr;
        gap:35px;
    }
    .about-teaser h2 {
        font-size:36px;
        max-width:420px;
    }
    .about-teaser-content>p {
        font-size:16px;
    }
    .about-teaser-content>.icon {
        display:none;
    }
    .team-preview {
        margin-top:23px;
    }
    .faq-section {
        grid-template-columns:1fr;
        gap:30px;
    }
    .faq-list summary {
        font-size:14px;
        padding-block:21px;
    }
    .faq-list details>p {
        font-size:13px;
        padding-right:15px;
    }
    .closing-inner {
        padding-block:45px;
        align-items:start;
        flex-direction:column;
        gap:28px;
    }
    .closing-cta h2 {
        font-size:35px;
        max-width:430px;
    }
    .closing-inner>.button {
        font-size:13px;
    }
    .closing-cta .eyebrow {
        font-size:12px;
    }
    .site-footer {
        padding-top:40px;
    }
    .footer-grid {
        grid-template-columns:1fr 1fr;
        gap:30px 20px;
        padding-bottom:30px;
    }
    .footer-brand {
        grid-column:1/-1;
    }
    .footer-grid>div:nth-child(3) {
        grid-column:2;
        grid-row:2;
    }
    .footer-grid>div:nth-child(4) {
        grid-row:3;
        grid-column:1/-1;
    }
    .footer-brand p {
        max-width:280px;
    }
    .footer-brand img {
        width:174px;
    }
    .location {
        font-size:11px;
    }
    .footer-grid h3 {
        margin-bottom:18px;
    }
    .footer-grid>div>a:not(:has(img)) {
        font-size:13px;
    }
    .footer-bottom {
        align-items:start;
        gap:16px;
        flex-direction:column;
        padding-block:20px;
    }
    .footer-bottom>div {
        width:100%;
        gap:22px;
    }
    .back-top {
        margin-left:auto;
    }
    .footer-bottom small {
        font-size:10px;
    }
    .page-hero {
        padding-top:38px;
        padding-bottom:38px;
    }
    .page-hero h1 {
        font-size:47px;
    }
    .lead {
        font-size:16px;
        margin-top:23px;
    }
    .service-hero {
        grid-template-columns:1fr;
        padding-block:38px 50px;
        gap:35px;
    }
    .service-hero h1 {
        font-size:47px;
        margin-top:20px;
    }
    .service-hero .lead {
        font-size:15px;
    }
    .service-hero-photo {
        height:340px;
    }
    .service-directory {
        padding-bottom:45px;
    }
    .benefit-grid {
        grid-template-columns:1fr;
        gap:25px;
        margin-top:33px;
    }
    .benefit-grid h3 {
        font-size:25px;
    }
    .benefit-grid p {
        font-size:14px;
    }
    .benefit-check {
        margin-bottom:15px;
    }
    .service-detail-section {
        grid-template-columns:1fr;
        gap:30px;
    }
    .scope-list h3 {
        font-size:23px;
    }
    .scope-list p {
        font-size:14px;
    }
    .consultation-band {
        padding:28px;
    }
    .consultation-band h2 {
        font-size:30px;
    }
    .consultation-band p {
        font-size:14px;
    }
    .split-section {
        grid-template-columns:1fr;
        gap:30px;
    }
    .split-section img {
        max-height:340px;
    }
    .split-section p {
        font-size:15px;
    }
    .team-grid {
        grid-template-columns:1fr;
        gap:35px;
    }
    .team-card {
        max-width:420px;
        width:100%;
        margin-inline:auto;
    }
    .team-card img {
        height:auto;
        max-height:520px;
        object-position:top;
    }
    .team-card h3 {
        font-size:27px;
    }
    .contact-layout {
        grid-template-columns:1fr;
        gap:35px;
        padding-bottom:50px;
    }
    .contact-form {
        padding:25px 20px;
        border-radius:17px;
    }
    .field-row {
        grid-template-columns:1fr;
        gap:0;
    }
    .legal-content {
        padding-bottom:50px;
    }
    .legal-content h2 {
        font-size:25px;
    }
    .legal-content p {
        font-size:14px;
    }
    .legal-content dl {
        grid-template-columns:1fr;
        gap:4px;
    }
    .legal-content dd {
        margin-bottom:15px;
    }
}

@media(prefers-reduced-motion:no-preference) {
    .hero-copy {
        animation:hero-enter .7s ease-out both;
    }
    .hero-visual {
        animation:hero-enter .9s .08s ease-out both;
    }
    .connection-orbit path {
        animation:orbit-draw 2.5s .25s ease-out both;
    }
    .label-signal {
        animation:hero-enter .8s .25s both;
    }
    .label-energy {
        animation:hero-enter .8s .4s both;
    }
    .faq-list details[open]>p {
        animation:answer-enter .25s ease-out;
    }
    @keyframes hero-enter {
        from {
            opacity:0;
            transform:translateY(17px);
        }
        to {
            opacity:1;
            transform:translateY(0);
        }
    }
    @keyframes orbit-draw {
        from {
            stroke-dashoffset:1500;
        }
        to {
            stroke-dashoffset:0;
        }
    }
    @keyframes answer-enter {
        from {
            opacity:.4;
            transform:translateY(-5px);
        }
        to {
            opacity:1;
            transform:translateY(0);
        }
    }
}

@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto;
    }
    *,*:before,*:after {
        animation:none!important;
        transition:none!important;
    }
    .hero-photo img {
        transform:translateY(-20px);
        will-change:auto;
    }
    .process-grid article:before {
        width:100%;
    }
}

@media print {
    .site-header,.utility-bar,.closing-cta,.site-footer,.hero-visual,.service-hero-photo,.menu-toggle {
        display:none;
    }
    .site-container {
        width:100%;
    }
    .home-hero,.service-hero,.contact-layout {
        display:block;
    }
    .section {
        padding-block:25px;
    }
    .hero-copy h1 {
        font-size:42px;
    }
    body {
        color:black;
    }
    a {
        text-decoration:underline;
    }
    .contact-form {
        border:1px solid #ccc;
    }
}

/* Company, contact and legal details. */
.about-hero>.button {
    margin-top:28px;
}

.about-image {
    margin:0;
}

.about-image img {
    width:100%;
    max-height:590px;
    object-fit:cover;
    border-radius:22px;
}

.about-image figcaption {
    margin-top:13px;
    color:var(--muted);
    font-size:12px;
}

.section-tinted {
    background:var(--porcelain);
}

.prose p+p {
    margin-top:20px;
}

.team-card-body {
    padding:8px 3px;
}

.team-card-body .team-role {
    font-size:12px;
    margin-top:15px;
    color:var(--blue);
}

.team-card-body h3 {
    margin-top:10px;
}

.capability-list article {
    padding-block:25px;
    border-bottom:1px solid var(--line);
}

.capability-list article:first-child {
    padding-top:0;
}

.capability-list h3 .text-link {
    font-size:25px;
    font-weight:700;
    margin-bottom:13px;
}

.capability-list p {
    font-size:15px;
}

.contact-channel {
    padding-block:18px;
    border-bottom:1px solid var(--line);
}

.contact-channel p {
    font-size:12px;
    margin:0 0 8px;
}

.contact-channel .contact-channel-value {
    display:block;
    font-size:25px;
    letter-spacing:-.025em;
    line-height:1.4;
    overflow-wrap:anywhere;
}

.contact-note {
    display:block;
    font-size:12px;
    color:var(--muted);
    margin-top:9px;
}

.contact-channel address {
    margin-top:5px;
}

.contact-preparation {
    padding:25px;
    border:1px solid var(--line);
    border-radius:14px;
    margin-top:27px;
}

.contact-preparation h3 {
    font-size:21px;
}

.contact-preparation p {
    font-size:13px;
    line-height:1.8;
    margin-top:12px;
}

.contact-form .form-note {
    font-size:12px;
    margin-block:15px 22px;
}

.contact-form .form-required-note {
    font-size:11px;
    margin-bottom:18px;
}

.form-checkbox {
    display:flex;
    gap:12px;
    align-items:flex-start;
    margin-block:3px 24px;
}

.form-checkbox input {
    margin:4px 0 0;
}

.form-checkbox label {
    font-size:12px;
    line-height:1.7;
    color:var(--muted);
}

.form-checkbox a {
    color:var(--blue);
    text-decoration:underline;
    text-underline-offset:3px;
}

.process-list {
    counter-reset:steps;
    list-style:none;
    padding:0;
    margin:0;
}

.process-list li {
    position:relative;
    padding:0 0 30px 55px;
    counter-increment:steps;
}

.process-list li:before {
    content:'0' counter(steps);
    position:absolute;
    left:0;
    top:0;
    color:var(--blue);
    font-size:13px;
    font-weight:700;
}

.process-list h3 {
    font-size:23px;
    margin-bottom:12px;
}

.process-list p {
    font-size:14px;
}

.legal-content .text-link {
    overflow-wrap:anywhere;
}

.legal-content address+p {
    margin-top:20px;
}

@media(max-width:650px) {
    .about-image img {
        min-height:300px;
        object-position:center;
    }
    .contact-channel .contact-channel-value {
        font-size:24px;
    }
    .contact-preparation {
        padding:22px;
    }
    .team-card-body {
        padding-bottom:5px;
    }
    .capability-list h3 .text-link {
        font-size:24px;
    }
    .process-list li {
        padding-left:40px;
    }
    .legal-content .text-link {
        font-size:13px;
    }
}

.login-link {
    min-height:44px;
}

@media(max-width:650px) {
    .menu-toggle {
        width:44px;
        height:44px;
    }
    .contact-form {
        order:-1;
    }
}

@media (max-width:650px) {
    h1, h2, h3 {
        overflow-wrap:break-word;
        hyphens:auto;
    }
}

@media (max-width:380px) {
    .site-container {
        width:calc(100% - 32px);
    }
    .header-inner {
        gap:8px;
    }
    .site-logo {
        width:134px;
    }
    .header-actions {
        gap:10px;
    }
}

.utility-inner a {
    white-space:nowrap;
}
@media (max-width:380px) {
    .hero-copy h1 {
        font-size:37px;
    }
}

/* ---------------------------------------------------------------------------------------------
   Service tiles, reasons, partners, service directory, energy price composition and the
   electricity tax calculator.
   --------------------------------------------------------------------------------------------- */
.visually-hidden {
    position:absolute!important;
    width:1px;
    height:1px;
    margin:-1px;
    padding:0;
    overflow:hidden;
    clip:rect(0 0 0 0);
    white-space:nowrap;
    border:0;
}

.mobile-nav .mobile-nav-main {
    font-weight:700;
}

.mobile-nav-services {
    list-style:none;
    margin:0;
    padding:6px 0 10px 14px;
    display:grid;
    grid-template-columns:1fr 1fr;
    column-gap:18px;
    border-bottom:1px solid var(--line);
}

.mobile-nav .mobile-nav-services a {
    padding:8px 0;
    border-bottom:0;
    font-size:14px;
    color:var(--muted);
}

.mobile-nav .mobile-nav-services a[aria-current=page] {
    color:var(--blue);
    font-weight:700;
}

.footer-grid h3.footer-subheading {
    margin-top:32px;
}

/* Homepage: seven service tiles and a contact tile. */
.service-tiles {
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px;
}

.service-tiles>li {
    display:flex;
    min-width:0;
}

.service-tile {
    position:relative;
    display:flex;
    flex-direction:column;
    width:100%;
    min-height:236px;
    padding:28px 26px 26px;
    border-radius:20px;
    background:var(--porcelain);
    border:1px solid #ebeff6;
    transition:background .2s,border-color .2s;
}

.service-tile:hover {
    background:#edf2ff;
    border-color:#dbe4fb;
}

.service-tile h3 {
    font-size:22px;
    margin:30px 0 10px;
}

.service-tile p {
    font-size:14px;
    line-height:1.6;
}

.service-tile .round-arrow {
    position:absolute;
    top:28px;
    right:24px;
    background:var(--white);
    color:var(--ink);
}

.service-tile:hover .round-arrow {
    transform:rotate(45deg);
}

.service-tile-managedServices .service-symbol,.service-tile-cyberSecurity .service-symbol {
    color:var(--green);
}

.service-tile-cta {
    flex-direction:column;
    justify-content:space-between;
    gap:24px;
    padding:28px 26px 26px;
    border-radius:20px;
    background:var(--blue);
    color:var(--white);
}

.service-tile-cta h3 {
    font-size:22px;
    margin-bottom:10px;
}

.service-tile-cta p {
    color:#e2e9ff;
    font-size:14px;
}

.service-tile-cta .text-link {
    color:var(--white);
}

/* Homepage: reasons to choose Smart & Safe Connect. */
.why-section {
    background:var(--ink);
    color:var(--white);
}

.why-section .eyebrow {
    color:#a9bdff;
}

.why-section .heading-row>p {
    color:#c3cde0;
}

.why-grid {
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:44px 48px;
}

.why-grid li {
    border-top:1px solid #ffffff24;
    padding-top:26px;
}

.why-icon {
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border-radius:12px;
    background:#ffffff12;
    color:#a9bdff;
    margin-bottom:22px;
}

.why-grid h3 {
    font-size:22px;
    margin-bottom:12px;
}

.why-grid p {
    color:#c3cde0;
    font-size:15px;
    line-height:1.75;
}

/* Homepage: partner logos, calm in greyscale until hovered. */
.partner-section {
    padding-bottom:70px;
}

.partner-heading {
    display:grid;
    grid-template-columns:1.4fr 1fr;
    gap:30px 100px;
    align-items:end;
    margin-bottom:38px;
}

.partner-heading .eyebrow {
    grid-column:1/-1;
    margin-bottom:-12px;
}

.partner-heading h2 {
    max-width:650px;
}

.partner-heading>p:not(.eyebrow) {
    font-size:15px;
    max-width:370px;
    justify-self:end;
}

.partner-grid {
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:14px;
}

.partner-grid li {
    flex:0 1 calc((100% - 6 * 14px) / 7);
    min-width:0;
    height:104px;
    display:grid;
    place-items:center;
    padding:16px 12px;
    border:1px solid var(--line);
    border-radius:16px;
    background:var(--white);
    transition:border-color .2s,box-shadow .2s;
}

.partner-grid img {
    max-width:100%;
    height:auto;
    filter:grayscale(1);
    opacity:.72;
    transition:filter .25s,opacity .25s;
}

.partner-grid li:hover {
    border-color:#d3dcee;
    box-shadow:0 8px 24px #14243c0d;
}

.partner-grid li:hover img {
    filter:none;
    opacity:1;
}

.partner-note {
    margin-top:18px;
    font-size:11px;
    text-align:center;
}

@media(hover:none) {
    .partner-grid img {
        filter:none;
        opacity:1;
    }
}

.feature-actions {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:18px 26px;
}

.feature-actions .text-link .icon {
    color:var(--green);
}

/* Service directory (/leistungen). */
.directory-group {
    padding-bottom:70px;
}

.directory-group-last {
    padding-bottom:100px;
}

.directory-group-heading {
    display:grid;
    grid-template-columns:1.4fr 1fr;
    gap:30px 100px;
    align-items:end;
    padding-top:40px;
    border-top:1px solid var(--line);
    margin-bottom:34px;
}

.directory-group-heading h2 {
    font-size:38px;
}

.directory-group-heading p {
    font-size:15px;
    max-width:420px;
    justify-self:end;
}

.directory-grid {
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
}

.directory-grid-energy {
    grid-template-columns:1fr 1fr;
}

.directory-grid>li.directory-cta {
    grid-column:span 2;
}

.directory-cta .service-tile-cta {
    display:flex;
    justify-content:center;
    align-items:flex-start;
    gap:22px;
    width:100%;
    padding:38px;
    background:var(--blue) radial-gradient(circle at 100% 0,#5f80f2 0,#355ce800 55%);
}

.directory-cta .service-symbol {
    background:#ffffff1f;
    color:var(--white);
}

.directory-cta .service-tile-cta h3 {
    font-size:30px;
}

.directory-cta .service-tile-cta p {
    max-width:460px;
    font-size:15px;
}

.directory-cta-actions {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:14px 26px;
}

.directory-cta-actions .text-link {
    color:var(--white);
}

.directory-grid>li {
    display:flex;
    min-width:0;
}

.directory-card {
    display:flex;
    flex-direction:column;
    width:100%;
    border:1px solid var(--line);
    border-radius:20px;
    overflow:hidden;
    background:var(--white);
}

.directory-card-image {
    aspect-ratio:16/10;
    overflow:hidden;
    background:var(--sky);
}

.directory-card-image img {
    width:100%;
    height:100%;
    object-fit:cover;
}

.directory-card-copy {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    flex:1;
    padding:26px 26px 28px;
}

.directory-card-copy .service-symbol {
    background:var(--porcelain);
    margin-top:-50px;
    box-shadow:0 0 0 6px var(--white);
}

.directory-card-copy h3 {
    font-size:24px;
    margin:18px 0 10px;
}

.directory-card-copy p {
    font-size:14px;
    margin-bottom:18px;
}

.directory-card-copy .text-link {
    margin-top:auto;
    color:var(--blue);
}

.service-symbol-energy {
    color:var(--green);
}

.directory-card-tax {
    background:#edf2ff;
    border-color:transparent;
}

.directory-card-tax .directory-card-copy {
    justify-content:center;
    padding:34px;
}

.directory-card-tax .directory-card-copy .service-symbol {
    margin-top:0;
    background:var(--white);
    box-shadow:none;
}

.directory-card-tax .directory-card-copy .text-link {
    margin-top:6px;
}

/* Energy page: how the price is made up. */
.price-charts {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
}

.price-chart {
    margin:0;
    padding:30px;
    border:1px solid var(--line);
    border-radius:20px;
    min-width:0;
}

.price-chart figcaption {
    display:grid;
    grid-template-columns:1fr auto;
    gap:2px 20px;
    align-items:end;
}

.price-chart-title {
    font-size:22px;
    font-weight:700;
    letter-spacing:-.03em;
}

.price-chart-case {
    grid-row:2;
    font-size:13px;
    color:var(--muted);
}

.price-chart-total {
    grid-row:1/3;
    grid-column:2;
    font-size:15px;
    font-weight:700;
    white-space:nowrap;
    font-variant-numeric:tabular-nums;
}

.price-bar {
    display:flex;
    gap:2px;
    height:22px;
    margin:24px 0 20px;
    border-radius:999px;
    overflow:hidden;
    background:var(--line);
}

.price-segment {
    flex-basis:0;
    min-width:3px;
}

.price-swatch {
    display:inline-block;
    width:12px;
    height:12px;
    border-radius:50%;
    flex-shrink:0;
}

.price-procurement {
    background:#355ce8;
}

.price-sales {
    background:#8ea8f3;
}

.price-networkCharge {
    background:#14243c;
}

.price-metering {
    background:#4f5e77;
}

.price-concession {
    background:#94a0b4;
}

.price-surcharges,.price-co2Price {
    background:#285e49;
}

.price-electricityTax,.price-gasTax {
    background:#72a88b;
}

.price-block.price-supply .price-swatch,.price-explainer .price-supply .price-swatch {
    background:#355ce8;
}

.price-block.price-network .price-swatch,.price-explainer .price-network .price-swatch {
    background:#14243c;
}

.price-block.price-levies .price-swatch,.price-explainer .price-levies .price-swatch {
    background:#285e49;
}

.price-blocks {
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
}

.price-block {
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:center;
    gap:2px 9px;
    min-width:0;
}

.price-block-share {
    font-size:24px;
    font-weight:700;
    letter-spacing:-.03em;
    font-variant-numeric:tabular-nums;
}

.price-block-name {
    grid-column:1/-1;
    font-size:13px;
    font-weight:600;
    line-height:1.35;
}

.price-block-value {
    grid-column:1/-1;
    font-size:12px;
    color:var(--muted);
    font-variant-numeric:tabular-nums;
}

.price-details {
    margin-top:22px;
    border-top:1px solid var(--line);
    padding-top:14px;
}

.price-details summary {
    font-size:13px;
    font-weight:700;
    color:var(--blue);
    width:fit-content;
}

.price-details table {
    width:100%;
    margin-top:12px;
    border-collapse:collapse;
    font-size:13px;
}

.price-details th,.price-details td {
    padding:8px 0;
    border-bottom:1px solid #edf0f6;
    text-align:right;
    font-variant-numeric:tabular-nums;
    white-space:nowrap;
}

.price-details thead th {
    font-size:12px;
    color:var(--muted);
    font-weight:600;
}

.price-details th:first-child {
    text-align:left;
    white-space:normal;
    font-weight:400;
    padding-right:12px;
}

.price-details thead th:first-child {
    font-weight:600;
}

.price-details td,.price-details thead th+th {
    padding-left:16px;
    width:1%;
}

.price-details tbody th .price-swatch {
    width:9px;
    height:9px;
    margin-right:9px;
}

.price-explainer {
    list-style:none;
    margin:34px 0 0;
    padding:0;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
}

.price-explainer li {
    padding:28px;
    border-radius:18px;
    background:var(--porcelain);
}

.price-explainer .price-swatch {
    display:block;
    width:34px;
    height:6px;
    border-radius:3px;
    margin-bottom:18px;
}

.price-explainer h3 {
    font-size:21px;
    margin-bottom:10px;
}

.price-explainer p {
    font-size:14px;
}

.price-explainer .price-lever {
    margin-top:14px;
    color:var(--ink);
}

.price-source {
    margin-top:24px;
    font-size:12px;
    max-width:920px;
    line-height:1.7;
}

.price-source .text-link {
    display:inline;
    font-size:12px;
    color:var(--blue);
    text-decoration-color:#355ce84d;
}

.models-section {
    background:var(--porcelain);
}

.model-grid {
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
}

.model-grid li {
    display:flex;
    flex-direction:column;
    padding:28px 26px;
    border-radius:18px;
    background:var(--white);
}

.model-grid .step-number {
    margin-bottom:18px;
}

.model-grid h3 {
    font-size:21px;
    margin-bottom:12px;
}

.model-grid p {
    font-size:14px;
}

.model-grid .model-fit {
    margin-top:auto;
    padding-top:16px;
    color:var(--ink);
    font-size:13px;
    font-weight:700;
}

.lever-grid {
    list-style:none;
    margin:40px 0 0;
    padding:0;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
}

.lever-grid li {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    padding:30px 28px;
    border:1px solid var(--line);
    border-radius:18px;
}

.lever-grid .service-symbol {
    background:var(--porcelain);
}

.lever-grid h3 {
    font-size:22px;
    margin:20px 0 10px;
}

.lever-grid p {
    font-size:14px;
}

.lever-grid .lever-highlight {
    background:#edf2ff;
    border-color:transparent;
}

.lever-grid .lever-highlight .service-symbol {
    background:var(--white);
}

.lever-highlight .text-link {
    margin-top:16px;
    color:var(--blue);
}

/* Electricity tax page. */
.tax-hero h1 {
    margin-top:22px;
    max-width:900px;
}

.tax-facts {
    list-style:none;
    margin:34px 0 0;
    padding:0;
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.tax-facts li {
    padding:14px 20px;
    border:1px solid var(--line);
    border-radius:14px;
    min-width:0;
}

.tax-facts strong {
    display:block;
    font-size:21px;
    letter-spacing:-.02em;
}

.tax-facts span {
    font-size:12.5px;
    color:var(--muted);
}

.tax-calculator-section {
    display:grid;
    grid-template-columns:1.12fr .88fr;
    gap:36px;
    align-items:start;
    padding-bottom:95px;
}

.tax-calculator {
    min-width:0;
    padding:38px;
    border-radius:22px;
    background:var(--porcelain);
}

.tax-calculator h2 {
    font-size:30px;
}

.calc-intro {
    font-size:14px;
    margin:10px 0 28px;
}

.calc-step {
    margin:0 0 28px;
    padding:0;
    border:0;
    min-width:0;
}

.tax-calculator>div.calc-step:last-of-type {
    margin-bottom:0;
}

.calc-step legend,.calc-label {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px 12px;
    padding:0;
    margin-bottom:12px;
    font-size:15px;
    font-weight:700;
    color:var(--ink);
}

.calc-step-number {
    display:inline-grid;
    place-items:center;
    width:27px;
    height:27px;
    border-radius:50%;
    background:var(--blue);
    color:var(--white);
    font-size:13px;
    font-weight:700;
    flex-shrink:0;
}

.calc-optional {
    font-weight:400;
    font-size:13px;
    color:var(--muted);
}

.calc-options {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}

.calc-option {
    position:relative;
    display:flex;
    cursor:pointer;
}

.calc-option input {
    position:absolute;
    opacity:0;
    width:1px;
    height:1px;
}

.calc-option>span {
    display:block;
    width:100%;
    padding:14px 36px 14px 16px;
    border:1.5px solid #ccd5e3;
    border-radius:12px;
    background:var(--white);
    transition:border-color .15s,background .15s;
}

.calc-option>span:after {
    content:'';
    position:absolute;
    top:16px;
    right:14px;
    width:14px;
    height:14px;
    border-radius:50%;
    border:1.5px solid #b5c1d4;
    background:var(--white);
}

.calc-option strong {
    display:block;
    font-size:14px;
    line-height:1.35;
    color:var(--ink);
}

.calc-option small {
    display:block;
    margin-top:5px;
    font-size:12px;
    line-height:1.45;
    color:var(--muted);
}

.calc-option input:checked+span {
    border-color:var(--blue);
    background:#f5f8ff;
    box-shadow:inset 0 0 0 1px var(--blue);
}

.calc-option input:checked+span:after {
    border-color:var(--blue);
    background:var(--blue);
    box-shadow:inset 0 0 0 3px var(--white);
}

.calc-option input:focus-visible+span {
    outline:3px solid var(--blue);
    outline-offset:3px;
}

.calc-hint {
    font-size:12.5px;
    line-height:1.6;
    margin:-4px 0 10px;
}

.calc-input {
    position:relative;
}

.calc-input input {
    width:100%;
    min-height:58px;
    padding:12px 64px 12px 16px;
    border:1px solid #ccd5e3;
    border-radius:8px;
    background:var(--white);
    color:var(--ink);
    font-size:22px;
    font-weight:700;
    font-variant-numeric:tabular-nums;
}

.calc-unit {
    position:absolute;
    top:50%;
    right:16px;
    transform:translateY(-50%);
    font-size:14px;
    font-weight:700;
    color:var(--muted);
    pointer-events:none;
}

.calc-range {
    display:block;
    width:100%;
    height:30px;
    margin:14px 0 2px;
    accent-color:var(--blue);
    cursor:pointer;
}

.calc-range-scale {
    display:flex;
    justify-content:space-between;
    gap:8px;
    font-size:11px;
    color:var(--muted);
}

.calc-step select {
    width:100%;
    min-height:50px;
    padding:10px 14px;
    border:1px solid #ccd5e3;
    border-radius:8px;
    background:var(--white);
    color:var(--ink);
    font-size:16px;
}

.calc-noscript {
    margin-top:22px;
    padding:14px 16px;
    border-radius:10px;
    background:var(--white);
    font-size:13px;
    color:var(--ink);
}

.tax-result {
    position:sticky;
    top:120px;
    min-width:0;
    padding:34px;
    border-radius:22px;
    background:var(--ink);
    color:var(--white);
}

.tax-result p {
    color:#c3cde0;
}

.tax-result .tax-result-label {
    font-size:13px;
    font-weight:700;
    color:var(--white);
}

.tax-result-value {
    display:block;
    margin-top:6px;
    font-size:clamp(42px,4.4vw,60px);
    font-weight:700;
    line-height:1.1;
    letter-spacing:-.04em;
    font-variant-numeric:tabular-nums;
    overflow-wrap:anywhere;
}

.is-ineligible .tax-result-value {
    color:#9fadc6;
}

.tax-result-period {
    font-size:13px;
    margin-top:4px;
}

.tax-bar {
    height:12px;
    margin:24px 0 10px;
    border-radius:999px;
    background:#ffffff26;
    overflow:hidden;
}

.tax-bar-relief {
    display:block;
    height:100%;
    border-radius:999px;
    background:#8fb0ff;
    transition:width .3s ease;
}

.tax-bar-legend {
    display:flex;
    justify-content:space-between;
    gap:12px;
    font-size:11.5px;
    color:#c3cde0;
}

.tax-bar-legend span {
    display:inline-flex;
    align-items:center;
    gap:7px;
}

.tax-bar-legend span:before {
    content:'';
    width:9px;
    height:9px;
    border-radius:50%;
    background:#8fb0ff;
}

.tax-bar-legend .tax-legend-rest:before {
    background:#ffffff40;
}

.tax-breakdown {
    margin:20px 0 0;
}

.tax-breakdown div {
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    gap:18px;
    padding:10px 0;
    border-bottom:1px solid #ffffff1f;
}

.tax-breakdown dt {
    font-size:13px;
    color:#c3cde0;
}

.tax-breakdown dd {
    margin:0;
    font-weight:700;
    font-variant-numeric:tabular-nums;
    white-space:nowrap;
}

.tax-breakdown .tax-breakdown-total dt {
    color:var(--white);
    font-weight:700;
}

.tax-result .tax-effective {
    font-size:12.5px;
    margin-top:10px;
}

.tax-deadline {
    display:flex;
    gap:10px;
    margin:20px 0 16px;
    padding:14px 16px;
    border-radius:12px;
    background:#ffffff12;
    font-size:13.5px;
    line-height:1.55;
}

.tax-result .tax-deadline {
    color:var(--white);
}

.tax-deadline .icon {
    width:19px;
    height:19px;
    color:#9fe0bf;
    margin-top:1px;
}

.tax-result .tax-note {
    margin:0 0 16px;
    padding:13px 16px;
    border-radius:12px;
    background:#ffe8b0;
    color:#3d2c05;
    font-size:13.5px;
    line-height:1.55;
}

.tax-result .tax-note-info {
    background:#8fb0ff29;
    color:#e3eaff;
}

.tax-result .button {
    width:100%;
    background:var(--white);
    color:var(--ink);
}

.tax-result .button:hover {
    background:#e6ecff;
    box-shadow:none;
}

.tax-result .tax-disclaimer {
    margin-top:14px;
    font-size:11.5px;
    line-height:1.6;
    color:#aebbd3;
}

.tax-eligibility-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
    margin-top:40px;
}

.tax-card {
    padding:30px;
    border-radius:20px;
    border:1px solid var(--line);
}

.tax-card h3 {
    font-size:22px;
    margin-bottom:6px;
}

.tax-card-yes {
    background:#f1f8f4;
    border-color:#d7eadf;
}

.tax-card-yes .feature-list {
    margin-bottom:0;
}

.tax-card-yes .feature-list li:before {
    border-color:var(--green);
}

.tax-card-no {
    background:var(--porcelain);
}

.tax-exclusions {
    list-style:none;
    margin:24px 0 0;
    padding:0;
}

.tax-exclusions li {
    position:relative;
    margin-block:13px;
    padding-left:27px;
    font-size:14px;
    color:var(--ink);
}

.tax-exclusions li:before,.tax-exclusions li:after {
    content:'';
    position:absolute;
    left:1px;
    top:11px;
    width:12px;
    height:1.5px;
    background:#b0473a;
    transform:rotate(45deg);
}

.tax-exclusions li:after {
    transform:rotate(-45deg);
}

.tax-process {
    background:var(--porcelain);
}

.process-grid.tax-steps {
    list-style:none;
    padding:0;
    margin-bottom:0;
    grid-template-columns:repeat(4,1fr);
    gap:36px;
}

.tax-steps li {
    border-top:2px solid var(--blue);
    padding-top:24px;
}

.tax-steps h3 {
    font-size:21px;
    margin-bottom:12px;
}

.tax-steps p {
    font-size:14px;
}

.tax-documents {
    display:grid;
    grid-template-columns:1fr 1.1fr;
    gap:95px;
}

.tax-sources {
    padding-top:10px;
    padding-bottom:90px;
}

.tax-sources h2 {
    font-size:22px;
    letter-spacing:-.02em;
    margin-bottom:14px;
}

.tax-sources ul {
    list-style:none;
    margin:0 0 14px;
    padding:0;
}

.tax-sources li {
    margin:6px 0;
}

.tax-sources .text-link {
    display:inline;
    font-size:13.5px;
    font-weight:600;
    color:var(--blue);
    text-decoration-color:#355ce84d;
}

.tax-sources p {
    font-size:12px;
}

@media(max-width:1200px) {
    .partner-grid li {
        flex-basis:calc((100% - 3 * 14px) / 4);
    }
    .model-grid,.directory-grid {
        grid-template-columns:repeat(2,1fr);
    }
    .directory-grid>li.directory-cta {
        grid-column:auto;
    }
    .process-grid.tax-steps {
        grid-template-columns:repeat(2,1fr);
    }
    .calc-options {
        grid-template-columns:1fr;
    }
    .tax-result {
        padding:30px 28px;
    }
}

@media(max-width:900px) {
    .service-tiles {
        grid-template-columns:repeat(2,1fr);
    }
    .why-grid {
        grid-template-columns:repeat(2,1fr);
        gap:36px 32px;
    }
    .partner-heading,.directory-group-heading {
        grid-template-columns:1fr;
        gap:18px;
    }
    .partner-heading .eyebrow {
        margin-bottom:0;
    }
    .partner-heading>p:not(.eyebrow),.directory-group-heading p {
        justify-self:start;
        max-width:none;
    }
    .price-charts,.price-explainer,.lever-grid {
        grid-template-columns:1fr;
    }
    .tax-calculator-section {
        grid-template-columns:1fr;
    }
    .tax-result {
        position:static;
    }
    .calc-options {
        grid-template-columns:repeat(3,1fr);
    }
    .tax-documents {
        gap:45px;
    }
}

@media(max-width:650px) {
    .service-tiles {
        grid-template-columns:1fr;
        gap:12px;
    }
    .service-tile {
        min-height:0;
        padding:22px 22px 24px;
    }
    .service-tile h3 {
        margin-top:20px;
    }
    .service-tile .round-arrow {
        top:22px;
        right:20px;
    }
    .service-tile-cta {
        padding:24px 22px;
    }
    .why-grid {
        grid-template-columns:1fr;
        gap:30px;
    }
    .why-icon {
        margin-bottom:16px;
    }
    .partner-section {
        padding-bottom:50px;
    }
    .partner-grid {
        gap:10px;
    }
    .partner-grid li {
        flex-basis:calc((100% - 10px) / 2);
        height:88px;
        padding:14px 12px;
    }
    .directory-grid,.directory-grid-energy {
        grid-template-columns:1fr;
    }
    .directory-group-heading h2 {
        font-size:32px;
    }
    .directory-card-copy {
        padding:22px 22px 24px;
    }
    .directory-card-copy h3 {
        font-size:23px;
    }
    .price-chart {
        padding:22px 20px;
    }
    .price-chart figcaption {
        grid-template-columns:1fr;
    }
    .price-chart-total {
        grid-row:auto;
        grid-column:1;
        margin-top:8px;
    }
    .price-blocks {
        grid-template-columns:1fr;
        gap:10px;
    }
    .price-block {
        grid-template-columns:auto auto 1fr;
        gap:0 10px;
    }
    .price-block-share {
        font-size:18px;
        min-width:48px;
    }
    .price-block-name {
        grid-column:3;
        grid-row:1;
    }
    .price-block-value {
        grid-column:3;
        grid-row:2;
    }
    .price-explainer li,.model-grid li,.lever-grid li {
        padding:24px 22px;
    }
    .model-grid {
        grid-template-columns:1fr;
    }
    .tax-facts li {
        flex:1 1 100%;
    }
    .tax-calculator {
        padding:26px 20px;
        border-radius:17px;
    }
    .tax-calculator h2 {
        font-size:27px;
    }
    .calc-options {
        grid-template-columns:1fr;
    }
    .calc-input input {
        font-size:20px;
    }
    .tax-result {
        padding:26px 22px;
        border-radius:17px;
    }
    .tax-eligibility-grid,.tax-documents,.process-grid.tax-steps {
        grid-template-columns:1fr;
    }
    .tax-documents {
        gap:30px;
    }
    .tax-card {
        padding:24px 22px;
    }
    .tax-sources {
        padding-bottom:55px;
    }
}

@media(max-width:380px) {
    .mobile-nav-services {
        grid-template-columns:1fr;
    }
}