/* Cabeçalho, navegação e primeira dobra. */
.site-header { position: absolute; z-index: 20; inset: 0 0 auto; color: var(--white); }
.site-header.is-scrolled { position: fixed; background: rgba(27,59,48,.94); box-shadow: 0 8px 30px rgba(0,0,0,.1); backdrop-filter: blur(16px); }
.header-inner { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 2.5rem; min-height: 6.75rem; }
.brand { display: inline-flex; width: 5.75rem; }
.brand img { width: 100%; filter: brightness(0) invert(1); }
.main-nav { display: flex; justify-content: center; gap: clamp(1.2rem, 2.5vw, 2.5rem); }
.main-nav a { position: relative; padding: .7rem 0; font-size: .82rem; font-weight: 700; text-decoration: none; }
.main-nav a::after { position: absolute; inset: auto 0 .35rem; height: 1px; content: ""; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .25s ease; }
.main-nav a:hover::after { transform: scaleX(1); transform-origin: left; }
.site-header .button { border-color: rgba(255,255,255,.55); background: rgba(27,59,48,.3); backdrop-filter: blur(12px); }
.hero { position: relative; display: grid; min-height: 52rem; overflow: hidden; background: var(--forest-950); color: var(--white); }
.hero::before { position: absolute; inset: 0; content: ""; background: radial-gradient(circle at 8% 72%, rgba(185,137,69,.25), transparent 24%), linear-gradient(115deg, rgba(27,59,48,.97) 0 48%, rgba(27,59,48,.57) 72%, rgba(27,59,48,.1)); }
.hero-glow { position: absolute; width: 34rem; height: 34rem; right: -15rem; top: -12rem; border: 1px solid rgba(255,255,255,.17); border-radius: 50%; box-shadow: 0 0 0 5rem rgba(255,255,255,.025), 0 0 0 10rem rgba(255,255,255,.018); }
.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(22rem, .96fr); align-items: center; gap: clamp(3rem, 7vw, 7rem); padding-top: 10rem; padding-bottom: 5rem; }
.hero-copy { max-width: 43rem; }
.hero-copy .eyebrow { color: var(--gold-300); }
.hero h1 { max-width: 12ch; margin-bottom: 1.75rem; }
.hero-lead { max-width: 36rem; color: rgba(255,255,255,.78); font-size: clamp(1.05rem, 1.6vw, 1.28rem); }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.1rem 1.5rem; margin-top: 2.25rem; }
.hero .text-link { color: var(--white); }
.hero-highlights { display: flex; flex-wrap: wrap; gap: .75rem 1.8rem; margin: 2.5rem 0 0; padding: 1.5rem 0 0; border-top: 1px solid rgba(255,255,255,.18); list-style: none; color: rgba(255,255,255,.72); font-size: .8rem; font-weight: 700; }
.hero-highlights li::before { display: inline-block; width: .36rem; height: .36rem; margin-right: .6rem; border-radius: 50%; background: var(--gold-300); content: ""; vertical-align: middle; }
.hero-visual { position: relative; margin: 0; }
.hero-image-wrap { overflow: hidden; aspect-ratio: 4 / 5; border-radius: 15rem 15rem 1.5rem 1.5rem; box-shadow: var(--shadow); }
.hero-image-wrap img { width: 100%; height: 100%; object-fit: cover; }
.hero-visual figcaption { position: absolute; right: -1rem; bottom: 1.75rem; display: flex; align-items: center; gap: .7rem; max-width: 12rem; padding: 1rem 1.15rem; border: 1px solid rgba(255,255,255,.32); border-radius: 1rem; background: rgba(27,59,48,.76); color: rgba(255,255,255,.88); font-family: var(--font-display); line-height: 1.2; backdrop-filter: blur(14px); }
.hero-visual figcaption span { color: var(--gold-300); }
@media (max-width: 62rem) {
  .header-inner { grid-template-columns: auto 1fr; }
  .header-inner > .button { display: none; }
  .main-nav { justify-content: flex-end; gap: 1.2rem; }
  .hero-grid { grid-template-columns: 1fr .72fr; gap: 2rem; }
}
@media (max-width: 47.99rem) {
  .header-inner { min-height: 6rem; }
  .brand { width: 5rem; }
  .main-nav { display: none; }
  .hero { min-height: auto; }
  .hero::before { background: linear-gradient(180deg, rgba(27,59,48,.98) 0 48%, rgba(27,59,48,.5)); }
  .hero-grid { grid-template-columns: 1fr; padding-top: 8rem; padding-bottom: 3.5rem; }
  .hero h1 { font-size: clamp(3.2rem, 14vw, 5rem); }
  .hero-visual { width: min(100%, 28rem); margin-inline: auto; }
  .hero-image-wrap { aspect-ratio: 5 / 4; border-radius: 9rem 9rem 1.25rem 1.25rem; }
  .hero-visual figcaption { right: .75rem; bottom: .75rem; }
}
