/* =============================================================
   PropertyManage.Pro — site chrome for lean pages

   The header, footer and Book a Call modal rules, extracted from the
   computed styles of index.html so /resources pages render the same
   header, footer and callback modal as the home page. index.html keeps
   its own inline copy; if the header, footer or modal change there,
   regenerate or mirror them here. Pair with pmp-nav.css, pmp-cta.css
   and pmp-callback.js.
   ============================================================= */

.site-header { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; padding: clamp(14px, 2vh, 20px) clamp(20px, 4vw, 56px); position: relative; z-index: 2; border-bottom: 1px solid rgb(207, 223, 225); }
.brand { display: inline-flex; align-items: center; gap: 10px; }
.brand-mark { display: flex; align-items: flex-end; transform: skewX(-10deg); }
.brand-mark { gap: 3px; }
.brand-mark span { width: 6px; background: var(--teal); border-radius: 1px; }
.brand-mark span:nth-child(1) { height: 13px; }
.brand-mark span:nth-child(2) { height: 20px; }
.brand-mark span:nth-child(3) { height: 27px; }
.brand-name { color: var(--deep); font-family: Sora, sans-serif; font-size: 19px; font-weight: 800; letter-spacing: -0.03em; }
.nav-links { display: flex; align-items: center; gap: 32px; color: rgb(78, 92, 96); font-size: 14px; font-weight: 500; }
.nav-links a, .header-cta { transition: color 180ms, background-color 180ms, transform 180ms; }
.nav-links a:hover, .nav-links a:focus-visible { color: var(--deep); }
.header-cta { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 10px 0px; border-radius: 0px; background: transparent; color: var(--teal); font-family: Sora, sans-serif; font-size: 14px; font-weight: 600; white-space: nowrap; }
.header-cta:hover, .header-cta:focus-visible { background: transparent; color: rgb(26, 132, 146); transform: translateY(-1px); }
@media (max-width: 820px){.nav-links { display: none; }}
@media (max-width: 520px){.site-header { gap: 16px; }}
@media (max-width: 520px){.header-cta { padding-inline: 14px; }}
@media (prefers-reduced-motion: reduce){.nav-links a, .header-cta { transition: none; }}
.pmp-footer { color: rgb(220, 233, 234); background: radial-gradient(circle at 78% 5%, rgba(31, 163, 155, 0.12), transparent 30%), rgb(8, 23, 28); }
.pmp-footer-shell { width: min(100%, 1320px); margin: 0px auto; padding: clamp(68px, 7vw, 96px) 5vw clamp(54px, 6vw, 76px); display: grid; grid-template-columns: minmax(300px, 1.25fr) minmax(180px, 0.55fr) minmax(210px, 0.6fr); gap: clamp(44px, 7vw, 96px); }
.pmp-footer-logo { display: inline-flex; align-items: center; gap: 13px; color: rgb(247, 251, 251); text-decoration: none; }
.pmp-footer-mark { display: flex; align-items: flex-end; gap: 3px; transform: skewX(-10deg); }
.pmp-footer-mark span { width: 7px; border-radius: 1px; background: var(--aqua); }
.pmp-footer-mark span:nth-child(1) { height: 15px; }
.pmp-footer-mark span:nth-child(2) { height: 23px; }
.pmp-footer-mark span:nth-child(3) { height: 31px; }
.pmp-footer-name { font-family: var(--pmp-font-display); font-size: 21px; font-weight: 700; letter-spacing: -0.035em; }
.pmp-footer-brand p { max-width: 510px; margin: 22px 0px 0px; color: rgb(169, 188, 191); font-size: 16px; line-height: 1.62; }
.pmp-footer-column { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.pmp-footer-column h2 { margin: 0px 0px 8px; color: var(--aqua-soft); font-family: var(--pmp-font-label); font-size: 10px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; }
.pmp-footer-column a, .pmp-footer-column span { color: rgb(220, 233, 234); font-size: 15px; line-height: 1.45; text-decoration: none; }
.pmp-footer-column a { transition: color 180ms, transform 180ms; }
.pmp-footer-column a:hover, .pmp-footer-column a:focus-visible { color: var(--aqua-soft); transform: translateX(3px); outline: none; }
.pmp-footer-bottom { width: min(90%, 1320px); margin: 0px auto; padding: 22px 0px 28px; display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid rgba(207, 223, 225, 0.12); color: rgb(127, 149, 153); font-family: var(--pmp-font-label); font-size: 9px; letter-spacing: 0.11em; text-transform: uppercase; }
@media (max-width: 980px){.pmp-footer-shell { grid-template-columns: 1fr; }}
@media (max-width: 980px){.pmp-footer-shell { gap: 40px; }}
@media (max-width: 680px){.pmp-footer-shell { padding-inline: 20px; }}
@media (max-width: 680px){.pmp-footer-bottom { width: calc(100% - 40px); flex-direction: column; gap: 8px; }}
@media (prefers-reduced-motion: reduce){.pmp-footer-column a { transition: none; }}
.pmp-footer-message-button { width: fit-content; margin: 0px; border: 0px; padding: 0px; color: rgb(175, 196, 200); background: transparent; font: inherit; text-align: left; cursor: pointer; transition: color 180ms; }
.pmp-footer-message-button:hover, .pmp-footer-message-button:focus-visible { color: rgb(255, 255, 255); }
body.pmp-modal-open { overflow: hidden; }
.pmp-modal-backdrop { position: fixed; inset: 0px; z-index: 9999; display: grid; place-items: center; padding: 24px; overflow-y: auto; background: rgba(7, 19, 23, 0.76); backdrop-filter: blur(8px); opacity: 0; visibility: hidden; transition: opacity 200ms, visibility 200ms; }
.pmp-modal-backdrop.is-open { opacity: 1; visibility: visible; }
.pmp-modal-card { position: relative; width: min(100%, 720px); max-height: calc(-48px + 100vh); overflow-y: auto; border: 1px solid rgb(207, 223, 225); border-radius: 14px; padding: clamp(30px, 5vw, 56px); color: rgb(17, 36, 42); background: rgb(247, 251, 251); box-shadow: rgba(0, 0, 0, 0.28) 0px 28px 90px; transform: translateY(18px) scale(0.985); transition: transform 220ms cubic-bezier(0.2, 0.75, 0.2, 1); }
.pmp-modal-backdrop.is-open .pmp-modal-card { transform: translateY(0px) scale(1); }
.pmp-modal-close { position: absolute; top: 16px; right: 18px; width: 42px; height: 42px; border: 1px solid rgb(207, 223, 225); border-radius: 50%; color: rgb(17, 36, 42); background: rgb(255, 255, 255); font-size: 27px; line-height: 1; cursor: pointer; }
.pmp-modal-step { display: none; }
.pmp-modal-step.is-active { display: block; }
.pmp-modal-card h2 { margin: 16px 0px 0px; font-family: Sora, sans-serif; font-size: clamp(34px, 5vw, 52px); font-weight: 700; line-height: 1.07; letter-spacing: -0.043em; text-wrap: balance; }
.pmp-modal-intro, .pmp-modal-selection, .pmp-modal-result p { margin: 18px 0px 0px; color: rgb(94, 107, 110); font-family: "Hanken Grotesk", sans-serif; font-size: 17px; line-height: 1.58; }
.pmp-callback-options { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; margin-top: 30px; }
.pmp-callback-options button { min-height: 112px; border: 1px solid rgb(207, 223, 225); border-radius: 5px; padding: 20px; color: rgb(17, 36, 42); background: rgb(255, 255, 255); font-family: Sora, sans-serif; font-size: 17px; font-weight: 700; line-height: 1.25; text-align: left; cursor: pointer; transition: border-color 160ms, background 160ms, transform 160ms; }
.pmp-callback-options button:hover, .pmp-callback-options button:focus-visible { border-color: rgb(21, 112, 126); background: rgb(237, 246, 246); transform: translateY(-2px); }
.pmp-callback-options button span { display: block; margin-top: 8px; color: rgb(94, 107, 110); font-family: "Hanken Grotesk", sans-serif; font-size: 13px; font-weight: 500; }
.pmp-modal-fine-print, .pmp-modal-security, .pmp-modal-timezone { margin: 16px 0px 0px; color: rgb(109, 122, 125); font-family: "Hanken Grotesk", sans-serif; font-size: 13px; line-height: 1.5; }
.pmp-modal-back { margin: 0px 0px 22px; border: 0px; padding: 0px; color: rgb(21, 112, 126); background: transparent; font-family: "JetBrains Mono", monospace; font-size: 10px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }
.pmp-modal-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 14px; }
.pmp-modal-field { display: block; margin-top: 18px; color: rgb(17, 36, 42); font-family: "Hanken Grotesk", sans-serif; font-size: 14px; font-weight: 700; }
.pmp-modal-field span { display: block; margin-bottom: 8px; }
.pmp-modal-field em { color: rgb(109, 122, 125); font-style: normal; font-weight: 500; }
.pmp-modal-field input, .pmp-modal-field textarea { width: 100%; border: 1px solid rgb(196, 213, 215); border-radius: 4px; padding: 14px 15px; color: rgb(17, 36, 42); background: rgb(255, 255, 255); font-family: "Hanken Grotesk", sans-serif; font-size: 16px; outline: none; transition: border-color 160ms, box-shadow 160ms; }
.pmp-modal-field textarea { resize: vertical; }
.pmp-modal-field input:focus, .pmp-modal-field textarea:focus { border-color: rgb(21, 112, 126); box-shadow: rgba(21, 112, 126, 0.12) 0px 0px 0px 3px; }
.pmp-custom-time-fields { margin-top: 8px; }
.pmp-modal-submit { width: 100%; margin-top: 24px; color: rgb(255, 255, 255); background: rgb(17, 36, 42); }
.pmp-modal-submit[disabled] { cursor: wait; opacity: 0.65; transform: none; }
.pmp-modal-result { text-align: center; }
.pmp-modal-result .pmp-modal-submit { width: auto; min-width: 180px; }
@media (max-width: 720px){.pmp-modal-backdrop { padding: 12px; align-items: end; }}
@media (max-width: 720px){.pmp-modal-card { width: 100%; max-height: calc(-24px + 100vh); border-radius: 12px 12px 0px 0px; padding: 34px 22px 28px; }}
@media (max-width: 720px){.pmp-callback-options, .pmp-modal-field-grid { grid-template-columns: 1fr; }}
@media (max-width: 720px){.pmp-callback-options button { min-height: 92px; }}
body.pmp-modal-open { overscroll-behavior: none; overflow: hidden !important; }
.pmp-modal-backdrop { overscroll-behavior: contain; overflow: hidden !important; }
.pmp-modal-card { width: min(100%, 680px) !important; max-height: calc(-32px + 100dvh) !important; overflow: hidden !important; padding: clamp(24px, 3.3vw, 38px) !important; }
#pmp-callback-modal [data-callback-step="1"] h2 { white-space: nowrap; text-wrap-style: initial; margin-top: 12px !important; font-size: clamp(18px, 3.05vw, 36px) !important; line-height: 1.08 !important; letter-spacing: -0.04em !important; }
#pmp-callback-modal [data-callback-step="1"] .pmp-modal-intro { margin-top: 10px !important; font-size: 16px !important; line-height: 1.45 !important; }
.pmp-callback-options { grid-template-columns: repeat(2, minmax(0px, 1fr)) !important; gap: 10px !important; margin-top: 20px !important; }
.pmp-callback-options button { min-height: 80px !important; padding: 13px 15px !important; font-size: 15px !important; line-height: 1.2 !important; }
.pmp-callback-options button span { margin-top: 4px !important; font-size: 12px !important; line-height: 1.3 !important; }
#pmp-callback-modal .pmp-modal-fine-print { margin-top: 12px !important; font-size: 12px !important; line-height: 1.35 !important; }
.pmp-callback-details-title { margin: 0px 48px 12px 0px !important; font-size: clamp(27px, 3.2vw, 38px) !important; line-height: 1.08 !important; }
.pmp-modal-field-grid--compact { gap: 10px !important; }
.pmp-modal-field--placeholder { margin-top: 10px !important; }
.pmp-modal-field--placeholder > span { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0px !important; margin: -1px !important; overflow: hidden !important; clip: rect(0px, 0px, 0px, 0px) !important; white-space: nowrap !important; border: 0px !important; }
.pmp-modal-field--placeholder input, .pmp-modal-field--placeholder textarea { padding: 12px 13px !important; font-size: 15px !important; line-height: 1.3 !important; }
.pmp-modal-field--placeholder textarea { min-height: 62px; max-height: 76px; resize: none !important; }
.pmp-custom-time-fields { margin-top: 0px !important; }
.pmp-custom-time-fields .pmp-modal-timezone { margin-top: 7px !important; font-size: 11px !important; line-height: 1.3 !important; }
#pmp-callback-form .pmp-modal-submit { min-height: 50px !important; margin-top: 14px !important; }
#pmp-callback-form .pmp-modal-security { margin-top: 9px !important; font-size: 11px !important; line-height: 1.35 !important; }
@media (max-width: 720px){.pmp-modal-backdrop { align-items: center !important; padding: 10px !important; }}
@media (max-width: 720px){.pmp-modal-card { max-height: calc(-20px + 100dvh) !important; border-radius: 12px !important; padding: 24px 17px 19px !important; }}
@media (max-width: 720px){#pmp-callback-modal [data-callback-step="1"] h2 { font-size: clamp(17px, 5.2vw, 25px) !important; }}
@media (max-width: 720px){.pmp-callback-options { gap: 8px !important; }}
@media (max-width: 720px){.pmp-callback-options button { min-height: 76px !important; padding: 11px 10px !important; font-size: 13px !important; }}
@media (max-width: 720px){.pmp-callback-options button span { font-size: 10.5px !important; }}
@media (max-width: 720px){.pmp-modal-field-grid, .pmp-modal-field-grid--compact { grid-template-columns: repeat(2, minmax(0px, 1fr)) !important; gap: 8px !important; }}
@media (max-width: 720px){.pmp-modal-field--placeholder { margin-top: 8px !important; }}
@media (max-width: 720px){.pmp-modal-field--placeholder input, .pmp-modal-field--placeholder textarea { padding: 10px 11px !important; font-size: 14px !important; }}
@media (max-width: 720px){.pmp-callback-details-title { font-size: clamp(24px, 7vw, 32px) !important; }}
@media (max-width: 420px){.pmp-modal-close { top: 10px !important; right: 10px !important; width: 34px !important; height: 34px !important; font-size: 23px !important; }}
@media (max-width: 420px){#pmp-callback-modal [data-callback-step="1"] h2 { margin-right: 32px !important; font-size: 17px !important; }}
@media (max-width: 420px){#pmp-callback-modal [data-callback-step="1"] .pmp-modal-intro { font-size: 13px !important; }}
@media (max-width: 420px){.pmp-callback-options button { min-height: 72px !important; }}
@media (max-width: 420px){.pmp-callback-details-title { margin-right: 38px !important; font-size: 23px !important; }}
@media (max-width: 420px){#pmp-callback-form .pmp-modal-security, #pmp-callback-modal .pmp-modal-fine-print { display: none; }}
@media (max-width: 360px){#pmp-callback-modal [data-callback-step="1"] h2 { margin-right: 32px !important; font-size: 15.5px !important; letter-spacing: -0.045em !important; }}
.pmp-cta-label, .pmp-cta-arrow { position: relative; z-index: 3; }
.pmp-cta-arrow { display: inline-flex; align-items: center; justify-content: center; color: var(--pmp-cta-aqua-soft); transition: transform .26s var(--pmp-cta-ease), color .22s ease; font-size: 18px !important; font-weight: 400 !important; line-height: 1 !important; }
.pmp-modal-submit.pmp-cta--functional, .pmp-modal-submit.pmp-cta--utility-close { width: 100%; min-height: 50px !important; margin-top: 14px !important; }
.pmp-modal-submit.pmp-cta--utility-close { border: 1px solid rgb(207, 223, 225) !important; background: transparent !important; color: var(--pmp-cta-ink) !important; box-shadow: none !important; }
.pmp-modal-submit.pmp-cta--utility-close:hover, .pmp-modal-submit.pmp-cta--utility-close:focus-visible { border-color: var(--pmp-cta-teal) !important; background: rgba(21, 112, 126, 0.07) !important; color: var(--pmp-cta-deep) !important; }
.pmp-custom-time-fields .pmp-modal-field-grid { align-items: stretch; }
.pmp-callback-time-field { min-width: 0px; display: flex; align-items: stretch; }
.pmp-time-selectors { width: 100%; min-height: 64px; display: grid; grid-template-columns: minmax(72px, 1fr) auto minmax(72px, 1fr) minmax(88px, 1fr); gap: 9px; align-items: center; padding: 0px; }
.pmp-time-selectors label { display: block; min-width: 0px; }
.pmp-time-selectors select { width: 100%; height: 64px; min-height: 64px; padding: 0px 38px 0px 18px; border: 1px solid rgb(207, 223, 225); border-radius: 10px; background: rgb(255, 255, 255); color: rgb(17, 36, 42); font: 600 18px / 1 "Hanken Grotesk", sans-serif; cursor: pointer; }
.pmp-time-selectors select:focus { outline: rgba(31, 163, 155, 0.18) solid 3px; border-color: rgb(21, 112, 126); }
.pmp-time-colon { font: 700 24px / 1 Sora, sans-serif; color: rgb(17, 36, 42); }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0px !important; margin: -1px !important; overflow: hidden !important; clip: rect(0px, 0px, 0px, 0px) !important; white-space: nowrap !important; border: 0px !important; }
@media (max-width: 760px){.pmp-custom-time-fields .pmp-modal-field-grid { grid-template-columns: 1fr !important; }}
@media (max-width: 520px){.pmp-time-selectors { grid-template-columns: minmax(62px, 1fr) auto minmax(62px, 1fr) minmax(78px, 1fr); gap: 6px; }}
@media (max-width: 520px){.pmp-time-selectors select { height: 58px; min-height: 58px; padding-left: 12px; padding-right: 29px; font-size: 16px; }}
.pmp-footer-legal { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 9px; }
.pmp-footer-legal a { color: rgb(169, 188, 191); text-decoration: none; transition: color 180ms; }
.pmp-footer-legal a:hover, .pmp-footer-legal a:focus-visible { color: var(--aqua-soft); outline: none; }
@media (min-width: 681px) and (max-width: 780px){.pmp-footer-bottom { flex-direction: column; align-items: flex-start; gap: 10px; }}