:root {
     --heuer-blue: #0757c8;
     --heuer-blue-dark: #053b89;
     --heuer-blue-soft: #eaf2ff;
     --heuer-ink: #152033;
     --heuer-muted: #637083;
     --heuer-border: #dbe3ed;
     --heuer-bg: #f5f8fc;
     --heuer-white: #ffffff;
     --container: 1180px;
     --shadow: 0 18px 50px rgba(23, 52, 96, .12);
     --radius: 18px;
}
 *, *::before, *::after {
     box-sizing: border-box;
}
 html {
     scroll-behavior: smooth;
}
 body {
     margin: 0;
     color: var(--heuer-ink);
     background: var(--heuer-white);
     font-family: Arial, Helvetica, sans-serif;
     line-height: 1.6;
}
 a {
     color: var(--heuer-blue);
     text-decoration-thickness: .08em;
     text-underline-offset: .18em;
     text-transform: uppercase;
     font-weight: bold;
}
 a:hover {
     color: var(--heuer-blue-dark);
}

 a:focus-visible,
 button:focus-visible {
     outline: 3px solid var(--heuer-blue);
     outline-offset: 3px;
}
 img {
     display: block;
     max-width: 100%;
     height: auto;
}
 .container {
     width: min(calc(100% - 40px), var(--container));
     margin-inline: auto;
}
 .skip-link {
     position: fixed;
     top: 10px;
     left: 10px;
     z-index: 9999;
     padding: .7rem 1rem;
     background: #000;
     color: #fff;
     transform: translateY(-150%);
}
 .skip-link:focus {
     transform: translateY(0);
}
 .service-bar {
     background: var(--heuer-blue-dark);
     color: #fff;
     font-size: .9rem;
}
 .service-bar a {
     color: #fff;
     text-decoration: none;
}
 .service-bar__inner {
     min-height: 42px;
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 24px;
}
 .service-hours, .service-links {
     display: flex;
     align-items: center;
     gap: 18px;
}
 .service-hours strong {
     letter-spacing: .03em;
}
.header-bar{
    padding: 6px 0 8px;
    background: linear-gradient(120deg, var(--heuer-blue-soft), #fff);
    border-bottom: 1px solid var(--heuer-border);
}

.header-bar .container_content{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 16px;
}

.header-bar .container_content > * {
    min-width: 0;
}

p.page_title {
     margin: 0;
     font-size: clamp(1rem, 4.5vw, 2.2rem);
     line-height: 1.4;
}

.header-bar .container_content .container_right{
    margin-left: auto;
}

 .site-header {
     position: sticky;
     top: 0;
     z-index: 1000;
     background: rgba(255,255,255,.97);
     border-bottom: 1px solid rgba(219,227,237,.8);
     -webkit-backdrop-filter: blur(10px);
     backdrop-filter: blur(10px);
}
 .header-main {
     min-height: 1px;
     display: flex;
     align-items: center;
     gap: 36px;
}
 .brand {
     display: inline-flex;
     flex: 0 0 auto;
}
 .brand__logo {
     width: 255px;
     max-height: 85px;
     object-fit: contain;
     margin: 10px;
}
 .main-navigation {
     margin-left: auto;
}
 .menu, .submenu, .footer-links, .breadcrumb ol {
     list-style: none;
     margin: 0;
     padding: 0;
}
 .menu {
     display: flex;
     align-items: center;
     gap: 5px;
}
 .menu__item {
     position: relative;
     display: flex;
     align-items: center;
}
 .menu__link {
     display: block;
     padding: .8rem .85rem;
     border-radius: 10px;
     color: var(--heuer-ink);
     text-decoration: none;
     font-weight: 700;
     font-size: .94rem;
}
 .menu__item:is(.is-active,.is-current) > .menu__link, .menu__link:hover {
     color: var(--heuer-blue);
     background: var(--heuer-blue-soft);
}
 .submenu-toggle {
     display: none;
}
 .submenu {
     position: absolute;
     left: 0;
     top: calc(100% + 8px);
     min-width: 240px;
     padding: 10px;
     background: #fff;
     border: 1px solid var(--heuer-border);
     border-radius: 14px;
     box-shadow: var(--shadow);
     opacity: 0;
     visibility: hidden;
     transform: translateY(8px);
     transition:
         opacity .18s ease,
         transform .18s ease,
         visibility .18s ease;
}
 .menu__item:hover > .submenu, .menu__item:focus-within > .submenu {
     opacity: 1;
     visibility: visible;
     transform: translateY(0);
}
 .submenu__item {
     position: relative;
}
 .submenu__link {
     display: block;
     padding: .62rem .72rem;
     border-radius: 8px;
     color: var(--heuer-ink);
     text-decoration: none;
     font-size: .94rem;
}
 .submenu__link:hover, .submenu__item.is-current > .submenu__link {
     color: var(--heuer-blue);
     background: var(--heuer-blue-soft);
}
 .submenu--nested {
     top: 0;
     left: calc(100% + 8px);
}
 .submenu__item:hover > .submenu--nested, .submenu__item:focus-within > .submenu--nested {
     opacity: 1;
     visibility: visible;
     transform: translateY(0);
}
 .nav-toggle {
     display: none;
}
 .home-hero {
     position: relative;
     overflow: hidden;
     padding: 78px 0 84px;
     background: linear-gradient(130deg, #eef5ff 0%, #fff 54%, #e7f0ff 100%);
}
 .home-hero::before {
     content: '';
     position: absolute;
     width: 520px;
     height: 520px;
     right: -180px;
     top: -220px;
     border: 70px solid rgba(7,87,200,.08);
     border-radius: 50%;
     pointer-events: none;
}
 .home-hero__grid {
     position: relative;
     display: grid;
     grid-template-columns: minmax(0, 1.5fr) minmax(280px, .65fr);
     gap: 64px;
     align-items: center;
}
 .home-hero__content h1 {
     max-width: 900px;
     margin: .1em 0 .35em;
     font-size: clamp(2.4rem, 5vw, 4.65rem);
     line-height: 1.02;
     letter-spacing: -.035em;
}
 .home-hero__content .lead {
     max-width: 760px;
     font-size: 1.17rem;
     color: var(--heuer-muted);
}
 h1 {
    margin: 0 0 .7rem;
    color: var(--heuer-bg);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .1em;
    font-size: clamp(.75rem, 2.2vw, 4.9rem);
}
 .button-row {
     display: flex;
     flex-wrap: wrap;
     gap: 12px;
     margin-top: 28px;
}
 .button {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     min-height: 46px;
     padding: .72rem 1.15rem;
     border-radius: 11px;
     font-weight: 800;
     text-decoration: none;
}
 .button--primary {
     background: var(--heuer-blue);
     color: #fff;
}
 .button--primary:hover {
     background: var(--heuer-blue-dark);
     color: #fff;
}
 .button--ghost {
     border: 1px solid #a9bdd9;
     background: rgba(255,255,255,.7);
     color: var(--heuer-blue-dark);
}
 .home-hero__card {
     padding: 28px;
     background: #fff;
     border: 1px solid var(--heuer-border);
     border-radius: var(--radius);
     box-shadow: var(--shadow);
}
 .home-hero__card h2 {
     margin: .4rem 0 1rem;
     font-size: 1.55rem;
}
 .home-hero__badge {
     display: inline-block;
     padding: .35rem .55rem;
     background: var(--heuer-blue);
     color: #fff;
     font-weight: 900;
     letter-spacing: .1em;
     border-radius: 7px;
     font-size: .72rem;
}
 .text-link {
     font-weight: 800;
}

 .breadcrumb-wrap {
     padding-top: 18px;
}
 .breadcrumb ol {
     display: flex;
     flex-wrap: wrap;
     gap: .45rem;
     font-size: .88rem;
     color: var(--heuer-muted);
}
 .breadcrumb li:not(:last-child)::after {
     content: '/';
     margin-left: .45rem;
     color: #9ba9bb;
}
 .breadcrumb a {
     color: inherit;
     text-decoration: none;
}
 .content-section {
     padding: 5px 0 7px;
}
 .content-section--home {
     padding-top: 72px;
}
 .prose > *:first-child {
     margin-top: 0;
}
 .prose h1, .prose h2, .prose h3 {
     line-height: 1.15;
     letter-spacing: -.015em;
}
 .prose h2 {
     font-size: clamp(1.55rem, 3vw, 1.7rem);
     margin-top: .5em;
}
 .prose h3 {
     font-size: 1.35rem;
     margin-top: 0.55em;
}
 .prose p, .prose li {
     color: #344054;
}
 .prose .frame {
     margin-bottom: 0.5rem;
}
 .prose figure {
     margin-inline: 0;
}
 .prose img {
     border-radius: 14px;
}
 .teaser-section {
     padding: 64px 0;
     background: var(--heuer-bg);
     border-block: 1px solid var(--heuer-border);
}
 .department-section {
     padding: 72px 0 88px;
}
 .section-heading {
     margin-bottom: 30px;
}
 .section-heading h2 {
     margin: 0;
     font-size: clamp(2rem, 4vw, 3rem);
}
 .department-grid {
     display: grid;
     grid-template-columns: repeat(4, minmax(0, 1fr));
     gap: 16px;
}
 .department-grid article {
     padding: 24px;
     border: 1px solid var(--heuer-border);
     border-radius: 16px;
     background: #fff;
     transition: transform .2s ease, box-shadow .2s ease;
}
 .department-grid article:hover {
     transform: translateY(-4px);
     box-shadow: var(--shadow);
}
 .department-grid article > span {
     color: var(--heuer-blue);
     font-size: .78rem;
     font-weight: 900;
     letter-spacing: .08em;
}
 .department-grid h3 {
     margin: .4rem 0 .6rem;
     font-size: 1.18rem;
}
 .department-grid p {
     margin: 0;
     color: var(--heuer-muted);
     font-size: .94rem;
}
 .site-footer {
     background: #0d1b2f;
     color: #d8e0eb;
}
 .footer-grid {
     display: grid;
     grid-template-columns: 1.2fr 1fr 1fr .75fr;
     gap: 46px;
     padding: 62px 0 52px;
}
 .footer-grid h2 {
     margin-top: 0;
     color: #fff;
     font-size: 1rem;
     text-transform: uppercase;
     letter-spacing: .08em;
}
 .footer-grid a {
     color: #fff;
}
 .footer-brand {
     display: inline-block;
     margin-bottom: 16px;
     padding: 12px;
     background: #fff;
     border-radius: 10px;
}
 .footer-brand__logo {
     width: 210px;
     display: block;
}
 .footer-links li + li {
     margin-top: .45rem;
}
 .footer-bottom {
     border-top: 1px solid rgba(255,255,255,.12);
     padding: 18px 0;
     color: #a8b4c5;
     font-size: .86rem;
}
@media (max-width: 1250px) {
    .header-bar h1 {
        font-size: clamp(1rem, 4.5vw, 1.5rem);
    }

    .header-main {
        gap: 20px;
    }

    .brand__logo {
        width: 220px;
    }

    .menu {
        gap: 2px;
    }

    .menu__link {
        padding-inline: .58rem;
        font-size: .85rem;
    }

    .submenu__link {
        font-size: .9rem;
    }
}

@media (max-width: 1050px) {
    .header-bar h1 {
        font-size: clamp(1rem, 4.5vw, 1.3rem);
    }

    .header-main {
        gap: 15px;
    }

    .menu__link {
        padding-inline: .58rem;
        font-size: .8rem;
    }
}

 @media (max-width: 980px) {
    
     .service-hours span:last-child {
         display: none;
    }

    .site-header {
        position: relative;
    }

     .header-main {
         min-height: 4px;
    }
     .brand__logo {
         width: 220px;
    }
     .nav-toggle {
         margin-left: auto;
         display: inline-flex;
         cursor: pointer;
         align-items: center;
         gap: 10px;
         border: 1px solid var(--heuer-border);
         background: #fff;
         border-radius: 10px;
         padding: .65rem .8rem;
         font-weight: 800;
    }
     .nav-toggle__icon {
         display: grid;
         gap: 4px;
    }
     .nav-toggle__icon i {
         display: block;
         width: 20px;
         height: 2px;
         background: currentColor;
    }
     .main-navigation {
         display: none;
         position: absolute;
         left: 0;
         right: 0;
         top: 100%;
         padding: 16px 20px 24px;
         background: #fff;
         border-bottom: 1px solid var(--heuer-border);
         box-shadow: 0 12px 30px rgba(25,43,72,.12);
    }
     .main-navigation.is-open {
         display: block;
         max-height: calc(100dvh - 150px);
         overflow-y: auto;
         overscroll-behavior: contain;
    }
     .menu {
         width: min(100%, var(--container));
         margin: auto;
         display: block;
    }
     .menu__item {
         display: grid;
         grid-template-columns: 1fr auto;
         border-bottom: 1px solid var(--heuer-border);
    }
     .menu__link {
         padding: .85rem .5rem;
    }
     .submenu-toggle {
         display: block;
         align-self: center;
         width: 36px;
         height: 36px;
         border: 0;
         background: var(--heuer-blue-soft);
         color: var(--heuer-blue);
         border-radius: 8px;
         font-size: 1.2rem;
         cursor: pointer;
    }
     .submenu {
         position: static;
         grid-column: 1 / -1;
         display: none;
         opacity: 1;
         visibility: visible;
         transform: none;
         box-shadow: none;
         border: 0;
         padding: 0 0 .8rem 1rem;
    }
     .menu__item.is-submenu-open > .submenu {
         display: block;
    }
     .submenu--nested {
         display: block;
         padding-left: 1rem;
    }
     .home-hero__grid {
         grid-template-columns: 1fr;
         gap: 32px;
    }
     .home-hero__card {
         max-width: 520px;
    }
     .department-grid {
         grid-template-columns: repeat(2, minmax(0, 1fr));
    }
     .footer-grid {
         grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
 @media (max-width: 620px) {

     .header-bar .container_content {
         flex-wrap: wrap;
     }

     .header-bar .container_content .container_right {
         margin-left: auto;
     }

     .container {
         width: min(calc(100% - 28px), var(--container));
    }
     .service-bar__inner {
         min-height: 38px;
    }
     .service-hours span {
         display: none;
    }
     .service-links {
         width: 100%;
         justify-content: flex-end;
         gap: 12px;
    }
     .service-hours strong {
         white-space: nowrap;
    }
     .brand__logo {
         width: 184px;
    }
     .nav-toggle__label {
         display: none;
    }
     .home-hero {
         padding: 52px 0 58px;
    }
     .home-hero__content h1 {
         font-size: clamp(2.2rem, 11vw, 3.4rem);
    }
     .department-grid, .footer-grid {
         grid-template-columns: 1fr;
    }
     .footer-grid {
         gap: 28px;
    }
}
 @media (prefers-reduced-motion: reduce) {
     *, *::before, *::after {
         scroll-behavior: auto !important;
         animation: none !important;
         transition: none !important;
    }
}
