/* Task 1 extends the established Home system; the original and About styles stay intact. */
.launch-page {
  --muted: #566473;
  --mist: #f3f7f5;
  --midnight: #0d1b2a;
  --blue: #2563eb;
  --error: #9a3029;
}
.launch-page main {
  overflow-wrap: break-word;
}
.launch-page :is(input, button, summary, a) {
  -webkit-tap-highlight-color: transparent;
}
.utility-strip {
  background: var(--mist);
  font-size: 12px;
  border-bottom: 1px solid var(--line);
}
.utility-strip > .shell {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding-block: 8px;
}
.utility-strip a {
  text-decoration: none;
  text-underline-offset: 3px;
}
.header-row {
  min-height: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.launch-header .logo-link {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  min-height: 44px;
}
.launch-header .logo-link img {
  width: 205px;
  height: auto;
}
.desktop-nav {
  display: flex;
  gap: 22px;
  align-items: center;
}
.nav-group {
  position: relative;
  font-size: 14px;
}
.nav-group > summary {
  cursor: pointer;
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 7px;
  font-weight: 500;
  list-style: none;
}
.nav-group > summary::-webkit-details-marker {
  display: none;
}
.nav-group > summary:after {
  content: "";
  width: 6px;
  height: 6px;
  border-right: 1.5px solid;
  border-bottom: 1.5px solid;
  transform: rotate(45deg);
  margin-top: -4px;
}
.nav-group[open] > summary:after {
  transform: rotate(225deg);
  margin-top: 3px;
}
/* Top-level header link with no dropdown (Blog): same type as the group labels, no chevron. */
.nav-top-link {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 44px;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
}
.nav-top-link:hover,
.nav-top-link[aria-current="page"] {
  color: var(--forest);
}
.desktop-nav .nav-top-link[aria-current="page"]::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  border-radius: 2px;
  background: var(--forest);
}
.nav-dropdown {
  position: absolute;
  left: -18px;
  top: 100%;
  width: 250px;
  padding: 14px 18px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 18px 40px -18px rgba(23, 40, 62, 0.35);
  z-index: 50;
  animation: nav-dropdown-in 0.16s ease-out;
}
@keyframes nav-dropdown-in {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .nav-dropdown {
    animation: none;
  }
}
.nav-dropdown :is(a, .pending-link) {
  display: block;
  padding: 11.5px 4px;
  line-height: 1.5;
  font-size: 14px;
}
.nav-dropdown a:hover,
.nav-dropdown [aria-current="page"] {
  color: var(--forest);
  text-decoration: none;
  text-underline-offset: 4px;
}
.nav-note {
  font-size: 12px !important;
  color: var(--muted);
  border-top: 1px solid var(--line);
  padding-top: 12px;
}
.pending-link {
  color: var(--muted);
  cursor: default;
  text-decoration: none;
  font-weight: 400;
}
.pending-link:not(.nav-dropdown .pending-link):not(
    .legal-links .pending-link
  ):not(.footer-columns .pending-link) {
  display: inline-block;
}
.review-notice {
  font-size: 12px;
  color: var(--muted);
  background: #f7faf8;
  border-bottom: 1px solid var(--line);
  padding-block: 10px;
}
.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  padding-top: 28px;
  color: var(--muted);
}
.breadcrumbs a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  text-decoration: none;
  text-underline-offset: 4px;
  color: var(--forest);
}
.page-hero {
  padding-block: 38px 58px;
  background: #fbfdfc;
  border-bottom: 1px solid var(--line);
}
.page-hero h1 {
  font-size: clamp(40px, 4.8vw, 68px);
  max-width: 23ch;
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -0.035em;
  text-wrap: balance;
}
.intro-copy {
  max-width: 78ch;
  margin-top: 28px;
}
.intro-copy > p:first-child {
  font-size: 18px;
  line-height: 1.75;
}
.review-line {
  margin-top: 26px;
  font-size: 12px;
  line-height: 1.7;
  color: var(--muted);
}
.reading-layout {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  gap: 56px;
  padding-block: 60px 90px;
  align-items: start;
}
.jump-nav {
  position: sticky;
  top: 110px;
  max-height: calc(100vh - 140px);
  overflow: auto;
  font-size: 13px;
  border-top: 1px solid var(--line);
  padding-top: 16px;
}
.jump-nav > button {
  font-size: 14px;
  font-weight: 700;
  min-height: 44px;
  text-align: left;
  width: 100%;
  cursor: default;
}
.jump-nav nav > a {
  display: block;
  padding: 10px 0;
  color: var(--muted);
  line-height: 1.5;
  text-underline-offset: 4px;
}
.jump-nav a:hover {
  color: var(--forest);
  text-decoration: none;
}
.reading-content {
  min-width: 0;
}
.prose {
  line-height: 1.75;
}
.prose p {
  margin-block: 16px;
  max-width: 75ch;
}
.prose p:first-child {
  margin-top: 0;
}
.prose :is(ul, ol) {
  margin-block: 22px;
  padding-left: 24px;
  max-width: 75ch;
}
.prose ul {
  list-style: disc;
}
.prose ol {
  list-style: decimal;
}
.prose li + li {
  margin-top: 12px;
}
.prose a:not(.button) {
  color: var(--forest);
  text-decoration: none;
  text-underline-offset: 4px;
}
.prose :is(h2, h3) {
  font-weight: 700;
  line-height: 1.25;
  text-wrap: balance;
  letter-spacing: -0.02em;
}
.prose h2 {
  font-size: clamp(28px, 2.7vw, 38px);
  margin-bottom: 24px;
  max-width: 33ch;
}
.prose h3 {
  font-size: 23px;
  margin-top: 38px;
  margin-bottom: 16px;
  max-width: 45ch;
}
.prose strong {
  font-weight: 700;
}
.prose em {
  font-size: 14px;
  color: var(--muted);
}
.content-section {
  padding-block: 0 54px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 54px;
  scroll-margin-top: 108px;
}
.content-section:last-child {
  border-bottom: 0;
  margin-bottom: 0;
  padding-bottom: 0;
}
.content-action {
  display: inline-block;
  vertical-align: middle;
  margin-right: 22px !important;
}
.prose .button {
  line-height: 1.4;
  color: white;
  text-decoration: none;
}
.pending-fact {
  display: inline-block;
  background: #f0f4f1;
  color: #44564f;
  border-radius: 4px;
  padding: 3px 7px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0;
  vertical-align: baseline;
}
.notice {
  background: var(--mist);
  border: 1px solid var(--line);
  padding: 20px 24px;
  border-radius: 7px;
  margin-block: 22px;
  font-size: 14px;
  line-height: 1.75;
}
.notice p:last-child {
  margin-bottom: 0;
}
.table-scroll {
  max-width: 100%;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 7px;
  margin-block: 26px;
  scrollbar-width: thin;
  scrollbar-color: var(--teal) var(--mist);
}
.table-scroll table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  font-size: 14px;
  text-align: left;
  line-height: 1.65;
}
.table-scroll :is(th, td) {
  padding: 16px 18px;
  vertical-align: top;
  border-bottom: 1px solid var(--line);
  min-width: 110px;
}
.table-scroll th {
  font-weight: 600;
}
.table-scroll thead th {
  background: var(--mist);
  color: var(--navy);
  white-space: nowrap;
}
.table-scroll tr > :first-child {
  position: sticky;
  left: 0;
  background: #fbfdfc;
  z-index: 1;
  min-width: 125px;
}
.table-scroll thead tr > :first-child {
  background: var(--mist);
}
.table-scroll tbody tr:last-child > * {
  border-bottom: 0;
}
.table-scroll td {
  color: #465463;
}
.table-scroll td:has(.pending-fact) {
  min-width: 220px;
}
.timeline-step {
  position: relative;
  padding: 0 0 22px 60px;
  border-bottom: 1px solid var(--line);
  margin-block: 24px;
}
.timeline-step p {
  margin: 0;
}
.timeline-number {
  position: absolute;
  left: 0;
  top: 0;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid #bad3c9;
  border-radius: 50%;
  font-family: "IBM Plex Mono", monospace;
  color: var(--forest);
}
.download-content {
  background: #d9eee7;
  padding: 32px !important;
  border: 0;
  border-radius: 15px;
}
.tool-card {
  border: 1px solid var(--line);
  border-radius: 15px;
  margin-bottom: 54px;
  background: white;
  overflow: hidden;
}
#calculator {
  scroll-margin-top: 110px;
}
.emi-calculator-page .breadcrumbs,
.checker-page .breadcrumbs {
  max-width: 1120px;
}
.emi-focus-hero {
  padding-block: 42px 36px;
  border-bottom: 0;
}
.emi-focus-hero .shell,
.calculator-focus-shell > .shell {
  max-width: 1120px;
}
.emi-focus-hero h1 {
  max-width: 16ch;
}
.emi-focus-hero .intro-copy {
  max-width: 66ch;
  margin-top: 20px;
}
.calculator-focus-shell {
  padding-block: clamp(32px, 5vw, 64px);
  background: #f3f7f5;
  border-block: 1px solid var(--line);
}
.calculator-focus-shell .tool-card {
  margin: 0;
  border-color: #c9ddd5;
}
.calculator-focus-shell .tool-panel {
  padding: clamp(24px, 4vw, 42px);
}
.calculator-focus-shell .tool-grid {
  gap: clamp(28px, 5vw, 56px);
  grid-template-columns: minmax(0, 1fr) minmax(330px, 0.9fr);
}
.calculator-focus-shell .result-card {
  padding: 30px;
}
.calculator-focus-shell .result-number {
  font-size: clamp(36px, 4vw, 52px);
}
.tool-panel {
  padding: 30px;
}
.tool-panel h2 {
  font-size: 30px;
  scroll-margin-top: 115px;
}
.tool-panel > p {
  font-size: 14px;
  color: var(--muted);
}
.tool-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 28px;
  margin-top: 30px;
  align-items: start;
}
.tool-field {
  margin-bottom: 24px;
  min-width: 0;
}
.tool-field > label {
  display: block;
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 8px;
}
.input-box {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #9aada4;
  border-radius: 7px;
  padding: 0 12px;
  min-height: 52px;
  min-width: 0;
  background: white;
}
.input-box > span {
  font-size: 14px;
  color: var(--muted);
  flex-shrink: 0;
}
.input-box:focus-within {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}
.input-box:has([aria-invalid="true"]) {
  border-color: var(--error);
}
.input-box input {
  width: 100%;
  min-width: 0;
  min-height: 50px;
  font-family: "IBM Plex Mono", monospace;
  font-size: 18px;
  background: transparent;
  color: var(--navy);
  outline: none;
  border: 0;
  caret-color: var(--forest);
}
.prose .field-help {
  font-size: 12px;
  line-height: 1.65;
  color: var(--muted);
  margin-block: 8px 0;
}
.field-error {
  color: var(--error);
  font-size: 13px !important;
  line-height: 1.6;
  margin-block: 8px 0 !important;
}
.field-error:empty {
  display: none;
}
.range-ends {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-family: "IBM Plex Mono", monospace;
  font-size: 11px;
  color: var(--muted);
}
.tool-field .amount-range {
  width: 100%;
  margin-top: 6px;
}
.tenure-controls {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 10px;
}
.tenure-controls button {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 20px;
  color: var(--forest);
}
.tenure-controls button:hover {
  background: var(--mist);
}
.result-card {
  padding: 24px;
  background: #edf6f1;
  border-radius: 12px;
  min-width: 0;
}
.prose .result-card h3 {
  font-size: 16px;
  margin: 0 0 15px;
  letter-spacing: 0;
}
.prose .result-number {
  font-family: "IBM Plex Mono", monospace;
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.25;
  letter-spacing: -0.04em;
  margin: 0 0 24px;
  color: var(--forest);
}
.result-number > span {
  display: block;
  font:
    400 14px/1.6 "DM Sans",
    sans-serif;
  letter-spacing: 0;
  margin-top: 6px;
}
.result-details > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  justify-content: space-between;
  border-bottom: 1px solid #c7dcd1;
  padding-block: 12px;
  font-size: 13px;
}
.result-details dd {
  font-family: "IBM Plex Mono", monospace;
}
.result-note {
  font-size: 12px !important;
  color: #425d51;
  line-height: 1.75;
}
.result-card > .button {
  width: 100%;
  margin-top: 12px;
  gap: 8px;
  padding-inline: 12px;
}
.result-card p:has(a) {
  font-size: 13px;
  line-height: 1.7;
  margin-bottom: 0;
}
.split-bar {
  display: flex;
  height: 8px;
  background: #a0c7b6;
  margin-top: 24px;
  border-radius: 6px;
  overflow: hidden;
}
.split-bar > span {
  background: var(--forest);
  width: 91.8%;
}
.split-label {
  font-size: 11px;
  line-height: 1.7;
  color: #425d51;
}
.result-status {
  font-size: 13px;
  line-height: 1.6;
  color: var(--error);
}
.result-status:empty {
  display: none;
}
.result-card.is-stale {
  background: #f0f2f1;
}
.result-card.is-stale .result-number {
  color: #566473;
}
.schedule {
  margin-top: 28px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}
.schedule > summary {
  font-size: 14px;
  min-height: 44px;
  cursor: pointer;
  color: var(--forest);
  font-weight: 600;
  padding-block: 12px;
}
.schedule .table-scroll :is(td, th) {
  font-family: "IBM Plex Mono", monospace;
  font-size: 12px;
}
.schedule .table-scroll th {
  font-family: "DM Sans", sans-serif;
}

.question {
  padding-bottom: 24px;
  margin-top: 24px;
  border-bottom: 1px solid var(--line);
}
.question legend {
  font-size: 17px;
  font-weight: 600;
  line-height: 1.55;
}
.radio-options {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 14px;
}
.radio-options label {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 12px 16px;
  cursor: pointer;
  font-size: 14px;
}
.radio-options label:has(:checked) {
  border-color: var(--forest);
  background: var(--mist);
}
.radio-options input,
.consent input {
  accent-color: var(--forest);
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}
#check-result {
  margin-top: 28px;
}
.button:disabled {
  background: #e2e9e5;
  color: #52645a;
  cursor: not-allowed;
  transform: none;
}
.check-result {
  border-top: 1px solid var(--line);
  margin-top: 30px;
  padding-top: 8px;
}
.check-result h3 {
  font-size: 24px;
}
.phone-box {
  max-width: 360px;
}
.purpose-notice {
  margin-block: 30px;
}
.purpose-notice .notice {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
}
.purpose-notice p {
  font-size: 14px;
}
.consent {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-height: 44px;
  margin-block: 24px;
  font-size: 14px;
  cursor: pointer;
}
.consent input {
  margin-top: 5px;
}
.site-footer {
  --footer-accent: #5ad8c6;
  --footer-text: #d3dbe4;
  --footer-label: #93a4b7;
  --footer-rule: rgb(255 255 255 / 0.14);
  padding-block: 56px 28px;
  background: var(--navy);
  color: var(--footer-text);
  overflow: hidden;
}
.site-footer .shell > * + * {
  margin-top: 0;
}
.footer-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 24px 32px;
  padding-bottom: 32px;
}
.footer-brand a {
  display: flex;
  align-items: center;
  width: fit-content;
  min-height: 44px;
}
.footer-logo {
  width: 220px;
  height: auto;
}
.footer-slogan {
  margin-top: 14px;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: #fff;
}
.footer-slogan__accent {
  padding-inline: 2px;
  color: var(--footer-accent);
  background: linear-gradient(transparent 64%, rgb(90 216 198 / 0.22) 64%);
  white-space: nowrap;
}
.footer-slogan + .footer-tagline {
  margin-top: 4px;
}
.footer-tagline {
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.5;
  color: var(--footer-text);
}
.footer-help {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px 16px;
}
.footer-help__label {
  font-size: 15px;
  font-weight: 600;
  color: #fff;
}
.footer-help__cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding-inline: 20px;
  border: 1px solid rgb(255 255 255 / 0.7);
  border-radius: 6px;
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  transition:
    background-color 0.25s ease,
    color 0.25s ease,
    border-color 0.25s ease;
}
.footer-help__cta svg {
  transition: transform 0.25s ease;
}
.site-footer .footer-help__cta:hover,
.site-footer .footer-help__cta:focus-visible {
  background: #fff;
  border-color: #fff;
  color: var(--navy);
}
.footer-help__cta:hover svg,
.footer-help__cta:focus-visible svg {
  transform: translateX(4px);
}
.footer-social {
  display: flex;
  gap: 12px;
}
.footer-social__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border: 1px solid rgb(255 255 255 / 0.7);
  border-radius: 50%;
  color: #fff;
  transition:
    transform 0.25s ease,
    background-color 0.25s ease,
    color 0.25s ease,
    border-color 0.25s ease;
}
.site-footer .footer-social__link:hover,
.site-footer .footer-social__link:focus-visible {
  transform: translateY(-3px);
  background: var(--footer-accent);
  border-color: var(--footer-accent);
  color: var(--navy);
}
.footer-columns {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 32px;
  padding-block: 36px;
  border-top: 1px solid var(--footer-rule);
}
@media (min-width: 1024px) {
  .footer-columns:has(> nav[aria-label="Media Hub footer"]) {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 28px;
  }
}
.site-footer h2 {
  margin-bottom: 12px;
  font-size: 17px;
  font-weight: 700;
  color: #fff;
}
.site-footer .footer-link,
.footer-columns .pending-link {
  position: relative;
  display: flex;
  align-items: center;
  width: fit-content;
  min-height: 44px;
  font-size: 15px;
  line-height: 1.5;
}
.site-footer .footer-link,
.footer-legal__links a,
.footer-legal__links .pending-link {
  color: var(--footer-text);
}
.site-footer .pending-link {
  color: var(--footer-label);
}
.site-footer .footer-link,
.footer-legal__links a {
  text-decoration: underline;
  text-decoration-color: transparent;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
  transition:
    color 0.25s ease,
    text-decoration-color 0.25s ease;
}
.site-footer .footer-link:hover,
.footer-legal__links a:hover,
.site-footer .footer-link:focus-visible,
.footer-legal__links a:focus-visible {
  color: var(--footer-accent);
  text-decoration-color: currentColor;
}
.site-footer a:focus-visible {
  outline: 2px solid var(--footer-accent);
  outline-offset: 3px;
}
.footer-legal {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 24px 0;
  padding-block: 28px;
  border-top: 1px solid var(--footer-rule);
}
.footer-legal__group {
  padding-inline: 28px;
}
.footer-legal__group:first-child {
  padding-left: 0;
}
.footer-legal__group + .footer-legal__group {
  border-left: 1px solid var(--footer-rule);
}
.footer-legal__title {
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--footer-label);
}
.footer-legal__links {
  display: grid;
  grid-template-columns: repeat(2, max-content);
  gap: 0 28px;
}
.footer-legal__group:last-child .footer-legal__links {
  grid-template-columns: max-content;
}
.footer-legal__links a {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  min-height: 44px;
  font-size: 14px;
}
.footer-legal__links a svg {
  flex: none;
  transition: transform 0.25s ease;
}
.footer-legal__links a:hover svg,
.footer-legal__links a:focus-visible svg {
  transform: translate(2px, -2px);
}
.footer-bottom {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 0;
  padding-top: 24px;
  border-top: 1px solid var(--footer-rule);
  font-size: 13px;
  line-height: 1.8;
  color: var(--footer-text);
}
.footer-bottom__legal + .footer-bottom__legal {
  padding-left: 32px;
  border-left: 1px solid var(--footer-rule);
}
.site-footer.is-animated [data-footer-reveal] {
  opacity: 0;
  transform: translateY(18px);
  transition:
    opacity 0.6s ease,
    transform 0.6s ease;
  transition-delay: calc(var(--footer-step, 0) * 90ms);
}
.site-footer.is-animated.is-visible [data-footer-reveal] {
  opacity: 1;
  transform: none;
}
.site-footer .shell > :nth-child(2) {
  --footer-step: 1;
}
.site-footer .shell > :nth-child(3) {
  --footer-step: 2;
}
.site-footer .shell > :nth-child(4) {
  --footer-step: 3;
}
@media (max-width: 1023px) {
  .footer-columns {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .footer-legal {
    grid-template-columns: 1fr;
  }
  .footer-legal__group,
  .footer-legal__group:first-child {
    padding: 0;
  }
  .footer-legal__group + .footer-legal__group {
    padding-top: 20px;
    border-left: 0;
    border-top: 1px solid var(--footer-rule);
  }
}
@media (max-width: 767px) {
  .footer-top {
    align-items: flex-start;
    flex-direction: column;
  }
  .footer-bottom {
    grid-template-columns: 1fr;
  }
  .footer-bottom__legal + .footer-bottom__legal {
    padding-left: 0;
    border-left: 0;
  }
}
@media (max-width: 479px) {
  .footer-slogan {
    font-size: 21px;
  }
  .footer-legal__links {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (prefers-reduced-motion: reduce) {
  .site-footer *,
  .site-footer *::after {
    transition-duration: 0.01ms !important;
    transition-delay: 0s !important;
  }
}
.consumer-bar {
  display: none;
}
@media (min-width: 768px) {
  .home-page .consumer-bar {
    position: fixed;
    inset: auto 0 0;
    z-index: 35;
    display: grid;
    grid-template-columns: minmax(300px, 1.1fr) minmax(260px, 1fr) auto;
    align-items: center;
    gap: 36px;
    padding: 18px clamp(28px, 5vw, 80px);
    background: var(--navy);
    color: white;
    box-shadow: 0 -10px 34px rgba(23, 40, 62, 0.16);
  }
  .home-page .consumer-bar[hidden] {
    display: none;
  }
  .consumer-bar-offer {
    display: flex;
    align-items: center;
    gap: 22px;
    min-width: 0;
  }
  .consumer-bar-amount {
    flex-shrink: 0;
    font:
      700 clamp(25px, 2.4vw, 34px)/1.1 "IBM Plex Mono",
      monospace;
    letter-spacing: -0.04em;
    color: #81d4c9;
  }
  .consumer-bar-copy {
    min-width: 0;
  }
  .consumer-bar-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
  }
  .consumer-bar-reassurance {
    margin-top: 4px;
    color: #c3d4dc;
    font-size: 13px;
    line-height: 1.5;
  }
  .consumer-bar-disclaimer {
    max-width: 42ch;
    color: #c3d4dc;
    font-size: 12px;
    line-height: 1.6;
  }
  .home-page .consumer-bar > .button {
    min-height: 50px;
    white-space: nowrap;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .home-page .consumer-bar {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px 22px;
    padding: 16px 28px;
  }
  .consumer-bar-offer {
    gap: 16px;
  }
  .consumer-bar-amount {
    font-size: 26px;
  }
  .consumer-bar-title {
    font-size: 16px;
  }
  .consumer-bar-disclaimer {
    grid-column: 1;
    max-width: 54ch;
  }
  .home-page .consumer-bar > .button {
    grid-column: 2;
    grid-row: 1;
  }
}
@media (max-width: 767px) {
  .home-page .consumer-bar {
    position: fixed;
    inset: auto 0 0;
    z-index: 35;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 12px;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    background: var(--navy);
    color: white;
    box-shadow: 0 -8px 26px rgba(23, 40, 62, 0.16);
  }
  .home-page .consumer-bar[hidden] {
    display: none;
  }
  .consumer-bar-offer {
    grid-column: 1;
    display: block;
    min-width: 0;
  }
  .consumer-bar-amount {
    display: block;
    font:
      700 18px/1.1 "IBM Plex Mono",
      monospace;
    letter-spacing: -0.03em;
    color: #81d4c9;
  }
  .consumer-bar-title {
    margin-top: 3px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
  }
  .consumer-bar-reassurance {
    margin-top: 2px;
    color: #c3d4dc;
    font-size: 10px;
    line-height: 1.45;
  }
  .consumer-bar-disclaimer {
    grid-column: 1/-1;
    max-width: 66ch;
    color: #c3d4dc;
    font-size: 10px;
    line-height: 1.5;
  }
  .home-page .consumer-bar > .button {
    grid-column: 2;
    grid-row: 1;
    min-height: 46px;
    padding: 11px 14px;
    font-size: 12px;
    white-space: nowrap;
  }
  .home-page .site-footer {
    padding-bottom: 165px;
  }
}
@media (max-width: 359px) {
  .home-page .consumer-bar {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    padding-inline: 16px;
  }
  .consumer-bar-offer,
  .consumer-bar-disclaimer,
  .home-page .consumer-bar > .button {
    grid-column: 1;
  }
  .consumer-bar-amount {
    font-size: 17px;
    white-space: nowrap;
  }
  .home-page .consumer-bar > .button {
    grid-row: auto;
    width: 100%;
  }
}
.audience-doors {
  display: block;
  padding-bottom: 32px;
}
.audience-carousel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
}
.door {
  background: white;
  border: 1px solid var(--line);
  padding: 30px;
  border-radius: 15px;
}
.door h2 {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.3;
  max-width: 27ch;
  letter-spacing: -0.02em;
}
.door p {
  font-size: 14px;
  color: var(--muted);
  margin-top: 16px;
  max-width: 48ch;
}
.door .text-link,
.door > .pending-link {
  margin-top: 18px;
}
.door > .pending-link {
  font-size: 14px;
}
.lifecycle-line {
  color: var(--forest) !important;
  font-size: 12px !important;
}
.investor-door {
  font-size: 14px;
  margin-top: 28px;
}
.home-extra {
  margin-top: 28px;
}
.home-actions {
  display: flex;
  align-items: center;
  gap: 25px;
  flex-wrap: wrap;
  margin-top: 24px;
}
.hero :is(h1, h2, .hero-heading) span {
  display: block;
}
.home-page .prose h2.section-title {
  font-size: clamp(34px, 3.5vw, 46px);
  line-height: 1.13;
}
.home-page .prose > .table-scroll {
  margin-top: 30px;
}
.lender-band {
  background: var(--midnight);
  color: white;
}
.lender-band .prose :is(p, td) {
  color: #c3d4dc;
}
.lender-band .table-scroll :is(th, td) {
  background: var(--midnight);
  color: #c3d4dc;
  border-color: #405264;
}
.lender-band .table-scroll {
  border-color: #405264;
}
.lender-band .prose a {
  color: #a7c5ff;
}
.lender-band .pending-link {
  color: #b6c9e4;
}
.home-page .faq-answer p {
  margin: 0;
}
.audience-carousel-controls:not([hidden]) {
  display: none;
}
.audience-carousel-control,
.audience-carousel-dot {
  color: var(--forest);
  cursor: pointer;
}
.audience-carousel-control {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}
.audience-carousel-control:hover:not(:disabled) {
  background: var(--mist);
}
.audience-carousel-control svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.audience-carousel-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.audience-carousel-dot {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 6px;
}
.audience-carousel-dot > span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #9aada4;
}
.audience-carousel-dot[aria-current="true"] > span {
  width: 10px;
  height: 10px;
  background: var(--forest);
}
.audience-carousel-control:focus-visible,
.audience-carousel-dot:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 2px;
}
/* ---------- Segment cards ("Who can apply") ---------- */
/* Shared by Home #who-can-apply, /personal-loan #who-its-for, /personal-loan/eligibility #by-how-you-earn
   and the related-links block on the /personal-loan/for-* and /without-salary-slip segment pages. */
ul.segment-cards {
  list-style: none;
  margin: 28px 0 0;
  padding: 0;
  max-width: none;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
  gap: 16px;
}
ul.segment-cards > li {
  margin: 0;
}
.segment-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 24px 24px 22px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 15px;
}
.segment-card h3 {
  margin: 0 0 8px;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--navy);
}
.segment-card p {
  margin: 0 0 18px;
  max-width: none;
  font-size: 15px;
  line-height: 1.6;
  color: var(--muted);
}
.segment-card a {
  margin-top: auto;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
  color: var(--forest);
  text-decoration: none;
  text-underline-offset: 4px;
}
.segment-card a:hover {
  text-decoration-thickness: 2px;
}
/* ---------- Highlights: new to credit, zero cost to apply, credit infrastructure ---------- */
/* Shared by Home (hero lines, #why-borrow-with-rinn rows), /personal-loan, /personal-loan/eligibility #new-to-credit,
   the /personal-loan/for-* fact lists and /personal-loan/rates-and-charges. Markup is added by tools/lib/highlights.cjs. */
:is(.first-loan-mark, .zero-cost-mark, .credit-infra-mark) {
  font-weight: 600;
  color: var(--forest);
  background: linear-gradient(
    transparent 58%,
    color-mix(in srgb, var(--teal) 30%, transparent) 58%
  );
  padding-inline: 0.12em;
  border-radius: 2px;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.first-loan-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 11px;
  border-radius: 999px;
  background: var(--forest);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.first-loan-badge:before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--teal);
}
.first-loan-callout {
  margin-block: 28px;
  padding: 20px 24px;
  background: var(--teal-wash);
  border: 1px solid var(--teal-line);
  border-left: 4px solid var(--teal);
  border-radius: 12px;
}
.first-loan-callout > :is(h2, h3) {
  margin-top: 12px;
  color: var(--forest);
}
.first-loan-callout > :last-child {
  margin-bottom: 0;
}
tr:is(.first-loan-row, .zero-cost-row) > :is(th, td) {
  background: var(--teal-wash);
}
tr:is(.first-loan-row, .zero-cost-row) > th {
  border-left: 4px solid var(--teal);
  padding-left: 14px;
}
tr:is(.first-loan-row, .zero-cost-row) .first-loan-badge {
  margin-bottom: 6px;
}
.zero-cost-chip {
  display: inline-block;
  padding: 0 0.45em;
  border-radius: 7px;
  background: var(--forest);
  color: #fff;
  font-weight: 700;
  line-height: 1.35;
}
@media (min-width: 1024px) {
  .launch-header #mobile-menu {
    display: none !important;
  }
  .launch-header .menu-toggle {
    display: none;
  }
}
@media (max-width: 900px) {
  .audience-carousel {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .audience-carousel.is-carousel {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .audience-carousel.is-carousel::-webkit-scrollbar {
    display: none;
  }
  .audience-carousel.is-carousel > .door {
    flex: 0 0 100%;
    min-width: 0;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }
  .audience-carousel-controls:not([hidden]) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 16px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .audience-carousel.is-carousel {
    scroll-behavior: auto;
    scroll-snap-type: x proximity;
  }
}
@media (max-width: 1199px) {
  .desktop-nav {
    gap: 15px;
  }
  .header-row {
    gap: 18px;
  }
  .launch-header .logo-link img {
    width: 180px;
  }
  .header-cta {
    padding-inline: 16px;
    gap: 12px;
  }
  .reading-layout {
    gap: 36px;
    grid-template-columns: 180px minmax(0, 1fr);
  }
  .tool-grid {
    grid-template-columns: 1fr;
  }
  .result-number {
    font-size: 42px !important;
  }
}
@media (max-width: 1023px) {
  .desktop-nav {
    display: none;
  }
  .header-cta {
    margin-left: auto;
  }
  .launch-header .menu-toggle {
    display: flex;
  }
  .launch-header #mobile-menu {
    padding-top: 12px;
    padding-bottom: 22px;
    max-height: calc(100dvh - 90px);
    overflow: auto;
  }
  .mobile-menu .nav-group {
    border-top: 1px solid var(--line);
  }
  .mobile-menu .nav-group > summary {
    padding-block: 12px;
    min-height: 50px;
    font-size: 16px;
    justify-content: space-between;
  }
  .mobile-menu .nav-top-link {
    border-top: 1px solid var(--line);
    padding-block: 12px;
    min-height: 50px;
    font-size: 16px;
  }
  .mobile-menu .nav-dropdown {
    position: static;
    width: 100%;
    border: 0;
    padding: 0 12px 14px;
  }
  .mobile-menu .nav-dropdown a {
    border: 0;
    padding: 12px 0;
    min-height: 44px;
  }
  .mobile-menu .nav-dropdown .pending-link {
    padding: 12px 0;
  }
  .mobile-actions {
    position: sticky;
    bottom: -22px;
    background: white;
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 16px 0;
  }
  .mobile-menu .mobile-actions a {
    padding: 13px 18px;
  }
  .utility-strip > .shell > span {
    display: none;
  }
  .reading-layout {
    display: block;
    padding-block: 32px 60px;
  }
  .jump-nav {
    position: static;
    max-height: none;
    border-block: 1px solid var(--line);
    padding-block: 8px;
    margin-bottom: 40px;
  }
  .jump-nav > button {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .jump-nav > button:after {
    content: "+";
    font-size: 20px;
  }
  .jump-nav > button[aria-expanded="true"]:after {
    content: "−";
  }
  .jump-nav nav {
    padding-block: 10px;
    columns: 2;
  }
  .jump-nav nav > a {
    break-inside: avoid;
  }
  .tool-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .page-hero h1 {
    max-width: 23ch;
  }
}
@media (max-width: 767px) {
  .utility-strip {
    display: none;
  }
  .launch-header .header-row {
    min-height: 72px;
    height: auto !important;
  }
  .launch-header .logo-link img {
    width: 180px;
  }
  .review-notice {
    font-size: 12px;
  }
  .breadcrumbs {
    padding-top: 16px;
    font-size: 12px;
  }
  .page-hero {
    padding-block: 26px 38px;
  }
  .page-hero h1 {
    font-size: 42px;
  }
  .intro-copy {
    margin-top: 22px;
  }
  .intro-copy > p:first-child {
    font-size: 17px;
  }
  .reading-layout {
    padding-top: 24px;
  }
  .jump-nav nav {
    columns: 1;
  }
  .content-section {
    padding-bottom: 36px;
    margin-bottom: 36px;
  }
  .prose h2 {
    font-size: 30px;
  }
  .prose h3 {
    font-size: 21px;
  }
  .prose p {
    font-size: 15px;
    line-height: 1.8;
  }
  .content-action {
    display: block;
    margin-block: 18px !important;
  }
  .table-scroll :is(th, td) {
    padding: 13px 14px;
    font-size: 13px;
    min-width: 105px;
  }
  .table-scroll tr > :first-child {
    min-width: 110px;
  }
  .role-table table,
  .role-table tbody,
  .role-table tr,
  .role-table :is(th, td) {
    display: block;
    width: 100%;
  }
  .role-table thead {
    display: none;
  }
  .role-table tbody td:before {
    content: attr(data-label);
    display: block;
    font-weight: 700;
    font-size: 12px;
    margin-bottom: 6px;
    color: var(--forest);
  }
  .role-table tr > :first-child {
    position: static;
  }
  .role-table tr {
    border-bottom: 1px solid var(--line);
  }
  .role-table tbody td {
    border: 0;
  }
  .tool-card {
    margin-bottom: 38px;
    border-radius: 12px;
  }
  .tool-panel {
    padding: 22px;
  }
  .tool-panel h2 {
    font-size: 27px;
  }
  .tool-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .result-card {
    padding: 22px;
  }
  .prose .result-number {
    font-size: 40px;
  }
  .question legend {
    font-size: 16px;
  }
  .radio-options label {
    font-size: 13px;
    padding: 12px;
  }
  .purpose-notice .notice {
    padding: 0;
  }
  .footer-columns {
    grid-template-columns: 1fr 1fr;
    gap: 28px;
  }
  .site-footer {
    padding-bottom: 125px;
  }
  .consumer-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 35;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 20px calc(12px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
    background: white;
  }
  .consumer-bar > span {
    font-size: 11px;
    max-width: 135px;
    line-height: 1.55;
  }
  .consumer-bar > .button {
    min-height: 46px;
    padding: 12px 15px;
    font-size: 12px;
  }
  .audience-doors {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .door {
    padding: 26px;
  }
  .door h2 {
    font-size: 24px;
  }
  .hero :is(h1, h2, .hero-heading) {
    font-size: 45px;
  }
  .hero-grid {
    padding-top: 40px;
  }
  .lender-band .pending-fact {
    color: #44564f !important;
  }
  .timeline-step {
    padding-left: 50px;
  }
  .notice {
    padding: 18px;
  }
  .home-actions {
    gap: 14px;
  }
  .download-content {
    padding: 24px !important;
  }
}
@media (max-width: 767px) {
  .calculator-focus-shell .tool-grid {
    grid-template-columns: 1fr;
  }
  .calculator-focus-shell .result-card {
    padding: 22px;
  }
}
@media (max-width: 479px) {
  .launch-header .header-cta {
    display: none;
  }
  .launch-header .menu-toggle {
    margin-left: auto;
  }
  .tool-panel {
    padding: 20px 16px;
  }
  .page-hero h1 {
    font-size: 38px;
  }
  .footer-columns {
    gap: 18px;
  }
  .mobile-actions {
    flex-wrap: wrap;
  }
  .mobile-actions > .button {
    flex: 1;
  }
  .consumer-bar {
    padding-inline: 16px;
  }
  .result-card {
    padding: 20px;
  }
  .prose .result-number {
    font-size: 36px !important;
  }
  .hero :is(h1, h2, .hero-heading) {
    font-size: 42px;
  }
  .radio-options {
    gap: 9px;
  }
  .radio-options label {
    width: 100%;
  }
}
@media print {
  .utility-strip,
  .review-notice,
  .jump-nav,
  .consumer-bar,
  .site-footer {
    display: none !important;
  }
  .reading-layout {
    display: block;
    padding: 20px 0;
  }
  .content-section {
    break-inside: auto;
  }
  .table-scroll {
    overflow: visible;
  }
  .tool-panel[hidden] {
    display: block !important;
  }
  .schedule:not([open]) > * {
    display: block;
  }
  .result-card {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/* ---------- Hero explorer lines ---------- */
/* Used by the amount-explorer hero, which now sits at the top of /personal-loan: keep the product name intact, then give the promise two deliberate lines beside the amount explorer. */
.hero-title__product,
.hero-title__message {
  display: block;
}
.hero-title__desktop-break {
  display: none;
}
@media (min-width: 1024px) {
  .hero-grid {
    grid-template-columns: 1.15fr 0.85fr;
  }
  .hero :is(h1, h2, .hero-heading) {
    font-size: clamp(56px, 4.6vw, 68px);
    line-height: 1.02;
    letter-spacing: -0.04em;
  }
  .hero-title__product {
    white-space: nowrap;
  }
  .hero-title__desktop-break {
    display: inline;
  }
}

/* ---------- RBI directory guide ---------- */
/* partials/rbi-directory-guide.html, used on /legal/digital-lending-disclosures (section 3) and /safety (#rbi-directory):
   five steps beside an animated browser illustration (driven by launch.js).
   Base styles are the finished state; animations only run from .is-active, so reduced motion and no-JS both show a complete picture. */
.rbi-guide{--rbi-speed:.55;--rbi-ink:#17283e;--rbi-soft:#4d5f70;--rbi-mint:#e8f4f0;--rbi-line:#dce5e3;--ease:cubic-bezier(.22,1,.36,1);overflow:clip;margin:38px 0 8px;padding:34px 32px 30px;border-radius:20px;background:linear-gradient(180deg,#f4fbf9,#fbfdfc 60%)}
:is(.legal-page, .support-page) .content-section .rbi-guide>h3{margin:0 0 12px;max-width:34ch}
:is(.legal-page, .support-page) .rbi-guide__lead{margin:0 0 28px;max-width:70ch;color:var(--rbi-soft)}
.rbi-guide__stage{display:grid;grid-template-columns:minmax(0,1fr);gap:30px;align-items:start}
:is(.legal-page, .support-page) .rbi-guide .rbi-steps{display:grid;gap:0;margin:0;padding:0;list-style:none;max-width:none}
.rbi-step{position:relative;margin:0;padding:2px 0 26px 62px;min-height:44px}
.rbi-step:last-child{padding-bottom:0}
.rbi-step::before,.rbi-step::after{content:"";position:absolute;left:19px;top:46px;bottom:4px;width:2px;border-radius:2px;background:var(--teal-line)}
.rbi-step:last-child::before,.rbi-step:last-child::after{display:none}
.rbi-step::after{background:var(--forest);transform:scaleY(0);transform-origin:top;transition:transform calc(.7s*var(--rbi-speed,.55)) var(--ease)}
.rbi-step__n{position:absolute;left:0;top:0;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:2px solid var(--teal-line);background:#fff;color:var(--forest);font-weight:700;font-size:16px;transition:background-color calc(.35s*var(--rbi-speed,.55)) ease,color calc(.35s*var(--rbi-speed,.55)) ease,border-color calc(.35s*var(--rbi-speed,.55)) ease,box-shadow calc(.5s*var(--rbi-speed,.55)) ease}
.rbi-step__n>*{grid-area:1/1;transition:opacity calc(.25s*var(--rbi-speed,.55)) ease,transform calc(.45s*var(--rbi-speed,.55)) var(--ease)}
.rbi-step__n svg{opacity:0;transform:scale(.4)}
:is(.legal-page, .support-page) .rbi-guide .rbi-step h4{margin:0 0 6px;padding-top:7px;font-weight:700;color:var(--rbi-ink);font-size:18px;line-height:1.35;letter-spacing:-.01em}
:is(.legal-page, .support-page) .rbi-step p{margin:0;max-width:56ch;color:var(--rbi-soft);font-size:15.5px;line-height:1.7}
:is(.legal-page, .support-page) .rbi-step p+.rbi-step__list{margin-top:6px}
:is(.legal-page, .support-page) .rbi-guide .rbi-step__list{display:grid;gap:4px;margin:0;padding:0 0 0 1.1em;max-width:56ch;color:var(--rbi-soft)}
:is(.legal-page, .support-page) .rbi-step__list li{margin:0;font-size:15.5px;line-height:1.65}
.rbi-step strong{color:var(--rbi-ink)}
.rbi-step .pending-fact{margin-top:8px}
.rbi-guide.is-ready .rbi-step{cursor:pointer}
.rbi-step.is-active .rbi-step__n{background:var(--forest);border-color:var(--forest);color:#fff;box-shadow:0 0 0 6px rgba(42,168,155,.2)}
.rbi-step.is-done .rbi-step__n{background:var(--teal-tint);border-color:var(--teal);color:var(--forest)}
.rbi-step.is-done .rbi-step__n b{opacity:0;transform:scale(.4)}
.rbi-step.is-done .rbi-step__n svg{opacity:1;transform:none}
.rbi-step.is-done::after{transform:scaleY(1)}
.rbi-step.is-active h4{color:var(--forest)}

.rbi-visual{position:relative;min-width:0}
.rbi-visual::before{content:"";position:absolute;z-index:0;top:-40px;right:-56px;width:230px;aspect-ratio:1;border-radius:50%;border:1.5px solid var(--teal-line);pointer-events:none}
.rbi-screen{position:relative;z-index:1;overflow:hidden;border:1px solid var(--rbi-line);border-radius:16px;background:#fff;box-shadow:0 26px 44px -30px rgba(23,40,62,.42)}
.rbi-screen__bar{display:flex;align-items:center;gap:12px;padding:11px 14px;border-bottom:1px solid var(--rbi-line);background:#f6faf9}
.rbi-screen__dots{display:flex;gap:5px}
.rbi-screen__dots i{width:9px;height:9px;border-radius:50%;background:#d3dedb}
.rbi-screen__url{display:flex;align-items:center;gap:7px;flex:1;min-width:0;padding:6px 12px;border-radius:99px;background:#fff;border:1px solid var(--rbi-line);color:var(--rbi-soft);font-size:12.5px;line-height:1.2}
.rbi-screen__url svg{flex:none;color:var(--forest)}
.rbi-screen__type{display:inline-block}
.rbi-screen__url b{color:var(--rbi-ink);font-weight:700}
.rbi-screen__body{position:relative;height:344px}
.rbi-scene{position:absolute;inset:0;display:flex;flex-direction:column;gap:14px;padding:16px 18px;opacity:0;visibility:hidden;transition:opacity calc(.4s*var(--rbi-speed,.55)) ease,visibility calc(0s*var(--rbi-speed,.55)) calc(.4s*var(--rbi-speed,.55))}
.rbi-scene.is-active{opacity:1;visibility:visible;transition-delay:calc(0s*var(--rbi-speed,.55))}
.rbi-guide:not(.is-ready) .rbi-visual{display:none}
.sk{display:block;width:var(--w,100%);height:8px;border-radius:4px;background:#e2ebe9}
.rbi-sk-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid var(--rbi-line)}
.rbi-sk-head>span{display:flex;gap:10px}
.rbi-sk-foot{display:grid;gap:8px;margin-top:auto}
.rbi-addr{display:grid;justify-items:center;gap:10px;margin:auto 0;padding:22px 16px;border-radius:14px;background:var(--teal-wash);border:1px solid var(--teal-line);text-align:center}
:is(.legal-page, .support-page) .rbi-addr p{margin:0;max-width:none;line-height:1.4}
:is(.legal-page, .support-page) .rbi-addr .rbi-addr__cap{color:var(--rbi-soft);font-size:12.5px}
:is(.legal-page, .support-page) .rbi-addr .rbi-addr__url{display:flex;flex-wrap:wrap;justify-content:center;font-size:clamp(20px,2.4vw,26px);line-height:1.2;letter-spacing:-.02em;color:#6b7c88}
.rbi-addr__url strong{color:var(--rbi-ink);font-weight:700;background:linear-gradient(var(--teal),var(--teal)) 0 100%/100% 3px no-repeat;padding-bottom:3px}
:is(.legal-page, .support-page) .rbi-addr .rbi-addr__ok{display:inline-flex;align-items:center;gap:6px;padding:5px 12px 5px 9px;border-radius:99px;background:var(--forest);color:#fff;font-size:13px;font-weight:700}
.rbi-tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;flex:1}
.rbi-tile{position:relative;display:flex;flex-direction:column;justify-content:center;gap:9px;padding:14px;border:1px solid var(--rbi-line);border-radius:12px;background:#fbfdfc}
.rbi-tile--hot{gap:5px;border-color:var(--teal);background:var(--teal-wash);color:var(--forest)}
.rbi-tile--hot strong{color:var(--rbi-ink);font-size:14.5px;line-height:1.25}
.rbi-tile--hot em{font-style:normal;color:var(--forest);font-size:12px;font-weight:700;line-height:1.35;text-decoration:underline;text-underline-offset:3px}
.rbi-cursor{position:absolute;right:16px;bottom:8px;filter:drop-shadow(0 3px 3px rgba(23,40,62,.25))}
.rbi-dir{display:grid;gap:4px}
:is(.legal-page, .support-page) .rbi-dir p{margin:0;max-width:none;line-height:1.4}
:is(.legal-page, .support-page) .rbi-dir .rbi-dir__title{color:var(--rbi-ink);font-size:17px;font-weight:700;line-height:1.25}
:is(.legal-page, .support-page) .rbi-dir .rbi-dir__sub{color:var(--rbi-soft);font-size:12px;line-height:1.4}
.rbi-table{display:grid;gap:6px;margin-top:8px}
.rbi-row{display:grid;grid-template-columns:1fr 1.3fr .9fr;align-items:center;gap:14px;padding:8px 12px;border:1px solid var(--rbi-line);border-radius:9px;background:#fff;transition:opacity calc(.4s*var(--rbi-speed,.55)) ease,background-color calc(.4s*var(--rbi-speed,.55)) ease,border-color calc(.4s*var(--rbi-speed,.55)) ease}
.rbi-row--head{background:var(--mist);border-color:transparent}
.rbi-row--head .sk{background:#cddcd8}
.rbi-search{display:flex;align-items:center;gap:9px;padding:11px 14px;border:1.5px solid var(--forest);border-radius:11px;color:var(--forest);font-size:15px;box-shadow:0 0 0 4px rgba(42,168,155,.16)}
.rbi-search__typed{color:var(--rbi-ink);font-weight:600}
.rbi-search__caret{width:2px;height:18px;margin-left:-7px;background:var(--forest)}
:is(.legal-page, .support-page) .rbi-screen .rbi-chip{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;max-width:100%;margin:0;padding:6px 12px;border-radius:99px;background:var(--rbi-mint);border:1px solid var(--teal-line);color:var(--forest);font-size:12px;font-weight:700;line-height:1.35}
.rbi-chip svg{flex:none}
.rbi-row--dim{opacity:.38}
.rbi-row--hit{border-color:var(--teal);background:var(--teal-wash)}
.rbi-row--hit .sk{background:#9fd6cd}
:is(.legal-page, .support-page) .rbi-guide .rbi-checks{display:grid;gap:10px;margin:auto 0 0;padding:0;list-style:none;max-width:none}
.rbi-checks li{display:flex;align-items:center;gap:12px;margin:0;padding:11px 14px;border:1px solid var(--rbi-line);border-radius:12px;background:#fff}
.rbi-checks__tick{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--forest);color:#fff}
.rbi-checks li>span:last-child{display:grid;gap:1px}
.rbi-checks strong{color:var(--rbi-ink);font-size:14px;line-height:1.3}
.rbi-checks small{color:var(--rbi-soft);font-size:12px;line-height:1.35}
.rbi-note{display:flex;align-items:center;gap:8px;margin:auto 0 0!important;max-width:none!important;padding:9px 12px;border-radius:10px;background:var(--rbi-mint);color:var(--forest);font-size:12.5px!important;font-weight:700;line-height:1.4!important}
.rbi-note svg{flex:none}
:is(.legal-page, .support-page) .rbi-visual__cap{margin:12px 0 0;max-width:none;color:var(--rbi-soft);font-size:13px;line-height:1.5;text-align:center}
.rbi-guide__foot{display:grid;gap:16px;margin-top:30px;padding-top:24px;border-top:1px solid var(--rbi-line)}
:is(.legal-page, .support-page) .rbi-guide__foot p{margin:0;max-width:72ch}
:is(.legal-page, .support-page) .rbi-guide .rbi-guide__cta{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:10px 22px;border-radius:10px;background:var(--forest);color:#fff;font-weight:700;text-decoration:none;transition:background-color calc(.2s*var(--rbi-speed,.55)) ease}
:is(.legal-page, .support-page) .rbi-guide .rbi-guide__cta:hover{background:#0b4836;color:#fff}
.rbi-guide__cta:focus-visible{outline:3px solid #2563eb;outline-offset:3px}
:is(.legal-page, .support-page) .rbi-guide__note{color:var(--rbi-soft);font-size:15px;line-height:1.7}
.rbi-guide__note strong{color:var(--rbi-ink)}
:is(.legal-page, .support-page) .rbi-guide .external{display:inline-flex;align-items:baseline;gap:4px}
.rbi-guide .legal-ext{align-self:center;flex:none}
.rbi-controls{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:14px}
.rbi-controls button{display:grid;place-items:center;min-width:44px;min-height:44px;padding:0;border:0;background:transparent;color:var(--forest);cursor:pointer}
.rbi-controls button:focus-visible{outline:3px solid #2563eb;outline-offset:-3px;border-radius:10px}
.rbi-controls .rbi-dot::before{content:"";display:block;width:28px;height:10px;border-radius:99px;background:var(--teal-line);transform:scaleX(.36);transition:transform calc(.4s*var(--rbi-speed,.55)) var(--ease),background-color calc(.3s*var(--rbi-speed,.55)) ease}
.rbi-controls .rbi-dot[aria-current=step]::before{transform:none;background:var(--forest)}
.rbi-controls .rbi-play{margin-left:6px;border-radius:50%}
.rbi-controls .rbi-play:hover{background:var(--rbi-mint)}
.rbi-play svg:last-child,.rbi-play[aria-pressed=false] svg:first-child{display:none}
.rbi-play[aria-pressed=false] svg:last-child{display:block}

/* Scene animations: each starts from an offset state and settles into the base styles above. */
.rbi-scene.is-active .rbi-addr{animation:rbi-rise calc(.7s*var(--rbi-speed,.55)) var(--ease) both}
.rbi-scene.is-active .rbi-addr__url strong{animation:rbi-underline calc(.9s*var(--rbi-speed,.55)) var(--ease) calc(.5s*var(--rbi-speed,.55)) both}
.rbi-scene.is-active .rbi-addr__ok{animation:rbi-pop calc(.55s*var(--rbi-speed,.55)) var(--ease) calc(1.25s*var(--rbi-speed,.55)) both}
.rbi-scene.is-active .rbi-tile{animation:rbi-rise calc(.6s*var(--rbi-speed,.55)) var(--ease) both}
.rbi-scene.is-active .rbi-tile:nth-child(2){animation-delay:calc(.08s*var(--rbi-speed,.55))}
.rbi-scene.is-active .rbi-tile:nth-child(3){animation-delay:calc(.16s*var(--rbi-speed,.55))}
.rbi-scene.is-active .rbi-tile:nth-child(4){animation-delay:calc(.24s*var(--rbi-speed,.55))}
.rbi-scene.is-active .rbi-tile--hot{animation:rbi-rise calc(.6s*var(--rbi-speed,.55)) var(--ease) calc(.16s*var(--rbi-speed,.55)) both,rbi-glow calc(1.6s*var(--rbi-speed,.55)) ease-in-out calc(1.2s*var(--rbi-speed,.55)) 2}
.rbi-scene.is-active .rbi-cursor{animation:rbi-cursor calc(1.5s*var(--rbi-speed,.55)) var(--ease) calc(.5s*var(--rbi-speed,.55)) both}
.rbi-scene.is-active .rbi-dir>*{animation:rbi-rise calc(.6s*var(--rbi-speed,.55)) var(--ease) both}
.rbi-scene.is-active .rbi-row{animation:rbi-rise calc(.55s*var(--rbi-speed,.55)) var(--ease) both}
.rbi-scene.is-active .rbi-row:nth-child(2){animation-delay:calc(.12s*var(--rbi-speed,.55))}
.rbi-scene.is-active .rbi-row:nth-child(3){animation-delay:calc(.2s*var(--rbi-speed,.55))}
.rbi-scene.is-active .rbi-row:nth-child(4){animation-delay:calc(.28s*var(--rbi-speed,.55))}
.rbi-scene.is-active .rbi-row:nth-child(5){animation-delay:calc(.36s*var(--rbi-speed,.55))}
.rbi-scene.is-active .rbi-search__typed{display:inline-block;animation:rbi-type calc(.8s*var(--rbi-speed,.55)) steps(4) calc(.35s*var(--rbi-speed,.55)) both}
.rbi-scene.is-active .rbi-search__caret{animation:rbi-blink calc(1s*var(--rbi-speed,.55)) steps(2) infinite}
.rbi-scene.is-active .rbi-chip{animation:rbi-pop calc(.55s*var(--rbi-speed,.55)) var(--ease) calc(1.3s*var(--rbi-speed,.55)) both}
.rbi-scene.is-active .rbi-row--dim{animation:rbi-dim calc(.7s*var(--rbi-speed,.55)) ease calc(1.6s*var(--rbi-speed,.55)) both}
.rbi-scene.is-active .rbi-checks li{animation:rbi-rise calc(.55s*var(--rbi-speed,.55)) var(--ease) both}
.rbi-scene.is-active .rbi-checks li:nth-child(2){animation-delay:calc(.45s*var(--rbi-speed,.55))}
.rbi-scene.is-active .rbi-checks li:nth-child(3){animation-delay:calc(.9s*var(--rbi-speed,.55))}
.rbi-scene.is-active .rbi-checks__tick{animation:rbi-pop calc(.5s*var(--rbi-speed,.55)) var(--ease) both}
.rbi-scene.is-active .rbi-checks li:nth-child(2) .rbi-checks__tick{animation-delay:calc(.6s*var(--rbi-speed,.55))}
.rbi-scene.is-active .rbi-checks li:nth-child(3) .rbi-checks__tick{animation-delay:calc(1.05s*var(--rbi-speed,.55))}
.rbi-scene.is-active .rbi-checks li:nth-child(1) .rbi-checks__tick{animation-delay:calc(.15s*var(--rbi-speed,.55))}
.rbi-scene.is-active .rbi-note{animation:rbi-rise calc(.6s*var(--rbi-speed,.55)) var(--ease) calc(1.5s*var(--rbi-speed,.55)) both}
.rbi-screen.is-typing .rbi-screen__type{animation:rbi-url calc(1.1s*var(--rbi-speed,.55)) steps(22) calc(.1s*var(--rbi-speed,.55)) both}
@keyframes rbi-rise{from{opacity:0;transform:translateY(12px)}}
@keyframes rbi-pop{from{opacity:0;transform:scale(.6)}}
@keyframes rbi-underline{from{background-size:0 3px}}
@keyframes rbi-type{from{width:0}to{width:3.2ch}}
@keyframes rbi-blink{50%{opacity:0}}
@keyframes rbi-dim{from{opacity:1}}
@keyframes rbi-url{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes rbi-glow{50%{box-shadow:0 0 0 7px rgba(42,168,155,.22)}}
@keyframes rbi-cursor{from{opacity:0;transform:translate(120px,70px)}25%{opacity:1}75%{transform:translate(0,0) scale(1)}85%{transform:translate(0,0) scale(.82)}to{transform:translate(0,0) scale(1)}}

@media(min-width:1180px){
  .rbi-guide.is-ready .rbi-guide__stage{grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:44px}
  .rbi-visual{position:sticky;top:120px}
}
@media(max-width:1179px){.rbi-visual{order:-1;max-width:520px;margin-inline:auto;width:100%}}
@media(max-width:767px){
  .rbi-guide{padding:24px 18px 22px;border-radius:16px}
  .rbi-step{padding-left:54px}
  .rbi-step__n{width:36px;height:36px;font-size:15px}
  .rbi-step::before,.rbi-step::after{left:17px;top:42px}
  .rbi-screen__body{height:344px}
  .rbi-guide__cta{width:100%;justify-content:center;text-align:center}
}
@media(prefers-reduced-motion:reduce){
  .rbi-step::after,.rbi-step__n,.rbi-step__n>*,.rbi-scene,.rbi-row,.rbi-controls .rbi-dot::before{transition:none}
  .rbi-scene *,.rbi-screen *{animation:none!important}
}

/* ---------- OTP step ---------- */
/* The code entry panel on /tools/eligibility-checker and /delete-account. Built by window.rinnOtp (otp.js), which hides the
   page's form while the panel shows. */
form[data-otp-waiting]{display:none!important}
.otp-step{container-type:inline-size;display:grid;gap:14px;padding:clamp(20px,3vw,28px);border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--navy)}
.otp-step__title{margin:0;color:var(--navy);font-size:22px;line-height:1.25}
.otp-step__title:focus{outline:0}
.otp-step__lead{margin:0;color:var(--muted,#566473);font-size:15.5px;line-height:1.6}
.otp-step__label{margin-bottom:-6px;font-size:15px;font-weight:700}
.otp-step__row{display:grid;gap:14px}
.otp-step__input{width:100%;min-height:56px;padding:0 16px;border:1.5px solid #7b8d99;border-radius:12px;background:#fff;color:var(--navy);font:inherit;font-size:22px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:.32em}
.otp-step__input:focus-visible{border-color:var(--forest);outline:3px solid var(--blue,#2563eb);outline-offset:2px}
.otp-step__input[aria-invalid="true"]{border-color:var(--error,#9a3029)}
.otp-step__input:disabled{opacity:.55;cursor:not-allowed}
.otp-step__error{margin:0;color:var(--error,#9a3029);font-size:14px;font-weight:600;line-height:1.45}
.otp-step__error[hidden]{display:none}
.otp-step__submit{min-height:56px;padding-inline:30px;white-space:nowrap}
.otp-step__submit:disabled{cursor:progress;opacity:.8}
.otp-step__links{display:flex;flex-wrap:wrap;gap:4px 24px}
.otp-step__link{min-height:44px;padding:0;border:0;background:none;color:var(--forest);font:inherit;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.otp-step__link:disabled{color:var(--muted,#566473);opacity:.55;text-decoration:none;cursor:not-allowed}
/* The panel's own width decides, because it is narrow beside the "What to expect" card on tablets. */
@container (min-width:420px){
  .otp-step__row{grid-template-columns:200px auto;justify-content:start}
}

/* ---------- Form success panel ---------- */
/* The thank-you state every form shows once the server confirms receipt: complaints (/contact, /grievance-redressal),
   partnership enquiries (/partners), account deletion (/delete-account) and the eligibility checker. Built by
   window.rinnFormSuccess in launch.js, or written as static markup with the same classes; launch.js also wires the
   reference Copy button. The tick draws itself once; reduced motion shows it drawn. */
.form-success{position:relative;padding:clamp(22px,3vw,32px);border:1px solid var(--teal-line);border-radius:16px;background:linear-gradient(180deg,#f1faf7,#fff 72%);color:var(--navy);animation:form-success-in .5s cubic-bezier(.22,1,.36,1) both}
.form-success[hidden],.form-success [hidden]{display:none!important}
.form-success:focus{outline:none}
.form-success:focus-visible{outline:3px solid #2563eb;outline-offset:4px}
.form-success__icon{display:block;width:56px;height:56px;margin-bottom:18px}
.form-success__icon svg{display:block;width:100%;height:100%;fill:none;stroke-linecap:round;stroke-linejoin:round}
.form-success__ring{fill:#d9f0ea;stroke:var(--teal);stroke-width:2.5;stroke-dasharray:151;stroke-dashoffset:151;animation:form-success-draw .6s ease-out .15s forwards}
.form-success__tick{stroke:var(--forest);stroke-width:4;stroke-dasharray:34;stroke-dashoffset:34;animation:form-success-draw .35s ease-out .65s forwards}
.form-success .form-success__title{margin:0;color:var(--navy);font-size:clamp(22px,2.4vw,28px);font-weight:700;line-height:1.2;letter-spacing:-.02em}
.form-success .form-success__lead{max-width:none;margin:8px 0 0;color:#40546a;font-size:17px;line-height:1.55}
.form-success__ref{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin:20px 0 0;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:#fff}
.form-success__ref-label{flex-basis:100%;color:#566473;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.form-success__ref-code{margin-right:auto;color:var(--forest);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:clamp(17px,2vw,20px);font-weight:700;letter-spacing:.04em;overflow-wrap:anywhere}
.form-success__copy{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:6px 12px;border:1px solid var(--teal-line);border-radius:8px;background:var(--teal-tint);color:var(--forest);font:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:background-color .2s}
.form-success__copy:hover{background:#d9f0ea}
.form-success__copy:focus-visible{outline:3px solid #2563eb;outline-offset:2px}
.form-success__copy svg,.form-success__note svg{flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.form-success__copy svg{width:16px;height:16px}
.form-success .form-success__steps-title{margin:22px 0 0;color:var(--navy);font-size:15px;font-weight:700;line-height:1.4}
.form-success .form-success__steps{display:grid;gap:10px;max-width:none;margin:10px 0 0;padding:0;list-style:none;counter-reset:form-step}
.form-success .form-success__steps li{position:relative;margin:0;padding-left:36px;color:#2b3f55;font-size:15.5px;line-height:1.55}
.form-success .form-success__steps li::before{counter-increment:form-step;content:counter(form-step);position:absolute;left:0;top:0;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--teal-tint);color:var(--forest);font-size:13px;font-weight:700}
.form-success .form-success__note{display:flex;max-width:none;align-items:flex-start;gap:10px;margin:18px 0 0;padding-top:16px;border-top:1px solid var(--line);color:#566473;font-size:14.5px;line-height:1.55}
.form-success__note svg{width:20px;height:20px;margin-top:1px;color:var(--forest)}
.form-success__actions{margin-top:22px}
@keyframes form-success-in{from{opacity:0;transform:translateY(12px)}}
@keyframes form-success-draw{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){
  .form-success,.form-success *{animation:none!important}
  .form-success__ring,.form-success__tick{stroke-dashoffset:0}
}
