/* Refreshed layout using the existing colorscheme.css palette.
   Complete replacement for css/refresh.css; no base palette overrides. */
:root {
 --accent:var(--link-text-color);
 --accent-soft:var(--header-background-color);
 --surface:var(--main-background-color);
 --panel:var(--main-background-color);
 --muted:var(--body-text-color);
 --rule:#cacaca;
}
body {line-height:1.5;letter-spacing:.005em}
h1,h2,h3 {line-height:1.2;letter-spacing:-.025em;font-weight:700 !important;color:var(--body-text-color)}
p {margin-bottom:1rem}a {text-underline-offset:.2em}a:hover {text-decoration:underline}
.border-top,.border {border-color:var(--rule)!important}
.content-heading {text-align:left;padding-top:2.5rem;padding-bottom:1.75rem;margin:0;font-size:clamp(2rem,4vw,2.8rem)}
.content-text,.portfolio-text {line-height:1.4;padding-bottom:.75rem}
.content-heading + .content-text {color:var(--muted);font-size:1.125em}
.site-navbar {border-bottom:1px solid var(--rule);box-shadow:0 3px 15px #00000008;padding:.45rem 0}
#sticky-menu.is-stuck {opacity:1;box-shadow:0 4px 18px #00000018}
#main-menu .nav-link {border-radius:.5rem;font-weight:600;margin:.1rem .2rem;padding-top:.65rem;padding-bottom:.65rem;transition:background-color .15s}
#main-menu .nav-link:hover {background:var(--main-menu-page-hover-background-color);text-decoration:none}
#main-menu li.currentpage > a:hover {background:var(--main-menu-current-page-hover-background-color)}
.site-navbar .navbar-toggler {padding:.35rem .8rem}
.btn {border-radius:.55rem;font-weight:600;padding:.7rem 1.15rem;line-height:1.45;white-space:normal}
.btn-lg {font-size:1rem;padding:.9rem 1.3rem}.btn-sm {font-size:.875rem;padding:.5rem .9rem}
.btn-primary {--bs-btn-bg:var(--link-text-color);--bs-btn-border-color:var(--link-text-color);--bs-btn-color:#fff;--bs-btn-hover-bg:var(--link-hover-focus-text-color);--bs-btn-hover-border-color:var(--link-hover-focus-text-color);--bs-btn-hover-color:#fff;--bs-btn-active-bg:var(--link-hover-focus-text-color);--bs-btn-active-border-color:var(--link-hover-focus-text-color)}
.btn-outline-primary {--bs-btn-color:var(--accent);--bs-btn-border-color:var(--accent);--bs-btn-hover-bg:var(--link-text-color);--bs-btn-hover-border-color:var(--link-text-color);--bs-btn-hover-color:#fff;--bs-btn-active-bg:var(--link-hover-focus-text-color);--bs-btn-active-border-color:var(--link-hover-focus-text-color)}
.btn:hover {text-decoration:none}
.home-hero {background:var(--main-background-color);border-bottom:1px solid var(--rule)}
.home-hero .display-4 {font-size:clamp(2.5rem,4.5vw,4rem);line-height:1.12}
.home-hero h1 span {color:var(--body-text-color)}
.lead {font-size:1.15rem;line-height:1.7;max-width:54ch;color:var(--muted)}
.eyebrow {font-size:.72rem;font-weight:700;letter-spacing:.14em;color:var(--accent);margin-bottom:1rem}
.hero-note {font-size:.875rem;color:var(--muted)}
.card {background:var(--panel);color:var(--body-text-color);border-color:var(--rule);border-radius:1rem;overflow:hidden}
.hero-work {max-width:470px;margin:auto}
.hero-work img {border-radius:0}
.preview-toolbar {display:flex;gap:6px;align-items:center;padding:12px 16px;background:var(--panel);color:var(--muted)}
.preview-toolbar > span:not(:last-child) {width:8px;height:8px;border-radius:50%;background:var(--rule)}
.section-space {padding-top:4rem;padding-bottom:4rem}
.section-title {font-size:clamp(1.8rem,3vw,2.5rem);max-width:24ch;margin-bottom:1rem}
.section-intro {max-width:65ch;color:var(--muted)}
.service-card {border-top:3px solid var(--accent);box-shadow:0 8px 24px #00000006}
.service-card p {color:var(--muted)}
.service-card .card-body {display:flex;flex-direction:column;align-items:flex-start}
.service-card .card-link {margin-top:auto;font-weight:600;color:var(--accent)}
.service-number {color:var(--accent);font-size:.875rem;font-weight:700}
.contact-panel {background:var(--accent-soft);border:1px solid var(--rule);border-radius:1rem;margin:1rem 0 2rem}
.contact-panel p {color:var(--muted)}
.contact-phone {color:var(--accent);font-weight:700;text-align:center;font-size:1.25rem}
.portfolio-card h2 a {color:var(--accent)}
.portfolio-card p {line-height:1.75}
.site-footer {border-top:1px solid var(--rule);color:var(--muted);font-size:.9rem;line-height:1.8}
.site-footer h2 {letter-spacing:0}.site-footer a {color:var(--accent)}
.footer-brand {font-size:1.4rem;font-weight:700;color:var(--body-text-color);letter-spacing:-.025em}
.footer-links li {margin-bottom:.5rem}.footer-phone {font-size:1.25rem;font-weight:700}
#footer-box {text-align:left;font-size:.8rem;font-weight:400;color:var(--muted);padding-bottom:0}
.faq-accordion {--bs-accordion-bg:var(--panel);--bs-accordion-color:var(--body-text-color);--bs-accordion-border-color:var(--rule);--bs-accordion-btn-color:var(--body-text-color);--bs-accordion-active-color:var(--accent);--bs-accordion-active-bg:var(--accent-soft);--bs-accordion-btn-focus-box-shadow:0 0 0 .2rem #00000040;--bs-accordion-border-radius:.75rem;--bs-accordion-inner-border-radius:.75rem;margin:1.5rem 0}
.accordion-button {font-weight:600;line-height:1.5;padding:1.25rem;font-size:1rem;letter-spacing:0}
.accordion-body {line-height:1.8;color:var(--muted)}
#buttons_top,#buttons_bottom {display:flex;flex-wrap:wrap;justify-content:flex-start;gap:.5rem;margin:1rem 0}
.skip-link {position:absolute;left:1rem;top:-100px;z-index:1100;background:var(--panel);color:var(--accent);padding:.75rem;border:2px solid currentColor;border-radius:.5rem}
.skip-link:focus {top:1rem}
#softr-back-to-top-button {width:46px;height:46px;background:var(--panel);color:var(--accent);border-color:var(--rule);box-shadow:0 4px 15px #0002;font-size:1.5rem;opacity:1}
@media(min-width:768px) {.site-navbar {padding:.5rem 0}.home-hero .container {padding-top:4rem!important;padding-bottom:4rem!important}}
@media(min-width:1400px) {body {font-size:18px}}
@media(max-width:767.98px) {.hero-work {transform:none}.section-space {padding-top:2.5rem;padding-bottom:2.5rem}.site-footer {font-size:.9rem}.content-heading {padding-top:2rem}#softr-back-to-top-button {right:16px;bottom:16px}}

/* Undo the optional logo effects from the alternate-palette stylesheets. */
.headerlogo {filter:none;mix-blend-mode:normal}
.btn-primary,.btn-outline-primary {--bs-btn-focus-shadow-rgb:0,0,255}

/* Home-page portfolio update — October 22, 2026. */
#home .hero-work {max-width:100%}

.hero-portfolio-message p:last-child {font-size:.95rem}

@media(min-width:992px) {#home .eyebrow,#about .eyebrow {font-size:.875rem;letter-spacing:.11em}}
@media(min-width:1200px) {#home .eyebrow,#about .eyebrow {font-size:1rem}}
@media(min-width:1400px) {#home .eyebrow,#about .eyebrow {font-size:1.1rem}}
#about .about-portrait {max-width:240px}

/* Simplified home preview and four service categories. */
.hero-portfolio-title {max-width:100%;margin:0 0 .75rem;font-size:1rem;line-height:1.5;font-weight:600}
.hero-portfolio-label {display:block;margin-bottom:.15rem;font-size:.85em;font-weight:400}
#home-portfolio-name {display:block;font-weight:600}
#home .hero-work {border-radius:1.25rem;overflow:hidden}
#home-portfolio-carousel .carousel-inner {border-radius:inherit}
.service-card-heading {display:flex;gap:1rem;align-items:center;justify-content:space-between;width:100%}
.service-icon {display:inline-flex;align-items:center;justify-content:center;width:3rem;height:3rem;flex-shrink:0;color:var(--accent)}
.service-icon svg {display:block;width:2.75rem;height:2.75rem}
.service-section-heading {display:flex;gap:1rem;align-items:center}
.service-jump-links {display:flex;flex-wrap:wrap;gap:.75rem;margin:1rem 0 2.5rem}
.service-section {scroll-margin-top:6.5rem}
.service-description {max-width:none;width:100%}
.service-description li {margin-bottom:.6rem;line-height:1.6}
.service-examples {border-top:1px solid var(--rule);padding-top:1.5rem}
.service-examples summary {font-size:1.1rem;font-weight:600;cursor:pointer;color:var(--accent);padding:.5rem 0}
.service-examples summary:focus-visible {outline:2px solid currentColor;outline-offset:4px}
.service-examples .solutions-text {line-height:1.45}
@media(min-width:992px) {.hero-portfolio-title {font-size:1.1rem}}
@media(max-width:767.98px) {.service-section-heading {align-items:flex-start}.service-section {scroll-margin-top:5.5rem}.service-section-heading h2 {font-size:1.5rem}}

/* Light-only site, complete screenshot previews, and compact navigation. */
#home .hero-work .carousel-item img {object-fit:contain;object-position:center top;background:var(--panel)}
.site-navbar {padding:0;min-height:44px}
#main-menu .nav-link {font-size:1rem;line-height:1.25;padding:.5625rem .875rem;margin:.125rem .2rem}
.site-navbar .navbar-toggler {min-height:44px;padding:.25rem .8rem;font-size:1rem;line-height:1.25}
@media(min-width:768px) {.site-navbar {padding:0;min-height:44px}}

/* All home preview images retain the 970 x 832 design ratio. */
#home .hero-work .carousel-inner {aspect-ratio:970 / 832}
#home .hero-work .carousel-item img {
 display:block;
 width:100%;
 height:auto;
 aspect-ratio:970 / 832;
 object-fit:contain;
 object-position:center;
 background:var(--panel);
}

/* Option 1: single-chevron scroll-to-top button. */
#softr-back-to-top-button {padding:0;line-height:1}
#softr-back-to-top-button:not([hidden]) {display:grid;place-items:center}
#softr-back-to-top-button svg {display:block;width:24px;height:24px}

/* Keep each headline phrase on one line; size relative to its actual column. */
.hero-copy {container-type:inline-size}
.home-hero .hero-copy .display-4 {font-size:clamp(1rem,3vw,3.5rem);font-size:clamp(1rem,7.4cqw,4rem)}
.hero-headline-line {display:block;white-space:nowrap}
/* Reduce the active highlight by 6px without changing the navigation's height. */
@media(min-width:768px) {
 #main-menu .nav-link {padding-top:.375rem;padding-bottom:.375rem;margin-top:.3125rem;margin-bottom:.3125rem}
}

/* Equal-height navigation states with a distinct, softer hover treatment. */
#main-menu .navbar-nav .nav-link:hover,
#main-menu .navbar-nav .nav-link:focus-visible {background:#e5e5ff;color:#17175e;text-decoration:none}
#main-menu .navbar-nav li.currentpage > .nav-link {background:var(--main-menu-current-page-background-color);color:var(--main-menu-current-page-text-color)}
#main-menu .navbar-nav li.currentpage > .nav-link:hover,
#main-menu .navbar-nav li.currentpage > .nav-link:focus-visible {background:#0000cc;color:#fff}

/* Services examples use Bootstrap Collapse with a 0.75-second slide. */
.service-examples-toggle {display:flex;align-items:center;gap:.75rem;width:100%;padding:.5rem 0;border:0;background:transparent;color:var(--accent);font:inherit;font-size:1.1rem;font-weight:600;text-align:left;cursor:pointer}
.service-examples-toggle::before {content:'';display:block;width:.55rem;height:.55rem;flex-shrink:0;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);transition:transform .2s ease}
.service-examples-toggle[aria-expanded="true"]::before {transform:rotate(45deg)}
.service-examples-toggle:focus-visible {outline:2px solid currentColor;outline-offset:4px}
.service-examples > .collapsing {transition:height .75s ease}
@media(prefers-reduced-motion:reduce) {.service-examples > .collapsing,.service-examples-toggle::before {transition:none!important}}

/* Avoid a negative row gutter pulling the divider toward the service cards. */
#home .home-experience {margin-top:0}
@media(max-width:991.98px) {#home .home-experience > div + div {margin-top:2rem}}

/* Mobile menu option 1: clean white dropdown with a soft active-page marker. */
@media(max-width:767.98px) {
 .site-navbar .navbar-toggler {display:flex;align-items:center;gap:.5rem;width:100%;text-align:left}
 .site-navbar .navbar-toggler:focus {box-shadow:none}
 .site-navbar .navbar-toggler:focus-visible {outline:2px solid #17175e;outline-offset:-4px}
 .mobile-menu-close {margin-left:auto;font-size:1.5rem;line-height:1;visibility:hidden}
 .navbar-toggler[aria-expanded="true"] .mobile-menu-close {visibility:visible}
 #main-menu {background:#fff;border-top:1px solid #dedeee;border-bottom:1px solid #dedeee}
 #main-menu .navbar-nav {width:100%;padding:.625rem .75rem}
 #main-menu .navbar-nav .nav-link {min-height:44px;margin:2px 0;padding:10px 16px;font-size:1rem;line-height:1.5;font-weight:400;color:#17175e;border-radius:.375rem}
 #main-menu .navbar-nav .nav-link:hover {background:#d6e6ff;color:#102d64;outline:none;box-shadow:inset 0 0 0 1px #9bbcf0}
 #main-menu .navbar-nav .nav-link:focus-visible {outline:2px solid #0000ff;outline-offset:-2px;background:#d6e6ff;color:#102d64}
 #main-menu .navbar-nav li.currentpage > .nav-link,
 #main-menu .navbar-nav li.currentpage > .nav-link:hover,
 #main-menu .navbar-nav li.currentpage > .nav-link:focus-visible {background:#e5e5ff;color:#0000ff;font-weight:600;box-shadow:inset 3px 0 0 #0000ff}
}
