/* ============================================================
   Life Adviser — brand overrides, loaded after the cloned theme CSS.
   This is the place for post-rebrand theme tweaks.
   ============================================================ */

/* Header logo: tightly cropped lockup */
.sn-logo img{height:32px !important; width:auto !important}
@media (max-width:900px){ .sn-logo img{height:26px !important} }
@media (max-width:480px){ .sn-logo img{height:23px !important} }

/* Footer + quote-funnel white logo: sized for the longer "Life Adviser" wordmark */
footer img[src*="lifeadviser-white"]{max-width:180px !important; width:180px !important; height:auto !important}
header img.dark[src*="lifeadviser-white"]{max-height:30px !important; width:auto !important}

/* Quote wizard header logo */
.sq-logo{height:34px !important; width:auto !important}


/* ============================================================
   Interactive guide tools (.la-tool)
   ============================================================ */
.la-tool{border:1px solid #e7e4f2;border-radius:18px;padding:26px;margin:28px 0;background:#fbfaff}
.la-tool h3{margin:0 0 6px;font-size:1.25rem;color:#1a0f33}
.la-tool .la-intro{margin:0 0 18px;color:#6b6478;font-size:.97rem}
.la-tool .la-field{margin-bottom:16px}
.la-tool label{display:block;font-weight:700;color:#1a0f33;margin-bottom:6px;font-size:.92rem}
.la-tool input[type=number],.la-tool select{width:100%;padding:12px 14px;border:1.5px solid #e0dcef;
  border-radius:10px;font:inherit;font-size:1rem;background:#fff;box-sizing:border-box}
.la-tool input:focus,.la-tool select:focus{outline:none;border-color:#d40074;box-shadow:0 0 0 3px rgba(212,0,116,.13)}
.la-tool .la-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:640px){.la-tool .la-grid{grid-template-columns:1fr}}
.la-tool .la-out{margin-top:20px;background:#36027a;color:#fff;border-radius:14px;padding:22px}
.la-tool .la-out .la-big{font-size:2.1rem;font-weight:800;line-height:1.1;margin:2px 0 4px}
.la-tool .la-out .la-lab{font-size:.85rem;opacity:.82;text-transform:uppercase;letter-spacing:.08em}
.la-tool .la-out p{margin:.6rem 0 0;font-size:.95rem;opacity:.95}
.la-tool .la-row{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.18);font-size:.95rem}
.la-tool .la-row:last-child{border-bottom:0}
.la-tool .la-note{margin-top:12px;font-size:.82rem;color:#6b6478}
.la-tool .la-verdict{margin-top:14px;padding:14px 16px;border-radius:10px;background:#fff;border-left:4px solid #d40074;font-size:.95rem;color:#1a0f33}

/* ============================================================
   Homepage hero: bleed family photo + scrolling insurer marquee
   ============================================================ */
/* desktop: give the hero photo more of the row so the family reads larger */
@media (min-width:901px){
  .surely-min .hero{grid-template-columns:.9fr 1.1fr;column-gap:44px}
}
.hero-art{display:flex;justify-content:center;align-items:center}
.la-hero-img{width:100%;max-width:660px;height:auto;display:block;border-radius:0;padding:0;background:none;aspect-ratio:auto}

/* Insurer logo marquee — single line, slow continuous auto-scroll */
.surely-min .logo-marquee{margin:6px 0 48px}
.surely-min .logo-marquee__cap{margin:0 0 22px;text-align:center;font-size:.8rem;font-weight:600;
  letter-spacing:.05em;text-transform:uppercase;color:#736e7f}
.surely-min .logo-marquee__viewport{position:relative;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)}
.surely-min .logo-marquee__track{list-style:none;margin:0;padding:0;display:flex;align-items:center;
  width:max-content;animation:la-marquee 45s linear infinite;will-change:transform}
.surely-min .logo-marquee__viewport:hover .logo-marquee__track{animation-play-state:paused}
.surely-min .logo-marquee__track li{flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  height:54px;padding:0 38px}
.surely-min .logo-marquee__track img{width:auto;height:auto;display:block;opacity:.9}
.surely-min .logo-marquee__track .lg-aviva{max-height:27px}
.surely-min .logo-marquee__track .lg-legalgeneral{max-height:26px}
.surely-min .logo-marquee__track .lg-lv3{max-height:30px}
.surely-min .logo-marquee__track .lg-onefamily{max-height:29px}
.surely-min .logo-marquee__track .lg-scottishwidows{max-height:42px}
.surely-min .logo-marquee__track .lg-sunlife{max-height:32px}
.surely-min .logo-marquee__track .lg-vitality{max-height:40px}
.surely-min .logo-marquee__track .lg-zurich{max-height:29px}
@keyframes la-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

@media (max-width:900px){
  /* Hide the hero photo entirely on mobile/stacked layout */
  .surely-min .hero-art{display:none}
  .la-hero-img{max-width:540px}
  .surely-min .logo-marquee{margin:2px 0 40px}
}
@media (max-width:480px){
  .la-hero-img{max-width:100%}
  .surely-min .logo-marquee{margin:0 0 34px}
  .surely-min .logo-marquee__cap{margin-bottom:16px}
  .surely-min .logo-marquee__track li{height:44px;padding:0 26px}
}
@media (prefers-reduced-motion:reduce){
  .surely-min .logo-marquee__track{animation:none;flex-wrap:wrap;justify-content:center;width:auto;gap:20px 40px}
  .surely-min .logo-marquee__viewport{-webkit-mask-image:none;mask-image:none}
}
