:root {
  --brand: #c32030;
  --brand-dark: #991726;
  --brand-soft: #fff0f1;
  --border: #e2e7ee;
  --text: #18202b;
  --muted: #667085;
  --focus: 0 0 0 3px rgb(195 32 48 / 22%);
}

* { box-sizing: border-box; }
html { color-scheme: light; }
body { color: var(--text); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
a { color: inherit; text-decoration: none; }
:focus-visible { outline: none; box-shadow: var(--focus); }
.mobile-blocker { display: none; }
.auth-body { min-width: 1024px; min-height: 100vh; margin: 0; background: #f2f4f7; }
.auth-layout { min-height: 100vh; display: grid; grid-template-columns: minmax(480px, 1.05fr) minmax(500px, .95fr); }
.auth-story { display: flex; flex-direction: column; justify-content: space-between; padding: 54px clamp(48px, 6vw, 96px); color: #fff; background: radial-gradient(circle at 15% 85%, rgb(195 32 48 / 42%), transparent 35%), linear-gradient(145deg, #15171b 20%, #2b1a1e); }
.auth-brand-lockup { display: flex; align-items: flex-end; gap: 12px; white-space: nowrap; }
.auth-brand-lockup a { display: flex; border-radius: 4px; }
.auth-home-link { flex: 0 0 auto; }
.auth-brand-lockup .auth-logo { display: block; height: auto; }
.auth-logo-refactoriq { width: 200px; }
.auth-logo-estuate { width: 128px; }
.auth-brand-lockup p { margin: 0; color: #c7ccd2; font-size: 11px; font-weight: 800; line-height: 1; letter-spacing: .12em; }
.eyebrow { margin: 0 0 6px; color: var(--brand); font-size: 12px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.eyebrow.light { color: #ffb4bb; }
.auth-story h1 { max-width: 680px; margin: 10px 0 18px; font-size: clamp(42px, 4.4vw, 68px); line-height: 1.02; letter-spacing: -.035em; }
.auth-story > div > p:last-child { max-width: 660px; color: #c7ccd2; font-size: 18px; line-height: 1.6; }
.auth-proof { display: flex; gap: 22px; color: #d9dde2; font-size: 13px; }
.auth-card { width: min(560px, 90%); align-self: center; justify-self: center; padding: 34px; background: #fff; border: 1px solid var(--border); border-radius: 13px; box-shadow: 0 25px 70px rgb(16 24 40 / 11%); }
.auth-card h2 { margin: 0; font-size: 31px; letter-spacing: -.035em; }
.product-list { display: grid; gap: 10px; margin-top: 21px; }
.product-button { width: 100%; min-height: 70px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 13px; padding: 13px; color: var(--text); text-align: left; text-decoration: none; background: #fff; border: 1px solid var(--border); border-radius: 8px; }
a.product-button:hover { color: var(--text); text-decoration: none; border-color: #e2a2a8; background: var(--brand-soft); }
.product-button:disabled { color: var(--text); background: #fff; cursor: default; opacity: 1; }
.product-button > span:nth-child(2) { display: flex; min-width: 0; flex-direction: column; }
.product-button strong { font-size: 15px; }
.product-button small { margin-top: 3px; color: var(--muted); font-size: 12px; line-height: 1.35; }
.product-icon { width: 42px; height: 42px; display: grid; place-items: center; color: #fff; background: var(--brand); border-radius: 8px; }
.product-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.availability-label { padding: 5px 8px; color: var(--brand-dark); background: var(--brand-soft); border-radius: 999px; font-size: 9px; font-weight: 800; text-transform: uppercase; white-space: nowrap; }
.auth-footnote { margin: 18px 0 0; color: #737d8c; text-align: center; font-size: 12px; line-height: 1.45; }
.auth-footnote a { color: var(--brand-dark); font-weight: 700; }
.auth-footnote a:hover { text-decoration: underline; text-underline-offset: 2px; }
.help-link { width: fit-content; display: flex; align-items: center; gap: 7px; margin: 12px auto 0; padding: 7px 9px; color: var(--muted); border-radius: 7px; font-size: 13px; font-weight: 700; }
.help-link::after { content: "\2192"; color: var(--brand); font-size: 16px; line-height: 1; transition: transform 160ms ease; }
.help-link:hover { color: var(--brand-dark); background: var(--brand-soft); }
.help-link:hover::after { transform: translateX(2px); }
.button { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; padding: 9px 16px; border: 1px solid var(--border); border-radius: 7px; font-size: 14px; font-weight: 700; }
.button.primary { color: #fff; background: var(--brand); border-color: var(--brand); }
.button.primary:hover { background: var(--brand-dark); }
.button.secondary { color: #344054; background: #fff; }
.standalone-body { min-height: 100vh; display: grid; place-items: center; margin: 0; padding: 30px; background: radial-gradient(circle at 90% 10%, #fae4e6, transparent 28%), #f3f5f8; }
.standalone-card { width: min(640px, 92vw); padding: 42px; text-align: center; background: #fff; border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 24px 70px rgb(16 24 40 / 11%); }
.standalone-card > img { width: 220px; margin-bottom: 32px; }
.standalone-card h1 { margin: 7px 0 12px; font-size: 34px; letter-spacing: -.04em; }
.standalone-card > p:not(.eyebrow) { max-width: 500px; margin: 0 auto 24px; color: var(--muted); font-size: 16px; line-height: 1.65; }
.standalone-actions { display: flex; justify-content: center; gap: 10px; }

.help-body { min-height: 100vh; margin: 0; background: #f4f6f8; }
.help-header { position: sticky; top: 0; z-index: 10; border-bottom: 1px solid rgb(226 231 238 / 88%); background: rgb(255 255 255 / 94%); backdrop-filter: blur(12px); }
.help-header-inner { width: min(1180px, calc(100% - 48px)); min-height: 72px; display: grid; grid-template-columns: 184px minmax(250px, 1fr) auto; align-items: center; gap: 24px; margin: 0 auto; }
.help-brand { display: flex; border-radius: 5px; }
.help-brand img { display: block; width: 184px; height: auto; }
.support-nav { display: flex; justify-self: center; gap: 3px; padding: 4px; background: #f0f2f5; border-radius: 9px; }
.support-nav-link { padding: 8px 14px; color: var(--muted); border-radius: 6px; font-size: 13px; font-weight: 750; }
.support-nav-link:hover { color: var(--text); }
.support-nav-link.active { color: var(--text); background: #fff; box-shadow: 0 1px 4px rgb(16 24 40 / 10%); }
.help-header-actions { display: flex; align-items: center; gap: 20px; }
.help-back-link { color: var(--muted); font-size: 14px; font-weight: 700; }
.help-back-link:hover { color: var(--brand-dark); }
.help-main { width: min(1180px, calc(100% - 48px)); margin: 0 auto; padding: 36px 0 72px; }
.help-hero { padding: clamp(48px, 7vw, 88px); color: #fff; background: radial-gradient(circle at 82% 20%, rgb(195 32 48 / 48%), transparent 32%), linear-gradient(145deg, #15171b 20%, #2b1a1e); border-radius: 18px; box-shadow: 0 28px 70px rgb(16 24 40 / 15%); }
.help-hero h1 { max-width: 760px; margin: 11px 0 18px; font-size: clamp(44px, 6vw, 72px); line-height: 1; letter-spacing: -.045em; }
.help-hero > p:not(.eyebrow) { max-width: 690px; margin: 0 0 28px; color: #d9dde2; font-size: 18px; line-height: 1.65; }
.help-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.help-hero > p.help-hero-contact { max-width: none; margin: 18px 0 0; font-size: 14px; line-height: 1.5; }
.help-hero-contact a { color: #fff; font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }
.help-hero-button { color: var(--text); background: #fff; border-color: #fff; }
.help-hero-button:hover { color: var(--brand-dark); background: var(--brand-soft); border-color: var(--brand-soft); }
.help-hero-button.secondary { color: #fff; background: transparent; border-color: rgb(255 255 255 / 48%); }
.help-hero-button.secondary:hover { color: #fff; background: rgb(255 255 255 / 12%); border-color: #fff; }
.help-layout { display: grid; grid-template-columns: 210px minmax(0, 1fr); align-items: start; gap: clamp(40px, 7vw, 88px); margin-top: 72px; }
.help-toc { position: sticky; top: 104px; padding: 4px 0; }
.help-toc > p { margin: 0 0 14px; color: var(--text); font-size: 12px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.help-toc nav { display: grid; gap: 4px; border-left: 1px solid var(--border); }
.help-toc a { padding: 9px 0 9px 16px; color: var(--muted); font-size: 14px; font-weight: 650; line-height: 1.4; border-left: 2px solid transparent; transform: translateX(-1px); }
.help-toc a:hover { color: var(--brand-dark); border-left-color: var(--brand); }
.faq-content { min-width: 0; display: grid; gap: 64px; }
.faq-section { scroll-margin-top: 104px; }
.faq-section > .eyebrow { margin-bottom: 8px; }
.faq-section h2 { margin: 0 0 22px; font-size: clamp(30px, 4vw, 40px); line-height: 1.1; letter-spacing: -.035em; }
.faq-list { overflow: hidden; background: #fff; border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 14px 38px rgb(16 24 40 / 6%); }
.faq-item + .faq-item { border-top: 1px solid var(--border); }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 22px 24px; color: var(--text); font-size: 16px; font-weight: 750; line-height: 1.4; cursor: pointer; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; flex: 0 0 auto; width: 28px; height: 28px; display: grid; place-items: center; color: var(--brand-dark); background: var(--brand-soft); border-radius: 50%; font-size: 20px; font-weight: 500; line-height: 1; transition: transform 160ms ease; }
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item summary:hover { color: var(--brand-dark); }
.faq-answer { padding: 0 68px 22px 24px; color: var(--muted); font-size: 15px; line-height: 1.72; }
.faq-answer p { margin: 0; }
.faq-answer p + p, .faq-answer ul + p { margin-top: 14px; }
.faq-answer ul { display: grid; gap: 8px; margin: 0; padding-left: 20px; }
.faq-answer a:not(.button) { color: var(--brand-dark); font-weight: 700; text-decoration: underline; text-decoration-color: rgb(195 32 48 / 35%); text-underline-offset: 3px; }
.faq-documentation-button { width: fit-content; margin-top: 18px; color: #fff; background: var(--brand); border-color: var(--brand); }
.faq-documentation-button:hover { background: var(--brand-dark); border-color: var(--brand-dark); }
.help-cta { display: flex; align-items: center; justify-content: space-between; gap: 40px; margin-top: 80px; padding: clamp(36px, 5vw, 56px); color: #fff; background: linear-gradient(135deg, var(--brand-dark), var(--brand)); border-radius: 16px; box-shadow: 0 22px 55px rgb(153 23 38 / 18%); }
.help-cta h2 { margin: 8px 0 10px; font-size: clamp(30px, 4vw, 42px); line-height: 1.08; letter-spacing: -.035em; }
.help-cta p:not(.eyebrow) { max-width: 680px; margin: 0; color: #ffe1e4; font-size: 16px; line-height: 1.6; }
.help-cta .button { flex: 0 0 auto; }
.help-footer { width: min(1180px, calc(100% - 48px)); display: flex; justify-content: space-between; gap: 24px; margin: 0 auto; padding: 0 0 34px; color: var(--muted); font-size: 13px; }
.help-footer p { margin: 0; }
.help-footer a { color: var(--brand-dark); font-weight: 700; }
.help-footer a:hover { text-decoration: underline; text-underline-offset: 3px; }

.docs-main { width: min(1180px, calc(100% - 48px)); margin: 0 auto; padding: 76px 0 80px; }
.docs-hero { max-width: 780px; }
.docs-hero h1 { margin: 10px 0 18px; font-size: clamp(44px, 6vw, 68px); line-height: 1; letter-spacing: -.045em; }
.docs-hero > p:not(.eyebrow) { max-width: 700px; margin: 0; color: var(--muted); font-size: 18px; line-height: 1.65; }
.docs-catalog { margin-top: 64px; }
.docs-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 24px; }
.docs-section-heading h2 { margin: 0; font-size: 28px; letter-spacing: -.025em; }
.docs-section-heading p { max-width: 540px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.docs-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.docs-product-card { min-height: 150px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-rows: 1fr auto; align-items: start; gap: 16px; padding: 24px; background: #fff; border: 1px solid var(--border); border-radius: 13px; box-shadow: 0 12px 32px rgb(16 24 40 / 5%); transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.docs-product-card:hover { border-color: #e2a2a8; box-shadow: 0 18px 38px rgb(16 24 40 / 9%); transform: translateY(-2px); }
.docs-product-icon { width: 42px; height: 42px; display: grid; grid-row: 1 / 3; place-items: center; color: #fff; background: var(--brand); border-radius: 9px; font-size: 16px; font-weight: 800; }
.docs-product-copy { display: flex; flex-direction: column; gap: 7px; }
.docs-product-copy strong { font-size: 18px; letter-spacing: -.015em; }
.docs-product-copy small { color: var(--muted); font-size: 13px; line-height: 1.5; }
.docs-status { width: fit-content; grid-column: 2; padding: 5px 8px; color: #737d8c; background: #f0f2f5; border-radius: 999px; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.docs-status.available { color: var(--brand-dark); background: var(--brand-soft); }
.docs-card-arrow { grid-column: 3; grid-row: 1 / 3; align-self: center; color: var(--brand); font-size: 21px; transition: transform 160ms ease; }
.docs-product-card:hover .docs-card-arrow { transform: translateX(3px); }
.docs-footer { padding-top: 4px; }

.docs-product-body { background: #fff; }
.docs-shell { width: min(1400px, calc(100% - 48px)); min-height: calc(100vh - 73px); display: grid; grid-template-columns: 240px minmax(0, 760px) 170px; align-items: start; justify-content: center; gap: clamp(36px, 5vw, 72px); margin: 0 auto; padding: 48px 0 80px; }
.docs-sidebar { position: sticky; top: 104px; min-width: 0; }
.docs-all-products { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 30px; color: var(--muted); font-size: 13px; font-weight: 700; }
.docs-all-products:hover { color: var(--brand-dark); }
.docs-sidebar-title { display: flex; flex-direction: column; gap: 5px; padding-bottom: 18px; border-bottom: 1px solid var(--border); }
.docs-sidebar-title .eyebrow { margin: 0; font-size: 10px; }
.docs-sidebar-title strong { font-size: 19px; letter-spacing: -.02em; }
.docs-page-nav { display: grid; gap: 3px; margin-top: 14px; }
.docs-page-nav a, .docs-page-nav > span { padding: 9px 11px; color: var(--muted); border-radius: 6px; font-size: 14px; line-height: 1.4; }
.docs-page-nav a:hover { color: var(--text); background: #f5f6f8; }
.docs-page-nav a.active { color: var(--brand-dark); background: var(--brand-soft); font-weight: 750; }
.docs-page-nav > span { font-size: 13px; font-style: italic; }
.docs-article { min-width: 0; }
.docs-breadcrumbs { display: flex; align-items: center; gap: 9px; margin-bottom: 44px; color: #89919e; font-size: 13px; }
.docs-breadcrumbs a:hover { color: var(--brand-dark); }
.docs-article > .eyebrow { margin-bottom: 9px; }
.docs-article > h1, .docs-empty-state h1 { margin: 0 0 18px; font-size: clamp(40px, 5vw, 58px); line-height: 1.03; letter-spacing: -.045em; }
.docs-lead, .docs-empty-state > p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: 18px; line-height: 1.65; }
.docs-article-section { scroll-margin-top: 110px; margin-top: 54px; padding-top: 6px; }
.docs-article-section h2 { margin: 0 0 16px; font-size: 28px; line-height: 1.2; letter-spacing: -.025em; }
.docs-article-section > p { margin: 0; color: #4e5968; font-size: 16px; line-height: 1.75; }
.docs-callout { margin-top: 24px; padding: 24px; background: #f7f8fa; border: 1px solid var(--border); border-left: 3px solid var(--brand); border-radius: 9px; }
.docs-callout > strong { font-size: 15px; }
.docs-callout ul { display: grid; gap: 9px; margin: 16px 0 0; padding-left: 20px; color: #4e5968; font-size: 14px; line-height: 1.5; }
.docs-inline-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.docs-on-page { position: sticky; top: 104px; display: grid; gap: 4px; padding-left: 18px; border-left: 1px solid var(--border); }
.docs-on-page p { margin: 0 0 8px; color: var(--text); font-size: 11px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.docs-on-page a { padding: 5px 0; color: var(--muted); font-size: 12px; line-height: 1.4; }
.docs-on-page a:hover { color: var(--brand-dark); }
.docs-empty-state { max-width: 650px; padding-top: 32px; }
.docs-empty-state .button { margin-top: 26px; }

@media (max-width: 1023px) {
  .auth-layout { display: none; }
  .auth-body { min-width: 0; }
  .mobile-blocker { min-height: 100vh; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 32px; text-align: center; background: #fff; }
  .mobile-blocker img { margin-bottom: 35px; }
  .mobile-blocker h1 { font-size: 28px; }
  .mobile-blocker p { max-width: 480px; color: var(--muted); font-size: 16px; }
  .help-layout { grid-template-columns: 1fr; gap: 38px; margin-top: 52px; }
  .help-toc { position: static; }
  .help-toc nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; border-left: 0; }
  .help-toc a { padding: 10px 12px; background: #fff; border: 1px solid var(--border); border-radius: 7px; transform: none; }
  .help-toc a:hover { border-color: #e2a2a8; }
  .help-header-actions { display: none; }
  .help-header-inner { grid-template-columns: 184px 1fr; }
  .support-nav { justify-self: end; }
  .docs-shell { grid-template-columns: 220px minmax(0, 760px); }
  .docs-on-page { display: none; }
}

@media (max-width: 640px) {
  .help-header-inner, .help-main, .help-footer, .docs-main, .docs-shell { width: min(100% - 32px, 1180px); }
  .help-header-inner { grid-template-columns: 1fr; gap: 8px; padding: 10px 0; }
  .help-brand { justify-self: center; }
  .help-brand img { width: 130px; }
  .support-nav { width: 100%; justify-self: stretch; }
  .support-nav-link { flex: 1; padding: 7px 9px; text-align: center; font-size: 11px; }
  .help-main { padding-top: 16px; }
  .help-hero { padding: 38px 26px; border-radius: 13px; }
  .help-hero h1 { font-size: 42px; }
  .help-hero > p:not(.eyebrow) { font-size: 16px; }
  .help-toc nav { grid-template-columns: 1fr; }
  .faq-content { gap: 48px; }
  .faq-item summary { padding: 19px 18px; font-size: 15px; }
  .faq-answer { padding: 0 18px 20px; }
  .help-cta { align-items: flex-start; flex-direction: column; margin-top: 56px; }
  .help-footer { align-items: flex-start; flex-direction: column; }
  .docs-main { padding: 48px 0 60px; }
  .docs-hero h1 { font-size: 43px; }
  .docs-hero > p:not(.eyebrow) { font-size: 16px; }
  .docs-section-heading { align-items: flex-start; flex-direction: column; gap: 10px; }
  .docs-product-grid { grid-template-columns: 1fr; }
  .docs-product-card { padding: 20px; }
  .docs-shell { grid-template-columns: 1fr; gap: 40px; padding-top: 28px; }
  .docs-sidebar { position: static; }
  .docs-all-products { margin-bottom: 20px; }
  .docs-page-nav { display: flex; overflow-x: auto; }
  .docs-page-nav a, .docs-page-nav > span { white-space: nowrap; }
  .docs-breadcrumbs { margin-bottom: 34px; }
  .docs-article > h1, .docs-empty-state h1 { font-size: 40px; }
  .faq-section, .docs-article-section { scroll-margin-top: 130px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
