/* Storto — libera il design originale dal contenitore del tema (anteprima e home).
   Il design di Marco e' nato come pagina intera a tutta larghezza: il tema lo chiudeva in una colonna,
   e le scritte giganti (misurate in vw) si spezzavano e uscivano dai bordi. */
body.page-id-465 .wp-block-post-content.is-layout-constrained,
body.home .wp-block-post-content.is-layout-constrained {
  max-width: none !important;
  margin-top: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
body.page-id-465 .wp-block-post-content.is-layout-constrained > *,
body.home .wp-block-post-content.is-layout-constrained > * {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
body.page-id-465 main,
body.home main {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
/* La hero respira: meno aria sopra, il claim gigante sale in prima schermata */
body.page-id-465 .hero,
body.home .hero {
  padding-top: 56px !important;
  min-height: calc(100vh - 150px) !important;
}

/* Niente sbordi laterali in home: il design contiene sezioni piu' larghe dello schermo. */
body.home .entry-content { overflow-x: clip; }

/* Footer del design nascosto anche in home: vale il footer Storto unico. */
body.home .entry-content footer { display: none !important; }


/* Via la lettera gigante di sottofondo nella sezione Chi siamo del design (ordine di Marco). */
body.home .about-bg { display: none !important; }

/* Audit §17: il nuovo titolo hero e' lungo, va composto piu' piccolo nel font STORTo. */
body.home .hero-giant { font-size: clamp(46px, 7.4vw, 108px); line-height: 1.05; }
/* Audit §13: parole in contorno piu' leggibili sul nero. */
body.home .aword { -webkit-text-stroke: 1px #8f8f8f; }
/* Hero: claim + tazza (richiesta Marco 2026-10-21) */
.hero-giant { font-size: clamp(72px, 13.5vw, 200px) !important; }
.hero-giant .hero-word:last-child .hero-word-inner { color: #FF6B2B; }
.hero-buy {
  position: absolute; right: 4vw; top: 50%; z-index: 3;
  transform: translateY(-50%); text-decoration: none; text-align: center;
}
.hero-mug {
  width: clamp(250px, 24vw, 380px); height: auto; display: block;
  transform: rotate(-3deg); pointer-events: none;
  filter: drop-shadow(0 20px 28px rgba(10,10,10,.16));
}
.hero-buy-btn {
  display: inline-block; margin-top: 16px; background: #0a0a0a; color: #fafaf8;
  font-family: 'Archivo', sans-serif; font-weight: 600; font-size: 15px; letter-spacing: .02em;
  padding: 13px 24px; border-radius: 999px; transition: background .2s;
}
.hero-buy:hover .hero-buy-btn { background: #FF6B2B; }
.hero h1, .hero .hero-bottom { position: relative; z-index: 2; }
@media (max-width: 767px) {
  .hero-buy { position: static; transform: none; display: block; margin: 30px auto 4px; }
  .hero-mug { width: 62%; margin: 0 auto; }
}

/* Hero prima schermata + tazza grande (ordine Marco 2026-10-21, desktop) */
body.home .hero {
  min-height: calc(100vh - 104px) !important;
  min-height: calc(100svh - 104px) !important;
  padding-top: 20px !important;
  padding-bottom: 36px !important;
}
body.home .hero-giant {
  font-size: clamp(60px, min(12.2vw, 16.5vh), 185px) !important;
}
body.home .hero-label { margin-bottom: 18px; }
body.home .hero-bottom { margin-top: 34px; }
.hero-mug {
  width: clamp(360px, 33vw, 560px);
  mix-blend-mode: multiply;
  filter: none;
  animation: heroFloat 7s ease-in-out infinite alternate;
}
@keyframes heroFloat {
  from { transform: rotate(-3deg) translateY(-7px); }
  to   { transform: rotate(-2deg) translateY(9px); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-mug { animation: none; }
}
@media (max-width: 767px) {
  .hero-mug { animation: none; width: 78%; }
  body.home .hero-giant { font-size: clamp(52px, 15.5vw, 120px) !important; }
}

/* Hero: via la riga brand, tazza che gira (ordine Marco 2026-10-21) */
body.home .hero-label { display: none !important; }
.hero-mug {
  mix-blend-mode: normal;
  animation: none;
  transform: rotate(-2deg);
}
.hero-buy { animation: heroBob 6s ease-in-out infinite alternate; }
@keyframes heroBob {
  from { transform: translateY(calc(-50% - 6px)); }
  to   { transform: translateY(calc(-50% + 7px)); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-buy { animation: none; }
}
@media (max-width: 767px) {
  .hero-buy { animation: none; }
}
/* Vapore sopra la tazza */
.hero-buy::before, .hero-buy::after {
  content: ''; position: absolute; left: 50%; z-index: 4;
  width: 14px; height: 58px; border-radius: 50%;
  background: rgba(190, 190, 190, .55); filter: blur(7px);
  opacity: 0; pointer-events: none;
  animation: heroSteam 3.4s ease-in-out infinite;
}
.hero-buy::before { margin-left: -34px; top: -8px; }
.hero-buy::after { margin-left: 18px; top: -2px; animation-delay: 1.7s; }
@keyframes heroSteam {
  0% { transform: translateY(10px) scaleY(.7) translateX(0); opacity: 0; }
  35% { opacity: .75; }
  100% { transform: translateY(-46px) scaleY(1.25) translateX(7px); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-buy::before, .hero-buy::after { animation: none; }
}

/* Hero: il logo vero al posto della scritta col font (2026-10-21) */
.hero-logo { height: .8em; width: auto; display: block; }

/* Hero calma: un solo bottone, dissolvenze lente (ordine Marco 2026-10-21) */
body.home .hero-cta { display: none !important; }
.hero { perspective: 1200px; }
.hero-buy { animation: heroSway 7s ease-in-out infinite alternate; }
@keyframes heroSway {
  from { transform: translateY(calc(-50% - 5px)) rotateY(-6deg); }
  to   { transform: translateY(calc(-50% + 6px)) rotateY(6deg); }
}
.hero-mug-b {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: contain; opacity: 0; transition: opacity .9s ease;
  pointer-events: none;
}
.hero-buy-btn { background: #0a0a0a !important; color: #fafaf8 !important; }
@media (prefers-reduced-motion: reduce) {
  .hero-buy { animation: none; }
  .hero-mug-b { transition: none; }
}

/* CALMA TOTALE: nessuna animazione sulla tazza (ordine Marco 2026-10-21) */
.hero-buy { animation: none !important; transform: translateY(-50%); }
.hero-buy::before, .hero-buy::after { display: none !important; }
.hero-mug { animation: none !important; transform: none; }
.hero-mug-b { display: none !important; }

/* Logo hero: misura esplicita, indipendente dalla cascata */
body.home .hero-giant .hero-logo {
  height: clamp(46px, min(9.6vw, 13vh), 150px) !important;
  width: auto !important;
  max-width: 92%;
  display: block;
}

/* Lettere che cadono stile neve: piu visibili, deriva laterale lenta (ordine Marco 2026-10-21) */
body.home .falling-letters {
  animation: stortoSnowSway 9s ease-in-out infinite alternate;
}
body.home .falling-letter { opacity: .2 !important; }
@keyframes stortoSnowSway {
  from { transform: translateX(-16px); }
  to   { transform: translateX(16px); }
}
@media (prefers-reduced-motion: reduce) {
  body.home .falling-letters { animation: none; }
}

/* Bottoni importanti in arancione (ordine Marco 2026-10-21) */
.hero-buy-btn { background: #FF6B2B !important; color: #fafaf8 !important; }
.woocommerce a.button.alt, .woocommerce button.button.alt,
.woocommerce input.button.alt, .woocommerce #respond input#submit.alt,
.woocommerce .checkout-button, .woocommerce ul.products li.product .button,
.spx-add, .sf-news-btn {
  background: #FF6B2B !important; color: #fafaf8 !important; border-color: #FF6B2B !important;
}
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover,
.woocommerce .checkout-button:hover, .woocommerce ul.products li.product .button:hover,
.spx-add:hover, .hero-buy-btn:hover { background: #e85a1f !important; }

/* Card negozio (blocchi WooCommerce): bottoni arancioni */
.wc-block-components-product-button__button,
.wp-block-button__link.wc-block-components-product-button__button {
  background: #FF6B2B !important; color: #fafaf8 !important; border-color: #FF6B2B !important;
}
/* Vetrina home: bottone prodotto arancione */
.sh-card .go, a.go { background: #FF6B2B !important; color: #fafaf8 !important; }

/* Layout A: prodotti subito (scelta Marco 2026-10-21) */
body.home .marquee { display: none !important; }
body.home .hero { min-height: 0 !important; padding: 56px 48px 48px !important; }
body.home .about { padding-top: 88px !important; padding-bottom: 88px !important; }
@media (max-width: 760px) {
  body.home .hero { padding: 36px 20px 32px !important; }
  body.home .about { padding-top: 56px !important; padding-bottom: 56px !important; }
}

/* Layout A, giro 2: hero davvero compatta (2026-10-21) */
body.home .hero-giant { font-size: clamp(58px, 10.5vw, 152px) !important; }
body.home .hero-logo { height: clamp(40px, min(7.5vw, 10vh), 108px) !important; }
body.home .hero-buy { width: min(380px, 36vw) !important; }
body.home .hero-mug { width: 100% !important; height: auto !important; }
@media (max-width: 760px) {
  body.home .hero-buy { width: min(300px, 72vw) !important; }
}

/* Home: intestazione davvero fissa (lo sticky si rompe nel documento home) — 2026-10-21 */
body.home .storto-hdr { position: fixed !important; top: 0; left: 0; right: 0; }
body.home.admin-bar .storto-hdr { top: 32px; }
@media (max-width: 782px) { body.home.admin-bar .storto-hdr { top: 46px; } }
body.home { padding-top: 65px; }
@media (max-width: 760px) { body.home { padding-top: 57px; } }

/* Pixel Meta: mai visibile come immagine vuota (brief 2026-10-21) */
img[src*="facebook.com/tr"], img[width="1"][height="1"] { display: none !important; }

/* Bottoni vetrina home: arancioni come il negozio (coerenza brief 2026-10-21) */
.storto-home .card a.go, .storto-home .card .go {
  background: #FF6B2B !important; color: #fafaf8 !important; border-color: #FF6B2B !important;
}
.storto-home .card a.go:hover, .storto-home .card .go:hover { background: #e85a1f !important; }

/* Home ripristinata: allineamento alle decisioni di Marco (2026-10-21) */
body.home .marquee { display: none !important; }
.hero-buy-btn { background: #FF6B2B !important; color: #fafaf8 !important; }
.hero-buy:hover .hero-buy-btn { background: #e85a1f !important; }

/* Card vetrina: selettore corretto (storto-card) — bottoni arancioni */
.storto-home .storto-card a.go {
  background: #FF6B2B !important; color: #fafaf8 !important; border-color: #FF6B2B !important;
}
.storto-home .storto-card a.go:hover { background: #e85a1f !important; }

/* HERO MOBILE: misure da telefono (screenshot Marco 2026-10-21 19:49) */
@media (max-width: 767px) {
  .hero { padding-left: 20px !important; padding-right: 20px !important; overflow-x: clip !important; }
  .hero-giant { font-size: clamp(46px, 14vw, 64px) !important; line-height: .98 !important; }
  .hero-word { display: block !important; }
  .hero-logo { width: min(280px, 74vw) !important; height: auto !important; max-width: 74vw !important; }
  .hero-bottom { display: block !important; margin-top: 30px !important; }
  .hero-desc { position: static !important; width: auto !important; max-width: 100% !important; font-size: 17px !important; line-height: 1.55 !important; }
  .hero-cta { display: inline-block !important; margin-top: 16px !important; }
  .hero-buy { position: static !important; transform: none !important; display: block !important; margin: 30px auto 6px !important; text-align: center !important; }
  .hero-mug { width: min(290px, 70vw) !important; height: auto !important; margin: 0 auto !important; transform: none !important; }
}