*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --bg:      #f4f2ee;
      --fg:      #0a0a0a;
      --muted:   #e7e4dd;
      --muted-fg:#6b6862;
      --primary: #ff5a1f;
      --border:  #0a0a0a;
      --sq:      25px;
    }
    html { scroll-behavior: smooth; }
    body {
      background: var(--bg);
      color: var(--fg);
      font-family: 'Geologica', sans-serif;
      -webkit-font-smoothing: antialiased;
      min-height: 100vh;
    }
    ::selection { background: var(--primary); color: #fff; }
    a { color: inherit; text-decoration: none; }
    img { display: block; max-width: 100%; }
    * { scrollbar-width: thin; scrollbar-color: transparent transparent; }
    *:hover { scrollbar-color: var(--muted-fg) transparent; }

    /* ── NAV ─────────────────────────────────────────── */
    #site-nav {
      position: sticky; top: 0; z-index: 50;
      background: rgba(244,242,238,.92);
      backdrop-filter: blur(8px);
      border-bottom: 1px solid var(--border);
    }
    .nav-inner {
      max-width: 1400px; margin-inline: auto;
      padding: 1rem 1.25rem;
      display: flex; align-items: center; justify-content: space-between;
    }
    .nav-logo { display: flex; align-items: center; gap: .625rem; }
    .nav-logo .box {
      width: 3.25rem; height: 3.25rem;
      display: grid; place-items: center;
      flex-shrink: 0;
    }
    .nav-logo .box svg { width: 100%; height: 100%; }
    .nav-logo .name { font-family: 'Geologica', sans-serif; font-size: 1.75rem; font-weight: 700; letter-spacing: -.02em; text-transform: uppercase; color: var(--primary); }
    .nav-links { display: flex; gap: 2rem; }
    .nav-links a {
      font-family: 'Geologica', sans-serif; font-size: .6875rem;
      text-transform: uppercase; letter-spacing: .12em;
      color: var(--muted-fg); transition: color .2s;
    }
    .nav-links a:hover { color: var(--fg); }
    .nav-cta {
      font-family: 'Geologica', sans-serif; font-size: .6875rem;
      text-transform: uppercase; letter-spacing: .12em;
      border: 1px solid var(--fg); padding: .5rem 1rem;
      border-radius: var(--sq);
      transition: background .2s, color .2s, border-color .2s, transform .15s ease, filter .15s ease;
    }
    .nav-cta:hover { background: var(--primary); border-color: var(--primary); color: #fff; }
    .nav-burger {
      display: none; width: 2.25rem; height: 2.25rem;
      border: 1px solid var(--fg); background: none; cursor: pointer;
      font-family: 'Geologica', sans-serif; font-size: 1.1rem;
      place-items: center; border-radius: var(--sq);
    }
    #nav-mobile { display: none; border-top: 1px solid var(--border); }
    #nav-mobile a {
      display: block; border-bottom: 1px solid var(--border);
      padding: 1rem 1.25rem;
      font-family: 'Geologica', sans-serif; font-size: .6875rem;
      text-transform: uppercase; letter-spacing: .12em;
    }
    #nav-mobile .mob-cta { background: var(--primary); color: #fff; }
    #nav-mobile.open { display: block; }

    /* ── HERO ────────────────────────────────────────── */
    #top { border-bottom: 1px solid var(--border); overflow: hidden; }
    .hero-wrap { max-width: 1400px; margin-inline: auto; display: grid; grid-template-columns: 1fr; position: relative; }
    .hero-left { padding: 3.5rem 1.25rem; }
    .hero-eyebrow {
      display: flex; align-items: center; gap: .75rem;
      font-family: 'Geologica', sans-serif; font-size: .6875rem;
      text-transform: uppercase; letter-spacing: .12em;
      color: var(--muted-fg); margin-bottom: 2rem;
    }
    .hero-eyebrow .dot { width: .5rem; height: .5rem; background: var(--primary); flex-shrink: 0; }
    h1.hero-title {
      font-family: 'Momo Trust Display', 'Archivo', sans-serif; font-weight: 900;
      font-size: clamp(3.5rem, 13vw, 6rem);
      text-transform: uppercase; line-height: .86; letter-spacing: -.02em;
    }
    h1.hero-title .accent { color: var(--primary); display: block; padding-top: .3em; }
    .hero-sub { margin-top: 2rem; max-width: 36rem; font-size: 1.125rem; line-height: 1.65; color: var(--muted-fg); }
    .hero-actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.5rem; align-items: flex-start; }
    .btn-dark {
      background: var(--fg); color: var(--bg);
      padding: 1rem 1.75rem;
      font-family: 'Geologica', sans-serif; font-size: .6875rem;
      text-transform: uppercase; letter-spacing: .12em;
      border-radius: var(--sq);
      transition: background .2s, transform .15s ease, filter .15s ease;
    }
    .btn-dark:hover { background: var(--primary); }
    .btn-outline {
      border: 1px solid var(--fg); padding: 1rem 1.75rem;
      font-family: 'Geologica', sans-serif; font-size: .6875rem;
      text-transform: uppercase; letter-spacing: .12em;
      border-radius: var(--sq);
      transition: background .2s, transform .15s ease, filter .15s ease;
    }
    .btn-outline:hover { background: var(--muted); }
    .hero-terminal {
      background: var(--fg); color: var(--bg);
      padding: 1.5rem 1.5rem 1.5rem 7.5rem;
      display: flex; flex-direction: column;
      clip-path: polygon(150px 0%, 100% 0%, 100% 100%, 0% 100%);
      overflow: hidden;
      position: absolute; top: 0; right: 0; bottom: 0;
      width: calc(33.33% + 8rem);
    }
    .term-scroll-outer {
      flex: 1; overflow: hidden; min-height: 0;
      display: flex; align-items: stretch;
      padding-left: 2.5rem;
    }
    .term-scroll-wrap {
      flex: 1; min-height: 0;
      transform: skewX(-11deg);
      transform-origin: center center;
      mask-image: linear-gradient(to bottom, transparent 0%, black 10%, black 90%, transparent 100%);
      -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 10%, black 90%, transparent 100%);
    }
    .term-scroll {
      display: block;
      animation: term-down 18s linear infinite;
    }
    @keyframes term-down {
      0%   { transform: translateY(-50%); }
      100% { transform: translateY(0%); }
    }
    .term-scroll pre {
      font-family: 'JetBrains Mono', monospace;
      font-size: .75rem; line-height: 1.9;
      color: var(--primary);
      white-space: pre; margin: 0;
    }
    .term-blink {
      display: inline-block; width: 8px; height: 1em;
      background: var(--primary); vertical-align: middle;
      animation: blink 1s step-end infinite;
    }
    @keyframes blink { 50% { opacity: 0; } }

    /* ── MARQUEE ─────────────────────────────────────── */
    #marquee { overflow: hidden; border-bottom: 1px solid var(--border); background: var(--primary); color: #fff; }
    .mq-track {
      display: flex; width: max-content; white-space: nowrap;
      animation: marquee 30s linear infinite; padding-block: .875rem;
    }
    @keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
    .mq-item {
      display: flex; align-items: center;
      font-family: 'Geologica', sans-serif; font-size: .6875rem;
      text-transform: uppercase; letter-spacing: .12em;
    }
    .mq-item span { padding-inline: 1.5rem; }
    .mq-sep { display: inline-flex; align-items: center; opacity: .7; }

    /* ── SECTION HEADER ──────────────────────────────── */
    .sec-head {
      max-width: 1400px; margin-inline: auto; padding-inline: 1.25rem;
      display: flex; flex-direction: column; gap: 1.5rem;
      padding-block: 3rem;
    }
    .sec-tag {
      font-family: 'Geologica', sans-serif; font-size: .6875rem;
      text-transform: uppercase; letter-spacing: .12em; color: var(--primary);
    }
    .sec-head h2, .sec-head-dark h2 {
      font-family: 'Momo Trust Display', 'Archivo', sans-serif; font-weight: 900;
      font-size: clamp(2rem, 5vw, 3.75rem);
      text-transform: uppercase; line-height: 1.05; letter-spacing: -.02em;
      margin-top: .75rem;
    }
    .sec-head p { max-width: 22rem; color: var(--muted-fg); }

    /* ── SERVICES ────────────────────────────────────── */
    #servizi { border-bottom: 1px solid var(--border); padding-bottom: 2rem; }
    .svc-grid {
      max-width: 1400px; margin-inline: auto; padding-inline: 1.25rem;
      display: grid; grid-template-columns: 1fr;
      gap: 8px; background: transparent;
    }
    .svc-card {
      display: flex; flex-direction: column; gap: 1.25rem;
      background: var(--bg); padding: 2rem 2.5rem;
      border-radius: var(--sq);
      border: 1.5px solid var(--border);
      transition: background .2s, color .2s, border-color .2s; cursor: pointer;
    }
    .svc-card:hover { background: var(--fg); color: var(--bg); border-color: var(--fg); }
    .svc-top { display: flex; align-items: center; justify-content: space-between; }
    .svc-id { font-family: 'Geologica', sans-serif; font-size: .875rem; color: var(--muted-fg); }
    .svc-card:hover .svc-id { color: rgba(255,255,255,.45); }
    .svc-arr { display: none; }
    .svc-card h3 { font-family: 'Momo Trust Display', 'Archivo', sans-serif; font-size: 1.5rem; font-weight: 700; line-height: 1.15; }
    .svc-card p { font-size: .875rem; line-height: 1.65; color: var(--muted-fg); transition: color .2s; }
    .svc-card:hover p { color: rgba(255,255,255,.65); }
    .svc-tags { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: auto; padding-top: .5rem; }
    .svc-tag {
      border: 1px solid rgba(107,104,98,.35); padding: .25rem .625rem;
      font-family: 'Geologica', sans-serif; font-size: .625rem;
      text-transform: uppercase; letter-spacing: .1em; color: var(--muted-fg);
      border-radius: calc(var(--sq) * 0.6);
      transition: border-color .2s, color .2s;
    }
    .svc-card:hover .svc-tag { border-color: var(--primary); color: var(--primary); }

    /* ── PROCESS ─────────────────────────────────────── */
    #metodo { border-bottom: 1px solid var(--border); background: var(--fg); color: var(--bg); padding-bottom: 2rem; }
    .proc-head {
      max-width: 1400px; margin-inline: auto; padding-inline: 1.25rem;
      padding-block: 3rem;
    }
    .proc-head h2 {
      font-family: 'Momo Trust Display', 'Archivo', sans-serif; font-weight: 900;
      font-size: clamp(2rem, 5vw, 3.75rem);
      text-transform: uppercase; line-height: 1.05; letter-spacing: -.02em; margin-top: .75rem;
    }
    .proc-grid {
      max-width: 1400px; margin-inline: auto; padding-inline: 1.25rem;
      display: grid; grid-template-columns: 1fr;
      gap: 8px; background: transparent;
    }
    .proc-step { background: var(--fg); padding: 2rem 2.5rem; border-radius: var(--sq); border: 1.5px solid rgba(255,255,255,.18); position: relative; overflow: hidden; }
    .proc-step::before {
  content: '';
  position: absolute; 
  inset: 0;
  background-size: cover; 
  background-position: center;
  opacity: 0; /* Invisibile di default, come vuoi tu */
  border-radius: inherit;
  pointer-events: none;
  transition: opacity 0.3s ease; /* Effetto morbido quando appare */}
    .proc-step:hover::before { opacity: .22; }
    .proc-step > * { position: relative; z-index: 1; }
    .proc-step.img-1::before { background-image: url('./assets/pexels-renan-almeida-3218109-13495866-BnFpF5iA.jpg'); opacity: 0; }
    .proc-step.img-1:hover::before { opacity: .32; }
    .proc-step.img-2::before { background-image: url('./assets/pexels-grovebrands-15764095-BTazwFNG.jpg'); }
    .proc-step.img-3::before { background-image: url('./assets/pexels-pixabay-256502-DmQd2TJy.jpg'); opacity: 0; }
    .proc-step.img-3:hover::before { opacity: .38; }
    .proc-step.img-4::before { background-image: url('./assets/pexels-toulouse-3195784-CNR9XegN.jpg'); }
    .step-n {
      font-family: 'Geologica', sans-serif; font-size: 3.75rem; font-weight: 700;
      color: rgba(255,255,255,.12); margin-bottom: 2rem; transition: color .2s;
    }
    .proc-step:hover .step-n { color: var(--primary); }
    .proc-step h3 { font-family: 'Momo Trust Display', 'Archivo', sans-serif; font-size: 1.25rem; font-weight: 700; margin-bottom: .75rem; }
    .proc-step p { font-size: .875rem; line-height: 1.65; color: rgba(255,255,255,.55); }

    /* ── WEBDEV ──────────────────────────────────────── */
    #web { border-bottom: 1px solid var(--border); }
    .wd-wrap { max-width: 1400px; margin-inline: auto; display: grid; grid-template-columns: 1fr; }
    .wd-left { border-bottom: 1px solid var(--border); }
    .tiers-wrap { padding: 1.25rem; }
    .wd-copy { padding: 3rem 1.25rem; }
    .wd-copy h2 {
      font-family: 'Momo Trust Display', 'Archivo', sans-serif; font-weight: 900;
      font-size: clamp(2rem, 4vw, 3.25rem);
      text-transform: uppercase; line-height: 1.05; letter-spacing: -.02em; margin-top: .75rem;
    }
    .wd-copy p { margin-top: 1.5rem; max-width: 28rem; color: var(--muted-fg); }
    .wd-img { position: relative; overflow: hidden; background: var(--fg); aspect-ratio: 4/3; }
    .wd-img img { width: 100%; height: 100%; object-fit: cover; opacity: .8; filter: grayscale(1); mix-blend-mode: luminosity; transition: opacity .5s, filter .5s; }
    .wd-img:hover img { opacity: 1; filter: none; }
    .wd-img .ov { pointer-events: none; position: absolute; inset: 0; background: rgba(255,90,31,.1); }
    .wd-img .lbl {
      position: absolute; bottom: 1rem; left: 1rem;
      background: var(--bg); padding: .375rem .75rem;
      font-family: 'Geologica', sans-serif; font-size: .625rem;
      text-transform: uppercase; letter-spacing: .1em;
      border-radius: calc(var(--sq) * 0.6);
    }
    .tiers { display: grid; grid-template-columns: 1fr; gap: 8px; background: transparent; }
    .tier { display: flex; flex-direction: column; padding: 2rem 2.5rem; background: var(--bg); border-radius: var(--sq); border: 1.5px solid var(--border); }
    .tier.hot { background: var(--primary); color: #fff; border-color: var(--primary); }
    .tier-lbl { font-family: 'Geologica', sans-serif; font-size: .625rem; text-transform: uppercase; letter-spacing: .1em; opacity: .65; margin-bottom: .25rem; }
    .tier h3 { font-family: 'Momo Trust Display', 'Archivo', sans-serif; font-size: 1.5rem; font-weight: 900; text-transform: uppercase; margin-bottom: 1rem; }
    .tier p { font-size: .875rem; line-height: 1.65; margin-bottom: 1.5rem; color: var(--muted-fg); }
    .tier.hot p { color: rgba(255,255,255,.82); }
    .tier ul { list-style: none; margin-top: auto; display: flex; flex-direction: column; gap: .5rem; }
    .tier li { display: flex; align-items: center; gap: .5rem; font-family: 'Geologica', sans-serif; font-size: .75rem; }
    .tier li .plus { color: var(--primary); }
    .tier.hot li .plus { color: #fff; }

    /* ── INFRASTRUTTURA ──────────────────────────────── */
    #infrastruttura { border-bottom: 1px solid var(--border); padding-bottom: 2rem; }
    .infra-grid {
      max-width: 1400px; margin-inline: auto; padding-inline: 1.25rem;
      display: grid; grid-template-columns: 1fr;
      gap: 8px; background: transparent;
    }
    .infra-card {
      display: flex; flex-direction: column;
      background: var(--bg); padding: 2rem 2.5rem;
      border-radius: var(--sq);
      border: 1.5px solid var(--border);
      position: relative; overflow: hidden;
      cursor: default;
    }
    /* spotlight dot pattern */
    .infra-card::before {
      content: '';
      position: absolute; inset: -1px;
      background-image: radial-gradient(circle, var(--primary) 1.5px, transparent 1.5px);
      background-size: 20px 20px;
      border-radius: inherit;
      opacity: 0;
      pointer-events: none;
      transition: opacity .25s ease;
      -webkit-mask-image: radial-gradient(circle 160px at var(--mx, -999px) var(--my, -999px), black 0%, black 30%, transparent 80%);
      mask-image: radial-gradient(circle 160px at var(--mx, -999px) var(--my, -999px), black 0%, black 30%, transparent 80%);
    }
    .infra-card:hover::before { opacity: 1; }
    .infra-card > * { position: relative; z-index: 1; }
    .infra-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2rem; }
    .infra-lbl { font-family: 'Geologica', sans-serif; font-size: .6875rem; text-transform: uppercase; letter-spacing: .12em; color: var(--primary); }
    .bars { display: flex; align-items: flex-end; gap: .25rem; height: 2rem; }
    .bars span { width: .375rem; background: rgba(255,90,31,.28); }
    .infra-card h3 { font-family: 'Momo Trust Display', 'Archivo', sans-serif; font-size: 1.5rem; font-weight: 700; margin-bottom: .75rem; line-height: 1.15; }
    .infra-card p { font-size: .875rem; line-height: 1.65; color: var(--muted-fg); margin-bottom: 2rem; }
    .infra-metric { border-top: 1px solid rgba(107,104,98,.25); padding-top: 1.25rem; margin-top: auto; }
    .infra-val { font-family: 'Geologica', sans-serif; font-size: 2.5rem; font-weight: 700; letter-spacing: -.02em; color: var(--primary); }
    .infra-meta { font-family: 'Geologica', sans-serif; font-size: .625rem; text-transform: uppercase; letter-spacing: .1em; color: var(--muted-fg); margin-top: .25rem; }

    /* ── CONTACT ─────────────────────────────────────── */
    #contatti { border-bottom: 1px solid var(--border); background: var(--fg); color: var(--bg); }
    .ct-wrap { max-width: 1400px; margin-inline: auto; display: grid; grid-template-columns: 1fr; }
    .ct-left { padding: 2rem 1.25rem; border-bottom: 1px solid rgba(255,255,255,.18); }
    .ct-left h2 {
      font-family: 'Momo Trust Display', 'Archivo', sans-serif; font-weight: 900;
      font-size: clamp(2rem, 5vw, 3.75rem);
      text-transform: uppercase; line-height: 1.05; letter-spacing: -.02em; margin-top: .75rem;
    }
    .ct-left p { margin-top: 1.5rem; max-width: 28rem; color: rgba(255,255,255,.55); }
    .ct-info { margin-top: 2.5rem; display: flex; flex-direction: column; gap: .75rem; font-family: 'Geologica', sans-serif; font-size: .875rem; }
    .ct-info a:hover { color: var(--primary); }
    .ct-info .dim { color: rgba(255,255,255,.45); }
    .ct-right { padding: 2rem 1.25rem; }
    .fg { margin-bottom: 1.5rem; }
    .fg label {
      display: block; margin-bottom: .5rem;
      font-family: 'Geologica', sans-serif; font-size: .625rem;
      text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.45);
    }
    .fg input, .fg textarea {
      width: 100%; background: rgba(255,255,255,.06);
      border: 1px solid rgba(255,255,255,.2);
      color: var(--bg); padding: .5rem .75rem; outline: none;
      font-family: 'Geologica', sans-serif; font-size: 1rem; transition: border-color .2s;
      border-radius: calc(var(--sq) * 0.7);
    }
    .fg input::placeholder, .fg textarea::placeholder { color: rgba(255,255,255,.25); }
    .fg input:focus, .fg textarea:focus { border-color: var(--primary); background: rgba(255,90,31,.07); }
    .fg textarea { resize: none; }
    .btn-send {
      width: 100%; background: var(--primary); color: #fff;
      border: none; cursor: pointer; padding: 1rem 1.75rem;
      font-family: 'Geologica', sans-serif; font-size: .6875rem;
      text-transform: uppercase; letter-spacing: .12em;
      border-radius: var(--sq);
      transition: opacity .2s, transform .15s ease, filter .15s ease;
    }
    .btn-send:hover { opacity: .88; }
    #form-ok { display: none; flex-direction: column; gap: 1rem; }
    #form-ok .ok-tag { font-family: 'Geologica', sans-serif; font-size: .6875rem; text-transform: uppercase; letter-spacing: .12em; color: var(--primary); }
    #form-ok p { font-family: 'Geologica', sans-serif; font-size: 1.5rem; font-weight: 700; }

    /* ── FOOTER ──────────────────────────────────────── */
    footer {
      max-width: 1400px; margin-inline: auto;
      padding: 2.5rem 1.25rem;
      display: flex; flex-direction: column; gap: 1.5rem;
    }
    .ft-logo { display: flex; align-items: center; gap: .625rem; }
    .ft-logo .box {
      width: 1.75rem; height: 1.75rem; background: var(--fg); color: var(--bg);
      display: grid; place-items: center;
      font-family: 'Geologica', sans-serif; font-weight: 700; font-size: .75rem;
      border-radius: calc(var(--sq) * 0.5);
    }
    .ft-logo .name { font-family: 'Geologica', sans-serif; font-size: 1rem; font-weight: 700; letter-spacing: -.02em; }
    .ft-mid, .ft-copy {
      font-family: 'Geologica', sans-serif; font-size: .6875rem;
      text-transform: uppercase; letter-spacing: .12em; color: var(--muted-fg);
    }

    /* ── PRESS FEEDBACK ─────────────────────────────── */
    .btn-dark:active,
    .btn-outline:active,
    .nav-cta:active,
    .btn-send:active,
    .nav-burger:active {
      transform: scale(.95);
      filter: brightness(.88);
      transition: transform .08s ease, filter .08s ease;
    }
    .svc-card:active {
      transform: scale(.985);
      filter: brightness(.94);
      transition: transform .08s ease, filter .08s ease;
    }

    /* ── RESPONSIVE ──────────────────────────────────── */
    @media (max-width: 767px) {
      .svc-grid, .proc-grid, .infra-grid, .tiers {
        display: flex; flex-direction: row;
        overflow-x: scroll; scroll-snap-type: x mandatory;
        padding-inline: 1.25rem; gap: 12px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
      }
      .svc-grid::-webkit-scrollbar,
      .proc-grid::-webkit-scrollbar,
      .infra-grid::-webkit-scrollbar,
      .tiers::-webkit-scrollbar { display: none; width: 0; height: 0; }
      .svc-card, .proc-step, .infra-card, .tier {
        flex: 0 0 80vw; scroll-snap-align: start;
      }
      .tiers-wrap { padding: 1.25rem; }
    }
    @media (max-width: 1023px) {
      .hero-terminal { display: none; }
      h1.hero-title { font-size: clamp(2.2rem, 9vw, 3.5rem); text-align: center; }
      h1.hero-title .accent { font-size: clamp(2.4rem, 10vw, 5rem); }
      .hero-left { text-align: center; display: flex; flex-direction: column; }
      .hero-eyebrow { justify-content: center; }
      .hero-actions { justify-content: center; order: 3; }
      .hero-sub { order: 4; font-size: .875rem; margin-top: 1.25rem; text-align: center; margin-inline: auto; }
      .sec-head, .sec-head > div, .sec-head p { text-align: center; align-items: center; }
      .sec-head { flex-direction: column; align-items: center; }
      .proc-head { text-align: center; }
      .wd-copy { text-align: center; }
      .wd-copy p { margin-inline: auto; }
      .ct-left { text-align: center; }
      .ct-left p { margin-inline: auto; }
      .ct-info { align-items: center; }
    }
    @media (min-width: 768px) {
      .nav-inner { padding-inline: 2rem; }
      .sec-head { padding-inline: 2rem; flex-direction: row; align-items: flex-end; justify-content: space-between; }
      .svc-grid { padding-inline: 2rem; grid-template-columns: 1fr 1fr; }
      .proc-head { padding-inline: 2rem; }
      .proc-grid { padding-inline: 2rem; grid-template-columns: 1fr 1fr; }
      .infra-grid { padding-inline: 2rem; grid-template-columns: 1fr 1fr 1fr; }
      .tiers { grid-template-columns: 1fr 1fr 1fr; }
      .tiers-wrap { padding: 2rem; }
      .hero-left { padding: 6rem 2rem; }
      .wd-copy { padding: 3rem 2rem; }
      .ct-left { padding: 3.5rem 2rem; }
      .ct-right { padding: 3.5rem 2rem; }
      footer { flex-direction: row; align-items: center; justify-content: space-between; padding-inline: 2rem; }
    }
    @media (min-width: 1400px) {
      .hero-terminal {
        right: calc(-1 * (100vw - 1400px) / 2);
        width: calc(33.33% + 8rem + (100vw - 1400px) / 2);
      }
    }
    @media (min-width: 1024px) {
      .hero-wrap { grid-template-columns: 8fr 4fr; }
      .hero-left { border-bottom: none; border-right: none; }
      .svc-grid { grid-template-columns: 1fr 1fr 1fr; }
      .proc-grid { grid-template-columns: repeat(4,1fr); }
      .wd-wrap { grid-template-columns: 5fr 7fr; }
      .wd-left { border-bottom: none; border-right: 1px solid var(--border); }
      .wd-img { aspect-ratio: auto; height: 340px; }
      .ct-wrap { grid-template-columns: 1fr 1fr; }
      .ct-left { border-bottom: none; border-right: 1px solid rgba(255,255,255,.18); }
    }
    @media (max-width: 767px) {
      html, body { overflow-x: hidden; max-width: 100%; }
      #site-nav, #top, #marquee, #contatti, footer { overflow-x: clip; }
      * { min-width: 0; }
      .nav-links, .nav-cta, .nav-burger, .nav-logo .name { display: none; }
      #nav-mobile { display: none !important; }
      .nav-inner { justify-content: center; padding-top: calc(3.5rem + env(safe-area-inset-top, 32px)); }
    }