/* =========================================================================
   CLÍNICA REGULAMENTE — IDENTIDADE VISUAL OFICIAL (V1)
   Carregado via mu-plugin: wp-content/mu-plugins/regulamente-brand.php
   Fonte deste arquivo: wp-content/mu-plugins/regulamente-brand/assets/css/regulamente.css
   Baseado no kit oficial de marca (RegulaMente_Kit_Marca.zip).
   Substitui integralmente o CSS provisório (removido do campo "CSS Adicional").
   ========================================================================= */

/* -------------------------------------------------------------------------
   0. FONTE SORA (self-hosted, variável, subset latin — cobre 400/500/600)
      Obtida oficialmente via fonts.gstatic.com (Google Fonts, SIL OFL).
      Branch Regular NÃO está disponível licenciada: usa-se fallback serifado
      do sistema (token --font-display), pronto para troca direta futura.
   ------------------------------------------------------------------------- */
@font-face{
  font-family:"Sora";
  src:url("../fonts/sora-variable-latin.woff2") format("woff2-variations"),
      url("../fonts/sora-variable-latin.woff2") format("woff2");
  font-weight:400 700;
  font-style:normal;
  font-display:swap;
}

/* -------------------------------------------------------------------------
   1. TOKENS DE DESIGN
   ------------------------------------------------------------------------- */
:root{
  /* Paleta oficial — NÃO alterar valores */
  --rm-terracota:#8D4726;
  --rm-caramelo:#B36D3C;
  --rm-offwhite:#F7EFE7;
  --rm-areia:#E8D9C8;
  --rm-bege:#D9C1AD;
  --rm-nude:#C9A189;
  --rm-texto:#432E26;

  /* Tokens estruturais */
  --rm-container:1180px;
  --rm-reading:760px;
  --rm-radius-card:24px;
  --rm-radius-small:16px;
  --rm-radius-button:999px;
  --rm-border-soft:rgba(141,71,38,.14);
  --rm-shadow-soft:0 18px 60px rgba(67,46,38,.08);
  --rm-section-space:clamp(72px, 8vw, 120px);
  --rm-inline-space:clamp(20px, 4vw, 48px);

  /* Tipografia */
  --font-display:"Branch", Georgia, "Times New Roman", serif;
  --font-body:"Sora", Arial, Helvetica, sans-serif;

  --fs-h1:clamp(3rem, 5.8vw, 4.5rem);
  --fs-h2:clamp(2.25rem, 4vw, 3rem);
  --fs-h3:clamp(1.4rem, 2.3vw, 1.85rem);
  --fs-body:clamp(1rem, .97rem + .2vw, 1.125rem);
  --fs-caption:.875rem;
}

/* -------------------------------------------------------------------------
   2. BASE
   ------------------------------------------------------------------------- */
/* !important documentado: o GeneratePress injeta font-family inline via
   Personalizar (generate_settings) com a mesma especificidade; forçamos aqui
   para garantir Sora/Branch em vez do fallback "System Stack" do tema. */
body{
  font-family:var(--font-body) !important;
  background:var(--rm-offwhite);
  color:var(--rm-texto);
  font-size:var(--fs-body);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
h1, h2, h3,
.entry-content h1, .entry-content h2, .entry-content h3,
.rm-display{
  font-family:var(--font-display) !important;
  color:var(--rm-terracota);
  font-weight:600;
  letter-spacing:-0.01em;
}
.entry-content h1, h1.rm-display{ font-size:var(--fs-h1); line-height:1.05; }
.entry-content h2, h2.rm-display{ font-size:var(--fs-h2); line-height:1.10; }
.entry-content h3, h3.rm-display{ font-size:var(--fs-h3); line-height:1.25; font-weight:600; }
.entry-content p{ line-height:1.7; }
.entry-content{ max-width:none; }
.entry-content > p, .entry-content > ul, .entry-content > ol{
  max-width:var(--rm-reading);
}
a{ color:var(--rm-terracota); text-underline-offset:3px; }
a:hover{ text-decoration-thickness:2px; }

a:focus-visible, button:focus-visible, summary:focus-visible,
input:focus-visible, textarea:focus-visible, .menu-item a:focus-visible{
  outline:2px solid var(--rm-terracota);
  outline-offset:2px;
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}

/* -------------------------------------------------------------------------
   3. LAYOUT / CONTAINER
   ------------------------------------------------------------------------- */
.rm-container{
  max-width:var(--rm-container);
  margin:0 auto;
  padding:0 var(--rm-inline-space);
}
.rm-reading{ max-width:var(--rm-reading); }

.rm-section{
  padding:var(--rm-section-space) 0;
}
.rm-section--sand{
  background:var(--rm-areia);
  width:100vw; position:relative; left:50%; right:50%;
  margin-left:-50vw; margin-right:-50vw;
}
.rm-section--terracotta{
  background:var(--rm-terracota);
  color:var(--rm-offwhite);
  width:100vw; position:relative; left:50%; right:50%;
  margin-left:-50vw; margin-right:-50vw;
}
.rm-section--terracotta h1, .rm-section--terracotta h2, .rm-section--terracotta h3{
  color:var(--rm-offwhite);
}
.rm-section--terracotta a{ color:var(--rm-offwhite); }
.rm-section--neural{
  position:relative;
  overflow:hidden;
  background-image:url("../brand/padrao-conexoes-neurais.svg");
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
}

.rm-kicker{
  display:inline-block;
  font-family:var(--font-body);
  font-size:.8rem;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--rm-terracota);
  margin:0 0 16px;
}

/* -------------------------------------------------------------------------
   4. HEADER
   ------------------------------------------------------------------------- */
.site-header{
  background:var(--rm-offwhite);
  border-bottom:1px solid var(--rm-border-soft);
  box-shadow:none;
}
.inside-header{ padding-top:22px; padding-bottom:22px; }
.site-logo img{
  height:64px;
  width:auto;
  display:block;
}
.main-navigation .main-nav ul li a{
  font-family:var(--font-body);
  font-size:15px;
  font-weight:500;
  color:var(--rm-texto);
  padding-top:10px;
  padding-bottom:10px;
  transition:color .18s ease;
}
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li a:focus{
  color:var(--rm-terracota);
}
.main-navigation .main-nav ul li[class*="current-menu-"] > a{
  color:var(--rm-terracota);
  text-decoration:underline;
  text-decoration-color:var(--rm-caramelo);
  text-underline-offset:4px;
}
.main-navigation ul ul{
  background:#fff;
  border:1px solid var(--rm-border-soft);
  box-shadow:var(--rm-shadow-soft);
  border-radius:var(--rm-radius-small);
  overflow:hidden;
}
.main-navigation .menu-toggle{ color:var(--rm-texto); }

/* -------------------------------------------------------------------------
   5. BOTÕES
   ------------------------------------------------------------------------- */
.rm-button,
.wp-block-button__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-body);
  font-weight:600;
  font-size:.95rem;
  border-radius:var(--rm-radius-button);
  padding:15px 30px;
  min-height:44px;
  text-decoration:none;
  transition:transform .18s ease, background-color .18s ease, color .18s ease;
}
.rm-button:hover, .wp-block-button__link:hover{
  transform:translateY(-2px);
}
.rm-button--primary,
.wp-block-button__link{
  background:var(--rm-terracota) !important;
  color:var(--rm-offwhite) !important;
}
.rm-button--primary:hover,
.wp-block-button__link:hover{
  background:#7A3C20 !important;
}
.rm-button--secondary,
.is-style-outline .wp-block-button__link{
  background:transparent !important;
  color:var(--rm-terracota) !important;
  border:1px solid var(--rm-terracota);
}
.rm-button--secondary:hover,
.is-style-outline .wp-block-button__link:hover{
  background:rgba(141,71,38,.06) !important;
}
.rm-section--terracotta .rm-button--primary,
.rm-section--terracotta .wp-block-button__link{
  background:var(--rm-offwhite) !important;
  color:var(--rm-terracota) !important;
}
.rm-section--terracotta .rm-button--secondary{
  color:var(--rm-offwhite) !important;
  border-color:var(--rm-offwhite);
}

/* -------------------------------------------------------------------------
   6. GRID / CARDS
   ------------------------------------------------------------------------- */
.rm-grid{ display:grid; gap:28px; }
.rm-grid--3{ grid-template-columns:repeat(3, 1fr); }

.rm-card{
  background:#fff;
  border:1px solid var(--rm-border-soft);
  border-radius:var(--rm-radius-card);
  box-shadow:var(--rm-shadow-soft);
  padding:36px 32px;
  transition:transform .2s ease, box-shadow .2s ease;
}
.rm-card:hover{
  transform:translateY(-3px);
  box-shadow:0 24px 70px rgba(67,46,38,.12);
}
.rm-card__number{
  font-family:var(--font-display);
  font-size:1.6rem;
  color:var(--rm-caramelo);
  margin:0 0 12px;
}
.rm-card__title{
  font-family:var(--font-display);
  font-size:1.2rem;
  color:var(--rm-terracota);
  margin:0 0 10px;
}
.rm-card p{ font-size:.97rem; color:var(--rm-texto); margin-bottom:16px; }
.rm-card__link{
  font-size:.9rem;
  font-weight:600;
  color:var(--rm-terracota);
  text-decoration:none;
  border-bottom:1px solid var(--rm-caramelo);
  padding-bottom:2px;
}
.rm-card__link:hover{ color:var(--rm-texto); }

/* -------------------------------------------------------------------------
   7. SPLIT (Clara, Reconhecimento, páginas internas)
   ------------------------------------------------------------------------- */
.rm-split{
  display:flex;
  gap:48px;
  align-items:center;
}
.rm-split--reverse{ flex-direction:row-reverse; }
.rm-split__media{ flex:0 0 38%; }
.rm-split__content{ flex:1 1 auto; }

.rm-photo{
  border-radius:var(--rm-radius-card);
  overflow:hidden;
  box-shadow:var(--rm-shadow-soft);
}
.rm-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  aspect-ratio:4/5;
}
.rm-photo--wide img{ aspect-ratio:16/10; }

/* -------------------------------------------------------------------------
   8. HERO (Home)
   ------------------------------------------------------------------------- */
.rm-hero{
  padding:var(--rm-section-space) 0 calc(var(--rm-section-space) * .6);
}
.rm-hero .rm-split{ align-items:center; }
.rm-hero__content{ flex:0 0 58%; }
.rm-hero__graphic{
  flex:0 0 38%;
  aspect-ratio:1/1;
  border-radius:var(--rm-radius-card);
  background:var(--rm-areia);
  background-image:url("../brand/padrao-conexoes-neurais.svg");
  background-size:cover;
  background-position:center;
  display:flex;
  align-items:center;
  justify-content:center;
}
.rm-hero__graphic img{
  width:42%;
  height:auto;
  opacity:.92;
}
.rm-hero__lede{
  max-width:52ch;
  font-size:1.05rem;
  margin:20px 0 32px;
}
.rm-hero__ctas{ display:flex; flex-wrap:wrap; gap:16px; }

/* -------------------------------------------------------------------------
   9. CREDENCIAIS (chips discretos)
   ------------------------------------------------------------------------- */
.rm-chips{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:16px 0 0;
  padding:0;
  list-style:none;
}
.rm-chips li{
  border:1px solid var(--rm-border-soft);
  background:var(--rm-offwhite);
  color:var(--rm-texto);
  border-radius:var(--rm-radius-small);
  padding:8px 16px;
  font-size:.85rem;
}

/* -------------------------------------------------------------------------
   10. FAQ
   ------------------------------------------------------------------------- */
.rm-faq details{
  border-bottom:1px solid var(--rm-border-soft);
  padding:18px 0;
}
.rm-faq summary{
  cursor:pointer;
  list-style:none;
  font-family:var(--font-body);
  font-weight:600;
  color:var(--rm-texto);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  transition:color .15s ease;
}
.rm-faq summary:hover{ color:var(--rm-terracota); }
.rm-faq summary::-webkit-details-marker{ display:none; }
.rm-faq summary::after{
  content:"+";
  font-family:var(--font-display);
  font-size:1.4rem;
  color:var(--rm-terracota);
  flex-shrink:0;
  transition:transform .2s ease;
}
.rm-faq details[open] summary::after{ transform:rotate(45deg); }
.rm-faq details p{ margin:12px 0 0; color:var(--rm-texto); max-width:var(--rm-reading); }

/* -------------------------------------------------------------------------
   11. FOOTER
   ------------------------------------------------------------------------- */
.footer-widgets{
  background:var(--rm-terracota);
  padding:56px 0 24px;
}
.rm-footer{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:32px;
  color:var(--rm-offwhite);
}
.rm-footer__brand img{ height:40px; width:auto; margin-bottom:12px; }
.rm-footer__brand p{
  margin:4px 0 0;
  font-size:.85rem;
  opacity:.9;
}
.rm-footer__links{
  display:flex;
  flex-wrap:wrap;
  gap:10px 22px;
  list-style:none;
  margin:0;
  padding:0;
}
.rm-footer__links a{
  color:var(--rm-offwhite);
  font-size:.9rem;
  text-decoration:none;
}
.rm-footer__links a:hover{ text-decoration:underline; }
.site-info{
  background:var(--rm-terracota);
  color:var(--rm-offwhite);
  opacity:.75;
  font-size:12px;
  padding:0 0 20px;
}
.site-info a{ color:var(--rm-offwhite); }

/* -------------------------------------------------------------------------
   12. RESPONSIVO
   ------------------------------------------------------------------------- */
@media (max-width:1024px){
  .rm-grid--3{ grid-template-columns:repeat(2, 1fr); }
  .rm-grid--3 > :last-child{ grid-column:1 / -1; max-width:60%; margin:0 auto; }
}

@media (max-width:768px){
  :root{ --rm-section-space:clamp(56px, 10vw, 80px); }
  .rm-split, .rm-hero .rm-split{ flex-direction:column; }
  .rm-split--reverse{ flex-direction:column; }
  .rm-split__media, .rm-hero__content, .rm-hero__graphic{ flex:1 1 auto; width:100%; }
  .rm-hero__graphic{ aspect-ratio:16/9; order:2; }
  .rm-hero__content{ order:1; }
  .rm-grid--3{ grid-template-columns:1fr; }
  .rm-grid--3 > :last-child{ max-width:none; }
  .site-logo img{ height:44px; }
  .rm-footer{ flex-direction:column; }
}

@media (max-width:480px){
  .rm-button, .wp-block-button__link{ width:100%; text-align:center; }
  .rm-hero__ctas{ flex-direction:column; }
  .rm-hero__ctas .rm-button{ width:100%; }
}
