/* Direção visual: fotografia, tipografia editorial e tons de couro. */
:root {
  --bg: #151310;
  --panel: #1e1b16;
  --cream: #f3ecdf;
  --gold: #d9b17b;
  --muted: #aea393;
  --line: #dac4a329;
  --serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sans: 'Manrope', 'Segoe UI', Arial, sans-serif;
  --header-height: 88px;
  --action-height: 48px;
  --action-radius: 4px;
  --action-bg: rgba(15,12,9,.55);
  --action-border: rgba(217,178,124,.45);
  --action-ghost-hover: rgba(217,178,124,.14);
  --action-gold: #d9b27c;
  --action-hover: #e8c796;
  --action-active: #c99a5b;
  --action-cream: #f3e9d8;
  --action-dark: #1a130c;
  --action-focus: #e8c796;
  --action-transition: 180ms ease;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 28px; scrollbar-color: #796044 #151310; }
body { margin: 0; background: var(--bg); color: var(--cream); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; border: 0; cursor: pointer; }
button, a { -webkit-tap-highlight-color: transparent; }
p, h1, h2, h3 { margin: 0; }
h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }
::selection { background: var(--gold); color: var(--bg); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--gold); outline-offset: 6px; }
em { font-weight: 400; color: var(--gold); }
.container { width: min(88%, 1280px); margin-inline: auto; }
.section { padding-block: 100px; }
.icon { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.svg-symbols { position: absolute; width: 0; height: 0; overflow: hidden; }
.skip-link { position: fixed; z-index: 50; top: -80px; left: 20px; padding: 15px; background: var(--cream); color: var(--bg); }
.skip-link:focus { top: 12px; }
.eyebrow { font-size: 9px; font-weight: 500; letter-spacing: 2.3px; line-height: 1.6; color: var(--gold); }
.button { min-height: 54px; display: inline-flex; align-items: center; justify-content: space-between; gap: 42px; padding: 17px 24px; font-size: 13px; font-weight: 500; border-radius: 3px; transition: background .25s, border-color .25s, transform .25s; }
.button .icon { width: 18px; height: 18px; transition: transform .25s; }
.button:hover .icon { transform: translate(2px, -2px); }
.button-gold { background: linear-gradient(115deg, #e6c492, #d6ac72); color: #261e15; border: 1px solid #f2d8ad55; box-shadow: 0 5px 24px #00000018; }
.button-gold:hover { background: #ebc99a; box-shadow: 0 7px 26px #00000026; }

/* Marca e acessos, sem divisórias ou navegação secundária. */



/* Diálogos */
dialog { max-width: 475px; width: calc(100% - 32px); max-height: calc(100vh - 32px); max-height: calc(100svh - 32px); overflow-y: auto; padding: 45px; border-radius: 5px; border: 1px solid #be986650; background: #211b14; color: var(--cream); }
dialog::backdrop { background: #000b; backdrop-filter: blur(8px); }
dialog .eyebrow { font-size: 8px; margin-bottom: 25px; }
dialog h2 { font-family: var(--serif); font-size: 46px; line-height: 1; font-weight: 400; margin-bottom: 23px; }
dialog > p:not(.eyebrow) { font-size: 12px; color: #b6a68e; line-height: 1.9; }
dialog .button { margin-top: 27px; width: 100%; font-size: 11px; }
.close { position: absolute; top: 10px; right: 15px; min-width: 44px; min-height: 44px; font-size: 27px; color: #ac9678; background: transparent; }
body:has(dialog[open]) { overflow: hidden; }

/* Celular */
@media (max-width: 900px) {
  .container { width: 88%; }
  .section { padding-block: 58px; }
  .eyebrow { font-size: 9px; letter-spacing: 1.8px; }
  dialog { padding: 38px 25px; }
  dialog h2 { font-size: 40px; }
}

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


/* Duas ações de conta: visíveis no cabeçalho em qualquer largura. */

/* Abertura: marca dominante e informações na mesma coluna visual. */

/* Hero — uma única composição, com escala de espaçamento de 8px. */
.hero {
  --hero-bg: #0f0c09;
  --hero-gold: #d9b27c;
  --hero-cream: #f3e9d8;
  --hero-space: 8px;
  --hero-actions-gap: calc(var(--hero-space) * 5);
  --hero-content-radius: var(--action-radius);
  --hero-label-font: 'Cinzel', Georgia, serif;
  --hero-brand-font: var(--serif);
  --hero-eyebrow-font: var(--hero-brand-font);
  --hero-eyebrow-size: .3em;
  --hero-eyebrow-tracking: .28em;
  --hero-title-ink: #f3e9d8;
  --hero-eyebrow-ink: #e8c796;
  --hero-lockup-gap: 18px;
  --hero-lockup-shadow: 0 2px 4px rgba(0,0,0,.65), 0 4px 18px rgba(0,0,0,.4);
  --hero-title-size: clamp(4rem, 6.8vw, 6.25rem);
  --hero-header-clearance: calc(var(--hero-space) * 9);
  --hero-align-inset: 8px;
  --hero-shade-start: rgba(15,12,9,.90);
  --hero-shade-inner: rgba(15,12,9,.72);
  --hero-shade-edge: rgba(15,12,9,.35);
  --hero-bottom-shade: rgba(15,12,9,.65);
  --hero-color-wash: rgba(40,22,10,.22);
  position: relative;
  isolation: isolate;
  display: grid;
  align-items: center;
  min-height: 100vh;
  min-height: max(720px, 100svh);
  overflow: hidden;
  background: var(--hero-bg);
  color: var(--hero-cream);
}
.hero-image {
  position: absolute;
  z-index: -5;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% 20%;
}
.hero-tint {
  position: absolute;
  z-index: -4;
  inset: 0;
  background: var(--hero-color-wash);
  mix-blend-mode: multiply;
  pointer-events: none;
}
.hero::before {
  content: '';
  position: absolute;
  z-index: -3;
  inset: 0;
  background: linear-gradient(to right, var(--hero-shade-start) 0%, var(--hero-shade-inner) 28%, var(--hero-shade-edge) 48%, transparent 66%);
  pointer-events: none;
}
.hero::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 200px;
  z-index: -2;
  background: linear-gradient(to top, var(--hero-bottom-shade), transparent);
  pointer-events: none;
}
.hero-content.container {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 48px;
  align-items: center;
  width: 100%;
  max-width: none;
  padding: calc(var(--nav-height) + var(--hero-header-clearance) + var(--nav-announcement-height, 0px)) calc(var(--nav-side) + var(--hero-align-inset)) calc(var(--hero-header-clearance) + var(--hero-space) * 5);
  margin-inline: auto;
}
.hero-identity { width: 100%; max-width: 500px; min-width: 0; text-align: left; }
.hero-lockup { position: relative; isolation: isolate; vertical-align: bottom; display: inline-flex; flex-direction: column; align-items: stretch; width: fit-content; max-width: 100%; font-size: var(--hero-title-size); }
.hero-eyebrow { width: 100%; min-width: 100%; max-width: 0; margin: 0 calc(-1 * var(--hero-eyebrow-tracking)) var(--hero-lockup-gap) var(--hero-eyebrow-offset, -.02em); font-family: var(--hero-eyebrow-font); font-size: var(--hero-eyebrow-size); font-weight: 600; line-height: 1.5; letter-spacing: var(--hero-eyebrow-tracking); text-transform: uppercase; white-space: nowrap; color: var(--hero-eyebrow-ink); text-shadow: var(--hero-lockup-shadow); }
.hero h1 { width: max-content; margin: 0 0 0 -.03em; font-family: var(--hero-brand-font); font-size: inherit; font-weight: 600; line-height: 1; letter-spacing: .005em; white-space: nowrap; color: var(--hero-title-ink); text-shadow: var(--hero-lockup-shadow); }
.hero-brand-location {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: calc(var(--hero-space) * 3);
  font-family: var(--sans);
  font-size: 15.5px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .01em;
  color: color-mix(in srgb, var(--hero-cream) 94%, transparent);
  text-wrap: balance;
  text-shadow: 0 1px 8px rgba(0,0,0,.45);
}
.hero-location-pin {
  display: block;
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  color: var(--hero-gold);
}
.hero-description { max-width: 500px; margin: calc(var(--hero-space) * 4) 0 0; font-family: var(--sans); font-size: 17px; line-height: 1.75; font-weight: 400; letter-spacing: .005em; color: color-mix(in srgb, var(--hero-cream) 88%, transparent); text-wrap: balance; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 28px; margin-top: var(--hero-actions-gap); }
.hero-actions .hero-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: var(--action-height);
  min-height: var(--action-height);
  padding: 0 24px;
  border: 1px solid var(--action-gold);
  border-radius: 5px;
  background: var(--action-gold);
  color: var(--action-dark);
  font-family: var(--sans);
  font-size: var(--nav-font-size);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
  text-transform: none;
  box-shadow: inset 0 1px 0 rgba(243,233,216,.035);
  transform: none;
  transition: background-color var(--action-transition), border-color var(--action-transition);
}
.hero-actions .hero-primary:hover { background: var(--action-hover); border-color: var(--action-hover); box-shadow: none; transform: none; }
.hero-actions .hero-primary:active { background: var(--action-active); border-color: var(--action-active); }
.hero-actions .hero-primary:focus-visible { outline: 2px solid var(--action-hover); outline-offset: 3px; }

@media (min-width: 768px) and (max-width: 1023px) {
  .hero { --hero-title-size: clamp(3.5rem, 8vw, 4.75rem); }
}
@media (max-width: 1100px) and (min-width: 768px) {
  .hero-content.container { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); column-gap: 32px; }
}
@media (max-width: 767px) {
  .hero-content.container { grid-template-columns: minmax(0, 1fr); padding: calc(var(--nav-height) + var(--hero-header-clearance) + var(--nav-announcement-height, 0px)) calc(var(--nav-side) + var(--hero-align-inset)) calc(var(--hero-header-clearance) + var(--hero-space) * 5); }
  .hero-image { object-position: 70% 30%; }
  .hero::before { background: linear-gradient(to top, rgba(15,12,9,.92) 0%, rgba(15,12,9,.75) 45%, rgba(15,12,9,.3) 100%); }
  .hero { --hero-title-size: clamp(3.25rem, 14vw, 4rem); --hero-align-inset: 4px; --hero-lockup-gap: 14px; }
}

@media (max-width: 767px) {
  .hero-actions { width: 100%; }
  .hero-actions .hero-primary { width: 100%; }
}

/* Informações corridas: sem cards, colunas ou divisórias. */
.hero-whatsapp { display: inline-flex; align-items: center; min-height: 44px; font-family: var(--sans); font-size: 15.5px; line-height: 1.5; color: var(--hero-cream); text-decoration: underline; text-decoration-color: transparent; text-decoration-thickness: 1px; text-underline-offset: 6px; transition: text-decoration-color 220ms ease; }
.hero-whatsapp:hover { text-decoration-color: var(--hero-gold); }
.hero-whatsapp:focus-visible { outline: 2px solid #e8c796; outline-offset: 3px; }
@media (max-width: 767px) {
  .hero-actions { flex-direction: column; align-items: stretch; gap: 16px; }
  .hero-whatsapp { align-self: center; }
  .hero-description { max-width: 100%; }
  .hero-brand-location { font-size: 14px; gap: 8px; }
}

/* Entrada leve: o conteúdo permanece visível se JavaScript não estiver disponível. */

/* Pino neutro na abertura, acompanhando a cor do texto. */
.hero .hero-brand-location .hero-location-pin { color:var(--hero-cream); }

/* Assinatura aprovada com cavalo, preservando a proporção da arte. */
.public-home .hero .hero-lockup-artwork { display:flex; width:100%; max-width:500px; }
.public-home .hero .hero-artwork-title { position:relative; width:92%; max-width:460px; aspect-ratio:2.6; margin:0 0 0 clamp(-68px,calc(-6vw + 36px),-20px); overflow:hidden; line-height:0; }
.public-home .hero .hero-signature { position:absolute; top:50%; left:-4.5%; display:block; width:110%; max-width:none; height:auto; transform:translateY(-50%); object-fit:contain; }
/* Duas regiões da mesma arte: só o cavalo diminui, sem redimensionar o texto. */
.public-home .hero .hero-signature-text { clip-path:inset(0 0 0 31.5%); }
.public-home .hero .hero-signature-horse { clip-path:inset(0 68.5% 0 0); transform:translateY(-50%) scale(.9); transform-origin:31.5% 50%; pointer-events:none; }
.public-home .hero-description-artwork { position:relative; top:-8px; left:12px; width:76%; max-width:380px; aspect-ratio:6.5; margin-top:32px; margin-left:calc(clamp(-68px,calc(-6vw + 36px),-20px) + 40px); overflow:hidden; }
.public-home .hero-description-artwork img { position:absolute; top:50%; left:-5%; display:block; width:110%; max-width:none; height:auto; transform:translateY(-50%); }
.public-home .hero .hero-actions { position:relative; top:-8px; left:12px; margin-top:40px; }
.public-home .hero .hero-primary-artwork { position:relative; display:block; width:228px; max-width:100%; height:52px; min-height:52px; margin-left:calc(clamp(-68px,calc(-6vw + 36px),-20px) + 62px); padding:0; overflow:hidden; border:0; border-radius:6px; background:transparent; box-shadow:none; filter:drop-shadow(0 3px 5px rgba(15,12,9,.22)); }
.public-home .hero .hero-primary-artwork img { position:absolute; top:50%; left:0; display:block; width:100%; max-width:none; height:auto; transform:translateY(-50%); pointer-events:none; }
.public-home .hero .hero-primary-artwork:hover { background:transparent; filter:brightness(1.04) drop-shadow(0 3px 5px rgba(15,12,9,.22)); }
.public-home .hero .hero-primary-artwork:focus-visible { outline:2px solid var(--hero-cream); outline-offset:4px; }
@media (min-width:1025px) {
  .public-home .hero .hero-primary-artwork { left:12px; }
  .public-home .hero-description-artwork,
  .public-home .hero .hero-actions { left:30px; }
}
@media (max-width:767px) {
  .public-home .hero-content.container { padding-inline:20px; }
  .public-home .hero .hero-artwork-title { width:100%; max-width:100%; margin:0; left:-10px; top:-12px; }
  .public-home .hero-description-artwork { top:-14px; left:0; width:94%; max-width:100%; margin:24px auto 0; }
  .public-home .hero .hero-actions { top:-14px; left:0; width:100%; margin:24px 0 0; justify-items:center; }
  .public-home .hero .hero-primary-artwork { display:flex; align-items:center; justify-content:center; width:fit-content; max-width:100%; height:52px; min-height:52px; margin:0; padding:0 24px; border:1px solid #b58b4b; background:var(--action-gold); color:var(--action-dark); font-family:'Inter',sans-serif; font-size:16px; font-weight:600; line-height:1.4; }
  .public-home .hero .hero-primary-artwork img { display:none; }
  .public-home .hero .hero-primary-artwork::after { content:attr(aria-label); }
  .public-home .hero .hero-primary-artwork:hover { background:var(--action-hover); }
}