/* STAPPA skin for Pera demo-03. Keep theme.css/plugins.css and their breakpoints intact. */
/* Complete local character set keeps Czech letters in the same font and weight. */
@font-face {
    font-family: 'Stappa Menu';
    src: url('../fonts/lato/Lato-Bold.ttf') format('truetype');
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}
.stappa #navigation .nav-links .nav-link {
    font-family: 'Stappa Menu', 'Lato', sans-serif;
    font-weight: 700;
    font-synthesis: none;
    color: #555 !important;
    transition: color .2s, background-color .2s;
}
.stappa #navigation .nav-links .nav-link:hover,
.stappa #navigation .nav-links .nav-link:focus-visible,
.stappa #navigation .nav-links > li.showing > .nav-link { color: var(--colored1) !important; }
body.stappa {
    --colored: #0b7bb0;
    --colored1: #1196cf;
    --colored2: #09618b;
    color: #d8d8d8;
    background: #212121;
}
.stappa section, .stappa article { scroll-margin-top: 100px; }
.stappa .container { max-width: 1330px; }
.stappa a:focus-visible, .stappa button:focus-visible { outline: 2px solid #42bdf5 !important; outline-offset: 5px; }
/* Shared text-link feedback, including links with Pera colour utility classes. */
.stappa a:not(.lg-btn):not(.nav-button):not(.stappa-partner):not([data-fslightbox]):not(.logo):not(.stappa-news-card-photo):not(.stappa-news-card-notice):hover,
.stappa a:not(.lg-btn):not(.nav-button):not(.stappa-partner):not([data-fslightbox]):not(.logo):not(.stappa-news-card-photo):not(.stappa-news-card-notice):focus-visible {
    color: var(--colored1) !important;
}
.stappa [aria-disabled="true"] { cursor: default; }
.stappa a.stappa-arrow-link { display: inline-flex; align-items: center; gap: 8px; }
.stappa .stappa-arrow-label { min-width: 0; }
.stappa .stappa-link-arrow { display: block; flex: 0 0 26px; width: 26px; height: 24px; overflow: visible; }
.stappa .stappa-section-title { font-size: 63px; line-height: 1.1; color: #fff; }
.stappa .stappa-subtitle { font-size: 19px; line-height: 1.6; margin-top: 14px; }
/* Original fixed navigation and mobile drawer. */
.stappa #navigation { height: 85px; background: #fff !important; color: #555 !important; }
.stappa #navigation.scrolled { background: #fff !important; color: #555 !important; }
.stappa #navigation a.logo img { width: 275.8px; max-width: 275.8px; max-height: 75.6px; height: auto; }
.stappa-home #navigation { transition: transform .25s ease, opacity .25s ease, visibility .25s; }
.stappa-home #navigation:not(.scrolled):not(.active) { transform: translateY(-100%) !important; opacity: 0; visibility: hidden; pointer-events: none; }
.stappa #navigation .nav-links > li > .nav-link { padding: 0 11px; font-size: 14px; font-weight: 700; text-transform: uppercase; white-space: nowrap; }
.stappa #navigation .dropdown-menu { min-width: 231px; }
@media (min-width: 1200px) {
    .stappa #navigation.link-hover-01 .nav-links > li > .nav-link.stappa-current-page::before { width: 100%; }
    .stappa #navigation .nav-links > li > .nav-link.stappa-current-page { color: var(--colored1) !important; }
}
.stappa #navigation .dropdown-menu .nav-link { font-size: 14px !important; font-weight: 700; text-transform: uppercase; padding: 20px 24px; white-space: normal; }
.stappa #navigation .dropdown-menu li + li { border-top: 1px solid #eee; }
.stappa #navigation .extra-links { gap: 15px; padding-left: 14px; }
.stappa #navigation .extra-links .bracket { margin: 0; }
.stappa .stappa-social { font-size: 12px; color: #555; }
.stappa .stappa-social { display: inline-flex; align-items: center; justify-content: center; }
.stappa .stappa-social-icon { display: block; width: 11px; height: 11px; flex: none; }
.stappa .stappa-social-youtube { width: 15px; height: 11px; }
.stappa #navigation .stappa-social-icon { filter: brightness(0) opacity(.65); }
.stappa #navigation .stappa-phone { display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 6px 12px; min-width: 123px; min-height: 43px; margin: 0; background: var(--colored); color: #fff; font-size: 10px; font-weight: 900; line-height: 1.35; }
.stappa #hamburger-menu { background: transparent; padding: 0; }
.stappa #navigation .hamburger-menu div, .stappa #navigation.scrolled .hamburger-menu div { background-color: #555 !important; }
/* Local MP4 fills the original hero; retain the Pera overlay and controls. */
.stappa .stappa-hero-video, .stappa .stappa-hero-still { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.stappa .stappa-hero-video { opacity: 0; }
.stappa .stappa-hero-video.is-playing { opacity: 1; }
/* Crop the horizontal borders present in the supplied video frame. */
@media (min-width: 993px) {
    .stappa .stappa-hero-video { transform: scale(1.16); }
}
.stappa .stappa-hero-still { object-position: 45% center; }
.stappa .muteToggle[hidden] { display: none !important; }
@media (max-width: 992px) {
    .stappa .stappa-hero-video, .stappa .muteToggle { display: none !important; }
    .stappa #home .fai { background: rgba(0, 0, 0, .5) !important; opacity: 1; }
    .stappa #home .fai svg { display: none; }
}
.stappa .stappa-welcome { font-size: 36px; line-height: 1.1; }
.stappa .stappa-hero-title { font-size: 63px; line-height: 1.1; margin: 8px 0 28px; }
.stappa .stappa-tagline { font-size: 23px; line-height: 1.4; }
.stappa .stappa-hero-action { margin-top: 44px; }
.stappa .stappa-hero-action .lg-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 209px; min-height: 54px; padding: 16px 30px; font-size: 14px; }
/* The first screen keeps a standalone brand and service links over the original video. */
.stappa-home #home .fai { opacity: .5 !important; }
.stappa .stappa-hero-brand-wrap { position: absolute; top: 18px; left: 25px; right: 25px; z-index: 5; }
.stappa .stappa-hero-brand { display: inline-block; max-width: 100%; filter: drop-shadow(0 1px 3px rgba(0,0,0,.4)); }
.stappa .stappa-hero-brand img { display: block; width: 386.12px; max-width: 100%; height: auto; }
.stappa .stappa-hero-content { position: relative; z-index: 5; min-height: 100vh; min-height: 100svh; display: flex; align-items: flex-end; padding: 150px 0 20px; }
.stappa .stappa-hero-heading { color: #fff; font-size: clamp(30px, 3vw, 44px); line-height: 1.2; margin: 0 0 16px; text-shadow: 0 2px 8px rgba(0,0,0,.5); }
.stappa #home .stappa-hero-services { margin-top: 0; row-gap: 20px; }
.stappa #home .stappa-hero-services .stappa-service { max-width: none; height: 100%; min-height: 96px; padding: 10px 12px; background: var(--colored); display: flex; align-items: center; justify-content: center; flex-direction: column; transition: background .2s; }
.stappa #home .stappa-hero-services .stappa-service img { height: 44px; width: auto; max-width: 80px; }
.stappa #home .stappa-hero-services .stappa-service h3 { color: #fff; font-size: 18px; line-height: 1.2; margin: 6px 0 0; }
.stappa #home .stappa-hero-services .stappa-service:hover, .stappa #home .stappa-hero-services .stappa-service:focus-visible { background: var(--colored2); }
.stappa #home .stappa-hero-services .stappa-service:hover h3 { color: #fff; }
@media (max-width: 992px) {
    .stappa .stappa-hero-content { min-height: max(700px, 100svh); padding-bottom: 15px; }
    .stappa .stappa-hero-brand img { width: 352.8px; max-width: calc(100vw - 50px); }
    .stappa .stappa-hero-heading { font-size: 30px; }
    .stappa #home .stappa-hero-services { row-gap: 14px; margin-left: -7px; margin-right: -7px; }
    .stappa #home .stappa-hero-services > div { padding-left: 7px; padding-right: 7px; }
    .stappa #home .stappa-hero-services .stappa-service { min-height: 78px; padding: 8px; }
    .stappa #home .stappa-hero-services .stappa-service img { height: 30px; max-width: 60px; }
    .stappa #home .stappa-hero-services .stappa-service h3 { font-size: 14px; line-height: 1.25; margin-top: 6px; }
}
/* Intro and the original responsive service grid. */
.stappa .stappa-about { padding: 115px 0 105px; }
.stappa .stappa-intro { max-width: 1100px; margin: 22px auto 0; font-size: 18px; line-height: 1.7; }
.stappa .stappa-intro p { line-height: inherit; }
.stappa .stappa-intro p + p { margin-top: 32px; }
.stappa .stappa-services { margin-top: 100px; }
.stappa .stappa-service { display: block; max-width: 245px; margin: 0 auto; }
.stappa .stappa-service img { width: auto; max-width: 155px; height: 110px; object-fit: contain; }
.stappa .stappa-service h3 { font: 400 22px/1.4 'Lato', sans-serif; color: #fff; margin-top: 22px; }
.stappa .stappa-service p { font-size: 18px; line-height: 1.65; margin-top: 35px; }
.stappa .stappa-service[href]:hover h3 { color: var(--colored1); }
.stappa .stappa-home-dph { margin-top: 70px; padding: 40px; background: #2b2b2b; text-align: left; }
.stappa .stappa-home-dph .row { row-gap: 25px; }
.stappa .stappa-home-dph-image { display: block; max-width: 300px; margin: 0 auto; }
.stappa .stappa-home-dph-image img { display: block; width: 100%; height: auto; }
.stappa .stappa-home-dph h2 { color: #fff; font-size: 38px; line-height: 1.2; margin-bottom: 20px; }
.stappa .stappa-home-dph p { font-size: 18px; line-height: 1.7; margin-bottom: 18px; }
.stappa .stappa-home-dph-more { display: inline-block; margin-top: 5px; color: var(--colored1); font-size: 18px; }
@media (max-width: 575px) {
    .stappa .stappa-home-dph { margin-top: 40px; padding: 25px; }
    .stappa .stappa-home-dph h2 { font-size: 30px; }
    .stappa .stappa-home-dph p, .stappa .stappa-home-dph-more { font-size: 16px; }
    .stappa .stappa-home-dph-image { max-width: 220px; }
}
/* Pera twin sections: retain container-fluid / row / col-lg-6 stacking. */
.stappa .stappa-twin { background: #2b2b2b !important; }
.stappa .stappa-twin .container-fluid { padding: 0; }
.stappa .stappa-twin .row { margin: 0; }
.stappa .stappa-twin .row > div { padding: 0; }
.stappa .stappa-twin-copy { width: 100%; padding: 100px clamp(35px, 6.77vw, 130px); }
.stappa .stappa-twin h2 { font-size: 47px; line-height: 1.1; color: #fff; margin-bottom: 12px; }
.stappa .stappa-twin p, .stappa .stappa-benefit-list { font-size: 18px; line-height: 1.65; }
.stappa .stappa-twin article + article { margin-top: 48px; }
.stappa .stappa-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.stappa #company .stappa-photo img { object-position: 33% center; }
.stappa .stappa-callout { min-height: 780px; display: flex; align-items: center; background-position: center; }
.stappa .stappa-callout::before { content: ''; position: absolute; inset: 0; background: rgba(19,32,53,.45); }
.stappa .stappa-callout-copy { max-width: 605px; margin: 0 auto; }
.stappa .stappa-callout h2 { font-size: 78px; line-height: .98; color: #fff; text-shadow: 0 2px 8px rgba(0,0,0,.25); }
.stappa .stappa-callout h2 span { display: block; margin-left: 105px; }
.stappa .stappa-callout h2 strong { display: block; margin-left: 48px; font-weight: 400; font-size: 104px; color: var(--colored); }
.stappa .stappa-callout h2 a { color: var(--colored); }
.stappa .stappa-callout h2 a:hover { color: var(--colored1); }
.stappa .stappa-callout p { margin: 18px 0 0 25px; font-size: 21px; line-height: 1.5; }
.stappa .stappa-benefits { background: #212121 !important; padding: 120px 0; }
.stappa .stappa-benefits .stappa-twin-copy { padding-top: 0; padding-bottom: 0; }
.stappa .stappa-benefits .stappa-photo img { height: auto; }
.stappa .stappa-benefit-list { list-style: disc; padding-left: 18px; margin: 32px 0 0; }
/* Reuse Pera's piano radio component for the PSD news accordion. */
.stappa .stappa-news { background: linear-gradient(#2b2b2b 0 66%, #212121 66%); padding-top: 120px; }
.stappa .stappa-news h2 { font-size: 63px; line-height: 1.1; }
.stappa .stappa-news h5 { font-size: 19px; }
.stappa .stappa-news .piano { margin-top: 90px !important; }
.stappa .stappa-news .piano-image > div { min-width: 0 !important; width: 100%; padding-right: 25px; }
.stappa .stappa-news .piano-image h3, .stappa .stappa-news-image-link { position: static; }
.stappa .stappa-news-image-link::after { content: ''; position: absolute; inset: 0; z-index: 2; }
.stappa .stappa-news-image-link:focus-visible::after { outline: 2px solid #42bdf5; outline-offset: -4px; }
.stappa .stappa-news .piano-image { background-position: right center; }
.stappa .stappa-news .piano-title .top { font-size: 24px; }
.stappa .stappa-news .piano-image h3 { font-size: 28px; }
.stappa .stappa-news .piano-image p { font-size: 18px; }
.stappa .piano-select:focus-visible + .piano-image + .piano-title { outline: 3px solid #fff !important; outline-offset: -5px; }
.stappa .stappa-partners { padding: 120px 0 155px; }
.stappa .stappa-partners .row { margin-top: 55px; row-gap: 24px; }
.stappa .stappa-partner { height: 117px; background: #d0d0d0; display: flex; align-items: center; justify-content: center; padding: 20px; }
.stappa .stappa-partner img { max-width: 100%; max-height: 77px; object-fit: contain; }
.stappa .stappa-partner img[src$="partner-tas-original.png"] {
    width: auto;
    height: 77px;
    /* Hide the anniversary badge without changing the official logo lettering. */
    clip-path: polygon(0 0, 57% 0, 57% 62%, 100% 62%, 100% 100%, 0 100%);
}
.stappa .stappa-footer { background: #2b2b2b; padding: 65px 0 90px; }
.stappa .stappa-footer > .container { max-width: 1700px; }
.stappa .stappa-footer img { width: 424.5px; height: auto; max-width: 100%; }
.stappa .stappa-footer nav { display: flex; justify-content: center; flex-wrap: wrap; gap: 18px 26px; margin-top: 75px; }
.stappa .stappa-footer nav a { padding: 0; text-transform: uppercase; font-size: 14px; font-weight: 900; }
@media (min-width: 1200px) {
    .stappa #navigation .dd-toggle:focus-within > .dropdown-menu { display: block; }
}

@media (min-width: 993px) and (max-width: 1399px) {
    .stappa #navigation .container { max-width: 100%; padding: 0 25px; }
    .stappa #navigation a.logo img { width: 231px; }
    .stappa #navigation .nav-links > li > .nav-link { padding: 0 7px; font-size: 13px; }
    .stappa #navigation .extra-links { gap: 10px; padding-left: 8px; }
    .stappa .stappa-twin-copy { padding: 70px 55px; }
    .stappa .stappa-twin h2 { font-size: 38px; }
    .stappa .stappa-twin p, .stappa .stappa-benefit-list { font-size: 16px; }
}

@media (max-width: 992px) {
    .stappa .container { padding-left: 25px; padding-right: 25px; }
    .stappa .stappa-section-title, .stappa .stappa-news h2 { font-size: 48px; }
    .stappa .stappa-about { padding: 80px 0; }
    .stappa .stappa-services { margin-top: 60px; row-gap: 55px; }
    .stappa .stappa-service p { margin-top: 18px; }
    .stappa .stappa-twin-copy { padding: 65px 35px; }
    .stappa .stappa-twin h2 { font-size: 38px; }
    .stappa .stappa-photo img { height: auto; max-height: 700px; }
    .stappa .stappa-callout { min-height: 650px; }
    .stappa .stappa-benefits { padding: 65px 0; }
    .stappa .stappa-benefits .stappa-photo { margin-top: 45px; }
    .stappa .stappa-partners { padding: 80px 0; }
    .stappa .stappa-news { padding-top: 80px; }
    .stappa .stappa-news .piano-title .top { font-size: 14px !important; margin-top: 20px; max-height: calc(100% - 40px); overflow: hidden; }
    .stappa .stappa-news .piano-title .bottom { display: none !important; }
}
@media (max-width: 575px) {
    .stappa .stappa-hero-title { font-size: 46px; margin-top: 10px; margin-bottom: 25px; }
    .stappa .stappa-welcome { font-size: 29px; }
    .stappa .stappa-tagline { font-size: 20px; }
    .stappa .stappa-section-title, .stappa .stappa-news h2 { font-size: 40px; }
    .stappa .stappa-intro, .stappa .stappa-twin p, .stappa .stappa-benefit-list { font-size: 16px; }
    .stappa .stappa-service { max-width: 280px; }
    .stappa .stappa-service img { height: 85px; }
    .stappa .stappa-twin-copy { padding: 55px 25px; }
    .stappa .stappa-twin h2 { font-size: 34px; }
    .stappa .stappa-callout { min-height: 520px; }
    .stappa .stappa-callout h2 { font-size: clamp(39px, 10.4vw, 59px); }
    .stappa .stappa-callout h2 span { margin-left: 35px; }
    .stappa .stappa-callout h2 strong { margin-left: 15px; font-size: 1.3em; }
    .stappa .stappa-callout p { font-size: 16px; margin-left: 0; }
    /* Same radio/image/title order, vertical expansion leaves enough room for Czech headlines. */
    .stappa .stappa-news .piano { height: auto !important; display: flex; flex-direction: column !important; margin-top: 40px !important; overflow: visible; }
    .stappa .piano .piano-select { width: 100%; height: 54px; margin: 0 0 -54px; flex-shrink: 0; }
    .stappa .piano .piano-image { width: 100% !important; height: 0; }
    .stappa .piano .piano-select:checked + .piano-image { height: 280px; }
    .stappa .piano .piano-title { width: 100%; height: 54px; flex-direction: row; align-items: center; padding: 0 14px; border-bottom: 1px solid #555; }
    .stappa .piano .piano-title span.top { writing-mode: horizontal-tb; transform: none; white-space: normal; text-align: left; margin: 0; font-size: 16px !important; line-height: 1.15; max-height: none; }
    .stappa .piano .piano-title span.bottom { margin: 0 0 0 12px !important; font-size: 22px; }
    .stappa .stappa-news .piano-image h3 { font-size: 25px; }
    .stappa .stappa-news .piano-image p { font-size: 16px; }
    .stappa .stappa-partner { height: 95px; padding: 15px; }
    .stappa .stappa-footer nav { margin-top: 45px; gap: 18px; }
    .stappa .stappa-footer nav a { font-size: 11px; }
}
/* Override Pera's mobile visibility only while the scroll observer is waiting. */
body.stappa .animated.stappa-scroll-pending { visibility: hidden !important; opacity: 0 !important; }
@media (prefers-reduced-motion: reduce) {
    .stappa .animated { visibility: visible !important; opacity: 1 !important; animation: none !important; transform: none !important; }
    .stappa .piano-image, .stappa .piano-title { transition: none !important; }
}

/* Keep the enlarged logo and readable links in one header row.
   Pera's existing drawer takes over before the desktop links can overflow. */
.stappa #navigation .nav-wrapper { flex-wrap: nowrap; }
@media (min-width: 1200px) {
    .stappa #navigation .nav-wrapper > .col:not(.nav-menu) { flex: 0 0 auto; width: auto; }
    .stappa #navigation .nav-menu { flex: 1 1 auto; width: auto; min-width: 0; }
    .stappa #navigation .nav-links { flex-wrap: nowrap; }
    .stappa #navigation .nav-links > li { flex: 0 0 auto; max-width: none; }
    .stappa #navigation .nav-links > li > .nav-link { white-space: nowrap; height: 100%; line-height: 1.25; }
    .stappa #navigation .dropdown-menu { width: max-content; }
    .stappa #navigation .dropdown-menu .nav-link { white-space: nowrap; }
}
@media (min-width: 1200px) and (max-width: 1399px) {
    .stappa #navigation .nav-links > li > .nav-link { padding-left: 7px !important; padding-right: 7px !important; }
}
@media (max-width: 1199px) {
    .stappa #navigation { height: 75px; }
    .stappa #navigation a.logo img { width: 252px; max-width: calc(100vw - 110px); }
    .stappa #navigation .logo-for-mobile-navigation img { width: 252px; max-width: 100%; height: auto; }
    .stappa #navigation .nav-links > li > .nav-link,
    .stappa #navigation .dropdown-menu .nav-link { font-size: 14px !important; }
    .stappa #navigation .extra-links { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; column-gap: 18px; row-gap: 12px; padding: 20px 25px; }
    .stappa #navigation .stappa-social { color: #333; }
    .stappa #navigation .extra-links > .stappa-social { width:34px; height:30px; }
    .stappa #navigation .extra-links > .stappa-phone { flex: 0 0 100%; max-width: 220px; margin: 0 auto; }
    .stappa #navigation .nav-links > li > .nav-link { padding: 14px 25px; }

    .stappa #navigation .nav-links > li > .nav-link { white-space: nowrap; text-align: left; }
}