:root{--charcoal:#1B1C1E;--bone:#F4F5F0;--lime:#E1FA85;--edge:rgba(244,245,240,.3);--mono:'Liberation Mono',monospace;--sans:'Lato',Arial,Helvetica,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bone);color:var(--charcoal);font-family:var(--sans)}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;max-width:100%}
.site-head{position:absolute;top:0;left:0;width:100%;z-index:4;display:flex;align-items:start;justify-content:space-between;padding:28px clamp(22px,4.4vw,72px);color:var(--bone)}
.brand{display:flex;flex-direction:column;gap:8px;width:clamp(144px,13vw,206px)}.brand img{width:100%;height:auto}.brand-sub{font:10px/1.25 var(--mono);letter-spacing:.38em;margin-left:2px}
.nav{display:flex;align-items:center;gap:clamp(22px,3vw,56px);padding-top:8px}.nav a,.menu-toggle{font:11px var(--mono);letter-spacing:.09em;text-transform:uppercase;border-bottom:1px solid transparent;padding-bottom:7px}.nav a:hover{border-color:var(--lime)}.menu-toggle{display:none}
.hero{min-height:100svh;position:relative;overflow:hidden;background:var(--charcoal);color:var(--bone);display:grid;grid-template-columns:60% 40%;padding:clamp(120px,15vh,185px) clamp(22px,4.4vw,72px) 58px}
.hero-copy{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.eyebrow,.index,.vertical-tag{font:11px/1.7 var(--mono);letter-spacing:.13em;text-transform:uppercase}.eyebrow:before{content:'';display:inline-block;width:36px;border-top:1px solid currentColor;margin:0 14px 4px 0;opacity:.65}
h1{font-size:clamp(60px,8.65vw,164px);font-weight:900;letter-spacing:-.072em;line-height:.89;margin:clamp(36px,5vh,75px) 0 0;max-width:9em}
h1 span{display:block}.tagline{display:flex;align-items:end;gap:16px;font:12px/1.5 var(--mono);letter-spacing:.19em;max-width:350px;text-transform:uppercase;margin-top:5vh}.small-line{display:block;width:60px;height:1px;background:var(--lime);margin:3px 0 6px}
.hero-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:420px}.hero-visual img{width:clamp(210px,30vw,520px);height:clamp(430px,68vh,840px);object-fit:contain;transform:translateX(-7%) rotate(0deg)}
.hero-bottom{position:absolute;bottom:32px;left:clamp(22px,4.4vw,72px);right:clamp(22px,4.4vw,72px);display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--edge);padding-top:14px;font:11px var(--mono);letter-spacing:.13em}.hero-bottom a{display:inline-flex;gap:16px;align-items:center}.hero-bottom a::after{content:'↗';color:var(--lime);font-size:18px}
/* Divisioni Sub/rbn: solo titoli di area e voci, senza servizio duplicato in grande. */
.main-division{display:grid;grid-template-columns:minmax(0,47fr) minmax(0,53fr);min-height:820px}
.division{min-width:0;min-height:clamp(620px,83svh,960px);display:flex;flex-direction:column;justify-content:space-between;padding:clamp(26px,3.6vw,60px);overflow:hidden}
.division--lab{background:var(--bone);color:var(--charcoal)}
.division--studio{background:var(--charcoal);color:var(--bone)}
.division-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;border-bottom:1px solid currentColor;padding-bottom:18px}
.division-overline,.division-head-index,.services-caption,.division-tail{font:11px/1.5 var(--mono);letter-spacing:.07em;text-transform:uppercase}
.division-overline{display:block;opacity:.66;margin-bottom:6px}
.division-heading{font:900 clamp(29px,3.4vw,59px)/.97 var(--sans);letter-spacing:-.064em;margin:0}
.division-head-index{opacity:.66;padding-top:3px;white-space:nowrap}
.division-content{display:flex;flex-direction:column;justify-content:center;flex:1;padding:clamp(55px,7vw,120px) 0;min-width:0}
.services-caption{display:flex;justify-content:space-between;gap:20px;padding-bottom:18px;opacity:.65}
.service-list{margin:0;padding:0;list-style:none}
.service-entry{display:grid;grid-template-columns:34px minmax(0,1fr) 30px;align-items:center;gap:16px;padding:clamp(21px,2.25vw,36px) 0;border-top:1px solid currentColor}
.service-entry:last-child{border-bottom:1px solid currentColor}
.service-index{font:11px/1.2 var(--mono);opacity:.68}
.service-label{font:800 clamp(25px,2.7vw,46px)/1.05 var(--sans);letter-spacing:-.045em;text-transform:uppercase;overflow-wrap:normal}
.service-arrow{font:28px/1 var(--sans);opacity:.65;text-align:right}
.division-tail{display:flex;justify-content:space-between;gap:15px;border-top:0;padding-top:12px;opacity:.64}
/* Contrappunto asimmetrico: contenuti del Custom Studio allineati a destra. */
.division--studio .division-head{flex-direction:row-reverse;text-align:right}
.division--studio .division-content{text-align:right}
.division--studio .services-caption,.division--studio .division-tail{flex-direction:row-reverse}
@media(max-width:900px){.division{padding:30px;min-height:650px}.division-heading{font-size:clamp(26px,4vw,38px)}.service-entry{gap:8px;grid-template-columns:25px minmax(0,1fr) 24px}.service-label{font-size:clamp(22px,2.6vw,32px)}}
@media(max-width:800px){.main-division{grid-template-columns:1fr}.division{min-height:65svh;padding:clamp(25px,5.6vw,42px)}.division-heading{font-size:clamp(33px,7vw,52px)}.service-label{font-size:clamp(27px,5vw,42px)}.division-content{padding:65px 0}.division--studio .division-head{flex-direction:row;text-align:left}.division--studio .division-content{text-align:left}.division--studio .services-caption,.division--studio .division-tail{flex-direction:row}}
@media(max-width:480px){.division{min-height:560px}.division-heading{font-size:32px}.division-content{padding:48px 0}.service-entry{gap:10px;grid-template-columns:23px minmax(0,1fr) 24px;padding:22px 0}.service-label{font-size:clamp(25px,7vw,33px)}.division-head-index{font-size:9px}}
.manifesto{min-height:82vh;background:var(--bone);display:grid;grid-template-columns:1fr 1fr;padding:clamp(25px,4.4vw,72px);border-top:1px solid #cfd1cb;position:relative;gap:4vw}.manifesto .lead{font-size:clamp(54px,8.8vw,145px);line-height:.93;letter-spacing:-.077em;font-weight:300;margin:auto 0}.manifesto .lead b{font-weight:900}.manifesto .detail{display:flex;flex-direction:column;justify-content:space-between;align-items:end;text-align:right}.manifesto .detail p{max-width:270px;font-size:clamp(16px,1.5vw,22px);line-height:1.4;margin:auto 0}.nocto{width:clamp(100px,14vw,220px);image-rendering:pixelated}
.footer{min-height:47vh;background:var(--charcoal);color:var(--bone);display:flex;flex-direction:column;justify-content:space-between;padding:clamp(26px,4.4vw,72px);gap:65px}.footer-top{display:flex;justify-content:space-between;gap:20px;font:11px var(--mono);letter-spacing:.15em}.footer .huge{width:min(1150px,95%);height:auto}.footer nav{display:flex;gap:36px;font-size:12px}.footer small{font:10px var(--mono);letter-spacing:.16em}
.mobile-nav{display:none}
@media(max-width:800px){.site-head{padding:20px 22px}.nav{display:none}.menu-toggle{display:block;padding-top:8px;color:inherit;background:none;border:0;cursor:pointer}.mobile-nav{display:none;position:absolute;left:0;right:0;top:80px;background:var(--charcoal);padding:24px;flex-direction:column;gap:22px;font:14px var(--mono)}.mobile-nav.is-open{display:flex}.hero{grid-template-columns:1fr;grid-template-rows:1fr auto;padding-top:130px;padding-bottom:85px;min-height:100svh}.hero-copy{justify-content:start}.hero h1{font-size:clamp(62px,15vw,108px);margin:12vh 0 0}.hero-visual{min-height:0;position:absolute;right:3%;bottom:10%;width:39%;height:49%;z-index:1;opacity:1}.hero-visual img{width:100%;height:100%;transform:none}.tagline{font-size:10px;margin-top:24px;max-width:200px}.hero-bottom{bottom:22px}.manifesto{grid-template-columns:1fr;min-height:75svh;gap:15px;padding:26px 22px}.manifesto .lead{margin-top:18vh;font-size:clamp(70px,15vw,130px)}.manifesto .detail{flex-direction:row;align-items:end;text-align:left}.manifesto .detail p{font-size:14px;max-width:200px}.nocto{width:100px}.footer{padding:30px 22px;min-height:36vh}.footer-top{flex-direction:column}.footer nav{gap:15px;flex-wrap:wrap}}
@media(max-width:480px){.hero h1{font-size:clamp(45px,13vw,65px);margin-top:16vh}.hero-visual{width:34%;height:40%;right:0;bottom:14%}.hero-bottom{font-size:9px}.manifesto .lead{font-size:clamp(53px,14vw,78px)}.footer-top{font-size:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Keyboard focus visible without changing mouse or touch appearance. */
.site-head :focus-visible,.hero :focus-visible,.division--studio :focus-visible,.footer :focus-visible{outline:2px solid var(--lime);outline-offset:5px}
.division--lab :focus-visible,.manifesto :focus-visible{outline:2px solid var(--charcoal);outline-offset:5px}

/* SUB/RBN / Mobile refinement v2 - non modifica il desktop. */
@media (max-width:800px) {
  .menu-toggle { min-height:44px; margin-top:-8px; padding:12px 0 10px 12px; }
  .mobile-nav { top:76px; z-index:8; border-top:1px solid rgba(244,245,240,.18); padding:14px 22px 24px; gap:0; box-shadow:0 22px 30px rgba(0,0,0,.18); }
  .mobile-nav a { display:flex; align-items:center; min-height:52px; border-bottom:1px solid rgba(244,245,240,.18); font:12px/1.5 var(--mono); letter-spacing:.1em; text-transform:uppercase; }
  .mobile-nav a:focus-visible, .menu-toggle:focus-visible { outline:2px solid var(--lime); outline-offset:3px; }
  .division { justify-content:initial; }
  .division-content { flex:1; justify-content:center; padding:44px 0 38px; }
  .division-tail { margin-top:auto; }
  .division--lab { min-height:560px; }
  .division--studio { min-height:490px; }
}
@media(max-width:480px) {
  /* Lo slash originale cresce, ma rimane sotto la massa tipografica. */
  .hero-visual { width:46%; height:43%; right:2%; bottom:11%; }
  .hero-visual img { object-fit:contain; }
  .division { padding:27px 22px 30px; }
  .division-heading { font-size:clamp(30px,8.2vw,35px); }
  .division-content { padding:44px 0 32px; }
  .division--lab { min-height:530px; }
  .division--studio { min-height:460px; }
  .service-entry { padding:19px 0; }
  .service-label { font-size:clamp(24px,6.9vw,32px); }
  .division-tail { font-size:10px; }
}
@media(max-width:359px) {
  .hero-visual { width:43%; height:40%; right:1%; bottom:12%; }
  .service-label { font-size:23px; }
  .division-heading { font-size:29px; }
  .manifesto .lead { font-size:clamp(38px,12.3vw,43px); }
}

/* SUB/RBN - solo smartphone e tablet verticali (<= 800px).
   Desktop rigorosamente invariato: hero in apertura.
   Mobile: Digital Lab, Custom Studio, manifesto, hero, footer.
   L'intestazione resta leggibile sopra Digital Lab che ha fondo Bone White. */
@media (max-width:800px) {
  .site-head {
    position:relative;
    top:auto;
    left:auto;
    width:100%;
    min-height:86px;
    background:var(--charcoal);
    color:var(--bone);
  }
  main {
    display:flex;
    flex-direction:column;
  }
  main > .main-division { order:1; }
  main > .manifesto { order:2; }
  main > .hero { order:3; }
  /* Il menu a discesa si ancora all'intestazione scura, non alla hero. */
  .mobile-nav { top:100%; }
}

.service-label:focus-visible{outline:2px solid var(--lime);outline-offset:6px}
.service-label:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:7px}
