/* Shared RealTorch styles, generated from index.html by build_functions.py.
   Edit index.html, not this file. */

/* ============ RealTorch Landing — white / black / orange ============ */
:root {
  --orange: #e8662a;
  --orange-deep: #cd4524;
  --orange-tint: #fff7ed;
  --ink: #111111;
  --ink-soft: #3f3f3f;
  --button-dark: #4f4b46;
  --gray: #6b6b6b;
  --line: #e8e4de;
  --cream: #faf8f5;
  --white: #ffffff;
  --mono: "JetBrains Mono", ui-monospace, monospace;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--sans);
  color: var(--ink);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  line-height: 1.6;
}

.container { max-width: 1180px; margin: 0 auto; padding: 0 32px; }
.mono { font-family: var(--mono); }
.accent { color: var(--orange); }
.desktop-only { display: inline; }

/* ---------- Reveal animation ---------- */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.7s ease, transform 0.7s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }

/* ---------- Buttons ---------- */
.btn {
  display: inline-block;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  border-radius: 8px;
  padding: 11px 22px;
  transition: all 0.18s ease;
  border: 1.5px solid transparent;
  line-height: 1.3;
}
.btn-primary { background: var(--orange); color: #fff; }
.btn-primary:hover { background: var(--orange-deep); transform: translateY(-1px); }
.btn-outline { border-color: var(--button-dark); color: var(--button-dark); background: transparent; }
.btn-outline:hover { background: var(--button-dark); color: #fff; }
.btn-ghost {
  color: var(--button-dark);
  background: #fff;
  border-color: var(--button-dark);
}
.btn-ghost:hover {
  color: #fff;
  background: var(--button-dark);
}
.btn-lg { padding: 15px 30px; font-size: 16px; border-radius: 10px; }
.btn-block { display: block; text-align: center; width: 100%; }

/* ---------- Nav ---------- */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid transparent;
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.nav.scrolled { border-bottom-color: var(--line); box-shadow: 0 1px 12px rgba(17, 17, 17, 0.05); }
.nav-inner {
  max-width: 1480px; margin: 0 auto; padding: 0 28px;
  height: 72px; display: flex; align-items: center; gap: 40px;
}
.nav-logo { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.nav-logo img { height: 60px; display: block; }
.nav-logo-divider { width: 1px; height: 22px; background: var(--line); }
.nav-logo-atlas { font-weight: 700; font-size: 17px; color: var(--ink); letter-spacing: 0.01em; }
.nav-links { display: flex; gap: 28px; flex: 1; }
.nav-links a { text-decoration: none; color: var(--ink-soft); font-weight: 500; font-size: 15px; transition: color 0.15s; }
.nav-links a:hover { color: var(--orange); }
.nav-actions { display: flex; align-items: center; gap: 10px; }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: 92vh; display: flex; flex-direction: column; justify-content: center; overflow: hidden; }
.hero-bg {
  position: absolute; inset: 0;
  background: none right center / cover no-repeat, #fdfcfa;
}
.hero-bg::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(
    90deg,
    rgba(253,252,250,0.99) 0%,
    rgba(253,252,250,0.96) 42%,
    rgba(253,252,250,0.86) 58%,
    rgba(253,252,250,0.55) 72%,
    rgba(253,252,250,0) 88%
  );
}
.hero-content {
  position: relative; z-index: 2;
  max-width: 1180px; margin: 0 auto; width: 100%;
  padding: 150px 32px 110px;
}
.eyebrow {
  font-family: var(--mono); font-size: 13px; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--orange);
  margin-bottom: 18px;
}
.hero .eyebrow {
  font-size: 17px;
  letter-spacing: 0.12em;
  margin-bottom: 20px;
}
.hero h1 {
  font-size: clamp(44px, 6.4vw, 84px);
  font-weight: 800; line-height: 1.04; letter-spacing: -0.03em;
  margin-bottom: 26px;
}
.hero-sub {
  max-width: 760px;
  margin-bottom: 38px;
  color: #37332f;
  font-size: clamp(18px, 1.65vw, 22px);
  line-height: 1.58;
  text-shadow: 0 1px 20px rgba(255, 255, 255, 0.72);
}
.hero-sub strong { color: var(--orange); font-weight: 750; }
.hero-ctas { display: flex; gap: 14px; flex-wrap: wrap; }
.hero-ctas .btn-outline {
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.hero-ctas .btn-outline:hover { background: var(--ink); }

/* ---------- Statement ---------- */
.statement { padding: 130px 0 90px; text-align: center; scroll-margin-top: 72px; }
.statement h2 {
  font-size: clamp(30px, 4vw, 52px); font-weight: 800; letter-spacing: -0.025em;
  line-height: 1.12; max-width: 850px; margin: 0 auto;
}
.statement-sub { font-size: clamp(17px, 1.8vw, 22px); color: var(--gray); }

/* ---------- Pillars ---------- */
.pillars { padding: 20px 0 110px; }
.pillar-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 44px; }
.pillar { border-top: 2px solid var(--ink); padding-top: 26px; }
.pillar-num { font-family: var(--mono); font-size: 14px; font-weight: 700; color: var(--orange); margin-bottom: 14px; }
.pillar h3 {
  min-height: 2.44em;
  margin-bottom: 14px;
  font-size: 23px;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.22;
}
.chevrons { color: var(--orange); font-size: 16px; letter-spacing: -0.35em; margin-left: 6px; }
.pillar p { color: var(--ink-soft); font-size: 15.5px; }

/* ---------- Aerial break ---------- */
.break-aerial {
  position: relative; min-height: 64vh;
  background: none center / cover no-repeat, #eceae4;
  display: flex; align-items: flex-end;
}
.break-aerial::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(17, 17, 17, 0) 0%,
    rgba(17, 17, 17, 0.01) 32%,
    rgba(17, 17, 17, 0.29) 50%,
    rgba(17, 17, 17, 0.57) 68%,
    rgba(17, 17, 17, 0.75) 100%
  );
}
.break-overlay {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: 150px 32px 64px;
}
.break-placeholder {
  max-width: 1180px;
  margin: 0 auto;
}
.break-placeholder h2 {
  max-width: 980px;
  color: #fff;
  font-size: clamp(34px, 5vw, 64px);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.08;
  text-shadow: 0 2px 26px rgba(26,22,18,0.55);
}
.break-quote { max-width: 1180px; margin: 0 auto; }
.break-quote blockquote {
  color: #fff; font-size: clamp(19px, 2.1vw, 28px); font-weight: 600;
  letter-spacing: -0.015em; line-height: 1.42; max-width: 1000px;
  text-shadow: 0 2px 22px rgba(26,22,18,0.55);
}
.break-quote figcaption {
  margin-top: 20px; color: rgba(255,255,255,0.85); font-size: 15px;
  text-shadow: 0 1px 14px rgba(26,22,18,0.55);
}
.break-quote figcaption b { color: #fff; font-weight: 700; }

/* ---------- Capabilities (bento) ---------- */
.capabilities { padding: 120px 0; background: var(--white); }
.section-title {
  font-size: clamp(30px, 3.8vw, 48px); font-weight: 800;
  letter-spacing: -0.025em; line-height: 1.1; margin-bottom: 64px;
}
.bento { display: grid; grid-template-columns: repeat(12, 1fr); gap: 20px; }
.bento-wide { grid-column: span 7; }
.bento-narrow { grid-column: span 5; }
.bento-market { order: 0; }
.bento-floor { order: 1; }
.bento-cfo { order: 2; }
.bento-email { order: 3; }
.bento-report { order: 4; }
.bento-card {
  background: var(--cream);
  background-image: radial-gradient(circle, rgba(17,17,17,0.045) 1px, transparent 1px);
  background-size: 15px 15px;
  border: 1px solid var(--line); border-radius: 18px;
  padding: 30px 32px 0; overflow: hidden;
  display: flex; flex-direction: column;
  min-height: 430px;
}
.bento-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 8px; }
.bento-head h4 { font-size: clamp(20px, 1.9vw, 26px); font-weight: 700; letter-spacing: -0.02em; line-height: 1.25; max-width: 420px; }
.bento-head h4 b { color: var(--ink); }
.bento-head h4 span { color: #8a857e; font-weight: 600; }

/* --- chat demo --- */
.chat-demo { position: relative; flex: 1; margin: 18px -6px 0; padding: 10px 6px 30px; display: flex; flex-direction: column; gap: 14px; }
.chat-bubble { max-width: 78%; font-size: 14px; line-height: 1.5; border-radius: 14px; padding: 12px 16px; }
.chat-user {
  align-self: flex-end; background: var(--ink); color: #fff;
  border-bottom-right-radius: 4px;
  opacity: 0; animation: chatUser 16s ease infinite;
}
.chat-typing {
  position: absolute; top: 64px; left: 6px;
  background: var(--white); border: 1px solid var(--line);
  border-radius: 14px; border-bottom-left-radius: 4px; padding: 14px 16px;
  display: flex; gap: 5px; opacity: 0; animation: chatTyping 16s ease infinite;
}
.chat-typing span { width: 7px; height: 7px; border-radius: 50%; background: #c9c2b9; animation: typingBounce 1s ease infinite; }
.chat-typing span:nth-child(2) { animation-delay: 0.15s; }
.chat-typing span:nth-child(3) { animation-delay: 0.3s; }
@keyframes chatUser { 0%, 2% { opacity: 0; transform: translateY(10px); } 5%, 96% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; } }
@keyframes chatTyping { 0%, 7% { opacity: 0; } 9%, 15% { opacity: 1; } 17%, 100% { opacity: 0; } }
@keyframes typingBounce { 0%, 60%, 100% { transform: translateY(0); } 30% { transform: translateY(-4px); } }

/* --- P&L sheet --- */
.sheet {
  align-self: stretch; background: #fff; border: 1px solid var(--line);
  border-radius: 12px; overflow: hidden;
  box-shadow: 0 14px 40px rgba(17,17,17,0.08);
  opacity: 0; animation: sheetIn 16s ease infinite;
}
.sheet-bar {
  display: flex; align-items: center; gap: 9px;
  padding: 10px 14px; border-bottom: 1px solid #eef0ee; background: #fbfbfa;
}
.sheet-bar i {
  font-style: normal; font-family: var(--mono); font-size: 10px; font-weight: 700;
  width: 18px; height: 18px; border-radius: 4px;
  background: #1d6f42; color: #fff;
  display: flex; align-items: center; justify-content: center;
}
.sheet-bar b { font-family: var(--mono); font-size: 12px; font-weight: 700; }
.sheet-bar span { font-size: 11px; color: #a5a09a; margin-left: auto; }
.sheet-table { width: 100%; border-collapse: collapse; }
.sheet-table td { padding: 5px 14px; font-size: 12.5px; border-top: 1px solid #f3f4f2; }
.sheet-table td:nth-child(2), .sheet-table td:nth-child(3) {
  text-align: right; font-family: var(--mono); font-size: 11.5px; white-space: nowrap;
}
.sheet-table td:nth-child(3) { color: #a5a09a; width: 64px; }
.sheet-table .sh td {
  border-top: none; padding-top: 8px; padding-bottom: 5px;
  font-size: 10px; font-family: var(--mono); font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.08em; color: #b9b2a8;
}
.sheet-table .st td { font-weight: 700; border-top: 1.5px solid var(--line); }
.sheet-table .st td:nth-child(2) { color: var(--ink); }
.sheet-table .snet td {
  font-weight: 800; background: var(--orange-tint);
  border-top: 1.5px solid #f4cdb2;
}
.sheet-table .snet td:nth-child(2), .sheet-table .snet td:nth-child(3) { color: var(--orange-deep); }
.sheet-table .sr { opacity: 0; animation: rowIn 16s ease infinite; }
.sheet-table .r1 { animation-delay: 0.00s; }
.sheet-table .r2 { animation-delay: 0.25s; }
.sheet-table .r3 { animation-delay: 0.50s; }
.sheet-table .r4 { animation-delay: 0.75s; }
.sheet-table .r5 { animation-delay: 1.00s; }
.sheet-table .r6 { animation-delay: 1.25s; }
.sheet-table .r7 { animation-delay: 1.50s; }
.sheet-table .r8 { animation-delay: 1.75s; }
.sheet-table .r9 { animation-delay: 2.00s; }
@keyframes sheetIn { 0%, 16% { opacity: 0; transform: translateY(14px); } 20%, 96% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; } }
@keyframes rowIn { 0%, 20% { opacity: 0; transform: translateX(-8px); } 23%, 95% { opacity: 1; transform: translateX(0); } 98%, 100% { opacity: 0; } }

/* --- map demo --- */
.map-demo { position: relative; flex: 1; margin: 18px -32px 0; min-height: 300px; overflow: hidden; }
.map-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.map-query {
  position: absolute; z-index: 2; left: 14px; top: 14px; max-width: 84%;
  padding: 10px 13px; border-radius: 12px 12px 12px 4px;
  background: var(--ink); color: #fff; font-size: 11.5px; line-height: 1.45;
  box-shadow: 0 8px 24px rgba(17,17,17,0.18);
}
.map-dot {
  position: absolute; width: 14px; height: 14px; border-radius: 50%;
  border: 2px solid #fff; box-shadow: 0 2px 8px rgba(17,17,17,0.25);
  opacity: 0; animation: dotIn 14s ease infinite;
}
.map-dot.d1 { left: 18%; top: 46%; background: #f6c39d; animation-delay: 0.0s; }
.map-dot.d2 { left: 34%; top: 68%; background: #ef9257; animation-delay: 0.4s; }
.map-dot.d3 { left: 47%; top: 55%; background: #a8361c; width: 17px; height: 17px; animation-delay: 0.8s; }
.map-dot.d4 { left: 60%; top: 38%; background: #e8662a; animation-delay: 1.2s; }
.map-dot.d5 { left: 72%; top: 60%; background: #7a2413; animation-delay: 1.6s; }
.map-dot.d6 { left: 84%; top: 30%; background: #f6c39d; animation-delay: 2.0s; }
.map-dot.d7 { left: 26%; top: 34%; background: #f0a36f; animation-delay: 2.4s; }
.map-dot.d8 { left: 42%; top: 78%; background: #cc4f23; animation-delay: 2.8s; }
.map-dot.d9 { left: 56%; top: 70%; background: #f6c39d; animation-delay: 3.2s; }
.map-dot.d10 { left: 68%; top: 28%; background: #a8361c; animation-delay: 3.6s; }
.map-dot.d11 { left: 78%; top: 46%; background: #ef9257; animation-delay: 4.0s; }
.map-dot.d12 { left: 90%; top: 72%; background: #7a2413; animation-delay: 4.4s; }
.map-popup {
  position: absolute; z-index: 2; left: 14px; right: 14px; bottom: 14px;
  background: #fff; border-radius: 12px; padding: 13px 16px;
  box-shadow: 0 14px 40px rgba(17,17,17,0.18);
  opacity: 0; animation: popupIn 14s ease infinite;
}
.mp-kicker {
  font-family: var(--mono); font-weight: 700; font-size: 9.5px;
  letter-spacing: 0.08em; color: var(--orange-deep);
}
.mp-summary { font-size: 12.5px; font-weight: 700; margin-top: 4px; }
.mp-meta { font-size: 11.5px; color: var(--gray); margin-top: 2px; }
.mp-evidence {
  margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line);
  font-family: var(--mono); font-size: 9.5px; color: #8f887e;
}
.map-legend {
  position: absolute; left: 14px; bottom: 14px;
  background: #fff; border-radius: 10px; padding: 8px 12px;
  box-shadow: 0 6px 20px rgba(17,17,17,0.12);
  font-size: 10.5px; color: var(--gray);
}
.map-legend i { display: block; width: 110px; height: 6px; border-radius: 999px; margin: 4px 0 3px;
  background: linear-gradient(90deg, #fde4cf, #e8662a, #6b1f10); }
@keyframes dotIn { 0%, 4% { opacity: 0; transform: scale(0.3); } 9%, 96% { opacity: 1; transform: scale(1); } 100% { opacity: 0; } }
@keyframes popupIn { 0%, 22% { opacity: 0; transform: translateY(8px) scale(0.96); } 28%, 92% { opacity: 1; transform: translateY(0) scale(1); } 97%, 100% { opacity: 0; } }

/* --- email recall demo --- */
.email-demo {
  position: relative; flex: 1; margin-top: 18px; padding-bottom: 30px;
  display: flex; flex-direction: column; justify-content: center; gap: 14px;
}
.email-demo .chat-user { align-self: flex-end; max-width: 92%; }
.email-result {
  background: #fff; border: 1px solid var(--line);
  border-radius: 12px; padding: 0;
  box-shadow: 0 10px 30px rgba(17,17,17,0.06);
  overflow: hidden;
  opacity: 0; animation: erIn 16s ease infinite;
}
.er-head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 9px 14px; background: #faf9f7; border-bottom: 1px solid var(--line);
}
.er-mailbox {
  display: inline-flex; align-items: center; gap: 7px;
  font-family: var(--mono); font-size: 9.5px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--gray);
}
.er-mail-icon {
  position: relative; display: inline-block; width: 17px; height: 12px;
  border: 1.5px solid var(--orange); border-radius: 2px;
}
.er-mail-icon::after {
  content: ""; position: absolute; left: 2px; right: 2px; top: 1px; height: 7px;
  border-bottom: 1.5px solid var(--orange); transform: rotate(32deg) skewX(-25deg);
}
.er-date { font-size: 11.5px; color: #a5a09a; flex: none; }
.er-subj {
  font-size: 13px; font-weight: 700; color: var(--ink);
  padding: 12px 14px 8px;
}
.er-snippet { font-size: 12.5px; color: var(--gray); line-height: 1.55; padding: 0 14px 14px; }
.er-snippet b { color: var(--ink); }
.email-reply {
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  padding: 14px 16px; box-shadow: 0 10px 30px rgba(17,17,17,0.07);
  opacity: 0; animation: esIn 16s ease infinite;
}
.email-reply p { font-size: 12.5px; color: var(--ink-soft); line-height: 1.55; }
.email-reply p b { color: var(--ink); }
.email-reply .er-q { margin-top: 7px; font-weight: 600; color: var(--ink); }
.er-actions { display: flex; gap: 8px; margin-top: 11px; }
.er-btn-primary {
  background: var(--orange); color: #fff; font-size: 12px; font-weight: 700;
  border-radius: 8px; padding: 7px 14px;
}
.er-btn-ghost {
  border: 1px solid var(--line); background: #fff; color: var(--ink);
  font-size: 12px; font-weight: 600; border-radius: 8px; padding: 7px 14px;
}
@keyframes erIn { 0%, 14% { opacity: 0; transform: translateY(12px); } 19%, 96% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; } }
@keyframes esIn { 0%, 26% { opacity: 0; transform: translateY(8px) scale(0.95); } 31%, 96% { opacity: 1; transform: none; } 100% { opacity: 0; } }

/* --- floor plan demo --- */
.plan-demo {
  position: relative; flex: 1; margin-top: 16px; padding-bottom: 30px;
  display: grid; grid-template-columns: 1fr 1.05fr; gap: 22px;
}
.plan-left { position: relative; display: flex; flex-direction: column; }
.plan-zone {
  position: relative; flex: 1; min-height: 270px;
  border: 2px dashed #ddc9b8; border-radius: 14px; overflow: hidden;
  background: rgba(255,255,255,0.6);
  animation: zoneTint 16s ease infinite;
}
.plan-zone-label {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: #b9b2a8; font-size: 13.5px; font-weight: 600;
  animation: zoneLabel 16s ease infinite;
}
.plan-svg { position: absolute; inset: 14px; opacity: 0; animation: planIn 16s ease infinite; }
.plan-svg svg { width: 100%; height: 100%; object-fit: contain; }
.plan-chip {
  position: absolute; top: 16px; left: 22px;
  display: flex; align-items: center; gap: 8px;
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  padding: 8px 13px; font-size: 12px; font-weight: 600; white-space: nowrap;
  box-shadow: 0 10px 26px rgba(17,17,17,0.14);
  opacity: 0; animation: chipDrag 16s cubic-bezier(.3,.7,.4,1) infinite;
}
.plan-chip i {
  font-style: normal; font-family: var(--mono); font-size: 9px; font-weight: 700;
  background: var(--orange-tint); color: var(--orange-deep);
  border: 1px solid #f4d8c2; border-radius: 5px; padding: 2px 5px;
}
.plan-right { display: flex; flex-direction: column; justify-content: center; gap: 14px; }
.plan-right .chat-user { align-self: flex-end; max-width: 92%; animation-name: pqIn; }
.plan-verdict {
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  padding: 16px 18px; box-shadow: 0 12px 34px rgba(17,17,17,0.07);
  opacity: 0; animation: pvIn 16s ease infinite;
}
.pv-head { font-size: 14px; margin-bottom: 5px; }
.plan-verdict p { font-size: 13px; color: var(--ink-soft); margin-bottom: 6px; }
.plan-verdict p.pv-head { color: var(--ink); }
.plan-verdict ul { list-style: none; display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.plan-verdict li { font-size: 12.5px; line-height: 1.45; padding: 8px 12px; border-radius: 9px; }
.plan-verdict li.good { background: #f0f7f0; color: #2c5e2e; }
.plan-verdict li.warn { background: var(--orange-tint); color: #8a4416; }
@keyframes chipDrag {
  0% { opacity: 0; transform: translate(170px, -50px) rotate(3deg); }
  2% { opacity: 1; }
  10% { opacity: 1; transform: translate(30px, 100px) rotate(-1.5deg) scale(1.03); }
  13% { opacity: 1; transform: translate(32px, 106px) rotate(0deg) scale(0.96); }
  16%, 100% { opacity: 0; transform: translate(32px, 106px); }
}
@keyframes zoneLabel { 0%, 12% { opacity: 1; } 16%, 100% { opacity: 0; } }
@keyframes planIn { 0%, 13% { opacity: 0; transform: scale(0.97); } 18%, 96% { opacity: 1; transform: none; } 100% { opacity: 0; } }
@keyframes zoneTint { 0%, 13% { border-color: #ddc9b8; } 18%, 96% { border-color: var(--orange); } 100% { border-color: #ddc9b8; } }
@keyframes pqIn { 0%, 20% { opacity: 0; transform: translateY(10px); } 25%, 96% { opacity: 1; transform: none; } 100% { opacity: 0; } }
@keyframes pvIn { 0%, 30% { opacity: 0; transform: translateY(14px); } 36%, 96% { opacity: 1; transform: none; } 100% { opacity: 0; } }

/* --- files -> report demo (full-width row) --- */
.bento-full { grid-column: span 12; }
.bento-full .bento-head h4 { max-width: none; }
.report-demo {
  flex: 1; margin-top: 16px;
  display: grid; grid-template-columns: 1fr 1.1fr; gap: 30px;
}
.report-demo > *, .plan-demo > * { min-width: 0; }
.report-left { display: flex; flex-direction: column; justify-content: center; padding-bottom: 30px; }
.report-left .chat-user { align-self: flex-end; max-width: 88%; }
.attach-row { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; margin-top: 12px; }
.file-chip {
  display: flex; align-items: center; gap: 8px; width: fit-content;
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  padding: 7px 12px; font-size: 11.5px; font-weight: 600;
  box-shadow: 0 6px 18px rgba(17,17,17,0.07);
  opacity: 0;
}
.file-chip i {
  font-style: normal; font-family: var(--mono); font-size: 9px; font-weight: 700;
  background: var(--orange-tint); color: var(--orange-deep);
  border: 1px solid #f4d8c2; border-radius: 5px; padding: 2px 5px;
}
.file-chip.a1 { animation: attachIn 16s ease infinite; animation-delay: 0.5s; }
.file-chip.a2 { animation: attachIn 16s ease infinite; animation-delay: 0.8s; }
.file-chip.a3 { animation: attachIn 16s ease infinite; animation-delay: 1.1s; }
.pdf-card { display: flex; flex-direction: column; justify-content: flex-start; opacity: 0; animation: pdfUp 16s ease infinite; }
.pdf-bar {
  display: flex; align-items: center; gap: 9px; flex-wrap: wrap;
  background: #fbfbfa; border: 1px solid var(--line); border-bottom: none;
  border-radius: 12px 12px 0 0; padding: 10px 14px;
}
.pdf-bar i {
  font-style: normal; font-family: var(--mono); font-size: 9px; font-weight: 700;
  background: #c0392b; color: #fff; border-radius: 4px; padding: 3px 5px;
}
.pdf-bar b { font-family: var(--mono); font-size: 12px; font-weight: 700; min-width: 0; overflow-wrap: anywhere; }
.pdf-bar span { font-size: 11px; color: #a5a09a; margin-left: auto; }
.pdf-page {
  background: #fff; border: 1px solid var(--line); border-bottom: none;
  padding: 22px 26px 26px; margin-bottom: -120px;
  box-shadow: 0 -10px 34px rgba(17,17,17,0.07);
}
.pdf-eyebrow {
  font-family: var(--mono); font-size: 9.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.12em; color: var(--orange);
}
.pdf-title { font-size: 21px; font-weight: 800; letter-spacing: -0.02em; margin-top: 5px; }
.pdf-rule { width: 44px; height: 3px; background: var(--orange); border-radius: 999px; margin: 10px 0; }
.pdf-sub { font-size: 12.5px; color: var(--gray); margin-bottom: 16px; }
.pdf-h2 { font-size: 13.5px; font-weight: 800; letter-spacing: -0.01em; margin: 20px 0 6px; }
.pdf-table { width: 100%; border-collapse: collapse; }
.pdf-table td { font-size: 11.5px; color: var(--ink-soft); padding: 7px 0; border-top: 1px solid #f0ece6; }
.pdf-table td:last-child { text-align: right; font-family: var(--mono); font-weight: 700; font-size: 11px; color: var(--ink); }
.pdf-chart { display: flex; flex-direction: column; gap: 8px; }
.pc-row { display: flex; align-items: center; gap: 10px; font-size: 11px; color: var(--ink-soft); }
.pc-row span { width: 118px; flex: none; text-align: right; }
.pc-row em { font-style: normal; font-family: var(--mono); font-size: 10.5px; color: var(--gray); white-space: nowrap; }
.pc-bar { height: 12px; border-radius: 4px; background: #ddd6cd; }
.pc-bar.us { background: var(--orange); }
.pc-row:first-child { font-weight: 700; color: var(--ink); }
.pc-row:first-child em { color: var(--orange-deep); font-weight: 700; }
@keyframes attachIn {
  0%, 4% { opacity: 0; transform: translateY(8px) scale(0.92); }
  7%, 96% { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0; }
}
@keyframes pdfUp {
  0%, 17% { opacity: 0; transform: translateY(70px); }
  24%, 96% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .chat-user, .chat-typing, .sheet, .sheet-table .sr, .map-dot, .map-popup,
  .email-result, .email-reply, .plan-svg, .plan-verdict, .plan-zone,
  .file-chip, .pdf-card {
    animation: none !important; opacity: 1 !important; transform: none !important;
  }
  .chat-typing, .plan-chip, .plan-zone-label { display: none; }
}

/* ---------- Capabilities V2 ---------- */
.capabilities-v2 { display: none; padding: 116px 0 128px; background: #f7f8fa; }
body.is-v2 .capabilities { display: none; }
body.is-v2 .capabilities-v2 { display: block; }
.v2-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 0.62fr); gap: 54px; align-items: end; margin-bottom: 56px; }
.v2-kicker {
  margin-bottom: 14px; font-family: var(--mono); font-size: 12px; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--orange);
}
.v2-intro h2 {
  max-width: 760px; font-size: clamp(38px, 5vw, 66px); font-weight: 800;
  letter-spacing: -0.045em; line-height: 1.02;
}
.v2-intro > p:last-child { color: var(--gray); font-size: 18px; line-height: 1.58; }
.v2-shell {
  display: grid; grid-template-columns: 230px minmax(0, 1fr);
  min-height: 760px; border: 1px solid #dfe2e6; border-radius: 22px;
  background: #fff; overflow: hidden; box-shadow: 0 28px 80px rgba(17,17,17,0.07);
}
.v2-nav { padding: 42px 0; border-right: 1px solid #e3e5e8; background: #fbfbfc; }
.v2-nav-label {
  display: block; padding: 0 28px 20px; font-family: var(--mono); font-size: 10px;
  font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #a3a8af;
}
.v2-tab {
  position: relative; display: block; width: 100%; padding: 15px 28px;
  border: 0; background: transparent; color: #a3a8af; font: inherit;
  font-size: 16px; font-weight: 650; text-align: left; cursor: pointer;
  transition: color 0.2s ease, background 0.2s ease;
}
.v2-tab::before {
  content: ""; position: absolute; left: 0; top: 10px; bottom: 10px; width: 3px;
  border-radius: 0 4px 4px 0; background: transparent;
}
.v2-tab:hover { color: var(--ink); }
.v2-tab[aria-selected="true"] { color: var(--ink); background: #fff; }
.v2-tab[aria-selected="true"]::before { background: var(--orange); }
.v2-stage { min-width: 0; }
.v2-panel { display: none; }
.v2-panel.is-active { display: block; }
.v2-panel-head { padding: 42px 52px 34px; border-bottom: 1px solid #e3e5e8; }
.v2-panel-number {
  display: block; margin-bottom: 10px; font-family: var(--mono); font-size: 10.5px;
  font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--orange);
}
.v2-panel-head h3 {
  max-width: 760px; font-size: clamp(27px, 3vw, 40px); font-weight: 750;
  letter-spacing: -0.035em; line-height: 1.12;
}
.v2-demo { padding: 36px 52px 50px; background: #f5f6f8; }
.v2-question-row { display: flex; justify-content: flex-end; margin-bottom: 26px; }
.v2-question {
  max-width: 720px; padding: 14px 17px; border-radius: 16px 16px 4px 16px;
  background: var(--ink); color: #fff; box-shadow: 0 10px 28px rgba(17,17,17,0.12);
}
.v2-question-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 8px; }
.v2-file-pill {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px;
  border-radius: 6px; background: rgba(255,255,255,0.12); color: rgba(255,255,255,0.82);
  font-family: var(--mono); font-size: 9px; font-weight: 650;
}
.v2-file-pill b { color: #ffc9aa; }
.v2-question > p { font-size: 14px; line-height: 1.5; }
.v2-answer-card {
  padding: 24px 26px; border: 1px solid #e1e3e6; border-radius: 16px;
  background: #fff; box-shadow: 0 12px 34px rgba(17,17,17,0.05);
}
.v2-answer-label {
  display: flex; align-items: center; gap: 8px; margin-bottom: 10px;
  font-family: var(--mono); font-size: 10px; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--orange);
}
.v2-answer-label::before { content: "A"; display: grid; place-items: center; width: 23px; height: 23px; border-radius: 50%; background: var(--orange); color: #fff; font-family: var(--sans); font-size: 11px; }
.v2-answer-card h4 { font-size: 24px; font-weight: 800; letter-spacing: -0.025em; line-height: 1.18; }
.v2-answer-card > p:last-child { margin-top: 8px; color: var(--ink-soft); font-size: 14px; line-height: 1.6; }
.v2-output-label {
  margin: 26px 0 12px; font-family: var(--mono); font-size: 10px; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; color: #8c9299;
}
.v2-output-grid { display: grid; grid-template-columns: 1.25fr 0.75fr; gap: 14px; }
.v2-output {
  position: relative; min-width: 0; border: 1px solid #dde0e4; border-radius: 14px;
  background: #fff; overflow: hidden; box-shadow: 0 8px 24px rgba(17,17,17,0.045);
}
.v2-output-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 13px; border-bottom: 1px solid #e5e7ea; background: #fafafb;
}
.v2-output-bar strong { font-size: 11.5px; }
.v2-output-bar span { color: #999fa6; font-family: var(--mono); font-size: 9px; }
.v2-map { min-height: 285px; grid-row: span 2; }
.v2-map-canvas {
  position: relative; height: 245px; overflow: hidden;
  background:
    linear-gradient(28deg, transparent 47%, rgba(190,195,201,0.45) 48%, rgba(190,195,201,0.45) 49%, transparent 50%),
    linear-gradient(118deg, transparent 44%, rgba(204,208,213,0.52) 45%, rgba(204,208,213,0.52) 46%, transparent 47%),
    repeating-linear-gradient(0deg, transparent 0 33px, rgba(215,218,222,0.5) 34px 35px),
    repeating-linear-gradient(90deg, transparent 0 46px, rgba(215,218,222,0.42) 47px 48px),
    #eef0f2;
}
.v2-map-site {
  position: absolute; left: 43%; top: 34%; width: 126px; height: 88px;
  border: 2px solid var(--orange); background: rgba(232,102,42,0.14);
  clip-path: polygon(12% 8%, 86% 0, 100% 66%, 76% 100%, 4% 82%);
}
.v2-map-site::after { content: "30 ACRES"; position: absolute; left: 23px; top: 32px; font-family: var(--mono); font-size: 9px; font-weight: 700; color: var(--orange-deep); }
.v2-comp-dot { position: absolute; width: 10px; height: 10px; border: 2px solid #fff; border-radius: 50%; background: #555b62; box-shadow: 0 2px 7px rgba(17,17,17,0.22); }
.v2-comp-dot.hot { width: 13px; height: 13px; background: var(--orange); }
.v2-map-note {
  position: absolute; left: 13px; bottom: 13px; padding: 8px 10px;
  border-radius: 9px; background: rgba(255,255,255,0.95); box-shadow: 0 6px 20px rgba(17,17,17,0.1);
  font-size: 10px; font-weight: 700;
}
.v2-sheet { min-height: 133px; }
.v2-sheet table { width: 100%; border-collapse: collapse; }
.v2-sheet td { padding: 7px 12px; border-top: 1px solid #eef0f2; font-size: 10.5px; }
.v2-sheet td:last-child { text-align: right; font-family: var(--mono); font-weight: 700; }
.v2-sheet tr:last-child td { background: var(--orange-tint); color: var(--orange-deep); font-weight: 800; }
.v2-email { min-height: 138px; padding: 14px; }
.v2-email-top { display: flex; justify-content: space-between; color: #969ba1; font-family: var(--mono); font-size: 9px; }
.v2-email-subject { margin-top: 12px; font-size: 12px; font-weight: 800; }
.v2-email p { margin-top: 7px; color: var(--gray); font-size: 10.5px; line-height: 1.45; }
.v2-email strong { color: var(--orange-deep); }
.v2-action-board { grid-column: 1 / -1; }
.v2-action-grid { display: grid; grid-template-columns: 1.1fr 0.7fr 0.55fr; }
.v2-action-grid > * { padding: 9px 13px; border-top: 1px solid #eceef0; font-size: 10.5px; }
.v2-action-grid .head { color: #979ca2; font-family: var(--mono); font-size: 9px; font-weight: 700; text-transform: uppercase; }
.v2-status { display: inline-flex; align-items: center; gap: 5px; font-weight: 700; }
.v2-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--orange); }
.v2-project-sources { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 14px; }
.v2-source { padding: 12px; border: 1px solid #e6e8eb; border-radius: 10px; background: #fbfbfc; }
.v2-source b { display: block; font-size: 10.5px; }
.v2-source span { display: block; margin-top: 4px; color: #92979d; font-size: 9.5px; }
.v2-plan-output { min-height: 300px; }
.v2-plan-sheet {
  position: relative; height: 260px;
  background: linear-gradient(rgba(103,110,118,0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(103,110,118,0.08) 1px, transparent 1px), #faf9f6;
  background-size: 18px 18px;
}
.v2-plan-room { position: absolute; border: 2px solid #656b72; background: rgba(255,255,255,0.62); }
.v2-plan-room span { position: absolute; left: 8px; top: 8px; color: #858b92; font-family: var(--mono); font-size: 8px; }
.v2-plan-missing { position: absolute; right: 18px; bottom: 18px; padding: 9px 11px; border: 1px solid #d74b2c; border-radius: 8px; background: #fff5f1; color: #a8361c; font-size: 10px; font-weight: 750; }
.v2-estimate table { width: 100%; border-collapse: collapse; }
.v2-estimate td { padding: 8px 12px; border-top: 1px solid #eceef0; font-size: 10.5px; }
.v2-estimate td:last-child { text-align: right; font-family: var(--mono); }
.v2-estimate .removed td { color: #b7442c; text-decoration: line-through; background: #fff7f4; }
.v2-doc-stack { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 14px; }
.v2-doc-card { padding: 13px; border: 1px solid #e4e6e8; border-radius: 10px; }
.v2-doc-card b { display: block; font-size: 11px; }
.v2-doc-card span { display: block; margin-top: 4px; color: #94999f; font-size: 9.5px; }
.v2-doc-type { display: inline-flex; margin-bottom: 12px; padding: 4px 6px; border-radius: 5px; background: var(--orange-tint); color: var(--orange-deep); font-family: var(--mono); font-size: 8.5px; font-weight: 800; }

/* ---------- Pricing ---------- */
.pricing { padding: 120px 0; background: none center / cover no-repeat, var(--white); }
.pricing .section-title { margin-bottom: 16px; }
.pricing-sub { color: var(--gray); font-size: 17px; max-width: 860px; margin-bottom: 56px; }
.price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; align-items: start; }
.price-card {
  position: relative;
  background: var(--white); border: 1px solid var(--line); border-radius: 16px;
  padding: 34px 30px 30px;
}
.price-card-featured { border: 2px solid var(--orange); }
.price-badge {
  position: absolute; top: -14px; left: 50%; transform: translateX(-50%);
  font-family: var(--mono); font-size: 11.5px; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase;
  padding: 6px 16px; border-radius: 999px; white-space: nowrap;
}
.badge-dark { background: var(--ink); color: #fff; }
.price-card h3 { font-size: 27px; font-weight: 800; letter-spacing: -0.02em; margin-bottom: 10px; }
.price-desc { font-size: 15px; color: var(--gray); line-height: 1.55; min-height: 48px; margin-bottom: 24px; }
.price-amount { font-size: 48px; font-weight: 800; letter-spacing: -0.03em; margin-bottom: 18px; }
.price-amount span { font-size: 17px; font-weight: 500; color: var(--gray); letter-spacing: 0; }
.price-features { list-style: none; margin-bottom: 30px; }
.price-features li {
  font-size: 14.5px; color: var(--ink-soft); line-height: 1.5;
  padding: 12px 0; border-bottom: 1px solid #f0ece6;
}
.price-features li:last-child { border-bottom: none; }
.price-features li b { color: var(--ink); font-weight: 700; }

/* ---------- Final CTA ---------- */
.cta-final { padding: 120px 0 130px; background: var(--white); }
.cta-final .container { max-width: 1320px; }
.cta-final-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: clamp(48px, 6vw, 88px); align-items: center;
}
.cta-final-copy h2 {
  max-width: 610px;
  font-size: clamp(40px, 4.2vw, 58px); font-weight: 800;
  letter-spacing: -0.03em; line-height: 1.06; margin: 16px 0 26px;
}
.cta-final-sub { font-size: clamp(16px, 1.5vw, 20px); color: var(--ink-soft); max-width: 560px; }
.cta-final-side {
  padding: 28px;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: 18px;
}
.cta-final-side .btn-block { border-radius: 12px; }
.cta-lead-form {
  display: grid; gap: 14px;
  margin-top: 26px; padding-top: 26px;
  border-top: 1px solid var(--line);
}
.cta-lead-title { font-size: 17px; font-weight: 700; line-height: 1.35; }
.cta-lead-copy {
  margin-top: -6px;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.55;
}
.cta-lead-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cta-field { display: grid; gap: 7px; }
.cta-field span {
  font-family: var(--mono); font-size: 11px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--gray);
}
.cta-field input {
  width: 100%; min-width: 0; padding: 12px 13px;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--white); color: var(--ink); font: inherit;
}
.cta-field input:focus {
  outline: 2px solid rgba(232, 102, 42, 0.24);
  border-color: var(--orange);
}
.cta-lead-submit { cursor: pointer; font-family: inherit; }
.cta-lead-submit:disabled {
  cursor: default;
  opacity: 1;
}
.cta-lead-submit.is-success {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}
.cta-submit-success { display: none; align-items: center; justify-content: center; gap: 9px; }
.cta-lead-submit.is-success .cta-submit-label { display: none; }
.cta-lead-submit.is-success .cta-submit-success { display: inline-flex; }
.cta-submit-check {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: none;
  animation: check-pop 0.35s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}
.cta-submit-check path {
  stroke-dasharray: 18;
  stroke-dashoffset: 18;
  animation: check-draw 0.4s ease 0.16s forwards;
}
.cta-form-status {
  min-height: 18px;
  color: var(--orange-deep);
  font-size: 13px;
  line-height: 1.4;
}
@keyframes check-pop {
  from { opacity: 0; transform: scale(0.55); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes check-draw {
  to { stroke-dashoffset: 0; }
}
.cta-honey { position: absolute; left: -9999px; }

/* ---------- Footer ---------- */
.footer { border-top: 1px solid var(--line); padding: 26px 0; }
.footer-inner { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.footer-brand img { height: 44px; display: block; }
.footer-links { display: flex; gap: 24px; flex: 1; }
.footer-links a { text-decoration: none; color: var(--gray); font-size: 14px; }
.footer-links a:hover { color: var(--orange); }
.footer-copy { color: #a5a09a; font-size: 13px; }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .pillar-grid, .price-grid { grid-template-columns: 1fr; }
  .pillar h3 { min-height: 0; }
  .bento { grid-template-columns: 1fr; }
  .bento-wide, .bento-narrow, .bento-full { grid-column: span 1; }
  .bento-card { min-height: 0; }
  .plan-demo { grid-template-columns: 1fr; }
  .cta-final-grid { grid-template-columns: 1fr; gap: 40px; }
  .report-demo { grid-template-columns: 1fr; }
  .report-left { padding-bottom: 0; }
  .plan-zone { min-height: 230px; }
  .price-desc { min-height: 0; }
  .nav-links { display: none; }
  .desktop-only { display: none; }
  .hero-content { padding-top: 130px; padding-bottom: 90px; }
  .hero-bg::after {
    background: linear-gradient(180deg, rgba(253,252,250,0.94) 0%, rgba(253,252,250,0.78) 55%, rgba(253,252,250,0.3) 100%);
  }
  .statement { padding: 90px 0 60px; }
  .capabilities, .pricing { padding: 80px 0; }
  .capabilities-v2 { padding: 82px 0 90px; }
  .v2-intro { grid-template-columns: 1fr; gap: 22px; margin-bottom: 38px; }
  .v2-shell { grid-template-columns: 1fr; min-height: 0; }
  .v2-nav {
    display: flex; gap: 6px; padding: 12px; overflow-x: auto;
    border-right: 0; border-bottom: 1px solid #e3e5e8;
  }
  .v2-nav-label { display: none; }
  .v2-tab { width: auto; flex: 0 0 auto; padding: 11px 14px; border-radius: 9px; font-size: 14px; }
  .v2-tab::before { display: none; }
  .v2-tab[aria-selected="true"] { background: var(--ink); color: #fff; }
  .v2-output-grid { grid-template-columns: 1fr; }
  .v2-map, .v2-action-board { grid-row: auto; grid-column: auto; }
}
@media (max-width: 560px) {
  .container, .nav-inner, .hero-content { padding-left: 20px; padding-right: 20px; }
  .nav-actions { display: none; }
  .hero-ctas .btn { width: 100%; text-align: center; }
  .cta-lead-fields { grid-template-columns: 1fr; }
  .capabilities-v2 { padding: 64px 0 72px; }
  .v2-intro > p:last-child { font-size: 16px; }
  .v2-shell { margin: 0 -8px; border-radius: 16px; }
  .v2-panel-head { padding: 28px 22px 24px; }
  .v2-demo { padding: 24px 18px 30px; }
  .v2-question > p { font-size: 13px; }
  .v2-answer-card { padding: 20px; }
  .v2-answer-card h4 { font-size: 21px; }
  .v2-map { min-height: 260px; }
  .v2-map-canvas { height: 220px; }
  .v2-action-grid { grid-template-columns: 1fr 0.7fr; }
  .v2-action-grid > *:nth-child(3n) { display: none; }
  .v2-project-sources, .v2-doc-stack { grid-template-columns: 1fr; }
}


/* ==========================================================================
   Atlas-in-action panel: use the available page width.
   The shared .container caps at 1320px, which left ~330px of dead margin on
   either side of the use-case panel on wide displays. This section is a
   product surface (not running text), so it gets a wider frame of its own
   while text sections keep their readable measure.
   ========================================================================== */
.capabilities-v2 > .container {
  max-width: min(1640px, 94vw) !important;
  padding-left: clamp(24px, 2.5vw, 40px) !important;
  padding-right: clamp(24px, 2.5vw, 40px) !important;
}
/* Keep the intro copy readable even though the frame is wider. */
.capabilities-v2 .v2-intro { max-width: 1320px; }
/* Give the rail a little more room as the panel grows. */
@media (min-width: 1500px) {
  .capabilities-v2 .v2-shell { grid-template-columns: 268px minmax(0, 1fr); }
}


/* ==========================================================================
   Atlas-in-action: Attio / Lightfield styling
   Reference pattern: the tab rail sits OUTSIDE on the section's soft field,
   and the product UI floats as a white card with a large soft shadow.
   Previously the rail and stage were fused inside one bordered box.
   ========================================================================== */

/* Section field: soft, cool, edge to edge. */
.capabilities-v2 { background: #f6f7f9 !important; }

/* Shell: no longer a card — just a layout grid with air between rail + stage. */
.capabilities-v2 .v2-shell {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  min-height: 0 !important;
  gap: clamp(24px, 2.6vw, 52px);
  align-items: start;
}

/* Rail: plain text on the field, no chrome. */
.capabilities-v2 .v2-nav {
  border-right: 0 !important;
  background: transparent !important;
  padding: 6px 0 0 !important;
  position: sticky;
  top: 104px;
}
.capabilities-v2 .v2-nav-label {
  padding: 0 0 18px 20px !important;
  font-size: 10.5px;
  letter-spacing: .13em;
  color: #9aa1ab !important;
}
.capabilities-v2 .v2-tab {
  padding: 13px 20px !important;
  font-size: 16.5px !important;
  font-weight: 600 !important;
  letter-spacing: -.012em;
  color: #a6acb5 !important;
  transition: color .16s ease;
}
.capabilities-v2 .v2-tab[aria-selected="true"] { color: #1a1d21 !important; }
.capabilities-v2 .v2-tab::before { background: transparent; }
.capabilities-v2 .v2-tab[aria-selected="true"]::before { background: var(--orange, #e8662a); }
.capabilities-v2 .v2-tab:hover { color: #1a1d21 !important; }

/* Stage: the floating product panel. */
.capabilities-v2 .v2-stage {
  border: 1px solid #e6e8ec;
  border-radius: 22px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 2px 4px rgba(17,19,23,.03), 0 32px 80px -28px rgba(17,19,23,.20);
}

/* Heading inside the panel: lighter, Attio-weight. */
.capabilities-v2 .v2-panel-head { border-bottom: 1px solid #edeff2 !important; }
.capabilities-v2 .v2-panel-head h3 {
  font-weight: 600 !important;
  letter-spacing: -.022em !important;
  color: #1a1d21;
}
.capabilities-v2 .v2-answer-card h4 {
  font-weight: 600 !important;
  letter-spacing: -.02em !important;
}

/* Inner canvas: cards float on a soft field, Lightfield-style. */
.capabilities-v2 .v2-demo { background: #f7f8fa !important; }
.capabilities-v2 .v2-answer-card {
  border-color: #e8eaee;
  box-shadow: 0 1px 2px rgba(17,19,23,.03), 0 16px 40px -20px rgba(17,19,23,.16);
}

@media (max-width: 900px) {
  .capabilities-v2 .v2-nav { position: static; padding: 0 !important; }
  .capabilities-v2 .v2-shell { gap: 16px; }
  .capabilities-v2 .v2-stage { border-radius: 16px; }
}


/* ==========================================================================
   Attio type calibration (measured from attio.com):
     Inter · h1 64px/600/-0.02em/lh .95 · h2 40px/500 · ink lab(10.7) ~ #1a1d21
   This sheet ran display headings at 750-800, which reads heavy next to the
   reference. Weights drop to 600 with tighter tracking; sizes stay put.
   ========================================================================== */
.hero h1,
.statement h2,
.break-placeholder h2,
.section-title,
.v2-intro h2,
.v2-panel-head h3,
.v2-answer-card h4,
.price-card h3,
.price-amount,
.cta-final-copy h2,
.bento-head h4 {
  font-weight: 600 !important;
  letter-spacing: -.022em !important;
}
.hero h1 { letter-spacing: -.026em !important; line-height: 1.0 !important; }
.v2-intro h2 { font-size: clamp(34px, 3.8vw, 54px) !important; line-height: 1.06 !important; }
.cta-final-copy h2 { line-height: 1.04 !important; }

/* Active tab: no pill on desktop — colour + accent bar only, like the reference. */
@media (min-width: 901px) {
  .capabilities-v2 .v2-tab[aria-selected="true"] { background: transparent !important; }
}


/* ==========================================================================
   User message bubble: black -> light neutral.
   Attio and Lightfield both render the user's turn as a soft light bubble
   with dark text; a solid black block was the heaviest element on the page
   and pulled focus away from Atlas's answer.
   ========================================================================== */
.capabilities-v2 .v2-question {
  background: #eceef2 !important;
  color: #1a1d21 !important;
  border: 1px solid #e2e5ea;
  box-shadow: none !important;
}
.capabilities-v2 .v2-question > p { color: #2b3038; }

/* File chip needs light-surface treatment now the bubble is pale. */
.capabilities-v2 .v2-file-pill {
  background: #fff !important;
  color: #6b727d !important;
  border: 1px solid #dfe3e8;
}
.capabilities-v2 .v2-file-pill b { color: var(--orange, #e8662a) !important; }


/* ==========================================================================
   Statement band -> Attio treatment.
   Reference: small pill badge, then a two-tone headline (dark lead sentence,
   muted continuation at the SAME size/weight), left aligned on white, with
   thin vertical grid hairlines framing the column.
   The photo band is only overridden here, so removing this block restores it.
   ========================================================================== */
.stmt-attio {
  position: relative;
  min-height: 0 !important;
  background: #fff !important;
  border-top: 1px solid #ebedf0;
  border-bottom: 1px solid #ebedf0;
}
.stmt-attio::before { content: none !important; }          /* kill the photo scrim */
.stmt-attio .break-overlay { padding: clamp(84px, 7vw, 132px) 0 clamp(84px, 7vw, 132px) !important; }

/* Framing hairlines at the content edges, like the reference grid. */
.stmt-attio .break-placeholder {
  position: relative;
  max-width: min(1640px, 94vw) !important;
  margin: 0 auto;
  padding: 0 clamp(28px, 4vw, 72px);
  border-left: 1px solid #ebedf0;
  border-right: 1px solid #ebedf0;
}

.stmt-pill {
  display: inline-block;
  margin-bottom: clamp(22px, 2.4vw, 34px);
  padding: 5px 11px;
  border-radius: 7px;
  background: #fff2ea;
  color: #c2521c;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -.005em;
}

.stmt-attio .break-placeholder h2 {
  max-width: min(1060px, 92%);
  color: #1a1d21 !important;
  font-size: clamp(28px, 3.1vw, 44px) !important;
  font-weight: 500 !important;
  letter-spacing: -.021em !important;
  line-height: 1.22 !important;
  text-shadow: none !important;
}
.stmt-lede { color: #1a1d21; }
.stmt-cont { color: #9aa1ab; }                             /* muted continuation */

@media (max-width: 900px) {
  .stmt-attio .break-placeholder { max-width: 100% !important; padding: 0 20px; border: 0; }
  .stmt-attio .break-placeholder h2 { max-width: none; }
}


/* ==========================================================================
   PRODUCT SHOWCASE — mac browser frame + animated Atlas reply
   Mirrors the real atlas.realtorch.ai UI (conversation 3ef15c84), minus the
   Runtime / Snapshot / Export controls, which read as internal tooling.
   ========================================================================== */
.showcase {
  position: relative; padding: 0 0 clamp(110px, 9vw, 168px); overflow: hidden;
  background: linear-gradient(180deg, #fff 0%, #fff 30%, #fff7f1 62%, #ffe9d8 100%);
}
.showcase-glow {
  position: absolute; left: 50%; bottom: -12%; transform: translateX(-50%);
  width: min(1700px, 140vw); height: 74%;
  background:
    radial-gradient(52% 58% at 50% 78%, rgba(232,102,42,.34) 0%, rgba(232,102,42,.13) 44%, rgba(232,102,42,0) 72%),
    radial-gradient(40% 44% at 24% 66%, rgba(255,170,96,.26) 0%, rgba(255,170,96,0) 70%),
    radial-gradient(40% 44% at 78% 62%, rgba(255,140,70,.22) 0%, rgba(255,140,70,0) 70%);
  filter: blur(4px); pointer-events: none;
}
.showcase-frame {
  position: relative; z-index: 1;
  width: min(1280px, 86vw); margin: 0 auto;
  border: 1px solid #e2e5ea; border-radius: 16px; overflow: hidden;
  background: #fff;
  box-shadow: 0 2px 6px rgba(17,19,23,.04), 0 40px 90px -34px rgba(17,19,23,.30);
}

/* --- mac chrome --- */
.mac-bar { display: flex; align-items: center; gap: 8px; padding: 11px 16px; border-bottom: 1px solid #eaecf0; background: #f7f8f9; }
.mac-dot { width: 11px; height: 11px; border-radius: 50%; flex: none; }
.mac-dot-r { background: #ff5f57; } .mac-dot-y { background: #febc2e; } .mac-dot-g { background: #28c840; }
.mac-url {
  display: inline-flex; align-items: center; gap: 6px;
  margin: 0 auto; padding: 4px 14px; border-radius: 7px;
  background: #eceef1; color: #6b727d; font-size: 11.5px; font-weight: 500;
}

/* --- app shell --- */
.app { display: grid; grid-template-columns: 232px minmax(0,1fr); min-height: 520px; }
.app-side { padding: 16px 12px; border-right: 1px solid #eef0f3; background: #fcfcfd; }
.side-brand { display: flex; align-items: center; gap: 7px; padding: 4px 8px 14px; font-size: 13.5px; font-weight: 700; color: #1a1d21; }
.side-mark { width: 13px; height: 15px; flex: none; border-radius: 2px 2px 5px 5px; background: linear-gradient(180deg,#f5a15c,#e8662a 55%,#1a1d21 55%); }
.side-item { padding: 7px 8px; border-radius: 7px; font-size: 12.5px; font-weight: 500; color: #5c646f; }
.side-new { color: #1a1d21; font-weight: 600; }
.side-plus { color: #e8662a; font-weight: 700; margin-right: 6px; }
.side-label { padding: 16px 8px 7px; font-size: 9.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #a6adb7; }
.side-chat { padding: 7px 8px; border-radius: 7px; margin-bottom: 1px; }
.side-chat b { display: block; font-size: 12px; font-weight: 500; color: #464e59; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.side-chat span { font-size: 10.5px; color: #a6adb7; }
.side-chat.is-active { background: #fff3ec; }
.side-chat.is-active b { color: #1a1d21; font-weight: 600; }

.app-main { display: flex; flex-direction: column; min-width: 0; background: #fff; }
.app-head { padding: 13px 24px; border-bottom: 1px solid #eef0f3; font-size: 15px; font-weight: 600; color: #1a1d21; }
.app-thread { flex: 1; padding: 22px 24px 8px; overflow: hidden; }

/* --- turns --- */
.ask {
  padding: 13px 16px; border: 1px solid #f6d9c5; border-radius: 10px;
  background: #fdf1e9; color: #2b3038; font-size: 13px; line-height: 1.5;
  opacity: 0; animation: seqA 13s ease infinite;
}
.reply { margin-top: 16px; padding: 16px 18px; border: 1px solid #eceef1; border-radius: 12px; background: #fff; box-shadow: 0 1px 2px rgba(17,19,23,.03); opacity: 0; animation: seqB 13s ease infinite; }
.reply-brand { display: flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 700; color: #1a1d21; }
.reply-mark { width: 16px; height: 16px; border-radius: 50%; border: 1.6px solid #e8662a; position: relative; }
.reply-mark::after { content: ""; position: absolute; inset: 3.2px; border-radius: 50%; background: #e8662a; }

.tools { display: flex; align-items: center; gap: 9px; margin: 12px 0 14px; }
.tool {
  position: relative; width: 27px; height: 27px; border-radius: 50%;
  border: 1.5px solid #f3c8ab; background: #fff6f0;
  display: flex; align-items: center; justify-content: center; opacity: 0;
}
.tool svg { width: 13px; height: 13px; fill: none; stroke: #e8662a; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.tool i { position: absolute; top: -5px; right: -5px; width: 14px; height: 14px; border-radius: 50%; background: #1a1d21; color: #fff; font-style: normal; font-size: 8.5px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.t1 { animation: seqC 13s ease infinite; }
.t2 { animation: seqD 13s ease infinite; }
.t3 { animation: seqE 13s ease infinite; }
.t4 { animation: seqF 13s ease infinite; }
.tool-note { font-size: 11px; color: #8d95a0; opacity: 0; animation: seqG 13s ease infinite; }

.reply .line { opacity: 0; }

.reply p.line { font-size: 12.8px; line-height: 1.62; color: #454d58; margin-bottom: 10px; }
.reply p.lead { color: #1a1d21; font-weight: 600; }
.reply h4.line { margin: 16px 0 10px; font-size: 17px; font-weight: 600; letter-spacing: -.018em; color: #1a1d21; }
.l1 { animation: seqH 13s ease infinite; }
.l2 { animation: seqI 13s ease infinite; }
.l3 { animation: seqJ 13s ease infinite; }
.l4 { animation: seqK 13s ease infinite; }
.l5 { animation: seqL 13s ease infinite; }
.l6 { animation: seqM 13s ease infinite; }
.l7 { animation: seqN 13s ease infinite; }

.chartcard { border: 1px solid #eceef1; border-radius: 10px; padding: 15px 17px 13px; background: #fcfcfd; }
.chartcard figcaption { font-size: 12.5px; font-weight: 600; color: #1a1d21; text-align: center; margin-bottom: 13px; }
.clegend { display: flex; justify-content: center; gap: 16px; margin: -6px 0 13px; font-size: 10px; color: #8d95a0; }
.clegend span { display: inline-flex; align-items: center; gap: 5px; }
.clegend i { width: 14px; height: 6px; border-radius: 3px; display: inline-block; }
.k18 { background: #dfe3e8; } .k25 { background: #e8662a; }
.chart { display: flex; flex-direction: column; gap: 11px; max-width: 620px; margin: 0 auto; }
.crow { display: grid; grid-template-columns: 68px minmax(0,1fr) 74px; align-items: center; gap: 10px; }
.crow > span { font-size: 11px; color: #5c646f; text-align: right; }
.crow em { font-style: normal; font-family: var(--mono, monospace); font-size: 10px; color: #8d95a0; }
.cbar { display: flex; flex-direction: column; gap: 3px; }
.cbar i { display: block; height: 7px; border-radius: 3px; width: 0; }
.c18 { background: #dfe3e8; }
.c25 { background: #e8662a; }
.crow:nth-child(1) .c18 { animation: barO 13s ease infinite; }
.crow:nth-child(1) .c25 { animation: barP 13s cubic-bezier(.2,.8,.3,1) infinite; }
.crow:nth-child(2) .c18 { animation: barQ 13s ease infinite; }
.crow:nth-child(2) .c25 { animation: barR 13s cubic-bezier(.2,.8,.3,1) infinite; }
.crow:nth-child(3) .c18 { animation: barS 13s ease infinite; }
.crow:nth-child(3) .c25 { animation: barT 13s cubic-bezier(.2,.8,.3,1) infinite; }
.chart-note { margin-top: 11px; font-size: 10.5px; font-style: italic; color: #8d95a0; text-align: center; }

.app-input { display: flex; align-items: center; gap: 12px; margin: 8px 20px 18px; padding: 11px 12px 11px 16px; border: 1px solid #e6e9ed; border-radius: 12px; background: #fff; box-shadow: 0 1px 2px rgba(17,19,23,.03); }
.app-input span { flex: 1; font-size: 12.5px; color: #a6adb7; }
.app-input b { padding: 6px 15px; border-radius: 8px; background: #e8662a; color: #fff; font-size: 12px; font-weight: 600; }

/* One 20s timeline. Stagger lives in the keyframe offsets, not animation-delay,
   so every element enters in order and clears together on the reset. */
@keyframes seqA { 0%,2% {opacity:0;transform:translateY(6px)} 5%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes seqB { 0%,6% {opacity:0;transform:translateY(8px)} 9%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes seqC { 0%,10% {opacity:0;transform:scale(.6)} 12%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes seqD { 0%,12% {opacity:0;transform:scale(.6)} 14%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes seqE { 0%,14% {opacity:0;transform:scale(.6)} 16%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes seqF { 0%,16% {opacity:0;transform:scale(.6)} 18%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes seqG { 0%,18% {opacity:0} 20%,93% {opacity:1} 97%,100% {opacity:0} }
@keyframes seqH { 0%,17% {opacity:0;transform:translateY(5px)} 24%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes seqI { 0%,22% {opacity:0;transform:translateY(5px)} 29%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes seqJ { 0%,27% {opacity:0;transform:translateY(5px)} 34%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes seqK { 0%,32% {opacity:0;transform:translateY(5px)} 39%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes seqL { 0%,37% {opacity:0;transform:translateY(5px)} 44%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes seqM { 0%,43% {opacity:0;transform:translateY(5px)} 46%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes seqN { 0%,49% {opacity:0;transform:translateY(5px)} 53%,93% {opacity:1;transform:none} 97%,100% {opacity:0} }
@keyframes barO { 0%,55% {width:0} 62%,93% {width:20%} 97%,100% {width:0} }
@keyframes barP { 0%,56% {width:0} 66%,93% {width:100%} 97%,100% {width:0} }
@keyframes barQ { 0%,57% {width:0} 64%,93% {width:34%} 97%,100% {width:0} }
@keyframes barR { 0%,58% {width:0} 67%,93% {width:35%} 97%,100% {width:0} }
@keyframes barS { 0%,59% {width:0} 66%,93% {width:21%} 97%,100% {width:0} }
@keyframes barT { 0%,60% {width:0} 69%,93% {width:21%} 97%,100% {width:0} }

@media (max-width: 900px) {
  .showcase-frame { width: 94vw; border-radius: 12px; }
  .app { grid-template-columns: 1fr; min-height: 0; }
  .app-side { display: none; }
  .app-thread { padding: 16px 14px 6px; }
  .reply { padding: 13px 14px; }
  .crow { grid-template-columns: 58px minmax(0,1fr) 62px; gap: 8px; }
  .crow > span { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .ask, .reply, .tool, .tool-note, .reply .line { animation: none !important; opacity: 1 !important; transform: none !important; }
  .cbar i { animation: none !important; width: var(--w) !important; }
}


/* ==========================================================================
   HERO v2 — Attio / Clarify pattern: centred type on a soft gradient, with
   the product window breaking the fold beneath it. Replaces the full-bleed
   watercolour cover (the .hero-bg rule is only overridden, not deleted).
   ========================================================================== */
.hero {
  min-height: 0 !important;
  padding: clamp(120px, 12vh, 168px) 0 0 !important;
  background: linear-gradient(180deg,
      #ffffff 0%, #ffffff 62%, #fffdfb 76%, #fff8f2 88%, #fff2e8 100%) !important;
  text-align: center;
  overflow: visible !important;
}
.hero-bg { display: none !important; }
.hero-content {
  position: relative; z-index: 1;
  max-width: 980px !important; margin: 0 auto;
  padding: 0 clamp(24px, 4vw, 40px) !important;
  display: flex; flex-direction: column; align-items: center;
}
.hero h1 {
  max-width: 15ch;
  font-size: clamp(42px, 5.6vw, 76px) !important;
  font-weight: 600 !important;
  letter-spacing: -.026em !important;
  line-height: 1.02 !important;
  margin-bottom: 22px;
}
.hero-sub {
  max-width: 620px; margin: 0 auto 32px !important;
  color: #6b727d !important;
  font-size: clamp(16px, 1.35vw, 19px) !important;
  line-height: 1.55; text-shadow: none !important;
}
.hero-sub strong { color: #1a1d21; font-weight: 600; }
.hero-ctas { justify-content: center; }

.hero-pill {
  display: inline-flex; align-items: center; gap: 9px;
  margin-bottom: 28px; padding: 6px 15px 6px 12px;
  border: 1px solid #f0d9c8; border-radius: 999px;
  background: rgba(255,255,255,.9);
  color: #5c646f; font-size: 13px; font-weight: 500;
  text-decoration: none; transition: border-color .16s ease, color .16s ease;
}
.hero-pill:hover { border-color: #e4bda3; color: #1a1d21; }
.hero-pill-dot { width: 6px; height: 6px; border-radius: 50%; background: #e8662a; flex: none; }
.hero-pill-arrow { color: #a6adb7; font-size: 15px; line-height: 1; }

/* Showcase now continues the hero gradient and pulls the window up into it. */
.showcase {
  padding-top: clamp(48px, 5vw, 76px) !important;
  padding-bottom: clamp(110px, 9vw, 168px) !important;
  background: linear-gradient(180deg,
      #fff2e8 0%, #ffe7d5 34%, #ffdcc4 62%, #ffe9da 84%, #fff7f1 100%) !important;
}

/* ---------- Showcase fixes ---------- */
/* 1. real brand mark in the app sidebar (was a CSS approximation) */
.side-mark {
  width: 15px; height: 17px; border-radius: 0; background: none !important;
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4NzIiIGhlaWdodD0iMjc4IiB2aWV3Qm94PSIxMjYgMTMwIDg3MiAyNzgiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDojM2YzZjNmO30uY2xzLTJ7ZmlsbDojY2Q0NTI0O30uY2xzLTN7ZmlsbDojYTgzNjFjO30uY2xzLTQsLmNscy01e2ZpbGw6IzExMTt9LmNscy02e3N0cm9rZTojZTk3MDJlO30uY2xzLTYsLmNscy01e3N0cm9rZS1taXRlcmxpbWl0OjEwO3N0cm9rZS13aWR0aDozcHg7fS5jbHMtNiwuY2xzLTd7ZmlsbDojZTk3MDJlO30uY2xzLTh7ZmlsbDojZWM5MjM3O30uY2xzLTl7ZmlsbDojZDAzMTI2O30uY2xzLTV7c3Ryb2tlOiMxMTE7fS5jbHMtMTB7ZmlsbDojZjBiNTQwO308L3N0eWxlPjwvZGVmcz48cGF0aCBjbGFzcz0iY2xzLTEwIiBkPSJNMTU3LjAyLDE5My4xOGMyLjk5LTIuNjQsNi4wMi01LjI0LDguOTctNy45Myw1LjgyLTUuMzIsMTEuMTYtMTEuMDUsMTQuNDYtMTguMzUsMi4yMi00LjkxLDMuNTMtMTAuMDgsMy4zOC0xNS41LS4xMS00LjA2LS44My04LjA0LTIuMTMtMTEuOS0uMTQtLjQyLS40OS0uOS0uMDgtMS4yOS40LS4zOC44Ni0uMDIsMS4yOS4xMyw5LjMzLDMuMzcsMTcuNDEsOC42OCwyNC4wOSwxNi4wMiwyLjg5LDMuMTcsNS40OCw2LjYxLDcuMzQsMTAuNTMtLjctLjA3LS43Ny4zNi0uODkuOTMtLjc2LDMuMzgtMS4zMiw2LjgyLTIuOTQsOS45Ni0yLjU3LDQuOTktNS44MSw5LjQ1LTkuNTgsMTMuNjMtNC4yNyw0Ljc0LTguOTQsOS4wMy0xMy43MywxMy4xNy0zLjc1LDMuMjQtNy41MSw2LjQ3LTExLjE3LDkuODItNC4wNSwzLjctNy43Miw3Ljc5LTExLjEsMTIuMS0yLjI5LDIuOTEtNC4zOCw2LjAzLTUuOTksOS40MS0xLjM4LDIuMDMtMi4yMSw0LjM1LTMuMzgsNi41LS44OC0uMDUtMS4xNC0uNzctMS40Ny0xLjQtMi44OC01LjQ5LTMuNTYtMTEuNDktMy42OS0xNy41MS0uMTMtNS45NCwxLjM2LTExLjY4LDMuMS0xNy4zNS45OS0zLjI0LDIuNTgtNi4yMywzLjU4LTkuNDYuMTUtLjQ4LjY2LTEuMDMtLjA1LTEuNTFaIi8+PHBhdGggY2xhc3M9ImNscy03IiBkPSJNMjQ1LjA1LDE5OS4zNmMtLjAyLS4yMS0uMDQtLjQyLS4wNi0uNjQtLjAxLS4xOS0uMDItLjM3LS4wMy0uNTYsMC0uMDUtLjAxLS4xLS4wMS0uMTUtLjg0LTQuOTItMi4yOS05LjY2LTQuMjktMTQuMjUtMS4yMy0yLjgyLTIuNzEtNS40OC00LjYtOC4xOC0uMTguNzQtLjMxLDEuMjItLjQsMS43MS0xLjg0LDkuMjgtNS41OCwxNy42Ny0xMS43NiwyNC44OS0xLjk5LDIuMzItNC4wNCw0LjYtNi43NCw2LjE1LDAsMCwuMDMsMCwuMDMsMCwwLC4xMi0uNDIuNDQtLjQyLjU2LS4wNC40NC4xNy4zOC0uMjcuMjEtLjQtLjE2LS41LjEzLS41Ni40NC41Ni40OC4xNi45NS0uMDUsMS4zOC0yLjkyLDUuODctNi4yNSwxMS40Ny0xMC4zLDE2LjY3LTMuOCw0Ljg3LTguMjIsOS4xMi0xMi42MSwxMy4zOS0yLjc4LDIuNy01LjE5LDIuNDUtOC43Niw3LjY2LS4yNi4zNy0uNjIuNjgtLjkyLDEuMDIsMS4wNi42OCwyLjEzLjA3LDMuMDYtLjIsNy42OC0yLjE3LDE1LjItNC43NCwyMi41MS04LjAyLDkuMTEtNC4wOCwxNy4xNi05LjU1LDIzLjc2LTE3LjAxLDQuNjQtNS4yNCw4LjMxLTExLjE0LDEwLjQzLTE3Ljg4LjY2LTIuMDksMS4wOS00LjI1LDEuNTEtNi40LjE1LS44LjM1LS4zLjU5LS4xNiwwLS4wNywwLS4xNCwwLS4yMS0uMDYtLjEzLS4wNy0uMjgtLjA4LS40MloiLz48cGF0aCBjbGFzcz0iY2xzLTgiIGQ9Ik0xNTcuMDIsMTkzLjE4Yy43MS40Ny4yLDEuMDMuMDUsMS41MS0xLDMuMjMtMi41OSw2LjIyLTMuNTgsOS40Ni0xLjc0LDUuNjctMy4yMywxMS40MS0zLjEsMTcuMzUuMTMsNi4wMi44MiwxMi4wMiwzLjY5LDE3LjUxLjMzLjYzLjU5LDEuMzQsMS40NywxLjQtLjIxLjYzLS40LDEuMjYtLjY0LDEuODgtMS41MiwzLjk4LTIuNTUsOC4wOC0zLjA5LDEyLjMtLjUzLjE0LS44OC0uMi0xLjI0LS40Ny01Ljg5LTQuMzYtMTAuOTItOS40OC0xNC4wMS0xNi4yNi0zLjQtNy40NS0yLjg5LTE0Ljg1LjM5LTIyLjE5LDIuNzgtNi4yMSw3LjE4LTExLjE4LDEyLjA5LTE1Ljc2LDIuNTQtMi4zOCw1LjE3LTQuNjYsNy45Ny02LjcyWiIvPjxwYXRoIGNsYXNzPSJjbHMtMyIgZD0iTTE1MS44MywyNTQuNThjLjU1LTQuMjIsMS41Ny04LjMyLDMuMDktMTIuMy4yNC0uNjIuNDMtMS4yNS42NC0xLjg4LDEuMTctMi4xNCwyLTQuNDYsMy4zOC02LjUsMi4xOS4zMSw0LjAyLS42MSw2LjE3LTEuMiwxLjQyLDEuMzcsMi44OSwyLjcsNC4yNiw0LjEzLDEuNzgsMS44NCwzLjg3LDMuMjksNS44MSw0LjkyLDIuOTIsMi40Niw2LjA3LDQuNjYsOC42NSw3LjUyLjAyLjAyLjIxLjMuMjMuMzItLjEuMjEtLjM2LjE2LS40Ni4zNy0yLjA1LjI3LTMuNTQuMzMtNS4zMS41LTguNzYuODUtMTcuNDUsMi4wNS0yNi4wMiw0LjExLS4xNC4wMy0uMywwLS40NiwwWiIvPjxwYXRoIGNsYXNzPSJjbHMtOSIgZD0iTTIxOC40MiwyMDcuNzFsLS4xOC43OHMtLjI0LDEuMDItLjg2LDIuMjVjLS41NSwxLjEtNi41MiwxMS4wMy0xMC41NywxNi4yMy0zLjgxLDQuODgtOC4yNCw5LjE0LTEyLjY1LDEzLjQyLTIuNzYsMi42OS02LjMzLDQuNTctOC43LDcuNnEtLjc3Ljk5LTEuMzksMS42Yy0uMzYsMCwuMzUsMCwwLDAtMi41NC0yLjc1LTYuMDMtNS40NS04Ljg4LTcuODUtMS45NC0xLjYzLTQuMDQtMy4wOC01LjgyLTQuOTItMS4zNy0xLjQyLTIuODQtMi43Ni00LjI2LTQuMTMsNS4wNC0xLjgxLDEwLjEtMy41NiwxNS4xMi01LjQzLDcuMTMtMi42NiwxNC4xOC01LjQ5LDIwLjk2LTkuMDEsNS4zNi0yLjc4LDEwLjY1LTUuNjUsMTUuNTMtOS4yMi4wOC0uMDYuMTItLjM4LjY1LS43Ny4xNy0uMTIuMzEtLjQ2LjYtLjYxLDAsMCwwLDAsMCwuMDEuMDQuMDQuMDkuMDYuMTQuMDguMDMsMCwuMDYuMDEuMDkuMDFzLjA3LDAsLjA5LS4wMWMwLDAsLjAxLDAsLjAxLDAsLjAzLDAsLjA2LS4wMi4wOS0uMDMsMCwwLDAsMCwwLDBoMFoiLz48cGF0aCBjbGFzcz0iY2xzLTIiIGQ9Ik0yNDYuOTgsMjEyLjI1Yy0uNDEsNy42Mi0yLjE5LDE0Ljg5LTUuODMsMjEuNjYtNC4wOCw3LjU4LTkuOTQsMTMuNTEtMTYuNzksMTguNTYtLjkxLjY3LTEuNzguMzUtMi42NC4xOC00LjczLS45NC05LjQ3LTEuNzMtMTQuMjgtMi4xOS02Ljc1LS42NC0xMy41Mi0uNjQtMjAuMjktLjUxLTEuMTguMDItMi4zNi4wMi0zLjU0LjAybDEuMTktLjM0LDIuNzctLjc5YzcuNjctMi4xNywxNS4yLTQuNzQsMjIuNTEtOC4wMiw5LjExLTQuMDgsMTYuMDQtMTAuMDMsMjIuNjUtMTcuNDksNC42NC01LjI0LDguMDktMTAuNjYsMTAuMjItMTcuNC42Ni0yLjA5LDEuMDktNC4yNSwxLjUxLTYuNC4yMi0xLjEzLjM2LTEuNzMuNDQtMS45MSwwLC4wNi4wMi4xMS4wMy4xNmwuNDMsMS45NWMuMjIsMS4yNCwxLjg1LDguMzYsMS42MiwxMi41MVoiLz48cGF0aCBjbGFzcz0iY2xzLTciIGQ9Ik0yMTYuNzIsMjA5LjA0Yy00Ljg4LDMuNTctMTAuMTcsNi40NC0xNS41Myw5LjIyLTYuNzgsMy41Mi0xMy44Myw2LjM1LTIwLjk2LDkuMDEtNS4wMSwxLjg3LTEwLjA4LDMuNjMtMTUuMTIsNS40My0yLjQ4LjkyLTMuOTgsMS41LTYuMTcsMS4yLDEuNjEtMy4zOSwzLjY5LTYuNDksNS45OS05LjQxLDMuMzktNC4zLDcuMDYtOC4zOSwxMS4xMS0xMi4wOSwzLjY2LTMuMzQsNy40MS02LjU3LDExLjE2LTkuODEsNC43OS00LjE1LDkuNDYtOC40NCwxMy43My0xMy4xNywzLjc2LTQuMTgsNy4wMS04LjY0LDkuNTgtMTMuNjIsMS42Mi0zLjE1LDIuMTgtNi41OCwyLjk0LTkuOTcuMTMtLjU3LjE5LTEsLjg5LS45MywzLjE2LDUuNTEsNC44NywxMS41LDUuOTEsMTcuNzIsMS4zNCw4LjAxLjMzLDE1Ljg1LTEuNzEsMjMuNjEtLjEzLjUtLjMzLjk4LS4xNSwxLjVoLjAzIi8+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMTg2LjU1LDM5NC44NWMwLTUuNzEtLjQ5LTExLjExLS4xNy0xNi44MS4zLTUuMzgtLjA4LTEwLjc2LjMtMTYuMTIuMjQtMy4yOCwwLTYuNTYuMjktOS44My4zLTMuNDcuMjktNi45NS41OS0xMC40Mi40LTQuNjUuNzEtOS4zLDEuMjgtMTMuOTMuODgtNy4xNiwyLjE1LTE0LjI5LDUuMDYtMjEuMTMsMS41My0zLjYsMy40OS03LjEsNi43Ni0xMC4wMS40LS4zNS44My0uNzQuOTMtMS4yNSw2LjA5LjMsMTIuMDksMSwxOC4wMywyLjEzLDEuMDQuMi44NC42My42NCwxLjE4LTEuMTcsMy4xOS0yLjMxLDYuNC0zLjUxLDkuNTktMy41Nyw5LjUzLTYuNTksMTkuMTctOS4xNywyOC45LTQuMzgsMTYuNTItOC4xOSwzMy4xMy0xMS42OSw0OS43OC0uMDkuNDQtLjE2Ljg3LS42MiwxLjIzLTMsMi4zMy01Ljc0LDQuMzYtOC43Miw2LjcxWiIvPjxwYXRoIGNsYXNzPSJjbHMtNCIgZD0iTTIwMS44OSwyOTUuMzRjLS4xLjUxLS41Mi45LS45MiwxLjI1LTMuMjMsMi45MS01LjE1LDYuNC02LjY2LDEwLjAxLTIuODcsNi44NS00LjEyLDEzLjk3LTQuOTgsMjEuMTMtLjU2LDQuNjMtLjg2LDkuMjktMS4yNiwxMy45My0uMywzLjQ3LS4yOCw2Ljk1LS41OCwxMC40Mi0uMjgsMy4yNy0uMDUsNi41NS0uMjgsOS44My0uMzgsNS4zNiwwLDEwLjc0LS4zLDE2LjEyLS4zMSw1LjctLjM2LDExLjEtLjM2LDE2LjgxLTEuOTksMS44Ni0zLjQ0LDMuMTctNS41Miw0Ljg3LTEuMjUtNC45Mi0yLjUzLTkuMzgtMy42My0xNC4xMi00LjUtMTkuNDYtOS4zMi0zOC44OC0xNC42My01OC4yMS0yLjY3LTkuNy01LjcyLTE5LjM0LTguNjYtMjguOTktLjMyLTEuMDYuMDItMS4yOCwxLjI0LTEuNDcsMTMuMjEtMi4xMSwyNi41NC0yLjUsMzkuOTQtMS45MiIvPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTE1NC45OCwyNjMuOTdjMy4yNC0uNzgsNi40OS0xLjA4LDkuNzYtMS40MSw5LjctLjk4LDE5LjQzLTEuMTIsMjkuMTctLjczLDE0LjI2LjU3LDI4LjI4LDIuNjUsNDIuMDMsNi40OCwxLjQxLjM5LDEuNjcuOTMsMS4zLDIuMzItMS45Niw3LjQ0LTQuNjUsMTQuNjYtNi45MywyMi0uMzIsMS4wNC0uODcsMS4wOC0xLjcxLjg2LTguNDktMi4xMy0xOS45Mi0zLjgzLTI4LjYzLTQuNzItLjk3LS4zOS0uMzctLjYtMS4zNC0xLDAsMCwuNzUtLjA1Ljc1LS4wNS00LjE5LTMuMjktOC43OS01Ljk5LTEzLjM2LTguNjYtNC4zMi0yLjUyLTguNjUtNS4wNS0xMy4yLTcuMTgtNC4yMS0xLjk3LTguNC0zLjk3LTEyLjczLTUuNjctMS43My0uNjgtMi4yMS0xLjAzLTUuMTEtMi4yNVoiLz48cGF0aCBjbGFzcz0iY2xzLTQiIGQ9Ik0xNTUuNjUsMjYzLjg2YzMuNTUsMS41NSwzLjkzLDEuNjUsNS42NSwyLjMzLDQuMzEsMS43LDguMDEsMy43MywxMi4yLDUuNyw0LjUzLDIuMTMsOC44NCw0LjY2LDEzLjEzLDcuMTgsNC41NSwyLjY3LDkuMTIsNS4zNywxMy4yOSw4LjY2LjM1LjI4LjU3LjUzLjU4LDEuMDUtNi4wOS0uMzMtMTIuMDItLjUxLTE4LjEyLS40MS0xMi42NS4yLTI1LjE0LDEuNjMtMzcuNCw0LjgtLjcyLjE5LTEuMzIuMzktMS42NS0uNjYtMi4zOC03LjY4LTUuMjYtMTUuMjEtNy4wNy0yMy4wNy0uMTMtLjU1LS4wOS0xLjI2Ljc4LTEuNiIvPjxwYXRoIGNsYXNzPSJjbHMtNSIgZD0iTTI5OS43NSwyMDkuNzlsNDIuMDIuMDJjNS44LDAsMTEuMDUuOTIsMTUuNzgsMi43NSw0LjcyLDEuODMsOC43Nyw0LjM1LDEyLjE1LDcuNTcsMy4zOCwzLjIyLDUuOTgsNy4wNiw3LjgsMTEuNTIsMS44Miw0LjQ2LDIuNzMsOS4zMiwyLjczLDE0LjU3LDAsMy44Ni0uNjUsNy40OS0xLjk0LDEwLjg3cy0zLjA2LDYuNDQtNS4zMiw5LjE3Yy0yLjI2LDIuNzQtNC44OSw1LjE1LTcuODksNy4yNC0zLjAxLDIuMDktNi4xOCwzLjczLTkuNSw0LjlsLS4xNiwxLjEzLDMwLjg5LDQ0LjI5djEuMjlzLTI0Ljk2LS4wMS0yNC45Ni0uMDFsLTI5Ljc2LTQzLjMzaC0xMC4xNHMtLjAzLDQzLjMtLjAzLDQzLjNoLTIxLjc0cy4wNy0xMTUuMjkuMDctMTE1LjI5Wk0zNDEuNTgsMjYxLjgxYzQuOTQsMCw4Ljk5LTEuNSwxMi4xNi00LjUsMy4xNy0zLDQuNzUtNi44MSw0Ljc2LTExLjQzLDAtMi4wNC0uMzUtNC4wMy0xLjA0LTUuOTYtLjctMS45My0xLjc0LTMuNjUtMy4xNC01LjE1LTEuNC0xLjUtMy4xNC0yLjcxLTUuMjMtMy42My0yLjA5LS45MS00LjQ4LTEuMzctNy4xNi0xLjM3aC0yMC40NXMtLjAyLDMyLjAzLS4wMiwzMi4wM2gyMC4xMloiLz48cGF0aCBjbGFzcz0iY2xzLTUiIGQ9Ik00NjMuOTIsMzA2LjE2Yy0zLjY1LDYuNDQtOC41NywxMS42NC0xNC43NCwxNS42MS02LjE4LDMuOTctMTMuNzIsNS45NS0yMi42Miw1Ljk0LTYuMDEsMC0xMS41Ny0xLjA1LTE2LjY2LTMuMTUtNS4xLTIuMS05LjUyLTUuMDItMTMuMjgtOC43OC0zLjc2LTMuNzYtNi42OC04LjE5LTguNzctMTMuMjktMi4wOS01LjEtMy4xMy0xMC43MS0zLjEzLTE2LjgzLDAtNS42OSwxLjAzLTExLjA4LDMuMDctMTYuMTgsMi4wNC01LjA5LDQuODktOS41NSw4LjU0LTEzLjM2LDMuNjUtMy44MSw3Ljk3LTYuODQsMTIuOTctOS4wOXMxMC40OS0zLjM3LDE2LjUtMy4zN2M2LjMzLDAsMTEuOTcsMS4wNSwxNi45LDMuMTUsNC45MywyLjEsOS4wNyw1LDEyLjM5LDguNywzLjMyLDMuNzEsNS44NCw4LjA4LDcuNTYsMTMuMTMsMS43MSw1LjA1LDIuNTcsMTAuNTIsMi41NywxNi40MnYxLjkzYy0uMTEuNjQtLjE2LDEuMjQtLjE2LDEuNzctLjExLjU0LS4xNiwxLjEzLS4xNiwxLjc3bC01OS40MS0uMDNjLjQzLDMuMjIsMS4zMSw1Ljk5LDIuNjUsOC4yOSwxLjM0LDIuMzEsMyw0LjI0LDQuOTksNS44LDEuOTgsMS41Niw0LjE2LDIuNjksNi41MiwzLjM4LDIuMzYuNyw0Ljc3LDEuMDUsNy4yNCwxLjA1LDQuODMsMCw4LjgzLTEuMDksMTItMy4yOSwzLjE3LTIuMiw1LjY2LTQuOTYsNy40OS04LjI5bDE3LjU0LDguN1pNNDQ0Ljc3LDI3NS41NmMtLjExLTEuMzktLjU2LTIuOTUtMS4zNy00LjY3LS44LTEuNzItMS45OS0zLjMzLTMuNTQtNC44My0xLjU2LTEuNS0zLjQ5LTIuNzQtNS43OS0zLjcxLTIuMzEtLjk3LTUuMDctMS40NS04LjI5LTEuNDUtNC41MSwwLTguNDgsMS4yOC0xMS45MiwzLjg2LTMuNDQsMi41Ny01Ljg2LDYuMTctNy4yNSwxMC43OGwzOC4xNi4wMloiLz48cGF0aCBjbGFzcz0iY2xzLTUiIGQ9Ik01MjYuODYsMzE2LjgyaC0xLjI5Yy0yLjQ3LDMtNS40NSw1LjU4LTguOTQsNy43Mi0zLjQ5LDIuMTQtNy45NywzLjIyLTEzLjQ1LDMuMjEtNC4wOCwwLTcuOTItLjY4LTExLjUxLTIuMDItMy42LTEuMzQtNi43NC0zLjItOS40Mi01LjU2LTIuNjgtMi4zNi00Ljc3LTUuMjEtNi4yNy04LjU0LTEuNS0zLjMzLTIuMjUtNi45OC0yLjI1LTEwLjk1cy44MS03Ljc1LDIuNDItMTEuMDNjMS42MS0zLjI3LDMuODctNi4wOSw2Ljc3LTguNDUsMi45LTIuMzYsNi4zMS00LjE1LDEwLjIzLTUuMzksMy45Mi0xLjIzLDguMTgtMS44NSwxMi44LTEuODQsNS4xNSwwLDkuMzkuNDEsMTIuNzIsMS4yMiwzLjMzLjgxLDYuMDYsMS42NCw4LjIxLDIuNXYtMi40MmMwLTQuMTktMS42Ni03LjY1LTQuOTgtMTAuMzktMy4zMy0yLjc0LTcuNDYtNC4xMS0xMi40LTQuMTEtNy4zLDAtMTMuNDcsMy4wNS0xOC41Miw5LjE3bC0xNS4yOS0xMC40N2M4LjM4LTEwLjUxLDE5LjgxLTE1Ljc3LDM0LjMtMTUuNzYsMTIuMjQsMCwyMS41NywyLjg5LDI4LjAxLDguNjMsNi40NCw1Ljc1LDkuNjUsMTQuMjUsOS42NSwyNS41MmwtLjAzLDQ3LjMzaC0yMC43N3MwLTguMzgsMC04LjM4Wk01MjYuODcsMjkzLjE2Yy0yLjQ3LTEuMTgtNS4wMi0yLjEyLTcuNjUtMi44Mi0yLjYzLS43LTUuNS0xLjA1LTguNjEtMS4wNS01LjA1LDAtOC45NCwxLjEtMTEuNjcsMy4yOS0yLjc0LDIuMi00LjExLDQuOTEtNC4xMSw4LjEzczEuMzEsNS44LDMuOTQsNy43M2MyLjYzLDEuOTMsNS42NiwyLjksOS4wOSwyLjksMi43OSwwLDUuMzctLjUxLDcuNzMtMS41MywyLjM2LTEuMDIsNC4zNy0yLjM2LDYuMDQtNC4wMnMyLjk1LTMuNTksMy44Ny01Ljc5Yy45MS0yLjIsMS4zNy00LjQ4LDEuMzctNi44NFoiLz48cGF0aCBjbGFzcz0iY2xzLTUiIGQ9Ik01NjMuMDgsMzI1LjIybC4wNy0xMTUuMjhoMjEuMDlzLS4wNywxMTUuMjktLjA3LDExNS4yOWgtMjEuMDlaIi8+PHBhdGggY2xhc3M9ImNscy02IiBkPSJNNjI3Ljk2LDMyNS4yNmwuMDYtOTQuNjctMzIuMi0uMDJ2LTIwLjYxczg2LjE1LjA1LDg2LjE1LjA1djIwLjYxcy0zMi4yMS0uMDItMzIuMjEtLjAybC0uMDYsOTQuNjdoLTIxLjczWiIvPjxwYXRoIGNsYXNzPSJjbHMtNiIgZD0iTTcxNi4wNywyNDMuODRjNi4xMiwwLDExLjcyLDEuMDUsMTYuODIsMy4xNSw1LjEsMi4xLDkuNSw1LDEzLjIsOC43czYuNiw4LjEzLDguNjksMTMuMjljMi4wOSw1LjE1LDMuMTMsMTAuNzksMy4xMywxNi45MSwwLDYuMTItMS4wNSwxMS43NS0zLjE1LDE2LjktMi4xLDUuMTUtNSw5LjU4LTguNywxMy4yOHMtOC4xMSw2LjYtMTMuMjEsOC42OWMtNS4xLDIuMDktMTAuNzEsMy4xMy0xNi44MywzLjEzLTYuMTIsMC0xMS43My0xLjA1LTE2LjgyLTMuMTUtNS4xLTIuMS05LjUtNS0xMy4yLTguN3MtNi42LTguMTMtOC42OS0xMy4yOS0zLjEzLTEwLjc5LTMuMTMtMTYuOTFjMC02LjEyLDEuMDUtMTEuNzUsMy4xNS0xNi45LDIuMS01LjE1LDUtOS41OCw4LjctMTMuMjhzOC4xMS02LjYsMTMuMjEtOC42OWM1LjEtMi4wOSwxMC43MS0zLjEzLDE2LjgzLTMuMTNaTTcxNi4wNCwzMDguNGMyLjY4LDAsNS4yOS0uNSw3LjgxLTEuNTIsMi41Mi0xLjAyLDQuNzUtMi40OSw2LjY4LTQuNDJzMy40Ni00LjI5LDQuNTktNy4wOGMxLjEzLTIuNzksMS42OS01Ljk2LDEuNy05LjVzLS41Ni02LjcxLTEuNjgtOS41Yy0xLjEzLTIuNzktMi42NS01LjE1LTQuNTgtNy4wOS0xLjkzLTEuOTMtNC4xNi0zLjQxLTYuNjgtNC40My0yLjUyLTEuMDItNS4xMy0xLjUzLTcuODEtMS41M3MtNS40Mi41MS03Ljg5LDEuNTNjLTIuNDcsMS4wMi00LjY3LDIuNDktNi42LDQuNDItMS45MywxLjkzLTMuNDYsNC4yOS00LjU5LDcuMDgtMS4xMywyLjc5LTEuNjksNS45Ni0xLjcsOS41cy41Niw2LjcxLDEuNjgsOS41YzEuMTMsMi43OSwyLjY1LDUuMTUsNC41OCw3LjA5LDEuOTMsMS45Myw0LjEzLDMuNDEsNi42LDQuNDMsMi40NywxLjAyLDUuMSwxLjUzLDcuODksMS41M1oiLz48cGF0aCBjbGFzcz0iY2xzLTYiIGQ9Ik03NjguNTYsMjQ2LjQ1aDE5LjhzMCwxMC45NiwwLDEwLjk2aDEuMjljLjk3LTEuOTMsMi4yNi0zLjcsMy44Ny01LjMxLDEuNjEtMS42MSwzLjQxLTMuMDEsNS40LTQuMjEsMS45OS0xLjE5LDQuMTMtMi4xNiw2LjQ0LTIuODksMi4zMS0uNzMsNC41OS0xLjEsNi44NC0xLjEsMi43OSwwLDUuMTguMyw3LjE2LjksMS45OC42LDMuNjcsMS4zNyw1LjA3LDIuMzNsLTUuNjUsMTguODNjLTEuMjktLjY0LTIuNzEtMS4xNS00LjI3LTEuNTMtMS41Ni0uMzgtMy40Ni0uNTctNS43Mi0uNTctMi45LDAtNS41My41Ny03Ljg5LDEuNy0yLjM2LDEuMTMtNC4zOCwyLjcyLTYuMDQsNC43Ny0xLjY3LDIuMDUtMi45Niw0LjQ1LTMuODcsNy4yLS45MSwyLjc1LTEuMzcsNS43NC0xLjM3LDguOThsLS4wMiwzOC44NGgtMjEuMDlzLjA1LTc4LjkuMDUtNzguOVoiLz48cGF0aCBjbGFzcz0iY2xzLTYiIGQ9Ik05MDMuOCwzMDUuMjljLTMuNDQsNi42NS04LjI1LDEyLjEtMTQuNDIsMTYuMzMtNi4xOCw0LjIzLTEzLjg4LDYuMzUtMjMuMTEsNi4zNS02LjEyLDAtMTEuNzMtMS4wNS0xNi44Mi0zLjE1LTUuMS0yLjEtOS41LTUuMDItMTMuMi04Ljc4LTMuNy0zLjc2LTYuNi04LjE5LTguNjktMTMuMjktMi4wOS01LjEtMy4xMy0xMC43MS0zLjEzLTE2LjgzLDAtNi4xMiwxLjA1LTExLjc1LDMuMTUtMTYuOSwyLjEtNS4xNSw1LTkuNTgsOC43LTEzLjI4czguMTEtNi42LDEzLjIxLTguNjljNS4xLTIuMDksMTAuNzEtMy4xMywxNi44My0zLjEzLDkuMTIsMCwxNi44LDIuMSwyMy4wMiw2LjI5LDYuMjIsNC4xOSwxMC43OCw5LjYxLDEzLjY4LDE2LjI3bC0xOS4zMyw4LjA0Yy0xLjgyLTMuNjUtNC4xNi02LjQxLTctOC4zLTIuODQtMS44OC02LjQxLTIuODItMTAuNzEtMi44Mi0yLjc5LDAtNS40Mi41NC03Ljg5LDEuNjEtMi40NywxLjA3LTQuNjUsMi41Ny02LjUyLDQuNS0xLjg4LDEuOTMtMy4zNiw0LjI5LTQuNDMsNy4wOC0xLjA4LDIuNzktMS42MSw1LjktMS42Miw5LjM0cy41Myw2LjU1LDEuNiw5LjM0YzEuMDcsMi43OSwyLjU1LDUuMTUsNC40Miw3LjA5LDEuODcsMS45Myw0LjA1LDMuNDQsNi41Miw0LjUxLDIuNDcsMS4wOCw1LjEsMS42MSw3Ljg5LDEuNjEsNC40LDAsOC4xMy0uOTksMTEuMTktMi45NywzLjA2LTEuOTgsNS41LTQuODUsNy4zMy04LjYxbDE5LjMyLDguMzhaIi8+PHBhdGggY2xhc3M9ImNscy02IiBkPSJNOTE1LjQ0LDIxMC4xNWgyMS4wOXMtLjAyLDMyLjM3LS4wMiwzMi4zN2wtMS4zLDE0LjMzaDEuMjljMi4yNi0zLjc1LDUuNS02Ljg0LDkuNzUtOS4yNSw0LjI0LTIuNDEsOC45OS0zLjYyLDE0LjI1LTMuNjEsMTAuMiwwLDE3LjczLDMuMDIsMjIuNjIsOS4wMyw0Ljg4LDYuMDIsNy4zMiwxNC4yMyw3LjMxLDI0LjY0bC0uMDMsNDcuODJoLTIxLjA5cy4wMy00NS4yNS4wMy00NS4yNWMwLTUuNDctMS4yOC05LjYzLTMuODYtMTIuNDgtMi41Ny0yLjg0LTYuMTctNC4yNy0xMC43OC00LjI3LTIuOSwwLTUuNDcuNjItNy43MywxLjg1LTIuMjUsMS4yMy00LjE2LDIuOTItNS43Miw1LjA3LTEuNTYsMi4xNS0yLjc0LDQuNjQtMy41NSw3LjQ4LS44MSwyLjg0LTEuMjEsNS44OC0xLjIxLDkuMWwtLjAyLDM4LjQ4aC0yMS4wOXMuMDctMTE1LjI5LjA3LTExNS4yOVoiLz48L3N2Zz4=") !important;
  background-size: auto 100% !important; background-position: left center !important; background-repeat: no-repeat !important;
}
.side-brand { font-size: 0; gap: 0; }
.side-brand .side-mark { width: 92px; height: 19px; }

/* 2. thread gets a readable column instead of spanning the full 1640px panel */
.app-thread { display: flex; flex-direction: column; align-items: center; }
.app-thread > * { width: 100%; max-width: 940px; }
.ask { max-width: 640px; align-self: flex-end; margin-right: calc((100% - 940px) / 2); }

/* 3. chart bars were stretching the whole panel width */
.chart { max-width: 620px; margin: 0 auto; }
.crow { grid-template-columns: 68px minmax(0,1fr) 74px; gap: 10px; }
.app-input { max-width: 940px; width: 100%; margin-inline: auto; }

@media (max-width: 1100px) {
  .ask { margin-right: 0; }
}
@media (max-width: 900px) {
  .hero { padding-top: 104px !important; }
  .hero h1 { max-width: none; }
  .hero-ctas { flex-direction: column; align-self: stretch; }
  .hero-ctas .btn { width: 100%; text-align: center; }
  .app-thread > *, .app-input { max-width: 100%; }
  .ask { max-width: 100%; align-self: stretch; }
  .chart { max-width: 100%; }
}


/* ==========================================================================
   NODE MAP — what every AI can use vs. what Atlas adds
   Wide/short aspect so the section stays compact; chip nodes read as designed
   objects rather than floating dots.
   ========================================================================== */
.nodemap { padding: clamp(72px, 6vw, 104px) 0 clamp(64px, 5.5vw, 92px); background: #faf9f8; border-top: 1px solid #eef0f2; }
.nd-head { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.82fr); gap: clamp(32px, 5vw, 84px); align-items: start; margin-bottom: clamp(26px, 3vw, 42px); }
.nd-head h2 { font-size: clamp(30px, 3.5vw, 46px) !important; font-weight: 600 !important; letter-spacing: -.024em !important; line-height: 1.1 !important; color: #14161a; }
.nd-sub { max-width: 44ch; margin-top: 8px; color: #8b929c; font-size: clamp(15px, 1.3vw, 18px); line-height: 1.5; }

.nd-figure { margin: 0 auto; max-width: 1060px; }
.nd-figure svg { display: block; width: 100%; height: auto; }

.nd-axis { stroke: #ddd9d4; stroke-width: 1.3; stroke-dasharray: 2 8; }
.nd-side { font-family: var(--mono, monospace); font-size: 13px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.nd-side-l { fill: #b0aeaa; }
.nd-side-r { fill: #d4531c; }

.nd-halo { fill: #fdeee3; }
.nd-hub { fill: #17181c; }
.nd-hub-text { fill: #fff; font-size: 19px; font-weight: 600; letter-spacing: .24em; }

.nd-line { fill: none; stroke-width: 1.4; }
.nd-line.nd-l { stroke: #d3d0cb; }
.nd-line.nd-r { stroke: #eb8a5e; }

.nd-chip rect { fill: #fff; stroke-width: 1.2; }
.nd-chip text { font-size: 15px; }
.nd-chip.nd-l rect { stroke: #e2dfda; }
.nd-chip.nd-l circle { fill: #b8b5b0; }
.nd-chip.nd-l text { fill: #5d646d; }
.nd-chip.nd-r rect { stroke: #f3cdb8; }
.nd-chip.nd-r circle { fill: #d4531c; }
.nd-chip.nd-r text { fill: #23272e; font-weight: 500; }

/* draw in on scroll */
.nd-figure .nd-line { stroke-dasharray: 260; stroke-dashoffset: 260; }
.nd-figure.visible .nd-line { animation: ndDraw .8s cubic-bezier(.3,.75,.35,1) forwards; animation-delay: calc(.14s + var(--i) * .08s); }
.nd-figure .nd-chip { opacity: 0; }
.nd-figure.visible .nd-chip { animation: ndFade .5s ease forwards; animation-delay: calc(.46s + var(--i) * .08s); }
@keyframes ndDraw { to { stroke-dashoffset: 0; } }
@keyframes ndFade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.nd-chip { transform-box: fill-box; transform-origin: center; }

.nd-lists { display: none; }
@media (max-width: 900px) {
  .nd-head { grid-template-columns: 1fr; gap: 16px; }
  .nd-sub { max-width: none; }
  .nd-figure { display: none; }
  .nd-lists { display: grid; grid-template-columns: 1fr; gap: 26px; }
  .nd-list-head { font-family: var(--mono, monospace); font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; margin-bottom: 12px; }
  .nd-list-head-l { color: #a9a7a3; }
  .nd-list-head-r { color: #d4531c; }
  .nd-list ul { list-style: none; margin: 0; padding: 0; }
  .nd-list li { position: relative; padding: 10px 0 10px 22px; border-top: 1px solid #eceae7; font-size: 15.5px; color: #3f4650; }
  .nd-list li::before { content: ""; position: absolute; left: 0; top: 17px; width: 8px; height: 8px; border-radius: 50%; background: #b8b5b0; }
  .nd-list-atlas li { color: #2b3038; }
  .nd-list-atlas li::before { background: #d4531c; }
}
@media (prefers-reduced-motion: reduce) {
  .nd-figure .nd-line { stroke-dashoffset: 0; }
  .nd-figure .nd-chip { opacity: 1; animation: none; }
}


/* ---------- tile outputs: real map, formatted email, estimate sheet ---------- */
.v2-output.v2-map { display: flex; flex-direction: column; }
.v2-map .v2-map-canvas { position: relative; overflow: hidden; flex: 1; min-height: 280px; height: auto; }
.v2-map-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.v2-map-site-tag {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) translateY(-46px);
  padding: 4px 10px; border-radius: 6px; background: #d4531c; color: #fff;
  font-family: var(--mono, monospace); font-size: 9.5px; font-weight: 700;
  letter-spacing: .06em; white-space: nowrap; box-shadow: 0 4px 12px rgba(212,83,28,.3);
}
.v2-comp-dot { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: #8b929c; border: 1.5px solid #fff; box-shadow: 0 1px 4px rgba(17,19,23,.28); }
.v2-comp-dot.hot { background: #d4531c; }

/* email */
.v2-mail { padding: 0; }
.v2-mail-row { display: flex; gap: 10px; padding: 8px 16px; border-bottom: 1px solid #f1f2f4; font-size: 12px; }
.v2-mail-row span { flex: none; width: 48px; color: #a2a8b1; }
.v2-mail-row b { font-weight: 500; color: #23272e; min-width: 0; overflow-wrap: anywhere; }
.v2-mail-body { padding: 14px 16px 4px; }
.v2-mail-body p { font-size: 12.4px; line-height: 1.6; color: #454d58; margin-bottom: 9px; }
.v2-mail-body p b { color: #14161a; font-weight: 700; }
.v2-mail-sig { margin-top: 13px; color: #23272e !important; font-weight: 600; }
.v2-mail-sig span { font-weight: 400; color: #8b929c; }
.v2-mail-actions { display: flex; align-items: center; gap: 10px; padding: 12px 16px 14px; border-top: 1px solid #f1f2f4; }
.v2-mail-actions b { padding: 7px 18px; border-radius: 8px; background: #e8662a; color: #fff; font-size: 12px; font-weight: 600; }
.v2-mail-actions span { font-size: 12px; font-weight: 500; color: #6b727d; }

/* estimate spreadsheet */
.v2-xls { border-radius: 8px; overflow: hidden; border: 1px solid #e9ebee; background: #fff; }
.v2-xls-bar { display: flex; align-items: center; gap: 8px; padding: 9px 13px; border-bottom: 1px solid #eef0f2; background: #fbfbfa; }
.v2-xls-bar i { font-style: normal; font-family: var(--mono, monospace); font-size: 9px; font-weight: 700; width: 17px; height: 17px; border-radius: 4px; background: #1d6f42; color: #fff; display: flex; align-items: center; justify-content: center; }
.v2-xls-bar b { font-family: var(--mono, monospace); font-size: 11.5px; }
.v2-xls-bar span { margin-left: auto; font-size: 10.5px; color: #a2a8b1; }
.v2-xls-table { width: 100%; border-collapse: collapse; }
.v2-xls-table td { padding: 7px 13px; font-size: 11.8px; border-top: 1px solid #f3f4f5; color: #3f4650; }
.v2-xls-table td:nth-child(n+2) { text-align: right; font-family: var(--mono, monospace); font-size: 11px; white-space: nowrap; }
.v2-xls-table .h td { border-top: 0; padding: 8px 13px 6px; font-family: var(--mono, monospace); font-size: 9.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: #b0b6bf; }
.v2-xls-table .was { color: #a2a8b1; }
.v2-xls-table .up { color: #1d6f42; }
.v2-xls-table .down { color: #c2410c; }
.v2-xls-table .flat { color: #b0b6bf; }
.v2-xls-table .strike td { background: #fff6f2; }
.v2-xls-table .strike td:first-child, .v2-xls-table .strike .was { text-decoration: line-through; color: #c2410c; }
.v2-xls-table .tot td { border-top: 1.5px solid #e4e6e9; font-weight: 700; color: #14161a; background: #fbfbfa; }
.v2-xls-note { padding: 10px 13px 12px; font-size: 10.5px; font-style: italic; color: #8b929c; border-top: 1px solid #f3f4f5; }


/* attachment pills: icon + type + name */
.v2-file-pill { display: inline-flex; align-items: center; gap: 6px; }
.v2-file-pill svg {
  width: 12px; height: 12px; flex: none;
  fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round;
}


/* "See Atlas in action" — one two-tone paragraph, no kicker or side column */
.capabilities-v2 .v2-intro { display: block !important; margin-bottom: clamp(30px, 3.4vw, 48px) !important; }
.capabilities-v2 .v2-intro h2 {
  max-width: min(1020px, 92%);
  font-size: clamp(28px, 3.1vw, 44px) !important;
  font-weight: 500 !important;
  letter-spacing: -.021em !important;
  line-height: 1.22 !important;
}
.capabilities-v2 .v2-lede { color: #d4531c; }
.capabilities-v2 .v2-cont { color: #14161a; }


/* ==========================================================================
   Use-case panel: compact enough to read in one screen.
   Numbered eyebrows, the rail label and the "outputs" labels are gone; the
   remaining space comes out of panel padding and the map's height.
   ========================================================================== */
.capabilities-v2 .v2-nav-label { display: none !important; }

/* bigger, more legible tabs now that the rail label is gone */
.capabilities-v2 .v2-nav { padding-top: 20px !important; }
.capabilities-v2 .v2-tab {
  padding: 15px 22px !important;
  font-size: clamp(17px, 1.35vw, 21px) !important;
  font-weight: 600 !important;
  letter-spacing: -.015em;
}

/* tighter panel chrome */
.capabilities-v2 .v2-panel-head { padding: 26px 34px 22px !important; }
.capabilities-v2 .v2-panel-head h3 { font-size: clamp(24px, 2.35vw, 33px) !important; line-height: 1.14 !important; }
.capabilities-v2 .v2-demo { padding: 22px 34px 26px !important; }
.capabilities-v2 .v2-question-row { margin-bottom: 16px !important; }
.capabilities-v2 .v2-answer-card { padding: 18px 20px !important; }
.capabilities-v2 .v2-answer-card h4 { font-size: 21px !important; }
.capabilities-v2 .v2-output-grid { margin-top: 16px; }

/* shorter map so the whole example fits above the fold */
.capabilities-v2 .v2-map .v2-map-canvas { min-height: 0 !important; height: auto !important; }
.capabilities-v2 .v2-output.v2-map { max-height: 420px; }
.capabilities-v2 .v2-mail-body { padding-top: 12px !important; }
.capabilities-v2 .v2-mail-body p { margin-bottom: 7px !important; }

@media (max-width: 900px) {
  .capabilities-v2 .v2-tab { padding: 11px 14px !important; font-size: 15px !important; }
  .capabilities-v2 .v2-panel-head { padding: 20px 18px 16px !important; }
  .capabilities-v2 .v2-demo { padding: 18px 16px 22px !important; }
  .capabilities-v2 .v2-output.v2-map { max-height: none; }
}


/* final trim so the whole example clears a laptop viewport */
.capabilities-v2 .v2-panel-head { padding: 22px 34px 18px !important; }
.capabilities-v2 .v2-panel-head h3 { font-size: clamp(22px, 2.1vw, 30px) !important; }
.capabilities-v2 .v2-demo { padding: 18px 34px 22px !important; }
.capabilities-v2 .v2-question { padding: 12px 15px !important; }
.capabilities-v2 .v2-question-row { margin-bottom: 14px !important; }
.capabilities-v2 .v2-answer-card { padding: 16px 18px !important; }
.capabilities-v2 .v2-answer-card h4 { font-size: 19.5px !important; }
.capabilities-v2 .v2-answer-card > p:last-child { margin-top: 6px !important; }
.capabilities-v2 .v2-output-grid { margin-top: 14px; }
.capabilities-v2 .v2-output.v2-map { max-height: 348px; }
.capabilities-v2 .v2-mail-row { padding: 7px 16px !important; }
.capabilities-v2 .v2-mail-body { padding: 11px 16px 2px !important; }
.capabilities-v2 .v2-mail-actions { padding: 10px 16px 12px !important; }


/* the email card sets the output row height — tighten its type so the whole
   example clears a laptop viewport without clipping anything */
.capabilities-v2 .v2-mail-row { padding: 6px 15px !important; font-size: 11.5px !important; }
.capabilities-v2 .v2-mail-body { padding: 10px 15px 2px !important; }
.capabilities-v2 .v2-mail-body p { font-size: 12px !important; line-height: 1.5 !important; margin-bottom: 6px !important; }
.capabilities-v2 .v2-mail-sig { margin-top: 9px !important; }
.capabilities-v2 .v2-mail-actions { padding: 9px 15px 11px !important; }
.capabilities-v2 .v2-mail-actions b { padding: 6px 15px !important; }
.capabilities-v2 .v2-output.v2-map { max-height: none; }
.capabilities-v2 .v2-panel-head { padding: 20px 32px 16px !important; }
.capabilities-v2 .v2-question-row { margin-bottom: 12px !important; }
.capabilities-v2 .v2-demo { padding: 16px 32px 20px !important; }


/* the map spanned two grid rows back when a third card stacked beside it;
   with the pro-forma gone that left an empty ~80px row */
.capabilities-v2 .v2-output-grid { grid-template-rows: auto !important; grid-auto-rows: auto !important; }
.capabilities-v2 .v2-output.v2-map,
.capabilities-v2 .v2-output.v2-plan-output { grid-row: auto !important; }


/* last pass: clear the sticky nav on a 900px-tall screen */
.capabilities-v2 .v2-panel-head { padding: 16px 32px 14px !important; }
.capabilities-v2 .v2-question-row { margin-bottom: 10px !important; }
.capabilities-v2 .v2-demo { padding: 14px 32px 18px !important; }
.capabilities-v2 .v2-output-grid { margin-top: 12px !important; }
.capabilities-v2 .v2-answer-card { padding: 14px 18px !important; }


/* ==========================================================================
   File-type icons — each format gets its own glyph and accent so the type is
   readable at a glance rather than relying on the text tag alone.
   ========================================================================== */
.v2-file-pill { display: inline-flex; align-items: center; gap: 6px; }
.v2-file-pill svg {
  width: 13px; height: 13px; flex: none;
  fill: none; stroke: currentColor; stroke-width: 1.5;
  stroke-linecap: round; stroke-linejoin: round;
}
.v2-file-pill.is-pdf  { color: #c0392b; }
.v2-file-pill.is-xlsx { color: #1d6f42; }
.v2-file-pill.is-docx { color: #2b5cb8; }
.v2-file-pill.is-txt  { color: #6b727d; }
.v2-file-pill.is-zip  { color: #b07219; }
.v2-file-pill b { color: inherit; }

/* final height trim so the land example clears the sticky nav at 900px */
.capabilities-v2 .v2-panel-head { padding: 14px 32px 12px !important; }
.capabilities-v2 .v2-panel-head h3 { font-size: clamp(21px, 1.95vw, 28px) !important; }
.capabilities-v2 .v2-answer-card { padding: 13px 18px !important; }
.capabilities-v2 .v2-answer-card h4 { font-size: 18.5px !important; }
.capabilities-v2 .v2-answer-card > p:last-child { margin-top: 5px !important; font-size: 13px !important; }
.capabilities-v2 .v2-mail-body p { line-height: 1.45 !important; margin-bottom: 5px !important; }
.capabilities-v2 .v2-question > p { font-size: 13px !important; }


/* ==========================================================================
   Showcase thread: fixed-height viewport.
   The reply used to grow as it animated, which pushed the whole page down.
   The thread now has a set height, clips its overflow, fades at the bottom
   and carries a "scroll to see more" hint — so the frame never changes size.
   ========================================================================== */
.app-thread { position: relative; overflow: hidden; }
@keyframes moreHint { 0%,44% {opacity:0} 52%,92% {opacity:1} 96%,100% {opacity:0} }

@media (max-width: 900px) {
}
@media (prefers-reduced-motion: reduce) {
  }




/* grow-in happens inside the fixed-height thread, so the frame never resizes */



/* Pin the thread so the frame can't resize: the reply grows *inside* a
   viewport of constant height, sized to the fully-streamed content. */
.app-thread { flex: 0 0 auto !important; height: 672px; }
@media (max-width: 1200px) { .app-thread { height: 790px; } }
@media (max-width: 900px)  { .app-thread { height: 1000px; } }


/* ==========================================================================
   Testimonial — sits right after the Atlas-in-action example.
   ========================================================================== */
.quote-band { padding: clamp(76px, 6.5vw, 112px) 0; background: #fff; border-top: 1px solid #eef0f2; }
.quote-fig { max-width: 1000px; margin: 0 auto; }
.quote-fig blockquote {
  margin: 0; color: #14161a;
  font-size: clamp(20px, 2.1vw, 30px); font-weight: 500;
  letter-spacing: -.018em; line-height: 1.36;
}
.quote-fig blockquote::before { content: ""; display: block; width: 40px; height: 3px; border-radius: 999px; background: #d4531c; margin-bottom: clamp(20px, 2vw, 30px); }
.quote-fig figcaption { margin-top: clamp(18px, 2vw, 26px); color: #8b929c; font-size: 15px; }
.quote-fig figcaption b { color: #14161a; font-weight: 600; }
@media (max-width: 900px) { .quote-band { padding: 56px 0; } }


/* two-line Atlas cards */
.nd-card rect { fill: #fff; stroke: #f0c9b2; stroke-width: 1.2; }
.nd-card circle { fill: #d4531c; }
.nd-ct { font-size: 15px; font-weight: 600; fill: #14161a; }
.nd-cs { font-size: 12.5px; fill: #8b929c; }
.nd-chip .nd-t { font-size: 15px; }
.nd-figure .nd-card { opacity: 0; }
.nd-figure.visible .nd-card { animation: ndFade .5s ease forwards; animation-delay: calc(.46s + var(--i) * .08s); }
.nd-card { transform-box: fill-box; transform-origin: center; }
@media (prefers-reduced-motion: reduce) { .nd-figure .nd-card { opacity: 1; animation: none; } }

/* mobile list: title + supporting line */
.nd-list-atlas li b { display: block; font-weight: 600; color: #14161a; }
.nd-list-atlas li span { display: block; margin-top: 1px; font-size: 13.5px; color: #8b929c; }


/* two-line Atlas cards */
.nd-card rect { fill: #fff; stroke: #f0c9b2; stroke-width: 1.2; }
.nd-card circle { fill: #d4531c; }
.nd-ct { font-size: 15px; font-weight: 600; fill: #14161a; }
.nd-cs { font-size: 12.5px; fill: #8b929c; }
.nd-chip .nd-t { font-size: 15px; }
.nd-figure .nd-card { opacity: 0; }
.nd-figure.visible .nd-card { animation: ndFade .5s ease forwards; animation-delay: calc(.46s + var(--i) * .08s); }
.nd-card { transform-box: fill-box; transform-origin: center; }
@media (prefers-reduced-motion: reduce) { .nd-figure .nd-card { opacity: 1; animation: none; } }

/* mobile list: title + supporting line */
.nd-list-atlas li b { display: block; font-weight: 600; color: #14161a; }
.nd-list-atlas li span { display: block; margin-top: 1px; font-size: 13.5px; color: #8b929c; }


/* ---------- action plan: numbered next steps instead of a grid ---------- */
.v2-steps { list-style: none; margin: 0; padding: 0; }
.v2-steps li {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 16px; border-top: 1px solid #eef0f2;
}
.v2-steps li:first-child { border-top: 0; }
.v2-step-n {
  flex: none; width: 22px; height: 22px; border-radius: 50%;
  background: #14161a; color: #fff;
  font-family: var(--mono, monospace); font-size: 11px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.v2-steps li > div { flex: 1; min-width: 0; }
.v2-steps li b { display: block; font-size: 13.5px; font-weight: 600; color: #14161a; }
.v2-steps li > div > span { display: block; margin-top: 1px; font-size: 12px; color: #8b929c; }
.v2-steps em {
  flex: none; font-style: normal; font-family: var(--mono, monospace);
  font-size: 10.5px; font-weight: 700; letter-spacing: .04em;
  padding: 4px 10px; border-radius: 999px;
}
.v2-steps .due     { background: #fff2e9; color: #c2410c; }
.v2-steps .open    { background: #f1f3f5; color: #5c646f; }
.v2-steps .blocked { background: #fdecec; color: #b3261e; }
.v2-steps-note {
  padding: 11px 16px 13px; border-top: 1px solid #eef0f2;
  font-size: 12px; color: #8b929c;
}

/* ---------- CTA: walkthrough first, self-serve as the alternate path ---------- */
.cta-lead-form { margin-top: 0 !important; }
.cta-alt { margin-top: 16px; text-align: center; font-size: 14px; color: #8b929c; }
.cta-alt a { color: #d4531c; font-weight: 600; text-decoration: none; }
.cta-alt a:hover { text-decoration: underline; }


/* spacing after removing the hero pill / section eyebrows */
.hero h1 { margin-top: 0; }
.stmt-attio .break-placeholder h2 { margin-top: 0; }
.cta-final-copy h2 { margin-top: 0 !important; }


/* question bubble: a touch larger so the prompt reads as the lead-in */
.capabilities-v2 .v2-question > p { font-size: 15px !important; line-height: 1.5 !important; }
.capabilities-v2 .v2-file-pill { font-size: 11px !important; }


/* body copy in the demos was reading small next to the headings */
.capabilities-v2 .v2-answer-card > p:last-child { font-size: 15px !important; line-height: 1.55 !important; }
.capabilities-v2 .v2-mail-row { font-size: 12.5px !important; }
.capabilities-v2 .v2-mail-body p { font-size: 13.5px !important; line-height: 1.5 !important; margin-bottom: 7px !important; }
.showcase .ask { font-size: 15px !important; line-height: 1.5 !important; }
.showcase .reply p.line { font-size: 14px !important; }
.showcase .reply h4.line { font-size: 18px !important; }


/* node-map heading: single two-tone statement, no side column */
.nodemap .nd-head { display: block !important; margin-bottom: clamp(30px, 3.4vw, 48px) !important; }
.nodemap .nd-head h2 {
  max-width: min(1060px, 94%);
  font-size: clamp(28px, 3.2vw, 44px) !important;
  font-weight: 500 !important;
  letter-spacing: -.021em !important;
  line-height: 1.22 !important;
  color: #14161a;
}
.nodemap .nd-accent { color: #d4531c; }
@media (max-width: 900px) { .nodemap .nd-head h2 { max-width: none; } }


/* CTA card: no stray rule at the top (it divided the form from a button that
   no longer sits above it), black primary action, orange secondary below */
.cta-lead-form { border-top: 0 !important; padding-top: 0 !important; margin-top: 0 !important; }

.cta-lead-submit,
.cta-lead-submit.btn-primary {
  background: #17181c !important;
  border-color: #17181c !important;
  color: #fff !important;
}
.cta-lead-submit:hover { background: #000 !important; border-color: #000 !important; }
.cta-lead-submit.is-success { background: #17181c !important; border-color: #17181c !important; }

.cta-alt { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); text-align: center; }
.cta-alt-label { display: block; margin-bottom: 10px; font-size: 13.5px; color: #8b929c; }
.cta-alt-btn { border-radius: 12px; }
/* the old text-link rule (.cta-alt a) was tinting the button label orange-on-orange */
.cta-alt a.btn { color: #fff !important; text-decoration: none !important; }
.cta-alt a.btn:hover { color: #fff !important; }


/* CTA card matches the use-case demo canvas (#f7f8fa on #e6e8ec) instead of
   the warm cream it inherited */
.cta-final-side { background: #f7f8fa !important; border-color: #e6e8ec !important; }
.cta-final-side .cta-alt { border-top-color: #e6e8ec !important; }
.cta-final-side .cta-field input { border-color: #e2e5ea !important; }


/* six bands with two series each — keep the rows tight */
.showcase .chart { gap: 8px; }
.showcase .crow { grid-template-columns: 86px minmax(0,1fr) 64px; gap: 10px; }
.showcase .crow em { font-size: 10px; }
.showcase .cbar i { height: 6px; }


/* The per-row bar keyframes hardcoded widths from the old 3-row chart, so the
   new 6-band series rendered wrong proportions (and rows 4-6 never grew).
   One keyframe driven by each bar's own --w fixes both. */
.showcase .crow:nth-child(n) .c18,
.showcase .crow:nth-child(n) .c25 { animation: barW 13s cubic-bezier(.2,.8,.3,1) infinite !important; }
.showcase .crow:nth-child(n) .c25 { animation-delay: .12s !important; }
@keyframes barW { 0%,55% { width: 0; } 64%,93% { width: var(--w); } 97%,100% { width: 0; } }


/* found-but-not-removed conflicts: flag them, don't strike them through */
.v2-estimate tr.flagged td { background: #fff6f2; color: #c2410c; text-decoration: none !important; }
.v2-estimate tr.flagged td:last-child { font-weight: 600; }


/* two-quote band: short endorsement leads, the longer customer story supports */
.quote-lead { max-width: 1000px; margin: 0 auto clamp(40px, 4vw, 64px); }
.quote-lead blockquote {
  margin: 0; color: #14161a;
  font-size: clamp(28px, 3.4vw, 46px); font-weight: 600;
  letter-spacing: -.024em; line-height: 1.14;
}
.quote-lead blockquote::before {
  content: ""; display: block; width: 40px; height: 3px; border-radius: 999px;
  background: #d4531c; margin-bottom: clamp(20px, 2vw, 30px);
}
.quote-lead figcaption { margin-top: clamp(16px, 1.8vw, 22px); color: #8b929c; font-size: 15px; }
.quote-lead figcaption b { color: #14161a; font-weight: 600; }

/* the supporting quote steps down and loses the rule so the two don't compete */
.quote-fig blockquote { font-size: clamp(17px, 1.55vw, 21px) !important; font-weight: 400 !important; line-height: 1.55 !important; color: #3f4650 !important; }
.quote-fig blockquote::before { display: none !important; }
.quote-fig { padding-top: clamp(28px, 3vw, 40px); border-top: 1px solid #eef0f2; }
.quote-fig figcaption { margin-top: 16px !important; }


/* panel heading: room to breathe, and a balanced line break instead of a
   single orphaned word on line two */
.capabilities-v2 .v2-panel-head { padding: 24px 32px 20px !important; }
.capabilities-v2 .v2-panel-head h3 {
  max-width: 30ch;
  line-height: 1.2 !important;
  text-wrap: balance;
}
@media (max-width: 900px) {
  .capabilities-v2 .v2-panel-head { padding: 18px 18px 16px !important; }
  .capabilities-v2 .v2-panel-head h3 { max-width: none; }
}


/* Hero thread reads like the real app: the reply runs long, clips at the
   composer, and the composer stays pinned. Not user-scrollable — the fade and
   label just signal there is more. */
.app-main { position: relative; }
.app-thread {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 86%, rgba(0,0,0,.35) 96%, transparent 100%);
          mask-image: linear-gradient(to bottom, #000 0%, #000 86%, rgba(0,0,0,.35) 96%, transparent 100%);
}
.thread-more {
  flex: none; margin: 0 20px -4px; padding: 6px 0 8px;
  text-align: center; font-size: 11.5px; font-weight: 500; color: #a2a8b1;
  opacity: 0; animation: moreHint 13s ease infinite;
}
@keyframes moreHint { 0%,52% {opacity:0} 60%,93% {opacity:1} 97%,100% {opacity:0} }
.app-input { flex: none; }
@media (prefers-reduced-motion: reduce) { .thread-more { animation: none; opacity: 1; } }


/* a flex item will not shrink below its content without min-height:0, so the
   overflowing thread was pushing the composer out of the frame */
.app-main { display: flex; flex-direction: column; }
.app-thread { flex: 1 1 0%; min-height: 0; }
.thread-more, .app-input { flex: 0 0 auto; }


/* the app shell itself must be height-capped, otherwise the overflowing thread
   grows the grid row and carries the composer out of the frame */
.app { height: clamp(430px, 54vh, 560px); min-height: 0 !important; }
.app-side, .app-main { min-height: 0; overflow: hidden; }
@media (max-width: 900px) { .app { height: auto; } .app-thread { height: clamp(320px, 46vh, 420px); } }


/* an earlier pass pinned the thread with `flex: 0 0 auto !important; height: 672px`,
   which kept it from shrinking inside the capped app shell */
.app-thread { flex: 1 1 0% !important; height: auto !important; min-height: 0 !important; }


/* ==========================================================================
   SHOWCASE APP SHELL — single authoritative layout.
   Earlier passes layered several conflicting rules (including a
   `flex: 0 0 auto !important; height: 672px` on the thread). This block owns
   the shell: fixed-height app, thread flexes and clips, composer pinned.
   ========================================================================== */
.showcase .app {
  display: grid !important;
  grid-template-columns: 232px minmax(0, 1fr) !important;
  height: clamp(560px, 74vh, 745px) !important;
  min-height: 0 !important;
}
.showcase .app-side { min-height: 0; overflow: hidden; }
.showcase .app-main {
  display: flex !important; flex-direction: column !important;
  min-height: 0 !important; overflow: hidden !important;
}
.showcase .app-head  { flex: 0 0 auto !important; }
.showcase .app-thread {
  flex: 1 1 auto !important;
  height: auto !important; min-height: 0 !important; max-height: none !important;
  overflow: hidden !important;
}
.showcase .thread-more { flex: 0 0 auto !important; margin: 0 20px 2px !important; }
.showcase .app-input   { flex: 0 0 auto !important; margin: 0 20px 16px !important; }

@media (max-width: 900px) {
  .showcase .app { grid-template-columns: 1fr !important; height: clamp(430px, 66vh, 560px) !important; }
}


/* ---------- Atlas compass mark (matches the app) ---------- */
.atlas-mark { width: 21px; height: 21px; flex: none; color: #17181c; fill: currentColor; }

.showcase .reply-brand { gap: 8px; }
.showcase .reply-mark { display: none; }

/* answer label: compass + "Atlas" in ink, not an orange initial */
.capabilities-v2 .v2-answer-label::before { content: none !important; }
.capabilities-v2 .v2-answer-label {
  gap: 8px !important;
  font-family: var(--sans) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: -.01em !important;
  text-transform: none !important;
  color: #17181c !important;
}
.capabilities-v2 .v2-answer-label .atlas-mark { width: 22px; height: 22px; }


/* ---------- file badges: coloured sheet with the format in white ---------- */
.v2-file-pill { display: inline-flex; align-items: center; gap: 8px; }
.v2-file-pill svg { display: none; }
.ftag {
  position: relative; flex: none;
  width: 22px; height: 27px; border-radius: 3px;
  display: grid; place-items: center;
  font-style: normal; font-family: var(--sans);
  font-size: 7.5px; font-weight: 800; letter-spacing: .02em;
  color: #fff; background: #6b727d;
  box-shadow: 0 1px 2px rgba(17,19,23,.14);
}
.ftag::after {                       /* folded corner */
  content: ""; position: absolute; top: 0; right: 0;
  border-width: 0 0 6px 6px; border-style: solid;
  border-color: transparent transparent rgba(255,255,255,.55) transparent;
  border-radius: 0 3px 0 0;
}
.is-pdf .ftag { background: #d3392b; }
.is-doc .ftag { background: #2b5cb8; }
.is-xls .ftag { background: #1d6f42; }
.v2-file-pill { color: #4a515b !important; font-size: 12px !important; }


/* secondary path: same title treatment as the form, grey supporting line */
.cta-alt-title { font-size: 17px; font-weight: 700; line-height: 1.35; color: #14161a; }
.cta-alt-copy { margin: 2px 0 12px; color: #8b929c; font-size: 14px; line-height: 1.55; }
.cta-alt { text-align: left !important; }


/* ---------- comps map: priced pins instead of anonymous dots ---------- */
.v2-comp {
  position: absolute; transform: translate(-50%, -50%);
  padding: 4px 9px; border-radius: 999px;
  background: #fff; border: 1px solid #e4e7ea;
  font-family: var(--mono, monospace); font-size: 10.5px; font-weight: 700;
  color: #2b3038; white-space: nowrap;
  box-shadow: 0 2px 6px rgba(17,19,23,.16);
}
.v2-comp::after {                      /* little stem so it reads as a pin */
  content: ""; position: absolute; left: 50%; bottom: -4px; transform: translateX(-50%);
  width: 5px; height: 5px; border-radius: 50%; background: #8b929c;
  box-shadow: 0 0 0 2px #fff;
}
.v2-comp.c1 { left: 31%; top: 21%; }   /* pair north of the site */
.v2-comp.c2 { left: 21%; top: 30%; }
.v2-comp.c3 { left: 79%; top: 39%; }   /* pair along the east road */
.v2-comp.c4 { left: 84%; top: 58%; }
.v2-comp.c5 { left: 17%; top: 73%; }   /* strays */
.v2-comp.c6 { left: 57%; top: 90%; }
.v2-map-site-tag {
  top: 50% !important; transform: translate(-50%, -50%) translateY(-54px) !important;
}
.v2-map-note {
  position: absolute; left: 12px; bottom: 12px;
  padding: 5px 11px; border-radius: 7px;
  background: rgba(255,255,255,.94); border: 1px solid #eaecef;
  font-size: 10.5px; color: #5c646f; box-shadow: 0 2px 8px rgba(17,19,23,.08);
}


/* ---------- header + footer sizing ---------- */
.nav-brand-svg { width: 158px !important; }
.nav-logo-atlas { font-size: 21px !important; }
.nav-logo-divider { height: 25px !important; }
.nav-links a { font-size: 15.5px !important; }
.footer-brand img, .footer-logo img, .footer img { height: 34px !important; }

/* ---------- demo question bubbles: orange, matching the hero ---------- */
.capabilities-v2 .v2-question {
  background: #fdf1e9 !important;
  border-color: #f6d9c5 !important;
}
.capabilities-v2 .v2-question > p { color: #2b3038 !important; }

/* ---------- action plan rows: named owner + inline status + email action ---------- */
.v2-steps li > div > span { display: block; margin-top: 2px; font-size: 12px; color: #8b929c; }
.v2-steps li > div > span em {
  font-style: normal; font-family: var(--mono, monospace);
  font-size: 10px; font-weight: 700; letter-spacing: .04em;
  padding: 2px 7px; border-radius: 999px; margin-left: 2px;
}
.v2-steps .due     { background: #fff2e9; color: #c2410c; }
.v2-steps .open    { background: #f1f3f5; color: #5c646f; }
.v2-steps .blocked { background: #fdecec; color: #b3261e; }
.v2-step-mail {
  flex: none; margin-left: 12px;
  padding: 7px 14px; border-radius: 8px;
  border: 1px solid #e6e9ed; background: #fff;
  font-family: var(--sans); font-size: 12.5px; font-weight: 600; color: #14161a;
  cursor: default; white-space: nowrap;
  box-shadow: 0 1px 2px rgba(17,19,23,.04);
}


/* hero prompt sits on the right, like the user's turn in the app */
.showcase .thread-scroll { display: flex; flex-direction: column; align-items: stretch; }
.showcase .ask {
  align-self: flex-end !important;
  max-width: min(640px, 78%) !important;
  margin-right: 0 !important;
  margin-left: auto !important;
}


/* per-row action: orange, matching the primary CTA treatment */
.v2-step-mail {
  background: #e8662a !important;
  border-color: #e8662a !important;
  color: #fff !important;
  padding: 8px 15px !important;
  font-size: 12.5px !important;
  box-shadow: 0 1px 2px rgba(232,102,42,.18) !important;
}
@media (max-width: 900px) {
  .v2-steps li { flex-wrap: wrap; }
  .v2-step-mail { margin: 8px 0 0 34px !important; }
}


/* app header: title left, export control right */
.showcase .app-head {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.app-export {
  padding: 6px 13px; border-radius: 8px;
  border: 1px solid #e6e9ed; background: #fff;
  font-size: 12.5px; font-weight: 600; color: #2b3038;
  box-shadow: 0 1px 2px rgba(17,19,23,.04);
  white-space: nowrap;
}
@media (max-width: 560px) { .app-export { display: none; } }


/* the map is much narrower on phones — thin the comps so pins stop colliding */
@media (max-width: 560px) {
  .v2-comp { font-size: 9.5px; padding: 3px 7px; }
  .v2-comp.c2, .v2-comp.c4 { display: none; }
}


/* footer wordmark: trimmed viewBox means this height is the artwork height */
.footer-brand img, .footer-logo img, .footer img { height: 30px !important; }


/* ---------- row action: icon + short label ---------- */
.v2-step-mail {
  display: inline-flex; align-items: center; gap: 7px;
}
.mail-ico {
  width: 14px; height: 14px; flex: none;
  fill: none; stroke: currentColor; stroke-width: 1.7;
  stroke-linecap: round; stroke-linejoin: round;
}

/* ==========================================================================
   MOBILE — the use-case panels were laid out for two columns
   ========================================================================== */
@media (max-width: 900px) {
  /* Buying land: the map tells the story on a phone; the email is redundant */
  .capabilities-v2 .v2-output.v2-email { display: none !important; }

  /* estimate workbook: let it use the full panel width instead of a tight card */
  .capabilities-v2 .v2-demo { padding-left: 10px !important; padding-right: 10px !important; }
  .capabilities-v2 .v2-output-grid { gap: 12px; }
  .capabilities-v2 .v2-output.v2-plan-output { margin-inline: -4px; }
  .v2-xls { border-radius: 10px; }
  .v2-xls-bar { padding: 8px 10px; }
  .v2-xls-bar b { font-size: 11px; }
  .v2-xls-bar span { display: none; }              /* "rebuilt by Atlas" — not worth the width */
  .v2-xls-table { table-layout: fixed; width: 100%; }
  .v2-xls-table td { padding: 8px 8px; font-size: 12px; }
  .v2-xls-table td:first-child { width: 42%; overflow-wrap: anywhere; }
  .v2-xls-table td:nth-child(2),
  .v2-xls-table td:nth-child(3) { width: 21%; font-size: 11px; }
  .v2-xls-table td:nth-child(4) { width: 16%; font-size: 10.5px; }
  .v2-xls-note { padding: 9px 10px 11px; font-size: 10px; }

  /* tab strip: let all three fit rather than clipping "Project update" */
  .capabilities-v2 .v2-nav { gap: 4px !important; padding: 8px !important; }
  .capabilities-v2 .v2-tab { padding: 9px 11px !important; font-size: 13.5px !important; }
}


/* estimate workbook on a phone: 4 columns clipped the delta, which is the
   most useful column. Drop "Was" — "Now" plus the delta tells the story. */
@media (max-width: 900px) {
  .v2-xls-table td:nth-child(2) { display: none; }
  .v2-xls-table td:first-child   { width: 50%; }
  .v2-xls-table td:nth-child(3)  { width: 26%; }
  .v2-xls-table td:nth-child(4)  { width: 24%; font-size: 11px; }
  .v2-xls { overflow-x: hidden; }
}


/* the delta cell holds phrases like "from past job"; nowrap clipped it */
@media (max-width: 900px) {
  .v2-xls-table td:nth-child(4) {
    white-space: normal !important;
    overflow-wrap: anywhere; line-height: 1.3; width: 27%;
  }
  .v2-xls-table td:first-child  { width: 47%; }
  .v2-xls-table td:nth-child(3) { width: 26%; }
}


/* action rows on a phone: the inline button squeezed the task to 3 lines —
   let it drop to its own line under the text */
@media (max-width: 900px) {
  .v2-steps li { flex-wrap: wrap; align-items: flex-start; }
  .v2-steps li > div { flex: 1 1 100% !important; min-width: 0; }
  .v2-step-mail { margin: 10px 0 2px 34px !important; }
}


/* "What Atlas found" duplicates what the workbook already shows; on a phone
   that is one card too many, so it is desktop-only */
@media (max-width: 900px) {
  .capabilities-v2 .v2-output.v2-estimate { display: none !important; }
}


/* ==========================================================================
   MOBILE — the three examples run in sequence instead of behind tabs.
   A tab strip on a phone hides two thirds of the story behind a control most
   visitors never touch; stacked, every example is just more scrolling.
   ========================================================================== */
.v2-panel-eyebrow { display: none; }

@media (max-width: 900px) {
  .capabilities-v2 .v2-nav { display: none !important; }
  .capabilities-v2 .v2-shell { display: block !important; }

  /* the stage stops being the card — each panel becomes one */
  .capabilities-v2 .v2-stage {
    border: 0 !important; border-radius: 0 !important;
    background: transparent !important; box-shadow: none !important;
    overflow: visible !important;
  }
  .capabilities-v2 .v2-panel {
    display: block !important;
    border: 1px solid #e6e8ec; border-radius: 16px; background: #fff;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(17,19,23,.03), 0 18px 44px -26px rgba(17,19,23,.18);
  }
  .capabilities-v2 .v2-panel + .v2-panel { margin-top: 16px; }

  .capabilities-v2 .v2-panel-eyebrow {
    display: flex !important; align-items: center; gap: 8px;
    margin-bottom: 9px;
    font-family: var(--mono, monospace);
    font-size: 10.5px; font-weight: 700; letter-spacing: .1em;
    text-transform: uppercase; color: #9aa1ab;
  }
  .capabilities-v2 .v2-panel-eyebrow i {
    font-style: normal; color: var(--orange, #e8662a);
  }

  /* tighten the panel chrome — it was sized for a 1200px stage */
  .capabilities-v2 .v2-panel-head { padding: 16px 15px 14px !important; }
  .capabilities-v2 .v2-panel-head h3 {
    font-size: 19.5px !important; line-height: 1.22 !important;
  }
  .capabilities-v2 .v2-demo { padding: 14px 10px 16px !important; }
  .capabilities-v2 .v2-question-row { margin-bottom: 12px !important; }
  .capabilities-v2 .v2-question { padding: 11px 13px !important; }
  .capabilities-v2 .v2-question > p { font-size: 13px !important; line-height: 1.45 !important; }
  .capabilities-v2 .v2-answer-card { padding: 14px 15px !important; }
  .capabilities-v2 .v2-answer-card h4 { font-size: 17.5px !important; line-height: 1.25 !important; }
  .capabilities-v2 .v2-answer-card p { font-size: 13px !important; line-height: 1.5 !important; }

  /* action rows: the button back on the row, sized down, so each row is one
     line of text instead of a three-deck block */
  .v2-steps li {
    flex-wrap: nowrap !important; align-items: center !important;
    gap: 10px !important; padding: 10px 11px !important;
  }
  .v2-steps li > div { flex: 1 1 auto !important; min-width: 0; }
  .v2-steps li b { font-size: 12.5px !important; line-height: 1.3; }
  .v2-steps li > div > span { font-size: 11px !important; }
  .v2-steps li > div > span em {
    font-size: 9.5px !important; padding: 2px 6px !important;
    white-space: nowrap;                     /* "Due Fri" was breaking in half */
  }
  .v2-step-n { width: 20px !important; height: 20px !important; font-size: 10px !important; }
  .v2-step-mail {
    margin: 0 !important; padding: 7px 10px !important;
    font-size: 11.5px !important; gap: 5px !important;
  }
  .mail-ico { width: 12px; height: 12px; }
  .v2-steps-note { padding: 10px 11px 12px; font-size: 11px; }
}


/* ==========================================================================
   HERO SHOWCASE ON A PHONE
   Two problems: the composer carried `width: 100%` plus 20px side margins, so
   it ran ~20px past the frame and Send was clipped; and the prompt bubble ate
   most of a short phone's thread, leaving no room for the answer itself.
   ========================================================================== */
@media (max-width: 900px) {
  .showcase .app-input {
    width: auto !important; max-width: none !important;
    margin: 0 13px 13px !important;
    padding: 9px 10px 9px 13px !important;
  }
  .showcase .app-input span { font-size: 12px; }
  .showcase .app-input b { padding: 6px 13px; font-size: 11.5px; }
  .showcase .thread-more {
    margin: 0 13px 0 !important; padding: 4px 0 6px;
    font-size: 10.5px;
  }

  /* more of the frame goes to the answer */
  .showcase .app { height: clamp(470px, 72vh, 620px) !important; }
  .showcase .app-head { padding: 10px 14px !important; font-size: 13.5px !important; }
  .showcase .app-thread { padding: 12px 13px 2px !important; }

  /* the prompt was 78% wide at 15px — six lines, ~163px of a ~300px thread */
  .showcase .ask {
    max-width: 100% !important;
    font-size: 12.5px !important; line-height: 1.45 !important;
    padding: 10px 12px !important;
  }
  .showcase .reply { margin-top: 10px !important; padding: 12px 13px !important; }
  .showcase .reply-brand { font-size: 11.5px; }
  .showcase .atlas-mark { width: 17px; height: 17px; }
  .showcase .tools { margin: 8px 0 9px !important; gap: 7px !important; }
  .showcase .reply p.line { font-size: 12.5px !important; line-height: 1.5 !important; }
  .showcase .reply h4.line { font-size: 15.5px !important; }
}

/* short phones (SE, older Androids): trim once more so at least the opening
   of the answer clears the composer */
@media (max-width: 900px) and (max-height: 720px) {
  .showcase .app { height: clamp(430px, 76vh, 520px) !important; }
  .showcase .app-head { padding: 8px 13px !important; font-size: 13px !important; }
  .showcase .ask { font-size: 12px !important; padding: 9px 11px !important; }
  .showcase .tools { display: none !important; }   /* chips cost a paragraph of answer */
  .showcase .reply-brand { margin-bottom: 9px; }   /* the chips row was the gap */
  .showcase .app-input { margin: 0 12px 11px !important; }
}


/* ---------- nav: the 15 Functions hover menu ----------
   Hover-only would strand touch devices, so the trigger is also a real link to
   the hub page and the menu opens on focus for keyboards. */
.nav-dd { position: relative; display: flex; align-items: center; }
.nav-dd-trigger {
  display: inline-flex; align-items: center; gap: 5px;
  cursor: pointer;
}
.nav-dd-trigger svg {
  width: 13px; height: 13px; fill: none; stroke: currentColor;
  stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round;
  transition: transform .18s ease;
}
.nav-dd:hover .nav-dd-trigger svg { transform: rotate(180deg); }
.nav-dd-menu {
  /* anchored to the trigger's right edge: the menu is 640px wide and the
     trigger now sits at the end of the nav, so left-anchoring ran it off the
     screen on narrower desktops */
  position: absolute; top: calc(100% + 14px); right: -18px; left: auto;
  width: min(640px, calc(100vw - 40px)); padding: 16px 18px 14px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 1px 18px;
  border: 1px solid #e6e8ec; border-radius: 16px; background: #fff;
  box-shadow: 0 2px 4px rgba(17,19,23,.03), 0 28px 70px -26px rgba(17,19,23,.28);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .16s ease, transform .16s ease, visibility .16s;
  z-index: 60;
}
/* the gap between trigger and menu would drop the hover — bridge it */
.nav-dd::after {
  content: ""; position: absolute; top: 100%; left: 0; right: 0; height: 16px;
}
.nav-dd:hover .nav-dd-menu,
.nav-dd:focus-within .nav-dd-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.nav-dd-label {
  grid-column: 1 / -1; padding: 2px 10px 10px;
  font-size: 10.5px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: #a6adb7;
}
.nav-dd-menu a {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: 9px;
  font-size: 14px !important; font-weight: 500; color: #2b3038 !important;
  text-decoration: none; transition: background .12s ease, color .12s ease;
}
.nav-dd-menu a:hover { background: #f7f8fa; color: #14161a !important; }
.nav-dd-menu a i {
  font-style: normal; font-family: var(--mono, monospace);
  font-size: 10.5px; font-weight: 700; color: var(--orange, #e8662a);
  min-width: 17px;
}
.nav-dd-all {
  grid-column: 1 / -1; margin-top: 6px; padding-top: 12px !important;
  border-top: 1px solid #eef0f3; color: var(--orange, #e8662a) !important;
  font-weight: 600 !important;
}
.nav-dd-all:hover { background: transparent !important; color: #c2410c !important; }

@media (max-width: 900px) {
  /* no hover on a phone: the trigger is just a link to the hub */
  .nav-dd-menu { display: none; }
  .nav-dd-trigger svg { display: none; }
}


/* ==========================================================================
   MOBILE NAV
   Below the desktop breakpoint the nav was logo-only: no way to sign in, reach
   contact, or get to the function pages. This adds the button and the panel.
   ========================================================================== */
.nav-burger { display: none; }
/* Desktop: the panel must not exist in the flow. Every other rule for it lives
   in the media query below, so without this it renders as raw markup. */
.mobile-menu { display: none; }

@media (max-width: 940px) {
  .mobile-menu { display: block; }
  .nav-burger {
    display: flex; flex-direction: column; justify-content: center; gap: 5px;
    width: 42px; height: 38px; padding: 0 9px; margin-left: auto;
    border: 1px solid #e6e9ed; border-radius: 10px; background: #fff;
    cursor: pointer; -webkit-tap-highlight-color: transparent;
  }
  .nav-burger span {
    /* an empty span in a column flex box collapses to zero width unless told
       otherwise — the bars were rendering invisible */
    display: block; width: 100%; height: 2px; border-radius: 2px; background: #14161a;
    transition: transform .2s ease, opacity .15s ease;
  }
  .nav-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .nav-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .mobile-menu {
    /* absolute inside the fixed header, so it always sits exactly on the nav's
       bottom edge whatever height the bar happens to be */
    position: absolute; left: 0; right: 0; top: 100%;
    max-height: calc(100dvh - 72px); overflow-y: auto;
    overscroll-behavior: contain;
    padding: 10px 18px 22px;
    background: #fff; border-bottom: 1px solid #e6e8ec;
    box-shadow: 0 24px 48px -28px rgba(17,19,23,.34);
    transform: translateY(-8px); opacity: 0; visibility: hidden;
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
    z-index: 90;
  }
  .mobile-menu.is-open { transform: translateY(0); opacity: 1; visibility: visible; }

  .mm-link, .mm-toggle {
    display: flex; align-items: center; justify-content: space-between; width: 100%;
    padding: 14px 4px; border: 0; border-bottom: 1px solid #f0f2f4; background: none;
    font-family: var(--sans); font-size: 16.5px; font-weight: 500; color: #14161a;
    text-decoration: none; text-align: left; cursor: pointer;
  }
  .mm-toggle svg {
    width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2;
    stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease;
  }
  .mm-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }

  .mm-sub { display: none; padding: 4px 0 8px; }
  .mm-sub.is-open { display: block; }
  .mm-sub a {
    display: flex; align-items: center; gap: 11px; padding: 11px 4px 11px 10px;
    font-size: 15px; font-weight: 500; color: #4d5560; text-decoration: none;
  }
  .mm-sub a i {
    font-style: normal; font-family: var(--mono, monospace); font-size: 11px;
    font-weight: 700; color: var(--orange, #e8662a); min-width: 18px;
  }
  .mm-all { color: var(--orange, #e8662a) !important; font-weight: 600 !important; padding-left: 4px !important; }

  .mm-actions { display: grid; gap: 10px; margin-top: 18px; }
  .mm-actions .btn { width: 100%; justify-content: center; text-align: center; }

  body.mm-open { overflow: hidden; }
}

