/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

/* ---------------------------------------------------
   SORA – solo pesi usati, formato WOFF2 (+ TTF fallback)
---------------------------------------------------- */

@font-face {
  font-family: "Sora";
  src: url("../fonts/sora/Sora-Regular.woff2") format("woff2"),
       url("../fonts/sora/Sora-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Sora";
  src: url("../fonts/sora/Sora-Medium.woff2") format("woff2"),
       url("../fonts/sora/Sora-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Sora";
  src: url("../fonts/sora/Sora-SemiBold.woff2") format("woff2"),
       url("../fonts/sora/Sora-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Sora";
  src: url("../fonts/sora/Sora-Bold.woff2") format("woff2"),
       url("../fonts/sora/Sora-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ---------------------------------------------------
   ANTONIO – solo pesi usati, formato WOFF2 (+ TTF fallback)
---------------------------------------------------- */

@font-face {
  font-family: "Antonio";
  src: url("../fonts/antonio/Antonio-Regular.woff2") format("woff2"),
       url("../fonts/antonio/Antonio-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Antonio";
  src: url("../fonts/antonio/Antonio-Medium.woff2") format("woff2"),
       url("../fonts/antonio/Antonio-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Antonio";
  src: url("../fonts/antonio/Antonio-SemiBold.woff2") format("woff2"),
       url("../fonts/antonio/Antonio-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Antonio";
  src: url("../fonts/antonio/Antonio-Bold.woff2") format("woff2"),
       url("../fonts/antonio/Antonio-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ---------------------------------------------------
	ROOT STYLES
---------------------------------------------------- */
:root {
  --background: #fff9ee;
  /*--iwm-green: #005f73;*/
  --iwm-green: #005f73;
  --iwm-yellow: #fff152;
  --black: #0b0f10;
  --charcoal: #0c0c0c;
  --gray-dark: #1f1f1f;
  --gray-mid: #1a1a1a;
  --white-off: #fff9ee;
  --gray-light: #f3f3f3;
  --divider: rgba(255, 255, 255, 0.08);
  --cta: #ec6e5e;
  /* Coral Tech: caldo, moderno, molto visibile */

  /* AGGIUNTE leggere (non sostitutive) */
  --gray-hover: #3a3a3a;
  /* leggero highlight */
  --gray-soft: #1a1a1a;
  /* per pulsanti soft */

  --radius-squircle: 14px;
  --border-soft: rgba(0, 0, 0, 0.06);
  --radius-lg: 30px;
  --radius-md: 18px;
  --radius-pill: 999px;
  --transition-fast: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-med: 0.32s cubic-bezier(0.16, 1, 0.3, 1);

  /* === VARIABILI COLORI SINGLE BLOGPOST HERO LIGHT MODE=== */
  /* Overlay principale - RIDOTTO, lascia vedere l'immagine al centro */
  --hero-overlay-start: rgba(255, 249, 238, 0.05);
  /* molto trasparente in alto */
  --hero-overlay-mid: rgba(255, 249, 238, 0.25);
  /* leggero al centro */
  --hero-overlay-end: rgba(255, 249, 238, 0.7);
  /* copre solo in basso */

  /* Gradiente lineare - RIDOTTO, transizione solo verso il footer */
  --hero-linear-start: rgba(245, 240, 228, 0.08);
  /* quasi trasparente */
  --hero-linear-mid: rgba(255, 249, 238, 0.5);
  /* media copertura */
  --hero-linear-end: rgba(255, 249, 238, 0.95);
  /* pieno solo alla fine */

  /* Accent radiali - PIÙ SOFT */
  --hero-accent-1: rgba(0, 95, 115, 0.06);
  /* verde acqua molto soft */
  --hero-accent-2: rgba(236, 110, 94, 0.05);
  /* corallo molto soft */

  /* Transizione inferiore - leggera fino all'80%, poi piena */
  --hero-bottom-start: rgba(255, 249, 238, 0);
  --hero-bottom-mid: rgba(255, 249, 238, 0.35);
}

/* Buttons */
.tp-btn {
  padding: 20px 34px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
  font-size: 15px;
  border-radius: 10px;
  text-decoration: none;
  text-transform: none;
  transition: all 0.3s ease;
  cursor: pointer;
}

.tp-btn--coral {
  background-color: #ec6e5e !important;
  border: 2px solid #ec6e5e !important;
  color: #1a1a1a !important;
}

.tp-btn--coral:hover {
  background-color: transparent !important;
  border: 2px solid #ec6e5e !important;
  color: #ec6e5e !important;
}

/* CTA secondarie: solo bordo arancione, nessun background */
.tp-btn--outline-coral,
.fp-hero-btn-ghost,
.cta-btn-ghost,
.fp-icta .cta-btn-ghost {
  background: transparent !important;
  border: 2px solid #ec6e5e !important;
  color: #ec6e5e !important;
}
.tp-btn--outline-coral:hover,
.fp-hero-btn-ghost:hover,
.cta-btn-ghost:hover,
.fp-icta .cta-btn-ghost:hover {
  background: transparent !important;
  border-color: #ec6e5e !important;
  color: #ec6e5e !important;
}

/* Studio (fp-intro): CTA “Scopri il team” — solo bordo teal, nessun background, testo #1a1a1a */
.fp-intro .tp-btn--teal {
  background: transparent !important;
  border: 2px solid #005f73 !important;
  color: #1a1a1a !important;
}
.fp-intro .tp-btn--teal:hover {
  background: transparent !important;
  border-color: #005f73 !important;
  color: #1a1a1a !important;
}

/* CTA secondarie su sfondo crema: testo #1a1a1a, bordo arancione */
.fp-intro .tp-btn--outline-coral,
.fp-work .tp-btn--outline-coral,
.fp-faq .tp-btn--outline-coral,
.fp-phases .tp-btn--outline-coral {
  color: #1a1a1a !important;
  border-color: #ec6e5e !important;
}
.fp-intro .tp-btn--outline-coral:hover,
.fp-work .tp-btn--outline-coral:hover,
.fp-faq .tp-btn--outline-coral:hover,
.fp-phases .tp-btn--outline-coral:hover {
  color: #1a1a1a !important;
  border-color: #ec6e5e !important;
}

/* CTA “Tutti gli articoli” in fp-journal (sfondo teal): testo crema, bordo arancione */
.fp-journal .tp-btn--outline-coral,
.fp-journal .tp-btn--outline-coral:hover {
  color: #fff9ee !important;
  border-color: #ec6e5e !important;
}

/* Homepage "I nostri pensieri": bordo CTA card article coerente */
.fp-journal-grid .iwm-brow-cta {
  border-color: #ec6e5e !important;
}

/* CTA “Parliamone” base: bordo arancio, testo nero su sfondo chiaro.
   I contesti con sfondo teal (servizi, progetti, chi siamo) sovrascrivono a bianco/crema sotto. */
.cs-cta .tp-btn--outline-coral,
.cs-cta .tp-btn--outline-coral:hover {
  color: #1a1a1a !important;
  border-color: #ec6e5e !important;
}


/* Chi siamo: CTA finale Parliamone — scritta crema, bordo arancione, sfondo trasparente */
.chi-wrapper .cs-cta .tp-btn--outline-coral,
.chi-wrapper .cs-cta .tp-btn--outline-coral:hover {
  background: transparent !important;
  color: #fff9ee !important;
  border-color: #ec6e5e !important;
}

/* Pagina /servizi: CTA Parliamone — testo crema, bordo arancione, sfondo trasparente */
.svh-cta-wrap .cs-cta .tp-btn--outline-coral,
.svh-cta-wrap .cs-cta .tp-btn--outline-coral:hover,
.svh-cta-wrap .cs-cta-card .tp-btn--outline-coral,
.svh-cta-wrap .cs-cta-card .tp-btn--outline-coral:hover {
  background: transparent !important;
  color: #fff9ee !important;
  border-color: #ec6e5e !important;
}

/* Pagina /progetti: CTA Parliamone — testo crema, bordo arancione, sfondo trasparente */
.ap .cs-cta .tp-btn--outline-coral,
.ap .cs-cta .tp-btn--outline-coral:hover,
.ap .cs-cta-card .tp-btn--outline-coral,
.ap .cs-cta-card .tp-btn--outline-coral:hover {
  background: transparent !important;
  color: #fff9ee !important;
  border-color: #ec6e5e !important;
}

/* Pagine servizi: pill selezionata verde #005f73 */
.dm-tab-btn.active,
.fv-tab-btn.active,
.gd-tab-btn.active,
.sw-tab-btn.active {
  background: #005f73 !important;
  border-color: #005f73 !important;
  color: #fff !important;
}

.tp-btn-accent {
  background: var(--cta) !important;
}

.tp-btn-accent:hover {
  color: var(--white-off) !important;
  border: none !important;
}

.background-white {
  background-color: var(--white-off);
}

.container-iwm {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 16px;
}

/* -----------------------------------------
   DARK MODE OVERRIDE
------------------------------------------ */
[data-theme="dark"] {
  --iwm-green: #ec6e5e;

  --background: var(--black);

  --gray-light: #dcdcdc;
  --white-off: #1a1a1a;

  --gray-mid: #fff9ee;
  --gray-dark: #f1f1f1;

  --divider: rgba(255, 255, 255, 0.15);

  /* testi */
  --gray-hover: #ffffff;
  --gray-soft: #2a2a2a;

  /* === VARIABILI COLORI SINGLE BLOGPOST HERO DARK MODE === */

  /* Overlay principale - RIDOTTO */
  --hero-overlay-start: rgba(38, 38, 38, 0.08);
  /* molto leggero in alto */
  --hero-overlay-mid: rgba(38, 38, 38, 0.35);
  /* medio al centro */
  --hero-overlay-end: rgba(38, 38, 38, 0.75);
  /* copre solo in basso */

  /* Gradiente lineare - RIDOTTO */
  --hero-linear-start: rgba(31, 31, 31, 0.12);
  --hero-linear-mid: rgba(38, 38, 38, 0.55);
  --hero-linear-end: rgba(38, 38, 38, 0.95);

  /* Accent radiali - PIÙ SOFT */
  --hero-accent-1: rgba(236, 110, 94, 0.08);
  /* corallo soft */
  --hero-accent-2: rgba(0, 95, 115, 0.06);
  /* verde acqua soft */

  /* Transizione inferiore */
  --hero-bottom-start: rgba(38, 38, 38, 0);
  --hero-bottom-mid: rgba(38, 38, 38, 0.4);
  --hero-bottom-end: rgba(38, 38, 38, 1);
}

/* ---------------------------------------------------
   APPLY TO BODY, P, LINK, UI
---------------------------------------------------- */

/* LIGHT/DARK MODE TOGGLE */
.theme-toggle {
  position: relative;
  width: 42px;
  height: 42px;
  border: none;
  background: transparent;
  cursor: pointer;
}

.theme-toggle svg {
  position: absolute;
  width: 26px;
  height: 26px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) translateY(4px);
  opacity: 0;
  transition:
    opacity 0.35s ease,
    transform 0.35s ease;
}

/* DEFAULT = DARK MODE */
[data-theme="dark"] #moon {
  color: #fff9ee;
}

[data-theme="light"] #sunny {
  opacity: 1;
  transform: translate(-50%, -50%) translateY(0);
}

/* nascondi sole quando dark */
[data-theme="dark"] #sunny {
  opacity: 0;
  transform: translate(-50%, -50%) translateY(-4px);
}

/* nascondi luna quando light */
[data-theme="light"] #moon {
  opacity: 0;
  transform: translate(-50%, -50%) translateY(-4px);
}

.tp-header-area.header-transparent .container {
  position: relative;
  z-index: 2;
}

.gradient-blur-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  pointer-events: none;
  z-index: 1;
}

.gradient-blur-header > div,
.gradient-blur-header::before,
.gradient-blur-header::after {
  position: absolute;
  inset: 0;
}

/* Layer 1 - blur leggero in alto */
.gradient-blur-header::before {
  content: "";
  backdrop-filter: blur(6px);
  mask: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.85) 0%,
    rgba(0, 0, 0, 0.55) 30%,
    rgba(0, 0, 0, 0) 75%
  );
}

/* Layer 2 - blur medio */
.gradient-blur-header > div:nth-of-type(1) {
  backdrop-filter: blur(3px);
  mask: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 10%,
    rgba(0, 0, 0, 0.6) 40%,
    rgba(0, 0, 0, 0) 85%
  );
}

/* Layer 3 - blur soft */
.gradient-blur-header > div:nth-of-type(2) {
  backdrop-filter: blur(1.5px);
  mask: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 25%,
    rgba(0, 0, 0, 0.45) 55%,
    rgba(0, 0, 0, 0) 100%
  );
}

/* Layer 4 - blur minimo */
.gradient-blur-header::after {
  content: "";
  backdrop-filter: blur(1px);
  mask: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 35%,
    rgba(0, 0, 0, 0.3) 70%,
    rgba(0, 0, 0, 0) 100%
  );
}

@media (max-width: 768px) {
  .gradient-blur-header {
    height: 100%;
  }
}

.gradient-blur-footer {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 15vh;
  pointer-events: none;
  z-index: 9998;
}

.gradient-blur-footer > div,
.gradient-blur-footer::before,
.gradient-blur-footer::after {
  position: absolute;
  inset: 0;
}

/* Layer 1 - blur forte in basso */
.gradient-blur-footer::before {
  content: "";
  backdrop-filter: blur(8px);
  mask: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.95) 0%,
    rgba(0, 0, 0, 0.7) 15%,
    rgba(0, 0, 0, 0) 35%
  );
}

/* Layer 2 - blur medio */
.gradient-blur-footer > div:nth-of-type(1) {
  backdrop-filter: blur(3px);
  mask: linear-gradient(
    to top,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.75) 20%,
    rgba(0, 0, 0, 0) 45%
  );
}

/* Layer 3 - blur leggero */
.gradient-blur-footer > div:nth-of-type(2) {
  backdrop-filter: blur(2px);
  mask: linear-gradient(
    to top,
    rgba(0, 0, 0, 0) 15%,
    rgba(0, 0, 0, 0.6) 35%,
    rgba(0, 0, 0, 0) 60%
  );
}

/* Layer 4 - blur soft */
.gradient-blur-footer > div:nth-of-type(3) {
  backdrop-filter: blur(0.5px);
  mask: linear-gradient(
    to top,
    rgba(0, 0, 0, 0) 30%,
    rgba(0, 0, 0, 0.4) 50%,
    rgba(0, 0, 0, 0) 75%
  );
}

/* Layer 5 - blur minimo */
.gradient-blur-footer::after {
  content: "";
  backdrop-filter: blur(0.5px);
  mask: linear-gradient(
    to top,
    rgba(0, 0, 0, 0) 45%,
    rgba(0, 0, 0, 0.2) 70%,
    rgba(0, 0, 0, 0) 100%
  );
}

body {
  background: var(--iwm-green) !important;
  margin: 0;
}

/* ── pattern dots globale su tutte le sezioni ── */
section {
  position: relative;
  isolation: isolate;
}

/* sezioni chiare: pallini teal, visibili su sfondo bianco/crema */
section {
  position: relative;
}

/* pattern dots: tutte le sezioni tranne hero single progetto (lì serve la sfumatura verde) */
section:not(.cs-hero)::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image: url("data:image/svg+xml,%3Csvg width='400' height='400' viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='23' cy='47' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='87' cy='12' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='145' cy='78' r='1.5' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='210' cy='33' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='278' cy='61' r='2' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='340' cy='22' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='380' cy='90' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='55' cy='130' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='118' cy='155' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='190' cy='112' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='250' cy='140' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='315' cy='125' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='370' cy='148' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='10' cy='200' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='75' cy='220' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='160' cy='195' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='230' cy='230' r='1.5' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='290' cy='205' r='1' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='355' cy='240' r='1.5' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='40' cy='285' r='1' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='100' cy='310' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='175' cy='270' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='240' cy='300' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='305' cy='275' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='365' cy='320' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='20' cy='360' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='90' cy='385' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='155' cy='350' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='220' cy='375' r='1.5' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='285' cy='355' r='1' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='345' cy='390' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='395' cy='365' r='1' fill='rgba(0,95,115,0.13)'/%3E%3C/svg%3E");
  background-size: 260px 260px;
}

/* Homepage Studio: griglia di sfondo (linee + pallini + sfumatura) */
section.fp-intro::before {
  background-image:
    linear-gradient(rgba(0,0,0,0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,0.07) 1px, transparent 1px),
    url("data:image/svg+xml,%3Csvg width='400' height='400' viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='23' cy='47' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='87' cy='12' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='145' cy='78' r='1.5' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='210' cy='33' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='278' cy='61' r='2' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='340' cy='22' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='380' cy='90' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='55' cy='130' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='118' cy='155' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='190' cy='112' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='250' cy='140' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='315' cy='125' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='370' cy='148' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='10' cy='200' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='75' cy='220' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='160' cy='195' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='230' cy='230' r='1.5' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='290' cy='205' r='1' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='355' cy='240' r='1.5' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='40' cy='285' r='1' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='100' cy='310' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='175' cy='270' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='240' cy='300' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='305' cy='275' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='365' cy='320' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='20' cy='360' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='90' cy='385' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='155' cy='350' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='220' cy='375' r='1.5' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='285' cy='355' r='1' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='345' cy='390' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='395' cy='365' r='1' fill='rgba(0,95,115,0.13)'/%3E%3C/svg%3E");
  background-size: 130px 130px, 130px 130px, 260px 260px;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
}

/* Pagine servizi: griglia in "Cosa realizziamo" e in sezione con CTA mini-audit (Il nostro approccio) */
section.dm-solutions::before,
section.fv-solutions::before,
section.gd-solutions::before,
section.sw-solutions::before,
section.dm-lavoriamo::before,
section.fv-lavoriamo::before,
section.gd-lavoriamo::before,
section.sw-lavoriamo::before {
  background-image:
    linear-gradient(rgba(0,0,0,0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,0.07) 1px, transparent 1px),
    url("data:image/svg+xml,%3Csvg width='400' height='400' viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='23' cy='47' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='87' cy='12' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='145' cy='78' r='1.5' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='210' cy='33' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='278' cy='61' r='2' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='340' cy='22' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='380' cy='90' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='55' cy='130' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='118' cy='155' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='190' cy='112' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='250' cy='140' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='315' cy='125' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='370' cy='148' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='10' cy='200' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='75' cy='220' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='160' cy='195' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='230' cy='230' r='1.5' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='290' cy='205' r='1' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='355' cy='240' r='1.5' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='40' cy='285' r='1' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='100' cy='310' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='175' cy='270' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='240' cy='300' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='305' cy='275' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='365' cy='320' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='20' cy='360' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='90' cy='385' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='155' cy='350' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='220' cy='375' r='1.5' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='285' cy='355' r='1' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='345' cy='390' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='395' cy='365' r='1' fill='rgba(0,95,115,0.13)'/%3E%3C/svg%3E");
  background-size: 130px 130px, 130px 130px, 260px 260px;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
}

/* Single progetto: sfumatura verde sull’immagine in evidenza per leggibilità titolo */
.cs-hero-cover-img {
  z-index: 0 !important;
}
.cs-hero::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 2 !important;
  background-image: none !important;
  background: linear-gradient(to bottom, transparent 0%, transparent 48%, rgba(0,95,115,0.5) 58%, rgba(0,95,115,0.85) 75%, #005f73 100%) !important;
}

/* Single progetto: sezione subito dopo l’hero (La sfida) — griglia di sfondo */
section.cs-sfida::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image:
    linear-gradient(rgba(0,0,0,0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,0.07) 1px, transparent 1px),
    url("data:image/svg+xml,%3Csvg width='400' height='400' viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='23' cy='47' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='87' cy='12' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='145' cy='78' r='1.5' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='210' cy='33' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='278' cy='61' r='2' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='340' cy='22' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='380' cy='90' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='55' cy='130' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='118' cy='155' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='190' cy='112' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='250' cy='140' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='315' cy='125' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='370' cy='148' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='10' cy='200' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='75' cy='220' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='160' cy='195' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='230' cy='230' r='1.5' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='290' cy='205' r='1' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='355' cy='240' r='1.5' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='40' cy='285' r='1' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='100' cy='310' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='175' cy='270' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='240' cy='300' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='305' cy='275' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='365' cy='320' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='20' cy='360' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='90' cy='385' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='155' cy='350' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='220' cy='375' r='1.5' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='285' cy='355' r='1' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='345' cy='390' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='395' cy='365' r='1' fill='rgba(0,95,115,0.13)'/%3E%3C/svg%3E");
  background-size: 130px 130px, 130px 130px, 260px 260px;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
}

/* Homepage: sezione progetti (fp-work) - griglia + pallini + sfumatura */
section.fp-work::before {
  background-image:
    linear-gradient(rgba(0,0,0,0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,0.07) 1px, transparent 1px),
    url("data:image/svg+xml,%3Csvg width='400' height='400' viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='23' cy='47' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='87' cy='12' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='145' cy='78' r='1.5' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='210' cy='33' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='278' cy='61' r='2' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='340' cy='22' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='380' cy='90' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='55' cy='130' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='118' cy='155' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='190' cy='112' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='250' cy='140' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='315' cy='125' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='370' cy='148' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='10' cy='200' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='75' cy='220' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='160' cy='195' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='230' cy='230' r='1.5' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='290' cy='205' r='1' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='355' cy='240' r='1.5' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='40' cy='285' r='1' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='100' cy='310' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='175' cy='270' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='240' cy='300' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='305' cy='275' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='365' cy='320' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='20' cy='360' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='90' cy='385' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='155' cy='350' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='220' cy='375' r='1.5' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='285' cy='355' r='1' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='345' cy='390' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='395' cy='365' r='1' fill='rgba(0,95,115,0.13)'/%3E%3C/svg%3E");
  background-size: 130px 130px, 130px 130px, 260px 260px;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
}

/* Homepage: sezione FAQ - griglia + pallini + sfumatura */
section.fp-faq::before {
  background-image:
    linear-gradient(rgba(0,0,0,0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,0.07) 1px, transparent 1px),
    url("data:image/svg+xml,%3Csvg width='400' height='400' viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='23' cy='47' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='87' cy='12' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='145' cy='78' r='1.5' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='210' cy='33' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='278' cy='61' r='2' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='340' cy='22' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='380' cy='90' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='55' cy='130' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='118' cy='155' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='190' cy='112' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='250' cy='140' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='315' cy='125' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='370' cy='148' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='10' cy='200' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='75' cy='220' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='160' cy='195' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='230' cy='230' r='1.5' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='290' cy='205' r='1' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='355' cy='240' r='1.5' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='40' cy='285' r='1' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='100' cy='310' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='175' cy='270' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='240' cy='300' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='305' cy='275' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='365' cy='320' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='20' cy='360' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='90' cy='385' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='155' cy='350' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='220' cy='375' r='1.5' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='285' cy='355' r='1' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='345' cy='390' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='395' cy='365' r='1' fill='rgba(0,95,115,0.13)'/%3E%3C/svg%3E");
  background-size: 130px 130px, 130px 130px, 260px 260px;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
}

/* Chi siamo: griglia su Il nostro modo e Il processo */
section.chi-manifesto::before,
section.chi-approach::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image:
    linear-gradient(rgba(0,0,0,0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,0.07) 1px, transparent 1px),
    url("data:image/svg+xml,%3Csvg width='400' height='400' viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='23' cy='47' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='87' cy='12' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='145' cy='78' r='1.5' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='210' cy='33' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='278' cy='61' r='2' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='340' cy='22' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='380' cy='90' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='55' cy='130' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='118' cy='155' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='190' cy='112' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='250' cy='140' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='315' cy='125' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='370' cy='148' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='10' cy='200' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='75' cy='220' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='160' cy='195' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='230' cy='230' r='1.5' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='290' cy='205' r='1' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='355' cy='240' r='1.5' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='40' cy='285' r='1' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='100' cy='310' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='175' cy='270' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='240' cy='300' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='305' cy='275' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='365' cy='320' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='20' cy='360' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='90' cy='385' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='155' cy='350' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='220' cy='375' r='1.5' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='285' cy='355' r='1' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='345' cy='390' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='395' cy='365' r='1' fill='rgba(0,95,115,0.13)'/%3E%3C/svg%3E");
  background-size: 130px 130px, 130px 130px, 260px 260px;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
}

/* sezioni scure (verde): pallini bianchi, visibili su sfondo scuro */
section.section-dark::before {
  background-image: url("data:image/svg+xml,%3Csvg width='400' height='400' viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='23' cy='47' r='1.5' fill='rgba(255,255,255,0.18)'/%3E%3Ccircle cx='87' cy='12' r='1' fill='rgba(255,255,255,0.12)'/%3E%3Ccircle cx='145' cy='78' r='1.5' fill='rgba(255,255,255,0.15)'/%3E%3Ccircle cx='210' cy='33' r='1' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='278' cy='61' r='2' fill='rgba(255,255,255,0.16)'/%3E%3Ccircle cx='340' cy='22' r='1' fill='rgba(255,255,255,0.13)'/%3E%3Ccircle cx='380' cy='90' r='1.5' fill='rgba(255,255,255,0.18)'/%3E%3Ccircle cx='55' cy='130' r='1' fill='rgba(255,255,255,0.14)'/%3E%3Ccircle cx='118' cy='155' r='2' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='190' cy='112' r='1.5' fill='rgba(255,255,255,0.17)'/%3E%3Ccircle cx='250' cy='140' r='1' fill='rgba(255,255,255,0.12)'/%3E%3Ccircle cx='315' cy='125' r='2' fill='rgba(255,255,255,0.15)'/%3E%3Ccircle cx='370' cy='148' r='1' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='10' cy='200' r='1.5' fill='rgba(255,255,255,0.16)'/%3E%3Ccircle cx='75' cy='220' r='1' fill='rgba(255,255,255,0.13)'/%3E%3Ccircle cx='160' cy='195' r='2' fill='rgba(255,255,255,0.18)'/%3E%3Ccircle cx='230' cy='230' r='1.5' fill='rgba(255,255,255,0.14)'/%3E%3Ccircle cx='290' cy='205' r='1' fill='rgba(255,255,255,0.17)'/%3E%3Ccircle cx='355' cy='240' r='1.5' fill='rgba(255,255,255,0.12)'/%3E%3Ccircle cx='40' cy='285' r='1' fill='rgba(255,255,255,0.15)'/%3E%3Ccircle cx='100' cy='310' r='2' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='175' cy='270' r='1.5' fill='rgba(255,255,255,0.16)'/%3E%3Ccircle cx='240' cy='300' r='1' fill='rgba(255,255,255,0.13)'/%3E%3Ccircle cx='305' cy='275' r='2' fill='rgba(255,255,255,0.18)'/%3E%3Ccircle cx='365' cy='320' r='1' fill='rgba(255,255,255,0.14)'/%3E%3Ccircle cx='20' cy='360' r='1.5' fill='rgba(255,255,255,0.17)'/%3E%3Ccircle cx='90' cy='385' r='1' fill='rgba(255,255,255,0.12)'/%3E%3Ccircle cx='155' cy='350' r='2' fill='rgba(255,255,255,0.15)'/%3E%3Ccircle cx='220' cy='375' r='1.5' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='285' cy='355' r='1' fill='rgba(255,255,255,0.16)'/%3E%3Ccircle cx='345' cy='390' r='2' fill='rgba(255,255,255,0.18)'/%3E%3Ccircle cx='395' cy='365' r='1' fill='rgba(255,255,255,0.13)'/%3E%3C/svg%3E");
}

section > * {
  position: relative;
  z-index: 1;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Antonio", sans-serif;
  color: var(--gray-mid);
}

body,
p,
a,
li,
button,
input,
textarea {
  color: var(--gray-mid);
  margin: 0;
  font-family: "Sora", sans-serif;
}

a {
  color: #005f73;
}
a:not([class]) {
  text-decoration: underline;
}
a:not([class]):hover {
  color: #004d5e;
}
header a,
header a:not([class]),
.tp-header-area a,
.tp-header-area a:not([class]),
.tp-offcanvas-2-area a,
.tp-offcanvas-2-area a:not([class]) {
  text-decoration: none;
}

/* Mobile: evita che l’header e il menù finiscano sotto la UI del browser (Chrome, Safari) */
@media (max-width: 991px) {
  .iwm-header {
    padding-top: max(env(safe-area-inset-top, 0px), 20px);
    min-height: calc(90px + max(env(safe-area-inset-top, 0px), 20px));
    height: auto;
    box-sizing: border-box;
  }
}

/* ── Header social icons (desktop) ── */
.iwm-header-socials {
  align-items: center;
  gap: 4px;
  margin-right: 4px;
}
/* Stessa struttura visiva dei nav link: border trasparente + transition identica */
.iwm-header-socials a {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 7px 8px;
  border: 1px solid transparent;
  border-radius: 6px;
  text-decoration: none !important;
  transition: color 0.25s ease, border-color 0.25s ease, filter 0.25s ease;
}
/* Sfondo scuro (default): bianche come i nav link */
.tp-header-area:not(.header-on-light) .iwm-header-socials a {
  color: #fff !important;
}
.tp-header-area:not(.header-on-light) .iwm-header-socials a:hover {
  color: #fff !important;
  border-color: var(--white-off, rgba(255,249,238,0.8));
}
/* Sfondo chiaro: nere come i nav link */
.tp-header-area.header-on-light .iwm-header-socials a {
  color: #1a1a1a !important;
}
.tp-header-area.header-on-light .iwm-header-socials a:hover {
  color: #1a1a1a !important;
  border-color: var(--gray-mid, #555);
}

/* ── Drawer social icons (mobile) ── */
.iwm-drawer-socials {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
  padding: 28px 0 24px;
  border-top: 1px solid rgba(26, 26, 26, 0.1);
  margin-top: 8px;
  overflow: hidden;
}
.iwm-drawer-socials a {
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(26, 26, 26, 0.5);
  text-decoration: none;
  -webkit-transform: translateY(-300px);
  -moz-transform: translateY(-300px);
  -ms-transform: translateY(-300px);
  -o-transform: translateY(-300px);
  transform: translateY(-300px);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.55s ease-out, transform 0.55s ease-out, visibility 0.55s ease-out !important;
  transition-delay: 0.35s !important;
}
.iwm-drawer-socials a:hover {
  color: #1a1a1a;
}
.tp-offcanvas-2-area.menu-open .iwm-drawer-socials a {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
}

/**************************************************************************************************************/
/* fonts styles and typography
/**************************************************************************************************************/

.font-sora {
  font-family: "Sora", sans-serif !important;
}

.font-antonio {
  font-family: "Antonio", sans-serif !important;
}

.iwm-h1 {
  font-size: 72px;
  letter-spacing: -0.02em;
  font-family: "Antonio", sans-serif;
}

.iwm-h2 {
  font-size: clamp(46px, 5vw, 3.4vw);
  font-weight: 500;
  line-height: 1.15;
  margin-bottom: 30px;
}

.iwm-h3 {
  font-size: clamp(34px, 5vw, 2.75vw);
  font-family: "Antonio", sans-serif;
}

.iwm-h4 {
  font-size: clamp(28px, 2vw, 2vw);
  font-family: "Antonio", sans-serif;
}

.iwm-h5 {
  font-size: 28px;
  font-family: "Antonio", sans-serif;
}

.iwm-h6 {
  font-size: 24px;
  margin-top: 0;
  font-family: "Antonio", sans-serif;
}

.iwm-eyebrow {
  font-size: 13.2px;
  letter-spacing: 0.18em;
  color: var(--gray-mid);
  text-transform: uppercase;
}

.iwm-lead {
  font-size: 24px;
  color: var(--gray-mid);
  max-width: 640px;
  line-height: 1.55;
}

.iwm-p {
  font-size: 16px;
  color: var(--gray-mid);
  line-height: 1.6;
}

.iwm-small {
  font-size: 16px;
  color: var(--gray-mid);
}

.iwm-caption {
  font-size: 14px;
  color: var(--gray-mid);
  letter-spacing: 0.05em;
}

.iwm-quote {
  border-left: 4px solid var(--iwm-green);
  padding-left: 16px;
  margin: 24px 0;
  font-size: 16px;
  color: var(--gray-mid);
  font-style: italic;
}

.iwm-code {
  background: var(--iwm-green);
  padding: 2px 6px;
  border-radius: 4px;
  font-family: monospace;
  font-size: 13.2px;
}

.iwm-pre {
  background: var(--bg-alt);
  padding: 16px;
  border-radius: 10px;
  font-family: monospace;
  font-size: 13.2px;
  overflow-x: auto;
}

.tp-title-anim.fix,
.tp-title-anim.fix .tp-title-text {
  line-height: 1.2;
}

.tp-title-anim-inner {
  overflow: hidden;
}

/**************************************************************************************************************/
/* SINGLE BLOG POST
/**************************************************************************************************************/

.single-post-page {
  padding-top: 100px;
  min-height: 100vh;
}

/* Single blog (template single.php): palette contenuto articolo */
.sp-body {
  background-color: #fff9ee !important;
}
.sp-content,
.sp-content p,
.sp-content ul,
.sp-content ol,
.sp-content li {
  color: #1a1a1a !important;
  opacity: 1 !important;
}
.sp-content h1,
.sp-content h2,
.sp-content h3,
.sp-content h4,
.sp-content h5,
.sp-content h6 {
  color: #005f73 !important;
}
.sp-content strong,
.sp-content b {
  color: #eb6d5e !important;
}

.post-single-content .container {
  max-width: 1020px;
  margin: 0 auto;
  padding: 0 40px;
}

.post-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: "Nunito Sans", sans-serif;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-primary);
  text-decoration: none;
  padding: 12px 0;
  margin-bottom: 40px;
  transition: all 0.3s ease;
}

.post-back-btn svg {
  width: 20px;
  height: 20px;
  transition: transform 0.3s ease;
}

.post-back-btn:hover {
  color: #ec6e5e;
}

.post-back-btn:hover svg {
  transform: translateX(-4px);
}

.post-single-header {
  text-align: center;
  margin-bottom: 50px;
}

.post-single-categories {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-bottom: 20px;
}

.post-category-tag {
  font-family: "Nunito Sans", sans-serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.1em;
  color: var(--text-primary);
  text-decoration: none;
  padding: 6px 12px;
  background: var(--overlay-bg);
  border: 1px solid var(--border-color);
  border-radius: 35px;
  transition: all 0.3s ease;
}

.post-category-tag:hover {
  background: #ec6e5e;
  color: #ffffff;
  border-color: #ec6e5e;
}

.post-single-title {
  font-family: "Nunito Sans", sans-serif;
  font-size: clamp(32px, 5vw, 48px);
  font-weight: 800;
  line-height: 1.2;
  color: var(--text-primary);
  margin: 0 0 20px 0;
}

.post-meta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-family: "Nunito Sans", sans-serif;
  font-size: 14px;
  color: var(--text-muted);
}

.post-meta-separator {
  color: var(--border-color);
}

.post-single-featured-image {
  margin-bottom: 50px;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}

.post-single-featured-image img {
  width: 100%;
  height: auto;
  display: block;
}

.post-single-content-body {
  font-family: "Nunito Sans", sans-serif;
  font-size: 18px;
  line-height: 1.8;
  color: var(--text-primary);
  margin-bottom: 60px;
}

.post-single-content-body p {
  margin-bottom: 24px;
}

.post-single-content-body h2,
.post-single-content-body h3,
.post-single-content-body h4 {
  font-family: "Nunito Sans", sans-serif;
  font-weight: 800;
  color: var(--text-primary);
  margin: 50px 0 24px 0;
}

.post-single-content-body h2 {
  font-size: 36px;
  line-height: 1.2;
}

.post-single-content-body h3 {
  font-size: 28px;
  line-height: 1.3;
}

.post-single-content-body h4 {
  font-size: 22px;
  line-height: 1.4;
}

.post-single-content-body a {
  color: #005f73;
  text-decoration: underline;
  transition: color 0.3s ease;
}

.post-single-content-body a:hover {
  color: #004d5e;
}

.post-single-content-body img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
  margin: 40px 0;
}

.post-single-content-body ul,
.post-single-content-body ol {
  margin: 24px 0;
  padding-left: 30px;
}

.post-single-content-body li {
  margin-bottom: 12px;
}

.post-single-content-body blockquote {
  margin: 40px 0;
  padding: 24px 32px;
  background: var(--glass-bg);
  border-left: 4px solid #ec6e5e;
  border-radius: 10px;
  font-style: italic;
  color: var(--text-secondary);
}

.post-tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  padding: 30px 0;
  margin-bottom: 40px;
  border-top: 1px solid var(--border-color);
  border-bottom: 1px solid var(--border-color);
}

.tags-label {
  font-family: "Nunito Sans", sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.post-tag {
  font-family: "Nunito Sans", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
  text-decoration: none;
  padding: 8px 16px;
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: 35px;
  transition: all 0.3s ease;
}

.post-tag:hover {
  background: #ec6e5e;
  color: #ffffff;
  border-color: #ec6e5e;
}

.post-author-box {
  display: flex;
  gap: 20px;
  align-items: center;
  padding: 32px;
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: 10px;
  margin-bottom: 60px;
}

.author-avatar {
  flex-shrink: 0;
}

.author-avatar img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  border: 2px solid var(--border-color);
}

.author-label {
  display: block;
  font-family: "Nunito Sans", sans-serif;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  margin-bottom: 6px;
}

.author-name {
  font-family: "Nunito Sans", sans-serif;
  font-size: 20px;
  font-weight: 500;
  color: var(--text-primary);
  margin: 0 0 8px 0;
}

.author-bio {
  font-family: "Nunito Sans", sans-serif;
  font-size: 15px;
  line-height: 1.6;
  color: var(--text-secondary);
  margin: 0;
}

.post-navigation {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin: 60px 0 80px 0;
}

.post-nav-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px;
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: 10px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.post-nav-item:hover {
  background: var(--overlay-hover);
  border-color: var(--border-hover);
  transform: translateY(-2px);
}

.post-nav-prev {
  justify-content: flex-start;
}

.post-nav-next {
  justify-content: flex-end;
}

.post-nav-thumb {
  width: 70px;
  height: 70px;
  background-size: cover;
  background-position: center;
  border-radius: 10px;
  flex-shrink: 0;
}

.post-nav-content {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.post-nav-label {
  font-family: "Nunito Sans", sans-serif;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
}

.post-nav-title {
  font-family: "Nunito Sans", sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--text-primary);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

@media (max-width: 768px) {
  .single-post-page {
    padding-top: 80px;
  }

  .post-single-content .container {
    padding: 0 20px;
  }

  .post-back-btn {
    margin-bottom: 30px;
  }

  .post-single-header {
    margin-bottom: 40px;
  }

  .progetto-hero-meta-grid {
    margin-top: 48px !important;
  }

  .post-single-title {
    font-size: clamp(24px, 7vw, 32px);
  }

  .post-meta {
    flex-direction: column;
    gap: 6px;
  }

  .post-meta-separator {
    display: none;
  }

  .post-single-featured-image {
    margin-bottom: 40px;
    border-radius: 10px;
  }

  .post-single-content-body {
    font-size: 17px;
    margin-bottom: 50px;
  }

  .post-single-content-body h2 {
    font-size: 28px;
    margin: 40px 0 20px 0;
  }

  .post-single-content-body h3 {
    font-size: 24px;
  }

  .post-single-content-body h4 {
    font-size: 20px;
  }

  .post-author-box {
    flex-direction: column;
    text-align: center;
    padding: 24px;
    margin-bottom: 50px;
  }

  .author-avatar img {
    width: 60px;
    height: 60px;
  }

  .post-navigation {
    grid-template-columns: 1fr;
    gap: 16px;
    margin: 50px 0 60px 0;
  }

  .post-nav-item {
    padding: 16px;
  }

  .post-nav-thumb {
    width: 60px;
    height: 60px;
  }
}

/* ========================
   CODEX: FRONT PAGE RESTYLE
   ======================== */

/* Hero intro */
.iwm-hero-area {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.iwm-hero-area .container {
  position: relative;
  z-index: 2;
  width: 100%;
}

.iwm-hero-area .mp-hero-content {
  position: relative;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  max-width: 1200px;
  margin: 0 auto;
}

.iwm-hero-title {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-width: 26ch;
  transform: translateY(-4px);
  text-align: center;
}

.iwm-hero-line {
  display: block;
  line-height: 1.05;
  letter-spacing: -0.01em;
}

.iwm-hero-line--xl {
  font-size: clamp(58px, 8vw, 8vw);
}

.iwm-hero-line--lg {
  font-size: clamp(46px, 5.2vw, 5.2vw);
}

.iwm-hero-line--xxl {
  font-size: clamp(38px, 4.6vw, 4.6vw);
}

.iwm-hero-line--md {
  font-size: clamp(32px, 4vw, 4vw);
}

.iwm-hero-line--sm {
  font-size: clamp(26px, 2.8vw, 2.8vw);
}

.iwm-hero-line--xxl {
  transform: translateX(-4px);
  line-height: 1.12;
}

.iwm-hero-line--sm {
  transform: translateX(6px);
  line-height: 1.2;
}

.iwm-hero-line--xl {
  transform: translateX(-8px);
  line-height: 0.98;
}

.iwm-hero-line--md {
  transform: translateX(4px);
  line-height: 1.08;
}

.iwm-hero-line--lg {
  transform: translateX(-2px);
  line-height: 1.02;
}

/* ── Uniform hero titles line-height (template heroes) ── */
.adt-hero-title,
.cnt-hero-title,
.chi-hero-title,
.blg-hero-title,
.ap-hero-title,
.svh-hero-title,
.ssh-hero-title,
.cs-hero-title {
  line-height: 1 !important;
}

/* Single blog: hero title needs more breathing room */
.sp-hero-title {
  line-height: 1.18 !important;
}

/* Hero servizi: più interlinea sul titolo */
.ssh-hero-title {
  line-height: 1.25 !important;
}

/* Tag/eyebrow: sempre uppercase (niente minuscolo forzato) */
.iwm-footer-label,
.iwm-footer-nl-label,
.svh-hero-tag,
.ssh-hero-tag,
.cs-section-tag,
.cs-sfida-label {
  text-transform: uppercase !important;
}

/* Single progetto: descrizione hero in Sora, peso 300, 24px */
.cs-wrapper .cs-hero-headline {
  font-family: 'Sora', sans-serif;
  font-size: 24px;
  font-weight: 300;
  text-transform: none;
}

/* Single portfolio: hover obiettivi come "La mente in gioco" */
@property --_cs-bd {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}
.cs-wrapper .cs-obiettivo {
  position: relative;
}
.cs-wrapper .cs-obiettivo::before {
  content: '';
  position: absolute;
  inset: 0;
  padding: 2px;
  background: conic-gradient(from -45deg, var(--cta) var(--_cs-bd, 0deg), transparent var(--_cs-bd, 0deg));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  --_cs-bd: 0deg;
  transition: --_cs-bd 0s;
  pointer-events: none;
  z-index: 2;
}
.cs-wrapper .cs-obiettivo:hover::before {
  --_cs-bd: 360deg;
  transition: --_cs-bd 0.55s ease;
}

/* Single progetto: tutti i titoli con prima lettera maiuscola (no uppercase forzato) */
.cs-wrapper h1,
.cs-wrapper h2,
.cs-wrapper h3,
.cs-wrapper h4 {
  text-transform: none;
}

/* Single progetto: categorie hero come bottone "Visita il sito" */
.cs-wrapper .cs-hero-tags {
  gap: 10px;
  flex-wrap: wrap;
}
.cs-wrapper .cs-hero-tag {
  padding: 8px 22px;
  border-radius: 10px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,249,238,0.35);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* Single progetto: "Il risultato" — griglia di sfondo come homepage (intro) */
.cs-wrapper .cs-perche {
  position: relative;
  overflow: hidden;
}
.cs-wrapper .cs-perche::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image:
    linear-gradient(rgba(0,0,0,0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,0.07) 1px, transparent 1px),
    url("data:image/svg+xml,%3Csvg width='400' height='400' viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='23' cy='47' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='87' cy='12' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='145' cy='78' r='1.5' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='210' cy='33' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='278' cy='61' r='2' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='340' cy='22' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='380' cy='90' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='55' cy='130' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='118' cy='155' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='190' cy='112' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='250' cy='140' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='315' cy='125' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='370' cy='148' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='42' cy='95' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='130' cy='30' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='300' cy='42' r='1' fill='rgba(0,95,115,0.11)'/%3E%3Ccircle cx='10' cy='200' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='75' cy='220' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='160' cy='195' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='230' cy='230' r='1.5' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='290' cy='205' r='1' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='355' cy='240' r='1.5' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='110' cy='178' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='200' cy='165' r='1.5' fill='rgba(0,95,115,0.11)'/%3E%3Ccircle cx='330' cy='185' r='1' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='40' cy='285' r='1' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='100' cy='310' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='175' cy='270' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='240' cy='300' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='305' cy='275' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='365' cy='320' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='60' cy='255' r='1.5' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='150' cy='330' r='1' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='270' cy='250' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='390' cy='290' r='1.5' fill='rgba(0,95,115,0.11)'/%3E%3Ccircle cx='20' cy='360' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='90' cy='385' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='155' cy='350' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='220' cy='375' r='1.5' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='285' cy='355' r='1' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='345' cy='390' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='395' cy='365' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='75' cy='370' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='190' cy='395' r='1.5' fill='rgba(0,95,115,0.11)'/%3E%3Ccircle cx='320' cy='370' r='1' fill='rgba(0,95,115,0.15)'/%3E%3C/svg%3E");
  background-size: 130px 130px, 130px 130px, 260px 260px;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
  mask-image: linear-gradient(to bottom, transparent 0%, black 15%, black 85%, transparent 100%);
}
.cs-wrapper .cs-perche > * {
  position: relative;
  z-index: 1;
}

.iwm-hero-line--accent {
  color: var(--cta);
}

.iwm-hero-line--light {
  font-weight: 300;
}

.iwm-hero-line--medium {
  font-weight: 500;
}

.iwm-hero-line--bold {
  font-weight: 500;
}

.iwm-hero-line--heavy {
  font-weight: 800;
}

.iwm-hero-title {
  position: relative;
}

.iwm-hero-inline {
  display: inline-block;
  margin-left: 10px;
}

/* Hero gradients for black backgrounds */
.tp-hero-area[data-bg-color="var(--black)"],
.mp-hero-area[data-bg-color="var(--black)"],
.ca-hero-area[data-bg-color="var(--black)"],
.cs-hero-area[data-bg-color="var(--black)"],
.pp-hero-area[data-bg-color="var(--black)"] {
  position: relative;
  overflow: hidden;
}

.tp-hero-area[data-bg-color="var(--black)"]::before,
.mp-hero-area[data-bg-color="var(--black)"]::before,
.ca-hero-area[data-bg-color="var(--black)"]::before,
.cs-hero-area[data-bg-color="var(--black)"]::before,
.pp-hero-area[data-bg-color="var(--black)"]::before,
.tp-hero-area[data-bg-color="var(--black)"]::after,
.mp-hero-area[data-bg-color="var(--black)"]::after,
.ca-hero-area[data-bg-color="var(--black)"]::after,
.cs-hero-area[data-bg-color="var(--black)"]::after,
.pp-hero-area[data-bg-color="var(--black)"]::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.tp-hero-area[data-bg-color="var(--black)"]::before,
.mp-hero-area[data-bg-color="var(--black)"]::before,
.ca-hero-area[data-bg-color="var(--black)"]::before,
.cs-hero-area[data-bg-color="var(--black)"]::before,
.pp-hero-area[data-bg-color="var(--black)"]::before {
  background:
    radial-gradient(
      900px 420px at 12% 18%,
      rgba(104, 226, 154, 0.38),
      rgba(0, 0, 0, 0)
    ),
    radial-gradient(
      860px 420px at 86% 24%,
      rgba(240, 150, 76, 0.38),
      rgba(0, 0, 0, 0)
    ),
    radial-gradient(
      680px 280px at 55% 80%,
      rgba(96, 214, 182, 0.18),
      rgba(0, 0, 0, 0)
    );
}

.tp-hero-area[data-bg-color="var(--black)"]::after,
.mp-hero-area[data-bg-color="var(--black)"]::after,
.ca-hero-area[data-bg-color="var(--black)"]::after,
.cs-hero-area[data-bg-color="var(--black)"]::after,
.pp-hero-area[data-bg-color="var(--black)"]::after {
  background: linear-gradient(
    180deg,
    rgba(5, 9, 10, 0.08) 0%,
    rgba(5, 9, 10, 0.62) 55%,
    rgba(5, 9, 10, 0.92) 100%
  );
}

.tp-hero-area[data-bg-color="var(--black)"]::before,
.mp-hero-area[data-bg-color="var(--black)"]::before,
.ca-hero-area[data-bg-color="var(--black)"]::before,
.cs-hero-area[data-bg-color="var(--black)"]::before,
.pp-hero-area[data-bg-color="var(--black)"]::before {
  animation: iwm-hero-float 12s ease-in-out infinite alternate;
  mix-blend-mode: screen;
}

.tp-hero-area[data-bg-color="var(--black)"]::after,
.mp-hero-area[data-bg-color="var(--black)"]::after,
.ca-hero-area[data-bg-color="var(--black)"]::after,
.cs-hero-area[data-bg-color="var(--black)"]::after,
.pp-hero-area[data-bg-color="var(--black)"]::after {
  animation: iwm-hero-shift 16s ease-in-out infinite alternate;
}

@keyframes iwm-hero-float {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
    opacity: 0.9;
  }

  100% {
    transform: translate3d(10px, -12px, 0) scale(1.04);
    opacity: 1;
  }
}

@keyframes iwm-hero-shift {
  0% {
    transform: translate3d(0, 0, 0);
  }

  100% {
    transform: translate3d(-12px, 6px, 0);
  }
}

/* Desktop header */
@media (min-width: 992px) {
  .iwm-desktop-nav #iwm-primary-menu {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .iwm-desktop-nav #iwm-primary-menu > li > a {
    font-size: 16px;
    letter-spacing: 0.04em;
    color: #fff;
    border: 1px solid transparent;
    transition:
      color 0.25s ease,
      border-color 0.25s ease,
      filter 0.25s ease;
  }

  /* Header Dark: hover e active */
  body.header-dark .iwm-desktop-nav #iwm-primary-menu > li > a:hover,
  body.header-dark
    .iwm-desktop-nav
    #iwm-primary-menu
    > li.current-menu-item
    > a,
  body.header-dark
    .iwm-desktop-nav
    #iwm-primary-menu
    > li.current_page_item
    > a {
    border-color: var(--white-off);
    color: var(--white-off);
    background: transparent;
  }

  /* Header Light: hover e active */
  body.header-light .iwm-desktop-nav #iwm-primary-menu > li > a:hover,
  body.header-light
    .iwm-desktop-nav
    #iwm-primary-menu
    > li.current-menu-item
    > a,
  body.header-light
    .iwm-desktop-nav
    #iwm-primary-menu
    > li.current_page_item
    > a {
    border-color: var(--gray-mid);
    color: var(--gray-mid);
    background: transparent;
  }

  /* Bottone Contattaci */
  .iwm-header-cta {
    transition: filter 0.25s ease;
  }

  body.header-dark .iwm-header-cta {
    background: var(--white-off);
    color: var(--black);
  }

  body.header-light .iwm-header-cta {
    background: var(--gray-mid);
    color: var(--white-off);
  }

  .iwm-desktop-nav .tp-title-text span {
    text-shadow: none;
    translate: 0 0 0;
  }

  .iwm-desktop-nav .tp-title-anim:hover .tp-title-text span {
    text-shadow: none;
    translate: 0 0 0;
    transition: none;
  }

  body.header-dark .tp-header-area {
    background: transparent;
  }

  body.header-dark .iwm-desktop-nav #iwm-primary-menu > li > a {
    color: #fff;
  }

  body.header-light .iwm-desktop-nav #iwm-primary-menu > li > a {
    color: var(--gray-mid);
  }

  .header-transparent {
    transition: background 0.25s ease;
  }

  .tp-main-menu nav ul li {
    transition: filter 0.25s ease;
  }

  .tp-header-area {
    --iwm-header-height: 100px;
    min-height: unset;
  }

  .iwm-desktop-nav .tp-main-menu nav ul li {
    position: relative;
  }

  .iwm-desktop-nav .tp-main-menu nav ul li:hover > .submenu {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translate(-50%, 0) !important;
    pointer-events: auto;
  }

  .iwm-desktop-nav .tp-main-menu nav ul li .submenu {
    position: absolute;
    top: calc(100% + 14px);
    left: 50%;
    width: max-content;
    min-width: 320px;
    max-width: min(900px, 90vw);
    max-height: 60vh;
    overflow-y: auto;
    z-index: 100;
    transform: translate(-50%, -10px) !important;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.18);
    transition:
      opacity 0.25s cubic-bezier(0.2, 0.6, 0.2, 1),
      transform 0.25s cubic-bezier(0.2, 0.6, 0.2, 1);
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none;
  }

  .iwm-desktop-nav .tp-main-menu nav ul li .submenu:hover {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translate(-50%, 0) !important;
    pointer-events: auto;
  }

  .iwm-desktop-nav .tp-main-menu nav,
  .iwm-desktop-nav .tp-main-menu nav ul {
    overflow: visible;
  }

  .iwm-desktop-nav .tp-main-menu nav ul li .tp-megamenu {
    width: auto;
    margin: 0;
    padding: 22px 24px 28px;
    background: transparent;
  }

  .iwm-desktop-nav .tp-main-menu nav ul li .tp-megamenu .tp-megamenu-box {
    padding: 0 12px;
  }

  .iwm-desktop-nav .tp-main-menu nav ul li .tp-megamenu-title {
    color: var(--gray-mid);
    font-size: 12px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
  }

  .iwm-desktop-nav .tp-main-menu nav ul li .tp-megamenu li a {
    color: var(--black);
    font-size: 18px;
    padding: 6px 0;
    background: transparent;
    border-radius: 0;
  }

  .iwm-desktop-nav .tp-main-menu nav ul li .tp-megamenu li a:hover {
    color: var(--cta);
    background: transparent;
  }
}

/* Services section */
.iwm-services-section {
  position: relative;
  overflow: hidden;
}

/* Section headings */
.iwm-section-head {
  row-gap: 18px;
  align-items: flex-start;
}

.iwm-section-desc {
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
  color: rgba(0, 0, 0, 0.6);
}

.iwm-section-desc.text-white {
  color: rgba(255, 255, 255, 0.7);
}

.iwm-services-section::before {
  content: "";
  position: absolute;
  left: -120px;
  top: 40px;
  width: 320px;
  height: 320px;
  background: radial-gradient(
    circle,
    rgba(246, 168, 104, 0.25) 0%,
    rgba(246, 168, 104, 0) 70%
  );
  filter: blur(4px);
  pointer-events: none;
}

.iwm-about-link {
  position: relative;
  color: inherit;
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.3s ease;
}

.pp-about-title .iwm-about-link {
  text-decoration: none;
}

.iwm-about-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 100%;
  height: 2px;
  background: currentColor;
  transform-origin: left center;
  transform: scaleX(1);
  transition: transform 0.35s ease;
}

.iwm-about-link:hover::after {
  transform: scaleX(0);
}

.iwm-about-link:hover,
.iwm-about-link:focus-visible {
  color: var(--cta);
}

.iwm-about-preview {
  position: fixed;
  top: 0;
  left: 0;
  width: 180px;
  height: 220px;
  border-radius: 10px;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transform: translate3d(-999px, -999px, 0);
  transition:
    opacity 0.25s ease,
    transform 0.25s ease;
  pointer-events: none;
  z-index: 9999;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.25);
}

.iwm-about-preview.is-visible {
  opacity: 1;
}

.iwm-about-digital p {
  margin-bottom: 18px;
}

.iwm-about-digital p:last-child {
  margin-bottom: 0;
}

/* Digital communication section */
.iwm-digital-area {
  position: relative;
  overflow: hidden;
  //background: round;
  //background-image: url("/wp-content/uploads/2026/01/iwm-comunicazione-digitale-bg.webp");
}

.iwm-digital-area::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background-size: auto, auto;
  background-position: center, center;
  pointer-events: none;
}

.iwm-digital-panel {
  position: relative;
  z-index: 1;
  padding: 28px 24px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: hidden;
}

.iwm-digital-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.06) 0,
      rgba(0, 0, 0, 0.06) 1px,
      transparent 1px,
      transparent 90px
    ),
    repeating-linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.05) 0,
      rgba(0, 0, 0, 0.05) 1px,
      transparent 1px,
      transparent 80px
    );
  opacity: 0.45;
  pointer-events: none;
  z-index: 0;
}

.iwm-digital-panel--wide {
  padding: 64px 32px;
}

.iwm-digital-content {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 1420px;
  margin: 0 auto;
}

.iwm-digital-float-layer {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.iwm-digital-float-icon {
  position: absolute;
  width: 64px;
  height: 64px;
  opacity: 0.25;
  color: rgba(0, 0, 0, 0.6);
  animation: iwm-float-icon 12s ease-in-out infinite;
}

.iwm-digital-float-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.iwm-digital-float-icon:nth-child(1) {
  top: 6%;
  left: 6%;
  animation-delay: -2s;
}

.iwm-digital-float-icon:nth-child(2) {
  top: 12%;
  left: 28%;
  width: 70px;
  height: 70px;
  animation-delay: -5s;
}

.iwm-digital-float-icon:nth-child(3) {
  top: 8%;
  right: 6%;
  width: 58px;
  height: 58px;
  animation-delay: -3s;
}

.iwm-digital-float-icon:nth-child(4) {
  top: 18%;
  right: 18%;
  width: 72px;
  height: 72px;
  animation-delay: -6s;
}

.iwm-digital-float-icon:nth-child(5) {
  top: 22%;
  left: 12%;
  width: 60px;
  height: 60px;
  animation-delay: -4s;
}

.iwm-digital-float-icon:nth-child(6) {
  top: 30%;
  left: 62%;
  width: 66px;
  height: 66px;
  animation-delay: -7s;
}

.iwm-digital-float-icon:nth-child(7) {
  top: 40%;
  right: 8%;
  width: 54px;
  height: 54px;
  animation-delay: -8s;
}

.iwm-digital-float-icon:nth-child(8) {
  bottom: 24%;
  left: 8%;
  width: 68px;
  height: 68px;
  animation-delay: -9s;
}

.iwm-digital-float-icon:nth-child(9) {
  bottom: 18%;
  left: 30%;
  width: 60px;
  height: 60px;
  animation-delay: -10s;
}

.iwm-digital-float-icon:nth-child(10) {
  bottom: 22%;
  right: 24%;
  width: 56px;
  height: 56px;
  animation-delay: -11s;
}

.iwm-digital-float-icon:nth-child(11) {
  bottom: 10%;
  right: 6%;
  width: 64px;
  height: 64px;
  animation-delay: -12s;
}

.iwm-digital-float-icon:nth-child(12) {
  top: 56%;
  left: 4%;
  width: 62px;
  height: 62px;
  animation-delay: -13s;
}

@keyframes iwm-float-icon {
  0% {
    transform: translate3d(0, 0, 0);
  }

  50% {
    transform: translate3d(0, -12px, 0);
  }

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

.iwm-digital-eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(0, 95, 115, 0.12);
  color: var(--iwm-green);
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin-bottom: 14px;
}

.iwm-digital-accent {
  display: block;
  color: var(--cta);
}

.iwm-digital-lead {
  margin: 46px 0 25px;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.7);
  max-width: 60ch;
  margin-left: auto;
  margin-right: auto;
}

.iwm-digital-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}

.iwm-digital-chip {
  padding: 10px 12px;
  border-radius: 999px;
  text-align: center;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: rgba(0, 0, 0, 0.06);
}

.iwm-digital-chip--green {
  background: rgba(0, 95, 115, 0.12);
  color: var(--iwm-green);
}

.iwm-digital-chip--coral {
  background: rgba(236, 110, 94, 0.14);
  color: var(--cta);
}

.iwm-digital-chip--dark {
  background: rgba(15, 16, 18, 0.08);
  color: rgba(0, 0, 0, 0.6);
}

.iwm-digital-cta {
  font-weight: 600;
  color: var(--iwm-green);
  margin-bottom: 36px;
  max-width: 48ch;
  margin-left: auto;
  margin-right: auto;
}

.iwm-digital-stack {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 14px;
  padding-top: 18px;
}

.iwm-digital-card {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 14px;
  padding: 16px 18px;
  border-radius: 10px;
  background: linear-gradient(
    140deg,
    rgba(255, 255, 255, 0.9),
    rgba(255, 249, 238, 0.85)
  );
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08);
}

.iwm-digital-icon {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 0.1em;
  color: var(--iwm-green);
  background: rgba(0, 95, 115, 0.12);
}

.iwm-digital-card-title {
  margin: 0 0 6px;
  font-size: 16px;
}

.iwm-digital-card-text {
  margin: 0;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.6);
}

.iwm-digital-lines {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}

.iwm-digital-lines span {
  height: 2px;
  background: linear-gradient(90deg, var(--iwm-green), transparent);
  opacity: 0.5;
}

/* Service & blog hero */
.iwm-service-hero.iwm-hero-area {
  max-height: 100vh;
  padding-top: 120px;
  padding-bottom: 90px;
}

.iwm-blog-hero.iwm-hero-area {
  max-height: 55vh !important;
  padding-top: 120px;
  padding-bottom: 90px;
}

.iwm-service-hero .mp-hero-content,
.iwm-blog-hero .mp-hero-content {
  max-width: 1420px;
  gap: 24px;
}

.iwm-service-hero .iwm-hero-title,
.iwm-blog-hero .iwm-hero-title {
  margin-bottom: 16px;
}

.iwm-service-hero-lead,
.iwm-blog-hero-lead {
  font-size: 22px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.78);
  max-width: 52ch;
  margin-bottom: 28px;
}

.iwm-service-problem {
  background: var(--gray-light);
}

.iwm-service-problem-grid,
.iwm-service-grid-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.iwm-service-card-lite {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  padding: 22px 24px;
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.06);
}

.iwm-service-card-lite h3 {
  margin: 0 0 10px;
  font-size: 20px;
  color: var(--black);
}

.iwm-service-card-lite p {
  margin: 0 0 12px;
  color: var(--gray-mid);
}

.iwm-service-card-lite ul {
  margin: 0;
  padding-left: 18px;
  color: var(--gray-mid);
}

.iwm-service-panel {
  margin-top: 30px;
  padding: 26px 28px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.06);
}

.iwm-service-panel h3 {
  margin: 0 0 12px;
  font-size: 22px;
  color: var(--black);
}

.iwm-service-panel p {
  margin: 0;
  color: var(--gray-mid);
}

.iwm-service-steps {
  counter-reset: service-step;
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 22px;
}

.iwm-service-steps li {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  padding: 22px 24px 22px 64px;
  position: relative;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.05);
}

.iwm-service-steps li::before {
  counter-increment: service-step;
  content: counter(service-step, decimal-leading-zero);
  position: absolute;
  left: 22px;
  top: 22px;
  font-size: 12px;
  letter-spacing: 0.2em;
  color: rgba(0, 0, 0, 0.4);
}

.iwm-service-steps h3 {
  margin: 0 0 8px;
  font-size: 20px;
  color: var(--black);
}

.iwm-service-steps p {
  margin: 0;
  color: var(--gray-mid);
}

.iwm-service-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
  color: var(--gray-mid);
}

.iwm-service-checklist li {
  position: relative;
  padding-left: 22px;
}

.iwm-service-checklist li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--cta);
}

.iwm-service-cta {
  background: var(--gray-light);
}

.iwm-service-cta-inner {
  display: flex;
  gap: 32px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 38px 40px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
}

.iwm-service-cta-content {
  flex: 1 1 520px;
}

.iwm-service-cta-actions {
  flex: 0 0 auto;
}

@media (max-width: 991px) {
  .iwm-service-problem-grid,
  .iwm-service-grid-2 {
    grid-template-columns: 1fr;
  }

  .iwm-service-hero.iwm-hero-area,
  .iwm-blog-hero.iwm-hero-area {
    min-height: auto;
    padding-top: 110px;
  }

  .iwm-service-cta-inner {
    padding: 28px;
  }
}

@media (max-width: 991px) {
  .iwm-digital-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .iwm-digital-stack {
    margin-top: 24px;
  }

  .iwm-digital-brick {
    font-size: 10px;
    padding: 6px 10px;
  }

  .iwm-digital-brick:nth-child(n + 13) {
    display: none;
  }
}

@media (max-width: 767px) {
  .iwm-digital-brick {
    opacity: 0.45;
  }
}

.iwm-services-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 26px;
}

.iwm-service-card {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  background: #0f0f10;
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition:
    transform 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease;
}

.iwm-service-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.08) 0%,
    rgba(255, 255, 255, 0) 60%
  );
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
}

.iwm-service-card:hover {
  transform: translateY(-8px);
  border-color: rgba(255, 255, 255, 0.2);
  box-shadow: 0 24px 44px rgba(0, 0, 0, 0.3);
}

.iwm-service-card:hover::after {
  opacity: 1;
}

.iwm-service-link {
  display: grid;
  grid-template-rows: 180px 1fr;
  height: 100%;
  color: inherit;
}

.iwm-service-media {
  position: relative;
  overflow: hidden;
}

.iwm-service-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.02);
  transition: transform 0.5s ease;
}

.iwm-service-card:hover .iwm-service-media img {
  transform: scale(1.08);
}

.iwm-service-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 22px 20px 24px;
}

.iwm-service-title {
  font-size: 26px;
  letter-spacing: -0.02em;
  color: #fff;
}

.iwm-service-desc {
  color: rgba(255, 255, 255, 0.68);
  line-height: 1.55;
}

.iwm-service-cta {
  margin-top: auto;
  font-size: 14px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
  transition:
    color 0.35s ease,
    transform 0.35s ease;
}

.iwm-service-cta-title {
  font-size: clamp(46px, 6vw, 6vw);
  font-weight: 500;
  line-height: 1.15;
  margin-bottom: 30px;
}

.hamburger-open-btn .tp-title-text {
  color: var(--white-off);
}

body.header-light .hamburger-open-btn .tp-title-text {
  color: var(--gray-mid);
}

.iwm-service-card:hover .iwm-service-cta {
  color: #fff;
  transform: translateX(6px);
}

@media (max-width: 1200px) {
  .iwm-services-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .iwm-services-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .iwm-service-link {
    grid-template-rows: 200px 1fr;
  }
}

/* Services tech layout */
.iwm-services-tech {
  position: relative;
  overflow: hidden;
}

.iwm-services-tech::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.06) 0,
      rgba(0, 0, 0, 0.06) 1px,
      transparent 1px,
      transparent 89.2px
    ),
    repeating-linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.05) 0,
      rgba(0, 0, 0, 0.05) 1px,
      transparent 0px,
      transparent 71px
    );
  opacity: 0.5;
  pointer-events: none;
}

.iwm-services-tech > .container {
  position: relative;
  z-index: 1;
}

.iwm-services-tech .tp-service-img-wrapper {
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.12);
  box-shadow: 0 24px 50px rgba(0, 0, 0, 0.08);
}

.iwm-services-tech .tp-service-img-wrapper::after {
  content: "";
  position: absolute;
  inset: 12px;
  border: 1px dashed rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  pointer-events: none;
}

.iwm-services-tech .tp-service-img-wrapper .hover-image img {
  filter: saturate(0.85) contrast(1.05);
}

.iwm-services-tech .tp-service-list-wrap {
  counter-reset: service;
}

.iwm-services-tech .tp-service-item {
  position: relative;
  padding: 18px 0 0px 0px;
}

.iwm-services-tech .tp-service-title a {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  color: rgba(0, 0, 0, 0.35);
  transition: color 0.2s ease;
}

.iwm-services-tech .tp-service-title,
.iwm-services-tech .tp-service-title:hover {
  background-image: none;
  background-size: auto;
  transition: none;
}

.iwm-services-tech .tp-service-icon {
  opacity: 0;
  visibility: hidden;
  transform: translateY(-25px);
  transition: all 0.5s ease;
  color: rgba(0, 0, 0, 0.35);
  flex: 0 0 auto;
}

.iwm-services-tech .tp-service-item:hover .tp-service-icon {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  color: var(--black);
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .iwm-services-tech .tp-service-title a {
    color: transparent;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(
      90deg,
      var(--black) 0%,
      var(--black) 50%,
      rgba(0, 0, 0, 0.35) 50%,
      rgba(0, 0, 0, 0.35) 100%
    );
    background-size: 200% 100%;
    background-position: 100% 0;
    -webkit-background-clip: text;
    background-clip: text;
    transition: background-position 0.7s ease;
  }

  .iwm-services-tech .tp-service-item:hover .tp-service-title a {
    background-position: 0 0;
  }
}

@media (max-width: 991px) {
  .iwm-services-tech .tp-service-list-wrap {
    margin-left: 0;
  }
}

@media (max-width: 574.98px) {
  .iwm-portfolio-carousel {
    padding: 0 10px 0px 0vw;
  }
}

/* Portfolio carousel */
.iwm-portfolio-section {
  position: relative;
  overflow: hidden;
  background-position: center;
}

.iwm-portfolio-section .reveal-text .char {
  color: rgba(255, 255, 255, 0.45);
}

.iwm-portfolio-section .reveal-text .char.revealed {
  color: #fff;
}

.iwm-portfolio-swiper {
  overflow: visible;
}

.iwm-portfolio-swiper .swiper-wrapper {
  align-items: stretch;
}

.iwm-portfolio-swiper .swiper-slide {
  width: 65vw;
}

.iwm-portfolio-card {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 0;
  color: #fff;
  position: relative;
}

.iwm-portfolio-media {
  display: block;
  border-radius: 10px;
  overflow: hidden;
}

.iwm-portfolio-media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  transition: transform 0.6s ease;
  transform: translate3d(0, var(--iwm-parallax, 0), 0) scale(1.06);
  will-change: transform;
}

.iwm-portfolio-card:hover .iwm-portfolio-media img {
  transform: translate3d(0, var(--iwm-parallax, 0), 0) scale(1.09);
}

.mg-portfolio-thumb img {
  transition: transform 0.6s ease;
  transform: translate3d(0, var(--iwm-parallax, 0), 0) scale(1) !important;
}

.iwm-parallax {
  will-change: transform;
  --iwm-parallax: 0px;
}

.mg-portfolio-item:hover .mg-portfolio-thumb img {
  transform: translate3d(0, var(--iwm-parallax, 0), 0) scale(1.03) !important;
}

.iwm-portfolio-body {
  display: block;
}

.iwm-portfolio-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.iwm-portfolio-category {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.9);
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 999px;
  padding: 8px 19px;
  line-height: 1;
  transition:
    background var(--transition-fast),
    color var(--transition-fast),
    border-color var(--transition-fast);
}

.iwm-portfolio-category:hover {
  background: #fff;
  color: var(--black);
  border-color: #fff;
}

.iwm-portfolio-title {
  margin: 0;
  font-size: clamp(28px, 3vw, 40px);
  line-height: 1.1;
}

.iwm-portfolio-title a {
  color: #fff;
  text-decoration: none;
}

.iwm-portfolio-meta {
  position: relative;
}

@media (max-width: 574.98px) {
  .iwm-portfolio-category {
    position: absolute;
    top: -60px;
    left: 12px;
    z-index: 2;
    background: rgba(0, 0, 0, 0.65);
    border-color: rgba(255, 255, 255, 0.6);
  }

  .iwm-portfolio-category {
    border-radius: 10px;
  }
}

.iwm-portfolio-btn-mobile {
  display: none;
}

/* Blog cards */
.iwm-blog-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 40px 34px;
}

.iwm-blog-card {
  display: flex;
  flex-direction: column;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  text-align: left;
  transition: transform 0.35s ease;
}

.iwm-blog-card:hover {
  transform: translateY(-3px);
}

.iwm-blog-media {
  display: block;
  border-radius: 10px;
  overflow: hidden;
}

.iwm-blog-media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform 0.45s ease;
}

.iwm-blog-card:hover .iwm-blog-media img {
  transform: scale(1.03);
}

.iwm-blog-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.iwm-blog-excerpt {
  margin: 0;
  color: var(--gray-mid);
  max-width: 75ch;
}

.iwm-blog-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: center;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.55);
}

.iwm-blog-category {
  color: var(--iwm-green);
  text-decoration: none;
  font-weight: 600;
}

.iwm-blog-title {
  margin: 0;
}

.iwm-blog-title a {
  color: var(--black);
  text-decoration: none;
}

.iwm-blog-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--black);
  text-decoration: none;
  transition:
    color var(--transition-fast),
    transform var(--transition-fast);
}

.iwm-blog-cta-icon {
  font-size: 16px;
}

.iwm-blog-cta:hover {
  color: var(--cta);
  transform: translateX(4px);
  text-decoration: none;
}

.iwm-blog-grid-page .iwm-blog-card {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
  margin-bottom: 0;
}

.iwm-blog-grid-page .iwm-blog-card:hover {
  transform: none;
  box-shadow: none;
}

.iwm-blog-grid-page .iwm-blog-body {
  padding: 6px 0 0;
}

.iwm-blog-grid-page .iwm-blog-meta {
  font-size: 11px;
}

.iwm-blog-grid-page .row.gx-60 {
  --bs-gutter-x: 2.5rem;
  --bs-gutter-y: 2.5rem;
}

@media (max-width: 767px) {
  .iwm-blog-grid-page .row.gx-60 {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 2rem;
  }
}

.tp-blog-tag {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.tp-blog-tag a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 12px;
  border-radius: 999px;
  background: transparent;
  border: 1px solid transparent;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-decoration: none;
  color: var(--black);
  transition:
    color 0.2s ease,
    background-color 0.2s ease;
}

.tp-blog-tag a:hover {
  color: var(--black);
  background: rgba(0, 0, 0, 0.06);
}

@media (max-width: 767px) {
  .tp-blog-tag {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 8px;
    margin-right: -24px;
    padding-right: 24px;
  }

  .tp-blog-tag a {
    white-space: nowrap;
  }
}

.iwm-blog-carousel {
  margin-top: 12px;
  position: relative;
}

.iwm-blog-swiper {
  overflow: visible;
}

.iwm-blog-swiper .swiper-slide {
  height: auto;
  width: 78%;
}

.iwm-blog-swiper .swiper-slide .iwm-blog-card {
  opacity: 0.7;
  transform: scale(0.96);
  transition:
    transform 0.35s ease,
    opacity 0.35s ease;
}

.iwm-blog-swiper .swiper-slide-active .iwm-blog-card {
  opacity: 1;
  transform: scale(1);
}

.iwm-blog-mobile {
  display: none;
}

.iwm-blog-controls {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  position: absolute;
  left: 0;
  right: 0;
  top: 40%;
  transform: translateY(-50%);
  padding: 0 8px;
  pointer-events: none;
}

.iwm-blog-btn {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: none;
  background: var(--black);
  color: #fff;
  font-size: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 0.85;
  transition:
    opacity 0.2s ease,
    transform 0.2s ease;
  pointer-events: auto;
}

.iwm-blog-btn:hover {
  opacity: 1;
  transform: translateY(-2px);
}

.iwm-blog-btn-mobile {
  display: none;
}

@media (max-width: 991px) {
  .iwm-blog-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767px) {
  .cs-blog-btn-wrap {
    display: none;
  }

  .iwm-blog-grid {
    display: none;
  }

  .iwm-blog-mobile {
    display: block;
  }

  .iwm-blog-swiper {
    padding: 0 18px;
  }

  .iwm-blog-controls {
    top: 42%;
    padding: 0 4px;
  }

  .iwm-blog-btn-mobile {
    display: block;
  }

  /* Prevent horizontal overflow on blog page */
  .iwm-blog-grid-page .container-iwm {
    padding-left: 16px;
    padding-right: 16px;
    overflow-x: hidden;
  }

  .tp-blog-masonary-area {
    overflow-x: hidden;
  }
}

.iwm-hero-signals {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 6px;
}

.iwm-hero-signal {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.8);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  backdrop-filter: blur(6px);
}

@media (max-width: 767px) {
  .iwm-hero-area .mp-hero-content {
    text-align: center;
  }

  .iwm-hero-title {
    transform: none;
    align-items: center;
  }

  .iwm-hero-line--xxl,
  .iwm-hero-line--sm,
  .iwm-hero-line--xl,
  .iwm-hero-line--md,
  .iwm-hero-line--lg {
    transform: none;
  }

  .iwm-hero-area .mp-hero-btn {
    flex-direction: column;
    align-items: stretch;
  }

  .iwm-hero-area .mp-hero-btn .tp-btn {
    width: 100%;
    justify-content: center;
  }

  .iwm-hero-signals {
    justify-content: center;
  }
}

/* ===================================================================
   FIX: Offcanvas overlay blocking clicks
   =================================================================== */
/* Prevent offcanvas from blocking clicks when closed */
.tp-offcanvas-2-area {
  pointer-events: none;
}

/* Enable pointer events when menu is open */
.tp-offcanvas-2-area.menu-open,
.tp-offcanvas-2-area.menu-open-temp {
  pointer-events: auto;
  z-index: 100000 !important;
}

/* Always allow clicks on the menu toggle button */
.tp-offcanvas-2-area .tp-offcanvas-open-btn,
.tp-offcanvas-2-area .tp-offcanvas-close-toggle {
  pointer-events: auto;
}

/* ═══════════════════════════════════════════════════
   BOTTOM DRAWER MOBILE MENU
   ═══════════════════════════════════════════════════ */

/* ── Backdrop overlay ── */
.tp-offcanvas-2-area .offcanvas-bg {
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
  background: rgba(0, 0, 0, 0.45) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
  clip-path: none !important;
  opacity: 0;
  transition: opacity 0.35s ease !important;
  pointer-events: none;
}
.tp-offcanvas-2-area.menu-open .offcanvas-bg,
.tp-offcanvas-2-area.menu-open-temp .offcanvas-bg {
  clip-path: none !important;
  opacity: 1;
  pointer-events: auto;
}

/* ── Drawer panel: slides up from bottom ── */
.tp-offcanvas-2-wrapper {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  top: auto !important;
  width: 100% !important;
  max-height: 92dvh;
  transform: translateY(105%) !important;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
  border-radius: 10px 10px 0 0 !important;
  overflow: hidden !important;
  background-color: #fff9ee !important;
  background-image: url("data:image/svg+xml,%3Csvg width='400' height='400' viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='23' cy='47' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='87' cy='12' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='145' cy='78' r='1.5' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='210' cy='33' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='278' cy='61' r='2' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='340' cy='22' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='380' cy='90' r='1.5' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='55' cy='130' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='118' cy='155' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='190' cy='112' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='250' cy='140' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='315' cy='125' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='370' cy='148' r='1' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='10' cy='200' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='75' cy='220' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='160' cy='195' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='230' cy='230' r='1.5' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='290' cy='205' r='1' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='355' cy='240' r='1.5' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='40' cy='285' r='1' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='100' cy='310' r='2' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='175' cy='270' r='1.5' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='240' cy='300' r='1' fill='rgba(0,95,115,0.13)'/%3E%3Ccircle cx='305' cy='275' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='365' cy='320' r='1' fill='rgba(0,95,115,0.14)'/%3E%3Ccircle cx='20' cy='360' r='1.5' fill='rgba(0,95,115,0.17)'/%3E%3Ccircle cx='90' cy='385' r='1' fill='rgba(0,95,115,0.12)'/%3E%3Ccircle cx='155' cy='350' r='2' fill='rgba(0,95,115,0.15)'/%3E%3Ccircle cx='220' cy='375' r='1.5' fill='rgba(0,95,115,0.1)'/%3E%3Ccircle cx='285' cy='355' r='1' fill='rgba(0,95,115,0.16)'/%3E%3Ccircle cx='345' cy='390' r='2' fill='rgba(0,95,115,0.18)'/%3E%3Ccircle cx='395' cy='365' r='1' fill='rgba(0,95,115,0.13)'/%3E%3C/svg%3E") !important;
  background-size: 400px 400px !important;
  clip-path: none !important;
  z-index: 2;
  padding: 0 !important;
  overflow-y: auto;
  overflow-x: hidden;
}
.tp-offcanvas-2-area.menu-open .tp-offcanvas-2-wrapper,
.tp-offcanvas-2-area.menu-open-temp .tp-offcanvas-2-wrapper {
  transform: translateY(0) !important;
  clip-path: none !important;
}

/* ── Drag handle bar ── */
.iwm-drawer-handle {
  width: 40px;
  height: 4px;
  background: rgba(255, 255, 255, 0.35);
  border-radius: 2px;
  margin: 0 auto 14px;
  flex-shrink: 0;
}

/* ── Drawer header: logo + X ── */
.iwm-drawer-header {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  padding: 14px 24px 18px;
  background: #0f1f24;
  border-radius: 0;
  flex-shrink: 0;
}
.iwm-drawer-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.iwm-drawer-logo {
  height: 48px;
  width: 48px;
  object-fit: contain;
  display: block;
}

/* ── tp-offcanvas-2-left: neutral container (no fullscreen animation) ── */
.tp-offcanvas-2-left {
  display: block !important;
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  min-height: auto !important;
  padding-top: 0 !important;
}

/* ── Animation speed: override main.css 1.5s delays ── */
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li {
  transition: opacity 0.3s ease-out, visibility 0.3s ease-out !important;
  transition-delay: 0s !important;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li > a {
  transition: opacity 0.3s ease-out, transform 0.3s ease-out, visibility 0.3s ease-out !important;
  transition-delay: 0s !important;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li:nth-child(1) > a { transition-delay: 0.05s !important; }
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li:nth-child(2) > a { transition-delay: 0.1s !important; }
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li:nth-child(3) > a { transition-delay: 0.15s !important; }
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li:nth-child(4) > a { transition-delay: 0.2s !important; }
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li:nth-child(5) > a { transition-delay: 0.25s !important; }
.tp-offcanvas-2-wrapper .tp-header-logo {
  transition: opacity 0.3s ease-out, transform 0.3s ease-out, visibility 0.3s ease-out !important;
  transition-delay: 0s !important;
}

/* ── Menu items: drawer style ── */
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex !important;
  flex-direction: column;
  align-items: stretch !important;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  overflow: visible !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  position: relative;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li:last-child {
  border-bottom: none;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li > a {
  display: flex !important;
  align-items: center;
  flex: 1;
  padding: 22px 24px !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #1a1a1a !important;
  text-decoration: none;
  line-height: 1.2 !important;
  letter-spacing: -0.01em;
}

/* ── + / × toggle button: same row as the menu item label ── */
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li > a {
  order: 1;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li .tp-menu-close {
  position: static !important;
  order: 2;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  margin-right: 18px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #1a1a1a;
  background: none;
  border: none;
  cursor: pointer;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li .tp-submenu {
  order: 3;
}

/* ── Menu mobile: sottomenu WordPress .sub-menu chiuso di default, aperto con toggle ── */
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li.menu-item-has-children > .sub-menu {
  display: none !important;
  order: 3;
  width: 100% !important;
  flex-basis: 100% !important;
  background: rgba(0, 0, 0, 0.04) !important;
  border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
  margin: 0 !important;
  list-style: none !important;
  padding: 0 !important;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li.menu-item-has-children.iwm-submenu-open > .sub-menu {
  display: block !important;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li.menu-item-has-children > .sub-menu li a {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #555 !important;
  padding: 13px 24px 13px 36px !important;
  line-height: 1.3 !important;
  display: block !important;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li.menu-item-has-children > .sub-menu li a:hover {
  color: #005f73 !important;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li .iwm-submenu-toggle {
  position: static !important;
  order: 2;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  margin-right: 18px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  line-height: 1;
  color: #1a1a1a;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li.menu-item-has-children {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
}

/* prevent legacy rotation on active icon — we swap fa-plus/fa-xmark via JS */
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li.active > .tp-menu-close i,
.tp-offcanvas-menu ul li.active > .tp-menu-close i {
  transform: none !important;
  -webkit-transform: none !important;
}

/* ── Submenu / Mega-menu in drawer ── */
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li .tp-submenu {
  width: 100% !important;
  flex-basis: 100% !important;
  background: rgba(0, 0, 0, 0.04) !important;
  border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
  margin: 0 !important;
  overflow: visible !important;
}
/* megamenu inner list: stack vertically, no horizontal overflow */
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li .tp-megamenu {
  width: 100% !important;
  margin: 0 !important;
  overflow: visible !important;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li .tp-megamenu .tp-megamenu-list {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}
/* all submenu link levels */
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li .submenu > li > a,
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li .tp-submenu > li > a,
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li .tp-megamenu li a,
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li .tp-megamenu li a.tp-megamenu-title {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #555 !important;
  padding: 13px 24px 13px 36px !important;
  line-height: 1.3 !important;
  display: block !important;
  transform: none !important;
  letter-spacing: 0 !important;
}
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li .tp-megamenu li a:hover,
.tp-offcanvas-2-wrapper .tp-offcanvas-menu > nav > ul > li .tp-megamenu li a.tp-megamenu-title:hover {
  transform: none !important;
  color: #005f73 !important;
}



@media (max-width: 991px) {
  .iwm-service-card {
    padding: 20px 16px;
  }

  .iwm-service-thumb {
    max-width: 100%;
  }

  .iwm-portfolio-media {
    border-radius: 10px;
  }
}

@media (max-width: 768px) {
  .iwm-portfolio-swiper .swiper-slide {
    width: 88vw;
  }

  .iwm-portfolio-btn-desktop {
    display: none;
  }

  .iwm-portfolio-btn-mobile {
    display: block;
  }
}

/* ==========================================
   SINGLE SERVIZIO TEMPLATE STYLES
   Stili dedicati al template single-servizio.php
   Design ispirato a Eye Studios con palette IWM
   ========================================== */

/* Hero Section */
.iwm-service-hero {
  background: var(--iwm-green);
  height: 100vh;
  position: relative;
  align-content: center;
}

.iwm-service-hero--ai {
  background: var(--iwm-green);
}

.iwm-service-hero--ai .iwm-service-hero-title,
.iwm-service-hero--ai .iwm-service-hero-subtitle {
  color: var(--white-off);
}

.iwm-service-hero--ai .iwm-badge {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.35);
  color: var(--white-off);
}

.iwm-service-hero--ai .iwm-badge:hover {
  background: var(--cta);
  border-color: var(--cta);
  color: var(--white-off);
}

.iwm-service-hero-content {
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
}

.iwm-service-hero-title {
  font-size: clamp(48px, 7vw, 84px);
  font-weight: 500;
  line-height: 1.1;
  color: var(--white-off);
  margin-bottom: 30px;
}

.iwm-service-hero-title--ai {
  font-size: clamp(48px, 6.5vw, 6.5vw);
}

.color-cta {
  color: var(--cta);
}

.iwm-service-hero-subtitle {
  font-size: clamp(16px, 1.1vw, 2vw);
  line-height: 1.6;
  color: var(--white-off);
  max-width: 800px;
  margin: 0 auto 40px;
}

.iwm-hero-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.iwm-badge {
  display: inline-block;
  border: 1px solid #e5e5e5;
  border-radius: 10px;
  padding: 4px 12px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--white-off);
  transition: all 0.25s ease;
}

.iwm-badge:hover {
  border-color: var(--cta);
  background: var(--cta);
  color: var(--white-off);
}

/* Section patterns and hand-drawn accents */
.iwm-section-pattern {
  position: relative;
  overflow: hidden;
}

.iwm-section-pattern::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.35;
  z-index: 0;
}

.iwm-section-pattern > * {
  position: relative;
  z-index: 1;
}

.iwm-pattern-grid::before {
  background-image:
    linear-gradient(to right, rgba(0, 0, 0, 0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(0, 0, 0, 0.06) 1px, transparent 1px);
  background-size: 140px 140px;
}

.iwm-pattern-dots::before {
  background-image: radial-gradient(rgba(0, 0, 0, 0.08) 1px, transparent 1px);
  background-size: 120px 120px;
}

.iwm-pattern-lines::before {
  background-image: linear-gradient(
    115deg,
    rgba(0, 0, 0, 0.08),
    transparent 50%
  );
}

.iwm-doodle {
  position: relative;
  display: inline-block;
}

.iwm-doodle::after {
  content: "";
  position: absolute;
  left: -6px;
  right: -6px;
  bottom: -8px;
  height: 10px;
  border-radius: 999px;
  border: 2px solid var(--cta);
  background: rgba(255, 112, 67, 0.18);
  transform: rotate(-1deg);
}

.iwm-scenario-center {
  max-width: 100%;
  margin: 0 auto;
}

/* Symptoms */
.iwm-symptoms-alt {
  position: relative;
}

.iwm-symptoms-alt::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 42%;
  height: 100%;
  background-image: radial-gradient(rgba(0, 0, 0, 0.08) 1px, transparent 1px);
  background-size: 90px 90px;
  opacity: 0.35;
  pointer-events: none;
}

.iwm-symptoms-bs {
  font-family: "Sora", sans-serif;
}

.iwm-symptoms-desc {
  font-size: 18px;
  line-height: 1.7;
}

.iwm-symptoms-bs .iwm-summary-text {
  font-size: 17px;
  line-height: 1.8;
}

.iwm-cta-highlight {
  color: var(--cta);
}

.iwm-symptoms-bs .tp-faq-item {
  margin-bottom: 14px;
  border-radius: 10px;
  overflow: hidden;
  padding-bottom: 8px;
}

.iwm-symptoms-bs .tp-faq-button {
  font-size: 24px;
  line-height: 1.5;
  padding: 14px 16px;
  color: var(--gray-mid);
  align-items: center;
}

.iwm-symptoms-bs .tp-faq-button .iwm-faq-icon {
  width: 56px;
  height: 56px;
  border-radius: 10px;
  background: rgba(255, 112, 67, 0.12);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--cta);
  margin-right: 16px;
}

.iwm-symptoms-bs .tp-faq-button .iwm-faq-icon svg {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.iwm-symptoms-bs .tp-faq-body {
  font-size: 16px;
  line-height: 1.7;
  color: var(--gray-mid);
}

.iwm-symptoms-media {
  background: transparent;
  border-radius: 0;
  padding: 0;
  border: none;
  box-shadow: none;
}

.iwm-symptoms-media img {
  width: 100%;
  height: auto;
  border-radius: 10px;
  display: block;
}

.iwm-summary-text {
  font-size: 16px;
  line-height: 1.7;
  color: var(--gray-mid);
  margin: 0;
}

/* Service Sections */
.iwm-service-section {
  position: relative;
}

.iwm-section-light {
  background: var(--background);
}

.iwm-section-dark {
  background: var(--black);
  color: var(--white-off);
}

.iwm-section-label {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gray-mid);
  margin-bottom: 40px;
}

.iwm-section-label span:first-child {
  color: var(--cta);
}

.text-white {
  color: var(--white-off) !important;
}

.iwm-highlight {
  color: var(--cta);
  position: relative;
}

.iwm-section-desc {
  font-size: 18px;
  line-height: 1.7;
  color: var(--gray-mid);
  max-width: 100%;
}

.iwm-lead-text {
  font-size: 20px;
  line-height: 1.7;
  color: var(--gray-mid);
  max-width: 100%;
}

/* Process carousel */
.iwm-process-carousel {
  position: relative;
  padding: 10px 52px 0;
}

.iwm-process-carousel::before {
  content: "";
  position: absolute;
  left: 52px;
  right: 52px;
  top: 38px;
  height: 2px;
  background: rgba(0, 0, 0, 0.12);
}

.iwm-process-swiper {
  overflow: hidden;
}

.iwm-process-card {
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  padding: 26px 24px 28px;
  height: 100%;
  min-height: 260px;
}

.iwm-process-top {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 16px;
}

.iwm-process-num {
  width: 72px;
  height: 72px;
  border-radius: 10px;
  border: 2px solid var(--cta);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  letter-spacing: 0.16em;
  color: var(--cta);
  background: rgba(255, 112, 67, 0.08);
  font-weight: 500;
}

.iwm-process-card h3 {
  font-size: 20px;
  font-weight: 500;
  color: var(--black);
  margin-bottom: 12px;
}

.iwm-process-card p {
  font-size: 16px;
  line-height: 1.7;
  color: var(--gray-mid);
  margin: 0;
}

.iwm-process-nav {
  position: absolute;
  top: 24px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: var(--black);
  transition: all 0.2s ease;
  z-index: 2;
}

.iwm-process-nav:hover {
  border-color: var(--cta);
  color: var(--cta);
}

.iwm-process-prev {
  left: 0;
}

.iwm-process-next {
  right: 0;
}

/* Scalability rail */
.iwm-growth-rail {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  margin-bottom: 30px;
}

.iwm-growth-step {
  padding: 20px;
  border-radius: 10px;
  border: 1px dashed rgba(0, 0, 0, 0.15);
  background: #fff;
}

.iwm-growth-num {
  display: inline-block;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.2em;
  color: var(--cta);
  margin-bottom: 10px;
}

.iwm-growth-step h4 {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 8px;
  color: var(--black);
}

.iwm-growth-step p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--gray-mid);
  margin: 0;
}

.iwm-growth-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
}

.iwm-growth-badge {
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #fff;
  font-size: 13px;
  font-weight: 600;
  color: var(--black);
}

.iwm-icon-hint {
  display: block;
  font-size: 11px;
  line-height: 1.4;
  color: var(--gray-mid);
  margin-top: 6px;
}

/* Final CTA */
.iwm-service-cta {
  background: var(--cta);
  padding: 120px 0;
}

.tp-btn-cta {
  background: var(--cta);
  color: var(--white-off);
  padding: 18px 40px;
  font-size: 17px;
  font-weight: 600;
  border-radius: 10px;
  border: 2px solid var(--cta);
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.tp-btn-cta:hover {
  background: transparent;
  border-color: var(--white-off);
  color: var(--white-off);
  transform: translateY(-2px);
}

/* Solutions Cards */
.iwm-solutions-cards-wrapper {
  max-width: 1400px;
  margin: 0 auto;
}

.iwm-solutions-cards {
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
}

.iwm-solution-card {
  border-radius: 10px;
  padding: 56px;
  position: relative;
  overflow: hidden;
  min-height: 450px;
  will-change: transform, filter;
}

.iwm-solution-card--purple {
  background: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%);
}

.iwm-solution-card--black {
  background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
}

.iwm-solution-card--orange {
  background: linear-gradient(135deg, #f93f27 0%, #f93f27 100%);
}

.iwm-solution-card--gradient {
  background: linear-gradient(135deg, var(--iwm-green) 0%, #0c8c7e 100%);
}

.iwm-solution-card-content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  position: relative;
}

.iwm-solution-card-icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 80px;
  height: 80px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(10px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  flex-shrink: 0;
}

.iwm-solution-card-icon svg {
  width: 48px;
  height: 48px;
}

.iwm-solution-card-text {
  margin-top: auto;
}

.iwm-solution-card-text h3 {
  font-family: "Sora", sans-serif;
  font-size: clamp(42px, 5vw, 2.75vw);
  font-weight: 500;
  margin-bottom: 20px;
  color: #fff;
  line-height: 1.1;
}

.iwm-solution-card-text p {
  font-size: 17px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.9);
  margin: 0;
  max-width: 90%;
}

.iwm-solution-card-image {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.iwm-solution-card-image img {
  width: 100%;
  height: auto;
  border-radius: 10px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

/* Responsive Adjustments */
@media (max-width: 991px) {
  .iwm-service-hero-title {
    font-size: clamp(68px, 5vw, 56px);
  }

  .iwm-h2 {
    font-size: clamp(30px, 4vw, 42px);
  }

  .iwm-section-desc,
  .iwm-lead-text {
    font-size: 17px;
  }

  .iwm-process-carousel {
    padding: 10px 0 0;
  }

  .iwm-process-carousel::before {
    left: 0;
    right: 0;
  }

  .iwm-process-nav {
    display: none;
  }

  .iwm-solution-card {
    padding: 32px 24px;
    position: relative;
    top: auto;
    min-height: auto;
  }

  .iwm-solution-card-icon {
    width: 60px;
    height: 60px;
  }

  .iwm-solution-card-icon svg {
    width: 36px;
    height: 36px;
  }

  .iwm-solution-card-text {
    padding-top: 80px;
  }

  .iwm-solution-card-image {
    margin-top: 24px;
  }
}

@media (max-width: 575px) {
  .iwm-service-hero {
    padding: 80px 0 50px;
  }

  .iwm-service-cta {
    padding: 80px 0;
  }

  .iwm-hero-badges {
    gap: 8px;
  }

  .iwm-badge {
    padding: 6px 12px;
    font-size: 12px;
  }

  .iwm-solution-card {
    padding: 24px 18px;
    position: relative;
    top: auto;
  }

  .iwm-solution-card-icon {
    width: 56px;
    height: 56px;
  }

  .iwm-solution-card-icon svg {
    width: 32px;
    height: 32px;
  }

  .iwm-solution-card-text {
    padding-top: 70px;
  }

  .iwm-growth-rail {
    grid-template-columns: 1fr;
  }

  .iwm-process-num {
    width: 44px;
    height: 44px;
    font-size: 16px;
  }
}

/* ==========================================
   DIGITAL MARKETING PAGE STYLES
   Start single-servizio-digital-marketing.php
   ========================================== */
.iwm-service-hero-title--dm,
.iwm-service-hero-title--ai,
.iwm-service-hero-title--photo {
  font-size: clamp(72px, 6.5vw, 76px);
}

.iwm-dm-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 50px;
}

.iwm-dm-kpis-header {
  text-align: left;
  margin-top: 40px;
}

.iwm-dm-kpis-title {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cta);
  margin: 0;
}

.iwm-dm-pill {
  background: #fff;
  border: solid 1px #bcbcbc;
  border-radius: 10px;
  padding: 24px 22px;
  text-align: left;
}

.iwm-dm-pill h3 {
  font-size: 20px;
  font-weight: 500;
  color: var(--black);
  margin-bottom: 10px;
}

.iwm-dm-pill p {
  font-size: 15px;
  line-height: 1.6;
  color: var(--gray-mid);
  margin: 0;
}

.iwm-dm-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 14px;
}

.iwm-dm-list li {
  position: relative;
  padding-left: 28px;
  font-size: 16px;
  line-height: 1.7;
  color: var(--gray-mid);
}

.iwm-dm-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--cta);
}

.iwm-dm-point {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  padding: 28px 24px;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 10px;
  background: #fff;
}

.iwm-dm-point-num {
  font-family: 'Antonio', sans-serif;
  font-size: 28px;
  font-weight: 700;
  color: var(--cta);
  line-height: 1;
  flex-shrink: 0;
}

.iwm-dm-point p {
  margin: 0;
  font-size: 16px;
  line-height: 1.7;
  color: var(--gray-mid);
  padding-top: 3px;
}

.iwm-dm-callout {
  margin-top: 50px;
  background: linear-gradient(
    135deg,
    rgba(255, 112, 67, 0.08),
    rgba(255, 112, 67, 0.02)
  );
  border-left: 4px solid var(--cta);
  border-radius: 10px;
  padding: 28px 30px;
}

.iwm-dm-callout p {
  font-size: 16px;
  line-height: 1.7;
  color: var(--gray-mid);
  margin: 0 0 18px;
}

.iwm-dm-callout-grid {
  display: grid;
  gap: 10px;
  font-size: 14px;
  color: var(--black);
  font-weight: 600;
}

.iwm-dm-outputs {
  margin-top: 40px;
}

/* ========================================
   DM PAGE — REDESIGN COMPONENTS
   ======================================== */

.dm-kicker {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: var(--cta);
  margin: 0 0 24px;
}

/* INTRO — concepts row (card style) */
.dm-concepts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.dm-concept {
  background: #005f73;
  border-radius: 16px;
  padding: 32px 28px;
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 2px 12px rgba(0,0,0,0.12);
  position: relative;
  z-index: 1;
}

.dm-concept-num {
  display: block;
  font-family: 'Antonio', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--cta);
  margin-bottom: 16px;
}

.dm-concept-title {
  font-family: 'Antonio', sans-serif;
  font-size: 26px;
  font-weight: 700;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 12px;
}

.dm-concept-desc {
  font-size: 15px;
  line-height: 1.75;
  color: rgba(255,249,238,0.65);
  margin: 0;
}

/* PROBLEMA — dark section grid */
.dm-problema-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px;
}

.dm-problema-item {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  padding: 40px 36px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
}

.dm-problema-num {
  font-family: 'Antonio', sans-serif;
  font-size: 52px;
  font-weight: 700;
  line-height: 1;
  color: var(--cta);
  opacity: 0.45;
  flex-shrink: 0;
  width: 60px;
}

.dm-problema-item p {
  margin: 0;
  font-size: 17px;
  line-height: 1.7;
  color: rgba(255,249,238,0.75);
  padding-top: 10px;
}

/* METODO — 4-step grid */
.dm-metodo-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2px;
  background: rgba(255,255,255,0.06);
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 48px;
}

.dm-metodo-step {
  background: #fff;
  padding: 40px 32px;
}

.section-dark .dm-metodo-steps {
  background: transparent;
  gap: 20px;
}

.section-dark .dm-metodo-step {
  background: rgba(255,255,255,0.04);
  border-radius: 12px;
  border-top: 3px solid var(--cta);
}

.section-dark .dm-metodo-step h3 {
  color: var(--white-off);
}

.section-dark .dm-metodo-step p {
  color: rgba(255,249,238,0.55);
}

.section-dark .dm-metodo-output {
  border-top-color: rgba(255,255,255,0.1);
}

.section-dark .dm-metodo-output-items span {
  color: rgba(255,249,238,0.7);
}

.dm-metodo-step-num {
  font-family: 'Antonio', sans-serif;
  font-size: 52px;
  font-weight: 700;
  line-height: 1;
  color: var(--cta);
  margin-bottom: 24px;
}

.dm-metodo-step h3 {
  font-family: 'Antonio', sans-serif;
  font-size: 22px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--black);
  margin-bottom: 12px;
}

.dm-metodo-step p {
  font-size: 15px;
  line-height: 1.7;
  color: var(--gray-mid);
  margin: 0;
}

.dm-metodo-output {
  border-top: 1px solid rgba(0,0,0,0.1);
  padding-top: 36px;
}

.dm-metodo-output-label {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: var(--cta);
  margin-bottom: 20px;
}

.dm-metodo-output-items {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px 60px;
}

.dm-metodo-output-items span {
  font-family: 'Sora', sans-serif;
  font-size: 15px;
  color: var(--gray-mid);
  line-height: 1.6;
  padding-left: 20px;
  position: relative;
}

.dm-metodo-output-items span::before {
  content: '';
  position: absolute;
  left: 0;
  top: 9px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--cta);
}

/* APPROCCIO + FAQ — dark section */
.dm-mini-audit {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  padding: 36px;
  margin-top: 16px;
}

.dm-mini-audit h3 {
  font-family: 'Antonio', sans-serif;
  font-size: 22px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--white-off);
  margin-bottom: 14px;
}

.dm-mini-audit p {
  font-size: 15px;
  line-height: 1.75;
  color: rgba(255,249,238,0.55);
  margin: 0;
}

/* Mini-audit su sfondo crema */
.iwm-section-light .dm-mini-audit {
  background: #005f73;
  border-color: rgba(255,255,255,0.1);
}

.iwm-section-light .dm-mini-audit h3 {
  color: var(--white-off);
}

.iwm-section-light .dm-mini-audit p {
  color: rgba(255,249,238,0.65);
}

.dm-mini-audit-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 24px;
  padding: 12px 22px;
  background: var(--cta);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  border-radius: 10px;
  transition: opacity 0.2s;
}

.dm-mini-audit-btn:hover {
  opacity: 0.88;
  color: #fff;
}

.dm-faq {
  border-top: 1px solid rgba(255,255,255,0.1);
  padding-top: 48px;
}

/* FAQ su sfondo crema */
.iwm-section-light .dm-faq {
  border-top-color: rgba(0,0,0,0.1);
}

.dm-faq-label {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: var(--cta);
  margin-bottom: 8px;
}

/* Servizi – FAQ: layout uniforme + icona + / X */
.dm-faq-item {
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.iwm-section-light .dm-faq-item {
  border-bottom-color: rgba(0,0,0,0.08);
}

.dm-faq-item,
.sw-faq-item,
.fv-faq-item,
.gd-faq-item {
  display: block !important;
}

.dm-faq-item > summary + .iwm-faq-panel,
.sw-faq-item > summary + .iwm-faq-panel,
.fv-faq-item > summary + .iwm-faq-panel,
.gd-faq-item > summary + .iwm-faq-panel {
  overflow: hidden !important;
  height: 0;
  opacity: 0;
  transform: translateY(-6px);
  transition: height 260ms cubic-bezier(0.16, 1, 0.3, 1),
              opacity 220ms cubic-bezier(0.16, 1, 0.3, 1),
              transform 220ms cubic-bezier(0.16, 1, 0.3, 1);
  will-change: height, opacity, transform;
}

.dm-faq-item[open] > summary + .iwm-faq-panel,
.sw-faq-item[open] > summary + .iwm-faq-panel,
.fv-faq-item[open] > summary + .iwm-faq-panel,
.gd-faq-item[open] > summary + .iwm-faq-panel {
  opacity: 1;
  transform: translateY(0);
}

.dm-faq-item summary,
.sw-faq-item summary,
.fv-faq-item summary,
.gd-faq-item summary {
  position: relative;
  padding: 22px 32px 0 0;
  cursor: pointer;
  list-style: none;
  border: none;
  display: block !important;
}

/* Se nei template esistono vecchie icone, nascondile */
.sw-faq-icon,
.fv-faq-icon,
.gd-faq-icon,
.dm-faq-icon {
  display: none !important;
}

/* Domanda (su sezioni scure): crema */
section.section-dark .dm-faq-item summary,
section.section-dark .sw-faq-item summary,
section.section-dark .fv-faq-item summary,
section.section-dark .gd-faq-item summary {
  color: #fff9ee !important;
}

.dm-faq-item summary::-webkit-details-marker,
.sw-faq-item summary::-webkit-details-marker,
.fv-faq-item summary::-webkit-details-marker,
.gd-faq-item summary::-webkit-details-marker {
  display: none;
}

.dm-faq-item summary::after,
.sw-faq-item summary::after,
.fv-faq-item summary::after,
.gd-faq-item summary::after {
  content: '+';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 22px;
  line-height: 1;
  font-weight: 300;
  color: var(--cta);
  transition: transform 0.25s ease, color 0.25s ease;
}

.dm-faq-item[open] summary::after,
.sw-faq-item[open] summary::after,
.fv-faq-item[open] summary::after,
.gd-faq-item[open] summary::after {
  content: '×';
  transform: translateY(-50%);
}

/* Risposta: più staccata e un filo più piccola */
.dm-faq-item p,
.sw-faq-item p,
.fv-faq-item p,
.gd-faq-item p {
  display: block !important;
  font-size: 14px !important;
  line-height: 1.75 !important;
  color: rgba(255,249,238,0.55) !important;
  padding: 14px 0 26px !important;
  margin: 0 !important;
}

.iwm-section-light .dm-faq-item p {
  color: var(--gray-mid);
}

@media (max-width: 992px) {
  .dm-metodo-steps { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .dm-concepts { grid-template-columns: 1fr; }
  .dm-concept { padding: 28px 24px; }
  .dm-problema-grid { grid-template-columns: 1fr; }
  .dm-metodo-output-items { grid-template-columns: 1fr; }

  /* metodo carousel */
  .dm-metodo-steps {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 6vw;
    padding: 0 6vw 4px;
    gap: 12px;
    background: transparent;
    border-radius: 0;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .dm-metodo-steps::-webkit-scrollbar { display: none; }
  .dm-metodo-step {
    flex: 0 0 80vw;
    scroll-snap-align: center;
  }
}

/* metodo dots */
.dm-metodo-dots {
  display: none;
}
@media (max-width: 768px) {
  .dm-metodo-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 20px;
  }
}
.dm-metodo-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(255,255,255,0.25);
  transition: background 0.25s, transform 0.25s;
  cursor: pointer;
}
.dm-metodo-dot--active {
  background: var(--cta);
  transform: scale(1.3);
}

.iwm-dm-section-title {
  font-size: 20px;
  font-weight: 500;
  color: var(--white-off);
  margin-bottom: 16px;
}

.iwm-dm-output-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 24px;
}

.iwm-dm-output-list li {
  position: relative;
  padding-left: 26px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--white-off);
}

.iwm-dm-output-list li::before {
  content: "→";
  position: absolute;
  left: 0;
  color: var(--cta);
  font-weight: 500;
}

.iwm-dm-mini-audit {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  padding: 24px 22px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.06);
}

.iwm-dm-mini-audit h3 {
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 10px;
  color: var(--black);
}

.iwm-dm-mini-audit p {
  font-size: 15px;
  line-height: 1.7;
  color: var(--gray-mid);
  margin: 0;
}

.iwm-dm-faq details {
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  padding: 16px 0;
}

.iwm-dm-faq summary {
  cursor: pointer;
  font-size: 18px;
  font-weight: 600;
  color: var(--black);
  list-style: none;
}

.iwm-dm-faq summary::-webkit-details-marker {
  display: none;
}

.iwm-dm-faq p {
  font-size: 15px;
  line-height: 1.7;
  color: var(--gray-mid);
  margin: 12px 0 0;
}

.iwm-dm-cta-list {
  background: rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 20px 22px;
  text-align: left;
  color: var(--white-off);
  margin-bottom: 32px;
}

.iwm-dm-cta-list h3 {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 12px;
  color: var(--white-off);
}

.iwm-dm-cta-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 8px;
}

.iwm-dm-cta-list li {
  font-size: 14px;
  line-height: 1.6;
}

@media (max-width: 991px) {
  .iwm-dm-kpis {
    grid-template-columns: 1fr;
  }

  .iwm-dm-output-list {
    grid-template-columns: 1fr;
  }
}

/* Problems Section - New Layout */
.iwm-problems-section {
  position: relative;
  background: var(--background);
}

.iwm-problems-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.iwm-problem-item {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  padding: 16px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

.iwm-problem-item:last-child {
  border-bottom: none;
}

.iwm-problem-item:hover {
  transform: translateX(8px);
}

.iwm-problem-number {
  font-family: "Sora", sans-serif;
  font-size: 48px;
  font-weight: 500;
  line-height: 1;
  color: var(--cta);
  opacity: 0.2;
  flex-shrink: 0;
  min-width: 80px;
  transition: opacity 0.3s ease;
}

.iwm-problem-item:hover .iwm-problem-number {
  opacity: 1;
}

.iwm-problem-content h3 {
  font-family: "Sora", sans-serif;
  font-size: 22px;
  font-weight: 500;
  margin-bottom: 8px;
  color: var(--black);
  line-height: 1.3;
}

.iwm-problem-content p {
  font-size: 16px;
  line-height: 1.7;
  color: var(--gray-mid);
  margin: 0;
}

.iwm-thermometer-wrapper {
  position: sticky;
  top: 120px;
}

.iwm-thermometer-img {
  width: 100%;
  object-fit: cover;
  height: 500px;
}

.iwm-thermometer-label {
  font-size: 18px;
  color: var(--black);
}

.iwm-problems-summary {
  background: #fff9ee;
  border: solid 1px #bcbcbc;
  padding: 40px;
  border-radius: 10px;
}

.iwm-problems-summary h4 {
  font-size: clamp(20px, 24px + 0.5vw, 26px);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.iwm-problems-summary p {
  font-size: 16px;
  line-height: 1.8;
  color: var(--gray-mid);
}

/* Responsive */
@media (max-width: 991px) {
  .iwm-problem-number {
    font-size: 36px;
    min-width: 60px;
  }

  .iwm-problem-content h3 {
    font-size: 20px;
  }

  .iwm-thermometer-wrapper {
    position: relative;
    top: auto;
    margin-top: 40px;
  }

  .iwm-problems-summary {
    padding: 30px 24px;
  }
}

@media (max-width: 575px) {
  .iwm-problem-item {
    gap: 16px;
  }

  .iwm-problem-number {
    font-size: 28px;
    min-width: 50px;
  }

  .iwm-problem-content h3 {
    font-size: 18px;
  }

  .iwm-problem-content p {
    font-size: 15px;
  }

  .iwm-problems-summary {
    padding: 24px 20px;
  }
}

/* ========================================
   METHOD SECTION - HORIZONTAL TIMELINE
   ======================================== */

.iwm-method-section {
  background: #fff9ee;
  --timeline-accent: #ec6e5e;
  --timeline-ink: #005f73;
  --timeline-soft: rgba(0, 95, 115, 0.12);
  --timeline-card: rgba(255, 255, 255, 0.66);
}

.iwm-process-timeline-horizontal {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  max-width: 1400px;
  margin: 0 auto;
  padding-top: 6px;
}

/* Timeline horizontal line */
.iwm-timeline-line-horizontal {
  position: absolute;
  left: 8%;
  right: 8%;
  top: 38px;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--timeline-soft) 10%, var(--timeline-soft) 90%, transparent 100%);
  z-index: 0;
}

/* Single step container */
.iwm-process-step-h {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
}

/* Icon on the timeline */
.iwm-process-icon-h {
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background: #fff9ee;
  border: 2px solid rgba(236, 110, 94, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 24px rgba(0, 95, 115, 0.12);
  transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
  position: relative;
  z-index: 2;
  flex-shrink: 0;
}

.iwm-process-step-h:hover .iwm-process-icon-h {
  border-color: var(--timeline-accent);
  box-shadow: 0 10px 22px rgba(236, 110, 94, 0.16);
}

.iwm-process-icon-h svg {
  color: var(--timeline-accent);
  width: 34px;
  height: 34px;
}

.iwm-gd-deliverable-item {
  color: var(--white-off);
}

.iwm-gd-deliverables h3 {
  color: var(--white-off);
}

/* Card styling */
.iwm-process-card-h {
  background: var(--timeline-card);
  border: 1px solid rgba(0, 95, 115, 0.15);
  border-radius: 10px;
  padding: 24px 22px;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
  text-align: left;
  width: 100%;
  backdrop-filter: blur(2px);
}

.iwm-process-card-h:hover {
  background: #fff;
  border-color: rgba(236, 110, 94, 0.3);
  box-shadow: 0 8px 22px rgba(0, 95, 115, 0.1);
}

.iwm-process-card-h h3 {
  font-family: 'Antonio', sans-serif;
  font-size: clamp(24px, 2.1vw, 34px);
  font-weight: 600;
  color: var(--timeline-ink);
  margin-bottom: 10px;
  line-height: 1.12;
  letter-spacing: -0.01em;
}

.iwm-process-card-h p {
  font-size: 15px;
  line-height: 1.65;
  color: rgba(26, 26, 26, 0.78);
  margin: 0;
}

.iwm-chi-siamo-hero {
  padding-top: 240px;
  padding-bottom: 220px;
}

/* Responsive - Tablet */
@media (max-width: 767px) {
  .iwm-chi-siamo-hero {
    height: calc(100vh - 100px);
    align-content: center;
    padding-top: 0;
    padding-bottom: 0;
  }
}

.iwm-chi-siamo-hero-title {
  font-size: clamp(72px, 6.5vw, 76px);
}

/* Responsive - Tablet */
@media (max-width: 1200px) {
  .iwm-process-timeline-horizontal {
    grid-template-columns: repeat(2, 1fr);
    gap: 26px 18px;
  }

  .iwm-timeline-line-horizontal {
    display: none;
  }
}

/* Responsive - Mobile */
@media (max-width: 767px) {
  .iwm-process-timeline-horizontal {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 10px 0 0 26px;
  }

  .iwm-process-step-h {
    align-items: stretch;
    gap: 10px;
    padding-left: 10px;
  }
  .iwm-process-step-h::before {
    content: '';
    position: absolute;
    left: -14px;
    top: 0;
    bottom: -18px;
    width: 2px;
    background: rgba(0, 95, 115, 0.16);
  }
  .iwm-process-icon-h {
    width: 54px;
    height: 54px;
    margin-left: -37px;
    box-shadow: 0 6px 16px rgba(0, 95, 115, 0.12);
  }
  .iwm-process-icon-h svg { width: 24px; height: 24px; }

  .iwm-process-card-h {
    padding: 18px 16px;
  }

  .iwm-process-card-h h3 {
    font-size: clamp(28px, 7.4vw, 38px);
    line-height: 1.05;
  }

  .iwm-process-card-h p {
    font-size: 14px;
    line-height: 1.58;
  }
}

.iwm-value-card {
  padding: 25px;
  background: #ad978975;
  border-radius: 10px;
  gap: 15px;
  display: grid;
  min-height: 252px;
}

.iwm-team-card-image img {
  border-radius: 10px;
}

/* ====================================================================
   =====================================================================
   
   ███████╗██╗███╗   ██╗ ██████╗ ██╗     ███████╗    ██████╗ ██████╗  ██████╗  ██████╗ ███████╗████████╗████████╗ ██████╗ 
   ██╔════╝██║████╗  ██║██╔════╝ ██║     ██╔════╝    ██╔══██╗██╔══██╗██╔═══██╗██╔════╝ ██╔════╝╚══██╔══╝╚══██╔══╝██╔═══██╗
   ███████╗██║██╔██╗ ██║██║  ███╗██║     █████╗█████╗██████╔╝██████╔╝██║   ██║██║  ███╗█████╗     ██║      ██║   ██║   ██║
   ╚════██║██║██║╚██╗██║██║   ██║██║     ██╔══╝╚════╝██╔═══╝ ██╔══██╗██║   ██║██║   ██║██╔══╝     ██║      ██║   ██║   ██║
   ███████║██║██║ ╚████║╚██████╔╝███████╗███████╗    ██║     ██║  ██║╚██████╔╝╚██████╔╝███████╗   ██║      ██║   ╚██████╔╝
   ╚══════╝╚═╝╚═╝  ╚═══╝ ╚═════╝ ╚══════╝╚══════╝    ╚═╝     ╚═╝  ╚═╝ ╚═════╝  ╚═════╝ ╚══════╝   ╚═╝      ╚═╝    ╚═════╝ 
   
   SINGLE-PROGETTO.PHP - Case Study Template Styles
   =====================================================================
   ==================================================================== */

/* --- Variables --- */
.iwm-single-progetto {
  --progetto-primary: transparent;
  --progetto-highlight: #ec6e5e;
  --progetto-bg: #fff9ee;
  --progetto-text: #1a1a1a;
}

/* --- Section Labels & Titles --- */
.progetto-section-label {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 3px;
  font-weight: 700;
  opacity: 0.5;
  margin-bottom: 24px;
}

.progetto-section-title {
  font-family: "Antonio", sans-serif;
  font-size: clamp(48px, 6vw, 84px);
  font-weight: 500;
  line-height: 1.1;
  margin-bottom: 40px;
}

/* --- Hero 50/50 --- */
.progetto-hero {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.progetto-hero-left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 8vw 0 10vw;
  background: var(--progetto-bg);
}

.progetto-hero-accent {
  font-size: 13px;
  opacity: 0.5;
  text-transform: uppercase;
  letter-spacing: 3px;
  font-weight: 600;
  margin-bottom: 12px;
}

.progetto-hero-left h1 {
  font-size: clamp(38px, 2.5vw, 2.5vw);
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 60px;
}

.progetto-hero-left h1 .highlight {
  color: #ec6e5e;
}

.progetto-hero-meta-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px 48px;
  margin-top: 60px;
}

.progetto-meta-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-weight: 700;
  opacity: 0.4;
  margin-bottom: 8px;
}

.progetto-meta-value {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
}

.progetto-meta-link {
  color: #005f73;
  text-decoration: underline;
}

.progetto-hero-right {
  background: linear-gradient(135deg, #f0f0f0 0%, #e0e0e0 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}

.progetto-hero-image-placeholder {
  font-size: 18px;
  color: #999;
}

/* --- Stacked Sections --- */
.progetto-section-stack {
  min-height: 100vh;
  position: sticky;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.progetto-section-stack .progetto-starting-content {
  width: 100%;
  padding: 10vh 5vw;
  transform-origin: center top;
}

/* --- Diagnosi --- */
.progetto-starting-point {
  background: var(--iwm-green);
  z-index: 1;
  position: relative;
  overflow: hidden;
}

.progetto-starting-point:before,
.progetto-starting-point:after {
  content: "⚠";
  position: absolute;
  font-size: 200px;
  color: rgba(255, 255, 255, 0.03);
  pointer-events: none;
  z-index: 0;
}

.progetto-starting-point:before {
  top: 10%;
  left: 5%;
  transform: rotate(-15deg);
}

.progetto-starting-point:after {
  bottom: 15%;
  right: 8%;
  transform: rotate(20deg);
}

.progetto-starting-content {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.progetto-starting-point .progetto-section-label {
  color: #f5f5f5;
  opacity: 0.4;
}

.progetto-problem-overview {
  font-size: 18px;
  line-height: 1.8;
  color: #f5f5f5;
  opacity: 0.8;
  margin-bottom: 60px;
}

.progetto-problem-overview p {
  margin-bottom: 20px;
  color: var(--white-off);
}

.progetto-pain-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
}

.progetto-pain-item {
  background: rgba(255, 255, 255, 0.03);
  padding: 36px 32px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: all 0.3s ease;
}

.progetto-pain-item:hover {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.12);
  transform: translateY(-4px);
}

.progetto-pain-icon {
  font-size: 28px;
  color: rgba(236, 110, 94, 0.6);
  margin-bottom: 16px;
  display: block;
}

.progetto-pain-label {
  font-size: 20px;
  font-weight: 600;
  color: #f5f5f5;
  margin-bottom: 10px;
}

.progetto-pain-detail {
  font-size: 14px;
  line-height: 1.6;
  color: #f5f5f5;
  opacity: 0.55;
}

/* --- Solutions --- */
.progetto-what-we-did {
  background: #1a1a1a;
  z-index: 2;
}

.progetto-solutions-intro {
  padding: 120px 10vw 80px;
  max-width: 1400px;
  margin: 0 auto;
}

.progetto-solutions-intro .progetto-section-label,
.progetto-solutions-intro .progetto-section-title {
  color: #f5f5f5;
}

.progetto-solutions-wrapper {
  position: relative;
  height: 600vh;
}

.progetto-solutions-container {
  position: sticky;
  top: 0;
  height: 100vh;
  display: grid;
  grid-template-columns: 1fr 1fr;
  overflow: hidden;
}

.progetto-solutions-text-column {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 8vw 10vh 10vw;
  position: relative;
}

.progetto-solution-text-item {
  position: absolute;
  bottom: 10vh;
  left: 10vw;
  right: 8vw;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.6s ease,
    visibility 0.6s ease;
}

.progetto-solution-text-item.active {
  opacity: 1;
  visibility: visible;
}

.progetto-solution-number {
  font-family: "Antonio", sans-serif;
  font-size: 20px;
  color: var(--progetto-highlight);
  margin-bottom: 16px;
  display: block;
}

.progetto-solution-title {
  font-family: "Antonio", sans-serif;
  font-size: clamp(36px, 4vw, 52px);
  font-weight: 500;
  line-height: 1.1;
  color: #f5f5f5;
  margin-bottom: 24px;
}

.progetto-solution-desc {
  font-size: 17px;
  line-height: 1.7;
  color: #f5f5f5;
  opacity: 0.75;
  margin-bottom: 28px;
}

.progetto-solution-points {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.progetto-solution-point {
  font-size: 15px;
  padding-left: 28px;
  position: relative;
  color: #f5f5f5;
  opacity: 0.7;
  line-height: 1.6;
}

.progetto-solution-point:before {
  content: "◆";
  position: absolute;
  left: 0;
  color: var(--progetto-highlight);
  font-size: 12px;
}

.progetto-solutions-image-column {
  background: #1a1a1a;
  position: relative;
}

.progetto-solution-image {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.8s ease,
    visibility 0.8s ease;
}

.progetto-solution-image.active {
  opacity: 1;
  visibility: visible;
}

.progetto-solution-image-placeholder {
  width: 100%;
  height: 100%;
  background: #1a1a1a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #333;
}

/* --- Masonry Gallery --- */
.progetto-masonry-gallery {
  background: #1a1a1a;
  overflow: hidden;
  position: relative;
  z-index: 3;
}

.progetto-masonry-scroll-wrapper {
  position: relative;
  height: 400vh;
}

.progetto-masonry-container-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
}

.progetto-masonry-scroll-container {
  overflow: hidden;
  padding: 0 5vw;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}

.progetto-masonry-grid {
  display: grid;
  grid-template-rows: repeat(4, minmax(0, 1fr));
  grid-auto-flow: column;
  grid-auto-columns: clamp(220px, 22vw, 320px);
  gap: 20px;
  width: max-content;
  height: min(calc(100vh - 30px), 860px);
}

.progetto-masonry-item {
  background: #0f0f0f;
  border-radius: 10px;
  overflow: hidden;
  transition: transform 0.3s ease;
}

.progetto-masonry-item:hover {
  transform: scale(1.02);
}

/* Balanced mix of orientations */
.progetto-masonry-item:nth-child(1) {
  grid-row: span 2;
  grid-column: span 1;
}

.progetto-masonry-item:nth-child(2) {
  grid-row: span 2;
  grid-column: span 2;
}

.progetto-masonry-item:nth-child(3) {
  grid-row: span 2;
  grid-column: span 1;
}

.progetto-masonry-item:nth-child(4) {
  grid-row: span 3;
  grid-column: span 1;
}

.progetto-masonry-item:nth-child(5) {
  grid-row: span 1;
  grid-column: span 2;
}

.progetto-masonry-item:nth-child(6) {
  grid-row: span 2;
  grid-column: span 2;
}

.progetto-masonry-item:nth-child(7) {
  grid-row: span 2;
  grid-column: span 1;
}

.progetto-masonry-item:nth-child(8) {
  grid-row: span 2;
  grid-column: span 1;
}

.progetto-masonry-item:nth-child(9) {
  grid-row: span 2;
  grid-column: span 2;
}

.progetto-masonry-item:nth-child(10) {
  grid-row: span 3;
  grid-column: span 1;
}

.progetto-masonry-item:nth-child(11) {
  grid-row: span 1;
  grid-column: span 2;
}

.progetto-masonry-item:nth-child(12) {
  grid-row: span 2;
  grid-column: span 1;
}

.progetto-masonry-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: #333;
}

/* --- Key Numbers --- */
.progetto-key-numbers {
  background: #1a1a1a;
  z-index: 4;
  min-height: 100vh;
  position: relative;
  overflow: hidden;
}

.progetto-numbers-content {
  max-width: 1400px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.progetto-key-numbers .progetto-section-label,
.progetto-key-numbers .progetto-section-title {
  color: #f5f5f5;
}

/* KPI Cards stacked */
.progetto-stacked-kpi {
  background: #1a1a1a;
}

.progetto-stacked-kpi::before {
  content: none;
}

/* Doodle SVG background */
.progetto-kpi-doodle-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}

.progetto-kpi-doodle-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      800px 500px at 15% 20%,
      rgba(255, 255, 255, 0.05),
      transparent 60%
    ),
    radial-gradient(
      700px 500px at 85% 70%,
      rgba(255, 255, 255, 0.04),
      transparent 60%
    ),
    radial-gradient(
      600px 400px at 50% 90%,
      rgba(255, 255, 255, 0.03),
      transparent 60%
    );
  opacity: 0.8;
}

.progetto-kpi-doodle-bg svg {
  position: absolute;
  opacity: 0.08;
  animation: progettoFloatPattern 160s linear infinite;
}

.progetto-kpi-doodle-bg svg:nth-child(1) {
  top: -8%;
  left: -6%;
  width: 70vw;
  height: auto;
}

.progetto-kpi-doodle-bg svg:nth-child(2) {
  bottom: -10%;
  right: -8%;
  width: 60vw;
  height: auto;
  opacity: 0.06;
  animation-duration: 190s;
}

@keyframes progettoFloatPattern {
  0% {
    transform: translate(0, 0) rotate(0deg);
  }

  50% {
    transform: translate(-18px, -14px) rotate(1.5deg);
  }

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

.progetto-stacked-kpi .progetto-stacked-content {
  position: relative;
  z-index: 1;
}

.progetto-stacked-kpi .progetto-section-label,
.progetto-stacked-kpi .progetto-section-title {
  color: #f5f5f5;
}

/* --- Why it worked --- */
.progetto-why-worked {
  background: #015f73;
  z-index: 5;
  position: relative;
  overflow: hidden;
}

.progetto-why-worked::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      700px 420px at 15% 20%,
      rgba(255, 255, 255, 0.08),
      transparent 60%
    ),
    radial-gradient(
      700px 420px at 85% 80%,
      rgba(255, 255, 255, 0.06),
      transparent 60%
    );
  opacity: 0.7;
  pointer-events: none;
}

.progetto-why-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 12vh 5vw;
  position: relative;
  z-index: 1;
}

.progetto-why-worked .progetto-section-label,
.progetto-why-worked .progetto-section-title {
  color: #ffffff;
}

.progetto-why-worked .progetto-section-title {
  margin-bottom: 24px;
}

.progetto-why-text {
  font-size: 19px;
  line-height: 1.8;
  color: #ffffff;
  opacity: 0.88;
  max-width: 980px;
}

.progetto-why-text strong {
  color: #ffffff;
  font-weight: 700;
}

/* --- Final CTA --- */
.progetto-final-cta {
  background: #1a1a1a;
  z-index: 6;
  position: relative;
  overflow: hidden;
}

.progetto-final-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      700px 420px at 20% 20%,
      rgba(255, 255, 255, 0.06),
      transparent 60%
    ),
    radial-gradient(
      700px 420px at 80% 80%,
      rgba(255, 255, 255, 0.05),
      transparent 60%
    );
  opacity: 0.7;
  pointer-events: none;
}

.progetto-cta-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 14vh 5vw;
  position: relative;
  z-index: 1;
}

.progetto-final-cta .progetto-section-label,
.progetto-final-cta .progetto-section-title {
  color: #ffffff;
}

.progetto-cta-text {
  font-size: 19px;
  line-height: 1.8;
  color: #ffffff;
  opacity: 0.88;
  max-width: 980px;
  margin-bottom: 32px;
}

.progetto-cta-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.progetto-cta-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 16px 28px;
  border-radius: 999px;
  background: #ec6e5e;
  color: #ffffff;
  font-weight: 700;
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, 0.1);
  transition:
    transform 0.2s ease,
    background 0.2s ease,
    box-shadow 0.2s ease;
}

.progetto-cta-button:hover {
  transform: translateY(-2px);
  background: #ff5b45;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.35);
}

.progetto-cta-note {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 1.6px;
  color: #ffffff;
  opacity: 0.5;
}

/* --- KPI Grid --- */
.progetto-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
  margin-top: 60px;
}

.progetto-kpi-card {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 36px 28px 32px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  opacity: 0;
  transform: translateY(32px);
  transition:
    background 0.3s ease,
    border-color 0.3s ease,
    transform 0.3s ease;
}

.progetto-kpi-card.visible {
  opacity: 1;
  transform: translateY(0);
}

.progetto-kpi-card:hover {
  background: rgba(255, 255, 255, 0.07);
  border-color: rgba(255, 255, 255, 0.14);
}

.progetto-kpi-card-icon {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.progetto-kpi-card-icon svg {
  width: 22px;
  height: 22px;
}

.progetto-kpi-card-value {
  font-family: "Antonio", sans-serif;
  font-size: clamp(38px, 4vw, 52px);
  font-weight: 700;
  color: #fff;
  line-height: 1;
}

.progetto-kpi-card-label {
  font-size: 14px;
  color: #fff;
  opacity: 0.5;
  font-weight: 500;
  line-height: 1.4;
}

.progetto-kpi-card-note {
  font-size: 11px;
  color: #fff;
  opacity: 0.25;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-weight: 600;
  margin-top: auto;
}

.progetto-analysis-note {
  font-size: 14px;
  color: #f5f5f5;
  opacity: 0.4;
  text-align: center;
  margin-top: 80px;
}

/* --- Responsive: KPI Grid --- */
@media (max-width: 1200px) {
  .progetto-kpi-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 900px) {
  .progetto-kpi-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .progetto-kpi-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .progetto-kpi-card {
    padding: 20px 16px 18px;
  }

  .progetto-kpi-card-value {
    font-size: clamp(28px, 6vw, 36px);
  }

  .progetto-kpi-card-label {
    font-size: 12px;
  }

  .progetto-kpi-card-icon {
    width: 36px;
    height: 36px;
  }

  .progetto-kpi-card-icon svg {
    width: 18px;
    height: 18px;
  }
}

/* --- Responsive: General --- */
@media (max-width: 968px) {
  .progetto-hero {
    grid-template-columns: 1fr;
  }

  .progetto-hero-left {
    padding: 48px 5vw;
    margin-top: 110px;
  }

  .progetto-hero-right {
    min-height: 60vh;
  }

  .progetto-pain-list {
    grid-template-columns: 1fr;
  }

  .progetto-solutions-container {
    grid-template-columns: 1fr;
  }

  .progetto-masonry-grid {
    grid-auto-columns: clamp(200px, 38vw, 300px);
    height: min(calc(100vh - 30px), 860px);
  }

  /* --- Mobile: Disabilita effetto stacked, sezioni normali --- */
  .progetto-section-stack {
    min-height: auto;
    height: auto;
    position: relative;
    padding: 60px 0;
  }

  .progetto-starting-content,
  .progetto-numbers-content,
  .progetto-why-content,
  .progetto-cta-content {
    padding: 0 5vw;
  }
}

@media (max-width: 640px) {
  .progetto-masonry-grid {
    grid-template-rows: repeat(3, minmax(0, 1fr));
  }

  .progetto-hero-left h1 {
    margin-bottom: 0px;
  }

  .progetto-hero-left {
    justify-content: space-between;
  }
}

/* === END SINGLE-PROGETTO.PHP STYLES === */

/* ---------------------------------------------------
   404 ERROR PAGE STYLES (REDESIGN - BIG TEXT)
---------------------------------------------------- */
.tp-error-area {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #013948;
  /* Requested dark background */
  overflow: hidden;
  position: relative;
  padding: 100px 0;
}

/* ═══════════════════════════════════════════
   GLOBAL BODY STYLES
   ═══════════════════════════════════════════ */
body {
  background-color: var(--iwm-green);
  min-height: 100vh;
}

/* Background Stars Effect - Global Parallax */
.stars-bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 120vh;
  --iwm-parallax: 0px;
  background-image:
    /* Layer 1 - Small stars */
    radial-gradient(
      1.5px 1.5px at 20px 30px,
      rgba(255, 255, 255, 0.8),
      transparent
    ),
    radial-gradient(
      1.5px 1.5px at 40px 70px,
      rgba(255, 255, 255, 0.9),
      transparent
    ),
    radial-gradient(
      1px 1px at 50px 160px,
      rgba(255, 255, 255, 0.6),
      transparent
    ),
    radial-gradient(
      1.5px 1.5px at 90px 40px,
      rgba(255, 255, 255, 0.7),
      transparent
    ),
    radial-gradient(
      1px 1px at 130px 80px,
      rgba(255, 255, 255, 0.5),
      transparent
    ),
    radial-gradient(
      1.5px 1.5px at 160px 120px,
      rgba(255, 255, 255, 0.8),
      transparent
    ),
    /* Layer 2 - Medium stars */
    radial-gradient(
        2px 2px at 70px 150px,
        rgba(255, 255, 255, 0.6),
        transparent
      ),
    radial-gradient(
      2px 2px at 110px 20px,
      rgba(255, 255, 255, 0.5),
      transparent
    ),
    radial-gradient(
      2px 2px at 180px 90px,
      rgba(255, 255, 255, 0.7),
      transparent
    ),
    /* Layer 3 - Larger dim stars */
    radial-gradient(
        2.5px 2.5px at 100px 180px,
        rgba(255, 255, 255, 0.3),
        transparent
      ),
    radial-gradient(
      2.5px 2.5px at 30px 100px,
      rgba(255, 255, 255, 0.25),
      transparent
    );
  background-repeat: repeat;
  background-size:
    200px 200px,
    200px 200px,
    200px 200px,
    200px 200px,
    200px 200px,
    200px 200px,
    300px 300px,
    300px 300px,
    300px 300px,
    400px 400px,
    400px 400px;
  opacity: 0.35;
  z-index: 0;
  pointer-events: none;
  will-change: transform;
  transform: translate3d(0, var(--iwm-parallax), 0);
}

/* Parallax animation via GSAP - applied via JS */
.stars-bg.parallax-active {
  transition: transform 0.1s linear;
}

.tp-error-content {
  position: relative;
  padding: 0 15px;
  z-index: 2;
  color: #fff;
  width: 100%;
}

tp-error-content p {
  color: #fff !important;
}

/* Massive Typography */
.hero-title-404 {
  font-family: "Antonio", sans-serif;
  font-size: clamp(60px, 11vw, 124px);
  font-weight: 500;
  line-height: 0.9;
  text-align: center;
  letter-spacing: -2px;
  margin-bottom: 0px;
  position: relative;
}

.hero-title-404 .d-block {
  margin-bottom: 16px;
}

.hero-title-404 .dim {
  color: rgba(245, 240, 232, 0.22);
}

.hero-title-404 .bright {
  color: #f5f0e8;
  /* Cream/White */
}

.hero-title-404 .accent {
  color: #ec6e5e;
  /* Accent Red/Orange */
}

/* Floating Rocket Decoration - positioned relative to text block */
.tp-error-thumb-floating {
  position: absolute;
  top: 50%;
  right: 10%;
  transform: translateY(-50%);
  z-index: 10;
  pointer-events: none;
  animation: rFloat 5s ease-in-out infinite;
}

@media (max-width: 991px) {
  .tp-error-thumb-floating {
    position: relative;
    top: auto;
    right: auto;
    transform: none;
    margin: -40px auto 20px;
    text-align: center;
    display: block;
  }
}

.rocket-404-float {
  filter: drop-shadow(0 0 20px rgba(236, 110, 94, 0.4));
}

.tp-error-text-box p {
  font-size: 18px;
  color: rgba(255, 255, 255, 0.7);
  max-width: 500px;
  margin: 0 auto 40px;
  line-height: 1.6;
  font-family: "Sora", sans-serif;
}

.tp-btn-theme-rocket {
  display: inline-block;
  padding: 20px 44px;
  background-color: #ec6e5e;
  /* Accent color */
  color: #fff;
  border-radius: 50px;
  font-family: "Antonio", sans-serif;
  font-size: 18px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  transition: all 0.3s ease;
  box-shadow: 0 10px 30px rgba(236, 110, 94, 0.3);
}

.tp-btn-theme-rocket:hover {
  background-color: #fff;
  color: #013948;
  transform: translateY(-4px);
  box-shadow: 0 14px 40px rgba(255, 255, 255, 0.2);
  text-decoration: none;
}

/* Animations included in SVG directly, no extra CSS anims needed for basic movement */

/* ── Footer text color ────────────────────────────────────────────── */
.tp-footer-area .tp-hero-social a,
.tp-footer-area .tp-footer-dec,
.tp-footer-area .tp-footer-email,
.tp-footer-area .tp-footer-email a,
.tp-footer-area .tp-footer-subtitle,
.tp-footer-area .tp-footer-bigtext a,
.tp-footer-area .tp-footer-copyright,
.tp-footer-area .tp-footer-copyright-social a {
  color: #fff9ee !important;
}

/* ── CTA globale (cs-cta) ─────────────────────────────────────────── */
.cs-cta {
  background: var(--iwm-green);
  padding: 100px max(5vw, calc((100% - 1400px) / 2));
  display: grid;
  grid-template-columns: 1fr 480px;
  gap: 80px;
  align-items: center;
}

.cs-cta-left {
  position: relative;
  z-index: 1;
}

.cs-cta-tag {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: var(--cta);
  margin-bottom: 20px;
}
.cs-cta-tag::before {
  content: '';
  display: block;
  width: 32px;
  height: 1px;
  background: var(--cta);
  flex-shrink: 0;
}

.cs-cta-title {
  font-family: 'Antonio', sans-serif;
  font-size: clamp(36px, 5vw, 80px);
  font-weight: 700;
  text-transform: none;
  line-height: 1.2;
  color: var(--white-off);
  margin: 0 0 28px;
}

.cs-cta-title em {
  color: var(--cta);
  font-style: normal;
}

.cs-cta-desc {
  position: relative;
  z-index: 2;
  font-size: 15px;
  line-height: 1.75;
  color: rgba(255,249,238,0.75) !important;
  opacity: 1 !important;
  max-width: 480px;
  margin-bottom: 40px;
}

.cs-cta-steps {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.cs-cta-step {
  display: flex;
  align-items: flex-start;
  gap: 18px;
}

.cs-cta-step-num {
  font-family: 'Antonio', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--cta);
  letter-spacing: 1px;
  min-width: 24px;
  padding-top: 2px;
}

.cs-cta-step-body {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.cs-cta-step-body strong {
  font-size: 15px;
  font-weight: 700;
  color: var(--white-off);
}

.cs-cta-step-body span {
  font-size: 13px;
  color: rgba(255,249,238,0.45);
  line-height: 1.5;
}

.cs-cta-card {
  border: 1.5px solid var(--cta);
  border-radius: 10px;
  padding: 40px 36px 36px;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.cs-cta-card-heading {
  font-family: 'Antonio', sans-serif;
  font-size: 18px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: var(--white-off);
  text-align: center;
  margin-bottom: 28px;
}

.cs-cta-row {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 16px 18px;
  background: rgba(255,249,238,0.05);
  border-radius: 10px;
  margin-bottom: 10px;
  text-decoration: none;
  transition: background .2s;
}

.cs-cta-row:hover { background: rgba(255,249,238,0.09); }

.cs-cta-row-icon {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: rgba(255,249,238,0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.cs-cta-row-icon svg { width: 18px; height: 18px; stroke: rgba(255,249,238,0.6); fill: none; }

.cs-cta-row-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.cs-cta-row-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--white-off);
}

.cs-cta-row-value {
  font-size: 14px;
  color: rgba(255,249,238,0.45);
}

.cs-cta-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 18px 0;
  color: rgba(255,249,238,0.25);
  font-size: 12px;
  letter-spacing: 1px;
}

.cs-cta-divider::before,
.cs-cta-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: rgba(255,249,238,0.1);
}

.cs-cta-button {
  width: 100%;
  justify-content: center;
}

.cs-cta-button:hover {
  color: #1a1a1a;
}

/* CTA progetti: bottone senza riempimento né ombra */
.cs-cta-card .cs-cta-button {
  background: transparent !important;
  box-shadow: none !important;
  border-width: 2px !important;
}
.cs-cta-card .cs-cta-button:hover {
  box-shadow: none !important;
}

@media (max-width: 768px) {
  .cs-cta {
    padding: 80px 6vw;
    grid-template-columns: 1fr;
    gap: 48px;
  }
  .cs-cta-card { padding: 32px 24px; }
}

/* ============================================================
   TAB SERVIZI: una riga + scroll orizzontale da mobile (991px)
   Forza comportamento su homepage e tutte le pagine servizio
   ============================================================ */
@media (max-width: 991px) {
  /* Wrapper scroll (home + DM + FV + GD + SW) */
  .fp-cosa-facciamo .fp-tabs-scroll-wrap,
  .dm-solutions .dm-tabs-scroll-wrap,
  .fv-solutions .fv-tabs-scroll-wrap,
  .gd-solutions .gd-tabs-scroll-wrap,
  .sw-solutions .sw-tabs-scroll-wrap {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin-left: -6px !important;
    margin-right: -6px !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
    padding-bottom: 4px !important;
  }
  .fp-cosa-facciamo .fp-tabs-scroll-wrap::-webkit-scrollbar,
  .dm-solutions .dm-tabs-scroll-wrap::-webkit-scrollbar,
  .fv-solutions .fv-tabs-scroll-wrap::-webkit-scrollbar,
  .gd-solutions .gd-tabs-scroll-wrap::-webkit-scrollbar,
  .sw-solutions .sw-tabs-scroll-wrap::-webkit-scrollbar {
    display: none !important;
  }
  /* Nav: una riga, larghezza = contenuto */
  .fp-cosa-facciamo .dm-tabs-nav,
  .dm-solutions .dm-tabs-nav,
  .fv-solutions .fv-tabs-nav,
  .gd-solutions .gd-tabs-nav,
  .sw-solutions .sw-tabs-nav {
    display: inline-flex !important;
    flex-wrap: nowrap !important;
    width: max-content !important;
    min-width: 100% !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }
  .fp-cosa-facciamo .dm-tab-btn,
  .dm-solutions .dm-tab-btn,
  .fv-solutions .fv-tab-btn,
  .gd-solutions .gd-tab-btn,
  .sw-solutions .sw-tab-btn {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
  }
}