/* V6 mobile reflow */
.mobile-swipe-hint{display:none}
/* V6 · Reflow responsivo mobile-first. Preserva os assets e as animações oficiais.
   O layout no telefone é uma composição vertical, não o desktop reduzido. */
html{scroll-padding-top:12px}
@media (max-width:900px){
  :root{--page-gutter:clamp(16px,5vw,24px)}
  html,body{width:100%;max-width:100%}
  .topbar{height:70px;padding-inline:var(--page-gutter);gap:10px}
  .topbar nav{display:none}
  .topbar .brand{font-size:clamp(24px,7vw,29px)}
  .header-cta{flex:0 1 auto;max-width:54%;text-align:center;font-size:10px;line-height:1.15;min-height:40px;display:flex;align-items:center;justify-content:center;padding:9px 11px}
  .edition{display:none}
  .hero{min-height:0;height:auto;display:flex;flex-direction:column;align-items:stretch;padding:110px var(--page-gutter) 58px;overflow:hidden}
  .hero-copy{width:100%;padding:0}
  .hero .eyebrow{font-size:9px;letter-spacing:.085em;max-width:100%;flex-wrap:wrap;gap:11px;line-height:1.3}
  .hero-title{font-size:clamp(45px,12.6vw,83px);line-height:.94;letter-spacing:-.083em;white-space:nowrap;margin:24px 0 0;max-width:100%}
  .hero-consequence{font-size:clamp(23px,5.7vw,35px);line-height:1;padding:9px 11px 10px;border-width:3px;max-width:100%;white-space:nowrap;margin-top:17px}
  .hero-consequence .yellow-slash{display:none}
  .hero-summary{font-size:clamp(15px,4vw,18px);margin:20px 0;max-width:500px}
  .hero-actions{flex-wrap:wrap;gap:12px}
  .hero-actions .btn{min-height:48px;min-width:0;padding:12px 19px;gap:15px;font-size:13px}
  .hero-actions .tiny-caption{display:block;font-size:10px}
  .hero-character-wrap{position:relative;bottom:auto;right:auto;left:auto;width:min(84vw,370px);height:min(100vw,430px);min-height:245px;align-self:center;margin:18px auto 0;flex:0 0 auto;animation:mobileCatArrival .75s .4s both}
  .hero-cat.treiningo-rig{height:90%;max-height:100%;max-width:none}
  .hero-spot{bottom:0}
  .hero-scribble{top:55%;right:5%;width:110px;opacity:.32}
  .sticker-a{width:52px;right:2%;top:9%}
  .sticker-b{font-size:clamp(10px,3vw,13px);left:-4%;top:56%;padding:9px 11px;z-index:7}
  .doodle-circle{width:86%;left:7%;top:9%}
  .cat-secret-speech{left:-4%;top:0;max-width:155px;font-size:12px;padding:10px}
  .hero-bottom{bottom:12px;left:var(--page-gutter);right:var(--page-gutter);font-size:9px}
  .section{padding:65px var(--page-gutter)}
  .section-counter{margin-bottom:22px;font-size:10px}
  .massive-heading,.section-title{font-size:clamp(49px,12vw,83px);line-height:.91;letter-spacing:-.079em}
  .excuses-left .body-copy{font-size:16px;line-height:1.55;margin:22px 0}
  .excuse-chips{gap:9px}
  .excuse-chip{font-size:12px;min-height:44px;max-width:100%;padding:11px 14px}
  .excuses-right{height:clamp(350px,102vw,470px);width:100%;margin-top:8px}
  .excuse-card{width:min(78vw,335px);height:88%;border-radius:26px}
  .card-stamp{font-size:clamp(17px,5.1vw,24px);left:16px;right:16px;top:18px}
  .orbit{font-size:70px}
  .orbit2{font-size:58px}
  .excuse-collection{padding:13px;gap:10px}
  /* O propósito usa uma narrativa vertical no celular.
     Sem sticky pin, nenhuma camada depende da altura da viewport para ser lida. */
  .mission{height:auto;min-height:0}
  .mission-scroll-zone{height:auto;position:relative}
  .mission-stage{position:relative;top:auto;height:auto;min-height:0;display:flex;flex-direction:column;align-items:center;overflow:hidden;gap:0;padding:74px var(--page-gutter) 64px}
  .mission-intro{position:relative;top:auto;left:auto;right:auto;width:100%;max-width:520px;opacity:1!important;transform:none!important;order:1;margin-bottom:12px;text-align:left}
  .mission-number{font-size:10px}
  .mission-intro p{font-size:clamp(33px,8.6vw,56px);line-height:.98;margin:16px 0 8px;letter-spacing:-.07em;max-width:100%}
  .mission-intro .mission-tease{font-size:clamp(15px,4vw,18px);max-width:340px;margin:15px 0 0}
  .universe,.mission .universe{position:relative;top:auto;left:auto;right:auto;bottom:auto;order:2;width:min(75vw,330px);height:auto;aspect-ratio:1;flex:none;transform:none!important;margin:62px auto 27px}
  .universe-glow{inset:-10%}
  .mission-cat{width:39%;left:30%;bottom:60%;transform:none!important}
  .orbit-line{opacity:.3!important}
  .orbit-line-2{opacity:.14!important}
  .orbit-note{opacity:1!important;font-size:9px;padding:7px 9px}
  .note-one{right:-4%;top:15%}.note-two{left:-6%;top:70%}
  .mission-claim{position:relative;bottom:auto;left:auto;right:auto;top:auto;width:100%;max-width:570px;order:3;opacity:1!important;transform:none!important;pointer-events:auto!important;text-align:center;margin:16px auto 0}
  .mission-claim::before{inset:-10px -8px -12px}
  .mission-claim h2{font-size:clamp(31px,8.2vw,56px);line-height:.97;letter-spacing:-.065em;margin:14px auto;max-width:100%;overflow-wrap:normal}
  .mission-claim p{font-size:16px}
  .mission-feedback{font-size:11px;line-height:1.5;margin:12px auto;min-height:0}
  .mission-link{font-size:11px;min-height:44px;max-width:100%;padding:12px 18px;margin:8px 0 0}
  .mission-disclaimer{position:relative;left:auto;right:auto;bottom:auto;align-self:flex-start;order:4;margin-top:26px;line-height:1.4;font-size:9px}
  /* Screenshots e passos reais sempre ficam dentro do viewport. */
  .how .section-title{font-size:clamp(46px,11.4vw,74px)}
  .how-stage{width:100%;gap:14px}
  .how-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:6px}
  .how-step,.how-step.active{width:100%;min-width:0;max-width:100%;padding:12px 5px;min-height:64px}
  .how-step strong{font-size:clamp(10px,2.6vw,12px);line-height:1.2;text-align:center}
  .phone-stage{width:100%;height:clamp(415px,123vw,575px);min-height:0;margin:0 auto;overflow:hidden}
  .device-big{width:clamp(178px,53vw,235px);height:auto;aspect-ratio:235/490;max-height:95%;}
  .phone-halo{max-width:100%}
  .notification{left:0;top:15%;width:min(60vw,205px);max-width:100%;padding:12px;font-size:12px;z-index:6}
  .notification p{font-size:12px}
  .notif-actions button{min-height:36px}
  .phone-spark{max-width:65px;right:0}
  .how-aside{max-width:100%}
  .how-title{font-size:clamp(25px,7vw,34px)}
  .modes .section-title{font-size:clamp(38px,9.2vw,64px);line-height:.96;letter-spacing:-.083em;overflow-wrap:normal}
  .modes-head .body-copy{font-size:16px}
  .mode-stage{min-height:0;width:100%;border-radius:22px;overflow:hidden}
  .mode-type{left:15px}
  .mode-tabs{left:10px;right:10px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
  .mode-tab{min-width:0;padding:10px 3px;font-size:clamp(8px,2.35vw,11px);line-height:1.15;min-height:43px}
  .mode-visual{height:clamp(340px,95vw,475px);padding-top:102px}
  .mode-visual>img{max-height:85%;max-width:90%}
  .gigantic-question{font-size:clamp(260px,80vw,460px)}
  .mode-expression-tag{font-size:clamp(11px,3.3vw,15px);padding:8px 10px;right:10px;bottom:4%}
  .mode-foot{gap:8px;margin:0 12px;padding:14px 0}
  .mode-foot strong{font-size:23px}
  .mode-foot p{font-size:12px;max-width:100%}
  .mode-foot>span{font-size:8px;flex:0 0 100px}
  .mobile-swipe-hint{display:flex;align-items:center;gap:10px;color:#4F627D;font-size:11px;font-weight:900;letter-spacing:.06em;margin:0 0 8px}
  .mobile-swipe-hint span{font-size:22px;color:#246ABC}
  .screen-gallery{overflow-x:auto;overflow-y:hidden;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch;scroll-padding-inline:var(--page-gutter);gap:12px;margin:0 calc(-1 * var(--page-gutter));padding:13px var(--page-gutter) 30px;max-width:calc(100% + 2 * var(--page-gutter))}
  .screen-card{flex:0 0 180px;min-width:180px;padding:20px 11px}
  .device.small{width:150px;height:311px}
  .activities .section-title{font-size:clamp(55px,13vw,104px)}
  .activity-board{height:clamp(325px,95vw,430px)}
  .activity-blob{width:clamp(78px,24vw,108px);height:clamp(78px,24vw,108px);font-size:29px}
  .blob-1{left:5%;top:8%}.blob-2{right:6%;top:9%}.blob-3{left:35%;top:35%}.blob-4{left:5%;bottom:8%}.blob-5{right:7%;bottom:7%}
  .blob-6{right:32%;top:3%;width:60px;height:60px;font-size:22px}
  .final{padding:68px var(--page-gutter) 0}
  .final-grid{width:100%;min-width:0;grid-template-columns:minmax(0,1fr)}
  .final-grid>div{min-width:0;max-width:100%}
  .final-title{font-size:clamp(51px,14.5vw,90px);line-height:.9;margin:29px 0 24px;letter-spacing:-.075em;max-width:100%}
  .final-grid p{font-size:18px;line-height:1.45}
  .final-cat-scene{height:clamp(310px,100vw,435px);max-width:100%}
  .final-cat{height:99%;max-width:100%}
  .final-halo{width:min(75vw,325px);height:auto;aspect-ratio:1}
  .bounce-mark{right:2%;font-size:60px}
  footer{padding:26px var(--page-gutter);gap:17px;align-items:center}
  footer .brand{font-size:25px}
  footer .footer-links{flex-wrap:wrap;gap:16px}
  /* Cenas de desculpas: painel rolável quando o aparelho é baixo,
     botões continuam acessíveis sem cortar a cena. */
  .excuse-experience{height:100dvh;max-height:100dvh;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;display:grid;grid-template-rows:auto minmax(250px,43dvh) auto;align-content:start;-webkit-overflow-scrolling:touch}
  .exp-top{padding:14px var(--page-gutter);min-height:60px;position:sticky;top:0;z-index:20;background:var(--exp-bg)}
  .exp-logo{font-size:24px}
  .exp-icon-button,.exp-close{min-height:40px;padding:8px 10px;font-size:10px}
  .exp-canvas{min-height:0;height:100%;overflow:hidden}
  .exp-bottom{padding:13px var(--page-gutter) 38px;z-index:9;min-width:0}
  .exp-copy h2{font-size:clamp(34px,10vw,57px);overflow-wrap:break-word;line-height:.93}
  .exp-copy p{font-size:clamp(13px,3.7vw,16px);line-height:1.42}
  .exp-nav{margin-top:14px;gap:3px}
  .exp-next,.exp-download{min-height:46px}
  .exp-seen{bottom:10px;left:var(--page-gutter)}
  .exp-esc-hint{display:none}
  .rain-caption{top:19%;left:4%}
  .rain-cat{bottom:-2%}
  .exp-rain .umbrella-prop{top:9%;right:6%;width:38%}
  .certificate-paper{height:90%;padding:12px;max-height:100%}
  .certificate-paper h3{font-size:clamp(19px,6vw,38px)}
  .certificate-paper p{font-size:11px}
  .certificate-footer{margin-top:8px;padding-top:8px}
}
@media(max-width:355px){
  .topbar{gap:6px}.topbar .brand{font-size:24px}.header-cta{font-size:9px;padding:7px 9px}
  .hero{padding-top:104px}
  .hero-title{font-size:clamp(40px,12vw,46px)}
  .hero-consequence{font-size:22px;padding:9px 6px}
  .hero-character-wrap{width:84vw;height:310px;margin-top:18px}
  .hero-summary{max-width:100%}
  .hero-actions .btn{font-size:12px;padding:11px 13px}
  .section{padding:57px 16px}
  .massive-heading,.section-title{font-size:clamp(45px,12vw,57px)}
  .activity-blob{width:76px;height:76px;font-size:24px}.activity-blob span{font-size:8px}
  .mode-foot>span{flex-basis:78px;font-size:7px}
  .modes .section-title{font-size:clamp(35px,9.05vw,44px)}
  .final-title{font-size:clamp(46px,14.2vw,58px)}
  .mission-stage{padding-inline:16px}
  .mission-intro p{font-size:31px}
  .mission-claim h2{font-size:30px}
}
@media(max-width:900px) and (orientation:landscape) and (max-height:500px){
 .hero{padding-top:96px}
 .mission-stage{padding-top:55px}
 .excuse-experience{grid-template-rows:auto minmax(185px,50dvh) auto}
 .exp-top{min-height:44px;padding-block:6px}
 .exp-canvas{min-height:0}
 .exp-bottom{padding-top:12px}
}
@media (prefers-reduced-motion:reduce){
 .mission-intro,.mission-claim{opacity:1!important;transform:none!important}
}

@media (min-width:901px) and (max-width:1100px){.hero-character-wrap{right:0;width:38vw}.hero-copy{width:64%}.hero-title{font-size:clamp(69px,8.6vw,93px)}.floating-sticker.sticker-b{left:0}}

@keyframes mobileCatArrival{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:translateY(0)}}

/* Contorno por fora da letra: sem linhas internas cruzando os glifos (Outfit sobrepõe contornos) */
.massive-heading i,.orbit1,.mode-sun,.final-title span{paint-order:stroke fill}
.massive-heading i{-webkit-text-stroke-width:6px;letter-spacing:-.03em}

/* As telas do app vêm sem barra de status: o recorte da câmera cobria os títulos (Agenda, Histórico, Nova rotina) */
.device-island{display:none}
