/* Grapiglia · site institucional · estilos (todos os valores via tokens.css)
   Assinatura: decal skew nos botões, brackets de visor nas fotos, spec-sheet de serviços,
   ghost numerals no processo, painel de instrumentos nos números. */

*, *::before, *::after { box-sizing: border-box; }

html { overflow-x: clip; scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: clip;
  font-family: var(--font-body);
  font-size: var(--text-md);
  font-weight: 400;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  color: var(--color-ink);
  background:
    radial-gradient(52% 38% at 88% -4%, var(--bloom-1), transparent 70%),
    radial-gradient(44% 34% at -8% 52%, var(--bloom-2), transparent 70%),
    var(--color-paper);
  background-attachment: fixed;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

img { max-width: 100%; display: block; }
a { color: inherit; }
::selection { background: var(--color-accent); color: var(--color-accent-ink); }

h1, h2, h3 {
  font-family: var(--font-display);
  font-style: normal;
  margin: 0;
  overflow-wrap: anywhere;
  min-width: 0;
}
h1 {
  font-stretch: var(--stretch-h1);
  font-weight: 800;
  line-height: 1.0;
  letter-spacing: -0.015em;
}
h2 {
  font-stretch: var(--stretch-display);
  font-weight: 800;
  text-transform: uppercase;
  line-height: 1.05;
  letter-spacing: 0.005em;
}
h3 {
  font-stretch: var(--stretch-sub);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.005em;
}
p { margin: 0; }

:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 3px;
  border-radius: 2px;
}
.band :focus-visible { outline-color: var(--color-band-focus); }

.wrap {
  max-width: var(--page-max);
  margin-inline: auto;
  padding-inline: var(--page-gutter);
}

/* ---------- kicker · índice técnico de seção (dash decal + label) ---------- */
.kicker {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin: 0 0 var(--space-md);
  font-family: var(--font-display);
  font-stretch: var(--stretch-sub);
  font-size: var(--text-2xs);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-ink-3);
}
.kicker::before {
  content: "";
  flex: none;
  width: 0.5rem;
  height: 0.625rem;
  background: var(--color-accent);
  transform: skewX(-18deg);
  box-shadow: 0.8rem 0 0 rgba(240,162,38,0.4);
  box-shadow: 0.8rem 0 0 color-mix(in oklch, var(--color-accent) 40%, transparent);
  margin-right: 0.8rem;
}
.band .kicker { color: var(--color-band-ink-2); }
.band .kicker::before {
  background: var(--color-band-focus);
  box-shadow: 0.8rem 0 0 rgba(146,82,0,0.4);
  box-shadow: 0.8rem 0 0 color-mix(in oklch, var(--color-band-focus) 40%, transparent);
}

/* ---------- nav · N5 floating bar ---------- */
.nav-pill {
  position: fixed;
  top: var(--space-md);
  left: 50%;
  inset: var(--space-md) auto auto 50%;
  transform: translateX(-50%);
  animation: nav-in 600ms var(--ease-out) 150ms both;
  display: inline-flex;
  align-items: center;
  gap: var(--space-lg);
  padding: 0.55rem 0.75rem 0.55rem 1.125rem;
  background: rgba(17,14,9,0.9);
  background: color-mix(in oklch, var(--color-paper-2) 72%, transparent);
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  border: var(--rule-hair) solid var(--color-rule);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-nav);
  z-index: var(--z-sticky);
  white-space: nowrap;
}
.wordmark { display: block; flex: none; text-decoration: none; }
.wordmark .logo-img { max-width: none; }
.nav-pill__links {
  display: flex;
  gap: var(--space-lg);
  list-style: none;
  margin: 0;
  padding: 0;
}
.nav-pill__links a {
  font-family: var(--font-display);
  font-stretch: var(--stretch-sub);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-ink-2);
  text-decoration: none;
  white-space: nowrap;
  transition: color var(--dur-micro) var(--ease-out);
}
.nav-pill__links a:hover {
  color: var(--color-ink);
  text-decoration: underline;
  text-decoration-color: var(--color-accent);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.45em;
}
@media (max-width: 40rem) {
  .nav-pill__links { display: none; }
  .nav-pill { gap: var(--space-md); }
}
@keyframes nav-in {
  from { opacity: 0; transform: translate(-50%, -14px); }
  to   { opacity: 1; transform: translate(-50%, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .nav-pill { animation: none; }
}

/* ---------- botões · decal skew (paralelogramo, rótulo contra-inclinado) ---------- */
.cta-fill, .cta-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  min-height: 44px;
  padding: 0.7rem 1.5rem;
  border-radius: var(--radius-sm);
  transform: skewX(var(--skew));
  font-family: var(--font-display);
  font-stretch: var(--stretch-sub);
  font-weight: 700;
  font-size: var(--text-sm);
  letter-spacing: 0.03em;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--dur-short) var(--ease-out),
              border-color var(--dur-short) var(--ease-out),
              transform 140ms var(--ease-out);
}
.cta-fill > span, .cta-outline > span {
  display: inline-block;
  transform: skewX(calc(-1 * var(--skew)));
}
.cta-fill {
  position: relative;
  overflow: hidden;
  background: var(--color-accent);
  color: var(--color-accent-ink);
  border: var(--rule-hair) solid var(--color-accent);
}
/* sheen · faixa de luz que varre o decal no hover */
.cta-fill::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  inset: 0 auto 0 0;
  width: 38%;
  background: linear-gradient(105deg, transparent, var(--sheen), transparent);
  transform: translateX(-130%) skewX(var(--skew));
  pointer-events: none;
}
.cta-fill:hover::after {
  transform: translateX(300%) skewX(var(--skew));
  transition: transform 650ms var(--ease-out);
}
@media (prefers-reduced-motion: reduce) {
  .cta-fill::after { display: none; }
}
.cta-fill:hover { background: var(--color-accent-hi); border-color: var(--color-accent-hi); transform: skewX(var(--skew)) translateY(-1px); }
.cta-fill:active { transform: skewX(var(--skew)) translateY(1px); }
.cta-outline {
  background: transparent;
  color: var(--color-ink);
  border: var(--rule-hair) solid var(--color-rule-2);
}
.cta-outline:hover { border-color: var(--color-accent); transform: skewX(var(--skew)) translateY(-1px); }
.cta-outline:active { transform: skewX(var(--skew)) translateY(1px); }
.cta-fill:disabled, .cta-outline:disabled,
.agenda input:disabled, .agenda select:disabled, .agenda textarea:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.band .cta-outline { color: var(--color-band-ink); border-color: var(--color-band-rule); }
.band .cta-outline:hover { border-color: var(--color-band-focus); }

/* ---------- hero · H2 split diptych 7/5 ---------- */
.hero { padding-block: calc(var(--space-3xl) + var(--space-xl)) var(--space-3xl); }
.hero-split {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: var(--space-2xl);
  align-items: center;
}
@media (max-width: 56rem) {
  .hero-split { grid-template-columns: minmax(0, 1fr); }
}
.hero h1 { font-size: var(--text-display); max-width: 15ch; letter-spacing: -0.02em; }
.h1-dim { color: var(--color-ink-3); }
.h1-sub {
  display: block;
  margin-block-start: var(--space-md);
  font-family: var(--font-display);
  font-stretch: var(--stretch-sub);
  font-size: clamp(1rem, 0.8rem + 0.9vw, 1.375rem);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-accent);
}
.hero__lede {
  margin-block-start: var(--space-lg);
  max-width: 44ch;
  font-size: var(--text-lg);
  line-height: 1.55;
  color: var(--color-ink-2);
}
.hero__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  margin-block-start: var(--space-xl);
}
.hero__proof {
  margin-block-start: var(--space-lg);
  font-size: var(--text-sm);
  color: var(--color-ink-3);
}
.hero__proof b { color: var(--color-ink-2); font-weight: 600; }

/* entrada do hero · fade + subida leve, em cascata */
.reveal {
  opacity: 0;
  transform: translateY(16px);
  animation: reveal 650ms var(--ease-out) forwards;
  animation-delay: calc(var(--i, 0) * 110ms);
}
@keyframes reveal { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .reveal { transform: none; animation-duration: 150ms; animation-delay: 0ms; }
}

/* reveal por scroll · aplicado via JS (progressivo: sem JS, tudo visível) */
.sr {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity var(--dur-reveal) var(--ease-out),
              transform var(--dur-reveal) var(--ease-out);
}
.sr-in { opacity: 1; transform: none; }

/* ---------- foto real · brackets de visor + placa de dados ---------- */
.photo {
  margin: 0;
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-md);
  border: var(--rule-hair) solid var(--color-rule);
}
.photo::before, .photo::after {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  border: 2px solid var(--color-accent);
  z-index: var(--z-raised);
  pointer-events: none;
}
.photo::before { top: 12px; left: 12px; border-right: 0; border-bottom: 0; }
.photo::after { bottom: 12px; right: 12px; border-left: 0; border-top: 0; }
.photo img {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 62%;
  transition: transform var(--dur-reveal) var(--ease-out),
              opacity 900ms var(--ease-out);
}
/* rotação de fotos: a alternativa fica empilhada por cima e entra em crossfade */
.photo img.alt { opacity: 0; }
.photo img.alt.is-on { opacity: 1; }
.photo:hover img { transform: scale(1.025); }
@media (prefers-reduced-motion: reduce) { .photo:hover img { transform: none; } }
.photo figcaption {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: var(--z-raised);
  padding: 0.35rem 1.1rem 0.35rem 0.8rem;
  font-family: var(--font-display);
  font-stretch: var(--stretch-sub);
  font-size: var(--text-2xs);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-ink);
  background: rgba(8,6,4,0.78);
  background: color-mix(in oklch, var(--color-paper) 78%, transparent);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  clip-path: polygon(0 0, 100% 0, calc(100% - 10px) 100%, 0 100%);
}
.photo--tall { aspect-ratio: 4 / 5; }
.gallery .photo { aspect-ratio: 4 / 3; }
/* celular antigo sem aspect-ratio: proporção via padding, senão a figure colapsa e a foto some */
@supports not (aspect-ratio: 1 / 1) {
  .photo--tall { height: 0; padding-top: 125%; }
  .gallery .photo { height: 0; padding-top: 75%; }
}
.gallery .photo img { object-position: center; }
.gallery .photo--portao img { object-position: center 82%; }

/* ---------- logo ---------- */
.logo-img { display: block; height: 2rem; width: auto; }
.logo-img--foot { height: 2.5rem; }

/* ---------- placeholder honesto de foto ---------- */
.ph {
  display: grid;
  place-items: center;
  background: var(--color-paper-2);
  border: var(--rule-hair) solid var(--color-rule);
  border-radius: var(--radius-md);
  min-height: 240px;
  padding: var(--space-lg);
  text-align: center;
  margin: 0;
}
.ph figcaption {
  font-family: var(--font-display);
  font-stretch: var(--stretch-sub);
  font-size: var(--text-2xs);
  font-weight: 600;
  color: var(--color-ink-3);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.ph--tall { aspect-ratio: 4 / 5; }
.band .ph { background: var(--color-band-2); border-color: var(--color-band-rule); }
.band .ph figcaption { color: var(--color-band-ink-2); }

/* ---------- ticker · faixa de competição, serviços em loop infinito ---------- */
.ticker-wrap {
  overflow: clip;
  padding-block: var(--space-md);
}
.ticker {
  /* sem scaleX: esticar glifo rasteriza borrado; alargar o elemento cobre a rotação */
  width: 104%;
  margin-inline-start: -2%;
  background: var(--color-accent);
  transform: rotate(-1.5deg);
  overflow: hidden;
}
.ticker__track {
  display: flex;
  width: max-content;
  will-change: transform;
  animation: ticker var(--dur-ticker) linear infinite;
}
.ticker__group {
  display: flex;
  align-items: center;
  gap: var(--space-lg);
  padding: 0.55rem var(--space-lg) 0.55rem 0;
}
.ticker__group span {
  font-family: var(--font-display);
  font-stretch: var(--stretch-sub);
  font-size: var(--text-sm);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-accent-ink);
  white-space: nowrap;
}
.ticker__group i {
  flex: none;
  width: 0.45rem;
  height: 0.6rem;
  background: rgba(28,11,0,0.45);
  background: color-mix(in oklch, var(--color-accent-ink) 45%, transparent);
  transform: skewX(-18deg);
}
@keyframes ticker { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .ticker__track { animation: none; }
  .ticker { transform: none; width: 100%; margin-inline-start: 0; }
}

/* ---------- painel de números · T4, cara de painel de instrumentos ---------- */
.stat-strip {
  border-block: var(--rule-hair) solid var(--color-rule);
  padding-block: var(--space-xl);
  background: rgba(17,14,9,0.45);
  background: color-mix(in oklch, var(--color-paper-2) 45%, transparent);
}
.stat-strip .wrap {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-lg);
}
.stat-strip .wrap > div {
  border-inline-start: var(--rule-hair) solid var(--color-rule);
  padding-inline-start: var(--space-lg);
}
.stat-strip .wrap > div:first-child { border-inline-start: 0; padding-inline-start: 0; }
@media (max-width: 56rem) {
  .stat-strip .wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--space-xl); }
  .stat-strip .wrap > div:nth-child(odd) { border-inline-start: 0; padding-inline-start: 0; }
}
.stat-strip b {
  display: block;
  font-family: var(--font-display);
  font-stretch: var(--stretch-wide);
  font-weight: 900;
  font-size: var(--text-stat);
  font-variant-numeric: tabular-nums;
  line-height: 0.95;
  letter-spacing: -0.01em;
}
.stat-strip b sup { font-size: 0.4em; color: var(--color-accent); }
.stat-strip span {
  display: block;
  margin-block-start: var(--space-sm);
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-ink-3);
}

/* ---------- cabeça de seção · S2 hanging, coluna única ---------- */
.head-hang { padding-block: var(--space-3xl) var(--space-xl); }
.head-hang h2 { font-size: var(--text-2xl); max-width: 22ch; }
.head-hang p {
  margin-block-start: var(--space-md);
  max-width: 54ch;
  color: var(--color-ink-2);
}
.band .head-hang p { color: var(--color-band-ink-2); }

/* ---------- diptych genérico (Split Studio) ---------- */
.split {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
  gap: var(--space-2xl);
  align-items: center;
  padding-block-end: var(--space-3xl);
}
.split--rev { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }
.split--rev > figure { order: -1; }
@media (max-width: 56rem) {
  .split, .split--rev { grid-template-columns: minmax(0, 1fr); }
  .split--rev > figure { order: 0; }
}
.split h3 { font-size: var(--text-xl); max-width: 24ch; }
.split p { margin-block-start: var(--space-md); max-width: 50ch; color: var(--color-ink-2); }
.split .cta-outline, .split .cta-fill { margin-block-start: var(--space-xl); margin-inline-start: 5px; }
.split ul {
  margin: var(--space-lg) 0 0;
  padding: 0;
  list-style: none;
  color: var(--color-ink-2);
}
.split li {
  padding-block: var(--space-xs);
  padding-inline-start: 1.5em;
  position: relative;
}
.split li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.85em;
  width: 0.6em;
  height: 0.28em;
  background: var(--color-accent);
  transform: skewX(-18deg);
}

/* ---------- serviços · spec-sheet completo em 2 colunas (16 linhas) ---------- */
.service-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--space-2xl);
  border-top: var(--rule-hair) solid var(--color-rule);
  padding-block-end: var(--space-3xl);
}
.service-row {
  display: grid;
  grid-template-columns: 2.75rem minmax(0, 1fr) auto;
  gap: var(--space-2xs) var(--space-md);
  align-items: start;
  padding: var(--space-lg) var(--space-xs);
  border-bottom: var(--rule-hair) solid var(--color-rule);
  transition: background-color var(--dur-short) var(--ease-out),
              transform var(--dur-short) var(--ease-out);
}
.service-row:hover {
  background: rgba(17,14,9,0.6);
  background: color-mix(in oklch, var(--color-paper-2) 60%, transparent);
  transform: translateX(4px);
}
.service-row__num {
  grid-row: 1 / span 2;
  padding-block-start: 0.2rem;
  font-family: var(--font-display);
  font-stretch: var(--stretch-wide);
  font-weight: 800;
  font-size: var(--text-sm);
  font-variant-numeric: tabular-nums;
  color: var(--color-ink-3);
  transition: color var(--dur-short) var(--ease-out);
}
.service-row:hover .service-row__num { color: var(--color-accent); }
.service-row h3 { grid-column: 2; font-size: var(--text-lg); }
.service-row p { grid-column: 2; font-size: var(--text-sm); color: var(--color-ink-2); }
.service-row a {
  grid-column: 3;
  grid-row: 1;
  font-family: var(--font-display);
  font-stretch: var(--stretch-sub);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-accent);
  text-decoration: none;
  white-space: nowrap;
  padding-block: var(--space-xs);
  transition: color var(--dur-micro) var(--ease-out);
}
.service-row a::after {
  content: "→";
  display: inline-block;
  margin-inline-start: 0.4em;
  transition: transform var(--dur-short) var(--ease-out);
}
.service-row a:hover { color: var(--color-accent-hi); }
.service-row a:hover::after { transform: translateX(4px); }
@media (prefers-reduced-motion: reduce) {
  .service-row:hover { transform: none; }
  .service-row a:hover::after { transform: none; }
}
@media (max-width: 56rem) {
  .service-list { grid-template-columns: minmax(0, 1fr); }
  .service-row a { grid-column: 2; grid-row: auto; justify-self: start; }
  .service-row__num { grid-row: 1 / span 3; }
}

/* ---------- faixa clara ---------- */
.band {
  background: var(--color-band);
  color: var(--color-band-ink);
  border-block: var(--rule-hair) solid var(--color-band-rule);
}

/* ---------- como funciona · F4 steps com ghost numerals ---------- */
.steps {
  list-style: none;
  margin: 0;
  padding: 0 0 var(--space-3xl);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-xl) var(--space-lg);
}
@media (max-width: 56rem) { .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 36rem) { .steps { grid-template-columns: minmax(0, 1fr); } }
.steps .stage {
  display: block;
  font-family: var(--font-display);
  font-stretch: var(--stretch-wide);
  font-weight: 900;
  font-size: var(--text-ghost);
  font-variant-numeric: tabular-nums;
  line-height: 0.9;
  letter-spacing: -0.02em;
  color: rgba(28,24,18,0.15);
  color: color-mix(in oklch, var(--color-band-ink) 15%, transparent);
}
.steps h3 {
  position: relative;
  margin-block-start: -1.1rem;
  font-size: var(--text-lg);
}
.steps p {
  margin-block-start: var(--space-xs);
  font-size: var(--text-sm);
  color: var(--color-band-ink-2);
}

/* ---------- estrutura · fotos + equipamentos ---------- */
.gallery {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--space-lg);
  padding-block-end: var(--space-xl);
}
@media (max-width: 56rem) { .gallery { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
@media (max-width: 36rem) { .gallery { grid-template-columns: minmax(0, 1fr); } }
.equip {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs) var(--space-lg);
  padding-block-end: var(--space-3xl);
  font-size: var(--text-sm);
  color: var(--color-ink-2);
  list-style: none;
  margin: 0;
  padding-inline-start: 0;
}
.equip li::before { content: "· "; color: var(--color-accent); }

/* ---------- agendamento · form → WhatsApp ---------- */
.agenda {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: var(--space-2xl);
  padding-block-end: var(--space-3xl);
  align-items: start;
}
@media (max-width: 56rem) { .agenda { grid-template-columns: minmax(0, 1fr); } }
.agenda form {
  display: grid;
  gap: var(--space-md);
  background: var(--color-band-2);
  border: var(--rule-hair) solid var(--color-band-rule);
  border-radius: var(--radius-md);
  padding: var(--space-xl);
}
.agenda label {
  display: grid;
  gap: var(--space-xs);
  font-family: var(--font-display);
  font-stretch: var(--stretch-sub);
  font-size: var(--text-2xs);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-band-ink-2);
}
.agenda input, .agenda select, .agenda textarea {
  font-family: var(--font-body);
  font-size: var(--text-md);
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
  color: var(--color-band-ink);
  background: var(--color-band);
  border: var(--rule-hair) solid var(--color-band-rule);
  border-radius: var(--radius-sm);
  padding: 0.6rem 0.8rem;
  min-height: 44px;
  width: 100%;
}
.agenda input:focus, .agenda select:focus, .agenda textarea:focus {
  outline: none;
  border-color: var(--color-band-focus);
  box-shadow: 0 0 0 1px var(--color-band-focus);
}
.agenda textarea { min-height: 5.5rem; resize: vertical; }
.agenda .cta-fill { justify-self: start; margin-inline-start: 5px; }
.agenda__note { font-size: var(--text-xs); letter-spacing: normal; text-transform: none; font-family: var(--font-body); font-weight: 400; color: var(--color-band-ink-2); }

/* ---------- mapa ---------- */
.map-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: var(--space-2xl);
  padding-block-end: var(--space-3xl);
  align-items: start;
}
@media (max-width: 56rem) { .map-grid { grid-template-columns: minmax(0, 1fr); } }
.map-grid iframe {
  width: 100%;
  height: 340px;
  border: var(--rule-hair) solid var(--color-rule);
  border-radius: var(--radius-md);
  display: block;
  filter: grayscale(1) invert(0.92) hue-rotate(185deg) brightness(0.92) contrast(0.92);
}
.addr { font-size: var(--text-md); color: var(--color-ink-2); }
.addr strong { color: var(--color-ink); font-weight: 600; }
.addr p { margin-block-start: var(--space-sm); }
.addr a { color: var(--color-accent); text-decoration: none; }
.addr a:hover { color: var(--color-accent-hi); }

/* ---------- footer · Ft5 statement ---------- */
.foot-stmt {
  padding: var(--space-3xl) 0 var(--space-xl);
  border-top: var(--rule-hair) solid var(--color-rule);
}
.foot-stmt__line {
  font-family: var(--font-display);
  font-stretch: var(--stretch-display);
  font-weight: 800;
  font-size: clamp(1.5rem, 1rem + 2.8vw, 3rem);
  line-height: 1.08;
  letter-spacing: 0.005em;
  text-transform: uppercase;
  max-width: 24ch;
  overflow-wrap: anywhere;
}
.foot-stmt__line .dot { color: var(--color-accent); }
.foot-stmt__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md) var(--space-xl);
  justify-content: space-between;
  align-items: baseline;
  margin-block-start: var(--space-2xl);
  padding-block-start: var(--space-md);
  border-top: var(--rule-hair) solid var(--color-rule);
  font-size: var(--text-xs);
  color: var(--color-ink-3);
}

/* ---------- WhatsApp flutuante (pedido explícito do briefing) ---------- */
.fab-wa {
  position: fixed;
  right: max(var(--space-md), env(safe-area-inset-right));
  bottom: max(var(--space-md), env(safe-area-inset-bottom));
  z-index: var(--z-fab);
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 999px;
  background: var(--color-accent);
  color: var(--color-accent-ink);
  transition: background-color var(--dur-short) var(--ease-out), transform 140ms var(--ease-out);
}
.fab-wa:hover { background: var(--color-accent-hi); transform: translateY(-2px); }
.fab-wa:active { transform: translateY(1px); }
.fab-wa svg { width: 28px; height: 28px; }
/* anel de pulso · chama o olho pro contato sem som nem salto */
.fab-wa::before {
  content: "";
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  inset: 0;
  border-radius: inherit;
  border: 2px solid var(--color-accent);
  animation: fab-ping 3.4s var(--ease-out) infinite;
  pointer-events: none;
}
@keyframes fab-ping {
  0%       { transform: scale(1); opacity: 0.7; }
  55%, 100% { transform: scale(1.6); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .fab-wa::before { animation: none; opacity: 0; }
}

/* ---------- frota · plataformas credenciadas (logos reais, chip claro) ---------- */
.partners {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-md) var(--space-lg);
  margin-block-start: var(--space-xl);
  padding-block-start: var(--space-lg);
  border-top: var(--rule-hair) solid var(--color-rule);
}
.partners > span {
  flex: 1 1 100%;
  font-family: var(--font-display);
  font-stretch: var(--stretch-sub);
  font-size: var(--text-2xs);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-ink-3);
}
.partners a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 4.5rem;
  padding: 0.7rem 1.4rem;
  background: var(--color-band);
  border-radius: var(--radius-md);
  border: var(--rule-hair) solid var(--color-rule-2);
  transition: transform 140ms var(--ease-out), border-color 140ms var(--ease-out);
}
.partners a:hover { transform: translateY(-2px); border-color: var(--color-accent); }
.partners img { display: block; height: 3.1rem; width: auto; max-width: 8.5rem; }
.partners img[src$="logo-edenred.svg"] { height: 2.3rem; }
.partners img[src$="logo-goodcard.png"] { height: 2.9rem; }

/* ---------- avaliações do Google · nota real, sem depoimento inventado ---------- */
.reviews {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: var(--space-2xl);
  align-items: center;
  padding-block-end: var(--space-3xl);
}
@media (max-width: 56rem) { .reviews { grid-template-columns: minmax(0, 1fr); } }
.reviews__score {
  position: relative;
  padding: var(--space-xl);
  border: var(--rule-hair) solid var(--color-rule);
  border-radius: var(--radius-md);
  background: rgba(17,14,9,0.6);
  background: color-mix(in oklch, var(--color-paper-2) 60%, transparent);
}
.reviews__score::before, .reviews__score::after {
  content: "";
  position: absolute;
  width: 20px; height: 20px;
  border: 2px solid var(--color-accent);
  pointer-events: none;
}
.reviews__score::before { top: 12px; left: 12px; border-right: 0; border-bottom: 0; }
.reviews__score::after { bottom: 12px; right: 12px; border-left: 0; border-top: 0; }
.reviews__num {
  display: flex;
  align-items: baseline;
  gap: var(--space-sm);
  font-family: var(--font-display);
  font-stretch: var(--stretch-wide);
  font-weight: 900;
  font-size: var(--text-stat);
  line-height: 1;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.reviews__num small {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--text-sm);
  letter-spacing: 0;
  color: var(--color-ink-2);
}
.stars {
  display: flex;
  gap: 0.2rem;
  margin-block-start: var(--space-sm);
  color: var(--color-accent);
}
.stars svg { width: 1.35rem; height: 1.35rem; }
.stars svg.half { color: var(--color-accent); }
.reviews__src {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-block-start: var(--space-lg);
  font-size: var(--text-xs);
  color: var(--color-ink-3);
}
.reviews__src svg { width: 1.1rem; height: 1.1rem; flex: none; }
.reviews__text p { margin-block-start: var(--space-md); max-width: 50ch; color: var(--color-ink-2); }
.reviews__ctas { display: flex; flex-wrap: wrap; gap: var(--space-md); margin-block-start: var(--space-xl); }
.reviews__ctas .cta-fill, .reviews__ctas .cta-outline { margin-inline-start: 5px; }

/* ---------- redes sociais ---------- */
.social {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  list-style: none;
  margin: 0;
  padding: 0;
}
.social a {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius-md);
  border: var(--rule-hair) solid var(--color-rule-2);
  color: var(--color-ink-2);
  transition: color 140ms var(--ease-out), border-color 140ms var(--ease-out), transform 140ms var(--ease-out);
}
.social a:hover { color: var(--color-accent); border-color: var(--color-accent); transform: translateY(-2px); }
.social svg { width: 1.25rem; height: 1.25rem; }
.hero__social { margin-block-start: var(--space-lg); }
.hero__social a { color: var(--color-ink-3); }
.foot-stmt__meta .social { align-self: center; }

/* Fotos verticais da recepção: preservar o ambiente no quadro da galeria. */
.gallery .photo--recepcao img { object-position: center 65%; }