/* =============================================================================
   P R A E G N O S I S   —   S T Y L E S H E E T (FULL, STABLE)
   ========================================================================== */

/* ===== EDIT HERE — THEME TOKENS ========================================== */
:root{
  --bg-900:#0b0f14;
  --bg-800:#0d141b;
  --text-100:#e6eef6;
  --muted-60:#9aa6b2;
  --accent-1:#2bd4ff;
  --accent-2:#0b6efd;
  --card:#ffffff;
  --card-text:#0b1220;
  --border:rgba(255,255,255,.06);
  --shadow:0 10px 30px rgba(0,0,0,.35);
  --radius-s:8px; --radius-m:12px; --radius-l:14px; --radius-pill:9999px;

  --page-max:1200px;
  --page-pad:18px;
}

/* ===== DO NOT CHANGE — BASE ============================================== */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;
  background:linear-gradient(180deg,var(--bg-900),var(--bg-800));
  color:var(--text-100);
  overflow-x:hidden;
}

/* ===== EDIT HERE — HEADER / NAV WRAPPER ================================== */
.site-header{
  position:sticky; top:0; z-index:1000;
  background:rgba(7,10,14,.35);
  backdrop-filter:blur(8px) saturate(120%);
  border-bottom:1px solid rgba(255,255,255,.05);
  overflow:visible;
}
.nav-wrap{
  /* FLUSH-LEFT header: full width instead of centered max-width */
  max-width:none; width:100%;
  margin:0; padding:12px 18px;
  display:flex; align-items:center; gap:12px;
}

/* ===== EDIT HERE — LOGO + BRAND ========================================== */
.logo{display:flex; align-items:center; gap:10px; text-decoration:none; color:inherit}
.logo-type{ display:flex; align-items:baseline; gap:10px; line-height:1; }
.logo-type .brand-name{ font-weight:800; font-size:28px; line-height:1; letter-spacing:.2px; }
.logo-type .sub{ font-size:12px; color:var(--muted-60); white-space:nowrap; }
.logo-video{ display:block; border-radius:8px; object-fit:cover; background:#0a1c28; }

/* ===== EDIT HERE — TOP NAV (LEFT-ALIGNED DROPDOWNS + POLISH) ============= */
.menu.anduril-nav{
  margin-left:auto; justify-content:flex-end; position:relative;
  display:flex; align-items:center; gap:18px;
}
.anduril-nav .nav-link{
  appearance:none; background:transparent; border:0; color:inherit; font:inherit;
  padding:12px 12px; border-radius:8px; cursor:pointer; text-decoration:none;
  display:inline-flex; align-items:center; gap:6px; font-weight:600; letter-spacing:.02em;
}
.anduril-nav .nav-link:hover{ background:rgba(255,255,255,.04); }
.anduril-nav .nav-item{ position:relative !important; display:inline-flex; flex:0 0 auto; }
.nav-caret{ opacity:.7; font-size:.9em; transform:translateY(1px); }

/* Panel — left-aligned under its trigger (auto-flips via .align-right) */
.anduril-nav .nav-item > .dropdown-panel{
  position:absolute; z-index:1200;
  left:0 !important; right:auto !important; top:calc(100% + 12px);
  transform:translateY(8px) !important;
  min-width:720px; padding:22px 24px;
  display:none; opacity:0; pointer-events:none;
  background:rgba(7,12,18,.96);
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px; box-shadow:0 30px 90px rgba(0,0,0,.55);
  transition:opacity .12s ease, transform .12s ease;

  display:grid; gap:8px 24px;
  grid-template-columns:repeat(2, minmax(240px,1fr));
}
@media (min-width:1200px){
  .anduril-nav .nav-item > .dropdown-panel{ grid-template-columns:repeat(3, minmax(240px,1fr)); }
}
.anduril-nav .nav-item.open > .dropdown-panel{
  display:block; opacity:1; pointer-events:auto; transform:translateY(0) !important;
}
.anduril-nav .nav-item.align-right > .dropdown-panel{
  left:auto !important; right:0 !important; transform:translateY(8px) !important;
}
.anduril-nav .nav-item.align-right.open > .dropdown-panel{ transform:translateY(0) !important; }
.dropdown-panel .dropdown-col{ position:relative; min-width:240px; padding:4px 10px 12px 10px; }
.dropdown-panel .dropdown-col:not(:last-child)::after{
  content:""; position:absolute; right:-12px; top:0; width:1px; height:100%;
  background:linear-gradient(to bottom, transparent, rgba(255,255,255,.06), transparent);
}
.dropdown-panel .dropdown-title{
  margin:4px 0 10px; font-size:12px; color:#8fa3b5;
  text-transform:uppercase; letter-spacing:.12em;
}
.dropdown-panel .dropdown-link{
  display:block; padding:10px 12px; border-radius:10px;
  font-size:16px; color:#eaf4ff; text-decoration:none;
  transition:transform .12s ease, background .12s ease, color .12s ease;
}
.dropdown-panel .dropdown-link:hover{ background:rgba(255,255,255,.07); transform:translateY(-1px); }
.anduril-nav .nav-item.has-dropdown::after{
  content:""; position:absolute; left:-10px; right:-10px; top:100%; height:14px;
}
/* Mobile: hide desktop dropdowns; off-canvas handles nav */
@media (max-width:900px){ .nav-item.has-dropdown{ display:none; } }

/* ===== EDIT HERE — PILL BUTTONS ========================================== */
.menu-chat-btn,.launch-chat-btn{
  appearance:none; border:1px solid rgba(0,0,0,.12);
  background:#fff; color:#0b1220;
  height:54px; padding:0 22px; border-radius:var(--radius-pill);
  font-weight:700; cursor:pointer; display:inline-flex; align-items:center; gap:10px;
  box-shadow:0 10px 24px rgba(0,0,0,.12);
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.menu-chat-btn:hover,.launch-chat-btn:hover{ transform:translateY(-1px); box-shadow:0 14px 28px rgba(0,0,0,.16); background:#f8fafc; }
@media (max-width:900px){ .menu-chat-btn{ display:none; } }

/* ===== EDIT HERE — HERO (full-width, simple) ============================== */
.hero{ width:100%; margin:28px 0 0 0; padding:0; }
.hero-box{
  width:100%; margin:0; border-radius:0; border:0; overflow:hidden;
  background:linear-gradient(135deg,#0b1c28,#05304a);
}
.hero-media{
  display:block; width:100%;
  height:clamp(300px,60vh,640px);
  object-fit:cover; background:#0a1c28;
}
.hero-overlay{
  position:absolute; left:24px; top:18px; color:#bfe6ff;
  padding:6px 10px; border-radius:var(--radius-s);
  background:rgba(0,0,0,.3); backdrop-filter:blur(4px); font-weight:600;
}
/* One-line tweak cheatsheet (no hunting later)
	Make hero taller/shorter: edit only --hero-h in the patch block.
	Switch to bold fill: change hero--contain → hero--cover in the <section…> tag.
	Adjust crop when in bold fill: edit --hero-pos-y (0%=top, 100%=bottom).
	Chevron overscrolling: adjust --header-h if the sticky header height changes.*/
/* [2025-11-07 21:10 ET] HERO tuning */
:root{
  /* Visible hero height; tweak to taste */
  --hero-h: clamp(360px, 56vh, 780px);

  /* Vertical framing of the video inside the crop (0% = top, 100% = bottom) */
  --hero-pos-y: 35%;
}

.hero .hero-media{
  height: var(--hero-h);      /* fixes visible height */
  object-fit: cover;          /* keep it bold; trims top/bottom if needed */
  object-position: 0% var(--hero-pos-y); /* nudge the crop upward */
  display: block;
  width: 100%;
}
/*  End 2025-11-07 21:10 ET edits      */

.scroll-arrow{
  position:absolute; left:50%; bottom:12px; transform:translateX(-50%);
  opacity:.75; display:inline-flex; border-radius:50%; padding:6px; animation:bounce 2.8s ease-in-out infinite;
}
.scroll-arrow img{ display:block; width:40px; height:40px; }
.scroll-arrow:hover{ opacity:1; transform:translateX(-50%) translateY(-2px); }
@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-6px)}}

/* ===== EDIT HERE — CHATBOT RIBBON (full-bleed white) ===================== */
.chatbot-hero{
  width:100%;
  margin:0;
  padding:0; /* full-bleed band */
}
.chatbot-card{
  width:100%;
  border-radius:0;          /* make it a white ribbon */
  border-left:0; border-right:0;
  border-top:1px solid rgba(0,0,0,.06);
  border-bottom:1px solid rgba(0,0,0,.06);
  background:var(--card); color:var(--card-text);
  box-shadow:none;          /* flat ribbon look */
  padding:24px 24px;
  display:grid; grid-template-columns:1fr 1fr; gap:24px;
}
.chatbot-left{ min-height:260px; max-height:520px; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.chat-intro{ max-width:680px; text-align:left; }
.chatbot-right h3{ margin-top:4px; margin-bottom:8px; }
.bullets{ margin-top:6px; } .bullets li{ margin:6px 0; }

/* ===== EDIT HERE — RIBBONS (full-width) ================================== */
.ribbon{
  width:100%; margin:0; border-radius:0;
  border-top:1px solid var(--border); border-bottom:1px solid var(--border);
  min-height:320px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#0b1c28,#05304a);
}
.ribbon .ribbon-center-label{ color:#cfefff; font-weight:700; letter-spacing:.03em; opacity:.9 }

/* ===== EDIT HERE — CATALOG / CARDS ======================================= */
.catalog{ max-width:var(--page-max); margin:28px auto; padding:0 var(--page-pad); }
.catalog h2{ margin-bottom:8px; }
.top-gap{ margin-top:6px; }
.catalog-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; margin-top:8px; }
.card{
  background:rgba(255,255,255,.02); padding:14px; border-radius:10px; border:1px solid var(--border);
  min-height:160px; display:flex; flex-direction:column; gap:8px;
}
.card .thumb{ width:100%; height:90px; border-radius:8px; object-fit:cover; background:#0a1c28; }
.card-title{ font-weight:700; }
.tag{ font-size:12px; color:#muted-60; }

/* ===== EDIT HERE — COPY / FOOTER ========================================= */
.copy{ max-width:var(--page-max); margin:28px auto; padding:0 var(--page-pad); }
.copy .muted{ color:var(--muted-60); }
.site-footer{ border-top:1px solid var(--border); margin-top:28px; }
.footer-inner{
  max-width:var(--page-max); margin:0 auto; padding:16px var(--page-pad);
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.foot-left{ display:flex; align-items:center; gap:10px; }
.foot-nav{ display:flex; gap:14px; flex-wrap:wrap; }
.foot-nav a{ color:var(--text-100); text-decoration:none; padding:6px 8px; border-radius:var(--radius-s); }
.foot-nav a:hover{ background:rgba(255,255,255,.04); }

/* ===== EDIT HERE — CHAT MODAL ============================================ */
.chat-modal{ position:fixed; inset:0; display:none; z-index:1150; }
.chat-modal.open{ display:block; }
.chat-modal-backdrop{ position:absolute; inset:0; background:rgba(7,10,14,.65); backdrop-filter:blur(6px); }
.chat-modal-dialog{
  position:absolute; top:50%; transform:translateY(-50%);
  left:24px; right:50%; width:auto; max-height:86vh;
  display:flex; flex-direction:column;
  background:#fff; color:#0b1220; border-radius:var(--radius-l);
  box-shadow:0 30px 80px rgba(0,0,0,.45); overflow:hidden;
}
@media (max-width:1000px){
  .chat-modal-dialog{ left:50%; right:auto; transform:translate(-50%,-50%); width:min(100%, 920px); max-width:92vw; }
}
.chat-modal-header{ display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-bottom:1px solid rgba(0,0,0,.08); }
.chat-modal-subtext{ padding:10px 14px 0 14px; border-bottom:1px solid rgba(0,0,0,.06); }
.chat-modal-subtext .muted{ color:#6b7280; }
.chat-modal-body{ flex:1; min-height:460px; }
.chat-modal-body elevenlabs-convai{ display:block; width:100%; height:100%; }
.chat-modal-footer{ padding:8px 14px; border-top:1px solid rgba(0,0,0,.08); }
.chat-modal-close{
  background:transparent; border:1px solid rgba(0,0,0,.15);
  border-radius:var(--radius-s); padding:6px 10px; cursor:pointer;
}
.chat-modal-close:hover{ background:rgba(0,0,0,.04) }

/* ===== DO NOT CHANGE — VENDOR LAUNCHER KILL-SWITCH ======================= */
body [data-testid*="launcher"],
body [data-testId*="launcher"],
body [class*="elevenlabs"][class*="launcher"],
body [aria-label*="ElevenLabs"] { display:none !important; }

/* ===== OFF-CANVAS HARD HIDE (prevents stray list) ======================== */
.offcanvas{ display:none !important; }
.offcanvas.open{ display:block !important; }

/* ===== DO NOT CHANGE — RESPONSIVE DEFAULTS =============================== */
@media (max-width:900px){
  .menu{ display:none; }
  .hamburger{ display:inline-block; }
  .chatbot-card{ grid-template-columns:1fr; }
}
.hamburger{
  order:3; background:transparent; border:1px solid var(--border);
  color:var(--text-100); padding:6px 10px; border-radius:var(--radius-s); display:none;
}

/* ========================================================================
   [PRGX PATCH 2025-11-07 22:58 ET] HERO & SCROLL (append-only)
   - .hero--contain => no crop (letterbox)
   - .hero--cover   => bold fill (cropped), use --hero-pos-y to bias crop
   - Chevron jumps to #chatbot-hero; scroll lands below sticky header
   - ~20% taller hero via --hero-h
   ======================================================================== */

:root{
  /* header height for anchor landing (adjust if your header grows/shrinks) */
  --header-h: 84px;

  /* visible hero height — increase for a taller hero */
  --hero-h: clamp(420px, 62vh, 820px);

  /* crop bias ONLY used by .hero--cover (ignored by contain) */
  --hero-pos-y: 50%;
}

.hero{ margin:0; padding:0; position:relative; }
.hero .hero-box{ position:relative; overflow:hidden; background:#0b141b; }

/* video element’s visible box — controls apparent height */
.hero .hero-media{
  width:100%;
  height:var(--hero-h);
  display:block;
  background:#0b141b; /* shows behind bars when using contain */
}

/* MODE A: NO CROP (letterboxed) */
.hero--contain .hero-media{
  object-fit:contain;
  object-position:center center; /* no visual impact with contain, kept explicit */
}

/* MODE B: FILL (cropped) */
.hero--cover .hero-media{
  object-fit:cover;
  object-position:50% var(--hero-pos-y); /* try 35%..60% to raise/lower crop */
}

/* Chevron (kept minimal; matches your markup) */
.scroll-arrow{
  position:absolute; left:50%; bottom:12px; transform:translateX(-50%);
  display:inline-flex; width:44px; height:44px; align-items:center; justify-content:center;
  border-radius:999px; background:rgba(0,0,0,.35); backdrop-filter:blur(4px);
  transition:opacity .2s ease, transform .2s ease;
}
.scroll-arrow img{ width:24px; height:24px; display:block; }
.scroll-arrow:hover{ opacity:1; transform:translateX(-50%) translateY(-2px); }

/* Anchor landing under sticky header */
#chatbot-hero{ scroll-margin-top: calc(var(--header-h) + 10px); }

/* ========================================================================
   [PRGX PATCH 2025-11-07 22:58 ET] HERO & SCROLL — END
   ======================================================================== */
