:root{
  --brand-a:#FF7A2F;
  --brand-b:#2D2A8C;
}
.brand-gradient{background:linear-gradient(135deg,var(--brand-a),var(--brand-b));}
.brand-text{background:linear-gradient(135deg,var(--brand-a),var(--brand-b));-webkit-background-clip:text;background-clip:text;color:transparent;}
html,body{scroll-behavior:smooth}


/* ========== FILIGRANA LOGO (watermark) ========== */
/* Layer di filigrana sempre dietro ai contenuti */
.wm{
  position: fixed;
  inset: 0;                         /* copre tutta la viewport */
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: none;             /* non blocca click/hover */
  z-index: 0;                       /* sotto a tutto */
  opacity: .06;                     /* intensità filigrana */
}

.wm img{
  max-width: min(70vw, 900px);      /* dimensione adattiva desktop */
  width: 100%;
  height: auto;
  filter: grayscale(100%) contrast(110%);
  mix-blend-mode: multiply;         /* si fonde con lo sfondo */
}

/* Assicura che i contenuti stiano sopra la filigrana */
header, main, section, footer, .container, .page-wrap{
  position: relative;
  z-index: 1;
}

/* Mobile: un po’ più grande e leggermente più visibile */
@media (max-width: 640px){
  .wm img{ max-width: 90vw; }
  .wm{ opacity: .07; }
}

/* --- Opzionale: seconda modalità via background sul body --- */
/* Usa il percorso corretto 'asset/img/logo.png' */



/* === Global watermark: single large logo centered on every page === */
body::before{
  content: "";
  position: fixed;
  inset: 0;
  background: url('../img/logo.png') center center / 80vmin no-repeat;
  opacity: .07;
  filter: grayscale(100%) contrast(110%);
  pointer-events: none;
  z-index: -1;
}


/* === Header brand scaling (logo + text doubled) === */
header img[src*="logo.png"]{
  height: 4rem !important; /* ~ h-24 */
  width: auto !important;
}
header .brand-text{
  font-size: 2.25rem !important; /* ~ text-4xl */
  line-height: 1.1 !important;
}

/* === Fix per logo AxessTMC troppo grande su mobile === */
@media (max-width: 768px) {
  img[src*="logo_axesstmc"] {
    height: 1.5rem !important;  /* ~24px, puoi provare 1.2rem per più piccolo */
    width: auto !important;
  }

  /* Riduci anche il padding del box se serve */
  .absolute img[src*="logo_axesstmc"] {
    margin-top: 0.1rem;
  }
}