/* =====================================================
   ROOT
===================================================== */

:root {

    --primary: #123b66;
    --primary-dark: #082a4b;
    --primary-light: #1769aa;

    --blue: #2f80ed;

    --green: #16a36c;
    --green-light: #2bc987;

    --purple: #7b2ff7;

    --orange: #f59e0b;

    --red: #d71950;

    --dark: #142033;
    --text: #475467;
    --muted: #667085;

    --white: #ffffff;

}


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

* {

    margin: 0;
    padding: 0;

    box-sizing: border-box;

}


html {

    scroll-behavior: smooth;

}


body {

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

    color:
        var(--dark);

    line-height:
        1.7;

    background:

        radial-gradient(
            circle at 8% 20%,
            rgba(23,105,170,.06),
            transparent 28%
        ),

        radial-gradient(
            circle at 92% 75%,
            rgba(22,163,108,.07),
            transparent 28%
        ),

        linear-gradient(
            180deg,
            #fbfdff,
            #eef9f4
        );

}


h1,
h2,
h3,
h4,
h5 {

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

}


a {

    text-decoration:
        none;

}



/* =====================================================
   TOP BAR
===================================================== */

.top-bar {

    color:
        #dbe7f2;

    background:

        linear-gradient(
            90deg,
            #071f39,
            #104d78
        );

    font-size:
        12px;

}


.top-bar-inner {

    min-height:
        40px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

}


.top-bar-inner span {

    display:
        flex;

    align-items:
        center;

    gap:
        7px;

}


.top-bar i {

    color:
        #4bd89a;

}



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

.main-navbar {

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

    backdrop-filter:
        blur(15px);

    border-bottom:
        1px solid
        rgba(18,59,102,.08);

    box-shadow:
        0 8px 30px
        rgba(18,59,102,.06);

}


.brand-wrap {

    display:
        flex;

    align-items:
        center;

    gap:
        12px;

}


.brand-logo {

    width:
        60px;

    height:
        60px;

    object-fit:
        contain;

}


.brand-name {

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

    color:
        var(--primary);

    font-size:
        24px;

    font-weight:
        800;

}


.brand-subtitle {

    max-width:
        320px;

    color:
        var(--muted);

    font-size:
        9px;

    line-height:
        1.35;

    text-transform:
        uppercase;

    letter-spacing:
        .05em;

}


.nav-link {

    padding:
        24px 9px !important;

    color:
        #344054 !important;

    font-size:
        13px;

    font-weight:
        700;

    transition:
        .25s;

}


.nav-link:hover,
.nav-link.active {

    color:
        var(--primary-light) !important;

}


.submit-btn {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        8px;

    margin-left:
        15px;

    padding:
        11px 18px;

    color:
        #fff;

    border-radius:
        12px;

    background:

        linear-gradient(
            135deg,
            var(--primary),
            var(--primary-light),
            var(--green)
        );

    font-size:
        13px;

    font-weight:
        800;

    box-shadow:
        0 11px 26px
        rgba(18,59,102,.20);

    transition:
        .25s;

}


.submit-btn:hover {

    color:
        #fff;

    transform:
        translateY(-3px);

    background:

        linear-gradient(
            135deg,
            var(--purple),
            #2f80ed,
            var(--green)
        );

    box-shadow:
        0 17px 35px
        rgba(76,85,205,.25);

}


.navbar-toggler {

    border:
        0;

    box-shadow:
        none !important;

}


.navbar-toggler i {

    color:
        var(--primary);

    font-size:
        28px;

}



/* =====================================================
   HERO
===================================================== */

.guidelines-hero {

    position:
        relative;

    overflow:
        hidden;

    padding:
        52px 0 72px;

    background:

        radial-gradient(
            circle at 87% 18%,
            rgba(28,192,121,.19),
            transparent 27%
        ),

        radial-gradient(
            circle at 10% 88%,
            rgba(47,128,237,.13),
            transparent 29%
        ),

        linear-gradient(
            135deg,
            #eef8ff,
            #effaf4
        );

}


.hero-circle {

    position:
        absolute;

    border:
        1px solid
        rgba(23,105,170,.11);

    border-radius:
        50%;

}


.hero-circle-one {

    width:
        520px;

    height:
        520px;

    right:
        -290px;

    top:
        -315px;

}


.hero-circle-two {

    width:
        330px;

    height:
        330px;

    left:
        -180px;

    bottom:
        -230px;

    border-color:
        rgba(22,163,108,.13);

}


.breadcrumb-wrap {

    position:
        relative;

    z-index:
        2;

    display:
        flex;

    align-items:
        center;

    gap:
        10px;

    margin-bottom:
        39px;

    font-size:
        13px;

}


.breadcrumb-wrap a {

    color:
        var(--primary-light);

    font-weight:
        700;

}


.breadcrumb-wrap span {

    color:
        var(--muted);

}


.breadcrumb-wrap i {

    color:
        #98a2b3;

    font-size:
        9px;

}


.hero-kicker {

    color:
        var(--green);

    font-size:
        11px;

    font-weight:
        800;

    letter-spacing:
        .13em;

}


.guidelines-hero h1 {

    margin:
        8px 0 14px;

    color:
        #102d4b;

    font-size:
        clamp(
            2.7rem,
            6vw,
            4.7rem
        );

    line-height:
        .98;

    letter-spacing:
        -.05em;

}


.hero-description {

    max-width:
        710px;

    color:
        #637488;

    font-size:
        16px;

}


.hero-buttons {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        13px;

    margin-top:
        26px;

}


.btn-main,
.btn-outline {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        8px;

    padding:
        13px 19px;

    border-radius:
        13px;

    font-size:
        13px;

    font-weight:
        800;

    transition:
        .25s;

}


.btn-main {

    color:
        #fff;

    background:

        linear-gradient(
            135deg,
            var(--primary),
            var(--primary-light),
            var(--green)
        );

    box-shadow:
        0 12px 28px
        rgba(18,59,102,.19);

}


.btn-main:hover {

    color:
        #fff;

    transform:
        translateY(-3px);

    background:

        linear-gradient(
            135deg,
            var(--purple),
            #2f80ed,
            var(--green)
        );

    box-shadow:
        0 18px 35px
        rgba(73,81,210,.27);

}


.btn-outline {

    color:
        var(--primary);

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

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

}


.btn-outline:hover {

    color:
        #fff;

    transform:
        translateY(-3px);

    border-color:
        transparent;

    background:

        linear-gradient(
            135deg,
            var(--primary-light),
            var(--green)
        );

}



/* =====================================================
   HERO GUIDELINE CARD
===================================================== */

.hero-guideline-card {

    position:
        relative;

    z-index:
        2;

    padding:
        28px;

    color:
        #fff;

    border-radius:
        25px;

    background:

        radial-gradient(
            circle at 80% 15%,
            rgba(65,221,162,.20),
            transparent 30%
        ),

        linear-gradient(
            145deg,
            #082a4b,
            #12669e 60%,
            #15976b
        );

    box-shadow:
        0 25px 50px
        rgba(18,59,102,.20);

}


.hero-guideline-top {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        10px;

}


.hero-guideline-top span {

    display:
        flex;

    align-items:
        center;

    gap:
        7px;

    color:
        #afeed3;

    font-size:
        10px;

    font-weight:
        800;

    text-transform:
        uppercase;

    letter-spacing:
        .07em;

}


.hero-guideline-top strong {

    padding:
        6px 9px;

    border-radius:
        8px;

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

    font-size:
        10px;

}


.guide-big-icon {

    width:
        70px;

    height:
        70px;

    display:
        grid;

    place-items:
        center;

    margin-top:
        24px;

    border-radius:
        19px;

    color:
        #fff;

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

    font-size:
        30px;

}


.hero-guideline-card h3 {

    margin:
        18px 0 7px;

    color:
        #fff;

    font-size:
        23px;

}


.hero-guideline-card p {

    margin:
        0 0 18px;

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

    font-size:
        12px;

}


.guide-email {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        8px;

    padding:
        10px 12px;

    border-radius:
        11px;

    color:
        #fff;

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

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

    font-size:
        10px;

}



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

.guidelines-content {

    padding:
        78px 0 85px;

}


.guidelines-layout {

    display:
        grid;

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

    gap:
        32px;

    align-items:
        start;

}


.guidelines-sidebar {

    position:
        sticky;

    top:
        100px;

}



/* =====================================================
   SIDEBAR
===================================================== */

.sidebar-card {

    margin-bottom:
        18px;

    padding:
        22px;

    border:
        1px solid
        rgba(18,59,102,.10);

    border-radius:
        20px;

    background:

        linear-gradient(
            145deg,
            rgba(255,255,255,.98),
            rgba(245,250,255,.98),
            rgba(231,249,240,.95)
        );

    box-shadow:
        0 13px 32px
        rgba(20,40,65,.07);

}


.sidebar-summary {

    color:
        #fff;

    background:

        radial-gradient(
            circle at 85% 10%,
            rgba(47,220,158,.21),
            transparent 29%
        ),

        linear-gradient(
            145deg,
            #092b4d,
            #146397 60%,
            #15966d
        );

}


.sidebar-label {

    display:
        block;

    color:
        #b2efd4;

    font-size:
        9px;

    font-weight:
        800;

    letter-spacing:
        .13em;

}


.sidebar-number {

    margin-top:
        16px;

    color:
        #fff;

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

    font-size:
        65px;

    font-weight:
        800;

    line-height:
        .85;

    letter-spacing:
        -.07em;

}


.sidebar-summary h3 {

    margin:
        10px 0 2px;

    color:
        #fff;

    font-size:
        21px;

}


.sidebar-summary > p {

    margin:
        0;

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

    font-size:
        12px;

}


.sidebar-divider {

    height:
        1px;

    margin:
        19px 0;

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

}


.sidebar-stat {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        12px;

    padding:
        10px 0;

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

    font-size:
        10px;

}


.sidebar-stat:last-child {

    border-bottom:
        0;

}


.sidebar-stat span {

    display:
        flex;

    align-items:
        center;

    gap:
        7px;

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

}


.sidebar-stat span i {

    color:
        #56dba2;

}


.sidebar-stat strong {

    color:
        #fff;

    font-size:
        10px;

    text-align:
        right;

}



/* Sidebar navigation */

.sidebar-card h4 {

    margin:
        0 0 12px;

    color:
        #102d4b;

    font-size:
        17px;

}


.sidebar-link {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        10px;

    margin-bottom:
        5px;

    padding:
        11px 9px;

    color:
        #556477;

    border-radius:
        10px;

    font-size:
        10px;

    font-weight:
        700;

    transition:
        .22s;

}


.sidebar-link span {

    display:
        flex;

    align-items:
        center;

    gap:
        8px;

}


.sidebar-link:hover {

    color:
        var(--primary-light);

    background:
        #edf7fc;

}


.sidebar-link.active {

    color:
        #fff;

    background:

        linear-gradient(
            135deg,
            var(--primary-light),
            var(--green)
        );

    box-shadow:
        0 9px 20px
        rgba(23,105,170,.15);

}


.sidebar-link i {

    color:
        var(--primary-light);

}


.sidebar-link.active i {

    color:
        #fff;

}



/* Sidebar submit */

.sidebar-submit {

    padding:
        23px;

    color:
        #fff;

    border-radius:
        20px;

    background:

        linear-gradient(
            145deg,
            var(--purple),
            #2f80ed 52%,
            #16b978
        );

    box-shadow:
        0 18px 38px
        rgba(76,73,199,.19);

}


.sidebar-submit-icon {

    width:
        43px;

    height:
        43px;

    display:
        grid;

    place-items:
        center;

    margin-bottom:
        13px;

    color:
        #fff;

    border-radius:
        12px;

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

}


.sidebar-submit h4 {

    margin:
        0 0 8px;

    color:
        #fff;

    font-size:
        18px;

}


.sidebar-submit p {

    margin:
        0 0 17px;

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

    font-size:
        11px;

}


.sidebar-submit a {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        8px;

    padding:
        9px 12px;

    color:
        #17314e;

    border-radius:
        10px;

    background:
        #fff;

    font-size:
        10px;

    font-weight:
        800;

    transition:
        .22s;

}


.sidebar-submit a:hover {

    color:
        #fff;

    transform:
        translateY(-2px);

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

}



/* =====================================================
   MAIN CONTENT INTRO
===================================================== */

.guidelines-main {

    min-width:
        0;

}


.content-intro {

    margin-bottom:
        30px;

}


.section-kicker {

    color:
        var(--green);

    font-size:
        10px;

    font-weight:
        800;

    letter-spacing:
        .14em;

}


.content-intro h2 {

    margin:
        7px 0 9px;

    color:
        #102d4b;

    font-size:
        clamp(
            2rem,
            4vw,
            3rem
        );

    line-height:
        1.05;

    letter-spacing:
        -.04em;

}


.content-intro p {

    max-width:
        730px;

    margin:
        0;

    color:
        var(--muted);

    font-size:
        13px;

}



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

.guideline-card {

    position:
        relative;

    display:
        grid;

    grid-template-columns:
        48px 58px minmax(0,1fr);

    gap:
        18px;

    margin-bottom:
        18px;

    padding:
        27px;

    overflow:
        hidden;

    border:
        1px solid
        rgba(18,59,102,.10);

    border-radius:
        22px;

    background:

        linear-gradient(
            145deg,
            rgba(255,255,255,.98),
            rgba(246,251,255,.97) 48%,
            rgba(231,249,240,.95)
        );

    box-shadow:
        0 13px 34px
        rgba(20,40,65,.06);

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

}


.guideline-card::before {

    content:
        "";

    position:
        absolute;

    width:
        170px;

    height:
        170px;

    right:
        -90px;

    top:
        -90px;

    border-radius:
        50%;

    background:

        radial-gradient(
            circle,
            rgba(22,163,108,.13),
            transparent 68%
        );

}


.guideline-card:hover {

    transform:
        translateY(-4px);

    border-color:
        rgba(23,105,170,.20);

    box-shadow:
        0 21px 44px
        rgba(18,67,105,.10);

}


.section-number {

    position:
        relative;

    z-index:
        2;

    color:
        rgba(18,59,102,.16);

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

    font-size:
        24px;

    font-weight:
        800;

    line-height:
        1.2;

}


.guideline-icon {

    position:
        relative;

    z-index:
        2;

    width:
        54px;

    height:
        54px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        15px;

    font-size:
        20px;

}


.guideline-icon.green {

    color:
        #0d8b5d;

    background:
        #e4f8ee;

}


.guideline-icon.blue {

    color:
        var(--primary-light);

    background:
        #e9f4ff;

}


.guideline-icon.purple {

    color:
        #7133df;

    background:
        #f0eaff;

}


.guideline-icon.orange {

    color:
        #c7770a;

    background:
        #fff2d9;

}


.guideline-body {

    position:
        relative;

    z-index:
        2;

}


.section-label {

    display:
        inline-block;

    color:
        var(--green);

    font-size:
        9px;

    font-weight:
        800;

    letter-spacing:
        .12em;

}


.guideline-body h3 {

    margin:
        5px 0 10px;

    color:
        #102d4b;

    font-size:
        24px;

    line-height:
        1.2;

}


.guideline-body > p {

    margin:
        0;

    color:
        var(--muted);

    font-size:
        13px;

    line-height:
        1.8;

}



/* =====================================================
   EMAIL BOX
===================================================== */

.email-box {

    display:
        flex;

    align-items:
        center;

    gap:
        12px;

    margin-top:
        20px;

    padding:
        15px;

    border:
        1px solid
        rgba(23,105,170,.13);

    border-radius:
        14px;

    color:
        #173651;

    background:
        linear-gradient(
            135deg,
            #eef7ff,
            #eaf9f2
        );

    transition:
        .25s;

}


.email-box:hover {

    color:
        #173651;

    transform:
        translateY(-2px);

    box-shadow:
        0 10px 25px
        rgba(23,105,170,.10);

}


.email-box > i:first-child {

    width:
        40px;

    height:
        40px;

    display:
        grid;

    place-items:
        center;

    flex-shrink:
        0;

    color:
        #fff;

    border-radius:
        11px;

    background:

        linear-gradient(
            135deg,
            var(--primary-light),
            var(--green)
        );

}


.email-box span {

    flex:
        1;

    font-size:
        13px;

    font-weight:
        800;

}


.email-box small {

    display:
        block;

    margin-bottom:
        2px;

    color:
        var(--muted);

    font-size:
        9px;

    font-weight:
        600;

}


.email-box > i:last-child {

    color:
        var(--primary-light);

}



/* =====================================================
   TERMS LIST
===================================================== */

.terms-list {

    list-style:
        none;

    padding:
        0;

    margin:
        20px 0 0;

}


.terms-list li {

    display:
        flex;

    align-items:
        flex-start;

    gap:
        9px;

    padding:
        10px 0;

    color:
        #59687a;

    border-bottom:
        1px solid
        rgba(18,59,102,.07);

    font-size:
        12px;

    line-height:
        1.7;

}


.terms-list li:last-child {

    border-bottom:
        0;

}


.terms-list i {

    flex-shrink:
        0;

    margin-top:
        4px;

    color:
        var(--green);

}



/* =====================================================
   NOTICE
===================================================== */

.notice-box {

    display:
        flex;

    gap:
        11px;

    margin-top:
        20px;

    padding:
        14px;

    border-radius:
        13px;

    color:
        #5d5b28;

    background:
        #fff9dd;

    border:
        1px solid
        #f1e8a6;

}


.notice-box > i {

    color:
        #c49b00;

    margin-top:
        3px;

}


.notice-box p {

    margin:
        0;

    font-size:
        11px;

    line-height:
        1.7;

}



/* =====================================================
   COPYRIGHT
===================================================== */

.copyright-box {

    display:
        flex;

    gap:
        14px;

    margin-top:
        20px;

    padding:
        17px;

    border:
        1px solid
        rgba(123,47,247,.13);

    border-radius:
        15px;

    background:
        linear-gradient(
            135deg,
            #f6f1ff,
            #edf8ff
        );

}


.copyright-icon {

    width:
        45px;

    height:
        45px;

    display:
        grid;

    place-items:
        center;

    flex-shrink:
        0;

    color:
        #7133df;

    border-radius:
        12px;

    background:
        #fff;

}


.copyright-box strong {

    color:
        #263b54;

    font-size:
        12px;

}


.copyright-box p {

    margin:
        4px 0 0;

    color:
        var(--muted);

    font-size:
        11px;

    line-height:
        1.7;

}



/* =====================================================
   PUBLICATION PROCESS
===================================================== */

.process-timeline {

    position:
        relative;

    margin-top:
        25px;

    padding-left:
        5px;

}


.process-timeline::before {

    content:
        "";

    position:
        absolute;

    left:
        20px;

    top:
        13px;

    bottom:
        15px;

    width:
        2px;

    background:
        linear-gradient(
            180deg,
            #28bf87,
            #2f80ed,
            #7b2ff7
        );

    opacity:
        .25;

}


.process-item {

    position:
        relative;

    z-index:
        2;

    display:
        grid;

    grid-template-columns:
        42px 1fr;

    gap:
        13px;

    margin-bottom:
        22px;

}


.process-item:last-child {

    margin-bottom:
        0;

}


.process-dot {

    width:
        40px;

    height:
        40px;

    display:
        grid;

    place-items:
        center;

    color:
        #fff;

    border-radius:
        12px;

    background:

        linear-gradient(
            135deg,
            var(--primary-light),
            var(--green)
        );

    box-shadow:
        0 8px 18px
        rgba(23,105,170,.15);

    font-size:
        9px;

    font-weight:
        800;

}


.process-item h4 {

    margin:
        3px 0 5px;

    color:
        #193450;

    font-size:
        14px;

}


.process-item p {

    margin:
        0;

    color:
        var(--muted);

    font-size:
        11px;

    line-height:
        1.75;

}



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

.fee-card {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        25px;

    margin-bottom:
        18px;

    padding:
        28px;

    color:
        #fff;

    border-radius:
        23px;

    background:

        radial-gradient(
            circle at 82% 15%,
            rgba(66,222,164,.19),
            transparent 28%
        ),

        linear-gradient(
            135deg,
            #082b4d,
            #12699f 55%,
            #15976c
        );

    box-shadow:
        0 22px 45px
        rgba(18,59,102,.17);

}


.fee-left {

    display:
        flex;

    gap:
        15px;

    align-items:
        flex-start;

}


.fee-icon {

    width:
        54px;

    height:
        54px;

    display:
        grid;

    place-items:
        center;

    flex-shrink:
        0;

    border-radius:
        15px;

    color:
        #fff;

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

    font-size:
        22px;

}


.fee-card .section-label {

    color:
        #a9edd0;

}


.fee-card h3 {

    margin:
        5px 0 7px;

    color:
        #fff;

    font-size:
        22px;

}


.fee-card p {

    max-width:
        550px;

    margin:
        0;

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

    font-size:
        11px;

}


.fee-features {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        9px 15px;

    margin-top:
        14px;

}


.fee-features span {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        5px;

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

    font-size:
        9px;

}


.fee-features i {

    color:
        #63e3aa;

}


.fee-price {

    min-width:
        170px;

    padding:
        19px;

    text-align:
        center;

    border-radius:
        17px;

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

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

}


.fee-price span {

    display:
        block;

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

    font-size:
        9px;

}


.fee-price strong {

    display:
        block;

    margin:
        4px 0;

    color:
        #fff;

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

    font-size:
        43px;

    line-height:
        1;

}


.fee-price small {

    display:
        block;

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

    font-size:
        9px;

}


.fee-price a {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        6px;

    margin-top:
        13px;

    padding:
        8px 10px;

    color:
        #16314f;

    border-radius:
        9px;

    background:
        #fff;

    font-size:
        9px;

    font-weight:
        800;

    transition:
        .22s;

}


.fee-price a:hover {

    color:
        #fff;

    background:
        linear-gradient(
            135deg,
            var(--purple),
            #2f80ed
        );

}



/* =====================================================
   PAYMENT
===================================================== */

.payment-card {

    display:
        flex;

    align-items:
        flex-start;

    gap:
        15px;

    margin-bottom:
        18px;

    padding:
        24px;

    border:
        1px solid
        rgba(18,59,102,.10);

    border-radius:
        20px;

    background:

        linear-gradient(
            145deg,
            #ffffff,
            #eff7ff,
            #eaf9f3
        );

    box-shadow:
        0 12px 30px
        rgba(20,40,65,.06);

}


.payment-icon {

    width:
        50px;

    height:
        50px;

    display:
        grid;

    place-items:
        center;

    flex-shrink:
        0;

    color:
        #1769aa;

    border-radius:
        13px;

    background:
        #eaf4ff;

    font-size:
        23px;

}


.payment-card h3 {

    margin:
        5px 0 5px;

    color:
        #173450;

    font-size:
        20px;

}


.payment-card p {

    margin:
        0;

    color:
        var(--muted);

    font-size:
        11px;

}



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

.guideline-final-cta {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        25px;

    padding:
        27px;

    color:
        #fff;

    border-radius:
        21px;

    background:

        linear-gradient(
            135deg,
            var(--purple),
            #2f80ed 52%,
            var(--green)
        );

    box-shadow:
        0 20px 42px
        rgba(80,78,204,.18);

}


.guideline-final-cta > div span {

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

    font-size:
        9px;

    font-weight:
        800;

    letter-spacing:
        .14em;

}


.guideline-final-cta h3 {

    margin:
        5px 0 4px;

    color:
        #fff;

    font-size:
        21px;

}


.guideline-final-cta p {

    margin:
        0;

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

    font-size:
        10px;

}


.final-submit {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        8px;

    flex-shrink:
        0;

    padding:
        12px 16px;

    color:
        #17324f;

    border-radius:
        11px;

    background:
        #fff;

    font-size:
        10px;

    font-weight:
        800;

    transition:
        .23s;

}


.final-submit:hover {

    color:
        #fff;

    transform:
        translateY(-3px);

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

}



/* =====================================================
   FOOTER
===================================================== */

.footer {

    padding:
        62px 0 24px;

    color:
        #aebdcd;

    background:
        #081c30;

}


.footer-brand {

    display:
        flex;

    align-items:
        center;

    gap:
        12px;

    margin-bottom:
        18px;

}


.footer-brand img {

    width:
        66px;

    height:
        66px;

    object-fit:
        contain;

}


.footer-brand h4 {

    margin:
        0 0 3px;

    color:
        #fff;

}


.footer-brand p {

    margin:
        0;

    color:
        #aebdcd;

    font-size:
        11px;

}


.footer-description {

    max-width:
        500px;

    color:
        #9fb0c2;

    font-size:
        13px;

}


.footer h5 {

    margin-bottom:
        18px;

    color:
        #fff;

    font-size:
        15px;

}


.footer a {

    display:
        block;

    margin-bottom:
        9px;

    color:
        #aebdcd;

    font-size:
        12px;

    transition:
        .2s;

}


.footer a:hover {

    color:
        #55dda0;

    padding-left:
        3px;

}


.footer p {

    color:
        #aebdcd;

    font-size:
        12px;

}


.footer p i {

    margin-right:
        7px;

    color:
        #43d59a;

}


.footer-bottom {

    display:
        flex;

    justify-content:
        space-between;

    gap:
        20px;

    flex-wrap:
        wrap;

    margin-top:
        42px;

    padding-top:
        20px;

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

    color:
        #7f94a9;

    font-size:
        10px;

}



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

@media (max-width: 1199px) {

    .nav-link {

        padding-left:
            6px !important;

        padding-right:
            6px !important;

        font-size:
            12px;

    }

}


@media (max-width: 991px) {

    .top-extra {

        display:
            none !important;

    }


    .nav-link {

        padding:
            10px 0 !important;

    }


    .submit-btn {

        margin:
            10px 0 15px;

    }


    .guidelines-layout {

        grid-template-columns:
            1fr;

    }


    .guidelines-sidebar {

        position:
            static;

        display:
            grid;

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

        gap:
            18px;

    }


    .sidebar-card,
    .sidebar-submit {

        margin-bottom:
            0;

    }


    .sidebar-submit {

        grid-column:
            span 2;

    }


    .fee-card {

        align-items:
            flex-start;

        flex-direction:
            column;

    }


    .fee-price {

        width:
            100%;

    }


    .guideline-final-cta {

        align-items:
            flex-start;

        flex-direction:
            column;

    }


    .final-submit {

        width:
            100%;

    }

}


@media (max-width: 767px) {

    .top-bar-inner {

        justify-content:
            center;

        padding:
            7px 0;

        min-height:
            0;

    }


    .top-bar-inner span {

        font-size:
            10px;

    }


    .brand-subtitle {

        display:
            none;

    }


    .brand-logo {

        width:
            53px;

        height:
            53px;

    }


    .guidelines-hero {

        padding:
            40px 0 60px;

    }


    .guidelines-hero h1 {

        font-size:
            2.55rem;

    }


    .hero-description {

        font-size:
            14px;

    }


    .hero-buttons {

        flex-direction:
            column;

        align-items:
            stretch;

    }


    .btn-main,
    .btn-outline {

        width:
            100%;

    }


    .guidelines-content {

        padding:
            56px 0 68px;

    }


    .guidelines-sidebar {

        display:
            flex;

        flex-direction:
            column;

    }


    .sidebar-submit {

        grid-column:
            auto;

    }


    .guideline-card {

        grid-template-columns:
            1fr;

        gap:
            14px;

        padding:
            22px;

    }


    .section-number {

        position:
            absolute;

        top:
            19px;

        right:
            20px;

    }


    .guideline-body h3 {

        font-size:
            21px;

        padding-right:
            30px;

    }


    .email-box {

        align-items:
            flex-start;

    }


    .fee-left {

        flex-direction:
            column;

    }


    .payment-card {

        flex-direction:
            column;

    }


    .footer-bottom {

        flex-direction:
            column;

        align-items:
            flex-start;

    }

}