@property --accent-color{syntax: "<color>"; inherits: true; initial-value: transparent;}@property --background-color{syntax: "<color>"; inherits: true; initial-value: transparent;}@property --color{syntax: "<color>"; inherits: true; initial-value: transparent;}.ccm-page{@media(prefers-reduced-motion){--duration: 0s}input[type=radio]:focus-visible+label,:focus-visible{z-index:1;outline:5px rgba(from var(--background-color, var(--accent-color)) r g b / .25) solid}a:not(.button):focus-visible{outline:5px rgba(from var(--color, var(--accent-color)) r g b / .25) solid}}input{&[type=search],&[type=text],:not([type]){font-family:var(--body);text-wrap:nowrap;overflow:hidden;text-overflow:ellipsis}&[type=checkbox][switch]{accent-color:var(--accent-color);appearance:none;aspect-ratio:2;--background-color: var(--ke-turquoise-dark);background-image:radial-gradient(currentcolor calc(100% - 5px),transparent calc(100% - 4px)),linear-gradient(var(--background-color),var(--background-color));background-position:2px,0;background-repeat:no-repeat;background-size:calc(50% - 4px) calc(100% - 4px),100% 100%;border-radius:1em;box-sizing:content-box;background-origin:content-box;color:var(--ke-beige);cursor:pointer;display:inline-block;font-size:var(--font-size-px, 1rem);margin:0;width:2.75em;transition-property:--background-color,background-position;&:checked{--background-color: var(--accent-color);background-position:calc(100% - 2px),0}&:focus{outline-color:rgba(from var(--background-color) r g b / .25)}}}:root{--ke-beige: #F5F3EB;--ke-beige-dark: #E7E5DB;--ke-beige-light: #FDFCFA;--ke-black: #181818;--ke-orange: #FF8310;--ke-orange-a11y: #ED7200;--ke-pink: #FF4B76;--ke-turquoise: #00DFFF;--ke-turquoise-a11y: #00A3BA;--ke-turquoise-dark: #4C5F62;--ke-yellow: #ECFF00;--ke-yellow-a11y: #D2E300;--wtf-megapink: #FF0078;--wtf-plusone: #111;--wtf-creamer: #FFF5E9;--bs-body-bg: #fff}.ccm-ui,.ccm-page{[data-icon=calendar]{--icon: url(../../icons/sheet.svg?f#calendar)}[data-icon=check]{--icon: url(../../icons/sheet.svg?f#check)}[data-icon=chevron-down]{--icon: url(../../icons/sheet.svg?f#chevron-down)}[data-icon=cookie-bite]{--icon: url(../../icons/sheet.svg?f#cookie-bite)}[data-icon=envelope]{--icon: url(../../icons/sheet.svg?f#envelope)}[data-icon=facebook-f]{--icon: url(../../icons/sheet.svg?f#facebook-f)}[data-icon=file-contract]{--icon: url(../../icons/sheet.svg?f#file-contract)}[data-icon=file-pdf]{--icon: url(../../icons/sheet.svg?f#file-pdf)}[data-icon=fingerprint]{--icon: url(../../icons/sheet.svg?f#fingerprint)}[data-icon=instagram]{--icon: url(../../icons/sheet.svg?f#instagram)}[data-icon=location-dot]{--icon: url(../../icons/sheet.svg?f#location-dot)}[data-icon=location-exclamation]{--icon: url(../../icons/sheet.svg?f#location-exclamation)}[data-icon=messages-question]{--icon: url(../../icons/sheet.svg?f#messages-question)}[data-icon=phone]{--icon: url(../../icons/sheet.svg?f#phone)}[data-icon=universal-access]{--icon: url(../../icons/sheet.svg?f#universal-access)}[data-icon]:not(:has(>a:first-child)),[data-icon]:has(>a:first-child)>a:first-child{&:after{content:none}&:before{background-color:currentcolor}&:not(:empty):before{margin-inline-end:1ch}}[data-icon]:not(:has(>a:first-child)):before,[data-icon]:has(>a:first-child)>a:first-child:before,svg.icon{content:"";display:inline-block;line-height:inherit;height:1em;aspect-ratio:1;vertical-align:middle;mask-image:var(--icon);mask-repeat:no-repeat;mask-size:contain;&:not(:first-child){margin-inline-start:1ch}&:is([data-icon],a):before,&:not(:last-child){margin-inline-end:1ch}&.icon:has(+input),&:first-child:last-child{margin-inline:0}&.small{height:.5em}&.large{height:2em}}icon-container{display:inline-block;background-color:var(--accent-color);border-radius:100vh;width:5.5rem;height:5.5rem;align-content:center;text-align:center;translate:25% 50%;position:relative;z-index:1;svg.icon{height:2rem}}}.ccm-page{--duration: .1s;--instant: 0s;*,:before,:after{animation-duration:var(--duration);transition-duration:var(--duration);transition-property:none}}@keyframes rotate{to{rotate:-360deg}}footer svg{height:220px;width:220px;g{animation:rotatte 24s forwards linear infinite}}@font-face{font-family:Dela Gothic One;font-style:normal;font-weight:400;font-display:swap;src:url(../../fonts/DelaGothicOne.woff2) format("woff2")}@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:200 900;font-display:swap;src:url(../../fonts/SourceSans3.woff2) format("woff2-variations")}@font-face{font-family:"Source Sans 3";font-style:italic;font-weight:200 900;font-display:swap;src:url(../../fonts/SourceSans3Italic.woff2) format("woff2-variations")}@keyframes re-underline{0%,to{text-decoration-inset:0 0}50%{text-decoration-inset:30cqw 0}51%{text-decoration-inset:0 30cqw}}@keyframes underline{0%{text-decoration-inset:0 30cqw}50%{text-decoration-inset:0 0}}:root{font-family:var(--body);font-size:16px;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;--heading: "Dela Gothic One";--body: "Source Sans 3";--thin: 100;--extralight: 200;--extra-light: 200;--ultralight: 200;--ultra-light: 200;--light: 300;--normal: 400;--book: 400;--regular: 400;--medium: 500;--demibold: 600;--demi-bold: 600;--semibold: 600;--semi-bold: 600;--bold: 700;--extrabold: 800;--black: 900;--heavy: 900;.ccm-page ::selection{--color: var(--ke-beige-light);color:var(--color);background-color:var(--ke-black);text-decoration-color:var(--color, currentcolor)}}.ccm-page{*{font-size:calc(1rem * var(--font-size-px, 16) / 16);letter-spacing:calc(1rem * var(--letter-spacing, 0) / 16);line-height:normal}&,.root{font-family:var(--body);font-size:1rem;font-weight:var(--regular);line-height:1.5rem}h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{font-family:var(--heading);font-weight:400;text-wrap:balance;word-break:break-word;hyphens:auto;hyphenate-limit-chars:5 4 4;margin-block:1rem;&:first-child{margin-block:0 1rem}}h1,.h1{font-size:clamp(28px,2.5vw,48px);letter-spacing:-.01em;line-height:116.667%}.container:has(layout-column:nth-of-type(1):last-child) .wtf-block-featured-content .title :is(h2,h3),h2,.h2{font-size:clamp(20px,2.1vw,40px);letter-spacing:-.01em;line-height:130%}h3,.h3{font-size:clamp(16px,2vw,28px);line-height:125%}h4,.h4{font-size:clamp(16px,1.9vw,24px);line-height:125%}h5,.h5{font-size:clamp(16px,18px,20px);line-height:135%}h6,.h6{font-size:16px;line-height:137.5%}.small-text{font-family:var(--body);font-size:12px;font-weight:400;letter-spacing:.12px}a{color:var(--ke-black, inherit);text-decoration:none}main a{text-decoration:underline;&:focus,&:hover{animation:re-underline .5s forwards linear}}a.chevron{text-decoration:none;&:focus,&:hover{text-decoration:underline;animation:underline .5s forwards linear;&.chevron:after{translate:1ch}}&.chevron:after{content:"";mask-image:url(../../icons/sheet.svg#chevron-right);mask-size:contain;mask-repeat:no-repeat;background-color:currentcolor;display:inline-block;width:1ch;height:1ch;margin-left:1ch;vertical-align:center;transition-property:translate}}footer a:not(.button,:has(*)){text-decoration:none;&:focus,&:hover{text-decoration:underline;animation:underline .5s forwards linear;&:after{translate:1ch}}}.ccm-block-page-list-page-entry-text a{text-decoration:none}.ccm-ui{--font-size-px: 12}input[type=file]::file-selector-button,button:not(.accordion-button,.naked-button),a.button{--background-color: transparent;--color: var(--ke-black);color:var(--color);background-color:var(--background-color);border:1px solid var(--ke-black);text-decoration:none;width:fit-content;display:inline-flex;flex-wrap:wrap;padding:6px 14px;justify-content:center;align-items:center;gap:10px;font-family:var(--heading);transition-property:--background-color,--color;transition-timing-function:ease-out;&:focus,&:hover{--background-color: var(--ke-black);--color: var(--accent-color);border-color:var(--ke-black);transition-duration:0s}}input[type=file]{padding-inline:0!important;position:relative;&::file-selector-button{height:calc(100% + 2px);margin-top:-1px;margin-left:-1px;transition-property:--background-color,--color;transition-duration:var(--duration)}}input[type=file]:focus,input[type=file]:hover{outline:none;&::file-selector-button{--background-color: var(--ke-black);--color: var(--accent-color);border-color:var(--ke-black);transition-duration:0s;outline:outline: 5px rgba(from var(--background-color, var(--accent-color)) r g b / .25) solid}}product-card,.wtf-block-featured-content{button,a.button{--background-color: var(--accent-color);--color: var(--ke-black);border-color:transparent;&:focus,&:hover{--background-color: var(--ke-black);--color: var(--accent-color);border-color:transparent}}}button.naked-button{appearance:none;background:transparent;border:none;color:inherit;padding:0}footer ul{padding:0;list-style:none}}:root.ccm-edit-mode .ccm-page .ccm-content-block{.h1,.h2,.h3,.h4,.h5,.h6{&:is(.h1){--h-visual: "h1"}&:is(.h2){--h-visual: "h2"}&:is(.h3){--h-visual: "h3"}&:is(.h4){--h-visual: "h4"}&:is(.h5){--h-visual: "h5"}&:is(.h6){--h-visual: "h6"}&:after{font-family:var(--body);font-size:12px;display:inline-block;content:var(--h-visual);margin-left:1ch;border:solid 1px var(--ke-beige-dark);background:var(--ke-beige-light);line-height:1em;padding-inline:.25ch}}}.ccm-page .ccm-block-accordion table,.ccm-page .ccm-content-block table{border-radius:1rem;border:1px solid var(--ke-black);text-align:left;border-spacing:0;overflow:hidden;margin-bottom:1rem;caption{font-size:clamp(20px,2.1vw,28px);letter-spacing:-.01em;line-height:130%;text-align:left}thead{tr{th{padding-inline:.5ch;vertical-align:top;padding-top:1rem;&:first-child{font-size:1.25rem;padding-inline:1ch;padding-left:1rem}&:last-child{padding-right:1ch}}}}tbody{&:nth-child(odd){background-color:var(--ke-beige-dark)}tr{th,td{padding-inline:1ch}th{font-weight:400;padding:0 1rem}&:first-child{th{padding:1rem;font-size:1rem;font-family:Dela Gothic One;font-weight:400}}&:last-child{th{padding-bottom:1rem;padding-left:1rem}}td{&:last-child{padding-right:1rem}}}}}:root{--default-brand-color: var(--ke-turquoise);--default-brand-color-a11y: var(--ke-turquoise-a11y);--networks-brand-color: var(--ke-yellow);--networks-brand-color-a11y: var(--ke-yellow-a11y);--district_heating-brand-color: var(--ke-orange);--district_heating-brand-color-a11y: var(--ke-orange-a11y);--anniversary-brand-color: var(--ke-pink);--anniversary-brand-color-a11y: var(--ke-turquoise-a11y);--default-brand-shape: polygon(1202.05px 181.815px, 1061.26px 395.516px, 1086.64px 388.609px, 947.37px 600px, 0px 600px, 127.711px 412.595px, 96.3867px 421.123px, 243.119px 205.807px, 211.795px 214.335px, 357.855px 0px, 1301px 0px, 1176.67px 188.721px, 1202.05px 181.815px);--default-brand-shape-height: 600px;--brand-shape: var(--default-brand-shape);--brand-shape-width: 1301px;--brand-shape-height: var(--default-brand-shape-height);--brand-shape-offset-x: 366px;--brand-shape-offset: 50%;--brand-shape-inner-top: 50%;--brand-shape-inner-translate: -50%;[data-brand=default],&:has(.ccm-page[data-brand=default]){--brand-color: var(--default-brand-color);--brand-color-a11y: var(--default-brand-color-a11y)}[data-brand=networks],&:has(.ccm-page[data-brand=networks]){--brand-color: var(--networks-brand-color);--brand-color-a11y: var(--networks-brand-color-a11y)}[data-brand=anniversary],&:has(.ccm-page[data-brand=anniversary]){--brand-color: var(--anniversary-brand-color);--brand-color-a11y: var(--anniversary-brand-color-a11y)}--accent-color: var(--brand-color);--accent-color-a11y: var(--brand-color-a11y);--accent-color-text: var(--ke-black);[data-brand=district_heating],&:has(.ccm-page[data-brand=district_heating]){--brand-shape: path("M950.87 -30H476.5C473.74 -20.59 469.31 -10.17 461.99 1.98C427.07 59.92 396.3 41.38 361.39 99.32C326.47 157.26 357.24 175.8 322.33 233.74C287.41 291.68 256.64 273.14 221.73 331.08C186.81 389.02 217.58 407.56 182.67 465.5C147.75 523.44 116.98 504.9 82.07 562.84C47.15 620.78 77.92 639.32 43.01 697.26C28.13 721.95 14.01 732.75 0 741.5H623.23H883.83C887.45 714.87 881.83 693.79 904.91 655.49C939.82 597.55 970.6 616.09 1005.51 558.15C1040.42 500.21 1009.65 481.67 1044.57 423.73C1079.49 365.79 1110.26 384.33 1145.17 326.39C1180.08 268.45 1149.31 249.91 1184.23 191.97C1219.14 134.03 1249.92 152.57 1284.83 94.63C1317.7 40.08 1292.36 20.45 1318.41 -30H950.87Z");--brand-shape-height: 741.5px;--brand-color: var(--default-brand-color);--brand-color-a11y: var(--district_heating-brand-color-a11y);--accent-color: var(--district_heating-brand-color);--accent-color-a11y: var(--district_heating-brand-color-a11y);--brand-shape-width: 1237px;--brand-shape-offset-x: 436px;--brand-shape-offset: 100%;--brand-shape-inner-top: calc(100% - 50cqh) ;--brand-shape-inner-translate: -50cqh}[data-brand=outages],&:has(.ccm-page[data-brand=outages]),[data-brand=concern],&:has(.ccm-page[data-brand=concern]){--brand-color: var(--ke-beige);--accent-color: var(--default-brand-color);--accent-color-a11y: var(--default-brand-color-a11y)}}:root{scrollbar-gutter:stable;scrollbar-color:var(--ke-turquoise-dark) var(--ke-beige);scroll-padding-top:calc(var(--outage-notification-height) + var(--top-shelf-height) + var(--navbar-height) + var(--top-shelf-height));scroll-behavior:smooth;overflow-y:auto;overflow-x:clip;font-size:16px;height:100%;background-color:var(--ke-beige);color:var(--ke-black);display:grid;grid-template-areas:"body";--layout-max-width: 1440px;--layout-min-width: 375px;--content-max-width: 1200px;--padding-inline-auto: calc((100% - var(--content-max-width)) / 2);--ccm-toolbar-height: 0px;--outage-notification-height: 44px;--top-shelf-height: 53px;--navbar-height: 100px;--corner-radius: 1rem;&:has(#outage-notification[hidden]){--outage-notification-height: 0px}&.ccm-toolbar-visible{--ccm-toolbar-height: 48px}}body{margin:0}.ccm-page{container-type:inline-size;container-name:ccm-page;min-height:calc(100% - var(--ccm-toolbar-height));display:grid;grid-template-areas:"header" "main" "footer";grid-template-rows:auto 1fr auto;a:has(svg:first-child:last-child),svg{display:inline-block;vertical-align:middle}>header{grid-area:header}>main{container-type:inline-size;container-name:main;grid-area:main;margin-top:calc(var(--outage-notification-height) + var(--top-shelf-height));position:relative;section{--section-padding-block: 5rem;&.dark:has(+section.dark>layout-column.first:first-child),&:not(.dark):has(+section:not(.dark)>layout-column.first:first-child){padding-block-end:1rem;+section{padding-block-start:1rem}}&:empty,&:not(:has(:not(:empty))){display:none}&:not(:empty){padding-block:var(--section-padding-block)}}.ccm-edit-mode-title-notch{margin:0}.ccm-block-edit-container{margin-bottom:0;section{box-shadow:var(--background-color) 0 0 0 25px;padding-block:calc(var(--section-padding-block) - 25px)}}}>main section,>footer{padding-inline:max(2rem,var(--padding-inline-auto))}>main>hero-section section{padding-inline:0}>footer{grid-area:footer}img{max-width:100%;height:unset;border-radius:var(--corner-radius)}*,:before,:after{gap:1rem;box-sizing:border-box}iframe{width:100%;min-height:452px;border:none;border-radius:var(--corner-radius)}.ccm-content-block{h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{margin-block-end:1em;&:not(:first-child){margin-block-start:2em}}}.accordion-button{&:after{transition:transform var(--duration) ease-in-out}&:not(.collapsed):after{transform:rotateX(180deg)}}}@container (width > 920px){.mobile{display:none!important}}.ccm-page header{>*{--content-max-width: var(--layout-max-width);--padding-inline-auto: calc((100% - var(--content-max-width)) / 2);padding-inline:max(0rem,var(--padding-inline-auto));width:100%}#outage-notification{&[hidden]{display:none}position:fixed;z-index:602;top:var(--ccm-toolbar-height);width:100%;height:var(--outage-notification-height);background-color:var(--ke-pink);align-content:center;text-align:center;--font-size-px: 18;font-weight:var(--bold)}#top-shelf{position:fixed;z-index:602;top:calc(var(--ccm-toolbar-height) + var(--outage-notification-height));height:var(--top-shelf-height);background-color:var(--ke-beige-dark);border-bottom:5px solid var(--brand-color);overflow-y:visible;ul{list-style:none;padding:0}>ul{height:100%;margin:0;display:flex;gap:0;>li{align-content:center;height:100%;&[data-brand]{overflow-y:clip}&[data-brand]:not([data-brand=concern],[data-brand=outages]) a{background-color:var(--background-color);box-shadow:0 3px var(--background-color);transition-property:--background-color;&:focus,&:hover{--background-color: rgba(from var(--brand-color) r g b / .5)}&:focus-visible,&:active{--background-color: var(--brand-color)}}&[data-brand] a.current{--background-color: var(--brand-color);background-color:var(--background-color)}}}@container (width <= 920px){.mobile{display:unset}&.expanded{button svg{transform:rotateX(180deg)}>ul{overflow:visible;>li,>li:not(:has(a.current)){display:block}}}>button{position:absolute;top:0;right:0;border:none;height:var(--top-shelf-height);width:var(--top-shelf-height)}>ul{height:var(--top-shelf-height);overflow:clip;flex-direction:column;width:100%;align-items:stretch;>li{&:has(a.current){order:-1}&:not(:has(a.current)){display:none}background-color:var(--ke-beige-dark);&:is([data-brand=default],[data-brand=networks],[data-brand=anniversary]){--background-color: var(--brand-color);background-image:linear-gradient(90deg,var(--background-color) .5rem,transparent .5rem)}>a{width:100%;display:block;height:var(--top-shelf-height);align-content:center;padding-inline:1rem}&[data-brand] a:not(.current),span{background-color:transparent}}}}@container (width > 920px){>button{display:none}>ul{>li{details[open] .icon{transform:rotateX(180deg)}a,label,summary{text-wrap:nowrap;display:inline-block;cursor:pointer;line-height:24px;padding:.75rem 1rem;position:relative;align-content:center;&::marker{content:none}&:is(summary){width:100%;+*{position:absolute;background-color:var(--ke-beige-dark)}}span[data-label]{position:relative;visibility:hidden;display:inline-block;&:before{content:attr(data-label);visibility:visible;position:absolute;height:100%;left:50%;top:0;align-content:center;translate:-50%;transition-property:font-weight,letter-spacing}}&:focus,&:hover{span[data-label]:before{font-weight:var(--semibold);letter-spacing:-.025ch;transition-duration:0s}}}&:nth-child(3 of[data-brand]){flex-grow:1}}}}}nav{background-color:var(--ke-beige);height:var(--navbar-height);align-content:center;position:fixed;z-index:601;top:0;translate:0 calc(var(--ccm-toolbar-height) + var(--outage-notification-height) + var(--top-shelf-height));transition-property:translate;display:flex;gap:1rem;justify-content:space-between;&[hidden]{display:block;translate:0 -100%}&,>*{align-content:center}a:has(svg#logo){height:calc(100% - 10px);margin-block:5px}svg#logo,&:after{margin-inline:27.5px;width:197px;height:47px}@container (width > 920px){&:after{content:"";flex-shrink:1}}@container (width < 920px){.mobile-button{width:100px;flex-shrink:0;border:none}&:has(.navbar-nav.expanded){position:relative;margin-bottom:-100px}}}}:root{--hero-section-height: min(700px, calc(100dvh - (var(--ccm-toolbar-height) + var(--outage-notification-height) + var(--top-shelf-height) + var(--navbar-height))))}.ccm-page{&[data-brand=default]{hero-section .button{--background-color: var(--ke-yellow);--accent-color: var(--ke-turquoise)}hero-section product-card .button{--background-color: var(--ke-turquoise);--accent-color: var(--ke-turquoise)}}&[data-brand=networks]{hero-section .button{--background-color: var(--ke-turquoise);--accent-color: var(--ke-yellow)}}&[data-brand=district_heating]{hero-section .button{--background-color: var(--ke-turquoise);--accent-color: var(--ke-yellow)}}&:not(.page-template-page-antihero) hero-section .button{border-color:transparent;transition-property:--background-color,--accent-color;&.button:focus,&.button:hover{--background-color: inherit;background-color:var(--ke-black);color:var(--background-color);transition-duration:0s}}}.ccm-page main hero-section{container-type:size;position:relative;display:block;width:100%;height:var(--hero-section-height);max-height:calc(var(--navbar-height) + var(--padding-block) + 600px + var(--padding-block))\df;max-height:calc(var(--navbar-height) + 600px + var(--padding-block) + var(--padding-block));--background-color: var(--accent-color);background-color:var(--background-color);align-content:center;padding-inline:max(2rem,var(--padding-inline-auto)) var(--padding-inline-auto);padding-block:var(--padding-block);border-top:var(--background-color, var(--accent-color)) var(--navbar-height) solid;&:empty{margin-bottom:9rem}&.beige,&.dark{--background-color: var(--ke-beige-dark)}}.ccm-page.page-type-front-page,.ccm-page.page-type-main-page,.ccm-page.page-type-page,.ccm-page.page-type-electricity-contract-page{hero-section{overflow:clip;container-type:size;.hero-image{background-color:var(--accent-color-a11y);position:absolute;height:var(--brand-shape-height);top:var(--brand-shape-offset);translate:0 calc(var(--brand-shape-offset) * -1);clip-path:var(--brand-shape);width:var(--brand-shape-width);left:calc(var(--padding-inline-auto) + var(--brand-shape-offset-x));img{border-radius:0;height:100cqh;width:100%;object-fit:cover;position:absolute;top:var(--brand-shape-offset);translate:0 calc(var(--brand-shape-offset) * -1)}}.hero-content{display:flex;gap:2rem;flex-direction:column;height:100%;width:40%;justify-content:center;>*{margin-block:0}>ul,>p{margin-right:4rem}ul{padding:0;list-style:none}p:empty{display:none}}product-card{position:absolute;width:auto;top:50%;inset-inline:max(2rem,var(--padding-inline-auto));translate:0 -50%}}&.page-template-page-antihero{hero-section{background-color:var(--ke-beige-dark);container-type:normal;height:unset}}}.ccm-page.page-type-main-page{main{hero-section{container-type:size;background-image:url(/application/themes/kokkolanenergia2026/images/hero-overlay-district_heating.svg),var(--bg);background-size:1237px 600px;background-repeat:no-repeat;background-position:center;.hero-content{overflow-x:visible;overflow-y:clip;position:relative;height:100%;display:flex;.hero-text{width:40%;display:flex;justify-content:center;height:100%;flex-direction:column;padding:0;margin-right:-4rem;gap:40px;@media(max-width:600px){padding:0 2rem;margin-right:0;text-align:center}}.hero-image{display:none;background-color:green;width:60%;height:100%;object-fit:cover;flex-shrink:0;background-size:cover;background-position:center;background-repeat:no-repeat;clip-path:var(--brand-shape);picture,img{border-radius:0;height:100cqh}}}}}}.ccm-page.page-type-front-page,.ccm-page.page-type-main-page,.ccm-page.page-type-page{@container (width <= 920px){hero-section{padding-inline:0;display:flex;flex-direction:column-reverse;position:relative;height:700px;.hero-content{flex-grow:1;height:50%;&,>*{width:100%}padding:1rem}.hero-image{flex-shrink:1;translate:none;clip-path:none;height:50%;width:100%;left:0;top:0;overflow:clip;position:relative;img{position:relative;height:100%;width:100%;object-fit:cover}&:after{content:"";position:absolute;inset:0;display:block;pointer-events:none;background-image:url(../../images/mobile-hero-overlay.svg);background-repeat:no-repeat;background-position:bottom right;z-index:88}}}}}.ccm-page[data-brand=district_heating]{@container (width <= 920px){hero-section .hero-image:after{background-image:url(../../images/mobile-hero-overlay-district-heating.svg)}}}.ccm-page footer{background-color:var(--ke-beige-dark);display:grid;column-gap:2rem;grid-template-columns:repeat(4,1fr);grid-template-areas:"ident        ident        contact      nav         " "bottom-shelf bottom-shelf bottom-shelf bottom-shelf";@container ccm-page (width < 976px){grid-template-areas:"ident" "contact" "nav" "bottom-shelf"}>section{padding-block-start:6.25rem;&.ident{grid-area:ident;padding-block-start:4rem;img{margin-bottom:2em}}&.contact{grid-area:contact}&.nav{grid-area:nav}&#bottom-shelf{padding-block:2.75rem;grid-area:bottom-shelf;justify-self:end;a{margin-inline:.5ch}}}ul.h6{li{height:1.5lh}}}.ccm-page hero-section.container,.container{display:grid;grid-auto-rows:1fr;&:has(section-heading){grid-auto-rows:auto 1fr}--background-color: transparent;background-color:var(--background-color);section-heading:not(:empty){padding-block-end:2rem}&:has(layout-column:nth-of-type(1):last-of-type,layout-column.body){grid-template-columns:1fr;.ccm-block-rss-displayer-item-summary,.ccm-block-express-form,.ccm-content-block{width:min(100%,790px)}}&:has(layout-column:nth-of-type(2):last-of-type){grid-template-columns:1fr 1fr;section-heading{grid-column:span 2}&.sidebar-left{grid-template-columns:1fr 3fr;grid-template-areas:"sidebar heading" "sidebar body   ";grid-auto-rows:auto;section-heading{grid-area:heading;grid-column:2}layout-column.sidebar{grid-area:sidebar}layout-column.body{grid-area:body}}&.sidebar-right{grid-template-columns:3fr 1fr;grid-template-areas:"heading sidebar" "body    sidebar";grid-auto-rows:auto;section-heading{grid-area:heading;grid-column:1}layout-column.sidebar{grid-area:sidebar}layout-column.body{grid-area:body}}@container main (width < 976px){grid-template-columns:1fr;section-heading{grid-column:span 1}&.sidebar-right,&.sidebar-left{grid-template-columns:1fr;grid-template-areas:"heading" "sidebar" "body"}}}&:has(layout-column:nth-of-type(3):last-of-type){grid-template-columns:1fr 1fr 1fr;section-heading{grid-column:span 3}@container main (width < 1200px){grid-template-columns:1fr 1fr;section-heading{grid-column:span 2}}@container main (width < 976px){grid-template-columns:1fr;&:has(section-heading){grid-template-columns:1fr;section-heading{grid-column:span 1}}}}&:has(layout-column:nth-of-type(4):last-of-type){grid-template-columns:1fr 1fr 1fr 1fr;section-heading{grid-column:span 4}@container main (width < 1200px){grid-template-columns:1fr 1fr;section-heading{grid-column:span 2}}@container main (width < 976px){grid-template-columns:1fr;section-heading{grid-column:span 1}}}&.dark{--background-color: var(--ke-beige-dark)}layout-column:not(:has(.wtf-block-featured-content,product-card)){&:not(:first-of-type){padding-inline-start:1rem}&:not(:last-of-type){padding-inline-end:1rem}}}:root:not(.ccm-toolbar-visible){layout-column:not(:has(>*)){display:none}}.ccm-page:is(.page-type-news,.page-type-outage-notification) .container{layout-column:is(.lead,.image){display:flex;flex-direction:column;justify-content:center}&:has(layout-column:nth-of-type(1):last-of-type){grid-template-columns:1fr;layout-column{container-type:inline-size}.ccm-block-express-form,.ccm-content-block{width:min(100%,690px);@container (width > 820px){margin-inline-start:clamp(0%,calc(100% / 12),10%)}}}}.accordion{.accordion-item{background-color:transparent;border-bottom:1px solid;.accordion-header{margin:0;button.accordion-button{font-family:var(--body);font-weight:var(--heavy);background-color:transparent;padding-left:0;padding-right:0;cursor:pointer;&:focus,&:hover{box-shadow:none;opacity:1}&:after{transition:transform var(--duration) ease-in-out}&:not(.collapsed):after{transform:rotateX(180deg)}}}.accordion-collapse{height:0px;transition:all ease-out .2s;overflow:hidden;.accordion-body{padding-top:0;padding-left:0;padding-right:0;max-width:800px}&.show{transition:all ease-in .2s;height:auto}}}}.ccm-page ul.nav{list-style:none;padding:0;&.sticky{position:sticky;top:16rem}ul{padding-left:2ch;list-style:none}a{height:1.5lh;display:inline-block;align-content:center;text-decoration:none;&:focus,&:hover{text-decoration:underline;animation:underline .5s forwards linear}&.current{font-weight:var(--semibold)}}}.ccm-page{.ccm-block-express-form{label:has(+.text-muted){&:after{content:"*";margin-left:1ch}+.text-muted{display:none}}input[type=date]+.text-muted{display:none}}.ccm-form{fieldset{margin:0;border:none;padding:0;legend{display:none}div:not(.form-check){margin-bottom:1rem}label{display:block;&:has(~.form-check){display:none;&:has(~.form-check:nth-of-type(2)){display:block}~.form-check{display:flex;gap:1ch;align-items:center}}}select,input{border-radius:0;appearance:none;align-content:center;width:100%;background-color:transparent;height:48px;border:1px solid;padding-inline:1ch;&:is(select){background-image:url(../../icons/sheet.svg?d#chevron-down);background-position:center right 1rem;background-size:1rem 1rem;background-repeat:no-repeat}&.form-check-input{padding:0;text-align:center;width:1.5rem;height:1.5rem;margin:2px 0;vertical-align:center;appearance:none;transition-property:background-color,border-color,color;&[type=radio]{border-radius:100vw;&:after{border-radius:100vw}}&:disabled{filter:grayscale() contrast(.5) brightness(1)}&:checked{color:var(--accent-color);background-color:var(--ke-black);border-color:var(--ke-black);&:after{content:"";display:inline-block;line-height:inherit;height:1em;aspect-ratio:1;vertical-align:middle;background-color:var(--accent-color);mask-image:url(../../icons/sheet.svg?c#check);mask-repeat:no-repeat;mask-size:contain;transition-property:background-color}}&:after{background-color:transparent}}}textarea{width:100%;background-color:transparent;resize:vertical;border:1px solid}}.form-group.captcha{visibility:hidden}}}.ccm-page{&.page-type-electricity-contract-page{product-card table{width:100%!important}hero-section product-card{padding:4rem;text-align:start;display:grid;column-gap:2rem;grid-template-columns:1fr 1fr;grid-template-areas:"card-header card-body" "card-lead   card-body" "card-footer card-body";card-header{grid-area:card-header;icon-container{text-align:center;margin-block:-1rem -2rem;translate:0 -100%}}card-lead{grid-area:card-lead}card-body{grid-area:card-body;align-content:center}card-footer{text-align:left;grid-area:card-footer;align-items:start}}}product-card{display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;gap:0;width:calc((var(--content-max-width) - 2rem) / 3);width:100%;background-color:var(--ke-beige-light);border-radius:var(--corner-radius);text-align:center;padding:1rem;card-body{flex-grow:1}card-footer{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding-top:2rem}icon-container{display:inline-block;background-color:var(--accent-color);border-radius:100vh;width:5.5rem;height:5.5rem;align-content:center;margin-block:-1rem -2rem;translate:0 -50%;svg.icon{height:2rem}}ul.contract-term{list-style:none;padding:0;display:inline-flex;gap:0;border:solid 1px var(--accent-color);li{&:not(:last-of-type){border-right:solid 1px var(--accent-color)}label{text-align:center;position:relative;width:100%;display:block;white-space:nowrap;--background-color: var(--accent-color);background-color:var(--ke-beige-light);padding-inline:1ch;cursor:pointer;min-width:8ch;font-weight:var(--bold)}input{appearance:none;position:absolute;&:checked+label{background-color:var(--accent-color)}}}}table{margin:auto;width:calc(100% - 4rem)!important;border-collapse:collapse;tr{display:flex;gap:0;td{border-bottom:solid 1px var(--ke-black)}&:nth-of-type(3)~&{td{border-color:transparent}}&:nth-of-type(4){td{padding-top:.5rem}}td{flex-grow:1;padding-block:0;&:not(:has(label,input)){padding-block:.5rem}&:first-child{text-align:left}&:last-child{text-align:right}label{cursor:pointer;display:inline-block;width:100%;align-content:center}}}}.button{--background-color: var(--brand-color);&:focus,&:hover{--color: var(--brand-color);--background-color: var(--ke-black)}}.price-info{display:inline-flex;flex-wrap:wrap;gap:0;>*{margin:0;text-wrap:nowrap}>:nth-child(1){flex-grow:1}>:nth-child(2){flex-basis:8ch}>:nth-child(3){flex-basis:100%}.h5{margin:0}}.price{font-variant-numeric:tabular-nums}&:has(~:not(script)){margin-bottom:2rem}}@container (width <= 920px){hero-section product-card{display:flex!important;flex-direction:column;.contract-term,card-body,card-footer>span,card-footer>a.button{position:absolute;display:none!important}}}}.image-slider{width:100%;margin:auto;overflow-x:visible;overflow-y:clip;position:relative;height:100%;.ccm-image-slider-container{>*>*>*>*,>*>*>*,>*>*,>*,&{height:100%}.ccm-image-slider{.ccm-image-slider-inner{ul.rslides{background-color:var(--accent-color);@container (width <= 920px){li{&:not([style]){visibility:hidden}background-color:var(--accent-color);display:flex;flex-direction:column-reverse;.hero-content{height:55%;flex-grow:1}.image{position:relative;height:45%;flex-shrink:1;img{object-fit:cover;height:100%;border-radius:0}&:after{content:"";position:absolute;inset:0;display:block;pointer-events:none;background-image:url(../../images/mobile-hero-overlay.svg);background-repeat:no-repeat;background-position:bottom right;background-size:cover;z-index:88}}.control{display:flex;flex-direction:row;width:100%;justify-content:space-around}}}@container (width > 920px){&:not(:has(>:nth-child(2))){.control{display:none}}li{.hero-content{>*{flex-basis:unset;flex-grow:0}justify-content:center;gap:2.5rem;.number{padding-top:.5rem;display:inline-block;width:108px;text-align:center}}.image{background-color:var(--accent-color-a11y);position:absolute;height:var(--brand-shape-height);top:var(--brand-shape-offset);translate:0 calc(var(--brand-shape-offset) * -1);clip-path:var(--brand-shape);width:var(--brand-shape-width);left:calc(var(--padding-inline-auto) + var(--brand-shape-offset-x));img{border-radius:0;position:absolute;right:0;height:100%;width:100%;object-fit:cover}}}}}}}}.rslides{overflow-x:visible;overflow-y:clip}.rslides_nav{display:none}}.news_1_2{.ccm-block-page-list-pages{grid-template-columns:1fr 1fr;grid-template-columns:repeat(auto-fill,minmax(min(28rem,calc(100% - 1rem)),1fr));display:grid;gap:1rem;.blocks{padding:2rem 1.5rem;display:flex;border-radius:1rem;background-color:var(--ke-yellow);margin:0;a{display:flex;flex-direction:column;justify-content:center;height:100%}.image{display:none}&:first-child{grid-row-start:1;grid-row-end:3;padding:0;overflow:hidden;background-color:var(--ke-beige-light);.image{width:50%;display:block;background-size:cover;background-position:center;background-color:var(--ke-yellow)}.ccm-block-page-list-page-entry-text{padding:2rem 1.5rem;width:50%}}&:last-child{padding:0;overflow:hidden;background-color:var(--ke-beige-light);.ccm-block-page-list-page-entry-text{padding:2rem 1.5rem;width:60%}.image{width:40%;display:block;background-image:url(../../images/salamat.svg)!important;position:relative;right:0;bottom:0;height:100%;background-size:auto;background-position:bottom right;background-repeat:no-repeat}}}}}.news_all{.ccm-block-page-list-pages{grid-template-columns:repeat(auto-fill,minmax(min(24rem,calc(100% - 1rem)),1fr));display:grid;gap:1rem;.blocks{display:flex;flex-direction:column;border-radius:1rem;background-color:var(--ke-beige-light);overflow:hidden;margin:0;a{display:flex;flex-direction:column;justify-content:center;height:100%;.image{height:213px;width:100%;display:block;background-size:cover;background-position:center;background-color:var(--ke-beige-dark)}.block-text{padding:2rem 1.5rem}}}}}.ccm-page{.ccm-area:has(.ccm-block-top-navigation-bar){margin:0 auto;width:100%}.ccm-block-top-navigation-bar{@container (width > 920px){flex-grow:1;ul.navbar-nav{padding:0;&,ul{list-style:none}height:100%;margin:auto;display:flex;flex-direction:row;justify-content:center;align-content:stretch;gap:0;li.nav-item{height:100%;white-space:nowrap;&:has(.dropdown-menu):focus-within,&:has(.dropdown-menu):hover{>a span[data-label]:before{font-weight:var(--semibold);letter-spacing:-.025ch}.icon{transform:rotateX(180deg)}}&:hover{>a+.dropdown-menu{visibility:visible;transition-delay:var(--instant);opacity:1;z-index:1}}>a{height:calc(100% - 10px);margin-block:5px;padding-inline:1rem}a{height:calc(100% - 10px);margin-block:5px;display:block;align-content:center;&:focus,&:hover,&.active,&.activeParent{span[data-label]:before{font-weight:var(--semibold);letter-spacing:-.025ch;transition-duration:0s}}+.dropdown-menu:has(a.active),&.active+.dropdown-menu{visibility:visible;transition-delay:var(--instant);opacity:1}+.dropdown-menu:focus-within,&:focus+.dropdown-menu{visibility:visible;transition-delay:var(--instant);opacity:1;z-index:10}span[data-label]{position:relative;visibility:hidden;display:inline-block;&:before{content:attr(data-label);visibility:visible;position:absolute;height:100%;left:50%;top:0;align-content:center;translate:-50%;transition-property:font-weight,letter-spacing}}}&:has(a.active)>a{&,&:has(+.dropdown-menu a.active){.icon{transform:rotateX(180deg)}}}.dropdown-menu{transition-property:opacity,visibility,z-index;transition-duration:var(--instant);transition-delay:1s;visibility:hidden;opacity:0;display:flex;position:absolute;width:100%;left:0;border-top:1px solid var(--ke-black);background-color:var(--ke-beige);justify-content:center;gap:2.5rem;a{padding-block:calc(.75rem - 5px)}}}}}@container (width <= 920px){ul.navbar-nav{&:not(.expanded){display:none}background-color:var(--ke-beige);position:absolute;top:100%;margin:0;width:100%;left:0;padding-inline:1rem;&,ul{list-style:none}ul{padding-left:2rem}li{a{height:48px;align-content:center;display:block;svg.icon{display:none}}}}}}}.ccm-page{.container{&:not(:has(.wtf-block-featured-content:not([class$=wtf-block-featured-content]))){column-gap:2rem}&:has(layout-column icon-container){layout-column:has(.wtf-block-featured-content){padding-block-start:3rem}}.wtf-block-featured-content{div,h2,h3,p{margin:0;padding:0}}&:has(layout-column:nth-of-type(2):last-of-type),&:has(layout-column:nth-of-type(1):last-of-type){.wtf-block-featured-content{container-type:size;display:flex;flex-direction:column;justify-content:center;>.title{padding-block-start:3rem}&:has(icon-container){>.title{padding-block-start:4rem}}>:last-child{padding-block-end:3rem}height:min-content;min-height:520px;max-height:600px;align-content:center;overflow:clip;icon-container{position:absolute;translate:2rem -50%;margin:0;&:has(use[href="#temperature-arrow-down"]){background-color:var(--ke-orange);.link{--accent-color: var(--ke-orange)}}}.image{width:calc(100% / 1.5);height:var(--brand-shape-height);height:100%;background:green;clip-path:var(--brand-shape);position:absolute;right:0;top:var(--brand-shape-offset);top:0;>:is(picture,img){position:absolute;top:var(--brand-shape-inner-top);top:50%;translate:0 var(--brand-shape-inner-translate);translate:0 -50%;width:100%;height:100cqh;height:100%;object-fit:cover;object-position:right;border-radius:0 1rem 1rem 0}}.link,.title,.content{padding-inline:4.5rem;position:relative}.title{padding-inline-end:53%}.content{padding-inline-end:63%}}}&:has(layout-column:nth-of-type(2):last-of-type){.wtf-block-featured-content{min-height:440px;justify-content:start;.image{>:is(picture,img){object-position:left}}.link,.title,.content{padding-inline:3rem}&:has(.image) .title{padding-inline-end:35%}&:has(.image) .content{flex-grow:1;padding-inline-end:45%}}}&:has(layout-column:nth-of-type(3):last-of-type){product-card{@container (width < 1200px){margin-bottom:5rem}}.wtf-block-featured-content{@container (width < 1200px){margin-bottom:3rem}justify-content:start;&:not([class$=wtf-block-featured-content]){padding-block:4rem 3rem;padding-inline:2rem;&:has(.content:empty){text-align:center;align-items:center}}}}&:has(layout-column:nth-of-type(4):last-of-type){.wtf-block-featured-content{justify-content:start;&:not([class$=wtf-block-featured-content]){padding-block:4rem 3rem;padding-inline:2rem}}}}.wtf-block-featured-content{+.wtf-block-featured-content{margin-top:1rem}width:100%;position:relative;display:inline-flex;flex-direction:column;justify-content:center;--background-color: transparent;background-color:var(--background-color);border-radius:1rem;&:not([class$=wtf-block-featured-content]) icon-container{text-align:center;translate:0 -100%}.image{width:40%;position:absolute;top:0;right:0}&.beige{--background-color: var(--ke-beige);icon-container{--accent-color: var(--default-brand-color);--background-color: var(--accent-color);background-color:var(--background-color)}}&.dark{--background-color: var(--ke-beige-dark);icon-container{--background-color: var(--accent-color)}}&.light{--background-color: var(--ke-beige-light);icon-container{--background-color: var(--ke-beige)}button{--background-color: var(--accent-color)}}&.orange{--background-color: var(--ke-orange);--accent-color: var(--ke-yellow);.button,icon-container{--background-color: var(--accent-color);&.button:focus,&.button:hover{background-color:var(--ke-black);color:var(--background-color)}}}&.turquoise{--background-color: var(--ke-turquoise);--accent-color: var(--ke-yellow);.button,icon-container{--background-color: var(--ke-yellow);&.button:focus,&.button:hover{background-color:var(--ke-black);color:var(--background-color)}}}&.yellow{--background-color: var(--ke-yellow);--accent-color: var(--ke-turquoise);.button,icon-container{--background-color: var(--ke-turquoise);&.button:focus,&.button:hover{background-color:var(--ke-black);color:var(--background-color)}}}}icon-container:has(+[class$=wtf-block-featured-content]){--background-color: transparent;background-color:var(--background-color);translate:-25% 0}hero-section icon-container{background-color:var(--ke-beige)}}
/*# sourceMappingURL=main.css.map */