/* Official Astra Chat mountain hero applied to the existing meeting invitation. */
:root { color-scheme:light; --accent:#6550e8; --accent-dark:#4938c7; --accent-soft:#eeebff; --ink:#17263c; --muted:#56677d; --quiet:#718096; --line:#e0e8f0; }
body { position:relative; isolation:isolate; background:#071a38; overflow-x:clip; }
body::before,body::after { content:""; position:fixed; inset:0; z-index:-2; width:auto; height:auto; border:0; border-radius:0; pointer-events:none; }
body::before { display:block; background:#254466 url('/hero-mountain.png') center 36%/cover no-repeat; }
body::after { z-index:-1; background:linear-gradient(180deg,rgba(8,20,45,.12),rgba(6,20,45,.32) 42%,rgba(3,16,39,.85) 100%),linear-gradient(90deg,rgba(16,30,69,.28),transparent 80%); }
.page-shell { max-width:1312px; padding:0 40px; }
.page-shell::before { content:"Astra Chat"; position:absolute; top:128px; left:50%; transform:translateX(-50%); width:max-content; max-width:calc(100vw - 24px); overflow:hidden; color:rgba(255,255,255,.58); font-size:clamp(90px,13.7vw,200px); font-weight:800; line-height:.9; letter-spacing:-.075em; pointer-events:none; }
.site-header,.content,.site-footer { position:relative; z-index:1; }
.site-header { min-height:96px; }
.brand { color:#fff; font-size:26px; letter-spacing:-.055em; }
.brand img { width:40px; height:40px; border-radius:12px; box-shadow:0 9px 25px rgba(3,13,40,.24); }
.header-label { color:#e4eeff; font-size:11px; letter-spacing:.16em; text-transform:uppercase; }
.header-tools { gap:17px; }
.language-control { width:158px; }
.language-control svg { color:#fff; }
.language-control select { border:1px solid rgba(255,255,255,.3); border-radius:100px; background:rgba(255,255,255,.15); color:#fff; box-shadow:inset 0 1px 0 rgba(255,255,255,.12); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); }
.language-control select:hover { border-color:rgba(255,255,255,.55); }
.language-control select option { background:#173453; color:#fff; }
.content { align-items:center; padding:185px 0 72px; }
.invitation-card { max-width:none; min-height:0; grid-template-columns:minmax(0,.93fr) minmax(0,1.07fr); gap:60px; overflow:visible; border:0; border-radius:0; background:transparent; box-shadow:none; }
.card-visual { min-height:420px; padding:40px 0 30px; overflow:visible; border:0; background:transparent; color:#fff; }
.card-visual::after,.visual-art { display:none; }
.visual-head { align-items:flex-start; }
.eyebrow { color:#e4efff; font-size:11px; letter-spacing:.17em; }
.eyebrow-line { background:#e4efff; }
.visual-brand { color:#dceaff; font-size:11px; }
.visual-copy { margin-top:70px; }
h1 { max-width:560px; color:#fff; font-size:clamp(48px,5vw,72px); font-weight:700; line-height:1.12; letter-spacing:-.055em; text-shadow:0 8px 26px rgba(4,13,35,.14); }
.visual-rule { width:48px; height:2px; margin:27px 0 18px; background:#d8e8ff; }
.visual-copy p { color:#e7f1ff; font-size:16px; }
.card-body { min-height:420px; padding:42px 43px 35px; border:1px solid rgba(255,255,255,.8); border-radius:29px; background:rgba(250,253,255,.95); box-shadow:0 28px 80px rgba(4,16,42,.3),inset 0 1px 0 #fff; color:var(--ink); }
.host-avatar { border-radius:15px; background:#e7eafd; }
.avatar-fallback { color:#6550e8; }
.status-pill { border-radius:100px; }
.organizer-name { color:#2e3d58; }
.details { border-color:#e1e8f1; border-radius:17px; background:#f4f8fc; }
.detail-row { border-color:#dfe7f0; }
.mini-button { border-radius:100px; background:#fff; }
.primary-action { min-height:58px; justify-content:space-between; padding:7px 8px 7px 23px; border-radius:100px; background:#122b4d; box-shadow:0 13px 27px rgba(11,35,68,.18); }
.primary-action:hover,.primary-action:focus-visible { background:#1c3f6a; box-shadow:0 17px 31px rgba(11,35,68,.24); }
.primary-action span:last-child { display:grid; place-items:center; width:42px; height:42px; flex:0 0 42px; border-radius:50%; color:#fff; background:#6550e8; font-size:21px; font-weight:400; }
.primary-action.disabled { justify-content:center; padding:12px 17px; border-radius:16px; }
.download-link { color:#3d3c9f; }
.site-footer { border-color:rgba(255,255,255,.2); color:#d0deef; }
.site-footer a { color:#e4efff; }
.site-footer a:hover,.site-footer a:focus-visible { color:#fff; }
:focus-visible { outline-color:#a7eaff; }
@media(max-width:1050px) {
  .invitation-card { gap:32px; }
  .card-body { padding:34px 31px; }
  h1 { font-size:clamp(43px,5vw,60px); }
}
@media(max-width:850px) {
  .page-shell { padding:0 24px; }
  .page-shell::before { top:126px; font-size:15.2vw; }
  .content { padding:215px 0 50px; }
  .invitation-card { max-width:610px; grid-template-columns:1fr; gap:10px; }
  .card-visual { min-height:0; padding:0 4px 25px; }
  .visual-copy { margin-top:23px; }
  h1 { font-size:clamp(38px,6vw,52px); }
  .visual-rule { margin:19px 0 11px; }
  .card-body { min-height:0; padding:31px 34px 32px; }
}
@media(max-width:520px) {
  .page-shell { padding:0 17px; }
  .site-header { min-height:76px; }
  .brand { font-size:21px; }
  .brand img { width:35px; height:35px; }
  .language-control { width:138px; }
  .content { padding:190px 0 38px; }
  .card-visual { padding:0 4px 21px; }
  .visual-copy { margin-top:19px; }
  h1 { font-size:clamp(34px,8.2vw,43px); line-height:1.13; }
  .visual-copy p { font-size:13px; }
  .card-body { padding:26px 22px 28px; border-radius:23px; }
  .site-footer { border-color:rgba(255,255,255,.2); }
}
@media(max-width:360px) {
  .content { padding-top:170px; }
  .language-control { width:126px; }
  .language-control select { font-size:11px; }
  h1 { font-size:33px; }
  .card-body { padding-inline:18px; }
}
@media(prefers-reduced-transparency:reduce) { .card-body { background:#fff; } .language-control select { background:#173453; -webkit-backdrop-filter:none; backdrop-filter:none; } }