/* spotmetitleloans.com: fixes on top of the archived Divi 3.23 / customizer / module CSS (static site, no Divi JS). */

/* Divi hid these until its JS ran */
.et_animated, .et-waypoint, .et_pb_animation_top, .et_pb_animation_bottom, .et_pb_animation_left, .et_pb_animation_right,
.et_pb_animation_fade_in, .et_pb_animation_off { opacity: 1 !important; transform: none !important; animation: none !important; }
.et_pb_image_wrap img, .et_pb_main_blurb_image img { max-width: 100%; height: auto; }
img { height: auto; }

.stl-skip { position: absolute; left: -9999px; top: 0; z-index: 10000; background: #fff; color: #000; padding: 8px 14px; }
.stl-skip:focus { left: 8px; top: 8px; }

/* header: menu */
.stl-header { position: sticky; top: 0; z-index: 9990; box-shadow: 0 2px 10px rgba(0, 0, 0, .35); }
.stl-header .et_pb_row { position: relative; }
.stl-hdr-apply { position: absolute; right: 0; top: 50%; transform: translateY(-50%); background: #7ac943; color: #0b0b0b !important;
  font-weight: 700; font-size: 15px; line-height: 1; padding: 11px 20px; border-radius: 4px; letter-spacing: .02em; transition: background-color .15s ease; }
.stl-hdr-apply:hover, .stl-hdr-apply:focus-visible { background: #9be05f; }
.stl-hdr-apply:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.stl-header .et_pb_fullwidth_menu .fullwidth-menu li.current-menu-item > a { text-decoration: underline; text-underline-offset: 6px; }
.stl-burger { background: none; border: 0; cursor: pointer; padding: 0; color: inherit; }
.et_pb_fullwidth_menu .mobile_nav .et_mobile_menu { display: none; }
.et_pb_fullwidth_menu .mobile_nav.opened .et_mobile_menu { display: block; }
.et_pb_fullwidth_menu .mobile_nav.opened .mobile_menu_bar:before { content: "\4d"; }
.et_mobile_menu li a { color: #fff !important; font-weight: 600; }
.et_mobile_menu li.current-menu-item a { color: #9dcb3f !important; }
.et_pb_section_y2 { padding-top: 10px; padding-bottom: 10px; }
.et_pb_section_y2 img { max-width: 300px; width: 100%; }

/* breadcrumbs */
.stl-crumbs { font-size: 14px; padding: 12px 0 0; color: #555; }
.stl-crumbs a { color: #2f7d1d; }
.stl-crumbs .container { width: 80%; max-width: 1080px; margin: 0 auto; }

/* notes (buttons: see "content blocks" below) */
.stl-cta { text-align: center; }
.stl-cta span { display: block; margin-top: 12px; }
.stl-cta-h { font-size: 36px; line-height: 1.2; text-align: center; padding-bottom: 6px; }
.stl-cta-sub { text-align: center; font-size: 20px; }
.stl-note { font-size: 13px; line-height: 1.5; color: #555; }
.stl-map { width: 100%; height: 400px; border: 0; display: block; }

/* footer (home page locations section, renamed) */
.stl-footer h2.stl-fh { font-size: 30px; line-height: 1.2; padding-bottom: 10px; }
.stl-footer .stl-flinks { list-style: none; padding: 0; line-height: 2; }
.stl-footer .stl-flinks a { color: inherit; text-decoration: underline; }
.stl-footer .stl-note { color: inherit; opacity: .85; margin-top: 14px; }
.stl-footer .et_pb_column { margin-bottom: 30px; }

/* blog, posts, plain pages */
.stl-post { padding-top: 30px; padding-bottom: 50px; }
.stl-post #left-area { padding-bottom: 20px; }
.stl-post .et_post_meta_wrapper img { width: 100%; max-width: 100%; margin: 10px 0 24px; }
.stl-post .entry-content p, .stl-post .entry-content li { font-size: 16px; line-height: 1.75; }
.stl-post .entry-content h2 { font-size: 24px; padding: 14px 0 8px; }
.stl-post .entry-content h3 { font-size: 20px; padding: 10px 0 6px; }
.stl-post .entry-content img { max-width: 100%; }
.stl-blog-h1 { font-size: 34px; padding-bottom: 20px; }
.stl-posts .et_pb_post { margin-bottom: 50px; }
.stl-posts .et_pb_post .entry-featured-image-url img { max-width: 100%; }
.stl-posts .pagination { font-size: 16px; }
.stl-post-cta { background: #f1f8ee; border: 1px solid #cfe6c6; border-radius: 4px; padding: 16px 20px; margin: 30px 0; }
.stl-post-cta p { padding: 0; }
.stl-postnav { display: flex; justify-content: space-between; gap: 20px; font-size: 15px; border-top: 1px solid #ddd; padding-top: 18px; }
.stl-postnav a { color: #2f7d1d; max-width: 48%; }
.stl-postnav .newer { text-align: right; margin-left: auto; }
#sidebar .widgettitle { font-size: 20px; padding-bottom: 10px; }
#sidebar .widget_recent_entries li { margin-bottom: 10px; line-height: 1.5; }
#sidebar .stl-side-cta { background: #f1f8ee; padding: 18px; }
.stl-simple-inner { max-width: 820px; margin: 0 auto; }
.stl-simple h1 { font-size: 36px; padding-bottom: 16px; }
.stl-simple h2 { font-size: 24px; padding: 18px 0 8px; }
.stl-simple p { font-size: 16px; line-height: 1.7; }
.stl-form { margin: 24px 0; min-height: 300px; }

@media (max-width: 980px) {
  .stl-crumbs .container, .stl-post.container { width: 90%; }
  .stl-cta-h { font-size: 28px; }
  .stl-map { height: 300px; }
}

/* links on the blue sections */
.stl-footer a[href^="tel:"], .stl-footer .stl-flinks a { color: #fff !important; font-weight: 700; }
.stl-cta span a { color: #000 !important; font-weight: 700; text-decoration: underline; }

/* paragraphs promoted to headings keep their original look */
.stl-ph { font-size: inherit; line-height: inherit; font-weight: inherit; color: inherit; font-family: inherit; padding-bottom: 10px; }
.stl-page-h1 { font-size: 26px; font-weight: 600; line-height: 1.3; }
h1.stl-ph { font-size: 30px; line-height: 1.25; font-weight: 500; color: #333; padding-bottom: 14px; }
h2.stl-ph { font-size: 22px; line-height: 1.3; font-weight: 500; color: #333; padding: 14px 0 8px; }
@media (max-width: 767px) { h1.stl-ph { font-size: 26px; } }

/* content blocks: cards, checklists, steps, FAQ (site palette: #2d2d2d header, lime #7ac943, sky #4fb8e6) */
:root { --stl-ink: #1f2328; --stl-muted: #5b6370; --stl-lime: #7ac943; --stl-lime-d: #2f7d1d; --stl-lime-s: #f1f8ea;
  --stl-blue: #4fb8e6; --stl-blue-s: #eaf6fc; --stl-line: #e3e8e0; --stl-r: 16px; --stl-sh: 0 1px 2px rgba(16, 24, 40, .05), 0 8px 24px rgba(16, 24, 40, .07); }

/* buttons: one style everywhere, same as the header Apply Now */
a.et_pb_button.stl-btn, .stl-btn { display: inline-block; background: var(--stl-lime) !important; color: #0b0b0b !important; border: 0 !important;
  border-radius: 10px; padding: 14px 28px !important; font-family: "Work Sans", sans-serif; font-size: 17px; font-weight: 700; line-height: 1.2;
  letter-spacing: .01em; box-shadow: 0 6px 18px rgba(122, 201, 67, .35); transition: transform .15s ease, background-color .15s ease, box-shadow .15s ease; }
a.et_pb_button.stl-btn:hover, .stl-btn:hover { background: #8fd65a !important; transform: translateY(-1px); box-shadow: 0 10px 22px rgba(122, 201, 67, .4);
  padding: 14px 28px !important; }
a.et_pb_button.stl-btn:after { display: none !important; }
.stl-center { text-align: center; padding-top: 8px; }

/* checklist */
ul.stl-list { list-style: none !important; padding: 4px 0 6px !important; margin: 0; }
ul.stl-list li { list-style: none !important; font-size: 15px; }
.stl-list li { position: relative; padding: 0 0 12px 36px; line-height: 1.55; color: var(--stl-ink); }
.stl-list li:before { content: "\2713"; position: absolute; left: 0; top: 0; width: 24px; height: 24px; border-radius: 50%;
  background: var(--stl-lime-s); color: var(--stl-lime-d); font-weight: 700; font-size: 13px; line-height: 24px; text-align: center;
  box-shadow: inset 0 0 0 1px #d4ebc3; }

/* cards */
.stl-card { background: #fff; border: 1px solid var(--stl-line); border-radius: var(--stl-r); box-shadow: var(--stl-sh); padding: 26px 28px; }
.stl-card h2, .stl-card h3 { padding-top: 0 !important; }
.et_pb_text_inner.stl-card { text-align: left; padding: 26px 28px !important; }
.stl-card > :last-child { padding-bottom: 0 !important; margin-bottom: 0; }
.stl-callout { display: flex; gap: 12px; align-items: flex-start; background: var(--stl-blue-s); border-radius: 12px; padding: 14px 18px;
  font-size: 14px; line-height: 1.55; color: #2b4a58; margin: 18px 0 22px; }
.stl-callout:before { content: "i"; flex: 0 0 22px; height: 22px; border-radius: 50%; background: var(--stl-blue); color: #fff;
  font: 700 13px/22px Georgia, serif; text-align: center; margin-top: 1px; }
.stl-tag { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--stl-lime-d);
  background: var(--stl-lime-s); border-radius: 999px; padding: 5px 12px; margin-bottom: 12px; }
.stl-tag-blue { color: #1d6f93; background: var(--stl-blue-s); }
.stl-lead { font-size: 18px; color: var(--stl-muted); padding-bottom: 22px; }

/* home: intro */
.stl-intro { text-align: left; color: var(--stl-ink); }
.stl-intro h2 { font-size: 32px; line-height: 1.2; padding-bottom: 16px; font-weight: 600; }
.stl-intro p { font-size: 16px; line-height: 1.7; }
.stl-need-card { margin-top: 22px; }
.stl-need-card h3 { font-size: 20px; padding-bottom: 14px; font-weight: 600; }
.stl-intro-sec .et_pb_button_module_wrapper { text-align: left; }

/* home: dark benefits band -> cards */
.stl-benefits-h { color: #fff; font-size: 34px; font-weight: 600; }
.stl-benefits .et_pb_blurb { background: #363636; border: 1px solid rgba(255, 255, 255, .07); border-radius: var(--stl-r); padding: 28px 20px 22px;
  height: 100%; transition: transform .2s ease, border-color .2s ease; }
.stl-benefits .et_pb_blurb:hover { transform: translateY(-3px); border-color: rgba(122, 201, 67, .5); }
.stl-benefits .et_pb_main_blurb_image { max-width: 96px; margin: 0 auto 18px; }
.stl-benefits .et_pb_module_header { color: var(--stl-lime) !important; font-size: 19px !important; padding-bottom: 8px; }
.stl-benefits .et_pb_blurb_description, .stl-benefits .et_pb_blurb_description p { color: #d9d9d9 !important; font-weight: 400 !important; font-size: 15px; line-height: 1.6; }

/* home: comparison, steps, FAQ */
.stl-home-sec { padding: 72px 0 56px; background: #f6f9f4; }
.stl-home-sec h2 { font-size: 32px; line-height: 1.2; font-weight: 600; padding: 0 0 10px; color: var(--stl-ink); }
.stl-home-sec h2:not(:first-child) { padding-top: 48px; }
.stl-home-sec h3 { font-size: 20px; font-weight: 600; padding-bottom: 8px; color: var(--stl-ink); }
.stl-home-sec p { font-size: 16px; line-height: 1.7; color: #3a414b; }
.stl-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.stl-steps-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; padding: 14px 0 26px; }
.stl-step-card { background: #fff; border: 1px solid var(--stl-line); border-radius: var(--stl-r); box-shadow: var(--stl-sh); padding: 26px 24px; }
.stl-num { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 12px; background: #2d2d2d;
  color: var(--stl-lime); font: 700 20px/1 "Montserrat", sans-serif; margin-bottom: 16px; }
.stl-faq { max-width: 860px; padding-top: 10px; }
.stl-faq details { background: #fff; border: 1px solid var(--stl-line); border-radius: 12px; margin-bottom: 12px; transition: box-shadow .2s ease; }
.stl-faq details[open] { box-shadow: var(--stl-sh); }
.stl-faq summary { cursor: pointer; list-style: none; position: relative; font-weight: 600; padding: 18px 56px 18px 20px; font-size: 17px; color: var(--stl-ink); }
.stl-faq summary::-webkit-details-marker { display: none; }
.stl-faq summary:after { content: "+"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; border-radius: 50%;
  background: var(--stl-lime-s); color: var(--stl-lime-d); font: 600 20px/28px sans-serif; text-align: center; }
.stl-faq details[open] summary:after { content: "\2212"; }
.stl-faq details p { padding: 0 20px 18px; color: #3a414b; }
.stl-faq summary:focus-visible { outline: 2px solid var(--stl-lime-d); outline-offset: 2px; border-radius: 12px; }

/* CTA band */
.stl-cta-sec .et_pb_row { border-radius: 20px; overflow: hidden; box-shadow: 0 12px 32px rgba(79, 184, 230, .3); padding: 44px 24px !important; }
.stl-cta-h { font-size: 38px; font-weight: 600; color: #10222b !important; }
.stl-cta-sub { color: #10222b; font-size: 19px; padding-bottom: 10px; }
.stl-cta span { color: #10222b; font-size: 15px; margin-top: 16px; }

/* equal-height card rows built from Divi columns (gutter-less layout) */
@media (min-width: 981px) {
  .stl-benefits .et_pb_row:has(.et_pb_blurb), .stl-steps-row { display: flex; }
  .stl-benefits .et_pb_column, .stl-steps-row .et_pb_column { display: flex; }
  .stl-benefits .et_pb_column > .et_pb_blurb, .stl-steps-row .et_pb_column > .et_pb_blurb { flex: 1; margin: 0 9px !important; }
}

/* how it works */
.stl-check { margin-bottom: 14px !important; }
.stl-check .et_pb_module_header { font-size: 19px !important; font-weight: 600; color: var(--stl-ink); }
.stl-steps-row { border: 0 !important; background: #f6f9f4; border-radius: 20px; padding: 36px 24px !important; }
.stl-step { background: #fff; border: 1px solid var(--stl-line); border-radius: var(--stl-r); box-shadow: var(--stl-sh); padding: 26px 18px; height: 100%; }
.stl-step .et_pb_main_blurb_image { max-width: 110px; margin: 0 auto 16px; }
.stl-step .et_pb_module_header { color: var(--stl-lime-d) !important; }
.stl-aside { background: #2d2d2d; border-radius: var(--stl-r); padding: 30px 24px !important; box-shadow: var(--stl-sh); }
.stl-aside .et_pb_text, .stl-aside .et_pb_text * { color: #fff !important; text-shadow: none !important; }
.stl-aside .et_pb_text_inner { text-align: center; }
.stl-aside a.stl-btn { color: #0b0b0b !important; font-size: 17px !important; margin-top: 8px; }

@media (max-width: 980px) {
  .stl-steps-grid { grid-template-columns: 1fr; gap: 16px; }
  .stl-aside { margin-top: 24px; }
  .stl-benefits .et_pb_blurb { margin-bottom: 16px !important; }
}
@media (max-width: 767px) {
  .stl-cols { grid-template-columns: 1fr; gap: 16px; }
  .stl-home-sec { padding: 48px 0 36px; }
  .stl-home-sec h2, .stl-intro h2, .stl-benefits-h { font-size: 26px; }
  .stl-cta-h { font-size: 28px; }
  .stl-card { padding: 22px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .stl-btn, .stl-benefits .et_pb_blurb, .stl-faq details { transition: none; }
  .stl-btn:hover, .stl-benefits .et_pb_blurb:hover { transform: none; }
}
.et_pb_text:has(> .stl-card) { margin: 18px 0 22px !important; }
.stl-card p:empty { display: none; }

/* home: payment calculator + examples table */
.stl-calc { display: grid; grid-template-columns: 1.2fr 1fr; gap: 32px; padding: 30px !important; margin: 10px 0 34px; }
.stl-calc-in label { display: flex; justify-content: space-between; align-items: baseline; font-weight: 600; color: var(--stl-ink); font-size: 15px; padding-top: 6px; }
.stl-calc-in output { font: 700 20px/1.2 "Montserrat", sans-serif; color: var(--stl-lime-d); }
.stl-calc-in input[type=range] { -webkit-appearance: none; appearance: none; width: 100%; height: 8px; border-radius: 999px; margin: 12px 0 22px; cursor: pointer;
  background: linear-gradient(to right, var(--stl-lime) var(--p, 50%), #e4eadf var(--p, 50%)); }
.stl-calc-in input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 24px; height: 24px; border-radius: 50%; background: #fff;
  border: 3px solid var(--stl-lime); box-shadow: 0 2px 6px rgba(0, 0, 0, .2); }
.stl-calc-in input[type=range]::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 3px solid var(--stl-lime);
  box-shadow: 0 2px 6px rgba(0, 0, 0, .2); }
.stl-calc-in input[type=range]:focus-visible { outline: 2px solid var(--stl-lime-d); outline-offset: 4px; }
.stl-calc-out { background: #2d2d2d; border-radius: 14px; padding: 26px 24px; color: #fff; display: flex; flex-direction: column; justify-content: center; }
.stl-calc-out .stl-calc-label { color: #cfcfcf !important; font-size: 14px; letter-spacing: .04em; text-transform: uppercase; padding: 0; }
.stl-calc-out .stl-calc-big { font: 700 44px/1.1 "Montserrat", sans-serif; color: var(--stl-lime) !important; padding: 6px 0 16px; }
.stl-calc-out dl { display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; margin: 0 0 20px; font-size: 15px; border-top: 1px solid rgba(255, 255, 255, .12); padding-top: 14px; }
.stl-calc-out dt { color: #cfcfcf; }
.stl-calc-out dd { margin: 0; font-weight: 700; text-align: right; color: #fff; }
.stl-calc-out .stl-btn { text-align: center; }
.stl-ex-h { padding-top: 6px !important; }
.stl-table-wrap { overflow-x: auto; border: 1px solid var(--stl-line); border-radius: var(--stl-r); background: #fff; box-shadow: var(--stl-sh); }
.stl-table { width: 100%; margin: 0 !important; border: 0 !important; border-collapse: collapse; font-size: 15px; min-width: 600px; }
.stl-table th { text-align: left; background: #2d2d2d; color: #fff !important; white-space: nowrap; font-weight: 600; padding: 12px 16px; font-size: 13px; letter-spacing: .03em; }
.stl-table-wrap .stl-table td { white-space: nowrap; padding: 12px 16px; border-top: 1px solid var(--stl-line); color: #3a414b; }
.stl-table tbody tr:nth-child(even) td { background: #f8fbf6; }
.stl-table td b { color: var(--stl-lime-d); }
@media (max-width: 767px) {
  .stl-calc { grid-template-columns: 1fr; gap: 20px; padding: 20px !important; }
  .stl-calc-out .stl-calc-big { font-size: 36px; }
  .stl-table-wrap { border: 0; background: none; box-shadow: none; overflow: visible; }
  .stl-table { min-width: 0; }
  .stl-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .stl-table tr { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 12px; background: #fff; border: 1px solid var(--stl-line);
    border-radius: 14px; box-shadow: var(--stl-sh); padding: 14px 16px; margin-bottom: 12px; }
  .stl-table-wrap .stl-table tbody tr td { display: block; border: 0; padding: 4px 0; background: none; font-size: 15px; }
  .stl-table td:before { content: attr(data-l); display: block; font-size: 12px; color: var(--stl-muted); letter-spacing: .03em; }
}
