/* Luna Homes — mobile-first refinement of the existing olive/cream design. */
:root { --luna-ink: #302f27; --luna-olive: #414638; --luna-paper: #f5f1e6; --luna-line: rgba(245,241,230,.24); }
/* Existing Luna brand retained: editorial details clarify scope without a visual reset. */
.luna-editorial-section, .luna-work-section { color: var(--luna-ink); background: var(--luna-paper); }
.luna-editorial-shell { width: min(100% - 40px, 1120px); margin-inline: auto; padding-block: clamp(56px, 8vw, 112px); }
.luna-editorial-intro { max-width: 760px; }
.luna-editorial-kicker { margin: 0 0 18px; font: 600 12px/1.4 Inter, sans-serif; text-transform: uppercase; letter-spacing: .16em; color: var(--luna-olive); }
.luna-editorial-intro h2, .luna-work-section h2 { margin: 0; max-width: 13ch; font: 400 clamp(36px, 6vw, 72px)/1.04 Georgia, serif; letter-spacing: -.035em; overflow-wrap: anywhere; }
.luna-editorial-intro > p:last-child, .luna-work-section .luna-editorial-shell > p:not(.luna-editorial-kicker) { max-width: 66ch; margin: 22px 0 0; font: 400 clamp(16px, 1.5vw, 19px)/1.7 Inter, sans-serif; color: #4e5047; }
.luna-capability-list { display: grid; grid-template-columns: minmax(0,1fr); margin-top: clamp(38px, 5vw, 68px); border-top: 1px solid rgba(48,47,39,.28); }
.luna-capability-list article { display: grid; grid-template-columns: minmax(0,1fr); gap: 8px 20px; padding-block: 22px; border-bottom: 1px solid rgba(48,47,39,.21); }
.luna-capability-list h3, .luna-scope-note h3 { margin: 0; font: 400 clamp(21px, 2.5vw, 30px)/1.2 Georgia, serif; }
.luna-capability-list p, .luna-scope-note p { max-width: 66ch; margin: 0; font: 400 15px/1.7 Inter, sans-serif; color: #4e5047; }
.luna-scope-note { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; margin-top: 42px; padding: clamp(24px, 4vw, 42px); background: #e8e5d7; }
.luna-scope-note p { margin-top: 10px; }
.luna-scope-note > a, .luna-work-links a { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 22px; border: 1px solid var(--luna-olive); color: var(--luna-olive); text-decoration: none; font: 600 14px/1.3 Inter, sans-serif; white-space: nowrap; transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.luna-scope-note > a:hover, .luna-scope-note > a:focus-visible, .luna-work-links a:hover, .luna-work-links a:focus-visible { background: var(--luna-olive); color: var(--luna-paper); transform: translateY(-1px); }
.luna-work-section { background: #e8e5d7; }
.luna-work-section h2 { max-width: 18ch; }
.luna-work-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.luna-instagram-link { display: inline-block; margin-top: 15px; font-weight: 600; border-bottom: 1px solid currentColor; }
html, body { max-width: 100%; overflow-x: clip; }
#root h1, #root h2 { overflow-wrap: anywhere; }
button, a { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible { outline: 2px solid #c8b276; outline-offset: 3px; }
.luna-menu-toggle { display: none; flex: 0 0 44px; width: 44px; height: 44px; align-items: center; justify-content: center; border: 1px solid rgba(48,47,39,.25); border-radius: 999px; color: var(--luna-ink); background: rgba(245,241,230,.82); transition: background-color .2s ease, transform .2s ease; }
.luna-menu-toggle:hover { background: #e8e1cd; transform: translateY(-1px); }
.luna-menu-toggle svg { width: 21px; height: 21px; }
.luna-mobile-panel { display: none; }
/* Hallmark · component: responsive header · genre: editorial · theme: existing Luna olive/cream
 * Keep the original logo and navigation; rebalance them from narrow phones upward.
 */
.luna-nav-inner { padding-block: 10px !important; }
.luna-nav-inner > button[aria-label="Luna Homes"] { flex-shrink: 0; min-height: 44px; }
.luna-nav-inner > button[aria-label="Luna Homes"] img { width: auto; height: 44px !important; }
.luna-nav-inner > button[aria-label="Luna Homes"] > span { display: none !important; }
.luna-nav-inner > div:last-child { flex-shrink: 0; gap: 12px; }
.luna-nav-inner button[aria-label="Change language"], .luna-header-access { min-height: 44px; }
.luna-desktop-nav { gap: clamp(14px, 1.5vw, 24px) !important; }
.luna-desktop-nav > button, .luna-desktop-nav > a, .luna-header-request { white-space: nowrap; }
.luna-header-request { min-height: 44px; padding: 10px 14px !important; }
@media (min-width: 640px) {
  .luna-nav-inner > button[aria-label="Luna Homes"] img { height: 48px !important; }
}
@media (min-width: 1024px) {
  .luna-nav-inner > button[aria-label="Luna Homes"] img { height: 52px !important; }
}
.luna-contact-row { min-width: 0; }
.luna-contact-row > :last-child { min-width: 0; overflow-wrap: anywhere; }
.luna-footer { background: var(--luna-olive) !important; color: var(--luna-paper) !important; border-color: var(--luna-line) !important; }
.luna-footer > div { padding-top: 0; }
.luna-footer a { color: var(--luna-paper); text-decoration: none; text-underline-offset: 4px; transition: color .2s ease, text-decoration-color .2s ease; }
.luna-footer a:hover { color: #e1cb92; text-decoration: underline; }
.luna-footer-main { align-items: start !important; gap: 32px !important; }
.luna-footer-brand { max-width: 400px; }
.luna-footer-brand img { width: min(240px, 100%); height: auto; object-fit: contain; object-position: left center; }
.luna-footer-intro { margin-top: 16px; max-width: 37ch; font-size: 14px; line-height: 1.65; color: #e3dfd1; }
.luna-footer-links { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 24px !important; align-content: start; }
.luna-footer-links a { white-space: nowrap; font-size: 13px; line-height: 1.5; }
.luna-footer-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin: 26px 0 0; padding: 20px 0; border-top: 1px solid var(--luna-line); }
.luna-footer-cta a:first-child { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; padding: 0 20px; border: 1px solid #e1cb92; border-radius: 999px; font-weight: 600; transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.luna-footer-cta a:first-child:hover { background: #e1cb92; color: var(--luna-ink); text-decoration: none; transform: translateY(-2px); }
.luna-footer-bottom { border-top: 1px solid var(--luna-line); color: #d8d4c6 !important; font-size: 11px; line-height: 1.6; }
@media (max-width: 1023px) {
  .luna-nav-inner { gap: 8px; padding-left: 16px !important; padding-right: 16px !important; }
  .luna-desktop-nav, .luna-header-request, .luna-header-access { display: none !important; }
  .luna-menu-toggle { display: inline-flex; }
  .luna-mobile-panel { display: block; position: absolute; top: 100%; left: 0; right: 0; z-index: 55; max-height: min(74vh, 680px); overflow-y: auto; background: #f5f1e6; color: var(--luna-ink); border-top: 1px solid rgba(48,47,39,.14); box-shadow: 0 18px 30px rgba(30,36,28,.18); padding: 10px 16px 22px; }
  .luna-mobile-panel[hidden] { display: none; }
  .luna-mobile-panel a { display: flex; min-height: 48px; align-items: center; padding: 10px 4px; border-bottom: 1px solid rgba(48,47,39,.13); color: var(--luna-ink); font-size: 15px; font-weight: 500; text-decoration: none; }
  .luna-mobile-panel a:hover, .luna-mobile-panel a:focus-visible { color: #6b592e; }
  .luna-mobile-panel a.luna-mobile-cta { justify-content: center; margin-top: 16px; padding: 10px 18px; border: 0; border-radius: 999px; background: var(--luna-olive); color: #fff; font-weight: 600; }
  .luna-footer-main { flex-direction: column !important; }
  .luna-footer-links { width: 100%; }
}
@media (max-width: 480px) {
  .luna-editorial-shell { width: min(100% - 36px, 1120px); }
  .luna-work-links { flex-direction: column; align-items: stretch; }
  .luna-work-links a { width: 100%; }
  .luna-contact-row { flex-direction: column !important; gap: 5px !important; }
  .luna-contact-row > :first-child { min-width: 0 !important; }
  .luna-footer { padding-top: 38px !important; }
  .luna-footer > div { padding-left: 20px !important; padding-right: 20px !important; }
  .luna-footer-links { gap: 12px 14px !important; }
  .luna-footer-links a { font-size: 12px; }
  .luna-footer-bottom { gap: 6px !important; }
  :is(button[aria-label="Ask Luna"], button[aria-label="Pregúntale a Luna"], button[aria-label="Pergunte à Luna"]) { width: 54px !important; height: 54px !important; padding: 0 !important; justify-content: center !important; right: 14px !important; bottom: 14px !important; }
  :is(button[aria-label="Ask Luna"], button[aria-label="Pregúntale a Luna"], button[aria-label="Pergunte à Luna"]) > span > span { display: none !important; }
}
@media (min-width: 760px) {
  .luna-capability-list article { grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); align-items: baseline; gap: 36px; padding-block: 28px; }
  .luna-scope-note { flex-direction: row; justify-content: space-between; align-items: center; }
  .luna-scope-note > div { max-width: 560px; }
}
@media (prefers-reduced-motion: reduce) { .luna-menu-toggle, .luna-footer a, .luna-footer-cta a:first-child, .luna-scope-note > a, .luna-work-links a { transition: none !important; } }
