/* Alternating materials: mineral ink, warm ivory, deep green and champagne. */
:root {
  --ink: #111310;
  --ink-soft: #1b231d;
  --paper: #f2ebdd;
  --paper-2: #e8e0d1;
  --white: #f2ebdd;
  --copper: #c7ab78;
  --copper-light: #c7ab78;
  --muted: #cfc5b3;
  --line: rgba(199, 171, 120, .3);
  --gold-canvas: #111310;
  --gold-surface: #1b231d;
  --gold-text: #f2ebdd;
  --gold-secondary: #cfc5b3;
  --gold-art: url('/assets/champagne-ribbons.svg');
}

[data-palette] {
  --section-bg: #111310;
  --section-text: #f2ebdd;
  --section-muted: #cfc5b3;
  --section-accent: #c7ab78;
  --section-line: rgba(199, 171, 120, .3);
  --section-panel: #1b231d;
  --art-base: #111310;
  --art-mid: #24271d;
  --art-edge: #111310;
  --art-metal: 199, 171, 120;
  --art-light: 0;
  --art-opacity: .85;
  --art-copy-shade: rgba(17, 19, 16, .6);
  --art-static: url('/assets/champagne-ribbons.svg');
  --gold-text: var(--section-text);
  --gold-secondary: var(--section-muted);
  --copper: var(--section-accent);
  --copper-light: var(--section-accent);
  --line: var(--section-line);
}

[data-palette="green"] {
  --section-bg: #173b33;
  --section-muted: #dcd2be;
  --section-panel: #21483f;
  --art-base: #173b33;
  --art-mid: #245447;
  --art-edge: #15352e;
  --art-opacity: .8;
  --art-copy-shade: rgba(23, 59, 51, .6);
}

[data-palette="ivory"] {
  color-scheme: light;
  --section-bg: #f2ebdd;
  --section-text: #173b33;
  --section-muted: #314a3a;
  --section-accent: #61411d;
  --section-line: #c9beaa;
  --section-panel: #f9f5ec;
  --art-base: #f2ebdd;
  --art-mid: #f2ebdd;
  --art-edge: #f2ebdd;
  --art-metal: 166, 115, 37;
  --art-light: 1;
  --art-opacity: 1;
  --art-copy-shade: rgba(242, 235, 221, .55);
  --art-static: url('/assets/bronze-ribbons.svg?v=2');
}

:is(.section, .hero, .investor-hero)[data-palette] {
  color: var(--section-text);
  background-color: var(--section-bg);
  background-image: var(--art-static);
  background-repeat: no-repeat;
  background-size: cover;
}
.investor-page :is(.investor-costs, .investor-assumptions, .investor-units)[data-palette] {
  color: var(--section-text);
  background-color: var(--section-bg);
  background-image: none;
}
section[data-palette].has-gold-art, footer[data-palette].has-gold-art {
  position: relative;
  isolation: isolate;
  background-image: none;
}
section[data-palette].has-gold-art:not(.hero) > :not(.gold-art):not(.gold-motion-toggle), footer[data-palette].has-gold-art > :not(.gold-art):not(.gold-motion-toggle) { position: relative; z-index: 1; }
/* The drawing reaches the section edge; the reading scrim stays within it. */
.investor-result[data-palette] > .gold-art { height: 100%; mask-image: none; }
.investor-page :is(.investor-costs, .investor-assumptions, .investor-units).has-gold-art { background-image: none; }
.investor-page main > [data-palette] > .gold-art { opacity: 1; }
.investor-page main > :is([data-palette="ink"], [data-palette="green"]) {
  --art-metal: 225, 180, 96;
  --art-shadow-floor: .46;
  --section-accent: #eed6a4;
}
.investor-page main > [data-palette="ink"] { --art-copy-shade: rgba(17, 19, 16, .7); }
.investor-page main > [data-palette="green"] { --art-copy-shade: rgba(23, 59, 51, .75); }
footer[data-palette] > .gold-art { opacity: .4; }
[data-palette] .eyebrow { color: var(--section-accent); }
[data-palette] .text-link { color: var(--section-accent); }
[data-palette] .gold-motion-toggle {
  color: var(--section-accent);
  background: var(--section-bg);
  border-color: var(--section-accent);
}
[data-palette] .gold-motion-toggle:hover {
  color: var(--section-text);
  background: var(--section-panel);
}
[data-palette] > .gold-art {
  --art-copy-edge: max(32px, calc((100% - var(--max)) / 2));
  --art-copy-inset: 120px;
  opacity: var(--art-opacity);
}
section[data-palette]:not(.hero) > .gold-art::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, var(--art-copy-shade) var(--art-copy-edge), var(--art-copy-shade) 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);
}
.hero[data-palette] { background-image: none; }
.hero[data-palette] > .gold-art { opacity: 1; }
.hero[data-palette]::after {
  background-color: var(--section-bg);
  background-image: linear-gradient(rgba(17, 19, 16, .62) 55%, transparent 85%), var(--art-static);
}
.hero[data-palette] > .gold-art::after {
  background: linear-gradient(rgba(17, 19, 16, .62) 55%, transparent 85%);
}
/* Let the facade emerge from the ink and moving gold instead of a diagonal cut. */
@media (min-width: 941px) {
  .hero[data-palette] > .gold-art,
  .hero[data-palette]::after {
    width: 66%;
    clip-path: none;
    -webkit-mask-image: linear-gradient(90deg, #000 65%, rgba(0, 0, 0, .85) 80%, transparent);
    mask-image: linear-gradient(90deg, #000 65%, rgba(0, 0, 0, .85) 80%, transparent);
  }
  .hero[data-palette] .hero-media::after {
    background:
      linear-gradient(90deg, #111310, rgba(17, 19, 16, .88) 12%, rgba(17, 19, 16, .48) 27%, rgba(17, 19, 16, .13) 44%, transparent 60%),
      linear-gradient(0deg, rgba(17, 19, 16, .34), transparent 35%);
  }
}
.faq[data-palette] > .gold-art { opacity: .4; }

.site-header.is-scrolled { background: #111310; }
.header-cta { border-color: var(--copper); }
.hero-lead, .investor-lead { color: #ded5c4; }
.hero-facts { background: #111310eb; border-color: #8b7856; }
.hero-facts div + div { border-color: #8b7856; }
.button-primary, .contact-action .button-light { color: #111310; background: #c7ab78; }
.button-primary:hover, .button-primary:focus-visible,
.contact-action .button-light:hover, .contact-action .button-light:focus-visible { background: #dcc59c; }
.button-ghost { background: #111310e6; }

/* Keep image captions light while the editorial text uses green on ivory. */
.project-image figcaption, .gallery-card-caption { color: #f2ebdd; }
.project-image figcaption small, .gallery-card-caption small { color: #e1d5bd; }
.project-image::before, .gallery-card::before { border-color: rgba(199, 171, 120, .65); }
.gallery-card-caption i { color: #111310; background: #c7ab78; }
.project-stats { border-color: var(--section-line); }
.project-stats dt { color: var(--section-text); }

/* A warm paper plan viewer, with a deep-green selected state. */
[data-palette="ivory"] :is(.plan-categories, .plans-shell) {
  color: var(--section-text);
  background: var(--section-panel);
  border-color: var(--section-line);
}
[data-palette="ivory"] .plan-selector { background: #e8e0d1; border-color: var(--section-line); }
[data-palette="ivory"] :is(.plan-option, .plan-category) { color: var(--section-text); border-color: var(--section-line); }
[data-palette="ivory"] :is(.plan-option span, .plan-category small, .plan-selector-caption) { color: var(--section-muted); border-color: var(--section-line); }
[data-palette="ivory"] :is(.plan-option, .plan-category):is(:hover, :focus-visible) { color: #173b33; background: #ded4c2; }
[data-palette="ivory"] :is(.plan-option, .plan-category).is-active { color: #f2ebdd; background: #173b33; box-shadow: none; }
[data-palette="ivory"] :is(.plan-option, .plan-category).is-active :is(span, small) { color: #dcc59c; }
[data-palette="ivory"] .plan-category.is-active::after { background: #c7ab78; }
[data-palette="ivory"] .plan-stage { color: var(--section-text); background: #f9f5ec; }
[data-palette="ivory"] .plan-image-button { background: #eae4d8; }
[data-palette="ivory"] .plan-navigation { border-color: var(--section-line); }
[data-palette="ivory"] .plan-navigation button { color: var(--section-text); }
[data-palette="ivory"] .plan-navigation button:hover { color: var(--section-accent); }
[data-palette="ivory"] .plan-interest { color: #173b33; border-color: #173b33; }
[data-palette="ivory"] .plan-interest:is(:hover, :focus-visible) { color: #f2ebdd; background: #173b33; }
[data-palette="ivory"] :is(.plan-option, .plan-category, .plan-navigation button):focus-visible {
  outline: 2px solid #80613b;
  outline-offset: -4px;
}

/* Defined bronze edges for the plan tabs, area list and viewer. */
#plantas { --plan-frame: #84663e; --plan-divider: #8a7252; }
#plantas .plan-categories,
#plantas .plans-shell { border: 2px solid var(--plan-frame); }
#plantas .plan-selector { border-right: 2px solid var(--plan-frame); }
#plantas .plan-option { border-color: var(--plan-divider); }
#plantas .plan-option.is-active { outline: 2px solid #c7ab78; outline-offset: -3px; }
#plantas .plan-category + .plan-category,
#plantas .plan-selector-caption,
#plantas .plan-navigation { border-color: var(--plan-divider); }
#plantas .plan-image-button { border: 1px solid var(--plan-divider); }

[data-palette="ivory"] .nearby-card { background: #f9f5ec; }
[data-palette="ivory"] .nearby-card:hover { background: #e8e0d1; }
[data-palette="ivory"] .nearby-card h3 { color: #173b33; }
[data-palette="green"] .faq-list summary span { color: #c7ab78; background: #21483f; }
[data-palette="green"] .faq-list details[open] summary span { color: #111310; background: #c7ab78; }
.contact-action { color: #f2ebdd; background: #1b231d; border-color: #c7ab78; }
.contact-action > strong { color: #c7ab78; }
.site-footer { color: #cfc5b3; background: #111310; }
.site-footer.has-live-gold { padding-bottom: 94px; }
:is(.disclaimer, .copyright, .gallery-dialog-footer small) { color: #cfc5b3; }

/* Financial content keeps the same semantic colors as the main presentation. */
.investor-metrics { border-color: rgba(199, 171, 120, .3); }
.investor-metrics dt { color: #cfc5b3; }
[data-palette] :is(.equation span, .margin p) { color: var(--section-muted); }
[data-palette] :is(.equation > div, .margin) { border-color: var(--section-line); }
.investor-page [data-palette="ivory"] .price-item dd { color: #173b33; }
.cost-bar i:nth-child(1), .swatch.obra { background: #173b33; }
.cost-bar i:nth-child(2), .swatch.terreno { background: #80613b; }
.cost-bar i:nth-child(3), .swatch.extras { background: #69745f; }
.cost-bar i:nth-child(4), .swatch.comissao { background: #b99a63; }

.plan-dialog { color: #173b33; background: #f2ebdd; }
.plan-dialog :is(.dialog-heading span, .dialog-footer-info > small, .dialog-navigation > span) { color: #4f5d50; }
.plan-dialog .dialog-navigation button { color: #173b33; }
.plan-dialog .dialog-interest { color: #f2ebdd; background: #173b33; }
.plan-dialog .dialog-interest:is(:hover, :focus-visible) { background: #21483f; }

/* Real page links remain available without JavaScript, including on phones. */
.page-switcher { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 24px; margin: 0 0 28px; }
.page-switcher a { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 6px 0; color: #cfc5b3; border-bottom: 1px solid transparent; font-size: .75rem; font-weight: 600; line-height: 1.5; }
.page-switcher a[aria-current="page"] { color: #c7ab78; border-color: #c7ab78; }
.page-switcher a:hover { color: #f2ebdd; border-color: #c7ab78; }
.footer-pages { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 20px; }
.footer-pages a { padding: 7px 0; color: #f2ebdd; border-bottom: 1px solid #c7ab78; }
.footer-pages a[aria-current="page"] { color: #c7ab78; }
.footer-info > .footer-pages { grid-column: 1 / -1; margin-top: 0; }
.site-header .brand { view-transition-name: elfrida-brand; }
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: elfrida-page-out 160ms ease both; }
::view-transition-new(root) { animation: elfrida-page-in 220ms ease both; }
@keyframes elfrida-page-out { to { opacity: 0; } }
@keyframes elfrida-page-in { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*) { animation-duration: 0s; }
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}

@media (max-width: 940px) {
  #plantas .plan-selector { border-right: 0; border-bottom: 2px solid var(--plan-frame); }
  #plantas .plan-option { border-bottom: 0; border-right: 1px solid var(--plan-divider); }
  .hero[data-palette] { height: auto; }
  .hero[data-palette] .hero-copy { position: relative; inset: auto; min-height: 100svh; }
  .hero[data-palette] .hero-media { position: absolute; inset: 0; width: 100%; height: 100%; }
  [data-palette] > .gold-art { --art-copy-edge: 24px; --art-copy-inset: 82px; }
  .main-nav {
    background-color: #111310;
    background-image: url('/assets/champagne-ribbons.svg');
  }
}
@media (max-width: 560px) {
  [data-palette] > .gold-art { --art-copy-edge: 20px; }
  .investor-page main > .section.has-live-gold { padding-bottom: 104px; }
}
@media (max-width: 380px) {
  .hero[data-palette] .hero-copy { padding-top: 128px; }
  :is(.faq.section, .site-footer).has-live-gold { padding-bottom: 128px; }
  :is(.faq, .site-footer).has-live-gold > .gold-motion-toggle { bottom: 74px; }
}
