/*
======================================================================
Swarnim Sahitya CMS
Frontend Stylesheet
File : assets/css/style.css
Part : 1
======================================================================
*/

/*=====================================================================
  Google Font
=====================================================================*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');


/*=====================================================================
  CSS Variables
=====================================================================*/

:root{

    --primary:#f57c00;
    --primary-dark:#e66a00;
    --secondary:#212529;
    --success:#198754;
    --danger:#dc3545;
    --warning:#ffc107;
    --info:#0dcaf0;

    --white:#ffffff;
    --black:#000000;

    --light:#f8f9fa;
    --light-2:#f4f5f7;
    --gray:#6c757d;
    --gray-light:#dee2e6;
    --border:#e5e7eb;

    --body-bg:#ffffff;
    --body-color:#212529;

    --heading:#111827;
    --text:#4b5563;

    --shadow-sm:0 2px 10px rgba(0,0,0,.05);
    --shadow:0 8px 25px rgba(0,0,0,.08);
    --shadow-lg:0 15px 45px rgba(0,0,0,.12);

    --radius-sm:6px;
    --radius:10px;
    --radius-lg:16px;
    --radius-xl:24px;

    --transition:.3s ease;

    --container:1320px;

    --header-height:82px;

}


/*=====================================================================
  Reset
=====================================================================*/

*,
*::before,
*::after{

    margin:0;
    padding:0;
    box-sizing:border-box;

}


/*=====================================================================
  HTML
=====================================================================*/

html{

    scroll-behavior:smooth;

    font-size:16px;

}


/*=====================================================================
  Body
=====================================================================*/

body{

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

    background:var(--body-bg);

    color:var(--body-color);

    font-size:15px;

    line-height:1.7;

    font-weight:400;

    overflow-x:hidden;

    -webkit-font-smoothing:antialiased;

    -moz-osx-font-smoothing:grayscale;

}


/*=====================================================================
  Selection
=====================================================================*/

::selection{

    background:var(--primary);

    color:var(--white);

}


/*=====================================================================
  Images
=====================================================================*/

img{

    max-width:100%;

    height:auto;

    display:block;

}


/*=====================================================================
  Links
=====================================================================*/

a{

    color:var(--primary);

    text-decoration:none;

    transition:var(--transition);

}

a:hover{

    color:var(--primary-dark);

}


/*=====================================================================
  Lists
=====================================================================*/

ul,
ol{

    list-style:none;

    margin:0;

    padding:0;

}


/*=====================================================================
  Paragraph
=====================================================================*/

p{

    margin-bottom:1rem;

    color:var(--text);

}


/*=====================================================================
  Heading
=====================================================================*/

h1,
h2,
h3,
h4,
h5,
h6{

    color:var(--heading);

    font-weight:700;

    line-height:1.3;

    margin-bottom:1rem;

}

h1{

    font-size:3rem;

}

h2{

    font-size:2.4rem;

}

h3{

    font-size:1.8rem;

}

h4{

    font-size:1.4rem;

}

h5{

    font-size:1.2rem;

}

h6{

    font-size:1rem;

}


/*=====================================================================
  Container
=====================================================================*/

.container{

    max-width:var(--container);

}


/*=====================================================================
  Sections
=====================================================================*/

section{

    position:relative;

    padding:80px 0;

}


/*=====================================================================
  Utilities
=====================================================================*/

.bg-light{

    background:var(--light)!important;

}

.bg-primary{

    background:var(--primary)!important;

}

.text-primary{

    color:var(--primary)!important;

}

.shadow-custom{

    box-shadow:var(--shadow);

}

.rounded-custom{

    border-radius:var(--radius);

}


/*=====================================================================
  Continue...
======================================================================

Part-2

Typography

*/
/*=====================================================================
  Typography
=====================================================================*/

/* Section Title */

.section-title{

    position:relative;

    margin-bottom:60px;

    text-align:center;

}

.section-title .subtitle{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:10px 22px;

    margin-bottom:18px;

    border-radius:50px;

    background:rgba(245,124,0,.08);

    color:var(--primary);

    font-size:.95rem;

    font-weight:600;

    letter-spacing:.8px;

    text-transform:uppercase;

}

.section-title .subtitle::before{

    content:"";

    width:8px;

    height:8px;

    border-radius:50%;

    background:var(--primary);

}

.section-title h2{

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

    font-weight:800;

    line-height:1.2;

    color:var(--heading);

    margin-bottom:20px;

}

.section-title h2 span{

    color:var(--primary);

}

.section-title p{

    max-width:760px;

    margin:0 auto;

    font-size:1.05rem;

    color:var(--text);

}


/* Gradient Heading */

.gradient-text{

    background:linear-gradient(
        90deg,
        #f57c00,
        #ff9800,
        #ffb300
    );

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

    background-clip:text;

}


/* Premium Badge */

.badge-premium{

    display:inline-flex;

    align-items:center;

    gap:8px;

    padding:8px 18px;

    border-radius:50px;

    background:#fff5ea;

    color:var(--primary);

    font-size:.85rem;

    font-weight:700;

    letter-spacing:.5px;

}


/* Text */

.text-muted{

    color:#6b7280!important;

}

.text-light{

    color:#f9fafb!important;

}


/* Lead */

.lead{

    font-size:1.15rem;

    font-weight:400;

    line-height:1.9;

    color:#4b5563;

}


/* Display Headings */

.display-1{

    font-size:5rem;

    font-weight:800;

}

.display-2{

    font-size:4rem;

    font-weight:800;

}

.display-3{

    font-size:3.5rem;

    font-weight:800;

}

.display-4{

    font-size:3rem;

    font-weight:800;

}


/* Small Title */

.small-title{

    font-size:1rem;

    font-weight:700;

    color:var(--primary);

    letter-spacing:2px;

    text-transform:uppercase;

}


/* Divider */

.title-divider{

    width:90px;

    height:5px;

    margin:25px auto 0;

    border-radius:20px;

    background:linear-gradient(
        90deg,
        #f57c00,
        #ffb300
    );

}


/* Blockquote */

blockquote{

    position:relative;

    padding:30px 35px;

    border-left:5px solid var(--primary);

    border-radius:12px;

    background:#fff;

    box-shadow:var(--shadow-sm);

    font-size:1.1rem;

    font-style:italic;

    color:#555;

}

blockquote::before{

    content:"“";

    position:absolute;

    top:-18px;

    left:18px;

    font-size:5rem;

    font-weight:700;

    color:rgba(245,124,0,.15);

}


/* Highlight */

mark{

    background:#fff1d6;

    color:#111;

    padding:.15rem .45rem;

    border-radius:4px;

}


/* HR */

hr{

    border:none;

    height:1px;

    background:#ececec;

    margin:2rem 0;

}


/*=====================================================================
  Continue...

  Part-3

  Buttons
=====================================================================*/
/*=====================================================================
  Buttons
=====================================================================*/

/* Primary Button */

.btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    padding:14px 32px;

    border-radius:50px;

    font-size:15px;

    font-weight:600;

    text-decoration:none;

    transition:all .35s ease;

    cursor:pointer;

    border:none;

    outline:none;

    box-shadow:none;

}


/* Primary */

.btn-primary{

    color:#fff;

    background:linear-gradient(135deg,#ff9d00 0%,#ff7a18 45%,#ff5e62 100%);

    border:none;

    box-shadow:0 12px 30px rgba(245,124,0,.28);

}

.btn-primary:hover{

    color:#fff;

    transform:translateY(-4px);

    box-shadow:0 20px 40px rgba(245,124,0,.35);

    background:linear-gradient(135deg,#ff5e62 0%,#ff7a18 45%,#ff9d00 100%);;

}


/* Secondary */

.btn-secondary{

    background:#212529;

    color:#fff;

    border:none;

    box-shadow:0 12px 25px rgba(0,0,0,.15);

}

.btn-secondary:hover{

    color:#fff;

    transform:translateY(-4px);

    background:#111;

}


/* Outline */

.btn-outline-primary{

    background:#fff;

    color:var(--primary);

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

}

.btn-outline-primary:hover{

    background:var(--primary);

    color:#fff;

    transform:translateY(-4px);

}


/* Light */

.btn-light{

    background:#fff;

    color:#212529;

    border:none;

    box-shadow:var(--shadow);

}

.btn-light:hover{

    background:#fff;

    color:var(--primary);

    transform:translateY(-4px);

}


/* Dark */

.btn-dark{

    background:#111827;

    color:#fff;

}

.btn-dark:hover{

    background:#000;

    color:#fff;

    transform:translateY(-4px);

}


/* Glass Button */

.btn-glass{

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

    backdrop-filter:blur(16px);

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

    color:#fff;

}

.btn-glass:hover{

    background:#fff;

    color:#111;

}


/* Large */

.btn-lg{

    padding:18px 42px;

    font-size:17px;

}


/* Small */

.btn-sm{

    padding:10px 22px;

    font-size:14px;

}


/* Icon */

.btn i{

    font-size:18px;

}


/* Rounded */

.btn-rounded{

    border-radius:100px;

}


/* Shadow */

.btn-shadow{

    box-shadow:0 18px 45px rgba(0,0,0,.18);

}


/* Floating */

.btn-floating{

    position:relative;

    overflow:hidden;

}

.btn-floating::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:80%;

    height:100%;

    background:linear-gradient(

        90deg,

        transparent,

        rgba(255,255,255,.35),

        transparent

    );

    transition:.7s;

}

.btn-floating:hover::before{

    left:130%;

}


/* Ripple */

.btn:active{

    transform:scale(.98);

}


/* Disabled */

.btn:disabled,

.btn.disabled{

    opacity:.6;

    cursor:not-allowed;

    pointer-events:none;

}


/* CTA Button */

.btn-cta{

    background:linear-gradient(

        135deg,

        #ff9800,

        #ffb300

    );

    color:#fff;

    font-size:16px;

    font-weight:700;

    padding:16px 40px;

    border-radius:60px;

    box-shadow:0 18px 45px rgba(255,152,0,.35);

}

.btn-cta:hover{

    color:#fff;

    transform:translateY(-5px);

    box-shadow:0 25px 55px rgba(255,152,0,.45);

}


/*=====================================================================
  Continue...

  Part-4

  Forms

=====================================================================*/
/*=====================================================================
  Forms
=====================================================================*/

/* Form Wrapper */

.form-wrapper{

    position:relative;

    background:#fff;

    border-radius:24px;

    padding:40px;

    box-shadow:0 20px 60px rgba(15,23,42,.08);

}


/* Form Group */

.form-group{

    margin-bottom:24px;

}


/* Labels */

.form-label{

    display:block;

    margin-bottom:10px;

    color:#1f2937;

    font-size:15px;

    font-weight:600;

}


/* Inputs */

.form-control,
.form-select{

    width:100%;

    height:56px;

    padding:0 20px;

    border:1px solid #e5e7eb;

    border-radius:14px;

    background:#fff;

    color:#1f2937;

    font-size:15px;

    font-weight:500;

    transition:all .30s ease;

    box-shadow:none;

}


/* Textarea */

textarea.form-control{

    min-height:180px;

    padding:18px 20px;

    resize:vertical;

}


/* Placeholder */

.form-control::placeholder,
textarea::placeholder{

    color:#9ca3af;

    font-weight:400;

}


/* Hover */

.form-control:hover,
.form-select:hover{

    border-color:#ffb74d;

}


/* Focus */

.form-control:focus,
.form-select:focus,
textarea.form-control:focus{

    border-color:var(--primary);

    box-shadow:0 0 0 .25rem rgba(245,124,0,.12);

    outline:none;

}


/* Disabled */

.form-control:disabled,
.form-select:disabled{

    background:#f8f9fa;

    cursor:not-allowed;

    opacity:.8;

}


/* Input Group */

.input-group{

    border-radius:14px;

    overflow:hidden;

}

.input-group .form-control{

    border-radius:14px 0 0 14px;

}

.input-group .btn{

    border-radius:0 14px 14px 0;

}


/* Checkbox */

.form-check{

    display:flex;

    align-items:center;

    gap:10px;

    margin-bottom:12px;

}

.form-check-input{

    width:20px;

    height:20px;

    cursor:pointer;

    border:2px solid #d1d5db;

}

.form-check-input:checked{

    background-color:var(--primary);

    border-color:var(--primary);

}

.form-check-label{

    cursor:pointer;

    color:#374151;

}


/* Radio */

.form-radio{

    display:flex;

    align-items:center;

    gap:10px;

    margin-bottom:12px;

}


/* Validation */

.is-valid{

    border-color:#16a34a!important;

}

.is-invalid{

    border-color:#dc2626!important;

}

.valid-feedback{

    color:#16a34a;

    font-size:14px;

    margin-top:6px;

}

.invalid-feedback{

    color:#dc2626;

    font-size:14px;

    margin-top:6px;

}


/* Search */

.search-box{

    position:relative;

}

.search-box .form-control{

    padding-left:52px;

}

.search-box i{

    position:absolute;

    top:50%;

    left:20px;

    transform:translateY(-50%);

    color:#9ca3af;

    font-size:18px;

}


/* Newsletter */

.newsletter-form{

    position:relative;

}

.newsletter-form .form-control{

    height:62px;

    border-radius:50px;

    padding-right:170px;

}

.newsletter-form .btn{

    position:absolute;

    top:6px;

    right:6px;

    height:50px;

    padding:0 28px;

    border-radius:50px;

}


/* Contact Form */

.contact-form{

    background:#fff;

    border-radius:24px;

    padding:45px;

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

}


/*=====================================================================
  Continue...

  Part-5

  Header
=====================================================================*/
/*=====================================================================
  Header
=====================================================================*/

/* Top Header */

.top-bar{

    position:relative;

    z-index:1000;

    background:linear-gradient(
        135deg,
        #111827,
        #1f2937
    );

    color:#fff;

    padding:10px 0;

    font-size:14px;

}

.top-bar-left,
.top-bar-right{

    display:flex;

    align-items:center;

    gap:20px;

}

.top-bar span{

    display:inline-flex;

    align-items:center;

    gap:8px;

    color:#e5e7eb;

}

.top-bar a{

    color:#ffffff;

    transition:.3s ease;

}

.top-bar a:hover{

    color:#ffb300;

}

.top-bar i{

    color:#ffb300;

    font-size:15px;

}


/* Header */

#siteHeader{

    position:relative;

    width:100%;

    z-index:999;

    background:#ffffff;

}


/* Sticky Header */

.sticky-top{

    top:0;

    z-index:1030;

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

    backdrop-filter:blur(18px);

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

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

}


/* Logo */

.navbar-brand{

    display:flex;

    align-items:center;

    gap:12px;

    padding:0;

}

.navbar-logo{

    height:58px;

    width:auto;

    transition:.35s ease;

}

.navbar-brand:hover .navbar-logo{

    transform:scale(1.04);

}


/* Page Wrapper */

#page-wrapper{

    position:relative;

    width:100%;

    overflow:hidden;

    background:#ffffff;

}


/* Main Content */

#mainContent{

    position:relative;

    min-height:100vh;

}


/* Preloader */

#preloader{

    position:fixed;

    inset:0;

    z-index:99999;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#ffffff;

}

.preloader-loader{

    display:flex;

    align-items:center;

    justify-content:center;

}

.preloader-loader img{

    width:90px;

    animation:logoPulse 1.6s infinite ease-in-out;

}

@keyframes logoPulse{

    0%{

        transform:scale(.92);

        opacity:.65;

    }

    50%{

        transform:scale(1);

        opacity:1;

    }

    100%{

        transform:scale(.92);

        opacity:.65;

    }

}


/* Flash Messages */

.alert{

    border:none;

    border-radius:14px;

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

}


/* Back To Top */

#backToTop{

    position:fixed;

    right:25px;

    bottom:25px;

    width:54px;

    height:54px;

    border:none;

    border-radius:50%;

    background:linear-gradient(
        135deg,
        #f57c00,
        #ff9800
    );

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:20px;

    cursor:pointer;

    z-index:99999;

    transition:.35s ease;

    box-shadow:0 15px 35px rgba(245,124,0,.35);

}

#backToTop:hover{

    transform:translateY(-6px);

    box-shadow:0 20px 45px rgba(245,124,0,.45);

}


/* Header Divider */

.header-divider{

    width:100%;

    height:1px;

    background:#ececec;

}


/*=====================================================================
  Continue...

  Part-6

  Navbar
=====================================================================*/
/*=====================================================================
  Navbar
=====================================================================*/

/* Main Navbar */

.navbar{

    min-height:82px;

    padding:14px 0;

    background:#ffffff;

    transition:all .35s ease;

}


/* Fixed Navbar Shadow */

.navbar.sticky-top{

    animation:navbarSlide .35s ease;

}

@keyframes navbarSlide{

    from{

        opacity:0;

        transform:translateY(-20px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}


/* Brand */

.navbar-brand{

    margin:0;

    padding:0;

}

.navbar-brand img{

    max-height:60px;

    width:auto;

}


/* Navigation */

.navbar-nav{

    align-items:center;

    gap:10px;

}

.navbar-nav .nav-item{

    position:relative;

}


/* Nav Links */

.navbar-nav .nav-link{

    position:relative;

    padding:12px 18px;

    color:#1f2937;

    font-size:15px;

    font-weight:600;

    transition:all .30s ease;

}

.navbar-nav .nav-link:hover{

    color:var(--primary);

}

.navbar-nav .nav-link.active{

    color:var(--primary);

}


/* Animated Underline */

.navbar-nav .nav-link::after{

    content:"";

    position:absolute;

    left:18px;

    bottom:6px;

    width:0;

    height:3px;

    border-radius:50px;

    background:linear-gradient(
        90deg,
        #f57c00,
        #ff9800
    );

    transition:.30s;

}

.navbar-nav .nav-link:hover::after,

.navbar-nav .nav-link.active::after{

    width:calc(100% - 36px);

}


/* Navbar Right */

.navbar-actions{

    gap:12px;

}


/* Search Button */

.nav-action-btn{

    width:48px;

    height:48px;

    border-radius:50%;

    border:1px solid #e5e7eb;

    background:#ffffff;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#1f2937;

    transition:all .30s ease;

}

.nav-action-btn:hover{

    background:var(--primary);

    color:#ffffff;

    border-color:var(--primary);

}


/* Login Button */

.navbar-actions .btn{

    min-height:48px;

}


/* Navbar Toggler */

.navbar-toggler{

    width:48px;

    height:48px;

    border-radius:12px;

    border:1px solid #e5e7eb;

    box-shadow:none;

}

.navbar-toggler:focus{

    box-shadow:none;

}

.navbar-toggler:hover{

    border-color:var(--primary);

}


/* Offcanvas */

.offcanvas{

    width:320px;

    border:none;

}

.offcanvas-header{

    padding:24px;

    border-bottom:1px solid #ececec;

}

.offcanvas-body{

    padding:24px;

}


/* Mobile Menu */

.offcanvas .nav-link{

    display:block;

    padding:14px 0;

    color:#1f2937;

    font-weight:600;

    border-bottom:1px solid #f2f2f2;

}

.offcanvas .nav-link:hover,

.offcanvas .nav-link.active{

    color:var(--primary);

}


/* Mobile Buttons */

.mobile-quick-actions{

    padding:18px 0;

    background:#ffffff;

    border-top:1px solid #ececec;

}


/* Search Modal */

#searchModal .modal-content{

    border:none;

    border-radius:24px;

    overflow:hidden;

    box-shadow:0 25px 70px rgba(0,0,0,.12);

}

#searchModal .modal-header{

    border-bottom:1px solid #ececec;

    padding:24px 30px;

}

#searchModal .modal-body{

    padding:30px;

}


/* Dropdown */

.dropdown-menu{

    border:none;

    border-radius:18px;

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

    padding:12px 0;

}

.dropdown-item{

    padding:10px 22px;

    font-weight:500;

    transition:.25s;

}

.dropdown-item:hover{

    background:#fff5ea;

    color:var(--primary);

}


/*=====================================================================
  Continue...

  Part-7

  Hero Section

=====================================================================*/
/*=====================================================================
  Hero Section
=====================================================================*/

/* Hero */

.hero-section{

    position:relative;

    overflow:hidden;

    padding:120px 0 100px;

    background:linear-gradient(
        135deg,
        #fffdf8 0%,
        #fff6ea 45%,
        #ffffff 100%
    );

}


/* Decorative Shapes */

.hero-section::before{

    content:"";

    position:absolute;

    top:-180px;

    right:-180px;

    width:520px;

    height:520px;

    border-radius:50%;

    background:radial-gradient(
        rgba(245,124,0,.12),
        transparent 70%
    );

    pointer-events:none;

}

.hero-section::after{

    content:"";

    position:absolute;

    left:-120px;

    bottom:-120px;

    width:360px;

    height:360px;

    border-radius:50%;

    background:radial-gradient(
        rgba(255,193,7,.12),
        transparent 70%
    );

}


/* Content */

.hero-content{

    position:relative;

    z-index:2;

}

.hero-content .hero-badge{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:10px 22px;

    margin-bottom:25px;

    border-radius:50px;

    background:#fff;

    color:var(--primary);

    font-weight:700;

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

}

.hero-content h1{

    font-size:clamp(2.8rem,5vw,4.5rem);

    font-weight:800;

    line-height:1.15;

    margin-bottom:25px;

    color:#111827;

}

.hero-content h1 span{

    color:var(--primary);

}

.hero-content p{

    max-width:620px;

    margin-bottom:35px;

    font-size:1.1rem;

    line-height:1.9;

    color:#4b5563;

}


/* Hero Buttons */

.hero-buttons{

    display:flex;

    flex-wrap:wrap;

    gap:18px;

    margin-bottom:45px;

}


/* Hero Stats */

.hero-stats{

    display:flex;

    flex-wrap:wrap;

    gap:40px;

}

.hero-stat{

    display:flex;

    flex-direction:column;

}

.hero-stat h3{

    margin-bottom:6px;

    font-size:2rem;

    font-weight:800;

    color:var(--primary);

}

.hero-stat span{

    color:#6b7280;

    font-size:.95rem;

}


/* Hero Image */

.hero-image{

    position:relative;

    z-index:2;

    text-align:center;

}

.hero-image img{

    width:100%;

    max-width:560px;

    margin:auto;

    border-radius:28px;

    box-shadow:0 35px 90px rgba(0,0,0,.15);

    transition:.45s ease;

}

.hero-image img:hover{

    transform:translateY(-12px);

}


/* Floating Card */

.hero-card{

    position:absolute;

    background:#ffffff;

    border-radius:18px;

    padding:18px 22px;

    box-shadow:0 20px 55px rgba(0,0,0,.12);

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

}

.hero-card h5{

    margin:0 0 6px;

    font-size:1rem;

    font-weight:700;

}

.hero-card p{

    margin:0;

    font-size:.88rem;

    color:#6b7280;

}

.hero-card.card-left{

    left:-20px;

    top:12%;

}

.hero-card.card-right{

    right:-20px;

    bottom:12%;

}


/* Scroll Down */

.hero-scroll{

    position:absolute;

    left:50%;

    bottom:25px;

    transform:translateX(-50%);

    color:var(--primary);

    font-size:14px;

    font-weight:600;

}

.hero-scroll i{

    display:block;

    margin-top:8px;

    font-size:22px;

    animation:scrollDown 1.8s infinite;

}


/* Animations */

@keyframes heroFloat{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-12px);

    }

    100%{

        transform:translateY(0);

    }

}

@keyframes scrollDown{

    0%{

        transform:translateY(0);

        opacity:0;

    }

    50%{

        opacity:1;

    }

    100%{

        transform:translateY(12px);

        opacity:0;

    }

}


/*=====================================================================
  Continue...

  Part-8

  About Section

=====================================================================*/
/*=====================================================================
  About Section
=====================================================================*/

.about-section{

    position:relative;

    overflow:hidden;

    padding:110px 0;

    background:#ffffff;

}


/* Background Decoration */

.about-section::before{

    content:"";

    position:absolute;

    top:-140px;

    left:-140px;

    width:380px;

    height:380px;

    border-radius:50%;

    background:radial-gradient(
        rgba(245,124,0,.08),
        transparent 72%
    );

}

.about-section::after{

    content:"";

    position:absolute;

    right:-160px;

    bottom:-160px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(
        rgba(255,193,7,.08),
        transparent 72%
    );

}


/* Image Area */

.about-image{

    position:relative;

    z-index:2;

}

.about-image img{

    width:100%;

    border-radius:26px;

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

    transition:.45s ease;

}

.about-image img:hover{

    transform:translateY(-10px);

}


/* Experience Card */

.about-experience{

    position:absolute;

    left:-30px;

    bottom:40px;

    background:#ffffff;

    border-radius:20px;

    padding:22px 26px;

    min-width:210px;

    box-shadow:0 25px 60px rgba(0,0,0,.12);

}

.about-experience h2{

    margin:0;

    font-size:2.6rem;

    font-weight:800;

    color:var(--primary);

}

.about-experience p{

    margin:6px 0 0;

    color:#6b7280;

    font-weight:600;

}


/* Content */

.about-content{

    position:relative;

    z-index:2;

    padding-left:40px;

}

.about-content h2{

    margin-bottom:24px;

}

.about-content p{

    margin-bottom:22px;

    color:#4b5563;

    font-size:1.03rem;

    line-height:1.9;

}


/* Feature List */

.about-features{

    display:grid;

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

    gap:20px;

    margin:40px 0;

}

.about-feature{

    display:flex;

    align-items:flex-start;

    gap:15px;

}

.about-feature-icon{

    width:58px;

    height:58px;

    border-radius:16px;

    background:linear-gradient(
        135deg,
        #f57c00,
        #ff9800
    );

    display:flex;

    align-items:center;

    justify-content:center;

    color:#ffffff;

    font-size:24px;

    flex-shrink:0;

    box-shadow:0 15px 35px rgba(245,124,0,.30);

}

.about-feature-content h5{

    margin-bottom:8px;

    font-size:1.05rem;

    font-weight:700;

}

.about-feature-content p{

    margin:0;

    font-size:.94rem;

    line-height:1.7;

    color:#6b7280;

}


/* Author Counter */

.about-counter{

    display:flex;

    flex-wrap:wrap;

    gap:24px;

    margin-top:45px;

}

.counter-box{

    flex:1;

    min-width:160px;

    padding:26px;

    text-align:center;

    background:#ffffff;

    border:1px solid #ececec;

    border-radius:20px;

    transition:.35s ease;

    box-shadow:0 12px 30px rgba(0,0,0,.05);

}

.counter-box:hover{

    transform:translateY(-8px);

    border-color:rgba(245,124,0,.30);

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

}

.counter-box h3{

    margin-bottom:8px;

    font-size:2.2rem;

    font-weight:800;

    color:var(--primary);

}

.counter-box span{

    color:#6b7280;

    font-weight:600;

}


/*=====================================================================
  Continue...

  Part-9

  Why Choose Us

=====================================================================*/
/*=====================================================================
  Why Choose Us Section
=====================================================================*/

.why-section{

    position:relative;

    overflow:hidden;

    padding:110px 0;

    background:linear-gradient(
        180deg,
        #fffdf9 0%,
        #ffffff 100%
    );

}


/* Background Shape */

.why-section::before{

    content:"";

    position:absolute;

    top:-180px;

    right:-180px;

    width:500px;

    height:500px;

    border-radius:50%;

    background:radial-gradient(
        rgba(245,124,0,.08),
        transparent 70%
    );

}

.why-section::after{

    content:"";

    position:absolute;

    left:-120px;

    bottom:-120px;

    width:320px;

    height:320px;

    border-radius:50%;

    background:radial-gradient(
        rgba(255,193,7,.10),
        transparent 72%
    );

}


/* Grid */

.why-grid{

    display:grid;

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

    gap:30px;

}


/* Card */

.why-card{

    position:relative;

    overflow:hidden;

    padding:40px 32px;

    border-radius:24px;

    background:#ffffff;

    border:1px solid #ececec;

    transition:all .35s ease;

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

}

.why-card:hover{

    transform:translateY(-12px);

    border-color:rgba(245,124,0,.25);

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

}


/* Hover Effect */

.why-card::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:5px;

    background:linear-gradient(

        90deg,

        #f57c00,

        #ffb300

    );

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.why-card:hover::before{

    transform:scaleX(1);

}


/* Icon */

.why-icon{

    width:78px;

    height:78px;

    border-radius:22px;

    background:linear-gradient(

        135deg,

        #f57c00,

        #ff9800

    );

    display:flex;

    align-items:center;

    justify-content:center;

    color:#ffffff;

    font-size:32px;

    margin-bottom:28px;

    box-shadow:0 18px 40px rgba(245,124,0,.30);

}


/* Title */

.why-card h4{

    margin-bottom:16px;

    font-size:1.35rem;

    font-weight:700;

}


/* Description */

.why-card p{

    margin-bottom:0;

    color:#6b7280;

    line-height:1.9;

}


/* Number */

.why-number{

    position:absolute;

    top:18px;

    right:22px;

    font-size:58px;

    font-weight:800;

    color:rgba(245,124,0,.06);

}


/* Premium Badge */

.why-badge{

    display:inline-flex;

    align-items:center;

    gap:8px;

    margin-top:22px;

    color:var(--primary);

    font-size:.9rem;

    font-weight:600;

}

.why-badge i{

    font-size:18px;

}


/* Feature List */

.why-list{

    margin-top:20px;

}

.why-list li{

    display:flex;

    align-items:center;

    gap:12px;

    margin-bottom:12px;

    color:#4b5563;

}

.why-list li:last-child{

    margin-bottom:0;

}

.why-list i{

    width:28px;

    height:28px;

    border-radius:50%;

    background:#fff3e0;

    color:var(--primary);

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:14px;

}


/* CTA Box */

.why-cta{

    margin-top:70px;

    padding:45px;

    border-radius:30px;

    background:linear-gradient(

        135deg,

        #111827,

        #1f2937

    );

    text-align:center;

    color:#ffffff;

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

}

.why-cta h3{

    color:#ffffff;

    margin-bottom:18px;

    font-size:2rem;

}

.why-cta p{

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

    max-width:700px;

    margin:0 auto 30px;

}


/*=====================================================================
  Continue...

  Part-10

  Featured Books

=====================================================================*/
/*=====================================================================
  Featured Books Section
=====================================================================*/

.featured-books{

    position:relative;

    overflow:hidden;

    padding:120px 0;

    background:#ffffff;

}

.featured-books::before{

    content:"";

    position:absolute;

    top:-180px;

    left:-180px;

    width:520px;

    height:520px;

    border-radius:50%;

    background:radial-gradient(
        rgba(245,124,0,.07),
        transparent 72%
    );

    pointer-events:none;

}

.featured-books::after{

    content:"";

    position:absolute;

    right:-160px;

    bottom:-160px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(
        rgba(255,193,7,.08),
        transparent 72%
    );

    pointer-events:none;

}


/*=====================================================================
  Books Grid
=====================================================================*/

.books-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));

    gap:32px;

}


/*=====================================================================
  Book Card
=====================================================================*/

.book-card{

    position:relative;

    overflow:hidden;

    background:#ffffff;

    border-radius:26px;

    border:1px solid #ececec;

    transition:all .35s ease;

    box-shadow:0 15px 40px rgba(0,0,0,.05);

}

.book-card:hover{

    transform:translateY(-12px);

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

    border-color:rgba(245,124,0,.25);

}


/*=====================================================================
  Image
=====================================================================*/

.book-image{

    position:relative;

    overflow:hidden;

    background:#fafafa;

}

.book-image img{

    width:100%;

    aspect-ratio:4/5;

    object-fit:cover;

    transition:.45s ease;

}

.book-card:hover .book-image img{

    transform:scale(1.08);

}


/*=====================================================================
  Overlay
=====================================================================*/

.book-overlay{

    position:absolute;

    inset:0;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:12px;

    background:rgba(17,24,39,.65);

    opacity:0;

    transition:.35s ease;

}

.book-card:hover .book-overlay{

    opacity:1;

}

.book-overlay a{

    width:52px;

    height:52px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#ffffff;

    color:#111827;

    font-size:18px;

    transition:.3s ease;

}

.book-overlay a:hover{

    background:var(--primary);

    color:#ffffff;

}


/*=====================================================================
  Badges
=====================================================================*/

.book-badge{

    position:absolute;

    top:18px;

    left:18px;

    z-index:2;

    padding:8px 16px;

    border-radius:50px;

    background:linear-gradient(
        135deg,
        #f57c00,
        #ff9800
    );

    color:#ffffff;

    font-size:12px;

    font-weight:700;

    letter-spacing:.5px;

}

.book-discount{

    position:absolute;

    top:18px;

    right:18px;

    z-index:2;

    width:58px;

    height:58px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#111827;

    color:#ffffff;

    font-size:14px;

    font-weight:700;

}


/*=====================================================================
  Content
=====================================================================*/

.book-content{

    padding:28px;

}

.book-category{

    display:inline-block;

    margin-bottom:12px;

    color:var(--primary);

    font-size:13px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:1px;

}

.book-title{

    margin-bottom:12px;

    font-size:1.35rem;

    font-weight:700;

    line-height:1.45;

}

.book-title a{

    color:#111827;

}

.book-title a:hover{

    color:var(--primary);

}

.book-author{

    margin-bottom:18px;

    color:#6b7280;

    font-size:15px;

}


/*=====================================================================
  Rating
=====================================================================*/

.book-rating{

    display:flex;

    align-items:center;

    gap:4px;

    margin-bottom:20px;

}

.book-rating i{

    color:#ffb300;

    font-size:15px;

}

.book-rating span{

    margin-left:8px;

    color:#6b7280;

    font-size:14px;

}


/*=====================================================================
  Price
=====================================================================*/

.book-price{

    display:flex;

    align-items:center;

    gap:12px;

    margin-bottom:24px;

}

.book-price .sale{

    color:var(--primary);

    font-size:1.6rem;

    font-weight:800;

}

.book-price .mrp{

    color:#9ca3af;

    text-decoration:line-through;

    font-size:15px;

}


/*=====================================================================
  Footer
=====================================================================*/

.book-footer{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:15px;

}

.book-footer .btn{

    flex:1;

}

.book-meta{

    display:flex;

    align-items:center;

    gap:18px;

    margin-top:18px;

    padding-top:18px;

    border-top:1px solid #ececec;

    color:#6b7280;

    font-size:14px;

}

.book-meta span{

    display:flex;

    align-items:center;

    gap:8px;

}


/*=====================================================================
  View All
=====================================================================*/

.books-view-all{

    margin-top:70px;

    text-align:center;

}


/*=====================================================================
  Continue...

  Part-11

  Publishing Plans

=====================================================================*/

/*=====================================================================
  Publishing Plans Section
=====================================================================*/

.publishing-plans{

    position:relative;

    overflow:hidden;

    padding:120px 0;

    background:linear-gradient(
        180deg,
        #fffdf8 0%,
        #ffffff 100%
    );

}

.publishing-plans::before{

    content:"";

    position:absolute;

    top:-220px;

    right:-220px;

    width:520px;

    height:520px;

    border-radius:50%;

    background:radial-gradient(
        rgba(245,124,0,.08),
        transparent 72%
    );

}

.publishing-plans::after{

    content:"";

    position:absolute;

    left:-180px;

    bottom:-180px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(
        rgba(255,193,7,.08),
        transparent 72%
    );

}


/*=====================================================================
  Plans Grid
=====================================================================*/

.plans-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));

    gap:35px;

    align-items:stretch;

}


/*=====================================================================
  Plan Card
=====================================================================*/

.plan-card{

    position:relative;

    overflow:hidden;

    background:#ffffff;

    border:1px solid #ececec;

    border-radius:30px;

    padding:45px 35px;

    transition:all .35s ease;

    box-shadow:0 18px 50px rgba(0,0,0,.06);

}

.plan-card:hover{

    transform:translateY(-14px);

    border-color:rgba(245,124,0,.30);

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

}


/* Featured Plan */

.plan-card.featured{

    background:linear-gradient(
        135deg,
        #f57c00,
        #ff9800
    );

    color:#ffffff;

    border:none;

    transform:scale(1.03);

}

.plan-card.featured:hover{

    transform:scale(1.03) translateY(-14px);

}

.plan-card.featured h3,

.plan-card.featured h4,

.plan-card.featured p,

.plan-card.featured li,

.plan-card.featured span{

    color:#ffffff;

}


/*=====================================================================
  Badge
=====================================================================*/

.plan-badge{

    position:absolute;

    top:22px;

    right:22px;

    padding:8px 18px;

    border-radius:50px;

    background:#111827;

    color:#ffffff;

    font-size:12px;

    font-weight:700;

    letter-spacing:.5px;

}

.plan-card.featured .plan-badge{

    background:#ffffff;

    color:var(--primary);

}


/*=====================================================================
  Header
=====================================================================*/

.plan-header{

    text-align:center;

    margin-bottom:35px;

}

.plan-header h3{

    font-size:2rem;

    font-weight:800;

    margin-bottom:12px;

}

.plan-header p{

    color:#6b7280;

    margin-bottom:0;

}

.plan-card.featured .plan-header p{

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

}


/*=====================================================================
  Price
=====================================================================*/

.plan-price{

    text-align:center;

    margin-bottom:35px;

}

.plan-price h2{

    font-size:3.4rem;

    font-weight:800;

    line-height:1;

    color:var(--primary);

}

.plan-price h2 span{

    font-size:1rem;

    font-weight:600;

    color:#6b7280;

}

.plan-card.featured .plan-price h2,

.plan-card.featured .plan-price h2 span{

    color:#ffffff;

}


/*=====================================================================
  Delivery
=====================================================================*/

.plan-delivery{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    margin-bottom:35px;

    font-weight:600;

    color:#4b5563;

}

.plan-delivery i{

    color:var(--primary);

}

.plan-card.featured .plan-delivery,

.plan-card.featured .plan-delivery i{

    color:#ffffff;

}


/*=====================================================================
  Features
=====================================================================*/

.plan-features{

    margin-bottom:40px;

}

.plan-features li{

    display:flex;

    align-items:flex-start;

    gap:14px;

    margin-bottom:16px;

    color:#4b5563;

    line-height:1.8;

}

.plan-features li:last-child{

    margin-bottom:0;

}

.plan-features i{

    width:28px;

    height:28px;

    flex-shrink:0;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#fff5ea;

    color:var(--primary);

    font-size:14px;

}

.plan-card.featured .plan-features i{

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

    color:#ffffff;

}


/*=====================================================================
  Footer
=====================================================================*/

.plan-footer{

    text-align:center;

}

.plan-footer .btn{

    width:100%;

}

.plan-card.featured .btn{

    background:#ffffff;

    color:var(--primary);

    border:none;

}

.plan-card.featured .btn:hover{

    background:#111827;

    color:#ffffff;

}


/*=====================================================================
  Continue...

  Part-12

  CTA Section

=====================================================================*/
/*=====================================================================
  CTA Section
=====================================================================*/

.cta-section{

    position:relative;

    overflow:hidden;

    padding:120px 0;

    background:linear-gradient(
        135deg,
        #111827 0%,
        #1f2937 100%
    );

}


/* Decorative Elements */

.cta-section::before{

    content:"";

    position:absolute;

    top:-220px;

    right:-180px;

    width:520px;

    height:520px;

    border-radius:50%;

    background:radial-gradient(
        rgba(255,255,255,.08),
        transparent 72%
    );

}

.cta-section::after{

    content:"";

    position:absolute;

    left:-160px;

    bottom:-180px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(
        rgba(245,124,0,.20),
        transparent 72%
    );

}


/* CTA Box */

.cta-box{

    position:relative;

    z-index:2;

    padding:80px 70px;

    border-radius:36px;

    overflow:hidden;

    text-align:center;

    background:linear-gradient(
        135deg,
        #f57c00,
        #ff9800
    );

    box-shadow:0 35px 90px rgba(0,0,0,.25);

}

.cta-box::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
        135deg,
        rgba(255,255,255,.12),
        transparent
    );

}


/* Badge */

.cta-badge{

    display:inline-flex;

    align-items:center;

    gap:10px;

    margin-bottom:25px;

    padding:10px 24px;

    border-radius:50px;

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

    backdrop-filter:blur(12px);

    color:#ffffff;

    font-size:14px;

    font-weight:700;

    letter-spacing:.8px;

    text-transform:uppercase;

}


/* Heading */

.cta-box h2{

    position:relative;

    color:#ffffff;

    font-size:clamp(2.4rem,5vw,4rem);

    font-weight:800;

    line-height:1.2;

    margin-bottom:24px;

}


/* Description */

.cta-box p{

    position:relative;

    max-width:760px;

    margin:0 auto 45px;

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

    font-size:1.12rem;

    line-height:1.9;

}


/* Buttons */

.cta-buttons{

    position:relative;

    display:flex;

    justify-content:center;

    align-items:center;

    flex-wrap:wrap;

    gap:20px;

}

.cta-buttons .btn{

    min-width:220px;

}


/* Primary Button */

.cta-buttons .btn-primary{

    background:#ffffff;

    color:var(--primary);

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

}

.cta-buttons .btn-primary:hover{

    background:#111827;

    color:#ffffff;

}


/* Outline Button */

.cta-buttons .btn-outline-light{

    color:#ffffff;

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

    background:transparent;

}

.cta-buttons .btn-outline-light:hover{

    background:#ffffff;

    color:#111827;

    border-color:#ffffff;

}


/* Statistics */

.cta-stats{

    position:relative;

    display:flex;

    justify-content:center;

    flex-wrap:wrap;

    gap:60px;

    margin-top:60px;

}

.cta-stat{

    text-align:center;

}

.cta-stat h3{

    margin-bottom:8px;

    color:#ffffff;

    font-size:2.5rem;

    font-weight:800;

}

.cta-stat span{

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

    font-size:15px;

}


/* Floating Glow */

.cta-glow{

    position:absolute;

    top:50%;

    left:50%;

    width:650px;

    height:650px;

    border-radius:50%;

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

    background:radial-gradient(
        rgba(255,255,255,.12),
        transparent 70%
    );

    pointer-events:none;

}


/*=====================================================================
  Continue...

  Part-13

  Footer

=====================================================================*/
/*=====================================================================
  Footer
=====================================================================*/

.footer-section{

    position:relative;

    overflow:hidden;

    color:#d1d5db;

    background:linear-gradient(
        135deg,
        #0f172a 0%,
        #111827 50%,
        #1f2937 100%
    );

}


/* Decorative Background */

.footer-section::before{

    content:"";

    position:absolute;

    top:-220px;

    right:-220px;

    width:520px;

    height:520px;

    border-radius:50%;

    background:radial-gradient(
        rgba(245,124,0,.08),
        transparent 72%
    );

}

.footer-section::after{

    content:"";

    position:absolute;

    left:-180px;

    bottom:-180px;

    width:420px;

    height:420px;

    border-radius:50%;

    background:radial-gradient(
        rgba(255,193,7,.08),
        transparent 72%
    );

}


/* Footer Top */

.footer-top{

    position:relative;

    z-index:2;

    padding:90px 0 60px;

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

}


/* Logo */

.footer-logo img{

    max-height:68px;

}


/* Description */

.footer-description{

    margin-top:25px;

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

    line-height:1.9;

    font-size:15px;

}


/* Title */

.footer-title{

    position:relative;

    margin-bottom:28px;

    padding-bottom:16px;

    color:#ffffff;

    font-size:1.35rem;

    font-weight:700;

}

.footer-title::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:70px;

    height:4px;

    border-radius:50px;

    background:linear-gradient(
        90deg,
        #f57c00,
        #ff9800
    );

}


/* Links */

.footer-links li{

    margin-bottom:14px;

}

.footer-links li:last-child{

    margin-bottom:0;

}

.footer-links a{

    position:relative;

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

    transition:all .30s ease;

}




.footer-links a::before{

    content:"›";

    margin-right:10px;

    color:var(--primary);

    opacity:0;

    transition:.30s;

}

.footer-links a:hover{

    color:#ffffff;

    padding-left:8px;

}

.footer-links a:hover::before{

    opacity:1;

}


/* Contact */

.footer-contact li{

    display:flex;

    align-items:flex-start;

    gap:15px;

    margin-bottom:20px;

}

.footer-contact i{

    width:46px;

    height:46px;

    border-radius:14px;

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

    display:flex;

    align-items:center;

    justify-content:center;

    color:var(--primary);

    font-size:18px;

}

.footer-contact span,

.footer-contact a{

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

    line-height:1.8;

}

.footer-contact a:hover{

    color:#ffffff;

}


/* Social */

.footer-social{

    display:flex;

    align-items:center;

    gap:14px;

    margin-top:28px;

}

.footer-social a{

    width:48px;

    height:48px;

    border-radius:16px;

    display:flex;

    align-items:center;

    justify-content:center;

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

    color:#ffffff;

    font-size:18px;

    transition:all .35s ease;

}

.footer-social a:hover{

    background:linear-gradient(
        135deg,
        #f57c00,
        #ff9800
    );

    transform:translateY(-6px) rotate(6deg);

}


/* Newsletter */

.footer-newsletter{

    margin-top:20px;

}

.footer-newsletter .form-control{

    height:58px;

    border:none;

    border-radius:50px;

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

    color:#ffffff;

    padding:0 22px;

}

.footer-newsletter .form-control::placeholder{

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

}

.footer-newsletter .form-control:focus{

    background:#ffffff;

    color:#111827;

}

.footer-newsletter .btn{

    border-radius:50px;

    padding:0 28px;

}


/* Footer Bottom */

.footer-bottom{

    position:relative;

    z-index:2;

    padding:28px 0;

}

.footer-bottom p{

    margin:0;

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

}

.footer-bottom-links{

    display:flex;

    justify-content:flex-end;

    align-items:center;

    gap:16px;

}

.footer-bottom-links a{

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

    transition:.30s;

}

.footer-bottom-links a:hover{

    color:#ffffff;

}

.footer-bottom-links span{

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

}


/* Copyright */

.copyright{

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

    font-size:14px;

}


/*=====================================================================
  Continue...

  Part-14

  Utility Classes

=====================================================================*/
/*=====================================================================
  Utility Classes
=====================================================================*/

/* Spacing */

.mt-10{margin-top:10px!important;}
.mt-20{margin-top:20px!important;}
.mt-30{margin-top:30px!important;}
.mt-40{margin-top:40px!important;}
.mt-50{margin-top:50px!important;}
.mt-60{margin-top:60px!important;}
.mt-80{margin-top:80px!important;}
.mt-100{margin-top:100px!important;}

.mb-10{margin-bottom:10px!important;}
.mb-20{margin-bottom:20px!important;}
.mb-30{margin-bottom:30px!important;}
.mb-40{margin-bottom:40px!important;}
.mb-50{margin-bottom:50px!important;}
.mb-60{margin-bottom:60px!important;}
.mb-80{margin-bottom:80px!important;}
.mb-100{margin-bottom:100px!important;}

.pt-80{padding-top:80px!important;}
.pb-80{padding-bottom:80px!important;}
.py-100{

    padding-top:100px!important;

    padding-bottom:100px!important;

}


/* Display */

.d-flex-center{

    display:flex;

    align-items:center;

    justify-content:center;

}

.d-grid-center{

    display:grid;

    place-items:center;

}


/* Width */

.w-fit{

    width:fit-content;

}

.w-100{

    width:100%;

}


/* Height */

.h-100{

    height:100%;

}


/* Radius */

.radius-sm{

    border-radius:10px;

}

.radius{

    border-radius:18px;

}

.radius-lg{

    border-radius:28px;

}

.radius-xl{

    border-radius:40px;

}

.round-circle{

    border-radius:50%;

}


/* Overflow */

.overflow-hidden{

    overflow:hidden;

}


/* Position */

.position-relative{

    position:relative;

}

.position-absolute{

    position:absolute;

}


/* Object */

.object-cover{

    object-fit:cover;

}

.object-contain{

    object-fit:contain;

}


/* Shadow */

.shadow-sm{

    box-shadow:0 10px 25px rgba(0,0,0,.06)!important;

}

.shadow{

    box-shadow:0 20px 55px rgba(0,0,0,.08)!important;

}

.shadow-lg{

    box-shadow:0 35px 90px rgba(0,0,0,.14)!important;

}

.shadow-none{

    box-shadow:none!important;

}


/* Border */

.border-light{

    border:1px solid #ececec!important;

}

.border-0{

    border:none!important;

}


/* Background */

.bg-white{

    background:#ffffff!important;

}

.bg-dark{

    background:#111827!important;

}

.bg-gradient-primary{

    background:linear-gradient(
        135deg,
        #f57c00,
        #ff9800
    )!important;

}


/* Text */

.text-white{

    color:#ffffff!important;

}

.text-dark{

    color:#111827!important;

}

.text-gray{

    color:#6b7280!important;

}

.text-center{

    text-align:center!important;

}

.text-start{

    text-align:left!important;

}

.text-end{

    text-align:right!important;

}


/* Font */

.fw-400{

    font-weight:400!important;

}

.fw-500{

    font-weight:500!important;

}

.fw-600{

    font-weight:600!important;

}

.fw-700{

    font-weight:700!important;

}

.fw-800{

    font-weight:800!important;

}


/* Transition */

.transition{

    transition:all .35s ease;

}


/* Hover Lift */

.hover-lift{

    transition:all .35s ease;

}

.hover-lift:hover{

    transform:translateY(-10px);

}


/* Glass */

.glass{

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

    backdrop-filter:blur(20px);

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

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

}


/* Cursor */

.cursor-pointer{

    cursor:pointer;

}


/* User Select */

.user-select-none{

    user-select:none;

}


/* Z-index */

.z-1{

    z-index:1;

}

.z-10{

    z-index:10;

}

.z-100{

    z-index:100;

}


/*=====================================================================
  Continue...

  Part-15

  Animations
=====================================================================*/
/*=====================================================================
  Animations
=====================================================================*/

/* Fade Up */

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(60px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

.fade-up{

    animation:fadeUp .8s ease forwards;

}


/* Fade Down */

@keyframes fadeDown{

    from{

        opacity:0;

        transform:translateY(-60px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

.fade-down{

    animation:fadeDown .8s ease forwards;

}


/* Fade Left */

@keyframes fadeLeft{

    from{

        opacity:0;

        transform:translateX(-60px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

.fade-left{

    animation:fadeLeft .8s ease forwards;

}


/* Fade Right */

@keyframes fadeRight{

    from{

        opacity:0;

        transform:translateX(60px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

.fade-right{

    animation:fadeRight .8s ease forwards;

}


/* Zoom In */

@keyframes zoomIn{

    from{

        opacity:0;

        transform:scale(.8);

    }

    to{

        opacity:1;

        transform:scale(1);

    }

}

.zoom-in{

    animation:zoomIn .7s ease forwards;

}


/* Floating */

@keyframes floating{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-12px);

    }

    100%{

        transform:translateY(0);

    }

}

.floating{

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

}


/* Pulse */

@keyframes pulse{

    0%{

        transform:scale(1);

    }

    50%{

        transform:scale(1.05);

    }

    100%{

        transform:scale(1);

    }

}

.pulse{

    animation:pulse 2s infinite ease-in-out;

}


/* Rotate */

@keyframes rotate360{

    from{

        transform:rotate(0deg);

    }

    to{

        transform:rotate(360deg);

    }

}

.rotate{

    animation:rotate360 10s linear infinite;

}


/* Shine */

@keyframes shine{

    0%{

        left:-120%;

    }

    100%{

        left:120%;

    }

}

.shine{

    position:relative;

    overflow:hidden;

}

.shine::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:45%;

    height:100%;

    background:linear-gradient(

        90deg,

        transparent,

        rgba(255,255,255,.45),

        transparent

    );

    transform:skewX(-20deg);

}

.shine:hover::before{

    animation:shine .9s linear;

}


/* Ripple */

@keyframes ripple{

    from{

        transform:scale(.2);

        opacity:.5;

    }

    to{

        transform:scale(2.5);

        opacity:0;

    }

}

.ripple{

    position:relative;

    overflow:hidden;

}

.ripple::after{

    content:"";

    position:absolute;

    width:18px;

    height:18px;

    border-radius:50%;

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

    transform:scale(0);

    opacity:0;

}

.ripple:active::after{

    animation:ripple .6s ease-out;

}


/* Scroll Reveal */

.reveal{

    opacity:0;

    visibility:hidden;

    transform:translateY(40px);

    transition:all .8s ease;

}

.reveal.active{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}


/* Smooth Hover */

.hover-scale{

    transition:transform .35s ease;

}

.hover-scale:hover{

    transform:scale(1.05);

}


/* Image Zoom */

.img-hover{

    overflow:hidden;

}

.img-hover img{

    transition:transform .5s ease;

}

.img-hover:hover img{

    transform:scale(1.12);

}


/* Gradient Animation */

@keyframes gradientMove{

    0%{

        background-position:0% 50%;

    }

    50%{

        background-position:100% 50%;

    }

    100%{

        background-position:0% 50%;

    }

}

.gradient-animation{

    background-size:300% 300%;

    animation:gradientMove 8s ease infinite;

}


/* Loader */

@keyframes spin{

    from{

        transform:rotate(0deg);

    }

    to{

        transform:rotate(360deg);

    }

}

.loader{

    width:48px;

    height:48px;

    border:4px solid rgba(245,124,0,.18);

    border-top:4px solid var(--primary);

    border-radius:50%;

    animation:spin .9s linear infinite;

}


/*=====================================================================
  Continue...

  Part-16

  Responsive Media Queries & End Of File

=====================================================================*/
/*=====================================================================
  Responsive Media Queries
=====================================================================*/

/*==========================
  Large Devices
==========================*/

@media (max-width:1399.98px){

    .container{

        max-width:1140px;

    }

}


/*==========================
  Laptop
==========================*/

@media (max-width:1199.98px){

    section{

        padding:90px 0;

    }

    .hero-content h1{

        font-size:3.5rem;

    }

    .section-title h2{

        font-size:2.8rem;

    }

    .about-content{

        padding-left:0;

        margin-top:50px;

    }

    .plans-grid{

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

    }

}


/*==========================
  Tablet
==========================*/

@media (max-width:991.98px){

    section{

        padding:80px 0;

    }

    .hero-section{

        text-align:center;

    }

    .hero-buttons{

        justify-content:center;

    }

    .hero-stats{

        justify-content:center;

    }

    .hero-image{

        margin-top:60px;

    }

    .about-features{

        grid-template-columns:1fr;

    }

    .why-grid{

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

    }

    .books-grid{

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

    }

    .plans-grid{

        grid-template-columns:1fr;

    }

    .footer-top{

        text-align:center;

    }

    .footer-title::after{

        left:50%;

        transform:translateX(-50%);

    }

    .footer-social{

        justify-content:center;

    }

    .footer-contact li{

        justify-content:center;

    }

}


/*==========================
  Mobile
==========================*/

@media (max-width:767.98px){

    html{

        font-size:15px;

    }

    section{

        padding:70px 0;

    }

    h1{

        font-size:2.4rem;

    }

    h2{

        font-size:2rem;

    }

    .section-title{

        margin-bottom:45px;

    }

    .hero-content h1{

        font-size:2.5rem;

    }

    .hero-buttons{

        flex-direction:column;

    }

    .hero-buttons .btn{

        width:100%;

    }

    .hero-card{

        display:none;

    }

    .about-counter{

        flex-direction:column;

    }

    .why-grid{

        grid-template-columns:1fr;

    }

    .books-grid{

        grid-template-columns:1fr;

    }

    .book-footer{

        flex-direction:column;

    }

    .book-footer .btn{

        width:100%;

    }

    .cta-box{

        padding:50px 30px;

    }

    .cta-buttons{

        flex-direction:column;

    }

    .cta-buttons .btn{

        width:100%;

    }

    .cta-stats{

        gap:30px;

    }

    .footer-bottom-links{

        justify-content:center;

        flex-wrap:wrap;

        margin-top:15px;

    }

}


/*==========================
  Small Mobile
==========================*/

@media (max-width:575.98px){

    .container{

        padding-left:18px;

        padding-right:18px;

    }

    .navbar-brand img{

        max-height:48px;

    }

    .section-title h2{

        font-size:1.8rem;

    }

    .hero-content p{

        font-size:1rem;

    }

    .plan-card{

        padding:35px 25px;

    }

    .book-content{

        padding:22px;

    }

    .footer-top{

        padding:70px 0 40px;

    }

}


/*=====================================================================
  Smooth Scrolling Helpers
=====================================================================*/

html{

    scroll-padding-top:100px;

}

body.loaded #preloader{

    opacity:0;

    visibility:hidden;

    transition:.35s ease;

}


/*=====================================================================
  End Of File

  File  : assets/css/style.css

  Swarnim Sahitya CMS

  Modules Included

  ✔ CSS Variables
  ✔ Reset
  ✔ Typography
  ✔ Buttons
  ✔ Forms
  ✔ Header
  ✔ Navbar
  ✔ Hero
  ✔ About
  ✔ Why Choose Us
  ✔ Featured Books
  ✔ Publishing Plans
  ✔ CTA
  ✔ Footer
  ✔ Utility Classes
  ✔ Premium Animations
  ✔ Fully Responsive

=====================================================================*/

/*=====================================================================*/
/*=====================================================================*/
/*=======================Slider Slider==============================================*/
/*=====================================================================*/
/*=====================================================================*/


/*=====================================================================
  Swarnim Sahitya Hero Slider
  (Independent CSS - No Conflict)
=====================================================================*/

.ss-hero-section{
    position:relative;
    overflow:hidden;
    background:#0f172a;
}

.ss-hero-section .carousel,
.ss-hero-section .carousel-inner,
.ss-hero-section .carousel-item{
    position:relative;
    width:100%;
    min-height:70vh;
}

.ss-hero-section .carousel-item{
    transition:transform .6s ease-in-out;
}

.ss-hero-slide{
    position:relative;
    width:100%;
    min-height:70vh;

    display:flex;
    align-items:center;

    overflow:hidden;

    background-size:auto;
    background-position:center center;
    background-repeat:no-repeat;
}

.ss-hero-overlay{
    position:absolute;
    inset:0;
    background: linear-gradient(
    to right,
    rgba(0, 0, 0, 0.90) 0%,
    rgba(0, 0, 0, 0.75) 30%,
    rgba(0, 0, 0, 0.45) 50%,
    rgba(0, 0, 0, 0.15) 70%,
    rgba(0, 0, 0, 0) 100%
);
    z-index:1;
}

.ss-hero-slide .container{
    position:relative;
    z-index:5;
}

.ss-hero-content{
    color:#fff;
    max-width:650px;
}

.ss-hero-badge{
    display:inline-block;

    padding:8px 18px;

    border-radius:50px;

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

    color:#FFD54F;

    font-size:14px;

    font-weight:600;

    letter-spacing:.5px;

    margin-bottom:22px;

    backdrop-filter:blur(12px);
}

.ss-hero-title{
    margin:0 0 25px;

    font-size:62px;

    line-height:1.12;

    font-weight:800;

    color:#fff;
}

.ss-hero-subtitle{
    margin:0 0 35px;

    font-size:20px;

    line-height:1.8;

    color:#f5f5f5;
}

.ss-hero-buttons{
    display:flex;

    flex-wrap:wrap;

    gap:18px;
}

.ss-btn-primary{
    padding:15px 34px;

    border-radius:50px;

    font-weight:700;
}

.ss-btn-outline{
    padding:15px 34px;

    border-radius:50px;

    border:2px solid #fff;

    font-weight:700;
}

.ss-btn-outline:hover{
    background:#fff;
    color:#111827;
}

.ss-hero-image{
    position:relative;

    display:flex;

    justify-content:center;

    align-items:center;
}

.ss-hero-image img{
    width:100%;

    max-width:520px;

    display:block;

    border-radius:20px;

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

    animation:ssHeroFloat 5s ease-in-out infinite;
}

@keyframes ssHeroFloat{

    0%{
        transform:translateY(0);
    }

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

    100%{
        transform:translateY(0);
    }

}

/*====================================================
  Controls
====================================================*/

.ss-hero-prev,
.ss-hero-next{
    width:70px;

    opacity:1;

    z-index:20;
}

.ss-hero-arrow{
    width:56px;
    height:56px;

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

    background:#ffffff;

    border-radius:50%;

    color:#111827;

    font-size:20px;

    font-weight:700;

    transition:.3s;

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

.ss-hero-arrow i{
    display:block;
    line-height:1;
}

.ss-hero-prev:hover .ss-hero-arrow,
.ss-hero-next:hover .ss-hero-arrow{

    background:#f59e0b;

    color:#fff;

    transform:scale(1.08);

}

/*====================================================
  Indicators
====================================================*/

.ss-hero-indicators{
    bottom:30px;
    z-index:20;
}

.ss-hero-indicators button{

    width:14px;

    height:14px;

    border-radius:50%;

    margin:0 6px;

    border:none;

    background:#ffffff;

    opacity:.45;

    transition:.35s;
}

.ss-hero-indicators .active{

    width:38px;

    border-radius:30px;

    opacity:1;

    background:#f59e0b;

}

/*====================================================
  Responsive
====================================================*/

@media(max-width:1199px){

    .ss-hero-title{

        font-size:52px;

    }

}

@media(max-width:991px){

    .ss-hero-slide{

        padding:120px 0 70px;

        text-align:center;

    }

    .ss-hero-title{

        font-size:42px;

    }

    .ss-hero-subtitle{

        font-size:18px;

    }

    .ss-hero-buttons{

        justify-content:center;

    }

    .ss-hero-image{

        margin-top:50px;

    }

}

@media(max-width:767px){

    .ss-hero-title{

        font-size:34px;

    }

    .ss-hero-subtitle{

        font-size:16px;

    }

    .ss-btn-primary,
    .ss-btn-outline{

        width:100%;

    }

    .ss-hero-prev,
    .ss-hero-next{

        display:none;

    }

}

/*====================================================
Hero Animation
====================================================*/

.ss-hero-title,
.ss-hero-subtitle,
.ss-hero-buttons,
.ss-hero-image{
    opacity:0;
    transform:translateY(40px);
}

.ss-hero-title.ss-animate,
.ss-hero-subtitle.ss-animate,
.ss-hero-buttons.ss-animate,
.ss-hero-image.ss-animate{
    opacity:1;
    transform:translateY(0);
    transition:all .8s ease;
}

#hero{
    padding:0px 0px !important;
}

/*=====================================================================*/
/*=====================================================================*/
/*=======================End Slider Slider==============================================*/
/*=====================================================================*/
/*=====================================================================*/


.about-image-wrapper.reveal{
    opacity:unset!important;
    visibility: visible!important;
}




/* --------------------index page beautify secction start------------------------------------- */
/* --------------------index page beautify secction start------------------------------------- */
/* --------------------index page beautify secction start------------------------------------- */
/* --------------------index page beautify secction start------------------------------------- */

/*==============================================================
  HOMEPAGE PREMIUM LAYOUT
  STEP-1
  (Safe - Homepage Only)
==============================================================*/

.homepage-wrapper{
    position:relative;
    overflow:hidden;
    background:#fff;
}

/* ---------- Section Spacing ---------- */

.homepage-wrapper .section-padding{
    padding:110px 0;
}

@media (max-width:991px){

    .homepage-wrapper .section-padding{
        padding:80px 0;
    }

}

@media (max-width:767px){

    .homepage-wrapper .section-padding{
        padding:60px 0;
    }

}

/* ---------- Container ---------- */

.homepage-wrapper .container{

    max-width:1320px;

}

/* ---------- Section Badge ---------- */

.homepage-wrapper .section-badge{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:8px 18px;

    border-radius:50px;

    background:#fff6ef;

    color:#ff7a00;

    font-size:14px;

    font-weight:600;

    margin-bottom:18px;

}

/* ---------- Heading ---------- */

.homepage-wrapper .section-title{

    font-size:54px;

    line-height:1.15;

    font-weight:800;

    color:#0f172a;

    margin-bottom:22px;

}

.homepage-wrapper .section-subtitle{

    max-width:760px;

    margin:auto;

    color:#64748b;

    font-size:18px;

    line-height:1.8;

}

/* ---------- Responsive ---------- */

@media(max-width:992px){

.homepage-wrapper .section-title{

font-size:42px;

}

}

@media(max-width:767px){

.homepage-wrapper .section-title{

font-size:34px;

}

.homepage-wrapper .section-subtitle{

font-size:16px;

}

}

/* ---------- Cards ---------- */

.homepage-wrapper .card,

.homepage-wrapper .book-card,

.homepage-wrapper .plan-card,

.homepage-wrapper .testimonial-card,

.homepage-wrapper .why-card{

    border:none;

    border-radius:22px;

    background:#ffffff;

    box-shadow:

    0 12px 45px rgba(15,23,42,.06);

    transition:.35s ease;

}

.homepage-wrapper .card:hover,

.homepage-wrapper .book-card:hover,

.homepage-wrapper .plan-card:hover,

.homepage-wrapper .testimonial-card:hover,

.homepage-wrapper .why-card:hover{

    transform:translateY(-8px);

    box-shadow:

    0 24px 70px rgba(15,23,42,.10);

}

/* ---------- Images ---------- */

.homepage-wrapper img{

    max-width:100%;

    height:auto;

    display:block;

}

/* ---------- Buttons ---------- */

.homepage-wrapper .btn{

    border-radius:50px;

    font-weight:600;

    transition:.30s;

}

.homepage-wrapper .btn-primary{

    background:#ff8300;

    border-color:#ff8300;

}

.homepage-wrapper .btn-primary:hover{

    background:#f17300;

    border-color:#f17300;

}

.homepage-wrapper .btn-outline-primary{

    border:2px solid #ff8300;

    color:#ff8300;

}

.homepage-wrapper .btn-outline-primary:hover{

    background:#ff8300;

    color:#fff;

}



/*==============================================================
  HOMEPAGE PREMIUM LAYOUT
  STEP-1
  (Safe - Homepage Only)
==============================================================*/

.homepage-wrapper{
    position:relative;
    overflow:hidden;
    background:#fff;
}

/* ---------- Section Spacing ---------- */

.homepage-wrapper .section-padding{
    padding:110px 0;
}

@media (max-width:991px){

    .homepage-wrapper .section-padding{
        padding:80px 0;
    }

}

@media (max-width:767px){

    .homepage-wrapper .section-padding{
        padding:60px 0;
    }

}

/* ---------- Container ---------- */

.homepage-wrapper .container{

    max-width:1320px;

}

/* ---------- Section Badge ---------- */

.homepage-wrapper .section-badge{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:8px 18px;

    border-radius:50px;

    background:#fff6ef;

    color:#ff7a00;

    font-size:14px;

    font-weight:600;

    margin-bottom:18px;

}

/* ---------- Heading ---------- */

.homepage-wrapper .section-title{

    font-size:54px;

    line-height:1.15;

    font-weight:800;

    color:#0f172a;

    margin-bottom:22px;

}

.homepage-wrapper .section-subtitle{

    max-width:760px;

    margin:auto;

    color:#64748b;

    font-size:18px;

    line-height:1.8;

}

/* ---------- Responsive ---------- */

@media(max-width:992px){

.homepage-wrapper .section-title{

font-size:42px;

}

}

@media(max-width:767px){

.homepage-wrapper .section-title{

font-size:34px;

}

.homepage-wrapper .section-subtitle{

font-size:16px;

}

}

/* ---------- Cards ---------- */

.homepage-wrapper .card,

.homepage-wrapper .book-card,

.homepage-wrapper .plan-card,

.homepage-wrapper .testimonial-card,

.homepage-wrapper .why-card{

    border:none;

    border-radius:22px;

    background:#ffffff;

    box-shadow:

    0 12px 45px rgba(15,23,42,.06);

    transition:.35s ease;

}

.homepage-wrapper .card:hover,

.homepage-wrapper .book-card:hover,

.homepage-wrapper .plan-card:hover,

.homepage-wrapper .testimonial-card:hover,

.homepage-wrapper .why-card:hover{

    transform:translateY(-8px);

    box-shadow:

    0 24px 70px rgba(15,23,42,.10);

}

/* ---------- Images ---------- */

.homepage-wrapper img{

    max-width:100%;

    height:auto;

    display:block;

}

/* ---------- Buttons ---------- */

.homepage-wrapper .btn{

    border-radius:50px;

    font-weight:600;

    transition:.30s;

}

.homepage-wrapper .btn-primary{

   background:linear-gradient(135deg,#ff9d00 0%,#ff7a18 45%,#ff5e62 100%);

    border-color:#ff8300;

}

.homepage-wrapper .btn-primary:hover{

     background:linear-gradient(135deg,#ff5e62 0%,#ff7a18 45%,#ff9d00 100%);

    border-color:#f17300;

}

.homepage-wrapper .btn-outline-primary{

    border:2px solid #ff8300;

    color:#ff8300;

}

.homepage-wrapper .btn-outline-primary:hover{

    background:#ff8300;

    color:#fff;

}

/*==============================================================
  TESTIMONIALS
  STEP-3
==============================================================*/

.homepage-wrapper .testimonials-section{

    position:relative;

    overflow:hidden;

}

.homepage-wrapper .testimonialSwiper{

    padding:20px 5px 70px;

}

.homepage-wrapper .testimonial-card{

    position:relative;

    height:100%;

    background:#fff;

    border-radius:24px;

    padding:32px;

    display:flex;

    flex-direction:column;

}

.homepage-wrapper .testimonial-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-bottom:25px;

}

.homepage-wrapper .testimonial-author{

    display:flex;

    align-items:center;

    gap:16px;

}

.homepage-wrapper .testimonial-avatar{

    width:78px;

    height:78px;

    border-radius:50%;

    object-fit:cover;

    border:4px solid #fff;

    box-shadow:0 8px 25px rgba(0,0,0,.12);

    flex-shrink:0;

}

.homepage-wrapper .testimonial-author h5{

    margin:0;

    font-size:21px;

    font-weight:700;

    color:#111827;

}

.homepage-wrapper .testimonial-author span{

    color:#64748b;

    font-size:15px;

}

.homepage-wrapper .testimonial-rating{

    display:flex;

    gap:4px;

}

.homepage-wrapper .testimonial-rating i{

    color:#ff9800;

    font-size:17px;

}

.homepage-wrapper .testimonial-body{

    position:relative;

    flex:1;

}

.homepage-wrapper .quote-icon{

    font-size:42px;

    color:#ff8a00;

    opacity:.15;

    margin-bottom:12px;

}

.homepage-wrapper .testimonial-body p{

    margin:0;

    color:#475569;

    line-height:1.9;

    font-size:16px;

}

/* ---------- Hover ---------- */

.homepage-wrapper .testimonial-card:hover{

    transform:translateY(-10px);

}

/* ---------- Pagination ---------- */

.homepage-wrapper .swiper-pagination-bullet{

    width:10px;

    height:10px;

    opacity:1;

    background:#d1d5db;

}

.homepage-wrapper .swiper-pagination-bullet-active{

    width:28px;

    border-radius:20px;

    background:#ff8300;

}

/* ---------- Navigation ---------- */

.homepage-wrapper .swiper-button-prev,

.homepage-wrapper .swiper-button-next{

    width:52px;

    height:52px;

    border-radius:50%;

    background:#fff;

    color:#ff8300;

    box-shadow:0 10px 30px rgba(0,0,0,.12);

}

.homepage-wrapper .swiper-button-prev:after,

.homepage-wrapper .swiper-button-next:after{

    font-size:18px;

    font-weight:700;

}

.homepage-wrapper .swiper-button-prev:hover,

.homepage-wrapper .swiper-button-next:hover{

    background:#ff8300;

    color:#fff;

}

/* ---------- Mobile ---------- */

@media(max-width:768px){

.homepage-wrapper .testimonial-card{

padding:24px;

}

.homepage-wrapper .testimonial-header{

flex-direction:column;

align-items:flex-start;

gap:15px;

}

.homepage-wrapper .testimonial-avatar{

width:64px;

height:64px;

}

.homepage-wrapper .testimonial-author h5{

font-size:18px;

}

}






/*==============================================================
  STEP-4
  ABOUT + WHY CHOOSE US
==============================================================*/

/* ================= ABOUT ================= */

.homepage-wrapper .about-section{

    position:relative;

}

.homepage-wrapper .about-image-wrapper{

    position:relative;

    border-radius:28px;

    overflow:hidden;

}

.homepage-wrapper .about-image{

    width:100%;

    border-radius:28px;

    transition:.45s;

    box-shadow:0 25px 70px rgba(15,23,42,.12);

}

.homepage-wrapper .about-image:hover{

    transform:scale(1.03);

}

.homepage-wrapper .about-content{

    padding-left:35px;

}

.homepage-wrapper .about-description{

    color:#5b6473;

    font-size:17px;

    line-height:2;

    margin-top:25px;
    text-align: justify;

}

.homepage-wrapper .about-info-card{

    display:flex;

    gap:18px;

    align-items:flex-start;

    background:#fff;

    border-radius:18px;

    padding:22px;

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

    transition:.35s;

    height:100%;

}

.homepage-wrapper .about-info-card:hover{

    transform:translateY(-8px);

}

.homepage-wrapper .about-info-card i{

    width:62px;

    height:62px;

    border-radius:50%;

    background:#fff4e8;

    color:#ff8300;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:28px;

    flex-shrink:0;

}

.homepage-wrapper .about-info-card h5{

    margin-bottom:8px;

    font-size:20px;

    font-weight:700;

}

.homepage-wrapper .about-info-card p{

    margin:0;

    color:#64748b;

    line-height:1.8;

}

/* ================= WHY CHOOSE ================= */

.homepage-wrapper .why-card{

    padding:34px 28px;

    text-align:center;

    height:100%;

}

.homepage-wrapper .why-card-icon{

    width:82px;

    height:82px;

    margin:0 auto 25px;

    border-radius:50%;

    background:linear-gradient(135deg,#ff9d2f,#ff6b00);

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:34px;

    box-shadow:0 12px 30px rgba(255,131,0,.35);

}

.homepage-wrapper .why-card h4{

    font-size:23px;

    font-weight:700;

    margin-bottom:15px;

    color:#111827;

}

.homepage-wrapper .why-card p{

    color:#64748b;

    line-height:1.9;

    margin:0;

}

.homepage-wrapper .why-card:hover .why-card-icon{

    transform:rotate(8deg) scale(1.08);

    transition:.35s;

}

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

@media(max-width:991px){

.homepage-wrapper .about-content{

padding-left:0;

margin-top:35px;

}

}

@media(max-width:768px){

.homepage-wrapper .about-info-card{

padding:18px;

}

.homepage-wrapper .why-card{

padding:26px;

}

}



/*==============================================================
  PART-3A
  PUBLISHING PLANS PREMIUM
  Card Layout + Ribbon + Header + Price
==============================================================*/

/*=============================
  Section
==============================*/

.homepage-wrapper .plans-section{

    position:relative;

    background:#fafbfd;

}

.homepage-wrapper .plans-section .row{

    justify-content:center;

}

/*=============================
  Card
==============================*/

.homepage-wrapper .plan-card{

    position:relative;

    display:flex;

    flex-direction:column;

    overflow:hidden;

    width:100%;

    height:100%;

    border-radius:24px;

    background:#ffffff;

    transition:.35s ease;

}

/*=============================
  Colored Top Ribbon
==============================*/

.homepage-wrapper .plan-header{

    position:relative;

    padding:18px 24px;

    text-align:center;

    color:#fff;

}

.homepage-wrapper .plan-header h3{

    margin:0;

    font-size:28px;

    font-weight:700;

    color:#fff;

}

.homepage-wrapper .starter-plan .plan-header{

    background:#ff4268;

}

.homepage-wrapper .growth-plan .plan-header{

    background:#8BC34A;

}

.homepage-wrapper .professional-plan .plan-header{

    background:#1565C0;

}

.homepage-wrapper .signature-plan .plan-header{

    background:#8E24AA;

}

/*=============================
  Popular Badge
==============================*/

.homepage-wrapper .popular-badge{

    position:absolute;

    top:18px;

    right:-38px;

    width:170px;

    text-align:center;

    padding:8px 0;

    background:#ffc107;

    color:#111827;

    font-size:13px;

    font-weight:700;

    letter-spacing:.5px;

    transform:rotate(45deg);

    box-shadow:0 8px 20px rgba(0,0,0,.15);

    z-index:10;

}

/*=============================
  Price Area
==============================*/

.homepage-wrapper .plan-price{

    text-align:center;

    padding:34px 25px 18px;

}

.homepage-wrapper .plan-price .currency{

    font-size:34px;

    font-weight:700;

    color:#ff8300;

    vertical-align:top;

}

.homepage-wrapper .plan-price .amount{

    font-size:64px;

    font-weight:800;

    line-height:1;

    color:#111827;

}

.homepage-wrapper .plan-price .duration{

    display:block;

    margin-top:12px;

    font-size:15px;

    color:#94a3b8;

}

/*=============================
  Description
==============================*/

.homepage-wrapper .plan-description{

    padding:0 30px 25px;

    text-align:center;

    color:#64748b;

    font-size:15px;

    line-height:1.8;

}

/*=============================
  Included Heading
==============================*/

.homepage-wrapper .plan-included-title{

    background:#f7f8fb;

    padding:16px;

    text-align:center;

    font-size:17px;

    font-weight:700;

    color:#111827;

    border-top:1px solid #edf1f7;

    border-bottom:1px solid #edf1f7;

}

/*=============================
  Plan Accent Border
==============================*/

.homepage-wrapper .starter-plan{

    border-top:6px solid #ff4268;

}

.homepage-wrapper .growth-plan{

    border-top:6px solid #8BC34A;

}

.homepage-wrapper .professional-plan{

    border-top:6px solid #1565C0;

}

.homepage-wrapper .signature-plan{

    border-top:6px solid #8E24AA;

}

/*=============================
  Responsive
==============================*/

@media(max-width:1200px){

.homepage-wrapper .plan-price .amount{

font-size:52px;

}

}

@media(max-width:768px){

.homepage-wrapper .plan-header h3{

font-size:24px;

}

.homepage-wrapper .plan-price{

padding:28px 20px 16px;

}

.homepage-wrapper .plan-price .amount{

font-size:46px;

}

.homepage-wrapper .plan-description{

padding:0 22px 22px;

}

.homepage-wrapper .popular-badge{

right:-48px;

font-size:12px;

width:160px;

}

}


/*==============================================================
  PART-3B
  PUBLISHING PLANS
  Features + Buttons + Hover
==============================================================*/

/*==============================
 Feature List
==============================*/

.homepage-wrapper .plan-features{

    list-style:none;

    padding:30px;

    margin:0;

    flex:1;

}

.homepage-wrapper .plan-features li{

    display:flex;

    align-items:flex-start;

    gap:14px;

    padding:13px 0;

    border-bottom:1px solid #eef2f7;

    color:#475569;

    font-size:15px;

    line-height:1.8;

}

.homepage-wrapper .plan-features li:last-child{

    border-bottom:none;

}

/*==============================
 Tick Icon
==============================*/

.homepage-wrapper .plan-features li i{

    width:26px;

    height:26px;

    min-width:26px;

    border-radius:50%;

    background:#22c55e;

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:13px;

    margin-top:2px;

    box-shadow:

    0 8px 18px rgba(34,197,94,.25);

}

/*==============================
 CTA Area
==============================*/

.homepage-wrapper .plan-footer{

    padding:30px;

    margin-top:auto;

}

.homepage-wrapper .plan-footer .btn{

    width:100%;

    height:58px;

    border-radius:40px;

    font-size:17px;

    font-weight:700;

    letter-spacing:.3px;

}

/*==============================
 Starter Button
==============================*/

.homepage-wrapper .starter-plan .btn{

    background:#ff4268;

    border-color:#ff4268;

    color:#fff;

}

.homepage-wrapper .starter-plan .btn:hover{

    background:#ef2f58;

    border-color:#ef2f58;

}

/*==============================
 Growth Button
==============================*/

.homepage-wrapper .growth-plan .btn{

    background:#8BC34A;

    border-color:#8BC34A;

    color:#fff;

}

.homepage-wrapper .growth-plan .btn:hover{

    background:#7ab23c;

    border-color:#7ab23c;

}

/*==============================
 Professional Button
==============================*/

.homepage-wrapper .professional-plan .btn{

    background:#1565C0;

    border-color:#1565C0;

    color:#fff;

}

.homepage-wrapper .professional-plan .btn:hover{

    background:#0f56a7;

    border-color:#0f56a7;

}

/*==============================
 Signature Button
==============================*/

.homepage-wrapper .signature-plan .btn{

    background:#8E24AA;

    border-color:#8E24AA;

    color:#fff;

}

.homepage-wrapper .signature-plan .btn:hover{

    background:#7b1fa2;

    border-color:#7b1fa2;

}

/*==============================
 Hover
==============================*/

.homepage-wrapper .plan-card{

    transition:

    transform .35s,

    box-shadow .35s;

}

.homepage-wrapper .plan-card:hover{

    transform:translateY(-12px);

    box-shadow:

    0 35px 80px rgba(15,23,42,.12);

}

/*==============================
 Popular Card
==============================*/

.homepage-wrapper .professional-plan{

    transform:scale(1.03);

    z-index:5;

}

.homepage-wrapper .professional-plan:hover{

    transform:

    translateY(-12px)

    scale(1.05);

}

/*==============================
 Equal Height
==============================*/

.homepage-wrapper .plans-section .col-lg-3,

.homepage-wrapper .plans-section .col-md-6{

    display:flex;

}

.homepage-wrapper .plans-section .plan-card{

    width:100%;

}

/*==============================
 Mobile
==============================*/

@media(max-width:991px){

.homepage-wrapper .professional-plan{

transform:none;

}

}

@media(max-width:768px){

.homepage-wrapper .plan-features{

padding:22px;

}

.homepage-wrapper .plan-footer{

padding:22px;

}

.homepage-wrapper .plan-footer .btn{

height:54px;

font-size:16px;

}

}

/*==============================================================
  PART-3C
  PUBLISHING PLANS
  Premium Finish
==============================================================*/

/*==============================
 Background
==============================*/

.homepage-wrapper .plans-section{

    position:relative;

    overflow:hidden;

    background:

    linear-gradient(
    180deg,
    #ffffff 0%,
    #fffaf5 100%
    );

}

/* Decorative Blur */

.homepage-wrapper .plans-section::before{

    content:"";

    position:absolute;

    width:420px;

    height:420px;

    border-radius:50%;

    background:

    rgba(255,131,0,.05);

    top:-180px;

    left:-160px;

    filter:blur(60px);

    z-index:0;

}

.homepage-wrapper .plans-section::after{

    content:"";

    position:absolute;

    width:380px;

    height:380px;

    border-radius:50%;

    background:

    rgba(21,101,192,.05);

    right:-140px;

    bottom:-180px;

    filter:blur(70px);

    z-index:0;

}

.homepage-wrapper .plans-section .container{

    position:relative;

    z-index:2;

}

/*==============================
 Card Shine Effect
==============================*/

.homepage-wrapper .plan-card{

    overflow:hidden;

}

.homepage-wrapper .plan-card::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:70%;

    height:100%;

    background:

    linear-gradient(

    90deg,

    transparent,

    rgba(255,255,255,.35),

    transparent

    );

    transform:skewX(-25deg);

    transition:1s;

}

.homepage-wrapper .plan-card:hover::before{

    left:150%;

}

/*==============================
 Ribbon Glow
==============================*/

.homepage-wrapper .plan-header{

    box-shadow:

    inset 0 -2px 0 rgba(255,255,255,.15);

}

/*==============================
 Price
==============================*/

.homepage-wrapper .plan-price{

    position:relative;

}

.homepage-wrapper .plan-price::after{

    content:"";

    display:block;

    width:60px;

    height:4px;

    border-radius:20px;

    margin:22px auto 0;

    background:#ff8300;

}

/*==============================
 Included Title
==============================*/

.homepage-wrapper .plan-included-title{

    letter-spacing:.4px;

    text-transform:uppercase;

    font-size:14px;

}

/*==============================
 Feature Hover
==============================*/

.homepage-wrapper .plan-features li{

    transition:.30s;

}

.homepage-wrapper .plan-features li:hover{

    padding-left:8px;

}

/*==============================
 Tick Animation
==============================*/

.homepage-wrapper .plan-features li:hover i{

    transform:scale(1.12);

    transition:.30s;

}

/*==============================
 Button
==============================*/

.homepage-wrapper .plan-footer .btn{

    position:relative;

    overflow:hidden;

}

.homepage-wrapper .plan-footer .btn::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:120%;

    height:100%;

    background:

    linear-gradient(

    90deg,

    transparent,

    rgba(255,255,255,.35),

    transparent

    );

    transition:.8s;

}

.homepage-wrapper .plan-footer .btn:hover::before{

    left:140%;

}

/*==============================
 Most Popular Card
==============================*/

.homepage-wrapper .professional-plan{

    box-shadow:

    0 35px 90px rgba(21,101,192,.18);

}

/*==============================
 Card Radius
==============================*/

.homepage-wrapper .plan-card{

    border-radius:28px;

}

/*==============================
 Mobile
==============================*/

@media(max-width:991px){

.homepage-wrapper .plans-section::before,

.homepage-wrapper .plans-section::after{

display:none;

}

}

@media(max-width:768px){

.homepage-wrapper .plan-card{

border-radius:22px;

}

.homepage-wrapper .plan-price::after{

margin-top:18px;

}

}
/*==============================================================
  PART-5
  PREMIUM FAQ
==============================================================*/

/*==============================
 Section
==============================*/

.homepage-wrapper #faq.faq-section{

    position:relative;

    overflow:hidden;

    background:linear-gradient(45deg, #f7f4d9, transparent);

}

/*==============================
 Container
==============================*/

.homepage-wrapper #faq .faq-wrapper{

    max-width:900px;

    margin:0 auto;

}

/*==============================
 Accordion Item
==============================*/

.homepage-wrapper #faq .faq-item{

    background:#ffffff;

    border-radius:18px;

    overflow:hidden;

    margin-bottom:22px;

    box-shadow:

    0 12px 35px rgba(15,23,42,.06);

    transition:.35s;

}

.homepage-wrapper #faq .faq-item:hover{

    transform:translateY(-4px);

    box-shadow:

    0 22px 55px rgba(15,23,42,.10);

}

/*==============================
 Question Button
==============================*/

.homepage-wrapper #faq .faq-question{

    width:100%;

    border:none;

    outline:none;

    background:#fff;

    padding:24px 28px;

    display:flex;

    justify-content:space-between;

    align-items:center;

    cursor:pointer;

    text-align:left;

    font-size:18px;

    font-weight:700;

    color:#111827;

    transition:.35s;

}

/*==============================
 Active Question
==============================*/

.homepage-wrapper #faq .faq-item.active .faq-question{

    color:#fff;

    background:

    linear-gradient(

    90deg,

    #ff4d6d,

    #ff8a3d

    );

}

/*==============================
 Icon Box
==============================*/

.homepage-wrapper #faq .faq-icon{

    width:52px;

    height:52px;

    border-radius:10px;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    background:

    linear-gradient(

    135deg,

    #ff4d6d,

    #ff8a3d

    );

    color:#fff;

    font-size:20px;

    transition:.35s;

}

.homepage-wrapper #faq .faq-item.active .faq-icon{

    background:#fff;

    color:#ff6b3d;

}

/*==============================
 Icon Rotate
==============================*/

.homepage-wrapper #faq .faq-icon i{

    transition:.35s;

}

.homepage-wrapper #faq .faq-item.active .faq-icon i{

    transform:rotate(45deg);

}

/*==============================
 Answer Area
==============================*/

.homepage-wrapper #faq .faq-answer{

    background:#fff;

    padding:0 30px;

    max-height:0;

    overflow:hidden;

    transition:

    max-height .45s ease,

    padding .35s ease;

}

.homepage-wrapper #faq .faq-item.active .faq-answer{

    padding:28px 30px;

    max-height:500px;

}

.homepage-wrapper #faq .faq-answer p{

    margin:0;

    color:#64748b;

    font-size:16px;

    line-height:1.9;

}

/*==============================
 Divider
==============================*/

.homepage-wrapper #faq .faq-item.active{

    border:

    1px solid rgba(255,120,60,.18);

}

/*==============================
 Decorative Background
==============================*/

.homepage-wrapper #faq .faq-section::before{

    content:"";

    position:absolute;

    width:340px;

    height:340px;

    border-radius:50%;

    background:

    rgba(255,131,0,.05);

    top:-140px;

    left:-120px;

    filter:blur(60px);

}

.homepage-wrapper #faq .faq-section::after{

    content:"";

    position:absolute;

    width:260px;

    height:260px;

    border-radius:50%;

    background:

    rgba(255,70,100,.05);

    right:-100px;

    bottom:-100px;

    filter:blur(55px);

}

/*==============================
 Animation
==============================*/

.homepage-wrapper #faq .faq-item{

    animation:

    faqFade .45s ease;

}

@keyframes faqFade{

    from{

        opacity:0;

        transform:translateY(25px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*==============================
 Mobile
==============================*/

@media(max-width:768px){

.homepage-wrapper #faq .faq-question{

padding:20px;

font-size:16px;

}

.homepage-wrapper #faq .faq-icon{

width:44px;

height:44px;

font-size:18px;

}

.homepage-wrapper #faq .faq-item.active .faq-answer{

padding:22px;

}

.homepage-wrapper #faq .faq-answer{

padding:0 22px;

}

.homepage-wrapper #faq .faq-answer p{

font-size:15px;

line-height:1.8;

}

}


/*==============================================================
  PART-6
  CTA + FOOTER CTA + FINAL HOMEPAGE POLISH
==============================================================*/

/*==============================================================
 CTA SECTION
==============================================================*/

.homepage-wrapper .cta-section{

    position:relative;

    overflow:hidden;

    padding:100px 0;

    background:

    linear-gradient(
    135deg,
    #ff7a00 0%,
    #ff4d6d 100%
    );

}

.homepage-wrapper .cta-section::before{

    content:"";

    position:absolute;

    width:420px;

    height:420px;

    border-radius:50%;

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

    top:-180px;

    left:-180px;

    filter:blur(60px);

}

.homepage-wrapper .cta-section::after{

    content:"";

    position:absolute;

    width:360px;

    height:360px;

    border-radius:50%;

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

    right:-120px;

    bottom:-120px;

    filter:blur(60px);

}

.homepage-wrapper .cta-content{

    position:relative;

    z-index:2;

    text-align:center;

}

.homepage-wrapper .cta-content h2{

    color:#fff;

    font-size:54px;

    font-weight:800;

    margin-bottom:25px;

}

.homepage-wrapper .cta-content p{

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

    font-size:18px;

    line-height:1.9;

    max-width:760px;

    margin:auto auto 35px;

}

.homepage-wrapper .cta-buttons{

    display:flex;

    justify-content:center;

    gap:20px;

    flex-wrap:wrap;

}

.homepage-wrapper .cta-buttons .btn{

    min-width:220px;

    height:60px;

    border-radius:50px;

    font-size:17px;

    font-weight:700;

}

.homepage-wrapper .cta-buttons .btn-light{

    color:#ff6d00;

}

.homepage-wrapper .cta-buttons .btn-light:hover{

    background:#111827;

    color:#fff;

}

.homepage-wrapper .cta-buttons .btn-outline-light{

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

}

.homepage-wrapper .cta-buttons .btn-outline-light:hover{

    background:#fff;

    color:#ff6d00;

}

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

.homepage-wrapper .footer-cta{

    position:relative;

    margin-top:100px;

    padding:60px;

    border-radius:28px;

    background:

    linear-gradient(
    135deg,
    #111827,
    #1e293b
    );

    text-align:center;

    overflow:hidden;

}

.homepage-wrapper .footer-cta::before{

    content:"";

    position:absolute;

    inset:0;

    background:

    linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.05),
    transparent
    );

}

.homepage-wrapper .footer-cta h2{

    position:relative;

    color:#fff;

    font-size:42px;

    font-weight:800;

    margin-bottom:18px;

}

.homepage-wrapper .footer-cta p{

    position:relative;

    color:#cbd5e1;

    font-size:17px;

    line-height:1.8;

    max-width:720px;

    margin:auto auto 30px;

}

/*==============================================================
 Utility
==============================================================*/

.homepage-wrapper .shadow-premium{

    box-shadow:

    0 25px 80px rgba(15,23,42,.08);

}

.homepage-wrapper .rounded-premium{

    border-radius:28px;

}

.homepage-wrapper .glass{

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

    backdrop-filter:blur(18px);

}

.homepage-wrapper .gradient-text{

    background:

    linear-gradient(
    90deg,
    #ff7a00,
    #ff4d6d
    );

    -webkit-background-clip:text;
 background-clip: text;      /* Add this line */
    -webkit-text-fill-color:transparent;

}

/*==============================================================
 Floating Shapes
==============================================================*/

.homepage-wrapper .shape{

    position:absolute;

    border-radius:50%;

    pointer-events:none;

    animation:floatShape 8s ease-in-out infinite;

}

.homepage-wrapper .shape-1{

    width:120px;

    height:120px;

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

}

.homepage-wrapper .shape-2{

    width:180px;

    height:180px;

    background:rgba(255,77,109,.05);

}

.homepage-wrapper .shape-3{

    width:90px;

    height:90px;

    background:rgba(59,130,246,.05);

}

/*==============================================================
 Scroll Animation
==============================================================*/

.homepage-wrapper .reveal{

    opacity:0;

    transform:translateY(40px);

    transition:

    opacity .8s ease,

    transform .8s ease;

}

.homepage-wrapper .reveal.active{

    opacity:1;

    transform:translateY(0);

}

/*==============================================================
 Smooth Hover
==============================================================*/

.homepage-wrapper a,

.homepage-wrapper button,

.homepage-wrapper .card,

.homepage-wrapper .book-card,

.homepage-wrapper .plan-card,

.homepage-wrapper .testimonial-card,

.homepage-wrapper .why-card{

    transition:all .35s ease;

}

/*==============================================================
 Floating Animation
==============================================================*/

@keyframes floatShape{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-20px);

}

100%{

transform:translateY(0);

}

}

/*==============================================================
 Responsive
==============================================================*/

@media(max-width:991px){

.homepage-wrapper .cta-content h2{

font-size:42px;

}

.homepage-wrapper .footer-cta{

padding:45px 30px;

}

.homepage-wrapper .footer-cta h2{

font-size:34px;

}

}

@media(max-width:768px){

.homepage-wrapper .cta-section{

padding:70px 0;

}

.homepage-wrapper .cta-content h2{

font-size:32px;

}

.homepage-wrapper .cta-content p{

font-size:16px;

}

.homepage-wrapper .cta-buttons{

flex-direction:column;

}

.homepage-wrapper .cta-buttons .btn{

width:100%;

}

.homepage-wrapper .footer-cta{

margin-top:70px;

padding:35px 25px;

}

.homepage-wrapper .footer-cta h2{

font-size:28px;

}

.homepage-wrapper .footer-cta p{

font-size:15px;

}

}
/* --------------------index page beautify secction end------------------------------------- */
/* --------------------index page beautify secction end------------------------------------- */
/* --------------------index page beautify secction end------------------------------------- */
/* --------------------index page beautify secction end------------------------------------- */

/* --------------------index page beautify secction ------------------------------------- */
/* --------------------index page beautify secction ------------------------------------- */
/* --------------------index page beautify secction ------------------------------------- */
/* --------------------index page beautify secction ------------------------------------- */


/* ==========================================================
   HOMEPAGE FOUNDATION
   PART-1B
   ========================================================== */

.homepage-wrapper{

    --ss-primary:#ff8a00;
    --ss-primary-dark:#f06a00;
    --ss-secondary:#0f172a;

    --ss-white:#ffffff;
    --ss-light:#f8fafc;
    --ss-border:#e9eef5;

    --ss-text:#1f2937;
    --ss-muted:#64748b;

    --ss-radius-sm:12px;
    --ss-radius:20px;
    --ss-radius-lg:28px;

    --ss-shadow-sm:0 10px 25px rgba(15,23,42,.06);
    --ss-shadow:0 18px 45px rgba(15,23,42,.08);
    --ss-shadow-lg:0 30px 80px rgba(15,23,42,.12);

    --ss-transition:.35s ease;

    position:relative;
    overflow:hidden;

    background:#fff;

    isolation:isolate;

}

.homepage-wrapper *{

    box-sizing:border-box;

}

.homepage-wrapper img{

    max-width:100%;
    height:auto;
    display:block;

}

.homepage-wrapper a{

    text-decoration:none;

    transition:all var(--ss-transition);

}

.homepage-wrapper section{

    position:relative;
    z-index:2;

}

.ss-homepage-content{

    position:relative;
    z-index:5;

}



/* ==========================================================
   HOMEPAGE FOUNDATION
   PART-1C
   Premium Background Effects
========================================================== */

.homepage-wrapper .ss-page-background{

    position:absolute;

    inset:0;

    overflow:hidden;

    pointer-events:none;

    z-index:0;

}

.homepage-wrapper .ss-bg-shape{

    position:absolute;

    border-radius:50%;

    filter:blur(90px);

    opacity:.16;

    animation:ssFloat 16s ease-in-out infinite;

}

.homepage-wrapper .ss-bg-shape-1{

    width:420px;

    height:420px;

    top:-120px;

    left:-120px;

    background:#ffb347;

}

.homepage-wrapper .ss-bg-shape-2{

    width:520px;

    height:520px;

    right:-180px;

    top:18%;

    background:#ffd8a8;

    animation-delay:4s;

}

.homepage-wrapper .ss-bg-shape-3{

    width:380px;

    height:380px;

    bottom:-120px;

    left:45%;

    transform:translateX(-50%);

    background:#ffe8c7;

    animation-delay:8s;

}

.homepage-wrapper .ss-bg-grid{

    position:absolute;

    inset:0;

    opacity:.03;

    background-image:

        linear-gradient(rgba(15,23,42,.35) 1px, transparent 1px),

        linear-gradient(90deg, rgba(15,23,42,.35) 1px, transparent 1px);

    background-size:80px 80px;

}

@keyframes ssFloat{

    0%{

        transform:translate3d(0,0,0) scale(1);

    }

    50%{

        transform:translate3d(0,-35px,0) scale(1.08);

    }

    100%{

        transform:translate3d(0,0,0) scale(1);

    }

}



/*==============================================================
  HOMEPAGE FOUNDATION
  PART-1D
  GLOBAL SECTION SYSTEM
==============================================================*/

/*==================================
 Section
==================================*/

.homepage-wrapper .ss-section{

    position:relative;

    padding:110px 0;

}

.homepage-wrapper .section-padding{

    padding:110px 0;

}

/*==================================
 Container
==================================*/

.homepage-wrapper .container{

    position:relative;

    z-index:5;

}

/*==================================
 Section Header
==================================*/

.homepage-wrapper .section-header{

    max-width:820px;

    margin:0 auto 70px;

    text-align:center;

}

/*==================================
 Badge
==================================*/

.homepage-wrapper .section-badge{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:10px 24px;

    margin-bottom:24px;

    border-radius:50px;

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

    color:var(--ss-primary);

    font-size:14px;

    font-weight:700;

    letter-spacing:.8px;

    text-transform:uppercase;

}

/*==================================
 Title
==================================*/

.homepage-wrapper .section-title{

    margin:0;

    color:var(--ss-text);

    font-size:48px;

    font-weight:800;

    line-height:1.2;

}

/*==================================
 Subtitle
==================================*/

.homepage-wrapper .section-subtitle{

    margin:28px auto 0;

    max-width:760px;

    color:var(--ss-muted);

    font-size:18px;

    line-height:1.9;
font-weight:600;
}

/*==================================
 Card
==================================*/

.homepage-wrapper .ss-card{

    position:relative;

    background:#fff;

    border-radius:24px;

    overflow:hidden;

    box-shadow:var(--ss-shadow);

    transition:all .35s ease;

}

.homepage-wrapper .ss-card:hover{

    transform:translateY(-8px);

    box-shadow:var(--ss-shadow-lg);

}

/*==================================
 Buttons
==================================*/

.homepage-wrapper .ss-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    min-width:190px;

    height:58px;

    padding:0 34px;

    border:none;

    border-radius:40px;

    font-size:16px;

    font-weight:700;

    cursor:pointer;

    transition:.35s;

}

.homepage-wrapper .ss-btn-primary{

    color:#fff !important;

    background:linear-gradient(135deg,#ff9d00 0%,#ff7a18 45%,#ff5e62 100%);

    box-shadow:

    0 18px 40px rgba(255,136,0,.28);

}

.homepage-wrapper .ss-btn-primary:hover{

    transform:translateY(-4px);

    box-shadow:

    0 24px 55px rgba(255,136,0,.35);
     background:linear-gradient(135deg,#ff5e62 0%,#ff7a18 45%,#ff9d00 100%);

}

.homepage-wrapper .ss-btn-outline{

    background:#0f172a !important;

    color:#ffffff !important;

    border:2px solid rgba(255,138,0,.20);

}

.homepage-wrapper .ss-btn-outline:hover{

    background:#ff6060  !important;

    color:#fff !important;

}

/*==================================
 Divider
==================================*/

.homepage-wrapper .ss-divider{

    width:80px;

    height:4px;

    margin:30px auto;

    border-radius:20px;

    background:

    linear-gradient(
    90deg,
    #ff9800,
    #ff6b00
    );

}

/*==================================
 Responsive
==================================*/

@media(max-width:991px){

.homepage-wrapper .section-padding{

padding:90px 0;

}

.homepage-wrapper .section-title{

font-size:38px;

}

}

@media(max-width:768px){

.homepage-wrapper .section-padding{

padding:70px 0;

}

.homepage-wrapper .section-header{

margin-bottom:50px;

}

.homepage-wrapper .section-title{

font-size:30px;

}

.homepage-wrapper .section-subtitle{

font-size:16px;

}

.homepage-wrapper .ss-btn{

width:100%;

}

}

/*==============================================================
  PART-2B
  SS PUBLISHING PLANS
==============================================================*/

.homepage-wrapper .publishing-plans-section{

    position:relative;

    padding:110px 0;

}

.homepage-wrapper .ss-plan-card{

    position:relative;

    display:flex;

    flex-direction:column;

    height:100%;

    background:#ffffff;

    border-radius:28px;

    overflow:hidden;

    box-shadow:
    0 20px 60px rgba(15,23,42,.08);

    transition:
    transform .35s ease,
    box-shadow .35s ease;

}

.homepage-wrapper .ss-plan-card:hover{

    transform:translateY(-10px);

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

}

/*==============================
 Ribbon
==============================*/

.homepage-wrapper .ss-plan-ribbon{

    position:absolute;

    top:18px;

    right:-46px;

    width:180px;

    padding:8px 0;

    text-align:center;

    transform:rotate(45deg);

    background:#ffb300;

    color:#111827;

    font-size:13px;

    font-weight:700;

    letter-spacing:.5px;

    z-index:10;

}

/*==============================
 Header
==============================*/

.homepage-wrapper .ss-plan-header{

    padding:26px 24px;

    text-align:center;

    color:#fff;

}

.homepage-wrapper .ss-plan-title{

    margin:0;

    font-size:28px;

    font-weight:700;

    color:#fff;

}

.homepage-wrapper .ss-plan-description{

    margin:12px 0 0;

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

    font-size:15px;

    line-height:1.7;

}

/*==============================
 Plan Colors
==============================*/

.homepage-wrapper .ss-plan-card:nth-child(1) .ss-plan-header{

    background:#ff4268;

}

.homepage-wrapper .ss-plan-card:nth-child(2) .ss-plan-header{

    background:#8bc34a;

}

.homepage-wrapper .ss-plan-card:nth-child(3) .ss-plan-header{

    background:#1565c0;

}

.homepage-wrapper .ss-plan-card:nth-child(4) .ss-plan-header{

    background:#8e24aa;

}

/*==============================
 Price
==============================*/

.homepage-wrapper .ss-plan-price{

    text-align:center;

    padding:10px 20px 10px;

}

.homepage-wrapper .ss-plan-currency{

    font-size:30px;

    font-weight:700;

    color:#ff8300;

    vertical-align:top;

}

.homepage-wrapper .ss-plan-amount{

    font-size:62px;

    font-weight:800;

    color:#111827;

    line-height:1;

}

.homepage-wrapper .ss-plan-divider{

    width:70px;

    height:4px;

    margin:0 auto 25px;

    border-radius:50px;

    background:#ff8300;

}

/*==============================
 Features
==============================*/

.homepage-wrapper .ss-plan-features{

    flex:1;

    padding:0 28px 25px;

}

.homepage-wrapper .ss-plan-features ul{

    margin:0;

    padding:0;

    list-style:none;

}

.homepage-wrapper .ss-plan-features li{

    display:flex;

    align-items:flex-start;

    gap:12px;

    padding:13px 0;

    border-bottom:1px solid #edf2f7;

}

.homepage-wrapper .ss-plan-features li:last-child{

    border-bottom:none;

}

.homepage-wrapper .ss-plan-features i{

    color:#22c55e;

    font-size:18px;

    margin-top:2px;

}

.homepage-wrapper .ss-plan-features span{

    color:#475569;

    line-height:1.8;

    font-size:15px;

}

/*==============================
 Footer
==============================*/

.homepage-wrapper .ss-plan-footer{

    padding:28px;

    margin-top:auto;

}

.homepage-wrapper .ss-plan-button{

    display:flex;

    justify-content:center;

    align-items:center;

    width:100%;

    height:58px;

    border-radius:40px;

    text-decoration:none;

    font-weight:700;

    font-size:17px;

    color:#fff !important;

    background:linear-gradient(
    135deg,
    #ff8a00,
    #ff5c00
    );

    transition:.35s;

}

.homepage-wrapper .ss-plan-button:hover{

    transform:translateY(-3px);

    box-shadow:
    0 18px 40px rgba(255,138,0,.35);

}



/*==============================================================
  PART-2C
  PLAN COLORS
==============================================================*/

.homepage-wrapper .ss-plan-starter .ss-plan-header{

    background:#ff4268;

}

.homepage-wrapper .ss-plan-growth .ss-plan-header{

    background:#8bc34a;

}

.homepage-wrapper .ss-plan-professional .ss-plan-header{

    background:#1565c0;

}

.homepage-wrapper .ss-plan-signature .ss-plan-header{

    background:#8e24aa;

}

/* Top Border */

.homepage-wrapper .ss-plan-starter{

    border-top:6px solid #ff4268;

}

.homepage-wrapper .ss-plan-growth{

    border-top:6px solid #8bc34a;

}

.homepage-wrapper .ss-plan-professional{

    border-top:6px solid #1565c0;

}

.homepage-wrapper .ss-plan-signature{

    border-top:6px solid #8e24aa;

}

/* Button */

.homepage-wrapper .ss-plan-starter .ss-plan-button{

    background:#ff4268;

}

.homepage-wrapper .ss-plan-growth .ss-plan-button{

    background:#8bc34a;

}

.homepage-wrapper .ss-plan-professional .ss-plan-button{

    background:#1565c0;

}

.homepage-wrapper .ss-plan-signature .ss-plan-button{

    background:#8e24aa;

}

.homepage-wrapper .ss-plan-button:hover{

    filter:brightness(.94);

}


/*==============================================================
  PART-2E
  PUBLISHING PLANS - FINAL PREMIUM DESIGN
==============================================================*/

.homepage-wrapper .ss-plan-card{

    position:relative;

    display:flex;

    flex-direction:column;

    height:100%;

    background:#fff;

    border-radius:28px;

    overflow:hidden;

    box-shadow:0 18px 45px rgba(15,23,42,.08);

    transition:all .35s ease;

}

.homepage-wrapper .ss-plan-card:hover{

    transform:translateY(-10px);

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

}

/*==============================
 Header
==============================*/

.homepage-wrapper .ss-plan-header{

    padding:18px;

    text-align:center;

}

.homepage-wrapper .ss-plan-name{

    font-size:28px;

    font-weight:700;

    color:#fff;

}

/*==============================
 Price Box
==============================*/

.homepage-wrapper .ss-plan-price-box{

    padding:35px 25px 25px;

    text-align:center;

}

.homepage-wrapper .ss-plan-currency{

    font-size:30px;

    color:#ff8300;

    font-weight:700;

    vertical-align:top;

}

.homepage-wrapper .ss-plan-amount{

    font-size:60px;

    font-weight:800;

    color:#111827;

    line-height:1;

}

.homepage-wrapper .ss-plan-description{

    margin-top:18px;

    color:#64748b;

    line-height:1.8;

    font-size:15px;

}

/*==============================
 Included Strip
==============================*/

.homepage-wrapper .ss-plan-include-title{

    background:#f7f8fb;

    border-top:1px solid #edf2f7;

    border-bottom:1px solid #edf2f7;

    text-align:center;

    padding:15px;

    font-size:15px;

    font-weight:700;

    color:#111827;

    text-transform:uppercase;

    letter-spacing:.5px;

}

/*==============================
 Features
==============================*/

.homepage-wrapper .ss-plan-features{

    flex:1;

    padding:10px;

}

.homepage-wrapper .ss-plan-list{

    list-style:none;

    margin:0;

    padding:0;

}

.homepage-wrapper .ss-plan-item{

    display:flex;

    align-items:flex-start;

    gap:12px;

    padding:12px 0;

    border-bottom:1px solid #eef2f7;

}

.homepage-wrapper .ss-plan-item:last-child{

    border-bottom:none;

}

.homepage-wrapper .ss-plan-item i{

    width:24px;

    height:24px;

    min-width:24px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#22c55e;

    color:#fff;

    font-size:12px;

    margin-top:2px;

}

.homepage-wrapper .ss-plan-feature-text{

    color:#475569;

    font-size:15px;

    line-height:1.8;

}

/*==============================
 Footer
==============================*/

.homepage-wrapper .ss-plan-footer{

    margin-top:auto;

    padding:28px;

}

.homepage-wrapper .ss-plan-button{

    display:flex;

    align-items:center;

    justify-content:center;

    width:100%;

    height:58px;

    border-radius:40px;

    text-decoration:none;

    color:#fff !important;

    font-size:17px;

    font-weight:700;

    transition:.35s;

}

/*==============================
 Featured Plan
==============================*/

.homepage-wrapper .ss-plan-featured{

    transform:scale(1.03);

    z-index:5;

}

.homepage-wrapper .ss-plan-featured:hover{

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

}

/*==============================
 Responsive
==============================*/

@media(max-width:991px){

.homepage-wrapper .ss-plan-featured{

transform:none;

}

}

@media(max-width:768px){

.homepage-wrapper .ss-plan-name{

font-size:24px;

}

.homepage-wrapper .ss-plan-amount{

font-size:48px;

}

.homepage-wrapper .ss-plan-features{

padding:20px;

}

.homepage-wrapper .ss-plan-footer{

padding:20px;

}

}

/*==============================================================
 PART-2F
 FINAL PLAN POLISH
==============================================================*/

/*--------------------------------------------------
 Equal Height
--------------------------------------------------*/

.homepage-wrapper .publishing-plans-section .row{

    align-items:stretch;

}

.homepage-wrapper .publishing-plans-section .col-lg-3,
.homepage-wrapper .publishing-plans-section .col-md-6{

    display:flex;

}

.homepage-wrapper .ss-plan-card{

    width:100%;

    min-height:100%;

}


/*--------------------------------------------------
 Header Capsule
--------------------------------------------------*/

.homepage-wrapper .ss-plan-header{

    position:relative;

    margin:16px;

    margin-bottom:0;

    border-radius:22px 22px 0 0;

    overflow:hidden;

}

.homepage-wrapper .ss-plan-name{

    font-size:30px;

    font-weight:700;

    letter-spacing:.3px;

}


/*--------------------------------------------------
 Price Area
--------------------------------------------------*/

.homepage-wrapper .ss-plan-price-box{

    padding-top:20px;

    padding-bottom:28px;

}

.homepage-wrapper .ss-plan-description{

    max-width:260px;

    margin:10px auto 0;

}


/*--------------------------------------------------
 Included Strip
--------------------------------------------------*/

.homepage-wrapper .ss-plan-include-title{

    font-size:16px;

    font-weight:800;

    letter-spacing:.8px;

}


/*--------------------------------------------------
 Features
--------------------------------------------------*/

.homepage-wrapper .ss-plan-features{

    display:flex;

    flex-direction:column;

}

.homepage-wrapper .ss-plan-item{

    min-height:58px;

}


/*--------------------------------------------------
 Footer
--------------------------------------------------*/

.homepage-wrapper .ss-plan-footer{

    padding:24px;

}

.homepage-wrapper .ss-plan-button{

    height:60px;

    border-radius:50px;

    font-size:18px;

    font-weight:700;

    box-shadow:

    0 15px 35px rgba(0,0,0,.12);

}

.homepage-wrapper .ss-plan-button:hover{

    transform:translateY(-4px);

    box-shadow:

    0 25px 45px rgba(0,0,0,.18);

}


/*--------------------------------------------------
 Featured Card
--------------------------------------------------*/

.homepage-wrapper .ss-plan-featured{

    transform:scale(1.04);

    z-index:10;

}

.homepage-wrapper .ss-plan-featured:hover{

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

}


/*--------------------------------------------------
 Ribbon
--------------------------------------------------*/

.homepage-wrapper .ss-plan-ribbon{

    position:absolute;

    top:10px;

    right:22px;

    transform:none;

    width:auto;

    padding:7px 18px;

    border-radius:50px;

    font-size:12px;

    font-weight:700;

    letter-spacing:.6px;

    color:#111827;

    background:#ffd54f;

    box-shadow:

    0 10px 20px rgba(255,193,7,.35);

}


/*--------------------------------------------------
 Card Hover
--------------------------------------------------*/

.homepage-wrapper .ss-plan-card{

    transition:

    transform .35s,

    box-shadow .35s,

    border-color .35s;

}

.homepage-wrapper .ss-plan-card:hover{

    transform:translateY(-12px);

    box-shadow:

    0 30px 70px rgba(15,23,42,.16);

}

/*==============================================================
 PART-2G
 FORCE PLAN COLORS
==============================================================*/

/*-----------------------------
Starter
-----------------------------*/

.homepage-wrapper .ss-plan-starter .ss-plan-header{

    background:#ff4268 !important;

}

.homepage-wrapper .ss-plan-starter{

    border-top:5px solid #ff4268 !important;

}

.homepage-wrapper .ss-plan-starter .ss-plan-button{

    background:#ff4268 !important;

}

/*-----------------------------
Growth
-----------------------------*/

.homepage-wrapper .ss-plan-growth .ss-plan-header{

    background:#8BC34A !important;

}

.homepage-wrapper .ss-plan-growth{

    border-top:5px solid #8BC34A !important;

}

.homepage-wrapper .ss-plan-growth .ss-plan-button{

    background:#8BC34A !important;

}

/*-----------------------------
Professional
-----------------------------*/

.homepage-wrapper .ss-plan-professional .ss-plan-header{

    background:#1565C0 !important;

}

.homepage-wrapper .ss-plan-professional{

    border-top:5px solid #1565C0 !important;

}

.homepage-wrapper .ss-plan-professional .ss-plan-button{

    background:#1565C0 !important;

}

/*-----------------------------
Signature
-----------------------------*/

.homepage-wrapper .ss-plan-signature .ss-plan-header{

    background:#8E24AA !important;

}

.homepage-wrapper .ss-plan-signature{

    border-top:5px solid #8E24AA !important;

}

.homepage-wrapper .ss-plan-signature .ss-plan-button{

    background:#8E24AA !important;

}


/*==============================================================
 PART-2H
 FINAL PREMIUM POLISH
==============================================================*/

/*--------------------------------------------------
 Price Box
--------------------------------------------------*/

.homepage-wrapper .ss-plan-price-box{

    min-height:230px;

    display:flex;

    flex-direction:column;

    justify-content:center;

    background:#ffffff;

}

.homepage-wrapper .ss-plan-amount{

    letter-spacing:-2px;

}

.homepage-wrapper .ss-plan-description{

    font-size:15px;

    line-height:1.9;

    color:#64748b;

}

/*--------------------------------------------------
 Feature Section
--------------------------------------------------*/

.homepage-wrapper .ss-plan-features{

    background:#ffffff;

}

.homepage-wrapper .ss-plan-item{

    transition:.25s;

}

.homepage-wrapper .ss-plan-item:hover{

    padding-left:8px;

    background:#fafafa;

}

/*--------------------------------------------------
 Button Polish
--------------------------------------------------*/

.homepage-wrapper .ss-plan-button{

    position:relative;

    overflow:hidden;

}

.homepage-wrapper .ss-plan-button::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:100%;

    height:100%;

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

    transition:.8s;

}

.homepage-wrapper .ss-plan-button:hover::before{

    left:120%;

}

/*--------------------------------------------------
 Featured Plan
--------------------------------------------------*/

.homepage-wrapper .ss-plan-featured{

    box-shadow:
    0 25px 70px rgba(15,23,42,.18);

}

/*--------------------------------------------------
 Compare Button
--------------------------------------------------*/

.homepage-wrapper .publishing-plans-section .btn-outline-primary{

    border-radius:50px;

    padding:16px 40px;

    font-weight:700;

    border:2px solid #ff8300;

    color:#ff8300;

    transition:.35s;

}

.homepage-wrapper .publishing-plans-section .btn-outline-primary:hover{

    background:#ff8300;

    color:#fff;

    transform:translateY(-3px);

    box-shadow:0 20px 40px rgba(255,131,0,.30);

}



/*==============================================================
 PART-2I
 FINAL RIBBON + PREMIUM EFFECT
==============================================================*/

/*--------------------------------------------------
 Premium Header Gradient
--------------------------------------------------*/

.homepage-wrapper .ss-plan-header{

    overflow:hidden;

}

.homepage-wrapper .ss-plan-header::before{

    content:"";

    position:absolute;

    inset:0;

    opacity:.18;

    background:

    linear-gradient(

        135deg,

        rgba(255,255,255,.55),

        transparent 55%

    );

    pointer-events:none;

}

/*--------------------------------------------------
 Ribbon
--------------------------------------------------*/

.homepage-wrapper .ss-plan-ribbon{

    position:absolute;

    top:-14px;

    left:50%;

    transform:translateX(-50%);

    z-index:25;

    min-width:135px;

    height:34px;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:0 18px;

    border-radius:40px;

    background:linear-gradient(
        135deg,
        #ffe082,
        #ffc107
    );

    color:#7a4d00;

    font-size:11px;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.7px;

    box-shadow:
    0 10px 25px rgba(255,193,7,.45);

}

/*--------------------------------------------------
 Featured Card Glow
--------------------------------------------------*/

.homepage-wrapper .ss-plan-featured{

    position:relative;

}

.homepage-wrapper .ss-plan-featured::after{

    content:"";

    position:absolute;

    inset:-2px;

    border-radius:30px;

    border:2px solid rgba(255,193,7,.45);

    pointer-events:none;

}

/*--------------------------------------------------
 Card Hover Glow
--------------------------------------------------*/

.homepage-wrapper .ss-plan-card:hover{

    box-shadow:

    0 35px 90px rgba(15,23,42,.18);

}

.homepage-wrapper .ss-plan-card:hover .ss-plan-header{

    filter:brightness(1.04);

}

/*--------------------------------------------------
 Button Shine
--------------------------------------------------*/

.homepage-wrapper .ss-plan-button{

    position:relative;

    overflow:hidden;

}

.homepage-wrapper .ss-plan-button::after{

    content:"";

    position:absolute;

    top:0;

    left:-140%;

    width:60%;

    height:100%;

    transform:skewX(-20deg);

    background:

    linear-gradient(

        90deg,

        transparent,

        rgba(255,255,255,.40),

        transparent

    );

    transition:1s;

}

.homepage-wrapper .ss-plan-button:hover::after{

    left:170%;

}

/*--------------------------------------------------
 Feature Icon
--------------------------------------------------*/

.homepage-wrapper .ss-plan-item i{

    transition:.30s;

}

.homepage-wrapper .ss-plan-item:hover i{

    transform:scale(1.12);

}

/*--------------------------------------------------
 Compare Button
--------------------------------------------------*/

.homepage-wrapper .publishing-plans-section .btn-outline-primary{

    min-width:250px;

    height:60px;

    border-radius:60px;

    font-size:17px;

    font-weight:700;

}

.homepage-wrapper .publishing-plans-section .btn-outline-primary i{

    transition:.30s;

}

.homepage-wrapper .publishing-plans-section .btn-outline-primary:hover i{

    transform:translateX(6px);

}

/*--------------------------------------------------
 Mobile
--------------------------------------------------*/

@media (max-width:991px){

.homepage-wrapper .ss-plan-card{

margin-bottom:30px;

}

.homepage-wrapper .ss-plan-ribbon{

top:-12px;

}

}

@media (max-width:576px){

.homepage-wrapper .ss-plan-header{

margin:12px;

}

.homepage-wrapper .ss-plan-name{

font-size:24px;

}

.homepage-wrapper .ss-plan-amount{

font-size:48px;

}

.homepage-wrapper .ss-plan-price-box{

min-height:auto;

padding:28px 18px;

}

.homepage-wrapper .ss-plan-button{

height:54px;

font-size:16px;

}

}

#whyChooseUs{
background:linear-gradient(45deg, #fff6f6, transparent);
}

#publishingPlans{
background:linear-gradient(45deg, #fff0b9, transparent);
}




/* --------------------FAQ SECTION ------------------------------------- */
/* --------------------FAQ SECTION ------------------------------------- */
/* --------------------FAQ SECTION ------------------------------------- */
/* --------------------FAQ SECTION ------------------------------------- */



/* ==========================================================
   FAQ SECTION
   Part-3A
   Swarnim Sahitya Homepage
========================================================== */

.homepage-wrapper .faq-section{
    position:relative;
    padding:110px 0;
    overflow:hidden;
    background:#fff;
    z-index:1;
}

/* Soft Background */

.homepage-wrapper .faq-section::before{
    content:"";
    position:absolute;
    top:-220px;
    right:-220px;
    width:520px;
    height:520px;
    border-radius:50%;
    background:rgba(255,143,0,.05);
    filter:blur(10px);
    z-index:-2;
}

.homepage-wrapper .faq-section::after{
    content:"";
    position:absolute;
    bottom:-250px;
    left:-250px;
    width:620px;
    height:620px;
    border-radius:50%;
    background:rgba(255,92,0,.04);
    filter:blur(15px);
    z-index:-2;
}

/* Floating Dots */

.homepage-wrapper .faq-section .faq-bg{
    position:absolute;
    inset:0;
    pointer-events:none;
    overflow:hidden;
}

.homepage-wrapper .faq-section .faq-bg span{
    position:absolute;
    width:6px;
    height:6px;
    border-radius:50%;
    background:#ff7a00;
    opacity:.45;
    animation:faqFloat 10s linear infinite;
}

.homepage-wrapper .faq-section .faq-bg span:nth-child(1){
    top:12%;
    left:8%;
}

.homepage-wrapper .faq-section .faq-bg span:nth-child(2){
    top:32%;
    right:18%;
}

.homepage-wrapper .faq-section .faq-bg span:nth-child(3){
    bottom:18%;
    left:22%;
}

.homepage-wrapper .faq-section .faq-bg span:nth-child(4){
    bottom:28%;
    right:12%;
}

@keyframes faqFloat{

    0%{
        transform:translateY(0px);
    }

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

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

}

/* Container */

.homepage-wrapper .faq-section .container{
    max-width:1050px;
}

/* Heading */

.homepage-wrapper .faq-section .section-badge{
    display:inline-block;
    padding:10px 24px;
    border-radius:50px;
    font-size:13px;
    font-weight:700;
    letter-spacing:1px;
    color:#ff7a00;
    background:#fff5ec;
    margin-bottom:18px;
}

.homepage-wrapper .faq-section .section-title{
    font-size:46px;
    font-weight:800;
    color:#16213e;
    margin-bottom:18px;
}

.homepage-wrapper .faq-section .section-subtitle{
    font-size:18px;
    line-height:1.8;
    color:#667085;
    max-width:700px;
    margin:auto;
}

/* Spacing */

.homepage-wrapper .faq-section .faq-wrapper{
    margin-top:70px;
}




/* ==========================================================
   FAQ SECTION
   Part-3B
   Premium Accordion Cards
========================================================== */

.homepage-wrapper .faq-section .accordion{

    --bs-accordion-bg:transparent;
    --bs-accordion-border-width:0;
    --bs-accordion-border-radius:24px;
    --bs-accordion-inner-border-radius:24px;
    --bs-accordion-btn-focus-box-shadow:none;
    --bs-accordion-active-bg:transparent;
    --bs-accordion-active-color:#ffffff;

}

.homepage-wrapper .faq-section .accordion-item{

    border:none;
    border-radius:24px;
    overflow:hidden;
    margin-bottom:22px;

    background:#ffffff;

    box-shadow:
        0 15px 45px rgba(16,24,40,.08);

    transition:.35s ease;

}

.homepage-wrapper .faq-section .accordion-item:hover{

    transform:translateY(-4px);

    box-shadow:
        0 25px 55px rgba(16,24,40,.12);

}

/* Header */

.homepage-wrapper .faq-section .accordion-header{

    margin:0;

}

/* Button */

.homepage-wrapper .faq-section .accordion-button{

    position:relative;

    min-height:82px;

    padding:24px 90px 24px 32px;

    background:#ffffff;

    color:#16213e;

    font-size:19px;

    font-weight:700;

    line-height:1.5;

    border:none;

    box-shadow:none;

    transition:.35s ease;

}

/* Remove Bootstrap Arrow */

.homepage-wrapper .faq-section .accordion-button::after{

    display:none;

}

/* Hover */

.homepage-wrapper .faq-section .accordion-button:hover{

    color:#ff6b00;

}

/* Right Icon Box */

.homepage-wrapper .faq-section .accordion-button .faq-toggle{

    position:absolute;

    top:50%;

    right:18px;

    width:52px;

    height:52px;

    border-radius:14px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#ffffff;

    border:2px solid #ffd2ae;

    transition:.35s ease;

}

/* Icon */

.homepage-wrapper .faq-section .accordion-button .faq-toggle i{

    font-size:18px;

    color:#ff6b00;

    transition:.35s ease;

}

/* Body */

.homepage-wrapper .faq-section .accordion-body{

    padding:28px 32px 34px;

    background:#ffffff;

    font-size:17px;

    line-height:1.9;

    color:#5d6778;

    border-top:1px solid #f3f4f7;

}

/* Paragraph */

.homepage-wrapper .faq-section .accordion-body p{

    margin:0;

}


/*==============================================================
 PART-3C
 FAQ ACTIVE STATE
==============================================================*/

/*--------------------------------------------------
 Active Item
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-item:has(.accordion-button:not(.collapsed)){

    box-shadow:

    0 28px 65px rgba(255,106,0,.16);

}

/*--------------------------------------------------
 Active Header
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-button:not(.collapsed){

    color:#ffffff !important;

    background:

    linear-gradient(
        135deg,
        #ff7a00,
        #ff4f7b
    );

}

/*--------------------------------------------------
 Active Toggle
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-button:not(.collapsed) .faq-toggle{

    background:#ffffff;

    border-color:#ffffff;

    box-shadow:

    0 10px 25px rgba(255,255,255,.25);

}

/*--------------------------------------------------
 Active Icon
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-button:not(.collapsed) .faq-toggle i{

    color:#ff6b00;

    transform:rotate(45deg);

}

/*--------------------------------------------------
 Hover
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-button:hover .faq-toggle{

    transform:scale(1.08);

}

/*--------------------------------------------------
 Animation
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-collapse{

    transition:

    height .45s ease;

}

/*--------------------------------------------------
 Body
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-body{

    background:#ffffff;

}

/*--------------------------------------------------
 First Item
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-item:first-child{

    margin-top:0;

}

/*--------------------------------------------------
 Last Item
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-item:last-child{

    margin-bottom:0;

}

/*==============================================================
 PART-3D
 FAQ FINAL PREMIUM POLISH
==============================================================*/

/*--------------------------------------------------
 Glass Effect
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-item{

    backdrop-filter:blur(14px);

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

}

/*--------------------------------------------------
 Border Animation
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-item{

    border:1px solid transparent;

}

.homepage-wrapper .faq-section .accordion-item:hover{

    border-color:rgba(255,122,0,.18);

}

/*--------------------------------------------------
 Header Transition
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-button{

    transition:

        background .35s ease,

        color .35s ease,

        padding .30s ease;

}

.homepage-wrapper .faq-section .accordion-button:hover{

    padding-left:38px;

}

/*--------------------------------------------------
 Toggle Animation
--------------------------------------------------*/

.homepage-wrapper .faq-section .faq-toggle{

    overflow:hidden;

}

.homepage-wrapper .faq-section .faq-toggle::before{

    content:"";

    position:absolute;

    inset:0;

    border-radius:inherit;

    background:

        linear-gradient(

            135deg,

            rgba(255,255,255,.18),

            transparent

        );

    opacity:0;

    transition:.35s;

}

.homepage-wrapper .faq-section .accordion-button:hover .faq-toggle::before{

    opacity:1;

}

/*--------------------------------------------------
 Answer Fade
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-body{

    animation:ssFaqFade .45s ease;

}

@keyframes ssFaqFade{

    from{

        opacity:0;

        transform:translateY(10px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*--------------------------------------------------
 Active Divider
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-button:not(.collapsed){

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

}

/*--------------------------------------------------
 Text Selection
--------------------------------------------------*/

.homepage-wrapper .faq-section ::selection{

    background:#ff8a00;

    color:#fff;

}

/*--------------------------------------------------
 Decorative Glow
--------------------------------------------------*/

.homepage-wrapper .faq-section .accordion-item::after{

    content:"";

    position:absolute;

    inset:0;

    border-radius:24px;

    pointer-events:none;

    opacity:0;

    transition:.35s;

    box-shadow:

        inset 0 0 0 1px rgba(255,122,0,.12);

}

.homepage-wrapper .faq-section .accordion-item:hover::after{

    opacity:1;

}

/*--------------------------------------------------
 Mobile
--------------------------------------------------*/

@media(max-width:991px){

.homepage-wrapper .faq-section{

padding:90px 0;

}

}

@media(max-width:768px){

.homepage-wrapper .faq-section{

padding:70px 0;

}

.homepage-wrapper .faq-section .section-title{

font-size:32px;

}

.homepage-wrapper .faq-section .section-subtitle{

font-size:16px;

line-height:1.8;

}

.homepage-wrapper .faq-section .accordion-button{

min-height:72px;

padding:20px 72px 20px 20px;

font-size:17px;

}

.homepage-wrapper .faq-section .faq-toggle{

width:44px;

height:44px;

right:14px;

border-radius:12px;

}

.homepage-wrapper .faq-section .accordion-body{

padding:22px 20px 26px;

font-size:15px;

line-height:1.8;

}

}

@media(max-width:480px){

.homepage-wrapper .faq-section .section-title{

font-size:28px;

}

.homepage-wrapper .faq-section .accordion-button{

font-size:16px;

}

.homepage-wrapper .faq-section .faq-toggle{

width:40px;

height:40px;

}

}


.homepage-wrapper .gk-faq-toggle{
    position:relative;
    flex-shrink:0;
}

.homepage-wrapper .gk-faq-toggle::before{
    content:"  +";
    font-size:26px;
    font-weight:700;
    line-height:1;
    color:#ff6b00;
    margin-left: 20px;
}



.homepage-wrapper
.accordion-button:not(.collapsed)
.gk-faq-toggle::before{
    content:"  -";
    color:white;
}


/* --------------------FAQ SECTION END------------------------------------- */
/* --------------------FAQ SECTION END------------------------------------- */
/* --------------------FAQ SECTION END------------------------------------- */
/* --------------------FAQ SECTION END------------------------------------- */


/* --------------------TESTIMONIAL SECTION START------------------------------------- */
/* --------------------TESTIMONIAL SECTION START------------------------------------- */
/* --------------------TESTIMONIAL SECTION START------------------------------------- */


/*==============================================================
 PART-4A
 PREMIUM TESTIMONIALS SECTION
==============================================================*/

.homepage-wrapper .testimonials-section{

    position:relative;

    padding:120px 0;

    background:#ffffff;

    overflow:hidden;

    z-index:1;

}

/*--------------------------------------------------
 Background Glow
--------------------------------------------------*/

.homepage-wrapper .testimonials-section::before{

    content:"";

    position:absolute;

    top:-220px;

    left:-220px;

    width:520px;

    height:520px;

    border-radius:50%;

    background:rgba(255,135,0,.05);

    filter:blur(25px);

    z-index:-2;

}

.homepage-wrapper .testimonials-section::after{

    content:"";

    position:absolute;

    right:-220px;

    bottom:-220px;

    width:560px;

    height:560px;

    border-radius:50%;

    background:rgba(255,82,82,.05);

    filter:blur(30px);

    z-index:-2;

}

/*--------------------------------------------------
 Decorative Layer
--------------------------------------------------*/

.homepage-wrapper .testimonials-section .testimonial-bg{

    position:absolute;

    inset:0;

    pointer-events:none;

    overflow:hidden;

}

/* Floating Dots */

.homepage-wrapper .testimonials-section .testimonial-bg span{

    position:absolute;

    width:8px;

    height:8px;

    border-radius:50%;

    background:#ff7a00;

    opacity:.28;

    animation:ssTestimonialFloat 10s ease-in-out infinite;

}

.homepage-wrapper .testimonials-section .testimonial-bg span:nth-child(1){

    top:12%;

    left:10%;

}

.homepage-wrapper .testimonials-section .testimonial-bg span:nth-child(2){

    top:22%;

    right:16%;

}

.homepage-wrapper .testimonials-section .testimonial-bg span:nth-child(3){

    bottom:16%;

    left:18%;

}

.homepage-wrapper .testimonials-section .testimonial-bg span:nth-child(4){

    bottom:24%;

    right:12%;

}

@keyframes ssTestimonialFloat{

    0%{

        transform:translateY(0px);

    }

    50%{

        transform:translateY(-18px);

    }

    100%{

        transform:translateY(0px);

    }

}

/*--------------------------------------------------
 Container
--------------------------------------------------*/

.homepage-wrapper .testimonials-section .container{

    position:relative;

    max-width:1320px;

}

/*--------------------------------------------------
 Heading
--------------------------------------------------*/

.homepage-wrapper .testimonials-section .section-badge{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:10px 24px;

    border-radius:50px;

    background:#fff4ea;

    color:#ff7a00;

    font-size:13px;

    font-weight:700;

    letter-spacing:1px;

    margin-bottom:20px;

}

.homepage-wrapper .testimonials-section .section-title{

    font-size:48px;

    font-weight:800;

    color:#14213d;

    margin-bottom:20px;

}

.homepage-wrapper .testimonials-section .section-subtitle{

    max-width:720px;

    margin:auto;

    color:#667085;

    font-size:18px;

    line-height:1.8;

}

/*--------------------------------------------------
 Slider Wrapper
--------------------------------------------------*/

.homepage-wrapper .testimonials-section .testimonialSwiper{

    margin-top:75px;

    overflow:hidden;

}

/*--------------------------------------------------
 Responsive
--------------------------------------------------*/

@media(max-width:991px){

.homepage-wrapper .testimonials-section{

padding:90px 0;

}

.homepage-wrapper .testimonials-section .section-title{

font-size:38px;

}

}

@media(max-width:767px){

.homepage-wrapper .testimonials-section{

padding:70px 0;

}

.homepage-wrapper .testimonials-section .section-title{

font-size:30px;

}

.homepage-wrapper .testimonials-section .section-subtitle{

font-size:16px;

}

.homepage-wrapper .testimonials-section .testimonialSwiper{

margin-top:50px;

}

}


/*==============================================================
 PART-4B
 PREMIUM TESTIMONIAL CARD
==============================================================*/

.homepage-wrapper .testimonials-section .swiper-slide{

    height:auto;

    display:flex;

}

.homepage-wrapper .testimonials-section .testimonial-card{

    position:relative;

    width:100%;

    background:#ffffff;

    border-radius:28px;

    padding:34px;

    border:1px solid rgba(230,235,245,.85);

    box-shadow:

        0 18px 45px rgba(16,24,40,.07);

    transition:

        transform .35s ease,

        box-shadow .35s ease,

        border-color .35s ease;

    overflow:hidden;

}

/*---------------------------------------
 Decorative Top Line
---------------------------------------*/

.homepage-wrapper .testimonials-section .testimonial-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:5px;

    background:linear-gradient(
        90deg,
        #ff7a00,
        #ff4d6d
    );

}

/*---------------------------------------
 Hover
---------------------------------------*/

.homepage-wrapper .testimonials-section .testimonial-card:hover{

    transform:translateY(-10px);

    border-color:rgba(255,122,0,.20);

    box-shadow:

        0 28px 70px rgba(16,24,40,.12);

}

/*---------------------------------------
 Header
---------------------------------------*/

.homepage-wrapper .testimonials-section .testimonial-header{

    display:flex;

    justify-content:space-between;

    align-items:flex-start;

    margin-bottom:28px;

}

/*---------------------------------------
 Author
---------------------------------------*/

.homepage-wrapper .testimonials-section .testimonial-author{

    display:flex;

    align-items:center;

    gap:18px;

}

/*---------------------------------------
 Avatar
---------------------------------------*/

.homepage-wrapper .testimonials-section .testimonial-avatar{

    width:76px;

    height:76px;

    border-radius:50%;

    object-fit:cover;

    border:4px solid #ffffff;

    box-shadow:

        0 8px 22px rgba(0,0,0,.12);

    transition:.35s ease;

}

.homepage-wrapper .testimonials-section .testimonial-card:hover .testimonial-avatar{

    transform:scale(1.08);

}

/*---------------------------------------
 Name
---------------------------------------*/

.homepage-wrapper .testimonials-section .testimonial-author h5{

    margin:0;

    font-size:23px;

    font-weight:700;

    color:#16213e;

}

/*---------------------------------------
 Designation
---------------------------------------*/

.homepage-wrapper .testimonials-section .testimonial-author span{

    display:block;

    margin-top:4px;

    color:#667085;

    font-size:15px;

    font-weight:500;

}

/*---------------------------------------
 Rating
---------------------------------------*/

.homepage-wrapper .testimonials-section .testimonial-rating{

    display:flex;

    gap:5px;

}

.homepage-wrapper .testimonials-section .testimonial-rating i{

    color:#ff9800;

    font-size:18px;

}

/*---------------------------------------
 Quote Icon
---------------------------------------*/

.homepage-wrapper .testimonials-section .quote-icon{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:58px;

    height:58px;

    margin-bottom:20px;

    border-radius:18px;

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

    color:#ff7a00;

    font-size:28px;

}

/*---------------------------------------
 Message
---------------------------------------*/

.homepage-wrapper .testimonials-section .testimonial-body p{

    margin:0;

    color:#4f5d75;

    font-size:17px;

    line-height:1.9;

}

/*---------------------------------------
 Responsive
---------------------------------------*/

@media(max-width:768px){

.homepage-wrapper .testimonials-section .testimonial-card{

padding:26px;

border-radius:22px;

}

.homepage-wrapper .testimonials-section .testimonial-header{

flex-direction:column;

gap:20px;

}

.homepage-wrapper .testimonials-section .testimonial-avatar{

width:66px;

height:66px;

}

.homepage-wrapper .testimonials-section .testimonial-author h5{

font-size:20px;

}

.homepage-wrapper .testimonials-section .testimonial-body p{

font-size:16px;

line-height:1.8;

}

}


/*==============================================================
 PART-4C
 PREMIUM SWIPER SLIDER
==============================================================*/

/*--------------------------------------------------
 Swiper
--------------------------------------------------*/

.homepage-wrapper .testimonialSwiper{

    position:relative;

    overflow:hidden;

    padding:15px 8px 70px;

}

/* Wrapper */

.homepage-wrapper .testimonialSwiper .swiper-wrapper{

    align-items:stretch;

}

/* Slide */

.homepage-wrapper .testimonialSwiper .swiper-slide{

    height:auto;

    display:flex;

}

/* Active Slide */

.homepage-wrapper .testimonialSwiper .swiper-slide-active .testimonial-card{

    transform:translateY(-4px);

}

/*--------------------------------------------------
 Pagination
--------------------------------------------------*/

.homepage-wrapper .testimonialSwiper .swiper-pagination{

    bottom:0 !important;

}

.homepage-wrapper .testimonialSwiper .swiper-pagination-bullet{

    width:12px;

    height:12px;

    background:#d6dce5;

    opacity:1;

    transition:.35s;

}

.homepage-wrapper .testimonialSwiper .swiper-pagination-bullet-active{

    width:36px;

    border-radius:50px;

    background:linear-gradient(
        90deg,
        #ff7a00,
        #ff4d6d
    );

}

/*--------------------------------------------------
 Navigation
--------------------------------------------------*/

.homepage-wrapper .testimonialSwiper .swiper-button-next,

.homepage-wrapper .testimonialSwiper .swiper-button-prev{

    width:54px;

    height:54px;

    border-radius:50%;

    background:#ffffff;

    color:#ff7a00;

    box-shadow:

        0 15px 35px rgba(15,23,42,.12);

    transition:.35s;

}

.homepage-wrapper .testimonialSwiper .swiper-button-next:hover,

.homepage-wrapper .testimonialSwiper .swiper-button-prev:hover{

    background:#ff7a00;

    color:#ffffff;

    transform:translateY(-3px);

}

.homepage-wrapper .testimonialSwiper .swiper-button-next::after,

.homepage-wrapper .testimonialSwiper .swiper-button-prev::after{

    font-size:18px;

    font-weight:700;

}

/*--------------------------------------------------
 Mobile
--------------------------------------------------*/

@media(max-width:768px){

.homepage-wrapper .testimonialSwiper{

padding-bottom:60px;

}

.homepage-wrapper .testimonialSwiper .swiper-button-next,

.homepage-wrapper .testimonialSwiper .swiper-button-prev{

display:none;

}

}
/* --------------------TESTIMONIAL SECTION END------------------------------------- */
/* --------------------TESTIMONIAL SECTION END------------------------------------- */
/* --------------------TESTIMONIAL SECTION END------------------------------------- */


/* --------------------CTA SECTION------------------------------------- */
/* --------------------CTA SECTION------------------------------------- */
/* --------------------CTA SECTION------------------------------------- */

/*====================================================
  PREMIUM CTA SECTION
  Swarnim Sahitya Theme
====================================================*/

.ss-home-cta{

    position:relative;

    padding:120px 0;

    overflow:hidden;

    background:
    linear-gradient(135deg,#ff9d00 0%,#ff7a18 45%,#ff5e62 100%);
}

/*-----------------------------------
Background Glow
------------------------------------*/

.ss-home-cta::before{

    content:"";

    position:absolute;

    width:550px;

    height:550px;

    left:-220px;

    top:-180px;

    border-radius:50%;

    background:rgb(255 95 96);

    filter:blur(80px);

    pointer-events:none;

}

.ss-home-cta::after{

    content:"";

    position:absolute;

    width:520px;

    height:520px;

    right:-200px;

    bottom:-220px;

    border-radius:50%;

    background:rgb(255 96 96);

    filter:blur(90px);

    pointer-events:none;

}

/*-----------------------------------
Main Card
------------------------------------*/

.ss-home-cta-box{

    position:relative;

    overflow:hidden;

    z-index:2;

    border-radius:34px;

    padding:70px;

    background:

    linear-gradient(180deg,#fffdf9 0%,#fff7ef 100%);

    box-shadow:

    0 35px 70px rgba(255,125,0,.25);

}

/*-----------------------------------
Floating Shapes
------------------------------------*/

.ss-cta-circle{

    position:absolute;

    border-radius:50%;

    pointer-events:none;

}

.circle-one{

    width:180px;

    height:180px;

    top:-50px;

    right:-40px;

    background:rgb(233 194 194 / 10%);

}

.circle-two{

    width:120px;

    height:120px;

    bottom:-35px;

    left:8%;

    background:rgb(239 164 164 / 8%);

}

.circle-three{

    width:70px;

    height:70px;

    right:28%;

    bottom:28px;

    background:rgb(219 170 170 / 15%);

}

/*-----------------------------------
Content
------------------------------------*/

.ss-home-cta-content{

    position:relative;

    z-index:3;

}

.ss-cta-badge{

    display:inline-flex;

    align-items:center;

    gap:8px;

    padding:10px 18px;

    margin-bottom:22px;

    border-radius:40px;

    background:rgb(255 97 96);

    color:#fff;

    font-weight:700;

    font-size:14px;

    backdrop-filter:blur(12px);

}

.ss-home-cta-content h2{

    color:#ff7f14;

    font-size:56px;

    font-weight:800;

    line-height:1.15;

    margin-bottom:22px;

}

.ss-home-cta-content p{

    max-width:700px;

    color:rgb(59 50 50 / 95%);

    font-size:18px;

    line-height:1.9;

    margin:0;

}

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

.ss-home-cta-buttons{

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:flex-end;

    gap:18px;

    position:relative;

    z-index:5;

}

/*------------------------------------
Primary Button
------------------------------------*/

.ss-btn-primary{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:12px;

    min-width:260px;

    height:62px;

    padding:0 32px;

    border-radius:60px;

    background:#ffffff;

    color:#ff7a18;

    font-size:17px;

    font-weight:700;

    text-decoration:none;

    box-shadow:

    0 18px 35px rgba(0,0,0,.12);

    transition:all .35s ease;

}

.ss-btn-primary i{

    font-size:18px;

}

.ss-btn-primary:hover{

    color:#ffffff;

    background:linear-gradient(135deg,#ff9d00,#ff5e62);

    transform:translateY(-6px);

    box-shadow:

    0 25px 45px rgba(255,120,0,.35);

}

/*------------------------------------
Outline Button
------------------------------------*/

.ss-btn-outline{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:12px;

    min-width:260px;

    height:60px;

    padding:0 30px;

    border-radius:60px;

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

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

    backdrop-filter:blur(12px);

    color:#ffffff;

    font-size:16px;

    font-weight:600;

    text-decoration:none;

    transition:all .35s ease;

}

.ss-btn-outline:hover{

    background:#ffffff;

    color:#ff7a18;

    border-color:#ffffff;

    transform:translateY(-6px);

    box-shadow:

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

}

/*------------------------------------
Button Icons
------------------------------------*/

.ss-btn-primary i,

.ss-btn-outline i{

    transition:transform .35s ease;

}

.ss-btn-primary:hover i,

.ss-btn-outline:hover i{

    transform:translateX(4px);

}

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

@media(max-width:991px){

    .ss-home-cta-box{

        padding:55px 40px;

        text-align:center;

    }

    .ss-home-cta-content h2{

        font-size:42px;

    }

    .ss-home-cta-content p{

        max-width:100%;

    }

    .ss-home-cta-buttons{

        margin-top:45px;

        align-items:center;

    }

}

@media(max-width:767px){

    .ss-home-cta{

        padding:80px 0;

    }

    .ss-home-cta-box{

        padding:38px 26px;

        border-radius:24px;

    }

    .ss-home-cta-content h2{

        font-size:32px;

        line-height:1.3;

    }

    .ss-home-cta-content p{

        font-size:15px;

        line-height:1.8;

    }

    .ss-btn-primary,

    .ss-btn-outline{

        width:100%;

        min-width:100%;

    }

    .circle-one{

        width:110px;

        height:110px;

    }

    .circle-two{

        width:70px;

        height:70px;

    }

    .circle-three{

        display:none;

    }

}

/*====================================================
CTA FLOAT ANIMATION
====================================================*/

@keyframes ssFloat{

    0%,100%{

        transform:translateY(0px);

    }

    50%{

        transform:translateY(-12px);

    }

}

.circle-one{

    animation:ssFloat 7s ease-in-out infinite;

}

.circle-two{

    animation:ssFloat 9s ease-in-out infinite;

}

.circle-three{

    animation:ssFloat 6s ease-in-out infinite reverse;

}



/*==============================================================
 PART-6B
 PREMIUM NEWSLETTER
 Swarnim Sahitya Theme
==============================================================*/

.ss-newsletter-section{

    position:relative;

    padding:120px 0;

    overflow:hidden;

    background:
    linear-gradient(
        180deg,
        #fffdfb 0%,
        #fff7f0 100%
    );

}

/*------------------------------------
Background Glow
------------------------------------*/

.ss-newsletter-section::before{

    content:"";

    position:absolute;

    left:-180px;

    top:-180px;

    width:420px;

    height:420px;

    border-radius:50%;

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

    filter:blur(80px);

}

.ss-newsletter-section::after{

    content:"";

    position:absolute;

    right:-180px;

    bottom:-180px;

    width:450px;

    height:450px;

    border-radius:50%;

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

    filter:blur(90px);

}

/*------------------------------------
Card
------------------------------------*/

.ss-newsletter-card{

    position:relative;

    overflow:hidden;

    max-width:980px;

    margin:auto;

    padding:70px;

    border-radius:34px;

    background:#ffffff;

    box-shadow:

        0 30px 70px rgba(15,23,42,.08);

    text-align:center;

    z-index:2;

}

/*------------------------------------
Badge
------------------------------------*/

.ss-newsletter-badge{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:12px 22px;

    margin-bottom:25px;

    border-radius:50px;

    background:#fff3e6;

    color:#ff7a00;

    font-size:14px;

    font-weight:700;

}

/*------------------------------------
Heading
------------------------------------*/

.ss-newsletter-card h2{

    font-size:40px;

    font-weight:800;

    color:#172554;

    margin-bottom:20px;

}

.ss-newsletter-card p{

    max-width:700px;

    margin:0 auto 25px;

    color:#64748b;

    font-size:14px;

    line-height:1.9;

}

/*------------------------------------
Form
------------------------------------*/

.ss-newsletter-form{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:18px;

    flex-wrap:wrap;

}

/*------------------------------------
Input Box
------------------------------------*/

.ss-newsletter-input{

    position:relative;

    flex:1;

    min-width:320px;

}

.ss-newsletter-input i{

    position:absolute;

    left:24px;

    top:50%;

    transform:translateY(-50%);

    color:#ff7a00;

    font-size:18px;

}

.ss-newsletter-input input{

    width:100%;

    height:66px;

    border:none;

    outline:none;

    border-radius:60px;

    background:#fff7f2;

    padding:0 25px 0 58px;

    font-size:16px;

    color:#334155;

    transition:.35s;

}

.ss-newsletter-input input:focus{

    background:#ffffff;

    box-shadow:

        0 0 0 4px rgba(255,122,0,.12);

}

/*------------------------------------
Button
------------------------------------*/

.ss-newsletter-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:12px;

    height:66px;

    padding:0 38px;

    border:none;

    border-radius:60px;

    background:

    linear-gradient(
        135deg,
        #ff9d00,
        #ff5e62
    );

    color:#ffffff;

    font-size:17px;

    font-weight:700;

    cursor:pointer;

    transition:.35s;

}

.ss-newsletter-btn:hover{

    transform:translateY(-5px);

    box-shadow:

        0 22px 45px rgba(255,125,0,.28);

}

/*------------------------------------
Privacy Note
------------------------------------*/

.ss-newsletter-note{

    margin-top:26px;

    color:#64748b;

    font-size:15px;

}

.ss-newsletter-note i{

    color:#22c55e;

    margin-right:6px;

}

/*------------------------------------
Floating Shapes
------------------------------------*/

.ss-news-shape{

    position:absolute;

    border-radius:50%;

    pointer-events:none;

}

.shape-one{

    width:140px;

    height:140px;

    top:-45px;

    right:-45px;

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

}

.shape-two{

    width:80px;

    height:80px;

    left:8%;

    bottom:30px;

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

}

.shape-three{

    width:42px;

    height:42px;

    right:22%;

    bottom:55px;

    background:rgba(255,180,0,.18);

}


/*==============================================================
 PART-6C
 NEWSLETTER FINAL POLISH
==============================================================*/

/*--------------------------------------------------
 Card Hover
--------------------------------------------------*/

.ss-newsletter-card{

    transition:
        transform .45s ease,
        box-shadow .45s ease;

}

.ss-newsletter-card:hover{

    transform:translateY(-8px);

    box-shadow:
        0 45px 90px rgba(15,23,42,.12);

}

/*--------------------------------------------------
 Button Shine Effect
--------------------------------------------------*/

.ss-newsletter-btn{

    position:relative;

    overflow:hidden;

}

.ss-newsletter-btn::before{

    content:"";

    position:absolute;

    top:0;

    left:-130%;

    width:60%;

    height:100%;

    background:

    linear-gradient(

        90deg,

        transparent,

        rgba(255,255,255,.40),

        transparent

    );

    transform:skewX(-20deg);

    transition:1s;

}

.ss-newsletter-btn:hover::before{

    left:170%;

}

/*--------------------------------------------------
 Input Hover
--------------------------------------------------*/

.ss-newsletter-input input:hover{

    background:#ffffff;

}

/*--------------------------------------------------
 Input Placeholder
--------------------------------------------------*/

.ss-newsletter-input input::placeholder{

    color:#94a3b8;

}

/*--------------------------------------------------
 Badge Animation
--------------------------------------------------*/

.ss-newsletter-badge{

    transition:.35s;

}

.ss-newsletter-card:hover .ss-newsletter-badge{

    transform:translateY(-3px);

}

/*--------------------------------------------------
 Floating Shapes
--------------------------------------------------*/

@keyframes ssNewsletterFloat{

    0%,100%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-14px);

    }

}

.shape-one{

    animation:ssNewsletterFloat 7s ease-in-out infinite;

}

.shape-two{

    animation:ssNewsletterFloat 9s ease-in-out infinite reverse;

}

.shape-three{

    animation:ssNewsletterFloat 6s ease-in-out infinite;

}

/*--------------------------------------------------
 Icon Animation
--------------------------------------------------*/

.ss-newsletter-btn i{

    transition:transform .35s ease;

}

.ss-newsletter-btn:hover i{

    transform:translateX(5px);

}

/*--------------------------------------------------
 Responsive
--------------------------------------------------*/

@media(max-width:991px){

    .ss-newsletter-section{

        padding:90px 0;

    }

    .ss-newsletter-card{

        padding:55px 35px;

    }

    .ss-newsletter-card h2{

        font-size:38px;

    }

}

@media(max-width:767px){

    .ss-newsletter-section{

        padding:70px 0;

    }

    .ss-newsletter-card{

        padding:36px 22px;

        border-radius:24px;

    }

    .ss-newsletter-card h2{

        font-size:30px;

        line-height:1.3;

    }

    .ss-newsletter-card p{

        font-size:15px;

        line-height:1.8;

        margin-bottom:30px;

    }

    .ss-newsletter-form{

        flex-direction:column;

        gap:16px;

    }

    .ss-newsletter-input{

        min-width:100%;

        width:100%;

    }

    .ss-newsletter-btn{

        width:100%;

        justify-content:center;

    }

    .shape-one{

        width:90px;

        height:90px;

    }

    .shape-two{

        width:60px;

        height:60px;

    }

    .shape-three{

        display:none;

    }

}

/*--------------------------------------------------
 Accessibility
--------------------------------------------------*/

.ss-newsletter-btn:focus,

.ss-newsletter-input input:focus{

    outline:none;

}
/* --------------------CTA SECTION END------------------------------------- */
/* --------------------CTA SECTION END------------------------------------- */
/* --------------------CTA SECTION END------------------------------------- */


/*==================================================
  Sticky Header
==================================================*/
/*==================================================
  Sticky Header
==================================================*/
#siteHeader{
    position:relative;
    z-index:9999;
}

/* Navbar Default */

#mainNavbar{

    transition:
        all .35s ease;

    background:#fff;

    z-index:9999;

}

/* Sticky Mode */

#mainNavbar.is-sticky{

    position:fixed;

    top:0;

    left:0;

    width:100%;

    animation:stickyDown .35s ease;

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

}

/* Hide Topbar */

body.header-sticky .top-bar{

    margin-top:-44px;

    opacity:0;

    visibility:hidden;

    transition:.35s;

}

/* Navbar Animation */

@keyframes stickyDown{

    from{

        transform:translateY(-100%);

        opacity:0;

    }

    to{

        transform:translateY(0);

        opacity:1;

    }

}

/* Prevent Content Jump */

body.header-sticky{

    padding-top:90px;

}

/* Mobile */

@media(max-width:991px){

    body.header-sticky{

        padding-top:76px;

    }

}


/*==================================================
  Sticky Header end
==================================================*/

/*==================================================
  Sticky Header end
==================================================*/

/*====================================================
Back To Top
====================================================*/

.back-to-top{

    position:fixed;

    right:30px;

    bottom:30px;

    width:58px;

    height:58px;

    border:none;

    border-radius:50%;

    background:linear-gradient(
        135deg,
        #ff9800,
        #ff5f6d
    );

    color:#fff;

    font-size:30px;

    display:flex;

    align-items:center;

    justify-content:center;

    cursor:pointer;

    box-shadow:
        0 15px 35px rgba(255,123,0,.35);

    opacity:0;

    visibility:hidden;

    transform:
        translateY(20px);

    transition:.35s;

    z-index:9999;

}

.back-to-top.show{

    opacity:1;

    visibility:visible;

    transform:
        translateY(0);

}

.back-to-top:hover{

    transform:
        translateY(-6px);

    box-shadow:
        0 22px 45px rgba(255,123,0,.45);

}

.back-to-top i{

    line-height:1;

}

@media(max-width:768px){

    .back-to-top{

        width:50px;

        height:50px;

        right:18px;

        bottom:18px;

        font-size:26px;

    }

}
/*====================================================
Back To Top end
====================================================*/


/*====================================================
COMING SOON PAGE
====================================================*/

.coming-soon-section{

    position:relative;

    overflow:hidden;

    padding:120px 0;

    min-height:75vh;

    display:flex;

    align-items:center;

    background:
    linear-gradient(
        135deg,
        #fffaf5 0%,
        #fffdf8 45%,
        #fff7ef 100%
    );

}

/* Background Glow */

.coming-soon-section::before{

    content:"";

    position:absolute;

    width:650px;

    height:650px;

    left:-180px;

    top:-180px;

    background:
    radial-gradient(
        circle,
        rgba(255,153,0,.12),
        transparent 70%
    );

    pointer-events:none;

}

.coming-soon-section::after{

    content:"";

    position:absolute;

    width:550px;

    height:550px;

    right:-150px;

    bottom:-150px;

    background:
    radial-gradient(
        circle,
        rgba(255,94,98,.10),
        transparent 70%
    );

    pointer-events:none;

}

/* Card */

.coming-card{

    position:relative;

    text-align:center;

    background:#fff;

    border-radius:32px;

    padding:80px 70px;

    overflow:hidden;

    box-shadow:
    0 25px 70px rgba(18,38,63,.08);

}

/* Glass Decoration */

.coming-card::before{

    content:"";

    position:absolute;

    width:180px;

    height:180px;

    top:-60px;

    right:-60px;

    border-radius:50%;

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

}

.coming-card::after{

    content:"";

    position:absolute;

    width:120px;

    height:120px;

    bottom:-40px;

    left:-40px;

    border-radius:50%;

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

}

/* Badge */

.coming-badge{

    display:inline-block;

    padding:12px 28px;

    border-radius:40px;

    font-weight:700;

    margin-bottom:30px;

    color:#ff7300;

    background:#fff3e7;

}

/* Title */

.coming-card h1{

    font-size:58px;

    font-weight:800;

    color:#172b4d;

    line-height:1.15;

    margin-bottom:25px;

}

/* Description */

.coming-card p{

    max-width:720px;

    margin:auto;

    color:#667085;

    font-size:20px;

    line-height:1.9;

}

/* Buttons */

.coming-buttons{

    margin-top:50px;

    display:flex;

    justify-content:center;

    gap:20px;

    flex-wrap:wrap;

}

.coming-buttons .btn{

    min-width:220px;

    height:60px;

    border-radius:50px;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:17px;

    font-weight:700;

}

.coming-buttons .btn i{

    margin-right:10px;

}

/* Responsive */

@media(max-width:991px){

    .coming-card{

        padding:60px 35px;

    }

    .coming-card h1{

        font-size:42px;

    }

}

@media(max-width:576px){

    .coming-soon-section{

        padding:80px 0;

    }

    .coming-card{

        padding:40px 25px;

        border-radius:22px;

    }

    .coming-card h1{

        font-size:32px;

    }

    .coming-card p{

        font-size:17px;

    }

    .coming-buttons{

        gap:15px;

    }

    .coming-buttons .btn{

        width:100%;

    }

}




/*====================================================
COMING SOON ILLUSTRATION
====================================================*/

.coming-illustration{

    position:relative;

    width:180px;

    height:180px;

    margin:0 auto 35px;

}

/* Book */

.coming-book{

    width:130px;

    height:130px;

    margin:auto;

    border-radius:32px;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:58px;

    background:
    linear-gradient(
        135deg,
        #ff9800,
        #ff5f6d
    );

    box-shadow:
    0 25px 45px rgba(255,123,0,.25);

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

}

/* Pencil */

.coming-pencil{

    position:absolute;

    right:-8px;

    top:18px;

    width:58px;

    height:58px;

    border-radius:50%;

    background:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#ff7300;

    font-size:24px;

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

    animation:ssPencilRotate 8s linear infinite;

}

/* Stars */

.coming-stars span{

    position:absolute;

    width:12px;

    height:12px;

    border-radius:50%;

    background:#ffb000;

}

.coming-stars span:nth-child(1){

    left:0;

    top:18px;

}

.coming-stars span:nth-child(2){

    right:8px;

    bottom:22px;

}

.coming-stars span:nth-child(3){

    left:20px;

    bottom:0;

}

/* Floating */

@keyframes ssBookFloat{

    0%,100%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-12px);

    }

}

@keyframes ssPencilRotate{

    from{

        transform:rotate(0deg);

    }

    to{

        transform:rotate(360deg);

    }

}


/*====================================================
COMING SOON
FINAL POLISH
====================================================*/

/*------------------------------------
Smooth Entrance
------------------------------------*/

.coming-card{

    animation:ssComingFade .9s ease both;

}

@keyframes ssComingFade{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*------------------------------------
Background Floating Blobs
------------------------------------*/

.coming-soon-section .blob{

    position:absolute;

    border-radius:50%;

    pointer-events:none;

    filter:blur(2px);

    animation:ssBlobMove 12s ease-in-out infinite;

}

.coming-soon-section .blob-1{

    width:130px;

    height:130px;

    top:8%;

    left:6%;

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

}

.coming-soon-section .blob-2{

    width:180px;

    height:180px;

    right:5%;

    top:18%;

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

    animation-delay:2s;

}

.coming-soon-section .blob-3{

    width:90px;

    height:90px;

    left:18%;

    bottom:12%;

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

    animation-delay:4s;

}

.coming-soon-section .blob-4{

    width:150px;

    height:150px;

    right:15%;

    bottom:8%;

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

    animation-delay:6s;

}

@keyframes ssBlobMove{

    0%,100%{

        transform:translateY(0) translateX(0);

    }

    50%{

        transform:translateY(-20px) translateX(15px);

    }

}

/*------------------------------------
Card Hover
------------------------------------*/

.coming-card{

    transition:

        transform .45s ease,

        box-shadow .45s ease;

}

.coming-card:hover{

    transform:translateY(-8px);

    box-shadow:

        0 40px 90px rgba(20,35,70,.12);

}

/*------------------------------------
Buttons
------------------------------------*/

.coming-buttons .btn{

    transition:all .35s ease;

}

.coming-buttons .btn:hover{

    transform:translateY(-5px);

}

/*------------------------------------
Primary Button
------------------------------------*/

.coming-buttons .btn-primary{

    background:

    linear-gradient(

        135deg,

        #ff9800,

        #ff5f6d

    );

    border:none;

}

.coming-buttons .btn-primary:hover{

    box-shadow:

        0 18px 40px rgba(255,122,0,.30);

}

/*------------------------------------
Outline Button
------------------------------------*/

.coming-buttons .btn-outline-dark{

    border-width:2px;

}

.coming-buttons .btn-outline-dark:hover{

    background:#172554;

    border-color:#172554;

}

/*------------------------------------
Text Selection
------------------------------------*/

.coming-card::selection{

    background:#ff9800;

    color:#fff;

}

/*------------------------------------
Responsive Polish
------------------------------------*/

@media(max-width:991px){

    .coming-card{

        border-radius:28px;

    }

}

@media(max-width:768px){

    .coming-soon-section{

        min-height:auto;

    }

    .coming-card{

        padding:35px 22px;

    }

    .coming-book{

        width:105px;

        height:105px;

        font-size:46px;

    }

    .coming-pencil{

        width:48px;

        height:48px;

        font-size:20px;

    }

}

@media(max-width:480px){

    .coming-card h1{

        font-size:28px;

    }

    .coming-card p{

        font-size:16px;

        line-height:1.8;

    }

}
/*====================================================
COMING SOON PAGE end
====================================================*/


/*======================================
CART BADGE
======================================*/

.cart-badge{

    position:absolute;

    top:-6px;

    right:-6px;

    min-width:20px;

    height:20px;

    padding:0 6px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50px;

    background:#ff5f6d;

    color:#fff;

    font-size:.70rem;

    font-weight:700;

    box-shadow:
        0 8px 18px rgba(255,95,109,.25);

}

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

.navbar-actions{

    display:flex;

    align-items:center;

    gap:14px;

}


/*=========================================
Action Buttons
=========================================*/

.nav-action-btn{

    position:relative;

    width:52px;

    height:52px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

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

    background:#ffffff !important;

    color:#16213e !important;

    transition:.35s;

    text-decoration:none;

    box-shadow:

        0 10px 25px rgba(0,0,0,.05);

}

.nav-action-btn:hover{

    color:#ffffff !important;

    background:linear-gradient(

        135deg,

        #ff7a18,

        #ff5f6d

    ) !important;

    border-color:transparent;

    transform:translateY(-3px);

    box-shadow:

        0 18px 40px rgba(255,122,24,.25);

}

.nav-action-btn i{

    font-size:1.18rem;

}


/*==================================================
CART BADGE
==================================================*/

.cart-badge{

    position:absolute;

    top:-6px;

    right:-4px;

    min-width:22px;

    height:22px;

    padding:0 6px;

    border-radius:50px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#ff3b30;

    color:#ffffff;

    font-size:.70rem;

    font-weight:700;

    border:2px solid #ffffff;

    animation:cartPulse 2s infinite;

}


@keyframes cartPulse{

    0%{

        transform:scale(1);

    }

    50%{

        transform:scale(1.15);

    }

    100%{

        transform:scale(1);

    }

}


/*==================================================
CHECKOUT BUTTON
==================================================*/

.checkout-btn{

    height:52px;

    padding:0 26px;

    border-radius:50px;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    border:2px solid #ff7a18;

    background:#ffffff;

    color:#ff7a18;

    font-weight:700;

    transition:.35s;

    text-decoration:none;

}

.checkout-btn:hover{

    background:linear-gradient(

        135deg,

        #ff7a18,

        #ff5f6d

    );

    color:#ffffff;

    border-color:transparent;

    transform:translateY(-3px);

    box-shadow:

        0 18px 40px rgba(255,122,24,.25);

}


/*==================================================
PUBLISH BUTTON
==================================================*/

.navbar-actions .btn-primary{

    height:52px;

    padding:0 28px;

    border-radius:50px;

}


/*==================================================
LOGIN BUTTON
==================================================*/

.navbar-actions .btn-outline-dark{

    height:52px;

    padding:0 24px;

    border-radius:50px;

}


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

@media(max-width:991px){

    .navbar-actions{

        display:none;

    }

}