/*
Theme Name: Archio Child
Theme URI: http://demos.casethemes.net/archio/
Author: CaseThemes
Author URI: https://themeforest.net/user/casethemes
Description: Archio - Architecture WordPress Theme. Archio is a clean and modern Architecture design. You can use it for any kind website like  architect, architecture, building, construction, decor, estate, furniture, house and many others relevant businesses. Well-structured code and easy to use documentation help you to get a great business website.  
Version: 1.1.6
License: ThemeForest
License URI: https://themeforest.net/licenses
Template: archio
Text Domain: archio-child
Tags: architect, architecture, building, construction, decor, estate, furniture, house, house design, interior, interior design, photography, property, real estate, showcase
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-weight: bold !important;
}

@media screen and (min-width: 1200px) {
    body .container {
        max-width: 1100px !important;
    }
    body .container.container-wider {
        max-width: 1500px !important;
    }
}

.content-inner p {
    line-height: normal;
    letter-spacing: -.025rem;
}

@media only screen and (max-width: 767px) {
    .content-inner p {
        font-size: 16px;
        line-height: 18px !important;
    }
}

.content-inner #secondary p:first-of-type {
    font-size: 16px !important;
}

#secondary i.fa.bg-main {
    border-radius: 50%;
    overflow: hidden;
}

@media only screen and (min-width: 768px) {
    .content-inner p {
        font-size: 19px;
        line-height: 21px !important;
    }
   .post-type-archive-signature-designs .content-inner p {
        font-size: 18px;
    }
    .page-template-sitara-ridge .content-inner p {
        font-size: 17px;
    }
    .page-template-sitara-ridge .design_list_intro p {
        max-width: 580px;
        margin: 0 auto !important;
    }
}

.sitara_branding {
    width: 480px;
    max-width: 100%;
}
@media only screen and (max-width: 767px) {
    .sitara_branding {
        width: 320px;
    }
}
@media only screen and (max-width: 575px) {
    .sitara_branding {
        width: 240px;
    }
}

hr.bg-main {
    max-width: 106px;
}

.bg-dark {
    /*background-color: #000 !important;*/
}

.bg-main,
.carousel-indicators .active {
    background-color: #C4984F !important;
}

.carousel-control-prev:hover .carousel-control-prev-icon,
.carousel-control-prev:focus .carousel-control-prev-icon,
.carousel-control-prev .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23C4984F' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}

.carousel-control-next:hover .carousel-control-next-icon,
.carousel-control-next:focus .carousel-control-next-icon,
.carousel-control-next .carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23C4984F' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}

.bg-none {
    background-color: transparent !important;
}

.color-main {
    color: #C4984F !important;
}

.bg-cover {
    background-size: cover !important;
    background-position: center !important;
}

.fw-500 {
    font-weight: 500 !important;
}

.h1.fw-500 {
    letter-spacing: -2px;
    line-height: 38px;
}

h1, .h1 {
    font-size: 32px;
    line-height: 32px;
}

@media only screen and (min-width: 576px) {
    h1, .h1 {
        font-size: 36px;
        line-height: 36px;
    }
}

/* Base */
button.btn {
    font-size: 1.25rem !important;
    letter-spacing: -1px !important;
}
. {
    position: relative;
    width: 100%;
}

.ratio::before {
    display: block;
    content: "";
    padding-top: var(--aspect-ratio);
}

.ratio > * {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.btn {
    border-radius: 0 !important;
}

.rounded-top-xl {
    border-top-left-radius: 1.5rem !important;
    border-top-right-radius: 1.5rem !important;
}

/* Preset ratios */ratio
.ratio-1x1   { --aspect-ratio: 100%; }
.ratio-4x3   { --aspect-ratio: calc(3 / 4 * 100%); }
.ratio-16x9  { --aspect-ratio: calc(9 / 16 * 100%); }
.ratio-21x9  { --aspect-ratio: calc(9 / 21 * 100%); }

.ratio-9x16  { --aspect-ratio: calc(16 / 9 * 100%); }
.ratio-3x4 { --aspect-ratio: calc(4 / 3 * 100%); }
.ratio-2x3 { --aspect-ratio: calc(3/ 2 * 100%); }
.ratio-9x10   { --aspect-ratio: calc(10 / 9 * 100%); }

/* Lightboxes */
.lightbox-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}
.modal .modal-dialog {
    max-width: 1800px !important;
}
.gallery-modal.show {
    display: flex !important;
    align-items: center;
}
.gallery-modal .modal-dialog {
    margin: auto;
}

.gallery-modal .carousel-inner {
    max-width: 1440px;
    margin-right: auto;
    margin-left: auto;
}

.gallery-modal.floor-plan-modal .carousel-inner {
    max-width: 960px;
    margin-right: auto;
    margin-left: auto;
}

.carousel-indicators .active {
    background-color: #C4984F;
}

.carousel-indicators li {
    background-color: rgba(0,0,0,.5);
}

.carousel-bg-slide {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.product-gallery .carousel-item {
    cursor: pointer;
}

.gallery-modal .modal-body {
    padding: 0 1rem 1rem;
}
.gallery-modal .close {
    opacity: 0.8;
}
.gallery-modal .close:hover {
    opacity: 1;
}
.shadow-sm {
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075) !important;
}
.shadow {
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}
.shadow-lg {
    box-shadow: 0 1rem 3rem rgba(0,0,0,.175) !important;
}
.shadow-none {
    box-shadow: none !important;
}

.font-sans {
    font-family: "Work Sans" !important;
    letter-spacing: 2px;
}
h2.font-sans {
    font-size: 16px;
}
.font-serif {
    font-family: Prata;
}
.fw-bold {
    font-weight: bold !important;
}

#header-wrap {
    max-width: 1284px;
    margin-right: auto;
    margin-left: auto;
}

.page-template-sitara-ridge #pagetitle {
    background-position: center bottom !important;
}

.page-template-sitara-ridge #pagetitle:before,
.page-template-sitara-ridge .product_cta:before {
    background-color: rgba(0, 0, 0, 0.16);
}

.about_sitara_ridge .ratio-9x10 h2.px-5 {
    text-shadow: 2px 2px 9px rgba(0, 0, 0, .64);
}

.sitara_lots .font-sans {
    letter-spacing: 1px;
}

@media only screen and (min-width: 768px) and (max-width: 876px) {
    .about_sitara_ridge .ratio-9x10 h2 {
        font-size: 1.75rem !important;
    }
}

@media only screen and (max-width: 876px) {
    .about_sitara_ridge .ratio-9x10 .justify-content-end {
        justify-content: center !important;
    }
}

@media only screen and (min-width: 1147px) {
    .about_sitara_ridge .ratio-9x10 h2.px-5 {
        padding-right: 4rem !important;
        padding-left: 4rem !important;
    }
}

@media only screen and (min-width: 1630px) {
    .single-signature-designs #pagetitle {
        height: 100vh !important;
        min-height: 1000px;
    }
    .page-template-sitara-ridge #pagetitle {
        height: 80vh !important;
    }
}

.page-template-sitara-ridge .carousel_text {
    background: rgba(0,0,0,0.45);
    background: linear-gradient(to top, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
}

.video_intro_bg {
    height: 56.25vw;
    max-height: 80vh;
    will-change: background-position;
    overflow: hidden;
}

.single-signature-designs #pagetitle:before {
    background-color: rgba(0, 0, 0, 0.32);
}

.single-signature-designs .owl-carousel .owl-item img {
    width:100%;
    height:100%;
    object-fit:cover;
}

.bg-cover {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.bg-overlay {
    position: relative;
}

.bg-overlay::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 0;
}

.bg-overlay > * {
    position: relative;
    z-index: 1;
}

section > .bg-overlay:before,
.gallery_followup.bg-overlay:before {
    background-color: rgba(0, 0, 0, 0.67);
}

.single-signature-designs .site-content {
    padding: 0;
}

.product_top_details {
    margin-top: -163px;
}

.design_list_intro {
    margin-top: -223px;
}

.single-signature-designs .product_top_details_row,
.post-type-archive-signature-designs .design_list_intro_container {
    max-width: 920px;
}

.single-signature-designs .product_top_details span.font-serif {
    font-size: 18px;
}

@media only screen and (min-width: 576px) {
    .single-signature-designs .product_top_details span {
        font-size: 20px;
    }
    .single-signature-designs .product_top_details span.font-serif {
        font-size: 22px;
    }
}

.ontheboard_hero_intro p {
    color: #FFFFFF !important;
    line-height: normal;
    letter-spacing: -.025em !important;
    font-weight: 800;
    text-shadow: 1px 1px 5px rgba(0, 0, 0, .77);
}

@media screen and (max-width: 767px) {
    .ontheboard_hero_intro p {
        font-size: 15px;
    }
}

@media screen and (max-width: 575px) {
    .ontheboard_hero_intro p {
        font-size: 14px;
    }
}

@media screen and (min-width: 768px) {
    .ontheboard_hero_intro p {
        font-size: 16px;
    }
}

@media screen and (min-width: 992px) {
    .ontheboard_hero_intro p {
        font-size: 17px;
    }
}

@media screen and (min-width: 1200px) {
    .ontheboard_hero_intro p {
        font-size: 18px;
    }
}

.ontheboard_hero_intro {
    background-color: rgba(0, 0, 0, .44);
}

/* Explore More */
.signature-design-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.55) 0%, transparent 50%);
    transition: background 0.3s ease;
}

.signature-design-overlay:hover {
    background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, transparent 70%);
}

.design_list_tax_intro p {
    width: 480px;
    max-width: 100%;
}

/* -------------------------------------------------------------
   Custom Bootstrap 4 embed-responsive ratio: 1440x835 (~57.99%)
   Use with: <div class="embed-responsive embed-responsive-1440by835"> ...
   Mirrors Bootstrap's aspect-box approach via ::before padding-top.
-------------------------------------------------------------- */
.embed-responsive-1440by835::before {
    padding-top: 57.986111%; /* 835 / 1440 * 100 */
}

/* Dot indicators */
.portfolio-slide-dots {
    position: absolute;
    bottom: 1.25rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
    z-index: 1100;
}

.portfolio-slide-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid #fff;
    background: transparent;
    padding: 0;
    cursor: pointer;
    transition: background 0.3s ease, transform 0.2s ease;
}

.portfolio-slide-dot.is-active {
    background: #fff;
    transform: scale(1.25);
}