/* ── Tablets (iPad) ─────────────────────────────────────────────────────────
   A faixa do quiosque — (orientation:portrait) and (min-width:700px) and
   (min-height:1000px) — foi escrita para um totem Android de 32" em pé, mas
   captura TODO iPad em retrato: mini 744x1133, Air 820x1180, Pro 11 834x1194,
   Pro 13 1024x1366. O resultado é tipografia e alvos de toque de uma tela três
   vezes maior, com estouro vertical.

   Este arquivo modera essa escala para telas de altura até 1400px (todo iPad
   cabe; o totem de 1920 fica de fora) e dá uma passada no iPad deitado, que
   não casa com NENHUMA faixa hoje e herda o desktop.

   É o ÚLTIMO css do index.html de propósito: as regras do quiosque vivem em
   seis arquivos e têm a mesma especificidade destas, então quem vem depois
   vence. Mexer na ordem dos <link> quebra este arquivo.

   Todas as faixas exigem (pointer:coarse). Sem isso, um monitor de 1080p —
   altura 1080, dentro do max-height:1400 — levaria os ajustes de tablet, e um
   notebook de 1366x768 cairia na faixa de paisagem. O corte é por dedo, não
   por pixel. O totem continua fora por altura (1920). */

@media (orientation:portrait) and (min-width:700px) and (max-height:1400px) and (pointer:coarse) {

  /* Topo e moldura da tela */
  .kiosk:has(.screen.active) .topbar { height:104px; padding:22px 6%; }
  .kiosk:has(.screen.active) .icon-button { width:54px; height:54px; }
  .screen { min-height:calc(100svh - 104px); padding:30px 6% 38px; }

  /* Tipografia dos cabeçalhos de etapa */
  .screen h2 { font-size:clamp(34px,4.6vw,46px); }
  .screen .step-heading > p:last-child,
  [data-screen="lenses"] .step-heading > p:not(.eyebrow) { font-size:19px; }
  .screen :is(.step-row,.eyebrow) { font-size:13px; }
  .screen .sticky-action { padding-top:26px; }

  /* Botões */
  .screen :is(.primary-button,.secondary-button) { min-height:64px; font-size:18px; }
  [data-screen="home"] .primary-button { min-height:66px; font-size:20px; }
  [data-screen="presentation"] .presentation-skip { min-height:64px; font-size:18px; }

  /* Etapa 1: escolha da visão */
  [data-screen="lenses"] .option-list { gap:14px; margin:26px 0; }
  [data-screen="lenses"] .choice-card { min-height:124px; padding:20px; gap:18px; }
  [data-screen="lenses"] .choice-copy b { font-size:22px; }
  [data-screen="lenses"] .choice-copy small,
  [data-screen="lenses"] .choice-copy strong { font-size:16px; }
  [data-screen="lenses"] .lifestyle-cta { grid-template-columns:76px minmax(0,1fr) 50px; gap:18px; min-height:108px; padding:20px 22px; }
  [data-screen="lenses"] .lifestyle-cta-icon { width:76px; height:76px; }
  [data-screen="lenses"] .lifestyle-cta-icon svg { width:44px; height:44px; }
  [data-screen="lenses"] .lifestyle-cta-copy small { font-size:12px; }
  [data-screen="lenses"] .lifestyle-cta-copy b { font-size:25px; }
  [data-screen="lenses"] .lifestyle-cta-copy em { font-size:15px; }
  [data-screen="lenses"] .lifestyle-cta-arrow { width:50px; height:50px; font-size:23px; }
  [data-screen="lenses"] .fast-track { min-height:60px; font-size:16px; }

  /* Perfil visual */
  [data-screen="preferences"] .question-title h3 { font-size:21px; }
  [data-screen="preferences"] .question-title small { font-size:12px; }
  [data-screen="preferences"] .answer-group button { min-height:54px; font-size:15px; }

  /* Cards temáticos (marcas, antirreflexo, fotossensível, multifocal) */
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .milie-card { padding:24px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .milie-card-icon { flex-basis:56px; width:56px; height:56px; border-radius:16px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .milie-card-icon svg { width:32px; height:32px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .milie-card-head small { font-size:11px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .milie-card-head h3 { font-size:25px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .milie-card-text { font-size:17px; margin:16px 0 20px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .milie-card-note { font-size:14px; padding:16px 18px; margin-top:20px; gap:12px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .milie-card-note span { flex-basis:22px; height:22px; font-size:12px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .swatch-lead { font-size:16px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .swatch-grid { gap:12px; margin-top:16px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .swatch-chip { padding:18px 12px 16px; border-radius:18px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .swatch-chip b { font-size:19px; margin-top:12px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .swatch-chip small { font-size:13px; }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .swatch-lens { width:min(100%,108px); }
  :is([data-screen="marcas"],[data-screen="multifocal"],[data-screen="antireflexo"],[data-screen="fotossensivel"],[data-screen="pairing"]) .swatch-check { width:26px; height:26px; font-size:14px; line-height:26px; top:11px; right:11px; }

  /* Comparação de fotos */
  :is([data-screen="antireflexo"],[data-screen="fotossensivel"]) .photo-compare { gap:16px; }
  :is([data-screen="antireflexo"],[data-screen="fotossensivel"]) .photo-shot-tag { left:11px; bottom:11px; padding:7px 13px; font-size:11px; }
  :is([data-screen="antireflexo"],[data-screen="fotossensivel"]) .photo-shot figcaption { font-size:15px; margin-top:11px; }
  :is([data-screen="antireflexo"],[data-screen="fotossensivel"]) .photo-shot-ghost b { font-size:12px; }
  :is([data-screen="antireflexo"],[data-screen="fotossensivel"]) .photo-shot-ghost small { font-size:11px; }

  /* Simulação de sol */
  [data-screen="fotossensivel"] .sun-toggle { margin-top:18px; padding:5px; }
  [data-screen="fotossensivel"] .sun-toggle-btn { min-height:52px; padding:0 22px; font-size:15px; gap:9px; }
  [data-screen="fotossensivel"] .sun-toggle-btn span { font-size:17px; }

  /* Marcas de destaque */
  [data-screen="marcas"] .brand-highlights { margin-top:24px; padding-top:22px; }
  [data-screen="marcas"] .brand-highlights-lead { font-size:16px; }
  [data-screen="marcas"] .brand-grid { gap:14px; margin-top:16px; }
  [data-screen="marcas"] .brand-card { padding:22px 14px; border-radius:18px; }
  [data-screen="marcas"] .brand-card b { font-size:23px; }
  [data-screen="marcas"] .brand-card small { font-size:12px; }

  /* Multifocal: mapas e fatores */
  [data-screen="multifocal"] .mf-campos { margin-top:22px; }
  [data-screen="multifocal"] .mf-niveis { gap:10px; }
  [data-screen="multifocal"] .mf-nivel { min-height:58px; border-radius:16px; font-size:17px; }
  [data-screen="multifocal"] .mf-vista figcaption { font-size:16px; }
  [data-screen="multifocal"] .mf-vista-tag { padding:8px 16px; font-size:13px; }
  :is([data-screen="marcas"],[data-screen="multifocal"]) .trait { grid-template-columns:54px minmax(0,1fr); gap:16px; padding:16px 0; }
  :is([data-screen="marcas"],[data-screen="multifocal"]) .trait-icon { width:54px; height:54px; border-radius:15px; }
  :is([data-screen="marcas"],[data-screen="multifocal"]) .trait-icon svg { width:29px; height:29px; }
  :is([data-screen="marcas"],[data-screen="multifocal"]) .trait b { font-size:19px; }
  :is([data-screen="marcas"],[data-screen="multifocal"]) .trait small { font-size:16px; }
  [data-screen="multifocal"] .answer-group.wide button { min-height:64px; font-size:17px; padding:14px 20px; }

  /* Cliente, apresentação, processamento, análise */
  [data-screen="customer"] .customer-form { padding:30px; gap:22px; margin-top:32px; }
  [data-screen="customer"] .customer-field { font-size:17px; }
  [data-screen="customer"] .customer-field input { height:62px; font-size:19px; }
  [data-screen="customer"] .customer-field small { font-size:14px; }
  [data-screen="customer"] .consent-check p { font-size:15px; }
  [data-screen="customer"] .consent-check b { font-size:16px; }
  [data-screen="customer"] .privacy-link { font-size:15px; min-height:56px; }
  [data-screen="presentation"] .presentation-avatar { width:240px; height:240px; margin-bottom:40px; }
  [data-screen="presentation"] .presentation-copy { font-size:19px; }
  [data-screen="processing"] .processing-intro { font-size:19px; }
  [data-screen="processing"] .processing-message { font-size:23px; }
  [data-screen="analysis"] .recommendation-card { padding:26px; }
  [data-screen="analysis"] .recommendation-card h3 { font-size:30px; }
  [data-screen="analysis"] .recommendation-card > p,
  [data-screen="analysis"] .recommendation-card ul { font-size:18px; }
  [data-screen="analysis"] .recommendation-note { font-size:15px; }
  [data-screen="analysis"] .analysis-message p,
  [data-screen="analysis"] .analysis-message b { font-size:17px; }

  /* Início */
  [data-screen="home"] h1 { font-size:clamp(50px,6.4vw,66px); }
  [data-screen="home"] .home-invitation { font-size:24px; }
  [data-screen="home"] .hero-subtitle { font-size:19px; }
  [data-screen="home"] .home-companion { width:clamp(200px,26vh,320px); }
  [data-screen="home"] .home-guide-heading p { font-size:20px; }
  [data-screen="home"] .home-guide-cards h2 { font-size:20px; }
  [data-screen="home"] .home-guide-cards p { font-size:15px; }

  /* Opções de lente e resultados */
  :is([data-screen="more-options"],[data-screen="lens-results"],[data-screen="treatments"],[data-screen="own-frame"],[data-screen="lens-fitting"],[data-screen="lens-3d"],[data-screen="summary"]) :is(.primary-button,.secondary-button) { min-height:64px; font-size:18px; }
  :is([data-screen="more-options"],[data-screen="lens-results"],[data-screen="treatments"],[data-screen="own-frame"],[data-screen="lens-fitting"],[data-screen="lens-3d"],[data-screen="summary"]) .tech-card { min-height:230px; padding:22px; }
  [data-screen="lens-results"] .criteria-chip { font-size:14px; padding:9px 15px; }
  [data-screen="lens-results"] .criteria-chip b { font-size:11px; }
  [data-screen="lens-results"] .lens-table thead th { padding:15px 16px; font-size:11px; }
  [data-screen="lens-results"] .lens-table td { padding:15px 16px; font-size:15px; }
  [data-screen="lens-results"] .lens-nome { font-size:17px; }
  [data-screen="lens-results"] .lens-marca { font-size:12px; }
  [data-screen="lens-results"] .lens-valor { font-size:18px; }
  [data-screen="lens-results"] .lens-pick { width:26px; height:26px; }

  /* Pagamento e pedido */
  [data-screen="payment"] .pay-total-linhas > div { padding:15px 20px; grid-template-columns:150px minmax(0,1fr) auto; }
  [data-screen="payment"] .pay-total-linhas span { font-size:11px; }
  [data-screen="payment"] .pay-total-linhas b,
  [data-screen="payment"] .pay-total-linhas strong { font-size:16px; }
  [data-screen="payment"] .pay-total-soma { padding:20px; }
  [data-screen="payment"] .pay-total-soma span { font-size:13px; }
  [data-screen="payment"] .pay-total-soma strong { font-size:30px; }
  [data-screen="payment"] .pay-card { grid-template-columns:56px minmax(0,1fr) 26px; padding:18px; gap:16px; }
  [data-screen="payment"] .pay-icon { width:56px; height:56px; border-radius:16px; }
  [data-screen="payment"] .pay-icon svg { width:30px; height:30px; }
  [data-screen="payment"] .pay-copy b { font-size:18px; }
  [data-screen="payment"] .pay-copy small { font-size:13px; }
  [data-screen="payment"] .pay-parcelas-lead { font-size:17px; }
  [data-screen="payment"] .pay-parcela b { font-size:20px; }
  [data-screen="payment"] .pay-parcela small { font-size:13px; }
  [data-screen="payment"] .pay-nota { font-size:13px; }
  [data-screen="order-done"] .order-code strong { font-size:42px; }
  [data-screen="order-done"] .order-done-lead { font-size:18px; }
  [data-screen="order-done"] .order-done-specs dt,
  [data-screen="order-done"] .order-done-specs dd { font-size:15px; }

  /* Lente 3D: gaveta de ajustes */
  [data-screen="lens-3d"] .lens-3d-ajustes > summary { padding:16px 18px; gap:12px; }
  [data-screen="lens-3d"] .ajustes-titulo { font-size:17px; }
  [data-screen="lens-3d"] .ajustes-dica { font-size:13px; }
  [data-screen="lens-3d"] .ajustes-seta { flex-basis:32px; width:32px; height:32px; }
  [data-screen="lens-3d"] .ajustes-seta::before { width:10px; height:10px; border-width:2.4px; }
}

/* ── Modais, que vivem fora das telas ─────────────────────────────────────── */
@media (min-width:700px) and (max-height:1400px) and (pointer:coarse) {
  .sub-options-dialog { width:min(800px, calc(100% - 44px)); padding:36px 30px 20px; }
  .sub-options-dialog > .eyebrow { font-size:12px; }
  .sub-options-dialog > h3 { font-size:30px; }
  .sub-options-dialog .sub-lead { font-size:15px; margin-bottom:22px; }
  .sub-options-dialog .sub-grid { gap:12px; }
  .sub-options-dialog .sub-card { padding:16px 15px; min-height:92px; border-radius:15px; }
  .sub-options-dialog .sub-card b { font-size:16px; padding-right:24px; }
  .sub-options-dialog .sub-card small { font-size:13px; }
  .sub-options-dialog .sub-check { width:22px; height:22px; font-size:12px; line-height:22px; top:12px; right:12px; }
  .sub-options-dialog .sub-group-title { font-size:11px; }
  .sub-options-dialog .sub-back { left:14px; top:18px; padding:12px 18px; font-size:14px; }
  .sub-options-dialog .cor-card { min-height:112px; gap:10px; }
  .sub-options-dialog .cor-card b { font-size:15px; }
  .sub-options-dialog .text-button { font-size:16px; }
  .cor-amostra { width:44px; height:44px; }

  .lens-detail-dialog { width:min(560px, calc(100% - 44px)); padding:38px 32px 28px; }
  .lens-detail-dialog > .eyebrow { font-size:12px; }
  .lens-detail-dialog > h3 { font-size:30px; margin-bottom:22px; }
  .lens-detail-specs > div { padding:14px 18px; }
  .lens-detail-specs dt { font-size:14px; }
  .lens-detail-specs dd { font-size:15px; }
  .lens-detail-price span { font-size:15px; }
  .lens-detail-price strong { font-size:30px; }
}

/* ── Tablet deitado ─────────────────────────────────────────────────────────
   O iPad em paisagem (1180x820, 1366x1024) não casa com NENHUMA faixa hoje:
   herda o desktop, que assume tela alta. Aqui só o necessário para caber na
   altura e aproveitar a largura. */
@media (orientation:landscape) and (min-width:820px) and (max-width:1400px) and (max-height:1120px) and (pointer:coarse) {
  .screen { padding:16px 5% 26px; }
  .screen h2 { font-size:clamp(30px,3.4vw,40px); }
  .screen .step-heading > p:last-child { font-size:16px; }
  .screen .sticky-action { padding-top:18px; }
  .screen :is(.primary-button,.secondary-button) { min-height:56px; }

  /* Largura sobrando: as listas de uma coluna passam a duas. */
  [data-screen="lenses"] .option-list { grid-template-columns:1fr 1fr; }
  [data-screen="lenses"] .choice-card { min-height:112px; }
  [data-screen="preferences"] .question-list { grid-template-columns:1fr 1fr; }
  :is([data-screen="antireflexo"],[data-screen="fotossensivel"]) .photo-shot-frame { aspect-ratio:1/1; }
  /* O card de vídeo fica de fora do 1/1: o clipe é 4:5 e traz a legenda gravada
     no rodapé — cortar para quadrado comeria justamente a legenda. */
  :is([data-screen="antireflexo"],[data-screen="fotossensivel"]) .photo-compare-video .photo-shot-frame { aspect-ratio:4/5; }
  [data-screen="multifocal"] .answer-group.wide { grid-template-columns:repeat(3,1fr); }

  /* Modais: limitar a altura para o rodapé não sair da tela. */
  .sub-options-dialog, .lens-detail-dialog { max-height:calc(100svh - 28px); }
  .sub-options-dialog { padding-top:28px; }
}

/* Busca de armação: alvo de toque de tablet, entre o celular e o totem. */
@media (orientation:portrait) and (min-width:700px) and (max-height:1400px) and (pointer:coarse) {
  [data-screen="frames"] .frame-search-field { margin:24px 0 10px; }
  [data-screen="frames"] #frameSearch { min-height:66px; font-size:18px; padding:0 58px; }
  [data-screen="frames"] .frame-search-icon { left:19px; }
  [data-screen="frames"] .frame-search-icon svg { width:23px; height:23px; }
  [data-screen="frames"] .frame-search-clear { width:38px; height:38px; }
  [data-screen="frames"] .frame-search-count { font-size:14px; }
  [data-screen="frames"] .frame-search-empty { font-size:15px; padding:20px; }
}

/* Comparação de lentes em tablet. */
@media (min-width:700px) and (max-height:1400px) and (pointer:coarse) {
  [data-screen="lens-results"] .compare-trigger { font-size:15px; padding:10px 18px; }
  [data-screen="lens-results"] .compare-trigger svg { width:19px; height:19px; }
  [data-screen="lens-results"] .compare-count { min-width:24px; height:24px; font-size:13px; }
  .lens-compare-dialog { width:min(860px, calc(100% - 44px)); padding:36px 26px 24px; }
  .lens-compare-dialog > h3 { font-size:28px; }
  .compare-table thead th { font-size:17px; padding:14px; }
  .compare-table thead th:first-child { width:150px; }
  .compare-table tbody th { font-size:13px; padding:13px; }
  .compare-table tbody td { font-size:15px; padding:13px; }
  .compare-table tbody td b { font-size:19px; }
  .compare-pick { min-height:50px; font-size:14px; }
}

/* Aviso de bloco insuficiente em tablet. */
@media (min-width:700px) and (max-height:1400px) and (pointer:coarse) {
  .fitting-block-dialog { width:min(640px, calc(100% - 44px)); padding:36px 28px 20px; }
  .fitting-block-dialog > h3 { font-size:29px; }
  .fitting-block-dialog .block-lead { font-size:16px; }
  .block-numeros dt { font-size:12px; }
  .block-numeros dd { font-size:22px; }
  .block-explica b { font-size:16px; }
  .block-explica p { font-size:15px; }
  .block-sugestoes-titulo { font-size:16px; }
  .block-sugestoes b { font-size:16px; }
  .block-sugestoes small { font-size:14px; }
}
