/* ---------- Fontes (self-hosted, OFL) ---------- */
@font-face { font-family: "Bodoni Moda"; font-style: normal; font-weight: 400 900; font-display: swap; src: url("fontes/bodoni-moda-latin-opsz-normal.woff2") format("woff2"); }
@font-face { font-family: "Ysabeau Office"; font-style: normal; font-weight: 1 1000; font-display: swap; src: url("fontes/ysabeau-office-latin-wght-normal.woff2") format("woff2"); }
@font-face { font-family: "Alex Brush"; font-style: normal; font-weight: 400; font-display: swap; src: url("fontes/alex-brush-latin-400-normal.woff2") format("woff2"); }

/* ---------- Tokens ----------
   The page is laid like a table at dinner: the night table is the ground,
   porcelain is where things are read, the logo's oxblood is the charger plate
   and the booking field, its copper hairlines are the structure. Saffron is
   the sauce: graded dots that lead to the phone, and the live opening status. */
:root {
  color-scheme: dark;

  --mesa: #1A1617;
  --mesa-2: #241E1F;
  --luz: #F3EFEB;
  --luz-suave: #B8ADAA;
  --porcelana: #F6F4F1;
  --porcelana-2: #E9E4E0;
  --tinta: #201B1C;
  --tinta-suave: #5F5658;
  --bordo: #5A2527;
  --cobre: #C99580;
  --acafrao: #E2A93B;
  --balsamico: #3A1D1B;
  --porcelana-luz: #FCFBF9;
  --sobre-bordo: #E2D3CF;
  --sobre-bordo-suave: #CDB7B1;
  --linha-cobre: rgba(201, 149, 128, .3);
  --hoje: rgba(226, 169, 59, .16);
  --wasabi: #A7C46B;
  --linha-clara: rgba(32, 27, 28, .14);
  --linha-escura: rgba(243, 239, 235, .16);

  --display: "Bodoni Moda", "Bodoni 72", Didot, Georgia, serif;
  --texto: "Ysabeau Office", "Segoe UI", system-ui, sans-serif;
  --assinatura: "Alex Brush", cursive;

  --gutter: clamp(16px, 5vw, 64px);
  --max: 1200px;
  --ease: cubic-bezier(.16, 1, .3, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scrollbar-color: var(--cobre) var(--mesa);
}
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
body {
  margin: 0;
  background: var(--mesa);
  color: var(--luz);
  font-family: var(--texto);
  font-size: 1.125rem;
  line-height: 1.6;
  font-weight: 420;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, svg { display: block; max-width: 100%; }
img { height: auto; }
h1, h2, h3 {
  font-family: var(--display);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -.01em;
  margin: 0;
  text-wrap: balance;
}
p { margin: 0; text-wrap: pretty; }
a { color: inherit; text-underline-offset: .22em; text-decoration-thickness: 1px; }
::selection { background: var(--acafrao); color: var(--mesa); }
:focus-visible { outline: 2px solid var(--acafrao); outline-offset: 3px; border-radius: 2px; }
.num, table, .prato-preco, time { font-variant-numeric: lining-nums tabular-nums; }
.num { white-space: nowrap; }

.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;
}
.saltar {
  position: absolute; left: var(--gutter); top: 8px; z-index: 50;
  padding: 12px 18px; border-radius: 999px;
  background: var(--porcelana); color: var(--tinta); font-weight: 600; text-decoration: none;
  transform: translateY(-160%);
}
.saltar:focus-visible { transform: none; }

/* Graded sauce dots: large to small, leading the eye to the phone. */
.gotas { display: inline-flex; align-items: center; gap: 7px; flex: none; }
.gotas i { display: block; border-radius: 50%; background: var(--acafrao); }
.gotas i:nth-child(1) { width: 15px; height: 15px; }
.gotas i:nth-child(2) { width: 11px; height: 11px; }
.gotas i:nth-child(3) { width: 7.5px; height: 7.5px; }
.gotas i:nth-child(4) { width: 5px; height: 5px; }

/* ---------- Top bar ---------- */
.topo {
  position: relative; z-index: 5;
  display: flex; align-items: center; gap: clamp(12px, 2.4vw, 36px);
  max-width: calc(var(--max) + 2 * var(--gutter));
  margin: 0 auto; padding: 16px var(--gutter);
  min-height: 80px;
}
/* The logo's capsule: oxblood pill, copper double rule, script name. */
.marca {
  display: inline-flex; align-items: center; gap: 2px;
  height: 52px; padding: 0 22px 0 12px;
  border-radius: 999px;
  background: var(--bordo);
  box-shadow: inset 0 0 0 1px var(--cobre), inset 0 0 0 4px var(--bordo), inset 0 0 0 5px var(--linha-cobre);
  color: var(--cobre); text-decoration: none;
}
.marca-flores { width: 30px; height: 30px; flex: none; color: var(--cobre); }
.marca-nome { font-family: var(--assinatura); font-size: 1.95rem; line-height: 1; padding-top: 6px; white-space: nowrap; }
.menu { display: flex; gap: clamp(16px, 2.2vw, 32px); margin-left: auto; }
.menu a {
  font-size: 1rem; font-weight: 500; letter-spacing: .01em; color: var(--luz-suave);
  text-decoration: none; padding: 10px 0; min-height: 44px; display: inline-flex; align-items: center;
  transition: color .25s var(--ease);
}
.menu a:hover { color: var(--luz); }
.idiomas { display: flex; gap: 2px; }
.idiomas a {
  display: inline-grid; place-items: center; min-width: 44px; min-height: 44px;
  font-size: .9375rem; font-weight: 600; letter-spacing: .04em; color: var(--luz-suave);
  text-decoration: none; border-radius: 999px;
  transition: color .25s var(--ease), background-color .25s var(--ease);
}
.idiomas a:hover { color: var(--luz); background: var(--mesa-2); }
.idiomas a[aria-current="page"] { color: var(--acafrao); }
.topo-ligar {
  display: inline-flex; align-items: center; gap: 10px;
  min-height: 44px; padding: 0 18px; border-radius: 999px;
  border: 1px solid var(--linha-escura); color: var(--luz);
  font-size: 1rem; font-weight: 600; text-decoration: none;
  transition: border-color .25s var(--ease), background-color .25s var(--ease);
}
.topo-ligar:hover { border-color: var(--cobre); background: var(--mesa-2); }
.topo-ligar svg { width: 18px; height: 18px; }
@media (max-width: 899px) {
  .menu { display: none; }
  .idiomas { margin-left: auto; }
  .topo-ligar span { display: none; }
  .topo-ligar { padding: 0; width: 44px; justify-content: center; }
}
/* On phones the opening button and the bottom phone bar carry the call. */
@media (max-width: 519px) {
  .topo { gap: 8px; }
  .topo-ligar { display: none; }
}
@media (max-width: 380px) {
  .marca { padding-right: 16px; }
  .marca-nome { font-size: 1.7rem; }
  .marca-flores { width: 24px; }
  .idiomas a { min-width: 40px; }
}

/* ---------- Opening: the table and the plate ---------- */
.abertura { position: relative; background: var(--mesa); }
.abertura-texto {
  max-width: calc(980px + 2 * var(--gutter));
  margin: 0 auto;
  padding: clamp(28px, 5vh, 64px) var(--gutter) clamp(36px, 5vh, 56px);
  text-align: center;
}
.abertura h1 {
  font-size: clamp(2.6rem, 1.35rem + 4.6vw, 5.4rem);
  font-weight: 480;
  line-height: 1.02;
}
.abertura-sub {
  max-width: 38em; margin: clamp(18px, 2.6vh, 28px) auto 0;
  color: var(--luz-suave); font-size: clamp(1.0625rem, 1rem + .3vw, 1.25rem); line-height: 1.55;
}
.abertura-acoes {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: 14px 28px; margin-top: clamp(26px, 3.6vh, 38px);
}
.btn-reservar {
  display: inline-flex; align-items: center; gap: 14px;
  text-decoration: none; color: var(--tinta);
  border-radius: 999px;
}
.btn-reservar-texto {
  display: inline-flex; align-items: baseline; gap: 12px;
  min-height: 56px; padding: 16px 28px; border-radius: 999px;
  background: var(--porcelana);
  font-size: 1.0625rem; font-weight: 650; letter-spacing: .01em; line-height: 1.4;
  transition: background-color .25s var(--ease), transform .25s var(--ease);
}
.btn-reservar-texto .num { font-family: var(--display); font-weight: 600; font-size: 1.125rem; }
.btn-reservar-texto { white-space: nowrap; }
@media (max-width: 480px) {
  .btn-reservar { gap: 10px; }
  .btn-reservar-texto { padding: 16px 22px; gap: 10px; }
  .btn-reservar .indicativo { display: none; }
}
.btn-reservar:hover .btn-reservar-texto { background: var(--porcelana-luz); }
.btn-reservar:active .btn-reservar-texto { transform: translateY(1px); }
.btn-reservar .gotas i { transition: transform .45s var(--ease); }
.btn-reservar:hover .gotas i,
.btn-reservar:focus-visible .gotas i { transform: scale(1.25); }
.btn-reservar:hover .gotas i:nth-child(2) { transition-delay: .04s; }
.btn-reservar:hover .gotas i:nth-child(3) { transition-delay: .08s; }
.btn-reservar:hover .gotas i:nth-child(4) { transition-delay: .12s; }
.link-carta {
  display: inline-flex; align-items: center; min-height: 44px;
  color: var(--luz); font-weight: 600; text-decoration: underline;
  text-decoration-color: var(--cobre);
}
.link-carta:hover { text-decoration-thickness: 2px; }

/* Live opening status (filled in by site.js in Lisbon time). */
.estado {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 10px;
  margin-top: 18px; font-size: 1rem; color: var(--luz-suave);
}
.estado-ponto { width: 9px; height: 9px; border-radius: 50%; background: var(--acafrao); flex: none; }
.estado.aberto .estado-ponto { background: var(--wasabi); }
.estado-texto { color: var(--luz); font-weight: 600; }
.estado-sep { color: var(--cobre); }

/* The place setting, seen from above: oxblood charger with the logo's copper
   bands, a porcelain plate on it, the dish in the well. */
.servico { position: relative; background: var(--mesa); }
.servico-palco {
  position: relative;
  display: grid; place-items: center;
  padding: 0 var(--gutter) clamp(56px, 9vh, 110px);
  overflow: hidden;
}
.prato {
  --prato: min(88vw, 92svh, 860px);
  position: relative; margin: 0;
  width: var(--prato); aspect-ratio: 1;
}
.prato-sousplat {
  position: absolute; inset: 0; width: 100%; height: 100%;
  filter: drop-shadow(0 34px 40px rgba(0, 0, 0, .55));
}
.prato-sousplat .base { fill: var(--bordo); }
.prato-sousplat .faixa { fill: none; stroke: var(--cobre); stroke-width: 2; }
.prato-sousplat .nome { fill: var(--cobre); font-family: var(--assinatura); font-size: 46px; }
.prato-porcelana {
  position: absolute; inset: 9%; border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%, transparent 0 70.5%, rgba(32, 27, 28, .07) 71%, transparent 73.5%),
    radial-gradient(circle at 46% 40%, var(--porcelana-luz) 0%, var(--porcelana) 52%, var(--porcelana-2) 100%);
  z-index: 3;
}
.prato-foto { position: absolute; inset: 20.5%; z-index: 4; border-radius: 50%; overflow: hidden; }
.prato-foto img { width: 100%; height: 100%; object-fit: cover; }
/* The porcelain that opens out of the plate into the menu (scroll-driven). */
.poco { display: none; }

html.servir .servico { height: calc(100svh + 70svh); }
html.servir .servico-palco {
  --cy: 50%;
  position: sticky; top: 0; height: 100svh; padding: 0;
  display: block;
}
html.servir .prato {
  position: absolute; left: 50%; top: var(--cy);
  translate: -50% -50%;
  transform: rotate(calc((1 - var(--e1, 0)) * -7deg)) scale(calc(.95 + var(--e1, 0) * .05));
  will-change: transform;
}
html.servir .poco {
  display: block; position: absolute; z-index: 2;
  left: 50%; top: 50%; width: 300vmax; height: 300vmax;
  translate: -50% -50%;
  background: var(--porcelana);
  clip-path: circle(calc(var(--prato) * .41 + (78vmax - var(--prato) * .41) * var(--e2, 0)) at 50% 50%);
  will-change: clip-path;
}
@media (max-width: 699px) {
  .prato { --prato: min(90vw, 60svh, 520px); }
  html.servir .servico-palco { --cy: 31%; }
  html.servir .servico { height: calc(100svh + 55svh); }
}

/* ---------- Menu: porcelain ---------- */
.carta {
  position: relative; color-scheme: light;
  background: var(--porcelana); color: var(--tinta);
  padding: clamp(72px, 10vw, 140px) var(--gutter) clamp(80px, 10vw, 140px);
}
.carta :focus-visible { outline-color: var(--bordo); }
.carta-cabeca { max-width: 760px; margin: 0 auto; text-align: center; }
.carta h2 { font-size: clamp(2.6rem, 1.6rem + 3.6vw, 4.6rem); }
.pincelada { width: min(320px, 70%); height: auto; margin: 14px auto 0; color: var(--balsamico); }
.carta-intro { margin: 26px auto 0; max-width: 34em; color: var(--tinta-suave); font-size: 1.1875rem; }
.carta-cursos { position: relative; max-width: 760px; margin: clamp(56px, 7vw, 96px) auto 0; }
.curso + .curso { margin-top: clamp(56px, 7vw, 88px); }
.curso-cabeca { display: flex; flex-direction: column; align-items: center; gap: 14px; margin-bottom: 28px; }
.curso h3 { font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.4rem); font-weight: 500; }
/* Copper three-line band from the logo: the rule between courses. */
.faixa-tres {
  width: 112px; height: 9px; flex: none;
  background:
    linear-gradient(var(--cobre), var(--cobre)) 0 0 / 100% 1px no-repeat,
    linear-gradient(var(--cobre), var(--cobre)) 0 4px / 100% 1px no-repeat,
    linear-gradient(var(--cobre), var(--cobre)) 0 8px / 100% 1px no-repeat;
}
.carta .faixa-tres { opacity: .9; }
.pratos { list-style: none; margin: 0; padding: 0; }
/* Every dish keeps the same three tiers: name, what is on the plate, price. */
.prato-linha {
  display: grid; grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "nome preco" "desc .";
  column-gap: 24px; row-gap: 4px;
  padding: 18px 0; border-top: 1px solid var(--linha-clara);
}
.prato-linha:last-child { border-bottom: 1px solid var(--linha-clara); }
.prato-nome { grid-area: nome; font-family: var(--display); font-size: 1.4rem; font-weight: 560; line-height: 1.3; }
.prato-desc { grid-area: desc; color: var(--tinta-suave); font-size: 1.0625rem; line-height: 1.5; max-width: 36em; }
.prato-preco { grid-area: preco; align-self: baseline; font-family: var(--display); font-size: 1.4rem; font-weight: 560; line-height: 1.3; white-space: nowrap; }
.prato-preco.por-confirmar { color: var(--bordo); font-family: var(--texto); font-size: 1rem; font-weight: 600; }
.carta-nota {
  max-width: 34em; margin: clamp(48px, 6vw, 72px) auto 0; text-align: center;
  color: var(--tinta-suave); font-size: 1.0625rem;
}
/* One lit plate per screen: the tuna tataki beside the fish course. */
.carta-foto { margin: 0 auto 40px; width: min(62vw, 260px); }
.carta-foto img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 50%; box-shadow: 0 0 0 10px var(--porcelana-2), 0 18px 30px -12px rgba(32, 27, 28, .35); }
.carta-foto figcaption { margin-top: 22px; text-align: center; font-size: .9375rem; color: var(--tinta-suave); }
@media (min-width: 1360px) {
  .carta-foto { position: absolute; left: calc(100% + 48px); margin: 0; width: 240px; }
}

/* ---------- The house: back on the table ---------- */
.casa { background: var(--mesa); padding: clamp(80px, 11vw, 150px) var(--gutter); }
.casa-cabeca { max-width: 820px; margin: 0 auto; text-align: center; }
.casa h2 { font-size: clamp(2.4rem, 1.5rem + 3.3vw, 4.4rem); }
.casa-cabeca p { margin: 26px auto 0; max-width: 36em; color: var(--luz-suave); font-size: 1.1875rem; }
.casa-foto { margin: clamp(48px, 6vw, 80px) auto 0; max-width: 1100px; }
.casa-foto img {
  width: 100%; aspect-ratio: 16 / 9; object-fit: cover; object-position: 50% 42%;
  border-radius: 28px;
}
/* On wide screens the room sits in the logo's capsule. */
@media (min-width: 900px) { .casa-foto img { aspect-ratio: 2.2 / 1; border-radius: 999px; } }
.casa-foto figcaption { margin-top: 18px; text-align: center; font-size: .9375rem; color: var(--luz-suave); }
.notas {
  max-width: 28em; margin: clamp(56px, 7vw, 96px) auto 0; text-align: center;
  font-family: var(--display); font-size: clamp(1.5rem, 1.2rem + 1.1vw, 2.15rem); font-weight: 480; line-height: 1.3;
}
.notas strong { color: var(--cobre); font-weight: 600; }
/* Guests' words hang off the page's centre line like garnish around a plate. */
.vozes {
  list-style: none; margin: clamp(56px, 7vw, 96px) auto 0; padding: 0;
  max-width: 1040px; display: grid; gap: 44px;
}
.voz { position: relative; max-width: 30em; margin: 0 auto; text-align: center; }
.voz blockquote { margin: 0; }
.voz blockquote p { font-family: var(--display); font-size: clamp(1.25rem, 1.1rem + .55vw, 1.55rem); line-height: 1.38; font-weight: 450; }
.voz-autor { margin-top: 14px; font-size: .9375rem; color: var(--luz-suave); }
.voz-autor b { color: var(--luz); font-weight: 600; }
@media (min-width: 900px) {
  .vozes { gap: 28px; }
  .vozes::before {
    content: ""; position: absolute; left: 50%; top: 8px; bottom: 8px; width: 1px;
    background: linear-gradient(var(--linha-escura), var(--linha-escura));
  }
  .vozes { position: relative; }
  .voz { width: calc(50% - 56px); margin: 0; text-align: right; }
  .voz:nth-child(even) { margin-left: auto; text-align: left; }
  .voz::after {
    content: ""; position: absolute; top: .55em; width: 11px; height: 11px; border-radius: 50%;
    background: var(--acafrao); right: -61.5px;
  }
  .voz:nth-child(even)::after { right: auto; left: -61.5px; }
}

/* ---------- Booking: the oxblood charger ---------- */
/* Its top edge is the rim of a charger, ringed by the logo's three copper lines. */
.reservar {
  --arco: clamp(44px, 7vw, 120px);
  position: relative; background: var(--bordo); color: var(--luz);
  padding: clamp(96px, 12vw, 160px) var(--gutter) clamp(80px, 10vw, 130px);
  border-radius: 50% 50% 0 0 / var(--arco) var(--arco) 0 0;
}
.arco { position: absolute; inset: 0 0 auto; height: var(--arco); pointer-events: none; }
.arco i {
  position: absolute; left: var(--d); right: var(--d); top: var(--d);
  height: calc(var(--arco) - var(--d));
  border: 1px solid var(--cobre); border-bottom: 0;
  border-radius: 50% 50% 0 0 / calc(var(--arco) - var(--d)) calc(var(--arco) - var(--d)) 0 0;
  -webkit-mask: linear-gradient(#000 35%, transparent); mask: linear-gradient(#000 35%, transparent);
}
.arco i:nth-child(1) { --d: 12px; }
.arco i:nth-child(2) { --d: 17px; }
.arco i:nth-child(3) { --d: 22px; }
.reservar-cabeca { max-width: 760px; margin: 0 auto; text-align: center; }
.reservar h2 { font-size: clamp(2.4rem, 1.5rem + 3.3vw, 4.4rem); }
.tel-grande {
  display: inline-flex; align-items: center; gap: 18px; margin-top: 26px;
  font-family: var(--display); font-size: clamp(2.2rem, 1.4rem + 3.6vw, 4.4rem); font-weight: 560; line-height: 1.1;
  color: var(--luz); text-decoration: none;
}
.tel-grande .gotas i { background: var(--acafrao); }
@media (max-width: 480px) { .tel-grande .gotas { display: none; } }
.tel-grande:hover .num { text-decoration: underline; text-decoration-color: var(--acafrao); text-decoration-thickness: 2px; }
.tel-alt { margin-top: 14px; color: var(--sobre-bordo); }
.tel-alt a { color: var(--luz); font-weight: 600; }
.passos {
  list-style: none; padding: 0; margin: clamp(48px, 6vw, 72px) auto 0; max-width: 1040px;
  display: grid; gap: 22px;
}
.passos li { display: flex; gap: 18px; align-items: flex-start; }
.passo-n {
  flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
  background: var(--acafrao); color: var(--mesa); font-family: var(--display); font-weight: 650; font-size: 1.15rem;
}
.passos p { padding-top: 6px; color: var(--sobre-bordo); }
.passos strong { color: var(--luz); font-weight: 650; }
@media (min-width: 900px) {
  .passos { grid-template-columns: repeat(3, 1fr); gap: 36px; }
}
.reservar-grelha {
  max-width: 1040px; margin: clamp(56px, 7vw, 88px) auto 0;
  display: grid; gap: 48px;
  padding-top: clamp(40px, 5vw, 56px);
  border-top: 1px solid var(--linha-cobre);
}
@media (min-width: 700px) { .reservar-grelha { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .reservar-grelha { grid-template-columns: 1.1fr 1fr 1fr; } }
.reservar h3 { font-size: 1.6rem; font-weight: 560; margin-bottom: 16px; }
.reservar .estado { justify-content: flex-start; margin: 0 0 14px; color: var(--sobre-bordo); }
.horario table { width: 100%; border-collapse: collapse; font-size: 1.0625rem; }
.horario th, .horario td { padding: 9px 10px; text-align: left; font-weight: 450; border-bottom: 1px solid var(--linha-cobre); }
.horario th { font-weight: 500; color: var(--sobre-bordo); }
.horario td { text-align: right; color: var(--luz); }
.horario tr.fechado td { color: var(--sobre-bordo-suave); }
.horario tr.hoje th, .horario tr.hoje td { background: var(--hoje); color: var(--luz); font-weight: 650; }
.hoje-marca { margin-left: 8px; font-size: .8125rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--acafrao); }
.morada address { font-style: normal; color: var(--sobre-bordo); }
.morada address strong { color: var(--luz); font-weight: 600; }
.link-ext {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-top: 10px;
  color: var(--luz); font-weight: 650; text-decoration: underline; text-decoration-color: var(--acafrao);
}
.link-ext svg { width: 18px; height: 18px; flex: none; }
.link-ext:hover { text-decoration-thickness: 2px; }
.morada .email { margin-top: 18px; color: var(--sobre-bordo); overflow-wrap: anywhere; }
.extras ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.extras li { position: relative; padding-left: 22px; color: var(--sobre-bordo); }
.extras li::before { content: ""; position: absolute; left: 2px; top: .62em; width: 7px; height: 7px; border-radius: 50%; background: var(--cobre); }

/* ---------- Footer: the table again ---------- */
.rodape { background: var(--mesa); padding: clamp(64px, 8vw, 96px) var(--gutter) 40px; color: var(--luz-suave); font-size: 1rem; }
.rodape-grelha {
  max-width: var(--max); margin: 0 auto;
  display: grid; gap: 36px;
}
@media (min-width: 900px) { .rodape-grelha { grid-template-columns: 1.3fr 1fr 1fr; } }
.rodape .marca { margin-bottom: 18px; }
.rodape h2 { font-family: var(--texto); font-size: .875rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cobre); margin-bottom: 12px; line-height: 1.4; }
.rodape address { font-style: normal; }
.rodape a { color: var(--luz); }
.rodape ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.rodape-fim {
  max-width: var(--max); margin: 48px auto 0; padding-top: 24px;
  border-top: 1px solid var(--linha-escura);
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; font-size: .9375rem;
}
.rodape-fim .idiomas a { min-height: 44px; }

/* ---------- Phone bar (mobile) ---------- */
.barra-ligar {
  position: fixed; z-index: 20;
  left: max(12px, env(safe-area-inset-left)); right: max(12px, env(safe-area-inset-right));
  bottom: max(12px, env(safe-area-inset-bottom));
  display: flex; align-items: center; justify-content: center; gap: 12px;
  min-height: 56px; padding: 0 20px; border-radius: 999px;
  background: var(--porcelana); color: var(--tinta);
  font-weight: 650; text-decoration: none;
  box-shadow: 0 14px 30px -10px rgba(0, 0, 0, .6);
  transform: translateY(calc(100% + 24px)); opacity: 0; visibility: hidden;
  transition: transform .35s var(--ease), opacity .35s var(--ease), visibility 0s linear .35s;
}
.barra-ligar .num { font-family: var(--display); font-weight: 600; }
.barra-ligar.visivel { transform: none; opacity: 1; visibility: visible; transition-delay: 0s; }
@media (min-width: 900px) { .barra-ligar { display: none; } }
/* Keep the end of the footer clear of the phone bar. */
@media (max-width: 899px) { .rodape { padding-bottom: calc(56px + 24px + 40px + env(safe-area-inset-bottom)); } }

/* ---------- Not found ---------- */
.perdido { min-height: 100svh; display: grid; place-items: center; text-align: center; padding: 48px var(--gutter); }
.perdido h1 { font-size: clamp(2.4rem, 1.6rem + 3vw, 4rem); margin: 28px 0 18px; }
.perdido p { color: var(--luz-suave); }
.perdido-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 28px; margin-top: 28px; }
.perdido-links a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .barra-ligar { transform: none; }
}