:root{
  --bg: #f6f7fb;
  --bg2:#eef1f6;
  --card:#ffffff;
  --text:#101827;
  --muted:#5b6475;
  --border: rgba(15, 23, 42, 0.14);
  --shadow: 0 18px 45px rgba(15, 23, 42, 0.12);
  --gold:#f6c945;
  --ink:#0b0f19;
  --ink2:#121a2d;
  --r:18px;
  --t:180ms ease;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial, sans-serif;
  background: radial-gradient(circle at top, #ffffff 0, var(--bg2) 55%);
  color: var(--text);
  min-height:100vh;
}
body.theme-dark{
  --bg:#0b0f19;
  --bg2:#0f1629;
  --card:#0f172a;
  --text:#e5e7eb;
  --muted:#a5b0c2;
  --border: rgba(226, 232, 240, 0.16);
  --shadow: 0 22px 60px rgba(0,0,0,.45);
  background: radial-gradient(circle at top, #0f1629 0, #0b0f19 60%);
}
a{color:inherit}
.container{width:min(1120px, calc(100% - 2.5rem)); margin:0 auto}
.section{padding:3.4rem 0}
.hstack{display:flex; align-items:center; gap:.75rem}
.spread{display:flex; justify-content:space-between; align-items:center; gap:1rem}
.notice{
  background: linear-gradient(90deg, var(--gold), #ffeaa0);
  color: #111827;
  font-size:.88rem;
  padding:.65rem 1rem;
  border-bottom: 1px solid rgba(0,0,0,.08);
}
.notice b{font-weight:700}
.header{
  position: sticky; top:0; z-index:50;
  backdrop-filter: blur(14px);
  background: rgba(255,255,255,.85);
  border-bottom: 1px solid var(--border);
}
body.theme-dark .header{ background: rgba(11,15,25,.72); }
.navbar{height:64px}
.brand{
  display:flex; align-items:center; gap:.55rem;
  text-decoration:none; font-weight:700;
}
.brand img{width:32px; height:32px}
.navlinks{display:flex; gap:1.1rem; font-size:.95rem}
.navlinks a{ text-decoration:none; color: var(--muted); position:relative; padding:.15rem 0}
.navlinks a:after{
  content:""; position:absolute; left:0; bottom:-.25rem; height:2px; width:0;
  background: linear-gradient(90deg, var(--gold), #ffffff);
  transition: width var(--t);
  border-radius:999px;
}
.navlinks a:hover{color:var(--text)}
.navlinks a:hover:after{width:100%}
.iconbtn{
  width:36px;height:36px;border-radius:999px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.8);
  color: var(--muted);
  cursor:pointer;
  transition: transform var(--t), border-color var(--t), color var(--t);
}
body.theme-dark .iconbtn{background: rgba(15,23,42,.7)}
.iconbtn:hover{transform: translateY(-1px); border-color: var(--gold); color: var(--gold)}
.burger{display:none}
.mobile{display:none; border-top:1px solid var(--border); padding:.8rem 1rem}
.mobile a{display:block; padding:.35rem 0; text-decoration:none; color:var(--muted)}
.mobile a:hover{color:var(--text)}
.mobile.open{display:block}
.hero{padding:3.2rem 0 2.2rem}
.heroWrap{display:grid; grid-template-columns: 1.25fr 1fr; gap:2.2rem; align-items:center}
.badge{
  display:inline-flex; gap:.4rem; align-items:center;
  padding:.25rem .7rem;
  border:1px solid var(--border);
  background: rgba(255,255,255,.75);
  border-radius:999px;
  font-size:.78rem;
  color: var(--muted);
}
body.theme-dark .badge{background: rgba(15,23,42,.65)}
h1{margin:.8rem 0 .6rem; font-size: clamp(2.25rem, 4vw, 3.1rem); letter-spacing:-0.02em}
.accent{color: var(--gold)}
.lead{color:var(--muted); max-width: 42rem; line-height:1.55}
.actions{display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.35rem}
.note{margin-top:.75rem; color:var(--muted); font-size:.9rem}
.card{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r);
  box-shadow: var(--shadow);
  padding: 1.25rem 1.35rem;
}
.cards3{display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:1.2rem}
.kicker{font-size:.8rem; color:var(--muted); margin:0}
.card h2{margin:.35rem 0 .4rem; font-size:1.15rem}
.card p{margin:0; color:var(--muted); line-height:1.55}
.heroCards{display:grid; gap:1rem}
.heroCard{
  background: linear-gradient(135deg, rgba(246,201,69,.25), rgba(255,255,255,.65));
  border-radius: var(--r);
  border: 1px solid var(--border);
  padding: 1.05rem 1.2rem;
  box-shadow: var(--shadow);
}
body.theme-dark .heroCard{
  background: linear-gradient(135deg, rgba(246,201,69,.18), rgba(15,23,42,.65));
}
.heroCard.secondary{transform: translateX(10px)}
.pill{
  display:inline-flex; padding:.18rem .6rem; border-radius:999px;
  background: rgba(246,201,69,.18);
  border: 1px solid rgba(246,201,69,.35);
  font-size:.78rem;
  color: var(--text);
}
body.theme-dark .pill{color:#e5e7eb}
.btn{
  display:inline-flex; align-items:center; gap:.45rem;
  border-radius:999px;
  padding:.58rem 1.25rem;
  border:1px solid transparent;
  text-decoration:none;
  cursor:pointer;
  transition: transform var(--t), box-shadow var(--t), border-color var(--t);
  font-size:.95rem;
}
.btn:hover{transform: translateY(-1px)}
.btnPrimary{
  background: var(--ink);
  color: var(--gold);
  border-color: rgba(246,201,69,.85);
  box-shadow: 0 16px 40px rgba(11,15,25,.25);
}
.btnOutline{
  background: transparent;
  border-color: var(--border);
  color: var(--text);
}
.btnOutline:hover{border-color: rgba(246,201,69,.7)}
.split{display:grid; grid-template-columns: 1.15fr 1fr; gap:1.8rem; align-items:start}
.map{
  border-radius: var(--r);
  overflow:hidden;
  border:1px solid var(--border);
  box-shadow: var(--shadow);
}
.map iframe{width:100%; aspect-ratio: 4/3; border:0}
.timeline{list-style:none; margin:0; padding:0; border-left:1px solid rgba(148,163,184,.55); margin-left:.75rem}
.timeline li{padding:.5rem 0 .5rem .95rem; position:relative; color:var(--muted); line-height:1.55}
.timeline li::before{
  content:""; position:absolute; left:-.45rem; top:1.05rem;
  width:9px; height:9px; border-radius:999px;
  background: var(--gold);
}
.time{font-weight:700; color:var(--text); margin-right:.35rem}
.formGrid{display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:1rem 1.2rem}
.field{display:flex; flex-direction:column; gap:.35rem}
.field.full{grid-column:1/-1}
label{font-size:.9rem; color:var(--muted)}
input,select,textarea{
  width:100%;
  border-radius: 14px;
  border:1px solid var(--border);
  padding:.62rem .85rem;
  background: rgba(255,255,255,.8);
  color: var(--text);
}
body.theme-dark input,body.theme-dark select,body.theme-dark textarea{background: rgba(2,6,23,.35)}
textarea{min-height:130px; resize:vertical}
input:focus,select:focus,textarea:focus{outline:none; border-color: rgba(246,201,69,.85)}
.formMsg{margin:.4rem 0 0; font-size:.9rem; color:var(--muted)}
.footer{
  border-top:1px solid var(--border);
  background: rgba(255,255,255,.75);
  padding:1.4rem 0 1.6rem;
}
body.theme-dark .footer{background: rgba(11,15,25,.72)}
.footerTop{display:flex; justify-content:space-between; align-items:flex-start; gap:1rem}
.footerLinks{display:flex; gap:.9rem; flex-wrap:wrap}
.footerLinks a{color:var(--muted); text-decoration:none}
.footerLinks a:hover{color:var(--text)}
.socialRow{margin-top:.75rem; display:flex; align-items:center; gap:.6rem; color:var(--muted)}
.socialIcons{display:flex; gap:.45rem}
.socialIcons a{
  width:34px; height:34px; border-radius:999px;
  border:1px solid var(--border);
  display:inline-flex; align-items:center; justify-content:center;
  text-decoration:none;
  background: rgba(255,255,255,.85);
  transition: border-color var(--t), transform var(--t);
}
body.theme-dark .socialIcons a{background: rgba(15,23,42,.7)}
.socialIcons a:hover{border-color: rgba(246,201,69,.85); transform: translateY(-1px)}
.chatbot{position:fixed; right:1.1rem; bottom:1.1rem; z-index:60}
.chatToggle{
  width:52px;height:52px;border-radius:999px;
  border:1px solid rgba(246,201,69,.7);
  background: var(--ink);
  color: var(--gold);
  box-shadow: 0 22px 60px rgba(0,0,0,.25);
  cursor:pointer;
}
.chatToggle.hidden{display:none}
.chatPanel{
  position:absolute; right:0; bottom:0;
  width:min(340px, 92vw);
  transform: translateY(120%);
  opacity:0; pointer-events:none;
  transition: transform var(--t), opacity var(--t);
  border:1px solid rgba(148,163,184,.25);
  border-radius: 18px;
  overflow:hidden;
  box-shadow: 0 22px 60px rgba(0,0,0,.35);
  background: #0b0f19;
  color:#e5e7eb;
}
.chatPanel.open{transform: translateY(0); opacity:1; pointer-events:auto}
.chatHead{display:flex; justify-content:space-between; gap:.8rem; padding:.85rem .9rem; background: linear-gradient(135deg, #121a2d, #0b0f19)}
.chatTitle{font-weight:800}
.chatSub{font-size:.78rem; color:#b9c2d4}
.chatClose{border:0; background:transparent; color:#b9c2d4; cursor:pointer}
.chatMsgs{max-height:280px; overflow:auto; padding:.75rem .9rem .25rem}
.bubble{max-width:86%; padding:.45rem .65rem; border-radius: 14px; margin:.45rem 0; font-size:.86rem; line-height:1.35}
.bot{background: rgba(255,255,255,.08); border:1px solid rgba(148,163,184,.18)}
.user{background: rgba(246,201,69,.95); color:#111827; margin-left:auto}
.chatForm{display:flex; gap:.45rem; padding:.6rem .75rem; border-top:1px solid rgba(148,163,184,.18)}
.chatInput{flex:1; border-radius:999px; border:1px solid rgba(148,163,184,.25); padding:.35rem .7rem; background: rgba(2,6,23,.35); color:#e5e7eb}
.chatSend{border:0; border-radius:999px; padding:.35rem .8rem; background: var(--gold); color:#111827; cursor:pointer}
@media (max-width: 860px){
  .heroWrap{grid-template-columns: 1fr}
  .heroCards{order:-1}
  .cards3{grid-template-columns: 1fr}
  .split{grid-template-columns: 1fr}
  .navlinks{display:none}
  .burger{display:inline-flex}
}