/* NGB — overrides for the Elementor header (#45) and footer (#34) templates.

   These restyle markup that Elementor generates, so they are kept apart from
   home-blocks.css, which styles our own shortcode sections. Everything here is
   keyed to template element ids and uses !important, because Elementor writes
   per-widget rules four classes deep that nothing reasonable outranks.

   If a template is rebuilt in Elementor, the ids change, these rules stop
   matching, and the theme's own styling takes over — nothing breaks, it just
   goes back to looking default. */

/* ---------- Header restyle (Elementor template #45) ----------
   Same approach as the footer: styling only, keyed to the template's element ids,
   !important because Elementor's generated per-widget rules are four classes deep.
   Menu contents stay in Appearance → Menus. */
/* Kontakt: a button in the template, a plain nav link in the redesign */
.elementor-45 .elementor-element.elementor-element-42479e90 .elementor-button {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    color: #fff !important;
    fill: #fff !important;
    box-shadow: none !important;
    transition: color 0.18s ease;
}
.elementor-45 .elementor-element.elementor-element-42479e90 .elementor-button:hover,
.elementor-45 .elementor-element.elementor-element-42479e90:hover a { color: #ECB62E !important; }

/* top-level items */
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--main .elementor-item {
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
}
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--main .elementor-item:hover,
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--main .elementor-item.elementor-item-active { color: #ECB62E !important; }
/* the pointer underline in brand gold, 2px */
.elementor-45 .elementor-element.elementor-element-47c2730a .e--pointer-underline .elementor-item:after,
.elementor-45 .elementor-element.elementor-element-47c2730a .e--pointer-underline .elementor-item:before {
    background-color: #ECB62E !important;
    height: 2px !important;
}

/* dropdown panel: white with a gold top edge, not the gold block it is now */
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--dropdown {
    min-width: 260px;
    padding: 8px 0 !important;
    background-color: #fff !important;
    border-top: 3px solid #ECB62E !important;
    box-shadow: 0 18px 40px rgba(0, 23, 48, 0.28);
}
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--dropdown .elementor-item,
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--dropdown .elementor-sub-item {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 11px 18px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em;
    text-transform: none !important;
    color: #002145 !important;
    fill: #002145 !important;
    background-color: transparent !important;
}
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--dropdown a:hover,
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--dropdown a:focus,
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--dropdown a.elementor-item-active {
    background-color: #F4F6F9 !important;
    color: #ECB62E !important;
    fill: #ECB62E !important;
}
/* chevron on the entries that open a flyout */
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--dropdown .menu-item-has-children > a::after {
    content: "";
    flex: 0 0 auto;
    width: 6px;
    height: 6px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(-45deg);
    opacity: 0.75;
}
/* Elementor's own caret inside dropdown rows would double up with ours */
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--dropdown .sub-arrow { display: none !important; }

/* the panel sits closer to the nav item, and an invisible bridge spans whatever
   gap is left — without it the pointer crosses navy on the way down and the menu
   flickers shut */
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--main > .elementor-nav-menu > .menu-item-has-children > .sub-menu {
    margin-top: -10px !important;
}
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--main > .elementor-nav-menu > .menu-item-has-children > .sub-menu::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -16px;
    height: 16px;
}

/* the flyout's top edge lines up with the top of the panel it comes out of:
   8px of panel padding + its 3px gold border */
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--dropdown .menu-item-has-children > .sub-menu {
    margin-top: -11px !important;
}

/* second level opens to the right, with its own scroll when a category is long */
.elementor-45 .elementor-element.elementor-element-47c2730a .elementor-nav-menu--dropdown .sub-menu {
    max-height: 72vh;
    overflow-y: auto;
}

/* open with a short fade and rise, as in the design */
.elementor-45 .elementor-element.elementor-element-47c2730a .menu-item-has-children:hover > .sub-menu {
    animation: ngb-drop 0.22s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}
@keyframes ngb-drop {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
    .elementor-45 .elementor-element.elementor-element-47c2730a .menu-item-has-children:hover > .sub-menu { animation: none; }
}

/* ---------- Footer restyle (Elementor template #34) ----------
   Styling only — content and links stay editable in Elementor.

   !important throughout is deliberate: Elementor writes per-widget rules like
   `.elementor-34 .elementor-element.elementor-element-X:not(...)`, four classes
   deep, which outranks anything reasonable we can write by hand. These overrides
   are keyed to that template's element ids, so if the footer is rebuilt they stop
   matching and the theme's own styling takes over. */
.elementor-34 .elementor-element.elementor-element-2ca0b08d {
    background-color: #001730 !important;
}
/* brand column wider than the three list columns */
.elementor-34 .elementor-element.elementor-element-7a2b10aa > .e-con-inner,
.elementor-34 .elementor-element.elementor-element-7a2b10aa {
    display: grid !important;
    grid-template-columns: minmax(260px, 1.4fr) repeat(3, minmax(180px, 1fr)) !important;
    gap: 48px 40px !important;
    align-items: start !important;
}
.elementor-34 .elementor-element.elementor-element-35db4f7,
.elementor-34 .elementor-element.elementor-element-1f998cdb,
.elementor-34 .elementor-element.elementor-element-6dde66a2,
.elementor-34 .elementor-element.elementor-element-125e357e {
    width: auto !important;
    max-width: none !important;
}

.elementor-34 .elementor-element.elementor-element-4d3d286b { width: 96px !important; }
.elementor-34 .elementor-element.elementor-element-c91c64e img {
    width: 96px !important;
    height: 96px !important;
}
.elementor-34 .elementor-element.elementor-element-76a46e8 {
    margin-top: 22px !important;
    max-width: 34ch !important;
}
.elementor-34 .elementor-element.elementor-element-76a46e8,
.elementor-34 .elementor-element.elementor-element-76a46e8 p {
    font-size: 15px !important;
    line-height: 1.7 !important;
    color: rgba(255, 255, 255, 0.75) !important;
}
/* the brand column's three items all start at the same left edge */
.elementor-34 .elementor-element.elementor-element-35db4f7 > .elementor-widget,
.elementor-34 .elementor-element.elementor-element-35db4f7 > .e-con {
    align-self: flex-start !important;
    margin-left: 0 !important;
    text-align: left !important;
}
.elementor-34 .elementor-element.elementor-element-2bf2794 {
    width: auto !important;
}
.elementor-34 .elementor-element.elementor-element-2bf2794 img {
    width: 260px !important;
    max-width: 100% !important;
    margin: 24px 0 0 !important;
    opacity: 0.9;
}

/* gold column labels */
.elementor-34 .ngb-f-title .elementor-heading-title {
    margin: 0 0 20px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    color: #ECB62E !important;
}
/* link lists */
.elementor-34 .elementor-element.elementor-element-1f998cdb,
.elementor-34 .elementor-element.elementor-element-6dde66a2 {
    gap: 12px !important;
}
.elementor-34 .elementor-element.elementor-element-1f998cdb .elementor-widget:not(.ngb-f-title) .elementor-heading-title,
.elementor-34 .elementor-element.elementor-element-6dde66a2 .elementor-widget:not(.ngb-f-title) .elementor-heading-title {
    margin: 0 !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    color: rgba(255, 255, 255, 0.85) !important;
}
.elementor-34 .elementor-element.elementor-element-1f998cdb a:hover .elementor-heading-title,
.elementor-34 .elementor-element.elementor-element-6dde66a2 a:hover .elementor-heading-title { color: #ECB62E !important; }

/* social buttons: small squares in a wrapping row */
.elementor-34 .elementor-element.elementor-element-215fe86e .elementor-social-icons-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    justify-content: flex-start !important;
    max-width: 200px;
}
.elementor-34 .elementor-element.elementor-element-215fe86e .elementor-grid-item { margin: 0 !important; }
.elementor-34 .elementor-element.elementor-element-215fe86e .elementor-social-icon {
    width: 38px !important;
    height: 38px !important;
    padding: 0 !important;
    border-radius: 2px !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: #fff !important;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}
.elementor-34 .elementor-element.elementor-element-215fe86e .elementor-social-icon:hover {
    background: #ECB62E !important;
    border-color: #ECB62E;
    color: #002145 !important;
}
.elementor-34 .elementor-element.elementor-element-215fe86e .elementor-social-icon svg {
    width: 17px !important;
    height: 17px !important;
    fill: currentColor;
}

/* bottom bar */
.elementor-34 .elementor-element.elementor-element-f0a00010 > .e-con-inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px !important;
    padding: 20px 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
}
.elementor-34 .elementor-element.elementor-element-f0a00010 .elementor-widget { width: auto !important; }
.elementor-34 .elementor-element.elementor-element-f0a00010 .elementor-heading-title {
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: rgba(255, 255, 255, 0.55) !important;
}

@media (max-width: 1000px) {
    .elementor-34 .elementor-element.elementor-element-7a2b10aa > .e-con-inner,
    .elementor-34 .elementor-element.elementor-element-7a2b10aa {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 560px) {
    .elementor-34 .elementor-element.elementor-element-7a2b10aa > .e-con-inner,
    .elementor-34 .elementor-element.elementor-element-7a2b10aa {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    .elementor-34 .elementor-element.elementor-element-f0a00010 > .e-con-inner { align-items: flex-start !important; }
}