/* OneQueue public website.
   Deliberately separate from onequeue.css: the application shell and the
   marketing site have different jobs, and loading the sidebar layout on a
   landing page - or vice versa - only creates rules to fight.

   Bootstrap 5 does the heavy lifting. This file is the brand: colour, type
   scale, the hero, the cards, and one HTML/CSS mockup of the product. No
   images, no icon sets beyond Bootstrap Icons, no JavaScript. */

:root {
  --oq-ink: #101a28;
  --oq-ink-soft: #4a5a6e;
  --oq-line: #e4e9f0;
  --oq-brand: #2563eb;
  --oq-brand-dark: #1c4ed8;
  --oq-brand-soft: #eef4ff;
  --oq-accent: #0ea472;
  --oq-night: #101a28;
  --oq-wash: #f7f9fc;
}

.oq-public {
  background: #fff;
  color: var(--oq-ink);
  -webkit-font-smoothing: antialiased;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
}

.oq-public h1,
.oq-public h2,
.oq-public h3 {
  letter-spacing: -0.025em;
  font-weight: 700;
}

.oq-public .lead {
  color: var(--oq-ink-soft);
  font-size: 1.125rem;
  line-height: 1.65;
}

.oq-section {
  padding: 5rem 0;
}

.oq-section-tight { padding: 3.5rem 0; }
.oq-section-wash { background: var(--oq-wash); }
.oq-section-night { background: var(--oq-night); color: #fff; }
.oq-section-night .lead { color: #a7b6c9; }

.oq-eyebrow {
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .75rem;
  font-weight: 700;
  color: var(--oq-brand);
}

.oq-section-night .oq-eyebrow { color: #7ea8ff; }

/* ---------- Brand mark ---------- */

.oq-logo {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  font-weight: 700;
  font-size: 1.2rem;
  letter-spacing: -0.02em;
  color: var(--oq-ink);
  text-decoration: none;
}

.oq-logo:hover { color: var(--oq-ink); }

.oq-logo-mark {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(140deg, var(--oq-brand) 0%, #7c3aed 100%);
  color: #fff;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  flex: 0 0 auto;
}

.oq-logo-light,
.oq-logo-light:hover { color: #fff; }

/* ---------- Navigation ---------- */

.oq-public-nav {
  background: rgba(255, 255, 255, .92);
  backdrop-filter: saturate(180%) blur(8px);
  border-bottom: 1px solid var(--oq-line);
}

.oq-public-nav .nav-link {
  color: var(--oq-ink-soft);
  font-weight: 550;
  font-size: .94rem;
}

.oq-public-nav .nav-link:hover,
.oq-public-nav .nav-link.active { color: var(--oq-ink); }

/* ---------- Hero ---------- */

.oq-hero {
  padding: 4.5rem 0 4rem;
  background:
    radial-gradient(1100px 420px at 12% -8%, #e8f0ff 0%, rgba(232, 240, 255, 0) 62%),
    radial-gradient(900px 380px at 88% 0%, #f3ecff 0%, rgba(243, 236, 255, 0) 58%);
}

.oq-hero h1 {
  font-size: clamp(2.25rem, 5.2vw, 3.6rem);
  line-height: 1.05;
  margin-bottom: 1.15rem;
}

.oq-hero .lead { font-size: 1.2rem; max-width: 34rem; }

.oq-trial-pill {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  background: #fff;
  border: 1px solid var(--oq-line);
  border-radius: 999px;
  padding: .38rem .9rem;
  font-size: .84rem;
  font-weight: 600;
  color: var(--oq-ink-soft);
  box-shadow: 0 1px 2px rgba(16, 26, 40, .05);
}

.oq-trial-pill i { color: var(--oq-accent); }

.btn-oq {
  background: var(--oq-brand);
  border-color: var(--oq-brand);
  color: #fff;
  font-weight: 600;
}

.btn-oq:hover,
.btn-oq:focus {
  background: var(--oq-brand-dark);
  border-color: var(--oq-brand-dark);
  color: #fff;
}

.btn-oq-outline {
  border-color: #cdd8e6;
  color: var(--oq-ink);
  font-weight: 600;
  background: #fff;
}

.btn-oq-outline:hover { border-color: var(--oq-ink-soft); color: var(--oq-ink); }

/* ---------- The product mockup (pure HTML/CSS, no screenshots) ---------- */

.oq-mock {
  border-radius: 16px;
  background: #fff;
  border: 1px solid var(--oq-line);
  box-shadow: 0 24px 60px -24px rgba(16, 26, 40, .3);
  overflow: hidden;
}

.oq-mock-bar {
  display: flex;
  align-items: center;
  gap: .4rem;
  padding: .7rem .9rem;
  background: #f6f8fb;
  border-bottom: 1px solid var(--oq-line);
}

.oq-mock-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #d6dee8;
}

.oq-mock-title {
  margin-left: .5rem;
  font-size: .74rem;
  font-weight: 600;
  color: #8b9aac;
  letter-spacing: .02em;
}

.oq-mock-body { padding: .85rem; }

.oq-mock-row {
  display: flex;
  align-items: center;
  gap: .7rem;
  padding: .62rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--oq-line);
  margin-bottom: .5rem;
  background: #fff;
}

.oq-mock-row:last-child { margin-bottom: 0; }

.oq-mock-avatar {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .68rem;
  font-weight: 700;
  color: #fff;
  flex: 0 0 auto;
}

.oq-mock-lines { min-width: 0; flex: 1 1 auto; }
.oq-mock-subject { font-size: .82rem; font-weight: 600; color: var(--oq-ink); }
.oq-mock-meta { font-size: .72rem; color: #8b9aac; }

.oq-mock-tag {
  font-size: .66rem;
  font-weight: 700;
  padding: .16rem .5rem;
  border-radius: 999px;
  white-space: nowrap;
}

.oq-tag-urgent { background: #fdecec; color: #b4232a; }
.oq-tag-reply { background: var(--oq-brand-soft); color: var(--oq-brand-dark); }
.oq-tag-waiting { background: #fff4e0; color: #96620c; }
.oq-tag-unassigned { background: #f1f3f7; color: #5b687a; }

/* ---------- Cards ---------- */

.oq-feature {
  height: 100%;
  background: #fff;
  border: 1px solid var(--oq-line);
  border-radius: 14px;
  padding: 1.6rem;
}

.oq-feature-icon {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--oq-brand-soft);
  color: var(--oq-brand-dark);
  font-size: 1.15rem;
  margin-bottom: .9rem;
}

.oq-step-number {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--oq-ink);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: .9rem;
  flex: 0 0 auto;
}

.oq-business-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem 1.1rem;
  border: 1px solid var(--oq-line);
  border-radius: 12px;
  background: #fff;
  margin-bottom: .6rem;
}

.oq-count-pill {
  background: var(--oq-brand-soft);
  color: var(--oq-brand-dark);
  border-radius: 999px;
  padding: .18rem .7rem;
  font-weight: 700;
  font-size: .8rem;
  white-space: nowrap;
}

/* ---------- Pricing ---------- */

.oq-price-card {
  border: 1px solid var(--oq-line);
  border-radius: 16px;
  background: #fff;
  padding: 2rem;
  height: 100%;
}

.oq-price-card-feature {
  border-color: var(--oq-brand);
  box-shadow: 0 18px 40px -26px rgba(37, 99, 235, .55);
}

.oq-price-amount {
  font-size: 2.6rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1;
}

.oq-addon {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .65rem 0;
  border-bottom: 1px solid var(--oq-line);
}

.oq-addon:last-child { border-bottom: 0; }

.oq-addon-name { display: flex; align-items: center; gap: .55rem; font-weight: 600; }
.oq-addon-name i { color: var(--oq-ink-soft); width: 1.1rem; text-align: center; }
.oq-addon-price { font-weight: 700; white-space: nowrap; }
.oq-addon-muted .oq-addon-name,
.oq-addon-muted .oq-addon-price { color: #8b9aac; font-weight: 600; }

.oq-badge-soon {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: .14rem .45rem;
  border-radius: 5px;
  background: #f1f3f7;
  color: #5b687a;
}

.oq-badge-live {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: .14rem .45rem;
  border-radius: 5px;
  background: #e3f7ee;
  color: #0a7a56;
}

/* ---------- Footer ---------- */

.oq-footer {
  background: var(--oq-night);
  color: #93a3b8;
  padding: 3.5rem 0 2rem;
}

.oq-footer a { color: #c5d2e2; text-decoration: none; }
.oq-footer a:hover { color: #fff; }
.oq-footer h6 { color: #fff; font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; }

.oq-footer-rule {
  border-top: 1px solid rgba(255, 255, 255, .1);
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  font-size: .82rem;
}

/* ---------- Auth and onboarding pages ---------- */

.oq-auth {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--oq-wash);
}

.oq-auth-main {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.5rem 1rem 3.5rem;
}

.oq-auth-card {
  width: 100%;
  max-width: 27rem;
  background: #fff;
  border: 1px solid var(--oq-line);
  border-radius: 16px;
  padding: 2rem;
  box-shadow: 0 18px 44px -30px rgba(16, 26, 40, .4);
}

.oq-auth-card-wide { max-width: 44rem; }

.oq-steps {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem 1.1rem;
  list-style: none;
  padding: 0;
  margin: 0 0 1.75rem;
  font-size: .82rem;
}

.oq-step {
  display: flex;
  align-items: center;
  gap: .4rem;
  color: #93a1b2;
  font-weight: 600;
}

.oq-step-dot {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1.5px solid #d3dbe6;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .66rem;
  font-weight: 700;
}

.oq-step-done { color: var(--oq-accent); }
.oq-step-done .oq-step-dot { border-color: var(--oq-accent); background: var(--oq-accent); color: #fff; }
.oq-step-current { color: var(--oq-brand-dark); }
.oq-step-current .oq-step-dot { border-color: var(--oq-brand); background: var(--oq-brand); color: #fff; }

.oq-choice {
  display: block;
  border: 1px solid var(--oq-line);
  border-radius: 13px;
  padding: 1rem 1.1rem;
  margin-bottom: .7rem;
  background: #fff;
  cursor: pointer;
  transition: border-color .12s ease, box-shadow .12s ease;
}

.oq-choice:hover { border-color: #bccbe0; }

.oq-choice input:checked ~ .oq-choice-body { color: var(--oq-ink); }

.oq-choice:has(input:checked) {
  border-color: var(--oq-brand);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.oq-choice-locked { background: var(--oq-wash); cursor: default; }
.oq-choice-locked:hover { border-color: var(--oq-line); }

@media (max-width: 767.98px) {
  .oq-section { padding: 3.25rem 0; }
  .oq-hero { padding: 3rem 0 2.5rem; }
}

/* ========================================================================== */
/* Home page refresh - product-led landing page                                */
/* ========================================================================== */

.oq-hero-v2 {
  position: relative;
  overflow: hidden;
  padding: 5.8rem 0 6rem;
  color: #fff;
  background:
    radial-gradient(900px 520px at 73% 8%, rgba(76, 129, 255, .34), transparent 64%),
    radial-gradient(700px 480px at 96% 88%, rgba(139, 92, 246, .25), transparent 62%),
    linear-gradient(135deg, #07111f 0%, #0d1d37 58%, #111d36 100%);
}

.oq-hero-v2::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .3;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 54px 54px;
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 84%);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 84%);
}

.oq-hero-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(4px);
  pointer-events: none;
}
.oq-hero-orb-a { width: 360px; height: 360px; right: -130px; top: -120px; background: rgba(37,99,235,.16); }
.oq-hero-orb-b { width: 320px; height: 320px; left: 42%; bottom: -210px; background: rgba(124,58,237,.16); }

.oq-kicker {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .45rem .8rem;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 999px;
  background: rgba(255,255,255,.07);
  color: #cdd9eb;
  font-size: .82rem;
  font-weight: 650;
  backdrop-filter: blur(10px);
}
.oq-kicker-dot { width: 7px; height: 7px; border-radius: 50%; background: #47d7a5; box-shadow: 0 0 0 5px rgba(71,215,165,.12); }

.oq-hero-title {
  font-size: clamp(3rem, 5.4vw, 5rem) !important;
  line-height: .98 !important;
  letter-spacing: -.055em !important;
  max-width: 12ch;
}
.oq-hero-title span { color: #8cb1ff; }
.oq-hero-copy { max-width: 37rem; color: #b9c7db; font-size: 1.17rem; line-height: 1.7; }
.oq-hero-cta { box-shadow: 0 12px 35px rgba(37,99,235,.28); }
.btn-oq-ghost { border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.06); color: #fff; font-weight: 650; }
.btn-oq-ghost:hover { background: rgba(255,255,255,.11); border-color: rgba(255,255,255,.3); color: #fff; }
.oq-hero-proof { display: flex; flex-wrap: wrap; gap: .65rem 1.15rem; color: #8fa1ba; font-size: .78rem; }
.oq-hero-proof span { display: inline-flex; align-items: center; gap: .35rem; }
.oq-hero-proof i { color: #47d7a5; }

/* Hero product command centre */
.oq-command-wrap { position: relative; padding: 1.4rem; }
.oq-command {
  position: relative;
  z-index: 2;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 22px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 36px 80px rgba(0,0,0,.38), 0 0 0 8px rgba(255,255,255,.035);
  overflow: hidden;
  color: var(--oq-ink);
  transform: perspective(1400px) rotateY(-2deg) rotateX(1deg);
}
.oq-command-top { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.15rem; border-bottom: 1px solid #e7ebf1; background: #fff; }
.oq-command-top > div > div { display: flex; flex-direction: column; }
.oq-command-top strong { font-size: .9rem; }
.oq-command-top small { color: #8795a8; font-size: .68rem; }
.oq-mini-brand { width: 31px; height: 31px; border-radius: 9px; background: linear-gradient(145deg,#2563eb,#7c3aed); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:.69rem; font-weight:800; }
.oq-live-pill { display:inline-flex; align-items:center; gap:.4rem; background:#f3f6fa; color:#617086; border-radius:999px; padding:.28rem .6rem; font-size:.68rem; font-weight:700; }
.oq-live-pill span { width:6px; height:6px; border-radius:50%; background:#10b981; }
.oq-command-summary { padding: 1.25rem 1.2rem 1rem; display:flex; justify-content:space-between; align-items:center; background: linear-gradient(180deg,#f8fbff 0%,#fff 100%); }
.oq-command-summary > div { display:flex; align-items:center; gap:.65rem; }
.oq-summary-number { font-size:2.35rem; line-height:1; font-weight:800; letter-spacing:-.055em; color:#101a28; }
.oq-summary-copy { font-size:.72rem; line-height:1.2; color:#718096; font-weight:650; }
.oq-start-btn { border:0; border-radius:10px; padding:.58rem .8rem; background:#2563eb; color:#fff; font-size:.72rem; font-weight:750; }
.oq-business-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:.48rem; padding:0 1.2rem 1.05rem; }
.oq-biz-card { min-width:0; display:flex; align-items:center; gap:.48rem; border:1px solid #e5eaf1; padding:.58rem; border-radius:11px; background:#fff; }
.oq-biz-card > div { min-width:0; display:flex; flex-direction:column; }
.oq-biz-card strong { font-size:.9rem; line-height:1; }
.oq-biz-card small { margin-top:.14rem; font-size:.58rem; color:#8492a6; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.oq-biz-mark { width:25px; height:25px; border-radius:7px; display:inline-flex; align-items:center; justify-content:center; font-size:.58rem; font-weight:800; color:#fff; flex:0 0 auto; }
.oq-biz-blue .oq-biz-mark,.oq-board-blue .oq-biz-mark { background:#2563eb; }
.oq-biz-green .oq-biz-mark,.oq-board-green .oq-biz-mark { background:#0ea472; }
.oq-biz-purple .oq-biz-mark,.oq-board-purple .oq-biz-mark { background:#7c3aed; }
.oq-biz-orange .oq-biz-mark,.oq-board-orange .oq-biz-mark { background:#f0783c; }
.oq-command-list { border-top:1px solid #e8ecf2; padding: .85rem 1.2rem 1.1rem; background:#fbfcfe; }
.oq-list-head { display:flex; justify-content:space-between; color:#9aa6b6; text-transform:uppercase; letter-spacing:.08em; font-size:.56rem; font-weight:800; margin-bottom:.42rem; }
.oq-command-row { display:flex; align-items:center; gap:.7rem; background:#fff; border:1px solid #e6eaf0; padding:.64rem .68rem; border-radius:10px; margin-bottom:.42rem; }
.oq-row-active { border-color:#b9cef9; box-shadow:0 7px 20px -16px rgba(37,99,235,.9); }
.oq-source-icon { width:29px; height:29px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; font-size:.78rem; }
.oq-source-mail { color:#2459ca; background:#eaf1ff; }
.oq-source-whatsapp { color:#128c62; background:#e8f8f1; }
.oq-source-instagram { color:#9e3aa7; background:#f7eaf9; }
.oq-command-message { display:flex; flex-direction:column; min-width:0; flex:1; }
.oq-command-message strong { font-size:.72rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.oq-command-message small { color:#8995a6; font-size:.59rem; }
.oq-state { border-radius:999px; padding:.2rem .45rem; font-size:.56rem; font-weight:800; white-space:nowrap; }
.oq-state-reply { background:#eaf1ff; color:#2459ca; }
.oq-state-urgent { background:#ffeded; color:#c63a3a; }
.oq-command-actions { display:flex; gap:.4rem; padding-top:.42rem; }
.oq-command-actions span { flex:1; text-align:center; border:1px solid #e5eaf1; border-radius:8px; padding:.38rem .2rem; color:#6f7c8d; font-size:.58rem; font-weight:700; background:#fff; }
.oq-command-actions i { margin-right:.22rem; }

.oq-channel-float { position:absolute; z-index:4; width:44px; height:44px; border-radius:13px; display:flex; align-items:center; justify-content:center; font-size:1.2rem; box-shadow:0 14px 30px rgba(0,0,0,.22); border:1px solid rgba(255,255,255,.7); }
.oq-float-mail { left:-4px; top:26%; background:#fff; color:#2563eb; }
.oq-float-google { right:1px; top:14%; background:#fff; color:#4285f4; }
.oq-float-messenger { right:-6px; bottom:25%; background:#168aff; color:#fff; }
.oq-float-instagram { left:9px; bottom:10%; background:linear-gradient(145deg,#7c3aed,#e94b7d,#f49a35); color:#fff; }
.oq-float-sms { right:22%; bottom:-7px; background:#fff; color:#4b5c72; }

/* Channel availability ribbon */
.oq-channel-strip { background:#fff; border-bottom:1px solid var(--oq-line); }
.oq-channel-strip-inner { min-height:72px; display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:.55rem 1.5rem; color:#59697d; font-size:.82rem; }
.oq-channel-strip-inner > span { display:inline-flex; align-items:center; gap:.42rem; }
.oq-channel-strip-inner i { color:#293a52; }
.oq-channel-strip-label { color:#9aa5b4; font-weight:700; text-transform:uppercase; letter-spacing:.08em; font-size:.68rem; }
.oq-channel-strip-muted { color:#a5afbc; }

.oq-display-h2 { font-size:clamp(2rem,4.1vw,3.25rem); line-height:1.08; letter-spacing:-.045em !important; }
.oq-tick-list { display:grid; gap:.72rem; }
.oq-tick-list span { display:flex; align-items:center; gap:.65rem; font-weight:650; color:#2f4055; }
.oq-tick-list i { width:25px; height:25px; border-radius:50%; background:#e8f7f1; color:#0b8b60; display:inline-flex; align-items:center; justify-content:center; font-weight:900; }

/* Before / after visual */
.oq-transform-card { position:relative; display:grid; grid-template-columns:1fr 58px 1fr; align-items:center; border-radius:22px; padding:1.25rem; background:#fff; border:1px solid #e4e9f0; box-shadow:0 24px 60px -38px rgba(16,26,40,.32); }
.oq-transform-label { display:block; text-align:center; text-transform:uppercase; letter-spacing:.1em; color:#8d99a9; font-size:.65rem; font-weight:800; margin-bottom:.8rem; }
.oq-chaos-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.48rem; }
.oq-chaos-grid div { border:1px solid #e6ebf1; border-radius:10px; padding:.64rem; display:grid; grid-template-columns:25px 1fr; grid-template-rows:auto auto; column-gap:.45rem; align-items:center; background:#fbfcfe; }
.oq-chaos-grid i { grid-row:1 / 3; color:#536379; }
.oq-chaos-grid strong { font-size:.9rem; line-height:1; }
.oq-chaos-grid small { color:#8793a4; font-size:.62rem; }
.oq-transform-arrow { width:38px; height:38px; margin:auto; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#101a28; color:#fff; }
.oq-one-result { min-height:190px; border-radius:16px; padding:1rem; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:linear-gradient(145deg,#edf4ff,#f5efff); border:1px solid #d8e3f5; }
.oq-one-result-brand { width:37px; height:37px; border-radius:11px; display:flex; align-items:center; justify-content:center; background:linear-gradient(145deg,#2563eb,#7c3aed); color:#fff; font-weight:800; font-size:.72rem; margin-bottom:.55rem; }
.oq-one-result strong { font-size:2.4rem; line-height:1; letter-spacing:-.06em; }
.oq-one-result > span:not(.oq-one-result-brand) { font-weight:750; color:#27384e; }
.oq-one-result small { color:#758499; font-size:.64rem; margin-top:.4rem; }

/* Business board */
.oq-business-section { overflow:hidden; }
.oq-business-board { border:1px solid #e0e6ef; border-radius:20px; padding:1rem; background:#fff; box-shadow:0 28px 70px -42px rgba(16,26,40,.36); }
.oq-board-top { display:flex; justify-content:space-between; align-items:center; padding:.3rem .35rem .9rem; color:#7b899b; font-size:.72rem; font-weight:700; }
.oq-board-top strong { color:#132034; }
.oq-board-business { display:flex; align-items:center; justify-content:space-between; gap:.8rem; border:1px solid #e7ebf1; border-radius:12px; padding:.85rem .8rem; margin-bottom:.55rem; }
.oq-board-business > div { display:flex; align-items:center; gap:.65rem; }
.oq-board-business > span { color:#748196; font-size:.74rem; white-space:nowrap; }
.oq-board-business .oq-biz-mark { width:32px; height:32px; border-radius:9px; }
.oq-board-footer { margin-top:.9rem; padding:.75rem .8rem; background:#f6f8fb; border-radius:10px; color:#778598; font-size:.72rem; text-align:center; }
.oq-mini-stat-row { display:grid; grid-template-columns:repeat(3,1fr); gap:.7rem; }
.oq-mini-stat-row div { padding:.9rem; background:#f7f9fc; border:1px solid #e7ebf1; border-radius:12px; }
.oq-mini-stat-row strong,.oq-mini-stat-row span { display:block; }
.oq-mini-stat-row strong { font-size:.95rem; }
.oq-mini-stat-row span { color:#8491a3; font-size:.68rem; }

/* Workflow */
.oq-decision-flow { display:grid; grid-template-columns:1.65fr 55px 1.2fr 55px .72fr; gap:.85rem; align-items:center; }
.oq-flow-message,.oq-flow-options,.oq-flow-next { min-height:165px; border-radius:17px; }
.oq-flow-message { padding:1.25rem; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.06); }
.oq-flow-message-head { display:flex; align-items:center; gap:.65rem; margin-bottom:1rem; }
.oq-flow-message-head > div { display:flex; flex-direction:column; }
.oq-flow-message-head small { color:#8698b2; font-size:.68rem; }
.oq-flow-message p { color:#d6dfec; margin:0; font-size:.93rem; line-height:1.55; }
.oq-flow-arrow { color:#71829a; text-align:center; font-size:1.3rem; }
.oq-flow-options { padding:.75rem; display:grid; grid-template-columns:1fr 1fr; gap:.45rem; background:#fff; }
.oq-flow-options span { display:flex; align-items:center; justify-content:center; gap:.38rem; border:1px solid #e5eaf1; border-radius:10px; color:#5b687a; font-size:.72rem; font-weight:700; }
.oq-flow-options .oq-flow-done { border-color:#bde7d6; background:#edfaf5; color:#087b55; }
.oq-flow-next { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:linear-gradient(145deg,#2563eb,#644be1); color:#fff; padding:1rem; }
.oq-flow-next strong { font-size:2.5rem; line-height:1; letter-spacing:-.05em; }
.oq-flow-next span { font-size:.75rem; margin:.2rem 0 .65rem; }
.oq-flow-next small { font-weight:700; opacity:.75; }

/* Channel cards */
.oq-channel-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.oq-channel-panel { border:1px solid #e3e8ef; border-radius:18px; padding:1.2rem; background:#fff; }
.oq-channel-panel-live { border-top:3px solid #16a879; }
.oq-channel-panel-wait { border-top:3px solid #e5a329; }
.oq-channel-panel-review { border-top:3px solid #8997aa; }
.oq-channel-panel-head { display:flex; align-items:center; gap:.45rem; margin-bottom:1rem; font-size:.78rem; text-transform:uppercase; letter-spacing:.065em; }
.oq-status-dot { width:7px; height:7px; border-radius:50%; background:#16a879; }
.oq-channel-panel-wait .oq-status-dot { background:#e5a329; }
.oq-channel-panel-review .oq-status-dot { background:#8997aa; }
.oq-channel-item { display:grid; grid-template-columns:36px 1fr auto; gap:.7rem; align-items:start; padding:.82rem 0; border-bottom:1px solid #edf0f4; }
.oq-channel-item:last-of-type { border-bottom:0; }
.oq-channel-icon { width:36px; height:36px; border-radius:10px; display:flex; align-items:center; justify-content:center; background:#f3f6fa; color:#32445c; }
.oq-channel-item > div { display:flex; flex-direction:column; min-width:0; }
.oq-channel-item strong { font-size:.82rem; }
.oq-channel-item small { color:#8592a3; font-size:.65rem; line-height:1.35; margin-top:.12rem; }
.oq-channel-item .oq-support-note { color:#68778b; font-style:italic; }
.oq-channel-price { font-size:.68rem; font-weight:800; color:#526075; white-space:nowrap; }
.oq-channel-provider-list { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.75rem; }
.oq-channel-provider-list span { border-radius:999px; padding:.3rem .55rem; background:#edf9f4; color:#0a7955; font-size:.64rem; font-weight:700; }
.oq-channel-note { margin:.9rem 0 0; color:#8793a4; font-size:.65rem; line-height:1.45; }

/* Pricing */
.oq-pricing-band { background:linear-gradient(180deg,#f7f9fc 0%,#eef4ff 100%); }
.oq-pricing-shell { border:1px solid #dce4ef; border-radius:24px; padding:clamp(1.5rem,4vw,3.5rem); background:#fff; box-shadow:0 26px 70px -50px rgba(16,26,40,.4); }
.oq-price-builder { border:1px solid #e0e6ee; border-radius:16px; overflow:hidden; }
.oq-price-line { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.8rem 1rem; border-bottom:1px solid #ebeff4; }
.oq-price-line > div { display:flex; align-items:center; gap:.65rem; }
.oq-price-line strong { font-size:.84rem; }
.oq-price-line strong small { font-weight:500; color:#8b97a7; margin-left:.15rem; }
.oq-price-icon { width:28px; height:28px; border-radius:8px; background:#f1f5fa; display:inline-flex; align-items:center; justify-content:center; color:#485a72; }
.oq-price-base { background:#f8fbff; }
.oq-price-line-muted { color:#8e99a8; }
.oq-price-line em { font-size:.56rem; font-style:normal; text-transform:uppercase; letter-spacing:.05em; border-radius:5px; padding:.12rem .35rem; background:#f1f3f6; color:#8995a5; }
.oq-price-example { display:flex; justify-content:space-between; align-items:center; padding:1rem; background:#101a28; color:#fff; font-size:.85rem; }
.oq-price-example strong { font-size:1rem; }
.oq-text-link { color:#33465f; font-size:.76rem; font-weight:700; text-decoration:none; }
.oq-text-link:hover { color:#2563eb; }

/* Security */
.oq-security-section { background:#fff; }
.oq-security-grid { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }
.oq-security-grid > div { display:grid; grid-template-columns:40px 1fr; column-gap:.75rem; padding:1rem; border:1px solid #e5e9ef; border-radius:14px; }
.oq-security-grid i { grid-row:1 / 3; width:40px; height:40px; border-radius:11px; display:flex; align-items:center; justify-content:center; background:#eef4ff; color:#2c5fca; }
.oq-security-grid strong { font-size:.84rem; }
.oq-security-grid span { color:#7e8c9f; font-size:.68rem; line-height:1.45; }

/* Final CTA */
.oq-final-cta { padding:0 0 5rem; }
.oq-final-shell { border-radius:24px; padding:clamp(1.5rem,4vw,3.5rem); background:linear-gradient(135deg,#1c55d8 0%,#6544d7 100%); color:#fff; display:flex; align-items:center; justify-content:space-between; gap:2rem; box-shadow:0 30px 60px -36px rgba(37,99,235,.7); }
.oq-final-shell .oq-eyebrow { color:#d7e4ff; }
.oq-final-shell h2 { font-size:clamp(1.8rem,3.4vw,2.7rem); letter-spacing:-.04em; }
.oq-final-shell p { color:#d7e0f3; }
.oq-final-action { display:flex; flex-direction:column; align-items:center; gap:.55rem; flex:0 0 auto; }
.oq-final-action small { color:#d6def1; }

@media (max-width: 1199.98px) {
  .oq-command-wrap { padding:.75rem; }
  .oq-channel-float { display:none; }
  .oq-command { transform:none; }
  .oq-business-strip { grid-template-columns:1fr 1fr; }
}

@media (max-width: 991.98px) {
  .oq-hero-v2 { padding:4.3rem 0; }
  .oq-hero-title { max-width:14ch; }
  .oq-decision-flow { grid-template-columns:1fr; }
  .oq-flow-arrow { transform:rotate(90deg); }
  .oq-flow-message,.oq-flow-options,.oq-flow-next { min-height:auto; }
  .oq-flow-options { min-height:140px; }
  .oq-channel-grid { grid-template-columns:1fr; }
  .oq-final-shell { flex-direction:column; align-items:flex-start; }
  .oq-final-action { align-items:flex-start; }
}

@media (max-width: 767.98px) {
  .oq-hero-v2 { padding:3.5rem 0; }
  .oq-hero-title { font-size:clamp(2.65rem,13vw,4rem) !important; }
  .oq-command-wrap { padding:0; }
  .oq-command-summary { align-items:flex-end; }
  .oq-start-btn { display:none; }
  .oq-business-strip { grid-template-columns:1fr 1fr; padding-left:.75rem; padding-right:.75rem; }
  .oq-command-list { padding-left:.75rem; padding-right:.75rem; }
  .oq-command-actions { display:grid; grid-template-columns:1fr 1fr; }
  .oq-channel-strip-inner { justify-content:flex-start; padding:1rem 0; }
  .oq-transform-card { grid-template-columns:1fr; gap:.9rem; }
  .oq-transform-arrow { transform:rotate(90deg); }
  .oq-mini-stat-row { grid-template-columns:1fr; }
  .oq-board-business { align-items:flex-start; }
  .oq-board-business > span { white-space:normal; text-align:right; }
  .oq-security-grid { grid-template-columns:1fr; }
  .oq-price-line { align-items:flex-start; }
  .oq-price-line > div { flex-wrap:wrap; }
}

.oq-source-sms { color:#0b815b; background:#e8f8f1; }