/* ==========================================================================
   VIRAL ADVICE MEDIA  -  V2 design system (home-2 and future v2 pages)
   Standalone: no Bootstrap. Brand palette kept, depth pushed darker in the
   hero/process/case bands, lighter paper everywhere else for readability.
   ========================================================================== */

:root {
  /* brand */
  --ink:       #15292B;
  --ink-2:     #0E1C1E;
  --night:     #081214;
  --teal:      #2E6E76;
  --teal-2:    #1F555C;
  --aqua:      #589AA2;
  --mint:      #9FD2D9;
  --mint-2:    #C9EAEE;
  /* surfaces */
  --paper:     #FFFFFF;
  --cream:     #FBF8F2;
  --sand:      #F3EEE4;
  --line:      #E6DFD2;
  --line-dk:   rgba(159, 210, 217, .16);
  /* text */
  --text:      #15292B;
  --muted:     #55625F;
  --on-dark:   #E9F3F4;
  --on-dark-2: #A9C2C5;

  --f-head: "Bricolage Grotesque", "Inter", system-ui, sans-serif;
  --f-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-serif: "Instrument Serif", Georgia, serif;

  --wrap: 1240px;
  --gut: clamp(16px, 4vw, 40px);
  --r-sm: 10px;
  --r: 18px;
  --r-lg: 28px;
  --ease: cubic-bezier(.22, .61, .36, 1);
  --shadow: 0 24px 50px -30px rgba(14, 28, 30, .35);
  --shadow-lg: 0 40px 80px -40px rgba(8, 18, 20, .55);
}

/* ----- Base ----- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body.v2 {
  margin: 0; background: var(--cream); color: var(--text);
  font: 400 16px/1.6 var(--f-body);
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img { max-width: 100%; }
a { color: inherit; text-decoration: none; }
:focus-visible { outline: 2px solid var(--aqua); outline-offset: 3px; border-radius: 6px; }
/* Resets apply to full v2 pages and to the v2 header/footer only, so v1 page
   bodies (body.v2-legacy, still on Bootstrap + style.css) render unchanged.
   Every reset is element-level specificity (0,0,1) via :where(), so any
   component class wins, and because v2.css loads after Bootstrap it still
   beats Bootstrap's own element rules inside the header/footer. */
:where(body.v2-full, .v2-head, .v2-foot) img { display: block; }
:where(body.v2-full, .v2-head, .v2-foot) :is(h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote) { margin: 0; }
:where(body.v2-full, .v2-head, .v2-foot) :is(ul, ol) { padding: 0; list-style: none; }
:where(body.v2-full, .v2-head, .v2-foot) :is(button, input, select, textarea) { font: inherit; color: inherit; }
:where(body.v2-full, .v2-head, .v2-foot, .v2-chat) button, button:where(.v2-chat) { cursor: pointer; background: none; border: 0; padding: 0; }
:where(body.v2-full, .v2-head, .v2-foot) em { font-style: normal; }

.v2-skip { position: fixed; left: 12px; top: -80px; z-index: 200; background: var(--ink); color: #fff; padding: 10px 16px; border-radius: 8px; transition: top .2s; }
.v2-skip:focus { top: 12px; }
.v2-wrap { width: 100%; max-width: calc(var(--wrap) + var(--gut) * 2); margin-inline: auto; padding-inline: var(--gut); }
.v2-center { text-align: center; margin-top: 40px; }

/* ----- Icons ----- */
.v2-ic { width: 24px; height: 24px; flex: none; }
.v2-ic--sm { width: 18px; height: 18px; }
.v2-ic--xs { width: 14px; height: 14px; }
.v2-ic--flip { transform: scaleX(-1); }

/* ----- Type ----- */
.v2-eyebrow {
  display: inline-flex; align-items: center; gap: 10px; margin-bottom: 16px;
  font: 600 13px/1 var(--f-body); letter-spacing: .14em; text-transform: uppercase; color: var(--teal);
}
.v2-eyebrow::before { content: ""; width: 22px; height: 2px; border-radius: 2px; background: currentColor; }
.v2-eyebrow--light { color: var(--mint); }
.v2-h2 {
  font: 600 clamp(32px, 4.4vw, 54px)/1.06 var(--f-head); letter-spacing: -.025em; color: var(--ink); text-wrap: balance;
}
.v2-h2 em, .h2-hero__title em, .h2-case__title em, .h2-audit__title em, .h2-final__title em {
  font-family: var(--f-serif); font-style: italic; font-weight: 400; letter-spacing: -.01em; color: var(--teal);
}
.v2-h2--light { color: #fff; }
.v2-h2--light em { color: var(--mint); }
.v2-lead { font-size: clamp(16px, 1.25vw, 18px); color: var(--muted); max-width: 56ch; }

/* ----- Buttons ----- */
.v2-btn {
  --bg: var(--ink); --fg: #fff;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 12px 22px; border-radius: 999px;
  background: var(--bg); color: var(--fg); border: 1px solid transparent;
  font: 600 15px/1.2 var(--f-body); white-space: nowrap;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), background-color .25s var(--ease), color .25s;
}
.v2-btn:hover { transform: translateY(-2px); }
.v2-btn:active { transform: translateY(0); }
.v2-btn .v2-ic { transition: transform .25s var(--ease); }
.v2-btn:hover .v2-ic { transform: translateX(3px); }
.v2-btn--primary {
  --fg: #fff;
  background: linear-gradient(135deg, #3A8590 0%, var(--teal) 45%, var(--teal-2) 100%);
  box-shadow: 0 12px 28px -12px rgba(46, 110, 118, .75), inset 0 1px 0 rgba(255,255,255,.18);
}
.v2-btn--primary:hover { box-shadow: 0 18px 36px -12px rgba(46, 110, 118, .85), inset 0 1px 0 rgba(255,255,255,.22); }
.v2-btn--dark { --bg: var(--ink); }
.v2-btn--dark:hover { --bg: var(--teal-2); }
.v2-btn--light { --bg: #fff; --fg: var(--ink); }
.v2-btn--light:hover { --bg: var(--mint-2); }
.v2-btn--glass { --bg: rgba(255,255,255,.08); --fg: #fff; border-color: rgba(255,255,255,.22); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.v2-btn--glass:hover { --bg: rgba(255,255,255,.16); }
.v2-btn--outline { --bg: transparent; --fg: var(--ink); border-color: var(--ink); }
.v2-btn--outline:hover { --bg: var(--ink); --fg: #fff; }
.v2-btn--sm { min-height: 42px; padding: 9px 18px; font-size: 14px; }
.v2-btn--lg { min-height: 56px; padding: 15px 28px; font-size: 16px; }
.v2-btn--block { width: 100%; }

/* ----- Pill ----- */
.v2-pill {
  display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px 8px 12px; border-radius: 999px;
  background: rgba(159, 210, 217, .1); border: 1px solid rgba(159, 210, 217, .28); color: var(--mint-2);
  font-size: 13px; font-weight: 500; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.v2-pill__dot { width: 8px; height: 8px; border-radius: 50%; background: #6EE7C8; box-shadow: 0 0 0 0 rgba(110,231,200,.6); animation: v2-pulse 2.2s infinite; }
@media (max-width: 420px) { .v2-pill__more { display: none; } }
@keyframes v2-pulse { 70% { box-shadow: 0 0 0 9px rgba(110,231,200,0); } 100% { box-shadow: 0 0 0 0 rgba(110,231,200,0); } }

/* ==========================================================================
   HEADER
   ========================================================================== */
.v2-head {
  position: fixed; inset: 0 0 auto; z-index: 100; padding: 14px 0;
  transition: background-color .35s var(--ease), box-shadow .35s var(--ease), padding .35s var(--ease), transform .4s var(--ease);
}
.v2-head__bar { display: flex; align-items: center; gap: 24px; }
.v2-head__logo { position: relative; flex: none; display: block; width: 150px; height: 42px; }
.v2-logo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: left center; transition: opacity .3s; }
.v2-logo--dark { opacity: 0; }

.v2-nav { flex: 1; display: flex; justify-content: center; }
.v2-nav__list { display: flex; align-items: center; gap: 4px; padding: 5px; border-radius: 999px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.v2-nav__item { position: relative; }
.v2-nav__link {
  display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border-radius: 999px;
  color: rgba(255,255,255,.88); font-size: 15px; font-weight: 500; transition: background-color .2s, color .2s;
}
.v2-nav__link:hover, .v2-nav__item--drop.is-open .v2-nav__link { background: rgba(255,255,255,.1); color: #fff; }
.v2-nav__trigger .v2-ic { transition: transform .25s var(--ease); }
.v2-nav__item--drop.is-open .v2-nav__trigger .v2-ic { transform: rotate(180deg); }
.v2-nav__mobile-cta { display: none; }

/* ----- Services mega menu (desktop) ----- */
.v2-head__bar { position: relative; }
.v2-nav__item--drop { position: static; }
.v2-mega {
  position: absolute; top: calc(100% + 12px); left: 50%; width: min(1240px, calc(100vw - 32px));
  translate: -50% 10px; opacity: 0; visibility: hidden; pointer-events: none;
  background: #fff; color: var(--ink); border-radius: 22px; padding: 14px; box-shadow: 0 40px 90px -40px rgba(8,18,20,.55), 0 0 0 1px var(--line);
  transition: opacity .25s var(--ease), translate .25s var(--ease), visibility .25s;
}
.v2-mega::before { content: ""; position: absolute; inset: -20px 0 auto; height: 20px; } /* hover bridge */
.v2-nav__item--drop.is-open .v2-mega { opacity: 1; visibility: visible; pointer-events: auto; translate: -50% 0; }
.v2-mega__grid { display: grid; grid-template-columns: 1fr 1fr 1fr 290px; gap: 12px; }
.v2-mega__col { display: flex; flex-direction: column; gap: 18px; padding: 20px 20px 22px; border-radius: 16px; background: #F3F8F9; }
.v2-mega__head { display: flex; align-items: center; gap: 12px; font: 600 16px/1.25 var(--f-head); letter-spacing: -.01em; color: var(--ink); }
.v2-mega__head:hover { color: var(--teal); }
.v2-mega__ic { display: grid; place-items: center; width: 40px; height: 40px; flex: none; border-radius: 11px; color: #fff; background: linear-gradient(140deg, #3A8590, var(--teal-2)); box-shadow: 0 8px 16px -8px rgba(46,110,118,.8); }
.v2-mega__ic .v2-ic { width: 20px; height: 20px; }
.v2-mega__links { display: grid; gap: 2px; margin-top: 8px !important; padding-left: 52px !important; }
.v2-mega__links a { display: block; padding: 5px 0; font-size: 14.5px; color: #33474A; transition: color .2s, transform .2s var(--ease); }
.v2-mega__links a:hover, .v2-mega__links a[aria-current] { color: var(--teal); transform: translateX(3px); }
.v2-mega__promo { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: flex-end; min-height: 100%; border-radius: 16px; background: var(--ink-2); color: #fff; }
.v2-mega__promo > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; opacity: .55; }
.v2-mega__promo::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(30,79,88,.55) 0%, rgba(8,18,20,.95) 72%); }
.v2-mega__promo-in { padding: 24px 22px 22px; display: grid; gap: 14px; }
.v2-mega__promo-title { font: 600 23px/1.12 var(--f-head); letter-spacing: -.02em; }
.v2-mega__promo-title em { font-family: var(--f-serif); font-style: italic; font-weight: 400; color: var(--mint); }
.v2-mega__promo ul { display: grid; gap: 6px; font-size: 14px; color: var(--on-dark); }
.v2-mega__promo li { display: flex; align-items: center; gap: 8px; }
.v2-mega__promo li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #6EE7C8; }
.v2-mega__all { text-align: center; font-size: 14px; color: var(--mint-2); text-decoration: underline; text-underline-offset: 3px; }
.v2-nav__link.is-current { color: #fff; background: rgba(255,255,255,.12); }
.v2-head.is-solid .v2-nav__link.is-current { color: var(--teal); background: #fff; }
@media (max-width: 1200px) and (min-width: 961px) { .v2-mega__grid { grid-template-columns: 1fr 1fr 1fr; } .v2-mega__promo { display: none; } }

.v2-head__actions { display: flex; align-items: center; gap: 14px; flex: none; }
.v2-head__phone { display: inline-flex; align-items: center; gap: 8px; color: rgba(255,255,255,.88); font-size: 14px; font-weight: 500; }
.v2-head__phone:hover { color: #fff; }
.v2-burger { display: none; width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18); position: relative; }
.v2-burger span { position: absolute; left: 14px; right: 14px; height: 2px; border-radius: 2px; background: #fff; transition: transform .3s var(--ease), top .3s var(--ease); }
.v2-burger span:first-child { top: 18px; }
.v2-burger span:last-child { top: 26px; }
.v2-burger[aria-expanded="true"] span:first-child { top: 22px; transform: rotate(45deg); }
.v2-burger[aria-expanded="true"] span:last-child { top: 22px; transform: rotate(-45deg); }

/* scrolled / light state */
.v2-head.is-solid, body.v2:not(.v2--dark-hero) .v2-head {
  background: rgba(255,255,255,.92); backdrop-filter: blur(14px) saturate(1.4); -webkit-backdrop-filter: blur(14px) saturate(1.4);
  box-shadow: 0 1px 0 var(--line), 0 10px 30px -20px rgba(14,28,30,.3); padding: 10px 0;
}
.v2-head.is-solid .v2-logo--light, body.v2:not(.v2--dark-hero) .v2-logo--light { opacity: 0; }
.v2-head.is-solid .v2-logo--dark, body.v2:not(.v2--dark-hero) .v2-logo--dark { opacity: 1; }
.v2-head.is-solid .v2-nav__list { background: var(--cream); border-color: var(--line); }
.v2-head.is-solid .v2-nav__link, .v2-head.is-solid .v2-head__phone { color: var(--ink); }
.v2-head.is-solid .v2-nav__link:hover, .v2-head.is-solid .v2-nav__item--drop.is-open .v2-nav__link { background: #fff; color: var(--teal); }
.v2-head.is-solid .v2-burger { background: var(--cream); border-color: var(--line); }
.v2-head.is-solid .v2-burger span { background: var(--ink); }
.v2-head.is-hidden { transform: translateY(-110%); }

@media (max-width: 1080px) { .v2-head__phone span { display: none; } }
.v2-nav__link { white-space: nowrap; }
@media (max-width: 1140px) and (min-width: 961px) { .v2-nav__link { padding-left: 11px; padding-right: 11px; } .v2-nav__list { gap: 0; } }
@media (max-width: 960px) {
  .v2-burger { display: block; }
  .v2-head__phone { display: none; }
  .v2-head__bar { justify-content: space-between; }
  .v2-nav {
    position: fixed; inset: 0; z-index: -1; flex-direction: column; justify-content: flex-start; gap: 24px;
    padding: 96px var(--gut) 32px; background: var(--night); overflow-y: auto;
    opacity: 0; visibility: hidden; transition: opacity .3s var(--ease), visibility .3s;
  }
  .v2-nav.is-open { opacity: 1; visibility: visible; }
  .v2-nav__list { flex-direction: column; align-items: stretch; gap: 0; padding: 0; background: none; border: 0; border-radius: 0; backdrop-filter: none; }
  .v2-nav__link { width: 100%; justify-content: space-between; padding: 16px 4px; border-radius: 0; font: 600 24px/1.2 var(--f-head); color: #fff !important; border-bottom: 1px solid var(--line-dk); background: none !important; }
  .v2-mega { position: static; width: auto; translate: none !important; opacity: 1; visibility: visible; pointer-events: auto; display: none; margin: 8px 0 12px; padding: 0; background: none; box-shadow: none; }
  .v2-nav__item--drop.is-open .v2-mega { display: block; }
  .v2-mega::before { display: none; }
  .v2-mega__grid { grid-template-columns: 1fr; gap: 10px; }
  .v2-mega__col { background: rgba(255,255,255,.04); border: 1px solid var(--line-dk); padding: 16px; gap: 16px; }
  .v2-mega__head { color: #fff; font-size: 16px; }
  .v2-mega__ic { width: 36px; height: 36px; }
  .v2-mega__links { padding-left: 48px !important; margin-top: 6px !important; }
  .v2-mega__links a { color: var(--on-dark-2); font-size: 15px; padding: 7px 0; }
  .v2-mega__links a:hover, .v2-mega__links a[aria-current] { color: var(--mint); }
  .v2-mega__promo { display: none; }
  .v2-nav__mobile-cta { display: grid; gap: 14px; margin-top: auto; }
  .v2-nav__phone { display: inline-flex; justify-content: center; align-items: center; gap: 8px; color: var(--mint); font-weight: 500; }
  /* the overlay is always dark, so these beat the .is-solid (scrolled) styles */
  .v2-head .v2-nav .v2-nav__list { background: none; border: 0; }
  body.nav-open { overflow: hidden; }
  body.nav-open .v2-head { background: transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
  body.nav-open .v2-head .v2-logo--light { opacity: 1; }
  body.nav-open .v2-head .v2-logo--dark { opacity: 0; }
  body.nav-open .v2-head .v2-burger { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.18); }
  body.nav-open .v2-head .v2-burger span { background: #fff; }
}
@media (max-width: 480px) { .v2-head__cta { display: none; } }

/* ==========================================================================
   HERO
   ========================================================================== */
.h2-hero {
  position: relative; isolation: isolate; overflow: hidden; background: var(--night); color: #fff;
  min-height: min(100svh, 940px); display: flex; align-items: flex-end;
  padding: 140px 0 clamp(48px, 7vw, 88px);
}
.h2-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 68% center; z-index: -3; }
.h2-hero__shade {
  position: absolute; inset: 0; z-index: -2;
  background:
    linear-gradient(90deg, rgba(8,18,20,.94) 0%, rgba(8,18,20,.78) 38%, rgba(8,18,20,.25) 70%, rgba(8,18,20,.35) 100%),
    linear-gradient(0deg, rgba(8,18,20,.9) 0%, rgba(8,18,20,0) 40%);
}
.h2-hero__gl { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; opacity: 0; transition: opacity 1.6s var(--ease); }
.h2-hero__gl.is-on { opacity: 1; }
.h2-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; align-items: end; }
.h2-hero__copy { max-width: 720px; }
.h2-hero__title {
  margin: 22px 0 20px; font: 600 clamp(40px, 6.4vw, 84px)/1 var(--f-head); letter-spacing: -.035em; text-wrap: balance;
}
.h2-hero__title em { color: var(--mint); }
.h2-hero__lead { font-size: clamp(17px, 1.5vw, 20px); color: var(--on-dark-2); max-width: 54ch; }
.h2-hero__checks { display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 26px 0 34px; color: var(--on-dark); font-size: 15px; }
.h2-hero__checks li { display: inline-flex; align-items: center; gap: 8px; }
.h2-hero__checks .v2-ic { color: #6EE7C8; }
.h2-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }

.h2-hero__card {
  padding: 22px; border-radius: var(--r); background: rgba(14, 28, 30, .5); border: 1px solid rgba(159, 210, 217, .2);
  backdrop-filter: blur(18px) saturate(1.3); -webkit-backdrop-filter: blur(18px) saturate(1.3);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), var(--shadow-lg);
}
.h2-hero__rating { display: flex; flex-direction: column; gap: 8px; padding-bottom: 18px; border-bottom: 1px solid var(--line-dk); font-size: 14px; color: var(--on-dark-2); }
.h2-stars { display: inline-flex; gap: 2px; color: #F5C34B; }
.h2-hero__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding-top: 18px; }
.h2-hero__stats div { display: flex; flex-direction: column-reverse; gap: 4px; }
.h2-hero__stats dd { font: 600 30px/1 var(--f-head); color: #fff; letter-spacing: -.02em; }
.h2-hero__stats dt { font-size: 12px; color: var(--on-dark-2); line-height: 1.3; }

@media (max-width: 960px) {
  .h2-hero__inner { grid-template-columns: 1fr; gap: 32px; }
  .h2-hero__card { max-width: 420px; }
  .h2-hero__bg { object-position: 75% center; }
  .h2-hero__shade { background: linear-gradient(0deg, rgba(8,18,20,.96) 0%, rgba(8,18,20,.72) 60%, rgba(8,18,20,.5) 100%); }
}
@media (max-width: 520px) {
  .h2-hero { padding-top: 116px; }
  .h2-hero__actions .v2-btn { width: 100%; }
  .h2-hero__checks { flex-direction: column; }
}

/* ==========================================================================
   TRUST STRIP
   ========================================================================== */
.h2-trust { background: #fff; border-bottom: 1px solid var(--line); }
.h2-trust__inner { display: flex; align-items: center; gap: 28px; padding-block: 22px; }
.h2-trust__reviews { display: flex; gap: 8px; flex: none; }
.h2-trust__reviews a { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line); font-size: 14px; font-weight: 500; transition: border-color .2s, background-color .2s; }
.h2-trust__reviews a:hover { border-color: var(--aqua); background: var(--cream); }
.h2-trust__label { flex: none; font-size: 13px; color: var(--muted); padding-left: 28px; border-left: 1px solid var(--line); }
.h2-trust__marquee { flex: 1; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.h2-trust__track { display: flex; gap: 44px; width: max-content; animation: v2-marquee 36s linear infinite; }
.h2-trust__logo { display: inline-flex; align-items: center; gap: 10px; font: 600 16px/1 var(--f-head); color: #3B4B4C; opacity: .8; }
.h2-trust__logo img { filter: grayscale(1); }
@keyframes v2-marquee { to { transform: translateX(-50%); } }
@media (max-width: 960px) {
  .h2-trust__inner { flex-wrap: wrap; justify-content: center; gap: 16px; }
  .h2-trust__label { border: 0; padding: 0; width: 100%; text-align: center; }
  .h2-trust__marquee { flex-basis: 100%; }
}
@media (max-width: 420px) { .h2-trust__reviews a { padding: 7px 10px; font-size: 13px; } }

/* ==========================================================================
   SECTIONS
   ========================================================================== */
.v2-sec { padding-block: clamp(72px, 9vw, 128px); }
.v2-sec--tight { padding-block: clamp(32px, 4vw, 56px); }
.v2-sec--sand { background: var(--sand); }
.v2-sec--ink { background: var(--ink-2); color: #fff; position: relative; overflow: hidden; }
.v2-sec--ink::before { content: ""; position: absolute; width: 700px; height: 700px; right: -200px; top: -300px; border-radius: 50%; background: radial-gradient(circle, rgba(88,154,162,.22), transparent 65%); pointer-events: none; }
.v2-sec--tight + .v2-sec--tight { padding-top: 0; }

.v2-split-head { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: end; margin-bottom: 56px; }
.v2-split-head .v2-lead { margin-bottom: 24px; }
.v2-center-head { text-align: center; max-width: 720px; margin: 0 auto 56px; }
.v2-center-head .v2-lead { margin: 18px auto 0; }
@media (max-width: 860px) { .v2-split-head { grid-template-columns: 1fr; gap: 20px; } }

/* ----- Why us ----- */
.h2-why { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.h2-why__card {
  padding: 32px; border-radius: var(--r); background: #fff; border: 1px solid var(--line);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s;
}
.h2-why__card:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: #D3E6E8; }
.h2-why__ic { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; margin-bottom: 40px; background: var(--ink); color: var(--mint); }
.h2-why__card h3 { font: 600 21px/1.25 var(--f-head); margin-bottom: 10px; letter-spacing: -.01em; }
.h2-why__card p { color: var(--muted); font-size: 15px; }
@media (max-width: 860px) { .h2-why { grid-template-columns: 1fr; } .h2-why__ic { margin-bottom: 22px; } }

/* ----- Services ----- */
.h2-svc { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.h2-svc__card {
  position: relative; display: flex; flex-direction: column; padding: 30px; border-radius: var(--r);
  background: #fff; border: 1px solid var(--line); overflow: hidden;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s;
}
.h2-svc__card::after {
  content: ""; position: absolute; inset: auto 0 0; height: 3px; background: linear-gradient(90deg, var(--teal), var(--mint));
  transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease);
}
.h2-svc__card:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: #D3E6E8; }
.h2-svc__card:hover::after { transform: scaleX(1); }
.h2-svc__top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 28px; }
.h2-svc__ic { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; background: linear-gradient(140deg, var(--mint-2), #F4FAFB); border: 1px solid #D7ECEF; color: var(--teal); transition: background .35s, color .35s; }
.h2-svc__card:hover .h2-svc__ic { background: var(--ink); color: var(--mint); border-color: var(--ink); }
.h2-svc__goal { font-size: 12px; font-weight: 600; letter-spacing: .04em; color: var(--teal-2); background: var(--cream); border: 1px solid var(--line); padding: 5px 10px; border-radius: 999px; }
.h2-svc__title { font: 600 23px/1.2 var(--f-head); letter-spacing: -.015em; margin-bottom: 10px; }
.h2-svc__text { font-size: 15px; color: var(--muted); margin-bottom: 20px; }
.h2-svc__list { display: grid; gap: 8px; margin-bottom: 26px; font-size: 14px; }
.h2-svc__list li { display: flex; align-items: center; gap: 8px; }
.h2-svc__list .v2-ic { color: var(--teal); }
.h2-svc__more { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 15px; color: var(--teal); }
.h2-svc__more .v2-ic { transition: transform .3s var(--ease); }
.h2-svc__card:hover .h2-svc__more .v2-ic { transform: translate(2px, -2px); }
.h2-svc__help {
  display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 32px;
  padding: 22px 22px 22px 30px; border-radius: var(--r); background: var(--ink); color: var(--on-dark-2);
}
.h2-svc__help strong { color: #fff; }
@media (max-width: 1000px) { .h2-svc { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) {
  .h2-svc { grid-template-columns: 1fr; }
  .h2-svc__card { padding: 24px; }
  .h2-svc__help { flex-direction: column; align-items: stretch; text-align: center; padding: 24px; }
}

/* ----- Featured case ----- */
.h2-case {
  display: grid; grid-template-columns: 1fr 1.05fr; border-radius: var(--r-lg); overflow: hidden;
  background: radial-gradient(120% 120% at 100% 0%, #1E4F58 0%, var(--ink-2) 55%, var(--night) 100%); color: #fff;
  box-shadow: var(--shadow-lg);
}
.h2-case__media { position: relative; overflow: hidden; min-height: 340px; }
.h2-case__media img { position: absolute; inset: -8% 0; width: 100%; height: 116%; object-fit: cover; }
.h2-case__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 60%, rgba(14,28,30,.6)); }
.h2-case__body { padding: clamp(32px, 5vw, 64px); }
.h2-case__title { font: 600 clamp(26px, 3vw, 38px)/1.12 var(--f-head); letter-spacing: -.02em; margin-bottom: 16px; text-wrap: balance; }
.h2-case__text { color: var(--on-dark-2); max-width: 50ch; }
.h2-case__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 32px 0; padding: 24px 0; border-block: 1px solid var(--line-dk); }
.h2-case__stats div { display: flex; flex-direction: column; gap: 6px; }
.h2-case__stats dd { font: 600 clamp(32px, 3.6vw, 46px)/1 var(--f-head); color: var(--mint); letter-spacing: -.03em; }
.h2-case__stats dt { font-size: 13px; color: var(--on-dark-2); line-height: 1.35; }
@media (max-width: 860px) { .h2-case { grid-template-columns: 1fr; } .h2-case__media { min-height: 240px; } .h2-case__media::after { background: linear-gradient(0deg, rgba(14,28,30,.5), transparent 50%); } }
@media (max-width: 420px) { .h2-case__stats { grid-template-columns: 1fr; } }

/* ----- Team ----- */
.h2-team { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 88px); align-items: center; }
.h2-team__media { position: relative; }
.h2-team__img { width: 100%; height: auto; aspect-ratio: 5 / 4; object-fit: cover; border-radius: var(--r-lg); }
.h2-team__badge {
  position: absolute; left: 24px; bottom: 24px; display: flex; flex-direction: column; gap: 6px; padding: 16px 20px; border-radius: 14px;
  background: rgba(255,255,255,.9); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: var(--shadow); font-size: 14px;
}
.h2-team__body .v2-lead { margin: 20px 0 32px; }
.h2-team__stats { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 32px; }
.h2-team__stats div { padding: 22px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); display: flex; flex-direction: column; gap: 6px; }
.h2-team__stats strong { font: 600 40px/1 var(--f-head); letter-spacing: -.03em; color: var(--ink); }
.h2-team__stats span:not([data-count]) { font-size: 14px; color: var(--muted); }
@media (max-width: 860px) { .h2-team { grid-template-columns: 1fr; } }

/* ----- Process ----- */
.h2-proc-wrap { position: relative; }
.h2-proc { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.h2-proc__line { position: absolute; left: 0; right: 0; top: 27px; height: 1px; background: var(--line-dk); }
.h2-proc__fill { display: block; height: 100%; width: 100%; background: linear-gradient(90deg, var(--aqua), var(--mint)); transform-origin: left; }
.h2-proc__step { position: relative; padding-right: 16px; }
.h2-proc__no {
  position: relative; display: grid; place-items: center; width: 56px; height: 56px; margin-bottom: 28px; border-radius: 50%;
  background: var(--ink-2); border: 1px solid rgba(159,210,217,.4); color: var(--mint); font: 600 17px/1 var(--f-head);
  box-shadow: 0 0 0 6px var(--ink-2);
}
.h2-proc__step h3 { font: 600 22px/1.25 var(--f-head); margin-bottom: 10px; }
.h2-proc__step p { color: var(--on-dark-2); font-size: 15px; }
@media (max-width: 860px) {
  .h2-proc { grid-template-columns: 1fr; gap: 36px; padding-left: 0; }
  .h2-proc__line { left: 27px; right: auto; top: 0; bottom: 0; width: 1px; height: auto; }
  .h2-proc__fill { transform-origin: top; }
  .h2-proc__step { display: grid; grid-template-columns: 56px 1fr; column-gap: 20px; }
  .h2-proc__no { grid-row: span 2; margin: 0; }
}

/* ----- Reviews ----- */
.h2-rev { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 48px; align-items: center; }
.h2-rev__head .v2-lead { margin: 18px 0 28px; }
.h2-rev__nav { display: flex; gap: 10px; }
.h2-rev__btn { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; border: 1px solid var(--line); background: #fff; transition: background-color .2s, color .2s, border-color .2s; }
.h2-rev__btn:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.h2-rev__track {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(300px, 380px); gap: 20px;
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: 6px 4px 18px; scrollbar-width: none;
  -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent);
}
.h2-rev__track::-webkit-scrollbar { display: none; }
.h2-rev__card { scroll-snap-align: start; display: flex; flex-direction: column; gap: 18px; padding: 28px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); }
.h2-rev__card blockquote { font-size: 16px; line-height: 1.65; flex: 1; }
.h2-rev__card figcaption { display: flex; align-items: center; gap: 12px; padding-top: 18px; border-top: 1px solid var(--line); }
.h2-rev__card strong { display: block; font-size: 15px; }
.h2-rev__card small { display: block; font-size: 13px; color: var(--muted); }
.h2-rev__avatar { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg, var(--teal), var(--ink)); color: #fff; font-weight: 600; font-size: 14px; }
@media (max-width: 960px) { .h2-rev { grid-template-columns: 1fr; } .h2-rev__track { grid-auto-columns: minmax(270px, 82%); -webkit-mask-image: none; mask-image: none; } }

/* ----- Insights ----- */
.h2-ins { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.h2-ins__card { display: flex; flex-direction: column; border-radius: var(--r); overflow: hidden; background: #fff; border: 1px solid var(--line); transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.h2-ins__card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.h2-ins__media { overflow: hidden; aspect-ratio: 16 / 9; }
.h2-ins__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.h2-ins__card:hover .h2-ins__media img { transform: scale(1.05); }
.h2-ins__body { display: flex; flex-direction: column; gap: 10px; padding: 24px; flex: 1; }
.h2-ins__meta { font-size: 13px; color: var(--teal); font-weight: 600; }
.h2-ins__body h3 { font: 600 19px/1.3 var(--f-head); letter-spacing: -.01em; }
.h2-ins__more { margin-top: auto; padding-top: 8px; display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; }
@media (max-width: 960px) { .h2-ins { grid-template-columns: 1fr 1fr; } .h2-ins__card:nth-child(3) { display: none; } }
@media (max-width: 640px) { .h2-ins { grid-template-columns: 1fr; } .h2-ins__card:nth-child(3) { display: flex; } }

/* ----- FAQ ----- */
.h2-faq { display: grid; grid-template-columns: 380px minmax(0, 1fr); gap: clamp(32px, 6vw, 80px); align-items: start; }
.h2-faq__side { position: sticky; top: 110px; }
.h2-faq__cta { margin-top: 32px; padding: 28px; border-radius: var(--r); background: var(--ink); color: var(--on-dark-2); }
.h2-faq__cta h3 { font: 600 21px/1.2 var(--f-head); color: #fff; margin-bottom: 8px; }
.h2-faq__cta p { font-size: 15px; margin-bottom: 20px; }
.h2-faq__list { display: grid; gap: 12px; }
.h2-faq__item { border-radius: var(--r); background: #fff; border: 1px solid var(--line); transition: border-color .25s, box-shadow .25s; }
.h2-faq__item.is-open { border-color: #CFE3E6; box-shadow: var(--shadow); }
.h2-faq__item h3 { font: inherit; }
.h2-faq__q { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 22px 24px; text-align: left; font: 600 17px/1.35 var(--f-head); }
.h2-faq__sign { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; flex: none; background: var(--cream); color: var(--teal); transition: transform .3s var(--ease), background-color .3s, color .3s; }
.h2-faq__item.is-open .h2-faq__sign { transform: rotate(45deg); background: var(--ink); color: #fff; }
.h2-faq__a { padding: 0 24px 22px; color: var(--muted); font-size: 15px; }
@media (max-width: 900px) { .h2-faq { grid-template-columns: 1fr; } .h2-faq__side { position: static; } }

/* ----- Audit form ----- */
.h2-audit { display: grid; grid-template-columns: 1fr 1.15fr; border-radius: var(--r-lg); overflow: hidden; background: var(--ink-2); box-shadow: var(--shadow-lg); }
.h2-audit__side { position: relative; isolation: isolate; color: #fff; display: flex; align-items: flex-end; min-height: 520px; }
.h2-audit__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.h2-audit__side::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(8,18,20,.35) 0%, rgba(8,18,20,.92) 70%); }
.h2-audit__side-in { padding: clamp(28px, 4vw, 48px); }
.h2-audit__title { font: 600 clamp(34px, 4vw, 52px)/1.04 var(--f-head); letter-spacing: -.03em; margin-bottom: 14px; }
.h2-audit__title em { color: var(--mint); }
.h2-audit__side p { color: var(--on-dark-2); max-width: 44ch; }
.h2-audit__points { display: grid; gap: 10px; margin: 24px 0; }
.h2-audit__points li { display: flex; align-items: center; gap: 10px; }
.h2-audit__points .v2-ic { color: #6EE7C8; }
.h2-audit__contact { display: flex; flex-wrap: wrap; gap: 10px 20px; padding-top: 22px; border-top: 1px solid var(--line-dk); font-size: 14px; }
.h2-audit__contact a { display: inline-flex; align-items: center; gap: 8px; color: var(--on-dark); }
.h2-audit__contact a:hover { color: var(--mint); }

.h2-form { background: #fff; margin: 10px; border-radius: calc(var(--r-lg) - 8px); padding: clamp(24px, 4vw, 44px); }
.h2-form__title { font: 600 26px/1.2 var(--f-head); letter-spacing: -.02em; margin-bottom: 24px; }
.h2-form__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.h2-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 22px; }
.h2-field { display: flex; flex-direction: column; gap: 6px; }
.h2-field--full { grid-column: 1 / -1; }
.h2-field label { font-size: 14px; font-weight: 500; }
.h2-field label span { color: var(--muted); font-weight: 400; }
.h2-field input, .h2-field select, .h2-field textarea {
  width: 100%; min-height: 50px; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--line); background: var(--cream);
  font-size: 16px; transition: border-color .2s, box-shadow .2s, background-color .2s;
}
.h2-field textarea { resize: vertical; min-height: 96px; }
.h2-field select { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E6E76' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 16px; padding-right: 40px; }
.h2-field input:focus, .h2-field select:focus, .h2-field textarea:focus { outline: none; border-color: var(--teal); background: #fff; box-shadow: 0 0 0 4px rgba(46,110,118,.14); }
.h2-field.is-invalid input, .h2-field.is-invalid select { border-color: #C2413A; }
.h2-field__err { font-size: 13px; color: #B3352E; }
.h2-form__note { margin-top: 14px; font-size: 13px; color: var(--muted); text-align: center; }
.h2-form__note a { text-decoration: underline; }
@media (max-width: 900px) { .h2-audit { grid-template-columns: 1fr; } .h2-audit__side { min-height: 440px; } }
@media (max-width: 520px) { .h2-form__grid { grid-template-columns: 1fr; } .h2-form { margin: 6px; } }

/* ---------- Audit popup (includes/v2/audit-modal.php) ---------- */
html.am-lock { overflow: hidden; }
.am { width: min(920px, calc(100vw - 24px)); max-width: none; max-height: calc(100dvh - 24px); margin: auto; padding: 0; border: 0; border-radius: var(--r-lg); background: transparent; color: var(--text); overflow: visible; }
.am::backdrop { background: rgba(8, 18, 20, .62); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.am[open] { animation: am-in .28s var(--ease); }
@keyframes am-in { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }
.am__box { position: relative; display: grid; grid-template-columns: 300px 1fr; max-height: calc(100dvh - 24px); overflow: hidden; border-radius: var(--r-lg); background: #fff; box-shadow: var(--shadow-lg); }
.am__x { position: absolute; top: 14px; right: 14px; z-index: 2; display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 50%; background: #fff; color: var(--ink); cursor: pointer; transition: background-color .2s, border-color .2s; }
.am__x:hover { background: var(--sand); }
.am__side { display: flex; flex-direction: column; gap: 18px; padding: 36px 28px; background: radial-gradient(circle at 20% 0%, rgba(88,154,162,.35), transparent 60%), var(--ink); color: var(--on-dark); }
.am__kicker { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--mint); }
.am__pitch { font: 600 26px/1.15 var(--f-head); letter-spacing: -.02em; color: #fff; }
.am__pitch em { font-style: normal; color: var(--mint); }
.am__points { display: grid; gap: 10px; font-size: 14px; }
.am__points li { display: flex; align-items: center; gap: 10px; color: var(--on-dark); }
.am__points .v2-ic { color: #6EE7C8; }
.am__call { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 18px; border-top: 1px solid var(--line-dk); font-size: 14px; color: var(--on-dark); }
.am__call:hover { color: var(--mint); }
.am__main { overflow-y: auto; padding: 36px clamp(20px, 4vw, 40px) 28px; }
.lf__title { font: 600 26px/1.2 var(--f-head); letter-spacing: -.02em; }
.am .lf__title { padding-right: 44px; }
.lf__lead { margin: 6px 0 20px; font-size: 14px; color: var(--muted); }
.lf__grid { gap: 14px; margin-bottom: 18px; }
.lf .h2-field input, .lf .h2-field select { padding-top: 11px; padding-bottom: 11px; }
.lf__err { margin-bottom: 14px; padding: 10px 14px; border-radius: var(--r-sm); background: #FBEAE8; color: #8F2A24; font-size: 14px; }
.lf [data-audit-submit].is-busy { opacity: .7; pointer-events: none; }
.lf__done { display: grid; justify-items: center; gap: 12px; padding: 40px 10px; text-align: center; }
.lf__done h2 { font: 600 24px/1.2 var(--f-head); letter-spacing: -.02em; }
.lf__done p { max-width: 40ch; color: var(--muted); }
.lf__done-ic { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; background: var(--mint-2); color: var(--teal-2); }
.lf__done-ic .v2-ic { width: 28px; height: 28px; }
.lf [hidden] { display: none !important; }
@media (max-width: 760px) {
  .am__box { grid-template-columns: 1fr; }
  .am__side { display: none; }
  .am__main { padding: 28px 18px 20px; }
}
@media (max-width: 520px) { .lf__grid { grid-template-columns: 1fr 1fr; } .lf__grid .h2-field:nth-child(n+3) { grid-column: 1 / -1; } }
@media (prefers-reduced-motion: reduce) { .am[open] { animation: none; } }

/* ----- Final CTA ----- */
.h2-final {
  position: relative; isolation: isolate; overflow: hidden; text-align: center; padding: clamp(56px, 8vw, 104px) var(--gut);
  border-radius: var(--r-lg); color: #fff;
  background: linear-gradient(135deg, var(--teal) 0%, var(--teal-2) 45%, var(--ink-2) 100%);
}
.h2-final__glow { position: absolute; z-index: -1; width: 640px; height: 640px; left: 50%; top: -50%; translate: -50% 0; border-radius: 50%; background: radial-gradient(circle, rgba(159,210,217,.35), transparent 65%); }
.h2-final::after { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 48px 48px; -webkit-mask-image: radial-gradient(circle at center, #000, transparent 70%); mask-image: radial-gradient(circle at center, #000, transparent 70%); }
.h2-final__title { font: 600 clamp(32px, 4.6vw, 58px)/1.05 var(--f-head); letter-spacing: -.03em; max-width: 16ch; margin: 0 auto 16px; text-wrap: balance; }
.h2-final__title em { color: var(--mint-2); }
.h2-final p { color: var(--mint-2); margin-bottom: 32px; font-size: 18px; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
/* Rows: CTA band / intro (brand + contact tiles) / link columns / legal bar. */
.v2-foot { position: relative; overflow: hidden; background: var(--night); color: var(--on-dark-2); padding-top: clamp(64px, 8vw, 104px); }

.v2-foot__intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr); gap: clamp(32px, 5vw, 88px); align-items: center; padding-bottom: clamp(48px, 5vw, 64px); margin-bottom: clamp(48px, 5vw, 64px); border-bottom: 1px solid var(--line-dk); }
.v2-foot__brand img { height: 50px; width: auto; }
.v2-foot__brand p { margin: 22px 0 26px; max-width: 44ch; font-size: 16px; line-height: 1.65; }
.v2-foot__social { display: flex; flex-wrap: wrap; gap: 10px; }
.v2-foot__social a { display: grid; place-items: center; min-width: 44px; height: 44px; padding: 0 10px; border-radius: 999px; border: 1px solid var(--line-dk); font-size: 12px; font-weight: 600; letter-spacing: .04em; color: var(--on-dark); transition: background-color .2s, border-color .2s, color .2s; }
.v2-foot__social a:hover { background: var(--mint); border-color: var(--mint); color: var(--ink); }
.v2-foot__social svg { width: 18px; height: 18px; flex: none; }

/* contact tiles: a 2x2 card with hairline dividers (gap shows the line colour) */
.v2-foot__reach ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--line-dk); border-radius: 22px; background: var(--line-dk); }
.v2-foot__reach li { display: flex; align-items: center; gap: 16px; min-width: 0; padding: 22px 24px; background: var(--night); }
.v2-foot__reach-ic { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 14px; background: rgba(159,210,217,.1); color: var(--mint); }
.v2-foot__reach li > span:last-child { display: grid; gap: 4px; min-width: 0; }
.v2-foot__reach small { font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: rgba(169,194,197,.75); }
.v2-foot__reach :is(a, strong) { font-size: 16px; font-weight: 500; line-height: 1.35; color: #fff; min-width: 0; overflow-wrap: break-word; }
.v2-foot__reach a:hover { color: var(--mint); }

/* link columns */
.v2-foot__nav { display: grid; grid-template-columns: 1.2fr .85fr 1.15fr 1.4fr; gap: 48px clamp(28px, 3.4vw, 56px); padding-bottom: clamp(56px, 6vw, 80px); }
.v2-foot__h { font: 600 17px/1.2 var(--f-head); color: #fff; letter-spacing: -.005em; margin-bottom: 22px; padding-bottom: 16px; border-bottom: 1px solid var(--line-dk); }
.v2-foot__col ul { display: grid; gap: 14px; font-size: 16px; line-height: 1.4; }
.v2-foot__col a { display: inline-block; transition: color .2s, transform .2s var(--ease); }
.v2-foot__col a:hover { color: var(--mint); transform: translateX(3px); }
.v2-foot__split { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(var(--rows, 5), auto); grid-auto-flow: column; column-gap: 28px; }
.v2-foot__col a.v2-foot__more { font-weight: 600; color: var(--mint); white-space: nowrap; }
.v2-foot__col a.v2-foot__more::after { content: " \2192"; }

.v2-foot__bottom { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 28px 0; border-top: 1px solid var(--line-dk); font-size: 14.5px; position: relative; z-index: 1; }
.v2-foot__bottom ul { display: flex; gap: 28px; }
.v2-foot__bottom a:hover { color: #fff; }
.v2-foot__mark {
  font: 700 clamp(64px, 15.5vw, 230px)/.78 var(--f-head); letter-spacing: -.05em; text-align: center; white-space: nowrap;
  color: transparent; -webkit-text-stroke: 1px rgba(159,210,217,.18);
  background: linear-gradient(180deg, rgba(159,210,217,.14), rgba(159,210,217,0) 85%); -webkit-background-clip: text; background-clip: text;
  margin-top: -6px; user-select: none; pointer-events: none;
}
@media (max-width: 1199px) {
  .v2-foot__intro { grid-template-columns: 1fr; }
  .v2-foot__brand { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; column-gap: 40px; }
  .v2-foot__brand img { flex-basis: 100%; max-width: max-content; }
  .v2-foot__brand p { margin-bottom: 0; }
  .v2-foot__nav { grid-template-columns: 1.15fr .8fr 1.15fr 1.5fr; }
}
@media (max-width: 1080px) { .v2-foot__nav { column-gap: 28px; } .v2-foot__split { column-gap: 20px; } }
@media (max-width: 960px) {
  .v2-foot__brand { display: block; }
  .v2-foot__brand p { margin-bottom: 24px; }
  .v2-foot__nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 44px 32px; }
}
@media (max-width: 640px) {
  .v2-foot__reach ul { grid-template-columns: 1fr; border-radius: 18px; }
  .v2-foot__reach li { padding: 18px; gap: 14px; }
  .v2-foot__reach-ic { width: 40px; height: 40px; border-radius: 12px; }
  .v2-foot__nav { gap: 40px 20px; }
  .v2-foot__col--svc, .v2-foot__col--loc { grid-column: 1 / -1; }
  .v2-foot__col ul { font-size: 15.5px; gap: 13px; }
  .v2-foot__split { column-gap: 20px; }
  .v2-foot__bottom { flex-direction: column; }
}
@media (max-width: 400px) { .v2-foot__reach li { padding: 16px 14px; gap: 12px; } .v2-foot__reach :is(a, strong) { font-size: 15px; } }

/* ----- Chat launcher ----- */
.v2-chat {
  position: fixed; right: 20px; bottom: 20px; z-index: 90; display: inline-flex; align-items: center; gap: 8px;
  min-height: 50px; padding: 12px 20px; border-radius: 999px; color: #fff; font-weight: 600; font-size: 14px;
  background: linear-gradient(135deg, var(--teal), var(--ink)); box-shadow: 0 16px 34px -14px rgba(8,18,20,.7);
  transition: transform .25s var(--ease), opacity .25s;
}
.v2-chat:hover { transform: translateY(-2px); }
.v2-chat.is-hidden { opacity: 0; pointer-events: none; }
@media (max-width: 520px) { .v2-chat span { display: none; } .v2-chat { padding: 0; width: 54px; justify-content: center; } }

/* ==========================================================================
   MOTION
   GSAP sets the start state only when it is running (html.v2-anim), so the
   page is fully readable with JS off, GSAP blocked, or reduced motion.
   ========================================================================== */
html.v2-anim [data-reveal], html.v2-anim [data-hero] { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .h2-trust__track, .v2-pill__dot { animation: none; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}

/* ----- Footer CTA strip ----- */
.v2-foot__cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding-bottom: 48px; margin-bottom: 56px; border-bottom: 1px solid var(--line-dk); }
.v2-foot__cta-title { font: 600 clamp(30px, 4vw, 52px)/1.05 var(--f-head); letter-spacing: -.03em; color: #fff; }
.v2-foot__cta-title em { font-family: var(--f-serif); font-style: italic; font-weight: 400; color: var(--mint); }
.v2-foot__cta-actions { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 520px) { .v2-foot__cta-actions, .v2-foot__cta-actions .v2-btn { width: 100%; } }


/* ==========================================================================
   SERVICE PAGES (includes/service-template.php)
   ========================================================================== */
.sv-hero { position: relative; isolation: isolate; overflow: hidden; background: var(--night); color: #fff; padding: 150px 0 clamp(56px, 7vw, 96px); }
.sv-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.sv-hero__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(8,18,20,.96) 0%, rgba(8,18,20,.86) 45%, rgba(14,40,44,.62) 100%), radial-gradient(60% 80% at 90% 10%, rgba(88,154,162,.35), transparent 60%); }
.sv-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; align-items: end; }
.sv-hero__copy { max-width: 760px; }
.sv-hero__title { margin: 18px 0 18px; font: 600 clamp(36px, 5.4vw, 70px)/1.02 var(--f-head); letter-spacing: -.035em; text-wrap: balance; }
.sv-hero__lead { font-size: clamp(17px, 1.4vw, 19px); color: var(--on-dark-2); max-width: 58ch; margin-bottom: 30px; }
.sv-hero__trust { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 26px; font-size: 14px; color: var(--on-dark-2); }
.sv-hero__card-title { font: 600 18px/1.2 var(--f-head); margin-bottom: 14px; }
.sv-hero__inc { display: grid; gap: 10px; margin-bottom: 20px; font-size: 14.5px; color: var(--on-dark); }
.sv-hero__inc li { display: flex; gap: 10px; align-items: flex-start; }
.sv-hero__inc .v2-ic { color: #6EE7C8; margin-top: 2px; }
.sv-crumbs ol { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 18px; font-size: 13px; color: var(--on-dark-2); }
.sv-crumbs li { display: inline-flex; align-items: center; gap: 6px; }
.sv-crumbs li + li::before { content: "/"; opacity: .5; }
.sv-crumbs a:hover { color: #fff; }
.sv-crumbs [aria-current] { color: var(--mint); }
@media (max-width: 960px) { .sv-hero__inner { grid-template-columns: 1fr; } .sv-hero__card { max-width: 440px; } }
@media (max-width: 520px) { .sv-hero { padding-top: 116px; } .sv-hero .h2-hero__actions .v2-btn { width: 100%; } }

.sv-ov { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(32px, 6vw, 96px); align-items: start; }
.sv-ov__head { position: sticky; top: 110px; }
.sv-ov__body { display: grid; gap: 20px; font-size: 17px; color: #36494B; }
.sv-ov__body .v2-btn { justify-self: start; margin-top: 8px; }
@media (max-width: 860px) { .sv-ov { grid-template-columns: 1fr; } .sv-ov__head { position: static; } }

.sv-feat { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.sv-feat__card { position: relative; padding: 30px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.sv-feat__card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.sv-feat__card .h2-svc__ic { margin-bottom: 22px; }
.sv-feat__card h3 { font: 600 20px/1.25 var(--f-head); margin-bottom: 8px; }
.sv-feat__card p { color: var(--muted); font-size: 15px; }
.sv-feat__no { position: absolute; top: 26px; right: 28px; font: 600 14px/1 var(--f-head); color: #B9C9CB; }
.h2-svc__ic svg { width: 24px; height: 24px; }
@media (max-width: 1000px) { .sv-feat { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .sv-feat { grid-template-columns: 1fr; } }

.sv-ben { display: grid; grid-template-columns: .8fr 1.2fr; gap: 40px; align-items: center; padding: clamp(32px, 5vw, 60px); border-radius: var(--r-lg); color: #fff; background: radial-gradient(120% 140% at 0% 0%, #1E4F58 0%, var(--ink-2) 55%, var(--night) 100%); box-shadow: var(--shadow-lg); }
.sv-ben__title { font: 600 clamp(28px, 3.4vw, 44px)/1.08 var(--f-head); letter-spacing: -.03em; }
.sv-ben__title em { font-family: var(--f-serif); font-style: italic; font-weight: 400; color: var(--mint); }
.sv-ben__list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sv-ben__list div { padding: 20px; border-radius: 14px; background: rgba(255,255,255,.05); border: 1px solid var(--line-dk); }
.sv-ben__list dt { display: flex; gap: 8px; align-items: center; font: 600 16px/1.3 var(--f-head); margin-bottom: 8px; }
.sv-ben__list dt .v2-ic { color: #6EE7C8; }
.sv-ben__list dd { font-size: 14px; color: var(--on-dark-2); }
@media (max-width: 960px) { .sv-ben { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .sv-ben__list { grid-template-columns: 1fr; } }

.h2-proc.sv-proc--4 { grid-template-columns: repeat(4, 1fr); }
.h2-proc.sv-proc--5 { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 860px) { .h2-proc.sv-proc--4, .h2-proc.sv-proc--5 { grid-template-columns: 1fr; } }

.sv-rel { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.sv-rel__card { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 24px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); transition: border-color .25s, transform .25s var(--ease); }
.sv-rel__card:hover { border-color: var(--aqua); transform: translateY(-3px); }
.sv-rel__card strong { display: block; font: 600 17px/1.3 var(--f-head); }
.sv-rel__card small { display: block; font-size: 14px; color: var(--muted); margin-top: 2px; }
.sv-rel__card .v2-ic { color: var(--teal); }
@media (max-width: 960px) { .sv-rel { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .sv-rel { grid-template-columns: 1fr; } }

/* ==========================================================================
   SOCIAL REEL WALL (Trifid-style: vertical reel tiles, two marquee rows)
   ========================================================================== */
.sv-social { padding-bottom: clamp(56px, 7vw, 96px); }
.sv-social__lead { color: var(--on-dark-2); margin-bottom: 22px; }
.v2-reels { display: grid; gap: 18px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.v2-reels__row { overflow: hidden; }
.v2-reels__track { display: flex; gap: 16px; width: max-content; animation: v2-marquee 60s linear infinite; }
.v2-reels__row--rev .v2-reels__track { animation-direction: reverse; animation-duration: 70s; }
.v2-reels__dup { display: flex; gap: 16px; }
.v2-reels:hover .v2-reels__track, .v2-reels:focus-within .v2-reels__track { animation-play-state: paused; }
.v2-reel {
  position: relative; flex: none; display: flex; flex-direction: column; justify-content: flex-start; gap: 10px;
  width: 190px; aspect-ratio: 9 / 16; padding: 14px; border-radius: 20px; color: #fff; overflow: hidden; isolation: isolate;
  box-shadow: 0 18px 40px -22px rgba(0,0,0,.7); transition: transform .35s var(--ease);
}
.v2-reel::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0,0,0,.25) 0%, transparent 30%, transparent 60%, rgba(0,0,0,.45) 100%); }
.v2-reel:hover { transform: translateY(-6px) rotate(-1deg); color: #fff; }
.v2-reel--r0 { background: linear-gradient(160deg, #F58529 0%, #DD2A7B 55%, #8134AF 100%); }
.v2-reel--r1 { background: linear-gradient(160deg, #3A8590 0%, #1E4F58 60%, #0E1C1E 100%); }
.v2-reel--r2 { background: linear-gradient(160deg, #9FD2D9 0%, #589AA2 55%, #1F555C 100%); }
.v2-reel--r3 { background: linear-gradient(160deg, #833AB4 0%, #C13584 50%, #FD1D1D 100%); }
.v2-reel--r4 { background: linear-gradient(160deg, #15292B 0%, #2E6E76 70%, #6EE7C8 140%); }
.v2-reel--r5 { background: linear-gradient(160deg, #FCAF45 0%, #E1306C 60%, #5B51D8 120%); }
.v2-reel__top { display: flex; align-items: center; gap: 8px; min-width: 0; }
.v2-reel__av { display: grid; place-items: center; width: 30px; height: 30px; flex: none; border-radius: 50%; background: rgba(255,255,255,.22); border: 1.5px solid rgba(255,255,255,.7); font-size: 11px; font-weight: 700; }
.v2-reel__h { font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v2-reel__name { margin-top: auto; font: 600 22px/1.05 var(--f-head); letter-spacing: -.02em; text-wrap: balance; }
.v2-reel__play { position: absolute; left: 50%; top: 40%; translate: -50% -50%; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.2); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); opacity: .9; }
.v2-reel__foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.v2-reel__cat { font-size: 11px; font-weight: 600; letter-spacing: .04em; padding: 5px 9px; border-radius: 999px; background: rgba(0,0,0,.28); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 130px; }
@media (max-width: 640px) { .v2-reel { width: 150px; } .v2-reel__name { font-size: 18px; } }
@media (prefers-reduced-motion: reduce) { .v2-reels__track { animation: none; } .v2-reels__row { overflow-x: auto; } }

.h2-svc__help-actions { display: flex; flex-wrap: wrap; gap: 10px; }
@media (max-width: 640px) { .h2-svc__help-actions { flex-direction: column; } }

.sv-hero__title em { font-family: var(--f-serif); font-style: italic; font-weight: 400; color: var(--mint); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* ==========================================================================
   SERVICES HUB (services.php)
   ========================================================================== */
.sv-hero--hub { padding-bottom: clamp(48px, 6vw, 80px); }
.hub-jump { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.hub-jump a { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; font-size: 14px; color: var(--on-dark); background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); transition: background-color .2s, color .2s; }
.hub-jump a:hover { background: var(--mint); color: var(--ink); }
.hub { display: grid; gap: 20px; }
.hub__group { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 32px; padding: 32px; border-radius: var(--r-lg); background: #fff; border: 1px solid var(--line); scroll-margin-top: 100px; }
.hub__head { display: flex; gap: 16px; align-items: flex-start; }
.hub__head .v2-mega__ic { width: 52px; height: 52px; border-radius: 14px; }
.hub__title { font: 600 26px/1.15 var(--f-head); letter-spacing: -.02em; margin-bottom: 8px; }
.hub__title a:hover { color: var(--teal); }
.hub__head p { color: var(--muted); font-size: 15px; }
.hub__items { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-content: start; }
.hub__items a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; border-radius: 14px; background: var(--cream); border: 1px solid transparent; transition: border-color .2s, background-color .2s; }
.hub__items a:hover { border-color: var(--aqua); background: #fff; }
.hub__items strong { display: block; font: 600 16px/1.3 var(--f-head); }
.hub__items small { display: block; font-size: 13.5px; color: var(--muted); }
.hub__items .v2-ic { color: var(--teal); }
@media (max-width: 960px) { .hub__group { grid-template-columns: 1fr; gap: 20px; padding: 24px; } }
@media (max-width: 600px) { .hub__items { grid-template-columns: 1fr; } }

/* ==========================================================================
   PORTFOLIO (portfolio.php)
   ========================================================================== */
.pf-stats { grid-template-columns: 1fr 1fr; row-gap: 20px; padding-top: 0; }
.pf-social__title { font: 700 clamp(44px, 8vw, 120px)/.95 var(--f-head); letter-spacing: -.045em; color: #fff; max-width: 12ch; margin: 6px 0 48px; }
.pf-social__title em { font-family: var(--f-serif); font-style: italic; font-weight: 400; color: var(--mint); }
.pf-num { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 56px; }
.pf-num__card { padding: 26px; border-radius: var(--r); background: rgba(255,255,255,.05); border: 1px solid var(--line-dk); }
.pf-num__card span { font: 600 13px/1 var(--f-head); color: var(--aqua); }
.pf-num__card strong { display: block; margin: 18px 0 8px; font: 700 clamp(44px, 5vw, 64px)/1 var(--f-head); letter-spacing: -.04em; color: #fff; }
.pf-num__card p { color: var(--on-dark-2); font-size: 15px; }
@media (max-width: 760px) { .pf-num { grid-template-columns: 1fr; } }

.pf-search { display: flex; align-items: center; gap: 10px; margin-top: 18px; padding: 0 16px; min-height: 52px; border-radius: 999px; background: #fff; border: 1px solid var(--line); color: var(--muted); }
.pf-search:focus-within { border-color: var(--teal); box-shadow: 0 0 0 4px rgba(46,110,118,.14); }
.pf-search input { flex: 1; border: 0; outline: 0; background: none; font-size: 16px; color: var(--ink); min-width: 0; }
.pf-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.pf-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line); background: #fff; font-size: 14px; font-weight: 500; transition: background-color .2s, color .2s, border-color .2s; }
.pf-chip span { font-size: 12px; color: var(--muted); }
.pf-chip:hover { border-color: var(--aqua); }
.pf-chip.is-active { background: var(--ink); border-color: var(--ink); color: #fff; }
.pf-chip.is-active span { color: var(--mint); }
.pf-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.pf-card { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 16px; background: #fff; border: 1px solid var(--line); transition: transform .25s var(--ease), box-shadow .25s; }
.pf-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.pf-card[hidden] { display: none; }
.pf-card__av { display: grid; place-items: center; width: 46px; height: 46px; flex: none; border-radius: 14px; color: #fff; font-weight: 700; font-size: 14px; }
.pf-card__id { flex: 1; min-width: 0; }
.pf-card__id strong { display: block; font: 600 15px/1.25 var(--f-head); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pf-card__id small { display: block; font-size: 13px; color: var(--muted); }
.pf-card__links { display: flex; gap: 4px; }
.pf-card__links a { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; color: var(--teal); background: var(--cream); transition: background-color .2s, color .2s; }
.pf-card__links a:hover { background: var(--ink); color: #fff; }
.pf-empty { text-align: center; color: var(--muted); padding: 32px 0; }
@media (max-width: 1100px) { .pf-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 800px) { .pf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .pf-grid { grid-template-columns: minmax(0, 1fr); } }

.pf-cases { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.pf-case { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 24px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); }
.pf-case__top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.pf-case__top .sv-feat__no { position: static; }
.pf-case__logo { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 12px; background: var(--cream); }
.pf-case h3 { font: 600 20px/1.2 var(--f-head); }
.pf-case .h2-svc__goal { align-self: flex-start; }
.pf-case p { font-size: 14px; color: var(--muted); }
@media (max-width: 1200px) { .pf-cases { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 800px) { .pf-cases { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .pf-cases { grid-template-columns: 1fr; } }
.pf-logos { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.pf-logos li { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 76px; padding: 14px; border-radius: 16px; background: #fff; border: 1px solid var(--line); font: 600 15px/1.2 var(--f-head); color: #3B4B4C; }
@media (max-width: 960px) { .pf-logos { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 520px) { .pf-logos { grid-template-columns: 1fr 1fr; } }

/* ==========================================================================
   INNER PAGES (includes/v2/ui.php + about, founders, contact, industries,
   book services, legal, 404, search)
   ========================================================================== */
.v2-muted { color: var(--muted); font-size: 13px; }
.v2-left-head { max-width: 760px; margin-bottom: 48px; }
.v2-left-head .v2-lead { margin-top: 16px; }
.v2-lead--light { color: var(--on-dark-2); }
.v2-sec--ink .v2-center-head .v2-lead { color: var(--on-dark-2); }

/* hero sizes */
.pg-hero--lg { min-height: min(86svh, 820px); display: flex; align-items: flex-end; }
.pg-hero--sm { padding-bottom: clamp(44px, 5vw, 64px); }
.pg-hero--sm .sv-hero__title { font-size: clamp(34px, 4.6vw, 58px); }
.pg-hero--center .sv-hero__copy { margin-inline: auto; text-align: center; }
.pg-hero--center .sv-crumbs ol, .pg-hero--center .h2-hero__actions { justify-content: center; }
.h2-final__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }

/* grids */
.v2-grid { display: grid; gap: 20px; }
.v2-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.v2-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.v2-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.v2-grid .h2-why__card .h2-why__ic { margin-bottom: 28px; }
@media (max-width: 1000px) { .v2-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .v2-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) { .v2-grid--2, .v2-grid--3, .v2-grid--4 { grid-template-columns: 1fr; } }

/* stats band */
.v2-stats { display: grid; grid-template-columns: repeat(4, 1fr); border-radius: var(--r-lg); overflow: hidden; color: #fff;
  background: radial-gradient(120% 160% at 100% 0%, #1E4F58 0%, var(--ink-2) 55%, var(--night) 100%); box-shadow: var(--shadow-lg); }
.v2-stats div { display: flex; flex-direction: column; gap: 8px; padding: clamp(24px, 3vw, 40px); border-right: 1px solid var(--line-dk); }
.v2-stats div:last-child { border-right: 0; }
.v2-stats dd { font: 700 clamp(38px, 4.4vw, 60px)/1 var(--f-head); letter-spacing: -.04em; color: var(--mint); }
.v2-stats dt { font-size: 14px; color: var(--on-dark-2); }
@media (max-width: 860px) { .v2-stats { grid-template-columns: 1fr 1fr; } .v2-stats div:nth-child(2) { border-right: 0; } .v2-stats div:nth-child(-n+2) { border-bottom: 1px solid var(--line-dk); } }

/* image cards (regions etc.) */
.v2-imgcards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.v2-imgcard { position: relative; isolation: isolate; overflow: hidden; border-radius: var(--r); aspect-ratio: 4 / 5; color: #fff; }
.v2-imgcard img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .8s var(--ease); }
.v2-imgcard:hover img { transform: scale(1.05); }
.v2-imgcard::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(8,18,20,.1) 30%, rgba(8,18,20,.9) 100%); }
.v2-imgcard figcaption { position: absolute; inset: auto 0 0; display: grid; gap: 6px; padding: 22px; font-size: 14px; color: var(--on-dark); }
.v2-imgcard strong { font: 600 22px/1.15 var(--f-head); color: #fff; }
.v2-imgcard__tag { justify-self: start; font-size: 12px; font-weight: 600; letter-spacing: .04em; padding: 5px 10px; border-radius: 999px; color: var(--ink); background: var(--mint-2); }
.bk-svc__media .v2-imgcard__tag { position: absolute; left: 18px; top: 18px; }
@media (max-width: 1000px) { .v2-imgcards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .v2-imgcards { grid-template-columns: 1fr; } .v2-imgcard { aspect-ratio: 4 / 3; } }

/* statements + value pills */
.v2-statement { padding: clamp(28px, 4vw, 44px); border-radius: var(--r-lg); background: #fff; border: 1px solid var(--line); }
.v2-statement p { font: 500 clamp(19px, 1.8vw, 24px)/1.4 var(--f-head); letter-spacing: -.01em; color: var(--ink); }
.v2-statement__label { display: inline-block; margin-bottom: 18px; font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--teal); }
.v2-statement--dark { background: var(--ink); border-color: var(--ink); }
.v2-statement--dark p { color: #fff; }
.v2-statement--dark .v2-statement__label { color: var(--mint); }
.v2-pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 28px; }
.v2-pills li { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; background: #fff; border: 1px solid var(--line); font-size: 14px; font-weight: 500; }
.v2-pills .v2-ic { color: var(--teal); }

/* check list */
.v2-checks { display: grid; gap: 10px; margin: 22px 0; }
.v2-checks li { display: flex; gap: 10px; align-items: flex-start; font-size: 15.5px; color: #33474A; }
.v2-checks .v2-ic { color: var(--teal); margin-top: 3px; flex: none; }

/* founders */
.fd-list { display: grid; gap: 28px; }
.fd { display: grid; grid-template-columns: 420px minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; padding: clamp(20px, 3vw, 32px); border-radius: var(--r-lg); background: #fff; border: 1px solid var(--line); }
.fd--rev { grid-template-columns: minmax(0, 1fr) 420px; }
.fd--rev .fd__media { order: 2; }
.fd__media img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--r); }
.fd__name { font: 600 clamp(30px, 3.4vw, 44px)/1.05 var(--f-head); letter-spacing: -.03em; margin-bottom: 18px; }
.fd__bio { color: #36494B; font-size: 16.5px; margin-bottom: 26px; }
.fd .v2-btn svg { width: 18px; height: 18px; }
@media (max-width: 900px) { .fd, .fd--rev { grid-template-columns: 1fr; } .fd--rev .fd__media { order: 0; } .fd__media img { aspect-ratio: 4 / 3; } }

/* contact */
.ct__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(32px, 5vw, 72px); align-items: start; }
.ct__aside .v2-lead { margin: 16px 0 28px; }
.ct__methods { display: grid; gap: 12px; margin-bottom: 28px; }
.ct__methods li { display: flex; gap: 16px; align-items: flex-start; padding: 18px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); }
.ct__ic { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 12px; background: var(--ink); color: var(--mint); }
.ct__ic .v2-ic { width: 20px; height: 20px; }
.ct__label { font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--teal); margin-bottom: 4px !important; }
.ct__value { font: 500 16px/1.5 var(--f-body); font-style: normal; color: var(--ink); }
.ct__value span { color: var(--muted); font-size: 14px; }
.ct__value a:hover { color: var(--teal); }
.ct__aside .v2-btn svg { width: 18px; height: 18px; }
.ct__form { position: sticky; top: 100px; scroll-margin-top: 100px; }
.ct__card { margin: 0; border: 1px solid var(--line); box-shadow: var(--shadow); }
.v2-alert { padding: 14px 16px; border-radius: 12px; margin-bottom: 18px; font-size: 14.5px; }
.v2-alert--err { background: #FCEDEC; color: #8A2620; border: 1px solid #F3C9C5; }
.v2-alert a { text-decoration: underline; }
.ct__done { padding: clamp(32px, 5vw, 56px); border-radius: var(--r-lg); background: var(--ink); color: var(--on-dark-2); text-align: center; }
.ct__done h2 { font: 600 clamp(26px, 3vw, 36px)/1.15 var(--f-head); color: #fff; margin: 18px 0 12px; }
.ct__done p { margin-bottom: 24px; }
.ct__done-ic { display: inline-grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: #6EE7C8; color: var(--ink); }
@media (max-width: 960px) { .ct__grid { grid-template-columns: 1fr; } .ct__form { position: static; } }

/* industries */
.in-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.in-card { display: grid; grid-template-columns: 44% 1fr; border-radius: var(--r-lg); overflow: hidden; background: #fff; border: 1px solid var(--line); transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.in-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.in-card__media { position: relative; min-height: 240px; }
.in-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.in-card:hover .in-card__media img { transform: scale(1.05); }
.in-card__body { display: flex; flex-direction: column; gap: 12px; padding: 26px; }
.in-card__body strong { font: 600 24px/1.15 var(--f-head); }
.in-card__body > span:not([class]) { color: var(--muted); font-size: 15px; }
.in-card .h2-svc__more { margin-top: auto; }
@media (max-width: 1000px) { .in-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .in-card { grid-template-columns: 1fr; } .in-card__media { min-height: 200px; } }

/* book services */
.bk-jump { margin: 8px 0 0; }
.bk-jump .pf-chip span { font-weight: 700; color: var(--teal); }
.bk-svc { scroll-margin-top: 80px; }
.bk-svc__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 88px); align-items: center; }
.bk-svc--flip .bk-svc__media { order: 2; }
.bk-svc__media { position: relative; margin: 0; }
.bk-svc__media img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-lg); }
.bk-svc__body .v2-lead { margin-top: 16px; }
.bk-svc__best { display: flex; gap: 10px; align-items: flex-start; padding: 16px 18px; border-radius: 14px; background: var(--ink); color: var(--on-dark); font-size: 15px; }
.bk-svc__best .v2-ic { color: var(--mint); margin-top: 2px; flex: none; }
@media (max-width: 900px) { .bk-svc__grid { grid-template-columns: 1fr; } .bk-svc--flip .bk-svc__media { order: 0; } }

/* legal */
.lg { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
.lg__toc { position: sticky; top: 100px; padding: 22px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); }
.lg__toc-title { font: 600 15px/1 var(--f-head); margin-bottom: 14px !important; }
.lg__toc ol { display: grid; gap: 2px; }
.lg__toc a { display: flex; gap: 10px; padding: 7px 8px; border-radius: 8px; font-size: 14px; color: #36494B; }
.lg__toc a span { color: var(--teal); font-weight: 600; font-size: 12px; margin-top: 2px; }
.lg__toc a:hover { background: var(--cream); color: var(--teal); }
.lg__body { max-width: 760px; }
.lg__intro { font: 500 clamp(18px, 1.6vw, 21px)/1.5 var(--f-head); color: var(--ink); padding-bottom: 28px; margin-bottom: 8px !important; border-bottom: 1px solid var(--line); }
.lg__section { padding: 30px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 100px; }
.lg__section h2 { display: flex; gap: 14px; align-items: baseline; font: 600 24px/1.2 var(--f-head); letter-spacing: -.015em; margin-bottom: 14px; }
.lg__section h2 span { font-size: 14px; color: var(--teal); }
.lg__section p { color: #36494B; margin-bottom: 12px; }
.lg__contact { margin-top: 32px; padding: 28px; border-radius: var(--r); background: var(--ink); color: var(--on-dark-2); }
.lg__contact h2 { font: 600 22px/1.2 var(--f-head); color: #fff; margin-bottom: 8px; }
.lg__contact a { color: var(--mint); text-decoration: underline; }
@media (max-width: 900px) { .lg { grid-template-columns: 1fr; } .lg__toc { position: static; } }

/* 404 + search */
.pg-hero--404 { min-height: min(92svh, 860px); display: flex; align-items: center; text-align: center; }
.nf { display: flex; flex-direction: column; align-items: center; }
.nf .sv-hero__lead { margin-inline: auto; }
.nf__code { font: 800 clamp(120px, 22vw, 280px)/.8 var(--f-head); letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 1.5px rgba(159,210,217,.35); margin-bottom: 18px !important; }
.nf__search { display: flex; align-items: center; gap: 10px; width: min(560px, 100%); margin: 6px 0 24px; padding: 6px 6px 6px 18px; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); color: var(--on-dark-2); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.nf__search input { flex: 1; min-width: 0; background: none; border: 0; outline: 0; color: #fff; font-size: 16px; }
.nf__search input::placeholder { color: var(--on-dark-2); }
.nf__search:focus-within { border-color: var(--mint); }
.nf__actions { justify-content: center; }
.sr__form { margin-top: 8px; }
.sr { max-width: 980px; }
.sr__empty { margin-bottom: 40px; }
.sr__empty .v2-lead { margin: 12px 0 22px; }
.sr__empty .pf-chips { margin-top: 18px; }
.sr__group { margin-bottom: 36px; }
.sr__group-title { display: flex; align-items: center; gap: 10px; font: 600 14px/1 var(--f-body); letter-spacing: .1em; text-transform: uppercase; color: var(--teal); margin-bottom: 14px !important; }
.sr__group-title span { padding: 3px 8px; border-radius: 999px; background: var(--cream); color: var(--muted); font-size: 12px; letter-spacing: 0; }
.sr__list { display: grid; gap: 10px; }
.sr__hit small { max-width: 70ch; }
@media (max-width: 520px) { .nf__search .v2-btn { display: none; } }

/* ==========================================================================
   BLOG (blogs.php, category.php, post.php)
   ========================================================================== */
.bl-feat { display: grid; grid-template-columns: 1.15fr 1fr; border-radius: var(--r-lg); overflow: hidden; background: #fff; border: 1px solid var(--line); margin-bottom: 40px; transition: box-shadow .35s var(--ease), transform .35s var(--ease); }
.bl-feat:hover { box-shadow: var(--shadow); transform: translateY(-4px); }
.bl-feat__media { position: relative; min-height: 340px; overflow: hidden; }
.bl-feat__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.bl-feat:hover .bl-feat__media img { transform: scale(1.04); }
.bl-feat__body { display: flex; flex-direction: column; gap: 14px; padding: clamp(26px, 4vw, 48px); }
.bl-feat__pill { align-self: flex-start; background: var(--ink); border-color: var(--ink); color: var(--mint-2); }
.bl-feat__title { font: 600 clamp(26px, 2.8vw, 38px)/1.12 var(--f-head); letter-spacing: -.025em; color: var(--ink); }
.bl-feat__text { color: var(--muted); font-size: 16px; }
.bl-feat .h2-svc__more { margin-top: auto; }
@media (max-width: 860px) { .bl-feat { grid-template-columns: 1fr; } .bl-feat__media { min-height: 220px; } }
.bl-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }
.bl-bar .pf-chips { margin: 0; }
.bl-search { margin: 0; min-width: min(320px, 100%); }
.bl-excerpt { font-size: 14.5px; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.bl-grid .h2-ins__card[hidden] { display: none; }
@media (max-width: 960px) { .bl-grid.h2-ins .h2-ins__card:nth-child(3) { display: flex; } }

/* post */
.ps-preview { position: fixed; inset: auto 0 0; z-index: 120; padding: 10px 16px; text-align: center; font-size: 14px; background: #F5C34B; color: var(--ink); }
.ps-preview a { text-decoration: underline; font-weight: 600; }
.ps-hero { padding-bottom: clamp(48px, 6vw, 80px); }
.ps-hero__copy { max-width: 900px; }
.ps-hero__title { font-size: clamp(34px, 4.8vw, 62px); }
a.v2-pill:hover { background: rgba(159,210,217,.2); }
.ps-byline { display: flex; align-items: center; gap: 12px; margin-top: 6px; color: var(--on-dark); font-size: 15px; }
.ps-byline strong { display: block; color: #fff; }
.ps-byline__meta { display: block; font-size: 13.5px; color: var(--on-dark-2); }
.ps-byline__av { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #fff; overflow: hidden; flex: none; }
.ps-byline__av img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
.ps-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: clamp(32px, 5vw, 72px); align-items: start; }
.ps-main { max-width: 760px; }
.ps-aside { position: sticky; top: 100px; display: grid; gap: 16px; }
.ps-card { padding: 22px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); }
.ps-card__label { display: block; margin-bottom: 14px; font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--teal); }
.ps-card--cta { background: var(--ink); border-color: var(--ink); color: var(--on-dark-2); }
.ps-card--cta .ps-card__label { color: var(--mint); }
.ps-card--cta h4 { font: 600 21px/1.2 var(--f-head); color: #fff; margin: 0 0 8px; }
.ps-card--cta p { font-size: 14.5px; margin: 0 0 18px; }
.ps-share { display: flex; flex-wrap: wrap; gap: 8px; }
.post-share__btn { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; border: 1px solid var(--line); color: var(--ink); transition: background-color .2s, color .2s, border-color .2s, transform .2s var(--ease); }
.post-share__btn:hover { background: var(--ink); border-color: var(--ink); color: #fff; transform: translateY(-2px); }
.ps-like { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; padding: 9px 16px !important; border-radius: 999px; border: 1px solid #CFE3E6 !important; color: var(--teal); font-weight: 600; font-size: 14px; transition: background-color .2s; }
.ps-like:hover { background: var(--cream) !important; }
.ps-like[aria-pressed="true"] { background: var(--teal) !important; color: #fff; border-color: var(--teal) !important; }
.post-toc__list { display: grid; border-left: 1px solid var(--line); }
.post-toc__list a { display: block; padding: 7px 0 7px 14px; margin-left: -1px; border-left: 2px solid transparent; font-size: 14px; line-height: 1.4; color: var(--muted); transition: color .2s, border-color .2s; }
.post-toc__list a:hover { color: var(--ink); }
.post-toc__list a.is-active { color: var(--teal); border-left-color: var(--teal); font-weight: 600; }
@media (max-width: 1000px) { .ps-layout { grid-template-columns: minmax(0, 1fr); } .ps-aside { position: static; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); } .post-toc { display: none; } }

/* article typography (rich text from the admin editor) */
.v2-prose { font-size: 17.5px; line-height: 1.75; color: #283B3D; overflow-wrap: break-word; }
.v2-prose pre { overflow-x: auto; max-width: 100%; }
.v2-prose iframe, .v2-prose video { max-width: 100%; }
.v2-prose > *:first-child { margin-top: 0; }
.v2-prose h2 { font: 600 clamp(26px, 2.6vw, 34px)/1.15 var(--f-head); letter-spacing: -.02em; color: var(--ink); margin: 2.6rem 0 1rem; scroll-margin-top: 100px; }
.v2-prose h3 { font: 600 22px/1.25 var(--f-head); color: var(--ink); margin: 2rem 0 .7rem; }
.v2-prose h4 { font: 600 18px/1.3 var(--f-head); color: var(--ink); margin: 1.6rem 0 .5rem; }
.v2-prose p { margin: 0 0 1.25rem; }
.v2-prose a { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.v2-prose a:hover { color: var(--teal-2); }
.v2-prose ul, .v2-prose ol { margin: 0 0 1.4rem; padding-left: 1.3rem; list-style: revert; }
.v2-prose li { margin: 0 0 .55rem; }
.v2-prose li::marker { color: var(--teal); }
.v2-prose strong { color: var(--ink); font-weight: 650; }
.v2-prose img { display: block; max-width: 100%; height: auto; border-radius: var(--r); margin: 1.8rem 0; border: 1px solid var(--line); }
.v2-prose blockquote { margin: 2rem 0; padding: 24px 28px; border-radius: var(--r); background: var(--ink); color: var(--on-dark); font: 500 20px/1.5 var(--f-head); }
.v2-prose blockquote p:last-child { margin-bottom: 0; }
.v2-prose figure { margin: 1.8rem 0; }
.v2-prose figcaption { font-size: 14px; color: var(--muted); margin-top: .5rem; text-align: center; }
.v2-prose hr { border: 0; border-top: 1px solid var(--line); margin: 2.4rem 0; }
.v2-prose code { font-size: .9em; padding: 2px 6px; border-radius: 6px; background: var(--sand); }
.v2-prose table { width: 100%; border-collapse: collapse; font-size: 15.5px; margin: 1.8rem 0; }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 1.8rem 0; border: 1px solid var(--line); border-radius: 12px; }
.table-scroll table { margin: 0; min-width: 460px; }
.v2-prose th, .v2-prose td { padding: 12px 16px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.v2-prose thead th { background: var(--ink); color: #fff; font-family: var(--f-head); font-weight: 600; }
.v2-prose tbody tr:nth-child(even) { background: var(--cream); }
.ps-faq { margin-top: 48px; padding-top: 40px; border-top: 1px solid var(--line); }
.ps-faq__title { font-size: clamp(28px, 3vw, 38px); margin-bottom: 24px !important; }
.ps-author { display: flex; gap: 20px; align-items: flex-start; margin-top: 48px; padding: 28px; border-radius: var(--r-lg); background: var(--sand); }
.ps-author__av { width: 72px; height: 72px; flex: none; border-radius: 50%; overflow: hidden; background: #fff; }
.ps-author__av img { width: 100%; height: 100%; object-fit: cover; }
.ps-author__av--logo img { object-fit: contain; padding: 10px; }
.ps-author .v2-eyebrow { margin-bottom: 6px; }
.ps-author__name { font: 600 22px/1.2 var(--f-head); }
.ps-author__role { font-size: 14px; color: var(--teal); margin: 2px 0 8px !important; }
.ps-author__bio { color: #36494B; font-size: 15.5px; }

/* ==========================================================================
   FREE TOOLS (tools/*.php)
   Widget rules carried over from the v1 stylesheet (fields, meters, SERP
   preview, ROI grid, redirect hops, keyword rows...) followed by v2
   overrides. The v1 token names are aliased to v2 tokens here.
   ========================================================================== */
:root {
  --font-head: var(--f-head);
  --font-body: var(--f-body);
  --font-mono: "Space Mono", ui-monospace, monospace;
  --border: var(--line);
  --cream-2: var(--sand);
  --cyan: var(--mint);
  --ink-deep: var(--ink-2);
  --shadow-card: var(--shadow);
}
.chip-nav {display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px;}
.chip-nav__item {display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid var(--border); border-radius: 999px; background: var(--cream);
  padding: 10px 20px; font-size: 14px; font-weight: 500; color: var(--ink);
  transition: border-color .25s var(--ease), background-color .25s var(--ease), color .25s var(--ease), transform .25s var(--ease);}
.chip-nav__item:hover {border-color: var(--ink); color: var(--teal); transform: translateY(-2px);}
.chip-nav__item--accent {background: var(--ink); border-color: var(--ink); color: #fff;}
.chip-nav__item--accent:hover {background: var(--ink-deep); color: var(--cyan);}
.tool-card {display: flex; flex-direction: column; height: 100%;
  background: var(--cream); border: 1px solid var(--border); border-radius: 4px; padding: 32px;
  color: var(--ink);
  transition: transform .4s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease);}
.tool-card:hover {transform: translateY(-4px); border-color: var(--ink); box-shadow: var(--shadow-card); color: var(--ink);}
.tool-card__ico {display: block; height: 34px; margin-bottom: 14px;}
.tool-card__tag {font: 700 .66rem var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--teal);}
.tool-card__title {font-family: var(--font-head); font-weight: 700; font-size: 21px; letter-spacing: -.01em; margin: 8px 0 10px;}
.tool-card__text {font-size: 15px; line-height: 1.6; color: var(--muted); margin: 0 0 20px;}
.tool-card__cta {margin-top: auto; font-weight: 700; font-size: 14px; color: var(--teal);}
.tool-form {display: flex; gap: 12px; flex-wrap: wrap;}
.tool-form__input {flex: 1 1 260px; min-width: 0;
  border: 1px solid var(--border); border-radius: 3px; background: var(--cream);
  padding: 16px 18px; font: inherit; font-size: 17px; color: var(--ink);}
.tool-form__input:focus {outline: 2px solid var(--teal); outline-offset: 1px; border-color: var(--teal);}
.tool-form__btn {flex: 0 0 auto;}
.tool-form__hint {margin: 10px 0 0; font-size: 13px; color: var(--muted);}
.tool-out {margin-top: 30px;}
.tool-out__summary {font-family: var(--font-head); font-weight: 700; font-size: 19px; margin: 0 0 16px;}
.tool-out__note {margin: 16px 0 0; font-size: 13px; line-height: 1.6; color: var(--muted);}
.tool-out__error {margin: 0; padding: 16px 18px; border: 1px solid var(--border); border-left: 3px solid #B4472F; background: var(--cream); font-size: 15px;}
.tool-split {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: start;}
@media (max-width: 900px) {
  .tool-split { grid-template-columns: 1fr; }
}
.tool-panel {background: var(--cream); border: 1px solid var(--border); border-radius: 4px; padding: clamp(24px, 3vw, 36px);}
.tool-panel--result {background: var(--cream-2); position: sticky; top: 100px;}
@media (max-width: 900px) {
  .tool-panel--result { position: static; }
}
.tool-panel__title {font-family: var(--font-head); font-weight: 700; font-size: 20px; margin: 0 0 22px; padding-bottom: 14px; border-bottom: 1px solid var(--border);}
.tool-field {display: block; margin-bottom: 20px;}
.tool-field__label {display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 14px; font-weight: 600; margin-bottom: 7px;}
.tool-field__count {font-family: var(--font-mono); font-size: 11px; font-weight: 500; color: var(--muted);}
.tool-field__wrap {display: flex; align-items: stretch; border: 1px solid var(--border); border-radius: 3px; background: var(--cream); overflow: hidden;}
.tool-field__wrap:focus-within {border-color: var(--teal); box-shadow: 0 0 0 2px rgba(46, 110, 118, .18);}
.tool-field__wrap input,
.tool-field__wrap textarea,
.tool-field__wrap select {flex: 1; min-width: 0; border: 0; background: transparent; padding: 13px 14px; font: inherit; font-size: 16px; color: var(--ink);}
.tool-field__wrap textarea {resize: vertical; line-height: 1.5; font-size: 15px;}
.tool-field__wrap input:focus, .tool-field__wrap textarea:focus, .tool-field__wrap select:focus {outline: none;}
.tool-field__prefix, .tool-field__suffix {display: flex; align-items: center; padding: 0 13px; background: var(--cream-2); font-family: var(--font-mono); font-size: 14px; color: var(--muted);}
.tool-field__help {display: block; margin-top: 6px; font-size: 12.5px; line-height: 1.5; color: var(--muted);}
.tool-meter {display: block; height: 4px; margin-top: 8px; background: var(--border); border-radius: 999px; overflow: hidden;}
.tool-meter__fill {display: block; height: 100%; width: 0; background: var(--muted); transition: width .2s var(--ease), background-color .2s var(--ease);}
.tool-meter__fill.is-good {background: var(--teal);}
.tool-meter__fill.is-short {background: var(--cyan);}
.tool-meter__fill.is-over {background: #B4472F;}
.tool-toggle {display: inline-flex; border: 1px solid var(--border); border-radius: 3px; overflow: hidden;}
.tool-toggle__btn {background: var(--cream); border: 0; padding: 10px 20px; font: inherit; font-size: 14px; color: var(--muted); cursor: pointer;}
.tool-toggle__btn + .tool-toggle__btn {border-left: 1px solid var(--border);}
.tool-toggle__btn.is-active {background: var(--ink); color: #fff;}
.roi-headline {text-align: center; padding-bottom: 22px; margin-bottom: 22px; border-bottom: 1px solid var(--border);}
.roi-headline__num {font-family: var(--font-head); font-weight: 800; font-size: clamp(44px, 6vw, 64px); line-height: 1; letter-spacing: -.03em;}
.roi-headline__label {font: 700 .68rem var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-top: 8px;}
.roi-verdict {margin: 14px 0 0; font-size: 14.5px; line-height: 1.55; color: var(--muted);}
.tool-panel--result.is-good .roi-headline__num {color: var(--teal);}
.tool-panel--result.is-bad  .roi-headline__num {color: #B4472F;}
.roi-grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 0; background: var(--border); border: 1px solid var(--border);}
.roi-cell {background: var(--cream); padding: 15px 16px;}
.roi-cell--wide {grid-column: span 2;}
.roi-cell dt {font-size: 12.5px; color: var(--muted); margin-bottom: 4px;}
.roi-cell dd {margin: 0; font-family: var(--font-head); font-weight: 700; font-size: 20px; letter-spacing: -.01em;}
.serp {background: #fff; border: 1px solid var(--border); border-radius: 4px; padding: 20px 22px; font-family: Arial, sans-serif;}
.serp__crumb {font-size: 12px; color: #4d5156; margin-bottom: 4px; word-break: break-all;}
.serp__title {font-size: 20px; line-height: 1.3; color: #1a0dab; margin-bottom: 4px;}
.serp__desc {font-size: 14px; line-height: 1.58; color: #4d5156;}
.serp--mobile {max-width: 420px;}
.serp--mobile .serp__title {font-size: 18px;}
.tool-checks {margin-top: 22px; display: flex; flex-direction: column; gap: 7px;}
.tool-check {display: flex; align-items: flex-start; gap: 9px; margin: 0; font-size: 14px; line-height: 1.45;}
.tool-check span {flex: none; width: 18px; height: 18px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: #fff;}
.tool-check.is-ok span {background: var(--teal);}
.tool-check.is-warn span {background: #C08A2E;}
.tool-check.is-warn {color: var(--muted);}
.tool-field__req,
.tool-field__opt {font: 700 .58rem var(--font-mono); letter-spacing: .1em; text-transform: uppercase;
  padding: 3px 7px; border-radius: 999px; border: 1px solid var(--border);}
.tool-field__req {color: var(--teal); border-color: rgba(46, 110, 118, .35);}
.tool-field__opt {color: var(--muted);}
.tool-row {display: grid; grid-template-columns: 1fr 1fr; gap: 14px;}
@media (max-width: 520px) {
  .tool-row { grid-template-columns: 1fr; gap: 0; }
}
.tool-check-row {display: flex; align-items: flex-start; gap: 11px; margin-bottom: 16px;
  font-size: 13px; line-height: 1.5; color: var(--muted);}
.tool-check-row input {flex: none; width: 17px; height: 17px; margin-top: 1px; accent-color: var(--teal);}
.tool-check-row strong {color: var(--ink); font-weight: 600;}
.tool-panel__sub {margin: 26px 0 12px; padding-top: 18px; border-top: 1px solid var(--border);
  font: 700 .66rem var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--muted);}
.tool-toggle--wide {display: inline-flex; flex-wrap: wrap;}
@media (max-width: 620px) {
  .tool-toggle--wide { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .tool-toggle--wide .tool-toggle__btn + .tool-toggle__btn { border-left: 0; }
  .tool-toggle--wide .tool-toggle__btn { border-top: 1px solid var(--border); }
}
.tool-output {position: relative;}
.tool-output__code {display: block; margin: 0; padding: 18px 20px;
  background: var(--ink); color: #E8F1F0; border-radius: 4px;
  font-family: var(--font-mono); font-size: 12.5px; line-height: 1.6;
  word-break: break-all; white-space: pre-wrap;}
.tool-output__code--block {max-height: 420px; overflow: auto; word-break: normal;}
.tool-output__code.is-ready {color: var(--cyan);}
.tool-output__actions {display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px;}
.kd-list {list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-direction: column; gap: 3px; counter-reset: kd;}
.kd-row {display: grid; grid-template-columns: minmax(0, 1fr) 90px 42px 52px; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: 3px; font-size: 13.5px;}
.kd-row:nth-child(odd) {background: var(--cream);}
.kd-row__term {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.kd-row__bar {height: 6px; background: var(--border); border-radius: 999px; overflow: hidden;}
.kd-row__bar span {display: block; height: 100%; background: var(--teal); border-radius: 999px;}
.kd-row__num {font-family: var(--font-mono); font-size: 12.5px; text-align: right;}
.kd-row__pct {font-family: var(--font-mono); font-size: 12px; color: var(--muted); text-align: right;}
.kd-empty {padding: 16px 10px; font-size: 14px; color: var(--muted); list-style: none;}
@media (max-width: 560px) {
  .kd-row { grid-template-columns: minmax(0, 1fr) 42px 52px; }
  .kd-row__bar { display: none; }
}
.kd-target {margin: 18px 0 0; padding: 14px 16px; border-radius: 4px; font-size: 14px; line-height: 1.5;
  border: 1px solid var(--border); border-left-width: 3px; background: var(--cream);}
.kd-target.is-ok {border-left-color: var(--teal);}
.kd-target.is-warn {border-left-color: #C08A2E;}
.wc-limits {display: flex; flex-direction: column; gap: 9px;}
.wc-limit {display: grid; grid-template-columns: minmax(0, 1fr) 90px 96px; align-items: center; gap: 12px; font-size: 13px;}
.wc-limit__bar {height: 6px; background: var(--border); border-radius: 999px; overflow: hidden;}
.wc-limit__bar span {display: block; height: 100%; background: var(--teal); border-radius: 999px; transition: width .2s var(--ease);}
.wc-limit.is-over .wc-limit__bar span {background: #B4472F;}
.wc-limit__num {font-family: var(--font-mono); font-size: 12px; color: var(--muted); text-align: right;}
.wc-limit.is-over .wc-limit__num {color: #B4472F;}
@media (max-width: 560px) {
  .wc-limit { grid-template-columns: minmax(0, 1fr) 96px; }
  .wc-limit__bar { display: none; }
}
.sc-faq {position: relative; padding: 18px 18px 4px; margin-bottom: 14px; border: 1px solid var(--border); border-radius: 4px; background: var(--cream);}
.sc-faq__remove {position: absolute; top: 10px; right: 10px; border: 0; background: none; cursor: pointer;
  font: 700 .6rem var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--muted);}
.sc-faq__remove:hover {color: #B4472F;}
.rc-list {list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; counter-reset: hop;}
.rc-hop {display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: start; gap: 14px;
  padding: 14px 16px; border: 1px solid var(--border); border-left-width: 3px; border-radius: 4px; background: var(--cream);}
.rc-hop--ok {border-left-color: var(--teal);}
.rc-hop--redir {border-left-color: #C08A2E;}
.rc-hop--bad,
.rc-hop--err {border-left-color: #B4472F;}
.rc-hop__no {width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--cream-2); border: 1px solid var(--border);
  font-family: var(--font-mono); font-size: 12px; font-weight: 700;}
.rc-hop__body {min-width: 0; display: flex; flex-direction: column; gap: 7px;}
.rc-hop__url {font-family: var(--font-mono); font-size: 13px; word-break: break-all;}
.rc-hop__heads {display: flex; flex-wrap: wrap; gap: 6px;}
.rc-head {font-size: 11.5px; line-height: 1.4; color: var(--muted);
  background: #fff; border: 1px solid var(--border); border-radius: 3px; padding: 3px 8px;
  max-width: 100%; overflow: hidden; text-overflow: ellipsis;}
.rc-head b {color: var(--ink); font-weight: 700;}
.rc-hop__err {font-size: 12.5px; color: #B4472F;}
.rc-hop__status {flex: none; text-align: right; font-family: var(--font-mono); font-size: 15px; font-weight: 700; line-height: 1.2;}
.rc-hop__status small {display: block; font-size: 11px; font-weight: 400; color: var(--muted); margin-top: 3px;}
.rc-hop--ok .rc-hop__status {color: var(--teal);}
.rc-hop--redir .rc-hop__status {color: #C08A2E;}
.rc-hop--bad .rc-hop__status,
.rc-hop--err .rc-hop__status {color: #B4472F;}
/* ----- v2 overrides for the tool widgets ----- */
.v2-narrow { max-width: calc(860px + var(--gut) * 2); }
.tool-split { gap: 20px; }
.tool-panel { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: clamp(24px, 3vw, 36px); box-shadow: 0 18px 40px -34px rgba(14,28,30,.4); }
.tool-panel--result { background: var(--sand); border-top: 4px solid var(--teal); }
.roi-grid { border-radius: 14px; overflow: hidden; }
.roi-cell { background: #fff; }
.tool-panel__title { font: 600 21px/1.2 var(--f-head); letter-spacing: -.01em; }
.tool-field__label { font-weight: 600; font-size: 14px; }
.tool-field__wrap { border-radius: 12px; background: var(--cream); border-color: var(--line); min-height: 50px; }
.tool-field__wrap:focus-within { border-color: var(--teal); box-shadow: 0 0 0 4px rgba(46,110,118,.14); background: #fff; }
.tool-field__help { color: var(--muted); }
.tool-form { padding: 8px; border-radius: 999px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.tool-form__input { border: 0 !important; background: transparent !important; border-radius: 999px; padding: 12px 18px !important; font-size: 16px; outline: none !important; }
.tool-form:focus-within { border-color: var(--teal); box-shadow: 0 0 0 4px rgba(46,110,118,.14); }
@media (max-width: 560px) { .tool-form { border-radius: var(--r); } .tool-form .v2-btn { width: 100%; } }
.tool-card { position: relative; padding: 28px; border-radius: var(--r); background: #fff; border: 1px solid var(--line); gap: 10px; transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s; }
.tool-card:hover { border-color: #D3E6E8; box-shadow: var(--shadow); transform: translateY(-5px); }
.tool-card__ico { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; background: var(--ink); color: var(--mint); margin-bottom: 14px; }
.tool-card__title { font: 600 20px/1.25 var(--f-head); margin: 0; }
.tool-card__text { color: var(--muted); font-size: 15px; margin: 0; }
.tool-card__tag { position: absolute; top: 26px; right: 26px; font-size: 12px; font-weight: 600; color: var(--teal-2); background: var(--cream); border: 1px solid var(--line); padding: 4px 10px; border-radius: 999px; }
.tool-card__cta { margin-top: auto; padding-top: 10px; color: var(--teal); font-weight: 600; font-size: 15px; }
.tools-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
@media (max-width: 1000px) { .tools-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .tools-grid { grid-template-columns: 1fr; } }
.tool-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.v2-sec .v2-prose { max-width: 760px; }
.tool-page .v2-h2 { margin-bottom: 20px; }

/* ----- AI concierge chat panel (shown only when enabled in the admin), carried over from v1 ----- */
.vam-ico { width: 1em; height: 1em; display: inline-block; vertical-align: middle; flex: none; }
lord-icon { display: inline-block; }
.tool-card__ico lord-icon { width: 30px !important; height: 30px !important; filter: brightness(0) invert(.88) sepia(.3) hue-rotate(140deg); }
.vam-chatbox {position: fixed; right: 24px; bottom: 24px; z-index: 186;
  width: 372px; max-width: calc(100vw - 32px); height: 560px; max-height: calc(100vh - 110px);
  display: flex; flex-direction: column; overflow: hidden;
  background: #fff; border: 1px solid var(--border); border-radius: 18px;
  box-shadow: 0 30px 64px -22px rgba(21, 41, 43, .55);
  animation: vam-box-in .26s var(--ease);}
.vam-chatbox[hidden] {display: none;}
.vam-chatbox__head {display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px; background: linear-gradient(135deg, var(--teal), var(--ink)); color: #fff;}
.vam-chatbox__id {display: flex; align-items: center; gap: 10px;}
.vam-chatbox__avatar {width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, .16); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 12px; letter-spacing: .04em;}
.vam-chatbox__id strong {display: block; font-size: 15px; font-family: var(--font-head);}
.vam-chatbox__status {font-size: 12px; opacity: .85;}
.vam-chatbox__close {background: none; border: 0; color: #fff; font-size: 26px; line-height: 1; cursor: pointer; opacity: .85; padding: 0 4px;}
.vam-chatbox__close:hover {opacity: 1;}
.vam-chatbox__body {flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 11px; background: var(--cream);}
.vam-msg {max-width: 86%; padding: 10px 13px; border-radius: 14px; font-size: 14px; line-height: 1.5; word-wrap: break-word;}
.vam-msg--bot {align-self: flex-start; background: #fff; border: 1px solid var(--border); color: var(--ink); border-bottom-left-radius: 4px;}
.vam-msg--user {align-self: flex-end; background: var(--teal); color: #fff; border-bottom-right-radius: 4px;}
.vam-msg__btns {display: flex; flex-direction: column; gap: 6px; margin-top: 9px;}
.vam-msg__btn {display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 12px; border: 1px solid var(--teal, #1f7a82); border-radius: 10px; background: #fff; color: var(--teal, #0f5a60); font-size: 13px; font-weight: 600; text-decoration: none; transition: background-color .18s var(--ease), color .18s var(--ease);}
.vam-msg__btn:hover {background: var(--teal); color: #fff;}
.vam-typing {align-self: flex-start; display: flex; gap: 4px; padding: 13px 14px; background: #fff; border: 1px solid var(--border); border-radius: 14px;}
.vam-typing span {width: 7px; height: 7px; border-radius: 50%; background: var(--muted); animation: vam-typing 1.2s infinite;}
.vam-typing span:nth-child(2) {animation-delay: .2s;}
.vam-typing span:nth-child(3) {animation-delay: .4s;}
.vam-chatbox__chips {display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 12px 0;}
.vam-chip {padding: 7px 12px; border: 1px solid var(--border); border-radius: 999px; background: #fff; color: var(--ink); font-size: 12.5px; font-weight: 600; cursor: pointer; transition: border-color .18s var(--ease), color .18s var(--ease);}
.vam-chip:hover {border-color: var(--teal); color: var(--teal);}
.vam-chatbox__input {display: flex; gap: 8px; padding: 12px; border-top: 1px solid var(--border);}
.vam-chatbox__input input {flex: 1; min-width: 0; padding: 11px 15px; border: 1px solid var(--border); border-radius: 999px; font-size: 14px; font-family: var(--font-body); color: var(--ink);}
.vam-chatbox__input input:focus {outline: none; border-color: var(--teal);}
.vam-chatbox__input button {flex: none; width: 42px; height: 42px; border-radius: 50%; border: 0; background: var(--teal); color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background-color .2s var(--ease);}
.vam-chatbox__input button:hover {background: var(--ink);}
.vam-chatbox__foot {padding: 0 14px 11px; font-size: 11px; color: var(--muted); text-align: center;}
@media (max-width: 560px) {
  .vam-chatbox { right: 8px; left: 8px; bottom: 8px; width: auto; max-width: none; height: calc(100vh - 84px); }
}
.vam-chatbox { z-index: 95; }

/* ----- header search button ----- */
.v2-head__search { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; color: rgba(255,255,255,.88); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); transition: background-color .2s, color .2s; }
.v2-head__search:hover { background: rgba(255,255,255,.16); color: #fff; }
.v2-head.is-solid .v2-head__search { color: var(--ink); background: var(--cream); border-color: var(--line); }
@media (max-width: 960px) { .v2-head__search { display: none; } }

.tool-card__ico { background: linear-gradient(140deg, var(--mint-2), #F4FAFB); border: 1px solid #D7ECEF; }
.tool-card__ico lord-icon { filter: none; }
.tool-card:hover .tool-card__ico { background: #fff; }
.tool-card__tag { font: 600 12px/1.2 var(--f-body); letter-spacing: 0; text-transform: none; }