/* =============================================
   SKYWAY АПСНЫ — MAIN STYLESHEET
   Single source of truth for all custom styles.
   HTML files link only: bootstrap.min.css + this file.
   ============================================= */

/* === CDN Imports === */
@import url('https://fonts.googleapis.com/css2?family=Kaushan+Script&family=Montserrat:wght@400;700&display=swap');
 

/* === Local Font Files === */
@font-face {
    font-family: 'Kaushan Script';
    src: url('../fonts/s/kaushanscript/v18/vm8vdRfvXFLG3OLnsO15WYS5DG72wNJHMw.woff2') format('woff2');
    font-weight: 400; font-style: normal; font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Kaushan Script';
    src: url('../fonts/s/kaushanscript/v18/vm8vdRfvXFLG3OLnsO15WYS5DG74wNI.woff2') format('woff2');
    font-weight: 400; font-style: normal; font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/s/montserrat/v30/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2') format('woff2');
    font-weight: 400; font-style: normal; font-display: swap;
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/s/montserrat/v30/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2') format('woff2');
    font-weight: 400; font-style: normal; font-display: swap;
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/s/montserrat/v30/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2') format('woff2');
    font-weight: 400; font-style: normal; font-display: swap;
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/s/montserrat/v30/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2') format('woff2');
    font-weight: 400; font-style: normal; font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/s/montserrat/v30/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2') format('woff2');
    font-weight: 400; font-style: normal; font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/s/montserrat/v30/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2') format('woff2');
    font-weight: 700; font-style: normal; font-display: swap;
    unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/s/montserrat/v30/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2') format('woff2');
    font-weight: 700; font-style: normal; font-display: swap;
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/s/montserrat/v30/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2') format('woff2');
    font-weight: 700; font-style: normal; font-display: swap;
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/s/montserrat/v30/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2') format('woff2');
    font-weight: 700; font-style: normal; font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/s/montserrat/v30/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2') format('woff2');
    font-weight: 700; font-style: normal; font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* === Local Icon Libraries === */
@import url('../fonts/fontawesome-all.min.css');

/* =============================================
   COMPONENT STYLES (inlined from local CSS files)
   ============================================= */

/* --- Accordion FAQ List --- */
.accordion-button:focus {
    box-shadow: none;
    border: none;
}
.accordion-button:not(.collapsed) {
    background: none;
    color: #ff9800;
    box-shadow: none;
    border-bottom: none;
}
.accordion-button::after {
    width: auto;
    height: auto;
    content: "+";
    font-size: 40px;
    background-image: none;
    font-weight: 100;
    color: #1b6ce5;
    transform: translateY(-4px);
}
.accordion-button:not(.collapsed)::after {
    width: auto;
    height: auto;
    background-image: none;
    content: "-";
    font-size: 48px;
    transform: rotate(0deg);
}

/* --- Card with Popup Text Effect --- */
.cards {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
    grid-auto-flow: row;
    justify-items: center;
    grid-gap: 1em;
}
.cards_item {
    width: 340px;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.4) 0px 30px 90px;
    border: 10px solid rgba(212, 212, 212, 0.726);
}
.cards_item .card {
    position: relative;
    height: 440px;
    background-color: var(--black-bkg);
    cursor: pointer;
}
.cards_item .card:hover > .card_content {
    transform: translateY(5%);
}
.cards_item .card:hover > .card_image img {
    transform: translateY(-100px) scale(1.3);
}
.cards_item .card:hover > .card_content .card_text p:not(:first-of-type) {
    opacity: 1;
}
.card_image {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
.card_image img {
    transform: translateY(0) scale(1);
    transition: transform 0.7s ease-in-out;
}
.card_content {
    height: 500px;
    position: absolute;
    z-index: 2;
    transform: translateY(40%);
    padding: 2em;
    color: white;
    background: linear-gradient(transparent, #1d1106 16%);
    transition: transform 0.7s ease-in-out;
}
.card_title {
    font-size: 1.3rem;
    color: var(--yellow);
    font-family: "Bree Serif", serif;
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}
.card_text {
    font-size: 0.8rem;
    line-height: 1.5rem;
    color: var(--white-text);
}
.card_text p {
    margin: 10px 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.card_text p:not(:first-of-type) {
    opacity: 0;
    transition: opacity 0.6s 0.2s;
}
.note {
    display: inline-block;
    padding: 5px;
    margin: 10px 0;
    line-height: 1em;
    text-transform: uppercase;
    text-align: right;
    font-size: 0.7rem;
    background-color: var(--yellow);
    color: var(--black-bkg);
}

/* --- Carousel Hero --- */
div.jumbotron.carousel-hero {
    color: #fff;
    text-align: center;
    background-size: cover;
    background-position: center;
    padding-top: 100px;
    padding-bottom: 100px;
    margin-bottom: 0;
}
div.jumbotron.hero-photography {
    background-image: url('../../assets/img/hero2.jpg');
}
div.jumbotron.hero-technology {
    background-image: url('../../assets/img/hero3.jpg');
}
h1.hero-title, h2.hero-title, h3.hero-title {
    text-shadow: 0 3px 3px rgba(0,0,0,0.4);
    color: #fff;
}
p.hero-subtitle {
    max-width: 600px;
    margin: 25px auto;
    padding: 10px 15px;
    color: #fff;
}

/* --- Contact Details Icons --- */
.bs-icon {
    --bs-icon-size: .75rem;
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    font-size: var(--bs-icon-size);
    width: calc(var(--bs-icon-size) * 2);
    height: calc(var(--bs-icon-size) * 2);
    color: var(--bs-primary);
}
.bs-icon-xs { --bs-icon-size: 1rem; width: calc(var(--bs-icon-size) * 1.5); height: calc(var(--bs-icon-size) * 1.5); }
.bs-icon-sm { --bs-icon-size: 1rem; }
.bs-icon-md { --bs-icon-size: 1.5rem; }
.bs-icon-lg { --bs-icon-size: 2rem; }
.bs-icon-xl { --bs-icon-size: 2.5rem; }
.bs-icon.bs-icon-primary { color: var(--bs-white); background: var(--bs-primary); }
.bs-icon.bs-icon-primary-light { color: var(--bs-primary); background: rgba(var(--bs-primary-rgb), .2); }
.bs-icon.bs-icon-semi-white { color: var(--bs-primary); background: rgba(255, 255, 255, .5); }
.bs-icon.bs-icon-rounded { border-radius: .5rem; }
.bs-icon.bs-icon-circle { border-radius: 50%; }

/* --- Row Text + Image Responsive --- */
.dh-header-non-rectangular-container h1,
.dh-header-non-rectangular-container p {
    color: white;
    font-weight: bold;
}
.clearmargin { margin: 0; }
.clearpadding { padding: 0; }
.row-image-txt { background-color: rgb(42,42,42); }
.row-image-txt h1, .row-image-txt h2 { color: white; }
.row-image-txt p { color: white; }

/* --- Hero Clean Images --- */
.fit-cover { object-fit: cover; }

/* --- Image Tab Gallery (Horizontal) --- */
.column { float: left; width: 25%; padding: 10px 5px; }
.column img { opacity: 0.8; cursor: pointer; }
.column img:hover { opacity: 1; }
.img-row:after { content: ""; display: table; clear: both; }
.img-container { position: relative; }
#imgtext { position: absolute; bottom: 15px; left: 15px; color: white; font-size: 20px; }
.top-container { margin-top: 50px; }

 

/* --- Video Parallax Background --- */
.parallax {
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    position: relative;
}
.parallax-background {
    width: 0; height: auto; display: none;
    filter: brightness(50%);
}
.parallax-background, .parallax-placeholder {
    filter: brightness(50%);
}
.parallax-placeholder {
    position: absolute; z-index: -200;
    top: 0; left: 0; width: 100%; height: 100%;
    background-size: cover; background-position: center;
    background-attachment: fixed;
}
.parallax-content {
    min-height: 70vh; color: white; padding: 2em 1rem;
}
.parallax-content p { font-size: 1.5em; text-align: center; }
.parallax-content .btn { width: 100px; }
.parallax-content h1 {
    font-family: arial black; font-size: 50px; color: white;
    margin: 0; text-align: center;
    display: table-cell; vertical-align: middle;
}


/* =============================================
   CUSTOM STYLES — SkyWay Апсны
   ============================================= */

/* --- Desktop Dropdown on Hover --- */
@media (min-width: 992px) {
    .navbar .nav-item.dropdown:hover > .dropdown-menu {
        display: block;
        margin-top: 0;
        animation: fadeInDown 0.25s ease;
    }
    .navbar .dropdown-menu {
        border: none;
        box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.2);
        border-radius: 0.5rem;
        padding: 0.5rem 0;
        min-width: 220px;
    }
    .navbar .dropdown-item {
        padding: 0.5rem 1.25rem;
        font-size: 0.85rem;
        font-weight: 500;
        transition: all 0.2s ease;
    }
    .navbar .dropdown-item:hover {
        background-color: #fed136;
        color: #212529;
    }
}
@keyframes fadeInDown {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* --- Active Page Indicator (gold) --- */
.nav-link.active-page,
.dropdown-item.active-page {
    color: #fed136 !important;
}

/* --- Modern Navbar Toggler --- */
.navbar .navbar-toggler {
    width: 44px;
    height: 44px;
    padding: 0;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.25);
    background: rgba(0,0,0,0.25);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}
.navbar .navbar-toggler:hover {
    background: rgba(0,0,0,0.35);
    border-color: rgba(255,255,255,0.35);
    transform: translateY(-1px);
}
.navbar .navbar-toggler:active {
    transform: translateY(0);
}
.navbar .navbar-toggler:focus {
    box-shadow: 0 0 0 0.2rem rgba(254,209,54,0.35);
}
.navbar .navbar-toggler .navbar-toggler-icon {
    width: 1.25em;
    height: 1.25em;
}

/* --- Photo Gallery --- */
.photo-gallery .photos .item a {
    display: block;
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 0.75rem 2rem rgba(0,0,0,0.18);
    transform: translateZ(0);
}
.photo-gallery .photos .item img {
    display: block;
    width: 100%;
    height: auto;
    transition: transform 0.35s ease, filter 0.35s ease;
}
.photo-gallery .photos .item a::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0.0) 35%, rgba(0,0,0,0.35) 100%);
    opacity: 0;
    transition: opacity 0.35s ease;
}
.photo-gallery .photos .item a:hover::after {
    opacity: 1;
}
.photo-gallery .photos .item a:hover img {
    transform: scale(1.04);
    filter: saturate(1.05);
}

/* --- Mobile Accordion Navbar --- */
#mobileMainMenu .accordion-item {
    background: transparent;
    border-color: rgba(255,255,255,0.1);
}
#mobileMainMenu .accordion-button {
    background: transparent;
    color: #fff;
    font-size: 0.85rem;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 0.75rem 1rem;
    box-shadow: none !important;
}
#mobileMainMenu .accordion-button:not(.collapsed) {
    background: rgba(255,255,255,0.05);
    color: #fed136;
}
#mobileMainMenu .accordion-button::after {
    filter: invert(1);
}
#mobileMainMenu .accordion-body .nav-link {
    color: rgba(255,255,255,0.7);
    padding: 0.5rem 1rem 0.5rem 2rem;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: color 0.2s ease;
}
#mobileMainMenu .accordion-body .nav-link:hover {
    color: #fed136;
}
#mobileMainMenu > .accordion-item.border-0 .nav-link {
    color: #fff;
    font-size: 0.85rem;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 0.75rem 1rem;
}
#mobileMainMenu > .accordion-item.border-0 .nav-link:hover {
    color: #fed136;
}

/* --- Location / Content Cards --- */
.location-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: none;
}
.location-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 1rem 3rem rgba(0,0,0,0.175) !important;
}
.content-card {
    border: none;
    overflow: hidden;
}
.content-card .card-body {
    padding: 1.5rem 2rem;
}
.content-card h3 {
    font-weight: 700;
    color: #212529;
    margin-bottom: 1rem;
    position: relative;
    padding-bottom: 0.75rem;
}
.content-card h3::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 50px;
    height: 3px;
    background: #fed136;
    border-radius: 2px;
}

/* --- Image Hover Zoom Effect --- */
.img-hover-zoom {
    overflow: hidden;
    border-radius: 1rem;
    box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.1);
}
.img-hover-zoom img {
    transition: transform 0.4s ease;
    border-radius: 1rem;
}
.img-hover-zoom:hover img {
    transform: scale(1.08);
}

/* --- CTA / Gold Buttons --- */
.btn-cta,
.btn-gold {
    background: #fed136;
    color: #212529;
    border: 2px solid #fed136;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 0.75rem 2rem;
    border-radius: 50px;
    transition: all 0.3s ease;
    display: inline-block;
    text-decoration: none;
}
.btn-cta:hover,
.btn-gold:hover {
    background: #e5bc2f;
    border-color: #e5bc2f;
    color: #212529;
    transform: translateY(-2px);
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.25);
}

/* --- Z-Pattern Section --- */
.z-section {
    padding: 3rem 0;
}
.z-section .row {
    align-items: center;
}
.z-section .img-hover-zoom {
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.1);
}
.z-section .img-hover-zoom img {
    border-radius: 1rem;
}

/* --- Section Cards --- */
.section-card {
    background: #fff;
    border-radius: 1rem;
    box-shadow: 0 0.125rem 0.5rem rgba(0,0,0,0.08);
    overflow: hidden;
    margin-bottom: 2rem;
    transition: box-shadow 0.3s ease;
}
.section-card:hover {
    box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.12);
}
.section-card img {
    transition: transform 0.4s ease;
}
.section-card:hover img {
    transform: scale(1.03);
}
.section-card .card-img-wrapper {
    overflow: hidden;
}

/* --- WhatsApp Floating Button Fix --- */
.btn-float {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}
.btn-success i {
    line-height: 1;
    vertical-align: middle;
    margin-top: -2px;
}

/* --- Improved Portfolio Items --- */
.portfolio-item {
    margin-bottom: 30px;
}
.portfolio-item .portfolio-caption {
    transition: background 0.3s ease;
}
.portfolio-item:hover .portfolio-caption {
    background: #fed136;
}
.portfolio-item:hover .portfolio-caption h4 {
    color: #212529;
}
.portfolio-item .portfolio-caption {
    cursor: pointer;
    border-bottom-left-radius: 0.75rem;
    border-bottom-right-radius: 0.75rem;
}
.portfolio-link {
    position: relative;
    display: block;
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 0 0.75rem 1.25rem rgba(0,0,0,0.12);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.portfolio-link:hover {
    transform: translateY(-4px);
    box-shadow: 0 1rem 1.75rem rgba(0,0,0,0.16);
}
.portfolio-link img {
    width: 100%;
    display: block;
}
.portfolio-link .portfolio-hover {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 1rem;
    background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,0.5) 100%);
    opacity: 0;
    transition: opacity 0.25s ease;
}
.portfolio-link:hover .portfolio-hover {
    opacity: 1;
}
.portfolio-link .portfolio-hover-content {
    color: #fff;
    font-weight: 700;
    letter-spacing: 0.3px;
    background: rgba(0,0,0,0.35);
    padding: 0.4rem 0.9rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    backdrop-filter: blur(2px);
}

/* --- Unified Footer --- */
footer {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.dev-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.18rem 0.6rem;
    border-radius: 999px;
    background: #0b0f14;
    color: #00e5ff;
    text-decoration: none;
    font-weight: 700;
    letter-spacing: 0.2px;
    box-shadow: 0 0 0 1px rgba(0,229,255,0.35), 0 0 18px rgba(0,229,255,0.15);
    transition: color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}
.dev-link:hover {
    color: #7af5ff;
    transform: translateY(-1px);
    box-shadow: 0 0 0 1px rgba(0,229,255,0.55), 0 0 26px rgba(0,229,255,0.22);
}
.dev-link:active {
    transform: translateY(0);
}

/* --- Masthead Text Shadow for readability --- */
.masthead h1 {
    text-shadow: 2px 2px 8px rgba(0,0,0,0.6);
}

/* --- Scroll reveal animation (AOS fallback) --- */
[data-aos] {
    transition-property: opacity, transform;
}
