/* StudyFlow · mobile.css — ajustes para celular e tablet
   Carregado depois dos estilos do index.html, então vence nas mesmas regras. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{-webkit-tap-highlight-color:rgba(43,58,232,.12)}

@media(max-width:760px){
  :root{--gutter:18px}

  /* topo */
  .nav{padding:10px var(--gutter);gap:8px;padding-top:max(10px,env(safe-area-inset-top))}
  .nav-right{gap:8px}
  .wordmark{font-size:20px;gap:8px}
  .wordmark svg{width:22px;height:22px}
  .xp{display:none}
  .nav .btn.sm{padding:0 14px;height:42px;font-size:12px;letter-spacing:.06em;gap:8px}

  /* banner */
  .hero{min-height:620px}
  .hero-inner{padding:calc(var(--gutter) + 64px) var(--gutter) calc(var(--gutter) + 6px);gap:20px}
  .eyebrow{font-size:11.5px;letter-spacing:.06em;padding:8px 13px 8px 10px;max-width:100%}
  .hero-title{font-size:clamp(46px,13.4vw,78px);line-height:.94;max-width:none;letter-spacing:-.035em}
  .hero-foot{gap:20px}
  .hero-sub{font-size:17px;line-height:1.5;max-width:none}
  .hero-cta{width:100%;flex-direction:column;align-items:stretch;gap:10px}
  .hero-cta .btn{width:100%;justify-content:center;font-size:13px;padding:17px 22px}

  /* botões e textos gerais */
  .btn{font-size:13px;padding:15px 22px}
  .btn.sm{font-size:12px;padding:12px 16px;min-height:44px}
  .mono{font-size:12px}
  .ticker{padding:12px 0}
  .h2{font-size:clamp(36px,10.4vw,58px);max-width:none;line-height:.98}
  .kicker{margin-bottom:14px}
  .sec-head{margin-bottom:28px}
  .sec-head .lead,.algo-left p,.cards-copy p,.panel.intro p{font-size:16.5px;line-height:1.5;max-width:none}
  .section{padding:72px var(--gutter)}

  /* recursos */
  .feat{min-height:0;padding:22px;gap:14px}
  .feat h3{font-size:23px}
  .feat p{font-size:16px;max-width:none}
  .chip{font-size:14px;padding:8px 13px}

  /* como funciona */
  .panel{padding:22px}
  .panel > p{font-size:16px}
  .panel h3{font-size:24px}
  .mock{font-size:14.5px}
  .mock-label{font-size:13px}

  /* algoritmo */
  .rules li{padding:14px}
  .rules li b{font-size:16px}
  .rules li span{font-size:14.5px}
  .planner{padding:20px 16px}
  .planner-head h3{font-size:21px}
  .planner-hint{font-size:14.5px;color:var(--ink-2)}
  .topic{font-size:14.5px;padding:10px 13px 10px 11px}
  .topic .d{font-size:10.5px}
  .slider label{font-size:15px}
  input[type=range]{height:6px}
  input[type=range]::-webkit-slider-thumb{width:28px;height:28px}
  .planner .bar{grid-template-columns:62px 1fr 72px;font-size:13.5px}
  .out{grid-template-columns:repeat(3,1fr);gap:8px}
  .out div{padding:12px 10px}
  .out b{font-size:26px}
  .out span{font-size:12px;line-height:1.25;display:block}

  /* mapa mental e flashcards */
  .mind{height:500px}
  .mind-legend{left:14px;right:auto;top:12px;gap:10px}
  .deck{height:330px}
  .fc{height:300px}
  .fc .face{padding:22px}
  .fc .a{font-size:17px}
  .deck-ctl{gap:8px}
  .deck-ctl .btn{flex:1;justify-content:center}

  /* bloco de estudo guiado */
  .demo{border-radius:18px}
  .demo-top{padding:12px 14px;gap:8px}
  .demo-top .pill{font-size:11px;padding:6px 10px}
  .stages{flex-wrap:nowrap;overflow-x:auto;padding:14px 14px 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
  .stages::-webkit-scrollbar{display:none}
  .stage{flex:0 0 auto;font-size:14px;padding:10px 14px;white-space:nowrap;scroll-snap-align:start}
  .sp{padding:20px 14px 8px}
  .sp-head h3{font-size:21px}
  .sp-head small{font-size:14px}
  .lesson{font-size:16px}
  .quiz-q{font-size:18px}
  .opt{font-size:16px;padding:15px 16px;min-height:54px}
  textarea.recall{font-size:16px}
  .recall-foot{font-size:14px}
  .msg{font-size:16px;max-width:94%}
  .sugg button{font-size:14.5px;padding:11px 14px}
  .chat-in .inp{min-width:0}
  .check label{font-size:16px;padding:14px}
  .demo-foot{padding:16px 14px 18px}
  .demo-foot .btn{flex:1;justify-content:center}

  /* frase, planos, faq, rodapé */
  .manifesto{padding:90px var(--gutter)}
  .manifesto p{font-size:clamp(30px,9vw,50px);max-width:none}
  .plan{padding:24px 20px}
  .plan ul{font-size:16px}
  .plan .btn{align-self:stretch;justify-content:center}
  .plan-note{font-size:14px}
  .faq summary{font-size:19px;padding:20px 0}
  .faq .ans{font-size:16px}
  .cta .btn{width:100%;justify-content:center}
  .foot-row{font-size:14px}
  .foot-row ul{gap:16px 22px}

  /* app embutido */
  .app-bar{padding:8px var(--gutter);padding-top:max(8px,env(safe-area-inset-top))}
  .app-bar .wordmark{display:none}
  .app-bar .back{font-size:15px;min-height:44px}
  .app-wrap{padding:26px var(--gutter) 80px}
  .app-h2{font-size:clamp(30px,8.6vw,44px)}
  .app .sub{font-size:16px}
  .steps{gap:4px;margin-bottom:28px}
  .steps span{font-size:11px}
  .inp,textarea.recall{font-size:16px}
  .field label,.field .lbl{font-size:15px}
  .pill-btn{font-size:15px;padding:12px 15px}
  .days button{padding:14px 0;font-size:13px}
  .add-row .inp{min-width:0;flex-basis:100%}
  .add-row .tAdd{flex:1;justify-content:center}
  .diff-sel button{padding:11px 13px;font-size:13px}
  .sugg-chips button{font-size:13.5px;padding:9px 12px}
  .wiz-foot .btn{flex:1;justify-content:center}
  .strip{gap:16px 24px;padding:14px 16px}
  .day{padding:14px}
  .day-head{font-size:15px}
  .blk{padding:12px}
  .blk .tpc{font-size:14px}
  .tips{font-size:14.5px}
  .plan-actions{width:100%}
  .plan-actions .btn{flex:1;justify-content:center}
  .toast{bottom:calc(20px + env(safe-area-inset-bottom));font-size:15px}
}

/* telas estreitas: "Começar grátis" vira "Começar" para caber o Simulado */
@media(max-width:480px){
  .nav-xs-hide{display:none}
  .nav .btn.sm{padding:0 12px}
  .app-user{display:none}
}
@media(max-width:350px){
  .wordmark{font-size:18px}
  .nav .sim-btn svg{display:none}
}

/* toque: sem efeitos de hover que "grudam" no celular */
@media(hover:none){
  .feat:hover .feat-ico{transform:translateZ(30px)}
  .rules li:hover,.check label:hover,.blk:hover{transform:none}
}