/* =====================================================
   ABOUT PAGE
===================================================== */

.about-page{

    background:#fff;

}

.about-page main,
.about-page main > section,
.about-page .page-section,
.about-page .page-section--warm,
.about-page .page-section--blue,
.about-page .about-hero,
.about-page .about-story,
.about-page .about-values,
.about-page .about-quote,
.about-page .about-cta{

    background:#fff;

}

.about-page .container,
.about-cta .container{

    width:min(var(--container),92%);

    margin:auto;

}

.about-page .header{

    position:fixed;

    background:rgba(250,248,244,.94);

    backdrop-filter:blur(18px);

    -webkit-backdrop-filter:blur(18px);

    box-shadow:0 8px 30px rgba(0,0,0,.08);

}

.about-hero,
.about-story,
.about-values,
.about-cta{

    background:#fff;

}

.about-hero{

    padding:90px 0 var(--space-6);

}

.about-hero__media{

    position:relative;

    height:58vh;

    min-height:420px;

    max-height:560px;

    border-radius:8px;

    overflow:hidden;

    box-shadow:var(--shadow-soft);

}

.about-hero__media::after{

    content:"";

    position:absolute;

    inset:0;

    z-index:1;

    background:linear-gradient(90deg,rgba(47,49,51,.14) 0%,rgba(47,49,51,.06) 42%,rgba(47,49,51,0) 75%);

    pointer-events:none;

}

.about-hero__media img{

    position:absolute;

    inset:0;

    width:100%;

    height:100%;

    object-fit:cover;

    object-position:center center;

}

.about-hero__picture{

    position:absolute;

    inset:0;

    display:block;

}

.about-hero__media > .frame.frame--photo{

    display:none;
    --frame-size:54px;
    --frame-inset-x:24px;
    --frame-inset-y:24px;

    z-index:2;

    opacity:.84;

    filter:brightness(0) invert(1);

}

.about-hero__frame{

    --frame-inset-x:calc(var(--space-6) / 2);
    --frame-inset-y:calc(var(--space-6) / 2);

    position:absolute;

    left:var(--space-6);

    top:50%;

    z-index:2;

    width:min(616px,48.5%);

    padding:var(--space-7) var(--space-6);

    background:rgba(250,248,244,.88);

    backdrop-filter:blur(9px);

    -webkit-backdrop-filter:blur(9px);

    border-radius:8px;

    overflow:hidden;

    opacity:0;

    transform:translateY(calc(-50% + 24px));

    transition:
        opacity .5s ease-out,
        transform .5s ease-out;

}

.about-hero.is-visible .about-hero__frame{

    opacity:1;

    transform:translateY(-50%);

}

.about-hero__frame > :not(.frame),
.about-cta__content > :not(.frame){

    position:relative;

    z-index:2;

}

.about-hero__frame .frame,
.about-cta__content .frame{

    opacity:0;

    border-radius:8px;

}

.about-hero.is-visible .about-hero__frame .frame,
.about-cta.is-visible .about-cta__content .frame{

    opacity:.86;

    transition:opacity .25s ease .35s;

}

.about-hero__title,
.about-story__title,
.about-values__title,
.about-cta__title{

    font-family:var(--font-heading);

    font-weight:600;

    color:var(--graphite);

}

.about-hero__title{

    max-width:460px;

    font-size:44px;

    line-height:1.12;

    margin-bottom:var(--space-4);

}

.about-hero__lead{

    max-width:480px;

    font-size:18px;

    line-height:1.75;

    color:var(--graphite-600);

}

.contact-page .about-hero__title{

    max-width:680px;

    color:var(--graphite);

}

@media (min-width:1100px){

    .contact-page .about-hero__title{

        white-space:normal;

    }

}

.about-story{

    padding:var(--space-10) 0;

}

.about-story__layout{

    display:grid;

    grid-template-columns:1fr;

    gap:var(--space-5);

    align-items:stretch;

    max-width:1040px;

}

.about-story__content{

    display:flex;

    flex-direction:column;

    justify-content:center;

    min-height:auto;

}

.about-story__title{

    font-size:40px;

    line-height:1.16;

    margin-bottom:var(--space-4);

}

.about-story__text{

    display:grid;

    gap:var(--space-3);

    font-size:16px;

    line-height:1.78;

    color:var(--graphite-600);

}

.about-story__lead{

    max-width:760px;

    margin:0;

    font-size:17px;

    line-height:1.72;

    color:var(--graphite-600);

}

.about-story__points{

    display:grid;

    gap:0;

}

.about-story__point{

    display:grid;

    grid-template-columns:40px minmax(0,1fr);

    gap:var(--space-3);

    align-items:start;

    padding:18px 0;

    border-top:1px solid rgba(115,138,105,.16);

}

.about-story__point:last-child{

    border-bottom:1px solid rgba(115,138,105,.16);

}

.about-story__point img{

    width:38px;

    height:38px;

    object-fit:contain;

    margin-top:2px;

}

.about-story__point h3{

    margin:0 0 8px;

    font-family:var(--font-heading);

    font-size:19px;

    font-weight:600;

    line-height:1.28;

    color:var(--graphite);

}

.about-story__point p{

    margin:0;

    font-size:15px;

    line-height:1.66;

    color:var(--graphite-600);

}

.about-story__point p + p{

    margin-top:10px;

}

.about-story__image{

    --frame-inset-x:var(--space-3);
    --frame-inset-y:var(--space-3);

    position:relative;

    min-height:680px;

    border-radius:8px;

    overflow:hidden;

    box-shadow:var(--shadow-soft);

}

.about-story__image .frame{

    opacity:.72;

    border-radius:8px;

    z-index:2;

}

.about-story__image .frame--tr{

    --frame-inset-y:var(--space-4);

}

.about-story__image .frame--bl{

    --frame-inset-x:var(--space-4);

}

.about-story__image img{

    position:relative;

    z-index:1;

    width:100%;

    height:100%;

    object-fit:cover;

    object-position:center center;

}

.about-quote{

    padding:var(--space-10) 0;

    background:#fff;

}

.about-quote blockquote{

    position:relative;

    max-width:920px;

    margin:auto;

    padding:var(--space-8) var(--space-7);

    text-align:center;

    background:var(--color-light-blue);

    border-radius:8px;

}

.about-quote blockquote::before,
.about-quote blockquote::after{

    display:block;

    font-family:var(--font-heading);

    font-size:96px;

    font-weight:600;

    line-height:.78;

    color:var(--sage);

    opacity:.55;

}

.about-quote blockquote::before{

    content:"“";

    margin-bottom:var(--space-3);

    content:"\201C";

}

.about-quote blockquote::after{

    content:"”";

    margin-top:var(--space-3);

    content:"\201D";

}

.about-quote p{

    font-family:var(--font-heading);

    font-size:34px;

    font-weight:600;

    line-height:1.3;

    color:var(--graphite);

    max-width:800px;

    margin:auto;

}

.about-values{

    padding:var(--space-10) 0;

}

.about-values .container{

    display:grid;

    grid-template-columns:minmax(0,5.5fr) minmax(320px,4.5fr);

    gap:0 var(--space-7);

    align-items:center;

}

.about-values__header{

    max-width:760px;

    grid-column:1;

    margin-bottom:var(--space-6);

}

.about-values__title{

    font-size:40px;

    line-height:1.16;

}

.about-values__layout{

    display:contents;

}

.about-values__list{

    max-width:none;

    display:grid;

    gap:var(--space-5);

    grid-column:1;

}

.about-values__item{

    display:grid;

    grid-template-columns:40px minmax(0,1fr);

    gap:var(--space-4);

    align-items:center;

}

.about-values__item img{

    width:40px;

    height:40px;

}

.about-values__item h3{

    font-family:var(--font-heading);

    font-size:22px;

    font-weight:600;

    line-height:1.25;

    color:var(--graphite);

    margin-bottom:var(--space-1);

}

.about-values__item p{

    font-size:16px;

    line-height:1.7;

    color:var(--graphite-600);

}

.about-values__sketch{

    display:flex;

    align-items:center;

    justify-content:center;

    min-height:520px;

    margin:0;

    grid-column:2;

    grid-row:1 / span 2;

}

.about-values__sketch svg{

    display:block;

    width:100%;

    max-width:620px;

    height:auto;

    overflow:visible;

}

.about-values__sketch img{

    display:block;

    width:min(100%,560px);

    height:auto;

    margin:auto;

    border:0;

    border-radius:0;

    box-shadow:none;

    background:transparent;

}

.sketch-drawing path{

    fill:none;

    stroke:var(--graphite);

    stroke-width:1.55;

    stroke-linecap:round;

    stroke-linejoin:round;

    vector-effect:non-scaling-stroke;

    opacity:.72;

    stroke-dasharray:900;

    stroke-dashoffset:900;

}

.about-values.is-visible .sketch-drawing path{

    animation:drawSketch 2.45s ease-out forwards;

}

.about-values.is-visible .sketch-drawing path:nth-child(3n){

    animation-delay:.12s;

}

.about-values.is-visible .sketch-drawing path:nth-child(4n){

    animation-delay:.22s;

}

@keyframes drawSketch{

    to{

        stroke-dashoffset:0;

    }

}

.about-cta{

    padding:var(--space-4) 0;

    

}

.about-page .about-story{

    padding-bottom:var(--space-6);

}

.about-page .page-related--simple{

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

}

.about-page .page-related--simple + .about-cta{

    padding-top:var(--space-4);

}

.about-cta__layout{

    display:grid;

    grid-template-columns:minmax(0,1fr) minmax(0,1fr);

    align-items:stretch;

    height:auto;

    border-radius:8px;

    overflow:hidden;

    min-height:0;

}

.about-cta__content{

    --frame-size:48px;
    --frame-inset-x:var(--space-3);
    --frame-inset-y:var(--space-3);
    --frame-line-offset:2px;
    --frame-content-gap:10px;

    position:relative;

    display:flex;

    flex-direction:column;

    justify-content:flex-start;

    align-items:flex-start;

    gap:0;

    padding:0 34px;

    background:var(--color-light-blue);

    border-radius:8px 0 0 8px;

    overflow:hidden;

}

.about-cta__body{

    width:100%;

    padding-top:calc(var(--frame-inset-y) + var(--frame-line-offset) + var(--frame-content-gap));

    padding-bottom:calc(var(--frame-inset-y) + var(--frame-line-offset) + var(--frame-content-gap));

}

.about-cta__title{

    max-width:620px;

    font-size:30px;

    line-height:1.16;

}

.about-cta__text{

    max-width:620px;

    margin:16px 0 0;

    font-family:var(--font-body);

    font-size:15.5px;

    font-weight:400;

    line-height:1.65;

    color:var(--graphite-600);

}

.about-cta__content .btn{

    margin-top:24px;

}

.about-cta__features{

    width:100%;

    max-width:760px;

    margin:24px 0 0;

    padding:0;

    list-style:none;

    display:grid;

    grid-template-columns:repeat(3,minmax(0,1fr));

    gap:20px;

}

.about-cta__feature{

    display:flex;

    align-items:center;

    gap:12px;

    min-width:0;

}

.about-cta__feature img{

    flex:0 0 30px;

    width:30px;

    height:30px;

    object-fit:contain;

}

.about-cta__feature span{

    font-family:var(--font-body);

    font-size:14px;

    font-weight:500;

    line-height:1.35;

    color:var(--graphite);

}

.about-cta__image{

    position:relative;

    min-height:0;

    height:auto;

    align-self:stretch;

    border-radius:0 8px 8px 0;

    overflow:hidden;

}

.about-cta__image img{

    display:block;

    position:absolute;

    inset:0;

    width:100%;

    height:100%;

    object-fit:cover;

    object-position:center center;

}

@media (max-width:1024px){

    .about-cta__features{

        grid-template-columns:repeat(2,minmax(0,1fr));

        max-width:500px;

        gap:16px 22px;

        margin-top:26px;

    }

}

.solutions-intro{

    padding:80px 0;

    background:#FFFFFF;

}

.solutions-intro .container{

    width:min(1320px,92%);

}

.solutions-intro__layout{

    display:grid;

    grid-template-columns:1fr;

    gap:0;

    align-items:center;

}

.solutions-intro__content{

    position:relative;

    width:100%;

    padding:48px;

    background:#FAF8F4;

    border-radius:12px;

    box-shadow:none;

}

.solutions-intro__content > :not(.frame){

    position:relative;

    z-index:4;

}

.solutions-intro__content .frame{

    --frame-size:58px;

    --frame-inset-x:24px;

    --frame-inset-y:24px;

    --frame-width:2px;

    position:absolute;

    width:var(--frame-size);

    height:var(--frame-size);

    pointer-events:none;

    opacity:.82;

    border-radius:8px;

    overflow:hidden;

}

.solutions-intro__content .frame--tl{

    top:var(--frame-inset-y);

    left:var(--frame-inset-x);

}

.solutions-intro__content .frame--tr{

    top:var(--frame-inset-y);

    right:var(--frame-inset-x);

}

.solutions-intro__content .frame--bl{

    bottom:var(--frame-inset-y);

    left:var(--frame-inset-x);

}

.solutions-intro__content .frame--br{

    right:var(--frame-inset-x);

    bottom:var(--frame-inset-y);

}

.solutions-intro__content .what-is__eyebrow{

    font-size:13px;

    font-weight:600;

    line-height:1.4;

    letter-spacing:.12em;

    color:var(--sage);

    text-transform:uppercase;

    margin-bottom:var(--space-2);

}

.solutions-intro__content .page-title{

    max-width:960px;

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

}

.solutions-intro__content .page-lead{

    max-width:900px;

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

}

.solutions-intro__title{

    max-width:820px;

    font-family:var(--font-heading);

    font-size:40px;

    font-weight:600;

    line-height:1.16;

    color:var(--graphite);

    margin-bottom:var(--space-4);

}

.solutions-intro__lead{

    max-width:880px;

    font-size:18px;

    line-height:1.75;

    color:var(--graphite-600);

    margin-bottom:var(--space-5);

}

.solutions-intro__points{

    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:22px 26px;

}

.solutions-intro__point{

    display:grid;

    grid-template-columns:34px minmax(0,1fr);

    gap:14px;

    align-items:start;

}

.solutions-intro__icon{

    width:34px;

    height:34px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:var(--sage);

}

.solutions-intro__icon svg{

    width:26px;

    height:26px;

    fill:none;

    stroke:currentColor;

    stroke-width:1.7;

    stroke-linecap:round;

    stroke-linejoin:round;

}

.solutions-intro__icon img{

    display:block;

    width:26px;

    height:26px;

    object-fit:contain;

}

.solutions-intro__point h3{

    font-family:var(--font-heading);

    font-size:18px;

    font-weight:600;

    line-height:1.3;

    color:var(--graphite);

    margin-bottom:var(--space-1);

}

.solutions-intro__point p{

    font-size:15.5px;

    line-height:1.68;

    color:var(--graphite-600);

}

.solutions-intro__image{

    min-height:520px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:0;

}

.solutions-intro__image img{

    display:block;

    width:min(86%,520px);

    max-height:440px;

    height:auto;

    object-fit:contain;

    border:0;

    border-radius:0;

    box-shadow:none;

    background:transparent;

}

/* =====================================================
   SOLUTIONS OPTIONS
===================================================== */

.solutions-options{

    padding:var(--space-10) 0;

    background:#fff;

}

.solutions-options .container{

    width:min(var(--container),92%);

    margin:auto;

}

.solutions-options__header{

    max-width:960px;

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

}

.solutions-options__header .page-title{

    max-width:960px;

}

.solutions-options__list{

    display:grid;

    gap:var(--space-10);

}

.solutions-option{

    display:grid;

    grid-template-columns:minmax(0,1fr) minmax(0,1fr);

    gap:var(--space-8);

    align-items:center;

}

.solutions-option--reverse .solutions-option__media{

    order:2;

}

.solutions-option--reverse .solutions-option__content{

    order:1;

}

.solutions-option__media{

    min-height:420px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:0;

}

.solutions-option__media img{

    display:block;

    width:min(92%,560px);

    max-height:460px;

    height:auto;

    object-fit:contain;

}

.solutions-option__content{

    max-width:620px;

}

.solutions-option__content h3{

    font-family:var(--font-heading);

    font-size:32px;

    font-weight:600;

    line-height:1.18;

    color:var(--graphite);

    margin-bottom:var(--space-3);

}

.solutions-option__lead{

    font-size:17px;

    line-height:1.72;

    color:var(--graphite-600);

    margin-bottom:var(--space-4);

}

.solutions-option__list{

    display:grid;

    gap:10px;

    margin:0;

    padding:0;

    list-style:none;

}

.solutions-option__list li{

    position:relative;

    padding-left:22px;

    font-size:15.5px;

    line-height:1.62;

    color:var(--graphite-600);

}

.solutions-option__list li::before{

    content:"";

    position:absolute;

    left:0;

    top:.75em;

    width:8px;

    height:1px;

    background:var(--sage);

}

@media (max-width:1024px){

    .solutions-options{

        padding:var(--space-9) 0;

    }

    .solutions-options__header{

        margin-bottom:var(--space-7);

    }

    .solutions-options__title{

        font-size:34px;

    }

    .solutions-options__list{

        gap:var(--space-9);

    }

    .solutions-option{

        gap:var(--space-6);

    }

    .solutions-option__media{

        min-height:360px;

    }

    .solutions-option__media img{

        width:min(94%,500px);

        max-height:390px;

    }

    .solutions-option__content h3{

        font-size:28px;

    }

    .solutions-option__lead{

        font-size:16px;

    }

}

@media (max-width:820px){

    .solutions-option,
    .solutions-option--reverse{

        grid-template-columns:1fr;

        gap:var(--space-4);

    }

    .solutions-option__media,
    .solutions-option--reverse .solutions-option__media{

        order:1;

    }

    .solutions-option__content,
    .solutions-option--reverse .solutions-option__content{

        order:2;

    }

    .solutions-option__media{

        min-height:0;

    }

    .solutions-option__media img{

        width:min(100%,520px);

        max-height:320px;

    }

}

@media (max-width:720px){

    .solutions-options{

        padding:var(--space-8) 0;

    }

    .solutions-options__header{

        margin-bottom:var(--space-6);

    }

    .solutions-options__title{

        font-size:28px;

    }

    .solutions-options__list{

        gap:var(--space-8);

    }

    .solutions-option__content h3{

        font-size:24px;

    }

    .solutions-option__lead{

        font-size:15.5px;

        line-height:1.66;

    }

    .solutions-option__list{

        gap:8px;

    }

    .solutions-option__list li{

        font-size:14.5px;

    }

}

@media (max-width:1024px){

    .about-hero{

        padding:90px 0 var(--space-5);

    }

    .about-hero__media{

        height:56vh;

        min-height:400px;

        max-height:520px;

    }

    .about-hero__frame{

        left:var(--space-4);

        width:min(594px,64%);

        padding:var(--space-5);

    }

    .about-hero__title,
    .about-story__title,
    .about-values__title{

        font-size:34px;

    }

    .about-hero__lead{

        font-size:17px;

    }

    .solutions-intro{

        padding:72px 0;

    }

    .solutions-intro__layout{

        gap:var(--space-4);

    }

    .solutions-intro__content{

        padding:40px;

    }

    .solutions-intro__content .what-is__title{

        font-size:34px;

    }

    .solutions-intro__content .what-is__lead{

        font-size:18px;

    }

    .solutions-intro__title{

        font-size:34px;

    }

    .solutions-intro__lead{

        font-size:17px;

        margin-bottom:var(--space-5);

    }

    .solutions-intro__points{

        grid-template-columns:1fr;

        gap:22px;

    }

    .solutions-intro__image{

        min-height:480px;

    }

    .solutions-intro__image img{

        width:min(84%,440px);

        max-height:390px;

    }

    .about-story,
    .about-values{

        padding:var(--space-9) 0;

    }

    .about-cta{

        padding:var(--space-4) 0;

    }

    .about-story__layout{

        grid-template-columns:1fr;

        gap:var(--space-5);

    }

    .about-story__content,
    .about-story__image{

        min-height:auto;

    }

    .about-story__image{

        aspect-ratio:4 / 3;

    }

    .about-quote{

        padding:var(--space-9) 0;

    }

    .about-quote p{

        font-size:30px;

    }

    .about-quote blockquote{

        padding:var(--space-7) var(--space-5);

    }

    .about-values__layout{

        display:grid;

        grid-template-columns:1fr;

        gap:var(--space-6);

    }

    .about-values .container{

        display:block;

    }

    .about-values__sketch{

        min-height:420px;

        grid-column:1;

        grid-row:auto;

    }

    .about-cta__layout{

        grid-template-columns:1fr;

        height:auto;

        min-height:auto;

    }

    .about-cta__content,
    .about-cta__image{

        border-radius:8px;

    }

    .about-cta__image{

        height:180px;

        min-height:0;

        margin-top:0;

    }

}

@media (max-width:720px){

    .about-hero{

        padding:90px 0 var(--space-6);

    }

    .about-hero__media{

        height:auto;

        min-height:auto;

        max-height:none;

        overflow:visible;

        box-shadow:none;

    }

    .about-hero__media::after{

        display:none;

    }

    .about-hero__media img{

        position:relative;

        height:260px;

        border-radius:8px;

        box-shadow:var(--shadow-soft);

    }

    .about-hero__picture{

        position:relative;

        inset:auto;

    }

    .about-hero__frame{

        --frame-inset-x:var(--space-2);
        --frame-inset-y:var(--space-2);

        position:relative;

        top:auto;

        left:auto;

        width:100%;

        margin-top:var(--space-3);

        padding:var(--space-4);

        transform:translateY(24px);

    }

    .about-hero.is-visible .about-hero__frame{

        transform:translateY(0);

    }

    .about-hero__title,
    .about-story__title,
    .about-values__title{

        font-size:30px;

    }

    .about-hero__lead,
    .about-story__text,
    .about-values__item p{

        font-size:15px;

        line-height:1.72;

    }

    .solutions-intro{

        padding:64px 0;

    }

    .solutions-intro__layout{

        grid-template-columns:1fr;

        gap:var(--space-5);

    }

    .solutions-intro__content{

        padding:32px 24px;

    }

    .solutions-intro__content .frame{

        --frame-size:46px;

        --frame-inset-x:14px;

        --frame-inset-y:14px;

    }

    .solutions-intro__content .what-is__eyebrow{

        font-size:12px;

    }

    .solutions-intro__content .what-is__title{

        font-size:30px;

    }

    .solutions-intro__content .what-is__lead{

        font-size:17px;

        line-height:1.65;

    }

    .solutions-intro__title{

        font-size:30px;

    }

    .solutions-intro__lead{

        font-size:16px;

        line-height:1.7;

        margin-bottom:var(--space-5);

    }

    .solutions-intro__point{

        grid-template-columns:36px minmax(0,1fr);

        gap:var(--space-2);

    }

    .solutions-intro__icon{

        width:36px;

        height:36px;

    }

    .solutions-intro__icon svg{

        width:26px;

        height:26px;

    }

    .solutions-intro__point h3{

        font-size:17px;

    }

    .solutions-intro__point p{

        font-size:15px;

        line-height:1.68;

    }

    .solutions-intro__image{

        min-height:auto;

    }

    .solutions-intro__image img{

        width:min(100%,380px);

        max-height:none;

    }

    .about-story,
    .about-values{

        padding:var(--space-8) 0;

    }

    .about-cta{

        padding:var(--space-3) 0;

    }

    .about-story__image{

        aspect-ratio:4 / 5;

    }

    .about-story__lead{

        font-size:15px;

        line-height:1.6;

    }

    .about-story__point{

        grid-template-columns:32px minmax(0,1fr);

        gap:12px;

        padding:15px 0;

    }

    .about-story__point img{

        width:30px;

        height:30px;

        margin-top:1px;

    }

    .about-story__point h3{

        margin-bottom:6px;

        font-size:17px;

    }

    .about-story__point p{

        font-size:14px;

        line-height:1.58;

    }

    .about-quote{

        padding:var(--space-7) 0;

    }

    .about-quote blockquote{

        padding:var(--space-5) var(--space-4);

    }

    .about-quote p{

        font-size:24px;

    }

    .about-quote blockquote::before,
    .about-quote blockquote::after{

        position:static;

        display:block;

        transform:none;

        font-size:56px;

        line-height:.8;

    }

    .about-values__header{

        margin-bottom:var(--space-5);

    }

    .about-values__list{

        gap:var(--space-4);

    }

    .about-values__layout{

        gap:var(--space-5);

    }

    .about-values__sketch{

        min-height:300px;

    }

    .about-values__item{

        grid-template-columns:40px minmax(0,1fr);

        gap:var(--space-3);

    }

    .about-values__item h3{

        font-size:19px;

    }

    .about-cta__layout{

        min-height:auto;

    }

    .about-cta__content{

        --frame-size:40px;
        --frame-inset-x:var(--space-2);
        --frame-inset-y:var(--space-2);
        --frame-content-gap:8px;

        padding:0 var(--space-3);

        gap:0;

    }

    .about-cta__title{

        font-size:24px;

    }

    .about-cta__text{

        margin-top:14px;

        font-size:15px;

        line-height:1.62;

    }

    .about-cta__content .btn{

        width:100%;

        min-width:0;

        margin-top:22px;

    }

    .about-cta__features{

        grid-template-columns:repeat(2,minmax(0,1fr));

        gap:16px 22px;

        margin-top:26px;

    }

    .about-cta__feature img{

        flex-basis:28px;

        width:28px;

        height:28px;

    }

    .about-cta__image{

        height:160px;

        min-height:0;

    }

}

@media (max-width:540px){

    .about-cta__features{

        grid-template-columns:1fr;

        gap:15px;

    }

}

@media (prefers-reduced-motion:reduce){

    .sketch-drawing path{

        stroke-dashoffset:0;

    }

    .about-values.is-visible .sketch-drawing path{

        animation:none;

    }

}

@font-face{

    font-family:"Cormorant Garamond Quote";

    src:url("../fonts/CormorantGaramond-SemiBoldItalic.ttf") format("truetype");

    font-weight:600;

    font-style:italic;

    font-display:swap;

}

.about-quote blockquote::before,
.about-quote blockquote::after{

    position:absolute;

    z-index:1;

    display:none !important;

    content:none !important;

    margin:0;

    font-size:clamp(36px,4vw,48px);

    line-height:1;

    opacity:.45;

    pointer-events:none;

}

.about-quote blockquote::before{

    content:"\201C";

    top:clamp(12px,2vw,26px);

    right:clamp(34px,6vw,70px);

}

.about-quote blockquote::after{

    content:"\201D";

    left:clamp(34px,6vw,70px);

    bottom:clamp(-10px,-.6vw,-4px);

}

.about-quote p{

    position:relative;

    z-index:2;

    max-width:640px;

    margin-left:auto;

    margin-right:auto;

    font-family:"Cormorant Garamond Quote", "Cormorant Garamond", Georgia, serif;

    font-style:italic;

    font-weight:600;

}

.about-quote blockquote{

    min-height:220px;

    display:flex;

    align-items:center;

    justify-content:center;

    padding-top:calc(var(--space-8) + 18px);

    padding-bottom:calc(var(--space-8) + 18px);

    --frame-size:46px;

    --frame-inset-x:24px;

    --frame-inset-y:24px;

}

.about-quote blockquote .frame{

    opacity:.72;

    filter:none;

}

@media (max-width:640px){

    .about-quote blockquote::before,
    .about-quote blockquote::after{

        position:absolute;

        display:block;

        font-size:38px;

        transform:none;

    }

    .about-quote blockquote::before{

        top:8px;

        right:18px;

    }

    .about-quote blockquote::after{

        left:18px;

        bottom:-8px;

    }

    .about-quote blockquote{

        min-height:190px;

        padding-top:calc(var(--space-5) + 14px);

        padding-bottom:calc(var(--space-5) + 14px);

        --frame-size:34px;

        --frame-inset-x:16px;

        --frame-inset-y:16px;

    }

}
