@font-face { font-family:'Albert Sans'; font-style:normal; font-weight:400 700; font-display:swap; src:url(../fonts/albert-sans-latin-ext.woff2) format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Albert Sans'; font-style:normal; font-weight:400 700; font-display:swap; src:url(../fonts/albert-sans-latin.woff2) format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Base */
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { margin:0; font-family:'Albert Sans', Tahoma, system-ui, sans-serif; background:#FFFFFF; color:#141414; -webkit-font-smoothing:antialiased; }
*, *::before, *::after { box-sizing:border-box; }
a { color:#8A1010; } a:hover { color:#5E0A0A; }
:where(h1,h2,h3,h4,p,figure,blockquote) { margin:0; }
:where(ul,ol) { margin:0; padding:0; list-style:none; }
button, input, select, textarea { font-family:inherit; }
input::placeholder, textarea::placeholder { color:#9AA3AC; }
img { display:block; max-width:100%; }
summary::-webkit-details-marker { display:none; }
details[open] summary span[data-plus] { transform:rotate(45deg); }
input[type=range] { accent-color:#8A1010; }
[hidden] { display:none !important; }
:focus-visible { outline:2px solid #8A1010; outline-offset:2px; }
.skip { position:absolute; left:-9999px; top:8px; z-index:100; background:#141414; color:#FFFFFF; padding:10px 16px; border-radius:6px; }
.skip:focus { left:8px; }
section[id] { scroll-margin-top:80px; }

/* Hover states from the design */
.hv1:hover { background:#5E0A0A !important; color:#FFFFFF !important; }
.hv2:hover { background:#3A3A3A !important; color:#FFFFFF !important; }
.hv3:hover { background:#E3E6EA !important; }
a.hv1, a.hv2, button.hv1, .hdr-cta { transition:background .15s; }
.zoom { transition:transform .6s; }
a:hover > .zoom { transform:scale(1.03); }

/* Homepage: choose new / old building */
.pick { padding-top:clamp(28px,4vw,44px); display:flex; flex-direction:column; gap:12px; }
.pick-q { font-size:13px; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:#8A1010; }
.pick-cards { display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap:12px; max-width:760px; }
.pick-c { display:flex; align-items:center; gap:16px; background:#F1F2F4; border-radius:10px; padding:14px 18px 14px 14px; color:#141414; text-decoration:none; transition:background .2s, color .2s; }
.pick-c img { width:64px; height:64px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.pick-t { display:flex; flex-direction:column; gap:2px; flex:1 1 auto; }
.pick-t strong { font-size:17px; font-weight:600; line-height:1.25; }
.pick-t small { font-size:14px; color:#4B5A6B; transition:color .2s; }
.pick-arr { flex-shrink:0; width:40px; height:40px; padding:10px; border-radius:50%; background:#8A1010; color:#FFFFFF; transition:transform .2s, background .2s, color .2s; }
.pick-c:hover, .pick-c:focus-visible { background:#8A1010; color:#FFFFFF; }
.pick-c:hover small, .pick-c:focus-visible small { color:#F1D6D6; }
.pick-c:hover .pick-arr, .pick-c:focus-visible .pick-arr { background:#FFFFFF; color:#8A1010; transform:translateX(3px); }

/* Homepage before/after: phones only */
.ba-mobile { display:none; margin:0; }
@media (max-width: 759px) { .ba-mobile { display:block; padding-top:24px; } }

/* Header */
.hdr { position:sticky; top:0; z-index:40; background:rgba(255,255,255,0.94); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
.admin-bar .hdr { top:32px; }
.hdr-row { max-width:1240px; margin:0 auto; padding:14px clamp(18px,4vw,48px); display:flex; flex-wrap:nowrap; align-items:center; gap:10px 20px; }
.hdr-logo { display:block; flex-shrink:0; }
.hdr-logo img { height:52px; width:auto; mix-blend-mode:multiply; }
.hdr-nav { display:flex; flex-wrap:wrap; gap:4px 22px; font-size:15px; font-weight:500; margin-left:clamp(8px,2vw,28px); flex:1 1 auto; }
.hdr-nav a { color:#141414; text-decoration:none; padding:8px 0; }
.hdr-nav a:hover, .hdr-nav a.on { color:#8A1010; }
.hdr-phone { font-size:16px; font-weight:600; color:#4B5A6B; text-decoration:none; margin-left:auto; white-space:nowrap; }
.hdr-cta { background:#8A1010; color:#FFFFFF; text-decoration:none; padding:12px 20px; border-radius:6px; font-size:14px; font-weight:600; white-space:nowrap; }
.nav-toggle { position:absolute; opacity:0; pointer-events:none; }
.nav-burger { display:none; }
@media (max-width: 1160px) {
  .hdr-row { flex-wrap:wrap; padding-top:10px; padding-bottom:10px; }
  .hdr-logo img { height:44px; }
  .nav-burger { display:flex; flex-direction:column; justify-content:center; gap:5px; width:44px; height:44px; margin-left:auto; padding:11px 10px; border-radius:6px; cursor:pointer; -webkit-tap-highlight-color:transparent; }
  .nav-burger span { display:block; height:2px; width:100%; background:#141414; border-radius:2px; transition:transform .25s, opacity .2s; }
  .nav-toggle:checked ~ .nav-burger span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
  .nav-toggle:checked ~ .nav-burger span:nth-child(2) { opacity:0; }
  .nav-toggle:checked ~ .nav-burger span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
  .nav-toggle:focus-visible ~ .nav-burger { outline:2px solid #8A1010; outline-offset:2px; }
  .hdr-nav { display:none; order:10; flex-basis:100%; flex-direction:column; gap:0; margin:6px 0 4px; border-top:1px solid #E6E8EB; font-size:17px; }
  .hdr-nav a { padding:14px 2px; border-bottom:1px solid #F1F2F4; }
  .nav-toggle:checked ~ .hdr-nav { display:flex; }
  .hdr-phone, .hdr-cta { order:11; display:none; }
  .hdr-phone { margin-left:0; }
  .nav-toggle:checked ~ .hdr-phone { display:block; padding:12px 2px 4px; }
  .nav-toggle:checked ~ .hdr-cta { display:block; flex-basis:100%; text-align:center; margin-bottom:8px; }
}
@media (max-width: 782px) { .admin-bar .hdr { top:46px; } }
@media (max-width: 600px) { .admin-bar .hdr { top:0; } }

/* Footer + mobile action bar */
.ftr { background:#141414; color:#9AA3AC; }
.ftr-row { max-width:1240px; margin:0 auto; padding:40px clamp(18px,4vw,48px); display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap:28px 40px; font-size:14px; line-height:1.6; }
.ftr a { color:#FFFFFF; text-decoration:none; }
.ftr a:hover { color:#D9A5A5; }
.mbar { display:none; }
@media (max-width: 759px) {
  .ftr-row { padding-bottom:110px; }
  .mbar { position:fixed; left:0; right:0; bottom:0; z-index:50; display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); background:#FFFFFF; box-shadow:0 -8px 30px rgba(20,20,20,0.12); }
  .mbar a { display:flex; align-items:center; justify-content:center; height:48px; border-radius:6px; text-decoration:none; font-size:15px; font-weight:600; }
  .mbar-call { background:#F1F2F4; color:#141414; }
  .mbar-cta { background:#8A1010; color:#FFFFFF; }
}

/* Responsive grids that were computed in JS in the design */
.gal { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); grid-auto-rows:240px; gap:12px; }
.pricing { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px; }
@media (max-width: 899px) { .pricing { grid-template-columns:1fr; } }
@media (max-width: 759px) { .gal { grid-template-columns:repeat(2, minmax(0,1fr)); grid-auto-rows:160px; } }

/* Toggle buttons */
.pill { height:46px; padding:0 16px; border-radius:6px; font-size:14px; font-weight:600; cursor:pointer; border:none; background:#FFFFFF; color:#141414; transition:background .15s, color .15s; }
.pill-lg { height:50px; font-size:15px; }
.pill:hover { background:#E3E6EA; }
.pill.on { background:#141414; color:#FFFFFF; }
.seg { height:40px; padding:0 18px; border-radius:4px; font-size:14px; font-weight:600; cursor:pointer; border:none; background:transparent; color:#9AA3AC; transition:background .15s, color .15s; }
.seg:hover { color:#FFFFFF; }
.seg.on { background:#FFFFFF; color:#141414; }
.step-t { font-size:15px; line-height:1.55; color:#E3E6EA; transition:color .2s; }
[data-steps].is-typ .step-t { color:#9AA3AC; }
@media (min-width: 1100px) { [data-steps] { grid-template-columns:repeat(5, minmax(0,1fr)) !important; } }

/* Before / after slider */
.ba input[type=range] { touch-action:pan-y; }

/* Forms */
.r123-form input:not([type=checkbox]):not([type=file]), .r123-form select, .r123-form textarea { outline:1px solid transparent; transition:outline-color .15s; }
.r123-form input:focus-visible, .r123-form select:focus-visible, .r123-form textarea:focus-visible { outline:2px solid #8A1010; outline-offset:0; }
.r123-form .bad { outline:2px solid #8A1010 !important; }
.r123-form button[disabled] { opacity:.6; cursor:wait; }

/* Generic content (blog posts, other pages) */
.wrap { max-width:1240px; margin:0 auto; padding:clamp(32px,5vw,72px) clamp(18px,4vw,48px) clamp(56px,8vw,112px); }
.eyebrow { font-size:13px; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:#4B5A6B; padding-bottom:18px; }
.page-title { font-weight:500; font-size:clamp(34px,4.4vw,58px); line-height:1.08; letter-spacing:-0.02em; max-width:22ch; text-wrap:balance; }
.prose { max-width:72ch; padding-top:clamp(24px,3vw,40px); font-size:18px; line-height:1.7; color:#2A2F35; }
.prose > * + * { margin-top:1.1em; }
.prose h2 { font-weight:500; font-size:clamp(26px,2.6vw,34px); line-height:1.15; letter-spacing:-0.02em; color:#141414; margin-top:1.8em; }
.prose h3 { font-weight:600; font-size:21px; line-height:1.3; color:#141414; margin-top:1.6em; }
.prose ul, .prose ol { padding-left:1.3em; }
.prose ul { list-style:disc; } .prose ol { list-style:decimal; }
.prose li + li { margin-top:.4em; }
.prose img { height:auto; border-radius:8px; }
.prose blockquote { border-left:3px solid #8A1010; padding-left:18px; color:#4B5A6B; }
.prose table { border-collapse:collapse; width:100%; font-size:16px; }
.prose td, .prose th { border-bottom:1px solid #E3E6EA; padding:10px 8px; text-align:left; }
.cards { display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap:16px; padding-top:clamp(28px,4vw,48px); }
.card { display:flex; flex-direction:column; gap:12px; background:#F1F2F4; border-radius:10px; padding:24px; text-decoration:none; color:#141414; }
.card:hover { background:#E3E6EA; color:#141414; }
.card img { width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:6px; }
.card h2 { font-weight:600; font-size:20px; line-height:1.3; }
.card p { font-size:15px; line-height:1.55; color:#4B5A6B; }
.btn { display:inline-flex; align-items:center; justify-content:center; background:#8A1010; color:#FFFFFF; text-decoration:none; padding:16px 26px; border-radius:6px; font-size:16px; font-weight:600; }
.btn:hover { background:#5E0A0A; color:#FFFFFF; }
.btn-alt { background:#F1F2F4; color:#141414; }
.btn-alt:hover { background:#E3E6EA; color:#141414; }
.pager { display:flex; gap:12px; padding-top:32px; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { transition:none !important; animation:none !important; }
}
