:root{--green:#237a45;--green-dark:#15562f;--ink:#17201b;--muted:#5f6862;--soft:#f3f6f4;--white:#fff;--line:#dce4de;--radius:20px;--shadow:0 16px 45px rgba(18,43,28,.11)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;color:var(--ink);font:16px/1.65 system-ui,-apple-system,"Segoe UI",sans-serif;background:#fff}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button,input,select,textarea{font:inherit}
.wrap{width:min(1160px,calc(100% - 40px));margin:auto}
.narrow{max-width:880px}
.section{padding:96px 0}
.skip-link{position:fixed;z-index:1000;top:12px;left:12px;padding:12px 16px;background:#fff;transform:translateY(-150%)}
.skip-link:focus{transform:none}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.95);border-bottom:1px solid rgba(220,228,222,.9);backdrop-filter:blur(12px)}
.header-inner{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{flex-shrink:0}.brand img{width:240px;height:auto}
.site-header nav{display:flex;align-items:center;gap:22px}
.site-header nav a{flex-shrink:0;text-decoration:none;font-size:.92rem;font-weight:700;white-space:nowrap}
.nav-cta{padding:11px 17px;border-radius:999px;background:var(--green);color:#fff}
.menu-toggle{display:none;border:0;background:none;padding:12px}
.menu-toggle span:not(.sr-only){display:block;width:25px;height:2px;background:var(--ink);margin:5px}
.hero{min-height:690px;display:grid;align-items:center;color:#fff;background-image:linear-gradient(118deg,rgba(74,24,48,.76) 0%,rgba(77,29,84,.46) 55%,rgba(28,16,32,.28) 100%),url(../assets/images/ristrutturazione-tetto.webp);background-repeat:no-repeat;background-size:135% auto;background-position:58% 10%}
.hero-content{padding-top:76px;padding-bottom:76px}
.hero h1{max-width:800px;margin:8px 0 20px;font-size:clamp(2.7rem,6vw,5.4rem);line-height:1.02;letter-spacing:-.055em}
.hero h2{max-width:850px;margin:0 0 18px;font-size:clamp(1.25rem,2.4vw,2rem);line-height:1.28}
.hero p:not(.eyebrow){max-width:790px;font-size:1.12rem}
.eyebrow{margin:0 0 8px;color:#49b873;font-size:.82rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.hero .eyebrow{font-size:1.375rem;font-weight:800;letter-spacing:.12em;white-space:nowrap}
.button{display:inline-flex;min-height:50px;align-items:center;justify-content:center;margin-top:16px;padding:13px 24px;border:0;border-radius:12px;background:var(--green);color:#fff;text-decoration:none;font-weight:800;box-shadow:0 8px 22px rgba(35,122,69,.25);cursor:pointer}
.button:hover{background:var(--green-dark)}
:focus-visible{outline:3px solid #65d792;outline-offset:3px}
.intro{font-size:1.18rem}
.intro p:first-child{font-weight:650}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
.section h2{margin:0 0 22px;font-size:clamp(2rem,4vw,3.35rem);line-height:1.08;letter-spacing:-.04em}
@property --service-icon-bg-start{syntax:"<color>";inherits:false;initial-value:#252525}
@property --service-icon-bg-end{syntax:"<color>";inherits:false;initial-value:#252525}
.service-icon{--service-icon-bg-start:#252525;--service-icon-bg-end:#252525;display:block;width:94px;height:94px;margin:0 0 16px;padding:27px;border-radius:50%;background:linear-gradient(135deg,var(--service-icon-bg-start),var(--service-icon-bg-end));object-fit:contain;transition:--service-icon-bg-start .22s ease,--service-icon-bg-end .22s ease}
.service ul{padding:0;list-style:none}
.service li{position:relative;margin:10px 0;padding-left:28px}
.service li:before{content:"✓";position:absolute;left:0;color:var(--green);font-weight:900}
.image-stack{display:grid;gap:18px}
.image-stack img{width:100%;border-radius:var(--radius);box-shadow:var(--shadow);aspect-ratio:16/10;object-fit:cover}
.gallery{display:grid;grid-template-columns:repeat(4,1fr)}
.gallery img{width:100%;aspect-ratio:1/1;object-fit:cover}
.roof-divider{height:360px;background-image:linear-gradient(118deg,rgba(74,24,48,.76) 0%,rgba(77,29,84,.46) 55%,rgba(28,16,32,.28) 100%),url(../assets/images/tetto-in-tegole.webp);background-position:center;background-size:cover;background-attachment:fixed;background-repeat:no-repeat}
.alternate,.reviews{background:var(--soft)}
.section-heading{max-width:900px;margin-bottom:45px}
.line-vita-scope{margin-top:18px;padding:16px 18px;border-left:3px solid var(--green);border-radius:0 10px 10px 0;background:var(--soft);font-weight:650}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.cards.three{grid-template-columns:repeat(3,1fr)}
.cards article,.cards blockquote{margin:0;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:0 10px 30px rgba(18,43,28,.06)}
.cards article>img:not(.service-icon){width:100%;aspect-ratio:16/10;object-fit:cover}
.cards article .card-service-icon{width:94px;height:94px;margin:22px 25px 0;padding:27px;background:linear-gradient(135deg,var(--service-icon-bg-start),var(--service-icon-bg-end))}
.cards article .card-service-icon+h3{padding-top:14px}
.cards article h3{margin:0;padding:25px;font-size:1.28rem}
.cards blockquote{padding:28px}
.cards blockquote footer{margin-top:20px;color:var(--muted);font-weight:750}
.contact{background:#17201b;color:#fff}
.form-wrap{max-width:980px}
.form-intro{max-width:760px}
.contact .form-intro .service-icon{background:linear-gradient(135deg,var(--service-icon-bg-start),var(--service-icon-bg-end))}
form{margin-top:38px;padding:clamp(24px,4vw,48px);border:1px solid rgba(255,255,255,.15);border-radius:24px;background:#fff;color:var(--ink);box-shadow:var(--shadow)}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
.field label{font-weight:750}
.field input,.field select,.field textarea{width:100%;min-height:52px;padding:13px 14px;border:1px solid #aebbb2;border-radius:11px;background:#fff;color:var(--ink)}
.field textarea{resize:vertical}
.field input[aria-invalid="true"],.field select[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:#a42121}
.error{min-height:1.25em;color:#a42121;font-size:.88rem}
.privacy{display:grid;grid-template-columns:24px 1fr;align-items:start}
.privacy input{min-height:auto;width:21px;height:21px;margin-top:3px}
.privacy .error{grid-column:2}
.submit{width:100%;margin-top:22px}
.demo-note{color:var(--muted);font-size:.9rem}
.form-status{font-weight:750;color:var(--green-dark)}
.hp-field{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important}
.submit:disabled{cursor:wait;opacity:.65}
.site-footer{padding:65px 0;color:#fff;background:linear-gradient(rgba(10,20,13,.88),rgba(10,20,13,.88)),url(../assets/images/tetto-con-parapetti.webp) center/cover}
.site-footer img{width:210px;filter:brightness(0) invert(1);margin-bottom:25px}
.site-footer .footer-company{display:grid;gap:5px;font-size:.94rem;line-height:1.55}
.site-footer .footer-company p{margin:0}
.site-footer nav{display:flex;gap:20px;flex-wrap:wrap;margin-top:22px}
.site-footer .iubenda-cs-preferences-link{padding:0;border:0;background:transparent;color:inherit;text-decoration:underline;cursor:pointer}
.to-top{position:fixed;right:20px;bottom:20px;display:grid;width:48px;height:48px;place-items:center;border-radius:50%;background:var(--green);color:#fff;text-decoration:none;box-shadow:var(--shadow)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){.menu-toggle{display:block}
.site-header nav{display:none;position:absolute;top:88px;left:0;right:0;flex-direction:column;align-items:stretch;padding:20px;background:#fff;border-bottom:1px solid var(--line)}
.site-header nav.open{display:flex}
.site-header nav a{padding:8px 10px}
.split{grid-template-columns:1fr;gap:45px}
.cards.three{grid-template-columns:1fr}
.roof-divider{background-attachment:scroll}
.section{padding:72px 0}
}
@media(max-width:1024px) and (min-width:769px){.hero{background-size:auto 128%;background-position:57% 25%}.hero .eyebrow{font-size:1.25rem}
}
@media(max-width:1100px) and (min-width:901px){.brand img{width:220px}.header-inner{gap:18px}.site-header nav{gap:14px}.site-header nav a{font-size:.86rem}}
@media(max-width:900px){.brand img{width:min(230px,calc(100vw - 110px))}.header-inner{gap:20px}.hero .eyebrow{font-size:1.25rem}}
@media(max-width:768px){.hero{background-size:auto 136%;background-position:59% 22%}
}
@media(max-width:600px){.wrap{width:min(100% - 28px,1160px)}
.menu-toggle{padding:10px}
.brand img{width:min(220px,calc(100vw - 104px));max-width:none}
.hero{min-height:720px;background-size:auto 142%;background-position:61% 20%}
.hero .eyebrow{font-size:1.125rem;letter-spacing:.11em}
.hero h1{font-size:2.75rem}
.section{padding:58px 0}
.gallery{grid-template-columns:repeat(2,1fr)}
.cards,.form-grid{grid-template-columns:1fr}
.field.full{grid-column:auto}
.form-grid{gap:16px}
.site-footer{padding:54px 0 82px}.site-footer img{width:190px;margin-bottom:22px}.site-footer .footer-company{gap:7px;font-size:.9rem}.site-footer nav{flex-direction:column;align-items:flex-start;gap:12px;margin-top:26px}
.to-top{right:14px;bottom:14px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*{animation:none!important;transition:none!important}
.roof-divider{background-attachment:scroll}
}

/* Casi fotografici delle due macro-sezioni. */
.service-copy{max-width:900px}
.project-cases{display:grid;gap:42px;margin-top:64px}
.project-case{padding:clamp(22px,3vw,34px);border:1px solid var(--line);border-radius:var(--radius);background:var(--white);box-shadow:0 12px 36px rgba(18,43,28,.07)}
.alternate .project-case{background:#fff}
.case-heading{max-width:850px;margin-bottom:24px}
.case-heading h3{margin:0 0 9px;font-size:clamp(1.35rem,2.2vw,1.9rem);line-height:1.2;letter-spacing:-.025em}
.case-heading p{margin:0;color:var(--muted)}
.case-grid{display:grid;gap:16px}
.case-grid-three{grid-template-columns:repeat(3,1fr)}
.case-grid-two{grid-template-columns:repeat(2,1fr)}
.case-grid-feature{grid-template-columns:repeat(3,1fr)}
.case-grid figure{position:relative;margin:0;overflow:hidden;border-radius:15px;background:#e8ede9}
.case-grid img{width:100%;height:100%;min-height:230px;aspect-ratio:4/3;object-fit:cover}
.case-grid figcaption{position:absolute;left:12px;bottom:12px;padding:7px 11px;border-radius:999px;background:rgba(23,32,27,.88);color:#fff;font-size:.82rem;font-weight:800;line-height:1.2;box-shadow:0 4px 16px rgba(0,0,0,.2)}
.maintenance-note{display:flex;max-width:900px;align-items:flex-start;gap:16px;margin:36px 0 0;padding:20px 24px;border-left:4px solid var(--green);border-radius:0 12px 12px 0;background:var(--soft);font-weight:650}
.maintenance-note .service-icon{flex:0 0 94px;width:94px;height:94px;margin:0;padding:27px;background:linear-gradient(135deg,var(--service-icon-bg-start),var(--service-icon-bg-end))}

@media(max-width:900px){.case-grid-feature{grid-template-columns:repeat(2,1fr)}.roof-divider{background-attachment:scroll}}
@media(max-width:700px){.case-grid-three,.case-grid-two,.case-grid-feature{grid-template-columns:1fr}.case-grid img{min-height:220px;aspect-ratio:4/3}.project-cases{margin-top:46px;gap:30px}.project-case{padding:18px}.case-grid figcaption{white-space:normal;max-width:calc(100% - 24px)}}
@media(max-width:600px){.service-icon{width:84px;height:84px;padding:22px}.maintenance-note .service-icon{flex-basis:84px;width:84px;height:84px;padding:22px}.cards article .card-service-icon{width:84px;height:84px;padding:22px}}
@media(hover:hover) and (pointer:fine){.service-icon:hover,.service-icon:focus-visible{--service-icon-bg-start:#52ae32;--service-icon-bg-end:#3d8928}}
@media(hover:none),(pointer:coarse){.service-icon:active,.service-icon.is-in-view{--service-icon-bg-start:#52ae32;--service-icon-bg-end:#3d8928}}
@media(prefers-reduced-motion:reduce){.roof-divider{background-attachment:scroll}.service-icon{transition:none}}

/* Sezione compatta dei casi reali e galleria accessibile. */
.real-cases{background:#fff}
.real-cases-heading{max-width:760px;margin-bottom:38px}
.real-cases-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:24px}
.real-case-card{grid-column:span 2}
.real-case-card:nth-child(4){grid-column:2/span 2}
.real-case-card{display:flex;min-width:0;overflow:hidden;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:0 12px 34px rgba(18,43,28,.08)}
.real-case-card>img{width:100%;aspect-ratio:16/10;object-fit:cover}
.real-case-body{display:flex;flex:1;flex-direction:column;padding:24px}
.case-location{margin:0 0 7px;color:var(--green);font-size:.78rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.real-case-card h3{margin:0 0 12px;font-size:1.3rem;line-height:1.22}
.real-case-card h3+p{margin:0 0 22px;color:var(--muted)}
.case-open{align-self:flex-start;margin-top:auto;color:var(--green-dark);font-weight:850;text-underline-offset:4px}
.case-complement{margin-top:14px!important;padding-top:13px;border-top:1px solid var(--line);color:var(--muted)!important;font-size:.9rem}
.case-dialog{width:min(1080px,calc(100% - 32px));max-height:calc(100vh - 32px);padding:0;border:0;border-radius:20px;color:var(--ink);box-shadow:0 28px 90px rgba(0,0,0,.35)}
.case-dialog::backdrop{background:rgba(10,15,12,.72);backdrop-filter:blur(4px)}
.dialog-head{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px;border-bottom:1px solid var(--line);background:#fff}
.dialog-head h2{margin:0;font-size:clamp(1.35rem,3vw,2rem)}
.dialog-close{min-height:48px;padding:10px 18px;border:1px solid var(--line);border-radius:11px;background:#fff;font-weight:800;cursor:pointer}
.dialog-gallery{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;padding:24px;overflow-y:auto}
.dialog-gallery figure{grid-column:span 2;margin:0;overflow:hidden;border-radius:14px;background:var(--soft)}
.dialog-gallery:has(>figure:nth-child(2):last-child) figure{grid-column:span 3}
.dialog-gallery:has(>figure:nth-child(5):last-child) figure:nth-child(4){grid-column:2/span 2}
.dialog-gallery:has(>figure:nth-child(5):last-child) figure:nth-child(5){grid-column:4/span 2}
.dialog-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover}
.dialog-gallery figcaption{padding:12px 14px;font-weight:750}
body.modal-open{overflow:hidden}
@media(max-width:1050px){.real-cases-grid{grid-template-columns:repeat(2,1fr)}.real-case-card,.real-case-card:nth-child(4){grid-column:auto}}
@media(max-width:900px){.dialog-gallery{grid-template-columns:repeat(2,1fr)}.dialog-gallery figure,.dialog-gallery:has(>figure:nth-child(2):last-child) figure,.dialog-gallery:has(>figure:nth-child(5):last-child) figure:nth-child(4),.dialog-gallery:has(>figure:nth-child(5):last-child) figure:nth-child(5){grid-column:auto}}
@media(max-width:700px){.real-cases-grid,.dialog-gallery{grid-template-columns:1fr}.dialog-head,.dialog-gallery{padding:16px}.real-case-body{padding:20px}.case-dialog{width:calc(100% - 20px);max-height:calc(100vh - 20px)}}
