/* v7: horizontal feather shares the bitmap bounds; bottom is solid before bitmap ends. */
/* Navigation only. Logo, hero illustration and their layout are unchanged. */
/* Restore the soft dark halo around the transparent shield, without resizing it. */
.topnav .container-nav-centre img {
    filter: drop-shadow(0 4px 5px rgba(0,0,0,.85))
            drop-shadow(0 0 15px rgba(0,0,0,.7));
}
/* Georgia / light graphite. Upper menu is 1px smaller than the lower menu. */
/* Fresh layout using the untouched original (2089 x 753).
   Gate centre ~1131px; rendered gate offset = 1939*(1131/2089 - .5) = 80px.
   Native aspect ratio is retained. Equal viewport fades use page colour only. */
body {
    background-color: #232228;
    background-image:
        radial-gradient(ellipse 650px 350px at left 559px,
            #232228 0%, rgba(35,34,40,.86) 20%,
            rgba(35,34,40,.52) 45%, rgba(35,34,40,.17) 72%,
            rgba(35,34,40,0) 100%),
        radial-gradient(ellipse 720px 390px at right 599px,
            rgba(35,34,40,.70) 0%, rgba(35,34,40,.62) 16%,
            rgba(35,34,40,.46) 34%, rgba(35,34,40,.27) 54%,
            rgba(35,34,40,.11) 74%, rgba(35,34,40,.025) 90%,
            rgba(35,34,40,0) 100%),
        linear-gradient(90deg,
            #232228 0%, rgba(35,34,40,.99) 3%,
            rgba(35,34,40,.95) 6%, rgba(35,34,40,.86) 10%,
            rgba(35,34,40,.70) 14%, rgba(35,34,40,.48) 18%,
            rgba(35,34,40,.25) 22%, rgba(35,34,40,.08) 27%,
            rgba(35,34,40,0) 31%, rgba(35,34,40,0) 64%,
            rgba(35,34,40,.008) 68%, rgba(35,34,40,.025) 72%,
            rgba(35,34,40,.055) 76%, rgba(35,34,40,.10) 80%,
            rgba(35,34,40,.17) 84%, rgba(35,34,40,.27) 88%,
            rgba(35,34,40,.40) 91%, rgba(35,34,40,.56) 94%,
            rgba(35,34,40,.74) 96.5%, rgba(35,34,40,.90) 98.5%,
            #232228 100%),
        linear-gradient(to bottom,
            rgba(35,34,40,0) 0px, rgba(35,34,40,0) 399px,
            rgba(35,34,40,.03) 429px, rgba(35,34,40,.10) 459px,
            rgba(35,34,40,.25) 494px, rgba(35,34,40,.50) 525px,
            rgba(35,34,40,.76) 548px, rgba(35,34,40,.94) 567px,
            #232228 580px),
        url(../images/zs-brama-oryginal.png);
    background-position: center top, center top, calc(50% - 85.5px) top, center top, calc(50% - 85.5px) -48px;
    background-size: 100% 650px, 100% 650px, 1745px 650px, 100% 650px, 1745px auto;
    background-repeat: no-repeat;
}
.topnav .container-nav-left li > i.fa-home { color: #ccc6b9; }
.topnav .container-nav-left a.nav-active {
    color: #ccc6b9;
    animation: zs-client-here-glow 6s ease-in-out infinite;
}
.topnav .container-nav-left a.nav-active:hover,
.topnav .container-nav-left a.nav-active:focus-visible {
    animation: none;
    color: #e7dcc5;
    text-shadow: 0 0 7px rgba(208,188,143,.28);
}
@keyframes zs-client-here-glow {
    0%, 55%, 100% { color: #ccc6b9; text-shadow: none; }
    72% { color: #eee5d3; text-shadow: 0 0 8px rgba(208,188,143,.4); }
    86% { color: #d5c7aa; text-shadow: 0 0 4px rgba(208,188,143,.18); }
}
@media (prefers-reduced-motion: reduce) {
    .topnav .container-nav-left a.nav-active { animation: none; }
}
.topnav .container-nav-left { color: #a49d93; }
.topnav .container-nav-left i.fa { color: #968261; }
.topnav .container-nav-left a { color: #baa57d; }
.topnav .container-nav-right a { color: #bcb6ad; text-shadow: 0 1px 2px rgba(0,0,0,.6); transition: color .18s; }
.topnav .container-nav-right a i.fa,.topnav .container-nav-right a svg { color: #968261; fill: currentColor; }
.topnav .container-nav-right a i.fa { width: 15px; text-align: center; margin-right: 3px; }
.topnav .container-nav-right a:hover,.topnav .container-nav-right a:focus-visible { color: #d0c2a6; }
.header--nav .header-nav--primary > li > a {
    position: relative; color: #bcb6ad; font-family: Georgia,"Times New Roman",serif;
    font-size: 13px; font-weight: 400; letter-spacing: .3px;
    text-shadow: 0 1px 2px rgba(0,0,0,.5); transition: color .18s,background-color .18s;
}
.header--nav .header-nav--primary > li > a > i.fa { width: 16px; margin-right: 5px; text-align: center; color: #968261; font-size: 13px; }
.header--nav .header-nav--primary > li > a::after {
    content: ''; position: absolute; left: 14px; right: 14px; bottom: 0; height: 2px;
    background: #968261; opacity: 0; transition: opacity .18s;
}
.header--nav .header-nav--primary > li > a:hover,
.header--nav .header-nav--primary > li > a:focus-visible,
.header--nav .header-nav--primary > li > a[aria-current="page"] { color: #d0c2a6; background-color: rgba(189,152,82,.035); }
.header--nav .header-nav--primary > li > a:hover::after,
.header--nav .header-nav--primary > li > a:focus-visible::after,
.header--nav .header-nav--primary > li > a[aria-current="page"]::after { opacity: 1; }
.header--nav .header-nav--primary > li > a:focus-visible { outline: 1px solid #968261; outline-offset: -2px; }
.header--nav .play-button,.header--nav .play-button:hover { position: relative; background: none; }
.header--nav .play-button .zs-download-label {
    position: absolute; top: 20px; bottom: 20px; left: 12px; right: 12px;
    display: flex; justify-content: center; align-items: center; gap: 8px;
    background: linear-gradient(#424b35,#303828); border: 1px solid #626e4e; border-radius: 3px;
    color: #c5c9b7; font: 500 12px/20px Arial,sans-serif; text-transform: uppercase;
    text-shadow: 0 1px 1px rgba(0,0,0,.4); transition: filter .18s;
}
.header--nav .play-button .zs-download-label i { color: #b3bba0; }
.header--nav a:hover .zs-download-label,.header--nav a:focus-visible .zs-download-label { filter: brightness(1.08); }
@media (max-width: 1199px) { .header--nav .header-nav--primary > li > a { font-size: 12px; letter-spacing: .1px; } }
@media (prefers-reduced-motion: reduce) { .topnav .container-nav-right a,.header--nav .header-nav--primary > li > a,.header--nav .header-nav--primary > li > a::after,.header--nav .zs-download-label { transition: none; } }

.topnav .container-nav-right a {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: .3px;
    color: #c9c2b7;
}
.topnav .container-nav-right a i.fa,
.topnav .container-nav-right a svg { color: #ac956d; }
@media (max-width: 1199px) {
    .topnav .container-nav-right a { font-size: 12px; letter-spacing: .1px; }
}

/* Shop alone receives a restrained, periodic highlight without layout shifts. */
.topnav .container-nav-right a[href="?view=shop"] {
    position: relative;
    isolation: isolate;
    color: #c5ae7d;
    animation: zs-shop-glow 3s ease-in-out infinite;
}
.topnav .container-nav-right a[href="?view=shop"]::before {
    content: '';
    position: absolute;
    pointer-events: none;
    z-index: -1;
    left: -9px;
    right: -9px;
    top: -7px;
    bottom: -7px;
    border-radius: 4px;
    background: radial-gradient(ellipse, rgba(185,145,67,.15), transparent 75%);
    opacity: 0;
    animation: zs-shop-halo 3s ease-in-out infinite;
}
.topnav .container-nav-right a[href="?view=shop"] i.fa { color: #b79a61; }
.topnav .container-nav-right a[href="?view=shop"]:hover,
.topnav .container-nav-right a[href="?view=shop"]:focus-visible {
    animation: none;
    color: #e4cf9d;
    text-shadow: 0 0 9px rgba(199,157,78,.3);
}
@keyframes zs-shop-glow {
    0%, 48%, 100% { color: #c5ae7d; text-shadow: 0 1px 2px rgba(0,0,0,.6); }
    65% { color: #e4cf9d; text-shadow: 0 0 9px rgba(199,157,78,.36); }
    82% { color: #d3b77d; text-shadow: 0 0 5px rgba(199,157,78,.18); }
}
@keyframes zs-shop-halo {
    0%, 48%, 100% { opacity: 0; }
    65% { opacity: 1; }
    82% { opacity: .35; }
}
@media (prefers-reduced-motion: reduce) {
    .topnav .container-nav-right a[href="?view=shop"],
    .topnav .container-nav-right a[href="?view=shop"]::before { animation: none; }
}

/* SHOP: one pixel larger, with its cart scaled proportionally. */
.topnav .container-nav-right a:not([href="?view=shop"]) { color: #c2c4c7; }
.topnav .container-nav-right a:not([href="?view=shop"]) i.fa,
.topnav .container-nav-right a:not([href="?view=shop"]) svg { color: #ccc6b9; }
.topnav .container-nav-right a:not([href="?view=shop"]):hover,
.topnav .container-nav-right a:not([href="?view=shop"]):focus-visible { color: #e0e1e3; }
.topnav .container-nav-right a[href="?view=shop"] { font-size: 14px; }
.topnav .container-nav-right a[href="?view=shop"] i.fa { font-size: 15px; width: 16px; }
@media (max-width: 1199px) {
    .topnav .container-nav-right a[href="?view=shop"] { font-size: 13px; }
    .topnav .container-nav-right a[href="?view=shop"] i.fa { font-size: 14px; width: 15px; }
}

/* Final typography: variant 2, upper navigation one pixel smaller. */
.header--nav .header-nav--primary > li > a {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: .25px;
    color: #ccc6b9;
}
.header--nav .header-nav--primary > li > a > i.fa {
    font-size: 13px;
    color: #ccc6b9;
}
.topnav .container-nav-right a,
.topnav .container-nav-right a:not([href="?view=shop"]),
.topnav .container-nav-right a[href="?view=shop"] {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: .25px;
    color: #ccc6b9;
}
.topnav .container-nav-right a i.fa,
.topnav .container-nav-right a svg,
.topnav .container-nav-right a:not([href="?view=shop"]) i.fa,
.topnav .container-nav-right a:not([href="?view=shop"]) svg,
.topnav .container-nav-right a[href="?view=shop"] i.fa {
    font-size: 12px;
    width: 13px;
    height: 12px;
    color: #ccc6b9;
}
.topnav .container-nav-left li > i.fa-home { color: #ccc6b9; }
.header--nav .header-nav--primary > li > a:hover,
.header--nav .header-nav--primary > li > a:focus-visible,
.header--nav .header-nav--primary > li > a[aria-current="page"],
.topnav .container-nav-right a:not([href="?view=shop"]):hover,
.topnav .container-nav-right a:not([href="?view=shop"]):focus-visible { color: #e2d8c4; }
/* Balance text contrast independently on the upper and lower navigation. */
.topnav .container-nav-right a:not([href="?view=shop"]) { color: #ded5c4; }
.topnav .container-nav-right a:not([href="?view=shop"]):hover,
.topnav .container-nav-right a:not([href="?view=shop"]):focus-visible { color: #ebe3d3; }
.header--nav .header-nav--primary > li > a { color: #afa99d; }
.header--nav .header-nav--primary > li > a:hover,
.header--nav .header-nav--primary > li > a:focus-visible,
.header--nav .header-nav--primary > li > a[aria-current="page"] { color: #c6bdab; }
/* SHOP text: +1.5px relative to the current upper menu size. */
.topnav .container-nav-right a[href="?view=shop"] { font-size: 13.5px; }
/* Bold only the lower navigation labels, keeping Font Awesome unchanged. */
.header--nav .header-nav--primary > li > a { font-weight: 700; }
.header--nav .header-nav--primary > li > a > i.fa { font-weight: normal; }
/* Lower navigation typography requested by the user. */
.header--nav .header-nav--primary > li > a { font-family: Candara, Arial, sans-serif; }
/* Regular Candara labels, without bold. */
.header--nav .header-nav--primary > li > a { font-weight: 400; }
/* Lower navigation: increase the existing 13px labels by 2px. */
.header--nav .header-nav--primary > li > a { font-size: 15px; }
/* v22: consistent Candara type and a line expanding from the centre on hover. */
.header--nav .header-nav--primary > li > a {
    font-family: Candara, Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
}
.topnav .container-nav-right a,
.topnav .container-nav-right a:not([href="?view=shop"]),
.topnav .container-nav-right a[href="?view=shop"],
.topnav .container-nav-left,
.topnav .container-nav-left li,
.topnav .container-nav-left a {
    font-family: Candara, Arial, sans-serif;
    font-weight: 400;
}
.topnav .container-nav-right a:not([href="?view=shop"]),
.topnav .container-nav-left,
.topnav .container-nav-left li,
.topnav .container-nav-left a { font-size: 12px; }
.topnav .container-nav-right a[href="?view=shop"] { font-size: 13.5px; }
.header--nav .header-nav--primary > li > a::after {
    pointer-events: none;
    background: linear-gradient(90deg, rgba(204,198,185,0), #ccc6b9 24%, #e0d6c0 50%, #ccc6b9 76%, rgba(204,198,185,0));
    box-shadow: 0 0 7px rgba(204,198,185,.25);
    transform: scaleX(0);
    transform-origin: center;
    opacity: 0;
    transition: transform .3s ease-out, opacity .2s ease-out;
}
.header--nav .header-nav--primary > li > a[aria-current="page"]::after {
    transform: scaleX(1);
    opacity: .55;
    box-shadow: none;
}
.header--nav .header-nav--primary > li > a:hover::after,
.header--nav .header-nav--primary > li > a:focus-visible::after {
    transform: scaleX(1);
    opacity: 1;
    box-shadow: 0 0 7px rgba(204,198,185,.25);
}
@media (prefers-reduced-motion: reduce) {
    .header--nav .header-nav--primary > li > a::after { transition: none; }
}

/* v23: highlight menu labels with the underline only, without a filled tile. */
.header--nav .header-nav--primary > li > a:hover,
.header--nav .header-nav--primary > li > a:focus-visible,
.header--nav .header-nav--primary > li > a[aria-current="page"] {
    background: transparent;
}

/* v24: clearer upper labels and icons sharing the same champagne silver. */
.topnav .container-nav-right a:not([href="?view=shop"]) {
    color: #e5dfd2;
    text-shadow: 0 1px 2px rgba(0,0,0,.7);
}
.topnav .container-nav-right a:not([href="?view=shop"]) i.fa,
.topnav .container-nav-right a:not([href="?view=shop"]) svg {
    color: inherit;
    vertical-align: middle;
}
.topnav .container-nav-right a:not([href="?view=shop"]):hover,
.topnav .container-nav-right a:not([href="?view=shop"]):focus-visible { color: #f0e9dc; }
.topnav .container-nav-left,
.topnav .container-nav-left li { color: #c9c2b7; }
.topnav .container-nav-left li > i.fa-home { color: #e5dfd2; }

/* v25: slightly brighter upper navigation and download notice. */
.topnav .container-nav-right a:not([href="?view=shop"]) { color: #f0eadf; }
.topnav .container-nav-right a:not([href="?view=shop"]):hover,
.topnav .container-nav-right a:not([href="?view=shop"]):focus-visible { color: #faf5eb; }
.topnav .container-nav-left,
.topnav .container-nav-left li { color: #dad3c7; }
.topnav .container-nav-left li > i.fa-home { color: #f0eadf; }

/* v26: the original stylesheet forces dark anchor colours with !important. */
.topnav .container-nav-right li a:not([href="?view=shop"]) {
    color: #f0eadf !important;
}
.topnav .container-nav-right li a:not([href="?view=shop"]):hover,
.topnav .container-nav-right li a:not([href="?view=shop"]):focus-visible {
    color: #fff8eb !important;
}
.topnav .container-nav-right li a:not([href="?view=shop"]) i.fa,
.topnav .container-nav-right li a:not([href="?view=shop"]) svg {
    color: inherit !important;
}
.topnav .container-nav-left li a.nav-active { color: #e9dfcb !important; }
.topnav .container-nav-left li a.nav-active:hover,
.topnav .container-nav-left li a.nav-active:focus-visible { color: #fff4df !important; }

/* v27: balanced champagne silver for every upper link, including SHOP. */
.topnav .container-nav-right li a,
.topnav .container-nav-right li a:not([href="?view=shop"]),
.topnav .container-nav-right li a[href="?view=shop"] {
    color: #c9c3b7 !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.6);
}
.topnav .container-nav-right li a i.fa,
.topnav .container-nav-right li a svg,
.topnav .container-nav-right li a:not([href="?view=shop"]) i.fa,
.topnav .container-nav-right li a:not([href="?view=shop"]) svg,
.topnav .container-nav-right li a[href="?view=shop"] i.fa { color: inherit !important; }
.topnav .container-nav-right li a:hover,
.topnav .container-nav-right li a:focus-visible,
.topnav .container-nav-right li a:not([href="?view=shop"]):hover,
.topnav .container-nav-right li a:not([href="?view=shop"]):focus-visible,
.topnav .container-nav-right li a[href="?view=shop"]:hover,
.topnav .container-nav-right li a[href="?view=shop"]:focus-visible { color: #e0d8c9 !important; }
.topnav .container-nav-left,
.topnav .container-nav-left li { color: #c3bdb2; }
.topnav .container-nav-left li > i.fa-home,
.topnav .container-nav-left li a.nav-active { color: #c9c3b7 !important; }
.topnav .container-nav-left li a.nav-active:hover,
.topnav .container-nav-left li a.nav-active:focus-visible { color: #e0d8c9 !important; }
/* Animate the shadow only: SHOP and its cart retain the shared text colour. */
@keyframes zs-shop-glow {
    0%, 48%, 100% { text-shadow: 0 1px 2px rgba(0,0,0,.6); }
    65% { text-shadow: 0 0 8px rgba(201,195,183,.32); }
    82% { text-shadow: 0 0 4px rgba(201,195,183,.15); }
}
.topnav .container-nav-right a[href="?view=shop"]::before {
    background: radial-gradient(ellipse, rgba(201,195,183,.12), transparent 75%);
}

/* v28: 7/10 of v27 channel brightness, retaining the champagne hue. */
.topnav .container-nav-right li a,
.topnav .container-nav-right li a:not([href="?view=shop"]),
.topnav .container-nav-right li a[href="?view=shop"] {
    color: #8d8980 !important;
}
.topnav .container-nav-right li a:hover,
.topnav .container-nav-right li a:focus-visible,
.topnav .container-nav-right li a:not([href="?view=shop"]):hover,
.topnav .container-nav-right li a:not([href="?view=shop"]):focus-visible,
.topnav .container-nav-right li a[href="?view=shop"]:hover,
.topnav .container-nav-right li a[href="?view=shop"]:focus-visible { color: #aaa497 !important; }
.topnav .container-nav-left,
.topnav .container-nav-left li { color: #89847d; }
.topnav .container-nav-left li > i.fa-home,
.topnav .container-nav-left li a.nav-active { color: #8d8980 !important; }
.topnav .container-nav-left li a.nav-active:hover,
.topnav .container-nav-left li a.nav-active:focus-visible { color: #aaa497 !important; }


/* Back to top: wariant 1 — stare zloto. Zachowuje obecna obsluge przewijania. */
.back-to-top > button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 43px;
    padding: 0 19px;
    border: 1px solid #756348;
    border-radius: 3px;
    background: linear-gradient(#343037, #252228);
    color: #c7b48e;
    font: 400 14px/1.2 Georgia, "Times New Roman", serif;
    text-transform: none;
    text-shadow: 0 1px 2px rgba(0,0,0,.5);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.03), 0 4px 14px rgba(0,0,0,.25);
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease, color .18s ease, background .18s ease;
}
.back-to-top > button > i.fa {
    width: 14px;
    margin: 0;
    color: #ac9263;
    font-size: 18px;
    line-height: 1;
}
.back-to-top > button:hover {
    transform: translateY(-2px);
    background: linear-gradient(#403940, #2c272d);
    border-color: #a38a5e;
    color: #e0cda8;
}
.back-to-top > button:focus-visible {
    outline: 2px solid #c7b48e;
    outline-offset: 4px;
}
@media (prefers-reduced-motion: reduce) {
    .back-to-top > button { transition: none; }
    .back-to-top > button:hover { transform: none; }
}

/* Align visible shield centre, compensating for image's transparent padding. */
.topnav .container-nav-centre {
    left: 50%;
    margin-left: 0;
    width: max-content;
    transform: translateX(calc(-50% - 10px));
}
.topnav .container-nav-centre > ul {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
}