/* style/analu_landing.css */

/* ================================
   Design tokens (seguro global)
   ================================ */

:root{
  --bg:#0B1724;
  --muted:#cdd3d9;
  --muted2:rgba(230,232,235,.88);
  --card:#0F1E2B;
  --line:rgba(255,255,255,.08);
  --brand:#1E63FF;
  --brand-2:#0F4FE3;
  --white:#F5F7FA;
  --radius-2xl:22px;
  --maxw:1200px;
  --fg:#E6E8EB;           /* texto padrão no dark */
  --analu-card-bg:#0F1E2B; /* fundo da caixa da Analu no dark */
}

/* Overrides quando o tema for light */
:root[data-theme="light"]{
  --bg:#F5F7FA;
  --card:#FFFFFF;
  --line:rgba(15,24,36,.12);
  --muted:#4A5568;
  --muted2:#1F2933;
  --white:#111827;
  --fg:#111827;
  --brand:#1E63FF;
  --brand-2:#0F4FE3;
  --analu-card-bg:#0F1E2B; /* não é usado no light, pois sobrescrevemos a caixa */
}

/* Ajustes de tipografia do hero no tema claro – só na landing */
:root[data-theme="light"] body.page-analu-home .hero-wrap{
  background:#F3F4F6; /* cinza bem leve atrás do hero */
}
:root[data-theme="light"] body.page-analu-home .hero-title{
  color:#111827;
}
:root[data-theme="light"] body.page-analu-home .hero-subtitle{
  color:#4B5563;
}
:root[data-theme="light"] body.page-analu-home .hero-bullets li{
  color:#4B5563;
}
:root[data-theme="light"] body.page-analu-home .hero-bullets li::before{
  color:#111827;
  opacity:.7;
}
/* frase "Já ajudou alunos..." */
:root[data-theme="light"] body.page-analu-home .hero-microcopy{
  color:#4B5563;
}

/* ================================
   Landing analu.ai (escopado)
   ================================ */

body.page-analu-home{
  margin:0;
  background:var(--bg);
  color:var(--fg);
}

.page-analu-home .container{
  max-width:var(--maxw);
  margin:0 auto;
  padding:28px 16px;
}

/* ================================
   TOPBAR
   ================================ */
.page-analu-home .topbar{
  position:sticky;
  top:0;
  z-index:40;
  background:rgba(11,23,36,.6);
  backdrop-filter:saturate(120%) blur(6px);
  border-bottom:1px solid var(--line);
}
.page-analu-home .topbar-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 16px;
}
.page-analu-home .brand{
  color:var(--muted2);
  text-decoration:none;
  font-weight:600;
  letter-spacing:.2px;
}
.page-analu-home .brand:hover{color:#fff}
.page-analu-home .topnav{
  display:flex;
  gap:8px;
  align-items:center;
  flex:1 1 auto;
  min-width:0;
  overflow-x:auto;
  white-space:nowrap;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.page-analu-home .topnav::-webkit-scrollbar{display:none}
.page-analu-home .topnav .btn{white-space:nowrap;padding:10px 12px}

.page-analu-home .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  border-radius:12px;
  border:1px solid var(--line);
  text-decoration:none;
  color:var(--white);
  transition:.18s ease all;
  backdrop-filter:saturate(120%) blur(0);
}
.page-analu-home .btn-tertiary{
  background:transparent;
  border-color:transparent;
  opacity:.9;
  padding:10px 8px;
}
.page-analu-home .btn-tertiary:hover{
  opacity:1;
  text-decoration:underline;
  text-underline-offset:3px;
}
.page-analu-home .btn-secondary{
  background:transparent;
  border-color:rgba(255,255,255,.08);
  opacity:.95;
}
.page-analu-home .btn-secondary:hover{
  background:#0E1A28;
  border-color:rgba(255,255,255,.18);
  opacity:1;
  transform:translateY(-1px);
}
.page-analu-home .btn-primary{
  background:transparent;
  border-color:rgba(255,255,255,.14);
}
.page-analu-home .btn-primary:hover{
  background:#0E1A28;
  border-color:rgba(255,255,255,.28);
  transform:translateY(-1px);
}

.page-analu-home .topbar-actions{
  display:flex;
  align-items:center;
  gap:6px;
}
.page-analu-home .lg-show{display:inline-flex}
.page-analu-home .sm-only{display:none}

@media (max-width:860px){
  .page-analu-home .lg-show{display:none!important}
  .page-analu-home .sm-only{display:inline-flex!important}
}

/* ===== SHEET (menu móvel único) ===== */
.page-analu-home .sheet[hidden]{display:none !important;}
.page-analu-home .sheet{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  backdrop-filter:saturate(120%) blur(2px);
  z-index:9999;
  display:flex;
  justify-content:flex-end;
  align-items:flex-start;
  padding-top:12px;
}
.page-analu-home .sheet-panel{
  width:min(92vw,380px);
  background:var(--card);
  border-left:1px solid var(--line);
  box-sizing:border-box;
  padding:12px 16px 16px;
  overflow:auto;
  height:auto;
  max-height:calc(100vh - 24px);
  border-radius:16px 0 0 16px;
}
.page-analu-home .sheet-panel a,
.page-analu-home .sheet-panel button{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 10px;
  border:1px solid var(--line);
  border-radius:12px;
  background:transparent;
  color:var(--white);
  text-decoration:none;
}
.page-analu-home .sheet-close{
  border:0;
  background:transparent;
  font-size:22px;
  line-height:1;
  padding:6px 8px;
  border-radius:10px;
  margin-left:auto;
  margin-bottom:10px;
}
.page-analu-home .sheet-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.page-analu-home .sheet-row .lang-btn{
  padding:8px 10px;
  border:1px solid var(--line);
  border-radius:10px;
  background:transparent;
}
.page-analu-home #theme-toggle-sheet{
  padding:8px 10px;
  border-radius:10px;
}
.page-analu-home #mobile-sheet .sheet-close{
  position:relative !important;
  top:0 !important;
  margin-top:0 !important;
  margin-bottom:10px !important;
}
.page-analu-home #mobile-sheet .sheet-panel > a:first-of-type{
  margin-top:0 !important;
}

/* ============ HERO ============ */
.page-analu-home .hero-wrap{
  padding:22px 0 18px;
  border-bottom:1px solid var(--line);
}
.page-analu-home .hero-grid{
  display:grid;
  grid-template-columns:.7fr 1.3fr;
  gap:40px;
  align-items:center;
}
.page-analu-home .hero-title{
  font-size:clamp(28px,8vw,44px);
  line-height:1.12;
  margin:0 0 8px;
}
.page-analu-home .hero-subtitle{
  font-size:clamp(15px,4.3vw,18px);
  max-width:680px;
  margin:0 0 8px;
}
.page-analu-home .hero-bullets{
  margin:10px 0 16px;
  padding:0;
  list-style:none;
  opacity:.95;
}
.page-analu-home .hero-bullets li{
  margin:.4rem 0;
  position:relative;
  padding-left:18px;
}
.page-analu-home .hero-bullets li::before{
  content:"–";
  position:absolute;
  left:0;
  opacity:.7;
}
.page-analu-home .hero-bullets .hero-bullet-link{
  color: inherit;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  padding: 2px 0;
}
.page-analu-home .hero-bullets .hero-bullet-link:hover,
.page-analu-home .hero-bullets .hero-bullet-link:focus-visible{
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-analu-home .hero-ctas{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:8px 0 10px;
}
.page-analu-home .hero-microcopy{
  margin-top:6px;
  opacity:.85;
}

/* wrapper da coluna direita (mesmas dimensões nos dois temas) */
.page-analu-home .hero-right{
  border-radius:24px;
  padding:18px;
  box-sizing:border-box;
}

/* Caixa geral da Analu (na landing) */
.page-analu-home .analu-chatbox{
  background:var(--analu-card-bg);
  border:1px solid var(--line);
  border-radius:var(--radius-2xl);
  padding:16px;
  min-height:240px;
  display:flex;
  flex-direction:column;
  gap:10px;
  box-shadow:0 12px 40px rgba(0,0,0,.25);
  width:100%;
  box-sizing:border-box;
}

.page-analu-home .analu-chatbox .intro-avatar{max-width:220px}
@media (max-width:980px){
  .page-analu-home .analu-chatbox .intro-avatar{max-width:180px}
}
@media (max-width:980px){
  .page-analu-home .hero-grid{grid-template-columns:1fr}
}

/* ============ EXEMPLOS ============ */
.page-analu-home .examples-wrap{
  padding:36px 0;
  border-bottom:1px solid var(--line);
}
.page-analu-home .examples-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:18px;
}
.page-analu-home .examples-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.page-analu-home .ex-card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
}
.page-analu-home .ex-thumb{
  display:block;
  width:100%;
  height:200px;
  background:#0E1A28 url('https://academicum.ai/images/placeholders/example.gif') center/cover no-repeat;
}
.page-analu-home .ex-meta{padding:12px 14px}
.page-analu-home .ex-title{margin:0 0 2px 0;font-size:16px}
.page-analu-home .ex-sub{margin:0;opacity:.8;font-size:14px}

.page-analu-home .examples-grid.five-cards{grid-template-columns:repeat(6,1fr)}
.page-analu-home .examples-grid.five-cards .ex-card{grid-column:span 2}
.page-analu-home .examples-grid.five-cards .ex-card:nth-child(4){grid-column:2 / span 2}
.page-analu-home .examples-grid.five-cards .ex-card:nth-child(5){grid-column:4 / span 2}

@media (max-width:980px){
  .page-analu-home .examples-grid,
  .page-analu-home .examples-grid.five-cards{grid-template-columns:1fr 1fr}
  .page-analu-home .examples-grid.five-cards .ex-card{grid-column:auto!important}
}
@media (max-width:640px){
  .page-analu-home .topnav .keep-sm{display:none !important;}
  .page-analu-home .topbar-actions{display:flex !important;gap:6px;}
  .page-analu-home .topbar-actions .btn{padding:6px 8px;}
  .page-analu-home .lang-switch .btn{padding:6px 8px;font-size:12px;}
}

/* vídeo sobre a thumb */
.page-analu-home .ex-thumb{
  position:relative;
  display:block;
  width:100%;
  height:200px;
  background:#0E1A28 url('https://academicum.ai/images/placeholders/example.gif') center/cover no-repeat;
  overflow:hidden;
}
.page-analu-home .ex-thumb video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  pointer-events:none;
  opacity:0;
  transition:opacity .2s ease-out;
}
.page-analu-home .ex-thumb:hover video{opacity:1;}

/* ============ FAQ ============ */
.page-analu-home .how-wrap{padding:56px 0}
.page-analu-home .faq-accordion{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:14px;
}
.page-analu-home .faq-item{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
}
.page-analu-home .faq-q{
  width:100%;
  text-align:left;
  padding:14px 16px;
  border:0;
  background:transparent;
  color:var(--white);
  font:inherit;
  display:flex;
  justify-content:space-between;
  align-items:center;
  cursor:pointer;
}
.page-analu-home .faq-q:hover{background:#0E1A28}
.page-analu-home .faq-q .icon{opacity:.7;transition:.18s transform}
.page-analu-home .faq-a{
  max-height:0;
  overflow:hidden;
  transition:max-height .22s ease;
  opacity:.92;
  padding:0 16px;
}
.page-analu-home .faq-item.open .faq-a{
  padding:12px 16px 16px;
  max-height:360px;
}
.page-analu-home .faq-item.open .faq-q .icon{transform:rotate(90deg)}

/* ============ FOOTER ============ */
.page-analu-home footer{
  border-top:1px solid var(--line);
  padding:28px 0 18px;
  color:var(--muted2);
}
.page-analu-home .foot-grid{
  display:grid;
  grid-template-columns:1fr 1.15fr 1fr;
  gap:18px;
  margin-top:16px;
}
.page-analu-home .foot-col{
  background:rgba(255,255,255,.02);
  border:1px solid var(--line);
  border-radius:12px;
  padding:12px;
}
.page-analu-home .foot-col-title{
  margin:0 0 8px 0;
  font-size:.98rem;
  opacity:.9;
}
.page-analu-home .foot-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:6px;
}
.page-analu-home .foot-list a{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 8px;
  border-radius:8px;
  text-decoration:none;
  color:inherit;
  border:1px solid transparent;
  transition:background .16s,border-color .16s,transform .12s;
}
.page-analu-home .foot-list a:hover{
  background:rgba(255,255,255,.04);
  border-color:var(--line);
  transform:translateY(-1px);
}
.page-analu-home .foot-col.links .foot-list{
  grid-template-columns:repeat(2,minmax(180px,1fr));
  column-gap:16px;
  row-gap:6px;
}
@media (max-width:980px){
  .page-analu-home .foot-grid{grid-template-columns:1fr}
  .page-analu-home .foot-col.links .foot-list{grid-template-columns:1fr}
}
.page-analu-home .foot-legal{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--line);
  opacity:.85;
}
.page-analu-home .foot-legal a{color:var(--muted2)}
.page-analu-home .foot-legal a:hover{color:#fff}

/* ===== TRUST STRIP ===== */
.page-analu-home .trust-strip{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:18px;
  padding:14px 0 6px;
}
.page-analu-home .trust-item{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(255,255,255,.03);
}
.page-analu-home .trust-strip .badge-img img{
  height:95px;
  width:auto;
  max-width:100%;
  display:block;
  object-fit:contain;
  filter:none;
  opacity:1;
}
.page-analu-home .trust-item:hover{transform:translateY(-1px)}
.page-analu-home .trust-strip .iframe{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
  background:rgba(255,255,255,.04);
}
.page-analu-home .trust-strip .iframe iframe{
  display:block;
  width:220px;
  height:92px;
  border:0;
}

/* ===== Redes sociais ===== */
.page-analu-home .foot-social .social-row{
  display:flex;
  gap:14px;
  flex-wrap:nowrap;
}
.page-analu-home .social.social-icon{
  width:46px;
  height:46px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
  text-decoration:none;
  color:inherit;
  transition:transform .16s, background .16s, box-shadow .16s;
}
.page-analu-home .social.social-icon .ico{
  width:24px;
  height:24px;
  fill:currentColor;
  opacity:.9;
  transition:opacity .16s, transform .16s;
}
.page-analu-home .social.social-icon:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.06);
  box-shadow:0 6px 18px rgba(0,0,0,.18);
}
.page-analu-home .social.social-icon:hover .ico{opacity:1}
.page-analu-home .social.social-icon[aria-label="Instagram"]:hover{color:#e1306c}
.page-analu-home .social.social-icon[aria-label="Facebook"]:hover{color:#1877f2}
.page-analu-home .social.social-icon[aria-label="TikTok"]:hover{color:#69c9d0}
.page-analu-home .social.social-icon[aria-label="YouTube"]:hover{color:#ff0000}
.page-analu-home .sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,1px,1px);
  white-space:nowrap;
  border:0;
}
@media (max-width:520px){
  .page-analu-home .foot-social .social-row{flex-wrap:wrap;gap:10px}
}

/* Logos "Powered by" */
.page-analu-home footer .foot-badges{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.page-analu-home footer .foot-badges .badge-img{
  padding:6px 10px;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(255,255,255,.03);
}
.page-analu-home footer .foot-badges .badge-img img{
  height:32px !important;
  width:auto;
  display:block;
  object-fit:contain;
  filter:none !important;
  opacity:1 !important;
}
@media (min-width:981px){
  .page-analu-home footer .foot-badges .badge-img img{height:34px !important;}
}

/* Micro-controles (PT/EN e tema) no mobile */
.page-analu-home .sm-controls{display:none;gap:6px;}
.page-analu-home .sm-controls .chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  border:1px solid var(--line);
  border-radius:10px;
  background:rgba(255,255,255,.06);
  color:var(--white);
  font-size:.9rem;
  line-height:1;
  transition:background .16s ease, transform .16s ease;
}
.page-analu-home .sm-controls .chip:hover{
  background:rgba(255,255,255,.12);
  transform:translateY(-1px);
}
@media (max-width:860px){
  .page-analu-home .sm-controls{display:inline-flex;}
  .page-analu-home .lang-switch,
  .page-analu-home #theme-toggle{display:none !important;}
}
.page-analu-home .sm-controls .chip.is-active{
  border-color:rgba(255,255,255,.28);
  background:rgba(255,255,255,.12);
}

/* Força avatar lado a lado com mensagem em telas grandes */
@media (min-width:980px){
  .page-analu-home .analu-chatbox .landing-intro.refined-intro{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
  }
  .page-analu-home .analu-chatbox .intro-text{
    flex:1 1 auto;
  }
  .page-analu-home .analu-chatbox .intro-avatar{
    display:block !important;
    flex:0 0 auto;
    max-width:220px;
  }
  .page-analu-home .analu-animated-container img{
    width:100%;
    height:auto;
    display:block;
  }
}

/* Caixa da Analu alinhada ao container */
.page-analu-home .analu-chatbox .landing-container.refined.analu-embed{
  width:100%;
  max-width:100%;
  margin:0;
  box-sizing:border-box;
}

/* Input padrão (dark original) */
.page-analu-home .analu-chatbox .refined-input{
  background:#002c5d;
  color:#f8f9fa;
  border:1px solid #005ecb;
  font-size:1.05em;
}
.page-analu-home .analu-chatbox .refined-input::placeholder{
  color:rgba(248,249,250,.75);
  opacity:.75;
}
.page-analu-home .analu-chatbox .refined-input:focus::placeholder{
  opacity:0;
}

/* linha do input + botão – nunca estoura o cartão */
.page-analu-home .analu-chatbox .input-area{
  display:flex;
  gap:10px;
  align-items:stretch;
  margin:16px 0 4px;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}
.page-analu-home .analu-chatbox .refined-input-multiline{
  flex:1 1 auto;
  min-width:0;
  border-radius:18px;
  padding:12px 14px;
  resize:vertical;
  min-height:70px;
}

/* Botão Enviar padrão (dark) */
.page-analu-home .analu-chatbox #analuSend{
  flex-shrink:0;
  min-width:96px;
  border-radius:18px;
  border:1px solid var(--brand);
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  color:var(--white);
  font-weight:600;
  font-size:.96rem;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  box-shadow:0 8px 22px rgba(0,0,0,.30);
  transition:transform .12s ease,
             box-shadow .12s ease,
             background .12s ease,
             border-color .12s ease;
}
.page-analu-home .analu-chatbox #analuSend:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 26px rgba(0,0,0,.34);
  border-color:rgba(255,255,255,.40);
}
.page-analu-home .analu-chatbox #analuSend:active{
  transform:translateY(0);
  box-shadow:0 4px 14px rgba(0,0,0,.28);
}
.page-analu-home .analu-chatbox #analuSend:disabled{
  opacity:.5;
  cursor:not-allowed;
  box-shadow:none;
  transform:none;
}

/* Aviso da IA no dark */
.page-analu-home .analu-chatbox .ai-warning{
  margin-top:12px;
  font-size:.82rem;
  color:var(--muted);
}

/* ===== DARK MODE – bolha da Analu como na versão original ===== */

.page-analu-home .analu-chatbox .analu-message{
  background:linear-gradient(135deg,#003874,#001b3f);
  border-radius:22px;
  padding:16px 18px;
  color:#F5F7FA;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 14px 32px rgba(0,0,0,.35);
}
.page-analu-home .analu-chatbox .analu-title{
  margin:0 0 8px;
  font-weight:700;
  font-size:1.05rem;
  color:#F5F7FA;
}
.page-analu-home .analu-chatbox .analu-body{
  margin-top:10px;
  padding:0;
  border-radius:0;
  border:none;
  background:transparent;
  box-shadow:none;
}

/* Links dentro da fala da Analu */
.page-analu-home .analu-chatbox .analu-body a,
.page-analu-home .analu-chatbox .analu-body a:visited{
  color: inherit;
  text-decoration: underline;
}
.page-analu-home .analu-chatbox .analu-body a:hover{
  text-decoration: underline;
  text-underline-offset: 2px;
  opacity: 0.9;
}

.page-analu-home .analu-chatbox .analu-msg.analu{
  background:none;
  padding:0;
  color:#E6E8EB;
}

/* ===== LIGHT MODE – versão suave, sem bolha extra ===== */

:root[data-theme="light"] body.page-analu-home .hero-right{
  background:#E5EDF7;
}
:root[data-theme="light"] body.page-analu-home .analu-chatbox{
  background:#FFFFFF;
  border:1px solid rgba(15,24,36,.10);
  box-shadow:0 16px 32px rgba(15,24,36,.14);
}
:root[data-theme="light"] body.page-analu-home .analu-chatbox .analu-message{
  background:#F4F6FB;
  border-radius:22px;
  padding:16px 18px;
  color:#111827;
  border:1px solid #C3D0EA;
  box-shadow:0 8px 20px rgba(15,24,36,.16);
}
:root[data-theme="light"] body.page-analu-home .analu-chatbox .analu-title{
  color:#111827;
}
:root[data-theme="light"] body.page-analu-home .analu-chatbox .analu-body{
  margin-top:10px;
  padding:0;
  border:none;
  background:transparent;
}
:root[data-theme="light"] body.page-analu-home .analu-chatbox .analu-msg.analu{
  color:#111827;
}
:root[data-theme="light"] body.page-analu-home .analu-chatbox .ai-warning{
  color:#4B5563;
}
:root[data-theme="light"] body.page-analu-home .analu-chatbox .refined-input{
  background:#F4F6FB;
  color:#111827;
  border-color:#C3D0EA;
}
:root[data-theme="light"] body.page-analu-home .analu-chatbox .refined-input::placeholder{
  color:rgba(15,24,36,.55);
}
:root[data-theme="light"] body.page-analu-home .analu-chatbox #analuSend{
  background:#DBE7FF;
  border-color:#C3D0EA;
  color:#111827;
  box-shadow:0 6px 14px rgba(15,24,36,.16);
}
:root[data-theme="light"] body.page-analu-home .analu-chatbox #analuSend:hover{
  background:#C5D6FF;
  border-color:#A9C1F5;
  box-shadow:0 8px 18px rgba(15,24,36,.20);
}

/* =========================================
   FIX: cores corretas da Analu no TEMA ESCURO
   (não altera nada do light, só o dark)
   ========================================= */

:root:not([data-theme="light"]) body.page-analu-home .analu-chatbox{
  background:#0F1E2B;
  border:1px solid rgba(255,255,255,.08);
}
:root:not([data-theme="light"]) body.page-analu-home .analu-chatbox .analu-message{
  background:linear-gradient(135deg,#003874,#001b3f);
  border-radius:22px;
  padding:16px 18px;
  color:#F5F7FA;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 14px 32px rgba(0,0,0,.35);
}
:root:not([data-theme="light"]) body.page-analu-home .analu-chatbox .analu-title{
  color:#F5F7FA;
}
:root:not([data-theme="light"]) body.page-analu-home .analu-chatbox .analu-body{
  margin-top:10px;
  padding:0;
  border:none;
  background:transparent;
  box-shadow:none;
}
:root:not([data-theme="light"]) body.page-analu-home .analu-chatbox .analu-msg.analu{
  background:none;
  padding:0;
  color:#E6E8EB;
}
:root:not([data-theme="light"]) body.page-analu-home .analu-chatbox .refined-input{
  background:#002c5d;
  color:#f8f9fa;
  border:1px solid #005ecb;
}
:root:not([data-theme="light"]) body.page-analu-home .analu-chatbox .refined-input::placeholder{
  color:rgba(248,249,250,.75);
}
:root:not([data-theme="light"]) body.page-analu-home .analu-chatbox #analuSend{
  background:linear-gradient(135deg,#1E63FF,#0F4FE3);
  border-color:#1E63FF;
  color:#F5F7FA;
  box-shadow:0 8px 22px rgba(0,0,0,.30);
}

/* ============================
   TOPBAR – ajuste para TEMA CLARO
   ============================ */
:root[data-theme="light"] body.page-analu-home .topbar{
  background: rgba(15,24,36,.9);
}
:root[data-theme="light"] body.page-analu-home .brand,
:root[data-theme="light"] body.page-analu-home .topnav .btn,
:root[data-theme="light"] body.page-analu-home .topbar-actions .btn{
  color: #F9FAFB;
}
:root[data-theme="light"] body.page-analu-home .topnav .btn,
:root[data-theme="light"] body.page-analu-home .topbar-actions .btn{
  border-color: rgba(249,250,251,.22);
}
:root[data-theme="light"] body.page-analu-home .topnav .btn:hover,
:root[data-theme="light"] body.page-analu-home .topbar-actions .btn:hover{
  background: rgba(249,250,251,.08);
}

/* ============================
   HERO CTAs – tema CLARO
   ============================ */
:root[data-theme="light"] body.page-analu-home .hero-ctas .btn,
:root[data-theme="light"] body.page-analu-home .hero-ctas .btn-primary,
:root[data-theme="light"] body.page-analu-home .hero-ctas .btn-secondary,
:root[data-theme="light"] body.page-analu-home .hero-ctas .btn-tertiary{
  background: transparent;
  color: #111827;
  border-radius: 999px;
  border: 1px solid rgba(15,24,36,.18);
  padding: 10px 18px;
  opacity: 1;
}
:root[data-theme="light"] body.page-analu-home .hero-ctas .btn:hover,
:root[data-theme="light"] body.page-analu-home .hero-ctas .btn-primary:hover,
:root[data-theme="light"] body.page-analu-home .hero-ctas .btn-secondary:hover,
:root[data-theme="light"] body.page-analu-home .hero-ctas .btn-tertiary:hover{
  background: rgba(15,24,36,.02);
  border-color: rgba(15,24,36,.28);
}

/* ============================
   TOPNAV – todos sublinham no hover
   ============================ */
.page-analu-home .topnav .btn,
.page-analu-home .topnav .btn-primary,
.page-analu-home .topnav .btn-secondary,
.page-analu-home .topnav .btn-tertiary{
  text-decoration: none;
}
.page-analu-home .topnav .btn:hover,
.page-analu-home .topnav .btn-primary:hover,
.page-analu-home .topnav .btn-secondary:hover,
.page-analu-home .topnav .btn-tertiary:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* DARK MODE – deixar CTA terciário igual aos outros */
.page-analu-home .hero-ctas .btn-tertiary{
  background: transparent;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 12px;
  padding: 12px 18px;
  color: var(--white);
  opacity: .95;
}
.page-analu-home .hero-ctas .btn-tertiary:hover{
  background: #0E1A28;
  border-color: rgba(255,255,255,.28);
  transform: translateY(-1px);
}

/* Depoimento logo abaixo da frase */
.page-analu-home .hero-testimonials{
  margin-top:8px;
  margin-bottom:0;
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
}
.page-analu-home .hero-testimonial{
  margin:0;
  max-width:260px;
  border-radius:16px;
  overflow:hidden;
  border:1px solid var(--line);
  background:var(--card);
}
.page-analu-home .hero-testimonial img{
  display:block;
  width:100%;
  height:auto;
}

/* Mobile: PT / EN / tema legíveis no modo claro */
:root[data-theme="light"] body.page-analu-home .sm-controls .chip{
  color: #F9FAFB;
  background: rgba(249,250,251,.08);
  border-color: rgba(249,250,251,.22);
}
:root[data-theme="light"] body.page-analu-home .sm-controls .chip.is-active{
  background: rgba(249,250,251,.16);
  border-color: rgba(249,250,251,.32);
}

/* ============================
   FAQ – corrigir hover no modo claro
   ============================ */
:root[data-theme="light"] body.page-analu-home .faq-item{
  background:#FFFFFF;
  border-color:rgba(15,24,36,.12);
}
:root[data-theme="light"] body.page-analu-home .faq-q{
  background:#FFFFFF;
  color:#111827;
}
:root[data-theme="light"] body.page-analu-home .faq-q:hover,
:root[data-theme="light"] body.page-analu-home .faq-q:focus-visible{
  background:#E5EDF7;
  color:#111827;
}
:root[data-theme="light"] body.page-analu-home .faq-item.open .faq-q{
  background:#E5EDF7;
}
:root[data-theme="light"] body.page-analu-home .faq-q .icon{
  color:#111827;
  opacity:.6;
}
:root[data-theme="light"] body.page-analu-home .faq-item.open .faq-a{
  background:#FFFFFF;
}

/* 1ª dobra: garante que nada passe da largura da tela no mobile */
@media (max-width: 900px){
  .page-analu-home .hero-wrap,
  .page-analu-home .hero-grid,
  .page-analu-home .hero-right,
  .page-analu-home .analu-chatbox,
  .page-analu-home .hero-testimonials,
  .page-analu-home .hero-testimonial {
    max-width: 100%;
  }
  .page-analu-home .hero-testimonial{
    width: 100%;
    max-width: 360px;
  }
  .page-analu-home .analu-animated-container,
  .page-analu-home .analu-animated-container img{
    max-width: 100%;
    height: auto;
  }
}

/* imagens da landing não estouram */
.page-analu-home img{
  max-width: 100%;
  height: auto;
}

/* ===== Analu lado a lado no MOBILE, sem estourar ===== */
@media (max-width: 900px){
  .page-analu-home .analu-chatbox .landing-intro.refined-intro{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:12px;
  }
  .page-analu-home .analu-chatbox .intro-text{
    flex:1 1 0;
    min-width:0;
  }
  .page-analu-home .analu-chatbox .intro-avatar{
    flex:0 0 110px;
    max-width:110px;
  }
  .page-analu-home .analu-animated-container{
    width:100%;
    max-width:110px;
  }
  .page-analu-home .analu-animated-container img{
    display:block;
    width:100%;
    height:auto;
  }
  .page-analu-home .analu-chatbox .analu-message{
    font-size:0.95rem;
  }
}

/* HARD FIX: 1ª dobra sem overflow no mobile */
@media (max-width: 900px){
  .page-analu-home .hero-wrap{
    overflow-x: hidden;
  }
  .page-analu-home .hero-grid{
    display: block;
  }
  .page-analu-home .hero-left,
  .page-analu-home .hero-right,
  .page-analu-home .hero-right .analu-chatbox,
  .page-analu-home .hero-right .landing-container.refined.analu-embed,
  .page-analu-home .hero-right .landing-intro.refined-intro,
  .page-analu-home .hero-testimonials,
  .page-analu-home .hero-testimonial{
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin-left: 0;
    margin-right: 0;
  }
}

/* Hero CTAs – todos sublinham no hover (dark e light) */
.page-analu-home .hero-ctas .btn:hover,
.page-analu-home .hero-ctas .btn-primary:hover,
.page-analu-home .hero-ctas .btn-secondary:hover,
.page-analu-home .hero-ctas .btn-tertiary:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Garante espaçamento consistente entre as seções da Analu */
.page-analu-home .analu-section {
  padding-top: 3rem;
  margin-top: 2rem;
}
/* Em telas estreitas, as grids viram 1 coluna */
@media (max-width: 767px) {
  .page-analu-home .analu-about-grid,
  .page-analu-home .analu-tools-grid,
  .page-analu-home .analu-everywhere-grid,
  .page-analu-home .analu-who-grid {
    grid-template-columns: 1fr;
  }
}

/* qualquer .analu-section com .collapsed esconde tudo abaixo do header */
/* corpo da seção visível por padrão */
.page-analu-home .analu-section .analu-section-body {
  display: block;
}

/* se a section tiver .collapsed, só o body some */
.page-analu-home .analu-section.collapsed .analu-section-body {
  display: none;
}

/* =========================================
   POC – tudo abaixo continua GLOBAL,
   mas já preso a #poc-landing / .poc-form
   ========================================= */

/* POC – links sempre brancos */
#poc-landing a:not(.poc-cta-button),
#poc-landing a:not(.poc-cta-button):link,
#poc-landing a:not(.poc-cta-button):visited {
  color: #ffffff;
  text-decoration: none;
}
#poc-landing a:not(.poc-cta-button):hover,
#poc-landing a:not(.poc-cta-button):focus-visible {
  color: #ffffff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* CTA principal da POC – Quero participar da POC (modo escuro) */
#poc-landing .poc-cta-button,
#poc-landing .poc-cta-button:link,
#poc-landing .poc-cta-button:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 20px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: transparent;
  color: #ffffff;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition:
    background .16s ease,
    border-color .16s ease,
    transform .12s ease,
    box-shadow .16s ease;
}
#poc-landing .poc-cta-button:hover,
#poc-landing .poc-cta-button:focus-visible {
  background: #0E1A28;
  border-color: rgba(255,255,255,.32);
  box-shadow: 0 6px 18px rgba(0,0,0,.35);
  transform: translateY(-1px);
  color: #ffffff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Modo claro: CTA da POC */
:root[data-theme="light"] #poc-landing .poc-cta-button,
:root[data-theme="light"] #poc-landing .poc-cta-button:link,
:root[data-theme="light"] #poc-landing .poc-cta-button:visited {
  background: transparent;
  color: #111827;
  border-color: rgba(15,24,36,.18);
  box-shadow: none;
}
:root[data-theme="light"] #poc-landing .poc-cta-button:hover,
:root[data-theme="light"] #poc-landing .poc-cta-button:focus-visible {
  background: #E5EDF7;
  border-color: rgba(15,24,36,.28);
  color: #111827;
  text-decoration: underline;
  text-underline-offset: 3px;
  box-shadow: 0 4px 12px rgba(15,24,36,.12);
}

/* intl-tel-input na POC */
#poc-landing .iti { font-size: 0.95rem; }
#poc-landing .iti__flag-container {
  background: #0F1E2B;
  border: 1px solid var(--line);
  border-right: none;
  border-radius: 8px 0 0 8px;
}
#poc-landing .iti input[type="tel"],
#poc-landing .iti input[type="text"] {
  background: #0F1E2B;
  color: var(--fg);
  border: 1px solid var(--line);
  border-left: none;
  border-radius: 0 8px 8px 0;
}
#poc-landing .iti input::placeholder {
  color: rgba(230,232,235,.75);
}
#poc-landing .iti__country-list {
  background: #0F1E2B;
  color: var(--fg);
  border-radius: 8px;
  border: 1px solid var(--line);
  box-shadow: 0 12px 30px rgba(0,0,0,.45);
}
#poc-landing .iti__country { color: var(--fg); }
#poc-landing .iti__country-name { color: var(--fg); }
#poc-landing .iti__dial-code { color: #9CA3AF; }
#poc-landing .iti__country.iti__highlight,
#poc-landing .iti__country:hover {
  background-color: #0E1A28;
}

/* Modo claro para intl-tel-input */
:root[data-theme="light"] #poc-landing .iti__country-list {
  background: #ffffff;
  color: #111827;
  border-color: rgba(15,24,36,.18);
}
:root[data-theme="light"] #poc-landing .iti__country {
  color: #111827;
}
:root[data-theme="light"] #poc-landing .iti__country-name {
  color: #111827;
}
:root[data-theme="light"] #poc-landing .iti__dial-code {
  color: #4B5563;
}
:root[data-theme="light"] #poc-landing .iti__country.iti__highlight,
:root[data-theme="light"] #poc-landing .iti__country:hover {
  background-color: #E5EDF7;
}

/* Fantasma do +55 – corrige no container certo */
#poc-landing .iti__flag-container {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
}
#poc-landing .iti__selected-flag {
  background: #0F1E2B;
  border: 1px solid var(--line);
  border-right: none;
  border-radius: 8px 0 0 8px;
  padding-left: 8px;
}
#poc-landing .iti__selected-dial-code {
  color: var(--fg);
  position: relative;
  z-index: 1;
}

/* Campo "Maior dificuldade" alinhado */
#poc-landing .form-group label[for="difficulty"] {
  display: inline-block;
  width: 30%;
  margin-bottom: 0;
  vertical-align: top;
}
#poc-landing #difficulty {
  display: inline-block;
  width: 68%;
  margin-left: 8px;
  box-sizing: border-box;
  height: 2.4em;
  min-height: 2.4em;
  max-height: 2.4em;
  resize: none;
  overflow-y: auto;
}
@media (max-width: 700px) {
  #poc-landing .form-group label[for="difficulty"],
  #poc-landing #difficulty {
    display: block;
    width: 100%;
    margin-left: 0;
  }
  #poc-landing #difficulty {
    margin-top: 4px;
  }
}

/* Single-line textarea genérica */
.single-line-textarea {
  width: 100%;
  min-height: 2.4rem;
  max-height: 2.4rem;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  resize: none;
  box-sizing: border-box;
}

/* Grupo label + campo em linha */
.pain-details-group {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: nowrap;
}
.pain-details-group label {
  white-space: nowrap;
}
.pain-details-group .single-line-textarea {
  flex: 1;
}

/* Campo de celular da POC */
.poc-form .iti input,
.poc-form .iti input[type="tel"],
.poc-form #whatsapp {
  background-color: #ffffff;
  color: #111111;
  border: 1px solid #ccc;
}
.poc-form #whatsapp::placeholder {
  color: #777777;
}

/* Wrapper intl-tel-input da POC */
.poc-form .iti {
  background-color: #ffffff;
  border-radius: 999px;
  border: 1px solid #ccc;
  padding: 0 0.25rem;
  display: inline-flex;
  align-items: center;
}
.poc-form .iti__selected-flag {
  background-color: #ffffff;
}
.poc-form .iti__selected-dial-code {
  color: #111111 !important;
}
.poc-form .iti__arrow {
  border-top-color: #111111 !important;
}

/* Pains em coluna */
.poc-pains-group {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.poc-pains-group label {
  display: flex;
  align-items: flex-start;
  gap: 0.35rem;
}

/* Garante estilo consistente pro #whatsapp */
.poc-form input#whatsapp {
  background-color: #ffffff !important;
  color: #111111 !important;
  border: 1px solid #ccc !important;
}
.poc-form .iti {
  background-color: transparent !important;
  box-shadow: none !important;
}
.poc-form .iti__selected-flag {
  background-color: #ffffff !important;
}
.poc-form #whatsapp::placeholder {
  color: #555555 !important;
  opacity: 1;
}

/* Linha label + campo dentro da POC */
.poc-form .iti input#whatsapp {
  background: transparent;
  border: none;
  box-shadow: none;
}

/* Seções da home da Analu – mesmas larguras do restante da página */
.page-analu-home .analu-section {
  max-width: var(--maxw);
  margin: 32px auto 0;   /* em vez de dois margins separados */
  padding: 24px 16px 0;  /* top 24px, laterais 16px */
  box-sizing: border-box;
}

/* ============================
   Cards das funcionalidades – index Analu
   ============================ */

/* card como bloco, sem interferir na semântica do link */
.page-analu-home .analu-tools-grid .analu-tool-card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* tira qualquer decoração padrão do link dentro do h3 */
.page-analu-home .analu-tools-grid .analu-tool-card h3 a,
.page-analu-home .analu-tools-grid .analu-tool-card h3 a:link,
.page-analu-home .analu-tools-grid .analu-tool-card h3 a:visited {
  color: #ffffff;                 /* sempre branco, como você pediu */
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* hover só dá um feedback leve, sem mudar a cor */
.page-analu-home .analu-tools-grid .analu-tool-card h3 a:hover,
.page-analu-home .analu-tools-grid .analu-tool-card h3 a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
  opacity: 0.95;
}

/* descrição: texto branco, sem cara de link */
.page-analu-home .analu-tools-grid .analu-tool-card p {
  color: #ffffff;
  text-decoration: none;
}

/* opcional: leve sombra/hover no card inteiro */
.page-analu-home .analu-tools-grid .analu-tool-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0,0,0,.25);
}

/* ============================
   Seções expansíveis da home da Analu
   ============================ */

/* card do topo, igual ao FAQ */
.page-analu-home .analu-section-header {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}

/* botão = faixa clicável, como .faq-q */
.page-analu-home .analu-section-toggle {
  width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  cursor: pointer;
  font: inherit;
  transition: background 0.16s ease, transform 0.12s ease;
}

/* linha de título + chevron (mesma lógica da FAQ) */
.page-analu-home .analu-section-header-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.page-analu-home .analu-section-header-top h2 {
  margin: 0;
  text-align: left; /* força contra qualquer global centralizado */
  font-size: clamp(1.4rem, 2.4vw, 1.7rem);
}

/* intro logo abaixo do título */
.page-analu-home .analu-section-toggle p {
  margin: 0;
  opacity: .9;
}

/* chevron bem visível na direita */
.page-analu-home .analu-section-toggle .icon {
  display: inline-block;
  font-size: 1.1rem;   /* maiorzinho pra aparecer até em zoom baixo */
  line-height: 1;
  opacity: .7;
  transition: transform .18s ease, opacity .18s ease;
}

/* hover (dark) – mesmo espírito da FAQ */
.page-analu-home .analu-section-toggle:hover,
.page-analu-home .analu-section-toggle:focus-visible {
  background: #0E1A28;
  transform: translateY(-1px);
}

/* tema CLARO, seguindo a FAQ da Analu */
:root[data-theme="light"] body.page-analu-home .analu-section-header {
  background: #FFFFFF;
  border-color: rgba(15,24,36,.12);
}
:root[data-theme="light"] body.page-analu-home .analu-section-toggle {
  background: #FFFFFF;
  color: #111827;
}
:root[data-theme="light"] body.page-analu-home .analu-section-toggle:hover,
:root[data-theme="light"] body.page-analu-home .analu-section-toggle:focus-visible {
  background: #E5EDF7;
}

/* corpo da seção, como a .faq-a aberta */
.page-analu-home .analu-section-body {
  padding: 16px 16px 18px;
  border-radius: 0 0 14px 14px;
  border: 1px solid var(--line);
  border-top: 0;
  background: var(--card);
}

/* collapsed = só some o body */
.page-analu-home .analu-section.collapsed .analu-section-body {
  display: none;
}

/* seção ABERTA => chevron gira (exatamente como o FAQ) */
.page-analu-home .analu-section:not(.collapsed) .analu-section-toggle .icon {
  transform: rotate(90deg);
  opacity: 1;
}

/* mobile: tudo alinhado à esquerda, sem centro bizarro */
@media (max-width: 640px) {
  .page-analu-home .analu-section-toggle {
    align-items: flex-start;
  }
}

/* ============================
   Companion mock – cartão no estilo Analu Companion
   ============================ */

body.page-analu .companion-hero-right {
  border-radius: 24px;
  padding: 18px;
  box-sizing: border-box;
}

body.page-analu .companion-mock {
  background: #050d18; /* bem escuro, como a extensão */
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 16px 40px rgba(0,0,0,.35);
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

/* Barra de “navegador” com URL */
body.page-analu .companion-mock-browser-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  background: #050d18;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

body.page-analu .companion-mock-url {
  font-size: 0.9rem;
  color: #c7d2fe; /* azulzinho da URL da extensão */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Corpo em duas colunas: artigo + Analu */
body.page-analu .companion-mock-body {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.2fr);
  column-gap: 24px;
  padding: 20px 18px 18px;
}

/* Coluna do artigo */
body.page-analu .companion-mock-article {
  border-right: 1px dashed rgba(148,163,184,.5);
  padding-right: 18px;
}

/* Parágrafo e “trecho selecionado” */
body.page-analu .companion-mock-paragraph {
  position: relative;
  font-size: 0.9rem;
  line-height: 1.35;
  color: rgba(226,232,240,.85);
}

/* Destaque que imita seleção de mouse linha a linha */
body.page-analu .companion-mock-highlight {
  display: inline;
  background: #fef3c7;
  padding: 0 0.06em;
  border-radius: 2px;
  box-shadow:
    0 .14em 0 #fef3c7,
    0 -.14em 0 #fef3c7;
  color: #111827;
}

body.page-analu .companion-mock-highlight span {
  display: inline;
  background: inherit;
  padding: 0;
  margin: 0;
  border-radius: inherit;
}

/* Tema claro: highlight um pouco mais suave */
:root[data-theme="light"] body.page-analu .companion-mock-highlight {
  background: #fde68a;
  box-shadow:
    0 .14em 0 #fde68a,
    0 -.14em 0 #fde68a;
  color: #111827;
}

/* Coluna da Analu */
body.page-analu .companion-mock-sidebar {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Avatar com halo azul */
body.page-analu .companion-mock-avatar {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  margin: 0 auto 16px;
  padding: 3px;
  background: radial-gradient(circle at 30% 10%, #60a5fa, #1d4ed8 60%, transparent 70%);
  display: flex;
  align-items: center;
  justify-content: center;
}

body.page-analu .companion-mock-avatar img {
  width: 62px;
  height: 62px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #020617;
}

/* Bolha da Analu – mesma cara do chat real */
body.page-analu .companion-mock-analu {
  width: 100%;
}

body.page-analu .companion-mock-bubble {
  background: linear-gradient(135deg,#003874,#001b3f);
  border-radius: 22px;
  padding: 16px 18px;
  border: 1px solid rgba(255,255,255,.10);
  color: #F5F7FA;
  box-shadow: 0 14px 32px rgba(0,0,0,.35);
  font-size: 0.95rem;
  line-height: 1.45;
}

/* Botão “See help options” / “Ver opções de ajuda” */
body.page-analu .companion-mock-btn {
  margin: 14px auto 0;
  border-radius: 999px;
  padding: 8px 18px;
  border: 1px solid rgba(255,255,255,.32);
  background: transparent;
  color: #E5E7EB;
  font-size: 0.9rem;
  font-weight: 500;
}

/* Mobile: empilha tudo bonitinho */
@media (max-width: 900px) {
  body.page-analu .companion-mock-body {
    display: block;
  }
  body.page-analu .companion-mock-article {
    border-right: none;
    border-bottom: 1px dashed rgba(148,163,184,.5);
    padding-right: 0;
    padding-bottom: 16px;
    margin-bottom: 16px;
  }
}

/* ============================
   Companion mock – layout geral da coluna direita
   ============================ */

body.page-analu .companion-hero-right {
  border-radius: 24px;
  padding: 18px;
  box-sizing: border-box;
}

body.page-analu .companion-mock {
  background: #050e1f;
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 12px 40px rgba(0,0,0,.25);
  width: 100%;
  box-sizing: border-box;
}

/* duas colunas: artigo à esquerda, chat da Analu à direita */
body.page-analu .companion-mock-body {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(260px, 1.05fr);
  column-gap: 18px;
  align-items: stretch;
  padding: 18px 18px 20px;
}

@media (max-width: 899px) {
  body.page-analu .companion-mock-body {
    display: block;
  }
}

/* ============================
   HEADER da Analu – como na extensão
   ============================ */

body.page-analu .companion-mock-analu {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
}

/* barra azul com avatar + título + subtítulo */
body.page-analu .companion-mock-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 18px;
  background: linear-gradient(135deg, #1E63FF, #4C8DFF);
  box-shadow: 0 10px 28px rgba(0,0,0,.45);
  color: #F9FAFB;
}

/* avatar circular com glow, igual vibe da extensão */
body.page-analu .companion-mock-header-avatar {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  overflow: hidden;
  border: 2px solid rgba(255,255,255,.95);
  box-shadow:
    0 0 0 3px rgba(10,25,66,.75),
    0 0 18px rgba(84,144,255,.9);
  flex-shrink: 0;
}

body.page-analu .companion-mock-header-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* textos do cabeçalho */
body.page-analu .companion-mock-header-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

body.page-analu .companion-mock-header-title {
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.1;
}

body.page-analu .companion-mock-header-subtitle {
  font-size: 0.78rem;
  opacity: .94;
  line-height: 1.15;
}

/* ============================
   BOLHA da resposta – estilo “cartão Analu”
   ============================ */

body.page-analu .companion-mock-chat {
  margin-top: 4px;
}

body.page-analu .companion-mock-bubble {
  background: linear-gradient(135deg, #003874, #001b3f);
  border-radius: 22px;
  padding: 16px 18px;
  color: #F5F7FA;
  border: 1px solid rgba(82,141,255,.95);
  box-shadow: 0 14px 32px rgba(0,0,0,.40);
  font-size: 0.9rem;
  line-height: 1.45;
}

/* botão abaixo da bolha: só um micro destaque */
body.page-analu .companion-mock-btn {
  margin-top: 4px;
  font-size: 0.86rem;
  align-self: center;
}

/* ============================
   “Texto selecionado” – já no estilo highlight
   ============================ */

body.page-analu .companion-mock-paragraph {
  position: relative;
  padding: 24px 18px;
  font-size: 0.95rem;
  line-height: 1.5;
  color: var(--muted2, #cdd3d9);
}

/* highlight linha a linha simulando seleção real */
body.page-analu .companion-mock-highlight {
  display: inline;
  background: #ffedbc;
  padding: 0 0.06em;
  border-radius: 2px;
  box-shadow:
    0 .13em 0 #ffedbc,
    0 -.13em 0 #ffedbc;
  color: #111827;
}

body.page-analu .companion-mock-highlight span {
  display: inline;
  background: inherit;
  padding: 0;
  margin: 0;
  border-radius: inherit;
}

/* tema claro – highlight mais suave, mas ainda “marcado” */
:root[data-theme="light"] body.page-analu .companion-mock-highlight {
  background: rgba(255,240,193,.95);
  box-shadow:
    0 .13em 0 rgba(255,240,193,.95),
    0 -.13em 0 rgba(255,240,193,.95);
}

/* Painel único da Analu dentro do mock */
body.page-analu .companion-mock-panel {
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.10);
  overflow: hidden;                 /* une o topo azul e o corpo escuro */
  background: #050e1f;
  box-shadow: 0 12px 30px rgba(0,0,0,.35);
  display: flex;
  flex-direction: column;
}

/* FAIXA AZUL SUPERIOR – agora só o topo do painel */
body.page-analu .companion-mock-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: linear-gradient(135deg, #1E63FF, #4C8DFF);
  color: #F9FAFB;
  /* sem border-radius aqui – quem manda é o .companion-mock-panel */
  box-shadow: none;
}

/* avatar igual ao da extensão, mas grudado nessa faixa */
body.page-analu .companion-mock-header-avatar {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  overflow: hidden;
  border: 2px solid rgba(255,255,255,.95);
  box-shadow:
    0 0 0 2px rgba(10,25,66,.75),
    0 0 14px rgba(84,144,255,.9);
  flex-shrink: 0;
}

body.page-analu .companion-mock-header-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* textos do cabeçalho */
body.page-analu .companion-mock-header-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
body.page-analu .companion-mock-header-title {
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.1;
}
body.page-analu .companion-mock-header-subtitle {
  font-size: 0.78rem;
  opacity: .94;
  line-height: 1.15;
}

/* CORPO ESCURO DO PAINEL – mesma caixa do header, só muda o fundo */
body.page-analu .companion-mock-chat {
  background: #050e1f;
  padding: 14px 16px 16px;
}

/* bolha interna, como o card da resposta da Analu */
body.page-analu .companion-mock-bubble {
  background: linear-gradient(135deg, #003874, #001b3f);
  border-radius: 18px;
  padding: 14px 16px;
  color: #F5F7FA;
  border: 1px solid rgba(82,141,255,.95);
  box-shadow: 0 10px 24px rgba(0,0,0,.35);
  font-size: 0.9rem;
  line-height: 1.45;
  margin: 0;
}

/* botão “See help options” logo abaixo do painel */
body.page-analu .companion-mock-btn {
  margin-top: 8px;
  font-size: 0.86rem;
  align-self: center;
}

/* Painel único da Companion (cabeçalho + corpo) */
body.page-analu .companion-mock-panel{
  background:#020916;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 14px 32px rgba(0,0,0,.45);
  display:flex;
  flex-direction:column;
  overflow:hidden;           /* cabeçalho e corpo compartilham o mesmo raio */
}

/* Cabeçalho azul com avatar + título + subtítulo */
body.page-analu .companion-mock-panel-header{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  background:linear-gradient(135deg,#1E63FF,#0F4FE3);
  color:#F9FAFB;
}

body.page-analu .companion-mock-avatar{
  width:40px;
  height:40px;
  border-radius:999px;
  border:2px solid rgba(255,255,255,.85);
  padding:2px;
  box-shadow:0 0 0 3px rgba(15,24,36,.65);
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

body.page-analu .companion-mock-avatar img{
  width:100%;
  height:100%;
  border-radius:999px;
  display:block;
}

body.page-analu .companion-mock-panel-meta{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}

body.page-analu .companion-mock-panel-title{
  font-weight:700;
  font-size:0.98rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

body.page-analu .companion-mock-panel-subtitle{
  font-size:0.8rem;
  opacity:.9;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* “X” no canto direito (só decorativo) */
body.page-analu .companion-mock-close{
  margin-left:auto;
  font-size:1.1rem;
  line-height:1;
  opacity:.85;
}

/* Corpo escuro do painel (onde ficam as mensagens) */
body.page-analu .companion-mock-panel-body{
  padding:18px 18px 16px;
  background:#020916;
  display:flex;
  flex-direction:column;
  gap:16px;
}

/* Bolha interna da resposta – fundo quase preto, borda sutil */
body.page-analu .companion-mock-message{
  background:#020916;                       /* preto da UI da extensão */
  border-radius:18px;
  padding:16px 18px;
  border:1px solid rgba(255,255,255,.32);  /* borda discreta */
  color:#F5F7FA;
  box-shadow:none;                         /* sem brilho azul */
}

body.page-analu .companion-mock-message-text{
  margin:0;
  font-size:0.92rem;
  line-height:1.5;
}

/* Botão “See help options” alinhado ao fim */
body.page-analu .companion-mock-btn{
  align-self:flex-end;
  margin-top:4px;
}

/* Responsivo: painel ocupa bem a coluna da direita */
@media (min-width:900px){
  body.page-analu .companion-mock-sidebar{
    display:flex;
    align-items:flex-start;
    justify-content:flex-start;
  }
  body.page-analu .companion-mock-panel{
    width:100%;
  }
}