/* =========================================================================
   Script Annunci per Adulti — CSS dedicato (prefisso .saa-)
   Palette premium: Nero #111111 · Oro Champagne #C9A34E · Rosso Scuro #8B0000
   · Avorio #F5F5F5. Nessun framework. Responsive. Non tocca style.css.
   Usa il .container globale per allinearsi a header e footer.
   ========================================================================= */

.saa{
  --saa-black:#111111;
  --saa-black-2:#0c0c0c;
  --saa-panel:#181818;
  --saa-gold:#c9a34e;
  --saa-gold-soft:rgba(201,163,78,.30);
  --saa-gold-line:rgba(201,163,78,.22);
  --saa-red:#8b0000;
  --saa-ivory:#f5f5f5;
  --saa-ivory-mut:rgba(245,245,245,.72);
  --saa-ivory-dim:rgba(245,245,245,.52);
  --saa-font-h:'Sora',system-ui,sans-serif;
  --saa-font-b:'Inter',system-ui,sans-serif;
  background:var(--saa-black);
  color:var(--saa-ivory);
  font-family:var(--saa-font-b);
  -webkit-font-smoothing:antialiased;
}

/* Reset mirato dentro il blocco pagina */
.saa *{box-sizing:border-box}
.saa p{margin:0 0 18px;color:var(--saa-ivory-mut);line-height:1.85;font-size:1.06rem}
.saa strong{color:var(--saa-ivory);font-weight:600}
.saa a{color:var(--saa-gold);text-decoration:none}
.saa h2,.saa h3{font-family:var(--saa-font-h);color:var(--saa-ivory);letter-spacing:-.01em;line-height:1.18}
.saa img{max-width:100%;display:block}

/* Occhiello dorato (eyebrow) */
.saa-eyebrow{
  display:inline-block;font-family:var(--saa-font-b);font-weight:600;
  font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--saa-gold);margin-bottom:18px;position:relative;padding-left:34px;
}
.saa-eyebrow::before{
  content:"";position:absolute;left:0;top:50%;width:24px;height:1px;
  background:var(--saa-gold);
}

/* Sezione base — molto spazio, separazione netta */
.saa-section{padding:112px 0;position:relative;overflow:hidden}
.saa-section--alt{background:var(--saa-black-2)}
.saa-section--line{border-top:1px solid var(--saa-gold-line)}
.saa-section__head{max-width:760px;margin:0 0 54px}
.saa-section__head.is-center{margin-left:auto;margin-right:auto;text-align:center}
.saa-section__head h2{font-size:clamp(1.9rem,3.6vw,2.9rem);font-weight:800;margin:0 0 18px}
.saa-section__head p{font-size:1.12rem;margin:0}
.saa-gold{color:var(--saa-gold)}

/* ============================ HERO ============================ */
.saa-hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(60% 120% at 80% 0%,rgba(201,163,78,.10),transparent 60%),
    radial-gradient(50% 100% at 0% 100%,rgba(139,0,0,.14),transparent 60%),
    var(--saa-black);
  padding:120px 0 96px;border-bottom:1px solid var(--saa-gold-line);
}
.saa-hero__inner{max-width:1080px;margin:0 auto;text-align:center}
.saa-hero .container{position:relative;z-index:2}
.saa-hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(38% 55% at 78% 18%,rgba(201,163,78,.12),transparent 60%);animation:saaAura 10s ease-in-out infinite}
@keyframes saaAura{0%,100%{opacity:.55;transform:translate(0,0)}50%{opacity:1;transform:translate(-2.5%,2%)}}
.saa-hero .saa-eyebrow{padding-left:0}
.saa-hero .saa-eyebrow::before{display:none}
.saa-hero h1{
  font-family:var(--saa-font-h);font-weight:800;color:var(--saa-ivory);
  font-size:clamp(2.6rem,6vw,4.2rem);line-height:1.08;letter-spacing:-.02em;margin:0 0 22px;
}
.saa-hero h1 em{font-style:normal;color:var(--saa-gold)}
/* Sottotitolo: 20px come richiesto */
.saa .saa-hero__sub{font-size:21px;line-height:1.65;color:var(--saa-ivory-mut);max-width:760px;margin:0 auto 30px;text-align:center}
.saa-hero__crums{font-size:.86rem;color:var(--saa-ivory-dim);margin-top:34px}
.saa-hero__crums a{color:var(--saa-ivory-mut)}
.saa-hero__crums a:hover{color:var(--saa-gold)}

/* ============================ BOTTONI ============================ */
.saa-btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--saa-font-b);font-weight:600;font-size:1rem;letter-spacing:.01em;
  padding:15px 30px;border-radius:4px;cursor:pointer;transition:all .28s ease;
  border:1px solid transparent;
}
.saa-btn svg{width:18px;height:18px}
.saa .saa-btn--gold{background:var(--saa-gold);color:#1a1408;border-color:var(--saa-gold)}
.saa .saa-btn--gold:hover{background:transparent;color:var(--saa-gold);box-shadow:0 12px 30px rgba(201,163,78,.18)}
.saa .saa-btn--ghost{background:transparent;color:var(--saa-ivory);border-color:var(--saa-gold-soft)}
.saa .saa-btn--ghost:hover{border-color:var(--saa-gold);color:var(--saa-gold)}

/* ============================ SPLIT (testo + immagine) ============================ */
.saa-split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:stretch}
.saa-split__media{display:flex}
.saa-split--rev .saa-split__media{order:-1}
.saa-split__text h2{font-size:clamp(1.9rem,3.4vw,2.7rem);font-weight:800;margin:0 0 20px}
.saa-figure{
  width:100%;position:relative;border:1px solid var(--saa-gold-soft);border-radius:4px;overflow:hidden;
  box-shadow:0 30px 70px rgba(0,0,0,.55);transition:transform .5s ease,box-shadow .5s ease;
}
.saa-figure::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(245,245,245,.04);
}
.saa-figure img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.75,.2,1)}
.saa-figure:hover{transform:translateY(-4px);box-shadow:0 40px 90px rgba(0,0,0,.6)}
.saa-figure:hover img{transform:scale(1.03)}

/* Liste con trattino dorato */
.saa-list{list-style:none;margin:6px 0 20px;padding:0}
.saa-list li{position:relative;padding-left:26px;margin-bottom:12px;color:var(--saa-ivory-mut);line-height:1.7}
.saa-list li::before{
  content:"";position:absolute;left:0;top:12px;width:14px;height:1px;background:var(--saa-gold);
}
.saa-list li strong{color:var(--saa-ivory)}

/* ============================ FUNZIONALITÀ (card) ============================ */
.saa-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.saa-card{
  background:var(--saa-panel);border:1px solid var(--saa-gold-line);border-radius:4px;
  padding:36px 32px;transition:border-color .3s ease,transform .3s ease,box-shadow .3s ease;
}
.saa-card:hover{border-color:var(--saa-gold-soft);transform:translateY(-4px);box-shadow:0 24px 54px rgba(0,0,0,.5)}
.saa-card__ic{
  width:50px;height:50px;display:grid;place-items:center;margin-bottom:20px;
  border:1px solid var(--saa-gold-soft);border-radius:4px;color:var(--saa-gold);
}
.saa-card__ic svg{width:24px;height:24px}
.saa-card h3{font-size:1.2rem;font-weight:700;margin:0 0 10px}
.saa-card p{font-size:.99rem;margin:0;color:var(--saa-ivory-mut)}

/* ============================ TESTO LARGO (colonne) ============================ */
.saa-prose{max-width:860px;margin-left:auto;margin-right:auto}
.saa-section > .container > .saa-list{max-width:860px;margin-left:auto;margin-right:auto}
.saa-cols{columns:2;column-gap:56px}
.saa-cols p{break-inside:avoid}

/* Riga statistiche/numeri */
.saa-stats{display:flex;flex-wrap:wrap;gap:0;margin-top:48px;border-top:1px solid var(--saa-gold-line);border-bottom:1px solid var(--saa-gold-line)}
.saa-stat{flex:1 1 0;min-width:160px;padding:34px 22px;text-align:center;position:relative}
.saa-stat + .saa-stat::before{content:"";position:absolute;left:0;top:26%;bottom:26%;width:1px;background:var(--saa-gold-line)}
.saa-stat b{display:block;font-family:var(--saa-font-h);font-weight:800;font-size:2.3rem;color:var(--saa-gold);line-height:1;margin-bottom:8px}
.saa-stat span{font-size:.92rem;color:var(--saa-ivory-dim);letter-spacing:.02em}

/* ============================ FAQ ============================ */
.saa-faq{max-width:880px;margin:0 auto}
.saa-faq__item{border-bottom:1px solid var(--saa-gold-line)}
.saa-faq__item summary{
  list-style:none;cursor:pointer;padding:24px 44px 24px 0;position:relative;
  font-family:var(--saa-font-h);font-weight:600;font-size:1.12rem;color:var(--saa-ivory);
  transition:color .25s ease;
}
.saa-faq__item summary::-webkit-details-marker{display:none}
.saa-faq__item summary:hover{color:var(--saa-gold)}
.saa-faq__item summary::after{
  content:"";position:absolute;right:6px;top:50%;width:13px;height:13px;
  border-right:1.5px solid var(--saa-gold);border-bottom:1.5px solid var(--saa-gold);
  transform:translateY(-70%) rotate(45deg);transition:transform .3s ease;
}
.saa-faq__item[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.saa-faq__body{padding:0 44px 26px 0}
.saa-faq__body p{margin:0;color:var(--saa-ivory-mut)}

/* ============================ GALLERIA DEMO ============================ */
.saa-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.saa-demo{display:block;text-decoration:none}
.saa-demo__frame{
  position:relative;overflow:hidden;border:1px solid var(--saa-gold-soft);border-radius:4px;
  box-shadow:0 18px 44px rgba(0,0,0,.5);transition:transform .4s ease,box-shadow .4s ease,border-color .4s ease;
}
.saa-demo__frame img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;transition:transform .8s cubic-bezier(.2,.75,.2,1)}
.saa-demo:hover .saa-demo__frame{transform:translateY(-6px);border-color:var(--saa-gold);box-shadow:0 28px 60px rgba(0,0,0,.6)}
.saa-demo:hover .saa-demo__frame img{transform:scale(1.06)}
.saa-demo__title{margin-top:16px;font-family:var(--saa-font-h);font-weight:600;font-size:1rem;color:var(--saa-ivory);text-align:center}
.saa-demo:hover .saa-demo__title{color:var(--saa-gold)}

/* ============================ CTA FINALE ============================ */
.saa-cta-sec{padding:120px 0}
.saa-cta{
  position:relative;overflow:hidden;text-align:center;
  padding:78px 40px;border:1px solid var(--saa-gold-soft);border-radius:6px;
  background:
    radial-gradient(70% 140% at 50% 0%,rgba(201,163,78,.12),transparent 60%),
    linear-gradient(180deg,#161616,#0e0e0e);
}
.saa-cta::before{
  content:"";position:absolute;left:0;top:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--saa-gold),var(--saa-red),transparent);
}
.saa-cta h2{font-size:clamp(2rem,4vw,3rem);font-weight:800;margin:0 0 18px}
.saa-cta p{max-width:640px;margin:0 auto 34px;font-size:1.12rem;color:var(--saa-ivory-mut)}

/* ============================ RESPONSIVE ============================ */
@media(max-width:1024px){
  .saa-grid{grid-template-columns:repeat(2,1fr)}
  .saa-gallery{grid-template-columns:repeat(2,1fr)}
  .saa-split{gap:44px}
  .saa-cols{columns:1}
}
@media(max-width:768px){
  .saa-section{padding:80px 0}
  .saa-split{grid-template-columns:1fr;gap:34px}
  .saa-split--rev .saa-split__media{order:0}
  .saa-hero{padding:92px 0 72px}
  .saa .saa-hero__sub{font-size:18px}
  .saa-figure img{height:auto}
}
@media(max-width:640px){
  .saa-grid{grid-template-columns:1fr}
  .saa-gallery{grid-template-columns:1fr}
  .saa-stat{flex:1 1 50%;min-width:50%}
  .saa-stat:nth-child(3)::before,.saa-stat:nth-child(2)::before{content:none}
}

/* ============================ ANIMAZIONI SCROLL ============================ */
.saa-anim [data-anim]{opacity:0;transition:opacity .7s ease,transform .75s cubic-bezier(.2,.7,.2,1);will-change:opacity,transform}
.saa-anim [data-anim="fade-up"]{transform:translateY(30px)}
.saa-anim [data-anim="fade-left"]{transform:translateX(42px)}
.saa-anim [data-anim="fade-right"]{transform:translateX(-42px)}
.saa-anim [data-anim="zoom"]{transform:scale(.95)}
.saa-anim [data-anim].in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.saa-anim [data-anim]{opacity:1!important;transform:none!important;transition:none}}

/* ============================ EFFETTI FOTO (wow) ============================ */
.saa-split__media{position:relative}
.saa-split__media::before{content:"";position:absolute;inset:-14px;border:1px solid var(--saa-gold-soft);border-radius:6px;z-index:0;pointer-events:none;transition:transform .45s ease,border-color .45s ease}
.saa-split__media::after{content:"";position:absolute;inset:-6%;z-index:0;pointer-events:none;background:radial-gradient(55% 55% at 50% 50%,rgba(201,163,78,.16),transparent 70%);filter:blur(4px);opacity:.6;transition:opacity .45s ease}
.saa-split__media:hover::before{transform:scale(1.03);border-color:var(--saa-gold)}
.saa-split__media:hover::after{opacity:1}
.saa-figure{z-index:1}
.saa-figure::before{content:"";position:absolute;top:-60%;left:0;width:36%;height:220%;z-index:3;background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent);transform:rotate(8deg) translateX(-260%);pointer-events:none}
.saa-split__media.in .saa-figure::before{animation:saaShine 1.2s cubic-bezier(.2,.7,.2,1) .35s 1}
@keyframes saaShine{to{transform:rotate(8deg) translateX(560%)}}
/* galleria: shine in hover */
.saa-demo__frame::after{content:"";position:absolute;top:-60%;left:0;width:40%;height:220%;z-index:2;background:linear-gradient(100deg,transparent,rgba(255,255,255,.16),transparent);transform:rotate(8deg) translateX(-260%);transition:transform 1s ease;pointer-events:none}
.saa-demo:hover .saa-demo__frame::after{transform:rotate(8deg) translateX(560%)}
