/* ITALPARK — Esperienza immersiva "Soggetti Sacri" (child theme, servita dal modulo italparkassets).
   TEST scoped a body.product-id-226 (Madonna Immacolata). Compliant PS9: nessuna modifica a core/tema padre.
   Concept: fondale CHIESA "a cornice" (ricchezza su LATI e ALTO — zone sempre libere — e CENTRO scuro/vuoto
   dove va il contenuto) + testata trasparente con blur (come le pagine immersive) + contenuto prodotto su
   CARTE BIANCHE che galleggiano sul fondale. Immersivita' dal top FINO al box newsletter: "Resta in contatto"
   + footer ESCLUSI (opachi). Fondale e player iniettati da sacro.js.
   ⚠️ L'immersivo e' SOLO DESKTOP (>=1200): la "cornice" vive sui margini laterali, che su mobile non ci sono
   -> su mobile la pagina resta NORMALE (menu/icone fruibili, niente spaginature). Per estendere a tutti i
   soggetti sacri: scope body.product-id-category-9. */

@media (min-width:1200px){

  /* ===== FONDALE chiesa fisso (parallax): #sacro-bg iniettato da sacro.js ===== */
  body.product-id-226 #sacro-bg{ position:fixed; inset:0; z-index:0;
    background:#0a0806 url(../img/sacro/chiesa-laterale.webp) center center/cover no-repeat; }
  /* velo leggero: l'immagine ha gia' il centro scuro -> solo un filo in alto (leggibilita' header blur) + base */
  body.product-id-226 #sacro-bg::after{ content:""; position:absolute; inset:0; background:
    linear-gradient(180deg, rgba(10,8,6,.5) 0%, rgba(10,8,6,.12) 15%, rgba(10,8,6,.14) 58%, rgba(10,8,6,.42) 100%); }

  /* ===== contenuto sopra il fondale + wrapper trasparenti ===== */
  body.product-id-226 #wrapper, body.product-id-226 #content-wrapper, body.product-id-226 #main,
  body.product-id-226 .columns-container, body.product-id-226 .center-column,
  body.product-id-226 .product-container, body.product-id-226 .breadcrumb__wrapper,
  body.product-id-226 #content, body.product-id-226 #notifications{ position:relative; z-index:1; }
  body.product-id-226 #wrapper, body.product-id-226 #content-wrapper, body.product-id-226 #main,
  body.product-id-226 .columns-container, body.product-id-226 .center-column,
  body.product-id-226 .breadcrumb__wrapper{ background:transparent !important; }

  /* ===== TESTATA immersiva: FISSA, trasparente + blur + bianco; VERDE solida allo scroll (.sacro-scrolled) ===== */
  body.product-id-226 header.header{ position:fixed !important; top:0 !important; left:0 !important; right:auto !important;
    width:100vw !important; z-index:60 !important;
    background:linear-gradient(180deg, rgba(18,28,16,.78) 0%, rgba(18,28,16,.42) 55%, rgba(18,28,16,0) 100%) !important;
    box-shadow:none !important; border:0 !important; transition:background .3s ease, box-shadow .3s ease; }
  body.product-id-226 header.header .header-top{ background:transparent !important; border-bottom:1px solid rgba(255,255,255,.16) !important; }
  body.product-id-226 header.header::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
    -webkit-backdrop-filter:blur(9px) saturate(1.04); backdrop-filter:blur(9px) saturate(1.04);
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 55%,rgba(0,0,0,.35) 80%,transparent 100%);
    mask-image:linear-gradient(180deg,#000 0%,#000 55%,rgba(0,0,0,.35) 80%,transparent 100%); }
  body.product-id-226 header.header > *{ position:relative; z-index:1; }
  body.product-id-226 header.header, body.product-id-226 header.header a,
  body.product-id-226 header.header .ps-mainmenu__tree-link,
  body.product-id-226 header.header .header-top__left, body.product-id-226 header.header .header-top__right,
  body.product-id-226 header.header .ps-shoppingcart a, body.product-id-226 header.header .header-block,
  body.product-id-226 header.header .ps-searchbar__magnifier,
  body.product-id-226 header.header .itlp-lang, body.product-id-226 header.header .itlp-cta{ color:#fff !important; }
  body.product-id-226 header.header .itlp-lang{ border-color:rgba(255,255,255,.4) !important; }
  /* LOGO bianco sul fondale scuro */
  body.product-id-226 header.header .header-bottom__logo img.logo{ filter:brightness(0) invert(1) !important; -webkit-filter:brightness(0) invert(1) !important; }
  /* allo SCROLL: barra verde solida (menu/logo bianchi leggibili sul contenuto) */
  body.product-id-226 header.header.sacro-scrolled{ background:rgba(17,24,14,.70) !important; -webkit-backdrop-filter:blur(15px) saturate(1.3) !important; backdrop-filter:blur(15px) saturate(1.3) !important; border-bottom:1px solid rgba(201,171,110,.3) !important; box-shadow:0 10px 30px -10px rgba(0,0,0,.5) !important; }
  body.product-id-226 header.header.sacro-scrolled::before{ -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
  body.product-id-226 header.header.sacro-scrolled .header-top{ border-bottom-color:rgba(255,255,255,.18) !important; }

  /* il contenuto parte SOTTO l'header fisso; la fascia "hero" in alto mostra volta+archi della chiesa */
  body.product-id-226 #wrapper{ padding-top:150px !important; }

  /* breadcrumb chiaro nella fascia hero */
  body.product-id-226 .breadcrumb__wrapper{ padding-top:.4rem !important; }
  body.product-id-226 .breadcrumb, body.product-id-226 .breadcrumb *{ color:rgba(255,255,255,.92) !important; }

  /* ===== contenuto su CARTE BIANCHE PIENE (niente trasparenza/blur -> niente aloni "box nel box") ===== */
  body.product-id-226 .center-column > .product-container,
  body.product-id-226 .center-column > .product-comments-wrapper,
  body.product-id-226 .center-column > .product__accessories,
  body.product-id-226 .center-column > .ps-categoryproducts,
  body.product-id-226 .center-column > .ps-viewedproduct{
    background:#ffffff !important; border-radius:10px; box-shadow:0 24px 66px -26px rgba(0,0,0,.7); padding:1.6rem !important; }
  body.product-id-226 .center-column > .product-container{ margin-top:2rem !important; }
  body.product-id-226 .center-column > .product-comments-wrapper,
  body.product-id-226 .center-column > .product__accessories,
  body.product-id-226 .center-column > .ps-categoryproducts,
  body.product-id-226 .center-column > .ps-viewedproduct{ margin-top:1.3rem !important; }

  /* ===== footer + newsletter ESCLUSI (opachi, sopra il fondale) -> chiudono l'immersivita' ===== */
  body.product-id-226 footer{ position:relative !important; z-index:1 !important; background:#f3efe6 !important; }
  body.product-id-226 .ps-emailsubscription, body.product-id-226 .footer__main, body.product-id-226 footer > *{ position:relative !important; z-index:1 !important; }

  /* ===== PLAYER canto gregoriano (iniettato da sacro.js) — angoli netti, NIENTE PILLOLE ===== */
  #sacro-player{ position:fixed; right:18px; bottom:96px; z-index:50; }
  #sacro-toggle{ display:inline-flex; align-items:center; gap:10px; cursor:pointer;
    background:rgba(16,22,14,.82); color:#f3efe3; border:1.5px solid #9a7b3f; border-radius:6px;
    padding:11px 15px; font-family:'Poppins',system-ui,sans-serif; font-size:.74rem; font-weight:600;
    letter-spacing:.1em; text-transform:uppercase; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); transition:.25s; }
  #sacro-toggle:hover{ background:rgba(154,123,63,.92); color:#fff; }
  #sacro-toggle .sacro-ico{ font-size:.85rem; line-height:1; }
}

/* ===== MOBILE/TABLET (<1200): immersivo SPENTO -> pagina NORMALE (menu/icone fruibili, niente spaginature) ===== */
@media (max-width:1199px){
  body.product-id-226 #sacro-bg, body.product-id-226 #sacro-player{ display:none !important; }
}