/* Claude: 2026-10-27 — the few rules the Blazor build needs on top of the design's site.css (kept verbatim
   from the handoff so it can be diffed against future design drops). */

/* Elements the prototype rendered as <button> are links here (real URLs, crawlable, open-in-new-tab). */
a.pillar-bar, a.doorcard, a.fixcard, a.area-bar { text-align: left; color: inherit; text-decoration: none; }
a.doorcard { display: flex; flex-direction: column; }
a.fixcard { cursor: pointer; }

/* The prototype mounted the mobile menu only while open; here it is always in the markup and site.js
   toggles [hidden], which the design's display rule would otherwise override. */
.mobile-menu[hidden] { display: none !important; }

/* Phone-width fixes for two overflows inherited from the prototype (both scroll sideways there too at 375px):
   - .split-photo's min-height 340px with .split-art's 4/3 aspect-ratio forces a 453px-wide box;
   - the header's quote button pushes the Menu toggle off-screen. It stays in the mobile menu. */
@media (max-width: 600px) {
  .split-photo { min-height: 0; }
}
@media (max-width: 560px) {
  .nav-actions > .btn-sm { display: none; }
}

/* Contact page: the prototype's inline 1.2fr / 1fr grid, plus a phone breakpoint it never had. */
.contact-layout { display: grid; grid-template-columns: 1.2fr 1fr; gap: 40px; }
@media (max-width: 820px) { .contact-layout { grid-template-columns: 1fr; } }

/* Validation / send errors on every form. */
.form-error { margin: 14px 0 0; color: #B3261E; font-size: 14px; font-weight: 600; }
[data-theme="dark"] .form-error { color: #FFB4AB; }
.callout-form .form-error { color: #FFB4AB; margin: 0; }

/* Wizard contact-step photo picker (was a toggle mock in the prototype). */
.wiz-photo {
  border: 1px dashed var(--line); background: white; border-radius: 12px; padding: 24px;
  display: flex; align-items: center; gap: 14px; color: var(--ink-2); cursor: pointer;
}
.wiz-photo.has { background: var(--paper-2); }
[data-theme="dark"] .wiz-photo { background: transparent; }
.cf-photo-drop { cursor: pointer; }

/* Corner handles are dragged with pointer events; stop the browser from scrolling instead. */
.cfg-house-handle, .dv2-handle { touch-action: none; }
.cfg-scene-stage { transform-origin: 0 0; }

#blazor-error-ui {
  background: #FFF4CE; color: #0B2A3B; bottom: 0; box-shadow: 0 -1px 2px rgba(0,0,0,.2);
  display: none; left: 0; padding: .6rem 1.25rem .7rem 1.25rem; position: fixed; width: 100%; z-index: 1000;
}
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: .75rem; top: .5rem; }