/* Phase 14J visual parity sprint 2: Elementor screenshot matching layer. */
:root {
  --sa-yellow: #fff001;
  --sa-green: #00a63f;
  --sa-green-soft: #8cff9a;
  --sa-black: #050505;
  --sa-ink: #101010;
  --sa-border-strong: #111;
  --sa-shadow-hard: 6px 6px 0 #111;
}

body {
  background: #fff;
}

.sa-topbar {
  background: #050505 !important;
  border: 0 !important;
  color: #fff !important;
}

.sa-topbar__inner {
  max-width: 1180px;
  min-height: 28px !important;
  font-size: 0.72rem !important;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.sa-topbar a {
  color: #00b344 !important;
  font-weight: 900;
}

.sa-header {
  background: var(--sa-yellow) !important;
  border-bottom: 0 !important;
  box-shadow: 0 2px 0 rgb(0 0 0 / 12%) !important;
}

.sa-header__inner {
  display: grid !important;
  grid-template-columns: 120px minmax(340px, 520px) minmax(360px, 1fr) !important;
  grid-template-areas:
    "brand search actions"
    "nav nav nav" !important;
  gap: 0.34rem 0.85rem !important;
  max-width: 1180px !important;
  min-height: 82px !important;
  padding-block: 0.34rem 0 !important;
  align-items: center !important;
}

.sa-header__brand {
  grid-area: brand;
  min-width: 112px !important;
  align-self: center;
}

.sa-header__brand .custom-logo-link {
  width: 112px !important;
  min-height: 50px !important;
}

.sa-header__brand .custom-logo {
  width: 112px !important;
  min-width: 112px !important;
  max-height: 52px !important;
}

.sa-header-search {
  grid-area: search;
  display: grid !important;
  grid-template-columns: 1fr auto;
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
  border: 2px solid var(--sa-border-strong) !important;
  border-radius: 999px !important;
  background: #fff !important;
  box-shadow: none !important;
  overflow: hidden;
}

.sa-header-search input {
  min-height: 32px !important;
  border: 0 !important;
  padding: 0 0.9rem !important;
  font-size: 0.76rem !important;
  font-weight: 650;
  background: #fff !important;
}

.sa-header-search button {
  min-height: 32px !important;
  border: 0 !important;
  border-left: 2px solid var(--sa-border-strong) !important;
  border-radius: 0 !important;
  padding: 0 0.8rem !important;
  background: var(--sa-green) !important;
  color: #fff !important;
  font-size: 0.72rem !important;
  font-weight: 950 !important;
  text-transform: uppercase;
}

.sa-header__actions {
  grid-area: actions;
  display: flex !important;
  gap: 0.32rem !important;
  justify-self: end !important;
  align-items: center;
  white-space: nowrap;
}

.sa-header-icon,
.sa-language-switch,
.sa-promo-button {
  min-height: 31px !important;
  border: 2px solid var(--sa-border-strong) !important;
  border-radius: 999px !important;
  padding-inline: 0.58rem !important;
  background: #fff !important;
  color: var(--sa-ink) !important;
  font-size: 0.66rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-transform: uppercase;
  box-shadow: none !important;
}

.sa-promo-button {
  background: #050505 !important;
  color: #fff !important;
  border-color: #050505 !important;
}

.sa-language-switch {
  background: #fff !important;
  color: var(--sa-green) !important;
}

.sa-header__nav {
  grid-area: nav;
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  display: flex !important;
  justify-content: center !important;
  background: #050505 !important;
  min-height: 34px;
  padding: 0 !important;
  align-self: end;
}

.sa-nav--desktop {
  max-width: 1180px;
  width: 100%;
  display: flex !important;
  justify-content: center;
  gap: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.sa-nav--desktop > li > a,
.sa-nav--desktop a {
  display: flex !important;
  min-height: 34px;
  align-items: center;
  padding: 0 0.78rem !important;
  color: #fff !important;
  font-size: 0.72rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-transform: uppercase;
}

.sa-nav--desktop a:hover,
.sa-nav--desktop a:focus-visible {
  background: var(--sa-green) !important;
  color: #fff !important;
}

.sa-mega-menu {
  top: 100% !important;
  background: #050505 !important;
  border-top: 3px solid var(--sa-yellow) !important;
  border-bottom: 5px solid var(--sa-green) !important;
  box-shadow: 0 24px 40px rgb(0 0 0 / 28%) !important;
}

.sa-mega-menu__inner {
  max-width: 1180px !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 0 !important;
  padding-block: 0.85rem 1rem !important;
}

.sa-mega-menu__section {
  min-height: 295px !important;
  padding: 0.9rem 0.82rem !important;
  background: #161616 !important;
  border: 1px solid #333 !important;
  border-left: 0 !important;
  border-radius: 0 !important;
}

.sa-mega-menu__section:first-child {
  border-left: 1px solid #333 !important;
}

.sa-mega-menu__title {
  color: var(--sa-yellow) !important;
  font-size: 0.82rem !important;
  font-weight: 950 !important;
  line-height: 1.1 !important;
  text-transform: uppercase;
}

.sa-mega-menu__group h2 {
  margin-top: 0.82rem !important;
  margin-bottom: 0.28rem !important;
  color: #fff !important;
  font-size: 1.15rem !important;
  line-height: 0.95 !important;
  text-transform: uppercase;
}

.sa-mega-menu__group a {
  color: #00b344 !important;
  font-size: 0.77rem !important;
  font-weight: 850 !important;
  line-height: 1.25 !important;
}

.sa-footer {
  background: #000 !important;
  color: #fff !important;
  border-top: 0 !important;
}

.sa-footer__grid {
  grid-template-columns: 1.15fr 1fr 0.75fr 0.85fr !important;
  gap: clamp(1.5rem, 4vw, 4.2rem) !important;
  max-width: 1180px !important;
  padding-block: clamp(2.2rem, 5vw, 4rem) !important;
}

.sa-footer__title,
.sa-footer h2 {
  color: #fff !important;
  font-size: 1.05rem !important;
  font-weight: 950 !important;
  text-transform: uppercase;
}

.sa-footer p,
.sa-footer a,
.sa-footer li {
  color: #fff !important;
  font-size: 0.86rem !important;
  line-height: 1.55 !important;
}

.sa-footer a {
  color: #00b344 !important;
  font-weight: 850 !important;
}

.sa-footer__logo img,
.sa-footer .sa-logo img {
  width: 96px !important;
  max-height: 72px !important;
  object-fit: contain;
}

.sa-payment-badges,
.sa-footer__payments {
  display: flex;
  gap: 0.42rem;
  flex-wrap: wrap;
}

.sa-payment-badges span,
.sa-footer [class*="badge"] {
  border: 1px solid var(--sa-yellow) !important;
  border-radius: 0 !important;
  background: #111 !important;
  color: #fff !important;
}

.sa-trustpilot-shell {
  border: 1px solid var(--sa-yellow) !important;
  border-radius: 0 !important;
  background: #111 !important;
  color: #fff !important;
}

.sa-home-hero {
  min-height: clamp(520px, 76vh, 760px) !important;
  background: var(--sa-yellow) !important;
}

.sa-home-hero__inner {
  max-width: 1180px !important;
  min-height: clamp(500px, 72vh, 720px) !important;
  grid-template-columns: minmax(0, 0.95fr) minmax(340px, 0.72fr) !important;
  gap: clamp(2rem, 5vw, 5rem) !important;
  align-items: center !important;
  padding-block: clamp(3.5rem, 8vw, 6.5rem) !important;
}

.sa-home-title {
  max-width: 12ch;
  font-size: clamp(2.55rem, 5vw, 5.3rem) !important;
  line-height: 0.9 !important;
  font-weight: 950 !important;
  text-transform: uppercase;
}

.sa-home-lead {
  max-width: 48ch;
  margin-top: 1rem;
  font-size: 1.02rem !important;
  font-weight: 750 !important;
  color: #111 !important;
}

.sa-home-actions {
  margin-top: 1.4rem !important;
  gap: 0.7rem !important;
}

.sa-button,
.sa-home-actions .sa-button,
.sa-page-cta {
  border: 3px solid #111 !important;
  border-radius: 0 !important;
  background: var(--sa-green) !important;
  color: #111 !important;
  box-shadow: 4px 4px 0 #111 !important;
  font-weight: 950 !important;
  text-transform: uppercase;
}

.sa-button--secondary,
.sa-home-actions .sa-button--secondary {
  background: #fff !important;
  color: #111 !important;
}

.sa-home-hero__media,
.sa-hero__media {
  position: relative;
  display: grid;
  place-items: center;
}

.sa-home-hero__image {
  max-width: min(370px, 100%) !important;
  filter: drop-shadow(12px 14px 0 rgb(0 0 0 / 10%));
}

.sa-home-hero__badge {
  max-width: 230px;
  color: #111 !important;
  font-size: 0.88rem !important;
  font-weight: 750 !important;
}

.sa-section {
  padding-block: clamp(3rem, 7vw, 5.5rem) !important;
}

.sa-home-section__head {
  max-width: 760px !important;
}

.sa-home-section__title,
.sa-page-hero h1,
.sa-product-summary__title {
  color: #111 !important;
  font-weight: 950 !important;
  line-height: 0.95 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase;
}

.sa-home-card,
.sa-page-card,
.sa-page-content__main {
  border: 3px solid #111 !important;
  border-radius: 0 !important;
  background: var(--sa-green-soft) !important;
  box-shadow: 5px 5px 0 #111 !important;
}

.sa-home-card__image {
  border: 0 !important;
  background: #fff !important;
}

.sa-home-band,
.sa-home-trust-list li {
  background: var(--sa-green-soft) !important;
  border-radius: 0 !important;
}

.sa-product__masthead,
.sa-product__main {
  background: var(--sa-yellow) !important;
}

.sa-product__main {
  max-width: 1180px !important;
  grid-template-columns: minmax(0, 0.92fr) minmax(360px, 0.74fr) !important;
  gap: 1.15rem !important;
  padding-block: 0.9rem 2.1rem !important;
}

.sa-product-gallery__stage {
  min-height: 560px !important;
  border: 3px solid #111 !important;
  border-radius: 0 !important;
  background: var(--sa-yellow) !important;
  box-shadow: none !important;
}

.sa-product-gallery__main {
  min-height: 520px !important;
  padding: 1rem !important;
}

.sa-product-gallery__main img {
  max-height: 500px !important;
  object-fit: contain;
}

.sa-product-summary,
.sa-product-panel,
.sa-product-description,
.sa-product-trust__card,
.sa-product-faq__list,
.sa-product-related__card {
  border: 3px solid #111 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}

.sa-product-summary {
  padding: clamp(1rem, 2.4vw, 1.45rem) !important;
}

.sa-product-summary__title {
  font-size: clamp(2rem, 3.9vw, 3.8rem) !important;
}

.sa-product-price,
.sa-product-summary__price {
  font-size: 1.35rem !important;
  font-weight: 950 !important;
  color: #111 !important;
}

.sa-product-panel__step {
  background: #111 !important;
  color: var(--sa-yellow) !important;
}

.sa-product-option-pill {
  border: 1px solid #bbb !important;
  border-radius: 0 !important;
  background: #f7f7f7 !important;
}

.sa-product-band,
.sa-product-trust {
  background: var(--sa-green-soft) !important;
}

.sa-page-hero {
  background: var(--sa-yellow) !important;
  border-bottom: 5px solid #111 !important;
  color: #111 !important;
}

.sa-page-hero__inner {
  max-width: 1180px !important;
  min-height: clamp(280px, 42vw, 450px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-block: clamp(2.7rem, 7vw, 5.2rem) !important;
}

.sa-page-hero h1 {
  max-width: 15ch !important;
  font-size: clamp(2.4rem, 5vw, 5.1rem) !important;
}

.sa-page-hero p {
  max-width: 58ch !important;
  color: #111 !important;
  font-weight: 750;
}

.sa-page-content {
  background: #fff !important;
}

.sa-page-content__grid {
  max-width: 1180px !important;
  gap: clamp(1.2rem, 3vw, 2.6rem) !important;
  padding-block: clamp(2.6rem, 6vw, 4.6rem) !important;
}

.sa-page-content__main h2,
.sa-page-card h3 {
  font-size: clamp(1.35rem, 2vw, 2.15rem) !important;
  font-weight: 950 !important;
  text-transform: uppercase;
}

.sa-crea-anteprima .sa-crea-anteprima-form-shell,
.sa-crea-anteprima-form-shell {
  border: 3px solid #111 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: 5px 5px 0 #111 !important;
}

@media (max-width: 1180px) {
  .sa-header__inner {
    grid-template-columns: 110px minmax(260px, 1fr) auto !important;
  }

  .sa-header-icon span:not(.sa-header-icon__glyph),
  .sa-language-switch,
  .sa-promo-button {
    font-size: 0.62rem !important;
  }

  .sa-mega-menu__inner {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 900px) {
  .sa-topbar__inner {
    min-height: 26px !important;
    justify-content: space-between !important;
    gap: 0.5rem !important;
    padding-inline: 0.8rem;
    font-size: 0.58rem !important;
  }

  .sa-topbar__inner > *:nth-child(n+4) {
    display: none !important;
  }

  .sa-header__inner {
    display: flex !important;
    min-height: 54px !important;
    padding: 0.32rem 0.8rem !important;
  }

  .sa-header__brand .custom-logo-link {
    width: 78px !important;
    min-height: 38px !important;
  }

  .sa-header__brand .custom-logo {
    width: 78px !important;
    min-width: 78px !important;
    max-height: 39px !important;
  }

  .sa-header-search,
  .sa-header__nav,
  .sa-header__actions > .sa-header-icon,
  .sa-header__actions > .sa-language-switch,
  .sa-header__actions > .sa-promo-button,
  .sa-mega-menu {
    display: none !important;
  }

  .sa-header__actions {
    margin-left: auto !important;
  }

  .sa-menu-toggle {
    display: inline-grid !important;
    width: 40px !important;
    height: 40px !important;
    place-items: center !important;
    border: 3px solid #111 !important;
    border-radius: 0 !important;
    background: var(--sa-green) !important;
    box-shadow: 3px 3px 0 #111 !important;
  }

  .sa-menu-toggle__bar {
    width: 20px !important;
    height: 3px !important;
    background: #111 !important;
  }

  .sa-mobile-menu {
    background: rgb(0 0 0 / 72%) !important;
  }

  .sa-mobile-menu__panel {
    width: min(92vw, 390px) !important;
    margin-left: auto;
    border-left: 4px solid #111 !important;
    background: var(--sa-yellow) !important;
    color: #111 !important;
  }

  .sa-mobile-menu__head {
    border-bottom: 4px solid #111 !important;
  }

  .sa-mobile-menu__close {
    border: 3px solid #111 !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: #111 !important;
    box-shadow: 3px 3px 0 #111 !important;
  }

  .sa-mobile-menu__search,
  .sa-mobile-accordion,
  .sa-mobile-menu__actions a {
    border: 3px solid #111 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: 3px 3px 0 #111 !important;
  }

  .sa-mobile-accordion summary {
    color: #111 !important;
    font-weight: 950 !important;
    text-transform: uppercase;
  }

  .sa-home-hero {
    min-height: auto !important;
  }

  .sa-home-hero__inner {
    display: flex !important;
    min-height: auto !important;
    padding: 2.25rem 1rem 0 !important;
    gap: 1.2rem !important;
  }

  .sa-home-title {
    max-width: 10.5ch;
    font-size: clamp(2.4rem, 13vw, 3.7rem) !important;
  }

  .sa-home-lead {
    font-size: 0.9rem !important;
  }

  .sa-home-actions {
    display: grid !important;
    gap: 0.55rem !important;
  }

  .sa-home-actions .sa-button {
    width: 100%;
    justify-content: center;
  }

  .sa-home-hero__image {
    max-width: min(280px, 92vw) !important;
  }

  .sa-section {
    padding-block: 2.4rem !important;
  }

  .sa-home-grid,
  .sa-home-grid--4,
  .sa-page-content__grid,
  .sa-footer__grid,
  .sa-product__main {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .sa-product__main {
    padding-inline: 0.75rem !important;
    gap: 0.75rem !important;
  }

  .sa-product-gallery__stage,
  .sa-product-gallery__main {
    min-height: 0 !important;
  }

  .sa-product-gallery__main img {
    max-height: 320px !important;
  }

  .sa-product-summary__title {
    font-size: clamp(2rem, 12vw, 3rem) !important;
  }

  .sa-page-hero__inner {
    min-height: 260px;
    padding: 2.3rem 1rem !important;
  }

  .sa-page-hero h1 {
    font-size: clamp(2.35rem, 13vw, 3.7rem) !important;
  }

  .sa-page-card,
  .sa-page-content__main,
  .sa-home-card {
    box-shadow: 4px 4px 0 #111 !important;
  }

  .sa-footer__grid {
    padding-inline: 1rem;
    gap: 1.6rem !important;
  }

  .sa-footer__mobile {
    background: #050505 !important;
    border-top: 1px solid #222 !important;
  }
}


/* 14J mobile readability correction. */
@media (max-width: 900px) {
  .sa-home-title {
    max-width: 100% !important;
    font-size: clamp(2rem, 9.2vw, 2.65rem) !important;
    line-height: 0.94 !important;
  }

  .sa-home-hero__inner {
    padding-top: 1.8rem !important;
  }

  .sa-home-lead {
    max-width: 32ch !important;
  }

  .sa-home-hero__badge {
    max-width: 26ch !important;
    font-size: 0.72rem !important;
  }
}

/* 14J mobile hero stacking: keep the Elementor-like vertical rhythm instead of a squeezed two-column hero. */
@media (max-width: 900px) {
  .sa-home-hero__inner {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .sa-home-hero__media,
  .sa-hero__media {
    width: 100% !important;
    justify-items: center !important;
  }

  .sa-home-title {
    max-width: 12ch !important;
    font-size: clamp(2.45rem, 12vw, 3.25rem) !important;
  }
}
