@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

/* RESET */
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:hidden}
body{overflow-x:hidden}

/* SHARED VARIABLES */
:root{
  --blue:#2E5FA3;--blue2:#3B6FBF;--blue3:#4A82D0;
  --bdk:#1E4080;
  --gray:#5A6A7E;--gray2:#8C9BAD;
  --gl:#F2F5FA;--white:#fff;--border:#D0D8E8;--text:#2C3848;
  --accent:var(--blue2);
  --green:#3AAA35;
  /* LILI SCHEME — hero section palette */
  --lili-dark:#646464;--lili-light:#F2F2F2;
}

/* BASE */
body{font-family:'Open Sans','HelveticaNeue','Helvetica Neue',Helvetica,Arial,sans-serif;color:var(--text);background:var(--white);font-size:15px;line-height:1.6}
a{text-decoration:none;color:inherit}

/* NAV */
nav{background:#fff;padding:0 5%;display:flex;align-items:center;justify-content:space-between;height:96px;position:fixed;top:0;left:0;right:0;width:100%;z-index:10000;box-shadow:0 1px 0 rgba(0,0,0,.09)}
body{padding-top:96px}
.logo{display:flex;align-items:center;gap:2px;flex-shrink:0}
.nav-links{display:flex;gap:4px;list-style:none;align-items:center}
.nav-links>li{position:relative}
.nav-links>li>a{color:#2D353F;font-size:13px;padding:8px 12px;border-radius:5px;display:flex;align-items:center;gap:4px;transition:background .15s;white-space:nowrap}
.nav-links>li>a:hover,.nav-links>li.open>a{background:rgba(0,0,0,.06);color:#2D353F}
.nav-cta{background:#1A7FA0!important;color:#fff!important;font-weight:700!important;position:relative;overflow:hidden}
.nav-cta::after{content:'';position:absolute;top:-50%;left:-80%;width:50%;height:200%;background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,.45) 50%,rgba(255,255,255,0) 100%);transform:skewX(-20deg);transition:none}
.nav-cta:hover::after{transform:skewX(-20deg) translateX(420%);transition:transform .55s ease}
.nav-active{background:rgba(0,0,0,.06)!important;color:#2D353F!important}
.nav-login{background:#fff!important;border:1px solid rgba(0,0,0,.22)!important;color:#2D353F!important;font-weight:600!important;padding:8px 18px!important}
.nav-login:hover{background:rgba(0,0,0,.05)!important;color:#2D353F!important;border-color:rgba(0,0,0,.4)!important}
.caret{font-size:9px;opacity:.55}

/* DROPDOWNS */
.dropdown{display:none;position:absolute;top:calc(100% + 8px);left:0;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 12px 48px rgba(28,46,74,.18);z-index:10001}
.dropdown::before{content:'';position:absolute;top:-8px;left:0;right:0;height:8px}
.dropdown.right{left:auto;right:0}
li.open .dropdown{display:block}
.dd-divider{height:1px;background:var(--border);margin:4px 0}
.dd-item{display:flex;align-items:flex-start;gap:12px;padding:11px 16px;transition:background .15s;cursor:pointer}
.dd-item:hover{background:var(--gl)}
.dd-icon{width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;margin-top:1px}
.di-blue{background:var(--gl);border:1px solid var(--border)}
.di-gray{background:var(--gl);border:1px solid var(--border)}
.dd-text h4{font-size:13px;font-weight:700;color:var(--text);margin-bottom:2px}
.dd-text p{font-size:11px;color:var(--gray);line-height:1.4}
.about-drop{min-width:290px;padding:0;overflow:hidden}
.about-head{background:var(--blue);padding:18px 16px;border-radius:14px 14px 0 0}
.about-head-lbl{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:rgba(255,255,255,.5);font-weight:700;margin-bottom:4px}
.about-head-title{font-size:15px;font-weight:800;color:#fff;margin-bottom:3px}
.about-head-sub{font-size:11px;color:rgba(255,255,255,.55);line-height:1.4}
.about-items{padding:6px 0}

/* HERO — Lili scheme (#646464 dark / #F2F2F2 light) */
.hero{color:var(--text);padding:72px 5% 64px}
.breadcrumb{font-size:12px;color:rgba(0,0,0,.45);margin-bottom:16px}
.breadcrumb a{color:rgba(0,0,0,.55)}
.breadcrumb span{color:rgba(0,0,0,.3);margin:0 6px}
.hero-tag,.hero-eyebrow{display:inline-flex;align-items:center;gap:10px;background:rgba(0,0,0,.06);border:1px solid rgba(0,0,0,.12);padding:6px 17px;border-radius:24px;font-size:13px;font-weight:700;color:rgba(0,0,0,.6);text-transform:uppercase;letter-spacing:1.2px;margin-bottom:20px}
.hero h1{font-size:40px;font-weight:800;line-height:1.1;margin-bottom:12px}
.hero h1 em{font-style:normal}
.hero h2{font-size:22px;font-weight:500;font-style:italic;color:var(--gray);line-height:1.35;margin-bottom:20px;margin-top:0}
.hero-sub{font-size:17px;color:var(--gray);max-width:580px;line-height:1.7;margin-bottom:32px}
.hero-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
.btn-w{background:#646464;color:#fff;padding:13px 26px;border-radius:7px;font-weight:700;font-size:14px;display:inline-block;margin-right:12px;position:relative;overflow:hidden}
.btn-w::after{content:'';position:absolute;top:-50%;left:-80%;width:50%;height:200%;background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,.45) 50%,rgba(255,255,255,0) 100%);transform:skewX(-20deg);transition:none}
.btn-w:hover::after{transform:skewX(-20deg) translateX(420%);transition:transform .55s ease}
.btn-o{border:1.5px solid rgba(0,0,0,.3);color:var(--text);padding:12px 24px;border-radius:7px;font-weight:600;font-size:14px;display:inline-block}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:28px}
.hero-trust{display:flex;gap:20px;flex-wrap:wrap}
.trust-item,.ti{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--gray2)}
.trust-dot,.td{width:5px;height:5px;border-radius:50%;background:var(--gray2)}

/* SECTIONS */
section{padding:68px 5%}
.sl,.section-label{font-size:17px;text-transform:uppercase;letter-spacing:1.5px;color:var(--accent);font-weight:700;margin-bottom:10px}
h2{font-size:30px;font-weight:700;line-height:1.25;margin-bottom:14px}
h2 span{color:var(--accent)}
.ss,.section-sub{color:var(--gray);font-size:15px;max-width:600px;margin-bottom:40px;line-height:1.7}

/* FOOTER */
footer{background:#646464;color:rgba(255,255,255,.7);padding:44px 5% 24px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px;font-size:13px}
footer h4{color:#fff;font-size:11px;font-weight:700;margin-bottom:12px;text-transform:uppercase;letter-spacing:.8px}
footer ul{list-style:none;display:flex;flex-direction:column;gap:8px}
footer ul li a:hover{color:#fff}
.footer-jv{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:7px;padding:12px 14px;margin-top:14px}
.footer-jv-title{font-size:12px;font-weight:700;color:#fff;margin-bottom:4px}
.footer-jv-body{font-size:11px;color:rgba(255,255,255,.45);line-height:1.6}
.footer-jv-body a{color:#A8C8F0}
.footer-bottom{background:#3A3A3A;color:rgba(255,255,255,.4);padding:14px 5%;font-size:12px;display:flex;justify-content:space-between}

/* HAMBURGER BUTTON */
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;background:none;border:none;cursor:pointer;padding:6px 4px;flex-shrink:0;margin-left:auto}
.nav-toggle span{width:22px;height:2px;background:#2D353F;border-radius:2px;display:block}

/* RESPONSIVE — SHARED */
@media(max-width:768px){
  body{padding-top:64px}
  nav{flex-wrap:wrap;height:auto!important;padding:10px 4%!important}
  .nav-toggle{display:flex}
  .nav-links{display:none;flex-direction:column;width:100%;padding:8px 0 12px;gap:2px;align-items:stretch}
  nav.open .nav-links{display:flex}
  .nav-links>li>a{padding:12px 14px;font-size:14px;border-radius:5px;white-space:normal;min-height:44px;display:flex;align-items:center}
  .dropdown{position:static;border:none;border-radius:8px;margin:4px 8px;width:calc(100% - 16px);box-shadow:0 2px 8px rgba(0,0,0,.25)}
  .dropdown.right{left:0;right:auto}
  .dropdown a{min-height:44px!important;display:flex!important;align-items:center!important}
  .hero-layout{grid-template-columns:1fr!important;gap:28px!important}
  .hero h1{font-size:28px!important}
  .hero{padding:56px 5% 48px!important}
  h2{font-size:22px}
  section{padding:48px 5%}
  footer{grid-template-columns:1fr 1fr;gap:20px}
  .footer-bottom{flex-direction:column;gap:8px;text-align:center}
  .btn-w,.btn-o,.btn-white,.btn-blue,.btn-outline{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
  input[type=text],input[type=email],input[type=password],select,textarea{min-height:44px!important;font-size:16px!important}
}

@media(max-width:480px){
  footer{grid-template-columns:1fr}
  h2{font-size:20px}
  .hero h1{font-size:24px!important}
  .hero{padding:44px 5% 40px!important}
  section{padding:36px 5%}
  .hero-sub{font-size:15px}
  .sl,.section-label{font-size:14px}
}

/* FOOTER SOCIAL */
.footer-social{margin-top:14px}
.footer-social-lbl{font-size:10px;text-transform:uppercase;letter-spacing:1.2px;color:rgba(255,255,255,.4);font-weight:700;margin-bottom:8px}
.footer-social-links{display:flex;gap:6px;flex-wrap:wrap}
.footer-social-link{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;color:rgba(255,255,255,.6);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:6px;transition:background .15s,color .15s}
.footer-social-link:hover{color:#fff!important;background:rgba(255,255,255,.18)}
.footer-bottom a{color:rgba(255,255,255,.28);transition:color .15s}
.footer-bottom a:hover{color:rgba(255,255,255,.6)}

/* FLOATING CTA */
@keyframes glisten-cta{0%,100%{filter:brightness(1) drop-shadow(0 0 3px rgba(58,170,53,.2))}40%{filter:brightness(1.25) drop-shadow(0 0 10px rgba(58,170,53,.55)) saturate(1.3)}70%{filter:brightness(1.05) drop-shadow(0 0 4px rgba(58,170,53,.25))}}
@keyframes float-cta-pulse{0%,100%{box-shadow:0 4px 20px rgba(26,92,40,.5),0 0 0 0 rgba(26,92,40,.35)}60%{box-shadow:0 4px 20px rgba(26,92,40,.5),0 0 0 10px rgba(26,92,40,0)}}
.float-cta{position:fixed;bottom:28px;right:28px;z-index:9999;display:inline-flex;align-items:center;gap:10px;background:#1a5c28;color:#fff;padding:14px 22px;border-radius:50px;font-weight:700;font-size:14px;text-decoration:none;box-shadow:0 4px 20px rgba(26,92,40,.5),0 0 0 0 rgba(26,92,40,.4);animation:float-cta-pulse 2.8s ease-in-out infinite}
.float-cta:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 8px 32px rgba(26,92,40,.65);animation:none}
.float-cta img{width:20px;height:20px;flex-shrink:0;animation:glisten-cta 3.2s ease-in-out infinite}