/* SENLARO V4 visual repair — PRIVATE PREVIEW, 21 Oct 2026.
   Based on LIVE 7.18.156, appended AFTER sitewide V3.
   Only opt-in body.sn-v4-visual. No CRM, form JS, price or legal changes.
   Fix: contrast, 800px narrow two-column CTA collision, wasted whitespace. */
body.sn-brand-v3.sn-v4-visual {
  --sn4-ink: #0b1c2c;
  --sn4-text: #314751;
  --sn4-muted: #526571;
  --sn4-line: #d7e4de;
  --sn4-soft: #eef4f1;
  --sn4-pearl: #f8f7f3;
}

/* Editorial rhythm: less empty height, full-size but readable sections. */
body.sn-brand-v3.sn-v4-visual--landing main .section:not([data-form-section]) {
  padding-block: clamp(46px, 5vw, 74px);
}
body.sn-brand-v3.sn-v4-visual--landing main .section.section--tight {
  padding-block: clamp(18px, 2.8vw, 32px);
}
body.sn-brand-v3.sn-v4-visual--landing main .section:not([data-form-section]) > .container.container--narrow {
  max-width: 1180px;
}
body.sn-brand-v3.sn-v4-visual--landing main .section:not([data-form-section]) .section-head {
  max-width: 850px;
  margin-bottom: 28px;
}
body.sn-brand-v3.sn-v4-visual--landing main .section:not([data-form-section]) .section-head h2 {
  color: var(--sn4-ink);
  font-size: clamp(27px, 2.65vw, 36px);
  line-height: 1.17;
  letter-spacing: -.027em;
}
body.sn-brand-v3.sn-v4-visual--landing main .section:not([data-form-section]) .section-head__lead {
  max-width: 760px;
  color: var(--sn4-muted);
  font-size: clamp(16px, 1.5vw, 18px);
  line-height: 1.57;
}
body.sn-brand-v3.sn-v4-visual--landing main .section:not([data-form-section]) > .container > p {
  max-width: 850px;
  color: var(--sn4-text);
  font-size: 17px;
  line-height: 1.62;
}
body.sn-brand-v3.sn-v4-visual--landing main .section:not([data-form-section]) > .container > p + p {
  margin-top: 15px;
}
body.sn-brand-v3.sn-v4-visual--landing main .section--cloud {
  background: var(--sn4-soft);
}

/* Six actual fact cards should not look like disjointed footnotes. */
body.sn-brand-v3.sn-v4-visual--landing main .advantage-grid {
  gap: 15px;
}
body.sn-brand-v3.sn-v4-visual--landing main .advantage {
  min-width: 0;
  background: #fff;
  border: 1px solid var(--sn4-line);
  border-radius: 20px;
  padding: 25px 24px;
  box-shadow: 0 8px 30px rgba(11, 28, 44, .035);
}
body.sn-brand-v3.sn-v4-visual--landing main .advantage__title {
  color: var(--sn4-ink);
  margin: 0 0 10px;
  line-height: 1.3;
  font-size: 19px;
}
body.sn-brand-v3.sn-v4-visual--landing main .advantage__text {
  color: var(--sn4-text);
  line-height: 1.6;
  font-size: 15px;
}

/* Critical live defect: trust-list inherited WHITE text from dark trust panel.
   On these landing pages it sits on an almost white canvas. */
body.sn-brand-v3.sn-v4-visual--landing main .section:not(.section--inverse) .trust-list {
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
body.sn-brand-v3.sn-v4-visual--landing main .section:not(.section--inverse) .trust-list li {
  min-width: 0;
  color: #283e4a;
  background: #fff;
  border: 1px solid var(--sn4-line);
  border-radius: 18px;
  padding: 20px 23px 20px 47px;
  font-size: 16px;
  line-height: 1.55;
  box-shadow: 0 7px 23px rgba(11, 28, 44, .035);
}
body.sn-brand-v3.sn-v4-visual--landing main .section:not(.section--inverse) .trust-list li::before {
  top: 27px;
  left: 23px;
  width: 7px;
  height: 7px;
  background: #0e7c70;
}

/* Informational sections: generous text width without 350px of empty canvas. */
body.sn-brand-v3.sn-v4-visual--landing main .section[aria-labelledby="limits"],
body.sn-brand-v3.sn-v4-visual--landing main .section[aria-labelledby="service-limits"] {
  padding-block: clamp(50px, 5vw, 68px);
}
body.sn-brand-v3.sn-v4-visual--landing main .section[aria-labelledby="limits"] p,
body.sn-brand-v3.sn-v4-visual--landing main .section[aria-labelledby="service-limits"] p {
  max-width: 850px;
}
body.sn-brand-v3.sn-v4-visual--landing main .card-grid {
  gap: 18px;
}
body.sn-brand-v3.sn-v4-visual--landing main .card-grid .card {
  min-width: 0;
  padding: clamp(22px, 3vw, 32px);
  border: 1px solid var(--sn4-line);
  box-shadow: 0 9px 30px rgba(11, 28, 44, .04);
}
body.sn-brand-v3.sn-v4-visual--landing main .card-grid .card h3 {
  color: var(--sn4-ink);
}
body.sn-brand-v3.sn-v4-visual--landing main .card-grid .card p {
  color: var(--sn4-text);
  line-height: 1.6;
}

/* Related offer is intentionally quiet, not a second giant blank landing. */
body.sn-brand-v3.sn-v4-visual--landing main .sn-v4-related .cta-band {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 22px;
  align-items: center;
  background: linear-gradient(105deg, #edf4ef, #f8f7f3);
  color: var(--sn4-ink);
  border: 1px solid var(--sn4-line);
  border-radius: 22px;
  padding: clamp(26px, 3.7vw, 39px);
}
body.sn-brand-v3.sn-v4-visual--landing main .sn-v4-related .cta-band h2 {
  color: var(--sn4-ink);
  font-size: clamp(25px, 2.3vw, 31px);
  line-height: 1.18;
  margin: 0 0 11px;
  max-width: 650px;
}
body.sn-brand-v3.sn-v4-visual--landing main .sn-v4-related .cta-band__text {
  max-width: 700px;
  color: var(--sn4-text);
  font-size: 16px;
  line-height: 1.55;
  margin: 0;
}
body.sn-brand-v3.sn-v4-visual--landing main .sn-v4-related .btn-row {
  min-width: 0;
}

/* Finish CTA: use almost full site width, not a two-column layout INSIDE 800px.
   One clear commercial conclusion, deliberate navy contrast, functional buttons. */
body.sn-brand-v3.sn-v4-visual main .sn-v4-final > .container.container--narrow {
  max-width: 1180px;
}
body.sn-brand-v3.sn-v4-visual main .sn-v4-final .cta-band {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
  align-items: center;
  column-gap: clamp(24px, 4.5vw, 64px);
  row-gap: 23px;
  min-width: 0;
  background: linear-gradient(112deg, #0b1c2c, #163948);
  border: 1px solid #1b4150;
  border-radius: 25px;
  padding: clamp(29px, 4vw, 48px);
  box-shadow: 0 12px 45px rgba(11, 28, 44, .11);
}
body.sn-brand-v3.sn-v4-visual main .sn-v4-final .cta-band > div {
  min-width: 0;
}
body.sn-brand-v3.sn-v4-visual main .sn-v4-final .cta-band h2 {
  max-width: 720px;
  margin: 0 0 12px;
  color: #fff;
  font-size: clamp(27px, 2.7vw, 37px);
  line-height: 1.17;
  letter-spacing: -.026em;
  text-wrap: balance;
}
body.sn-brand-v3.sn-v4-visual main .sn-v4-final .cta-band__text {
  max-width: 720px;
  margin: 0;
  color: #e1ecea;
  line-height: 1.6;
  font-size: 16px;
}
body.sn-brand-v3.sn-v4-visual main .sn-v4-final .btn-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 11px;
  min-width: 0;
}
body.sn-brand-v3.sn-v4-visual main .sn-v4-final .btn-row .btn {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  white-space: normal;
  text-align: center;
  line-height: 1.28;
  padding: 13px 16px;
}
body.sn-brand-v3.sn-v4-visual main .sn-v4-final .btn--primary {
  background: #b5ebd9;
  color: #0b1c2c;
  border-color: #b5ebd9;
}
body.sn-brand-v3.sn-v4-visual main .sn-v4-final .btn--primary:hover {
  background: #d2f5e8;
  border-color: #d2f5e8;
}
body.sn-brand-v3.sn-v4-visual main .sn-v4-final .btn--secondary {
  color: #fff;
  border-color: #68848d;
  background: transparent;
}
body.sn-brand-v3.sn-v4-visual main .sn-v4-final .btn--secondary:hover {
  background: #264452;
  border-color: #8fa9af;
}
body.sn-brand-v3.sn-v4-visual main .sn-v4-final {
  padding-block: clamp(19px, 3.3vw, 42px);
}

/* Home: existing hero and catalog preserved; only final CTA gets repair. */
body.sn-brand-v3.sn-v4-visual.page-home main .sn-v4-final {
  padding-block: clamp(25px, 3vw, 38px);
}

/* Maintain composition at tablet and true phones. */
@media (max-width: 900px) {
  body.sn-brand-v3.sn-v4-visual main .sn-v4-final .cta-band,
  body.sn-brand-v3.sn-v4-visual--landing main .sn-v4-related .cta-band {
    grid-template-columns: minmax(0, 1fr);
    padding: 27px;
  }
  body.sn-brand-v3.sn-v4-visual main .sn-v4-final .btn-row {
    flex-direction: row;
    flex-wrap: wrap;
  }
  body.sn-brand-v3.sn-v4-visual main .sn-v4-final .btn-row .btn {
    flex: 1 1 220px;
  }
}
@media (max-width: 700px) {
  body.sn-brand-v3.sn-v4-visual--landing main .section:not([data-form-section]) {
    padding-block: 38px;
  }
  body.sn-brand-v3.sn-v4-visual--landing main .section.section--tight {
    padding-block: 18px;
  }
  body.sn-brand-v3.sn-v4-visual--landing main .section:not(.section--inverse) .trust-list {
    grid-template-columns: minmax(0, 1fr);
  }
  body.sn-brand-v3.sn-v4-visual--landing main .advantage {
    padding: 21px;
  }
  body.sn-brand-v3.sn-v4-visual main .sn-v4-final .cta-band,
  body.sn-brand-v3.sn-v4-visual--landing main .sn-v4-related .cta-band {
    border-radius: 21px;
    padding: 25px 21px;
  }
  body.sn-brand-v3.sn-v4-visual main .sn-v4-final .btn-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
  }
  body.sn-brand-v3.sn-v4-visual main .sn-v4-final .btn-row .btn {
    width: 100%;
    min-width: 0;
  }
}


/* Independent screenshot review: desktop shell was wrapping navigation and phone
   into two lines at 1440px. Keep each desktop control atomic; use the existing
   burger below 1280px instead of squeezed desktop text. */
@media (min-width:1280px) {
  body.sn-brand-v3.sn-v4-visual .header__inner {
    max-width: 1440px;
    gap: 8px;
  }
  body.sn-brand-v3.sn-v4-visual .header__nav {
    flex: 0 0 auto;
    gap: 0;
    margin-left: clamp(7px,1.4vw,18px);
  }
  body.sn-brand-v3.sn-v4-visual .header__nav-link {
    flex: 0 0 auto;
    white-space: nowrap;
    padding-inline: clamp(6px,.65vw,10px);
    font-size: 14px;
  }
  body.sn-brand-v3.sn-v4-visual .header__actions {
    flex: 0 0 auto;
    gap: 5px;
    margin-left: auto;
  }
  body.sn-brand-v3.sn-v4-visual .header__phone {
    white-space: nowrap;
    font-size: 13px;
    padding-inline: 4px;
  }
  body.sn-brand-v3.sn-v4-visual .header__cta {
    flex: 0 0 auto;
    white-space: nowrap;
    padding-inline: 14px;
    font-size: 13px;
  }
  body.sn-brand-v3.sn-v4-visual .header__socials { gap: 4px; }
}


/* SENLARO V4 PRIVATE CORRECTIONS — 2026-10-22. NO DEPLOY.
   Scoped changes for Home dark trust panel and landing hero headings. */
body.sn-brand-v3.sn-v4-visual.page-home .home-important .section-head h2#doverie {
  color: #fff;
  font-size: clamp(28px, 2.7vw, 38px);
  line-height: 1.17;
  letter-spacing: -.025em;
  max-width: 22ch;
  margin: 0 0 14px;
}
body.sn-brand-v3.sn-v4-visual.page-home .home-important .section-head__lead {
  color: #dbe6e4;
  font-size: clamp(15px, 1.24vw, 17px);
  line-height: 1.6;
  max-width: 49ch;
}
body.sn-brand-v3.sn-v4-visual.page-home .home-important {
  padding-block: clamp(42px, 4.3vw, 64px);
}
@media (min-width: 1100px) {
  body.sn-brand-v3.sn-v4-visual.page-home .home-important__grid {
    grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
    gap: clamp(28px, 3.5vw, 52px);
    align-items: center;
  }
}
body.sn-brand-v3.sn-v4-visual.page-home .home-important .trust-list {
  gap: 10px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
}
body.sn-brand-v3.sn-v4-visual.page-home .home-important .trust-list li {
  border: 1px solid rgba(223, 243, 239, .18);
  border-radius: 14px;
  background: rgba(255,255,255,.045);
  color: #e1e9e9;
  font-size: 15px;
  line-height: 1.52;
  padding: 16px 17px 16px 35px;
}
body.sn-brand-v3.sn-v4-visual.page-home .home-important .trust-list li::before {
  top: 24px;
  left: 17px;
}
@media (min-width: 768px) and (max-width: 1099px) {
  body.sn-brand-v3.sn-v4-visual.page-home .home-important__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }
}
@media (max-width: 767px) {
  body.sn-brand-v3.sn-v4-visual.page-home .home-important__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
  }
  body.sn-brand-v3.sn-v4-visual.page-home .home-important .trust-list {
    grid-template-columns: minmax(0, 1fr);
    gap: 9px;
  }
  body.sn-brand-v3.sn-v4-visual.page-home .home-important .trust-list li {
    padding: 16px 16px 16px 34px;
  }
}

/* Long-form product headings: visual wrapping only, preserve SEO copy. */
body.sn-brand-v3.sn-v4-visual--landing .page-hero__title {
  max-width: 660px;
  font-size: clamp(32px, 3.45vw, 49px);
  line-height: 1.115;
  letter-spacing: -.031em;
  text-wrap: balance;
}
@media (max-width: 740px) {
  body.sn-brand-v3.sn-v4-visual--landing .page-hero__title {
    font-size: clamp(31px, 8vw, 37px);
    line-height: 1.10;
    max-width: 100%;
  }
}
