/* Shared progressive conversation surface; native dialog owns focus and inertness. */
.ai-ui { color: var(--text); }
.ai-ui [hidden] { display: none !important; }
.ai-ui button { cursor: pointer; color: var(--text); background: transparent; border: 1px solid #635e58; border-radius: 8px; min-height: 44px; padding: 8px 12px; font: 12px/1.4 var(--sans); }
.ai-ui button:hover { border-color: var(--ember); background: #25211e; }
.ai-ui button:disabled { cursor: default; opacity: .55; }
.ai-ui :focus-visible { outline: 3px solid var(--frost); outline-offset: 3px; }
.ai-input-row { display: flex; gap: 8px; align-items: center; border: 1px solid #71665c; border-radius: 12px; background: #0a0a0b; padding: 6px; }
.ai-input-row:focus-within { border-color: transparent; outline: 3px solid var(--frost); outline-offset: 3px; }
/* The composer is one focus group; Send remains distinguishable by fill/glyph. */
.ai-input-row > textarea:focus,.ai-input-row > button:focus { outline: none; }
.ai-input-row > button:focus-visible { background: var(--frost); color: var(--ink); }
.ai-input-row > button:focus-visible span { display: inline-block; transform: rotate(45deg); }
.ai-ui textarea,.ai-ui input { min-width: 0; width: 100%; resize: none; max-height: 140px; min-height: 44px; padding: 11px 8px; font: 16px/1.4 var(--sans); border: 0; background: transparent; color: var(--text); }
.ai-ui textarea::placeholder,.ai-ui input::placeholder { color: #bcb6af; opacity: 1; }
.ai-input-row button { flex: none; width: 44px; background: var(--ember); color: var(--ink); border: 0; border-radius: 9px; font-size: 23px; }
.ai-suggestions { display: flex; flex-wrap: wrap; gap: 8px; margin-block: 18px; }
.ai-suggestions button { text-align: left; }
.ai-source { margin-block: 48px; max-width: 720px; }
.ai-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 88px; }
.ai-heading h2.offering-brand { flex-wrap: nowrap; font-size: 15px; letter-spacing: -.025em; }
.ai-heading .ai-close { flex: none; }
.ai-ui .ai-close { flex: none; width: 44px; height: 44px; border-radius: 50%; background: #232327; font-size: 26px; padding: 0; }
.ai-intro { color: var(--body); font-size: 16px; line-height: 1.6; max-width: 34ch; }
.ai-drawer { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; overflow: hidden; background: transparent; }
.ai-drawer::backdrop { background: rgba(10,10,11,.74); backdrop-filter: blur(8px); }
.ai-panel { padding: 0 32px; }
.ai-drawer .ai-panel { position: absolute; inset: 0 auto 0 0; width: min(560px,100%); height: 100%; height: 100dvh; display: grid; grid-template-rows: auto minmax(0,1fr) auto; border-right: 1px solid var(--line); background: radial-gradient(ellipse at 90% 10%,rgba(78,134,139,.1),transparent 60%),radial-gradient(ellipse at 0% 90%,rgba(218,151,94,.1),transparent 60%),var(--surface); }
.ai-scroll { overflow-y: auto; overscroll-behavior: contain; min-height: 0; padding: 12px 4px 24px; overflow-wrap: anywhere; }
.ai-compose { padding: 12px 0 max(12px,env(safe-area-inset-bottom)); border-top: 1px solid var(--line); }
.ai-status { color: var(--body); font-size: 13px; line-height: 1.5; margin-top: 10px; }
.ai-status:empty { display: none; }
.ai-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 12px; }
.ai-footer a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; text-underline-offset: 4px; }
.ai-ui .ai-reset { border: 0; color: var(--body); }
.ai-turn { margin-top: 24px; }
.ai-question { width: fit-content; max-width: 95%; margin: 0 0 18px auto; padding: 12px 16px; border: 1px solid var(--line); border-radius: 14px 14px 2px 14px; background: #272729; font-size: 14px; line-height: 1.5; white-space: pre-wrap; }
.ai-answer h3 { margin: 10px 0 18px; font-size: 27px; line-height: 1.15; }
.ai-answer p { font-size: 15px; line-height: 1.65; }
.ai-answer p + p { margin-top: 14px; }
.ai-answer .eyebrow { font-size: 10px; }
.ai-answer li a,.ai-static a { display: inline-flex; align-items: center; min-height: 44px; color: var(--frost); text-decoration: underline; }
.ai-followups { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.ai-static summary { min-height: 44px; padding: 8px 0; cursor: pointer; }
.ai-static p { margin-block: 12px; }
html.chat-open { overflow: hidden; }
html.chat-open body { padding-right: var(--scrollbar,0px); }
.home-slide-actions { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.ai-secondary,.static-beat-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; text-decoration: underline; text-underline-offset: 5px; }
.static-beat-link { margin-top: 12px; }
.opening:not(.video-scroll) .hero-bottom { padding-top: 64px; margin-top: 0; }
.opening:not(.video-scroll) .voyage-stage .hero-content { min-height: 0; }
.opening.video-scroll.hero-slides h1,.opening.video-scroll.hero-slides .voyage-beats p:not(.hero-description) { font-size: min(clamp(40px,5.5vw,82px),8.5svh); }
.opening.video-scroll.hero-slides .home-slide-actions { grid-area: 2 / 1; margin-top: 22px; }
.video-scroll .static-beat-link { display: none; }
@media (prefers-reduced-motion: no-preference) {
 .ai-drawer[open] .ai-panel { animation: chat-in 350ms cubic-bezier(.2,.7,.2,1) both; }
 .ai-drawer[open]::backdrop { animation: menu-fade-in 250ms both; }
 .ai-drawer.is-closing .ai-panel { animation: chat-out 200ms ease-in both; }
 .ai-drawer.is-closing::backdrop { animation: menu-fade-out 200ms both; }
 @keyframes chat-in { from { transform: translateX(-100%); } to { transform: translateX(0); } }
 @keyframes chat-out { to { transform: translateX(-100%); } }
}
@media (max-width: 760px) {
 .ai-drawer .ai-panel { width: 100%; padding-inline: 20px; }
 .ai-heading { min-height: 76px; }
 .home-slide-actions { gap: 10px 20px; }
}
@media (max-height: 520px) { .ai-heading { min-height: 56px; } .ai-compose { padding-top: 6px; } .ai-ui textarea { min-height: 44px; height: 44px; } }
@media (prefers-reduced-motion: reduce) { .ai-ui * { animation: none !important; transition: none !important; } }
/* Keep the current-page assistant one tap away alongside the menu on mobile. */
@media (max-width: 760px) {
 .has-menu .header-inner { gap: 8px; flex-wrap: nowrap; }
 .has-menu .header-actions { gap: 8px; }
 .has-menu .header-cta { display: inline-flex; padding-inline: 10px; font-size: 11px; white-space: nowrap; }
 .has-menu .header-cta span { display: none; }
}
@media (forced-colors: active) { .ai-drawer .ai-panel { background: Canvas; border-color: CanvasText; } .ai-ui button,.ai-input-row { border: 1px solid ButtonText; } }

@media (forced-colors: active) { .ai-input-row:focus-within { outline-color: Highlight; } .ai-input-row > button:focus-visible { forced-color-adjust: none; background: Highlight; color: HighlightText; } }

/* A real in-flight request only: no simulated streaming or timed reveal. */
.ai-pending { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding-block: 6px 14px; color: var(--body); font-size: 14px; }
.ai-pending .eyebrow { flex-basis: 100%; color: var(--ember); }
.ai-pending-dots { display: inline-flex; gap: 4px; }
.ai-pending-dots i { width: 4px; height: 4px; border-radius: 50%; background: var(--frost); }
.ai-form button[aria-disabled="true"] { opacity: .55; cursor: progress; }
@media (prefers-reduced-motion: no-preference) {
 .ai-pending-dots i { animation: ai-processing 1s ease-in-out infinite; }
 .ai-pending-dots i:nth-child(2) { animation-delay: .15s; }
 .ai-pending-dots i:nth-child(3) { animation-delay: .3s; }
 @keyframes ai-processing { 0%,100% { opacity: .35; } 50% { opacity: 1; } }
}