/*
==================================================
Legal Documents Marketplace
Main Stylesheet
Version : 1.0
==================================================
*/

:root{

--primary:#0d6efd;
--secondary:#6c757d;
--success:#198754;
--danger:#dc3545;
--warning:#ffc107;
--dark:#212529;
--light:#f8f9fa;
--white:#ffffff;

--border:#e9ecef;

--radius:10px;

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

}

*{

margin:0;

padding:0;

box-sizing:border-box;

}

html{

scroll-behavior:smooth;

}

body{

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

background:#f5f7fb;

color:#333;

font-size:15px;

line-height:1.7;

}

a{

text-decoration:none;

transition:.3s;

}

img{

max-width:100%;

height:auto;

}




.sticky-top{
    z-index:100;
}

.navbar{
    z-index:1030;
}








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

.navbar{

background:#fff;

box-shadow:var(--shadow);

}

.navbar-brand{

font-weight:700;

font-size:24px;

}

.nav-link{

font-weight:500;

padding:12px 15px!important;

}

.nav-link:hover{

color:var(--primary)!important;

}

.navbar .btn{

border-radius:50px;

}

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

.hero{

padding:80px 0;

background:#fff;

}

.hero h1{

font-size:48px;

font-weight:700;

margin-bottom:20px;

}

.hero p{

font-size:18px;

color:#666;

}

/* ======================================
Cards
====================================== */

.card{

border:none;

border-radius:var(--radius);

box-shadow:var(--shadow);

overflow:hidden;

transition:.3s;

}

.card:hover{

transform:translateY(-5px);

}

.card img{

height:220px;

object-fit:cover;

}

.card-title{

font-weight:700;

font-size:20px;

}

.card .btn{

border-radius:8px;

}

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

.btn{

border-radius:8px;

font-weight:600;

padding:10px 18px;

}

.btn-success{

background:var(--success);

}

.btn-primary{

background:var(--primary);

}
/* ======================================
Document Page
====================================== */

.document-header{

background:#fff;

padding:40px;

border-radius:var(--radius);

box-shadow:var(--shadow);

margin-bottom:30px;

}

.document-title{

font-size:36px;

font-weight:700;

margin-bottom:15px;

}

.document-price{

font-size:32px;

font-weight:700;

color:var(--success);

}

.document-meta{

font-size:14px;

color:#777;

margin-top:15px;

}

.document-image{

border-radius:12px;

overflow:hidden;

margin-bottom:20px;

}

/* ======================================
Category Page
====================================== */

.category-banner{

background:#fff;

padding:40px;

border-radius:var(--radius);

box-shadow:var(--shadow);

margin-bottom:30px;

}

.category-banner h1{

font-size:38px;

font-weight:700;

}

.category-banner p{

color:#666;

margin-top:15px;

}

/* ======================================
Search
====================================== */

.search-box{

background:#fff;

padding:25px;

border-radius:var(--radius);

box-shadow:var(--shadow);

margin-bottom:30px;

}

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

.form-control,

.form-select{

border-radius:8px;

padding:12px 15px;

border:1px solid #ddd;

box-shadow:none;

}

.form-control:focus,

.form-select:focus{

border-color:var(--primary);

box-shadow:0 0 0 .2rem rgba(13,110,253,.15);

}

textarea{

resize:vertical;

}

/* ======================================
Tables
====================================== */

.table{

background:#fff;

}

.table th{

background:#f8f9fa;

font-weight:600;

}

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

.accordion-item{

border-radius:10px!important;

margin-bottom:10px;

overflow:hidden;

}

.accordion-button{

font-weight:600;

}

/* ======================================
Sidebar
====================================== */

.sidebar-widget{

background:#fff;

padding:25px;

border-radius:10px;

box-shadow:var(--shadow);

margin-bottom:25px;

}

.sidebar-widget h4{

margin-bottom:20px;

font-size:20px;

font-weight:700;

}

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

.badge{

padding:8px 12px;

font-size:13px;

border-radius:30px;

}

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

footer{

background:#1f2937;

color:#fff;

}

footer h5{

margin-bottom:20px;

font-weight:700;

}

footer a{

color:#ddd;

}

footer a:hover{

color:#fff;

}

footer ul{

list-style:none;

padding:0;

}

footer li{

margin-bottom:10px;

}

/* ======================================
Back To Top
====================================== */

#backToTop{

width:50px;

height:50px;

display:flex;

align-items:center;

justify-content:center;

}

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

@media(max-width:991px){

.hero{

padding:50px 0;

text-align:center;

}

.hero h1{

font-size:36px;

}

.document-title{

font-size:28px;

}

.category-banner h1{

font-size:30px;

}

.navbar .btn{

margin-top:10px;

width:100%;

}

}

@media(max-width:576px){

.hero h1{

font-size:28px;

}

.card img{

height:180px;

}

.document-price{

font-size:26px;

}

}

/* ==========================================
Breadcrumb
========================================== */

.breadcrumb{

background:#fff;

padding:15px 20px;

border-radius:10px;

box-shadow:var(--shadow);

margin-bottom:25px;

}

.breadcrumb a{

color:var(--primary);

font-weight:500;

}

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

.price-card{

background:#fff;

padding:30px;

border-radius:15px;

box-shadow:var(--shadow);

position:sticky;

top:100px;

}

.price-card h2{

font-size:42px;

font-weight:700;

color:var(--success);

}

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

.feature-list{

list-style:none;

padding:0;

}

.feature-list li{

padding:12px 0;

border-bottom:1px solid #eee;

}

.feature-list i{

color:green;

margin-right:10px;

}

/* ==========================================
Download Box
========================================== */

.download-box{

background:#e9f7ef;

border:1px solid #b7e4c7;

padding:20px;

border-radius:10px;

margin-top:20px;

}

/* ==========================================
Warning Box
========================================== */

.warning-box{

background:#fff8e1;

border-left:5px solid orange;

padding:20px;

margin:25px 0;

}

/* ==========================================
Information Box
========================================== */

.info-box{

background:#eef6ff;

border-left:5px solid #0d6efd;

padding:20px;

margin:25px 0;

}

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

.review{

background:#fff;

padding:20px;

border-radius:10px;

box-shadow:var(--shadow);

margin-bottom:20px;

}

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

.rating{

color:#ffc107;

font-size:20px;

}

/* ==========================================
CTA Banner
========================================== */

.cta-banner{

background:linear-gradient(135deg,#0d6efd,#0a58ca);

padding:50px;

border-radius:15px;

color:#fff;

text-align:center;

margin:50px 0;

}

.cta-banner h2{

font-size:40px;

font-weight:700;

}

/* ==========================================
Document Status
========================================== */

.status-free{

background:#198754;

color:#fff;

padding:6px 15px;

border-radius:30px;

}

.status-premium{

background:#dc3545;

color:#fff;

padding:6px 15px;

border-radius:30px;

}

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

.section-title{

font-size:34px;

font-weight:700;

margin-bottom:30px;

position:relative;

}

.section-title::after{

content:"";

width:80px;

height:4px;

background:#0d6efd;

display:block;

margin-top:12px;

}