/* Home do Portal — experiência exclusiva para celulares.
   Ativada somente quando o body recebe .mobile-home-mode.
   O layout desktop permanece sob responsabilidade de portal.css.
   Prioridade: baixa visão, tipografia grande e alvos de toque amplos. */

body.mobile-home-mode{
  min-height:100dvh;
  overflow-x:hidden;
  background:linear-gradient(180deg,#edf5fb 0,#f7fafc 55%,#eef5f9 100%);
}

body.mobile-home-mode .portal-shell{
  min-height:100dvh;
}

/* Cabeçalho mobile com identidade e conta visíveis. */
body.mobile-home-mode .portal-topbar{
  border-bottom-width:4px;
}

body.mobile-home-mode .portal-topbar-inner{
  width:100% !important;
  min-height:0 !important;
  margin:0 !important;
  padding:18px 20px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:15px !important;
}

body.mobile-home-mode .portal-brand--portal-identity{
  flex:1 1 auto !important;
  width:auto !important;
  min-width:0 !important;
  gap:14px !important;
}

body.mobile-home-mode .portal-brand--portal-identity .portal-symbol{
  width:80px !important;
  height:80px !important;
  flex:0 0 80px !important;
}

body.mobile-home-mode .portal-brand-copy{
  min-width:0 !important;
  max-width:none !important;
}

body.mobile-home-mode .portal-brand-copy h1{
  display:block !important;
  margin:0 !important;
  font-size:clamp(25px,3.8vw,34px) !important;
  font-weight:850 !important;
  line-height:1.12 !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  -webkit-line-clamp:2 !important;
}

body.mobile-home-mode .portal-brand-copy p{
  display:none !important;
}

body.mobile-home-mode .portal-user{
  flex:0 0 auto !important;
  width:auto !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  padding:0 !important;
  border:0 !important;
}

body.mobile-home-mode .portal-account-area{
  max-width:235px;
  padding:6px 8px !important;
  gap:9px !important;
}

body.mobile-home-mode .portal-user-meta{
  display:block !important;
  min-width:0 !important;
  text-align:left !important;
}

body.mobile-home-mode .portal-user-meta strong{
  display:block !important;
  max-width:154px;
  font-size:clamp(18px,2.55vw,23px) !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

body.mobile-home-mode .portal-user-meta span{
  display:none !important;
}

body.mobile-home-mode #portalLogout{
  flex:0 0 auto !important;
  min-height:56px !important;
  padding:12px 18px !important;
  border-radius:15px !important;
  font-size:clamp(18px,2.4vw,22px) !important;
}

/* Conteúdo principal. */
body.mobile-home-mode .portal-main{
  width:100% !important;
  margin:0 auto 62px !important;
  padding:18px 14px 0 !important;
}

/* Hero: informação essencial, grande e sem excesso de texto. */
body.mobile-home-mode .portal-hero{
  width:100% !important;
  padding:28px 25px 29px !important;
  border-radius:25px !important;
  gap:0 !important;
  box-shadow:0 14px 34px rgba(22,56,91,.11) !important;
}

body.mobile-home-mode .portal-hero-copy{
  width:100% !important;
  max-width:none !important;
}

body.mobile-home-mode .portal-eyebrow{
  font-size:clamp(18px,2.4vw,23px) !important;
  font-weight:900 !important;
}

body.mobile-home-mode .portal-hero h2{
  margin:9px 0 13px !important;
  font-size:clamp(42px,5.8vw,55px) !important;
  font-weight:850 !important;
  line-height:1.07 !important;
  letter-spacing:-.025em !important;
}

body.mobile-home-mode .portal-hero p{
  display:-webkit-box !important;
  max-width:none !important;
  margin:0 !important;
  overflow:hidden !important;
  -webkit-line-clamp:3 !important;
  -webkit-box-orient:vertical !important;
  font-size:clamp(23px,3.1vw,30px) !important;
  line-height:1.5 !important;
  font-weight:500 !important;
}

/* A seção vira somente o invólucro do launcher. */
body.mobile-home-mode .portal-section{
  margin-top:24px !important;
  overflow:visible !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.mobile-home-mode .portal-section-heading{
  padding:4px 4px 18px !important;
  border:0 !important;
}

body.mobile-home-mode .portal-section-heading h2,
body.mobile-home-mode .portal-section-heading h3{
  font-size:clamp(32px,4.25vw,41px) !important;
  font-weight:900 !important;
  line-height:1.15 !important;
}

/* Launcher em duas colunas, priorizando reconhecimento visual e toque. */
body.mobile-home-mode #toolsFallback .portal-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:18px !important;
  padding:0 !important;
}

body.mobile-home-mode #toolsFallback .hub-card{
  position:relative !important;
  width:100% !important;
  min-width:0 !important;
  min-height:305px !important;
  padding:28px 20px 24px !important;
  border:2px solid #cfddea !important;
  border-radius:27px !important;
  background:linear-gradient(180deg,#fff 0%,#f7fbfe 100%) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:16px !important;
  text-align:center !important;
  box-shadow:0 12px 30px rgba(20,55,90,.10) !important;
  -webkit-tap-highlight-color:transparent;
}

body.mobile-home-mode #toolsFallback .hub-card:active{
  transform:scale(.982) !important;
}

body.mobile-home-mode #toolsFallback .hub-card > .hub-card-icon{
  flex:0 0 auto !important;
  width:126px !important;
  height:126px !important;
  margin:0 auto !important;
  border-radius:30px !important;
}

body.mobile-home-mode #toolsFallback .hub-card-icon img{
  width:114px !important;
  height:114px !important;
  border-radius:26px !important;
}

body.mobile-home-mode #toolsFallback .hub-card-icon svg{
  width:76px !important;
  height:76px !important;
}

body.mobile-home-mode #toolsFallback .hub-card > span:not(.hub-card-icon):not(.hub-card-arrow){
  display:flex !important;
  flex:1 1 auto !important;
  min-width:0 !important;
  width:100% !important;
  align-items:center !important;
  justify-content:center !important;
}

body.mobile-home-mode #toolsFallback .hub-card h3{
  width:100% !important;
  margin:0 !important;
  font-size:clamp(29px,3.9vw,38px) !important;
  font-weight:850 !important;
  line-height:1.16 !important;
  text-align:center !important;
}

body.mobile-home-mode #toolsFallback .hub-card p{
  display:none !important;
}

/* A ação vira um botão visual claro, mas o card inteiro continua clicável. */
body.mobile-home-mode #toolsFallback .hub-card-arrow{
  display:inline-flex !important;
  width:auto !important;
  min-height:54px !important;
  margin-top:auto !important;
  padding:11px 18px !important;
  align-items:center !important;
  justify-content:center !important;
  color:#0b5ca8 !important;
  background:#eaf4ff !important;
  border:1px solid #c9e2f7 !important;
  border-radius:999px !important;
  font-size:clamp(21px,2.85vw,27px) !important;
  font-weight:850 !important;
  line-height:1.2 !important;
  text-align:center !important;
}

/* Quando há quantidade ímpar de módulos, o último ocupa a largura inteira. */
body.mobile-home-mode #toolsFallback .portal-grid > .hub-card:last-child:nth-child(odd){
  grid-column:1 / -1 !important;
  min-height:230px !important;
  padding:26px 30px !important;
  display:grid !important;
  grid-template-columns:140px minmax(0,1fr) !important;
  grid-template-rows:1fr auto !important;
  column-gap:26px !important;
  row-gap:12px !important;
  align-items:center !important;
  text-align:left !important;
}

body.mobile-home-mode #toolsFallback .portal-grid > .hub-card:last-child:nth-child(odd) > .hub-card-icon{
  grid-column:1 !important;
  grid-row:1 / 3 !important;
  width:124px !important;
  height:124px !important;
}

body.mobile-home-mode #toolsFallback .portal-grid > .hub-card:last-child:nth-child(odd) > span:not(.hub-card-icon):not(.hub-card-arrow){
  grid-column:2 !important;
  grid-row:1 !important;
  align-items:flex-end !important;
  justify-content:flex-start !important;
}

body.mobile-home-mode #toolsFallback .portal-grid > .hub-card:last-child:nth-child(odd) h3{
  text-align:left !important;
}

body.mobile-home-mode #toolsFallback .portal-grid > .hub-card:last-child:nth-child(odd) .hub-card-arrow{
  grid-column:2 !important;
  grid-row:2 !important;
  justify-self:start !important;
  margin-top:0 !important;
}

/* Avisos que não são cards continuam legíveis em largura total. */
body.mobile-home-mode #toolsFallback .portal-note{
  grid-column:1 / -1 !important;
  font-size:clamp(20px,2.7vw,26px) !important;
  line-height:1.5 !important;
}

/* Chat em botão flutuante grande. */
body.mobile-home-mode .portal-chat{
  right:16px !important;
  bottom:16px !important;
}

body.mobile-home-mode .portal-chat-launcher{
  position:relative !important;
  width:76px !important;
  min-width:76px !important;
  height:76px !important;
  padding:0 !important;
  border-radius:50% !important;
  justify-content:center !important;
  gap:0 !important;
  font-size:0 !important;
}

body.mobile-home-mode .portal-chat-launcher::before{
  content:none;
}

body.mobile-home-mode .portal-chat-launcher .chat-launcher-text{
  display:none !important;
}

body.mobile-home-mode .portal-chat-launcher .chat-online-dot{
  position:absolute !important;
  right:5px !important;
  bottom:5px !important;
  width:14px !important;
  height:14px !important;
  border:2px solid #1498c2 !important;
}

body.mobile-home-mode .portal-chat-count.visible{
  position:absolute !important;
  top:-5px !important;
  right:-5px !important;
}

/* Em telas muito estreitas, a acessibilidade continua acima da compactação. */
@media(max-width:390px){
  body.mobile-home-mode .portal-topbar-inner{
    padding-left:12px !important;
    padding-right:12px !important;
    gap:9px !important;
  }

  body.mobile-home-mode .portal-brand--portal-identity .portal-symbol{
    width:66px !important;
    height:66px !important;
    flex-basis:66px !important;
  }

  body.mobile-home-mode .portal-brand-copy h1{
    font-size:21px !important;
  }

  body.mobile-home-mode .portal-account-area{
    max-width:145px !important;
  }

  body.mobile-home-mode .portal-user-meta strong{
    max-width:78px !important;
    font-size:15px !important;
  }

  body.mobile-home-mode #portalLogout{
    min-height:48px !important;
    padding:9px 11px !important;
    font-size:16px !important;
  }

  body.mobile-home-mode .portal-main{
    padding-left:10px !important;
    padding-right:10px !important;
  }

  body.mobile-home-mode .portal-hero{
    padding:24px 20px !important;
  }

  body.mobile-home-mode .portal-hero h2{
    font-size:36px !important;
  }

  body.mobile-home-mode .portal-hero p{
    font-size:21px !important;
  }

  body.mobile-home-mode #toolsFallback .portal-grid{
    gap:12px !important;
  }

  body.mobile-home-mode #toolsFallback .hub-card{
    min-height:280px !important;
    padding:24px 13px 21px !important;
  }

  body.mobile-home-mode #toolsFallback .hub-card > .hub-card-icon{
    width:108px !important;
    height:108px !important;
  }

  body.mobile-home-mode #toolsFallback .hub-card-icon img{
    width:98px !important;
    height:98px !important;
  }

  body.mobile-home-mode #toolsFallback .hub-card-icon svg{
    width:66px !important;
    height:66px !important;
  }

  body.mobile-home-mode #toolsFallback .hub-card h3{
    font-size:24px !important;
  }

  body.mobile-home-mode #toolsFallback .hub-card-arrow{
    min-height:48px !important;
    padding:9px 13px !important;
    font-size:19px !important;
  }

  body.mobile-home-mode #toolsFallback .portal-grid > .hub-card:last-child:nth-child(odd){
    min-height:210px !important;
    grid-template-columns:112px minmax(0,1fr) !important;
    column-gap:18px !important;
    padding:22px 18px !important;
  }

  body.mobile-home-mode #toolsFallback .portal-grid > .hub-card:last-child:nth-child(odd) > .hub-card-icon{
    width:104px !important;
    height:104px !important;
  }
}
