/*==========================================================
  FINAL ARTICLE CTA
==========================================================*/

.lavArticleFinalCta {
    position: relative;
    overflow: hidden;
    padding:
        clamp(rem, 9vw, 8rem)
        0;
    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f7f4fa 100%
        );
        
}

.lavArticleFinalGlow,
.lavArticleFinalTexture {
    position: absolute;
    pointer-events: none;
    
}

.lavArticleFinalGlow {
    border-radius: 50%;
    filter: blur(90px);
}

.lavArticleFinalGlowOne {
    top: -10rem;
    left: -8rem;
    width: 24rem;
    height: 24rem;
    background:
        rgba(177,145,208,.20);
}

.lavArticleFinalGlowTwo {
    right: -8rem;
    bottom: -10rem;
    width: 22rem;
    height: 22rem;
    background:
        rgba(170,214,206,.18);
}

.lavArticleFinalTexture {
    inset: 0;
    opacity: .03;
    background-image:
        radial-gradient(
            circle,
            currentColor 1px,
            transparent 1px
        );
    background-size:
        22px 22px;
}


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

.lavArticleFinalCard {

    position: relative;

    display: grid;
    grid-template-columns:
        minmax(0,1.4fr)
        minmax(280px,.8fr);

    gap:
        clamp(2rem,5vw,5rem);

    align-items: center;

    padding:
        clamp(2.5rem,5vw,5rem);

    border-radius: 2rem;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.94),
            rgba(248,245,250,.96)
        );

    border:
        1px solid
        rgba(122,92,164,.10);

    box-shadow:
        0 30px 70px
        rgba(58,45,72,.10);

    backdrop-filter:
        blur(18px);
    margin: 20px;
    margin-top: 25px;
}


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

.lavArticleFinalContent{
    position:relative;
    z-index:2;
}

.lavArticleFinalEyebrow{

    display:inline-flex;
    align-items:center;
    gap:.7rem;

    margin-bottom:1.2rem;

    color:
        var(--lavender-primary);

    font-size:.82rem;
    font-weight:700;
    letter-spacing:.18em;
    text-transform:uppercase;

}

.lavArticleFinalEyebrow::before{

    content:"";

    width:2.5rem;
    height:1px;

    background:
        rgba(122,92,164,.35);

}

.lavArticleFinalContent h2{

    margin:0;

    color:
        var(--lavender-heading);

    font-family:
        "Newsreader",
        serif;

    font-size:
        clamp(2.5rem,5vw,4.4rem);

    font-weight:500;

    line-height:1.08;

    letter-spacing:-.03em;

}

.lavArticleFinalContent p{

    max-width:42rem;

    margin:
        1.5rem 0 2.4rem;

    color:
        var(--lavender-text-light);

    font-size:
        clamp(1.05rem,1.25vw,1.15rem);

    line-height:1.9;

}


/*==========================================================
  BUTTONS
==========================================================*/

.lavArticleFinalActions{

    display:flex;
    flex-wrap:wrap;
    gap:1rem;

    margin-bottom:2.5rem;

}


/*==========================================================
  HIGHLIGHTS
==========================================================*/

.lavArticleFinalHighlights{

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

    gap:1rem;

    margin:0;
    padding:0;

    list-style:none;

}

.lavArticleFinalHighlights li{

    position:relative;

    padding:
        1rem
        1.1rem
        1rem
        2.7rem;

    border-radius:1rem;

    background:
        rgba(122,92,164,.05);

    border:
        1px solid
        rgba(122,92,164,.08);

    color:
        var(--lavender-heading);

    font-size:.92rem;

    line-height:1.6;

}

.lavArticleFinalHighlights li::before{

    content:"";

    position:absolute;

    left:1rem;
    top:1.2rem;

    width:.75rem;
    height:.75rem;

    border-radius:50%;

    background:
        var(--lavender-primary);

    box-shadow:
        0 0 0 6px
        rgba(122,92,164,.10);

}


/*==========================================================
  VISUAL
==========================================================*/

.lavArticleFinalVisual{

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

}

.lavArticleFinalCircle{

    position:relative;

    display:grid;
    place-items:center;

    width:
        clamp(260px,26vw,360px);

    aspect-ratio:1;

    border-radius:50%;

    background:
        radial-gradient(
            circle at center,
            rgba(255,255,255,.95),
            rgba(243,236,248,.94)
        );

    border:
        1px solid
        rgba(122,92,164,.12);

    box-shadow:
        inset 0 0 0 1px
        rgba(255,255,255,.8),
        0 25px 60px
        rgba(60,44,76,.10);

}

.lavArticleFinalCircle::before,
.lavArticleFinalCircle::after{

    content:"";

    position:absolute;

    border-radius:50%;

}

.lavArticleFinalCircle::before{

    inset:-18px;

    border:
        1px solid
        rgba(122,92,164,.12);

}

.lavArticleFinalCircle::after{

    inset:-38px;

    border:
        1px dashed
        rgba(122,92,164,.12);

}

.lavArticleFinalCircle svg{

    width:42%;
    color:
        var(--lavender-primary);

}


/*==========================================================
  HOVER
==========================================================*/

@media (hover:hover){

.lavArticleFinalCard{

    transition:
        transform .6s cubic-bezier(.22,1,.36,1),
        box-shadow .45s ease;

}

.lavArticleFinalCard:hover{

    transform:
        translateY(-8px);

    box-shadow:
        0 40px 90px
        rgba(58,45,72,.15);

}

.lavArticleFinalCircle{

    transition:
        transform 1s cubic-bezier(.22,1,.36,1);

}

.lavArticleFinalCard:hover
.lavArticleFinalCircle{

    transform:
        rotate(6deg)
        scale(1.03);

}

}


/*==========================================================
  REVEAL
==========================================================*/

.js .lavArticleFinalContent,
.js .lavArticleFinalVisual{

    opacity:0;

    transform:
        translateY(40px);

    transition:
        opacity .8s ease,
        transform .8s cubic-bezier(.22,1,.36,1);

}

.js .lavArticleFinalContent.is-visible,
.js .lavArticleFinalVisual.is-visible{

    opacity:1;
    transform:none;

}

.js .lavArticleFinalVisual{

    transition-delay:.15s;

}


/*==========================================================
  RESPONSIVE
==========================================================*/

@media (max-width:1100px){

.lavArticleFinalCard{

    grid-template-columns:1fr;
    text-align:center;

}

.lavArticleFinalActions{

    justify-content:center;

}

.lavArticleFinalHighlights{

    grid-template-columns:1fr;

}

.lavArticleFinalContent p{

    margin-left:auto;
    margin-right:auto;

}

}

@media (max-width:768px){

.lavArticleFinalCta{

    padding:4rem 0;

}

.lavArticleFinalCard{

    padding:2rem;

}

.lavArticleFinalCircle{

    width:240px;

}

}


/*==========================================================
  REDUCED MOTION
==========================================================*/

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

.lavArticleFinalCard,
.lavArticleFinalCircle,
.js .lavArticleFinalContent,
.js .lavArticleFinalVisual{

    transition:none;

}

.js .lavArticleFinalContent,
.js .lavArticleFinalVisual{

    opacity:1;
    transform:none;

}

}