/*------------------------RESET---------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ul,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {
	margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; text-decoration:none; list-style-type: none;}
article, aside, details, figcaption, figure, hgroup, menu, nav, section { display: block; }
/*------------------------------------------------------*/
.clear { clear: both;height: 1px; line-height: 1px; overflow: hidden; margin-bottom: -1px; }
.chyba { background-color:#c81816; color:#ffffff; text-align:center; font-size:14px; padding:5px 0px 5px 0px; margin:2px auto 0px auto; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
.embedBlok {display: block; width: 100%;}

#in_message {
    position: absolute;
    left: -9999em;
    top: 0;
}

.news-detail { max-width:750px; margin:0px auto; border:1px solid #f9f6f6; padding:10px 30px; min-height:600px; display:flex !important; }

body                                            { display: block !important; }



:root                                           {
                                                --font1:          'proxima-nova', sans-serif; /* 500, 700 */

                                                --color0:       #252525;
                                                --color0b:      black;
                                                --color1:       rgb(181,144,34);
                                                --color1b:      rgb(213, 174, 56);
                                                --color2:       rgb(200,200,200);
                                                --color2b:      rgb(240,240,240);
                                                --color2c:      rgb(160,160,160);
                                                
                                                --wrapper-side:         5vw;

                                                --section-padding:      min(7rem, calc(2rem + 5vw));
                                                --gap1:                 min(1.4rem, calc(0.3rem + 4vw));
                                                --gap2:                 min(1.8rem, calc(0.5rem + 4vw));
                                                --gap3:                 min(2.6rem, calc(0.9rem + 4vw));
                                                --swiper-button-width:  min(3.6rem, calc(2rem + 4vw));  

                                                --border-radius1:       min(1rem, 3vw); 
                                                --border-radius2:       min(3.6rem, calc(1.2rem + 3vw)); 
                                                --padding1:             min(1.2rem, 2vw);
                                                --padding2:             min(3.5rem, 7vw);                                               
                                                }
  @media screen and (min-width: 1081px)         {
  :root                                         {--header-height: 6rem;}
  }
  @media screen and (max-width: 1080px)         {
  :root                                         {--header-height: 4rem;}
  }  

button                                          {background: none; outline: none; cursor: pointer; position: relative; border: none; box-sizing: border-box; padding: 0; white-space: nowrap; font-family: 'lato', sans-serif; transition: .15s ease-in-out;}

html, body, form                                {width: 100%;}
body                                            {margin: 0 auto; font-family: var(--font1); font-size: min(17px, calc(10px + 1vw)); color: var(--color0); font-weight: 500; line-height: 1.35; position: relative;}
form                                            {display: flex; min-height: 100vh; flex-direction: column; flex-wrap: wrap;}

body.fixed                                      {overflow-y: hidden;}
body.fixed :is(.main, .footer)                  {opacity: 0.65; filter: blur(4px);}
.wrapper                                        {display: flex; width: calc(100vw - 2 * var(--wrapper-side)); max-width: 60rem; flex-wrap: wrap; margin-inline: auto; position: relative;}
  @media screen and (min-width: 1081px)         {
  .wrapper.wide                                 {max-width: 80rem;}
  .wrapper.medium                               {max-width: 70rem;}
  .wrapper.narrow2                              {max-width: 50rem;}
  .wrapper.narrow                               {max-width: 42rem;}
  }

.hp .header                                     {position: absolute; left: 0; top: 0;}



.header                                         {display: block; width: 100%; min-height: var(--header-height); position: relative; z-index: 10000;}
.header .wrapper                                {min-height: var(--header-height); justify-content: space-between; align-items: center; gap: 1em;}


.header .logo                                   {display: flex; width: var(--logo-width); height: 100%; align-items: center; position: relative; z-index: 10; box-sizing: border-box;}    
.header .logo img                               {display: block; width: 100%;}    
.header .collapse                               {display: flex; z-index:1;}
    .header .topbar {
        display: flex;
        position: relative;
        z-index: 2;
    }

        .header .topbar > ul {
            display: flex;
            font-size: 0.9em;
        }

            .header .topbar > ul li {
                display: flex;
                align-items: center;
                position: relative;
            }

                .header .topbar > ul li a {
                    display: flex;
                    align-items: center;
                    color: var(--color0);
                    font-weight: 500;
                    position: relative;
                    box-sizing: border-box;
                    transition: .2s ease-in-out;
                }

                    .header .topbar > ul li a:hover {
                        color: var(--color1);
                    }
.header nav                                     {display: flex;}
.header nav > ul                                {display: flex;}
.header nav > ul > li                           {display: flex; align-items: center; position: relative;}
.header nav > ul > li > a                       {display: flex; align-items: center; font-weight: 700; position: relative; box-sizing: border-box; transition: .2s ease-in-out;}
.header nav > ul > li > a[href]:hover,
.header nav > ul > li > a[aria-current="page"]  {color: var(--color1) !important;}
.header nav > ul > li > ul > li > a             {display: flex; justify-content: space-between; align-items: center; gap: 0.6em; font-weight: 700; box-sizing: border-box; position: relative; transition: .15s ease-in-out;}
.header nav > ul > li > ul > li > a:after       {display: block; width: 0.4em; height: 100%; transform: rotate(-90deg); background-repeat: no-repeat; background-position: center center; background-size: contain; position: absolute; top: 0; content: "";}
.header nav > ul > li > ul > li > a:hover       {color: var(--color1);}
  @media screen and (min-width: 1081px)         {
  .header                                       {--logo-width: 13em;}
  .header :is(.mobile-only, #navicon)           {display: none;}
  .header .collapse                             {height: 100%; flex-direction: column; align-items: flex-end; justify-content: center; gap: 0.6em; flex-grow: 2; position: relative; top: 0.25em;}
    .header .topbar > ul li:not(:last-child):after {
        display: block;
        height: 0.9em;
        width: 1px;
        background: var(--color1);
        margin-inline: 0.75em;
        position: relative;
        top: -0.05em;
        content: "";
    }

    .header .topbar > ul li a {
        color: var(--color0);
    }
  .header nav                                   {align-items: center; gap: 1.4em; font-size: 1.2em;} 
  .header nav > ul                              {gap: 1.2em;}
  .header nav > ul > li > a                     {color: var(--color0);}
  .header nav > ul > li:has(ul) > a:after       {display: block; width: 0.4em; height: 0.4em; margin-left: 0.35em; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M191.5,414.4c35.5,47.6,93.6,47.6,129.1,0l172.8-231.8c35.5-47.6,15.9-86.6-43.4-86.6H62.1c-59.4,0-78.9,39-43.4,86.6 L191.5,414.4z' fill='rgb(181,144,34)' stroke='none' stroke-width='0' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center center; background-size: contain; content: ""; transition: .25s ease-in-out;}
  .header nav > ul > li:has(.sel) > a,
  .header nav > ul > li > a.sel                 {color: var(--color1);}
  .header nav > ul > li > ul                    {display: none; width: 11em; background: var(--color0); border-radius: 0.1em; position: absolute; left: -0.8em; top: 1.8em; z-index: 20; border-radius: 0.3em; overflow: hidden;}
  .header nav > ul > li > ul > li               {display: block;}
  .header nav > ul > li > ul > li > a           {font-size: 0.8em; color: white; padding: 0.7em 1.9em 0.7em 1em; opacity: 0.8;}
  .header nav > ul > li > ul > li > a:after     {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M191.5,414.4c35.5,47.6,93.6,47.6,129.1,0l172.8-231.8c35.5-47.6,15.9-86.6-43.4-86.6H62.1c-59.4,0-78.9,39-43.4,86.6 L191.5,414.4z' fill='white' stroke='none' stroke-width='0' stroke-linecap='round'/%3E%3C/svg%3E"); right: 0.8em;}
  .header nav > ul > li > ul > li > a:hover     {background: var(--color0b); color: white; opacity: 1;}
  .header nav > ul > li > ul > li > a.sel       {color: var(--color1b); opacity: 1;}
  .header nav .button                           {font-size: 0.85em;}
  .header .lang                                 {display: block; height: var(--lang-size); --lang-size: 1.8em; overflow: hidden; position: relative; margin-inline: -0.5em; transition: .15s ease-in-out;}
    .header .lang ul {
        display: block;
        height: var(--lang-size);
        font-size: 0.9em;
        overflow: hidden;
        border-radius: 0.25em;
        border: solid 1px transparent;
        box-sizing: border-box;
    }
  .header .lang ul li                           {display: block; height: var(--lang-size); box-sizing: border-box; position: relative; order: 1; transition: .15s ease-in-out;}
  .header .lang ul li a                         {display: flex; width: 100%; height: 100%; align-items: center; font-size: 1em; font-weight: 500; color: #999999; padding-inline: 0.4em; box-sizing: border-box; transition: .15s ease-in-out;}
  .header .lang ul li a:hover                   {color: var(--color1); cursor: pointer;}
  .header .lang ul li.sel a                     {color: var(--color0);}
  .header .lang ul li:not(.sel) a:hover         {background: var(--color2b);}
  .header .lang.hover                           {overflow: visible;}
  .header .lang.hover ul                        {height: auto; background: white; border-color: var(--color2);}
  .header .lang.hover ul li                     {opacity: 1;}         
  }
  @media screen and (min-width: 1081px) and (max-width: 1280px){
  .header                                       {--logo-width: 11em;}
  .header .topbar ul                            {font-size: 0.85em;}
  .header nav                                   {font-size: 1.05em;} 
  .header nav > ul                              {gap: 1em;}
  }
  @media screen and (max-width: 1080px)         {
  .header                                       {--logo-width: 9em;}
  .header .desktop-only                         {display: none;}
  .header .mobile-only                          {display: flex; justify-content: flex-end; flex-grow: 2;}
  .header .collapse                             {width: 18em; height: calc(100vh - 2 * var(--header-height)); flex-wrap: wrap; background: var(--color0); --inner-padding: 2rem; overflow-y: auto; position: fixed; right: -19em; top: var(--header-height); border-radius: 1em 0 0 3em; box-sizing: border-box; opacity: 0; transition: opacity .5s ease-in-out, right .5s ease-in-out;} 
  .header nav                                   {width: 100%; order: 0; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; gap: 0.5em; box-sizing: border-box;}
    .header .lang {
        display: flex;
        width: 100%;
        padding-inline: var(--inner-padding);
        box-sizing: border-box;
        order: -1;
    }

        .header .lang ul {
            display: flex;
            width: 100%;
            align-items: center;
            gap: 0.3em;
        }

            .header .lang ul li {
                display: block;
                width: auto;
                transition: .15s ease-in-out;
            }

                .header .lang ul li a {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    font-size: 0.9em;
                    font-weight: 500;
                    color: white;
                    opacity: 0.6;
                    background: black;
                    padding: 0.3em 0.6em;
                    border-radius: 0.4em;
                    box-sizing: border-box;
                    transition: .15s ease-in-out;
                }

                    .header .lang ul li a:hover {
                        opacity: 1;
                        cursor: pointer;
                    }

                .header .lang ul li.sel a {
                    color: var(--color1);
                    font-weight: 700;
                    opacity: 1;
                    border: solid 0.1em var(--color1);
                }
  .header nav > ul                              {width: 100%; flex-wrap: wrap; align-items: flex-start; align-content: flex-start;}
  .header nav > ul > li                         {width: 100%; flex-wrap: wrap;}
  .header nav > ul > li > a                     {width: 100%; font-size: 1.2em; color: white; padding: 0.6rem var(--inner-padding); box-sizing: border-box;}
  .header nav > ul > li > a.sel                 {color: var(--color1); background: rgba(0,0,0,0.3);}
  .header nav > ul > li > ul                    {display: block; width: 100%; margin-bottom: 0.2em;}
  .header nav > ul > li > ul > li > a           {font-size: 0.9em; color: white; padding: 0.3rem 1rem 0.3rem 3rem; box-sizing: border-box;}
  .header nav > ul > li > ul > li > a:after     {left: 2rem; top: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M191.5,414.4c35.5,47.6,93.6,47.6,129.1,0l172.8-231.8c35.5-47.6,15.9-86.6-43.4-86.6H62.1c-59.4,0-78.9,39-43.4,86.6 L191.5,414.4z' fill='rgb(181,144,34)' stroke='none' stroke-width='0' stroke-linecap='round'/%3E%3C/svg%3E"); right: 0.8em;}
  .header nav > ul > li > ul > li > a.sel       {color: var(--color1b); background: rgba(0,0,0,0.3);}
  .header nav > ul > li:first-child > a:not(.sel){margin-top: 1rem;}
  .header nav > ul > li:last-child > a:not(.sel){margin-bottom: 1rem;}
    .header .topbar { flex-wrap: wrap; gap: 1rem; order: 1; padding-bottom: 2rem; }
    .header .topbar > ul { flex-wrap: wrap; }
    .header .topbar > ul li { width: 100%; }
    .header .topbar > ul li a { color: var(--color1b); padding: 0.3rem var(--inner-padding); box-sizing: border-box; }
    .header .topbar > ul li a:hover { color: var(--color1); }
  .header #navicon                              {display: flex; width: 1.4em; height: 16px; font-size: 1em; cursor: pointer; position: relative; z-index: 10;}
  .header #navicon span                         {display: block; width: 100%; height: 0.16em; background: var(--color0); position: absolute; transition: .2s ease-in-out;}
  .header #navicon:hover span                   {background: var(--color1);}
  .header #navicon span:nth-child(1)            {top: 0;}
  .header #navicon span:nth-child(2),
  .header #navicon span:nth-child(3)            {top: calc(50% - 0.08em);}
  .header #navicon span:nth-child(4)            {bottom: 0;}
  .header #navicon div                          {display: none; width: 6em; height: 2em; position: absolute; left: 0; top: calc(50% - 1em); z-index: 2;}
  .header.show #navicon span:nth-child(2)       {transform: rotate(45deg);}
  .header.show #navicon span:nth-child(3)       {transform: rotate(-45deg);}
  .header.show #navicon span:nth-child(1), 
  .header.show #navicon span:nth-child(4)       {opacity: 0 !important;}
  .header.show #navicon div                     {display: block;}
  .header.show .collapse                        {right: 0; opacity: 1;}
  }

.footer                                         {display: block; width: 100%; background: url("images/cross-black-outline.svg") no-repeat left calc(90vw - 14rem) top -2.5em, url("images/cross-black-outline.svg") no-repeat right calc(95vw - 12rem) bottom -2.5em, var(--color0); background-size: 16em auto, 12em auto; padding-block: var(--section-padding) min(2rem, 2vw);}
.footer .wrapper                                {gap: calc(var(--section-padding) - 1rem) 0;}
.footer .wrapper > div                          {display: flex; width: 100%; justify-content: space-between;}
.footer .upper                                  {gap: .3rem 2rem;}
.footer .upper > div                            {display: flex; flex-direction: column; align-items: flex-start; gap: 0.35em;}
.footer .upper > div > *                        {display: flex; align-items: flex-start; gap: 0.45em; font-size: 1.2em; color: white;}
.footer .upper > div a                          {transition: .15s ease-in-out;}
.footer .upper > div a .icon                    {display: block; width: 1.2em; height: 1.2em; background: var(--color1); padding: 0.25em; border-radius: 100%; box-sizing: border-box; position: relative; top: 0.06em;}
.footer .upper > div a .icon img                {display: block; width: 100%; height: 100%;}
.footer .upper > div a[href]:hover              {color: var(--color1);}
.footer .upper > div strong                     {display: inline-block; padding-right: 0.45em; margin-right: 0.1em; position: relative;}
.footer .upper > div strong:after               {display: block; width: 0.07em; height: 0.9em; background: var(--color1); position: absolute; right: 0; top: 0.18em; content: "";}
.footer .upper > div .title                     {font-size: 1em; color: var(--color1); font-weight: 700; margin-bottom: 0.35em;}
.footer .bottom                                 {gap: 1em 2em;}
.footer .bottom > div                           {display: block; overflow: hidden;}
.footer ul                                      {display: flex; flex-wrap: wrap; gap: 0.5em 0; font-weight: 500;}
.footer ul li                                   {display: flex; align-items: center; font-size: 0.8em; color: white; position: relative;}
.footer ul li:before                            {display: block; width: 0.1em; height: 0.9em; background: var(--color1); margin-inline: 0.7em; content: "";}
.footer ul li a                                 {color: inherit; transition: .15s ease-in-out;}
.footer ul li a:hover                           {color: var(--color1);}
  @media screen and (max-width: 1280px)         {
  .footer .upper > div strong                   {padding: 0;}
  .footer .upper > div strong:after             {display: none;}
  .footer .upper > div > * span > span          {display: block; font-size: 0.7em; opacity: 0.7;}
  }
  @media screen and (min-width: 1081px)         {
  .footer ul li:first-child:before              {display: none;}  
  } 
  @media screen and (max-width: 1080px)         {
  .footer .wrapper > div                        {flex-wrap: wrap;}
  .footer .bottom > div                         {width: 100%;}
  .footer .bottom > div:nth-child(1) ul         {font-size: 1.25em; font-weight: 700;}
  .footer .bottom > div:nth-child(1) ul:nth-child(1) li:first-child:before
                                                {display: none;}
  .footer .bottom > div:nth-child(2) ul         {margin-left: -1.2em;}
  }
  @media screen and (min-width: 961px)          {
  .footer .upper > div:nth-child(2)             {flex-grow: 2;}
  } 
  @media screen and (max-width: 960px)          {
  .footer .upper > div:nth-child(2)             {order: 2; width: 100%;}
  }
  @media screen and (min-width: 541px)          {
  .footer .upper > div:nth-child(3)             {align-items: flex-end; text-align: right;}
  }
  @media screen and (max-width: 540px)          {
  .footer .upper > div:nth-child(3)             {width: 100%; padding-block: 1.5rem; margin-block: 1rem; border-top: solid 1px rgba(255,255,255,0.15); border-bottom: solid 0.1em rgba(255,255,255,0.15);}   
  }

strong                                          {font-weight: 700;}
em                                              {font-style: italic;}
.text-color1                                    {color: var(--color1);}
.regular                                        {font-weight: 500;}

h1, h2, h3                                      {display: block; width: 100%; color: var(--color0); font-weight: 700; line-height: 1.1; box-sizing: border-box; position: relative;}
h1                                              {font-size: min(2.5rem, calc(0.7rem + 4vw));}
h2                                              {font-size: min(2.4rem, calc(0.6rem + 4vw)); margin-bottom: var(--gap1);}
h3                                              {font-size: min(1.85rem, calc(0.4rem + 4vw)); color: var(--color1);}

.main                                           {display: flex; width: 100%; flex-direction: column; flex-grow: 1; flex-wrap: wrap; margin: 0 auto; box-sizing: border-box; position: relative; transition: .3s ease-in-out;}
.main :is(p, li)                                {font-size: 1.1em;}
.main p                                         {display: block; width: 100%; box-sizing: border-box;}
.main p.large                                   {font-size: min(1.6em, calc(0.9em + 1vw));}
.main p a, .main li a, .main td a               {text-decoration: underline; color: var(--color0); text-decoration-color: var(--color1); transition: .15s ease-in-out;}
.main p a:hover, .main li a:hover, .main td a:hover
                                                {color: var(--color1); text-decoration-color: transparent;}

p.large                                         {font-size: 1.3em; line-height: 1.3;}

.section                                        {display: flex; width: 100%; flex-direction: column; align-items: center; position: relative; padding-block: var(--section-padding); box-sizing: border-box; overflow:hidden;}
.section.padding-top-0                          {padding-top: 0;}
.section.padding-bottom-0                       {padding-bottom: 0;}

.section .gradient1                             {display: block; height: 20em; opacity: 0.75; background-image: linear-gradient(to bottom, var(--color2b), transparent); border-top-right-radius: var(--border-radius2); position: absolute; left: 0; top: calc(0.7 * var(--section-padding));
                                                  -webkit-mask-size: contain; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; ; mask-size: contain; mask-repeat: no-repeat; mask-position: center center;
                                                 -webkit-mask-image: linear-gradient(to left, black, transparent); mask-image: linear-gradient(to left, black, transparent);
                                                }
  @media screen and (min-width: 1081px)         {
  .section .gradient1                           {width: 43%;}
  }
  @media screen and (max-width: 1080px)         {
  .section .gradient1                           {width: 70%;}
  }

.flex                                           {display: flex !important; width: 100%; flex-wrap: wrap; gap: 0.6em; box-sizing: border-box; margin-top: var(--gap1);}
.flex.padding-inline                            {padding-inline: var(--padding1);}
  
.button                                         {display: flex; justify-content: center; align-items: center; gap: 0.4em; font-size: 1em; color: var(--color0); font-weight: 700; white-space: nowrap; padding: 0.4em 1em; border-radius: 0.2em; border: none; outline: none; box-sizing: border-box; overflow: hidden; cursor: pointer; position: relative; z-index: 1; font-family: var(--font1); transition: .15s ease-in-out;}
.button img                                     {display: block; height: 1em; width: auto;}
.button.border1                                 {border: solid 0.12em var(--color1);}
.button.border1:hover                           {color: var(--color1b); border-color: var(--color1b);}
    .button.color1 {
        background: var(--color1);
        color: white;
    }

        .button.color1:hover {
            background: var(--color1b);
        }
.page-head                                      {display: block; width: 100%; background: var(--color2b); padding: min(1.5em, calc(0.3rem + 3vw)) var(--padding2); margin-bottom: var(--gap2); border-radius: 0.4em var(--border-radius2); box-sizing: border-box;}
.page-head .wrapper                             {width: 100%; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 0.4em 1.2em;}
.page-head .wrapper.wide                        {max-width: 100%;}
.page-head h1                                   {width: auto;}
  @media screen and (max-width: 1080px)         {
  .page-head                                    {width: calc(100% + var(--wrapper-side)); margin-left: calc(0px - var(--wrapper-side)); padding-inline: var(--wrapper-side); border-radius: 0 0.3em 2em 0;}
  .page-head .wrapper                           {width: 100%;}
  }

.page-head-line                                 {display: block; width: 100%; height: 0.08em; background: var(--color2); margin-bottom: var(--gap1);}
  @media screen and (min-width: 1081px)         {
  .page-head-line                               {margin-top: 0.35rem;}
  }

.breadcrumbs                                    {display: block;}
.breadcrumbs + *                                {margin-top: 0.8rem;}
.breadcrumbs ul                                 {display: flex; flex-wrap: wrap; gap: 1.5em; margin: 0; padding: 0 !important;}
.breadcrumbs ul li                              {display: flex; width: auto!important; align-items: center; font-size: 0.9em; line-height: 1.3 !important; position: relative; padding: 0; margin: 0;}
.breadcrumbs ul li:first-child                  {padding-left: 0;}
.breadcrumbs ul li:before                       {display: none;}
.breadcrumbs ul li:not(:last-child) a:after     {display: inline-block; width: 0.45em; height: 0.44em; position: absolute; right: -1.05em; top: 0.45em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M191.5,414.4c35.5,47.6,93.6,47.6,129.1,0l172.8-231.8c35.5-47.6,15.9-86.6-43.4-86.6H62.1c-59.4,0-78.9,39-43.4,86.6 L191.5,414.4z' fill='rgb(140,140,140)' stroke='none' stroke-width='0' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center center; background-size: contain; content: ""; transform: rotate(-90deg); transition: .15s ease-in-out;}
.breadcrumbs ul li a                            {display: block; color: #999999; text-decoration: underline; font-weight: 500; border: none; transition: .15s ease-in-out;}
.breadcrumbs ul li:last-child a                 {color: var(--color0); text-decoration: none; font-weight: 700; opacity: 1;}
.breadcrumbs ul li a[href]:hover                {color: var(--color0); text-decoration-color: transparent;}
  @media screen and (max-width: 768px)          {  
  .breadcrumbs                                  {overflow-x: auto; scrollbar-width: none;}
  .breadcrumbs::-webkit-scrollbar               {display: none;}
  .breadcrumbs ul                               {flex-wrap: nowrap;}
  .breadcrumbs ul li a                          {white-space: nowrap;}
  } 

.submenu1                                       {display: block; width: 100%; box-sizing: border-box; position: relative; z-index: 5; margin-bottom: var(--gap2);}
.submenu1 > div                                 {display: block; width: 100%; position: relative;}
.submenu1 > div nav                             {display: flex; width: 100%; flex-wrap: wrap; gap: 0 1.1em; box-sizing: border-box;}                                
.submenu1 > div nav a                           {display: flex; align-items: center; font-size: 1.1em; font-weight: 700; color: #999999; padding-block: 0.35em; border-radius: 0.2em; box-sizing: border-box; position: relative; transition: .15s ease-in-out;}
.submenu1 > div nav a:not(.sel):hover           {color: var(--color1);}
  @media screen and (min-width: 769px)          {  
  .submenu1                                     {padding-inline: var(--padding2);}
  .submenu1 > span                              {display: none;}
  .submenu1 > div nav a.sel                     {color: white; background: var(--color1); padding-inline: 0.9em;}
  }
  @media screen and (max-width: 768px)          {  
  .submenu1                                     {height: calc(1.5rem + var(--submenu1-item-height)); --submenu1-item-height: 2.6rem; padding-inline: var(--padding1);}
  .submenu1 > span                              {display: block; height: 1.5rem; color: var(--color1); font-weight: 700; padding-inline: 0.95em; box-sizing: border-box;}
  .submenu1 > div                               {height: var(--submenu1-item-height); background: white; border-bottom: solid 1px var(--color2c); border-radius: 0.35em; overflow: hidden; transition: .3s ease-in-out;}
  .submenu1 > div:after                         {display: inline-block; width: 0.55em; height: 0.55em; position: absolute; right: 0.9em; top: 0.95em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M191.5,414.4c35.5,47.6,93.6,47.6,129.1,0l172.8-231.8c35.5-47.6,15.9-86.6-43.4-86.6H62.1c-59.4,0-78.9,39-43.4,86.6 L191.5,414.4z' fill='rgb(181,144,34)' stroke='none' stroke-width='0' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center center; background-size: contain; content: ""; transition: .15s ease-in-out;}
  .submenu1 > div nav                           {height: calc(4 * var(--submenu1-item-height)); margin-top: var(--submenu1-item-height); overflow-y: auto;}
  .submenu1 > div nav a                         {width: 100%; height: var(--submenu1-item-height); padding-inline: 0.9em; border-bottom: solid 1px var(--color2b); cursor: pointer;}
  .submenu1 > div nav a:not(.sel):after         {display: inline-block; width: 0.44em; height: 0.44em; opacity: 0.4; position: absolute; right: 0.9em; top: calc(50% - 0.22em); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M191.5,414.4c35.5,47.6,93.6,47.6,129.1,0l172.8-231.8c35.5-47.6,15.9-86.6-43.4-86.6H62.1c-59.4,0-78.9,39-43.4,86.6 L191.5,414.4z' fill='black' stroke='none' stroke-width='0' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center center; background-size: contain; content: ""; transform: rotate(-90deg);}
  .submenu1 > div nav a:hover                   {color: var(--color0); background: var(--color2b);} 
  .submenu1 > div nav a:hover:not(.sel):after   {opacity: 0.9;} 
  .submenu1 > div nav a.sel                     {color: var(--color0); position: absolute; left: 0; top: 0;}
  .submenu1 > div nav a.sel:hover               {background: var(--color2b);}
  .submenu1 > div.show                          {height: calc(5 * var(--submenu1-item-height)); box-shadow: 0 0 0.5em rgba(0,0,0,0.1);}
  .submenu1 > div.show:after                    {transform: rotate(180deg);}
  .submenu1 > div.show nav a.sel                {background: var(--color2b);}
  } 
  @media screen and (max-width: 768px)          {  
  .submenu1                                     {height: calc(1.3rem + var(--submenu1-item-height));}
  .submenu1 > span                              {height: 1.3rem;}
  }

/* Kratké, nezabaluje se */
.submenu2                                       {display: block; width: 100%; box-sizing: border-box; position: relative; z-index: 5;}
.submenu2 nav                                   {display: flex; width: 100%; flex-wrap: wrap; gap: 0 1.1em; box-sizing: border-box;}                                
.submenu2 nav a                                 {display: flex; align-items: center; font-size: 1.1em; font-weight: 700; color: #999999; padding-block: 0.35em; border-radius: 0.2em; box-sizing: border-box; position: relative; transition: .15s ease-in-out;}
.submenu2 nav a:not(.sel):hover                 {color: var(--color1);}
.submenu2 nav a.sel                             {color: white; background: var(--color1); padding-inline: 0.9em;}
  @media screen and (max-width: 640px)          {  
  .submenu2                                     {font-size: 0.9em;}
  }

.pagination                                     {display: flex; width: 100%; justify-content: flex-end; flex-wrap: wrap; gap: 0.1em; margin-top: 2rem;}
.pagination a                                   {display: flex; justify-content: center; align-items: center; font-size: 0.9em; line-height: 1; color: #666666; font-weight: 700; padding: 0.6em 0.85em; border-radius: 0.25em; box-sizing: border-box; transition: .2s ease-in-out;}
.pagination a:hover                             {background: var(--color2b); color: var(--color0);}
.pagination a.sel                               {color: white; border-color: var(--color1); background: var(--color1);}
  @media screen and (max-width: 1080px)         {
  .pagination a                                 {font-size: 0.9em;}
  }

.filter-item                                        {display: block; min-width: 10em;}
.filter-item .title                                 {display: block; font-size: 0.8em; color: var(--color1); font-weight: 700; line-height: 1.1;}
.filter-item .filter-type                           {display: block; width: 100%; height: var(--filter-item-height); position: relative; border-bottom: solid 0.1em var(--color2); transition: .15s ease-in-out; --filter-item-height: 2.4rem;}
.filter-item .filter-type:hover                     {border-color: var(--color1);}

.filter-item .custom-select-wrapper select          {position: absolute !important; left: -9999px;}
.filter-item .custom-select-wrapper .custom-select  {display: block; width: 100%; height: 100%; position: relative; cursor: pointer; user-select: none;}
.filter-item .custom-select-trigger                 {display: flex; width: 100%; height: 100%; color: #999999; align-items: center; gap: 0.4em; padding-block: 0.25em; position: absolute; inset: 0; box-sizing: border-box; transition: .15s ease-in-out;}
.filter-item .custom-select-trigger .flag           {display: block; width: 0.95em; height: 0.95em; position: relative; top: -0.02em;}
.filter-item .custom-select-trigger:after           {display: block; width: 0.4em; height: 100%; opacity: 0.9; position: absolute; right: 0; top: 0; content: ""; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M191.5,414.4c35.5,47.6,93.6,47.6,129.1,0l172.8-231.8c35.5-47.6,15.9-86.6-43.4-86.6H62.1c-59.4,0-78.9,39-43.4,86.6 L191.5,414.4z' fill='black' stroke='none' stroke-width='0' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center center; background-size: contain; transform: rotate(-90deg) transition: .2s ease-in-out;}
.filter-item .custom-select-trigger.show:after      {transform: rotateX(180deg);}
.filter-item .custom-select-trigger:hover           {color: #666666;}
.filter-item .custom-select-trigger.chosen          {color: var(--color0); font-weight: 700;}
.filter-item .custom-options                        {display: none; width: calc(100% + 1.6em); max-height: 15em; background: white; position: absolute; left: -0.8em; top: calc(100% + 0.3em); border: solid 1px rgba(0,0,0,0.2); border-radius: 0.3em; box-sizing: border-box; overflow-y: auto; z-index: 100;}
.filter-item .custom-option                         {display: flex; width: 100%; align-items: center; gap: 0.4em; text-align: left; color: #999999; padding: 0.6em 0.8em; box-sizing: border-box; cursor: pointer; transition: .15s ease-in-out;}
.filter-item .custom-option .flag                   {display: block; width: 0.95em; height: 0.95em; position: relative; top: -0.02em;}
.filter-item .custom-option:not(:last-child)        {border-bottom: solid 1px rgba(255,255,255,0.15);}
.filter-item .custom-option:hover,
.filter-item .custom-option.selected                {color: var(--color0); background: rgba(0,0,0,0.05);}
.filter-item .custom-option.selected                {font-weight: 700;}
.filter-item .custom-options .reset                 {display: inline-block; font-size: 0.75em; color: #999999; text-decoration: underline; font-weight: 700; float: right; margin: 0.2em 0.9em 0.8em 0; transition: .15s ease-in-out;}
.filter-item .custom-options .reset:hover           {color: var(--color1); text-decoration-color: transparent;}
.filter-item .checkbox                              {display: flex; height: var(--filter-item-height); align-items: center;}

.filters1                                           {display: flex; width: 100%; flex-wrap: wrap; gap: 1em 4%; margin-top: var(--gap2); box-sizing: border-box;}
  @media screen and (max-width: 1080px)             {
  .filters1                                         {}
  }
  @media screen and (min-width: 961px) and (max-width: 1080px){
  .filters1                                         {font-size: 0.9em;}
  }
  @media screen and (max-width: 960px)              {
  .filters1 .filter-item                            {width: 48%;}
  }
  @media screen and (min-width: 441px)              {
  .filters1                                         {background: var(--color2b); padding: 1.3em 1.5em; border-radius: 0.3em 1.6em;}
  }

.chk1:not(:checked),
.chk1:checked                                   {position: absolute; left: -9999px;}
.chk1:not(:checked) + label,   
.chk1:checked + label                           {display: block; position: relative; text-align: left; font-size: 1em; color: #999999; font-weight: 500; line-height: 1.15; padding-inline-start: 1.35em; cursor: pointer; box-sizing: border-box; transition: .15s ease-in-out;}
.chk1:not(:checked) + label:hover               {color: var(--color0);}
.chk1:checked + label                           {color: var(--color0); font-weight: 700;}
.chk1:not(:checked) + label:before,
.chk1:checked + label:before                    {display: block; width: 0.9em; height: 0.9em; border-radius: 0.2em; position: absolute; left: 0; top: 0.15em; overflow: hidden; content: "";}
.chk1:not(:checked) + label:before              {background-color: rgba(0,0,0,0.12);}
.chk1:checked + label:before                    {background: URL('images/check.svg') no-repeat center center, var(--color0); background-size: 100% 100%;}
.chk1:disabled + label,                  
.chk1:disabled + label:before                   {opacity: 0.4;}

.padding-inline                                 {padding-inline: var(--padding1); box-sizing: border-box;}

.hero                                           {height: 38rem; padding-top: var(--header-height); align-items: flex-end;
                                                 --hero-nav-padding: 2rem;
                                                 --hero-specs-width: 17rem;
                                                }
.hero-img {
    display: block;
    height: auto;
    position: relative;
    z-index: 1;
}

    .hero-img img {
        display: block;
        height: auto;
    }
.hero > img                                     {display: block; height: auto; position: relative; z-index: 1;}
.hero:after                                     {display: block; opacity: 0.03; position: absolute; inset: 0; z-index: 2; background-image: url("images/cross-black-outline.svg"), url("images/cross-black-outline.svg"); background-repeat: no-repeat; background-size: min(20em, 30vw) auto, min(30em, 45vw) auto; content: "";}
.hero .wrapper                                  {height: 100%; align-items: flex-end; align-content: flex-end; position: relative; z-index: 3; }
.hero .content                                  {display: flex; flex-direction: column; align-items: flex-start; gap: 0.8em;}
.hero .content > span                           {display: block; font-size: min(1.7rem, 5vw); color: var(--color1); font-weight: 700;}
.hero .content h1                               {width: 9em; font-size: min(3.6rem, calc(1rem + 4vw)); margin: -0.2em -0.04em 0 -0.04em;}
.hero .content .button                          {font-size: 1.15em;}

.hero-specs                                     {display: block; width: var(--hero-specs-width); box-sizing: border-box;}
.hero-specs ul                                  {display: block; width: 100%; margin: 0; padding: 0;}
.hero-specs ul li                               {display: block; width: 100%;}
.hero-specs ul li a                             {display: flex; width: 100%; height: 2.4em; align-items: center; gap: 0.5em; font-size: 1em; font-weight: 700; line-height: 1.1; text-decoration: none; padding-inline: var(--hero-nav-padding); box-sizing: border-box; cursor: pointer; transition: .15s ease-in-out;}
.hero-specs ul li a img                         {display: block; width: 1.15em; height: 1.15em;}
.hero-specs ul li a svg                         {display: block; width: 0.4em; height: 0.4em; fill: var(--color0); transform: rotate(-90deg); transition: .15s ease-in-out;}
.hero-specs ul li a:hover                       {color: var(--color1);}
.hero-specs ul li a:hover svg                   {fill: var(--color1);}
.hero-specs ul li a.sel                         {background: white;}

.hero-nav                                       {display: block; width: 100%; height: calc(100% + 3rem); opacity: 0; transform: translateX(-9999px); background: white; border-radius: var(--border-radius1) var(--border-radius1) var(--border-radius1) var(--border-radius2); outline: solid 1px rgba(0,0,0,0.05); box-shadow: 0 0 0.75em rgba(0,0,0,0.07); overflow: hidden; box-sizing: border-box; position: absolute; top: 0; z-index: 5; transition: opacity .3s ease-in-out;}
.hero-nav .inner                                {display: flex; width: 100%; height: 100%;}
.hero-nav .close                                {display: block; width: 1.4em; height: 1.4em; background: var(--color2b); border: solid 0.1em var(--color1); box-sizing: border-box; border-radius: 0.25em; position: absolute; z-index: 3; cursor: pointer; transition: .15s ease-in-out;}
.hero-nav .close:before, 
.hero-nav .close:after                          {display: block; width: 60%; height: 0.12em; background: var(--color0); position: absolute; left: 20%; top: calc(50% - 0.06em); content: "";}
.hero-nav .close:before                         {transform: rotate(45deg);}
.hero-nav .close:after                          {transform: rotate(-45deg);}
.hero-nav .close:hover                          {border-color: var(--color0);}
.hero-nav .menu                                 {display: block; overflow-y: auto; position: relative; z-index: 2;}
.hero-nav .menu > div                           {display: flex; width: 100%; min-height: 100%; align-items: flex-end; align-content: flex-end; flex-wrap: wrap; gap: 0.8em; background: var(--color2b); box-sizing: border-box;}
.hero-nav .menu :is(.menu-title, .filters)      {padding-inline: var(--hero-nav-padding); box-sizing: border-box;}
.hero-nav .menu > div .menu-title               {display: block; width: 100%; font-size: 1.8em; font-weight: 700; line-height: 1.1;}
.hero-nav .menu .filters                        {display: flex; width: 100%; flex-direction: column;}
.hero-nav .menu .filters .filter-item           {width: 100%;}
.hero-nav .results                              {display: block; padding-inline: 1.5rem; box-sizing: border-box; overflow-y: auto;}
.hero-nav .results-specs                        {display: flex; width: 100%; max-width: 50rem; justify-content: space-between; flex-wrap: wrap; gap: 2.5rem 4%; margin-inline: auto; padding-block: calc(1rem + 3%); box-sizing: border-box;}
.hero-nav .results-specs > *                    {width: 100%;}
  @media screen and (min-width: 1081px)         {
  .hero:after                                   {background-position: left calc(50vw + 14rem) top -2.5em, right calc(50vw + 16rem) bottom 1rem;}
    .hero-img {
        width: 68rem;
        position: absolute;
        left: calc(50vw - 12rem);
        bottom: 0;
        -webkit-mask-size: contain;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-position: center center;
        ;
        mask-size: contain;
        mask-repeat: no-repeat;
        mask-position: center center;
        -webkit-mask-image: linear-gradient(to right, transparent, black 60%);
        mask-image: linear-gradient(to right, transparent, black 60%);
    }

        .hero-img img {
            width: 100%;
        }
  .hero .content                                {margin-left: 2rem;}
  .hero .content .img                          {display: none;}
  .hero-nav .results-specs > *                  {width: 48%;}
  }
  @media screen and (max-width: 1080px)         {
  .hero                                         {height: auto; max-height: unset;}
  .hero:after                                   {background-position: right -1rem top -1rem, left -2rem bottom 2rem;}
  .hero .wrapper                                {height: auto;}
    .hero-img {
        display: none;
    }

    .hero .content .img {
        display: block;
        width: 100%;
        height: auto;
        margin-block: 0;
    }

        .hero .content .img img {
            display: block;
            width: 100%;
            height: auto;
            -webkit-mask-size: contain;
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-position: center center;
            mask-size: contain;
            mask-repeat: no-repeat;
            mask-position: center center;
            -webkit-mask-image: linear-gradient(to top, transparent, black 35%);
            mask-image: linear-gradient(to top, transparent, black 35%);
        }
  .hero-nav .results-specs                      {max-width: 26rem;}
  }
  @media screen and (min-width: 769px) and (max-width: 1080px){
  .hero .content                                {width: 55vw;}
    .hero .content .img {
        width: 105vw;
        position: relative;
        left: -16rem;
    }
  }
  @media screen and (min-width: 769px)          {
  .hero-specs.hs1                               {margin-left: calc(0px - var(--hero-nav-padding));}
  .hero-specs.hs1, .hero .content               {position: relative; bottom: -3rem;}
  .hero-specs.hs1                               {padding-bottom: 3rem;}
    .hero .content h1 {
        margin-bottom: 3rem;
    }
 
  .hero-nav .menu > div                         {padding-top: 3rem;}
  }
@media screen and (min-width: 1801px) {
    .hero-specs.hs1 {
        padding-bottom: 2rem;
    }
}
  @media screen and (max-width: 768px)          {
    .hero .content {
        width: 100%;
    }

        .hero .content .img {
            width: 130%;
            position: relative;
            left: -2%;
        }
  .hero-specs.hs1                               {width: 100%; order: 2; margin-top: 1rem;}
  .hero-specs.hs1 ul                            {display: flex; flex-wrap: wrap; gap: 0 1.4em;}
  .hero-specs.hs1 ul li                         {width: auto;}
  .hero-specs.hs1 ul li a                       {width: auto; height: 2em; padding: 0;}
  }
  @media screen and (min-width: 641px)          {
  .hero-nav                                     {width: calc(100% + 2 * var(--hero-nav-padding)); left: calc(0px - var(--hero-nav-padding));}
  .hero-nav .close                              {left: 1em; top: 1em;}
  .hero-nav .menu                               {width: var(--hero-specs-width);}
  .hero-nav .menu .filters .filter-item:last-child .filter-type
                                                {border: none;}
  .hero-nav .menu .hero-specs                   {padding-bottom: 3rem;} 
  .hero-nav .results                            {width: calc(100% - var(--hero-specs-width)); height: 100%;}
  }
  @media screen and (max-width: 640px)          {
  .hero                                         {overflow: visible;}
  .hero .content                                {overflow: hidden;}
  .hero-nav                                     {height: calc(100vh - 7rem);}
  .hero-nav .close                              {right: 1em; top: 1em;}
  .hero-nav .inner                              {flex-direction: column;}
  .hero-nav .menu                               {width: 100%; flex-shrink: 0; overflow-y: visible;}
  .hero-nav .menu :is(.menu-title, .filters, .hero-specs, .hero-nav .results)
                                                {padding-inline: 1.2rem;}
  .hero-nav .menu .menu-title                   {margin-top: 1rem;}
  .hero-nav .menu .filters                      {flex-direction: row; align-items: flex-end; gap: 0.6em 4%;}
  .hero-nav .menu .filter-item                  {width: 48%; min-width: unset;}
  .hero-nav .menu .hero-specs                   {width: 100%; padding-bottom: 1rem; box-sizing: border-box;}
  .hero-nav .menu .hero-specs ul                {display: flex; flex-wrap: wrap; gap: 0 4%;}
  .hero-nav .menu .hero-specs ul li             {width: 48%;}
  .hero-nav .menu .hero-specs ul li a           {padding-inline: 0.8em;}
  .hero-nav .menu .hero-specs ul li a span      {display: block; flex-grow: 2;}
  .hero-nav .results                            {width: 100%; flex-shrink: 5;}
  }
  @media screen and (max-width: 540px)          {
  .hero-nav .menu .hero-specs                   {font-size: 0.85em;}
  }
  @media screen and (max-width: 400px)          {
  .hero-nav .menu .hero-specs ul li             {width: 100%;}
  }

.hero-nav.show                                  {opacity: 1; transform: none;}
.hero-nav.hide                                  {opacity: 0;}

.special-info                                   {display: flex; width: 100%; align-items: center; position: relative;}
.special-info > div                             {display: flex; align-items: center; gap: 1.2em; border: solid 0.2em var(--color1); padding: min(3em, calc(1.2em + 3vw)); border-radius: var(--border-radius1) var(--border-radius2); box-sizing: border-box;}
.special-info > div h2                          {padding: 0;}
.special-info > div img                         {display: block; width: 3.6em; height: auto;}
.special-info > div > div                       {display: block;}
  @media screen and (min-width: 1801px)         {
  .special-info > div                           {width: 50%;}
  }
  @media screen and (max-width: 1800px)         {
  .special-info > div                           {margin-right: calc(0px - 50vw + 50%); border-right: none; border-top-right-radius: 0; border-bottom-right-radius: 0;}
  }
  @media screen and (min-width: 1081px) and (max-width: 1800px){
  .special-info > div                           {width: 50vw;}
  }
  @media screen and (min-width: 1081px)         {
  .special-info                                 {justify-content: flex-end;}
  .special-info h2                              {display: flex; width: 10em; height: 100%; align-items: center; text-align: right; font-size: 2.7rem; position: absolute; right: 55%; top: 0;}
  .special-info p                               {max-width: 16em; font-size: min(1.45rem, calc(0.3rem + 5vw));}
  }
  @media screen and (max-width: 1080px)         {
  .special-info                                 {flex-wrap: wrap;}
  .special-info > div                           {width: calc(50% + 50vw);}
  .special-info > div > div                     {padding-right: 1.5em; box-sizing: border-box;}
  .special-info h2                              {font-size: min(1.6rem, calc(0.2rem + 4vw)); margin-bottom: 0.2em;}
  }
  @media screen and (max-width: 640px)          {
  .special-info > div                           {align-items: flex-start;}
  .special-info > div img                       {width: calc(0.7rem + 8vw);}
  .special-info h2                              {width: 9em;}
  }

.swiper                                         {width: 100%;}
.swiper-slide                                   {display: flex; height: auto; position: relative; overflow: hidden; flex-shrink: 0;}

.swiper-button                                  {display: flex; width: var(--swiper-button-width); height: calc(var(--swiper-button-width) / 1.8); justify-content: center; align-items: center; background: var(--color1); font-size: 1em; border-radius: 0.2em 1em 0.2em 0.2em; position: absolute; top: calc(50% - var(--swiper-button-width) / 3.6); z-index: 100; margin: 0; cursor: pointer; transition: .15s ease-in-out;}                                
.swiper-button:before                           {display: block; width: 0.6em; height: 0.6em; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M191.5,414.4c35.5,47.6,93.6,47.6,129.1,0l172.8-231.8c35.5-47.6,15.9-86.6-43.4-86.6H62.1c-59.4,0-78.9,39-43.4,86.6 L191.5,414.4z' fill='white' stroke='none' stroke-width='0' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center center; background-size: contain; content: ""; transform: rotate(-90deg);}
.swiper-button-prev                             {transform: rotate(180deg);}
.swiper-button:after                            {display: none;}
.swiper-button-disabled                         {opacity: 0.6 !important;}
.swiper-button:hover                            {background: var(--color1b);}

.carousel                                       {display: flex; width: 100%; justify-content: center; flex-wrap: wrap; gap: var(--gap1); position: relative; box-sizing: border-box;}
.carousel .swiper-slide > *                     {width: 100%;}
.carousel .swiper-button-prev                   {left: -1rem;}
.carousel .swiper-button-next                   {right: -1rem;}
  @media screen and (max-width: 680px)          {
  .carousel .swiper                             {width: 100vw; margin-inline: calc(50% - 50vw); padding-inline: var(--wrapper-side) 20vw; box-sizing: border-box;}
  .carousel .swiper-slide                       {opacity: 0.25; transition: opacity .25s ease-in-out;}
  .carousel .swiper-slide-active                {opacity: 1;}
  .carousel .swiper-button-prev                 {left: calc(15vw + 1rem);}
  .carousel .swiper-button-next                 {right: calc(15vw + 1rem);}
  }

.carousel .controls                             {display: flex; width: 100%; justify-content: flex-end; align-items: center; gap: 0.25em; margin-top: var(--gap1); padding-right: var(--padding1); box-sizing: border-box;}
.carousel .controls .swiper-button              {position: relative; inset: auto;}
.carousel .controls .link                       {display: block; font-size: 1.1em; color: #999999; text-decoration: underline; margin-right: 1em; transition: .15s ease-in-out;}
.carousel .controls .link:hover                 {color: var(--color1); text-decoration-color: transparent;}
  @media screen and (min-width: 1081px)         {
  .carousel .controls                           {width: auto; margin-top: 0; position: absolute; right: 0; top: calc(-2.2rem - var(--gap1));}
  }

.icons-info                                     {display: flex; width: 100%; align-items: center; flex-wrap: wrap; gap: 0.1em 1.2em; position: relative;}
.icons-info > *                                 {display: flex; align-items: flex-start; gap: 0.35em; font-size: 1em; color: #666666;}
.icons-info > * img                             {display: block; width: auto; height: 1em; position: relative; top: 0.1em;}
.icons-info > * a                               {color: inherit; text-decoration: underline; transition: .15s ease-in-out;} 
.icons-info > * a:hover                         {color: var(--color1); text-decoration-color: transparent;}

.preview                                        {display: flex; width: 100%; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; gap: 0.8rem;}
.preview .img                                   {display: block; width: 100%; padding-top: 66.66%; border-radius: 0.5rem 0.5rem 0.5rem var(--border-radius2); overflow: hidden; position: relative; transition: .15s ease-in-out;}
.preview .img span                              {display: block; position: absolute; inset: 0; transition: .15s ease-in-out;}
.preview .img span img                          {display: block; width: 100%; height: 100%; object-fit: cover;}
.preview .img span:hover                        {opacity: 0.85;}
.preview > div                                  {display: flex; width: 100%; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; gap: 0.5rem; padding-left: var(--padding1); box-sizing: border-box;}
.preview .icons-info                            {font-size: 0.9em; margin-block: -0.2em;}
.preview .title                                 {display: block; width: 100%; text-align: left; font-size: min(1.5rem, calc(0.6rem + 2vw)); font-weight: 700; line-height: 1.2;}
.preview .title a                               {color: var(--color0); transition: .15s ease-in-out;}
.preview .title a:hover                         {color: var(--color1);}
.preview .text                                  {display: block; width: 100%; text-align: left; font-size: 0.9em; color: #666666;}
.preview .specs-links                           {display: flex; width: calc(100% + 1em); flex-wrap: wrap; gap: 0.3em; margin: 0.35em -0.5em;}
.preview .specs-links a                         {display: flex; width: 100%; align-items: center; gap: 0.35em; font-size: 1em; line-height: 1.1; color: var(--color0); font-weight: 700; background: var(--color2b); padding: 0.4em 0.5em; outline: solid 0.08em transparent; border-radius: 0.25em; box-sizing: border-box; transition: .15s ease-in-out;}
.preview .specs-links a img                     {display: block; width: 1em; height: 1em;}
.preview .specs-links a span                    {display: block; flex-grow: 2;}
.preview .specs-links a svg                     {display: block; width: 0.4em; height: 0.4em; fill: var(--color0); transform: rotate(-90deg); transition: .15s ease-in-out;}
.preview .specs-links a:hover                   {color: var(--color1); background: transparent; outline-color: var(--color1);}
.preview .specs-links a:hover svg               {fill: var(--color1);}
.preview .specs-list                            {display: flex; width: calc(100% + 1em); flex-wrap: wrap; gap: 0.5em 0.8em; margin-block: 0.2em 0.6em;}
.preview .specs-list > div                      {display: flex; align-items: center; gap: 0.35em; font-size: 1em; line-height: 1.1; color: var(--color0); font-weight: 700; outline: solid 0.08em transparent; border-radius: 0.25em; box-sizing: border-box; transition: .15s ease-in-out;}
.preview .specs-list > div img                  {display: block; width: 1em; height: 1em;}
.preview .specs-list > div span                 {display: block; flex-grow: 2;}
.preview .links                                 {display: flex; width: 100%; gap: 0.2em 1em; box-sizing: border-box;}
.preview .info1                                 {display: flex; width: 100%; justify-content: space-between;}
.preview .info1 table                           {font-size: 0.85em; color: #999999;}
.preview .info1 table tr:not(:first-child) td   {padding-top: 0.1em;}
.preview .info1 table td:first-child            {padding-right: 1.4em;}
.preview .info1 table tr.today td               {color: var(--color0); font-weight: 700;}
.preview .info1 .links                          {width: 50%; flex-direction: column; align-items: flex-start; padding-left: calc(5% + 1rem); border-left: solid 1px var(--color2);}
.preview .link                                  {display: flex; align-items: center; gap: 0.45em; color: var(--color1); font-weight: 700; text-decoration: underline; transition: .15s ease-in-out;}
.preview .link svg                              {display: block; width: 0.4em; height: 0.4em; fill: var(--color1); transform: rotate(-90deg); position: relative; top: -0.025em; transition: .15s ease-in-out;}
.preview .link:hover                            {color: var(--color1b); text-decoration-color: transparent;}
.preview.p2 .title                              {font-size: min(2rem, calc(0.9rem + 2vw));}
.preview.p2 .icons-info                         {font-size: 1em;}
  @media screen and (min-width: 681px) and (max-width: 1080px){
  .preview .links                               {font-size: 0.85em;}
  .preview .info1 table                         {font-size: 0.8em; padding-right: 1rem;}
  .preview .info1 table td:first-child          {padding-right: 1em;}
  .preview .info1 .links                        {width: auto; padding-left: 1rem;}
  }
  @media screen and (max-width: 380px)          {
  .preview .links                               {font-size: 0.85em;}
  .preview .info1 table                         {font-size: 0.8em; padding-right: 0.6rem;}
  .preview .info1 table td:first-child          {padding-right: 0.8em;}
  .preview .info1 .links                        {width: 50%; padding-left: 1rem;}
  }  

.cta1                                           {background-color: var(--color2b);}  

.cta1 .decors                                   {display: block; position: absolute; inset: 0; content: "";}

.cta1 .decors:before, .cta1 .decors:after       {display: block; width: max(12rem, 30%); height: 4rem; background: var(--color1); position: absolute; content: "";}

.cta1 .decors:before                            {border-bottom-right-radius: 6rem; left: 0; top: -2.2rem;}

.cta1 .decors:after                             {border-top-left-radius: 6rem; right: 0; bottom: -2.2rem;}

.cta1 .wrapper                                  {justify-content: center;}

.cta1 .content                                  {display: flex; justify-content: center; flex-wrap: wrap; gap: 0.8em; position: relative; z-index: 3;}

.cta1 :is(h2, p, .button:not(:hover))           {text-align: center;}

.cta1 .content h2                               {margin: 0;}

.cta1 .content p                                {font-size: 0.9em;}

.cta1 .button                                   {margin-top: 0.4em;}

  @media screen and (min-width: 769px)          {

  .cta1                                         {background-image: url("images/cta1.webp?r=1"); background-repeat: no-repeat; background-position: center bottom; background-size: auto 90%;}

  .cta1 .decors                                 {background-image: linear-gradient(to top, var(--color0), transparent 60%);}

  .cta1 .content                                {width: min(44rem, 100%); margin-block: 13rem -2rem;}

  .cta1 :is(h2, p, .button:not(:hover))         {color: white; text-shadow: 0 0 0.4em rgba(0,0,0,0.3);}

  }

  @media screen and (max-width: 768px)          {

  .cta1                                         {}

  .cta1 .content                                {padding-top: calc(6rem + 15vw); background-image: url("images/cta1-mobile.webp?r=1"); background-repeat: no-repeat; background-position: center top; background-size: auto calc(6rem + 15vw);}

  }


.about-short                                    {display: flex; width: 100%; position: relative;}
.about-short .content                           {display: flex; flex-wrap: wrap; gap: 0.8em;}
.about-short .content img                       {display: block; width: 6em; margin-top: 0.2em;}
.about-short .content h2                        {margin: 0;}
.about-short .img                               {display: block; border-radius: var(--border-radius1) var(--border-radius2); overflow: hidden;}
.about-short .img img                           {display: block; width: 100%; height: 100%; object-fit: cover;}
  @media screen and (min-width: 1801px)         {
  .about-short .img                             {width: 50%;}
  }
  @media screen and (max-width: 1800px)         {
  .about-short .img                             {margin-left: calc(0px - 50vw + 50%); border-top-left-radius: 0; border-bottom-left-radius: 0;}
  }
  @media screen and (min-width: 1081px) and (max-width: 1800px){
  .about-short .img                             {width: 50vw;}
  }
  @media screen and (min-width: 1081px)         {
  .about-short                                  {justify-content: flex-end; margin-top: var(--section-padding);}
  .about-short .content                         {width: 42%; padding-block: 4em;}
  .about-short .img                             {height: 100%; position: absolute; right: 50%; top: 0;}
  }
  @media screen and (max-width: 1080px)         {
  .about-short                                  {flex-wrap: wrap;}
  .about-short .content                         {width: 100%;}
  .about-short .img                             {width: calc(50% + 50vw); height: 55vw; margin-block: var(--section-padding);}
  }

.why                                            {display: block; width: 100%;}

.why ul                                         {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: 0.8rem; margin: 1.4rem 0 0; padding: 0;}

.why ul li                                      {display: block; background: url("images/cross-white-outline.svg") no-repeat right -0.5em top -0.5em, var(--color2b); background-size: 10em auto; padding: 2.4em 2.5em 2.7em; box-sizing: border-box;}

.why ul li img                                  {display: block; width: 3.6em; height: auto; margin-bottom: 0.65em;}

  @media screen and (min-width: 1081px)         {

  .why ul li                                    {width: calc(25% - 0.6rem);}

  .why ul li:nth-child(odd)                     {border-radius: 0.5rem 3rem;}

  .why ul li:nth-child(even)                    {border-radius: 3rem 0.5rem; background-position: right -0.5em bottom -0.5em;}

  }

  @media screen and (max-width: 1080px)         {

  .why ul li                                    {width: calc(50% - 0.4rem); font-size: 0.95em;}

  .why ul li:nth-child(1),

  .why ul li:nth-child(4)                       {border-radius: 0.5rem 3rem;}

  .why ul li:nth-child(2),

  .why ul li:nth-child(3)                       {border-radius: 3rem 0.5rem;}

  .why ul li:nth-child(odd)                     {background-position: left -0.5em bottom -0.5em;}

  }

  @media screen and (max-width: 540px)          {

  .why ul li                                    {padding: 1.6em 1.4em 1.8em;}

  .why ul li:nth-child(1),

  .why ul li:nth-child(4)                       {border-radius: 0.4rem 2rem;}

  .why ul li:nth-child(2),

  .why ul li:nth-child(3)                       {border-radius: 2rem 0.4rem;}

  }


.about                                          {padding-block: 0;}
.about .bg                                      {display: block; position: absolute; inset: 0; z-index: -1; content: ""; overflow: hidden;}
.about .bg > div                                {display: block; width: 100%; height: 100%; position: absolute; top: 0; z-index: 1;} 
.about .bg > div > div                          {display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; background-image: linear-gradient(to top, var(--color0), var(--color0b)); overflow: hidden; position: absolute; top: 0; z-index: 1;} 
.about .bg > div > div img                      {display: block; width: 100%; height: 100%; object-fit: cover; transform: var(--skew-rev) scale(1.1); opacity: 0.1;}
.about .bg > div .clr1                          {display: block; width: 4em; height: 64%; background-image: linear-gradient(to top, var(--color1b), var(--color1)); position: absolute; right: -1em; top: 26%; z-index: -1;} 
.about .content                                 {align-items: center; align-content: center;}
.about .content > div                           {display: flex; width: 100%; justify-content: center; flex-wrap: wrap; gap: 1rem; container-type: inline-size; box-sizing: border-box;}
.about .content .left h2                        {color: white; font-weight: 500; line-height: 1.25; margin-bottom: -0.2em;}
.about .content .left h2 strong                 {display: block; font-weight: 700;}
.about .content .left span                      {display: block; width: 100%; font-size: 0.8em; color: white;}
.about .content .img                            {display: flex; justify-content: center; align-items: center;}
.about .content .img img                        {display: block; width: 100%; height: 100%; object-fit: contain;}
.about .content .right p                        {line-height: 1.15;}
  @media screen and (min-width: 1081px)         {
  .about .bg > div                              {width: 55%; height: 100%; right: 51.6%;}
  .about .content                               {justify-content: space-between;}
  .about .content .left                         {width: 28%;}
  .about .content .left h2                      {text-align: right; font-size: 6.4cqw;}
  .about .content .left span                    {text-align: right; font-size: 3.7cqw;}
  .about .content .right                        {width: 38%;}
  .about .content .right p                      {text-align: left; font-size: 7.4cqw;}
  .about .content .img                          {width: 20%; margin-block: -2.5rem;}
  }
  @media screen and (min-width: 1921px)         {
  .about .bg > div                              {width: 50rem; right: 51%;}
  }
  @media screen and (max-width: 1080px)         {
  .about .bg > div                              {height: 40%; right: 15vw;}
  .about .content                               {margin-top: 5rem;}
  .about .content .left                         {padding-inline: 15vw;}
  .about .content .left h2                      {font-size: min(2.4rem, 7cqw);}
  .about .content .img                          {width: 100%;}
  .about .content .img img                      {max-width: min(70%, 15rem);}
  .about .content .right p                      {font-size: 1.45rem;}
  .about .content .right p strong               {font-size: 1.8rem;}
  }

  @media screen and (max-width: 680px)          {
  .podcasts .swiper-slide-next                  {opacity: 1;}
  }

.preview-podcast                                {display: flex; width: 100%; justify-content: space-between; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; gap: 0.8rem;}
.preview-podcast .img                           {display: block; border-radius: 0.4rem 0.4rem 0.4rem 2rem; overflow: hidden; position: relative; transition: .15s ease-in-out;}
.preview-podcast .img span                      {display: block; position: absolute; inset: 0; transition: .15s ease-in-out;}
.preview-podcast .img span img                  {display: block; width: 100%; height: 100%; object-fit: cover;}
.preview-podcast .img span:hover                {opacity: 0.85;}
.preview-podcast > div                          {display: flex; width: 100%; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; gap: 0.5rem; box-sizing: border-box;}
.preview-podcast .title                         {display: block; width: 100%; text-align: left; font-size: min(1.2rem, calc(0.4rem + 2vw)); font-weight: 700; line-height: 1.2;}
.preview-podcast .title a                       {color: var(--color0); transition: .15s ease-in-out;}
.preview-podcast .title a:hover                 {color: var(--color1);}
.preview-podcast .link                          {display: flex; align-items: center; gap: 0.35em; color: var(--color0); font-weight: 500; text-decoration: underline; transition: .15s ease-in-out;}
.preview-podcast .link img                      {display: block; width: 1.2em; height: 1.2em;}
.preview-podcast .link:hover                    {color: var(--color1b); text-decoration-color: transparent;}
  @media screen and (min-width: 1081px)         {
  .preview-podcast .img                         {width: 40%; padding-top: 25%;}
  .preview-podcast > div                        {width: 55%;}
  }
  @media screen and (max-width: 1080px)         {
  .preview-podcast > *                          {width: 100%;}
  .preview-podcast .img                         {width: 10em; padding-top: 7em;}
  .preview-podcast > div                        {padding-left: var(--padding1);}
  }

.blog                                           {display: flex; width: 100%; flex-wrap: wrap; gap: 2.2rem 1.8rem; box-sizing: border-box;}
  @media screen and (min-width: 1081px)         {
  .blog .preview                                {width: calc(33.33% - 1.2rem);}
  }
  @media screen and (min-width: 641px) and (max-width: 1080px){
  .blog .preview                                {width: calc(50% - 0.9rem);}
  }

  .podcasts-list                                  {display: flex; width: 100%; flex-wrap: wrap; gap: 2.2rem 1.8rem; box-sizing: border-box;}

  @media screen and (min-width: 769px)          {

  .podcasts-list .preview-podcast               {width: calc(33.33% - 1.2rem);}

  }

  @media screen and (min-width: 381px) and (max-width: 768px){

  .podcasts-list .preview-podcast               {width: calc(50% - 0.9rem);}

  }

.contact-reception                              {display: flex; width: 100%; flex-wrap: wrap; gap: 1em 3em;}
.contact-reception > div                        {display: flex; flex-direction: column; align-items: flex-start; gap: 0.2em;}
.contact-reception > div > span                 {display: block;}
.contact-reception > div .title                 {font-size: 1.7em; font-weight: 700; margin-top: -0.2em;}
.contact-reception > div .contact               {display: flex; align-items: center; gap: 0.35em; font-size: 1.2em; color: var(--color0); transition: .15s ease-in-out;}
.contact-reception > div .contact .icon         {display: block; width: 1.2em; height: 1.2em; background: var(--color1); padding: 0.25em; border-radius: 100%; box-sizing: border-box;}
.contact-reception > div .contact .icon img     {display: block; width: 100%; height: 100%;}
.contact-reception > div .contact:hover         {color: var(--color1);}

.locations                                      {display: flex; width: 100%; flex-wrap: wrap; gap: 3rem 4%; box-sizing: border-box; margin-top: var(--gap2);}
  @media screen and (min-width: 961px)          {
  .locations .preview .specs-links a            {width: calc(50% - 0.15em);}
  }
  @media screen and (min-width: 681px)          {
  .locations .preview                           {width: 48%;}
  }
  @media screen and (max-width: 680px)          {
  .locations .preview .specs-links a            {width: calc(50% - 0.15em);}
  }

.about-head                                     {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: 1em 2em;}
.about-head .large                              {width: auto; font-size: min(1.8em, calc(0.9em + 2vw)) !important; line-height: 1.2;}
.about-head .submenu2                           {width: auto; margin-top: 0.5rem;}

.img-text                                       {display: flex; width: 100%; flex-wrap: wrap; gap: var(--gap3);}
.img-text > div                                 {display: flex; width: 100%; justify-content: space-between; gap: var(--gap1) 0;}
.img-text > div .content                        {display: flex; align-items: center; align-content: center; flex-wrap: wrap; gap: var(--gap1);}
.img-text > div .content ul                     {padding: 0;}
.img-text > div .img                            {display: flex;}
.img-text > div .img a                          {display: block; width: 100%; padding-top: 75%; position: relative; box-sizing: border-box; border-radius: var(--border-radius1) var(--border-radius2); overflow: hidden;}
.img-text > div .img a span                     {display: block; position: absolute; inset: 0;}
.img-text > div .img a span img                 {display: block; width: 100%; height: 100%; object-fit: cover;}
  @media screen and (min-width: 1081px)         {
  .img-text > div:nth-child(odd) .img           {margin-right: -4%;}
  .img-text > div:nth-child(even) .img          {margin-left: -4%;}
  }
  @media screen and (min-width: 769px)          {
  .img-text > div .content                      {width: 46%;}
  .img-text > div .img                          {width: 52%;}
  .img-text > div:nth-child(even) .img          {order: -1;}
  }
  @media screen and (min-width: 769px) and (max-width: 1080px){
  .img-text > div .img                          {width: 49%; align-items: flex-start;}
  }
  @media screen and (max-width: 768px)          {
  .img-text > div                               {flex-wrap: wrap;}
  .img-text > div :is(.content, .img)           {width: 100%;}
  .img-text > div .img                          {order: -1;}
  }

.cta2                                           {display: flex; width: 100%; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--gap1); padding: 1.5em 6%; border-radius: 0.4em 2.5em; border: solid 0.11em var(--color2);; box-sizing: border-box;}
.cta2 > *:not(.button)                          {font-size: 1.3em; color: var(--color0);}
  @media screen and (min-width: 769px)          {
  .cta2                                         {flex-wrap: nowrap;}
  .cta2 > *:not(.button)                        {max-width: 40rem;}
  }

.img-info1                                      {display: block; width: 100%; background: var(--color1); padding: var(--section-padding) var(--gap3); border-radius: var(--border-radius1) var(--border-radius2); overflow: hidden; position: relative; box-sizing: border-box;}
.img-info1 .wrapper                             {width: 100%;}
.img-info1 .img                                 {display: block; position: absolute; right: 0; top: 0;
                                                 -webkit-mask-size: contain; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center center; ; mask-size: contain; mask-repeat: no-repeat; mask-position: center center;
                                                }
.img-info1 .img img                             {display: block; width: 100%; height: 100%; object-fit: cover;}
.img-info1 .content                             {display: block;}
.img-info1 .content *                           {color: white; text-shadow: 0.1em 0.1em 0.3em rgba(0,0,0,0.2);}
.img-info1 .content h2                          {margin-bottom: 0.7rem;}
  @media screen and (min-width: 961px)          {
  .img-info1 .img                               {width: 70%; height: 100%;
                                                 -webkit-mask-image: linear-gradient(to left, black 50%, transparent); mask-image: linear-gradient(to left, black 50%, transparent);
                                                }
  .img-info1 .content                           {width: 50%; max-width: 30rem;}
  }
  @media screen and (max-width: 960px)          {
  .img-info1                                    {padding-inline: 10vw;}
  .img-info1 .img                               {width: 100%; height: calc(10rem + 20vw);
                                                 -webkit-mask-image: linear-gradient(to bottom, black 50%, transparent); mask-image: linear-gradient(to bottom, black 50%, transparent);  
                                                }
  .img-info1 .content                           {width: 100%; margin-top: calc(2rem + 20vw);}
  }

.team, .team .group                             {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: 1rem; margin-top: var(--gap2);}
.team { min-height:250px; }
.team h2                                        {margin-bottom: -1rem; padding-inline: var(--padding1);}
.team h2 + .group                               {margin-top: var(--gap1);}
.team h2:not(:first-of-type)                    {margin-top: var(--gap1);}
  @media screen and (min-width: 769px)          {
  .team .person-preview                         {width: calc(50% - 0.5rem);}
  }

.person-preview                                 {display: flex; width: 100%; justify-content: space-between; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; gap: 1em 0; border-radius: 2em 0.4em; border: solid 0.08em var(--color2); padding: 1.4em; box-sizing: border-box;}
.person-preview .img                            {display: block; width: 25%; aspect-ratio: 1; border-radius: 1em 0.2em; overflow: hidden;}
.person-preview .img img                        {display: block; width: 100%; height: 100%; object-fit: cover;}
.person-preview .img.icon                       {display: flex; width: 15%; justify-content: center; align-items: center; background: var(--color1);}
.person-preview .img.icon img                   {width: 1.5em; height: auto; object-fit: contain;}
.person-preview > div                           {display: flex; width: 100%; flex-wrap: wrap; gap: 0.5rem;}
.person-preview > div > span                    {display: block; width: 100%;}
.person-preview > div .name                     {font-size: 1.2em; font-weight: 700;}
.person-preview > div .post                     {font-size: 0.9em; color: var(--color1); margin-top: -0.55rem;}
.person-preview > div .icons-info               {font-size: 0.8em;}
.person-preview > div .lang                     {display: flex; width: 100%; align-items: center; flex-wrap: wrap; gap: 0.3em 1em;}
.person-preview > div .lang span                {display: flex; align-items: center; gap: 0.3em; font-size: 0.8em; font-weight: 700;}
.person-preview > div .lang span img            {display: block; width: 1em; height: 1em; position: relative; top: -0.03em;}
.person-preview > div .text                     {font-size: 0.85em; color: #999999;}
.person-preview > div .text-review              {font-style: italic;}
.person-preview > div .info                     {display: flex; width: 100%; align-items: center; flex-wrap: wrap; gap: 0.3em 1.2em;}
.person-preview > div .info span                {display: flex; align-items: center; gap: 0.3em; font-size: 0.9em; font-weight: 700;}
.person-preview > div .info span img            {display: block; width: 1em; height: 1em; top: -0.03em;}
.person-preview > div .link                     {display: block; font-size: 0.9em; color: var(--color1); font-weight: 700; text-decoration: underline; transition: .15s ease-in-out;}
.person-preview > div .link:hover               {color: var(--color1b); text-decoration-color: transparent;}
  @media screen and (min-width: 1081px)         {
  .person-preview > div                         {width: 70%;}
  .person-preview:has(.icon) > div              {width: 80%;}
  }
  @media screen and (min-width: 401px) and (max-width: 1080px){
  .person-preview .img                          {width: 30%;}
  .person-preview > div                         {width: 65%;}
  .person-preview:has(.icon) .img               {width: 3em;}
  .person-preview:has(.icon) > div              {width: calc(100% - 4em);}
  }
  @media screen and (max-width: 400px)          {
  .person-preview .img                          {width: 7em;}
  .person-preview:has(.icon) .img               {width: 3em;}
  }

.person-detail                                  {display: flex; width: 100%; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 1rem 0;}
.person-detail .img                             {display: block; width: 10rem; aspect-ratio: 1; padding: 0; border-radius: 0.5em 2.5em; overflow: hidden; margin-top: 0.1em;}
.person-detail .img img                         {display: block; width: 100%; height: 100%; object-fit: cover;}
.person-detail > div                            {display: flex; width: 100%; flex-wrap: wrap; gap: 0.5rem;}
.person-detail > div h1                         {width: 100% !important; margin-inline: 0 !important;}
.person-detail > div h2                         {font-size: min(1.7rem, calc(0.5rem + 4vw)); margin-bottom: -0.15em;}
.person-detail > div > span                     {display: block; width: 100%;}
.person-detail > div .post                      {font-size: 1.15em; color: var(--color1); font-weight: 700; margin-top: -0.4rem;}
.person-detail > div .lang                      {display: flex; width: 100%; align-items: center; flex-wrap: wrap; gap: 0.3em 1em;}
.person-detail > div .lang span                 {display: flex; align-items: center; gap: 0.3em; font-size: 0.9em; font-weight: 700;}
.person-detail > div .lang span img             {display: block; width: 1em; height: 1em; position: relative; top: -0.03em;}
.person-detail > div .text                      {font-size: 0.85em; color: #999999;}
.person-detail > div .info                      {display: flex; width: 100%; align-items: center; flex-wrap: wrap; gap: 0.3em 1.2em; margin-top: 0.25em;}
.person-detail > div .info span                 {display: flex; align-items: center; gap: 0.3em; font-size: 0.9em; font-weight: 700; border: solid 1px var(--color2); padding: 0.25em 0.6em; border-radius: 0.3em; box-sizing: border-box;}
.person-detail > div .info span img             {display: block; width: 1em; height: 1em; top: -0.03em;}
  @media screen and (min-width: 641px)          {
  .person-detail .img                           {width: 28%;}
  .person-detail > div                          {width: 68%;}
  }

.cols                                           {display: block; width: 100%;}
.cols .wrapper                                  {justify-content: space-between; flex-wrap: wrap; gap: var(--gap3);}
.cols .wrapper > div                            {display: flex; width: 100%; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; gap: var(--gap1);}
.cols .wrapper > div > *                        {width: 100% !important; margin-inline: 0 !important;}
  @media screen and (min-width: 1081px)         {
  .cols                                         {}
  .cols .wrapper > div                          {width: 45%;}
  }

.article                                        {display: flex; width: 100%; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; gap: var(--gap1);}
.article .image                                 {display: block; width: 100%; padding-top: 56%; position: relative; border-radius: var(--border-radius1) var(--border-radius2); overflow: hidden; transition: .15s ease-in-out;} 
.article .image span                            {display: block; position: absolute; inset: 0; transition: .15s ease-in-out;} 
.article .image span img                        {display: block; width: 100%; height: 100%; object-fit: cover;}
.article .image:hover                           {opacity: 0.8;}
.article :is(p, li)                             {line-height: 1.5;}
.article :is(p a, li a)                         {color: var(--color1);}
.article :is(p a, li a):hover                   {color: var(--color1b);}
.article :is(h2, h3)                            {margin-bottom: calc(0px - 0.5 * var(--gap1));}
.article h2                                     {font-size: min(2rem, calc(0.6rem + 4vw));}
.article h3                                     {font-size: min(1.35rem, calc(0.3rem + 4vw));}
.article .highlight                             {display: flex; width: 100%; align-items: flex-start; flex-wrap: wrap; gap: var(--gap1); padding: 1.5em 6%; border-radius: 0.4em 2.5em; border: solid 0.1em transparent; box-sizing: border-box; position: relative; overflow: hidden;}
.article .highlight > *                         {position: relative; z-index: 2;}
.article .highlight > *:first-child             {margin-top: 0 !important;}
.article .highlight.hg1                         {background: var(--color2b);}
.article .highlight.hg2                         {border-color: var(--color1);}
.article .highlight.hg3                         {border-color: var(--color2);}
.article .highlight.hg4                         {background: var(--color1);}
.article .highlight.hg4 *                       {color: white;}
.article .highlight.link                        {justify-content: space-between; align-items: center; flex-wrap: nowrap; gap: 0.4rem 1.2rem;}
.article .highlight.link > *                    {width: auto;}
.article .highlight.link > *:not(.button)       {font-size: 1.3em; color: var(--color0); font-weight: 700;}
.article p + :is(ul, ol),
.article > .icons-info                          {margin-block: calc(0px - 0.5 * var(--gap1));}
.article > .icons-info .specs-icon              {display: none;}  

      .article .quote                                 {display: flex; width: 100%; justify-content: space-between; gap: 1.2em 1em; background: var(--color2b); border-radius: 0.4em 2.5em; padding: 6%; box-sizing: border-box; margin-block: 0.5em 0.2em; position: relative;}

      .article .quote:after                           {display: block; width: 2.3rem; height: 2.3rem; background: url("images/quotes-white.svg") no-repeat center center, var(--color1); background-size: 50% auto; border-radius: 100%; overflow: hidden; position: absolute; left: 1.2rem; bottom: 1.2rem; content: "";}

      .article .quote > p                             {display: block; font-size: 1em; font-style: italic; margin-bottom: 3rem;}

      .article .quote > div                           {display: flex; width: 24em; flex-direction: column; align-items: flex-end; align-self: flex-end;}

      .article .quote > div img                       {display: block; width: 7em; height: auto; margin-bottom: 0.6em;}

      .article .quote > div span                      {display: block; text-align: right; font-size: 0.8em;}

      .article .quote > div span a                    {color: var(--color1); text-decoration: underline; transition: .15s ease-in-out;}

      .article .quote > div span a:hover              {color: var(--color1b); text-decoration-color: transparent;}

      .article .quote > div .name:before              {display: inline-block; margin-right: 0.3em; content: "říká";}

        @media screen and (max-width: 769px)          {

        .article .quote                               {flex-direction: column; padding: 10%;}

        .article .quote > *                           {width: 100%;}  

        .article .quote > p                           {font-size: 1.1em; margin: 0;}

        .article .quote > div                         {max-width: calc(100% - 3.5rem);}

        .article .quote > div span                    {font-size: 0.9em;}

        }

        @media screen and (min-width: 1081px)         {

        .article :is(h1, .article > .icons-info, .image, .highlight, .person-detail, .form, .vouchers, .locations, .gallery-grid, .gallery-slider, .quote),

        .breadcrumbs:has(+ .article)                  {width: 112%; margin-inline: -6%;}

        .article .icons-info .specs-icon              {display: flex; width: 4%; aspect-ratio: 1; justify-content: center; align-items: center; background: var(--color1); border-radius: 0.1em 0.1em 0.1em 0.5em; position: absolute; left: 0; top: calc(100% + var(--gap1) - 0.3em);}

        .article .icons-info .specs-icon img          {display: block; width: 60%; height: auto;}

        }

        @media screen and (max-width: 640px)          {

        .article .highlight.link                      {flex-wrap: wrap;}

        }

  @media screen and (min-width: 1081px)         {
  .article :is(h1, .article > .icons-info, .image, .highlight, .person-detail, .form, .vouchers, .locations, .gallery-grid, .gallery-slider),
  .breadcrumbs:has(+ .article)                  {width: 112%; margin-inline: -6%;}
  .article .icons-info .specs-icon              {display: flex; width: 4%; aspect-ratio: 1; justify-content: center; align-items: center; background: var(--color1); border-radius: 0.1em 0.1em 0.1em 0.5em; position: absolute; left: 0; top: calc(100% + var(--gap1) - 0.3em);}
  .article .icons-info .specs-icon img          {display: block; width: 60%; height: auto;}
  }
  @media screen and (max-width: 640px)          {
  .article .highlight.link                      {flex-wrap: wrap;}
  }

.article-styles ul, ol                          {display: flex; flex-wrap: wrap; gap: 0.2em; padding: 0 0 0 1em; margin: -0.15em 0 0;}
.article-styles ul li, ol li                    {padding-left: 1.6em; position: relative; box-sizing: border-box;}
.article-styles li:before                       {display: block; position: absolute; content: "";}
.article-styles ul li:before                    {width: 0.5em; height: 0.5em; left: 0; top: 0.48em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M191.5,414.4c35.5,47.6,93.6,47.6,129.1,0l172.8-231.8c35.5-47.6,15.9-86.6-43.4-86.6H62.1c-59.4,0-78.9,39-43.4,86.6 L191.5,414.4z' fill='rgb(181,144,34)' stroke='none' stroke-width='0' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center center; background-size: contain; content: ""; transform: rotate(-90deg);}
.article-styles ol                              {list-style-type: none; counter-reset: li;}
.article-styles ol li                           {counter-increment: li;}
.article-styles ol li:before                    {color: var(--color1); font-weight: 700; left: -0.05em; top: 0; content: counter(li)".";}
.article-styles ul li,
.article-styles ol li                           { width:100%; }

.article-styles .embed                          {display: block; width: 100%; background: white; border-radius: var(--border-radius); overflow: hidden;}
.article-styles .embed iframe                   {display: block; width: 100%;}

.gallery-slider .swiper-slide a                 {display: block; width: 100%; padding-top: 75%; position: relative; overflow: hidden; transition: .15s ease-in-out;}
.gallery-slider .swiper-slide:nth-child(odd) a  {border-radius: 0.6em 1.5em;}
.gallery-slider .swiper-slide:nth-child(even) a {border-radius: 1.5em 0.6em;}
.gallery-slider .swiper-slide a span            {display: block; position: absolute; inset: 0;}
.gallery-slider .swiper-slide a span img        {display: block; width: 100%; height: 100%; object-fit: cover;}
.gallery-slider .swiper-slide a:hover           {opacity: 0.85;}
  @media screen and (max-width: 680px)          {
  .gallery-slider .swiper                       {padding-inline: 3rem;}
  .carousel .swiper-button-prev                 {left: 0;}
  .carousel .swiper-button-next                 {right: 0;}
  }

.gallery-grid                                   {display: flex; width: 100%; flex-wrap: wrap; gap: 0.6rem;}
.gallery-grid .img                              {display: block; width: calc(50% - 0.3rem); border-radius: 0.6em 1.5em; overflow: hidden;}
.gallery-grid .img a                            {display: block; width: 100%; padding-top: 75%; position: relative; transition: .15s ease-in-out;}
.gallery-grid .img a span                       {display: block; position: absolute; inset: 0;}
.gallery-grid .img a span img                   {display: block; width: 100%; height: 100%; object-fit: cover;}
.gallery-grid .img a:hover                      {opacity: 0.85;}
  @media screen and (min-width: 769px)          {
  .gallery-grid .img                            {width: calc(33.33% - 0.4rem);}
  }

.file-items                                     {display: flex; width: 100%; flex-wrap: wrap; gap: 0.3em;}

.file-box                                       {display: flex; width: 100%; justify-content: space-between; align-items: flex-start; gap: 0.4em 1.2em; padding: 1em 4% 0.95em; border: solid 0.08em var(--color2); border-radius: 2em 0.3em; box-sizing: border-box;}
.file-box img                                   {display: block; width: 1.1em; height: auto; position: relative; top: 0.02em;}
.file-box > span                                {display: block; font-size: 1em; line-height: 1.2;}
.file-box .title                                {font-weight: 700; flex-grow: 2; margin-left: -0.7em;}
.file-box .title a                              {color: var(--color0); transition: .15s ease-in-out;}
.file-box .title a:hover                        {color: var(--color1);}
.file-box .info                                 {color: #999999;}
.file-box .link                                 {color: var(--color1); font-weight: 700; text-decoration: underline; transition: .15s ease-in-out;}
.file-box .link:hover                           {color: var(--color1b); text-decoration-color: transparent;}
  @media screen and (min-width: 960px)          {
  .file-box                                     {width: 108%; margin-inline: -4%;}
  }
  @media screen and (max-width: 768px)          {
  .file-box                                     {justify-content: flex-end; flex-wrap: wrap; border: 1.5em 0.3em; padding-inline: 1.5rem;}
  .file-box img                                 {width: 1.25em;}
  .file-box .title                              {width: calc(100% - 1.8rem); font-size: 1.15em;}  
  }

.ins-companies                                  {display: block; width: 100%;}
.ins-companies p                                {display: flex; width: 100%; justify-content: space-between; align-items: flex-start; box-sizing: border-box;}
.ins-companies p:not(:last-child)               {padding-bottom: 0.3em; margin-bottom: 0.6em; border-bottom: solid 1px var(--color2);}
.ins-companies p .num                           {display: block; width: 3.6rem; font-size: 1.3em; color: var(--color1); position: relative; top: -0.26em;} 
.ins-companies p span:nth-child(2)              {display: block; width: calc(100% - 3.6rem);}
.highlight.benefit img                          {width: 5rem;}
  @media screen and (min-width: 541px)          {
  .highlight.benefit p                          {width: calc(94% - 5rem);}
  }

.logos                                          {display: flex; width: 100%; column-gap: 1.4em; row-gap: 0.7em; flex-wrap: wrap; margin-top: var(--margin-top-l);}
.logos a                                        {display: block; height: 3em; width: auto;}
.logos a img                                    {display: block; height: 100%; width: auto;}


.form                                           {display: flex; flex-wrap: wrap; gap: var(--form-gap); --form-gap: 1.2rem; background: var(--color2b); border-radius: 0.3em 2em; padding: calc(0.5rem + 5vw); box-sizing: border-box;}
.form-items                                     {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: var(--form-gap);}
.form-bottom                                    {display: flex; width: 100%; justify-content: flex-end; align-items: flex-start; flex-wrap: wrap; gap: 0.5em 1em;}
.form-bottom .consent                           {display: block; width: 100%; font-size: 0.85em; color: #666666;}
.form-bottom .consent a                         {color: inherit; text-decoration: underline; transition: .15s ease-in-out;}
.form-bottom .consent a:hover                   {color: var(--color0); text-decoration-color: transparent;}
  @media screen and (min-width: 1081px)         {
  .form                                         {padding: 6%;}
  }
  @media screen and (min-width: 961px)          {
  .form-bottom .consent                         {max-width: 26rem; text-align: right;}
  }
  @media screen and (min-width: 641px)          {
  .form .form-item                              {width: calc(50% - 0.5 * var(--form-gap));}
  }

.form-item                                      {display: flex; width: 100%; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; position: relative; border-bottom: solid 0.1em var(--color2); --form-item-height: 3.2rem;}
.form-item :is(input, textarea, .custom-select2){display: block; width: 100%; height: var(--form-item-height); background: none; font-size: 1em; color: var(--color0); font-weight: 700; border: none; border: none; outline: none; padding: 0.95em 0 0.3em; box-sizing: border-box; position: relative; z-index: 2; font-family: var(--font1); transition: .15s ease-in-out;}
.form-item textarea                             {height: 8em !important;}
.form-item:focus-within                         {border-color: var(--color1);}
.form-item label                                {display: block; font-size: 0.75em; font-weight: 700; color: var(--color1); position: absolute; left: 0; top: 0; transition: .15s ease-in-out;}
.form-item:has(textarea, .file-upload)          {width: 100% !important;}
.form-item :is(input, textarea)::placeholder    {font-weight: 400; color: #999999;}
.form-item:has(label.file-upload)               {border: none;}
.form-item label.file-upload                    {display: flex; width: 100%; height: 2em !important; justify-content: center; align-items: center; gap: 0.5em; font-size: 1em; color: var(--color0); font-weight: 500; text-decoration: underline; padding: 0.95em; border-radius: var(--border-radius); border: dotted var(--color1) 0.12em; margin: 0; position: relative; inset: auto; box-sizing: border-box; cursor: pointer; transition: .15s ease-in-out;}
.form-item label.file-upload img                {display: block; width: 1.1em; height: auto}
.form-item label.file-upload:hover              {color: var(--color1); text-decoration-color: transparent;}
.form-item label.file-upload input[type="file"] {width: 100%; height: 100%; position: absolute; top: 0; left: 0; opacity: 0; cursor: pointer;}
.form-item label.file-upload .file-name         {display: none;}

.form-item:has(.custom-select2)                 {position: relative; z-index: 5;}
.custom-select2                                 {position: relative; height: 100%;}
.custom-select2 select                          {position: absolute; left: -9999px;}
.custom-select2 .sel                            {display: block; width: 100%; height: var(--form-item-height); font-size: 1em; color: #999999; font-weight: 400; line-height: 1.2; letter-spacing: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0.3em 2em 0 0; box-sizing: border-box; cursor: pointer; position: absolute; top: calc(50% - 0.58em); z-index: 2; transition: .2s ease-in-out;}
.custom-select2 .sel:hover                      {color: var(--color1);}
.custom-select2 .sel.selected                   {color: var(--color0); font-weight: 700;}
.custom-select2 > svg                           {display: block; width: 0.65em; fill: var(--color1); position: absolute; right: 0; top: calc(50% - 0.1em); z-index: 1;}
.custom-select2 .dropdown                       {display: none; width: calc(100% + 2px); background: white; box-shadow: 0 0 0.25em rgba(0,0,0,0.10); border-radius: 0.6em; overflow: hidden; box-sizing: border-box; margin-top: 0.2em; position: absolute; left: -1px; top: var(--form-item-height); z-index: 8;}
.custom-select2 .dropdown .inner                {display: flex; width: 100%; max-height: 16em; flex-wrap: wrap; gap: 0.6rem; --dropdown-padding: 1rem; overflow-y: auto;}
.custom-select2 .inner ul                       {display: block; width: 100%; padding: 0 !important;}
.custom-select2 .inner ul li                    {display: flex; width: 100%; min-height: 2em; align-items: center; font-size: 1em; font-weight: 400; line-height: 1.1em; letter-spacing: 0; color: #666666; border-top: solid 1px rgba(0,0,0,0.1); padding: 0.65em 2em 0.65em 1em; position: relative; box-sizing: border-box; cursor: pointer; transition: .15s ease-in-out;}
.custom-select2 .inner ul li:before             {display: none;}
.custom-select2 .inner ul li:after              {display: block; width: 0.6em; height: 0.6em; opacity: 0.5; position: absolute; right: 0.9em; top: calc(50% - 0.3em); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpolygon points='254.5,271 81.3,97.7 0,179 254.5,433.5 509,179 427.7,97.7' width='1' height='1' fill='black' stroke='white' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center center; content: ""; transform: rotate(-90deg); transition: .15s ease-in-out;}
.custom-select2 .inner ul li:hover              {color: var(--color0); background: rgba(0,0,0,0.04);}
.custom-select2 .inner ul li:hover:after        {opacity: 0.9;}

.files                                          {display: flex; width: 100%; flex-wrap: wrap; gap: 0.15em; margin-top: 0.35em;}
.files .file-item                               {display: block; width: 100%; font-size: 0.8em; color: var(--color0); font-weight: 600; background: white; padding: 0.5em 2.5em 0.4em 0.9em; position: relative; box-sizing: border-box; border-radius: var(--border-radius); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.files .file-item .delete-btn                   {display: block; width: 1.4em; height: 1.4em; opacity: 0.5; border-radius: 100%; background: none; border: none; outline: none; position: absolute; right: 0.75em; top: 0.45em; cursor: pointer; transform: rotate(45deg); transition: .15s ease-in-out;}
.files .file-item .delete-btn:after             {display: block; position: absolute; inset: 0; content: ""; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpolygon points='386,229 283,229 283,126 229,126 229,229 126,229 126,283 229,283 229,386 283,386 283,283 386,283' width='1' height='1' fill='black' stroke='transparent' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center center;}
.files .file-item .delete-btn:hover             {opacity: 1;}
.files:not(:has(.file-item))                    {display: none;}

.vouchers                                       {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: 2em 1.6em; margin-block: var(--gap1);}
  @media screen and (min-width: 641px)          {
  .vouchers .voucher                            {width: calc(50% - 0.8em);}
  }

.voucher                                        {display: flex; width: 100%; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; gap: 0.5em;}
.voucher .img                                   {display: block; width: 100%; padding-top: 56%; position: relative; border-radius: 0.3em 2em; overflow: hidden;}
.voucher .img a                                 {display: block; position: absolute; inset: 0; transition: .15s ease-in-out;}
.voucher .img a img                             {display: block; width: 100%; height: 100%; object-fit: cover;}
.voucher .img a[href]:hover                     {opacity: 0.8;}
.voucher .img .tag                              {display: block; font-size: 1em; color: white; font-weight: 700; background: var(--color1); padding: 0.5em 1.7rem; border-radius: 0 2em 0 0; position: absolute; left: 0; bottom: 0; z-index: 1;}
.voucher > div                                  {display: flex; width: 100%; justify-content: space-between; align-items: center; align-content: flex-start; flex-wrap: wrap; gap: 0.5em; box-sizing: border-box;}
.voucher .title                                 {display: block; width: 100%; font-size: 1.4em; font-weight: 700;}
.voucher .price                                 {display: block; text-align: right; font-size: 1.25em; color: var(--color1); font-weight: 700;}
  @media screen and (min-width: 1081px)         {
  .voucher > div                                {padding-left: 1.7rem;}
  }

.selected-items                                 {display: flex; width: 100%; flex-wrap: wrap; gap: 0.3em;}
.selected-items > div                           {display: flex; width: 100%; align-items: center; gap: 1em; background: white; padding: 0.6em 1em; border-radius: 0.2em; box-sizing: border-box;}
.selected-items > div span                      {display: block; font-weight: 700;}
.selected-items > div .title                    {color: var(--color0); flex-grow: 2;}
.selected-items > div .price                    {color: var(--color1); text-align: right;}
.selected-items > div button                    {display: block; width: 1em; height: 1em; position: relative; transition: .15s ease-in-out;}
.selected-items > div button:before,
.selected-items > div button:after              {display: block; width: 100%; height: 0.2em; background: var(--color0); position: absolute; left: 0; top: calc(50% - 0.1em); content: "";}
.selected-items > div button:before             {transform: rotate(45deg);}
.selected-items > div button:after              {transform: rotate(-45deg);}
.selected-items > div button:hover              {opacity: 0.5;}

.contacts1                                      {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: var(--gap2) var(--gap1);}
.contacts1 .contact-reception                   {width: auto; flex-direction: column;}
.contacts1 .basic-contacts                      {display: flex; flex-direction: column; gap: 0.15em;}
.contacts1 .basic-contacts > span               {display: block; line-height: 1.2;}
.contacts1 .basic-contacts .title               {font-size: 1.3em; font-weight: 700;}
.contacts1 .basic-contacts .address             {margin-block: -0.15rem 0.6rem;}
.contacts1 .basic-contacts .small               {font-size: 0.75em; margin-top: 0.6rem;}
.contacts1 .soc                                 {display: flex; flex-direction: column; align-items: flex-start; gap: 0.25em 1.3em; margin-top: 0.15em;}
.contacts1 .soc a                               {display: flex; align-items: center; gap: 0.4em; color: var(--color0); transition: .15s ease-in-out;}
.contacts1 .soc a .icon                         {display: block; width: 1.4em; height: 1.4em; background: var(--color1); border-radius: 100%; padding: 0.25em; box-sizing: border-box;}
.contacts1 .soc a .icon img                     {display: block; width: 100%; height: 100%;}
.contacts1 .soc a:hover                         {color: var(--color1);}
  @media screen and (max-width: 768px)          {
  .contacts1 .soc                               {width: 100%; flex-direction: row; padding-top: var(--gap2); border-top: solid 1px var(--color2);}
  }
  @media screen and (min-width: 641px)          {
  .contacts1 .basic-contacts                    {width: 18rem;}
  }

.locations-contact                              {font-size: 0.9em; margin-block: var(--gap1);}
.locations-contact .icons-info                  {flex-direction: column; align-items: flex-start;}

.detail, .detail-hero                           {display: flex; width: 100%; flex-wrap: wrap; --detail-nav-height: 4.6rem; --detail-nav-fixed-height: 3.6rem; --padding1: 2.2rem;}
.detail-hero                                    {gap: var(--gap1); padding-bottom: var(--gap2);}
  @media screen and (min-width: 1081px)         {
  .detail, .detail-hero                         {width: calc(100% - 4rem); margin-inline: 2rem;}
  .detail-hero                                  {width: calc(100% + 4rem); margin-inline: -2rem;}
  }
  @media screen and (max-width: 640px)          {
  .detail, .detail-hero                         {--padding1: 1.8rem; --detail-nav-height: 3.6rem; --detail-nav-fixed-height: 2.8rem;}
  }

  .hp .message                                    {position: absolute; left: 0; top: var(--header-height);}

.message                                        {display: block; width: 100%; font-size: 0.85em; padding-block: 0.6em;}
.message .wrapper                               {min-height: 0;}
.message .inner                                 {display: flex; width: 100%; justify-content: space-between; align-items: flex-start; gap: 1.2em; background: var(--color0); padding: 0.45em 0.75em; border-radius: 0.4em; box-sizing: border-box;}
.message.red .inner                             {background: #c91832;}
.message.green .inner                           {background: #00b147;}
.message.yellow .inner                          {background: var(--color1);}
.message .inner p                               {color: white;}
.message .inner p a                             {color: white; text-decoration: underline;}
.message .inner p a:hover                       {color: white; text-decoration-color: transparent; opacity: 0.85;}
.message .inner .close                          {display: block; width: 1em; height: 1em; position: relative; top: -0.1em; cursor: pointer; transition: .15s ease-in-out;}
.message .inner .close:before, 
.message .inner .close:after                    {display: block; width: 90%; height: 0.12em; background: white; position: absolute; left: 5%; top: 0.75em; content: "";}
.message .inner .close:before                   {transform: rotate(45deg);}
.message .inner .close:after                    {transform: rotate(-45deg);}
.message .inner .close:hover                    {opacity: 0.7;}

.detail-hero .icons-info                        {font-size: 1.15em;}

.detail-cover                                   {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: 0.5em; position: relative;}
.detail-cover > div                             {display: block; position: relative; border-radius: var(--border-radius1); overflow: hidden;}
.detail-cover > div:nth-child(1)                {border-top-left-radius: var(--border-radius2);}
.detail-cover > div a                           {display: block; position: absolute; inset: 0; transition: .15s ease-in-out;}
.detail-cover > div a img                       {display: block; width: 100%; height: 100%; object-fit: cover;}
.detail-cover > div a:hover                     {opacity: 0.8;}
.detail-cover .map iframe                       {display: block; width: 100%; height: 100%; position: absolute; inset: 0;}
  @media screen and (min-width: 961px)          {
  .detail-cover > div:nth-child(1)              {width: calc(65% - 0.5em); padding-top: 40%;}
  .detail-cover > div:nth-child(2)              {width: 35%; height: calc(50% - 0.25em); position: absolute; top: 0; right: 0;}
  .detail-cover > div:nth-child(3)              {width: 35%; height: calc(50% - 0.25em); position: absolute; bottom: 0; right: 0;}
  }
  @media screen and (max-width: 960px)          {
  .detail-cover > div:nth-child(1)              {width: 100%; padding-top: 56%;}
  .detail-cover > div:nth-child(n+2)            {width: calc(50% - 0.25em); padding-top: 28%;}
  }

.detail-service-cover                           {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: 0.5em; position: relative;}
.detail-service-cover > div                     {display: block; position: relative; border-radius: var(--border-radius1); overflow: hidden;}
.detail-service-cover > div a                   {display: block; position: absolute; inset: 0; transition: .15s ease-in-out;}
.detail-service-cover > div a img               {display: block; width: 100%; height: 100%; object-fit: cover;}
.detail-service-cover > div a:hover             {opacity: 0.8;}
.detail-service-cover > div:nth-child(2)        {border-bottom-right-radius: var(--border-radius2);}
  @media screen and (min-width: 769px)          {
  .detail-service-cover > div                   {width: calc(50% - 0.25em); padding-top: 28%;}
  .detail-service-cover > div:nth-child(1)      {border-bottom-left-radius: var(--border-radius2);}
  }
  @media screen and (max-width: 768px)          {
  .detail-service-cover > div                   {width: 100%; padding-top: 56%;}
  .detail-service-cover > div:nth-child(2)      {border-bottom-left-radius: var(--border-radius2);}
  }

.detail-nav                                     {display: block; width: 100%; height: var(--detail-nav-height); position: relative; z-index: 10; transition: .15s ease-in-out;}
.detail-nav .fixed-width                        {display: block; width: 100%; position: absolute; left: -9999px;}
.detail-nav .inner                              {display: flex; width: 100%; height: var(--detail-nav-height); justify-content: space-between; align-items: center; position: relative; z-index: 10; transition: .15s ease-in-out;}
.detail-nav .inner:before                       {display: block; height: var(--detail-nav-height); background: var(--color2b); position: absolute; top: 0; content: ""; transition: .15s ease-in-out;}
.detail-nav nav                                 {display: flex; height: 100%; position: relative; box-sizing: border-box; transition: .15s ease-in-out;}
.detail-nav nav .overflow                       {display: block; height: var(--detail-nav-height); box-sizing: border-box; transition: .15s ease-in-out;}
.detail-nav nav ul                              {display: flex; height: var(--detail-nav-height); align-items: center; flex-wrap: wrap; position: relative; padding: 0; box-sizing: border-box; transition: .15s ease-in-out;}
.detail-nav nav ul li                           {display: flex; width: auto; height: var(--detail-nav-height); align-items: center; margin: 0; box-sizing: border-box; position: relative; padding: 0;}
.detail-nav nav ul li:before                    {display: none;}
.detail-nav nav ul li a                         {display: flex; height: var(--detail-nav-height); align-items: center; font-size: 1em; color: var(--color0); font-weight: 700; line-height: 1.2; text-decoration: none; padding-top: 0.2em; box-sizing: border-box; transition: .15s ease-in-out;}
.detail-nav .inner.fixed                        {height: var(--detail-nav-fixed-height); position: fixed; top: 0;}
.detail-nav .inner.fixed:before                 {height: var(--detail-nav-fixed-height); box-shadow: 0 0.2em 0.4em rgba(0,0,0,0.1);}
.detail-nav .inner.fixed nav,
.detail-nav .inner.fixed nav .overflow,
.detail-nav .inner.fixed nav ul,
.detail-nav .inner.fixed nav ul li,
.detail-nav .inner.fixed nav ul li a            {height: var(--detail-nav-fixed-height);}
  @media screen and (min-width: 1081px)         {  
  .detail-nav .inner:before                     {width: 100%; left: 0; border-radius: 0.3rem 0.3rem calc(0.7 * var(--border-radius2)) calc(0.7 * var(--border-radius2));}
  .detail-nav nav                               {width: calc(100% - 16em); padding-left: calc(0.15rem + var(--padding1));}
  .detail-nav nav ul                            {gap: 1.1em; font-size: 1.1em;}
  .detail-nav nav ul li.responsive              {display: none;}
  .detail-nav nav ul li a:hover,
  .detail-nav nav ul li a.sel                   {color: var(--color1);}
  .detail-nav nav ul li.mobile-only             {display: none;}
  .detail-nav .button                           {margin-right: calc(0.15rem + var(--padding1));}
  .detail-nav .inner.fixed nav ul               {height: var(--detail-nav-fixed-height);}
  }     
  @media screen and (max-width: 1080px)         {  
  .detail-nav .inner:before                     {width: 100vw; left: calc(0px - var(--wrapper-side));}
  .detail-nav nav                               {width: calc(100% - 12rem); cursor: pointer;}
  .detail-nav nav:hover                         {background: rgba(0,0,0,0.05);}
  .detail-nav nav:after                         {display: inline-block; width: 0.7em; height: 0.7em; position: absolute; left: calc(0.65 * var(--wrapper-side)); top: calc(50% - 0.35em); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M191.5,414.4c35.5,47.6,93.6,47.6,129.1,0l172.8-231.8c35.5-47.6,15.9-86.6-43.4-86.6H62.1c-59.4,0-78.9,39-43.4,86.6 L191.5,414.4z' fill='rgb(181,144,34)' stroke='none' stroke-width='0' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center center; background-size: contain; content: ""; transform: rotate(-90deg); transition: .15s ease-in-out;}
  .detail-nav nav .overflow                     {width: 100%; overflow-y: hidden;}
  .detail-nav nav .close                        {display: none; width: 1.2em; height: 1.2em; background: var(--color2b); border: solid 0.1em var(--color1); box-sizing: border-box; border-radius: 0.25em; margin-left: -0.25em; position: absolute; top: calc(50% - 0.6em); left: calc(0.65 * var(--wrapper-side)); z-index: 15; cursor: pointer; transition: .15s ease-in-out;}
  .detail-nav nav .close:before, 
  .detail-nav nav .close:after                  {display: block; width: 60%; height: 0.12em; background: var(--color0); position: absolute; left: 20%; top: calc(50% - 0.06em); content: "";}
  .detail-nav nav .close:before                 {transform: rotate(45deg);}
  .detail-nav nav .close:after                  {transform: rotate(-45deg);}
  .detail-nav nav .close:hover                  {border-color: var(--color0);}
  .detail-nav nav ul                            {gap: 0; padding-inline: calc(0.65 * var(--wrapper-side)); overflow: hidden; transition: .15s ease-in-out;}
  .detail-nav nav ul li                         {width: 100%; border-bottom: solid 1px transparent;}
  .detail-nav nav ul li.responsive              {display: block; width: 100%; position: absolute; left: 0; top: 0; z-index: 5;}
  .detail-nav nav ul li a                       {width: 100%; font-size: 1.4rem; line-height: 1.1; padding: 0.2em 1.5rem 0; overflow: hidden; position: relative;}
  .detail-nav nav ul li a:after                 {display: none; width: 100%; height: 1px; background: black; opacity: 0.15; position: absolute; left: 0; bottom: 0; content: "";}
  .detail-nav nav ul li a.sel                   {color: var(--color1);}
  .detail-nav nav ul li:has(a.sel)              {order: -1;}
  .detail-nav.show nav ul                       {background: white; box-shadow: 0 0 0.9em rgba(0,0,0,0.3);}
  .detail-nav.show .inner nav .overflow         {height: calc(4 * var(--detail-nav-height)); overflow-y: auto; box-shadow: 0 0 0.4em rgba(0,0,0,0.1);}
  .detail-nav.show .inner nav ul                {height: auto !important;}
  .detail-nav.show .inner nav ul li             {border-color: var(--color2);}
  .detail-nav.show .inner.fixed nav .overflow   {height: calc(4 * var(--detail-nav-fixed-height));}
  .detail-nav.show nav ul:has(a.sel) .mobile-only    {display: none;}
  .detail-nav.show nav .close                   {display: block;}
  }
  @media screen and (max-width: 540px)          {  
  .detail-nav nav                               {width: calc(100% - 6rem);}
  .detail-nav nav ul li a                       {font-size: 1.25em;}
  .detail-nav .button .desktop-only             {display: none;}
  }
  @media screen and (max-width: 440px)          {  
  .detail-nav nav ul li a                       {font-size: 1.15em;}
  .detail-nav .button                           {font-size: 0.9em;}
  }

.services-grid                                  {display: flex; width: 100%; flex-wrap: wrap; gap: 0.6rem;}
.services-grid a                                {display: flex; width: 100%; align-items: center; gap: 0.5em; background: var(--color2b); border: solid 0.08em transparent; padding: 1.2em 1.7em; box-sizing: border-box; transition: .15s ease-in-out;}
.services-grid a img                            {display: block; width: 1.6em; height: 1.6em;}
.services-grid a span                           {display: block; flex-grow: 2; font-size: 1.2em; color: var(--color0); font-weight: 700; transition: .15s ease-in-out;}
.services-grid a:after                          {display: block; width: 0.55em; height: 0.55em; opacity: 0.9; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M191.5,414.4c35.5,47.6,93.6,47.6,129.1,0l172.8-231.8c35.5-47.6,15.9-86.6-43.4-86.6H62.1c-59.4,0-78.9,39-43.4,86.6 L191.5,414.4z' fill='black' stroke='none' stroke-width='0' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center center; background-size: contain; content: ""; transform: rotate(-90deg);}
.services-grid a:hover                          {border-color: var(--color1);}
.services-grid a:hover span                     {color: var(--color1);}
  @media screen and (min-width: 1081px)         {  
  .services-grid a                              {width: calc(33.33% - 0.4rem)}
  .services-grid a:nth-child(odd)               {border-radius: var(--border-radius1) 0.2em;}
  .services-grid a:nth-child(even)              {border-radius: 0.2em var(--border-radius1);}
  }
  @media screen and (min-width: 641px) and (max-width: 1080px){  
  .services-grid a                              {width: calc(50% - 0.3rem)}
  .services-grid a:nth-child(4n+1),
  .services-grid a:nth-child(4n+4)              {border-radius: var(--border-radius1) 0.2em;}
  .services-grid a:nth-child(4n+2),
  .services-grid a:nth-child(4n+3)              {border-radius: 0.2em var(--border-radius1);}
  }
  @media screen and (max-width: 640px)          {  
  .services-grid a:nth-child(odd)               {border-radius: var(--border-radius1) 0.2em;}
  .services-grid a:nth-child(even)              {border-radius: 0.2em var(--border-radius1);}
  }

.services-grid-images                           {display: flex; width: 100%; flex-wrap: wrap; gap: 0.6rem;}
.services-grid-images > div                     {display: block; width: 100%; position: relative; overflow: hidden;}
.services-grid-images > div .img                {display: block; padding-top: 65%; box-sizing: border-box; position: relative;} 
.services-grid-images > div .img span           {display: block; position: absolute; inset: 0;} 
.services-grid-images > div .img span img       {display: block; width: 100%; height: 100%; object-fit: cover;} 
.services-grid-images > div a                   {display: flex; width: calc(100% - 2 * var(--padding1)); align-items: center; gap: 0.5em; font-size: 1.1em; background: rgba(255,255,255,0.85); border-radius: calc(0.65 * var(--border-radius1)); border: solid 0.12em transparent; padding: 1em 1.5em; box-sizing: border-box; position: absolute; left: var(--padding1); bottom: var(--padding1); z-index: 2; transition: .15s ease-in-out;}
.services-grid-images > div a img               {display: block; width: 1.6em; height: 1.6em;}
.services-grid-images > div a span              {display: block; flex-grow: 2; font-size: 1.2em; color: var(--color0); font-weight: 700; transition: .15s ease-in-out;}
.services-grid-images > div a:after             {display: block; width: 0.55em; height: 0.55em; opacity: 0.9; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M191.5,414.4c35.5,47.6,93.6,47.6,129.1,0l172.8-231.8c35.5-47.6,15.9-86.6-43.4-86.6H62.1c-59.4,0-78.9,39-43.4,86.6 L191.5,414.4z' fill='black' stroke='none' stroke-width='0' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center center; background-size: contain; content: ""; transform: rotate(-90deg);}
.services-grid-images > div a:hover             {border-color: var(--color1); box-shadow: 0 0 0.6em rgba(0,0,0,0.2);}
.services-grid-images > div a:hover span        {color: var(--color1);}
  @media screen and (min-width: 641px)          {  
  .services-grid-images > div                   {width: calc(50% - 0.3rem)}
  .services-grid-images > div:nth-child(4n+1),
  .services-grid-images > div:nth-child(4n+4)   {border-radius: var(--border-radius1) 0.2em;}
  .services-grid-images > div:nth-child(4n+2),
  .services-grid-images > div:nth-child(4n+3)   {border-radius: 0.2em var(--border-radius1);}
  }
  @media screen and (max-width: 768px)          {  
  .services-grid-images > div .img              {padding-top: 75%;}
  }
  @media screen and (min-width: 641px) and (max-width: 960px){  
  .services-grid-images > div a                 {font-size: 0.9em;}
  }
  @media screen and (max-width: 640px)          {  
  .services-grid-images > div:nth-child(odd)    {border-radius: var(--border-radius1) 0.2em;}
  .services-grid-images > div:nth-child(even)   {border-radius: 0.2em var(--border-radius1);}
  }

.detail-section                                 {display: block; width: 100%; padding-top: var(--detail-nav-fixed-height);}
  @media screen and (min-width: 541px)          {
  .detail-section h2                            {padding-inline: var(--padding1);}
  }

.directions                                     {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap;}
.directions > div                               {display: block; width: 100%; padding-left: var(--padding1); position: relative; box-sizing: border-box;}
.directions > div img                           {display: block; width: calc(var(--padding1) - 0.6rem); position: absolute; left: 0; top: 0.25em;}
  @media screen  and (min-width: 641px) and (max-width: 960px){
  .directions > div                             {padding: var(--padding1) 0 0;} 
  .directions > div img                         {top: 0;}
  }
  @media screen and (min-width: 641px)          {
  .directions > div                             {width: calc(33.33% - 1.6rem);}
  .directions > div:not(:last-child)            {padding-right: 1.2rem; margin-right: 1.2rem; border-right: solid 1px var(--color2);}
  .directions > div p                           {font-size: 0.95em;}
  }
  @media screen and (max-width: 640px)          {
  .directions > div:not(:last-child)            {padding-bottom: 1.2rem; margin-bottom: 1.2rem; border-bottom: solid 1px var(--color2);}
  }

.services-previews                              {display: flex; width: 100%; flex-wrap: wrap; gap: 0.9rem;}
  @media screen and (min-width: 1081px)         {
  .services-previews .service-preview           {width: calc(33.33% - 0.6rem);}
  }
  @media screen and (min-width: 641px) and (max-width: 1080px){
  .services-previews .service-preview           {width: calc(50% - 0.45rem);}
  }

.service-preview                                {display: flex; width: 100%; flex-direction: column; gap: 0.8rem; position: relative; padding: var(--padding1) var(--padding1) calc(2 * var(--padding1)); border: solid 0.08em var(--color2); box-sizing: border-box; border-radius: var(--border-radius2) var(--border-radius1);}  
.service-preview .img                           {display: block; width: 100%; padding-top: 62%; position: relative; border-radius: calc(var(--border-radius2) * 0.7) calc(var(--border-radius1) * 0.7); overflow: hidden; transition: .15s ease-in-out;}
.service-preview .img span                      {display: block; position: absolute; inset: 0;}
.service-preview .img span img                  {display: block; width: 100%; height: 100%; object-fit: cover;}
.service-preview .img:hover                     {opacity: 0.8;}
.service-preview .title                         {display: block; width: 100%; font-size: 1.3em; line-height: 1.2; margin-bottom: -0.35em;}
.service-preview .title a                       {color: var(--color0); font-weight: 700; transition: .15s ease-in-out;}
.service-preview .title a:hover                 {color: var(--color1);}
.service-preview .text                          {display: block; font-size: 0.85rem;}
.service-preview ul li                          {font-size: 0.85rem; padding-left: 1em;}
.service-preview .link                          {display: block; color: var(--color1); font-weight: 700; text-decoration: underline; position: absolute; left: var(--padding1); bottom: var(--padding1); transition: .15s ease-in-out;}
.service-preview .link:hover                    {color: var(--color1b); text-decoration-color: transparent;}

.detail-cols                                    {display: flex; width: 100%; justify-content: space-between; gap: 0 var(--gap2); flex-wrap: wrap;}
  @media screen and (min-width: 1081px)         {
  .detail-cols > *                              {width: calc(50% - 0.5 * var(--gap2)) !important;}
  }

.detail-section:has(+ .detail-gray),
.detail .padding-bottom                         {padding-bottom: var(--detail-nav-height);}
.detail-gray                                    {display: flex; width: 100%; justify-content: space-between; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; gap: 0 var(--gap3); position: relative; padding-bottom: var(--detail-nav-height);}
.detail-gray:not(:has(> .detail-section))       {padding-top: var(--detail-nav-height);}
.detail-gray:before                             {display: block; height: 100%; background: var(--color2b); position: absolute; top: 0; content: "";}
.detail-gray > *                                {position: relative; z-index: 2;}
  @media screen and (min-width: 1081px)         {
  .detail-gray:before                           {width: 112%; left: -6%; border-radius: var(--border-radius1) var(--border-radius2);}
  .detail-gray.cols2 > *                        {width: calc(50% - 0.5 * var(--gap3));}
  }
  @media screen and (max-width: 1080px)         {
  .detail-gray:before                           {width: calc(100% + 2 * var(--wrapper-side)); left: calc(0px - var(--wrapper-side));}
  }

.opening-hours                                  {display: block; width: 100%; background: white; padding: var(--padding1); border-radius: calc(0.7 * var(--border-radius1)) calc(0.7 * var(--border-radius2)); box-sizing: border-box;}
.opening-hours.gray                             {background: var(--color2b);}
.opening-hours table                            {width: 100%;}
.opening-hours table td                         {vertical-align: top; line-height: 1.2; padding-block: 0.1em;}
.opening-hours > table > tbody > tr > td        {padding-block: 0.35em;}
.opening-hours > table > tbody > tr > td a      { display: block; }
.opening-hours > table > tbody > tr:not(:last-child) > td
                                                {border-bottom: solid 1px var(--color2);}
.opening-hours table td a                       {color: var(--color1); text-decoration: underline; transition: .15s ease-in-out;}
.opening-hours table td a:hover                 {color: var(--color1b); text-decoration-color: transparent;}
  @media screen and (min-width: 1081px)         {
  .opening-hours table td:nth-child(1)          {width: 4.5em;}
  .opening-hours table td:nth-child(2)          {width: 7em;}
  }
  @media screen and (max-width: 1080px)         {
  .opening-hours table td:nth-child(1)          {width: max(4.5em, 15vw);}
  .opening-hours table td:nth-child(2)          {width: max(7em, 20vw);}
  }
  @media screen and (max-width: 540px)          {
  .opening-hours .desktop-only                  {display: none;}
  .opening-hours table td:nth-child(1)          {width: 2.2em;}
  }

.detail-blog .preview > div .text               {display: none;}
  @media screen and (min-width: 1081px)         {
  .detail-blog .swiper                          {height: 15.5rem;}
  .detail-blog .preview                         {justify-content: space-between;}
  .detail-blog .preview .img                    {width: 30%; padding-top: 22%;}
  .detail-blog .preview > div                   {width: 65%; padding: 0;} 
  .detail-blog .preview > div .title            {font-size: 1.35rem;}
  .detail-blog .preview .icons-info             {font-size: 0.8em;}
  .detail-blog .preview .link                   {font-size: 0.9em;}
  .detail-blog .controls                        {width: 100%; position: relative; inset: auto;}
  }
  @media screen and (min-width: 1081px) and (max-width: 1280px){
  .detail-blog .swiper                          {height: 17rem;}
  }

.detail .filters1                               {padding-inline: var(--padding1);}
.detail .file-box                               {width: 100%; margin-inline: 0;}  
  @media screen and (max-width: 540px)          {
  .detail .filters1                             {padding-inline: 0;}
  }

.detail-contacts                                {display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 1em; flex-wrap: wrap; padding: 1.5em var(--padding1); border: solid 0.08em var(--color2); box-sizing: border-box; border-radius: var(--border-radius2) 0.3em;}
.detail-contacts > div                          {display: flex; flex-direction: column; align-items: flex-start; gap: 0.2em;}
.detail-contacts > div a                        {display: flex; align-items: center; gap: 0.4em; font-size: 1.1em; color: var(--color0); text-decoration: underline; transition: .15s ease-in-out;}
.detail-contacts > div a .icon                  {display: flex; width: 1.3em; height: 1.3em; justify-content: center; align-items: center; background: var(--color1); border-radius: 100%;}
.detail-contacts > div a .icon img              {display: block; width: 50%; height: auto;}
.detail-contacts > div a:hover                  {color: var(--color1b); text-decoration-color: transparent;}

.detail .perex p                                {font-size: 1.2em;}
.detail .perex .button                          {font-size: 1.1em;}
.detail ul                                      {display: block; width: 100%; padding: 0;}
.detail ul li                                   {width: 100%;}
  @media screen and (min-width: 769px)          {
  .detail ul.ul-cols2                           {column-count: 2; column-gap: var(--gap2);}
  }

.landing-head                                   {display: flex; width: 100%; border-radius: var(--border-radius1) var(--border-radius2); padding-block: min(5rem, calc(1rem + 5vw)); position: relative; overflow: hidden;}
.landing-head .img                              {display: block; position: absolute; inset: 0;}
.landing-head .img img                          {display: block; width: 100%; height: 100%; object-fit: cover;}
.landing-info                                   {display: flex; max-width: 42em; flex-wrap: wrap; gap: 1em; background: rgba(255,255,255,0.7); backdrop-filter: blur(4px); padding: 2em; box-sizing: border-box; border-radius: calc(0.6 * var(--border-radius1)) calc(0.6 * var(--border-radius2));}
.landing-info h1                                {margin-bottom: -0.3em;}
  @media screen and (min-width: 1281px)         {
  .landing-info                                 {padding: 3em; position: relative; left: -3em;}
  }
  @media screen and (max-width: 1280px)         {
  .landing-head                                 {width: calc(50% + 50vw); margin-left: calc(-50vw + 50%); padding-block: 15rem min(3rem, calc(1rem + 5vw)); border-top-left-radius: 0; border-bottom-left-radius: 0;}
  .landing-head .img img                        {object-position: right center;}
  }

.cta-landing-career                             {display: flex; width: 100%; flex-wrap: wrap; gap: 0.8em;}
.cta-landing-career > *                         {margin: 0;}
.cta-landing-career p                           {max-width: 48rem;}

.landing-gallery                                {margin-top: var(--section-padding);}

.job-head                                       {display: flex; width: 100%; min-height: 22rem; flex-wrap: wrap; background: var(--color2b); border-radius: var(--border-radius1) var(--border-radius2); overflow: hidden; box-sizing: border-box; position: relative;}
.job-head .info                                 {display: flex; width: 100%; align-items: center; align-content: center; flex-wrap: wrap; gap: 1em; padding-block: 2em; box-sizing: border-box;}
.job-head .info h1                              {width: 100%; margin: 0 0 -0.3em !important;}
.job-head .info .claim                          {font-size: 1em; color: var(--color1); line-height: 1.2;}
.job-head .info .claim strong                   {display: block; font-size: 1.3em; font-weight: 700;}
.job-head .img                                  {display: block; width: 100%;}
.job-head .img img                              {display: block; width: 100%; height: 100%; object-fit: cover;}
  @media screen and (min-width: 961px)          {
  .job-head                                     {padding-inline: 2em; margin-bottom: var(--gap2);}
  .job-head .info                               {width: 50%;}
  .job-head .img                                {width: 50%; height: 100%; position: absolute; right: 0; top: 0;}
  }
  @media screen and (max-width: 960px)          {
  .job-head .img                                {order: -1;}
  .job-head .info                               {padding-inline: 2em;}
  }

.why-us1:before                                 {display: block; opacity: 0.2; mix-blend-mode:luminosity; background: url("images/bulovka1.webp") no-repeat center center; background-size: cover; position: absolute; inset: 0; content: "";}
.why-us1 *                                      {text-shadow: 0.05rem 0.05rem 0.1rem rgba(0,0,0,0.2);}
.why-us1 p:nth-of-type(2)                       {font-size: 0.9em; line-height: 1.3; font-weight: 700; padding: var(--gap1) 0 0 3.2em; border-top: solid 1px white; box-sizing: border-box; position: relative;}
.why-us1 p:nth-of-type(2) img                   {display: block; width: 2.4em; height: 2.4em; position: absolute; left: 0; top: var(--gap1); margin-top: 0.05em;}

.highlight:has(.career-contacts) p              {margin-block: -0.5em;}

.career-contacts                                {display: flex; width: 100%; flex-direction: column; align-items: flex-start; gap: 0.2em; padding-left: 6em; box-sizing: border-box; position: relative;}
.career-contacts .img                           {display: block; width: 5em; height: 5em; border-radius: 0.3em 0.3em 0.3em calc(0.5 * var(--border-radius2)); overflow: hidden; position: absolute; left: 0; top: 0.15em;}
.career-contacts .img img                       {display: block; width: 100%; height: 100%; object-fit: cover;}
.career-contacts .name                          {display: block; width: 100%; font-size: 1.25em; font-weight: 700;}
.career-contacts a                              {display: flex; align-items: flex-start; gap: 0.4em; font-size: 1.1em; color: var(--color0); text-decoration: underline; transition: .15s ease-in-out;}
.career-contacts a .icon                        {display: flex; width: 1.3em; height: 1.3em; justify-content: center; align-items: center; background: var(--color1); border-radius: 100%; position: relative; top: 0.04em;}
.career-contacts a .icon img                    {display: block; width: 50%; height: auto;}
.career-contacts a:hover                        {color: var(--color1b); text-decoration-color: transparent;}

.spec-locations                                 {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: var(--gap1) 0;}
.spec-locations > div                           {display: flex; width: 100%; justify-content: space-between; align-items: center; gap: var(--gap1) 0; padding: var(--padding1); border: solid 0.08em var(--color2); box-sizing: border-box; border-radius: var(--border-radius1) var(--border-radius2);}
.spec-locations > div > div                     {display: flex; width: calc(100% - 22em); align-items: center; align-content: center; flex-wrap: wrap; gap: 0.8em;}
.spec-locations > div h2                        {padding: 0; margin: 0;}
.spec-locations > div h2 a                      {color: var(--color0); transition: .15s ease-in-out;}
.spec-locations > div h2 a:hover                {color: var(--color1);}
.spec-locations > div .icons-info               {margin-top: -0.4em;}
.spec-locations > div .links                    {display: flex; width: 100%; gap: 0.2em 1em; box-sizing: border-box;}
.spec-locations > div .links .link              {display: flex; align-items: center; gap: 0.45em; color: var(--color1); font-weight: 700; text-decoration: underline; transition: .15s ease-in-out;}
.spec-locations > div .links .link svg          {display: block; width: 0.4em; height: 0.4em; fill: var(--color1); transform: rotate(-90deg); position: relative; top: -0.025em; transition: .15s ease-in-out;}
.spec-locations > div .links .link:hover        {color: var(--color1b); text-decoration-color: transparent;}
.spec-locations > div .img                      {display: block; width: 16em; height: 9em; position: relative; border-radius: 0.3em calc(0.5 * var(--border-radius2)) 0.3em 0.3em; overflow: hidden; transition: .15s ease-in-out;}
.spec-locations > div .img span                 {display: block; position: absolute; inset: 0;}
.spec-locations > div .img span img             {display: block; width: 100%; height: 100%; object-fit: cover;}
.spec-locations > div .img:hover                {opacity: 0.85;}
  @media screen and (min-width: 1081px)         {
  .spec-locations > div .icons-info             {font-size: 1.15em;}
  .spec-locations > div .links .link            {font-size: 1.1em;}
  }
  @media screen and (max-width: 1080px)         {
  .spec-locations > div                         {flex-wrap: wrap; align-items: flex-start; align-content: flex-start;}
  .spec-locations > div .img                    {width: 100%; height: auto; padding-top: 56%; order: -1;}
  .spec-locations > div > div                   {width: 100%;}
  } 
  @media screen and (min-width: 769px) and (max-width: 1080px){
  .spec-locations > div                         {width: 49%;}
  }