/* ==========================================
   METUKTAKIM - LUXURY ABOUT PAGE
   ========================================== */

.about-v2 {
    background: #10100f;
    color: #f4eee5;
}

    /* HERO */

    .about-v2 .about-hero {
        min-height: 650px;
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 100px 25px;
        text-align: center;
        isolation: isolate;
        overflow: hidden;
    }

    .about-v2 .about-hero-photo {
        position: absolute;
        inset: 0;
        z-index: -2;
        background: url("images/IMG_2208.jpg") center / cover no-repeat;
    }

    .about-v2 .about-hero-shade {
        position: absolute;
        inset: 0;
        z-index: -1;
        background: linear-gradient( 180deg, rgba(10,9,8,.65), rgba(10,9,8,.80) );
    }

    .about-v2 .about-hero-content {
        max-width: 850px;
    }

    .about-v2 .about-eyebrow {
        color: #c49b58;
        font-size: 12px;
        font-weight: 600;
        letter-spacing: 2px;
        direction: ltr;
        text-align: inherit;
        margin: 0 0 20px;
    }

    .about-v2 .about-hero h1 {
        font-size: clamp(42px, 6vw, 83px);
        line-height: 1.3;
        font-weight: 400;
        margin: 0;
    }

    .about-v2 em {
        color: #e0bd82;
        font-style: normal;
    }

    .about-v2 .about-gold-line {
        display: block;
        width: 90px;
        height: 1px;
        background: #c49b58;
        margin: 30px auto;
    }

    .about-v2 .about-hero-content > p:not(.about-eyebrow) {
        font-size: clamp(16px, 2vw, 20px);
        line-height: 1.9;
        max-width: 680px;
        margin: 0 auto 35px;
        color: #eee5d9;
    }

    .about-v2 .about-hero-link {
        color: #e0bd82;
        font-weight: 600;
        text-decoration: none;
        border-bottom: 1px solid #c49b58;
        padding-bottom: 8px;
    }

    /* INTRO */

    .about-v2 .about-intro {
        max-width: 900px;
        margin: auto;
        padding: 110px 25px;
        text-align: center;
    }

        .about-v2 .about-intro h2,
        .about-v2 .about-team h2,
        .about-v2 .about-section-heading h2,
        .about-v2 .about-experience h2,
        .about-v2 .about-cta h2 {
            font-size: clamp(32px, 4.3vw, 57px);
            font-weight: 400;
            line-height: 1.4;
            margin: 0 0 25px;
        }

        .about-v2 .about-intro > p:not(.about-eyebrow) {
            color: #d7cec1;
            font-size: 17px;
            line-height: 2;
            margin: 18px auto;
            max-width: 760px;
        }

    /* TEAM */

    .about-v2 .about-team {
        display: grid;
        grid-template-columns: 1fr 1fr;
        background: #1c1915;
        min-height: 650px;
    }

    .about-v2 .about-team-photo {
        min-height: 600px;
        overflow: hidden;
    }

        .about-v2 .about-team-photo img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
            object-position: center;
        }

    .about-v2 .about-team-content {
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 75px clamp(25px, 5vw, 90px);
    }

    .about-v2 .about-small-line {
        width: 65px;
        height: 1px;
        background: #c49b58;
        margin: 5px 0 25px;
    }

    .about-v2 .about-team-content > p:not(.about-eyebrow) {
        font-size: 16px;
        line-height: 2;
        color: #d7cec1;
    }

    .about-v2 .about-team-content .about-team-quote {
        font-size: 24px !important;
        color: #e0bd82 !important;
        line-height: 1.7 !important;
        margin-top: 25px;
    }

    /* STATS */

    .about-v2 .about-stats {
        background: #f4eee5;
        color: #24201b;
        padding: 75px 25px;
    }

    .about-v2 .about-stats-inner {
        max-width: 1100px;
        margin: auto;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }

    .about-v2 .about-stat {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 12px;
    }

        .about-v2 .about-stat strong {
            color: #a47c40;
            font-size: clamp(36px, 4vw, 58px);
            font-weight: 500;
        }

        .about-v2 .about-stat span {
            font-size: 17px;
            font-weight: 500;
        }

    /* VALUES */

    .about-v2 .about-values {
        background: #10100f;
        padding: 110px 5%;
    }

    .about-v2 .about-section-heading {
        max-width: 750px;
        margin: 0 auto 55px;
        text-align: center;
    }

        .about-v2 .about-section-heading > p:last-child {
            color: #d7cec1;
            line-height: 1.8;
            font-size: 17px;
        }

    .about-v2 .about-values-grid {
        max-width: 1200px;
        margin: auto;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }

    .about-v2 .about-value {
        background: #1b1916;
        border: 1px solid rgba(196,155,88,.25);
        padding: 40px 30px;
        min-height: 300px;
        transition: transform .3s, border-color .3s;
    }

        .about-v2 .about-value:hover {
            transform: translateY(-5px);
            border-color: #c49b58;
        }

    .about-v2 .about-value-number {
        display: block;
        color: #c49b58;
        margin-bottom: 22px;
    }

    .about-v2 .about-value svg {
        width: 38px;
        height: 38px;
        color: #c49b58;
        stroke-width: 1.5;
    }

    .about-v2 .about-value h3 {
        font-size: 25px;
        margin: 22px 0 12px;
    }

    .about-v2 .about-value p {
        color: #d7cec1;
        line-height: 1.9;
        font-size: 15px;
    }

    /* EXPERIENCE */

    .about-v2 .about-experience {
        display: grid;
        grid-template-columns: 1fr 1fr;
        background: #f4eee5;
        color: #24201b;
    }

    .about-v2 .about-experience-photo {
        min-height: 530px;
        overflow: hidden;
    }

        .about-v2 .about-experience-photo img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

    .about-v2 .about-experience-content {
        padding: 80px clamp(25px, 5vw, 85px);
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

        .about-v2 .about-experience-content > p:not(.about-eyebrow) {
            color: #665b50;
            font-size: 17px;
            line-height: 2;
        }

    .about-v2 .about-text-link {
        color: #92703c;
        font-weight: 600;
        text-decoration: none;
        margin-top: 25px;
        align-self: flex-start;
        border-bottom: 1px solid #92703c;
        padding-bottom: 8px;
    }

    /* CTA */

    .about-v2 .about-cta {
        text-align: center;
        padding: 115px 25px;
        background: radial-gradient( circle at center, rgba(196,155,88,.15), transparent 65% ), #10100f;
    }

        .about-v2 .about-cta > p:not(.about-eyebrow) {
            color: #d7cec1;
            font-size: 18px;
            line-height: 1.9;
            max-width: 650px;
            margin: 0 auto 30px;
        }

    .about-v2 .about-cta-buttons {
        display: flex;
        justify-content: center;
        gap: 15px;
        flex-wrap: wrap;
    }

    .about-v2 .about-footer {
        background: #0c0b0a;
        border-top: 1px solid rgba(196,155,88,.2);
        color: #cbbfac;
        text-align: center;
        padding: 28px 15px;
        font-size: 13px;
    }

/* NAVIGATION */

@media (min-width: 801px) {

    .about-v2 .site-nav-links {
        gap: 12px !important;
    }

    .about-v2 .nav-services-menu {
        top: 100% !important;
        margin-top: 0 !important;
    }
}

/* TABLET */

@media (max-width: 950px) {

    .about-v2 .about-team,
    .about-v2 .about-experience {
        grid-template-columns: 1fr;
    }

    .about-v2 .about-team-photo,
    .about-v2 .about-experience-photo {
        min-height: 400px;
        max-height: 550px;
    }

    .about-v2 .about-values-grid {
        grid-template-columns: 1fr;
    }

    .about-v2 .about-value {
        min-height: 0;
    }
}

/* MOBILE */

@media (max-width: 800px) {

    .about-v2 .nav-services {
        border-bottom: 1px solid rgba(196,155,88,.15);
    }

    .about-v2 .nav-services-menu {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    .about-v2 .nav-services.is-open .nav-services-menu {
        display: flex !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .about-v2 .about-hero {
        min-height: 590px;
        padding: 80px 22px;
    }

    .about-v2 .about-intro,
    .about-v2 .about-values,
    .about-v2 .about-cta {
        padding: 75px 22px;
    }

    .about-v2 .about-team-content,
    .about-v2 .about-experience-content {
        padding: 65px 25px;
    }

    .about-v2 .about-stats {
        padding: 55px 15px;
    }

    .about-v2 .about-stats-inner {
        gap: 10px;
    }

    .about-v2 .about-stat strong {
        font-size: clamp(25px, 6vw, 38px);
    }

    .about-v2 .about-stat span {
        font-size: 12px;
    }

    .about-v2 .about-value {
        padding: 28px 25px;
    }

    .about-v2 .about-cta-buttons {
        flex-direction: column;
        align-items: center;
    }

        .about-v2 .about-cta-buttons a {
            width: min(100%, 330px);
            box-sizing: border-box;
        }
}

@media (max-width: 480px) {

    .about-v2 .about-hero h1 {
        font-size: 42px;
    }

    .about-v2 .about-team-photo {
        min-height: 320px;
    }

    .about-v2 .about-intro > p:not(.about-eyebrow),
    .about-v2 .about-team-content > p:not(.about-eyebrow) {
        font-size: 15px;
    }

    .about-v2 .about-value h3 {
        font-size: 22px;
    }
}

@media (prefers-reduced-motion: reduce) {

    .about-v2 .about-value {
        transition: none;
    }
}

/* =========================================
   ABOUT - 3 VALUE CARDS MOBILE LAYOUT
   ========================================= */

@media (max-width: 600px) {

    .about-v2 .about-values-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }

    /* שני הריבועים הראשונים */
    .about-v2 .about-value {
        min-height: 220px !important;
        padding: 20px 14px !important;
        box-sizing: border-box;
    }

        /* הריבוע השלישי - לרוחב שתי העמודות */
        .about-v2 .about-value:last-child {
            grid-column: 1 / -1;
            min-height: 165px !important;
            text-align: center;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }

            .about-v2 .about-value:last-child p {
                max-width: 290px;
            }
}