:root {
  --fanr-blue: #16407f;
  --fanr-blue-2: #2d6fd2;
  --fanr-cyan: #00aeef;
  --fanr-green: #39b54a;
  --fanr-yellow: #ffd200;
  --fanr-ink: #0e2a5c;
  --fanr-muted: #5e7290;
  --fanr-line: #e5ebf4;
  --fanr-soft: #edf2f9;
  --fanr-card: #ffffff;
  --fanr-success: #1f9d66;
  --fanr-error: #c9504f;
  --fanr-grad: linear-gradient(135deg, #16407f 0%, #2d6fd2 100%);
  --fanr-accent: linear-gradient(135deg, #00aeef, #39b54a 55%, #ffd200);
  --fanr-shadow: 0 6px 24px rgba(14, 42, 92, .07);
  --icon-blueprint: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 3h13a3 3 0 0 1 3 3v15H7a3 3 0 0 1-3-3V3Zm3 2v13a1 1 0 0 0 1 1h10V6a1 1 0 0 0-1-1H7Zm2 3h7v2H9V8Zm0 4h5v2H9v-2Z'/%3E%3C/svg%3E");
  --icon-target: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M11 2h2v3.08A7 7 0 0 1 18.92 11H22v2h-3.08A7 7 0 0 1 13 18.92V22h-2v-3.08A7 7 0 0 1 5.08 13H2v-2h3.08A7 7 0 0 1 11 5.08V2Zm1 5a5 5 0 1 0 0 10 5 5 0 0 0 0-10Zm0 3a2 2 0 1 1 0 4 2 2 0 0 1 0-4Z'/%3E%3C/svg%3E");
  --icon-board: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 3h10v3h3v15H4V6h3V3Zm2 2v3h6V5H9Zm-3 5v9h12v-9H6Zm2 2h8v2H8v-2Zm0 4h6v2H8v-2Z'/%3E%3C/svg%3E");
  --icon-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='m12 2 2.95 6.08 6.7.92-4.86 4.66 1.18 6.64L12 17.1l-5.97 3.2 1.18-6.64L2.35 9l6.7-.92L12 2Z'/%3E%3C/svg%3E");
  --icon-card: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 5h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2Zm0 4h16V7H4v2Zm2 5v2h5v-2H6Z'/%3E%3C/svg%3E");
  --icon-receipt: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 3h14v18l-2-1.2-2 1.2-2-1.2-2 1.2-2-1.2-2 1.2V3Zm3 5h8V6H8v2Zm0 4h8v-2H8v2Zm0 4h5v-2H8v2Z'/%3E%3C/svg%3E");
  --icon-lock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 10V8a5 5 0 0 1 10 0v2h2v11H5V10h2Zm2 0h6V8a3 3 0 0 0-6 0v2Zm2 4v3h2v-3h-2Z'/%3E%3C/svg%3E");
  --icon-scale: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M11 3h2v3h7v2h-2.1l3.1 6h-8l3.1-6H13v11h4v2H7v-2h4V8H7.9l3.1 6H3l3.1-6H4V6h7V3ZM6.3 12h1.4L7 10.6 6.3 12Zm10 0h1.4l-.7-1.4-.7 1.4Z'/%3E%3C/svg%3E");
  --icon-landmark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3 3 8v2h18V8l-9-5ZM5 12h2v6H5v-6Zm4 0h2v6H9v-6Zm4 0h2v6h-2v-6Zm4 0h2v6h-2v-6ZM3 20h18v2H3v-2Z'/%3E%3C/svg%3E");
  --icon-crane: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 20h7V8H4V6h16v2h-7v12h7v2H4v-2Zm2-10h3v2H6v-2Zm0 4h3v2H6v-2Zm9-4h3v2h-3v-2Zm0 4h3v2h-3v-2ZM6 2h12v2H6V2Z'/%3E%3C/svg%3E");
  --icon-design: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 11h10a4 4 0 0 1 4 4v4h2v2H3v-2h2v-8Zm2 2v6h10v-4a2 2 0 0 0-2-2H7Zm2-10h2v6H9V3Zm4 0h2v6h-2V3Z'/%3E%3C/svg%3E");
  --icon-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a7 7 0 0 1 7 7c0 5.2-7 13-7 13S5 14.2 5 9a7 7 0 0 1 7-7Zm0 4a3 3 0 1 0 0 6 3 3 0 0 0 0-6Z'/%3E%3C/svg%3E");
  --icon-calculator: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6 3h12v18H6V3Zm2 2v4h8V5H8Zm0 6v2h2v-2H8Zm4 0v2h2v-2h-2Zm4 0v2h-2v2h2v-4Zm-8 4v2h2v-2H8Zm4 0v2h2v-2h-2Zm-4 4h8v-2H8v2Z'/%3E%3C/svg%3E");
  --icon-safety: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 2h6v4l2 2v13H7V8l2-2V2Zm2 2v3h2V4h-2Zm-2 6v9h6v-9H9Zm1 2h4v2h-4v-2Z'/%3E%3C/svg%3E");
  --icon-brick: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 5h18v14H3V5Zm2 2v4h6V7H5Zm8 0v4h6V7h-6ZM5 13v4h4v-4H5Zm6 0v4h8v-4h-8Z'/%3E%3C/svg%3E");
  --icon-tool: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M20.7 7.3a5 5 0 0 1-6.2 6.2l-7.1 7.1a2 2 0 0 1-2.8-2.8l7.1-7.1a5 5 0 0 1 6.2-6.2l-3.1 3.1 2.3 2.3 3.6-2.6Z'/%3E%3C/svg%3E");
  --icon-paint: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 3h12a4 4 0 0 1 0 8H9a2 2 0 0 0 0 4h1v6H6v-6h1a4 4 0 0 1 0-8h9a2 2 0 0 0 0-4H4V3Z'/%3E%3C/svg%3E");
  --icon-handshake: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 7h4l2 2 2-2h2l4 4-5 6a3 3 0 0 1-4.2.4L10 16l-1 1a3 3 0 0 1-4.2 0L3 15V9l4-2Zm1 2-3 2v3.2l1.2 1.2a1 1 0 0 0 1.4 0l2.4-2.4 3 2.8a1 1 0 0 0 1.4-.1L18.3 11 16 9h-.2L13 11.8 10.2 9H8Z'/%3E%3C/svg%3E");
  --icon-folder: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 6h7l2 2h9v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6Zm2 4v8h14v-8H5Z'/%3E%3C/svg%3E");
  --icon-building: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 3h14v18H5V3Zm3 3v2h2V6H8Zm4 0v2h2V6h-2Zm4 0v2h1V6h-1Zm-8 4v2h2v-2H8Zm4 0v2h2v-2h-2Zm4 0v2h1v-2h-1Zm-8 4v5h3v-5H8Zm5 0v5h4v-5h-4Z'/%3E%3C/svg%3E");
  --icon-user: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3a5 5 0 1 1 0 10 5 5 0 0 1 0-10Zm0 12c4.4 0 8 2.2 8 5v1H4v-1c0-2.8 3.6-5 8-5Z'/%3E%3C/svg%3E");
  --icon-phone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6.6 2h4l1.6 5-2.4 1.8a12 12 0 0 0 5.4 5.4l1.8-2.4 5 1.6v4A3.6 3.6 0 0 1 18.4 22C9.3 22 2 14.7 2 5.6A3.6 3.6 0 0 1 6.6 2Z'/%3E%3C/svg%3E");
  --icon-whatsapp: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a9.5 9.5 0 0 1 8 14.6L21 22l-5.5-1.4A9.5 9.5 0 0 1 2.5 7.4 9.5 9.5 0 0 1 12 2Zm0 2a7.5 7.5 0 0 0-6.4 11.4l.3.5-.6 3 3-.8.5.3A7.5 7.5 0 1 0 12 4Zm-3.1 4.2c.2 0 .4 0 .6.4l.8 1.8c.1.3 0 .5-.1.7l-.5.6c.5 1 1.4 1.9 2.4 2.5l.7-.8c.2-.2.5-.2.7-.1l1.8.9c.3.1.4.3.4.6 0 .8-.7 1.7-1.5 1.8-1.3.2-3.1-.6-4.5-2s-2.2-3.1-2-4.5c.1-.8 1-1.5 1.7-1.5Z'/%3E%3C/svg%3E");
  --icon-email: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 5h18v14H3V5Zm2.7 2 6.3 5 6.3-5H5.7ZM5 9.1V17h14V9.1l-7 5.5-7-5.5Z'/%3E%3C/svg%3E");
}

/* Retire the legacy application wizard wherever the old markup still exists. */
.wizard-overlay {
  display: none !important;
}

body {
  background: #f6f8fb;
  color: #22324e;
}

body.fanr-revamped > section.hero,
body.fanr-revamped > section.services,
body.fanr-revamped > section.vision,
body.fanr-revamped > section.about,
body.fanr-revamped > section.how-it-works,
body.fanr-revamped > section.faq,
body.fanr-revamped > section.contact,
body.fanr-revamped > footer.footer {
  display: none !important;
}

.navbar {
  background: rgba(255, 255, 255, .92) !important;
  border-bottom: 1px solid var(--fanr-line) !important;
  backdrop-filter: blur(10px);
  box-shadow: none !important;
}

.nav-link {
  color: #3d5170 !important;
  font-weight: 700;
}

.nav-link:hover {
  color: var(--fanr-blue) !important;
}

.btn-primary,
.provider-btn-primary,
.pf-next,
.pf-submit,
.pf-app {
  background: var(--fanr-grad) !important;
  border: 0 !important;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(22, 64, 127, .28);
}

.btn-primary:hover,
.provider-btn-primary:hover,
.pf-next:hover,
.pf-submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(22, 64, 127, .34);
}

.btn-secondary,
.provider-btn-secondary,
.pf-back {
  border: 1.5px solid #c9d9ee !important;
  background: #fff !important;
  color: var(--fanr-blue) !important;
  box-shadow: none !important;
}

.hero {
  background: var(--fanr-grad) !important;
  border-radius: 0 0 32px 32px;
  overflow: hidden;
}

.hero::after {
  content: "";
  position: absolute;
  inset-inline-start: -120px;
  top: -120px;
  width: 340px;
  height: 340px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.12), transparent 70%);
}

.section-title,
.story-title,
.vision-title,
.service-title,
.faq h2,
.contact h3,
.footer h3 {
  color: var(--fanr-ink) !important;
}

.section-description,
.story-subtitle,
.story-description,
.service-description,
.vision-description,
.contact-description,
.contact-subtitle {
  color: var(--fanr-muted) !important;
}

.services,
.vision,
.about,
.how-it-works,
.faq,
.contact {
  background: #f6f8fb;
}

.service-card,
.vision-item,
.faq-item,
.contact-details,
.provider-card,
.provider-panel,
.pf-modal {
  border: 1px solid var(--fanr-line) !important;
  border-radius: 16px !important;
  box-shadow: var(--fanr-shadow) !important;
}

.service-icon-wrapper,
.step-number,
.vision-number,
.provider-stat b {
  color: var(--fanr-blue) !important;
}

.contact-action:hover,
.provider-card:hover,
.service-card:hover {
  border-color: #c9d9ee !important;
  transform: translateY(-2px);
}

.footer {
  background: var(--fanr-ink) !important;
}

.fanr-shell {
  padding-top: 66px;
}

.fanr-home-hero {
  position: relative;
  overflow: hidden;
  padding: 82px 24px 70px;
  color: #fff;
  background:
    linear-gradient(135deg, rgba(22, 64, 127, .94), rgba(45, 111, 210, .86)),
    url("../assets/images/hero-residential-scene.png") center/cover no-repeat;
  border-radius: 0 0 32px 32px;
}

.fanr-home-hero::after {
  content: "";
  position: absolute;
  inset-inline-start: -120px;
  top: -120px;
  width: 340px;
  height: 340px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.12), transparent 70%);
}

.fanr-home-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(440px, 1.08fr);
  gap: 54px;
  align-items: center;
  width: min(1120px, 100%);
  margin: 0 auto;
}

.fanr-home-hero h1 {
  max-width: 620px;
  margin: 0 0 16px;
  color: #fff;
  font-size: clamp(34px, 4.6vw, 54px);
  line-height: 1.12;
  letter-spacing: 0;
}

.fanr-home-hero h1 em {
  font-style: normal;
  background: var(--fanr-accent);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.fanr-home-hero p {
  max-width: 560px;
  color: #d7e5f8;
  font-size: 16px;
  line-height: 1.72;
}

.fanr-home-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.fanr-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 26px;
  color: #c6d8f2;
  font-size: 12px;
}

.fanr-proof b {
  display: block;
  color: #fff;
  font-size: 16px;
}

.fanr-mock {
  width: min(520px, 100%);
  max-width: none;
  margin-inline-start: auto;
  padding: 28px;
  border-radius: 24px;
  background: #fff;
  color: #22324e;
  box-shadow: 0 24px 60px rgba(7, 25, 58, .35);
}

.fanr-mock-head {
  display: flex;
  gap: 14px;
  align-items: center;
  padding-bottom: 18px;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--fanr-line);
}

.fanr-mock-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: var(--fanr-accent);
}

.fanr-mock-icon::before {
  content: "";
  width: 25px;
  height: 25px;
  background: var(--fanr-ink);
  -webkit-mask: var(--icon-blueprint) center / contain no-repeat;
  mask: var(--icon-blueprint) center / contain no-repeat;
}

.fanr-mock-head b {
  display: block;
  color: var(--fanr-ink);
  font-size: 17px;
}

.fanr-mock-head small {
  color: var(--fanr-muted);
}

.fanr-mock .chips {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: 18px;
}

.fanr-mock .chip {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 11px;
  border-radius: 999px;
  background: var(--fanr-soft);
  color: var(--fanr-blue);
  font-size: 12px;
  font-weight: 800;
}

.fanr-mock .chip.hl {
  background: rgba(31, 157, 102, .12);
  color: var(--fanr-success);
}

.fanr-mock-status {
  margin-inline-start: auto;
  padding: 3px 10px;
  border-radius: 999px;
  background: #e8f8ee;
  color: #1e8e47;
  font-size: 11px;
  font-weight: 800;
}

.fanr-mock-row {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 12px 0;
  color: var(--fanr-muted);
  font-size: 15px;
}

.fanr-mock-row b {
  color: var(--fanr-ink);
  text-align: end;
}

.fanr-footer-lite {
  padding: 46px 24px 26px;
  background: var(--fanr-ink);
  color: #c6d8f2;
}

.fanr-footer-lite a {
  color: #fff;
  font-weight: 800;
}

.fanr-footer-grid {
  width: min(1120px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(180px, .7fr) minmax(220px, .8fr);
  gap: 34px;
}

.fanr-footer-logo {
  width: 146px;
  max-width: 100%;
  margin-bottom: 16px;
  filter: brightness(0) invert(1);
}

.fanr-footer-lite p {
  max-width: 520px;
  margin: 0;
  color: #c6d8f2;
  line-height: 1.8;
}

.fanr-footer-lite h3 {
  margin: 0 0 14px;
  color: #fff;
  font-size: 15px;
}

.fanr-footer-lite a {
  display: flex;
  align-items: center;
  gap: 9px;
  width: fit-content;
  margin: 10px 0;
  text-decoration: none;
}

.fanr-footer-lite a:hover {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.fanr-footer-bottom {
  width: min(1120px, 100%);
  margin: 34px auto 0;
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, .14);
  display: flex;
  justify-content: space-between;
  gap: 18px;
  color: #9db5d2;
  font-size: 13px;
}

.fanr-pathways {
  padding: 78px 24px;
  background:
    radial-gradient(circle at 10% 0%, rgba(0,174,239,.12), transparent 30%),
    radial-gradient(circle at 90% 10%, rgba(57,181,74,.10), transparent 28%),
    #fff;
}

.fanr-pathways h2 {
  max-width: 820px;
  margin: 0 0 26px;
  color: var(--fanr-ink);
  font-size: 38px;
  line-height: 1.25;
}

.fanr-path-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.fanr-path-card {
  position: relative;
  overflow: hidden;
  min-height: 360px;
  border: 1px solid var(--fanr-line);
  border-radius: 22px;
  padding: 30px;
  background: #fff;
  box-shadow: var(--fanr-shadow);
}

.fanr-path-card::after {
  content: "";
  position: absolute;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  inset-inline-end: -80px;
  bottom: -90px;
  background: radial-gradient(circle, rgba(45,111,210,.14), transparent 68%);
}

.fanr-path-card.provider {
  background: var(--fanr-grad);
  color: #fff;
}

.fanr-path-card.provider h3,
.fanr-path-card.provider p,
.fanr-path-card.provider li {
  color: #fff;
}

.fanr-path-card.provider .provider-checklist li::before {
  background: var(--fanr-accent);
}

.fanr-path-label {
  display: inline-flex;
  margin-bottom: 18px;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--fanr-soft);
  color: var(--fanr-blue);
  font-size: 12px;
  font-weight: 900;
}

.fanr-path-card.provider .fanr-path-label {
  background: rgba(255,255,255,.14);
  color: #fff;
}

.fanr-path-card h3 {
  max-width: 520px;
  margin: 0 0 10px;
  color: var(--fanr-ink);
  font-size: 28px;
  line-height: 1.25;
}

.fanr-path-card p {
  max-width: 560px;
  color: var(--fanr-muted);
}

.fanr-path-card .provider-btn {
  position: relative;
  z-index: 1;
  margin-top: 20px;
  background: #fff !important;
  color: var(--fanr-blue) !important;
}

.fanr-owner-download {
  position: relative;
  z-index: 1;
  display: inline-flex;
  margin-top: 16px;
  color: var(--fanr-blue);
  font-weight: 300;
  text-decoration: underline;
  text-underline-offset: 5px;
}

.fanr-owner-download:hover {
  color: var(--fanr-blue-2);
}

.fanr-command {
  padding: 84px 24px;
  background:
    linear-gradient(135deg, rgba(14,42,92,.98), rgba(22,64,127,.94)),
    url("../assets/images/why-choose-bg-why-bg.png") center/cover no-repeat;
  color: #fff;
}

.fanr-command-grid {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(320px, 1.08fr);
  gap: 38px;
  align-items: center;
}

.fanr-command h2 {
  max-width: 620px;
  margin: 0 0 14px;
  color: #fff;
  font-size: 40px;
  line-height: 1.22;
}

.fanr-command p {
  max-width: 600px;
  color: #d7e5f8;
  line-height: 1.85;
}

.fanr-command-points {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 24px;
}

.fanr-command-points span {
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}

.fanr-board {
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 22px;
  padding: 18px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 28px 80px rgba(0,0,0,.28);
  color: var(--fanr-ink);
}

.fanr-board-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 12px 18px;
  border-bottom: 1px solid var(--fanr-line);
}

.fanr-board-head span {
  color: var(--fanr-muted);
  font-size: 13px;
}

.fanr-board-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-top: 10px;
  padding: 16px;
  border: 1px solid var(--fanr-line);
  border-radius: 16px;
  background: #fff;
}

.fanr-board-row span {
  color: var(--fanr-muted);
  font-size: 13px;
  font-weight: 800;
}

.fanr-board-row.done {
  background: #f2fbf5;
  border-color: #cbebd6;
}

.fanr-board-row.done span {
  color: #1e8e47;
}

.fanr-board-row.live {
  background: #f0f6fe;
  border-color: #c9d9ee;
  box-shadow: 0 10px 30px rgba(45,111,210,.12);
}

.fanr-board-row.live span {
  color: var(--fanr-blue);
}

.provider-link,
.provider-trigger {
  cursor: pointer;
}

.provider-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  padding: 5px 14px;
  border-radius: 999px;
  background: #e8f1fc;
  color: var(--fanr-blue-2);
  font-size: 12px;
  font-weight: 800;
}

.provider-eyebrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--fanr-accent);
}

.provider-hero {
  min-height: 100vh;
  padding: 130px 24px 72px;
  background:
    linear-gradient(135deg, rgba(22, 64, 127, .94), rgba(45, 111, 210, .86)),
    url("../assets/images/hero-residential-scene.png") center/cover no-repeat;
  color: #fff;
}

.provider-wrap {
  width: min(1180px, 100%);
  margin: 0 auto;
}

.provider-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
  gap: 42px;
  align-items: center;
}

.provider-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 999px;
  background: rgba(255, 255, 255, .12);
  font-size: 14px;
  font-weight: 700;
}

.provider-title {
  margin: 24px 0 16px;
  max-width: 760px;
  font-size: clamp(38px, 6vw, 72px);
  line-height: 1.02;
  letter-spacing: 0;
}

.provider-lead {
  max-width: 690px;
  color: rgba(255, 255, 255, .86);
  font-size: 18px;
  line-height: 1.8;
}

.provider-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 30px;
}

.provider-btn {
  border: 0;
  border-radius: 8px;
  padding: 14px 22px;
  font-weight: 800;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.ltr-number {
  direction: ltr;
  unicode-bidi: isolate;
  display: inline-block;
  white-space: nowrap;
}

.contact-icon {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  background: currentColor;
  -webkit-mask: var(--contact-icon) center / contain no-repeat;
  mask: var(--contact-icon) center / contain no-repeat;
}

.icon-phone { --contact-icon: var(--icon-phone); }
.icon-whatsapp { --contact-icon: var(--icon-whatsapp); }
.icon-email { --contact-icon: var(--icon-email); }

.provider-btn-primary {
  background: #fff;
  color: var(--fanr-blue);
}

.provider-btn-secondary {
  background: rgba(255, 255, 255, .12);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .32);
}

.provider-panel {
  background: rgba(255, 255, 255, .96);
  color: var(--fanr-ink);
  border-radius: 16px;
  padding: 26px;
  box-shadow: 0 26px 70px rgba(0, 0, 0, .22);
}

.provider-panel h2 {
  margin: 0 0 16px;
  font-size: 24px;
}

.provider-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.provider-stat {
  border: 1px solid var(--fanr-line);
  border-radius: 16px;
  padding: 16px;
  background: var(--fanr-soft);
}

.provider-stat b {
  display: block;
  color: var(--fanr-blue);
  font-size: 28px;
  line-height: 1;
}

.provider-stat span {
  display: block;
  margin-top: 8px;
  color: var(--fanr-muted);
  font-size: 13px;
  line-height: 1.5;
}

.download-card,
.download-strip {
  display: flex;
  align-items: center;
  gap: 18px;
  border: 1px solid rgba(45, 111, 210, .20);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(246, 250, 255, .98)),
    #fff;
  box-shadow: 0 18px 48px rgba(14, 42, 92, .10);
}

.download-card {
  margin-top: 18px;
  padding: 16px;
}

.download-strip {
  max-width: 820px;
  margin: 28px auto 0;
  padding: 18px;
  text-align: start;
}

.download-card img,
.download-strip img {
  flex: 0 0 auto;
  width: 126px;
  height: 126px;
  padding: 8px;
  border: 1px solid rgba(14, 42, 92, .10);
  border-radius: 16px;
  background: #fff;
  object-fit: contain;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7);
}

.download-card b,
.download-strip h3 {
  display: block;
  margin: 4px 0 5px;
  color: var(--fanr-ink);
  font-size: 17px;
  line-height: 1.35;
}

.download-strip h3 {
  font-size: 20px;
}

.download-card p,
.download-strip p {
  margin: 0;
  color: var(--fanr-muted);
  line-height: 1.6;
}

.download-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 7px 0 2px;
}

.download-badges span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 4px 9px;
  border-radius: 999px;
  background: rgba(45, 111, 210, .09);
  color: var(--fanr-blue);
  font-size: 11px;
  font-weight: 900;
}

.download-badges span:first-child {
  background: rgba(31, 157, 102, .12);
  color: var(--fanr-success);
}

.download-kicker {
  display: inline-flex;
  margin-bottom: 2px;
  color: var(--fanr-blue-2);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .9px;
  text-transform: uppercase;
}

[dir="rtl"] .download-kicker {
  letter-spacing: 0;
}

.download-cta .provider-wrap {
  text-align: center;
}

.download-cta .provider-wrap > p {
  max-width: 680px;
  margin-inline: auto;
}

.download-cta .provider-actions {
  justify-content: center;
}

.provider-section {
  padding: 72px 24px;
  background: #fff;
}

.provider-section.alt {
  background: var(--fanr-soft);
}

.provider-section h2 {
  margin: 0 0 14px;
  color: var(--fanr-ink);
  font-size: 36px;
}

.provider-section .lead {
  max-width: 720px;
}

.provider-section p {
  color: var(--fanr-muted);
  line-height: 1.8;
}

.provider-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 28px;
}

.provider-cards-four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.provider-cards-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.provider-card {
  border: 1px solid var(--fanr-line);
  border-radius: 16px;
  padding: 22px;
  background: #fff;
}

.provider-card .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  margin-bottom: 14px;
  border-radius: 14px;
  background: var(--fanr-soft);
}

.provider-card .icon::before,
.provider-service .icon::before {
  content: "";
  width: 22px;
  height: 22px;
  background: var(--fanr-blue-2);
  -webkit-mask: var(--icon-shape) center / contain no-repeat;
  mask: var(--icon-shape) center / contain no-repeat;
}

.provider-card .tag {
  display: block;
  color: var(--fanr-blue-2);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1px;
  margin-bottom: 4px;
}

.provider-service-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  margin-top: 28px;
}

.provider-service {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  border: 1px solid var(--fanr-line);
  border-radius: 16px;
  padding: 20px;
  background: #fff;
  box-shadow: var(--fanr-shadow);
}

.provider-service .icon {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: linear-gradient(135deg, #e0f6fe, #e5f7ea);
}

.icon-target { --icon-shape: var(--icon-target); }
.icon-board { --icon-shape: var(--icon-board); }
.icon-star { --icon-shape: var(--icon-star); }
.icon-card { --icon-shape: var(--icon-card); }
.icon-receipt { --icon-shape: var(--icon-receipt); }
.icon-lock { --icon-shape: var(--icon-lock); }
.icon-scale { --icon-shape: var(--icon-scale); }
.icon-landmark { --icon-shape: var(--icon-landmark); }
.icon-crane { --icon-shape: var(--icon-crane); }
.icon-design { --icon-shape: var(--icon-design); }
.icon-pin { --icon-shape: var(--icon-pin); }
.icon-calculator { --icon-shape: var(--icon-calculator); }
.icon-safety { --icon-shape: var(--icon-safety); }
.icon-brick { --icon-shape: var(--icon-brick); }
.icon-tool { --icon-shape: var(--icon-tool); }
.icon-paint { --icon-shape: var(--icon-paint); }
.icon-handshake { --icon-shape: var(--icon-handshake); }
.icon-folder { --icon-shape: var(--icon-folder); }
.icon-building { --icon-shape: var(--icon-building); }
.icon-user { --icon-shape: var(--icon-user); }

.provider-service b {
  display: block;
  color: var(--fanr-ink);
  font-size: 15px;
}

.provider-service span {
  display: block;
  margin-top: 3px;
  color: var(--fanr-muted);
  font-size: 13px;
  line-height: 1.7;
}

.provider-rail {
  counter-reset: provider-flow;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
  margin-top: 28px;
}

.provider-rail-item {
  counter-increment: provider-flow;
  position: relative;
  border: 1px solid var(--fanr-line);
  border-radius: 16px;
  padding: 26px 24px 24px;
  background: #fff;
  box-shadow: var(--fanr-shadow);
}

.provider-rail-item::before {
  content: counter(provider-flow);
  position: absolute;
  top: -14px;
  inset-inline-start: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 10px;
  background: var(--fanr-grad);
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

.provider-rail-item h3 {
  margin: 8px 0 8px;
  color: var(--fanr-ink);
  font-size: 16px;
}

.provider-rail-item ul,
.provider-checklist {
  margin: 0;
  padding: 0;
  list-style: none;
}

.provider-rail-item li,
.provider-checklist li {
  position: relative;
  padding: 5px 0;
  padding-inline-start: 20px;
  color: var(--fanr-muted);
  font-size: 13.5px;
  line-height: 1.7;
}

.provider-rail-item li::before,
.provider-checklist li::before {
  content: "";
  position: absolute;
  top: 16px;
  inset-inline-start: 0;
  width: 7px;
  height: 7px;
  border-radius: 2px;
  background: var(--fanr-accent);
}

.provider-practice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 16px;
  margin-top: 28px;
}

.provider-practice {
  border: 1px solid;
  border-radius: 16px;
  padding: 24px;
}

.provider-practice.do {
  background: #f2fbf5;
  border-color: #cbebd6;
}

.provider-practice.dont {
  background: #fdf3f3;
  border-color: #f2d4d4;
}

.provider-practice h3 {
  margin: 0 0 10px;
}

.provider-practice.do h3 {
  color: #1e7a41;
}

.provider-practice.dont h3 {
  color: #b23a3a;
}

.provider-card b {
  display: block;
  margin-bottom: 8px;
  color: var(--fanr-blue);
  font-size: 18px;
}

.provider-contact-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 24px;
}

.pf-download-card {
  margin: 18px 0;
  box-shadow: none;
}

.provider-contact-strip a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--fanr-blue);
  font-weight: 800;
  text-decoration: none;
}

.pf-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(7, 18, 34, .62);
}

.pf-overlay.is-open {
  display: flex;
}

.pf-modal {
  width: min(960px, 100%);
  max-height: min(92vh, 900px);
  overflow: auto;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .32);
}

.pf-head {
  position: sticky;
  top: 0;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  padding: 22px 24px;
  background: #fff;
  border-bottom: 1px solid var(--fanr-line);
}

.pf-head h2 {
  margin: 0;
  color: var(--fanr-ink);
  font-size: 24px;
}

.pf-head p {
  margin: 6px 0 0;
  color: var(--fanr-muted);
}

.pf-close {
  width: 40px;
  height: 40px;
  border: 1px solid var(--fanr-line);
  border-radius: 8px;
  background: #fff;
  color: var(--fanr-ink);
  font-size: 24px;
}

.pf-progress {
  height: 6px;
  background: var(--fanr-line);
}

.pf-progress i {
  display: block;
  height: 100%;
  width: 25%;
  background: linear-gradient(90deg, var(--fanr-blue), var(--fanr-blue-2));
  transition: width .2s ease;
}

.pf-body {
  padding: 24px;
}

.pf-step {
  display: none;
}

.pf-step.is-active {
  display: block;
}

.pf-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.pf-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.pf-field.full {
  grid-column: 1 / -1;
}

.pf-field label {
  color: var(--fanr-ink);
  font-size: 14px;
  font-weight: 800;
}

.pf-field input,
.pf-field select,
.pf-field textarea {
  width: 100%;
  border: 1px solid var(--fanr-line);
  border-radius: 8px;
  padding: 13px 14px;
  color: var(--fanr-ink);
  font: inherit;
  background: #fff;
}

.pf-field textarea {
  min-height: 96px;
  resize: vertical;
}

.pf-error {
  display: none;
  color: var(--fanr-error);
  font-size: 12px;
}

.pf-field.is-invalid .pf-error,
.pf-consent.is-invalid + .pf-error,
.pf-status.is-error {
  display: block;
}

.pf-choice-grid,
.pf-chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}

.pf-choice,
.pf-chip {
  border: 1px solid var(--fanr-line);
  border-radius: 999px;
  padding: 10px 14px;
  background: #fff;
  color: var(--fanr-ink);
  font-weight: 800;
}

.pf-choice.is-selected,
.pf-chip.is-selected {
  border-color: var(--fanr-blue);
  background: rgba(22, 64, 127, .08);
  color: var(--fanr-blue);
}

.pf-hint {
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 8px;
  background: var(--fanr-soft);
  color: var(--fanr-muted);
  font-size: 13px;
  line-height: 1.7;
}

.pf-consent {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-top: 18px;
  color: var(--fanr-muted);
}

.pf-status {
  display: none;
  margin-top: 14px;
  color: var(--fanr-error);
}

.pf-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.pf-summary div {
  border: 1px solid var(--fanr-line);
  border-radius: 8px;
  padding: 12px;
}

.pf-summary span,
.pf-summary b {
  display: block;
}

.pf-summary span {
  color: var(--fanr-muted);
  font-size: 12px;
}

.pf-summary b {
  margin-top: 4px;
  color: var(--fanr-ink);
}

.pf-foot {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 24px 24px;
  border-top: 1px solid var(--fanr-line);
}

.pf-foot button,
.pf-foot a {
  border-radius: 8px;
  padding: 12px 18px;
  font-weight: 800;
  text-decoration: none;
}

.pf-next,
.pf-submit,
.pf-app {
  border: 0;
  background: var(--fanr-blue);
  color: #fff;
}

.pf-back {
  border: 1px solid var(--fanr-line);
  background: #fff;
  color: var(--fanr-ink);
}

.pf-app {
  display: none;
}

.pf-modal.is-complete .pf-app {
  display: inline-flex;
}

.pf-modal.is-complete .pf-next,
.pf-modal.is-complete .pf-submit,
.pf-modal.is-complete .pf-back {
  display: none;
}

@media (max-width: 860px) {
  .fanr-home-grid,
  .fanr-path-grid,
  .fanr-command-grid {
    grid-template-columns: 1fr;
  }

  .fanr-home-hero {
    padding-top: 72px;
  }

  .fanr-home-hero h1,
  .fanr-command h2,
  .fanr-pathways h2 {
    font-size: 34px;
  }

  .fanr-mock {
    margin: 0;
  }

  .fanr-path-card {
    min-height: auto;
    padding: 24px;
  }

  .provider-hero-grid,
  .provider-cards,
  .pf-grid,
  .pf-summary {
    grid-template-columns: 1fr;
  }

  .provider-hero {
    padding-top: 112px;
  }

  .provider-panel {
    padding: 20px;
  }

  .download-card,
  .download-strip {
    align-items: flex-start;
  }

  .download-strip {
    flex-direction: column;
    text-align: center;
    align-items: center;
  }

  .download-card {
    flex-direction: column;
    text-align: center;
  }

  .download-badges {
    justify-content: center;
  }

  .fanr-footer-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .fanr-footer-bottom {
    flex-direction: column;
  }

  .pf-foot {
    flex-direction: column-reverse;
  }

  .pf-foot button,
  .pf-foot a {
    width: 100%;
    justify-content: center;
  }
}
