/* ═══ Signisys Theme — About Us Module (v1.0.9) ═══ */

/* ── About Hero — Corporate with canvas animation ── */
.ab-hero{position:relative;padding:var(--hero-pt) 0 40px;margin-bottom:0}
.ab-hero__in{position:relative;z-index:3;max-width:var(--mx);margin:0 auto;padding:0 var(--gut);display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
.ab-hero__left{max-width:560px}
.cr-hero__eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:20px}
.cr-hero__back{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;font-weight:600;color:var(--sl);transition:color .2s;text-decoration:none}
.cr-hero__back:hover{color:var(--or)}
.cr-hero__sep{width:1px;height:16px;background:var(--sv)}
.cr-hero__crumb{font-size:.78rem;color:var(--sl)}
.ab-hero__tag{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:100px;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px}
.ab-hero__tag-dot{width:6px;height:6px;border-radius:50%}
.ab-hero__title{font-size:clamp(2rem,3.8vw,2.8rem);font-weight:300;color:var(--nv);line-height:1.15;margin-bottom:12px;letter-spacing:-.01em}
.ab-hero__title strong{font-weight:700}
.ab-hero__rule{width:48px;height:2px;margin:16px 0;border-radius:2px}
.ab-hero__desc{font-size:.88rem;color:var(--sl);line-height:1.75;font-weight:300}
.ab-hero__right{position:relative;height:340px;margin-bottom:-100px;z-index:1}
.ab-hero__right canvas{position:absolute;top:0;left:0;width:100%;height:calc(100% + 100px)}

/* Orange — Company Overview */
.ab-hero--orange{background:linear-gradient(160deg,#FFFAF5 0%,var(--mi) 50%,#FFF5ED 100%)}
.ab-hero--orange .ab-hero__tag{background:rgba(254,96,0,.06);color:var(--or)}
.ab-hero--orange .ab-hero__tag-dot{background:var(--or)}
.ab-hero--orange .ab-hero__rule{background:var(--gr)}

/* Purple — Mission */
.ab-hero--indigo{background:linear-gradient(160deg,#F5F5FF 0%,var(--mi) 50%,#EEEDFF 100%)}
.ab-hero--indigo .ab-hero__tag{background:rgba(79,70,229,.06);color:#4338ca}
.ab-hero--indigo .ab-hero__tag-dot{background:#4338ca}
.ab-hero--indigo .ab-hero__rule{background:linear-gradient(90deg,#818cf8,#4f46e5)}

/* Green — Values */
.ab-hero--green{background:linear-gradient(160deg,#F7FDFB 0%,var(--mi) 50%,#F2FCF8 100%)}
.ab-hero--green .ab-hero__tag{background:rgba(16,185,129,.06);color:#059669}
.ab-hero--green .ab-hero__tag-dot{background:#059669}
.ab-hero--green .ab-hero__rule{background:linear-gradient(90deg,#34d399,#059669)}

/* Teal — Why Signisys */
.ab-hero--rose{background:linear-gradient(160deg,#FFF5F6 0%,var(--mi) 50%,#FFECEF 100%)}
.ab-hero--rose .ab-hero__tag{background:rgba(225,29,72,.06);color:#e11d48}
.ab-hero--rose .ab-hero__tag-dot{background:#e11d48}
.ab-hero--rose .ab-hero__rule{background:linear-gradient(90deg,#fb7185,#e11d48)}

/* Blue — Methodology */
.ab-hero--cyan{background:linear-gradient(160deg,#F0FDFE 0%,var(--mi) 50%,#E8FAFB 100%)}
.ab-hero--cyan .ab-hero__tag{background:rgba(8,145,178,.06);color:#0e7490}
.ab-hero--cyan .ab-hero__tag-dot{background:#0e7490}
.ab-hero--cyan .ab-hero__rule{background:linear-gradient(90deg,#22d3ee,#0891b2)}

/* Responsive */


/* ═══ Keyframes ═══ */
@keyframes pulse{0%,100%{opacity:.35}50%{opacity:.85}}
@keyframes glowPulse{0%,100%{opacity:.4;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}
@keyframes nodePulse{0%,100%{box-shadow:0 0 0 0 rgba(254,96,0,.3)}50%{box-shadow:0 0 0 14px rgba(254,96,0,0)}}

/* ═══ Mission Components ═══ */
/* 14a. Mission statement banner */
.ms-statement {
  background: var(--wh);
  border-top: 1px solid var(--cl);
  border-bottom: 1px solid var(--cl);
  position: relative; overflow: hidden;
  padding: clamp(32px, 4vw, 56px) 0;
}
.ms-statement::before {
  content: ''; position: absolute; inset: 0;
  background-image: radial-gradient(circle, rgba(254,96,0,.035) 1px, transparent 1px);
  background-size: 32px 32px; pointer-events: none;
}
.ms-statement::after {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0;
  width: 4px; background: var(--gr);
}
.ms-statement__watermark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:clamp(6rem,12vw,14rem);font-weight:900;line-height:1;background:linear-gradient(135deg,rgba(254,163,0,.05),rgba(254,96,0,.03));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;pointer-events:none;user-select:none;white-space:nowrap;z-index:1}
.ms-statement__inner { display: grid; grid-template-columns: 1fr; position: relative; z-index: 2; }
.ms-statement__left  { border-right: none; display: flex; flex-direction: column; justify-content: center; position: relative; }
.ms-statement__quote-mark {
  font-size: 5.5rem; line-height: .6; font-weight: 900;
  background: var(--gr); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  margin-bottom: 4px; display: block; opacity: .18;
  font-family: Georgia, serif; user-select: none;
}
.ms-statement__lines { display: flex; flex-direction: column; gap: 0; }
.ms-statement__line {
  display: flex; align-items: baseline; gap: 14px;
  padding: 10px 0; border-bottom: 1px solid var(--cl); transition: background .25s;
}
.ms-statement__line:last-child { border-bottom: none; }
.ms-statement__line:hover { background: rgba(254,96,0,.02); }
.ms-statement__line-num {
  font-size: .6rem; font-weight: 700; color: var(--or);
  opacity: .5; letter-spacing: .1em; min-width: 20px; padding-top: 4px; flex-shrink: 0;
}
.ms-statement__line-text { font-size: clamp(1.05rem, 1.8vw, 1.45rem); font-weight: 300; color: var(--nv); line-height: 1.3; }
.ms-statement__line-text strong { font-weight: 700; color: var(--nv); }
.ms-statement__line-text em {
  font-style: normal;
  background: var(--gr); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}


/* 14b. Mission chain — 4 commitment cards */
.ms-chain { padding: clamp(56px, 7vw, 96px) 0; background: var(--mi); position: relative; overflow: hidden; }
.ms-chain::before {
  content: ''; position: absolute; inset: 0;
  background-image: radial-gradient(circle, rgba(254,96,0,.04) 1px, transparent 1px);
  background-size: 40px 40px; opacity: .5; pointer-events: none;
}
.ms-chain__hd { text-align: center; margin-bottom: 48px; position: relative; z-index: 2; }
.ms-chain__hd .sec__ey { color: var(--or); }
.ms-chain__hd .sec__ey::before { background: var(--gr); }
.ms-chain__hd .sec__t { color: var(--nv); margin: 0 auto; text-align: center; }
.ms-chain__hd .sec__d { color: var(--sl); text-align: center; }

.ms-commit-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
  position: relative; z-index: 2;
}
.ms-commit {
  background: rgba(255,255,255,.55); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 18px; padding: 22px 20px;
  transition: all .4s var(--ease); position: relative;
  box-shadow: 0 2px 12px rgba(20,20,37,.03);
}
.ms-commit:hover { background: rgba(255,255,255,.82); border-color: transparent; box-shadow: 0 16px 48px rgba(20,20,37,.08); transform: translateY(-4px); }

.ms-commit__top {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 8px;
  margin-bottom: 4px;
}
.ms-commit__pre {
  font-size: .7rem; font-weight: 400; color: var(--sl);
  line-height: 1.4;
}
.ms-commit__ic {
  width: 40px; height: 40px; border-radius: 12px; flex-shrink: 0;
  background: linear-gradient(135deg, rgba(254,163,0,.12), rgba(254,96,0,.06));
  border: 1px solid rgba(254,96,0,.08);
  display: flex; align-items: center; justify-content: center;
  color: var(--or); transition: all .4s var(--ease);
}
.ms-commit:hover .ms-commit__ic {
  background: var(--gr); color: #fff; border-color: transparent; box-shadow: var(--sh-glow-sm);
}
.ms-commit__ic svg { width: 18px; height: 18px; stroke-width: 1.6; }

.ms-commit__body {
  font-size: clamp(.92rem, 1.4vw, 1.05rem); font-weight: 600;
  color: var(--nv); line-height: 1.35;
}
.ms-commit__body em {
  font-style: normal;
  background: var(--gr); -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; background-clip: text;
}

@media (max-width: 1024px) { .ms-commit-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px)  { .ms-commit-grid { grid-template-columns: 1fr; } }


/* 14c. Vision section — numbered pillars with left accent */
.ms-vision { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
.ms-vision__badge {
  display: inline-flex; align-items: center; gap: 10px;
  background: linear-gradient(135deg, rgba(254,163,0,.08), rgba(254,96,0,.05));
  border: 1px solid rgba(254,96,0,.12); border-radius: 100px;
  padding: 6px 14px; margin-bottom: 10px;
  font-size: .76rem; font-weight: 700; color: var(--or);
  text-transform: uppercase; letter-spacing: .08em;
}
.ms-vision__badge-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--or); animation: pulse 2s ease infinite; }
.ms-vision__title { font-size: clamp(1.6rem, 2.8vw, 2.4rem); font-weight: 300; color: var(--nv); line-height: 1.2; margin-bottom: 20px; }
.ms-vision__title strong { font-weight: 700; }
.ms-vision__text { font-size: .95rem; color: var(--sl); line-height: 1.8; font-weight: 300; margin-bottom: 14px; }

.ms-vision__pillars { display: flex; flex-direction: column; gap: 12px; }
.ms-vis-pillar {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 18px 20px;
  border-left: 3px solid var(--cl); border-radius: 0;
  transition: border-color .3s var(--ease), background .3s var(--ease);
}
.ms-vis-pillar:hover { border-left-color: var(--or); background: rgba(254,96,0,.015); }
.ms-vis-pillar__num {
  font-size: 1.5rem; font-weight: 900; line-height: 1;
  color: rgba(254,96,0,.1); min-width: 32px; flex-shrink: 0;
  transition: color .3s var(--ease);
}
.ms-vis-pillar:hover .ms-vis-pillar__num { color: rgba(254,96,0,.25); }
.ms-vis-pillar__val { font-size: .9rem; font-weight: 700; color: var(--nv); margin-bottom: 4px; line-height: 1.25; }
.ms-vis-pillar__lbl { font-size: .78rem; color: var(--sl); font-weight: 300; line-height: 1.5; }

@media (max-width: 768px) { .ms-vision { grid-template-columns: 1fr; gap: 32px; } }


/* 14d. Focus areas — glass morphism on mesh */
@keyframes focusMesh{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.ms-focus-wrap {
  border-radius: 24px; overflow: hidden; padding: 28px;
  background: linear-gradient(135deg, #EEF8FF 0%, #F5F0FF 25%, #EEFAF4 50%, #FFF0F3 75%, #FFF7EE 100%);
  background-size: 300% 300%; animation: focusMesh 14s ease infinite;
  position: relative;
}
.ms-focus-wrap::before {
  content: ''; position: absolute; inset: 0;
  background-image: radial-gradient(circle, rgba(20,20,37,.02) 1px, transparent 1px);
  background-size: 24px 24px; pointer-events: none; z-index: 1;
}
.ms-focus-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; position: relative; z-index: 2; }
.ms-focus-card {
  padding: 24px 22px;
  background: rgba(255,255,255,.6); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 16px; box-shadow: 0 2px 12px rgba(20,20,37,.03);
  transition: all .4s var(--ease); position: relative; overflow: hidden;
}
.ms-focus-card:hover { background: rgba(255,255,255,.82); box-shadow: 0 12px 36px rgba(20,20,37,.07); transform: translateY(-3px); }
.ms-focus-card__ic {
  width: 52px; height: 52px; border-radius: 16px; margin-bottom: 16px;
  display: flex; align-items: center; justify-content: center;
  transition: all .4s var(--ease); box-shadow: 0 2px 8px rgba(20,20,37,.03);
}
.ms-focus-card:hover .ms-focus-card__ic { transform: scale(1.08); }
.ms-focus-card__ic svg { width: 24px; height: 24px; }
.ms-focus-card__num {
  font-size: .65rem; font-weight: 700; color: var(--or);
  text-transform: uppercase; letter-spacing: .1em;
  margin-bottom: 6px; display: flex; align-items: center; gap: 6px;
}
.ms-focus-card__num::before { content: ''; width: 14px; height: 2px; background: var(--gr); border-radius: 2px; }
.ms-focus-card__title { font-size: 1.05rem; font-weight: 700; color: var(--nv); margin-bottom: 8px; line-height: 1.25; }
.ms-focus-card__text  { font-size: .84rem; color: var(--sl); line-height: 1.65; font-weight: 300; }
.ms-focus-card__tags  { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.ms-focus-tag { font-size: .7rem; font-weight: 600; border-radius: 100px; padding: 4px 10px; border: 1px solid; }

/* Icon + tag colors per card */
.ms-focus-card:nth-child(1) .ms-focus-card__ic{background:rgba(8,145,178,.08);color:#0891b2}
.ms-focus-card:nth-child(2) .ms-focus-card__ic{background:rgba(244,63,94,.08);color:#e11d48}
.ms-focus-card:nth-child(3) .ms-focus-card__ic{background:rgba(79,70,229,.08);color:#4f46e5}
.ms-focus-card:nth-child(1):hover .ms-focus-card__ic{background:#0891b2;color:#fff;box-shadow:0 4px 14px rgba(8,145,178,.2)}
.ms-focus-card:nth-child(2):hover .ms-focus-card__ic{background:#e11d48;color:#fff;box-shadow:0 4px 14px rgba(244,63,94,.2)}
.ms-focus-card:nth-child(3):hover .ms-focus-card__ic{background:#4f46e5;color:#fff;box-shadow:0 4px 14px rgba(79,70,229,.2)}
.ms-focus-card:nth-child(1) .ms-focus-tag{color:#0891b2;background:rgba(8,145,178,.06);border-color:rgba(8,145,178,.12)}
.ms-focus-card:nth-child(2) .ms-focus-tag{color:#e11d48;background:rgba(244,63,94,.06);border-color:rgba(244,63,94,.12)}
.ms-focus-card:nth-child(3) .ms-focus-tag{color:#4f46e5;background:rgba(79,70,229,.06);border-color:rgba(79,70,229,.12)}

@media (max-width: 1024px) { .ms-focus-grid { grid-template-columns: 1fr; } .ms-focus-wrap { padding: 20px; } }
@media (max-width: 640px)  { .ms-focus-wrap { padding: 14px; border-radius: 16px; } }


/* 14e. Approach — icon header tabs with multicolor */
.ms-approach { border-radius: 16px; overflow: hidden; border: 1px solid var(--cl); }

.ms-approach__tabs {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
  background: linear-gradient(135deg, rgba(254,163,0,.04), rgba(79,70,229,.04), rgba(16,185,129,.04), rgba(139,92,246,.04));
  border-bottom: 1px solid var(--cl);
}
.ms-approach__tab {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  padding: 18px 16px; font-size: .78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
  color: var(--sl); cursor: pointer;
  transition: all .3s var(--ease); position: relative;
  border: none; border-right: 1px solid var(--cl);
  background: none; font-family: var(--ft); white-space: nowrap;
}
.ms-approach__tab:last-child { border-right: none; }
.ms-approach__tab svg { width: 20px; height: 20px; flex-shrink: 0; opacity: .6; transition: opacity .3s var(--ease); }
.ms-approach__tab:hover { color: var(--nv); background: rgba(255,255,255,.5); }
.ms-approach__tab:hover svg { opacity: 1; }

/* Active tab — each tab gets its own color */
.ms-approach__tab--active { color: var(--nv); background: rgba(255,255,255,.6); }
.ms-approach__tab--active svg { opacity: 1; }
.ms-approach__tab--active::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0;
  height: 3px; z-index: 2;
}

/* Multicolor active underlines */
.ms-approach__tab[data-approach="1"]--active, .ms-approach__tab--active[data-approach="1"] { color: #e85d04; }
.ms-approach__tab--active[data-approach="1"] svg { color: #e85d04; }
.ms-approach__tab--active[data-approach="1"]::after { background: #e85d04; }

.ms-approach__tab--active[data-approach="2"] { color: #059669; }
.ms-approach__tab--active[data-approach="2"] svg { color: #059669; }
.ms-approach__tab--active[data-approach="2"]::after { background: #059669; }

.ms-approach__tab--active[data-approach="3"] { color: #d97706; }
.ms-approach__tab--active[data-approach="3"] svg { color: #d97706; }
.ms-approach__tab--active[data-approach="3"]::after { background: #d97706; }

.ms-approach__tab--active[data-approach="4"] { color: #6C2EB9; }
.ms-approach__tab--active[data-approach="4"] svg { color: #6C2EB9; }
.ms-approach__tab--active[data-approach="4"]::after { background: #6C2EB9; }

.ms-approach__panel {
  display: none; grid-template-columns: 64px 1fr; gap: 24px;
  align-items: start; padding: 36px 32px;
  background: var(--wh);
  animation: approachFadeIn .35s var(--ease);
}
.ms-approach__panel--active { display: grid; }
@keyframes approachFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.ms-approach__ic {
  width: 56px; height: 56px; border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  transition: all .35s var(--ease);
}
.ms-approach__ic svg { width: 26px; height: 26px; }
.ms-approach__ic--or { background: rgba(254,96,0,.06); color: #e85d04; }
.ms-approach__ic--gn { background: rgba(16,185,129,.06); color: #059669; }
.ms-approach__ic--am { background: rgba(217,119,6,.06); color: #d97706; }
.ms-approach__ic--pu { background: rgba(139,92,246,.06); color: #6C2EB9; }

.ms-approach__title {
  font-size: 1.1rem; font-weight: 700; color: var(--nv);
  margin-bottom: 8px; line-height: 1.25;
}
.ms-approach__text {
  font-size: .9rem; color: var(--sl); line-height: 1.7; font-weight: 300;
  max-width: 640px;
}

@media (max-width: 768px) {
  .ms-approach__tabs { grid-template-columns: 1fr 1fr; }
  .ms-approach__tab { padding: 14px 12px; font-size: .7rem; gap: 6px; border-bottom: 1px solid var(--cl); }
  .ms-approach__tab:nth-child(2) { border-right: none; }
  .ms-approach__tab svg { width: 16px; height: 16px; }
  .ms-approach__panel { grid-template-columns: 48px 1fr; gap: 16px; padding: 24px 20px; }
  .ms-approach__ic { width: 48px; height: 48px; }
}
@media (max-width: 480px) {
  .ms-approach__tabs { grid-template-columns: 1fr; }
  .ms-approach__tab { border-right: none; border-bottom: 1px solid var(--cl); }
  .ms-approach__tab:last-child { border-bottom: none; }
}


/* 14f. Mission CTA banner */
.ms-cta {
  background: linear-gradient(135deg, #141425 0%, #1E1E36 100%);
  border-radius: 24px; padding: 40px clamp(40px, 5vw, 64px);
  position: relative; overflow: hidden; text-align: center;
}
.ms-cta::before {
  content: ''; position: absolute; inset: 0;
  background-image: radial-gradient(circle, rgba(254,96,0,.04) 1px, transparent 1px);
  background-size: 36px 36px; pointer-events: none;
}
.ms-cta__ey  { font-size: .68rem; font-weight: 700; color: rgba(254,163,0,.8); text-transform: uppercase; letter-spacing: .12em; margin-bottom: 14px; position: relative; z-index: 2; }
.ms-cta__t   { font-size: clamp(1.5rem, 2.5vw, 2.2rem); font-weight: 300; color: #fff; line-height: 1.25; margin-bottom: 12px; position: relative; z-index: 2; max-width: 600px; margin-left: auto; margin-right: auto; }
.ms-cta__t strong { font-weight: 700; }
.ms-cta__d   { font-size: .95rem; color: rgba(255,255,255,.6); font-weight: 300; line-height: 1.65; max-width: none; margin: 0 auto 28px; position: relative; z-index: 2; }
.ms-cta__acts { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; position: relative; z-index: 2; }
.ms-cta .btn--s { border-color: rgba(255,255,255,.25); color: rgba(255,255,255,.85); }
.ms-cta .btn--s:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.5); color: #fff; }

/* ═══ Values Components ═══ */
/* 15a. Intro statement */
.val-intro{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:center;position:relative}
.val-intro__bg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:clamp(8rem,14vw,18rem);font-weight:900;line-height:1;background:linear-gradient(135deg,rgba(254,163,0,.06),rgba(254,96,0,.04));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;pointer-events:none;user-select:none;white-space:nowrap}
.val-intro__left{position:relative;z-index:2}
.val-intro__tag{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:100px;background:rgba(254,96,0,.06);font-size:.66rem;font-weight:700;color:var(--or);text-transform:uppercase;letter-spacing:.08em;margin-bottom:16px}
.val-intro__tag-dot{width:6px;height:6px;border-radius:50%;background:var(--or)}
.val-intro__quote{font-size:clamp(1.4rem,2.2vw,2rem);font-weight:300;color:var(--nv);line-height:1.4}
.val-intro__quote strong{font-weight:700}
.val-intro__body{position:relative;z-index:2;padding-left:28px;border-left:1px solid var(--cl)}
.val-intro__body p{font-size:.9rem;color:var(--sl);line-height:1.75;font-weight:300;margin-bottom:14px}
.val-intro__body p:last-child{margin-bottom:0}
@media(max-width:768px){
  .val-intro{grid-template-columns:1fr;gap:28px}
  .val-intro__body{border-left:none;padding-left:0;border-top:1px solid var(--cl);padding-top:24px}
  .val-intro__bg{display:none}
}


/* 15b. Values summary grid */
/* 15b. Values summary — Glass + Icon-Forward Horizontal */
.vg-wrap{position:relative;border-radius:24px;overflow:hidden;padding:32px 28px;background:linear-gradient(135deg,#FFF7EE 0%,#F5F0FF 20%,#EEFAF4 40%,#FFF0F3 60%,#EEF8FF 80%,#F8F0FF 100%);background-size:300% 300%;animation:meshDrift 14s ease infinite}
@keyframes meshDrift{0%,100%{background-position:0% 50%}25%{background-position:50% 0%}50%{background-position:100% 50%}75%{background-position:50% 100%}}
.vg-wrap::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(20,20,37,.025) 1px,transparent 1px);background-size:24px 24px;pointer-events:none;z-index:1}
.vg-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;position:relative;z-index:2}
.vg-card{display:grid;grid-template-columns:68px 1fr;gap:18px;align-items:center;padding:28px 28px;background:rgba(255,255,255,.65);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.7);border-radius:16px;box-shadow:0 2px 12px rgba(20,20,37,.03);transition:all .4s var(--ease);position:relative;overflow:hidden;text-decoration:none;color:inherit}
.vg-card:hover{background:rgba(255,255,255,.82);box-shadow:0 12px 40px rgba(20,20,37,.08);transform:translateY(-3px)}
.vg-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.vg-card:hover::after{transform:scaleX(1)}
.vg-card__ic{width:64px;height:64px;border-radius:16px;display:flex;align-items:center;justify-content:center;position:relative;transition:all .4s var(--ease)}
.vg-card:hover .vg-card__ic{color:#fff;transform:scale(1.04)}
.vg-card__ic svg{width:28px;height:28px}
.vg-card__num{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:6px;background:var(--wh);font-size:.55rem;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.06);transition:all .3s var(--ease)}
.vg-card:hover .vg-card__num{color:#fff}
.vg-card__t{font-size:1rem;font-weight:700;color:var(--nv);margin-bottom:4px;line-height:1.25}
.vg-card__d{font-size:.8rem;color:var(--sl);font-weight:300;line-height:1.55}

/* Per-card colors */
.vg-card--1 .vg-card__ic{background:rgba(254,96,0,.07);color:#e85d04;box-shadow:0 2px 8px rgba(254,96,0,.06)}
.vg-card--1:hover .vg-card__ic{background:#e85d04;box-shadow:0 6px 20px rgba(254,96,0,.22)}
.vg-card--1 .vg-card__num{border:1px solid rgba(254,96,0,.12);color:#e85d04}
.vg-card--1:hover .vg-card__num{background:#e85d04;border-color:#e85d04}
.vg-card--1:hover{border-color:rgba(254,96,0,.18)}
.vg-card--1::after{background:#e85d04}

.vg-card--2 .vg-card__ic{background:rgba(79,70,229,.07);color:#4f46e5;box-shadow:0 2px 8px rgba(79,70,229,.06)}
.vg-card--2:hover .vg-card__ic{background:#4f46e5;box-shadow:0 6px 20px rgba(79,70,229,.22)}
.vg-card--2 .vg-card__num{border:1px solid rgba(79,70,229,.12);color:#4f46e5}
.vg-card--2:hover .vg-card__num{background:#4f46e5;border-color:#4f46e5}
.vg-card--2:hover{border-color:rgba(79,70,229,.18)}
.vg-card--2::after{background:#4f46e5}

.vg-card--3 .vg-card__ic{background:rgba(16,185,129,.07);color:#059669;box-shadow:0 2px 8px rgba(16,185,129,.06)}
.vg-card--3:hover .vg-card__ic{background:#059669;box-shadow:0 6px 20px rgba(16,185,129,.22)}
.vg-card--3 .vg-card__num{border:1px solid rgba(16,185,129,.12);color:#059669}
.vg-card--3:hover .vg-card__num{background:#059669;border-color:#059669}
.vg-card--3:hover{border-color:rgba(16,185,129,.18)}
.vg-card--3::after{background:#059669}

.vg-card--4 .vg-card__ic{background:rgba(244,63,94,.07);color:#e11d48;box-shadow:0 2px 8px rgba(244,63,94,.06)}
.vg-card--4:hover .vg-card__ic{background:#e11d48;box-shadow:0 6px 20px rgba(244,63,94,.22)}
.vg-card--4 .vg-card__num{border:1px solid rgba(244,63,94,.12);color:#e11d48}
.vg-card--4:hover .vg-card__num{background:#e11d48;border-color:#e11d48}
.vg-card--4:hover{border-color:rgba(244,63,94,.18)}
.vg-card--4::after{background:#e11d48}

.vg-card--5 .vg-card__ic{background:rgba(8,145,178,.07);color:#0891b2;box-shadow:0 2px 8px rgba(8,145,178,.06)}
.vg-card--5:hover .vg-card__ic{background:#0891b2;box-shadow:0 6px 20px rgba(8,145,178,.22)}
.vg-card--5 .vg-card__num{border:1px solid rgba(8,145,178,.12);color:#0891b2}
.vg-card--5:hover .vg-card__num{background:#0891b2;border-color:#0891b2}
.vg-card--5:hover{border-color:rgba(8,145,178,.18)}
.vg-card--5::after{background:#0891b2}

.vg-card--6 .vg-card__ic{background:rgba(139,92,246,.07);color:#7c3aed;box-shadow:0 2px 8px rgba(139,92,246,.06)}
.vg-card--6:hover .vg-card__ic{background:#7c3aed;box-shadow:0 6px 20px rgba(139,92,246,.22)}
.vg-card--6 .vg-card__num{border:1px solid rgba(139,92,246,.12);color:#7c3aed}
.vg-card--6:hover .vg-card__num{background:#7c3aed;border-color:#7c3aed}
.vg-card--6:hover{border-color:rgba(139,92,246,.18)}
.vg-card--6::after{background:#7c3aed}

@media(max-width:768px){.vg-grid{grid-template-columns:1fr}.vg-wrap{padding:24px 16px}}

/* 15c. Values detail cards */

/* Val-card section padding override — 58px total */
#val-customer-success,#val-integrity,#val-respect,#val-curiosity,#val-teamwork,#val-accountability{padding:58px 0}
.val-card {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 40px; align-items: start;
  padding: 0;
  border-top: 1px solid var(--cl);
}
.val-card:first-of-type { border-top: none; }
.val-card--rev { direction: rtl; }
.val-card--rev > * { direction: ltr; }

.val-card__vis {
  position: sticky; top: calc(68px + 56px + 20px);
  border-radius: 20px; overflow: hidden;
  background: var(--wh);
  border: 1px solid var(--sv);
  display: grid; grid-template-rows: auto 1fr;
  box-shadow: 0 4px 24px rgba(20,20,37,.04);
  transition: all .4s var(--ease);
}
.val-card:hover .val-card__vis{border-color:rgba(254,96,0,.12);box-shadow:0 12px 40px rgba(20,20,37,.07)}
.val-card__vis-top{
  padding:32px 28px 24px;display:flex;flex-direction:column;align-items:center;gap:14px;
  position:relative;
}
.val-card__vis-top::after{
  content:'';position:absolute;bottom:0;left:24px;right:24px;height:1px;
  background:linear-gradient(90deg,transparent,var(--sv),transparent);
}
.val-card__vis-bottom{
  padding:16px 20px 20px;display:grid;grid-template-columns:1fr 1fr;gap:8px;align-content:center;
}
.val-card__vis-chip{
  display:flex;align-items:center;gap:10px;padding:10px 12px;
  background:var(--mi);border-radius:10px;border:1px solid transparent;transition:all .3s var(--ease);
}
.val-card__vis-chip:hover{border-color:rgba(254,96,0,.1);background:var(--wh);box-shadow:0 2px 8px rgba(20,20,37,.04)}
.val-card__vis-chip-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.val-card__vis-chip-dot--1{background:rgba(254,96,0,.5)}
.val-card__vis-chip-dot--2{background:rgba(79,70,229,.5)}
.val-card__vis-chip-dot--3{background:rgba(16,185,129,.5)}
.val-card__vis-chip-dot--4{background:rgba(244,63,94,.5)}
.val-card__vis-chip-t{font-size:.7rem;font-weight:600;color:var(--nv);line-height:1.2}
.val-card__vis-chip-d{font-size:.6rem;color:var(--sl);font-weight:300;margin-top:1px;line-height:1.25}
.val-card__vis-ring {
  display: none;
  animation: glowPulse 4s ease infinite;
}
.val-card__vis-ring:nth-child(2) { width: 200px; height: 200px; animation-delay: 1s; }

.val-card__vis-icon {
  position: relative; z-index: 2;
  width: 64px; height: 64px; border-radius: 18px;
  background: var(--gr);
  display: flex; align-items: center; justify-content: center;
  color: #fff; border: none;
  box-shadow: 0 8px 24px rgba(254,96,0,.2);
  transition: all .45s var(--ease);
}
.val-card:hover .val-card__vis-icon { transform: scale(1.08); box-shadow: 0 12px 32px rgba(254,96,0,.25); }
.val-card__vis-icon svg { width: 28px; height: 28px; }

.val-card__vis-label { position: relative; z-index: 2; font-size: 1.3rem; font-weight: 300; color: var(--nv); line-height: 1.2; }
.val-card__vis-label strong { font-weight: 700; color: var(--or); }
.val-card__vis-num { position: absolute; top: 12px; right: 16px; font-size: 1.8rem; font-weight: 800; color: rgba(254,96,0,.06); line-height: 1; z-index: 1; pointer-events: none; user-select: none; }

.val-card__body { padding: 8px 0; }
.val-card__num {
  font-size: .72rem; font-weight: 700; color: var(--or);
  text-transform: uppercase; letter-spacing: .14em;
  margin-bottom: 8px; display: flex; align-items: center; gap: 8px;
}
.val-card__num::before { content: ''; width: 20px; height: 2px; background: var(--gr); border-radius: 4px; }

.val-card__title { font-size: clamp(1.8rem, 2.8vw, 2.4rem); font-weight: 300; color: var(--nv); line-height: 1.15; margin-bottom: 20px; }
.val-card__title strong { font-weight: 700; }

.val-card__lead {
  font-size: 1rem; color: var(--nv); font-weight: 400;
  line-height: 1.65; margin-bottom: 16px;
  padding: 16px 20px;
  background: linear-gradient(135deg, rgba(254,163,0,.05), rgba(254,96,0,.03));
  border-radius: 10px; border-left: 3px solid var(--or);
}
.val-card__text { font-size: .95rem; color: var(--sl); line-height: 1.8; font-weight: 300; margin-bottom: 14px; }

.val-card__pillars { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 24px; }
.val-pillar {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 14px; background: var(--mi); border: 1px solid var(--sv);
  border-radius: 10px; transition: all .3s var(--ease);
}
.val-pillar:hover { border-color: rgba(254,96,0,.15); background: var(--wh); box-shadow: var(--sh-rest); }
.val-pillar__ic { width: 28px; height: 28px; border-radius: 8px; flex-shrink: 0; background: rgba(254,96,0,.05); display: flex; align-items: center; justify-content: center; color: var(--or); box-shadow: 0 1px 4px rgba(254,96,0,.04); }
.val-pillar__ic svg { width: 13px; height: 13px; }
.val-pillar__text { font-size: .8rem; font-weight: 600; color: var(--nv); line-height: 1.35; }
.val-pillar__sub  { font-size: .74rem; color: var(--sl); font-weight: 300; margin-top: 2px; line-height: 1.3; }

@media (max-width: 768px) {
  .val-card { grid-template-columns: 1fr; gap: 28px; }
  .val-card--rev { direction: ltr; }
  .val-card__vis { position: static; }
  .val-card__vis-bottom { grid-template-columns: 1fr; }
  .val-card__pillars { grid-template-columns: 1fr; }
}


/* 15d. Values CTA banner */
.val-cta {
  background: linear-gradient(135deg, var(--nv) 0%, var(--nv2) 100%);
  border-radius: 24px; padding: 40px clamp(40px, 5vw, 64px);
  position: relative; overflow: hidden; text-align: center;
}
.val-cta::before {
  content: ''; position: absolute; inset: 0;
  background-image: radial-gradient(circle, rgba(254,96,0,.04) 1px, transparent 1px);
  background-size: 36px 36px; opacity: .6; pointer-events: none;
}
.val-cta__ey { font-size: .68rem; font-weight: 700; color: rgba(254,163,0,.8); text-transform: uppercase; letter-spacing: .12em; margin-bottom: 14px; position: relative; z-index: 2; }
.val-cta__t  { font-size: clamp(1.5rem, 2.5vw, 2.2rem); font-weight: 300; color: #fff; line-height: 1.25; margin-bottom: 12px; position: relative; z-index: 2; max-width: 600px; margin-left: auto; margin-right: auto; }
.val-cta__t strong { font-weight: 700; }
.val-cta__d  { font-size: .95rem; color: rgba(255,255,255,.6); font-weight: 300; line-height: 1.65; margin: 0 auto 28px; position: relative; z-index: 2; }
.val-cta__acts { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; position: relative; z-index: 2; }
.val-cta .btn--s { border-color: rgba(255,255,255,.25); color: rgba(255,255,255,.85); }
.val-cta .btn--s:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.5); color: #fff; }
/* ═══ Diff Tabs — Tab-Style Selector ═══ */
.diff-tabs-wrap{position:relative}
.diff-tabs{display:flex;gap:4px;margin-bottom:0;border-bottom:2px solid var(--cl);flex-wrap:wrap}
.diff-tab{padding:14px 22px;font-size:.82rem;font-weight:600;color:var(--sl);border-radius:10px 10px 0 0;cursor:pointer;transition:all .3s var(--ease);position:relative;border:1px solid transparent;border-bottom:none;background:none;font-family:var(--ft);white-space:nowrap}
.diff-tab:hover{color:var(--or);background:rgba(254,96,0,.04);border-color:var(--cl)}
.diff-tab--active{color:var(--or);background:rgba(254,96,0,.04);border-color:var(--cl)}
.diff-tab--active::after{content:'';position:absolute;bottom:-2px;left:0;right:0;height:2px;background:var(--or);z-index:2}
.diff-tab__num{font-size:.6rem;font-weight:800;color:rgba(254,96,0,.4);margin-right:6px;letter-spacing:.04em}

.diff-panel{display:none;grid-template-columns:80px 1fr;gap:28px;align-items:start;padding:36px 32px;background:var(--wh);border:1px solid var(--sv);border-top:none;border-radius:0 0 16px 16px;animation:diffFadeIn .35s var(--ease)}
.diff-panel--active{display:grid}
@keyframes diffFadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.diff-panel__ic{width:72px;height:72px;border-radius:20px;display:flex;align-items:center;justify-content:center;transition:all .35s var(--ease);border:1px solid transparent}
.diff-panel__ic svg{width:30px;height:30px}
.diff-panel__ic--1{background:linear-gradient(135deg,#FFF5EE,#FFF0E0);color:#e85d04;border-color:rgba(254,96,0,.06)}
.diff-panel__ic--2{background:linear-gradient(135deg,#EEF5FF,#E8F0FA);color:#4f46e5;border-color:rgba(79,70,229,.06)}
.diff-panel__ic--3{background:linear-gradient(135deg,#EEFAF4,#E8F5EE);color:#059669;border-color:rgba(16,185,129,.06)}
.diff-panel__ic--4{background:linear-gradient(135deg,#F8F0FF,#F3EBF8);color:#7c3aed;border-color:rgba(139,92,246,.06)}
.diff-panel__ic--5{background:linear-gradient(135deg,#FFF8EE,#FFF3E0);color:#0891b2;border-color:rgba(8,145,178,.06)}

.diff-panel__body{}
.diff-panel__ey{display:inline-flex;align-items:center;gap:8px;font-size:.68rem;font-weight:700;color:var(--or);text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px}
.diff-panel__ey::before{content:'';width:18px;height:2px;background:var(--gr);border-radius:4px}
.diff-panel__t{font-size:clamp(1.3rem,2vw,1.7rem);font-weight:300;color:var(--nv);line-height:1.25;margin-bottom:12px}
.diff-panel__t strong{font-weight:700}
.diff-panel__p{font-size:.88rem;color:var(--sl);line-height:1.7;font-weight:300;margin-bottom:16px;max-width:640px}
.diff-panel__checks{display:flex;flex-wrap:wrap;gap:8px}
.diff-tab-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:100px;background:rgba(254,96,0,.04);border:1px solid rgba(254,96,0,.08);font-size:.72rem;font-weight:600;color:var(--or)}
.diff-tab-chip svg{width:12px;height:12px;flex-shrink:0}

@media(max-width:768px){
  .diff-panel{grid-template-columns:60px 1fr;gap:18px;padding:24px 20px}
  .diff-panel__ic{width:60px;height:60px;border-radius:16px}
  .diff-panel__ic svg{width:24px;height:24px}
  .diff-tabs{gap:0}
  .diff-tab{padding:10px 14px;font-size:.76rem}
}


/* ═══ Cap Numbered List ═══ */
.cap-num-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.cap-num{position:relative}
.cap-num__number{font-size:3.2rem;font-weight:900;line-height:1;margin-bottom:8px;transition:all .4s var(--ease)}
.cap-num:hover .cap-num__number{filter:brightness(1.3)}
.cap-num__title{font-size:1.05rem;font-weight:700;color:var(--nv);margin-bottom:12px;padding-bottom:12px;position:relative}
.cap-num__title::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:2px;border-radius:2px;transition:width .35s var(--ease)}
.cap-num:hover .cap-num__title::after{width:100%}
.cap-num__items{list-style:none}
.cap-num__item{font-size:.84rem;color:var(--sl);font-weight:300;padding:7px 0;border-bottom:1px solid var(--cl);transition:color .2s var(--ease)}
.cap-num__item:last-child{border-bottom:none}
.cap-num:hover .cap-num__item{color:var(--ch)}

/* Per-card colors — numbers as subtle watermark text */
.cap-num.c1 .cap-num__number{color:rgba(254,96,0,.10)}
.cap-num.c1 .cap-num__title::after{background:rgba(254,96,0,.15)}
.cap-num.c1:hover .cap-num__title::after{background:#e85d04}

.cap-num.c2 .cap-num__number{color:rgba(79,70,229,.10)}
.cap-num.c2 .cap-num__title::after{background:rgba(79,70,229,.15)}
.cap-num.c2:hover .cap-num__title::after{background:#4f46e5}

.cap-num.c3 .cap-num__number{color:rgba(16,185,129,.10)}
.cap-num.c3 .cap-num__title::after{background:rgba(16,185,129,.15)}
.cap-num.c3:hover .cap-num__title::after{background:#059669}

.cap-num.c4 .cap-num__number{color:rgba(244,63,94,.10)}
.cap-num.c4 .cap-num__title::after{background:rgba(244,63,94,.15)}
.cap-num.c4:hover .cap-num__title::after{background:#e11d48}

.cap-num.c5 .cap-num__number{color:rgba(8,145,178,.10)}
.cap-num.c5 .cap-num__title::after{background:rgba(8,145,178,.15)}
.cap-num.c5:hover .cap-num__title::after{background:#0891b2}

.cap-num.c6 .cap-num__number{color:rgba(139,92,246,.10)}
.cap-num.c6 .cap-num__title::after{background:rgba(139,92,246,.15)}
.cap-num.c6:hover .cap-num__title::after{background:#7c3aed}

@media(max-width:1024px){.cap-num-grid{grid-template-columns:repeat(2,1fr);gap:24px}}
@media(max-width:640px){.cap-num-grid{grid-template-columns:1fr;gap:20px}}

/* ═══ Diff Compact — Icon Badge Style ═══ */
.diff-compact{display:grid;grid-template-columns:80px 1fr;gap:24px;align-items:start;padding:36px 0;border-bottom:1px solid var(--cl)}
.diff-compact:last-child{border-bottom:none}
.diff-compact__badge{position:relative}
.diff-compact__ic{width:72px;height:72px;border-radius:20px;display:flex;align-items:center;justify-content:center;transition:all .35s var(--ease);border:1px solid transparent}
.diff-compact:hover .diff-compact__ic{box-shadow:0 8px 24px rgba(0,0,0,.12);transform:scale(1.06)}
.diff-compact__ic svg{width:30px;height:30px}
.diff-compact__ic--1{background:linear-gradient(135deg,#FFF5EE,#FFF0E0);color:#e85d04;border-color:rgba(254,96,0,.06)}
.diff-compact:hover .diff-compact__ic--1{background:linear-gradient(135deg,#FEA300,#FE6000);color:#fff;border-color:transparent}
.diff-compact__ic--2{background:linear-gradient(135deg,#EEF5FF,#E8F0FA);color:#4f46e5;border-color:rgba(79,70,229,.06)}
.diff-compact:hover .diff-compact__ic--2{background:linear-gradient(135deg,#818cf8,#4f46e5);color:#fff;border-color:transparent}
.diff-compact__ic--3{background:linear-gradient(135deg,#EEFAF4,#E8F5EE);color:#059669;border-color:rgba(16,185,129,.06)}
.diff-compact:hover .diff-compact__ic--3{background:linear-gradient(135deg,#34d399,#059669);color:#fff;border-color:transparent}
.diff-compact__ic--4{background:linear-gradient(135deg,#F8F0FF,#F3EBF8);color:#7c3aed;border-color:rgba(139,92,246,.06)}
.diff-compact:hover .diff-compact__ic--4{background:linear-gradient(135deg,#a78bfa,#7c3aed);color:#fff;border-color:transparent}
.diff-compact__ic--5{background:linear-gradient(135deg,#FFF8EE,#FFF3E0);color:#0891b2;border-color:rgba(8,145,178,.06)}
.diff-compact:hover .diff-compact__ic--5{background:linear-gradient(135deg,#22d3ee,#0891b2);color:#fff;border-color:transparent}
.diff-compact__num{position:absolute;top:-6px;right:-6px;width:22px;height:22px;border-radius:7px;background:var(--wh);border:1px solid var(--sv);font-size:.58rem;font-weight:800;color:var(--or);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.06)}
.diff-compact__body{}
.diff-compact__ey{display:inline-flex;align-items:center;gap:8px;font-size:.68rem;font-weight:700;color:var(--or);text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px}
.diff-compact__ey::before{content:'';width:18px;height:2px;background:var(--gr);border-radius:4px}
.diff-compact__t{font-size:clamp(1.3rem,2vw,1.7rem);font-weight:300;color:var(--nv);line-height:1.25;margin-bottom:12px}
.diff-compact__t strong{font-weight:700}
.diff-compact__p{font-size:.88rem;color:var(--sl);line-height:1.7;font-weight:300;margin-bottom:16px;max-width:640px}
.diff-compact__checks{display:flex;flex-wrap:wrap;gap:8px}
.diff-chip{display:flex;align-items:center;gap:5px;padding:5px 12px;border-radius:100px;background:rgba(254,96,0,.04);border:1px solid rgba(254,96,0,.08);font-size:.72rem;font-weight:600;color:var(--or)}
.diff-chip svg{width:12px;height:12px;flex-shrink:0}
@media(max-width:640px){.diff-compact{grid-template-columns:60px 1fr;gap:16px}.diff-compact__ic{width:60px;height:60px;border-radius:16px}.diff-compact__ic svg{width:24px;height:24px}}

/* ═══ Why Signisys Components ═══ */
/* 14a. Differentiators */
.diff-row {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 64px; align-items: center;
  padding: clamp(48px, 6vw, 72px) 0;
  border-top: 1px solid var(--sv);
}
.diff-row:first-child { border-top: none; }
.diff-row--flip { direction: rtl; }
.diff-row--flip > * { direction: ltr; }

.diff-visual {
  border-radius: 18px; overflow: hidden;
  aspect-ratio: 4/3; position: relative;
  display: flex; align-items: center; justify-content: center;
}
.diff-visual--1 { background: linear-gradient(135deg, #FFF5EE, #FFF0E0, #FFF8F3); }
.diff-visual--2 { background: linear-gradient(135deg, #EEF5FF, #E8F0FA, #F0F4FF); }
.diff-visual--3 { background: linear-gradient(135deg, #EEFAF4, #E8F5EE, #F0FAF4); }
.diff-visual--4 { background: linear-gradient(135deg, #F8F0FF, #F3EBF8, #FAF0FF); }
.diff-visual--5 { background: linear-gradient(135deg, #FFF8EE, #FFF3E0, #FFFAEE); }

.diff-visual__dot-bg {
  position: absolute; inset: 0;
  background-image: radial-gradient(circle, rgba(20,20,37,.04) 1px, transparent 1px);
  background-size: 28px 28px; pointer-events: none;
}
.diff-visual__content {
  position: relative; z-index: 2;
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  padding: 32px;
}
.diff-visual__ic {
  width: 80px; height: 80px; border-radius: 22px;
  background: var(--wh); display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 28px rgba(20,20,37,.09);
  transition: all .4s var(--ease);
}
.diff-visual__ic svg { width: 36px; height: 36px; color: var(--or); }
.diff-row:hover .diff-visual__ic { background: var(--gr); box-shadow: var(--sh-glow-lg); }
.diff-row:hover .diff-visual__ic svg { color: #fff; }
.diff-visual__cards {
  display: flex; gap: 10px; flex-wrap: wrap; justify-content: center;
}
.diff-visual__card {
  background: var(--wh); border: 1px solid var(--sv);
  border-radius: 10px; padding: 10px 14px;
  font-size: .75rem; font-weight: 600; color: var(--ch);
  box-shadow: var(--sh-rest); white-space: nowrap;
}
.diff-visual__card--accent {
  background: var(--gr); color: #fff; border-color: transparent;
  box-shadow: var(--sh-glow-sm);
}

.diff-text__ey {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .65rem; font-weight: 700; color: var(--or);
  text-transform: uppercase; letter-spacing: .1em; margin-bottom: 16px;
}
.diff-text__ey::before { content: ''; width: 16px; height: 2px; background: var(--gr); border-radius: 4px; }
.diff-text__n {
  font-size: .68rem; font-weight: 700; color: rgba(254,96,0,.3);
  letter-spacing: .08em; text-transform: uppercase; margin-bottom: 4px;
}
.diff-text__t {
  font-size: clamp(1.4rem, 2.2vw, 1.9rem); font-weight: 300;
  color: var(--nv); line-height: 1.2; margin-bottom: 16px;
}
.diff-text__t strong { font-weight: 700; }
.diff-text__p {
  font-size: .95rem; color: var(--sl); line-height: 1.8;
  font-weight: 300; margin-bottom: 24px;
}
.diff-text__checks { list-style: none; display: flex; flex-direction: column; gap: 10px; margin-bottom: 28px; }
.diff-text__check {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: .88rem; color: var(--ch); line-height: 1.55;
}
.diff-text__check-ic {
  width: 20px; height: 20px; min-width: 20px; border-radius: 6px;
  background: rgba(254,96,0,.08); display: flex; align-items: center; justify-content: center;
  margin-top: 1px;
}
.diff-text__check-ic svg { width: 11px; height: 11px; color: var(--or); }

@media (max-width: 1024px) {
  .diff-row { grid-template-columns: 1fr; gap: 32px; }
  .diff-row--flip { direction: ltr; }
  .diff-visual { aspect-ratio: 16/7; }
}
@media (max-width: 640px) {
  .diff-row { gap: 24px; padding: clamp(36px, 5vw, 56px) 0; }
  .diff-visual { aspect-ratio: 16/8; }
}


/* 14b. Capability coverage */
.cap-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
.cap-card {
  background: var(--wh); border: 1px solid var(--sv);
  border-radius: 14px; padding: 24px 22px;
  transition: all .4s var(--ease); position: relative; overflow: hidden;
}
.cap-card::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px;
  background: var(--gr); transform: scaleX(0); transform-origin: left;
  transition: transform .4s var(--ease);
}
.cap-card:hover { border-color: transparent; box-shadow: var(--sh-hover); transform: translateY(-4px); }
.cap-card:hover::after { transform: scaleX(1); }
.cap-card:hover .cap-card__ic { background: var(--gr); color: #fff; box-shadow: var(--sh-glow-sm); }

.cap-card__ic {
  width: 48px; height: 48px; border-radius: 14px; margin-bottom: 16px;
  background: linear-gradient(135deg, rgba(254,163,0,.08), rgba(254,96,0,.04));
  display: flex; align-items: center; justify-content: center;
  color: var(--or); transition: all .4s var(--ease);
}
.cap-card__ic svg { width: 22px; height: 22px; }
.cap-card__t { font-size: 1rem; font-weight: 600; color: var(--nv); margin-bottom: 8px; }
.cap-card__items { list-style: none; display: flex; flex-direction: column; gap: 4px; }
.cap-card__item {
  font-size: .82rem; color: var(--sl); font-weight: 300;
  padding-left: 14px; position: relative;
}
.cap-card__item::before {
  content: ''; position: absolute; left: 0; top: 8px;
  width: 5px; height: 5px; border-radius: 50%;
  background: rgba(254,96,0,.25); border: 1.5px solid var(--or);
}

@media (max-width: 1024px) { .cap-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px)  { .cap-grid { grid-template-columns: 1fr; } }
/* 14d. Trust signals — partner logo grid */
.trust-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
  margin-bottom: 16px;
}
.trust-logo {
  background: var(--mi); border: 1px solid var(--cl);
  border-radius: 14px; padding: 22px 20px;
  display: flex; align-items: center; justify-content: center;
  height: 80px; transition: all .3s var(--ease);
}
.trust-logo:hover { border-color: rgba(254,96,0,.15); box-shadow: var(--sh-glow-sm); transform: translateY(-2px); }
.trust-logo img { height: 32px; width: auto; max-width: 100%; object-fit: contain; }

.trust-cta { text-align: center; margin-top: 28px; margin-bottom: 16px; }

@media (max-width: 1024px) { .trust-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px)  { .trust-grid { grid-template-columns: 1fr 1fr; } .trust-logo { height: 68px; padding: 16px 12px; } .trust-logo img { height: 26px; } }
/* ═══ Methodology Components ═══ */
/* 14a. Six-phase method flow */
.method-flow { position: relative; max-width: 800px; margin: 0 auto; }

.method-step {
  display: grid; grid-template-columns: 64px 1fr;
  gap: 24px; margin-bottom: 48px; position: relative;
}
.method-step:not(:last-child)::after {
  content: ''; position: absolute; left: 31px; top: 72px; bottom: -48px;
  width: 2px; background: linear-gradient(180deg, var(--or), rgba(254,96,0,.08));
}
.method-step:last-child { margin-bottom: 0; }

.method-step__num {
  width: 64px; height: 64px; border-radius: 16px;
  background: linear-gradient(135deg, rgba(254,163,0,.08), rgba(254,96,0,.04));
  display: flex; align-items: center; justify-content: center;
  font-size: 1.5rem; font-weight: 700; color: var(--or);
  flex-shrink: 0; position: relative; z-index: 2;
  border: 1px solid rgba(254,96,0,.08);
  transition: all .4s var(--ease);
}
.method-step:hover .method-step__num { background: var(--gr); color: #fff; box-shadow: var(--sh-glow-sm); transform: scale(1.06); }

.method-step__phase { font-size: .68rem; font-weight: 700; color: var(--or); text-transform: uppercase; letter-spacing: .1em; margin-bottom: 4px; }
.method-step__t  { font-size: 1.2rem; font-weight: 600; color: var(--nv); margin-bottom: 8px; }
.method-step__tx { font-size: .85rem; color: var(--sl); line-height: 1.7; font-weight: 300; margin-bottom: 12px; }

.method-step__pills { display: flex; flex-wrap: wrap; gap: 6px; }
.method-step__pill {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 12px; font-size: .72rem; font-weight: 500;
  color: var(--or); background: rgba(254,96,0,.04);
  border: 1px solid rgba(254,96,0,.08); border-radius: 100px;
  transition: all .2s var(--ease);
}
.method-step__pill:hover { background: rgba(254,96,0,.08); border-color: rgba(254,96,0,.15); }

@media (max-width: 640px) {
  .method-step { grid-template-columns: 48px 1fr; gap: 16px; }
  .method-step__num { width: 48px; height: 48px; font-size: 1.2rem; border-radius: 12px; }
  .method-step:not(:last-child)::after { left: 23px; top: 56px; }
}


/* 14c. Guiding principles — 3×2 feature cards */
.pr-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

.pr-card {
  background: rgba(255,255,255,.55); backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border: 1px solid rgba(255,255,255,.6);
  border-radius: 16px; padding: 28px 24px;
  position: relative; overflow: hidden;
  transition: all .4s var(--ease);
  box-shadow:0 2px 12px rgba(20,20,37,.03);
}
.pr-card::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0;
  height: 3px; background: var(--gr);
  transform: scaleX(0); transform-origin: left;
  transition: transform .4s var(--ease);
}
.pr-card:hover { background:rgba(255,255,255,.82); border-color: rgba(254,96,0,.12); box-shadow: 0 12px 36px rgba(20,20,37,.07); transform: translateY(-3px); }
.pr-card:hover::after { transform: scaleX(1); }
.pr-card:hover .pr-card__ic { background: var(--gr); color: #fff; box-shadow: var(--sh-glow-sm); }

.pr-card__header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 20px; }
.pr-card__num { font-size: 2.8rem; font-weight: 700; line-height: 1; color: rgba(254,96,0,.08); letter-spacing: -.04em; transition: color .4s var(--ease); }
.pr-card:hover .pr-card__num { color: rgba(254,96,0,.15); }

.pr-card__ic { width: 48px; height: 48px; border-radius: 14px; flex-shrink: 0; background: linear-gradient(135deg, rgba(254,163,0,.08), rgba(254,96,0,.04)); display: flex; align-items: center; justify-content: center; color: var(--or); transition: all .4s var(--ease); }
.pr-card__ic svg { width: 22px; height: 22px; }

.pr-card__t  { font-size: 1.05rem; font-weight: 600; color: var(--nv); margin-bottom: 10px; }
.pr-card__tx { font-size: .85rem; color: var(--sl); line-height: 1.65; font-weight: 300; }

@media (max-width: 1024px) { .pr-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px)  { .pr-grid { grid-template-columns: 1fr; gap: 12px; } .pr-card { padding: 22px 20px; } }


/* 14d. Dark CTA banner */
.cta-box {
  background: linear-gradient(135deg, #141425 0%, #1E1E36 100%);
  border-radius: 24px; padding: 40px clamp(40px, 5vw, 64px);
  position: relative; overflow: hidden;
  box-shadow: 0 24px 64px rgba(20,20,37,.15);
  text-align: center;
}
.cta-box__dot-grid { position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(254,96,0,.06) 1px, transparent 1px); background-size: 36px 36px; opacity: .5; pointer-events: none; }
.cta-box__glow { position: absolute; top: -40%; right: -8%; z-index: 1; width: 420px; height: 420px; border-radius: 50%; background: radial-gradient(circle, rgba(254,96,0,.09), transparent 65%); pointer-events: none; }
.cta-box__inner { position: relative; z-index: 2; max-width: 100%; margin: 0 auto; }
.cta-box__t { font-size: clamp(1.5rem, 2.6vw, 2.1rem); font-weight: 300; color: #fff; line-height: 1.2; margin-bottom: 14px; }
.cta-box__t strong { font-weight: 700; }
.cta-box__tx { font-size: .95rem; color: rgba(255,255,255,.5); font-weight: 300; line-height: 1.7; margin-bottom: 32px; }
.cta-box__acts { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; }
.cta-box__ghost { background: transparent; color: rgba(255,255,255,.75); border: 1.5px solid rgba(255,255,255,.2); }
.cta-box__ghost:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.4); color: #fff; transform: translateY(-2px); }
@media (max-width: 480px) { .cta-box__acts { flex-direction: column; } .cta-box__acts .btn { width: 100%; justify-content: center; } }
/* ═══ Light accent color tints for icon backgrounds ═══ */
.feat-card:nth-child(1) .feat-card__ic{background:rgba(254,96,0,.06);color:#e85d04}
.feat-card:nth-child(2) .feat-card__ic{background:rgba(79,70,229,.06);color:#4f46e5}
.feat-card:nth-child(3) .feat-card__ic{background:rgba(16,185,129,.06);color:#059669}
.feat-card:nth-child(4) .feat-card__ic{background:rgba(244,63,94,.06);color:#e11d48}
.feat-card:nth-child(5) .feat-card__ic{background:rgba(8,145,178,.06);color:#0891b2}
.feat-card:nth-child(6) .feat-card__ic{background:rgba(139,92,246,.06);color:#7c3aed}

/* Val-pill colored icons */
.val-pill:nth-child(1) .val-pill__ic{background:rgba(254,96,0,.06);color:#e85d04}
.val-pill:nth-child(2) .val-pill__ic{background:rgba(79,70,229,.06);color:#4f46e5}
.val-pill:nth-child(3) .val-pill__ic{background:rgba(16,185,129,.06);color:#059669}
.val-pill:nth-child(4) .val-pill__ic{background:rgba(244,63,94,.06);color:#e11d48}
.val-pill:nth-child(5) .val-pill__ic{background:rgba(8,145,178,.06);color:#0891b2}
.val-pill:nth-child(6) .val-pill__ic{background:rgba(139,92,246,.06);color:#7c3aed}

/* Val-pill top accent colors on hover */
.val-pill:nth-child(1):hover::before{background:linear-gradient(90deg,transparent,rgba(254,96,0,.3),transparent)}
.val-pill:nth-child(2):hover::before{background:linear-gradient(90deg,transparent,rgba(79,70,229,.3),transparent)}
.val-pill:nth-child(3):hover::before{background:linear-gradient(90deg,transparent,rgba(16,185,129,.3),transparent)}
.val-pill:nth-child(4):hover::before{background:linear-gradient(90deg,transparent,rgba(244,63,94,.3),transparent)}
.val-pill:nth-child(5):hover::before{background:linear-gradient(90deg,transparent,rgba(8,145,178,.3),transparent)}
.val-pill:nth-child(6):hover::before{background:linear-gradient(90deg,transparent,rgba(139,92,246,.3),transparent)}

/* Val-pill label dot colors */
.val-pill:nth-child(1):hover .val-pill__label::before{background:#e85d04}
.val-pill:nth-child(2):hover .val-pill__label::before{background:#4f46e5}
.val-pill:nth-child(3):hover .val-pill__label::before{background:#059669}
.val-pill:nth-child(4):hover .val-pill__label::before{background:#e11d48}
.val-pill:nth-child(5):hover .val-pill__label::before{background:#0891b2}
.val-pill:nth-child(6):hover .val-pill__label::before{background:#7c3aed}

/* ms-focus-card colored icons */
.ms-focus-card:nth-child(1) .ms-focus-card__ic{background:rgba(8,145,178,.06);color:#0891b2}
.ms-focus-card:nth-child(2) .ms-focus-card__ic{background:rgba(244,63,94,.06);color:#e11d48}
.ms-focus-card:nth-child(3) .ms-focus-card__ic{background:rgba(79,70,229,.06);color:#4f46e5}

/* ms-focus-card hover icon fills */
.ms-focus-card:nth-child(1):hover .ms-focus-card__ic{background:#0891b2;color:#fff;box-shadow:0 4px 14px rgba(8,145,178,.2)}
.ms-focus-card:nth-child(2):hover .ms-focus-card__ic{background:#e11d48;color:#fff;box-shadow:0 4px 14px rgba(244,63,94,.2)}
.ms-focus-card:nth-child(3):hover .ms-focus-card__ic{background:#4f46e5;color:#fff;box-shadow:0 4px 14px rgba(79,70,229,.2)}

/* ms-pillar colored icons */
.ms-pillar:nth-child(1) .ms-pillar__ic{background:rgba(254,96,0,.06);color:#e85d04}
.ms-pillar:nth-child(2) .ms-pillar__ic{background:rgba(16,185,129,.06);color:#059669}
.ms-pillar:nth-child(3) .ms-pillar__ic{background:rgba(8,145,178,.06);color:#0891b2}
.ms-pillar:nth-child(4) .ms-pillar__ic{background:rgba(79,70,229,.06);color:#4f46e5}

/* ms-pillar hover icon fills */
.ms-pillar:nth-child(1):hover .ms-pillar__ic{background:#e85d04;color:#fff;box-shadow:0 4px 14px rgba(254,96,0,.2)}
.ms-pillar:nth-child(2):hover .ms-pillar__ic{background:#059669;color:#fff;box-shadow:0 4px 14px rgba(16,185,129,.2)}
.ms-pillar:nth-child(3):hover .ms-pillar__ic{background:#0891b2;color:#fff;box-shadow:0 4px 14px rgba(8,145,178,.2)}
.ms-pillar:nth-child(4):hover .ms-pillar__ic{background:#4f46e5;color:#fff;box-shadow:0 4px 14px rgba(79,70,229,.2)}

/* method-principle colored icons */
.method-principles .method-principle:nth-child(1) .method-principle__ic{background:rgba(254,96,0,.06);color:#e85d04}
.method-principles .method-principle:nth-child(2) .method-principle__ic{background:rgba(8,145,178,.06);color:#0891b2}
.method-principles .method-principle:nth-child(3) .method-principle__ic{background:rgba(16,185,129,.06);color:#059669}
.method-principles .method-principle:nth-child(4) .method-principle__ic{background:rgba(79,70,229,.06);color:#4f46e5}
.method-principles .method-principle:nth-child(5) .method-principle__ic{background:rgba(244,63,94,.06);color:#e11d48}
.method-principles .method-principle:nth-child(6) .method-principle__ic{background:rgba(139,92,246,.06);color:#7c3aed}


/* ═══ Company Overview Components ═══ */

/* Intro — reuses val-intro pattern */
.co-intro{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.co-intro__card{background:var(--wh);border-radius:20px;padding:36px 32px;position:relative;box-shadow:0 2px 12px rgba(20,20,37,.04)}
.co-intro__qmark{position:absolute;top:12px;left:20px;font-size:4rem;font-weight:900;color:rgba(254,96,0,.08);font-family:Georgia,serif;line-height:1;pointer-events:none}
.co-intro__quote{font-size:clamp(1.2rem,2vw,1.7rem);font-weight:300;color:var(--nv);line-height:1.45;position:relative;z-index:2}
.co-intro__quote strong{font-weight:700}
.co-intro__body{font-size:.92rem;color:var(--sl);line-height:1.8;font-weight:300}
.co-intro__body p{margin-bottom:14px}.co-intro__body p:last-child{margin-bottom:0}

/* Company details — 3x2 grid */
.co-details{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.co-detail{display:flex;align-items:flex-start;gap:14px;padding:24px 22px;background:var(--wh);border:1px solid var(--sv);border-radius:16px;transition:all .35s var(--ease)}
.co-detail:hover{border-color:transparent;box-shadow:0 8px 28px rgba(20,20,37,.06);transform:translateY(-2px)}
.co-detail__ic{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.co-detail__ic svg{width:18px;height:18px}
.co-detail__ic--orange{background:rgba(254,96,0,.06);color:#e85d04}
.co-detail__ic--indigo{background:rgba(79,70,229,.06);color:#4f46e5}
.co-detail__ic--green{background:rgba(16,185,129,.06);color:#059669}
.co-detail__ic--rose{background:rgba(244,63,94,.06);color:#e11d48}
.co-detail__ic--cyan{background:rgba(8,145,178,.06);color:#0891b2}
.co-detail__ic--violet{background:rgba(139,92,246,.06);color:#7c3aed}
.co-detail__t{font-size:.72rem;font-weight:700;color:var(--or);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
.co-detail__v{font-size:.88rem;color:var(--nv);font-weight:500;line-height:1.45}

/* Responsive */
@media(max-width:1024px){
  .co-intro{grid-template-columns:1fr;gap:28px}
  .co-details{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .co-details{grid-template-columns:1fr}
}
/* Canvas overlap — next section content above canvas */
.ab-hero + section{position:relative;z-index:2}
.ab-hero + .ms-statement{position:relative;z-index:2}

@media(max-width:1024px){
  .ab-hero__in{grid-template-columns:1fr;gap:20px}
  .ab-hero__right{height:220px;margin-bottom:-60px}
  .ab-hero__right canvas{height:calc(100% + 60px)}
}
@media(max-width:640px){
  .ab-hero__right{display:none;margin-bottom:0}

}

/* ── Feature Grid ── */
@keyframes featMesh{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.feat-wrap{border-radius:24px;overflow:hidden;padding:28px;background:linear-gradient(135deg,#FFF7EE 0%,#F5F0FF 20%,#EEFAF4 40%,#FFF0F3 60%,#EEF8FF 80%,#F8F0FF 100%);background-size:300% 300%;animation:featMesh 14s ease infinite;position:relative}
.feat-wrap::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(20,20,37,.02) 1px,transparent 1px);background-size:24px 24px;pointer-events:none;z-index:1}
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;position:relative;z-index:2}
.feat-card{padding:24px 22px;background:rgba(255,255,255,.6);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.65);border-radius:16px;box-shadow:0 2px 12px rgba(20,20,37,.03);transition:all .4s var(--ease);text-decoration:none;display:block;color:inherit}
.feat-card:hover{background:rgba(255,255,255,.82);box-shadow:0 12px 36px rgba(20,20,37,.07);transform:translateY(-3px)}
.feat-card__ic{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;transition:all .35s var(--ease);box-shadow:0 2px 8px rgba(20,20,37,.03)}
.feat-card:hover .feat-card__ic{transform:scale(1.08)}
.feat-card__ic svg{width:22px;height:22px}
.feat-card__t{font-size:1.05rem;font-weight:600;color:var(--nv);margin-bottom:8px}
.feat-card__tx{font-size:.84rem;color:var(--sl);line-height:1.65;font-weight:300}
@media(max-width:1024px){.feat-grid{grid-template-columns:1fr 1fr}.feat-wrap{padding:20px}}
@media(max-width:640px){.feat-grid{grid-template-columns:1fr}.feat-wrap{padding:14px;border-radius:16px}}

/* ── Methodology — Steps ── */
.method-flow{position:relative;max-width:800px;margin:0 auto}
.method-step{display:grid;grid-template-columns:64px 1fr;gap:24px;margin-bottom:48px;position:relative}
.method-step:not(:last-child)::after{content:'';position:absolute;left:31px;top:72px;bottom:-48px;width:2px;background:linear-gradient(180deg,var(--or),rgba(254,96,0,.08))}
.method-step:last-child{margin-bottom:0}
.method-step__num{width:64px;height:64px;border-radius:16px;background:rgba(254,96,0,.05);display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;color:var(--or);flex-shrink:0;position:relative;z-index:2;border:1px solid rgba(254,96,0,.06);transition:all .4s var(--ease);box-shadow:0 2px 8px rgba(254,96,0,.04)}
.method-step:hover .method-step__num{background:var(--gr);color:#fff;box-shadow:var(--sh-glow-sm);transform:scale(1.06)}
.method-step__phase{font-size:.68rem;font-weight:700;color:var(--or);text-transform:uppercase;letter-spacing:.1em;margin-bottom:4px}
.method-step__t{font-size:1.2rem;font-weight:600;color:var(--nv);margin-bottom:8px}
.method-step__tx{font-size:.85rem;color:var(--sl);line-height:1.7;font-weight:300;margin-bottom:12px}
.method-step__pills{display:flex;flex-wrap:wrap;gap:6px}
.method-step__pill{display:inline-flex;padding:4px 12px;font-size:.72rem;font-weight:500;color:var(--or);background:rgba(254,96,0,.04);border:1px solid rgba(254,96,0,.08);border-radius:100px;transition:all .2s var(--ease)}
.method-step__pill:hover{background:rgba(254,96,0,.08);border-color:rgba(254,96,0,.15)}
.pr-wrap{position:relative;border-radius:24px;overflow:hidden;padding:36px 32px;background:linear-gradient(135deg,#EEF8FF 0%,#F5F0FF 20%,#EEFAF4 40%,#FFF7EE 60%,#FFF0F3 80%,#F0FDFE 100%);background-size:300% 300%;animation:meshDrift 14s ease infinite}
.pr-wrap::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(20,20,37,.025) 1px,transparent 1px);background-size:24px 24px;pointer-events:none;z-index:1}
.method-principles{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.method-principle{padding:28px 24px;background:var(--wh);border:1px solid var(--sv);border-radius:14px;text-align:center;transition:all .4s var(--ease)}
.method-principle:hover{border-color:transparent;box-shadow:var(--sh-hover);transform:translateY(-4px)}
.method-principle__ic{width:56px;height:56px;border-radius:14px;background:rgba(254,96,0,.05);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;color:var(--or);transition:all .4s var(--ease);box-shadow:0 2px 8px rgba(254,96,0,.04)}
.method-principle:hover .method-principle__ic{background:var(--gr);color:#fff;box-shadow:var(--sh-glow-sm)}
.method-principle__ic svg{width:24px;height:24px}
.method-principle__t{font-size:1.1rem;font-weight:600;color:var(--nv);margin-bottom:6px}
.method-principle__tx{font-size:.85rem;color:var(--sl);line-height:1.65;font-weight:300}

/* ── Responsive ── */
@media(max-width:1024px){
  .ab-hero--overview .ab-hero__in,
  .ab-hero--why .ab-hero__in,
  .ab-hero--method .ab-hero__in,
  .ab-hero--mission .ab-hero__in{grid-template-columns:1fr;gap:28px}
  .ab-hero__phases{grid-template-columns:repeat(3,1fr)}
  .feat-grid,.method-principles{grid-template-columns:1fr 1fr}
  .method-step{grid-template-columns:52px 1fr;gap:16px}
}
@media(max-width:768px){
  .feat-grid,.method-principles{grid-template-columns:1fr}
  .ab-hero__badges{gap:8px}
  .ab-hero__phases{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){

  .ab-hero__stat{padding:16px}
  .ab-hero__stat-val{font-size:1.2rem}
  .ab-hero__phases{grid-template-columns:repeat(2,1fr);gap:8px}
  .ab-hero__phase{padding:12px 10px}
  .ab-hero__proof-item{padding:12px 14px}
}

/* ═══ Interactive Circle — Explore More ═══ */
.ic-layout{display:grid;grid-template-columns:420px 1fr;gap:80px;align-items:center;max-width:900px;margin:0 auto}
.ic-content{min-height:180px}

.ic-circle{position:relative;width:420px;height:420px}
.ic-ring-outer{position:absolute;top:10px;left:10px;right:10px;bottom:10px;border-radius:50%;border:1px dashed rgba(254,96,0,.1)}
.ic-ring{position:absolute;top:30px;left:30px;right:30px;bottom:30px;border-radius:50%;border:1.5px solid rgba(254,96,0,.12);background:radial-gradient(circle,rgba(254,96,0,.015) 0%,transparent 70%)}
.ic-center-logo{position:absolute;top:50%;left:50%;width:72px;height:72px;margin:-36px 0 0 -36px;border-radius:16px;z-index:6;overflow:hidden;box-shadow:0 8px 32px rgba(254,96,0,.15);transition:transform .4s var(--ease);display:flex;align-items:center;justify-content:center;background:var(--wh)}
.ic-center-logo:hover{transform:scale(1.1)}
.ic-center-logo svg{width:100%;height:100%;display:block}
.ic-center-logo img,.ic-center-logo .ic-center-logo__img{width:100%;height:100%;object-fit:contain;display:block;border-radius:16px}

.ic-dot{position:absolute;width:64px;height:64px;border-radius:50%;background:var(--wh);border:2px solid var(--cl);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;transition:all .4s var(--ease);z-index:10;box-shadow:0 2px 10px rgba(20,20,37,.05)}
.ic-dot::before{content:'';position:absolute;inset:-8px;border-radius:50%;background:var(--wh);z-index:-1;border:2px solid var(--cl);transition:border-color .4s var(--ease)}
.ic-dot svg{width:18px;height:18px;color:var(--sl);transition:all .3s var(--ease);stroke-width:1.6}
.ic-dot__name{font-size:.5rem;font-weight:700;color:var(--sl);text-transform:uppercase;letter-spacing:.03em;transition:color .3s var(--ease);line-height:1}
.ic-dot:hover{border-color:rgba(254,96,0,.2);box-shadow:0 4px 20px rgba(20,20,37,.1);transform:scale(1.08)}

.ic-dot.active{border-color:transparent}
.ic-dot.active::before{border-color:transparent}
.ic-dot.active .ic-dot__name{font-weight:800}

.ic-dot[data-i="0"].active{background:rgba(254,96,0,.08);border-color:rgba(254,96,0,.12);box-shadow:0 4px 20px rgba(254,96,0,.12)}
.ic-dot[data-i="0"].active svg{color:#e85d04}.ic-dot[data-i="0"].active .ic-dot__name{color:#e85d04}
.ic-dot[data-i="0"].active::before{background:rgba(254,96,0,.02);border-color:rgba(254,96,0,.06)}

.ic-dot[data-i="1"].active{background:rgba(79,70,229,.08);border-color:rgba(79,70,229,.12);box-shadow:0 4px 20px rgba(79,70,229,.12)}
.ic-dot[data-i="1"].active svg{color:#4f46e5}.ic-dot[data-i="1"].active .ic-dot__name{color:#4f46e5}
.ic-dot[data-i="1"].active::before{background:rgba(79,70,229,.02);border-color:rgba(79,70,229,.06)}

.ic-dot[data-i="2"].active{background:rgba(5,150,105,.08);border-color:rgba(5,150,105,.12);box-shadow:0 4px 20px rgba(5,150,105,.12)}
.ic-dot[data-i="2"].active svg{color:#059669}.ic-dot[data-i="2"].active .ic-dot__name{color:#059669}
.ic-dot[data-i="2"].active::before{background:rgba(5,150,105,.02);border-color:rgba(5,150,105,.06)}

.ic-dot[data-i="3"].active{background:rgba(225,29,72,.08);border-color:rgba(225,29,72,.12);box-shadow:0 4px 20px rgba(225,29,72,.12)}
.ic-dot[data-i="3"].active svg{color:#e11d48}.ic-dot[data-i="3"].active .ic-dot__name{color:#e11d48}
.ic-dot[data-i="3"].active::before{background:rgba(225,29,72,.02);border-color:rgba(225,29,72,.06)}

.ic-dot[data-i="4"].active{background:rgba(8,145,178,.08);border-color:rgba(8,145,178,.12);box-shadow:0 4px 20px rgba(8,145,178,.12)}
.ic-dot[data-i="4"].active svg{color:#0891b2}.ic-dot[data-i="4"].active .ic-dot__name{color:#0891b2}
.ic-dot[data-i="4"].active::before{background:rgba(8,145,178,.02);border-color:rgba(8,145,178,.06)}

.ic-dot[data-i="5"].active{background:rgba(217,119,6,.08);border-color:rgba(217,119,6,.12);box-shadow:0 4px 20px rgba(217,119,6,.12)}
.ic-dot[data-i="5"].active svg{color:#d97706}.ic-dot[data-i="5"].active .ic-dot__name{color:#d97706}
.ic-dot[data-i="5"].active::before{background:rgba(217,119,6,.02);border-color:rgba(217,119,6,.06)}

.ic-content{min-height:180px}
.ic-content__ey{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px;transition:color .4s var(--ease)}
.ic-content__title{font-size:clamp(1.3rem,2.2vw,1.8rem);font-weight:700;color:var(--nv);line-height:1.2;margin-bottom:12px}
.ic-content__desc{font-size:.92rem;color:var(--sl);font-weight:300;line-height:1.75;margin-bottom:24px;max-width:400px}
.ic-content__btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--ft);font-weight:600;font-size:.85rem;height:44px;padding:0 28px;border-radius:8px;border:none;cursor:pointer;transition:all .3s var(--ease);color:#fff}
.ic-content__btn:hover{transform:translateY(-2px);box-shadow:0 6px 24px rgba(0,0,0,.15)}
.ic-content__btn svg{width:14px;height:14px;transition:transform .25s var(--ease)}
.ic-content__btn:hover svg{transform:translateX(3px)}

@keyframes icFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.ic-content.animate{animation:icFade .35s var(--ease)}

@media(max-width:1024px){
  .ic-layout{grid-template-columns:1fr;justify-items:center;text-align:center;gap:48px;max-width:100%}
  .ic-circle{width:360px;height:360px}
  .ic-content__desc{margin:0 auto 24px}
}
@media(max-width:480px){
  .ic-circle{width:300px;height:300px}
  .ic-dot{width:54px;height:54px}
  .ic-dot svg{width:16px;height:16px}
  .ic-dot__name{font-size:.45rem}
}

/* ═══════════════════════════════════════════
   Partners Pages
   ═══════════════════════════════════════════ */
.ptr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:20px;margin-top:32px}
.ptr-grid--sm{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.ptr-card{display:flex;align-items:center;gap:20px;padding:24px;background:var(--wh);border:1px solid var(--sv);border-radius:16px;text-decoration:none;transition:all .3s var(--ease)}
.ptr-card:hover{border-color:rgba(254,96,0,.2);box-shadow:var(--sh-hover);transform:translateY(-3px)}
.ptr-card__logo{width:56px;height:56px;border-radius:14px;background:var(--mi);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ptr-card__logo-icon{width:28px;height:28px;color:var(--or)}
.ptr-card__logo-icon svg{width:100%;height:100%}
.ptr-card__body{flex:1;min-width:0}
.ptr-card__name{font-size:1rem;font-weight:700;color:var(--nv);margin-bottom:2px}
.ptr-card__tier{font-size:.7rem;font-weight:600;color:var(--or);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.ptr-card__desc{font-size:.82rem;color:var(--sl);font-weight:300;line-height:1.5}
.ptr-card__arrow{width:32px;height:32px;border-radius:50%;background:rgba(254,96,0,.05);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s}
.ptr-card__arrow svg{width:16px;height:16px;color:var(--or)}
.ptr-card:hover .ptr-card__arrow{background:var(--or)}
.ptr-card:hover .ptr-card__arrow svg{color:#fff}

/* Partner hero badge */
.ptr-hero-badge{display:flex;align-items:center;gap:20px;margin-bottom:16px}
.ptr-hero-badge__icon{width:64px;height:64px;border-radius:16px;background:var(--mi);border:1px solid var(--cl);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ptr-hero-badge__icon svg{width:32px;height:32px;color:var(--or)}
.ptr-hero-badge__tier{font-size:.68rem;font-weight:700;color:var(--or);text-transform:uppercase;letter-spacing:.08em}
.ptr-hero-badge__name{font-size:clamp(1.8rem,3vw,2.6rem);font-weight:800;color:var(--nv);line-height:1.15}

/* Partner overview */
.ptr-overview{max-width:760px;font-size:.95rem;color:var(--ch);font-weight:300;line-height:1.8;margin-bottom:40px}

/* Capabilities grid */
.ptr-caps-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin-top:32px}
.ptr-cap{display:flex;gap:14px;padding:20px;background:var(--mi);border:1px solid var(--cl);border-radius:14px;transition:all .3s var(--ease)}
.ptr-cap:hover{border-color:rgba(254,96,0,.15);background:var(--wh)}
.ptr-cap__icon{width:36px;height:36px;border-radius:10px;background:rgba(254,96,0,.06);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ptr-cap__icon svg{width:18px;height:18px;color:var(--or)}
.ptr-cap__title{font-size:.9rem;font-weight:700;color:var(--nv);margin-bottom:4px}
.ptr-cap__desc{font-size:.82rem;color:var(--sl);font-weight:300;line-height:1.5}

/* Certifications */
.ptr-certs{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.ptr-cert{display:flex;align-items:center;gap:10px;padding:12px 20px;background:var(--wh);border:1px solid var(--cl);border-radius:10px}
.ptr-cert__icon{width:28px;height:28px;color:var(--or);flex-shrink:0}
.ptr-cert__icon svg{width:100%;height:100%}
.ptr-cert__name{font-size:.82rem;font-weight:600;color:var(--nv)}

@media(max-width:640px){
  .ptr-grid,.ptr-caps-grid{grid-template-columns:1fr}
  .ptr-hero-badge__icon{width:48px;height:48px}
  .ptr-hero-badge__icon svg{width:24px;height:24px}
}

/* ═══ Partner Hero — Letter Reveal ═══ */
.ptr-hero-reveal{position:relative;overflow:hidden}
.ptr-ribbons{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.ptr-ribbon{position:absolute;left:-100%;width:200%;height:2px;background:linear-gradient(90deg,transparent,rgba(254,96,0,.08),rgba(254,163,0,.06),transparent);animation:ptr-ribbon-flow var(--dur,12s) linear infinite;opacity:.6}
@keyframes ptr-ribbon-flow{from{transform:translateX(0)}to{transform:translateX(50%)}}

.ptr-headline{font-size:clamp(2.6rem,6vw,4.5rem);font-weight:900;color:var(--nv);line-height:1;margin-bottom:20px;overflow:hidden;text-align:center}
.ptr-headline__line{display:block}
.ptr-headline__line--gr .ptr-letter{background:var(--gr);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.ptr-letter{display:inline-block;opacity:0;transform:translateY(100%);animation:ptr-letter-up .4s cubic-bezier(.16,1,.3,1) forwards}
@keyframes ptr-letter-up{to{opacity:1;transform:translateY(0)}}

.ptr-desc{text-align:center;max-width:540px;margin:0 auto 20px;opacity:0;animation:ptr-fade-up .6s ease forwards 1.4s}
@keyframes ptr-fade-up{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

.ptr-partner-line{display:flex;align-items:center;justify-content:center;gap:20px;margin-bottom:28px;opacity:0;animation:ptr-fade-up .6s ease forwards 1.6s;flex-wrap:wrap}
.ptr-pname{font-size:.82rem;font-weight:600;color:var(--sv);transition:.3s;cursor:default;position:relative}
.ptr-pname::after{content:'';position:absolute;bottom:-3px;left:0;width:0;height:2px;background:var(--or);transition:.3s}
.ptr-pname:hover{color:var(--or)}
.ptr-pname:hover::after{width:100%}
.ptr-sep{width:4px;height:4px;border-radius:50%;background:var(--sv);flex-shrink:0}

.ptr-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;opacity:0;animation:ptr-fade-up .6s ease forwards 1.8s}

/* ═══ Partner Single Hero — Blueprint ═══ */
.bp-hero{position:relative;overflow:hidden}
.bp-grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(254,96,0,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(254,96,0,.03) 1px,transparent 1px);background-size:48px 48px;pointer-events:none;z-index:0}
.bp-grid-bg::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 60% 40%,transparent 30%,var(--wh) 75%)}
.bp-inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.bp-content{position:relative;z-index:2}

/* Blueprint nodes */
.bp-nodes{position:relative;height:420px}
.bp-node{position:absolute;display:flex;align-items:center;gap:10px;opacity:0;animation:bp-appear .6s ease forwards}
.bp-node:nth-child(3){top:2%;left:15%;animation-delay:.3s}
.bp-node:nth-child(4){top:19%;left:35%;animation-delay:.6s}
.bp-node:nth-child(5){top:36%;left:8%;animation-delay:.9s}
.bp-node:nth-child(6){top:53%;left:32%;animation-delay:1.2s}
.bp-node:nth-child(7){top:70%;left:12%;animation-delay:1.5s}
.bp-node:nth-child(8){top:85%;left:38%;animation-delay:1.8s}
@keyframes bp-appear{from{opacity:0;transform:translateX(-16px)}to{opacity:1;transform:translateX(0)}}

.bp-node__pin{width:12px;height:12px;border-radius:50%;border:2px solid var(--or);background:var(--wh);position:relative;flex-shrink:0}
.bp-node__pin::after{content:'';position:absolute;inset:-6px;border-radius:50%;border:1px dashed rgba(254,96,0,.15)}
.bp-node__card{background:var(--wh);border:1px solid var(--cl);border-radius:10px;padding:14px 18px;box-shadow:0 4px 16px rgba(0,0,0,.03);transition:.3s;position:relative}
.bp-node__card::before{content:'';position:absolute;left:-14px;top:50%;transform:translateY(-50%);width:14px;height:1px;background:rgba(254,96,0,.15)}
.bp-node__card:hover{border-color:rgba(254,96,0,.2);transform:translateX(4px)}
.bp-node__name{font-size:.85rem;font-weight:700;color:var(--nv)}
.bp-node__desc{font-size:.68rem;color:var(--sl);margin-top:3px;line-height:1.4;max-width:220px}

/* Dimension line */
.bp-dim{position:absolute;z-index:1}
.bp-dim--v{left:8%;top:2%;bottom:12%;width:1px;background:rgba(254,96,0,.08)}
.bp-dim--v::before,.bp-dim--v::after{content:'';position:absolute;left:-3px;width:7px;height:1px;background:rgba(254,96,0,.12)}
.bp-dim--v::before{top:0}.bp-dim--v::after{bottom:0}
.bp-dim-label{position:absolute;left:1%;top:45%;font-size:.5rem;font-weight:600;color:rgba(254,96,0,.2);text-transform:uppercase;letter-spacing:.1em;transform:rotate(-90deg);transform-origin:center;white-space:nowrap}

@media(max-width:768px){
  .bp-inner{grid-template-columns:1fr}
  .bp-nodes{display:none}
}