:root {
  --navy:#0b1628; --navy-light:#1e293b; --navy-mid:#334155;
  --gold:#00F5D4; --gold-light:#5EEAD4; --gold-dark:#10B981;
  --text:#0f172a; --text-dim:#475569; --text-muted:#94a3b8;
  --border:#cbd5e1; --bg-body:#f1f5f9;
}
html { background:#fff; min-height:100%; scroll-behavior:smooth; }
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Inter',sans-serif; background:#fff; color:var(--text); overflow-x:hidden; }
input,textarea,select,[contenteditable] { -webkit-user-select:text; user-select:text; }
h1,h2,h3,h4 { font-family:'Playfair Display',serif; }
::-webkit-scrollbar { width:5px; }
::-webkit-scrollbar-track { background:var(--bg-body); }
::-webkit-scrollbar-thumb { background:var(--gold); border-radius:3px; }
.scroll-progress { position:fixed; top:0; left:0; height:2px; background:var(--gold); z-index:999; transition:width .1s; width:0; }
.glass { background:#fff; border:1px solid #d1d5db; border-radius:20px; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.glass-sm { background:#fff; border:1px solid #d1d5db; border-radius:12px; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.text-gradient { background:linear-gradient(135deg,var(--gold),var(--gold-dark)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.btn-gold { background:linear-gradient(135deg,var(--gold),var(--gold-dark)); transition:all .3s; }
.btn-gold:hover { transform:translateY(-2px); box-shadow:0 8px 30px rgba(0,245,212,.3); }
.btn-outline-teal { background:transparent; border:1px solid rgba(0,245,212,.3); color:var(--gold); transition:all .3s; }
.btn-outline-teal:hover { background:rgba(0,245,212,.1); border-color:var(--gold); box-shadow:0 4px 20px rgba(0,245,212,.15); }
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.25); backdrop-filter:blur(8px); z-index:1000; display:none; align-items:center; justify-content:center; }
.modal-overlay.open { display:flex; }
.modal-overlay.open .modal-box { animation:slideUpBounce .5s cubic-bezier(.16,1,.3,1); }
.modal-box { background:#fff; border:1px solid var(--border); border-radius:20px; max-width:480px; width:92%; max-height:90vh; overflow-y:auto; padding:32px; box-shadow:0 20px 60px rgba(0,0,0,.12); }
.form-input { width:100%; background:#fff; border:1.5px solid #94a3b8; border-radius:12px; padding:14px 16px; font-size:.9rem; color:#0f172a; outline:none; transition:border-color .3s; font-family:'Inter',sans-serif; }
.form-input:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(0,245,212,.15); }
.form-input::placeholder { color:#94a3b8; }
.form-input option { color:#0b1628; background:#fff; }
.toast { position:fixed; bottom:100px; right:24px; z-index:2000; background:#fff; border:1px solid #94a3b8; border-radius:16px; padding:16px 24px; max-width:320px; box-shadow:0 10px 40px rgba(0,0,0,.15); transform:translateX(120%); transition:transform .4s cubic-bezier(.175,.885,.32,1.275); }
.toast.show { transform:translateX(0); }
.toast-msg { font-size:.85rem; color:#0f172a; }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .4s ease,padding .4s ease; padding:0 0; }
.faq-answer.open { max-height:500px; padding-bottom:16px; }
.mobile-menu { position:fixed; top:0; right:0; width:280px; height:100vh; background:rgba(255,255,255,.98); backdrop-filter:blur(20px); z-index:100; padding:100px 32px 32px; transform:translateX(100%); transition:transform .4s cubic-bezier(.16,1,.3,1); border-left:1px solid var(--border); }
.mobile-menu.open { transform:translateX(0); }
@keyframes slideUpBounce { 0%{opacity:0;transform:translateY(40px) scale(.96)} 60%{transform:translateY(-6px) scale(1.01)} 100%{opacity:1;transform:translateY(0) scale(1)} }
@keyframes pulseGlow { 0%,100%{box-shadow:0 4px 30px rgba(0,245,212,.3)} 50%{box-shadow:0 4px 50px rgba(0,245,212,.5)} }
@media(min-width:769px){.nav-link{display:inline-block!important}#menuBtn{display:none!important}}
@media(max-width:768px){.nav-link{display:none!important}#menuBtn{display:block!important}}
@media(max-width:640px){
  .glass,.glass-sm{box-shadow:0 1px 4px rgba(0,0,0,.04)}
  .modal-box{padding:24px 20px;margin:0 12px}
  .toast{right:12px;bottom:80px;max-width:calc(100vw - 24px)}
  .btn-gold{padding:12px 20px;font-size:.85rem}
  .btn-outline-teal{padding:12px 20px;font-size:.85rem}
}
@media(max-width:400px){
  .modal-box{padding:20px 16px;margin:0 8px;border-radius:16px}
}