/*
Theme Name: MHC Contemporary California
Author: MHC Properties
Description: An original, editorial California theme for local real estate and property management.
Version: 0.1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mhc-california
*/
:root {
  --navy: #14283f; --white: #fff; --offwhite: #f7f6f3; --charcoal: #29313a; --gold: #b59a69;
  --muted: #58616b; --line: #d9dde0; --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-heading: Georgia, "Times New Roman", serif; --content-width: 1200px; --space: 8px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 104px; }
body { margin: 0; color: var(--charcoal); background: var(--white); font: 400 16px/1.6 var(--font-body); overflow-wrap: break-word; }
img, video { display: block; max-width: 100%; height: auto; }
svg { max-width: 100%; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
a { color: var(--navy); text-underline-offset: 4px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
button { cursor: pointer; }
:focus-visible { outline: 2px solid var(--navy); outline-offset: 4px; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 24px; color: var(--navy); font-family: var(--font-heading); font-weight: 400; line-height: 1.16; text-wrap: balance; }
h1 { font-size: clamp(2.25rem, 4.6vw, 4rem); letter-spacing: -.035em; }
h2 { font-size: clamp(1.875rem, 3.2vw, 2.75rem); letter-spacing: -.025em; }
h3 { font-size: clamp(1.375rem, 2.2vw, 1.75rem); }
h4 { font-size: 1.25rem; }
p { margin: 0 0 24px; }
ul, ol { padding-left: 24px; }
.container { width: min(var(--content-width), calc(100% - 64px)); margin-inline: auto; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.screen-reader-text:focus, .skip-link:focus { position: fixed; top: 8px; left: 8px; z-index: 1000; width: auto; height: auto; clip-path: none; margin: 0; padding: 16px 24px; background: var(--white); color: var(--navy); }
.site-header { position: sticky; top: 0; z-index: 100; border-bottom: 1px solid var(--line); background: var(--white); }
.site-header > .container { display: flex; align-items: center; gap: 24px; min-height: 88px; }
.brand { display: inline-flex; flex-direction: column; justify-content: center; min-height: 44px; flex-shrink: 0; color: var(--navy); text-decoration: none; line-height: 1.2; }
.brand strong, .brand-name { font-family: var(--font-heading); font-size: 1.5rem; font-weight: 400; }
.brand small, .brand-tagline { margin-top: 4px; font-size: .6875rem; letter-spacing: .12em; text-transform: uppercase; }
.brand img { width: auto; max-width: 176px; max-height: 56px; }
.site-nav { margin-left: auto; }
.site-nav ul { list-style: none; margin: 0; padding: 0; }
.site-nav > ul, .site-nav > div > ul { display: flex; align-items: center; gap: 8px; }
.site-nav li { position: relative; }
.site-nav a { display: flex; align-items: center; min-height: 44px; padding: 8px; font-size: .875rem; font-weight: 500; text-decoration: none; }
.site-nav a:hover, .site-nav .current-menu-item > a, .site-nav .current-menu-ancestor > a { text-decoration: underline; text-decoration-color: var(--gold); text-decoration-thickness: 2px; }
.site-nav .menu-item-has-children { padding-right: 24px; }
.submenu-toggle { position: absolute; top: 0; right: -8px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; color: var(--navy); background: transparent; border: 0; font-size: 1rem; }
.site-nav .menu-item-has-children > a { padding-right: 16px; }
.site-nav .sub-menu { display: none; position: absolute; top: 100%; left: 0; width: max-content; min-width: 224px; max-width: min(320px, 90vw); padding: 8px; border: 1px solid var(--line); background: var(--white); box-shadow: 0 8px 16px rgb(20 40 63 / 8%); }
.site-nav .sub-menu a { white-space: normal; padding: 8px 16px; }
.site-nav .sub-menu .sub-menu { top: 0; left: 100%; }
.site-nav li:hover > .sub-menu, .site-nav li:focus-within > .sub-menu, .site-nav li.is-expanded > .sub-menu { display: block; }
.has-js .site-nav li > .sub-menu { display: none; }
.has-js .site-nav li.is-expanded > .sub-menu { display: block; }
.site-nav > ul > li:last-child > .sub-menu, .site-nav > div > ul > li:last-child > .sub-menu { left: auto; right: 0; }
.header-actions { display: flex; align-items: center; gap: 8px; }
.header-actions .button { padding: 10px 16px; font-size: .875rem; white-space: nowrap; }
.menu-toggle { display: none; min-width: 44px; min-height: 44px; padding: 8px 12px; border: 1px solid var(--line); background: var(--white); color: var(--navy); }
.button, .wp-element-button, .wp-block-button__link, input[type="submit"] { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 24px; border: 1px solid var(--navy); border-radius: 2px; background: var(--navy); color: var(--white); font-size: .9375rem; font-weight: 600; line-height: 1.4; text-align: center; text-decoration: none; transition: background-color .18s ease, color .18s ease; }
.button:hover, .wp-element-button:hover, .wp-block-button__link:hover, input[type="submit"]:hover { color: var(--white); background: #233f5d; text-decoration: none; }
.button-primary:focus-visible, .wp-element-button:focus-visible, .wp-block-button__link:focus-visible { outline-color: var(--navy); }
.button-outline, .wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; border-color: var(--navy); color: var(--navy); }
.button-outline:hover, .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--navy); color: var(--white); }
.button-gold { background: var(--gold); border-color: var(--gold); color: var(--navy); }
.button-gold:hover { color: var(--navy); background: #c5ae84; border-color: #c5ae84; }
.hero { background: var(--offwhite); }
.hero > .container, .hero.mhc-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; gap: 64px; }
.hero-copy { align-self: center; padding-block: 80px; }
.hero-copy h1 { max-width: 640px; }
.hero-copy > p:not(.eyebrow) { max-width: 560px; font-size: 1.125rem; line-height: 1.7; }
.eyebrow { margin-bottom: 16px; color: var(--navy); font-family: var(--font-body); font-size: .75rem; font-weight: 700; letter-spacing: .13em; line-height: 1.6; text-transform: uppercase; }
.hero-media { position: relative; min-width: 0; min-height: 480px; overflow: hidden; }
.hero-media img { width: 100%; height: 100%; min-height: 480px; object-fit: cover; object-position: center; }
.image-placeholder { display: grid; place-items: center; min-height: 320px; padding: 32px; background: #e5e8e8; color: var(--navy); text-align: center; }
.hero-media .image-placeholder { height: 100%; min-height: 480px; }
.hero-actions, .cta-group, .button-group, .component-row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.hero-actions, .cta-group, .button-group { margin-top: 32px; }
.foundation-section, .mhc-section, .component-showcase { padding-block: 80px; }
.section-heading { max-width: 760px; margin-bottom: 40px; }
.section-heading h2 { margin-bottom: 16px; }
.section-heading p:last-child { margin-bottom: 0; }
.foundation-grid, .service-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.mhc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
.service-card { display: flex; flex-direction: column; min-width: 0; padding: 32px 24px; border-top: 2px solid var(--gold); background: var(--offwhite); }
.service-card h3 { margin-bottom: 16px; }
.service-card p { margin-bottom: 24px; }
.service-card > a:last-child, .service-card > .button:last-child { margin-top: auto; align-self: flex-start; }
.service-card > a:not(.button) { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
.service-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; margin-bottom: 24px; }
.management-band { padding-block: 72px; background: var(--navy); color: var(--white); }
.management-band > .container { display: flex; align-items: center; justify-content: space-between; gap: 48px; }
.management-band h2, .management-band h3, .management-band .eyebrow { color: var(--white); }
.management-band p { max-width: 720px; color: var(--white); }
.management-band .button-outline { border-color: var(--white); color: var(--white); }
.management-band .button-outline:hover { background: var(--white); color: var(--navy); }
.management-band :focus-visible, .site-footer :focus-visible { outline-color: var(--gold); }
.foundation-notice { padding: 24px 32px; border-left: 3px solid var(--gold); background: var(--offwhite); }
.foundation-notice p:last-child { margin-bottom: 0; }
.component-showcase { background: var(--offwhite); }
.component-showcase .mhc-grid { margin-top: 32px; }
.component-row { margin-bottom: 24px; }
.swatch { display: inline-flex; flex-direction: column; gap: 8px; min-width: 104px; font-size: .8125rem; }
.swatch-color, .swatch > span:first-child { width: 100%; height: 56px; border: 1px solid var(--line); border-radius: 2px; }
.swatch-navy { background: var(--navy); }.swatch-white { background: var(--white); }.swatch-offwhite { background: var(--offwhite); }.swatch-charcoal { background: var(--charcoal); }.swatch-gold { background: var(--gold); }
form { max-width: 100%; }
label { display: block; margin-bottom: 8px; font-weight: 600; }
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]), select, textarea { width: 100%; min-width: 0; min-height: 48px; padding: 12px 16px; border: 1px solid #7b858f; border-radius: 2px; background: var(--white); color: var(--charcoal); }
textarea { min-height: 144px; resize: vertical; }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
input[type="checkbox"], input[type="radio"] { width: 20px; height: 20px; margin: 0 8px 0 0; accent-color: var(--navy); }
label:has(input[type="checkbox"]), label:has(input[type="radio"]) { display: flex; align-items: center; min-height: 44px; }
fieldset { min-width: 0; margin: 0 0 24px; padding: 24px; border: 1px solid var(--line); }
legend { padding-inline: 8px; font-weight: 600; }
.form-field { margin-bottom: 24px; }
.form-help, .field-note { display: block; margin-top: 8px; color: var(--muted); font-size: .875rem; }
:disabled, .button[aria-disabled="true"] { cursor: not-allowed; background: #e8eaec; border-color: #a8afb6; color: #5a626a; }
.page-header { padding-block: 64px; background: var(--offwhite); }
.page-header h1:last-child { margin-bottom: 0; }
.entry-content { width: min(800px, calc(100% - 64px)); margin: 64px auto; }
.entry-content > * { max-width: 100%; }
.entry-content > .alignwide { width: min(var(--content-width), calc(100vw - 64px)); max-width: none; margin-left: calc((100% - min(var(--content-width), 100vw - 64px)) / 2); }
.entry-content > .alignfull { width: 100vw; max-width: none; margin-left: calc((100% - 100vw) / 2); }
.entry-content > .mhc-section.alignfull { padding-inline: 32px; }
.entry-content .mhc-section > .wp-block-group__inner-container { max-width: var(--content-width); margin-inline: auto; }
.wp-block-group, .wp-block-column { min-width: 0; }
.wp-block-heading { color: var(--navy); }
.wp-block-paragraph { line-height: 1.6; }
.wp-block-image { margin-block: 32px; }.wp-block-image img { height: auto; }
.wp-block-image figcaption, .wp-block-table figcaption { margin-top: 8px; color: var(--muted); font-size: .875rem; text-align: left; }
.wp-block-cover { min-height: 400px; padding: 48px 32px; }
.wp-block-cover .wp-block-heading, .wp-block-cover p { color: inherit; }
.wp-block-columns { gap: 32px; margin-bottom: 32px; }
.wp-block-buttons { gap: 16px; margin-block: 24px; }
.wp-block-quote { margin: 32px 0; padding: 8px 0 8px 24px; border-left: 3px solid var(--gold); font-family: var(--font-heading); font-size: 1.25rem; }
.wp-block-quote cite, .wp-block-pullquote cite { color: var(--muted); font-family: var(--font-body); font-size: .875rem; font-style: normal; }
.wp-block-pullquote { margin-block: 40px; padding: 32px 24px; border-block: 1px solid var(--line); font-family: var(--font-heading); font-size: 1.5rem; }
.wp-block-separator { margin-block: 40px; border: 0; border-top: 1px solid var(--line); }
.wp-block-table { overflow-x: auto; margin-block: 32px; }
.wp-block-table table { width: 100%; border-collapse: collapse; }
.wp-block-table td, .wp-block-table th { padding: 12px 16px; border: 1px solid var(--line); text-align: left; }
.wp-block-table th { background: var(--offwhite); color: var(--navy); }
.wp-block-code, .wp-block-preformatted { overflow-x: auto; padding: 24px; background: var(--offwhite); border: 1px solid var(--line); font-size: .875rem; }
.wp-block-list { margin-block: 24px; }.wp-block-list li { margin-bottom: 8px; }
.wp-block-details { margin-block: 24px; padding: 16px 24px; border-block: 1px solid var(--line); }
.wp-block-details summary { min-height: 44px; cursor: pointer; font-weight: 600; color: var(--navy); }
.wp-block-gallery { gap: 16px; }.wp-block-media-text { gap: 32px; }.wp-block-media-text .wp-block-media-text__content { padding: 24px; }
.wp-block-file { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.wp-block-file__button { min-height: 44px; padding: 12px 24px; background: var(--navy); color: var(--white); border-radius: 2px; }
.wp-block-search__input { min-width: 0; }.wp-block-search__button { min-height: 48px; padding: 12px 24px; background: var(--navy); color: var(--white); border: 1px solid var(--navy); }
.has-navy-color { color: var(--navy); }.has-navy-background-color { background-color: var(--navy); }
.has-white-color { color: var(--white); }.has-white-background-color { background-color: var(--white); }
.has-offwhite-color, .has-off-white-color { color: var(--offwhite); }.has-offwhite-background-color, .has-off-white-background-color { background-color: var(--offwhite); }
.has-charcoal-color { color: var(--charcoal); }.has-charcoal-background-color { background-color: var(--charcoal); }
.has-gold-color { color: var(--gold); }.has-gold-background-color { background-color: var(--gold); }
.has-navy-background-color :focus-visible { outline-color: var(--gold); }
.site-footer { padding: 64px 0 24px; background: var(--navy); color: var(--white); }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 40px; padding-bottom: 48px; }
.site-footer .brand, .site-footer h2, .site-footer h3, .site-footer h4, .site-footer a, .footer-contact, .footer-contact a { color: var(--white); }
.site-footer h3, .site-footer h4 { margin-bottom: 16px; font-family: var(--font-body); font-size: .9375rem; font-weight: 600; }
.site-footer .brand { margin-bottom: 24px; }.site-footer p { margin-bottom: 16px; }
.footer-links { list-style: none; margin: 0; padding: 0; }.footer-links li { margin: 0; }
.footer-links a, .footer-contact a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.footer-links a:hover, .footer-contact a:hover { text-decoration: underline; }
.footer-contact address { color: var(--white); font-style: normal; }
.footer-disclosures { padding: 24px 0; border-top: 1px solid #506072; font-size: 1rem; line-height: 1.6; }
.footer-disclosures p { margin: 0 0 12px; }
.footer-disclosures a { display: inline-flex; align-items: center; min-height: 44px; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px 32px; padding-top: 24px; border-top: 1px solid #506072; font-size: .8125rem; }
.footer-bottom p { margin: 0; }.footer-bottom a { display: inline-flex; align-items: center; min-height: 44px; }
@media (min-width: 1024px) and (max-width: 1279px) {
  .site-header > .container { width: calc(100% - 32px); gap: 16px; }
  .site-nav > ul, .site-nav > div > ul { gap: 0; }.site-nav a { padding-inline: 6px; font-size: .8125rem; }
  .brand strong, .brand-name { font-size: 1.25rem; }.brand img { max-width: 136px; }
  .header-actions .button { padding-inline: 12px; font-size: .8125rem; }
}
@media (max-width: 1023px) {
  .site-header > .container { flex-wrap: wrap; gap: 0 16px; min-height: 80px; padding-block: 8px; }
  .header-actions { margin-left: auto; }.has-js .menu-toggle { display: inline-flex; align-items: center; justify-content: center; }
  .site-nav { order: 3; width: 100%; margin: 8px 0 0; padding: 8px 0 16px; border-top: 1px solid var(--line); max-height: calc(100dvh - 96px); overflow-y: auto; }
  .has-js .site-nav:not(.is-open) { display: none; }
  .site-nav > ul, .site-nav > div > ul { display: block; }.site-nav a { min-height: 48px; padding: 12px 8px; font-size: 1rem; }
  .site-nav .menu-item-has-children { padding-right: 0; }.site-nav .menu-item-has-children > a { padding-right: 56px; }
  .submenu-toggle { top: 2px; right: 0; }
  .site-nav .sub-menu, .site-nav .sub-menu .sub-menu { position: static; display: block; width: 100%; max-width: none; min-width: 0; padding: 0 0 8px 16px; border: 0; box-shadow: none; }
  .has-js .site-nav li > .sub-menu { display: none; }.has-js .site-nav li.is-expanded > .sub-menu { display: block; }
  .hero > .container, .hero.mhc-grid { gap: 32px; }.hero-copy { padding-block: 64px; }
  .foundation-grid, .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
  .management-band > .container { align-items: flex-start; flex-direction: column; gap: 24px; }
}
@media (max-width: 767px) {
  html { scroll-padding-top: 88px; }.container { width: calc(100% - 32px); }
  .site-header > .container { min-height: 72px; gap: 0 8px; }.brand strong, .brand-name { font-size: 1.25rem; }
  .brand small, .brand-tagline { font-size: .625rem; letter-spacing: .08em; }.brand img { max-width: 136px; }
  .header-actions { display: none; }.menu-toggle { margin-left: auto; font-size: .875rem; }
  .hero > .container, .hero.mhc-grid { grid-template-columns: 1fr; gap: 0; }
  .hero-copy { padding-block: 48px; }.hero-copy > p:not(.eyebrow) { font-size: 1rem; }
  .hero-media, .hero-media img, .hero-media .image-placeholder { min-height: 280px; }.hero-media { margin-bottom: 32px; }
  .hero-media img { height: 320px; }.hero-actions, .cta-group, .button-group { gap: 8px; }
  .foundation-section, .mhc-section, .component-showcase { padding-block: 48px; }.management-band { padding-block: 48px; }
  .section-heading { margin-bottom: 32px; }.mhc-grid { grid-template-columns: 1fr; gap: 24px; }
  .foundation-grid, .service-grid { gap: 16px; }.service-card { padding: 24px 16px; }
  .foundation-notice { padding: 24px; }.page-header { padding-block: 40px; }
  .entry-content { width: calc(100% - 32px); margin-block: 40px; }
  .entry-content > .alignwide { width: calc(100vw - 32px); margin-left: calc((100% - (100vw - 32px)) / 2); }
  .entry-content > .mhc-section.alignfull { padding-inline: 16px; }.wp-block-columns { gap: 24px; }
  .wp-block-cover { min-height: 320px; padding: 32px 16px; }.wp-block-media-text { gap: 16px; }
  .site-footer { padding-top: 48px; }.footer-grid { padding-bottom: 32px; gap: 32px 24px; }
}
@media (max-width: 479px) {
  .foundation-grid, .service-grid, .footer-grid { grid-template-columns: 1fr; }
  .hero-actions > .button, .cta-group > .button { flex: 1 1 100%; }
  .component-row { align-items: stretch; }.component-row > .button { flex: 1 1 100%; }
  .management-band .button { width: 100%; }.footer-bottom { display: block; }.footer-bottom p { margin-bottom: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition: none !important; }
}
@media (forced-colors: active) { .button, .wp-block-button__link, .submenu-toggle, .menu-toggle { border: 1px solid ButtonText; } }
@media print {
  .site-header { position: static; }.site-nav, .header-actions, .menu-toggle { display: none !important; }
  .site-footer, .management-band { background: white; color: black; }.site-footer a, .site-footer h3, .footer-contact, .footer-contact address, .management-band h2 { color: black; }
  .hero > .container { display: block; }.hero-copy { padding-block: 24px; }.hero-media { display: none; }
}
