/* ================================================== [ Design Tokens ] ================================================== */
:root {
    /* Colors */
    --white: #ffffff;
    --white-10: rgba(255, 255, 255, .1);
    --black: #000000;
    --dark-black: #1C1F2A;
    --transparent: transparent;

    --primary: #161616;
    --secondary: #545860;
    --muted: #6c757d;

    --dark-gray: #313f4d;

    --blue: #0452F0;
    --purple: #5F3DC4;
    --darkBlue: #05203d;
    --btn-hover: #154679;

    --link-hover-bg: #f5f5f5;
    --link-active-bg: #e3f0ff;

    --body-bg: #ffffff;

    --border-primary: #e6e9eb;
    --border-secondary: #dce0e4;

    /* Fonts */
    --font-poppins: 'Poppins', sans-serif;

    /* Font sizes */
    --fs-sm: 14px;
    --fs-base: 16px;
    --fs-h1: 56px;
    --fs-h2: 42px;
    --fs-h3: 36px;
    --fs-h4: 32px;
    --fs-h5: 28px;
    --fs-h6: 24px;

    --fs-12: 12px;
    --lh-16: 16px;

    --fs-24: 24px;
    --lh-32: 32px;

    --fs-20: 20px;
    --fs-26: 26px;
    --fs-36: 36px;

    /* Line heights */
    --lh-sm: 20px;
    --lh-base: 1.5;
    --lh-h1: 56px;
    --lh-h2: 48px;
    --lh-h3: 40px;
    --lh-h4: 32px;
    --lh-h5: 28px;
    --lh-h6: 24px;

    /* Font Weights */
    --fw-300: 300;
    --fw-400: 400;
    --fw-500: 500;
    --fw-600: 600;
    --fw-700: 700;
    --fw-800: 800;
    --fw-900: 900;

    /* Layout */
    --container: 1060px;
    --container-padding: 20px;
    --gutter: 30px;

    /* Spacing */
    --space-xs: 8px;
    --space-sm: 12px;
    --space-md: 20px;
    --space-lg: 32px;
    --space-xl: 60px;

    /* Radius */
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-pill: 50px;

    /* Content */
    --marker-color: var(--primary);
    --blockquote-border: var(--primary);
    --blockquote-bg: var(--white);
    --pre-bg: var(--white);
    --pre-color: var(--primary);

    /* Motion */
    --transition: 0.3s ease-in-out;

    --topNavHeight: 90px;

    --paragraph-font-size: 18px;
}

/* ================================================== [ Base / Reset ] ================================================== */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-poppins);
    font-size: var(--paragraph-font-size);
    line-height: var(--lh-base);
    color: var(--text);
    background: var(--body-bg);
    overflow-x: hidden;
    font-weight: 400;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

figure {
    margin: 0;
}

a,
button,
input,
textarea {
    outline: none;
}

a {
    color: var(--primary);
    text-decoration: none;
    transition: var(--transition);
}

hr {
    margin-block: var(--space-md);
    border: none;
    border-top: 1px solid var(--border-color);
    opacity: 1;
}

/* ================================================== [ Typography & Content ] ================================================== */
p {
    margin-bottom: 16px;
}

strong,
b {
    font-weight: 700;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-poppins);
    line-height: 1.3;
    font-weight: 700;
    color: var(--blue);
    margin-block: 0 30px;
    position: relative;
}

h1 {
    font-size: var(--fs-h1);
}

h2 {
    font-size: var(--fs-h2);
}

h3 {
    font-size: var(--fs-h3);
}

h4 {
    font-size: var(--fs-h4);
}

h5 {
    font-size: var(--fs-h5);
}

h6 {
    font-size: var(--fs-h6);
}

ul,
ol {
    padding-left: 20px;
    margin-bottom: var(--space-md);
}

ol ol,
ol ul,
ul ol,
ul ul {
    margin-top: var(--space-xs);
    margin-bottom: var(--space-xs);
}

li::marker {
    color: var(--marker-color);
}

blockquote {
    padding: 16px 16px 16px 24px;
    margin-bottom: var(--space-md);
    border-left: 5px solid var(--blockquote-border);
    background: var(--blockquote-bg);
}

pre {
    background: var(--pre-bg);
    color: var(--pre-color);
    padding: 16px;
    margin-bottom: var(--space-md);
    border-radius: var(--radius-md);
    overflow: auto;
    -webkit-border-radius: var(--radius-md);
    -moz-border-radius: var(--radius-md);
    -ms-border-radius: var(--radius-md);
    -o-border-radius: var(--radius-md);
}

pre code {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

/* ================================================== [ Layout & Utilities ] ================================================== */
.container,
.container-fluid {
    margin-inline: auto;
    padding-inline: var(--container-padding);
}

.row {
    display: flex;
    flex-wrap: wrap;
    margin-inline: calc(var(--gutter) / -2);
    row-gap: var(--gutter);
}

.row>* {
    padding-inline: calc(var(--gutter) / 2);
}

.img-cover * {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.img-contain * {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

/* ================================================== [ Tables, Forms & Common Elements ] ================================================== */
table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: var(--space-md);
}

th,
td {
    border: 1px solid var(--border-primary);
    padding: 8px 12px;
    text-align: left;
}

/* th {
    background: var(--primary);
    color: var(--link-hover-bg);
} */

textarea {
    resize: none;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    appearance: none;
    margin: 0;
}

/* ================================================== [ Buttons ] ================================================== */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 20px;
    font-family: var(--font-poppins);
    font-size: var(--fs-base);
    line-height: 26px;
    border-radius: 12px;
    border: 1px solid transparent;
    background: none;
    cursor: pointer;
    user-select: none;
    text-decoration: none;
    transition: var(--transition);
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
}

.btn:disabled {
    opacity: 0.6;
    pointer-events: none;
}

.btn-primary {
    color: var(--white);
    background: var(--darkBlue);
    border-color: var(--darkBlue);
}

.btn-primary:is(:hover, :focus-visible, :active) {
    background: var(--btn-hover);
    color: var(--white);
    border-color: var(--btn-hover);
}

.btn-secondary {
    color: var(--primary);
    background: var(--transparent);
    border-color: var(--primary);
}

.btn-secondary:is(:hover, :focus-visible, :active) {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--white);
}

.btn-link { padding: 0; font-family: var(--font-poppins); font-style: normal; font-weight: var(--fw-400); font-size: 18px; line-height: 150%; text-decoration: underline; white-space: normal; color: var(--darkBlue); }
.btn-link:hover { color: var(--btn-hover); }

/* ================================================== [ Pages – Error 404 ] ================================================== */
.error-404 {
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-xl) 0;
}

.error-404 .heading {
    text-align: center;
}

/* ================================================== [ Pages – Typography Page ] ================================================== */
.typography {
    padding-block: 120px;
}

.typography img {
    max-width: 300px;
    width: 100%;
    height: auto;
    aspect-ratio: 1/1;
    object-fit: cover;
    object-position: center;
    margin-bottom: 20px;
}

.typography img.align-left {
    margin-right: 40px;
    float: left;
}

.typography img.align-right {
    margin-left: 40px;
    float: right;
}

.typography img.align-center {
    margin-inline: auto;
    display: block;
}


/* ================================================== [ Site Layout ] ================================================== */
.site-content {
    display: flex;
    align-self: start;
}

/* ================================================== [ Sidebar ] ================================================== */
.side-navigation-wrapper {
    border-right: 1px solid var(--border-primary);
    max-width: 320px;
    width: 100%;
    flex-shrink: 0;
    background-color: var(--white);
}

.side-navigation-wrapper .sidebar-navigation {
    display: flex;
    flex-direction: column;
    position: fixed;
    /* top: var(--topNavHeight); */
    top: 0;
    height: calc(100dvh - 120px);
    overflow-y: auto;
    margin: 0;
    max-width: 320px;
    width: 100%;
    padding: 120px 0 0;
}

.side-navigation-wrapper .sidebar-navigation-list {
    padding: 0 16px 32px;
}

.side-navigation-wrapper .sidebar-navigation-list ul {
    padding-left: 0;
    list-style: none;
    margin-block: 8px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.side-navigation-wrapper .sidebar-navigation-list ul li .nav-link { position: relative; font-size: var(--fs-sm); line-height: var(--lh-sm); font-weight: var(--fw-500); color: var(--primary); display: flex; align-items: center; padding: 8px 12px; background-color: var(--white); border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; }
.side-navigation-wrapper .sidebar-navigation-list ul li .nav-link.active { background-color: var(--link-active-bg); color: var(--blue); font-weight: var(--fw-600); }
.side-navigation-wrapper .sidebar-navigation-list .sub-menu.active > .nav-link { background-color: var(--link-active-bg); color: var(--blue); font-weight: var(--fw-600); }
.side-navigation-wrapper .sidebar-navigation-list ul li .nav-link:not(.active):hover { background-color: var(--link-hover-bg); }
.side-navigation-wrapper .sidebar-navigation-list ul li .nav-link.arrow::after { content: ''; background: url('../images/svgs/arrow-icon.svg') no-repeat; height: 16px; width: 16px; background-size: 100%; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.side-navigation-wrapper .sidebar-navigation-list ul li .nav-link.arrow-down::after { transform: translateY(-50%) rotate(90deg); -webkit-transform: translateY(-50%) rotate(90deg); -moz-transform: translateY(-50%) rotate(90deg); -ms-transform: translateY(-50%) rotate(90deg); -o-transform: translateY(-50%) rotate(90deg); }

.side-navigation-wrapper .sidebar-navigation-list ul ul { margin-left: 16px; }

.side-navigation-wrapper .sidebar-navigation-list .sub-menu:not(.active ) ul { display: none; }





/* ================================================== [ Docs Content ] ================================================== */
.docs-content {
    width: 100%;
    flex-grow: 1;
    padding-top: 90px;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}

.docs-content .main-content-wrapper {
    padding-block: 0;
}

/* ================================================== [ Main Title ] ================================================== */
.main-title {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-block: 0;
}

.main-title .subtitle {
    max-width: 680px;
}

.main-title .title * {
    font-size: var(--fs-h1);
    line-height: var(--lh-h1);
    font-weight: var(--fw-700);
    margin-bottom: 0;
}

.main-title .subtitle * {
    font-size: var(--fs-24);
    line-height: var(--lh-32);
    color: var(--secondary);
    font-weight: var(--fw-300);
    margin-bottom: 0;
}

/* ================================================== [ Main Content (Docs Content) ] ================================================== */
.docs-content .main-content-block {
    position: relative;
    display: flex;
    align-items: start;
    gap: 60px;
}

.docs-content .main-content-block .content-right {
    position: sticky;
    top: calc(var(--topNavHeight) + 20px);
}

.docs-content .main-content-block .content-right .content-nav {
    padding-left: 16px;
    box-shadow: inset 1px 0 0px 0px var(--border-primary);
    width: 200px;
    float: right;
    align-self: flex-start;
    margin-top: 16px;
    max-height: calc(100vh - (var(--topNavHeight) + 20px));
    overflow: auto;
}

.docs-content .main-content-block .content-right .content-nav ul {
    padding-left: 0;
    margin-block: 0;
    list-style: none;
}

.docs-content .main-content-block .content-right .content-nav .title * {
    font-size: var(--fs-12);
    line-height: var(--lh-16);
    text-transform: uppercase;
    color: var(--dark-gray);
    font-weight: var(--fw-600);
    margin-bottom: 6px;
}

.docs-content .main-content-block .content-right .content-nav ul ul {
    margin-left: 16px;
}

.docs-content .main-content-block .content-right .content-nav ul li .nav-link {
    font-size: var(--fs-sm);
    line-height: var(--lh-sm);
    color: var(--dark-gray);
    font-weight: var(--fw-300);
    padding-block: 4px;
    position: relative;
    display: inline-flex;
}

.docs-content .main-content-block .content-right .content-nav ul li .nav-link:hover {
    color: var(--primary);
}

.docs-content .main-content-block .content-right .content-nav ul li .nav-link.active {
    color: var(--blue);
    font-weight: var(--fw-500);
}

.docs-content .main-content-block .content-right .content-nav ul li .nav-link.active::before {
    content: "";
    height: 100%;
    width: 1px;
    position: absolute;
    left: -16px;
    background-color: var(--blue);
    top: 0;
}

.docs-content .main-content-block .content-right .content-nav ul ul li .nav-link.active::before {
    left: -32px;
}

.docs-content .main-content-block .content-right .content-nav ul ul ul li .nav-link.active::before {
    left: -48px;
}

.docs-content .main-content-block .content-left .copy-anchor {
    position: absolute;
    right: 100%;
    top: 5px;
    pointer-events: auto;
    opacity: 0;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
}

.docs-content .main-content-block .content-left .copy-anchor::after {
    content: "";
    background: url('../images/svgs/copy-icon.svg') no-repeat;
    height: 40px;
    width: 20px;
    background-size: 100%;
    display: block;
    background-position: center;
}

.docs-content .main-content-block .content-left :is(h1, h2, h3, h4, h5, h6):hover .copy-anchor {
    right: calc(100% + 4px);
    pointer-events: auto;
    opacity: 1;
}

/* Tooltip text */
.docs-content .main-content-block .content-left .copy-anchor::before {
    content: "Copied!";
    position: absolute;
    top: -28px;
    left: 50%;
    transform: translateX(-50%);
    background: #000;
    color: #fff;
    font-size: 10px;
    padding: 4px 8px;
    line-height: 150%;
    border-radius: 4px;
    white-space: nowrap;
    opacity: 0;
    transition: opacity .3s ease;
    pointer-events: none;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
}

/* Show when clicked */
.docs-content .main-content-block .content-left .copy-anchor.copied::before {
    opacity: 1;
}

.docs-content .content-left li {
    margin-top: 8px;
}

.docs-content .main-content-block img {
    width: 100%;
    height: auto;
    max-height: 500px;
    aspect-ratio: 750 / 450;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    margin-block: 30px;
    object-fit: cover;
    object-position: center;
}

.docs-content .footer-text {
    padding-block: 16px;
}

.docs-content .footer-text.footer-big {
    padding-block: 60px 40px;
}

.docs-content .footer-text * {
    color: var(--muted);
    font-size: var(--fs-sm);
    line-height: var(--lh-sm);
    font-weight: var(--fw-400);
    margin-bottom: 0;
}

.docs-content .footer-text strong {
    color: var(--primary);
    font-weight: var(--fw-400);
    margin-bottom: 0;
}

/* Button Segment */
.max-w-385 {
    max-width: 385px;
    width: 100%;
}

.button-segment {
    display: flex;
    align-items: center;
    gap: 50px;
    background-color: var(--darkBlue);
    color: var(--white);
    padding: 9px 16px;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
    justify-content: space-between;
}

.button-segment:hover {
    background-color: #154679;
}

.button-segment .segment-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.button-segment .segment-text .section * {
    font-size: var(--fs-12);
    line-height: var(--lh-16);
    opacity: .8;
    margin-bottom: 0;
}

.button-segment .segment-text .pagename * {
    font-size: var(--fs-sm);
    line-height: var(--fs-24);
    margin-bottom: 0;
}

.button-segment .arrow {
    flex-shrink: 0;
    height: 20px;
    width: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.button-segment.segment-left {
    flex-direction: row-reverse;
    text-align: end;
}

.button-segment.segment-left .arrow {
    transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
}

/* =========================================== [ New Styles ] =========================================== */
.docs-content .main-content-block .content-left {
    width: 100%;
}

.docs-content .container,
.docs-content .container-fluid { max-width: 1210px; width: 100%; margin-inline: auto; }

.docs-content .main-content-block .content-right {
    display: none;
}


.card-parent-block {
    margin-bottom: 40px;
}

.card-parent-block .card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: unset;
    border-radius: 12px;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
    box-shadow: 0 4px 8px 0 rgb(0, 0, 0, 0.08), 0px 0px 0px 1px #dce0e4;
}

.card-parent-block .card .card-img img {
    height: 170px;
    margin: 0;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    user-select: none;
}

.card-parent-block .card .title * {
    font-weight: var(--fw-600);
    color: var(--black);
    font-size: 20px;
    line-height: 150%;
    margin: 0;
    transition: var(--transition);
    -webkit-transition: var(--transition);
    -moz-transition: var(--transition);
    -ms-transition: var(--transition);
    -o-transition: var(--transition);
}

.card-parent-block .card .disc * {
    color: var(--dark-gray);
    font-size: 16px;
    line-height: 150%;
    margin: 0;
}

.card-parent-block .card:hover .title * {
    color: var(--blue);
}

.card-parent-block .card .content {
    background-color: var(--white);
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.card-parent-block .row>* {
    padding-inline: 12px;
}

.card-parent-block .row {
    margin-inline: -12px;
    row-gap: 24px;
}

/* ==================== [ New Section Start ] ==================== */

.brand-hub {
    /* padding: 80px 0 100px; */
    margin-bottom: 100px;
    overflow-x: clip;
    background-color: var(--blue);
}

.brand-hub-main .heading {
    width: 100%;
    max-width: 978px;
    padding-block: 100px;
    /* margin: 0 auto 100px; */
    /* margin-bottom: 100px; */
}

.brand-hub-main .heading .title {
    width: 100%;
    max-width: 910px;
}

.brand-hub-main .heading .title * {
    color: var(--white);
    font-size: 60px;
    line-height: 130%;
    letter-spacing: -6%;
    margin: 0 0 20px;
}

.brand-hub-main .heading .disc * { font-size: var(--fs-20); color: var(--white); margin-bottom: 0; }

.brand-hub-block .brand-hub-item {
    display: block;
    position: relative;
}

.brand-hub-block .brand-hub-item::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(28, 31, 42, 0.6);
    mix-blend-mode: multiply;
    transition: 0.3s;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
}

.brand-hub-block .brand-hub-item:hover::before {
    background-color: rgb(28, 31, 42, 0.4); 
}

.brand-hub-block .brand-hub-item .image {
    width: 100%;
    max-width: 570px;
    height: 600px;
    overflow: hidden;
}

.brand-hub-block .brand-hub-item .image * {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.3s;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
}

.brand-hub-block .brand-hub-item .brand-hub-content {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 74px 85px;
}

.brand-hub-item .brand-hub-content .title * {
    color: var(--white);
    font-size: 60px;
    line-height: 100%;
    letter-spacing: -3.6px;
    margin: 0;
    transition: 0.3s;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
}

.brand-hub-block .brand-hub-item:hover .brand-hub-content .title * {
    color: var(--blue);
}

.media-libraries {
    padding-bottom: 80px;
}

.media-libraries-main .heading {
    width: 100%;
    max-width: 978px;
    margin-bottom: 54px;
}

.media-libraries-main .heading .title * {
    color: var(--blue);
    font-size: 60px;
    line-height: 100%;
    letter-spacing: -3.6px;
    margin: 0 0 22px;
}

.media-libraries-main .heading .disc * {
    font-size: var(--paragraph-font-size);
    line-height: 150%;
}

.media-libraries-main .heading .disc * { margin-bottom: 0; }

.media-libraries-item {
    display: block;
    width: 100%;
    max-width: 100%;
    /* max-width: 370px; */
    text-decoration: none;
}

.media-libraries-item .image {
    width: 100%;
    height: 230px;
}

.media-libraries-item .image * {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.media-libraries-item .block-title * {
    color: var(--blue);
    font-size: var(--fs-24);
    font-weight: 500;
    line-height: 130%;
    margin-top: 22px;
    margin-bottom: 0;
    transition: 0.3s;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
}

.media-libraries-item:hover .block-title * {
    color: var(--dark-black);
}

.footer-wrapper .container-fluid {
    max-width: 1440px;
}

.footer-wrapper {
    text-align: center;
    border-top: 1px solid #dadada;
    margin-block: auto 0;
}

.sidebar-toggle { display: none !important; }

/* ==================== [ New Section End ] ==================== */


.header {
    background-color: #fff;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9;
    border-bottom: 1px solid #dde3ec;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out
}

.header .hidden-mob {
    display: block
}

.header .top-nav {
    background-color: #0452f0;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-inline: 40px
}

.header .top-nav ul {
    display: flex;
    align-items: center;
    list-style: none;
    gap: 20px;
    margin: 0;
    padding: 0
}

.header .top-nav ul a {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    opacity: 1;
    line-height: 150%;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out
}

.header .top-nav ul a:hover {
    opacity: .8
}

.header li:has(>.seprator) {
    margin-right: -30px
}

.header li:has(>.seprator) .seprator {
    margin-left: -15px;
    width: 1px;
    height: 20px;
    background-color: #d1d5db
}

.header.header-hide {
    top: -130px
}

.header .container-fluid {
    padding-inline: 70px;
    max-width: 100%;
}

.header .globe-icon {
    opacity: .4;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out
}

.header .globe-icon:hover {
    opacity: 1
}

.header .navbar-brand {
    width: 70px;
    height: auto;
    padding: 0;
    margin: 0;
}

.header .navbar-brand * {
    height: 100%;
    width: 100%
}

.header .btn {
    min-width: 148px
}

.header .action-parent {
    display: flex;
    align-items: center;
    gap: 22px;
    max-width: 206px;
    width: 100%
}

.header .nav-item {
    width: 100%
}

.header .nav-item:has(.dropdown-item.active) .nav-link {
    color: var(--blue);
}

.header .nav-item .nav-link {
    color: var(--blue);
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    padding: 34px 0;
    transition: 0.3s;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    position: relative
}

.header .nav-item .nav-link:hover {
    color: var(--black);
}

.header .nav-item .nav-link.active span {
    color: var(--black);
}

.header .dropdown>a.active::after {
    filter: brightness(0);
    -webkit-filter: brightness(0);
}

.header .nav-item .nav-link:has(.active) {
    color: var(--black);
}

.header .nav-item.hidden-desk {
    display: none
}

.header .navbar {
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.header .navbar .navbar-collapse {
    justify-content: center;
    gap: 45px
}

.header .navbar .navbar-nav {
    gap: 30px;
    align-items: center
}

.header .navbar .navbar-nav .dropdown .dropdown-menu {
    filter: drop-shadow(0 1px 2px rgba(16, 24, 40, 0.06)) drop-shadow(0 1px 3px rgba(16, 24, 40, 0.1));
    border: 1px solid #d1d5db;
    border-top: 0;
    background: #fff;
    max-width: 330px;
    width: 330px;
    min-width: 330px;
    display: block;
    visibility: hidden;
    opacity: 0;
    transition: all ease-in-out .1s;
    -webkit-transition: all ease-in-out .1s;
    -moz-transition: all ease-in-out .1s;
    -ms-transition: all ease-in-out .1s;
    -o-transition: all ease-in-out .1s;
    box-shadow: 0px 1px 3px 0px rgba(16, 24, 40, .1), 0px 1px 2px 0px rgba(16, 24, 40, .06);
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    padding: 10px 0;
    -webkit-filter: drop-shadow(0 1px 2px rgba(16, 24, 40, 0.06)) drop-shadow(0 1px 3px rgba(16, 24, 40, 0.1));
}

.header .navbar .navbar-nav .dropdown .dropdown-menu .dropdown-item-group {
    list-style: none;
    padding: 0
}

.header .navbar .navbar-nav .dropdown .dropdown-menu li .dropdown-item {
    padding: 10px 14px 10px 30px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.header .navbar .navbar-nav .dropdown .dropdown-menu li .dropdown-item.sub {
    margin-bottom: 20px;
    border-bottom: 1px solid #d1d5db;
}

.header .navbar .navbar-nav .dropdown .dropdown-menu li .dropdown-item.sub.active span {
    color: var(--blue);
}

.header .navbar .navbar-nav .dropdown .dropdown-menu li .dropdown-item:not(.active):hover {
    text-decoration: unset !important;
    background: rgb(4, 82, 240, 0.05);
    color: var(--blue);
    text-decoration: underline
}

.header .navbar .navbar-nav .dropdown .dropdown-menu li .dropdown-item::after {
    display: none
}

.header .navbar .navbar-nav .dropdown .dropdown-menu li .dropdown-item.active {
    background: rgb(4, 82, 240, 0.05);
}

.header .navbar .navbar-nav .dropdown .dropdown-menu li .dropdown-item.active span {
    color: var(--blue);
}

.header .navbar .navbar-nav .dropdown .dropdown-menu li .dropdown-item.active img {
    filter: brightness(0) saturate(100%) invert(23%) sepia(86%) saturate(6914%) hue-rotate(221deg) brightness(98%) contrast(97%);
    -webkit-filter: brightness(0) saturate(100%) invert(23%) sepia(86%) saturate(6914%) hue-rotate(221deg) brightness(98%) contrast(97%);
}

.header .navbar .navbar-nav .dropdown .subDD .dropdown-menu .dropdown-item.active {
    background: rgb(4, 82, 240, 0.05);
    color: var(--blue);
}

.header .navbar .navbar-nav .dropdown .dropdown-menu li .dropdown-item span {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #262626;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%
}

.header .navbar .navbar-nav .dropdown .dropdown-menu li .dropdown-item span img {
    max-width: 28px;
    max-height: 28px
}


.header .navbar .navbar-nav .dropdown .subDD {
    position: unset
}

.header .navbar .navbar-nav .dropdown .subDD .dropdown-menu {
    left: 100%;
    top: 0 !important;
    height: 100%;
    overflow: auto;
    background: #fff;
    filter: unset;
    border-radius: 0;
    border: 1px solid #d1d5db;
    -webkit-filter: unset;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

.header .navbar .navbar-nav .dropdown .subDD .dropdown-menu .dropdown-item {
    color: #262626;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%
}

.header .navbar .navbar-nav .dropdown .subDD .dropdown-menu ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.header .navbar .navbar-nav .dropdown .dropdown-toggle::before {
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    opacity: 0;
    position: absolute;
    content: "";
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 2px;
    background-color: #0452f0;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%)
}

.header .navbar .navbar-nav .dropdown>a {
    position: relative
}

.header .navbar .navbar-nav .dropdown:hover>a {
    color: rgb(4, 82, 240, 0.) !important
}

.header .navbar .navbar-nav .dropdown:hover>a:after {
    transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    filter: brightness(0) saturate(100%) invert(40%) sepia(100%) saturate(7487%) hue-rotate(221deg) brightness(97%) contrast(97%);
    -webkit-filter: brightness(0) saturate(100%) invert(40%) sepia(100%) saturate(7487%) hue-rotate(221deg) brightness(97%) contrast(97%)
}

.header .navbar .navbar-nav .dropdown:hover>a span:before {
    transform-origin: bottom left;
    transform: scaleX(100%);
    -webkit-transform: scaleX(100%);
    -moz-transform: scaleX(100%);
    -ms-transform: scaleX(100%);
    -o-transform: scaleX(100%)
}

.header .navbar .navbar-nav .dropdown:hover>.dropdown-menu {
    visibility: visible;
    opacity: 1;
    transition: all ease-in-out .4s;
    -webkit-transition: all ease-in-out .4s;
    -moz-transition: all ease-in-out .4s;
    -ms-transition: all ease-in-out .4s;
    -o-transition: all ease-in-out .4s
}

.header .navbar .navbar-nav .dropdown:hover .dropdown-toggle::before {
    opacity: 1
}

.header .nav-menu-group {
    display: flex;
    width: 100%
}

.header .dropdown>a::after {
    content: "";
    background: url("../images/svgs/arrow-right.svg") no-repeat;
    height: 20px;
    width: 20px;
    background-position: center;
    transition: transform .3s ease-in-out;
    -webkit-transition: transform .3s ease-in-out;
    -moz-transition: transform .3s ease-in-out;
    -ms-transition: transform .3s ease-in-out;
    -o-transition: transform .3s ease-in-out
}

.header .dropdown .dropdown-toggle::after {
    border: unset;
    display: flex;
    align-items: center;
    justify-content: center
}

.header .dropdown.subDD.active-sub {
    background: #ebf6ff
}

.header .dropdown.subDD.mobile-menu-active {
    background: #f3f8fa
}

.navbar-toggler {
    width: 30px;
    height: 22px;
    padding: 0;
    box-shadow: none !important;
    border: none
}

.navbar-toggler .hamburger {
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    flex-direction: column;
    justify-content: space-between
}

.navbar-toggler .hamburger span {
    width: 100%;
    height: 2px;
    background-color: #000;
    position: relative;
    transition: .4s;
    -webkit-transition: .4s;
    -moz-transition: .4s;
    -ms-transition: .4s;
    -o-transition: .4s
}

.navbar-toggler .hamburger span:first-child {
    top: 10px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg)
}

.navbar-toggler .hamburger span:nth-child(2) {
    opacity: 0
}

.navbar-toggler .hamburger span:last-child {
    margin: 0;
    top: -10px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg)
}

.navbar-toggler .hamburger-toggle {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.navbar-toggler.collapsed .hamburger span {
    opacity: 1 !important;
    top: auto !important;
    transform: none !important;
    -webkit-transform: none !important;
    -moz-transform: none !important;
    -ms-transform: none !important;
    -o-transform: none !important
}

.dropdown .dropdown-menu:has(.subDD.active-sub:has(.submenu-left)) {
    border-radius: 0 0 16px 0 !important;
    -webkit-border-radius: 0 0 16px 0 !important;
    -moz-border-radius: 0 0 16px 0 !important;
    -ms-border-radius: 0 0 16px 0 !important;
    -o-border-radius: 0 0 16px 0 !important
}

.header .navbar .navbar-nav .dropdown .subDD .dropdown-menu.submenu-left {
    border-radius: 0 0 0 16px !important;
    -webkit-border-radius: 0 0 0 16px !important;
    -moz-border-radius: 0 0 0 16px !important;
    -ms-border-radius: 0 0 0 16px !important;
    -o-border-radius: 0 0 0 16px !important
}

.dropdown-menu.submenu-left {
    right: 100% !important;
    left: unset !important
}

.dropdown-item-title {
    text-transform: uppercase;
    pointer-events: none
}

.dropdown-item-title span {
    color: #6b7280 !important
}

.sidebar * {
    margin: 0;
}

.sidebar-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    padding: 6px 10px;
    background: rgba(4, 82, 240, 0.08);
    max-width: fit-content;
    border-radius: 20px;
}

.sidebar-toggle .toggle-navbar {
    background-color: transparent;
    border: none;
}

.sidebar-navigation .close-sidebar {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 20px;
    height: 20px;
}

/* ================================ [ Module CSS Start ] ================================ */
.module-wrapper { padding-block: 0 80px; }
.module { padding-top: 80px; max-width: calc(1170px + 40px); width: 100%; margin-inline: auto; padding-inline: 20px; }
.module .module-heading .disc *:last-child { margin-bottom: 0; }

.module.module-1 .module-heading .disc * { margin-bottom: 0; font-size: var(--paragraph-font-size); color: var(--blue); font-weight: var(--fw-500); }

.module.module-3 .module-heading .subtitle * { font-size: 20px; margin-bottom: 2px; font-weight: var(--fw-500); }
.module.module-3 .module-heading .title * { letter-spacing: -6%; margin-bottom: 24px; font-weight: var(--fw-700); }

.module.module-2 .module-heading .disc * { font-size: var(--paragraph-font-size); }

.image-text-module { display: flex; align-items: center; gap: 40px; justify-content: space-between; }
.image-text-module .module-text-block { max-width: 520px; width: 100%; flex-shrink: 1; }
.image-text-module .module-text-block .title * { letter-spacing: -6%; }

.image-text-module .module-image-block { max-width: 570px; width: 100%; height: auto; aspect-ratio: 570 / 360; flex-shrink: 1; }

.image-text-module.module-5 { flex-direction: row-reverse; }

.module-6 .title * { margin-bottom: 0; letter-spacing: -6%; }

.module-image { display: block; min-height: 240px; aspect-ratio: 1170 / 500; max-height: 500px; max-width: 100%; height: auto; }

.module-card { display: flex; flex-direction: column; gap: 30px; }
.module-card .module-card-text { display: flex; flex-direction: column; gap: 8px; }
.module-card .module-card-title * { letter-spacing: -6%; margin-bottom: 0; }
.module-card .module-card-disc * { margin-bottom: 0; }

.module-card .module-card-img { height: auto; max-width: 100%; aspect-ratio: 570 / 460; overflow: hidden; }

.module-img-3 .module-card .module-card-img { aspect-ratio: 1 / 1; }

.module-card .module-card-img img { transform: scale(1); transition: all .3s ease; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); }
.module-card .module-card-img:hover img { transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); }

.module-card .module-card-title:is(a):hover * { text-decoration: underline; }

.module .disc *:last-child { margin-bottom: 0; }

.module .row { row-gap: 30px; }

.docs-content .footer-wrapper { margin-top: 80px; }
.docs-content .content-left { padding-top: 80px; }
/* ================================ [ Module CSS End ] ================================ */

/* ================================ [ Color Card Module Start ] ================================ */
.color-card-module .disc * { margin-bottom: 0; font-size: var(--fs-20); color: var(--blue); font-weight: var(--fw-500); }

.color-card-module .card-block { max-width: 800px; }
.color-card-module .color-card { border: 1px solid #c3c3c0; }
.color-card-module .background { height: 80px; }
.color-card-module .color-details { max-width: 190px; padding: 15px 9px 5px 9px; background-color: var(--white); }
.color-card-module .color-details .title * { font-size: 13px; font-weight: var(--fw-400); margin-bottom: 2px; color: #111110; }
.color-card-module .color-details .disc * { font-size: 12px; margin-bottom: 2px; font-weight: 400; color: #111110; }
.color-card-module .color-details .disc span { font-size: 11px; color: #464643; text-transform: uppercase; }

.color-card-module .row { margin-inline: -10px; row-gap: 20px; }
.color-card-module .row >* { padding-inline: 10px; }
/* ================================ [ Color Card Module End ] ================================ */

/* ================================ [ Typeface Start ] ================================ */
.typeface-img-block { max-width: 800px; background-color: #d9f8ff; padding: 40px 60px; border-radius: 16px; -webkit-border-radius: 16px; -moz-border-radius: 16px; -ms-border-radius: 16px; -o-border-radius: 16px; }
.typeface-img-block * { color: var(--blue); font-size: var(--fs-h1); line-height: 1.3; margin-bottom: 0; } 

.type-item-block { display: flex; flex-direction: column; gap: 40px; max-width: 800px; }
.type-item-block .preview { border-right: 2px solid #e1e1db; display: flex; align-items: center; gap: 30px; }
.type-item-block .preview-big * { font-size: 90px; line-height: 1; color: var(--blue); margin-bottom: 0; }
.type-item-block .preview-all * { font-size: 18px; margin-bottom: 0; color: var(--blue); }
.type-item-block .details * { font-size: 14px; font-weight: 300; color: var(--blue); margin-bottom: 0; }
.type-item-block .details { display: flex; flex-direction: column; height: 100%; justify-content: center; }

.type-item-title * { position: relative; width: fit-content; }
.type-item-title span { font-weight: 300; line-height: 1; font-size: 10px; background-color: #424747; padding: 1px 6px; border-radius: 4px; color: var(--white); position: relative; top: -16px; right: -10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; }
/* ================================ [ Typeface End ] ================================ */

/* Module Spacing */
.module-spacing .module { padding-top: 40px; }

/* ================================ [ Module Assets Start ] ================================ */
/* .module-assets {  } */

.title-14 * { font-size: 14px; line-height: 1.5; font-weight: 500; margin-bottom: 0; }
.title-16 * { font-size: 16px; line-height: 1.5; margin-bottom: 0; }
.disc-13 * { font-size: 13px; line-height: 1.5; margin-bottom: 0; }

.text-dark * { color: var(--primary); }
.text-gray * { color: var(--secondary); }

.v-stack { display: flex; flex-direction: column; }

.mb-16 { margin-bottom: 16px; }

.module-assets .v-stack { gap: 4px; }

.module-assets .row { row-gap: 20px; margin-inline: -10px; }
.module-assets .row >* { padding-inline: 10px; }

/* Asset Card */
.asset-card { display: flex; flex-direction: column; border: 1px solid var(--border-secondary); border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; overflow: hidden; }
.asset-card .image-block { height: 148px; border-bottom: 1px solid var(--border-secondary); }
.asset-card .text-block { padding: 12px 16px; display: flex; flex-direction: column; gap: 6px; }
.asset-card .title * { font-size: 16px; line-height: 1.5; font-weight: 500; color: var(--dark-primary); margin-bottom: 0; }

.asset-card .details { display: flex; gap: 6px; }
.asset-card .details .format-badge * { font-size: 13px; color: var(--primary); font-weight: 500; margin-bottom: 0; padding: 2px 10px; background-color: #e1e1db; border-radius: 9999px; -webkit-border-radius: 9999px; -moz-border-radius: 9999px; -ms-border-radius: 9999px; -o-border-radius: 9999px; }
.asset-card .details .other-details { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--secondary); font-size: 13px; }
.asset-card .details .other-details span::after { content: "•"; margin-inline: 5px; }
.asset-card .details .other-details span:last-child::after { display: none; }

.asset-card:hover { box-shadow: 1px 2px 20px #00000050; }
.shadow-hover { transition: all .3s ease; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; }
.shadow-hover:hover { box-shadow: 1px 2px 20px #00000050; }

/* ================================ [ Module Assets End ] ================================ */

/* ================================ [ Image Download Start ] ================================ */
.image-download { position: relative; cursor: pointer; }
.image-download:hover::after { background-color: #ffffff; }
.image-download::after { content: ""; height: 30px; width: 30px; position: absolute; top: 10px; right: 10px; background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="0.1" stroke-linecap="round" stroke-linejoin="round" color="currentColor" class="fondue _fondue_1h2gd_10 fondue-arrow-circle-down" data-test-id="fondue-icons-arrow-circle-down"><path fill="currentColor" fill-rule="evenodd" d="M3.5 12a8.5 8.5 0 1117 0 8.5 8.5 0 01-17 0M2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10S2 17.523 2 12m14.42.13a.75.75 0 010 1.06l-.53-.53-.531-.53a.75.75 0 011.06 0m-.53.53.53.53h-.001l-.002.002-.005.006-.023.023-.088.088-.323.323-1.06 1.059-2.388 2.388-.53.53-.53-.53-3.89-3.889a.75.75 0 011.061-1.06l2.6 2.6V7.525a.75.75 0 111.5 0v7.222l1.117-1.117 1.06-1.06.322-.322.088-.088.023-.023.006-.005.001-.002z" clip-rule="evenodd"></path></svg>'); background-repeat: no-repeat; background-color: #d7d7d0; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; background-position: center; opacity: 1; transition: all .3s ease; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; }
/* ================================ [ Image Download End ] ================================ */

/* ================================ [ Module Image Description Start ] ================================ */
.module-image-description .download-link-wrapper { margin-top: 40px; }
.module-image-description .download-link { display: inline-block; color: #4a9ee9; text-decoration: underline; font-size: var(--paragraph-font-size); line-height: 1.5; }
.module-image-description .download-link:hover { color: var(--black); }

.disc-26 * { margin-bottom: 0; color: #0062e3; font-size: var(--paragraph-font-size); line-height: 1.5; }
/* ================================ [ Module Image Description End ] ================================ */

/* ================================ [ Module Template Examples Start ] ================================ */
.module-template-examples .img-cover { display: block; height: auto; aspect-ratio: 370 / 222; }
/* ================================ [ Module Template Examples End ] ================================ */

.module-available-templates .heading { margin-bottom: 40px; }

.thumbnail-card { display: flex; align-items: start; gap: 12px; }
.thumbnail-card .image { width: 48px; height: auto; aspect-ratio: 1 / 1; }
.thumbnail-card .text { display: flex; flex-direction: column; gap: 10px; }
.thumbnail-card .text .title * { margin-bottom: 0; font-size: 36px; line-height: 1; font-weight: 600; }
.thumbnail-card .text .link { color: #4a9ee9; text-decoration: underline; font-size: 14px; font-weight: 400; }
.thumbnail-card .text .link:hover { color: var(--black); }

.module-heading .title:last-child * { margin-bottom: 0; }


.collections-card { display: flex; overflow: hidden; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border: 1px solid var(--border-secondary); }
.collections-card .text-content { padding: 12px 16px; display: flex; flex-direction: column; justify-content: center; flex-grow: 1; }
.collections-card .image-content { flex-shrink: 0; border-right: 1px solid var(--border-secondary); display: block; width: 96px; height: auto; aspect-ratio: 1 / 1; }

.module.module-collections .row >* { padding-inline: 8px; }
.module.module-collections .row { margin-inline: -8px; row-gap: 16px; }

.module-assets .heading-block { display: flex; align-items: center; justify-content: space-between; gap: 0; flex-wrap: wrap; gap: 16px; }

.brand-hub-main .disc * ,
.media-libraries .disc * { font-size: var(--paragraph-font-size); }

/* Button Module */
.button-module { display: flex; padding-top: 20px; max-width: calc(1170px + 40px); width: 100%; margin-inline: auto; padding-inline: 20px; }
.button-module .button-wrapper { display: flex; align-items: center; width: 100%; gap: 10px; }
.button-module .button-wrapper .btn { max-width: 195px; width: 100%; }
.button-module .button-wrapper .btn-link { max-width: fit-content; }

.home-page-img { height: 119px; min-width: 1000px; background-size: contain; background-repeat: repeat; width: 100%; }