/* TRIMAP / Nuovo sito multipagina - 2026. Design system dark industrial */
:root {
  --bg:#06151f;
  --bg2:#092331;
  --surface:rgba(11,38,54,.88);
  --surface2:rgba(16,53,71,.8);
  --stroke:rgba(75,178,207,.22);
  --stroke2:rgba(109,224,240,.43);
  --text:#f4f8fa;
  --muted:#a9c0cf;
  --cyan:#35e5f4;
  --turq:#6ee7c8;
  --blue:#6bb8ff;
  --radius:20px;
  --max:1216px;
  --glow:0 20px 80px rgba(0,0,0,.26)
}
*,*::before,*::after {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:93px;
  background:#092638
}
body {
  margin:0;
  position:relative;
  min-height:100vh;
  overflow-x:clip;
  color:var(--text);
  font:400 15px/1.65 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:transparent
}
button,input,textarea,select {
  font:inherit
}
button,a {
  -webkit-tap-highlight-color:transparent
}
a {
  text-decoration:none;
  color:inherit
}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible {
  outline:2px solid var(--cyan);
  outline-offset:4px
}
button {
  cursor:pointer
}
h1,h2,h3,h4,p {
  margin-top:0
}
h1,h2,h3 {
  line-height:1.1;
  letter-spacing:-.055em
}
h1 {
  font-weight:800
}
h2 {
  font-weight:800;
  font-size:clamp(2.1rem,4vw,3.35rem)
}
h3 {
  font-weight:750
}
p {
  margin-bottom:0
}
img,svg {
  max-width:100%
}
svg {
  display:block
}
.icon-defs {
  position:absolute!important;
  width:0!important;
  height:0!important;
  overflow:hidden
}
.ico {
  width:21px;
  height:21px;
  flex-shrink:0;
  stroke:currentColor;
  stroke-width:1.65;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round
}
.container {
  width:min(var(--max),calc(100% - 70px));
  margin-inline:auto
}
.section {
  padding:106px 0;
  position:relative
}
.section:nth-of-type(odd) {
  background:rgba(5,17,27,.12)
}
.section-heading {
  display:flex;
  gap:55px;
  justify-content:space-between;
  align-items:end;
  margin-bottom:42px
}
.section-heading>div {
  max-width:710px
}
.section-heading .lead {
  max-width:420px;
  padding-bottom:3px
}
.section-heading h2 {
  margin-bottom:0
}
.eyebrow {
  text-transform:uppercase;
  letter-spacing:.20em;
  font-size:.72rem;
  line-height:1.55;
  font-weight:800;
  color:var(--cyan);
  margin-bottom:13px
}
.lead {
  color:var(--muted);
  font-size:1rem;
  line-height:1.8
}
.section-heading h2 span,.hero h1 span,.spotlight-copy h2 span {
  color:var(--cyan)
}
.pill {
  color:var(--cyan);
  font-weight:800;
  letter-spacing:.13em;
  font-size:.65rem
}
.card-index {
  color:#8baebd;
  font-size:.72rem;
  font-weight:750;
  letter-spacing:.1em
}
.btn {
  border:1px solid transparent;
  border-radius:100px;
  min-height:50px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:13px;
  padding:11px 22px;
  font-weight:800;
  font-size:.86rem;
  line-height:1.25;
  white-space:normal;
  transition:background .25s,border-color .25s,box-shadow .25s,transform .25s;
  position:relative
}
.btn .ico {
  height:17px;
  width:17px;
  transition:transform .25s
}
.btn:hover .ico {
  transform:translateX(4px)
}
.btn:hover {
  transform:translateY(-2px)
}
.btn-primary {
  background:linear-gradient(115deg,#3ae6f4,#59ddec 52%,#67ebd5);
  color:#031723;
  box-shadow:0 8px 28px rgba(20,220,243,.23)
}
.btn-primary:hover {
  box-shadow:0 12px 36px rgba(20,220,243,.35)
}
.btn-ghost,.btn-outline {
  border-color:rgba(40,211,240,.7);
  background:rgba(1,13,23,.38);
  color:var(--cyan)
}
.btn-ghost:hover,.btn-outline:hover {
  background:rgba(16,174,203,.12)
}
.btn-text {
  color:var(--cyan);
  padding-inline:0
}
.btn-full {
  width:100%
}
/* Original animated ambiance retained */
.animated-background {
  position:fixed;
  inset:-100px 0;
  z-index:0;
  pointer-events:none;
  background:linear-gradient(135deg,#103044 0%,#144053 55%,#102d42 100%);
  overflow:hidden
}
.bg-blob {
  position:absolute;
  opacity:.25;
  border-radius:50%;
  filter:blur(110px);
  animation:floatingBlob 20s ease-in-out infinite alternate
}
.blob-1 {
  width:560px;
  height:560px;
  left:-260px;
  top:-160px;
  background:#49e9d2
}
.blob-2 {
  width:680px;
  height:680px;
  right:-300px;
  bottom:-270px;
  background:#348dff;
  animation-delay:-5s
}
.blob-3 {
  width:420px;
  height:420px;
  right:35%;
  top:35%;
  background:#54a9fc;
  animation-delay:-10s;
  opacity:.13
}
@keyframes floatingBlob {
  from {
    transform:translate(0,0) scale(.93)
  }
  to {
    transform:translate(80px,-35px) scale(1.13)
  }
}
.noise-overlay {
  position:fixed;
  inset:0;
  z-index:1;
  pointer-events:none;
  opacity:.027;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E")
}
.site-header,main,.footer {
  position:relative;
  z-index:2
}
/* header */
.site-header {
  position:fixed;
  z-index:1000;
  top:0;
  left:0;
  right:0;
  background:rgba(3,17,27,.78);
  backdrop-filter:blur(21px);
  -webkit-backdrop-filter:blur(21px);
  border-bottom:1px solid rgba(100,217,234,.12);
  transition:background .25s
}
.site-header.scrolled {
  background:rgba(3,17,27,.96)
}
.nav-wrap {
  height:82px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px
}
.brand {
  display:inline-flex;
  align-items:center;
  flex-shrink:0
}
.brand img {
  width:178px;
  height:auto;
  display:block
}
.nav {
  display:flex;
  gap:24px;
  align-items:center;
  margin-left:auto
}
.nav>a {
  font-size:.83rem;
  font-weight:650;
  color:#d3e3ec;
  white-space:nowrap;
  transition:color .2s
}
.nav>a:hover,.nav>a.active {
  color:var(--cyan)
}
.nav>a:not(.nav-cta) {
  position:relative
}
.nav>a:not(.nav-cta)::after {
  content:"";
  height:2px;
  position:absolute;
  bottom:-10px;
  left:0;
  right:0;
  background:var(--cyan);
  transform:scaleX(0);
  transition:transform .2s
}
.nav>a.active:not(.nav-cta)::after,.nav>a:not(.nav-cta):hover::after {
  transform:scaleX(1)
}
.nav .nav-cta {
  display:inline-flex;
  align-items:center;
  gap:7px;
  border:1px solid var(--cyan);
  padding:10px 15px;
  border-radius:100px;
  margin-left:8px;
  color:var(--cyan)
}
.nav .nav-cta .ico {
  width:15px;
  height:15px
}
.menu-toggle {
  display:none;
  background:transparent;
  border:1px solid var(--stroke);
  border-radius:12px;
  color:#e2f8ff;
  padding:9px
}
.scroll-progress {
  position:fixed;
  top:0;
  left:0;
  z-index:1100;
  width:100%;
  height:3px;
  background:linear-gradient(90deg,var(--cyan),var(--turq));
  transform:scaleX(0);
  transform-origin:left;
  pointer-events:none;
  box-shadow:0 0 13px var(--cyan)
}
/* loader and prevent re-appearing text */
.page-loader {
  position:fixed;
  inset:0;
  z-index:5000;
  background:#102f40;
  display:flex;
  flex-direction:column;
  gap:18px;
  align-items:center;
  justify-content:center;
  transition:opacity .65s ease,visibility .65s ease
}
.page-loader.loaded {
  opacity:0;
  visibility:hidden;
  pointer-events:none
}
.trimap-loader {
  width:140px;
  height:130px
}
.triangle-piece {
  fill:#e4fdff;
  opacity:0;
  transform-box:fill-box;
  transform-origin:center;
  animation:triangleLoad .50s ease-out forwards
}
.piece-1 {
  animation-delay:.05s
}
.piece-2 {
  animation-delay:.35s
}
.piece-3 {
  animation-delay:.65s
}
.page-loader p {
  font-weight:800;
  letter-spacing:.27em;
  font-size:.94rem
}
.page-loader p span {
  display:block;
  letter-spacing:.24em;
  font-size:.5rem;
  text-align:center;
  font-weight:550;
  color:#89c7d4
}
@keyframes triangleLoad {
  from {
    opacity:0;
    transform:translateY(9px) scale(.78)
  }
  to {
    opacity:1;
    transform:none
  }
}
.js:not(.site-ready) .hero .hero-content .eyebrow,.js:not(.site-ready) .hero h1,.js:not(.site-ready) .hero .hero-copy,.js:not(.site-ready) .hero .hero-actions,.js:not(.site-ready) .hero .hero-points,.js:not(.site-ready) .hero .hero-mini-proof {
  opacity:0;
  transform:translateY(24px)
}
.site-ready .hero-content .eyebrow {
  animation:heroEnter .55s .03s both
}
.site-ready .hero h1 {
  animation:heroEnter .78s .14s both
}
.site-ready .hero-copy {
  animation:heroEnter .70s .28s both
}
.site-ready .hero-actions {
  animation:heroEnter .72s .42s both
}
.site-ready .hero-points,.site-ready .hero-mini-proof {
  animation:heroEnter .72s .58s both
}
@keyframes heroEnter {
  from {
    opacity:0;
    transform:translateY(23px)
  }
  to {
    opacity:1;
    transform:translateY(0)
  }
}
/* hero */
.hero {
  min-height:690px;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:radial-gradient(ellipse 850px 640px at 85% 35%,rgba(21,122,150,.2),transparent 66%),linear-gradient(125deg,#041521 0%,#062333 65%,#07283b 100%);
  padding-top:82px
}
.hero-home {
  min-height:min(850px,100svh);
  min-height:750px
}
.hero-tech-bg {
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none
}
.hero-tech-bg canvas {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:.86
}
.hero-tech-overlay {
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(3,15,24,.88)0%,rgba(3,15,24,.72)32%,rgba(3,15,24,.23)74%,rgba(3,15,24,.09)100%),linear-gradient(180deg,transparent 68%,rgba(5,22,32,.50))
}
.hero-mesh-glow {
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  filter:blur(50px)
}
.hero-mesh-glow-a {
  width:46vw;
  aspect-ratio:1;
  right:-8%;
  top:1%;
  background:radial-gradient(circle,rgba(0,209,255,.18),transparent 68%)
}
.hero-mesh-glow-b {
  width:36vw;
  aspect-ratio:1;
  right:20%;
  bottom:-42%;
  background:radial-gradient(circle,rgba(87,241,226,.17),transparent 68%)
}
.hero-light-beam {
  position:absolute;
  width:2px;
  height:110%;
  background:linear-gradient(transparent,#4aceef,transparent);
  filter:blur(3px);
  transform:rotate(57deg);
  left:75%;
  top:-5%;
  opacity:.12
}
.hero-inner {
  min-height:665px;
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:20px;
  align-items:center;
  position:relative;
  z-index:3
}
.hero-content {
  position:relative;
  z-index:3;
  padding:75px 0 90px
}
.hero h1 {
  font-size:clamp(3.7rem,6.5vw,6.8rem);
  line-height:.98;
  letter-spacing:-.065em;
  margin-bottom:28px;
  max-width:850px
}
.hero-home h1 {
  white-space:nowrap
}
.hero-copy {
  font-size:1.06rem;
  line-height:1.83;
  color:#c6d9e2;
  max-width:590px
}
.hero-actions {
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:29px
}
.hero-mini-proof,.hero-points {
  display:flex;
  gap:19px;
  flex-wrap:wrap;
  margin-top:33px
}
.hero-mini-proof span,.hero-points span {
  font-weight:620;
  color:#a7c2ce;
  font-size:.72rem
}
.hero-mini-proof i {
  display:inline-block;
  border-radius:100%;
  background:var(--turq);
  width:5px;
  height:5px;
  margin-right:7px;
  vertical-align:middle;
  box-shadow:0 0 8px var(--turq)
}
.hero-visual {
  position:relative;
  min-height:485px;
  transform:perspective(1000px) rotateY(-8deg);
  pointer-events:none
}
.hero-machine-visual::before {
  content:"";
  position:absolute;
  inset:4% -10% 4% -9%;
  background:radial-gradient(ellipse,rgba(29,193,219,.20),transparent 65%)
}
.visual-tag {
  position:absolute;
  top:30px;
  left:15px;
  border:1px solid rgba(92,226,249,.35);
  background:rgba(0,25,41,.63);
  padding:10px 15px;
  border-radius:5px;
  font-size:.57rem;
  font-weight:800;
  letter-spacing:.13em;
  color:#a3e2ef
}
.live-dot {
  display:inline-block;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#58f5dd;
  margin-right:6px;
  box-shadow:0 0 9px #58f5dd
}
.glass-panel {
  position:absolute;
  border:1px solid rgba(69,212,250,.62);
  background:linear-gradient(135deg,rgba(3,32,49,.83),rgba(11,76,98,.58));
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border-radius:14px;
  box-shadow:0 0 45px rgba(6,177,229,.10),inset 0 0 40px rgba(9,182,237,.07)
}
.main-panel {
  width:94%;
  top:25%;
  right:0;
  padding:25px;
  transform:skewY(-2deg)
}
.panel-header {
  display:flex;
  justify-content:space-between;
  gap:8px;
  align-items:center;
  color:#b3f7ff;
  font-size:.64rem;
  font-weight:750;
  letter-spacing:.14em
}
.panel-signal {
  color:#57ebda;
  font-size:.55rem
}
.visual-line {
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:10px;
  position:relative;
  margin:45px 0 29px
}
.visual-line::before {
  content:"";
  position:absolute;
  left:10px;
  right:10px;
  top:50%;
  border-top:2px dashed #3cc9ef;
  opacity:.55
}
.visual-line span {
  border:1px solid #79d0ea;
  box-shadow:0 0 13px rgba(29,194,233,.18);
  height:43px;
  display:grid;
  place-items:center;
  position:relative;
  background:#0b3850;
  color:#cafaff;
  font-weight:750
}
.visual-line span.warn {
  color:#ffd3d2;
  border-color:#ff647b;
  background:#5c2634;
  box-shadow:0 0 22px #d84c6069
}
.mini-traces {
  height:50px;
  border-bottom:1px solid #4c9cad50;
  display:flex;
  gap:8px;
  align-items:end
}
.mini-traces b {
  height:14px;
  width:20%;
  border-top:2px solid #40dbf5;
  border-radius:40% 40% 0 0
}
.mini-traces b:nth-child(2) {
  height:30px
}
.mini-traces b:nth-child(3) {
  height:22px
}
.mini-traces b:nth-child(4) {
  height:40px
}
.mini-traces b:nth-child(5) {
  height:26px
}
.panel-bottom {
  margin-top:17px;
  display:flex;
  justify-content:space-between;
  gap:8px;
  font-size:.64rem;
  color:#96c2d3
}
.panel-bottom strong {
  color:#9eeedc
}
.floating-panel {
  bottom:4%;
  right:-2%;
  padding:17px 23px;
  display:grid;
  gap:2px;
  transform:rotate(3deg)
}
.floating-panel span {
  font-size:.54rem;
  letter-spacing:.12em;
  color:#78deed
}
.floating-panel strong {
  font-size:1.25rem
}
.floating-panel small {
  color:#a4c4d2
}
.hero-baseline {
  height:1px;
  background:linear-gradient(90deg,transparent,#37dcef52,transparent)
}
/* service/home cards */
.values-strip {
  background:rgba(4,22,32,.80);
  border-block:1px solid var(--stroke)
}
.values-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  padding-block:23px
}
.feature {
  display:flex;
  gap:15px;
  padding:8px 21px;
  border-right:1px solid var(--stroke)
}
.feature:first-child {
  padding-left:0
}
.feature:last-child {
  border:0
}
.feature-icon {
  color:var(--cyan);
  min-width:46px;
  height:46px;
  border:1px solid #32bcd174;
  border-radius:12px;
  display:grid;
  place-items:center
}
.feature h3 {
  font-size:.88rem;
  letter-spacing:-.025em;
  margin:2px 0 4px
}
.feature p {
  color:var(--muted);
  font-size:.75rem;
  line-height:1.65
}
.primary-solutions {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px
}
.solution-wide {
  background:linear-gradient(145deg,rgba(18,57,75,.93),rgba(6,25,39,.94));
  border:1px solid rgba(66,202,231,.36);
  border-radius:18px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-width:0;
  box-shadow:var(--glow);
  transition:transform .3s,border-color .3s,box-shadow .3s
}
.solution-wide:hover {
  transform:translateY(-5px);
  border-color:#32e6f2;
  box-shadow:0 24px 70px rgba(0,0,0,.35)
}
.solution-top {
  display:flex;
  justify-content:space-between;
  padding:23px 24px 0;
  gap:8px
}
.solution-visual {
  position:relative;
  height:245px;
  display:grid;
  place-items:center;
  overflow:hidden
}
.web-solution-visual {
  background:radial-gradient(ellipse at 54% 86%,#1d688a77,transparent 65%)
}
.solution-body {
  padding:8px 27px 28px;
  margin-top:auto
}
.solution-body h3 {
  font-size:1.8rem;
  margin-bottom:12px
}
.solution-body>p {
  color:#b3cad6;
  font-size:.92rem;
  min-height:72px
}
.solution-body .btn {
  margin-top:20px
}
.tag-row {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:17px
}
.tag-row span {
  font-size:.62rem;
  color:#a4e7e8;
  border:1px solid #45abc04c;
  padding:5px 8px;
  border-radius:100px;
  background:#0b435355
}
.laptop-demo {
  position:relative;
  width:min(88%,460px);
  margin-inline:auto;
  padding-bottom:18px;
  transform:rotate(-4deg)
}
.laptop-screen {
  min-height:205px;
  position:relative;
  padding:10px 13px 20px;
  border:8px solid #0d1a24;
  border-radius:11px 11px 5px 5px;
  background:linear-gradient(135deg,#192a33,#294f5b 52%,#050f18);
  box-shadow:0 0 0 2px #427d9a,0 16px 40px #0008;
  overflow:hidden
}
.demo-navbar {
  display:flex;
  justify-content:space-between;
  font-size:7px;
  color:#a4becb;
  position:relative;
  z-index:2
}
.demo-wordmark {
  font-size:10px;
  font-weight:800;
  letter-spacing:.1em;
  color:#f2f7fa
}
.demo-wordmark span {
  color:var(--cyan)
}
.demo-content {
  position:relative;
  z-index:2;
  padding:28px 6px 0
}
.demo-tag {
  font-size:7px;
  letter-spacing:.13em;
  color:#89e2df;
  text-transform:uppercase
}
.demo-content h3 {
  font-size:clamp(20px,2.6vw,28px);
  line-height:1.2;
  letter-spacing:-.07em;
  max-width:280px;
  margin:11px 0 7px
}
.demo-content h3 em {
  font-style:normal;
  color:#69eff0
}
.demo-content p {
  font-size:8px;
  color:#d0dce0;
  max-width:230px
}
.demo-small-button {
  display:inline-block;
  font-size:7px;
  padding:5px 11px;
  background:var(--cyan);
  color:#061b28;
  border-radius:50px;
  margin-top:10px;
  font-weight:800
}
.demo-bloom {
  position:absolute;
  width:180px;
  height:180px;
  border-radius:50%;
  background:linear-gradient(135deg,#2a6f8f,#75d9d0);
  filter:blur(24px);
  right:-15%;
  bottom:-60%;
  opacity:.37
}
.laptop-base {
  height:12px;
  background:linear-gradient(180deg,#96b9c7,#355263);
  border-radius:2px 2px 50% 50%;
  margin:0 -9%;
  box-shadow:0 5px 18px #0009
}
.ai-solution-visual {
  background:radial-gradient(ellipse at 50% 50%,rgba(18,121,179,.2),transparent 58%),repeating-linear-gradient(0deg,transparent 0 40px,#1d7eac26 41px 42px),repeating-linear-gradient(90deg,transparent 0 40px,#1d7eac26 41px 42px)
}
.circuit-ring {
  width:190px;
  height:190px;
  border-radius:50%;
  border:1px dashed #4ae5ed96;
  display:grid;
  place-items:center;
  box-shadow:0 0 65px #22afdd26, inset 0 0 34px #1ad5f120;
  position:relative
}
.circuit-ring::before,.circuit-ring::after {
  content:"";
  position:absolute;
  inset:16px;
  border:1px solid #4ce3f888;
  border-radius:50%
}
.circuit-ring::after {
  inset:-22px;
  border-style:dotted;
  opacity:.5;
  animation:orbitTurn 35s linear infinite
}
.circuit-ring span {
  font-size:3.8rem;
  font-weight:850;
  color:#73f0f4;
  text-shadow:0 0 22px #22dfe57a
}
.small-connection {
  position:absolute;
  font-size:.58rem;
  letter-spacing:.15em;
  color:#a1e6f3;
  background:#0a2636;
  border:1px solid #5bdbf57d;
  padding:10px 12px;
  border-radius:7px
}
.small-connection.left {
  left:5%;
  top:42%
}
.small-connection.right {
  right:6%;
  bottom:29%
}
@keyframes orbitTurn {
  to {
    transform:rotate(360deg)
  }
}
.other-solutions-heading {
  margin-top:54px;
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:23px
}
.other-solutions-heading h3 {
  font-size:1.95rem;
  margin-bottom:0
}
.other-solutions-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:17px
}
.mini-service {
  border:1px solid var(--stroke);
  background:rgba(6,34,49,.82);
  padding:28px 24px;
  border-radius:16px;
  min-height:230px;
  transition:transform .25s,border-color .25s
}
.mini-service:hover {
  transform:translateY(-4px);
  border-color:#4ad8e9
}
.mini-service>.ico {
  width:33px;
  height:33px;
  color:var(--cyan);
  margin-bottom:20px
}
.mini-service h3 {
  font-size:1.17rem;
  margin-bottom:10px
}
.mini-service p {
  font-size:.81rem;
  color:#a5c0ce
}
.mini-service span {
  color:var(--cyan);
  font-size:.79rem;
  font-weight:750;
  display:block;
  margin-top:18px
}
/* Spotlight diagram */
.ai-spotlight {
  background:linear-gradient(112deg,rgba(4,20,31,.96),rgba(5,39,55,.86));
  border-block:1px solid #2d9fbb47
}
.spotlight-layout {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:30px;
  align-items:center
}
.spotlight-copy h2 {
  font-size:clamp(2.1rem,3.6vw,3.15rem)
}
.spotlight-copy>p:not(.eyebrow) {
  color:#afcbd5;
  line-height:1.9
}
.spotlight-copy .btn {
  margin-top:25px
}
.spotlight-copy .disclaimer-inline {
  font-size:.74rem;
  color:#91aeba;
  margin-top:15px
}
.line-stage {
  overflow:hidden;
  position:relative;
  border:1px solid #4eaaca50;
  border-radius:16px;
  background:radial-gradient(ellipse at center,#0e4055 0%,#072334 62%,#071a28 100%);
  box-shadow:inset 0 0 55px #052335
}
.machinery-svg {
  width:100%;
  height:auto;
  display:block;
  min-height:280px
}
.method-section {
  background:linear-gradient(120deg,rgba(3,20,30,.67),rgba(7,40,56,.66))
}
.process-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:15px;
  position:relative
}
.process-step {
  border-top:1px solid #59bfe244;
  position:relative;
  padding:23px 16px 16px;
  background:rgba(2,27,43,.36);
  border-radius:8px;
  min-height:185px
}
.process-step::after {
  content:"→";
  position:absolute;
  right:-12px;
  top:12px;
  color:#43dff1;
  font-size:23px;
  z-index:2
}
.process-step:last-child::after {
  display:none
}
.process-step>.ico {
  color:var(--cyan);
  width:38px;
  height:38px;
  margin-bottom:11px
}
.step-num {
  display:block;
  color:var(--cyan);
  font-weight:800;
  letter-spacing:.12em;
  font-size:.8rem;
  margin-bottom:9px
}
.process-step h3 {
  font-size:1rem;
  margin-bottom:6px
}
.process-step p {
  font-size:.75rem;
  color:#a9c3cf
}
/* Team */
.team-section {
  background:rgba(4,22,34,.62)
}
.team-grid {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:13px
}
.team-card {
  border-radius:13px;
  border:1px solid #4dbdd64a;
  background:rgba(12,43,59,.72);
  overflow:hidden;
  min-width:0;
  transition:transform .25s,border-color .25s
}
.team-card:hover {
  transform:translateY(-5px);
  border-color:#43e7ef
}
.team-avatar {
  height:130px;
  background:radial-gradient(circle at 50% 45%,#267899,#123e54 55%,#0a2736);
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden
}
.team-avatar::before {
  content:"";
  position:absolute;
  width:125px;
  height:125px;
  border:1px solid #60dbf047;
  transform:rotate(45deg) translateY(52px);
  border-radius:22px
}
.team-avatar::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(transparent 55%,#0a2736)
}
.team-avatar span {
  position:relative;
  z-index:1;
  font-size:2.6rem;
  font-weight:850;
  letter-spacing:-.08em;
  color:#cafcff;
  text-shadow:0 0 20px #57b9d96b
}
.team-avatar i {
  position:absolute;
  width:100px;
  height:100px;
  border-radius:50%;
  box-shadow:0 0 70px #5bf8e069
}
.team-info {
  padding:18px 15px 21px
}
.team-info h3 {
  font-size:.97rem;
  letter-spacing:-.035em;
  margin-bottom:7px
}
.team-info .role {
  font-size:.67rem;
  color:var(--cyan);
  font-weight:650;
  margin-bottom:9px
}
.team-info p:last-child {
  font-size:.72rem;
  color:#adc3cc
}
/* contact/footer */
.contact-section {
  background:linear-gradient(100deg,rgba(5,27,38,.95),rgba(5,35,49,.88));
  border-top:1px solid #4bbde04a
}
.contact-layout {
  display:grid;
  grid-template-columns:.94fr 1.06fr;
  gap:55px;
  align-items:start
}
.contact-intro h2 {
  font-size:clamp(2.2rem,4vw,3.45rem)
}
.contact-intro>.lead {
  max-width:530px
}
.contact-highlights {
  display:grid;
  gap:16px;
  margin-top:34px
}
.contact-highlights>div {
  display:flex;
  align-items:center;
  gap:14px;
  font-weight:650
}
.contact-highlights .ico {
  color:var(--cyan)
}
.contact-highlights a:hover {
  color:var(--cyan)
}
.contact-secondary {
  margin-top:54px;
  font-size:.77rem;
  color:#a3bfcb
}
.contact-secondary>a {
  color:var(--cyan);
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-weight:750
}
.contact-secondary .ico {
  width:15px;
  height:15px
}
.contact-card {
  padding:30px;
  border:1px solid #4bbddb66;
  border-radius:18px;
  background:linear-gradient(145deg,rgba(12,49,68,.78),rgba(3,26,40,.89));
  box-shadow:var(--glow)
}
.contact-form {
  display:grid;
  gap:17px
}
.contact-form .form-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px
}
.contact-form label {
  font-size:.76rem;
  display:grid;
  gap:7px;
  color:#bfd9e5;
  font-weight:600
}
.contact-form input:not([type=checkbox]),.contact-form select,.contact-form textarea {
  width:100%;
  padding:12px 13px;
  min-height:44px;
  border-radius:8px;
  border:1px solid #3b9db75e;
  background:rgba(3,27,40,.65);
  color:#f2fbff;
  outline:none;
  font-size:.81rem;
  transition:border-color .2s
}
.contact-form textarea {
  resize:vertical;
  min-height:103px
}
.contact-form input::placeholder,.contact-form textarea::placeholder {
  color:#779daf
}
.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus {
  border-color:#54e0ed;
  box-shadow:0 0 0 2px #20c6e01e
}
.contact-form .consent {
  display:flex;
  align-items:flex-start;
  gap:10px;
  color:#a8c0cb;
  font-size:.71rem;
  font-weight:450
}
.consent input {
  margin:3px 0 0;
  accent-color:var(--cyan);
  flex:0 0 auto
}
.consent a {
  text-decoration:underline;
  color:#bafaff
}
.form-status {
  color:#a1eadd;
  font-size:.8rem;
  line-height:1.65
}
.form-status.error {
  color:#ffb6ac
}
.form-status.success {
  border:1px solid #6ee7c882;
  padding:16px;
  border-radius:10px;
  background:#1b676147
}
.footer {
  background:#061723;
  border-top:1px solid var(--stroke);
  padding:33px 0 calc(33px + env(safe-area-inset-bottom,0px))
}
.footer-wrap {
  display:flex;
  justify-content:space-between;
  gap:25px;
  align-items:center;
  flex-wrap:wrap
}
.footer-brand {
  display:flex;
  align-items:center;
  gap:14px
}
.footer-brand img {
  width:130px;
  height:auto;
  display:block
}
.footer-brand>span {
  font-size:.68rem;
  color:#8eb0c0
}
.footer-links {
  display:flex;
  flex-wrap:wrap;
  gap:18px
}
.footer-links a {
  font-size:.72rem;
  color:#b2cdd9
}
.footer-links a:hover {
  color:var(--cyan)
}
.footer p {
  font-size:.7rem;
  color:#7f9ba9
}
/* Page subhero */
.subhero {
  min-height:665px
}
.subhero-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:45px;
  min-height:580px;
  position:relative;
  z-index:3
}
.subhero .hero-content {
  padding:90px 0 74px
}
.subhero h1 {
  white-space:normal;
  font-size:clamp(3.55rem,6.0vw,5.8rem)
}
.subhero h1 span {
  display:block
}
.subhero .hero-points span {
  background:#0c415377;
  border:1px solid #3ba3b555;
  border-radius:100px;
  padding:7px 11px
}
.large-demo {
  position:relative;
  margin-top:70px;
  transform:rotate(-1deg)
}
.large-demo .laptop-demo {
  width:100%
}
.large-demo .laptop-screen {
  min-height:285px;
  border-width:10px
}
.large-demo .demo-content {
  padding-top:52px
}
.large-demo .demo-content h3 {
  font-size:clamp(25px,3vw,40px);
  max-width:330px
}
.large-demo .demo-content p {
  font-size:10px
}
.large-demo .demo-navbar {
  font-size:8px
}
.large-demo .demo-wordmark {
  font-size:13px
}
.phone-demo {
  position:absolute;
  right:-4%;
  bottom:0;
  width:120px;
  height:248px;
  border:6px solid #071620;
  border-radius:24px;
  background:linear-gradient(145deg,#163747,#365663 74%,#051924);
  z-index:3;
  padding:20px 9px;
  box-shadow:0 0 0 1px #2c8fae,0 20px 40px #000b
}
.phone-top {
  width:35px;
  height:4px;
  border-radius:50px;
  background:#061b27;
  position:absolute;
  top:8px;
  left:calc(50% - 17px)
}
.phone-demo h4 {
  font-size:12px;
  letter-spacing:.1em
}
.phone-demo p {
  font-size:12px;
  font-weight:700;
  line-height:1.4
}
.phone-image {
  background:linear-gradient(135deg,#66a6a49c,#19394e);
  height:74px;
  border-radius:5px;
  margin-top:10px
}
.phone-demo>span {
  display:block;
  font-size:8px;
  margin-top:12px;
  color:var(--cyan)
}
/* Siti web detail */
.sector-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:15px
}
.sector-card {
  min-height:260px;
  border:1px solid var(--stroke);
  border-radius:16px;
  padding:24px;
  background:linear-gradient(160deg,#0e3c53db,#072534e8);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  transition:transform .22s,border-color .22s
}
.sector-card:hover {
  transform:translateY(-5px);
  border-color:var(--cyan)
}
.sector-index {
  color:#80bacc;
  font-size:.67rem;
  letter-spacing:.17em
}
.sector-symbol {
  width:62px;
  height:62px;
  margin:17px 0;
  border:1px solid #46d4e474;
  border-radius:14px;
  display:grid;
  place-items:center;
  color:#4ce7f0;
  background:#2bafc315
}
.sector-symbol .ico {
  width:32px;
  height:32px
}
.sector-card h3 {
  font-size:1.13rem;
  margin-bottom:9px
}
.sector-card p {
  font-size:.79rem;
  color:#b4cbd5
}
.sector-card>a {
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:var(--cyan);
  font-weight:750;
  margin-top:auto;
  font-size:.72rem;
  padding-top:16px
}
.sector-card>a .ico {
  width:15px
}
.surface-section {
  background:rgba(4,25,35,.82)
}
.features-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:15px
}
.feature-box {
  padding:23px;
  border:1px solid #3991aa50;
  border-radius:14px;
  background:#08283baa;
  display:flex;
  align-items:flex-start;
  gap:17px;
  min-height:120px
}
.feature-box>.ico {
  color:var(--cyan);
  width:29px;
  height:29px
}
.feature-box h3 {
  font-size:.99rem;
  margin-bottom:7px
}
.feature-box p {
  font-size:.77rem;
  color:#a2becb
}
.pricing-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px
}
.pricing-card {
  padding:28px 25px;
  border-radius:17px;
  background:linear-gradient(150deg,#0c3247ef,#082332ec);
  border:1px solid #368aaa77;
  display:flex;
  flex-direction:column;
  position:relative;
  min-width:0
}
.pricing-card.recommended {
  border-color:#1fe2ed;
  box-shadow:0 0 38px #10cbe81a;
  background:linear-gradient(150deg,#125073,#092d42)
}
.pricing-tag {
  align-self:start;
  color:#68f1ee;
  font-size:.66rem;
  text-transform:uppercase;
  font-weight:800;
  letter-spacing:.13em;
  margin-bottom:19px
}
.pricing-card h3 {
  font-size:1.45rem;
  margin-bottom:8px
}
.pricing-card>p {
  color:#aec9d4;
  font-size:.8rem;
  min-height:42px
}
.pricing-card .price {
  font-size:clamp(1.5rem,2.3vw,2.25rem);
  font-weight:850;
  color:var(--cyan);
  line-height:1.15;
  margin:19px 0 5px;
  letter-spacing:-.06em
}
.pricing-card .price-note {
  font-size:.66rem;
  color:#96b1bf;
  min-height:auto
}
.pricing-card ul,.part-card ul,.catalog-card ul {
  padding:0;
  margin:27px 0;
  list-style:none;
  display:grid;
  gap:11px
}
.pricing-card li,.part-card li,.catalog-card li {
  font-size:.81rem;
  display:flex;
  align-items:flex-start;
  gap:9px;
  color:#d3e4eb
}
.pricing-card li .ico,.part-card li .ico,.catalog-card li .ico {
  width:15px;
  height:15px;
  color:var(--cyan);
  margin-top:4px
}
.pricing-card .btn {
  margin-top:auto
}
.pricing-notes {
  font-size:.75rem;
  line-height:1.7;
  color:#a3bac5;
  margin-top:19px
}
.portfolio-section {
  background:linear-gradient(145deg,rgba(4,22,32,.9),rgba(8,48,65,.88))
}
.concept-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px
}
.concept-card {
  border:1px solid var(--stroke);
  border-radius:13px;
  padding:16px;
  background:#08283aeb;
  transition:transform .25s
}
.concept-card:hover {
  transform:translateY(-4px)
}
.concept-browser {
  height:205px;
  border:6px solid #111e2a;
  border-radius:9px;
  background:radial-gradient(circle at 80% 70%,#9c673f99,transparent 50%),linear-gradient(130deg,#32261d,#785842);
  box-shadow:0 15px 35px #0005;
  overflow:hidden
}
.concept-browser-top {
  height:17px;
  background:#121c24;
  display:flex;
  gap:4px;
  align-items:center;
  padding:0 9px
}
.concept-browser-top b {
  width:4px;
  height:4px;
  border-radius:50%;
  background:#a3bbc6
}
.concept-browser-inner {
  padding:24px;
  display:grid;
  gap:16px;
  max-width:230px;
  color:#fff
}
.concept-browser-inner span {
  font-weight:800;
  letter-spacing:.2em;
  font-size:.7rem
}
.concept-browser-inner strong {
  font-size:1.5rem;
  letter-spacing:-.055em;
  line-height:1.12
}
.concept-browser-inner small {
  display:inline-block;
  font-size:.64rem;
  border:1px solid #ffffff8c;
  padding:7px 12px;
  border-radius:50px;
  width:max-content
}
.concept-studio .concept-browser {
  background:radial-gradient(circle at 90% 70%,#9ea9a79c,transparent 50%),linear-gradient(130deg,#1e2930,#567b84)
}
.concept-beauty .concept-browser {
  background:radial-gradient(circle at 90% 70%,#f9a18c7e,transparent 50%),linear-gradient(130deg,#a67377,#f1d8c8)
}
.concept-beauty .concept-browser-inner {
  color:#231d26
}
.concept-beauty .concept-browser-inner small {
  border-color:#3a283a
}
.concept-foot {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:17px
}
.concept-foot span {
  color:#83cfdc;
  text-transform:uppercase;
  font-size:.60rem;
  letter-spacing:.1em
}
.concept-foot h3 {
  font-size:.96rem;
  margin:4px 0 0
}
.concept-foot em {
  font-size:.6rem;
  color:#acc8d3;
  font-style:normal;
  border:1px solid #468ba26b;
  padding:3px 7px;
  border-radius:50px
}
.faq-layout {
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:75px;
  align-items:start
}
.faq-list {
  display:grid;
  gap:11px
}
.faq-item {
  border:1px solid #4089a27e;
  border-radius:12px;
  background:#0827398a;
  padding:0 17px
}
.faq-item summary {
  list-style:none;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  min-height:57px;
  font-size:.86rem;
  font-weight:650
}
.faq-item summary::-webkit-details-marker {
  display:none
}
.faq-item summary .ico {
  color:var(--cyan);
  width:20px;
  transition:transform .2s
}
.faq-item[open] summary .ico {
  transform:rotate(45deg)
}
.faq-item p {
  padding:0 20px 18px 0;
  color:#b3c8d3;
  font-size:.82rem
}
/* AI */
.ai-hero-stage {
  position:relative;
  border:1px solid #2a9ab7a3;
  border-radius:17px;
  background:linear-gradient(145deg,rgba(7,44,61,.85),rgba(6,22,34,.93));
  padding:25px;
  box-shadow:0 0 60px #148fb235,0 22px 80px #0008;
  transform:perspective(950px) rotateY(-6deg)
}
.ai-hero-stage::before {
  content:"";
  position:absolute;
  inset:-12px;
  border:1px dashed #52c9dd22;
  border-radius:23px;
  pointer-events:none
}
.data-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  color:#b4f0fd;
  font-size:.66rem;
  font-weight:800;
  letter-spacing:.09em
}
.status-indicator {
  font-size:.55rem;
  color:#82dcc7
}
.diagram-rail {
  margin:60px 0 42px;
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:10px;
  position:relative
}
.diagram-rail::before {
  content:"";
  position:absolute;
  top:50%;
  left:0;
  right:0;
  border-top:2px dashed #46e5ef77
}
.diagram-rail span {
  min-height:45px;
  background:#10495e;
  border:1px solid #5fdced;
  display:grid;
  place-items:center;
  font-weight:800;
  color:#b9feff;
  position:relative
}
.diagram-rail span.alarm {
  border-color:#fa8b91;
  background:#5b2434;
  color:#ffe2e2;
  box-shadow:0 0 25px #ff435553
}
.ai-hud-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:9px
}
.ai-hud-grid>div {
  background:#052333;
  border:1px solid #4197af77;
  border-radius:7px;
  padding:12px
}
.ai-hud-grid small {
  font-size:.56rem;
  color:#7cb7c7;
  display:block;
  margin-bottom:6px
}
.ai-hud-grid strong {
  font-size:.7rem;
  display:block;
  line-height:1.4
}
.hud-note {
  color:#8eb2c4;
  font-size:.61rem;
  margin-top:24px
}
.problem-layout {
  display:grid;
  grid-template-columns:.65fr 1.35fr;
  gap:30px;
  align-items:center
}
.problem-copy h3 {
  font-size:1.65rem;
  line-height:1.2
}
.problem-copy p {
  color:#a9c4cf;
  font-size:.87rem;
  line-height:1.8
}
.info-strip {
  display:flex;
  gap:12px;
  align-items:flex-start;
  background:#3f202b7f;
  border:1px solid #d464787a;
  color:#ead8d8;
  font-size:.75rem;
  padding:15px;
  border-radius:11px;
  margin-top:24px
}
.info-strip .ico {
  color:#f6a4a7
}
.ai-problem {
  background:#061c2ae8
}
.ai-steps-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:19px
}
.ai-step {
  border:1px solid #36bfde7f;
  background:linear-gradient(145deg,#0e3e54eb,#072636ea);
  border-radius:17px;
  padding:30px;
  min-height:265px
}
.ai-step-meta {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:52px
}
.ai-step-meta span {
  font-size:1.6rem;
  color:var(--cyan);
  font-weight:800
}
.ai-step-meta .ico {
  width:46px;
  height:46px;
  color:var(--cyan)
}
.ai-step h3 {
  font-size:1.46rem;
  margin-bottom:12px
}
.ai-step p {
  font-size:.82rem;
  color:#b8d0db;
  line-height:1.75
}
.ai-ethics {
  color:#a6c3ce;
  border-left:2px solid var(--cyan);
  padding-left:15px;
  font-size:.76rem;
  margin-top:25px
}
.partnership-section {
  background:linear-gradient(150deg,rgba(5,19,29,.85),rgba(6,40,55,.92))
}
.partnership-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px
}
.part-card {
  border-radius:17px;
  border:1px solid #37bfd6a1;
  padding:32px;
  background:linear-gradient(160deg,#0b384bc9,#071e2ce9)
}
.part-card h3 {
  font-size:1.5rem;
  max-width:430px
}
.part-card ul {
  margin-bottom:0
}
.part-cta {
  margin-top:22px;
  border-radius:12px;
  border:1px solid #4fbbcf60;
  padding:24px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px;
  background:#13516a62
}
.part-cta strong {
  font-size:1.02rem
}
.part-cta p {
  font-size:.77rem;
  color:#a8c5d2;
  margin-top:5px
}
.roadmap-section {
  background:#051f2cec
}
.roadmap-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:13px
}
.roadmap-card {
  border-top:2px solid var(--cyan);
  padding:25px 17px 15px;
  background:#0a344b95;
  min-height:215px
}
.roadmap-n {
  font-size:2rem;
  color:#45e5f1;
  font-weight:800;
  display:block;
  line-height:1
}
.roadmap-label {
  color:#a1e6ef;
  letter-spacing:.1em;
  font-size:.62rem;
  text-transform:uppercase;
  font-weight:850;
  display:block;
  margin-top:8px
}
.roadmap-card h3 {
  font-size:1.1rem;
  margin:28px 0 9px
}
.roadmap-card p {
  font-size:.77rem;
  color:#b2c6d1
}
.industries-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:17px
}
.industry-card {
  min-height:240px;
  padding:26px;
  border-radius:15px;
  border:1px solid #459fb476;
  display:flex;
  flex-direction:column;
  justify-content:end;
  background:linear-gradient(0deg,#082536 8%,#082536a1 50%,transparent),repeating-linear-gradient(45deg,#184e5f 0 22px,#206177 22px 24px,#123d55 24px 46px)
}
.industry-packaging {
  background:linear-gradient(0deg,#082536,#082536a1 58%,transparent),repeating-linear-gradient(90deg,#1c5667 0 20px,#2b7687 22px 25px,#184259 26px 48px)
}
.industry-manufacturing {
  background:linear-gradient(0deg,#082536,#082536a1 58%,transparent),repeating-linear-gradient(125deg,#1a536f 0 20px,#287e91 22px 25px,#103b56 26px 48px)
}
.industry-card span {
  color:var(--cyan);
  font-size:.59rem;
  letter-spacing:.12em;
  font-weight:750
}
.industry-card h3 {
  margin:7px 0;
  font-size:1.4rem
}
.industry-card p {
  font-size:.78rem;
  color:#bdcfda
}
/* Other solutions page */
.dashboard-demo {
  position:relative;
  border:1px solid #45daedb7;
  border-radius:16px;
  background:#081d2afa;
  box-shadow:0 0 60px #0ca4cb30,0 25px 70px #0008;
  transform:perspective(900px) rotateY(-7deg);
  overflow:hidden
}
.dash-header {
  display:flex;
  justify-content:space-between;
  padding:18px 20px;
  border-bottom:1px solid #4eabbe68;
  font-size:.64rem;
  color:#9beaf0;
  letter-spacing:.12em
}
.dash-header span {
  color:#a9b4bb
}
.dash-layout {
  display:grid;
  grid-template-columns:122px 1fr;
  min-height:290px
}
.dash-layout aside {
  display:flex;
  flex-direction:column;
  gap:12px;
  border-right:1px solid #5ba1b76b;
  padding:23px 11px;
  font-size:.66rem;
  color:#85b0bf
}
.dash-layout aside span {
  padding:7px
}
.dash-layout aside .selected {
  background:#10536a99;
  color:#8bebee;
  border-radius:5px
}
.dash-main {
  padding:21px 20px
}
.dash-number {
  display:flex;
  justify-content:space-between;
  align-items:center
}
.dash-number small {
  color:#7ab2c4;
  display:block;
  font-size:.56rem
}
.dash-number strong {
  font-size:1.3rem
}
.dash-tag {
  color:#8ce7f1;
  font-size:.54rem
}
.dash-metrics {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin-top:23px
}
.dash-metrics>div {
  background:#103b50;
  border:1px solid #34859f7c;
  padding:10px;
  border-radius:5px
}
.dash-metrics span {
  color:var(--cyan);
  font-size:.75rem
}
.dash-metrics strong {
  display:block;
  font-size:.83rem
}
.dash-metrics small {
  color:#8bafbd;
  font-size:.5rem
}
.dash-chart {
  margin-top:14px;
  height:85px;
  border:1px solid #296b85a8;
  border-radius:7px;
  position:relative;
  overflow:hidden;
  background:repeating-linear-gradient(0deg,transparent 0 21px,#27638332 22px 23px)
}
.bar-chart {
  position:absolute;
  bottom:0;
  left:10%;
  right:10%;
  height:85%;
  display:flex;
  gap:5%;
  align-items:end
}
.bar-chart i {
  width:7%;
  background:linear-gradient(#4adfed,#196382);
  border-radius:3px 3px 0 0
}
.bar-chart i:nth-child(1) {
  height:30%
}
.bar-chart i:nth-child(2) {
  height:52%
}
.bar-chart i:nth-child(3) {
  height:44%
}
.bar-chart i:nth-child(4) {
  height:65%
}
.bar-chart i:nth-child(5) {
  height:42%
}
.bar-chart i:nth-child(6) {
  height:74%
}
.bar-chart i:nth-child(7) {
  height:62%
}
.bar-chart i:nth-child(8) {
  height:85%
}
.bar-chart i:nth-child(9) {
  height:76%
}
.demo-caption {
  display:block;
  text-align:center;
  background:#061d2b;
  font-size:.59rem;
  color:#7db1c2;
  padding:9px
}
.catalog-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px
}
.catalog-card {
  scroll-margin-top:120px;
  background:linear-gradient(160deg,#0c3a4f,#081e2c);
  border:1px solid #379cbb7e;
  border-radius:16px;
  padding:31px;
  display:grid;
  grid-template-columns:52px 1fr;
  gap:10px 19px;
  align-items:start
}
.catalog-icon {
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  border:1px solid var(--cyan);
  border-radius:12px;
  color:var(--cyan)
}
.catalog-icon .ico {
  width:29px;
  height:29px
}
.catalog-card h3 {
  font-size:1.5rem;
  margin-bottom:9px
}
.catalog-card p {
  font-size:.81rem;
  color:#b9cdd7
}
.catalog-card ul {
  margin:17px 0 6px;
  gap:7px
}
.catalog-card li {
  font-size:.75rem
}
.catalog-link {
  grid-column:2;
  color:var(--cyan);
  font-size:.76rem;
  font-weight:800;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:10px
}
.catalog-link .ico {
  width:16px
}
.usecases-section {
  background:#051e2ce9
}
.usecases-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px
}
.usecase {
  padding:24px;
  border:1px solid #2c97b277;
  border-radius:14px;
  background:#0b3045b0
}
.usecase>.ico {
  color:var(--cyan);
  width:29px;
  height:29px
}
.usecase-question {
  font-size:1.06rem;
  font-weight:750;
  line-height:1.45;
  margin:22px 0 16px;
  min-height:77px
}
.usecase-answer {
  border-top:1px solid #34799184;
  display:flex;
  gap:9px;
  padding-top:16px;
  color:#8be5ee
}
.usecase-answer strong {
  font-size:.8rem;
  line-height:1.55
}
.usecase-answer .ico {
  width:18px;
  margin-top:3px
}
/* Legal */
.legal-page {
  padding-top:170px;
  min-height:75vh
}
.legal-content {
  max-width:900px
}
.legal-content h1 {
  font-size:clamp(2rem,5vw,3.4rem)
}
.legal-content h2 {
  font-size:1.35rem;
  margin:34px 0 10px
}
.legal-content p {
  color:#b8ccd6
}
.legal-content a:not(.btn) {
  color:var(--cyan);
  text-decoration:underline
}
.legal-warning {
  border:1px solid #f8c074aa;
  background:#73581a2b;
  padding:18px;
  border-radius:10px
}
/* Reveal only hides content when JS observer available; no repaint flash */
.js .reveal {
  opacity:0;
  transform:translateY(21px);
  transition:opacity .7s ease,transform .7s ease
}
.js .reveal.visible {
  opacity:1;
  transform:translateY(0)
}
@media(max-width:1140px) {
  .nav {
    gap:16px
  }
  .nav>a {
    font-size:.75rem
  }
  .nav .nav-cta {
    padding:9px 11px;
    margin-left:0
  }
  .brand img {
    width:155px
  }
  .hero h1 {
    font-size:clamp(3.5rem,6.1vw,6.25rem)
  }
  .container {
    width:min(var(--max),calc(100% - 48px))
  }
  .hero-home h1 {
    white-space:normal
  }
  .team-grid {
    grid-template-columns:repeat(3,1fr)
  }
  .feature {
    padding-inline:12px
  }
  .section-heading {
    gap:27px
  }
}
@media(max-width:900px) {
  .menu-toggle {
    display:grid;
    place-items:center
  }
  .nav {
    position:absolute;
    left:24px;
    right:24px;
    top:75px;
    padding:20px;
    border-radius:14px;
    background:#061e2deb;
    border:1px solid #479bb679;
    box-shadow:0 25px 50px #0007;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    max-height:calc(100svh - 90px);
    overflow-y:auto
  }
  .nav.open {
    display:flex
  }
  .nav>a {
    font-size:.94rem;
    padding:13px 7px
  }
  .nav>a::after {
    display:none
  }
  .nav .nav-cta {
    justify-content:center;
    margin-top:9px
  }
  .hero-inner,.subhero-grid {
    grid-template-columns:1fr
  }
  .hero-home {
    min-height:auto
  }
  .hero-inner {
    gap:0
  }
  .hero-content {
    padding-top:82px;
    padding-bottom:38px
  }
  .hero-visual {
    min-height:330px;
    margin-bottom:45px;
    max-width:650px;
    width:100%;
    justify-self:center
  }
  .main-panel {
    top:14%;
    right:5%
  }
  .floating-panel {
    bottom:0;
    right:8%
  }
  .subhero-grid {
    min-height:auto
  }
  .subhero .hero-content {
    padding:75px 0 15px
  }
  .subhero .large-demo,.subhero .ai-hero-stage,.subhero .dashboard-demo {
    width:min(600px,100%);
    justify-self:center;
    margin:0 0 65px
  }
  .contact-layout {
    grid-template-columns:1fr;
    gap:30px
  }
  .contact-secondary {
    margin-top:24px
  }
  .values-grid {
    grid-template-columns:1fr 1fr 1fr
  }
  .values-grid .feature {
    display:block
  }
  .values-grid .feature-icon {
    margin-bottom:10px
  }
  .spotlight-layout {
    grid-template-columns:1fr
  }
  .spotlight-layout .line-stage {
    max-width:700px
  }
  .faq-layout {
    gap:30px
  }
  .problem-layout {
    grid-template-columns:1fr
  }
  .problem-layout .line-stage {
    max-width:850px
  }
  .team-grid {
    grid-template-columns:repeat(3,1fr)
  }
  .footer-wrap {
    gap:20px
  }
}
@media(max-width:680px) {
  html {
    scroll-padding-top:75px
  }
  .container {
    width:calc(100% - 32px)
  }
  .section {
    padding:76px 0
  }
  .section-heading {
    display:block;
    margin-bottom:28px
  }
  .section-heading h2 {
    font-size:clamp(1.95rem,9vw,2.65rem)
  }
  .section-heading .lead {
    max-width:100%;
    margin-top:15px
  }
  .nav-wrap {
    height:72px
  }
  .nav {
    top:69px;
    left:16px;
    right:16px
  }
  .brand img {
    width:146px
  }
  .hero {
    padding-top:72px;
    min-height:unset
  }
  .hero-content {
    padding-top:70px;
    padding-bottom:32px
  }
  .hero h1 {
    font-size:clamp(2.9rem,10.3vw,4.4rem);
    line-height:1.03;
    white-space:normal
  }
  .hero-home h1 {
    font-size:clamp(2.86rem,10.1vw,4.35rem)
  }
  .hero-copy {
    font-size:.93rem
  }
  .hero-actions {
    gap:9px
  }
  .hero-actions .btn {
    padding:11px 16px;
    min-height:47px;
    font-size:.77rem
  }
  .hero-mini-proof {
    gap:9px 15px;
    margin-top:22px
  }
  .hero-mini-proof span {
    font-size:.65rem
  }
  .hero-visual {
    min-height:280px;
    transform:none
  }
  .visual-tag {
    top:0;
    left:4px;
    font-size:.46rem
  }
  .main-panel {
    top:16%;
    right:0;
    width:100%;
    padding:15px;
    transform:rotate(-1deg)
  }
  .panel-header {
    font-size:.5rem
  }
  .panel-signal {
    font-size:.43rem
  }
  .visual-line {
    gap:5px;
    margin:30px 0 19px
  }
  .visual-line span {
    height:35px;
    font-size:.8rem
  }
  .floating-panel {
    padding:11px;
    bottom:8px;
    right:-2%
  }
  .floating-panel strong {
    font-size:.98rem
  }
  .floating-panel span {
    font-size:.4rem
  }
  .mini-traces {
    height:35px
  }
  .values-grid {
    grid-template-columns:1fr;
    gap:0;
    padding-block:8px
  }
  .values-grid .feature {
    display:flex;
    align-items:center;
    border-right:0;
    border-bottom:1px solid var(--stroke);
    padding:12px 0
  }
  .values-grid .feature:last-child {
    border-bottom:0
  }
  .values-grid .feature-icon {
    margin:0;
    min-width:42px;
    height:42px
  }
  .feature p {
    font-size:.7rem
  }
  .primary-solutions,.partnership-grid,.catalog-grid {
    grid-template-columns:1fr
  }
  .solution-visual {
    height:230px
  }
  .solution-body>p {
    min-height:0
  }
  .other-solutions-heading {
    display:block
  }
  .other-solutions-grid {
    grid-template-columns:1fr
  }
  .mini-service {
    min-height:0
  }
  .process-grid {
    grid-template-columns:repeat(2,1fr);
    gap:12px
  }
  .process-step::after {
    display:none
  }
  .team-grid {
    grid-template-columns:repeat(2,1fr);
    gap:10px
  }
  .team-avatar {
    height:115px
  }
  .team-info {
    padding:13px
  }
  .team-info h3 {
    font-size:.86rem
  }
  .team-info .role {
    font-size:.62rem
  }
  .team-info p:last-child {
    font-size:.69rem
  }
  .contact-card {
    padding:19px
  }
  .contact-form .form-grid {
    grid-template-columns:1fr
  }
  .contact-layout {
    gap:28px
  }
  .footer-wrap {
    display:grid;
    gap:17px
  }
  .footer-brand {
    display:block
  }
  .footer-brand>span {
    display:block
  }
  .footer-links {
    gap:12px
  }
  .subhero h1 {
    font-size:clamp(3.0rem,11.5vw,4.25rem)
  }
  .subhero .hero-content {
    padding:70px 0 33px
  }
  .subhero .hero-points {
    gap:8px;
    margin-top:20px
  }
  .subhero .hero-points span {
    font-size:.64rem
  }
  .subhero .large-demo {
    width:90%;
    margin-bottom:55px
  }
  .large-demo .laptop-screen {
    min-height:230px
  }
  .large-demo .demo-content {
    padding-top:22px
  }
  .phone-demo {
    width:92px;
    height:190px;
    border-width:4px;
    padding:18px 7px;
    right:-9%;
    bottom:0
  }
  .phone-demo p {
    font-size:10px
  }
  .phone-image {
    height:45px
  }
  .sector-grid,.features-grid,.pricing-grid,.concept-grid,.industries-grid,.usecases-grid,.ai-steps-grid {
    grid-template-columns:1fr
  }
  .sector-card {
    min-height:190px
  }
  .sector-symbol {
    margin:8px 0 13px
  }
  .feature-box {
    min-height:0
  }
  .pricing-card {
    padding:24px
  }
  .concept-browser {
    height:240px
  }
  .faq-layout {
    grid-template-columns:1fr;
    gap:24px
  }
  .ai-hero-stage {
    padding:16px;
    transform:none
  }
  .ai-hud-grid {
    gap:5px
  }
  .ai-hud-grid>div {
    padding:7px
  }
  .ai-hud-grid strong {
    font-size:.58rem
  }
  .data-head {
    font-size:.53rem
  }
  .diagram-rail {
    gap:4px;
    margin:37px 0 28px
  }
  .diagram-rail span {
    min-height:33px
  }
  .ai-step {
    min-height:0
  }
  .ai-step-meta {
    margin-bottom:28px
  }
  .part-card {
    padding:24px
  }
  .part-cta {
    display:block
  }
  .part-cta .btn {
    margin-top:17px
  }
  .roadmap-grid {
    grid-template-columns:repeat(2,1fr)
  }
  .roadmap-card {
    min-height:210px
  }
  .catalog-card {
    padding:20px;
    grid-template-columns:41px 1fr;
    gap:9px
  }
  .catalog-icon {
    width:41px;
    height:41px
  }
  .catalog-card h3 {
    font-size:1.17rem
  }
  .dash-layout {
    grid-template-columns:80px 1fr
  }
  .dash-layout aside {
    font-size:.52rem;
    padding:13px 5px
  }
  .dash-main {
    padding:12px
  }
  .dash-metrics {
    gap:4px
  }
  .dash-metrics>div {
    padding:6px
  }
  .dash-metrics strong {
    font-size:.64rem
  }
  .dash-header {
    font-size:.52rem;
    padding:10px
  }
  .dash-number strong {
    font-size:1.05rem
  }
  .problem-copy h3 {
    font-size:1.43rem
  }
  .machinery-svg {
    min-height:180px
  }
  .legal-page {
    padding-top:130px
  }
}
@media(max-width:380px) {
  .hero h1 {
    font-size:2.65rem
  }
  .hero-actions .btn {
    width:100%
  }
  .team-grid {
    grid-template-columns:1fr
  }
  .process-grid {
    grid-template-columns:1fr
  }
  .roadmap-grid {
    grid-template-columns:1fr
  }
  .hero-visual {
    min-height:270px
  }
  .hero-mini-proof {
    display:grid
  }
  .concept-browser {
    height:200px
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    animation-duration:.01ms!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important
  }
  .js .reveal {
    opacity:1!important;
    transform:none!important
  }
  .js:not(.site-ready) .hero .hero-content .eyebrow,.js:not(.site-ready) .hero h1,.js:not(.site-ready) .hero .hero-copy,.js:not(.site-ready) .hero .hero-actions,.js:not(.site-ready) .hero .hero-points,.js:not(.site-ready) .hero .hero-mini-proof {
    opacity:1!important;
    transform:none!important
  }
}
/* Linea di avanzamento metodo: conserva l'effetto dell'originale TRIMAP. */
.process-grid::before,
.process-grid::after {
  content: "";
  position: absolute;
  top: -15px;
  left: 0;
  height: 2px;
  border-radius: 999px;
  pointer-events: none;
}
.process-grid::before {
  width: 100%;
  background: rgba(150, 220, 232, .16);
}
.process-grid::after {
  width: calc(var(--process-progress, 0) * 100%);
  background: linear-gradient(90deg, var(--turq), var(--cyan), var(--blue));
  box-shadow: 0 0 13px rgba(41, 225, 240, .55);
}
@media (max-width: 680px) {
  .process-grid::before,
  .process-grid::after {
    top: -10px;
  }
}

/* ==========================================================
   TRIMAP / HOME MINIMAL — ottobre 2026
   Layout Apple-inspired, limitato alla sola index.
   Le pagine di approfondimento mantengono i propri stili.
   ========================================================== */
body[data-page="home"] .site-header {
  background: rgba(4, 16, 25, .68);
  border-bottom: 1px solid rgba(255, 255, 255, .07);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}
body[data-page="home"] .nav>a.active {
  color: #f1f7fa;
}
body[data-page="home"] .nav>a:not(.nav-cta)::after {
  background: rgba(179, 238, 240, .75);
  height: 1px;
}
body[data-page="home"] .nav .nav-cta {
  border-color: rgba(193, 239, 242, .37);
  color: #e2f6f7;
}

/* Prima schermata: solo titolo e sottotitolo, centro perfetto. */
body[data-page="home"] .hero-home {
  min-height: 100vh;
  min-height: 100svh;
  min-height: 100dvh;
  padding-top: 82px;
  background:
    radial-gradient(ellipse 72% 76% at 50% 49%, rgba(17, 69, 88, .43) 0%, rgba(5, 25, 37, .26) 46%, transparent 80%),
    linear-gradient(155deg, #04121c 0%, #071c29 53%, #071724 100%);
}
body[data-page="home"] .hero-home .hero-inner {
  min-height: calc(100vh - 82px);
  min-height: calc(100svh - 82px);
  min-height: calc(100dvh - 82px);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  place-items: center;
  gap: 0;
}
body[data-page="home"] .hero-home .hero-content {
  width: 100%;
  max-width: 1120px;
  margin-inline: auto;
  padding: 0 0 2vh;
  text-align: center;
}
body[data-page="home"] .hero-home h1 {
  font-size: clamp(3.3rem, 8.1vw, 8.25rem);
  line-height: 1.005;
  letter-spacing: -.072em;
  font-weight: 800;
  max-width: none;
  margin: 0 auto 29px;
  white-space: normal;
  text-wrap: balance;
}
body[data-page="home"] .hero-home h1 span {
  color: #86dbe8;
  background: linear-gradient(110deg, #a6f1ec 0%, #86cde7 48%, #9dbbf2 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
body[data-page="home"] .hero-home .hero-copy {
  max-width: 720px;
  margin: 0 auto;
  color: #b5c9d3;
  font-size: clamp(.95rem, 1.55vw, 1.15rem);
  line-height: 1.65;
  letter-spacing: -.015em;
  text-wrap: balance;
}
body[data-page="home"] .hero-home .hero-tech-bg canvas {
  opacity: .35;
}
body[data-page="home"] .hero-home .hero-tech-overlay {
  background:
    radial-gradient(ellipse 64% 63% at 50% 49%, rgba(4, 16, 26, .22), rgba(4, 13, 22, .58) 82%),
    linear-gradient(180deg, rgba(3, 15, 24, .21), transparent 30%, rgba(4, 16, 25, .56) 100%);
}
body[data-page="home"] .hero-home .hero-mesh-glow-a {
  right: 13%;
  top: 1%;
  background: radial-gradient(circle, rgba(55, 158, 173, .11), transparent 70%);
}
body[data-page="home"] .hero-home .hero-mesh-glow-b {
  right: 44%;
  bottom: -46%;
  background: radial-gradient(circle, rgba(62, 127, 181, .12), transparent 70%);
}
body[data-page="home"] .hero-home .hero-light-beam {
  opacity: .045;
}
body[data-page="home"] .hero-home .hero-baseline {
  position: absolute;
  bottom: 0;
  width: 100%;
  background: linear-gradient(90deg, transparent, rgba(178, 228, 238, .22), transparent);
}

/* Sezioni pulite: tipografia, spazio e linee sottili. */
body[data-page="home"] main > .section {
  padding-block: clamp(82px, 8vw, 122px);
  background: rgba(4, 17, 27, .27);
}
body[data-page="home"] main > .section:nth-of-type(odd) {
  background: rgba(3, 14, 23, .44);
}
body[data-page="home"] .section-heading {
  margin-bottom: 40px;
}
body[data-page="home"] .section-heading h2 {
  font-size: clamp(2.2rem, 4.5vw, 3.75rem);
  font-weight: 770;
  letter-spacing: -.065em;
  text-wrap: balance;
}
body[data-page="home"] .eyebrow {
  color: #86d7dc;
  font-weight: 650;
  font-size: .67rem;
  letter-spacing: .16em;
  margin-bottom: 17px;
}

/* Due offerte protagoniste, senza badge e cornici appariscenti. */
body[data-page="home"] .primary-solutions {
  gap: 23px;
}
body[data-page="home"] .solution-wide {
  border: 1px solid rgba(213, 241, 245, .11);
  background: linear-gradient(155deg, rgba(19, 46, 60, .66), rgba(6, 24, 36, .80));
  border-radius: 25px;
  box-shadow: none;
}
body[data-page="home"] .solution-wide:hover {
  transform: translateY(-4px);
  border-color: rgba(160, 228, 236, .30);
  box-shadow: 0 22px 55px rgba(0, 0, 0, .16);
}
body[data-page="home"] .solution-top {
  padding: 33px 35px 0;
}
body[data-page="home"] .solution-top .pill {
  color: #9cbbc7;
  font-size: .64rem;
  font-weight: 650;
  letter-spacing: .105em;
}
body[data-page="home"] .solution-visual {
  height: 195px;
}
body[data-page="home"] .web-solution-visual {
  background: radial-gradient(ellipse at 50% 90%, rgba(75, 153, 183, .18), transparent 65%);
}
body[data-page="home"] .laptop-demo {
  width: min(70%, 365px);
  transform: rotate(-2deg);
}
body[data-page="home"] .ai-solution-visual {
  background: radial-gradient(ellipse at 50% 50%, rgba(38, 141, 166, .13), transparent 57%);
}
body[data-page="home"] .circuit-ring {
  width: 151px;
  height: 151px;
  box-shadow: 0 0 40px rgba(24, 145, 176, .08);
}
body[data-page="home"] .circuit-ring span {
  font-size: 3.2rem;
  text-shadow: none;
}
body[data-page="home"] .small-connection {
  background: rgba(6, 30, 41, .67);
  border-color: rgba(120, 194, 207, .22);
  color: #b5cdd7;
}
body[data-page="home"] .solution-body {
  padding: 8px 35px 36px;
}
body[data-page="home"] .solution-body h3 {
  font-size: clamp(1.65rem, 2.45vw, 2.15rem);
  letter-spacing: -.05em;
  margin-bottom: 13px;
  text-wrap: balance;
}
body[data-page="home"] .solution-body > p {
  min-height: 0;
  max-width: 480px;
  font-size: .94rem;
  line-height: 1.7;
  color: #adc5d0;
}
body[data-page="home"] .solution-body .btn {
  margin-top: 29px;
  min-height: 44px;
  border-color: rgba(174, 223, 231, .27);
  background: rgba(255, 255, 255, .035);
  padding: 11px 27px;
  color: #e2f9fc;
  font-weight: 650;
  font-size: .88rem;
  box-shadow: none;
}
body[data-page="home"] .solution-body .btn:hover {
  background: rgba(126, 210, 224, .12);
  border-color: rgba(177, 237, 237, .57);
}

/* Servizi secondari: due card leggere e cliccabili. */
body[data-page="home"] .other-solutions-heading {
  margin: 91px 0 25px;
}
body[data-page="home"] .other-solutions-heading h3 {
  font-size: clamp(1.55rem, 2.5vw, 2.05rem);
  letter-spacing: -.055em;
}
body[data-page="home"] .other-solutions-grid {
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 20px;
}
body[data-page="home"] .mini-service {
  min-height: 160px;
  padding: 29px 31px;
  border-radius: 21px;
  border-color: rgba(204, 236, 244, .12);
  background: rgba(14, 38, 52, .52);
  box-shadow: none;
}
body[data-page="home"] .mini-service:hover {
  border-color: rgba(167, 223, 235, .40);
  transform: translateY(-3px);
}
body[data-page="home"] .mini-service > .ico {
  width: 27px;
  height: 27px;
  color: #86dfe1;
  margin-bottom: 19px;
}
body[data-page="home"] .mini-service h3 {
  font-size: 1.18rem;
  margin-bottom: 7px;
  letter-spacing: -.035em;
}
body[data-page="home"] .mini-service p {
  color: #a7beca;
  font-size: .86rem;
  line-height: 1.5;
}
body[data-page="home"] .mini-service span {
  display: none;
}

/* Processo, team e contatti senza pannelli luminosi superflui. */
body[data-page="home"] .method-section {
  border-top: 1px solid rgba(255, 255, 255, .055);
}
body[data-page="home"] .process-step {
  min-height: 155px;
  border-top: 1px solid rgba(225, 247, 249, .21);
  border-radius: 0;
  background: transparent;
  padding: 22px 16px 10px;
}
body[data-page="home"] .process-step > .ico {
  height: 29px;
  width: 29px;
  color: #8fd4df;
  margin-bottom: 13px;
}
body[data-page="home"] .process-step h3 {
  font-size: 1rem;
  letter-spacing: -.025em;
}
body[data-page="home"] .process-step p {
  color: #9cb5c0;
  font-size: .8rem;
  line-height: 1.55;
}
body[data-page="home"] .process-step::after {
  display: none;
}
body[data-page="home"] .step-num {
  color: #8ecbd5;
}
body[data-page="home"] .team-section {
  border-top: 1px solid rgba(255, 255, 255, .055);
}
body[data-page="home"] .team-card {
  border: 1px solid rgba(218, 243, 245, .10);
  background: rgba(14, 39, 52, .53);
  border-radius: 19px;
  box-shadow: none;
}
body[data-page="home"] .team-card:hover {
  border-color: rgba(168, 225, 229, .31);
  transform: translateY(-3px);
}
body[data-page="home"] .team-avatar {
  height: 103px;
  background: radial-gradient(circle at 50% 40%, rgba(45, 103, 121, .53), rgba(8, 30, 43, .65));
}
body[data-page="home"] .team-avatar::before {
  border-color: rgba(150, 204, 222, .12);
}
body[data-page="home"] .team-avatar i {
  display: none;
}
body[data-page="home"] .team-avatar span {
  color: #c7e5ec;
  text-shadow: none;
  font-size: 2rem;
  font-weight: 700;
}
body[data-page="home"] .team-info {
  padding: 18px 17px 24px;
}
body[data-page="home"] .team-info h3 {
  font-size: .94rem;
  margin-bottom: 8px;
}
body[data-page="home"] .team-info .role {
  color: #a2c4d1;
  font-size: .68rem;
  line-height: 1.5;
}
body[data-page="home"] .team-info p:last-child:not(.role) {
  display: none;
}
body[data-page="home"] .contact-section {
  border-top: 1px solid rgba(237, 251, 252, .08);
  background: linear-gradient(125deg, rgba(7, 28, 40, .82), rgba(5, 22, 34, .83));
}
body[data-page="home"] .contact-intro h2 {
  font-size: clamp(2.4rem, 4.5vw, 3.7rem);
  letter-spacing: -.065em;
}
body[data-page="home"] .contact-card {
  border: 1px solid rgba(221, 244, 247, .13);
  border-radius: 24px;
  background: rgba(13, 41, 54, .57);
  box-shadow: none;
}
body[data-page="home"] .contact-form input:not([type=checkbox]),
body[data-page="home"] .contact-form select,
body[data-page="home"] .contact-form textarea {
  border-radius: 11px;
  border-color: rgba(164, 217, 225, .18);
  background: rgba(4, 19, 29, .50);
}
body[data-page="home"] .contact-form .btn-primary {
  box-shadow: none;
}

@media (max-width: 900px) {
  body[data-page="home"] .hero-home {
    min-height: 100svh;
    min-height: 100dvh;
  }
  body[data-page="home"] .hero-home .hero-inner {
    min-height: calc(100svh - 82px);
    min-height: calc(100dvh - 82px);
    grid-template-columns: 1fr;
  }
  body[data-page="home"] .hero-home .hero-content {
    padding: 0 0 2vh;
  }
  body[data-page="home"] .hero-home h1 {
    font-size: clamp(3.05rem, 8.7vw, 6.7rem);
  }
}
@media (max-width: 680px) {
  body[data-page="home"] .hero-home {
    padding-top: 72px;
  }
  body[data-page="home"] .hero-home .hero-inner {
    min-height: calc(100svh - 72px);
    min-height: calc(100dvh - 72px);
  }
  body[data-page="home"] .hero-home h1 {
    font-size: clamp(2.1rem, 9.6vw, 4.4rem);
    line-height: 1.055;
    letter-spacing: -.067em;
    margin-bottom: 21px;
  }
  body[data-page="home"] .hero-home .hero-copy {
    font-size: .92rem;
    line-height: 1.6;
    max-width: 330px;
  }
  body[data-page="home"] .hero-home .hero-tech-bg canvas {
    opacity: .22;
  }
  body[data-page="home"] main > .section {
    padding-block: 74px;
  }
  body[data-page="home"] .section-heading {
    margin-bottom: 27px;
  }
  body[data-page="home"] .section-heading h2 {
    font-size: clamp(2.05rem, 8vw, 2.8rem);
  }
  body[data-page="home"] .primary-solutions,
  body[data-page="home"] .other-solutions-grid {
    grid-template-columns: 1fr;
    gap: 17px;
  }
  body[data-page="home"] .solution-top {
    padding: 24px 24px 0;
  }
  body[data-page="home"] .solution-visual {
    height: 175px;
  }
  body[data-page="home"] .solution-body {
    padding: 7px 24px 27px;
  }
  body[data-page="home"] .solution-body h3 {
    font-size: 1.68rem;
  }
  body[data-page="home"] .solution-body > p {
    font-size: .88rem;
  }
  body[data-page="home"] .other-solutions-heading {
    margin-top: 66px;
  }
  body[data-page="home"] .mini-service {
    min-height: 140px;
    padding: 25px;
  }
  body[data-page="home"] .team-avatar {
    height: 87px;
  }
  body[data-page="home"] .team-info {
    padding: 15px 13px 17px;
  }
}
@media (max-width: 380px) {
  body[data-page="home"] .hero-home h1 {
    font-size: 9.5vw;
  }
}


/* ==========================================================
   TRIMAP / RESTYLING UNIFICATO — ottobre 2026
   Superfici continue tra Hero, sezioni e pagine: nessuna fascia
   scura netta. La canvas rimane presente dove già prevista.
   ========================================================== */
:root {
  --bg: #091e2a;
  --bg2: #091e2a;
  --surface: rgba(13, 38, 51, .67);
  --surface2: rgba(16, 48, 62, .70);
}
html {
  background: #091e2a;
}
.animated-background {
  background: linear-gradient(145deg, #091e2a 0%, #102e3d 47%, #091e2a 100%);
}
.hero,
body[data-page="home"] .hero-home,
body[data-page="soluzioni"] .hero-minimal {
  background: transparent;
}
.section,
.section:nth-of-type(odd),
body[data-page="home"] main > .section,
body[data-page="home"] main > .section:nth-of-type(odd),
.method-section,
.team-section,
.usecases-section,
.contact-section,
body[data-page="home"] .contact-section {
  background: transparent;
}
.hero-tech-overlay,
body[data-page="home"] .hero-home .hero-tech-overlay {
  background: radial-gradient(ellipse 64% 68% at 50% 48%, rgba(6, 23, 33, .03), rgba(5, 22, 31, .16) 100%);
}
/* Il Canvas della Home contiene ora molte più stelle, leggibili senza coprire il testo. */
body[data-page="home"] .hero-home .hero-tech-bg canvas {
  opacity: .68;
}

/* Homepage: quattro servizi secondari (software, integrazioni, dati, assistenza). */
body[data-page="home"] .other-solutions-grid {
  grid-template-columns: repeat(2, minmax(0,1fr));
}
/* Card principali prive di label: recupero lo spazio verticale. */
body[data-page="home"] .solution-visual {
  margin-top: 20px;
}

/* Soluzioni: prima schermata minimal, centrata e alta quanto il viewport. */
body[data-page="soluzioni"] .services-hero.hero-minimal {
  min-height: 100vh;
  min-height: 100svh;
  min-height: 100dvh;
  padding-top: 82px;
}
body[data-page="soluzioni"] .hero-minimal .hero-inner {
  min-height: calc(100vh - 82px);
  min-height: calc(100svh - 82px);
  min-height: calc(100dvh - 82px);
  display: grid;
  grid-template-columns: 1fr;
  place-items: center;
  gap: 0;
}
body[data-page="soluzioni"] .hero-minimal .hero-content {
  max-width: 1150px;
  width: 100%;
  margin: 0 auto;
  padding: 0 0 2vh;
  text-align: center;
}
body[data-page="soluzioni"] .hero-minimal h1 {
  font-size: clamp(3rem, 7.6vw, 7.65rem);
  font-weight: 800;
  letter-spacing: -.075em;
  line-height: 1.04;
  max-width: none;
  margin: 0 auto 27px;
  text-wrap: balance;
}
body[data-page="soluzioni"] .hero-minimal h1 span {
  color: #9edbe8;
  background: linear-gradient(110deg,#a6f1ec,#86cde7 50%,#a0c3f3);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
body[data-page="soluzioni"] .hero-minimal .hero-copy {
  font-size: clamp(.96rem,1.5vw,1.16rem);
  line-height: 1.6;
  max-width: 700px;
  margin: 0 auto;
  text-wrap: balance;
  color: #bdd2dc;
}
/* Soluzioni su richiesta: testi e link puliti dopo la rimozione del CRM. */
body[data-page="soluzioni"] .catalog-card {
  background: rgba(10, 34, 47, .60);
  border: 1px solid rgba(175, 228, 234, .17);
  border-radius: 19px;
}
body[data-page="soluzioni"] .catalog-link {
  gap: 10px;
  color: #8fdfec;
  font-size: .84rem;
  font-weight: 650;
}
body[data-page="soluzioni"] .catalog-link:hover {
  color: #fff;
}
body[data-page="soluzioni"] .catalog-link .ico {
  width: 17px;
  height: 17px;
}
@media (max-width: 680px) {
  body[data-page="soluzioni"] .services-hero.hero-minimal {
    padding-top: 72px;
  }
  body[data-page="soluzioni"] .hero-minimal .hero-inner {
    min-height: calc(100svh - 72px);
    min-height: calc(100dvh - 72px);
  }
  body[data-page="soluzioni"] .hero-minimal h1 {
    font-size: clamp(2.05rem, 9.0vw, 3.65rem);
    letter-spacing: -.062em;
    margin-bottom: 22px;
  }
  body[data-page="soluzioni"] .hero-minimal .hero-copy {
    max-width: 340px;
    font-size: .93rem;
  }
  body[data-page="home"] .hero-home .hero-tech-bg canvas {
    opacity: .50;
  }
  body[data-page="home"] .other-solutions-grid {
    grid-template-columns: 1fr;
  }
  body[data-page="home"] .solution-visual {
    margin-top: 6px;
  }
}


/* ==========================================================
   TRIMAP AI / HERO MINIMAL — ottobre 2026
   Stessa altezza, centratura e palette della Home e di Soluzioni.
   ========================================================== */
body[data-page="ai"] .ai-hero.hero-minimal {
  min-height: 100vh;
  min-height: 100svh;
  min-height: 100dvh;
  padding-top: 82px;
  background: transparent;
}
body[data-page="ai"] .hero-minimal .hero-inner {
  min-height: calc(100vh - 82px);
  min-height: calc(100svh - 82px);
  min-height: calc(100dvh - 82px);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  place-items: center;
  gap: 0;
}
body[data-page="ai"] .hero-minimal .hero-content {
  max-width: 1150px;
  width: 100%;
  margin: 0 auto;
  padding: 0 0 2vh;
  text-align: center;
}
body[data-page="ai"] .hero-minimal h1 {
  font-size: clamp(3rem, 7.6vw, 7.65rem);
  font-weight: 800;
  letter-spacing: -.075em;
  line-height: 1.04;
  max-width: none;
  margin: 0 auto 27px;
  text-wrap: balance;
}
body[data-page="ai"] .hero-minimal h1 span {
  display: inline;
  color: #9edbe8;
  background: linear-gradient(110deg, #a6f1ec, #86cde7 50%, #a0c3f3);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
body[data-page="ai"] .hero-minimal .hero-copy {
  font-size: clamp(.96rem, 1.5vw, 1.16rem);
  line-height: 1.6;
  max-width: 700px;
  margin: 0 auto;
  color: #bdd2dc;
  text-wrap: balance;
}
body[data-page="ai"] .hero-minimal .hero-tech-overlay {
  background: radial-gradient(ellipse 64% 68% at 50% 48%, rgba(6, 23, 33, .03), rgba(5, 22, 31, .16) 100%);
}
body[data-page="ai"] .hero-minimal .hero-tech-bg canvas {
  opacity: .68;
}
/* Sezione del problema solo testuale, senza spazio riservato al diagramma. */
body[data-page="ai"] .ai-problem {
  padding-block: clamp(62px, 7vw, 94px);
  background: transparent;
}
body[data-page="ai"] .ai-problem .section-heading {
  margin-bottom: 0;
}
/* Stessa leggerezza delle card di Soluzioni. */
body[data-page="ai"] .ai-step,
body[data-page="ai"] .part-card,
body[data-page="ai"] .roadmap-card {
  background: rgba(10, 34, 47, .60);
  border: 1px solid rgba(175, 228, 234, .17);
  border-radius: 19px;
  box-shadow: none;
}
body[data-page="ai"] .roadmap-card {
  border-top: 1px solid rgba(175, 228, 234, .17);
}
body[data-page="ai"] .partnership-section,
body[data-page="ai"] .roadmap-section {
  background: transparent;
}
body[data-page="ai"] .part-cta {
  background: rgba(10, 34, 47, .45);
  border: 1px solid rgba(175, 228, 234, .17);
  border-radius: 19px;
}
@media (max-width: 680px) {
  body[data-page="ai"] .ai-hero.hero-minimal {
    padding-top: 72px;
  }
  body[data-page="ai"] .hero-minimal .hero-inner {
    min-height: calc(100svh - 72px);
    min-height: calc(100dvh - 72px);
  }
  body[data-page="ai"] .hero-minimal .hero-content {
    padding: 0 0 2vh;
  }
  body[data-page="ai"] .hero-minimal h1 {
    font-size: clamp(2.65rem, 12vw, 4.5rem);
    letter-spacing: -.062em;
    margin-bottom: 22px;
  }
  body[data-page="ai"] .hero-minimal .hero-copy {
    max-width: 340px;
    font-size: .93rem;
  }
  body[data-page="ai"] .hero-minimal .hero-tech-bg canvas {
    opacity: .50;
  }
}


/* =========================================
   SITI WEB — RESTYLING MINIMAL
========================================= */
body[data-page="web"] .web-hero {
  min-height: 100svh;
  min-height: 100vh;
}
body[data-page="web"] .subhero-grid {
  grid-template-columns: 1fr;
  min-height: 100svh;
  min-height: 100vh;
  justify-items: center;
  align-content: center;
  gap: 0;
}
body[data-page="web"] .subhero .hero-content {
  max-width: 900px;
  margin: 0 auto;
  padding: 150px 0 110px;
  text-align: center;
}
body[data-page="web"] .subhero .hero-copy {
  max-width: 760px;
  margin: 24px auto 0;
}
body[data-page="web"] .web-visual-section {
  padding-top: 0;
  margin-top: -10px;
}
body[data-page="web"] .visual-showcase {
  display: flex;
  justify-content: center;
}
body[data-page="web"] .visual-showcase .large-demo {
  width: min(1040px, 100%);
  margin: 0 auto;
  transform: none;
}
body[data-page="web"] .visual-showcase .laptop-screen {
  min-height: 360px;
}
body[data-page="web"] .section-heading {
  align-items: end;
}
body[data-page="web"] .sector-symbol {
  width: 70px;
  height: 70px;
  margin: 0 0 20px;
  border-radius: 18px;
  background: linear-gradient(155deg, rgba(79, 212, 225, 0.18), rgba(107, 184, 255, 0.12));
  border-color: rgba(79, 212, 225, 0.34);
}
body[data-page="web"] .sector-symbol .ico {
  width: 34px;
  height: 34px;
}
body[data-page="web"] .sector-card {
  min-height: 245px;
}
body[data-page="web"] .faq-layout > div:first-child .lead {
  display: none;
}
@media (max-width: 920px) {
  body[data-page="web"] .subhero .hero-content {
    padding: 130px 0 80px;
  }
  body[data-page="web"] .visual-showcase .large-demo {
    width: 100%;
  }
}
@media (max-width: 620px) {
  body[data-page="web"] .subhero .hero-content {
    padding: 120px 0 70px;
  }
  body[data-page="web"] .visual-showcase .large-demo {
    margin-top: 0;
  }
  body[data-page="web"] .visual-showcase .phone-demo {
    right: 2%;
  }
}


/* ===========================================================
   TRIMAP / WEB — scroll showcase built with real HTML/CSS
   Fixed device aspect ratios; only UNIFORM scaling is applied.
   The visual depicts a sample TRIMAP web-design concept (FORMA).
   =========================================================== */
body[data-page="web"] .web-device-story {
  position: relative;
  height: 205svh;
  min-height: 1050px;
  padding: 0;
  background: transparent;
  isolation: isolate;
  overflow: clip;
}
body[data-page="web"] .web-device-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100svh;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: radial-gradient(ellipse 54% 43% at 50% 65%, rgba(61,132,153,.14), transparent 83%);
}
body[data-page="web"] .web-device-stage {
  width: 1020px;
  height: 690px;
  position: relative;
  flex: none;
  transform: scale(var(--web-stage-fit, 1));
  transform-origin: center center;
  perspective: 1600px;
  user-select: none;
  pointer-events: none;
}
body[data-page="web"] .web-device-laptop {
  position: absolute;
  left: 65px;
  top: 40px;
  width: 830px;
  height: 610px;
  transform-origin: 48% 85%;
  transform: translate3d(0,0,0);
  filter: drop-shadow(0 36px 40px rgba(0,0,0,.22));
  will-change: transform, opacity;
}
body[data-page="web"] .web-laptop-lid {
  position: relative;
  width: 820px;
  height: 506px;
  margin-left: 5px;
  padding: 13px 12px 14px;
  background: linear-gradient(125deg,#11171d,#2e3842 45%,#090c10 87%);
  border: 2px solid #606d76;
  border-radius: 19px 19px 8px 8px;
  box-shadow: inset 0 0 0 2px #090b0e, 0 16px 50px rgba(0,0,0,.38), 0 0 0 1px #09151e;
  transform-origin: 50% 100%;
}
body[data-page="web"] .web-laptop-camera {
  position: absolute;
  top: 5px;left:calc(50% - 2px);
  width: 4px;height: 4px;
  border-radius: 50%;
  background: #0d131a;
  box-shadow: 0 0 0 1px #49525c;
  z-index: 3;
}
body[data-page="web"] .web-laptop-screen {
  width: 100%;height:100%;
  overflow: hidden;
  border-radius: 5px;
  background: #faf9f5;
  color: #14202a;
  display: flex;
  flex-direction: column;
  font-family: "Inter", sans-serif;
}
body[data-page="web"] .web-demo-nav {
  height: 64px;
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 34px;
  background: #fbfaf8;
  font-size: 11px;
  color: #34414a;
}
body[data-page="web"] .web-demo-nav strong,
body[data-page="web"] .web-phone-nav strong {
  font-size: 21px;
  color: #152b35;
  letter-spacing: -.07em;
}
body[data-page="web"] .web-demo-nav strong span,
body[data-page="web"] .web-phone-nav strong span {color:#b18465}
body[data-page="web"] .web-demo-links {display:flex;gap:32px;align-items:center}
body[data-page="web"] .web-demo-nav-cta {padding:11px 17px;border:1px solid #d9d9d4;border-radius:30px}
body[data-page="web"] .web-demo-layout {display:grid;grid-template-columns:1fr 1fr;min-height:360px;flex:1}
body[data-page="web"] .web-demo-copy {padding:55px 12px 35px 56px;align-self:center}
body[data-page="web"] .web-demo-kicker {font-size:10px;letter-spacing:.18em;font-weight:700;color:#a27d61}
body[data-page="web"] .web-demo-copy h2 {
  font-size:49px;
  line-height:1.06;
  margin:21px 0 17px;
  color:#132b34;
  font-weight:700;
  letter-spacing:-.074em;
}
body[data-page="web"] .web-demo-copy h2 em {font-style:normal;color:#9c806b}
body[data-page="web"] .web-demo-copy p {max-width:300px;font-size:13px;color:#626e70;line-height:1.7}
body[data-page="web"] .web-demo-button {display:inline-flex;align-items:center;gap:24px;margin-top:27px;padding:14px 22px;background:#203b42;color:white;font-size:12px;border-radius:3px}
body[data-page="web"] .web-demo-art {position:relative;overflow:hidden;background:linear-gradient(135deg,#e3ddd2,#c9beb0 75%,#a69b8c)}
body[data-page="web"] .web-art-window {
  position:absolute;right:20px;top:0;width:76%;height:75%;
  border-left:15px solid rgba(75,72,65,.24);border-right:15px solid rgba(75,72,65,.25);
  background:linear-gradient(135deg,rgba(255,255,255,.58),rgba(212,213,202,.37)),
   repeating-linear-gradient(90deg, transparent 0 64px,rgba(60,70,65,.22) 65px 69px);
  box-shadow:inset 0 0 0 12px rgba(255,255,255,.18);
}
body[data-page="web"] .web-art-sun {position:absolute;width:175px;height:175px;right:62px;top:50px;border-radius:50%;background:rgba(255,250,228,.48);filter:blur(13px)}
body[data-page="web"] .web-art-plinth {position:absolute;bottom:-8%;left:-9%;width:122%;height:38%;background:linear-gradient(20deg,#9a8b7d,#dbd0c4);transform:skewY(-8deg)}
body[data-page="web"] .web-art-block {position:absolute;background:linear-gradient(130deg,#e4ded4,#c0b3a4);box-shadow:18px 17px 23px rgba(40,35,29,.18)}
body[data-page="web"] .web-art-block-a {width:125px;height:220px;left:35%;bottom:13%;transform:skewY(10deg)}
body[data-page="web"] .web-art-block-b {width:112px;height:150px;left:53%;bottom:11%;background:linear-gradient(130deg,#d8ccbc,#ae9f8c);transform:skewY(-8deg)}
body[data-page="web"] .web-demo-bottom {height:42px;padding:0 33px;display:flex;align-items:center;justify-content:space-between;background:#faf9f5;font-size:9px;letter-spacing:.09em;color:#68767b}
body[data-page="web"] .web-laptop-hinge {width:805px;height:13px;margin:-1px auto 0;border-radius:2px;background:linear-gradient(180deg,#0d1117,#748089 55%,#202831)}
body[data-page="web"] .web-laptop-base {
  width:830px;height:89px;
  background:linear-gradient(175deg,#e0e4e6,#909ba5 60%,#5b6670);
  border-radius:4px 4px 27px 27px;
  box-shadow:inset 0 2px 0 #e5e8e9,0 13px 18px rgba(0,0,0,.23);
  position:relative;
  transform:perspective(900px) rotateX(51deg);
  transform-origin:50% 0;
  margin-top:-2px;
}
body[data-page="web"] .web-laptop-keyboard {
  position:absolute;top:13px;left:11%;width:78%;height:39px;border-radius:5px;
  background:repeating-linear-gradient(90deg,#222a33 0 31px,#707981 32px 35px),
   linear-gradient(180deg,#3e434a,#1c242b);
  box-shadow:0 0 0 4px rgba(80,91,101,.32);
  opacity:.91;
}
body[data-page="web"] .web-laptop-keyboard::after {content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 8px,#aeb8bf 9px 11px);opacity:.56}
body[data-page="web"] .web-laptop-trackpad {position:absolute;bottom:5px;left:41%;width:18%;height:23px;border:1px solid #7e8a95;border-radius:4px}
body[data-page="web"] .web-laptop-edge {position:absolute;left:-10px;top:599px;width:850px;height:11px;border-radius:2px 2px 60% 60%;background:linear-gradient(#687480,#c3c9ca 55%,#6e7984);box-shadow:0 8px 18px rgba(0,0,0,.20)}
body[data-page="web"] .web-device-phone {
  position:absolute;
  left:730px;top:218px;
  width:215px;height:433px;
  padding:8px;
  border-radius:34px;
  border:3px solid #89949e;
  background:linear-gradient(120deg,#101418,#293037 55%,#090c10);
  box-shadow:inset 0 0 0 2px #05080a,0 25px 42px rgba(0,0,0,.45),-10px 2px 35px rgba(0,0,0,.18);
  transform-origin:50% 70%;
  z-index:5;
  will-change:transform,opacity;
}
body[data-page="web"] .web-phone-speaker {position:absolute;left:calc(50% - 33px);top:13px;width:66px;height:17px;border-radius:20px;background:#080a0d;z-index:5;box-shadow:0 0 0 2px #20252b}
body[data-page="web"] .web-phone-screen {width:100%;height:100%;background:#fbfaf7;color:#172b35;border-radius:25px;overflow:hidden;position:relative;font-family:"Inter",sans-serif}
body[data-page="web"] .web-phone-nav {height:53px;padding:20px 16px 5px;display:flex;align-items:center;justify-content:space-between}
body[data-page="web"] .web-phone-nav strong {font-size:17px}
body[data-page="web"] .web-phone-burger {font-size:16px;color:#25363d}
body[data-page="web"] .web-phone-art {height:160px;position:relative;overflow:hidden;background:linear-gradient(145deg,#dbd4c8,#b7a899)}
body[data-page="web"] .web-phone-arch {width:105px;height:170px;border:11px solid rgba(244,240,233,.58);border-radius:80px 80px 0 0;position:absolute;right:17px;bottom:-36px;background:linear-gradient(125deg,#f0e8da,#c2b5a3)}
body[data-page="web"] .web-phone-block {position:absolute;width:100px;height:88px;bottom:-30px;left:18px;background:linear-gradient(135deg,#d9cbbb,#9f8c75);transform:skewY(-9deg)}
body[data-page="web"] .web-phone-content {padding:20px 17px}
body[data-page="web"] .web-phone-content>span {font-size:7px;letter-spacing:.17em;font-weight:800;color:#ad886d}
body[data-page="web"] .web-phone-content h3 {font-size:23px;line-height:1.13;letter-spacing:-.07em;margin:9px 0;color:#1a353b}
body[data-page="web"] .web-phone-content p {font-size:9px;line-height:1.5;color:#718082}
body[data-page="web"] .web-phone-content b {display:inline-block;font-size:9px;font-weight:650;margin-top:14px;padding:9px 10px;background:#203b42;color:white;border-radius:3px}
body[data-page="web"] .web-phone-home-indicator {position:absolute;bottom:7px;width:65px;height:3px;background:#34393b;border-radius:5px;left:calc(50% - 32px)}
body[data-page="web"] .web-device-story.web-story-enhanced .web-device-laptop {opacity: var(--web-laptop-opacity,1);transform:translate3d(0,var(--web-laptop-y,0px),0) rotateX(var(--web-laptop-tilt,0deg)) scale(var(--web-laptop-scale,1))}
body[data-page="web"] .web-device-story.web-story-enhanced .web-device-phone {opacity: var(--web-phone-opacity,1);transform:translate3d(var(--web-phone-x,0px),var(--web-phone-y,0px),0) rotateY(var(--web-phone-tilt,0deg)) rotateZ(var(--web-phone-roll,0deg))}
@media(prefers-reduced-motion: reduce) {
  body[data-page="web"] .web-device-story {height:auto;min-height:0}
  body[data-page="web"] .web-device-sticky {position:relative;height:550px}
}


/* ===============================================
   TRIMAP WEB — iPhone stable mobile device layout
   Both devices are rendered as complete, proportional objects.
   No scroll-pinned empty space or individual lid transforms.
   =============================================== */
@media (max-width: 680px) {
  body[data-page="web"] .web-device-story {
    height: auto;
    min-height: 0;
    padding: clamp(48px, 13vw, 86px) 0 clamp(50px, 14vw, 96px);
    overflow: hidden;
  }
  body[data-page="web"] .web-device-sticky {
    position: relative;
    inset: auto;
    top: auto;
    height: auto;
    min-height: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: visible;
    background: radial-gradient(ellipse 70% 55% at 50% 52%, rgba(65,148,169,.16), transparent 85%);
  }
  body[data-page="web"] .web-device-stage {
    width: calc(100% - 24px);
    max-width: 520px;
    height: var(--web-mobile-stage-height, 440px);
    position: relative;
    flex: none;
    transform: none;
    perspective: none;
    overflow: visible;
    opacity: 1;
  }
  body[data-page="web"] .web-device-laptop,
  body[data-page="web"] .web-device-story.web-story-enhanced .web-device-laptop {
    position: absolute;
    top: 0;
    left: var(--web-mobile-laptop-left, 8px);
    width: 830px;
    height: 610px;
    opacity: 1;
    transform-origin: 0 0;
    transform: scale(var(--web-mobile-laptop-fit, .4));
    filter: drop-shadow(0 12px 14px rgba(0,0,0,.25));
    backface-visibility: visible;
    -webkit-backface-visibility: visible;
    will-change: auto;
  }
  body[data-page="web"] .web-device-phone,
  body[data-page="web"] .web-device-story.web-story-enhanced .web-device-phone {
    position: absolute;
    top: var(--web-mobile-phone-top, 140px);
    left: var(--web-mobile-phone-left, 230px);
    width: 215px;
    height: 433px;
    opacity: 1;
    transform-origin: 0 0;
    transform: scale(var(--web-mobile-phone-fit, .55));
    filter: drop-shadow(0 10px 12px rgba(0,0,0,.2));
    backface-visibility: visible;
    -webkit-backface-visibility: visible;
    will-change: auto;
  }
  body[data-page="web"] .web-device-stage .web-laptop-lid {
    transform: none;
    -webkit-transform: none;
  }
  body[data-page="web"] .web-device-story.web-story-mobile .web-device-stage {
    opacity: 0;
    transition: opacity .7s ease;
  }
  body[data-page="web"] .web-device-story.web-story-mobile.web-story-inview .web-device-stage {
    opacity: 1;
  }
  body[data-page="web"] .web-phone-art { height: 140px; }
  body[data-page="web"] .web-phone-content { padding: 16px 16px 12px; }
  body[data-page="web"] .web-phone-content h3 { font-size: 22px; margin: 7px 0; }
  body[data-page="web"] .web-phone-content b { margin-top: 10px; padding: 8px 10px; }
}
@media (max-width: 680px) and (prefers-reduced-motion: reduce) {
  body[data-page="web"] .web-device-story.web-story-mobile .web-device-stage {
    opacity: 1;
    transition: none;
  }
}


/* ================================================================
   TRIMAP / DRAWER MOBILE CINEMATIC — menu laterale premium
   Solo mobile: la navigazione desktop e il resto del sito restano invariati.
   ================================================================ */
.trimap-menu-backdrop,
.trimap-menu-drawer {
  display: none;
}

@media (max-width: 900px) {
  /* La navbar originale serve da sorgente dei link, ma non viene mostrata su mobile. */
  .site-header .nav {
    display: none !important;
  }
  .site-header .menu-toggle {
    position: relative;
    z-index: 1;
    width: 43px;
    height: 43px;
    padding: 9px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(110, 231, 200, .22);
    border-radius: 13px;
    background: rgba(255, 255, 255, .035);
    transition: border-color .25s ease, background .25s ease, transform .25s ease;
  }
  .site-header .menu-toggle:active { transform: scale(.94); }
  .site-header .menu-toggle .ico { transition: transform .35s ease, opacity .25s ease; }
  .trimap-menu-open .site-header .menu-toggle .ico { transform: rotate(45deg); opacity: .2; }

  .trimap-menu-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1190;
    display: block;
    background: rgba(0, 8, 15, .67);
    -webkit-backdrop-filter: blur(0px);
    backdrop-filter: blur(0px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .44s ease, visibility .44s,
      -webkit-backdrop-filter .44s ease, backdrop-filter .44s ease;
  }
  .trimap-menu-open .trimap-menu-backdrop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
  }

  .trimap-menu-drawer {
    position: fixed;
    z-index: 1200;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    width: min(430px, 90vw);
    height: 100vh;
    height: 100dvh;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: max(27px, env(safe-area-inset-top)) 25px
      max(25px, env(safe-area-inset-bottom));
    background: linear-gradient(165deg, rgba(7, 30, 43, .98), rgba(4, 17, 28, .99) 56%, rgba(7, 28, 43, .99));
    border-left: 1px solid rgba(94, 231, 221, .33);
    box-shadow: -34px 0 95px rgba(0, 0, 0, .44), -1px 0 30px rgba(53, 229, 244, .07);
    -webkit-backdrop-filter: blur(30px);
    backdrop-filter: blur(30px);
    visibility: hidden;
    pointer-events: none;
    transform: translate3d(106%, 0, 0);
    will-change: transform;
    transition: transform .62s cubic-bezier(.22, 1, .36, 1), visibility .62s;
    isolation: isolate;
  }
  .trimap-menu-drawer::before {
    content: '';
    position: absolute;
    z-index: -1;
    top: -160px;
    right: -190px;
    width: 460px;
    height: 460px;
    pointer-events: none;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(47, 217, 219, .19), transparent 65%);
  }
  .trimap-menu-drawer::after {
    content: '';
    position: absolute;
    left: 0;
    top: 18%;
    height: 42%;
    width: 1px;
    background: linear-gradient(transparent, rgba(89, 239, 228, .78), transparent);
    box-shadow: 0 0 22px rgba(53, 229, 244, .52);
    pointer-events: none;
  }
  .trimap-menu-open .trimap-menu-drawer {
    visibility: visible;
    pointer-events: auto;
    transform: translate3d(0, 0, 0);
  }
  .trimap-menu-open,
  .trimap-menu-open body {
    overflow: hidden !important;
  }
  .trimap-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 49px;
    gap: 12px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(152, 225, 238, .13);
  }
  .trimap-drawer-kicker {
    display: flex;
    align-items: center;
    gap: 11px;
    color: #eefbff;
    font-size: .69rem;
    font-weight: 750;
    letter-spacing: .25em;
  }
  .trimap-drawer-kicker i {
    width: 4px;
    height: 4px;
    border-radius: 100%;
    background: var(--cyan, #35e5f4);
    box-shadow: 0 0 13px var(--cyan, #35e5f4);
  }
  .trimap-drawer-close {
    display: grid;
    place-items: center;
    position: relative;
    width: 43px;
    height: 43px;
    flex: none;
    border-radius: 14px;
    border: 1px solid rgba(148, 216, 227, .20);
    background: rgba(255,255,255,.045);
    color: white;
    cursor: pointer;
    transition: transform .22s ease, background .22s ease, border-color .22s ease;
  }
  .trimap-drawer-close:hover { background: rgba(53, 229, 244, .12); border-color: var(--cyan); transform: rotate(90deg); }
  .trimap-drawer-close span {
    position: absolute;
    width: 17px;
    height: 1.5px;
    background: currentColor;
    border-radius: 2px;
    transform: rotate(45deg);
  }
  .trimap-drawer-close span:last-child { transform: rotate(-45deg); }

  .trimap-drawer-nav {
    display: flex;
    flex-direction: column;
    flex: 1 0 auto;
    padding: clamp(28px, 6.4vh, 74px) 0 20px;
    counter-reset: trimapMenu;
  }
  .trimap-drawer-link {
    position: relative;
    display: flex;
    align-items: baseline;
    gap: 19px;
    padding: 11px 0 12px;
    color: #e9f4f8;
    font-size: clamp(1.42rem, 5.6vw, 1.95rem);
    line-height: 1.23;
    letter-spacing: -.045em;
    font-weight: 560;
    border-bottom: 1px solid rgba(125, 205, 221, .095);
    opacity: 0;
    transform: translate3d(0, 19px, 0);
    transition: color .2s ease, opacity .34s ease, transform .34s ease;
  }
  .trimap-drawer-link::before {
    counter-increment: trimapMenu;
    content: counter(trimapMenu, decimal-leading-zero);
    flex: none;
    color: #5b929e;
    font: 500 .66rem/1.8 Inter, sans-serif;
    letter-spacing: 0;
    transform: translateY(2px);
  }
  .trimap-drawer-link.active,
  .trimap-drawer-link[aria-current="page"],
  .trimap-drawer-link:hover { color: var(--cyan, #35e5f4); }
  .trimap-drawer-link:not(.nav-cta) .ico { display: none; }
  .trimap-drawer-link.nav-cta {
    align-items: center;
    justify-content: center;
    gap: 11px;
    margin-top: 25px;
    border: 1px solid rgba(53, 229, 244, .52);
    border-radius: 100px;
    background: rgba(53, 229, 244, .075);
    padding: 15px;
    font-size: 1.02rem;
    font-weight: 650;
    letter-spacing: -.02em;
  }
  .trimap-drawer-link.nav-cta::before { display: none; }
  .trimap-drawer-link.nav-cta .ico { width: 17px; height: 17px; }
  .trimap-menu-open .trimap-drawer-link {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition: color .2s ease,
      opacity .5s ease calc(.12s + var(--link-order, 0) * .055s),
      transform .6s cubic-bezier(.22, 1, .36, 1) calc(.12s + var(--link-order, 0) * .055s);
  }
  .trimap-drawer-footer {
    display: flex;
    flex-direction: column;
    padding-top: 19px;
    border-top: 1px solid rgba(152, 225, 238, .16);
    font-size: .78rem;
    letter-spacing: -.01em;
    line-height: 1.6;
  }
  .trimap-drawer-footer span { color: #a0bdc9; }
  .trimap-drawer-footer strong { color: #edf8fc; font-weight: 750; }
  .trimap-drawer-footer small { color: #598493; font-size: .61rem; margin-top: 11px; letter-spacing: .15em; }
}
@media (max-width: 360px), (max-height: 650px) and (max-width: 900px) {
  .trimap-menu-drawer { padding-left: 20px; padding-right: 20px; }
  .trimap-drawer-nav { padding-top: 19px; }
  .trimap-drawer-link { font-size: 1.35rem; padding-top: 8px; padding-bottom: 9px; }
  .trimap-drawer-link.nav-cta { margin-top: 14px; padding: 12px; }
}
@media (prefers-reduced-motion: reduce) and (max-width: 900px) {
  .trimap-menu-drawer,
  .trimap-menu-backdrop,
  .trimap-drawer-link {
    transition-duration: .01ms !important;
    transition-delay: 0ms !important;
    animation: none !important;
  }
}


/* ===============================================================
   TRIMAP / IOS SAFARI DRAWER STABILITY HOTFIX
   Mantiene il drawer ancorato a destra: ingresso tramite reveal,
   senza traslare fisicamente il pannello durante il touch.
   =============================================================== */
@media (max-width: 900px) {
  html, body {
    overscroll-behavior-x: none;
  }

  .trimap-menu-drawer {
    right: 0;
    left: auto;
    max-width: 100vw;
    overflow-x: hidden;
    overscroll-behavior-x: none;
    touch-action: pan-y;
    transform: none !important;
    will-change: clip-path;
    -webkit-clip-path: inset(0 0 0 100%);
    clip-path: inset(0 0 0 100%);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transition:
      -webkit-clip-path .52s cubic-bezier(.22, 1, .36, 1),
      clip-path .52s cubic-bezier(.22, 1, .36, 1),
      visibility .52s;
  }

  .trimap-menu-open .trimap-menu-drawer {
    transform: none !important;
    -webkit-clip-path: inset(0 0 0 0);
    clip-path: inset(0 0 0 0);
  }

  /* La sfera luminosa a right:-190px creava 190px di overflow
     orizzontale nel drawer scrollabile: ecco il salto visto nel video. */
  .trimap-menu-drawer::before {
    right: 0;
    width: min(100%, 430px);
    height: 400px;
  }

  .trimap-menu-backdrop {
    touch-action: none;
  }
}

@media (prefers-reduced-motion: reduce) and (max-width: 900px) {
  .trimap-menu-drawer {
    transition-duration: .01ms !important;
  }
}


/* =========================================================
   TRIMAP — EVIDENZA INTERATTIVA PACCHETTI / SETTORI AI
   Nessun pacchetto preferito; tre settori solo informativi.
   ========================================================= */
body[data-page="web"] #pacchetti .pricing-card {
  isolation: isolate;
  background: linear-gradient(155deg, rgba(12, 44, 61, .96), rgba(7, 30, 43, .96));
  border: 1px solid rgba(108, 182, 204, .27);
  box-shadow: 0 8px 32px rgba(0, 8, 20, .12);
  transition: transform .42s cubic-bezier(.2,.8,.2,1),
              border-color .33s ease, box-shadow .42s ease,
              background .33s ease;
  cursor: pointer;
}
body[data-page="web"] #pacchetti .pricing-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(400px circle at var(--px, 50%) var(--py, 20%),
              rgba(53, 229, 244, .19), transparent 73%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .36s ease;
}
body[data-page="web"] #pacchetti .pricing-card > * {
  position: relative;
  z-index: 1;
}
body[data-page="web"] #pacchetti .pricing-card .btn {
  background: rgba(53, 229, 244, .035);
  border-color: rgba(53, 229, 244, .38);
  color: #eefbff;
  transition: background .3s ease, color .3s ease, border-color .3s ease;
}
@media (hover: hover) and (pointer: fine) {
  body[data-page="web"] #pacchetti .pricing-card.reveal.visible:hover {
    transform: translateY(-8px) scale(1.012);
  }
  body[data-page="web"] #pacchetti .pricing-card:hover::before { opacity: 1; }
}
body[data-page="web"] #pacchetti .pricing-card.reveal.visible:is(:focus-visible, :focus-within, .is-selected) {
  transform: translateY(-6px) scale(1.008);
}
body[data-page="web"] #pacchetti .pricing-card:is(:focus-visible, :focus-within, .is-selected),
body[data-page="web"] #pacchetti .pricing-card:hover {
  border-color: rgba(53, 229, 244, .85);
  box-shadow: 0 18px 58px rgba(0, 9, 20, .35),
              0 0 0 1px rgba(53, 229, 244, .12),
              0 0 38px rgba(53, 229, 244, .15);
}
body[data-page="web"] #pacchetti .pricing-card:is(:focus-visible, :focus-within, .is-selected)::before {
  opacity: 1;
}
body[data-page="web"] #pacchetti .pricing-card:is(:hover, :focus-visible, :focus-within, .is-selected) .btn {
  background: linear-gradient(110deg, #36e5f4, #79e7d7);
  border-color: transparent;
  color: #06212c;
}
body[data-page="web"] #pacchetti .pricing-card .pricing-tag {
  color: #93b9c7;
}
body[data-page="web"] #pacchetti .pricing-card:is(:hover, :focus-visible, :focus-within, .is-selected) .pricing-tag {
  color: #79e7e8;
}

/* TRIMAP AI — tre identità visive, senza alterare lo sfondo della pagina. */
body[data-page="ai"] .industry-overview-section {
  padding-top: 76px;
  padding-bottom: 86px;
  background: transparent;
}
body[data-page="ai"] .industry-overview-section .section-heading {
  margin-bottom: 28px;
}
body[data-page="ai"] .industry-overview-section .industries-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
body[data-page="ai"] .industry-overview-section .industry-card {
  --industry-tone: #70dce4;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 204px;
  padding: 25px 25px 23px;
  border-radius: 18px;
  border: 1px solid rgba(118, 197, 209, .19);
  background: radial-gradient(circle at 83% 11%, rgba(92, 205, 219, .12), transparent 56%),
              linear-gradient(145deg, rgba(16, 50, 63, .80), rgba(6, 30, 43, .88));
  box-shadow: inset 0 1px 0 rgba(222, 248, 250, .04);
  display: flex;
  flex-direction: column;
  justify-content: end;
  cursor: default;
}
body[data-page="ai"] .industry-overview-section .industry-packaging {
  --industry-tone: #90b8ff;
  background: radial-gradient(circle at 81% 8%, rgba(107, 152, 244, .15), transparent 56%),
              linear-gradient(145deg, rgba(17, 44, 67, .82), rgba(8, 29, 46, .88));
}
body[data-page="ai"] .industry-overview-section .industry-manufacturing {
  --industry-tone: #8bdbbf;
  background: radial-gradient(circle at 82% 10%, rgba(102, 205, 158, .13), transparent 56%),
              linear-gradient(145deg, rgba(15, 49, 50, .83), rgba(7, 31, 41, .89));
}
body[data-page="ai"] .industry-overview-section .industry-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 24px;
  width: 48px;
  height: 2px;
  border-radius: 0 0 3px 3px;
  background: var(--industry-tone);
  box-shadow: 0 0 16px var(--industry-tone);
  opacity: .8;
}
body[data-page="ai"] .industry-overview-section .industry-card::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--industry-tone), transparent);
  opacity: .23;
}
body[data-page="ai"] .industry-overview-section .industry-art {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 172px;
  height: 108px;
  color: var(--industry-tone);
  opacity: .87;
  pointer-events: none;
}
body[data-page="ai"] .industry-overview-section .industry-art svg {
  display: block;
  width: 100%;
  height: 100%;
}
body[data-page="ai"] .industry-overview-section .industry-copy {
  position: relative;
  z-index: 1;
}
body[data-page="ai"] .industry-overview-section .industry-card h3 {
  margin: 0 0 8px;
  font-size: clamp(1.13rem, 1.8vw, 1.35rem);
  font-weight: 750;
  line-height: 1.15;
  letter-spacing: -.04em;
  color: #f1faff;
}
body[data-page="ai"] .industry-overview-section .industry-card p {
  margin: 0;
  max-width: 270px;
  font-size: .78rem;
  line-height: 1.6;
  color: #b0c9d2;
}

/* Home — ruoli professionali con identità e gerarchia tipografica. */
body[data-page="home"] .team-info h3 {
  color: #f3f9fb;
  font-size: 1.01rem;
  font-weight: 800;
  letter-spacing: -.035em;
  margin-bottom: 11px;
}
body[data-page="home"] .team-info .role {
  --role-tone: #7ce1d0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  max-width: 100%;
  padding: 7px 10px;
  border: 1px solid rgba(128, 228, 214, .16);
  border-radius: 8px;
  background: rgba(80, 203, 186, .075);
  color: #b6f4e8;
  font-size: .62rem;
  font-weight: 780;
  letter-spacing: .095em;
  line-height: 1.45;
  text-transform: uppercase;
  overflow-wrap: anywhere;
  margin: 0;
  transition: border-color .25s ease, background .25s ease, transform .25s ease;
}
body[data-page="home"] .team-info .role::before {
  content: "";
  flex: 0 0 5px;
  height: 5px;
  background: var(--role-tone);
  border-radius: 2px;
  box-shadow: 0 0 8px var(--role-tone);
}
body[data-page="home"] .team-card:nth-child(2) .role,
body[data-page="home"] .team-card:nth-child(4) .role,
body[data-page="home"] .team-card:nth-child(5) .role {
  --role-tone: #84bfff;
  background: rgba(93, 153, 232, .078);
  border-color: rgba(134, 190, 255, .17);
  color: #c3ddff;
}
@media (hover: hover) {
  body[data-page="home"] .team-card:hover .role {
    border-color: rgba(166, 231, 237, .38);
    background: rgba(112, 204, 222, .14);
    transform: translateY(-1px);
  }
}
@media (hover: none) {
  body[data-page="web"] #pacchetti .pricing-card:hover:not(.is-selected):not(:focus-within) {
    border-color: rgba(108, 182, 204, .27);
    box-shadow: 0 8px 32px rgba(0, 8, 20, .12);
  }
  body[data-page="web"] #pacchetti .pricing-card:hover:not(.is-selected):not(:focus-within)::before {
    opacity: 0;
  }
  body[data-page="web"] #pacchetti .pricing-card:hover:not(.is-selected):not(:focus-within) .btn {
    background: rgba(53, 229, 244, .035);
    color: #eefbff;
    border-color: rgba(53, 229, 244, .38);
  }
}
@media (max-width: 800px) {
  body[data-page="ai"] .industry-overview-section { padding-top: 61px; padding-bottom: 69px; }
  body[data-page="ai"] .industry-overview-section .industries-grid {
    grid-template-columns: 1fr;
    gap: 9px;
  }
  body[data-page="ai"] .industry-overview-section .industry-card {
    min-height: 172px;
    padding: 20px 22px;
  }
  body[data-page="ai"] .industry-overview-section .industry-art {
    width: 145px;
    height: 91px;
    top: 8px;
    right: 8px;
  }
  body[data-page="ai"] .industry-overview-section .industry-card p {
    max-width: 285px;
  }
}
@media (max-width: 620px) {
  body[data-page="web"] #pacchetti .pricing-card.reveal.visible:is(:focus-visible, :focus-within, .is-selected) {
    transform: translateY(-3px);
  }
}
@media (prefers-reduced-motion: reduce) {
  body[data-page="web"] #pacchetti .pricing-card,
  body[data-page="web"] #pacchetti .pricing-card::before,
  body[data-page="web"] #pacchetti .pricing-card .btn {
    transition: none !important;
  }
}

@media (max-width: 390px) {
  body[data-page="ai"] .industry-overview-section .industry-card {
    min-height: 180px;
  }
  body[data-page="ai"] .industry-overview-section .industry-art {
    opacity: .60;
    transform: translateX(5px);
  }
  body[data-page="home"] .team-info .role {
    font-size: .58rem;
    letter-spacing: .06em;
  }
}


/* TRIMAP — sottotitolo riutilizzabile */
.eyebrows {
  display: block;
  font-size: clamp(.9rem, 1.35vw, 1.1rem);
  font-weight: 450;
  line-height: 1.65;
  letter-spacing: .025em;
  color: #adcbd7;
  text-transform: none;
  text-wrap: balance;
}

body[data-page="ai"] .hero .hero-copy.eyebrows {
  font-size: clamp(.94rem, 1.35vw, 1.1rem);
  font-weight: 450;
  line-height: 1.65;
  letter-spacing: .025em;
  color: #adcbd7;
}
