/* ============================================================
   NoWay Scores — MOBILE PRO CLEAN V5
   Apenas visual da landing em mobile (<=620px).
   NÃO altera links, IDs, JavaScript, Firebase, Stripe, popups PWA,
   /app/, Flutter, Android ou AAB.
   ============================================================ */

@media (max-width: 620px) {

  /* ---------- BASE / TOPO ---------- */
  body {
    padding-top: 74px !important;
  }

  .topbar {
    position: fixed !important;
    top: 6px !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    margin: 0 !important;
    z-index: 30 !important;
    transform: translateZ(0);
  }

  /* Mostra o lockup inteiro; no CSS base estava object-fit:cover. */
  .brand {
    display: flex !important;
    align-items: center !important;
    flex: 0 1 148px !important;
    min-width: 0 !important;
    overflow: visible !important;
  }

  .brand img {
    width: 148px !important;
    height: 40px !important;
    object-fit: contain !important;
    object-position: left center !important;
    border-radius: 10px !important;
  }

  /* ---------- RITMO / TIPOGRAFIA ---------- */
  .shell {
    width: min(100% - 28px, 1180px) !important;
  }

  main .section {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }

  main h2 {
    font-size: clamp(29px, 8.4vw, 38px) !important;
    line-height: 1.04 !important;
    letter-spacing: -.035em !important;
  }

  main h3 {
    font-size: 16px !important;
    line-height: 1.16 !important;
  }

  main .eyebrow {
    font-size: 9px !important;
    letter-spacing: .14em !important;
  }

  main .eyebrow::before {
    width: 16px !important;
  }

  main .section-head p,
  main .showcase-copy p,
  main .ios-card p,
  main .legal-grid p {
    font-size: 13.25px !important;
    line-height: 1.55 !important;
  }

  /* ---------- HERO ---------- */
  main .hero {
    padding-top: 24px !important;
    padding-bottom: 34px !important;
    gap: 18px !important;
  }

  main .hero-copy {
    text-align: center !important;
  }

  main .hero-copy h1 {
    max-width: 360px !important;
    margin: 13px auto 13px !important;
    font-size: clamp(34px, 10.5vw, 46px) !important;
    line-height: .99 !important;
    letter-spacing: -.045em !important;
  }

  main .hero-copy .lead {
    max-width: 345px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    font-size: 13.5px !important;
    line-height: 1.55 !important;
  }

  main .hero-actions {
    margin-top: 18px !important;
    gap: 8px !important;
  }

  main .hero-actions .btn {
    min-height: 46px !important;
    border-radius: 14px !important;
    font-size: 12.5px !important;
  }

  main .trust-row {
    display: flex !important;
    justify-content: center !important;
    gap: 6px !important;
    margin-top: 15px !important;
  }

  main .trust-row span {
    width: auto !important;
    padding: 8px 9px !important;
    border: 1px solid #202020;
    border-radius: 999px;
    background: #0b0b0b;
    font-size: 8.5px !important;
    line-height: 1.2 !important;
    text-align: center;
  }

  /* decoração redundante no mobile */
  main .hero-photo {
    display: none !important;
  }

  main .hero-visual {
    min-height: 0 !important;
    padding-top: 4px !important;
  }

  main .hero-visual .hero-device {
    margin-top: 0 !important;
  }

  main .phone {
    width: min(270px, 78vw) !important;
    transform: none !important;
    border-radius: 38px !important;
  }

  main .phone::after {
    border-radius: 34px !important;
  }

  main .mini-app {
    border-radius: 31px !important;
    padding: 44px 14px 18px !important;
  }

  /* ---------- LIMPEZA: remove blocos repetidos no mobile ---------- */
  /* As mesmas screenshots/benefícios já aparecem no hero e na secção produto. */
  main .visual-band,
  main .signal-strip,
  main .cinematic {
    display: none !important;
  }

  /* ---------- CENTRO DO JOGO ---------- */
  main #produto {
    padding-top: 44px !important;
    padding-bottom: 44px !important;
  }

  main #produto .section-head {
    max-width: 350px !important;
    margin: 0 auto 22px !important;
    text-align: center !important;
  }

  main .feature-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  main .feature-card {
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: 42px 1fr !important;
    grid-template-rows: auto auto !important;
    column-gap: 13px !important;
    row-gap: 3px !important;
    align-items: center !important;
    padding: 14px 15px !important;
    border-radius: 17px !important;
    background: linear-gradient(180deg,#111,#0b0b0b) !important;
    box-shadow: none !important;
  }

  main .feature-icon {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    border-radius: 11px !important;
    font-size: 16px !important;
  }

  main .feature-card h3 {
    grid-column: 2 !important;
    grid-row: 1 !important;
    margin: 0 !important;
    font-size: 15px !important;
  }

  main .feature-card p {
    grid-column: 2 !important;
    grid-row: 2 !important;
    margin: 0 !important;
    color: #94948f !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
  }

  /* ---------- CENÁRIOS: um único showcase real ---------- */
  main .showcase.section {
    display: block !important;
    padding-top: 44px !important;
    padding-bottom: 42px !important;
  }

  main .showcase-copy {
    position: static !important;
    max-width: 350px !important;
    margin: 0 auto 24px !important;
    text-align: center !important;
  }

  main .showcase-copy h2 {
    margin-bottom: 12px !important;
  }

  main .showcase-copy .check-list {
    width: min(100%, 330px) !important;
    margin: 17px auto 0 !important;
    gap: 8px !important;
    text-align: left !important;
    font-size: 11.5px !important;
    line-height: 1.42 !important;
  }

  main .gallery.gallery-v2 {
    display: block !important;
    width: min(100%, 290px) !important;
    margin: 0 auto !important;
    padding: 10px !important;
    overflow: hidden !important;
    border: 1px solid rgba(245,200,75,.18);
    border-radius: 24px !important;
    background: #080808 !important;
    box-shadow: 0 18px 46px rgba(0,0,0,.30) !important;
  }

  main .gallery.gallery-v2 .gallery-main {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 17px !important;
    object-fit: contain !important;
    object-position: center top !important;
    background: #050505 !important;
    box-shadow: none !important;
  }

  /* Evita repetir exatamente as mesmas imagens várias vezes. */
  main .gallery.gallery-v2 .gallery-stack {
    display: none !important;
  }

  /* ---------- PREMIUM ---------- */
  main .premium-section {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }

  main .premium-section .section-head.center {
    max-width: 350px !important;
    margin: 0 auto 22px !important;
  }

  main .pricing-grid {
    gap: 10px !important;
  }

  main .price-card {
    padding: 19px !important;
    border-radius: 19px !important;
  }

  main .price-card h3 {
    margin: 7px 0 0 !important;
  }

  main .price {
    margin: 16px 0 7px !important;
  }

  main .price strong {
    font-size: 33px !important;
  }

  main .price span {
    margin-bottom: 5px !important;
    font-size: 10.5px !important;
  }

  main .price-card p {
    min-height: 0 !important;
    margin-bottom: 0 !important;
    font-size: 11px !important;
    line-height: 1.42 !important;
  }

  main .price-card .btn {
    min-height: 45px !important;
    margin-top: 15px !important;
    border-radius: 13px !important;
    font-size: 12px !important;
  }

  main .renewal-note {
    max-width: 330px !important;
    margin-top: 15px !important;
    font-size: 10px !important;
    line-height: 1.45 !important;
  }

  /* ---------- IPHONE / PRIVACIDADE ---------- */
  main .ios-section,
  main #seguranca {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }

  main .ios-card {
    padding: 21px 18px !important;
    gap: 17px !important;
    border-radius: 19px !important;
  }

  main .steps {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
    margin-top: 14px !important;
  }

  main .steps span {
    padding: 8px 10px !important;
    border-radius: 10px !important;
    font-size: 10.5px !important;
  }

  main .ios-card > .btn {
    width: 100% !important;
    min-height: 45px !important;
    border-radius: 13px !important;
    font-size: 12px !important;
  }

  main .legal-grid {
    gap: 9px !important;
  }

  main .legal-grid article {
    padding: 17px !important;
    border-radius: 17px !important;
  }

  main .legal-grid article h3 {
    margin: 8px 0 !important;
  }

  main .text-link {
    margin-top: 3px !important;
    font-size: 11.5px !important;
  }

  /* ---------- FINAL ---------- */
  main .final-cta {
    padding-top: 42px !important;
    padding-bottom: 54px !important;
  }

  main .final-cta h2 {
    margin-top: 9px !important;
    margin-bottom: 17px !important;
  }

  main .final-cta .hero-actions {
    margin-top: 0 !important;
  }

  main .final-cta .btn {
    min-height: 45px !important;
    font-size: 12px !important;
  }

  .footer {
    padding-top: 24px !important;
    padding-bottom: 28px !important;
  }

  .footer-grid {
    gap: 11px !important;
  }

  .footer-links {
    gap: 11px !important;
    font-size: 11.5px !important;
  }

  .adult-note {
    font-size: 9.5px !important;
  }
}

/* NOWAY VISUAL V7 START */
@media (max-width: 620px) {

  /* PRINT 1 â€” badge visual aprovado em PT.
     O HTML continua por baixo; nao apagamos nem links nem texto. */
  html[lang^="pt"] body main .trust-row {
    display: block !important;
    width: min(100%, 370px) !important;
    margin: 16px auto 0 !important;
    padding: 0 !important;
  }

  html[lang^="pt"] body main .trust-row > span {
    display: none !important;
  }

  html[lang^="pt"] body main .trust-row::before {
    content: "";
    display: block;
    width: 100%;
    aspect-ratio: 1200 / 250;
    background-image: url("/assets/trust-badges-v7.webp");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }

  /* Em EN mantemos os textos traduziveis do site.
     LIVE fica vermelho, MODEL e 18+ mantÃªm dourado/neutro. */
  html[lang^="en"] body main .trust-row {
    display: flex !important;
    justify-content: center !important;
    gap: 6px !important;
    margin-top: 15px !important;
  }

  html[lang^="en"] body main .trust-row > span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html[lang^="en"] body main .trust-row > span:first-child {
    border-color: rgba(255,65,55,.45) !important;
    box-shadow: inset 0 0 18px rgba(255,54,45,.06) !important;
  }

  html[lang^="en"] body main .trust-row > span:first-child b {
    color: #ff4b45 !important;
    text-shadow: 0 0 14px rgba(255,75,69,.28);
  }

  html[lang^="en"] body main .trust-row > span:nth-child(2) b,
  html[lang^="en"] body main .trust-row > span:nth-child(3) b {
    color: #f5c84b !important;
  }

  /* PRINT 2 â€” nova imagem aprovada dentro do showcase.
     Seletores muito especificos para vencer CSS antigo/injetado sem JS. */
  html body main .showcase .gallery.gallery-v2 {
    display: block !important;
    width: min(100%, 310px) !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body main .showcase .gallery.gallery-v2 .gallery-main {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border-radius: 24px !important;
    object-fit: contain !important;
    object-position: center top !important;
    background: transparent !important;
    box-shadow: 0 18px 46px rgba(0,0,0,.32) !important;
  }

  html body main .showcase .gallery.gallery-v2 .gallery-stack {
    display: none !important;
  }
}
/* NOWAY VISUAL V7 END */
/* NOWAY SECOND PHONE RESTORE V14 START */
@media (max-width: 620px) {
  /* Mantem o HERO/topo como esta. Esta regra e SO para o segundo telefone. */
  html body main section.showcase .gallery.gallery-v2 {
    display: block !important;
    width: 100% !important;
    max-width: 360px !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 18px 0 20px !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* Mostra sÃ³ a imagem principal aprovada. */
  html body main section.showcase .gallery.gallery-v2 > img.gallery-main {
    display: block !important;
    width: min(76vw, 300px) !important;
    max-width: 300px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: center top !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  /* Remove a imagem antiga bugada que aparecia por baixo. */
  html body main section.showcase .gallery.gallery-v2 .gallery-stack {
    display: none !important;
  }

  html body main section.showcase .gallery.gallery-v2 .gallery-stack img {
    display: none !important;
  }

  /* Garante que pseudo-elementos de tentativas anteriores nao aparecem. */
  html body main section.showcase .gallery.gallery-v2::before,
  html body main section.showcase .gallery.gallery-v2::after {
    content: none !important;
    display: none !important;
  }
}
/* NOWAY SECOND PHONE RESTORE V14 END */
/* NOWAY SECOND PHONE DEFINITIVE V15 START */

/* Novo segundo telemovel: oculto fora de mobile. */
.noway-second-phone-v15 {
  display: none;
}

@media (max-width: 620px) {

  /* A gallery antiga/bugada deixa de aparecer no mobile. */
  html body main section.showcase .gallery.gallery-v2 {
    display: none !important;
  }

  /* Novo contentor totalmente separado da gallery antiga. */
  html body main section.showcase .noway-second-phone-v15 {
    display: grid !important;
    place-items: center !important;

    width: 100% !important;
    max-width: 380px !important;

    margin: 22px auto 0 !important;
    padding: 8px 0 22px !important;

    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  html body main section.showcase .noway-second-phone-v15 > img {
    display: block !important;

    width: min(74vw, 300px) !important;
    max-width: 300px !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 auto !important;
    padding: 0 !important;

    object-fit: contain !important;
    object-position: center center !important;

    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;

    box-shadow:
      0 22px 55px rgba(0,0,0,.34),
      0 0 32px rgba(245,200,75,.05) !important;

    transform: none !important;
  }

  /* Remove buraco extra antes do Premium. */
  html body main section.showcase {
    padding-bottom: 34px !important;
  }
}
/* NOWAY SECOND PHONE DEFINITIVE V15 END */
/* NOWAY LANG BADGES TOPBAR V16 START */
@media (max-width: 620px) {

  /* EN recebe a mesma apresentaÃ§Ã£o visual da versÃ£o PT,
     mas com uma cÃ³pia em inglÃªs. */
  html[lang^="en"] body main .trust-row {
    display: block !important;
    width: min(100%, 370px) !important;
    margin: 16px auto 0 !important;
    padding: 0 !important;
  }

  html[lang^="en"] body main .trust-row > span {
    display: none !important;
  }

  html[lang^="en"] body main .trust-row::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 2048 / 762 !important;
    background-image: url("/assets/trust-badges-en-v16.webp") !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: contain !important;
  }

  /* Logo NoWay Scores um pouco maior, sem mexer nos botÃµes do topo. */
  html body .topbar .brand {
    flex: 0 1 164px !important;
    min-width: 0 !important;
    overflow: visible !important;
  }

  html body .topbar .brand img {
    width: 164px !important;
    height: 44px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }
}
/* NOWAY LANG BADGES TOPBAR V16 END */
/* NOWAY BADGES EQUAL V17 START */
@media (max-width: 620px) {
  /* PT e EN passam a usar exatamente a mesma caixa visual. */
  html[lang^="pt"] body main .trust-row,
  html[lang^="en"] body main .trust-row {
    display: block !important;
    position: relative !important;

    width: min(calc(100vw - 28px), 428px) !important;
    aspect-ratio: 1200 / 250 !important;

    margin: 16px auto 0 !important;
    padding: 0 !important;

    overflow: hidden !important;
    border: 0 !important;
    border-radius: 16px !important;

    background-color: #050504 !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 100% 100% !important;

    box-shadow:
      0 18px 42px rgba(0,0,0,.28),
      0 0 28px rgba(245,200,75,.035) !important;
  }

  html[lang^="pt"] body main .trust-row > span,
  html[lang^="en"] body main .trust-row > span {
    display: none !important;
  }

  html[lang^="pt"] body main .trust-row {
    background-image: url("/assets/trust-badges-pt-v17.webp") !important;
  }

  html[lang^="en"] body main .trust-row {
    background-image: url("/assets/trust-badges-en-v17.webp") !important;
  }

  /* Fade muito leve para a caixa se fundir com o fundo preto/dourado. */
  html[lang^="pt"] body main .trust-row::after,
  html[lang^="en"] body main .trust-row::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;

    background:
      linear-gradient(180deg, rgba(0,0,0,.00), rgba(0,0,0,.08)),
      radial-gradient(circle at 50% 50%, rgba(245,200,75,.025), transparent 70%) !important;
  }
}

@media (max-width: 390px) {
  html[lang^="pt"] body main .trust-row,
  html[lang^="en"] body main .trust-row {
    width: min(calc(100vw - 20px), 410px) !important;
    border-radius: 14px !important;
  }
}
/* NOWAY BADGES EQUAL V17 END */
/* NOWAY HERO + EN BADGE FIX V18 START */
@media (max-width: 620px) {
  /* PRIMEIRO telemovel / hero */
  html body main .hero-visual {
    display: block !important;
    min-height: 0 !important;
    padding-top: 6px !important;
  }

  html body main .hero-device {
    display: block !important;
    width: min(100%, 356px) !important;
    margin: 0 auto !important;
    min-height: 0 !important;
  }

  html body main .hero-device > .device-glow,
  html body main .hero-device > .phone {
    display: none !important;
  }

  html body main .hero-device::before {
    content: "" !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 941 / 1672 !important;
    background-image: url("/assets/hero-premium-v18.png") !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: contain !important;
  }

  /* EN: se houver linhas/caixas duplicadas nas badges, fica so a primeira. */
  html[lang^="en"] body main .trust-row ~ .trust-row {
    display: none !important;
  }

  html[lang^="en"] body main .trust-row > * {
    display: none !important;
  }

  html[lang^="en"] body main .trust-row {
    margin-bottom: 0 !important;
  }
}
/* NOWAY HERO + EN BADGE FIX V18 END */
/* NOWAY EN BADGE DUPLICATE FIX V19 START */
@media (max-width: 620px) {
  /* A V16 ainda deixava uma imagem antiga no ::before.
     A V17 passou a usar a imagem como background do proprio .trust-row.
     Em EN as duas apareciam ao mesmo tempo. Mantemos so o background V17. */
  html[lang^="en"] body main .trust-row::before {
    content: none !important;
    display: none !important;
    background-image: none !important;
  }
}
/* NOWAY EN BADGE DUPLICATE FIX V19 END */
