/*
Theme Name: HeraComm NUTS - Layout Energia Smart
Version: 10.0
Description: Landing senza navigazione, grafica basata sul riferimento fornito; API Hera da integrare.
*/
*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:'Circular Std',Arial,sans-serif;color:#333} .hera-header{height:56px;background:#e54197;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;padding:0 max(6.8%,24px);gap:12px}.agency-logo{width:110px;height:48px;object-fit:contain;object-position:left center;display:block}.authorized{color:#fff;text-align:center;font-size:10px;letter-spacing:1.2px;font-weight:800;text-transform:uppercase;white-space:nowrap}.hera-logo{width:103px;height:44px;object-fit:contain;justify-self:end}.hero{height:300px;position:relative;background-image:url('assets/hero.jpg');background-size:cover;background-position:center 41%;overflow:hidden}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.42),transparent 65%)}.hero-copy{position:absolute;left:6.8%;top:105px;color:#fff;max-width:850px}.hero-copy h1{font-size:43px;line-height:1.08;letter-spacing:-1px;margin:0 0 7px;font-weight:800}.hero-copy p{font-size:27px;line-height:1.25;margin:0;font-weight:400}.lead{height:266px;background:#fff;text-align:center;padding:52px 15px 28px}.lead h2{font-size:23px;line-height:1.2;margin:0 0 12px;font-weight:800}.lead p{font-size:15px;line-height:1.3;color:#666;margin:0 auto 31px;max-width:420px;font-weight:400}.lead strong{font-weight:400}.cta{display:inline-block;border:0;background:transparent;padding:0;cursor:not-allowed;opacity:1}.cta img{display:block;width:171px;height:auto;filter:drop-shadow(0 5px 7px rgba(191,35,124,.25))}.footer{height:218px;border-top:2px solid #e54197;background:#1b1b1b;color:#aaa;text-align:center;padding:39px 15px 15px;font-size:10px;line-height:1.5}.footer .company{font-size:10px;font-weight:800;color:#fff}.footer .legal{margin-top:2px}.footer .links{margin-top:28px}.footer a{color:#eee;text-decoration:underline}.footer .note{font-size:9px;color:#666;margin:17px auto 0;max-width:720px;line-height:1.35}
/* Responsive layout: preserves the desktop reference while adapting every section. */
html{-webkit-text-size-adjust:100%}body{min-width:0;overflow-x:hidden}
img{max-width:100%}.hero-copy{right:6.8%;max-width:calc(100% - 13.6%)}
.hero-copy p{max-width:760px}.lead{height:auto;min-height:266px}.footer{height:auto;min-height:218px}
@media(max-width:900px){
 .hera-header{padding-inline:4%;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
 .hero-copy{left:5%;right:5%;max-width:90%}.hero-copy h1{font-size:clamp(32px,5vw,43px)}
 .hero-copy p{font-size:clamp(19px,3.2vw,27px);max-width:620px}
}
@media(max-width:600px){
 .hera-header{height:72px;padding:8px 12px;gap:7px;grid-template-columns:minmax(0,1fr) minmax(95px,1.15fr) minmax(0,1fr)}
 .agency-logo{width:100%;max-width:105px;height:52px;object-position:left center}
 .authorized{font-size:clamp(7px,2.05vw,10px);line-height:1.25;letter-spacing:.45px;white-space:normal;text-align:center}
 .hera-logo{width:100%;max-width:99px;height:48px;object-position:right center}
 .hero{height:300px;background-position:61% center}
 .hero:before{background:linear-gradient(90deg,rgba(0,0,0,.68) 0%,rgba(0,0,0,.36) 65%,rgba(0,0,0,.06) 100%)}
 .hero-copy{top:50%;transform:translateY(-50%);left:7%;right:7%;max-width:86%}
 .hero-copy h1{font-size:clamp(30px,8.5vw,40px);line-height:1.1;letter-spacing:-.5px;margin-bottom:9px}
 .hero-copy p{font-size:clamp(18px,5vw,23px);line-height:1.3;max-width:330px}
 .lead{min-height:270px;padding:46px 20px 45px}
 .lead h2{font-size:23px;margin-bottom:13px}
 .lead p{font-size:15px;line-height:1.45;margin-bottom:28px;max-width:355px}
 .desktop-only{display:none}
 .cta img{width:171px;max-width:100%}
 .footer{padding:32px 18px 30px;font-size:11px;line-height:1.6}
 .footer .company{font-size:11px}.footer .links{margin-top:24px;line-height:1.8}
 .footer .note{font-size:10px;margin-top:16px;max-width:350px}
}
@media(max-width:360px){
 .hera-header{height:66px;padding-inline:8px;gap:3px;grid-template-columns:minmax(0,1fr) minmax(90px,1.2fr) minmax(0,1fr)}
 .agency-logo{max-width:88px}.hera-logo{max-width:84px}.authorized{font-size:7px;letter-spacing:.1px}
 .hero{height:270px;background-position:62% center}
 .hero-copy h1{font-size:29px}.hero-copy p{font-size:18px}
 .lead{padding-inline:15px}
}

/* Mobile layout verified against actual theme selectors */
@media(max-width:600px){
 .hera-header{height:auto;min-height:78px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"agency hera" "authorized authorized";gap:0 10px;padding:8px 15px 9px}
 .agency-logo{grid-area:agency;max-width:108px;width:100%;height:40px;object-fit:contain;object-position:left center}
 .hera-logo{grid-area:hera;max-width:100px;width:100%;height:40px;object-fit:contain;object-position:right center;justify-self:end}
 .authorized{grid-area:authorized;font-size:9px;line-height:1.25;letter-spacing:1px;white-space:normal;text-align:center;padding-top:2px}
 .hero{height:270px;background-position:58% center}
 .hero-copy{left:6%;right:6%;max-width:88%;top:50%;transform:translateY(-50%)}
 .hero-copy h1{font-size:clamp(29px,8vw,38px)}
 .hero-copy p{font-size:clamp(17px,4.7vw,22px);max-width:290px}
 .lead{height:auto;min-height:255px;padding:42px 18px 40px}
 .lead p{max-width:340px}
 .footer{height:auto;min-height:218px;padding:30px 16px}
}
@media(max-width:360px){.hera-header{grid-template-columns:1fr 1fr}.hero{height:255px}.hero-copy h1{font-size:29px}}

/* CTA: clickable, subtle hover and keyboard focus; API integration pending */
.cta{cursor:pointer;opacity:1;display:inline-block;border:0;background:transparent;transition:transform .22s ease,filter .22s ease;transform-origin:center;touch-action:manipulation}
.cta:hover{transform:scale(1.08);filter:brightness(1.06)}
.cta:active{transform:scale(.97)}
.cta:focus-visible{outline:3px solid #e54197;outline-offset:5px;border-radius:22px}
.hera-dialog{max-width:min(92vw,430px);border:0;border-radius:14px;padding:0;box-shadow:0 15px 55px #0004;color:#333;font:inherit}
.hera-dialog::backdrop{background:rgba(0,0,0,.55)}
.hera-dialog-inner{padding:32px 25px 25px;text-align:center;position:relative}
.hera-dialog h3{font-size:23px;margin:0 0 14px}.hera-dialog p{font-size:14px;line-height:1.5;color:#555}
.hera-dialog-close{position:absolute;right:12px;top:8px;background:none;border:0;font-size:28px;cursor:pointer;color:#555}
.hera-dialog-ok{background:#e54197;color:#fff;border:0;border-radius:20px;padding:10px 25px;margin-top:12px;cursor:pointer}
@media(hover:none){.cta:hover{transform:none;filter:none}}
@media(prefers-reduced-motion:reduce){.cta{transition:none}}

/* Desktop/laptop: show more of the top of the original Hera photograph. Mobile rules remain unchanged. */
@media(min-width:901px){.hero{background-position:center 15%}}
@media(min-width:601px) and (max-width:900px){.hero{background-position:center 15%}}

/* Pagine informative: layout responsive coerente con la landing */
.policy-page{background:#fff;min-height:55vh;padding:48px 24px 76px}.policy-inner{max-width:860px;margin:0 auto}.policy-back{font-size:14px;color:#b51b70;text-decoration:none}.policy-page h1{font-size:34px;color:#252525;margin:28px 0 24px}.policy-content{font-size:15px;line-height:1.75;color:#444}.policy-content h2{font-size:21px;line-height:1.35;color:#242424;margin:32px 0 10px}.policy-content p,.policy-content ul{margin:0 0 15px}.policy-content a{color:#b51b70;text-decoration:underline}.policy-content .policy-warning{padding:15px 18px;background:#fff4fa;border-left:4px solid #e54197;margin-bottom:25px}.footer .links a{color:#eee;text-decoration:underline}@media(max-width:600px){.policy-page{padding:30px 18px 54px}.policy-page h1{font-size:28px}.policy-content{font-size:14px}.policy-content h2{font-size:19px}}
