/* =========================================================
   01. VARIABLES
========================================================= */
:root {
    --lion-green-dark: #071d16;
    --lion-green: #0d3325;
    --lion-green-2: #174b35;
    --lion-green-light: #296745;

    --lion-gold: #f1bf3f;
    --lion-gold-2: #d99d1e;
    --lion-gold-light: #ffd86b;

    --lion-white: #ffffff;
    --lion-off-white: #f6f7f2;
    --lion-text: #1b2923;
    --lion-muted: #7e8984;

    --lion-shadow: 0 15px 45px rgba(0, 0, 0, .14);

    --lion-radius: 8px;
    --lion-transition: .3s ease;
}

/* =========================================================
   GLOBAL BODY CSS
   LION TREE SERVICE AND LANDSCAPING LLC
========================================================= */

html {
    width: 100%;
    margin: 0;
    padding: 0;

    scroll-behavior: smooth;

    overflow-x: hidden;
}

body {
    width: 100%;
    min-height: 100vh;

    margin: 0;
    padding: 0;

    overflow-x: hidden;

    background: #ffffff;

    color: #1b2923;

    font-family: "DM Sans", Arial, sans-serif;

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

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/* =========================================================
   BOX SIZING GLOBAL
========================================================= */

*,
*::before,
*::after {
    box-sizing: border-box;
}


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

p,
li,
a,
span,
button,
input,
textarea,
select,
label {
    font-size: inherit;
}

p {
    margin-top: 0;
    margin-bottom: 18px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;

    font-family: "Oswald", Arial, sans-serif;

    color: #071d16;

    line-height: 1.15;
}


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

img {
    display: block;

    max-width: 100%;
    height: auto;
}


/* =========================================================
   LINKS
========================================================= */

a {
    color: inherit;
    text-decoration: none;
}


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

button,
input,
textarea,
select {
    font-family: inherit;
}

button {
    cursor: pointer;
}


/* =========================================================
   GLOBAL CONTAINER
========================================================= */

.lion-container {
    width: min(92%, 1400px);

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


/* =========================================================
   GLOBAL SECTION SPACING
========================================================= */

.lion-section {
    width: 100%;

    padding: 90px 0;

    position: relative;
}


/* =========================================================
   PREVENT OVERFLOW
========================================================= */

section,
header,
footer,
main,
nav,
aside,
article,
div {
    max-width: 100%;
}


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

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 3px solid #f1bf3f;
    outline-offset: 3px;
}


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

::selection {
    background: #f1bf3f;
    color: #071d16;
}


/* =========================================================
   CUSTOM SCROLLBAR
========================================================= */

::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #071d16;
}

::-webkit-scrollbar-thumb {
    background: #f1bf3f;

    border-radius: 10px;

    border: 2px solid #071d16;
}

::-webkit-scrollbar-thumb:hover {
    background: #d99d1e;
}


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

@media (max-width: 991px) {

    body {
        font-size: 15px;
    }

    .lion-section {
        padding: 70px 0;
    }

    .lion-container {
        width: calc(100% - 40px);
    }

}


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

@media (max-width: 767px) {

    html,
    body {
        width: 100%;

        overflow-x: hidden;
    }

    body {
        /*
        Dejamos 14px como mínimo absoluto
        para la versión móvil.
        */
        font-size: 14px;

        line-height: 1.65;
    }

    .lion-section {
        padding: 55px 0;
    }

    .lion-container {
        width: calc(100% - 28px);

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

}


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

@media (max-width: 390px) {

    .lion-container {
        width: calc(100% - 20px);
    }

}


/* =========================================================
   MOBILE OFF-CANVAS BODY LOCK
========================================================= */

body.lion-menu-is-open {
    overflow: hidden;
}


/* =========================================================
   02. RESET LOCAL DEL HEADER
========================================================= */
.lion-site-header,
.lion-site-header *,
.lion-mobile-panel,
.lion-mobile-panel *,
.lion-menu-overlay {
    box-sizing: border-box;
}

.lion-site-header {
    width: 100%;
    position: relative;
    z-index: 9990;
    font-family: "DM Sans", sans-serif;
    font-size: 16px;
}

.lion-site-header a {
    text-decoration: none;
}

.lion-site-header button {
    font-family: inherit;
}

.lion-header-container {
    width: min(94%, 1440px);
    margin: 0 auto;
}


/* =========================================================
   03. TOP BAR
========================================================= */
.lion-topbar {
    width: 100%;
    min-height: 45px;
    background:
        linear-gradient(90deg,
            #061b14 0%,
            #0a2b20 50%,
            #061b14 100%);
    position: relative;
    overflow: hidden;
    color: var(--lion-white);
    border-bottom: 1px solid rgba(241, 191, 63, .22);
}

.lion-topbar::before {
    content: "";
    position: absolute;
    inset: 0;

    background-image:
        radial-gradient(circle at 20% 0%,
            rgba(241, 191, 63, .11),
            transparent 28%),

        repeating-radial-gradient(circle at 90% 150%,
            transparent 0,
            transparent 17px,
            rgba(255, 255, 255, .018) 18px,
            transparent 19px);

    pointer-events: none;
}

.lion-topbar-inner {
    position: relative;
    z-index: 2;

    min-height: 45px;

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

    gap: 20px;
}

.lion-topbar-left,
.lion-topbar-right {
    display: flex;
    align-items: center;
    gap: 23px;
}

.lion-top-item {
    color: rgba(255, 255, 255, .87);
    display: inline-flex;
    align-items: center;
    gap: 8px;

    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;

    transition: var(--lion-transition);
}

a.lion-top-item:hover {
    color: var(--lion-gold-light);
}

.lion-top-item i {
    color: var(--lion-gold);
    font-size: 14px;
}

.lion-open-status {
    position: relative;
    padding-left: 14px;
}

.lion-open-status::before {
    content: "";
    width: 7px;
    height: 7px;

    background: #67db83;
    border-radius: 50%;

    position: absolute;
    left: 0;
    top: 50%;

    transform: translateY(-50%);

    box-shadow:
        0 0 0 4px rgba(103, 219, 131, .13),
        0 0 12px rgba(103, 219, 131, .55);

    animation: lionStatusPulse 2s infinite;
}

@keyframes lionStatusPulse {

    0%,
    100% {
        box-shadow:
            0 0 0 3px rgba(103, 219, 131, .12),
            0 0 8px rgba(103, 219, 131, .4);
    }

    50% {
        box-shadow:
            0 0 0 6px rgba(103, 219, 131, .05),
            0 0 16px rgba(103, 219, 131, .7);
    }
}


/* =========================================================
   04. HEADER PRINCIPAL
========================================================= */
.lion-main-header {
    height: 104px;
    background: rgba(255, 255, 255, .985);

    position: relative;

    border-bottom: 1px solid #e8ece9;

    transition:
        box-shadow .3s ease,
        height .3s ease,
        background .3s ease;
}

.lion-main-header::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;

    width: 100%;
    height: 3px;

    background: linear-gradient(90deg,
            transparent 0%,
            var(--lion-gold) 20%,
            var(--lion-gold-light) 50%,
            var(--lion-gold) 80%,
            transparent 100%);

    opacity: .7;
}

.lion-header-inner {
    height: 100%;

    display: grid;
    grid-template-columns: minmax(245px, .95fr) auto minmax(215px, .75fr);

    align-items: center;
    gap: 28px;
}


/* =========================================================
   05. LOGO
========================================================= */
.lion-brand {
    min-width: 0;

    display: flex;
    align-items: center;
    gap: 14px;

    position: relative;
}

.lion-logo-wrap {
    width: 94px;
    height: 94px;

    flex: 0 0 94px;

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

    position: relative;
}

.lion-logo-wrap::before {
    content: "";

    width: 72px;
    height: 72px;

    position: absolute;
    border-radius: 50%;

    background:
        radial-gradient(circle,
            rgba(241, 191, 63, .22),
            rgba(241, 191, 63, .06) 45%,
            transparent 72%);

    animation: lionLogoGlow 4s ease-in-out infinite;
}

@keyframes lionLogoGlow {

    0%,
    100% {
        transform: scale(.95);
        opacity: .6;
    }

    50% {
        transform: scale(1.15);
        opacity: 1;
    }
}

.lion-logo {
    display: block;

    width: 91px;
    height: 91px;

    object-fit: contain;

    position: relative;
    z-index: 2;

    filter: drop-shadow(0 4px 5px rgba(0, 0, 0, .13));

    transition: transform .35s ease;
}

.lion-brand:hover .lion-logo {
    transform: scale(1.035) rotate(-1deg);
}

.lion-brand-copy {
    min-width: 0;
}

.lion-company-name {
    margin: 0 0 3px;

    color: var(--lion-green-dark);

    font-family: "Oswald", sans-serif;
    font-size: clamp(18px, 1.25vw, 23px);
    font-weight: 700;
    line-height: 1.08;

    text-transform: uppercase;
    letter-spacing: -.1px;
}

.lion-company-name span {
    color: var(--lion-gold-2);
}

.lion-company-sub {
    margin: 0;

    color: #647069;

    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;

    letter-spacing: .4px;
}


/* =========================================================
   06. DESKTOP NAVIGATION
========================================================= */
.lion-desktop-nav {
    display: flex;
    align-items: center;
    justify-content: center;

    height: 100%;
}

.lion-main-menu {
    padding: 0;
    margin: 0;

    list-style: none;

    height: 100%;

    display: flex;
    align-items: center;
    gap: 5px;
}

.lion-main-menu>li {
    height: 100%;
    position: relative;

    display: flex;
    align-items: center;
}

.lion-main-menu>li>a {
    height: 100%;

    display: flex;
    align-items: center;
    gap: 6px;

    padding: 0 11px;

    color: #263b31;

    font-family: "DM Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;

    white-space: nowrap;

    position: relative;

    transition:
        color .25s ease,
        transform .25s ease;
}

.lion-main-menu>li>a::after {
    content: "";

    position: absolute;
    left: 50%;
    bottom: 25px;

    width: 0;
    height: 2px;

    background: var(--lion-gold);

    transform: translateX(-50%);

    transition: width .3s ease;
}

.lion-main-menu>li:hover>a,
.lion-main-menu>li>a.lion-active {
    color: var(--lion-green);
}

.lion-main-menu>li:hover>a::after,
.lion-main-menu>li>a.lion-active::after {
    width: calc(100% - 22px);
}

.lion-main-menu .fa-chevron-down {
    font-size: 9px;
    color: var(--lion-gold-2);
}


/* =========================================================
   07. SERVICES DROPDOWN
========================================================= */
.lion-has-dropdown {
    position: relative;
}

.lion-dropdown {
    width: 315px;

    position: absolute;
    top: calc(100% - 9px);
    left: 50%;

    transform:
        translate(-50%, 13px) scale(.98);

    padding: 10px;

    list-style: none;

    background: #fff;

    border: 1px solid rgba(10, 43, 32, .09);
    border-top: 3px solid var(--lion-gold);

    border-radius: 0 0 12px 12px;

    box-shadow:
        0 22px 50px rgba(0, 0, 0, .17);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition:
        opacity .25s ease,
        visibility .25s ease,
        transform .25s ease;
}

.lion-has-dropdown:hover .lion-dropdown,
.lion-has-dropdown:focus-within .lion-dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;

    transform:
        translate(-50%, 0) scale(1);
}

.lion-dropdown::before {
    content: "";

    position: absolute;
    top: -10px;
    left: 50%;

    width: 16px;
    height: 16px;

    background: var(--lion-gold);

    transform:
        translateX(-50%) rotate(45deg);

    z-index: -1;
}

.lion-dropdown li+li {
    border-top: 1px solid #edf0ee;
}

.lion-dropdown a {
    min-height: 43px;

    padding: 9px 12px;

    color: #26392f;

    font-size: 14px;
    line-height: 1.3;
    font-weight: 650;

    display: flex;
    align-items: center;
    gap: 11px;

    border-radius: 7px;

    transition: var(--lion-transition);
}

.lion-dropdown a i {
    width: 20px;

    color: var(--lion-gold-2);

    font-size: 15px;
    text-align: center;

    transition: transform .3s ease;
}

.lion-dropdown a:hover {
    color: var(--lion-white);

    background:
        linear-gradient(105deg,
            var(--lion-green),
            var(--lion-green-2));

    padding-left: 16px;
}

.lion-dropdown a:hover i {
    color: var(--lion-gold-light);
    transform: rotate(-8deg) scale(1.08);
}


/* =========================================================
   08. HEADER CTA
========================================================= */
.lion-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;

    gap: 12px;
}

.lion-call-mini {
    min-width: 0;

    display: flex;
    align-items: center;
    gap: 10px;

    color: var(--lion-green-dark);
}

.lion-call-icon {
    width: 43px;
    height: 43px;

    flex: 0 0 43px;

    border-radius: 50%;

    display: grid;
    place-items: center;

    color: var(--lion-green-dark);

    background:
        linear-gradient(135deg,
            var(--lion-gold-light),
            var(--lion-gold));

    box-shadow:
        0 7px 18px rgba(217, 157, 30, .25);

    transition: var(--lion-transition);
}

.lion-call-mini:hover .lion-call-icon {
    transform: rotate(-9deg) scale(1.06);
}

.lion-call-copy {
    display: flex;
    flex-direction: column;

    line-height: 1.15;
}

.lion-call-copy small {
    margin-bottom: 4px;

    color: #748079;

    font-size: 12px;
    font-weight: 650;

    text-transform: uppercase;
    letter-spacing: .7px;
}

.lion-call-copy strong {
    color: var(--lion-green-dark);

    font-family: "Oswald", sans-serif;
    font-size: 17px;
    font-weight: 700;

    white-space: nowrap;
}

.lion-emergency-btn {
    min-height: 50px;

    padding: 0 18px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    position: relative;
    overflow: hidden;

    color: var(--lion-white);

    background:
        linear-gradient(115deg,
            #0a2c20 0%,
            #124a34 100%);

    border: 1px solid rgba(241, 191, 63, .37);
    border-radius: var(--lion-radius);

    font-size: 14px;
    font-weight: 800;

    white-space: nowrap;

    box-shadow:
        0 9px 20px rgba(4, 35, 25, .17);

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}

.lion-emergency-btn::before {
    content: "";

    width: 55px;
    height: 160%;

    position: absolute;
    top: -30%;
    left: -90px;

    transform: rotate(22deg);

    background:
        linear-gradient(to right,
            transparent,
            rgba(255, 255, 255, .24),
            transparent);

    animation: lionButtonShine 4.2s ease infinite;
}

@keyframes lionButtonShine {

    0%,
    64% {
        left: -90px;
    }

    83%,
    100% {
        left: 140%;
    }
}

.lion-emergency-btn i {
    color: var(--lion-gold);
}

.lion-emergency-btn:hover {
    transform: translateY(-2px);

    box-shadow:
        0 13px 26px rgba(4, 35, 25, .25);
}


/* =========================================================
   09. STICKY STATE
========================================================= */
.lion-site-header.lion-is-sticky .lion-main-header {
    position: fixed;
    top: 0;
    left: 0;

    width: 100%;
    height: 82px;

    box-shadow:
        0 12px 35px rgba(0, 0, 0, .13);

    animation: lionHeaderDrop .32s ease;
}

.lion-site-header.lion-is-sticky .lion-logo-wrap {
    width: 73px;
    height: 73px;
    flex-basis: 73px;
}

.lion-site-header.lion-is-sticky .lion-logo {
    width: 70px;
    height: 70px;
}

@keyframes lionHeaderDrop {
    from {
        transform: translateY(-100%);
    }

    to {
        transform: translateY(0);
    }
}

.lion-sticky-spacer {
    display: none;
}

.lion-site-header.lion-is-sticky .lion-sticky-spacer {
    display: block;
    height: 104px;
}


/* =========================================================
   10. MOBILE BUTTON
========================================================= */
.lion-mobile-trigger {
    width: 50px;
    height: 50px;

    padding: 0;

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

    position: relative;

    border: 0;
    border-radius: 8px;

    background: var(--lion-green-dark);

    cursor: pointer;

    box-shadow:
        0 8px 20px rgba(4, 35, 25, .18);
}

.lion-mobile-trigger-bars {
    width: 23px;
    height: 17px;

    position: relative;
}

.lion-mobile-trigger-bars span {
    width: 23px;
    height: 2px;

    position: absolute;
    left: 0;

    background: var(--lion-gold);

    border-radius: 20px;

    transition: .3s ease;
}

.lion-mobile-trigger-bars span:nth-child(1) {
    top: 0;
}

.lion-mobile-trigger-bars span:nth-child(2) {
    top: 7px;
    width: 17px;
    left: 6px;
}

.lion-mobile-trigger-bars span:nth-child(3) {
    top: 14px;
}


/* =========================================================
   11. MOBILE OVERLAY
========================================================= */
.lion-menu-overlay {
    position: fixed;
    inset: 0;

    z-index: 9997;

    background: rgba(1, 12, 8, .71);
    backdrop-filter: blur(4px);

    opacity: 0;
    visibility: hidden;

    transition:
        opacity .32s ease,
        visibility .32s ease;
}

.lion-menu-overlay.lion-open {
    opacity: 1;
    visibility: visible;
}


/* =========================================================
   12. MOBILE OFF CANVAS
========================================================= */
.lion-mobile-panel {
    width: min(92vw, 390px);
    height: 100dvh;

    position: fixed;
    top: 0;
    right: 0;

    z-index: 9999;

    overflow-x: hidden;
    overflow-y: auto;

    background:
        linear-gradient(180deg,
            #071d16 0%,
            #0c2d21 48%,
            #061812 100%);

    color: var(--lion-white);

    transform: translateX(105%);

    box-shadow:
        -30px 0 70px rgba(0, 0, 0, .34);

    transition:
        transform .42s cubic-bezier(.77, 0, .18, 1);
}

.lion-mobile-panel.lion-open {
    transform: translateX(0);
}

.lion-mobile-panel::before {
    content: "";

    width: 360px;
    height: 360px;

    position: absolute;
    top: -200px;
    right: -180px;

    border-radius: 50%;

    border:
        1px solid rgba(241, 191, 63, .08);

    box-shadow:
        0 0 0 35px rgba(241, 191, 63, .018),
        0 0 0 70px rgba(241, 191, 63, .014);

    pointer-events: none;
}

.lion-mobile-panel-inner {
    min-height: 100%;

    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: column;
}


/* =========================================================
   13. OFF CANVAS HEADER
========================================================= */
.lion-mobile-panel-head {
    min-height: 118px;

    padding: 17px 18px;

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

    gap: 13px;

    border-bottom:
        1px solid rgba(255, 255, 255, .085);
}

.lion-mobile-brand {
    min-width: 0;

    display: flex;
    align-items: center;
    gap: 11px;
}

.lion-mobile-logo {
    width: 75px;
    height: 75px;

    flex: 0 0 75px;

    object-fit: contain;

    filter:
        drop-shadow(0 5px 8px rgba(0, 0, 0, .27));
}

.lion-mobile-brand-text {
    min-width: 0;
}

.lion-mobile-brand-text strong {
    display: block;

    margin-bottom: 4px;

    color: var(--lion-white);

    font-family: "Oswald", sans-serif;
    font-size: 18px;
    line-height: 1.06;

    text-transform: uppercase;
}

.lion-mobile-brand-text span {
    display: block;

    color: var(--lion-gold-light);

    font-size: 13px;
    line-height: 1.2;
    font-weight: 650;
}

.lion-mobile-close {
    width: 43px;
    height: 43px;

    flex: 0 0 43px;

    padding: 0;

    border:
        1px solid rgba(255, 255, 255, .12);
    border-radius: 50%;

    color: var(--lion-white);
    background: rgba(255, 255, 255, .06);

    font-size: 18px;

    cursor: pointer;

    transition: .3s ease;
}

.lion-mobile-close:hover {
    color: var(--lion-green-dark);
    background: var(--lion-gold);

    transform: rotate(90deg);
}


/* =========================================================
   14. MOBILE EMERGENCY BLOCK
========================================================= */
.lion-mobile-emergency {
    margin: 17px 18px 8px;
    padding: 15px;

    display: flex;
    align-items: center;
    gap: 13px;

    border:
        1px solid rgba(241, 191, 63, .25);
    border-radius: 10px;

    background:
        linear-gradient(120deg,
            rgba(241, 191, 63, .13),
            rgba(255, 255, 255, .035));
}

.lion-mobile-emergency-icon {
    width: 45px;
    height: 45px;

    flex: 0 0 45px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    color: var(--lion-green-dark);
    background: var(--lion-gold);

    font-size: 17px;
}

.lion-mobile-emergency-copy span {
    display: block;

    color: var(--lion-gold-light);

    font-size: 12px;
    font-weight: 750;

    text-transform: uppercase;
    letter-spacing: .7px;
}

.lion-mobile-emergency-copy strong {
    display: block;

    margin-top: 3px;

    color: var(--lion-white);

    font-family: "Oswald", sans-serif;
    font-size: 18px;
    line-height: 1.15;
}


/* =========================================================
   15. MOBILE MENU
========================================================= */
.lion-mobile-nav {
    padding: 10px 18px 5px;
}

.lion-mobile-menu {
    padding: 0;
    margin: 0;

    list-style: none;
}

.lion-mobile-menu>li {
    border-bottom:
        1px solid rgba(255, 255, 255, .08);
}

.lion-mobile-menu>li>a,
.lion-mobile-service-toggle {
    width: 100%;
    min-height: 53px;

    padding: 10px 2px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 13px;

    border: 0;
    background: transparent;

    color: rgba(255, 255, 255, .94);

    font-size: 15px;
    font-weight: 650;
    line-height: 1.3;

    text-align: left;

    cursor: pointer;

    transition: color .25s ease;
}

.lion-mobile-menu>li>a:hover,
.lion-mobile-service-toggle:hover {
    color: var(--lion-gold-light);
}

.lion-mobile-link-left {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.lion-mobile-link-left i {
    width: 20px;

    color: var(--lion-gold);

    text-align: center;
}

.lion-mobile-service-toggle>i {
    color: var(--lion-gold);

    transition: transform .3s ease;
}

.lion-mobile-service-toggle.lion-active>i {
    transform: rotate(180deg);
}


/* MOBILE SUBMENU */
.lion-mobile-submenu {
    max-height: 0;

    padding: 0;
    margin: 0;

    list-style: none;

    overflow: hidden;

    transition:
        max-height .45s ease,
        padding .3s ease;
}

.lion-mobile-submenu.lion-open {
    max-height: 600px;
    padding: 0 0 12px;
}

.lion-mobile-submenu li {
    margin: 4px 0;
}

.lion-mobile-submenu a {
    min-height: 41px;

    padding: 8px 11px 8px 14px;

    display: flex;
    align-items: center;
    gap: 10px;

    color: rgba(255, 255, 255, .78);
    background: rgba(255, 255, 255, .035);

    border-left: 2px solid rgba(241, 191, 63, .5);
    border-radius: 0 6px 6px 0;

    font-size: 14px;
    line-height: 1.35;
    font-weight: 550;

    transition: .25s ease;
}

.lion-mobile-submenu a i {
    width: 18px;

    color: var(--lion-gold);

    text-align: center;
}

.lion-mobile-submenu a:hover {
    color: #fff;
    background: rgba(241, 191, 63, .10);

    border-left-color: var(--lion-gold);
}


/* =========================================================
   16. MOBILE CLIENT INFORMATION
========================================================= */
.lion-mobile-info {
    margin: 18px;

    border:
        1px solid rgba(255, 255, 255, .09);
    border-radius: 9px;

    overflow: hidden;

    background: rgba(255, 255, 255, .028);
}

.lion-mobile-info-title {
    padding: 13px 14px;

    color: var(--lion-gold-light);
    background: rgba(255, 255, 255, .035);

    font-family: "Oswald", sans-serif;
    font-size: 15px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: .5px;
}

.lion-mobile-info-item {
    min-height: 55px;

    padding: 11px 14px;

    display: flex;
    align-items: flex-start;
    gap: 12px;

    border-top:
        1px solid rgba(255, 255, 255, .07);
}

.lion-mobile-info-item i {
    width: 19px;
    margin-top: 3px;

    flex: 0 0 19px;

    color: var(--lion-gold);

    font-size: 15px;
    text-align: center;
}

.lion-mobile-info-item div {
    min-width: 0;
}

.lion-mobile-info-item small {
    display: block;

    margin-bottom: 2px;

    color: rgba(255, 255, 255, .51);

    font-size: 11px;
    font-weight: 650;

    text-transform: uppercase;
    letter-spacing: .6px;
}

.lion-mobile-info-item a,
.lion-mobile-info-item span {
    color: rgba(255, 255, 255, .91);

    overflow-wrap: anywhere;

    font-size: 14px;
    line-height: 1.4;
    font-weight: 550;
}


/* =========================================================
   17. MOBILE CTA
========================================================= */
.lion-mobile-bottom {
    margin-top: auto;

    padding: 2px 18px 24px;
}

.lion-mobile-call-btn {
    width: 100%;
    min-height: 54px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    color: var(--lion-green-dark);
    background:
        linear-gradient(115deg,
            var(--lion-gold-light),
            var(--lion-gold));

    border-radius: 7px;

    font-size: 15px;
    font-weight: 800;

    box-shadow:
        0 10px 25px rgba(0, 0, 0, .22);
}


/* =========================================================
   18. LAPTOP
========================================================= */
@media (max-width: 1280px) {

    .lion-header-container {
        width: min(96%, 1250px);
    }

    .lion-header-inner {
        grid-template-columns: minmax(210px, .85fr) auto minmax(165px, .55fr);
        gap: 16px;
    }

    .lion-logo-wrap {
        width: 82px;
        height: 82px;
        flex-basis: 82px;
    }

    .lion-logo {
        width: 80px;
        height: 80px;
    }

    .lion-company-name {
        font-size: 18px;
    }

    .lion-company-sub {
        display: none;
    }

    .lion-main-menu>li>a {
        padding: 0 8px;
        font-size: 14px;
    }

    .lion-call-copy {
        display: none;
    }

    .lion-emergency-btn {
        padding: 0 14px;
    }
}


/* =========================================================
   19. TABLET / MOBILE NAV MODE
========================================================= */
@media (max-width: 1050px) {

    .lion-main-header {
        height: 90px;
    }

    .lion-header-inner {
        display: flex;
        justify-content: space-between;

        gap: 18px;
    }

    .lion-desktop-nav {
        display: none;
    }

    .lion-header-actions {
        margin-left: auto;
    }

    .lion-mobile-trigger {
        display: flex;
    }

    .lion-logo-wrap {
        width: 78px;
        height: 78px;
        flex-basis: 78px;
    }

    .lion-logo {
        width: 76px;
        height: 76px;
    }

    .lion-company-name {
        font-size: 19px;
    }

    .lion-company-sub {
        display: block;
        font-size: 13px;
    }

    .lion-site-header.lion-is-sticky .lion-main-header {
        height: 78px;
    }

    .lion-site-header.lion-is-sticky .lion-sticky-spacer {
        height: 90px;
    }
}


/* =========================================================
   20. MOBILE
========================================================= */
@media (max-width: 767px) {

    .lion-header-container {
        width: calc(100% - 28px);
    }

    /* ---------- MOBILE TOP BAR ---------- */

    .lion-topbar {
        min-height: 42px;
    }

    .lion-topbar-inner {
        width: calc(100% - 24px);
        min-height: 42px;

        justify-content: space-between;

        gap: 8px;
    }

    .lion-topbar-left {
        gap: 0;
        min-width: 0;
    }

    .lion-topbar-right {
        gap: 0;
    }

    .lion-topbar .lion-address-item,
    .lion-topbar .lion-email-item {
        display: none;
    }

    .lion-open-status {
        padding-left: 12px;

        font-size: 12px;
        white-space: nowrap;
    }

    .lion-top-phone {
        min-height: 42px;

        padding-left: 12px;

        font-size: 13px;
        font-weight: 700;

        white-space: nowrap;
    }

    /* ---------- MAIN ---------- */

    .lion-main-header {
        height: 83px;
    }

    .lion-header-inner {
        gap: 8px;
    }

    .lion-brand {
        flex: 1;
        min-width: 0;

        gap: 8px;
    }

    .lion-logo-wrap {
        width: 67px;
        height: 67px;

        flex: 0 0 67px;
    }

    .lion-logo {
        width: 66px;
        height: 66px;
    }

    .lion-logo-wrap::before {
        width: 55px;
        height: 55px;
    }

    .lion-brand-copy {
        max-width: 170px;
    }

    .lion-company-name {
        margin: 0;

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

        white-space: normal;
    }

    .lion-company-sub {
        margin-top: 4px;

        font-size: 11px;
        line-height: 1.15;

        display: block;
    }

    .lion-call-mini,
    .lion-emergency-btn {
        display: none;
    }

    .lion-mobile-trigger {
        width: 47px;
        height: 47px;

        flex: 0 0 47px;
    }

    .lion-site-header.lion-is-sticky .lion-main-header {
        height: 74px;
    }

    .lion-site-header.lion-is-sticky .lion-sticky-spacer {
        height: 83px;
    }

    .lion-site-header.lion-is-sticky .lion-logo-wrap {
        width: 60px;
        height: 60px;
        flex-basis: 60px;
    }

    .lion-site-header.lion-is-sticky .lion-logo {
        width: 59px;
        height: 59px;
    }
}


/* =========================================================
   21. VERY SMALL MOBILE
========================================================= */
@media (max-width: 390px) {

    .lion-header-container {
        width: calc(100% - 20px);
    }

    .lion-company-name {
        font-size: 14px;
    }

    .lion-company-sub {
        font-size: 10px;
    }

    .lion-logo-wrap {
        width: 61px;
        height: 61px;

        flex-basis: 61px;
    }

    .lion-logo {
        width: 60px;
        height: 60px;
    }

    .lion-open-status {
        font-size: 11px;
    }

    .lion-top-phone {
        padding-left: 7px;

        font-size: 12px;
    }

    .lion-mobile-panel {
        width: 94vw;
    }

    .lion-mobile-logo {
        width: 66px;
        height: 66px;

        flex-basis: 66px;
    }

    .lion-mobile-brand-text strong {
        font-size: 16px;
    }
}


/* =========================================================
   22. PREVENT BODY SCROLL
========================================================= */
body.lion-menu-is-open {
    overflow: hidden;
}



/* =========================================================
   01. HERO VARIABLES
========================================================= */

.lion-hero {
    --hero-green: #071d16;
    --hero-green-2: #0c3325;
    --hero-green-3: #174c35;

    --hero-gold: #f1bf3f;
    --hero-gold-2: #d99d1e;
    --hero-gold-light: #ffd96c;

    --hero-white: #ffffff;
    --hero-soft: #f5f6f2;

    width: 100%;
    min-height: 710px;

    position: relative;

    overflow: hidden;

    background: #061711;

    font-family: "DM Sans", Arial, sans-serif;
}


/* =========================================================
   02. SLIDER WRAPPER
========================================================= */

.lion-hero-slider {
    width: 100%;
    min-height: 710px;

    position: relative;

    overflow: hidden;
}


/* =========================================================
   03. SLIDE
========================================================= */

.lion-hero-slide {
    width: 100%;
    height: 100%;

    min-height: 710px;

    position: absolute;
    inset: 0;

    overflow: hidden;

    opacity: 0;
    visibility: hidden;

    pointer-events: none;

    transition:
        opacity 1.1s ease,
        visibility 1.1s ease;
}

.lion-hero-slide.is-active {
    opacity: 1;
    visibility: visible;

    pointer-events: auto;

    z-index: 3;
}


/* =========================================================
   04. BACKGROUND IMAGE
========================================================= */

.lion-slide-bg {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;

    transform: scale(1.07);

    transition:
        transform 8s ease;
}

.lion-hero-slide.is-active .lion-slide-bg {
    transform: scale(1);
}


/* =========================================================
   05. CINEMATIC OVERLAYS
========================================================= */

.lion-hero-slide::before {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 1;

    background:
        linear-gradient(90deg,
            rgba(3, 17, 12, .96) 0%,
            rgba(4, 25, 18, .88) 28%,
            rgba(6, 28, 20, .54) 52%,
            rgba(6, 28, 20, .15) 75%,
            rgba(6, 28, 20, .08) 100%);
}

.lion-hero-slide::after {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 2;

    pointer-events: none;

    background:
        linear-gradient(180deg,
            rgba(0, 0, 0, .08) 0%,
            transparent 35%,
            rgba(0, 0, 0, .35) 100%),

        radial-gradient(circle at 68% 42%,
            rgba(241, 191, 63, .11),
            transparent 32%);
}


/* =========================================================
   06. TREE RINGS DECORATIVE EFFECT
========================================================= */

.lion-tree-rings {
    width: 470px;
    height: 470px;

    position: absolute;
    right: -130px;
    bottom: -170px;

    z-index: 3;

    border-radius: 50%;

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

    box-shadow:
        0 0 0 38px rgba(255, 255, 255, .024),
        0 0 0 78px rgba(241, 191, 63, .025),
        0 0 0 120px rgba(255, 255, 255, .015);

    pointer-events: none;

    animation:
        lionTreeRingRotate 20s linear infinite;
}

.lion-tree-rings::before,
.lion-tree-rings::after {
    content: "";

    position: absolute;

    border-radius: 50%;

    border:
        1px dashed rgba(241, 191, 63, .11);
}

.lion-tree-rings::before {
    inset: 38px;
}

.lion-tree-rings::after {
    inset: 90px;
}

@keyframes lionTreeRingRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


/* =========================================================
   07. FLOATING LEAVES
========================================================= */

.lion-floating-leaves {
    position: absolute;
    inset: 0;

    z-index: 4;

    overflow: hidden;

    pointer-events: none;
}

.lion-floating-leaf {
    position: absolute;

    color: rgba(241, 191, 63, .20);

    font-size: 18px;

    opacity: 0;

    animation:
        lionLeafFloat linear infinite;
}

.lion-floating-leaf:nth-child(1) {
    left: 6%;
    top: 22%;

    animation-duration: 9s;
    animation-delay: 0s;
}

.lion-floating-leaf:nth-child(2) {
    left: 32%;
    top: 14%;

    font-size: 13px;

    animation-duration: 12s;
    animation-delay: 2s;
}

.lion-floating-leaf:nth-child(3) {
    right: 14%;
    top: 18%;

    font-size: 22px;

    animation-duration: 10s;
    animation-delay: 1s;
}

.lion-floating-leaf:nth-child(4) {
    right: 32%;
    top: 40%;

    font-size: 15px;

    animation-duration: 13s;
    animation-delay: 3s;
}

.lion-floating-leaf:nth-child(5) {
    left: 48%;
    bottom: 10%;

    font-size: 17px;

    animation-duration: 11s;
    animation-delay: 4s;
}

@keyframes lionLeafFloat {

    0% {
        opacity: 0;
        transform:
            translateY(-15px) translateX(0) rotate(0deg);
    }

    15% {
        opacity: .75;
    }

    65% {
        opacity: .45;
    }

    100% {
        opacity: 0;

        transform:
            translateY(230px) translateX(75px) rotate(280deg);
    }

}


/* =========================================================
   08. HERO CONTAINER
========================================================= */

.lion-hero-container {
    width: min(92%, 1400px);
    min-height: 710px;

    margin: 0 auto;

    position: relative;

    z-index: 8;

    display: flex;
    align-items: center;
}


/* =========================================================
   09. CONTENT
========================================================= */

.lion-hero-content {
    width: min(700px, 62%);

    padding: 80px 0 105px;
}


/* =========================================================
   10. EYEBROW
========================================================= */

.lion-hero-eyebrow {
    margin-bottom: 21px;

    display: inline-flex;
    align-items: center;
    gap: 11px;

    color: var(--hero-gold-light);

    font-size: 14px;
    line-height: 1.3;
    font-weight: 800;

    letter-spacing: 1.6px;

    text-transform: uppercase;

    opacity: 0;

    transform: translateY(18px);
}

.lion-hero-eyebrow-icon {
    width: 38px;
    height: 38px;

    display: grid;
    place-items: center;

    border:
        1px solid rgba(241, 191, 63, .32);

    border-radius: 50%;

    background:
        rgba(241, 191, 63, .08);

    color: var(--hero-gold);

    font-size: 15px;

    backdrop-filter: blur(5px);

    box-shadow:
        inset 0 0 20px rgba(241, 191, 63, .05);
}


/* =========================================================
   11. HERO TITLE
========================================================= */

.lion-hero-title {
    max-width: 760px;

    margin: 0 0 22px;

    color: var(--hero-white);

    font-family: "Oswald", Arial, sans-serif;

    font-size: clamp(47px, 5.4vw, 82px);

    line-height: .99;

    font-weight: 700;

    letter-spacing: -1.5px;

    text-transform: uppercase;

    opacity: 0;

    transform: translateY(28px);
}

.lion-hero-title span {
    display: block;

    margin-top: 8px;

    color: var(--hero-gold);
}


/* =========================================================
   12. DESCRIPTION
========================================================= */

.lion-hero-description {
    max-width: 640px;

    margin: 0 0 31px;

    color: rgba(255, 255, 255, .82);

    font-size: 16px;
    line-height: 1.75;
    font-weight: 450;

    opacity: 0;

    transform: translateY(25px);
}


/* =========================================================
   13. FEATURES
========================================================= */

.lion-hero-features {
    margin-bottom: 34px;

    display: flex;
    flex-wrap: wrap;

    gap: 12px 25px;

    opacity: 0;

    transform: translateY(20px);
}

.lion-hero-feature {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    color: #fff;

    font-size: 14px;
    line-height: 1.4;
    font-weight: 650;
}

.lion-hero-feature i {
    width: 29px;
    height: 29px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    color: var(--hero-green);

    background: var(--hero-gold);

    font-size: 11px;

    box-shadow:
        0 4px 13px rgba(241, 191, 63, .18);
}


/* =========================================================
   14. BUTTONS
========================================================= */

.lion-hero-actions {
    display: flex;
    flex-wrap: wrap;

    gap: 13px;

    opacity: 0;

    transform: translateY(20px);
}

.lion-hero-btn {
    min-height: 57px;

    padding: 0 24px;

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

    gap: 11px;

    position: relative;

    overflow: hidden;

    border-radius: 6px;

    font-size: 14px;
    line-height: 1;
    font-weight: 800;

    letter-spacing: .15px;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background .3s ease,
        color .3s ease;
}

.lion-hero-btn-primary {
    color: var(--hero-green);

    background:
        linear-gradient(120deg,
            var(--hero-gold-light),
            var(--hero-gold));

    box-shadow:
        0 12px 30px rgba(217, 157, 30, .23);
}

.lion-hero-btn-primary::before {
    content: "";

    width: 45px;
    height: 140%;

    position: absolute;
    top: -20%;
    left: -70px;

    background:
        linear-gradient(90deg,
            transparent,
            rgba(255, 255, 255, .55),
            transparent);

    transform: rotate(20deg);

    transition: left .6s ease;
}

.lion-hero-btn-primary:hover::before {
    left: 120%;
}

.lion-hero-btn-primary:hover {
    transform: translateY(-3px);

    box-shadow:
        0 16px 35px rgba(217, 157, 30, .32);
}

.lion-hero-btn-secondary {
    color: #fff;

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

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

    backdrop-filter: blur(8px);
}

.lion-hero-btn-secondary:hover {
    color: var(--hero-green);

    background: #fff;

    transform: translateY(-3px);
}


/* =========================================================
   15. ACTIVE CONTENT ANIMATION
========================================================= */

.lion-hero-slide.is-active .lion-hero-eyebrow {
    animation:
        lionHeroReveal .7s ease .24s forwards;
}

.lion-hero-slide.is-active .lion-hero-title {
    animation:
        lionHeroReveal .85s ease .36s forwards;
}

.lion-hero-slide.is-active .lion-hero-description {
    animation:
        lionHeroReveal .75s ease .53s forwards;
}

.lion-hero-slide.is-active .lion-hero-features {
    animation:
        lionHeroReveal .75s ease .67s forwards;
}

.lion-hero-slide.is-active .lion-hero-actions {
    animation:
        lionHeroReveal .75s ease .8s forwards;
}

@keyframes lionHeroReveal {

    from {
        opacity: 0;

        transform:
            translateY(28px);
    }

    to {
        opacity: 1;

        transform:
            translateY(0);
    }

}


/* =========================================================
   16. SIDE SERVICE BADGE
========================================================= */

.lion-emergency-card {
    width: 255px;

    position: absolute;

    right: 4.2%;
    bottom: 86px;

    z-index: 12;

    padding: 20px 20px 19px;

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

    border-radius: 10px;

    background:
        linear-gradient(130deg,
            rgba(5, 31, 22, .92),
            rgba(9, 49, 34, .81));

    box-shadow:
        0 20px 50px rgba(0, 0, 0, .29);

    backdrop-filter: blur(10px);

    animation:
        lionEmergencyFloat 4s ease-in-out infinite;
}

@keyframes lionEmergencyFloat {

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

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

}

.lion-emergency-card-top {
    display: flex;
    align-items: center;
    gap: 12px;

    margin-bottom: 13px;
}

.lion-emergency-card-icon {
    width: 45px;
    height: 45px;

    flex: 0 0 45px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    color: var(--hero-green);

    background:
        linear-gradient(135deg,
            var(--hero-gold-light),
            var(--hero-gold));

    font-size: 17px;

    box-shadow:
        0 8px 18px rgba(241, 191, 63, .22);
}

.lion-emergency-card small {
    display: block;

    color: var(--hero-gold-light);

    font-size: 12px;
    font-weight: 800;

    text-transform: uppercase;
    letter-spacing: 1px;
}

.lion-emergency-card strong {
    display: block;

    margin-top: 2px;

    color: #fff;

    font-family: "Oswald", sans-serif;

    font-size: 21px;
    line-height: 1.15;

    text-transform: uppercase;
}

.lion-emergency-card p {
    margin: 0 0 13px;

    color: rgba(255, 255, 255, .66);

    font-size: 14px;
    line-height: 1.5;
}

.lion-emergency-card a {
    display: inline-flex;
    align-items: center;

    gap: 8px;

    color: var(--hero-gold-light);

    font-size: 14px;
    font-weight: 800;
}


/* =========================================================
   17. SLIDER CONTROLS
========================================================= */

.lion-hero-controls {
    position: absolute;

    left: 4%;
    bottom: 30px;

    z-index: 15;

    display: flex;
    align-items: center;

    gap: 10px;
}

.lion-hero-arrow {
    width: 49px;
    height: 49px;

    padding: 0;

    display: grid;
    place-items: center;

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

    border-radius: 50%;

    background:
        rgba(5, 25, 18, .42);

    color: #fff;

    font-size: 14px;

    backdrop-filter: blur(8px);

    cursor: pointer;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease,
        border-color .3s ease;
}

.lion-hero-arrow:hover {
    color: var(--hero-green);

    background: var(--hero-gold);

    border-color: var(--hero-gold);

    transform: scale(1.06);
}


/* =========================================================
   18. SLIDE COUNTER
========================================================= */

.lion-hero-counter {
    min-width: 80px;

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

    gap: 4px;

    color: #fff;
}

.lion-current-slide {
    color: var(--hero-gold);

    font-family: "Oswald", sans-serif;

    font-size: 29px;
    line-height: 1;
}

.lion-counter-separator {
    color: rgba(255, 255, 255, .32);

    font-size: 15px;
}

.lion-total-slides {
    color: rgba(255, 255, 255, .55);

    font-size: 14px;
}


/* =========================================================
   19. DOT NAVIGATION
========================================================= */

.lion-hero-dots {
    position: absolute;

    right: 38px;
    top: 50%;

    z-index: 16;

    transform: translateY(-50%);

    display: flex;
    flex-direction: column;

    gap: 12px;
}

.lion-hero-dot {
    width: 11px;
    height: 11px;

    padding: 0;

    border:
        2px solid rgba(255, 255, 255, .52);

    border-radius: 50%;

    background: transparent;

    cursor: pointer;

    position: relative;

    transition:
        background .3s ease,
        border .3s ease,
        transform .3s ease;
}

.lion-hero-dot::before {
    content: "";

    position: absolute;
    inset: -6px;

    border:
        1px solid transparent;

    border-radius: 50%;

    transition: border .3s ease;
}

.lion-hero-dot.is-active {
    background: var(--hero-gold);

    border-color: var(--hero-gold);

    transform: scale(1.12);
}

.lion-hero-dot.is-active::before {
    border-color:
        rgba(241, 191, 63, .35);
}


/* =========================================================
   20. BOTTOM PROGRESS BAR
========================================================= */

.lion-hero-progress {
    width: 100%;
    height: 4px;

    position: absolute;

    left: 0;
    bottom: 0;

    z-index: 18;

    background:
        rgba(255, 255, 255, .08);
}

.lion-hero-progress-bar {
    width: 0%;
    height: 100%;

    background:
        linear-gradient(90deg,
            var(--hero-gold-2),
            var(--hero-gold-light));

    box-shadow:
        0 0 13px rgba(241, 191, 63, .55);
}


/* =========================================================
   21. SMALL SERVICE LABEL
========================================================= */

.lion-hero-side-label {
    position: absolute;

    left: 22px;
    top: 50%;

    z-index: 15;

    transform:
        translateY(-50%) rotate(-90deg);

    transform-origin: center;

    color: rgba(255, 255, 255, .45);

    font-size: 11px;
    font-weight: 750;

    letter-spacing: 3px;

    text-transform: uppercase;

    white-space: nowrap;
}

.lion-hero-side-label span {
    color: var(--hero-gold);
}


/* =========================================================
   22. LAPTOP
========================================================= */

@media (max-width: 1250px) {

    .lion-hero,
    .lion-hero-slider,
    .lion-hero-slide,
    .lion-hero-container {
        min-height: 660px;
    }

    .lion-hero-content {
        width: min(650px, 68%);
    }

    .lion-hero-title {
        font-size: clamp(48px, 5vw, 68px);
    }

    .lion-emergency-card {
        width: 225px;

        right: 4%;
        bottom: 76px;
    }

}


/* =========================================================
   23. TABLET
========================================================= */

@media (max-width: 991px) {

    .lion-hero,
    .lion-hero-slider,
    .lion-hero-slide,
    .lion-hero-container {
        min-height: 650px;
    }

    .lion-hero-slide::before {
        background:
            linear-gradient(90deg,
                rgba(3, 17, 12, .94) 0%,
                rgba(3, 20, 14, .79) 50%,
                rgba(3, 20, 14, .35) 100%);
    }

    .lion-hero-content {
        width: 72%;

        padding-top: 70px;
    }

    .lion-emergency-card {
        width: 215px;

        right: 27px;
        bottom: 85px;
    }

    .lion-hero-side-label {
        display: none;
    }

}


/* =========================================================
   24. MOBILE
========================================================= */

@media (max-width: 767px) {

    .lion-hero,
    .lion-hero-slider,
    .lion-hero-slide,
    .lion-hero-container {
        min-height: 725px;
    }

    .lion-slide-bg {
        background-position: center center;
    }

    .lion-hero-slide::before {
        background:
            linear-gradient(180deg,
                rgba(2, 18, 12, .45) 0%,
                rgba(2, 18, 12, .68) 27%,
                rgba(2, 18, 12, .94) 67%,
                rgba(2, 18, 12, .99) 100%);
    }

    .lion-hero-slide::after {
        background:
            linear-gradient(180deg,
                rgba(0, 0, 0, .05),
                rgba(0, 0, 0, .37));
    }

    .lion-hero-container {
        width: calc(100% - 28px);

        align-items: flex-end;
    }

    .lion-hero-content {
        width: 100%;
        padding: 43px 0 85px;
    }

    .lion-hero-eyebrow {
        margin-bottom: 15px;

        font-size: 14px;

        letter-spacing: 1px;
    }

    .lion-hero-eyebrow-icon {
        width: 34px;
        height: 34px;
    }

    .lion-hero-title {
        margin-bottom: 17px;

        max-width: 100%;

        font-size: clamp(39px, 12vw, 57px);

        line-height: 1.01;

        letter-spacing: -.7px;
    }

    .lion-hero-description {
        margin-bottom: 20px;

        max-width: 100%;

        font-size: 14px;
        line-height: 1.65;
    }

    .lion-hero-features {
        gap: 10px;

        margin-bottom: 24px;
    }

    .lion-hero-feature {
        width: calc(50% - 5px);

        font-size: 14px;
    }

    .lion-hero-actions {
        gap: 9px;
    }

    .lion-hero-btn {
        min-height: 53px;

        padding: 0 16px;

        font-size: 14px;
    }

    .lion-emergency-card {
        display: none;
    }

    .lion-hero-dots {
        right: 15px;
        top: 140px;

        transform: none;
    }

    .lion-hero-controls {
        left: 14px;
        bottom: 27px;
    }

    .lion-hero-arrow {
        width: 43px;
        height: 43px;
    }

    .lion-tree-rings {
        width: 270px;
        height: 270px;

        right: -140px;
        bottom: -110px;
    }

}


/* =========================================================
   25. SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .lion-hero,
    .lion-hero-slider,
    .lion-hero-slide,
    .lion-hero-container {
        min-height: 770px;
    }

    .lion-hero-content {
        padding-bottom: 96px;
    }

    .lion-hero-features {
        display: grid;

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

    .lion-hero-feature {
        width: 100%;
    }

    .lion-hero-actions {
        display: grid;

        grid-template-columns: 1fr;
    }

    .lion-hero-btn {
        width: 100%;
    }

    .lion-hero-dots {
        top: 105px;
    }

}


/* =========================================================
   26. REDUCED MOTION
========================================================= */

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

    .lion-slide-bg,
    .lion-floating-leaf,
    .lion-tree-rings,
    .lion-emergency-card {
        animation: none !important;

        transition: none !important;
    }

}



/* =========================================================
   01. VARIABLES
========================================================= */

.lion-about {
    --about-green-dark: #071d16;
    --about-green: #0c3325;
    --about-green-2: #164b35;

    --about-gold: #f1bf3f;
    --about-gold-dark: #d49a1e;
    --about-gold-light: #ffda70;

    --about-white: #ffffff;
    --about-bg: #f6f7f2;
    --about-text: #425048;
    --about-border: #e4e9e5;

    width: 100%;
    position: relative;
    overflow: hidden;

    padding: 110px 0;

    background:
        radial-gradient(circle at 8% 20%,
            rgba(241, 191, 63, .09),
            transparent 24%),
        radial-gradient(circle at 96% 80%,
            rgba(12, 51, 37, .07),
            transparent 25%),
        #f7f8f4;

    font-family: "DM Sans", Arial, sans-serif;
}


/* =========================================================
   02. IMPORTANTE - RESET DE ICONOS
   Evita interferencias del tema de WordPress
========================================================= */

.lion-about i,
.lion-about .fa,
.lion-about .fas,
.lion-about .far,
.lion-about .fab,
.lion-about .fa-solid,
.lion-about .fa-regular {

    position: static !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    width: auto !important;
    height: auto !important;

    line-height: 1 !important;

    text-indent: 0 !important;

    transform: none;

    display: block;

    flex: none;

    vertical-align: middle;

    box-sizing: border-box;
}


/* =========================================================
   03. DECORATIVE BACKGROUND
========================================================= */

.lion-about::before {
    content: "";

    width: 430px;
    height: 430px;

    position: absolute;
    left: -245px;
    top: 90px;

    border-radius: 50%;

    border: 1px solid rgba(12, 51, 37, .08);

    box-shadow:
        0 0 0 45px rgba(12, 51, 37, .025),
        0 0 0 90px rgba(241, 191, 63, .02);

    pointer-events: none;
}


/* =========================================================
   04. CONTAINER
========================================================= */

.lion-about-container {
    width: min(92%, 1400px);

    margin: 0 auto;

    position: relative;
    z-index: 2;

    display: grid;

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

    align-items: center;

    gap: clamp(55px, 7vw, 100px);
}


/* =========================================================
   05. IMAGE COMPOSITION
========================================================= */

.lion-about-visual {
    width: 100%;
    min-height: 610px;

    position: relative;
}


/* MAIN IMAGE */

.lion-about-main-image {
    width: 82%;
    height: 520px;

    position: absolute;

    top: 0;
    left: 0;

    overflow: hidden;

    border-radius:
        18px 18px 90px 18px;

    box-shadow:
        0 30px 65px rgba(4, 33, 23, .18);
}

.lion-about-main-image::before {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 2;

    background:
        linear-gradient(180deg,
            transparent 52%,
            rgba(4, 29, 20, .42));

    pointer-events: none;
}

.lion-about-main-image img {
    width: 100%;
    height: 100%;

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

    display: block;

    transition:
        transform .8s ease;
}

.lion-about-main-image:hover img {
    transform: scale(1.045);
}


/* =========================================================
   06. SECOND IMAGE
========================================================= */

.lion-about-small-image {
    width: 44%;
    height: 265px;

    position: absolute;

    right: 0;
    bottom: 0;

    z-index: 5;

    padding: 7px;

    overflow: hidden;

    background: var(--about-bg);

    border-radius: 15px;

    box-shadow:
        0 24px 55px rgba(3, 24, 17, .19);
}

.lion-about-small-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    border-radius: 10px;
}


/* =========================================================
   07. GOLD DETAIL
========================================================= */

.lion-about-gold-line {
    width: 150px;
    height: 7px;

    position: absolute;

    left: 23%;
    bottom: 38px;

    z-index: 4;

    background:
        linear-gradient(90deg,
            var(--about-gold),
            var(--about-gold-light));

    border-radius: 30px;

    box-shadow:
        0 5px 15px rgba(241, 191, 63, .3);
}


/* =========================================================
   08. 24/7 BADGE
========================================================= */

.lion-about-badge {
    width: 175px;
    height: 175px;

    position: absolute;

    top: 44px;
    right: 1%;

    z-index: 6;

    overflow: hidden;

    border-radius: 50%;

    display: flex;
    flex-direction: column;

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

    text-align: center;

    color: #fff;

    background:
        linear-gradient(145deg,
            #0e3f2d,
            #061b14);

    border: 5px solid #f7f8f4;

    box-shadow:
        0 18px 45px rgba(4, 29, 20, .25);

    animation:
        lionAboutBadgeFloat 4s ease-in-out infinite;
}


/* INNER RING */

.lion-about-badge::before {
    content: "";

    position: absolute;

    top: 8px;
    right: 8px;
    bottom: 8px;
    left: 8px;

    border:
        1px dashed rgba(241, 191, 63, .45);

    border-radius: 50%;

    pointer-events: none;

    animation:
        lionAboutRing 18s linear infinite;
}


/* TREE ICON */

.lion-about-badge>i {
    width: 38px !important;
    height: 38px !important;

    margin: 0 0 5px 0 !important;

    position: relative !important;
    z-index: 2;

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

    color: var(--about-gold);

    font-size: 24px;

    line-height: 1 !important;

    text-align: center;
}


/* TEXT */

.lion-about-badge strong {
    position: relative;
    z-index: 2;

    display: block;

    color: var(--about-gold-light);

    font-family: "Oswald", sans-serif;

    font-size: 30px;
    line-height: 1;
}

.lion-about-badge span {
    max-width: 115px;

    position: relative;
    z-index: 2;

    display: block;

    margin-top: 7px;

    color: rgba(255, 255, 255, .83);

    font-size: 12px;
    line-height: 1.25;
    font-weight: 700;

    text-align: center;

    text-transform: uppercase;

    letter-spacing: .7px;
}


@keyframes lionAboutBadgeFloat {

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

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


@keyframes lionAboutRing {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


/* =========================================================
   09. SERVICE AREA CARD
========================================================= */

.lion-about-area-card {
    min-width: 220px;

    position: absolute;

    left: 24px;
    bottom: 8px;

    z-index: 7;

    padding: 16px 18px;

    display: flex;

    align-items: center;

    gap: 12px;

    overflow: hidden;

    background: #fff;

    border-left:
        4px solid var(--about-gold);

    border-radius: 8px;

    box-shadow:
        0 17px 40px rgba(0, 0, 0, .13);
}


/* ICON CIRCLE */

.lion-about-area-icon {
    width: 44px;
    height: 44px;

    min-width: 44px;
    min-height: 44px;

    max-width: 44px;
    max-height: 44px;

    flex: 0 0 44px;

    position: relative;

    overflow: hidden;

    display: flex !important;

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

    border-radius: 50%;

    color: var(--about-green);

    background:
        rgba(241, 191, 63, .18);
}


/* ICON */

.lion-about-area-icon i {
    width: 20px !important;
    height: 20px !important;

    display: flex !important;

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

    margin: 0 !important;

    padding: 0 !important;

    position: static !important;

    color: var(--about-green);

    font-size: 16px;

    line-height: 20px !important;

    text-align: center !important;
}


/* CARD TEXT */

.lion-about-area-card>div {
    min-width: 0;
}

.lion-about-area-card small {
    display: block;

    color: #8a948e;

    font-size: 11px;
    line-height: 1.2;
    font-weight: 800;

    text-transform: uppercase;

    letter-spacing: .7px;
}

.lion-about-area-card strong {
    display: block;

    margin-top: 3px;

    color: var(--about-green-dark);

    font-size: 14px;
    line-height: 1.3;
}


/* =========================================================
   10. RIGHT CONTENT
========================================================= */

.lion-about-content {
    width: 100%;

    position: relative;
}


/* =========================================================
   11. EYEBROW
========================================================= */

.lion-about-eyebrow {
    margin-bottom: 15px;

    display: inline-flex;

    align-items: center;

    gap: 10px;

    color: var(--about-green-2);

    font-size: 14px;
    line-height: 1.4;
    font-weight: 800;

    text-transform: uppercase;

    letter-spacing: 1.5px;
}

.lion-about-eyebrow::before {
    content: "";

    width: 37px;
    height: 3px;

    flex: 0 0 37px;

    background: var(--about-gold);

    border-radius: 20px;
}

.lion-about-eyebrow i {
    width: 18px !important;
    height: 18px !important;

    display: flex !important;

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

    color: var(--about-gold-dark);

    font-size: 14px;

    line-height: 1 !important;
}


/* =========================================================
   12. HEADING
========================================================= */

.lion-about-title {
    max-width: 650px;

    margin: 0 0 23px;

    color: var(--about-green-dark);

    font-family:
        "Oswald",
        Arial,
        sans-serif;

    font-size:
        clamp(40px, 4.2vw, 64px);

    line-height: 1.03;

    font-weight: 700;

    letter-spacing: -1px;

    text-transform: uppercase;
}

.lion-about-title span {
    color: var(--about-gold-dark);
}


/* =========================================================
   13. DESCRIPTION
========================================================= */

.lion-about-description {
    margin: 0 0 17px;

    color: var(--about-text);

    font-size: 15px;
    line-height: 1.85;

    text-align: justify;
}

.lion-about-description strong {
    color: var(--about-green-dark);
}


/* =========================================================
   14. FEATURE GRID
========================================================= */

.lion-about-features {
    width: 100%;

    margin-top: 27px;
    margin-bottom: 30px;

    display: grid;

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

    gap: 13px;
}


/* FEATURE */

.lion-about-feature {
    width: 100%;

    min-height: 80px;

    padding: 14px;

    display: flex;

    align-items: center;

    gap: 13px;

    position: relative;

    overflow: hidden;

    background: #fff;

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

    border-radius: 8px;

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


.lion-about-feature::before {
    content: "";

    width: 3px;
    height: 0;

    position: absolute;

    left: 0;
    top: 50%;

    transform:
        translateY(-50%);

    background:
        var(--about-gold);

    transition:
        height .3s ease;
}


.lion-about-feature:hover {
    transform:
        translateY(-4px);

    border-color:
        rgba(241, 191, 63, .6);

    box-shadow:
        0 13px 30px rgba(6, 43, 30, .09);
}

.lion-about-feature:hover::before {
    height: 70%;
}


/* =========================================================
   15. FEATURE ICON
   CORRECCIÓN PRINCIPAL
========================================================= */

.lion-about-feature-icon {
    width: 48px;
    height: 48px;

    min-width: 48px;
    min-height: 48px;

    max-width: 48px;
    max-height: 48px;

    flex: 0 0 48px;

    position: relative;

    overflow: hidden;

    display: flex !important;

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

    border-radius: 50%;

    color: var(--about-green-dark);

    background:
        linear-gradient(145deg,
            var(--about-gold-light),
            var(--about-gold));

    box-shadow:
        0 5px 14px rgba(217, 154, 30, .18);
}


/* INNER ICON */

.lion-about-feature-icon i {
    width: 22px !important;
    height: 22px !important;

    min-width: 22px !important;
    min-height: 22px !important;

    margin: 0 !important;
    padding: 0 !important;

    position: static !important;

    display: flex !important;

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

    color: var(--about-green-dark);

    font-size: 17px;

    line-height: 22px !important;

    text-align: center !important;

    transform: none !important;
}


/* FEATURE TEXT */

.lion-about-feature>div {
    min-width: 0;
}

.lion-about-feature strong {
    display: block;

    margin: 0 0 3px;

    color: var(--about-green-dark);

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

    font-weight: 800;
}

.lion-about-feature span:not(.lion-about-feature-icon) {
    display: block;

    color: #78837c;

    font-size: 14px;
    line-height: 1.35;
}


/* =========================================================
   16. BOTTOM / CTA
========================================================= */

.lion-about-bottom {
    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 20px;
}


/* BUTTON */

.lion-about-btn {
    min-height: 56px;

    padding: 0 24px;

    display: inline-flex;

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

    gap: 10px;

    position: relative;

    overflow: hidden;

    border-radius: 6px;

    color: #fff;

    background:
        linear-gradient(110deg,
            var(--about-green-dark),
            var(--about-green-2));

    font-size: 14px;
    font-weight: 800;

    box-shadow:
        0 11px 28px rgba(7, 29, 22, .18);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}


/* BUTTON ICON */

.lion-about-btn i {
    width: 18px !important;
    height: 18px !important;

    display: flex !important;

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

    color: var(--about-gold);

    font-size: 13px;

    line-height: 18px !important;
}


.lion-about-btn::after {
    content: "";

    width: 50px;
    height: 140%;

    position: absolute;

    top: -20%;
    left: -70px;

    transform: rotate(20deg);

    background:
        linear-gradient(90deg,
            transparent,
            rgba(255, 255, 255, .23),
            transparent);

    transition:
        left .55s ease;
}


.lion-about-btn:hover {
    transform:
        translateY(-3px);

    box-shadow:
        0 15px 34px rgba(7, 29, 22, .25);
}

.lion-about-btn:hover::after {
    left: 125%;
}


/* =========================================================
   17. PHONE CTA
========================================================= */

.lion-about-phone {
    display: flex;

    align-items: center;

    gap: 11px;
}


/* PHONE CIRCLE */

.lion-about-phone-icon {
    width: 48px;
    height: 48px;

    min-width: 48px;
    min-height: 48px;

    max-width: 48px;
    max-height: 48px;

    flex: 0 0 48px;

    position: relative;

    overflow: hidden;

    display: flex !important;

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

    border-radius: 50%;

    color: var(--about-green-dark);

    background:
        rgba(241, 191, 63, .18);

    border:
        1px solid rgba(241, 191, 63, .42);
}


/* PHONE ICON */

.lion-about-phone-icon i {
    width: 21px !important;
    height: 21px !important;

    display: flex !important;

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

    position: static !important;

    margin: 0 !important;
    padding: 0 !important;

    color: var(--about-green-dark);

    font-size: 16px;

    line-height: 21px !important;

    text-align: center !important;

    transform: none !important;
}


.lion-about-phone small {
    display: block;

    color: #828e87;

    font-size: 12px;
    font-weight: 750;

    text-transform: uppercase;

    letter-spacing: .5px;
}

.lion-about-phone strong {
    display: block;

    color: var(--about-green-dark);

    font-family:
        "Oswald",
        sans-serif;

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


/* =========================================================
   18. REVEAL
========================================================= */

.lion-about-reveal {
    opacity: 0;

    transform:
        translateY(35px);

    transition:
        opacity .8s ease,
        transform .8s ease;
}

.lion-about-reveal.lion-visible {
    opacity: 1;

    transform: translateY(0);
}


.lion-about-visual.lion-about-reveal {
    transform:
        translateX(-40px);
}

.lion-about-visual.lion-visible {
    transform:
        translateX(0);
}


.lion-about-content.lion-about-reveal {
    transform:
        translateX(40px);
}

.lion-about-content.lion-visible {
    transform:
        translateX(0);
}


/* =========================================================
   19. TABLET
========================================================= */

@media (max-width: 1050px) {

    .lion-about {
        padding: 90px 0;
    }

    .lion-about-container {
        gap: 45px;
    }

    .lion-about-visual {
        min-height: 540px;
    }

    .lion-about-main-image {
        width: 86%;
        height: 465px;
    }

    .lion-about-small-image {
        width: 46%;
        height: 225px;
    }

    .lion-about-badge {
        width: 145px;
        height: 145px;
    }

    .lion-about-badge strong {
        font-size: 25px;
    }

}


/* =========================================================
   20. MOBILE
========================================================= */

@media (max-width: 767px) {

    .lion-about {
        padding: 65px 0;
    }

    .lion-about-container {
        width: calc(100% - 28px);

        grid-template-columns: 1fr;

        gap: 45px;
    }


    /* IMAGES */

    .lion-about-visual {
        min-height: 490px;
    }

    .lion-about-main-image {
        width: 88%;
        height: 400px;

        border-radius:
            14px 14px 55px 14px;
    }

    .lion-about-small-image {
        width: 47%;
        height: 195px;

        right: 0;
        bottom: 6px;
    }


    /* BADGE */

    .lion-about-badge {
        width: 125px;
        height: 125px;

        top: 30px;
        right: 0;

        border-width: 4px;
    }

    .lion-about-badge>i {
        width: 30px !important;
        height: 30px !important;

        font-size: 19px;
    }

    .lion-about-badge strong {
        font-size: 22px;
    }

    .lion-about-badge span {
        max-width: 90px;

        font-size: 10px;
    }


    /* AREA CARD */

    .lion-about-area-card {
        min-width: 190px;

        left: 8px;
        bottom: 0;

        padding: 12px;
    }


    .lion-about-area-icon {
        width: 40px;
        height: 40px;

        min-width: 40px;
        min-height: 40px;

        max-width: 40px;
        max-height: 40px;

        flex-basis: 40px;
    }

    .lion-about-area-icon i {
        width: 18px !important;
        height: 18px !important;

        font-size: 14px;

        line-height: 18px !important;
    }


    .lion-about-gold-line {
        display: none;
    }


    /* CONTENT */

    .lion-about-title {
        margin-bottom: 18px;

        font-size:
            clamp(38px, 11vw, 52px);
    }

    .lion-about-description {
        font-size: 14px;
        line-height: 1.75;
    }


    /* FEATURES */

    .lion-about-features {
        grid-template-columns: 1fr;

        gap: 10px;
    }

    .lion-about-feature {
        min-height: 76px;

        padding: 13px;
    }

    .lion-about-feature-icon {
        width: 46px;
        height: 46px;

        min-width: 46px;
        min-height: 46px;

        max-width: 46px;
        max-height: 46px;

        flex-basis: 46px;
    }

    .lion-about-feature-icon i {
        width: 20px !important;
        height: 20px !important;

        font-size: 16px;

        line-height: 20px !important;
    }

    .lion-about-feature strong,
    .lion-about-feature span:not(.lion-about-feature-icon) {
        font-size: 14px;
    }


    /* CTA */

    .lion-about-bottom {
        align-items: stretch;

        flex-direction: column;
    }

    .lion-about-btn {
        width: 100%;
    }

}


/* =========================================================
   21. SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

    .lion-about-container {
        width:
            calc(100% - 20px);
    }

    .lion-about-visual {
        min-height: 445px;
    }

    .lion-about-main-image {
        width: 91%;
        height: 365px;
    }

    .lion-about-small-image {
        width: 50%;
        height: 165px;
    }

    .lion-about-badge {
        width: 108px;
        height: 108px;

        right: 0;
    }

    .lion-about-badge>i {
        width: 25px !important;
        height: 25px !important;

        font-size: 17px;
    }

    .lion-about-badge strong {
        font-size: 19px;
    }

    .lion-about-badge span {
        max-width: 78px;

        font-size: 9px;
    }

    .lion-about-area-card {
        max-width: 190px;
        min-width: 0;
    }

}


/* =========================================================
   22. REDUCED MOTION
========================================================= */

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

    .lion-about-reveal,
    .lion-about-badge,
    .lion-about-badge::before {

        animation: none !important;

        transition: none !important;

    }

    .lion-about-reveal {

        opacity: 1;

        transform:
            none !important;

    }

}



/* =========================================================
   01. SERVICES VARIABLES
========================================================= */

.lion-services {
    --ls-green-dark: #061a13;
    --ls-green: #0b3123;
    --ls-green-mid: #155039;
    --ls-green-light: #286b49;

    --ls-gold: #f2bf3f;
    --ls-gold-dark: #d69a1e;
    --ls-gold-light: #ffdb74;

    --ls-white: #ffffff;
    --ls-soft: #f4f6f1;

    width: 100%;

    position: relative;

    overflow: hidden;

    padding: 110px 0 120px;

    color: #ffffff;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;

    background:
        linear-gradient(110deg,
            rgba(3, 20, 14, .98) 0%,
            rgba(6, 37, 26, .95) 42%,
            rgba(8, 48, 33, .90) 100%),
        url("https://images.unsplash.com/photo-1511497584788-876760111969?auto=format&fit=crop&w=2000&q=85"
        );

    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}


/* =========================================================
   02. DARK OVERLAY
========================================================= */

.lion-services::before {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 0;

    background:
        radial-gradient(circle at 12% 20%,
            rgba(242, 191, 63, .10),
            transparent 26%),

        radial-gradient(circle at 88% 75%,
            rgba(255, 219, 116, .07),
            transparent 22%),

        linear-gradient(180deg,
            rgba(0, 0, 0, .12),
            rgba(0, 0, 0, .35));

    pointer-events: none;
}


/* =========================================================
   03. TREE RINGS DECORATION
========================================================= */

.lion-services-rings {
    width: 480px;
    height: 480px;

    position: absolute;

    right: -250px;
    top: -190px;

    z-index: 1;

    border-radius: 50%;

    border:
        1px solid rgba(242, 191, 63, .10);

    box-shadow:
        0 0 0 45px rgba(242, 191, 63, .025),
        0 0 0 90px rgba(255, 255, 255, .018),
        0 0 0 135px rgba(242, 191, 63, .014);

    animation:
        lionServicesRotate 28s linear infinite;

    pointer-events: none;
}

.lion-services-rings::before,
.lion-services-rings::after {
    content: "";

    position: absolute;

    border-radius: 50%;

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

.lion-services-rings::before {
    inset: 45px;
}

.lion-services-rings::after {
    inset: 105px;
}

@keyframes lionServicesRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


/* =========================================================
   04. FLOATING LEAF DETAILS
========================================================= */

.lion-services-leaf {
    position: absolute;

    z-index: 1;

    color:
        rgba(242, 191, 63, .09);

    pointer-events: none;
}

.lion-services-leaf-1 {
    left: 3%;
    top: 18%;

    font-size: 70px;

    transform: rotate(-28deg);

    animation:
        lionServicesLeafFloat 7s ease-in-out infinite;
}

.lion-services-leaf-2 {
    right: 5%;
    bottom: 14%;

    font-size: 92px;

    transform: rotate(35deg);

    animation:
        lionServicesLeafFloat 9s ease-in-out infinite reverse;
}

@keyframes lionServicesLeafFloat {

    0%,
    100% {
        margin-top: 0;
    }

    50% {
        margin-top: -16px;
    }

}


/* =========================================================
   05. MAIN CONTAINER
========================================================= */

.lion-services-container {
    width: min(92%, 1420px);

    margin: 0 auto;

    position: relative;

    z-index: 4;
}


/* =========================================================
   06. HEADING AREA
========================================================= */

.lion-services-heading {
    width: 100%;

    margin-bottom: 50px;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr) minmax(300px, .65fr);

    align-items: end;

    gap: 45px;
}


/* =========================================================
   07. EYEBROW
========================================================= */

.lion-services-eyebrow {
    margin-bottom: 15px;

    display: inline-flex;

    align-items: center;

    gap: 10px;

    color: var(--ls-gold-light);

    font-size: 14px;
    line-height: 1.3;
    font-weight: 800;

    text-transform: uppercase;

    letter-spacing: 1.8px;
}

.lion-services-eyebrow-line {
    width: 38px;
    height: 3px;

    flex: 0 0 38px;

    border-radius: 20px;

    background: var(--ls-gold);
}

.lion-services-eyebrow-icon {
    width: 28px;
    height: 28px;

    flex: 0 0 28px;

    display: flex !important;

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

    border-radius: 50%;

    color: var(--ls-green-dark);

    background: var(--ls-gold);

    font-size: 12px;
}

.lion-services-eyebrow-icon i {
    margin: 0 !important;
    padding: 0 !important;

    line-height: 1 !important;

    position: static !important;
}


/* =========================================================
   08. TITLE
========================================================= */

.lion-services-title {
    max-width: 760px;

    margin: 0;

    color: #ffffff;

    font-family:
        "Oswald",
        Arial,
        sans-serif;

    font-size:
        clamp(42px, 4.8vw, 70px);

    line-height: 1.02;

    font-weight: 700;

    letter-spacing: -1px;

    text-transform: uppercase;
}

.lion-services-title span {
    color: var(--ls-gold);
}


/* =========================================================
   09. INTRO
========================================================= */

.lion-services-intro {
    padding-left: 25px;

    border-left:
        2px solid rgba(242, 191, 63, .50);
}

.lion-services-intro p {
    margin: 0;

    color:
        rgba(255, 255, 255, .72);

    font-size: 15px;
    line-height: 1.8;

    text-align: justify;
}


/* =========================================================
   10. SWIPER
========================================================= */

.lion-services-swiper {
    width: 100%;

    overflow: visible !important;

    padding:
        5px 4px 34px !important;
}

.lion-services .swiper-wrapper {
    align-items: stretch;
}

.lion-services .swiper-slide {
    height: auto;

    display: flex;
}


/* =========================================================
   11. SERVICE CARD
========================================================= */

.lion-service-card {
    width: 100%;
    min-height: 495px;

    position: relative;

    display: flex;
    flex-direction: column;

    overflow: hidden;

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

    border-radius: 16px;

    background: #0a271d;

    box-shadow:
        0 25px 55px rgba(0, 0, 0, .24);

    isolation: isolate;

    transform:
        translateY(0);

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

.lion-service-card:hover {
    transform:
        translateY(-10px);

    border-color:
        rgba(242, 191, 63, .50);

    box-shadow:
        0 35px 70px rgba(0, 0, 0, .35);
}


/* =========================================================
   12. SERVICE IMAGE
========================================================= */

.lion-service-image {
    position: absolute;
    inset: 0;

    z-index: -4;

    background-size: cover;
    background-position: center;

    transform: scale(1.03);

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

.lion-service-card:hover .lion-service-image {
    transform:
        scale(1.12);
}


/* =========================================================
   13. CARD OVERLAY
========================================================= */

.lion-service-card::before {
    content: "";

    position: absolute;
    inset: 0;

    z-index: -3;

    background:
        linear-gradient(180deg,
            rgba(3, 20, 14, .08) 0%,
            rgba(4, 26, 18, .25) 30%,
            rgba(4, 26, 18, .75) 64%,
            rgba(3, 19, 13, .98) 100%);

    transition:
        background .45s ease;
}

.lion-service-card:hover::before {
    background:
        linear-gradient(180deg,
            rgba(3, 20, 14, .08) 0%,
            rgba(4, 26, 18, .24) 26%,
            rgba(4, 26, 18, .70) 58%,
            rgba(3, 19, 13, .99) 100%);
}


/* =========================================================
   14. GOLD LIGHT EFFECT
========================================================= */

.lion-service-card::after {
    content: "";

    width: 220px;
    height: 220px;

    position: absolute;

    right: -120px;
    bottom: -120px;

    z-index: -2;

    border-radius: 50%;

    background:
        radial-gradient(circle,
            rgba(242, 191, 63, .24),
            transparent 68%);

    opacity: .45;

    transition:
        transform .6s ease,
        opacity .6s ease;
}

.lion-service-card:hover::after {
    transform:
        scale(1.7);

    opacity: .85;
}


/* =========================================================
   15. TOP NUMBER
========================================================= */

.lion-service-number {
    position: absolute;

    top: 19px;
    right: 20px;

    z-index: 6;

    color:
        rgba(255, 255, 255, .72);

    font-family:
        "Oswald",
        Arial,
        sans-serif;

    font-size: 15px;

    font-weight: 600;

    letter-spacing: 1.5px;
}


/* =========================================================
   16. SERVICE ICON
========================================================= */

.lion-service-icon {
    width: 60px;
    height: 60px;

    min-width: 60px;
    min-height: 60px;

    position: absolute;

    top: 20px;
    left: 20px;

    z-index: 6;

    display: flex !important;

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

    overflow: hidden;

    border-radius: 50%;

    color: var(--ls-green-dark);

    background:
        linear-gradient(145deg,
            var(--ls-gold-light),
            var(--ls-gold));

    border:
        4px solid rgba(255, 255, 255, .13);

    box-shadow:
        0 10px 25px rgba(0, 0, 0, .19);

    transition:
        transform .4s ease,
        box-shadow .4s ease;
}

.lion-service-icon i {
    width: 25px !important;
    height: 25px !important;

    margin: 0 !important;
    padding: 0 !important;

    position: static !important;

    display: flex !important;

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

    color: var(--ls-green-dark);

    font-size: 20px;

    line-height: 25px !important;

    text-align: center !important;
}

.lion-service-card:hover .lion-service-icon {
    transform:
        rotate(-8deg) scale(1.08);

    box-shadow:
        0 14px 28px rgba(242, 191, 63, .28);
}


/* =========================================================
   17. CARD CONTENT
========================================================= */

.lion-service-content {
    width: 100%;

    margin-top: auto;

    padding:
        235px 25px 27px;

    position: relative;

    z-index: 3;
}


/* =========================================================
   18. SMALL LABEL
========================================================= */

.lion-service-label {
    margin-bottom: 9px;

    display: inline-flex;

    align-items: center;

    gap: 8px;

    color: var(--ls-gold-light);

    font-size: 12px;
    line-height: 1.3;
    font-weight: 800;

    letter-spacing: 1.2px;

    text-transform: uppercase;
}

.lion-service-label::before {
    content: "";

    width: 24px;
    height: 2px;

    background: var(--ls-gold);

    border-radius: 10px;
}


/* =========================================================
   19. CARD TITLE
========================================================= */

.lion-service-title {
    margin:
        0 0 11px;

    color: #ffffff;

    font-family:
        "Oswald",
        Arial,
        sans-serif;

    font-size: 29px;
    line-height: 1.12;

    font-weight: 650;

    text-transform: uppercase;
}


/* =========================================================
   20. DESCRIPTION
========================================================= */

.lion-service-description {
    min-height: 70px;

    margin:
        0 0 21px;

    color:
        rgba(255, 255, 255, .72);

    font-size: 14px;
    line-height: 1.65;

    text-align: left;
}


/* =========================================================
   21. SERVICE CTA
========================================================= */

.lion-service-link {
    width: 100%;

    min-height: 48px;

    padding:
        0 5px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    color: #ffffff;

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

    font-size: 14px;
    line-height: 1.2;

    font-weight: 800;

    transition:
        color .3s ease;
}

.lion-service-link-text {
    display: inline-flex;

    align-items: center;

    gap: 8px;
}

.lion-service-link-icon {
    width: 34px;
    height: 34px;

    min-width: 34px;

    display: flex !important;

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

    border-radius: 50%;

    color: var(--ls-green-dark);

    background:
        var(--ls-gold);

    transition:
        transform .35s ease,
        background .35s ease;
}

.lion-service-link-icon i {
    margin: 0 !important;
    padding: 0 !important;

    position: static !important;

    font-size: 12px;

    line-height: 1 !important;
}

.lion-service-card:hover .lion-service-link {
    color: var(--ls-gold-light);
}

.lion-service-card:hover .lion-service-link-icon {
    transform:
        rotate(-35deg);

    background:
        var(--ls-gold-light);
}


/* =========================================================
   22. BOTTOM CONTROL AREA
========================================================= */

.lion-services-controls {
    margin-top: 12px;

    display: grid;

    grid-template-columns:
        auto minmax(100px, 1fr) auto;

    align-items: center;

    gap: 20px;
}


/* =========================================================
   23. NAVIGATION BUTTONS
========================================================= */

.lion-services-arrows {
    display: flex;

    align-items: center;

    gap: 9px;
}

.lion-services-prev,
.lion-services-next {
    width: 52px;
    height: 52px;

    padding: 0;

    display: flex !important;

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

    position: relative;

    overflow: hidden;

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

    border-radius: 50%;

    color: #ffffff;

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

    backdrop-filter:
        blur(8px);

    cursor: pointer;

    transition:
        background .3s ease,
        color .3s ease,
        transform .3s ease,
        border-color .3s ease;
}

.lion-services-prev i,
.lion-services-next i {
    margin: 0 !important;
    padding: 0 !important;

    position: static !important;

    font-size: 14px;

    line-height: 1 !important;
}

.lion-services-prev:hover,
.lion-services-next:hover {
    color: var(--ls-green-dark);

    background: var(--ls-gold);

    border-color: var(--ls-gold);

    transform:
        scale(1.06);
}


/* =========================================================
   24. PROGRESS
========================================================= */

.lion-services-progress {
    width: 100%;
    height: 3px;

    position: relative;

    overflow: hidden;

    border-radius: 20px;

    background:
        rgba(255, 255, 255, .12);
}

.lion-services-progress-fill {
    width: 0%;
    height: 100%;

    position: absolute;

    left: 0;
    top: 0;

    border-radius: 20px;

    background:
        linear-gradient(90deg,
            var(--ls-gold-dark),
            var(--ls-gold-light));

    box-shadow:
        0 0 15px rgba(242, 191, 63, .5);

    transition:
        width .5s ease;
}


/* =========================================================
   25. COUNTER
========================================================= */

.lion-services-counter {
    min-width: 95px;

    display: flex;

    align-items: baseline;
    justify-content: flex-end;

    gap: 5px;

    font-family:
        "Oswald",
        Arial,
        sans-serif;
}

.lion-services-current {
    color: var(--ls-gold);

    font-size: 29px;
    line-height: 1;
}

.lion-services-counter-line {
    color:
        rgba(255, 255, 255, .30);

    font-size: 16px;
}

.lion-services-total {
    color:
        rgba(255, 255, 255, .55);

    font-size: 15px;
}


/* =========================================================
   26. VIEW ALL BUTTON
========================================================= */

.lion-services-bottom {
    margin-top: 45px;

    display: flex;

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

.lion-services-all-btn {
    min-height: 56px;

    padding:
        0 25px;

    display: inline-flex;

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

    gap: 11px;

    position: relative;

    overflow: hidden;

    border-radius: 6px;

    color: var(--ls-green-dark);

    background:
        linear-gradient(120deg,
            var(--ls-gold-light),
            var(--ls-gold));

    font-size: 14px;
    line-height: 1;

    font-weight: 800;

    box-shadow:
        0 14px 35px rgba(0, 0, 0, .20);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.lion-services-all-btn i {
    margin: 0 !important;
    padding: 0 !important;

    position: static !important;

    line-height: 1 !important;
}

.lion-services-all-btn:hover {
    transform:
        translateY(-3px);

    box-shadow:
        0 18px 40px rgba(0, 0, 0, .28);
}


/* =========================================================
   27. REVEAL ANIMATION
========================================================= */

.lion-services-reveal {
    opacity: 0;

    transform:
        translateY(35px);

    transition:
        opacity .8s ease,
        transform .8s ease;
}

.lion-services-reveal.lion-services-visible {
    opacity: 1;

    transform:
        translateY(0);
}


/* =========================================================
   28. LAPTOP
========================================================= */

@media (max-width: 1200px) {

    .lion-services {
        padding:
            95px 0 105px;
    }

    .lion-service-card {
        min-height: 475px;
    }

    .lion-service-content {
        padding-top: 220px;
    }

}


/* =========================================================
   29. TABLET
========================================================= */

@media (max-width: 991px) {

    .lion-services {
        padding:
            80px 0 90px;

        background-attachment: scroll;
    }

    .lion-services-heading {
        grid-template-columns: 1fr;

        gap: 25px;

        margin-bottom: 38px;
    }

    .lion-services-intro {
        max-width: 700px;
    }

    .lion-services-title {
        max-width: 750px;
    }

}


/* =========================================================
   30. MOBILE
========================================================= */

@media (max-width: 767px) {

    .lion-services {
        padding:
            65px 0 72px;

        background:
            linear-gradient(180deg,
                rgba(3, 20, 14, .96),
                rgba(5, 38, 26, .96)),
            url("https://images.unsplash.com/photo-1511497584788-876760111969?auto=format&fit=crop&w=1000&q=80"
            );

        background-size: cover;

        background-position:
            center;

        background-attachment:
            scroll;
    }


    .lion-services-container {
        width:
            calc(100% - 28px);
    }


    .lion-services-heading {
        margin-bottom: 31px;

        gap: 20px;
    }


    .lion-services-eyebrow {
        font-size: 14px;

        letter-spacing: 1px;
    }


    .lion-services-title {
        font-size:
            clamp(38px, 11vw, 53px);
    }


    .lion-services-intro {
        padding-left: 16px;
    }


    .lion-services-intro p {
        font-size: 14px;
        line-height: 1.7;
    }


    .lion-service-card {
        min-height: 475px;

        border-radius: 14px;
    }


    .lion-service-content {
        padding:
            220px 20px 24px;
    }


    .lion-service-title {
        font-size: 27px;
    }


    .lion-service-description {
        min-height: 0;

        font-size: 14px;
    }


    .lion-services-controls {
        grid-template-columns:
            auto 1fr auto;

        gap: 12px;

        margin-top: 4px;
    }


    .lion-services-prev,
    .lion-services-next {
        width: 47px;
        height: 47px;
    }


    .lion-services-all-btn {
        width: 100%;
    }


    .lion-services-leaf-1,
    .lion-services-leaf-2 {
        display: none;
    }

}


/* =========================================================
   31. SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

    .lion-services-container {
        width:
            calc(100% - 20px);
    }


    .lion-service-card {
        min-height: 460px;
    }


    .lion-service-icon {
        width: 54px;
        height: 54px;

        min-width: 54px;
        min-height: 54px;
    }


    .lion-services-counter {
        min-width: 70px;
    }


    .lion-services-current {
        font-size: 24px;
    }

}


/* =========================================================
   32. REDUCED MOTION
========================================================= */

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

    .lion-services-rings,
    .lion-services-leaf,
    .lion-service-image {

        animation:
            none !important;

        transition:
            none !important;
    }


    .lion-services-reveal {
        opacity: 1;

        transform:
            none !important;
    }

}

/* =========================================================
   01. VARIABLES
========================================================= */

.lion-whyfaq {
    --lw-green-dark: #061a13;
    --lw-green: #0b3123;
    --lw-green-2: #164b35;
    --lw-green-3: #286747;

    --lw-gold: #f2bf3f;
    --lw-gold-dark: #d79b1f;
    --lw-gold-light: #ffdc78;

    --lw-white: #ffffff;
    --lw-soft: #f4f6f1;
    --lw-text: #46534c;
    --lw-border: #e2e7e3;

    width: 100%;

    position: relative;

    overflow: hidden;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;
}


/* =========================================================
   02. GLOBAL ICON RESET
========================================================= */

.lion-whyfaq i {
    position: static !important;

    margin: 0 !important;
    padding: 0 !important;

    line-height: 1 !important;

    text-align: center !important;
}


/* =========================================================
   03. WHY CHOOSE SECTION
========================================================= */

.lion-whychoose {
    width: 100%;

    position: relative;

    overflow: hidden;

    padding: 105px 0 100px;

    color: #ffffff;

    background:
        linear-gradient(110deg,
            rgba(4, 22, 15, .97) 0%,
            rgba(7, 42, 29, .94) 48%,
            rgba(7, 52, 35, .90) 100%),
        url("https://images.unsplash.com/photo-1511497584788-876760111969?auto=format&fit=crop&w=2000&q=85"
        );

    background-size: cover;

    background-position: center;

    background-attachment: fixed;
}


/* DARK EFFECT */

.lion-whychoose::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 0;

    background:

        radial-gradient(circle at 8% 20%,
            rgba(242, 191, 63, .11),
            transparent 24%),

        radial-gradient(circle at 90% 75%,
            rgba(255, 220, 120, .06),
            transparent 24%),

        linear-gradient(180deg,
            rgba(0, 0, 0, .05),
            rgba(0, 0, 0, .24));

    pointer-events: none;
}


/* =========================================================
   04. BACKGROUND TREE RINGS
========================================================= */

.lion-why-rings {
    width: 500px;
    height: 500px;

    position: absolute;

    top: -230px;
    right: -230px;

    z-index: 1;

    border-radius: 50%;

    border:
        1px solid rgba(242, 191, 63, .10);

    box-shadow:
        0 0 0 50px rgba(255, 255, 255, .015),
        0 0 0 100px rgba(242, 191, 63, .017),
        0 0 0 150px rgba(255, 255, 255, .012);

    animation:
        lionWhyRingsRotate 30s linear infinite;

    pointer-events: none;
}

.lion-why-rings::before,
.lion-why-rings::after {
    content: "";

    position: absolute;

    border-radius: 50%;

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

.lion-why-rings::before {
    inset: 50px;
}

.lion-why-rings::after {
    inset: 115px;
}

@keyframes lionWhyRingsRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


/* =========================================================
   05. CONTAINER
========================================================= */

.lion-why-container,
.lion-faq-container {
    width: min(92%, 1400px);

    margin: 0 auto;

    position: relative;

    z-index: 3;
}


/* =========================================================
   06. WHY GRID
========================================================= */

.lion-why-grid {
    display: grid;

    grid-template-columns:
        minmax(0, .88fr) minmax(0, 1.12fr);

    align-items: center;

    gap: clamp(55px, 7vw, 100px);
}


/* =========================================================
   07. LEFT CONTENT
========================================================= */

.lion-why-content {
    max-width: 620px;
}


/* EYEBROW */

.lion-why-eyebrow,
.lion-faq-eyebrow {
    margin-bottom: 16px;

    display: inline-flex;

    align-items: center;

    gap: 10px;

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

    font-weight: 800;

    text-transform: uppercase;

    letter-spacing: 1.6px;
}

.lion-why-eyebrow {
    color: var(--lw-gold-light);
}

.lion-faq-eyebrow {
    color: var(--lw-green-2);
}


/* LINE */

.lion-why-eyebrow::before,
.lion-faq-eyebrow::before {
    content: "";

    width: 38px;
    height: 3px;

    flex: 0 0 38px;

    border-radius: 20px;

    background: var(--lw-gold);
}


/* EYEBROW ICON */

.lion-why-eyebrow-icon,
.lion-faq-eyebrow-icon {
    width: 30px;
    height: 30px;

    min-width: 30px;
    min-height: 30px;

    display: flex !important;

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

    overflow: hidden;

    border-radius: 50%;

    color: var(--lw-green-dark);

    background: var(--lw-gold);

    font-size: 12px;
}

.lion-why-eyebrow-icon i,
.lion-faq-eyebrow-icon i {
    width: 16px !important;
    height: 16px !important;

    display: flex !important;

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

    font-size: 12px;

    line-height: 16px !important;
}


/* =========================================================
   08. TITLE
========================================================= */

.lion-why-title {
    margin: 0 0 23px;

    color: #ffffff;

    font-family:
        "Oswald",
        Arial,
        sans-serif;

    font-size:
        clamp(43px, 5vw, 70px);

    line-height: 1.02;

    font-weight: 700;

    letter-spacing: -1px;

    text-transform: uppercase;
}

.lion-why-title span {
    display: block;

    color: var(--lw-gold);
}


/* TEXT */

.lion-why-description {
    margin: 0 0 18px;

    color:
        rgba(255, 255, 255, .75);

    font-size: 15px;

    line-height: 1.8;

    text-align: justify;
}


/* =========================================================
   09. PHONE CTA
========================================================= */

.lion-why-contact {
    margin-top: 29px;

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 17px;
}


/* CALL BUTTON */

.lion-why-btn {
    min-height: 56px;

    padding: 0 24px;

    display: inline-flex;

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

    gap: 10px;

    position: relative;

    overflow: hidden;

    border-radius: 6px;

    color: var(--lw-green-dark);

    background:
        linear-gradient(120deg,
            var(--lw-gold-light),
            var(--lw-gold));

    font-size: 14px;
    font-weight: 800;

    box-shadow:
        0 12px 30px rgba(0, 0, 0, .22);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.lion-why-btn i {
    width: 17px !important;
    height: 17px !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;
}

.lion-why-btn:hover {
    transform: translateY(-3px);

    box-shadow:
        0 16px 36px rgba(0, 0, 0, .30);
}


/* AVAILABILITY */

.lion-why-availability {
    display: flex;

    align-items: center;

    gap: 11px;
}

.lion-why-availability-icon {
    width: 46px;
    height: 46px;

    min-width: 46px;
    min-height: 46px;

    display: flex !important;

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

    overflow: hidden;

    border-radius: 50%;

    color: var(--lw-gold);

    border:
        1px solid rgba(242, 191, 63, .32);

    background:
        rgba(255, 255, 255, .06);
}

.lion-why-availability-icon i {
    width: 20px !important;
    height: 20px !important;

    display: flex !important;

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

    font-size: 15px;
}

.lion-why-availability small {
    display: block;

    color:
        rgba(255, 255, 255, .55);

    font-size: 11px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: .6px;
}

.lion-why-availability strong {
    display: block;

    margin-top: 2px;

    color: #ffffff;

    font-family: "Oswald", sans-serif;

    font-size: 18px;
}


/* =========================================================
   10. FEATURE GRID
========================================================= */

.lion-why-cards {
    display: grid;

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

    gap: 16px;
}


/* FEATURE CARD */

.lion-why-card {
    min-height: 190px;

    padding: 24px;

    position: relative;

    overflow: hidden;

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

    border-radius: 13px;

    background:
        linear-gradient(145deg,
            rgba(255, 255, 255, .08),
            rgba(255, 255, 255, .025));

    backdrop-filter:
        blur(9px);

    box-shadow:
        0 17px 40px rgba(0, 0, 0, .15);

    transition:
        transform .4s ease,
        border-color .4s ease,
        background .4s ease;
}

.lion-why-card:hover {
    transform:
        translateY(-8px);

    border-color:
        rgba(242, 191, 63, .42);

    background:
        linear-gradient(145deg,
            rgba(242, 191, 63, .11),
            rgba(255, 255, 255, .035));
}


/* CARD NUMBER */

.lion-why-card-number {
    position: absolute;

    top: 16px;
    right: 18px;

    color:
        rgba(255, 255, 255, .13);

    font-family:
        "Oswald",
        sans-serif;

    font-size: 43px;

    font-weight: 700;

    line-height: 1;
}


/* CARD ICON */

.lion-why-card-icon {
    width: 55px;
    height: 55px;

    min-width: 55px;
    min-height: 55px;

    margin-bottom: 18px;

    display: flex !important;

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

    position: relative;

    overflow: hidden;

    border-radius: 50%;

    color: var(--lw-green-dark);

    background:
        linear-gradient(145deg,
            var(--lw-gold-light),
            var(--lw-gold));

    box-shadow:
        0 8px 22px rgba(242, 191, 63, .20);
}

.lion-why-card-icon i {
    width: 23px !important;
    height: 23px !important;

    display: flex !important;

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

    font-size: 18px;

    line-height: 23px !important;
}


/* CARD TITLE */

.lion-why-card h3 {
    margin: 0 0 8px;

    color: #ffffff;

    font-family:
        "Oswald",
        Arial,
        sans-serif;

    font-size: 22px;

    line-height: 1.2;

    font-weight: 600;

    text-transform: uppercase;
}


/* CARD DESCRIPTION */

.lion-why-card p {
    margin: 0;

    color:
        rgba(255, 255, 255, .67);

    font-size: 14px;

    line-height: 1.6;
}


/* =========================================================
   11. STATS BAR
========================================================= */

.lion-why-stats {
    margin-top: 55px;

    padding: 20px 26px;

    display: grid;

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

    gap: 0;

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

    border-radius: 12px;

    background:
        rgba(3, 22, 15, .48);

    backdrop-filter:
        blur(8px);
}

.lion-why-stat {
    padding: 5px 20px;

    text-align: center;

    position: relative;
}

.lion-why-stat:not(:last-child)::after {
    content: "";

    width: 1px;
    height: 44px;

    position: absolute;

    top: 50%;
    right: 0;

    transform:
        translateY(-50%);

    background:
        rgba(255, 255, 255, .10);
}

.lion-why-stat strong {
    display: block;

    color: var(--lw-gold);

    font-family:
        "Oswald",
        sans-serif;

    font-size: 30px;

    line-height: 1;
}

.lion-why-stat span {
    display: block;

    margin-top: 5px;

    color:
        rgba(255, 255, 255, .67);

    font-size: 13px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: .5px;
}


/* =========================================================
   12. FAQ SECTION
========================================================= */

.lion-faq {
    width: 100%;

    position: relative;

    overflow: hidden;

    padding: 105px 0 110px;

    background:
        radial-gradient(circle at 94% 10%,
            rgba(242, 191, 63, .10),
            transparent 25%),

        linear-gradient(180deg,
            #f7f8f4,
            #ffffff);
}


/* DECORATIVE TREE */

.lion-faq::after {
    content: "\f1bb";

    font-family:
        "Font Awesome 6 Free";

    font-weight: 900;

    position: absolute;

    left: -50px;
    bottom: -75px;

    color:
        rgba(11, 49, 35, .025);

    font-size: 310px;

    pointer-events: none;
}


/* =========================================================
   13. FAQ GRID
========================================================= */

.lion-faq-grid {
    display: grid;

    grid-template-columns:
        minmax(0, .80fr) minmax(0, 1.20fr);

    align-items: start;

    gap:
        clamp(45px, 7vw, 95px);
}


/* =========================================================
   14. FAQ INTRO
========================================================= */

.lion-faq-intro {
    position: sticky;

    top: 120px;
}

.lion-faq-title {
    margin: 0 0 20px;

    color: var(--lw-green-dark);

    font-family:
        "Oswald",
        Arial,
        sans-serif;

    font-size:
        clamp(40px, 4.8vw, 65px);

    line-height: 1.03;

    font-weight: 700;

    text-transform: uppercase;
}

.lion-faq-title span {
    display: block;

    color: var(--lw-gold-dark);
}

.lion-faq-description {
    margin: 0 0 26px;

    max-width: 510px;

    color: var(--lw-text);

    font-size: 15px;

    line-height: 1.8;

    text-align: justify;
}


/* =========================================================
   15. FAQ CONTACT CARD
========================================================= */

.lion-faq-contact-card {
    max-width: 420px;

    padding: 23px;

    display: flex;

    align-items: center;

    gap: 15px;

    border-radius: 10px;

    background:
        linear-gradient(120deg,
            var(--lw-green-dark),
            var(--lw-green-2));

    box-shadow:
        0 18px 45px rgba(6, 26, 19, .18);
}

.lion-faq-contact-icon {
    width: 54px;
    height: 54px;

    min-width: 54px;
    min-height: 54px;

    display: flex !important;

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

    overflow: hidden;

    border-radius: 50%;

    color: var(--lw-green-dark);

    background:
        var(--lw-gold);

    box-shadow:
        0 8px 20px rgba(0, 0, 0, .16);
}

.lion-faq-contact-icon i {
    width: 23px !important;
    height: 23px !important;

    display: flex !important;

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

    font-size: 17px;
}

.lion-faq-contact-card small {
    display: block;

    margin-bottom: 4px;

    color:
        rgba(255, 255, 255, .62);

    font-size: 11px;

    font-weight: 750;

    text-transform: uppercase;

    letter-spacing: .7px;
}

.lion-faq-contact-card strong {
    display: block;

    color: #ffffff;

    font-family:
        "Oswald",
        sans-serif;

    font-size: 22px;

    line-height: 1.15;
}

.lion-faq-contact-card span {
    display: block;

    margin-top: 4px;

    color: var(--lw-gold-light);

    font-size: 13px;
}


/* =========================================================
   16. FAQ ACCORDION
========================================================= */

.lion-faq-list {
    display: flex;

    flex-direction: column;

    gap: 12px;
}


/* ITEM */

.lion-faq-item {
    width: 100%;

    overflow: hidden;

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

    border-radius: 10px;

    background: #ffffff;

    box-shadow:
        0 10px 28px rgba(6, 38, 27, .05);

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

.lion-faq-item:hover {
    border-color:
        rgba(215, 155, 31, .42);

    box-shadow:
        0 14px 35px rgba(6, 38, 27, .08);
}

.lion-faq-item.lion-faq-open {
    border-color:
        rgba(215, 155, 31, .50);

    box-shadow:
        0 16px 38px rgba(6, 38, 27, .09);
}


/* =========================================================
   17. FAQ QUESTION
========================================================= */

.lion-faq-question {
    width: 100%;

    min-height: 76px;

    padding:
        17px 20px;

    border: 0;

    background: transparent;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 18px;

    cursor: pointer;

    text-align: left;
}


/* QUESTION LEFT */

.lion-faq-question-left {
    min-width: 0;

    display: flex;

    align-items: center;

    gap: 14px;
}


/* FAQ ICON */

.lion-faq-question-icon {
    width: 44px;
    height: 44px;

    min-width: 44px;
    min-height: 44px;

    flex: 0 0 44px;

    display: flex !important;

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

    overflow: hidden;

    border-radius: 50%;

    color: var(--lw-green-dark);

    background:
        rgba(242, 191, 63, .17);

    border:
        1px solid rgba(242, 191, 63, .30);

    transition:
        background .3s ease,
        color .3s ease;
}

.lion-faq-question-icon i {
    width: 19px !important;
    height: 19px !important;

    display: flex !important;

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

    font-size: 14px;
}


/* QUESTION TEXT */

.lion-faq-question-text {
    color: var(--lw-green-dark);

    font-size: 15px;

    line-height: 1.4;

    font-weight: 800;
}


/* PLUS BUTTON */

.lion-faq-toggle {
    width: 38px;
    height: 38px;

    min-width: 38px;
    min-height: 38px;

    flex: 0 0 38px;

    position: relative;

    overflow: hidden;

    display: flex !important;

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

    border-radius: 50%;

    color: #ffffff;

    background:
        var(--lw-green-dark);

    transition:
        transform .3s ease,
        background .3s ease;
}

.lion-faq-toggle::before,
.lion-faq-toggle::after {
    content: "";

    position: absolute;

    left: 50%;
    top: 50%;

    background:
        var(--lw-gold);

    border-radius: 20px;

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

    transition:
        transform .3s ease,
        opacity .3s ease;
}

.lion-faq-toggle::before {
    width: 14px;
    height: 2px;
}

.lion-faq-toggle::after {
    width: 2px;
    height: 14px;
}


/* OPEN */

.lion-faq-item.lion-faq-open .lion-faq-toggle {
    background:
        var(--lw-gold);
}

.lion-faq-item.lion-faq-open .lion-faq-toggle::before {
    background:
        var(--lw-green-dark);
}

.lion-faq-item.lion-faq-open .lion-faq-toggle::after {
    opacity: 0;

    transform:
        translate(-50%, -50%) rotate(90deg);
}

.lion-faq-item.lion-faq-open .lion-faq-question-icon {
    color: #ffffff;

    background:
        var(--lw-green-dark);
}


/* =========================================================
   18. FAQ ANSWER
========================================================= */

.lion-faq-answer {
    max-height: 0;

    overflow: hidden;

    transition:
        max-height .42s ease;
}

.lion-faq-answer-inner {
    padding:
        0 22px 23px 78px;

    color: #5a665f;

    font-size: 14px;

    line-height: 1.75;

    text-align: justify;
}

.lion-faq-answer-inner p {
    margin: 0;
}


/* =========================================================
   19. REVEAL ANIMATIONS
========================================================= */

.lion-wf-reveal {
    opacity: 0;

    transform:
        translateY(35px);

    transition:
        opacity .8s ease,
        transform .8s ease;
}

.lion-wf-reveal.lion-wf-visible {
    opacity: 1;

    transform:
        translateY(0);
}


/* =========================================================
   20. LAPTOP
========================================================= */

@media (max-width: 1100px) {

    .lion-whychoose,
    .lion-faq {
        padding:
            90px 0;
    }

    .lion-why-grid {
        gap: 50px;
    }

    .lion-why-card {
        padding: 20px;
    }

}


/* =========================================================
   21. TABLET
========================================================= */

@media (max-width: 900px) {

    .lion-whychoose {
        background-attachment: scroll;
    }

    .lion-why-grid,
    .lion-faq-grid {
        grid-template-columns: 1fr;

        gap: 45px;
    }

    .lion-why-content {
        max-width: 760px;
    }

    .lion-faq-intro {
        position: relative;

        top: auto;
    }

    .lion-faq-description {
        max-width: 760px;
    }

    .lion-faq-contact-card {
        max-width: 470px;
    }

}


/* =========================================================
   22. MOBILE
========================================================= */

@media (max-width: 767px) {

    .lion-whychoose,
    .lion-faq {
        padding:
            65px 0 70px;
    }


    .lion-why-container,
    .lion-faq-container {
        width:
            calc(100% - 28px);
    }


    /* WHY */

    .lion-why-title {
        font-size:
            clamp(38px, 11vw, 53px);
    }

    .lion-why-description {
        font-size: 14px;

        line-height: 1.75;
    }

    .lion-why-cards {
        grid-template-columns: 1fr;

        gap: 12px;
    }

    .lion-why-card {
        min-height: 165px;
    }

    .lion-why-card h3 {
        font-size: 21px;
    }

    .lion-why-card p {
        font-size: 14px;
    }

    .lion-why-contact {
        flex-direction: column;

        align-items: stretch;
    }

    .lion-why-btn {
        width: 100%;
    }

    .lion-why-availability {
        justify-content: flex-start;
    }


    /* STATS */

    .lion-why-stats {
        grid-template-columns:
            repeat(2, 1fr);

        gap: 0;

        padding: 10px;
    }

    .lion-why-stat {
        padding:
            17px 8px;
    }

    .lion-why-stat:nth-child(2)::after {
        display: none;
    }

    .lion-why-stat:nth-child(1),
    .lion-why-stat:nth-child(2) {
        border-bottom:
            1px solid rgba(255, 255, 255, .09);
    }

    .lion-why-stat strong {
        font-size: 26px;
    }

    .lion-why-stat span {
        font-size: 12px;
    }


    /* FAQ */

    .lion-faq-title {
        font-size:
            clamp(38px, 11vw, 52px);
    }

    .lion-faq-description {
        font-size: 14px;

        line-height: 1.75;
    }

    .lion-faq-question {
        min-height: 70px;

        padding:
            14px;
    }

    .lion-faq-question-left {
        gap: 10px;
    }

    .lion-faq-question-icon {
        width: 40px;
        height: 40px;

        min-width: 40px;
        min-height: 40px;

        flex-basis: 40px;
    }

    .lion-faq-question-text {
        font-size: 14px;
    }

    .lion-faq-toggle {
        width: 34px;
        height: 34px;

        min-width: 34px;
        min-height: 34px;

        flex-basis: 34px;
    }

    .lion-faq-answer-inner {
        padding:
            0 16px 20px 64px;

        font-size: 14px;
    }

}


/* =========================================================
   23. SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

    .lion-why-container,
    .lion-faq-container {
        width:
            calc(100% - 20px);
    }

    .lion-faq-contact-card {
        padding: 18px;
    }

    .lion-faq-contact-card strong {
        font-size: 19px;
    }

}


/* =========================================================
   24. REDUCED MOTION
========================================================= */

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

    .lion-why-rings,
    .lion-wf-reveal {
        animation: none !important;

        transition: none !important;
    }

    .lion-wf-reveal {
        opacity: 1;

        transform: none !important;
    }

}




/* =========================================================
   01. VARIABLES
========================================================= */
.lion-reviews {
    --lr-green-dark: #0a2418;
    --lr-green: #15442f;
    --lr-green-2: #2d6a4f;
    --lr-gold: #f2bf3f;
    --lr-gold-dark: #d59615;
    --lr-gold-light: #ffe29a;
    --lr-white: #ffffff;
    --lr-soft: #f7f8f5;
    --lr-soft-2: #eef2ec;
    --lr-text: #536158;
    --lr-title: #11281d;
    --lr-border: #dde6de;

    width: 100%;
    position: relative;
    overflow: hidden;
    padding: 105px 0 110px;
    background: #ffffff;
    font-family: "DM Sans", Arial, sans-serif;
}

/* =========================================================
   02. BACKGROUND TREE TEXTURE
========================================================= */
.lion-reviews::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 8% 15%, rgba(242, 191, 63, .10), transparent 20%),
        radial-gradient(circle at 92% 20%, rgba(21, 68, 47, .05), transparent 22%),
        radial-gradient(circle at 88% 82%, rgba(242, 191, 63, .07), transparent 22%),
        linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(247, 248, 245, .55));
    z-index: 0;
}

.lion-reviews::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    opacity: .12;
    background-image:
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='900' height='900' viewBox='0 0 900 900'><g fill='none' stroke='%2315442f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M95 670 C135 590 185 540 240 490 C310 425 380 370 470 320'/><path d='M160 618 C200 580 230 540 260 485'/><path d='M210 553 C250 530 280 500 305 455'/><path d='M295 470 C330 450 355 425 378 394'/><path d='M360 402 C395 390 420 368 445 340'/><path d='M255 605 C270 580 298 560 322 548'/><path d='M320 545 C345 525 365 505 388 480'/><path d='M405 350 C420 325 438 305 458 285'/><path d='M540 185 C560 165 585 155 615 153'/><path d='M560 240 C590 220 615 210 655 210'/><circle cx='705' cy='655' r='145'/><circle cx='705' cy='655' r='105'/><circle cx='705' cy='655' r='65'/><circle cx='705' cy='655' r='25'/></g></svg>");
    background-repeat: no-repeat;
    background-position: left bottom, right bottom;
    background-size: 900px 900px;
}

/* Tree rings */
.lion-reviews-rings {
    width: 340px;
    height: 340px;
    position: absolute;
    right: -120px;
    top: 45px;
    border-radius: 50%;
    border: 1px solid rgba(21, 68, 47, .09);
    box-shadow:
        0 0 0 35px rgba(21, 68, 47, .035),
        0 0 0 70px rgba(242, 191, 63, .035),
        0 0 0 105px rgba(21, 68, 47, .018);
    pointer-events: none;
    z-index: 0;
}

.lion-reviews-rings::before,
.lion-reviews-rings::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    inset: 32px;
    border: 1px dashed rgba(21, 68, 47, .08);
}

.lion-reviews-rings::after {
    inset: 82px;
    border-color: rgba(242, 191, 63, .10);
}

/* subtle leaf decoration */
.lion-reviews-leaf {
    position: absolute;
    z-index: 0;
    pointer-events: none;
    color: rgba(21, 68, 47, .08);
}

.lion-reviews-leaf-1 {
    left: 3%;
    top: 120px;
    font-size: 68px;
    transform: rotate(-20deg);
}

.lion-reviews-leaf-2 {
    right: 4%;
    bottom: 110px;
    font-size: 90px;
    transform: rotate(18deg);
}

/* =========================================================
   03. CONTAINER
========================================================= */
.lion-reviews-container {
    width: min(92%, 1400px);
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

/* =========================================================
   04. HEADER
========================================================= */
.lion-reviews-header {
    margin-bottom: 44px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 34px;
}

.lion-reviews-eyebrow {
    margin-bottom: 14px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--lr-green-2);
    font-size: 14px;
    line-height: 1.3;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

.lion-reviews-eyebrow::before {
    content: "";
    width: 38px;
    height: 3px;
    border-radius: 20px;
    background: linear-gradient(90deg, var(--lr-gold-dark), var(--lr-gold));
}

.lion-reviews-title {
    max-width: 760px;
    margin: 0;
    color: var(--lr-title);
    font-family: "Oswald", Arial, sans-serif;
    font-size: clamp(42px, 5vw, 70px);
    line-height: 1.03;
    font-weight: 700;
    letter-spacing: -1px;
    text-transform: uppercase;
}

.lion-reviews-title span {
    display: block;
    color: var(--lr-green-2);
}

/* =========================================================
   05. GOOGLE SUMMARY CARD
========================================================= */
.lion-google-summary {
    min-width: 285px;
    padding: 18px 20px;
    border: 1px solid var(--lr-border);
    border-radius: 14px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 15px 35px rgba(16, 47, 33, .08);
    transition: transform .3s ease, box-shadow .3s ease;
}

.lion-google-summary:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(16, 47, 33, .12);
}

.lion-google-summary-top {
    display: flex;
    align-items: center;
    gap: 12px;
}

.lion-google-g {
    width: 48px;
    height: 48px;
    min-width: 48px;
    min-height: 48px;
    flex: 0 0 48px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50%;
    background: #fff;
    border: 1px solid #e9ece9;
    color: #4285f4;
    font-family: Arial, sans-serif;
    font-size: 24px;
    font-weight: 800;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .06);
}

.lion-google-summary small {
    display: block;
    margin-bottom: 2px;
    color: #86928a;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .7px;
}

.lion-google-summary strong {
    display: block;
    color: var(--lr-title);
    font-family: "Oswald", sans-serif;
    font-size: 20px;
    line-height: 1.2;
}

.lion-google-stars {
    margin-top: 12px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.lion-google-stars i {
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
    color: var(--lr-gold-dark);
    font-size: 15px;
    line-height: 1 !important;
}

/* =========================================================
   06. SLIDER VIEWPORT
========================================================= */
.lion-reviews-viewport {
    width: 100%;
    overflow: hidden;
    padding: 5px 2px 18px;
    position: relative;
}

.lion-reviews-track {
    display: flex;
    align-items: stretch;
    gap: 20px;
    transition: transform .75s cubic-bezier(.22, .61, .36, 1);
    will-change: transform;
}

/* =========================================================
   07. REVIEW CARD
========================================================= */
.lion-review-card {
    min-width: calc((100% - 40px) / 3);
    min-height: 350px;
    padding: 25px;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--lr-border);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 20px 45px rgba(15, 45, 31, .08);
    transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}

.lion-review-card:hover {
    transform: translateY(-8px);
    border-color: rgba(213, 150, 21, .32);
    box-shadow: 0 28px 55px rgba(15, 45, 31, .12);
}

.lion-review-card::before {
    content: "";
    width: 90px;
    height: 4px;
    position: absolute;
    top: 0;
    left: 25px;
    background: linear-gradient(90deg, var(--lr-gold-dark), var(--lr-gold-light));
    border-radius: 0 0 20px 20px;
}

.lion-review-card::after {
    content: "";
    width: 140px;
    height: 140px;
    position: absolute;
    right: -38px;
    bottom: -38px;
    border-radius: 50%;
    background:
        repeating-radial-gradient(circle,
            rgba(21, 68, 47, .05) 0 2px,
            rgba(21, 68, 47, .015) 2px 12px,
            transparent 12px 24px);
    pointer-events: none;
}

/* top */
.lion-review-top {
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.lion-review-author {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.lion-review-avatar {
    width: 52px;
    height: 52px;
    min-width: 52px;
    min-height: 52px;
    flex: 0 0 52px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden;
    border-radius: 50%;
    color: var(--lr-green-dark);
    background: linear-gradient(145deg, var(--lr-gold-light), var(--lr-gold));
    border: 3px solid #fff;
    box-shadow: 0 6px 16px rgba(21, 68, 47, .10);
    font-family: "Oswald", sans-serif;
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
}

.lion-review-author-copy {
    min-width: 0;
}

.lion-review-author-copy strong {
    display: block;
    color: var(--lr-title);
    font-size: 15px;
    line-height: 1.3;
    font-weight: 800;
}

.lion-review-author-copy span {
    display: block;
    margin-top: 3px;
    color: #8a948e;
    font-size: 12px;
    line-height: 1.3;
}

.lion-review-google {
    width: 36px;
    height: 36px;
    min-width: 36px;
    min-height: 36px;
    flex: 0 0 36px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden;
    border-radius: 50%;
    background: #f7f8f7;
    border: 1px solid #e5e9e5;
    color: #4285f4;
    font-family: Arial, sans-serif;
    font-size: 18px;
    font-weight: 800;
}

/* stars */
.lion-review-stars {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.lion-review-stars i {
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
    color: var(--lr-gold-dark);
    font-size: 15px;
    line-height: 1 !important;
}

/* text */
.lion-review-text {
    margin: 0 0 22px;
    color: var(--lr-text);
    font-size: 14px;
    line-height: 1.75;
    flex-grow: 1;
    position: relative;
    z-index: 2;
}

/* footer */
.lion-review-footer {
    margin-top: auto;
    padding-top: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid #e7ebe8;
}

.lion-review-footer span {
    color: #8a948e;
    font-size: 12px;
    font-weight: 650;
}

.lion-review-footer a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--lr-green);
    font-size: 13px;
    font-weight: 800;
}

.lion-review-footer a i {
    margin: 0 !important;
    position: static !important;
    color: var(--lr-gold-dark);
    font-size: 11px;
    line-height: 1 !important;
}

/* =========================================================
   08. CONTROLS
========================================================= */
.lion-reviews-controls {
    margin-top: 15px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 20px;
}

.lion-review-arrows {
    display: flex;
    align-items: center;
    gap: 9px;
}

.lion-review-arrow {
    width: 50px;
    height: 50px;
    min-width: 50px;
    min-height: 50px;
    padding: 0;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden;
    border: 1px solid var(--lr-border);
    border-radius: 50%;
    color: var(--lr-green-dark);
    background: #fff;
    box-shadow: 0 8px 18px rgba(12, 39, 27, .05);
    cursor: pointer;
    transition: transform .3s ease, background .3s ease, color .3s ease, border-color .3s ease;
}

.lion-review-arrow:hover {
    background: var(--lr-gold);
    color: var(--lr-green-dark);
    border-color: rgba(213, 150, 21, .35);
    transform: scale(1.06);
}

.lion-review-arrow i {
    width: 18px !important;
    height: 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    position: static !important;
    font-size: 13px;
    line-height: 18px !important;
}

/* progress */
.lion-review-progress {
    width: 100%;
    height: 3px;
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    background: #e6ece7;
}

.lion-review-progress-bar {
    width: 0%;
    height: 100%;
    border-radius: 20px;
    background: linear-gradient(90deg, var(--lr-gold-dark), var(--lr-gold-light));
    transition: width .45s ease;
}

/* counter */
.lion-review-counter {
    min-width: 90px;
    display: flex;
    justify-content: flex-end;
    align-items: baseline;
    gap: 5px;
    font-family: "Oswald", sans-serif;
}

.lion-review-current {
    color: var(--lr-green-2);
    font-size: 28px;
    line-height: 1;
}

.lion-review-divider {
    color: #bcc6bf;
}

.lion-review-total {
    color: #86928a;
    font-size: 14px;
}

/* =========================================================
   09. CTA BUTTONS
========================================================= */
.lion-reviews-bottom {
    margin-top: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}

.lion-google-btn {
    min-height: 55px;
    padding: 0 23px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 800;
    transition: transform .3s ease, box-shadow .3s ease, background .3s ease;
}

.lion-google-btn:hover {
    transform: translateY(-3px);
}

.lion-google-btn-primary {
    color: #fff;
    background: linear-gradient(120deg, var(--lr-green), var(--lr-green-2));
    box-shadow: 0 12px 28px rgba(16, 47, 33, .14);
}

.lion-google-btn-secondary {
    color: var(--lr-green-dark);
    border: 1px solid var(--lr-border);
    background: #fff;
    box-shadow: 0 10px 24px rgba(16, 47, 33, .06);
}

.lion-google-btn i {
    width: 18px !important;
    height: 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    position: static !important;
    font-size: 13px;
    line-height: 18px !important;
}

/* =========================================================
   10. REVEAL
========================================================= */
.lion-reviews-reveal {
    opacity: 0;
    transform: translateY(35px);
    transition: opacity .8s ease, transform .8s ease;
}

.lion-reviews-reveal.lion-reviews-visible {
    opacity: 1;
    transform: translateY(0);
}

/* =========================================================
   11. TABLET
========================================================= */
@media (max-width:1000px) {

    .lion-reviews {
        padding: 85px 0 90px;
    }

    .lion-reviews-header {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .lion-google-summary {
        max-width: 300px;
    }

    .lion-review-card {
        min-width: calc((100% - 20px) / 2);
    }
}

/* =========================================================
   12. MOBILE
========================================================= */
@media (max-width:767px) {

    .lion-reviews {
        padding: 65px 0 70px;
    }

    .lion-reviews-container {
        width: calc(100% - 28px);
    }

    .lion-reviews-header {
        margin-bottom: 30px;
        gap: 22px;
    }

    .lion-reviews-title {
        font-size: clamp(38px, 11vw, 52px);
    }

    .lion-google-summary {
        width: 100%;
        max-width: none;
        min-width: 0;
    }

    .lion-review-card {
        min-width: 100%;
        min-height: 335px;
        padding: 22px;
    }

    .lion-review-text,
    .lion-review-author-copy strong {
        font-size: 14px;
    }

    .lion-reviews-controls {
        grid-template-columns: auto 1fr auto;
        gap: 11px;
    }

    .lion-review-arrow {
        width: 46px;
        height: 46px;
        min-width: 46px;
        min-height: 46px;
    }

    .lion-reviews-bottom {
        flex-direction: column;
    }

    .lion-google-btn {
        width: 100%;
    }

    .lion-reviews-rings {
        width: 250px;
        height: 250px;
        right: -90px;
        top: 65px;
    }

    .lion-reviews-leaf-1,
    .lion-reviews-leaf-2 {
        display: none;
    }
}

/* =========================================================
   13. SMALL MOBILE
========================================================= */
@media (max-width:420px) {

    .lion-reviews-container {
        width: calc(100% - 20px);
    }

    .lion-review-card {
        padding: 19px;
    }

    .lion-review-avatar {
        width: 47px;
        height: 47px;
        min-width: 47px;
        min-height: 47px;
        flex-basis: 47px;
    }

    .lion-review-counter {
        min-width: 65px;
    }
}

/* =========================================================
   14. REDUCED MOTION
========================================================= */
@media (prefers-reduced-motion: reduce) {

    .lion-reviews-track,
    .lion-reviews-reveal {
        transition: none !important;
    }

    .lion-reviews-reveal {
        opacity: 1;
        transform: none;
    }
}





/* =========================================================
   01. GLOBAL VARIABLES
========================================================= */

.lion-footer-area {
    --lf-green-900: #04160f;
    --lf-green-850: #061c14;
    --lf-green-800: #08251a;
    --lf-green-700: #0d3526;
    --lf-green-600: #175039;
    --lf-green-500: #286b49;

    --lf-gold: #f2bf3f;
    --lf-gold-dark: #d89b1d;
    --lf-gold-light: #ffdc78;

    --lf-white: #ffffff;
    --lf-offwhite: #f5f7f3;
    --lf-muted: #aebbb4;

    width: 100%;
    position: relative;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;
}


/* =========================================================
   02. ICON RESET
   EVITA QUE EL TEMA DE WORDPRESS MUEVA LOS ICONOS
========================================================= */

.lion-footer-area i,
.lion-floating-socials i,
.lion-chatbot-demo i {

    position: static !important;

    margin: 0 !important;
    padding: 0 !important;

    line-height: 1 !important;

    text-align: center !important;

}


/* =========================================================
   03. CTA BEFORE FOOTER
========================================================= */

.lion-footer-cta {
    width: 100%;

    position: relative;
    z-index: 5;

    padding: 0 0 0;

    background: #ffffff;
}

.lion-footer-cta-container {
    width: min(92%, 1400px);

    margin: 0 auto;

    position: relative;

    transform: translateY(55px);

    z-index: 5;
}


/* CTA CARD */

.lion-footer-cta-card {
    min-height: 190px;

    padding: 34px 42px;

    display: grid;

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

    align-items: center;

    gap: 35px;

    position: relative;

    overflow: hidden;

    border-radius: 17px;

    color: #ffffff;

    background:
        linear-gradient(105deg,
            rgba(5, 30, 21, .97) 0%,
            rgba(11, 62, 43, .94) 60%,
            rgba(18, 79, 54, .90) 100%),
        url("https://images.unsplash.com/photo-1511497584788-876760111969?auto=format&fit=crop&w=1800&q=85"
        );

    background-size: cover;
    background-position: center;

    box-shadow:
        0 30px 65px rgba(6, 31, 22, .20);
}


/* BACKGROUND EFFECT */

.lion-footer-cta-card::before {
    content: "";

    width: 300px;
    height: 300px;

    position: absolute;

    right: -90px;
    top: -135px;

    border-radius: 50%;

    border:
        1px solid rgba(242, 191, 63, .18);

    box-shadow:
        0 0 0 35px rgba(242, 191, 63, .025),
        0 0 0 70px rgba(255, 255, 255, .015);

    pointer-events: none;
}


/* CTA COPY */

.lion-footer-cta-copy {
    position: relative;
    z-index: 2;
}

.lion-footer-cta-eyebrow {
    margin-bottom: 9px;

    display: inline-flex;

    align-items: center;

    gap: 9px;

    color: var(--lf-gold-light);

    font-size: 14px;
    line-height: 1.4;

    font-weight: 800;

    text-transform: uppercase;

    letter-spacing: 1.4px;
}

.lion-footer-cta-eyebrow::before {
    content: "";

    width: 34px;
    height: 3px;

    background: var(--lf-gold);

    border-radius: 10px;
}


.lion-footer-cta-title {
    max-width: 760px;

    margin: 0 0 11px;

    color: #ffffff;

    font-family:
        "Oswald",
        Arial,
        sans-serif;

    font-size:
        clamp(32px, 3.5vw, 50px);

    line-height: 1.05;

    font-weight: 700;

    text-transform: uppercase;
}

.lion-footer-cta-title span {
    color: var(--lf-gold);
}


.lion-footer-cta-copy p {
    max-width: 730px;

    margin: 0;

    color:
        rgba(255, 255, 255, .72);

    font-size: 14px;
    line-height: 1.7;
}


/* CTA ACTIONS */

.lion-footer-cta-actions {
    position: relative;
    z-index: 2;

    display: flex;

    align-items: center;

    gap: 10px;
}


.lion-footer-cta-btn {
    min-height: 56px;

    padding: 0 22px;

    display: inline-flex;

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

    gap: 10px;

    position: relative;

    overflow: hidden;

    border-radius: 7px;

    font-size: 14px;

    font-weight: 800;

    white-space: nowrap;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background .3s ease;
}


.lion-footer-cta-btn i {
    width: 18px !important;
    height: 18px !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;
}


.lion-footer-cta-btn-primary {
    color: var(--lf-green-900);

    background:
        linear-gradient(120deg,
            var(--lf-gold-light),
            var(--lf-gold));

    box-shadow:
        0 12px 25px rgba(0, 0, 0, .20);
}


.lion-footer-cta-btn-secondary {
    color: #ffffff;

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

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

    backdrop-filter:
        blur(8px);
}


.lion-footer-cta-btn:hover {
    transform:
        translateY(-3px);
}


/* =========================================================
   04. MAIN FOOTER
========================================================= */

.lion-footer {
    width: 100%;

    position: relative;

    overflow: hidden;

    padding:
        125px 0 0;

    color: #ffffff;

    background:
        linear-gradient(110deg,
            rgba(3, 18, 12, .985),
            rgba(6, 34, 24, .97)),
        url("https://images.unsplash.com/photo-1441974231531-c6227db76b6e?auto=format&fit=crop&w=2000&q=80"
        );

    background-size: cover;
    background-position: center;
}


/* TREE TEXTURE */

.lion-footer::before {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background:
        radial-gradient(circle at 10% 30%,
            rgba(242, 191, 63, .08),
            transparent 22%),

        radial-gradient(circle at 91% 70%,
            rgba(242, 191, 63, .05),
            transparent 24%);
}


/* LARGE TREE DECORATION */

.lion-footer::after {
    content: "\f1bb";

    font-family:
        "Font Awesome 6 Free";

    font-weight: 900;

    position: absolute;

    right: -65px;
    bottom: -105px;

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

    font-size: 420px;

    pointer-events: none;
}


/* =========================================================
   05. FOOTER CONTAINER
========================================================= */

.lion-footer-container {
    width: min(92%, 1400px);

    margin: 0 auto;

    position: relative;

    z-index: 3;
}


/* =========================================================
   06. FOOTER GRID
========================================================= */

.lion-footer-grid {
    padding-bottom: 65px;

    display: grid;

    grid-template-columns:
        1.35fr .75fr .95fr 1.05fr;

    gap: clamp(32px, 4vw, 60px);
}


/* =========================================================
   07. BRAND COLUMN
========================================================= */

.lion-footer-brand {
    max-width: 400px;
}


.lion-footer-logo-wrap {
    margin-bottom: 20px;

    display: flex;

    align-items: center;

    gap: 14px;
}


.lion-footer-logo {
    width: 105px;
    height: 105px;

    flex: 0 0 105px;

    object-fit: contain;

    filter:
        drop-shadow(0 8px 12px rgba(0, 0, 0, .24));
}


.lion-footer-brand-title {
    color: #ffffff;

    font-family:
        "Oswald",
        sans-serif;

    font-size: 20px;

    line-height: 1.08;

    font-weight: 700;

    text-transform: uppercase;
}


.lion-footer-brand-title span {
    display: block;

    margin-top: 4px;

    color: var(--lf-gold);

    font-size: 15px;
}


.lion-footer-description {
    margin:
        0 0 22px;

    color:
        rgba(255, 255, 255, .65);

    font-size: 14px;

    line-height: 1.75;

    text-align: justify;
}


/* BADGES */

.lion-footer-badges {
    display: flex;

    flex-wrap: wrap;

    gap: 8px;
}


.lion-footer-badge {
    min-height: 35px;

    padding: 0 11px;

    display: inline-flex;

    align-items: center;

    gap: 7px;

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

    border-radius: 30px;

    color:
        rgba(255, 255, 255, .78);

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

    font-size: 12px;

    font-weight: 700;
}


.lion-footer-badge i {
    color:
        var(--lf-gold);

    font-size: 11px;
}


/* =========================================================
   08. FOOTER COLUMN TITLE
========================================================= */

.lion-footer-column-title {
    margin:
        5px 0 22px;

    padding-bottom: 12px;

    position: relative;

    color: #ffffff;

    font-family:
        "Oswald",
        sans-serif;

    font-size: 19px;

    font-weight: 600;

    text-transform: uppercase;
}


.lion-footer-column-title::after {
    content: "";

    width: 38px;
    height: 3px;

    position: absolute;

    left: 0;
    bottom: 0;

    border-radius: 20px;

    background:
        linear-gradient(90deg,
            var(--lf-gold),
            var(--lf-gold-light));
}


/* =========================================================
   09. FOOTER LINKS
========================================================= */

.lion-footer-links {
    padding: 0;
    margin: 0;

    list-style: none;

    display: flex;

    flex-direction: column;

    gap: 10px;
}


.lion-footer-links li {
    margin: 0;
}


.lion-footer-links a {
    display: inline-flex;

    align-items: center;

    gap: 9px;

    color:
        rgba(255, 255, 255, .66);

    font-size: 14px;

    line-height: 1.45;

    transition:
        color .25s ease,
        transform .25s ease;
}


.lion-footer-links a::before {
    content: "";

    width: 6px;
    height: 6px;

    flex: 0 0 6px;

    border-radius: 50%;

    background:
        var(--lf-gold);

    box-shadow:
        0 0 0 3px rgba(242, 191, 63, .08);

    transition:
        transform .25s ease;
}


.lion-footer-links a:hover {
    color:
        var(--lf-gold-light);

    transform:
        translateX(5px);
}


.lion-footer-links a:hover::before {
    transform:
        scale(1.3);
}


/* =========================================================
   10. CONTACT INFORMATION
========================================================= */

.lion-footer-contact-list {
    display: flex;

    flex-direction: column;

    gap: 12px;
}


.lion-footer-contact-item {
    display: flex;

    align-items: flex-start;

    gap: 12px;
}


.lion-footer-contact-icon {
    width: 39px;
    height: 39px;

    min-width: 39px;
    min-height: 39px;

    flex: 0 0 39px;

    display: flex !important;

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

    overflow: hidden;

    border-radius: 50%;

    color:
        var(--lf-green-900);

    background:
        linear-gradient(145deg,
            var(--lf-gold-light),
            var(--lf-gold));
}


.lion-footer-contact-icon i {
    width: 17px !important;
    height: 17px !important;

    display: flex !important;

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

    font-size: 13px;
}


.lion-footer-contact-copy {
    min-width: 0;
}


.lion-footer-contact-copy small {
    display: block;

    margin-bottom: 2px;

    color:
        rgba(255, 255, 255, .41);

    font-size: 10px;

    font-weight: 750;

    letter-spacing: .6px;

    text-transform: uppercase;
}


.lion-footer-contact-copy a,
.lion-footer-contact-copy span {
    color:
        rgba(255, 255, 255, .76);

    font-size: 14px;

    line-height: 1.45;

    overflow-wrap: anywhere;
}


.lion-footer-contact-copy a:hover {
    color:
        var(--lf-gold-light);
}


/* =========================================================
   11. BUSINESS HOURS
========================================================= */

.lion-footer-hours {
    padding: 17px;

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

    border-radius: 10px;

    background:
        rgba(255, 255, 255, .035);
}


.lion-footer-hours-row {
    padding:
        10px 0;

    display: flex;

    justify-content: space-between;

    gap: 14px;

    border-bottom:
        1px solid rgba(255, 255, 255, .07);

    color:
        rgba(255, 255, 255, .67);

    font-size: 14px;
}


.lion-footer-hours-row:first-child {
    padding-top: 0;
}


.lion-footer-hours-row:last-child {
    padding-bottom: 0;

    border-bottom: 0;
}


.lion-footer-hours-row strong {
    color:
        var(--lf-gold-light);

    font-weight: 800;
}


/* EMERGENCY */

.lion-footer-emergency {
    margin-top: 17px;

    padding: 15px;

    display: flex;

    align-items: center;

    gap: 12px;

    border:
        1px solid rgba(242, 191, 63, .20);

    border-radius: 9px;

    background:
        linear-gradient(120deg,
            rgba(242, 191, 63, .10),
            rgba(255, 255, 255, .025));
}


.lion-footer-emergency-icon {
    width: 42px;
    height: 42px;

    min-width: 42px;
    min-height: 42px;

    display: flex !important;

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

    border-radius: 50%;

    color:
        var(--lf-green-900);

    background:
        var(--lf-gold);
}


.lion-footer-emergency-icon i {
    width: 18px !important;
    height: 18px !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;
}


.lion-footer-emergency small {
    display: block;

    color:
        rgba(255, 255, 255, .48);

    font-size: 10px;

    text-transform: uppercase;

    letter-spacing: .6px;
}


.lion-footer-emergency strong {
    display: block;

    margin-top: 2px;

    color: #ffffff;

    font-family:
        "Oswald",
        sans-serif;

    font-size: 17px;
}


/* =========================================================
   12. BOTTOM FOOTER
========================================================= */

.lion-footer-bottom {
    min-height: 75px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;

    border-top:
        1px solid rgba(255, 255, 255, .09);
}


.lion-footer-copyright {
    color:
        rgba(255, 255, 255, .48);

    font-size: 13px;

    line-height: 1.5;
}


.lion-footer-copyright strong {
    color:
        rgba(255, 255, 255, .79);
}


.lion-footer-bottom-links {
    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 18px;
}


.lion-footer-bottom-links a {
    color:
        rgba(255, 255, 255, .51);

    font-size: 13px;

    transition:
        color .25s ease;
}


.lion-footer-bottom-links a:hover {
    color:
        var(--lf-gold);
}


/* =========================================================
   13. FOOTER REVEAL ANIMATION
========================================================= */

.lion-footer-reveal {
    opacity: 0;

    transform:
        translateY(30px);

    transition:
        opacity .8s ease,
        transform .8s ease;
}


.lion-footer-reveal.lion-footer-visible {
    opacity: 1;

    transform:
        translateY(0);
}


/* =========================================================
   14. FLOATING SOCIAL NETWORKS
========================================================= */

/*
=========================================================
   FLOATING SOCIAL NETWORKS
   FACEBOOK + INSTAGRAM + GOOGLE

   QUEDA EN TOP 40% COMO SOLICITASTE.
=========================================================
*/

.lion-floating-socials {
    position: fixed;

    right: 15px;

    top: 40%;

    transform:
        translateY(-40%);

    z-index: 9992;

    display: flex;

    flex-direction: column;

    gap: 9px;

    font-family:
        "DM Sans",
        Arial,
        sans-serif;
}


.lion-floating-social {
    width: 49px;
    height: 49px;

    min-width: 49px;
    min-height: 49px;

    position: relative;

    display: flex !important;

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

    overflow: visible;

    border-radius: 50%;

    color: #ffffff;

    box-shadow:
        0 9px 24px rgba(0, 0, 0, .18);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}


.lion-floating-social>i {
    width: 20px !important;
    height: 20px !important;

    display: flex !important;

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

    font-size: 18px;
}


/* FACEBOOK */

.lion-social-facebook {
    background:
        #1877f2;
}


/* INSTAGRAM */

.lion-social-instagram {
    background:
        linear-gradient(135deg,
            #833ab4,
            #fd1d1d,
            #fcb045);
}


/* GOOGLE */

.lion-social-google {
    background: #ffffff;

    border:
        1px solid #e5e5e5;

    color: #4285f4;
}


.lion-social-google span {
    font-family:
        Arial,
        sans-serif;

    font-size: 20px;

    font-weight: 800;
}


/* HOVER */

.lion-floating-social:hover {
    transform:
        translateX(-5px) scale(1.08);

    box-shadow:
        0 13px 30px rgba(0, 0, 0, .24);
}


/* TOOLTIP */

.lion-social-tooltip {
    min-width: 115px;

    min-height: 34px;

    padding: 0 12px;

    position: absolute;

    right: 59px;

    top: 50%;

    transform:
        translateY(-50%) translateX(10px);

    display: flex;

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

    border-radius: 5px;

    color: #ffffff;

    background:
        var(--lf-green-900);

    font-size: 12px;

    font-weight: 750;

    white-space: nowrap;

    opacity: 0;

    visibility: hidden;

    pointer-events: none;

    transition:
        opacity .25s ease,
        visibility .25s ease,
        transform .25s ease;
}


.lion-social-tooltip::after {
    content: "";

    position: absolute;

    right: -5px;
    top: 50%;

    transform:
        translateY(-50%) rotate(45deg);

    width: 10px;
    height: 10px;

    background:
        var(--lf-green-900);
}


.lion-floating-social:hover .lion-social-tooltip {
    opacity: 1;

    visibility: visible;

    transform:
        translateY(-50%) translateX(0);
}



/* =========================================================
   LION TREE SERVICE & LANDSCAPING LLC
   OUR STORY PAGE
========================================================= */


/* =========================================================
   01. VARIABLES / GLOBAL
========================================================= */

:root {
    --story-green-950: #04170f;
    --story-green-900: #071f16;
    --story-green-800: #0b3123;
    --story-green-700: #164a35;
    --story-green-600: #286b49;

    --story-gold: #f2bf3f;
    --story-gold-dark: #d59a1c;
    --story-gold-light: #ffe194;

    --story-white: #ffffff;
    --story-soft: #f6f8f5;
    --story-soft-2: #edf2ed;

    --story-title: #11271c;
    --story-text: #536158;
    --story-border: #dde6df;
}


.lion-story-container {
    width: min(92%, 1380px);
    margin: 0 auto;
    position: relative;
    z-index: 2;
}


.lion-story-hero *,
.lion-story-intro *,
.lion-story-timeline-section *,
.lion-story-values *,
.lion-story-closing * {
    box-sizing: border-box;
}


.lion-story-hero i,
.lion-story-intro i,
.lion-story-timeline-section i,
.lion-story-values i,
.lion-story-closing i {
    position: static !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
}


/* =========================================================
   02. HERO / BREADCRUMB
========================================================= */

.lion-story-hero {
    min-height: 440px;
    padding: 105px 0 95px;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;

    background:
        linear-gradient(105deg,
            rgba(4, 23, 15, .98) 0%,
            rgba(8, 48, 33, .94) 60%,
            rgba(19, 73, 51, .90) 100%),
        url("https://images.unsplash.com/photo-1511497584788-876760111969?auto=format&fit=crop&w=2000&q=85");

    background-size: cover;
    background-position: center;
}


.lion-story-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;

    background:
        radial-gradient(circle at 75% 20%,
            rgba(242, 191, 63, .12),
            transparent 25%);
}


/* TREE RINGS */

.lion-story-hero-rings {
    width: 440px;
    height: 440px;
    position: absolute;
    right: -150px;
    bottom: -230px;
    border: 1px solid rgba(242, 191, 63, .14);
    border-radius: 50%;
    box-shadow:
        0 0 0 45px rgba(255, 255, 255, .018),
        0 0 0 90px rgba(242, 191, 63, .025),
        0 0 0 135px rgba(255, 255, 255, .014);
}


.lion-story-hero-rings::before,
.lion-story-hero-rings::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    border: 1px dashed rgba(255, 255, 255, .08);
}


.lion-story-hero-rings::before {
    inset: 60px;
}


.lion-story-hero-rings::after {
    inset: 125px;
}


/* HERO CONTENT */

.lion-story-hero-content {
    max-width: 800px;
}


.lion-story-eyebrow {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--story-gold-light);
    font-size: 14px;
    line-height: 1.4;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.4px;
}


.lion-story-eyebrow-line {
    width: 38px;
    height: 3px;
    flex: 0 0 38px;
    border-radius: 20px;
    background: var(--story-gold);
}


.lion-story-eyebrow-icon {
    width: 31px;
    height: 31px;
    min-width: 31px;
    min-height: 31px;

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

    color: var(--story-green-950);
    background: var(--story-gold);
    border-radius: 50%;
}


.lion-story-eyebrow-icon i {
    width: 14px !important;
    height: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 12px;
}


.lion-story-hero h1 {
    margin: 0 0 20px;
    color: #fff;
    font-family: "Oswald", Arial, sans-serif;
    font-size: clamp(54px, 7vw, 92px);
    line-height: .98;
    font-weight: 700;
    text-transform: uppercase;
}


.lion-story-hero h1 span {
    color: var(--story-gold);
}


.lion-story-hero-content>p {
    max-width: 700px;
    margin: 0 0 27px;
    color: rgba(255, 255, 255, .75);
    font-size: 16px;
    line-height: 1.75;
}


/* BREADCRUMB */

.lion-story-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 11px;
}


.lion-story-breadcrumb a,
.lion-story-breadcrumb>span {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: rgba(255, 255, 255, .72);
    font-size: 14px;
    line-height: 1.3;
    font-weight: 700;
}


.lion-story-breadcrumb a {
    transition: color .25s ease;
}


.lion-story-breadcrumb a:hover {
    color: var(--story-gold);
}


.lion-story-breadcrumb a i {
    color: var(--story-gold);
}


.lion-story-breadcrumb-separator {
    min-height: auto !important;
    color: rgba(255, 255, 255, .27) !important;
}


.lion-story-breadcrumb-separator i {
    font-size: 10px;
}


.lion-story-breadcrumb span[aria-current="page"] {
    color: var(--story-gold-light);
}


/* =========================================================
   03. INTRO
========================================================= */

.lion-story-intro {
    padding: 110px 0;
    position: relative;
    overflow: hidden;
    background: #fff;
}


.lion-story-intro::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;

    background:
        radial-gradient(circle at 5% 15%,
            rgba(242, 191, 63, .08),
            transparent 19%),
        radial-gradient(circle at 95% 88%,
            rgba(40, 107, 73, .05),
            transparent 22%);
}


.lion-story-intro-tree {
    position: absolute;
    right: -35px;
    bottom: -80px;
    color: rgba(15, 62, 42, .025);
    font-size: 360px;
    pointer-events: none;
}


.lion-story-intro-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(400px, .92fr);
    align-items: center;
    gap: clamp(55px, 7vw, 100px);
}


/* SECTION LABEL */

.lion-story-section-label {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--story-green-600);
    font-size: 14px;
    line-height: 1.4;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.3px;
}


.lion-story-section-label>span {
    width: 36px;
    height: 3px;
    display: block;
    background: var(--story-gold);
    border-radius: 20px;
}


.lion-story-intro h2,
.lion-story-values h2 {
    margin: 0 0 25px;
    color: var(--story-title);
    font-family: "Oswald", Arial, sans-serif;
    font-size: clamp(40px, 4.8vw, 66px);
    line-height: 1.04;
    text-transform: uppercase;
}


.lion-story-intro h2 strong,
.lion-story-values h2 strong {
    display: block;
    color: var(--story-green-600);
    font-weight: 700;
}


.lion-story-intro-copy p {
    margin: 0 0 18px;
    color: var(--story-text);
    font-size: 15px;
    line-height: 1.85;
    text-align: justify;
}


/* =========================================================
   04. INTRO PANEL
========================================================= */

.lion-story-intro-panel {
    min-height: 490px;
    padding: 35px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 18px;

    background:
        linear-gradient(145deg,
            var(--story-green-950),
            var(--story-green-700));

    box-shadow: 0 30px 70px rgba(8, 40, 27, .18);
}


.lion-story-intro-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;

    background:
        radial-gradient(circle at 90% 10%,
            rgba(242, 191, 63, .14),
            transparent 30%);
}


.lion-story-intro-panel-rings {
    width: 270px;
    height: 270px;
    position: absolute;
    right: -120px;
    top: -105px;
    border-radius: 50%;
    border: 1px solid rgba(242, 191, 63, .14);
    box-shadow:
        0 0 0 30px rgba(255, 255, 255, .018),
        0 0 0 60px rgba(242, 191, 63, .025);
}


.lion-story-intro-badge {
    margin-bottom: 28px;
    padding-bottom: 25px;
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 15px;
    border-bottom: 1px solid rgba(255, 255, 255, .10);
}


.lion-story-intro-badge-icon {
    width: 52px;
    height: 52px;
    min-width: 52px;
    min-height: 52px;
    flex: 0 0 52px;

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

    border-radius: 50%;
    color: var(--story-green-950);
    background: var(--story-gold);
}


.lion-story-intro-badge-icon i {
    width: 19px !important;
    height: 19px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 17px;
}


.lion-story-intro-badge small {
    display: block;
    margin-bottom: 3px;
    color: rgba(255, 255, 255, .53);
    font-size: 14px;
    line-height: 1.3;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
}


.lion-story-intro-badge strong {
    color: #fff;
    font-family: "Oswald", sans-serif;
    font-size: 22px;
    line-height: 1.3;
}


.lion-story-intro-facts {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;
}


.lion-story-fact {
    min-height: 130px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 11px;
    background: rgba(255, 255, 255, .045);
}


.lion-story-fact-icon {
    width: 38px;
    height: 38px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50%;
    color: var(--story-green-950);
    background: var(--story-gold);
}


.lion-story-fact-icon i {
    width: 15px !important;
    height: 15px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 13px;
}


.lion-story-fact strong {
    display: block;
    margin-top: 16px;
    color: #fff;
    font-family: "Oswald", sans-serif;
    font-size: 24px;
    line-height: 1.1;
}


.lion-story-fact span {
    display: block;
    margin-top: 3px;
    color: rgba(255, 255, 255, .58);
    font-size: 14px;
    line-height: 1.4;
}


/* =========================================================
   05. TIMELINE SECTION
========================================================= */

.lion-story-timeline-section {
    padding: 110px 0 125px;
    position: relative;
    overflow: hidden;
    background: var(--story-soft);
}


.lion-story-timeline-section::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;

    background-image:
        radial-gradient(circle at 10% 10%,
            rgba(40, 107, 73, .04),
            transparent 20%);
}


.lion-story-timeline-decoration {
    position: absolute;
    pointer-events: none;
    color: rgba(17, 66, 45, .035);
}


.lion-story-tree-left {
    left: -75px;
    top: 310px;
    font-size: 310px;
}


.lion-story-tree-right {
    right: 3%;
    bottom: 70px;
    font-size: 100px;
    transform: rotate(25deg);
}


.lion-story-timeline-heading {
    max-width: 800px;
    margin: 0 auto 75px;
    text-align: center;
}


.lion-story-section-label-center {
    justify-content: center;
}


.lion-story-timeline-heading h2 {
    margin: 0 0 18px;
    color: var(--story-title);
    font-family: "Oswald", Arial, sans-serif;
    font-size: clamp(42px, 5vw, 68px);
    line-height: 1.03;
    text-transform: uppercase;
}


.lion-story-timeline-heading h2 strong {
    display: block;
    color: var(--story-green-600);
}


.lion-story-timeline-heading p {
    max-width: 650px;
    margin: 0 auto;
    color: var(--story-text);
    font-size: 15px;
    line-height: 1.8;
}


/* =========================================================
   06. TIMELINE
========================================================= */

.lion-story-timeline {
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
}


.lion-story-timeline-line {
    width: 4px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    overflow: hidden;
    border-radius: 10px;
    background: #dce4de;
}


.lion-story-timeline-progress {
    width: 100%;
    height: 0%;
    position: absolute;
    left: 0;
    top: 0;
    background:
        linear-gradient(180deg,
            var(--story-gold),
            var(--story-green-600));
    border-radius: 20px;
    transition: height .12s linear;
}


/* STEP */

.lion-story-step {
    min-height: 300px;
    display: grid;
    grid-template-columns: 1fr 72px 1fr;
    align-items: center;
    position: relative;
}


.lion-story-step-content {
    width: 100%;
    position: relative;
    opacity: 0;
    transition:
        opacity .75s ease,
        transform .75s cubic-bezier(.22, .61, .36, 1);
}


.lion-story-step-left .lion-story-step-content {
    grid-column: 1;
    padding-right: 35px;
    transform: translateX(-45px);
}


.lion-story-step-right .lion-story-step-content {
    grid-column: 3;
    padding-left: 35px;
    transform: translateX(45px);
}


.lion-story-step.lion-story-step-visible .lion-story-step-content {
    opacity: 1;
    transform: translateX(0);
}


/* NUMBER */

.lion-story-step-number {
    position: absolute;
    top: -23px;
    color: rgba(13, 62, 42, .075);
    font-family: "Oswald", sans-serif;
    font-size: 80px;
    line-height: 1;
    font-weight: 700;
}


.lion-story-step-left .lion-story-step-number {
    right: 48px;
}


.lion-story-step-right .lion-story-step-number {
    left: 48px;
}


/* CARD */

.lion-story-step-card {
    min-height: 235px;
    padding: 27px;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--story-border);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(18, 55, 37, .07);
    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease;
}


.lion-story-step-card:hover {
    transform: translateY(-7px);
    border-color: rgba(213, 154, 28, .35);
    box-shadow: 0 27px 55px rgba(18, 55, 37, .11);
}


.lion-story-step-card::before {
    content: "";
    width: 70px;
    height: 4px;
    position: absolute;
    top: 0;
    left: 27px;
    border-radius: 0 0 20px 20px;
    background:
        linear-gradient(90deg,
            var(--story-gold-dark),
            var(--story-gold-light));
}


/* ICON */

.lion-story-step-icon {
    width: 52px;
    height: 52px;
    min-width: 52px;
    min-height: 52px;

    margin-bottom: 19px;

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

    border-radius: 50%;
    color: #fff;
    background: var(--story-green-700);
    box-shadow: 0 8px 20px rgba(10, 48, 32, .14);
}


.lion-story-step-icon i {
    width: 20px !important;
    height: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 17px;
}


.lion-story-step-label {
    display: block;
    margin-bottom: 6px;
    color: var(--story-gold-dark);
    font-size: 14px;
    line-height: 1.3;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .8px;
}


.lion-story-step-card h3 {
    margin: 0 0 12px;
    color: var(--story-title);
    font-family: "Oswald", sans-serif;
    font-size: 25px;
    line-height: 1.2;
    font-weight: 600;
}


.lion-story-step-card p {
    margin: 0;
    color: var(--story-text);
    font-size: 14px;
    line-height: 1.75;
}


/* NODE */

.lion-story-step-node {
    width: 72px;
    height: 72px;
    grid-column: 2;
    grid-row: 1;

    position: relative;
    z-index: 4;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}


.lion-story-step-node::before {
    content: "";
    width: 40px;
    height: 40px;
    position: absolute;
    border: 1px solid rgba(213, 154, 28, .30);
    border-radius: 50%;
    background: var(--story-soft);
    transition:
        background .4s ease,
        transform .4s ease;
}


.lion-story-step-node span {
    width: 14px;
    height: 14px;
    position: relative;
    z-index: 2;
    display: block;
    border-radius: 50%;
    background: #b9c7bd;
    border: 3px solid #fff;
    box-shadow: 0 0 0 2px #b9c7bd;
    transition:
        background .4s ease,
        box-shadow .4s ease,
        transform .4s ease;
}


.lion-story-step.lion-story-step-visible .lion-story-step-node::before {
    background: #fff;
    transform: scale(1.07);
}


.lion-story-step.lion-story-step-visible .lion-story-step-node span {
    background: var(--story-gold);
    box-shadow: 0 0 0 2px var(--story-gold);
    transform: scale(1.08);
}


/* =========================================================
   07. VALUES
========================================================= */

.lion-story-values {
    padding: 110px 0;
    position: relative;
    overflow: hidden;
    background: #fff;
}


.lion-story-values-rings {
    width: 350px;
    height: 350px;
    position: absolute;
    right: -160px;
    top: -130px;
    border-radius: 50%;
    border: 1px solid rgba(40, 107, 73, .07);
    box-shadow:
        0 0 0 40px rgba(40, 107, 73, .018),
        0 0 0 80px rgba(242, 191, 63, .02);
}


.lion-story-values-heading {
    margin-bottom: 50px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, .8fr);
    align-items: end;
    gap: 50px;
}


.lion-story-values-heading h2 {
    margin-bottom: 0;
}


.lion-story-values-heading>p {
    margin: 0;
    color: var(--story-text);
    font-size: 15px;
    line-height: 1.8;
}


.lion-story-values-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
}


.lion-story-value-card {
    min-height: 300px;
    padding: 28px 24px;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--story-border);
    border-radius: 13px;
    background: var(--story-soft);
    transition:
        transform .35s ease,
        background .35s ease,
        box-shadow .35s ease;
}


.lion-story-value-card:hover {
    transform: translateY(-8px);
    background: #fff;
    box-shadow: 0 25px 50px rgba(16, 54, 36, .10);
}


.lion-story-value-number {
    position: absolute;
    right: 17px;
    top: 15px;
    color: rgba(11, 49, 35, .07);
    font-family: "Oswald", sans-serif;
    font-size: 52px;
    line-height: 1;
    font-weight: 700;
}


.lion-story-value-icon {
    width: 55px;
    height: 55px;
    min-width: 55px;
    min-height: 55px;

    margin-bottom: 38px;

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

    border-radius: 50%;
    color: var(--story-green-950);
    background: var(--story-gold);
}


.lion-story-value-icon i {
    width: 21px !important;
    height: 21px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px;
}


.lion-story-value-card h3 {
    margin: 0 0 12px;
    color: var(--story-title);
    font-family: "Oswald", sans-serif;
    font-size: 24px;
    line-height: 1.2;
}


.lion-story-value-card p {
    margin: 0;
    color: var(--story-text);
    font-size: 14px;
    line-height: 1.75;
}


/* =========================================================
   08. CLOSING - NO CTA
========================================================= */

.lion-story-closing {
    padding: 0 0 100px;
    background: #fff;
}


.lion-story-closing-inner {
    padding: 40px 45px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 27px;
    border: 1px solid var(--story-border);
    border-radius: 15px;

    background:
        linear-gradient(120deg,
            #f8faf7,
            #eef3ee);
}


.lion-story-closing-icon {
    width: 83px;
    height: 83px;
    min-width: 83px;
    min-height: 83px;

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

    border-radius: 50%;
    color: #fff;
    background:
        linear-gradient(145deg,
            var(--story-green-700),
            var(--story-green-950));

    box-shadow: 0 12px 25px rgba(10, 47, 32, .14);
}


.lion-story-closing-icon i {
    width: 30px !important;
    height: 30px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 26px;
}


.lion-story-closing-small {
    display: block;
    margin-bottom: 4px;
    color: var(--story-gold-dark);
    font-size: 14px;
    line-height: 1.3;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .8px;
}


.lion-story-closing h2 {
    margin: 0 0 10px;
    color: var(--story-title);
    font-family: "Oswald", sans-serif;
    font-size: clamp(30px, 3.5vw, 46px);
    line-height: 1.1;
    text-transform: uppercase;
}


.lion-story-closing h2 strong {
    color: var(--story-green-600);
}


.lion-story-closing p {
    max-width: 850px;
    margin: 0;
    color: var(--story-text);
    font-size: 14px;
    line-height: 1.75;
}


/* =========================================================
   09. GENERAL REVEAL
========================================================= */

.lion-story-reveal {
    opacity: 0;
    transform: translateY(35px);
    transition:
        opacity .8s ease,
        transform .8s cubic-bezier(.22, .61, .36, 1);
}


.lion-story-reveal.lion-story-visible {
    opacity: 1;
    transform: translateY(0);
}


/* =========================================================
   10. TABLET
========================================================= */

@media(max-width:1050px) {

    .lion-story-intro-grid {
        grid-template-columns: 1fr 1fr;
        gap: 45px;
    }


    .lion-story-values-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}


/* =========================================================
   11. MOBILE TIMELINE
========================================================= */

@media(max-width:767px) {

    .lion-story-container {
        width: calc(100% - 28px);
    }


    .lion-story-hero {
        min-height: 390px;
        padding: 80px 0 70px;
    }


    .lion-story-hero h1 {
        font-size: clamp(52px, 16vw, 72px);
    }


    .lion-story-hero-content>p {
        font-size: 14px;
    }


    .lion-story-intro,
    .lion-story-values {
        padding: 75px 0;
    }


    .lion-story-intro-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }


    .lion-story-intro-copy p {
        font-size: 14px;
    }


    .lion-story-intro-panel {
        min-height: auto;
        padding: 25px;
    }


    .lion-story-intro-badge {
        align-items: flex-start;
    }


    .lion-story-intro-facts {
        grid-template-columns: 1fr 1fr;
    }


    /* TIMELINE */

    .lion-story-timeline-section {
        padding: 75px 0 85px;
    }


    .lion-story-timeline-heading {
        margin-bottom: 50px;
    }


    .lion-story-timeline {
        padding-left: 42px;
    }


    .lion-story-timeline-line {
        left: 15px;
        transform: none;
    }


    .lion-story-step {
        min-height: 0;
        margin-bottom: 40px;
        display: block;
        position: relative;
    }


    .lion-story-step:last-child {
        margin-bottom: 0;
    }


    .lion-story-step-content,
    .lion-story-step-left .lion-story-step-content,
    .lion-story-step-right .lion-story-step-content {
        width: 100%;
        padding: 0;
        transform: translateY(30px);
    }


    .lion-story-step.lion-story-step-visible .lion-story-step-content {
        transform: translateY(0);
    }


    .lion-story-step-node {
        width: 34px;
        height: 34px;
        position: absolute;
        left: -44px;
        top: 25px;
        display: flex !important;
    }


    .lion-story-step-node::before {
        width: 31px;
        height: 31px;
    }


    .lion-story-step-node span {
        width: 11px;
        height: 11px;
    }


    .lion-story-step-number {
        top: -17px;
        right: 20px !important;
        left: auto !important;
        font-size: 58px;
    }


    .lion-story-step-card {
        min-height: 0;
        padding: 23px;
    }


    .lion-story-step-card p {
        font-size: 14px;
    }


    /* VALUES */

    .lion-story-values-heading {
        grid-template-columns: 1fr;
        gap: 20px;
    }


    .lion-story-values-grid {
        grid-template-columns: 1fr;
    }


    .lion-story-value-card {
        min-height: 0;
    }


    /* CLOSING */

    .lion-story-closing {
        padding-bottom: 70px;
    }


    .lion-story-closing-inner {
        padding: 27px 22px;
        grid-template-columns: 1fr;
        gap: 20px;
    }


    .lion-story-closing-icon {
        width: 68px;
        height: 68px;
        min-width: 68px;
        min-height: 68px;
    }

}


/* =========================================================
   12. SMALL MOBILE
========================================================= */

@media(max-width:420px) {

    .lion-story-container {
        width: calc(100% - 20px);
    }


    .lion-story-intro-facts {
        grid-template-columns: 1fr;
    }


    .lion-story-fact {
        min-height: 105px;
    }


    .lion-story-timeline {
        padding-left: 37px;
    }


    .lion-story-step-node {
        left: -39px;
    }

}


/* =========================================================
   13. REDUCED MOTION
========================================================= */

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

    .lion-story-reveal,
    .lion-story-step-content,
    .lion-story-timeline-progress {
        transition: none !important;
    }


    .lion-story-reveal {
        opacity: 1;
        transform: none;
    }


    .lion-story-step-content {
        opacity: 1;
        transform: none !important;
    }

}


/* =========================================================
   LION TREE SERVICE & LANDSCAPING LLC
   SERVICES PAGE
========================================================= */

:root{
    --sp-green-950:#04170f;
    --sp-green-900:#071f16;
    --sp-green-800:#0b3123;
    --sp-green-700:#154a35;
    --sp-green-600:#286b49;

    --sp-gold:#f2bf3f;
    --sp-gold-dark:#d69b1d;
    --sp-gold-light:#ffe198;

    --sp-white:#ffffff;
    --sp-soft:#f5f8f5;
    --sp-soft-2:#edf2ed;

    --sp-title:#10281c;
    --sp-text:#536158;
    --sp-border:#dfe7e1;
}


/* =========================================================
   GLOBAL
========================================================= */

.lion-sp-container{
    width:min(92%,1380px);
    margin:0 auto;
    position:relative;
    z-index:3;
}


.lion-sp-hero *,
.lion-sp-intro *,
.lion-sp-services *,
.lion-sp-emergency *,
.lion-sp-process *,
.lion-sp-area *{
    box-sizing:border-box;
}


.lion-sp-hero i,
.lion-sp-intro i,
.lion-sp-services i,
.lion-sp-emergency i,
.lion-sp-process i,
.lion-sp-area i{
    position:static !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1 !important;
}


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

.lion-sp-hero{
    min-height:445px;
    padding:105px 0 95px;
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:center;

    background:
        linear-gradient(
            105deg,
            rgba(3,20,13,.98),
            rgba(8,52,36,.94) 60%,
            rgba(24,83,58,.89)
        ),
        url("https://images.unsplash.com/photo-1441974231531-c6227db76b6e?auto=format&fit=crop&w=2000&q=85");

    background-size:cover;
    background-position:center;
}


.lion-sp-hero::before{
    content:"";
    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 72% 20%,
            rgba(242,191,63,.13),
            transparent 27%
        );

    pointer-events:none;
}


.lion-sp-hero-rings{
    width:440px;
    height:440px;

    position:absolute;
    right:-145px;
    bottom:-225px;

    border-radius:50%;
    border:1px solid rgba(242,191,63,.14);

    box-shadow:
        0 0 0 45px rgba(255,255,255,.016),
        0 0 0 90px rgba(242,191,63,.023),
        0 0 0 135px rgba(255,255,255,.012);
}


.lion-sp-hero-rings::before,
.lion-sp-hero-rings::after{
    content:"";
    position:absolute;
    border-radius:50%;
    border:1px dashed rgba(255,255,255,.08);
}

.lion-sp-hero-rings::before{
    inset:58px;
}

.lion-sp-hero-rings::after{
    inset:125px;
}


.lion-sp-hero-tree{
    position:absolute;
    right:10%;
    bottom:-80px;
    color:rgba(255,255,255,.025);
    font-size:330px;
}


.lion-sp-hero-content{
    max-width:820px;
}


.lion-sp-eyebrow{
    margin-bottom:15px;
    display:flex;
    align-items:center;
    gap:10px;
    color:var(--sp-gold-light);
    font-size:14px;
    line-height:1.4;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:1.3px;
}


.lion-sp-eyebrow-line{
    width:38px;
    height:3px;
    flex:0 0 38px;
    border-radius:20px;
    background:var(--sp-gold);
}


.lion-sp-eyebrow-icon{
    width:31px;
    height:31px;
    min-width:31px;
    min-height:31px;

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

    border-radius:50%;

    color:var(--sp-green-950);
    background:var(--sp-gold);
}


.lion-sp-eyebrow-icon i{
    width:14px !important;
    height:14px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:12px;
}


.lion-sp-hero h1{
    margin:0 0 19px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;
    font-size:clamp(55px,7vw,93px);
    line-height:.98;
    font-weight:700;
    text-transform:uppercase;
}


.lion-sp-hero h1 span{
    color:var(--sp-gold);
}


.lion-sp-hero-content > p{
    max-width:710px;
    margin:0 0 27px;

    color:rgba(255,255,255,.74);

    font-size:16px;
    line-height:1.75;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.lion-sp-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:11px;
}


.lion-sp-breadcrumb a,
.lion-sp-breadcrumb > span{
    min-height:38px;

    display:inline-flex;
    align-items:center;
    gap:8px;

    color:rgba(255,255,255,.70);

    font-size:14px;
    line-height:1.3;
    font-weight:700;
}


.lion-sp-breadcrumb a i{
    color:var(--sp-gold);
}


.lion-sp-breadcrumb a:hover{
    color:var(--sp-gold-light);
}


.lion-sp-breadcrumb-divider{
    min-height:auto !important;
    color:rgba(255,255,255,.30) !important;
}


.lion-sp-breadcrumb-divider i{
    font-size:10px;
}


.lion-sp-breadcrumb span[aria-current="page"]{
    color:var(--sp-gold-light);
}


/* =========================================================
   SECTION LABEL
========================================================= */

.lion-sp-section-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;
    gap:10px;

    color:var(--sp-green-600);

    font-size:14px;
    line-height:1.4;
    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-sp-section-label > span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:var(--sp-gold);
}


.lion-sp-section-label-center{
    justify-content:center;
}


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

.lion-sp-intro{
    padding:110px 0;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-sp-intro::before{
    content:"";
    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 5% 15%,
            rgba(242,191,63,.08),
            transparent 20%
        );

    pointer-events:none;
}


.lion-sp-intro-rings{
    width:330px;
    height:330px;

    position:absolute;
    left:-170px;
    bottom:-150px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 45px rgba(40,107,73,.018),
        0 0 0 90px rgba(242,191,63,.02);
}


.lion-sp-intro-grid{
    display:grid;

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

    align-items:center;

    gap:clamp(50px,7vw,95px);
}


.lion-sp-intro-copy h2,
.lion-sp-process-heading h2,
.lion-sp-area-copy h2{
    margin:0 0 25px;

    color:var(--sp-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.6vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-sp-intro-copy h2 strong,
.lion-sp-process-heading h2 strong,
.lion-sp-area-copy h2 strong{
    display:block;

    color:var(--sp-green-600);
}


.lion-sp-intro-copy p{
    margin:0 0 18px;

    color:var(--sp-text);

    font-size:15px;
    line-height:1.85;

    text-align:justify;
}


/* =========================================================
   INTRO INFO PANEL
========================================================= */

.lion-sp-intro-info{
    padding:34px;

    position:relative;
    overflow:hidden;

    border-radius:18px;

    background:
        linear-gradient(
            145deg,
            var(--sp-green-950),
            var(--sp-green-700)
        );

    box-shadow:
        0 30px 70px
        rgba(8,40,27,.18);
}


.lion-sp-intro-info::before{
    content:"";

    width:260px;
    height:260px;

    position:absolute;

    right:-120px;
    top:-120px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.14);

    box-shadow:
        0 0 0 30px rgba(255,255,255,.018),
        0 0 0 60px rgba(242,191,63,.025);
}


.lion-sp-info-top{
    padding-bottom:25px;
    margin-bottom:22px;

    position:relative;
    z-index:2;

    display:flex;
    align-items:center;

    gap:14px;

    border-bottom:1px solid rgba(255,255,255,.10);
}


.lion-sp-info-main-icon{
    width:55px;
    height:55px;

    min-width:55px;
    min-height:55px;

    flex:0 0 55px;

    display:flex !important;

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

    border-radius:50%;

    color:var(--sp-green-950);

    background:var(--sp-gold);
}


.lion-sp-info-main-icon i{
    width:20px !important;
    height:20px !important;

    display:flex !important;

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

    font-size:18px;
}


.lion-sp-info-top small{
    display:block;

    margin-bottom:3px;

    color:rgba(255,255,255,.55);

    font-size:14px;

    text-transform:uppercase;

    letter-spacing:.5px;
}


.lion-sp-info-top strong{
    color:#fff;

    font-family:"Oswald",sans-serif;

    font-size:22px;
    line-height:1.25;
}


.lion-sp-info-grid{
    position:relative;
    z-index:2;

    display:grid;

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

    gap:12px;
}


.lion-sp-info-item{
    min-height:125px;

    padding:17px;

    display:flex;
    flex-direction:column;

    justify-content:space-between;

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

    border-radius:11px;

    background:rgba(255,255,255,.045);
}


.lion-sp-info-icon{
    width:38px;
    height:38px;

    min-width:38px;
    min-height:38px;

    display:flex !important;

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

    border-radius:50%;

    color:var(--sp-green-950);

    background:var(--sp-gold);
}


.lion-sp-info-icon i{
    width:15px !important;
    height:15px !important;

    display:flex !important;

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

    font-size:13px;
}


.lion-sp-info-item strong{
    display:block;

    margin-top:14px;

    color:#fff;

    font-family:"Oswald",sans-serif;

    font-size:24px;
    line-height:1.1;
}


.lion-sp-info-item span{
    display:block;

    margin-top:4px;

    color:rgba(255,255,255,.58);

    font-size:14px;
    line-height:1.4;
}


/* =========================================================
   SERVICES
========================================================= */

.lion-sp-services{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:var(--sp-soft);
}


.lion-sp-services::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 7% 15%,
            rgba(40,107,73,.04),
            transparent 20%
        ),

        radial-gradient(
            circle at 90% 80%,
            rgba(242,191,63,.06),
            transparent 23%
        );
}


.lion-sp-services-tree{
    position:absolute;

    color:rgba(10,50,34,.03);

    pointer-events:none;
}


.lion-sp-tree-left{
    left:-55px;
    top:340px;

    font-size:290px;
}


.lion-sp-tree-right{
    right:3%;
    bottom:100px;

    font-size:100px;

    transform:rotate(24deg);
}


.lion-sp-services-heading{
    max-width:810px;

    margin:0 auto 55px;

    text-align:center;
}


.lion-sp-services-heading h2{
    margin:0 0 17px;

    color:var(--sp-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(42px,5vw,68px);

    line-height:1.03;

    text-transform:uppercase;
}


.lion-sp-services-heading h2 strong{
    display:block;

    color:var(--sp-green-600);
}


.lion-sp-services-heading p{
    max-width:650px;

    margin:0 auto;

    color:var(--sp-text);

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


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

.lion-sp-services-grid{
    display:grid;

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

    gap:20px;
}


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

.lion-sp-service-card{
    min-width:0;

    overflow:hidden;

    display:flex;
    flex-direction:column;

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

    border-radius:16px;

    background:#fff;

    box-shadow:
        0 18px 42px
        rgba(16,53,36,.065);

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


.lion-sp-service-card:hover{
    transform:translateY(-9px);

    border-color:
        rgba(214,155,29,.35);

    box-shadow:
        0 29px 60px
        rgba(16,53,36,.12);
}


/* IMAGE */

.lion-sp-service-image{
    height:245px;

    position:relative;

    overflow:hidden;

    background-size:cover;
    background-position:center;

    transition:
        background-size .4s ease;
}


.lion-sp-service-image::before{
    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(4,23,15,.08),
            rgba(4,23,15,.72)
        );
}


.lion-sp-service-card:hover
.lion-sp-service-image{
    background-size:auto 108%;
}


/* NUMBER */

.lion-sp-service-number{
    position:absolute;

    top:18px;
    right:18px;

    z-index:2;

    color:rgba(255,255,255,.75);

    font-family:"Oswald",sans-serif;

    font-size:28px;
    line-height:1;

    font-weight:700;
}


/* ICON */

.lion-sp-service-icon{
    width:58px;
    height:58px;

    min-width:58px;
    min-height:58px;

    position:absolute;

    left:22px;
    bottom:20px;

    z-index:3;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--sp-green-950);

    background:
        linear-gradient(
            145deg,
            var(--sp-gold-light),
            var(--sp-gold)
        );

    box-shadow:
        0 10px 25px
        rgba(0,0,0,.20);
}


.lion-sp-service-icon i{
    width:22px !important;
    height:22px !important;

    display:flex !important;

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

    font-size:19px;
}


/* EMERGENCY LABEL */

.lion-sp-emergency-tag{
    min-height:32px;

    padding:0 10px;

    position:absolute;

    top:17px;
    left:17px;

    z-index:3;

    display:flex;

    align-items:center;

    gap:7px;

    border-radius:20px;

    color:var(--sp-green-950);

    background:var(--sp-gold);

    font-size:14px;
    line-height:1;

    font-weight:800;
}


.lion-sp-emergency-tag i{
    font-size:11px;
}


/* CONTENT */

.lion-sp-service-content{
    flex:1;

    padding:25px;

    display:flex;
    flex-direction:column;
}


.lion-sp-service-category{
    margin-bottom:7px;

    color:var(--sp-gold-dark);

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

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.7px;
}


.lion-sp-service-content h3{
    margin:0 0 13px;

    color:var(--sp-title);

    font-family:"Oswald",sans-serif;

    font-size:28px;
    line-height:1.15;

    font-weight:600;
}


.lion-sp-service-content > p{
    margin:0 0 19px;

    color:var(--sp-text);

    font-size:14px;
    line-height:1.75;
}


/* FEATURES */

.lion-sp-service-features{
    margin-bottom:22px;

    display:flex;

    flex-direction:column;

    gap:8px;
}


.lion-sp-service-features span{
    display:flex;

    align-items:center;

    gap:8px;

    color:#647168;

    font-size:14px;
    line-height:1.4;

    font-weight:600;
}


.lion-sp-service-features span i{
    width:19px !important;
    height:19px !important;

    min-width:19px;

    display:flex !important;

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

    border-radius:50%;

    color:var(--sp-green-700);

    background:
        rgba(40,107,73,.09);

    font-size:9px;
}


/* LINK */

.lion-sp-service-link{
    margin-top:auto;

    padding-top:18px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:12px;

    border-top:
        1px solid #e7ece8;

    color:var(--sp-green-700);

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

    font-weight:800;
}


.lion-sp-service-link > span{
    width:37px;
    height:37px;

    min-width:37px;
    min-height:37px;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:#fff;

    background:var(--sp-green-700);

    transition:
        background .3s ease,
        transform .3s ease;
}


.lion-sp-service-link > span i{
    width:14px !important;
    height:14px !important;

    display:flex !important;

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

    font-size:11px;
}


.lion-sp-service-link:hover > span{
    color:var(--sp-green-950);

    background:var(--sp-gold);

    transform:translateX(4px);
}


/* LAST CARD */

.lion-sp-service-wide{
    grid-column:2;
}


/* =========================================================
   EMERGENCY SECTION
========================================================= */

.lion-sp-emergency{
    padding:100px 0;

    position:relative;
    overflow:hidden;

    color:#fff;

    background:
        linear-gradient(
            115deg,
            var(--sp-green-950),
            var(--sp-green-700)
        );
}


.lion-sp-emergency::before{
    content:"";

    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 90% 20%,
            rgba(242,191,63,.11),
            transparent 25%
        );

    pointer-events:none;
}


.lion-sp-emergency-rings{
    width:420px;
    height:420px;

    position:absolute;

    right:-160px;
    bottom:-235px;

    border-radius:50%;

    border:
        1px solid
        rgba(242,191,63,.14);

    box-shadow:
        0 0 0 40px rgba(255,255,255,.015),
        0 0 0 80px rgba(242,191,63,.025),
        0 0 0 120px rgba(255,255,255,.012);
}


.lion-sp-emergency-grid{
    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        minmax(440px,.9fr);

    align-items:center;

    gap:70px;
}


.lion-sp-dark-label{
    margin-bottom:15px;

    display:flex;

    align-items:center;

    gap:10px;

    color:var(--sp-gold-light);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-sp-dark-label span{
    width:36px;
    height:3px;

    display:block;

    background:var(--sp-gold);

    border-radius:20px;
}


.lion-sp-emergency-copy h2{
    margin:0 0 20px;

    color:#fff;

    font-family:"Oswald",sans-serif;

    font-size:clamp(40px,4.7vw,64px);

    line-height:1.04;

    text-transform:uppercase;
}


.lion-sp-emergency-copy h2 strong{
    display:block;

    color:var(--sp-gold);
}


.lion-sp-emergency-copy p{
    max-width:680px;

    margin:0;

    color:rgba(255,255,255,.68);

    font-size:15px;

    line-height:1.8;
}


/* FEATURES */

.lion-sp-emergency-features{
    display:flex;

    flex-direction:column;

    gap:11px;
}


.lion-sp-emergency-feature{
    padding:18px;

    display:flex;

    align-items:flex-start;

    gap:15px;

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

    border-radius:11px;

    background:
        rgba(255,255,255,.045);
}


.lion-sp-emergency-feature > span{
    width:45px;
    height:45px;

    min-width:45px;
    min-height:45px;

    flex:0 0 45px;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--sp-green-950);

    background:var(--sp-gold);
}


.lion-sp-emergency-feature > span i{
    width:17px !important;
    height:17px !important;

    display:flex !important;

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

    font-size:14px;
}


.lion-sp-emergency-feature strong{
    display:block;

    margin-bottom:5px;

    color:#fff;

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


.lion-sp-emergency-feature p{
    margin:0;

    color:rgba(255,255,255,.60);

    font-size:14px;
    line-height:1.6;
}


/* =========================================================
   PROCESS
========================================================= */

.lion-sp-process{
    padding:110px 0;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-sp-process-tree{
    position:absolute;

    left:-50px;
    bottom:-95px;

    color:rgba(12,55,37,.025);

    font-size:330px;

    pointer-events:none;
}


.lion-sp-process-heading{
    max-width:780px;

    margin:0 auto 60px;

    text-align:center;
}


.lion-sp-process-heading h2{
    margin-bottom:0;
}


.lion-sp-process-grid{
    display:grid;

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

    gap:0;

    position:relative;
}


.lion-sp-process-step{
    min-height:275px;

    padding:25px 28px;

    position:relative;

    text-align:center;
}


.lion-sp-process-number{
    position:absolute;

    top:10px;
    right:22px;

    color:
        rgba(12,56,38,.065);

    font-family:"Oswald",sans-serif;

    font-size:55px;
    line-height:1;

    font-weight:700;
}


.lion-sp-process-icon{
    width:70px;
    height:70px;

    min-width:70px;
    min-height:70px;

    margin:0 auto 22px;

    position:relative;
    z-index:2;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--sp-green-950);

    background:var(--sp-gold);

    box-shadow:
        0 12px 25px
        rgba(214,155,29,.17);
}


.lion-sp-process-icon i{
    width:25px !important;
    height:25px !important;

    display:flex !important;

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

    font-size:20px;
}


.lion-sp-process-step h3{
    margin:0 0 11px;

    color:var(--sp-title);

    font-family:"Oswald",sans-serif;

    font-size:25px;
    line-height:1.2;
}


.lion-sp-process-step p{
    margin:0;

    color:var(--sp-text);

    font-size:14px;
    line-height:1.7;
}


.lion-sp-process-line{
    width:calc(100% - 80px);
    height:1px;

    position:absolute;

    top:60px;
    left:calc(50% + 47px);

    z-index:0;

    background:
        repeating-linear-gradient(
            90deg,
            #cfdbd3 0 6px,
            transparent 6px 12px
        );
}


/* =========================================================
   SERVICE AREA
========================================================= */

.lion-sp-area{
    padding:100px 0;

    position:relative;
    overflow:hidden;

    background:var(--sp-soft);
}


.lion-sp-area-grid{
    display:grid;

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

    align-items:center;

    gap:70px;
}


/* MAP VISUAL */

.lion-sp-area-visual{
    min-height:480px;

    position:relative;

    display:flex;

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

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

    border-radius:18px;

    background:
        linear-gradient(
            145deg,
            #fff,
            #edf3ee
        );

    overflow:hidden;
}


.lion-sp-area-visual::before{
    content:"";

    position:absolute;
    inset:0;

    opacity:.27;

    background-image:
        linear-gradient(
            rgba(30,86,59,.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(30,86,59,.08) 1px,
            transparent 1px
        );

    background-size:35px 35px;
}


.lion-sp-area-rings{
    width:380px;
    height:380px;

    position:relative;

    display:flex;

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


.lion-sp-area-ring{
    position:absolute;

    border-radius:50%;

    border:
        1px solid
        rgba(40,107,73,.18);
}


.lion-sp-area-ring-1{
    inset:0;
}


.lion-sp-area-ring-2{
    inset:55px;

    border-style:dashed;

    border-color:
        rgba(214,155,29,.27);
}


.lion-sp-area-ring-3{
    inset:110px;

    border-color:
        rgba(40,107,73,.23);
}


.lion-sp-area-center{
    width:140px;
    height:140px;

    position:relative;
    z-index:3;

    display:flex;

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

    flex-direction:column;

    border-radius:50%;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            var(--sp-green-700),
            var(--sp-green-950)
        );

    box-shadow:
        0 18px 35px
        rgba(10,50,34,.20);
}


.lion-sp-area-center i{
    margin-bottom:8px !important;

    color:var(--sp-gold);

    font-size:23px;
}


.lion-sp-area-center strong{
    font-family:"Oswald",sans-serif;

    font-size:21px;
    line-height:1.2;
}


.lion-sp-area-center span{
    margin-top:3px;

    color:rgba(255,255,255,.63);

    font-size:14px;
}


.lion-sp-area-distance{
    position:absolute;

    bottom:25px;

    z-index:4;

    min-height:36px;

    padding:0 14px;

    display:flex;

    align-items:center;

    border-radius:20px;

    color:var(--sp-green-800);

    background:var(--sp-gold);

    font-size:14px;

    font-weight:800;
}


/* COPY */

.lion-sp-area-copy > p{
    margin:0 0 25px;

    color:var(--sp-text);

    font-size:15px;

    line-height:1.8;
}


.lion-sp-area-details{
    display:flex;

    flex-direction:column;

    gap:10px;
}


.lion-sp-area-details > div{
    min-height:75px;

    padding:13px;

    display:flex;

    align-items:center;

    gap:13px;

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

    border-radius:9px;

    background:#fff;
}


.lion-sp-area-details > div > span{
    width:43px;
    height:43px;

    min-width:43px;
    min-height:43px;

    flex:0 0 43px;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--sp-green-950);

    background:var(--sp-gold);
}


.lion-sp-area-details > div > span i{
    width:17px !important;
    height:17px !important;

    display:flex !important;

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

    font-size:14px;
}


.lion-sp-area-details p{
    margin:0;
}


.lion-sp-area-details small{
    display:block;

    margin-bottom:2px;

    color:#89968e;

    font-size:14px;
    line-height:1.3;
}


.lion-sp-area-details strong{
    color:var(--sp-title);

    font-size:15px;
    line-height:1.3;
}


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

.lion-sp-reveal{
    opacity:0;

    transform:translateY(35px);

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


.lion-sp-reveal.lion-sp-visible{
    opacity:1;

    transform:translateY(0);
}


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

@media(max-width:1050px){

    .lion-sp-intro-grid,
    .lion-sp-emergency-grid,
    .lion-sp-area-grid{
        grid-template-columns:1fr 1fr;
        gap:45px;
    }


    .lion-sp-services-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .lion-sp-service-wide{
        grid-column:auto;
    }


    .lion-sp-process-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .lion-sp-process-line{
        display:none;
    }

}


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

@media(max-width:767px){

    .lion-sp-container{
        width:calc(100% - 28px);
    }


    .lion-sp-hero{
        min-height:390px;

        padding:78px 0 68px;
    }


    .lion-sp-hero h1{
        font-size:
            clamp(52px,16vw,72px);
    }


    .lion-sp-hero-content > p{
        font-size:14px;
    }


    .lion-sp-intro,
    .lion-sp-services,
    .lion-sp-process,
    .lion-sp-area{
        padding:75px 0;
    }


    .lion-sp-emergency{
        padding:75px 0;
    }


    .lion-sp-intro-grid,
    .lion-sp-emergency-grid,
    .lion-sp-area-grid{
        grid-template-columns:1fr;

        gap:40px;
    }


    .lion-sp-intro-copy p,
    .lion-sp-services-heading p,
    .lion-sp-emergency-copy p,
    .lion-sp-area-copy > p{
        font-size:14px;
    }


    .lion-sp-intro-info{
        padding:24px;
    }


    .lion-sp-info-grid{
        grid-template-columns:1fr 1fr;
    }


    /* SERVICES */

    .lion-sp-services-grid{
        grid-template-columns:1fr;
    }


    .lion-sp-service-image{
        height:230px;
    }


    .lion-sp-service-content{
        padding:22px;
    }


    /* EMERGENCY */

    .lion-sp-emergency-feature p{
        font-size:14px;
    }


    /* PROCESS */

    .lion-sp-process-grid{
        grid-template-columns:1fr;
    }


    .lion-sp-process-step{
        min-height:0;

        padding:25px 20px 35px;
    }


    /* AREA */

    .lion-sp-area-visual{
        min-height:390px;
    }


    .lion-sp-area-rings{
        width:310px;
        height:310px;
    }


    .lion-sp-area-ring-2{
        inset:45px;
    }


    .lion-sp-area-ring-3{
        inset:90px;
    }

}


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

@media(max-width:420px){

    .lion-sp-container{
        width:calc(100% - 20px);
    }


    .lion-sp-info-grid{
        grid-template-columns:1fr;
    }


    .lion-sp-info-item{
        min-height:105px;
    }


    .lion-sp-area-rings{
        width:280px;
        height:280px;
    }


    .lion-sp-area-ring-2{
        inset:40px;
    }


    .lion-sp-area-ring-3{
        inset:80px;
    }


    .lion-sp-area-center{
        width:120px;
        height:120px;
    }

}


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

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

    .lion-sp-reveal,
    .lion-sp-service-card{
        transition:none !important;
    }


    .lion-sp-reveal{
        opacity:1;
        transform:none;
    }

}

/* =========================================================
   LION TREE SERVICE & LANDSCAPING LLC
   TREE SERVICE PAGE
========================================================= */

:root{
    --ts-green-950:#04170f;
    --ts-green-900:#071f16;
    --ts-green-800:#0b3123;
    --ts-green-700:#164a35;
    --ts-green-600:#286b49;

    --ts-gold:#f2bf3f;
    --ts-gold-dark:#d69a1b;
    --ts-gold-light:#ffe198;

    --ts-white:#ffffff;
    --ts-soft:#f5f8f5;
    --ts-soft-2:#edf2ed;

    --ts-title:#10271c;
    --ts-text:#526158;
    --ts-border:#dfe7e1;
}


/* =========================================================
   GLOBAL
========================================================= */

.lion-ts-container{
    width:min(92%,1380px);
    margin:0 auto;
    position:relative;
    z-index:3;
}


.lion-ts-hero *,
.lion-ts-intro *,
.lion-ts-solutions *,
.lion-ts-property *,
.lion-ts-process *,
.lion-ts-benefits *,
.lion-ts-related *,
.lion-ts-faq *,
.lion-ts-closing *{
    box-sizing:border-box;
}


.lion-ts-hero i,
.lion-ts-intro i,
.lion-ts-solutions i,
.lion-ts-property i,
.lion-ts-process i,
.lion-ts-benefits i,
.lion-ts-related i,
.lion-ts-faq i,
.lion-ts-closing i{
    position:static !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1 !important;
}


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

.lion-ts-hero{
    min-height:445px;
    padding:105px 0 95px;

    position:relative;
    overflow:hidden;

    display:flex;
    align-items:center;

    background:
        linear-gradient(
            105deg,
            rgba(3,20,13,.98),
            rgba(7,49,34,.94) 60%,
            rgba(23,82,57,.90)
        ),
        url("https://images.unsplash.com/photo-1448375240586-882707db888b?auto=format&fit=crop&w=2000&q=85");

    background-size:cover;
    background-position:center;
}


.lion-ts-hero::before{
    content:"";
    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 72% 15%,
            rgba(242,191,63,.13),
            transparent 27%
        );

    pointer-events:none;
}


.lion-ts-hero-rings{
    width:450px;
    height:450px;

    position:absolute;

    right:-155px;
    bottom:-230px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.14);

    box-shadow:
        0 0 0 45px rgba(255,255,255,.016),
        0 0 0 90px rgba(242,191,63,.024),
        0 0 0 135px rgba(255,255,255,.012);
}


.lion-ts-hero-rings::before,
.lion-ts-hero-rings::after{
    content:"";
    position:absolute;

    border-radius:50%;

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


.lion-ts-hero-rings::before{
    inset:60px;
}


.lion-ts-hero-rings::after{
    inset:128px;
}


.lion-ts-hero-tree{
    position:absolute;

    right:8%;
    bottom:-90px;

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

    font-size:350px;

    pointer-events:none;
}


.lion-ts-hero-content{
    max-width:820px;
}


.lion-ts-eyebrow{
    margin-bottom:15px;

    display:flex;

    align-items:center;

    gap:10px;

    color:var(--ts-gold-light);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.3px;
}


.lion-ts-eyebrow-line{
    width:38px;
    height:3px;

    flex:0 0 38px;

    border-radius:20px;

    background:var(--ts-gold);
}


.lion-ts-eyebrow-icon{
    width:31px;
    height:31px;

    min-width:31px;
    min-height:31px;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--ts-green-950);

    background:var(--ts-gold);
}


.lion-ts-eyebrow-icon i{
    width:14px !important;
    height:14px !important;

    display:flex !important;

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

    font-size:12px;
}


.lion-ts-hero h1{
    margin:0 0 19px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(55px,7vw,93px);

    line-height:.98;

    font-weight:700;

    text-transform:uppercase;
}


.lion-ts-hero h1 span{
    color:var(--ts-gold);
}


.lion-ts-hero-content > p{
    max-width:710px;

    margin:0 0 28px;

    color:rgba(255,255,255,.74);

    font-size:16px;
    line-height:1.75;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.lion-ts-breadcrumb{
    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:11px;
}


.lion-ts-breadcrumb a,
.lion-ts-breadcrumb > span{
    min-height:38px;

    display:inline-flex;

    align-items:center;

    gap:8px;

    color:rgba(255,255,255,.69);

    font-size:14px;

    line-height:1.3;

    font-weight:700;
}


.lion-ts-breadcrumb a{
    transition:color .25s ease;
}


.lion-ts-breadcrumb a:hover{
    color:var(--ts-gold-light);
}


.lion-ts-breadcrumb a i{
    color:var(--ts-gold);
}


.lion-ts-breadcrumb-divider{
    min-height:auto !important;

    color:
        rgba(255,255,255,.28) !important;
}


.lion-ts-breadcrumb-divider i{
    font-size:10px;
}


.lion-ts-breadcrumb
span[aria-current="page"]{
    color:var(--ts-gold-light);
}


/* =========================================================
   SECTION LABEL
========================================================= */

.lion-ts-section-label{
    margin-bottom:15px;

    display:flex;

    align-items:center;

    gap:10px;

    color:var(--ts-green-600);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.2px;
}


.lion-ts-section-label > span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:var(--ts-gold);
}


.lion-ts-section-label-center{
    justify-content:center;
}


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

.lion-ts-intro{
    padding:110px 0;

    position:relative;

    overflow:hidden;

    background:#fff;
}


.lion-ts-intro::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 6% 15%,
            rgba(242,191,63,.075),
            transparent 20%
        ),

        radial-gradient(
            circle at 94% 80%,
            rgba(40,107,73,.045),
            transparent 23%
        );
}


.lion-ts-intro-rings{
    width:340px;
    height:340px;

    position:absolute;

    right:-175px;
    bottom:-150px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 45px rgba(40,107,73,.018),
        0 0 0 90px rgba(242,191,63,.02);
}


.lion-ts-intro-grid{
    display:grid;

    grid-template-columns:
        minmax(420px,.92fr)
        minmax(0,1.08fr);

    align-items:center;

    gap:clamp(55px,7vw,100px);
}


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

.lion-ts-intro-visual{
    min-height:620px;

    position:relative;
}


.lion-ts-main-image{
    width:82%;
    height:540px;

    position:absolute;

    left:0;
    top:0;

    overflow:hidden;

    border-radius:16px;

    box-shadow:
        0 28px 60px
        rgba(13,52,35,.15);
}


.lion-ts-main-image img,
.lion-ts-secondary-image img{
    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

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


.lion-ts-main-image:hover img,
.lion-ts-secondary-image:hover img{
    transform:scale(1.05);
}


.lion-ts-secondary-image{
    width:47%;
    height:260px;

    position:absolute;

    right:0;
    bottom:0;

    overflow:hidden;

    border:7px solid #fff;

    border-radius:14px;

    box-shadow:
        0 20px 45px
        rgba(13,52,35,.14);
}


.lion-ts-visual-badge{
    min-width:220px;

    min-height:78px;

    padding:14px 16px;

    position:absolute;

    left:35px;
    bottom:35px;

    z-index:5;

    display:flex;

    align-items:center;

    gap:12px;

    border-radius:10px;

    color:#fff;

    background:
        linear-gradient(
            120deg,
            var(--ts-green-950),
            var(--ts-green-700)
        );

    box-shadow:
        0 18px 40px
        rgba(0,0,0,.22);
}


.lion-ts-visual-badge > span{
    width:42px;
    height:42px;

    min-width:42px;
    min-height:42px;

    flex:0 0 42px;

    display:flex !important;

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

    border-radius:50%;

    color:var(--ts-green-950);

    background:var(--ts-gold);
}


.lion-ts-visual-badge > span i{
    width:17px !important;
    height:17px !important;

    display:flex !important;

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

    font-size:14px;
}


.lion-ts-visual-badge small{
    display:block;

    color:rgba(255,255,255,.58);

    font-size:14px;

    line-height:1.3;
}


.lion-ts-visual-badge strong{
    display:block;

    margin-top:2px;

    color:#fff;

    font-family:"Oswald",sans-serif;

    font-size:20px;

    line-height:1.2;
}


.lion-ts-tree-ring-decoration{
    width:180px;
    height:180px;

    position:absolute;

    right:20px;
    top:25px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.20);

    box-shadow:
        0 0 0 22px rgba(242,191,63,.03),
        0 0 0 44px rgba(40,107,73,.025);

    z-index:-1;
}


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

.lion-ts-intro-copy h2,
.lion-ts-benefits-heading h2,
.lion-ts-faq-heading h2{
    margin:0 0 25px;

    color:var(--ts-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.6vw,64px);

    line-height:1.04;

    text-transform:uppercase;
}


.lion-ts-intro-copy h2 strong,
.lion-ts-benefits-heading h2 strong,
.lion-ts-faq-heading h2 strong{
    display:block;

    color:var(--ts-green-600);
}


.lion-ts-intro-copy > p{
    margin:0 0 18px;

    color:var(--ts-text);

    font-size:15px;

    line-height:1.85;

    text-align:justify;
}


.lion-ts-intro-features{
    margin-top:28px;

    display:grid;

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

    gap:10px;
}


.lion-ts-intro-features > div{
    min-height:52px;

    padding:10px 12px;

    display:flex;

    align-items:center;

    gap:10px;

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

    border-radius:8px;

    color:#56665c;

    background:var(--ts-soft);

    font-size:14px;

    font-weight:700;
}


.lion-ts-intro-features > div > span{
    width:25px;
    height:25px;

    min-width:25px;
    min-height:25px;

    display:flex !important;

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

    border-radius:50%;

    color:var(--ts-green-700);

    background:rgba(40,107,73,.09);
}


.lion-ts-intro-features > div > span i{
    width:11px !important;
    height:11px !important;

    display:flex !important;

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

    font-size:9px;
}


/* =========================================================
   SOLUTIONS
========================================================= */

.lion-ts-solutions{
    padding:110px 0 120px;

    position:relative;

    overflow:hidden;

    background:var(--ts-soft);
}


.lion-ts-solutions::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 10% 10%,
            rgba(40,107,73,.04),
            transparent 21%
        ),

        radial-gradient(
            circle at 92% 85%,
            rgba(242,191,63,.055),
            transparent 23%
        );
}


.lion-ts-solutions-tree{
    position:absolute;

    pointer-events:none;

    color:
        rgba(11,54,37,.03);
}


.lion-ts-tree-left{
    left:-70px;

    top:300px;

    font-size:310px;
}


.lion-ts-leaf-right{
    right:4%;

    bottom:80px;

    font-size:110px;

    transform:rotate(25deg);
}


.lion-ts-solutions-heading{
    max-width:820px;

    margin:0 auto 55px;

    text-align:center;
}


.lion-ts-solutions-heading h2,
.lion-ts-process-heading h2,
.lion-ts-related-heading h2{
    margin:0 0 18px;

    color:var(--ts-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(42px,5vw,68px);

    line-height:1.03;

    text-transform:uppercase;
}


.lion-ts-solutions-heading h2 strong,
.lion-ts-process-heading h2 strong,
.lion-ts-related-heading h2 strong{
    display:block;

    color:var(--ts-green-600);
}


.lion-ts-solutions-heading p,
.lion-ts-process-heading p{
    max-width:660px;

    margin:0 auto;

    color:var(--ts-text);

    font-size:15px;

    line-height:1.8;
}


/* =========================================================
   SOLUTION CARDS
========================================================= */

.lion-ts-solutions-grid{
    display:grid;

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

    gap:18px;
}


.lion-ts-solution-card{
    min-height:300px;

    padding:28px 25px;

    position:relative;

    overflow:hidden;

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

    border-radius:14px;

    background:#fff;

    box-shadow:
        0 18px 42px
        rgba(16,53,36,.06);

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


.lion-ts-solution-card:hover{
    transform:translateY(-8px);

    border-color:
        rgba(214,154,27,.36);

    box-shadow:
        0 27px 55px
        rgba(16,53,36,.11);
}


.lion-ts-solution-card::before{
    content:"";

    width:78px;
    height:4px;

    position:absolute;

    top:0;
    left:25px;

    border-radius:
        0 0 15px 15px;

    background:
        linear-gradient(
            90deg,
            var(--ts-gold-dark),
            var(--ts-gold-light)
        );
}


.lion-ts-card-number{
    position:absolute;

    top:17px;
    right:18px;

    color:
        rgba(9,49,33,.065);

    font-family:"Oswald",sans-serif;

    font-size:55px;

    line-height:1;

    font-weight:700;
}


.lion-ts-solution-icon{
    width:58px;
    height:58px;

    min-width:58px;
    min-height:58px;

    margin-bottom:35px;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--ts-green-950);

    background:
        linear-gradient(
            145deg,
            var(--ts-gold-light),
            var(--ts-gold)
        );
}


.lion-ts-solution-icon i{
    width:22px !important;
    height:22px !important;

    display:flex !important;

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

    font-size:18px;
}


.lion-ts-solution-card h3{
    margin:0 0 13px;

    color:var(--ts-title);

    font-family:"Oswald",sans-serif;

    font-size:26px;

    line-height:1.2;
}


.lion-ts-solution-card p{
    margin:0;

    color:var(--ts-text);

    font-size:14px;

    line-height:1.75;
}


/* =========================================================
   PROPERTY SECTION
========================================================= */

.lion-ts-property{
    padding:105px 0;

    position:relative;

    overflow:hidden;

    background:
        linear-gradient(
            115deg,
            var(--ts-green-950),
            var(--ts-green-700)
        );

    color:#fff;
}


.lion-ts-property::before{
    content:"";

    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 88% 20%,
            rgba(242,191,63,.11),
            transparent 28%
        );

    pointer-events:none;
}


.lion-ts-property-rings{
    width:420px;
    height:420px;

    position:absolute;

    left:-170px;
    bottom:-240px;

    border-radius:50%;

    border:
        1px solid
        rgba(242,191,63,.12);

    box-shadow:
        0 0 0 40px rgba(255,255,255,.013),
        0 0 0 80px rgba(242,191,63,.022),
        0 0 0 120px rgba(255,255,255,.010);
}


.lion-ts-property-grid{
    display:grid;

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

    align-items:center;

    gap:70px;
}


.lion-ts-dark-label{
    margin-bottom:15px;

    display:flex;

    align-items:center;

    gap:10px;

    color:var(--ts-gold-light);

    font-size:14px;

    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.2px;
}


.lion-ts-dark-label span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:var(--ts-gold);
}


.lion-ts-property-copy h2{
    margin:0 0 21px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.7vw,64px);

    line-height:1.04;

    text-transform:uppercase;
}


.lion-ts-property-copy h2 strong{
    display:block;

    color:var(--ts-gold);
}


.lion-ts-property-copy > p{
    margin:0 0 17px;

    color:rgba(255,255,255,.67);

    font-size:15px;

    line-height:1.8;
}


.lion-ts-property-list{
    margin-top:27px;

    display:grid;

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

    gap:10px;
}


.lion-ts-property-list > div{
    min-height:58px;

    padding:11px;

    display:flex;

    align-items:center;

    gap:10px;

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

    border-radius:8px;

    color:rgba(255,255,255,.80);

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

    font-size:14px;

    font-weight:700;
}


.lion-ts-property-list > div > span{
    width:32px;
    height:32px;

    min-width:32px;
    min-height:32px;

    display:flex !important;

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

    border-radius:50%;

    color:var(--ts-green-950);

    background:var(--ts-gold);
}


.lion-ts-property-list > div > span i{
    width:14px !important;
    height:14px !important;

    display:flex !important;

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

    font-size:12px;
}


/* PROPERTY VISUAL */

.lion-ts-property-visual{
    min-height:520px;

    position:relative;

    overflow:hidden;

    border-radius:17px;

    box-shadow:
        0 28px 70px
        rgba(0,0,0,.25);
}


.lion-ts-property-image{
    position:absolute;

    inset:0;

    background-size:cover;

    background-position:center;

    transition:
        transform .7s ease;
}


.lion-ts-property-image::after{
    content:"";

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(3,20,13,.05),
            rgba(3,20,13,.65)
        );
}


.lion-ts-property-visual:hover
.lion-ts-property-image{
    transform:scale(1.04);
}


.lion-ts-property-overlay-card{
    max-width:330px;

    position:absolute;

    left:25px;
    bottom:25px;

    z-index:3;

    padding:16px;

    display:flex;

    align-items:center;

    gap:13px;

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

    border-radius:10px;

    background:
        rgba(5,28,19,.88);

    backdrop-filter:blur(9px);
}


.lion-ts-property-overlay-icon{
    width:48px;
    height:48px;

    min-width:48px;
    min-height:48px;

    flex:0 0 48px;

    display:flex !important;

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

    border-radius:50%;

    color:var(--ts-green-950);

    background:var(--ts-gold);
}


.lion-ts-property-overlay-icon i{
    width:18px !important;
    height:18px !important;

    display:flex !important;

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

    font-size:15px;
}


.lion-ts-property-overlay-card small{
    display:block;

    margin-bottom:3px;

    color:
        rgba(255,255,255,.54);

    font-size:14px;
}


.lion-ts-property-overlay-card strong{
    display:block;

    color:#fff;

    font-size:15px;

    line-height:1.35;
}


/* =========================================================
   PROCESS
========================================================= */

.lion-ts-process{
    padding:110px 0 120px;

    position:relative;

    overflow:hidden;

    background:#fff;
}


.lion-ts-process-tree{
    position:absolute;

    right:-60px;
    bottom:-100px;

    color:
        rgba(13,57,39,.025);

    font-size:350px;

    pointer-events:none;
}


.lion-ts-process-heading{
    max-width:800px;

    margin:0 auto 75px;

    text-align:center;
}


.lion-ts-process-track{
    max-width:1150px;

    margin:0 auto;

    position:relative;

    display:grid;

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

    gap:0;
}


.lion-ts-process-line{
    height:4px;

    position:absolute;

    top:39px;

    left:10%;

    right:10%;

    overflow:hidden;

    border-radius:20px;

    background:#dce5de;
}


.lion-ts-process-progress{
    width:0%;
    height:100%;

    border-radius:20px;

    background:
        linear-gradient(
            90deg,
            var(--ts-gold),
            var(--ts-green-600)
        );

    transition:
        width .15s linear;
}


.lion-ts-process-step{
    position:relative;

    z-index:2;

    padding:0 14px;

    text-align:center;

    opacity:.35;

    transform:
        translateY(20px);

    transition:
        opacity .6s ease,
        transform .6s ease;
}


.lion-ts-process-step.lion-ts-step-visible{
    opacity:1;

    transform:translateY(0);
}


.lion-ts-process-node{
    width:78px;
    height:78px;

    margin:0 auto 24px;

    display:flex !important;

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

    border-radius:50%;

    border:
        1px solid
        rgba(40,107,73,.18);

    background:#fff;

    box-shadow:
        0 8px 20px
        rgba(17,54,37,.07);
}


.lion-ts-process-node span{
    width:52px;
    height:52px;

    display:flex !important;

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

    border-radius:50%;

    color:var(--ts-green-950);

    background:#dce5de;

    font-family:"Oswald",sans-serif;

    font-size:18px;

    font-weight:700;

    transition:
        background .4s ease;
}


.lion-ts-process-step.lion-ts-step-visible
.lion-ts-process-node span{
    background:var(--ts-gold);
}


.lion-ts-process-icon{
    width:41px;
    height:41px;

    min-width:41px;
    min-height:41px;

    margin:0 auto 14px;

    display:flex !important;

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

    border-radius:50%;

    color:#fff;

    background:var(--ts-green-700);
}


.lion-ts-process-icon i{
    width:16px !important;
    height:16px !important;

    display:flex !important;

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

    font-size:13px;
}


.lion-ts-process-content h3{
    margin:0 0 9px;

    color:var(--ts-title);

    font-family:"Oswald",sans-serif;

    font-size:22px;

    line-height:1.2;
}


.lion-ts-process-content p{
    margin:0;

    color:var(--ts-text);

    font-size:14px;

    line-height:1.65;
}


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

.lion-ts-benefits{
    padding:105px 0;

    position:relative;

    overflow:hidden;

    background:var(--ts-soft);
}


.lion-ts-benefits-rings{
    width:330px;
    height:330px;

    position:absolute;

    right:-155px;
    top:-130px;

    border-radius:50%;

    border:
        1px solid
        rgba(40,107,73,.06);

    box-shadow:
        0 0 0 40px rgba(40,107,73,.016),
        0 0 0 80px rgba(242,191,63,.02);
}


.lion-ts-benefits-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.88fr)
        minmax(0,1.12fr);

    align-items:start;

    gap:70px;
}


.lion-ts-benefits-heading{
    position:sticky;

    top:130px;
}


.lion-ts-benefits-heading > p{
    margin:0;

    color:var(--ts-text);

    font-size:15px;

    line-height:1.8;
}


.lion-ts-benefits-list{
    display:grid;

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

    gap:14px;
}


.lion-ts-benefit{
    min-height:240px;

    padding:24px;

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

    border-radius:13px;

    background:#fff;

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


.lion-ts-benefit:hover{
    transform:translateY(-6px);

    border-color:
        rgba(214,154,27,.35);

    box-shadow:
        0 22px 45px
        rgba(15,52,35,.09);
}


.lion-ts-benefit > span{
    width:52px;
    height:52px;

    min-width:52px;
    min-height:52px;

    margin-bottom:28px;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--ts-green-950);

    background:var(--ts-gold);
}


.lion-ts-benefit > span i{
    width:20px !important;
    height:20px !important;

    display:flex !important;

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

    font-size:17px;
}


.lion-ts-benefit h3{
    margin:0 0 10px;

    color:var(--ts-title);

    font-family:"Oswald",sans-serif;

    font-size:24px;

    line-height:1.2;
}


.lion-ts-benefit p{
    margin:0;

    color:var(--ts-text);

    font-size:14px;

    line-height:1.7;
}


/* =========================================================
   RELATED SERVICES
========================================================= */

.lion-ts-related{
    padding:105px 0;

    background:#fff;
}


.lion-ts-related-heading{
    max-width:780px;

    margin:0 auto 48px;

    text-align:center;
}


.lion-ts-related-heading h2{
    margin-bottom:0;
}


.lion-ts-related-grid{
    display:grid;

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

    gap:15px;
}


.lion-ts-related-card{
    min-height:130px;

    padding:19px;

    display:grid;

    grid-template-columns:
        auto 1fr auto;

    align-items:center;

    gap:14px;

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

    border-radius:12px;

    background:var(--ts-soft);

    transition:
        transform .35s ease,
        background .35s ease,
        box-shadow .35s ease;
}


.lion-ts-related-card:hover{
    transform:translateY(-5px);

    background:#fff;

    box-shadow:
        0 20px 42px
        rgba(16,53,36,.09);
}


.lion-ts-related-icon{
    width:50px;
    height:50px;

    min-width:50px;
    min-height:50px;

    display:flex !important;

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

    border-radius:50%;

    color:var(--ts-green-950);

    background:var(--ts-gold);
}


.lion-ts-related-icon i{
    width:18px !important;
    height:18px !important;

    display:flex !important;

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

    font-size:15px;
}


.lion-ts-related-card small{
    display:block;

    margin-bottom:3px;

    color:var(--ts-gold-dark);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-ts-related-card h3{
    margin:0;

    color:var(--ts-title);

    font-family:"Oswald",sans-serif;

    font-size:21px;

    line-height:1.2;
}


.lion-ts-related-arrow{
    width:38px;
    height:38px;

    min-width:38px;
    min-height:38px;

    display:flex !important;

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

    border-radius:50%;

    color:#fff;

    background:var(--ts-green-700);

    transition:
        transform .3s ease,
        background .3s ease;
}


.lion-ts-related-arrow i{
    width:14px !important;
    height:14px !important;

    display:flex !important;

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

    font-size:11px;
}


.lion-ts-related-card:hover
.lion-ts-related-arrow{
    transform:translateX(3px);

    color:var(--ts-green-950);

    background:var(--ts-gold);
}


/* =========================================================
   FAQ
========================================================= */

.lion-ts-faq{
    padding:105px 0;

    position:relative;

    overflow:hidden;

    background:var(--ts-soft);
}


.lion-ts-faq-tree{
    position:absolute;

    left:-70px;
    bottom:-95px;

    color:
        rgba(12,55,37,.025);

    font-size:340px;

    pointer-events:none;
}


.lion-ts-faq-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    align-items:start;

    gap:70px;
}


.lion-ts-faq-heading{
    position:sticky;

    top:130px;
}


.lion-ts-faq-heading > p{
    margin:0;

    color:var(--ts-text);

    font-size:15px;

    line-height:1.8;
}


.lion-ts-faq-list{
    display:flex;

    flex-direction:column;

    gap:10px;
}


.lion-ts-faq-item{
    overflow:hidden;

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

    border-radius:10px;

    background:#fff;
}


.lion-ts-faq-question{
    width:100%;

    min-height:74px;

    padding:15px 18px;

    display:flex !important;

    align-items:center !important;

    justify-content:space-between !important;

    gap:20px;

    border:0;

    color:var(--ts-title);

    background:#fff;

    font-family:"DM Sans",Arial,sans-serif;

    font-size:15px;

    line-height:1.4;

    font-weight:800;

    text-align:left;

    cursor:pointer;
}


.lion-ts-faq-question > i{
    width:34px !important;
    height:34px !important;

    min-width:34px;

    display:flex !important;

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

    border-radius:50%;

    color:var(--ts-green-950);

    background:var(--ts-gold);

    font-size:12px;

    transition:
        transform .3s ease;
}


.lion-ts-faq-item.lion-ts-faq-open
.lion-ts-faq-question > i{
    transform:rotate(45deg);
}


.lion-ts-faq-answer{
    max-height:0;

    overflow:hidden;

    transition:
        max-height .45s ease;
}


.lion-ts-faq-answer > div{
    padding:
        0 18px 20px;
}


.lion-ts-faq-answer p{
    margin:0;

    padding-top:15px;

    border-top:
        1px solid
        #e6ebe7;

    color:var(--ts-text);

    font-size:14px;

    line-height:1.75;
}


/* =========================================================
   CLOSING
========================================================= */

.lion-ts-closing{
    padding:0 0 100px;

    background:var(--ts-soft);
}


.lion-ts-closing-inner{
    padding:38px 42px;

    display:grid;

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

    align-items:center;

    gap:26px;

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

    border-radius:14px;

    background:#fff;
}


.lion-ts-closing-icon{
    width:80px;
    height:80px;

    min-width:80px;
    min-height:80px;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            var(--ts-green-700),
            var(--ts-green-950)
        );
}


.lion-ts-closing-icon i{
    width:29px !important;
    height:29px !important;

    display:flex !important;

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

    font-size:25px;
}


.lion-ts-closing-small{
    display:block;

    margin-bottom:4px;

    color:var(--ts-gold-dark);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.7px;
}


.lion-ts-closing h2{
    margin:0 0 9px;

    color:var(--ts-title);

    font-family:"Oswald",sans-serif;

    font-size:clamp(30px,3.5vw,45px);

    line-height:1.1;

    text-transform:uppercase;
}


.lion-ts-closing h2 strong{
    color:var(--ts-green-600);
}


.lion-ts-closing p{
    max-width:850px;

    margin:0;

    color:var(--ts-text);

    font-size:14px;

    line-height:1.75;
}


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

.lion-ts-reveal{
    opacity:0;

    transform:translateY(35px);

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


.lion-ts-reveal.lion-ts-visible{
    opacity:1;

    transform:translateY(0);
}


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

@media(max-width:1050px){

    .lion-ts-intro-grid{
        grid-template-columns:1fr 1fr;

        gap:45px;
    }


    .lion-ts-intro-visual{
        min-height:560px;
    }


    .lion-ts-main-image{
        height:480px;
    }


    .lion-ts-solutions-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .lion-ts-property-grid,
    .lion-ts-benefits-grid,
    .lion-ts-faq-grid{
        grid-template-columns:1fr 1fr;

        gap:45px;
    }


    .lion-ts-process-track{
        grid-template-columns:
            repeat(3,minmax(0,1fr));

        row-gap:45px;
    }


    .lion-ts-process-line{
        display:none;
    }


    .lion-ts-related-grid{
        grid-template-columns:1fr;
    }

}


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

@media(max-width:767px){

    .lion-ts-container{
        width:
            calc(100% - 28px);
    }


    .lion-ts-hero{
        min-height:390px;

        padding:78px 0 68px;
    }


    .lion-ts-hero h1{
        font-size:
            clamp(52px,16vw,72px);
    }


    .lion-ts-hero-content > p{
        font-size:14px;
    }


    .lion-ts-intro,
    .lion-ts-solutions,
    .lion-ts-property,
    .lion-ts-process,
    .lion-ts-benefits,
    .lion-ts-related,
    .lion-ts-faq{
        padding:75px 0;
    }


    .lion-ts-intro-grid,
    .lion-ts-property-grid,
    .lion-ts-benefits-grid,
    .lion-ts-faq-grid{
        grid-template-columns:1fr;

        gap:40px;
    }


    /* INTRO */

    .lion-ts-intro-visual{
        min-height:510px;
    }


    .lion-ts-main-image{
        width:88%;

        height:430px;
    }


    .lion-ts-secondary-image{
        width:46%;

        height:215px;
    }


    .lion-ts-visual-badge{
        left:18px;

        bottom:18px;
    }


    .lion-ts-intro-copy > p,
    .lion-ts-solutions-heading p,
    .lion-ts-property-copy > p,
    .lion-ts-benefits-heading > p,
    .lion-ts-faq-heading > p{
        font-size:14px;
    }


    .lion-ts-intro-features{
        grid-template-columns:1fr;
    }


    /* SOLUTIONS */

    .lion-ts-solutions-grid{
        grid-template-columns:1fr;
    }


    .lion-ts-solution-card{
        min-height:0;
    }


    /* PROPERTY */

    .lion-ts-property-list{
        grid-template-columns:1fr;
    }


    .lion-ts-property-visual{
        min-height:430px;
    }


    /* PROCESS */

    .lion-ts-process-track{
        grid-template-columns:1fr;

        gap:30px;
    }


    .lion-ts-process-step{
        padding:0;

        display:grid;

        grid-template-columns:
            65px 1fr;

        gap:14px;

        text-align:left;
    }


    .lion-ts-process-node{
        width:60px;
        height:60px;

        margin:0;

        grid-row:1 / span 2;
    }


    .lion-ts-process-node span{
        width:43px;
        height:43px;

        font-size:16px;
    }


    .lion-ts-process-content{
        min-width:0;
    }


    .lion-ts-process-icon{
        margin:0 0 10px;
    }


    /* BENEFITS */

    .lion-ts-benefits-heading,
    .lion-ts-faq-heading{
        position:static;
    }


    .lion-ts-benefits-list{
        grid-template-columns:1fr;
    }


    .lion-ts-benefit{
        min-height:0;
    }


    /* RELATED */

    .lion-ts-related-card{
        min-height:115px;
    }


    /* CLOSING */

    .lion-ts-closing{
        padding-bottom:70px;
    }


    .lion-ts-closing-inner{
        padding:26px 22px;

        grid-template-columns:1fr;

        gap:20px;
    }


    .lion-ts-closing-icon{
        width:68px;
        height:68px;

        min-width:68px;
        min-height:68px;
    }

}


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

@media(max-width:420px){

    .lion-ts-container{
        width:
            calc(100% - 20px);
    }


    .lion-ts-intro-visual{
        min-height:450px;
    }


    .lion-ts-main-image{
        height:385px;
    }


    .lion-ts-secondary-image{
        height:180px;
    }


    .lion-ts-visual-badge{
        min-width:190px;

        padding:12px;
    }


    .lion-ts-property-overlay-card{
        left:15px;
        right:15px;
        bottom:15px;

        max-width:none;
    }


    .lion-ts-related-card{
        grid-template-columns:
            auto minmax(0,1fr) auto;

        padding:15px;
    }

}


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

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

    .lion-ts-reveal,
    .lion-ts-process-step,
    .lion-ts-process-progress{
        transition:none !important;
    }


    .lion-ts-reveal{
        opacity:1;

        transform:none;
    }


    .lion-ts-process-step{
        opacity:1;

        transform:none;
    }

}


/* =========================================================
   LION TREE SERVICE & LANDSCAPING LLC
   STUMP GRINDING PAGE
========================================================= */

:root{
    --sg-green-950:#04170f;
    --sg-green-900:#071f16;
    --sg-green-800:#0b3123;
    --sg-green-700:#164a35;
    --sg-green-600:#286b49;

    --sg-gold:#f2bf3f;
    --sg-gold-dark:#d69a1b;
    --sg-gold-light:#ffe198;

    --sg-white:#ffffff;
    --sg-soft:#f5f8f5;
    --sg-soft-2:#edf2ed;

    --sg-title:#10271c;
    --sg-text:#526158;
    --sg-border:#dfe7e1;
}


/* =========================================================
   GLOBAL
========================================================= */

.lion-sg-container{
    width:min(92%,1380px);
    margin:0 auto;
    position:relative;
    z-index:3;
}


.lion-sg-hero *,
.lion-sg-intro *,
.lion-sg-reasons *,
.lion-sg-how *,
.lion-sg-process *,
.lion-sg-after *,
.lion-sg-related *,
.lion-sg-faq *,
.lion-sg-closing *{
    box-sizing:border-box;
}


.lion-sg-hero i,
.lion-sg-intro i,
.lion-sg-reasons i,
.lion-sg-how i,
.lion-sg-process i,
.lion-sg-after i,
.lion-sg-related i,
.lion-sg-faq i,
.lion-sg-closing i{
    position:static !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1 !important;
}


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

.lion-sg-hero{
    min-height:445px;
    padding:105px 0 95px;

    position:relative;
    overflow:hidden;

    display:flex;
    align-items:center;

    background:
        linear-gradient(
            105deg,
            rgba(3,20,13,.98),
            rgba(7,49,34,.94) 60%,
            rgba(23,82,57,.90)
        ),
        url("https://images.unsplash.com/photo-1441974231531-c6227db76b6e?auto=format&fit=crop&w=2000&q=85");

    background-size:cover;
    background-position:center;
}


.lion-sg-hero::before{
    content:"";
    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 74% 18%,
            rgba(242,191,63,.13),
            transparent 27%
        );

    pointer-events:none;
}


.lion-sg-hero-rings{
    width:450px;
    height:450px;

    position:absolute;
    right:-155px;
    bottom:-230px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.14);

    box-shadow:
        0 0 0 45px rgba(255,255,255,.016),
        0 0 0 90px rgba(242,191,63,.024),
        0 0 0 135px rgba(255,255,255,.012);
}


.lion-sg-hero-rings::before,
.lion-sg-hero-rings::after{
    content:"";

    position:absolute;

    border-radius:50%;

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


.lion-sg-hero-rings::before{
    inset:60px;
}


.lion-sg-hero-rings::after{
    inset:128px;
}


.lion-sg-hero-decoration{
    position:absolute;

    right:8%;
    bottom:-90px;

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

    font-size:350px;

    pointer-events:none;
}


.lion-sg-hero-content{
    max-width:850px;
}


.lion-sg-eyebrow{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--sg-gold-light);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.3px;
}


.lion-sg-eyebrow-line{
    width:38px;
    height:3px;

    flex:0 0 38px;

    border-radius:20px;

    background:var(--sg-gold);
}


.lion-sg-eyebrow-icon{
    width:31px;
    height:31px;

    min-width:31px;
    min-height:31px;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--sg-green-950);

    background:var(--sg-gold);
}


.lion-sg-eyebrow-icon i{
    width:14px !important;
    height:14px !important;

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

    font-size:12px;
}


.lion-sg-hero h1{
    margin:0 0 19px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(55px,7vw,93px);
    line-height:.98;

    font-weight:700;

    text-transform:uppercase;
}


.lion-sg-hero h1 span{
    color:var(--sg-gold);
}


.lion-sg-hero-content > p{
    max-width:730px;

    margin:0 0 28px;

    color:rgba(255,255,255,.74);

    font-size:16px;
    line-height:1.75;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.lion-sg-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:11px;
}


.lion-sg-breadcrumb a,
.lion-sg-breadcrumb > span{
    min-height:38px;

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

    gap:8px;

    color:rgba(255,255,255,.69);

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

    font-weight:700;
}


.lion-sg-breadcrumb a{
    transition:color .25s ease;
}


.lion-sg-breadcrumb a:hover{
    color:var(--sg-gold-light);
}


.lion-sg-breadcrumb a i{
    color:var(--sg-gold);
}


.lion-sg-breadcrumb-divider{
    min-height:auto !important;

    color:rgba(255,255,255,.28) !important;
}


.lion-sg-breadcrumb-divider i{
    font-size:10px;
}


.lion-sg-breadcrumb span[aria-current="page"]{
    color:var(--sg-gold-light);
}


/* =========================================================
   SECTION LABEL
========================================================= */

.lion-sg-section-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--sg-green-600);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-sg-section-label > span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:var(--sg-gold);
}


.lion-sg-section-label-center{
    justify-content:center;
}


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

.lion-sg-intro{
    padding:110px 0;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-sg-intro::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 5% 12%,
            rgba(242,191,63,.075),
            transparent 20%
        ),

        radial-gradient(
            circle at 95% 85%,
            rgba(40,107,73,.045),
            transparent 22%
        );
}


.lion-sg-intro-rings{
    width:340px;
    height:340px;

    position:absolute;

    right:-170px;
    bottom:-155px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 45px rgba(40,107,73,.018),
        0 0 0 90px rgba(242,191,63,.02);
}


.lion-sg-intro-grid{
    display:grid;

    grid-template-columns:
        minmax(420px,.92fr)
        minmax(0,1.08fr);

    align-items:center;

    gap:clamp(55px,7vw,100px);
}


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

.lion-sg-intro-visual{
    min-height:620px;

    position:relative;
}


.lion-sg-main-image{
    width:83%;
    height:540px;

    position:absolute;

    top:0;
    left:0;

    overflow:hidden;

    border-radius:16px;

    box-shadow:
        0 28px 60px rgba(13,52,35,.15);
}


.lion-sg-main-image img,
.lion-sg-small-image img{
    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

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


.lion-sg-main-image:hover img,
.lion-sg-small-image:hover img{
    transform:scale(1.05);
}


.lion-sg-small-image{
    width:47%;
    height:255px;

    position:absolute;

    right:0;
    bottom:0;

    overflow:hidden;

    border:7px solid #fff;

    border-radius:14px;

    box-shadow:
        0 20px 45px rgba(13,52,35,.14);
}


.lion-sg-image-info{
    min-width:230px;
    min-height:80px;

    padding:14px 16px;

    position:absolute;

    left:28px;
    bottom:30px;

    z-index:5;

    display:flex;
    align-items:center;

    gap:12px;

    border-radius:10px;

    color:#fff;

    background:
        linear-gradient(
            120deg,
            var(--sg-green-950),
            var(--sg-green-700)
        );

    box-shadow:
        0 18px 40px rgba(0,0,0,.23);
}


.lion-sg-image-info-icon{
    width:44px;
    height:44px;

    min-width:44px;
    min-height:44px;

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

    border-radius:50%;

    color:var(--sg-green-950);

    background:var(--sg-gold);
}


.lion-sg-image-info-icon i{
    width:17px !important;
    height:17px !important;

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

    font-size:14px;
}


.lion-sg-image-info small{
    display:block;

    color:rgba(255,255,255,.58);

    font-size:14px;
}


.lion-sg-image-info strong{
    display:block;

    margin-top:2px;

    color:#fff;

    font-family:"Oswald",sans-serif;

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


.lion-sg-visual-ring{
    width:185px;
    height:185px;

    position:absolute;

    right:15px;
    top:25px;

    z-index:-1;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.20);

    box-shadow:
        0 0 0 22px rgba(242,191,63,.03),
        0 0 0 44px rgba(40,107,73,.025);
}


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

.lion-sg-intro-copy h2,
.lion-sg-after-heading h2,
.lion-sg-faq-heading h2{
    margin:0 0 25px;

    color:var(--sg-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.6vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-sg-intro-copy h2 strong,
.lion-sg-after-heading h2 strong,
.lion-sg-faq-heading h2 strong{
    display:block;

    color:var(--sg-green-600);
}


.lion-sg-intro-copy > p{
    margin:0 0 18px;

    color:var(--sg-text);

    font-size:15px;
    line-height:1.85;

    text-align:justify;
}


.lion-sg-intro-features{
    margin-top:28px;

    display:grid;

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

    gap:10px;
}


.lion-sg-intro-features > div{
    min-height:52px;

    padding:10px 12px;

    display:flex;
    align-items:center;

    gap:10px;

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

    border-radius:8px;

    color:#56665c;

    background:var(--sg-soft);

    font-size:14px;
    font-weight:700;
}


.lion-sg-intro-features > div > span{
    width:25px;
    height:25px;

    min-width:25px;
    min-height:25px;

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

    border-radius:50%;

    color:var(--sg-green-700);

    background:rgba(40,107,73,.09);
}


.lion-sg-intro-features > div > span i{
    width:11px !important;
    height:11px !important;

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

    font-size:9px;
}


/* =========================================================
   REASONS
========================================================= */

.lion-sg-reasons{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:var(--sg-soft);
}


.lion-sg-reasons::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 8% 15%,
            rgba(40,107,73,.04),
            transparent 21%
        ),

        radial-gradient(
            circle at 92% 84%,
            rgba(242,191,63,.055),
            transparent 23%
        );
}


.lion-sg-reasons-tree{
    position:absolute;

    left:-70px;
    top:300px;

    color:rgba(11,54,37,.03);

    font-size:310px;

    pointer-events:none;
}


.lion-sg-reasons-leaf{
    position:absolute;

    right:4%;
    bottom:80px;

    color:rgba(11,54,37,.03);

    font-size:110px;

    transform:rotate(25deg);

    pointer-events:none;
}


.lion-sg-reasons-heading{
    max-width:820px;

    margin:0 auto 55px;

    text-align:center;
}


.lion-sg-reasons-heading h2,
.lion-sg-process-heading h2,
.lion-sg-related-heading h2{
    margin:0 0 18px;

    color:var(--sg-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(42px,5vw,68px);
    line-height:1.03;

    text-transform:uppercase;
}


.lion-sg-reasons-heading h2 strong,
.lion-sg-process-heading h2 strong,
.lion-sg-related-heading h2 strong{
    display:block;

    color:var(--sg-green-600);
}


.lion-sg-reasons-heading p,
.lion-sg-process-heading p{
    max-width:670px;

    margin:0 auto;

    color:var(--sg-text);

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


.lion-sg-reasons-grid{
    display:grid;

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

    gap:18px;
}


.lion-sg-reason-card{
    min-height:300px;

    padding:28px 25px;

    position:relative;
    overflow:hidden;

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

    border-radius:14px;

    background:#fff;

    box-shadow:
        0 18px 42px rgba(16,53,36,.06);

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


.lion-sg-reason-card:hover{
    transform:translateY(-8px);

    border-color:rgba(214,154,27,.36);

    box-shadow:
        0 27px 55px rgba(16,53,36,.11);
}


.lion-sg-reason-card::before{
    content:"";

    width:78px;
    height:4px;

    position:absolute;

    top:0;
    left:25px;

    border-radius:0 0 15px 15px;

    background:
        linear-gradient(
            90deg,
            var(--sg-gold-dark),
            var(--sg-gold-light)
        );
}


.lion-sg-reason-number{
    position:absolute;

    top:17px;
    right:18px;

    color:rgba(9,49,33,.065);

    font-family:"Oswald",sans-serif;

    font-size:55px;
    line-height:1;

    font-weight:700;
}


.lion-sg-reason-icon{
    width:58px;
    height:58px;

    min-width:58px;
    min-height:58px;

    margin-bottom:35px;

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

    border-radius:50%;

    color:var(--sg-green-950);

    background:
        linear-gradient(
            145deg,
            var(--sg-gold-light),
            var(--sg-gold)
        );
}


.lion-sg-reason-icon i{
    width:22px !important;
    height:22px !important;

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

    font-size:18px;
}


.lion-sg-reason-card h3{
    margin:0 0 13px;

    color:var(--sg-title);

    font-family:"Oswald",sans-serif;

    font-size:26px;
    line-height:1.2;
}


.lion-sg-reason-card p{
    margin:0;

    color:var(--sg-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   HOW IT WORKS
========================================================= */

.lion-sg-how{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    color:#fff;

    background:
        linear-gradient(
            115deg,
            var(--sg-green-950),
            var(--sg-green-700)
        );
}


.lion-sg-how::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(242,191,63,.11),
            transparent 28%
        );
}


.lion-sg-how-rings{
    width:420px;
    height:420px;

    position:absolute;

    left:-170px;
    bottom:-240px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.12);

    box-shadow:
        0 0 0 40px rgba(255,255,255,.013),
        0 0 0 80px rgba(242,191,63,.022),
        0 0 0 120px rgba(255,255,255,.010);
}


.lion-sg-how-grid{
    display:grid;

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

    align-items:center;

    gap:70px;
}


.lion-sg-dark-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--sg-gold-light);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-sg-dark-label span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:var(--sg-gold);
}


.lion-sg-how-copy h2{
    margin:0 0 21px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.7vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-sg-how-copy h2 strong{
    display:block;

    color:var(--sg-gold);
}


.lion-sg-how-copy > p{
    margin:0 0 17px;

    color:rgba(255,255,255,.67);

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


.lion-sg-how-list{
    margin-top:27px;

    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-sg-how-list > div{
    min-height:82px;

    padding:14px;

    display:flex;
    align-items:flex-start;

    gap:13px;

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

    border-radius:9px;

    background:rgba(255,255,255,.045);
}


.lion-sg-how-list > div > span{
    width:43px;
    height:43px;

    min-width:43px;
    min-height:43px;

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

    border-radius:50%;

    color:var(--sg-green-950);

    background:var(--sg-gold);
}


.lion-sg-how-list > div > span i{
    width:17px !important;
    height:17px !important;

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

    font-size:14px;
}


.lion-sg-how-list strong{
    display:block;

    margin-bottom:4px;

    color:#fff;

    font-size:15px;
    line-height:1.3;
}


.lion-sg-how-list p{
    margin:0;

    color:rgba(255,255,255,.58);

    font-size:14px;
    line-height:1.6;
}


/* VISUAL */

.lion-sg-how-visual{
    min-height:520px;

    position:relative;
    overflow:hidden;

    border-radius:17px;

    box-shadow:
        0 28px 70px rgba(0,0,0,.25);
}


.lion-sg-how-image{
    position:absolute;
    inset:0;

    background-size:cover;
    background-position:center;

    transition:transform .7s ease;
}


.lion-sg-how-image::after{
    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(3,20,13,.05),
            rgba(3,20,13,.68)
        );
}


.lion-sg-how-visual:hover
.lion-sg-how-image{
    transform:scale(1.04);
}


.lion-sg-how-card{
    max-width:330px;

    position:absolute;

    left:25px;
    bottom:25px;

    z-index:3;

    padding:16px;

    display:flex;
    align-items:center;

    gap:13px;

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

    border-radius:10px;

    background:rgba(5,28,19,.88);

    backdrop-filter:blur(9px);
}


.lion-sg-how-card > span{
    width:48px;
    height:48px;

    min-width:48px;
    min-height:48px;

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

    border-radius:50%;

    color:var(--sg-green-950);

    background:var(--sg-gold);
}


.lion-sg-how-card > span i{
    width:18px !important;
    height:18px !important;

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

    font-size:15px;
}


.lion-sg-how-card small{
    display:block;

    margin-bottom:3px;

    color:rgba(255,255,255,.54);

    font-size:14px;
}


.lion-sg-how-card strong{
    display:block;

    color:#fff;

    font-size:15px;
    line-height:1.35;
}


/* =========================================================
   PROCESS
========================================================= */

.lion-sg-process{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-sg-process-tree{
    position:absolute;

    right:-60px;
    bottom:-100px;

    color:rgba(13,57,39,.025);

    font-size:350px;

    pointer-events:none;
}


.lion-sg-process-heading{
    max-width:800px;

    margin:0 auto 75px;

    text-align:center;
}


.lion-sg-process-wrap{
    max-width:1150px;

    margin:0 auto;

    position:relative;

    display:grid;

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

    gap:0;
}


.lion-sg-process-line{
    height:4px;

    position:absolute;

    top:39px;

    left:10%;
    right:10%;

    overflow:hidden;

    border-radius:20px;

    background:#dce5de;
}


.lion-sg-process-progress{
    width:0%;
    height:100%;

    border-radius:20px;

    background:
        linear-gradient(
            90deg,
            var(--sg-gold),
            var(--sg-green-600)
        );

    transition:width .15s linear;
}


.lion-sg-process-step{
    position:relative;

    z-index:2;

    padding:0 14px;

    text-align:center;

    opacity:.35;

    transform:translateY(20px);

    transition:
        opacity .6s ease,
        transform .6s ease;
}


.lion-sg-process-step.lion-sg-step-visible{
    opacity:1;

    transform:translateY(0);
}


.lion-sg-process-node{
    width:78px;
    height:78px;

    margin:0 auto 24px;

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

    border-radius:50%;

    border:1px solid rgba(40,107,73,.18);

    background:#fff;

    box-shadow:
        0 8px 20px rgba(17,54,37,.07);
}


.lion-sg-process-node span{
    width:52px;
    height:52px;

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

    border-radius:50%;

    color:var(--sg-green-950);

    background:#dce5de;

    font-family:"Oswald",sans-serif;

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

    transition:background .4s ease;
}


.lion-sg-process-step.lion-sg-step-visible
.lion-sg-process-node span{
    background:var(--sg-gold);
}


.lion-sg-process-icon{
    width:41px;
    height:41px;

    min-width:41px;
    min-height:41px;

    margin:0 auto 14px;

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

    border-radius:50%;

    color:#fff;

    background:var(--sg-green-700);
}


.lion-sg-process-icon i{
    width:16px !important;
    height:16px !important;

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

    font-size:13px;
}


.lion-sg-process-card h3{
    margin:0 0 9px;

    color:var(--sg-title);

    font-family:"Oswald",sans-serif;

    font-size:22px;
    line-height:1.2;
}


.lion-sg-process-card p{
    margin:0;

    color:var(--sg-text);

    font-size:14px;
    line-height:1.65;
}


/* =========================================================
   AFTER STUMP GRINDING
========================================================= */

.lion-sg-after{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    background:var(--sg-soft);
}


.lion-sg-after-rings{
    width:330px;
    height:330px;

    position:absolute;

    right:-155px;
    top:-130px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 40px rgba(40,107,73,.016),
        0 0 0 80px rgba(242,191,63,.02);
}


.lion-sg-after-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    align-items:start;

    gap:70px;
}


.lion-sg-after-heading{
    position:sticky;

    top:130px;
}


.lion-sg-after-heading > p{
    margin:0;

    color:var(--sg-text);

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


.lion-sg-after-grid-cards{
    display:grid;

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

    gap:14px;
}


.lion-sg-after-card{
    min-height:255px;

    padding:24px;

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

    border-radius:13px;

    background:#fff;

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


.lion-sg-after-card:hover{
    transform:translateY(-6px);

    border-color:rgba(214,154,27,.35);

    box-shadow:
        0 22px 45px rgba(15,52,35,.09);
}


.lion-sg-after-card > span{
    width:52px;
    height:52px;

    min-width:52px;
    min-height:52px;

    margin-bottom:27px;

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

    border-radius:50%;

    color:var(--sg-green-950);

    background:var(--sg-gold);
}


.lion-sg-after-card > span i{
    width:20px !important;
    height:20px !important;

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

    font-size:17px;
}


.lion-sg-after-card small{
    display:block;

    margin-bottom:5px;

    color:var(--sg-gold-dark);

    font-size:14px;
    font-weight:800;

    text-transform:uppercase;
}


.lion-sg-after-card h3{
    margin:0 0 10px;

    color:var(--sg-title);

    font-family:"Oswald",sans-serif;

    font-size:24px;
    line-height:1.2;
}


.lion-sg-after-card p{
    margin:0;

    color:var(--sg-text);

    font-size:14px;
    line-height:1.7;
}


/* =========================================================
   RELATED SERVICES
========================================================= */

.lion-sg-related{
    padding:105px 0;

    background:#fff;
}


.lion-sg-related-heading{
    max-width:780px;

    margin:0 auto 48px;

    text-align:center;
}


.lion-sg-related-heading h2{
    margin-bottom:0;
}


.lion-sg-related-grid{
    display:grid;

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

    gap:15px;
}


.lion-sg-related-card{
    min-height:130px;

    padding:19px;

    display:grid;

    grid-template-columns:
        auto 1fr auto;

    align-items:center;

    gap:14px;

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

    border-radius:12px;

    background:var(--sg-soft);

    transition:
        transform .35s ease,
        background .35s ease,
        box-shadow .35s ease;
}


.lion-sg-related-card:hover{
    transform:translateY(-5px);

    background:#fff;

    box-shadow:
        0 20px 42px rgba(16,53,36,.09);
}


.lion-sg-related-icon{
    width:50px;
    height:50px;

    min-width:50px;
    min-height:50px;

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

    border-radius:50%;

    color:var(--sg-green-950);

    background:var(--sg-gold);
}


.lion-sg-related-icon i{
    width:18px !important;
    height:18px !important;

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

    font-size:15px;
}


.lion-sg-related-card small{
    display:block;

    margin-bottom:3px;

    color:var(--sg-gold-dark);

    font-size:14px;
    font-weight:800;

    text-transform:uppercase;
}


.lion-sg-related-card h3{
    margin:0;

    color:var(--sg-title);

    font-family:"Oswald",sans-serif;

    font-size:21px;
    line-height:1.2;
}


.lion-sg-related-arrow{
    width:38px;
    height:38px;

    min-width:38px;
    min-height:38px;

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

    border-radius:50%;

    color:#fff;

    background:var(--sg-green-700);

    transition:
        transform .3s ease,
        background .3s ease;
}


.lion-sg-related-arrow i{
    width:14px !important;
    height:14px !important;

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

    font-size:11px;
}


.lion-sg-related-card:hover
.lion-sg-related-arrow{
    transform:translateX(3px);

    color:var(--sg-green-950);

    background:var(--sg-gold);
}


/* =========================================================
   FAQ
========================================================= */

.lion-sg-faq{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    background:var(--sg-soft);
}


.lion-sg-faq-tree{
    position:absolute;

    left:-70px;
    bottom:-95px;

    color:rgba(12,55,37,.025);

    font-size:340px;

    pointer-events:none;
}


.lion-sg-faq-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    align-items:start;

    gap:70px;
}


.lion-sg-faq-heading{
    position:sticky;

    top:130px;
}


.lion-sg-faq-heading > p{
    margin:0;

    color:var(--sg-text);

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


.lion-sg-faq-list{
    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-sg-faq-item{
    overflow:hidden;

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

    border-radius:10px;

    background:#fff;
}


.lion-sg-faq-question{
    width:100%;
    min-height:74px;

    padding:15px 18px;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    gap:20px;

    border:0;

    color:var(--sg-title);

    background:#fff;

    font-family:"DM Sans",Arial,sans-serif;

    font-size:15px;
    line-height:1.4;

    font-weight:800;

    text-align:left;

    cursor:pointer;
}


.lion-sg-faq-question > i{
    width:34px !important;
    height:34px !important;

    min-width:34px;

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

    border-radius:50%;

    color:var(--sg-green-950);

    background:var(--sg-gold);

    font-size:12px;

    transition:transform .3s ease;
}


.lion-sg-faq-item.lion-sg-faq-open
.lion-sg-faq-question > i{
    transform:rotate(45deg);
}


.lion-sg-faq-answer{
    max-height:0;

    overflow:hidden;

    transition:max-height .45s ease;
}


.lion-sg-faq-answer > div{
    padding:0 18px 20px;
}


.lion-sg-faq-answer p{
    margin:0;

    padding-top:15px;

    border-top:1px solid #e6ebe7;

    color:var(--sg-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   CLOSING
========================================================= */

.lion-sg-closing{
    padding:0 0 100px;

    background:var(--sg-soft);
}


.lion-sg-closing-inner{
    padding:38px 42px;

    display:grid;

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

    align-items:center;

    gap:26px;

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

    border-radius:14px;

    background:#fff;
}


.lion-sg-closing-icon{
    width:80px;
    height:80px;

    min-width:80px;
    min-height:80px;

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

    border-radius:50%;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            var(--sg-green-700),
            var(--sg-green-950)
        );
}


.lion-sg-closing-icon i{
    width:29px !important;
    height:29px !important;

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

    font-size:25px;
}


.lion-sg-closing-small{
    display:block;

    margin-bottom:4px;

    color:var(--sg-gold-dark);

    font-size:14px;
    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.7px;
}


.lion-sg-closing h2{
    margin:0 0 9px;

    color:var(--sg-title);

    font-family:"Oswald",sans-serif;

    font-size:clamp(30px,3.5vw,45px);
    line-height:1.1;

    text-transform:uppercase;
}


.lion-sg-closing h2 strong{
    color:var(--sg-green-600);
}


.lion-sg-closing p{
    max-width:850px;

    margin:0;

    color:var(--sg-text);

    font-size:14px;
    line-height:1.75;
}


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

.lion-sg-reveal{
    opacity:0;

    transform:translateY(35px);

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


.lion-sg-reveal.lion-sg-visible{
    opacity:1;

    transform:translateY(0);
}


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

@media(max-width:1050px){

    .lion-sg-intro-grid{
        grid-template-columns:1fr 1fr;

        gap:45px;
    }


    .lion-sg-intro-visual{
        min-height:560px;
    }


    .lion-sg-main-image{
        height:480px;
    }


    .lion-sg-reasons-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .lion-sg-how-grid,
    .lion-sg-after-grid,
    .lion-sg-faq-grid{
        grid-template-columns:1fr 1fr;

        gap:45px;
    }


    .lion-sg-process-wrap{
        grid-template-columns:
            repeat(3,minmax(0,1fr));

        row-gap:45px;
    }


    .lion-sg-process-line{
        display:none;
    }


    .lion-sg-related-grid{
        grid-template-columns:1fr;
    }

}


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

@media(max-width:767px){

    .lion-sg-container{
        width:calc(100% - 28px);
    }


    .lion-sg-hero{
        min-height:390px;

        padding:78px 0 68px;
    }


    .lion-sg-hero h1{
        font-size:clamp(48px,15vw,70px);
    }


    .lion-sg-hero-content > p{
        font-size:14px;
    }


    .lion-sg-intro,
    .lion-sg-reasons,
    .lion-sg-how,
    .lion-sg-process,
    .lion-sg-after,
    .lion-sg-related,
    .lion-sg-faq{
        padding:75px 0;
    }


    .lion-sg-intro-grid,
    .lion-sg-how-grid,
    .lion-sg-after-grid,
    .lion-sg-faq-grid{
        grid-template-columns:1fr;

        gap:40px;
    }


    /* INTRO */

    .lion-sg-intro-visual{
        min-height:510px;
    }


    .lion-sg-main-image{
        width:88%;
        height:430px;
    }


    .lion-sg-small-image{
        width:46%;
        height:215px;
    }


    .lion-sg-image-info{
        left:18px;
        bottom:18px;
    }


    .lion-sg-intro-copy > p,
    .lion-sg-reasons-heading p,
    .lion-sg-how-copy > p,
    .lion-sg-after-heading > p,
    .lion-sg-faq-heading > p{
        font-size:14px;
    }


    .lion-sg-intro-features{
        grid-template-columns:1fr;
    }


    /* REASONS */

    .lion-sg-reasons-grid{
        grid-template-columns:1fr;
    }


    .lion-sg-reason-card{
        min-height:0;
    }


    /* HOW */

    .lion-sg-how-visual{
        min-height:430px;
    }


    /* PROCESS */

    .lion-sg-process-wrap{
        grid-template-columns:1fr;

        gap:30px;
    }


    .lion-sg-process-step{
        padding:0;

        display:grid;

        grid-template-columns:65px 1fr;

        gap:14px;

        text-align:left;
    }


    .lion-sg-process-node{
        width:60px;
        height:60px;

        margin:0;

        grid-row:1 / span 2;
    }


    .lion-sg-process-node span{
        width:43px;
        height:43px;

        font-size:16px;
    }


    .lion-sg-process-icon{
        margin:0 0 10px;
    }


    /* AFTER */

    .lion-sg-after-heading,
    .lion-sg-faq-heading{
        position:static;
    }


    .lion-sg-after-grid-cards{
        grid-template-columns:1fr;
    }


    .lion-sg-after-card{
        min-height:0;
    }


    /* RELATED */

    .lion-sg-related-card{
        min-height:115px;
    }


    /* CLOSING */

    .lion-sg-closing{
        padding-bottom:70px;
    }


    .lion-sg-closing-inner{
        padding:26px 22px;

        grid-template-columns:1fr;

        gap:20px;
    }


    .lion-sg-closing-icon{
        width:68px;
        height:68px;

        min-width:68px;
        min-height:68px;
    }

}


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

@media(max-width:420px){

    .lion-sg-container{
        width:calc(100% - 20px);
    }


    .lion-sg-intro-visual{
        min-height:450px;
    }


    .lion-sg-main-image{
        height:385px;
    }


    .lion-sg-small-image{
        height:180px;
    }


    .lion-sg-image-info{
        min-width:190px;

        padding:12px;
    }


    .lion-sg-how-card{
        left:15px;
        right:15px;
        bottom:15px;

        max-width:none;
    }


    .lion-sg-related-card{
        padding:15px;
    }

}


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

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

    .lion-sg-reveal,
    .lion-sg-process-step,
    .lion-sg-process-progress{
        transition:none !important;
    }


    .lion-sg-reveal{
        opacity:1;
        transform:none;
    }


    .lion-sg-process-step{
        opacity:1;
        transform:none;
    }

}

/* =========================================================
   LION TREE SERVICE & LANDSCAPING LLC
   TREE TRIMMING PAGE
========================================================= */

:root{
    --tt-green-950:#04170f;
    --tt-green-900:#071f16;
    --tt-green-800:#0b3123;
    --tt-green-700:#164a35;
    --tt-green-600:#286b49;

    --tt-gold:#f2bf3f;
    --tt-gold-dark:#d69a1b;
    --tt-gold-light:#ffe198;

    --tt-white:#ffffff;
    --tt-soft:#f5f8f5;

    --tt-title:#10271c;
    --tt-text:#526158;
    --tt-border:#dfe7e1;
}


/* =========================================================
   GLOBAL
========================================================= */

.lion-tt-container{
    width:min(92%,1380px);
    margin:0 auto;
    position:relative;
    z-index:3;
}


.lion-tt-hero *,
.lion-tt-intro *,
.lion-tt-solutions *,
.lion-tt-importance *,
.lion-tt-process *,
.lion-tt-benefits *,
.lion-tt-related *,
.lion-tt-faq *,
.lion-tt-closing *{
    box-sizing:border-box;
}


.lion-tt-hero i,
.lion-tt-intro i,
.lion-tt-solutions i,
.lion-tt-importance i,
.lion-tt-process i,
.lion-tt-benefits i,
.lion-tt-related i,
.lion-tt-faq i,
.lion-tt-closing i{
    position:static !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1 !important;
}


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

.lion-tt-hero{
    min-height:445px;
    padding:105px 0 95px;

    position:relative;
    overflow:hidden;

    display:flex;
    align-items:center;

    background:
        linear-gradient(
            105deg,
            rgba(3,20,13,.98),
            rgba(7,49,34,.94) 60%,
            rgba(23,82,57,.90)
        ),
        url("https://images.unsplash.com/photo-1473448912268-2022ce9509d8?auto=format&fit=crop&w=2000&q=85");

    background-size:cover;
    background-position:center;
}


.lion-tt-hero::before{
    content:"";
    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 74% 18%,
            rgba(242,191,63,.13),
            transparent 27%
        );

    pointer-events:none;
}


.lion-tt-hero-rings{
    width:450px;
    height:450px;

    position:absolute;
    right:-155px;
    bottom:-230px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.14);

    box-shadow:
        0 0 0 45px rgba(255,255,255,.016),
        0 0 0 90px rgba(242,191,63,.024),
        0 0 0 135px rgba(255,255,255,.012);
}


.lion-tt-hero-rings::before,
.lion-tt-hero-rings::after{
    content:"";

    position:absolute;

    border-radius:50%;

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


.lion-tt-hero-rings::before{
    inset:60px;
}


.lion-tt-hero-rings::after{
    inset:128px;
}


.lion-tt-hero-decoration{
    position:absolute;
    right:8%;
    bottom:-90px;

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

    font-size:350px;

    pointer-events:none;
}


.lion-tt-hero-content{
    max-width:850px;
}


.lion-tt-eyebrow{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--tt-gold-light);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.3px;
}


.lion-tt-eyebrow-line{
    width:38px;
    height:3px;

    flex:0 0 38px;

    border-radius:20px;

    background:var(--tt-gold);
}


.lion-tt-eyebrow-icon{
    width:31px;
    height:31px;

    min-width:31px;
    min-height:31px;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--tt-green-950);

    background:var(--tt-gold);
}


.lion-tt-eyebrow-icon i{
    width:14px !important;
    height:14px !important;

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

    font-size:12px;
}


.lion-tt-hero h1{
    margin:0 0 19px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(55px,7vw,93px);
    line-height:.98;

    font-weight:700;

    text-transform:uppercase;
}


.lion-tt-hero h1 span{
    color:var(--tt-gold);
}


.lion-tt-hero-content > p{
    max-width:730px;

    margin:0 0 28px;

    color:rgba(255,255,255,.74);

    font-size:16px;
    line-height:1.75;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.lion-tt-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:11px;
}


.lion-tt-breadcrumb a,
.lion-tt-breadcrumb > span{
    min-height:38px;

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

    gap:8px;

    color:rgba(255,255,255,.69);

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

    font-weight:700;
}


.lion-tt-breadcrumb a{
    transition:color .25s ease;
}


.lion-tt-breadcrumb a:hover{
    color:var(--tt-gold-light);
}


.lion-tt-breadcrumb a i{
    color:var(--tt-gold);
}


.lion-tt-breadcrumb-divider{
    min-height:auto !important;

    color:rgba(255,255,255,.28) !important;
}


.lion-tt-breadcrumb-divider i{
    font-size:10px;
}


.lion-tt-breadcrumb span[aria-current="page"]{
    color:var(--tt-gold-light);
}


/* =========================================================
   SECTION LABEL
========================================================= */

.lion-tt-section-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--tt-green-600);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-tt-section-label > span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:var(--tt-gold);
}


.lion-tt-section-label-center{
    justify-content:center;
}


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

.lion-tt-intro{
    padding:110px 0;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-tt-intro::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 5% 15%,
            rgba(242,191,63,.075),
            transparent 20%
        ),

        radial-gradient(
            circle at 95% 85%,
            rgba(40,107,73,.045),
            transparent 22%
        );
}


.lion-tt-intro-rings{
    width:340px;
    height:340px;

    position:absolute;

    right:-170px;
    bottom:-155px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 45px rgba(40,107,73,.018),
        0 0 0 90px rgba(242,191,63,.02);
}


.lion-tt-intro-grid{
    display:grid;

    grid-template-columns:
        minmax(420px,.92fr)
        minmax(0,1.08fr);

    align-items:center;

    gap:clamp(55px,7vw,100px);
}


/* VISUAL */

.lion-tt-intro-visual{
    min-height:620px;

    position:relative;
}


.lion-tt-main-image{
    width:83%;
    height:540px;

    position:absolute;

    top:0;
    left:0;

    overflow:hidden;

    border-radius:16px;

    box-shadow:
        0 28px 60px rgba(13,52,35,.15);
}


.lion-tt-main-image img,
.lion-tt-secondary-image img{
    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

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


.lion-tt-main-image:hover img,
.lion-tt-secondary-image:hover img{
    transform:scale(1.05);
}


.lion-tt-secondary-image{
    width:47%;
    height:255px;

    position:absolute;

    right:0;
    bottom:0;

    overflow:hidden;

    border:7px solid #fff;

    border-radius:14px;

    box-shadow:
        0 20px 45px rgba(13,52,35,.14);
}


.lion-tt-visual-badge{
    min-width:230px;
    min-height:80px;

    padding:14px 16px;

    position:absolute;

    left:28px;
    bottom:30px;

    z-index:5;

    display:flex;
    align-items:center;

    gap:12px;

    border-radius:10px;

    color:#fff;

    background:
        linear-gradient(
            120deg,
            var(--tt-green-950),
            var(--tt-green-700)
        );

    box-shadow:
        0 18px 40px rgba(0,0,0,.23);
}


.lion-tt-visual-badge > span{
    width:44px;
    height:44px;

    min-width:44px;
    min-height:44px;

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

    border-radius:50%;

    color:var(--tt-green-950);

    background:var(--tt-gold);
}


.lion-tt-visual-badge > span i{
    width:17px !important;
    height:17px !important;

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

    font-size:14px;
}


.lion-tt-visual-badge small{
    display:block;

    color:rgba(255,255,255,.58);

    font-size:14px;
}


.lion-tt-visual-badge strong{
    display:block;

    margin-top:2px;

    color:#fff;

    font-family:"Oswald",sans-serif;

    font-size:19px;
}


.lion-tt-tree-ring{
    width:185px;
    height:185px;

    position:absolute;

    right:15px;
    top:25px;

    z-index:-1;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.20);

    box-shadow:
        0 0 0 22px rgba(242,191,63,.03),
        0 0 0 44px rgba(40,107,73,.025);
}


/* INTRO CONTENT */

.lion-tt-intro-copy h2,
.lion-tt-benefits-heading h2,
.lion-tt-faq-heading h2{
    margin:0 0 25px;

    color:var(--tt-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.6vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-tt-intro-copy h2 strong,
.lion-tt-benefits-heading h2 strong,
.lion-tt-faq-heading h2 strong{
    display:block;

    color:var(--tt-green-600);
}


.lion-tt-intro-copy > p{
    margin:0 0 18px;

    color:var(--tt-text);

    font-size:15px;
    line-height:1.85;

    text-align:justify;
}


.lion-tt-intro-features{
    margin-top:28px;

    display:grid;

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

    gap:10px;
}


.lion-tt-intro-features > div{
    min-height:52px;

    padding:10px 12px;

    display:flex;
    align-items:center;

    gap:10px;

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

    border-radius:8px;

    color:#56665c;

    background:var(--tt-soft);

    font-size:14px;
    font-weight:700;
}


.lion-tt-intro-features > div > span{
    width:25px;
    height:25px;

    min-width:25px;
    min-height:25px;

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

    border-radius:50%;

    color:var(--tt-green-700);

    background:rgba(40,107,73,.09);
}


/* =========================================================
   SOLUTIONS
========================================================= */

.lion-tt-solutions{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:var(--tt-soft);
}


.lion-tt-solutions-tree{
    position:absolute;

    left:-70px;
    top:300px;

    color:rgba(11,54,37,.03);

    font-size:310px;

    pointer-events:none;
}


.lion-tt-solutions-leaf{
    position:absolute;

    right:4%;
    bottom:80px;

    color:rgba(11,54,37,.03);

    font-size:110px;

    transform:rotate(25deg);

    pointer-events:none;
}


.lion-tt-solutions-heading{
    max-width:820px;

    margin:0 auto 55px;

    text-align:center;
}


.lion-tt-solutions-heading h2,
.lion-tt-process-heading h2,
.lion-tt-related-heading h2{
    margin:0 0 18px;

    color:var(--tt-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(42px,5vw,68px);
    line-height:1.03;

    text-transform:uppercase;
}


.lion-tt-solutions-heading h2 strong,
.lion-tt-process-heading h2 strong,
.lion-tt-related-heading h2 strong{
    display:block;

    color:var(--tt-green-600);
}


.lion-tt-solutions-heading p,
.lion-tt-process-heading p{
    max-width:670px;

    margin:0 auto;

    color:var(--tt-text);

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


.lion-tt-solutions-grid{
    display:grid;

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

    gap:18px;
}


.lion-tt-solution-card{
    min-height:300px;

    padding:28px 25px;

    position:relative;
    overflow:hidden;

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

    border-radius:14px;

    background:#fff;

    box-shadow:
        0 18px 42px rgba(16,53,36,.06);

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


.lion-tt-solution-card:hover{
    transform:translateY(-8px);

    border-color:rgba(214,154,27,.36);

    box-shadow:
        0 27px 55px rgba(16,53,36,.11);
}


.lion-tt-solution-card::before{
    content:"";

    width:78px;
    height:4px;

    position:absolute;

    top:0;
    left:25px;

    border-radius:0 0 15px 15px;

    background:
        linear-gradient(
            90deg,
            var(--tt-gold-dark),
            var(--tt-gold-light)
        );
}


.lion-tt-card-number{
    position:absolute;

    top:17px;
    right:18px;

    color:rgba(9,49,33,.065);

    font-family:"Oswald",sans-serif;

    font-size:55px;
    line-height:1;

    font-weight:700;
}


.lion-tt-solution-icon{
    width:58px;
    height:58px;

    min-width:58px;
    min-height:58px;

    margin-bottom:35px;

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

    border-radius:50%;

    color:var(--tt-green-950);

    background:
        linear-gradient(
            145deg,
            var(--tt-gold-light),
            var(--tt-gold)
        );
}


.lion-tt-solution-card h3{
    margin:0 0 13px;

    color:var(--tt-title);

    font-family:"Oswald",sans-serif;

    font-size:26px;
}


.lion-tt-solution-card p{
    margin:0;

    color:var(--tt-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   IMPORTANCE
========================================================= */

.lion-tt-importance{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    color:#fff;

    background:
        linear-gradient(
            115deg,
            var(--tt-green-950),
            var(--tt-green-700)
        );
}


.lion-tt-importance-rings{
    width:420px;
    height:420px;

    position:absolute;

    left:-170px;
    bottom:-240px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.12);

    box-shadow:
        0 0 0 40px rgba(255,255,255,.013),
        0 0 0 80px rgba(242,191,63,.022),
        0 0 0 120px rgba(255,255,255,.010);
}


.lion-tt-importance-grid{
    display:grid;

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

    align-items:center;

    gap:70px;
}


.lion-tt-dark-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--tt-gold-light);

    font-size:14px;
    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-tt-dark-label span{
    width:36px;
    height:3px;

    background:var(--tt-gold);
}


.lion-tt-importance-copy h2{
    margin:0 0 21px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.7vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-tt-importance-copy h2 strong{
    display:block;

    color:var(--tt-gold);
}


.lion-tt-importance-copy > p{
    margin:0 0 17px;

    color:rgba(255,255,255,.67);

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


.lion-tt-importance-list{
    margin-top:26px;

    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-tt-importance-list > div{
    padding:14px;

    display:flex;
    align-items:flex-start;

    gap:13px;

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

    border-radius:9px;

    background:rgba(255,255,255,.045);
}


.lion-tt-importance-list > div > span{
    width:43px;
    height:43px;

    min-width:43px;

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

    border-radius:50%;

    color:var(--tt-green-950);

    background:var(--tt-gold);
}


.lion-tt-importance-list strong{
    display:block;

    margin-bottom:4px;

    color:#fff;

    font-size:15px;
}


.lion-tt-importance-list p{
    margin:0;

    color:rgba(255,255,255,.58);

    font-size:14px;
    line-height:1.6;
}


/* VISUAL */

.lion-tt-importance-visual{
    min-height:520px;

    position:relative;
    overflow:hidden;

    border-radius:17px;

    box-shadow:
        0 28px 70px rgba(0,0,0,.25);
}


.lion-tt-importance-image{
    position:absolute;
    inset:0;

    background-size:cover;
    background-position:center;

    transition:transform .7s ease;
}


.lion-tt-importance-image::after{
    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(3,20,13,.05),
            rgba(3,20,13,.68)
        );
}


.lion-tt-importance-visual:hover
.lion-tt-importance-image{
    transform:scale(1.04);
}


.lion-tt-importance-card{
    max-width:330px;

    position:absolute;

    left:25px;
    bottom:25px;

    z-index:3;

    padding:16px;

    display:flex;
    align-items:center;

    gap:13px;

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

    border-radius:10px;

    background:rgba(5,28,19,.88);

    backdrop-filter:blur(9px);
}


.lion-tt-importance-card > span{
    width:48px;
    height:48px;

    min-width:48px;

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

    border-radius:50%;

    color:var(--tt-green-950);

    background:var(--tt-gold);
}


.lion-tt-importance-card small{
    display:block;

    color:rgba(255,255,255,.54);

    font-size:14px;
}


.lion-tt-importance-card strong{
    display:block;

    margin-top:3px;

    color:#fff;

    font-size:15px;
}


/* =========================================================
   PROCESS
========================================================= */

.lion-tt-process{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-tt-process-tree{
    position:absolute;

    right:-60px;
    bottom:-100px;

    color:rgba(13,57,39,.025);

    font-size:350px;
}


.lion-tt-process-heading{
    max-width:800px;

    margin:0 auto 75px;

    text-align:center;
}


.lion-tt-process-wrap{
    max-width:1150px;

    margin:0 auto;

    position:relative;

    display:grid;

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


.lion-tt-process-line{
    height:4px;

    position:absolute;

    top:39px;
    left:10%;
    right:10%;

    overflow:hidden;

    border-radius:20px;

    background:#dce5de;
}


.lion-tt-process-progress{
    width:0%;
    height:100%;

    background:
        linear-gradient(
            90deg,
            var(--tt-gold),
            var(--tt-green-600)
        );

    transition:width .15s linear;
}


.lion-tt-process-step{
    position:relative;
    z-index:2;

    padding:0 14px;

    text-align:center;

    opacity:.35;

    transform:translateY(20px);

    transition:
        opacity .6s ease,
        transform .6s ease;
}


.lion-tt-process-step.lion-tt-step-visible{
    opacity:1;
    transform:none;
}


.lion-tt-process-node{
    width:78px;
    height:78px;

    margin:0 auto 24px;

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

    border-radius:50%;

    border:1px solid rgba(40,107,73,.18);

    background:#fff;
}


.lion-tt-process-node span{
    width:52px;
    height:52px;

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

    border-radius:50%;

    color:var(--tt-green-950);

    background:#dce5de;

    font-family:"Oswald",sans-serif;

    font-size:18px;
}


.lion-tt-process-step.lion-tt-step-visible
.lion-tt-process-node span{
    background:var(--tt-gold);
}


.lion-tt-process-icon{
    width:41px;
    height:41px;

    margin:0 auto 14px;

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

    border-radius:50%;

    color:#fff;

    background:var(--tt-green-700);
}


.lion-tt-process-card h3{
    margin:0 0 9px;

    color:var(--tt-title);

    font-family:"Oswald",sans-serif;

    font-size:22px;
}


.lion-tt-process-card p{
    margin:0;

    color:var(--tt-text);

    font-size:14px;
    line-height:1.65;
}


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

.lion-tt-benefits{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    background:var(--tt-soft);
}


.lion-tt-benefits-rings{
    width:330px;
    height:330px;

    position:absolute;

    right:-155px;
    top:-130px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 40px rgba(40,107,73,.016),
        0 0 0 80px rgba(242,191,63,.02);
}


.lion-tt-benefits-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    gap:70px;
}


.lion-tt-benefits-heading{
    position:sticky;

    top:130px;
}


.lion-tt-benefits-heading > p{
    margin:0;

    color:var(--tt-text);

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


.lion-tt-benefits-list{
    display:grid;

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

    gap:14px;
}


.lion-tt-benefit{
    min-height:230px;

    padding:24px;

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

    border-radius:13px;

    background:#fff;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.lion-tt-benefit:hover{
    transform:translateY(-6px);

    box-shadow:
        0 22px 45px rgba(15,52,35,.09);
}


.lion-tt-benefit > span{
    width:52px;
    height:52px;

    margin-bottom:27px;

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

    border-radius:50%;

    color:var(--tt-green-950);

    background:var(--tt-gold);
}


.lion-tt-benefit h3{
    margin:0 0 10px;

    color:var(--tt-title);

    font-family:"Oswald",sans-serif;

    font-size:24px;
}


.lion-tt-benefit p{
    margin:0;

    color:var(--tt-text);

    font-size:14px;
    line-height:1.7;
}


/* =========================================================
   RELATED
========================================================= */

.lion-tt-related{
    padding:105px 0;

    background:#fff;
}


.lion-tt-related-heading{
    max-width:780px;

    margin:0 auto 48px;

    text-align:center;
}


.lion-tt-related-grid{
    display:grid;

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

    gap:15px;
}


.lion-tt-related-card{
    min-height:130px;

    padding:19px;

    display:grid;

    grid-template-columns:
        auto 1fr auto;

    align-items:center;

    gap:14px;

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

    border-radius:12px;

    background:var(--tt-soft);

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.lion-tt-related-card:hover{
    transform:translateY(-5px);

    background:#fff;

    box-shadow:
        0 20px 42px rgba(16,53,36,.09);
}


.lion-tt-related-icon{
    width:50px;
    height:50px;

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

    border-radius:50%;

    color:var(--tt-green-950);

    background:var(--tt-gold);
}


.lion-tt-related-card small{
    display:block;

    color:var(--tt-gold-dark);

    font-size:14px;
    font-weight:800;

    text-transform:uppercase;
}


.lion-tt-related-card h3{
    margin:3px 0 0;

    color:var(--tt-title);

    font-family:"Oswald",sans-serif;

    font-size:21px;
}


.lion-tt-related-arrow{
    width:38px;
    height:38px;

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

    border-radius:50%;

    color:#fff;

    background:var(--tt-green-700);

    transition:
        transform .3s ease,
        background .3s ease;
}


.lion-tt-related-card:hover
.lion-tt-related-arrow{
    transform:translateX(3px);

    color:var(--tt-green-950);

    background:var(--tt-gold);
}


/* =========================================================
   FAQ
========================================================= */

.lion-tt-faq{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    background:var(--tt-soft);
}


.lion-tt-faq-tree{
    position:absolute;

    left:-70px;
    bottom:-95px;

    color:rgba(12,55,37,.025);

    font-size:340px;
}


.lion-tt-faq-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    gap:70px;
}


.lion-tt-faq-heading{
    position:sticky;
    top:130px;
}


.lion-tt-faq-heading > p{
    margin:0;

    color:var(--tt-text);

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


.lion-tt-faq-list{
    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-tt-faq-item{
    overflow:hidden;

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

    border-radius:10px;

    background:#fff;
}


.lion-tt-faq-question{
    width:100%;
    min-height:74px;

    padding:15px 18px;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    gap:20px;

    border:0;

    color:var(--tt-title);

    background:#fff;

    font-family:"DM Sans",Arial,sans-serif;

    font-size:15px;
    line-height:1.4;

    font-weight:800;

    text-align:left;

    cursor:pointer;
}


.lion-tt-faq-question > i{
    width:34px !important;
    height:34px !important;

    min-width:34px;

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

    border-radius:50%;

    color:var(--tt-green-950);

    background:var(--tt-gold);

    font-size:12px;

    transition:transform .3s ease;
}


.lion-tt-faq-item.lion-tt-faq-open
.lion-tt-faq-question > i{
    transform:rotate(45deg);
}


.lion-tt-faq-answer{
    max-height:0;

    overflow:hidden;

    transition:max-height .45s ease;
}


.lion-tt-faq-answer > div{
    padding:0 18px 20px;
}


.lion-tt-faq-answer p{
    margin:0;

    padding-top:15px;

    border-top:1px solid #e6ebe7;

    color:var(--tt-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   CLOSING
========================================================= */

.lion-tt-closing{
    padding:0 0 100px;

    background:var(--tt-soft);
}


.lion-tt-closing-inner{
    padding:38px 42px;

    display:grid;

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

    align-items:center;

    gap:26px;

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

    border-radius:14px;

    background:#fff;
}


.lion-tt-closing-icon{
    width:80px;
    height:80px;

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

    border-radius:50%;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            var(--tt-green-700),
            var(--tt-green-950)
        );
}


.lion-tt-closing-small{
    display:block;

    margin-bottom:4px;

    color:var(--tt-gold-dark);

    font-size:14px;
    font-weight:800;

    text-transform:uppercase;
}


.lion-tt-closing h2{
    margin:0 0 9px;

    color:var(--tt-title);

    font-family:"Oswald",sans-serif;

    font-size:clamp(30px,3.5vw,45px);

    text-transform:uppercase;
}


.lion-tt-closing h2 strong{
    color:var(--tt-green-600);
}


.lion-tt-closing p{
    margin:0;

    color:var(--tt-text);

    font-size:14px;
    line-height:1.75;
}


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

.lion-tt-reveal{
    opacity:0;

    transform:translateY(35px);

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


.lion-tt-reveal.lion-tt-visible{
    opacity:1;

    transform:none;
}


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

@media(max-width:1050px){

    .lion-tt-intro-grid{
        grid-template-columns:1fr 1fr;
        gap:45px;
    }

    .lion-tt-solutions-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .lion-tt-importance-grid,
    .lion-tt-benefits-grid,
    .lion-tt-faq-grid{
        grid-template-columns:1fr 1fr;
        gap:45px;
    }

    .lion-tt-process-wrap{
        grid-template-columns:
            repeat(3,minmax(0,1fr));

        row-gap:45px;
    }

    .lion-tt-process-line{
        display:none;
    }

    .lion-tt-related-grid{
        grid-template-columns:1fr;
    }

}


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

@media(max-width:767px){

    .lion-tt-container{
        width:calc(100% - 28px);
    }


    .lion-tt-hero{
        min-height:390px;

        padding:78px 0 68px;
    }


    .lion-tt-hero h1{
        font-size:clamp(48px,15vw,70px);
    }


    .lion-tt-hero-content > p{
        font-size:14px;
    }


    .lion-tt-intro,
    .lion-tt-solutions,
    .lion-tt-importance,
    .lion-tt-process,
    .lion-tt-benefits,
    .lion-tt-related,
    .lion-tt-faq{
        padding:75px 0;
    }


    .lion-tt-intro-grid,
    .lion-tt-importance-grid,
    .lion-tt-benefits-grid,
    .lion-tt-faq-grid{
        grid-template-columns:1fr;
        gap:40px;
    }


    .lion-tt-intro-visual{
        min-height:510px;
    }


    .lion-tt-main-image{
        width:88%;
        height:430px;
    }


    .lion-tt-secondary-image{
        width:46%;
        height:215px;
    }


    .lion-tt-intro-features{
        grid-template-columns:1fr;
    }


    .lion-tt-solutions-grid{
        grid-template-columns:1fr;
    }


    .lion-tt-importance-visual{
        min-height:430px;
    }


    .lion-tt-process-wrap{
        grid-template-columns:1fr;

        gap:30px;
    }


    .lion-tt-process-step{
        padding:0;

        display:grid;

        grid-template-columns:
            65px 1fr;

        gap:14px;

        text-align:left;
    }


    .lion-tt-process-node{
        width:60px;
        height:60px;

        margin:0;

        grid-row:1 / span 2;
    }


    .lion-tt-process-node span{
        width:43px;
        height:43px;
    }


    .lion-tt-process-icon{
        margin:0 0 10px;
    }


    .lion-tt-benefits-heading,
    .lion-tt-faq-heading{
        position:static;
    }


    .lion-tt-benefits-list{
        grid-template-columns:1fr;
    }


    .lion-tt-closing{
        padding-bottom:70px;
    }


    .lion-tt-closing-inner{
        padding:26px 22px;

        grid-template-columns:1fr;

        gap:20px;
    }

}


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

@media(max-width:420px){

    .lion-tt-container{
        width:calc(100% - 20px);
    }


    .lion-tt-intro-visual{
        min-height:450px;
    }


    .lion-tt-main-image{
        height:385px;
    }


    .lion-tt-secondary-image{
        height:180px;
    }


    .lion-tt-visual-badge{
        min-width:190px;

        left:15px;
        bottom:15px;
    }


    .lion-tt-importance-card{
        left:15px;
        right:15px;
        bottom:15px;

        max-width:none;
    }

}


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

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

    .lion-tt-reveal,
    .lion-tt-process-step,
    .lion-tt-process-progress{
        transition:none !important;
    }


    .lion-tt-reveal{
        opacity:1;
        transform:none;
    }


    .lion-tt-process-step{
        opacity:1;
        transform:none;
    }

}


/* =========================================================
   LION TREE SERVICE & LANDSCAPING LLC
   EMERGENCY TREE SERVICE PAGE
========================================================= */

:root{
    --es-green-950:#04170f;
    --es-green-900:#071f16;
    --es-green-800:#0b3123;
    --es-green-700:#164a35;
    --es-green-600:#286b49;

    --es-gold:#f2bf3f;
    --es-gold-dark:#d69a1b;
    --es-gold-light:#ffe198;

    --es-white:#ffffff;
    --es-soft:#f5f8f5;
    --es-soft-2:#edf2ed;

    --es-title:#10271c;
    --es-text:#526158;
    --es-border:#dfe7e1;

    --es-alert:#c98b15;
}


/* =========================================================
   GLOBAL
========================================================= */

.lion-es-container{
    width:min(92%,1380px);
    margin:0 auto;
    position:relative;
    z-index:3;
}


.lion-es-hero *,
.lion-es-intro *,
.lion-es-situations *,
.lion-es-availability *,
.lion-es-process *,
.lion-es-why *,
.lion-es-property *,
.lion-es-safety *,
.lion-es-related *,
.lion-es-faq *,
.lion-es-closing *{
    box-sizing:border-box;
}


.lion-es-hero i,
.lion-es-intro i,
.lion-es-situations i,
.lion-es-availability i,
.lion-es-process i,
.lion-es-why i,
.lion-es-property i,
.lion-es-safety i,
.lion-es-related i,
.lion-es-faq i,
.lion-es-closing i{
    position:static !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1 !important;
}


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

.lion-es-hero{
    min-height:470px;
    padding:110px 0 100px;

    position:relative;
    overflow:hidden;

    display:flex;
    align-items:center;

    background:
        linear-gradient(
            105deg,
            rgba(3,20,13,.985),
            rgba(7,49,34,.95) 58%,
            rgba(27,76,54,.89)
        ),
        url("https://images.unsplash.com/photo-1511497584788-876760111969?auto=format&fit=crop&w=2000&q=85");

    background-size:cover;
    background-position:center;
}


.lion-es-hero::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 73% 17%,
            rgba(242,191,63,.16),
            transparent 26%
        );
}


.lion-es-hero-rings{
    width:470px;
    height:470px;

    position:absolute;

    right:-160px;
    bottom:-245px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.15);

    box-shadow:
        0 0 0 45px rgba(255,255,255,.016),
        0 0 0 90px rgba(242,191,63,.025),
        0 0 0 135px rgba(255,255,255,.012);
}


.lion-es-hero-rings::before,
.lion-es-hero-rings::after{
    content:"";

    position:absolute;

    border-radius:50%;

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


.lion-es-hero-rings::before{
    inset:62px;
}


.lion-es-hero-rings::after{
    inset:130px;
}


.lion-es-hero-tree{
    position:absolute;

    right:8%;
    bottom:-95px;

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

    font-size:355px;

    pointer-events:none;
}


.lion-es-hero-bolt{
    position:absolute;

    right:32%;
    top:90px;

    color:rgba(242,191,63,.06);

    font-size:115px;

    transform:rotate(8deg);

    pointer-events:none;
}


.lion-es-hero-content{
    max-width:890px;
}


.lion-es-eyebrow{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--es-gold-light);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.3px;
}


.lion-es-eyebrow-line{
    width:38px;
    height:3px;

    flex:0 0 38px;

    border-radius:20px;

    background:var(--es-gold);
}


.lion-es-eyebrow-icon{
    width:33px;
    height:33px;

    min-width:33px;
    min-height:33px;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--es-green-950);

    background:var(--es-gold);

    box-shadow:
        0 0 0 7px rgba(242,191,63,.10);
}


.lion-es-eyebrow-icon i{
    width:15px !important;
    height:15px !important;

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

    font-size:13px;
}


.lion-es-hero h1{
    margin:0 0 20px;

    max-width:950px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(54px,7vw,92px);
    line-height:.98;

    font-weight:700;

    text-transform:uppercase;
}


.lion-es-hero h1 span{
    display:block;

    color:var(--es-gold);
}


.lion-es-hero-content > p{
    max-width:750px;

    margin:0 0 28px;

    color:rgba(255,255,255,.75);

    font-size:16px;
    line-height:1.75;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.lion-es-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:11px;
}


.lion-es-breadcrumb a,
.lion-es-breadcrumb > span{
    min-height:38px;

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

    gap:8px;

    color:rgba(255,255,255,.70);

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

    font-weight:700;
}


.lion-es-breadcrumb a{
    transition:color .25s ease;
}


.lion-es-breadcrumb a:hover{
    color:var(--es-gold-light);
}


.lion-es-breadcrumb a i{
    color:var(--es-gold);
}


.lion-es-breadcrumb-divider{
    min-height:auto !important;

    color:rgba(255,255,255,.28) !important;
}


.lion-es-breadcrumb-divider i{
    font-size:10px;
}


.lion-es-breadcrumb span[aria-current="page"]{
    color:var(--es-gold-light);
}


/* =========================================================
   SECTION LABEL
========================================================= */

.lion-es-section-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--es-green-600);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-es-section-label > span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:var(--es-gold);
}


.lion-es-section-label-center{
    justify-content:center;
}


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

.lion-es-intro{
    padding:110px 0;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-es-intro::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 5% 15%,
            rgba(242,191,63,.08),
            transparent 20%
        ),
        radial-gradient(
            circle at 95% 85%,
            rgba(40,107,73,.045),
            transparent 22%
        );
}


.lion-es-intro-rings{
    width:340px;
    height:340px;

    position:absolute;

    right:-170px;
    bottom:-155px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 45px rgba(40,107,73,.018),
        0 0 0 90px rgba(242,191,63,.02);
}


.lion-es-intro-grid{
    display:grid;

    grid-template-columns:
        minmax(420px,.92fr)
        minmax(0,1.08fr);

    align-items:center;

    gap:clamp(55px,7vw,100px);
}


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

.lion-es-intro-visual{
    min-height:620px;

    position:relative;
}


.lion-es-main-image{
    width:83%;
    height:540px;

    position:absolute;

    left:0;
    top:0;

    overflow:hidden;

    border-radius:16px;

    box-shadow:
        0 28px 60px rgba(13,52,35,.15);
}


.lion-es-main-image img,
.lion-es-secondary-image img{
    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

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


.lion-es-main-image:hover img,
.lion-es-secondary-image:hover img{
    transform:scale(1.05);
}


.lion-es-secondary-image{
    width:47%;
    height:255px;

    position:absolute;

    right:0;
    bottom:0;

    overflow:hidden;

    border:7px solid #fff;

    border-radius:14px;

    box-shadow:
        0 20px 45px rgba(13,52,35,.14);
}


.lion-es-availability-card{
    min-width:235px;
    min-height:82px;

    padding:14px 16px;

    position:absolute;

    left:28px;
    bottom:30px;

    z-index:5;

    display:flex;
    align-items:center;

    gap:12px;

    border-radius:10px;

    color:#fff;

    background:
        linear-gradient(
            120deg,
            var(--es-green-950),
            var(--es-green-700)
        );

    box-shadow:
        0 18px 40px rgba(0,0,0,.23);
}


.lion-es-availability-icon{
    width:45px;
    height:45px;

    min-width:45px;
    min-height:45px;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--es-green-950);

    background:var(--es-gold);
}


.lion-es-availability-icon i{
    width:18px !important;
    height:18px !important;

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

    font-size:15px;
}


.lion-es-availability-card small{
    display:block;

    color:rgba(255,255,255,.58);

    font-size:14px;
}


.lion-es-availability-card strong{
    display:block;

    margin-top:2px;

    color:#fff;

    font-family:"Oswald",sans-serif;

    font-size:20px;
    line-height:1.2;
}


.lion-es-pulse-ring{
    width:180px;
    height:180px;

    position:absolute;

    right:20px;
    top:25px;

    z-index:-1;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.20);

    box-shadow:
        0 0 0 22px rgba(242,191,63,.03),
        0 0 0 44px rgba(40,107,73,.025);
}


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

.lion-es-intro-copy h2,
.lion-es-why-heading h2,
.lion-es-faq-heading h2{
    margin:0 0 25px;

    color:var(--es-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.6vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-es-intro-copy h2 strong,
.lion-es-why-heading h2 strong,
.lion-es-faq-heading h2 strong{
    display:block;

    color:var(--es-green-600);
}


.lion-es-intro-copy > p{
    margin:0 0 18px;

    color:var(--es-text);

    font-size:15px;
    line-height:1.85;

    text-align:justify;
}


.lion-es-intro-features{
    margin-top:28px;

    display:grid;

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

    gap:10px;
}


.lion-es-intro-features > div{
    min-height:52px;

    padding:10px 12px;

    display:flex;
    align-items:center;

    gap:10px;

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

    border-radius:8px;

    color:#56665c;

    background:var(--es-soft);

    font-size:14px;
    font-weight:700;
}


.lion-es-intro-features > div > span{
    width:25px;
    height:25px;

    min-width:25px;
    min-height:25px;

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

    border-radius:50%;

    color:var(--es-green-700);

    background:rgba(40,107,73,.09);
}


.lion-es-intro-features > div > span i{
    width:11px !important;
    height:11px !important;

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

    font-size:9px;
}


/* =========================================================
   SITUATIONS
========================================================= */

.lion-es-situations{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:var(--es-soft);
}


.lion-es-situations::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 8% 15%,
            rgba(40,107,73,.04),
            transparent 21%
        ),
        radial-gradient(
            circle at 92% 84%,
            rgba(242,191,63,.055),
            transparent 23%
        );
}


.lion-es-situations-tree{
    position:absolute;

    left:-70px;
    top:300px;

    color:rgba(11,54,37,.03);

    font-size:310px;

    pointer-events:none;
}


.lion-es-situations-leaf{
    position:absolute;

    right:4%;
    bottom:80px;

    color:rgba(11,54,37,.03);

    font-size:110px;

    transform:rotate(25deg);

    pointer-events:none;
}


.lion-es-situations-heading{
    max-width:850px;

    margin:0 auto 55px;

    text-align:center;
}


.lion-es-situations-heading h2,
.lion-es-process-heading h2,
.lion-es-related-heading h2{
    margin:0 0 18px;

    color:var(--es-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(42px,5vw,68px);
    line-height:1.03;

    text-transform:uppercase;
}


.lion-es-situations-heading h2 strong,
.lion-es-process-heading h2 strong,
.lion-es-related-heading h2 strong{
    display:block;

    color:var(--es-green-600);
}


.lion-es-situations-heading p,
.lion-es-process-heading p{
    max-width:680px;

    margin:0 auto;

    color:var(--es-text);

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


.lion-es-situations-grid{
    display:grid;

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

    gap:18px;
}


.lion-es-situation-card{
    min-height:305px;

    padding:28px 25px;

    position:relative;
    overflow:hidden;

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

    border-radius:14px;

    background:#fff;

    box-shadow:
        0 18px 42px rgba(16,53,36,.06);

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


.lion-es-situation-card:hover{
    transform:translateY(-8px);

    border-color:rgba(214,154,27,.36);

    box-shadow:
        0 27px 55px rgba(16,53,36,.11);
}


.lion-es-situation-card::before{
    content:"";

    width:80px;
    height:4px;

    position:absolute;

    top:0;
    left:25px;

    border-radius:0 0 15px 15px;

    background:
        linear-gradient(
            90deg,
            var(--es-gold-dark),
            var(--es-gold-light)
        );
}


.lion-es-card-number{
    position:absolute;

    top:17px;
    right:18px;

    color:rgba(9,49,33,.065);

    font-family:"Oswald",sans-serif;

    font-size:55px;
    line-height:1;

    font-weight:700;
}


.lion-es-situation-icon{
    width:58px;
    height:58px;

    min-width:58px;
    min-height:58px;

    margin-bottom:35px;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--es-green-950);

    background:
        linear-gradient(
            145deg,
            var(--es-gold-light),
            var(--es-gold)
        );
}


.lion-es-situation-icon i{
    width:22px !important;
    height:22px !important;

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

    font-size:18px;
}


.lion-es-situation-card h3{
    margin:0 0 13px;

    color:var(--es-title);

    font-family:"Oswald",sans-serif;

    font-size:26px;
    line-height:1.2;
}


.lion-es-situation-card p{
    margin:0;

    color:var(--es-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   24/7 AVAILABILITY
========================================================= */

.lion-es-availability{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    color:#fff;

    background:
        linear-gradient(
            115deg,
            var(--es-green-950),
            var(--es-green-700)
        );
}


.lion-es-availability::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(242,191,63,.12),
            transparent 28%
        );
}


.lion-es-availability-rings{
    width:420px;
    height:420px;

    position:absolute;

    left:-170px;
    bottom:-240px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.12);

    box-shadow:
        0 0 0 40px rgba(255,255,255,.013),
        0 0 0 80px rgba(242,191,63,.022),
        0 0 0 120px rgba(255,255,255,.010);
}


.lion-es-availability-grid{
    display:grid;

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

    align-items:center;

    gap:70px;
}


.lion-es-dark-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--es-gold-light);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-es-dark-label span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:var(--es-gold);
}


.lion-es-availability-copy h2,
.lion-es-property-copy h2{
    margin:0 0 21px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.7vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-es-availability-copy h2 strong,
.lion-es-property-copy h2 strong{
    display:block;

    color:var(--es-gold);
}


.lion-es-availability-copy > p,
.lion-es-property-copy > p{
    margin:0 0 17px;

    color:rgba(255,255,255,.67);

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


.lion-es-availability-list{
    margin-top:27px;

    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-es-availability-list > div{
    min-height:82px;

    padding:14px;

    display:flex;
    align-items:flex-start;

    gap:13px;

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

    border-radius:9px;

    background:rgba(255,255,255,.045);
}


.lion-es-availability-list > div > span{
    width:43px;
    height:43px;

    min-width:43px;
    min-height:43px;

    flex:0 0 43px;

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

    border-radius:50%;

    color:var(--es-green-950);

    background:var(--es-gold);
}


.lion-es-availability-list > div > span i{
    width:17px !important;
    height:17px !important;

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

    font-size:14px;
}


.lion-es-availability-list strong{
    display:block;

    margin-bottom:4px;

    color:#fff;

    font-size:15px;
}


.lion-es-availability-list p{
    margin:0;

    color:rgba(255,255,255,.58);

    font-size:14px;
    line-height:1.6;
}


/* AVAILABILITY VISUAL */

.lion-es-availability-visual{
    min-height:530px;

    position:relative;
    overflow:hidden;

    border-radius:17px;

    box-shadow:
        0 28px 70px rgba(0,0,0,.25);
}


.lion-es-availability-image{
    position:absolute;
    inset:0;

    background-size:cover;
    background-position:center;

    transition:transform .7s ease;
}


.lion-es-availability-image::after{
    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(3,20,13,.04),
            rgba(3,20,13,.72)
        );
}


.lion-es-availability-visual:hover
.lion-es-availability-image{
    transform:scale(1.04);
}


.lion-es-clock-card{
    min-width:245px;

    position:absolute;

    left:25px;
    bottom:25px;

    z-index:3;

    padding:18px;

    display:flex;
    align-items:center;

    gap:14px;

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

    border-radius:11px;

    background:rgba(5,28,19,.90);

    backdrop-filter:blur(9px);
}


.lion-es-clock-icon{
    width:58px;
    height:58px;

    min-width:58px;
    min-height:58px;

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

    border-radius:50%;

    color:var(--es-green-950);

    background:var(--es-gold);
}


.lion-es-clock-icon i{
    width:22px !important;
    height:22px !important;

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

    font-size:19px;
}


.lion-es-clock-card small{
    display:block;

    color:rgba(255,255,255,.55);

    font-size:14px;
}


.lion-es-clock-card strong{
    display:block;

    margin:2px 0;

    color:#fff;

    font-family:"Oswald",sans-serif;

    font-size:28px;
    line-height:1;
}


.lion-es-clock-card p{
    margin:0;

    color:rgba(255,255,255,.65);

    font-size:14px;
}


.lion-es-visual-alert{
    min-height:36px;

    padding:0 13px;

    position:absolute;

    top:20px;
    right:20px;

    z-index:4;

    display:flex;
    align-items:center;

    gap:8px;

    border-radius:20px;

    color:var(--es-green-950);

    background:var(--es-gold);

    font-size:14px;
    font-weight:800;

    box-shadow:
        0 10px 25px rgba(0,0,0,.18);
}


/* =========================================================
   PROCESS
========================================================= */

.lion-es-process{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-es-process-tree{
    position:absolute;

    right:-60px;
    bottom:-100px;

    color:rgba(13,57,39,.025);

    font-size:350px;

    pointer-events:none;
}


.lion-es-process-heading{
    max-width:830px;

    margin:0 auto 75px;

    text-align:center;
}


.lion-es-process-wrap{
    max-width:1150px;

    margin:0 auto;

    position:relative;

    display:grid;

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

    gap:0;
}


.lion-es-process-line{
    height:4px;

    position:absolute;

    top:39px;
    left:10%;
    right:10%;

    overflow:hidden;

    border-radius:20px;

    background:#dce5de;
}


.lion-es-process-progress{
    width:0%;
    height:100%;

    border-radius:20px;

    background:
        linear-gradient(
            90deg,
            var(--es-gold),
            var(--es-green-600)
        );

    transition:width .15s linear;
}


.lion-es-process-step{
    position:relative;

    z-index:2;

    padding:0 14px;

    text-align:center;

    opacity:.35;

    transform:translateY(20px);

    transition:
        opacity .6s ease,
        transform .6s ease;
}


.lion-es-process-step.lion-es-step-visible{
    opacity:1;
    transform:translateY(0);
}


.lion-es-process-node{
    width:78px;
    height:78px;

    margin:0 auto 24px;

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

    border-radius:50%;

    border:1px solid rgba(40,107,73,.18);

    background:#fff;

    box-shadow:
        0 8px 20px rgba(17,54,37,.07);
}


.lion-es-process-node span{
    width:52px;
    height:52px;

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

    border-radius:50%;

    color:var(--es-green-950);

    background:#dce5de;

    font-family:"Oswald",sans-serif;

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

    transition:background .4s ease;
}


.lion-es-process-step.lion-es-step-visible
.lion-es-process-node span{
    background:var(--es-gold);
}


.lion-es-process-icon{
    width:41px;
    height:41px;

    min-width:41px;
    min-height:41px;

    margin:0 auto 14px;

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

    border-radius:50%;

    color:#fff;

    background:var(--es-green-700);
}


.lion-es-process-icon i{
    width:16px !important;
    height:16px !important;

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

    font-size:13px;
}


.lion-es-process-card h3{
    margin:0 0 9px;

    color:var(--es-title);

    font-family:"Oswald",sans-serif;

    font-size:22px;
    line-height:1.2;
}


.lion-es-process-card p{
    margin:0;

    color:var(--es-text);

    font-size:14px;
    line-height:1.65;
}


/* =========================================================
   WHY CHOOSE US
========================================================= */

.lion-es-why{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    background:var(--es-soft);
}


.lion-es-why-rings{
    width:330px;
    height:330px;

    position:absolute;

    right:-155px;
    top:-130px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 40px rgba(40,107,73,.016),
        0 0 0 80px rgba(242,191,63,.02);
}


.lion-es-why-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    align-items:start;

    gap:70px;
}


.lion-es-why-heading{
    position:sticky;
    top:130px;
}


.lion-es-why-heading > p{
    margin:0;

    color:var(--es-text);

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


.lion-es-why-list{
    display:grid;

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

    gap:14px;
}


.lion-es-why-card{
    min-height:270px;

    padding:24px;

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

    border-radius:13px;

    background:#fff;

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


.lion-es-why-card:hover{
    transform:translateY(-7px);

    border-color:rgba(214,154,27,.35);

    box-shadow:
        0 22px 45px rgba(15,52,35,.09);
}


.lion-es-why-icon{
    width:55px;
    height:55px;

    min-width:55px;
    min-height:55px;

    margin-bottom:28px;

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

    border-radius:50%;

    color:var(--es-green-950);

    background:var(--es-gold);
}


.lion-es-why-icon i{
    width:21px !important;
    height:21px !important;

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

    font-size:18px;
}


.lion-es-why-card small{
    display:block;

    margin-bottom:5px;

    color:var(--es-gold-dark);

    font-size:14px;
    font-weight:800;

    text-transform:uppercase;
}


.lion-es-why-card h3{
    margin:0 0 10px;

    color:var(--es-title);

    font-family:"Oswald",sans-serif;

    font-size:24px;
    line-height:1.2;
}


.lion-es-why-card p{
    margin:0;

    color:var(--es-text);

    font-size:14px;
    line-height:1.7;
}


/* =========================================================
   PROPERTY
========================================================= */

.lion-es-property{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    color:#fff;

    background:
        linear-gradient(
            115deg,
            var(--es-green-950),
            var(--es-green-700)
        );
}


.lion-es-property-rings{
    width:390px;
    height:390px;

    position:absolute;

    right:-170px;
    bottom:-220px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.12);

    box-shadow:
        0 0 0 40px rgba(255,255,255,.013),
        0 0 0 80px rgba(242,191,63,.022);
}


.lion-es-property-grid{
    display:grid;

    grid-template-columns:
        minmax(450px,.95fr)
        minmax(0,1.05fr);

    align-items:center;

    gap:70px;
}


.lion-es-property-visual{
    min-height:520px;

    position:relative;
    overflow:hidden;

    border-radius:17px;

    box-shadow:
        0 28px 70px rgba(0,0,0,.25);
}


.lion-es-property-image{
    position:absolute;
    inset:0;

    background-size:cover;
    background-position:center;

    transition:transform .7s ease;
}


.lion-es-property-image::after{
    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(3,20,13,.04),
            rgba(3,20,13,.68)
        );
}


.lion-es-property-visual:hover
.lion-es-property-image{
    transform:scale(1.04);
}


.lion-es-property-card{
    max-width:330px;

    position:absolute;

    left:25px;
    bottom:25px;

    z-index:3;

    padding:16px;

    display:flex;
    align-items:center;

    gap:13px;

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

    border-radius:10px;

    background:rgba(5,28,19,.88);

    backdrop-filter:blur(9px);
}


.lion-es-property-card > span{
    width:48px;
    height:48px;

    min-width:48px;

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

    border-radius:50%;

    color:var(--es-green-950);

    background:var(--es-gold);
}


.lion-es-property-card small{
    display:block;

    color:rgba(255,255,255,.54);

    font-size:14px;
}


.lion-es-property-card strong{
    display:block;

    margin-top:3px;

    color:#fff;

    font-size:15px;
}


.lion-es-property-list{
    margin-top:27px;

    display:grid;

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

    gap:10px;
}


.lion-es-property-list > div{
    min-height:58px;

    padding:11px;

    display:flex;
    align-items:center;

    gap:10px;

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

    border-radius:8px;

    color:rgba(255,255,255,.80);

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

    font-size:14px;
    font-weight:700;
}


.lion-es-property-list > div > span{
    width:32px;
    height:32px;

    min-width:32px;

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

    border-radius:50%;

    color:var(--es-green-950);

    background:var(--es-gold);
}


/* =========================================================
   SAFETY
========================================================= */

.lion-es-safety{
    padding:70px 0;

    background:#fff;
}


.lion-es-safety-inner{
    padding:30px 34px;

    display:grid;

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

    align-items:center;

    gap:22px;

    border:1px solid rgba(214,154,27,.30);

    border-radius:14px;

    background:
        linear-gradient(
            110deg,
            #fffaf0,
            #f8faf7
        );

    box-shadow:
        0 15px 40px rgba(15,52,35,.06);
}


.lion-es-safety-icon{
    width:70px;
    height:70px;

    min-width:70px;
    min-height:70px;

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

    border-radius:50%;

    color:var(--es-green-950);

    background:var(--es-gold);
}


.lion-es-safety-icon i{
    width:27px !important;
    height:27px !important;

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

    font-size:24px;
}


.lion-es-safety-label{
    display:block;

    margin-bottom:4px;

    color:var(--es-gold-dark);

    font-size:14px;
    font-weight:800;

    text-transform:uppercase;
    letter-spacing:.7px;
}


.lion-es-safety h2{
    margin:0 0 8px;

    color:var(--es-title);

    font-family:"Oswald",sans-serif;

    font-size:clamp(26px,3vw,38px);
    line-height:1.15;

    text-transform:uppercase;
}


.lion-es-safety p{
    margin:0;

    max-width:1000px;

    color:var(--es-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   RELATED
========================================================= */

.lion-es-related{
    padding:105px 0;

    background:var(--es-soft);
}


.lion-es-related-heading{
    max-width:780px;

    margin:0 auto 48px;

    text-align:center;
}


.lion-es-related-grid{
    display:grid;

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

    gap:15px;
}


.lion-es-related-card{
    min-height:130px;

    padding:19px;

    display:grid;

    grid-template-columns:
        auto 1fr auto;

    align-items:center;

    gap:14px;

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

    border-radius:12px;

    background:#fff;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.lion-es-related-card:hover{
    transform:translateY(-5px);

    box-shadow:
        0 20px 42px rgba(16,53,36,.09);
}


.lion-es-related-icon{
    width:50px;
    height:50px;

    min-width:50px;

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

    border-radius:50%;

    color:var(--es-green-950);

    background:var(--es-gold);
}


.lion-es-related-card small{
    display:block;

    color:var(--es-gold-dark);

    font-size:14px;
    font-weight:800;

    text-transform:uppercase;
}


.lion-es-related-card h3{
    margin:3px 0 0;

    color:var(--es-title);

    font-family:"Oswald",sans-serif;

    font-size:21px;
    line-height:1.2;
}


.lion-es-related-arrow{
    width:38px;
    height:38px;

    min-width:38px;

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

    border-radius:50%;

    color:#fff;

    background:var(--es-green-700);

    transition:
        transform .3s ease,
        background .3s ease;
}


.lion-es-related-card:hover
.lion-es-related-arrow{
    transform:translateX(3px);

    color:var(--es-green-950);

    background:var(--es-gold);
}


/* =========================================================
   FAQ
========================================================= */

.lion-es-faq{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-es-faq-tree{
    position:absolute;

    left:-70px;
    bottom:-95px;

    color:rgba(12,55,37,.025);

    font-size:340px;

    pointer-events:none;
}


.lion-es-faq-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    align-items:start;

    gap:70px;
}


.lion-es-faq-heading{
    position:sticky;

    top:130px;
}


.lion-es-faq-heading > p{
    margin:0;

    color:var(--es-text);

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


.lion-es-faq-list{
    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-es-faq-item{
    overflow:hidden;

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

    border-radius:10px;

    background:var(--es-soft);
}


.lion-es-faq-question{
    width:100%;
    min-height:74px;

    padding:15px 18px;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    gap:20px;

    border:0;

    color:var(--es-title);

    background:transparent;

    font-family:"DM Sans",Arial,sans-serif;

    font-size:15px;
    line-height:1.4;

    font-weight:800;

    text-align:left;

    cursor:pointer;
}


.lion-es-faq-question > i{
    width:34px !important;
    height:34px !important;

    min-width:34px;

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

    border-radius:50%;

    color:var(--es-green-950);

    background:var(--es-gold);

    font-size:12px;

    transition:transform .3s ease;
}


.lion-es-faq-item.lion-es-faq-open
.lion-es-faq-question > i{
    transform:rotate(45deg);
}


.lion-es-faq-answer{
    max-height:0;

    overflow:hidden;

    transition:max-height .45s ease;
}


.lion-es-faq-answer > div{
    padding:0 18px 20px;
}


.lion-es-faq-answer p{
    margin:0;

    padding-top:15px;

    border-top:1px solid #e1e8e3;

    color:var(--es-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   CLOSING
========================================================= */

.lion-es-closing{
    padding:0 0 100px;

    background:#fff;
}


.lion-es-closing-inner{
    padding:38px 42px;

    display:grid;

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

    align-items:center;

    gap:26px;

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

    border-radius:14px;

    background:
        linear-gradient(
            110deg,
            var(--es-soft),
            #fff
        );
}


.lion-es-closing-icon{
    width:80px;
    height:80px;

    min-width:80px;
    min-height:80px;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--es-green-950);

    background:var(--es-gold);

    box-shadow:
        0 12px 25px rgba(214,154,27,.15);
}


.lion-es-closing-icon i{
    width:29px !important;
    height:29px !important;

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

    font-size:25px;
}


.lion-es-closing-small{
    display:block;

    margin-bottom:4px;

    color:var(--es-gold-dark);

    font-size:14px;
    font-weight:800;

    text-transform:uppercase;
    letter-spacing:.7px;
}


.lion-es-closing h2{
    margin:0 0 9px;

    color:var(--es-title);

    font-family:"Oswald",sans-serif;

    font-size:clamp(30px,3.5vw,45px);
    line-height:1.1;

    text-transform:uppercase;
}


.lion-es-closing h2 strong{
    color:var(--es-green-600);
}


.lion-es-closing p{
    max-width:850px;

    margin:0;

    color:var(--es-text);

    font-size:14px;
    line-height:1.75;
}


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

.lion-es-reveal{
    opacity:0;

    transform:translateY(35px);

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


.lion-es-reveal.lion-es-visible{
    opacity:1;
    transform:translateY(0);
}


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

@media(max-width:1050px){

    .lion-es-intro-grid{
        grid-template-columns:1fr 1fr;
        gap:45px;
    }


    .lion-es-situations-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .lion-es-availability-grid,
    .lion-es-why-grid,
    .lion-es-property-grid,
    .lion-es-faq-grid{
        grid-template-columns:1fr 1fr;
        gap:45px;
    }


    .lion-es-process-wrap{
        grid-template-columns:
            repeat(3,minmax(0,1fr));

        row-gap:45px;
    }


    .lion-es-process-line{
        display:none;
    }


    .lion-es-related-grid{
        grid-template-columns:1fr;
    }

}


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

@media(max-width:767px){

    .lion-es-container{
        width:calc(100% - 28px);
    }


    .lion-es-hero{
        min-height:405px;

        padding:80px 0 70px;
    }


    .lion-es-hero h1{
        font-size:clamp(46px,14.5vw,69px);
    }


    .lion-es-hero-content > p{
        font-size:14px;
    }


    .lion-es-intro,
    .lion-es-situations,
    .lion-es-availability,
    .lion-es-process,
    .lion-es-why,
    .lion-es-property,
    .lion-es-related,
    .lion-es-faq{
        padding:75px 0;
    }


    .lion-es-intro-grid,
    .lion-es-availability-grid,
    .lion-es-why-grid,
    .lion-es-property-grid,
    .lion-es-faq-grid{
        grid-template-columns:1fr;

        gap:40px;
    }


    /* INTRO */

    .lion-es-intro-visual{
        min-height:510px;
    }


    .lion-es-main-image{
        width:88%;
        height:430px;
    }


    .lion-es-secondary-image{
        width:46%;
        height:215px;
    }


    .lion-es-availability-card{
        left:18px;
        bottom:18px;
    }


    .lion-es-intro-copy > p,
    .lion-es-situations-heading p,
    .lion-es-availability-copy > p,
    .lion-es-why-heading > p,
    .lion-es-property-copy > p,
    .lion-es-faq-heading > p{
        font-size:14px;
    }


    .lion-es-intro-features{
        grid-template-columns:1fr;
    }


    /* SITUATIONS */

    .lion-es-situations-grid{
        grid-template-columns:1fr;
    }


    .lion-es-situation-card{
        min-height:0;
    }


    /* AVAILABILITY */

    .lion-es-availability-visual,
    .lion-es-property-visual{
        min-height:430px;
    }


    /* PROCESS */

    .lion-es-process-wrap{
        grid-template-columns:1fr;

        gap:30px;
    }


    .lion-es-process-step{
        padding:0;

        display:grid;

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

        gap:14px;

        text-align:left;
    }


    .lion-es-process-node{
        width:60px;
        height:60px;

        margin:0;

        grid-row:1 / span 2;
    }


    .lion-es-process-node span{
        width:43px;
        height:43px;

        font-size:16px;
    }


    .lion-es-process-icon{
        margin:0 0 10px;
    }


    /* WHY */

    .lion-es-why-heading,
    .lion-es-faq-heading{
        position:static;
    }


    .lion-es-why-list{
        grid-template-columns:1fr;
    }


    .lion-es-why-card{
        min-height:0;
    }


    /* PROPERTY */

    .lion-es-property-list{
        grid-template-columns:1fr;
    }


    /* SAFETY */

    .lion-es-safety{
        padding:55px 0;
    }


    .lion-es-safety-inner{
        padding:25px 22px;

        grid-template-columns:1fr;

        align-items:start;

        gap:18px;
    }


    /* CLOSING */

    .lion-es-closing{
        padding-bottom:70px;
    }


    .lion-es-closing-inner{
        padding:26px 22px;

        grid-template-columns:1fr;

        gap:20px;
    }


    .lion-es-closing-icon{
        width:68px;
        height:68px;

        min-width:68px;
        min-height:68px;
    }

}


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

@media(max-width:420px){

    .lion-es-container{
        width:calc(100% - 20px);
    }


    .lion-es-intro-visual{
        min-height:450px;
    }


    .lion-es-main-image{
        height:385px;
    }


    .lion-es-secondary-image{
        height:180px;
    }


    .lion-es-availability-card{
        min-width:195px;

        left:14px;
        bottom:14px;

        padding:12px;
    }


    .lion-es-clock-card,
    .lion-es-property-card{
        left:15px;
        right:15px;
        bottom:15px;

        min-width:0;
        max-width:none;
    }


    .lion-es-visual-alert{
        top:14px;
        right:14px;
    }


    .lion-es-related-card{
        padding:15px;
    }

}


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

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

    .lion-es-reveal,
    .lion-es-process-step,
    .lion-es-process-progress{
        transition:none !important;
    }


    .lion-es-reveal{
        opacity:1;
        transform:none;
    }


    .lion-es-process-step{
        opacity:1;
        transform:none;
    }

}

/* =========================================================
   LION TREE SERVICE & LANDSCAPING LLC
   TREE PLANTING PAGE
========================================================= */

:root{
    --tp-green-950:#04170f;
    --tp-green-900:#071f16;
    --tp-green-800:#0b3123;
    --tp-green-700:#164a35;
    --tp-green-600:#286b49;

    --tp-gold:#f2bf3f;
    --tp-gold-dark:#d69a1b;
    --tp-gold-light:#ffe198;

    --tp-white:#ffffff;
    --tp-soft:#f5f8f5;
    --tp-soft-2:#edf2ed;

    --tp-title:#10271c;
    --tp-text:#526158;
    --tp-border:#dfe7e1;
}


/* =========================================================
   GLOBAL
========================================================= */

.lion-tp-container{
    width:min(92%,1380px);
    margin:0 auto;
    position:relative;
    z-index:3;
}


.lion-tp-hero *,
.lion-tp-intro *,
.lion-tp-benefits *,
.lion-tp-planning *,
.lion-tp-process *,
.lion-tp-why *,
.lion-tp-landscape *,
.lion-tp-related *,
.lion-tp-faq *,
.lion-tp-closing *{
    box-sizing:border-box;
}


.lion-tp-hero i,
.lion-tp-intro i,
.lion-tp-benefits i,
.lion-tp-planning i,
.lion-tp-process i,
.lion-tp-why i,
.lion-tp-landscape i,
.lion-tp-related i,
.lion-tp-faq i,
.lion-tp-closing i{
    position:static !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1 !important;
}


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

.lion-tp-hero{
    min-height:455px;
    padding:105px 0 95px;

    position:relative;
    overflow:hidden;

    display:flex;
    align-items:center;

    background:
        linear-gradient(
            105deg,
            rgba(3,20,13,.985),
            rgba(7,49,34,.94) 60%,
            rgba(25,84,58,.89)
        ),
        url("https://images.unsplash.com/photo-1416879595882-3373a0480b5b?auto=format&fit=crop&w=2000&q=85");

    background-size:cover;
    background-position:center;
}


.lion-tp-hero::before{
    content:"";
    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 74% 18%,
            rgba(242,191,63,.14),
            transparent 28%
        );
}


.lion-tp-hero-rings{
    width:450px;
    height:450px;

    position:absolute;
    right:-155px;
    bottom:-230px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.14);

    box-shadow:
        0 0 0 45px rgba(255,255,255,.016),
        0 0 0 90px rgba(242,191,63,.024),
        0 0 0 135px rgba(255,255,255,.012);
}


.lion-tp-hero-rings::before,
.lion-tp-hero-rings::after{
    content:"";
    position:absolute;

    border-radius:50%;

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


.lion-tp-hero-rings::before{
    inset:60px;
}


.lion-tp-hero-rings::after{
    inset:128px;
}


.lion-tp-hero-tree{
    position:absolute;
    right:8%;
    bottom:-90px;

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

    font-size:350px;

    pointer-events:none;
}


.lion-tp-hero-leaf{
    position:absolute;
    right:33%;
    top:90px;

    color:rgba(242,191,63,.06);

    font-size:100px;

    transform:rotate(24deg);
}


.lion-tp-hero-content{
    max-width:850px;
}


.lion-tp-eyebrow{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--tp-gold-light);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.3px;
}


.lion-tp-eyebrow-line{
    width:38px;
    height:3px;

    flex:0 0 38px;

    border-radius:20px;

    background:var(--tp-gold);
}


.lion-tp-eyebrow-icon{
    width:31px;
    height:31px;

    min-width:31px;
    min-height:31px;

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

    border-radius:50%;

    color:var(--tp-green-950);

    background:var(--tp-gold);
}


.lion-tp-eyebrow-icon i{
    width:14px !important;
    height:14px !important;

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

    font-size:12px;
}


.lion-tp-hero h1{
    margin:0 0 19px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(55px,7vw,93px);
    line-height:.98;

    font-weight:700;

    text-transform:uppercase;
}


.lion-tp-hero h1 span{
    color:var(--tp-gold);
}


.lion-tp-hero-content > p{
    max-width:730px;

    margin:0 0 28px;

    color:rgba(255,255,255,.74);

    font-size:16px;
    line-height:1.75;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.lion-tp-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:11px;
}


.lion-tp-breadcrumb a,
.lion-tp-breadcrumb > span{
    min-height:38px;

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

    gap:8px;

    color:rgba(255,255,255,.69);

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

    font-weight:700;
}


.lion-tp-breadcrumb a{
    transition:color .25s ease;
}


.lion-tp-breadcrumb a:hover{
    color:var(--tp-gold-light);
}


.lion-tp-breadcrumb a i{
    color:var(--tp-gold);
}


.lion-tp-breadcrumb-divider{
    min-height:auto !important;

    color:rgba(255,255,255,.28) !important;
}


.lion-tp-breadcrumb-divider i{
    font-size:10px;
}


.lion-tp-breadcrumb span[aria-current="page"]{
    color:var(--tp-gold-light);
}


/* =========================================================
   SECTION LABEL
========================================================= */

.lion-tp-section-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--tp-green-600);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-tp-section-label > span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:var(--tp-gold);
}


.lion-tp-section-label-center{
    justify-content:center;
}


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

.lion-tp-intro{
    padding:110px 0;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-tp-intro::before{
    content:"";
    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 5% 15%,
            rgba(242,191,63,.075),
            transparent 20%
        ),
        radial-gradient(
            circle at 95% 85%,
            rgba(40,107,73,.045),
            transparent 22%
        );
}


.lion-tp-intro-rings{
    width:340px;
    height:340px;

    position:absolute;
    right:-170px;
    bottom:-155px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 45px rgba(40,107,73,.018),
        0 0 0 90px rgba(242,191,63,.02);
}


.lion-tp-intro-grid{
    display:grid;

    grid-template-columns:
        minmax(420px,.92fr)
        minmax(0,1.08fr);

    align-items:center;

    gap:clamp(55px,7vw,100px);
}


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

.lion-tp-intro-visual{
    min-height:620px;

    position:relative;
}


.lion-tp-main-image{
    width:83%;
    height:540px;

    position:absolute;
    top:0;
    left:0;

    overflow:hidden;

    border-radius:16px;

    box-shadow:
        0 28px 60px rgba(13,52,35,.15);
}


.lion-tp-main-image img,
.lion-tp-secondary-image img{
    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

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


.lion-tp-main-image:hover img,
.lion-tp-secondary-image:hover img{
    transform:scale(1.05);
}


.lion-tp-secondary-image{
    width:47%;
    height:255px;

    position:absolute;
    right:0;
    bottom:0;

    overflow:hidden;

    border:7px solid #fff;

    border-radius:14px;

    box-shadow:
        0 20px 45px rgba(13,52,35,.14);
}


.lion-tp-visual-card{
    min-width:225px;
    min-height:80px;

    padding:14px 16px;

    position:absolute;
    left:28px;
    bottom:30px;

    z-index:5;

    display:flex;
    align-items:center;

    gap:12px;

    border-radius:10px;

    color:#fff;

    background:
        linear-gradient(
            120deg,
            var(--tp-green-950),
            var(--tp-green-700)
        );

    box-shadow:
        0 18px 40px rgba(0,0,0,.23);
}


.lion-tp-visual-card > span{
    width:44px;
    height:44px;

    min-width:44px;
    min-height:44px;

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

    border-radius:50%;

    color:var(--tp-green-950);

    background:var(--tp-gold);
}


.lion-tp-visual-card small{
    display:block;

    color:rgba(255,255,255,.58);

    font-size:14px;
}


.lion-tp-visual-card strong{
    display:block;

    margin-top:2px;

    color:#fff;

    font-family:"Oswald",sans-serif;

    font-size:19px;
}


.lion-tp-visual-ring{
    width:185px;
    height:185px;

    position:absolute;
    right:15px;
    top:25px;

    z-index:-1;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.20);

    box-shadow:
        0 0 0 22px rgba(242,191,63,.03),
        0 0 0 44px rgba(40,107,73,.025);
}


/* =========================================================
   HEADINGS
========================================================= */

.lion-tp-intro-copy h2,
.lion-tp-why-heading h2,
.lion-tp-faq-heading h2{
    margin:0 0 25px;

    color:var(--tp-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.6vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-tp-intro-copy h2 strong,
.lion-tp-why-heading h2 strong,
.lion-tp-faq-heading h2 strong{
    display:block;

    color:var(--tp-green-600);
}


.lion-tp-intro-copy > p{
    margin:0 0 18px;

    color:var(--tp-text);

    font-size:15px;
    line-height:1.85;

    text-align:justify;
}


.lion-tp-intro-features{
    margin-top:28px;

    display:grid;

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

    gap:10px;
}


.lion-tp-intro-features > div{
    min-height:52px;

    padding:10px 12px;

    display:flex;
    align-items:center;

    gap:10px;

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

    border-radius:8px;

    color:#56665c;

    background:var(--tp-soft);

    font-size:14px;
    font-weight:700;
}


.lion-tp-intro-features > div > span{
    width:25px;
    height:25px;

    min-width:25px;
    min-height:25px;

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

    border-radius:50%;

    color:var(--tp-green-700);

    background:rgba(40,107,73,.09);
}


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

.lion-tp-benefits{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:var(--tp-soft);
}


.lion-tp-benefits::before{
    content:"";

    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 8% 15%,
            rgba(40,107,73,.04),
            transparent 21%
        ),
        radial-gradient(
            circle at 92% 84%,
            rgba(242,191,63,.055),
            transparent 23%
        );

    pointer-events:none;
}


.lion-tp-benefits-tree{
    position:absolute;
    left:-70px;
    top:300px;

    color:rgba(11,54,37,.03);

    font-size:310px;
}


.lion-tp-benefits-leaf{
    position:absolute;
    right:4%;
    bottom:80px;

    color:rgba(11,54,37,.03);

    font-size:110px;

    transform:rotate(25deg);
}


.lion-tp-benefits-heading{
    max-width:820px;

    margin:0 auto 55px;

    text-align:center;
}


.lion-tp-benefits-heading h2,
.lion-tp-process-heading h2,
.lion-tp-related-heading h2{
    margin:0 0 18px;

    color:var(--tp-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(42px,5vw,68px);
    line-height:1.03;

    text-transform:uppercase;
}


.lion-tp-benefits-heading h2 strong,
.lion-tp-process-heading h2 strong,
.lion-tp-related-heading h2 strong{
    display:block;

    color:var(--tp-green-600);
}


.lion-tp-benefits-heading p,
.lion-tp-process-heading p{
    max-width:670px;

    margin:0 auto;

    color:var(--tp-text);

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


.lion-tp-benefits-grid{
    display:grid;

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

    gap:18px;
}


.lion-tp-benefit-card{
    min-height:300px;

    padding:28px 25px;

    position:relative;
    overflow:hidden;

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

    border-radius:14px;

    background:#fff;

    box-shadow:
        0 18px 42px rgba(16,53,36,.06);

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


.lion-tp-benefit-card:hover{
    transform:translateY(-8px);

    border-color:rgba(214,154,27,.36);

    box-shadow:
        0 27px 55px rgba(16,53,36,.11);
}


.lion-tp-benefit-card::before{
    content:"";

    width:78px;
    height:4px;

    position:absolute;
    top:0;
    left:25px;

    border-radius:0 0 15px 15px;

    background:
        linear-gradient(
            90deg,
            var(--tp-gold-dark),
            var(--tp-gold-light)
        );
}


.lion-tp-card-number{
    position:absolute;

    top:17px;
    right:18px;

    color:rgba(9,49,33,.065);

    font-family:"Oswald",sans-serif;

    font-size:55px;
    line-height:1;

    font-weight:700;
}


.lion-tp-benefit-icon{
    width:58px;
    height:58px;

    min-width:58px;
    min-height:58px;

    margin-bottom:35px;

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

    border-radius:50%;

    color:var(--tp-green-950);

    background:
        linear-gradient(
            145deg,
            var(--tp-gold-light),
            var(--tp-gold)
        );
}


.lion-tp-benefit-card h3{
    margin:0 0 13px;

    color:var(--tp-title);

    font-family:"Oswald",sans-serif;

    font-size:26px;
}


.lion-tp-benefit-card p{
    margin:0;

    color:var(--tp-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   PLANNING
========================================================= */

.lion-tp-planning,
.lion-tp-landscape{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    color:#fff;

    background:
        linear-gradient(
            115deg,
            var(--tp-green-950),
            var(--tp-green-700)
        );
}


.lion-tp-planning-rings,
.lion-tp-landscape-rings{
    width:420px;
    height:420px;

    position:absolute;
    left:-170px;
    bottom:-240px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.12);

    box-shadow:
        0 0 0 40px rgba(255,255,255,.013),
        0 0 0 80px rgba(242,191,63,.022),
        0 0 0 120px rgba(255,255,255,.010);
}


.lion-tp-planning-grid,
.lion-tp-landscape-grid{
    display:grid;

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

    align-items:center;

    gap:70px;
}


.lion-tp-dark-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--tp-gold-light);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-tp-dark-label span{
    width:36px;
    height:3px;

    display:block;

    background:var(--tp-gold);
}


.lion-tp-planning-copy h2,
.lion-tp-landscape-copy h2{
    margin:0 0 21px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.7vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-tp-planning-copy h2 strong,
.lion-tp-landscape-copy h2 strong{
    display:block;

    color:var(--tp-gold);
}


.lion-tp-planning-copy > p,
.lion-tp-landscape-copy > p{
    margin:0 0 17px;

    color:rgba(255,255,255,.67);

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


.lion-tp-planning-list{
    margin-top:27px;

    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-tp-planning-list > div{
    padding:14px;

    display:flex;
    align-items:flex-start;

    gap:13px;

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

    border-radius:9px;

    background:rgba(255,255,255,.045);
}


.lion-tp-planning-list > div > span{
    width:43px;
    height:43px;

    min-width:43px;

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

    border-radius:50%;

    color:var(--tp-green-950);

    background:var(--tp-gold);
}


.lion-tp-planning-list strong{
    display:block;

    margin-bottom:4px;

    color:#fff;

    font-size:15px;
}


.lion-tp-planning-list p{
    margin:0;

    color:rgba(255,255,255,.58);

    font-size:14px;
    line-height:1.6;
}


/* DARK VISUALS */

.lion-tp-planning-visual,
.lion-tp-landscape-visual{
    min-height:520px;

    position:relative;
    overflow:hidden;

    border-radius:17px;

    box-shadow:
        0 28px 70px rgba(0,0,0,.25);
}


.lion-tp-planning-image,
.lion-tp-landscape-image{
    position:absolute;
    inset:0;

    background-size:cover;
    background-position:center;

    transition:transform .7s ease;
}


.lion-tp-planning-image::after,
.lion-tp-landscape-image::after{
    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(3,20,13,.04),
            rgba(3,20,13,.68)
        );
}


.lion-tp-planning-visual:hover
.lion-tp-planning-image,
.lion-tp-landscape-visual:hover
.lion-tp-landscape-image{
    transform:scale(1.04);
}


.lion-tp-planning-card,
.lion-tp-landscape-card{
    max-width:340px;

    position:absolute;
    left:25px;
    bottom:25px;

    z-index:3;

    padding:16px;

    display:flex;
    align-items:center;

    gap:13px;

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

    border-radius:10px;

    background:rgba(5,28,19,.88);

    backdrop-filter:blur(9px);
}


.lion-tp-planning-card > span,
.lion-tp-landscape-card > span{
    width:48px;
    height:48px;

    min-width:48px;

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

    border-radius:50%;

    color:var(--tp-green-950);

    background:var(--tp-gold);
}


.lion-tp-planning-card small,
.lion-tp-landscape-card small{
    display:block;

    color:rgba(255,255,255,.54);

    font-size:14px;
}


.lion-tp-planning-card strong,
.lion-tp-landscape-card strong{
    display:block;

    margin-top:3px;

    color:#fff;

    font-size:15px;
}


/* =========================================================
   PROCESS
========================================================= */

.lion-tp-process{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-tp-process-tree{
    position:absolute;
    right:-60px;
    bottom:-100px;

    color:rgba(13,57,39,.025);

    font-size:350px;
}


.lion-tp-process-heading{
    max-width:800px;

    margin:0 auto 75px;

    text-align:center;
}


.lion-tp-process-wrap{
    max-width:1150px;

    margin:0 auto;

    position:relative;

    display:grid;

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


.lion-tp-process-line{
    height:4px;

    position:absolute;
    top:39px;
    left:10%;
    right:10%;

    overflow:hidden;

    border-radius:20px;

    background:#dce5de;
}


.lion-tp-process-progress{
    width:0%;
    height:100%;

    background:
        linear-gradient(
            90deg,
            var(--tp-gold),
            var(--tp-green-600)
        );

    transition:width .15s linear;
}


.lion-tp-process-step{
    position:relative;
    z-index:2;

    padding:0 14px;

    text-align:center;

    opacity:.35;

    transform:translateY(20px);

    transition:
        opacity .6s ease,
        transform .6s ease;
}


.lion-tp-process-step.lion-tp-step-visible{
    opacity:1;
    transform:none;
}


.lion-tp-process-node{
    width:78px;
    height:78px;

    margin:0 auto 24px;

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

    border-radius:50%;

    border:1px solid rgba(40,107,73,.18);

    background:#fff;
}


.lion-tp-process-node span{
    width:52px;
    height:52px;

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

    border-radius:50%;

    color:var(--tp-green-950);

    background:#dce5de;

    font-family:"Oswald",sans-serif;

    font-size:18px;
}


.lion-tp-process-step.lion-tp-step-visible
.lion-tp-process-node span{
    background:var(--tp-gold);
}


.lion-tp-process-icon{
    width:41px;
    height:41px;

    margin:0 auto 14px;

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

    border-radius:50%;

    color:#fff;

    background:var(--tp-green-700);
}


.lion-tp-process-card h3{
    margin:0 0 9px;

    color:var(--tp-title);

    font-family:"Oswald",sans-serif;

    font-size:22px;
}


.lion-tp-process-card p{
    margin:0;

    color:var(--tp-text);

    font-size:14px;
    line-height:1.65;
}


/* =========================================================
   WHY CHOOSE
========================================================= */

.lion-tp-why{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    background:var(--tp-soft);
}


.lion-tp-why-rings{
    width:330px;
    height:330px;

    position:absolute;
    right:-155px;
    top:-130px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 40px rgba(40,107,73,.016),
        0 0 0 80px rgba(242,191,63,.02);
}


.lion-tp-why-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    gap:70px;
}


.lion-tp-why-heading{
    position:sticky;
    top:130px;
}


.lion-tp-why-heading > p{
    margin:0;

    color:var(--tp-text);

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


.lion-tp-why-list{
    display:grid;

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

    gap:14px;
}


.lion-tp-why-card{
    min-height:280px;

    padding:24px;

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

    border-radius:13px;

    background:#fff;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.lion-tp-why-card:hover{
    transform:translateY(-7px);

    box-shadow:
        0 22px 45px rgba(15,52,35,.09);
}


.lion-tp-why-card > span{
    width:55px;
    height:55px;

    margin-bottom:28px;

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

    border-radius:50%;

    color:var(--tp-green-950);

    background:var(--tp-gold);
}


.lion-tp-why-card small{
    display:block;

    margin-bottom:5px;

    color:var(--tp-gold-dark);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-tp-why-card h3{
    margin:0 0 10px;

    color:var(--tp-title);

    font-family:"Oswald",sans-serif;

    font-size:24px;
}


.lion-tp-why-card p{
    margin:0;

    color:var(--tp-text);

    font-size:14px;
    line-height:1.7;
}


/* =========================================================
   LANDSCAPE SERVICE LINKS
========================================================= */

.lion-tp-landscape-services{
    margin-top:25px;

    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-tp-landscape-services a{
    min-height:75px;

    padding:12px 14px;

    display:grid;

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

    align-items:center;

    gap:12px;

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

    border-radius:9px;

    color:#fff;

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

    transition:
        background .3s ease,
        transform .3s ease;
}


.lion-tp-landscape-services a:hover{
    transform:translateX(4px);

    background:rgba(255,255,255,.075);
}


.lion-tp-landscape-services a > span{
    width:43px;
    height:43px;

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

    border-radius:50%;

    color:var(--tp-green-950);

    background:var(--tp-gold);
}


.lion-tp-landscape-services small{
    display:block;

    color:rgba(255,255,255,.52);

    font-size:14px;
}


.lion-tp-landscape-services strong{
    display:block;

    margin-top:2px;

    color:#fff;

    font-size:15px;
}


/* =========================================================
   RELATED
========================================================= */

.lion-tp-related{
    padding:105px 0;

    background:#fff;
}


.lion-tp-related-heading{
    max-width:790px;

    margin:0 auto 48px;

    text-align:center;
}


.lion-tp-related-grid{
    display:grid;

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

    gap:15px;
}


.lion-tp-related-card{
    min-height:130px;

    padding:19px;

    display:grid;

    grid-template-columns:auto 1fr auto;

    align-items:center;

    gap:14px;

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

    border-radius:12px;

    background:var(--tp-soft);

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.lion-tp-related-card:hover{
    transform:translateY(-5px);

    background:#fff;

    box-shadow:
        0 20px 42px rgba(16,53,36,.09);
}


.lion-tp-related-icon{
    width:50px;
    height:50px;

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

    border-radius:50%;

    color:var(--tp-green-950);

    background:var(--tp-gold);
}


.lion-tp-related-card small{
    display:block;

    color:var(--tp-gold-dark);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-tp-related-card h3{
    margin:3px 0 0;

    color:var(--tp-title);

    font-family:"Oswald",sans-serif;

    font-size:21px;
}


.lion-tp-related-arrow{
    width:38px;
    height:38px;

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

    border-radius:50%;

    color:#fff;

    background:var(--tp-green-700);

    transition:
        transform .3s ease,
        background .3s ease;
}


.lion-tp-related-card:hover
.lion-tp-related-arrow{
    transform:translateX(3px);

    color:var(--tp-green-950);

    background:var(--tp-gold);
}


/* =========================================================
   FAQ
========================================================= */

.lion-tp-faq{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    background:var(--tp-soft);
}


.lion-tp-faq-tree{
    position:absolute;
    left:-70px;
    bottom:-95px;

    color:rgba(12,55,37,.025);

    font-size:340px;
}


.lion-tp-faq-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    gap:70px;
}


.lion-tp-faq-heading{
    position:sticky;
    top:130px;
}


.lion-tp-faq-heading > p{
    margin:0;

    color:var(--tp-text);

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


.lion-tp-faq-list{
    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-tp-faq-item{
    overflow:hidden;

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

    border-radius:10px;

    background:#fff;
}


.lion-tp-faq-question{
    width:100%;
    min-height:74px;

    padding:15px 18px;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    gap:20px;

    border:0;

    color:var(--tp-title);

    background:#fff;

    font-family:"DM Sans",Arial,sans-serif;

    font-size:15px;
    line-height:1.4;

    font-weight:800;

    text-align:left;

    cursor:pointer;
}


.lion-tp-faq-question > i{
    width:34px !important;
    height:34px !important;

    min-width:34px;

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

    border-radius:50%;

    color:var(--tp-green-950);

    background:var(--tp-gold);

    font-size:12px;

    transition:transform .3s ease;
}


.lion-tp-faq-item.lion-tp-faq-open
.lion-tp-faq-question > i{
    transform:rotate(45deg);
}


.lion-tp-faq-answer{
    max-height:0;

    overflow:hidden;

    transition:max-height .45s ease;
}


.lion-tp-faq-answer > div{
    padding:0 18px 20px;
}


.lion-tp-faq-answer p{
    margin:0;

    padding-top:15px;

    border-top:1px solid #e6ebe7;

    color:var(--tp-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   CLOSING
========================================================= */

.lion-tp-closing{
    padding:0 0 100px;

    background:var(--tp-soft);
}


.lion-tp-closing-inner{
    padding:38px 42px;

    display:grid;

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

    align-items:center;

    gap:26px;

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

    border-radius:14px;

    background:#fff;
}


.lion-tp-closing-icon{
    width:80px;
    height:80px;

    min-width:80px;

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

    border-radius:50%;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            var(--tp-green-700),
            var(--tp-green-950)
        );
}


.lion-tp-closing-small{
    display:block;

    margin-bottom:4px;

    color:var(--tp-gold-dark);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-tp-closing h2{
    margin:0 0 9px;

    color:var(--tp-title);

    font-family:"Oswald",sans-serif;

    font-size:clamp(30px,3.5vw,45px);

    text-transform:uppercase;
}


.lion-tp-closing h2 strong{
    color:var(--tp-green-600);
}


.lion-tp-closing p{
    margin:0;

    color:var(--tp-text);

    font-size:14px;
    line-height:1.75;
}


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

.lion-tp-reveal{
    opacity:0;

    transform:translateY(35px);

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


.lion-tp-reveal.lion-tp-visible{
    opacity:1;

    transform:none;
}


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

@media(max-width:1050px){

    .lion-tp-intro-grid{
        grid-template-columns:1fr 1fr;
        gap:45px;
    }


    .lion-tp-benefits-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .lion-tp-planning-grid,
    .lion-tp-landscape-grid,
    .lion-tp-why-grid,
    .lion-tp-faq-grid{
        grid-template-columns:1fr 1fr;
        gap:45px;
    }


    .lion-tp-process-wrap{
        grid-template-columns:
            repeat(3,minmax(0,1fr));

        row-gap:45px;
    }


    .lion-tp-process-line{
        display:none;
    }


    .lion-tp-related-grid{
        grid-template-columns:1fr;
    }

}


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

@media(max-width:767px){

    .lion-tp-container{
        width:calc(100% - 28px);
    }


    .lion-tp-hero{
        min-height:390px;
        padding:78px 0 68px;
    }


    .lion-tp-hero h1{
        font-size:clamp(48px,15vw,70px);
    }


    .lion-tp-hero-content > p{
        font-size:14px;
    }


    .lion-tp-intro,
    .lion-tp-benefits,
    .lion-tp-planning,
    .lion-tp-process,
    .lion-tp-why,
    .lion-tp-landscape,
    .lion-tp-related,
    .lion-tp-faq{
        padding:75px 0;
    }


    .lion-tp-intro-grid,
    .lion-tp-planning-grid,
    .lion-tp-landscape-grid,
    .lion-tp-why-grid,
    .lion-tp-faq-grid{
        grid-template-columns:1fr;

        gap:40px;
    }


    .lion-tp-intro-visual{
        min-height:510px;
    }


    .lion-tp-main-image{
        width:88%;
        height:430px;
    }


    .lion-tp-secondary-image{
        width:46%;
        height:215px;
    }


    .lion-tp-intro-features{
        grid-template-columns:1fr;
    }


    .lion-tp-benefits-grid{
        grid-template-columns:1fr;
    }


    .lion-tp-benefit-card{
        min-height:0;
    }


    .lion-tp-planning-visual,
    .lion-tp-landscape-visual{
        min-height:430px;
    }


    .lion-tp-process-wrap{
        grid-template-columns:1fr;

        gap:30px;
    }


    .lion-tp-process-step{
        padding:0;

        display:grid;

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

        gap:14px;

        text-align:left;
    }


    .lion-tp-process-node{
        width:60px;
        height:60px;

        margin:0;

        grid-row:1 / span 2;
    }


    .lion-tp-process-node span{
        width:43px;
        height:43px;
    }


    .lion-tp-process-icon{
        margin:0 0 10px;
    }


    .lion-tp-why-heading,
    .lion-tp-faq-heading{
        position:static;
    }


    .lion-tp-why-list{
        grid-template-columns:1fr;
    }


    .lion-tp-why-card{
        min-height:0;
    }


    .lion-tp-closing{
        padding-bottom:70px;
    }


    .lion-tp-closing-inner{
        padding:26px 22px;

        grid-template-columns:1fr;

        gap:20px;
    }

}


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

@media(max-width:420px){

    .lion-tp-container{
        width:calc(100% - 20px);
    }


    .lion-tp-intro-visual{
        min-height:450px;
    }


    .lion-tp-main-image{
        height:385px;
    }


    .lion-tp-secondary-image{
        height:180px;
    }


    .lion-tp-visual-card{
        min-width:190px;

        left:14px;
        bottom:14px;
    }


    .lion-tp-planning-card,
    .lion-tp-landscape-card{
        left:15px;
        right:15px;
        bottom:15px;

        max-width:none;
    }

}


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

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

    .lion-tp-reveal,
    .lion-tp-process-step,
    .lion-tp-process-progress{
        transition:none !important;
    }


    .lion-tp-reveal{
        opacity:1;

        transform:none;
    }


    .lion-tp-process-step{
        opacity:1;

        transform:none;
    }

}

/* =========================================================
   LION TREE SERVICE & LANDSCAPING LLC
   LAWN SERVICE PAGE
========================================================= */

:root{
    --ls-green-950:#04170f;
    --ls-green-900:#071f16;
    --ls-green-800:#0b3123;
    --ls-green-700:#164a35;
    --ls-green-600:#286b49;

    --ls-gold:#f2bf3f;
    --ls-gold-dark:#d69a1b;
    --ls-gold-light:#ffe198;

    --ls-white:#ffffff;
    --ls-soft:#f5f8f5;
    --ls-soft-2:#edf2ed;

    --ls-title:#10271c;
    --ls-text:#526158;
    --ls-border:#dfe7e1;
}


/* =========================================================
   GLOBAL
========================================================= */

.lion-ls-container{
    width:min(92%,1380px);
    margin:0 auto;
    position:relative;
    z-index:3;
}


.lion-ls-hero *,
.lion-ls-intro *,
.lion-ls-benefits *,
.lion-ls-property *,
.lion-ls-process *,
.lion-ls-why *,
.lion-ls-grass *,
.lion-ls-related *,
.lion-ls-faq *,
.lion-ls-closing *{
    box-sizing:border-box;
}


.lion-ls-hero i,
.lion-ls-intro i,
.lion-ls-benefits i,
.lion-ls-property i,
.lion-ls-process i,
.lion-ls-why i,
.lion-ls-grass i,
.lion-ls-related i,
.lion-ls-faq i,
.lion-ls-closing i{
    position:static !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1 !important;
}


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

.lion-ls-hero{
    min-height:455px;
    padding:105px 0 95px;

    position:relative;
    overflow:hidden;

    display:flex;
    align-items:center;

    background:
        linear-gradient(
            105deg,
            rgba(3,20,13,.985),
            rgba(7,49,34,.94) 60%,
            rgba(25,84,58,.89)
        ),
        url("https://images.unsplash.com/photo-1558904541-efa843a96f01?auto=format&fit=crop&w=2000&q=85");

    background-size:cover;
    background-position:center;
}


.lion-ls-hero::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 75% 18%,
            rgba(242,191,63,.14),
            transparent 28%
        );
}


.lion-ls-hero-rings{
    width:450px;
    height:450px;

    position:absolute;
    right:-155px;
    bottom:-230px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.14);

    box-shadow:
        0 0 0 45px rgba(255,255,255,.016),
        0 0 0 90px rgba(242,191,63,.024),
        0 0 0 135px rgba(255,255,255,.012);
}


.lion-ls-hero-rings::before,
.lion-ls-hero-rings::after{
    content:"";

    position:absolute;

    border-radius:50%;

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


.lion-ls-hero-rings::before{
    inset:60px;
}


.lion-ls-hero-rings::after{
    inset:128px;
}


.lion-ls-hero-tree{
    position:absolute;

    right:8%;
    bottom:-90px;

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

    font-size:350px;

    pointer-events:none;
}


.lion-ls-hero-leaf{
    position:absolute;

    right:32%;
    top:90px;

    color:rgba(242,191,63,.06);

    font-size:95px;

    transform:rotate(24deg);

    pointer-events:none;
}


.lion-ls-hero-content{
    max-width:850px;
}


.lion-ls-eyebrow{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--ls-gold-light);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.3px;
}


.lion-ls-eyebrow-line{
    width:38px;
    height:3px;

    flex:0 0 38px;

    border-radius:20px;

    background:var(--ls-gold);
}


.lion-ls-eyebrow-icon{
    width:31px;
    height:31px;

    min-width:31px;
    min-height:31px;

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

    border-radius:50%;

    color:var(--ls-green-950);

    background:var(--ls-gold);
}


.lion-ls-eyebrow-icon i{
    width:14px !important;
    height:14px !important;

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

    font-size:12px;
}


.lion-ls-hero h1{
    margin:0 0 19px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(55px,7vw,93px);
    line-height:.98;

    font-weight:700;

    text-transform:uppercase;
}


.lion-ls-hero h1 span{
    color:var(--ls-gold);
}


.lion-ls-hero-content > p{
    max-width:730px;

    margin:0 0 28px;

    color:rgba(255,255,255,.74);

    font-size:16px;
    line-height:1.75;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.lion-ls-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:11px;
}


.lion-ls-breadcrumb a,
.lion-ls-breadcrumb > span{
    min-height:38px;

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

    gap:8px;

    color:rgba(255,255,255,.69);

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

    font-weight:700;
}


.lion-ls-breadcrumb a{
    transition:color .25s ease;
}


.lion-ls-breadcrumb a:hover{
    color:var(--ls-gold-light);
}


.lion-ls-breadcrumb a i{
    color:var(--ls-gold);
}


.lion-ls-breadcrumb-divider{
    min-height:auto !important;

    color:rgba(255,255,255,.28) !important;
}


.lion-ls-breadcrumb-divider i{
    font-size:10px;
}


.lion-ls-breadcrumb span[aria-current="page"]{
    color:var(--ls-gold-light);
}


/* =========================================================
   SECTION LABELS
========================================================= */

.lion-ls-section-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--ls-green-600);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-ls-section-label > span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:var(--ls-gold);
}


.lion-ls-section-label-center{
    justify-content:center;
}


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

.lion-ls-intro{
    padding:110px 0;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-ls-intro::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 5% 15%,
            rgba(242,191,63,.075),
            transparent 20%
        ),
        radial-gradient(
            circle at 95% 85%,
            rgba(40,107,73,.045),
            transparent 22%
        );
}


.lion-ls-intro-rings{
    width:340px;
    height:340px;

    position:absolute;
    right:-170px;
    bottom:-155px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 45px rgba(40,107,73,.018),
        0 0 0 90px rgba(242,191,63,.02);
}


.lion-ls-intro-grid{
    display:grid;

    grid-template-columns:
        minmax(420px,.92fr)
        minmax(0,1.08fr);

    align-items:center;

    gap:clamp(55px,7vw,100px);
}


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

.lion-ls-intro-visual{
    min-height:620px;
    position:relative;
}


.lion-ls-main-image{
    width:83%;
    height:540px;

    position:absolute;
    top:0;
    left:0;

    overflow:hidden;

    border-radius:16px;

    box-shadow:
        0 28px 60px rgba(13,52,35,.15);
}


.lion-ls-main-image img,
.lion-ls-secondary-image img{
    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

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


.lion-ls-main-image:hover img,
.lion-ls-secondary-image:hover img{
    transform:scale(1.05);
}


.lion-ls-secondary-image{
    width:47%;
    height:255px;

    position:absolute;
    right:0;
    bottom:0;

    overflow:hidden;

    border:7px solid #fff;

    border-radius:14px;

    box-shadow:
        0 20px 45px rgba(13,52,35,.14);
}


.lion-ls-visual-card{
    min-width:225px;
    min-height:80px;

    padding:14px 16px;

    position:absolute;
    left:28px;
    bottom:30px;

    z-index:5;

    display:flex;
    align-items:center;

    gap:12px;

    border-radius:10px;

    color:#fff;

    background:
        linear-gradient(
            120deg,
            var(--ls-green-950),
            var(--ls-green-700)
        );

    box-shadow:
        0 18px 40px rgba(0,0,0,.23);
}


.lion-ls-visual-card > span{
    width:44px;
    height:44px;

    min-width:44px;

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

    border-radius:50%;

    color:var(--ls-green-950);

    background:var(--ls-gold);
}


.lion-ls-visual-card small{
    display:block;

    color:rgba(255,255,255,.58);

    font-size:14px;
}


.lion-ls-visual-card strong{
    display:block;

    margin-top:2px;

    color:#fff;

    font-family:"Oswald",sans-serif;

    font-size:19px;
}


.lion-ls-visual-ring{
    width:185px;
    height:185px;

    position:absolute;
    right:15px;
    top:25px;

    z-index:-1;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.20);

    box-shadow:
        0 0 0 22px rgba(242,191,63,.03),
        0 0 0 44px rgba(40,107,73,.025);
}


/* =========================================================
   HEADINGS / COPY
========================================================= */

.lion-ls-intro-copy h2,
.lion-ls-why-heading h2,
.lion-ls-faq-heading h2{
    margin:0 0 25px;

    color:var(--ls-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.6vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-ls-intro-copy h2 strong,
.lion-ls-why-heading h2 strong,
.lion-ls-faq-heading h2 strong{
    display:block;

    color:var(--ls-green-600);
}


.lion-ls-intro-copy > p{
    margin:0 0 18px;

    color:var(--ls-text);

    font-size:15px;
    line-height:1.85;

    text-align:justify;
}


.lion-ls-intro-features{
    margin-top:28px;

    display:grid;

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

    gap:10px;
}


.lion-ls-intro-features > div{
    min-height:52px;

    padding:10px 12px;

    display:flex;
    align-items:center;

    gap:10px;

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

    border-radius:8px;

    color:#56665c;

    background:var(--ls-soft);

    font-size:14px;

    font-weight:700;
}


.lion-ls-intro-features > div > span{
    width:25px;
    height:25px;

    min-width:25px;

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

    border-radius:50%;

    color:var(--ls-green-700);

    background:rgba(40,107,73,.09);
}


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

.lion-ls-benefits{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:var(--ls-soft);
}


.lion-ls-benefits-tree{
    position:absolute;

    left:-70px;
    top:300px;

    color:rgba(11,54,37,.03);

    font-size:310px;
}


.lion-ls-benefits-leaf{
    position:absolute;

    right:4%;
    bottom:80px;

    color:rgba(11,54,37,.03);

    font-size:110px;

    transform:rotate(25deg);
}


.lion-ls-benefits-heading{
    max-width:820px;

    margin:0 auto 55px;

    text-align:center;
}


.lion-ls-benefits-heading h2,
.lion-ls-process-heading h2,
.lion-ls-related-heading h2{
    margin:0 0 18px;

    color:var(--ls-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(42px,5vw,68px);
    line-height:1.03;

    text-transform:uppercase;
}


.lion-ls-benefits-heading h2 strong,
.lion-ls-process-heading h2 strong,
.lion-ls-related-heading h2 strong{
    display:block;

    color:var(--ls-green-600);
}


.lion-ls-benefits-heading p,
.lion-ls-process-heading p{
    max-width:670px;

    margin:0 auto;

    color:var(--ls-text);

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


.lion-ls-benefits-grid{
    display:grid;

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

    gap:18px;
}


.lion-ls-benefit-card{
    min-height:300px;

    padding:28px 25px;

    position:relative;
    overflow:hidden;

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

    border-radius:14px;

    background:#fff;

    box-shadow:
        0 18px 42px rgba(16,53,36,.06);

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


.lion-ls-benefit-card:hover{
    transform:translateY(-8px);

    border-color:rgba(214,154,27,.36);

    box-shadow:
        0 27px 55px rgba(16,53,36,.11);
}


.lion-ls-benefit-card::before{
    content:"";

    width:78px;
    height:4px;

    position:absolute;

    top:0;
    left:25px;

    border-radius:0 0 15px 15px;

    background:
        linear-gradient(
            90deg,
            var(--ls-gold-dark),
            var(--ls-gold-light)
        );
}


.lion-ls-card-number{
    position:absolute;

    top:17px;
    right:18px;

    color:rgba(9,49,33,.065);

    font-family:"Oswald",sans-serif;

    font-size:55px;
    line-height:1;

    font-weight:700;
}


.lion-ls-benefit-icon{
    width:58px;
    height:58px;

    min-width:58px;

    margin-bottom:35px;

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

    border-radius:50%;

    color:var(--ls-green-950);

    background:
        linear-gradient(
            145deg,
            var(--ls-gold-light),
            var(--ls-gold)
        );
}


.lion-ls-benefit-card h3{
    margin:0 0 13px;

    color:var(--ls-title);

    font-family:"Oswald",sans-serif;

    font-size:26px;
}


.lion-ls-benefit-card p{
    margin:0;

    color:var(--ls-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   DARK SECTIONS
========================================================= */

.lion-ls-property,
.lion-ls-grass{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    color:#fff;

    background:
        linear-gradient(
            115deg,
            var(--ls-green-950),
            var(--ls-green-700)
        );
}


.lion-ls-property-rings,
.lion-ls-grass-rings{
    width:420px;
    height:420px;

    position:absolute;

    left:-170px;
    bottom:-240px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.12);

    box-shadow:
        0 0 0 40px rgba(255,255,255,.013),
        0 0 0 80px rgba(242,191,63,.022),
        0 0 0 120px rgba(255,255,255,.010);
}


.lion-ls-property-grid,
.lion-ls-grass-grid{
    display:grid;

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

    align-items:center;

    gap:70px;
}


.lion-ls-dark-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--ls-gold-light);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-ls-dark-label span{
    width:36px;
    height:3px;

    display:block;

    background:var(--ls-gold);
}


.lion-ls-property-copy h2,
.lion-ls-grass-copy h2{
    margin:0 0 21px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.7vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-ls-property-copy h2 strong,
.lion-ls-grass-copy h2 strong{
    display:block;

    color:var(--ls-gold);
}


.lion-ls-property-copy > p,
.lion-ls-grass-copy > p{
    margin:0 0 17px;

    color:rgba(255,255,255,.67);

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


/* PROPERTY LIST */

.lion-ls-property-list{
    margin-top:27px;

    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-ls-property-list > div{
    padding:14px;

    display:flex;
    align-items:flex-start;

    gap:13px;

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

    border-radius:9px;

    background:rgba(255,255,255,.045);
}


.lion-ls-property-list > div > span{
    width:43px;
    height:43px;

    min-width:43px;

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

    border-radius:50%;

    color:var(--ls-green-950);

    background:var(--ls-gold);
}


.lion-ls-property-list strong{
    display:block;

    margin-bottom:4px;

    color:#fff;

    font-size:15px;
}


.lion-ls-property-list p{
    margin:0;

    color:rgba(255,255,255,.58);

    font-size:14px;
    line-height:1.6;
}


/* VISUAL */

.lion-ls-property-visual,
.lion-ls-grass-visual{
    min-height:520px;

    position:relative;
    overflow:hidden;

    border-radius:17px;

    box-shadow:
        0 28px 70px rgba(0,0,0,.25);
}


.lion-ls-property-image,
.lion-ls-grass-image{
    position:absolute;
    inset:0;

    background-size:cover;
    background-position:center;

    transition:transform .7s ease;
}


.lion-ls-property-image::after,
.lion-ls-grass-image::after{
    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(3,20,13,.04),
            rgba(3,20,13,.68)
        );
}


.lion-ls-property-visual:hover
.lion-ls-property-image,
.lion-ls-grass-visual:hover
.lion-ls-grass-image{
    transform:scale(1.04);
}


.lion-ls-property-card,
.lion-ls-grass-card{
    max-width:350px;

    position:absolute;

    left:25px;
    bottom:25px;

    z-index:3;

    padding:16px;

    display:flex;
    align-items:center;

    gap:13px;

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

    border-radius:10px;

    background:rgba(5,28,19,.88);

    backdrop-filter:blur(9px);
}


.lion-ls-property-card > span,
.lion-ls-grass-card > span{
    width:48px;
    height:48px;

    min-width:48px;

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

    border-radius:50%;

    color:var(--ls-green-950);

    background:var(--ls-gold);
}


.lion-ls-property-card small,
.lion-ls-grass-card small{
    display:block;

    color:rgba(255,255,255,.54);

    font-size:14px;
}


.lion-ls-property-card strong,
.lion-ls-grass-card strong{
    display:block;

    margin-top:3px;

    color:#fff;

    font-size:15px;
}


/* =========================================================
   PROCESS
========================================================= */

.lion-ls-process{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-ls-process-tree{
    position:absolute;

    right:-60px;
    bottom:-100px;

    color:rgba(13,57,39,.025);

    font-size:350px;
}


.lion-ls-process-heading{
    max-width:800px;

    margin:0 auto 75px;

    text-align:center;
}


.lion-ls-process-wrap{
    max-width:1150px;

    margin:0 auto;

    position:relative;

    display:grid;

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


.lion-ls-process-line{
    height:4px;

    position:absolute;

    top:39px;
    left:10%;
    right:10%;

    overflow:hidden;

    border-radius:20px;

    background:#dce5de;
}


.lion-ls-process-progress{
    width:0%;
    height:100%;

    background:
        linear-gradient(
            90deg,
            var(--ls-gold),
            var(--ls-green-600)
        );

    transition:width .15s linear;
}


.lion-ls-process-step{
    position:relative;

    z-index:2;

    padding:0 14px;

    text-align:center;

    opacity:.35;

    transform:translateY(20px);

    transition:
        opacity .6s ease,
        transform .6s ease;
}


.lion-ls-process-step.lion-ls-step-visible{
    opacity:1;
    transform:none;
}


.lion-ls-process-node{
    width:78px;
    height:78px;

    margin:0 auto 24px;

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

    border-radius:50%;

    border:1px solid rgba(40,107,73,.18);

    background:#fff;
}


.lion-ls-process-node span{
    width:52px;
    height:52px;

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

    border-radius:50%;

    color:var(--ls-green-950);

    background:#dce5de;

    font-family:"Oswald",sans-serif;

    font-size:18px;
}


.lion-ls-process-step.lion-ls-step-visible
.lion-ls-process-node span{
    background:var(--ls-gold);
}


.lion-ls-process-icon{
    width:41px;
    height:41px;

    margin:0 auto 14px;

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

    border-radius:50%;

    color:#fff;

    background:var(--ls-green-700);
}


.lion-ls-process-card h3{
    margin:0 0 9px;

    color:var(--ls-title);

    font-family:"Oswald",sans-serif;

    font-size:22px;
}


.lion-ls-process-card p{
    margin:0;

    color:var(--ls-text);

    font-size:14px;
    line-height:1.65;
}


/* =========================================================
   WHY CHOOSE
========================================================= */

.lion-ls-why{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    background:var(--ls-soft);
}


.lion-ls-why-rings{
    width:330px;
    height:330px;

    position:absolute;
    right:-155px;
    top:-130px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 40px rgba(40,107,73,.016),
        0 0 0 80px rgba(242,191,63,.02);
}


.lion-ls-why-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    gap:70px;
}


.lion-ls-why-heading{
    position:sticky;
    top:130px;
}


.lion-ls-why-heading > p{
    margin:0;

    color:var(--ls-text);

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


.lion-ls-why-list{
    display:grid;

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

    gap:14px;
}


.lion-ls-why-card{
    min-height:280px;

    padding:24px;

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

    border-radius:13px;

    background:#fff;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.lion-ls-why-card:hover{
    transform:translateY(-7px);

    box-shadow:
        0 22px 45px rgba(15,52,35,.09);
}


.lion-ls-why-card > span{
    width:55px;
    height:55px;

    margin-bottom:28px;

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

    border-radius:50%;

    color:var(--ls-green-950);

    background:var(--ls-gold);
}


.lion-ls-why-card small{
    display:block;

    margin-bottom:5px;

    color:var(--ls-gold-dark);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-ls-why-card h3{
    margin:0 0 10px;

    color:var(--ls-title);

    font-family:"Oswald",sans-serif;

    font-size:24px;
}


.lion-ls-why-card p{
    margin:0;

    color:var(--ls-text);

    font-size:14px;
    line-height:1.7;
}


/* =========================================================
   GRASS RELATED LINK
========================================================= */

.lion-ls-grass-link{
    margin-top:25px;

    min-height:78px;

    padding:12px 14px;

    display:grid;

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

    align-items:center;

    gap:12px;

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

    border-radius:9px;

    color:#fff;

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

    transition:
        transform .3s ease,
        background .3s ease;
}


.lion-ls-grass-link:hover{
    transform:translateX(4px);

    background:rgba(255,255,255,.075);
}


.lion-ls-grass-link > span{
    width:43px;
    height:43px;

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

    border-radius:50%;

    color:var(--ls-green-950);

    background:var(--ls-gold);
}


.lion-ls-grass-link small{
    display:block;

    color:rgba(255,255,255,.52);

    font-size:14px;
}


.lion-ls-grass-link strong{
    display:block;

    margin-top:2px;

    color:#fff;

    font-size:15px;
}


/* =========================================================
   RELATED
========================================================= */

.lion-ls-related{
    padding:105px 0;

    background:#fff;
}


.lion-ls-related-heading{
    max-width:790px;

    margin:0 auto 48px;

    text-align:center;
}


.lion-ls-related-grid{
    display:grid;

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

    gap:15px;
}


.lion-ls-related-card{
    min-height:130px;

    padding:19px;

    display:grid;

    grid-template-columns:
        auto 1fr auto;

    align-items:center;

    gap:14px;

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

    border-radius:12px;

    background:var(--ls-soft);

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.lion-ls-related-card:hover{
    transform:translateY(-5px);

    background:#fff;

    box-shadow:
        0 20px 42px rgba(16,53,36,.09);
}


.lion-ls-related-icon{
    width:50px;
    height:50px;

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

    border-radius:50%;

    color:var(--ls-green-950);

    background:var(--ls-gold);
}


.lion-ls-related-card small{
    display:block;

    color:var(--ls-gold-dark);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-ls-related-card h3{
    margin:3px 0 0;

    color:var(--ls-title);

    font-family:"Oswald",sans-serif;

    font-size:21px;
}


.lion-ls-related-arrow{
    width:38px;
    height:38px;

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

    border-radius:50%;

    color:#fff;

    background:var(--ls-green-700);

    transition:
        transform .3s ease,
        background .3s ease;
}


.lion-ls-related-card:hover
.lion-ls-related-arrow{
    transform:translateX(3px);

    color:var(--ls-green-950);

    background:var(--ls-gold);
}


/* =========================================================
   FAQ
========================================================= */

.lion-ls-faq{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    background:var(--ls-soft);
}


.lion-ls-faq-tree{
    position:absolute;

    left:-70px;
    bottom:-95px;

    color:rgba(12,55,37,.025);

    font-size:340px;
}


.lion-ls-faq-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    gap:70px;
}


.lion-ls-faq-heading{
    position:sticky;
    top:130px;
}


.lion-ls-faq-heading > p{
    margin:0;

    color:var(--ls-text);

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


.lion-ls-faq-list{
    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-ls-faq-item{
    overflow:hidden;

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

    border-radius:10px;

    background:#fff;
}


.lion-ls-faq-question{
    width:100%;
    min-height:74px;

    padding:15px 18px;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    gap:20px;

    border:0;

    color:var(--ls-title);

    background:#fff;

    font-family:"DM Sans",Arial,sans-serif;

    font-size:15px;
    line-height:1.4;

    font-weight:800;

    text-align:left;

    cursor:pointer;
}


.lion-ls-faq-question > i{
    width:34px !important;
    height:34px !important;

    min-width:34px;

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

    border-radius:50%;

    color:var(--ls-green-950);

    background:var(--ls-gold);

    font-size:12px;

    transition:transform .3s ease;
}


.lion-ls-faq-item.lion-ls-faq-open
.lion-ls-faq-question > i{
    transform:rotate(45deg);
}


.lion-ls-faq-answer{
    max-height:0;

    overflow:hidden;

    transition:max-height .45s ease;
}


.lion-ls-faq-answer > div{
    padding:0 18px 20px;
}


.lion-ls-faq-answer p{
    margin:0;

    padding-top:15px;

    border-top:1px solid #e6ebe7;

    color:var(--ls-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   CLOSING
========================================================= */

.lion-ls-closing{
    padding:0 0 100px;

    background:var(--ls-soft);
}


.lion-ls-closing-inner{
    padding:38px 42px;

    display:grid;

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

    align-items:center;

    gap:26px;

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

    border-radius:14px;

    background:#fff;
}


.lion-ls-closing-icon{
    width:80px;
    height:80px;

    min-width:80px;

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

    border-radius:50%;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            var(--ls-green-700),
            var(--ls-green-950)
        );
}


.lion-ls-closing-small{
    display:block;

    margin-bottom:4px;

    color:var(--ls-gold-dark);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-ls-closing h2{
    margin:0 0 9px;

    color:var(--ls-title);

    font-family:"Oswald",sans-serif;

    font-size:clamp(30px,3.5vw,45px);

    text-transform:uppercase;
}


.lion-ls-closing h2 strong{
    color:var(--ls-green-600);
}


.lion-ls-closing p{
    margin:0;

    color:var(--ls-text);

    font-size:14px;
    line-height:1.75;
}


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

.lion-ls-reveal{
    opacity:0;

    transform:translateY(35px);

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


.lion-ls-reveal.lion-ls-visible{
    opacity:1;

    transform:none;
}


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

@media(max-width:1050px){

    .lion-ls-intro-grid{
        grid-template-columns:1fr 1fr;
        gap:45px;
    }


    .lion-ls-benefits-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .lion-ls-property-grid,
    .lion-ls-grass-grid,
    .lion-ls-why-grid,
    .lion-ls-faq-grid{
        grid-template-columns:1fr 1fr;

        gap:45px;
    }


    .lion-ls-process-wrap{
        grid-template-columns:
            repeat(3,minmax(0,1fr));

        row-gap:45px;
    }


    .lion-ls-process-line{
        display:none;
    }


    .lion-ls-related-grid{
        grid-template-columns:1fr;
    }

}


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

@media(max-width:767px){

    .lion-ls-container{
        width:calc(100% - 28px);
    }


    .lion-ls-hero{
        min-height:390px;

        padding:78px 0 68px;
    }


    .lion-ls-hero h1{
        font-size:clamp(48px,15vw,70px);
    }


    .lion-ls-hero-content > p{
        font-size:14px;
    }


    .lion-ls-intro,
    .lion-ls-benefits,
    .lion-ls-property,
    .lion-ls-process,
    .lion-ls-why,
    .lion-ls-grass,
    .lion-ls-related,
    .lion-ls-faq{
        padding:75px 0;
    }


    .lion-ls-intro-grid,
    .lion-ls-property-grid,
    .lion-ls-grass-grid,
    .lion-ls-why-grid,
    .lion-ls-faq-grid{
        grid-template-columns:1fr;

        gap:40px;
    }


    .lion-ls-intro-visual{
        min-height:510px;
    }


    .lion-ls-main-image{
        width:88%;
        height:430px;
    }


    .lion-ls-secondary-image{
        width:46%;
        height:215px;
    }


    .lion-ls-intro-copy > p,
    .lion-ls-benefits-heading p,
    .lion-ls-property-copy > p,
    .lion-ls-grass-copy > p,
    .lion-ls-why-heading > p,
    .lion-ls-faq-heading > p{
        font-size:14px;
    }


    .lion-ls-intro-features{
        grid-template-columns:1fr;
    }


    .lion-ls-benefits-grid{
        grid-template-columns:1fr;
    }


    .lion-ls-benefit-card{
        min-height:0;
    }


    .lion-ls-property-visual,
    .lion-ls-grass-visual{
        min-height:430px;
    }


    .lion-ls-process-wrap{
        grid-template-columns:1fr;

        gap:30px;
    }


    .lion-ls-process-step{
        padding:0;

        display:grid;

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

        gap:14px;

        text-align:left;
    }


    .lion-ls-process-node{
        width:60px;
        height:60px;

        margin:0;

        grid-row:1 / span 2;
    }


    .lion-ls-process-node span{
        width:43px;
        height:43px;
    }


    .lion-ls-process-icon{
        margin:0 0 10px;
    }


    .lion-ls-why-heading,
    .lion-ls-faq-heading{
        position:static;
    }


    .lion-ls-why-list{
        grid-template-columns:1fr;
    }


    .lion-ls-why-card{
        min-height:0;
    }


    .lion-ls-closing{
        padding-bottom:70px;
    }


    .lion-ls-closing-inner{
        padding:26px 22px;

        grid-template-columns:1fr;

        gap:20px;
    }

}


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

@media(max-width:420px){

    .lion-ls-container{
        width:calc(100% - 20px);
    }


    .lion-ls-intro-visual{
        min-height:450px;
    }


    .lion-ls-main-image{
        height:385px;
    }


    .lion-ls-secondary-image{
        height:180px;
    }


    .lion-ls-visual-card{
        min-width:190px;

        left:14px;
        bottom:14px;
    }


    .lion-ls-property-card,
    .lion-ls-grass-card{
        left:15px;
        right:15px;
        bottom:15px;

        max-width:none;
    }

}


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

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

    .lion-ls-reveal,
    .lion-ls-process-step,
    .lion-ls-process-progress{
        transition:none !important;
    }


    .lion-ls-reveal{
        opacity:1;

        transform:none;
    }


    .lion-ls-process-step{
        opacity:1;

        transform:none;
    }

}

/* =========================================================
   LION TREE SERVICE & LANDSCAPING LLC
   GRASS INSTALLATION PAGE
========================================================= */

:root{
    --gi-green-950:#04170f;
    --gi-green-900:#071f16;
    --gi-green-800:#0b3123;
    --gi-green-700:#164a35;
    --gi-green-600:#286b49;

    --gi-gold:#f2bf3f;
    --gi-gold-dark:#d69a1b;
    --gi-gold-light:#ffe198;

    --gi-white:#ffffff;
    --gi-soft:#f5f8f5;
    --gi-soft-2:#edf2ed;

    --gi-title:#10271c;
    --gi-text:#526158;
    --gi-border:#dfe7e1;
}


/* =========================================================
   GLOBAL
========================================================= */

.lion-gi-container{
    width:min(92%,1380px);
    margin:0 auto;
    position:relative;
    z-index:3;
}


.lion-gi-hero *,
.lion-gi-intro *,
.lion-gi-needs *,
.lion-gi-transformation *,
.lion-gi-process *,
.lion-gi-why *,
.lion-gi-complete *,
.lion-gi-related *,
.lion-gi-faq *,
.lion-gi-closing *{
    box-sizing:border-box;
}


.lion-gi-hero i,
.lion-gi-intro i,
.lion-gi-needs i,
.lion-gi-transformation i,
.lion-gi-process i,
.lion-gi-why i,
.lion-gi-complete i,
.lion-gi-related i,
.lion-gi-faq i,
.lion-gi-closing i{
    position:static !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1 !important;
}


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

.lion-gi-hero{
    min-height:455px;
    padding:105px 0 95px;

    position:relative;
    overflow:hidden;

    display:flex;
    align-items:center;

    background:
        linear-gradient(
            105deg,
            rgba(3,20,13,.985),
            rgba(7,49,34,.94) 60%,
            rgba(25,84,58,.89)
        ),
        url("https://images.unsplash.com/photo-1585320806297-9794b3e4eeae?auto=format&fit=crop&w=2000&q=85");

    background-size:cover;
    background-position:center;
}


.lion-gi-hero::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 75% 18%,
            rgba(242,191,63,.14),
            transparent 28%
        );
}


.lion-gi-hero-rings{
    width:450px;
    height:450px;

    position:absolute;
    right:-155px;
    bottom:-230px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.14);

    box-shadow:
        0 0 0 45px rgba(255,255,255,.016),
        0 0 0 90px rgba(242,191,63,.024),
        0 0 0 135px rgba(255,255,255,.012);
}


.lion-gi-hero-rings::before,
.lion-gi-hero-rings::after{
    content:"";

    position:absolute;

    border-radius:50%;

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


.lion-gi-hero-rings::before{
    inset:60px;
}


.lion-gi-hero-rings::after{
    inset:128px;
}


.lion-gi-hero-tree{
    position:absolute;

    right:8%;
    bottom:-90px;

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

    font-size:350px;

    pointer-events:none;
}


.lion-gi-hero-grass{
    position:absolute;

    right:32%;
    top:90px;

    color:rgba(242,191,63,.065);

    font-size:100px;

    transform:rotate(15deg);

    pointer-events:none;
}


.lion-gi-hero-content{
    max-width:880px;
}


.lion-gi-eyebrow{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--gi-gold-light);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.3px;
}


.lion-gi-eyebrow-line{
    width:38px;
    height:3px;

    flex:0 0 38px;

    border-radius:20px;

    background:var(--gi-gold);
}


.lion-gi-eyebrow-icon{
    width:31px;
    height:31px;

    min-width:31px;
    min-height:31px;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--gi-green-950);

    background:var(--gi-gold);
}


.lion-gi-eyebrow-icon i{
    width:14px !important;
    height:14px !important;

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

    font-size:12px;
}


.lion-gi-hero h1{
    margin:0 0 19px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(52px,7vw,90px);
    line-height:.98;

    font-weight:700;

    text-transform:uppercase;
}


.lion-gi-hero h1 span{
    color:var(--gi-gold);
}


.lion-gi-hero-content > p{
    max-width:740px;

    margin:0 0 28px;

    color:rgba(255,255,255,.74);

    font-size:16px;
    line-height:1.75;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.lion-gi-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:11px;
}


.lion-gi-breadcrumb a,
.lion-gi-breadcrumb > span{
    min-height:38px;

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

    gap:8px;

    color:rgba(255,255,255,.69);

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

    font-weight:700;
}


.lion-gi-breadcrumb a{
    transition:color .25s ease;
}


.lion-gi-breadcrumb a:hover{
    color:var(--gi-gold-light);
}


.lion-gi-breadcrumb a i{
    color:var(--gi-gold);
}


.lion-gi-breadcrumb-divider{
    min-height:auto !important;

    color:rgba(255,255,255,.28) !important;
}


.lion-gi-breadcrumb-divider i{
    font-size:10px;
}


.lion-gi-breadcrumb span[aria-current="page"]{
    color:var(--gi-gold-light);
}


/* =========================================================
   SECTION LABELS
========================================================= */

.lion-gi-section-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--gi-green-600);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-gi-section-label > span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:var(--gi-gold);
}


.lion-gi-section-label-center{
    justify-content:center;
}


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

.lion-gi-intro{
    padding:110px 0;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-gi-intro::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 5% 15%,
            rgba(242,191,63,.075),
            transparent 20%
        ),
        radial-gradient(
            circle at 95% 85%,
            rgba(40,107,73,.045),
            transparent 22%
        );
}


.lion-gi-intro-rings{
    width:340px;
    height:340px;

    position:absolute;

    right:-170px;
    bottom:-155px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 45px rgba(40,107,73,.018),
        0 0 0 90px rgba(242,191,63,.02);
}


.lion-gi-intro-grid{
    display:grid;

    grid-template-columns:
        minmax(420px,.92fr)
        minmax(0,1.08fr);

    align-items:center;

    gap:clamp(55px,7vw,100px);
}


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

.lion-gi-intro-visual{
    min-height:620px;

    position:relative;
}


.lion-gi-main-image{
    width:83%;
    height:540px;

    position:absolute;

    top:0;
    left:0;

    overflow:hidden;

    border-radius:16px;

    box-shadow:
        0 28px 60px rgba(13,52,35,.15);
}


.lion-gi-main-image img,
.lion-gi-secondary-image img{
    width:100%;
    height:100%;

    display:block;

    object-fit:cover;

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


.lion-gi-main-image:hover img,
.lion-gi-secondary-image:hover img{
    transform:scale(1.05);
}


.lion-gi-secondary-image{
    width:47%;
    height:255px;

    position:absolute;

    right:0;
    bottom:0;

    overflow:hidden;

    border:7px solid #fff;

    border-radius:14px;

    box-shadow:
        0 20px 45px rgba(13,52,35,.14);
}


.lion-gi-visual-card{
    min-width:235px;
    min-height:80px;

    padding:14px 16px;

    position:absolute;

    left:28px;
    bottom:30px;

    z-index:5;

    display:flex;
    align-items:center;

    gap:12px;

    border-radius:10px;

    color:#fff;

    background:
        linear-gradient(
            120deg,
            var(--gi-green-950),
            var(--gi-green-700)
        );

    box-shadow:
        0 18px 40px rgba(0,0,0,.23);
}


.lion-gi-visual-card > span{
    width:44px;
    height:44px;

    min-width:44px;
    min-height:44px;

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

    border-radius:50%;

    color:var(--gi-green-950);

    background:var(--gi-gold);
}


.lion-gi-visual-card small{
    display:block;

    color:rgba(255,255,255,.58);

    font-size:14px;
}


.lion-gi-visual-card strong{
    display:block;

    margin-top:2px;

    color:#fff;

    font-family:"Oswald",sans-serif;

    font-size:19px;
}


.lion-gi-visual-ring{
    width:185px;
    height:185px;

    position:absolute;

    right:15px;
    top:25px;

    z-index:-1;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.20);

    box-shadow:
        0 0 0 22px rgba(242,191,63,.03),
        0 0 0 44px rgba(40,107,73,.025);
}


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

.lion-gi-intro-copy h2,
.lion-gi-why-heading h2,
.lion-gi-faq-heading h2{
    margin:0 0 25px;

    color:var(--gi-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.6vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-gi-intro-copy h2 strong,
.lion-gi-why-heading h2 strong,
.lion-gi-faq-heading h2 strong{
    display:block;

    color:var(--gi-green-600);
}


.lion-gi-intro-copy > p{
    margin:0 0 18px;

    color:var(--gi-text);

    font-size:15px;
    line-height:1.85;

    text-align:justify;
}


.lion-gi-intro-features{
    margin-top:28px;

    display:grid;

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

    gap:10px;
}


.lion-gi-intro-features > div{
    min-height:52px;

    padding:10px 12px;

    display:flex;
    align-items:center;

    gap:10px;

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

    border-radius:8px;

    color:#56665c;

    background:var(--gi-soft);

    font-size:14px;

    font-weight:700;
}


.lion-gi-intro-features > div > span{
    width:25px;
    height:25px;

    min-width:25px;

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

    border-radius:50%;

    color:var(--gi-green-700);

    background:rgba(40,107,73,.09);
}


/* =========================================================
   NEEDS
========================================================= */

.lion-gi-needs{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:var(--gi-soft);
}


.lion-gi-needs-tree{
    position:absolute;

    left:-70px;
    top:300px;

    color:rgba(11,54,37,.03);

    font-size:310px;
}


.lion-gi-needs-leaf{
    position:absolute;

    right:4%;
    bottom:80px;

    color:rgba(11,54,37,.03);

    font-size:110px;

    transform:rotate(25deg);
}


.lion-gi-needs-heading{
    max-width:820px;

    margin:0 auto 55px;

    text-align:center;
}


.lion-gi-needs-heading h2,
.lion-gi-process-heading h2,
.lion-gi-related-heading h2{
    margin:0 0 18px;

    color:var(--gi-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(42px,5vw,68px);
    line-height:1.03;

    text-transform:uppercase;
}


.lion-gi-needs-heading h2 strong,
.lion-gi-process-heading h2 strong,
.lion-gi-related-heading h2 strong{
    display:block;

    color:var(--gi-green-600);
}


.lion-gi-needs-heading p,
.lion-gi-process-heading p{
    max-width:670px;

    margin:0 auto;

    color:var(--gi-text);

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


.lion-gi-needs-grid{
    display:grid;

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

    gap:18px;
}


.lion-gi-need-card{
    min-height:300px;

    padding:28px 25px;

    position:relative;
    overflow:hidden;

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

    border-radius:14px;

    background:#fff;

    box-shadow:
        0 18px 42px rgba(16,53,36,.06);

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


.lion-gi-need-card:hover{
    transform:translateY(-8px);

    border-color:rgba(214,154,27,.36);

    box-shadow:
        0 27px 55px rgba(16,53,36,.11);
}


.lion-gi-need-card::before{
    content:"";

    width:78px;
    height:4px;

    position:absolute;

    top:0;
    left:25px;

    border-radius:0 0 15px 15px;

    background:
        linear-gradient(
            90deg,
            var(--gi-gold-dark),
            var(--gi-gold-light)
        );
}


.lion-gi-card-number{
    position:absolute;

    top:17px;
    right:18px;

    color:rgba(9,49,33,.065);

    font-family:"Oswald",sans-serif;

    font-size:55px;

    line-height:1;

    font-weight:700;
}


.lion-gi-need-icon{
    width:58px;
    height:58px;

    min-width:58px;

    margin-bottom:35px;

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

    border-radius:50%;

    color:var(--gi-green-950);

    background:
        linear-gradient(
            145deg,
            var(--gi-gold-light),
            var(--gi-gold)
        );
}


.lion-gi-need-card h3{
    margin:0 0 13px;

    color:var(--gi-title);

    font-family:"Oswald",sans-serif;

    font-size:26px;
}


.lion-gi-need-card p{
    margin:0;

    color:var(--gi-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   DARK SECTIONS
========================================================= */

.lion-gi-transformation,
.lion-gi-complete{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    color:#fff;

    background:
        linear-gradient(
            115deg,
            var(--gi-green-950),
            var(--gi-green-700)
        );
}


.lion-gi-transformation::before,
.lion-gi-complete::before{
    content:"";

    position:absolute;
    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(242,191,63,.10),
            transparent 27%
        );
}


.lion-gi-transformation-rings,
.lion-gi-complete-rings{
    width:420px;
    height:420px;

    position:absolute;

    left:-170px;
    bottom:-240px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.12);

    box-shadow:
        0 0 0 40px rgba(255,255,255,.013),
        0 0 0 80px rgba(242,191,63,.022),
        0 0 0 120px rgba(255,255,255,.010);
}


.lion-gi-transformation-grid,
.lion-gi-complete-grid{
    display:grid;

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

    align-items:center;

    gap:70px;
}


.lion-gi-dark-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--gi-gold-light);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-gi-dark-label span{
    width:36px;
    height:3px;

    display:block;

    background:var(--gi-gold);
}


.lion-gi-transformation-copy h2,
.lion-gi-complete-copy h2{
    margin:0 0 21px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.7vw,64px);
    line-height:1.04;

    text-transform:uppercase;
}


.lion-gi-transformation-copy h2 strong,
.lion-gi-complete-copy h2 strong{
    display:block;

    color:var(--gi-gold);
}


.lion-gi-transformation-copy > p,
.lion-gi-complete-copy > p{
    margin:0 0 17px;

    color:rgba(255,255,255,.67);

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


/* DARK LIST */

.lion-gi-transformation-list{
    margin-top:27px;

    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-gi-transformation-list > div{
    padding:14px;

    display:flex;
    align-items:flex-start;

    gap:13px;

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

    border-radius:9px;

    background:rgba(255,255,255,.045);
}


.lion-gi-transformation-list > div > span{
    width:43px;
    height:43px;

    min-width:43px;

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

    border-radius:50%;

    color:var(--gi-green-950);

    background:var(--gi-gold);
}


.lion-gi-transformation-list strong{
    display:block;

    margin-bottom:4px;

    color:#fff;

    font-size:15px;
}


.lion-gi-transformation-list p{
    margin:0;

    color:rgba(255,255,255,.58);

    font-size:14px;
    line-height:1.6;
}


/* DARK VISUAL */

.lion-gi-transformation-visual,
.lion-gi-complete-visual{
    min-height:520px;

    position:relative;
    overflow:hidden;

    border-radius:17px;

    box-shadow:
        0 28px 70px rgba(0,0,0,.25);
}


.lion-gi-transformation-image,
.lion-gi-complete-image{
    position:absolute;
    inset:0;

    background-size:cover;
    background-position:center;

    transition:transform .7s ease;
}


.lion-gi-transformation-image::after,
.lion-gi-complete-image::after{
    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(3,20,13,.04),
            rgba(3,20,13,.68)
        );
}


.lion-gi-transformation-visual:hover
.lion-gi-transformation-image,
.lion-gi-complete-visual:hover
.lion-gi-complete-image{
    transform:scale(1.04);
}


.lion-gi-transformation-card,
.lion-gi-complete-card{
    max-width:350px;

    position:absolute;

    left:25px;
    bottom:25px;

    z-index:3;

    padding:16px;

    display:flex;
    align-items:center;

    gap:13px;

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

    border-radius:10px;

    background:rgba(5,28,19,.88);

    backdrop-filter:blur(9px);
}


.lion-gi-transformation-card > span,
.lion-gi-complete-card > span{
    width:48px;
    height:48px;

    min-width:48px;

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

    border-radius:50%;

    color:var(--gi-green-950);

    background:var(--gi-gold);
}


.lion-gi-transformation-card small,
.lion-gi-complete-card small{
    display:block;

    color:rgba(255,255,255,.54);

    font-size:14px;
}


.lion-gi-transformation-card strong,
.lion-gi-complete-card strong{
    display:block;

    margin-top:3px;

    color:#fff;

    font-size:15px;
}


/* =========================================================
   PROCESS
========================================================= */

.lion-gi-process{
    padding:110px 0 120px;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-gi-process-tree{
    position:absolute;

    right:-60px;
    bottom:-100px;

    color:rgba(13,57,39,.025);

    font-size:350px;
}


.lion-gi-process-heading{
    max-width:800px;

    margin:0 auto 75px;

    text-align:center;
}


.lion-gi-process-wrap{
    max-width:1150px;

    margin:0 auto;

    position:relative;

    display:grid;

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


.lion-gi-process-line{
    height:4px;

    position:absolute;

    top:39px;
    left:10%;
    right:10%;

    overflow:hidden;

    border-radius:20px;

    background:#dce5de;
}


.lion-gi-process-progress{
    width:0%;
    height:100%;

    border-radius:20px;

    background:
        linear-gradient(
            90deg,
            var(--gi-gold),
            var(--gi-green-600)
        );

    transition:width .15s linear;
}


.lion-gi-process-step{
    position:relative;

    z-index:2;

    padding:0 14px;

    text-align:center;

    opacity:.35;

    transform:translateY(20px);

    transition:
        opacity .6s ease,
        transform .6s ease;
}


.lion-gi-process-step.lion-gi-step-visible{
    opacity:1;
    transform:translateY(0);
}


.lion-gi-process-node{
    width:78px;
    height:78px;

    margin:0 auto 24px;

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

    border-radius:50%;

    border:1px solid rgba(40,107,73,.18);

    background:#fff;

    box-shadow:
        0 8px 20px rgba(17,54,37,.07);
}


.lion-gi-process-node span{
    width:52px;
    height:52px;

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

    border-radius:50%;

    color:var(--gi-green-950);

    background:#dce5de;

    font-family:"Oswald",sans-serif;

    font-size:18px;

    font-weight:700;

    transition:background .4s ease;
}


.lion-gi-process-step.lion-gi-step-visible
.lion-gi-process-node span{
    background:var(--gi-gold);
}


.lion-gi-process-icon{
    width:41px;
    height:41px;

    margin:0 auto 14px;

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

    border-radius:50%;

    color:#fff;

    background:var(--gi-green-700);
}


.lion-gi-process-card h3{
    margin:0 0 9px;

    color:var(--gi-title);

    font-family:"Oswald",sans-serif;

    font-size:22px;
}


.lion-gi-process-card p{
    margin:0;

    color:var(--gi-text);

    font-size:14px;
    line-height:1.65;
}


/* =========================================================
   WHY CHOOSE
========================================================= */

.lion-gi-why{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    background:var(--gi-soft);
}


.lion-gi-why-rings{
    width:330px;
    height:330px;

    position:absolute;

    right:-155px;
    top:-130px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 40px rgba(40,107,73,.016),
        0 0 0 80px rgba(242,191,63,.02);
}


.lion-gi-why-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    gap:70px;
}


.lion-gi-why-heading{
    position:sticky;
    top:130px;
}


.lion-gi-why-heading > p{
    margin:0;

    color:var(--gi-text);

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


.lion-gi-why-list{
    display:grid;

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

    gap:14px;
}


.lion-gi-why-card{
    min-height:280px;

    padding:24px;

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

    border-radius:13px;

    background:#fff;

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


.lion-gi-why-card:hover{
    transform:translateY(-7px);

    border-color:rgba(214,154,27,.35);

    box-shadow:
        0 22px 45px rgba(15,52,35,.09);
}


.lion-gi-why-card > span{
    width:55px;
    height:55px;

    margin-bottom:28px;

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

    border-radius:50%;

    color:var(--gi-green-950);

    background:var(--gi-gold);
}


.lion-gi-why-card small{
    display:block;

    margin-bottom:5px;

    color:var(--gi-gold-dark);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-gi-why-card h3{
    margin:0 0 10px;

    color:var(--gi-title);

    font-family:"Oswald",sans-serif;

    font-size:24px;
}


.lion-gi-why-card p{
    margin:0;

    color:var(--gi-text);

    font-size:14px;
    line-height:1.7;
}


/* =========================================================
   COMPLETE LINKS
========================================================= */

.lion-gi-complete-links{
    margin-top:25px;

    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-gi-complete-links a{
    min-height:76px;

    padding:12px 14px;

    display:grid;

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

    align-items:center;

    gap:12px;

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

    border-radius:9px;

    color:#fff;

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

    transition:
        transform .3s ease,
        background .3s ease;
}


.lion-gi-complete-links a:hover{
    transform:translateX(4px);

    background:rgba(255,255,255,.075);
}


.lion-gi-complete-links a > span{
    width:43px;
    height:43px;

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

    border-radius:50%;

    color:var(--gi-green-950);

    background:var(--gi-gold);
}


.lion-gi-complete-links small{
    display:block;

    color:rgba(255,255,255,.52);

    font-size:14px;
}


.lion-gi-complete-links strong{
    display:block;

    margin-top:2px;

    color:#fff;

    font-size:15px;
}


/* =========================================================
   RELATED SERVICES
========================================================= */

.lion-gi-related{
    padding:105px 0;

    background:#fff;
}


.lion-gi-related-heading{
    max-width:790px;

    margin:0 auto 48px;

    text-align:center;
}


.lion-gi-related-grid{
    display:grid;

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

    gap:15px;
}


.lion-gi-related-card{
    min-height:130px;

    padding:19px;

    display:grid;

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

    align-items:center;

    gap:14px;

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

    border-radius:12px;

    background:var(--gi-soft);

    transition:
        transform .35s ease,
        background .35s ease,
        box-shadow .35s ease;
}


.lion-gi-related-card:hover{
    transform:translateY(-5px);

    background:#fff;

    box-shadow:
        0 20px 42px rgba(16,53,36,.09);
}


.lion-gi-related-icon{
    width:50px;
    height:50px;

    min-width:50px;

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

    border-radius:50%;

    color:var(--gi-green-950);

    background:var(--gi-gold);
}


.lion-gi-related-card small{
    display:block;

    color:var(--gi-gold-dark);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-gi-related-card h3{
    margin:3px 0 0;

    color:var(--gi-title);

    font-family:"Oswald",sans-serif;

    font-size:21px;
}


.lion-gi-related-arrow{
    width:38px;
    height:38px;

    min-width:38px;

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

    border-radius:50%;

    color:#fff;

    background:var(--gi-green-700);

    transition:
        transform .3s ease,
        background .3s ease;
}


.lion-gi-related-card:hover
.lion-gi-related-arrow{
    transform:translateX(3px);

    color:var(--gi-green-950);

    background:var(--gi-gold);
}


/* =========================================================
   FAQ
========================================================= */

.lion-gi-faq{
    padding:105px 0;

    position:relative;
    overflow:hidden;

    background:var(--gi-soft);
}


.lion-gi-faq-tree{
    position:absolute;

    left:-70px;
    bottom:-95px;

    color:rgba(12,55,37,.025);

    font-size:340px;

    pointer-events:none;
}


.lion-gi-faq-grid{
    display:grid;

    grid-template-columns:
        minmax(0,.85fr)
        minmax(0,1.15fr);

    align-items:start;

    gap:70px;
}


.lion-gi-faq-heading{
    position:sticky;

    top:130px;
}


.lion-gi-faq-heading > p{
    margin:0;

    color:var(--gi-text);

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


.lion-gi-faq-list{
    display:flex;
    flex-direction:column;

    gap:10px;
}


.lion-gi-faq-item{
    overflow:hidden;

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

    border-radius:10px;

    background:#fff;
}


.lion-gi-faq-question{
    width:100%;
    min-height:74px;

    padding:15px 18px;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    gap:20px;

    border:0;

    color:var(--gi-title);

    background:#fff;

    font-family:"DM Sans",Arial,sans-serif;

    font-size:15px;
    line-height:1.4;

    font-weight:800;

    text-align:left;

    cursor:pointer;
}


.lion-gi-faq-question > i{
    width:34px !important;
    height:34px !important;

    min-width:34px;

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

    border-radius:50%;

    color:var(--gi-green-950);

    background:var(--gi-gold);

    font-size:12px;

    transition:transform .3s ease;
}


.lion-gi-faq-item.lion-gi-faq-open
.lion-gi-faq-question > i{
    transform:rotate(45deg);
}


.lion-gi-faq-answer{
    max-height:0;

    overflow:hidden;

    transition:max-height .45s ease;
}


.lion-gi-faq-answer > div{
    padding:0 18px 20px;
}


.lion-gi-faq-answer p{
    margin:0;

    padding-top:15px;

    border-top:1px solid #e6ebe7;

    color:var(--gi-text);

    font-size:14px;
    line-height:1.75;
}


/* =========================================================
   CLOSING
========================================================= */

.lion-gi-closing{
    padding:0 0 100px;

    background:var(--gi-soft);
}


.lion-gi-closing-inner{
    padding:38px 42px;

    display:grid;

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

    align-items:center;

    gap:26px;

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

    border-radius:14px;

    background:#fff;
}


.lion-gi-closing-icon{
    width:80px;
    height:80px;

    min-width:80px;

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

    border-radius:50%;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            var(--gi-green-700),
            var(--gi-green-950)
        );
}


.lion-gi-closing-small{
    display:block;

    margin-bottom:4px;

    color:var(--gi-gold-dark);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-gi-closing h2{
    margin:0 0 9px;

    color:var(--gi-title);

    font-family:"Oswald",sans-serif;

    font-size:clamp(30px,3.5vw,45px);

    line-height:1.1;

    text-transform:uppercase;
}


.lion-gi-closing h2 strong{
    color:var(--gi-green-600);
}


.lion-gi-closing p{
    margin:0;

    max-width:900px;

    color:var(--gi-text);

    font-size:14px;
    line-height:1.75;
}


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

.lion-gi-reveal{
    opacity:0;

    transform:translateY(35px);

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


.lion-gi-reveal.lion-gi-visible{
    opacity:1;

    transform:translateY(0);
}


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

@media(max-width:1050px){

    .lion-gi-intro-grid{
        grid-template-columns:1fr 1fr;

        gap:45px;
    }


    .lion-gi-needs-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .lion-gi-transformation-grid,
    .lion-gi-complete-grid,
    .lion-gi-why-grid,
    .lion-gi-faq-grid{
        grid-template-columns:1fr 1fr;

        gap:45px;
    }


    .lion-gi-process-wrap{
        grid-template-columns:
            repeat(3,minmax(0,1fr));

        row-gap:45px;
    }


    .lion-gi-process-line{
        display:none;
    }


    .lion-gi-related-grid{
        grid-template-columns:1fr;
    }

}


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

@media(max-width:767px){

    .lion-gi-container{
        width:calc(100% - 28px);
    }


    .lion-gi-hero{
        min-height:400px;

        padding:78px 0 68px;
    }


    .lion-gi-hero h1{
        font-size:clamp(45px,14vw,67px);
    }


    .lion-gi-hero-content > p{
        font-size:14px;
    }


    .lion-gi-intro,
    .lion-gi-needs,
    .lion-gi-transformation,
    .lion-gi-process,
    .lion-gi-why,
    .lion-gi-complete,
    .lion-gi-related,
    .lion-gi-faq{
        padding:75px 0;
    }


    .lion-gi-intro-grid,
    .lion-gi-transformation-grid,
    .lion-gi-complete-grid,
    .lion-gi-why-grid,
    .lion-gi-faq-grid{
        grid-template-columns:1fr;

        gap:40px;
    }


    /* INTRO */

    .lion-gi-intro-visual{
        min-height:510px;
    }


    .lion-gi-main-image{
        width:88%;

        height:430px;
    }


    .lion-gi-secondary-image{
        width:46%;

        height:215px;
    }


    .lion-gi-intro-copy > p,
    .lion-gi-needs-heading p,
    .lion-gi-transformation-copy > p,
    .lion-gi-complete-copy > p,
    .lion-gi-why-heading > p,
    .lion-gi-faq-heading > p{
        font-size:14px;
    }


    .lion-gi-intro-features{
        grid-template-columns:1fr;
    }


    /* NEEDS */

    .lion-gi-needs-grid{
        grid-template-columns:1fr;
    }


    .lion-gi-need-card{
        min-height:0;
    }


    /* DARK */

    .lion-gi-transformation-visual,
    .lion-gi-complete-visual{
        min-height:430px;
    }


    /* PROCESS */

    .lion-gi-process-wrap{
        grid-template-columns:1fr;

        gap:30px;
    }


    .lion-gi-process-step{
        padding:0;

        display:grid;

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

        gap:14px;

        text-align:left;
    }


    .lion-gi-process-node{
        width:60px;
        height:60px;

        margin:0;

        grid-row:1 / span 2;
    }


    .lion-gi-process-node span{
        width:43px;
        height:43px;

        font-size:16px;
    }


    .lion-gi-process-icon{
        margin:0 0 10px;
    }


    /* WHY */

    .lion-gi-why-heading,
    .lion-gi-faq-heading{
        position:static;
    }


    .lion-gi-why-list{
        grid-template-columns:1fr;
    }


    .lion-gi-why-card{
        min-height:0;
    }


    /* CLOSING */

    .lion-gi-closing{
        padding-bottom:70px;
    }


    .lion-gi-closing-inner{
        padding:26px 22px;

        grid-template-columns:1fr;

        gap:20px;
    }

}


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

@media(max-width:420px){

    .lion-gi-container{
        width:calc(100% - 20px);
    }


    .lion-gi-intro-visual{
        min-height:450px;
    }


    .lion-gi-main-image{
        height:385px;
    }


    .lion-gi-secondary-image{
        height:180px;
    }


    .lion-gi-visual-card{
        min-width:195px;

        left:14px;
        bottom:14px;

        padding:12px;
    }


    .lion-gi-transformation-card,
    .lion-gi-complete-card{
        left:15px;
        right:15px;
        bottom:15px;

        max-width:none;
    }


    .lion-gi-related-card{
        padding:15px;
    }

}


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

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

    .lion-gi-reveal,
    .lion-gi-process-step,
    .lion-gi-process-progress{
        transition:none !important;
    }


    .lion-gi-reveal{
        opacity:1;

        transform:none;
    }


    .lion-gi-process-step{
        opacity:1;

        transform:none;
    }

}


/* =========================================================
   LION TREE SERVICE & LANDSCAPING LLC
   PROJECT GALLERY
========================================================= */

:root{
    --gallery-green-950:#04170f;
    --gallery-green-900:#071f16;
    --gallery-green-800:#0b3123;
    --gallery-green-700:#164a35;
    --gallery-green-600:#286b49;

    --gallery-gold:#f2bf3f;
    --gallery-gold-dark:#d69a1b;
    --gallery-gold-light:#ffe198;

    --gallery-white:#ffffff;
    --gallery-soft:#f5f8f5;
    --gallery-soft-2:#edf2ed;

    --gallery-title:#10271c;
    --gallery-text:#526158;
    --gallery-border:#dfe7e1;
}


/* =========================================================
   GENERAL
========================================================= */

.lion-gallery-container{
    width:min(92%,1400px);

    margin:0 auto;

    position:relative;

    z-index:3;
}


.lion-gallery-hero *,
.lion-gallery-intro *,
.lion-gallery-projects *,
.lion-gallery-about *,
.lion-gallery-lightbox *{
    box-sizing:border-box;
}


.lion-gallery-hero i,
.lion-gallery-intro i,
.lion-gallery-projects i,
.lion-gallery-about i,
.lion-gallery-lightbox i{
    position:static !important;

    margin:0 !important;
    padding:0 !important;

    line-height:1 !important;
}


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

.lion-gallery-hero{
    min-height:455px;

    padding:105px 0 95px;

    position:relative;

    overflow:hidden;

    display:flex;

    align-items:center;

    background:
        linear-gradient(
            105deg,
            rgba(3,20,13,.985),
            rgba(7,49,34,.945) 60%,
            rgba(25,84,58,.90)
        ),
        url("https://images.unsplash.com/photo-1448375240586-882707db888b?auto=format&fit=crop&w=2000&q=85");

    background-size:cover;

    background-position:center;
}


.lion-gallery-hero::before{
    content:"";

    position:absolute;

    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 75% 18%,
            rgba(242,191,63,.14),
            transparent 28%
        );
}


.lion-gallery-hero-rings{
    width:450px;
    height:450px;

    position:absolute;

    right:-155px;
    bottom:-230px;

    border-radius:50%;

    border:
        1px solid
        rgba(242,191,63,.14);

    box-shadow:
        0 0 0 45px rgba(255,255,255,.016),
        0 0 0 90px rgba(242,191,63,.024),
        0 0 0 135px rgba(255,255,255,.012);
}


.lion-gallery-hero-rings::before,
.lion-gallery-hero-rings::after{
    content:"";

    position:absolute;

    border-radius:50%;

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


.lion-gallery-hero-rings::before{
    inset:60px;
}


.lion-gallery-hero-rings::after{
    inset:128px;
}


.lion-gallery-hero-tree{
    position:absolute;

    right:7%;

    bottom:-95px;

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

    font-size:355px;

    pointer-events:none;
}


.lion-gallery-hero-camera{
    position:absolute;

    right:32%;

    top:95px;

    color:
        rgba(242,191,63,.055);

    font-size:95px;

    transform:rotate(-8deg);

    pointer-events:none;
}


.lion-gallery-hero-content{
    max-width:850px;
}


.lion-gallery-eyebrow{
    margin-bottom:15px;

    display:flex;

    align-items:center;

    gap:10px;

    color:
        var(--gallery-gold-light);

    font-size:14px;

    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.3px;
}


.lion-gallery-eyebrow-line{
    width:38px;
    height:3px;

    flex:0 0 38px;

    border-radius:20px;

    background:
        var(--gallery-gold);
}


.lion-gallery-eyebrow-icon{
    width:31px;
    height:31px;

    min-width:31px;
    min-height:31px;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:
        var(--gallery-green-950);

    background:
        var(--gallery-gold);
}


.lion-gallery-eyebrow-icon i{
    width:14px !important;
    height:14px !important;

    display:flex !important;

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

    font-size:12px;
}


.lion-gallery-hero h1{
    margin:0 0 19px;

    color:#fff;

    font-family:
        "Oswald",
        Arial,
        sans-serif;

    font-size:
        clamp(55px,7vw,93px);

    line-height:.98;

    font-weight:700;

    text-transform:uppercase;
}


.lion-gallery-hero h1 span{
    color:
        var(--gallery-gold);
}


.lion-gallery-hero-content > p{
    max-width:720px;

    margin:0 0 28px;

    color:
        rgba(255,255,255,.74);

    font-size:16px;

    line-height:1.75;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.lion-gallery-breadcrumb{
    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:11px;
}


.lion-gallery-breadcrumb a,
.lion-gallery-breadcrumb > span{
    min-height:38px;

    display:inline-flex;

    align-items:center;

    gap:8px;

    color:
        rgba(255,255,255,.69);

    font-size:14px;

    line-height:1.3;

    font-weight:700;
}


.lion-gallery-breadcrumb a{
    transition:
        color .25s ease;
}


.lion-gallery-breadcrumb a:hover{
    color:
        var(--gallery-gold-light);
}


.lion-gallery-breadcrumb a i{
    color:
        var(--gallery-gold);
}


.lion-gallery-breadcrumb-divider{
    min-height:auto !important;

    color:
        rgba(255,255,255,.28)
        !important;
}


.lion-gallery-breadcrumb-divider i{
    font-size:10px;
}


.lion-gallery-breadcrumb
span[aria-current="page"]{
    color:
        var(--gallery-gold-light);
}


/* =========================================================
   SECTION LABEL
========================================================= */

.lion-gallery-section-label{
    margin-bottom:15px;

    display:flex;

    align-items:center;

    gap:10px;

    color:
        var(--gallery-green-600);

    font-size:14px;

    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.2px;
}


.lion-gallery-section-label > span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:
        var(--gallery-gold);
}


.lion-gallery-section-label-center{
    justify-content:center;
}


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

.lion-gallery-intro{
    padding:95px 0;

    position:relative;

    overflow:hidden;

    background:#fff;
}


.lion-gallery-intro::before{
    content:"";

    position:absolute;

    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 5% 20%,
            rgba(242,191,63,.07),
            transparent 20%
        ),

        radial-gradient(
            circle at 94% 85%,
            rgba(40,107,73,.04),
            transparent 22%
        );
}


.lion-gallery-intro-rings{
    width:300px;
    height:300px;

    position:absolute;

    right:-150px;
    bottom:-140px;

    border-radius:50%;

    border:
        1px solid
        rgba(40,107,73,.06);

    box-shadow:
        0 0 0 40px rgba(40,107,73,.016),
        0 0 0 80px rgba(242,191,63,.02);
}


.lion-gallery-intro-grid{
    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        minmax(460px,.85fr);

    align-items:center;

    gap:70px;
}


.lion-gallery-intro-copy h2{
    margin:0 0 22px;

    color:
        var(--gallery-title);

    font-family:
        "Oswald",
        Arial,
        sans-serif;

    font-size:
        clamp(40px,4.6vw,64px);

    line-height:1.04;

    text-transform:uppercase;
}


.lion-gallery-intro-copy h2 strong{
    display:block;

    color:
        var(--gallery-green-600);
}


.lion-gallery-intro-copy p{
    margin:0 0 17px;

    color:
        var(--gallery-text);

    font-size:15px;

    line-height:1.85;

    text-align:justify;
}


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

.lion-gallery-intro-stats{
    display:grid;

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

    gap:12px;
}


.lion-gallery-stat{
    min-height:145px;

    padding:20px;

    display:flex;

    align-items:center;

    gap:15px;

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

    border-radius:13px;

    background:
        var(--gallery-soft);

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        background .35s ease;
}


.lion-gallery-stat:hover{
    transform:
        translateY(-5px);

    background:#fff;

    box-shadow:
        0 20px 40px
        rgba(16,53,36,.08);
}


.lion-gallery-stat > span{
    width:52px;
    height:52px;

    min-width:52px;
    min-height:52px;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:
        var(--gallery-green-950);

    background:
        var(--gallery-gold);
}


.lion-gallery-stat > span i{
    width:20px !important;
    height:20px !important;

    display:flex !important;

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

    font-size:17px;
}


.lion-gallery-stat strong{
    display:block;

    color:
        var(--gallery-title);

    font-family:
        "Oswald",
        sans-serif;

    font-size:29px;

    line-height:1.05;
}


.lion-gallery-stat small{
    display:block;

    margin-top:5px;

    color:
        var(--gallery-text);

    font-size:14px;

    line-height:1.3;
}


/* =========================================================
   PROJECTS
========================================================= */

.lion-gallery-projects{
    padding:105px 0 120px;

    position:relative;

    overflow:hidden;

    background:
        var(--gallery-soft);
}


.lion-gallery-projects::before{
    content:"";

    position:absolute;

    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 8% 12%,
            rgba(40,107,73,.04),
            transparent 20%
        ),

        radial-gradient(
            circle at 94% 88%,
            rgba(242,191,63,.055),
            transparent 23%
        );
}


.lion-gallery-projects-tree{
    position:absolute;

    left:-80px;
    top:420px;

    color:
        rgba(11,54,37,.025);

    font-size:360px;

    pointer-events:none;
}


.lion-gallery-projects-leaf{
    position:absolute;

    right:3%;
    bottom:200px;

    color:
        rgba(11,54,37,.025);

    font-size:130px;

    transform:rotate(25deg);

    pointer-events:none;
}


.lion-gallery-projects-heading{
    max-width:850px;

    margin:0 auto 55px;

    text-align:center;
}


.lion-gallery-projects-heading h2{
    margin:0 0 18px;

    color:
        var(--gallery-title);

    font-family:
        "Oswald",
        Arial,
        sans-serif;

    font-size:
        clamp(42px,5vw,68px);

    line-height:1.03;

    text-transform:uppercase;
}


.lion-gallery-projects-heading h2 strong{
    display:block;

    color:
        var(--gallery-green-600);
}


.lion-gallery-projects-heading p{
    max-width:650px;

    margin:0 auto;

    color:
        var(--gallery-text);

    font-size:15px;

    line-height:1.8;
}


/* =========================================================
   MASONRY GALLERY
========================================================= */

.lion-gallery-grid{
    column-count:4;

    column-gap:15px;
}


.lion-gallery-item{
    width:100%;

    margin:0 0 15px;

    position:relative;

    display:inline-block;

    break-inside:avoid;

    vertical-align:top;

    overflow:hidden;

    border-radius:12px;

    background:
        var(--gallery-green-900);

    box-shadow:
        0 10px 25px
        rgba(13,52,35,.08);
}


.lion-gallery-image-button{
    width:100%;

    padding:0;

    display:block;

    position:relative;

    overflow:hidden;

    border:0;

    background:
        var(--gallery-green-900);

    cursor:pointer;
}


.lion-gallery-image-button img{
    width:100%;
    height:auto;

    min-height:180px;

    display:block;

    object-fit:cover;

    transition:
        transform .65s
        cubic-bezier(.22,.61,.36,1),
        filter .4s ease;
}


.lion-gallery-item:hover
.lion-gallery-image-button img{
    transform:
        scale(1.045);

    filter:
        brightness(.72);
}


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

.lion-gallery-image-overlay{
    position:absolute;

    inset:0;

    padding:17px;

    display:flex;

    align-items:flex-end;
    justify-content:space-between;

    gap:15px;

    opacity:0;

    background:
        linear-gradient(
            180deg,
            rgba(4,23,15,.03) 20%,
            rgba(4,23,15,.80) 100%
        );

    transition:
        opacity .35s ease;
}


.lion-gallery-item:hover
.lion-gallery-image-overlay,
.lion-gallery-image-button:focus-visible
.lion-gallery-image-overlay{
    opacity:1;
}


.lion-gallery-image-number{
    color:#fff;

    font-size:14px;

    line-height:1.3;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.7px;
}


.lion-gallery-view-icon{
    width:44px;
    height:44px;

    min-width:44px;
    min-height:44px;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:
        var(--gallery-green-950);

    background:
        var(--gallery-gold);

    transform:
        translateY(10px);

    transition:
        transform .35s ease;
}


.lion-gallery-item:hover
.lion-gallery-view-icon{
    transform:
        translateY(0);
}


.lion-gallery-view-icon i{
    width:17px !important;
    height:17px !important;

    display:flex !important;

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

    font-size:14px;
}


/* =========================================================
   ABOUT / SERVICES
========================================================= */

.lion-gallery-about{
    padding:100px 0;

    position:relative;

    overflow:hidden;

    color:#fff;

    background:
        linear-gradient(
            115deg,
            var(--gallery-green-950),
            var(--gallery-green-700)
        );
}


.lion-gallery-about::before{
    content:"";

    position:absolute;

    inset:0;

    pointer-events:none;

    background:
        radial-gradient(
            circle at 90% 20%,
            rgba(242,191,63,.10),
            transparent 28%
        );
}


.lion-gallery-about-rings{
    width:400px;
    height:400px;

    position:absolute;

    right:-180px;
    bottom:-230px;

    border-radius:50%;

    border:
        1px solid
        rgba(242,191,63,.11);

    box-shadow:
        0 0 0 40px rgba(255,255,255,.012),
        0 0 0 80px rgba(242,191,63,.02);
}


.lion-gallery-about-grid{
    max-width:1100px;

    margin:0 auto;

    display:grid;

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

    align-items:start;

    gap:40px;
}


.lion-gallery-about-icon > span{
    width:110px;
    height:110px;

    min-width:110px;
    min-height:110px;

    display:flex !important;

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

    overflow:hidden;

    border-radius:50%;

    color:
        var(--gallery-green-950);

    background:
        var(--gallery-gold);

    box-shadow:
        0 15px 35px
        rgba(0,0,0,.18);
}


.lion-gallery-about-icon > span i{
    width:43px !important;
    height:43px !important;

    display:flex !important;

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

    font-size:38px;
}


.lion-gallery-dark-label{
    margin-bottom:15px;

    display:flex;

    align-items:center;

    gap:10px;

    color:
        var(--gallery-gold-light);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1.2px;
}


.lion-gallery-dark-label span{
    width:36px;
    height:3px;

    display:block;

    border-radius:20px;

    background:
        var(--gallery-gold);
}


.lion-gallery-about-copy h2{
    margin:0 0 20px;

    color:#fff;

    font-family:
        "Oswald",
        sans-serif;

    font-size:
        clamp(39px,4.5vw,62px);

    line-height:1.04;

    text-transform:uppercase;
}


.lion-gallery-about-copy h2 strong{
    display:block;

    color:
        var(--gallery-gold);
}


.lion-gallery-about-copy p{
    max-width:850px;

    margin:0 0 16px;

    color:
        rgba(255,255,255,.68);

    font-size:15px;

    line-height:1.8;
}


/* TAGS */

.lion-gallery-service-tags{
    margin-top:27px;

    display:flex;

    flex-wrap:wrap;

    gap:8px;
}


.lion-gallery-service-tags a{
    min-height:40px;

    padding:0 14px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

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

    border-radius:30px;

    color:
        rgba(255,255,255,.82);

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

    font-size:14px;

    font-weight:700;

    transition:
        color .25s ease,
        background .25s ease,
        border-color .25s ease,
        transform .25s ease;
}


.lion-gallery-service-tags a:hover{
    transform:
        translateY(-2px);

    border-color:
        var(--gallery-gold);

    color:
        var(--gallery-green-950);

    background:
        var(--gallery-gold);
}


/* =========================================================
   LIGHTBOX
========================================================= */

body.lion-gallery-lock{
    overflow:hidden !important;
}


.lion-gallery-lightbox{
    width:100%;
    height:100%;

    position:fixed;

    inset:0;

    z-index:999999;

    display:flex;

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

    padding:25px;

    visibility:hidden;

    opacity:0;

    transition:
        opacity .3s ease,
        visibility .3s ease;
}


.lion-gallery-lightbox.lion-gallery-lightbox-open{
    visibility:visible;

    opacity:1;
}


.lion-gallery-lightbox-backdrop{
    position:absolute;

    inset:0;

    border:0;

    background:
        rgba(1,10,6,.94);

    backdrop-filter:
        blur(8px);

    cursor:pointer;
}


.lion-gallery-lightbox-viewer{
    width:min(96vw,1500px);
    height:min(92vh,950px);

    position:relative;

    z-index:3;

    display:flex;

    flex-direction:column;

    overflow:hidden;

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

    border-radius:14px;

    background:
        var(--gallery-green-950);

    box-shadow:
        0 35px 90px
        rgba(0,0,0,.55);

    transform:
        scale(.96);

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


.lion-gallery-lightbox-open
.lion-gallery-lightbox-viewer{
    transform:
        scale(1);
}


/* LIGHTBOX TOP */

.lion-gallery-lightbox-top{
    min-height:66px;

    padding:10px 15px 10px 20px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:20px;

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


.lion-gallery-lightbox-counter{
    display:flex;

    align-items:center;

    gap:7px;

    color:
        rgba(255,255,255,.55);

    font-family:
        "Oswald",
        sans-serif;

    font-size:15px;

    font-weight:700;
}


.lion-gallery-lightbox-counter
span:first-child{
    color:
        var(--gallery-gold);

    font-size:22px;
}


.lion-gallery-lightbox-close{
    width:44px;
    height:44px;

    min-width:44px;
    min-height:44px;

    display:flex !important;

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

    overflow:hidden;

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

    border-radius:50%;

    color:#fff;

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

    cursor:pointer;

    transition:
        color .25s ease,
        background .25s ease,
        transform .25s ease;
}


.lion-gallery-lightbox-close:hover{
    transform:
        rotate(90deg);

    color:
        var(--gallery-green-950);

    background:
        var(--gallery-gold);
}


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

.lion-gallery-lightbox-image-wrap{
    min-height:0;

    flex:1;

    position:relative;

    display:grid;

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

    align-items:center;

    gap:10px;

    padding:12px;
}


.lion-gallery-lightbox-image-container{
    width:100%;
    height:100%;

    min-height:0;

    position:relative;

    display:flex;

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

    overflow:hidden;

    border-radius:8px;

    background:#020b07;
}


.lion-gallery-lightbox-image-container img{
    max-width:100%;
    max-height:100%;

    width:auto;
    height:auto;

    display:block;

    object-fit:contain;

    opacity:1;

    transform:scale(1);

    transition:
        opacity .2s ease,
        transform .3s ease;
}


.lion-gallery-lightbox-image-container
img.lion-gallery-image-changing{
    opacity:.15;

    transform:
        scale(.985);
}


.lion-gallery-lightbox-loading{
    position:absolute;

    inset:0;

    display:none;

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

    color:
        var(--gallery-gold);

    font-size:32px;
}


.lion-gallery-lightbox-arrow{
    width:52px;
    height:52px;

    min-width:52px;
    min-height:52px;

    margin:auto;

    display:flex !important;

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

    overflow:hidden;

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

    border-radius:50%;

    color:#fff;

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

    cursor:pointer;

    transition:
        color .25s ease,
        background .25s ease,
        transform .25s ease;
}


.lion-gallery-lightbox-arrow:hover{
    color:
        var(--gallery-green-950);

    background:
        var(--gallery-gold);

    transform:
        scale(1.06);
}


/* =========================================================
   LIGHTBOX BOTTOM
========================================================= */

.lion-gallery-lightbox-bottom{
    min-height:72px;

    padding:12px 20px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:20px;

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


.lion-gallery-lightbox-bottom > span{
    display:flex;

    align-items:center;

    gap:9px;

    color:
        rgba(255,255,255,.52);

    font-size:14px;
}


.lion-gallery-lightbox-bottom > span i{
    color:
        var(--gallery-gold);
}


.lion-gallery-lightbox-bottom strong{
    color:#fff;

    font-family:
        "Oswald",
        sans-serif;

    font-size:18px;

    font-weight:600;
}


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

.lion-gallery-reveal{
    opacity:0;

    transform:
        translateY(30px);

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


.lion-gallery-reveal.lion-gallery-visible{
    opacity:1;

    transform:
        translateY(0);
}


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

@media(max-width:1100px){

    .lion-gallery-grid{
        column-count:3;
    }


    .lion-gallery-intro-grid{
        grid-template-columns:
            1fr 1fr;

        gap:45px;
    }

}


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

@media(max-width:767px){

    .lion-gallery-container{
        width:
            calc(100% - 28px);
    }


    .lion-gallery-hero{
        min-height:390px;

        padding:78px 0 68px;
    }


    .lion-gallery-hero h1{
        font-size:
            clamp(48px,15vw,70px);
    }


    .lion-gallery-hero-content > p{
        font-size:14px;
    }


    .lion-gallery-intro,
    .lion-gallery-projects,
    .lion-gallery-about{
        padding:75px 0;
    }


    .lion-gallery-intro-grid{
        grid-template-columns:1fr;

        gap:35px;
    }


    .lion-gallery-intro-copy p,
    .lion-gallery-projects-heading p,
    .lion-gallery-about-copy p{
        font-size:14px;
    }


    .lion-gallery-intro-stats{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .lion-gallery-stat{
        min-height:125px;

        padding:15px;

        flex-direction:column;

        align-items:flex-start;
    }


    /* GALLERY */

    .lion-gallery-grid{
        column-count:2;

        column-gap:10px;
    }


    .lion-gallery-item{
        margin-bottom:10px;

        border-radius:8px;
    }


    .lion-gallery-image-overlay{
        padding:10px;
    }


    .lion-gallery-image-number{
        font-size:14px;
    }


    .lion-gallery-view-icon{
        width:38px;
        height:38px;

        min-width:38px;
        min-height:38px;
    }


    /* ABOUT */

    .lion-gallery-about-grid{
        grid-template-columns:1fr;

        gap:25px;
    }


    .lion-gallery-about-icon > span{
        width:80px;
        height:80px;

        min-width:80px;
        min-height:80px;
    }


    /* LIGHTBOX */

    .lion-gallery-lightbox{
        padding:8px;
    }


    .lion-gallery-lightbox-viewer{
        width:100%;
        height:95vh;

        border-radius:10px;
    }


    .lion-gallery-lightbox-image-wrap{
        grid-template-columns:
            1fr;

        padding:8px;
    }


    .lion-gallery-lightbox-arrow{
        position:absolute;

        top:50%;

        z-index:8;

        width:44px;
        height:44px;

        min-width:44px;
        min-height:44px;

        transform:
            translateY(-50%);

        background:
            rgba(4,23,15,.82);
    }


    .lion-gallery-lightbox-arrow:hover{
        transform:
            translateY(-50%);
    }


    .lion-gallery-lightbox-prev{
        left:16px;
    }


    .lion-gallery-lightbox-next{
        right:16px;
    }


    .lion-gallery-lightbox-bottom{
        min-height:68px;

        padding:10px 14px;

        align-items:flex-start;

        flex-direction:column;

        gap:5px;
    }

}


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

@media(max-width:420px){

    .lion-gallery-container{
        width:
            calc(100% - 20px);
    }


    .lion-gallery-intro-stats{
        grid-template-columns:1fr;
    }


    .lion-gallery-stat{
        min-height:auto;

        flex-direction:row;

        align-items:center;
    }


    .lion-gallery-grid{
        column-count:1;
    }


    .lion-gallery-item{
        margin-bottom:12px;
    }


    .lion-gallery-image-overlay{
        opacity:1;

        background:
            linear-gradient(
                180deg,
                transparent 45%,
                rgba(4,23,15,.70)
            );
    }


    .lion-gallery-view-icon{
        transform:none;
    }

}


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

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

    .lion-gallery-reveal,
    .lion-gallery-image-button img,
    .lion-gallery-view-icon,
    .lion-gallery-lightbox,
    .lion-gallery-lightbox-viewer{
        transition:none !important;
    }


    .lion-gallery-reveal{
        opacity:1;

        transform:none;
    }

}

/* =========================================================
   LION TREE SERVICE & LANDSCAPING LLC
   CONTACT US
========================================================= */

:root{
    --contact-green-950:#04170f;
    --contact-green-900:#071f16;
    --contact-green-800:#0b3123;
    --contact-green-700:#164a35;
    --contact-green-600:#286b49;

    --contact-gold:#f2bf3f;
    --contact-gold-dark:#d69a1b;
    --contact-gold-light:#ffe198;

    --contact-white:#ffffff;
    --contact-soft:#f5f8f5;
    --contact-soft-2:#edf2ed;

    --contact-title:#10271c;
    --contact-text:#526158;
    --contact-border:#dfe7e1;
}


/* =========================================================
   GENERAL
========================================================= */

.lion-contact-container{
    width:min(92%,1400px);
    margin:0 auto;
    position:relative;
    z-index:3;
}


.lion-contact-hero *,
.lion-contact-intro *,
.lion-contact-main *,
.lion-contact-map-section *,
.lion-contact-services *{
    box-sizing:border-box;
}


.lion-contact-hero i,
.lion-contact-intro i,
.lion-contact-main i,
.lion-contact-map-section i,
.lion-contact-services i{
    position:static !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1 !important;
}


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

.lion-contact-hero{
    min-height:455px;
    padding:105px 0 95px;

    position:relative;
    overflow:hidden;

    display:flex;
    align-items:center;

    background:
        linear-gradient(
            105deg,
            rgba(3,20,13,.985),
            rgba(7,49,34,.945) 60%,
            rgba(25,84,58,.90)
        ),
        url("https://images.unsplash.com/photo-1448375240586-882707db888b?auto=format&fit=crop&w=2000&q=85");

    background-size:cover;
    background-position:center;
}


.lion-contact-hero::before{
    content:"";

    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 75% 18%,
            rgba(242,191,63,.14),
            transparent 28%
        );

    pointer-events:none;
}


.lion-contact-hero-rings{
    width:450px;
    height:450px;

    position:absolute;

    right:-155px;
    bottom:-230px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.14);

    box-shadow:
        0 0 0 45px rgba(255,255,255,.016),
        0 0 0 90px rgba(242,191,63,.024),
        0 0 0 135px rgba(255,255,255,.012);
}


.lion-contact-hero-rings::before,
.lion-contact-hero-rings::after{
    content:"";

    position:absolute;

    border-radius:50%;

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


.lion-contact-hero-rings::before{
    inset:60px;
}


.lion-contact-hero-rings::after{
    inset:128px;
}


.lion-contact-hero-tree{
    position:absolute;

    right:7%;
    bottom:-95px;

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

    font-size:355px;

    pointer-events:none;
}


.lion-contact-hero-message{
    position:absolute;

    right:32%;
    top:95px;

    color:rgba(242,191,63,.055);

    font-size:90px;

    transform:rotate(-8deg);

    pointer-events:none;
}


.lion-contact-hero-content{
    max-width:880px;
}


.lion-contact-eyebrow{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--contact-gold-light);

    font-size:14px;
    line-height:1.4;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.3px;
}


.lion-contact-eyebrow-line{
    width:38px;
    height:3px;

    flex:0 0 38px;

    border-radius:20px;

    background:var(--contact-gold);
}


.lion-contact-eyebrow-icon{
    width:31px;
    height:31px;

    min-width:31px;
    min-height:31px;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--contact-green-950);

    background:var(--contact-gold);
}


.lion-contact-hero h1{
    margin:0 0 19px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(55px,7vw,93px);
    line-height:.98;

    font-weight:700;

    text-transform:uppercase;
}


.lion-contact-hero h1 span{
    color:var(--contact-gold);
}


.lion-contact-hero-content > p{
    max-width:760px;

    margin:0 0 28px;

    color:rgba(255,255,255,.74);

    font-size:16px;
    line-height:1.75;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.lion-contact-breadcrumb{
    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:11px;
}


.lion-contact-breadcrumb a,
.lion-contact-breadcrumb > span{
    min-height:38px;

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

    gap:8px;

    color:rgba(255,255,255,.69);

    font-size:14px;

    font-weight:700;
}


.lion-contact-breadcrumb a{
    transition:color .25s ease;
}


.lion-contact-breadcrumb a:hover{
    color:var(--contact-gold-light);
}


.lion-contact-breadcrumb a i{
    color:var(--contact-gold);
}


.lion-contact-breadcrumb-divider{
    min-height:auto !important;

    color:rgba(255,255,255,.28) !important;
}


.lion-contact-breadcrumb-divider i{
    font-size:10px;
}


.lion-contact-breadcrumb span[aria-current="page"]{
    color:var(--contact-gold-light);
}


/* =========================================================
   SECTION LABELS
========================================================= */

.lion-contact-section-label{
    margin-bottom:15px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--contact-green-600);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-contact-section-label > span{
    width:36px;
    height:3px;

    display:block;

    border-radius:30px;

    background:var(--contact-gold);
}


.lion-contact-section-label-center{
    justify-content:center;
}


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

.lion-contact-intro{
    padding:95px 0 105px;

    position:relative;
    overflow:hidden;

    background:#fff;
}


.lion-contact-intro::before{
    content:"";

    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 5% 15%,
            rgba(242,191,63,.065),
            transparent 21%
        );

    pointer-events:none;
}


.lion-contact-intro-rings{
    width:300px;
    height:300px;

    position:absolute;

    right:-145px;
    bottom:-150px;

    border-radius:50%;

    border:1px solid rgba(40,107,73,.06);

    box-shadow:
        0 0 0 40px rgba(40,107,73,.016),
        0 0 0 80px rgba(242,191,63,.02);
}


.lion-contact-intro-heading{
    max-width:850px;

    margin:0 auto 48px;

    text-align:center;
}


.lion-contact-intro-heading h2,
.lion-contact-form-heading h2,
.lion-contact-services-heading h2{
    margin:0 0 18px;

    color:var(--contact-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(40px,4.8vw,65px);

    line-height:1.03;

    text-transform:uppercase;
}


.lion-contact-intro-heading h2 strong,
.lion-contact-form-heading h2 strong,
.lion-contact-services-heading h2 strong{
    display:block;

    color:var(--contact-green-600);
}


.lion-contact-intro-heading p{
    max-width:690px;

    margin:0 auto;

    color:var(--contact-text);

    font-size:15px;

    line-height:1.8;
}


/* =========================================================
   QUICK CARDS
========================================================= */

.lion-contact-quick-grid{
    display:grid;

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

    gap:14px;
}


.lion-contact-quick-card{
    min-width:0;
    min-height:145px;

    padding:20px;

    display:grid;

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

    align-items:center;

    gap:13px;

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

    border-radius:13px;

    color:inherit;

    background:var(--contact-soft);

    transition:
        transform .3s ease,
        background .3s ease,
        box-shadow .3s ease;
}


a.lion-contact-quick-card:hover{
    transform:translateY(-5px);

    background:#fff;

    box-shadow:
        0 20px 40px rgba(16,53,36,.09);
}


.lion-contact-quick-icon{
    width:50px;
    height:50px;

    min-width:50px;
    min-height:50px;

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

    overflow:hidden;

    border-radius:50%;

    color:var(--contact-green-950);

    background:var(--contact-gold);
}


.lion-contact-quick-card small{
    display:block;

    margin-bottom:4px;

    color:var(--contact-gold-dark);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-contact-quick-card strong{
    display:block;

    overflow-wrap:anywhere;

    color:var(--contact-title);

    font-size:15px;

    line-height:1.35;
}


.lion-contact-quick-card p{
    margin:5px 0 0;

    color:var(--contact-text);

    font-size:14px;
}


.lion-contact-quick-arrow{
    width:35px;
    height:35px;

    min-width:35px;
    min-height:35px;

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

    border-radius:50%;

    color:#fff;

    background:var(--contact-green-700);
}


/* =========================================================
   FORM AREA
========================================================= */

.lion-contact-main{
    padding:110px 0;

    position:relative;
    overflow:hidden;

    background:var(--contact-soft);
}


.lion-contact-main-tree{
    position:absolute;

    right:-80px;
    bottom:-100px;

    color:rgba(11,54,37,.025);

    font-size:370px;

    pointer-events:none;
}


.lion-contact-main-grid{
    display:grid;

    grid-template-columns:
        minmax(0,1.25fr)
        minmax(340px,.75fr);

    align-items:start;

    gap:30px;
}


.lion-contact-form-column{
    min-width:0;

    padding:38px;

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

    border-radius:17px;

    background:#fff;

    box-shadow:
        0 20px 50px rgba(16,53,36,.07);
}


.lion-contact-form-heading{
    margin-bottom:30px;
}


.lion-contact-form-heading h2{
    font-size:clamp(36px,4vw,55px);
}


.lion-contact-form-heading p{
    margin:0;

    color:var(--contact-text);

    font-size:15px;

    line-height:1.8;
}


/* =========================================================
   FORM
========================================================= */

#formulario{
    width:100%;

    display:flex;
    flex-direction:column;

    gap:18px;
}


.lion-contact-form-row{
    width:100%;

    display:grid;

    grid-template-columns:1fr;

    gap:15px;
}


.lion-contact-form-row-2{
    grid-template-columns:
        repeat(2,minmax(0,1fr));
}


.lion-contact-field{
    min-width:0;

    display:block;
}


.lion-contact-field > span,
.lion-contact-preference legend{
    display:block;

    margin-bottom:8px;

    color:var(--contact-title);

    font-size:14px;

    font-weight:800;
}


.lion-contact-field > span b{
    color:var(--contact-gold-dark);
}


.lion-contact-input-wrap,
.lion-contact-select-wrap,
.lion-contact-textarea-wrap{
    width:100%;

    position:relative;
}


.lion-contact-input-wrap > i:first-child,
.lion-contact-select-wrap > i:first-child,
.lion-contact-textarea-wrap > i:first-child{
    position:absolute !important;

    left:16px;
    top:50%;

    z-index:2;

    transform:translateY(-50%);

    color:var(--contact-green-600);

    font-size:14px;

    pointer-events:none;
}


.lion-contact-textarea-wrap > i:first-child{
    top:20px;

    transform:none;
}


.lion-contact-input-wrap input,
.lion-contact-select-wrap select,
.lion-contact-textarea-wrap textarea{
    width:100%;

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

    border-radius:9px;

    outline:none;

    color:var(--contact-title);

    background:var(--contact-soft);

    font-family:"DM Sans",Arial,sans-serif;

    font-size:15px;

    transition:
        border-color .25s ease,
        background .25s ease,
        box-shadow .25s ease;
}


.lion-contact-input-wrap input{
    height:58px;

    padding:0 16px 0 45px;
}


.lion-contact-select-wrap select{
    height:58px;

    padding:0 46px 0 45px;

    appearance:none;
    -webkit-appearance:none;

    cursor:pointer;
}


.lion-contact-select-wrap > i:last-child{
    position:absolute !important;

    right:16px;
    top:50%;

    transform:translateY(-50%);

    color:var(--contact-green-600);

    font-size:11px;

    pointer-events:none;
}


.lion-contact-textarea-wrap textarea{
    min-height:175px;

    padding:16px 16px 16px 45px;

    resize:vertical;
}


.lion-contact-input-wrap input:focus,
.lion-contact-select-wrap select:focus,
.lion-contact-textarea-wrap textarea:focus{
    border-color:var(--contact-gold-dark);

    background:#fff;

    box-shadow:
        0 0 0 3px rgba(242,191,63,.12);
}


/* =========================================================
   RADIO
========================================================= */

.lion-contact-preference{
    margin:0;
    padding:0;

    border:0;
}


.lion-contact-radio-grid{
    display:grid;

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

    gap:10px;
}


.lion-contact-radio{
    min-height:54px;

    padding:10px 14px;

    position:relative;

    display:flex;
    align-items:center;

    gap:10px;

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

    border-radius:9px;

    color:var(--contact-text);

    background:var(--contact-soft);

    font-size:14px;

    font-weight:700;

    cursor:pointer;
}


.lion-contact-radio input{
    position:absolute;

    opacity:0;

    pointer-events:none;
}


.lion-contact-radio-circle{
    width:20px;
    height:20px;

    min-width:20px;

    position:relative;

    border:2px solid #a6b3aa;

    border-radius:50%;

    background:#fff;
}


.lion-contact-radio-circle::after{
    content:"";

    width:10px;
    height:10px;

    position:absolute;

    inset:0;

    margin:auto;

    border-radius:50%;

    background:var(--contact-gold);

    transform:scale(0);

    transition:transform .2s ease;
}


.lion-contact-radio input:checked +
.lion-contact-radio-circle{
    border-color:var(--contact-gold-dark);
}


.lion-contact-radio input:checked +
.lion-contact-radio-circle::after{
    transform:scale(1);
}


.lion-contact-radio:has(input:checked){
    border-color:rgba(214,154,27,.45);

    background:#fffaf0;

    color:var(--contact-title);
}


/* =========================================================
   SUBMIT
========================================================= */

.lion-contact-form-footer{
    margin-top:5px;

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

    gap:17px;
}


.lion-contact-submit{
    min-height:58px;

    padding:7px 20px 7px 8px;

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

    gap:12px;

    border:0;

    border-radius:8px;

    color:#fff;

    background:
        linear-gradient(
            120deg,
            var(--contact-green-800),
            var(--contact-green-600)
        );

    font-family:"DM Sans",Arial,sans-serif;

    font-size:14px;

    font-weight:800;

    cursor:pointer;

    box-shadow:
        0 12px 25px rgba(13,52,35,.15);

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}


.lion-contact-submit:hover{
    transform:translateY(-2px);

    box-shadow:
        0 17px 30px rgba(13,52,35,.20);
}


.lion-contact-submit > span{
    width:44px;
    height:44px;

    min-width:44px;
    min-height:44px;

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

    border-radius:6px;

    color:var(--contact-green-950);

    background:var(--contact-gold);
}


.lion-contact-form-footer > p{
    max-width:300px;

    margin:0;

    display:flex;

    gap:7px;

    color:#79867e;

    font-size:14px;

    line-height:1.5;
}


/* =========================================================
   SIDEBAR
========================================================= */

.lion-contact-sidebar{
    position:sticky;

    top:130px;

    overflow:hidden;

    border-radius:17px;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            var(--contact-green-950),
            var(--contact-green-700)
        );

    box-shadow:
        0 20px 50px rgba(4,23,15,.17);
}


.lion-contact-sidebar-top{
    padding:34px 30px 28px;

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


.lion-contact-sidebar-label{
    width:max-content;

    max-width:100%;

    margin-bottom:14px;

    padding:7px 11px;

    border-radius:5px;

    color:var(--contact-green-950);

    background:var(--contact-gold);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-contact-sidebar-top h2{
    margin:0 0 14px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:34px;

    line-height:1.12;

    text-transform:uppercase;
}


.lion-contact-sidebar-top p{
    margin:0;

    color:rgba(255,255,255,.65);

    font-size:14px;

    line-height:1.75;
}


.lion-contact-info-list{
    padding:12px 30px;
}


.lion-contact-info-list > a,
.lion-contact-info-list > div{
    min-height:78px;

    padding:13px 0;

    display:flex;
    align-items:center;

    gap:13px;

    color:#fff;

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


.lion-contact-info-list > a > span,
.lion-contact-info-list > div > span{
    width:43px;
    height:43px;

    min-width:43px;
    min-height:43px;

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

    border-radius:50%;

    color:var(--contact-green-950);

    background:var(--contact-gold);
}


.lion-contact-info-list small{
    display:block;

    margin-bottom:3px;

    color:rgba(255,255,255,.48);

    font-size:14px;
}


.lion-contact-info-list strong{
    display:block;

    overflow-wrap:anywhere;

    color:#fff;

    font-size:14px;

    line-height:1.45;
}


.lion-contact-emergency{
    margin:18px;

    padding:20px;

    display:flex;
    align-items:flex-start;

    gap:13px;

    border:1px solid rgba(242,191,63,.25);

    border-radius:11px;

    background:rgba(242,191,63,.08);
}


.lion-contact-emergency-icon{
    width:49px;
    height:49px;

    min-width:49px;
    min-height:49px;

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

    border-radius:50%;

    color:var(--contact-green-950);

    background:var(--contact-gold);
}


.lion-contact-emergency small{
    display:block;

    color:var(--contact-gold-light);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-contact-emergency strong{
    display:block;

    margin:4px 0 5px;

    color:#fff;

    font-size:16px;
}


.lion-contact-emergency p{
    margin:0 0 12px;

    color:rgba(255,255,255,.60);

    font-size:14px;

    line-height:1.5;
}


.lion-contact-emergency a{
    display:inline-flex;
    align-items:center;

    gap:7px;

    color:var(--contact-gold);

    font-size:14px;

    font-weight:800;
}


/* =========================================================
   MAP SECTION
========================================================= */

.lion-contact-map-section{
    padding:110px 0;

    position:relative;
    overflow:hidden;

    color:#fff;

    background:
        linear-gradient(
            120deg,
            var(--contact-green-950),
            var(--contact-green-700)
        );
}


.lion-contact-map-section::before{
    content:"";

    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 88% 15%,
            rgba(242,191,63,.10),
            transparent 27%
        );

    pointer-events:none;
}


.lion-contact-map-rings{
    width:420px;
    height:420px;

    position:absolute;

    left:-180px;
    bottom:-250px;

    border-radius:50%;

    border:1px solid rgba(242,191,63,.11);

    box-shadow:
        0 0 0 40px rgba(255,255,255,.012),
        0 0 0 80px rgba(242,191,63,.02);
}


.lion-contact-map-heading{
    max-width:820px;

    margin-bottom:45px;
}


.lion-contact-dark-label{
    margin-bottom:14px;

    display:flex;
    align-items:center;

    gap:10px;

    color:var(--contact-gold-light);

    font-size:14px;

    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1.2px;
}


.lion-contact-dark-label span{
    width:36px;
    height:3px;

    display:block;

    background:var(--contact-gold);
}


.lion-contact-map-heading h2{
    margin:0 0 17px;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:clamp(42px,5vw,68px);

    line-height:1.03;

    text-transform:uppercase;
}


.lion-contact-map-heading h2 strong{
    display:block;

    color:var(--contact-gold);
}


.lion-contact-map-heading p{
    max-width:700px;

    margin:0;

    color:rgba(255,255,255,.66);

    font-size:15px;

    line-height:1.8;
}


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

.lion-contact-map-layout{
    width:100%;

    display:grid;

    grid-template-columns:
        minmax(0,1.55fr)
        minmax(330px,.45fr);

    align-items:stretch;

    gap:20px;
}


/* =========================================================
   MAP WRAPPER
========================================================= */

.lion-contact-map-wrap{
    width:100%;

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

    position:relative;

    align-self:stretch;

    overflow:hidden;

    isolation:isolate;

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

    border-radius:16px;

    background:#e9efe9;

    box-shadow:
        0 25px 65px rgba(0,0,0,.22);
}


/* =========================================================
   LEAFLET MAP
========================================================= */

#lionContactMap{
    width:100% !important;
    height:100% !important;

    min-height:650px;

    position:absolute !important;

    inset:0;

    z-index:1;

    background:#e9efe9 !important;
}


#lionContactMap.leaflet-container{
    width:100% !important;
    height:100% !important;

    background:#e9efe9 !important;

    font-family:"DM Sans",Arial,sans-serif;
}


#lionContactMap .leaflet-tile,
#lionContactMap .leaflet-tile-container{
    opacity:1 !important;
}


#lionContactMap .leaflet-marker-pane{
    z-index:600 !important;
}


#lionContactMap .leaflet-tooltip-pane{
    z-index:800 !important;

    pointer-events:none !important;
}


#lionContactMap .leaflet-popup-pane{
    z-index:900 !important;

    opacity:1 !important;
}


/* =========================================================
   ZOOM CONTROLS
========================================================= */

#lionContactMap .leaflet-control-zoom{
    overflow:hidden;

    border:0 !important;

    border-radius:8px !important;

    background:#fff !important;

    box-shadow:
        0 8px 25px rgba(0,0,0,.15);
}


#lionContactMap .leaflet-control-zoom a{
    width:42px !important;
    height:42px !important;

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

    border:0 !important;

    color:var(--contact-green-950) !important;

    background:#fff !important;

    font-size:21px !important;

    text-decoration:none !important;
}


#lionContactMap .leaflet-control-zoom a:hover{
    background:var(--contact-gold) !important;
}


/* =========================================================
   CUSTOM MARKER
========================================================= */

#lionContactMap .lion-contact-div-icon{
    border:0 !important;

    background:transparent !important;
}


.lion-contact-marker{
    width:38px;
    height:38px;

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

    border:3px solid #fff;

    border-radius:50% 50% 50% 0;

    color:var(--contact-green-950);

    background:var(--contact-gold);

    box-shadow:
        0 5px 18px rgba(0,0,0,.25);

    transform:rotate(-45deg);
}


.lion-contact-marker i{
    position:static !important;

    margin:0 !important;
    padding:0 !important;

    color:inherit;

    font-size:13px;

    transform:rotate(45deg);
}


.lion-contact-marker-main{
    width:46px;
    height:46px;

    color:#fff;

    background:var(--contact-green-700);

    box-shadow:
        0 0 0 7px rgba(242,191,63,.20),
        0 8px 22px rgba(0,0,0,.28);
}

/* =========================================================
   CITY INFORMATION CARD
   TOOLTIP LEAFLET
========================================================= */

#lionContactMap .lion-contact-map-city-card{
    width:290px !important;
    max-width:290px !important;

    padding:0 !important;

    border:0 !important;

    border-radius:12px !important;

    color:#ffffff !important;

    background:#071f16 !important;
    background-color:#071f16 !important;

    font-family:"DM Sans", Arial, sans-serif !important;

    white-space:normal !important;

    opacity:1 !important;
    visibility:visible !important;

    box-shadow:
        0 15px 40px rgba(0,0,0,.32) !important;

    pointer-events:none !important;
}


/* =========================================================
   REMOVE DEFAULT LEAFLET LOOK
========================================================= */

#lionContactMap
.leaflet-tooltip.lion-contact-map-city-card{
    white-space:normal !important;

    background:#071f16 !important;

    border:0 !important;

    padding:0 !important;

    overflow:visible !important;
}


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

#lionContactMap .lion-map-location-card{
    width:100%;

    padding:18px 19px;

    display:block;

    position:relative;

    overflow:hidden;

    border:1px solid rgba(242,191,63,.26);

    border-radius:12px;

    color:#ffffff;

    background:
        linear-gradient(
            135deg,
            #071f16,
            #123d2c
        );
}


/* GOLD DECORATIVE LINE */

#lionContactMap .lion-map-location-card::before{
    content:"";

    width:5px;

    position:absolute;

    top:0;
    bottom:0;
    left:0;

    background:#f2bf3f;
}


/* =========================================================
   LOCATION TYPE
========================================================= */

#lionContactMap .lion-map-location-card small{
    display:block;

    margin:0 0 6px;

    padding:0;

    color:#f2bf3f !important;

    font-family:"DM Sans", Arial, sans-serif;

    font-size:11px !important;
    line-height:1.3 !important;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1px;

    white-space:normal !important;
}


/* =========================================================
   CITY NAME
========================================================= */

#lionContactMap .lion-map-location-card strong{
    display:block;

    margin:0 0 8px;

    padding:0;

    color:#ffffff !important;

    font-family:"Oswald", Arial, sans-serif;

    font-size:22px !important;
    line-height:1.15 !important;

    font-weight:700;

    white-space:normal !important;
}


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

#lionContactMap .lion-map-location-card > span{
    display:block;

    margin:0;

    padding:0;

    color:rgba(255,255,255,.68) !important;

    font-family:"DM Sans", Arial, sans-serif;

    font-size:13px !important;
    line-height:1.55 !important;

    font-weight:400;

    white-space:normal !important;

    overflow-wrap:break-word;
    word-break:normal;
}


/* =========================================================
   TOOLTIP ARROW
========================================================= */

#lionContactMap
.leaflet-tooltip-top.lion-contact-map-city-card::before{
    border-top-color:#071f16 !important;
}


#lionContactMap
.leaflet-tooltip-bottom.lion-contact-map-city-card::before{
    border-bottom-color:#071f16 !important;
}


#lionContactMap
.leaflet-tooltip-left.lion-contact-map-city-card::before{
    border-left-color:#071f16 !important;
}


#lionContactMap
.leaflet-tooltip-right.lion-contact-map-city-card::before{
    border-right-color:#071f16 !important;
}


/* =========================================================
   TOOLTIP ABOVE MARKERS
========================================================= */

#lionContactMap .leaflet-tooltip-pane{
    z-index:850 !important;

    pointer-events:none !important;
}


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

@media(max-width:767px){

    #lionContactMap .lion-contact-map-city-card{
        width:250px !important;
        max-width:250px !important;
    }


    #lionContactMap .lion-map-location-card{
        padding:15px 16px;
    }


    #lionContactMap .lion-map-location-card strong{
        font-size:19px !important;
    }


    #lionContactMap .lion-map-location-card > span{
        font-size:12px !important;
        line-height:1.5 !important;
    }

}


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

@media(max-width:420px){

    #lionContactMap .lion-contact-map-city-card{
        width:220px !important;
        max-width:220px !important;
    }


    #lionContactMap .lion-map-location-card{
        padding:14px;
    }


    #lionContactMap .lion-map-location-card strong{
        font-size:18px !important;
    }

}

/* =========================================================
   CITY LABEL / TOOLTIP
========================================================= */

#lionContactMap .lion-contact-map-city-label{
    padding:9px 15px !important;

    border:1px solid rgba(242,191,63,.45) !important;

    border-radius:7px !important;

    color:#fff !important;

    background:#071f16 !important;

    background-color:#071f16 !important;

    font-family:"DM Sans",Arial,sans-serif !important;

    font-size:14px !important;

    line-height:1.25 !important;

    font-weight:800 !important;

    white-space:nowrap;

    opacity:1 !important;

    visibility:visible !important;

    box-shadow:
        0 8px 24px rgba(0,0,0,.30) !important;

    pointer-events:none !important;
}


#lionContactMap
.leaflet-tooltip-top.lion-contact-map-city-label::before{
    border-top-color:#071f16 !important;
}


/* =========================================================
   POPUP
   COMPLETELY SOLID
========================================================= */

#lionContactMap .lion-contact-city-popup{
    opacity:1 !important;
}


#lionContactMap .leaflet-popup-content-wrapper{
    opacity:1 !important;

    overflow:hidden;

    border:1px solid rgba(16,39,28,.13) !important;

    border-radius:11px !important;

    color:var(--contact-title) !important;

    background:#ffffff !important;

    background-color:#ffffff !important;

    box-shadow:
        0 15px 40px rgba(4,23,15,.28) !important;

    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
}


#lionContactMap .leaflet-popup-content{
    width:auto !important;

    min-width:210px;

    margin:0 !important;

    padding:19px 20px !important;

    color:var(--contact-title) !important;

    background:#ffffff !important;

    background-color:#ffffff !important;

    opacity:1 !important;

    visibility:visible !important;
}


#lionContactMap .leaflet-popup-tip-container{
    overflow:hidden;
}


#lionContactMap .leaflet-popup-tip{
    background:#fff !important;

    background-color:#fff !important;

    opacity:1 !important;

    box-shadow:none !important;
}


#lionContactMap .leaflet-popup-close-button{
    width:31px !important;
    height:31px !important;

    top:4px !important;
    right:4px !important;

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

    padding:0 !important;

    color:var(--contact-green-700) !important;

    background:transparent !important;

    font-family:Arial,sans-serif !important;

    font-size:21px !important;

    line-height:1 !important;

    text-decoration:none !important;
}


#lionContactMap .leaflet-popup-close-button:hover{
    color:var(--contact-gold-dark) !important;
}


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

#lionContactMap .lion-map-popup{
    width:100%;

    min-width:210px;

    padding:0;

    color:var(--contact-title);

    background:#fff !important;
}


#lionContactMap .lion-map-popup small{
    display:block;

    margin:0 0 5px;

    color:var(--contact-gold-dark);

    font-size:12px;

    line-height:1.3;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.7px;
}


#lionContactMap .lion-map-popup strong{
    display:block;

    margin:0;

    padding-right:18px;

    color:var(--contact-title);

    font-family:"Oswald",Arial,sans-serif;

    font-size:22px;

    line-height:1.2;

    font-weight:700;
}


#lionContactMap .lion-map-popup p{
    margin:8px 0 0;

    color:var(--contact-text);

    font-size:13px;

    line-height:1.55;
}


/* =========================================================
   ATTRIBUTION
========================================================= */

#lionContactMap .leaflet-control-attribution{
    padding:4px 7px !important;

    color:#536158 !important;

    background:rgba(255,255,255,.97) !important;

    font-size:11px !important;
}


#lionContactMap .leaflet-control-attribution a{
    color:var(--contact-green-700) !important;
}


/* =========================================================
   MAP BADGES
========================================================= */

.lion-contact-map-badge{
    position:absolute;

    left:18px;
    bottom:18px;

    z-index:500;

    min-width:180px;

    padding:12px;

    display:flex;
    align-items:center;

    gap:10px;

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

    border-radius:9px;

    color:#fff;

    background:rgba(4,23,15,.96);

    box-shadow:
        0 10px 30px rgba(0,0,0,.18);

    pointer-events:none;
}


.lion-contact-map-badge > span{
    width:39px;
    height:39px;

    min-width:39px;
    min-height:39px;

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

    border-radius:50%;

    color:var(--contact-green-950);

    background:var(--contact-gold);
}


.lion-contact-map-badge small{
    display:block;

    color:rgba(255,255,255,.55);

    font-size:12px;
}


.lion-contact-map-badge strong{
    display:block;

    color:#fff;

    font-size:14px;
}


.lion-contact-radius-badge{
    position:absolute;

    right:18px;
    top:18px;

    z-index:500;

    padding:10px 13px;

    border-radius:7px;

    color:var(--contact-green-950);

    background:var(--contact-gold);

    box-shadow:
        0 10px 25px rgba(0,0,0,.18);

    pointer-events:none;
}


.lion-contact-radius-badge strong,
.lion-contact-radius-badge span{
    display:block;
}


.lion-contact-radius-badge strong{
    font-family:"Oswald",Arial,sans-serif;

    font-size:18px;
}


.lion-contact-radius-badge span{
    font-size:11px;

    font-weight:800;

    text-transform:uppercase;
}


/* =========================================================
   CITY PANEL
========================================================= */

.lion-contact-cities{
    min-width:0;

    padding:24px;

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

    border-radius:16px;

    background:rgba(255,255,255,.045);
}


.lion-contact-cities-heading{
    margin-bottom:10px;

    display:flex;
    align-items:center;

    gap:12px;
}


.lion-contact-cities-heading > span{
    width:48px;
    height:48px;

    min-width:48px;
    min-height:48px;

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

    border-radius:50%;

    color:var(--contact-green-950);

    background:var(--contact-gold);
}


.lion-contact-cities-heading small{
    display:block;

    color:var(--contact-gold-light);

    font-size:12px;

    font-weight:800;

    text-transform:uppercase;
}


.lion-contact-cities-heading h3{
    margin:2px 0 0;

    color:#fff;

    font-family:"Oswald",Arial,sans-serif;

    font-size:25px;
}


.lion-contact-cities > p{
    margin:0 0 18px;

    color:rgba(255,255,255,.58);

    font-size:14px;

    line-height:1.6;
}


.lion-contact-city-list{
    display:flex;

    flex-direction:column;

    gap:7px;
}


.lion-contact-city{
    width:100%;

    min-height:61px;

    padding:8px 10px;

    display:grid;

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

    align-items:center;

    gap:10px;

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

    border-radius:8px;

    color:#fff;

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

    font-family:"DM Sans",Arial,sans-serif;

    text-align:left;

    cursor:pointer;

    transition:
        transform .25s ease,
        border-color .25s ease,
        background .25s ease;
}


.lion-contact-city:hover{
    transform:translateX(3px);

    border-color:rgba(242,191,63,.28);

    background:rgba(255,255,255,.07);
}


.lion-contact-city > span{
    width:35px;
    height:35px;

    min-width:35px;
    min-height:35px;

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

    border-radius:50%;

    color:var(--contact-gold);

    background:rgba(242,191,63,.10);
}


.lion-contact-city strong{
    display:block;

    color:#fff;

    font-size:14px;
}


.lion-contact-city small{
    display:block;

    margin-top:2px;

    color:rgba(255,255,255,.45);

    font-size:12px;
}


.lion-contact-city > i:last-child{
    color:rgba(255,255,255,.30);

    font-size:11px;
}


.lion-contact-city-active{
    border-color:var(--contact-gold) !important;

    background:rgba(242,191,63,.10) !important;
}


.lion-contact-city-active > span{
    color:var(--contact-green-950);

    background:var(--contact-gold);
}


.lion-contact-city-active > i:last-child{
    color:var(--contact-gold);
}


.lion-contact-cities-note{
    margin-top:17px;

    padding:12px;

    display:flex;
    align-items:flex-start;

    gap:9px;

    border-radius:8px;

    color:rgba(255,255,255,.58);

    background:rgba(0,0,0,.12);
}


.lion-contact-cities-note > i{
    margin-top:3px !important;

    color:var(--contact-gold);
}


.lion-contact-cities-note p{
    margin:0;

    font-size:12px;

    line-height:1.6;
}


/* =========================================================
   SERVICES
========================================================= */

.lion-contact-services{
    padding:105px 0;

    background:#fff;
}


.lion-contact-services-heading{
    max-width:820px;

    margin:0 auto 45px;

    text-align:center;
}


.lion-contact-services-grid{
    display:grid;

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

    gap:12px;
}


.lion-contact-service{
    min-height:120px;

    padding:17px;

    display:flex;
    align-items:center;

    gap:13px;

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

    border-radius:11px;

    color:var(--contact-title);

    background:var(--contact-soft);

    font-size:14px;

    font-weight:800;

    transition:
        transform .3s ease,
        background .3s ease,
        box-shadow .3s ease;
}


.lion-contact-service:hover{
    transform:translateY(-5px);

    background:#fff;

    box-shadow:
        0 18px 38px rgba(16,53,36,.09);
}


.lion-contact-service > span{
    width:48px;
    height:48px;

    min-width:48px;
    min-height:48px;

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

    border-radius:50%;

    color:var(--contact-green-950);

    background:var(--contact-gold);
}


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

.lion-contact-reveal{
    opacity:0;

    transform:translateY(30px);

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


.lion-contact-reveal.lion-contact-visible{
    opacity:1;

    transform:none;
}


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

@media(max-width:1100px){

    .lion-contact-quick-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .lion-contact-main-grid{
        grid-template-columns:
            minmax(0,1fr)
            330px;
    }


    .lion-contact-map-layout{
        grid-template-columns:
            minmax(0,1.2fr)
            330px;
    }


    .lion-contact-services-grid{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

}


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

@media(max-width:900px){

    .lion-contact-main-grid{
        grid-template-columns:1fr;
    }


    .lion-contact-sidebar{
        position:static;
    }


    .lion-contact-map-layout{
        grid-template-columns:1fr;
    }


    .lion-contact-map-wrap{
        height:620px;

        min-height:620px;
    }


    #lionContactMap{
        height:100% !important;

        min-height:0;
    }


    .lion-contact-city-list{
        display:grid;

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


    .lion-contact-services-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}


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

@media(max-width:767px){

    .lion-contact-container{
        width:calc(100% - 28px);
    }


    .lion-contact-hero{
        min-height:390px;

        padding:78px 0 68px;
    }


    .lion-contact-hero h1{
        font-size:clamp(48px,15vw,70px);
    }


    .lion-contact-hero-content > p{
        font-size:14px;
    }


    .lion-contact-hero-message{
        display:none;
    }


    .lion-contact-intro,
    .lion-contact-main,
    .lion-contact-map-section,
    .lion-contact-services{
        padding:75px 0;
    }


    .lion-contact-quick-grid{
        grid-template-columns:1fr;
    }


    .lion-contact-form-column{
        padding:25px 18px;
    }


    .lion-contact-form-row-2{
        grid-template-columns:1fr;
    }


    .lion-contact-radio-grid{
        grid-template-columns:1fr;
    }


    .lion-contact-input-wrap input,
    .lion-contact-select-wrap select,
    .lion-contact-textarea-wrap textarea{
        font-size:16px;
    }


    .lion-contact-submit{
        width:100%;
    }


    .lion-contact-form-footer{
        flex-direction:column;

        align-items:stretch;
    }


    .lion-contact-sidebar{
        position:static;
    }


    .lion-contact-map-layout{
        grid-template-columns:1fr;
    }


    .lion-contact-map-wrap{
        height:520px;

        min-height:520px;
    }


    #lionContactMap{
        height:100% !important;

        min-height:0;
    }


    .lion-contact-city-list{
        grid-template-columns:1fr;
    }


    .lion-contact-services-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    #lionContactMap .lion-contact-map-city-label{
        padding:8px 12px !important;

        font-size:14px !important;
    }

}


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

@media(max-width:520px){

    .lion-contact-container{
        width:calc(100% - 20px);
    }


    .lion-contact-form-column{
        padding:22px 14px;
    }


    .lion-contact-sidebar-top,
    .lion-contact-info-list{
        padding-left:20px;

        padding-right:20px;
    }


    .lion-contact-map-wrap{
        height:470px;

        min-height:470px;
    }


    .lion-contact-map-badge{
        left:10px;

        bottom:10px;

        min-width:0;

        max-width:175px;
    }


    .lion-contact-radius-badge{
        top:10px;

        right:10px;
    }


    .lion-contact-cities{
        padding:18px 14px;
    }


    .lion-contact-services-grid{
        grid-template-columns:1fr;
    }

}


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

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

    .lion-contact-reveal{
        opacity:1;

        transform:none;

        transition:none !important;
    }

}

/* =========================================================
   LION FOOTER
   RESPONSIVE FIX DEFINITIVO

   IMPORTANTE:
   .lion-footer-area NO ES GRID.
   El grid real de columnas es .lion-footer-grid
========================================================= */


/* =========================================================
   01. MAIN FOOTER WRAPPER
   NEVER USE GRID HERE
========================================================= */

.lion-footer-area{

    width:100% !important;
    max-width:100% !important;

    display:block !important;

    position:relative;

    overflow:hidden;

}


/* =========================================================
   02. CTA SECTION
========================================================= */

.lion-footer-cta{

    width:100% !important;

    display:block !important;

}


.lion-footer-cta-container{

    width:min(
        calc(100% - 40px),
        1400px
    ) !important;

    max-width:1400px !important;

    margin:0 auto !important;

}


/* =========================================================
   CTA CARD
   DESKTOP
========================================================= */

.lion-footer-cta-card{

    width:100% !important;

    display:grid !important;

    grid-template-columns:
        minmax(0, 1.25fr)
        minmax(320px, .75fr) !important;

    align-items:center !important;

    gap:50px !important;

}


/* =========================================================
   CTA COPY
========================================================= */

.lion-footer-cta-copy{

    width:100% !important;

    min-width:0 !important;

    max-width:700px !important;

}


.lion-footer-cta-title{

    width:100% !important;

    max-width:680px !important;

    margin-left:0 !important;
    margin-right:0 !important;

    word-break:normal !important;

    overflow-wrap:normal !important;

    white-space:normal !important;

}


.lion-footer-cta-copy p{

    width:100% !important;

    max-width:620px !important;

    word-break:normal !important;

    overflow-wrap:normal !important;

}


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

.lion-footer-cta-actions{

    width:100% !important;

    min-width:0 !important;

    display:flex !important;

    flex-direction:column !important;

    align-items:stretch !important;

    justify-content:center !important;

    gap:12px !important;

}


.lion-footer-cta-btn{

    width:100% !important;

    max-width:none !important;

    min-width:0 !important;

    min-height:58px;

    display:flex !important;

    align-items:center !important;

    justify-content:center !important;

    gap:10px;

    text-align:center;

    white-space:normal !important;

}


/* =========================================================
   03. ACTUAL FOOTER GRID
   DESKTOP = 4 COLUMNS
========================================================= */

.lion-footer-grid{

    width:100% !important;

    display:grid !important;

    grid-template-columns:
        minmax(0, 1.35fr)
        minmax(0, .8fr)
        minmax(0, 1fr)
        minmax(0, .85fr) !important;

    align-items:start !important;

    gap:
        45px
        35px !important;

}


.lion-footer-grid > *{

    width:100% !important;

    min-width:0 !important;

    max-width:100% !important;

}


/* =========================================================
   TEXT / LINKS OVERFLOW PROTECTION
========================================================= */

.lion-footer-grid a,
.lion-footer-grid p,
.lion-footer-grid span,
.lion-footer-grid strong{

    max-width:100%;

    overflow-wrap:anywhere;

}


.lion-footer-contact-copy{

    min-width:0 !important;

}


.lion-footer-contact-copy a{

    word-break:break-word;

}


/* =========================================================
   04. TABLET
   FOOTER = 2 COLUMNS
   CTA = STACKED
========================================================= */

@media screen and (min-width:768px) and (max-width:1100px){


    /* -----------------------------------------
       CTA
    ----------------------------------------- */

    .lion-footer-cta-container{

        width:
            calc(100% - 48px) !important;

    }


    .lion-footer-cta-card{

        grid-template-columns:
            minmax(0, 1fr) !important;

        gap:28px !important;

    }


    .lion-footer-cta-copy{

        max-width:800px !important;

    }


    .lion-footer-cta-title{

        max-width:760px !important;

    }


    .lion-footer-cta-copy p{

        max-width:720px !important;

    }


    .lion-footer-cta-actions{

        display:grid !important;

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

        gap:12px !important;

        max-width:650px !important;

    }



    /* -----------------------------------------
       FOOTER GRID
       EXACTLY 2 COLUMNS
    ----------------------------------------- */

    .lion-footer-grid{

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

        gap:
            42px
            35px !important;

    }

}


/* =========================================================
   05. MOBILE
   EVERYTHING = 1 COLUMN
========================================================= */

@media screen and (max-width:767px){


    /* -----------------------------------------
       GENERAL
    ----------------------------------------- */

    .lion-footer-area{

        width:100% !important;

        display:block !important;

    }



    /* -----------------------------------------
       CTA CONTAINER
    ----------------------------------------- */

    .lion-footer-cta-container{

        width:
            calc(100% - 28px) !important;

        max-width:none !important;

        margin:
            0 auto !important;

    }



    /* -----------------------------------------
       CTA CARD
       ONE COLUMN
    ----------------------------------------- */

    .lion-footer-cta-card{

        width:100% !important;

        display:grid !important;

        grid-template-columns:
            minmax(0, 1fr) !important;

        gap:25px !important;

        padding:
            38px
            22px !important;

    }



    /* -----------------------------------------
       CTA COPY
    ----------------------------------------- */

    .lion-footer-cta-copy{

        width:100% !important;

        max-width:none !important;

        min-width:0 !important;

    }


    .lion-footer-cta-eyebrow{

        width:auto !important;

        max-width:100% !important;

    }


    .lion-footer-cta-title{

        width:100% !important;

        max-width:100% !important;

        margin:
            0
            0
            18px !important;

        font-size:
            clamp(
                32px,
                10vw,
                48px
            ) !important;

        line-height:1.05 !important;

        word-break:normal !important;

        overflow-wrap:normal !important;

        white-space:normal !important;

    }


    .lion-footer-cta-title span{

        display:block;

    }


    .lion-footer-cta-copy p{

        width:100% !important;

        max-width:100% !important;

        margin-bottom:0 !important;

        font-size:15px !important;

        line-height:1.75 !important;

        word-break:normal !important;

        overflow-wrap:normal !important;

    }



    /* -----------------------------------------
       CTA BUTTONS
       ONE COLUMN
    ----------------------------------------- */

    .lion-footer-cta-actions{

        width:100% !important;

        max-width:100% !important;

        display:grid !important;

        grid-template-columns:
            minmax(0, 1fr) !important;

        gap:11px !important;

    }


    .lion-footer-cta-btn{

        width:100% !important;

        max-width:100% !important;

        min-width:0 !important;

        min-height:56px !important;

        margin:0 !important;

        padding:
            14px
            16px !important;

        justify-content:center !important;

        font-size:14px !important;

    }



    /* -----------------------------------------
       FOOTER GRID
       EXACTLY ONE COLUMN
    ----------------------------------------- */

    .lion-footer-grid{

        width:100% !important;

        display:grid !important;

        grid-template-columns:
            minmax(0, 1fr) !important;

        gap:36px !important;

    }


    .lion-footer-grid > *{

        width:100% !important;

        min-width:0 !important;

        max-width:100% !important;

        grid-column:
            1 / -1 !important;

    }



    /* -----------------------------------------
       FOOTER BRAND
    ----------------------------------------- */

    .lion-footer-brand{

        width:100% !important;

    }


    .lion-footer-logo-wrap{

        width:100% !important;

        max-width:100% !important;

    }


    .lion-footer-description{

        width:100% !important;

        max-width:100% !important;

    }



    /* -----------------------------------------
       BADGES
    ----------------------------------------- */

    .lion-footer-badges{

        width:100% !important;

        display:flex !important;

        flex-wrap:wrap !important;

        gap:8px !important;

    }



    /* -----------------------------------------
       CONTACT
    ----------------------------------------- */

    .lion-footer-contact-item{

        width:100% !important;

        grid-template-columns:
            auto
            minmax(0, 1fr) !important;

    }


    .lion-footer-contact-copy{

        width:100% !important;

        min-width:0 !important;

    }



    /* -----------------------------------------
       HOURS
    ----------------------------------------- */

    .lion-footer-hours{

        width:100% !important;

    }


    .lion-footer-hours-row{

        width:100% !important;

    }



    /* -----------------------------------------
       FOOTER BOTTOM
    ----------------------------------------- */

    .lion-footer-bottom{

        width:100% !important;

        display:flex !important;

        flex-direction:column !important;

        align-items:flex-start !important;

        gap:18px !important;

    }


    .lion-footer-bottom-links{

        width:100% !important;

        display:flex !important;

        flex-wrap:wrap !important;

        justify-content:flex-start !important;

        gap:
            10px
            16px !important;

    }

}


/* =========================================================
   06. SMALL MOBILE
========================================================= */

@media screen and (max-width:480px){


    .lion-footer-cta-container{

        width:
            calc(100% - 20px) !important;

    }


    .lion-footer-cta-card{

        grid-template-columns:
            1fr !important;

        padding:
            34px
            18px !important;

        gap:22px !important;

    }


    .lion-footer-cta-title{

        font-size:
            clamp(
                30px,
                11vw,
                41px
            ) !important;

    }


    .lion-footer-grid{

        grid-template-columns:
            1fr !important;

        gap:32px !important;

    }


    .lion-footer-cta-actions{

        grid-template-columns:
            1fr !important;

    }

}