/* Original Cala identity: colors sampled from cala-renovation.com. */
:root {
  --ink: #12141d;
  --paper: #fffbed;
  --line: #ded5c5;
  --muted: #67625c;
  --cala-copper: #de8244;
  --cala-copper-hover: #eca16e;
  --cala-copper-dark: #8e481d;
  --cala-soft: #f4e5ce;
  --cala-light-text: #d7d0c5;
}

html { scroll-padding-top: 132px; }
::selection { background: var(--cala-copper); color: var(--ink); }
.header, .header.scrolled, .menu-open .header {
  padding-top: 9px;
  padding-bottom: 9px;
  background: rgba(18, 20, 29, .96);
  color: var(--paper);
  border-bottom: 1px solid #de824433;
}
.header.scrolled { background: var(--ink); }
.brand { display: block; flex: 0 0 auto; padding: 0; line-height: 1; }
.brand-logo { width: 104px; height: auto; object-fit: contain; transition: width .3s; }
.header.scrolled .brand-logo { width: 84px; }
.desktop-nav { margin-left: 0; }
.desktop-nav a:hover, .footer-top a:hover { color: var(--cala-copper); }
.mobile-menu { background: var(--ink); color: var(--paper); }
.mobile-menu nav a { border-color: #de82443d; }
.mobile-menu sup, .mobile-menu p { color: var(--cala-light-text); }

.button, .contact-submit {
  background: var(--cala-copper);
  color: var(--ink);
}
.button:hover, .contact-submit:hover { background: var(--cala-copper-hover); color: var(--ink); }
.button-white { background: var(--paper); color: var(--ink); }
.button-white:hover { background: var(--cala-copper); color: var(--ink); }
.button .orbit { color: var(--ink); }
.intro-stamp .large-orbit { color: var(--cala-copper); }
.intro-stamp .eyebrow, .orbit-caption { color: var(--cala-light-text); }
.hero { background: var(--ink); }
.hero-photo-credit { opacity: .85 !important; }
.hero-caption > a:hover { border-color: var(--cala-copper); color: var(--cala-copper); }
.slide-tab.active span { background: var(--cala-copper); }
.service-number { color: #ead4b9; }
.service-content > .eyebrow, .service-photo-credit { color: var(--muted); }
.image-link { background: linear-gradient(transparent, #12141dcc); }
.text-link:hover, .case-source:hover, .photo-credits a:hover { color: var(--cala-copper-dark); opacity: 1; }
.dark-section .text-link:hover { color: var(--cala-copper); }
.renovation-pair figure { background: var(--cala-soft); }
.renovation-pair figure:last-child figcaption { background: var(--cala-copper); color: var(--ink); }
.case-description { color: var(--muted); }
.case-source { color: var(--muted); border-color: var(--line); }
.statement-image:after { background: #12141d44; }
.statement-credit { opacity: .9; }
.paper-note { background-color: var(--paper); background-blend-mode: luminosity; }
.note-brand { display: block; flex-shrink: 0; background: var(--ink); padding: 5px; }
.note-brand img { width: 68px; height: auto; object-fit: contain; }
.contact-paper .paper-note { padding-bottom: 72px; }
.contact-paper .note-top, .contact-row { border-color: #c5b499; }
.contact-row p, .contact-helper { color: var(--muted); }
.contact-heading > .eyebrow, .quote-layout > .eyebrow, .trust-line > .eyebrow { color: var(--cala-copper); }
.contact-heading > p, .quote-bottom small, .trust-line > p:last-child { color: var(--cala-light-text); }
.contact-phone { color: var(--paper); border-color: var(--cala-copper); }
.contact-phone:hover { color: var(--cala-copper); }
.trust-line, .footer, .footer-bottom { border-color: #de82443d; }
.footer-top > div > .eyebrow { color: var(--cala-copper); }
.footer-top .footer-area, .footer-bottom { color: var(--cala-light-text); }
.footer-bottom { margin-top: 48px; }

.vision-loading, .vision-nojs, .vision-error { background: var(--cala-soft); color: var(--ink); }
.vision-loading .orbit { color: var(--cala-copper-dark); }
.vision-overlay { background: linear-gradient(#12141d99, transparent); }
.vision-brand img { width: 225px; height: auto; object-fit: contain; }
.vision-brand > small { color: var(--paper); }
.vision-state { border-color: #de8244aa; background: #12141d73; color: var(--paper); }
.vision-scene-label { background: linear-gradient(transparent, #12141da3); }
.vision-scene-label > .eyebrow { color: var(--paper); }
.vision-controls { background: var(--ink); color: var(--paper); }
.vision-controls button { color: var(--cala-light-text); }
.vision-room-controls button[aria-pressed=true] { border-color: var(--cala-copper); color: var(--paper); }
.vision-room-controls button > span { color: var(--cala-copper); }
.vision-timeline { background: #de824433; }
.vision-timeline > span { background: var(--cala-copper); }
.vision-error button { background: var(--cala-copper); color: var(--ink); }

@media (max-width: 700px) {
  html { scroll-padding-top: 112px; }
  .brand-logo, .header.scrolled .brand-logo { width: 80px; }
  .mobile-menu { padding-top: 126px; }
  .mobile-menu nav { gap: 4px; margin-bottom: 36px; }
  .vision-brand img { width: 162px; }
  .vision-overlay { gap: 12px; }
  .vision-brand > small { margin-top: 5px; }
  .footer-bottom { margin-top: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  .brand-logo { transition: none; }
}