/* Veox Corporate — local fonts, no external dependencies. */
@font-face {
  font-family:Manrope;
  src:url('../fonts/manrope-400.ttf') format('truetype');
  font-weight:400;
  font-display:swap
}
/* Hero finale: fotografia a destra e offerta leggibile in sovrapposizione */
.hero-art.vx-offer {
  display:block;
  position:relative;
  min-height:650px;
  padding:0;
  overflow:hidden;
  background:#c7ddd5
}
.hero-art.vx-offer .hero-parallax {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:hidden
}
.vx-person-image {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:52% center;
  animation:vx-photo-zoom 18s ease-in-out infinite alternate
}
.hero-art.vx-offer .hero-parallax:after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,#062f3420 20%,#062f3470 100%),linear-gradient(90deg,transparent 35%,#083b3845 100%);
  pointer-events:none
}
.vx-image-caption {
  position:absolute;
  top:28px;
  left:28px;
  z-index:2;
  color:white;
  text-shadow:0 2px 12px #0b292988
}
.vx-image-caption span {
  display:block;
  width:max-content;
  max-width:100%;
  padding:7px 12px;
  border:1px solid #ffffff5c;
  border-radius:30px;
  background:#123c3c80;
  backdrop-filter:blur(8px);
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase
}
.vx-image-caption strong {
  display:block;
  margin-top:18px;
  font-size:31px;
  line-height:1.04;
  letter-spacing:-.05em
}
.hero-art.vx-offer .vx-price-card {
  position:absolute;
  z-index:3;
  right:24px;
  bottom:24px;
  width:min(390px,calc(100% - 48px));
  padding:23px 25px;
  background:#fffffff5;
  box-shadow:0 18px 55px #082b302b
}
.hero-art.vx-offer .vx-price-card h2 {
  font-size:25px
}
.hero-art.vx-offer .vx-price {
  margin:9px 0 12px
}
.hero-art.vx-offer .vx-price>strong {
  font-size:62px
}
.hero-art.vx-offer .vx-benefits {
  margin:16px 0;
  gap:7px 13px
}
.hero-art.vx-offer .motion-control {
  z-index:4;
  top:24px;
  right:24px;
  bottom:auto
}
.hero.motion-paused .vx-person-image {
  animation-play-state:paused
}
@keyframes vx-photo-zoom {
  from {
    transform:scale(1)
  }
  to {
    transform:scale(1.06) translateY(-.5%)
  }
}
@media(max-width:800px) {
  .hero-art.vx-offer {
    min-height:650px
  }
  .hero-art.vx-offer .vx-price-card {
    right:18px;
    bottom:18px;
    width:calc(100% - 36px)
  }
  .vx-image-caption {
    top:22px;
    left:22px
  }
  .vx-image-caption strong {
    font-size:27px
  }
}
@media(max-width:480px) {
  .hero-art.vx-offer {
    min-height:560px
  }
  .hero-art.vx-offer .vx-price-card {
    padding:18px 17px
  }
  .hero-art.vx-offer .vx-price-card h2 {
    font-size:21px
  }
  .hero-art.vx-offer .vx-price>strong {
    font-size:52px
  }
  .hero-art.vx-offer .vx-benefits {
    font-size:10px
  }
  .vx-image-caption strong {
    font-size:22px
  }
  .hero-art.vx-offer .motion-control {
    top:18px;
    right:18px;
    font-size:8px
  }
}
@font-face {
  font-family:Manrope;
  src:url('../fonts/manrope-600.ttf') format('truetype');
  font-weight:600;
  font-display:swap
}
@font-face {
  font-family:Manrope;
  src:url('../fonts/manrope-800.ttf') format('truetype');
  font-weight:800;
  font-display:swap
}
:root {
  --ink:#112c30;
  --muted:#5d6e70;
  --paper:#ecf1f1;
  --white:#fff;
  --teal:#187f7b;
  --bright:#57c6b6;
  --dark:#0c252a;
  --line:#d5dfdf;
  --radius:15px;
  --font:'Manrope',Arial,sans-serif
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:118px
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font);
  font-size:15px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased
}
::selection {
  background:#b2e4d9;
  color:var(--dark)
}
button,input,select,textarea {
  font:inherit
}
button,a {
  -webkit-tap-highlight-color:transparent
}
button {
  cursor:pointer
}
button[hidden],[hidden] {
  display:none!important
}
a {
  color:inherit;
  text-decoration:none
}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible {
  outline:3px solid #dfa338;
  outline-offset:5px
}
img {
  display:block;
  width:100%;
  height:auto
}
svg {
  width:24px;
  height:24px;
  flex-shrink:0
}
.icon {
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round
}
h1,h2,h3,p {
  margin:0
}
h1,h2,h3 {
  font-weight:600;
  line-height:1.17;
  letter-spacing:-.045em
}
h2 {
  font-size:clamp(33px,3.35vw,48px)
}
h2>span {
  color:var(--teal)
}
h3 {
  font-size:23px;
  letter-spacing:-.035em
}
p {
  color:var(--muted)
}
.wrap {
  width:min(1260px,calc(100% - 96px));
  margin-inline:auto
}
.section {
  padding-block:105px
}
.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:45px;
  margin-bottom:44px
}
.section-heading .eyebrow {
  margin-bottom:21px
}
.section-heading>p {
  max-width:350px;
  margin-bottom:3px
}
.section-heading.center {
  display:block;
  text-align:center;
  max-width:750px;
  margin-inline:auto;
  margin-bottom:44px
}
.eyebrow {
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:3px 9px;
  border:1px dashed #bbcaca;
  font-size:11px;
  line-height:1.5;
  letter-spacing:.08em;
  font-weight:800;
  text-transform:uppercase
}
.eyebrow>span {
  color:var(--teal);
  font-size:20px;
  font-weight:400;
  line-height:1
}
.skip-link {
  position:fixed;
  top:10px;
  left:24px;
  background:white;
  padding:12px 20px;
  z-index:100;
  transform:translateY(-160%)
}
.skip-link:focus {
  transform:none
}
.site-header {
  position:sticky;
  top:0;
  z-index:30;
  background:var(--paper);
  padding:0 18px 14px
}
.header-inner {
  height:96px;
  border-radius:0 0 var(--radius) var(--radius);
  background:white;
  padding:0 34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px
}
.logo {
  display:flex;
  align-items:center;
  gap:7px;
  line-height:1;
  flex-shrink:0
}
.logo>span {
  font-size:39px;
  letter-spacing:-.08em;
  font-weight:600
}
.logo .brand-mark {
  width:36px;
  height:36px;
  color:var(--teal)
}
.desktop-nav {
  display:flex;
  align-items:center;
  gap:27px
}
.nav-link,.dropdown-toggle {
  font-size:14px;
  font-weight:600;
  padding:17px 0;
  white-space:nowrap;
  transition:color .2s
}
.nav-link:hover,.dropdown-toggle:hover,.nav-link[aria-current=page],.dropdown-toggle.active {
  color:var(--teal)
}
.dropdown-toggle {
  border:0;
  background:transparent;
  color:inherit;
  display:flex;
  align-items:center;
  gap:6px
}
.dropdown-toggle .chevron {
  width:13px;
  height:13px;
  transition:transform .2s
}
.dropdown-toggle[aria-expanded=true] .chevron {
  transform:rotate(180deg)
}
.nav-item {
  position:relative
}
.dropdown {
  position:absolute;
  left:-22px;
  top:calc(100% + 7px);
  min-width:265px;
  background:white;
  padding:12px;
  border-radius:12px;
  box-shadow:0 20px 60px #09272b25;
  border:1px solid var(--line)
}
.dropdown>a {
  display:block;
  padding:10px 12px;
  font-size:13px;
  border-radius:6px;
  line-height:1.5
}
.dropdown>a:hover,.dropdown>a[aria-current=page] {
  background:var(--paper);
  color:var(--teal)
}
.dropdown .menu-overview {
  color:var(--teal);
  font-weight:800;
  border-bottom:1px solid var(--line);
  margin-bottom:6px;
  border-radius:0
}
.mobile-nav-meta {
  display:none
}
.mobile-toggle {
  display:none;
  border:0;
  background:var(--paper);
  border-radius:50%;
  width:44px;
  height:44px;
  align-items:center;
  justify-content:center;
  color:var(--ink)
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:19px;
  padding:7px 7px 7px 22px;
  background:var(--teal);
  color:white;
  border:1px solid transparent;
  border-radius:100px;
  font-weight:600;
  font-size:13px;
  line-height:1.4;
  transition:background .2s,transform .2s;
  max-width:100%;
  cursor:pointer
}
.button:hover {
  background:#0c6461;
  transform:translateY(-2px)
}
.button-icon {
  display:flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:50%;
  background:white;
  color:var(--teal);
  flex-shrink:0
}
.button-icon svg {
  width:19px;
  height:19px;
  transition:transform .2s
}
.button:hover .button-icon svg {
  transform:rotate(45deg)
}
.button.white {
  background:white;
  color:var(--ink)
}
.button.white .button-icon {
  background:var(--teal);
  color:white
}
.button.white:hover {
  background:#e2f2ee
}
.button.light {
  background:#dce9e7;
  color:var(--ink)
}
.button.light:hover {
  background:#cee0dd
}
.button.outline {
  border-color:#486063;
  background:transparent
}
.circle-link {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line);
  border-radius:50%;
  width:42px;
  height:42px;
  flex-shrink:0;
  transition:background .2s,color .2s
}
.circle-link:hover {
  background:var(--teal);
  border-color:var(--teal);
  color:white
}
.circle-link svg {
  width:20px;
  height:20px
}
.text-link {
  display:inline-flex;
  align-items:center;
  gap:16px;
  font-size:13px;
  font-weight:800
}
.text-link svg {
  width:20px;
  height:20px
}
.text-link:hover {
  color:var(--teal)
}
.hero {
  margin:0 18px;
  display:grid;
  grid-template-columns:1.08fr 1fr;
  gap:16px;
  min-height:650px
}
.hero-copy {
  position:relative;
  background:var(--dark);
  color:white;
  border-radius:var(--radius);
  padding:65px clamp(35px,4.5vw,70px) 43px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  isolation:isolate
}
.hero-copy:before {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  background:radial-gradient(ellipse at 75% 10%,#175856a1,transparent 70%),repeating-linear-gradient(65deg,transparent 0 15px,#61968e0a 16px 17px);
  pointer-events:none
}
.hero-copy .eyebrow {
  border-color:#456061;
  color:#e3eeeb
}
.hero-copy .eyebrow>span {
  color:var(--bright)
}
.hero h1 {
  font-size:clamp(44px,4.8vw,73px);
  line-height:1.1;
  letter-spacing:-.055em;
  margin:24px 0 24px;
  font-weight:400
}
.hero h1>span {
  color:var(--bright)
}
.hero-copy>p {
  font-size:15px;
  line-height:1.8;
  color:#c1cfce
}
.hero-bottom {
  width:100%;
  display:flex;
  align-items:center;
  gap:25px;
  border-top:1px dashed #58706f6e;
  margin-top:33px;
  padding-top:28px
}
.hero-secondary {
  font-size:12px;
  display:flex;
  align-items:center;
  gap:10px
}
.hero-secondary svg {
  width:20px;
  height:20px
}
.hero-secondary:hover {
  color:var(--bright)
}
.hero-index {
  font-size:9px;
  letter-spacing:.17em;
  color:#7ca49f;
  margin-top:30px
}
.hero-art {
  position:relative;
  border-radius:var(--radius);
  min-width:0;
  overflow:hidden;
  background:#ccd7d0;
  isolation:isolate
}
.hero-parallax {
  position:absolute;
  inset:-3%;
  transition:transform .8s ease-out
}
.hero-image {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 40%;
  animation:slow-zoom 18s ease-in-out infinite alternate
}
.hero-art:after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(0deg,#0a302846,transparent 45%);
  z-index:-0;
  pointer-events:none
}
.hero-photo-label {
  position:absolute;
  left:28px;
  top:28px;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:white;
  background:#183a347d;
  backdrop-filter:blur(8px);
  padding:7px 14px;
  border:1px solid #ffffff3d;
  border-radius:20px
}
.motion-control {
  position:absolute;
  right:18px;
  bottom:20px;
  z-index:2;
  border:1px solid #ffffff5c;
  background:#102f30b8;
  color:white;
  border-radius:30px;
  padding:9px 11px;
  display:flex;
  align-items:center;
  gap:6px;
  font-size:9px;
  backdrop-filter:blur(8px)
}
.motion-control svg {
  width:13px;
  height:13px
}
.hero-insight {
  position:absolute;
  left:0;
  bottom:0;
  background:white;
  padding:28px 25px;
  display:flex;
  align-items:center;
  gap:16px;
  border:13px solid var(--paper);
  border-left:0;
  border-bottom:0;
  border-radius:0 22px 0 0;
  z-index:1;
  max-width:75%;
  animation:card-float 7s ease-in-out infinite
}
.insight-icon {
  display:flex;
  width:47px;
  height:47px;
  align-items:center;
  justify-content:center;
  background:#e3f0ed;
  color:var(--teal);
  border-radius:50%;
  flex-shrink:0
}
.hero-insight strong {
  font-size:18px;
  line-height:1.35;
  display:block;
  letter-spacing:-.04em
}
.hero-insight div>span {
  font-size:10px;
  color:var(--muted);
  display:block;
  margin-top:6px
}
.hero-insight .circle-link {
  margin-left:5px;
  background:var(--teal);
  color:white;
  border:0
}
.hero.motion-paused .hero-image,.hero.motion-paused .hero-insight {
  animation-play-state:paused
}
@keyframes slow-zoom {
  from {
    transform:scale(1)
  }
  to {
    transform:scale(1.07) translateY(-.6%)
  }
}
@keyframes card-float {
  0%,100% {
    transform:translateY(0)
  }
  50% {
    transform:translateY(-7px)
  }
}
.sector-strip {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-bottom:1px solid var(--line);
  padding-block:28px;
  font-size:13px
}
.sector-strip>span {
  color:var(--muted);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.07em
}
.sector-strip>a {
  font-weight:600
}
.sector-strip>a:before {
  content:'✳';
  color:var(--teal);
  font-size:17px;
  margin-right:13px
}
.sector-strip>a:hover {
  color:var(--teal)
}
.value-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px
}
.value-card {
  padding:36px;
  background:white;
  border-radius:var(--radius)
}
.value-card>svg {
  width:47px;
  height:47px;
  color:var(--teal);
  stroke-width:1.3;
  margin-bottom:35px
}
.value-card h3 {
  margin-bottom:16px;
  font-size:23px
}
.value-card p {
  font-size:14px
}
.about-section {
  padding-top:15px
}
.about-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  align-items:center
}
.about-picture {
  position:relative;
  min-height:530px;
  align-self:stretch
}
.about-picture>img {
  height:100%;
  position:absolute;
  object-fit:cover;
  border-radius:var(--radius);
  object-position:43%
}
.about-badge {
  position:absolute;
  right:-1px;
  bottom:-1px;
  background:var(--paper);
  border:14px solid var(--paper);
  border-right:0;
  border-bottom:0;
  border-radius:22px 0 0 0;
  padding:14px 25px 18px;
  font-size:24px;
  line-height:1.3;
  letter-spacing:-.045em;
  min-width:265px
}
.about-badge>span {
  position:absolute;
  right:15px;
  top:-14px;
  transform:translateY(-100%);
  width:62px;
  height:62px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--teal);
  color:white;
  border:6px solid var(--paper)
}
.about-copy h2 {
  margin:22px 0
}
.about-copy>p {
  font-size:15px
}
.check-list {
  padding:0;
  margin:25px 0 32px;
  list-style:none;
  display:grid;
  gap:10px;
  font-size:13px;
  font-weight:600
}
.check-list li {
  display:flex;
  align-items:center;
  gap:12px
}
.check-list svg {
  color:var(--teal);
  width:20px;
  height:20px
}
.service-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px
}
.service-card {
  padding:30px;
  border-radius:var(--radius);
  border:1px solid #d1dddd;
  background:#f9fbfa;
  transition:background .25s,transform .25s
}
.service-card:hover {
  background:white;
  transform:translateY(-4px)
}
.card-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:34px
}
.card-top>svg {
  width:44px;
  height:44px;
  color:var(--teal);
  stroke-width:1.4
}
.card-top>span {
  font-size:13px;
  color:#849897
}
.service-card h3 {
  font-size:23px;
  margin-bottom:16px
}
.service-card p {
  font-size:13px;
  line-height:1.85;
  margin-bottom:25px
}
.dark-section {
  margin:0 18px;
  border-radius:var(--radius);
  background:var(--dark);
  color:white
}
.dark-section h2>span {
  color:var(--bright)
}
.dark-section .eyebrow {
  border-color:#466060;
  color:#e0ebe8
}
.dark-section .eyebrow>span {
  color:var(--bright)
}
.dark-section p {
  color:#aebfbd
}
.growth-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px
}
.growth-card {
  position:relative;
  min-height:275px;
  padding:26px 22px 70px;
  border:1px solid #385155;
  border-radius:12px;
  transition:background .2s
}
.growth-card:hover {
  background:#153b3c
}
.growth-card>svg {
  color:var(--bright);
  width:38px;
  height:38px;
  stroke-width:1.4;
  margin-bottom:26px
}
.growth-card h3 {
  font-size:20px;
  line-height:1.25;
  margin-bottom:12px
}
.growth-card p {
  font-size:13px;
  line-height:1.7
}
.growth-card .circle-link {
  position:absolute;
  bottom:20px;
  right:20px;
  width:38px;
  height:38px;
  border-color:#486464
}
.projects-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px
}
.project-media {
  aspect-ratio:1/1.14;
  position:relative;
  overflow:hidden;
  border-radius:var(--radius);
  background:#bad0c0
}
.project-media>img {
  height:100%;
  width:100%;
  object-fit:cover;
  transition:transform .6s
}
.project-card:hover .project-media>img {
  transform:scale(1.04)
}
.project-overlay {
  position:absolute;
  inset:0;
  padding:29px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  color:white;
  background:linear-gradient(180deg,#12181422 0%,transparent 45%,#15100e6b)
}
.project-overlay>strong {
  font-family:Georgia,serif;
  font-size:35px;
  font-weight:400;
  letter-spacing:.15em
}
.project-overlay>span {
  font-family:Georgia,serif;
  font-size:24px;
  font-style:italic;
  max-width:160px;
  line-height:1.2
}
.project-food .project-overlay>strong {
  letter-spacing:-.06em;
  font-size:40px;
  font-style:italic
}
.project-meta {
  padding:18px 0 0
}
.project-meta>span {
  font-size:10px;
  color:var(--muted)
}
.project-meta>div {
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin-top:8px
}
.project-meta h3 {
  font-size:23px
}
.project-meta h3 a:hover {
  color:var(--teal)
}
.clinic-layout {
  padding:26px;
  background:#9cbbac;
  display:flex;
  align-items:center
}
.clinic-preview {
  width:100%;
  background:#eef3e8;
  border-radius:7px;
  padding:24px 22px;
  color:#2b5543;
  box-shadow:0 15px 35px #294b4321;
  overflow:hidden
}
.clinic-nav {
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #bed0bc;
  padding-bottom:12px
}
.clinic-nav strong {
  font-size:31px;
  line-height:1;
  font-weight:600;
  letter-spacing:-.07em
}
.clinic-nav>span {
  font-size:7px
}
.clinic-preview h3 {
  font-family:Georgia,serif;
  font-size:32px;
  font-weight:400;
  line-height:1.07;
  margin-top:27px;
  letter-spacing:-.04em
}
.clinic-symbol {
  font-size:160px;
  font-weight:400;
  line-height:1;
  color:#8dac92;
  text-align:right;
  margin:-4px 0 -15px
}
.clinic-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:9px;
  line-height:1.5
}
.clinic-dot {
  background:#2b5543;
  color:white;
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  border-radius:50%
}
.section-tail {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:25px;
  margin-top:35px
}
.section-tail>p {
  font-size:12px
}
.white-section {
  background:white;
  margin:0 18px;
  border-radius:var(--radius)
}
.process-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:45px
}
.step-number {
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:var(--teal);
  font-size:40px;
  letter-spacing:-.05em;
  font-weight:400;
  border-bottom:1px dashed #b4cdca;
  padding-bottom:20px;
  margin-bottom:26px
}
.step-number>span {
  width:37px;
  height:37px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:50%
}
.step-number svg {
  width:18px;
  height:18px
}
.process-step h3 {
  font-size:22px;
  margin-bottom:15px
}
.process-step p {
  font-size:13px
}
.cta-shell {
  padding:65px 18px 0;
  background:var(--paper)
}
.cta {
  width:100%;
  max-width:unset;
  background:var(--teal);
  border-radius:var(--radius) var(--radius) 0 0;
  color:white;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:35px;
  padding:65px max(35px,calc((100vw - 1260px) / 2 - 18px));
  position:relative;
  overflow:hidden
}
.cta:after {
  content:'';
  position:absolute;
  right:17%;
  top:-200px;
  width:500px;
  height:500px;
  border:1px solid #ffffff12;
  border-radius:50%;
  box-shadow:0 0 0 50px #ffffff05,0 0 0 100px #ffffff05,0 0 0 150px #ffffff05;
  pointer-events:none
}
.cta .eyebrow {
  border-color:#87bdb6;
  color:white;
  margin-bottom:20px
}
.cta .eyebrow>span {
  color:#bdebe0
}
.cta h2 {
  font-size:clamp(29px,3.2vw,44px)
}
.cta h2>span {
  color:#bdebe0
}
.cta .button {
  flex-shrink:0;
  z-index:1
}
.site-footer {
  background:var(--dark);
  color:white;
  margin:0 18px 18px;
  border-radius:0 0 var(--radius) var(--radius)
}
.footer-main {
  display:grid;
  grid-template-columns:1.55fr .7fr 1.1fr 1fr;
  gap:40px;
  padding:70px 0 55px
}
.footer-brand .logo .brand-mark {
  color:var(--bright)
}
.footer-brand>p {
  font-size:13px;
  color:#acbfbd;
  margin:24px 0
}
.footer-col {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:9px
}
.footer-col>h3 {
  font-size:16px;
  letter-spacing:-.02em;
  margin:6px 0 16px
}
.footer-col>a {
  font-size:12px;
  line-height:1.8;
  color:#acbfbd
}
.footer-col>a:hover {
  color:white
}
.footer-bottom {
  border-top:1px solid #2c494b;
  display:flex;
  justify-content:space-between;
  gap:25px;
  padding:22px 0;
  color:#8ba7a3;
  font-size:10px
}
.footer-bottom>a {
  color:#b4c8c3
}
.page-banner {
  position:relative;
  isolation:isolate;
  margin:0 18px;
  background:var(--dark);
  border-radius:var(--radius);
  color:white;
  overflow:hidden;
  padding:58px 0 40px
}
.page-banner:before {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(100deg,var(--dark) 45%,#0c252aaf),url('../images/studio-process.webp') center 50%/cover
}
.page-banner .eyebrow {
  border-color:#557571;
  color:#d6e7e2;
  margin-bottom:20px
}
.page-banner .eyebrow>span {
  color:var(--bright)
}
.page-banner h1 {
  font-size:clamp(38px,4.6vw,66px);
  font-weight:400;
  max-width:950px;
  line-height:1.1;
  letter-spacing:-.05em;
  position:relative
}
.page-banner h1>span {
  color:var(--bright)
}
.page-banner p {
  color:#c0d0cb;
  font-size:14px;
  margin-top:20px;
  max-width:560px
}
.breadcrumb {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  font-size:11px;
  margin-top:33px;
  color:#c2d5d0;
  line-height:1.7
}
.breadcrumb>a {
  color:white
}
.breadcrumb>a:hover {
  color:var(--bright)
}
.banner-symbol {
  position:absolute;
  right:7%;
  top:17%;
  z-index:-1;
  color:#b9e7dd;
  opacity:.08;
  transform:rotate(-12deg)
}
.banner-symbol svg {
  width:230px;
  height:230px
}
.service-intro {
  display:flex;
  align-items:center;
  gap:40px
}
.service-intro h2 {
  max-width:290px
}
.service-intro p {
  max-width:420px
}
.service-intro .button {
  margin-left:auto;
  flex-shrink:0
}
.detail-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) 305px;
  gap:48px;
  align-items:start
}
.detail-main {
  grid-column:1;
  min-width:0;
  width:100%
}
.service-aside {
  grid-column:2;
  min-width:0
}
.detail-main>h2 {
  margin:22px 0
}
.detail-main>p {
  margin-top:16px
}
.detail-main .lead {
  font-size:17px;
  line-height:1.8;
  color:#344f52
}
.detail-image {
  position:relative;
  border-radius:var(--radius);
  overflow:hidden;
  aspect-ratio:1.85;
  margin-bottom:38px
}
.detail-image>img {
  height:100%;
  object-fit:cover
}
.detail-image>span {
  position:absolute;
  bottom:0;
  left:0;
  border:10px solid var(--paper);
  border-bottom:0;
  border-left:0;
  border-radius:0 20px 0 0;
  padding:15px 22px 10px;
  background:var(--paper);
  display:flex;
  gap:12px;
  align-items:center;
  color:var(--teal);
  font-size:12px;
  font-weight:600
}
.detail-features {
  display:grid;
  gap:22px;
  margin:35px 0 60px
}
.detail-feature {
  display:flex;
  gap:19px;
  padding:24px;
  background:white;
  border-radius:12px
}
.detail-feature>span {
  width:32px;
  height:32px;
  border-radius:50%;
  background:#e6f2ee;
  color:var(--teal);
  display:grid;
  place-items:center;
  flex-shrink:0
}
.detail-feature>span>svg {
  width:17px;
  height:17px
}
.detail-feature h3 {
  font-size:21px;
  margin:3px 0 10px
}
.detail-feature p {
  font-size:13px
}
.detail-process .process-grid {
  gap:22px;
  margin:30px 0 65px
}
.detail-process h3 {
  font-size:18px
}
.detail-process .step-number {
  font-size:33px;
  padding-bottom:15px;
  margin-bottom:20px
}
.service-aside {
  position:sticky;
  top:125px
}
.aside-menu {
  background:white;
  border-radius:var(--radius);
  padding:26px
}
.aside-menu>h2 {
  font-size:22px;
  margin-bottom:22px
}
.aside-menu>a {
  padding:13px 14px;
  background:var(--paper);
  border-radius:6px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  font-size:11px;
  font-weight:600;
  line-height:1.5;
  margin-top:8px
}
.aside-menu>a svg {
  width:15px;
  height:15px
}
.aside-menu>a[aria-current=page],.aside-menu>a:hover {
  background:var(--teal);
  color:white
}
.aside-contact {
  margin-top:22px;
  padding:30px;
  background:var(--dark);
  border-radius:var(--radius);
  color:white
}
.aside-contact>.brand-mark {
  color:var(--bright);
  width:36px;
  height:36px;
  margin-bottom:25px
}
.aside-contact h3 {
  font-size:28px
}
.aside-contact p {
  font-size:12px;
  color:#aec5bd;
  margin:16px 0 25px
}
.aside-contact .button {
  font-size:12px;
  width:100%
}
.detail-faq>h2 {
  margin:20px 0 30px
}
.faq-list {
  border-top:1px solid #cad8d4
}
details {
  border-bottom:1px solid #cad8d4
}
summary {
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:22px 0;
  font-size:16px;
  font-weight:600;
  line-height:1.5;
  letter-spacing:-.025em
}
summary::-webkit-details-marker {
  display:none
}
summary:after {
  content:'+';
  font-size:25px;
  font-weight:400;
  color:var(--teal);
  flex-shrink:0
}
details[open]>summary:after {
  content:'−'
}
details>p {
  padding:0 35px 22px 0;
  font-size:14px
}
.portfolio-intro {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
  padding-bottom:55px;
  border-bottom:1px solid var(--line)
}
.portfolio-intro>p {
  max-width:600px
}
.project-jumps {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end
}
.project-jumps a {
  background:white;
  border:1px solid var(--line);
  padding:8px 13px;
  border-radius:30px;
  font-size:11px;
  white-space:nowrap
}
.project-jumps a:hover {
  background:var(--teal);
  color:white
}
.project-feature {
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:70px;
  align-items:center;
  padding:70px 0;
  border-bottom:1px solid var(--line);
  scroll-margin-top:80px
}
.project-feature:last-child {
  padding-bottom:0;
  border:0
}
.project-feature:nth-child(odd) .project-copy {
  order:2
}
.project-feature:nth-child(odd) {
  grid-template-columns:1.15fr .85fr
}
.project-copy>h2 {
  margin:24px 0 18px
}
.concept-tag {
  display:inline-block;
  padding:5px 10px;
  font-size:10px;
  font-weight:800;
  border:1px solid #bbceca;
  border-radius:30px;
  color:var(--teal)
}
.project-copy>p {
  margin-top:20px;
  font-size:14px
}
.project-details {
  margin:10px 0 28px
}
.project-details>summary {
  font-size:14px
}
.project-feature .project-media {
  aspect-ratio:1.12
}
.project-feature .clinic-preview {
  max-width:350px;
  margin-inline:auto
}
.project-feature .project-overlay {
  padding:40px
}
.project-feature .project-overlay strong {
  font-size:55px
}
.project-feature .project-overlay span {
  font-size:35px;
  max-width:250px
}
.contact-layout {
  display:grid;
  grid-template-columns:.88fr 1.12fr;
  gap:70px;
  align-items:start
}
.contact-intro>h2 {
  margin:24px 0
}
.contact-intro>p {
  font-size:14px
}
.contact-note {
  display:flex;
  align-items:flex-start;
  gap:17px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:27px 0;
  margin:30px 0
}
.contact-note>svg {
  color:var(--teal);
  width:36px;
  height:36px
}
.contact-note h3 {
  font-size:20px;
  margin-bottom:12px
}
.contact-note p {
  font-size:13px
}
.contact-info {
  display:grid;
  gap:10px;
  font-size:17px;
  font-weight:600;
  overflow-wrap:anywhere
}
.contact-info a:hover {
  color:var(--teal)
}
.contact-promise {
  display:grid;
  gap:13px;
  font-size:11px;
  color:var(--muted)
}
.contact-form {
  padding:40px;
  background:white;
  border-radius:var(--radius)
}
.contact-form>h2 {
  font-size:29px;
  margin-bottom:12px
}
.contact-form>p:not(.form-note):not(.form-status) {
  font-size:12px
}
.form-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:23px 20px;
  margin-top:30px
}
.field {
  min-width:0
}
.field-wide {
  grid-column:1/-1
}
.field label {
  display:block;
  font-size:11px;
  font-weight:800;
  margin-bottom:8px
}
.field input,.field select,.field textarea {
  width:100%;
  border:1px solid var(--line);
  border-radius:6px;
  background:#f5f8f7;
  color:var(--ink);
  font-size:13px;
  padding:14px 15px;
  line-height:1.6;
  min-width:0
}
.field input::placeholder,.field textarea::placeholder {
  color:#788b89
}
.field textarea {
  min-height:145px;
  resize:vertical
}
.form-note {
  font-size:11px;
  line-height:1.8;
  margin:23px 0
}
.form-status {
  font-size:13px;
  color:var(--teal);
  margin-top:15px
}

.form-reply-note {
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:14px;
  color:var(--muted);
  font-size:11px;
  line-height:1.5
}
.form-reply-note svg {
  width:17px;
  height:17px;
  color:var(--teal);
  stroke-width:2.2
}

.form-status:empty {
  display:none
}
@media(min-width:1700px) {
  .hero {
    max-width:1660px;
    margin-inline:auto
  }
  .hero-copy {
    padding:75px
  }
  .hero h1 {
    font-size:79px
  }
  .hero {
    min-height:730px
  }
}
@media(max-width:1180px) {
  .wrap {
    width:calc(100% - 70px)
  }
  .header-inner {
    padding-inline:25px;
    gap:20px
  }
  .desktop-nav {
    gap:19px
  }
  .header-cta {
    font-size:11px;
    padding-left:15px
  }
  .header-cta .button-icon {
    width:29px;
    height:29px
  }
  .nav-link,.dropdown-toggle {
    font-size:12px
  }
  .hero {
    min-height:610px
  }
  .hero-copy {
    padding:50px 32px 35px
  }
  .hero h1 {
    font-size:58px
  }
  .hero-bottom {
    gap:16px;
    flex-wrap:wrap
  }
  .hero-insight {
    padding:20px 18px;
    gap:10px;
    max-width:82%
  }
  .hero-insight strong {
    font-size:16px
  }
  .hero-insight .circle-link {
    width:34px;
    height:34px
  }
  .hero-insight .insight-icon {
    display:none
  }
  .motion-control {
    bottom:120px
  }
  .about-grid {
    gap:45px
  }
  .service-card {
    padding:27px
  }
  .section {
    padding-block:85px
  }
  .about-section {
    padding-top:10px
  }
  .detail-layout {
    gap:30px;
    grid-template-columns:minmax(0,1fr) 270px
  }
  .aside-menu {
    padding:22px
  }
  .aside-contact {
    padding:26px
  }
  .contact-layout {
    gap:40px
  }
  .contact-form {
    padding:30px
  }
  .footer-main {
    gap:30px
  }
  .project-feature {
    gap:45px
  }
  .project-meta h3 {
    font-size:20px
  }
  .clinic-layout {
    padding:18px
  }
  .clinic-preview {
    padding:20px 17px
  }
  .clinic-preview h3 {
    font-size:27px
  }
}
@media(max-width:950px) {
  .header-cta {
    display:none
  }
  .hero h1 {
    font-size:48px
  }
  .hero-copy {
    padding:40px 27px
  }
  .hero {
    min-height:575px
  }
  .hero-copy>p {
    font-size:13px
  }
  .hero-secondary {
    font-size:11px
  }
  .hero-insight {
    max-width:88%;
    padding:18px
  }
  .hero-insight strong {
    font-size:15px
  }
  .sector-strip {
    gap:15px;
    font-size:11px
  }
  .sector-strip>span {
    display:none
  }
  .value-card {
    padding:28px
  }
  .value-card h3 {
    font-size:20px
  }
  .about-grid {
    gap:30px
  }
  .about-picture {
    min-height:500px
  }
  .about-badge {
    min-width:230px;
    font-size:22px
  }
  .service-card h3 {
    font-size:21px
  }
  .service-grid,.projects-grid,.value-grid {
  gap:16px
}
.growth-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px
}
  .growth-card {
    padding:28px 25px 80px
  }
  .growth-card h3 {
    font-size:21px
  }
  .project-meta h3 {
    font-size:18px
  }
  .project-meta .circle-link {
    width:32px;
    height:32px
  }
  .project-overlay {
    padding:23px
  }
  .project-overlay>strong {
    font-size:26px
  }
  .project-overlay>span {
    font-size:21px
  }
  .clinic-preview h3 {
    font-size:23px
  }
  .clinic-symbol {
    font-size:110px
  }
  .clinic-nav>span {
    display:none
  }
  .section-heading>p {
    max-width:285px
  }
  .service-intro {
    flex-wrap:wrap
  }
  .service-intro .button {
    margin-left:0
  }
  .footer-main {
    grid-template-columns:1.3fr 1fr 1fr
  }
  .footer-brand {
    grid-column:1/-1;
    display:flex;
    align-items:center;
    justify-content:space-between
  }
  .footer-brand>p {
    margin:0
  }
  .footer-col {
    gap:8px
  }
  .cta h2 {
    font-size:32px
  }
  .detail-layout {
    grid-template-columns:minmax(0,1fr) 240px;
    gap:25px
  }
  .aside-menu {
    padding:20px
  }
  .aside-menu>a {
    font-size:10px;
    padding:12px
  }
  .detail-process .process-grid {
    grid-template-columns:1fr;
    gap:25px
  }
  .detail-process .process-step {
    display:grid;
    grid-template-columns:60px 1fr;
    gap:0 20px
  }
  .detail-process .step-number {
    grid-row:span 2;
    margin:0;
    border:0;
    align-self:start;
    padding:0
  }
  .detail-process .step-number>span {
    display:none
  }
  .detail-process h3 {
    margin-bottom:10px
  }
  .contact-layout {
    grid-template-columns:1fr 1.1fr;
    gap:30px
  }
  .form-grid {
    grid-template-columns:1fr
  }
  .field-wide {
    grid-column:auto
  }
  .portfolio-intro {
    align-items:flex-start
  }
  .project-jumps {
    max-width:200px
  }
  .project-feature {
    gap:35px
  }
}
@media(max-width:980px) and (min-width:801px) {
  .detail-layout {
    grid-template-columns:minmax(0,1fr) 270px;
    gap:32px
  }
  .detail-process .process-grid {
    grid-template-columns:1fr;
    gap:28px
  }
  .detail-process .process-step {
    min-width:0
  }
}

@media(max-width:800px) {
  html {
    scroll-padding-top:100px
  }
  .wrap {
    width:calc(100% - 44px)
  }
  body {
  padding-top:90px;
}

.site-header {
  position:fixed;
  top:0;
  left:0;
  right:0;
  width:100%;
  z-index:110;
  padding:0 12px 12px;
  background:transparent;
}
  .header-inner {
    position:relative;
    z-index:102;
    height:78px;
    padding:0 20px;
    transition:background .45s cubic-bezier(.22,1,.36,1),color .35s ease
  }
  .logo>span {
    font-size:34px
  }
  .logo .brand-mark {
    width:31px;
    height:31px
  }
  .header-cta {
    display:none
  }
  .header-inner>.logo {
    position:relative;
    z-index:105;
    transition:color .35s ease
  }
  .header-inner>.logo .brand-mark {
    transition:color .35s ease
  }
  .mobile-toggle {
    position:relative;
    z-index:105;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    width:48px;
    height:48px;
    padding:0;
    border:1px solid #112c3014;
    border-radius:50%;
    background:var(--paper);
    color:var(--ink);
    overflow:hidden;
    transition:background .35s ease,border-color .35s ease,transform .35s cubic-bezier(.22,1,.36,1),color .35s ease
  }
  .mobile-toggle:active {
    transform:scale(.92)
  }
  .menu-line {
    display:block;
    width:19px;
    height:1.5px;
    background:currentColor;
    border-radius:10px;
    transform:none;
    transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .25s ease,width .4s cubic-bezier(.22,1,.36,1)
  }
  .menu-line:nth-child(2) {
  width:19px;
  transform:none
}
  .desktop-nav {
    position:fixed;
    inset:0;
    z-index:100;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:center;
    gap:0;
    width:100%;
    height:100dvh;
    max-height:none;
    padding:max(112px,env(safe-area-inset-top)) 28px max(34px,env(safe-area-inset-bottom));
    overflow-x:hidden;
    overflow-y:auto;
    background:radial-gradient(circle at 90% 10%,#57c6b633,transparent 34%),radial-gradient(circle at 10% 85%,#187f7b38,transparent 35%),#0c252a;
    color:white;
    visibility:hidden;
    pointer-events:none;
    clip-path:circle(0% at calc(100% - 36px) 40px);
    transition:clip-path .85s cubic-bezier(.76,0,.24,1),visibility 0s linear .85s
  }
  .desktop-nav:before {
    content:'';
    position:fixed;
    inset:0;
    pointer-events:none;
    opacity:.35;
    background:repeating-linear-gradient(115deg,transparent 0 18px,#ffffff05 19px 20px)
  }
  .desktop-nav:after {
    content:'';
    position:fixed;
    top:115px;
    right:28px;
    bottom:30px;
    width:1px;
    background:linear-gradient(transparent,#99dfd159,transparent);
    transform:scaleY(0);
    transform-origin:top;
    transition:transform .8s cubic-bezier(.22,1,.36,1) .35s
  }
  .desktop-nav.is-open {
    visibility:visible;
    pointer-events:auto;
    clip-path:circle(150% at calc(100% - 36px) 40px);
    transition:clip-path .9s cubic-bezier(.76,0,.24,1),visibility 0s
  }
  .desktop-nav.is-open:after {
    transform:scaleY(1)
  }
  body:has(.desktop-nav.is-open) {
    overflow:hidden
  }
  body:has(.desktop-nav.is-open) .header-inner {
    background:transparent
  }
  body:has(.desktop-nav.is-open) .header-inner>.logo {
    color:white
  }
  body:has(.desktop-nav.is-open) .header-inner>.logo .brand-mark {
    color:var(--bright)
  }
  body:has(.desktop-nav.is-open) .mobile-toggle {
    background:#ffffff14;
    border-color:#ffffff2e;
    color:white;
    backdrop-filter:blur(12px)
  }
  .mobile-toggle[aria-expanded=true] .menu-line:nth-child(1) {
    transform:translateY(6.5px) rotate(45deg)
  }
  .mobile-toggle[aria-expanded=true] .menu-line:nth-child(2) {
    opacity:0;
    transform:translateX(10px)
  }
  .mobile-toggle[aria-expanded=true] .menu-line:nth-child(3) {
    transform:translateY(-6.5px) rotate(-45deg)
  }
  .desktop-nav>.nav-link,.desktop-nav>.nav-item,.desktop-nav>.mobile-nav-meta {
    position:relative;
    width:100%;
    border-top:1px solid #ffffff1a;
    opacity:0;
    transform:translateY(36px) rotateX(-10deg);
    transition:opacity .55s ease,transform .7s cubic-bezier(.22,1,.36,1)
  }
  .desktop-nav>:first-child {
    border-top:0
  }
  .desktop-nav.is-open>:nth-child(1) {transition-delay:.18s}
  .desktop-nav.is-open>:nth-child(2) {transition-delay:.24s}
  .desktop-nav.is-open>:nth-child(3) {transition-delay:.30s}
  .desktop-nav.is-open>:nth-child(4) {transition-delay:.36s}
  .desktop-nav.is-open>:nth-child(5) {transition-delay:.42s}
  .desktop-nav.is-open>.mobile-nav-meta {transition-delay:.48s}
  .desktop-nav.is-open>.nav-link,.desktop-nav.is-open>.nav-item,.desktop-nav.is-open>.mobile-nav-meta {
    opacity:1;
    transform:translateY(0) rotateX(0)
  }
  .nav-link,.dropdown-toggle {
    width:100%;
    padding:13px 0;
    border:0;
    background:transparent;
    color:white;
    font-size:clamp(30px,9vw,48px);
    font-weight:400;
    line-height:1.08;
    letter-spacing:-.055em;
    text-align:left
  }
  .nav-link {
    display:flex;
    align-items:center
  }
  .desktop-nav>.nav-link:before,.nav-item>.dropdown-toggle:before {
    margin-right:14px;
    color:var(--bright);
    font-size:9px;
    font-weight:800;
    letter-spacing:.12em;
    opacity:.55
  }
  .desktop-nav>.nav-link:nth-child(1):before {content:'01'}
  .nav-item:nth-child(2)>.dropdown-toggle:before {content:'02'}
  .nav-item:nth-child(3)>.dropdown-toggle:before {content:'03'}
  .desktop-nav>.nav-link:nth-child(4):before {content:'04'}
  .desktop-nav>.nav-link:nth-child(5):before {content:'05'}
  .dropdown-toggle {
    display:flex;
    align-items:center;
    justify-content:flex-start
  }
  .dropdown-toggle .chevron {
    width:23px;
    height:23px;
    margin-left:auto;
    color:var(--bright);
    transition:transform .62s cubic-bezier(.16,1,.3,1),color .3s ease
  }
  .dropdown-toggle[aria-expanded=true] .chevron {
    transform:rotate(180deg) scale(1.12);
    color:white
  }
  .nav-link:hover,.dropdown-toggle:hover,.nav-link[aria-current=page],.dropdown-toggle.active {
    color:var(--bright)
  }
  .nav-link:active,.dropdown-toggle:active {
    opacity:.6
  }
  .nav-item {
    position:relative
  }
  /* Dropdown mobile: apertura fluida e voci in sequenza.
     L'override di [hidden] evita che il browser tronchi l'animazione. */
  .desktop-nav .dropdown,
  .desktop-nav .dropdown[hidden] {
    display:block!important;
    position:static;
    min-width:0;
    max-height:0;
    margin:0;
    padding:0 0 0 37px;
    overflow:hidden;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-10px);
    filter:blur(5px);
    transition:
      max-height .72s cubic-bezier(.22,1,.36,1),
      padding .62s cubic-bezier(.22,1,.36,1),
      opacity .34s ease,
      transform .62s cubic-bezier(.22,1,.36,1),
      filter .45s ease,
      visibility 0s linear .72s;
    will-change:max-height,opacity,transform
  }
  .desktop-nav .dropdown-toggle[aria-expanded=true] + .dropdown {
    max-height:520px;
    padding:4px 0 20px 37px;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
    filter:blur(0);
    transition:
      max-height .82s cubic-bezier(.16,1,.3,1),
      padding .72s cubic-bezier(.16,1,.3,1),
      opacity .38s ease .05s,
      transform .72s cubic-bezier(.16,1,.3,1),
      filter .5s ease,
      visibility 0s
  }
  .dropdown>a {
    position:relative;
    display:block;
    padding:5px 0;
    border-radius:0;
    color:#ffffff94;
    font-size:13px;
    font-weight:500;
    line-height:1.5;
    opacity:0;
    transform:translate3d(0,14px,0) scale(.985);
    filter:blur(3px);
    transition:
      color .25s ease,
      opacity .38s ease,
      transform .55s cubic-bezier(.16,1,.3,1),
      filter .42s ease
  }
  .dropdown-toggle[aria-expanded=true] + .dropdown>a {
    opacity:1;
    transform:translate3d(0,0,0) scale(1);
    filter:blur(0)
  }
  .dropdown-toggle[aria-expanded=true] + .dropdown>a:nth-child(1) {transition-delay:.10s}
  .dropdown-toggle[aria-expanded=true] + .dropdown>a:nth-child(2) {transition-delay:.14s}
  .dropdown-toggle[aria-expanded=true] + .dropdown>a:nth-child(3) {transition-delay:.18s}
  .dropdown-toggle[aria-expanded=true] + .dropdown>a:nth-child(4) {transition-delay:.22s}
  .dropdown-toggle[aria-expanded=true] + .dropdown>a:nth-child(5) {transition-delay:.26s}
  .dropdown-toggle[aria-expanded=true] + .dropdown>a:nth-child(6) {transition-delay:.30s}
  .dropdown-toggle[aria-expanded=true] + .dropdown>a:nth-child(7) {transition-delay:.34s}
  .dropdown>a:before {
    content:'↗';
    display:inline-block;
    width:21px;
    color:var(--bright);
    opacity:.5;
    transform:translateX(-4px) rotate(-12deg);
    transition:transform .42s cubic-bezier(.16,1,.3,1),opacity .3s ease
  }
  .dropdown-toggle[aria-expanded=true] + .dropdown>a:before {
    transform:translateX(0) rotate(0)
  }
  .dropdown>a:hover,.dropdown>a[aria-current=page] {
    background:transparent;
    color:white
  }
  .dropdown>a:active {
    color:white;
    transform:translateX(5px)
  }
  .dropdown .menu-overview {
    margin-bottom:7px;
    padding-bottom:10px;
    border-bottom:1px solid #ffffff1a;
    color:var(--bright);
    font-weight:700
  }
  .mobile-nav-meta {
    display:flex;
    justify-content:space-between;
    gap:20px;
    margin-top:18px;
    padding-top:18px;
    color:#99dfd1a8;
    font-size:8px;
    font-weight:800;
    line-height:1.5;
    letter-spacing:.13em;
    text-transform:uppercase
  }
  .mobile-nav-meta span:last-child {
    text-align:right
  }
  .hero {
    margin:0 12px;
    gap:12px;
    grid-template-columns:1fr;
    min-height:0
  }
  .hero-copy {
    padding:34px 32px 27px
  }
  .hero h1 {
    font-size:clamp(41px,8vw,62px);
    margin:18px 0
  }
  .hero-copy>p {
    font-size:14px;
    line-height:1.7
  }
  .hero-bottom {
    margin-top:19px;
    padding-top:19px;
    gap:24px
  }
  .hero-index {
    margin-top:17px
  }
  .hero-art {
    height:540px
  }
  .hero-image {
    object-position:center 40%
  }
  .hero-insight {
    max-width:80%;
    padding:25px
  }
  .hero-insight .insight-icon {
    display:flex
  }
  .hero-insight strong {
    font-size:20px
  }
  .hero-insight .circle-link {
    width:42px;
    height:42px
  }
  .hero-insight div>span {
    font-size:11px
  }
  .motion-control {
    bottom:20px
  }
  .hero-photo-label {
    font-size:9px
  }
  .sector-strip {
    flex-wrap:wrap;
    justify-content:center;
    gap:12px 25px;
    padding-block:24px
  }
  .sector-strip>a:before {
    margin-right:8px
  }
  .section {
    padding-block:65px
  }
  .section-heading {
    gap:28px;
    align-items:flex-start
  }
  .section-heading>p {
    font-size:13px;
    max-width:250px
  }
  .section-heading.center {
    margin-bottom:35px
  }
  .value-grid {
    grid-template-columns:1fr
  }
  .value-card {
    display:grid;
    grid-template-columns:55px 1fr;
    column-gap:22px;
    padding:30px
  }
  .value-card>svg {
    grid-row:span 2;
    margin:0
  }
  .value-card h3 {
    font-size:23px;
    margin-bottom:12px
  }
  .value-card p {
    font-size:14px
  }
  .about-grid {
    grid-template-columns:1fr;
    gap:35px
  }
  .about-picture {
    min-height:430px
  }
  .about-copy {
    max-width:600px
  }
  .service-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .dark-section,.white-section {
    margin-inline:12px
  }
  .dark-section .wrap,.white-section .wrap {
    width:calc(100% - 44px)
  }
  .growth-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px
}
.growth-card {
  display:block;
  min-height:235px;
  padding:18px 16px 58px
}
.growth-card>svg {
  width:32px;
  height:32px;
  margin:0 0 20px
}
.growth-card h3 {
  font-size:17px;
  line-height:1.25;
  margin-bottom:10px
}
.growth-card p {
  font-size:11px;
  line-height:1.6
}
.growth-card .circle-link {
  top:auto;
  right:16px;
  bottom:16px;
  width:32px;
  height:32px;
  transform:none
}
  .projects-grid {
    grid-template-columns:1fr;
    gap:32px
  }
  .project-media {
    aspect-ratio:1.35
  }
  .project-overlay>strong {
    font-size:43px
  }
  .project-overlay>span {
    font-size:30px;
    max-width:200px
  }
  .project-meta h3 {
    font-size:24px
  }
  .project-meta>span {
    font-size:12px
  }
  .project-meta .circle-link {
    width:40px;
    height:40px
  }
  .clinic-layout {
    padding:30px
  }
  .clinic-preview {
    max-width:310px;
    margin:auto
  }
  .clinic-preview h3 {
    font-size:29px
  }
  .clinic-symbol {
    font-size:130px
  }
  .clinic-nav>span {
    display:block
  }
  .section-tail {
    margin-top:25px
  }
  .section-tail>p {
    max-width:300px
  }
  .process-grid {
    gap:25px
  }
  .process-step h3 {
    font-size:20px
  }
  .process-step p {
    font-size:12px
  }
  .cta-shell {
  padding:45px 0 0
}
.cta {
  width:calc(100% - 24px);
  margin-inline:12px;
  padding:45px 27px;
  align-items:flex-start;
  flex-direction:column;
  gap:25px
}
  .cta h2 {
    font-size:36px
  }
  .site-footer {
    margin:0 12px 12px
  }
  .footer-main {
    gap:30px 25px;
    padding:50px 0
  }
  .footer-brand {
    gap:20px;
    flex-wrap:wrap
  }
  .footer-bottom {
    flex-wrap:wrap;
    gap:10px 20px
  }
  .page-banner {
    margin-inline:12px;
    padding:45px 0 35px
  }
  .page-banner h1 {
    font-size:clamp(35px,6.3vw,51px)
  }
  .page-banner .wrap {
    width:calc(100% - 44px)
  }
  .banner-symbol {
    right:0;
    top:25%
  }
  .banner-symbol svg {
    width:170px;
    height:170px
  }
  .service-intro h2 {
    max-width:unset
  }
  .detail-layout {
    display:block
  }
  .detail-main {
    width:100%;
    min-width:0
  }
  .detail-image {
    width:100%;
    aspect-ratio:1.65
  }
  .service-aside {
    position:static;
    display:grid;
    grid-template-columns:1fr;
    gap:22px;
    margin-top:45px
  }
  .aside-contact {
    margin-top:0;
    display:flex;
    flex-direction:column;
    justify-content:center
  }
  .aside-contact .button {
    margin-top:10px
  }
  .aside-menu>a {
    font-size:12px
  }
  .detail-process .process-grid {
    grid-template-columns:1fr;
    gap:30px
  }
  .detail-process .process-step {
    display:block;
    min-width:0;
    width:100%
  }
  .detail-process .step-number {
    margin-bottom:15px
  }
  .detail-main>h2 {
    font-size:35px
  }
  .detail-main .lead {
    font-size:16px
  }
  .project-feature,.project-feature:nth-child(odd) {
    grid-template-columns:1fr;
    gap:30px;
    padding:50px 0
  }
  .project-feature:nth-child(odd) .project-copy {
    order:0
  }
  .project-feature .project-media {
    aspect-ratio:1.35
  }
  .project-copy {
    max-width:600px
  }
  .portfolio-intro {
    flex-direction:column;
    gap:25px;
    padding-bottom:35px
  }
  .project-jumps {
    max-width:unset;
    justify-content:flex-start
  }
  .contact-layout {
    grid-template-columns:1fr
  }
  .contact-promise {
    display:none
  }
  .contact-form {
    padding:35px
  }
  .form-grid {
    grid-template-columns:1fr 1fr
  }
  .field-wide {
    grid-column:1/-1
  }
  .contact-intro>p {
    max-width:520px
  }
}
@media(max-width:480px) {
  body {
    font-size:14px
  }
  .wrap {
    width:calc(100% - 40px)
  }
  .section {
    padding-block:53px
  }
  h2 {
    font-size:32px
  }
  .section-heading {
    display:block;
    margin-bottom:30px
  }
  .section-heading>p {
    margin-top:20px;
    max-width:100%;
    font-size:14px
  }
  .section-heading .eyebrow {
    margin-bottom:17px
  }
  .eyebrow {
    font-size:9px
  }
  .hero-copy {
    padding:27px 23px 22px
  }
  .hero h1 {
    font-size:clamp(35px,10.2vw,46px);
    margin:16px 0;
    letter-spacing:-.055em
  }
  .hero-copy>p {
    font-size:12px;
    line-height:1.65
  }
  .hero-bottom {
    margin-top:18px;
    padding-top:18px;
    gap:16px 20px;
    flex-wrap:wrap
  }
  .hero-secondary {
    font-size:11px
  }
  .hero-index {
    margin-top:15px;
    font-size:8px
  }
  .hero-art {
    height:410px
  }
  .hero-insight {
    padding:17px 14px;
    gap:12px;
    border-width:10px;
    max-width:84%
  }
  .hero-insight .insight-icon {
    display:none
  }
  .hero-insight strong {
    font-size:17px
  }
  .hero-insight .circle-link {
    width:35px;
    height:35px
  }
  .hero-insight div>span {
    font-size:9px
  }
  .motion-control {
    bottom:auto;
    top:63px;
    left:24px;
    right:auto;
    font-size:8px
  }
  .hero-photo-label {
    left:24px;
    top:25px;
    font-size:8px
  }
  .sector-strip {
    font-size:11px;
    gap:10px 17px
  }
  .value-card {
    padding:26px;
    display:block
  }
  .value-card>svg {
    margin-bottom:25px;
    width:42px;
    height:42px
  }
  .value-card h3 {
    font-size:24px
  }
  .about-picture {
    min-height:350px
  }
  .about-badge {
    font-size:21px;
    min-width:215px;
    padding:13px 15px
  }
  .about-copy h2 {
    font-size:33px
  }
  .check-list {
    font-size:12px
  }
  .service-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px
  }
  .service-card {
    padding:18px
  }
  .service-card h3 {
    font-size:18px
  }
  .service-card p {
    font-size:12px;
    line-height:1.65
  }
  .card-top {
    margin-bottom:20px
  }
  .card-top>svg {
    width:36px;
    height:36px
  }
  .card-top>span {
    font-size:11px
  }
  .growth-card {
    display:block;
    padding:28px 28px 75px
  }
  .growth-card>svg {
    margin-bottom:30px
  }
  .growth-card .circle-link {
    top:auto;
    bottom:24px;
    transform:none;
    right:25px
  }
  .growth-card h3 {
    font-size:25px
  }
  .project-media,.project-feature .project-media {
    aspect-ratio:1/1.1
  }
  .project-meta>span {
    font-size:10px
  }
  .section-tail {
    align-items:flex-start;
    flex-direction:column;
    gap:20px
  }
  .section-tail>p {
    max-width:100%
  }
  .process-grid,.detail-process .process-grid {
    grid-template-columns:1fr;
    gap:35px
  }
  .detail-layout,
  .detail-main,
  .detail-process,
  .detail-process .process-grid,
  .detail-process .process-step {
    width:100%;
    min-width:0
  }
  .service-aside {
    width:100%
  }
  .process-step h3 {
    font-size:23px
  }
  .process-step p {
    font-size:14px
  }
  .step-number {
    padding-bottom:17px;
    margin-bottom:22px
  }
  .cta-shell {
  padding:45px 0 0
}
.cta {
  width:calc(100% - 24px);
  margin-inline:12px;
  padding:36px 22px;
  border-radius:var(--radius) var(--radius) 0 0
}
  .cta h2 {
    font-size:29px
  }
  .cta .eyebrow {
    font-size:9px
  }
  .footer-main {
    grid-template-columns:1fr 1fr;
    gap:30px 20px
  }
  .footer-brand {
    display:block
  }
  .footer-brand>p {
    margin:20px 0
  }
  .footer-col:nth-child(4) {
    grid-column:1/-1
  }
  .footer-col>h3 {
    font-size:15px;
    margin-bottom:10px
  }
  .footer-col>a {
    font-size:11px
  }
  .footer-bottom {
    display:grid;
    gap:10px
  }
  .page-banner {
    padding:35px 0 30px
  }
  .page-banner h1 {
    font-size:clamp(29px,8.2vw,38px);
    line-height:1.16;
    overflow-wrap:break-word
  }
  .page-banner p {
    font-size:12px
  }
  .page-banner .eyebrow {
    font-size:8px;
    max-width:100%;
    line-height:1.8
  }
  .breadcrumb {
    font-size:9px;
    gap:8px;
    margin-top:27px
  }
  .banner-symbol {
    right:-45px;
    top:35%
  }
  .detail-image {
    aspect-ratio:1.3;
    margin-bottom:30px
  }
  .detail-image>span {
    font-size:10px;
    padding:12px 13px 4px;
    gap:8px
  }
  .detail-main>h2 {
    font-size:31px
  }
  .detail-feature {
    padding:22px 18px;
    gap:13px
  }
  .detail-feature h3 {
    font-size:20px
  }
  .detail-feature p {
    font-size:13px
  }
  .detail-feature>span {
    width:25px;
    height:25px
  }
  .detail-process .process-step {
    display:grid;
    grid-template-columns:45px 1fr;
    gap:0 15px
  }
  .detail-process h3 {
    font-size:21px
  }
  .detail-process .step-number {
    font-size:30px;
    grid-row:span 2;
    margin:0
  }
  .detail-process p {
    font-size:13px
  }
  .detail-features {
    margin-bottom:45px
  }
  .detail-process .process-grid {
    margin-bottom:45px
  }
  .detail-faq>h2 {
    font-size:30px
  }
  .faq-list summary {
    font-size:15px
  }
  .faq-list details>p {
    font-size:13px;
    padding-right:5px
  }
  .service-aside {
    grid-template-columns:1fr
  }
  .aside-menu {
    padding:25px
  }
  .aside-contact {
    padding:30px
  }
  .aside-contact .button {
    max-width:220px
  }
  .service-intro {
    gap:25px
  }
  .project-copy h2 {
    font-size:35px
  }
  .project-feature .project-overlay {
    padding:30px
  }
  .project-feature .project-overlay strong {
    font-size:42px
  }
  .project-feature .project-overlay span {
    font-size:30px
  }
  .contact-form {
    padding:27px 22px
  }
  .contact-form>h2 {
    font-size:25px
  }
  .form-grid {
    grid-template-columns:1fr;
    gap:20px
  }
  .field-wide {
    grid-column:auto
  }
  .contact-note {
    gap:15px
  }
  .contact-note h3 {
    font-size:19px
  }
  .contact-intro h2 {
    font-size:33px
  }
  .button {
    font-size:12px;
    padding-left:20px;
    gap:18px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*:before,*:after {
    animation:none!important;
    transition:none!important
  }
  .hero-parallax {
    transform:none!important
  }
  .motion-control {
    display:none!important
  }
}
/* Hero offer: sito web dentro un computer */
.hero-art.vx-offer {
  min-height:650px;
  padding:38px 28px 65px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:28px;
  background:radial-gradient(circle at 80% 15%,#b7e7db 0,transparent 45%),linear-gradient(145deg,#e5f1ed,#c8ded7)
}
.vx-offer::after {
  display:none
}
.vx-offer .hero-parallax {
  position:relative;
  inset:auto;
  width:min(100%,420px);
  flex-shrink:0
}
.vx-computer {
  animation:vx-float 6s ease-in-out infinite;
  filter:drop-shadow(0 20px 18px #123a3025)
}
.vx-screen {
  position:relative;
  height:235px;
  overflow:hidden;
  border:9px solid #203b3b;
  border-bottom-width:15px;
  border-radius:14px;
  background:#f8f6f0;
  box-shadow:inset 0 0 0 1px #ffffff55
}
.vx-mini-nav {
  height:36px;
  padding:0 15px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:#fffdf7;
  color:#374d40
}
.vx-mini-nav strong {
  font-family:Georgia,serif;
  font-size:13px;
  letter-spacing:.14em
}
.vx-mini-nav span {
  font-size:7px
}
.vx-mini-hero {
  display:grid;
  grid-template-columns:1fr 1fr;
  height:calc(100% - 36px)
}
.vx-mini-copy {
  padding:24px 16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  gap:12px
}
.vx-mini-copy small {
  font-size:6px;
  letter-spacing:.12em;
  color:#788675
}
.vx-mini-copy strong {
  font-family:Georgia,serif;
  font-size:25px;
  font-weight:400;
  line-height:1.05;
  letter-spacing:-.04em;
  color:#304c3b
}
.vx-mini-button {
  padding:6px 10px;
  border-radius:20px;
  background:#304c3b;
  color:white;
  font-size:7px
}
.vx-mini-photo {
  background:url('../images/hotel.webp') center/cover
}
.vx-stand {
  width:65px;
  height:25px;
  margin:auto;
  background:linear-gradient(90deg,#7f9994,#c2d2cc,#8fa8a1);
  clip-path:polygon(15% 0,85% 0,100% 100%,0 100%)
}
.vx-base {
  width:150px;
  height:7px;
  margin:auto;
  border-radius:50% 50% 4px 4px;
  background:linear-gradient(#d4e1db,#879f96)
}
.vx-price-card {
  width:min(100%,440px);
  padding:25px;
  border:1px solid white;
  border-radius:20px;
  background:#fffffff2;
  box-shadow:0 18px 45px #174d3c12;
  text-align:center
}
.vx-offer-badge {
  display:inline-block;
  padding:6px 12px;
  border-radius:20px;
  background:#ffe1a8;
  color:#7d5413;
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em
}
.vx-price-card h2 {
  margin:14px 0 0;
  color:#123c35;
  font-size:23px
}
.vx-price {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin:12px 0 15px
}
.vx-price>span {
  max-width:65px;
  color:#657e75;
  font-size:12px;
  line-height:1.4;
  text-align:left
}
.vx-price>strong {
  color:#187f7b;
  font-size:68px;
  font-weight:600;
  line-height:1;
  letter-spacing:-.07em
}
.vx-price small {
  margin-left:5px;
  font-size:32px;
  vertical-align:top
}
.vx-guarantee {
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:8px 14px;
  border-radius:30px;
  background:#e5f3eb;
  color:#225e43;
  font-size:12px;
  font-weight:800
}
.vx-guarantee:before {
  content:'✓';
  display:grid;
  place-items:center;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#39885c;
  color:white
}
.vx-delivery {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  margin-top:16px;
  color:#187f7b;
  font-size:13px
}
.vx-delivery span {
  font-size:20px;
  animation:vx-pulse 2s infinite
}
.vx-benefits {
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:9px 16px;
  list-style:none;
  padding:0;
  margin:20px 0;
  color:#3c5a50;
  font-size:11px
}
.vx-benefits li:before {
  content:'✓';
  margin-right:5px;
  color:#187f7b;
  font-weight:800
}
.vx-price-card .button {
  width:100%;
  text-align:left
}
.vx-price-note {
  margin:12px 0 0;
  color:#6d8078;
  font-size:10px
}
.vx-offer .motion-control {
  top:auto;
  left:auto;
  right:18px;
  bottom:14px;
  background:#174c42;
  color:white;
  font-size:9px
}
.hero.motion-paused .vx-computer,.hero.motion-paused .vx-delivery span {
  animation-play-state:paused
}
@keyframes vx-float {
  0%,100% {
    transform:translateY(0) rotate(-1deg)
  }
  50% {
    transform:translateY(-8px) rotate(1deg)
  }
}
@keyframes vx-pulse {
  0%,100% {
    transform:scale(1)
  }
  50% {
    transform:scale(1.18)
  }
}
@media(max-width:480px) {
  .hero-art.vx-offer {
    min-height:0;
    padding:32px 18px 58px;
    gap:24px
  }
  .vx-screen {
    height:195px;
    border-width:7px
  }
  .vx-mini-copy {
    padding:15px 10px
  }
  .vx-mini-copy strong {
    font-size:21px
  }
  .vx-mini-nav {
    padding-inline:10px
  }
  .vx-mini-nav span {
    display:none
  }
  .vx-price-card {
    padding:23px 18px
  }
  .vx-price>strong {
    font-size:62px
  }
}
@media(prefers-reduced-motion:reduce) {
  .vx-computer,.vx-delivery span {
    animation:none
  }
}
.vx-computer-image {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  object-fit:cover;
  border-radius:18px;
  box-shadow:0 24px 45px #123a3030;
  animation:vx-float 6s ease-in-out infinite
}
.hero.motion-paused .vx-computer-image {
  animation-play-state:paused
}
@media(prefers-reduced-motion:reduce) {
  .vx-computer-image {
    animation:none
  }
}
/* Mobile hero offer: foto sopra, card separata e leggibile */
@media(max-width:480px) {
  .hero-art.vx-offer {
    min-height:650px;
    padding:0;
    display:block
  }
  .hero-art.vx-offer .hero-parallax {
    height:100%;
    inset:0
  }
  .vx-person-image {
    height:100%;
    object-position:58% center
  }
  .hero-art.vx-offer .hero-parallax:after {
    background:linear-gradient(180deg,#062f3420 0%,#062f3440 38%,#062f34b5 100%)
  }
  .vx-image-caption {
    top:22px;
    left:20px
  }
  .vx-image-caption span {
    font-size:8px
  }
  .vx-image-caption strong {
    font-size:22px
  }
  .hero-art.vx-offer .vx-price-card {
    right:14px;
    bottom:14px;
    width:calc(100% - 28px);
    padding:18px 16px;
    border-radius:18px;
    background:#fffffff8
  }
  .hero-art.vx-offer .vx-price-card h2 {
    font-size:22px;
    margin-top:10px
  }
  .hero-art.vx-offer .vx-price {
    margin:8px 0 11px
  }
  .hero-art.vx-offer .vx-price>strong {
    font-size:54px
  }
  .hero-art.vx-offer .vx-price>span {
    font-size:11px
  }
  .hero-art.vx-offer .vx-guarantee {
    font-size:11px;
    padding:7px 12px
  }
  .hero-art.vx-offer .vx-delivery {
    margin-top:12px;
    font-size:12px
  }
  .hero-art.vx-offer .vx-benefits {
    margin:14px 0;
    font-size:10px;
    gap:7px 11px
  }
  .hero-art.vx-offer .vx-price-note {
    font-size:9px;
    margin-top:9px
  }
  .hero-art.vx-offer .motion-control {
    top:20px;
    right:18px;
    bottom:auto;
    padding:8px 10px;
    font-size:8px
  }
}

/* Mobile navigation refinements */
@media(max-width:800px) and (max-height:700px) {
  .desktop-nav {
    justify-content:flex-start;
    padding-top:max(98px,env(safe-area-inset-top))
  }
  .nav-link,.dropdown-toggle {
    padding:9px 0;
    font-size:clamp(27px,8vw,38px)
  }
  .mobile-nav-meta {
    margin-top:12px;
    padding-top:12px
  }
}
@media(prefers-reduced-motion:reduce) {
  .desktop-nav,.desktop-nav *,.mobile-toggle *,.header-inner {
    transition-duration:.01ms!important;
    animation-duration:.01ms!important
  }
}


@media (max-width:800px) {
  body {
    padding-top:90px !important;
  }

  #site-navbar {
    position:fixed !important;
    top:0;
    left:0;
    width:100%;
    z-index:9999;
  }

  #site-navbar .site-header {
    position:relative !important;
    top:auto;
    left:auto;
    right:auto;
    width:100%;
  }
}