/*==========================================
RESET
===========================================*/

*{

margin:0;

padding:0;

box-sizing:border-box;

}

body{

font-family:"Poppins",sans-serif;

background:#f7f9fc;

color:#333;

line-height:1.8;

}

a{

text-decoration:none;

color:inherit;

}

.container{

width:min(1200px,92%);

margin:auto;

}

/*==========================================
NAVIGATION
===========================================*/

.terms-navbar{

position:sticky;

top:0;

left:0;

width:100%;

background:#fff;

border-bottom:1px solid #ececec;

box-shadow:0 8px 25px rgba(0,0,0,.05);

z-index:999;

}

.terms-navbar .container{

height:80px;

display:flex;

justify-content:space-between;

align-items:center;

}

.terms-logo{

display:flex;

align-items:center;

gap:14px;

font-size:22px;

font-weight:700;

color:#0B6B46;

}

.terms-logo img{

width:52px;

height:52px;

object-fit:contain;

}

.back-btn{

display:flex;

align-items:center;

justify-content:center;

gap:10px;

padding:12px 22px;

border-radius:14px;

background:#0B6B46;

color:#fff;

font-weight:600;

transition:.3s;

}

.back-btn:hover{

background:#095438;

transform:translateY(-2px);

}

/*==========================================
HERO
===========================================*/

.terms-hero{

background:linear-gradient(135deg,#0B6B46,#14a86d);

padding:90px 0;

text-align:center;

color:#fff;

}

.terms-hero h1{

font-size:46px;

font-weight:700;

margin-bottom:15px;

}

.terms-hero p{

max-width:700px;

margin:auto;

font-size:18px;

opacity:.95;

}

/*==========================================
CONTENT
===========================================*/

.terms-section{

padding:70px 0;

}

.terms-card{

background:#fff;

border-radius:25px;

padding:45px;

box-shadow:0 18px 45px rgba(0,0,0,.08);

border:1px solid #ececec;

}

.updated{

display:inline-flex;

align-items:center;

gap:8px;

padding:10px 18px;

background:#F2FBF7;

border-radius:50px;

color:#0B6B46;

font-weight:600;

margin-bottom:35px;

}

.updated span{

font-weight:700;

}

#termsContent h2{

font-size:28px;

font-weight:700;

margin:35px 0 15px;

color:#0B6B46;

position:relative;

padding-left:18px;

}

#termsContent h2::before{

content:"";

position:absolute;

left:0;

top:5px;

width:5px;

height:30px;

border-radius:10px;

background:#0B6B46;

}

#termsContent p{

font-size:16px;

color:#666;

margin-bottom:25px;

line-height:1.9;

}

/*==========================================
NOTICE BOX
===========================================*/

.notice-box{

margin-top:45px;

padding:25px;

border-radius:18px;

background:#FFF9E8;

border-left:6px solid #F4B400;

}

.notice-box h3{

color:#B56A00;

margin-bottom:10px;

font-size:20px;

}

.notice-box p{

color:#555;

margin:0;

}

/*==========================================
TABLE
===========================================*/

.terms-table{

width:100%;

border-collapse:collapse;

margin:35px 0;

overflow:hidden;

border-radius:15px;

}

.terms-table th{

background:#0B6B46;

color:#fff;

padding:16px;

text-align:left;

}

.terms-table td{

padding:16px;

border-bottom:1px solid #eee;

background:#fff;

}

.terms-table tr:nth-child(even) td{

background:#fafafa;

}

/*==========================================
LISTS
===========================================*/

#termsContent ul{

margin:20px 0 25px 25px;

}

#termsContent li{

margin-bottom:12px;

color:#666;

}

/*==========================================
FOOTER ACTIONS
===========================================*/

.terms-actions{

margin-top:50px;

display:flex;

justify-content:space-between;

align-items:center;

gap:20px;

flex-wrap:wrap;

}

.terms-btn{

padding:14px 28px;

border-radius:15px;

background:#0B6B46;

color:#fff;

font-weight:600;

display:flex;

align-items:center;

gap:10px;

transition:.3s;

}

.terms-btn:hover{

background:#095438;

transform:translateY(-2px);

}

.print-btn{

background:#f3f3f3;

color:#222;

}

.print-btn:hover{

background:#e6e6e6;

}

/*==========================================
RESPONSIVE
===========================================*/

@media(max-width:992px){

.terms-card{

padding:35px;

}

}

@media(max-width:768px){

.terms-navbar .container{

height:72px;

}

.terms-logo span{

font-size:18px;

}

.terms-logo img{

width:45px;

height:45px;

}

.back-btn{

padding:10px 16px;

font-size:14px;

}

.terms-hero{

padding:70px 0;

}

.terms-hero h1{

font-size:34px;

}

.terms-card{

padding:28px;

}

#termsContent h2{

font-size:23px;

}

}

@media(max-width:480px){

.terms-logo span{

display:none;

}

.terms-card{

padding:22px;

border-radius:18px;

}

.updated{

font-size:13px;

}

#termsContent h2{

font-size:20px;

}

#termsContent p{

font-size:15px;

}

.terms-actions{

flex-direction:column;

}

.terms-btn{

width:100%;

justify-content:center;

}

}