/* =====================================================================
   ss-contentblocks.css — storefront + admin-preview styles for the easy
   "Content Sections" builder. Every rule is scoped under .ss-cb so it can
   never leak into the rest of the theme. Colors/fonts/spacing come from
   CSS custom properties and modifier classes set by the renderer
   (contentblocks_render.asp) and mirrored by the admin preview
   (ss-content-blocks-admin.js). Mobile-first and responsive.
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Lato:wght@400;700;900&family=Montserrat:wght@400;600;800&family=Oswald:wght@500;700&family=Playfair+Display:wght@600;800&family=Poppins:wght@400;600;800&family=Roboto:wght@400;500;700&display=swap');

.ss-cb{
  --cb-bg:transparent; --cb-fg:inherit; --cb-accent:#1f5fbf; --cb-accent-ink:#ffffff; --cb-radius:14px;
  --cb-line:rgba(127,140,160,.28);
  box-sizing:border-box; color:var(--cb-fg); background:var(--cb-bg);
  margin:18px 0; width:100%;
  /* Explicit base so text that isn't sized in rem (list items, rich text) never
     inherits a tiny host font - matters in the admin preview, where the classic
     theme's base font is very small. */
  font-size:16px; line-height:1.55;
}
.ss-cb *{box-sizing:border-box;}
.ss-cb-checks li, .ss-cb-rich, .ss-cb-rich p, .ss-cb-rich li{font-size:1rem;}
.ss-cb img{max-width:100%; height:auto; display:block;}

/* boxed = a contained rounded card; full = full-bleed background band that spans the
   whole viewport width even though it sits inside the page's content container
   (the classic "full-bleed" trick: 100vw wide, pulled out with negative margins). */
.ss-cb--boxed{max-width:1280px; margin-left:auto; margin-right:auto; border-radius:var(--cb-radius); overflow:hidden; margin-bottom:50px;}
.ss-cb--full{border-radius:0; width:100vw; max-width:100vw; margin:0 calc(50% - 50vw);}

.ss-cb-inner{max-width:1120px; margin:0 auto; padding:36px 22px;}
.ss-cb--pad-compact  .ss-cb-inner{padding:20px 18px;}
.ss-cb--pad-normal   .ss-cb-inner{padding:36px 22px;}
.ss-cb--pad-spacious .ss-cb-inner{padding:64px 26px;}

/* fonts */
.ss-cb--font-system{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;}
.ss-cb--font-sans{font-family:"Helvetica Neue",Arial,"Segoe UI",sans-serif;}
.ss-cb--font-serif{font-family:Georgia,"Times New Roman",serif;}
.ss-cb--font-slab{font-family:"Rockwell","Roboto Slab",Georgia,serif;}
.ss-cb--font-rounded{font-family:"Nunito","Segoe UI",Arial,sans-serif;}
.ss-cb--font-inter{font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;}
.ss-cb--font-poppins{font-family:"Poppins","Segoe UI",Arial,sans-serif;}
.ss-cb--font-montserrat{font-family:"Montserrat","Segoe UI",Arial,sans-serif;}
.ss-cb--font-roboto{font-family:"Roboto","Segoe UI",Arial,sans-serif;}
.ss-cb--font-lato{font-family:"Lato","Segoe UI",Arial,sans-serif;}
.ss-cb--font-playfair{font-family:"Playfair Display",Georgia,"Times New Roman",serif;}
.ss-cb--font-oswald{font-family:"Oswald","Arial Narrow",Arial,sans-serif;}

/* headings / text */
.ss-cb-h{font-size:1.9rem; line-height:1.18; font-weight:800; letter-spacing:-.01em; margin:0 0 12px;}
.ss-cb-sub{font-size:1.02rem; line-height:1.6; margin:0 0 18px; opacity:.85;}
.ss-cb-eyebrow{text-transform:uppercase; letter-spacing:.12em; font-size:.72rem; font-weight:700; opacity:.7; margin:0 0 12px;}
.ss-cb-head{margin:0 0 24px;}
.ss-cb-rich{line-height:1.65;}
.ss-cb-rich :first-child{margin-top:0;}
.ss-cb--align-center{text-align:center;}
.ss-cb--align-center .ss-cb-btns{justify-content:center;}
.ss-cb--align-center .ss-cb-head{margin-left:auto; margin-right:auto; max-width:760px;}

/* buttons */
.ss-cb-btns{display:flex; flex-wrap:wrap; gap:12px; margin-top:22px;}
.ss-cb-btn{display:inline-block; padding:12px 22px; border-radius:10px; font-weight:700; font-size:.95rem;
  text-decoration:none; cursor:pointer; border:2px solid transparent; transition:transform .08s ease, opacity .15s ease;}
.ss-cb-btn:hover{transform:translateY(-1px); opacity:.94;}
.ss-cb-btn--primary{background:var(--cb-accent); color:var(--cb-accent-ink); border-color:var(--cb-accent);}
.ss-cb-btn--ghost{background:transparent; color:var(--cb-fg); border-color:var(--cb-line);}

/* ---------------- HERO ---------------- */
.ss-cb-hero{display:grid; grid-template-columns:1fr 1fr; gap:36px; align-items:center;}
.ss-cb-hero .ss-cb-hero-media img{border-radius:12px; width:100%; object-fit:cover;}
.ss-cb-media-right .ss-cb-hero-media{order:2;}
.ss-cb-steps{list-style:none; margin:18px 0 0; padding:0; display:grid; gap:14px;}
.ss-cb-steps li{display:flex; gap:14px; align-items:flex-start;}
.ss-cb-step-n{flex:0 0 auto; width:30px; height:30px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  font-size:.8rem; font-weight:800; background:var(--cb-accent); color:var(--cb-accent-ink);}
.ss-cb-step-tx strong{display:block; font-size:1rem; margin-bottom:2px;}
.ss-cb-step-tx p{margin:0; font-size:.92rem; opacity:.82;}

/* ---------------- FEATURE GRID ---------------- */
.ss-cb-grid{display:grid; grid-template-columns:repeat(var(--cols,3),1fr); gap:18px;}
.ss-cb-card{display:block; text-decoration:none; color:inherit; border:1px solid var(--cb-line);
  border-radius:12px; padding:18px; background:rgba(127,140,160,.06);}
a.ss-cb-card:hover{border-color:var(--cb-accent);}
.ss-cb-card-img{width:100%; height:150px; object-fit:cover; border-radius:8px; margin-bottom:12px;}
.ss-cb-card-h{font-size:1.06rem; font-weight:700; margin:0 0 6px;}
.ss-cb-card p{margin:0; font-size:.92rem; opacity:.82; line-height:1.5;}

/* ---------------- SPLIT (checklist / media+text) ---------------- */
.ss-cb-split{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center;}
.ss-cb-split .ss-cb-split-media img{border-radius:12px; width:100%; object-fit:cover;}
.ss-cb-media-right .ss-cb-split-media{order:2;}
/* Feature (Image + details): a split card like the reference. The IMAGE column is WIDER than
   the text, and the image bleeds edge to edge in its area (no gap, no inset, no radius) and
   fills the full height; only the text side carries padding. Columns follow imageSide so the
   image is always the wider one. */
.ss-cb--feature .ss-cb-inner{padding:0; max-width:none;}
.ss-cb--feature .ss-cb-split{grid-template-columns:1.35fr 1fr; gap:0; align-items:stretch;}
.ss-cb--feature .ss-cb-split.ss-cb-media-right{grid-template-columns:1fr 1.35fr;}
.ss-cb--feature .ss-cb-split-media{display:flex; min-height:100%;}
.ss-cb--feature .ss-cb-split-media img{width:100%; height:100%; min-height:360px; object-fit:cover; border-radius:0;}
.ss-cb--feature .ss-cb-split-body{padding:44px 40px;}
/* Extra content shown after the buttons in a feature section (fine print, a note, contact...). */
.ss-cb-feature-note{margin-top:24px; padding:16px 18px; border:1px solid var(--cb-line); border-radius:12px; font-size:.92rem; line-height:1.55;}
.ss-cb-feature-note :first-child{margin-top:0;}
.ss-cb-feature-note :last-child{margin-bottom:0;}
.ss-cb-checks{list-style:none; margin:8px 0 0; padding:0; display:grid; gap:12px;}
.ss-cb-checks li{position:relative; padding-left:32px; line-height:1.5;}
/* Orange circle with the checkmark centered via flexbox, so the tick is always centered in the
   circle regardless of size or font (the old absolutely-positioned border tick read as off-center). */
.ss-cb-checks li::before{content:"\2713"; position:absolute; left:0; top:2px; width:20px; height:20px;
  border-radius:50%; background:var(--cb-accent); color:var(--cb-accent-ink);
  display:flex; align-items:center; justify-content:center; font-size:13px; line-height:1; font-weight:700;}

/* ---------------- TILE GRID (text + tiles) ---------------- */
.ss-cb-tiles{display:grid; grid-template-columns:repeat(var(--tcols,2),1fr); gap:12px;}
.ss-cb-tile{display:block; text-decoration:none; color:inherit; border:1px solid var(--cb-line); border-radius:10px; padding:14px 16px; background:rgba(127,140,160,.06);}
a.ss-cb-tile:hover{border-color:var(--cb-accent);}
.ss-cb-tile-t{display:block; font-weight:700; font-size:1rem; margin-bottom:3px;}
.ss-cb-tile-d{display:block; font-size:.85rem; opacity:.78; line-height:1.4;}

/* ---------------- CTA BANNER ---------------- */
.ss-cb-cta{display:flex; align-items:center; justify-content:space-between; gap:26px; flex-wrap:wrap;}
.ss-cb-cta .ss-cb-h{margin-bottom:6px;}
.ss-cb-cta .ss-cb-sub{margin-bottom:0;}
.ss-cb-cta .ss-cb-btns{margin-top:0;}
.ss-cb--align-center .ss-cb-cta{justify-content:center; text-align:center;}

/* ---------------- HERO BANNER (herobanner) ---------------- */
/* Fills the section edge to edge (no inner padding); the image column bleeds to the
   edge and the text panel carries its own padding. Best paired with "Full width band". */
.ss-cb--herobanner .ss-cb-inner{padding:0; max-width:none;}
.ss-cb-herobar-split{display:grid; grid-template-columns:1fr 1fr; align-items:stretch; min-height:440px;}
.ss-cb-media-right .ss-cb-herobar-media{order:2;}
.ss-cb-herobar-media{position:relative; min-height:300px; overflow:hidden;}
.ss-cb-herobar-media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;}
.ss-cb-herobar-cap{position:absolute; left:16px; bottom:16px; background:rgba(20,24,32,.72); color:#fff; font-size:.8rem; padding:6px 12px; border-radius:8px;}
.ss-cb-herobar-body{display:flex; flex-direction:column; justify-content:center; padding:54px 48px;}
.ss-cb-herobar-body .ss-cb-eyebrow{margin-bottom:16px;}
.ss-cb-h--xl{font-size:2.9rem; line-height:1.04; letter-spacing:-.02em; margin:0 0 18px;}
.ss-cb-herobar-body .ss-cb-sub{max-width:46ch;}
.ss-cb-herobar-strip{display:grid; grid-template-columns:repeat(var(--fcols,4),1fr); gap:22px; background:#fff; color:#1f2733; padding:22px 48px; border-top:1px solid rgba(0,0,0,.08);}
.ss-cb-herobar-feat strong{display:block; font-size:.98rem; margin-bottom:3px;}
.ss-cb-herobar-feat span{display:block; font-size:.85rem; color:#5b6675; line-height:1.4;}

/* ---------------- responsive ---------------- */
@media (max-width:820px){
  .ss-cb-herobar-split{grid-template-columns:1fr; min-height:0;}
  .ss-cb-media-right .ss-cb-herobar-media{order:0;}
  .ss-cb-herobar-media{min-height:240px; height:240px;}
  .ss-cb-herobar-body{padding:32px 22px;}
  .ss-cb-h--xl{font-size:2rem;}
  .ss-cb-herobar-strip{grid-template-columns:repeat(2,1fr); padding:20px 22px;}
  .ss-cb-hero, .ss-cb-split{grid-template-columns:1fr; gap:22px;}
  .ss-cb-media-right .ss-cb-hero-media,
  .ss-cb-media-right .ss-cb-split-media{order:0;}
  /* Feature stacks to one column on mobile (its desktop rules are more specific than the
     generic .ss-cb-split above, so override them here). Image on top, text below with padding. */
  .ss-cb--feature .ss-cb-split,
  .ss-cb--feature .ss-cb-split.ss-cb-media-right{grid-template-columns:1fr; gap:0;}
  .ss-cb--feature .ss-cb-split-media img{min-height:240px;}
  .ss-cb--feature .ss-cb-split-body{padding:30px 22px;}
  .ss-cb-grid{grid-template-columns:repeat(2,1fr);}
  .ss-cb-h{font-size:1.55rem;}
  .ss-cb--pad-spacious .ss-cb-inner{padding:40px 18px;}
}
@media (max-width:520px){
  .ss-cb-grid, .ss-cb-tiles, .ss-cb-herobar-strip{grid-template-columns:1fr;}
  .ss-cb-btn{width:100%; text-align:center;}
  .ss-cb--align-center .ss-cb-btn{width:auto;}
}

/* ===== Templates added 2026-10-30: start ===== */
/* New shared color: --cb-tint is the soft panel color of the templates below (Style tab: Panel color). */
.ss-cb{--cb-tint:#f4f2ee;}
/* A theme can name a font for every link: links in these templates keep the font of the section. */
.ss-cb--herofade a, .ss-cb--promocards a, .ss-cb--iconcards a, .ss-cb--contactband a, .ss-cb--offerpanel a{font-family:inherit;}

/* Icons: a shape drawn as a mask in the current text color. Both renderers only write the class. */
.ss-cb-ico{display:inline-block; flex:0 0 auto; width:1em; height:1em; background-color:currentColor; -webkit-mask:var(--cb-ico) center / contain no-repeat; mask:var(--cb-ico) center / contain no-repeat;}
.ss-cb-ico--compass{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpath d='m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--clipboardlist{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='8' height='4' x='8' y='2' rx='1' ry='1'%3E%3C/rect%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'%3E%3C/path%3E%3Cpath d='M12 11h4'%3E%3C/path%3E%3Cpath d='M12 16h4'%3E%3C/path%3E%3Cpath d='M8 11h.01'%3E%3C/path%3E%3Cpath d='M8 16h.01'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--listchecks{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 5h8'%3E%3C/path%3E%3Cpath d='M13 12h8'%3E%3C/path%3E%3Cpath d='M13 19h8'%3E%3C/path%3E%3Cpath d='m3 17 2 2 4-4'%3E%3C/path%3E%3Cpath d='m3 7 2 2 4-4'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--notebooktext{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 6h4'%3E%3C/path%3E%3Cpath d='M2 10h4'%3E%3C/path%3E%3Cpath d='M2 14h4'%3E%3C/path%3E%3Cpath d='M2 18h4'%3E%3C/path%3E%3Crect width='16' height='20' x='4' y='2' rx='2'%3E%3C/rect%3E%3Cpath d='M9.5 8h5'%3E%3C/path%3E%3Cpath d='M9.5 12H16'%3E%3C/path%3E%3Cpath d='M9.5 16H14'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--filetext{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z'%3E%3C/path%3E%3Cpath d='M14 2v5a1 1 0 0 0 1 1h5'%3E%3C/path%3E%3Cpath d='M10 9H8'%3E%3C/path%3E%3Cpath d='M16 13H8'%3E%3C/path%3E%3Cpath d='M16 17H8'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--calendarcheck{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2v3'%3E%3C/path%3E%3Cpath d='M16 2v3'%3E%3C/path%3E%3Crect x='3' y='3' width='18' height='18' rx='2'%3E%3C/rect%3E%3Cpath d='M3 9h18'%3E%3C/path%3E%3Cpath d='m9 15 2 2 4-4'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--badgecheck{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z'%3E%3C/path%3E%3Cpath d='m16 9-5.5 5.5L8 12'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--shieldcheck{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'%3E%3C/path%3E%3Cpath d='m9 12 2 2 4-4'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--star{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--smile{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 10V9'%3E%3C/path%3E%3Cpath d='M16.472 15a6 6 0 01-8.943 0'%3E%3C/path%3E%3Cpath d='M9 10V9'%3E%3C/path%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3C/svg%3E");}
.ss-cb-ico--headphones{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 14h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-7a9 9 0 0 1 18 0v7a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--headset{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-5Zm0 0a9 9 0 1 1 18 0m0 0v5a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3Z'%3E%3C/path%3E%3Cpath d='M21 16v2a4 4 0 0 1-4 4h-5'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--phone{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--smartphone{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='20' x='5' y='2' rx='2' ry='2'%3E%3C/rect%3E%3Cpath d='M12 18h.01'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--mailopen{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.2 8.4c.5.38.8.97.8 1.6v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V10a2 2 0 0 1 .8-1.6l8-6a2 2 0 0 1 2.4 0l8 6Z'%3E%3C/path%3E%3Cpath d='m22 10-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 10'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--message{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--lifebuoy{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpath d='m4.93 4.93 4.24 4.24'%3E%3C/path%3E%3Cpath d='m14.83 9.17 4.24-4.24'%3E%3C/path%3E%3Cpath d='m14.83 14.83 4.24 4.24'%3E%3C/path%3E%3Cpath d='m9.17 14.83-4.24 4.24'%3E%3C/path%3E%3Ccircle cx='12' cy='12' r='4'%3E%3C/circle%3E%3C/svg%3E");}
.ss-cb-ico--truck{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 18V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v11a1 1 0 0 0 1 1h2'%3E%3C/path%3E%3Cpath d='M15 18H9'%3E%3C/path%3E%3Cpath d='M19 18h2a1 1 0 0 0 1-1v-3.65a1 1 0 0 0-.22-.624l-3.48-4.35A1 1 0 0 0 17.52 8H14'%3E%3C/path%3E%3Ccircle cx='17' cy='18' r='2'%3E%3C/circle%3E%3Ccircle cx='7' cy='18' r='2'%3E%3C/circle%3E%3C/svg%3E");}
.ss-cb-ico--warehouse{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 21V10a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1v11'%3E%3C/path%3E%3Cpath d='M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V8a2 2 0 0 1 1.132-1.803l7.95-3.974a2 2 0 0 1 1.837 0l7.948 3.974A2 2 0 0 1 22 8z'%3E%3C/path%3E%3Cpath d='M6 13h12'%3E%3C/path%3E%3Cpath d='M6 17h12'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--store{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 21v-5a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v5'%3E%3C/path%3E%3Cpath d='M17.774 10.31a1.12 1.12 0 0 0-1.549 0 2.5 2.5 0 0 1-3.451 0 1.12 1.12 0 0 0-1.548 0 2.5 2.5 0 0 1-3.452 0 1.12 1.12 0 0 0-1.549 0 2.5 2.5 0 0 1-3.77-3.248l2.889-4.184A2 2 0 0 1 7 2h10a2 2 0 0 1 1.653.873l2.895 4.192a2.5 2.5 0 0 1-3.774 3.244'%3E%3C/path%3E%3Cpath d='M4 10.95V19a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8.05'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--creditcard{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='14' x='2' y='5' rx='2'%3E%3C/rect%3E%3Cline x1='2' x2='22' y1='10' y2='10'%3E%3C/line%3E%3Cpath d='M6 14h2'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--lock{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='11' x='3' y='11' rx='2' ry='2'%3E%3C/rect%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--returns{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'%3E%3C/path%3E%3Cpath d='M3 3v5h5'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--wrench{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.106-3.105c.32-.322.863-.22.983.218a6 6 0 0 1-8.259 7.057l-7.91 7.91a1 1 0 0 1-2.999-3l7.91-7.91a6 6 0 0 1 7.057-8.259c.438.12.54.662.219.984z'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--hammer{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15 12-9.373 9.373a1 1 0 0 1-3.001-3L12 9'%3E%3C/path%3E%3Cpath d='m18 15 4-4'%3E%3C/path%3E%3Cpath d='m21.5 11.5-1.914-1.914A2 2 0 0 1 19 8.172v-.344a2 2 0 0 0-.586-1.414l-1.657-1.657A6 6 0 0 0 12.516 3H9l1.243 1.243A6 6 0 0 1 12 8.485V10l2 2h1.172a2 2 0 0 1 1.414.586L18.5 14.5'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--ruler{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.3 15.3a2.4 2.4 0 0 1 0 3.4l-2.6 2.6a2.4 2.4 0 0 1-3.4 0L2.7 8.7a2.41 2.41 0 0 1 0-3.4l2.6-2.6a2.41 2.41 0 0 1 3.4 0Z'%3E%3C/path%3E%3Cpath d='m14.5 12.5 2-2'%3E%3C/path%3E%3Cpath d='m11.5 9.5 2-2'%3E%3C/path%3E%3Cpath d='m8.5 6.5 2-2'%3E%3C/path%3E%3Cpath d='m17.5 15.5 2-2'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--plug{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22v-5'%3E%3C/path%3E%3Cpath d='M15 8V2'%3E%3C/path%3E%3Cpath d='M17 8a1 1 0 0 1 1 1v4a4 4 0 0 1-4 4h-4a4 4 0 0 1-4-4V9a1 1 0 0 1 1-1z'%3E%3C/path%3E%3Cpath d='M9 8V2'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--zap{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15.914 4a1.5 1.5 0 00-2.474-1.561l-9 9A1.5 1.5 0 005.5 14h4.002a.5.5 0 01.471.666L8.086 20a1.5 1.5 0 002.475 1.56l9-9A1.5 1.5 0 0018.5 10h-3.997a.5.5 0 01-.472-.667z'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--layers{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z'%3E%3C/path%3E%3Cpath d='M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12'%3E%3C/path%3E%3Cpath d='M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--thermometer{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 4v10.54a4 4 0 1 1-4 0V4a2 2 0 0 1 4 0Z'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--snowflake{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m10 20-1.25-2.5L6 18'%3E%3C/path%3E%3Cpath d='M10 4 8.75 6.5 6 6'%3E%3C/path%3E%3Cpath d='m14 20 1.25-2.5L18 18'%3E%3C/path%3E%3Cpath d='m14 4 1.25 2.5L18 6'%3E%3C/path%3E%3Cpath d='m17 21-3-6h-4'%3E%3C/path%3E%3Cpath d='m17 3-3 6 1.5 3'%3E%3C/path%3E%3Cpath d='M2 12h6.5L10 9'%3E%3C/path%3E%3Cpath d='m20 10-1.5 2 1.5 2'%3E%3C/path%3E%3Cpath d='M22 12h-6.5L14 15'%3E%3C/path%3E%3Cpath d='m4 10 1.5 2L4 14'%3E%3C/path%3E%3Cpath d='m7 21 3-6-1.5-3'%3E%3C/path%3E%3Cpath d='m7 3 3 6h4'%3E%3C/path%3E%3C/svg%3E");}
.ss-cb-ico--heat{--cb-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 5c2.2 2.4 2.2 4.2 0 6.6S5.8 16 8 18.4 10.2 22.6 8 27M16 5c2.2 2.4 2.2 4.2 0 6.6S13.8 16 16 18.4 18.2 22.6 16 27M24 5c2.2 2.4 2.2 4.2 0 6.6S21.8 16 24 18.4 26.2 22.6 24 27' fill='none' stroke='%23e85d04' stroke-width='1.8' stroke-linecap='round'%3E%3C/path%3E%3C/svg%3E");}

/* Small round ticks (a list of plain lines) */
.ss-cb-ticks{list-style:none; margin:0; padding:0; font-size:13.5px; line-height:1.4;}
.ss-cb-ticks li{position:relative; margin:0; padding:0 0 0 23px;}
.ss-cb-ticks li::before{content:"\2713"; position:absolute; left:0; top:1px; display:flex; align-items:center; justify-content:center; width:15px; height:15px; border-radius:50%; background:var(--cb-accent); color:var(--cb-accent-ink); font-size:10px; font-weight:800; line-height:1;}
.ss-cb-ticks--inline{display:flex; flex-wrap:wrap; gap:10px 22px;}
.ss-cb-ticks--two{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 24px;}
.ss-cb-ticks--one{display:grid; gap:10px;}

/* The pill button of the Contact Band and the Offer Panel, with its arrow */
.ss-cb--contactband .ss-cb-btns, .ss-cb--offerpanel .ss-cb-btns{margin-top:0;}
.ss-cb--contactband .ss-cb-btn, .ss-cb--offerpanel .ss-cb-btn{display:inline-flex; align-items:center; justify-content:center; gap:14px; height:46px; padding:0 22px; border:0; border-radius:999px; font-size:13px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; box-shadow:0 8px 22px color-mix(in srgb, var(--cb-accent) 25%, transparent);}
.ss-cb--contactband .ss-cb-btn::after, .ss-cb--offerpanel .ss-cb-btn::after{content:"\2192"; font-size:16px; line-height:1;}

/* ---------------- HERO WITH PHOTO BACKGROUND (herofade) ----------------
   The photo fills the section behind the text and fades into the section's background on the
   text side, so it works with any photo and any background color. */
.ss-cb--herofade .ss-cb-inner{padding:0; max-width:none;}
.ss-cb-hfade{position:relative; display:flex; align-items:center; min-height:clamp(440px,40vw,640px); overflow:hidden;}
.ss-cb--herofade .ss-cb-hfade-photo{position:absolute; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; object-position:68% center;
  -webkit-mask-image:linear-gradient(90deg,transparent 20%,rgba(0,0,0,.4) 34%,#000 52%); mask-image:linear-gradient(90deg,transparent 20%,rgba(0,0,0,.4) 34%,#000 52%);}
.ss-cb-hfade-copy{position:relative; z-index:1; width:100%; max-width:46%; padding:48px 16px 48px 5.2%; text-align:left;}
.ss-cb-media-left .ss-cb-hfade-copy{margin-left:auto; padding:48px 5.2% 48px 16px;}
.ss-cb--herofade .ss-cb-media-left .ss-cb-hfade-photo{object-position:32% center; -webkit-mask-image:linear-gradient(270deg,transparent 20%,rgba(0,0,0,.4) 34%,#000 52%); mask-image:linear-gradient(270deg,transparent 20%,rgba(0,0,0,.4) 34%,#000 52%);}
.ss-cb--herofade .ss-cb-eyebrow{margin:0; font-size:11px; font-weight:500; letter-spacing:.22em; opacity:.55;}
.ss-cb-rule{display:block; width:40px; height:2px; margin-top:8px; background:var(--cb-accent);}
.ss-cb--herofade .ss-cb-h{margin:12px 0 0; font-size:clamp(28px,2.7vw,46px); line-height:1.02; font-weight:700; letter-spacing:-.025em;}
.ss-cb-h-accent{display:block; color:var(--cb-accent);}
.ss-cb--herofade .ss-cb-sub{max-width:52ch; margin:16px 0 0; font-size:clamp(13.5px,1vw,16px); line-height:1.65; opacity:.72;}
.ss-cb--herofade .ss-cb-btns{gap:12px; margin-top:18px;}
.ss-cb--herofade .ss-cb-btn{display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 22px; border-width:1px; border-radius:999px; font-size:14.5px; font-weight:600; white-space:nowrap;}
.ss-cb--herofade .ss-cb-btn--ghost{background:#fff; color:#141414; border-color:var(--cb-line);}
.ss-cb-hfade-feats{display:flex; flex-wrap:wrap; list-style:none; margin:20px 0 0; padding:0;}
.ss-cb-hfade-feats li{position:relative; display:flex; flex-direction:column; align-items:center; gap:4px; width:72px; margin:0 20px 0 0; font-size:9px; font-weight:600; line-height:1.2; letter-spacing:.08em; text-align:center; text-transform:uppercase;}
.ss-cb-hfade-feats li + li::before{content:""; position:absolute; left:-10px; top:4px; bottom:4px; width:1px; background:var(--cb-line);}
.ss-cb-hfade-feats .ss-cb-ico{font-size:28px; color:var(--cb-accent);}

/* ---------------- IMAGE PROMO CARDS + TRUST BAR (promocards) ----------------
   A card with words: the photo fills the card, the words sit over it on a soft dark veil. A card
   without words is just its picture and link, for a picture that already has its words in it. */
.ss-cb--promocards .ss-cb-inner{padding:0; max-width:none;}
.ss-cb-pcards{display:grid; grid-template-columns:repeat(var(--cols,2),minmax(0,1fr)); gap:16px; padding:16px;}
.ss-cb-pcard{position:relative; display:block; overflow:hidden; border-radius:var(--cb-radius); color:#fff; text-decoration:none; transition:transform .15s ease;}
a.ss-cb-pcard:hover{transform:translateY(-2px);}
.ss-cb--promocards .ss-cb-pcard img{width:100%;}
.ss-cb-pcard--text{display:flex; min-height:clamp(280px,25vw,400px); background:#2a2f38;}
.ss-cb--promocards .ss-cb-pcard--text img{position:absolute; inset:0; height:100%; max-width:none; object-fit:cover;}
.ss-cb-pcard-tx{position:relative; z-index:1; display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; width:100%; padding:6% 6.5%; text-align:left; background:linear-gradient(90deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.28) 50%,rgba(0,0,0,0) 85%);}
.ss-cb-pcard-t{display:block; font-size:clamp(28px,3vw,46px); line-height:1.08; font-weight:700; letter-spacing:-.015em;}
.ss-cb-pcard-d{display:block; max-width:26em; margin-top:10px; font-size:clamp(15px,1.3vw,19px); line-height:1.35;}
.ss-cb-pcard-b{display:inline-flex; align-items:center; gap:14px; margin-top:18px; padding:12px 20px; border-radius:6px; background:var(--cb-accent); color:var(--cb-accent-ink); font-size:14px; font-weight:600; letter-spacing:.04em; text-transform:uppercase;}
.ss-cb-pcard-b::after{content:"\2192"; font-size:17px; line-height:1;}
.ss-cb-trust{padding:30px 28px 26px; background:var(--cb-tint); background:linear-gradient(180deg,var(--cb-tint) 0%,color-mix(in srgb, var(--cb-tint) 55%, transparent) 60%,transparent 100%);}
.ss-cb-trust-list{display:grid; grid-template-columns:repeat(var(--tcols,4),minmax(0,1fr)); max-width:1260px; margin:0 auto; padding:0; list-style:none;}
.ss-cb-trust-list li{position:relative; display:flex; align-items:center; gap:12px; margin:0; padding:2px 18px; text-align:left;}
.ss-cb-trust-list li + li::before{content:""; position:absolute; left:0; top:-4px; bottom:-4px; width:1px; background:linear-gradient(180deg,transparent,var(--cb-line),transparent);}
.ss-cb-trust-ic{display:grid; place-items:center; flex:0 0 auto; width:46px; height:46px; border-radius:50%; background:#fff; color:var(--cb-accent); font-size:23px; box-shadow:0 6px 18px rgba(22,22,22,.06);}
.ss-cb-trust-list b{display:block; font-size:14px; font-weight:600; line-height:1.25;}
.ss-cb-trust-list small{display:block; margin-top:3px; font-size:12.5px; line-height:1.35; opacity:.72;}

/* ---------------- ICON CARDS (iconcards) ---------------- */
.ss-cb--iconcards .ss-cb-inner{max-width:1232px;}
.ss-cb--iconcards .ss-cb-head{margin-bottom:28px;}
.ss-cb--iconcards .ss-cb-h{margin:0; font-size:clamp(26px,2.3vw,34px); line-height:1.08; font-weight:700; letter-spacing:-.022em;}
.ss-cb--iconcards .ss-cb-sub{max-width:75ch; margin:10px auto 0; font-size:15px; line-height:1.5; opacity:.72;}
.ss-cb--iconcards.ss-cb--align-left .ss-cb-sub{margin-left:0;}
.ss-cb-icards{display:grid; grid-template-columns:repeat(var(--cols,4),minmax(0,1fr)); gap:18px;}
.ss-cb-icard{display:flex; flex-direction:column; padding:24px 22px 22px; border-radius:var(--cb-radius); text-align:left; background:var(--cb-tint); background:linear-gradient(180deg,var(--cb-tint) 0%,color-mix(in srgb, var(--cb-tint) 45%, transparent) 75%,color-mix(in srgb, var(--cb-tint) 15%, transparent) 100%);}
.ss-cb-icbox{display:grid; place-items:center; width:44px; height:44px; border-radius:14px; background:#fff; color:var(--cb-accent); font-size:22px; box-shadow:0 6px 16px rgba(22,22,22,.06);}
.ss-cb-icard-h{margin:16px 0 0; font-size:16px; line-height:1.25; font-weight:600;}
.ss-cb-tag{display:inline-block; margin-left:4px; padding:2px 6px; border-radius:4px; background:var(--cb-accent); color:var(--cb-accent-ink); font-size:9px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; vertical-align:middle;}
.ss-cb-icard p{margin:6px 0 0; font-size:13.5px; line-height:1.45; opacity:.72;}
.ss-cb-links{display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:auto; padding-top:16px;}
.ss-cb a.ss-cb-more, .ss-cb a.ss-cb-more:hover{color:var(--cb-accent); font-size:11.5px; font-weight:700; letter-spacing:.08em; text-decoration:none; text-transform:uppercase;}
.ss-cb a.ss-cb-more:hover{opacity:.8;}
.ss-cb-more::after{content:" \2192";}

/* ---------------- CONTACT BAND (contactband) ---------------- */
.ss-cb--contactband{background:var(--cb-tint); background:linear-gradient(180deg,var(--cb-tint) 0%,var(--cb-tint) 60%,var(--cb-bg) 100%);}
.ss-cb--contactband .ss-cb-inner{max-width:1232px;}
.ss-cb-cband{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.12fr); gap:52px; align-items:center;}
.ss-cb-cband.ss-cb-media-right{grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);}
.ss-cb-cband:not(:has(.ss-cb-cband-img)){grid-template-columns:minmax(0,1fr);}
.ss-cb-cband-img{overflow:hidden; border-radius:var(--cb-radius); -webkit-mask-image:linear-gradient(90deg,#000 70%,transparent 100%); mask-image:linear-gradient(90deg,#000 70%,transparent 100%);}
.ss-cb-media-right .ss-cb-cband-img{order:2; -webkit-mask-image:linear-gradient(270deg,#000 70%,transparent 100%); mask-image:linear-gradient(270deg,#000 70%,transparent 100%);}
.ss-cb--contactband .ss-cb-cband-img img{width:100%; border-radius:0;}
.ss-cb--contactband .ss-cb-h{margin:0; font-size:clamp(26px,2.3vw,34px); line-height:1.08; font-weight:700; letter-spacing:-.022em;}
.ss-cb--contactband .ss-cb-sub{max-width:58ch; margin:14px 0 0; font-size:15px; line-height:1.6; opacity:.78;}
.ss-cb-cband-row{display:flex; flex-wrap:wrap; align-items:center; gap:16px 28px; margin-top:22px;}
.ss-cb-contacts{display:grid; gap:6px;}
.ss-cb a.ss-cb-tel, .ss-cb a.ss-cb-mail{display:flex; align-items:center; gap:9px; color:inherit; text-decoration:none;}
.ss-cb a.ss-cb-tel{font-size:19px; font-weight:700; letter-spacing:-.01em;}
.ss-cb a.ss-cb-mail{font-size:14px; font-weight:500;}
.ss-cb-contacts .ss-cb-ico{font-size:18px; color:var(--cb-accent);}
.ss-cb-cband-copy .ss-cb-ticks{margin-top:22px; padding-top:18px; border-top:1px solid var(--cb-line);}

/* ---------------- OFFER PANEL (offerpanel) ----------------
   A soft panel whose color runs out toward the photo; the photo fades in from the same side. */
.ss-cb--offerpanel{background:var(--cb-tint); background:linear-gradient(100deg,var(--cb-tint) 0%,color-mix(in srgb, var(--cb-tint) 60%, transparent) 45%,transparent 75%),var(--cb-bg);}
.ss-cb--offerpanel:has(.ss-cb-media-left){background:linear-gradient(260deg,var(--cb-tint) 0%,color-mix(in srgb, var(--cb-tint) 60%, transparent) 45%,transparent 75%),var(--cb-bg);}
.ss-cb--offerpanel .ss-cb-inner{padding:0; max-width:none;}
.ss-cb-offer{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:36px; align-items:center;}
.ss-cb-offer.ss-cb-media-left{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);}
.ss-cb-offer:not(:has(.ss-cb-offer-img)){grid-template-columns:minmax(0,1fr);}
.ss-cb-offer-copy{padding:40px 0 40px 44px;}
.ss-cb-offer:not(:has(.ss-cb-offer-img)) .ss-cb-offer-copy{padding-right:44px;}
.ss-cb-media-left .ss-cb-offer-copy{padding:40px 44px 40px 0;}
.ss-cb-offer-img{position:relative; align-self:stretch; min-height:300px; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.2) 7%,rgba(0,0,0,.55) 14%,rgba(0,0,0,.88) 22%,#000 30%); mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.2) 7%,rgba(0,0,0,.55) 14%,rgba(0,0,0,.88) 22%,#000 30%);}
.ss-cb-media-left .ss-cb-offer-img{order:-1; -webkit-mask-image:linear-gradient(270deg,transparent 0%,rgba(0,0,0,.2) 7%,rgba(0,0,0,.55) 14%,rgba(0,0,0,.88) 22%,#000 30%); mask-image:linear-gradient(270deg,transparent 0%,rgba(0,0,0,.2) 7%,rgba(0,0,0,.55) 14%,rgba(0,0,0,.88) 22%,#000 30%);}
.ss-cb--offerpanel .ss-cb-offer-img img{position:absolute; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; object-position:right center; border-radius:0;}
.ss-cb--offerpanel .ss-cb-media-left .ss-cb-offer-img img{object-position:left center;}
.ss-cb--offerpanel .ss-cb-eyebrow{margin:0; font-size:12px; letter-spacing:.14em; opacity:1;}
.ss-cb--offerpanel .ss-cb-rule{width:36px; height:3px;}
.ss-cb--offerpanel .ss-cb-h{margin:14px 0 0; font-size:clamp(26px,2.3vw,34px); line-height:1.08; font-weight:700; letter-spacing:-.022em;}
.ss-cb--offerpanel .ss-cb-sub{max-width:56ch; margin:12px 0 0; font-size:15px; line-height:1.55; opacity:.85;}
.ss-cb-offer-copy .ss-cb-ticks{margin-top:18px;}
.ss-cb-offer-cta{display:flex; flex-wrap:wrap; align-items:center; gap:14px 26px; margin-top:24px;}
.ss-cb a.ss-cb-linkline{color:inherit; font-size:13.5px; font-weight:600; text-decoration:underline; text-decoration-color:color-mix(in srgb, var(--cb-accent) 60%, transparent); text-underline-offset:3px;}
.ss-cb-linkline::after{content:" \2192";}
.ss-cb-offer-note{max-width:56ch; margin:10px 0 0; font-size:12.5px; line-height:1.45; opacity:.72;}

/* ---------------- these templates on smaller screens ---------------- */
@media (max-width:1023.98px){
  .ss-cb-hfade{display:block; min-height:0; overflow:visible;}
  .ss-cb--herofade .ss-cb-hfade-photo,
  .ss-cb--herofade .ss-cb-media-left .ss-cb-hfade-photo{position:static; display:block; height:clamp(300px,48vh,460px); object-position:70% 42%; -webkit-mask-image:linear-gradient(180deg,#000 60%,transparent 100%); mask-image:linear-gradient(180deg,#000 60%,transparent 100%);}
  .ss-cb-hfade-copy,
  .ss-cb-media-left .ss-cb-hfade-copy{max-width:none; margin:-34px 0 0; padding:0 20px 24px;}
  .ss-cb-trust-list{grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 0;}
  .ss-cb-trust-list li:nth-child(odd)::before{display:none;}
  .ss-cb-icards{grid-template-columns:repeat(2,minmax(0,1fr));}
  .ss-cb-cband, .ss-cb-cband.ss-cb-media-right{grid-template-columns:minmax(0,1fr); gap:28px;}
  .ss-cb-cband-img, .ss-cb-media-right .ss-cb-cband-img{order:0; max-width:640px; -webkit-mask-image:none; mask-image:none;}
  .ss-cb-offer, .ss-cb-offer.ss-cb-media-left{grid-template-columns:minmax(0,1fr); gap:0;}
  .ss-cb-offer-img{display:none;}
  .ss-cb-offer-copy, .ss-cb-media-left .ss-cb-offer-copy{padding:36px 32px;}
}
@media (max-width:767.98px){
  .ss-cb-pcards{grid-template-columns:minmax(0,1fr); gap:12px; padding:12px;}
}
@media (max-width:639.98px){
  .ss-cb-hfade-feats{flex-wrap:nowrap; justify-content:space-between; margin-top:18px; padding-top:14px; border-top:1px solid var(--cb-line);}
  .ss-cb-hfade-feats li{flex:1 1 0; width:auto; margin:0;}
  .ss-cb-hfade-feats li + li::before{display:none;}
  .ss-cb--herofade .ss-cb-btns{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
  .ss-cb--herofade .ss-cb-btn{width:auto; padding:0 10px;}
  .ss-cb-trust{padding:22px 16px 18px;}
  .ss-cb-trust-list{gap:14px 0;}
  .ss-cb-trust-list li{gap:8px; padding:0 4px 0 12px;}
  .ss-cb-trust-list li:nth-child(odd){padding-left:0;}
  .ss-cb-trust-ic{width:32px; height:32px; font-size:17px;}
  .ss-cb-trust-list b{font-size:12.5px;}
  .ss-cb-trust-list small{display:none;}
  .ss-cb-icards{gap:12px;}
  .ss-cb-icard{padding:18px 15px 16px;}
  .ss-cb-icbox{width:38px; height:38px; border-radius:12px; font-size:19px;}
  .ss-cb-icard-h{margin-top:12px; font-size:14.5px;}
  .ss-cb-icard p{font-size:12.5px;}
  .ss-cb-links{flex-direction:column; gap:6px; padding-top:12px;}
  .ss-cb a.ss-cb-more{font-size:10.5px; letter-spacing:.06em;}
  .ss-cb-cband-row .ss-cb-btns, .ss-cb-offer-cta .ss-cb-btns{width:100%;}
  .ss-cb--contactband .ss-cb-btn, .ss-cb--offerpanel .ss-cb-btn{width:100%;}
  .ss-cb-offer-copy, .ss-cb-media-left .ss-cb-offer-copy{padding:30px 20px 28px;}
  .ss-cb-ticks--two{grid-template-columns:minmax(0,1fr); gap:9px;}
}
/* ---------------- CUSTOMER REVIEWS (reviews) ----------------
   A row of cards that scrolls sideways and snaps, so it can be swiped and works without a script. js/ss-contentblocks.js
   adds is-ready (which shows the arrows and dots) and what they do; is-static = all the cards fit, nothing to move.
   The cards' shadow needs room inside the scrolling row, given back with negative margins: all of it above and below,
   and 16px at the ends (less than the gap, so the next card stays out of sight), where the row fades out instead of
   cutting the shadow off in a straight line. */
.ss-cb--reviews{--cb-star:#e2a21a; background:var(--cb-tint); background:linear-gradient(180deg,var(--cb-bg) 0%,var(--cb-tint) 38%,var(--cb-tint) 100%);}
.ss-cb--reviews .ss-cb-inner{max-width:1224px;}
.ss-cb--reviews.ss-cb--pad-normal .ss-cb-inner{padding:60px 22px 36px;}
.ss-cb--reviews .ss-cb-head{margin-bottom:28px;}
.ss-cb--reviews .ss-cb-h{margin:0; font-size:clamp(26px,2.3vw,34px); line-height:1.08; font-weight:700; letter-spacing:-.022em;}
.ss-cb--reviews .ss-cb-sub{max-width:75ch; margin:10px auto 0; font-size:15px; line-height:1.5; opacity:.72;}
.ss-cb--reviews.ss-cb--align-left .ss-cb-sub{margin-left:0;}
.ss-cb-rv{display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; column-gap:12px;}
.ss-cb-rv.is-static{column-gap:0;}
.ss-cb-rv-track{grid-column:2; align-self:stretch; display:flex; gap:20px; overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; scroll-padding:0 16px; padding:20px 16px 48px; margin:-20px -16px -48px; -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%); mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%);}
.ss-cb-rv.is-ready .ss-cb-rv-track{scrollbar-width:none;}
.ss-cb-rv.is-ready .ss-cb-rv-track::-webkit-scrollbar{display:none;}
.ss-cb-rv-track:focus-visible{outline:2px solid var(--cb-accent); outline-offset:-4px;}
.ss-cb-rv .ss-cb-rv-card{flex:0 0 calc((100% - (var(--cols,3) - 1) * 20px) / var(--cols,3)); scroll-snap-align:start; display:flex; flex-direction:column; margin:0; padding:26px 26px 22px; border-radius:var(--cb-radius); text-align:left; background:var(--cb-bg); box-shadow:0 14px 34px rgba(22,22,22,.06);}
.ss-cb-rv-stars{position:relative; display:block; flex:none; overflow:hidden; width:85px; height:15px; background:rgba(127,127,127,.28); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27.2 24'%3E%3Cpath d='M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z'/%3E%3C/svg%3E") 0 0 / 17px 15px repeat-x; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27.2 24'%3E%3Cpath d='M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z'/%3E%3C/svg%3E") 0 0 / 17px 15px repeat-x;}
.ss-cb-rv-stars::before{content:""; position:absolute; top:0; bottom:0; left:0; background:var(--cb-star);}
.ss-cb-rv-stars--1::before{width:17px;}
.ss-cb-rv-stars--2::before{width:34px;}
.ss-cb-rv-stars--3::before{width:51px;}
.ss-cb-rv-stars--4::before{width:68px;}
.ss-cb-rv-stars--5::before{width:85px;}
.ss-cb-rv .ss-cb-rv-card blockquote{margin:12px 0 0; padding:0; border:0; color:inherit; font-size:15px; font-style:normal; font-weight:400; line-height:1.55; quotes:none;}
.ss-cb-rv .ss-cb-rv-card blockquote::before, .ss-cb-rv .ss-cb-rv-card blockquote::after{content:none;}
.ss-cb-rv .ss-cb-rv-card figcaption{margin-top:auto; padding-top:14px; color:inherit; font-size:12.5px; line-height:1.5; opacity:.72;}
.ss-cb-rv .ss-cb-rv-nav{display:none; position:relative; z-index:1; flex:none; align-items:center; justify-content:center; width:36px; height:36px; min-width:0; margin:0; padding:0; border:1px solid var(--cb-line); border-radius:50%; background:var(--cb-bg); color:inherit; box-shadow:0 6px 16px rgba(22,22,22,.06); cursor:pointer;}
.ss-cb-rv.is-ready .ss-cb-rv-nav{display:flex;}
.ss-cb-rv.is-static .ss-cb-rv-nav{display:none;}
.ss-cb-rv .ss-cb-rv-nav:hover{border-color:var(--cb-accent); color:var(--cb-accent);}
.ss-cb-rv .ss-cb-rv-nav:focus-visible{outline:2px solid var(--cb-accent); outline-offset:2px;}
.ss-cb-rv-nav::before{content:""; display:block; width:16px; height:16px; background:currentColor; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15 18-6-6 6-6'/%3E%3C/svg%3E") center / contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15 18-6-6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;}
.ss-cb-rv-next::before{transform:scaleX(-1);}
.ss-cb-rv-dots{display:none; grid-column:1 / -1; position:relative; z-index:1; justify-content:center; margin-top:10px;}
.ss-cb-rv.is-ready .ss-cb-rv-dots{display:flex;}
.ss-cb-rv.is-static .ss-cb-rv-dots{display:none;}
.ss-cb-rv .ss-cb-rv-dots button{display:block; width:auto; height:auto; min-width:0; margin:0; padding:8px 3px; border:0; border-radius:0; background:none; box-shadow:none; cursor:pointer;}
.ss-cb-rv-dots button::before{content:""; display:block; width:8px; height:8px; border-radius:50%; background:rgba(127,127,127,.38);}
.ss-cb-rv-dots button[aria-current="true"]::before{background:var(--cb-accent);}
.ss-cb-rv .ss-cb-rv-dots button:focus-visible{outline:2px solid var(--cb-accent); outline-offset:-2px;}
.ss-cb-rv-note{position:relative; max-width:726px; margin:14px auto 0; font-size:12px; line-height:1.5; text-align:center; opacity:.7;}
.ss-cb-rv.is-static + .ss-cb-rv-note{margin-top:28px;}
.ss-cb--reviews.ss-cb--align-left .ss-cb-rv-note{margin-left:0; text-align:left;}
@media (max-width:1023.98px){
  .ss-cb-rv .ss-cb-rv-card{flex-basis:calc((100% - 20px) / 2);}
}
@media (max-width:639.98px){
  .ss-cb--reviews.ss-cb--pad-normal .ss-cb-inner{padding:52px 18px 28px;}
  .ss-cb--reviews.ss-cb--pad-compact .ss-cb-inner, .ss-cb--reviews.ss-cb--pad-spacious .ss-cb-inner{padding-left:18px; padding-right:18px;}
  .ss-cb-rv{display:block;}
  .ss-cb-rv.is-ready .ss-cb-rv-nav, .ss-cb-rv.is-ready .ss-cb-rv-dots{display:none;}
  .ss-cb-rv-track{gap:12px; scroll-padding:0 18px; padding:20px 18px 48px; margin:-20px -18px -48px; -webkit-mask-image:none; mask-image:none;}
  .ss-cb-rv .ss-cb-rv-card{flex-basis:84%; padding:22px 20px 20px;}
  .ss-cb-rv-note{margin-top:18px;}
}
/* ===== Templates added 2026-10-30: end ===== */