
:root{
  --bg:#0a0a0e;
  --ink:#f9f6ff;
  --muted:#bdb6cf;
  --pink:#ff7ac6;
  --gold:#ffd96a;
  --mint:#69f7c2;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;color:var(--ink);background:radial-gradient(1000px 600px at 10% 0%,#180b2a 0%,transparent 60%),radial-gradient(900px 500px at 90% 10%,#0c2032 0%,transparent 55%),radial-gradient(800px 400px at 50% 100%,#1c0d2c 0%,transparent 60%),#0a0a0e;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial}
a{color:inherit}

/* HERO */
.hero{position:relative; padding: clamp(44px,8vw,96px) 20px 40px; text-align:center; overflow:hidden}
.logo{margin:0;font-size:clamp(36px,8vw,72px); letter-spacing:.02em; text-transform:uppercase; font-weight:900; line-height:1.05}
.logo span{background:linear-gradient(90deg,var(--gold),var(--mint));-webkit-background-clip:text;background-clip:text;color:transparent}
.logo em{font-style:normal;opacity:.8;margin:0 .25em}
.tag{margin:8px auto 12px;color:var(--muted);font-weight:600;letter-spacing:.06em}
.badge{display:inline-block;margin:6px 0 12px;padding:8px 12px;border:1px solid #ffffff20;border-radius:999px;background:linear-gradient(180deg,#ffffff10,#00000020)}
.cta-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.btn{padding:12px 18px;border-radius:12px;border:1px solid #ffffff22;text-decoration:none;font-weight:800;letter-spacing:.04em;text-transform:uppercase;font-size:14px;box-shadow:0 8px 24px #0000006a;background:linear-gradient(90deg,#ff7ac6,#ffd1e6);color:#2a071d}
.btn.book{background:linear-gradient(90deg,var(--mint),#b4ffe6); color:#03140d}

/* AI aura canvas */
#aura{position:absolute; inset:-10% -10% auto -10%; height:220px; z-index:-1; filter: blur(10px) opacity(.85);}

/* 3D RING */
.stage{padding: 12px 0 10px; display:flex; flex-direction:column; align-items:center; perspective:1400px;}
.ring{position:relative; width:min(92vw,1100px); height:420px; transform-style:preserve-3d; animation: spin 28s linear infinite; }
@keyframes spin{ from{ transform: rotateY(0deg) } to{ transform: rotateY(-360deg) } }

.panel{ position:absolute; top:50%; left:50%; transform-style:preserve-3d; width:min(78vw,360px); height:300px;
  border-radius:18px; overflow:hidden; border:1px solid #ffffff22;
  background:linear-gradient(180deg,#ffffff10,#00000030);
  box-shadow: 0 20px 60px #000000a0, 0 0 80px #ff7ac620;
}
.panel img{ width:100%; height:100%; object-fit:cover; display:block; }
.panel figcaption{
  position:absolute; left:10px; bottom:10px; padding:6px 10px; border-radius:999px;
  background:linear-gradient(180deg,#00000085,#00000040); border:1px solid #ffffff3a; color:#fff; font-weight:800; letter-spacing:.04em; font-size:12px; backdrop-filter: blur(6px);
}
.panel::after{ content:''; position:absolute; inset:auto 30% -14px 30%; height:40px; background:radial-gradient(closest-side, #ff7ac655, transparent 60%); filter: blur(10px); transform: translateZ(-120px); }
.hint{color:var(--muted); text-align:center; margin:8px 0 4px; font-size:13px}

/* Action chips */
.actions{display:flex; gap:10px; flex-wrap:wrap; justify-content:center; padding:6px 14px 22px}
.chip{border:1px solid #ffffff22; border-radius:999px; padding:10px 14px; font-weight:700; text-decoration:none; background:#ffffff10}
.chip:hover{border-color:#ffffff66}

/* Contact */
.contact{max-width:900px;margin:8px auto 60px;padding:0 16px}
.contact h2{margin:8px 0 8px; font-size:28px}
.contact-list{list-style:none; padding:0; margin:0 0 12px; color:var(--muted)}
.contact-list a{text-decoration:underline; text-underline-offset:2px}
.quick-form{display:grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap:12px}
.quick-form label{display:flex; flex-direction:column; gap:6px; font-size:14px; color:#d9d3f2}
.quick-form input, .quick-form select{ padding:12px 12px; background:#0f0d16; border:1px solid #ffffff22; color:#fff; border-radius:12px; }
.quick-form button{grid-column:1/-1}
.mini{font-size:12px; color:var(--mint); min-height:1.2em}

.footer{padding:30px 16px; text-align:center; color:#9e97b4; border-top:1px solid #ffffff1a}

/* Liya-Bot */
.liya-launch{
  position: fixed; right: 16px; bottom: 16px; width: 68px; height: 68px;
  border-radius: 50%; background: #ffb3db1a; border: 1px solid #ffffff33;
  display:grid; place-items:center; cursor:pointer; z-index:10;
  box-shadow: 0 10px 30px #000000b0, 0 0 40px #ff7ac633 inset;
  backdrop-filter: blur(6px);
}
.liya-launch img{ width: 52px; height: 52px; border-radius: 50%; }
.liya-launch .pulse{ position:absolute; inset:-6px; border-radius:50%; box-shadow:0 0 0 0 #ff7ac650; animation:pulse 2.8s ease-out infinite}
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 #ff7ac660 } 70%{ box-shadow:0 0 0 22px transparent } 100%{ box-shadow:0 0 0 0 transparent } }

.liya-chat{
  position: fixed; right: 16px; bottom: 96px; width: min(94vw, 360px); height: 520px;
  background: linear-gradient(180deg,#110b18,#0b0a12); border:1px solid #ffffff22; border-radius:16px; overflow:hidden; z-index:11;
  box-shadow: 0 20px 60px #000000c0, 0 0 80px #ff7ac620;
}
.liya-chat[hidden]{ display:none }
.liya-chat header{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-bottom:1px solid #ffffff17; background:linear-gradient(90deg,#ff7ac61a,#ffffff05)}
.liya-chat header img{ width:34px; height:34px; border-radius:50% }
.liya-chat header strong{ display:block; font-size:14px }
.liya-chat header span{ display:block; font-size:11px; color:#d9d3f2aa }
#liyaClose{ margin-left:auto; background:#ffffff14; color:#fff; border:1px solid #ffffff22; border-radius:10px; width:30px; height:30px; cursor:pointer }

.thread{ height: 370px; overflow:auto; padding:10px 12px; display:flex; flex-direction:column; gap:8px }
.msg{ max-width: 82%; padding:10px 12px; border-radius:12px; line-height:1.3; font-size:14px }
.user{ align-self:flex-end; background:#ffffff12; border:1px solid #ffffff22 }
.bot{ align-self:flex-start; background:#ff7ac61a; border:1px solid #ff7ac644 }
.bubble{ display:inline-block }
.suggest{ display:flex; gap:8px; flex-wrap:wrap; margin-top:6px }
.suggest button{ background:#ffffff10; border:1px solid #ffffff22; color:#fff; border-radius:999px; padding:6px 10px; font-size:12px; cursor:pointer }
.suggest button:hover{ border-color:#ffffff66 }

.composer{ display:flex; gap:8px; padding:10px; border-top:1px solid #ffffff17 }
.composer input{ flex:1; padding:12px; border-radius:12px; border:1px solid #ffffff22; background:#0f0d16; color:#fff }
.composer button{ padding:12px 16px; border-radius:12px; border:1px solid #ffffff22; background:linear-gradient(90deg,var(--mint),#b4ffe6); color:#03140d; font-weight:800 }

/* Mobile tweaks */
@media (max-width:480px){
  .ring{height:360px}
  .panel{height:260px}
  .liya-chat{height: 480px}
}
