/* =========================================================
   ADMISSIONMANTRA
   ABOUT US PAGE

   IMPORTANT:
   - NO :root inside this file
   - Typography comes from style.css
   - Colors come from style.css
   - Buttons come from style.css
   - Radius / shadows / spacing come from style.css
   - Only page-specific layout remains here
========================================================= */


/* =========================================================
   GLOBAL ABOUT PAGE ANIMATION KEYFRAMES
========================================================= */

@keyframes amFadeUp {

    from {
        opacity: 0;
        transform:
            translateY(48px);
    }

    to {
        opacity: 1;
        transform:
            translateY(0);
    }
}


@keyframes amFadeDown {

    from {
        opacity: 0;
        transform:
            translateY(-42px);
    }

    to {
        opacity: 1;
        transform:
            translateY(0);
    }
}


@keyframes amFadeLeft {

    from {
        opacity: 0;
        transform:
            translateX(-60px);
    }

    to {
        opacity: 1;
        transform:
            translateX(0);
    }
}


@keyframes amFadeRight {

    from {
        opacity: 0;
        transform:
            translateX(60px);
    }

    to {
        opacity: 1;
        transform:
            translateX(0);
    }
}


@keyframes amZoomIn {

    from {
        opacity: 0;
        transform:
            scale(.88);
    }

    to {
        opacity: 1;
        transform:
            scale(1);
    }
}


@keyframes amZoomOut {

    from {
        opacity: 0;
        transform:
            scale(1.12);
    }

    to {
        opacity: 1;
        transform:
            scale(1);
    }
}


@keyframes amSoftFloat {

    0%,
    100% {
        transform:
            translateY(0);
    }

    50% {
        transform:
            translateY(-8px);
    }
}


@keyframes amSoftPulse {

    0%,
    100% {
        transform:
            scale(1);
    }

    50% {
        transform:
            scale(1.035);
    }
}



/* =========================================================
   01. ABOUT HERO
========================================================= */

.am-about-hero {
    position: relative;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 80% 20%,
            color-mix(
                in srgb,
                var(--am-secondary) 11%,
                transparent
            ),
            transparent 34%
        ),
        var(--am-gradient-soft-blue);
}


/* =========================================================
   HERO CONTAINER
========================================================= */

.am-about-hero__container {
    width:
        min(
            var(--am-container-wide),
            calc(100% - var(--am-space-9))
        );

    min-height:
        650px;

    margin-inline:
        auto;

    display:
        grid;

    grid-template-columns:
        minmax(0, .9fr)
        minmax(500px, 1.1fr);

    align-items:
        center;

    gap:
        var(--am-space-7);

    position:
        relative;
}


/* =========================================================
   HERO LEFT CONTENT
========================================================= */

.am-about-hero__content {
    position:
        relative;

    z-index:
        4;

    max-width:
        625px;

    padding:
        var(--am-space-12)
        0;

    animation:
        amFadeLeft
        .85s
        cubic-bezier(.22, 1, .36, 1)
        both;
}


/* =========================================================
   HERO EYEBROW
========================================================= */

.am-about-hero__eyebrow {
    display:
        flex;

    align-items:
        center;

    gap:
        var(--am-space-3);

    margin-bottom:
        var(--am-space-5);

    color:
        var(--am-secondary);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-sm);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-small);

    letter-spacing:
        var(--am-ls-eyebrow);

    text-transform:
        uppercase;
}


.am-about-hero__eyebrow span {
    width:
        var(--am-space-7);

    height:
        2px;

    flex-shrink:
        0;

    background:
        var(--am-accent);

    border-radius:
        var(--am-radius-pill);
}


/* =========================================================
   HERO TITLE
========================================================= */

.am-about-hero__title {
    max-width:
        650px;

    margin:
        0 0
        var(--am-space-6);

    color:
        var(--am-primary);

    font-family:
        var(--am-font-heading);

    font-size:
        var(--am-fs-hero);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-tight);

    letter-spacing:
        var(--am-ls-heading);
}


.am-about-hero__title strong,
.am-about-hero__title span {
    color:
        var(--am-accent);

    font-weight:
        inherit;
}


/* =========================================================
   HERO DESCRIPTION
========================================================= */

.am-about-hero__description {
    max-width:
        var(--am-text-width);

    margin:
        0 0
        var(--am-space-7);

    color:
        var(--am-text);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-base);

    font-weight:
        var(--am-fw-regular);

    line-height:
        var(--am-lh-body);
}


/* =========================================================
   HERO ACTIONS
========================================================= */

.am-about-hero__actions {
    display:
        flex;

    align-items:
        center;

    flex-wrap:
        wrap;

    gap:
        var(--am-space-4);

    margin-bottom:
        var(--am-space-8);
}


.am-about-hero__actions .am-btn {
    transition:
        transform var(--am-transition),
        box-shadow var(--am-transition),
        background var(--am-transition),
        color var(--am-transition);
}


.am-about-hero__actions .am-btn:hover {
    transform:
        translateY(-3px);
}


/* PLAY ICON */

.am-about-hero__play {
    width:
        var(--am-icon-sm);

    height:
        var(--am-icon-sm);

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        var(--am-white);

    background:
        var(--am-secondary);

    border-radius:
        var(--am-radius-circle);

    font-size:
        var(--am-fs-xs);
}


/* =========================================================
   HERO TRUST ITEMS
========================================================= */

.am-about-hero__trust {
    display:
        flex;

    align-items:
        center;

    gap:
        var(--am-space-7);
}


.am-about-hero__trust-item {
    display:
        flex;

    align-items:
        center;

    gap:
        var(--am-space-3);

    color:
        var(--am-text);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-base);

    font-weight:
        var(--am-fw-regular);

    line-height:
        var(--am-lh-small);

    transition:
        transform var(--am-transition);
}


.am-about-hero__trust-item:hover {
    transform:
        translateY(-3px);
}


.am-about-hero__trust-item strong {
    display:
        block;

    color:
        var(--am-primary);

    font-weight:
        var(--am-fw-bold);
}


.am-about-hero__trust-icon {
    width:
        var(--am-icon-md);

    height:
        var(--am-icon-md);

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex-shrink:
        0;

    color:
        var(--am-secondary);

    background:
        var(--am-bg-blue);

    border-radius:
        var(--am-radius-circle);

    font-size:
        var(--am-fs-md);
}


/* =========================================================
   HERO RIGHT VISUAL
========================================================= */

.am-about-hero__visual {
    position:
        relative;

    min-height:
        458px;

    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        center;

    animation:
        amFadeRight
        .95s
        .15s
        cubic-bezier(.22, 1, .36, 1)
        both;
}


/* =========================================================
   HERO BACKGROUND SHAPE
========================================================= */

.am-about-hero__shape {
    position:
        absolute;

    width:
        570px;

    height:
        570px;

    right:
        -60px;

    bottom:
        -50px;

    background:
        linear-gradient(
            145deg,
            var(--am-bg-blue),
            var(--am-secondary-light)
        );

    border-radius:
        48% 52% 0 45%;

    animation:
        amSoftPulse
        6s
        ease-in-out
        infinite;
}


/* =========================================================
   HERO IMAGE
========================================================= */

.am-about-hero__image {
    position:
        relative;

    z-index:
        2;

    width:
        100%;

    max-width:
        780px;

    max-height:
        630px;

    object-fit:
        contain;

    object-position:
        center bottom;

    filter:
        drop-shadow(
            0
            var(--am-space-6)
            var(--am-space-8)
            color-mix(
                in srgb,
                var(--am-primary) 14%,
                transparent
            )
        );

    animation:
        amZoomIn
        1s
        .25s
        cubic-bezier(.22, 1, .36, 1)
        both;
}


/* =========================================================
   HERO NOTE
========================================================= */

.am-about-hero__note {
    position:
        absolute;

    z-index:
        4;

    right:
        var(--am-space-2);

    top:
        var(--am-space-10);

    color:
        var(--am-secondary);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-md);

    font-weight:
        var(--am-fw-medium);

    font-style:
        italic;

    line-height:
        var(--am-lh-title);

    text-align:
        center;

    transform:
        rotate(-5deg);

    animation:
        amFadeDown
        .8s
        .6s
        ease
        both;
}


.am-about-hero__note span {
    display:
        block;

    color:
        var(--am-primary);

    font-size:
        var(--am-fs-lg);

    font-weight:
        var(--am-fw-semibold);
}


/* =========================================================
   HERO FLOATING CARD
========================================================= */

.am-about-hero__floating-card {
    position:
        absolute;

    z-index:
        5;

    right:
        var(--am-space-3);

    bottom:
        var(--am-space-9);

    display:
        flex;

    align-items:
        center;

    gap:
        var(--am-space-3);

    padding:
        var(--am-space-3)
        var(--am-space-5);

    color:
        var(--am-primary);

    background:
        color-mix(
            in srgb,
            var(--am-white) 94%,
            transparent
        );

    border:
        1px solid var(--am-border);

    border-radius:
        var(--am-radius-md);

    box-shadow:
        var(--am-shadow-md);

    backdrop-filter:
        blur(var(--am-space-3));

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-xs);

    font-weight:
        var(--am-fw-regular);

    line-height:
        var(--am-lh-small);

    animation:
        amFadeUp
        .8s
        .8s
        ease
        both;
}


.am-about-hero__floating-card strong {
    display:
        block;

    color:
        var(--am-heading);

    font-weight:
        var(--am-fw-bold);
}


.am-about-hero__floating-icon {
    width:
        var(--am-icon-md);

    height:
        var(--am-icon-md);

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex-shrink:
        0;

    color:
        var(--am-secondary);

    background:
        var(--am-bg-blue);

    border-radius:
        var(--am-radius-circle);

    font-size:
        var(--am-fs-md);
}



/* =========================================================
   02. ABOUT STATS
========================================================= */

.am-about-stats {
    position:
        relative;

    z-index:
        10;

    padding:
        var(--am-space-5)
        0;

    background:
        var(--am-white);

    border-top:
        1px solid var(--am-border);

    border-bottom:
        1px solid var(--am-border);

    box-shadow:
        var(--am-shadow-sm);
}


/* =========================================================
   STATS GRID
========================================================= */

.am-about-stats__grid {
    display:
        grid;

    grid-template-columns:
        repeat(5, minmax(0, 1fr));
}


/* =========================================================
   STAT ITEM
========================================================= */

.am-about-stat {
    position:
        relative;

    min-height:
        110px;

    display:
        flex;

    align-items:
        center;

    gap:
        var(--am-space-4);

    padding:
        var(--am-space-5)
        var(--am-space-6);

    transition:
        transform var(--am-transition),
        background var(--am-transition);
}


.am-about-stat:hover {
    transform:
        translateY(-4px);

    background:
        var(--am-bg-soft);
}


.am-about-stat:not(:last-child)::after {
    content:
        "";

    position:
        absolute;

    right:
        0;

    top:
        20%;

    width:
        1px;

    height:
        60%;

    background:
        var(--am-border);
}


/* =========================================================
   STAT ICON
========================================================= */

.am-about-stat__icon {
    width:
        var(--am-icon-lg);

    height:
        var(--am-icon-lg);

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex-shrink:
        0;

    color:
        var(--am-secondary);

    background:
        var(--am-bg-blue);

    border-radius:
        var(--am-radius-circle);

    font-size:
        var(--am-fs-xl);
}


.am-about-stat__icon--accent {
    color:
        var(--am-accent);

    background:
        var(--am-accent-soft);
}


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

.am-about-stat__content {
    min-width:
        0;
}


.am-about-stat__content > strong {
    display:
        block;

    margin-bottom:
        var(--am-space-1);

    color:
        var(--am-primary);

    font-family:
        var(--am-font-heading);

    font-size:
        var(--am-fs-h4);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-tight);

    letter-spacing:
        var(--am-ls-title);
}


.am-about-stat__title {
    display:
        block;

    margin-bottom:
        var(--am-space-1);

    color:
        var(--am-heading);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-sm);

    font-weight:
        var(--am-fw-bold);

    line-height:
        var(--am-lh-title);
}


.am-about-stat__content small {
    display:
        block;

    color:
        var(--am-text);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-xs);

    font-weight:
        var(--am-fw-regular);

    line-height:
        var(--am-lh-small);
}



/* =========================================================
   03. ABOUT STORY / MISSION / VISION
========================================================= */

.am-about-story {
    position:
        relative;

    padding:
        var(--am-section-space)
        0;

    overflow:
        hidden;

    background:
        linear-gradient(
            180deg,
            var(--am-white) 0%,
            var(--am-bg-soft) 100%
        );
}


/* =========================================================
   STORY CONTAINER
========================================================= */

.am-about-story__container {
    width:
        min(
            var(--am-container-wide),
            calc(100% - var(--am-space-9))
        );

    margin-inline:
        auto;

    display:
        grid;

    grid-template-columns:
        minmax(0, .95fr)
        minmax(280px, .72fr)
        minmax(0, 1fr);

    align-items:
        stretch;

    gap:
        var(--am-space-7);

    padding:
        var(--am-space-7);

    background:
        var(--am-white);

    border:
        1px solid var(--am-border);

    border-radius:
        var(--am-radius-xl);

    box-shadow:
        var(--am-shadow-sm);
}


/* =========================================================
   STORY LEFT CONTENT
========================================================= */

.am-about-story__content {
    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    padding:
        var(--am-space-3)
        var(--am-space-2);
}


/* =========================================================
   STORY EYEBROW
========================================================= */

.am-about-story__eyebrow {
    display:
        flex;

    align-items:
        center;

    gap:
        var(--am-space-3);

    margin-bottom:
        var(--am-space-4);

    color:
        var(--am-accent);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-xs);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-small);

    letter-spacing:
        var(--am-ls-eyebrow);

    text-transform:
        uppercase;
}


.am-about-story__eyebrow span {
    width:
        var(--am-space-7);

    height:
        2px;

    background:
        var(--am-accent);

    border-radius:
        var(--am-radius-pill);
}


/* =========================================================
   STORY TITLE
========================================================= */

.am-about-story__title {
    max-width:
        470px;

    margin:
        0 0
        var(--am-space-5);

    color:
        var(--am-primary);

    font-family:
        var(--am-font-heading);

    font-size:
        var(--am-fs-h3);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-heading);

    letter-spacing:
        var(--am-ls-heading);
}


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

.am-about-story__content p {
    max-width:
        520px;

    margin:
        0 0
        var(--am-space-4);

    color:
        var(--am-text);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-sm);

    font-weight:
        var(--am-fw-regular);

    line-height:
        var(--am-lh-body);
}


.am-about-story__content p strong {
    color:
        var(--am-primary);

    font-weight:
        var(--am-fw-bold);
}


/* =========================================================
   STORY QUOTE
========================================================= */

.am-about-story__quote {
    position:
        relative;

    margin:
        var(--am-space-2)
        0
        var(--am-space-5);

    padding-left:
        var(--am-space-5);

    color:
        var(--am-secondary);

    border-left:
        3px solid var(--am-accent);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-sm);

    font-weight:
        var(--am-fw-semibold);

    font-style:
        italic;

    line-height:
        var(--am-lh-body);
}


/* =========================================================
   STORY SIGNATURE
========================================================= */

.am-about-story__signature {
    display:
        flex;

    flex-direction:
        column;

    gap:
        var(--am-space-1);

    margin-top:
        var(--am-space-2);
}


.am-about-story__signature-mark {
    color:
        var(--am-primary);

    font-family:
        var(--am-font-heading);

    font-size:
        var(--am-fs-lg);

    font-weight:
        var(--am-fw-semibold);

    font-style:
        italic;

    line-height:
        var(--am-lh-title);

    transform:
        rotate(-3deg);

    transform-origin:
        left center;
}


.am-about-story__signature strong {
    color:
        var(--am-heading);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-sm);

    font-weight:
        var(--am-fw-bold);
}


/* =========================================================
   STORY CENTER IMAGE
========================================================= */

.am-about-story__visual {
    position:
        relative;

    min-height:
        470px;

    overflow:
        hidden;

    background:
        var(--am-bg-blue);

    border-radius:
        var(--am-radius-lg);

    box-shadow:
        var(--am-shadow-sm);
}


.am-about-story__visual img {
    width:
        100%;

    height:
        100%;

    display:
        block;

    object-fit:
        cover;

    object-position:
        center;

    transition:
        transform
        var(--am-transition-slow);
}


.am-about-story__visual:hover img {
    transform:
        scale(1.04);
}


/* =========================================================
   STORY IMAGE NOTE
========================================================= */

.am-about-story__image-note {
    position:
        absolute;

    top:
        var(--am-space-8);

    left:
        50%;

    width:
        180px;

    color:
        var(--am-primary);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-md);

    font-weight:
        var(--am-fw-medium);

    font-style:
        italic;

    line-height:
        var(--am-lh-title);

    text-align:
        center;

    transform:
        translateX(-50%)
        rotate(-5deg);
}


.am-about-story__image-note span {
    display:
        block;

    color:
        var(--am-secondary);

    font-size:
        var(--am-fs-lg);

    font-weight:
        var(--am-fw-semibold);
}


.am-about-story__image-note::after {
    content:
        "";

    display:
        block;

    width:
        var(--am-space-11);

    height:
        3px;

    margin:
        var(--am-space-2)
        auto
        0;

    background:
        var(--am-accent);

    border-radius:
        var(--am-radius-pill);

    transform:
        rotate(-4deg);
}


/* =========================================================
   MISSION / VISION
========================================================= */

.am-about-story__purpose {
    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;
}


.am-about-story__purpose-title {
    margin:
        0 0
        var(--am-space-5);

    color:
        var(--am-primary);

    font-family:
        var(--am-font-heading);

    font-size:
        var(--am-fs-h3);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-title);

    letter-spacing:
        var(--am-ls-title);
}


/* =========================================================
   PURPOSE CARD
========================================================= */

.am-purpose-card {
    display:
        grid;

    grid-template-columns:
        auto 1fr;

    align-items:
        flex-start;

    gap:
        var(--am-space-4);

    padding:
        var(--am-space-6);

    border:
        1px solid transparent;

    border-radius:
        var(--am-radius-lg);

    transition:
        transform var(--am-transition),
        box-shadow var(--am-transition);
}


.am-purpose-card +
.am-purpose-card {
    margin-top:
        var(--am-space-4);
}


.am-purpose-card:hover {
    transform:
        translateY(
            calc(var(--am-space-1) * -1)
        );

    box-shadow:
        var(--am-shadow-md);
}


/* MISSION */

.am-purpose-card--mission {
    background:
        var(--am-gradient-soft-warm);

    border-color:
        var(--am-border-accent);
}


.am-purpose-card--mission
.am-purpose-card__icon {
    color:
        var(--am-accent);

    background:
        var(--am-accent-soft);
}


.am-purpose-card--mission h4 {
    color:
        var(--am-accent-hover);
}


/* VISION */

.am-purpose-card--vision {
    background:
        var(--am-gradient-soft-blue);

    border-color:
        var(--am-border-secondary);
}


.am-purpose-card--vision
.am-purpose-card__icon {
    color:
        var(--am-secondary);

    background:
        var(--am-secondary-light);
}


.am-purpose-card--vision h4 {
    color:
        var(--am-secondary);
}


/* =========================================================
   PURPOSE ICON
========================================================= */

.am-purpose-card__icon {
    width:
        var(--am-icon-lg);

    height:
        var(--am-icon-lg);

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex-shrink:
        0;

    border-radius:
        var(--am-radius-circle);
}


.am-purpose-card__icon svg {
    width:
        var(--am-icon-sm);

    height:
        var(--am-icon-sm);

    fill:
        none;

    stroke:
        currentColor;

    stroke-width:
        1.8;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


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

.am-purpose-card__content h4 {
    margin:
        var(--am-space-1)
        0
        var(--am-space-2);

    font-family:
        var(--am-font-heading);

    font-size:
        var(--am-fs-h4);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-title);

    letter-spacing:
        var(--am-ls-title);
}


.am-purpose-card__content p {
    margin:
        0;

    color:
        var(--am-text);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-sm);

    font-weight:
        var(--am-fw-regular);

    line-height:
        var(--am-lh-body);
}



/* =========================================================
   04. WHY STUDENTS & PARENTS TRUST US
========================================================= */

.am-trust-section {
    position:
        relative;

    padding:
        var(--am-section-space)
        0;

    overflow:
        hidden;

    background:
        linear-gradient(
            180deg,
            var(--am-bg-soft) 0%,
            var(--am-white) 100%
        );
}


/* =========================================================
   TRUST GRID
========================================================= */

.am-trust-grid {
    max-width:
        1120px;

    margin:
        var(--am-space-10)
        auto
        0;

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    column-gap:
        var(--am-space-12);

    row-gap:
        var(--am-space-10);
}


/* =========================================================
   TRUST ITEM
========================================================= */

.am-trust-item {
    display:
        grid;

    grid-template-columns:
        150px
        minmax(0, 1fr);

    align-items:
        center;

    gap:
        var(--am-space-7);

    min-width:
        0;
}


/* =========================================================
   TRUST ICON
========================================================= */

.am-trust-item__icon {
    position:
        relative;

    width:
        142px;

    height:
        142px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex-shrink:
        0;

    border-radius:
        var(--am-radius-circle);

    transition:
        transform var(--am-transition),
        box-shadow var(--am-transition);
}


.am-trust-item:hover
.am-trust-item__icon {
    transform:
        translateY(-6px)
        scale(1.03);

    box-shadow:
        var(--am-shadow-md);
}


.am-trust-item__icon svg {
    width:
        var(--am-icon-lg);

    height:
        var(--am-icon-lg);

    fill:
        none;

    stroke:
        currentColor;

    stroke-width:
        2.3;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


/* BLUE */

.am-trust-item--blue
.am-trust-item__icon {
    color:
        var(--am-secondary);

    background:
        var(--am-medical-soft);
}


/* ORANGE */

.am-trust-item--orange
.am-trust-item__icon {
    color:
        var(--am-accent);

    background:
        var(--am-engineering-soft);
}


/* GREEN */

.am-trust-item--green
.am-trust-item__icon {
    color:
        var(--am-management);

    background:
        var(--am-management-soft);
}


/* PURPLE */

.am-trust-item--purple
.am-trust-item__icon {
    color:
        var(--am-allied);

    background:
        var(--am-allied-soft);
}


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

.am-trust-item__content {
    min-width:
        0;
}


.am-trust-item__content h3 {
    margin:
        0 0
        var(--am-space-3);

    color:
        var(--am-primary);

    font-family:
        var(--am-font-heading);

    font-size:
        var(--am-fs-h4);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-title);

    letter-spacing:
        var(--am-ls-title);
}


.am-trust-item__content p {
    max-width:
        390px;

    margin:
        0 0
        var(--am-space-4);

    color:
        var(--am-text);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-sm);

    font-weight:
        var(--am-fw-regular);

    line-height:
        var(--am-lh-body);
}


/* =========================================================
   TRUST LINK
========================================================= */

.am-trust-item__link {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        var(--am-space-2);

    color:
        var(--am-secondary);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-sm);

    font-weight:
        var(--am-fw-bold);

    line-height:
        var(--am-lh-small);

    transition:
        color var(--am-transition-fast);
}


.am-trust-item__link span {
    display:
        inline-block;

    color:
        var(--am-accent);

    font-size:
        var(--am-fs-lg);

    transition:
        transform var(--am-transition-fast);
}


.am-trust-item__link:hover {
    color:
        var(--am-primary);
}


.am-trust-item__link:hover span {
    transform:
        translateX(var(--am-space-1));
}


/* =========================================================
   TRUST ICON DECORATION
========================================================= */

.am-trust-item__icon::before,
.am-trust-item__icon::after {
    content:
        "";

    position:
        absolute;

    width:
        var(--am-space-1);

    border-radius:
        var(--am-radius-pill);

    background:
        currentColor;
}


.am-trust-item__icon::before {
    top:
        calc(var(--am-space-3) * -1);

    left:
        var(--am-space-5);

    height:
        var(--am-space-4);

    transform:
        rotate(-28deg);
}


.am-trust-item__icon::after {
    top:
        calc(var(--am-space-5) * -1);

    left:
        var(--am-space-8);

    height:
        var(--am-space-3);

    transform:
        rotate(-8deg);
}


/* =========================================================
   TRUST FOOTER
========================================================= */

.am-trust-footer {
    max-width:
        var(--am-container-small);

    margin:
        var(--am-space-11)
        auto
        0;

    display:
        grid;

    grid-template-columns:
        1fr auto 1fr;

    align-items:
        center;

    gap:
        var(--am-space-6);
}


.am-trust-footer > span {
    width:
        100%;

    height:
        1px;

    background:
        var(--am-border-dark);
}


.am-trust-footer__center {
    display:
        flex;

    align-items:
        center;

    gap:
        var(--am-space-3);
}


.am-trust-footer__center svg {
    width:
        var(--am-icon-sm);

    height:
        var(--am-icon-sm);

    flex-shrink:
        0;

    fill:
        none;

    stroke:
        var(--am-primary);

    stroke-width:
        2;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


.am-trust-footer__center p {
    margin:
        0;

    color:
        var(--am-text);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-xs);

    font-weight:
        var(--am-fw-semibold);

    letter-spacing:
        var(--am-ls-eyebrow);

    line-height:
        var(--am-lh-small);

    text-transform:
        uppercase;

    white-space:
        nowrap;
}


.am-trust-footer__center strong {
    color:
        var(--am-primary);

    font-weight:
        var(--am-fw-extrabold);
}



/* =========================================================
   05. TESTIMONIALS
========================================================= */

.am-testimonials {
    position:
        relative;

    padding:
        var(--am-section-space)
        0;

    background:
        linear-gradient(
            180deg,
            var(--am-white) 0%,
            var(--am-bg-soft) 100%
        );
}


/* =========================================================
   TESTIMONIAL LAYOUT
========================================================= */

.am-testimonials__layout {
    max-width:
        1140px;

    margin:
        var(--am-space-9)
        auto
        0;

    display:
        grid;

    grid-template-columns:
        1.1fr
        .9fr;

    gap:
        var(--am-space-6);
}


/* =========================================================
   FEATURED TESTIMONIAL
========================================================= */

.am-testimonial-featured {
    position:
        relative;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        space-between;

    min-height:
        360px;

    padding:
        var(--am-space-8);

    overflow:
        hidden;

    background:
        var(--am-gradient-primary);

    border-radius:
        var(--am-radius-xl);

    box-shadow:
        var(--am-shadow-md);

    transition:
        transform var(--am-transition),
        box-shadow var(--am-transition);
}


.am-testimonial-featured:hover {
    transform:
        translateY(-5px);

    box-shadow:
        var(--am-shadow-lg);
}


.am-testimonial-featured::after {
    content:
        "";

    position:
        absolute;

    width:
        260px;

    height:
        260px;

    right:
        -100px;

    bottom:
        -150px;

    border-radius:
        var(--am-radius-circle);

    background:
        color-mix(
            in srgb,
            var(--am-white) 5%,
            transparent
        );
}


/* =========================================================
   FEATURED TOP
========================================================= */

.am-testimonial-featured__top {
    position:
        relative;

    z-index:
        2;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;
}


.am-testimonial__quote-icon {
    color:
        var(--am-accent);

    font-family:
        var(--am-font-heading);

    font-size:
        var(--am-fs-h1);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-tight);
}


.am-testimonial__rating {
    color:
        var(--am-highlight);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-sm);

    font-weight:
        var(--am-fw-bold);

    letter-spacing:
        var(--am-ls-title);

    white-space:
        nowrap;
}


/* =========================================================
   FEATURED QUOTE
========================================================= */

.am-testimonial-featured blockquote {
    position:
        relative;

    z-index:
        2;

    max-width:
        650px;

    margin:
        var(--am-space-7)
        0;

    color:
        var(--am-white);

    font-family:
        var(--am-font-heading);

    font-size:
        var(--am-fs-h4);

    font-weight:
        var(--am-fw-semibold);

    line-height:
        var(--am-lh-body);

    letter-spacing:
        var(--am-ls-title);
}


/* =========================================================
   FEATURED FOOTER
========================================================= */

.am-testimonial-featured__footer {
    position:
        relative;

    z-index:
        2;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        var(--am-space-5);

    padding-top:
        var(--am-space-5);

    border-top:
        1px solid
        color-mix(
            in srgb,
            var(--am-white) 15%,
            transparent
        );
}


/* =========================================================
   TESTIMONIAL PERSON
========================================================= */

.am-testimonial__person {
    display:
        flex;

    align-items:
        center;

    gap:
        var(--am-space-3);
}


.am-testimonial__person strong,
.am-testimonial-card__person strong {
    display:
        block;

    color:
        var(--am-white);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-sm);

    font-weight:
        var(--am-fw-bold);

    line-height:
        var(--am-lh-title);
}


.am-testimonial__person span {
    display:
        block;

    margin-top:
        var(--am-space-1);

    color:
        color-mix(
            in srgb,
            var(--am-white) 65%,
            transparent
        );

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-xs);

    font-weight:
        var(--am-fw-regular);

    line-height:
        var(--am-lh-small);
}


/* =========================================================
   TESTIMONIAL AVATAR
========================================================= */

.am-testimonial__avatar {
    width:
        var(--am-icon-md);

    height:
        var(--am-icon-md);

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex-shrink:
        0;

    color:
        var(--am-secondary);

    background:
        var(--am-secondary-light);

    border-radius:
        var(--am-radius-circle);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-base);

    font-weight:
        var(--am-fw-extrabold);
}


.am-testimonial__avatar--orange {
    color:
        var(--am-accent);

    background:
        var(--am-accent-soft);
}


.am-testimonial__avatar--green {
    color:
        var(--am-management);

    background:
        var(--am-management-soft);
}


/* =========================================================
   VERIFIED
========================================================= */

.am-testimonial__verified {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        var(--am-space-2);

    color:
        color-mix(
            in srgb,
            var(--am-white) 74%,
            transparent
        );

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-xs);

    font-weight:
        var(--am-fw-semibold);

    line-height:
        var(--am-lh-small);
}


.am-testimonial__verified span {
    width:
        var(--am-space-6);

    height:
        var(--am-space-6);

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        var(--am-white);

    background:
        var(--am-success);

    border-radius:
        var(--am-radius-circle);
}


/* =========================================================
   SIDE TESTIMONIALS
========================================================= */

.am-testimonials__side {
    display:
        grid;

    grid-template-rows:
        repeat(2, 1fr);

    gap:
        var(--am-space-5);
}


.am-testimonial-card {
    padding:
        var(--am-space-6);

    background:
        var(--am-white);

    border:
        1px solid var(--am-border);

    border-radius:
        var(--am-radius-lg);

    box-shadow:
        var(--am-shadow-sm);

    transition:
        transform var(--am-transition),
        box-shadow var(--am-transition),
        border-color var(--am-transition);
}


.am-testimonial-card:hover {
    transform:
        translateY(-5px)
        scale(1.01);

    border-color:
        var(--am-border-secondary);

    box-shadow:
        var(--am-shadow-md);
}


/* =========================================================
   TESTIMONIAL CARD HEADER
========================================================= */

.am-testimonial-card__header {
    display:
        grid;

    grid-template-columns:
        auto 1fr auto;

    align-items:
        center;

    gap:
        var(--am-space-3);

    margin-bottom:
        var(--am-space-5);
}


.am-testimonial-card__person strong {
    color:
        var(--am-primary);
}


.am-testimonial-card__person span {
    display:
        block;

    margin-top:
        var(--am-space-1);

    color:
        var(--am-text);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-xs);

    font-weight:
        var(--am-fw-regular);

    line-height:
        var(--am-lh-small);
}


.am-testimonial-card__quote {
    color:
        var(--am-accent);

    font-family:
        var(--am-font-heading);

    font-size:
        var(--am-fs-h2);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-tight);
}


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

.am-testimonial-card > p {
    margin:
        0 0
        var(--am-space-5);

    color:
        var(--am-text-dark);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-sm);

    font-weight:
        var(--am-fw-regular);

    line-height:
        var(--am-lh-body);
}


/* =========================================================
   TESTIMONIAL TRUST BAR
========================================================= */

.am-testimonials__trust {
    max-width:
        920px;

    margin:
        var(--am-space-9)
        auto
        0;

    padding:
        var(--am-space-5)
        var(--am-space-7);

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        var(--am-space-7);

    background:
        var(--am-white);

    border:
        1px solid var(--am-border);

    border-radius:
        var(--am-radius-lg);

    box-shadow:
        var(--am-shadow-xs);
}


.am-testimonials__trust > div {
    text-align:
        center;
}


.am-testimonials__trust strong {
    display:
        block;

    color:
        var(--am-primary);

    font-family:
        var(--am-font-heading);

    font-size:
        var(--am-fs-base);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-title);
}


.am-testimonials__trust span {
    display:
        block;

    margin-top:
        var(--am-space-1);

    color:
        var(--am-text);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-xs);

    font-weight:
        var(--am-fw-regular);

    line-height:
        var(--am-lh-small);
}


.am-testimonials__trust i {
    width:
        1px;

    height:
        var(--am-space-8);

    background:
        var(--am-border);
}



/* =========================================================
   06. FINAL THIN CTA
========================================================= */

.am-about-final-cta {
    padding:
        var(--am-space-10)
        0
        var(--am-space-12);

    background:
        var(--am-white);
}


/* =========================================================
   CTA BOX
========================================================= */

.am-about-final-cta__box {
    position:
        relative;

    display:
        grid;

    grid-template-columns:
        1.2fr
        .8fr
        auto;

    align-items:
        center;

    gap:
        var(--am-space-7);

    padding:
        var(--am-space-7)
        var(--am-space-8);

    overflow:
        hidden;

    background:
        var(--am-gradient-soft-blue);

    border:
        1px solid var(--am-border-secondary);

    border-radius:
        var(--am-radius-xl);

    box-shadow:
        var(--am-shadow-md);

    transition:
        transform var(--am-transition),
        box-shadow var(--am-transition);
}


.am-about-final-cta__box:hover {
    transform:
        translateY(-3px);

    box-shadow:
        var(--am-shadow-lg);
}


/* =========================================================
   CTA DECORATION
========================================================= */

.am-about-final-cta__box::before {
    content:
        "";

    position:
        absolute;

    width:
        180px;

    height:
        180px;

    left:
        -110px;

    bottom:
        -100px;

    border-radius:
        var(--am-radius-circle);

    background:
        color-mix(
            in srgb,
            var(--am-secondary) 8%,
            transparent
        );
}


.am-about-final-cta__box::after {
    content:
        "";

    position:
        absolute;

    width:
        150px;

    height:
        150px;

    right:
        -80px;

    top:
        -90px;

    border-radius:
        var(--am-radius-circle);

    background:
        color-mix(
            in srgb,
            var(--am-accent) 8%,
            transparent
        );
}


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

.am-about-final-cta__content {
    position:
        relative;

    z-index:
        2;
}


.am-about-final-cta__eyebrow {
    display:
        block;

    margin-bottom:
        var(--am-space-2);

    color:
        var(--am-secondary);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-xs);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-small);

    letter-spacing:
        var(--am-ls-eyebrow);

    text-transform:
        uppercase;
}


.am-about-final-cta__content h2 {
    margin:
        0 0
        var(--am-space-2);

    color:
        var(--am-primary);

    font-family:
        var(--am-font-heading);

    font-size:
        var(--am-fs-h3);

    font-weight:
        var(--am-fw-extrabold);

    line-height:
        var(--am-lh-heading);

    letter-spacing:
        var(--am-ls-heading);
}


.am-about-final-cta__content h2 span {
    color:
        var(--am-accent);

    font-weight:
        inherit;
}


.am-about-final-cta__content p {
    max-width:
        520px;

    margin:
        0;

    color:
        var(--am-text);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-sm);

    font-weight:
        var(--am-fw-regular);

    line-height:
        var(--am-lh-body);
}


/* =========================================================
   CTA BENEFITS
========================================================= */

.am-about-final-cta__benefits {
    position:
        relative;

    z-index:
        2;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        var(--am-space-5);
}


.am-about-final-cta__benefits > div {
    min-width:
        82px;

    text-align:
        center;
}


.am-about-final-cta__benefits strong {
    display:
        block;

    color:
        var(--am-text-dark);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-xs);

    font-weight:
        var(--am-fw-semibold);

    line-height:
        var(--am-lh-small);
}


.am-about-final-cta__dot {
    width:
        var(--am-space-2);

    height:
        var(--am-space-2);

    display:
        block;

    margin:
        0 auto
        var(--am-space-2);

    border-radius:
        var(--am-radius-circle);
}


.am-about-final-cta__dot--blue {
    background:
        var(--am-secondary);
}


.am-about-final-cta__dot--orange {
    background:
        var(--am-accent);
}


.am-about-final-cta__dot--green {
    background:
        var(--am-success);
}


/* =========================================================
   CTA ACTIONS
========================================================= */

.am-about-final-cta__actions {
    position:
        relative;

    z-index:
        2;

    display:
        flex;

    align-items:
        center;

    gap:
        var(--am-space-3);
}


.am-about-final-cta__whatsapp {
    color:
        var(--am-success);
}


/* =========================================================
   CTA BOTTOM
========================================================= */

.am-about-final-cta__bottom {
    max-width:
        var(--am-container-small);

    margin:
        var(--am-space-4)
        auto
        0;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        var(--am-space-4);

    color:
        var(--am-muted);

    font-family:
        var(--am-font);

    font-size:
        var(--am-fs-xs);

    font-weight:
        var(--am-fw-semibold);

    line-height:
        var(--am-lh-small);

    letter-spacing:
        var(--am-ls-title);

    text-transform:
        uppercase;
}


.am-about-final-cta__bottom i {
    width:
        var(--am-space-1);

    height:
        var(--am-space-1);

    background:
        var(--am-border-dark);

    border-radius:
        var(--am-radius-circle);
}


.am-about-final-cta__bottom strong {
    color:
        var(--am-primary);

    font-weight:
        var(--am-fw-bold);
}



/* =========================================================
   SCROLL ANIMATION SYSTEM

   Modern browsers:
   animation starts as sections enter viewport.

   No JavaScript required.
========================================================= */

@supports (animation-timeline: view()) {

    /* =====================================================
       STATS - SLIDE UP
    ===================================================== */

    .am-about-stat {
        animation-name:
            amFadeUp;

        animation-duration:
            1s;

        animation-timing-function:
            cubic-bezier(.22, 1, .36, 1);

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 5%
            cover 30%;
    }


    /* STAGGER FEEL */

    .am-about-stat:nth-child(2) {
        animation-range:
            entry 8%
            cover 32%;
    }


    .am-about-stat:nth-child(3) {
        animation-range:
            entry 11%
            cover 34%;
    }


    .am-about-stat:nth-child(4) {
        animation-range:
            entry 14%
            cover 36%;
    }


    .am-about-stat:nth-child(5) {
        animation-range:
            entry 17%
            cover 38%;
    }


    /* =====================================================
       STORY - LEFT
    ===================================================== */

    .am-about-story__content {
        animation-name:
            amFadeLeft;

        animation-duration:
            1s;

        animation-timing-function:
            cubic-bezier(.22, 1, .36, 1);

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 10%
            cover 38%;
    }


    /* =====================================================
       STORY IMAGE - ZOOM
    ===================================================== */

    .am-about-story__visual {
        animation-name:
            amZoomIn;

        animation-duration:
            1s;

        animation-timing-function:
            cubic-bezier(.22, 1, .36, 1);

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 10%
            cover 38%;
    }


    /* =====================================================
       MISSION/VISION - RIGHT
    ===================================================== */

    .am-about-story__purpose {
        animation-name:
            amFadeRight;

        animation-duration:
            1s;

        animation-timing-function:
            cubic-bezier(.22, 1, .36, 1);

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 10%
            cover 38%;
    }


    /* =====================================================
       SECTION HEADINGS - SLIDE DOWN / UP
    ===================================================== */

    .am-trust-section .am-section-heading,
    .am-testimonials .am-section-heading {
        animation-name:
            amFadeDown;

        animation-duration:
            .9s;

        animation-timing-function:
            cubic-bezier(.22, 1, .36, 1);

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 10%
            cover 28%;
    }


    /* =====================================================
       TRUST ITEMS
       Alternating Left / Right
    ===================================================== */

    .am-trust-item:nth-child(odd) {
        animation-name:
            amFadeLeft;

        animation-duration:
            1s;

        animation-timing-function:
            cubic-bezier(.22, 1, .36, 1);

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 8%
            cover 34%;
    }


    .am-trust-item:nth-child(even) {
        animation-name:
            amFadeRight;

        animation-duration:
            1s;

        animation-timing-function:
            cubic-bezier(.22, 1, .36, 1);

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 8%
            cover 34%;
    }


    /* =====================================================
       TRUST FOOTER
    ===================================================== */

    .am-trust-footer {
        animation-name:
            amFadeUp;

        animation-duration:
            .9s;

        animation-timing-function:
            ease-out;

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 10%
            cover 30%;
    }


    /* =====================================================
       FEATURED TESTIMONIAL
       LEFT SLIDE
    ===================================================== */

    .am-testimonial-featured {
        animation-name:
            amFadeLeft;

        animation-duration:
            1s;

        animation-timing-function:
            cubic-bezier(.22, 1, .36, 1);

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 8%
            cover 35%;
    }


    /* =====================================================
       TESTIMONIAL SIDE
       RIGHT SLIDE
    ===================================================== */

    .am-testimonials__side {
        animation-name:
            amFadeRight;

        animation-duration:
            1s;

        animation-timing-function:
            cubic-bezier(.22, 1, .36, 1);

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 8%
            cover 35%;
    }


    /* =====================================================
       TRUST BAR - ZOOM
    ===================================================== */

    .am-testimonials__trust {
        animation-name:
            amZoomIn;

        animation-duration:
            .9s;

        animation-timing-function:
            cubic-bezier(.22, 1, .36, 1);

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 10%
            cover 30%;
    }


    /* =====================================================
       FINAL CTA - SLIDE UP
    ===================================================== */

    .am-about-final-cta__box {
        animation-name:
            amFadeUp;

        animation-duration:
            1s;

        animation-timing-function:
            cubic-bezier(.22, 1, .36, 1);

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 8%
            cover 35%;
    }


    .am-about-final-cta__bottom {
        animation-name:
            amFadeUp;

        animation-duration:
            .85s;

        animation-timing-function:
            ease-out;

        animation-fill-mode:
            both;

        animation-timeline:
            view();

        animation-range:
            entry 10%
            cover 32%;
    }

}



/* =========================================================
   RESPONSIVE - 1150
========================================================= */

@media (max-width: 1150px) {

    .am-about-hero__container {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(420px, .95fr);
    }


    .am-about-hero__trust {
        gap:
            var(--am-space-4);
    }


    .am-about-stats__grid {
        grid-template-columns:
            repeat(3, 1fr);
    }


    .am-about-stat:nth-child(3)::after {
        display:
            none;
    }


    .am-about-stat:nth-child(n + 4) {
        border-top:
            1px solid var(--am-border);
    }

}



/* =========================================================
   RESPONSIVE - 1100
========================================================= */

@media (max-width: 1100px) {

    .am-about-story__container {
        grid-template-columns:
            1fr
            340px;

        gap:
            var(--am-space-6);
    }


    .am-about-story__purpose {
        grid-column:
            1 / -1;

        display:
            grid;

        grid-template-columns:
            1fr
            1fr;

        gap:
            var(--am-space-4);
    }


    .am-about-story__purpose-title {
        grid-column:
            1 / -1;

        margin-bottom:
            0;
    }


    .am-purpose-card +
    .am-purpose-card {
        margin-top:
            0;
    }

}



/* =========================================================
   RESPONSIVE - 1050
========================================================= */

@media (max-width: 1050px) {

    .am-trust-grid {
        column-gap:
            var(--am-space-8);

        row-gap:
            var(--am-space-9);
    }


    .am-trust-item {
        grid-template-columns:
            115px
            minmax(0, 1fr);

        gap:
            var(--am-space-5);
    }


    .am-trust-item__icon {
        width:
            110px;

        height:
            110px;
    }


    .am-trust-item__icon svg {
        width:
            var(--am-icon-md);

        height:
            var(--am-icon-md);
    }

}



/* =========================================================
   RESPONSIVE - 1000
========================================================= */

@media (max-width: 1000px) {

    .am-testimonials__layout {
        grid-template-columns:
            1fr;
    }


    .am-testimonials__side {
        grid-template-columns:
            repeat(2, 1fr);

        grid-template-rows:
            auto;
    }


    .am-about-final-cta__box {
        grid-template-columns:
            1fr;

        gap:
            var(--am-space-6);
    }


    .am-about-final-cta__benefits {
        justify-content:
            flex-start;
    }


    .am-about-final-cta__actions {
        justify-content:
            flex-start;
    }

}



/* =========================================================
   RESPONSIVE - 900
========================================================= */

@media (max-width: 900px) {

    .am-about-hero__container {
        grid-template-columns:
            1fr;

        padding-top:
            var(--am-space-9);
    }


    .am-about-hero__content {
        max-width:
            var(--am-content-width);

        padding:
            var(--am-space-7)
            0
            0;
    }


    .am-about-hero__visual {
        min-height:
            520px;

        max-width:
            var(--am-content-width);

        width:
            100%;

        margin-inline:
            auto;
    }


    .am-about-hero__shape {
        right:
            50%;

        transform:
            translateX(50%);
    }

}



/* =========================================================
   RESPONSIVE - 800
========================================================= */

@media (max-width: 800px) {

    .am-about-story {
        padding:
            var(--am-section-space-tablet)
            0;
    }


    .am-about-story__container {
        width:
            calc(
                100% - var(--am-space-7)
            );

        grid-template-columns:
            1fr;

        padding:
            var(--am-space-6);
    }


    .am-about-story__visual {
        min-height:
            500px;
    }


    .am-about-story__purpose {
        grid-column:
            auto;

        grid-template-columns:
            1fr
            1fr;
    }


    .am-trust-section {
        padding:
            var(--am-section-space-tablet)
            0;
    }


    .am-trust-grid {
        grid-template-columns:
            1fr;

        max-width:
            620px;

        row-gap:
            var(--am-space-8);

        margin-top:
            var(--am-space-8);
    }


    .am-trust-item {
        grid-template-columns:
            120px
            1fr;
    }


    .am-trust-item__icon {
        width:
            115px;

        height:
            115px;
    }

}



/* =========================================================
   RESPONSIVE - 700
========================================================= */

@media (max-width: 700px) {

    .am-about-hero__container {
        width:
            calc(
                100% - var(--am-space-7)
            );
    }


    .am-about-hero__title {
        font-size:
            var(--am-fs-h1);
    }


    .am-about-hero__description {
        font-size:
            var(--am-fs-sm);
    }


    .am-about-hero__actions {
        width:
            100%;

        align-items:
            stretch;

        flex-direction:
            column;
    }


    .am-about-hero__actions
    .am-btn {
        width:
            100%;
    }


    .am-about-hero__trust {
        display:
            grid;

        grid-template-columns:
            1fr
            1fr;

        gap:
            var(--am-space-4);
    }


    .am-about-hero__visual {
        min-height:
            410px;
    }


    .am-about-hero__image {
        max-height:
            410px;
    }


    .am-about-hero__shape {
        width:
            390px;

        height:
            390px;
    }


    .am-about-hero__note {
        display:
            none;
    }


    .am-about-hero__floating-card {
        right:
            0;

        bottom:
            var(--am-space-5);
    }


    .am-about-stats__grid {
        grid-template-columns:
            1fr
            1fr;
    }


    .am-about-stat {
        min-height:
            100px;

        padding:
            var(--am-space-4);
    }


    .am-about-stat:nth-child(n) {
        border-top:
            0;
    }


    .am-about-stat:nth-child(odd)::after {
        display:
            block;
    }


    .am-about-stat:nth-child(even)::after {
        display:
            none;
    }


    .am-about-stat:nth-child(n + 3) {
        border-top:
            1px solid var(--am-border);
    }


    .am-about-stat:last-child {
        grid-column:
            1 / -1;
    }


    .am-about-stat:last-child::after {
        display:
            none;
    }


    .am-testimonials {
        padding:
            var(--am-section-space-mobile)
            0;
    }


    .am-testimonial-featured {
        min-height:
            auto;

        padding:
            var(--am-space-6);
    }


    .am-testimonial-featured__footer {
        align-items:
            flex-start;

        flex-direction:
            column;
    }


    .am-testimonials__side {
        grid-template-columns:
            1fr;
    }


    .am-testimonials__trust {
        display:
            grid;

        grid-template-columns:
            1fr;

        gap:
            var(--am-space-4);
    }


    .am-testimonials__trust i {
        display:
            none;
    }


    .am-about-final-cta {
        padding:
            var(--am-space-8)
            0;
    }


    .am-about-final-cta__box {
        padding:
            var(--am-space-6);

        border-radius:
            var(--am-radius-lg);
    }


    .am-about-final-cta__benefits {
        justify-content:
            space-between;

        gap:
            var(--am-space-3);
    }


    .am-about-final-cta__actions {
        flex-direction:
            column;

        width:
            100%;
    }


    .am-about-final-cta__actions
    .am-btn {
        width:
            100%;
    }


    .am-about-final-cta__bottom {
        flex-wrap:
            wrap;

        text-align:
            center;
    }

}



/* =========================================================
   RESPONSIVE - 600
========================================================= */

@media (max-width: 600px) {

    .am-about-story {
        padding:
            var(--am-section-space-mobile)
            0;
    }


    .am-about-story__container {
        padding:
            var(--am-space-5);

        border-radius:
            var(--am-radius-lg);
    }


    .am-about-story__title {
        font-size:
            var(--am-fs-h3);
    }


    .am-about-story__content p {
        font-size:
            var(--am-fs-sm);
    }


    .am-about-story__visual {
        min-height:
            420px;
    }


    .am-about-story__purpose {
        grid-template-columns:
            1fr;
    }


    .am-purpose-card {
        padding:
            var(--am-space-5);
    }


    .am-purpose-card__icon {
        width:
            var(--am-icon-md);

        height:
            var(--am-icon-md);
    }

}



/* =========================================================
   RESPONSIVE - 580
========================================================= */

@media (max-width: 580px) {

    .am-trust-section {
        padding:
            var(--am-section-space-mobile)
            0;
    }


    .am-trust-grid {
        row-gap:
            var(--am-space-9);
    }


    .am-trust-item {
        grid-template-columns:
            82px
            1fr;

        align-items:
            flex-start;

        gap:
            var(--am-space-4);
    }


    .am-trust-item__icon {
        width:
            78px;

        height:
            78px;
    }


    .am-trust-item__icon svg {
        width:
            var(--am-icon-sm);

        height:
            var(--am-icon-sm);
    }


    .am-trust-item__icon::before,
    .am-trust-item__icon::after {
        display:
            none;
    }


    .am-trust-item__content h3 {
        font-size:
            var(--am-fs-lg);

        margin-bottom:
            var(--am-space-2);
    }


    .am-trust-item__content p {
        font-size:
            var(--am-fs-sm);

        margin-bottom:
            var(--am-space-3);
    }


    .am-trust-footer {
        grid-template-columns:
            1fr;

        gap:
            var(--am-space-4);

        margin-top:
            var(--am-space-9);

        text-align:
            center;
    }


    .am-trust-footer > span {
        display:
            none;
    }


    .am-trust-footer__center {
        justify-content:
            center;

        align-items:
            center;

        flex-direction:
            column;
    }


    .am-trust-footer__center p {
        white-space:
            normal;

        font-size:
            var(--am-fs-xs);

        line-height:
            var(--am-lh-small);
    }

}



/* =========================================================
   RESPONSIVE - 480
========================================================= */

@media (max-width: 480px) {

    .am-about-final-cta__benefits {
        align-items:
            flex-start;

        flex-direction:
            column;
    }


    .am-about-final-cta__benefits > div {
        display:
            flex;

        align-items:
            center;

        gap:
            var(--am-space-2);

        min-width:
            0;

        text-align:
            left;
    }


    .am-about-final-cta__dot {
        margin:
            0;
    }

}



/* =========================================================
   RESPONSIVE - 460
========================================================= */

@media (max-width: 460px) {

    .am-about-hero__trust {
        grid-template-columns:
            1fr;
    }


    .am-about-stats__grid {
        grid-template-columns:
            1fr;
    }


    .am-about-stat {
        border-top:
            1px solid var(--am-border) !important;
    }


    .am-about-stat:first-child {
        border-top:
            0 !important;
    }


    .am-about-stat::after {
        display:
            none !important;
    }


    .am-about-stat:last-child {
        grid-column:
            auto;
    }

}



/* =========================================================
   ACCESSIBILITY - REDUCED MOTION

   Users who prefer reduced motion
   will see the page without animations.
========================================================= */

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

    .am-about-hero__content,
    .am-about-hero__visual,
    .am-about-hero__image,
    .am-about-hero__note,
    .am-about-hero__floating-card,
    .am-about-hero__shape,
    .am-about-stat,
    .am-about-story__content,
    .am-about-story__visual,
    .am-about-story__purpose,
    .am-trust-section .am-section-heading,
    .am-trust-item,
    .am-trust-footer,
    .am-testimonials .am-section-heading,
    .am-testimonial-featured,
    .am-testimonials__side,
    .am-testimonials__trust,
    .am-about-final-cta__box,
    .am-about-final-cta__bottom {

        animation:
            none !important;

        transform:
            none !important;

        opacity:
            1 !important;
    }

}