/*==================================================
            PREMIUM CATEGORY SECTION
==================================================*/

.website-category-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:42px;
    margin-top:60px;
}

.website-category-card{
    text-decoration:none;
    display:flex;
    justify-content:center;
    transition:.45s ease;
}

.website-category-card:hover{
    transform:translateY(-10px);
}

.website-category-image{
    position:relative;
    width:320px;
    height:320px;
    border-radius:50%;
    overflow:hidden;
    border:8px solid #fff;
    background:#F7F7F2;
    box-shadow:
        0 20px 45px rgba(0,0,0,.08),
        0 8px 18px rgba(22,163,74,.10);
    transition:.45s;
}

.website-category-card:hover .website-category-image{
    box-shadow:
        0 30px 60px rgba(0,0,0,.15),
        0 15px 35px rgba(22,163,74,.22);
}

.website-category-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:.65s ease;
}

.website-category-card:hover img{
    transform:scale(1.12);
}

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

.website-category-overlay{
    position:absolute;
    inset:0;
    border-radius:50%;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    background:
        linear-gradient(
            180deg,
            rgba(12,55,28,.05),
            rgba(12,55,28,.90)
        );
    opacity:0;
    transition:.45s;
}

.website-category-card:hover .website-category-overlay{
    opacity:1;
}

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

.overlay-content{
    color:#fff;
    padding:30px;
    transform:translateY(25px);
    transition:.45s;
}

.website-category-card:hover .overlay-content{
    transform:translateY(0);
}

.category-count{
    display:inline-block;
    padding:8px 16px;
    border-radius:40px;
    background:rgba(255,255,255,.18);
    backdrop-filter:blur(10px);
    font-size:13px;
    letter-spacing:.4px;
    margin-bottom:18px;
}

.overlay-content h3{
    font-size:30px;
    font-weight:700;
    margin-bottom:18px;
    line-height:1.3;
}

.explore-btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:12px 22px;
    border-radius:40px;
    background:#fff;
    color:#166534;
    font-weight:600;
    transition:.35s;
}

.explore-btn i{
    font-size:22px;
    transition:.35s;
}

.website-category-card:hover .explore-btn i{
    transform:translateX(6px);
}

.website-category-card:hover .explore-btn{
    background:#F0FDF4;
}

@media(max-width:1200px){

.website-category-grid{
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}

.website-category-image{
    width:280px;
    height:280px;
}

}

@media(max-width:992px){

.website-category-grid{
    grid-template-columns:repeat(2,1fr);
}

.website-category-image{
    width:260px;
    height:260px;
}

}

@media(max-width:576px){

.website-category-grid{
    grid-template-columns:1fr;
    gap:30px;
}

.website-category-image{
    width:240px;
    height:240px;
    margin:auto;
}

.website-category-overlay{
    opacity:1;
    background:linear-gradient(
        to top,
        rgba(12,55,28,.88),
        rgba(12,55,28,.20)
    );
}

.overlay-content{
    transform:none;
}

.overlay-content h3{
    font-size:22px;
}

.category-count{
    font-size:12px;
}

.explore-btn{
    padding:10px 18px;
    font-size:14px;
}

}

.website-category-image::before{
    content:"";
    position:absolute;
    width:120%;
    height:120%;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    background:radial-gradient(
        rgba(34,197,94,.18),
        transparent 70%
    );
    z-index:-1;
}

@keyframes floating{

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

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

}

.website-category-image{

animation:floating 5s ease-in-out infinite;

}

/*==================================================
            PREMIUM FEATURED PRODUCTS
==================================================*/

.featured-products{
    padding:100px 0;
    background:#FCF9F4;
}

.featured-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:32px;
    margin-top:60px;
}

.featured-card{
    position:relative;
    background:#fff;
    border-radius:28px;
    overflow:hidden;
    border:1px solid #EEF2E8;
    transition:.45s ease;
    box-shadow:0 12px 35px rgba(15,23,42,.05);
}

.featured-card:hover{
    transform:translateY(-12px);
    box-shadow:
        0 25px 60px rgba(15,23,42,.12),
        0 10px 25px rgba(34,197,94,.12);
}

.featured-image{
    display:block;
    position:relative;
    background:#F8F8F4;
    height:300px;
    overflow:hidden;
}

.featured-image img{
    width:100%;
    height:100%;
    object-fit:contain;
    transition:.6s;
    padding:25px;
}

.featured-card:hover .featured-image img{
    transform:scale(1.08);
}

.discount-badge{

position:absolute;
top:18px;
left:18px;
z-index:20;

padding:8px 15px;

background:linear-gradient(135deg,#22C55E,#166534);

color:#fff;

font-size:13px;

font-weight:700;

border-radius:50px;

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

}

.wishlist-btn{

position:absolute;

top:18px;

right:18px;

width:46px;

height:46px;

border:none;

border-radius:50%;

background:#fff;

box-shadow:0 10px 20px rgba(0,0,0,.08);

cursor:pointer;

display:flex;

align-items:center;

justify-content:center;

font-size:22px;

transition:.35s;

z-index:20;

}

.wishlist-btn:hover{

background:#16A34A;

color:#fff;

transform:scale(1.08);

}

.featured-content{

padding:26px;

}

.product-chip{

display:inline-flex;

align-items:center;

padding:7px 14px;

background:#F0FDF4;

color:#166534;

border-radius:30px;

font-size:12px;

font-weight:700;

letter-spacing:.4px;

margin-bottom:14px;

text-transform:uppercase;

}

.featured-content h3{

margin-bottom:14px;

font-size:21px;

line-height:1.45;

}

.featured-content h3 a{

color:#1E293B;

text-decoration:none;

transition:.3s;

}

.featured-content h3 a:hover{

color:#16A34A;

}

.featured-rating{

display:flex;

align-items:center;

justify-content:space-between;

margin-bottom:18px;

}

.stars{

color:#F59E0B;

font-size:16px;

letter-spacing:2px;

}

.featured-rating span{

font-size:14px;

font-weight:600;

color:#64748B;

}

.featured-price{

display:flex;

align-items:center;

gap:12px;

margin-bottom:24px;

}

.old-price{

font-size:16px;

color:#94A3B8;

text-decoration:line-through;

}

.new-price{

font-size:28px;

font-weight:700;

color:#166534;

}

.view-product-btn{

width:100%;

height:54px;

display:flex;

align-items:center;

justify-content:center;

gap:10px;

border-radius:16px;

background:#166534;

color:#fff;

font-weight:600;

text-decoration:none;

transition:.35s;

}

.view-product-btn i{

font-size:22px;

transition:.35s;

}

.view-product-btn:hover{

background:#15803D;

box-shadow:0 15px 30px rgba(22,163,74,.28);

}

.view-product-btn:hover i{

transform:translateX(6px);

}

.featured-card::after{

content:"";

position:absolute;

left:0;

bottom:0;

width:100%;

height:4px;

background:linear-gradient(
90deg,
#16A34A,
#22C55E
);

transform:scaleX(0);

transform-origin:left;

transition:.45s;

}

.featured-card:hover::after{

transform:scaleX(1);

}

@media(max-width:1200px){

.featured-grid{

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

}

}

@media(max-width:992px){

.featured-grid{

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

}

}

@media(max-width:576px){

.featured-grid{

grid-template-columns:1fr;

gap:24px;

}

.featured-image{

height:260px;

}

.featured-content{

padding:20px;

}

.featured-content h3{

font-size:20px;

}

.new-price{

font-size:24px;

}

}

/* =========================================================
   PREMIUM CATALOGUE SHOWCASE
========================================================= */

.catalogue-showcase {
    position: relative;
    overflow: hidden;

    padding: 100px 0;

    background:
        linear-gradient(
            135deg,
            #f4fbf4 0%,
            #ffffff 45%,
            #eef8ef 100%
        );
}


.catalogue-glow {
    position: absolute;

    width: 320px;
    height: 320px;

    border-radius: 50%;

    filter: blur(80px);

    pointer-events: none;

    opacity: .30;
}


.catalogue-glow-one {
    top: -120px;
    left: -100px;

    background: #86efac;
}


.catalogue-glow-two {
    right: -120px;
    bottom: -140px;

    background: #bbf7d0;
}


.catalogue-card {
    position: relative;

    display: grid;

    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(320px, .85fr);

    align-items: center;

    gap: 55px;

    padding: 55px;

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

    border:
        1px solid rgba(22,163,74,.12);

    border-radius: 34px;

    box-shadow:
        0 30px 80px rgba(15,23,42,.08),
        0 12px 30px rgba(22,163,74,.08);

    backdrop-filter:
        blur(16px);

    -webkit-backdrop-filter:
        blur(16px);

}


.catalogue-content {
    position: relative;
    z-index: 2;
}


.catalogue-eyebrow {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    padding: 8px 14px;

    border-radius: 999px;

    background: #ecfdf5;

    color: #166534;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: .08em;
}


.catalogue-eyebrow i {
    font-size: 18px;
}


.catalogue-content h2 {
    margin:
        18px 0 16px;

    max-width: 580px;

    color: #17251a;

    font-size:
        clamp(32px, 4vw, 52px);

    font-weight: 800;

    line-height: 1.08;
}


.catalogue-content h2 span {
    display: block;

    color: #15803d;
}


.catalogue-content > p {
    max-width: 580px;

    margin: 0 0 25px;

    color: #64748b;

    font-size: 16px;

    line-height: 1.8;
}


.catalogue-highlights {
    display: flex;

    flex-wrap: wrap;

    gap: 11px;

    margin-bottom: 30px;
}


.catalogue-highlights div {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    padding:
        10px 13px;

    border:
        1px solid #dcfce7;

    border-radius: 999px;

    background:
        #f7fdf8;

    color:
        #475569;

    font-size: 12px;

    font-weight: 700;
}


.catalogue-highlights i {
    color: #16a34a;

    font-size: 17px;
}


.catalogue-actions {
    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 12px;
}


.catalogue-primary-btn,
.catalogue-secondary-btn {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    min-height: 50px;

    padding:
        0 20px;

    border-radius: 14px;

    text-decoration: none;

    font-size: 14px;

    font-weight: 800;

    transition:
        .3s ease;
}


.catalogue-primary-btn {
    color: #fff;

    background:
        linear-gradient(
            135deg,
            #16a34a,
            #166534
        );

    box-shadow:
        0 12px 28px rgba(22,163,74,.22);
}


.catalogue-primary-btn:hover {
    color: #fff;

    transform:
        translateY(-3px);

    box-shadow:
        0 18px 34px rgba(22,163,74,.28);
}


.catalogue-primary-btn i:last-child {
    font-size: 20px;

    transition:
        .3s ease;
}


.catalogue-primary-btn:hover i:last-child {
    transform:
        translateX(5px);
}


.catalogue-secondary-btn {
    color: #166534;

    background: #fff;

    border:
        1px solid #d1fae5;
}


.catalogue-secondary-btn:hover {
    color: #166534;

    background: #f0fdf4;

    transform:
        translateY(-2px);
}


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

.catalogue-visual {
    position: relative;

    min-height: 370px;

    display: flex;

    align-items: center;

    justify-content: center;
}


.catalogue-book {
    position: relative;

    width: 230px;
    min-height: 310px;

    padding: 26px 22px;

    border-radius:
        14px 22px 22px 14px;

    background:
        linear-gradient(
            145deg,
            #0f4d25,
            #166534 55%,
            #0c3d1c
        );

    color: #fff;

    box-shadow:
        -16px 18px 0 #0b3518,
        0 30px 55px rgba(15, 73, 31, .30);

    transform:
        rotate(4deg);

    transition:
        .45s ease;
}


.catalogue-card:hover
.catalogue-book {
    transform:
        rotate(1deg)
        translateY(-7px);
}


.catalogue-book::before {
    content: "";

    position: absolute;

    inset: 10px;

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

    border-radius: 9px;

    pointer-events: none;
}


.catalogue-book-top {
    text-align: center;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: .22em;

    opacity: .85;
}


.catalogue-book-main {
    position: absolute;

    top: 50%;
    left: 18px;
    right: 18px;

    transform:
        translateY(-50%);

    text-align: center;
}


.catalogue-book-main span {
    display: block;

    margin-bottom: 8px;

    font-size: 13px;

    letter-spacing: .2em;

    color:
        #bbf7d0;
}


.catalogue-book-main strong {
    display: block;

    font-size: 28px;

    line-height: 1.05;

    letter-spacing: .08em;
}


.catalogue-book-main small {
    display: block;

    margin-top: 13px;

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

    font-size: 10px;

    line-height: 1.5;
}


.catalogue-book-bottom {
    position: absolute;

    left: 20px;
    right: 20px;
    bottom: 21px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 7px;

    color: #dcfce7;

    font-size: 10px;

    font-weight: 700;

    text-align: center;
}


.catalogue-book-bottom i {
    font-size: 17px;
}


/* FLOATING ICONS */

.catalogue-floating-icon {
    position: absolute;

    display: flex;

    align-items: center;

    justify-content: center;

    width: 52px;
    height: 52px;

    border-radius: 50%;

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

    color:
        #15803d;

    font-size: 23px;

    box-shadow:
        0 15px 30px rgba(15,23,42,.10);

    animation:
        catalogueFloat 4s ease-in-out infinite;

}


.catalogue-floating-icon.icon-one {
    top: 48px;
    left: 16px;
}


.catalogue-floating-icon.icon-two {
    top: 105px;
    right: 15px;

    animation-delay:
        .8s;
}


.catalogue-floating-icon.icon-three {
    bottom: 48px;
    left: 28px;

    animation-delay:
        1.5s;
}


@keyframes catalogueFloat {

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

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

}


/* =========================================================
   FOOTER CATALOGUE + QR
========================================================= */

.footer-connect-card {
    display: grid;

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

    gap: 18px;

    margin-top: 30px;

    padding:
        22px;

    border-radius: 22px;

    background:
        linear-gradient(
            135deg,
            rgba(22,101,52,.10),
            rgba(255,255,255,.95)
        );

    border:
        1px solid rgba(22,163,74,.15);
}


.footer-catalogue,
.footer-qr-box {
    display: flex;

    align-items: center;

    gap: 17px;

    padding:
        20px;

    border-radius: 18px;

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

    border:
        1px solid #e7f4e9;
}


.footer-connect-icon {
    flex:
        0 0 auto;

    width: 54px;
    height: 54px;

    display: flex;

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

    border-radius: 16px;

    background:
        #ecfdf5;

    color:
        #15803d;

    font-size: 26px;
}


.footer-catalogue span,
.footer-qr-box span {
    display: block;

    color:
        #16a34a;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: .12em;
}


.footer-catalogue h4,
.footer-qr-box h4 {
    margin:
        5px 0;

    color:
        #1e293b;

    font-size: 17px;

    font-weight: 800;
}


.footer-catalogue p,
.footer-qr-box p {
    margin:
        0 0 12px;

    color:
        #64748b;

    font-size: 12px;

    line-height: 1.5;
}


.footer-catalogue-btn {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    color:
        #166534;

    font-size: 12px;

    font-weight: 800;

    text-decoration: none;
}


.footer-catalogue-btn:hover {
    color:
        #16a34a;
}


/* =========================================================
   PREMIUM FOOTER QR
========================================================= */

.footer-qr-premium {
    position: relative;

    padding: 24px 20px;

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            #f8fcf7 0%,
            #ffffff 55%,
            #eef8ef 100%
        );

    border: 1px solid #dcebdd;

    box-shadow:
        0 16px 35px rgba(15, 23, 42, .07);

    overflow: hidden;
}


/* subtle glow */

.footer-qr-premium::before {
    content: "";

    position: absolute;

    width: 150px;
    height: 150px;

    right: -70px;
    top: -70px;

    border-radius: 50%;

    background:
        rgba(34, 197, 94, .10);

    filter: blur(5px);

    pointer-events: none;
}


/* heading */

.footer-qr-heading {
    position: relative;
    z-index: 2;
}


.footer-qr-eyebrow {
    display: inline-flex;

    align-items: center;

    gap: 6px;

    margin-bottom: 7px;

    color: #15803d;

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

    letter-spacing: .13em;
}


.footer-qr-eyebrow i {
    font-size: 15px;
}


.footer-qr-heading h4 {
    margin: 0 0 6px;

    color: #183b20;

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


.footer-qr-heading p {
    max-width: 230px;

    margin: 0;

    color: #64748b;

    font-size: 11px;

    line-height: 1.55;
}


/* QR area */

.footer-qr-main {
    display: flex;

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

    margin:
        18px 0;
}


/* QR frame */

.footer-qr-frame {
    position: relative;

    width: 138px;
    height: 138px;

    display: flex;

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

    padding: 10px;

    background: #ffffff;

    border-radius: 18px;

    border: 1px solid #dce7dd;

    box-shadow:
        0 12px 28px rgba(15, 23, 42, .08);
}


.footer-qr-frame img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: contain;

    border-radius: 8px;
}


/* =========================================================
   QR CORNERS
========================================================= */

.qr-corner {
    position: absolute;

    width: 15px;
    height: 15px;

    border-color: #15803d;

    pointer-events: none;
}


.qr-corner-tl {
    top: 6px;
    left: 6px;

    border-top: 2px solid;
    border-left: 2px solid;

    border-radius: 4px 0 0 0;
}


.qr-corner-tr {
    top: 6px;
    right: 6px;

    border-top: 2px solid;
    border-right: 2px solid;

    border-radius: 0 4px 0 0;
}


.qr-corner-bl {
    bottom: 6px;
    left: 6px;

    border-bottom: 2px solid;
    border-left: 2px solid;

    border-radius: 0 0 0 4px;
}


.qr-corner-br {
    bottom: 6px;
    right: 6px;

    border-bottom: 2px solid;
    border-right: 2px solid;

    border-radius: 0 0 4px 0;
}


/* note */

.footer-qr-note {
    display: flex;

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

    gap: 7px;

    padding-top: 12px;

    border-top:
        1px solid #e5eee6;

    color: #64748b;

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

    text-align: center;
}


.footer-qr-note i {
    color: #15803d;

    font-size: 16px;
}


/* hover */

.footer-qr-premium:hover {
    box-shadow:
        0 22px 45px rgba(15, 23, 42, .10);

    transform:
        translateY(-3px);

    transition:
        .3s ease;
}


.footer-qr-premium {
    transition:
        .3s ease;
}


/* mobile */

@media (max-width: 576px) {

    .footer-qr-premium {
        padding: 20px 16px;
    }

    .footer-qr-frame {
        width: 125px;
        height: 125px;
    }

}


/* =========================================================
   NAVBAR CATALOGUE
========================================================= */

.catalogue-nav-link {
    display: inline-flex;

    align-items: center;

    gap: 5px;
}


.catalogue-nav-link i {
    font-size: 17px;
}


.catalogue-mobile-link {
    display: flex !important;

    align-items: center;

    gap: 9px;
}


.catalogue-mobile-link .catalogue-arrow {
    margin-left: auto;
}


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

@media (max-width: 992px) {

    .catalogue-card {
        grid-template-columns: 1fr;

        gap: 30px;

        padding:
            38px;
    }


    .catalogue-content {
        text-align: center;
    }


    .catalogue-content > p {
        margin-left: auto;
        margin-right: auto;
    }


    .catalogue-highlights,
    .catalogue-actions {
        justify-content: center;
    }


    .catalogue-visual {
        min-height: 330px;
    }


    .footer-connect-card {
        grid-template-columns: 1fr;
    }

}


@media (max-width: 576px) {

    .catalogue-showcase {
        padding:
            65px 0;
    }


    .catalogue-card {
        padding:
            25px 18px;

        border-radius:
            24px;
    }


    .catalogue-content h2 {
        font-size:
            32px;
    }


    .catalogue-content > p {
        font-size:
            14px;
    }


    .catalogue-highlights {
        flex-direction:
            column;

        align-items:
            stretch;
    }


    .catalogue-highlights div {
        justify-content:
            center;
    }


    .catalogue-actions {
        flex-direction:
            column;
    }


    .catalogue-primary-btn,
    .catalogue-secondary-btn {
        width:
            100%;
    }


    .catalogue-visual {
        min-height:
            300px;
    }


    .catalogue-book {
        width:
            190px;

        min-height:
            260px;
    }


    .catalogue-book-main strong {
        font-size:
            23px;
    }


    .catalogue-floating-icon {
        width:
            44px;

        height:
            44px;

        font-size:
            19px;
    }


    .footer-connect-card {
        padding:
            14px;
    }


    .footer-catalogue,
    .footer-qr-box {
        padding:
            16px;
    }


    .footer-qr-box {
        align-items:
            flex-start;
    }


    .footer-qr-image {
        width:
            78px;

        height:
            78px;
    }

}

.catalogue-book-top {
    display: flex;
    justify-content: center;
    align-items: center;

    width: 100%;

    margin-bottom: 15px;
}

.catalogue-brand-logo {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 8px;
}

.catalogue-logo-icon {
    width: 48px;
    height: 48px;

    object-fit: contain;
}

.catalogue-logo-text {
    width: 125px;
    height: auto;

    object-fit: contain;
}

.catalogue-book {
    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f3f8f1
        );

    color: #16351e;

    border:
        1px solid #dcebdc;

    box-shadow:
        -16px 18px 0 #d8e7d8,
        0 30px 55px rgba(15,73,31,.18);
}

.catalogue-book-main span {
    color: #4f7d55;
}

.catalogue-book-main strong {
    color: #183b20;
}

.catalogue-book-main small {
    color: #657565;
}

.catalogue-book-bottom {
    color: #3e7047;
}

/* =========================================================
   FOOTER CATALOGUE + QR
========================================================= */

.footer-connect-card {
    grid-column: 1 / -1;

    display: grid;

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

    align-items: stretch;

    gap: 22px;

    width: 100%;
    min-width: 0;

    margin-top: 30px;
}


/* LEFT CATALOGUE CARD */

.footer-catalogue {
    min-width: 0;

    display: flex;

    align-items: center;

    gap: 18px;

    padding: 24px;

    border-radius: 22px;

    background:
        linear-gradient(
            135deg,
            #f8fcf8,
            #ffffff
        );

    border: 1px solid #dcebdd;

    box-shadow:
        0 12px 30px rgba(15, 23, 42, .06);
}


/* RIGHT QR CARD */

.footer-qr-premium {
    min-width: 0;
    width: 100%;

    box-sizing: border-box;

    padding: 24px;

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            #f8fcf7 0%,
            #ffffff 55%,
            #eef8ef 100%
        );

    border: 1px solid #dcebdd;

    box-shadow:
        0 16px 35px rgba(15, 23, 42, .07);

    overflow: hidden;
}


/* QR CONTENT */

.footer-qr-main {
    display: flex;

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

    width: 100%;

    margin: 18px 0;
}


/* QR IMAGE */

.footer-qr-frame {
    flex-shrink: 0;

    width: 138px;
    height: 138px;

    display: flex;

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

    padding: 10px;

    box-sizing: border-box;

    background: #fff;

    border-radius: 18px;

    border: 1px solid #dce7dd;

    box-shadow:
        0 12px 28px rgba(15, 23, 42, .08);
}


/* =========================================================
   DESKTOP
========================================================= */

@media (min-width: 993px) {

    .footer-connect-card {
        grid-column: 1 / -1;

        width: 100%;
    }

}


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

@media (max-width: 992px) {

    .footer-connect-card {
        grid-column: 1 / -1;

        grid-template-columns: 1fr;

        gap: 18px;
    }

}


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

@media (max-width: 576px) {

    .footer-connect-card {
        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 22px;
    }

    .footer-catalogue,
    .footer-qr-premium {
        padding: 18px;
    }

}