/* HYDRO ELECTRICA — static rebuild of hydro-electrica.com.
   Geometry mirrors the live WordPress computed styles (reference/style-probe.json).
   NOTE: no global border-box reset — the WP column widths resolve %-flex-basis against
   content-box and the flex-shrink math depends on it. Only elements that pair an explicit
   width with padding opt into border-box. */

@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/inter-var.woff2) format("woff2")}
@font-face{font-family:Jost;font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/jost-var.woff2) format("woff2")}

:root{
 --base:#EBEBEF;--base2:#DCE0E6;--contrast:#1C2930;--contrast2:#37505d;--contrast3:#96A5B2;--white:#fff;
 --fh:Inter,sans-serif;--fb:Jost,sans-serif;
 --fs-s:1rem;--fs-m:1.2rem;
 --fs-l:clamp(1.5rem, 1.5rem + ((1vw - 0.2rem) * 0.833), 2rem);
 --fs-xl:clamp(2rem, 2rem + ((1vw - 0.2rem) * 1.083), 2.65rem);
 --fs-xxl:clamp(2.65rem, 2.65rem + ((1vw - 0.2rem) * 1.417), 3.5rem);
 --sp10:1rem;--sp20:min(1.5rem,2vw);--sp30:min(2.5rem,3vw);--sp40:min(4rem,5vw);--sp50:min(6.5rem,8vw);--sp60:min(10.5rem,13vw);
 --gap:1.2rem;
}

body{margin:0;background:var(--base);color:var(--contrast);font-family:var(--fb);font-size:var(--fs-m);font-weight:400;line-height:1.55}
h1,h2,h3{color:var(--contrast);font-family:var(--fh);font-weight:400;letter-spacing:0;line-height:1.2;margin:0}
h1{font-size:var(--fs-xxl);line-height:1.15}
h2{font-size:var(--fs-xl)}
h3{font-size:var(--fs-l)}
p,ul,figure{margin:0}
img{max-width:100%;height:auto;vertical-align:bottom}
a{color:var(--contrast);text-decoration:underline}
a:hover{text-decoration:none}
:focus-visible{outline:2px solid var(--contrast2);outline-offset:2px}
.tc{text-align:center}
.skip{position:absolute;left:-9999px;top:auto;overflow:hidden}
.skip:focus{left:8px;top:8px;background:var(--white);padding:1rem;z-index:100001}

/* ---------- hero (WP cover block) ---------- */
.hero{position:relative;display:flex;justify-content:center;align-items:flex-start;min-height:1100px;overflow:clip;background-position:50%}
.hero-bg{position:absolute;inset:0;background:url(../img/bg-jpeg.avif) 50% 50%/cover no-repeat;background-attachment:fixed}
.hero-shade{position:absolute;inset:0;opacity:.5;background:linear-gradient(354deg,rgb(28,41,48) 33%,rgba(255,255,255,0) 71%,rgba(255,255,255,.54) 100%)}
.hero-inner{position:relative;width:100%;box-sizing:border-box;padding-left:var(--sp50);padding-right:var(--sp50);color:var(--white)}
.hero h1,.hero h2{color:inherit}

.topbar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:0;padding-top:var(--sp30);padding-bottom:var(--sp30);color:var(--base)}
.topbar a{color:var(--base)}
.logo{display:block}

.mainnav{font-weight:500}
.nav-open{display:none}
.nav-list{display:flex;justify-content:flex-end;align-items:center;gap:var(--gap);list-style:none;margin:0;padding:0}
.nav-list a{color:var(--white);text-decoration:none}
.nav-list a:hover{text-decoration:underline}
.nav-close{display:none}

.hero-cols{display:flex;flex-wrap:wrap;padding-top:var(--sp20);padding-bottom:var(--sp20);align-items:flex-end;gap:0}
.hc1{flex:0 1 70%}
.hc2{flex:0 1 60%}
.hero-title{font-size:var(--fs-xl);line-height:1.2;text-align:center;padding-top:var(--sp20);padding-bottom:var(--sp20)}

.btn-row{display:flex;flex-wrap:wrap;justify-content:center;gap:0;margin-top:var(--sp20);margin-bottom:var(--sp20)}
.btn-w{width:calc(50% - .6rem)}
.btn{display:inline-block;width:100%;box-sizing:border-box;background:transparent;border:1px solid currentColor;border-radius:30px;color:currentColor;cursor:pointer;font-family:var(--fh);font-size:var(--fs-m);font-weight:500;letter-spacing:.1rem;line-height:inherit;padding:var(--sp10) 0;text-align:center;text-decoration:none;text-transform:uppercase}
.btn:hover{background:var(--contrast2);border-color:var(--contrast2);color:var(--base)}

.badges{display:flex;flex-wrap:nowrap;justify-content:center;gap:var(--sp20)}
.badges img{width:150px;border-radius:var(--sp20)}

.hero-big{font-family:var(--fh);font-size:var(--fs-xxl);line-height:1.15;text-align:right;color:inherit}
.here-row{padding:var(--sp10) var(--sp50);display:flow-root}
.herefig{float:right}

/* ---------- shared layout ---------- */
main{display:flow-root;margin-top:var(--gap)}
.cols{display:flex;flex-wrap:wrap}
.cols>*{min-width:0}
@media(min-width:782px){.cols{flex-wrap:nowrap}.hero-cols{flex-wrap:nowrap}}
@media(max-width:781px){.cols>*,.hero-cols>*{flex-basis:100%!important}}
.sp{display:block}
.wide{max-width:1280px;margin-left:auto;margin-right:auto}

.asterisk::before{content:"";display:block;width:1.5rem;height:3rem;background:var(--contrast2);clip-path:path('M11.93.684v8.039l5.633-5.633 1.216 1.23-5.66 5.66h8.04v1.737H13.2l5.701 5.701-1.23 1.23-5.742-5.742V21h-1.737v-8.094l-5.77 5.77-1.23-1.217 5.743-5.742H.842V9.98h8.162l-5.701-5.7 1.23-1.231 5.66 5.66V.684h1.737Z')}
.asterisk.tc::before{margin:0 auto}

.imgfig{display:table;margin-left:auto;margin-right:auto;text-align:center}
figcaption{display:table-caption;caption-side:bottom;margin-top:.5em;margin-bottom:1em;color:var(--contrast2);font-family:var(--fb);font-size:.8rem}
.rounded img{border-radius:var(--sp20)}

/* ---------- sections ---------- */
.sec-company{margin-top:var(--sp50);margin-bottom:var(--sp50);padding:var(--sp40) var(--sp30)}
.cols-company{align-items:flex-start;gap:var(--sp40)}
.cc-img{flex:0 1 60%}
.cc-txt{flex:0 1 70%}
.cc-txt>*+*{margin-block-start:var(--sp30)}
.cols-half{gap:0}
.cols-half>div{flex:1 1 0}

.sec-services{box-sizing:border-box;width:min(1280px,calc(100% - 2*var(--sp50)));margin:var(--sp50) auto;padding:var(--sp40) var(--sp30)}
.sec-services>*+*{margin-block-start:var(--sp30)}
/* WP constrained layout caps non-aligned children at content-size 620px */
.intro{display:flex;flex-direction:column;align-items:center;gap:var(--sp30);max-width:620px;margin-left:auto;margin-right:auto}
.svc-row{gap:0 var(--sp50)}
.svc-txt{flex:0 1 40%;align-self:center}
.svc-txt>*+*{margin-block-start:var(--sp30)}
.svc-txt2{flex:0 1 40%;align-self:center}
.svc-txt2>*+*{margin-block-start:var(--gap)}
.svc-img{flex:0 1 50%}
.checklist{list-style-type:"✓";padding-inline-start:1rem}
.checklist li{padding-inline-start:1ch}

.sec-features{background:var(--base2);margin-top:var(--sp50);margin-bottom:var(--sp50);padding:var(--sp50) var(--sp30)}
.sec-features>*+*{margin-block-start:var(--sp30)}
.feat-row{gap:0}
.feat-row>div{flex:1 1 0;padding-left:var(--sp30);padding-right:var(--sp30)}
.feat-row>div>*+*{margin-block-start:var(--sp10)}
.feath{font-family:var(--fb);font-size:var(--fs-m);font-weight:600;line-height:1.2;text-align:left}

.sec-app,.sec-plc{margin-top:var(--sp50);margin-bottom:var(--sp50);padding:var(--sp40)}
.sec-app>*+*,.sec-plc>*+*{margin-block-start:var(--sp30)}
.cols-app{gap:0 var(--sp30);padding-right:var(--sp10);padding-left:var(--sp60)}
.app-txt{flex:0 1 50%;padding-left:var(--sp40);padding-right:var(--sp40);align-self:stretch}
.app-img{flex:0 1 60%;align-self:center}
.plc-img{flex:0 1 60%;align-self:center}
.plc-txt{flex:0 1 50%;padding-left:var(--sp20);padding-right:var(--sp20);align-self:stretch}
.stack{display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;gap:var(--sp40)}
.stack-plc{gap:var(--sp30)}

.sec-partners{background:var(--base2);margin-top:var(--sp30);margin-bottom:var(--sp30);padding:var(--sp40) var(--sp60)}
.sec-partners>*+*{margin-block-start:var(--sp30)}
.logo-row{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--sp40)}
.plogo img{width:150px;aspect-ratio:4/3;object-fit:contain}

.sec-contact{margin-top:var(--sp40);margin-bottom:var(--sp40);padding:var(--sp40) var(--sp60)}
.sec-contact>*+*{margin-block-start:var(--sp40)}
.card{background:var(--base2);border-radius:30px;margin-top:var(--sp40);margin-bottom:var(--sp40);padding:var(--sp40);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--sp30)}
.card-info{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp20);font-style:normal}
.card-info p{font-size:var(--fs-l);text-align:left}
.card-info a{color:var(--contrast)}
a.tel{color:inherit;text-decoration:none}
.card iframe{border:0;max-width:100%}

/* ---------- footer ---------- */
.foot{margin-top:var(--gap);padding:var(--sp50) var(--sp50)}
.foot-cols{gap:var(--gap)}
.f1{flex:0 1 30%;align-self:center}
.f1 p{color:var(--contrast2)}
.f-sp{flex:0 1 20%}
.f3{flex:0 1 30%;align-self:center}
.foot-groups{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:var(--gap)}
.fg{display:flex;flex-direction:column;align-items:stretch;gap:var(--gap)}
.fg h2{font-family:var(--fb);font-size:var(--fs-m);font-weight:600;line-height:1.2}
.fg ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp10);font-size:var(--fs-s)}
.fg a{color:var(--contrast);text-decoration:none}
.fg a:hover{text-decoration:underline}

/* ---------- mobile nav overlay (<600px, like WP responsive navigation) ----------
   Live-site bug fix: the WP overlay renders white links on the white overlay
   (invisible menu, verified 2026-07-22). Same overlay, readable contrast links. */
@media(max-width:599.9px){
 .nav-open{display:flex;align-items:center;background:none;border:0;padding:0;margin:0;color:var(--white);cursor:pointer}
 .nav-open svg{fill:currentColor}
 .nav-modal{display:none}
 .nav-modal.open{display:flex;flex-direction:column;position:fixed;inset:0;z-index:100000;background:var(--white);color:var(--contrast);padding:16px 30px;overflow:auto}
 .nav-modal.open .nav-list{flex-direction:column;align-items:flex-end;gap:var(--gap);padding-top:calc(24px + var(--gap))}
 .nav-modal.open a{color:var(--contrast)}
 .nav-close{display:block;position:absolute;top:16px;right:30px;background:none;border:0;padding:0;margin:0;color:var(--contrast);cursor:pointer}
 .nav-close svg{fill:currentColor}
 body.menu-open{overflow:hidden}
}

/* ---------- privacy / 404 ---------- */
.plain{max-width:620px;margin:0 auto;padding:0 var(--sp50)}
.plain>*+*{margin-block-start:var(--gap)}
.plain h2{margin-top:var(--sp30)}
.sep{border:0;border-top:2px solid currentColor;opacity:.4;width:100%;margin:var(--sp30) 0 0}
.center-page{min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp20);text-align:center;padding:var(--sp40)}