/* Art direction: professional property management → calm, precise, trustworthy
   Palette: warm neutral with burgundy accent derived from the original logo
   Typography: Manrope — contemporary, highly legible, restrained
   Density: balanced */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

:root,
[data-theme="light"] {
  --font-body: 'Manrope', 'Segoe UI', sans-serif;
  --font-display: 'Manrope', 'Segoe UI', sans-serif;
  --text-xs: clamp(.75rem, .72rem + .12vw, .82rem);
  --text-sm: clamp(.875rem, .84rem + .15vw, .95rem);
  --text-base: clamp(1rem, .96rem + .18vw, 1.08rem);
  --text-lg: clamp(1.18rem, 1.05rem + .55vw, 1.45rem);
  --text-xl: clamp(1.65rem, 1.35rem + 1.2vw, 2.35rem);
  --text-2xl: clamp(2.35rem, 1.65rem + 3vw, 4.2rem);
  --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem;
  --space-5: 1.25rem; --space-6: 1.5rem; --space-8: 2rem; --space-10: 2.5rem;
  --space-12: 3rem; --space-16: 4rem; --space-20: 5rem; --space-24: 6rem;
  --bg: #f5f3ef; --surface: #fffdf9; --surface-2: #f0ede7; --text: #24221f;
  --muted: #66615b; --faint: #8c857e; --border: rgba(36,34,31,.13);
  --primary: #9a741f; --primary-hover: #765712; --primary-soft: #eee5ca;
  --header: rgba(245,243,239,.9); --inverse: #fffaf5;
--page-overlay: rgba(245,243,239,.80);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.06);
  --shadow-md: 0 12px 36px rgba(45,36,24,.1);
  --radius-sm: .45rem; --radius-md: .75rem; --radius-lg: 1.1rem; --radius-xl: 1.5rem;
  --content: 1120px; --ease: 180ms cubic-bezier(.16,1,.3,1);
}
[data-theme="dark"] {
  --bg: #111b29; --surface: #182537; --surface-2: #213147; --text: #f0f3f7;
  --muted: #bec8d4; --faint: #98a6b6; --border: rgba(255,255,255,.13);
  --primary: #d4ad54; --primary-hover: #e3c475; --primary-soft: #343526;
  --header: rgba(17,27,41,.9); --inverse: #122033;
--page-overlay: rgba(17,27,41,.87);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.25); --shadow-md: 0 12px 36px rgba(0,0,0,.32);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:none;text-size-adjust:none;scroll-behavior:smooth;scroll-padding-top:6rem}
body{min-height:100dvh;background:transparent;color:var(--text);font:400 var(--text-base)/1.7 var(--font-body);-webkit-font-smoothing:antialiased;isolation:isolate}
body::before,body::after{content:"";position:fixed;inset:0;pointer-events:none}
body::before{z-index:-2;background:url("assets/background.webp") center/cover no-repeat}
body::after{z-index:-1;background:var(--page-overlay);transition:background var(--ease)}
img,svg{display:block;max-width:100%;height:auto} a{color:inherit} button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer} h1,h2,h3{font-family:var(--font-display);line-height:1.08;text-wrap:balance} p{max-width:72ch;text-wrap:pretty}
::selection{background:var(--primary-soft)} :focus-visible{outline:3px solid var(--primary);outline-offset:3px;border-radius:var(--radius-sm)}
.skip-link{position:fixed;left:var(--space-4);top:-5rem;z-index:1000;padding:var(--space-3) var(--space-4);background:var(--primary);color:var(--inverse);border-radius:var(--radius-md)}
.skip-link:focus{top:var(--space-4)}
.container{width:min(calc(100% - 2rem),var(--content));margin-inline:auto}
.site-header{position:sticky;top:0;z-index:50;background:var(--header);border-bottom:1px solid var(--border);backdrop-filter:blur(18px)}
.header-inner{min-height:5rem;display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}
.brand{display:inline-flex;align-items:center;text-decoration:none;min-height:2.75rem;flex:0 1 20rem}
.brand-logo{position:relative;display:block;width:min(20rem,40vw);aspect-ratio:1400/347}
.brand-logo-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:left center;transition:opacity var(--ease)}
.brand-logo-dark{opacity:0}
[data-theme="dark"] .brand-logo-light{opacity:0}
[data-theme="dark"] .brand-logo-dark{opacity:1}
.nav-wrap{display:flex;align-items:center;gap:var(--space-2)} .main-nav ul{display:flex;align-items:center;gap:var(--space-1);list-style:none}
.main-nav a{display:flex;align-items:center;min-height:2.75rem;padding-inline:var(--space-4);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:650;text-decoration:none;color:var(--muted)}
.main-nav a:hover{color:var(--text);background:var(--surface-2)} .main-nav a[aria-current="page"]{color:var(--primary);background:var(--primary-soft)}
.icon-button,.menu-button{width:2.75rem;height:2.75rem;display:grid;place-items:center;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);color:var(--text)}
.icon-button:hover,.menu-button:hover{background:var(--surface-2)} .menu-button{display:none}
.hero{position:relative;overflow:hidden;padding-block:clamp(var(--space-16),9vw,var(--space-24));border-bottom:1px solid var(--border)}
.hero::after{content:"";position:absolute;inset:auto -8% -42% 45%;height:90%;background:repeating-linear-gradient(90deg,transparent 0 3.75rem,var(--border) 3.75rem calc(3.75rem + 1px));transform:skewY(-8deg);opacity:.55;pointer-events:none}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(16rem,.65fr);gap:clamp(var(--space-10),7vw,var(--space-20));align-items:end}
.eyebrow{display:inline-flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-5);font-size:var(--text-xs);font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--primary)}
.eyebrow::before{content:"";width:2rem;height:2px;background:currentColor}
h1{max-width:13ch;font-size:var(--text-2xl);font-weight:750;letter-spacing:-.045em}
.hero-lead{max-width:38ch;color:var(--muted);font-size:var(--text-lg);line-height:1.55}
.section{padding-block:clamp(var(--space-12),7vw,var(--space-20))}.section-tight{padding-block:clamp(var(--space-10),5vw,var(--space-16))}
.intro-grid{display:grid;grid-template-columns:minmax(13rem,.48fr) minmax(0,1fr);gap:clamp(var(--space-8),7vw,var(--space-20));align-items:start}
.sticky-heading{position:sticky;top:7rem}.section-number{display:block;margin-bottom:var(--space-4);color:var(--primary);font-size:var(--text-xs);font-weight:800;letter-spacing:.12em}
h2{font-size:var(--text-xl);letter-spacing:-.035em} h3{font-size:var(--text-lg);letter-spacing:-.02em}
.prose{display:grid;gap:var(--space-6)} .prose p{color:var(--muted)} .prose strong{color:var(--text)}
.services{background:color-mix(in srgb,var(--surface) 90%,transparent);border-block:1px solid var(--border);backdrop-filter:blur(7px)}
.service-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--border);margin-top:var(--space-10)}
.service-item{min-height:8.5rem;padding:var(--space-6) 0;display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-4);border-bottom:1px solid var(--border)}
.service-item:nth-child(odd){padding-right:var(--space-8);border-right:1px solid var(--border)} .service-item:nth-child(even){padding-left:var(--space-8)}
.service-item span{font-weight:700}.service-item small{color:var(--faint);font-size:var(--text-xs);font-variant-numeric:tabular-nums}
.cta{display:grid;grid-template-columns:1fr auto;gap:var(--space-8);align-items:center;padding:clamp(var(--space-8),6vw,var(--space-16));background:var(--text);color:var(--bg);border-radius:var(--radius-xl);box-shadow:var(--shadow-md)}
.cta p{margin-top:var(--space-3);color:color-mix(in srgb,var(--bg) 72%,transparent)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:3rem;padding:var(--space-3) var(--space-5);border:1px solid transparent;border-radius:var(--radius-md);background:var(--primary);color:var(--inverse);font-size:var(--text-sm);font-weight:750;text-decoration:none}
.button:hover{background:var(--primary-hover);transform:translateY(-1px)} .button-light{background:var(--bg);color:var(--text)} .button-light:hover{background:var(--surface-2)}
.page-hero{padding-block:clamp(var(--space-12),7vw,var(--space-20));border-bottom:1px solid var(--border)} .page-hero h1{margin-top:var(--space-4)}
.page-lead{margin-top:var(--space-5);max-width:52ch;color:var(--muted);font-size:var(--text-lg)}
.offer-layout{display:grid;grid-template-columns:minmax(0,1fr) 18rem;gap:clamp(var(--space-8),7vw,var(--space-20));align-items:start}
.panel{padding:var(--space-8);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}
.panel p{color:var(--muted)} .panel h2,.panel h3{margin-bottom:var(--space-4)}
.login-panel{max-width:46rem;margin-inline:auto;padding:clamp(var(--space-8),7vw,var(--space-16));text-align:left}
.login-panel .external-note{margin-top:var(--space-4);font-size:var(--text-xs);color:var(--faint)}
.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:var(--space-6)}
.contact-card{display:flex;flex-direction:column;justify-content:space-between;min-height:4rem;padding:var(--space-8);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg)}
.contact-card.wide{grid-row:span 2;min-height:100%}.contact-label{color:var(--faint);font-size:var(--text-xs);font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.contact-value{margin-top:var(--space-2);font-size:var(--text-lg);font-weight:700;text-decoration:none}.contact-value:hover{color:var(--primary)}
address{font-style:normal}.site-footer{margin-top:auto;padding-block:var(--space-8);border-top:1px solid var(--border);background:color-mix(in srgb,var(--bg) 72%,transparent);backdrop-filter:blur(8px)}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:var(--space-6);color:var(--muted);font-size:var(--text-xs)}
.footer-nav{display:flex;gap:var(--space-5);list-style:none}.footer-nav a:hover{color:var(--primary)}
body{display:flex;flex-direction:column}main{flex:1}
a,button{transition:color var(--ease),background var(--ease),border-color var(--ease),transform var(--ease),box-shadow var(--ease)}
.reveal{animation:reveal .65s cubic-bezier(.16,1,.3,1) both}@keyframes reveal{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(max-width:780px){
  .container{width:min(calc(100% - 1.5rem),var(--content))}.menu-button{display:grid}.main-nav{position:absolute;left:.75rem;right:.75rem;top:calc(100% + .5rem);padding:var(--space-2);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);visibility:hidden;opacity:0;transform:translateY(-.5rem);transition:all var(--ease)}
  .main-nav[data-open="true"]{visibility:visible;opacity:1;transform:none}.main-nav ul{display:grid}.main-nav a{padding-inline:var(--space-4)}
  .hero-grid,.intro-grid,.offer-layout,.contact-grid{grid-template-columns:1fr}.hero{padding-block:var(--space-16)}.hero::after{inset:auto -40% -55% 25%}.sticky-heading{position:static}.service-list{grid-template-columns:1fr}.service-item:nth-child(n){padding-inline:0;border-right:0}.cta{grid-template-columns:1fr}.cta .button{justify-self:start}.contact-card.wide{grid-row:auto}.footer-inner{align-items:flex-start;flex-direction:column}.footer-nav{flex-wrap:wrap}
}
@media(max-width:420px){.brand{flex-basis:13rem}.brand-logo{width:min(13rem,58vw)}.header-inner{min-height:4.5rem}.service-item{min-height:7rem}.panel,.contact-card{padding:var(--space-6)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}

@media (max-width:780px){body::before{background-position:68% center}}
