/* Source: /mobile-header-call-20261017.css */
/* RENOVA: a phone call pill and a right-aligned three-line mobile menu. */
.site-header .renova-header-call-icon { display: none; }

@media (max-width: 760px), (max-width: 1100px) and (max-height: 500px) and (pointer: coarse) {
  /* Approximately 6% more ink coverage, including the descriptor; preserve logo dimensions. */
  body .site-header .brand { transform: scale(1.1) translateY(5%); transform-origin: left center;
    filter: drop-shadow(0 0 0 color-mix(in srgb, currentColor 41%, transparent)) drop-shadow(0 0 0 color-mix(in srgb, currentColor 41%, transparent)) drop-shadow(0 0 0 color-mix(in srgb, currentColor 41%, transparent)) drop-shadow(0 0 0 color-mix(in srgb, currentColor 41%, transparent));
  }
  body .site-header .header-end { --renova-menu-edge-inset: 10.499100721306px; gap: 10px; flex-shrink: 0; align-items: center; }
  body .site-header .header-phone {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 56px;
    box-sizing: border-box;
    width: 56px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 22px;
    background: transparent;
    color: #f1efe9 !important;
    text-decoration: none;
    line-height: 1;
    isolation: isolate;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }
  body .site-header .header-phone::before {
    content: "";
    position: absolute;
    inset: 4px 2px;
    z-index: -1;
    pointer-events: none;
    border: 1px solid rgba(102, 81, 63, .18);
    border-radius: 20px;
    background: rgba(102, 81, 63, .92);
    transform: scale(.889287);
    transition: background-color .2s ease;
  }
  body .site-header .renova-header-call-number { display: none; }
  body .site-header .renova-header-call-icon {
    display: block;
    width: 19.720828512px;
    height: 19.720828512px;
    flex: none;
    pointer-events: none;
    transform-box: fill-box;
    transform-origin: center;
    animation: renova-phone-shake 6s ease-in-out 6s infinite;
  }
  body .site-header .menu-toggle {
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none;
    touch-action: manipulation;
  }
  body .site-header .menu-toggle::before { content: none; }
  body .site-header .menu-toggle::after {
    content: "";
    position: absolute;
    top: calc(50% - 1.406204734347px);
    left: 12.45046px;
    width: 25.46544px;
    height: 2.812409468694px;
    background: currentColor;
    pointer-events: none;
    opacity: 1;
    transform: scaleX(1);
    transition: opacity .18s ease, transform .3s ease;
  }
  body .site-header .menu-toggle span { top: calc(50% - 1.406204734347px); left: 6.0841px !important; width: 31.8318px !important; height: 2.812409468694px !important; transition: transform .3s ease, width .3s ease, left .3s ease; }
  /* Center the closed menu at 23.001798557388px tall; top grows upward, bottom downward, middle stays centered. */
  body .site-header .menu-toggle span:first-child { top: var(--renova-menu-edge-inset); bottom: auto; transform: none; }
  body .site-header .menu-toggle span:last-child { top: auto; bottom: var(--renova-menu-edge-inset); transform: none; }
  body .site-header .menu-toggle[aria-expanded="true"] span:first-child { top: calc(50% - 1.406204734347px); bottom: auto; transform: rotate(45deg); }
  body .site-header .menu-toggle[aria-expanded="true"] span:last-child { top: calc(50% - 1.406204734347px); bottom: auto; left: 6.0841px !important; width: 31.8318px !important; transform: rotate(-45deg); }
  body .site-header .menu-toggle[aria-expanded="true"]::after { opacity: 0; transform: scaleX(.55); }
  body .site-header .header-phone:focus-visible { outline: 2px solid #66513f; outline-offset: 2px; }
  body .site-header .header-phone:active::before { background: #514437; }
  body.menu-open .site-header .header-phone::before {
    background: rgba(241, 239, 233, .10);
    border-color: rgba(241, 239, 233, .40);
  }
  body.menu-open .site-header .header-phone:focus-visible { outline-color: #f1efe9; }
}

/* A brief handset shake every six seconds; the pill stays still. */
@keyframes renova-phone-shake {
  0%, 10%, 100% { transform: rotate(0deg); }
  2% { transform: rotate(-26.25deg); }
  4% { transform: rotate(22.5deg); }
  6% { transform: rotate(-16.875deg); }
  8% { transform: rotate(9.375deg); }
}

@media (prefers-reduced-motion: reduce) {
  .site-header .renova-header-call-icon { animation: none; }
  .site-header .header-phone::before,
  .site-header .menu-toggle::after { transition: none; }
}
@media (max-width: 760px) and (forced-colors: active), (max-width: 1100px) and (max-height: 500px) and (pointer: coarse) and (forced-colors: active) {
  .site-header .header-phone { color: LinkText !important; }
  .site-header .header-phone::before { background: Canvas; border-color: LinkText; }
}

/* 2026-10-19: 15% shorter phone header (72px -> 61.2px), preserving safe area and 44px controls. */
@media (max-width: 760px), (max-width: 1100px) and (max-height: 500px) and (pointer: coarse) {
  body .site-header,
  body:not(.menu-open) .site-header,
  body:not(.menu-open) .site-header.is-scrolled {
    height: calc(61.2px + env(safe-area-inset-top));
  }
  html { scroll-padding-top: calc(89.2px + env(safe-area-inset-top)); }
  body #mobile-menu.mobile-nav { padding-top: calc(101.2px + env(safe-area-inset-top)); }
  body #project-inquiry { scroll-margin-top: calc(93.2px + env(safe-area-inset-top)); }
}


/* Source: /selective-lighting-20261019.css */
/* RENOVA selective lighting review, 2026-10-19.
   Presentation-only exposure adjustments: original image/video bytes, 4K masters,
   responsive delivery, frame rate, motion, crop, geometry and branding are unchanged.
   Intentionally bright/daylight scenes, portraits, night scenes and material studies
   retain their existing treatment. The two approved homepage frames stay at 1.38. */

body img[src*="/assets/projects/bathroom-in-delray-beach/hero-4k-display.webp"],
body img[src*="/assets/projects/broken-sound-whole-home-renovation-project-boca-raton/20260918-gallery-complete/distinct-detail-1.webp"],
body img[src*="/assets/projects/east-delray-elegance-unveils-a-luxurious-modern-kitchen-renovation/20260918-gallery-complete/distinct-detail-1.webp"],
body img[src*="/assets/projects/east-delray-elegance-unveils-a-luxurious-modern-kitchen-renovation/20260918-gallery-completion/additional-4.webp"],
body img[src*="/assets/projects/east-delray-elegance-unveils-a-luxurious-modern-kitchen-renovation/gallery-4.jpg"],
body img[src*="/assets/services/construction-management/story-20260921-01/07-structure-detail-4k.webp"] { filter: brightness(1.06); }

body img[src*="/assets/images-4k-20261018/915977a5d596dc/"],
body img[src*="/assets/projects/bathroom-in-delray-beach/gallery-1-4k-display.webp"],
body img[src*="/assets/projects/bathroom-in-delray-beach/gallery-2-4k-display.webp"],
body img[src*="/assets/projects/broken-sound-whole-home-renovation-project-boca-raton/20260918-gallery-complete/distinct-detail-3.webp"],
body img[src*="/assets/projects/broken-sound-whole-home-renovation-project-boca-raton/gallery-3-4k-display.webp"],
body img[src*="/assets/projects/broken-sound-whole-home-renovation-project-boca-raton/hero-4k-display.webp"],
body img[src*="/assets/projects/east-boca-raton-master-bathroom-renovation/20260918-gallery-complete/distinct-detail-1.webp"],
body img[src*="/assets/projects/east-boca-raton-master-bathroom-renovation/gallery-1.jpg"],
body img[src*="/assets/projects/east-boca-raton-master-bathroom-renovation/hero.jpg"],
body img[src*="/assets/projects/east-delray-elegance-unveils-a-luxurious-modern-kitchen-renovation/20260918-gallery-completion/additional-1.webp"],
body img[src*="/assets/projects/east-delray-elegance-unveils-a-luxurious-modern-kitchen-renovation/20260918-gallery-completion/additional-2.webp"],
body img[src*="/assets/projects/east-delray-elegance-unveils-a-luxurious-modern-kitchen-renovation/hero.jpg"],
body img[src*="/assets/services/construction-management/story-20260921-01/01-hero-4k.webp"],
body img[src*="/assets/services/construction-management/story-20260921-01/09-kitchen-4k.webp"],
body img[src*="/assets/services/construction-management/story-20260921-01/10-primary-suite-4k.webp"] { filter: brightness(1.08); }

body img[src*="/assets/images-4k-20261018/199fad96136554/"],
body img[src*="/assets/projects/east-boca-raton-master-bathroom-renovation/20260918-gallery-completion/additional-2.webp"],
body img[src*="/assets/projects/east-boca-raton-master-bathroom-renovation/gallery-2.jpg"],
body img[src*="/assets/projects/east-boca-raton-master-bathroom-renovation/gallery-4.jpg"],
body img[src*="/assets/projects/east-delray-elegance-unveils-a-luxurious-modern-kitchen-renovation/20260918-gallery-completion/additional-3.webp"],
body img[src*="/assets/projects/east-delray-elegance-unveils-a-luxurious-modern-kitchen-renovation/gallery-3-4k-display.webp"] { filter: brightness(1.1); }

body img[src*="/assets/projects/camino-real-whole-home-renovation-project-boca/gallery-2-4k-display.webp"] { filter: brightness(1.15); }

/* Selected city aerial: retain its existing monochrome treatment. */
body.city-guide-page .city-hero-image > img[src*="/assets/cities/weston-20260921-3840.webp"] {
  filter: grayscale(1) contrast(1.035) brightness(1.1178);
}

/* Keep the poster and moving footage equally exposed; no re-encoding. */
body #project-film-video { filter: brightness(1.06); }
body #contact-project-film { filter: brightness(1.08); }
body .closing-gather .closing-image-wrap > img,
body .closing-gather .closing-image-wrap > video { filter: brightness(1.06); }
body [data-construction-loop="/assets/services/condo-renovations/action-video-v2/left-action.mp4"] > img,
body [data-construction-loop="/assets/services/condo-renovations/action-video-v2/left-action.mp4"] > video,
body .pbd-film-frame > img,
body .pbd-film-frame > video { filter: brightness(1.08); }

/* Ease the heavy finishing-frame scrim 15%; retain the directional text backing. */
body.kr-page .kr-payoff-media::after,
body.cr-page .cr-payoff-media::after {
  background: linear-gradient(90deg,rgba(14, 12, 10,.646),rgba(14, 12, 10,.1615) 62%,rgba(14, 12, 10,.102)),
              linear-gradient(0deg,rgba(14, 12, 10,.425),transparent 48%);
}

/* Community photo and video share this scrim. Retain the existing animated shade. */
body.community-page .cm-scene::after {
  background: linear-gradient(90deg,rgba(23,23,23,.374),rgba(22,20,18,.085) 58%,rgba(22,20,18,.221)),
              linear-gradient(0deg,rgba(18,18,18,.629),transparent 55%,rgba(22,22,22,.272));
}


/* Source: /navigation-quiet-ivory-20261029.css */
/* Approved option 1: solid ivory navigation and one compact mobile contact bar. */
html body #top.site-header {
  --header-brand-brown: #66513f;
  --header-logo-brown: #66513f;
  position: fixed !important;
  background: #f1efe9 !important;
  color: #66513f !important;
  border-bottom: 1px solid #c9c3b8 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: none !important;
}
html body #top.site-header .brand::after { background-color: #66513f !important; }
html body #top.site-header :is(.desktop-nav a,.header-phone,.menu-toggle) { color: #66513f !important; }
html body #top.site-header .menu-toggle span,
html body #top.site-header .menu-toggle::after { background: #66513f !important; }
html body #top.site-header :is(a,button):focus-visible { outline: 2px solid #66513f; outline-offset: 5px; }
html body #top.site-header .header-cta {
  color: #f1efe9 !important;
  background: #514437 !important;
  border: 1px solid #514437 !important;
  border-radius: 2px;
}
@media(min-width:1101px) {
  html body #top.site-header { height: 76px; display: flex; justify-content: space-between; gap: 24px; padding-inline: clamp(24px,3vw,48px); }
  html body #top.site-header .brand { width: 180px !important; flex: 0 0 180px; }
  html body #top.site-header .brand img { width: 100%; }
  html body #top.site-header .desktop-nav { display: flex !important; gap: 20px; }
  html body #top.site-header .desktop-nav a { font-size: 11px; letter-spacing: .08em; }
  html body #top.site-header .header-end { display: flex; align-items: center; gap: 20px; }
  html body #top.site-header .header-phone { display: inline-flex !important; font-size: 11px; letter-spacing: .04em; white-space: nowrap; }
  html body #top.site-header .header-cta { padding: 14px 18px; font-size: 11px; letter-spacing: .04em; white-space: nowrap; }
  html body #top.site-header .menu-toggle { display: none !important; }
  html body #top.site-header .header-cta:hover { background: #66513f !important; }
}
@media(max-width:1100px) {
  html body #top.site-header { height: calc(72px + env(safe-area-inset-top)); }
  html body #top.site-header .brand { width: 164.5px !important; }
  html body #top.site-header .menu-toggle { border: 0 !important; border-radius: 0; background: transparent !important; }
  html body #mobile-menu.mobile-nav {
    color: #66513f;
    background: #f1efe9;
    padding-top: calc(104px + env(safe-area-inset-top));
    padding-bottom: max(28px,calc(20px + env(safe-area-inset-bottom)));
  }
  html body #mobile-menu.mobile-nav>a {
    width: 100%;
    min-height: 48px;
    padding: 10px 0;
    border-bottom: 1px solid #c9c3b8;
    color: #242321;
    font-family: var(--serif,Georgia,'Times New Roman',serif);
    font-size: 26px;
    font-weight: 400;
  }
  html body #mobile-menu.mobile-nav>a:hover,
  html body #mobile-menu.mobile-nav>a[aria-current="page"],
  html body #mobile-menu.mobile-nav>a[aria-current="location"] { color: #66513f; }
  html body #mobile-menu.mobile-nav>a.mobile-nav-project {
    width: auto;
    margin-top: 26px;
    padding: 14px 18px;
    border: 1px solid #514437;
    border-radius: 2px;
    background: #514437;
    color: #f1efe9;
    font-family: var(--sans,Arial,sans-serif);
    font-size: 12px;
  }
  html body #mobile-menu .mobile-nav-footer {
    color: #66513f;
    border-color: #c9c3b8;
    padding-top: 18px;
  }
  html body #mobile-menu .mobile-nav-project+.mobile-nav-footer { top: 0; margin-top: 28px; }
  html body #mobile-menu .mobile-nav-footer a { color: #66513f; }
  html body #mobile-menu a:focus-visible { outline-color: #66513f; }
}
@media(max-width:760px), (max-width:1100px) and (max-height:500px) and (pointer:coarse) {
  html { scroll-padding-top: calc(100px + env(safe-area-inset-top)); scroll-padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  body { padding-bottom: calc(66px + env(safe-area-inset-bottom)); }
  html body #top.site-header .header-phone { display: none !important; }
  html body #top.site-header .header-end { gap: 0; }
  html body #top.site-header .brand { transform: scale(1.1) translateY(5%); }
  html body .mobile-action-bar {
    grid-template-columns: 1fr 1.3fr;
    gap: 12px;
    padding: 8px max(16px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
    border-top: 1px solid #c9c3b8;
    background: #f1efe9;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  html body .mobile-action-bar a { min-height: 48px; border-radius: 2px; }
  html body .mobile-action-bar .mobile-action-call {
    position: relative;
    align-items: flex-start;
    justify-content: center;
    gap: 3px;
    padding: 5px 0 5px 24px;
    border: 0;
    color: #66513f;
    background: transparent;
  }
  html body .mobile-action-call::before {
    content: '';
    position: absolute;
    left: 0;
    top: calc(50% - 8px);
    width: 16px;
    height: 16px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 2.5H4.4c-1.05 0-1.9.85-1.9 1.9 0 9.44 7.66 17.1 17.1 17.1 1.05 0 1.9-.85 1.9-1.9v-2.2c0-.88-.6-1.65-1.46-1.85l-3.06-.72c-.65-.15-1.33.04-1.8.52l-1.3 1.3a12.6 12.6 0 0 1-6.53-6.53l1.3-1.3c.48-.47.67-1.15.52-1.8l-.72-3.06A1.9 1.9 0 0 0 6.6 2.5Z' fill='black' stroke='black' stroke-width='.675' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 2.5H4.4c-1.05 0-1.9.85-1.9 1.9 0 9.44 7.66 17.1 17.1 17.1 1.05 0 1.9-.85 1.9-1.9v-2.2c0-.88-.6-1.65-1.46-1.85l-3.06-.72c-.65-.15-1.33.04-1.8.52l-1.3 1.3a12.6 12.6 0 0 1-6.53-6.53l1.3-1.3c.48-.47.67-1.15.52-1.8l-.72-3.06A1.9 1.9 0 0 0 6.6 2.5Z' fill='black' stroke='black' stroke-width='.675' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  html body .mobile-action-call span { font-size: 8px; letter-spacing: .12em; }
  html body .mobile-action-call strong { font-size: 12px; letter-spacing: .035em; color: #66513f; }
  html body .mobile-action-bar .mobile-action-estimate {
    gap: 10px;
    padding: 8px 10px;
    border: 1px solid #514437;
    background: #514437;
    color: #f1efe9;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .025em;
    text-transform: none;
  }
  html body .mobile-action-estimate svg { width: 18px; height: 18px; }
  html body #project-inquiry { scroll-margin-top: calc(104px + env(safe-area-inset-top)); }
  html body #nl-badge-frame { bottom: calc(74px + env(safe-area-inset-bottom)) !important; }
}
@media(max-width:360px) {
  html body #top.site-header .brand { width: 154px !important; }
  html body .mobile-action-bar { gap: 8px; padding-left: 12px; padding-right: 12px; }
  html body .mobile-action-bar .mobile-action-call { padding-left: 20px; }
  html body .mobile-action-call strong { font-size: 11px; }
  html body .mobile-action-bar .mobile-action-estimate { font-size: 10px; gap: 7px; }
}
@media print { html body #top.site-header { position: static !important; } }

/* Refined mobile call module: a light framed companion to the estimate button. */
@media(max-width:760px), (max-width:1100px) and (max-height:500px) and (pointer:coarse) {
  html body .mobile-action-bar .mobile-action-call {
    display: grid;
    grid-template-columns: 20.7px minmax(0,1fr);
    grid-template-rows: auto auto;
    column-gap: 7px;
    row-gap: 3px;
    align-content: center;
    align-items: start;
    justify-content: normal;
    justify-items: start;
    padding: 7px 9px;
    border: 1px solid #b4a387;
    border-radius: 2px;
    background: #faf9f6;
    color: #514437;
  }
  html body .mobile-action-bar .mobile-action-call::before {
    position: static;
    grid-column: 1;
    grid-row: 1 / 3;
    align-self: center;
    width: 20.7px;
    height: 20.7px;
  }
  html body .mobile-action-bar .mobile-action-call span {
    grid-column: 2;
    grid-row: 1;
    font-size: 8.625px;
    font-weight: 661.25;
    color: #3f342a;
    line-height: 1.1;
    letter-spacing: .12em;
    white-space: nowrap;
  }
  html body .mobile-action-bar .mobile-action-call strong {
    grid-column: 2;
    grid-row: 2;
    font-size: 12.6px;
    font-weight: 650;
    line-height: 1.1;
    letter-spacing: .01em;
    font-variant-numeric: lining-nums tabular-nums;
    color: #514437;
    white-space: nowrap;
  }
  html body .mobile-action-bar .mobile-action-call:hover { background: #f1efe9; border-color: #66513f; }
  html body .mobile-action-bar .mobile-action-call:focus-visible { outline: 2px solid #66513f; outline-offset: 2px; }
}
@media(max-width:360px) {
  html body .mobile-action-bar .mobile-action-call { grid-template-columns: 17.25px minmax(0,1fr); column-gap: 5px; padding-inline: 6px; }
  html body .mobile-action-bar .mobile-action-call::before { width: 17.25px; height: 17.25px; }
  html body .mobile-action-bar .mobile-action-call span { font-size: 8.05px; letter-spacing: .09em; }
  html body .mobile-action-bar .mobile-action-call strong { font-size: 11.5px; letter-spacing: 0; }
}

/* Balance the estimate label with the refined phone module. */
@media(max-width:760px), (max-width:1100px) and (max-height:500px) and (pointer:coarse) {
  html body .mobile-action-bar .mobile-action-estimate { font-size: 12.1px; }
  /* Increase only the rendered height of the label and arrow by 15%. */
  html body .mobile-action-bar .mobile-action-estimate > span,
  html body .mobile-action-bar .mobile-action-estimate > svg {
    scale: 1 1.15;
    transform-origin: center;
  }
}
@media(max-width:360px) {
  html body .mobile-action-bar .mobile-action-estimate { font-size: 11px; }
}

/* A single gentle handset tilt and return every 6.5 seconds. */
@keyframes renova-mobile-handset-tilt {
  0%, 16%, 100% { transform: rotate(0deg); }
  8% { transform: rotate(-18deg); }
}
@media (prefers-reduced-motion: no-preference) and (max-width:760px),
       (prefers-reduced-motion: no-preference) and (max-width:1100px) and (max-height:500px) and (pointer:coarse) {
  html body .mobile-action-bar .mobile-action-call::before {
    transform-origin: 50% 55%;
    animation: renova-mobile-handset-tilt 6.5s ease-in-out 6.5s infinite;
  }
}

/* Equal mobile actions, with centered content and balanced inner spacing. */
@media(max-width:760px), (max-width:1100px) and (max-height:500px) and (pointer:coarse) {
  html body .mobile-action-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  html body .mobile-action-bar a { min-width: 0; }
  html body .mobile-action-bar .mobile-action-call {
    grid-template-columns: 20.7px max-content;
    justify-content: center;
    padding: 7px 10px;
  }
  html body .mobile-action-bar .mobile-action-estimate {
    justify-content: center;
    gap: 7px;
    padding: 8px;
    line-height: 1.2;
    white-space: nowrap;
  }
  html body .mobile-action-estimate svg { width: 16px; height: 16px; flex: 0 0 16px; }
}
@media(max-width:360px) {
  html body .mobile-action-bar .mobile-action-call { grid-template-columns: 17.25px max-content; column-gap: 6px; padding: 7px 6px; }
  html body .mobile-action-bar .mobile-action-estimate { gap: 5px; padding: 8px 6px; }
  html body .mobile-action-estimate svg { width: 14px; height: 14px; flex-basis: 14px; }
}

/* The estimate arrow moves between handset tilts, then rests. */
@keyframes renova-mobile-estimate-slide {
  0%, 10%, 100% { transform: translateX(0); }
  4%, 6% { transform: translateX(5px); }
}
@media (prefers-reduced-motion: no-preference) and (max-width:760px),
       (prefers-reduced-motion: no-preference) and (max-width:1100px) and (max-height:500px) and (pointer:coarse) {
  html body .mobile-action-bar .mobile-action-estimate svg {
    animation: renova-mobile-estimate-slide 6.5s ease-in-out 3.25s infinite;
  }
}

/* Add 0.1px inward to the 1px phone frame without changing its box or contents. */
@media(max-width:760px), (max-width:1100px) and (max-height:500px) and (pointer:coarse) {
  html body .mobile-action-bar .mobile-action-call { box-shadow: inset 0 0 0 0.1px #b4a387; }
  html body .mobile-action-bar .mobile-action-call:hover { box-shadow: inset 0 0 0 0.1px #66513f; }
}

/* Desktop header refinement, October 29, 2026. Scoped above the existing
   1100px menu breakpoint so phone and tablet navigation retain their styling. */
@media (min-width: 1101px) {
  html body #top.site-header {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr) auto;
    gap: clamp(20px, 2.2vw, 36px);
    border-bottom-color: #c0b5a6 !important;
  }
  html body #top.site-header .desktop-nav {
    justify-self: center;
    align-items: center;
    gap: clamp(16px, 1.5vw, 28px);
    white-space: nowrap;
  }
  html body #top.site-header .desktop-nav a {
    display: inline-flex;
    align-items: center;
    min-height: 46px;
    padding-block: 12px;
    font-size: 12.25px;
    font-weight: 560;
    line-height: 1.5;
    letter-spacing: .065em;
    color: #514437 !important;
  }
  html body #top.site-header .desktop-nav a::after {
    right: 0;
    bottom: 6px;
    height: 1px;
    background: #826b50;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .25s ease;
  }
  html body #top.site-header .desktop-nav a:is(:hover, :focus-visible, [aria-current="page"])::after,
  html body.about-page #top.site-header .desktop-nav a[href="/about/"]::after,
  html body:is(.portfolio-page, .case-page) #top.site-header .desktop-nav a[href="/projects/"]::after,
  html body:is(.expertise-page, .rhythm-page) #top.site-header .desktop-nav a[href="/services/"]::after,
  html body.process-page #top.site-header .desktop-nav a[href="/our-process/"]::after,
  html body:is(.area-page, .city-guide-page) #top.site-header .desktop-nav a[href="/renovation-near-me/"]::after,
  html body.journal-page #top.site-header .desktop-nav a[href="/blog/"]::after,
  html body.contact-page #top.site-header .desktop-nav a[href="/contact/"]::after {
    transform: scaleX(1);
  }
  html body #top.site-header .header-end { gap: 18px; }
  html body #top.site-header .header-phone {
    font-size: 11.5px;
    font-weight: 500;
    letter-spacing: .025em;
  }
  html body #top.site-header .header-cta {
    justify-content: center;
    min-height: 48px;
    padding: 13px 18px;
    gap: 18px;
    font-size: 12px;
    font-weight: 550;
    line-height: 1.5;
    letter-spacing: .025em;
    transition: background-color .25s ease, border-color .25s ease;
  }
  html body #top.site-header .header-cta:hover { border-color: #66513f !important; }
}
@media (min-width: 1101px) and (max-width: 1240px) {
  html body #top.site-header { gap: 18px; padding-inline: 24px; }
  html body #top.site-header .desktop-nav { gap: 16px; }
  html body #top.site-header .header-end { gap: 14px; }
  html body #top.site-header .header-cta { gap: 14px; padding-inline: 16px; }
}
@media (min-width: 1101px) and (prefers-reduced-motion: reduce) {
  html body #top.site-header .desktop-nav a::after,
  html body #top.site-header .header-cta { transition: none; }
}

/* A quiet handset beside the desktop click-to-call number. */
@media (min-width: 1101px) {
  html body #top.site-header .header-phone {
    align-items: center;
    gap: 7px;
  }
  html body #top.site-header .renova-header-call-icon {
    display: block;
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    color: inherit;
  }
}

/* A compact, still phone pill beside the mobile menu. */
@media (max-width: 1100px) {
  html body #top.site-header .header-end { gap: 10px; }
  html body #top.site-header a.header-phone {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 52px;
    width: 52px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 22px;
    gap: 0;
    line-height: 1;
    color: #f1efe9 !important;
    background: transparent;
    isolation: isolate;
    touch-action: manipulation;
  }
  html body #top.site-header .header-phone::before {
    content: "";
    position: absolute;
    inset: 6px 2px;
    z-index: -1;
    pointer-events: none;
    border: 1px solid #66513f;
    border-radius: 999px;
    background: #66513f;
    transform: none;
  }
  html body #top.site-header .renova-header-call-number { display: none; }
  html body #top.site-header .renova-header-call-icon {
    display: block;
    width: 21px;
    height: 21px;
    flex: none;
    stroke-width: 3.2;
    animation: none;
    transform: none;
    pointer-events: none;
  }
}
@media (max-width: 1100px) and (forced-colors: active) {
  html body #top.site-header a.header-phone { color: ButtonText !important; }
  html body #top.site-header .header-phone::before {
    background: ButtonFace;
    border-color: ButtonText;
  }
}

/* A water-drop ripple travels inside the pill, behind the still handset. */
@keyframes renova-mobile-pill-ripple {
  0% { background-size: 0 0; opacity: 0; }
  4.2% { background-size: 8px 8px; opacity: 1; }
  24% { background-size: 92px 92px; opacity: .5; }
  29.4%, 99% { background-size: 104px 104px; opacity: 0; }
  100% { background-size: 0 0; opacity: 0; }
}
@media (max-width: 1100px) and (prefers-reduced-motion: no-preference) and (forced-colors: none) {
  html body #top.site-header .header-phone::after {
    content: "";
    position: absolute;
    inset: 6px 2px;
    border-radius: 999px;
    z-index: -1;
    pointer-events: none;
    background-image: radial-gradient(circle, transparent 34.48%, rgba(241, 239, 233, .798336) 40.24%, rgba(241, 239, 233, .304128) 48.88%, transparent 57.52%);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 0 0;
    opacity: 0;
    animation: renova-mobile-pill-ripple 5s ease-out 5s infinite;
  }
}


/* Source: /logo-tagline-taller-20261029.css */
/* Approved logo option 3: taller lettering within the original inset. */
html body #top.site-header .brand::before { display: none !important; }
html body #top.site-header .brand::after { clip-path: inset(0 0 20% 0); }
html body #top.site-header .brand .brand-tagline {
  position: absolute;
  top: 81.428571%;
  left: 15.15%;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  white-space: nowrap;
  pointer-events: none;
  font-family: RenovaSans, Arial, sans-serif;
  font-size: 7.756906px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: .079558px;
  text-transform: uppercase;
  color: #514437;
}
html body #top.site-header .brand .brand-tagline .separator {
  opacity: .88;
  letter-spacing: 0;
  font-weight: 500;
}
@media(max-width:1100px) {
  html body #top.site-header .brand .brand-tagline { font-size: 7.088950px; letter-spacing: .072707px; }
}
@media(max-width:360px) {
  html body #top.site-header .brand .brand-tagline { font-size: 6.636464px; letter-spacing: .068066px; }
}


/* Solid handset; preserve existing dimensions, color and phone link. */
@media(min-width:1101px){html body #top.site-header .header-phone svg,html body #top.site-header .header-phone svg path{fill:currentColor!important;stroke-width:1.5}}
