.elementor-20657 .elementor-element.elementor-element-c950dcb{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20657 .elementor-element.elementor-element-695e257{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20657 .elementor-element.elementor-element-7931408{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20657 .elementor-element.elementor-element-1dff1b4{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20657 .elementor-element.elementor-element-84928a1{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-b7462f6 *//* =========================================
   ATG PIERCING HERO
========================================= */

.atg-piercing-hero {
    --atg-black: #050505;
    --atg-cream: #f3eee4;
    --atg-muted: #bcb5aa;
    --atg-gold: #b78d49;
    --atg-cyan: #00e5ff;
    --atg-purple: #8a2be2;
    --atg-pink: #ff2d95;
    --atg-orange: #ffb324;

    position: relative;
    overflow: hidden;

    color: var(--atg-cream);

    background:
        radial-gradient(
            circle at 12% 30%,
            rgba(0, 229, 255, 0.06),
            transparent 34%
        ),
        radial-gradient(
            circle at 88% 18%,
            rgba(138, 43, 226, 0.10),
            transparent 36%
        ),
        linear-gradient(
            180deg,
            #050505 0%,
            #090909 100%
        );
}

.atg-piercing-hero *,
.atg-piercing-hero *::before,
.atg-piercing-hero *::after {
    box-sizing: border-box;
}


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

.atg-piercing-hero__inner {
    width: min(1500px, 100%);
    margin: 0 auto;

    display: grid;
    grid-template-columns:
        minmax(430px, 0.9fr)
        minmax(520px, 1.1fr);

    align-items: center;

    gap: clamp(60px, 7vw, 110px);

    padding:
        clamp(95px, 9vw, 150px)
        clamp(30px, 5vw, 70px)
        clamp(85px, 8vw, 130px);
}

.atg-piercing-hero__content {
    max-width: 620px;
}


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

.atg-piercing-hero__eyebrow {
    margin: 0 0 18px;

    color: var(--atg-gold);

    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}


/* =========================================
   HEADING
========================================= */

.atg-piercing-hero h1 {
    margin: 0 0 26px;

    color: var(--atg-cream);

    font-size: clamp(62px, 7vw, 104px);
    font-weight: 700;
    line-height: 0.92;
    letter-spacing: -0.05em;
}

.atg-piercing-hero h1 span {
    display: block;

    background:
        linear-gradient(
            90deg,
            var(--atg-cyan),
            var(--atg-purple),
            var(--atg-pink),
            var(--atg-orange),
            var(--atg-cyan)
        );

    background-size: 300% 100%;

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
    -webkit-text-fill-color: transparent;

    animation:
        atgPiercingSweep
        8s
        linear
        infinite;
}

@keyframes atgPiercingSweep {
    from {
        background-position: 0% 50%;
    }

    to {
        background-position: 300% 50%;
    }
}


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

.atg-piercing-hero__intro {
    max-width: 620px;
    margin: 0;

    color: var(--atg-muted);

    font-size: 19px;
    line-height: 1.8;
}


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

.atg-piercing-hero__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 28px;

    margin-top: 42px;
}


/* =========================================
   PRIMARY BUTTON
========================================= */

.atg-piercing-hero__button {
    position: relative;
    z-index: 0;

    overflow: hidden;
    isolation: isolate;

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

    min-height: 58px;
    padding: 18px 34px;

    color: var(--atg-cream);
    background: #090909;

    border: 1px solid rgba(243, 238, 228, 0.58);

    text-decoration: none;
    text-transform: uppercase;

    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.16em;

    transition:
        color 0.35s ease,
        border-color 0.35s ease,
        transform 0.35s ease,
        box-shadow 0.35s ease;
}

.atg-piercing-hero__button::before {
    content: "";

    position: absolute;
    inset: 0;
    z-index: -1;

    background:
        linear-gradient(
            90deg,
            var(--atg-cyan),
            var(--atg-purple),
            var(--atg-pink),
            var(--atg-orange),
            var(--atg-cyan)
        );

    background-size: 300% 100%;

    opacity: 0;

    transition: opacity 0.35s ease;
}

.atg-piercing-hero__button:hover,
.atg-piercing-hero__button:focus-visible {
    color: #ffffff;

    border-color: transparent;

    transform: translateY(-2px);

    box-shadow:
        0 12px 32px rgba(138, 43, 226, 0.20),
        0 0 20px rgba(255, 45, 149, 0.14);
}

.atg-piercing-hero__button:hover::before,
.atg-piercing-hero__button:focus-visible::before {
    opacity: 1;

    animation:
        atgPiercingSweep
        2.8s
        linear
        infinite;
}


/* =========================================
   SECONDARY LINK
========================================= */

.atg-piercing-hero__secondary {
    position: relative;

    display: inline-flex;
    align-items: center;

    gap: 10px;

    padding-bottom: 8px;

    color: var(--atg-cream);

    border-bottom:
        1px solid rgba(243, 238, 228, 0.38);

    text-decoration: none;

    font-size: 16px;
    line-height: 1.3;

    transition:
        border-color 0.3s ease,
        transform 0.3s ease;
}

.atg-piercing-hero__secondary::after {
    content: "";

    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            var(--atg-cyan),
            var(--atg-purple),
            var(--atg-pink),
            var(--atg-orange),
            var(--atg-cyan)
        );

    background-size: 300% 100%;

    opacity: 0;

    transition: opacity 0.3s ease;
}

.atg-piercing-hero__secondary:hover,
.atg-piercing-hero__secondary:focus-visible {
    color: transparent;
    -webkit-text-fill-color: transparent;

    background:
        linear-gradient(
            90deg,
            var(--atg-cyan),
            var(--atg-purple),
            var(--atg-pink),
            var(--atg-orange),
            var(--atg-cyan)
        );

    background-size: 300% 100%;

    -webkit-background-clip: text;
    background-clip: text;

    border-color: transparent;

    animation:
        atgPiercingSweep
        2.8s
        linear
        infinite;
}

.atg-piercing-hero__secondary:hover::after,
.atg-piercing-hero__secondary:focus-visible::after {
    opacity: 1;

    animation:
        atgPiercingSweep
        2.8s
        linear
        infinite;
}

.atg-piercing-hero__secondary span {
    display: inline-block;

    color: var(--atg-cream);
    -webkit-text-fill-color: var(--atg-cream);

    transition: transform 0.3s ease;
}

.atg-piercing-hero__secondary:hover span,
.atg-piercing-hero__secondary:focus-visible span {
    color: transparent;
    -webkit-text-fill-color: transparent;

    background:
        linear-gradient(
            90deg,
            var(--atg-cyan),
            var(--atg-purple),
            var(--atg-pink),
            var(--atg-orange),
            var(--atg-cyan)
        );

    background-size: 300% 100%;

    -webkit-background-clip: text;
    background-clip: text;

    transform: translateY(4px);

    animation:
        atgPiercingSweep
        2.8s
        linear
        infinite;
}


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

.atg-piercing-hero__visual {
    position: relative;
    overflow: hidden;

    height: 690px;

    background: #090909;

    border:
        1px solid rgba(183, 141, 73, 0.25);

    box-shadow:
        0 35px 80px rgba(0, 0, 0, 0.45);
}

.atg-piercing-hero__visual::after {
    content: "";

    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.04),
            rgba(0, 0, 0, 0.12)
        );

    pointer-events: none;
}

.atg-piercing-hero__visual img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transition:
        transform 0.8s
        cubic-bezier(0.2, 0.8, 0.2, 1);
}

.atg-piercing-hero__visual:hover img {
    transform: scale(1.03);
}


/* =========================================
   ACCESSIBILITY
========================================= */

.atg-piercing-hero a:focus-visible {
    outline: 2px solid var(--atg-cyan);
    outline-offset: 4px;
}


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

@media (max-width: 1024px) {

    .atg-piercing-hero__inner {
        grid-template-columns: 1fr;

        gap: 60px;
    }

    .atg-piercing-hero__visual {
        height: 620px;
    }

}


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

@media (max-width: 767px) {

    .atg-piercing-hero__inner {
        padding: 80px 20px 70px;
    }

    .atg-piercing-hero h1 {
        font-size: 56px;
    }

    .atg-piercing-hero__intro {
        font-size: 17px;
    }

    .atg-piercing-hero__actions {
        flex-direction: column;
        align-items: stretch;
    }

    .atg-piercing-hero__button {
        width: 100%;
    }

    .atg-piercing-hero__secondary {
        justify-content: center;
    }

    .atg-piercing-hero__visual {
        height: auto;
        aspect-ratio: 4 / 5;
    }

}


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

@media (max-width: 430px) {

    .atg-piercing-hero__inner {
        padding:
            72px
            16px
            58px;
    }

    .atg-piercing-hero h1 {
        font-size: 48px;
    }

    .atg-piercing-hero__intro {
        font-size: 16px;
    }

    .atg-piercing-hero__button {
        padding:
            17px
            22px;
    }

}


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

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

    .atg-piercing-hero h1 span,
    .atg-piercing-hero__button,
    .atg-piercing-hero__button::before,
    .atg-piercing-hero__secondary,
    .atg-piercing-hero__secondary::after,
    .atg-piercing-hero__secondary span,
    .atg-piercing-hero__visual img {
        animation: none;
        transition: none;
    }

    .atg-piercing-hero__button:hover,
    .atg-piercing-hero__button:focus-visible,
    .atg-piercing-hero__secondary:hover span,
    .atg-piercing-hero__secondary:focus-visible span,
    .atg-piercing-hero__visual:hover img {
        transform: none;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-94a7661 *//* =========================================
   ATG PIERCING SERVICES
========================================= */

.atg-piercing-services {
    --atg-piercing-black: #050505;
    --atg-piercing-black-soft: #0a0a0a;
    --atg-piercing-cream: #f3eee4;
    --atg-piercing-muted: #bcb5aa;
    --atg-piercing-gold: #b78d49;
    --atg-piercing-cyan: #00e5ff;
    --atg-piercing-purple: #8a2be2;
    --atg-piercing-pink: #ff2d95;
    --atg-piercing-orange: #ffb324;

    position: relative;
    overflow: hidden;

    padding:
        clamp(95px, 10vw, 155px)
        max(20px, calc((100vw - 1500px) / 2));

    color: var(--atg-piercing-cream);

    background:
        radial-gradient(
            circle at 84% 18%,
            rgba(0, 229, 255, 0.05),
            transparent 28%
        ),
        radial-gradient(
            circle at 12% 78%,
            rgba(138, 43, 226, 0.07),
            transparent 32%
        ),
        linear-gradient(
            180deg,
            #080808 0%,
            #050505 100%
        );

    border-top:
        1px solid rgba(183, 141, 73, 0.16);
}

.atg-piercing-services *,
.atg-piercing-services *::before,
.atg-piercing-services *::after {
    box-sizing: border-box;
}


/* =========================================
   HEADER
========================================= */

.atg-piercing-services__header {
    width: min(900px, 100%);

    margin:
        0 0 clamp(50px, 6vw, 82px);
}

.atg-piercing-services__eyebrow {
    margin: 0 0 18px;

    color: var(--atg-piercing-gold);

    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.atg-piercing-services__header h2 {
    margin: 0 0 24px;

    color: var(--atg-piercing-cream);

    font-size: clamp(46px, 5.5vw, 78px);
    font-weight: 700;
    line-height: 0.98;
    letter-spacing: -0.05em;
}

.atg-piercing-services__header h2 span {
    display: block;

    background:
        linear-gradient(
            90deg,
            var(--atg-piercing-cyan),
            var(--atg-piercing-purple),
            var(--atg-piercing-pink),
            var(--atg-piercing-orange),
            var(--atg-piercing-cyan)
        );

    background-size: 300% 100%;

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
    -webkit-text-fill-color: transparent;

    animation:
        atgPiercingServicesSweep
        8s
        linear
        infinite;
}

@keyframes atgPiercingServicesSweep {
    from {
        background-position: 0% 50%;
    }

    to {
        background-position: 300% 50%;
    }
}

.atg-piercing-services__header > p:last-child {
    max-width: 700px;
    margin: 0;

    color: var(--atg-piercing-muted);

    font-size: clamp(16px, 1.2vw, 19px);
    line-height: 1.72;
}


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

.atg-piercing-services__grid {
    display: grid;

    grid-template-columns:
        minmax(0, 1.08fr)
        minmax(0, 0.92fr);

    grid-template-areas:
        "ear nose"
        "ear lips"
        "tongue navel"
        "dermals specialty";

    grid-auto-rows: minmax(360px, auto);

    gap: 16px;
}


/* =========================================
   GRID ASSIGNMENTS
========================================= */

.atg-piercing-card--ear {
    grid-area: ear;

    min-height: 780px;
}

.atg-piercing-card--nose {
    grid-area: nose;
}

.atg-piercing-card--lips {
    grid-area: lips;
}

.atg-piercing-card--tongue {
    grid-area: tongue;
}

.atg-piercing-card--navel {
    grid-area: navel;
}

.atg-piercing-card--dermals {
    grid-area: dermals;
}

.atg-piercing-card--specialty {
    grid-area: specialty;
}


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

.atg-piercing-card {
    position: relative;

    min-width: 0;
    min-height: 380px;

    overflow: hidden;
    isolation: isolate;

    background:
        var(--atg-piercing-black-soft);

    border:
        1px solid rgba(243, 238, 228, 0.16);

    box-shadow:
        0 18px 42px rgba(0, 0, 0, 0.28);
}


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

.atg-piercing-card img {
    position: absolute;
    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transform: scale(1.001);

    transition:
        transform 0.7s
        cubic-bezier(0.2, 0.8, 0.2, 1),
        filter 0.35s ease;
}

.atg-piercing-card--ear img {
    object-position: center;
}

.atg-piercing-card--nose img {
    object-position: center;
}

.atg-piercing-card--lips img {
    object-position: center;
}

.atg-piercing-card--tongue img {
    object-position: center;
}

.atg-piercing-card--navel img {
    object-position: center;
}

.atg-piercing-card--dermals img {
    object-position: center;
}

.atg-piercing-card--specialty img {
    object-position: center 38%;
}


/* =========================================
   IMAGE OVERLAY
========================================= */

.atg-piercing-card::before {
    content: "";

    position: absolute;
    inset: 0;
    z-index: 1;

    background:
        linear-gradient(
            180deg,
            rgba(5, 5, 5, 0.02) 18%,
            rgba(5, 5, 5, 0.15) 52%,
            rgba(5, 5, 5, 0.9) 100%
        );

    pointer-events: none;
}


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

.atg-piercing-card__overlay {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;

    padding:
        clamp(24px, 3vw, 42px);
}

.atg-piercing-card__overlay h3 {
    margin: 0 0 10px;

    color: var(--atg-piercing-cream);

    font-size: clamp(30px, 3vw, 48px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.04em;
}

.atg-piercing-card__overlay p {
    max-width: 520px;
    margin: 0;

    color:
        rgba(243, 238, 228, 0.82);

    font-size: clamp(15px, 1.05vw, 18px);
    line-height: 1.6;
}

.atg-piercing-card--ear
.atg-piercing-card__overlay h3 {
    font-size:
        clamp(38px, 4vw, 62px);
}


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

.atg-piercing-card:hover img {
    transform: scale(1.035);

    filter: brightness(1.04);
}


/* =========================================
   NEON EDGE
========================================= */

.atg-piercing-card::after {
    content: "";

    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 3;

    height: 2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--atg-piercing-cyan),
            var(--atg-piercing-purple),
            var(--atg-piercing-pink),
            var(--atg-piercing-orange),
            transparent
        );

    opacity: 0;

    pointer-events: none;

    transition:
        opacity 0.3s ease;
}

.atg-piercing-card:hover::after {
    opacity: 0.78;
}


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

@media (max-width: 1024px) {

    .atg-piercing-services {
        padding:
            90px 26px;
    }

    .atg-piercing-services__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        grid-template-areas:
            "ear ear"
            "nose lips"
            "tongue navel"
            "dermals specialty";

        grid-auto-rows: auto;
    }

    .atg-piercing-card--ear {
        min-height: 620px;
    }

    .atg-piercing-card {
        min-height: 430px;
    }

}


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

@media (max-width: 767px) {

    .atg-piercing-services {
        padding:
            82px 18px;
    }

    .atg-piercing-services__header {
        margin-bottom: 44px;
    }

    .atg-piercing-services__header h2 {
        font-size: 44px;
    }

    .atg-piercing-services__grid {
        display: flex;
        flex-direction: column;

        gap: 14px;
    }

    .atg-piercing-card,
    .atg-piercing-card--ear {
        min-height: 520px;
    }

    .atg-piercing-card__overlay {
        padding:
            26px 22px;
    }

    .atg-piercing-card__overlay h3,
    .atg-piercing-card--ear
    .atg-piercing-card__overlay h3 {
        font-size: 36px;
    }

}


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

@media (max-width: 430px) {

    .atg-piercing-services {
        padding:
            76px 16px;
    }

    .atg-piercing-services__header h2 {
        font-size: 39px;
    }

    .atg-piercing-card,
    .atg-piercing-card--ear {
        min-height: 470px;
    }

    .atg-piercing-card__overlay p {
        font-size: 15px;
    }

}


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

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

    .atg-piercing-services__header h2 span,
    .atg-piercing-card,
    .atg-piercing-card img,
    .atg-piercing-card::after {
        animation: none;
        transition: none;
    }

    .atg-piercing-card:hover img {
        transform: none;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f2b2332 *//* =========================================
   MEET THE PIERCER
========================================= */

.atg-meet-piercer{
    --atg-black:#050505;
    --atg-black-soft:#090909;
    --atg-cream:#f3eee4;
    --atg-muted:#bcb5aa;
    --atg-gold:#b78d49;
    --atg-cyan:#00e5ff;
    --atg-purple:#8a2be2;
    --atg-pink:#ff2d95;
    --atg-orange:#ffb324;

    position:relative;
    overflow:hidden;

    padding:
        clamp(100px,10vw,160px)
        max(20px,calc((100vw - 1480px)/2));

    background:
        radial-gradient(circle at 12% 25%,rgba(138,43,226,.06),transparent 32%),
        linear-gradient(180deg,#050505 0%,#090909 100%);

    color:var(--atg-cream);

    border-top:1px solid rgba(183,141,73,.16);
}

.atg-meet-piercer *,
.atg-meet-piercer *::before,
.atg-meet-piercer *::after{
    box-sizing:border-box;
}

.atg-meet-piercer__inner{

    display:grid;
    grid-template-columns:
        minmax(430px,.85fr)
        minmax(520px,1fr);

    align-items:center;

    gap:clamp(60px,7vw,120px);

}

.atg-meet-piercer__image{

    overflow:hidden;

    border:1px solid rgba(255,255,255,.12);

    background:#0b0b0b;

}

.atg-meet-piercer__image img{

    display:block;

    width:100%;
    height:100%;

    object-fit:cover;

    transition:transform .7s cubic-bezier(.2,.8,.2,1);

}

.atg-meet-piercer__image:hover img{

    transform:scale(1.03);

}

.atg-meet-piercer__eyebrow{

    margin:0 0 18px;

    color:var(--atg-gold);

    text-transform:uppercase;

    letter-spacing:.2em;

    font-size:12px;

    font-weight:600;

}

.atg-meet-piercer h2{

    margin:0 0 24px;

    font-size:clamp(52px,6vw,82px);

    line-height:.95;

    letter-spacing:-.05em;

}

.atg-meet-piercer h2 span{

    display:block;

    background:
    linear-gradient(
        90deg,
        var(--atg-cyan),
        var(--atg-purple),
        var(--atg-pink),
        var(--atg-orange),
        var(--atg-cyan)
    );

    background-size:300% 100%;

    -webkit-background-clip:text;
    background-clip:text;

    color:transparent;
    -webkit-text-fill-color:transparent;

    animation:atgMeetPiercerSweep 8s linear infinite;

}

@keyframes atgMeetPiercerSweep{

    from{
        background-position:0% 50%;
    }

    to{
        background-position:300% 50%;
    }

}

.atg-meet-piercer__intro{

    margin:0 0 42px;

    max-width:640px;

    color:var(--atg-muted);

    font-size:18px;

    line-height:1.8;

}

.atg-meet-piercer__highlights{

    display:grid;

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

    gap:18px;

    margin-bottom:42px;

}

.atg-meet-piercer__highlights div{

    padding:22px;

    background:rgba(255,255,255,.025);

    border:1px solid rgba(255,255,255,.08);

}

.atg-meet-piercer__highlights strong{

    display:block;

    margin-bottom:8px;

    color:var(--atg-cream);

    font-size:18px;

}

.atg-meet-piercer__highlights span{

    color:var(--atg-muted);

    line-height:1.6;

}

.atg-meet-piercer__link{

    display:inline-flex;
    align-items:center;

    gap:10px;

    color:var(--atg-cream);

    text-decoration:none;

    font-size:18px;
    font-weight:600;

    transition:color .3s;

}

.atg-meet-piercer__link span{

    color:var(--atg-cream);

    transition:
        transform .3s,
        color .3s;

}

.atg-meet-piercer__link:hover{

    background:
        linear-gradient(
            90deg,
            var(--atg-cyan),
            var(--atg-purple),
            var(--atg-pink),
            var(--atg-orange),
            var(--atg-cyan)
        );

    background-size:300% 100%;

    -webkit-background-clip:text;
    background-clip:text;

    color:transparent;
    -webkit-text-fill-color:transparent;

    animation:atgMeetPiercerSweep 3s linear infinite;

}

.atg-meet-piercer__link:hover span{

    -webkit-text-fill-color:initial;

    color:var(--atg-cream);

    transform:translate(4px,-4px);

}

.atg-meet-piercer__link span{

    -webkit-text-fill-color:initial;

    color:var(--atg-cream);

    transition:transform .3s;

}

.atg-meet-piercer__link:hover span{

    transform:translate(4px,-4px);

}

@media(max-width:1024px){

.atg-meet-piercer{

padding:90px 28px;

}

.atg-meet-piercer__inner{

grid-template-columns:1fr;

}

}

@media(max-width:767px){

.atg-meet-piercer{

padding:80px 18px;

}

.atg-meet-piercer h2{

font-size:46px;

}

.atg-meet-piercer__highlights{

grid-template-columns:1fr;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-46e1ae5 *//* =========================================
   ATG CURATED JEWELRY SHOWCASE
========================================= */

.atg-jewelry-showcase {
    --atg-jewelry-black: #050505;
    --atg-jewelry-soft-black: #090909;
    --atg-jewelry-cream: #f3eee4;
    --atg-jewelry-muted: #bcb5aa;
    --atg-jewelry-gold: #b78d49;
    --atg-jewelry-cyan: #00e5ff;
    --atg-jewelry-purple: #8a2be2;
    --atg-jewelry-pink: #ff2d95;
    --atg-jewelry-orange: #ffb324;

    position: relative;
    overflow: hidden;

    padding:
        clamp(100px, 10vw, 160px)
        max(20px, calc((100vw - 1500px) / 2));

    color: var(--atg-jewelry-cream);

    background:
        radial-gradient(
            circle at 85% 16%,
            rgba(0, 229, 255, 0.045),
            transparent 28%
        ),
        radial-gradient(
            circle at 10% 82%,
            rgba(138, 43, 226, 0.07),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #090909 0%,
            #050505 100%
        );

    border-top:
        1px solid rgba(183, 141, 73, 0.16);
}

.atg-jewelry-showcase *,
.atg-jewelry-showcase *::before,
.atg-jewelry-showcase *::after {
    box-sizing: border-box;
}


/* =========================================
   HEADER
========================================= */

.atg-jewelry-showcase__header {
    width: min(940px, 100%);
    margin: 0 0 clamp(54px, 7vw, 90px);
}

.atg-jewelry-showcase__eyebrow {
    margin: 0 0 18px;

    color: var(--atg-jewelry-gold);

    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.atg-jewelry-showcase__header h2 {
    margin: 0 0 26px;

    color: var(--atg-jewelry-cream);

    font-size: clamp(48px, 5.8vw, 82px);
    font-weight: 700;
    line-height: 0.96;
    letter-spacing: -0.055em;
}

.atg-jewelry-showcase__header h2 span {
    display: block;

    background:
        linear-gradient(
            90deg,
            var(--atg-jewelry-cyan),
            var(--atg-jewelry-purple),
            var(--atg-jewelry-pink),
            var(--atg-jewelry-orange),
            var(--atg-jewelry-cyan)
        );

    background-size: 300% 100%;

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
    -webkit-text-fill-color: transparent;

    animation:
        atgJewelrySweep
        8s
        linear
        infinite;
}

@keyframes atgJewelrySweep {

    from {
        background-position: 0% 50%;
    }

    to {
        background-position: 300% 50%;
    }

}

.atg-jewelry-showcase__header > p:last-child {
    max-width: 720px;
    margin: 0;

    color: var(--atg-jewelry-muted);

    font-size: clamp(16px, 1.2vw, 19px);
    line-height: 1.75;
}


/* =========================================
   BALANCED DESKTOP GRID
========================================= */

.atg-jewelry-showcase__grid {
    display: grid;

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

    grid-template-rows:
        250px
        250px
        370px
        340px
        280px
        280px;

    grid-template-areas:
        "image1 image1 image2"
        "image1 image1 image3"
        "image4 image5 image6"
        "image7 image7 image8"
        "image9 image10 image11"
        "image9 image10 image11";

    gap: 14px;

    width: 100%;
}


/* =========================================
   EXACT IMAGE PLACEMENT
========================================= */

.atg-jewelry-showcase__item:nth-child(1) {
    grid-area: image1;
}

.atg-jewelry-showcase__item:nth-child(2) {
    grid-area: image2;
}

.atg-jewelry-showcase__item:nth-child(3) {
    grid-area: image3;
}

.atg-jewelry-showcase__item:nth-child(4) {
    grid-area: image4;
}

.atg-jewelry-showcase__item:nth-child(5) {
    grid-area: image5;
}

.atg-jewelry-showcase__item:nth-child(6) {
    grid-area: image6;
}

.atg-jewelry-showcase__item:nth-child(7) {
    grid-area: image7;
}

.atg-jewelry-showcase__item:nth-child(8) {
    grid-area: image8;
}

.atg-jewelry-showcase__item:nth-child(9) {
    grid-area: image9;
}

.atg-jewelry-showcase__item:nth-child(10) {
    grid-area: image10;
}

.atg-jewelry-showcase__item:nth-child(11) {
    grid-area: image11;
}


/* =========================================
   ITEMS
========================================= */

.atg-jewelry-showcase__item {
    appearance: none;
    -webkit-appearance: none;

    position: relative;

    display: block;

    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;

    margin: 0;
    padding: 0;

    overflow: hidden;
    isolation: isolate;

    color: inherit;
    background: var(--atg-jewelry-soft-black);

    border:
        1px solid rgba(243, 238, 228, 0.14);

    border-radius: 0;

    cursor: zoom-in;

    box-shadow:
        0 18px 42px rgba(0, 0, 0, 0.28);

    transition:
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        transform 0.3s ease;
}


/* =========================================
   IMAGES
========================================= */

.atg-jewelry-showcase__item img {
    position: absolute;
    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transform: scale(1.001);

    transition:
        transform 0.65s
        cubic-bezier(0.2, 0.8, 0.2, 1),
        filter 0.35s ease;
}


/* FEATURE IMAGE */

.atg-jewelry-showcase__item:nth-child(1) img {
    object-position: center;
}


/* LANDSCAPE DISPLAY IMAGES */

.atg-jewelry-showcase__item:nth-child(2) img,
.atg-jewelry-showcase__item:nth-child(3) img,
.atg-jewelry-showcase__item:nth-child(4) img,
.atg-jewelry-showcase__item:nth-child(5) img,
.atg-jewelry-showcase__item:nth-child(6) img {
    object-position: center;
}


/* INSTALLED EAR IMAGE */

.atg-jewelry-showcase__item:nth-child(7) img {
    object-position: center 42%;
}


/* TRAY IMAGE */

.atg-jewelry-showcase__item:nth-child(8) img {
    object-position: center;
}


/* FINAL THREE PORTRAIT IMAGES */

.atg-jewelry-showcase__item:nth-child(9) img,
.atg-jewelry-showcase__item:nth-child(10) img,
.atg-jewelry-showcase__item:nth-child(11) img {
    object-position: center;
}


/* =========================================
   SUBTLE IMAGE SHADE
========================================= */

.atg-jewelry-showcase__item::before {
    content: "";

    position: absolute;
    inset: 0;
    z-index: 1;

    background:
        linear-gradient(
            180deg,
            rgba(5, 5, 5, 0.01),
            rgba(5, 5, 5, 0.08)
        );

    pointer-events: none;
}


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

.atg-jewelry-showcase__item:hover,
.atg-jewelry-showcase__item:focus-visible {
    border-color:
        rgba(243, 238, 228, 0.42);

    box-shadow:
        0 24px 54px rgba(0, 0, 0, 0.42),
        0 0 18px rgba(138, 43, 226, 0.08);

    transform: translateY(-2px);
}

.atg-jewelry-showcase__item:hover img,
.atg-jewelry-showcase__item:focus-visible img {
    transform: scale(1.025);

    filter:
        brightness(1.04)
        contrast(1.02);
}


/* =========================================
   NEON EDGE
========================================= */

.atg-jewelry-showcase__item::after {
    content: "";

    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;

    height: 2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--atg-jewelry-cyan),
            var(--atg-jewelry-purple),
            var(--atg-jewelry-pink),
            var(--atg-jewelry-orange),
            transparent
        );

    opacity: 0;

    pointer-events: none;

    transition:
        opacity 0.3s ease;
}

.atg-jewelry-showcase__item:hover::after,
.atg-jewelry-showcase__item:focus-visible::after {
    opacity: 0.82;
}


/* =========================================
   FOCUS
========================================= */

.atg-jewelry-showcase__item:focus-visible {
    outline:
        2px solid var(--atg-jewelry-cyan);

    outline-offset: 4px;
}


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

@media (max-width: 1024px) {

    .atg-jewelry-showcase {
        padding:
            90px 26px;
    }

    .atg-jewelry-showcase__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        grid-template-rows: none;
        grid-template-areas: none;

        grid-auto-rows: 420px;

        gap: 14px;
    }

    .atg-jewelry-showcase__item:nth-child(n) {
        grid-area: auto;
        grid-column: auto;
        grid-row: auto;
    }

    .atg-jewelry-showcase__item:nth-child(1),
    .atg-jewelry-showcase__item:nth-child(7) {
        grid-column: span 2;
        min-height: 560px;
    }

}


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

@media (max-width: 767px) {

    .atg-jewelry-showcase {
        padding:
            82px 18px;
    }

    .atg-jewelry-showcase__header {
        margin-bottom: 44px;
    }

    .atg-jewelry-showcase__header h2 {
        font-size: 44px;
    }

    .atg-jewelry-showcase__grid {
        grid-template-columns: 1fr;
        grid-auto-rows: auto;

        gap: 12px;
    }

    .atg-jewelry-showcase__item:nth-child(n) {
        grid-column: auto;
        grid-row: auto;

        height: auto;

        aspect-ratio: 4 / 5;
    }

    .atg-jewelry-showcase__item:nth-child(1),
    .atg-jewelry-showcase__item:nth-child(2),
    .atg-jewelry-showcase__item:nth-child(4),
    .atg-jewelry-showcase__item:nth-child(5),
    .atg-jewelry-showcase__item:nth-child(6) {
        aspect-ratio: 4 / 3;
    }

}


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

@media (max-width: 430px) {

    .atg-jewelry-showcase {
        padding:
            76px 16px;
    }

    .atg-jewelry-showcase__header h2 {
        font-size: 39px;
    }

}


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

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

    .atg-jewelry-showcase__header h2 span,
    .atg-jewelry-showcase__item,
    .atg-jewelry-showcase__item img,
    .atg-jewelry-showcase__item::after {
        animation: none;
        transition: none;
    }

    .atg-jewelry-showcase__item:hover,
    .atg-jewelry-showcase__item:focus-visible,
    .atg-jewelry-showcase__item:hover img,
    .atg-jewelry-showcase__item:focus-visible img {
        transform: none;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f70299d *//* =========================================
   ATG PIERCING — FINAL CTA
========================================= */

.atg-piercing-final-cta {
    --atg-final-black: #050505;
    --atg-final-cream: #f3eee4;
    --atg-final-muted: #bcb5aa;
    --atg-final-gold: #b78d49;
    --atg-final-cyan: #00e5ff;
    --atg-final-purple: #8a2be2;
    --atg-final-pink: #ff2d95;
    --atg-final-orange: #ffb324;

    position: relative;
    overflow: hidden;

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

    min-height: clamp(560px, 68vh, 760px);

    padding:
        clamp(100px, 11vw, 170px)
        max(20px, calc((100vw - 1400px) / 2));

    color: var(--atg-final-cream);

    background:
        radial-gradient(
            circle at 50% 108%,
            rgba(138, 43, 226, 0.16),
            transparent 42%
        ),
        radial-gradient(
            circle at 16% 20%,
            rgba(0, 229, 255, 0.06),
            transparent 28%
        ),
        radial-gradient(
            circle at 86% 16%,
            rgba(255, 45, 149, 0.06),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #080808 0%,
            #050505 100%
        );

    border-top:
        1px solid rgba(183, 141, 73, 0.16);
}

.atg-piercing-final-cta *,
.atg-piercing-final-cta *::before,
.atg-piercing-final-cta *::after {
    box-sizing: border-box;
}


/* =========================================
   AMBIENT GLOW
========================================= */

.atg-piercing-final-cta__glow {
    position: absolute;
    top: 52%;
    left: 50%;

    width: min(920px, 90vw);
    height: min(430px, 58vw);

    background:
        radial-gradient(
            ellipse at center,
            rgba(138, 43, 226, 0.14),
            rgba(255, 45, 149, 0.06) 42%,
            transparent 74%
        );

    filter: blur(32px);

    transform: translate(-50%, -46%);

    pointer-events: none;
}


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

.atg-piercing-final-cta__inner {
    position: relative;
    z-index: 1;

    width: min(980px, 100%);
    margin: 0 auto;

    text-align: center;
}


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

.atg-piercing-final-cta__eyebrow {
    margin: 0 0 22px;

    color: var(--atg-final-gold);

    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}


/* =========================================
   HEADING
========================================= */

.atg-piercing-final-cta h2 {
    margin: 0;

    color: var(--atg-final-cream);

    font-size: clamp(58px, 8vw, 112px);
    font-weight: 700;
    line-height: 0.9;
    letter-spacing: -0.065em;
}

.atg-piercing-final-cta h2 span {
    display: block;

    background:
        linear-gradient(
            90deg,
            var(--atg-final-cyan),
            var(--atg-final-purple),
            var(--atg-final-pink),
            var(--atg-final-orange),
            var(--atg-final-cyan)
        );

    background-size: 300% 100%;

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
    -webkit-text-fill-color: transparent;

    animation:
        atgPiercingFinalSweep
        8s
        linear
        infinite;
}

@keyframes atgPiercingFinalSweep {

    from {
        background-position: 0% 50%;
    }

    to {
        background-position: 300% 50%;
    }

}


/* =========================================
   BODY COPY
========================================= */

.atg-piercing-final-cta__text {
    max-width: 700px;

    margin:
        clamp(28px, 4vw, 40px)
        auto
        0;

    color: var(--atg-final-muted);

    font-size: clamp(17px, 1.4vw, 21px);
    line-height: 1.75;
}


/* =========================================
   CTA BUTTON
========================================= */

.atg-piercing-final-cta__button {
    position: relative;
    z-index: 0;

    overflow: hidden;
    isolation: isolate;

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

    min-height: 60px;

    margin-top:
        clamp(38px, 5vw, 54px);

    padding: 0 36px;

    color: #ffffff;
    background: #090909;

    border:
        1px solid rgba(243, 238, 228, 0.6);

    text-decoration: none;
    text-transform: uppercase;

    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.17em;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

.atg-piercing-final-cta__button::before {
    content: "";

    position: absolute;
    inset: 0;
    z-index: -1;

    background:
        linear-gradient(
            90deg,
            var(--atg-final-cyan),
            var(--atg-final-purple),
            var(--atg-final-pink),
            var(--atg-final-orange),
            var(--atg-final-cyan)
        );

    background-size: 300% 100%;

    opacity: 0;

    transition: opacity 0.3s ease;
}

.atg-piercing-final-cta__button:hover,
.atg-piercing-final-cta__button:focus-visible {
    transform: translateY(-2px);

    border-color: transparent;

    box-shadow:
        0 14px 34px rgba(138, 43, 226, 0.22),
        0 0 24px rgba(255, 45, 149, 0.14);
}

.atg-piercing-final-cta__button:hover::before,
.atg-piercing-final-cta__button:focus-visible::before {
    opacity: 1;

    animation:
        atgPiercingFinalSweep
        2.8s
        linear
        infinite;
}


/* =========================================
   FOCUS
========================================= */

.atg-piercing-final-cta__button:focus-visible {
    outline:
        2px solid var(--atg-final-cyan);

    outline-offset: 4px;
}


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

@media (max-width: 767px) {

    .atg-piercing-final-cta {
        min-height: auto;

        padding:
            100px
            20px;
    }

    .atg-piercing-final-cta h2 {
        font-size: 58px;
    }

    .atg-piercing-final-cta__text {
        font-size: 17px;
    }

    .atg-piercing-final-cta__button {
        width: 100%;

        margin-top: 42px;
    }

}


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

@media (max-width: 430px) {

    .atg-piercing-final-cta {
        padding:
            88px
            16px;
    }

    .atg-piercing-final-cta h2 {
        font-size: 48px;
    }

    .atg-piercing-final-cta__button {
        padding:
            0 24px;
    }

}


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

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

    .atg-piercing-final-cta h2 span,
    .atg-piercing-final-cta__button,
    .atg-piercing-final-cta__button::before {
        animation: none;
        transition: none;
    }

    .atg-piercing-final-cta__button:hover,
    .atg-piercing-final-cta__button:focus-visible {
        transform: none;
    }

}/* End custom CSS */