/* Панорама Прайм - Custom Styles */

/* EuropeExtendedC Font */
@font-face {
    font-family: "EuropeExtendedC";
    src: url("../fonts/europeextendedc.otf") format("opentype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "EuropeExtendedC";
    src: url("../fonts/europeextendedc_bold.otf") format("opentype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "EuropeExtendedC";
    src: url("../fonts/europeextendedc_italic.otf") format("opentype");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "EuropeExtendedC";
    src: url("../fonts/europeextendedc_bolditalic.otf") format("opentype");
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

/* Smooth scroll */
html {
    scroll-behavior: smooth;
}

/* Scroll offset for fixed header */
[id] {
    scroll-margin-top: 70px;
}

/* Headings font */
h1, h2 {
    font-family: "EuropeExtendedC", Arial, sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: -1px;
    line-height: 1.05;
    text-transform: uppercase;
}

/* Hero heading */
.hero-title {
    font-size: clamp(26px, 4vw, 42px);
    line-height: 1.15;
    letter-spacing: 0;
}

/* Page heading (inner pages) */
.page-title {
    font-size: clamp(24px, 4vw, 36px);
    line-height: 1.1;
    letter-spacing: -1px;
}

/* Section headings */
.section-title {
    font-size: clamp(22px, 4vw, 36px);
    line-height: 1.05;
}

/* Contact form heading */
#contacts .section-title {
    font-size: 36px;
}

/* Project tag filter */
.tag-btn-active {
    background-color: #EDA51C !important;
    color: #ffffff !important;
}

/* Decor tabs */
.decor-tab-active {
    background-color: #EDA51C !important;
    color: #ffffff !important;
}

/* Hide scrollbar for decor tabs on mobile */
.overflow-x-auto::-webkit-scrollbar {
    display: none;
}
.overflow-x-auto {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Mobile adjustments */
@media (max-width: 767px) {
    .hero-title {
        font-size: 28px;
    }
    .section-title {
        font-size: 24px;
    }
    #contacts .section-title {
        font-size: 28px;
    }
    /* Header logo */
    header img {
        height: 36px;
    }
}