:root{
  --teal:#3A9A9E;
  --teal-deep:#1F5A5C;
  --verde:#7BC043;
  --verde-deep:#3F6E1E;
  --salvia:#5B9A5F;
  --teal-light:#C4E5E5;
  --ink:#0A0E10;
  --ink-2:#10161A;
  --ink-3:#161D22;
  --line:rgba(255,255,255,.08);
  --text:#E7EEF1;
  --text-dim:#9AA8B0;
}

* { -webkit-font-smoothing:antialiased; }
html, body { background: var(--ink); color: var(--text); font-family:'Source Sans 3', system-ui, sans-serif; }
html { overflow-x: clip; }
body { overflow-x: clip; }
.font-display { font-family:'Space Grotesk', 'Source Sans 3', sans-serif; letter-spacing:-.02em; }
.ts-balance { text-wrap:balance; }

/* GRAIN OVERLAY GLOBALE */
.grain::before{
  content:""; position:fixed; inset:0; z-index:60; pointer-events:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  opacity:.12; mix-blend-mode:overlay;
}

/* GRID DOTS */
.grid-bg{
  background-image: radial-gradient(circle at 1px 1px, rgba(255,255,255,.06) 1px, transparent 0);
  background-size:28px 28px;
}

/* GRADIENT MESH */
.mesh{
  position:absolute; inset:0; overflow:hidden; z-index:0;
  background:
    radial-gradient(60% 50% at 20% 30%, rgba(58,154,158,.55), transparent 70%),
    radial-gradient(50% 40% at 85% 70%, rgba(123,192,67,.35), transparent 70%),
    radial-gradient(40% 35% at 60% 20%, rgba(196,229,229,.18), transparent 70%),
    linear-gradient(180deg, #0A0E10 0%, #06090B 100%);
}
.mesh::after{
  content:""; position:absolute; inset:-40%;
  background: conic-gradient(from 90deg at 50% 50%, rgba(58,154,158,.18), rgba(123,192,67,.10), rgba(58,154,158,.18));
  filter:blur(80px); animation:spin 28s linear infinite; opacity:.6;
}
@keyframes spin { to { transform:rotate(360deg); } }

/* CURSOR */
.cursor{
  position:fixed; width:18px; height:18px; border-radius:50%;
  background:var(--verde); pointer-events:none; z-index:90;
  mix-blend-mode:difference; transform:translate(-50%,-50%);
  transition:width .25s ease, height .25s ease, background .25s ease;
}
.cursor.lg{ width:60px; height:60px; background:var(--teal-light); }
@media (max-width:768px){ .cursor{ display:none; } }

/* GLASS */
.glass{
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  backdrop-filter:blur(18px) saturate(140%);
  border:1px solid var(--line);
  border-radius:22px;
}

/* GRADIENT BORDER */
.grad-border{ position:relative; border-radius:22px; isolation:isolate; }
.grad-border::before{
  content:""; position:absolute; inset:0; padding:1px; border-radius:inherit;
  background:linear-gradient(135deg, rgba(58,154,158,.6), rgba(123,192,67,.4) 40%, rgba(255,255,255,.08) 80%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite:exclude; pointer-events:none;
}

/* BUTTONS */
.btn{
  display:inline-flex; align-items:center; gap:.6rem; padding:.95rem 1.4rem;
  border-radius:999px; font-weight:500; letter-spacing:.01em;
  transition:transform .25s ease, box-shadow .3s ease, background .3s ease;
}
.btn-primary{
  background:linear-gradient(135deg, var(--teal), var(--verde));
  color:#06090B;
  box-shadow:0 10px 40px -10px rgba(58,154,158,.55), inset 0 -1px 0 rgba(0,0,0,.15);
}
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 18px 60px -10px rgba(58,154,158,.7); }
.btn-ghost{ background:rgba(255,255,255,.06); color:var(--text); border:1px solid var(--line); }
.btn-ghost:hover{ background:rgba(255,255,255,.1); }

/* BOB */
@keyframes bob { 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(8px);} }
.bob { animation:bob 2.4s ease-in-out infinite; }

/* MARQUEE */
.marquee { overflow:hidden; mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee-track { display:flex; gap:3rem; animation:marq 38s linear infinite; will-change:transform; }
@keyframes marq { from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

/* CHIP */
.chip{ display:inline-flex; align-items:center; gap:.5rem; padding:.4rem .8rem; border:1px solid var(--line); border-radius:999px; font-size:.78rem; color:var(--text-dim); letter-spacing:.06em; text-transform:uppercase; }
.chip .dot{ width:6px; height:6px; border-radius:50%; background:var(--verde); box-shadow:0 0 12px var(--verde); }

/* SVC CARDS */
.svc{ position:relative; overflow:hidden; border-radius:22px; }
.svc img{ transition:transform .9s cubic-bezier(.2,.6,.2,1), filter .6s ease; }
.svc:hover img{ transform:scale(1.06); filter:saturate(1.1); }
.svc::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 30%, rgba(6,9,11,.85) 90%); }
.svc .info{ position:absolute; inset:auto 0 0 0; padding:1.6rem 1.6rem 1.4rem; z-index:2; }
.svc .desc{ max-height:0; overflow:hidden; opacity:0; transition:max-height .5s ease, opacity .4s ease, margin-top .4s ease; }
.svc:hover .desc{ max-height:200px; opacity:1; margin-top:.6rem; }

/* STROKE NUMBERS */
.stroke-num{
  -webkit-text-stroke:1px rgba(255,255,255,.5);
  color:transparent; font-family:'Space Grotesk', sans-serif; font-weight:600;
}

/* TIMELINE */
.timeline-line{
  position:absolute; left:31px; top:0; bottom:0; width:2px;
  background:linear-gradient(180deg, transparent, var(--teal), var(--verde), transparent);
  transform-origin:top; transform:scaleY(0);
}

/* TECH CAROUSEL (scroll orizzontale snappato, niente pin verticale) */
.tech-track{
  display:flex; gap:24px; flex-wrap:nowrap;
  overflow-x:auto; overflow-y:hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 4px;
  -webkit-overflow-scrolling: touch;
}
.tech-track::-webkit-scrollbar{ display:none; }
.tech-card{
  flex-grow:0; flex-shrink:0; flex-basis:auto;
  width:min(82vw, 720px); height:min(60vh, 540px); min-height:380px;
  scroll-snap-align: start;
}
@media (min-width: 768px){
  .tech-card{ width:min(70vw, 820px); height:min(58vh, 560px); min-height:440px; }
}

/* Immagine ruotata 180° (per card Voltra dove la foto è capovolta) */
.tech-flip{ transform: rotate(180deg); }

/* WORD REVEAL */
.word{ display:inline-block; overflow:hidden; vertical-align:top; }
.word > span{ display:inline-block; transform:translateY(110%); }

/* LINK ARROW */
.arrow-link{ display:inline-flex; align-items:center; gap:.5rem; color:var(--verde); font-weight:500; }
.arrow-link svg{ transition:transform .35s ease; }
.arrow-link:hover svg{ transform:translateX(6px); }

/* DIVIDER */
.divider{ height:1px; background:linear-gradient(90deg, transparent, var(--teal), transparent); }

/* LABEL */
.label{ font-family:'Space Grotesk'; letter-spacing:.32em; font-size:.72rem; text-transform:uppercase; color:var(--teal-light); }
.label::before{ content:"◐ "; color:var(--verde); }

/* GRADIENT TEXT */
.grad-text{
  background:linear-gradient(135deg, #fff 0%, var(--teal-light) 60%, var(--verde) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* MASK IMG */
.mask-img { mask-image:linear-gradient(180deg, #000 60%, transparent 100%); }

/* MAP DARK */
.map-frame { filter:invert(1) hue-rotate(180deg) saturate(.7) brightness(.95) contrast(1.05); }

/* FLOATY */
@keyframes floaty { 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-10px); } }
.floaty { animation: floaty 5s ease-in-out infinite; }

/* HAMBURGER ICON (3 linee animate in X) */
.ham-icon{ position:relative; width:18px; height:14px; display:inline-block; }
.ham-icon span{
  position:absolute; left:0; right:0; height:2px; background:var(--text);
  border-radius:2px; transition: transform .3s ease, top .3s ease, opacity .25s ease;
}
.ham-icon span:nth-child(1){ top:0; }
.ham-icon span:nth-child(2){ top:6px; }
.ham-icon span:nth-child(3){ top:12px; }
#nav-toggle.is-open .ham-icon span:nth-child(1){ top:6px; transform: rotate(45deg); }
#nav-toggle.is-open .ham-icon span:nth-child(2){ opacity:0; }
#nav-toggle.is-open .ham-icon span:nth-child(3){ top:6px; transform: rotate(-45deg); }

/* PAGE HERO (interne) */
.page-hero{ min-height:60vh; display:flex; align-items:flex-end; padding:8rem 0 4rem; position:relative; overflow:hidden; }
.page-hero .mesh{ opacity:.85; }

/* TEAM CARD */
.team-card img{ transition: transform .8s ease, filter .5s ease; filter: grayscale(.3); }
.team-card:hover img{ transform: scale(1.05); filter: grayscale(0); }

/* ACCORDION */
.acc-item{ border-bottom:1px solid var(--line); }
.acc-trigger{ width:100%; text-align:left; padding:1.5rem 0; display:flex; justify-content:space-between; align-items:center; gap:2rem; cursor:pointer; transition:color .3s; }
.acc-trigger:hover{ color:var(--teal-light); }
.acc-trigger .ico{ width:36px; height:36px; border-radius:50%; border:1px solid var(--line); display:grid; place-items:center; transition: transform .4s, background .3s; flex-shrink:0; }
.acc-item.open .acc-trigger .ico{ transform: rotate(45deg); background:var(--teal); color:#06090B; border-color:var(--teal); }
.acc-content{ max-height:0; overflow:hidden; transition: max-height .5s ease; }
.acc-item.open .acc-content{ max-height:600px; }
.acc-content > div{ padding:0 0 1.5rem; color:var(--text-dim); line-height:1.7; }