@media (max-width: 600px) {
  .topbar { overflow: hidden; }
  .topbar .button { white-space: nowrap; flex: none; }
  .hero-content { width: 100%; max-width: 100%; min-width: 0; }
  .hero h1 { font-size: clamp(31px, 8.6vw, 40px); letter-spacing: -1.8px; overflow-wrap: anywhere; word-break: break-word; }
}

/* Assets visuais de uso livre: Pexels / Mizuno K e Kampus Production. */
.hero {
  background-image: linear-gradient(90deg, #06151df7 0%, #06151dd9 42%, #06151d45 72%, #06151d99 100%), url("assets/family-living-room-pexels.webp");
  background-size: cover;
  background-position: center;
}
.hero-noise { opacity: .14; }
.feature-cinema::after {
  background: linear-gradient(0deg, #06151de8 0%, #06151d10 80%), url("assets/family-tv-pexels.webp") center 47% / cover;
  transform: none;
  width: 100%; height: 100%; left: 0; top: 0;
}
.stream-logo { display:flex; align-items:center; min-height:31px; }
.stream-logo img { display:block; width:40px; height:40px; object-fit:contain; margin-right:11px; background:#eef1ec; border:1px solid #dde3dc; border-radius:8px; padding:5px; box-sizing:border-box; }
.stream-logo b { font-size:17px; }
/* logos claros (Disney+, Universal+) somem em chip claro → chip escuro */
.stream-logo img[alt="Logo Disney+"], .stream-logo img[alt="Logo Universal+"] { background:#0f2231; border-color:#183247; }
.catalog-mark { width:72px; height:44px; padding:5px; background:linear-gradient(135deg,#0d3d4e,#16566a); text-align:center; }
.catalog-mark span { color:#fff; font:800 8px/1.05 Manrope,sans-serif; letter-spacing:-.3px; overflow-wrap:anywhere; }
.catalog-mark img { display:block; width:100%; height:100%; object-fit:contain; }
.catalog-card.streaming .catalog-mark { background:linear-gradient(135deg,#0d4748,#356c72); }
.catalog-card { min-height:76px; }
@media (max-width:600px) {
  .hero { background-position: 62% center; }
  .catalog-mark { width:52px; height:38px; }
  .catalog-mark span { font-size:6px; }
  .stream-logo img { width:25px; height:25px; }
}

.rails { background-image: linear-gradient(90deg, #06151df8 0%, #06151ded 48%, #06151df8 100%), url("assets/cinema-pexels.webp"); background-size:cover; background-position:center; }
.movie-row .cover { background-size:cover; background-position:center; }
.movie-row .cover-1 { background-image:linear-gradient(0deg,#06151df2 0%,#06151d0f 66%), url("assets/movie-1.webp"); }
.movie-row .cover-2 { background-image:linear-gradient(0deg,#06151df2 0%,#06151d0f 66%), url("assets/movie-2.webp"); }
.movie-row .cover-3 { background-image:linear-gradient(0deg,#06151df2 0%,#06151d0f 66%), url("assets/movie-3.webp"); }
.movie-row .cover-4 { background-image:linear-gradient(0deg,#06151df2 0%,#06151d0f 66%), url("assets/movie-4.webp"); }
.movie-row .cover-5 { background-image:linear-gradient(0deg,#06151df2 0%,#06151d0f 66%), url("assets/movie-5.webp"); }
.movie-row .cover small { position:relative; z-index:1; color:#d5e1e3; font-size:10px; margin-top:-10px; }
.football { background:#06151d; color:#fff; display:grid; grid-template-columns:1.08fr .92fr; gap:0; padding:0; overflow:hidden; }
.football-photo { min-height:520px; position:relative; background:linear-gradient(90deg,#0319201c,#031920b8), url("assets/football-stadium-pexels.webp") center/cover; }
.football-score { position:absolute; bottom:32px; left:clamp(24px,6vw,95px); display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:15px 18px; border-radius:10px; background:#06151deb; backdrop-filter:blur(8px); }
.football-score span,.football-programming span { font-size:10px; font-weight:800; color:var(--lime); letter-spacing:1px; }.football-score b { font:800 16px Manrope,sans-serif; }.football-score i { color:#ef5a54; font-style:normal; }.football-score strong { font-size:13px; }
.football-content { padding:80px clamp(25px,6vw,100px) 52px 55px; align-self:center; }.football-content h2 { font:800 clamp(42px,4.3vw,64px)/.98 Manrope,sans-serif; letter-spacing:-3px; margin:0; }.football-content>p:not(.eyebrow) { color:#b8c9ce; line-height:1.55; font-size:16px; max-width:420px; margin:22px 0; }
.football-logos { display:flex; align-items:center; gap:10px; margin:26px 0; }.football-logos img { height:37px; width:70px; object-fit:contain; background:#fff; border-radius:7px; padding:6px; }
.football-programming { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); background:#0b2a36; padding:0 clamp(24px,9vw,135px); }.football-programming article { padding:29px 25px 30px 0; margin-right:25px; border-right:1px solid #ffffff27; }.football-programming article:last-child { border:0; }.football-programming b { display:block; margin:10px 0 7px; font:800 17px Manrope,sans-serif; letter-spacing:-.7px; }.football-programming p { margin:0; color:#a7bec4; line-height:1.45; font-size:12px; }
@media (max-width:800px) { .football { grid-template-columns:1fr; }.football-photo { min-height:360px; }.football-content { padding:60px 24px 40px; }.football-programming { grid-template-columns:1fr; padding:0 24px; }.football-programming article { margin:0; padding:23px 0; border-right:0; border-bottom:1px solid #ffffff27; } }

/* ── Fotos reais nos tiles editoriais (Pexels, licença livre) ── */
.feature-sport::after { background:linear-gradient(0deg,#06151de8 0%,#06151d14 82%), url("assets/feature-sport.webp") center/cover; transform:none; width:100%; height:100%; left:0; top:0; }
.feature-kids::after { background:linear-gradient(0deg,#06151de8 0%,#06151d14 82%), url("assets/feature-kids.webp") center 42%/cover; transform:none; width:100%; height:100%; left:0; top:0; }
.feature-news::after { background:linear-gradient(0deg,#06151de8 0%,#06151d14 82%), url("assets/feature-news.webp") center/cover; transform:none; width:100%; height:100%; left:0; top:0; }

/* ── Fotos reais nos cards "Ao vivo agora" ── */
.live-row .live-art { background-size:cover; background-position:center; }
.live-row .la1 { background-image:linear-gradient(0deg,#06151d59,#06151d1a), url("assets/live-1.webp"); }
.live-row .la2 { background-image:linear-gradient(0deg,#06151d59,#06151d1a), url("assets/live-2.webp"); }
.live-row .la3 { background-image:linear-gradient(0deg,#06151d59,#06151d1a), url("assets/live-3.webp"); }
.live-row .la4 { background-image:linear-gradient(0deg,#06151d59,#06151d1a), url("assets/live-4.webp"); }

/* ── Fotos de "séries" no mockup Continue assistindo ── */
.mini-shelf .poster { background-size:cover; background-position:center; }
.mini-shelf .p1 { background-image:linear-gradient(0deg,#06151d40,#06151d00), url("assets/shelf-1.webp"); }
.mini-shelf .p2 { background-image:linear-gradient(0deg,#06151d40,#06151d00), url("assets/shelf-2.webp"); }
.mini-shelf .p3 { background-image:linear-gradient(0deg,#06151d40,#06151d00), url("assets/shelf-3.webp"); }
.mini-shelf .p4 { background-image:linear-gradient(0deg,#06151d40,#06151d00), url("assets/shelf-4.webp"); }

/* ── Mobile: prateleiras com scroll horizontal + sem overflow lateral ── */
html, body { max-width:100%; overflow-x:hidden; }
.poster-row, .live-row { overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; scrollbar-width:none; scroll-snap-type:x proximity; padding-bottom:6px; }
.poster-row::-webkit-scrollbar, .live-row::-webkit-scrollbar { height:0; display:none; }
.poster-row > article, .live-row > article { scroll-snap-align:start; }
@media (max-width:600px) {
  .hero h1 { line-height:1.02; }
  .editorial-grid { grid-template-rows:200px 168px; }
  .feature-tile h3 { font-size:19px; letter-spacing:-1px; }
  .cover { min-width:150px; height:214px; }
  .live-row article { min-width:200px; }
  .plan-card { padding:24px; }
  .price { font-size:50px; }
}

/* ── Hero mobile: empilha o mockup ABAIXO do texto (para de sobrepor) ── */
@media (max-width:820px) {
  .hero { display:block; min-height:0; padding-top:84px; padding-bottom:44px; }
  .hero-content { max-width:none; width:auto; }
  .app-window {
    position:relative; right:auto; left:auto; top:auto; bottom:auto;
    transform:none; width:100%; max-width:440px; height:auto; min-height:288px;
    margin:40px auto 0; pointer-events:none;
  }
  .app-window .app-kicker { margin-top:34px; }
  .app-window h2 { font-size:clamp(28px,7vw,40px); }
  .shelf-label { margin-top:30px; }
  .mini-shelf { gap:10px; }
  .mini-shelf .poster { width:100%; height:96px; }
}
@media (max-width:600px) {
  .hero { padding-top:74px; }
  .app-window { padding:20px; }
}

/* ── Legibilidade: verde-limão some em seções de fundo claro → teal legível ── */
.section h2 em { color:#0f7c8c; }

/* ── Botão "Ver todos os canais" do catálogo ── */
#catalog-more { display:flex; justify-content:center; margin:28px 0 4px; }
.catalog-more { cursor:pointer; padding:15px 32px; font:700 14px "DM Sans",sans-serif; }

/* ── Card "Tudo que entra no seu ORBE+" ── */
.plan-includes { max-width:680px; margin:0 auto 34px; background:#fff; border:1px solid var(--line); border-radius:20px; padding:28px 26px 24px; }
.includes-title { font:800 19px Manrope,sans-serif; letter-spacing:-.5px; margin:0 0 16px; text-align:center; }
.includes-logos { display:flex; flex-wrap:wrap; justify-content:center; gap:9px; }
.inc-logo { width:50px; height:50px; border-radius:12px; background:#eef1ec; border:1px solid #dde3dc; display:grid; place-items:center; padding:8px; box-sizing:border-box; }
.inc-logo img { max-width:100%; max-height:100%; object-fit:contain; }
.inc-logo--dark { background:#0f2231; border-color:#183247; }
.includes-note { font-size:12px; color:var(--muted); text-align:center; line-height:1.5; margin:14px auto 20px; max-width:470px; }
.includes-list { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:10px 20px; }
.includes-list li { font-size:14px; font-weight:600; padding-left:27px; position:relative; }
.includes-list li::before { content:"✓"; position:absolute; left:0; top:0; width:19px; height:19px; background:var(--lime); color:var(--ink); border-radius:50%; display:grid; place-items:center; font-size:11px; font-weight:800; }
.guarantee-badge { display:flex; align-items:center; gap:15px; margin-top:22px; padding:15px 18px; border-radius:14px; background:#eafaf1; border:1px solid #bfe8d0; }
.guarantee-badge > b { font:800 36px/1 Manrope,sans-serif; color:#1f9d57; flex:0 0 auto; }
.guarantee-badge strong { display:block; font:800 15px Manrope,sans-serif; color:var(--ink); }
.guarantee-badge span { font-size:12.5px; color:#3c6b52; line-height:1.4; }

/* ── Popup de telas (order bump) ── */
.screen-modal { position:fixed; inset:0; z-index:100; display:flex; align-items:center; justify-content:center; padding:20px; background:#06151dcc; -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
.screen-modal[hidden] { display:none; }
.screen-modal-box { background:#fff; color:var(--ink); border-radius:20px; padding:34px 26px 24px; max-width:440px; width:100%; position:relative; box-shadow:0 30px 80px #0008; max-height:92vh; overflow:auto; }
.screen-modal-close { position:absolute; top:12px; right:15px; border:0; background:transparent; font-size:27px; line-height:1; color:var(--muted); cursor:pointer; }
.screen-modal-box .eyebrow { color:#158397; }
.screen-modal-box h3 { font:800 24px Manrope,sans-serif; letter-spacing:-1px; margin:6px 0 8px; }
.screen-sub { color:var(--muted); font-size:14px; line-height:1.5; margin:0 0 20px; }
.screen-options { display:flex; flex-direction:column; gap:10px; }
.screen-opt { display:flex; align-items:center; gap:12px; border:2px solid var(--line); border-radius:13px; padding:14px 15px; cursor:pointer; transition:.15s; }
.screen-opt:hover { border-color:#9fc3c9; }
.screen-opt.is-selected { border-color:var(--deep); background:#f2f8f7; }
.screen-opt input { accent-color:var(--deep); width:18px; height:18px; flex:0 0 auto; }
.screen-opt-info { flex:1; display:flex; flex-direction:column; }
.screen-opt-info b { font-size:15px; }
.screen-opt-info small { font-size:12px; color:var(--muted); }
.screen-opt-price { font:800 14px Manrope,sans-serif; color:var(--deep); white-space:nowrap; }
.screen-confirm { width:100%; margin-top:20px; padding:16px; }
.screen-guarantee { text-align:center; font-size:12px; color:#1f9d57; margin:12px 0 0; font-weight:700; }
@media (max-width:600px) { .includes-list { grid-template-columns:1fr; } .plan-includes { padding:24px 20px 20px; } }

/* ── Hero: mural de conteúdo estilo streaming (fotos de banco livre) ── */
.hero { background:#06151d; }
.hero-light, .hero-noise { display:none; }
.hero-wall {
  position:absolute; inset:-12% -6%; z-index:0; pointer-events:none;
  display:grid; grid-template-columns:repeat(7,1fr); gap:10px;
  transform:rotate(-8deg) scale(1.22); transform-origin:center; opacity:.62; filter:saturate(.95) brightness(.9);
}
.hero-wall span { display:block; aspect-ratio:2/3; border-radius:9px; background-size:cover; background-position:center; box-shadow:0 12px 30px #00000073; }
.hero::after {
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg,#06151df5 0%,#06151de2 40%,#06151d8c 68%,#06151dbd 100%), linear-gradient(0deg,#06151d 1%,#06151d40 24%,transparent 50%);
}
.hero-content { position:relative; z-index:2; }
.hero .eyebrow, .hero-content h1, .hero-content > p, .hero-meta { text-shadow:0 2px 18px #06151de8, 0 1px 4px #06151dcc; }
.app-window { display:none; }
@media (max-width:900px) { .hero-wall { grid-template-columns:repeat(5,1fr); transform:rotate(-8deg) scale(1.4); } }
@media (max-width:600px) {
  /* mobile: texto em fundo escuro sólido (100% legível) + capas viram prateleira embaixo */
  .hero { background:radial-gradient(circle at 80% 14%,#184150 0,#0b2b38 42%,#06151d 80%); padding-bottom:206px; }
  .hero::after { display:none; }
  .hero-wall {
    position:absolute; inset:auto 0 0 0; height:194px; z-index:0;
    display:flex; gap:9px; padding:0 0 0 24px;
    grid-template-columns:none; transform:none; opacity:1;
    filter:brightness(.74) saturate(.98);
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 44%);
    mask-image:linear-gradient(180deg,transparent 0,#000 44%);
  }
  .hero-wall span { flex:0 0 auto; width:118px; height:176px; aspect-ratio:auto; align-self:flex-end; box-shadow:0 8px 22px #00000073; }
}