/* ============================================================
   DROGAMART — Site (protótipo HTML)
   Depende de tokens.css (design system)
   ============================================================ */
/* tokens.css é carregado por <link> no HTML, antes deste arquivo.
   (@import bloqueia o carregamento em paralelo e atrapalha o cache) */

/* ------------------------------------------------------------
   GRIFT — fonte principal da marca (licenciada).
   Assim que o cliente enviar os arquivos, descomente e coloque
   os .woff2 em assets/fonts/. Sem isso, o fallback é Inter.
   ------------------------------------------------------------
@font-face {
  font-family: "Grift";
  src: url("../fonts/grift-semibold.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Grift";
  src: url("../fonts/grift-bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Grift";
  src: url("../fonts/grift-extrabold.woff2") format("woff2");
  font-weight: 800; font-style: normal; font-display: swap;
}
------------------------------------------------------------ */

/* ---------- Reset ---------- */
*,*::before,*::after { box-sizing: border-box; }
html { scroll-behavior: smooth;
  /* cor do "estica e puxa" da rolagem no celular, para não piscar branco */
  background-color: var(--dm-blue-700); }
body {
  margin: 0;
  font-family: var(--dm-font-body);
  font-size: var(--dm-text-base);
  line-height: var(--dm-lh-normal);
  color: var(--dm-text);
  background: var(--dm-bg);
  -webkit-font-smoothing: antialiased;
  /* 'clip' e não 'hidden': hidden transforma o body em contêiner de rolagem
     e quebra o position:sticky do header. */
  overflow-x: clip;
}
img, svg, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
/* o reset precisa cobrir ol também: sem isso o <ol> herda o recuo padrão
   do navegador (40px) e a lista fica deslocada para a direita */
ul, ol { list-style: none; margin: 0; padding: 0; }
h1,h2,h3,h4 { margin: 0 0 var(--dm-space-4); font-family: var(--dm-font-heading);
  line-height: var(--dm-lh-tight); letter-spacing: var(--dm-ls-tight); color: var(--dm-blue-500); }
p { margin: 0 0 var(--dm-space-4); }
:focus-visible { outline: 3px solid var(--dm-blue-300); outline-offset: 3px; border-radius: 4px; }

/* ---------- Vidro (glass) ----------
   Regra: só usar onde existe algo atrás para borrar (foto, gradiente, conteúdo
   rolando por baixo). Sobre fundo branco chapado, vidro não faz efeito nenhum.
   Todo bloco de vidro tem fallback sólido em @supports. */
.glass {
  background: var(--dm-glass-light);
  -webkit-backdrop-filter: var(--dm-glass-blur);
  backdrop-filter: var(--dm-glass-blur);
  border: 1px solid var(--dm-glass-border);
  box-shadow: var(--dm-glass-shadow);
}
.glass--dark {
  background: var(--dm-glass-dark);
  border-color: var(--dm-glass-border-dark);
  color: #fff;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .glass { background: var(--dm-glass-light-solid); }
  .glass--dark { background: var(--dm-glass-dark-solid); }
}

/* ---------- Ícones (Lucide) ---------- */
.btn svg, .shortcut__icon svg, .dock svg { stroke-width: 2; }
.post__date svg, .store-card__addr svg, .footer__contact svg { stroke-width: 1.75; }

/* ---------- Utilitários ---------- */
.container { width: 100%; max-width: 1200px; margin-inline: auto; padding-inline: 20px; }
.section { padding-block: clamp(56px, 8vw, 104px); }
.section--tight { padding-block: clamp(40px, 5vw, 64px); }
.eyebrow { display: inline-block; font-size: var(--dm-text-sm); font-weight: 700;
  letter-spacing: var(--dm-ls-wide); text-transform: uppercase; color: var(--dm-red-500); margin-bottom: 10px; }
.title { font-size: clamp(1.875rem, 3.6vw, 3rem); font-weight: 700; }
.lead { font-size: var(--dm-text-lg); color: var(--dm-text-muted); line-height: var(--dm-lh-relaxed); max-width: 62ch; }
.brandname { font-family: var(--dm-font-brand); font-weight: 800; }
.center { text-align: center; }
.center .lead { margin-inline: auto; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.section-head { margin-bottom: clamp(28px, 4vw, 48px); }
.section-head .lead { margin-bottom: 0; }

/* ---------- Botões ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-weight:600; padding:14px 28px; border-radius: var(--dm-radius-pill);
  border:2px solid transparent; line-height:1; white-space:nowrap;
  transition: background var(--dm-duration-base) var(--dm-ease-standard),
              color var(--dm-duration-base) var(--dm-ease-standard),
              border-color var(--dm-duration-base) var(--dm-ease-standard),
              transform var(--dm-duration-fast) var(--dm-ease-out); }
.btn:active { transform: translateY(1px); }
.btn svg { width: 18px; height: 18px; flex: none; }
.btn--primary { background: var(--dm-red-500); color:#fff; }
.btn--primary:hover { background: var(--dm-red-700); }
.btn--secondary { background: var(--dm-blue-500); color:#fff; }
.btn--secondary:hover { background: var(--dm-blue-700); }
.btn--outline { border-color: var(--dm-blue-500); color: var(--dm-blue-500); }
.btn--outline:hover { background: var(--dm-blue-500); color:#fff; }
.btn--light { background:#fff; color: var(--dm-blue-500); }
.btn--light:hover { background: var(--dm-neutral-100); }
.btn--ghost-light { border-color: rgba(255,255,255,.55); color:#fff; }
.btn--ghost-light:hover { background:#fff; color: var(--dm-blue-500); border-color:#fff; }
.btn--sm { padding:10px 20px; font-size: var(--dm-text-sm); }
.btn--lg { padding:18px 36px; font-size: var(--dm-text-lg); }
.btn--block { width:100%; }

/* ---------- Placeholder de imagem ---------- */
/* ---------- Área de imagem ----------
   Estado padrão (sem foto): superfície neutra da marca, apresentável.
   Nunca mostra moldura tracejada nem rótulo — se uma imagem falhar em
   produção, o que sobra é um bloco limpo, não um placeholder de dev.
   Os rótulos de referência aparecem só com <body class="proto">. */
.ph { position:relative; display:flex; align-items:center; justify-content:center;
  background-color: var(--dm-neutral-100);
  background-image: url("../img/patterns/pattern-branco-sutil.svg?v=2");
  background-size: 320px; color: var(--dm-neutral-400);
  border-radius: var(--dm-radius-lg); overflow: hidden; text-align:center; }

.ph img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:1; }
/* IMPORTANTE: a foto ocupa o z-index 1. Qualquer coisa que fique POR CIMA dela
   (tags, selos, legendas, degradês) precisa de z-index 2 ou mais. */

/* com foto carregada, o bloco desaparece por completo */
.ph:has(img), .ph.has-image { background:none; border:0; }

.ph--dark { background-color: var(--dm-blue-700);
  background-image: url("../img/patterns/pattern-azul-sutil.svg?v=2"); }

/* modo protótipo: rótulo + tracejado, só enquanto a foto não existe */
body.proto .ph:not(:has(img)):not(.has-image) { border: 1px dashed var(--dm-neutral-300); }
body.proto .ph:not(:has(img)):not(.has-image)::after {
  content: attr(data-ph); position:absolute; bottom:12px; left:50%; transform:translateX(-50%);
  max-width: calc(100% - 24px); font-size: 12px; font-weight:600; letter-spacing:.04em;
  text-transform: uppercase; padding: 8px 14px; color: var(--dm-neutral-500);
  background: rgba(255,255,255,.8); border-radius: var(--dm-radius-pill); }
body.proto .ph--dark:not(:has(img)):not(.has-image)::after {
  background: rgba(0,0,0,.3); color: rgba(255,255,255,.85); }

/* ============================================================
   TOPBAR
   ============================================================ */
/* (a barra do topo foi removida a pedido do cliente — infos já estão no menu) */

/* ============================================================
   HEADER
   ============================================================ */
.header { position: sticky; top:0; z-index:100;
  background: rgba(255,255,255,.78);
  -webkit-backdrop-filter: var(--dm-glass-blur);
  backdrop-filter: var(--dm-glass-blur);
  box-shadow: inset 0 -1px 0 rgba(0,19,132,.08);
  transition: background var(--dm-duration-base) var(--dm-ease-standard),
              box-shadow var(--dm-duration-base) var(--dm-ease-standard); }
.header.is-stuck {
  background: rgba(255,255,255,.70);
  -webkit-backdrop-filter: blur(28px) saturate(1.9); backdrop-filter: blur(28px) saturate(1.9);
  box-shadow: inset 0 -1px 0 rgba(0,19,132,.10), 0 8px 32px -8px rgba(0,6,41,.22); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .header, .header.is-stuck { background: #fff; }
}
.header__inner { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:76px; }
.header__logo img { width: 190px; }

.nav > ul { display:flex; align-items:center; gap:4px; }
.nav a, .nav > ul > li > button { display:flex; align-items:center; gap:6px; white-space:nowrap;
  padding:10px 11px; border-radius: var(--dm-radius-sm); font-size:14px; font-weight:600;
  color: var(--dm-blue-500); background:none; border:0; letter-spacing:.01em;
  transition: color var(--dm-duration-fast) var(--dm-ease-standard), background var(--dm-duration-fast) var(--dm-ease-standard); }
.nav a:hover, .nav > ul > li > button:hover { color: var(--dm-red-500); background: var(--dm-neutral-50); }
.nav a.is-active, .nav > ul > li > button.is-active { color: var(--dm-red-500); }
.nav__caret { width:10px; height:10px; transition: transform var(--dm-duration-fast) var(--dm-ease-standard); }
.has-sub { position: relative; }
/* ponte invisível entre o item e o submenu: sem ela o menu fecha quando o
   mouse passa pelo vão de 6px */
.has-sub::after { content:""; position:absolute; left:0; right:0; top:100%; height:10px; }
.has-sub:hover .nav__caret, .has-sub:focus-within .nav__caret { transform: rotate(180deg); }
.sub { position:absolute; top:calc(100% + 6px); left:0; min-width:250px;
  background: rgba(255,255,255,.86);
  -webkit-backdrop-filter: var(--dm-glass-blur); backdrop-filter: var(--dm-glass-blur);
  border:1px solid var(--dm-glass-border); border-radius: var(--dm-radius-md);
  box-shadow: var(--dm-glass-shadow), var(--dm-shadow-lg);
  padding:8px; opacity:0; visibility:hidden; transform: translateY(-6px);
  transition: opacity var(--dm-duration-fast) var(--dm-ease-standard), transform var(--dm-duration-fast) var(--dm-ease-standard), visibility var(--dm-duration-fast); }
.has-sub:hover .sub, .has-sub:focus-within .sub { opacity:1; visibility:visible; transform: translateY(0); }
.sub a { padding:11px 14px; font-weight:500; border-radius: var(--dm-radius-sm); }
.header__cta { display:flex; align-items:center; gap:10px; }
/* No desktop só sobrou o botão do menu mobile aqui dentro, que fica oculto.
   Mesmo com largura zero a div continua sendo um item flex, e o space-between
   passa a dividir o espaço entre TRÊS itens — o menu ia parar no meio.
   Tirando ela do fluxo, restam logo e menu: um em cada ponta. */
@media (min-width: 1121px){ .header__cta { display:none; } }
.burger { display:none; width:46px; height:46px; align-items:center; justify-content:center;
  border:0; background: var(--dm-neutral-50); border-radius: var(--dm-radius-sm); color: var(--dm-blue-500);
  transition: background var(--dm-duration-fast) var(--dm-ease-standard), color var(--dm-duration-fast) var(--dm-ease-standard); }
.burger:hover { background: var(--dm-blue-500); color:#fff; }
.burger svg { width:24px; height:24px; }
@media (max-width: 1120px){
  .nav { display:none; }
  .burger { display:flex; }
  .header__cta .btn { display:none; }
  .header__logo img { width: 165px; }
}

/* ---------- Menu mobile ---------- */
.drawer { position:fixed; inset:0; z-index:200; visibility:hidden; }
.drawer.is-open { visibility:visible; }
.drawer__overlay { position:absolute; inset:0; background: rgba(0,6,41,.45);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); opacity:0;
  transition: opacity var(--dm-duration-base) var(--dm-ease-standard); }
.drawer.is-open .drawer__overlay { opacity:1; }
.drawer__panel { position:absolute; top:0; right:0; height:100%; width:min(360px, 88vw);
  background: rgba(255,255,255,.92);
  -webkit-backdrop-filter: var(--dm-glass-blur); backdrop-filter: var(--dm-glass-blur);
  border-left: 1px solid var(--dm-glass-border);
  display:flex; flex-direction:column; transform: translateX(100%);
  transition: transform var(--dm-duration-base) var(--dm-ease-standard); overflow-y:auto; }
.drawer.is-open .drawer__panel { transform: translateX(0); }
.drawer__head { display:flex; align-items:center; justify-content:space-between;
  padding:18px 20px; border-bottom:1px solid var(--dm-border); }
.drawer__head img { width:150px; }
.drawer__close { width:42px; height:42px; border:0; background: var(--dm-neutral-50);
  border-radius: var(--dm-radius-sm); color: var(--dm-blue-500); display:flex; align-items:center; justify-content:center; }
.drawer__nav { padding: 8px 12px 20px; }
.drawer__nav > li > a, .drawer__nav > li > button {
  display:flex; align-items:center; justify-content:space-between; width:100%;
  padding:15px 12px; font-weight:600; color: var(--dm-blue-500);
  border:0; background:none; border-bottom:1px solid var(--dm-neutral-100); text-align:left; }
.drawer__sub { max-height:0; overflow:hidden; transition: max-height var(--dm-duration-base) var(--dm-ease-standard); }
.drawer__sub.is-open { max-height: 320px; }
.drawer__sub a { display:block; padding:12px 12px 12px 26px; font-size:15px; color: var(--dm-neutral-600);
  border-bottom:1px solid var(--dm-neutral-100);
  transition: color var(--dm-duration-fast) var(--dm-ease-standard); }
.drawer__nav a:hover, .drawer__sub a:hover { color: var(--dm-red-500); }
.drawer__foot { margin-top:auto; padding:20px; display:grid; gap:10px; }

/* ============================================================
   HERO
   ============================================================ */
.hero { position:relative; background: var(--dm-blue-500); overflow:hidden;
  /* a foto é full-width; só o conteúdo é encaixotado em 1280 */
  --hero-box: 1280px;
  --hero-gutter: max(20px, calc((100% - var(--hero-box)) / 2 + 24px)); }
.hero__track { display:flex; transition: transform 600ms var(--dm-ease-standard); }
/* min-width:0 — sem isso o slide, como item flex, não encolhe abaixo da
   largura do conteúdo: o botão tem white-space:nowrap e esticava o slide
   para além da tela no celular. */
/* Telas bem estreitas (≤420px): o texto do botão pode quebrar em duas linhas.
   Com white-space:nowrap ele vira o piso de largura da coluna que o contém e
   empurra a página para fora da tela — foi o que acontecia em Fale Conosco e
   Trabalhe Conosco num aparelho de 320px. */
@media (max-width: 420px){
  .btn { white-space: normal; line-height:1.3; text-align:center; }
}

.hero__slide { min-width:0; position:relative; flex:0 0 100%; min-height: clamp(460px, 62vh, 640px);
  display:flex; align-items:center; }
.hero__media { position:absolute; inset:0; z-index:0; }
.hero__media .ph { width:100%; height:100%; border-radius:0; border:0; }
.hero__media img { width:100%; height:100%; object-fit:cover;
  /* topo da foto: mantém rostos e cena acima da dobra do bloco */
  object-position: center top; }
.hero__slide::after { content:""; position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(90deg, rgba(0,19,132,.92) 0%, rgba(0,19,132,.80) 38%, rgba(0,19,132,.28) 68%, rgba(0,12,82,.12) 100%),
    linear-gradient(180deg, rgba(0,6,41,.22) 0%, rgba(0,6,41,0) 32%, rgba(0,6,41,.30) 100%); }
.hero .hero__content { position:relative; z-index:3; width:100%; max-width: var(--hero-box);
  margin-inline: auto; color:#fff; padding: 56px 24px 96px; }
.hero__text { max-width: 700px; }
.hero__content .eyebrow { color:#fff; opacity:1; margin-bottom:18px;
  padding: 8px 16px; border-radius: var(--dm-radius-pill);
  background: var(--dm-glass-tint);
  -webkit-backdrop-filter: var(--dm-glass-blur-soft); backdrop-filter: var(--dm-glass-blur-soft);
  border: 1px solid var(--dm-glass-border-dark); }
.hero h1 { color:#fff; font-size: clamp(2.25rem, 4.4vw, 3.5rem); font-weight:800; margin-bottom:18px;
  text-wrap: balance; }
.hero p { color: rgba(255,255,255,.88); font-size: var(--dm-text-lg); max-width: 50ch; margin-bottom:28px; }
.hero__actions { display:flex; flex-wrap:wrap; gap:12px; }
/* navegação do carrossel: setas no canto inferior direito, dots à esquerda,
   alinhados com o texto — nunca por cima do conteúdo */
.hero__nav { position:absolute; z-index:4; bottom:24px;
  width:44px; height:44px; border-radius:50%; border:1px solid rgba(255,255,255,.28);
  background: var(--dm-glass-tint); color:#fff;
  display:flex; align-items:center; justify-content:center;
  -webkit-backdrop-filter: var(--dm-glass-blur); backdrop-filter: var(--dm-glass-blur);
  transition: background var(--dm-duration-fast) var(--dm-ease-standard),
              border-color var(--dm-duration-fast) var(--dm-ease-standard); }
.hero__nav:hover { background: rgba(255,255,255,.26); border-color: rgba(255,255,255,.5); }
.hero__nav:active { background: rgba(255,255,255,.34); transform: scale(.94); }
.hero__nav--prev { right: calc(var(--hero-gutter) + 56px); }
.hero__nav--next { right: var(--hero-gutter); }
.hero__dots { position:absolute; z-index:4; bottom:38px;
  left: var(--hero-gutter); display:flex; gap:8px; }
.hero__dots button { position:relative; width:10px; height:10px; padding:0; border-radius:50%; border:0;
  background: rgba(255,255,255,.4); transition: all var(--dm-duration-fast) var(--dm-ease-standard); }
/* alvo de toque de 44px sem mudar o tamanho visual do ponto */
.hero__dots button::after { content:""; position:absolute; inset:-17px; }
.hero__dots button.is-active { background:#fff; width:30px; border-radius: 999px; }
@media (max-width: 700px){
  .hero__slide::after { background: linear-gradient(180deg, rgba(0,19,132,.78) 0%, rgba(0,19,132,.92) 60%, rgba(0,12,82,.94) 100%); }
  /* No celular os dois botões ocupam a linha inteira. Fonte e recuo menores
     para o rótulo mais longo ("Acompanhe nossa rede social") caber em uma
     linha só — com eles iguais, os dois botões ficam da mesma altura. */
  .hero__actions .btn { flex:1 1 100%; font-size:1rem; padding-inline:20px; }
  /* No mobile os controles vão todos para a ESQUERDA: à direita fica o
     botão flutuante do WhatsApp, que cobriria as setas. */
  .hero__nav { width:40px; height:40px; bottom:20px; }
  .hero__nav--prev { left: var(--hero-gutter); right:auto; }
  .hero__nav--next { left: calc(var(--hero-gutter) + 48px); right:auto; }
  .hero__dots { left: calc(var(--hero-gutter) + 110px); bottom:35px; }
  .hero .hero__content { padding-bottom: 84px; }
}
/* aparelhos estreitos (320px): mais um aperto para o rótulo longo caber */
@media (max-width: 380px){
  .hero .hero__content { padding-inline:18px; }
  .hero__actions .btn { font-size:.875rem; padding-inline:12px; gap:8px; }
  .hero__actions .btn svg { width:17px; height:17px; }
}

/* ============================================================
   FAIXA SLOGAN
   ============================================================ */
.stripe { background: var(--dm-red-500); color:#fff; background-image: url("../img/patterns/pattern-vermelho-sutil.svg?v=2");
  background-size: 300px; }
.stripe .container { display:flex; align-items:center; justify-content:center; gap:16px;
  padding-block: 22px; text-align:center; }
.stripe p { margin:0; font-size: clamp(1.05rem, 2.2vw, 1.5rem); font-weight:700; letter-spacing:.01em; }
.stripe img { width:38px; flex:none; }
@media (max-width: 560px){ .stripe img { width:30px; } }

/* ============================================================
   ATALHOS
   ============================================================ */
.shortcuts { padding-block: clamp(40px, 5vw, 64px); position:relative; z-index:5; }
.shortcuts__grid { display:grid; gap:16px; grid-template-columns: 1fr; }
@media (min-width: 620px){ .shortcuts__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 860px){ .shortcuts__grid { grid-template-columns: repeat(3, 1fr); } }
.shortcut { display:flex; flex-direction:column; align-items:flex-start; gap:12px;
  background:#fff; border:1px solid var(--dm-border); border-radius: var(--dm-radius-lg);
  padding:24px; box-shadow: var(--dm-shadow-sm);
  transition: transform var(--dm-duration-base) var(--dm-ease-standard), box-shadow var(--dm-duration-base) var(--dm-ease-standard), border-color var(--dm-duration-base) var(--dm-ease-standard); }
.shortcut:hover { transform: translateY(-4px); box-shadow: var(--dm-shadow-lg); border-color: transparent; }
.shortcut__icon { width:52px; height:52px; border-radius: var(--dm-radius-md);
  display:flex; align-items:center; justify-content:center;
  background: rgba(0,19,132,.07); color: var(--dm-blue-500);
  transition: background var(--dm-duration-base) var(--dm-ease-standard),
              color var(--dm-duration-base) var(--dm-ease-standard),
              transform var(--dm-duration-base) var(--dm-ease-out); }
.shortcut:hover .shortcut__icon { background: var(--dm-red-500); color:#fff; transform: scale(1.06) rotate(-3deg); }
.shortcut__icon svg { width:26px; height:26px; }
.shortcut h3 { font-size: var(--dm-text-lg); margin:0; }
.shortcut p { font-size: var(--dm-text-sm); color: var(--dm-text-muted); margin:0; }
.shortcut__link { margin-top:auto; padding-top:10px; font-size:14px; font-weight:700; color: var(--dm-red-500);
  transition: transform var(--dm-duration-base) var(--dm-ease-out); }
.shortcut:hover .shortcut__link { transform: translateX(4px); }

/* ============================================================
   SOBRE / O GRUPO
   ============================================================ */
.about__grid { display:grid; gap: clamp(32px, 5vw, 64px); align-items:center; }
@media (min-width: 960px){ .about__grid { grid-template-columns: 1fr 1fr; } }
.about__media { position:relative; }
.about__media .ph { aspect-ratio: 4/3; }
.about__badge { position:absolute; right:24px; bottom:24px; z-index:2; color:#fff;
  border-radius: var(--dm-radius-lg); padding:20px 26px;
  background: var(--dm-glass-dark);
  -webkit-backdrop-filter: var(--dm-glass-blur); backdrop-filter: var(--dm-glass-blur);
  border: 1px solid var(--dm-glass-border-dark); box-shadow: var(--dm-glass-shadow); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .about__badge { background: var(--dm-gradient-digital); }
}
.about__badge { text-align:center; }
.about__badge span { display:block; font-size:11px; letter-spacing:.10em; text-transform:uppercase;
  opacity:.8; margin-bottom:5px; }
.about__badge strong { display:block; font-size:1.125rem; line-height:1.25; letter-spacing:.01em; }
.pillars { display:flex; flex-wrap:wrap; gap:10px; margin: 22px 0 26px; }
.pillar { display:inline-flex; align-items:center; gap:8px; padding:9px 16px;
  border-radius: var(--dm-radius-pill); background: rgba(0,19,132,.06);
  font-size:13px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color: var(--dm-blue-500); }
.pillar svg { width:16px; height:16px; color: var(--dm-red-500); }

/* Números */
.stats { background: var(--dm-neutral-50); }
.stats__grid { display:grid; gap:24px; grid-template-columns: repeat(2,1fr); text-align:center; }
@media (min-width: 860px){ .stats__grid { grid-template-columns: repeat(4,1fr); } }
.stat strong { display:block; font-size: clamp(2rem, 4vw, 3rem); font-weight:800; color: var(--dm-blue-500); line-height:1; }
.stat span { font-size: var(--dm-text-sm); color: var(--dm-text-muted); }

/* ============================================================
   LOJAS
   ============================================================ */
.stores { background: var(--dm-gradient-digital); color:#fff; position:relative; overflow:hidden; }
.stores::before { content:""; position:absolute; inset:0; background: url("../img/patterns/pattern-azul-sutil.svg?v=2"); background-size:460px; opacity:.5; }
.stores > .container { position:relative; z-index:2; }
.stores h2 { color:#fff; }
.stores .lead { color: rgba(255,255,255,.82); }
.finder { display:grid; gap:12px; border-radius: var(--dm-radius-lg); padding:16px; margin-bottom: 32px;
  background: var(--dm-glass-tint); border:1px solid var(--dm-glass-border-dark);
  -webkit-backdrop-filter: var(--dm-glass-blur); backdrop-filter: var(--dm-glass-blur);
  box-shadow: var(--dm-glass-shadow); }
@media (min-width: 860px){ .finder { grid-template-columns: 1.4fr 1fr auto auto; align-items:center; } }
.field { position:relative; display:flex; align-items:center; }
.field svg { position:absolute; left:14px; width:18px; height:18px; color: var(--dm-neutral-400); pointer-events:none; }
.field input, .field select { width:100%; font:inherit; color: var(--dm-text); background:#fff;
  padding:14px 16px 14px 42px; border:0; border-radius: var(--dm-radius-md); appearance:none;
  transition: border-color var(--dm-duration-fast) var(--dm-ease-standard),
              box-shadow var(--dm-duration-fast) var(--dm-ease-standard); }
.field input:focus, .field select:focus { outline:none; box-shadow: 0 0 0 3px rgba(0,37,245,.28); }
.field svg { transition: color var(--dm-duration-fast) var(--dm-ease-standard); }
.field:focus-within svg { color: var(--dm-blue-500); }
.field select { cursor:pointer; }
.field--select::after { content:""; position:absolute; right:16px; width:9px; height:9px;
  border-right:2px solid var(--dm-neutral-400); border-bottom:2px solid var(--dm-neutral-400);
  transform: rotate(45deg) translateY(-3px); pointer-events:none; }
.stores__grid { display:grid; gap:20px; }
@media (min-width: 720px){ .stores__grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1040px){ .stores__grid { grid-template-columns: repeat(3,1fr); } }
.store-card { background:#fff; color: var(--dm-text); border-radius: var(--dm-radius-lg); overflow:hidden;
  display:flex; flex-direction:column; box-shadow: var(--dm-shadow-md);
  transition: transform var(--dm-duration-base) var(--dm-ease-standard), box-shadow var(--dm-duration-base) var(--dm-ease-standard); }
.store-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(0,6,41,.28); }
.store-card__media .ph { aspect-ratio: 16/10; border-radius:0; border:0; }
.store-card__body { padding:22px; display:flex; flex-direction:column; gap:12px; flex:1; }
.store-card h3 { font-size: var(--dm-text-xl); margin:0; }
.store-card__city { font-size:13px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color: var(--dm-red-500); }
.store-card__addr { font-size: var(--dm-text-sm); color: var(--dm-text-muted); margin:0; display:flex; gap:8px; }
.store-card__addr svg { width:16px; height:16px; flex:none; margin-top:2px; color: var(--dm-neutral-400); }
.status { display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:600; }
.status__dot { width:9px; height:9px; border-radius:50%; background: var(--dm-neutral-300); flex:none; }
.status.is-open { color: var(--dm-success); }
.status.is-open .status__dot { background: var(--dm-success); box-shadow: 0 0 0 4px rgba(15,138,77,.15); }
.status.is-closed { color: var(--dm-red-500); }
.status.is-closed .status__dot { background: var(--dm-red-500); box-shadow: 0 0 0 4px rgba(198,0,0,.12); }
.hours-toggle { display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600;
  color: var(--dm-blue-500); background:none; border:0; padding:0; }
.hours-toggle svg { width:13px; height:13px; transition: transform var(--dm-duration-fast) var(--dm-ease-standard); }
.hours-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.hours { max-height:0; overflow:hidden; transition: max-height var(--dm-duration-base) var(--dm-ease-standard); }
.hours.is-open { max-height: 260px; }
.hours table { width:100%; border-collapse:collapse; font-size:13px; margin-top:10px; }
.hours td { padding:6px 0; border-bottom:1px solid var(--dm-neutral-100); color: var(--dm-text-muted); }
.hours td:last-child { text-align:right; font-weight:600; color: var(--dm-text); }
.hours tr.is-today td { color: var(--dm-blue-500); }
.store-card__foot { display:flex; gap:10px; padding:0 22px 22px; }
.store-card__foot .btn { flex:1; }
.stores__more { margin-top:36px; text-align:center; }

/* ============================================================
   OFERTAS
   ============================================================ */
.offers__grid { display:grid; gap: clamp(24px, 4vw, 48px); align-items:center; }
@media (min-width: 960px){ .offers__grid { grid-template-columns: 1.05fr .95fr; } }
.offers__media { position:relative; }
.offers__media .ph { aspect-ratio: 3/4; max-width: 420px; margin-inline:auto; box-shadow: var(--dm-shadow-lg); }
.offers__tag { position:absolute; top:-14px; left:50%; transform: translateX(-50%); z-index:2;
  white-space: nowrap; max-width: calc(100% - 24px);
  background: var(--dm-red-500); color:#fff; padding:9px 22px; border-radius: var(--dm-radius-pill);
  font-size:13px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; box-shadow: var(--dm-shadow-brand); }
@media (max-width: 560px){
  .offers__tag { font-size:11px; padding:8px 16px; }
}
.offers__filters { display:grid; gap:12px; margin: 24px 0 26px; }
@media (min-width: 560px){ .offers__filters { grid-template-columns: 1fr 1fr; } }
.offers__filters .field input, .offers__filters .field select {
  border:1.5px solid var(--dm-border); padding-left:42px; }
.offers__note { font-size: var(--dm-text-sm); color: var(--dm-text-muted); display:flex; gap:8px; align-items:flex-start; }
.offers__note svg { width:16px; height:16px; flex:none; margin-top:3px; color: var(--dm-red-500); }

/* ============================================================
   NOTÍCIAS
   ============================================================ */
.news { background: var(--dm-neutral-50); }
.news__head { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.news__grid { display:grid; gap:24px; }
@media (min-width: 720px){ .news__grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1040px){ .news__grid { grid-template-columns: repeat(3,1fr); } }
.post { background:#fff; border-radius: var(--dm-radius-lg); overflow:hidden; display:flex; flex-direction:column;
  border:1px solid var(--dm-border);
  transition: transform var(--dm-duration-base) var(--dm-ease-standard), box-shadow var(--dm-duration-base) var(--dm-ease-standard); }
.post:hover { transform: translateY(-4px); box-shadow: var(--dm-shadow-lg); }
.post__media { position:relative; }
.post__media .ph { aspect-ratio: 16/10; border-radius:0; border:0; }
.post__cat { position:absolute; top:14px; left:14px; z-index:2; color:#fff;
  padding:6px 14px; border-radius: var(--dm-radius-pill); font-size:11px; font-weight:700;
  letter-spacing:.04em; text-transform:uppercase;
  background: rgba(198,0,0,.80);
  -webkit-backdrop-filter: var(--dm-glass-blur-soft); backdrop-filter: var(--dm-glass-blur-soft);
  border: 1px solid rgba(255,255,255,.28); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .post__cat { background: var(--dm-red-500); }
}
.post__body { padding:22px; display:flex; flex-direction:column; gap:10px; flex:1; }
.post__date { font-size:13px; color: var(--dm-text-muted); display:flex; align-items:center; gap:7px; }
.post__date svg { width:14px; height:14px; }
.post h3 { font-size: var(--dm-text-lg); margin:0;
  transition: color var(--dm-duration-base) var(--dm-ease-standard); }
.post:hover h3 { color: var(--dm-red-500); }
.post p { font-size: var(--dm-text-sm); color: var(--dm-text-muted); margin:0; }
.post__link { margin-top:auto; padding-top:8px; font-size:14px; font-weight:700; color: var(--dm-blue-500);
  display:inline-flex; align-items:center; gap:7px;
  transition: color var(--dm-duration-base) var(--dm-ease-standard); }
.post:hover .post__link { color: var(--dm-red-500); }
.post__link svg { width:15px; height:15px; transition: transform var(--dm-duration-fast) var(--dm-ease-out); }
.post:hover .post__link svg { transform: translateX(3px); }

/* ============================================================
   CATEGORIAS
   ============================================================ */
.categorias__grid { display:grid; gap:20px; grid-template-columns: 1fr; }
@media (min-width: 640px){ .categorias__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px){ .categorias__grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1180px){ .categorias__grid { grid-template-columns: repeat(6, 1fr); gap:16px; } }
@media (min-width: 1180px){ .categoria__info { padding:56px 14px 14px; } .categoria__info h3 { font-size: var(--dm-text-base); } .categoria__info p { font-size:12px; } }

.categoria { position:relative; display:block; border-radius: var(--dm-radius-lg); overflow:hidden;
  background:#fff; box-shadow: var(--dm-shadow-sm);
  transition: transform var(--dm-duration-base) var(--dm-ease-standard),
              box-shadow var(--dm-duration-base) var(--dm-ease-standard); }
.categoria:hover { transform: translateY(-3px); box-shadow: var(--dm-shadow-md); }
.categoria .ph { aspect-ratio: 3/4; border-radius:0; }
/* em coluna única (mobile) o card 3:4 fica alto demais — deita a foto.
   Precisa vir DEPOIS da regra acima: mesma especificidade, quem vem por último vence. */
@media (max-width: 639px){
  .categoria .ph { aspect-ratio: 4/3; }
  .categoria__info { padding: 64px 20px 20px; }
}
.categoria .ph img { transition: transform 700ms var(--dm-ease-out); }
.categoria:hover .ph img { transform: scale(1.05); }

/* a legenda fica sobre a foto, com um véu preto que nasce alto e vai fechando */
.categoria__info { position:absolute; inset:auto 0 0 0; z-index:2; padding:64px 18px 16px; color:#fff;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.4) 50%, rgba(0,0,0,.8) 100%); }
.categoria__info h3 { color:#fff; font-size: var(--dm-text-lg); margin:0 0 2px; }
.categoria__info p { margin:0; font-size: var(--dm-text-sm); color: rgba(255,255,255,.82); }

/* sem foto, a legenda precisa de fundo próprio para não sumir no cinza */
.categoria .ph:not(:has(img)):not(.has-image) + .categoria__info,
.categoria .ph:not(.has-image) + .categoria__info { background: var(--dm-gradient-digital); }
.categoria .ph.has-image + .categoria__info {
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.4) 50%, rgba(0,0,0,.8) 100%); }


/* ============================================================
   MARCAS — faixa informativa (sem links) logo abaixo da hero.
   Hoje são nomes em texto; vira <img> quando o cliente mandar as logos.
   ============================================================ */
.marcas { background:#fff; border-bottom:1px solid var(--dm-border); padding-block: clamp(48px, 6vw, 72px) clamp(44px, 5vw, 64px); }
.marcas .section-head { margin-bottom: 32px; }
/* fade nas laterais: a máscara apaga as pontas da esteira */
.marcas__viewport { overflow:hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%); }
.marcas__esteira { display:flex; width:max-content; gap:14px; animation: marcas-rolar 40s linear infinite; }
.marcas__viewport:hover .marcas__esteira { animation-play-state: paused; }
.marcas__track { display:flex; gap:14px; flex:none; }
.marcas__item { flex:none; width:160px; height:64px;
  display:flex; align-items:center; justify-content:center; border-radius: var(--dm-radius-md);
  background: var(--dm-neutral-50); border:1px solid var(--dm-border); }
.marcas__item span { font-family: var(--dm-font-brand); font-weight:800; font-size:1.05rem; color: var(--dm-neutral-400);
  letter-spacing:-.01em; white-space:nowrap; }
.marcas__item img { max-height:30px; max-width:120px; width:auto; filter:grayscale(1); opacity:.75; }
/* duas listas iguais: deslocar exatamente uma lista (50%) + metade do gap fecha o loop sem pulo */
@keyframes marcas-rolar { from { transform: translateX(0); } to { transform: translateX(calc(-50% - 7px)); } }
@media (prefers-reduced-motion: reduce){
  .marcas__esteira { animation:none; width:auto; flex-wrap:wrap; justify-content:center; }
  .marcas__track[aria-hidden] { display:none; }
  .marcas__viewport { -webkit-mask-image:none; mask-image:none; }
}
.link-inline { color: var(--dm-blue-500); font-weight:600; text-decoration:underline; text-underline-offset:3px; }
.link-inline:hover { color: var(--dm-red-500); }

/* ============================================================
   FORNECEDORES
   ============================================================ */
.partners { border-block:1px solid var(--dm-border); }
.partners__grid { display:grid; gap:20px; grid-template-columns: repeat(2,1fr); align-items:center; margin-top:32px; }
@media (min-width: 640px){ .partners__grid { grid-template-columns: repeat(3,1fr); } }
@media (min-width: 960px){ .partners__grid { grid-template-columns: repeat(6,1fr); } }
.partners__grid .ph { aspect-ratio: 5/3; border-radius: var(--dm-radius-md);
  transition: transform var(--dm-duration-base) var(--dm-ease-out),
              border-color var(--dm-duration-base) var(--dm-ease-standard),
              box-shadow var(--dm-duration-base) var(--dm-ease-standard); }
.partners__grid .ph:hover { transform: translateY(-3px); box-shadow: var(--dm-shadow-md); }

/* Logos: o cartão branco continua mesmo com imagem (ao contrário das fotos),
   e a marca é CONTIDA, nunca cortada. */
.ph--logo, .ph--logo:has(img), .ph--logo.has-image {
  background: #fff; border: 1px solid var(--dm-border); background-image:none; }
.ph--logo img { object-fit: contain; padding: 16px 22px;
  filter: grayscale(1); opacity:.62;
  transition: filter var(--dm-duration-base) var(--dm-ease-standard),
              opacity var(--dm-duration-base) var(--dm-ease-standard); }
.ph--logo:hover img { filter: none; opacity:1; }

/* ============================================================
   TRABALHE CONOSCO
   ============================================================ */
.careers { position:relative; background: var(--dm-gradient-digital); color:#fff; overflow:hidden; }
.careers > .container { position:relative; z-index:2; }
.careers__grid { display:grid; gap:32px; align-items:center; }
@media (min-width: 900px){ .careers__grid { grid-template-columns: 1.2fr auto; } }
.careers h2 { color:#fff; }
.careers p { color: rgba(255,255,255,.85); margin:0; }
.careers__actions { display:flex; gap:12px; flex-wrap:wrap; }

/* ============================================================
   NEWSLETTER
   ============================================================ */
.newsletter { background: var(--dm-neutral-50); }
.newsletter__box { background:#fff; border:1px solid var(--dm-border); border-radius: var(--dm-radius-xl);
  padding: clamp(28px, 4vw, 48px); display:grid; gap:28px; align-items:center; box-shadow: var(--dm-shadow-sm); }
@media (min-width: 960px){ .newsletter__box { grid-template-columns: 1fr 1.1fr; } }
.newsletter h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); }
.newsletter p { color: var(--dm-text-muted); margin:0; }
.newsletter form { display:grid; gap:12px; }
@media (min-width: 620px){ .newsletter form { grid-template-columns: 1fr 1fr; } .newsletter form .btn { grid-column: span 2; } }
.newsletter .field input, .newsletter .field select { border:1.5px solid var(--dm-border); }
.newsletter__legal { font-size:12px; color: var(--dm-neutral-400); grid-column: 1/-1; margin:0; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer { background: var(--dm-blue-700); color: rgba(255,255,255,.72); font-size: var(--dm-text-sm); }
.footer__top { padding-block: clamp(44px, 6vw, 72px); display:grid; gap:36px; }
@media (min-width: 780px){ .footer__top { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1040px){ .footer__top { grid-template-columns: 1.5fr 1fr 1fr 1.2fr; } }
.footer h4 { color:#fff; font-size:14px; letter-spacing:.06em; text-transform:uppercase; margin-bottom:18px; }
.footer__brand img { width:200px; margin-bottom:18px; }
.footer__brand p { max-width: 38ch; }
.footer ul { display:grid; gap:11px; }
.footer a { transition: color var(--dm-duration-fast) var(--dm-ease-standard); }
.footer a:hover { color:#fff; }
.footer__contact li { display:flex; gap:10px; align-items:flex-start; }
.footer__contact svg { width:17px; height:17px; flex:none; margin-top:2px; color: var(--dm-red-400); }
.socials { display:flex; gap:10px; margin-top:20px; }
.socials a { width:40px; height:40px; border-radius:50%; background: rgba(255,255,255,.10);
  display:flex; align-items:center; justify-content:center; color:#fff;
  transition: background var(--dm-duration-fast) var(--dm-ease-standard); }
.socials a:hover { background: var(--dm-red-500); }
.socials svg { width:18px; height:18px; }
/* variante para fundo claro (cards da página Trabalhe Conosco) */
.socials--escuro a { background: var(--dm-blue-50, #EEF0FA); color: var(--dm-blue-500); }
.socials--escuro a:hover { background: var(--dm-red-500); color:#fff; }
.footer__slogan { color:#fff; font-weight:700; font-size: var(--dm-text-lg); margin:0 0 6px; }
.footer__brand a { color:#fff; text-decoration:underline; text-underline-offset:3px; }
.footer__brand a:hover { color: var(--dm-red-300); }
/* formas de pagamento */
.footer__pay { border-top:1px solid rgba(255,255,255,.12); padding-block:28px; display:flex; flex-wrap:wrap; gap:28px 56px; }
.footer__pay h4 { margin-bottom:12px; }
.pay { display:flex !important; flex-wrap:wrap; gap:8px !important; }
.pay li { display:flex; align-items:center; justify-content:center; height:32px; min-width:50px; padding:0 9px;
  border-radius:6px; background:#fff; }
.pay li img { height:20px; width:auto; max-width:44px; display:block; }
.pay li img.pay__quadrado { height:18px; }
.pay__txt { color: var(--dm-blue-700); font-size:12px; font-weight:800; letter-spacing:.02em; }
.footer__bottom { border-top:1px solid rgba(255,255,255,.12); padding-block:22px;
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:13px; }
.footer__bottom ul { display:flex; gap:20px; }

/* ============================================================
   DOCK MOBILE + WHATSAPP
   ============================================================ */
.dock { position:fixed; left:0; right:0; bottom:0; z-index:90; display:none;
  background: rgba(0,19,132,.70);
  -webkit-backdrop-filter: blur(28px) saturate(1.9); backdrop-filter: blur(28px) saturate(1.9);
  box-shadow: 0 -6px 20px rgba(0,6,41,.25), inset 0 1px 0 rgba(255,255,255,.14); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .dock { background: var(--dm-blue-500); }
}
.dock ul { display:grid; grid-template-columns: repeat(3,1fr); }
.dock a { display:flex; flex-direction:column; align-items:center; gap:5px; padding:11px 6px;
  color:#fff; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  transition: background var(--dm-duration-fast) var(--dm-ease-standard); }
.dock a:active { background: var(--dm-blue-700); }
.dock a + a, .dock li + li { border-left:1px solid rgba(255,255,255,.14); }
.dock svg { width:21px; height:21px; }
@media (max-width: 760px){
  .dock { display:block; }
  /* O respiro do dock fica DENTRO do rodapé: assim a cor do rodapé chega
     até o fim da página, em vez de sobrar uma faixa branca do body. */
  .footer { padding-bottom:66px; }
}
.whats { position:fixed; right:18px; bottom:18px; z-index:95; width:56px; height:56px; border-radius:50%;
  background:#25D366; color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow: 0 8px 24px rgba(0,0,0,.22); transition: transform var(--dm-duration-fast) var(--dm-ease-out); }
.whats:hover { transform: scale(1.06); }
.whats svg { width:30px; height:30px; }
@media (max-width: 760px){ .whats { bottom: 80px; } }


/* ============================================================
   PÁGINAS INTERNAS — banner, busca, resultados
   ============================================================ */
.page-hero { position:relative; background: var(--dm-blue-500); overflow:hidden;
  display:flex; align-items:flex-end; min-height: clamp(260px, 34vw, 400px); }
.page-hero__media { position:absolute; inset:0; z-index:0; }
.page-hero__media .ph { width:100%; height:100%; border-radius:0; }
.page-hero__media img { object-position: center 35%; }
.page-hero::after { content:""; position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(90deg, rgba(0,19,132,.94) 0%, rgba(0,19,132,.82) 42%, rgba(0,19,132,.42) 100%),
    linear-gradient(0deg, rgba(0,6,41,.55) 0%, rgba(0,6,41,0) 60%); }
.hero--unico .hero__nav, .hero--unico .hero__dots { display:none; }
/* banner de marca — sem foto (gradiente + grafismo) */
.page-hero--marca { background: var(--dm-gradient-digital); }
.page-hero--marca::before { content:""; position:absolute; inset:0; z-index:1;
  background-image: url("../img/patterns/pattern-azul-sutil.svg?v=2"); background-size:420px; opacity:.6; }
.page-hero--marca::after { background: linear-gradient(0deg, rgba(0,6,41,.45) 0%, rgba(0,6,41,0) 65%); }
.page-hero__content { position:relative; z-index:2; color:#fff; padding-block: 40px 44px; }
.page-hero h1 { color:#fff; font-size: clamp(2rem, 4vw, 3rem); font-weight:800; margin:0 0 12px; }
.page-hero p { color: rgba(255,255,255,.86); max-width: 60ch; margin:0; font-size: var(--dm-text-lg); }

.crumbs { font-size: var(--dm-text-sm); color: rgba(255,255,255,.72); margin-bottom:14px;
  display:flex; gap:8px; align-items:center; }
.crumbs a { color:#fff; text-decoration:underline; text-underline-offset:3px;
  transition: color var(--dm-duration-fast) var(--dm-ease-standard); }
.crumbs a:hover { color: var(--dm-red-300); }

/* barra de busca — encosta no banner */
.finder-bar { position:relative; z-index:5; padding-block: 24px 8px; background:#fff; }
.finder--light { background:#fff; border:1px solid var(--dm-border); box-shadow: var(--dm-shadow-md);
  -webkit-backdrop-filter:none; backdrop-filter:none; margin-top:-52px; }
.finder--light .field input, .finder--light .field select {
  background: var(--dm-neutral-50); border:1.5px solid transparent; }
.finder--light .field input:focus, .finder--light .field select:focus { background:#fff; border-color: var(--dm-blue-500); }

/* chips de cidade */
.chips-wrap { position:relative; margin-top:20px; }
.chips { display:flex; gap:10px; flex-wrap:wrap; }

/* no mobile os chips viram uma trilha que desliza para o lado */
@media (max-width: 760px){
  .chips { flex-wrap:nowrap; overflow-x:auto;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
    margin-inline:-20px; padding-inline:20px; }
  .chips::-webkit-scrollbar { display:none; }
  .chip { flex:none; }

  /* véus nas duas bordas, indicando que há mais para cada lado */
  .chips-wrap::before, .chips-wrap::after { content:""; position:absolute; top:0; width:56px; height:100%;
    pointer-events:none; z-index:1;
    transition: opacity var(--dm-duration-base) var(--dm-ease-standard); }
  .chips-wrap::before { left:-20px; background: linear-gradient(270deg, rgba(255,255,255,0) 0%, #fff 65%); }
  .chips-wrap::after  { right:-20px; background: linear-gradient(90deg,  rgba(255,255,255,0) 0%, #fff 65%); }
  .chips-wrap.no-inicio::before { opacity:0; }
  .chips-wrap.no-fim::after { opacity:0; }

  .chips-seta { position:absolute; top:50%; transform:translateY(-50%);
    width:34px; height:34px; border-radius:50%; border:1.5px solid var(--dm-border);
    background:#fff; color: var(--dm-blue-500); display:flex; align-items:center; justify-content:center;
    box-shadow: var(--dm-shadow-sm); z-index:2;
    transition: opacity var(--dm-duration-base) var(--dm-ease-standard); }
  .chips-seta svg { width:16px; height:16px; }
  .chips-seta--prev { left:-8px; }
  .chips-seta--next { right:-8px; }
  .chips-wrap.no-inicio .chips-seta--prev { opacity:0; pointer-events:none; }
  .chips-wrap.no-fim .chips-seta--next { opacity:0; pointer-events:none; }
}
@media (min-width: 761px){ .chips-seta { display:none; } }
.chip { padding:9px 18px; border-radius: var(--dm-radius-pill); border:1.5px solid var(--dm-border);
  background:#fff; color: var(--dm-blue-500); font-size: var(--dm-text-sm); font-weight:600;
  transition: background var(--dm-duration-fast) var(--dm-ease-standard),
              color var(--dm-duration-fast) var(--dm-ease-standard),
              border-color var(--dm-duration-fast) var(--dm-ease-standard); }
.chip:hover { border-color: var(--dm-blue-500); }
.chip.is-active { background: var(--dm-blue-500); border-color: var(--dm-blue-500); color:#fff; }

.resultado-contagem { font-size: var(--dm-text-sm); color: var(--dm-text-muted); margin-bottom:20px; }
.resultado-contagem strong { color: var(--dm-blue-500); }

/* na página de lojas o grid fica sobre fundo claro */
.stores__grid--light .store-card { box-shadow: var(--dm-shadow-sm); border:1px solid var(--dm-border); }
.stores__grid--light .store-card:hover { box-shadow: var(--dm-shadow-lg); }
.store-card[hidden] { display:none; }

/* estado vazio */
.vazio { text-align:center; padding: 56px 20px; border:1px dashed var(--dm-border);
  border-radius: var(--dm-radius-lg); background: var(--dm-neutral-50); }
.vazio svg { width:40px; height:40px; color: var(--dm-neutral-300); margin-bottom:12px; }
.vazio h3 { margin:0 0 6px; font-size: var(--dm-text-xl); }
.vazio p { color: var(--dm-text-muted); }

/* CTA do mapa */
.cta-mapa { display:grid; gap:24px; align-items:center; padding: clamp(28px,4vw,44px);
  border-radius: var(--dm-radius-xl); background: var(--dm-gradient-digital); color:#fff; }
@media (min-width: 860px){ .cta-mapa { grid-template-columns: 1fr auto; } }
.cta-mapa h2 { color:#fff; font-size: clamp(1.5rem,2.6vw,2rem); margin:0 0 8px; }
.cta-mapa p { color: rgba(255,255,255,.84); margin:0; max-width: 52ch; }

@media (max-width: 860px){
  .finder--light { margin-top:-28px; }
}


/* ============================================================
   PÁGINA DA LOJA
   ============================================================ */
.status--hero { margin-top:14px; padding:9px 16px; border-radius: var(--dm-radius-pill);
  background: var(--dm-glass-tint); border:1px solid var(--dm-glass-border-dark);
  -webkit-backdrop-filter: var(--dm-glass-blur); backdrop-filter: var(--dm-glass-blur); color:#fff; }
.status--hero.is-open { color:#fff; }
.status--hero.is-open .status__dot { background:#4ADE80; box-shadow:0 0 0 4px rgba(74,222,128,.2); }
.status--hero.is-closed { color:#fff; }
.status--hero.is-closed .status__dot { background: var(--dm-red-300); box-shadow:0 0 0 4px rgba(255,31,31,.2); }

/* mapa */
.mapa { border-radius: var(--dm-radius-lg); overflow:hidden; border:1px solid var(--dm-border);
  background: var(--dm-neutral-100); aspect-ratio: 16/10; }
.mapa iframe { width:100%; height:100%; border:0; display:block; }

.rota { display:grid; gap:12px; margin-top:16px; }
@media (min-width: 620px){ .rota { grid-template-columns: 1fr auto; } }
.rota .field input { border:1.5px solid var(--dm-border); }


/* ---------- topo da loja: mosaico + painel ---------- */
.loja-topo { padding-block: 28px 8px; }
.crumbs--claro { color: var(--dm-text-muted); }
.crumbs--claro a { color: var(--dm-blue-500); }
.crumbs--claro a:hover { color: var(--dm-red-500); }

.loja-topo__grid { display:grid; gap: clamp(20px,3vw,32px); margin-top:8px;
  --loja-topo-altura: clamp(300px, 34vw, 420px); }
@media (min-width: 980px){ .loja-topo__grid { grid-template-columns: 1.5fr 1fr; align-items:stretch; } }
@media (max-width: 979px){ .loja-topo__grid { --loja-topo-altura: clamp(240px, 52vw, 340px); } }

/* altura fixa: o mosaico e o painel azul ficam exatamente do mesmo tamanho */
.mosaico { display:grid; gap:10px; grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr;
  height: var(--loja-topo-altura); }
.mosaico__item { padding:0; border:0; background:none; cursor:zoom-in; position:relative;
  overflow:hidden; min-height:0; border-radius: var(--dm-radius-lg);
  transition: opacity var(--dm-duration-base) var(--dm-ease-standard); }
.mosaico__item:hover { opacity:.92; }
.mosaico__item .ph { width:100%; height:100%; border-radius: var(--dm-radius-lg); }
.mosaico__item--grande { grid-row: span 2; }
.mosaico__oculto { display:none; }
.mosaico__mais { position:absolute; inset:0; z-index:3; border-radius: var(--dm-radius-lg);
  display:flex; align-items:center; justify-content:center;
  background: rgba(0,12,82,.55); color:#fff; font-weight:700; font-size: var(--dm-text-sm);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
  transition: background var(--dm-duration-base) var(--dm-ease-standard); }
.mosaico__item:hover .mosaico__mais { background: rgba(0,12,82,.68); }

.loja-painel { background: var(--dm-gradient-digital); color:#fff; border-radius: var(--dm-radius-lg);
  padding: clamp(22px,2.6vw,32px); display:flex; flex-direction:column; gap:12px; justify-content:center;
  min-height: var(--loja-topo-altura); }
.loja-painel__cidade { display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; color: rgba(255,255,255,.82); }
.loja-painel__cidade svg { width:15px; height:15px; }
.loja-painel h1 { color:#fff; font-size: clamp(1.6rem,2.6vw,2.125rem); margin:0; }
.loja-painel .status { color:#fff; }
.loja-painel .status.is-open .status__dot { background:#4ADE80; box-shadow:0 0 0 4px rgba(74,222,128,.2); }
.loja-painel .status.is-closed .status__dot { background: var(--dm-red-300); box-shadow:0 0 0 4px rgba(255,31,31,.2); }
.loja-painel__end { color: rgba(255,255,255,.86); margin:0; line-height:1.6; }
.loja-painel__acoes { display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; }
.loja-painel__acoes .btn--outline { border-color: rgba(255,255,255,.5); color:#fff; }
.loja-painel__acoes .btn--outline:hover { background:#fff; color: var(--dm-blue-500); border-color:#fff; }
.btn--whats:hover { background:#25D366 !important; border-color:#25D366 !important; color:#fff !important; }

/* ---------- dois blocos lado a lado ---------- */
/* minmax(0,1fr) e min-width:0 — sem isso a coluna do grid não encolhe abaixo
   do conteúdo mais largo (um e-mail longo, um botão) e empurra a página para
   fora da tela em aparelhos estreitos. */
.loja-dupla { display:grid; grid-template-columns: minmax(0,1fr); gap: clamp(24px,3vw,40px); align-items:start; }
.loja-dupla > * { min-width:0; }
.loja-dupla--igual { align-items:stretch; }
@media (min-width: 900px){ .loja-dupla { grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }
@media (min-width: 900px){ .loja-dupla--desigual { grid-template-columns: minmax(0,1.6fr) minmax(0,1fr); } }

/* e-mails e URLs longos quebram em vez de esticar o card */
.canais a, .footer__contact a { overflow-wrap:anywhere; }
.bloco h2 { display:flex; align-items:center; gap:10px; font-size: var(--dm-text-2xl); margin-bottom:18px; }
.bloco h2 svg { width:22px; height:22px; color: var(--dm-red-500); }

/* tabela de horários */
.horarios { border:1px solid var(--dm-border); border-radius: var(--dm-radius-md); overflow:hidden; }
.horarios table { width:100%; border-collapse:collapse; font-size: var(--dm-text-sm); }
.horarios td { padding:13px 18px; border-bottom:1px solid var(--dm-neutral-100); color: var(--dm-neutral-600); }
.horarios tr:last-child td { border-bottom:0; }
.horarios td:last-child { text-align:right; font-weight:600; color: var(--dm-text); }
.horarios tr.is-today { background: rgba(0,19,132,.05); }
.horarios tr.is-today td { color: var(--dm-blue-500); font-weight:700; }
.horarios tr.is-today td:first-child::before { content:"• "; color: var(--dm-red-500); }
.horarios .fechado { color: var(--dm-neutral-400) !important; font-weight:500 !important; }
.aviso { position:relative; padding-left:26px; font-size: var(--dm-text-sm);
  color: var(--dm-text-muted); margin-top:14px; line-height:1.6; }
.aviso svg { position:absolute; left:0; top:3px; width:16px; height:16px; color: var(--dm-red-500); }
.aviso__acao { margin-top:12px; }
/* variação centralizada: o ícone volta a ser inline */
.aviso--centro { text-align:center; padding-left:0; }
.aviso--centro svg { position:static; display:inline-block; vertical-align:-3px; margin-right:7px; }
.aviso a { color: var(--dm-blue-500); font-weight:600; text-decoration:underline; text-underline-offset:3px; }

/* comodidades */
.comodidades { display:grid; gap:14px; grid-template-columns: 1fr; }
@media (min-width: 620px){ .comodidades { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1000px){ .comodidades { grid-template-columns: repeat(3,1fr); } }
.comodidade { display:flex; gap:14px; align-items:flex-start; background:#fff;
  border:1px solid var(--dm-border); border-radius: var(--dm-radius-md); padding:18px;
  transition: transform var(--dm-duration-base) var(--dm-ease-standard),
              box-shadow var(--dm-duration-base) var(--dm-ease-standard); }
.comodidade:hover { transform: translateY(-3px); box-shadow: var(--dm-shadow-md); }
.comodidade > span { width:42px; height:42px; flex:none; border-radius: var(--dm-radius-sm);
  display:flex; align-items:center; justify-content:center;
  background: rgba(0,19,132,.07); color: var(--dm-blue-500); }
.comodidade svg { width:21px; height:21px; }
.comodidade strong { display:block; color: var(--dm-blue-500); margin-bottom:2px; }
.comodidade p { margin:0; font-size: var(--dm-text-sm); color: var(--dm-text-muted); }

/* capa clicável, que abre o folheador */
.capa-jornal { display:block; width:100%; padding:0; border:0; background:none; cursor:zoom-in;
  transition: transform var(--dm-duration-base) var(--dm-ease-out); }
.capa-jornal:hover { transform: translateY(-4px); }

/* variação menor da capa do encarte (página da loja) */
.offers__media--menor .ph { max-width: 340px; }

/* galeria */

/* oferta da loja */
.oferta-loja { display:grid; gap:24px; align-items:center; margin-top:20px; }
@media (min-width: 620px){ .oferta-loja { grid-template-columns: 220px 1fr; } }
.oferta-loja .ph { aspect-ratio: 3/4; border-radius: var(--dm-radius-md); }

/* coluna de informações */
.info-card { background:#fff; border:1px solid var(--dm-border); border-radius: var(--dm-radius-lg);
  padding: clamp(20px,3vw,28px); box-shadow: var(--dm-shadow-sm); }
.info-card h2 { font-size: var(--dm-text-xl); margin-bottom:20px; }

/* lightbox */
.lightbox { position:fixed; inset:0; z-index:300; display:flex; align-items:center; justify-content:center;
  background: rgba(0,6,41,.92); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); padding:24px; }
.lightbox[hidden] { display:none; }
.lightbox img { max-width:min(1100px,92vw); max-height:86vh; border-radius: var(--dm-radius-md);
  box-shadow: 0 30px 80px rgba(0,0,0,.5); }
.lightbox__fechar, .lightbox__nav { position:absolute; width:48px; height:48px; border-radius:50%;
  border:1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.12); color:#fff;
  display:flex; align-items:center; justify-content:center;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  transition: background var(--dm-duration-fast) var(--dm-ease-standard); }
.lightbox__fechar:hover, .lightbox__nav:hover { background: rgba(255,255,255,.26); }
.lightbox__fechar { top:24px; right:24px; }
.lightbox__fechar svg, .lightbox__nav svg { width:22px; height:22px; }
.lightbox__nav--prev { left:24px; }
.lightbox__nav--next { right:24px; }
@media (max-width: 620px){
  .lightbox__nav { bottom:24px; top:auto; }
  .lightbox__nav--prev { left:calc(50% - 60px); }
  .lightbox__nav--next { right:calc(50% - 60px); }
}


/* ============================================================
   PÁGINA DE OFERTAS
   ============================================================ */
@media (min-width: 860px){
  .finder--dois { grid-template-columns: 1fr 1fr auto; }
  /* busca com um campo só: o botão ocupa apenas o que precisa */
  .finder--simples { grid-template-columns: 1fr auto; }
}

.jornais { display:grid; gap:20px; grid-template-columns: 1fr; }
@media (min-width: 620px){ .jornais { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1000px){ .jornais { grid-template-columns: repeat(3,1fr); } }
.jornal[hidden] { display:none; }

.jornal { background:#fff; border:1px solid var(--dm-border); border-radius: var(--dm-radius-lg);
  overflow:hidden; display:flex; flex-direction:column;
  transition: transform var(--dm-duration-base) var(--dm-ease-standard),
              box-shadow var(--dm-duration-base) var(--dm-ease-standard); }
.jornal:hover { transform: translateY(-4px); box-shadow: var(--dm-shadow-lg); }
/* a capa ocupa o card inteiro — sem moldura nem sobra dos lados */
.jornal__capa { position:relative; }
.jornal__capa .ph { aspect-ratio: 4/3; border-radius:0; }
.jornal__novo { position:absolute; top:14px; right:14px; z-index:2;
  background: var(--dm-red-500); color:#fff; padding:5px 12px; border-radius: var(--dm-radius-pill);
  font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.jornal__corpo { padding:20px 20px 0; flex:1; }
.jornal__tipo { display:inline-block; font-size:11px; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; color: var(--dm-red-500); margin-bottom:6px; }
.jornal__corpo h3 { font-size: var(--dm-text-lg); margin:0 0 10px; }
.jornal__cidade, .jornal__vigencia { display:flex; align-items:center; gap:8px; margin:0 0 6px;
  font-size: var(--dm-text-sm); color: var(--dm-text-muted); }
.jornal__cidade svg, .jornal__vigencia svg { width:15px; height:15px; flex:none; color: var(--dm-neutral-400); }
.jornal__acoes { display:flex; gap:10px; padding:18px 20px 20px; }
.jornal__acoes .btn:first-child { flex:1; }

/* passos */
.passos { display:grid; gap:16px; grid-template-columns: 1fr; counter-reset: passo; }
@media (min-width: 800px){ .passos { grid-template-columns: repeat(3,1fr); } }
.passo { display:flex; gap:16px; align-items:flex-start; background:#fff;
  border:1px solid var(--dm-border); border-radius: var(--dm-radius-lg); padding:22px; }
.passo__n { width:38px; height:38px; flex:none; border-radius:50%;
  background: var(--dm-gradient-digital); color:#fff; font-weight:800;
  display:flex; align-items:center; justify-content:center; }
.passo strong { display:block; color: var(--dm-blue-500); margin-bottom:4px; }
.passo p { margin:0; font-size: var(--dm-text-sm); color: var(--dm-text-muted); }


/* ---------- Visor do jornal (demonstração do flip page) ---------- */
.visor { position:fixed; inset:0; z-index:300; display:flex; flex-direction:column;
  background: rgba(0,6,41,.94);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); color:#fff; }
.visor[hidden] { display:none; }

.visor__topo { display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:16px clamp(16px,3vw,28px); border-bottom:1px solid rgba(255,255,255,.14); }
.visor__topo strong { display:block; font-size: var(--dm-text-lg); }
.visor__topo span { font-size: var(--dm-text-sm); color: rgba(255,255,255,.7); }
.visor__ferramentas { display:flex; align-items:center; gap:12px; }
.visor__fechar { width:44px; height:44px; border-radius:50%; border:1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.12); color:#fff; display:flex; align-items:center; justify-content:center;
  transition: background var(--dm-duration-fast) var(--dm-ease-standard); }
.visor__fechar:hover { background: rgba(255,255,255,.26); }
.visor__fechar svg { width:20px; height:20px; }

.visor__palco { flex:1; min-height:0; display:flex; align-items:center; justify-content:center;
  gap: clamp(8px,1.5vw,20px); padding: clamp(12px,2vw,24px); }
.visor__area { position:relative; flex:1; height:100%; display:flex; align-items:center; justify-content:center; }

/* folheador (StPageFlip) */
.flipbook { margin-inline:auto; visibility:hidden;
  transition: transform 380ms var(--dm-ease-standard); }
.flipbook.is-pronto { visibility:visible; }
/* Quando só uma página aparece (capa ou contracapa), ela ocupa metade do
   bloco de duas páginas — deslocar um quarto da largura recentraliza. */
.flipbook.so-direita { transform: translateX(-25%); }
.flipbook.so-esquerda { transform: translateX(25%); }
.flipbook .pagina { background:#fff; overflow:hidden; }
.flipbook .pagina img { width:100%; height:100%; object-fit:contain; display:block; }
.stf__parent { margin-inline:auto; }
.stf__item { box-shadow: 0 12px 40px rgba(0,0,0,.45); }

.visor__carregando { position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:14px; color: rgba(255,255,255,.8);
  font-size: var(--dm-text-sm); }
.visor__carregando[hidden] { display:none; }
.visor__spinner { width:34px; height:34px; border-radius:50%;
  border:3px solid rgba(255,255,255,.22); border-top-color:#fff;
  animation: girar 800ms linear infinite; }
@keyframes girar { to { transform: rotate(360deg); } }

.visor__nav { width:52px; height:52px; flex:none; border-radius:50%;
  border:1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.12); color:#fff;
  display:flex; align-items:center; justify-content:center;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  transition: background var(--dm-duration-fast) var(--dm-ease-standard), opacity var(--dm-duration-fast); }
.visor__nav:hover { background: rgba(255,255,255,.26); }
.visor__nav[disabled] { opacity:.25; pointer-events:none; }
.visor__nav svg { width:22px; height:22px; }

.visor__rodape { display:flex; align-items:center; justify-content:center; gap:18px; flex-wrap:wrap;
  padding:14px clamp(16px,3vw,28px) 20px; border-top:1px solid rgba(255,255,255,.14); }
.visor__contador { font-size: var(--dm-text-sm); color: rgba(255,255,255,.75); font-variant-numeric: tabular-nums; }
.visor__miniaturas { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; max-width:100%; }
.visor__miniaturas::-webkit-scrollbar { display:none; }
.visor__miniaturas button { width:44px; height:58px; flex:none; padding:0; border-radius:6px;
  border:2px solid transparent; overflow:hidden; background:#fff; opacity:.5;
  transition: opacity var(--dm-duration-fast) var(--dm-ease-standard), border-color var(--dm-duration-fast); }
.visor__miniaturas button img { width:100%; height:100%; object-fit:cover; }
.visor__miniaturas button.is-active { opacity:1; border-color: var(--dm-red-500); }
.visor__miniaturas button:hover { opacity:.85; }

@media (max-width: 620px){
  .visor__nav { width:44px; height:44px; }
  .visor__ferramentas .btn { display:none; }
}


/* ============================================================
   NOTÍCIAS — listagem e artigo
   ============================================================ */
.post__media { display:block; position:relative; }
.post h3 a { color:inherit; }
.post[hidden] { display:none; }

/* paginação */
.paginacao { display:flex; gap:8px; justify-content:center; margin-top:40px; }
.paginacao__item { min-width:42px; height:42px; padding:0 12px; border-radius: var(--dm-radius-sm);
  border:1.5px solid var(--dm-border); background:#fff; color: var(--dm-blue-500);
  font-weight:600; display:flex; align-items:center; justify-content:center;
  transition: background var(--dm-duration-fast) var(--dm-ease-standard),
              border-color var(--dm-duration-fast) var(--dm-ease-standard),
              color var(--dm-duration-fast) var(--dm-ease-standard); }
.paginacao__item svg { width:16px; height:16px; }
.paginacao__item:hover:not([disabled]) { border-color: var(--dm-blue-500); }
.paginacao__item.is-active { background: var(--dm-blue-500); border-color: var(--dm-blue-500); color:#fff; }
.paginacao__item[disabled] { opacity:.4; pointer-events:none; }

/* ---- artigo ---- */
.artigo__topo { padding-top: 28px; }
.artigo__cabecalho { max-width: 820px; }
.artigo__cabecalho h1 { font-size: clamp(1.875rem, 4vw, 3rem); margin:14px 0 16px; }
.artigo__resumo { font-size: var(--dm-text-lg); color: var(--dm-text-muted); line-height: var(--dm-lh-relaxed); }
.artigo__meta { display:flex; align-items:center; gap:20px; flex-wrap:wrap;
  padding: 16px 0 24px; border-bottom:1px solid var(--dm-border); font-size: var(--dm-text-sm);
  color: var(--dm-text-muted); }
.artigo__meta > span { display:inline-flex; align-items:center; gap:7px; }
.artigo__meta svg { width:15px; height:15px; }
.artigo__share { display:flex; align-items:center; gap:8px; margin-left:auto; }
.artigo__share a, .artigo__share button { width:36px; height:36px; border-radius:50%;
  border:1px solid var(--dm-border); background:#fff; color: var(--dm-blue-500);
  display:flex; align-items:center; justify-content:center;
  transition: background var(--dm-duration-fast) var(--dm-ease-standard),
              color var(--dm-duration-fast) var(--dm-ease-standard); }
.artigo__share a:hover, .artigo__share button:hover { background: var(--dm-blue-500); color:#fff; }
.artigo__share svg { width:16px; height:16px; }

.artigo__capa { margin: 28px 0 0; }
.artigo__capa .ph, .artigo__figura .ph { aspect-ratio: 16/9; border-radius: var(--dm-radius-lg); }
.artigo__capa figcaption, .artigo__figura figcaption { margin-top:10px; font-size: var(--dm-text-sm);
  color: var(--dm-text-muted); }
.artigo__figura { margin: 32px 0; }

.artigo__conteudo { display:grid; gap: clamp(32px,4vw,56px); padding-block: clamp(32px,4vw,48px); }
@media (min-width: 980px){ .artigo__conteudo { grid-template-columns: minmax(0,1fr) 340px; align-items:start; } }
.artigo__texto { max-width: 70ch; font-size: 1.0625rem; line-height: 1.75; }
.artigo__texto h2 { font-size: clamp(1.375rem,2.4vw,1.75rem); margin: 36px 0 14px; }
.artigo__texto ul { margin: 0 0 var(--dm-space-4); padding-left: 22px; list-style: disc; }
.artigo__texto li { margin-bottom:8px; }
.artigo__texto blockquote { margin: 32px 0; padding: 22px 26px; border-left:4px solid var(--dm-red-500);
  background: var(--dm-neutral-50); border-radius: 0 var(--dm-radius-md) var(--dm-radius-md) 0; }
.artigo__texto blockquote p { font-size: var(--dm-text-lg); font-style:italic; color: var(--dm-blue-500); margin-bottom:10px; }
.artigo__texto cite { font-style:normal; font-size: var(--dm-text-sm); color: var(--dm-text-muted); font-weight:600; }

.artigo__lateral { display:grid; gap:24px; align-content:start; }
@media (min-width: 980px){ .artigo__lateral { position:sticky; top:110px; } }
.info-card--brand { background: var(--dm-gradient-digital); color:#fff; border-color:transparent; }
.info-card--brand h2 { color:#fff; }
.info-card--brand p { color: rgba(255,255,255,.84); font-size: var(--dm-text-sm); }

.lista-links { display:grid; gap:2px; }
.lista-links a { display:block; padding:14px 0; border-top:1px solid var(--dm-neutral-100);
  font-weight:600; color: var(--dm-blue-500); line-height:1.4;
  transition: color var(--dm-duration-fast) var(--dm-ease-standard); }
.lista-links li:first-child a { border-top:0; padding-top:0; }
.lista-links a:hover { color: var(--dm-red-500); }
.lista-links__cat { display:block; font-size:11px; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; color: var(--dm-red-500); margin-bottom:4px; }


/* ============================================================
   PÁGINAS INSTITUCIONAIS E DE CONTATO
   ============================================================ */

/* ---- formulário ---- */
.contato__grid { display:grid; gap: clamp(28px,4vw,48px); align-items:start; }
@media (min-width: 980px){ .contato__grid { grid-template-columns: minmax(0,1fr) 360px; } }
.contato__lateral { display:grid; gap:24px; align-content:start; }
@media (min-width: 980px){ .contato__lateral { position:sticky; top:110px; } }

.formulario { display:grid; gap:18px; margin-top:26px; max-width: 640px; }
.formulario__linha { display:grid; gap:18px; }
@media (min-width: 620px){ .formulario__linha { grid-template-columns: 1fr 1fr; } }
.campo { display:grid; gap:7px; }
.campo label { font-size: var(--dm-text-sm); font-weight:600; color: var(--dm-neutral-700); }
.campo label span { color: var(--dm-red-500); }
.campo input, .campo select, .campo textarea {
  font: inherit; color: var(--dm-text); background:#fff; width:100%;
  padding:13px 16px; border:1.5px solid var(--dm-border); border-radius: var(--dm-radius-md);
  transition: border-color var(--dm-duration-fast) var(--dm-ease-standard),
              box-shadow var(--dm-duration-fast) var(--dm-ease-standard); }
.campo textarea { resize:vertical; min-height:130px; }
/* seta própria no select: a nativa cola na borda e muda de navegador para navegador */
.campo select {
  -webkit-appearance:none; appearance:none; padding-right:46px; cursor:pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23666D7C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 4 4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position: right 18px center; background-size:13px; }
.campo select::-ms-expand { display:none; }
.campo input:focus, .campo select:focus, .campo textarea:focus {
  outline:none; border-color: var(--dm-blue-500); box-shadow: 0 0 0 3px rgba(0,37,245,.18); }
.campo.tem-erro input, .campo.tem-erro select, .campo.tem-erro textarea { border-color: var(--dm-error); }
.campo__erro { font-size: var(--dm-text-xs); color: var(--dm-error); min-height:0; }
.campo__erro:empty { display:none; }
.campo__ajuda { font-size: var(--dm-text-xs); color: var(--dm-text-muted); justify-self:end; }
.campo__checkbox { display:flex; gap:11px; align-items:flex-start; font-size: var(--dm-text-sm);
  color: var(--dm-neutral-600); line-height:1.5; }
.campo__checkbox input { width:19px; height:19px; flex:none; margin-top:2px; accent-color: var(--dm-blue-500); }
.campo__checkbox a { color: var(--dm-blue-500); font-weight:600; text-decoration:underline; text-underline-offset:3px; }
.formulario__aviso { padding:14px 18px; border-radius: var(--dm-radius-md); margin:0;
  background: rgba(15,138,77,.10); color: var(--dm-success); font-weight:600; font-size: var(--dm-text-sm); }
.formulario__aviso[hidden] { display:none; }

/* canais de contato */
.canais { display:grid; gap:18px; }
.canais li { display:flex; gap:14px; align-items:flex-start; }
.canais > li > span { width:40px; height:40px; flex:none; border-radius: var(--dm-radius-sm);
  display:flex; align-items:center; justify-content:center;
  background: rgba(0,19,132,.07); color: var(--dm-blue-500); }
.canais svg { width:19px; height:19px; }
.canais strong { display:block; font-size:12px; letter-spacing:.05em; text-transform:uppercase;
  color: var(--dm-neutral-500); margin-bottom:3px; }
.canais a { display:block; font-weight:700; color: var(--dm-blue-500); }
.canais a:hover { color: var(--dm-red-500); }
.canais small { display:block; font-size: var(--dm-text-xs); color: var(--dm-text-muted); margin-top:2px; }
.info-card--brand .canais > li > span { background: rgba(255,255,255,.16); color:#fff; }

/* ---- sanfona (FAQ) ---- */
.sanfona { max-width: 860px; margin-inline:auto; display:grid; gap:12px; }
.sanfona__item { background:#fff; border:1px solid var(--dm-border); border-radius: var(--dm-radius-md);
  overflow:hidden; transition: box-shadow var(--dm-duration-base) var(--dm-ease-standard); }
.sanfona__item:hover { box-shadow: var(--dm-shadow-sm); }
.sanfona__gatilho { display:flex; align-items:center; justify-content:space-between; gap:16px;
  width:100%; padding:18px 20px; border:0; background:none; text-align:left;
  font-weight:600; color: var(--dm-blue-500); font-size: var(--dm-text-base);
  transition: color var(--dm-duration-fast) var(--dm-ease-standard); }
.sanfona__gatilho:hover { color: var(--dm-red-500); }
.sanfona__gatilho svg { width:16px; height:16px; flex:none;
  transition: transform var(--dm-duration-base) var(--dm-ease-standard); }
.sanfona__gatilho[aria-expanded="true"] svg { transform: rotate(180deg); }
.sanfona__corpo { display:grid; grid-template-rows: 0fr;
  transition: grid-template-rows var(--dm-duration-base) var(--dm-ease-standard); }
.sanfona__corpo.is-aberto { grid-template-rows: 1fr; }
.sanfona__corpo > div { overflow:hidden; }
.sanfona__corpo p { margin:0; padding:0 20px 20px; color: var(--dm-text-muted); line-height: var(--dm-lh-relaxed); }

/* ---- horários ---- */
.horarios-grade { display:grid; gap:20px; }
@media (min-width: 760px){ .horarios-grade { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1150px){ .horarios-grade { grid-template-columns: repeat(3,1fr); } }
.horario-loja { background:#fff; border:1px solid var(--dm-border); border-radius: var(--dm-radius-lg);
  padding:22px; display:flex; flex-direction:column; gap:14px; }
.horario-loja[hidden] { display:none; }
.horario-loja__topo { display:flex; flex-direction:column; gap:8px; }
.horario-loja__topo h3 { font-size: var(--dm-text-lg); margin:2px 0 0; }
.horario-loja__acoes { display:flex; gap:10px; flex-wrap:wrap; margin-top:auto; }
.horario-loja__acoes .btn { flex:1; }

.tabela-feriados table { width:100%; border-collapse:collapse; font-size: var(--dm-text-sm); min-width:560px; }
.tabela-feriados th { text-align:left; padding:14px 20px; background: var(--dm-blue-500); color:#fff;
  font-size:12px; letter-spacing:.05em; text-transform:uppercase; white-space:nowrap; }
.tabela-feriados td { padding:14px 20px; border-bottom:1px solid var(--dm-neutral-100); color: var(--dm-neutral-600); }
.tabela-feriados tr:last-child td { border-bottom:0; }
.tabela-feriados tr:hover td { background: var(--dm-neutral-50); }

/* ---- tabela de lojas ---- */
.mapa--largo { aspect-ratio: 21/9; }
@media (max-width: 760px){ .mapa--largo { aspect-ratio: 4/3; } }
.tabela-envolucro { position:relative; }
.tabela-rolagem { overflow-x:auto; background:#fff; border:1px solid var(--dm-border);
  border-radius: var(--dm-radius-lg); scrollbar-width:thin; }

/* dica de arrastar + véu na borda: só aparecem quando a tabela não cabe */
.dica-rolagem { display:none; }
@media (max-width: 900px){
  .dica-rolagem { display:flex; align-items:center; gap:9px; margin:0 0 12px;
    font-size: var(--dm-text-sm); color: var(--dm-text-muted); }
  .dica-rolagem svg { width:16px; height:16px; color: var(--dm-red-500); flex:none;
    animation: desliza 1.4s var(--dm-ease-standard) infinite; }
  .tabela-envolucro::after { content:""; position:absolute; top:1px; bottom:1px; right:1px; width:56px;
    border-radius: 0 var(--dm-radius-lg) var(--dm-radius-lg) 0; pointer-events:none;
    background: linear-gradient(90deg, rgba(255,255,255,0), #fff 78%);
    transition: opacity var(--dm-duration-base) var(--dm-ease-standard); }
  .tabela-envolucro.no-fim::after { opacity:0; }
  /* A dica permanece visível: se ela sumisse ao chegar no fim, a altura
     da página mudaria e a tabela daria um salto. */
}
@keyframes desliza {
  0%, 100% { transform: translateX(0); }
  50%      { transform: translateX(5px); }
}
@media (prefers-reduced-motion: reduce){ .dica-rolagem svg { animation:none; } }
.tabela-lojas { width:100%; border-collapse:collapse; font-size: var(--dm-text-sm); min-width:760px; }
.tabela-lojas th { text-align:left; padding:14px 18px; background: var(--dm-blue-500); color:#fff;
  font-size:12px; letter-spacing:.05em; text-transform:uppercase; white-space:nowrap; }
.tabela-lojas td { padding:16px 18px; border-bottom:1px solid var(--dm-neutral-100);
  color: var(--dm-neutral-600); vertical-align:middle; }
.tabela-lojas tr:last-child td { border-bottom:0; }
.tabela-lojas tr[hidden] { display:none; }
.tabela-lojas tr:hover td { background: var(--dm-neutral-50); }
.tabela-lojas strong { display:block; color: var(--dm-blue-500); }
.tabela__sub { font-size: var(--dm-text-xs); color: var(--dm-text-muted); }
.tabela__end { max-width:260px; }
.tabela-lojas a { color: var(--dm-blue-500); font-weight:600; white-space:nowrap; }
.tabela-lojas a:hover { color: var(--dm-red-500); }
.link-whats { display:inline-flex; align-items:center; gap:7px; }
.link-whats svg { width:19px; height:19px; color:#25D366; flex:none; }
.tabela__acao { text-align:right; }

/* ---- linha do tempo ---- */
/* Desktop: horizontal, com a linha ligando os marcos.
   Mobile: empilha na vertical, que é onde a horizontal não caberia. */
.linha-tempo { display:grid; gap:24px; }

@media (min-width: 900px){
  .linha-tempo { grid-auto-flow: column; grid-auto-columns: minmax(0,1fr); padding-top:48px; }
  .marco { position:relative; display:block; padding:0; border:0; }
  /* bolinha sobre a linha */
  .marco::before { content:""; position:absolute; top:-48px; left:0;
    width:16px; height:16px; border-radius:50%; background: var(--dm-red-500);
    border:3px solid #fff; box-shadow:0 0 0 2px var(--dm-red-500); }
  /* trecho da linha até o próximo marco */
  .marco::after { content:""; position:absolute; top:-41px; left:24px; right:-24px;
    height:2px; background: var(--dm-border); }
  .marco:last-child::after { display:none; }
  .marco__ano { display:block; margin-bottom:10px; }
}

@media (max-width: 899px){
  .linha-tempo { gap:0; padding-left:8px; }
  .marco { display:grid; grid-template-columns: 92px 1fr; gap:20px;
    padding:20px 0 20px 20px; border-left:2px solid var(--dm-border); position:relative; }
  .marco::before { content:""; position:absolute; left:-8px; top:26px; width:14px; height:14px;
    border-radius:50%; background: var(--dm-red-500); border:3px solid #fff;
    box-shadow:0 0 0 2px var(--dm-red-500);
    /* acima do trecho de linha, senão a linha cruza a bolinha */
    z-index:2; }
  /* O último marco não pode ter a linha inteira (ela sobraria embaixo),
     mas precisa do trecho que chega até a bolinha. */
  .marco:last-child { border-left-color: transparent; }
  .marco:last-child::after { content:""; position:absolute; left:-2px; top:0;
    width:2px; height:33px; background: var(--dm-border); z-index:1; }
}
@media (max-width: 620px){ .marco { grid-template-columns: 1fr; gap:6px; } }

.marco__ano { font-family: var(--dm-font-brand); font-weight:800; font-size: var(--dm-text-xl);
  color: var(--dm-blue-500); }
.marco strong { display:block; color: var(--dm-blue-500); margin-bottom:4px; }
.marco p { margin:0; font-size: var(--dm-text-sm); color: var(--dm-text-muted); }

@media (min-width: 800px){ .passos--quatro { grid-template-columns: repeat(4,1fr); } }

/* ---- faixa de retratos de campanha ---- */
.campanha { display:grid; gap:14px; grid-template-columns: repeat(2,1fr); }
@media (min-width: 700px){ .campanha { grid-template-columns: repeat(3,1fr); } }
@media (min-width: 1000px){ .campanha { grid-template-columns: repeat(6,1fr); } }
.campanha__item { aspect-ratio: 3/4; border-radius: var(--dm-radius-md); }

/* ---- loja em breve ---- */
.store-card--breve { background:#fff; box-shadow: var(--dm-shadow-sm); }
.store-card--breve:hover { transform: translateY(-3px); box-shadow: var(--dm-shadow-md); }
.store-card--breve h3 { color: var(--dm-blue-500); }
.store-card--breve .store-card__addr { color: var(--dm-text-muted); }

/* arte de marca no lugar da foto — clara, para o card não se dissolver
   quando a seção ao redor é azul (caso da Home) */
.breve-arte { position:relative; aspect-ratio:16/10; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:12px;
  background-color: var(--dm-neutral-100);
  background-image: url("../img/patterns/pattern-branco-sutil.svg?v=2");
  background-size: 260px; }
.breve-arte img { width:46px; opacity:.5; }
.breve-arte span { font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:#fff; padding:6px 16px; border-radius: var(--dm-radius-pill);
  background: var(--dm-blue-500); }
.store-card__selo { position:absolute; top:14px; left:14px; z-index:2;
  background: var(--dm-red-500); color:#fff; padding:6px 14px; border-radius: var(--dm-radius-pill);
  font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.store-card__media { position:relative; }

/* ---- lista de vagas ---- */
.vagas { display:grid; gap:14px; }
.vaga { display:grid; gap:16px; align-items:center; background:#fff;
  border:1px solid var(--dm-border); border-radius: var(--dm-radius-lg); padding:22px;
  transition: transform var(--dm-duration-base) var(--dm-ease-standard),
              box-shadow var(--dm-duration-base) var(--dm-ease-standard),
              border-color var(--dm-duration-base) var(--dm-ease-standard); }
@media (min-width: 760px){ .vaga { grid-template-columns: 1fr auto; } }
.vaga:hover { transform: translateY(-2px); box-shadow: var(--dm-shadow-md); border-color: transparent; }
.vaga[hidden] { display:none; }
.vaga h3 { font-size: var(--dm-text-lg); margin:10px 0 10px; }
.vaga__meta { display:flex; flex-wrap:wrap; gap:8px 20px; }
.vaga__meta li { display:inline-flex; align-items:center; gap:7px;
  font-size: var(--dm-text-sm); color: var(--dm-text-muted); }
.vaga__meta svg { width:15px; height:15px; color: var(--dm-neutral-400); flex:none; }
.vaga__acao .btn svg { width:14px; height:14px; }
@media (max-width: 759px){ .vaga__acao .btn { width:100%; } }

/* ---- campo de arquivo ---- */
.arquivo { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.arquivo input[type="file"] { position:absolute; width:1px; height:1px; opacity:0; }
.arquivo__botao { display:inline-flex; align-items:center; gap:9px; cursor:pointer;
  padding:12px 20px; border-radius: var(--dm-radius-pill);
  border:1.5px solid var(--dm-blue-500); color: var(--dm-blue-500);
  font-size: var(--dm-text-sm); font-weight:600;
  transition: background var(--dm-duration-fast) var(--dm-ease-standard),
              color var(--dm-duration-fast) var(--dm-ease-standard); }
.arquivo__botao:hover { background: var(--dm-blue-500); color:#fff; }
.arquivo__botao svg { width:16px; height:16px; transform: rotate(90deg); }
.arquivo input[type="file"]:focus-visible + .arquivo__botao {
  outline:3px solid var(--dm-blue-300); outline-offset:2px; }
.arquivo__nome { font-size: var(--dm-text-sm); color: var(--dm-text-muted); }

/* ---- selos (badges) ---- */
.dm-badge { display:inline-flex; align-items:center; gap:6px; padding:5px 12px;
  border-radius: var(--dm-radius-pill); font-size: var(--dm-text-xs); font-weight:700;
  letter-spacing:.04em; text-transform:uppercase; }
.dm-badge--red { background: rgba(198,0,0,.10); color: var(--dm-red-500); }
.dm-badge--blue { background: rgba(0,19,132,.10); color: var(--dm-blue-500); }
.dm-badge--solid { background: var(--dm-red-500); color:#fff; }

/* ---- faixa de destaque (usada em Trabalhe Conosco) ---- */
.faixa-oferta { display:grid; gap: clamp(18px,2.5vw,28px); align-items:center;
  padding: clamp(22px,3vw,32px); border-radius: var(--dm-radius-lg);
  background: var(--dm-gradient-digital); color:#fff; }
.faixa-oferta__texto h3 { color:#fff; margin:12px 0 8px; }
.faixa-oferta__texto p { color: rgba(255,255,255,.84); margin:0; max-width: 60ch; }
.faixa-oferta .dm-badge--solid { background: rgba(255,255,255,.16); color:#fff; }

/* ---- lista com check ---- */
.checklist { display:grid; gap:14px; margin: 22px 0 28px; }
.checklist li { display:flex; gap:12px; align-items:flex-start;
  font-size: var(--dm-text-base); color: var(--dm-neutral-600); }
.checklist svg { width:22px; height:22px; flex:none; color: var(--dm-red-500); margin-top:1px; }

/* ---- páginas legais ---- */
.page-hero--curto { min-height:auto; background: var(--dm-gradient-digital); padding-block: 36px 44px; }
.page-hero--curto::after { display:none; }
.page-hero__data { font-size: var(--dm-text-sm); color: rgba(255,255,255,.7); margin:10px 0 0; }

.legal { display:grid; gap: clamp(28px,4vw,52px); align-items:start; }
@media (min-width: 980px){ .legal { grid-template-columns: minmax(0,1fr) 300px; } }
.legal__texto { max-width: 72ch; font-size: 1.0625rem; line-height:1.75; }
.legal__texto section { padding-top:8px; margin-bottom:34px; scroll-margin-top:110px; }
.legal__texto h2 { font-size: clamp(1.25rem,2.2vw,1.5rem); margin-bottom:12px; }
.legal__texto a { color: var(--dm-blue-500); font-weight:600;
  text-decoration:underline; text-underline-offset:3px; }
.legal__texto a:hover { color: var(--dm-red-500); }
.lista-simples { margin:0 0 var(--dm-space-4); padding-left:22px; list-style:disc; }
.lista-simples li { margin-bottom:8px; }
@media (min-width: 980px){ .legal__lateral { position:sticky; top:110px; } }
.lista-links--indice a { font-weight:500; font-size: var(--dm-text-sm); }

.aviso-modelo { display:flex; gap:14px; align-items:flex-start; padding:18px 20px; margin-bottom:32px;
  border-radius: var(--dm-radius-md); background: rgba(228,162,0,.10);
  border:1px solid rgba(228,162,0,.35); font-size: var(--dm-text-sm); line-height:1.6;
  color: var(--dm-neutral-700); }
.aviso-modelo svg { width:20px; height:20px; flex:none; color: var(--dm-warning); margin-top:2px; }
.aviso-modelo strong { display:block; color: var(--dm-neutral-800); margin-bottom:3px; }

/* ---- mapa do site ---- */
.mapa-site { display:grid; gap: clamp(24px,3vw,36px); grid-template-columns: 1fr; }
@media (min-width: 640px){ .mapa-site { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1000px){ .mapa-site { grid-template-columns: repeat(3,1fr); } }
.mapa-site__bloco h2 { font-size: var(--dm-text-lg); padding-bottom:12px; margin-bottom:12px;
  border-bottom:2px solid var(--dm-red-500); display:inline-block; }
.mapa-site__bloco ul { display:grid; gap:10px; }
.mapa-site__bloco a { color: var(--dm-neutral-600); display:inline-flex; align-items:center; gap:8px;
  transition: color var(--dm-duration-fast) var(--dm-ease-standard); }
.mapa-site__bloco a::before { content:"›"; color: var(--dm-red-500); font-weight:700; }
.mapa-site__bloco a:hover { color: var(--dm-blue-500); }

/* ============================================================
   ANIMAÇÃO DE ENTRADA
   ============================================================ */
/* A entrada usa ANIMATION (não transition), para não sobrescrever a
   transição de hover dos componentes. Ao terminar, a animação é removida
   (.is-done) para liberar transform/opacity aos estados de hover. */
.reveal { opacity:0; }
.reveal.is-visible { opacity:1; animation: dm-reveal 600ms var(--dm-ease-out) both; }
.reveal.is-done { animation: none; }

@keyframes dm-reveal {
  from { opacity:0; transform: translateY(24px); }
  to   { opacity:1; transform: none; }
}

@media (prefers-reduced-motion: reduce){
  .reveal { opacity:1; }
  .reveal.is-visible { animation:none; }
  * { animation-duration:.01ms !important; transition-duration:.01ms !important; }
}