/* Studio Janus — Proposta home 4 «Oltre la materia».
   A WebGL scene (three.js r128) fixed behind readable DOM layers. Scroll drives a camera in depth and the matter
   (one point cloud) that changes form at every stage. Every class is prefixed om-.
   Base styles = static, vertical layout (no WebGL, reduced motion, three.js unavailable).
   html.om-3d = flight mode: sections become scroll spacers, their layers are fixed and faded by oltre.js. */

.om-page{
  --om-k:#000;--om-p:#f3f0e9;--om-o:#ff6725;--om-g1:#111;--om-g2:#1c1c1c;--om-mute:#8f8b84;--om-soft:#d6d1c8;
  --om-line:#ffffff24;--om-d:'Barlow Condensed','Arial Narrow',Impact,sans-serif;--om-s:'DM Sans',Arial,sans-serif;
  --om-pad:clamp(22px,6vw,96px);--om-hpad:clamp(20px,5vw,84px);--om-mono:'JetBrains Mono',ui-monospace,Menlo,Consolas,monospace;--om-ease:cubic-bezier(.2,.75,.15,1);
  background:#000;color:var(--om-p);font-family:var(--om-s)
}
.om-page ::selection{background:var(--om-o);color:#000}
.om-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.om-canvas,.om-dust{display:none}
.om-defs{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.om-cursor,.om-wave{display:none}
.om-index{display:none}

/* ---------------------------------------------------------------- shared type */
.om-eyebrow{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0 0 22px;font:600 11px/1.5 var(--om-s);letter-spacing:.16em;text-transform:uppercase;color:var(--om-mute)}
.om-eyebrow:before{content:'';width:28px;height:1px;background:var(--om-o);flex:none}
.om-page .om-title{margin:20px 0 28px;font-family:var(--om-d);font-weight:800;font-size:clamp(56px,8.5vw,164px);line-height:.84;letter-spacing:0;text-transform:uppercase;width:auto;text-shadow:none;transform:none;opacity:1;pointer-events:auto}
.om-title-vis{display:block}
.om-line{display:block;white-space:nowrap}
.om-amp{color:var(--om-o)}
.om-ch{display:inline-block;transition:color .45s,transform .45s var(--om-ease)}
.om-ch[data-g^="1"]{transform:translateY(-1px)}
.om-ch[data-g^="2"]{transform:translateY(-2px) skewX(-2deg)}
.om-ch[data-g^="3"]{color:var(--om-o);transform:translateY(-3px) skewX(-4deg)}
.om-ch[data-g="1a"]{filter:url(#om-g1a)}.om-ch[data-g="1b"]{filter:url(#om-g1b)}
.om-ch[data-g="2a"]{filter:url(#om-g2a)}.om-ch[data-g="2b"]{filter:url(#om-g2b)}
.om-ch[data-g="3a"]{filter:url(#om-g3a)}.om-ch[data-g="3b"]{filter:url(#om-g3b)}
.om-title em,.om-h2 em,.om-caption em,.om-mani-h em,.om-oltre-word span{font-style:normal;color:var(--om-o)}
.om-page .om-h2{margin:0;font-family:var(--om-d);font-weight:800;font-size:clamp(40px,4.9vw,86px);line-height:.9;letter-spacing:.004em;text-transform:uppercase}
.om-h2 em{display:block}
.om-page .om-h3{margin:0;font-family:var(--om-d);font-weight:700;font-size:clamp(32px,3.4vw,58px);line-height:.94;letter-spacing:.006em;text-transform:uppercase}
.om-lead{margin:24px 0 0;max-width:34em;font:400 clamp(17px,1.32vw,21px)/1.55 var(--om-s);color:#ebe7de}
.om-body{margin:16px 0 0;max-width:36em;font-size:16px;line-height:1.7;color:var(--om-soft)}
.om-link{display:inline-flex;align-items:center;gap:16px;min-height:44px;margin-top:22px;border-bottom:1px solid #ffffff4d;font:600 12px var(--om-s);letter-spacing:.14em;text-transform:uppercase;transition:border-color .3s,gap .4s var(--om-ease)}
.om-link span{color:var(--om-o)}
.om-link:hover,.om-link:focus-visible{border-color:var(--om-o);gap:24px}
.om-caption{margin:0;font:700 clamp(22px,2.3vw,38px)/1.05 var(--om-d);letter-spacing:.02em;text-transform:uppercase;text-align:center}
.om-media img{display:block;width:100%;height:auto}

/* ---------------------------------------------------------------- static layout (fallback) */
.om-sec{position:relative;padding:clamp(80px,12vh,140px) var(--om-pad)}
.om-layer{position:relative}
.om-s-hero{min-height:100svh;display:flex;align-items:flex-end;padding-top:130px}
.om-s-hero .om-layer{width:100%;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:5vw;align-items:end}
.om-hero-media{order:2;align-self:center;max-width:620px;justify-self:end;width:100%}
.om-hero-copy{order:1}
.om-kicker{display:flex;gap:12px;margin:0;font:500 11px var(--om-mono);letter-spacing:.16em;color:var(--om-mute)}
.om-kicker span:first-child{color:var(--om-o)}
[data-om-scramble]{font-variant-ligatures:none}
.om-tagline{display:flex;align-items:center;gap:16px;margin:0;font:400 clamp(18px,1.6vw,25px)/1.3 var(--om-s)}
.om-tagline:before{content:'';width:40px;height:1px;background:var(--om-o);flex:none}
.om-hero-foot{display:flex;flex-wrap:wrap;align-items:center;gap:14px 34px;margin-top:44px}
.om-scroll{display:inline-flex;align-items:center;gap:14px;font:500 11px var(--om-mono);letter-spacing:.16em;padding:10px 0}
.om-scroll-dot{position:relative;width:26px;height:40px;border:1px solid #ffffff55;border-radius:20px;flex:none}
.om-scroll-dot:after{content:'';position:absolute;left:50%;top:8px;width:3px;height:3px;margin-left:-1.5px;border-radius:50%;background:var(--om-o);animation:om-dot 2.2s var(--om-ease) infinite}
@keyframes om-dot{0%{transform:translateY(0);opacity:0}25%{opacity:1}80%{transform:translateY(18px);opacity:0}100%{opacity:0}}
.om-s-dissolve{padding-top:40px;padding-bottom:40px}
.om-oltre-word{margin:0;font:800 clamp(110px,26vw,420px)/.8 var(--om-d);letter-spacing:0;text-align:center;white-space:nowrap}
.om-s-oltre .om-caption{margin-top:28px}
.om-s-studio .om-layer{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:6vw;align-items:center}
.om-studio-media{max-width:520px;justify-self:center;width:100%}
.om-face{display:none}
.om-svc-head{margin-bottom:56px}
.om-svc-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 5vw}
.om-svc{min-width:0;padding-top:24px;border-top:1px solid var(--om-line)}
.om-svc-n{display:flex;align-items:baseline;gap:8px;margin:0 0 14px;font:600 11px var(--om-s);letter-spacing:.16em;text-transform:uppercase;color:var(--om-mute)}
.om-svc-n b{font:800 22px/1 var(--om-d);letter-spacing:.02em;color:var(--om-o)}
.om-svc-n span{margin-left:6px}
.om-svc-d{margin:16px 0 0;max-width:36em;font-size:16px;line-height:1.65;color:#e2ded5}
.om-tags{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0;padding:0}
.om-tags li{padding:6px 12px;border:1px solid #ffffff38;border-radius:999px;font:600 10.5px var(--om-s);letter-spacing:.1em;text-transform:uppercase;color:var(--om-soft)}
.om-svc-links{display:flex;flex-wrap:wrap;gap:4px 24px;margin:16px 0 0}
.om-svc-links a{display:inline-flex;align-items:center;gap:8px;min-height:44px;font:600 12px var(--om-s);letter-spacing:.12em;text-transform:uppercase;border-bottom:1px solid var(--om-o);transition:color .3s}
.om-svc-links a span{color:var(--om-o)}
.om-svc-links a:hover,.om-svc-links a:focus-visible{color:var(--om-o)}
.om-work-head{margin-bottom:56px}
.om-works{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px 4vw}
.om-page .om-work{margin:0;min-width:0}
.om-page .om-work:nth-child(odd){margin-top:0}
.om-page .om-work:nth-child(even){margin-top:12vh}
.om-page .om-work-cap{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:baseline;gap:14px;margin:16px 0 0;padding-top:12px;border-top:1px solid var(--om-line)}
.om-page .om-work-cap h3{margin:0;font:700 clamp(26px,2.4vw,40px)/1 var(--om-d);letter-spacing:.01em;text-transform:uppercase}
.om-work-n{font:800 15px var(--om-d);color:var(--om-o)}
.om-page .om-work-c{font:600 11px var(--om-s);letter-spacing:.14em;text-transform:uppercase;color:var(--om-mute)}
.om-s-mani{padding-top:16vh;padding-bottom:16vh}
.om-page .om-mani-h{margin:0;font:800 clamp(48px,10.5vw,176px)/.86 var(--om-d);letter-spacing:0;text-transform:uppercase}
.om-mani-h span,.om-mani-h em{display:block}
.om-mani-foot{margin:34px 0 0;font:600 12px var(--om-s);letter-spacing:.16em;text-transform:uppercase;color:var(--om-o)}
.om-team-head{margin-bottom:56px}
.om-people{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 4vw}
.om-person{min-width:0}
.om-person .om-media{width:min(100%,280px);aspect-ratio:1;border-radius:50%;overflow:hidden;background:var(--om-g1)}
.om-person .om-media img{width:100%;height:100%;object-fit:cover}
.om-person-line{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;margin:20px 0 6px}
.om-page .om-person h3{margin:0;font:700 clamp(24px,2.2vw,36px)/1 var(--om-d);text-transform:uppercase;letter-spacing:.01em}
.om-person-n{font:500 11px var(--om-mono);letter-spacing:.08em;color:var(--om-o);white-space:nowrap}
.om-person-n i{font-style:normal;color:var(--om-mute);margin:0 3px}
.om-person p{margin:0;font:600 11px/1.5 var(--om-s);letter-spacing:.14em;text-transform:uppercase;color:var(--om-mute)}
.om-s-end{padding-bottom:40px}

/* ---------------------------------------------------------------- footer */
.om-page footer.om-footer{position:relative;z-index:3;background:#000;color:var(--om-p);padding:clamp(80px,12vh,140px) var(--om-pad) 40px}
.om-footer:before{content:'';position:absolute;left:0;right:0;bottom:100%;height:min(30vh,240px);background:linear-gradient(transparent,#000);pointer-events:none}
.om-3d .om-page footer.om-footer,.om-3d footer.om-footer{background:transparent}
.om-3d .om-footer:before{display:none}
.om-3d .om-footer{text-shadow:0 0 14px #000}
.om-cta{display:inline-block;max-width:100%;margin:0 0 clamp(50px,9vh,90px);font:800 clamp(46px,8.2vw,150px)/.86 var(--om-d);text-transform:uppercase;transition:color .4s}
.om-cta b{display:inline-block;margin-left:.18em;font:300 .7em/1 var(--om-s);color:var(--om-o);transition:transform .5s var(--om-ease)}
.om-cta:hover,.om-cta:focus-visible{color:var(--om-o)}
.om-cta:hover b,.om-cta:focus-visible b{transform:translate(.08em,-.08em)}
.om-cta:focus-visible{outline-offset:10px}
.om-contacts{list-style:none;margin:0;padding:28px 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;border-top:1px solid var(--om-line)}
.om-contacts li{min-width:0;display:flex;flex-direction:column;gap:10px;font-size:16px;line-height:1.5}
.om-label{font:600 10.5px var(--om-s);letter-spacing:.16em;text-transform:uppercase;color:var(--om-mute)}
.om-contacts a{align-self:flex-start;overflow-wrap:anywhere;border-bottom:1px solid #ffffff38;transition:color .3s,border-color .3s}
.om-contacts a:hover,.om-contacts a:focus-visible{color:var(--om-o);border-color:var(--om-o)}
.om-legal{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px 24px;margin-top:64px;padding-right:76px;font:600 10.5px/1.6 var(--om-s);letter-spacing:.14em;color:var(--om-mute)}
.om-legal a{display:inline-flex;align-items:center;min-height:44px;color:var(--om-p)}

/* ================================================================ FLIGHT MODE */
html.om-3d{scroll-behavior:auto}
.om-3d body{overflow-x:clip}
.om-3d .om-dust{display:block;position:fixed;left:0;top:0;width:100%;height:100%;z-index:0;pointer-events:none;background:#000}
.om-3d .om-canvas{display:block;position:fixed;left:0;top:0;width:100%;height:100%;z-index:0;pointer-events:none;background:transparent;opacity:0;transition:opacity 1.2s ease}
.om-live .om-canvas{opacity:1}
/* the orange glow behind the statue on the hero: between the star dust and the scene, it only adds light (oltre.js moves it) */
.om-glow{display:none}
.om-3d .om-glow{display:block;position:fixed;left:0;top:0;width:100px;height:100px;z-index:0;pointer-events:none;opacity:0;visibility:hidden;border-radius:50%;transform-origin:0 0;mix-blend-mode:screen;will-change:transform,opacity;background:radial-gradient(circle,rgba(255,103,37,.4) 0,rgba(255,90,30,.18) 30%,rgba(255,80,25,.06) 52%,rgba(255,80,25,0) 70%)}
.om-3d .om-main{position:relative;z-index:2}
.om-3d .om-sec{height:calc(var(--h) * 100svh);min-height:0;padding:0;display:block}
.om-3d .om-layer{--o:0;position:fixed;inset:0;z-index:2;pointer-events:none;padding:0;margin:0}
.om-3d .om-layer:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:var(--o)}
.om-3d .om-media,.om-3d .om-oltre-word{display:none}
.om-3d .om-mani-h{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.om-3d .om-fx,.om-3d .om-svc,.om-3d .om-person{opacity:var(--o,0);transform:translate3d(0,calc((1 - var(--o,0)) * var(--sh,16px)),0);pointer-events:none;will-change:opacity,transform}
.om-3d .om-fx.is-past,.om-3d .om-svc.is-past{transform:translate3d(0,calc((var(--o,0) - 1) * var(--sh,16px)),0)}
.om-3d .om-svc,.om-3d .om-svc-head{--sh:34px}
.om-3d .is-on,.om-3d .is-on a{pointer-events:auto}
.om-3d .om-fx a,.om-3d .om-svc a{pointer-events:inherit}
.om-3d .om-caption,.om-3d .om-lead,.om-3d .om-body,.om-3d .om-eyebrow,.om-3d .om-svc-d,.om-3d .om-svc-n,.om-3d .om-person p{text-shadow:0 0 18px #000,0 0 6px #000}

/* hero */
.om-3d [data-layer=hero]{--o:1;opacity:var(--o)}
.om-3d [data-layer=hero]:before{background:linear-gradient(90deg,#000000c4 0%,#00000080 30%,transparent 54%)}
.om-3d .om-hero-copy{position:absolute;left:var(--om-hpad);bottom:82px;width:min(54vw,800px);max-width:min(54vw,800px);pointer-events:none;transform:translate3d(0,calc((1 - var(--o)) * -40px),0)}
.om-3d .om-line{animation:om-rise 1.15s var(--om-ease) backwards}
.om-3d .om-line:nth-child(2){animation-delay:.09s}.om-3d .om-line:nth-child(3){animation-delay:.18s}
.om-3d .om-tagline{animation:om-fade 1.2s .45s var(--om-ease) backwards}
.om-3d .om-hero-foot{animation:om-fade 1.2s .7s var(--om-ease) backwards}
/* cursor of Materia viva (ring + dot) and the shockwave ring */
.om-cursor-on .om-cursor{display:block;position:fixed;left:0;top:0;z-index:1001;pointer-events:none;opacity:0;transition:opacity .3s}
.om-cursor>span{position:absolute;left:0;top:0;will-change:transform}
.om-cursor-dot{width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:var(--om-o)}
.om-cursor-ring{width:38px;height:38px;margin:-19px 0 0 -19px;border-radius:50%;border:1px solid #f3f0e9a8;transition:width .35s var(--om-ease),height .35s var(--om-ease),margin .35s var(--om-ease),border-color .35s}
.om-cursor.is-link .om-cursor-ring{width:60px;height:60px;margin:-30px 0 0 -30px;border-color:var(--om-o)}
.om-cursor.is-coin .om-cursor-ring{width:50px;height:50px;margin:-25px 0 0 -25px}
html.om-cursor-on,html.om-cursor-on body,html.om-cursor-on body *{cursor:none!important}
html.om-cursor-on .janus-menu,html.om-cursor-on .janus-menu *{cursor:auto!important}
html.om-cursor-on .janus-menu a,html.om-cursor-on .janus-menu button{cursor:pointer!important}
.om-cursor-on body>.cursor-ring{display:none!important}
.menu-open .om-cursor{visibility:hidden}
.om-3d .om-wave{display:block;position:fixed;left:0;top:0;z-index:4;pointer-events:none;overflow:visible}
.om-wave circle{fill:none;stroke:var(--om-o);vector-effect:non-scaling-stroke}
@keyframes om-rise{from{opacity:0;transform:translateY(.42em)}}
@keyframes om-fade{from{opacity:0;transform:translateY(14px)}}

/* captions (dissolve / oltre) */
.om-3d .om-s-dissolve .om-caption,.om-3d .om-s-oltre .om-caption{position:absolute;left:var(--om-pad);right:var(--om-pad);bottom:clamp(46px,10vh,110px)}
.om-3d .om-s-dissolve .om-layer:before,.om-3d .om-s-oltre .om-layer:before{background:linear-gradient(180deg,transparent 62%,#000000b0 100%)}

/* side scrim: text on the left, matter on the right */
.om-3d .om-scrim-side:before{background:linear-gradient(90deg,#000 0%,#000000f2 30%,#000000b3 44%,transparent 60%)}
.om-3d .om-scrim-low:before{background:linear-gradient(180deg,transparent 52%,#000000c8 82%,#000000e6 100%)}

/* studio */
.om-3d .om-s-studio .om-layer{display:flex;align-items:center;padding:110px var(--om-pad) 60px}
.om-3d .om-s-studio .om-copy{max-width:min(40vw,600px)}
.om-3d .om-face{display:flex;align-items:center;gap:14px;position:absolute;left:0;top:0;margin:0;font:600 11px var(--om-s);letter-spacing:.2em;text-transform:uppercase;white-space:nowrap;opacity:var(--o,0);will-change:transform,opacity;text-shadow:0 0 12px #000}
.om-face-sep{width:46px;height:1px;background:#ffffff59;position:relative;overflow:hidden}
.om-face-sep:after{content:'';position:absolute;inset:0;background:var(--om-o);transform:scaleX(var(--f,0));transform-origin:0 50%}
.om-face-past{color:var(--om-p)}
.om-face-future{color:#ffffff59;transition:color .4s}
.om-face.is-future .om-face-past{color:#ffffff59}
.om-face.is-future .om-face-future{color:var(--om-o)}

/* services: head and the 7 panels share one grid cell */
.om-3d .om-s-svc .om-layer{display:grid;grid-template-columns:minmax(0,min(40vw,560px));align-content:center;padding:110px var(--om-pad) 60px}
.om-3d .om-svc-list{display:contents}
.om-3d .om-svc-head,.om-3d .om-svc{grid-area:1/1;align-self:center;margin:0}
.om-3d .om-svc{padding:0;border:0}
.om-3d .om-svc .om-h3{font-size:clamp(34px,min(3.8vw,7vh),64px)}
.om-3d .om-svc-head .om-h2{font-size:clamp(48px,min(6.2vw,11vh),112px)}
.om-3d .om-svc-head{width:min(50vw,820px);justify-self:start}

/* projects: captions follow the planes (positioned by oltre.js) */
.om-3d .om-work-head{position:absolute;left:var(--om-pad);top:clamp(100px,15vh,150px);margin:0}
.om-3d .om-s-work .om-layer:before{background:radial-gradient(ellipse 70% 60% at 50% 50%,transparent 60%,#00000066 100%)}
.om-3d .om-works{display:block}
.om-3d .om-page .om-work,.om-3d .om-work{position:absolute;left:0;top:0;margin:0;opacity:var(--o,0);will-change:transform,opacity;pointer-events:none}
.om-3d .om-page .om-work-cap,.om-3d .om-work-cap{display:grid;grid-template-columns:auto auto;align-items:baseline;gap:2px 12px;margin:0;padding:10px 14px 11px;border:0;background:linear-gradient(90deg,#000000d9,#00000080);border-left:2px solid var(--om-o)}
.om-3d .om-work-cap h3{grid-column:2}
.om-3d .om-work-n{grid-row:1;grid-column:1}
.om-3d .om-work-c{grid-column:2}

/* manifesto */
.om-3d .om-mani-k{position:absolute;left:0;right:0;top:clamp(96px,14vh,140px);justify-content:center;margin:0}
.om-3d .om-mani-foot{position:absolute;left:var(--om-pad);right:var(--om-pad);bottom:clamp(40px,9vh,96px);margin:0;text-align:center;text-shadow:0 0 14px #000}

/* team */
.om-3d .om-team-head{position:absolute;left:var(--om-pad);right:var(--om-pad);bottom:clamp(40px,9vh,100px);max-width:none;margin:0;text-align:center}
.om-3d .om-team-head .om-eyebrow{justify-content:center}
.om-3d .om-team-head .om-lead{margin-left:auto;margin-right:auto}
.om-3d .om-people{display:grid;position:absolute;left:var(--om-pad);right:var(--om-pad);bottom:clamp(40px,8vh,90px);grid-template-columns:1fr;justify-items:center;text-align:center}
.om-3d .om-person{grid-area:1/1}
.om-3d .om-person-line{justify-content:center;margin:0 0 10px;gap:6px 16px}
.om-3d .om-page .om-person h3,.om-3d .om-person h3{margin:0;font-size:clamp(40px,min(5vw,9vh),84px);line-height:.9}
.om-3d .om-person-n{font-size:12px}
.om-3d .om-team-head{opacity:var(--o,0);transform:translate3d(0,calc((1 - var(--o,0)) * 16px),0);pointer-events:none}
.om-3d .om-team-head .om-h2{font-size:clamp(44px,min(5.6vw,10vh),100px)}
.om-3d .om-person p{font-size:12px}

/* arrival */
.om-3d .om-end{position:absolute;left:var(--om-pad);right:var(--om-pad);bottom:clamp(40px,9vh,100px);text-align:center}
.om-3d .om-end .om-eyebrow{justify-content:center}
.om-3d .om-end .om-h2{font-size:clamp(40px,min(5vw,9vh),88px)}

/* stage index: discreet dots on the right edge, always fully inside the screen */
.om-3d .om-page nav.om-index,.om-3d nav.om-index{display:block;position:fixed;right:max(12px,1.1vw);top:50%;z-index:50;transform:translateY(-50%);gap:0;font-size:inherit;opacity:0;transition:opacity .8s ease}
.om-live .om-page nav.om-index,.om-live nav.om-index{opacity:1}
.om-index ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.om-index a{display:flex;align-items:center;justify-content:flex-end;gap:12px;min-height:30px;padding:0 6px 0 10px;font:600 10px var(--om-s);letter-spacing:.16em;text-transform:uppercase;color:var(--om-p)}
.om-index a:after{display:none}
.om-index i{display:block;width:7px;height:7px;border-radius:50%;border:1px solid #ffffff8c;background:transparent;transition:background .3s,border-color .3s,transform .4s var(--om-ease)}
.om-index-t{opacity:0;transform:translateX(6px);transition:opacity .3s,transform .3s;text-shadow:0 0 10px #000,0 0 3px #000;white-space:nowrap}
.om-index a:hover i,.om-index a:focus-visible i{border-color:var(--om-o)}
.om-index a:hover .om-index-t,.om-index a:focus-visible .om-index-t,.om-index a[aria-current] .om-index-t{opacity:1;transform:none}
.om-index a[aria-current] i{background:var(--om-o);border-color:var(--om-o);transform:scale(1.35)}
.om-index a:focus-visible{outline:none}
.om-index a:focus-visible i{outline:2px solid var(--om-o);outline-offset:4px}
.menu-open .om-index{visibility:hidden}

/* ---------------------------------------------------------------- portrait screens (phones, tablets upright) */
@media (max-aspect-ratio:19/20){
  .om-3d [data-layer=hero]:before{background:linear-gradient(180deg,transparent 46%,#000000b8 66%,#000000eb 100%)}
  .om-3d .om-hero-copy{left:var(--om-hpad);right:var(--om-hpad);bottom:76px;width:auto;max-width:none}
  .om-3d .om-team-head .om-h2{font-size:clamp(36px,min(10vw,6.4vh),76px)}
  .om-3d .om-scrim-side:before{background:linear-gradient(180deg,transparent 30%,#000000d0 44%,#000000f5 56%,#000 100%)}
  .om-3d .om-s-studio .om-layer,.om-3d .om-s-svc .om-layer{align-items:flex-end;align-content:end;padding:100px var(--om-pad) clamp(26px,5vh,60px)}
  .om-3d .om-s-studio .om-copy{max-width:640px;display:grid;align-items:end}
  .om-3d .om-copy-a,.om-3d .om-copy-b{grid-area:1/1}
  .om-3d .om-s-studio .om-body{font-size:16px;line-height:1.65;color:#e9e5dc}
  .om-3d .om-face{display:none}
  .om-3d .om-svc,.om-3d .om-svc-head,.om-3d .om-copy-a,.om-3d .om-copy-b{position:relative;isolation:isolate}
  .om-3d .om-svc:before,.om-3d .om-svc-head:before,.om-3d .om-copy-a:before,.om-3d .om-copy-b:before{content:'';position:absolute;z-index:-1;left:calc(var(--om-pad) * -1);right:calc(var(--om-pad) * -1);top:-56px;bottom:-240px;background:linear-gradient(180deg,transparent,#000000eb 56px,#000 100%);pointer-events:none}
  .om-3d .om-s-dissolve .om-caption,.om-3d .om-s-oltre .om-caption,.om-3d .om-mani-foot{bottom:clamp(96px,14vh,130px)}
  .om-3d .om-s-svc .om-layer{grid-template-columns:minmax(0,640px)}
  .om-3d .om-svc-head,.om-3d .om-svc{align-self:end}
  .om-3d .om-svc-head{width:auto}
  .om-3d .om-page .om-svc-head .om-h2,.om-3d .om-svc-head .om-h2{font-size:clamp(46px,min(13vw,7.4vh),84px)}
  .om-3d .om-work-head{top:auto;bottom:clamp(30px,6vh,70px)}
  .om-3d .om-s-work .om-layer:before{background:linear-gradient(180deg,transparent 60%,#000000c0 100%)}
  .om-3d .om-team-head{right:var(--om-pad);max-width:none}
  .om-3d .om-end .om-h2{font-size:clamp(36px,min(10vw,6.4vh),80px)}
  .om-3d .om-page .om-h2,.om-3d .om-h2{font-size:clamp(36px,min(8.4vw,6vh),76px)}
  .om-3d .om-svc .om-h3{font-size:clamp(30px,min(7vw,5vh),60px)}
}
@media (max-width:699px),(max-height:520px),(max-aspect-ratio:19/20){
  .om-3d nav.om-index,.om-3d .om-page nav.om-index{display:none}
}
@media (max-width:699px) and (max-aspect-ratio:19/20){
  .om-3d .om-s-studio .om-layer,.om-3d .om-s-svc .om-layer{padding-bottom:max(84px,calc(env(safe-area-inset-bottom) + 76px))}
  .om-3d .om-end,.om-3d .om-people,.om-3d .om-team-head,.om-3d .om-work-head{bottom:max(88px,calc(env(safe-area-inset-bottom) + 80px))}
}
@media (max-width:699px){
  .om-page .om-h2{font-size:clamp(36px,10.6vw,58px)}
  .om-page .om-h3{font-size:clamp(30px,8.8vw,46px)}
  .om-lead{font-size:16.5px;margin-top:16px}
  .om-body{font-size:15px;line-height:1.6;margin-top:12px}
  .om-link{margin-top:12px}
  .om-eyebrow{margin-bottom:16px;font-size:10px}
  .om-svc-d{font-size:15px;line-height:1.55;margin-top:12px}
  .om-tags{margin-top:14px;gap:6px}
  .om-tags li{font-size:9.5px;padding:5px 10px}
  .om-svc-links{margin-top:8px;gap:0 20px}
  .om-3d .om-svc .om-h3{font-size:clamp(30px,8.8vw,44px)}
  .om-3d .om-work-cap h3{font-size:24px}
  .om-3d .om-person h3,.om-3d .om-page .om-person h3{font-size:clamp(34px,10vw,52px)}
  .om-3d .om-mani-foot{font-size:11px}
  .om-caption{font-size:clamp(22px,6.4vw,30px)}
  /* static fallback */
  .om-s-hero .om-layer,.om-s-studio .om-layer{grid-template-columns:minmax(0,1fr);gap:28px}
  .om-hero-media{order:0;max-width:340px;justify-self:center}
  .om-svc-list,.om-works{grid-template-columns:minmax(0,1fr);gap:44px}
  .om-page .om-work:nth-child(even){margin-top:0}
  .om-people{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 18px}
  .om-page .om-person h3{font-size:22px;margin-top:14px}
  .om-person p{font-size:10px;letter-spacing:.1em}
  .om-contacts{grid-template-columns:minmax(0,1fr);gap:22px}
  .om-legal{padding-bottom:84px}
  .om-cta{font-size:clamp(40px,12.4vw,64px)}
}
@media (min-width:700px) and (max-width:1100px){
  .om-contacts{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-height:620px) and (min-aspect-ratio:19/20){
  .om-3d .om-s-studio .om-body{display:none}
  .om-3d .om-svc-d{font-size:14px;line-height:1.5}
  .om-3d .om-s-svc .om-layer,.om-3d .om-s-studio .om-layer{padding-top:84px;padding-bottom:24px}
  .om-3d .om-svc .om-h3{font-size:clamp(28px,6vh,44px)}
  .om-3d .om-lead{font-size:15px}
}

/* ---------------------------------------------------------------- reduced motion */
.motion-off .om-line,.motion-off .om-tagline,.motion-off .om-hero-foot{animation:none}
.motion-off .om-ch{filter:none!important;transform:none!important}
.motion-off .om-scroll-dot:after{opacity:1;transform:translateY(9px)}

/* hero on phones and upright tablets: the same layout as «Materia viva» (≤899px): a square stage on top, the copy below */
@media (max-width:899px) and (max-aspect-ratio:19/20){
  .om-page .om-title{font-size:clamp(54px,11.6vw,104px);margin:16px 0 22px}
  .om-hero-foot{margin-top:30px}
  .om-3d .om-tagline{text-shadow:0 0 14px #000,0 0 4px #000}
  .om-3d [data-layer=hero]{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:0;padding:86px var(--om-hpad) 76px}
  .om-3d [data-layer=hero] .om-hero-media{order:0;display:block;visibility:hidden;width:min(84vw,48svh);max-width:none;aspect-ratio:1;margin:0 auto;flex:none}
  .om-3d [data-layer=hero] .om-hero-copy{order:1}
  .om-3d [data-layer=hero] .om-hero-copy{position:relative;left:auto;right:auto;bottom:auto;width:auto;max-width:none;margin-top:auto;padding-top:26px}
}
@media (max-width:560px) and (max-aspect-ratio:19/20){
  .om-kicker{font-size:10px}
  .om-hero-foot{gap:10px 22px}
  .om-3d [data-layer=hero]{padding-top:80px}
  .om-3d [data-layer=hero] .om-hero-media{width:min(88vw,46svh)}
}
/* mobile: tocco e leggibilità */
@media (max-width:699px){
  .om-tags li{font-size:11px;padding:6px 11px}
  .om-eyebrow,.om-label{font-size:11px}
  .om-contacts a{display:inline-block;padding:10px 0}
  .om-kicker,.om-legal,.om-person p{font-size:11px}
}
/* Google Partner nel footer della home */
.om-partner{display:flex;align-items:center;gap:14px;margin:48px 0 0;font:600 11px/1.5 var(--om-s);letter-spacing:.14em;text-transform:uppercase;color:var(--om-mute)}
.om-partner .sj-gp-foot{display:block;width:76px;height:auto;border-radius:6px}
.sj-gp-link{display:inline-block;line-height:0;border-radius:6px;transition:transform .3s}.sj-gp-link:hover{transform:translateY(-2px)}.sj-gp-link:focus-visible{outline:2px solid var(--orange,#ff6725);outline-offset:4px}
.om-social a{display:inline-block}