/* =====================================================
   AMAN INTRO
===================================================== */

.aman-intro {

    --aman-green: #062b27;
    --aman-gold: #fdbd06;
    --aman-cream: #fbf8f0;

    position: relative;

    overflow: hidden;

    padding:
        50px 0
        65px;

    background:

        radial-gradient(
            ellipse at 50% -20%,
            rgba(253,189,6,.10),
            transparent 55%
        ),

        var(--aman-cream);

    font-family:
        'Montserrat',
        Arial,
        sans-serif;
}


/* =====================================================
   CONTENT
===================================================== */

.aman-intro-content {

    position: relative;

    z-index: 5;

    width: min(950px, 92%);

    margin: 0 auto;

    text-align: center;

}


/* =====================================================
   BRAND
===================================================== */

.aman-intro-brand {

    display: flex;

    align-items: center;
    justify-content: center;

    gap: 18px;

    margin-bottom: 21px;

    color: #987000;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 3px;

}


.aman-intro-brand > span {

    width: 35px;

    height: 1px;

    background:

        linear-gradient(
            90deg,
            transparent,
            var(--aman-gold)
        );

}


.aman-intro-brand > span:last-child {

    transform: scaleX(-1);

}


.aman-intro-brand i {

    display: inline-block;

    width: 5px;
    height: 5px;

    margin:
        0 10px
        2px;

    background:
        var(--aman-gold);

    transform:
        rotate(45deg);

}


/* =====================================================
   ORNAMENT
===================================================== */

.aman-ornament {

    display: flex;

    align-items: center;
    justify-content: center;

    width: min(410px, 90%);

    margin:
        0 auto
        27px;

    color:
        #c89100;

}


.aman-ornament svg {

    display: block;

    width: 92px;
    height: 55px;

    margin:
        0 13px;

}


.aman-ornament-line {

    flex: 1;

    height: 1px;

    background:

        linear-gradient(
            90deg,
            transparent,
            rgba(253,189,6,.8)
        );

}


.aman-ornament-line:last-child {

    transform:
        scaleX(-1);

}


/* =====================================================
   TEXT
===================================================== */

.aman-intro-text {

    margin: 0;

    color:
        #293a36;

    font-size:
        21px;

    font-weight:
        400;

    line-height:
        1.95;

    letter-spacing:
        -.15px;

}


.aman-intro-text strong {

    position:
        relative;

    color:
        var(--aman-green);

    font-weight:
        700;

    white-space:
        nowrap;

}


/* underline */

.aman-intro-text strong::after {

    content: "";

    position:
        absolute;

    left: 2%;
    right: 2%;

    bottom:
        -5px;

    height:
        2px;

    background:

        linear-gradient(
            90deg,
            transparent,
            var(--aman-gold) 18%,
            var(--aman-gold) 82%,
            transparent
        );

}


/* =====================================================
   BOTTOM DECORATION
===================================================== */

.aman-intro-end {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        8px;

    margin-top:
        31px;

}


.aman-intro-end span {

    width:
        42px;

    height:
        1px;

    background:

        linear-gradient(
            90deg,
            transparent,
            rgba(200,145,0,.7)
        );

}


.aman-intro-end span:last-child {

    transform:
        scaleX(-1);

}


.aman-intro-end i {

    display:
        block;

    width:
        6px;

    height:
        6px;

    border:
        1px solid
        #c89100;

    transform:
        rotate(45deg);

}


/* =====================================================
   MOUNTAINS
===================================================== */

.aman-intro-mountains {

    position:
        absolute;

    z-index:
        1;

    left:
        0;

    right:
        0;

    bottom:
        -3px;

    height:
        175px;

    color:
        var(--aman-green);

    opacity:
        .035;

    pointer-events:
        none;

}


.aman-intro-mountains svg {

    display:
        block;

    width:
        100%;

    height:
        100%;

}


/* =====================================================
   ADDITIONAL SOFT LINE ABOVE MOUNTAINS
===================================================== */

.aman-intro::after {

    content:
        "";

    position:
        absolute;

    z-index:
        2;

    left:
        20%;

    right:
        20%;

    bottom:
        93px;

    height:
        1px;

    background:

        linear-gradient(
            90deg,
            transparent,
            rgba(253,189,6,.12),
            transparent
        );

}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 991px) {

    .aman-intro {

        padding:
            78px 0
            110px;

    }


    .aman-intro-content {

        width:
            min(800px, 92%);

    }


    .aman-intro-text {

        font-size:
            19px;

        line-height:
            1.9;

    }


    .aman-intro-mountains {

        height:
            145px;

    }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 767px) {

    .aman-intro {

        padding:
            60px 0
            90px;

    }


    .aman-intro-content {

        width:
            91%;

    }


    .aman-intro-brand {

        gap:
            10px;

        font-size:
            9px;

        letter-spacing:
            1.8px;

    }


    .aman-intro-brand > span {

        width:
            18px;

    }


    .aman-intro-brand i {

        margin:
            0 6px 2px;

    }


    .aman-ornament {

        width:
            280px;

        margin-bottom:
            21px;

    }


    .aman-ornament svg {

        width:
            78px;

        height:
            48px;

        margin:
            0 8px;

    }


    .aman-intro-text {

        font-size:
            17px;

        line-height:
            1.82;

    }


    .aman-intro-mountains {

        height:
            110px;

        opacity:
            .04;

    }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 430px) {

    .aman-intro {

        padding:
            52px 0
            80px;

    }


    .aman-intro-brand > span {

        display:
            none;

    }


    .aman-intro-brand {

        letter-spacing:
            1.4px;

    }


    .aman-intro-text {

        font-size:
            16px;

        line-height:
            1.78;

    }


    .aman-intro-text strong {

        white-space:
            normal;

    }


    .aman-intro-mountains {

        height:
            90px;

    }

}