/* ==========================================================================
   Alma Alentejana: páginas interiores
   Quem Somos, A Casa, Serviços, Experiências, Galeria, Blogue, Artigo,
   Contactos, páginas legais e 404. Depende de tokens, base e site.css.
   ========================================================================== */

/* Topo com fotografia (o cabeçalho começa transparente: data-hero) -------- */
.page-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  align-items: end;
  min-height: clamp(30rem, 74svh, 46rem);
  color: var(--cal-50);
  background: var(--terra-800);
}
.page-hero__media { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.page-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.page-hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgb(31 21 14 / 0.45) 0%, rgb(31 21 14 / 0) 28%, rgb(31 21 14 / 0.15) 55%, rgb(31 21 14 / 0.72) 100%);
}
.page-hero__content {
  display: grid;
  gap: var(--space-5);
  padding-top: calc(var(--header-height) + var(--space-9));
  padding-bottom: clamp(var(--space-8), 5vw, var(--space-10));
}
.page-hero .t-display, .page-hero .t-h1 { color: var(--cal-50); max-width: 16ch; text-shadow: 0 1px 24px rgb(31 21 14 / 0.25); }
.page-hero__lead { max-width: 38rem; color: rgb(253 251 248 / 0.9); }

/* Topo sem fotografia --------------------------------------------------- */
.page-head {
  padding-top: calc(var(--header-height) + clamp(var(--space-8), 6vw, var(--space-10)));
  padding-bottom: clamp(var(--space-7), 4vw, var(--space-9));
}
.page-head__inner { display: grid; gap: var(--space-5); justify-items: start; }
.page-head__inner > .t-lead { max-width: 40rem; color: var(--color-text-muted); }
.page-head--split .page-head__inner { grid-template-columns: 1.2fr 1fr; align-items: end; gap: var(--space-5) var(--space-9); }
.page-head--split .page-head__title { display: grid; gap: var(--space-5); justify-items: start; }
@media (max-width: 1024px) {
  .page-head--split .page-head__inner { grid-template-columns: 1fr; }
}

/* Migalhas de pão */
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: var(--space-2); padding: 0; margin: 0; list-style: none; font-size: var(--text-caption); color: var(--color-text-muted); }
.breadcrumbs li + li::before { content: "/"; margin-right: var(--space-2); opacity: 0.6; }
.breadcrumbs a { transition: color var(--dur-fast) var(--ease-standard); }
@media (hover: hover) { .breadcrumbs a:hover { color: var(--color-brand); } }
.page-hero .breadcrumbs ol { color: rgb(253 251 248 / 0.8); }

/* Texto longo -------------------------------------------------------------- */
.prose-lg { max-width: 42rem; }
.prose-lg > * + * { margin-top: var(--space-5); }
.prose-lg > h2 { margin-top: var(--space-9); }
.prose-lg > h3 { margin-top: var(--space-7); }
.prose-lg > h2 + *, .prose-lg > h3 + * { margin-top: var(--space-4); }
.prose-lg p, .prose-lg li { color: var(--color-text); }
.prose-lg ul, .prose-lg ol { padding-left: 1.25rem; display: grid; gap: var(--space-2); }
.prose-lg li::marker { color: var(--color-brand-soft); }
.prose-lg a:not(.btn) { color: var(--color-brand); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
.prose-lg strong { font-weight: var(--weight-semi); color: var(--color-heading); }

/* Citação destacada */
.pull-quote {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(1.625rem, 1.3rem + 1.4vw, 2.5rem);
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--color-heading);
  text-wrap: balance;
}
.pull-quote--center { text-align: center; margin-inline: auto; max-width: 34ch; }

/* Duas colunas: texto + imagem */
.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-8) clamp(var(--space-8), 6vw, var(--space-11));
  align-items: center;
}
.split--reverse > :first-child { order: 2; }
.split__media { aspect-ratio: 4 / 5; border-radius: var(--radius-lg); }
.split__copy { display: grid; gap: var(--space-5); justify-items: start; }
@media (max-width: 1024px) {
  .split { grid-template-columns: 1fr; }
  .split--reverse > :first-child { order: 0; }
  .split__media { aspect-ratio: 3 / 2; }
}

/* Tabela simples (distâncias, condições, cookies) */
.table-wrap { overflow-x: auto; border-radius: var(--radius-md); border: 1px solid var(--color-line-strong); }
.table { width: 100%; border-collapse: collapse; font-size: var(--text-small); }
.table th, .table td { padding: var(--space-3) var(--space-4); text-align: left; vertical-align: top; border-bottom: 1px solid var(--color-line); }
.table thead th { font-weight: var(--weight-semi); color: var(--color-heading); background: var(--color-bg-alt); white-space: nowrap; }
.table tbody tr:last-child td, .table tbody tr:last-child th { border-bottom: 0; }
.table tbody th { font-weight: var(--weight-medium); color: var(--color-heading); }
.table .num { font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Filtros em forma de pastilha */
.chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.chip {
  padding: 0.5rem 1rem;
  border-radius: var(--radius-pill);
  border: 1px solid var(--color-line-strong);
  font-size: var(--text-small);
  font-weight: var(--weight-medium);
  color: var(--color-text);
  transition: background-color var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), transform var(--dur-base) var(--ease-out);
}
.chip:active { transform: scale(0.95); transition-duration: var(--dur-press); }
.chip[aria-pressed="true"] { background: var(--color-brand); border-color: var(--color-brand); color: var(--color-bg); }
.chip .chip__count { opacity: 0.6; font-variant-numeric: tabular-nums; margin-left: 0.25em; }
@media (hover: hover) { .chip:not([aria-pressed="true"]):hover { border-color: var(--color-brand); } }

/* Nota interna do mockup (não vai para o site) */
.mock-note {
  display: flex;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  border-radius: var(--radius-md);
  border: 1px dashed var(--color-invented);
  color: var(--color-invented);
  font-size: var(--text-small);
}
.mock-note .icon { margin-top: 0.1em; }

/* ==========================================================================
   QUEM SOMOS
   ========================================================================== */
.story__opening { display: grid; gap: var(--space-6); max-width: 52rem; }
.story__opening .t-h1 { max-width: 20ch; }
.story-values { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); padding: 0; margin: 0; list-style: none; }
.story-values li { display: grid; gap: var(--space-3); padding: var(--space-6); border-radius: var(--radius-lg); background: var(--color-bg); }
.story-values .t-small { color: var(--color-text-muted); }
.story-values .t-h3 { color: var(--color-heading); }
@media (max-width: 1024px) { .story-values { grid-template-columns: 1fr; } }
.welcome { display: grid; gap: var(--space-3); justify-items: center; text-align: center; }
.welcome p { font-family: var(--font-display); font-size: clamp(1.75rem, 1.4rem + 1.6vw, 2.75rem); line-height: 1.15; color: var(--color-heading); letter-spacing: -0.015em; }
.welcome p:nth-child(2) { opacity: 0.8; }
.welcome p:nth-child(3) { opacity: 0.6; }

/* ==========================================================================
   A CASA (bloco "Room Details" da VikBooking + conteúdo à volta)
   ========================================================================== */
.casa-head__meta { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); color: var(--color-text-muted); font-size: var(--text-small); }
.casa-head__meta span { display: inline-flex; align-items: center; gap: var(--space-2); }
.casa-head__meta .icon { color: var(--color-brand); }

/* Mosaico de fotografias */
.casa-gallery {
  position: relative;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: repeat(2, clamp(10rem, 18vw, 16rem));
  gap: var(--space-2);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.casa-gallery a { display: block; overflow: hidden; background: var(--color-placeholder); }
.casa-gallery a:first-child { grid-row: 1 / -1; }
.casa-gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur-slow) var(--ease-out); }
@media (hover: hover) { .casa-gallery a:hover img { transform: scale(1.03); } }
.casa-gallery__all {
  position: absolute;
  right: var(--space-4);
  bottom: var(--space-4);
}
@media (max-width: 767px) {
  .casa-gallery { grid-template-columns: 1fr 1fr; grid-template-rows: 14rem 8rem; margin-inline: calc(var(--gutter) * -1); border-radius: 0; }
  .casa-gallery a:first-child { grid-column: 1 / -1; grid-row: auto; }
  .casa-gallery a:nth-child(n + 4) { display: none; }
}

.casa-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 24rem;
  gap: var(--space-9) clamp(var(--space-8), 5vw, var(--space-11));
  align-items: start;
}
.casa-main > section { padding-block: var(--space-9); border-top: 1px solid var(--color-line-strong); scroll-margin-top: calc(var(--header-height) + var(--space-4)); }
.casa-main > section:first-child { border-top: 0; padding-top: 0; }
.casa-main h2 { margin-bottom: var(--space-6); }
.casa-aside { position: sticky; top: calc(var(--header-height) + var(--space-5)); }
@media (max-width: 1024px) {
  .casa-layout { grid-template-columns: minmax(0, 1fr); }
  .casa-aside { position: static; }
}

/* Pisos */
.floors { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.floor { display: grid; align-content: start; gap: var(--space-3); padding: var(--space-5); border-radius: var(--radius-md); background: var(--color-bg-alt); }
.floor ul { display: grid; gap: var(--space-2); padding: 0; margin: 0; list-style: none; font-size: var(--text-small); }
.floor li { display: flex; gap: var(--space-2); }
.floor li::before { content: ""; flex: none; width: 5px; height: 5px; margin-top: 0.6em; border-radius: 50%; background: var(--color-brand-soft); }
@media (max-width: 767px) { .floors { grid-template-columns: 1fr; } }

/* Quartos */
.rooms { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-6) var(--space-4); padding: 0; margin: 0; list-style: none; }
.room { display: grid; gap: var(--space-2); }
.room__media { aspect-ratio: 3 / 2; margin-bottom: var(--space-2); }
.room .t-h4 { color: var(--color-heading); }
@media (max-width: 600px) { .rooms { grid-template-columns: 1fr; } }

/* Comodidades agrupadas */
.amenity-groups { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-7) var(--space-6); }
.amenity-group h3 { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-3); color: var(--color-heading); }
.amenity-group h3 .icon { color: var(--color-brand); }
.amenity-group ul { display: grid; gap: var(--space-2); padding: 0; margin: 0; list-style: none; font-size: var(--text-small); color: var(--color-text); }
.amenity-group li { display: flex; gap: var(--space-2); }
.amenity-group li .icon { width: 1.05rem; height: 1.05rem; margin-top: 0.15em; color: var(--oliva-600); }
@media (max-width: 600px) { .amenity-groups { grid-template-columns: 1fr; } }

/* Regras */
.rules { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-3); padding: 0; margin: 0; list-style: none; }
.rules li { display: flex; gap: var(--space-3); align-items: flex-start; padding: var(--space-4); border-radius: var(--radius-md); border: 1px solid var(--color-line); font-size: var(--text-small); }
.rules .icon { color: var(--color-brand); margin-top: 0.05em; }
.rules strong { display: block; color: var(--color-heading); font-weight: var(--weight-semi); }
@media (max-width: 600px) { .rules { grid-template-columns: 1fr; } }

/* Calendário de disponibilidade */
.calendar { display: grid; gap: var(--space-5); }
.calendar__bar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.calendar__nav { display: flex; gap: var(--space-2); }
.calendar__nav .btn-circle { width: 2.5rem; height: 2.5rem; }
.calendar__months { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-8); }
.calendar__month h3 { margin-bottom: var(--space-3); font-family: var(--font-serif); font-size: var(--text-h4); color: var(--color-heading); }
.calendar__month h3::first-letter { text-transform: uppercase; }
.calendar__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px 0; text-align: center; }
.calendar__dow { padding-block: var(--space-2); font-size: var(--text-caption); color: var(--color-text-muted); }
.calendar__day {
  position: relative;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  font-size: var(--text-small);
  font-variant-numeric: tabular-nums;
  border-radius: 50%;
  transition: background-color var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard), transform var(--dur-base) var(--ease-out);
}
button.calendar__day:active { transform: scale(0.9); transition-duration: var(--dur-press); }
@media (hover: hover) { button.calendar__day:hover { background: var(--color-bg-alt); } }
.calendar__day:disabled { color: var(--ink-400); cursor: default; }
.calendar__day.is-booked { color: var(--ink-400); text-decoration: line-through; text-decoration-color: rgb(107 91 79 / 0.5); }
.calendar__day.is-today::after { content: ""; position: absolute; bottom: 14%; width: 4px; height: 4px; border-radius: 50%; background: var(--color-brand-soft); }
.calendar__day.in-range { background: var(--ocre-100); border-radius: 0; }
.calendar__day.is-start, .calendar__day.is-end { background: var(--color-brand); color: var(--color-bg); }
.calendar__day.is-start { border-radius: 50% 0 0 50%; }
.calendar__day.is-end { border-radius: 0 50% 50% 0; }
.calendar__day.is-start.is-end { border-radius: 50%; }
.calendar__legend { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); font-size: var(--text-caption); color: var(--color-text-muted); }
.calendar__legend span { display: inline-flex; align-items: center; gap: var(--space-2); }
.calendar__legend i { width: 0.85rem; height: 0.85rem; border-radius: 50%; border: 1px solid var(--color-line-strong); }
.calendar__legend .lg-booked { background: repeating-linear-gradient(135deg, var(--cal-300) 0 2px, transparent 2px 4px); }
.calendar__legend .lg-sel { background: var(--color-brand); border-color: var(--color-brand); }
@media (max-width: 767px) {
  .calendar__months { grid-template-columns: 1fr; }
  .calendar__month + .calendar__month { display: none; }
}

/* Caixa de reserva (formulário do bloco Room Details) */
.booking-card {
  display: grid;
  gap: var(--space-5);
  padding: var(--space-6);
  border-radius: var(--radius-lg);
  background: var(--color-bg-raised);
  border: 1px solid var(--color-line);
  box-shadow: var(--shadow-md);
}
.booking-card__price { display: flex; align-items: baseline; gap: var(--space-2); }
.booking-card__price strong { font-family: var(--font-display); font-size: 2.25rem; font-weight: var(--weight-regular); line-height: 1; color: var(--color-heading); }
.booking-card__fields { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--color-line-strong); border-radius: var(--radius-md); overflow: hidden; }
.booking-card__field { display: grid; gap: 2px; padding: var(--space-3) var(--space-4); cursor: pointer; }
.booking-card__field + .booking-card__field { border-left: 1px solid var(--color-line-strong); }
.booking-card__field--full { grid-column: 1 / -1; border-left: 0 !important; border-top: 1px solid var(--color-line-strong); display: flex; align-items: center; justify-content: space-between; cursor: default; }
.booking-card__label { font-size: var(--text-eyebrow); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; font-weight: var(--weight-semi); color: var(--color-text-muted); }
.booking-card input[type="date"] { border: 0; padding: 0; background: none; font: inherit; font-weight: var(--weight-medium); color: var(--color-heading); width: 100%; outline: none; min-height: 1.6em; }
.booking-card .stepper__btn { border-color: var(--color-line-strong); }
.booking-card .stepper__btn:active { background: var(--color-bg-alt); }
.booking-card .btn { width: 100%; }
.booking-card__lines { display: grid; gap: var(--space-2); font-size: var(--text-small); }
.booking-card__lines div { display: flex; justify-content: space-between; gap: var(--space-4); }
.booking-card__lines .is-total { padding-top: var(--space-3); border-top: 1px solid var(--color-line); font-weight: var(--weight-semi); color: var(--color-heading); font-size: var(--text-body); }
.booking-card__note { font-size: var(--text-caption); color: var(--color-text-muted); text-align: center; }
.booking-card__help { display: flex; gap: var(--space-3); padding-top: var(--space-4); border-top: 1px solid var(--color-line); font-size: var(--text-caption); color: var(--color-text-muted); }

/* Barra fixa de reserva em mobile */
.mobile-book {
  position: fixed;
  inset: auto 0 0;
  z-index: var(--z-raised);
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-3) var(--gutter) max(var(--space-3), env(safe-area-inset-bottom));
  background: var(--material-light-bg);
  -webkit-backdrop-filter: var(--material-light-blur);
  backdrop-filter: var(--material-light-blur);
  box-shadow: 0 -1px 0 var(--color-line), 0 -12px 24px rgb(44 30 21 / 0.06);
}
.mobile-book strong { font-family: var(--font-display); font-size: 1.5rem; font-weight: var(--weight-regular); color: var(--color-heading); }
@media (max-width: 1024px) {
  .mobile-book { display: flex; }
  .page-casa .site-footer { padding-bottom: calc(var(--space-6) + 4.5rem); }
  .page-casa .cookie-banner { bottom: calc(max(var(--space-4), env(safe-area-inset-bottom)) + 4.5rem); }
}

/* ==========================================================================
   SERVIÇOS (estrutura proposta no documento "Serviços da Casa")
   ========================================================================== */
.service-intro { max-width: 44rem; margin-inline: auto; text-align: center; }
.service-card {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  overflow: hidden;
  border-radius: var(--radius-lg);
  background: var(--color-bg-raised);
  box-shadow: var(--shadow-md);
}
.service-card__media { border-radius: 0; min-height: 26rem; }
.service-card__body { display: grid; align-content: center; gap: var(--space-5); justify-items: start; padding: clamp(var(--space-6), 4vw, var(--space-10)); }
.service-card__icon { width: 3rem; height: 3rem; padding: 0.7rem; border-radius: 50%; background: var(--ocre-100); color: var(--terra-700); }
.check-list { display: grid; gap: var(--space-3); padding: 0; margin: 0; list-style: none; }
.check-list li { display: flex; gap: var(--space-3); }
.check-list .icon { color: var(--oliva-600); margin-top: 0.15em; }
@media (max-width: 900px) {
  .service-card { grid-template-columns: 1fr; }
  .service-card__media { min-height: 0; aspect-ratio: 3 / 2; }
}
.conditions { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4); padding: 0; margin: 0; }
.conditions div { display: grid; gap: var(--space-2); padding: var(--space-5); border-radius: var(--radius-md); background: var(--color-bg); }
.conditions dt { font-size: var(--text-eyebrow); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; font-weight: var(--weight-semi); color: var(--color-brand-soft); }
.conditions dd { color: var(--color-heading); }
@media (max-width: 1024px) { .conditions { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .conditions { grid-template-columns: 1fr; } }
.actions-row { display: flex; flex-wrap: wrap; gap: var(--space-3); justify-content: center; }

/* ==========================================================================
   EXPERIÊNCIAS
   ========================================================================== */
.places { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-8) var(--space-6); padding: 0; margin: 0; list-style: none; }
.places--3 { grid-template-columns: repeat(3, 1fr); }
.place { display: grid; align-content: start; gap: var(--space-3); }
.place__media { aspect-ratio: 3 / 2; margin-bottom: var(--space-2); }
.place .t-h3 { color: var(--color-heading); }
.place__meta { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--text-caption); font-weight: var(--weight-medium); color: var(--color-brand-soft); }
.theme-dark .place__meta { color: var(--color-highlight); }
.place__meta .icon { width: 1rem; height: 1rem; }
.place .link-arrow { justify-self: start; margin-top: var(--space-1); font-size: var(--text-small); }
.place ul { display: grid; gap: var(--space-2); padding-left: 1.1rem; font-size: var(--text-small); }
@media (max-width: 1024px) { .places--3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .places, .places--3 { grid-template-columns: 1fr; } }

.food-list { display: grid; padding: 0; margin: 0; list-style: none; border-top: 1px solid var(--color-line-strong); }
.food-list li { display: grid; grid-template-columns: 16rem 1fr auto; gap: var(--space-3) var(--space-7); padding-block: var(--space-6); border-bottom: 1px solid var(--color-line-strong); align-items: baseline; }
.food-list .t-h3 { color: var(--color-heading); }
.food-list .t-caption { white-space: nowrap; }
@media (max-width: 900px) { .food-list li { grid-template-columns: 1fr; } }

.ideas { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); padding: 0; margin: 0; list-style: none; counter-reset: idea; }
.idea { display: grid; align-content: start; gap: var(--space-3); padding: var(--space-6); border-radius: var(--radius-lg); background: var(--color-bg-raised); counter-increment: idea; }
.idea::before { content: counter(idea, decimal-leading-zero); font-family: var(--font-display); font-size: 1.125rem; color: var(--color-brand-soft); }
.idea .t-h3 { color: var(--color-heading); }
@media (max-width: 1024px) { .ideas { grid-template-columns: 1fr; } }

/* ==========================================================================
   GALERIA + VISUALIZADOR
   ========================================================================== */
.gallery-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-7); }
.gallery-grid { columns: 3 18rem; column-gap: var(--space-3); padding: 0; margin: 0; list-style: none; }
.gallery-grid li { break-inside: avoid; margin-bottom: var(--space-3); }
.gallery-grid li[hidden] { display: none; }
.gallery-grid button { display: block; width: 100%; overflow: hidden; border-radius: var(--radius-md); background: var(--color-placeholder); transition: transform var(--dur-base) var(--ease-out); }
.gallery-grid button:active { transform: scale(0.98); transition-duration: var(--dur-press); }
.gallery-grid img { width: 100%; height: auto; transition: transform var(--dur-slow) var(--ease-out), opacity var(--dur-base) var(--ease-standard); }
@media (hover: hover) { .gallery-grid button:hover img { transform: scale(1.03); } }
.gallery-grid li:nth-child(3n + 2) img { aspect-ratio: 4 / 5; object-fit: cover; }

.lightbox { position: fixed; inset: 0; z-index: var(--z-sheet); color: var(--cal-50); touch-action: none; }
.lightbox[hidden] { display: none; }
.lightbox__scrim { position: absolute; inset: 0; background: rgb(20 14 10 / 0.94); opacity: 0; }
.lightbox__stage { position: absolute; inset: 0; overflow: hidden; }
.lightbox__track { display: flex; height: 100%; will-change: transform; }
.lightbox__slide { flex: 0 0 100%; display: grid; grid-template: minmax(0, 1fr) / minmax(0, 1fr); padding: 4.5rem var(--space-4) 5rem; }
/* A imagem ocupa a célula toda e é "contida" (o JS calcula o retângulo visível) */
.lightbox__slide img { width: 100%; height: 100%; object-fit: contain; -webkit-user-drag: none; user-select: none; pointer-events: none; }
.lightbox__fly { position: fixed; z-index: 1; object-fit: cover; border-radius: var(--radius-md); pointer-events: none; transform-origin: 0 0; }
.lightbox__top, .lightbox__bottom { position: absolute; inset-inline: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-4) var(--gutter); opacity: 0; }
.lightbox__top { top: 0; }
.lightbox__bottom { bottom: 0; padding-bottom: max(var(--space-4), env(safe-area-inset-bottom)); }
.lightbox .btn-circle { border-color: rgb(255 255 255 / 0.3); color: var(--cal-50); background: rgb(255 255 255 / 0.06); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
@media (hover: hover) { .lightbox .btn-circle:hover { background: var(--cal-50); color: var(--terra-800); } }
.lightbox__count { font-size: var(--text-small); font-variant-numeric: tabular-nums; color: rgb(253 251 248 / 0.8); }
.lightbox__caption { font-size: var(--text-small); color: rgb(253 251 248 / 0.85); max-width: 40rem; }
.lightbox__arrows { display: flex; gap: var(--space-2); }
@media (max-width: 767px) { .lightbox__arrows { display: none; } }

/* ==========================================================================
   BLOGUE E ARTIGO
   ========================================================================== */
.post-feature { display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--space-6) var(--space-9); align-items: center; margin-bottom: var(--space-block); }
.post-feature__media { aspect-ratio: 4 / 3; border-radius: var(--radius-lg); }
.post-feature__body { display: grid; gap: var(--space-4); justify-items: start; }
.post-feature__body .t-h2 { color: var(--color-heading); }
@media (max-width: 1024px) { .post-feature { grid-template-columns: 1fr; } }

.article__head { display: grid; gap: var(--space-5); justify-items: start; max-width: 46rem; }
.article__meta { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); font-size: var(--text-small); color: var(--color-text-muted); }
.article__cover { aspect-ratio: 21 / 9; border-radius: var(--radius-lg); margin-block: var(--space-8); }
.article__layout { display: grid; grid-template-columns: minmax(0, 42rem) 1fr; gap: var(--space-10); align-items: start; }
.article__toc { position: sticky; top: calc(var(--header-height) + var(--space-6)); display: grid; gap: var(--space-3); font-size: var(--text-small); }
.article__toc ol { display: grid; gap: var(--space-2); padding: 0; margin: 0; list-style: none; border-left: 1px solid var(--color-line-strong); }
.article__toc a { display: block; padding-left: var(--space-4); margin-left: -1px; border-left: 1px solid transparent; color: var(--color-text-muted); transition: color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard); }
.article__toc a[aria-current="true"] { color: var(--color-brand); border-left-color: var(--color-brand); }
@media (hover: hover) { .article__toc a:hover { color: var(--color-heading); } }
@media (max-width: 1024px) {
  .article__layout { grid-template-columns: minmax(0, 1fr); }
  .article__toc { display: none; }
}
.article__cta { display: grid; gap: var(--space-4); justify-items: start; padding: var(--space-7); margin-top: var(--space-9); border-radius: var(--radius-lg); background: var(--color-bg-alt); }

/* ==========================================================================
   CONTACTOS
   ========================================================================== */
.contact-grid { display: grid; grid-template-columns: 1fr 1.25fr; gap: var(--space-9) clamp(var(--space-8), 5vw, var(--space-11)); align-items: start; }
.contact-cards { display: grid; gap: var(--space-3); }
.contact-card { display: flex; gap: var(--space-4); align-items: flex-start; padding: var(--space-5); border-radius: var(--radius-md); background: var(--color-bg-alt); transition: transform var(--dur-base) var(--ease-out); }
a.contact-card:active { transform: scale(0.98); transition-duration: var(--dur-press); }
.contact-card .icon { color: var(--color-brand); margin-top: 0.1em; }
.contact-card strong { display: block; color: var(--color-heading); font-weight: var(--weight-semi); }
.contact-form { display: grid; gap: var(--space-5); padding: clamp(var(--space-6), 4vw, var(--space-9)); border-radius: var(--radius-lg); background: var(--color-bg-raised); box-shadow: var(--shadow-md); }
.contact-map { aspect-ratio: 21 / 9; margin-top: var(--space-block); }
@media (max-width: 1024px) {
  .contact-grid { grid-template-columns: minmax(0, 1fr); }
  .contact-map { aspect-ratio: 4 / 3; }
}

/* ==========================================================================
   PÁGINAS LEGAIS
   ========================================================================== */
.legal { display: grid; grid-template-columns: 16rem minmax(0, 46rem); gap: var(--space-10); align-items: start; }
.legal__toc { position: sticky; top: calc(var(--header-height) + var(--space-6)); display: grid; gap: var(--space-3); font-size: var(--text-small); }
.legal__toc ol { display: grid; gap: var(--space-2); padding: 0; margin: 0; list-style: none; }
.legal__toc a { color: var(--color-text-muted); }
@media (hover: hover) { .legal__toc a:hover { color: var(--color-brand); } }
.legal .prose-lg h2 { font-family: var(--font-serif); font-size: var(--text-h3); line-height: var(--leading-h3); color: var(--color-heading); scroll-margin-top: calc(var(--header-height) + var(--space-5)); }
.legal .prose-lg h3 { font-family: var(--font-serif); font-size: var(--text-h4); color: var(--color-heading); }
.legal .table-wrap { margin-block: var(--space-5); }
@media (max-width: 1024px) {
  .legal { grid-template-columns: minmax(0, 1fr); }
  .legal__toc { position: static; padding: var(--space-5); border-radius: var(--radius-md); background: var(--color-bg-alt); }
}

/* ==========================================================================
   404
   ========================================================================== */
.not-found { min-height: 100svh; display: grid; align-content: center; padding-block: calc(var(--header-height) + var(--space-8)) var(--space-10); }
.not-found__inner { display: grid; gap: var(--space-5); justify-items: start; max-width: 40rem; }
.not-found__code { font-family: var(--font-display); font-size: clamp(5rem, 3rem + 10vw, 11rem); line-height: 0.9; color: var(--cal-300); letter-spacing: -0.03em; }
.not-found__links { display: flex; flex-wrap: wrap; gap: var(--space-3); }