:root{
  --primary:#8C5A2B;
  --secondary:#A67C52;
  --accent:#B23A3A;
  --water:#6FA8B6;
  --bg-soft:#F5F2EE;
  --text:#18232f;
  --muted:rgba(24,35,47,.68);
  --glass:rgba(255,255,255,.66);
  --glass-strong:rgba(255,255,255,.82);
  --glass-soft:rgba(255,255,255,.46);
  --border:rgba(24,35,47,.10);
  --shadow:0 28px 80px rgba(16,24,40,.14);
  --shadow-soft:0 16px 36px rgba(16,24,40,.12);
  --radius-xl:26px;
  --radius-lg:20px;
  --radius-md:16px;
  --radius-sm:12px;
  --max:1120px;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
  color:var(--text);
  background:
    radial-gradient(1200px 650px at 16% 10%, rgba(111,168,182,.22), transparent 60%),
    radial-gradient(1050px 580px at 84% 12%, rgba(178,58,58,.14), transparent 55%),
    radial-gradient(980px 520px at 54% 88%, rgba(140,90,43,.10), transparent 58%),
    linear-gradient(180deg, #f7f3ee 0%, #ecf4f6 55%, #f7f3ee 100%);
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: radial-gradient(circle at center, rgba(0,0,0,.75), transparent 88%);
  opacity:.3;
}

.pageGlow{
  position:fixed;
  border-radius:999px;
  filter:blur(60px);
  pointer-events:none;
  z-index:0;
  opacity:.5;
}
.pageGlow--one{ width:280px; height:280px; left:-80px; top:100px; background:rgba(111,168,182,.26); }
.pageGlow--two{ width:340px; height:340px; right:-110px; top:220px; background:rgba(178,58,58,.12); }
.pageGlow--three{ width:260px; height:260px; left:38%; bottom:40px; background:rgba(140,90,43,.12); }

.topbar{
  position:sticky;
  top:0;
  z-index:60;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  background:linear-gradient(90deg, rgba(255,255,255,.78), rgba(255,255,255,.58));
  border-bottom:1px solid rgba(24,35,47,.08);
  box-shadow:0 8px 26px rgba(16,24,40,.06);
}
.topbar__inner{
  max-width:var(--max);
  margin:0 auto;
  padding:14px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.brand{
  display:flex;
  align-items:center;
  gap:14px;
  text-decoration:none;
  color:inherit;
  min-width:0;
}
.brand__mark{
  width:66px;
  height:66px;
  border-radius:18px;
  overflow:hidden;
  display:grid;
  place-items:center;
  border:1px solid rgba(24,35,47,.10);
  background:linear-gradient(135deg, rgba(111,168,182,.26), rgba(140,90,43,.18));
  box-shadow:0 14px 30px rgba(16,24,40,.10), inset 0 1px 0 rgba(255,255,255,.55);
  position:relative;
}
.brand__mark::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(255,255,255,.3), transparent 45%, transparent 58%, rgba(255,255,255,.18));
  pointer-events:none;
}
.brand__markImg{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.brand__text{ min-width:0; }
.brand__eyebrow{
  font-size:11px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(24,35,47,.48);
  margin-bottom:3px;
}
.brand__name{
  font-weight:900;
  font-size:1.05rem;
  letter-spacing:-.02em;
}
.brand__tag{
  font-size:12.5px;
  color:var(--muted);
  margin-top:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.topbar__actions{
  display:flex;
  align-items:center;
  gap:12px;
}

.btn{
  border:0;
  cursor:pointer;
  border-radius:999px;
  padding:10px 14px;
  font-weight:800;
  letter-spacing:.01em;
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease, opacity .18s ease;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-1px); }
.btn:active{ transform:translateY(0) scale(.99); }

.btn--reserve{
  position:relative;
  overflow:hidden;
  padding:11px 18px;
  color:#fff;
  background:linear-gradient(135deg, #9a6430 0%, #b0463f 100%);
  box-shadow:0 16px 36px rgba(178,58,58,.18), 0 12px 26px rgba(140,90,43,.22);
}
.btn--reserve::after,
.btn--send::after{
  content:"";
  position:absolute;
  inset:-40% -60%;
  background:linear-gradient(105deg, transparent 35%, rgba(255,255,255,.35) 50%, transparent 64%);
  transform:translateX(-48%) rotate(12deg);
  opacity:0;
  transition:transform .55s ease, opacity .28s ease;
}
.btn--reserve:hover::after,
.btn--send:hover::after{
  opacity:.9;
  transform:translateX(26%) rotate(12deg);
}

.btn--send{
  position:relative;
  overflow:hidden;
  color:#fff;
  min-width:104px;
  background:linear-gradient(135deg, #8c5a2b 0%, #6fa8b6 100%);
  box-shadow:0 15px 34px rgba(111,168,182,.18), 0 10px 24px rgba(140,90,43,.18);
}

.lang{
  display:flex;
  gap:6px;
  padding:6px;
  border-radius:999px;
  background:rgba(255,255,255,.64);
  border:1px solid rgba(24,35,47,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
.lang__btn{
  border:0;
  background:transparent;
  cursor:pointer;
  padding:8px 10px;
  border-radius:999px;
  font-weight:900;
  color:rgba(24,35,47,.62);
  transition:background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.lang__btn:hover{ transform:translateY(-1px); }
.lang__btn.is-active{
  color:#10202c;
  background:linear-gradient(135deg, rgba(111,168,182,.34), rgba(140,90,43,.18));
  box-shadow:0 8px 18px rgba(16,24,40,.08);
}

.shell{
  position:relative;
  z-index:1;
  max-width:var(--max);
  margin:0 auto;
  padding:26px 18px 42px;
}

.headline{
  --mx:0px;
  --my:0px;
  position:relative;
  overflow:hidden;
  border-radius:30px;
  min-height:360px;
  padding:28px 24px 24px;
  border:1px solid rgba(24,35,47,.10);
  box-shadow:0 28px 80px rgba(16,24,40,.16);
  background:
    linear-gradient(120deg, rgba(255,255,255,.68), rgba(255,255,255,.18) 58%, rgba(255,255,255,.44)),
    url('hotelsantamargarida.png') center/cover no-repeat;
  isolation:isolate;
}
.headline::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 18%, rgba(255,255,255,.7), transparent 34%),
    linear-gradient(180deg, rgba(12,18,26,.08), transparent 22%, transparent 70%, rgba(255,255,255,.18));
  z-index:0;
}
.headline::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  border:1px solid rgba(255,255,255,.34);
  pointer-events:none;
  z-index:3;
}
.headline__grid{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(180deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:34px 34px;
  opacity:.24;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.6), transparent 86%);
  z-index:0;
}
.headline__ambient{
  position:absolute;
  border-radius:999px;
  filter:blur(24px);
  opacity:.75;
  z-index:0;
}
.headline__ambient--left{
  width:200px;
  height:200px;
  left:calc(10% + (var(--mx) * .06));
  top:calc(40px + (var(--my) * .04));
  background:rgba(111,168,182,.28);
}
.headline__ambient--right{
  width:220px;
  height:220px;
  right:calc(10% - (var(--mx) * .05));
  top:30px;
  background:rgba(178,58,58,.18);
}
.heroBadge,
.heroContent,
.heroMark{ position:relative; z-index:1; }
.heroBadge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 13px;
  border-radius:999px;
  background:rgba(255,255,255,.64);
  border:1px solid rgba(24,35,47,.10);
  box-shadow:0 12px 28px rgba(16,24,40,.10);
  font-size:12px;
  font-weight:850;
  color:rgba(24,35,47,.78);
}
.heroBadge::before{
  content:"✦";
  color:var(--accent);
}
.heroMark{
  display:flex;
  justify-content:center;
  margin:18px 0 10px;
  transform:translate3d(calc(var(--mx) * -.02), calc(var(--my) * -.02), 0);
  transition:transform .28s ease;
}
.heroMark__halo{
  position:absolute;
  width:min(360px, 64vw);
  aspect-ratio:1/1;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,.84), rgba(255,255,255,.22) 52%, transparent 72%);
  filter:blur(10px);
  transform:translateY(-10px);
}
.heroMark__img{
  position:relative;
  max-width:360px;
  width:min(390px, 62vw);
  height:auto;
  display:block;
  filter:drop-shadow(0 18px 36px rgba(16,24,40,.18));
  animation:heroFloat 7s ease-in-out infinite;
}
@keyframes heroFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-7px); }
}
.heroContent{
  text-align:center;
}
.heroKicker{
  font-size:12px;
  font-weight:900;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:rgba(24,35,47,.56);
}
.headline h1{
  margin:10px 0 0;
  font-size:clamp(36px, 5vw, 64px);
  line-height:1.02;
  letter-spacing:-.045em;
  text-shadow:0 12px 30px rgba(255,255,255,.24);
}
.glow{
  background:linear-gradient(90deg, var(--primary) 0%, var(--accent) 26%, var(--water) 72%, var(--water) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.lead{
  margin:16px auto 0;
  max-width:700px;
  padding:12px 16px;
  color:rgba(16,24,40,.90);
  line-height:1.55;
  font-size:15px;
  font-weight:600;
  text-wrap:balance;
  background:linear-gradient(180deg, rgba(255,255,255,.58), rgba(255,255,255,.36));
  border:1px solid rgba(255,255,255,.36);
  border-radius:18px;
  box-shadow:0 12px 32px rgba(16,24,40,.08);
  backdrop-filter:blur(10px);
}
.heroStats{
  margin:18px auto 0;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:center;
}
.heroStat{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.50);
  border:1px solid rgba(24,35,47,.10);
  box-shadow:0 14px 30px rgba(16,24,40,.08);
  backdrop-filter:blur(8px);
}
.heroStat__icon{
  width:34px;
  height:34px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, rgba(111,168,182,.24), rgba(140,90,43,.18));
  font-size:16px;
}
.heroStat__text{
  font-size:13.5px;
  font-weight:820;
  color:rgba(24,35,47,.86);
}

.heroStats[hidden],
.chat__hint[hidden]{ display:none; }

.glass{
  background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.46));
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.chat{
  margin-top:18px;
  padding:16px;
  position:relative;
  overflow:hidden;
}
.chat::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.22), transparent 18%, transparent 84%, rgba(255,255,255,.14));
  pointer-events:none;
}
.chat--premium{
  box-shadow:0 28px 80px rgba(16,24,40,.16), inset 0 1px 0 rgba(255,255,255,.55);
}
.chat__header,
.chat__quick,
.starterGrid,
.chat__feed,
.chat__composer,
.chat__hint,
.chat__disclaimer{ position:relative; z-index:1; }
.chat__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:8px 10px 14px;
}
.chat__title{
  display:flex;
  align-items:center;
  gap:12px;
}
.avatar{
  width:46px;
  height:46px;
  border-radius:15px;
  overflow:hidden;
  border:1px solid rgba(24,35,47,.10);
  background:linear-gradient(135deg, rgba(111,168,182,.25), rgba(140,90,43,.18));
  box-shadow:0 12px 26px rgba(16,24,40,.10);
  display:grid;
  place-items:center;
}
.avatar__img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.chat__nameWrap{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.chat__name{
  font-weight:950;
  font-size:1.05rem;
  letter-spacing:-.03em;
}
.chat__status{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.58);
  border:1px solid rgba(24,35,47,.08);
  font-size:11.5px;
  font-weight:850;
  color:rgba(24,35,47,.72);
}
.chat__status::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:#49b97f;
  box-shadow:0 0 0 4px rgba(73,185,127,.14);
}
.chat__sub{
  font-size:12.5px;
  color:var(--muted);
  margin-top:3px;
}
.chat__pill{
  font-size:12px;
  font-weight:900;
  color:rgba(24,35,47,.76);
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(24,35,47,.10);
  background:rgba(255,255,255,.66);
  box-shadow:0 10px 24px rgba(16,24,40,.08);
}

.chat__quick{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  padding:4px 8px 14px;
  border-bottom:1px solid rgba(24,35,47,.08);
}
.quick{
  border:1px solid rgba(24,35,47,.12);
  background:rgba(255,255,255,.72);
  border-radius:999px;
  padding:10px 13px;
  cursor:pointer;
  font-weight:820;
  color:rgba(24,35,47,.80);
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.quick:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.9);
  box-shadow:var(--shadow-soft);
  border-color:rgba(111,168,182,.22);
}

.quick--accent{
  background:linear-gradient(135deg, rgba(140,90,43,.14), rgba(214,96,96,.12));
  border-color:rgba(140,90,43,.28);
  box-shadow:0 8px 22px rgba(140,90,43,.10);
}
.quick--accent:hover{
  background:linear-gradient(135deg, rgba(140,90,43,.18), rgba(214,96,96,.16));
  border-color:rgba(140,90,43,.34);
}

.quick__icon{
  width:24px;
  height:24px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, rgba(111,168,182,.22), rgba(140,90,43,.16));
  font-size:12px;
}

.starterGrid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
  padding:14px 8px 14px;
}
.starterCard{
  position:relative;
  text-align:left;
  border:1px solid rgba(24,35,47,.10);
  background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.56));
  border-radius:18px;
  padding:14px 14px 14px 48px;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
  box-shadow:0 12px 28px rgba(16,24,40,.08);
  overflow:hidden;
}
.starterCard::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(255,255,255,.24), transparent 46%);
  pointer-events:none;
}
.starterCard:hover{
  transform:translateY(-2px);
  border-color:rgba(111,168,182,.22);
  box-shadow:0 18px 36px rgba(16,24,40,.12);
}
.starterCard__icon{
  position:absolute;
  left:14px;
  top:14px;
  width:24px;
  height:24px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, rgba(111,168,182,.24), rgba(140,90,43,.18));
  font-size:13px;
}
.starterCard__eyebrow{
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(24,35,47,.46);
}
.starterCard__title{
  margin-top:3px;
  font-size:15px;
  font-weight:900;
  color:rgba(24,35,47,.92);
}
.starterCard__text{
  margin-top:6px;
  color:rgba(24,35,47,.68);
  font-size:13px;
  line-height:1.4;
}

.chat__feed{
  position:relative;
  height:min(54vh, 560px);
  overflow:auto;
  padding:16px 14px;
  scroll-behavior:smooth;
  background:
    radial-gradient(840px 460px at 12% 10%, rgba(111,168,182,.16), transparent 56%),
    radial-gradient(760px 420px at 88% 12%, rgba(178,58,58,.08), transparent 60%),
    radial-gradient(760px 420px at 56% 92%, rgba(140,90,43,.10), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,.22));
  border-radius:22px;
  border:1px solid rgba(24,35,47,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.42);
}
.chat__feed::before,
.chat__feed::after{
  content:"";
  position:sticky;
  display:block;
  left:0;
  right:0;
  height:16px;
  z-index:2;
  pointer-events:none;
}
.chat__feed::before{
  top:0;
  background:linear-gradient(180deg, rgba(245,242,238,.9), rgba(245,242,238,0));
}
.chat__feed::after{
  bottom:0;
  background:linear-gradient(0deg, rgba(245,242,238,.9), rgba(245,242,238,0));
}
.chat__feed::-webkit-scrollbar{ width:10px; }
.chat__feed::-webkit-scrollbar-thumb{
  background:rgba(24,35,47,.14);
  border-radius:999px;
}
.chat__feed::-webkit-scrollbar-track{ background:transparent; }

.msg{ display:flex; margin:10px 0; }
.msg--user{ justify-content:flex-end; }
.msg--bot{ justify-content:flex-start; }
.bubble{
  max-width:min(760px, 86%);
  padding:14px 16px;
  border-radius:18px;
  line-height:1.42;
  font-size:14px;
  box-shadow:0 12px 26px rgba(16,24,40,.09);
  transition:transform .18s ease, box-shadow .18s ease;
}
.bubble:hover{
  transform:translateY(-1px);
  box-shadow:0 18px 40px rgba(16,24,40,.11);
}
.msg--bot .bubble{
  background:linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,255,255,.80));
  border:1px solid rgba(24,35,47,.08);
}
.msg--user .bubble{
  color:#fff;
  background:linear-gradient(135deg, rgba(111,168,182,.98), rgba(140,90,43,.93), rgba(178,58,58,.90));
  border:1px solid rgba(255,255,255,.20);
}
.meta{
  margin-top:6px;
  font-size:11.5px;
  color:rgba(24,35,47,.55);
  padding-left:6px;
}
.p{ white-space:normal; }
.ul{ margin:8px 0 0 18px; padding:0; }
.ul li{ margin:6px 0; }
a{ color:var(--accent); font-weight:850; text-decoration:none; }
a:hover{ text-decoration:underline; }

.msg-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:999px;
  font-weight:900;
  text-decoration:none !important;
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  margin:4px 0;
  white-space:nowrap;
}
.msg-btn--book{
  background:linear-gradient(135deg, var(--accent), rgba(255,255,255,.18));
  color:#fff !important;
}
.msg-btn--map{
  background:rgba(255,255,255,.16);
  color:var(--text) !important;
}
.msg-btn:hover{
  text-decoration:none !important;
  transform:translateY(-1px);
}

.chat__composer{
  margin-top:14px;
  padding:4px 8px 0;
}
.composer__wrap{
  display:flex;
  gap:10px;
  align-items:center;
  background:linear-gradient(180deg, rgba(255,255,255,.86), rgba(255,255,255,.68));
  border:1px solid rgba(24,35,47,.10);
  border-radius:999px;
  padding:10px;
  box-shadow:0 12px 28px rgba(16,24,40,.08), inset 0 1px 0 rgba(255,255,255,.7);
}
.composer__wrap:focus-within{
  border-color:rgba(111,168,182,.28);
  box-shadow:0 16px 34px rgba(16,24,40,.10), 0 0 0 6px rgba(111,168,182,.10);
}
.composer__icon{
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, rgba(111,168,182,.22), rgba(140,90,43,.16));
  color:var(--accent);
  font-size:15px;
  flex:0 0 auto;
}
#msg{
  width:100%;
  border:0;
  outline:none;
  font-size:14px;
  background:transparent;
  color:var(--text);
  padding:6px 4px;
}
#msg::placeholder{ color:rgba(24,35,47,.45); }
.chat__hint{
  margin:10px 4px 2px;
  font-size:12.5px;
  color:rgba(24,35,47,.56);
  text-align:center;
}
.chat__disclaimer{
  margin:6px 2px 0;
  font-size:12px;
  line-height:1.35;
  opacity:.74;
  text-align:center;
}

.typing{
  display:inline-flex;
  gap:6px;
  align-items:center;
}
.dot{
  width:7px;
  height:7px;
  border-radius:999px;
  background:rgba(24,35,47,.35);
  animation:bob 1.05s infinite ease-in-out;
}
.dot:nth-child(2){ animation-delay:.12s; }
.dot:nth-child(3){ animation-delay:.24s; }
@keyframes bob{
  0%,80%,100%{ transform:translateY(0); opacity:.55; }
  40%{ transform:translateY(-4px); opacity:1; }
}
@keyframes bubblePop{
  from{ transform:translateY(6px) scale(.985); opacity:0; }
  to{ transform:translateY(0) scale(1); opacity:1; }
}
.bubble--enter{ animation:bubblePop 260ms ease-out; }
.bubble.is-typing .tw::after{
  content:"▍";
  display:inline-block;
  margin-left:2px;
  opacity:.65;
  animation:twblink 1s step-end infinite;
}
@keyframes twblink{ 50%{ opacity:0; } }

.langModal{
  position:fixed;
  inset:0;
  z-index:999;
}
.langModal[hidden]{ display:none; }
.langModal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(9,12,16,.38);
  backdrop-filter:blur(8px);
}
.langModal__card{
  position:absolute;
  left:50%;
  top:14%;
  transform:translateX(-50%);
  width:min(620px, calc(100vw - 28px));
  border-radius:22px;
  padding:20px 20px 18px;
  background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.78));
  border:1px solid rgba(24,35,47,.12);
  box-shadow:0 26px 80px rgba(0,0,0,.22);
}
.langModal__title{
  font-weight:950;
  font-size:20px;
  color:rgba(15,23,32,.95);
}
.langModal__subtitle{
  margin-top:6px;
  color:rgba(24,35,47,.70);
  font-size:13.5px;
}
.langModal__grid{
  margin-top:14px;
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:8px;
}
.langModal__btn{
  border:1px solid rgba(24,35,47,.12);
  background:rgba(255,255,255,.74);
  border-radius:15px;
  padding:11px 10px;
  cursor:pointer;
  font-weight:900;
  transition:transform .16s ease, filter .16s ease, background .16s ease, box-shadow .16s ease;
}
.langModal__btn:hover{
  transform:translateY(-1px);
  filter:brightness(1.02);
  box-shadow:0 12px 26px rgba(16,24,40,.10);
}
.langModal__btn small{
  display:block;
  font-weight:700;
  opacity:.75;
  margin-top:2px;
  font-size:11.5px;
}
.langModal__note{
  margin-top:10px;
  color:rgba(24,35,47,.58);
  font-size:12.5px;
}

@media (max-width: 980px){
  .starterGrid{ grid-template-columns:1fr; }
}
@media (max-width: 760px){
  .topbar__inner{ padding:12px 14px; }
  .brand__eyebrow,
  .brand__tag,
  .chat__pill{ display:none; }
  .headline{
    min-height:330px;
    padding:20px 16px 18px;
    border-radius:24px;
  }
  .heroBadge{ font-size:11px; }
  .heroStat{ width:100%; justify-content:flex-start; }
  .chat{ padding:12px; }
  .chat__feed{ height:min(58vh, 540px); }
  .langModal__card{ top:10%; }
  .langModal__grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 620px){
  .topbar__actions{ gap:8px; }
  .lang{ order:2; }
  .btn--reserve{ order:1; }
  .heroKicker{ letter-spacing:.16em; }
  .headline h1{ font-size:clamp(34px, 9vw, 48px); }
  .lead{ font-size:14px; padding:10px 12px; }
  .quick{ width:100%; justify-content:flex-start; }
  .composer__icon{ display:none; }
}