/* ========================================
   BORROWER SERVICE TEMPLATE OVERRIDES
   Mint variant of the product template — values measured from the live
   borrower pages (large-loans) at 1696px / 375px.
   ======================================== */

/* Hero: mint gradient, black type, purple/outline buttons with offset shadows */
.borrower-svc .svc-hero {
  background: linear-gradient(141deg, #67EEBC 0%, #8CF8D0 100%);
  padding-top: 147px;
}

.borrower-svc .svc-hero::after {
  background-position: 900px 50px;
  background-size: 45% auto;
  opacity: 0.7;
}

.borrower-svc .svc-hero h1 {
  color: #000;
  font-weight: 900;
  text-transform: none;
}

.borrower-svc .svc-hero-label,
.borrower-svc .svc-hero p {
  color: #000;
}

.borrower-svc .svc-hero-actions .btn--primary {
  background: #56317D !important;
  color: #94F7D2 !important;
  border: 2px solid #000 !important;
  border-radius: 50px;
  box-shadow: 3px 4px 0 #000;
}

.borrower-svc .svc-hero-actions .btn--outline {
  background: transparent;
  color: #000;
  border: 2px solid #000 !important;
  border-radius: 1000px;
  box-shadow: 5px 5px 0 #000;
}

.borrower-svc .svc-hero-actions .btn--outline svg {
  order: 2;   /* live puts the icon after the label */
}

/* Clever section: logo icon sits 8px higher than on the broker template, full-width image, 52px heading */
.borrower-svc .svc-clever::before {
  background-position: 130px 36px;
}

.borrower-svc .svc-clever-image img {
  width: 100%;
}

.borrower-svc .svc-clever-content h2 {
  font-size: 52px;
  line-height: 52px;
  text-transform: capitalize;
}

/* Overview sections (text + image, no logo icon): 60px gap, 62px heading */
.borrower-svc .svc-clever--no-bg {
  padding: 100px 0;
}

.borrower-svc .svc-clever--no-bg .svc-clever-inner {
  gap: 60px;
}

.borrower-svc .svc-clever--no-bg .svc-clever-image,
.borrower-svc .svc-clever--no-bg .svc-clever-content {
  flex: 0 0 calc(50% - 30px);
  max-width: calc(50% - 30px);
}

.borrower-svc .svc-clever--no-bg .svc-clever-content h2 {
  font-size: 62px;
  line-height: 62px;
}

/* Process section */
.borrower-svc .svc-process {
  background: #67EEBC;
}

.borrower-svc .svc-process h2,
.borrower-svc .svc-process-subtitle,
.borrower-svc .svc-process-step h3,
.borrower-svc .svc-process-step p {
  color: #000;
}

.borrower-svc .svc-process-step {
  background: #8AFFD4;
}

.borrower-svc .svc-process-icon {
  width: 100px;
  height: 100px;
  color: #000;
}

.borrower-svc .svc-process-icon svg {
  fill: #000;
}

.borrower-svc .svc-process-icon img {
  filter: none;
}

/* Legacy curve markup on one-off pages */
.borrower-svc .svc-hero-curve svg path {
  fill: #ffffff;
}

.borrower-svc.page-about .svc-hero-curve svg path {
  fill: #F8F8F8;
}

.borrower-svc .svc-process-curve--top path,
.borrower-svc .svc-process-curve--bottom path,
.borrower-svc .svc-enquiry-curve--top path,
.borrower-svc .svc-enquiry-curve--bottom path {
  fill: #7BF4C6;
}

/* Enquiry section: mint background, black type, bordered buttons and form card */
.borrower-svc .svc-enquiry {
  background: #69ECBC;
}

.borrower-svc .svc-enquiry-inner {
  padding: 85px 0 100px;   /* live: 75px + the 10px flex gap left by an empty first widget */
}

.borrower-svc .svc-enquiry-inner h2 {
  color: #000;
  text-transform: capitalize;
  margin-bottom: 30px;   /* 20px widget margin + 10px container gap */
}

.borrower-svc .svc-enquiry-desc {
  color: #000;
  font-size: 18px;
  line-height: 27px;
}

.borrower-svc .svc-enquiry-actions .btn--outline {
  background: #fff;
  color: #000;
  border: 2px solid #000 !important;
  box-shadow: 5px 5px 0 #000;
}

.borrower-svc .svc-enquiry-actions .btn--primary {
  background: #67EEBC !important;
  color: #000 !important;
  border: 2px solid #000 !important;
  box-shadow: 3px 4px 0 #000;
  text-transform: capitalize;
}

.borrower-svc .svc-enquiry-form {
  margin: 60px 7px 7px 2px;
}

/* Use-case cards inside a clever-style section (borrower bridging / buy-to-let): 2x2 grey tiles */
.svc-usecases {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 34.4px;   /* collapses with the paragraph margin: 14.4px plus the 20px widget gap */
}

.svc-usecase {
  background: #F5F5F5;
  border-radius: 20px;
  padding: 25px;
}

.borrower-svc .svc-clever-content .svc-usecase h3 {
  font-size: 24px;
  line-height: 24px;
  font-weight: 900;
  text-transform: capitalize;
  margin: 0 0 10px;
  color: #000;
}

.borrower-svc .svc-clever-content .svc-usecase p {
  font-size: 18px;
  line-height: 27px;
  margin: 0 0 14.4px;
  color: #000;
}


/* Icon illustration (512px svg) centred in the image column */
.svc-clever-image--icon img,
.borrower-svc .svc-clever-image--icon img {
  width: 512px;
  max-width: 100%;
  margin: 0 auto;
}

/* Criteria sections on borrower pages: intro/outro paragraphs, image 90% wide and centred */
.svc-criteria-list > p {
  font-size: 18px;
  line-height: 27px;
  margin: 0 0 14.4px;
  color: #000;
}

.borrower-svc .svc-criteria-image img {
  width: 90%;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .svc-usecases {
    grid-template-columns: 1fr;
  }

  .svc-clever-image--icon img,
  .borrower-svc .svc-clever-image--icon img {
    width: 100%;
  }

  .borrower-svc .svc-criteria-image img {
    width: 100%;
  }
}

/* ---- Bespoke borrower sections (bridging, buy-to-let, complex income, development finance) ---- */

/* Complex income: larger logo icon behind the "Why use" section */
.borrower-svc .svc-clever--logo-lg::before {
  background-size: 35% auto;
  background-position: 130px 29px;
}

/* Criteria images that span the full column on live (buy-to-let, development finance) */
.borrower-svc .svc-criteria-image--full img {
  width: 100%;
}

/* "Real Outcomes We've Delivered" (buy-to-let): icon-box cards + icon illustration */
.svc-outcomes {
  padding: 100px 0;
}

.svc-outcomes .container {
  max-width: 1420px;
  padding: 0 10px;
}

.svc-outcomes-inner {
  display: flex;
  gap: 80px;
  align-items: center;
}

.svc-outcomes-list,
.svc-outcomes-image {
  flex: 0 0 calc(50% - 40px);
  max-width: calc(50% - 40px);
}

.svc-outcomes-list h2 {
  font-size: 52px;
  line-height: 52px;
  font-weight: 900;
  margin: 0 0 30px;
  color: #000;
}

.svc-outcome {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  background: #F8F8F8;
  border-radius: 15px;
  padding: 25px;
  margin-bottom: 20px;
}

.svc-outcome-icon {
  flex: 0 0 65px;
  width: 65px;
  height: 65px;
}

.svc-outcome-icon svg {
  width: 100%;
  height: 100%;
  display: block;
  fill: #000;
}

.svc-outcome-body h3 {
  font-size: 28px;
  line-height: 28px;
  font-weight: 800;
  margin: 8px 0 15px;
  color: #000;
}

.svc-outcome-body p {
  font-size: 18px;
  line-height: 27px;
  color: #000;
  margin: 0;
}

.svc-outcomes-note {
  font-size: 16px;
  line-height: 24px;
  color: #000;
  margin: 0 0 14.4px;
}

.svc-outcomes-image img {
  width: 55%;
  max-width: 55%;
  display: block;
  margin: 0 auto;
}

/* Mint panels (complex income): one or two rounded cards per row */
.svc-panels {
  padding: 100px 0;
  background: #fff;
}

.svc-panels .container {
  max-width: 1420px;
  padding: 0 10px;
}

.svc-panels-row {
  display: flex;
  gap: 20px;
}

.svc-panel {
  flex: 1 1 0;
  min-width: 0;
  background: #E5FFF5;
  border-radius: 30px;
  padding: 30px;
}

.svc-panel h2 {
  font-size: 42px;
  line-height: 42px;
  font-weight: 900;
  text-transform: capitalize;
  margin: 0 0 30px;
  color: #000;
}

.svc-panel p,
.svc-panel li {
  font-size: 18px;
  line-height: 27px;
  color: #000;
}

.svc-panel p {
  margin: 0 0 14.4px;
}

.svc-panel ul {
  list-style: disc;
  padding-left: 40px;
  margin: 0 0 14.4px;
}

.svc-panel ul ul {
  margin: 0;
}

/* Full-width text block (development finance): h2 + paragraphs, 80px padding */
.svc-textblock {
  padding: 80px 0;
  background: #fff;
}

.svc-textblock .container {
  max-width: 1420px;
  padding: 0 10px;
}

.svc-textblock h2 {
  font-size: 52px;
  line-height: 52px;
  font-weight: 900;
  text-transform: capitalize;
  margin: 0 0 30px;
  color: #000;
}

.svc-textblock p,
.svc-textblock li {
  font-size: 18px;
  line-height: 27px;
  color: #000;
}

.svc-textblock p {
  margin: 0 0 14.4px;
}

.svc-textblock p + h2,
.svc-textblock ul + h2 {
  margin-top: 34.4px;   /* 20px widget gap after the 14.4px paragraph margin */
}

.svc-textblock ul {
  list-style: disc;
  padding-left: 40px;
  margin: 0 0 14.4px;
}

.svc-textblock a,
.svc-panel a,
.svc-usecase a,
.svc-criteria-list a,
.svc-clever-content a {
  color: #583181;
  font-weight: 600;
}

/* FAQ block on a grey background (complex income): white curve in at the top */
.svc-faq--grey {
  background: #F5F5F5;
  overflow: hidden;
}

.svc-faq--grey .intro-shape--top svg {
  width: calc(131% + 1.3px);
  height: 99px;
}

@media (max-width: 768px) {
  .svc-outcomes {
    padding: 50px 0;
  }

  .svc-outcomes .container,
  .svc-panels .container,
  .svc-textblock .container {
    padding: 0 20px;
  }

  .svc-outcomes-inner {
    flex-direction: column;
    gap: 20px;
  }

  .svc-outcomes-list,
  .svc-outcomes-image {
    flex: none;
    max-width: 100%;
    width: 100%;
  }

  .svc-outcomes-list h2 {
    font-size: 42px;
    line-height: 42px;
  }

  .svc-outcome-body h3 {
    font-size: 24px;
    line-height: 24px;
  }

  .svc-panels,
  .svc-textblock {
    padding: 50px 0;
  }

  .svc-panels-row {
    flex-direction: column;
  }

  .svc-panel h2 {
    font-size: 32px;
    line-height: 32px;
  }

  .svc-textblock h2 {
    font-size: 38px;
    line-height: 38px;
  }
}

/* Borrower mobile: logo icon position behind the clever sections, bespoke section paddings */
@media (max-width: 768px) {
  .borrower-svc .svc-clever::before {
    background-size: 91% auto;
    background-position: 47px 447px;
  }

  .borrower-svc .svc-clever--logo-lg::before {
    background-size: 102% auto;
    background-position: 47px 526px;
  }

  .svc-hero--small-copy p {
    font-size: 16px;
    line-height: 22.4px;
  }

  .svc-outcomes-inner {
    gap: 40px;
  }

  .svc-outcomes-image img {
    width: 100%;
    max-width: 100%;
  }

  .svc-panels {
    padding: 75px 0 50px;
  }

  .svc-panels--last {
    padding-bottom: 0;
  }

  .svc-textblock {
    padding: 80px 0;
  }

  .svc-textblock .container {
    padding: 0 10px;
  }

  .svc-textblock h2 {
    font-size: 42px;
    line-height: 42px;
  }
}

/* Borrower footer */
.borrower-svc .site-footer {
  background: #F8F8F8;
  color: #000;
}

.borrower-svc .site-footer .footer-brand p,
.borrower-svc .site-footer .footer-col ul li a,
.borrower-svc .site-footer .footer-col h4 {
  color: #000;
}

.borrower-svc .site-footer .footer-social a {
  color: #56317D;
}

/* Mobile */
@media (max-width: 768px) {
  .borrower-svc .svc-hero {
    padding: 125px 0 90px;   /* live label sits 125px from the top (135px padding, -35px margin, 85px header) */
  }

  .borrower-svc .svc-hero::after {
    background-position: -47px 671px;
    background-size: 150% auto;
  }

  .borrower-svc .hero--home h1 {
    font-size: 52px;
    font-weight: 900;
  }

  .borrower-svc .svc-clever-content h2 {
    font-size: 42px;
    line-height: 42px;
  }

  .borrower-svc .svc-clever--no-bg {
    padding: 50px 0;
  }

  .borrower-svc .svc-clever--no-bg .svc-clever-inner {
    gap: 20px;
  }

  .borrower-svc .svc-clever--no-bg .svc-clever-image,
  .borrower-svc .svc-clever--no-bg .svc-clever-content {
    flex: none;
    max-width: 100%;
  }

  .borrower-svc .svc-clever--no-bg .svc-clever-content h2 {
    font-size: 38px;
    line-height: 38px;
  }

  .borrower-svc .svc-process h2 {
    font-size: 42px;
    line-height: 42px;
  }

  .borrower-svc .svc-process-icon {
    width: 70px;
    height: 70px;
  }

  .borrower-svc .svc-faq h2,
  .borrower-svc .svc-enquiry-inner h2 {
    font-size: 42px;
    line-height: 42px;
  }

  .borrower-svc .svc-faq .faq-question {
    font-size: 24px;
    line-height: 36px;
  }

  .borrower-svc .svc-faq .faq-question::after {
    flex-basis: 19px;   /* live: 7px icon box (19px svg overflowing) + 10px gap → 318px question width */
    width: 19px;
    height: 19px;
    margin-left: -2px;
  }

  .borrower-svc .svc-enquiry-inner {
    padding: 60px 0 50px;   /* live: an empty first widget leaves a 10px flex gap above the heading */
  }

  .borrower-svc .svc-enquiry-form {
    margin: 40px 7px 10px 1px;
  }

}

@media (max-width: 1024px) {
  /* Borrower mobile menu container - match the header's border + drop shadow */
  .borrower-svc .header-nav {
    border: 3px solid #000;
    box-shadow: 5px 5px 0 #000;
  }
}

/* Borrower header */
.borrower-svc .site-header {
  border: 3px solid #000;
  box-shadow: 5px 5px 0 #000;
}

.borrower-svc .btn-switcher {
  border: 3px solid #000 !important;
  box-shadow: 3px 4px 0 #000;
}

.borrower-svc .btn-switcher:hover {
  box-shadow: none;
}

/* The search icon and the open search bar carry no outline or shadow on the borrower header */
.borrower-svc .btn-search,
.borrower-svc .header-search {
  border: none !important;
  box-shadow: none !important;
}

/* Borrower mega menu */
.borrower-svc .dropdown-menu {
  border: 3px solid #000 !important;
  box-shadow: 5px 5px 0 #000 !important;
  overflow: visible !important;
}

.borrower-svc .dropdown-grid {
  padding-bottom: 6px;
}

.borrower-svc .dropdown-item {
  border: 2px solid #000 !important;
  box-shadow: 3px 4px 0 #000;
  transition: box-shadow 0.2s ease;
}

.borrower-svc .dropdown-item:hover {
  box-shadow: none;
}

.borrower-svc .dropdown-cta {
  border: 3px solid #000;
  box-shadow: 5px 5px 0 #000;
}

/* Mobile: strip border + drop shadow from sub menu */
@media (max-width: 768px) {
  .borrower-svc .dropdown-menu,
  .borrower-svc .dropdown-menu--simple,
  .borrower-svc .dropdown-item,
  .borrower-svc .dropdown-cta {
    border: none !important;
    box-shadow: none !important;
  }
}

/* Borrower buttons */
.borrower-svc .btn {
  border: 3px solid #000 !important;
  box-shadow: 3px 4px 0 #000;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.borrower-svc .btn:hover {
  box-shadow: none;
}

/* Keep outline button colors on hover (only drop shadow disappears) */
.borrower-svc .btn--outline:hover {
  background: transparent;
  color: #000;
}

.borrower-svc .svc-enquiry-actions .btn--outline:hover {
  background: #fff;
  color: #000;
}

.borrower-svc .btn--purple {
  background: #67EEBC !important;
  color: #000 !important;
  border-color: #000 !important;
}

.borrower-svc .btn--purple:hover {
  background: #50d9a0 !important;
}

/* Borrower homepage hero */
.borrower-svc .hero--home h1 {
  font-size: 92px;
  font-weight: 900;
}

/* Borrower homepage last pledge tile */
.borrower-svc .pledge-card--cta {
  background: var(--color-purple) !important;
  color: #fff;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  text-align: left !important;
  padding: 25px !important;
  position: relative;
  overflow: hidden;
  min-height: 280px;
}

.borrower-svc .pledge-card--cta h4 {
  color: #fff;
  font-size: 32px;
  font-weight: 700;
  position: relative;
  z-index: 2;
  margin-bottom: 4px;
  margin-top: auto;
}

.borrower-svc .pledge-card--cta .phone-number {
  font-size: 48px;
  font-weight: 900;
  margin-top: 0;
  position: relative;
  z-index: 2;
  white-space: nowrap;
}

@media (max-width: 768px) {
  .borrower-svc .pledge-card--cta {
    min-height: 0;
  }

  .borrower-svc .pledge-card--cta h4 {
    font-size: 28px;
    font-weight: 700;
  }

  .borrower-svc .pledge-card--cta .phone-number,
  .borrower-svc .pledge-card--cta .phone-digits {
    font-size: 38px;
    font-weight: 900;
  }
}

.borrower-svc .pledge-card--cta .phone-label {
  color: #fff;
}

.borrower-svc .pledge-card--cta .phone-digits {
  color: #67EEBC;
}

.borrower-svc .pledge-card--cta::after {
  content: '';
  position: absolute;
  right: -30px;
  bottom: -30px;
  width: 220px;
  height: 220px;
  background: url('../brand/Logos & Icons/Blue-Icon.svg') no-repeat center;
  background-size: contain;
  opacity: 0.25;
  z-index: 1;
}

/* Borrower CTA section - same purple style as broker */
.borrower-svc .cta-section--broker {
  background: transparent;
}

.borrower-svc .cta-section-inner .cta-illustration {
  background: url('../brand/Logos & Icons/Blue-Icon.svg') no-repeat center;
  background-size: contain;
  min-height: 400px;
}

.borrower-svc .cta-section-inner .cta-illustration img {
  display: none;
}

/* Enquiry form container */
.borrower-svc .svc-enquiry-form {
  border: 3px solid #000;
  box-shadow: 5px 5px 0 #000;
}

/* Pledge tiles */
.borrower-svc .pledge-card {
  border: 3px solid #000;
  box-shadow: 3px 4px 0 #000;
}

/* Ready tiles */
.borrower-svc .svc-ready-col {
  background: #d4fce8;
}

/* ========================================
   BORROWER ABOUT PAGE — mirrors live /borrowers/about-borrowers/
   ======================================== */
.borrower-svc.page-about .svc-hero::after { background-position: 1100px 32px; background-size: 50% auto; opacity: 1; }
.borrower-svc.page-about .svc-hero h1 { font-weight: 800; text-transform: capitalize; }
.borrower-svc.page-about .svc-hero-actions .btn--primary {
  background: #6C489B !important;
  color: #5BE1AF !important;
  border: 3px solid #000 !important;
  box-shadow: 3px 4px 0 #000;
}
.borrower-svc.page-about .svc-clever { background: #fff; }
.borrower-svc.page-about .svc-clever::before { background-position: 130px 22px; }
.borrower-svc.page-about .svc-clever-image::before { display: none; }
.borrower-svc.page-about .svc-clever-content h2 { font-size: 52px; line-height: 52px; }
.borrower-svc.page-about .section--team { background: #F8F8F8; padding: 100px 0; position: relative; overflow: hidden; }
.borrower-svc.page-about .section--team .intro-shape--top svg { width: calc(140% + 1.3px); height: 25px; }
.borrower-svc.page-about .section--team .container { max-width: 1420px; padding: 0 10px; position: relative; z-index: 1; }
.borrower-svc.page-about .about-team-heading { font-size: 52px; line-height: 52px; font-weight: 900; text-transform: capitalize; text-align: left; color: #000; margin: 0 0 40px; }
.borrower-svc.page-about .team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.borrower-svc.page-about .team-card { display: flex; flex-direction: column; align-items: flex-start; text-align: left; }
.borrower-svc.page-about .team-card-image {
  width: 396px;
  max-width: 100%;
  height: 400px;
  padding: 10px;
  border: 7px solid #000 !important;
  border-radius: 20px !important;
  margin: 0 0 20px;
  overflow: hidden;
  background: none;
  box-shadow: none;
}
.borrower-svc.page-about .team-card-image img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 8px; }
.borrower-svc.page-about .team-card h3 { font-size: 32px; line-height: 32px; font-weight: 800; color: #000; margin: 0 0 10px; }
.borrower-svc.page-about .team-card .team-role { font-size: 24px; line-height: 24px; font-weight: 600; color: #000; margin: 0 0 20px; display: block; }
.borrower-svc.page-about .team-card p { font-size: 16px; line-height: 24px; font-weight: 400; color: #000; margin: 0 0 14.4px; }

@media (max-width: 1024px) {
  .borrower-svc.page-about .svc-clever-image { display: none; }
  .borrower-svc.page-about .svc-clever-content { flex: none; max-width: 100%; width: 100%; }
}
@media (max-width: 768px) {
  .borrower-svc.page-about .svc-hero { padding: 100px 0 90px; }
  .borrower-svc.page-about .svc-hero h1 { font-weight: 800; }
  .borrower-svc.page-about .svc-clever { padding: 50px 0; }
  .borrower-svc.page-about .svc-clever::before { background-size: 275px auto; background-position: 126px 620px; }
  .borrower-svc.page-about .section--team { padding: 50px 0; }
  .borrower-svc.page-about .section--team .container { padding: 0 20px; }
  .borrower-svc.page-about .about-team-heading { font-size: 42px; line-height: 42px; text-align: center; }
  .borrower-svc.page-about .team-grid { grid-template-columns: 1fr; gap: 40px; }
  .borrower-svc.page-about .team-card-image { width: 302px; height: 250px; border-width: 10px !important; }
  .borrower-svc.page-about .team-card h3 { font-size: 28px; line-height: 28px; }
  .borrower-svc.page-about .team-card p { line-height: 19.2px; }
  .borrower-svc.page-about .svc-clever-content h2 { font-size: 38px; line-height: 38px; margin-bottom: 30px; }
  .borrower-svc.page-about .team-card:nth-child(4) .team-card-image { width: 335px; }
  .borrower-svc.page-about .team-card:nth-child(5) .team-card-image { width: 268px; }
}

/* Overview sections sit at the top of the row, beside a taller image */
.borrower-svc .svc-clever--no-bg .svc-clever-content { align-self: flex-start; }

/* Borrower buy-to-let: the first section is a wider box, 25px clear of its neighbours, with the photo at the top */
@media (min-width: 768px) {
  .svc-clever--wide { margin: 25px 0; }
  .svc-clever--wide .container { padding: 0 20px; }
  .svc-clever--wide .svc-clever-inner { align-items: flex-start; }
  .svc-clever--wide .svc-clever-image img { width: 100%; }
}

/* Copy sizes used on the enquiry block of the commercial, inheritance and bridging pages */
.borrower-svc .svc-enquiry--tight .svc-enquiry-desc { line-height: 25.2px; }
@media (max-width: 767px) {
  .borrower-svc .svc-enquiry--tight .svc-enquiry-desc { font-size: 16px; line-height: 22.4px; }
  .svc-outcome h3 { font-size: 24px; line-height: 26.4px; }
  .svc-outcome p { font-size: 16px; line-height: 24px; }
}

/* Second and third outcome titles carry a 5px line height on live (desktop) */
@media (min-width: 768px) {
  .svc-outcome + .svc-outcome h3 { line-height: 5px; }
}

/* Borrower buy-to-let on phones: inset box, small photo, Trustpilot moves below the section */
.trustpilot-section--after { display: none; }
@media (max-width: 767px) {
  .trustpilot-section--before { display: none; }
  .trustpilot-section--after { display: block; padding: 0 20px 50px; }
  .svc-clever--wide { padding-top: 50px; }
  .svc-clever--wide .container { padding: 0 40px; }
  .svc-clever--wide .svc-clever-image { align-self: flex-start; }
  .svc-clever--wide .svc-clever-image img { width: 75%; }
}