/* Ahmed's guest landing: one quiet first screen, a working composer and optional examples.
   Only loaded for guests. The story disappears once a conversation starts. */
.cv-guest .cv-chat { position:relative; isolation:isolate; overflow-x:hidden; }
html[data-theme="dark"] .cv-guest, html[data-theme="dark"] .cv-guest .cv-chat { --cv-canvas:#05070f; background:#05070f; }
html[data-theme="dark"] .cv-guest { --cv-bg:#101318; --cv-soft:#14171d; --cv-line:rgba(255,255,255,0.12); }
.cv-chat:has(.cv-intro[hidden]) > .vc-landing { display:none; }
.cv-chat > .vc-landing, .cv-chat > .cv-below { flex:0 0 auto; }
/* One rounded entry surface behind the existing, real chat elements. */
.cv-guest .cv-chat:has(.cv-intro-center:not([hidden]))::before { content:""; position:absolute; z-index:-1; pointer-events:none;
  top:12px; left:16px; right:16px; height:var(--vc-hero-h, calc(100svh - 24px)); border-radius:40px;
  border:1px solid color-mix(in srgb, var(--cv-line) 55%, transparent); background:linear-gradient(160deg, #f0f2f3, #f7f7f6); }
html[data-theme="dark"] .cv-guest .cv-chat:has(.cv-intro-center:not([hidden]))::before { background:linear-gradient(160deg, #11161d, #0a0e14); }
/* Header: no frame on the landing, one solid pill for Sign in (Geist Mono, as on volkcell.com). */
.cv-guest .cv-chat:has(.cv-intro-center:not([hidden])) > .cv-site-header { border-color:transparent; background:transparent;
  -webkit-backdrop-filter:none; backdrop-filter:none; }
.cv-guest .cv-site-header .cv-btn.cv-nav-signin { min-height:44px; padding:0 22px; border:0; border-radius:var(--cv-pill);
  background:var(--cv-accent); color:var(--cv-on-accent); font-family:var(--cv-font-mono); font-size:0.875rem; font-weight:400;
  letter-spacing:-0.01em; box-shadow:none; }
.cv-guest .cv-site-header .cv-btn.cv-nav-signin:hover { background:var(--cv-accent-2); color:var(--cv-on-accent); }
html[data-theme="dark"] .cv-guest .cv-site-header .cv-btn.cv-nav-signin:hover { background:#ffffff; color:#070b1c; }

/* Headline: the website's two-tone Geist line. */
.cv-guest .cv-chat:has(.cv-intro-center:not([hidden])) > .cv-scroll {
  margin-top:0; padding-block:32px; display:flex; align-items:center; justify-content:center;
  min-height:max(240px, calc(100svh - var(--vc-header-h, 88px) - var(--vc-composer-h, 160px) - 360px - var(--vc-cookie-h, 0px))); }
.cv-guest .cv-intro-center .cv-intro-title { max-width:21ch; margin:0 auto 22px; font-family:var(--cv-font-head);
  font-size:clamp(2.75rem, 6vw, 4.75rem); font-weight:500; line-height:1.03; letter-spacing:-0.045em; color:var(--cv-ink-strong);
  text-wrap:balance; }
.cv-guest .cv-intro-center .cv-intro-title .vc-title-soft { color:color-mix(in srgb, var(--cv-ink-strong) 68%, transparent); }
.cv-guest .cv-intro-center .cv-intro-text { max-width:40ch; font-size:clamp(1rem, 1.4vw, 1.125rem); line-height:1.55; color:var(--cv-muted); }

/* Composer: a calm surface with a hairline ring, near the bottom of the first screen. */
.cv-guest .cv-chat:has(.cv-intro-center:not([hidden])) > .cv-composer:not(.cv-docked) { position:relative; z-index:2;
  width:min(728px, calc(100% - 40px)); margin-inline:auto; padding-top:12px; }
html .cv-guest .cv-chat:has(.cv-intro-center:not([hidden])) .cv-composer:not(.cv-docked) .cv-dropzone { border:0; border-radius:28px; padding:16px 14px 12px 22px;
  background:var(--cv-bg); box-shadow:0 0 0 1px var(--cv-line), 0 18px 52px rgba(16,24,32,0.09); -webkit-backdrop-filter:none; backdrop-filter:none; }
html[data-theme="dark"] .cv-guest .cv-chat:has(.cv-intro-center:not([hidden])) .cv-composer:not(.cv-docked) .cv-dropzone { background:#171d25;
  box-shadow:0 0 0 1px rgba(255,255,255,0.14), 0 24px 64px rgba(0,0,0,0.25); }
html .cv-guest .cv-chat:has(.cv-intro-center:not([hidden])) .cv-composer:not(.cv-docked) .cv-dropzone:focus-within { box-shadow:0 0 0 1px var(--cv-accent), 0 0 0 4px var(--cv-accent-tint), 0 28px 80px rgba(0,0,0,0.4); }
.cv-guest .cv-chat:has(.cv-intro-center:not([hidden])) .cv-input { font-size:1.0625rem; }
.cv-guest .cv-chat .cv-icon-circle.cv-send:not([disabled]) { background:var(--cv-accent); color:var(--cv-on-accent); }
html[data-theme="dark"] .cv-guest .cv-chat .cv-icon-circle.cv-send[disabled] { background:rgba(255,255,255,0.14); color:rgba(255,255,255,0.6); opacity:1; }

/* Samples and optional research questions stay below the real composer. */
.cv-guest .cv-chat:has(.cv-intro-center:not([hidden])) > .cv-below { gap:12px; padding:18px 24px 32px; }
.vc-question-ideas { width:min(728px, 100%); text-align:center; }
.vc-question-ideas summary { display:list-item; width:fit-content; margin:auto; padding:8px; cursor:pointer; color:var(--cv-muted); font-size:0.8125rem; }
.vc-ideas-note { margin:10px auto 0; max-width:48ch; color:var(--cv-muted); font-size:0.75rem; line-height:1.65; }
.vc-question-ideas .cv-examples { padding-top:14px; margin-inline:auto; }
.vc-question-ideas .cv-chip { text-wrap:balance; font-size:0.75rem; }
@media (max-width:720px) {
  .cv-guest .cv-chat:has(.cv-intro-center:not([hidden]))::before { left:8px; right:8px; top:8px; border-radius:28px; }
  .cv-guest .cv-site-header { gap:8px; }
  .cv-guest .cv-site-nav { display:flex; }
  .cv-guest .cv-site-nav a:not(:first-child) { display:none; }
  .cv-guest .cv-chat .cv-site-nav a { padding-inline:8px; }
  .cv-guest .cv-header-end { margin-left:0; }
  .cv-guest .cv-site-header .cv-btn.cv-nav-signin { padding-inline:14px; }
  .cv-guest .cv-intro-center .cv-intro-title { font-size:clamp(2.25rem, 9.4vw, 3rem); }
  .cv-guest .cv-chat:has(.cv-intro-center:not([hidden])) > .cv-composer:not(.cv-docked) { width:calc(100% - 32px); }
}
.cv-guest .cv-below .cv-free-line { margin:0; color:var(--cv-label); font-family:var(--cv-font-mono); font-size:0.75rem; letter-spacing:0.02em; }
.cv-guest .cv-below .cv-samples { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px; }
.cv-guest .cv-below .cv-samples-label { margin:0 4px 0 0; color:var(--cv-muted); font-size:0.8125rem; }
.cv-guest .cv-below .cv-samples-row { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
.cv-guest .cv-below .cv-sample { display:inline-flex; grid-auto-flow:column; align-items:center; gap:10px; min-height:44px; padding:5px 12px 5px 5px;
  border:0; border-radius:var(--cv-pill); background:color-mix(in srgb, var(--cv-bg) 45%, transparent); box-shadow:0 0 0 1px var(--cv-line); color:var(--cv-ink); font-size:0.8125rem;
  transition:box-shadow 0.15s, background 0.15s; }
.cv-guest .cv-below .cv-sample img { width:28px; height:28px; border-radius:50%; box-shadow:none; }
.cv-guest .cv-below .cv-sample:hover, .cv-guest .cv-below .cv-sample:focus-visible { box-shadow:0 0 0 1px var(--cv-accent); color:var(--cv-ink-strong); transform:none; }
@media (prefers-reduced-motion: reduce) { .cv-guest .cv-below .cv-sample { transition:none; } }

/* ---------- Docked composer: the same form, pinned to the bottom of the viewport ---------- */
.cv-chat > .vc-dock-spacer { flex:0 0 auto; }
.cv-chat > .cv-composer.cv-docked { position:fixed; left:50%; bottom:calc(16px + env(safe-area-inset-bottom)); transform:translateX(-50%);
  width:min(720px, calc(100vw - 24px)); box-sizing:border-box; margin:0 0 var(--vc-cookie-h, 0px); padding:0; z-index:40;
  border:0; background:transparent; box-shadow:none; }
.cv-composer.cv-docked .cv-dropzone { padding:16px 14px 12px 22px; border:0; border-radius:28px; background:color-mix(in srgb, var(--cv-bg) 82%, transparent); -webkit-backdrop-filter:blur(18px) saturate(1.4);
  backdrop-filter:blur(18px) saturate(1.4); box-shadow:0 12px 40px rgba(0,0,0,0.28); }
.cv-composer.cv-docked .cv-attach-labelled { width:44px; padding:0; border-color:transparent; }
.cv-chat:has(.cv-intro:not([hidden])) .cv-composer.cv-docked .cv-attach-labelled .cv-attach-label { display:none; }
.cv-composer.cv-docked .cv-icon-circle { min-width:44px; min-height:44px; }
/* The pinned composer never covers the end of the page. */
.cv-chat:has(.cv-composer.cv-docked) { scroll-padding-bottom:calc(152px + env(safe-area-inset-bottom) + var(--vc-cookie-h, 0px)); }
.cv-chat:has(.cv-composer.cv-docked) > .cv-site-footer { padding-bottom:140px; }

/* ---------- Footer theme switch: plain text, no icon ---------- */
.vc-theme-link { display:inline-flex; align-items:center; min-height:44px; padding:0 8px; border:0; background:none; color:var(--cv-muted);
  font:inherit; cursor:pointer; }
.vc-theme-link:hover { color:var(--cv-accent); text-decoration:underline; }
.vc-theme-to-light { display:none; }
html[data-theme="dark"] .vc-theme-to-light { display:inline; }
html[data-theme="dark"] .vc-theme-to-dark { display:none; }

/* Attachment is secondary to the question and send action. */
.cv-guest .cv-chat:has(.cv-intro-center:not([hidden])) .cv-composer:not(.cv-docked) .cv-attach-labelled {
  border-color:transparent; background:transparent; padding-inline:4px 8px; }

/* Keep the real composer compact while the visitor reads the page. */
.cv-composer.cv-docked .cv-dropzone { display:grid; grid-template-columns:minmax(0, 1fr) auto; align-items:center; gap:8px;
  padding:10px 14px; border-radius:30px; }
.cv-composer.cv-docked .cv-attachments { grid-column:1 / -1; }
html .cv-guest .cv-chat .cv-composer.cv-docked .cv-input { grid-column:1; min-width:0; padding:8px 0; font-size:1rem; line-height:1.5; }
.cv-composer.cv-docked .cv-composer-row { grid-column:2; margin:0; padding:0; }

/* One image card follows the example being typed in the real composer's placeholder. */
.cv-chat > .vc-hero-media { flex:0 0 auto; position:relative; z-index:1; width:min(832px, calc(100% - 64px));
  height:280px; margin:-52px auto 0; overflow:hidden; border-radius:36px; background:#252c30; }
.cv-chat:has(.cv-intro[hidden]) > .vc-hero-media { display:none; }
.vc-hero-example { position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity 1.2s ease, visibility 1.2s; }
.vc-hero-example.is-active { opacity:1; visibility:visible; }
.vc-hero-example img { width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(0.65); }
.vc-hero-media::after { content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(5,7,15,0.18), transparent 45%, rgba(5,7,15,0.64)); }
.vc-hero-label, .vc-hero-media figcaption { position:absolute; bottom:22px; z-index:2; color:#fff; font-size:0.75rem; line-height:1.5; }
.vc-hero-label { left:24px; }
.vc-hero-media figcaption { right:24px; margin:0; color:rgba(255,255,255,0.78); }
@media (max-width:720px) {
  .cv-guest .cv-chat:has(.cv-intro-center:not([hidden])) > .cv-scroll { padding-block:24px; min-height:240px; }
  .cv-chat > .vc-hero-media { width:calc(100% - 48px); height:208px; margin-top:-44px; border-radius:26px; }
  .vc-hero-label, .vc-hero-media figcaption { bottom:16px; font-size:0.6875rem; }
  .vc-hero-label { left:16px; }
  .vc-hero-media figcaption { right:16px; }
}
@media (prefers-reduced-motion:reduce) { .vc-hero-example { transition:none; } }
