/* =========================================================
LEAVE LICENSE AGREEMENT PAGE CSS
FILE : agreement2.css
========================================================= */

.ll-page-wrapper{
background:#f4f7fb;
padding:40px 0 70px;
font-family:'Poppins',sans-serif;
overflow:hidden;
}

.ll-page-wrapper .container{
max-width:1180px;
}

/* =========================================================
SECTION TITLE
========================================================= */

.ll-section-title{
font-size:34px;
font-weight:800;
color:#162447;
margin-bottom:28px;
line-height:1.3;
position:relative;
padding-left:18px;
}

.ll-section-title::before{
content:'';
position:absolute;
left:0;
top:6px;
width:6px;
height:36px;
border-radius:30px;
background:#f4a000;
}

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

.ll-hero-section{
background:linear-gradient(135deg,#132247,#1e3970);
border-radius:30px;
padding:65px;
position:relative;
overflow:hidden;
margin-bottom:40px;
box-shadow:0 18px 45px rgba(0,0,0,0.08);
}

.ll-hero-section::before{
content:'';
position:absolute;
right:-120px;
top:-120px;
width:320px;
height:320px;
background:rgba(255,255,255,0.05);
border-radius:50%;
}

.ll-hero-section::after{
content:'';
position:absolute;
left:-90px;
bottom:-90px;
width:220px;
height:220px;
background:rgba(255,255,255,0.04);
border-radius:50%;
}

.ll-badge{
display:inline-flex;
align-items:center;
gap:10px;
background:rgba(255,255,255,0.12);
padding:10px 18px;
border-radius:50px;
color:#fff;
font-size:13px;
font-weight:600;
margin-bottom:22px;
backdrop-filter:blur(10px);
}

.ll-title{
font-size:54px;
line-height:1.12;
font-weight:800;
color:#fff;
margin-bottom:24px;
max-width:760px;
}

.ll-description{
font-size:17px;
line-height:1.95;
color:rgba(255,255,255,0.88);
margin-bottom:32px;
max-width:760px;
}

.ll-tags{
display:flex;
flex-wrap:wrap;
gap:12px;
margin-bottom:35px;
}

.ll-tags span{
background:#fff;
padding:11px 18px;
border-radius:50px;
font-size:14px;
font-weight:700;
color:#132247;
}

.ll-stats{
display:flex;
gap:18px;
flex-wrap:wrap;
margin-bottom:35px;
}

.ll-stats div{
background:rgba(255,255,255,0.08);
padding:20px 24px;
border-radius:20px;
min-width:160px;
backdrop-filter:blur(10px);
}

.ll-stats strong{
display:block;
font-size:26px;
font-weight:800;
color:#fff;
margin-bottom:4px;
}

.ll-stats p{
margin:0;
font-size:14px;
color:#dbe4ff;
}

.ll-btns{
display:flex;
flex-wrap:wrap;
gap:16px;
}

.ll-primary-btn{
display:inline-flex;
align-items:center;
gap:10px;
background:#f4a000;
padding:16px 32px;
border-radius:14px;
color:#fff;
font-weight:700;
font-size:15px;
text-decoration:none;
transition:.3s;
box-shadow:0 10px 20px rgba(244,160,0,0.25);
}

.ll-primary-btn:hover{
background:#ffb400;
transform:translateY(-3px);
color:#fff;
}

.ll-secondary-btn{
display:inline-flex;
align-items:center;
gap:10px;
background:#fff;
padding:16px 32px;
border-radius:14px;
color:#132247;
font-weight:700;
font-size:15px;
text-decoration:none;
transition:.3s;
}

.ll-secondary-btn:hover{
transform:translateY(-3px);
color:#132247;
}

.ll-image-box{
position:relative;
text-align:center;
}

.ll-image-box img{
width:100%;
max-width:340px;
border-radius:24px;
background:#fff;
padding:14px;
box-shadow:0 20px 40px rgba(0,0,0,0.12);
}

.ll-floating-card{
position:absolute;
right:-10px;
bottom:25px;
background:#fff;
padding:14px 18px;
border-radius:16px;
font-size:14px;
font-weight:700;
color:#132247;
box-shadow:0 10px 25px rgba(0,0,0,0.1);
}

/* =========================================================
GRID SECTIONS
========================================================= */

.ll-use-grid,
.ll-city-grid,
.ll-related-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:24px;
margin-bottom:40px;
}

.ll-use-card,
.ll-city-card{
background:#fff;
padding:30px 26px;
border-radius:24px;
box-shadow:0 12px 30px rgba(0,0,0,0.04);
transition:.3s;
border:1px solid #edf1f7;
}

.ll-use-card:hover,
.ll-city-card:hover{
transform:translateY(-5px);
}

.ll-use-card i{
font-size:30px;
color:#f4a000;
margin-bottom:18px;
}

.ll-use-card h3,
.ll-city-card h3{
font-size:23px;
font-weight:700;
margin-bottom:12px;
color:#162447;
}

.ll-use-card p,
.ll-city-card p{
margin:0;
font-size:15px;
line-height:1.8;
color:#555;
}

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

.ll-comparison-box{
background:#fff;
padding:40px;
border-radius:28px;
margin-bottom:40px;
box-shadow:0 12px 30px rgba(0,0,0,0.04);
}

.ll-comparison-table{
overflow:auto;
}

.ll-comparison-table table{
width:100%;
border-collapse:collapse;
}

.ll-comparison-table th{
background:#162447;
padding:18px;
color:#fff;
font-size:15px;
font-weight:700;
}

.ll-comparison-table td{
padding:18px;
border-bottom:1px solid #edf1f7;
font-size:15px;
color:#444;
}

/* =========================================================
TIMELINE
========================================================= */

.ll-timeline{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:24px;
margin-bottom:40px;
}

.ll-step{
background:#fff;
padding:28px;
border-radius:24px;
text-align:center;
box-shadow:0 12px 30px rgba(0,0,0,0.04);
}

.ll-step-number{
width:60px;
height:60px;
margin:auto;
margin-bottom:18px;
border-radius:50%;
background:#162447;
color:#fff;
display:flex;
align-items:center;
justify-content:center;
font-size:22px;
font-weight:800;
}

.ll-step h3{
font-size:22px;
font-weight:700;
margin-bottom:12px;
color:#162447;
}

.ll-step p{
font-size:15px;
line-height:1.8;
color:#555;
margin:0;
}

/* =========================================================
CONTENT BOX
========================================================= */

.ll-content-box,
.ll-registration-box,
.ll-doc-box,
.ll-benefits-box,
.ll-faq-box,
.ll-right-card{
background:#fff;
padding:40px;
border-radius:28px;
margin-bottom:40px;
box-shadow:0 12px 30px rgba(0,0,0,0.04);
}

.ll-clause{
padding:28px;
border-radius:20px;
border:1px solid #edf1f7;
margin-bottom:20px;
background:#fafcff;
}

.ll-clause:last-child{
margin-bottom:0;
}

.ll-clause h3{
font-size:24px;
font-weight:700;
margin-bottom:12px;
color:#162447;
}

.ll-clause p{
margin:0;
font-size:15px;
line-height:1.9;
color:#555;
}

/* =========================================================
RIGHTS
========================================================= */

.ll-right-card h3{
font-size:28px;
font-weight:700;
margin-bottom:20px;
color:#162447;
}

.ll-right-card ul{
padding-left:18px;
margin:0;
}

.ll-right-card li{
margin-bottom:14px;
font-size:16px;
line-height:1.8;
color:#555;
}

/* =========================================================
DOCUMENTS
========================================================= */

.ll-doc-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:18px;
}

.ll-doc-grid div{
background:#f4f7fb;
padding:18px;
border-radius:16px;
font-weight:600;
text-align:center;
font-size:15px;
transition:.3s;
}

.ll-doc-grid div:hover{
background:#162447;
color:#fff;
}

/* =========================================================
BENEFITS
========================================================= */

.ll-benefits-box ul{
padding-left:22px;
margin:0;
}

.ll-benefits-box li{
margin-bottom:14px;
font-size:16px;
line-height:1.9;
color:#555;
}

/* =========================================================
RELATED
========================================================= */

.ll-related-grid{
grid-template-columns:repeat(2,1fr);
}

.ll-related-grid a{
display:block;
background:#fff;
padding:24px;
border-radius:20px;
text-decoration:none;
font-size:18px;
font-weight:700;
color:#162447;
border:1px solid #edf1f7;
transition:.3s;
box-shadow:0 10px 25px rgba(0,0,0,0.03);
}

.ll-related-grid a:hover{
background:#162447;
color:#fff;
transform:translateY(-4px);
}

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

.ll-cta-box{
background:linear-gradient(135deg,#f4a000,#f0b22c);
padding:55px;
border-radius:30px;
text-align:center;
margin-bottom:40px;
position:relative;
overflow:hidden;
box-shadow:0 15px 35px rgba(244,160,0,0.2);
}

.ll-cta-box::before{
content:'';
position:absolute;
right:-70px;
top:-70px;
width:220px;
height:220px;
border-radius:50%;
background:rgba(255,255,255,0.1);
}

.ll-cta-box h2{
font-size:42px;
font-weight:800;
color:#fff;
margin-bottom:16px;
}

.ll-cta-box p{
font-size:17px;
color:#fff;
margin-bottom:30px;
}

.ll-cta-btn{
display:inline-flex;
align-items:center;
gap:10px;
background:#fff;
padding:17px 36px;
border-radius:14px;
font-weight:700;
font-size:16px;
color:#162447;
text-decoration:none;
transition:.3s;
}

.ll-cta-btn:hover{
transform:translateY(-3px);
color:#162447;
}

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

.ll-faq-item{
background:#f8fafc;
padding:26px;
border-radius:20px;
margin-bottom:20px;
border:1px solid #edf1f7;
transition:.3s;
}

.ll-faq-item:hover{
transform:translateY(-3px);
}

.ll-faq-item h3{
font-size:22px;
font-weight:700;
margin-bottom:12px;
color:#162447;
}

.ll-faq-item p{
margin:0;
font-size:15px;
line-height:1.9;
color:#555;
}

/* =========================================================
AUTHOR
========================================================= */

.ll-author-box{
text-align:center;
padding:20px;
}

.ll-author-box h4{
font-size:22px;
font-weight:700;
margin-bottom:10px;
color:#162447;
}

.ll-author-box p{
font-size:15px;
color:#666;
}

/* =========================================================
MOBILE STICKY BUTTON
========================================================= */

.mobile-sticky-btn{
display:none;
}

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

@media(max-width:1200px){

.ll-title{
font-size:46px;
}

}

@media(max-width:992px){

.ll-hero-section{
padding:45px;
}

.ll-title{
font-size:38px;
}

.ll-use-grid,
.ll-city-grid,
.ll-doc-grid,
.ll-timeline{
grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:768px){

.ll-page-wrapper{
padding:15px 0 90px;
}

.ll-section-title{
font-size:26px;
}

.ll-hero-section{
padding:32px 24px;
border-radius:24px;
}

.ll-title{
font-size:32px;
line-height:1.2;
}

.ll-description{
font-size:15px;
line-height:1.85;
}

.ll-tags{
gap:10px;
}

.ll-tags span{
font-size:13px;
padding:9px 14px;
}

.ll-stats{
flex-direction:column;
}

.ll-use-grid,
.ll-city-grid,
.ll-doc-grid,
.ll-related-grid,
.ll-timeline{
grid-template-columns:1fr;
}

.ll-comparison-box,
.ll-content-box,
.ll-registration-box,
.ll-doc-box,
.ll-benefits-box,
.ll-faq-box,
.ll-right-card{
padding:24px;
border-radius:22px;
}

.ll-cta-box{
padding:38px 22px;
}

.ll-cta-box h2{
font-size:30px;
}

.ll-image-box{
margin-top:30px;
}

.mobile-sticky-btn{
display:block;
position:fixed;
bottom:0;
left:0;
width:100%;
padding:12px;
background:#162447;
z-index:999;
box-shadow:0 -5px 20px rgba(0,0,0,0.1);
}

.mobile-sticky-btn a{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
background:#f4a000;
color:#fff;
padding:15px;
border-radius:14px;
font-weight:700;
font-size:16px;
text-decoration:none;
}

}