.aofHero2, .aofHero2 *{
  font-family: ui-sans-serif, system-ui, -apple-system, "SF Pro Display", "SF Pro Text",
               "Inter", "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  box-sizing: border-box;
}

/* anti-jump: disabilita animazioni/transition finché non è stabile */
html.aofNoAnim *, html.aofNoAnim *::before, html.aofNoAnim *::after{
  transition: none !important;
  animation: none !important;
}

.aofHero2{
  --aof-green: #15908D;
  --aof-accent-1: #8B5CF6;
  --aof-accent-2: #F472B6;
  --ink: #0f172a;
  --muted: rgba(15,23,42,.72);
  --max: 1320px;

  background:#fff;
  padding: 36px 0 64px;
  overflow-x: clip;
}

/* prevent accidental horizontal scroll on the test page */
body{
  overflow-x: hidden;
}

.aofHero2__wrap{
  width: min(var(--max), calc(100% - 28px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: .98fr 1.06fr;
  gap: clamp(12px, 2.1vw, 22px);
  align-items: center;
}

/* mobile-only blocks (default hidden) */
.aofHero2__mediaMobile{ display:none; }
.aofMobOnly{ display:none; }

/* LEFT */
.aofHero2__kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,.10);
  background: rgba(15,23,42,.03);
  color: rgba(15,23,42,.78);
  font-weight: 750;
  font-size:13px;
  letter-spacing:.02em;
  margin-bottom: 14px;
}
.aofHero2__dot{
  width:10px;
  height:10px;
  border-radius:999px;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), rgba(255,255,255,0) 60%),
    linear-gradient(135deg, var(--aof-accent-1), var(--aof-accent-2));
  box-shadow: 0 10px 22px rgba(139,92,246,.16);
}

.aofHero2__title{
  font-size: clamp(34px, 4.2vw, 54px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 12px 0;
  font-weight: 900;
}
.aofHero2__title .hl{
  background: linear-gradient(135deg, var(--aof-accent-1), var(--aof-accent-2));
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}

.aofHero2__sub{
  margin: 0 0 18px 0;
  color: var(--muted);
  font-size: 16.5px;
  line-height: 1.6;
  max-width: 54ch;
}

.aofHero2__row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  margin-top: 12px;
}

.aofHero2__btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 16px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.26);
  color: rgba(255,255,255,.98);
  background: linear-gradient(135deg, var(--aof-accent-1), var(--aof-accent-2));
  text-decoration:none;
  font-weight: 900;
  letter-spacing:.01em;
  box-shadow: 0 16px 30px rgba(139,92,246,.16);
  transform: translateZ(0);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  user-select:none;
}
.aofHero2__btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 22px 44px rgba(139,92,246,.18);
  filter: saturate(1.03);
}
.aofHero2__btn svg{
  width:18px;
  height:18px;
  fill: rgba(255,255,255,.96);
}

.aofHero2__hint{
  color: rgba(15,23,42,.60);
  font-size: 13.5px;
  line-height: 1.35;
  max-width: 42ch;
}

/* Social proof ticker */
.aofProof{
  margin: 10px 0 4px;
  max-width: 600px;
}
.aofProof--mobile{ display:none; }
.aofProof--desktop{ display:block; }
.aofProof__in{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  padding: 9px 10px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background:
    radial-gradient(closest-side at 20% 30%, rgba(139,92,246,.10), transparent 66%),
    radial-gradient(closest-side at 70% 70%, rgba(244,114,182,.08), transparent 66%),
    rgba(255,255,255,.92);
  box-shadow: 0 18px 55px rgba(2,8,23,.06);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  width: 100%;
}

.aofProof__badge{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(15,23,42,.04);
  border: 1px solid rgba(15,23,42,.08);
  color: rgba(15,23,42,.86);
  font-weight: 900;
  font-size: 13px;
  letter-spacing: .01em;
  flex: 0 0 auto;
}
.aofProof__badge svg{
  width: 16px;
  height: 16px;
  fill: rgba(139,92,246,.78);
}

.aofProof__ticker{
  position: relative;
  overflow: hidden;
  flex: 1 1 auto;
  min-width: 0;
  height: 40px;
  mask-image: none;
  -webkit-mask-image: none;
}

.aofProof__slot{
  position:absolute;
  left:0;
  right:0;
  top:0;
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 8px 9px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(139,92,246,.12);
  color: rgba(15,23,42,.78);
  font-weight: 750;
  font-size: 12.5px;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
  transform: translateY(0);
  opacity: 1;
  will-change: transform, opacity;
}
.aofProof__ticker:hover .aofProof__slot{
  transition-duration: 0s !important;
}

.aofProof__slot.is-enter{
  transform: translateY(55%);
  opacity: 0;
}
.aofProof__slot.is-leave{
  transform: translateY(-55%);
  opacity: 0;
}
.aofProof__slot.is-anim{
  transition: transform 900ms cubic-bezier(.2,.75,.2,1), opacity 900ms cubic-bezier(.2,.75,.2,1);
}
.aofProof__dot{
  width: 6px;
  height: 6px;
  border-radius: 99px;
  background: linear-gradient(135deg, var(--aof-accent-1), var(--aof-accent-2));
  box-shadow: 0 10px 22px rgba(139,92,246,.14);
}
.aofProof__who{
  color: rgba(15,23,42,.58);
  font-weight: 800;
}

@media (prefers-reduced-motion: reduce){
  .aofProof__slot{
    position: static;
    transform: none;
    opacity: 1;
    transition: none;
  }
  .aofProof__ticker{ height: auto; }
}

/* RIGHT */
.aofHero2__right{
  position: relative;
  display: grid;
  place-items: center start;
  padding: 8px 0;
}
.aofHero2__right .aofHero2__mediaWide{
  transform: translateY(14px);
}

.aofHero2__mediaWide{
  width: min(640px, 100%);
  display: grid;
  gap: 12px;
}
.aofHero2__mediaWide--mobile{ display:none; }

/* Desktop: numeri a sinistra + divider + foto verticale */
.aofHero2__mediaTall{
  width: min(900px, 100%);
  display:grid;
  grid-template-columns: .92fr 1px 1.28fr;
  gap: 14px;
  align-items:center;
  transform: translateY(10px);
}
.aofHero2__divider{
  width: 1px;
  height: 100%;
  min-height: 520px;
  background: rgba(15,23,42,.12);
  border-radius: 999px;
}
.aofHero2__imgBox{
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 26px 70px rgba(2,8,23,.12);
  background: #fff;
  aspect-ratio: 16 / 9;
}
.aofHero2__imgBox--portrait{ aspect-ratio: 3 / 4; }
.aofHero2__imgBox img{
  width:100%;
  height:100%;
  display:block;
  object-fit: cover;
  object-position: 50% 48%;
  filter: saturate(1.18) contrast(1.08) brightness(1.05);
}
.aofHero2__chips{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.aofHero2__chips .aofChip{
  position:absolute;
}
.aofHero2__chips .aofChip--stress{ top: 10%; left: 6%; }
.aofHero2__chips .aofChip--ansia{ top: 12%; right: 6%; }
.aofHero2__chips .aofChip--insonnia{ top: 46%; right: 4%; }
.aofHero2__chips .aofChip--digestione{ bottom: 14%; left: 6%; }
.aofHero2__chips .aofChip--stanchezza{ bottom: 8%; left: 50%; transform: translateX(-50%); }

.aofHero2__stats{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.aofHero2__stat{
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(15,23,42,.02);
  padding: 12px 10px;
  text-align: center;
}
.aofHero2__stat b{
  display:block;
  font-size: 20px;
  font-weight: 950;
  color: var(--ink);
}
.aofHero2__stat span{
  display:block;
  font-size: 12.5px;
  font-weight: 800;
  color: rgba(15,23,42,.68);
}

.aofHero2__stats--alt5{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  background: #fff;
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 18px;
  padding: 12px;
  box-shadow: 0 18px 44px rgba(2,8,23,.10);
}
.aofHero2__stats--alt5 .aofHero2__stat{
  background: rgba(15,23,42,.02);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: none;
}

.aofHero2__chips--alt5{
  position:absolute;
  inset:0;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  align-content: end;
  padding: 12px;
  pointer-events:none;
}
.aofHero2__chips--alt5 .aofChip{
  position: static;
  background:
    linear-gradient(135deg, rgba(139,92,246,.18), rgba(244,114,182,.18)),
    rgba(255,255,255,.92);
  border: 1px solid rgba(139,92,246,.35);
  box-shadow: 0 12px 26px rgba(139,92,246,.18);
  font-size: 12.8px;
}

.aofHero2__chips--grid{
  position:absolute;
  inset: auto 12px 12px 12px;
  display:grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
  pointer-events:none;
  justify-items: stretch;
}
.aofHero2__chips--grid .aofChip{
  position: static;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  white-space: nowrap;
  background:
    linear-gradient(135deg, rgba(139,92,246,.18), rgba(244,114,182,.18)),
    rgba(255,255,255,.92);
  border: 1px solid rgba(139,92,246,.35);
  box-shadow: 0 10px 22px rgba(139,92,246,.16);
  font-size: 12px;
  line-height: 1.05;
  padding: 8px 8px;
  min-height: 34px;
  grid-column: span 2;
  width: 100%;
  min-width: 0;
}
.aofHero2__chips--grid .aofChip:nth-child(1){ grid-column: 1 / span 2; grid-row: 1; }
.aofHero2__chips--grid .aofChip:nth-child(2){ grid-column: 3 / span 2; grid-row: 1; }
.aofHero2__chips--grid .aofChip:nth-child(3){ grid-column: 5 / span 2; grid-row: 1; }
.aofHero2__chips--grid .aofChip:nth-child(4){ grid-column: 2 / span 2; grid-row: 2; }
.aofHero2__chips--grid .aofChip:nth-child(5){ grid-column: 4 / span 2; grid-row: 2; }
.aofHero2__chips--grid .aofChip:nth-child(4),
.aofHero2__chips--grid .aofChip:nth-child(5){ padding-inline: 9px; }

.aofHero2__chips--alt6{
  position:absolute;
  inset:0;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  align-content: end;
  padding: 12px;
  pointer-events:none;
}
.aofHero2__chips--alt6 .aofChip{
  position: static;
  background: #fff;
  border: 1px solid rgba(15,23,42,.12);
  box-shadow: 0 10px 24px rgba(2,8,23,.10);
  font-size: 12.8px;
}
.aofHero2__stats--alt6{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.aofHero2__stats--alt6 .aofHero2__stat{
  background:
    linear-gradient(135deg, rgba(244,114,182,.16), rgba(139,92,246,.10)),
    #fff;
  border: 1px solid rgba(244,114,182,.30);
  box-shadow: 0 14px 32px rgba(244,114,182,.14);
}
.aofHero2__imgBox--alt5::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.18) 100%);
  pointer-events:none;
}
.aofHero2__stats--alt{
  background: linear-gradient(135deg, rgba(21,144,141,.10), rgba(139,92,246,.10));
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 18px;
  padding: 12px;
  gap: 12px;
}
.aofHero2__stats--alt .aofHero2__stat{
  background: #fff;
  border: 1px solid rgba(15,23,42,.12);
  box-shadow: 0 12px 26px rgba(2,8,23,.08);
}

.aofHero2__stats--alt2{
  background: transparent;
  border-top: 1px solid rgba(15,23,42,.10);
  border-radius: 0;
  padding: 12px 0 0;
  gap: 0;
}
.aofHero2__stats--alt2 .aofHero2__stat{
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 6px 6px 6px 18px;
  position: relative;
}
.aofHero2__stats--alt2 .aofHero2__stat::before{
  content:"";
  position:absolute;
  left: 2px;
  top: 50%;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  transform: translateY(-50%);
  background: linear-gradient(135deg, rgba(21,144,141,.85), rgba(139,92,246,.85));
}
.aofHero2__stats--alt2 .aofHero2__stat + .aofHero2__stat{
  border-left: 0;
}

.aofHero2__stats--vlist{
  grid-template-columns: 1fr;
  border-top: 0;
  padding: 0;
  justify-self: end;
  padding-right: 6px;
  gap: 14px;
}
.aofHero2__stats--vlist .aofHero2__stat{
  text-align:left;
  padding: 10px 10px 10px 22px;
}
.aofHero2__stats--vlist .aofHero2__stat::before{
  width: 9px;
  height: 9px;
  left: 2px;
}
.aofHero2__stats--vlist .aofHero2__stat b{ font-size: 26px; }
.aofHero2__stats--vlist .aofHero2__stat span{ font-size: 14px; }

.aofHero2__stats--alt4{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.aofHero2__stats--alt4 .aofHero2__stat{
  background:
    linear-gradient(180deg, rgba(244,114,182,.12), rgba(139,92,246,.08)),
    #fff;
  border: 1px solid rgba(244,114,182,.25);
  box-shadow: 0 14px 32px rgba(244,114,182,.14);
}

.aofOrbWrap{
  --orbOffsetY: 10px;
  position: relative;
  width: min(610px, 100%);
  aspect-ratio: 1 / 1;
  display:grid;
  place-items:center;
  isolation:isolate;
  transform: translateY(var(--orbOffsetY));
}

.aofOrb{
  width: 86%;
  aspect-ratio: 1 / 1;
  border-radius: 999px;
  background: #fff;
  border: 2px solid rgba(15,23,42,.18);
  overflow: hidden;
  position: relative;
  z-index: 2;
  box-shadow:
    0 30px 90px rgba(2,8,23,.08),
    inset 0 1px 0 rgba(255,255,255,.92);
}

.aofOrbGlow{
  position:absolute;
  inset: -10%;
  z-index: 1;
  pointer-events:none;
  background:
    radial-gradient(closest-side at 50% 55%, rgba(139,92,246,.10), transparent 64%),
    radial-gradient(closest-side at 55% 45%, rgba(244,114,182,.08), transparent 62%);
  filter: blur(2px);
}

.aofOrb__img{
  --imgShiftY: -24px;
  --imgScale: 1.02;
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: 50% 50%;
  display:block;
  transform: translate3d(0, var(--imgShiftY), 0) scale(var(--imgScale));
  transform-origin: 50% 50%;
  will-change: transform;
  filter: saturate(1.08) contrast(1.06) brightness(1.03) sepia(0.08) hue-rotate(-6deg);
}

.aofChip{
  position:absolute;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(139,92,246,.22);
  box-shadow: 0 18px 50px rgba(2,8,23,.08);
  color: rgba(15,23,42,.82);
  font-weight: 800;
  letter-spacing: .01em;
  z-index: 3;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  user-select:none;
}
.aofChip__ico{
  width:26px;
  height:26px;
  border-radius: 10px;
  display:grid;
  place-items:center;
  background:
    linear-gradient(135deg, rgba(139,92,246,.18), rgba(244,114,182,.14));
  border: 1px solid rgba(139,92,246,.18);
}
.aofChip__ico svg{
  width:15px;
  height:15px;
  fill: rgba(15,23,42,.72);
}

.aofChip--lg{ padding: 11px 16px; font-size: 14px; }
.aofChip--md{ font-size: 13.5px; }
.aofChip--sm{ padding: 9px 12px; font-size: 13px; opacity:.98; }

.aofChip--stress{ top: 10%; left: 55%; transform: translateX(-10%); }
.aofChip--ansia{ top: 26%; right: 3%; }
.aofChip--insonnia{ top: 57%; right: 0%; }
.aofChip--digestione{ top: 52%; left: -2%; }
.aofChip--stanchezza{ bottom: 8%; left: 50%; transform: translateX(-50%); }

@media (max-width: 980px){
  .aofHero2{ padding: 26px 0 54px; }
  .aofHero2__wrap{ grid-template-columns: 1fr; }
  .aofHero2__right{ margin-top: 18px; }
  .aofHero2__title{
    font-size: clamp(36px, 9vw, 50px);
    line-height: 1.03;
  }
  .aofHero2__mediaWide{ width: min(460px, 100%); margin: 0 auto; }
  .aofChip--ansia{ right: 1%; }
  .aofChip--insonnia{ right: -1%; }
  .aofChip--digestione{ left: -3%; }

  /* mobile hero order */
  .aofHero2__right{ display:none; }
  .aofHero2__mediaWide--mobile{ display:grid; margin-top: 12px; }
  .aofHero2__mediaWide--mobile{
    grid-template-areas:
      "stats"
      "img";
  }
  .aofHero2__mediaWide--mobile .aofHero2__stats{ grid-area: stats; }
  .aofHero2__mediaWide--mobile .aofHero2__imgBox{ grid-area: img; }
  .aofHero2__stats{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .aofProof--desktop{ display:none; }
  .aofProof--mobile{ display:block; margin-top: 10px; }
  .aofDeskOnly{ display:none; }
  .aofMobOnly{ display:block; }
}

@media (max-width: 520px){
  /* mobile: blocco immagine un po' più piccolo */
  .aofHero2__mediaWide{ width: min(380px, 100%); }

  .aofHero2__kicker{ font-size: 12.5px; }
  .aofHero2__sub{ font-size: 16px; }
  .aofChip{ gap:8px; padding: 9px 12px; }
  .aofChip__ico{ width:24px; height:24px; border-radius: 9px; }
  .aofProof__in{ padding: 9px 10px; }

  /* mobile: numeri sopra la foto (solo nel blocco mobile) */
  .aofHero2__mediaWide--mobile .aofHero2__stats--alt2{
    border-top: 0;
    border-bottom: 1px solid rgba(15,23,42,.10);
    padding: 0 0 10px;
  }
  .aofHero2__mediaWide--mobile .aofHero2__stats--alt2 .aofHero2__stat{
    padding: 6px 6px 6px 14px;
  }
  .aofHero2__mediaWide--mobile .aofHero2__stats--alt2 .aofHero2__stat::before{
    left: 0;
  }

  /* mobile: chips uniformi (3 sopra + 2 sotto, centrati come desktop) */
  .aofHero2__mediaWide--mobile .aofHero2__chips--grid{
    inset: auto 10px 10px 10px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 4px;
    justify-items: stretch;
  }
  .aofHero2__mediaWide--mobile .aofHero2__chips--grid .aofChip,
  .aofHero2__mediaWide--mobile .aofHero2__chips--grid .aofChip.aofChip--sm{
    padding: 6px 6px;
    min-height: 30px;
    font-size: clamp(9.6px, 2.6vw, 10.8px);
    letter-spacing: -0.01em;
    width: 100%;
    grid-column: span 2;
    grid-row: auto;
  }
  .aofHero2__mediaWide--mobile .aofHero2__chips--grid .aofChip:nth-child(1){ grid-column: 1 / span 2; grid-row: 1; }
  .aofHero2__mediaWide--mobile .aofHero2__chips--grid .aofChip:nth-child(2){ grid-column: 3 / span 2; grid-row: 1; }
  .aofHero2__mediaWide--mobile .aofHero2__chips--grid .aofChip:nth-child(3){ grid-column: 5 / span 2; grid-row: 1; }
  .aofHero2__mediaWide--mobile .aofHero2__chips--grid .aofChip:nth-child(4){ grid-column: 2 / span 2; grid-row: 2; }
  .aofHero2__mediaWide--mobile .aofHero2__chips--grid .aofChip:nth-child(5){ grid-column: 4 / span 2; grid-row: 2; }
  .aofHero2__mediaWide--mobile .aofHero2__chips--grid .aofChip:nth-child(4),
  .aofHero2__mediaWide--mobile .aofHero2__chips--grid .aofChip:nth-child(5){ padding-inline: 8px; }

  /* mobile: recensione su 2 righe */
  .aofProof__ticker{ height: 52px; }
  .aofProof__slot{
    white-space: normal;
    height: 52px;
    border-radius: 18px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .aofProof__slot > span:nth-child(2){
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* mobile: badge visibile ma più compatto (come desktop) */
  .aofProof__badge{
    padding: 7px 9px;
    font-size: 12.5px;
    background:
      linear-gradient(135deg, rgba(139,92,246,.10), rgba(244,114,182,.08)),
      rgba(15,23,42,.04);
  }
  .aofProof__badge svg{ fill: rgba(244,114,182,.85); }

  /* mobile: micro-posizionamento chips */
  .aofChip--stress{ top: 8.5%; }
  .aofChip--stanchezza{ bottom: 6.5%; }
}

@media (max-width: 420px){
  .aofHero2__stats{ grid-template-columns: 1fr; }
  .aofHero2__mediaWide--mobile .aofHero2__chips--grid{ inset: auto 10px 10px 10px; gap: 3px; }
  .aofHero2__mediaWide--mobile .aofHero2__chips--grid .aofChip{ padding: 6px 7px; font-size: 10.2px; }
}