/* ==========================================================================
   WeLink Elementor Widgets — shared stylesheet
   Brand tokens taken directly from the WeLink Solutions logo.
   All selectors are prefixed "welink-" to avoid colliding with theme
   or other plugin styles.
   ========================================================================== */

:root{
  --welink-ink:        #0D1B30;
  --welink-paper:      #EFEDE9;
  --welink-paper-soft: #F7F6F3;
  --welink-white:      #FFFFFF;
  --welink-red:        #E30613;
  --welink-red-deep:   #B30510;
  --welink-red-pale:   #FF9C9C;
  --welink-maroon:     #33090D;
  --welink-text-ink:   #0D1B30;
  --welink-text-muted: #5B6270;
  --welink-text-on-ink:     #F4F3F0;
  --welink-text-on-ink-mut: #A7ADBD;
  --welink-line-light: rgba(13,27,48,0.13);
  --welink-line-dark:  rgba(244,243,240,0.16);
  --welink-radius: 14px;
  --welink-ease: cubic-bezier(.22,.61,.36,1);
}

.welink-kicker{
  font-family:inherit; font-weight:700; text-transform:uppercase; letter-spacing:.09em;
  font-size:.82rem; color:var(--welink-red); margin:0 0 .7rem;
}
.welink-kicker--on-dark{ color:var(--welink-red-pale); }
.welink-on-dark{ color:var(--welink-text-on-ink); }
.welink-on-dark h2, .welink-on-dark h3{ color:var(--welink-text-on-ink); }
.welink-lede{ color:var(--welink-text-muted); font-size:1.05rem; }
.welink-mt-lg{ margin-top:2rem; }

/* ---------- buttons ---------- */
.welink-btn-row{ display:flex; gap:1rem; flex-wrap:wrap; margin-top:1.4rem; }
.welink-btn{
  display:inline-flex; align-items:center; gap:.5rem; font-weight:700; font-size:.92rem;
  padding:.9rem 1.7rem; border-radius:999px; border:1px solid transparent; text-decoration:none;
  transition:background .2s var(--welink-ease), color .2s var(--welink-ease), transform .2s var(--welink-ease);
}
.welink-btn--solid{ background:var(--welink-red); color:#fff !important; }
.welink-btn--solid:hover{ background:var(--welink-red-deep); transform:translateY(-1px); color:#fff !important; }
.welink-btn--line{ border-color:var(--welink-line-light); color:var(--welink-text-ink) !important; }
.welink-btn--line:hover{ border-color:var(--welink-text-ink); }
.welink-on-dark .welink-btn--line{ border-color:var(--welink-line-dark); color:var(--welink-text-on-ink) !important; }
/* Hero slides always sit on a darkened photo, so outline buttons there
   need white text/border regardless of the surrounding section class. */
.welink-hero-slide .welink-btn--line{ border-color:rgba(255,255,255,.65); color:#fff !important; }
.welink-hero-slide .welink-btn--line:hover{ border-color:#fff; background:rgba(255,255,255,.12); }
.welink-btn--sm{ padding:.5rem 1.1rem; font-size:.82rem; }

.welink-tag{
  display:inline-block; font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  color:var(--welink-red-pale); border:1px solid var(--welink-line-dark); padding:.3rem .7rem; border-radius:999px;
}

/* ---------- hero ---------- */
.welink-hero{
  position:relative; overflow:hidden; display:flex; align-items:flex-end;
  background-image:var(--welink-hero-bg); background-size:cover; background-position:center;
  padding:4rem 2.5rem; color:var(--welink-text-on-ink);
}
.welink-hero__overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(13,27,48,0.55) 0%, rgba(13,27,48, var(--welink-hero-overlay,0.85)) 100%);
}
.welink-hero__badge{ position:absolute; width:64px; height:64px; bottom:18px; right:18px; z-index:3; border-radius:50%; box-shadow:0 6px 20px rgba(0,0,0,0.3); }
.welink-hero__video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
}
.welink-hero__video-embed-wrap{
  position:absolute; inset:0; overflow:hidden; z-index:0; pointer-events:none;
}
.welink-hero__video-embed{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  /* Actual width/height are set in JS based on the hero's real rendered
     size, not viewport units, since the hero is not always full-screen. */
}
.welink-hero__inner{ position:relative; z-index:2; max-width:760px; }
.welink-hero__heading{ font-size:clamp(2.2rem,4.4vw,3.6rem); font-weight:800; line-height:1.15; margin:0 0 1rem; color:#fff; }
.welink-hero__lede{ font-size:1.1rem; color:var(--welink-text-on-ink-mut); max-width:60ch; }

/* ---------- section heading ---------- */
.welink-section-heading{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1.5rem; }
.welink-section-heading--stacked{ flex-direction:column; align-items:flex-start; }
.welink-section-heading__text h2{ margin:0 0 .5rem; }

/* ---------- stat row ---------- */
.welink-stat-row{ display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--welink-line-light); border-bottom:1px solid var(--welink-line-light); }
.welink-stat{ padding:1.8rem 1.4rem; border-right:1px solid var(--welink-line-light); }
.welink-stat:last-child{ border-right:0; }
.welink-stat__num{ font-size:2.2rem; font-weight:800; color:var(--welink-red-deep); line-height:1; }
.welink-stat__label{ font-size:.86rem; color:var(--welink-text-muted); margin-top:.3rem; }
@media (max-width:760px){ .welink-stat-row{ grid-template-columns:1fr 1fr; } .welink-stat{ border-bottom:1px solid var(--welink-line-light); } }

/* ---------- card grid ---------- */
.welink-card-grid{ display:grid; gap:1.5rem; margin-top:1.6rem; }
.welink-cols-2{ grid-template-columns:repeat(2,1fr); }
.welink-cols-3{ grid-template-columns:repeat(3,1fr); }
.welink-cols-4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:900px){ .welink-card-grid{ grid-template-columns:1fr 1fr !important; } }
@media (max-width:560px){ .welink-card-grid{ grid-template-columns:1fr !important; } }

.welink-card-grid--icon .welink-card,
.welink-card-grid--callout .welink-card{
  background:var(--welink-white); border:1px solid rgba(13,27,48,0.08); border-radius:var(--welink-radius);
  padding:1.8rem 1.6rem; box-shadow:0 2px 18px rgba(13,27,48,0.05);
}
.welink-card__icon-circle{
  width:48px; height:48px; border-radius:50%; background:rgba(227,6,19,0.09);
  display:flex; align-items:center; justify-content:center; margin-bottom:1.1rem; color:var(--welink-red); font-size:1.2rem;
}
.welink-card__icon-circle svg{ fill:currentColor; width:22px; height:22px; }
.welink-card h3{ font-size:1.05rem; margin:0 0 .5rem; }
.welink-card p{ font-size:.9rem; color:var(--welink-text-muted); margin:0; }
.welink-card .welink-btn{ margin-top:1.1rem; }

.welink-card-grid--step .welink-card{ border-top:2px solid var(--welink-line-light); padding-top:1.4rem; }
.welink-card-grid--step .welink-card__icon-circle{ border:1px solid var(--welink-line-light); background:#fff; }
.welink-card__step-label{ font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--welink-red); margin-bottom:.4rem; }

.welink-card-grid--callout .welink-card__big{ font-size:2.2rem; font-weight:800; color:var(--welink-red); line-height:1; margin-bottom:.6rem; }

.welink-cols-auto{ grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }

/* Plain style: white box, red left edge, no icon — matches the
   company-profile "boxes with red at the edge" reference. */
.welink-card-grid--plain .welink-card{
  background:var(--welink-white); border:1px solid rgba(13,27,48,0.08); border-left:4px solid var(--welink-red);
  border-radius:var(--welink-radius); padding:1.8rem 1.6rem; box-shadow:0 2px 18px rgba(13,27,48,0.05);
  transition:box-shadow .2s var(--welink-ease), transform .2s var(--welink-ease);
}
.welink-card-grid--plain .welink-card:hover{ box-shadow:0 10px 30px rgba(13,27,48,0.12); transform:translateY(-2px); }

/* Photo style: square image with a red hover outline, red number
   label, heading + text underneath. Used for the Services index and
   homepage services teaser grids. */
.welink-card-grid--photo .welink-card{
  display:block; text-decoration:none; color:inherit;
}
.welink-card-grid--photo .welink-card img{
  width:100%; aspect-ratio:1/1; object-fit:cover; display:block; border-radius:var(--welink-radius);
  border:3px solid transparent; transition:border-color .2s var(--welink-ease);
}
.welink-card-grid--photo .welink-card:hover img{ border-color:var(--welink-red); }
.welink-card-grid--photo .welink-card__num{
  font-size:.8rem; font-weight:800; color:var(--welink-red); letter-spacing:.05em; margin-top:1rem;
}
.welink-card-grid--photo .welink-card h4{ font-size:1.05rem; margin:.35rem 0 .4rem; color:var(--welink-text-ink); }
.welink-card-grid--photo .welink-card p{ font-size:.88rem; color:var(--welink-text-muted); margin:0; }

/* Monogram row: small badge + name, used for the Government Bodies
   page. Drop in a logo image later and it swaps in automatically. */
.welink-card-grid--mono{ gap:1rem; }
.welink-card-grid--mono .welink-card{
  display:flex; align-items:center; gap:.9rem; background:var(--welink-white);
  border:1px solid rgba(13,27,48,0.08); border-radius:var(--welink-radius); padding:1.1rem 1.3rem;
  transition:border-color .2s var(--welink-ease), box-shadow .2s var(--welink-ease);
}
.welink-card-grid--mono .welink-card:hover{ border-color:var(--welink-red); box-shadow:0 6px 20px rgba(13,27,48,0.08); }
.welink-card-grid--mono .welink-card__mono{
  flex:0 0 44px; width:44px; height:44px; border-radius:50%; background:rgba(227,6,19,0.09); color:var(--welink-red);
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:.86rem;
}
.welink-card-grid--mono .welink-card__logo{ flex:0 0 44px; width:44px; height:44px; object-fit:contain; border-radius:8px; }
.welink-card-grid--mono .welink-card span{ font-weight:600; font-size:.95rem; color:var(--welink-text-ink); }

/* ---------- page banner (inner-page hero, no carousel) ---------- */
.welink-page-banner{
  position:relative; overflow:hidden; display:flex; align-items:center; min-height:260px;
  background-image:var(--welink-hero-bg); background-size:cover; background-position:center;
  padding:3rem 0; color:var(--welink-text-on-ink);
}
.welink-page-banner::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(13,27,48,0.55) 0%, rgba(13,27,48,0.85) 100%); }
.welink-page-banner__inner{ position:relative; z-index:2; max-width:760px; }
.welink-page-banner h1{ font-size:clamp(2rem,3.6vw,2.9rem); font-weight:800; margin:0 0 .6rem; color:#fff; }
.welink-page-banner p{ color:var(--welink-text-on-ink-mut); margin:0; font-size:1.05rem; }

/* ---------- deck split (photo + overlapping quote card / red-corner list card) ---------- */
.welink-deck-split{ display:flex; align-items:stretch; gap:0; }
.welink-deck-split--rev{ flex-direction:row-reverse; }
.welink-deck-photo-wrap{ position:relative; flex:0 0 46%; }
/* Elementor's own .e-con.e-flex{flex:...} rule is a two-class (0,2,0)
   selector, which can outrank our plain single-class rule above once the
   container itself also carries Elementor's e-con/e-flex classes. Pin the
   real proportional width with a matching-specificity compound selector so
   it always wins on an Elementor-built page, while the plain rule above
   remains a fallback for any non-Elementor usage. */
.e-con.welink-deck-photo-wrap{ position:relative; flex:0 0 46%; }
.welink-deck-photo-wrap img{ width:100%; height:100%; object-fit:cover; display:block; border-radius:var(--welink-radius); }
.welink-deck-quote{
  position:absolute; left:1.6rem; right:1.6rem; bottom:-1.8rem; background:var(--welink-ink); color:#fff;
  border-radius:var(--welink-radius); padding:1.5rem 1.7rem; box-shadow:0 20px 44px rgba(13,27,48,0.3);
}
.welink-deck-quote p{ margin:0; font-style:italic; font-size:.98rem; color:var(--welink-text-on-ink-mut); }
.welink-deck-card{
  flex:1; background:var(--welink-white); border-radius:var(--welink-radius); padding:2.4rem clamp(1.6rem,3vw,2.6rem);
  position:relative; box-shadow:0 2px 18px rgba(13,27,48,0.05); margin-left:2.4rem;
}
.e-con.welink-deck-card{ flex:1; }
.welink-deck-split--rev .welink-deck-card{ margin-left:0; margin-right:2.4rem; }
.welink-deck-card::before{ content:""; position:absolute; top:0; right:0; width:64px; height:64px; border-top:4px solid var(--welink-red); border-right:4px solid var(--welink-red); border-top-right-radius:var(--welink-radius); }
.welink-deck-split--rev .welink-deck-card::before{ right:auto; left:0; border-right:0; border-left:4px solid var(--welink-red); border-top-right-radius:0; border-top-left-radius:var(--welink-radius); }
.welink-deck-card h3{ font-size:1.3rem; margin:0 0 1rem; }
.welink-deck-list{ list-style:none; margin:1.2rem 0 0; padding:0; display:flex; flex-direction:column; gap:.7rem; }
.welink-deck-list li{ display:flex; gap:.7rem; align-items:flex-start; font-size:.94rem; }
.welink-deck-list svg{ width:19px; height:19px; color:var(--welink-red); flex-shrink:0; margin-top:2px; }
@media (max-width:820px){
  .welink-deck-split, .welink-deck-split--rev{ flex-direction:column; }
  .welink-deck-photo-wrap{ flex:none; }
  .welink-deck-card, .welink-deck-split--rev .welink-deck-card{ margin:2.4rem 0 0; }
  .welink-deck-quote{ position:static; margin-top:-1.8rem; margin-inline:1.2rem; }
}

/* ---------- founder spotlight (Leadership page) ---------- */
.welink-spotlight{ display:flex; align-items:center; gap:3.5rem; }
.welink-spotlight-left{ flex:1; min-width:0; }
.e-con.welink-spotlight-left{ flex:1; min-width:0; }
.welink-spotlight-right{ flex:0 0 42%; position:relative; }
/* See the .e-con.welink-deck-photo-wrap note above: pin the real 42% width
   with a compound selector at matching specificity to Elementor's own
   .e-con.e-flex rule, so it can't be silently overridden. */
.e-con.welink-spotlight-right{ flex:0 0 42%; position:relative; }
.welink-spotlight-right img{ width:100%; border-radius:20px; display:block; object-fit:cover; aspect-ratio:4/5; object-position:top center; box-shadow:0 24px 60px rgba(0,0,0,0.3); }
.welink-spotlight-stats{ display:flex; gap:0; margin:1.6rem 0; border-top:1px solid var(--welink-line-light); border-bottom:1px solid var(--welink-line-light); }
.welink-spotlight-stat{ flex:1; padding:1.2rem 1.2rem 1.2rem 0; border-right:1px solid var(--welink-line-light); }
/* .welink-spotlight-stat is also a real Elementor container (a direct flex
   child of .welink-spotlight-stats), so it's subject to the same
   .e-con.e-flex specificity override as the two-column pairs above —
   pin its even 1:1 split the same way. */
.e-con.welink-spotlight-stat{ flex:1; }
.welink-spotlight-stat:last-child{ border-right:0; padding-right:0; }
.welink-spotlight-stat__num{ font-size:2rem; font-weight:800; color:var(--welink-red-deep); line-height:1; }
.welink-spotlight-stat__label{ font-size:.85rem; font-weight:700; margin-top:.3rem; }
.welink-spotlight-stat__desc{ font-size:.82rem; color:var(--welink-text-muted); margin-top:.3rem; }
.welink-spotlight-quotebar{ background:var(--welink-ink); color:#fff; border-radius:var(--welink-radius); padding:1.5rem 1.8rem; margin:1.6rem 0; }
.welink-spotlight-quotebar p{ margin:0; font-style:italic; color:var(--welink-text-on-ink-mut); }
.welink-spotlight-bio p{ margin:0 0 1rem; color:var(--welink-text-muted); }
@media (max-width:900px){ .welink-spotlight{ flex-direction:column; } .welink-spotlight-right{ flex:none; max-width:360px; } }

/* ---------- core leadership grid (Leadership page) ---------- */
.welink-core-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.8rem; }
.welink-core-card{ background:var(--welink-white); border-radius:var(--welink-radius); overflow:hidden; box-shadow:0 2px 18px rgba(13,27,48,0.05); border:1px solid rgba(13,27,48,0.08); }
.welink-core-card__head{ background:var(--welink-ink); color:#fff; padding:1.4rem 1.5rem; }
.welink-core-card__head h3{ margin:0 0 .2rem; font-size:1.1rem; color:#fff; }
.welink-core-card__head span{ font-size:.82rem; color:var(--welink-text-on-ink-mut); }
.welink-core-card__stat{ padding:1rem 1.5rem 0; font-size:1.6rem; font-weight:800; color:var(--welink-red-deep); }
.welink-core-card__points{ list-style:none; margin:1rem 0 0; padding:0 1.5rem; display:flex; flex-direction:column; gap:.5rem; }
.welink-core-card__points li{ display:flex; gap:.6rem; font-size:.88rem; color:var(--welink-text-ink); }
.welink-core-card__points li::before{ content:attr(data-n); flex:0 0 auto; font-weight:800; color:var(--welink-red); }
.welink-core-card__bio{ padding:1.2rem 1.5rem 1.6rem; font-size:.86rem; color:var(--welink-text-muted); border-top:1px solid var(--welink-line-light); margin-top:1.2rem; }
@media (max-width:900px){ .welink-core-grid{ grid-template-columns:1fr; } }

/* ---------- services index band + government bodies groups ---------- */
.welink-services-band-head{ margin-bottom:1.6rem; }
.welink-gov-group{ margin-top:2.4rem; }
.welink-gov-group h3{ font-size:1.05rem; margin:0 0 1rem; color:var(--welink-red-deep); }

/* ---------- about/feature card + col-card hover outline ---------- */
.welink-card-grid--icon .welink-card,
.welink-card-grid--callout .welink-card{ transition:box-shadow .2s var(--welink-ease), border-color .2s var(--welink-ease); }
.welink-card-grid--icon .welink-card:hover,
.welink-card-grid--callout .welink-card:hover{ border-color:var(--welink-red); box-shadow:0 10px 30px rgba(13,27,48,0.1); }

/* ---------- tabs ---------- */
.welink-tabs--text .welink-tabs__nav{ display:flex; gap:1.6rem; border-bottom:1px solid var(--welink-line-light); flex-wrap:wrap; }
.welink-tabs--text .welink-tabs__nav-item{
  all:unset; cursor:pointer; padding:.9rem 0; font-weight:700; color:var(--welink-text-muted); border-bottom:2px solid transparent;
}
.welink-tabs--text .welink-tabs__nav-item.welink-active{ color:var(--welink-red); border-color:var(--welink-red); }
.welink-tabs__nav-n{ font-size:.78rem; margin-right:.5rem; color:var(--welink-red); }
.welink-tabs__panel{ display:none; padding-top:1.4rem; }
.welink-tabs__panel.welink-active{ display:block; }

.welink-tabs--image{ background:var(--welink-white); border-radius:20px; box-shadow:0 12px 44px rgba(13,27,48,0.09); overflow:hidden; }
.welink-tabs--image .welink-tabs__nav{ display:flex; flex-wrap:wrap; border-bottom:1px solid rgba(13,27,48,0.06); padding:0 1.6rem; }
.welink-tabs--image .welink-tabs__nav-item{
  all:unset; cursor:pointer; padding:1.3rem 1.1rem; font-weight:700; font-size:.92rem; color:var(--welink-text-muted);
  border-bottom:2px solid transparent; margin-bottom:-1px;
}
.welink-tabs--image .welink-tabs__nav-item.welink-active{ color:var(--welink-red); border-color:var(--welink-red); }
.welink-tabs--image .welink-tabs__panel{ padding-top:0; }
.welink-tabs__panel-grid{ display:grid; grid-template-columns:1fr 1fr; }
.welink-tabs__panel-grid img{ width:100%; height:100%; object-fit:cover; min-height:320px; display:block; }
.welink-tabs__panel-copy{ padding:2.4rem clamp(1.6rem,3vw,3rem); display:flex; flex-direction:column; justify-content:center; }
.welink-tabs__panel-copy h3{ font-size:1.4rem; margin:0 0 .8rem; }
@media (max-width:820px){ .welink-tabs__panel-grid{ grid-template-columns:1fr; } .welink-tabs__panel-grid img{ min-height:220px; } }

.welink-checklist{ list-style:none; margin:1.1rem 0 0; padding:0; display:flex; flex-direction:column; gap:.6rem; }
.welink-checklist li{ padding-left:1.3rem; position:relative; font-size:.94rem; }
.welink-checklist li::before{ content:"\2713"; position:absolute; left:0; color:var(--welink-red); font-weight:700; }

/* ---------- team rows ---------- */
.welink-team-row{ display:grid; grid-template-columns:340px 1fr; gap:3rem; align-items:center; padding:3rem 0; }
.welink-team-row--rev{ direction:rtl; }
.welink-team-row--rev > *{ direction:ltr; }
.welink-team-row__photo{ position:relative; }
.welink-team-row__photo img{ width:100%; border-radius:18px; display:block; box-shadow:0 20px 50px rgba(0,0,0,0.35); }
.welink-team-row__badge{ position:absolute; bottom:-18px; right:-18px; width:76px; height:76px; border-radius:50%; }
.welink-role-badge{
  display:inline-block; font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  color:var(--welink-red-pale); border:1px solid var(--welink-line-dark); padding:.35rem .8rem; border-radius:999px; margin-bottom:.8rem;
}
.welink-team-row h3{ font-size:1.4rem; margin:0 0 1rem; }
.welink-team-row__bio p{ margin:0 0 1rem; }
.welink-focus-chips{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1.2rem; }
.welink-focus-chip{ font-size:.82rem; border:1px solid var(--welink-line-dark); padding:.4rem .8rem; border-radius:999px; }
@media (max-width:820px){ .welink-team-row, .welink-team-row--rev{ grid-template-columns:1fr; direction:ltr; } .welink-team-row__photo{ max-width:280px; margin:0 auto; } }

/* ---------- FAQ ---------- */
.welink-faq-list{ border-top:1px solid var(--welink-line-light); }
.welink-faq-item{ border-bottom:1px solid var(--welink-line-light); }
.welink-faq-q{
  all:unset; box-sizing:border-box; width:100%; display:flex; align-items:center; justify-content:space-between;
  padding:1.4rem 0; cursor:pointer; font-weight:700; font-size:1.05rem; color:var(--welink-text-ink); gap:1rem;
}
.welink-faq-plus{ font-size:1.4rem; color:var(--welink-red-deep); transition:transform .25s var(--welink-ease); flex-shrink:0; }
.welink-faq-item.welink-open .welink-faq-plus{ transform:rotate(45deg); }
.welink-faq-a{ max-height:0; overflow:hidden; transition:max-height .3s var(--welink-ease); }
.welink-faq-item.welink-open .welink-faq-a{ max-height:320px; }
.welink-faq-a p{ padding-bottom:1.4rem; color:var(--welink-text-muted); margin:0; }

/* ---------- service detail ---------- */
.welink-svc-group{ margin-top:2.2rem; }
.welink-svc-group h3{ font-size:1.15rem; margin:0 0 1rem; padding-bottom:.8rem; border-bottom:2px solid var(--welink-line-light); }
.welink-svc-list{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:.9rem 2rem; }
.welink-svc-list li{ display:flex; gap:.7rem; align-items:flex-start; font-size:.95rem; margin:0; }
.welink-svc-list svg{ width:19px; height:19px; color:var(--welink-red); flex-shrink:0; margin-top:2px; }
@media (max-width:700px){ .welink-svc-list{ grid-template-columns:1fr; } }
.welink-svc-callout{
  margin-top:2rem; background:var(--welink-white); border:1px solid rgba(13,27,48,0.08); border-radius:var(--welink-radius);
  padding:1.8rem 2rem; box-shadow:0 2px 18px rgba(13,27,48,0.05);
}
.welink-svc-callout p{ font-size:1.05rem; color:var(--welink-text-ink); font-style:italic; margin:0; }
.welink-svc-related{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.2rem; }
.welink-svc-related a{
  border:1px solid var(--welink-line-light); border-radius:999px; padding:.55rem 1.1rem; font-size:.86rem; font-weight:600;
  color:var(--welink-text-ink); text-decoration:none;
}
.welink-svc-related a:hover{ border-color:var(--welink-red); color:var(--welink-red); }

/* ---------- CTA band ---------- */
.welink-cta-band{ display:flex; align-items:center; gap:2.5rem; flex-wrap:wrap; padding:3rem; border-radius:var(--welink-radius); }
.welink-cta-band--maroon{ background:var(--welink-maroon); color:var(--welink-text-on-ink); }
.welink-cta-band--ink{ background:var(--welink-ink); color:var(--welink-text-on-ink); }
.welink-cta-band--paper{ background:var(--welink-paper); color:var(--welink-text-ink); }
.welink-cta-band--pale_blue{ background:#EBF4FF; color:var(--welink-text-ink); }
.welink-cta-band--pale_blue h2{ color:var(--welink-ink); }
.welink-cta-band--pale_blue p{ color:var(--welink-text-muted); }
.welink-cta-band--maroon h2, .welink-cta-band--ink h2{ color:#fff; }
.welink-cta-band--maroon p, .welink-cta-band--ink p{ color:var(--welink-text-on-ink-mut); }
.welink-cta-band__copy{ flex:1; min-width:260px; }
.welink-cta-band__copy h2{ margin:0 0 .6rem; }
.welink-cta-band--has-image .welink-cta-band__image{ flex:0 0 260px; }
.welink-cta-band--has-image.welink-cta-band--img-right{ flex-direction:row-reverse; }
.welink-cta-band__image img{ width:100%; border-radius:16px; box-shadow:0 20px 50px rgba(0,0,0,0.35); display:block; }
@media (max-width:640px){ .welink-cta-band{ flex-direction:column; text-align:center; } .welink-cta-band--has-image.welink-cta-band--img-right{ flex-direction:column; } }

/* ---------- success band ---------- */
.welink-success-band{
  position:relative; border-radius:20px; overflow:hidden; min-height:420px; display:flex; align-items:flex-end;
  background-image:var(--welink-success-bg); background-size:cover; background-position:center;
}
.welink-success-band::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(13,27,48,0.05) 30%, rgba(13,27,48,0.92) 100%); }
.welink-success-cards{ position:relative; z-index:2; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(244,243,240,0.14); width:100%; }
.welink-success-card{ background:rgba(13,27,48,0.55); padding:1.8rem; }
.welink-success-card h3{ color:#fff; font-size:1.02rem; margin:.9rem 0 .5rem; }
.welink-success-card p{ color:var(--welink-text-on-ink-mut); font-size:.86rem; margin:0; }
@media (max-width:820px){ .welink-success-cards{ grid-template-columns:1fr; } .welink-success-band{ min-height:auto; } }

/* ---------- hero carousel widget ---------- */
.welink-hero-carousel{ position:relative; overflow:hidden; }
.welink-hero-slide{
  position:absolute; inset:0; display:flex; align-items:flex-end;
  background-image:var(--welink-hero-bg); background-size:cover; background-position:center;
  padding:4rem 0; opacity:0; visibility:hidden; transition:opacity 1s ease;
}
/* Text vertical position — set per-slide from that slide's own controls */
.welink-hero-slide--v-top{ align-items:flex-start; }
.welink-hero-slide--v-middle{ align-items:center; }
.welink-hero-slide--v-bottom{ align-items:flex-end; }
/* Text horizontal position — set per-slide from that slide's own controls */
/* Block Position \u2014 where the whole text block sits across the carousel width */
.welink-hero-slide--pos-left .welink-hero-carousel__inner{ margin-left:0; margin-right:auto; }
.welink-hero-slide--pos-center .welink-hero-carousel__inner{ margin-left:auto; margin-right:auto; }
.welink-hero-slide--pos-right .welink-hero-carousel__inner{ margin-left:auto; margin-right:0; }
/* Text Alignment \u2014 how the lines/buttons line up inside that block, independent of its position */
.welink-hero-slide--h-left .welink-hero-carousel__inner{ text-align:left; }
.welink-hero-slide--h-center .welink-hero-carousel__inner{ text-align:center; }
.welink-hero-slide--h-right .welink-hero-carousel__inner{ text-align:right; }
.welink-hero-slide--h-left .welink-hero-carousel__inner > *{ margin-left:0; margin-right:auto; }
.welink-hero-slide--h-center .welink-hero-carousel__inner > *{ margin-left:auto; margin-right:auto; }
.welink-hero-slide--h-right .welink-hero-carousel__inner > *{ margin-left:auto; margin-right:0; }
.welink-hero-slide--h-left .welink-btn-row{ justify-content:flex-start; }
.welink-hero-slide--h-center .welink-btn-row{ justify-content:center; }
.welink-hero-slide--h-right .welink-btn-row{ justify-content:flex-end; }
.welink-hero-slide::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(13,27,48,0.55) 0%, rgba(13,27,48, var(--welink-hero-overlay,0.75)) 100%); }
.welink-hero-slide.is-active{ opacity:1; visibility:visible; z-index:1; }
.welink-hero-carousel__inner{ position:relative; z-index:2; max-width:1180px; width:100%; margin:0 auto; padding:0 clamp(1.5rem,5vw,4rem); }
.welink-hero-carousel__inner > *{ max-width:760px; }
.welink-hero-carousel__badge{ position:absolute; width:64px; height:64px; bottom:24px; right:24px; z-index:3; border-radius:50%; box-shadow:0 6px 20px rgba(0,0,0,0.3); }
.welink-hero-slide h1{ font-size:clamp(2.2rem,4.4vw,3.6rem); font-weight:800; line-height:1.15; margin:0 0 1rem; color:#fff; }
.welink-hero-carousel__lede{ color:var(--welink-text-on-ink-mut); max-width:60ch; }
.welink-hero-carousel__dots{ position:absolute; z-index:3; bottom:26px; left:50%; transform:translateX(-50%); display:flex; gap:.6rem; }
.welink-hero-dot{ all:unset; width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,0.35); cursor:pointer; }
.welink-hero-dot.is-active{ background:var(--welink-red); width:22px; border-radius:5px; }
.welink-reveal-up{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
.welink-reveal-up.welink-in{ opacity:1; transform:translateY(0); }
/* Elementor's own editor preview doesn't reliably fire the scroll-based
   IntersectionObserver that normally adds .welink-in on the live site,
   which left this text permanently invisible while editing. Force it
   visible inside the editor specifically so you can always see and edit
   it \u2014 the real fade-in animation is untouched on the published site. */
.elementor-editor-active .welink-reveal-up{ opacity:1 !important; transform:none !important; }

/* ---------- timeline widget ---------- */
.welink-timeline{ position:relative; height:170px; }
.welink-timeline__line{ position:absolute; left:0; right:0; top:50%; height:2px; background:var(--welink-red); }
.welink-timeline__point{
  position:absolute; top:50%; text-decoration:none; cursor:pointer; text-align:center;
  display:flex; flex-direction:column; align-items:center; width:13%;
  transform:translateX(-50%);
}
/* Point position is now set inline per-stage (see class-timeline.php render()),
   so it works correctly for any number of stages instead of being hardcoded
   to exactly 7 fixed percentages. */
.welink-timeline__dot{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:16px; height:16px; border-radius:50%; background:var(--welink-ink); border:3px solid var(--welink-red); transition:transform .2s; }
.welink-timeline__point:hover .welink-timeline__dot{ transform:translate(-50%,-50%) scale(1.3); }
.welink-timeline__lbl{
  position:absolute; left:50%; transform:translateX(-50%); width:120px;
  font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--welink-text-on-ink-mut); line-height:1.4;
}
.welink-timeline__point.pos-above .welink-timeline__lbl{ bottom:calc(50% + 16px); }
.welink-timeline__point.pos-below .welink-timeline__lbl{ top:calc(50% + 16px); }
.welink-timeline__point:hover .welink-timeline__lbl{ color:#fff; }
/* Keep the exact desktop layout at all screen sizes \u2014 on narrow screens
   the timeline scrolls horizontally instead of restructuring, so it
   always renders identically to desktop, just panned into view. */
.welink-timeline-scroll{
  overflow-x:auto; -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
}
@media (max-width:900px){
  .welink-timeline{ min-width:var(--welink-tl-min-width, 820px); }
}

/* ---------- brand color / consistency fixes ---------- */
.welink-on-dark .welink-kicker, .welink-kicker--on-dark{ color:var(--welink-red) !important; }
.welink-btn{ justify-content:center; }
.welink-btn--solid{ color:#fff !important; }
.welink-on-pale-blue{ background:#EBF4FF; }

/* ---------- image hover slider ---------- */
.welink-hover-slider{
  position:relative; padding:0 64px;
}
.welink-hover-slider__viewport{
  overflow:hidden; width:100%;
}
.welink-hover-slider__track{
  display:flex; gap:var(--welink-hs-gap,20px);
  transition:transform .45s var(--welink-ease);
  will-change:transform;
}
.welink-hover-slide{
  position:relative; display:block; flex:0 0 auto;
  width:calc((100% - (var(--welink-hs-show,4) - 1) * var(--welink-hs-gap,20px)) / var(--welink-hs-show,4));
  height:var(--welink-hs-img-h,340px);
  border-radius:var(--welink-hs-radius,14px);
  overflow:hidden; text-decoration:none;
  background:var(--welink-paper);
}
.welink-hover-slide img{
  position:absolute !important; inset:0 !important; width:100% !important; height:100% !important;
  object-fit:cover !important; display:block !important;
  transition:transform .5s var(--welink-ease);
}
.welink-hover-slide:hover img{ transform:scale(1.05); }

.welink-hover-slide__caption-bg{
  position:absolute; inset:0; opacity:0; transition:opacity .35s var(--welink-ease);
}
.welink-hover-slide__caption{
  position:absolute; left:0; right:0; padding:1.1rem 1.3rem;
  font-weight:700; font-size:1rem; line-height:1.3;
  opacity:0; transition:opacity .35s var(--welink-ease), transform .35s var(--welink-ease);
  z-index:2;
}

/* Style 1: overlay fades in on top, caption bottom-anchored */
.welink-hover-slider--overlay-fade .welink-hover-slide__caption-bg{ bottom:0; height:100%; background:rgba(13,27,48,.78); }
.welink-hover-slider--overlay-fade .welink-hover-slide__caption{ bottom:0; transform:translateY(8px); }
.welink-hover-slider--overlay-fade .welink-hover-slide:hover .welink-hover-slide__caption-bg,
.welink-hover-slider--overlay-fade .welink-hover-slide:hover .welink-hover-slide__caption{ opacity:1; transform:translateY(0); }

/* Style 2: text slides up from the bottom edge */
.welink-hover-slider--slide-up .welink-hover-slide__caption-bg{
  bottom:0; height:100%;
  background:linear-gradient(to top, rgba(13,27,48,.92) 0%, rgba(13,27,48,0) 65%);
}
.welink-hover-slider--slide-up .welink-hover-slide__caption{ bottom:0; transform:translateY(100%); }
.welink-hover-slider--slide-up .welink-hover-slide:hover .welink-hover-slide__caption-bg{ opacity:1; }
.welink-hover-slider--slide-up .welink-hover-slide:hover .welink-hover-slide__caption{ opacity:1; transform:translateY(0); }

/* Style 3: image darkens fully, text centered */
.welink-hover-slider--darken .welink-hover-slide__caption-bg{ inset:0; background:rgba(13,27,48,.6); }
.welink-hover-slider--darken .welink-hover-slide__caption{ top:50%; transform:translateY(-40%); text-align:center; }
.welink-hover-slider--darken .welink-hover-slide:hover .welink-hover-slide__caption-bg{ opacity:1; }
.welink-hover-slider--darken .welink-hover-slide:hover .welink-hover-slide__caption{ opacity:1; transform:translateY(-50%); }

.welink-hover-slider__arrow{
  width:44px; height:44px; border-radius:50%; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 14px rgba(13,27,48,.18);
  transition:opacity .2s var(--welink-ease), transform .2s var(--welink-ease);
  z-index:3;
}
.welink-hover-slider__arrow[disabled]{ opacity:.35; cursor:default; pointer-events:none; }

/* Overlay layout (default): arrows float on the image edges, position
   comes from the Vertical Position / Distance from Edge controls. */
.welink-hover-slider--arrows-overlay .welink-hover-slider__arrow-row{
  position:static;
}
.welink-hover-slider--arrows-overlay .welink-hover-slider__arrow{
  position:absolute; top:50%; transform:translateY(-50%);
}
.welink-hover-slider--arrows-overlay .welink-hover-slider__arrow--prev{ left:0; }
.welink-hover-slider--arrows-overlay .welink-hover-slider__arrow--next{ right:0; }
.welink-hover-slider--arrows-overlay .welink-hover-slider__arrow:hover{ transform:translateY(-50%) scale(1.06); }

/* Below layout: arrows sit in a normal flex row under the images.
   Alignment / gap / top margin come from the controls above. */
.welink-hover-slider--arrows-below{ padding:0; }
.welink-hover-slider--arrows-below .welink-hover-slider__arrow-row{
  display:flex; align-items:center; justify-content:center; gap:16px; margin-top:20px;
}
.welink-hover-slider--arrows-below .welink-hover-slider__arrow:hover{ transform:scale(1.06); }

.welink-hover-slider__dots{
  display:flex; justify-content:center; gap:.4rem; margin-top:1.1rem;
}
.welink-hover-slider__dot{
  width:8px; height:8px; border-radius:50%; border:none; padding:0; cursor:pointer;
  background:var(--welink-line-light);
  transition:background .2s var(--welink-ease), transform .2s var(--welink-ease);
}
.welink-hover-slider__dot.is-active{ background:var(--welink-red); transform:scale(1.25); }

@media (max-width:1024px){
  .welink-hover-slide{
    width:calc((100% - (var(--welink-hs-show-tablet,2) - 1) * var(--welink-hs-gap,20px)) / var(--welink-hs-show-tablet,2));
  }
}
@media (max-width:640px){
  .welink-hover-slider{ padding:0 48px; }
  .welink-hover-slide{
    width:calc((100% - (var(--welink-hs-show-mobile,1) - 1) * var(--welink-hs-gap,20px)) / var(--welink-hs-show-mobile,1));
  }
  .welink-hover-slider__arrow{ width:36px; height:36px; }
}

/* ---------- hero carousel: mobile safety net ---------- */
@media (max-width:640px){
  .welink-hero-slide{ padding:2.2rem 0; }
  .welink-hero-carousel__inner h1{ font-size:clamp(1.5rem, 7vw, 2.1rem); line-height:1.25; }
  .welink-hero-carousel__inner p{ font-size:.92rem; }
  .welink-btn-row{ gap:.6rem; }
}