* { box-sizing: border-box; }
html { color-scheme: light; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--font-body); font-size: var(--text); line-height: var(--leading-body); }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, summary, a { -webkit-tap-highlight-color: transparent; }
a:focus-visible, summary:focus-visible { outline: 3px solid var(--blue); outline-offset: 5px; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 { font-family: var(--font-heading); font-weight: var(--weight-heading); text-transform: uppercase; line-height: var(--leading-heading); letter-spacing: -1px; }
h1 { font-size: var(--h1); }
h2 { font-size: var(--h2); }
h3 { font-size: var(--h3); letter-spacing: -.3px; }
.container { width: min(var(--container), calc(100% - var(--gutter) * 2)); margin-inline: auto; }
.site-header { height: var(--header-height); background: var(--white); position: relative; z-index: 5; }
.header-inner { display: flex; justify-content: space-between; align-items: center; height: 100%; }
.brand { display: block; width: 250px; height: 62px; overflow: hidden; flex-shrink: 0; position: relative; }
.brand img { width: 250px; max-width: none; position: absolute; top: -89px; left: 0; }
.desktop-nav { display: flex; align-items: center; gap: 32px; font-size: 14px; font-weight: var(--weight-bold); }
.button { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; background: var(--blue); color: var(--white); padding: 10px 36px; font-weight: var(--weight-bold); font-size: 18px; border: 1px solid transparent; text-align: center; }
.button:hover { background: var(--accent-hover); }
.header-button { min-height: 42px; padding: 8px 20px; font-size: 14px; }
.mobile-nav { display: none; }
.section-intro { margin-top: 6px; letter-spacing: .3px; }
.number-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); margin-top: 25px; }
.number-item { display: grid; grid-template-columns: 86px 1fr; gap: 20px; padding-inline: 26px; border-left: 1px solid var(--rule); }
.number-item:first-child { padding-left: 0; border-left: 0; }
.number-item:last-child { padding-right: 0; }
.number { color: var(--blue); font-family: var(--font-heading); font-weight: var(--weight-heading); font-size: 86px; line-height: var(--leading-number); letter-spacing: -4px; }
.number-item h3 { margin: 5px 0 7px; }
.number-item p { font-size: var(--small); line-height: var(--leading-copy); }
.service-price { display: block; font-weight: var(--weight-bold); margin-top: 8px; }
.how { background: var(--navy); color: var(--white); padding: 24px 0 28px; }
.how .number-item { grid-template-columns: 76px 1fr; }
.how .number { font-size: 70px; }
.how .number-item h3 { margin-top: 1px; }
.how .number-item p { font-size: 17px; }
.how .number-item { border-color: var(--rule-light); }
.plans { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 34px; margin-top: 14px; }
.plan { border: 1px solid var(--rule); border-radius: var(--radius); padding: 20px 35px 18px; display: flex; flex-direction: column; }
.plan h3 { font-size: 28px; }
.plan-price { font-size: 27px; font-weight: var(--weight-bold); margin: 12px 0; letter-spacing: -1px; }
.plan-description { display: flex; gap: 20px; align-items: flex-start; font-size: var(--small); }
.plan-icon { width: 45px; height: 45px; flex-shrink: 0; stroke: currentColor; fill: none; stroke-width: 1.8; }
.plan ul { padding-left: 18px; font-size: 14px; line-height: var(--leading-list); margin: 18px 0 22px; }
.plan li + li { margin-top: 5px; }
.plan .button { margin-top: auto; min-height: 40px; padding: 5px 12px; background: transparent; border-color: var(--ink); color: var(--ink); font-size: 17px; border-radius: 3px; }
.plan .button:hover { background: var(--surface-pale); }
.plan.featured { color: var(--white); background: var(--blue); border-color: var(--blue); }
.plan.featured .button { background: var(--white); border-color: var(--white); }
.about { position: relative; display: grid; grid-template-columns: 52% 48%; min-height: 270px; }
.about-photo { position: absolute; inset: 0 auto 0 0; width: 52%; height: 100%; object-fit: cover; object-position: center; }
.about-copy { grid-column: 2; padding: 20px 32px 20px 64px; max-width: 625px; align-self: center; }
.about h2 { max-width: 410px; }
.about p { margin-top: 18px; letter-spacing: .3px; }
.faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; margin-top: 14px; }
.faq details { border-top: 1px solid var(--rule); }
.faq details:last-child { border-bottom: 1px solid var(--rule); }
.faq summary { position: relative; padding: 15px 10px 15px 66px; cursor: pointer; list-style: none; font-family: var(--font-heading); font-size: 21px; font-weight: var(--weight-heading); text-transform: uppercase; line-height: var(--leading-summary); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::before { content: '+'; position: absolute; left: 12px; top: 11px; font-family: var(--font-body); font-size: 28px; line-height: var(--leading-tight); }
.faq details[open] summary::before { content: '−'; }
.faq details[open] summary { padding-bottom: 5px; }
.faq details p { padding: 0 12px 17px 66px; font-size: var(--small); line-height: var(--leading-copy); }
.cta { background: var(--blue); color: var(--white); padding: 20px 0 26px; }
.cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.cta p { margin-top: 5px; letter-spacing: .4px; }
.cta .button { min-width: 255px; color: var(--ink); background: var(--white); }
.site-footer { color: var(--white); background: var(--navy); padding: 22px 0 28px; font-size: 14px; }
.footer-top { display: flex; align-items: center; gap: 40px; }
.footer-brand img { filter: brightness(0) invert(1); }
.footer-nav { display: flex; gap: 25px; align-items: center; }
.footer-nav a + a { border-left: 1px solid var(--rule-footer); padding-left: 25px; }
.footer-contact { margin-left: auto; padding-left: 42px; border-left: 1px solid var(--rule-footer); display: flex; align-items: center; gap: 24px; }
.footer-contact svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.3; }
.footer-address { border-top: 1px solid var(--rule-footer-muted); margin-top: 18px; padding-top: 15px; display: flex; gap: 24px; justify-content: flex-end; font-style: normal; font-size: 13px; }
@media (max-width: 1100px) {
  .number-item { grid-template-columns: 62px 1fr; gap: 14px; padding-inline: 18px; }
  .number { font-size: 70px; }
  .how .number-item { grid-template-columns: 55px 1fr; }
  .how .number { font-size: 60px; }
  .how .number-item p { font-size: 15px; }
  .plans { gap: 22px; }
  .plan { padding: 20px; }
  .plan-description { gap: 12px; }
  .plan-icon { width: 35px; }
  .about-copy { padding-left: 36px; }
  .faq-grid { gap: 34px; }
  .faq summary { padding-left: 44px; font-size: 19px; }
  .faq details p { padding-left: 44px; }
  .footer-top { gap: 24px; }
  .footer-contact { padding-left: 24px; gap: 14px; }
}
@media (max-width: 800px) {
  .brand { width: 225px; }
  .brand img { width: 225px; top: -77px; }
  .number-grid { gap: 0; }
  .number-item, .how .number-item { display: block; padding-inline: 16px; }
  .number { font-size: 60px; display: block; margin-bottom: 12px; }
  .plan { padding: 18px 15px; }
  .plans { gap: 14px; }
  .plan-description { display: block; }
  .plan-icon { margin-bottom: 12px; }
  .plan-price { font-size: 24px; }
  .about { grid-template-columns: 48% 52%; }
  .about-photo { width: 48%; }
  .about-copy { padding: 25px; }
  .faq-grid { gap: 26px; }
  .cta-inner { gap: 24px; }
  .cta .button { min-width: 190px; }
  .footer-top { flex-wrap: wrap; justify-content: space-between; }
  .footer-contact { margin-left: 0; border: 0; padding-left: 0; }
  .footer-address { justify-content: flex-start; }
}
@media (max-width: 600px) {
  .brand { width: 210px; height: 60px; }
  .brand img { width: 210px; top: -71px; }
  .desktop-nav { display: none; }
  .mobile-nav { display: block; }
  .mobile-nav summary { cursor: pointer; font-size: 14px; font-weight: var(--weight-bold); list-style: none; padding: 12px 0 12px 15px; }
  .mobile-nav summary::-webkit-details-marker { display: none; }
  .mobile-nav summary::after { content: ' ☰'; font-size: 19px; }
  .mobile-nav nav { position: absolute; top: 66px; left: 0; right: 0; padding: 18px 22px; background: var(--white); box-shadow: var(--shadow-nav); display: flex; align-items: center; justify-content: space-between; }
  .section-intro { margin-top: 10px; }
  .number-grid { grid-template-columns: 1fr; gap: 23px; margin-top: 24px; }
  .number-item, .how .number-item { display: grid; grid-template-columns: 60px 1fr; gap: 18px; border: 0; border-top: 1px solid var(--rule-mobile); padding: 21px 0 0; }
  .number-item:first-child { border-top: 0; padding-top: 0; }
  .number-item h3 { margin-top: 0; }
  .number, .how .number { font-size: 63px; margin: 0; }
  .number-item p, .how .number-item p { font-size: 16px; }
  .plans { grid-template-columns: 1fr; gap: 18px; margin-top: 22px; }
  .plan { padding: 24px; }
  .plan-description { display: flex; gap: 18px; }
  .plan-icon { width: 42px; margin: 0; }
  .plan ul { font-size: 15px; }
  .about { grid-template-columns: 1fr; min-height: 0; }
  .about-photo { position: static; width: 100%; height: 240px; }
  .about-copy { grid-column: auto; padding: 28px 22px; }
  .about h2 { max-width: 310px; }
  .faq-grid { grid-template-columns: 1fr; gap: 0; margin-top: 18px; }
  .faq-column:first-child details:last-child { border-bottom: 0; }
  .faq summary { padding-block: 17px; font-size: 20px; }
  .faq details p { font-size: 15px; padding-right: 0; }
  .cta { padding-block: 26px; }
  .cta-inner { display: block; }
  .cta .button { margin-top: 20px; width: 100%; }
  .footer-top { display: grid; gap: 21px; }
  .footer-brand { margin-left: -7px; }
  .footer-nav { font-size: 15px; }
  .footer-contact { gap: 14px; font-size: 15px; }
  .footer-address { display: block; line-height: var(--leading-address-mobile); }
  .footer-address span { display: block; margin-bottom: 4px; font-weight: var(--weight-bold); }
}

/* Secondary-page components: compose with the approved homepage foundations. */
.page-title { padding-block: var(--space-5) var(--space-4); }
.page-title h1 { max-width: var(--container-reading); }
.page-title p { max-width: var(--container-reading); margin-top: var(--space-2); }
.page-title::before { content: ''; display: block; width: 31px; height: 5px; background: var(--accent); margin-bottom: 20px; }
.tinted-band { padding-block: var(--space-4); background: var(--navy); color: var(--white); }
.tinted-band--pale { background: var(--surface-pale); color: var(--ink); }
.card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.card { padding: var(--space-3); border: var(--border-default); border-radius: var(--radius); }
.card > * + * { margin-top: var(--space-2); }
.button--outline { color: var(--ink); background: transparent; border-color: var(--ink); border-radius: var(--radius-button); }
.button--outline:hover { background: var(--surface-pale); }
.button--light { color: var(--ink); background: var(--white); border-color: var(--white); }
.button--light:hover { background: var(--surface-pale); }
button.button { font-family: var(--font-body); cursor: pointer; }
.button:focus-visible, .form-control:focus-visible { outline: var(--focus-outline); outline-offset: 5px; }
.quote { margin: 0; padding: var(--space-3); border-left: 5px solid var(--accent); background: var(--surface-pale); }
.quote p { font-size: var(--text-button); line-height: var(--leading-copy); }
.quote cite { display: block; margin-top: var(--space-2); font-size: var(--small); font-style: normal; font-weight: var(--weight-bold); }
.image-frame { margin: 0; border: var(--border-default); border-radius: var(--radius); overflow: hidden; }
.image-frame img { width: 100%; }
.image-frame figcaption { padding: var(--space-2); font-size: var(--small); line-height: var(--leading-copy); }
.contact-details { margin: 0; font-style: normal; overflow-wrap: anywhere; }
.contact-details > * + * { margin-top: var(--space-2); }
.contact-details dt { font-weight: var(--weight-bold); }
.contact-details dd { margin: 0; }
.contact-details a { text-decoration: underline; text-underline-offset: 3px; }
.table-scroll { overflow-x: auto; }
.simple-table { width: 100%; border-collapse: collapse; font-size: var(--small); line-height: var(--leading-copy); }
.simple-table caption { text-align: left; font-weight: var(--weight-bold); padding-bottom: var(--space-2); }
.simple-table th, .simple-table td { padding: var(--space-2); text-align: left; vertical-align: top; border-bottom: var(--border-default); }
.simple-table thead { background: var(--surface-pale); }
.simple-table th { font-weight: var(--weight-bold); }
.form-stack { display: grid; gap: var(--space-3); max-width: var(--container-reading); }
.form-field { display: grid; gap: var(--space-1); }
.form-label { font-weight: var(--weight-bold); }
.form-control { width: 100%; min-width: 0; min-height: 50px; padding: 10px var(--space-2); border: var(--border-default); border-radius: var(--radius-button); background: var(--white); color: var(--ink); font: inherit; line-height: var(--leading-copy); }
textarea.form-control { min-height: 150px; resize: vertical; }
.form-control::placeholder { color: var(--rule); opacity: 1; }
.form-control[aria-invalid="true"] { border-color: var(--ink); border-width: 2px; }
.form-control:disabled { background: var(--surface-pale); cursor: not-allowed; }
.form-help { font-size: var(--small); line-height: var(--leading-copy); }
.form-choice { display: flex; align-items: baseline; gap: var(--space-1); }
.form-choice input { accent-color: var(--accent); }
.form-choice input:focus-visible { outline: var(--focus-outline); outline-offset: 5px; }
@media (max-width: 800px) {
  .card-grid { gap: var(--space-2); }
}
@media (max-width: 600px) {
  .page-title { padding-block: 28px; }
  .tinted-band { padding-block: 28px; }
  .card-grid { grid-template-columns: 1fr; }
  .quote { padding: var(--space-2); }
  .simple-table th, .simple-table td { padding: var(--space-1); }
}

/* Approved process, pricing, FAQ, contact and footer variants. */
.how .container { display: grid; grid-template-columns: 1fr 2fr; gap: 48px; align-items: start; }
.how .number-grid { position: relative; grid-template-columns: 1fr; gap: 22px; margin-top: 0; }
.how .number-grid::before { content: ''; position: absolute; left: 18px; top: 18px; bottom: 18px; width: 1px; background: var(--rule-footer-muted); }
.how .number-item { position: relative; display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 20px; padding: 0; border: 0; }
.how .number { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; margin: 0; border: 1px solid var(--blue); border-radius: 50%; background: var(--navy); color: var(--white); font-family: var(--font-body); font-size: 14px; letter-spacing: 0; line-height: 1; }
.how .number-item h3 { margin-top: 0; }
.pricing .plan { border-top: 3px solid var(--blue); }
.pricing .plan-icon { width: 48px; height: 48px; padding: 7px; border-radius: var(--radius); color: var(--blue); background: var(--surface-pale); }
.pricing .plan li::marker { color: var(--blue); }
.pricing .plan .button { border-color: var(--blue); color: var(--blue); }
.pricing .plan .button:hover { background: var(--blue); color: var(--white); }
.pricing .plan.featured { border-top-color: var(--navy); }
.pricing .plan.featured .plan-icon { color: var(--white); background: rgba(255,255,255,.16); }
.pricing .plan.featured li::marker { color: var(--white); }
.pricing .plan.featured .button { border-color: var(--white); }
.pricing .plan.featured .button:hover { color: var(--blue); background: var(--surface-pale); }
.faq h2 { font-size: 32px; }
.faq summary { padding: 12px 10px 12px 44px; font-size: 17px; }
.faq summary::before { top: 10px; font-size: 22px; color: var(--blue); }
.faq details p { padding: 0 12px 13px 44px; font-size: 14px; }
@media (max-width: 800px) {
.how .container { grid-template-columns: 1fr 2fr; gap: 28px; }
}
@media (max-width: 600px) {
.how .container { grid-template-columns: 1fr; gap: 24px; }
.how .number-item { grid-template-columns: 38px minmax(0, 1fr); gap: 18px; }
.faq h2 { font-size: 28px; }
}
.contact { padding-block: var(--space-5); }
.contact-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: var(--space-5); align-items: start; }
.contact .contact-details { margin-top: var(--space-3); }
.contact form { min-width: 0; position: relative; }
.contact .form-stack { max-width: none; }
.contact .form-field { min-width: 0; }
.contact .button { justify-self: start; }
@media (max-width: 600px) {
.contact { padding-block: 28px; }
.contact-layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
.contact .button { width: 100%; }
}
.contact-layout { grid-template-columns: minmax(0, 1fr); justify-items: center; gap: var(--space-3); }
.contact-intro { text-align: center; }
.contact-intro p { margin-top: 8px; }
.contact .rs-form { margin-inline: auto; }
.footer-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 480px); gap: 56px; align-items: center; padding-block: 40px 16px; }
.footer-info { display: grid; gap: 14px; justify-items: start; }
.footer-title { color: var(--white); font-size: 30px; margin: 6px 0 0; }
.footer-lead { margin: 0 0 6px; font-size: 16px; opacity: .85; }
.footer-grid .footer-contact { margin: 0; padding: 0; border: 0; gap: 12px; color: var(--white); }
.footer-grid .footer-address { margin: 0; padding: 0; border: 0; display: block; font-size: 14px; line-height: 1.5; opacity: .85; }
.footer-grid .footer-nav { margin-top: 8px; font-size: 14px; }
.footer-form .rs-form { margin-left: auto; }
@media (max-width: 900px) {
.footer-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; padding-block: 28px 8px; }
.footer-form .rs-form { margin: 0; }
}

/* Shared contact form, preserving the approved form appearance. */
/* ReplyStride contact form: written by the engine, the same on every site. */
.rs-form{--rs-accent:var(--accent,var(--color-accent,#2563eb));display:grid;gap:14px;width:100%;max-width:520px;box-sizing:border-box;margin:0;padding:24px;background:#fff;color:#1f2937;border:1px solid rgba(15,23,42,.1);border-radius:14px;box-shadow:0 8px 24px rgba(15,23,42,.06);text-align:left;position:relative}
.rs-form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.rs-form label{display:grid;gap:6px;margin:0;font-size:14px;font-weight:600;line-height:1.3;color:inherit}
.rs-form input,.rs-form textarea{display:block;width:100%;box-sizing:border-box;height:44px;min-height:0;margin:0;padding:10px 12px;font:inherit;font-size:15px;font-weight:400;line-height:1.4;color:#1f2937;background:#fff;border:1px solid #d4d9e1;border-radius:8px;box-shadow:none}
.rs-form textarea{height:auto;min-height:112px;resize:vertical}
.rs-form input:focus,.rs-form textarea:focus{outline:none;border-color:var(--rs-accent);box-shadow:0 0 0 3px rgba(37,99,235,.15)}
.rs-form button{justify-self:start;margin:4px 0 0}
.rs-form-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (max-width:600px){.rs-form{padding:18px}.rs-form-row{grid-template-columns:1fr}.rs-form button{justify-self:stretch}}

/* Shared footer links wrap within narrow viewports. */
.footer-grid .footer-nav { flex-wrap: wrap; column-gap: var(--space-2); row-gap: var(--space-1); }
.footer-grid .footer-nav a + a { padding-left: var(--space-2); }
.footer-info, .footer-form { min-width: 0; }
.footer-grid .footer-contact, .footer-grid .footer-address { overflow-wrap: anywhere; }