/* Painted black and brushed gold, inspired by the owner's visual reference. */
:root {
  --ink: #0b0b0a;
  --ink-soft: #191816;
  --white: #f7f1e5;
  --copper: #c6a163;
  --copper-light: #ddbc80;
  --muted: #bcb3a4;
  --line: rgba(221, 188, 128, .23);
  --gold-canvas: #0b0b0a;
  --gold-surface: #151411;
  --gold-text: #f7f1e5;
  --gold-secondary: #c6beaf;
  --gold-art: url('/assets/desenho-dourado-4k.webp');
}

html { color-scheme: dark; scrollbar-color: #8d7449 #11110f; }
body { color: var(--gold-text); background: var(--gold-canvas); }
::selection { color: #0b0b0a; background: #ddbc80; }
a:focus-visible, button:focus-visible, summary:focus-visible {
  outline: 2px solid var(--copper-light);
  outline-offset: 5px;
}

.site-header { background: linear-gradient(180deg, rgba(5, 5, 4, .93), rgba(5, 5, 4, 0)); }
.site-header.is-scrolled { background: #10100f; box-shadow: 0 1px 0 var(--line); }
.header-cta { border-color: #b19461; }
.brand-copy small { color: var(--gold-secondary); }

.hero { background: var(--gold-canvas); }
.hero-copy { background: transparent; }
.hero-copy::after { display: none; }
.hero::after {
  content: '';
  position: absolute;
  z-index: 2;
  inset: 0 auto 0 0;
  width: 58%;
  pointer-events: none;
  background-color: var(--gold-canvas);
  background-image: linear-gradient(rgba(0, 0, 0, .62) 55%, transparent 85%), var(--gold-art);
  background-position: center;
  background-size: 100% 100%;
  clip-path: polygon(0 0, 100% 0, 84% 100%, 0 100%);
}
.hero-lead { color: #e0d8c9; }
.hero-facts { background: rgba(11, 11, 10, .88); border-color: #796747; }
.hero-facts div + div { border-color: #796747; }
.hero-facts dt { color: var(--gold-secondary); }
.scroll-cue { color: #d1c1a3; }
.button-primary { background: var(--copper-light); }
.button-ghost { background: #0b0b0ae0; }
.button-primary:hover, .button-primary:focus-visible,
.dialog-interest:hover, .dialog-interest:focus-visible { background: #edd3a0; }

.project.section, .gallery.section, .location.section, .nearby.section, .faq.section,
.plans.section, .contact.section { color: var(--gold-text); background: var(--gold-canvas); }
.project.section {
  background-image: linear-gradient(rgba(11, 11, 10, .77), rgba(11, 11, 10, .77)), var(--gold-art);
  background-position: center bottom;
  background-size: cover;
}
.gallery.section, .location.section, .faq.section { background: var(--gold-surface); }
.project-copy .intro { color: var(--gold-text); }
.project-copy > p:not(.intro), .project-stats dd,
.gallery-heading > p, .gallery-disclaimer,
.location-copy > p:not(.eyebrow), .location-copy address span, .location-copy address small,
.nearby-heading > p, .nearby-card ul, .nearby-disclaimer,
.faq-heading > p:last-child, .faq-list details p { color: var(--gold-secondary); }
.project-image::before, .gallery-card::before { border-color: rgba(221, 188, 128, .65); }
.project-image figcaption small { color: var(--gold-secondary); }
.gallery-card-caption i { color: var(--ink); }
.nearby-card { background: #12110f; }
.nearby-card:hover { background: #1c1913; }
.faq-list summary span { color: var(--copper-light); background: #282218; }
.faq-list details[open] summary span { color: var(--ink); background: var(--copper-light); }
.text-link { color: var(--copper-light); }

.plans.section {
  background-image: linear-gradient(rgba(11, 11, 10, .72), rgba(11, 11, 10, .9)), var(--gold-art);
  background-position: right top;
  background-size: 100% auto;
  background-repeat: no-repeat;
}
.plans-heading > p { color: var(--gold-secondary); }
.plan-categories, .plans-shell { border-color: var(--line); background: #10100e; }
.plan-selector { border-color: var(--line); }
.plan-option { color: #d8cfbf; border-color: var(--line); }
.plan-option span, .plan-selector-caption, .plan-category small { color: #b7ad9c; }
.plan-option.is-active { color: var(--ink); background: var(--copper-light); }
.plan-option.is-active span { color: #554426; }
.plan-category { color: #d8cfbf; }
.plan-category.is-active { background: #292216; }
.plan-stage { background: #191713; }
.plan-meta span, .plan-meta p, .plan-footer > small, .plan-navigation strong { color: var(--gold-secondary); }
.plan-navigation button, .gallery-dialog-controls button { color: #d2c5af; }
.plan-type { color: var(--copper-light); }
.plan-dialog { color-scheme: light; }
.plan-dialog :focus-visible { outline-color: #88652b; }

.contact.section {
  background-image: linear-gradient(rgba(0, 0, 0, .72), rgba(0, 0, 0, .72)), var(--gold-art);
  background-size: cover;
  background-position: center 68%;
  border-block: 1px solid var(--line);
}
.contact .eyebrow { color: var(--copper-light); }
.contact-inner > div:first-child > p:last-child { color: #ded5c4; }
.contact-action { color: var(--gold-text); background: #11110f; border: 1px solid #a08552; }
.contact-action > span { color: var(--gold-secondary); }
.contact-action > strong { color: var(--copper-light); }
.contact-action .button-light { color: var(--ink); background: var(--copper-light); }
.contact-action .button-light:hover { background: #edd3a0; }
.site-footer { background: #080807; }
.disclaimer, .copyright, .gallery-dialog-footer small { color: #b4aa98; }

/* Carry the same material palette onto the existing investor presentation. */
.investor-hero, .investor-result {
  background-color: var(--gold-canvas);
  background-image: linear-gradient(rgba(0, 0, 0, .75), rgba(0, 0, 0, .75)), var(--gold-art);
  background-size: cover;
  background-position: center;
}
.investor-page .investor-costs, .investor-page .investor-assumptions,
.investor-page .investor-units { background: var(--gold-surface); }
.investor-product { background: #10100e; }
.investor-risks { background: var(--gold-canvas); }
.cost-summary > p, .cost-list dt small, .assumption-grid dt,
.product-copy > p:not(.eyebrow), .projection-notice,
.units-intro, .price-item dt span, .units-source, .units-reconciliation,
.result-note, .metrics-note { color: var(--gold-secondary); }
.investor-page .price-item dd { color: var(--copper-light); }
.product-links .button-outline { color: var(--copper-light); border-color: var(--copper-light); }
.cost-bar i:nth-child(2), .swatch.terreno { background: #e6d8bc; }
.cost-bar i:nth-child(3), .swatch.extras { background: #9d978b; }
.cost-bar i:nth-child(4), .swatch.comissao { background: #916336; }

@media (max-width: 940px) {
  .hero::after {
    inset: 29% 0 0;
    width: 100%;
    clip-path: none;
    background-size: cover;
    background-position: center bottom;
    mask-image: linear-gradient(transparent, #000 30%);
  }
  .main-nav {
    background-color: #080807;
    background-image: linear-gradient(rgba(0, 0, 0, .68), rgba(0, 0, 0, .68)), var(--gold-art);
    background-size: cover;
    background-position: center bottom;
  }
  .nav-index, .mobile-nav-contact span { color: #b9ab92; }
}
@media (max-width: 560px) {
  .hero::after { background-size: auto 100%; background-position: 62% bottom; }
  .project.section { background-size: auto 100%; background-position: right bottom; }
  .contact.section { background-position: 65% center; }
  .hero-facts div + div { border-color: #796747; }
}

/* Surface-specific drawings: static reading areas and a few live focal points. */
.gallery.section, .location.section, .nearby.section, .faq.section {
  background-image: linear-gradient(rgba(11, 11, 10, .75), rgba(11, 11, 10, .75)), var(--gold-art);
  background-size: cover;
}
.gallery.section { background-position: 30% bottom; }
.location.section { background-position: 80% center; }
.nearby.section { background-position: 10% center; }
.faq.section { background-position: 65% bottom; }
.plans.section {
  background-image: linear-gradient(rgba(11, 11, 10, .75), rgba(11, 11, 10, .75)), var(--gold-art);
  background-size: cover;
}
.gold-art { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.gold-art canvas { display: block; width: 100%; height: 100%; }
.hero > .gold-art {
  z-index: 2;
  inset: 0 auto 0 0;
  width: 58%;
  clip-path: polygon(0 0, 100% 0, 84% 100%, 0 100%);
}
.hero.has-live-gold::after { display: none; }
.hero > .gold-art::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(rgba(0, 0, 0, .62) 55%, transparent 85%);
}
:is(.project, .gallery, .plans, .location, .nearby, .faq, .contact, .investor-hero, .investor-result).has-gold-art {
  position: relative;
  isolation: isolate;
  background-image: none;
}
:is(.project, .gallery, .plans, .location, .nearby, .faq, .contact, .investor-hero, .investor-result).has-gold-art > :not(.gold-art) {
  position: relative;
  z-index: 1;
}
.investor-result > .gold-art {
  height: min(100%, 850px);
  opacity: .25;
  mask-image: linear-gradient(#000 60%, transparent);
}
.plans > .gold-art { opacity: .3; }
:is(.gallery, .location, .faq) > .gold-art { opacity: .32; }
.nearby > .gold-art { opacity: .34; }
.project > .gold-art { opacity: .2; }
.contact > .gold-art { opacity: .3; }
.investor-hero > .gold-art { opacity: .28; }
/* Brighter ribbons in open space, with a dark scrim over the reading area. */
:is(.project, .gallery, .plans, .location, .nearby, .contact) > .gold-art {
  --art-copy-edge: max(32px, calc((100% - var(--max)) / 2));
  --art-copy-inset: 120px;
  opacity: .85;
}
:is(.project, .gallery, .plans, .location, .nearby, .contact) > .gold-art::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(0, 0, 0, .6) var(--art-copy-edge), rgba(0, 0, 0, .6) calc(100% - var(--art-copy-edge)), transparent);
  mask-image: linear-gradient(transparent, #000 var(--art-copy-inset), #000 calc(100% - var(--art-copy-inset)), transparent);
}
:is(.project, .gallery, .plans, .location, .nearby, .contact) .eyebrow { color: #e3c68f; }
/* Vary the crop as well when JavaScript or canvas is unavailable. */
.project.section { background-position: 25% bottom; }
.plans.section { background-position: 70% center; background-size: cover; }
.contact.section { background-position: 35% 80%; }
.investor-hero { background-position: 80% 35%; background-size: 120% auto; }
.investor-result { background-position: 15% 80%; background-size: 140% auto; }
.gold-motion-toggle {
  position: absolute;
  z-index: 4;
  left: max(40px, calc((100vw - var(--max)) / 2));
  bottom: 24px;
  min-height: 36px;
  padding: 7px 12px;
  color: #e0c896;
  background: #10100ee6;
  border: 1px solid #887146;
  cursor: pointer;
  font-size: .7rem;
  line-height: 1.4;
  transition: background .2s ease, color .2s ease;
}
.gold-motion-toggle:hover { background: #292216; color: #f7e5bb; }
.has-gold-art.has-live-gold > .gold-motion-toggle { position: absolute; }
.has-live-gold .scroll-cue { display: none; }
.investor-hero.has-live-gold { padding-bottom: 78px; }
.investor-hero.has-live-gold > .gold-motion-toggle { position: absolute; }

@media (max-width: 940px) {
  .hero > .gold-art {
    inset: 29% 0 0;
    width: 100%;
    clip-path: none;
    mask-image: linear-gradient(transparent, #000 30%);
  }
  .gold-motion-toggle { left: 24px; bottom: 16px; }
  :is(.project, .gallery, .plans, .location, .nearby, .contact) > .gold-art { --art-copy-edge: 24px; --art-copy-inset: 82px; }
}
@media (max-width: 560px) {
  .gold-motion-toggle { left: 20px; }
  :is(.project, .gallery, .plans, .location, .nearby, .contact) > .gold-art { --art-copy-edge: 20px; }
}
@media (max-width: 380px) {
  :is(.project, .gallery, .plans, .location, .nearby, .contact).section { padding-bottom: 128px; }
  :is(.project, .gallery, .plans, .location, .nearby, .contact) > .gold-motion-toggle { bottom: 74px; }
}