/* Badri.rent — investor + tenant pages. Loads after landing.css and reuses its tokens. */

.section--soft { background: var(--soft); }
.section--ink { background: var(--ink); color: #fff; }
.section__head { max-width: 860px; margin: 0 auto 48px; text-align: center; }
.section__head .eyebrow { margin-bottom: 14px; }
.section__head .section__lead { margin-top: 16px; color: var(--muted); }
.section--ink .section__lead { color: rgba(255,255,255,.65); }
.eyebrow--blue { color: var(--blue); font-weight: 700; }
.fine { margin-top: 18px; font-size: 13px; color: var(--muted); }
.section--ink .fine { color: rgba(255,255,255,.5); }
.num { direction: ltr; unicode-bidi: isolate; }

/* ---------- Page hero ---------- */
.phero { position: relative; overflow: hidden; background: var(--blue); color: #fff; }
.phero__inner { display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; gap: 56px; padding-block: 80px 88px; }
.phero__title { font-size: clamp(40px, 5.4vw, 64px); line-height: 1.12; font-weight: 800; letter-spacing: -.035em; }
.phero__lead { max-width: 620px; margin-top: 18px; font-size: clamp(17px, 1.6vw, 20px); color: rgba(255,255,255,.82); }
.phero .eyebrow { margin-bottom: 16px; color: var(--lime); font-weight: 700; }
.phero .hero__ctas { margin-top: 32px; }
.phero--mint { background: var(--mint); color: var(--ink); }
.phero--mint .phero__lead { color: var(--ink-2); }
.phero--mint .eyebrow { color: var(--blue); }

.raise { padding: 30px; border-radius: 28px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.16); backdrop-filter: blur(8px); }
.raise__label { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.72); }
.raise__amount { margin-top: 4px; font-size: clamp(48px, 6vw, 72px); font-weight: 800; letter-spacing: -.04em; line-height: 1.05; color: var(--lime); }
.raise__use { margin-top: 6px; color: rgba(255,255,255,.82); }
.raise__stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 24px 0 0; }
.raise__stats div { padding: 14px 16px; border-radius: 16px; background: rgba(14,15,12,.22); }
.raise__stats dt { font-size: 12.5px; color: rgba(255,255,255,.72); }
.raise__stats dd { margin: 4px 0 0; font-size: 22px; font-weight: 800; }
.raise__note { margin-top: 16px; font-size: 12.5px; color: rgba(255,255,255,.6); }

.phero__phone { position: relative; justify-self: center; width: min(300px, 100%); }
.phero__phone .phone { border: 8px solid #000; border-radius: 44px; overflow: hidden; background: #fff; box-shadow: 0 40px 80px -30px rgba(14,15,12,.45); transform: rotate(3deg); }
html[dir="rtl"] .phero__phone .phone { transform: rotate(-3deg); }
.phero__phone .phone img { width: 100%; }
.phero__float { position: absolute; width: 120px; inset-inline-start: -70px; bottom: 60px; transform: rotate(-10deg); filter: drop-shadow(0 18px 24px rgba(0,0,0,.18)); }

/* ---------- Problem (deck 2) ---------- */
.problem { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; gap: 20px; }
.problem__card { padding: 30px 28px; border-radius: 24px; background: var(--soft); }
.problem__card h3 { font-size: 21px; font-weight: 800; }
.problem__card p { margin-top: 8px; color: var(--muted); }
.problem__stat { display: grid; place-items: center; align-content: center; min-width: 260px; padding: 30px; border-radius: 24px; background: var(--ink); color: #fff; text-align: center; }
.problem__stat b { font-size: 72px; font-weight: 800; line-height: 1; letter-spacing: -.04em; color: var(--lime); }
.problem__stat span { max-width: 200px; margin-top: 10px; color: rgba(255,255,255,.72); }

/* ---------- 4 steps (deck 3) ---------- */
.steps--4 { grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 0; }
.steps--4 .step { height: 500px; border-radius: 40px; padding-inline: 18px; }
.steps--4 .step h3 { font-size: 20px; }
.steps--4 .step p { font-size: 15.5px; }
.steps--4 .step__phone { width: 230px; height: 300px; border-width: 5px; border-radius: 28px 28px 0 0; }
.step--hl { background: var(--lime); }

/* ---------- Market (deck 4) ---------- */
.market { display: grid; grid-template-columns: 1fr 1.1fr; align-items: center; gap: 56px; }
.funnel { position: relative; aspect-ratio: 1; width: min(460px, 100%); justify-self: center; }
.funnel__ring { position: absolute; left: 50%; bottom: 0; display: flex; flex-direction: column; align-items: center; padding-top: 12%; border-radius: 50%; transform: translateX(-50%); text-align: center; }
.funnel__ring b { font-size: clamp(24px, 3vw, 34px); font-weight: 800; letter-spacing: -.02em; }
.funnel__ring span { max-width: 70%; font-size: 14px; font-weight: 600; }
.funnel__ring--1 { width: 100%; height: 100%; padding-top: 9%; background: #E3E9FF; color: var(--ink); }
.funnel__ring--2 { width: 72%; height: 72%; background: #B8C6FF; color: var(--ink); }
.funnel__ring--3 { width: 44%; height: 44%; padding-top: 11%; background: var(--blue); color: #fff; }
.funnel__ring--3 span { font-size: 12.5px; }
.bars h3 { margin-bottom: 22px; font-size: 22px; font-weight: 800; line-height: 1.3; }
.bar-row { display: grid; grid-template-columns: minmax(180px, 1.1fr) 1.4fr 56px; align-items: center; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.bar-row:last-of-type { border-bottom: 0; }
.bar-row b { display: block; font-size: 16px; }
.bar-row small { display: block; font-size: 13px; color: var(--muted); }
.bar-row__bar { height: 30px; width: var(--w); border-radius: 8px; background: var(--lime-600); transform-origin: left; animation: grow 1s ease both; }
html[dir="rtl"] .bar-row__bar { transform-origin: right; }
.bar-row__bar--muted { background: #D7DACF; }
.bar-row em { font-style: normal; font-size: 18px; font-weight: 800; color: var(--ink-2); direction: ltr; text-align: end; }
@keyframes grow { from { transform: scaleX(0); } }

/* ---------- Contract + vocabulary (deck 5) ---------- */
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.card { padding: 32px; border-radius: 28px; background: var(--soft); }
.card h3 { font-size: 22px; font-weight: 800; }
.card--lime { background: var(--lime); }
.card--dark { background: var(--ink); color: #fff; }
.card .checks { margin: 20px 0 0; }
.vocab { display: grid; gap: 0; margin: 18px 0 0; }
.vocab div { display: grid; grid-template-columns: 180px 1fr; gap: 16px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.vocab div:last-child { border-bottom: 0; }
.vocab dt { font-weight: 800; color: var(--lime); }
.vocab dd { margin: 0; color: rgba(255,255,255,.78); }

/* ---------- Pricing tiers (deck 6) ---------- */
.tiers { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.tier { position: relative; padding: 26px 22px; border-radius: 24px; background: #fff; border: 1.5px solid var(--line); }
.tier--on { background: var(--lime); border-color: var(--lime-600); }
.tier b { display: block; font-size: 40px; font-weight: 800; letter-spacing: -.03em; line-height: 1.1; }
.tier__len { display: block; margin-top: 2px; font-weight: 700; }
.tier__cap { display: block; margin-top: 14px; font-size: 14px; color: var(--ink-2); }
.tier__tag { position: absolute; top: 18px; inset-inline-end: 18px; padding: 3px 10px; border-radius: 999px; background: var(--soft); border: 1px solid var(--line); font-size: 12px; font-weight: 700; color: var(--muted); }
.tier--on .tier__tag { background: var(--ink); border-color: var(--ink); color: var(--lime); }
.strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; }
.strip div { padding: 20px 22px; border-radius: 20px; background: var(--soft); }
.strip strong { display: block; font-size: 18px; font-weight: 800; }
.strip span { display: block; margin-top: 4px; font-size: 14.5px; color: var(--muted); }

/* ---------- Unit economics (deck 7) ---------- */
.econ { display: grid; grid-template-columns: 1.25fr 1fr; gap: 24px; align-items: start; }
.table { width: 100%; border-collapse: separate; border-spacing: 0; overflow: hidden; border-radius: 20px; border: 1px solid var(--line); font-size: 16px; }
.table th { padding: 14px 20px; background: var(--lime); text-align: start; font-weight: 800; }
.table td { padding: 14px 20px; border-top: 1px solid var(--line); }
.table td:last-child, .table th:last-child { text-align: end; font-weight: 700; }
.table tbody tr:nth-child(odd) td { background: var(--soft); }
.table tr.is-strong td { background: var(--mint) !important; font-weight: 800; }
.table--open td:last-child { font-weight: 600; text-align: start; }
.table--open th:last-child { text-align: start; }
.kpis { display: grid; gap: 16px; }
.kpi { padding: 28px; border-radius: 24px; }
.kpi b { display: block; font-size: clamp(44px, 5vw, 60px); font-weight: 800; letter-spacing: -.04em; line-height: 1.05; direction: ltr; text-align: start; }
html[dir="rtl"] .kpi b { text-align: right; }
.kpi span { display: block; margin-top: 8px; font-weight: 600; }
.kpi--lime { background: #F1FBD2; }
.kpi--blue { background: #E3E9FF; }

/* ---------- Simulator (dark, reuses .calc__card) ---------- */
.sim__row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.sim__input { width: 100%; margin-top: 12px; padding: 15px 16px; border-radius: 14px; border: 1px solid var(--dark-line); background: var(--ink); color: #fff; font: 800 20px var(--font); outline: none; }
.sim__input:focus { border-color: var(--lime); }
html[dir="rtl"] .sim__input { text-align: right; }
.sim__val { float: inline-end; color: var(--lime); font-weight: 800; }
.money-input .money-input__cur:first-child { font-size: 26px; color: rgba(255,255,255,.5); }
.seg--2 { grid-template-columns: 1fr 1fr; }
.seg__txt { font-size: 16px !important; }
.calc__big.is-neg { color: #C52A2F; }
.sim__fx { margin-bottom: 22px; }
.sim__fxTitle { margin-bottom: 8px; font-weight: 700; font-size: 14px; color: var(--muted); }
.fxtable { width: 100%; border-collapse: collapse; font-size: 14px; }
.fxtable th { padding: 8px 0; text-align: start; font-weight: 600; color: var(--muted); border-bottom: 1px solid var(--line); }
.fxtable td { padding: 8px 0; border-bottom: 1px solid var(--line); font-weight: 700; }
.fxtable th:not(:first-child), .fxtable td:not(:first-child) { text-align: end; }
.fxtable td.is-neg { color: #C52A2F; }
.calc__fine { margin-top: 14px; font-size: 12.5px; color: var(--muted); }

/* ---------- Bank comparison (deck 8) ---------- */
.compare { display: grid; grid-template-columns: 1.3fr 1fr; gap: 40px; align-items: center; }
.compare .bar-row { grid-template-columns: minmax(170px, 1fr) 1.3fr 104px; }
.compare .bar-row em { white-space: nowrap; }
.notes { display: grid; gap: 16px; }
.note { padding: 26px 28px; border-radius: 24px; background: #F1FBD2; }
.note h3 { font-size: 20px; font-weight: 800; }
.note p { margin-top: 6px; color: var(--ink-2); }

/* ---------- Qualify + tiers (deck 9) ---------- */
.qual { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; }
.qual .card--lime { padding: 36px; }
.houses { display: grid; grid-template-columns: repeat(3, 1fr); align-items: end; gap: 16px; }
.house { display: flex; flex-direction: column; gap: 10px; }
.house__shape { display: grid; place-items: center; height: var(--h); clip-path: polygon(0 28%, 50% 0, 100% 28%, 100% 100%, 0 100%); border-radius: 0 0 12px 12px; background: #E9EDFF; }
.house:nth-child(2) .house__shape { background: #D2DBFF; }
.house:nth-child(3) .house__shape { background: var(--blue); }
.house__shape .bolt { width: 34px; height: 46px; color: var(--lime); }
.house b { font-size: 17px; font-weight: 800; }
.houses__note { grid-column: 1 / -1; margin-top: 8px; font-weight: 600; color: var(--ink-2); }

/* ---------- Collections timeline (deck 10) ---------- */
.pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 36px; }
.pill { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 999px; background: #fff; border: 1.5px solid var(--line); font-weight: 700; }
.pill img { width: 26px; height: 26px; object-fit: contain; }
.timeline { list-style: none; display: grid; grid-template-columns: repeat(var(--n, 5), 1fr); gap: 0; margin: 0; padding: 0; counter-reset: tl; }
.tl { position: relative; padding: 0 10px; text-align: center; }
.tl::before { content: ""; position: absolute; top: 20px; inset-inline: 0; height: 3px; background: var(--line); }
.tl:first-child::before { inset-inline-start: 50%; }
.tl:last-child::before { inset-inline-end: 50%; }
.tl b { position: relative; display: inline-grid; place-items: center; min-width: 76px; height: 42px; padding: 0 14px; border-radius: 999px; background: var(--lime); font-weight: 800; direction: ltr; }
.tl:nth-child(n+3) b { background: #FFE8A3; }
.tl:nth-child(5) b { background: var(--ink); color: #fff; }
.tl span { display: block; max-width: 180px; margin: 12px auto 0; font-size: 14.5px; color: var(--ink-2); }
.callout { display: flex; gap: 18px; align-items: flex-start; max-width: 860px; margin: 40px auto 0; padding: 22px 26px; border-radius: 22px; background: var(--ink); color: #fff; }
.callout strong { flex: none; padding: 6px 14px; border-radius: 999px; background: var(--lime); color: var(--ink); font-size: 14px; }
.callout p { color: rgba(255,255,255,.82); }

/* ---------- Tenant leaves (deck 11) ---------- */
.flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1.2fr; align-items: center; gap: 14px; }
.flow__arrow { font-size: 26px; font-weight: 800; color: var(--muted); }
html[dir="rtl"] .flow__arrow { transform: scaleX(-1); }
.flow__card { padding: 22px; border-radius: 22px; background: var(--soft); }
.flow__card small { display: block; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--blue); }
.flow__card strong { display: block; font-size: 18px; font-weight: 800; }
.flow__card p { margin-top: 6px; color: var(--ink-2); }
.flow__card--lime { background: var(--lime); }
.flow__card--lime small { color: var(--ink); }
.flow__split { display: grid; gap: 12px; }
.flow__card--ok { background: var(--mint); border: 1.5px solid #CFEFD0; }
.flow__card--warn { background: #FFF1F1; border: 1.5px solid #F6D3D3; }

/* ---------- Investor form ---------- */
.choice__sm { font-size: 14px !important; font-family: var(--font) !important; }
.pq__consent + .pq__consent { margin-top: -6px; }
.footer__inner--legal > p:not(.footer__copy) { max-width: 760px; font-size: 13px; }

/* ---------- Tenant page ---------- */
.same { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.same .card h2 { font-size: 26px; font-weight: 800; letter-spacing: -.02em; }
.arrows { list-style: none; display: grid; gap: 14px; margin: 20px 0 0; padding: 0; }
.arrows li { position: relative; padding-inline-start: 36px; font-weight: 600; color: #fff; }
.arrows li::before { content: "→"; position: absolute; inset-inline-start: 0; top: -1px; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--lime); color: var(--ink); font-size: 13px; font-weight: 800; }
html[dir="rtl"] .arrows li::before { content: "←"; }

/* Why pay through Badri (tenant) */
.use--static:hover { transform: none; box-shadow: none; }
.why__note { margin-top: 24px; text-align: center; font-size: 14px; color: var(--muted); }

.paycards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.paycard { padding: 28px 26px; border-radius: 24px; background: #fff; border: 1.5px solid var(--line); transition: transform .2s, box-shadow .2s; }
.paycard:hover { transform: translateY(-3px); box-shadow: 0 20px 34px -26px rgba(0,0,0,.35); }
.paycard img { height: 72px; width: auto; }
.paycard h3 { margin-top: 14px; font-size: 21px; font-weight: 800; }
.paycard ol { display: grid; gap: 10px; margin: 16px 0 0; padding: 0; list-style: none; counter-reset: s; }
.paycard li { position: relative; padding-inline-start: 34px; font-size: 15px; color: var(--ink-2); counter-increment: s; }
.paycard li::before { content: counter(s); position: absolute; inset-inline-start: 0; top: 0; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--lime); color: var(--ink); font-size: 12px; font-weight: 800; }
.refcode { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 20px; padding: 24px 28px; border-radius: 24px; background: var(--ink); color: #fff; }
.refcode strong { font-size: 18px; }
.refcode p { margin-top: 4px; max-width: 640px; color: rgba(255,255,255,.7); }
.refcode code { flex: none; padding: 12px 18px; border-radius: 14px; background: var(--lime); color: var(--ink); font: 800 20px/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .04em; }

.safe { display: grid; grid-template-columns: .9fr 1.1fr; gap: 48px; align-items: start; }
.safe__ill { width: 92px; margin-bottom: 12px; }
.safe__list { list-style: none; display: grid; gap: 12px; margin: 0; padding: 0; }
.safe__list li { padding: 20px 22px; border-radius: 20px; background: #fff; border: 1.5px solid var(--line); }
.safe__list b { display: block; font-size: 17px; }
.safe__list span { display: block; margin-top: 4px; color: var(--muted); }
.eyebrow--red { color: #C52A2F; font-weight: 700; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .steps--4 { grid-template-columns: repeat(2, 1fr); }
  .problem { grid-template-columns: 1fr 1fr; }
  .problem__stat { grid-column: 1 / -1; grid-row: 1; min-width: 0; }
}
@media (max-width: 960px) {
  .phero__inner, .market, .duo, .econ, .compare, .qual, .same, .safe { grid-template-columns: 1fr; }
  .phero__inner { gap: 40px; padding-block: 56px 64px; }
  .tiers { grid-template-columns: repeat(2, 1fr); }
  .strip, .paycards { grid-template-columns: 1fr; }
  .flow { grid-template-columns: 1fr; }
  .flow__arrow { transform: rotate(90deg); justify-self: center; }
  html[dir="rtl"] .flow__arrow { transform: rotate(90deg); }
  .timeline { grid-template-columns: 1fr; gap: 14px; }
  .tl { display: flex; align-items: center; gap: 14px; text-align: start; padding: 0; }
  .tl::before { display: none; }
  .tl span { margin: 0; max-width: none; }
  .phero__float { display: none; }
}
@media (max-width: 720px) {
  .problem, .steps--4 { grid-template-columns: 1fr; }
  .steps--4 { max-width: 400px; margin-inline: auto; }
  .bar-row, .compare .bar-row { grid-template-columns: 1fr 64px; gap: 6px 12px; }
  .bar-row > div:first-child { grid-column: 1 / -1; }
  .bar-row__bar { height: 22px; }
  .vocab div { grid-template-columns: 1fr; gap: 2px; }
  .raise__stats { grid-template-columns: 1fr; }
  .tiers { grid-template-columns: 1fr 1fr; gap: 10px; }
  .tier { padding: 20px 16px; }
  .tier b { font-size: 32px; }
  .tier__tag { position: static; display: inline-block; margin-top: 10px; }
  .sim__row { grid-template-columns: 1fr; }
  .card, .qual .card--lime { padding: 24px; }
  .table { font-size: 14.5px; }
  .table th, .table td { padding: 12px 14px; }
  .refcode { flex-direction: column; align-items: flex-start; }
  .callout { flex-direction: column; }
  .section__head { margin-bottom: 32px; }
}

/* Polish */
.section__title, .phero__title, .apply__title { text-wrap: balance; }
.phero__phone .phone { aspect-ratio: 462 / 820; }
.phero__phone .phone img { height: 100%; object-fit: cover; object-position: top; }

/* ---------- Business page ---------- */
.biz__checks { max-width: 900px; margin-inline: auto; }
.biz__diff .use h3 { margin-top: 0; }