/* ==========================================================
   VOGOW GLOBAL DESIGN SYSTEM
   Premium SaaS Marketing Website
========================================================== */


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

:root {

     --vogow-black : #000000;

    --vogow-blue: #0098da;

    --vogow-orange: #fc9f1c;

    --black: #000000;

    --white: #ffffff;

    --dark-bg: #050505;

    --light-bg: #f8fafc;

    --text-primary: #111111;

    --text-secondary: #555555;

    --border: #e8e8e8;

}

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


* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}



html {

    scroll-behavior: smooth;

}



body {

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

    color: var(--text-primary);

    background: var(--white);

    line-height: 1.6;

}



a {

    text-decoration: none;

    color: inherit;

}



img {

    max-width:100%;

}





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


.vogow-navbar {


    background: rgba(255,255,255,0.85);

    backdrop-filter: blur(20px);

    /* padding: 22px 0; */

    transition: all .3s ease;

}



.navbar-brand {


    font-size: 34px;

    font-weight: 800;

    letter-spacing: -1.5px;

    color: var(--black);

}



.logo-orange {

    color: var(--vogow-orange);

}



.nav-link {


    font-size:16px;

    font-weight:600;

    margin:0 14px;

    color:#222;

    transition:.3s ease;

}



.nav-link:hover {


    color:var(--vogow-blue);

}





.navbar-scrolled {


    box-shadow:

    0 10px 40px rgba(0,0,0,.08);

}





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


.primary-btn {


    background:var(--vogow-blue);

    color:var(--white);

    padding:15px 35px;

    border-radius:50px;

    font-weight:700;

    border:none;

    transition:.3s ease;

}



.primary-btn:hover {


    background:#007fb7;

    transform:translateY(-3px);

}



.secondary-btn {


    border:2px solid var(--black);

    padding:13px 33px;

    border-radius:50px;

    font-weight:700;

    transition:.3s ease;

}



.secondary-btn:hover {


    background:var(--black);

    color:white;

}





.vogow-btn {


    background:var(--vogow-blue);

    padding:13px 28px;

    border-radius:50px;

    font-weight:700;

    color:var(--white);

}





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


.premium-hero {


    /* padding:220px 0 150px; */
    padding:100px 0 150px;

    background:


    radial-gradient(
    circle at top right,
    rgba(0,152,218,.15),
    transparent 35%
    ),


    radial-gradient(
    circle at bottom left,
    rgba(252,159,28,.15),
    transparent 35%
    );


}



.badge-pill {


    display:inline-block;

    background:#f2f2f2;

    padding:10px 22px;

    border-radius:50px;

    font-size:14px;

    font-weight:700;

    margin-bottom:30px;

}



.premium-hero h1 {


    font-size:88px;

    line-height:1;

    font-weight:800;

    letter-spacing:-4px;

}



/* .premium-hero h1 span { color:var(--vogow-blue); } */

.premium-hero h1 .black { color:var(--vogow-black) }
.premium-hero h1 .blue { color:var(--vogow-blue); }
.premium-hero h1 .orange { color: var(--vogow-orange); }


.premium-hero p {


    max-width:650px;

    margin-top:35px;

    font-size:23px;

    color:var(--text-secondary);

}





/* ==========================
   DASHBOARD MOCKUP
========================== */


.dashboard-glass {


    padding:35px;

    border-radius:32px;


    background:

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


    backdrop-filter:blur(25px);


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


    box-shadow:


    0 30px 80px rgba(0,0,0,.15);


    animation:

    floating 6s ease-in-out infinite;

}



.dashboard-top {


    display:flex;

    justify-content:space-between;

    align-items:center;

}



.status-dot {


    width:14px;

    height:14px;

    background:var(--vogow-blue);

    border-radius:50%;

}



.metric-card {


    margin:30px 0;

    padding:30px;

    border-radius:25px;

    background:#000;

    color:white;

}



.metric-card h2 {


    font-size:42px;

    font-weight:800;

}



.metric-card small {


    color:#8ee5ff;

}





.mini-card {


    background:#f8fafc;

    padding:25px;

    border-radius:22px;

    text-align:center;

}



.mini-card i {


    font-size:32px;

    color:var(--vogow-orange);

}



.mini-card h4 {


    font-size:28px;

    font-weight:800;

}







/* ==========================
   COMMON SECTIONS
========================== */


.section-padding {


    padding:130px 0;

}



.section-heading {


    max-width:850px;

    margin:auto;

}



.section-heading h2 {


    font-size:64px;

    font-weight:800;

    letter-spacing:-3px;

    line-height:1.1;

}



.section-heading p {


    margin-top:20px;

    font-size:21px;

    color:var(--text-secondary);

}





.trust-section {


    padding:70px 0;

    background:var(--light-bg);

}



.trust-section h4 {


    font-size:28px;

    font-weight:800;

}





.soft-section {


    background:var(--light-bg);

    padding:120px 0;

}





/* ==========================
   CARDS
========================== */


.feature-card {


    height:100%;

    padding:40px;

    border-radius:28px;

    background:white;

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

    transition:.35s ease;

}



.feature-card:hover {


    transform:translateY(-10px);


    box-shadow:

    0 25px 60px rgba(0,0,0,.12);

}



.feature-card i {


    font-size:42px;

    color:var(--vogow-blue);

    margin-bottom:25px;

}



.feature-card h3 {


    font-size:28px;

    font-weight:800;

}



.feature-card p {


    color:var(--text-secondary);

}





.industry-card {


    background:white;

    padding:35px;

    border-radius:25px;

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

    transition:.3s ease;

}



.industry-card:hover {


    transform:translateY(-8px);

}



.industry-card i {


    font-size:40px;

    color:var(--vogow-orange);

}





.benefit-card {


    padding:45px;

    border-radius:30px;

    background:white;

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

}



.benefit-card span {


    font-size:50px;

    font-weight:800;

    color:var(--vogow-blue);

}





/* ==========================
   DARK SECTION
========================== */


.dark-section {


    background:#050505;

    color:white;

    padding:140px 0;

}



.dark-section h2 {


    font-size:70px;

    font-weight:800;

    letter-spacing:-3px;

}



.dark-section p {


    font-size:22px;

    color:#cccccc;

}





.ecosystem-box {


    display:grid;

    grid-template-columns:1fr 1fr;

    gap:20px;

}



.ecosystem-item {


    background:#111;

    padding:30px;

    border-radius:25px;

    font-size:22px;

    font-weight:700;

}



.ecosystem-item i {


    color:var(--vogow-orange);

    font-size:30px;

    margin-right:15px;

}





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


.process-card {


    height:100%;


    padding:45px 35px;


    background:#ffffff;


    border-radius:30px;


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


    text-align:center;


    transition:.35s ease;


}
.process-card:hover {


    transform:translateY(-10px);


    box-shadow:

    0 25px 60px rgba(0,0,0,.12);


}



.process-number {


    width:90px;


    height:90px;


    margin:0 auto 25px;


    display:flex;


    align-items:center;


    justify-content:center;


    border-radius:50%;


    background:


    linear-gradient(
    135deg,
    var(--vogow-blue),
    var(--vogow-orange)
    );


    color:white;


    font-size:42px;


    font-weight:800;


}


.process-card h3 {


    font-size:30px;


    font-weight:800;


    margin-bottom:15px;


}


.process-card p {


    color:var(--text-secondary);


    font-size:17px;


}





/* ==========================
   PRICING BANNER
========================== */


.pricing-banner {


    background:#000;

    color:white;

    padding:60px;

    border-radius:35px;

}



.pricing-banner h2 {


    font-size:50px;

    font-weight:800;

}





/* ==========================
   PARTNERS
========================== */


.partner-card {


    padding:40px;

    border-radius:30px;

    background:white;

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

}



.partner-card i {


    font-size:45px;

    color:var(--vogow-blue);

}





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


.final-cta {


    padding:150px 0;

}



.final-cta h2 {


    font-size:72px;

    font-weight:800;

    letter-spacing:-3px;

}





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


.vogow-footer {


    background:#050505;

    color:white;

    padding:80px 0 40px;

}



.vogow-footer a {


    display:block;

    color:#ccc;

    margin-bottom:10px;

}



.vogow-footer a:hover {


    color:white;

}





/* ==========================
   ANIMATION
========================== */


@keyframes floating {


    0% {

        transform:translateY(0);

    }


    50% {

        transform:translateY(-15px);

    }


    100% {

        transform:translateY(0);

    }


}

/* ==========================================================
   PRICING COMPONENTS
========================================================== */


.pricing-card {

    position: relative;

    height: 100%;

    padding: 45px 35px;

}



.pricing-card h3 {

    font-size: 32px;

    font-weight: 800;

    margin-bottom: 15px;

}



.pricing-card h2 {

    font-size: 55px;

    font-weight: 800;

    margin: 30px 0;

    letter-spacing: -2px;

}



.pricing-card h2 small {

    font-size:18px;

    font-weight:600;

    color:var(--text-secondary);

}



.pricing-card p {

    color:var(--text-secondary);

    min-height:60px;

}





/* ==========================
   FEATURED PLAN
========================== */


.featured-plan {


    border:

    2px solid var(--vogow-orange);


    transform:translateY(-15px);


    box-shadow:

    0 30px 70px rgba(252,159,28,.20);


}





.featured-plan:hover {


    transform:

    translateY(-25px);


}





.popular-badge {


    position:absolute;


    top:-18px;


    right:30px;


    background:var(--vogow-orange);


    color:#000;


    padding:8px 22px;


    border-radius:50px;


    font-size:13px;


    font-weight:800;


}







/* ==========================
   PRICING LIST
========================== */


.pricing-list {


    list-style:none;

    padding:0;

    margin:35px 0;


}



.pricing-list li {


    display:flex;

    align-items:center;


    gap:12px;


    margin-bottom:18px;


    font-size:16px;


    font-weight:600;


}



.pricing-list i {


    color:var(--vogow-blue);


    font-size:20px;


}







/* ==========================================================
   CONTACT FORM
========================================================== */



.contact-form label {


    font-size:15px;


    font-weight:700;


    margin-bottom:8px;


}




.form-control {


    border:

    1px solid #dddddd;


    border-radius:16px;


    padding:16px 18px;


    font-size:16px;


    background:#ffffff;


    transition:.3s ease;


}





.form-control:focus {


    border-color:var(--vogow-blue);


    box-shadow:

    0 0 0 4px rgba(0,152,218,.12);


    outline:none;


}





textarea.form-control {


    resize:none;


}





.contact-form .primary-btn {


    min-width:180px;


}





/* ==========================================================
   LINK STYLING INSIDE CARDS
========================================================== */


.feature-card a,
.partner-card a {


    display:inline-block;


    margin-top:20px;


    font-weight:700;


    color:var(--vogow-blue);


    transition:.3s ease;


}



.feature-card a:hover,
.partner-card a:hover {


    color:var(--vogow-orange);


    transform:translateX(5px);


}







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


.vogow-footer hr {


    border-color:rgba(255,255,255,.15);


    margin:35px 0;


}



.vogow-footer h3 {


    font-size:40px;


    font-weight:800;


}



.vogow-footer p {


    color:#aaaaaa;


}



.vogow-footer h5 {


    font-size:18px;


    font-weight:800;


    color:white;


    margin-bottom:25px;


}



.vogow-footer a {


    font-size:15px;


    transition:.3s ease;


}



.vogow-footer a:hover {


    color:var(--vogow-orange);


    transform:translateX(5px);


}







/* ==========================================================
   PREMIUM SECTION TRANSITIONS
========================================================== */


.section-padding,
.soft-section,
.dark-section {


    position:relative;


    overflow:hidden;


}







/* ==========================================================
   DARK SECTION CARDS FIX
========================================================== */


.dark-section .industry-card {


    background:#111111;


    border-color:#222222;


    color:white;


}



.dark-section .industry-card p {


    color:#bbbbbb;


}



.dark-section .industry-card h4 {


    color:white;


}





/* ==========================================================
   FOOTER MOBILE ALIGNMENT
========================================================== */


@media(max-width:768px){


    .vogow-footer h5 {


        margin-top:25px;


    }


}

/* ==========================================================
   LEGAL FOOTER LINKS
========================================================== */


.vogow-footer a {

    display:block;

    color:#bbbbbb;

    text-decoration:none;

    margin-bottom:12px;

}



.vogow-footer a:hover {

    color:var(--vogow-orange);

}



.legal-footer-links a {

    display:inline-block;

    margin:0 8px;

}



.legal-footer-links span {

    color:#777;

}

/* ==========================================================
   LOGO
========================================================== */

.vogow-logo{

    height:48px;
    
    /* height:56px; */

    width:auto;

    display:block;

    transition:.3s ease;

}

.navbar-brand{

    display:flex;

    align-items:center;

    padding:0;

}

.navbar-brand:hover .vogow-logo{

    transform:scale(1.05);

}

.footer-logo{

    height:55px;

    width:auto;

    margin-bottom:20px;

}

/* 
=================================================
   VOGOW HERO CAROUSEL **** PLATFORM.HTML ** START
==================================================
 */

.hero-carousel {

    height:92vh;
    min-height:720px;
    width:100%;

}



.hero-carousel .carousel,
.hero-carousel .carousel-inner,
.hero-carousel .carousel-item {

    height:100%;

}



.hero-carousel .carousel-item {


    background-size:cover;
    background-position:center;

    transition:
    transform 1.5s ease-in-out,
    opacity 1.5s ease-in-out;

}




.hero-overlay {


    position:absolute;

    inset:0;

    background:

    linear-gradient(
        90deg,
        rgba(0,0,0,0.75),
        rgba(0,0,0,0.35),
        rgba(0,0,0,0.25)
    );


    z-index:2;

}



.hero-carousel .container {

    z-index:3;

}



.hero-carousel h1 {

    letter-spacing:-2px;

}



@media(max-width:768px){


    .hero-carousel {

        height:85vh;

    }


    .hero-carousel h1 {

        font-size:3rem;

    }


}


/* 
=================================================
   VOGOW HERO CAROUSEL **** PLATFORM.HTML ** END
==================================================
 */

 /* ==================================================
   SOLUTIONS.HTML *** START
================================================== */


.hero-carousel {

    height: 92vh;
    min-height: 720px;
    width: 100%;
    position: relative;
    overflow: hidden;

}



.hero-carousel .carousel,
.hero-carousel .carousel-inner,
.hero-carousel .carousel-item {

    height: 100%;

}



.hero-carousel .carousel-item {

    background-size: cover;
    background-position: center;

    transition:
    transform 1.5s ease-in-out,
    opacity 1.5s ease-in-out;

}



/* Dark overlay for text readability */

.hero-overlay {

    position:absolute;
    inset:0;

    background:

    linear-gradient(
        90deg,
        rgba(0,0,0,0.78),
        rgba(0,0,0,0.45),
        rgba(0,0,0,0.25)
    );

    z-index:1;

}



.hero-carousel .container {

    position:relative;
    z-index:2;

}





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


.hero-carousel h1 {

    font-size:clamp(3rem,6vw,5.8rem);

    font-weight:800;

    letter-spacing:-3px;

    line-height:1.05;

}



.hero-carousel p {

    max-width:700px;

}





/* ==================================================
   BADGE STYLE
================================================== */


.badge-pill {


    display:inline-block;

    padding:10px 24px;

    border-radius:50px;

    background:#fc9f1c;

    color:white;

    font-weight:700;

    font-size:14px;

    letter-spacing:.5px;

}

/* ==================================================
   COMMON BUTTONS
================================================== */


.primary-btn {


    background:#fc9f1c;

    color:white;

    border-radius:50px;

    padding:15px 38px;

    font-weight:700;

    border:none;

    transition:.3s;


}



.primary-btn:hover {


    background:#0098da;

    color:white;

    transform:translateY(-3px);


}








/* ==================================================
   FEATURE CARDS
================================================== */


.feature-card {


    height:100%;

    padding:40px;

    border-radius:30px;

    background:white;

    box-shadow:

    0 15px 40px rgba(0,0,0,.08);

    transition:.3s;

}



.feature-card:hover {


    transform:translateY(-10px);


}




.feature-card i {


    font-size:42px;

    color:#0098da;

    margin-bottom:25px;


}



.feature-card h3 {


    font-size:26px;

    font-weight:800;


}



.feature-card p {


    color:#666;

    line-height:1.7;


}









/* ==================================================
   INDUSTRY CARDS
================================================== */


.industry-card {


    height:100%;

    padding:35px;

    border-radius:30px;

    background:white;

    box-shadow:

    0 10px 35px rgba(0,0,0,.07);


    transition:.3s;


}



.industry-card:hover {


    transform:translateY(-8px);


}



.industry-card i {


    font-size:38px;

    color:#fc9f1c;

    margin-bottom:20px;


}



.industry-card h4 {


    font-size:24px;

    font-weight:800;


}









/* ==================================================
   DARK BUSINESS ECOSYSTEM SECTION
================================================== */


.dark-section {


    padding:120px 0;

    background:#081b2d;

    color:white;


}




.dark-section h2 {


    font-size:55px;

    font-weight:800;

    line-height:1.1;


}





.ecosystem-box {


    display:grid;

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

    gap:20px;


}



.ecosystem-item {


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

    padding:35px;

    border-radius:25px;

    font-size:22px;

    font-weight:700;


}



.ecosystem-item i {


    display:block;

    font-size:35px;

    margin-bottom:15px;

    color:#00b9ff;


}

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


.final-cta {


    padding:120px 0;

    background:

    linear-gradient(
        135deg,
        #0098da,
        #006b9c
    );

    color:white;


}



.final-cta h2 {


    font-size:52px;

    font-weight:800;


}

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


@media(max-width:768px){



.hero-carousel {


    height:85vh;

}



.hero-carousel h1 {


    font-size:3rem;

    letter-spacing:-1px;


}



.dark-section h2 {


    font-size:38px;


}



.final-cta h2 {


    font-size:36px;


}



.ecosystem-box {


    margin-top:40px;

    grid-template-columns:1fr;


}


}

/* ==================================================
   SOLUTIONS.HTML *** END
================================================== */

/* ==================================================
   Price.HTML *** START
================================================== */
/* ==================================================
   VOGOW PRICING PAGE
================================================== */


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


.pricing-hero {

    height: 90vh;
    min-height: 700px;

    position: relative;

    display:flex;
    align-items:center;

    overflow:hidden;

}



.pricing-hero .carousel,
.pricing-hero .carousel-inner,
.pricing-hero .carousel-item {

    height:100%;

}



.pricing-hero .carousel-item {

    background-size:cover;

    background-position:center;

}



.pricing-hero .hero-overlay {

    position:absolute;

    inset:0;

    background:

    linear-gradient(
        90deg,
        rgba(0,0,0,.80),
        rgba(0,0,0,.40)
    );

    z-index:1;

}



.pricing-hero .container {

    z-index:2;

}



.pricing-hero h1 {


    font-size:clamp(3rem,6vw,5.5rem);

    font-weight:800;

    letter-spacing:-3px;

    line-height:1.05;

}



.pricing-hero h1 span {

    color:#00b9ff;

}



.pricing-hero p {


    max-width:800px;

    margin:auto;

    font-size:1.3rem;

    line-height:1.7;

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

}






/* ================================
   HERO OUTLINE BUTTON
================================ */


.hero-outline-btn {


    border:2px solid white;

    color:white;

    border-radius:50px;

    padding:14px 35px;

    font-weight:700;

}



.hero-outline-btn:hover {


    background:white;

    color:#111;

}








/* ================================
   PRICING CARDS
================================ */


.pricing-card {


    height:100%;

    background:white;

    border-radius:30px;

    padding:40px;

    box-shadow:

    0 20px 50px rgba(0,0,0,.08);

    display:flex;

    flex-direction:column;

    transition:.35s ease;

    position:relative;

}



.pricing-card:hover {


    transform:translateY(-10px);

}





.pricing-card h3 {


    font-size:30px;

    font-weight:800;

    margin-bottom:15px;

}



.pricing-card p {


    color:#6c757d;

    min-height:60px;

}





.pricing-price {


    font-size:55px;

    font-weight:800;

    margin:30px 0;

    color:#111;

}



.pricing-price span {


    font-size:18px;

    font-weight:700;

}



.pricing-price small {


    font-size:18px;

    color:#777;

}







.pricing-card ul {


    list-style:none;

    padding:0;

    margin:0 0 35px 0;

    flex-grow:1;

}



.pricing-card li {


    margin-bottom:15px;

    color:#555;

}



.pricing-card li i {


    color:#0098da;

    margin-right:10px;

}





/* ================================
   FEATURED PLAN
================================ */


.featured-plan {


    border:3px solid #fc9f1c;

    transform:scale(1.05);

    z-index:2;

}



.featured-plan:hover {


    transform:scale(1.05) translateY(-10px);

}





.popular-badge {


    position:absolute;

    top:-18px;

    left:50%;

    transform:translateX(-50%);


    background:#fc9f1c;

    color:white;

    padding:8px 25px;

    border-radius:50px;

    font-size:12px;

    font-weight:800;

    letter-spacing:1px;

}






/* ================================
   OUTLINE BUTTON
================================ */


.outline-btn {


    border:2px solid #0098da;

    color:#0098da;

    border-radius:50px;

    padding:13px;

    font-weight:700;

}



.outline-btn:hover {


    background:#0098da;

    color:white;

}







/* ================================
   ENTERPRISE PRICING
================================ */


.enterprise-pricing {


    background:

    linear-gradient(
        135deg,
        #0098da,
        #003b5c
    );


    padding:45px;

    border-radius:35px;

    color:white;

}



.enterprise-pricing h3 {


    font-size:36px;

    font-weight:800;

}



.enterprise-pricing p {


    font-size:18px;

    opacity:.9;

}







/* ================================
   VALUE CARDS
================================ */


.value-card {


    background:

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


    padding:35px;

    border-radius:30px;

    height:100%;


}



.value-card i {


    font-size:45px;

    color:#fc9f1c;

    margin-bottom:20px;

}



.value-card h3 {


    font-size:26px;

    font-weight:800;

}





.value-card p {


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

}







/* ================================
   COMPARISON TABLE
================================ */


.comparison-table {


    border-radius:20px;

    overflow:hidden;

}



.comparison-table th {


    padding:20px;

    font-weight:800;

}



.comparison-table td {


    padding:18px;

}






/* ================================
   FAQ
================================ */


.accordion-item {


    border:none;

    margin-bottom:15px;

    border-radius:20px!important;

    overflow:hidden;

    box-shadow:

    0 10px 30px rgba(0,0,0,.06);

}



.accordion-button {


    padding:25px;

    font-size:18px;

    font-weight:700;

}



.accordion-button:not(.collapsed) {


    background:#0098da;

    color:white;

}







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


@media(max-width:991px){


.pricing-hero {


    height:75vh;

}



.pricing-hero h1 {


    letter-spacing:-1px;

}



.featured-plan {


    transform:none;

}



.featured-plan:hover {


    transform:translateY(-10px);

}



.enterprise-pricing {


    text-align:center;

}



}




@media(max-width:576px){


.pricing-hero h1 {


    font-size:3rem;

}



.pricing-card {


    padding:30px;

}



.pricing-price {


    font-size:45px;

}


}

/* =================================
   ENTERPRISE CUSTOM PLAN
================================= */


.custom-plan {


    background:

    linear-gradient(
        145deg,
        #071b2c,
        #003b5c
    );


    color:white;

}



.custom-plan p {

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

}



.custom-plan .pricing-price {

    color:white;

    font-size:48px;

}



.custom-plan li {

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

}



.custom-plan li i {

    color:#fc9f1c;

}



.enterprise-btn {


    background:#fc9f1c;

    color:white;

    border-radius:50px;

    padding:14px;

    font-weight:700;

}



.enterprise-btn:hover {


    background:white;

    color:#003b5c;

}

/* ==================================================
   Price.HTML *** END
================================================== */

/* ==================================================
   VOGOW PARTNERS PAGE
================================================== */


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


.partner-hero {

    height:90vh;

    min-height:700px;

    position:relative;

    overflow:hidden;

    display:flex;

    align-items:center;

}



.partner-hero .carousel,
.partner-hero .carousel-inner,
.partner-hero .carousel-item {

    height:100%;

}



.partner-hero .carousel-item {


    background-size:cover;

    background-position:center;

}



.partner-hero .hero-overlay {


    position:absolute;

    inset:0;

    background:

    linear-gradient(
        90deg,
        rgba(0,0,0,.82),
        rgba(0,0,0,.45)
    );


    z-index:1;

}



.partner-hero .container {


    z-index:2;

}



.partner-hero h1 {


    font-size:clamp(3rem,6vw,5.5rem);

    font-weight:800;

    line-height:1.05;

    letter-spacing:-3px;

}



.partner-hero h1 span {


    color:#0098da;

}



.partner-hero p {


    font-size:1.3rem;

    max-width:750px;

    line-height:1.7;

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

}




/* ==================================================
   PARTNERS.HTML ** START
================================================== */


/* ================================
   PARTNER CARDS
================================ */


.partner-card {


    background:white;

    padding:40px 30px;

    border-radius:30px;

    height:100%;

    box-shadow:

    0 20px 50px rgba(0,0,0,.08);


    transition:.35s ease;

}



.partner-card:hover {


    transform:translateY(-10px);

}



.partner-card i {


    font-size:45px;

    color:#0098da;

    margin-bottom:25px;

}



.partner-card h3 {


    font-size:25px;

    font-weight:800;

    margin-bottom:15px;

}



.partner-card p {


    color:#6c757d;

    line-height:1.7;

    min-height:80px;

}



.partner-card a {


    color:#0098da;

    font-weight:700;

    text-decoration:none;

}






/* ================================
   PARTNER LEVEL CARDS
================================ */


.partner-level-card {


    background:

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


    border-radius:30px;

    padding:35px;

    height:100%;

    color:white;


    transition:.35s ease;


}



.partner-level-card:hover {


    transform:translateY(-10px);

}



.partner-level-card .level-number {


    font-size:55px;

    font-weight:800;

    color:#fc9f1c;

    opacity:.9;

}



.partner-level-card h3 {


    font-size:30px;

    font-weight:800;

    margin-top:15px;

}



.partner-level-card span {


    display:inline-block;

    padding:8px 18px;

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

    border-radius:50px;

    font-size:14px;

    margin-bottom:20px;

}



.partner-level-card p {


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

    line-height:1.7;

}



.partner-level-card ul {


    list-style:none;

    padding:0;

    margin-top:25px;

}



.partner-level-card li {


    margin-bottom:12px;

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

}



.partner-level-card i {


    color:#fc9f1c;

    margin-right:10px;

}





.featured-level {


    border:2px solid #fc9f1c;

}







/* ================================
   BENEFIT CARDS
================================ */


.benefit-card {


    background:white;

    border-radius:30px;

    padding:40px;

    height:100%;


    box-shadow:

    0 20px 40px rgba(0,0,0,.06);

}



.benefit-card span {


    font-size:50px;

    font-weight:800;

    color:#0098da;

}



.benefit-card h3 {


    font-size:28px;

    font-weight:800;

    margin:20px 0;

}



.benefit-card p {


    color:#6c757d;

    line-height:1.7;

}







/* ================================
   PROCESS CARDS
================================ */


.process-card {


    text-align:center;

    background:white;

    padding:35px 25px;

    border-radius:30px;

    height:100%;


    box-shadow:

    0 15px 40px rgba(0,0,0,.06);


}



.process-card div {


    width:70px;

    height:70px;

    margin:0 auto 25px;


    display:flex;

    align-items:center;

    justify-content:center;


    border-radius:50%;


    background:#0098da;

    color:white;


    font-size:24px;

    font-weight:800;

}



.process-card h4 {


    font-size:24px;

    font-weight:800;

}



.process-card p {


    color:#6c757d;

}







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


@media(max-width:991px){


.partner-hero {


    height:75vh;

}



.partner-hero h1 {


    letter-spacing:-1px;

}



.partner-card,
.partner-level-card,
.benefit-card,
.process-card {


    margin-bottom:20px;

}



}




@media(max-width:576px){


.partner-hero h1 {


    font-size:3rem;

}



.partner-hero p {


    font-size:1rem;

}



.partner-card {


    padding:30px 25px;

}



.partner-level-card {


    padding:30px;

}



}

/* ==================================================
   PARTNERS.HTML ** END
================================================== */

/* ==================================================
   COMPANY.HTML ** START
================================================== */

/* ==================================================
   VOGOW COMPANY PAGE
================================================== */


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


.company-hero {

    height:90vh;

    min-height:700px;

    position:relative;

    overflow:hidden;

    display:flex;

    align-items:center;

}



.company-hero .carousel,
.company-hero .carousel-inner,
.company-hero .carousel-item {

    height:100%;

}



.company-hero .carousel-item {

    background-size:cover;

    background-position:center;

}



.company-hero .hero-overlay {

    position:absolute;

    inset:0;

    background:

    linear-gradient(
        90deg,
        rgba(0,0,0,.82),
        rgba(0,0,0,.45)
    );

    z-index:1;

}



.company-hero .container {

    z-index:2;

}



.company-hero h1 {

    font-size:clamp(3rem,6vw,5.5rem);

    line-height:1.05;

    font-weight:800;

    letter-spacing:-3px;

}



.company-hero h1 span {

    color:#0098da;

}



.company-hero p {

    max-width:750px;

    font-size:1.25rem;

    line-height:1.7;

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

}







/* ================================
   COMPANY CARDS
================================ */


.company-card {


    background:white;

    padding:40px 30px;

    border-radius:30px;

    height:100%;


    box-shadow:

    0 20px 45px rgba(0,0,0,.07);


    transition:.35s ease;


}



.company-card:hover {


    transform:translateY(-10px);

}



.company-card i {


    font-size:45px;

    color:#0098da;

    margin-bottom:25px;

}



.company-card h3 {


    font-size:25px;

    font-weight:800;

    margin-bottom:15px;

}



.company-card p {


    color:#6c757d;

    line-height:1.7;

}







/* ================================
   COMPANY HIGHLIGHT
================================ */


.company-highlight {


    padding:45px;

    border-radius:35px;

    background:

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

    height:100%;


}



.company-highlight span {


    display:inline-block;

    font-size:14px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:1px;

    color:#fc9f1c;

    margin-bottom:20px;


}



.company-highlight h2 {


    font-size:42px;

    line-height:1.2;

    font-weight:800;

    color:white;

}



.company-highlight p {


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

    font-size:18px;

    line-height:1.8;

    margin-top:25px;

}







/* ================================
   STORY SECTION
================================ */


.section-padding h2 {


    font-weight:800;

    letter-spacing:-1px;

}



.section-padding p {


    color:#6c757d;

    font-size:18px;

    line-height:1.8;

}








/* ================================
   VALUE CARDS
================================ */


.value-card {


    background:white;

    padding:40px;

    border-radius:30px;

    height:100%;


    box-shadow:

    0 20px 50px rgba(0,0,0,.06);


    transition:.35s ease;


}



.value-card:hover {


    transform:translateY(-10px);

}



.value-number {


    font-size:60px;

    font-weight:800;

    color:#0098da;

    opacity:.8;

}



.value-card h3 {


    font-size:30px;

    font-weight:800;

    margin:20px 0;

}



.value-card p {


    color:#6c757d;

    line-height:1.7;

}







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


.industry-card {


    background:white;

    padding:35px 25px;

    border-radius:30px;

    height:100%;


    box-shadow:

    0 15px 40px rgba(0,0,0,.06);


    transition:.35s ease;


}



.industry-card:hover {


    transform:translateY(-8px);

}



.industry-card i {


    font-size:40px;

    color:#0098da;

    margin-bottom:20px;

}



.industry-card h4 {


    font-size:22px;

    font-weight:800;

}



.industry-card p {


    color:#6c757d;

    line-height:1.6;

}







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


@media(max-width:991px){


.company-hero {

    height:75vh;

}



.company-hero h1 {

    letter-spacing:-1px;

}



.company-highlight h2 {

    font-size:32px;

}



.company-card,
.value-card,
.industry-card {

    margin-bottom:20px;

}



}




@media(max-width:576px){


.company-hero h1 {

    font-size:3rem;

}



.company-hero p {

    font-size:1rem;

}



.company-highlight {

    padding:30px;

}



.company-highlight h2 {

    font-size:28px;

}



.value-card {

    padding:30px;

}



}

/* ==================================================
   COMPANY.HTML ** END
================================================== */

/* ==================================================
   Privacy.HTML ** start
================================================== */
/* ==================================================
   LEGAL PAGES
================================================== */


/* LEGAL HERO */

.legal-hero {

    padding: 180px 0 100px;

    background:
    linear-gradient(
        135deg,
        rgba(0,152,218,0.08),
        rgba(252,159,28,0.08)
    );

}


.legal-hero h1 {

    font-size: 72px;

    font-weight: 800;

    line-height: 1.1;

    margin-top: 25px;

}


.legal-hero h1 span {

    background: linear-gradient(
        90deg,
        #0098da,
        #fc9f1c
    );

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

}



.legal-hero p {

    max-width:700px;

    font-size:20px;

    line-height:1.8;

    color:#5f6368;

    margin-top:25px;

}



.legal-date {

    font-size:15px !important;

    font-weight:600;

    color:#777 !important;

}







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


.legal-content {

    max-width:900px;

    margin:auto;

    background:#ffffff;

    padding:50px;

    border-radius:24px;

    box-shadow:
    0 20px 60px rgba(0,0,0,0.06);

}





.legal-content h2 {

    font-size:28px;

    font-weight:800;

    margin-top:45px;

    margin-bottom:20px;

    color:#111827;

}



.legal-content h2:first-child {

    margin-top:0;

}




.legal-content p {

    font-size:17px;

    line-height:1.9;

    color:#4b5563;

    margin-bottom:20px;

}




.legal-content ul {

    padding-left:25px;

    margin-bottom:30px;

}



.legal-content li {

    font-size:16px;

    line-height:1.9;

    color:#4b5563;

    margin-bottom:8px;

}



.legal-content li::marker {

    color:#0098da;

}








/* ==================================================
   LEGAL CTA
================================================== */


.final-cta {

    padding:100px 0;

    background:
    linear-gradient(
        135deg,
        #0098da,
        #007bb5
    );

}



.final-cta h2 {

    color:white;

    font-size:48px;

    font-weight:800;

}



.final-cta p {

    color:rgba(255,255,255,0.9);

    font-size:20px;

}









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


@media(max-width:991px){


.legal-hero {

    padding:150px 0 80px;

}



.legal-hero h1 {

    font-size:48px;

}



.legal-content {

    padding:30px;

}



.legal-content h2 {

    font-size:24px;

}



.final-cta h2 {

    font-size:36px;

}



}





@media(max-width:576px){



.legal-hero h1 {

    font-size:38px;

}



.legal-hero p {

    font-size:17px;

}



.legal-content {

    padding:25px;

    border-radius:16px;

}



.legal-content p,
.legal-content li {

    font-size:15px;

}



.final-cta {

    padding:70px 20px;

}


}

/* ==================================================
   Privacy.HTML ** END
================================================== */


/* ==================================================
   Index.HTML ** HERO SECTION ** START
================================================== */
.vogow-hero {
  position: relative;
  overflow: hidden;
  padding: 110px 0 120px;
  background:
    radial-gradient(circle at 80% 45%, rgba(0,152,218,.10), transparent 30%),
    radial-gradient(circle at 10% 20%, rgba(252,159,28,.08), transparent 25%),
    #fff;
}

/* Eyebrow */
.vogow-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 7px 13px;

  border: 1px solid rgba(0,152,218,.15);
  border-radius: 30px;

  color: #0098da;

  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.3px;
}

.vogow-eyebrow span {
  width: 7px;
  height: 7px;

  border-radius: 50%;

  background: #fc9f1c;

  animation: vogowPulse 2s infinite;
}


/* Heading */

.vogow-hero h1 {
  margin-top: 25px;
  margin-bottom: 22px;

  max-width: 650px;

  font-size: clamp(48px, 6vw, 72px);
  line-height: 1.02;

  font-weight: 800;
  letter-spacing: -3px;

  color: #111820;
}

.vogow-hero h1 strong {
  display: block;

  background: linear-gradient(
    90deg,
    #0098da,
    #fc9f1c
  );

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}


/* Description */
.vogow-hero p {
  max-width: 600px;

  color: #66717d;

  font-size: 18px;
  line-height: 1.7;
}


/* Buttons */

.vogow-hero-buttons {
  display: flex;
  gap: 12px;

  margin-top: 32px;
}

.vogow-hero-buttons .btn {
  padding: 13px 22px;
  border-radius: 9px;
  font-weight: 700;
}

.vogow-hero-buttons i {
  margin-left: 6px;
}


/* Small note */
.vogow-hero-note {
  margin-top: 20px;

  color: #7d8791;

  font-size: 12px;
  font-weight: 600;
}

.vogow-hero-note i {
  color: #0098da;
}

/* ==================================================
   VOGOW ORBIT
   ================================================== */
.vogow-orbit {
  position: relative;

  width: 470px;
  height: 470px;

  margin: auto;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(0,152,218,.06) 0%,
      rgba(0,152,218,.025) 42%,
      transparent 43%
    );
}

/* Center */
.vogow-center {
  position: absolute;

  top: 50%;
  left: 50%;

  width: 145px;
  height: 145px;

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

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

  border-radius: 50%;

  background: #fff;

  border: 1px solid rgba(0,152,218,.15);

  box-shadow:
    0 20px 50px rgba(0,152,218,.15);

  z-index: 3;
}

.vogow-logo-image {
  width: 95px;
  height: auto;
  display: block;
}

.vogow-logo-mark {
  width: 38px;
  height: 38px;

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

  margin-bottom: 5px;

  border-radius: 9px;

  background: #0098da;

  color: #fff;

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

.vogow-center strong {
  color: #111820;
  font-size: 17px;
  letter-spacing: 1px;
}

.vogow-center small {
  margin-top: 2px;
  color: #8a949e;
  font-size: 9px;
}


/* Connecting ring */

.vogow-orbit::before {
  content: "";

  position: absolute;

  top: 50%;
  left: 50%;

  width: 300px;
  height: 300px;

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

  border: 1px dashed rgba(0,152,218,.25);

  border-radius: 50%;

  animation: vogowRotate 25s linear infinite;
}


/* Orbit items */

.orbit-item {
  position: absolute;

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

  padding: 10px 13px;

  border: 1px solid #e7edf1;
  border-radius: 30px;

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

  box-shadow:
    0 10px 25px rgba(30,50,70,.08);

  color: #3e4953;

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

  z-index: 4;

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

.orbit-item i {
  color: #0098da;
  font-size: 14px;
}


/* Positions */

.orbit-customers {
  top: 55px;
  left: 65px;
}

.orbit-products {
  top: 20px;
  right: 70px;
  animation-delay: .6s;
}

.orbit-sales {
  right: 0;
  top: 205px;
  animation-delay: 1s;
}

.orbit-operations {
  right: 65px;
  bottom: 55px;
  animation-delay: 1.4s;
}

.orbit-insights {
  bottom: 25px;
  left: 70px;
  animation-delay: 1.8s;
}

.orbit-growth {
  left: 0;
  top: 205px;
  animation-delay: 2.2s;
}

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

@keyframes vogowFloat {

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

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

}

@keyframes vogowPulse {

  0%, 100% {
    box-shadow: 0 0 0 0 rgba(252,159,28,.25);
  }

  50% {
    box-shadow: 0 0 0 7px rgba(252,159,28,0);
  }

}

@keyframes vogowRotate {

  from {
    transform: translate(-50%, -50%) rotate(0deg);
  }

  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }

}


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

@media (max-width: 991px) {

  .vogow-hero {
    padding: 80px 0 100px;
    text-align: center;
  }

  .vogow-hero p {
    margin-left: auto;
    margin-right: auto;
  }

  .vogow-hero-buttons {
    justify-content: center;
  }

  .vogow-orbit {
    margin-top: 70px;
    transform: scale(.85);
  }

}


@media (max-width: 576px) {

  .vogow-hero h1 {
    font-size: 46px;
    letter-spacing: -2px;
  }

  .vogow-hero p {
    font-size: 16px;
  }

  .vogow-hero-buttons {
    flex-direction: column;
  }

  .vogow-hero-buttons .btn {
    width: 100%;
  }

  .vogow-orbit {
    width: 350px;
    height: 350px;

    transform: scale(.82);
    margin-left: -10px;
  }

  .orbit-customers {
    left: 25px;
  }

  .orbit-products {
    right: 25px;
  }

  .orbit-operations {
    right: 25px;
  }

  .orbit-insights {
    left: 25px;
  }

}

/* ==================================================
   Index.HTML ** HERO SECTION  ** END
================================================== */