:root{--ink:#202023;--paper:#f5f3ef;--red:#e30613;--eco:#2f7d45;--eco-soft:#e6f0e8;--white:#fff;--muted:#6d716f;--line:rgba(32,32,35,.16);--whatsapp:#25d366;--shadow:0 18px 50px rgba(0,0,0,.12)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit}
button,a{touch-action:manipulation}
:focus-visible{outline:3px solid #ffbf47;outline-offset:3px}
.site-header{height:86px;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;border-bottom:1px solid rgba(255,255,255,.22);position:absolute;z-index:30;width:100%;color:#fff}
.brand{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:.11em}
.brand-logo{background:#fff;padding:7px 11px;line-height:0;box-shadow:0 8px 24px rgba(0,0,0,.08)}
.brand-logo img{width:172px;height:auto}
.site-header nav{display:flex;align-items:center;gap:28px;font-size:.84rem}
.site-header nav a{opacity:.82;padding:12px 0}
.site-header nav a:hover,.site-header nav a[aria-current="page"]{opacity:1}
.header-cta{border-bottom:1px solid currentColor;padding:10px 0 5px;font-size:.84rem}
.menu-button{display:none;border:1px solid rgba(255,255,255,.45);background:transparent;color:#fff;border-radius:999px;min-width:52px;min-height:44px;padding:0 15px}
.hero{min-height:900px;background:var(--ink);color:#fff;display:grid;grid-template-columns:48% 52%;grid-template-rows:1fr 115px;position:relative}
.hero-copy{padding:190px 5vw 80px 7vw;display:flex;flex-direction:column;justify-content:center}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-weight:700;font-size:.68rem;margin:0 0 28px}
.hero h1,.intro h2,.project h2,.method h2,.contact h2{font-weight:650;font-size:clamp(3.4rem,7vw,7.5rem);line-height:.9;letter-spacing:-.065em;margin:0}
.hero h1 em,.intro h2 em,.project h2 em,.method h2 em,.contact h2 em{font-weight:420;color:var(--red);font-style:normal}
.hero-lead{font-size:1.18rem;line-height:1.6;max-width:490px;color:#d0d3d1;margin:38px 0}
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:24px}
.button{display:inline-flex;justify-content:space-between;align-items:center;gap:28px;padding:15px 20px;min-height:50px;font-size:.85rem;font-weight:700;transition:transform .2s ease,box-shadow .2s ease;border:0;cursor:pointer}
.button.primary{background:#fff;color:var(--ink)}
.button.lime{background:var(--red);color:#fff}
.button.eco{background:var(--eco);color:#fff}
.button:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.12)}
.text-link{font-size:.85rem;border-bottom:1px solid currentColor;padding:10px 0}
.hero-visual,.project-media{background-size:cover;background-position:center;position:relative}
.hero-visual{background-image:linear-gradient(180deg,rgba(0,0,0,.08),rgba(12,12,12,.3)),image-set(url('/renders/trama-01.webp') type('image/webp'),url('/renders/trama-01.jpg') type('image/jpeg'))}
.project-media{background-image:linear-gradient(180deg,rgba(0,0,0,.04),rgba(12,12,12,.22)),image-set(url('/renders/trama-04-notte.webp') type('image/webp'),url('/renders/trama-04-notte.jpg') type('image/jpeg'))}
.hero-badge{position:absolute;top:115px;right:35px;background:rgba(32,32,35,.8);backdrop-filter:blur(9px);padding:10px 14px;font-size:.7rem;text-transform:uppercase;letter-spacing:.12em}
.pulse{display:inline-block;width:7px;height:7px;background:var(--red);border-radius:50%;margin-right:8px}
.hero-caption{position:absolute;bottom:35px;left:35px;margin:0;font-size:.9rem;line-height:1.5}
.hero-stats{grid-column:1/3;border-top:1px solid rgba(255,255,255,.18);display:grid;grid-template-columns:repeat(3,1fr);padding-left:7vw}
.hero-stats div{border-right:1px solid rgba(255,255,255,.18);display:flex;align-items:center;gap:18px;padding:20px 28px}
.hero-stats strong{font-weight:550;font-size:2.3rem}
.hero-stats span{font-size:.72rem;color:#b6bab8;text-transform:uppercase;letter-spacing:.1em}
.intro{padding:150px 7vw;display:grid;grid-template-columns:1.15fr .85fr;gap:11vw}
.intro h2,.method h2{font-size:clamp(3rem,5.4vw,6rem)}
.intro h2 em,.method h2 em{color:#777576}
.intro-copy{padding-top:40px;font-size:1.05rem;line-height:1.8}
.intro-copy p+p{margin-top:24px}
.text-link.dark{display:inline-block;margin-top:20px}
.project{display:grid;grid-template-columns:54% 46%;min-height:760px}
.project-label{position:absolute;left:30px;top:30px;background:var(--red);color:#fff;padding:18px;width:180px;height:105px;display:flex;justify-content:space-between;font-size:.68rem;text-transform:uppercase;letter-spacing:.1em}
.project-info{background:var(--ink);color:#fff;padding:90px 6vw}
.eyebrow.light{color:#c4c7c5}
.project h2{font-size:clamp(4rem,6vw,7rem)}
.project h2 em{color:#fff}
.project-info>p:not(.eyebrow){color:#c5c8c6;line-height:1.7;max-width:500px;font-size:1rem;margin:30px 0}
.project-features{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.2);border-bottom:1px solid rgba(255,255,255,.2);margin:38px 0}
.project-features div{padding:18px 14px 18px 0}
.project-features div+div{border-left:1px solid rgba(255,255,255,.2);padding-left:14px}
.project-features span,.contact-details span{display:block;color:#a7aaa8;font-size:.62rem;text-transform:uppercase;letter-spacing:.12em;margin-bottom:10px}
.project-features strong{font-size:.78rem;line-height:1.5}
.project-info small{display:block;color:#9a9d9b;font-size:.64rem;line-height:1.5;margin-top:18px;max-width:500px}
.gallery{padding:130px 7vw;background:#ebe9e5}
.gallery-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:45px;gap:40px}
.gallery h2{font-weight:650;font-size:clamp(3rem,5.4vw,6rem);line-height:.9;letter-spacing:-.065em;margin:0}
.gallery h2 em{font-style:normal;color:var(--red);font-weight:420}
.gallery-note{max-width:360px;color:#666;font-size:.86rem;line-height:1.65}
.gallery-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:180px;gap:12px}
.gallery-grid figure{margin:0;overflow:hidden;background:#ddd;position:relative}
.gallery-grid figure:nth-child(1){grid-column:span 8;grid-row:span 3}.gallery-grid figure:nth-child(2),.gallery-grid figure:nth-child(3),.gallery-grid figure:nth-child(4),.gallery-grid figure:nth-child(5),.gallery-grid figure:nth-child(6),.gallery-grid figure:nth-child(7){grid-column:span 4;grid-row:span 2}
.gallery-grid img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.gallery-grid figure:hover img{transform:scale(1.025)}
.gallery-grid figcaption{position:absolute;left:15px;bottom:15px;background:rgba(25,25,25,.78);color:#fff;padding:8px 10px;font-size:.64rem;text-transform:uppercase;letter-spacing:.12em;backdrop-filter:blur(8px)}
.method{padding:150px 7vw}
.method-heading{display:flex;justify-content:space-between;align-items:flex-start}
.steps{margin-top:90px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.steps article{padding:28px 28px 20px 0;min-height:245px}
.steps article+article{border-left:1px solid var(--line);padding-left:28px}
.steps span{font-size:.7rem;color:#737674}
.steps h3{font-weight:700;font-size:1.05rem;margin-top:58px}
.steps p{font-size:.83rem;line-height:1.65;color:#666b68}
.contact{background:#29292b;color:#fff;padding:130px 7vw}
.contact h2{font-size:clamp(3.5rem,7vw,7.5rem)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:12vw;margin-top:70px}
.contact-grid>div:first-child p{color:#c5c7c6;max-width:440px;line-height:1.7;margin-bottom:30px}
.contact-details{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:24px;border-top:1px solid rgba(255,255,255,.2);padding-top:25px}
.contact-details strong,.contact-details a{font-size:.8rem;line-height:1.6}
footer{background:#18181a;color:#aeb0af;display:grid;grid-template-columns:minmax(180px,1.2fr) minmax(210px,1fr) repeat(3,auto);gap:22px;align-items:end;padding:45px 7vw;font-size:.7rem}footer p{margin:0}
.footer-logo{width:max-content}.footer-logo img{width:185px}
.footer-links,.footer-social{display:flex;gap:18px;align-items:center;margin:0;flex-wrap:wrap}
.footer-social a{display:inline-flex;align-items:center;gap:7px}
.footer-social svg{width:17px;height:17px;fill:currentColor}
.whatsapp-float{position:fixed;right:22px;bottom:max(22px,env(safe-area-inset-bottom));z-index:50;display:flex;align-items:center;gap:10px;background:var(--whatsapp);color:#0a3218;border-radius:999px;padding:13px 18px;font-weight:800;font-size:.82rem;box-shadow:0 12px 30px rgba(0,0,0,.22)}
.whatsapp-float svg{width:23px;height:23px;fill:currentColor}
.whatsapp-float:hover{transform:translateY(-2px)}
.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){
  html{scroll-padding-top:72px}.site-header{height:72px;padding:0 5vw}.brand-logo img{width:142px}.site-header nav,.header-cta{display:none}.menu-button{display:block}.site-header nav.is-open{display:flex;position:absolute;top:72px;left:0;right:0;min-height:calc(100svh - 72px);padding:28px 7vw;background:#202023;flex-direction:column;align-items:stretch;gap:4px;font-size:1.05rem}.site-header nav.is-open a{padding:16px 0;border-bottom:1px solid rgba(255,255,255,.14)}
  .hero{display:block;min-height:auto}.hero-copy{min-height:640px;padding:138px 7vw 65px}.hero-visual{height:min(75svh,620px);background-position:58% center;background-image:linear-gradient(180deg,rgba(0,0,0,.08),rgba(12,12,12,.3)),url('/renders/trama-01-960.webp')}.hero-badge{top:24px;right:20px}.hero-caption{left:22px;bottom:22px}.hero-stats{padding-left:0}.hero-stats div{padding:16px 10px;display:block}.hero-stats strong{font-size:1.6rem;display:block}.hero-stats span{font-size:.55rem}.intro,.project,.contact-grid{grid-template-columns:1fr}.intro{padding:90px 7vw;gap:15px}.intro-copy{padding-top:12px}.project-media{height:62svh;min-height:430px;background-image:linear-gradient(180deg,rgba(0,0,0,.04),rgba(12,12,12,.22)),url('/renders/trama-04-notte-960.webp')}.project-info{padding:75px 7vw}.method{padding:90px 7vw}.method-heading{display:block}.steps{grid-template-columns:1fr 1fr;margin-top:55px}.steps article:nth-child(3){border-left:0}.contact{padding:90px 7vw}.contact-grid{gap:50px}.contact-details{grid-template-columns:1fr}.hero-actions{align-items:flex-start}.project-features{grid-template-columns:1fr}.project-features div+div{border-left:0;border-top:1px solid rgba(255,255,255,.2);padding-left:0}.gallery{padding:85px 7vw}.gallery-head{display:block}.gallery-note{margin-top:25px}.gallery-grid{display:block}.gallery-grid figure{height:290px;margin-bottom:10px}.gallery-grid figure:first-child{height:430px}footer{grid-template-columns:1fr 1fr;align-items:start}.footer-social{justify-content:flex-start}
}
@media(max-width:560px){
  .hero h1,.intro h2,.project h2,.method h2,.contact h2{letter-spacing:-.05em}.hero-copy{min-height:600px}.hero-lead{font-size:1.03rem}.hero-actions{flex-direction:column;align-items:stretch}.hero-actions .button{width:100%}.hero-stats{grid-template-columns:1fr}.hero-stats div{display:flex;padding:14px 7vw;border-right:0;border-bottom:1px solid rgba(255,255,255,.15)}.project-label{left:18px;top:18px}.steps{grid-template-columns:1fr}.steps article,.steps article+article{border-left:0;border-bottom:1px solid var(--line);padding-left:0;min-height:auto}.steps h3{margin-top:30px}.gallery-grid figure,.gallery-grid figure:first-child{height:280px}.contact-details{gap:22px}footer{grid-template-columns:1fr;padding-bottom:100px}.whatsapp-float{right:14px;bottom:max(14px,env(safe-area-inset-bottom));padding:13px 16px}.whatsapp-float span{display:none}.whatsapp-float svg{width:27px;height:27px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}