/*
  EnvelheSer — sistema visual v0.6 (refinamento de interface, UX e responsividade)

  Identidade herdada da Falasser, sem mudança de marca:
    --green        verde-petróleo, cor primária de marca e ação
    --green-deep   variação escura para hover e fundos densos
    --ink          grafite, texto principal
    --muted        texto secundário (contraste AA sobre --bg e --surface)
    --bg           off-white, fundo padrão
    --surface      branco, superfícies elevadas (cartões, painéis)
    --line         linhas e divisórias
    --sand         areia, acento editorial pontual
    --clay         terracota, apenas foco de teclado e detalhes de ênfase

  Regras mantidas: nenhuma fonte, imagem ou script externo (a CSP do site
  permite apenas 'self'); corpo do texto a partir de 18px; estado comercial
  nunca indicado só por cor; sem rolagem horizontal; movimento discreto e
  desligável por prefers-reduced-motion.
*/

/* ==========================================================================
   1. Tokens
   ========================================================================== */
:root{
  --green:#0f4d4a;
  --green-deep:#0a3937;
  --green-soft:#e7efeb;
  --ink:#1b2827;
  --muted:#4c5f5e;
  --bg:#f7f8f6;
  --surface:#ffffff;
  --line:#d5dfdb;
  --line-strong:#b8c8c2;
  --sand:#ebdccb;
  --clay:#a8532f;
  --radius:10px;
  --radius-lg:14px;
  --radius-sm:6px;
  --shadow-sm:0 1px 2px rgba(21,45,42,.05),0 6px 18px rgba(21,45,42,.05);
  --shadow-md:0 12px 34px rgba(21,45,42,.09);
  --step:clamp(56px,7vw,104px);
  --gutter:clamp(20px,5vw,48px);
  --font-title:Montserrat,"Segoe UI",Candara,Optima,"Helvetica Neue",Arial,sans-serif;
  --font-body:Inter,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* ==========================================================================
   2. Base
   ========================================================================== */
*{box-sizing:border-box}
html{
  scroll-behavior:smooth;
  scroll-padding-top:110px;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:18px;
  line-height:1.7;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%;height:auto}
.brand-mark{width:46px;height:46px;object-fit:contain;flex:0 0 auto}
.brand-logo{display:block;width:clamp(190px,19vw,245px);height:auto;max-height:64px;object-fit:contain;object-position:left center;background:transparent}
.brand-copy{display:flex;flex-direction:column}
.brand-copy small{font:inherit;font-size:.72rem;font-weight:500;letter-spacing:.01em}
/* v1.8: fotografia do responsável exibida na proporção natural do arquivo
   original, sem recorte. Nada de aspect-ratio fixo nem object-fit:cover —
   isso cortaria a imagem. Apenas a largura máxima do elemento é limitada. */
.authority-photo{display:block;width:100%;max-width:420px;height:auto;object-fit:contain;border-radius:var(--radius);margin-bottom:1.5rem}
.profile-link{display:inline-flex;margin:.5rem .5rem 0 0}
.editorial-figure{margin:0}.editorial-figure img{width:100%;max-height:620px;object-fit:cover;border-radius:var(--radius-lg)}
.editorial-figure figcaption{margin-top:.75rem;color:var(--muted);font-size:.9rem}
a{color:var(--green);text-underline-offset:5px}
a:hover{color:var(--green-deep)}
:where(a,button,summary,input,[tabindex]):focus-visible{
  outline:3px solid var(--clay);
  outline-offset:4px;
  border-radius:3px;
}
h1,h2,h3,h4,.brand{font-family:var(--font-title);text-wrap:balance}
h1,h2,h3,h4,p,ul,ol{margin-top:0}
h1{
  font-size:clamp(2.1rem,4vw,3.6rem);
  line-height:1.12;
  letter-spacing:-.04em;
  font-weight:600;
  max-width:22ch;
  margin-bottom:1.4rem;
}
h2{
  font-size:clamp(1.55rem,2.6vw,2.4rem);
  line-height:1.24;
  letter-spacing:-.03em;
  font-weight:600;
  max-width:30ch;
  margin-bottom:1.5rem;
}
h3{font-size:1.15rem;line-height:1.45;letter-spacing:-.012em;font-weight:600;margin-bottom:.7rem}
p{max-width:72ch}
strong{font-weight:600}

/* Alinhamento de texto — v1.8: título, parágrafos, listas e descrições de
   cards sempre à esquerda, em todos os breakpoints. Nunca justificado nem
   centralizado apenas para acompanhar um título. Regra explícita (em vez de
   depender só do valor inicial do navegador) para blindar contra qualquer
   herança futura de text-align:justify/center em componentes de texto
   corrido. Botões mantêm seu próprio alinhamento (definido nas classes de
   botão), por isso não são incluídos aqui. */
h1,h2,h3,h4,p,li,dd,dt,blockquote,figcaption,.lead,.eyebrow{text-align:left}
.wrap{width:min(1180px,100% - var(--gutter) * 2);margin-inline:auto}

.eyebrow{
  font-size:.78rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:700;
  color:var(--green);
  margin-bottom:1rem;
  display:flex;
  align-items:center;
  gap:12px;
  max-width:60ch;
}
.eyebrow::before{
  content:"";
  width:26px;
  height:2px;
  background:var(--sand);
  flex:none;
}
.lead{
  font-size:clamp(1.05rem,1.3vw,1.22rem);
  line-height:1.7;
  color:var(--muted);
  max-width:66ch;
}

/* Link de pular para o conteúdo */
.skip{
  position:fixed;
  top:-200px;
  left:16px;
  z-index:60;
  background:var(--surface);
  color:var(--green);
  font-weight:600;
  padding:14px 18px;
  border:2px solid var(--green);
  border-radius:var(--radius-sm);
  box-shadow:var(--shadow-md);
  text-decoration:none;
}
.skip:focus{top:14px}

/* ==========================================================================
   3. Cabeçalho e navegação
   ========================================================================== */
header{
  position:sticky;
  top:0;
  z-index:30;
  background:color-mix(in srgb,var(--bg) 92%,transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{
  min-height:92px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  padding-block:14px;
}
.brand{
  font-size:clamp(1.45rem,2vw,1.75rem);
  font-weight:600;
  letter-spacing:-.035em;
  text-decoration:none;
  line-height:1.15;
  color:var(--green);
  display:block;
  min-width:0;
}
.brand span{
  display:block;
  font-family:var(--font-body);
  font-size:.72rem;
  letter-spacing:.02em;
  font-weight:400;
  line-height:1.5;
  margin-top:7px;
  color:var(--muted);
  max-width:34ch;
}
.nav>nav{display:flex;align-items:center;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.nav>nav a{
  font-size:.86rem;
  text-decoration:none;
  font-weight:500;
  padding:10px 12px;
  border-radius:var(--radius-sm);
  color:var(--ink);
  transition:background-color .18s ease,color .18s ease;
}
.nav>nav a:hover{background:var(--green-soft);color:var(--green-deep)}
nav a[aria-current=page]{
  color:var(--green);
  font-weight:600;
  box-shadow:inset 0 -2px 0 var(--green);
}
.nav>nav a[aria-current=page]:hover{background:var(--green-soft)}

/* Menu móvel (details/summary — funciona sem JavaScript) */
.mobile{display:none;position:relative}
.mobile summary{
  cursor:pointer;
  list-style:none;
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:48px;
  padding:10px 16px;
  font-size:1rem;
  font-weight:600;
  color:var(--green);
  border:1px solid var(--line-strong);
  border-radius:var(--radius-sm);
  background:var(--surface);
}
.mobile summary::-webkit-details-marker{display:none}
.mobile summary::after{
  content:"";
  width:16px;
  height:10px;
  background:
    linear-gradient(var(--green),var(--green)) top/16px 2px no-repeat,
    linear-gradient(var(--green),var(--green)) center/16px 2px no-repeat,
    linear-gradient(var(--green),var(--green)) bottom/16px 2px no-repeat;
}
.mobile[open] summary::after{
  background:
    linear-gradient(var(--green),var(--green)) center/16px 2px no-repeat;
}
.mobile nav{
  position:absolute;
  right:0;
  top:calc(100% + 12px);
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:12px;
  min-width:min(300px,calc(100vw - 48px));
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:2px;
  z-index:40;
  box-shadow:var(--shadow-md);
}
.mobile nav a{
  font-size:1rem;
  min-height:48px;
  display:flex;
  align-items:center;
  padding:10px 14px;
  border-radius:var(--radius-sm);
  text-decoration:none;
  color:var(--ink);
}
.mobile nav a:hover{background:var(--green-soft)}
.mobile nav a[aria-current=page]{background:var(--green-soft);color:var(--green)}

/* ==========================================================================
   4. Botões e links de ação
   ========================================================================== */
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  background:var(--green);
  color:#fff;
  border:1px solid var(--green);
  text-decoration:none;
  border-radius:var(--radius-sm);
  padding:15px 24px;
  min-height:52px;
  font-size:.98rem;
  font-weight:600;
  line-height:1.4;
  transition:background-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.button:hover{background:var(--green-deep);color:#fff;transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.button:active{transform:none}
.text-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  width:fit-content;
  font-size:.95rem;
  font-weight:600;
  margin-top:22px;
  text-decoration:none;
  box-shadow:inset 0 -1px 0 var(--line-strong);
  padding-bottom:2px;
}
.text-link:hover{box-shadow:inset 0 -1px 0 var(--green)}
.text-link::after{content:"→";transition:transform .18s ease}
.text-link:hover::after{transform:translateX(4px)}
.text-link span{display:none}

/* ==========================================================================
   5. Seções e ritmo vertical
   ========================================================================== */
.section{padding:var(--step) 0;border-top:1px solid var(--line)}
.section>.wrap>.eyebrow{margin-bottom:14px}
.soft{background:var(--green-soft);border-top-color:transparent}
.dark{background:var(--green);color:#eef3f0;border-top-color:transparent}
.dark h2,.dark h3{color:#fff}
.dark .eyebrow{color:var(--sand)}
.dark .eyebrow::before{background:var(--sand)}
.dark .lead,.dark p{color:#dbe7e2}
.dark .button{background:var(--sand);color:var(--green-deep);border-color:var(--sand)}
.dark .button:hover{background:#fff;color:var(--green-deep)}
.dark a{color:#fff}

/* Abertura das páginas internas */
.intro{
  padding:clamp(46px,6vw,84px) 0 clamp(34px,4vw,54px);
  background:
    radial-gradient(120% 130% at 92% -20%,rgba(235,220,203,.55) 0%,rgba(235,220,203,0) 58%),
    var(--bg);
}
.intro h1{max-width:26ch}
.intro .lead{margin-bottom:0}

/* Home — duas portas de entrada */
.doors{
  padding:clamp(46px,6vw,90px) 0 clamp(46px,5vw,74px);
  background:
    radial-gradient(90% 120% at 100% -10%,rgba(235,220,203,.6) 0%,rgba(235,220,203,0) 60%),
    var(--bg);
}
.doors h1{max-width:24ch}
.doors-opening{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,.86fr);
  align-items:center;
  gap:clamp(28px,5vw,72px);
}
.doors-visual{margin:0;overflow:hidden;border-radius:var(--radius);box-shadow:var(--shadow-md);background:var(--surface)}
.doors-visual img{display:block;width:100%;aspect-ratio:2/1;object-fit:cover}
.door-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:clamp(18px,2vw,28px);
  margin-top:clamp(28px,4vw,44px);
}
.door{
  border:1px solid var(--line);
  background:var(--surface);
  padding:clamp(26px,3vw,38px);
  border-radius:var(--radius);
  display:flex;
  flex-direction:column;
  gap:12px;
  box-shadow:var(--shadow-sm);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.door:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--line-strong)}
.door h2{font-size:clamp(1.4rem,1.9vw,1.7rem);margin-bottom:2px;max-width:24ch}
.door p{color:var(--muted);margin-bottom:0}
.door .button{align-self:flex-start;margin-top:10px}
.door.accent{background:var(--green);border-color:var(--green);color:#eef3f0}
.door.accent h2{color:#fff}
.door.accent .eyebrow{color:var(--sand)}
.door.accent .eyebrow::before{background:var(--sand)}
.door.accent p{color:#dbe7e2}
.door.accent .button{background:var(--sand);color:var(--green-deep);border-color:var(--sand)}
.door.accent .button:hover{background:#fff}

/* Orientador de jornada */
.journey{padding:var(--step) 0}
.journey-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:14px;
  margin-top:clamp(24px,3vw,36px);
}
.journey-card{
  display:flex;
  flex-direction:column;
  gap:10px;
  text-decoration:none;
  border:1px solid var(--line);
  background:var(--surface);
  padding:22px 20px;
  border-radius:var(--radius);
  color:var(--ink);
  min-height:100%;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.journey-card:hover{border-color:var(--green);box-shadow:var(--shadow-sm);transform:translateY(-2px);color:var(--ink)}
.journey-card .jc-eyebrow{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;height:34px;
  border-radius:50%;
  background:var(--green-soft);
  font-size:.78rem;
  color:var(--green);
  font-weight:700;
  letter-spacing:.02em;
}
.journey-card span.jc-label{font-size:1rem;line-height:1.45;font-weight:600}
.journey-card::after{content:"→";color:var(--green);font-size:1rem;margin-top:auto}

/* ==========================================================================
   6. Cartões, passos e blocos de texto
   ========================================================================== */
.cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(270px,1fr));
  gap:clamp(20px,2.4vw,34px);
  margin-top:clamp(26px,3vw,40px);
}
.cards article{
  border-top:2px solid var(--line-strong);
  padding:24px 0 4px;
  display:flex;
  flex-direction:column;
}
.cards article:hover{border-top-color:var(--green)}
.cards p{font-size:1rem;color:var(--muted);margin-bottom:0}
.number{
  display:block;
  font-family:var(--font-title);
  font-size:.85rem;
  color:var(--green);
  margin-bottom:18px;
  font-weight:700;
  letter-spacing:.06em;
}

.steps{list-style:none;margin:0;padding:0;max-width:920px}
.steps li{
  display:grid;
  grid-template-columns:64px 1fr;
  gap:22px;
  padding:26px 0;
  border-bottom:1px solid var(--line);
}
.steps li:first-child{border-top:1px solid var(--line)}
.steps li>span{
  color:var(--green);
  font-size:1.35rem;
  font-family:var(--font-title);
  font-weight:600;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top:2px;
}
.steps h3{margin-bottom:.4rem}
.steps p{margin-bottom:0;color:var(--muted)}
.steps .button{margin-top:34px}

.credential{
  display:flex;
  flex-wrap:wrap;
  gap:clamp(24px,5vw,70px);
  border-left:3px solid var(--green);
  padding-left:26px;
  margin-bottom:32px;
}
.notice{
  max-width:800px;
  background:var(--surface);
  border:1px solid var(--line);
  border-left:4px solid var(--green);
  border-radius:var(--radius-sm);
  padding:26px 28px;
  margin-bottom:28px;
  box-shadow:var(--shadow-sm);
}
.notice p{margin-bottom:0}

/* Blocos de serviço em duas colunas */
.service-block{padding:var(--step) 0;border-top:1px solid var(--line)}
.service-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:clamp(24px,3vw,48px);
  margin-top:8px;
}
.service-col p{color:var(--ink)}
.service-col p+p{margin-top:0}
.limits{
  background:var(--green-soft);
  border-left:4px solid var(--green);
  border-radius:var(--radius-sm);
  padding:20px 22px;
  margin-top:8px;
}
.limits p{font-size:.98rem;color:var(--muted);margin-bottom:0}

/* Autoridade / sobre */
.authority-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:clamp(24px,4vw,56px);
  align-items:start;
}
.authority-facts{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--line);
}
.authority-facts li{
  padding:16px 0;
  border-bottom:1px solid var(--line);
  font-size:1rem;
  color:var(--ink);
}
.authority-placeholder{
  color:var(--muted);
  font-style:italic;
  background:
    repeating-linear-gradient(135deg,rgba(235,220,203,.45) 0 8px,transparent 8px 16px);
  padding-inline:12px;
}

/* Artigo editorial (área Conteúdos) — v1.8 */
.article-body{max-width:780px}
.article-body h2{margin-top:2.4rem}
.article-body ul{padding-left:1.2em;color:var(--ink);margin-bottom:1rem}
.article-body ul li{margin-bottom:.5rem}
.article-body .notice{margin-top:2.4rem}
.article-body>.text-link{display:inline-block;margin-top:1.5rem}

/* Lista editorial (conteúdos planejados) */
.editorial-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.editorial-list li{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:24px 0;
  border-bottom:1px solid var(--line);
}
.editorial-list li>div{flex:1 1 380px;min-width:0}
.editorial-list p{color:var(--muted);font-size:1rem;margin-bottom:0}

/* ==========================================================================
   7. Estado comercial (cor + rótulo textual, nunca só cor)
   ========================================================================== */
.status{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.03em;
  padding:7px 13px;
  border-radius:999px;
  border:1px solid var(--line-strong);
  background:var(--surface);
  color:var(--ink);
  width:fit-content;
}
.status::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--muted);flex:none}
.status[data-estado="disponivel"]::before{background:#1f6f4d}
.status[data-estado="proxima_turma"]::before{background:var(--green)}
.status[data-estado="em_breve"]::before{background:#9a7328}
.status[data-estado="sob_consulta"]::before{background:var(--muted)}
.status[data-estado="em_validacao"]::before{background:var(--clay)}

/* ==========================================================================
   8. Catálogo comercial (filtro por categoria)
   ========================================================================== */
.catalog-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:26px 0 30px;
}
.catalog-toolbar button{
  font:600 .88rem/1.4 var(--font-body);
  min-height:46px;
  padding:10px 18px;
  border-radius:999px;
  border:1px solid var(--line-strong);
  background:var(--surface);
  color:var(--ink);
  cursor:pointer;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease;
}
.catalog-toolbar button:hover{border-color:var(--green);color:var(--green)}
.catalog-toolbar button[aria-pressed=true]{background:var(--green);border-color:var(--green);color:#fff}
.catalog-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
  gap:clamp(16px,2vw,26px);
}
.catalog-card{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:12px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:26px 24px;
  box-shadow:var(--shadow-sm);
  transition:transform .2s ease,box-shadow .2s ease;
}
.catalog-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.catalog-card h3{margin-bottom:0}
.catalog-card p{font-size:1rem;color:var(--muted);margin-bottom:0}
.catalog-card p strong{color:var(--ink)}
.catalog-card .button{margin-top:auto;align-self:stretch}
.service-card-ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;width:100%}
.service-card-ctas .button{margin-top:0;flex:1 1 200px}
.service-inclui-label{margin-bottom:2px!important}
.service-inclui{margin:0 0 4px;padding-left:1.1em;color:var(--muted);font-size:.95rem;line-height:1.5}
.service-inclui li{margin-bottom:4px}
.cat-eyebrow{
  font-size:.74rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:700;
  color:var(--green);
}
.catalog-empty{
  margin-top:24px;
  padding:20px 22px;
  background:var(--surface);
  border:1px dashed var(--line-strong);
  border-radius:var(--radius-sm);
  color:var(--muted);
}

/* ==========================================================================
   9. Perguntas frequentes, busca e catálogo de instrumentos
   ========================================================================== */
.faq{list-style:none;margin:0;padding:0;max-width:900px}
.faq li{border-bottom:1px solid var(--line-strong)}
.faq li:first-child{border-top:1px solid var(--line-strong)}
.faq details{background:transparent}
.faq summary{
  cursor:pointer;
  list-style:none;
  font-family:var(--font-title);
  font-size:1.05rem;
  font-weight:600;
  padding:22px 44px 22px 0;
  min-height:56px;
  position:relative;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";
  position:absolute;
  right:6px;
  top:50%;
  width:14px;height:14px;
  margin-top:-7px;
  background:
    linear-gradient(var(--green),var(--green)) center/14px 2px no-repeat,
    linear-gradient(var(--green),var(--green)) center/2px 14px no-repeat;
  transition:transform .2s ease;
}
.faq details[open] summary::after{
  background:linear-gradient(var(--green),var(--green)) center/14px 2px no-repeat;
}
.faq details>p{padding:0 0 24px;color:var(--muted);max-width:70ch}
.pendente{font-style:italic}

.catalogue{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:16px;
  /* v1.8: align-items:start impede que abrir um <details> estique os
     vizinhos da mesma linha do grid (bug em que os cards ao lado ficavam
     altos e em branco). Cada item cresce apenas com sua própria altura. */
  align-items:start;
}
.catalogue details{
  padding:20px 22px;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  background:var(--surface);
  align-self:start;
  height:max-content;
}
.catalogue details[open]{border-color:var(--line-strong);box-shadow:var(--shadow-sm)}
.catalogue summary{
  font-weight:600;
  cursor:pointer;
  min-height:44px;
  display:flex;
  align-items:center;
  font-family:var(--font-title);
}
.catalogue h3{margin-bottom:0}
.catalogue p{font-size:.98rem;margin:14px 0 0;color:var(--muted)}

label[for="busca"]{display:block;font-weight:600;font-size:.95rem;margin-bottom:8px}
.search{
  display:block;
  padding:14px 16px;
  width:min(100%,620px);
  font:inherit;
  border:1px solid var(--line-strong);
  border-radius:var(--radius-sm);
  background:var(--surface);
  margin:0 0 14px;
  min-height:52px;
}
.search::placeholder{color:var(--muted)}
#contador{font-size:.9rem;color:var(--muted);margin-bottom:26px}
.badge{
  display:inline-block;
  font-size:.78rem;
  color:var(--green);
  background:var(--green-soft);
  border-radius:999px;
  padding:4px 12px;
}
.related{display:flex;gap:18px;flex-wrap:wrap;margin-top:10px}
.related a{padding:10px 0;font-weight:600;font-size:.95rem}
[hidden]{display:none!important}

/* Página de redirecionamento de compatibilidade */
.redirect-box{max-width:760px}
.redirect-box h1{font-size:clamp(1.7rem,3vw,2.4rem)}

/* ==========================================================================
   10. Rodapé
   ========================================================================== */
footer{
  background:var(--green);
  color:#dbe7e2;
  border-top:1px solid var(--green);
  padding:clamp(44px,5vw,68px) 0 28px;
  font-size:.95rem;
}
footer .brand,footer a{color:#fff}
footer .brand span{color:#c9dbd4}
footer a{text-decoration:none;box-shadow:inset 0 -1px 0 rgba(255,255,255,.35)}
footer a:hover{box-shadow:inset 0 -1px 0 #fff;color:#fff}
.footer-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:clamp(24px,3vw,44px);
  align-items:start;
}
.footer-grid>div{line-height:2}
.footer-grid .brand span{max-width:32ch;line-height:1.55}
.fine{
  border-top:1px solid rgba(255,255,255,.22);
  padding-top:22px;
  margin-top:38px;
  font-size:.82rem;
  color:#c2d6cf;
  max-width:78ch;
}

/* ==========================================================================
   11. Responsividade
   ========================================================================== */
@media(max-width:1100px){
  .nav>nav{display:none}
  .mobile{display:block}
  .authority-grid{grid-template-columns:1fr}
}
@media(max-width:820px){
  html{scroll-padding-top:88px}
  .nav{min-height:80px}
  .doors-opening{grid-template-columns:1fr}
  .steps li{grid-template-columns:44px 1fr;gap:16px}
  .steps li>span{font-size:1.15rem;justify-content:flex-start}
  .credential{display:block}
  .credential p{margin-bottom:14px}
  footer .footer-grid>div{line-height:1.9}
}
@media(max-width:520px){
  body{font-size:17.5px}
  h1{letter-spacing:-.03em}
  .button{width:100%}
  .journey-grid,.door-grid,.catalog-grid,.catalogue{grid-template-columns:1fr}
  .notice{padding:22px}
  .catalog-card{padding:22px 20px}
  .faq summary{font-size:1rem;padding-right:38px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
  .button:hover,.door:hover,.journey-card:hover,.catalog-card:hover{transform:none}
}

@media print{
  header,footer,.skip{display:none}
  body{background:#fff;font-size:12pt}
}

/* Rodapé — títulos de coluna e navegação em lista */
.footer-title{
  font-family:var(--font-title);
  font-size:.76rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:700;
  color:var(--sand);
  margin-bottom:10px;
  line-height:1.5;
}
.footer-nav{display:flex;flex-direction:column;gap:2px}
.footer-nav a{padding:6px 0;width:fit-content}

/* Espaço reservado para fotografias/ilustrações futuras.
   Nenhuma imagem provisória é usada nesta rodada: o quadro fica vazio,
   rotulado e pronto para receber a fotografia real (basta trocar o conteúdo
   interno por <img>). */
.media-slot{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  aspect-ratio:4/3;
  border:1px dashed var(--line-strong);
  border-radius:var(--radius);
  background:
    repeating-linear-gradient(135deg,rgba(235,220,203,.35) 0 10px,transparent 10px 20px),
    var(--surface);
  color:var(--muted);
  font-size:.9rem;
  padding:20px;
}
.media-slot img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius)}

/* v1.6 — marca, formulário e componentes editoriais */
.brand-logo{width:clamp(180px,18vw,238px);max-height:68px}
.footer-brand{display:block;width:min(100%,250px);box-shadow:none!important}
.footer-brand img{display:block;width:100%;height:auto;filter:brightness(0) invert(1)}
.footer-grid>div:first-child>p{max-width:34ch;color:#c9dbd4;line-height:1.55;margin-top:1rem}
.icon{width:1.35em;height:1.35em;flex:none}
.whatsapp{width:fit-content;margin-bottom:1rem}
.contact-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,.7fr);gap:clamp(32px,5vw,72px);align-items:start}
.contact-aside{border-left:3px solid var(--clay);padding-left:24px}
.contact-note{font-size:.9rem;color:var(--muted);line-height:1.55;margin-top:1.5rem}
.contact-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:28px}
.button.secondary{background:var(--surface);color:var(--green);border-color:var(--green)}
.button.secondary:hover{background:var(--green-soft);color:var(--green-deep)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:24px 0}
.form-grid label{display:grid;gap:7px;font-size:.94rem;font-weight:600}
.form-grid .full{grid-column:1/-1}
.form-grid input,.form-grid select,.form-grid textarea{width:100%;min-height:50px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);font:inherit;padding:11px 13px}
.form-grid textarea{resize:vertical;min-height:150px}
.form-grid input:focus-visible,.form-grid select:focus-visible,.form-grid textarea:focus-visible{outline:3px solid var(--clay);outline-offset:2px}
.form-grid .consent{display:flex;grid-template-columns:22px 1fr;align-items:start;font-weight:400;line-height:1.55}
.form-grid .consent input{width:20px;min-height:20px;margin-top:3px}
.honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.form-status{min-height:1.7em;margin-top:14px;font-weight:600}
.form-status.is-error{color:#8b2f20}.form-status.is-success{color:#1f6f4d}.form-status.is-loading{color:var(--muted)}
.instrument-mark{display:inline-grid;place-items:center;flex:0 0 38px;width:38px;height:38px;margin-right:12px;border-radius:50%;background:var(--green-soft);color:var(--green);font-weight:700}
@media(max-width:720px){.contact-layout,.form-grid{grid-template-columns:1fr}.contact-aside{border-left:0;border-top:3px solid var(--clay);padding:24px 0 0}.footer-brand{width:220px}}

/* v1.8 LOVABLE — formulário de contato e mapa de localização */
.wrap.narrow{max-width:820px}
.contact-form .button{width:auto}
.contact-form .button[disabled]{opacity:.6;cursor:progress}
.map-embed{margin:28px 0 4px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);overflow:hidden;box-shadow:var(--shadow-sm);background:var(--surface)}
.map-embed iframe{display:block;width:100%;height:clamp(280px,42vw,440px);border:0}
@media(max-width:720px){.contact-form .button{width:100%}}
