:root {
  --navy: #17177f;
  --navy-deep: #10115f;
  --blue: #416fe0;
  --sky: #64bce8;
  --periwinkle: #8aa5ed;
  --gold: #efe05b;
  --green: #a8d79a;
  --paper: #fffdf9;
  --ink: #15166f;
  --muted: #6f7596;
  --white: #ffffff;
  --shell: min(1180px, calc(100vw - 48px));
  --shadow: 0 24px 70px rgba(10, 14, 74, .18);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: "Montserrat", Arial, sans-serif; color: var(--ink); background: var(--white); overflow-x: hidden; }
body.modal-open { overflow: hidden; }
a { color: inherit; }
button, input, textarea { font: inherit; }
button { color: inherit; }
img { max-width: 100%; display: block; }
.shell { width: var(--shell); margin-inline: auto; }
.skip-link { position: fixed; left: 14px; top: -60px; z-index: 1000; background: #fff; color: var(--ink); padding: 10px 14px; border-radius: 8px; transition: .2s; }
.skip-link:focus { top: 14px; }

.site-header { position: fixed; z-index: 50; inset: 0 0 auto; color: #fff; transition: background .25s ease, box-shadow .25s ease; }
.site-header.scrolled { background: rgba(17, 17, 95, .96); box-shadow: 0 8px 30px rgba(0,0,0,.12); backdrop-filter: blur(14px); }
.header-inner { height: 92px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand img { width: 112px; height: auto; }
.desktop-nav { display: flex; align-items: center; gap: 28px; }
.desktop-nav a { color: #fff; text-decoration: none; text-transform: uppercase; font-size: .76rem; font-weight: 600; letter-spacing: .08em; position: relative; }
.desktop-nav a::after { content:""; position:absolute; left:0; right:100%; bottom:-8px; height:1px; background:var(--gold); transition:.25s; }
.desktop-nav a:hover::after { right:0; }
.menu-toggle { display:none; width:44px; height:44px; border:0; background:transparent; padding:10px; cursor:pointer; }
.menu-toggle span { display:block; width:100%; height:2px; background:#fff; margin:7px 0; transition:.2s; }
.mobile-nav { display:none; }

.hero { min-height: 880px; height: 100svh; position: relative; display:grid; place-items:center; overflow:hidden; background:#667b89; color:#fff; }
.hero-media, .contact-bg, .associates-bg { position:absolute; inset:0; }
.image-slot { overflow:hidden; position:relative; background: linear-gradient(135deg, #7d91a0 0%, #bac6bf 46%, #758877 100%); }
.image-slot::before { content: attr(data-image-label); position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); padding:9px 14px; border:1px solid rgba(255,255,255,.65); color:rgba(255,255,255,.85); font-size:.66rem; letter-spacing:.12em; white-space:nowrap; z-index:2; }
.image-slot::after { content:""; position:absolute; inset:0; background: linear-gradient(135deg, transparent 0 48%, rgba(255,255,255,.06) 48% 52%, transparent 52% 100%); background-size:80px 80px; }
.hero-shade { position:absolute; inset:0; background: linear-gradient(180deg, rgba(10, 15, 45,.28), rgba(8, 15, 54,.50)); }
.hero-content { position:relative; z-index:2; text-align:center; max-width:940px; display:flex; flex-direction:column; align-items:center; }
.hero-logo { width:min(310px, 54vw); margin-bottom:30px; filter:drop-shadow(0 5px 22px rgba(0,0,0,.10)); }
.eyebrow { margin:0 0 12px; text-transform:uppercase; letter-spacing:.16em; font-size:.72rem; font-weight:700; }
.eyebrow--light { color:rgba(255,255,255,.82); }
.eyebrow--gold { color:#d6bd26; }
.eyebrow--blue { color:var(--blue); }
.hero h1 { margin:0; font-size:clamp(2.5rem, 5vw, 5rem); line-height:1.02; text-transform:uppercase; letter-spacing:-.035em; font-weight:600; }
.hero-copy { max-width:760px; margin:24px auto 30px; font-size:clamp(1rem, 1.4vw, 1.25rem); line-height:1.65; color:rgba(255,255,255,.9); }
.button { display:inline-flex; align-items:center; justify-content:center; border-radius:6px; min-height:48px; padding:0 26px; text-decoration:none; border:1.5px solid transparent; font-weight:600; font-size:.88rem; transition:transform .2s ease, background .2s ease, color .2s ease; cursor:pointer; }
.button:hover { transform:translateY(-2px); }
.button--outline { border-color:var(--gold); color:#fff; background:rgba(23,23,127,.45); }
.button--outline:hover { background:var(--gold); color:var(--navy-deep); }
.button--solid { background:#2868ce; color:#fff; min-width:180px; }
.scroll-cue { position:absolute; z-index:3; bottom:30px; width:24px; height:38px; border:1px solid rgba(255,255,255,.65); border-radius:20px; }
.scroll-cue span { display:block; width:3px; height:7px; border-radius:3px; background:#fff; margin:8px auto; animation:scrollDot 1.5s infinite; }
@keyframes scrollDot { 0%,100%{transform:translateY(0);opacity:.4} 50%{transform:translateY(12px);opacity:1} }

.section-blue { background:var(--navy); color:#fff; }
.about { position:relative; padding:150px 0 175px; overflow:hidden; }
.flow-line { position:absolute; left:-5%; width:110%; height:80px; transform:skewY(-2deg); }
.flow-line--top { top:-35px; background:linear-gradient(180deg,#5d85e4,#92a8e5); }
.flow-line--bottom { bottom:-36px; background:linear-gradient(180deg,#426ed4,#a9addc); }
.about-stack { display:grid; gap:90px; position:relative; z-index:2; }
.content-card { width:min(880px, 84%); background:var(--paper); color:var(--ink); border-radius:12px; padding:48px 54px; display:flex; align-items:center; gap:48px; box-shadow:var(--shadow); border:2px solid rgba(71,111,224,.65); }
.content-card--right { margin-left:auto; border-color:rgba(239,224,91,.8); }
.content-card__copy { flex:1; }
.content-card h2 { margin:0 0 24px; font-family:"Oswald", sans-serif; font-weight:500; color:var(--blue); font-size:clamp(1.75rem,3vw,2.5rem); }
.content-card--left h2 { color:#d6bd26; }
.content-card p:not(.eyebrow) { font-size:.95rem; line-height:1.7; margin:0 0 19px; }
.signature-mark { width:180px; height:140px; position:relative; flex:0 0 auto; display:grid; place-items:center; }
.signature-mark span { font-size:3.6rem; letter-spacing:.1em; color:#27a6d5; font-weight:400; }
.signature-mark i { position:absolute; width:55px; height:55px; border:5px solid var(--gold); border-radius:50%; left:22px; transform:skew(-12deg); }
.molecule-art { width:180px; height:120px; position:relative; flex:0 0 auto; }
.molecule-art span { position:absolute; height:2px; background:#121212; width:62px; transform-origin:left center; }
.molecule-art span:nth-child(1){left:24px;top:65px;transform:rotate(-58deg)} .molecule-art span:nth-child(2){left:55px;top:40px;transform:rotate(35deg)} .molecule-art span:nth-child(3){left:104px;top:60px;transform:rotate(-65deg)} .molecule-art span:nth-child(4){left:120px;top:60px;transform:rotate(60deg)}

.sectors { background:linear-gradient(135deg,#396fd0 0%,#b9bae0 100%); padding-top:110px; }
.sectors-intro { width:min(920px, calc(100% - 48px)); margin:0 auto 70px; text-align:center; color:#fff; }
.sectors-intro h2 { margin:0 0 14px; color:var(--gold); font-weight:500; font-size:clamp(2.2rem,4.5vw,4.7rem); letter-spacing:-.03em; }
.sectors-intro p:not(.eyebrow) { max-width:780px; margin:0 auto; font-size:1.06rem; line-height:1.6; }
.sector-grid { display:grid; grid-template-columns:repeat(12,1fr); }
.sector-tile { min-height:300px; border:0; position:relative; padding:0; text-align:left; cursor:pointer; color:#fff; overflow:hidden; }
.sector-tile:nth-child(-n+4) { grid-column:span 3; }
.sector-tile:nth-child(n+5) { grid-column:span 4; min-height:270px; }
.sector-tile .image-slot { position:absolute; inset:0; transition:transform .45s cubic-bezier(.22,.61,.36,1); }
.sector-tile .image-slot::before { opacity:.7; }
.sector-tile:hover .image-slot { transform:scale(1.035); }
.sector-overlay { position:absolute; inset:0; background:rgba(91,75,107,.38); mix-blend-mode:multiply; transition:.25s; }
.sector-tile--rifiuti .sector-overlay{background:rgba(151,85,92,.42)} .sector-tile--industria .sector-overlay{background:rgba(67,56,190,.45)} .sector-tile--energia .sector-overlay{background:rgba(191,83,76,.43)} .sector-tile--lavoro .sector-overlay{background:rgba(162,76,210,.39)} .sector-tile--legale .sector-overlay{background:rgba(193,155,55,.43)} .sector-tile--componenti .sector-overlay{background:rgba(128,188,182,.44)}
.sector-tile:hover .sector-overlay { opacity:.78; }
.sector-body { position:absolute; inset:auto 42px 38px; z-index:3; display:flex; flex-direction:column; gap:18px; }
.sector-body b { font-family:"Oswald", sans-serif; text-transform:uppercase; font-size:1.42rem; line-height:1.2; letter-spacing:.04em; font-weight:500; max-width:290px; }
.sector-body i { font-size:2.4rem; font-style:normal; line-height:1; font-weight:300; transition:transform .2s; }
.sector-tile:hover .sector-body i { transform:translateX(8px); }

.foundations { padding:145px 0 130px; background:#fff; }
.foundations-heading { display:flex; align-items:center; justify-content:center; gap:30px; margin-bottom:65px; }
.foundations-heading img { width:180px; }
.dot-rule { width:150px; border-top:4px dotted #2e67d2; }
.foundations-heading h2 { margin:0; font-family:"Oswald",sans-serif; font-size:clamp(2rem,3.6vw,3.7rem); font-weight:500; }
.foundations-heading h2 em { font-style:normal; position:relative; }
.foundations-heading h2 em::after { content:""; position:absolute; width:55px; height:55px; border-radius:50%; background:rgba(122,194,109,.55); left:25%; top:50%; transform:translate(-50%,-50%); z-index:-1; }
.foundation-orbit { position:relative; min-height:690px; max-width:1100px; margin:auto; }
.foundation-core { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:280px; height:280px; border:1px solid rgba(47,103,210,.22); border-radius:50%; display:grid; place-items:center; align-content:center; box-shadow:inset 0 0 0 30px rgba(65,111,224,.035); }
.foundation-core::before,.foundation-core::after { content:""; position:absolute; border:1px dashed rgba(47,103,210,.16); border-radius:50%; }
.foundation-core::before{inset:-65px}.foundation-core::after{inset:-130px}
.foundation-core span { font-size:3rem; letter-spacing:.08em; color:#aea4a9; }
.foundation-core small { margin-top:8px; font-size:.65rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.foundation-point { position:absolute; width:280px; text-align:center; font-size:.85rem; line-height:1.55; color:var(--ink); }
.foundation-point span { display:inline-grid; place-items:center; width:38px; height:38px; border:1px solid rgba(47,103,210,.35); border-radius:50%; color:var(--blue); font-weight:700; font-size:.74rem; margin-bottom:8px; background:#fff; }
.foundation-point p { margin:0; }
.foundation-point--1 { left:4%; top:3%; } .foundation-point--2 { right:4%; top:3%; } .foundation-point--3 { right:0; top:44%; } .foundation-point--4 { right:12%; bottom:0; } .foundation-point--5 { left:12%; bottom:0; }

.associates { min-height:650px; position:relative; display:flex; align-items:center; color:#fff; overflow:hidden; }
.associates-bg { background:linear-gradient(135deg,#d9d9dc,#8f9399); }
.associates-shade { position:absolute; inset:0; background:rgba(16,17,95,.34); }
.associates-content { position:relative; z-index:2; padding-block:90px; }
.associates h2 { margin:0 0 55px; font-size:clamp(2rem,4vw,3.8rem); text-transform:uppercase; }
.logo-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
.logo-placeholder { min-height:155px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:20px; border:1px solid rgba(255,255,255,.34); background:rgba(255,255,255,.13); backdrop-filter:blur(8px); }
.logo-placeholder strong { font-size:1.1rem; } .logo-placeholder span { font-size:.72rem; margin-top:7px; color:rgba(255,255,255,.75); }

.collaborations { padding:120px 0; text-align:center; }
.collaborations h2 { font-size:clamp(2.3rem,4vw,4rem); margin:0 0 26px; text-transform:uppercase; }
.lead { max-width:760px; margin:0 auto 70px; font-size:1.18rem; line-height:1.6; }
.client-logos { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; align-items:center; max-width:940px; margin:auto; }
.client-logo { min-height:120px; display:grid; place-items:center; align-content:center; border:1px solid #e4e6ef; padding:20px; font-weight:600; color:#2b3570; }
.client-logo small { display:block; margin-top:5px; font-weight:400; }
.client-logo--brand { font-size:2.2rem; color:#d5232b; font-style:italic; border-radius:999px; }
.more { margin:55px 0 0; font-weight:700; font-size:1.3rem; }

.profile { padding:110px 0; }
.profile-grid { display:grid; grid-template-columns:320px 1fr; gap:80px; align-items:center; }
.profile-mark { min-height:230px; display:grid; place-items:center; align-content:center; position:relative; font-style:italic; }
.profile-mark span,.profile-mark strong { position:relative; z-index:2; font-size:2rem; font-weight:400; }
.profile-mark i { position:absolute; width:230px; height:26px; background:var(--gold); transform:rotate(-4deg); top:48%; }
.profile-copy h2 { margin:0 0 22px; font-size:clamp(2rem,3.5vw,3.6rem); }
.profile-copy p:not(.eyebrow) { max-width:760px; line-height:1.7; color:rgba(255,255,255,.88); }

.contact { min-height:590px; position:relative; display:flex; align-items:center; color:#fff; overflow:hidden; }
.contact-bg { background:linear-gradient(180deg,#99caec 0%,#92b0ce 35%,#526e88 100%); }
.contact-shade { position:absolute; inset:0; background:rgba(42,93,156,.31); }
.contact-grid { position:relative; z-index:2; display:grid; grid-template-columns:.85fr 1.15fr; gap:70px; align-items:start; padding:85px 0; }
.contact-copy h2 { font-size:clamp(2.6rem,5vw,5rem); margin:0 0 20px; }
.contact-copy p:not(.eyebrow) { max-width:440px; line-height:1.7; }
.contact-form { background:rgba(255,255,255,.72); color:#1a4b9c; padding:34px; backdrop-filter:blur(9px); box-shadow:var(--shadow); }
.contact-form label { display:grid; gap:8px; font-size:.73rem; font-weight:600; margin-bottom:18px; }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.contact-form input,.contact-form textarea { width:100%; border:0; border-radius:9px; background:rgba(244,246,255,.9); min-height:46px; padding:12px 14px; outline:none; color:#1d266b; border:1px solid transparent; }
.contact-form textarea { resize:vertical; min-height:100px; }
.contact-form input:focus,.contact-form textarea:focus { border-color:#4f83d7; box-shadow:0 0 0 3px rgba(79,131,215,.15); }
.privacy-check { display:flex !important; grid-template-columns:none; align-items:flex-start; gap:10px !important; color:#4c6093; font-weight:400 !important; line-height:1.4; }
.privacy-check input { width:16px; min-height:16px; margin-top:1px; }
.form-status { margin:12px 0 0; min-height:1.2em; color:#284a8d; font-size:.75rem; }

.site-footer { background:var(--navy); color:#fff; padding:70px 0 24px; }
.footer-grid { display:grid; grid-template-columns:.8fr 1fr 1.35fr .8fr; gap:50px; }
.footer-logo { width:150px; }
.site-footer h3 { margin:0 0 15px; font-size:1.1rem; font-weight:600; }
.site-footer p { margin:0; line-height:1.75; font-size:.78rem; color:rgba(255,255,255,.78); }
.site-footer a { text-decoration:none; }
.footer-links { display:flex; gap:18px; margin-top:18px; font-size:.78rem; text-transform:uppercase; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.16); margin-top:52px; padding-top:22px; display:flex; justify-content:space-between; color:rgba(255,255,255,.6); font-size:.72rem; }

.modal { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:28px; opacity:0; pointer-events:none; transition:.22s; }
.modal.open { opacity:1; pointer-events:auto; }
.modal-backdrop { position:absolute; inset:0; background:rgba(10,14,45,.88); backdrop-filter:blur(5px); }
.modal-dialog { width:min(860px,100%); background:#fffaf5; position:relative; z-index:2; padding:62px 70px; color:var(--ink); box-shadow:0 30px 100px rgba(0,0,0,.34); transform:translateY(15px) scale(.99); transition:.22s; }
.modal.open .modal-dialog { transform:none; }
.modal-close { position:absolute; right:20px; top:13px; font-size:2.5rem; line-height:1; border:0; background:transparent; cursor:pointer; color:#394578; }
.modal-icon { width:70px; height:70px; border:3px solid #50bfe8; border-radius:50% 50% 44% 48%; margin-bottom:24px; position:relative; }
.modal-icon::before,.modal-icon::after { content:""; position:absolute; width:28px; height:4px; background:#50bfe8; left:18px; }
.modal-icon::before{top:20px}.modal-icon::after{top:37px}
.modal h2 { font-size:clamp(2rem,4vw,3.8rem); margin:0 0 18px; font-weight:500; }
.modal p:not(.eyebrow) { font-size:1.1rem; line-height:1.65; max-width:700px; }
.modal-meta { display:flex; flex-wrap:wrap; gap:9px; margin-top:28px; }
.modal-meta span { padding:8px 12px; border:1px solid #dfe3ef; font-size:.72rem; border-radius:999px; color:#3a4f8a; background:#fff; }

.reveal { opacity:0; transform:translateY(18px); transition:opacity .65s ease, transform .65s ease; }
.reveal.in-view { opacity:1; transform:none; }

@media (max-width: 1050px) {
  .desktop-nav { gap:16px; }
  .desktop-nav a { font-size:.66rem; }
  .content-card { width:92%; }
  .sector-tile:nth-child(-n+4),.sector-tile:nth-child(n+5){grid-column:span 6; min-height:270px}.sector-tile:last-child{grid-column:span 12}
  .logo-grid{grid-template-columns:repeat(3,1fr)}
  .foundation-orbit { display:grid; grid-template-columns:1fr 1fr; gap:18px; min-height:auto; }
  .foundation-core { position:relative; left:auto; top:auto; transform:none; grid-column:1/-1; margin:10px auto 20px; order:-1; }
  .foundation-core::before,.foundation-core::after{display:none}
  .foundation-point { position:relative; inset:auto !important; width:auto; padding:28px; border:1px solid #e5e9f4; text-align:left; }
  .foundation-point span{float:left;margin-right:14px}
}

@media (max-width: 820px) {
  :root { --shell:min(100% - 32px, 720px); }
  .desktop-nav { display:none; }
  .menu-toggle { display:block; }
  .brand img { width:95px; }
  .header-inner { height:78px; }
  .mobile-nav { display:grid; position:absolute; left:16px; right:16px; top:70px; background:rgba(17,17,95,.98); padding:14px; border:1px solid rgba(255,255,255,.12); opacity:0; transform:translateY(-8px); pointer-events:none; transition:.2s; }
  .mobile-nav.open { opacity:1; transform:none; pointer-events:auto; }
  .mobile-nav a { padding:14px 12px; text-decoration:none; text-transform:uppercase; font-size:.76rem; border-bottom:1px solid rgba(255,255,255,.1); }
  .hero { min-height:720px; }
  .hero h1 br { display:none; }
  .about { padding:120px 0 130px; }
  .content-card,.content-card--right { width:100%; margin:0; padding:34px 28px; display:block; }
  .signature-mark,.molecule-art { margin:25px auto 0; }
  .about-stack { gap:35px; }
  .sectors { padding-top:85px; }
  .sector-grid { display:block; }
  .sector-tile { width:100%; min-height:230px !important; display:block; }
  .sector-body { inset:auto 28px 28px; }
  .foundations { padding:100px 0; }
  .foundations-heading { display:grid; text-align:center; gap:18px; }
  .foundations-heading img{margin:auto}.dot-rule{margin:auto;width:100px}
  .foundation-orbit { grid-template-columns:1fr; }
  .foundation-core { grid-column:auto; width:220px; height:220px; }
  .logo-grid { grid-template-columns:1fr 1fr; }
  .client-logos { grid-template-columns:1fr; gap:14px; }
  .client-logo { min-height:95px; }
  .profile-grid { grid-template-columns:1fr; gap:30px; }
  .profile-mark { min-height:150px; }
  .contact-grid { grid-template-columns:1fr; gap:28px; }
  .field-row { grid-template-columns:1fr; gap:0; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .modal-dialog { padding:52px 28px 34px; }
}

@media (max-width: 520px) {
  :root { --shell:calc(100% - 28px); }
  .hero-logo { width:190px; }
  .hero h1 { font-size:2.45rem; }
  .hero-copy { font-size:.95rem; }
  .sectors-intro { width:calc(100% - 28px); }
  .sectors-intro h2 { font-size:2.5rem; }
  .logo-grid,.footer-grid { grid-template-columns:1fr; }
  .associates h2 { font-size:2.3rem; }
  .contact-form { padding:24px 18px; }
  .footer-bottom { gap:20px; flex-direction:column; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior:auto !important; animation:none !important; transition:none !important; }
  .reveal { opacity:1; transform:none; }
}


/* =========================================================
   ARIA V2 — REAL ASSETS / 2026-09-16
   ========================================================= */
.image-slot--loaded { background-repeat:no-repeat; background-size:cover; background-position:center; }
.image-slot--loaded::before,
.image-slot--loaded::after { display:none; }

.brand--header img { width:104px; max-height:46px; object-fit:contain; }
.hero-logo { width:min(390px, 62vw); max-height:205px; object-fit:contain; margin-bottom:24px; }
.footer-logo { width:145px; max-height:70px; object-fit:contain; }
.foundations-heading img { width:135px; max-height:64px; object-fit:contain; }

.image-slot--hero {
  background-image:url("assets/images/hero-industria.webp");
  background-position:center 48%;
  transform:scale(1.01);
}
.hero-shade {
  background:
    linear-gradient(180deg, rgba(12,14,78,.50) 0%, rgba(14,25,67,.47) 42%, rgba(10,21,58,.64) 100%);
}

.signature-mark--asset { width:185px; height:150px; }
.signature-mark--asset img { width:100%; height:100%; object-fit:contain; }

.sector-tile .image-slot { background-size:cover; background-position:center; }
.sector-tile--infrastrutture .image-slot { background-image:url("assets/images/settore-infrastrutture.webp"); }
.sector-tile--rifiuti .image-slot { background-image:url("assets/images/settore-rifiuti.webp"); }
.sector-tile--industria .image-slot { background-image:url("assets/images/settore-industria.webp"); }
.sector-tile--energia .image-slot { background-image:url("assets/images/settore-energia.webp"); }
.sector-tile--lavoro .image-slot { background-image:url("assets/images/settore-lavoro.webp"); background-position:center 48%; }
.sector-tile--legale .image-slot { background-image:url("assets/images/settore-legale.webp"); background-position:center 56%; }
.sector-tile--componenti .image-slot { background-image:url("assets/images/settore-componenti.webp"); background-position:center 62%; }
.sector-overlay { background:linear-gradient(180deg, rgba(19,23,84,.06), rgba(16,17,77,.20)); }
.sector-tile--rifiuti .sector-overlay { background:rgba(110,58,70,.16); }
.sector-tile--industria .sector-overlay { background:rgba(42,37,148,.14); }
.sector-tile--energia .sector-overlay { background:rgba(151,57,55,.14); }
.sector-tile--lavoro .sector-overlay { background:rgba(126,55,166,.12); }
.sector-tile--legale .sector-overlay { background:rgba(161,128,40,.12); }
.sector-tile--componenti .sector-overlay { background:rgba(61,134,117,.12); }
.sector-body { text-shadow:0 2px 18px rgba(0,0,0,.24); }

.associates-bg {
  background-image:url("assets/images/collaboratori-bg.webp");
  background-position:center 45%;
}
.associates-shade { background:rgba(23,23,127,.25); }
.logo-grid { align-items:stretch; }
.partner-card {
  min-height:155px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:24px 20px;
  border:1px solid rgba(255,255,255,.48);
  background:rgba(255,255,255,.54);
  backdrop-filter:blur(10px);
  box-shadow:0 14px 38px rgba(20,24,76,.08);
}
.partner-card img { max-width:86%; max-height:78px; object-fit:contain; }
.partner-card--text { color:#1a1b72; }
.partner-card--text strong { font-size:1.04rem; }
.partner-card--text span { margin-top:7px; font-size:.72rem; color:#5d6286; }

.client-logo {
  min-height:140px;
  border:1px solid #e5e7ef;
  background:#fff;
  padding:28px 34px;
}
.client-logo img { width:100%; height:78px; object-fit:contain; }
.client-logo:nth-child(2) img { height:86px; }
.client-logo:nth-child(3) img { height:94px; }

.contact-bg {
  background-image:url("assets/images/contact-panorama.webp");
  background-position:center 48%;
}
.contact-shade {
  background:linear-gradient(90deg, rgba(46,105,169,.28), rgba(89,140,190,.16) 50%, rgba(37,78,139,.22));
}

@media (max-width:820px) {
  .hero-logo { width:min(330px, 74vw); }
  .image-slot--hero { background-position:52% center; }
  .partner-card { min-height:135px; }
  .client-logo { min-height:110px; }
}
/* === ARIA A3 START === */

/* =========================================================
   A3 — HERO FORESTA
   ========================================================= */

.image-slot--hero {
  background-image: url("assets/images/foresta.png");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  transform: none;
}

.hero-shade {
  background:
    linear-gradient(
      180deg,
      rgba(9, 17, 52, .49) 0%,
      rgba(13, 28, 66, .35) 42%,
      rgba(8, 21, 57, .57) 100%
    );
}

/*
 * Alziamo il marchio ARIA e gli diamo più respiro
 * rispetto al titolo principale.
 */
.hero-content {
  padding-top: 0;
  transform: translateY(-16px);
}

.hero-logo {
  width: min(430px, 64vw);
  max-height: 215px;
  object-fit: contain;
  margin-top: -42px;
  margin-bottom: 52px;
}

.hero .eyebrow--light {
  margin-bottom: 18px;
}

.hero h1 {
  max-width: 1000px;
}

.hero-copy {
  margin-top: 30px;
}


/* =========================================================
   A3 — EXPERIENCE / MINION
   ========================================================= */

.experience-art {
  width: 245px;
  min-width: 245px;
  height: 195px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.experience-art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}


/* =========================================================
   A3 — FONDAMENTI / LAYOUT UFFICIALE
   ========================================================= */

.foundations {
  background: #fff;
  padding: 88px 0 102px;
  overflow: hidden;
}

.foundations-official {
  position: relative;
  width: min(1450px, calc(100vw - 70px));
  min-height: 780px;
}


/* ---------- BLOCCO CENTRALE ---------- */

.foundation-main {
  position: absolute;
  left: 50%;
  top: 47%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 27px;
  white-space: nowrap;
  z-index: 4;
}

.foundation-main-logo {
  width: 245px;
  height: auto;
  object-fit: contain;
  opacity: .86;
}

.foundation-main-dots {
  width: 245px;
  height: 0;
  border-top: 6px dotted #2869d7;
  display: block;
}

.foundation-main-title {
  position: relative;
}

.foundation-main-title .eyebrow {
  margin: 0 0 10px;
  font-size: .67rem;
  letter-spacing: .18em;
}

.foundation-main-title h2 {
  margin: 0;
  color: #111281;
  font-family: "Oswald", sans-serif;
  font-size: clamp(3.1rem, 4.2vw, 4.9rem);
  line-height: 1;
  font-weight: 500;
}

.foundation-main-title h2 em {
  position: relative;
  display: inline-block;
  font-style: normal;
  z-index: 1;
}

/* Pallino verde del sito ufficiale */
.foundation-main-title h2 em::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: #a7d997;
  left: 23%;
  top: 54%;
  transform: translate(-50%, -50%);
}


/* ---------- TESTI ESTERNI ---------- */

.foundation-note {
  position: absolute;
  width: 310px;
  color: #111281;
  text-align: center;
  z-index: 3;
}

.foundation-note p {
  margin: 0;
  font-size: .98rem;
  line-height: 1.48;
  font-weight: 400;
}

.foundation-note--tl {
  left: 13%;
  top: 2%;
}

.foundation-note--tr {
  right: 8%;
  top: 4%;
}

.foundation-note--mr {
  right: 6%;
  top: 43%;
}

.foundation-note--br {
  right: 10%;
  bottom: 2%;
  width: 355px;
}

.foundation-note--bl {
  left: 16%;
  bottom: 4%;
  width: 330px;
}


/* ---------- LINEE PUNTINATE ---------- */

.foundation-connector {
  position: absolute;
  display: block;
  height: 0;
  border-top: 3px dotted #2427a0;
  transform-origin: left center;
  z-index: 2;
}

.foundation-connector--tl {
  left: 27.5%;
  top: 34%;
  width: 155px;
  transform: rotate(-49deg);
}

.foundation-connector--tr {
  right: 19%;
  top: 33%;
  width: 155px;
  transform: rotate(49deg);
  transform-origin: right center;
}

.foundation-connector--mr {
  right: 18.8%;
  top: 62%;
  width: 155px;
  transform: rotate(-49deg);
  transform-origin: right center;
}

.foundation-connector--br {
  right: 32%;
  bottom: 19%;
  width: 170px;
  transform: rotate(0deg);
  transform-origin: right center;
}

.foundation-connector--bl {
  left: 29%;
  bottom: 29%;
  width: 160px;
  transform: rotate(47deg);
}


/* =========================================================
   A3 — TABLET
   ========================================================= */

@media (max-width: 1100px) {

  .foundations {
    padding: 95px 0;
  }

  .foundations-official {
    min-height: 0;
    width: var(--shell);
    display: flex;
    flex-direction: column;
    gap: 22px;
  }

  .foundation-main {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    order: -1;
    flex-direction: column;
    text-align: center;
    gap: 18px;
    white-space: normal;
    margin-bottom: 18px;
  }

  .foundation-main-logo {
    width: 190px;
  }

  .foundation-main-dots {
    width: 110px;
    border-top-width: 4px;
  }

  .foundation-main-title h2 {
    font-size: clamp(2.8rem, 8vw, 4rem);
  }

  .foundation-note {
    position: relative;
    inset: auto;
    width: min(650px, 100%);
    margin: 0 auto;
    padding: 23px 20px;
    border-top: 1px solid rgba(23, 23, 127, .11);
  }

  .foundation-note p {
    font-size: .94rem;
  }

  .foundation-connector {
    display: none;
  }
}


/* =========================================================
   A3 — MOBILE
   ========================================================= */

@media (max-width: 820px) {

  .hero-content {
    transform: translateY(-8px);
  }

  .hero-logo {
    width: min(320px, 76vw);
    margin-top: -18px;
    margin-bottom: 34px;
  }

  .experience-art {
    width: 210px;
    min-width: 0;
    height: 160px;
    margin: 25px auto 0;
  }

  .foundations {
    padding: 80px 0;
  }

  .foundation-main-title h2 {
    font-size: 2.8rem;
  }

  .foundation-main-title h2 em::before {
    width: 58px;
    height: 58px;
  }
}

/* === ARIA A3 END === */

/* === ARIA A4 START === */


/* =========================================================
   HERO — FORESTA SU TUTTO IL BOX
   ========================================================= */

.hero {
  background-image: url("assets/images/foresta.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-color: #395644 !important;
}

/*
 * Il background ora è direttamente sulla HERO.
 * Nascondiamo il vecchio layer immagini per evitare conflitti.
 */
.hero > .hero-media {
  display: none !important;
}

.hero-shade {
  display: block !important;
  background:
    linear-gradient(
      180deg,
      rgba(7, 20, 42, .29) 0%,
      rgba(9, 27, 49, .32) 48%,
      rgba(8, 22, 46, .49) 100%
    ) !important;
}


/* =========================================================
   FONDAMENTI V4 — LAYOUT SITO ORIGINALE
   ========================================================= */

.foundations-v4 {
  background: #ffffff !important;
  padding: 68px 0 92px !important;
  overflow: hidden;
}

.foundations-v4-stage {
  position: relative;
  width: min(1420px, calc(100vw - 70px)) !important;
  max-width: 1420px !important;
  min-height: 735px;
  margin: 0 auto;
}


/* ---------------------------------------------------------
   TESTI ESTERNI
   --------------------------------------------------------- */

.fv4-note {
  position: absolute;
  z-index: 4;
  color: #111281;
  text-align: center;
  width: 320px;
}

.fv4-note p {
  margin: 0;
  font-family: "Montserrat", Arial, sans-serif;
  font-size: 15px;
  line-height: 1.52;
  font-weight: 400;
}


/* alto sinistra */
.fv4-note--1 {
  left: 8%;
  top: 0;
}

/* alto destra */
.fv4-note--2 {
  right: 5%;
  top: 14px;
}

/* centro destra */
.fv4-note--3 {
  right: 3%;
  top: 305px;
  width: 275px;
}

/* basso destra */
.fv4-note--4 {
  right: 8%;
  bottom: 0;
  width: 355px;
}

/* basso sinistra */
.fv4-note--5 {
  left: 12%;
  bottom: 15px;
  width: 335px;
}


/* ---------------------------------------------------------
   BLOCCO CENTRALE
   --------------------------------------------------------- */

.fv4-center {
  position: absolute;
  z-index: 5;

  /*
   * IMPORTANTISSIMO:
   * non lo centriamo su tutta la pagina perché sul sito
   * originale il gruppo ARIA + Fondamenti è spostato a sinistra.
   */
  left: 5%;
  top: 43%;

  display: flex;
  align-items: center;
  white-space: nowrap;
}

.fv4-logo {
  display: block;
  width: 250px;
  height: auto;
  object-fit: contain;
  opacity: .87;
  flex: 0 0 auto;
}

.fv4-main-dots {
  display: block;
  width: 225px;
  margin: 0 25px 0 28px;
  border-top: 6px dotted #2869d7;
  flex: 0 0 auto;
}

.fv4-center h2 {
  position: relative;
  margin: 0;
  font-family: "Oswald", Arial, sans-serif;
  font-size: clamp(50px, 4.2vw, 72px);
  line-height: 1;
  font-weight: 500;
  color: #111281;
  letter-spacing: -.02em;
}

.fv4-center h2 em {
  position: relative;
  display: inline-block;
  font-style: normal;
  z-index: 2;
}

/* pallino verde dietro la parola Fondamenti */
.fv4-center h2 em::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background: #a8d79a;
  left: 19%;
  top: 52%;
  transform: translate(-50%, -50%);
}


/* ---------------------------------------------------------
   LINEE PUNTINATE
   --------------------------------------------------------- */

.fv4-line {
  position: absolute;
  z-index: 2;
  display: block;
  height: 0;
  border-top: 3px dotted #2427a0;
  opacity: .92;
}


/* top left -> centro */
.fv4-line--1 {
  left: 22%;
  top: 198px;
  width: 145px;
  transform: rotate(-48deg);
}

/* top right -> centro */
.fv4-line--2 {
  right: 15.5%;
  top: 192px;
  width: 145px;
  transform: rotate(48deg);
}

/* note 03 -> centro */
.fv4-line--3 {
  right: 16%;
  top: 441px;
  width: 140px;
  transform: rotate(-48deg);
}

/* centro -> bottom right */
.fv4-line--4 {
  right: 31%;
  bottom: 170px;
  width: 145px;
  transform: rotate(0deg);
}

/* centro -> bottom left */
.fv4-line--5 {
  left: 23%;
  bottom: 182px;
  width: 145px;
  transform: rotate(48deg);
}


/* =========================================================
   TABLET / MOBILE
   ========================================================= */

@media (max-width: 1100px) {

  .foundations-v4 {
    padding: 80px 0 !important;
  }

  .foundations-v4-stage {
    width: var(--shell) !important;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
  }

  .fv4-center {
    position: relative;
    inset: auto;
    order: -1;
    display: flex;
    flex-direction: column;
    white-space: normal;
    text-align: center;
    margin-bottom: 34px;
  }

  .fv4-logo {
    width: 190px;
  }

  .fv4-main-dots {
    width: 100px;
    margin: 22px auto;
    border-top-width: 4px;
  }

  .fv4-center h2 {
    font-size: clamp(42px, 8vw, 58px);
  }

  .fv4-note {
    position: relative;
    inset: auto;
    width: min(640px, 100%);
    margin: 0 auto;
    padding: 24px 10px;
    border-top: 1px solid rgba(17, 18, 129, .10);
  }

  .fv4-note p {
    font-size: 14px;
  }

  .fv4-line {
    display: none;
  }
}


@media (max-width: 820px) {

  .hero {
    background-position: 50% center !important;
  }

  .fv4-center h2 em::before {
    width: 58px;
    height: 58px;
  }

}

/* === ARIA A4 END === */

/* === ARIA A5 START === */

/* =========================================================
   FONDAMENTI V5
   Ricostruzione geometrica fedele al layout di riferimento.
   ========================================================= */

.foundations-v5 {
  background: #ffffff !important;
  padding: 72px 0 78px !important;
  overflow: hidden;
}


/* =========================================================
   STAGE
   ========================================================= */

.fv5-stage {
  width: min(1320px, calc(100vw - 72px)) !important;
  max-width: 1320px !important;
  min-height: 670px;

  margin: 0 auto;

  display: grid;

  grid-template-columns:
    minmax(300px, 1fr)
    minmax(260px, .72fr)
    minmax(300px, 1fr);

  grid-template-rows:
    128px
    118px
    150px
    112px
    146px;

  align-items: center;
  justify-items: stretch;

  column-gap: 38px;
}


/* =========================================================
   TESTI
   ========================================================= */

.fv5-note {
  color: #111281;
  text-align: center;
  align-self: center;
  justify-self: center;
  width: 100%;
  z-index: 3;
}

.fv5-note p {
  margin: 0;

  font-family: "Montserrat", Arial, sans-serif;
  font-size: 14.5px;
  font-weight: 400;

  line-height: 1.48;
}


/* TOP LEFT */

.fv5-note--1 {
  grid-column: 1;
  grid-row: 1;
}


/* TOP RIGHT */

.fv5-note--2 {
  grid-column: 3;
  grid-row: 1;
}


/* MID RIGHT */

.fv5-note--3 {
  grid-column: 3;
  grid-row: 3;

  width: 290px;

  justify-self: center;
}


/* BOTTOM RIGHT */

.fv5-note--4 {
  grid-column: 3;
  grid-row: 5;

  width: 370px;

  justify-self: center;
}


/* BOTTOM LEFT */

.fv5-note--5 {
  grid-column: 1;
  grid-row: 5;

  width: 355px;

  justify-self: center;
}


/* =========================================================
   LINEE ORIZZONTALI
   ========================================================= */

.fv5-rule {
  width: 76%;

  height: 0;

  border-top: 2px dotted #2427a0;

  justify-self: center;
  align-self: center;

  opacity: .95;
}


/* linea alta tra i due testi */

.fv5-rule--top {
  grid-column: 2;
  grid-row: 1;
}


/* linea bassa tra i due testi */

.fv5-rule--bottom {
  grid-column: 2;
  grid-row: 5;
}


/* =========================================================
   DIAGONALI
   ========================================================= */

.fv5-diagonal {
  display: block;

  width: 142px;
  height: 0;

  border-top: 2px dotted #2427a0;

  align-self: center;

  opacity: .95;
}


/*
 * Alto sinistra:
 * dalla zona centrale verso il testo superiore sinistro.
 */
.fv5-diagonal--tl {
  grid-column: 1;
  grid-row: 2;

  justify-self: end;

  margin-right: 14px;

  transform: rotate(-49deg);
}


/*
 * Alto destra.
 */
.fv5-diagonal--tr {
  grid-column: 3;
  grid-row: 2;

  justify-self: start;

  margin-left: 14px;

  transform: rotate(49deg);
}


/*
 * Basso sinistra.
 */
.fv5-diagonal--bl {
  grid-column: 1;
  grid-row: 4;

  justify-self: end;

  margin-right: 14px;

  transform: rotate(49deg);
}


/*
 * Basso destra.
 */
.fv5-diagonal--br {
  grid-column: 3;
  grid-row: 4;

  justify-self: start;

  margin-left: 14px;

  transform: rotate(-49deg);
}


/* =========================================================
   BLOCCO CENTRALE
   ARIA → puntini → I nostri Fondamenti
   ========================================================= */

.fv5-main {
  grid-column: 1 / 3;
  grid-row: 3;

  align-self: center;
  justify-self: center;

  display: flex;
  align-items: center;

  white-space: nowrap;

  transform: translateX(8px);

  z-index: 5;
}


/* LOGO */

.fv5-logo {
  display: block;

  width: 210px;
  height: auto;

  flex: 0 0 auto;

  object-fit: contain;

  opacity: .83;
}


/* PUNTINI CENTRALI */

.fv5-dots {
  display: block;

  width: 205px;
  height: 0;

  flex: 0 0 auto;

  margin:
    0
    26px
    0
    24px;

  border-top: 5px dotted #2869d7;
}


/* TITOLO */

.fv5-main h2 {
  position: relative;

  margin: 0;

  color: #111281;

  font-family: "Oswald", Arial, sans-serif;

  font-size: clamp(
    42px,
    3.65vw,
    62px
  );

  line-height: 1;

  font-weight: 500;

  letter-spacing: -.025em;
}


/* parola Fondamenti */

.fv5-main h2 em {
  position: relative;

  display: inline-block;

  font-style: normal;

  z-index: 2;
}


/* pallino verde */

.fv5-main h2 em::before {
  content: "";

  position: absolute;

  z-index: -1;

  width: 65px;
  height: 65px;

  border-radius: 50%;

  background: #a8d79a;

  /*
   * Il pallino cade dietro la parte iniziale
   * della parola Fondamenti, come nel riferimento.
   */
  left: 18%;
  top: 53%;

  transform:
    translate(-50%, -50%);
}


/* =========================================================
   DISATTIVA VECCHI FONDAMENTI
   Se qualche regola A3/A4 rimane nel CSS non deve più
   influenzare il nuovo markup.
   ========================================================= */

.foundations-v5 .foundation-note,
.foundations-v5 .foundation-main,
.foundations-v5 .foundation-connector,
.foundations-v5 .foundation-core,
.foundations-v5 .foundation-point,
.foundations-v5 .foundation-orbit,
.foundations-v5 .foundations-heading {
  all: unset;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

  .foundations-v5 {
    padding: 85px 0 !important;
  }

  .fv5-stage {
    width: var(--shell) !important;
    min-height: 0;

    display: flex;
    flex-direction: column;

    gap: 0;
  }

  .fv5-main {
    order: -1;

    width: 100%;

    display: flex;
    flex-direction: column;

    transform: none;

    text-align: center;

    margin-bottom: 34px;
  }

  .fv5-logo {
    width: 185px;
  }

  .fv5-dots {
    width: 105px;

    margin: 22px 0;
  }

  .fv5-main h2 {
    white-space: normal;

    font-size: clamp(
      42px,
      8vw,
      58px
    );
  }

  .fv5-note {
    width: min(640px, 100%);

    padding: 25px 12px;

    border-top:
      1px solid
      rgba(17, 18, 129, .10);
  }

  .fv5-note--3,
  .fv5-note--4,
  .fv5-note--5 {
    width: min(640px, 100%);
  }

  .fv5-rule,
  .fv5-diagonal {
    display: none;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 560px) {

  .foundations-v5 {
    padding: 68px 0 !important;
  }

  .fv5-main h2 {
    font-size: 2.6rem;
  }

  .fv5-main h2 em::before {
    width: 54px;
    height: 54px;
  }

  .fv5-note p {
    font-size: 13.5px;
    line-height: 1.55;
  }

}

/* === ARIA A5 END === */

/* === ARIA A5.2 START === */

/* =========================================================
   FONDAMENTI — VISIBILITÀ CERTIFICATA
   ========================================================= */

.foundations-v5 .fv5-note,
.foundations-v5 .fv5-logo,
.foundations-v5 .fv5-main h2 {
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

.foundations-v5 .fv5-rule,
.foundations-v5 .fv5-diagonal,
.foundations-v5 .fv5-dots {
  opacity: .95 !important;
  visibility: visible !important;
  clip-path: none !important;
}


/* =========================================================
   CERCHIO VERDE
   Più grande e centrato visivamente sulle lettere "on"
   ========================================================= */

.fv5-main h2 em::before {
  width: 78px !important;
  height: 78px !important;

  left: 25.5% !important;
  top: 53% !important;

  transform: translate(-50%, -50%) !important;

  background: #a8d79a !important;
  opacity: 1 !important;
}


/* mobile proporzionato */

@media (max-width: 560px) {

  .fv5-main h2 em::before {
    width: 60px !important;
    height: 60px !important;
    left: 25.5% !important;
  }

}

/* === ARIA A5.2 END === */

/* === ARIA A6B ICON CSS START === */

.modal-sector-icon,
.modal-icon {
  width: 76px !important;
  height: 76px !important;
  margin: 0 0 24px !important;
  border: 2.5px solid #50bfe8 !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(80,191,232,.03) !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

.modal-sector-icon::before,
.modal-sector-icon::after,
.modal-icon::before,
.modal-icon::after {
  content: none !important;
  display: none !important;
}

.modal-sector-icon svg,
.modal-icon svg {
  width: 44px !important;
  height: 44px !important;
  display: block !important;
  fill: none !important;
  stroke: #48bce7 !important;
  stroke-width: 2.35 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  overflow: visible !important;
  opacity: 1 !important;
}

@media (max-width: 560px) {
  .modal-sector-icon,
  .modal-icon {
    width: 66px !important;
    height: 66px !important;
  }

  .modal-sector-icon svg,
  .modal-icon svg {
    width: 38px !important;
    height: 38px !important;
  }
}

/* === ARIA A6B ICON CSS END === */

/* === ARIA A6D REAL SVG FILES START === */

.modal-sector-icon img {
  display: block !important;

  width: 46px !important;
  height: 46px !important;

  max-width: none !important;

  object-fit: contain !important;

  opacity: 1 !important;
  visibility: visible !important;

  filter: none !important;

  pointer-events: none;
}

@media (max-width: 560px) {

  .modal-sector-icon img {
    width: 39px !important;
    height: 39px !important;
  }

}

/* === ARIA A6D REAL SVG FILES END === */

/* === ARIA A6E COLORS START === */

/* =========================================================
   SETTORE → COLORE ICONA / CERCHIO
   ========================================================= */

.modal-sector-icon {
  transition:
    border-color .25s ease,
    background-color .25s ease !important;
}


/* INFRASTRUTTURE */

.modal-sector-icon[data-sector="infrastrutture"] {
  border-color: #6F696D !important;
  background:
    rgba(111,105,109,.055) !important;
}


/* TRATTAMENTO RIFIUTI */

.modal-sector-icon[data-sector="rifiuti"] {
  border-color: #98686A !important;
  background:
    rgba(152,104,106,.055) !important;
}


/* IMPIANTI INDUSTRIALI */

.modal-sector-icon[data-sector="industria"] {
  border-color: #6E5FCB !important;
  background:
    rgba(110,95,203,.055) !important;
}


/* ENERGIA E TELECOMUNICAZIONI */

.modal-sector-icon[data-sector="energia"] {
  border-color: #C97572 !important;
  background:
    rgba(201,117,114,.06) !important;
}


/* AMBIENTE DI LAVORO */

.modal-sector-icon[data-sector="lavoro"] {
  border-color: #A97AD0 !important;
  background:
    rgba(169,122,208,.06) !important;
}


/* CONTENZIOSI */

.modal-sector-icon[data-sector="legale"] {
  border-color: #B99A59 !important;
  background:
    rgba(185,154,89,.065) !important;
}


/* COMPONENTI AMBIENTALI */

.modal-sector-icon[data-sector="componenti"] {
  border-color: #799B85 !important;
  background:
    rgba(121,155,133,.065) !important;
}


/*
 * Manteniamo l'immagine nitida:
 * il colore è già incorporato nei singoli SVG.
 */

.modal-sector-icon img {
  filter: none !important;
  opacity: 1 !important;
}

/* === ARIA A6E COLORS END === */

/* === ARIA A6G START === */

/* =========================================================
   POPUP SECTOR ICON
   NESSUN CERCHIO / NESSUN BOX
   ========================================================= */

.modal-sector-icon,
.modal-icon.modal-sector-icon {

  width: 58px !important;
  height: 58px !important;

  min-width: 0 !important;
  min-height: 0 !important;

  margin:
    0
    0
    20px
    0 !important;

  padding: 0 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;

  border: 0 !important;
  border-width: 0 !important;
  border-style: none !important;

  border-radius: 0 !important;

  outline: 0 !important;

  background:
    transparent !important;

  box-shadow:
    none !important;

  overflow:
    visible !important;
}


/* elimina definitivamente il vecchio simbolo */

.modal-sector-icon::before,
.modal-sector-icon::after,
.modal-icon.modal-sector-icon::before,
.modal-icon.modal-sector-icon::after {

  content: none !important;
  display: none !important;

}


/* IMG SVG */

.modal-sector-icon img,
#modal-sector-icon-img {

  display: block !important;

  width: 54px !important;
  height: 54px !important;

  max-width: 54px !important;

  object-fit: contain !important;
  object-position: left center !important;

  margin: 0 !important;
  padding: 0 !important;

  opacity: 1 !important;
  visibility: visible !important;

  filter: none !important;

  border: 0 !important;
  background: transparent !important;

}


/* mobile */

@media (max-width: 560px) {

  .modal-sector-icon,
  .modal-icon.modal-sector-icon {

    width: 49px !important;
    height: 49px !important;

    margin-bottom: 17px !important;

  }

  .modal-sector-icon img,
  #modal-sector-icon-img {

    width: 46px !important;
    height: 46px !important;

    max-width: 46px !important;

  }

}

/* === ARIA A6G END === */

/* === ARIA A6H START === */


/* =========================================================
   MODAL ICONS — GEOMETRIA UNIFORME
   ========================================================= */

.modal-sector-icon,
.modal-icon.modal-sector-icon {
  width: 62px !important;
  height: 62px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;

  margin-bottom: 20px !important;

  border: 0 !important;
  border-radius: 0 !important;

  background: transparent !important;
  box-shadow: none !important;

  overflow: visible !important;
}

.modal-sector-icon img,
#modal-sector-icon-img {
  display: block !important;

  width: 58px !important;
  height: 58px !important;

  max-width: 58px !important;

  object-fit: contain !important;
  object-position: center center !important;

  margin: 0 !important;

  opacity: 1 !important;
  visibility: visible !important;

  border: 0 !important;
  background: transparent !important;

  filter: none !important;
}


/* =========================================================
   CONTACT FORM
   Via il pannello bianco ottico.
   ========================================================= */

.contact-form {
  background:
    rgba(232, 239, 248, .76) !important;

  border:
    1px solid
    rgba(255, 255, 255, .40) !important;

  box-shadow:
    0 24px 58px
    rgba(19, 33, 92, .085) !important;

  backdrop-filter:
    blur(9px);

  -webkit-backdrop-filter:
    blur(9px);
}


/* campi meno "bianchi" */

.contact-form input,
.contact-form textarea {

  background:
    rgba(255, 255, 255, .38) !important;

  border:
    1px solid
    rgba(36, 66, 139, .055) !important;

  box-shadow:
    none !important;
}


/* focus pulito */

.contact-form input:focus,
.contact-form textarea:focus {

  background:
    rgba(255, 255, 255, .56) !important;

  border-color:
    rgba(45, 108, 214, .26) !important;

  outline:
    none !important;
}


/* checkbox non alterato */

.contact-form input[type="checkbox"] {
  background:
    transparent !important;
}


/* mobile: niente blur pesante */

@media (max-width: 640px) {

  .contact-form {
    backdrop-filter:
      blur(5px);

    -webkit-backdrop-filter:
      blur(5px);
  }

}


/* === ARIA A6H END === */

/* === ARIA A7.1 START === */

/* =========================================================
   A7.1
   FREEZE DECORAZIONI / RESET ICONE PROVVISORIE
   ========================================================= */

/*
 * Se il browser avesse ancora qualche elemento inserito
 * dinamicamente da A6I/A6J, non deve occupare spazio.
 */

.aria-section-icon {
  display: none !important;
}


/* =========================================================
   HERO
   ========================================================= */

.hero {
  min-height: 100svh !important;
}


/*
 * Il contenuto centrale deve vivere sotto la navigazione,
 * non partire immediatamente sotto il bordo superiore.
 */

.hero .hero-content {
  box-sizing: border-box !important;

  min-height: 100svh !important;

  padding-top: 112px !important;
  padding-bottom: 58px !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}


/* =========================================================
   LOGO CENTRALE ARIA
   ========================================================= */

.hero .hero-logo {
  display: block !important;

  width: 178px !important;
  max-width: 178px !important;
  height: auto !important;

  margin:
    26px
    auto
    48px
    auto !important;

  flex: 0 0 auto !important;
}


/* =========================================================
   KICKER
   ========================================================= */

.hero .eyebrow {
  margin:
    0
    0
    18px
    0 !important;

  line-height: 1.2 !important;

  letter-spacing: .18em !important;

  color:
    rgba(255,255,255,.97) !important;

  text-shadow:
    0 2px 12px
    rgba(0,0,0,.26) !important;
}


/* =========================================================
   HERO H1
   RIDUZIONE NETTA
   ========================================================= */

.hero h1 {
  width: min(920px, 88vw) !important;
  max-width: 920px !important;

  margin:
    0
    auto
    27px
    auto !important;

  font-size:
    clamp(42px, 4.15vw, 67px) !important;

  line-height: .98 !important;

  letter-spacing:
    -.028em !important;

  text-align: center !important;

  text-wrap: balance !important;

  color: #fff !important;

  text-shadow:
    0 3px 20px
    rgba(0,0,0,.20) !important;
}


/*
 * Non imponiamo noi una nuova impaginazione:
 * manteniamo i BR originali del progetto.
 */

.hero h1 br {
  display: initial !important;
}


/* =========================================================
   COPY
   ========================================================= */

.hero .hero-content > p:not(.eyebrow),
.hero .hero-copy,
.hero .hero-subtitle {
  width: min(790px, 86vw) !important;
  max-width: 790px !important;

  margin-left: auto !important;
  margin-right: auto !important;

  color:
    rgba(255,255,255,.96) !important;

  text-align: center !important;

  text-shadow:
    0 2px 15px
    rgba(0,0,0,.28) !important;
}


/* =========================================================
   CTA
   ========================================================= */

.hero .button,
.hero .btn,
.hero .hero-cta {
  margin-top: 20px !important;
}


/* =========================================================
   OVERLAY
   Solo contrasto, senza cambiare la foto.
   ========================================================= */

.hero .hero-shade {
  background:
    linear-gradient(
      180deg,
      rgba(7,13,38,.31) 0%,
      rgba(7,13,38,.25) 38%,
      rgba(7,13,38,.37) 100%
    ) !important;
}


/* =========================================================
   SEZIONI — RIMUOVIAMO SOLO L'OVERSIZE INTRODOTTO
   ========================================================= */

.associates h2,
.collaborations h2,
.clients h2,
.profile h2,
.sectors h2 {
  max-width: none;
}


/* =========================================================
   DESKTOP MEDIO
   ========================================================= */

@media (max-width: 1250px) {

  .hero .hero-content {
    padding-top: 118px !important;
  }

  .hero .hero-logo {
    width: 162px !important;
    max-width: 162px !important;
    margin-bottom: 42px !important;
  }

  .hero h1 {
    font-size:
      clamp(40px, 4.7vw, 60px) !important;

    max-width: 820px !important;
  }

}


/* =========================================================
   MOBILE / TABLET
   Non facciamo redesign.
   Solo protezione da overflow.
   ========================================================= */

@media (max-width: 760px) {

  .hero .hero-content {
    padding-top: 100px !important;
    padding-bottom: 46px !important;
  }

  .hero .hero-logo {
    width: 142px !important;
    max-width: 142px !important;

    margin:
      18px
      auto
      34px
      auto !important;
  }

  .hero h1 {
    width: 92vw !important;

    font-size:
      clamp(34px, 10vw, 48px) !important;

    line-height: 1 !important;
  }

}


/* === ARIA A7.1 END === */

/* === ARIA A7.3 START === */


/* =========================================================
   HERO LOGO
   Titolo A7.1 NON TOCCATO.
   ========================================================= */

.hero .hero-logo {

  width: 208px !important;
  max-width: 208px !important;

  height: auto !important;

  margin:
    26px
    auto
    46px
    auto !important;

}


/* =========================================================
   ICON SYSTEM
   ========================================================= */

.aria-editorial-icon {

  box-sizing: border-box;

  width: 58px;
  height: 58px;

  display: flex;
  align-items: center;
  justify-content: center;

  line-height: 0;

  padding: 0;

  background: transparent;
  border: 0;

}


.aria-editorial-icon svg {

  display: block;

  width: 48px;
  height: 48px;

  fill: none;

  stroke: currentColor;
  stroke-width: 2.15;

  stroke-linecap: round;
  stroke-linejoin: round;

  overflow: visible;

}


.aria-editorial-icon .aria-icon-solid {

  fill: currentColor;
  stroke: none;

}


/* =========================================================
   1 — SETTORI
   centrata sopra il kicker
   ========================================================= */

.sectors-intro .aria-editorial-icon--sectors {

  color: #edd84d;

  margin:
    0
    auto
    17px
    auto;

}


/* =========================================================
   2 — ASSOCIATES
   allineata alla colonna del testo, NON centrata pagina
   ========================================================= */

.associates-content .aria-editorial-icon--associates {

  color: #3f70e7;

  margin:
    0
    0
    15px
    0;

}


/* =========================================================
   3 — COLLABORATIONS
   centrata sulla composizione
   ========================================================= */

.collaborations-inner .aria-editorial-icon--collaborations {

  color: #3f70e7;

  margin:
    0
    auto
    16px
    auto;

}


/* =========================================================
   4 — PROFILE
   allineata alla colonna copy.
   ========================================================= */

.profile-copy .aria-editorial-icon--profile {

  color: #edd84d;

  margin:
    0
    0
    15px
    0;

}


/* =========================================================
   NIENTE VECCHIE ICONE
   ========================================================= */

.aria-section-icon {

  display: none !important;

}


/* =========================================================
   DESKTOP MEDIO
   ========================================================= */

@media (max-width: 1250px) {

  .hero .hero-logo {

    width: 192px !important;
    max-width: 192px !important;

  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

  .hero .hero-logo {

    width: 154px !important;
    max-width: 154px !important;

  }


  .aria-editorial-icon {

    width: 52px;
    height: 52px;

  }


  .aria-editorial-icon svg {

    width: 43px;
    height: 43px;

  }

}


/* === ARIA A7.3 END === */

/* === ARIA A7.4 START === */

/* ---------------------------------------------------------
   HERO
   --------------------------------------------------------- */

.hero .hero-logo {
  width: 226px !important;
  max-width: 226px !important;
  height: auto !important;
  margin: 30px auto 48px auto !important;
}

/* ---------------------------------------------------------
   ICON SIZE REFINEMENT
   --------------------------------------------------------- */

.aria-editorial-icon {
  width: 70px;
  height: 70px;
}

.aria-editorial-icon svg {
  width: 58px;
  height: 58px;
  display: block;
  overflow: visible;
}

/* specific placements */
.sectors-intro .aria-editorial-icon--sectors {
  margin: 0 auto 18px auto;
}

.associates-content .aria-editorial-icon--associates {
  margin: 0 0 18px 0;
}

.collaborations-inner .aria-editorial-icon--collaborations {
  margin: 0 auto 20px auto;
}

.profile-copy .aria-editorial-icon--profile {
  margin: 0 0 18px 0;
}

/* collaboration icon slightly more elegant */
.aria-editorial-icon--collaborations svg {
  width: 60px;
  height: 60px;
  stroke-width: 2.3;
}

/* ---------------------------------------------------------
   COLLABORATORI PAGE
   --------------------------------------------------------- */

.page-collaboratori {
  margin: 0;
  background: #f4f5fb;
  color: #1d2088;
  font-family: inherit;
}

.collab-page-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: #23208f;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.collab-shell {
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}

.collab-topbar {
  min-height: 86px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.collab-brand {
  color: #ffffff;
  text-decoration: none;
  font-size: 2.1rem;
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1;
}

.collab-brand small {
  font-size: .44em;
  font-weight: 700;
  margin-left: 2px;
}

.collab-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 18px 28px;
  justify-content: flex-end;
}

.collab-nav a {
  color: #ffffff;
  text-decoration: none;
  text-transform: uppercase;
  font-size: .93rem;
  font-weight: 700;
  letter-spacing: .07em;
  opacity: .94;
}

.collab-nav a.is-current {
  color: #edd84d;
}

.collab-hero {
  background: #cfd2f1;
  padding: 86px 0 74px;
}

.collab-hero-inner {
  width: min(1100px, calc(100% - 48px));
  margin: 0 auto;
}

.collab-eyebrow {
  display: inline-block;
  margin: 0 0 14px 0;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: .98rem;
  font-weight: 800;
}

.collab-eyebrow--blue {
  color: #3f70e7;
}

.collab-title {
  margin: 0;
  color: #ffffff;
  font-size: clamp(3rem, 6vw, 5.5rem);
  line-height: .95;
  font-weight: 800;
  letter-spacing: -.03em;
  max-width: 900px;
}

.collab-subtitle {
  margin: 28px 0 0 0;
  color: #27308f;
  font-size: 1.35rem;
  line-height: 1.7;
  max-width: 820px;
}

.collab-detail-section {
  background: #23208f;
  color: #ffffff;
  padding: 88px 0;
}

.collab-detail-intro {
  display: grid;
  grid-template-columns: 1.1fr 2fr;
  gap: 56px;
  align-items: center;
  margin-bottom: 60px;
}

.collab-kicker {
  margin: 0 0 12px 0;
  color: #edd84d;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 800;
}

.collab-main-title {
  margin: 0;
  color: #ffffff;
  font-size: clamp(2.4rem, 5vw, 4.6rem);
  line-height: .98;
  font-weight: 800;
  letter-spacing: -.03em;
}

.collab-main-copy p {
  margin: 0 0 18px 0;
  color: rgba(255,255,255,.94);
  font-size: 1.22rem;
  line-height: 1.65;
}

.collab-profile-list {
  display: grid;
  gap: 40px;
}

.collab-profile-item {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 44px;
  align-items: start;
  padding: 34px 0;
  border-top: 1px solid rgba(255,255,255,.14);
}

.collab-profile-item:last-child {
  border-bottom: 1px solid rgba(255,255,255,.14);
}

.collab-badge {
  min-height: 170px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.collab-badge--forni {
  position: relative;
}

.collab-badge--forni::after {
  content: "";
  position: absolute;
  width: 180px;
  height: 24px;
  background: #edd84d;
  left: 50%;
  top: 54%;
  transform: translate(-50%, -50%) rotate(-6deg);
  z-index: 0;
}

.collab-badge--forni .forni-name {
  position: relative;
  z-index: 1;
  color: #ffffff;
  font-size: 1.18rem;
  line-height: 1.05;
  text-align: center;
  font-style: italic;
  letter-spacing: .01em;
}

.collab-badge--forni .forni-name strong {
  display: block;
  font-size: 1.48em;
  font-weight: 500;
}

.collab-badge--ecol {
  flex-direction: column;
  gap: 6px;
}

.collab-badge--ecol .ecol-big {
  color: rgba(255,255,255,.72);
  font-size: 3.6rem;
  line-height: .9;
  font-weight: 800;
  letter-spacing: -.04em;
}

.collab-badge--ecol .ecol-sub {
  color: rgba(255,255,255,.84);
  font-size: 1.32rem;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.collab-badge--ecol .ecol-mini {
  color: rgba(255,255,255,.76);
  font-size: 1rem;
  letter-spacing: .08em;
}

.collab-profile-copy h3 {
  margin: 0 0 16px 0;
  color: #ffffff;
  font-size: 1.9rem;
  line-height: 1.1;
  font-weight: 800;
}

.collab-profile-copy p {
  margin: 0 0 16px 0;
  color: rgba(255,255,255,.95);
  font-size: 1.14rem;
  line-height: 1.62;
}

.collab-profile-copy ul {
  margin: 12px 0 0 0;
  padding-left: 20px;
}

.collab-profile-copy li {
  margin: 0 0 10px 0;
  color: rgba(255,255,255,.95);
  font-size: 1.12rem;
  line-height: 1.56;
}

.collab-footer-cta {
  background: #f4f5fb;
  padding: 64px 0 90px;
}

.collab-footer-box {
  width: min(980px, calc(100% - 48px));
  margin: 0 auto;
  text-align: center;
}

.collab-footer-box h2 {
  margin: 0 0 18px 0;
  color: #23208f;
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: 1.02;
  font-weight: 800;
}

.collab-footer-box p {
  margin: 0 auto 26px auto;
  color: #27308f;
  font-size: 1.18rem;
  line-height: 1.65;
  max-width: 760px;
}

.collab-footer-box a {
  display: inline-block;
  text-decoration: none;
  color: #23208f;
  border: 2px solid #edd84d;
  background: #ffffff;
  padding: 14px 22px;
  border-radius: 14px;
  font-weight: 800;
}

@media (max-width: 980px) {

  .collab-detail-intro,
  .collab-profile-item {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .collab-main-copy p,
  .collab-profile-copy p,
  .collab-profile-copy li,
  .collab-subtitle {
    font-size: 1.06rem;
  }

  .collab-topbar {
    align-items: flex-start;
    padding: 18px 0;
    flex-direction: column;
  }

  .collab-nav {
    justify-content: flex-start;
    gap: 14px 18px;
  }
}

@media (max-width: 760px) {

  .hero .hero-logo {
    width: 170px !important;
    max-width: 170px !important;
  }

  .aria-editorial-icon {
    width: 60px;
    height: 60px;
  }

  .aria-editorial-icon svg {
    width: 50px;
    height: 50px;
  }

  .collab-hero {
    padding: 72px 0 60px;
  }

  .collab-title {
    font-size: clamp(2.6rem, 11vw, 4rem);
  }

  .collab-main-title {
    font-size: clamp(2rem, 10vw, 3rem);
  }

  .collab-detail-section {
    padding: 70px 0;
  }

  .collab-profile-item {
    padding: 28px 0;
  }

  .collab-badge {
    min-height: 120px;
    justify-content: flex-start;
  }
}

/* === ARIA A7.4 END === */

/* === ARIA A7.5 START === */


/* =========================================================
   HANDSHAKE — RELAZIONI CONSOLIDATE
   ========================================================= */

.collaborations-inner
.aria-editorial-icon--collaborations {

  width: 82px !important;
  height: 82px !important;

  margin:
    0
    auto
    18px
    auto !important;

  color:
    #3f70e7 !important;

}


.collaborations-inner
.aria-editorial-icon--collaborations svg {

  width: 72px !important;
  height: 72px !important;

  stroke-width:
    2.25 !important;

}


/* =========================================================
   CTA COLLABORATORI
   ========================================================= */

.associates-more-wrap {

  width: 100%;

  display: flex;

  justify-content: center;
  align-items: center;

  margin-top: 38px;

}


.associates-more {

  display: inline-flex;

  align-items: center;
  justify-content: center;

  gap: 14px;

  min-height: 54px;

  padding:
    0
    24px;

  border:
    2px solid
    #26258c;

  border-radius:
    12px;

  background:
    rgba(255,255,255,.38);

  color:
    #26258c;

  text-decoration:
    none;

  font-size:
    15px;

  font-weight:
    800;

  letter-spacing:
    .025em;

  box-shadow:
    0 12px 28px
    rgba(35,36,121,.08);

  transition:
    transform .22s ease,
    background .22s ease,
    color .22s ease,
    box-shadow .22s ease;

}


.associates-more span {

  font-size:
    22px;

  line-height:
    1;

  transform:
    translateY(-1px);

}


.associates-more:hover {

  background:
    #26258c;

  color:
    #ffffff;

  transform:
    translateY(-2px);

  box-shadow:
    0 15px 34px
    rgba(35,36,121,.16);

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

  .associates-more-wrap {

    margin-top:
      28px;

  }


  .associates-more {

    min-height:
      50px;

    padding:
      0
      20px;

  }


  .collaborations-inner
  .aria-editorial-icon--collaborations {

    width:
      68px !important;

    height:
      68px !important;

  }


  .collaborations-inner
  .aria-editorial-icon--collaborations svg {

    width:
      60px !important;

    height:
      60px !important;

  }

}


/* === ARIA A7.5 END === */

/* === ARIA A8.0 START === */


/* =========================================================
   FOOTER SOCIETARIO
   ========================================================= */

.aria-company-footer {

  background:
    #17177f;

  color:
    #ffffff;

  padding:
    62px
    0
    28px;

}


.aria-company-footer-grid {

  display:
    grid;

  grid-template-columns:
    .72fr
    1.65fr
    .62fr;

  gap:
    58px;

  align-items:
    start;

}


.aria-footer-brand img {

  display:
    block;

  width:
    116px;

  height:
    auto;

  margin-bottom:
    21px;

}


.aria-footer-brand p {

  margin:
    0;

  max-width:
    240px;

  color:
    rgba(255,255,255,.72);

  font-size:
    13px;

  line-height:
    1.65;

}


.aria-footer-company h2 {

  margin:
    0
    0
    19px;

  color:
    #ffffff;

  font-family:
    "Montserrat",
    Arial,
    sans-serif;

  font-size:
    14px;

  line-height:
    1.2;

  font-weight:
    700;

  letter-spacing:
    .08em;

}


.aria-footer-data p {

  margin:
    0
    0
    7px;

  color:
    rgba(255,255,255,.78);

  font-size:
    12.5px;

  line-height:
    1.55;

}


.aria-footer-data strong {

  color:
    #ffffff;

  font-weight:
    600;

}


.aria-footer-data span {

  padding:
    0
    5px;

}


.aria-company-footer a {

  color:
    rgba(255,255,255,.88);

  text-decoration:
    none;

}


.aria-company-footer a:hover {

  color:
    #f0dc43;

}


.aria-footer-legal {

  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-start;

  gap:
    10px;

}


.aria-footer-legal-title {

  margin:
    0
    0
    7px;

  color:
    #ffffff;

  font-size:
    13px;

  font-weight:
    700;

  letter-spacing:
    .06em;

}


.aria-footer-legal a {

  font-size:
    13px;

}


.aria-footer-bottom {

  display:
    flex;

  justify-content:
    space-between;

  align-items:
    center;

  gap:
    20px;

  margin-top:
    46px;

  padding-top:
    20px;

  border-top:
    1px solid
    rgba(255,255,255,.11);

  color:
    rgba(255,255,255,.48);

  font-size:
    11px;

}


/* =========================================================
   LINK PRIVACY NEL FORM
   ========================================================= */

.contact-form a {

  color:
    #275fcf;

  font-weight:
    600;

  text-decoration:
    underline;

  text-underline-offset:
    2px;

}


/* =========================================================
   LEGAL PAGES
   ========================================================= */

.legal-page {

  margin:
    0;

  background:
    #f5f6fb;

}


.legal-main {

  padding-top:
    92px;

}


.legal-shell {

  width:
    min(
      1000px,
      calc(100% - 54px)
    );

  margin:
    0 auto;

}


.legal-hero {

  background:
    #c9cbe7;

  padding:
    86px
    0
    72px;

}


.legal-kicker {

  margin:
    0
    0
    15px;

  color:
    #3470dd;

  text-transform:
    uppercase;

  font-size:
    12px;

  font-weight:
    700;

  letter-spacing:
    .14em;

}


.legal-hero h1 {

  margin:
    0;

  color:
    #ffffff;

  font-family:
    "Montserrat",
    Arial,
    sans-serif;

  font-size:
    clamp(
      46px,
      6vw,
      76px
    );

  line-height:
    .98;

  letter-spacing:
    -.04em;

}


.legal-lead {

  max-width:
    720px;

  margin:
    27px
    0
    0;

  color:
    #24278d;

  font-size:
    17px;

  line-height:
    1.7;

}


.legal-update {

  margin:
    18px
    0
    0;

  color:
    rgba(36,39,141,.62);

  font-size:
    12px;

}


.legal-content {

  padding:
    72px
    0
    96px;

}


.legal-card {

  background:
    #ffffff;

  padding:
    58px
    64px;

  box-shadow:
    0 20px 60px
    rgba(23,23,127,.07);

}


.legal-card h2 {

  margin:
    43px
    0
    16px;

  color:
    #17177f;

  font-family:
    "Montserrat",
    Arial,
    sans-serif;

  font-size:
    22px;

  line-height:
    1.25;

  font-weight:
    700;

}


.legal-card h2:first-child {

  margin-top:
    0;

}


.legal-card p,
.legal-card li {

  color:
    #34367b;

  font-size:
    15px;

  line-height:
    1.75;

}


.legal-card p {

  margin:
    0
    0
    15px;

}


.legal-card li {

  margin-bottom:
    8px;

}


.legal-card a {

  color:
    #2766d8;

  font-weight:
    600;

  text-decoration:
    underline;

  text-underline-offset:
    2px;

}


@media (max-width: 900px) {

  .aria-company-footer-grid {

    grid-template-columns:
      1fr
      1.5fr;

  }


  .aria-footer-legal {

    grid-column:
      1 / -1;

  }

}


@media (max-width: 640px) {

  .aria-company-footer {

    padding-top:
      48px;

  }


  .aria-company-footer-grid {

    grid-template-columns:
      1fr;

    gap:
      36px;

  }


  .aria-footer-bottom {

    flex-direction:
      column;

    align-items:
      flex-start;

  }


  .legal-main {

    padding-top:
      78px;

  }


  .legal-hero {

    padding:
      65px
      0
      55px;

  }


  .legal-shell {

    width:
      calc(100% - 34px);

  }


  .legal-card {

    padding:
      38px
      25px;

  }

}


/* === ARIA A8.0 END === */

/* === ARIA A8.1 START === */


/* =========================================================
   1 — CTA COLLABORATORI
   più aria rispetto alla fila dei loghi
   ========================================================= */

.associates-more-wrap {

  margin-top:
    74px !important;

}


/* =========================================================
   2 — LOGHI CLIENTI
   Procura / Barilla / Comune
   ZERO CARD VISIVA
   ========================================================= */

.collaborations .client-logo {

  background:
    transparent !important;

  border:
    0 !important;

  outline:
    0 !important;

  box-shadow:
    none !important;

  backdrop-filter:
    none !important;

  -webkit-backdrop-filter:
    none !important;

}


/*
 * manteniamo gli ingombri della griglia,
 * ma visivamente resta soltanto il logo
 */

.collaborations .client-logo img {

  display:
    block;

  margin:
    0 auto;

  filter:
    none !important;

  box-shadow:
    none !important;

}


/* =========================================================
   3 — HANDSHAKE DEFINITIVA
   ========================================================= */

.collaborations-inner
.aria-editorial-icon--collaborations {

  width:
    76px !important;

  height:
    76px !important;

  margin:
    0
    auto
    19px
    auto !important;

  color:
    #3f70e7 !important;

}


.collaborations-inner
.aria-editorial-icon--collaborations svg {

  width:
    68px !important;

  height:
    68px !important;

  stroke-width:
    1.65 !important;

  overflow:
    visible !important;

}


/* =========================================================
   4 — CONTATTI
   contrasto forte a sinistra,
   più leggero verso il form
   ========================================================= */

.contact-shade {

  background:

    linear-gradient(
      90deg,

      rgba(18, 45, 91, .74)
      0%,

      rgba(27, 69, 122, .62)
      31%,

      rgba(49, 99, 151, .39)
      54%,

      rgba(72, 125, 174, .16)
      74%,

      rgba(72, 125, 174, .08)
      100%

    ) !important;

}


.contact-copy h2 {

  color:
    #ffffff !important;

  text-shadow:
    0 3px 20px
    rgba(8, 25, 59, .20);

}


.contact-copy .eyebrow {

  color:
    rgba(255,255,255,.91) !important;

}


.contact-copy p:not(.eyebrow) {

  color:
    rgba(255,255,255,.94) !important;

  text-shadow:
    0 2px 14px
    rgba(8, 25, 59, .18);

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

  .associates-more-wrap {

    margin-top:
      46px !important;

  }


  .contact-shade {

    background:

      rgba(
        22,
        57,
        106,
        .58
      ) !important;

  }

}


/* === ARIA A8.1 END === */

/* === ARIA A8.2B START === */


/* =========================================================
   ASSOCIATES
   grid.png = sfondo dell'intera sezione
   ========================================================= */

.associates {

  position:
    relative;

  background-color:
    #c7c8e4 !important;

  background-image:

    linear-gradient(
      rgba(199, 200, 228, .78),
      rgba(199, 200, 228, .78)
    ),

    url("assets/images/grid.png") !important;

  background-size:
    cover !important;

  background-position:
    center center !important;

  background-repeat:
    no-repeat !important;

}


/*
 * contenuti sempre sopra lo sfondo
 */

.associates > * {

  position:
    relative;

  z-index:
    1;

}


/* =========================================================
   FLAT ORIGINALE
   ========================================================= */

.associates-content
.aria-editorial-icon--associates {

  display:
    flex !important;

  width:
    70px !important;

  height:
    70px !important;

  margin:
    0
    0
    18px
    0 !important;

  color:
    #3f70e7 !important;

}


.associates-content
.aria-editorial-icon--associates svg {

  display:
    block !important;

  width:
    58px !important;

  height:
    58px !important;

  fill:
    none !important;

  stroke:
    currentColor !important;

  stroke-width:
    2.15 !important;

}


/* elimina eventuale wrapper immagine A8.2 */

.associates-grid-image {

  display:
    none !important;

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

  .associates {

    background-position:
      center center !important;

  }

}


/* === ARIA A8.2B END === */

/* === ARIA A8.3 MOTION START === */


/* =========================================================
   EASING
   ========================================================= */

:root {
  --aria-motion:
    cubic-bezier(.22,.72,.28,1);
}


/* =========================================================
   HERO — ingresso iniziale elegante
   ========================================================= */

.hero .hero-logo {
  animation:
    ariaHeroLogo
    900ms
    var(--aria-motion)
    80ms
    both;
}

.hero .eyebrow {
  animation:
    ariaHeroUp
    780ms
    var(--aria-motion)
    230ms
    both;
}

.hero h1 {
  animation:
    ariaHeroUp
    900ms
    var(--aria-motion)
    330ms
    both;
}

.hero .hero-content > p:not(.eyebrow),
.hero .hero-copy,
.hero .hero-subtitle {
  animation:
    ariaHeroUp
    850ms
    var(--aria-motion)
    470ms
    both;
}

.hero .button,
.hero .btn,
.hero .hero-cta {
  animation:
    ariaHeroUp
    820ms
    var(--aria-motion)
    610ms
    both;
}


@keyframes ariaHeroLogo {

  from {
    opacity: 0;
    transform:
      translateY(18px)
      scale(.96);
  }

  to {
    opacity: 1;
    transform:
      translateY(0)
      scale(1);
  }

}


@keyframes ariaHeroUp {

  from {
    opacity: 0;
    transform:
      translateY(24px);
  }

  to {
    opacity: 1;
    transform:
      translateY(0);
  }

}


/* =========================================================
   SCROLL REVEAL
   IMPORTANTE:
   niente opacity:0 permanente.
   L'animazione parte solo quando JS aggiunge .aria-motion-run
   ========================================================= */

.aria-motion-enter.aria-motion-run {

  animation:
    ariaRevealUp
    760ms
    var(--aria-motion)
    var(--aria-motion-delay, 0ms)
    both;

}


@keyframes ariaRevealUp {

  0% {
    opacity: 0;
    transform:
      translateY(26px);
  }

  100% {
    opacity: 1;
    transform:
      translateY(0);
  }

}


/* =========================================================
   CARD SETTORI
   ========================================================= */

.sectors [data-sector] {

  transition:
    transform
    320ms
    var(--aria-motion),
    filter
    320ms
    var(--aria-motion);

}

.sectors [data-sector]:hover {

  transform:
    translateY(-7px);

  filter:
    brightness(1.035);

}


/* =========================================================
   CARD COLLABORATORI
   ========================================================= */

.partner-card {

  transition:
    transform
    320ms
    var(--aria-motion),
    box-shadow
    320ms
    var(--aria-motion);

}

.partner-card:hover {

  transform:
    translateY(-6px);

  box-shadow:
    0 22px 48px
    rgba(27,30,113,.13);

}


/* =========================================================
   CTA COLLABORATORI
   ========================================================= */

.associates-more span {

  transition:
    transform
    260ms
    var(--aria-motion);

}

.associates-more:hover span {

  transform:
    translate(5px,-1px);

}


/* =========================================================
   LOGHI CLIENTI
   ========================================================= */

.collaborations .client-logo img {

  transition:
    transform
    340ms
    var(--aria-motion),
    opacity
    340ms
    ease;

}

.collaborations .client-logo:hover img {

  transform:
    translateY(-4px)
    scale(1.025);

}


/* =========================================================
   GRID.PNG
   movimento lentissimo, quasi impercettibile
   ========================================================= */

.associates {

  animation:
    ariaGridDrift
    22s
    ease-in-out
    infinite
    alternate;

}

@keyframes ariaGridDrift {

  from {
    background-position:
      48% 50%;
  }

  to {
    background-position:
      52% 50%;
  }

}


/* =========================================================
   FORM CONTATTI
   ========================================================= */

.contact-form {

  transition:
    transform
    360ms
    var(--aria-motion),
    box-shadow
    360ms
    var(--aria-motion);

}

.contact-form:hover {

  transform:
    translateY(-3px);

  box-shadow:
    0 28px 65px
    rgba(18,46,92,.14)
    !important;

}


/* =========================================================
   ACCESSIBILITÀ
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .hero .hero-logo,
  .hero .eyebrow,
  .hero h1,
  .hero .hero-content > p,
  .hero .button,
  .hero .btn,
  .hero .hero-cta,
  .aria-motion-enter,
  .associates {

    animation:
      none !important;

  }


  .partner-card,
  .sectors [data-sector],
  .client-logo img,
  .contact-form,
  .associates-more span {

    transition:
      none !important;

  }

}


/* === ARIA A8.3 MOTION END === */

/* === ARIA A8.4C START === */


/* =========================================================
   ABOUT — DIREZIONE DEL REVEAL NATIVO
   Nessun nuovo JavaScript.
   Utilizza il motore .reveal -> .in-view già esistente.
   ========================================================= */


/* PRIMA CARD
   entra da sinistra
 */

.about
.content-card.about-reveal-left.reveal {

  opacity:
    0;

  transform:
    translate3d(
      -120px,
      0,
      0
    );

  transition:
    opacity
    1050ms
    cubic-bezier(.22,.72,.28,1),

    transform
    1050ms
    cubic-bezier(.22,.72,.28,1);

}


/* SECONDA CARD
   entra da destra
 */

.about
.content-card.about-reveal-right.reveal {

  opacity:
    0;

  transform:
    translate3d(
      120px,
      0,
      0
    );

  transition:
    opacity
    1050ms
    cubic-bezier(.22,.72,.28,1),

    transform
    1050ms
    cubic-bezier(.22,.72,.28,1);

}


/* STATO ARRIVATO
   specificità superiore al reveal base
 */

.about
.content-card.about-reveal-left.reveal.in-view,

.about
.content-card.about-reveal-right.reveal.in-view {

  opacity:
    1;

  transform:
    translate3d(
      0,
      0,
      0
    );

}


/* =========================================================
   HERO SUBTITLE
   una sola riga su desktop
   ========================================================= */

@media (min-width: 900px) {

  .hero .hero-copy {

    width:
      max-content !important;

    max-width:
      none !important;

    white-space:
      nowrap !important;

    margin-left:
      auto !important;

    margin-right:
      auto !important;

  }

}


/* =========================================================
   MOBILE
   movimento più contenuto
   testo hero libero di andare a capo
   ========================================================= */

@media (max-width: 899px) {

  .about
  .content-card.about-reveal-left.reveal {

    transform:
      translate3d(
        -48px,
        0,
        0
      );

  }


  .about
  .content-card.about-reveal-right.reveal {

    transform:
      translate3d(
        48px,
        0,
        0
      );

  }


  .about
  .content-card.about-reveal-left.reveal.in-view,

  .about
  .content-card.about-reveal-right.reveal.in-view {

    transform:
      none;

  }


  .hero .hero-copy {

    width:
      auto !important;

    max-width:
      100% !important;

    white-space:
      normal !important;

  }

}


/* =========================================================
   ACCESSIBILITÀ
   ========================================================= */

@media (
  prefers-reduced-motion:
  reduce
) {

  .about
  .content-card.about-reveal-left,

  .about
  .content-card.about-reveal-right {

    opacity:
      1 !important;

    transform:
      none !important;

    transition:
      none !important;

  }

}


/* === ARIA A8.4C END === */

/* === ARIA A8.5 MOBILE POLISH START === */

/* =========================================================
   MOBILE ONLY
   Hero / Fondamenti V5 / Collaborazioni
   ========================================================= */

@media (max-width: 760px) {

  /* =======================================================
     1. HERO — SCROLL CUE
     Il piccolo indicatore non deve sovrapporsi al CTA.
     ======================================================= */

  .hero .scroll-cue {
    bottom: 146px !important;

    width: 22px !important;
    height: 36px !important;

    opacity: .82;

    border-color:
      rgba(255,255,255,.72) !important;

    z-index: 4 !important;
  }

  .hero .scroll-cue span {
    width: 3px !important;
    height: 6px !important;

    margin-top: 7px !important;
  }


  /* =======================================================
     2. FONDAMENTI V5 — STRUTTURA MOBILE
     ======================================================= */

  .foundations-v5 {
    padding:
      64px
      0
      72px !important;

    background:
      linear-gradient(
        180deg,
        #ffffff 0%,
        #fbfcff 100%
      ) !important;
  }

  .foundations-v5 .fv5-stage {
    width:
      calc(100% - 38px) !important;

    max-width:
      620px !important;

    min-height:
      0 !important;

    margin:
      0 auto !important;

    display:
      flex !important;

    flex-direction:
      column !important;

    align-items:
      stretch !important;

    gap:
      0 !important;
  }


  /* =======================================================
     TESTATA FONDAMENTI
     ======================================================= */

  .foundations-v5 .fv5-main {
    order: 0 !important;

    width:
      100% !important;

    display:
      flex !important;

    flex-direction:
      column !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    margin:
      0
      auto
      34px !important;

    text-align:
      center !important;
  }

  .foundations-v5 .fv5-logo {
    width:
      158px !important;

    max-width:
      158px !important;

    height:
      auto !important;

    margin:
      0 auto !important;

    opacity:
      .72 !important;
  }

  /*
   * Puntinatura più raffinata:
   * molto meno larga e molto meno pesante.
   */
  .foundations-v5 .fv5-dots {
    display:
      block !important;

    width:
      82px !important;

    height:
      0 !important;

    margin:
      22px
      auto
      24px !important;

    border:
      0 !important;

    border-top:
      2px dotted
      #3f70e7 !important;

    opacity:
      .9 !important;
  }

  .foundations-v5 .fv5-main h2 {
    margin:
      0 !important;

    font-size:
      clamp(
        2.18rem,
        10vw,
        2.72rem
      ) !important;

    line-height:
      .98 !important;

    text-align:
      center !important;

    white-space:
      normal !important;
  }

  .foundations-v5
  .fv5-main h2 em::before {
    width:
      56px !important;

    height:
      56px !important;

    left:
      24% !important;

    top:
      52% !important;
  }


  /* =======================================================
     VIA LE GEOMETRIE DESKTOP
     ======================================================= */

  .foundations-v5 .fv5-rule,
  .foundations-v5 .fv5-diagonal,
  .foundations-v5 .fv5-empty {
    display:
      none !important;
  }


  /* =======================================================
     ORDINE MOBILE ESPLICITO
     ======================================================= */

  .foundations-v5 .fv5-note--1 {
    order: 1 !important;
  }

  .foundations-v5 .fv5-note--2 {
    order: 2 !important;
  }

  .foundations-v5 .fv5-note--3 {
    order: 3 !important;
  }

  .foundations-v5 .fv5-note--5 {
    order: 4 !important;
  }

  .foundations-v5 .fv5-note--4 {
    order: 5 !important;
  }


  /* =======================================================
     TESTI FONDAMENTI
     niente più elenco con righe orizzontali pesanti
     ======================================================= */

  .foundations-v5 .fv5-note {
    position:
      relative !important;

    inset:
      auto !important;

    width:
      min(
        100%,
        570px
      ) !important;

    margin:
      0 auto !important;

    padding:
      23px
      12px
      17px !important;

    border:
      0 !important;

    background:
      transparent !important;

    text-align:
      center !important;

    box-shadow:
      none !important;
  }

  .foundations-v5 .fv5-note p {
    margin:
      0 auto !important;

    max-width:
      520px !important;

    color:
      #171987 !important;

    font-size:
      clamp(
        1rem,
        4.25vw,
        1.1rem
      ) !important;

    line-height:
      1.52 !important;

    font-weight:
      400 !important;
  }


  /* =======================================================
     FRECCE TRA I FONDAMENTI
     ======================================================= */

  .foundations-v5
  .fv5-note:not(.fv5-note--4)::after {
    content:
      "" !important;

    display:
      block !important;

    width:
      10px !important;

    height:
      10px !important;

    margin:
      25px
      auto
      1px !important;

    border-right:
      2px solid
      rgba(63,112,231,.82) !important;

    border-bottom:
      2px solid
      rgba(63,112,231,.82) !important;

    transform:
      translateY(0)
      rotate(45deg);

    animation:
      ariaFoundationArrow
      1.65s
      ease-in-out
      infinite;

    opacity:
      .72;
  }


  /* =======================================================
     REVEAL PROGRESSIVO
     usa il .reveal / .in-view già presente
     ======================================================= */

  .foundations-v5
  .fv5-note.reveal {
    opacity:
      0;

    transform:
      translate3d(
        0,
        24px,
        0
      );

    transition:
      opacity
      .68s
      cubic-bezier(.22,.72,.28,1),

      transform
      .68s
      cubic-bezier(.22,.72,.28,1);
  }

  .foundations-v5
  .fv5-note.reveal.in-view {
    opacity:
      1;

    transform:
      translate3d(
        0,
        0,
        0
      );
  }

  .foundations-v5
  .fv5-note--1.reveal {
    transition-delay:
      40ms;
  }

  .foundations-v5
  .fv5-note--2.reveal {
    transition-delay:
      90ms;
  }

  .foundations-v5
  .fv5-note--3.reveal {
    transition-delay:
      140ms;
  }

  .foundations-v5
  .fv5-note--5.reveal {
    transition-delay:
      190ms;
  }

  .foundations-v5
  .fv5-note--4.reveal {
    transition-delay:
      240ms;
  }


  /* =======================================================
     3. COLLABORAZIONI
     togliamo il grande vuoto prima della handshake
     ======================================================= */

  .collaborations {
    padding:
      70px
      0
      82px !important;
  }

  .collaborations-inner
  .aria-editorial-icon--collaborations {
    width:
      62px !important;

    height:
      62px !important;

    margin:
      0
      auto
      12px !important;
  }

  .collaborations-inner
  .aria-editorial-icon--collaborations svg {
    width:
      56px !important;

    height:
      56px !important;

    stroke-width:
      1.65 !important;
  }


  /* =======================================================
     TITOLO / TESTO COLLABORAZIONI
     ======================================================= */

  .collaborations h2 {
    margin-bottom:
      22px !important;

    font-size:
      clamp(
        2.25rem,
        10.5vw,
        3.15rem
      ) !important;

    line-height:
      1.02 !important;
  }

  .collaborations .lead {
    max-width:
      650px !important;

    margin-left:
      auto !important;

    margin-right:
      auto !important;

    line-height:
      1.55 !important;
  }


  /* =======================================================
     LOGHI CLIENTI
     Procura / Barilla / Comune
     ======================================================= */

  .collaborations .client-logos {
    width:
      min(
        100%,
        330px
      ) !important;

    max-width:
      330px !important;

    margin:
      54px
      auto
      0 !important;

    grid-template-columns:
      1fr !important;

    gap:
      38px !important;

    align-items:
      center !important;
  }

  .collaborations .client-logo {
    width:
      100% !important;

    min-height:
      0 !important;

    height:
      auto !important;

    padding:
      0 !important;

    margin:
      0 auto !important;

    background:
      transparent !important;

    border:
      0 !important;

    box-shadow:
      none !important;
  }

  /*
   * Procura:
   * logo molto orizzontale
   */
  .collaborations
  .client-logo:nth-child(1) img {
    width:
      auto !important;

    max-width:
      270px !important;

    height:
      52px !important;

    object-fit:
      contain !important;
  }

  /*
   * Barilla:
   * ridotta sensibilmente
   */
  .collaborations
  .client-logo:nth-child(2) img {
    width:
      auto !important;

    max-width:
      230px !important;

    height:
      66px !important;

    object-fit:
      contain !important;
  }

  /*
   * Comune:
   * serve un po' più di altezza
   * per stemma + lettering
   */
  .collaborations
  .client-logo:nth-child(3) img {
    width:
      auto !important;

    max-width:
      205px !important;

    height:
      82px !important;

    object-fit:
      contain !important;
  }

  .collaborations .more {
    margin-top:
      46px !important;
  }

}


/* =========================================================
   FRECCIA FONDAMENTI
   ========================================================= */

@keyframes ariaFoundationArrow {

  0%,
  100% {
    transform:
      translateY(0)
      rotate(45deg);

    opacity:
      .42;
  }

  50% {
    transform:
      translateY(7px)
      rotate(45deg);

    opacity:
      1;
  }

}


/* =========================================================
   ACCESSIBILITÀ
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .foundations-v5
  .fv5-note.reveal {
    opacity:
      1 !important;

    transform:
      none !important;

    transition:
      none !important;
  }

  .foundations-v5
  .fv5-note::after {
    animation:
      none !important;
  }

}

/* === ARIA A8.5 MOBILE POLISH END === */

/* === ARIA A8.6 START === */


/* =========================================================
   HERO MOBILE
   cue realmente tra testo e CTA
   ========================================================= */

@media (max-width: 760px) {

  .hero .hero-logo {
    order: 0 !important;
  }

  .hero .eyebrow {
    order: 1 !important;
  }

  .hero h1 {
    order: 2 !important;
  }

  .hero .hero-copy {
    order: 3 !important;

    margin:
      28px
      auto
      0 !important;
  }

  .hero .scroll-cue {
    order: 4 !important;

    position:
      relative !important;

    inset:
      auto !important;

    bottom:
      auto !important;

    left:
      auto !important;

    right:
      auto !important;

    top:
      auto !important;

    transform:
      none !important;

    width:
      22px !important;

    height:
      36px !important;

    margin:
      20px
      auto
      18px !important;

    flex:
      0 0 auto !important;
  }

  .hero .scroll-cue span {
    width:
      3px !important;

    height:
      6px !important;

    margin:
      7px auto !important;
  }

  .hero .button.button--outline {
    order:
      5 !important;

    margin-top:
      0 !important;
  }

}


/* =========================================================
   EDITORIAL ICON MOTION
   leggero, continuo, non invasivo
   ========================================================= */

.aria-editorial-icon svg {
  transform-origin:
    50% 50%;

  animation:
    ariaEditorialFloat
    4.6s
    cubic-bezier(.45,.05,.55,.95)
    infinite;

  will-change:
    transform;
}

.aria-editorial-icon--collaborations svg {
  animation-delay:
    .35s;
}

.aria-editorial-icon--profile svg {
  animation-delay:
    .7s;
}


/* piccola reazione al passaggio mouse */

@media (hover:hover) {

  .aria-editorial-icon:hover svg {
    animation:
      ariaEditorialPop
      .65s
      cubic-bezier(.22,.72,.28,1)
      both;
  }

}


@keyframes ariaEditorialFloat {

  0%,
  100% {
    transform:
      translate3d(0,0,0)
      rotate(0deg);
  }

  50% {
    transform:
      translate3d(0,-6px,0)
      rotate(-1.5deg);
  }

}


@keyframes ariaEditorialPop {

  0% {
    transform:
      translateY(0)
      scale(1);
  }

  45% {
    transform:
      translateY(-5px)
      scale(1.08);
  }

  100% {
    transform:
      translateY(0)
      scale(1);
  }

}


/* =========================================================
   ACCESSIBILITÀ
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .aria-editorial-icon svg {
    animation:
      none !important;

    transform:
      none !important;
  }

}


/* === ARIA A8.6 END === */

/* === ARIA A8.6B START === */

/* =========================================================
   HERO MOBILE — più aria sotto CTA
   evita che il bottone tocchi la fascia/divisoria
   ========================================================= */

@media (max-width: 760px) {

  .hero {
    padding-bottom:
      110px !important;
  }

  .hero-content {
    padding-bottom:
      22px !important;
  }

  .hero .scroll-cue {
    margin:
      16px auto 20px !important;
  }

  .hero .button.button--outline {
    margin-top:
      0 !important;

    margin-bottom:
      34px !important;

    position:
      relative !important;

    z-index:
      3 !important;
  }

  /* piccolo respiro in apertura della sezione successiva */
  .about.section-blue {
    padding-top:
      54px !important;
  }

}

/* === ARIA A8.6B END === */

/* === ARIA A8.6C START === */

@media (max-width: 760px) {

  .hero .hero-logo {
    width: 146px !important;
    max-width: 146px !important;

    /*
     * Prima: 30px sopra / 48px sotto = 78px
     * Ora:   46px sopra / 32px sotto = 78px
     *
     * Abbassiamo il logo senza spostare
     * verticalmente il resto della hero.
     */
    margin:
      46px
      auto
      32px
      auto !important;
  }

}

/* === ARIA A8.6C END === */