:root {
  --bg:#070a0f;
  --bg2:#0b1018;
  --panel:#101722;
  --panel2:#141d2b;
  --text:#f5f7fb;
  --muted:#9ca9bb;
  --soft:#cbd3df;
  --line:rgba(255,255,255,.105);
  --line2:rgba(92,225,230,.28);
  --accent:#5ce1e6;
  --accent2:#6687ff;
  --green:#7df4d0;
  --max:1360px;
  --radius:24px;
  --shadow:0 30px 90px rgba(0,0,0,.28);
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
}

body {
  margin:0;
  background:
    radial-gradient(circle at 78% 8%,rgba(54,90,255,.11),transparent 26rem),
    radial-gradient(circle at 8% 28%,rgba(92,225,230,.07),transparent 24rem),
    var(--bg);
  color:var(--text);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.55;
  overflow-x:hidden;
}

img {
  display:block;
  max-width:100%;
}

a {
  color:inherit;
  text-decoration:none;
}

button,
input,
select {
  font:inherit;
}

button {
  color:inherit;
}

.section-shell {
  width:min(var(--max),calc(100% - 48px));
  margin-inline:auto;
  padding-block:104px;
}

.kicker,
.eyebrow {
  color:var(--accent);
  font-size:11px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.section-heading {
  max-width:820px;
  margin-bottom:42px;
}

.section-heading.compact {
  margin-bottom:30px;
}

.section-heading h2 {
  margin:12px 0 14px;
  font-family:"Space Grotesk",Inter,sans-serif;
  font-size:clamp(34px,4vw,58px);
  line-height:1.03;
  letter-spacing:-.045em;
}

.section-heading p {
  max-width:760px;
  color:var(--muted);
  font-size:16px;
}

/* HEADER */

.site-header {
  position:sticky;
  top:0;
  z-index:100;
  min-height:76px;
  display:flex;
  align-items:center;
  gap:26px;
  padding-inline:max(24px,calc((100vw - var(--max))/2));
  background:rgba(7,10,15,.82);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(18px);
}

.brand {
  display:flex;
  align-items:center;
  gap:11px;
  white-space:nowrap;
}

.brand-mark {
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:13px;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#041016;
  font-family:"Space Grotesk",Inter,sans-serif;
  font-weight:800;
  font-size:21px;
}

.brand strong,
.brand small {
  display:block;
}

.brand strong {
  font-family:"Space Grotesk",Inter,sans-serif;
  font-size:15px;
}

.brand small {
  color:var(--muted);
  font-size:9px;
}

.desktop-nav {
  display:flex;
  gap:22px;
  margin-left:auto;
}

.desktop-nav a,
.footer-nav a {
  color:#c3cbd7;
  font-size:12px;
}

.desktop-nav a:hover,
.footer-nav a:hover {
  color:white;
}

.lang-switch {
  display:flex;
  align-items:center;
  gap:3px;
  padding:3px;
  border:1px solid var(--line);
  border-radius:999px;
}

.lang-option {
  padding:5px 7px;
  border-radius:999px;
  color:var(--muted);
  font-size:9px;
  font-weight:800;
}

.lang-option.active {
  background:white;
  color:#07101a;
}

.menu-toggle,
.mobile-menu,
.mobile-lang {
  display:none;
}

/* BUTTONS */

.btn {
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 20px;
  border:1px solid var(--line);
  border-radius:13px;
  font-size:13px;
  font-weight:800;
  transition:transform .2s ease,border-color .2s ease,background .2s ease;
}

.btn:hover {
  transform:translateY(-2px);
}

.btn-primary {
  background:linear-gradient(135deg,var(--accent),var(--green));
  border-color:transparent;
  color:#041014;
  box-shadow:0 10px 34px rgba(92,225,230,.14);
}

.btn-ghost {
  background:rgba(255,255,255,.035);
}

/* HERO */

.hero {
  width:min(var(--max),calc(100% - 48px));
  margin-inline:auto;
  min-height:720px;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(440px,.88fr);
  gap:58px;
  align-items:center;
  padding-block:72px 82px;
}

.hero-grid {
  display:none;
}

.hero-copy {
  position:relative;
  z-index:2;
}

.pulse {
  display:inline-block;
  width:7px;
  height:7px;
  margin-right:8px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 7px rgba(92,225,230,.08);
}

.hero h1 {
  max-width:760px;
  margin:22px 0;
  font-family:"Space Grotesk",Inter,sans-serif;
  font-size:clamp(52px,6vw,84px);
  line-height:.98;
  letter-spacing:-.058em;
}

.hero h1 span {
  background:linear-gradient(90deg,var(--accent),#97aaff);
  -webkit-background-clip:text;
  color:transparent;
}

.hero-copy > p {
  max-width:680px;
  color:#b9c4d3;
  font-size:18px;
}

.hero-actions {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:30px 0;
}

.profile-pills {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.profile-pill {
  min-height:54px;
  padding:10px 13px;
  border:1px solid var(--line);
  border-radius:13px;
  background:rgba(255,255,255,.025);
  cursor:pointer;
  text-align:left;
}

.profile-pill span {
  display:block;
  margin-top:2px;
  color:var(--muted);
  font-size:9px;
}

.profile-pill.active,
.profile-pill:hover {
  border-color:rgba(92,225,230,.48);
  background:rgba(92,225,230,.065);
}

.hero-visual {
  display:grid;
  gap:14px;
  min-width:0;
}

.v11-hero-human {
  position:relative;
  margin:0;
  border-radius:26px;
  overflow:hidden;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  background:var(--panel);
}

.v11-hero-human img {
  width:100%;
  height:270px;
  object-fit:cover;
}

.v11-hero-human:after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 48%,rgba(7,10,15,.72));
  pointer-events:none;
}

.v11-hero-human figcaption {
  position:absolute;
  z-index:2;
  left:18px;
  bottom:16px;
}

.v11-hero-human figcaption span {
  display:inline-flex;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  background:rgba(7,10,15,.7);
  backdrop-filter:blur(10px);
  font-size:9px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.terminal-card {
  position:relative;
  padding:24px;
  border:1px solid var(--line);
  border-radius:24px;
  background:linear-gradient(180deg,rgba(18,27,41,.96),rgba(11,17,27,.96));
  box-shadow:0 24px 60px rgba(0,0,0,.23);
  overflow:hidden;
}

.terminal-head,
.terminal-foot {
  display:flex;
  justify-content:space-between;
  gap:12px;
  color:var(--muted);
  font-size:10px;
}

.live {
  color:var(--accent);
  font-weight:900;
}

.metric-big {
  margin:28px 0 22px;
}

.metric-big small {
  display:block;
  color:var(--muted);
}

.metric-big strong {
  font:700 68px/1 "Space Grotesk",Inter,sans-serif;
  letter-spacing:-.07em;
}

.metric-big span {
  color:var(--muted);
}

.mini-bars {
  display:grid;
  gap:12px;
  margin:22px 0;
}

.mini-bars div {
  display:grid;
  grid-template-columns:92px 1fr 24px;
  gap:10px;
  align-items:center;
  font-size:9px;
}

.mini-bars i {
  height:5px;
  border-radius:99px;
  background:linear-gradient(
    90deg,
    var(--accent) var(--v),
    rgba(255,255,255,.08) var(--v)
  );
}

.terminal-foot {
  padding-top:15px;
  border-top:1px solid var(--line);
}

.terminal-foot strong {
  color:white;
}

/* TRUST */

.trust-strip {
  width:min(var(--max),calc(100% - 48px));
  margin-inline:auto;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border:1px solid var(--line);
  border-radius:20px;
  overflow:hidden;
  background:rgba(255,255,255,.025);
}

.trust-strip div {
  padding:22px 25px;
  border-right:1px solid var(--line);
}

.trust-strip div:last-child {
  border-right:0;
}

.trust-strip strong {
  display:block;
  font:700 27px "Space Grotesk",Inter,sans-serif;
}

.trust-strip span {
  color:var(--muted);
  font-size:11px;
}

/* HUMAN STORY */

.v11-human-story {
  padding-bottom:72px;
}

.v11-human-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}

.v11-human-card {
  position:relative;
  min-height:400px;
  border:1px solid var(--line);
  border-radius:22px;
  overflow:hidden;
  background:var(--panel);
}

.v11-human-card img {
  width:100%;
  height:100%;
  min-height:400px;
  object-fit:cover;
}

.v11-human-card:after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 32%,rgba(5,8,13,.94));
}

.v11-human-card > div {
  position:absolute;
  z-index:2;
  left:20px;
  right:20px;
  bottom:20px;
}

.v11-human-card span {
  color:var(--accent);
  font-size:9px;
  font-weight:900;
}

.v11-human-card strong {
  display:block;
  margin:5px 0;
  font:650 19px "Space Grotesk",Inter,sans-serif;
}

.v11-human-card p {
  margin:0;
  color:#bbc4d1;
  font-size:11px;
}

/* OBJECTIVES / JOURNEY */

.intent-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}

.intent {
  min-height:155px;
  padding:19px;
  text-align:left;
  border:1px solid var(--line);
  border-radius:17px;
  background:rgba(255,255,255,.025);
  cursor:pointer;
  transition:.2s;
}

.intent > span {
  color:var(--accent);
  font-size:9px;
}

.intent strong {
  display:block;
  margin:23px 0 5px;
  font:650 17px "Space Grotesk",Inter,sans-serif;
}

.intent small {
  color:var(--muted);
  font-size:10px;
}

.intent:hover,
.intent.active {
  transform:translateY(-3px);
  border-color:rgba(92,225,230,.48);
  background:linear-gradient(150deg,rgba(92,225,230,.09),rgba(102,135,255,.04));
}

.recommendation-panel {
  display:grid;
  grid-template-columns:1fr 1.25fr auto;
  gap:22px;
  align-items:center;
  margin-top:14px;
  padding:23px;
  border:1px solid var(--line2);
  border-radius:19px;
  background:rgba(92,225,230,.035);
}

.recommendation-panel h3 {
  margin:5px 0;
  font:650 21px "Space Grotesk",Inter,sans-serif;
}

.recommendation-panel p {
  margin:0;
  color:var(--muted);
  font-size:11px;
}

.rec-steps {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
}

.rec-steps span {
  padding:6px 8px;
  border:1px solid var(--line);
  border-radius:8px;
  font-size:9px;
}

.rec-steps i {
  color:var(--accent);
  font-style:normal;
}

/* COMMON GRIDS */

.vertical-grid,
.product-grid,
.built-grid,
.insight-grid {
  display:grid;
  gap:11px;
}

.vertical-grid {
  grid-template-columns:repeat(3,1fr);
}

.product-grid,
.built-grid {
  grid-template-columns:repeat(3,1fr);
}

.vertical-card,
.product-card,
.built-card,
.insight-grid article {
  padding:22px;
  border:1px solid var(--line);
  border-radius:19px;
  background:rgba(255,255,255,.025);
}

.vertical-card {
  min-height:230px;
  display:flex;
  flex-direction:column;
}

.vertical-card > span,
.product-card > span,
.built-card > span,
.insight-grid article > span {
  color:var(--accent);
  font-size:9px;
}

.vertical-card h3,
.product-card h3,
.built-card h3,
.insight-grid h3 {
  font-family:"Space Grotesk",Inter,sans-serif;
}

.vertical-card p,
.product-card p,
.built-card p,
.insight-grid p {
  color:var(--muted);
  font-size:12px;
}

.vertical-card a,
.product-card a {
  margin-top:auto;
  color:var(--accent);
}

/* OUTCOMES */

.outcome-tabs,
.tech-filters,
.industry-pills {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.outcome-tabs button,
.tech-filter,
.industry-pills button {
  padding:9px 13px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.025);
  cursor:pointer;
}

.outcome-tabs button.active,
.tech-filter.active {
  background:white;
  color:#07101a;
}

.outcome-stage {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:48px;
  padding-top:38px;
}

.outcome-copy h3 {
  font:650 34px "Space Grotesk",Inter,sans-serif;
}

.outcome-copy p {
  color:var(--muted);
}

.solution-list article {
  display:grid;
  grid-template-columns:32px 1fr 20px;
  gap:11px;
  align-items:center;
  padding:16px 0;
  border-bottom:1px solid var(--line);
}

.solution-list article > span,
.solution-list b {
  color:var(--accent);
}

.solution-list small {
  display:block;
  color:var(--muted);
}

/* RADAR */

.radar-layout {
  display:grid;
  grid-template-columns:.7fr 1.3fr;
  gap:18px;
}

.radar-score,
.opportunity-list {
  padding:25px;
  border:1px solid var(--line);
  border-radius:22px;
  background:rgba(255,255,255,.025);
}

.radar-score strong {
  display:block;
  margin:22px 0 0;
  font:700 88px/1 "Space Grotesk",Inter,sans-serif;
  letter-spacing:-.07em;
}

.radar-meter {
  height:7px;
  margin:18px 0 28px;
  overflow:hidden;
  border-radius:99px;
  background:rgba(255,255,255,.07);
}

.radar-meter i {
  display:block;
  width:var(--v);
  height:100%;
  background:linear-gradient(90deg,var(--accent),var(--accent2));
}

.opp-row {
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:18px;
  padding:15px 0;
  border-bottom:1px solid var(--line);
}

.opp-row:last-child {
  border-bottom:0;
}

.opp-row > div {
  display:flex;
  gap:10px;
}

.opp-row > div span {
  color:var(--accent);
}

.opp-row dl {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin:0;
}

.opp-row dt {
  color:var(--muted);
  font-size:8px;
  text-transform:uppercase;
}

.opp-row dd {
  margin:3px 0 0;
  font-size:10px;
}

/* TECH */

.tech-grid {
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:8px;
  margin-top:14px;
}

.tech-tile {
  min-height:82px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:13px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.02);
}

.tech-tile small {
  color:var(--muted);
  font-size:8px;
}

.tech-tile.is-hidden {
  display:none;
}

/* CASES */

.case-grid {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:10px;
}

.case-card {
  min-height:300px;
  display:flex;
  flex-direction:column;
  padding:20px;
  border:1px solid var(--line);
  border-radius:19px;
  background:rgba(255,255,255,.025);
}

.case-top {
  display:flex;
  justify-content:space-between;
}

.case-top > span {
  color:var(--accent);
}

.case-tags {
  display:flex;
  flex-wrap:wrap;
  gap:4px;
}

.case-tags b,
.cap-badges span {
  padding:4px 6px;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--muted);
  font-size:8px;
}

.case-card h3 {
  margin:32px 0 4px;
  font:700 23px "Space Grotesk",Inter,sans-serif;
}

.case-card > strong {
  color:var(--accent);
  font-size:10px;
}

.case-card p {
  flex:1;
  color:var(--muted);
  font-size:11px;
}

.case-card a {
  font-size:11px;
  font-weight:800;
}

/* CAPABILITIES */

.cap-stack {
  display:grid;
  gap:8px;
}

.cap-detail {
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,.022);
}

.cap-detail summary {
  cursor:pointer;
  display:grid;
  grid-template-columns:42px 1fr 25px;
  gap:8px;
  padding:17px 20px;
  align-items:center;
}

.cap-detail summary span {
  color:var(--accent);
}

.cap-detail summary strong {
  font-family:"Space Grotesk",Inter,sans-serif;
}

.cap-detail > div {
  padding:0 20px 20px 70px;
}

.cap-detail p {
  color:var(--muted);
}

.cap-badges {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:12px 0;
}

/* IMPACT */

.impact-flow {
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:8px;
}

.impact-flow article {
  padding:17px 11px;
  border-top:2px solid rgba(92,225,230,.32);
}

.impact-flow span {
  color:var(--accent);
  font-size:9px;
}

.impact-flow h3 {
  font-family:"Space Grotesk",Inter,sans-serif;
}

.impact-flow p {
  color:var(--muted);
  font-size:10px;
}

/* EVOLUTION */

.evolution-line {
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:8px;
}

.evolution-line article {
  padding-top:15px;
  border-top:2px solid rgba(92,225,230,.25);
}

.evolution-line span {
  color:var(--accent);
  font-size:10px;
}

.evolution-line strong {
  display:block;
  margin-top:7px;
  font-size:11px;
}

/* SON.IA + EXECUTIVE */

.executive {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:18px;
  align-items:start;
}

.v11-sonia {
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:260px 1fr;
  gap:24px;
  padding:16px;
  border:1px solid rgba(92,225,230,.3);
  border-radius:24px;
  background:
    linear-gradient(140deg,rgba(92,225,230,.07),rgba(102,135,255,.035));
}

.v11-sonia > img {
  width:100%;
  height:285px;
  object-fit:cover;
  border-radius:18px;
}

.v11-sonia-copy {
  align-self:center;
}

.v11-sonia-copy h3 {
  margin:8px 0;
  font:700 34px/1.05 "Space Grotesk",Inter,sans-serif;
  letter-spacing:-.035em;
}

.v11-sonia-copy > p {
  max-width:680px;
  color:var(--muted);
}

.v11-sonia-context {
  max-width:700px;
  margin:16px 0;
  padding:13px 15px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(5,8,13,.38);
}

.v11-sonia-context small {
  display:block;
  color:var(--accent);
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
}

.v11-sonia-context strong {
  display:block;
  margin-top:4px;
}

.v11-sonia-context p {
  margin:6px 0 0;
  color:var(--muted);
  font-size:11px;
}

.executive-copy,
.lead-form {
  padding:25px;
  border:1px solid var(--line);
  border-radius:21px;
  background:rgba(255,255,255,.025);
}

.executive-copy h2 {
  font:700 38px/1.04 "Space Grotesk",Inter,sans-serif;
  letter-spacing:-.04em;
}

.executive-copy p {
  color:var(--muted);
}

.executive-signal {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  align-items:center;
  color:var(--muted);
  font-size:9px;
}

.executive-signal span {
  color:var(--accent);
}

.lead-form {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.lead-form label {
  display:grid;
  gap:5px;
  color:#c8d1de;
  font-size:10px;
}

.lead-form select,
.lead-form input {
  width:100%;
  min-height:45px;
  padding:0 12px;
  border:1px solid var(--line);
  border-radius:11px;
  outline:none;
  background:#0b111a;
  color:white;
}

.lead-form select:focus,
.lead-form input:focus {
  border-color:var(--accent);
}

.lead-form button,
.lead-form > small,
.lead-result {
  grid-column:1 / -1;
}

.lead-form > small {
  color:var(--muted);
  font-size:9px;
}

.lead-result {
  display:none;
  padding:14px;
  border:1px solid var(--line2);
  border-radius:12px;
}

.lead-result.show {
  display:block;
}

.lead-result pre {
  white-space:pre-wrap;
  color:#cbd4df;
}

/* FOOTER */

.next-stage {
  display:grid;
  grid-template-columns:1fr auto;
  gap:24px;
  align-items:end;
}

.executive-footer {
  width:min(var(--max),calc(100% - 48px));
  margin-inline:auto;
  padding:50px 0 28px;
  border-top:1px solid var(--line);
}

.footer-grid {
  display:grid;
  grid-template-columns:1.4fr .7fr;
  gap:35px;
}

.footer-brand h2 {
  max-width:600px;
  font:700 38px "Space Grotesk",Inter,sans-serif;
}

.footer-brand p,
.footer-meta {
  color:var(--muted);
}

.footer-nav {
  display:grid;
  align-content:start;
  gap:10px;
}

.footer-meta {
  grid-column:1 / -1;
  display:flex;
  gap:15px;
  padding-top:18px;
  border-top:1px solid var(--line);
  font-size:9px;
}

.footer-meta span {
  margin-right:auto;
}

/* ACCESSIBILITY */

:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:3px;
}

.skip-link {
  position:fixed;
  z-index:999;
  left:12px;
  top:12px;
  transform:translateY(-160%);
  background:white;
  color:#07101a;
  padding:9px;
}

.skip-link:focus {
  transform:none;
}

.floating-contact {
  position:fixed;
  z-index:80;
  right:18px;
  bottom:18px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 11px;
  border:1px solid var(--line2);
  border-radius:999px;
  background:rgba(7,10,15,.9);
  backdrop-filter:blur(12px);
  font-size:10px;
}

.floating-contact span {
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--accent);
  color:#041014;
  font-weight:900;
}

/* TABLET */

@media (max-width:1100px) {

  .desktop-nav,
  .desktop-cta,
  .lang-switch {
    display:none;
  }

  .menu-toggle {
    display:block;
    margin-left:auto;
    width:42px;
    height:42px;
    border:0;
    background:transparent;
  }

  .menu-toggle span {
    display:block;
    width:21px;
    height:1px;
    margin:5px auto;
    background:white;
  }

  .mobile-menu.open {
    position:fixed;
    z-index:99;
    inset:76px 0 0;
    display:flex;
    flex-direction:column;
    gap:18px;
    padding:28px;
    background:#080d14;
    font:650 22px "Space Grotesk",Inter,sans-serif;
  }

  .hero {
    grid-template-columns:1fr;
    min-height:auto;
  }

  .hero-visual {
    max-width:760px;
  }

  .v11-human-grid,
  .intent-grid {
    grid-template-columns:repeat(2,1fr);
  }

  .vertical-grid,
  .product-grid,
  .built-grid {
    grid-template-columns:repeat(2,1fr);
  }

  .case-grid {
    grid-template-columns:repeat(2,1fr);
  }

  .tech-grid {
    grid-template-columns:repeat(4,1fr);
  }

  .impact-flow,
  .evolution-line {
    grid-template-columns:repeat(3,1fr);
  }

  .recommendation-panel {
    grid-template-columns:1fr;
  }
}

/* MOBILE */

@media (max-width:700px) {

  .section-shell,
  .hero,
  .trust-strip,
  .executive-footer {
    width:min(100% - 32px,var(--max));
  }

  .section-shell {
    padding-block:72px;
  }

  .site-header {
    min-height:68px;
    padding-inline:16px;
  }

  .mobile-menu.open {
    inset:68px 0 0;
  }

  .hero {
    padding-block:48px 58px;
    gap:34px;
  }

  .hero h1 {
    font-size:clamp(44px,13vw,62px);
  }

  .hero-copy > p {
    font-size:16px;
  }

  .hero-actions {
    display:grid;
  }

  .hero-actions .btn {
    width:100%;
  }

  .v11-hero-human img {
    height:220px;
  }

  .trust-strip {
    grid-template-columns:1fr 1fr;
  }

  .trust-strip div:nth-child(2) {
    border-right:0;
  }

  .trust-strip div:nth-child(-n+2) {
    border-bottom:1px solid var(--line);
  }

  .v11-human-grid {
    display:flex;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    gap:10px;
    padding-bottom:8px;
  }

  .v11-human-card {
    flex:0 0 82vw;
    min-height:370px;
    scroll-snap-align:start;
  }

  .v11-human-card img {
    min-height:370px;
  }

  .intent-grid {
    grid-template-columns:1fr 1fr;
  }

  .intent {
    min-height:145px;
  }

  .vertical-grid,
  .product-grid,
  .built-grid,
  .case-grid,
  .radar-layout,
  .outcome-stage,
  .executive,
  .footer-grid {
    grid-template-columns:1fr;
  }

  .tech-grid {
    grid-template-columns:repeat(2,1fr);
  }

  .impact-flow,
  .evolution-line {
    grid-template-columns:repeat(2,1fr);
  }

  .opp-row {
    grid-template-columns:1fr;
  }

  .v11-sonia {
    grid-template-columns:1fr;
  }

  .v11-sonia > img {
    height:330px;
    object-position:center 30%;
  }

  .v11-sonia-copy h3 {
    font-size:29px;
  }

  .lead-form {
    grid-template-columns:1fr;
  }

  .lead-form button,
  .lead-form > small,
  .lead-result {
    grid-column:auto;
  }

  .next-stage {
    grid-template-columns:1fr;
  }

  .floating-contact strong {
    display:none;
  }
}

@media (max-width:420px) {

  .intent-grid {
    grid-template-columns:1fr;
  }

  .profile-pills {
    display:grid;
  }

  .tech-grid,
  .impact-flow,
  .evolution-line {
    grid-template-columns:1fr 1fr;
  }
}

@media (prefers-reduced-motion:reduce) {

  html {
    scroll-behavior:auto;
  }

  *,
  *:before,
  *:after {
    animation-duration:.01ms !important;
    transition-duration:.01ms !important;
  }
}


/* ==========================================================
   i9STARTUPS V11.2
   HUMAN EDITORIAL PREMIUM SYSTEM
   ========================================================== */

/*
 Direction:
 people first
 business centered
 technology as multiplier

 Cyan is now an accent, not the environment.
*/

:root{
  --bg:#11110f;
  --bg2:#171714;
  --panel:#1b1b18;
  --panel2:#22221e;

  --text:#f4f1e9;
  --muted:#aaa79f;
  --soft:#d6d1c7;

  --line:rgba(244,241,233,.11);
  --line2:rgba(91,154,160,.25);

  --accent:#75aeb0;
  --accent2:#8792a8;
  --green:#9bb6a2;

  --warm:#c6a878;
  --ivory:#eee9df;
  --ink:#171714;
}


/* Remove generic AI neon atmosphere */

body{
  background:
    radial-gradient(
      circle at 84% 5%,
      rgba(117,174,176,.06),
      transparent 32rem
    ),
    linear-gradient(
      180deg,
      #11110f 0%,
      #151512 45%,
      #10100e 100%
    );
}


/* More editorial typography */

.hero h1,
.section-heading h2,
.v112-editorial h2,
.v112-results h2,
.v11-sonia-copy h3,
.executive-copy h2,
.footer-brand h2{
  text-wrap:balance;
}

.hero h1 span{
  background:none;
  -webkit-background-clip:initial;
  color:var(--ivory);
}

.kicker,
.eyebrow{
  color:#9abec0;
}


/* Header becomes quieter and more premium */

.site-header{
  background:rgba(17,17,15,.88);
  border-color:rgba(255,255,255,.08);
}

.brand-mark{
  background:var(--ivory);
  color:var(--ink);
}


/* Buttons lose SaaS/neon appearance */

.btn-primary{
  background:var(--ivory);
  color:var(--ink);
  box-shadow:none;
}

.btn-primary:hover{
  background:white;
}

.btn-ghost{
  background:transparent;
  border-color:rgba(238,233,223,.22);
}


/* HERO: photography is protagonist */

.hero{
  min-height:760px;
}

.v11-hero-human{
  border-radius:4px 4px 28px 4px;
  border-color:rgba(255,255,255,.12);
  box-shadow:
    0 40px 90px rgba(0,0,0,.32);
}

.v11-hero-human img{
  height:350px;
}

.v11-hero-human:after{
  background:
    linear-gradient(
      180deg,
      transparent 55%,
      rgba(10,10,8,.62)
    );
}

.v11-hero-human figcaption span{
  background:rgba(15,15,13,.72);
}


/* Terminal is supporting evidence, not hero */

.terminal-card{
  max-width:92%;
  margin-left:auto;
  border-radius:4px 18px 18px 18px;
  border-color:rgba(255,255,255,.09);
  background:#191916;
  box-shadow:none;
}

.metric-big strong{
  color:var(--ivory);
}

.mini-bars i{
  background:
    linear-gradient(
      90deg,
      #799fa0 var(--v),
      rgba(255,255,255,.07) var(--v)
    );
}


/* Trust becomes editorial rather than dashboard */

.trust-strip{
  background:#ebe6dc;
  color:#191916;
  border:0;
  border-radius:2px;
}

.trust-strip div{
  border-color:rgba(20,20,18,.12);
}

.trust-strip span{
  color:#69675f;
}


/* ==========================================================
   AUTHORITY EDITORIAL
   ========================================================== */

.v112-editorial{
  width:min(var(--max),calc(100% - 48px));
  margin:110px auto 20px;

  display:grid;
  grid-template-columns:1.05fr .95fr;

  min-height:590px;

  background:#e9e4da;
  color:#191916;
}

.v112-editorial-media{
  min-height:590px;
  overflow:hidden;
}

.v112-editorial-media img{
  width:100%;
  height:100%;
  min-height:590px;
  object-fit:cover;
  filter:saturate(.84) contrast(.98);
}

.v112-editorial-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;

  padding:70px clamp(36px,6vw,84px);
}

.v112-editorial-copy .kicker{
  color:#577e80;
}

.v112-editorial-copy h2{
  margin:14px 0 18px;

  font:
    650 clamp(38px,4.5vw,64px)/1
    "Space Grotesk",Inter,sans-serif;

  letter-spacing:-.05em;
}

.v112-editorial-copy > p{
  max-width:600px;
  color:#66635c;
  font-size:16px;
}

.v112-proof{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;

  margin-top:42px;
  padding-top:24px;

  border-top:1px solid rgba(20,20,18,.15);
}

.v112-proof strong{
  display:block;

  font:
    650 28px
    "Space Grotesk",Inter,sans-serif;
}

.v112-proof span{
  display:block;
  margin-top:3px;

  color:#77736b;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.08em;
}


/* ==========================================================
   HUMAN STORY
   ========================================================== */

.v11-human-story{
  padding-top:130px;
}

.v11-human-card{
  border-radius:3px 3px 20px 3px;
  border-color:rgba(255,255,255,.08);
}

.v11-human-card:nth-child(2),
.v11-human-card:nth-child(4){
  transform:translateY(32px);
}

.v11-human-card:after{
  background:
    linear-gradient(
      180deg,
      transparent 34%,
      rgba(10,10,8,.9)
    );
}

.v11-human-card span{
  color:#b5cdce;
}


/* ==========================================================
   JOURNEY HUMAN PAUSE
   ========================================================== */

.v112-journey-media{
  position:relative;

  margin:34px 0 20px;
  height:390px;

  overflow:hidden;

  border-radius:2px 24px 2px 2px;
}

.v112-journey-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 48%;

  filter:saturate(.82);
}

.v112-journey-media:after{
  content:"";
  position:absolute;
  inset:0;

  background:
    linear-gradient(
      90deg,
      rgba(10,10,8,.4),
      transparent 55%
    );
}

.v112-journey-media figcaption{
  position:absolute;
  z-index:2;
  left:24px;
  bottom:22px;
}

.v112-journey-media span{
  display:inline-flex;

  padding:8px 11px;

  background:rgba(17,17,15,.72);
  backdrop-filter:blur(12px);

  font-size:9px;
  font-weight:800;
  letter-spacing:.09em;
  text-transform:uppercase;
}


/* Cards become quieter */

.intent,
.vertical-card,
.product-card,
.built-card,
.insight-grid article,
.radar-score,
.opportunity-list,
.case-card,
.cap-detail,
.executive-copy,
.lead-form{
  background:#191916;
  border-color:rgba(255,255,255,.08);
}

.intent:hover,
.intent.active{
  border-color:rgba(117,174,176,.5);

  background:
    linear-gradient(
      145deg,
      rgba(117,174,176,.08),
      rgba(255,255,255,.015)
    );
}

.intent > span,
.vertical-card > span,
.product-card > span,
.built-card > span,
.insight-grid article > span,
.solution-list article > span,
.solution-list b,
.case-top > span,
.radar-score span{
  color:#9fc0c1;
}


/* Recommended journey no longer neon */

.recommendation-panel{
  border-color:rgba(117,174,176,.24);
  background:#161614;
}


/* ==========================================================
   RESULTS EDITORIAL INTERRUPTION
   ========================================================== */

.v112-results{
  width:min(var(--max),calc(100% - 48px));
  margin:100px auto;

  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:54px;

  align-items:end;
}

.v112-results-copy{
  padding-bottom:24px;
}

.v112-results-copy h2{
  margin:13px 0 18px;

  font:
    650 clamp(38px,4vw,60px)/1
    "Space Grotesk",Inter,sans-serif;

  letter-spacing:-.05em;
}

.v112-results-copy p{
  max-width:500px;
  color:var(--muted);
}

.v112-results-images{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  grid-template-rows:220px 220px;
  gap:10px;
}

.v112-results-images figure{
  margin:0;
  overflow:hidden;
}

.v112-results-images figure:first-child{
  grid-row:1 / 3;
}

.v112-results-images img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.82);
  transition:
    transform .7s ease,
    filter .7s ease;
}

.v112-results-images figure:hover img{
  transform:scale(1.025);
  filter:saturate(.96);
}


/* ==========================================================
   TECHNOLOGY: deliberately darker / technical
   ========================================================== */

.tech-grid{
  padding:22px;

  background:#0c0d0c;

  border:
    1px solid
    rgba(255,255,255,.06);
}

.tech-tile{
  background:#141512;
  border-color:rgba(255,255,255,.07);
}


/* Intelligence remains technical but restrained */

.radar-meter i{
  background:#799fa0;
}


/* ==========================================================
   SON.IA
   Human service, not sci-fi assistant
   ========================================================== */

.v11-sonia{
  background:#e8e3d9;
  color:#181815;

  border:0;
  border-radius:3px 26px 3px 3px;

  padding:24px;
}

.v11-sonia > img{
  border-radius:2px 18px 2px 2px;
  filter:saturate(.88);
}

.v11-sonia-copy .kicker{
  color:#557d7f;
}

.v11-sonia-copy > p{
  color:#66635d;
}

.v11-sonia-context{
  background:rgba(20,20,18,.045);
  border-color:rgba(20,20,18,.12);
}

.v11-sonia-context small{
  color:#557d7f;
}

.v11-sonia-context p{
  color:#66635d;
}

.v11-sonia .btn-primary{
  background:#191916;
  color:#f2eee5;
}


/* Footer softer */

.executive-footer{
  border-color:rgba(255,255,255,.08);
}


/* ==========================================================
   TABLET
   ========================================================== */

@media(max-width:1100px){

  .v112-editorial{
    grid-template-columns:1fr 1fr;
  }

  .v112-results{
    grid-template-columns:1fr;
  }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media(max-width:700px){

  .hero{
    min-height:auto;
  }

  .v11-hero-human img{
    height:280px;
  }

  .terminal-card{
    max-width:100%;
  }

  .v112-editorial{
    width:100%;
    margin:70px 0 0;

    grid-template-columns:1fr;

    min-height:0;
  }

  .v112-editorial-media{
    min-height:430px;
  }

  .v112-editorial-media img{
    min-height:430px;
  }

  .v112-editorial-copy{
    padding:48px 24px 54px;
  }

  .v112-proof{
    gap:12px;
  }

  .v112-proof strong{
    font-size:24px;
  }

  .v11-human-story{
    padding-top:90px;
  }

  .v11-human-card:nth-child(2),
  .v11-human-card:nth-child(4){
    transform:none;
  }

  .v112-journey-media{
    height:310px;
    border-radius:2px 18px 2px 2px;
  }

  .v112-results{
    width:min(100% - 32px,var(--max));
    margin:75px auto;

    gap:30px;
  }

  .v112-results-images{
    grid-template-columns:1fr 1fr;
    grid-template-rows:290px 170px;
  }

  .v112-results-images figure:first-child{
    grid-column:1 / 3;
    grid-row:auto;
  }

  .v11-sonia{
    padding:14px;
  }

}

@media(prefers-reduced-motion:reduce){

  .v112-results-images img{
    transition:none;
  }

}


/* ============================================================
   i9STARTUPS EVO V11.3
   HUMAN BUSINESS VISUAL SYSTEM

   PRINCIPLE
   People first
   Business centered
   Technology as multiplier

   No new image files.
   Existing media library reused semantically.
   ============================================================ */


/* ------------------------------------------------------------
   PREMIUM PALETTE
   Remove generic AI/dashboard visual dominance
   ------------------------------------------------------------ */

:root {

  --bg:#11110f;
  --bg2:#171714;

  --panel:#1a1916;
  --panel2:#23211d;

  --text:#f5f1e9;
  --soft:#d8d1c4;
  --muted:#aaa49a;

  --accent:#c59a55;
  --accent2:#d3b47c;

  --green:#95aa96;

  --ivory:#f0ebe1;
  --ink:#181714;

  --line:rgba(245,241,233,.10);
  --line2:rgba(197,154,85,.26);

}


/* Gold/warm accent instead of cyan-heavy AI language */

.kicker,
.eyebrow,
.intent > span,
.vertical-card > span,
.product-card > span,
.built-card > span,
.case-top > span,
.insight-grid article > span,
.solution-list article > span,
.solution-list b,
.radar-score > span {

  color:var(--accent2);

}

.pulse {

  background:var(--accent);

  box-shadow:
    0 0 0 7px
    rgba(197,154,85,.08);

}


/* ------------------------------------------------------------
   HUMAN CARD FOUNDATION
   ------------------------------------------------------------ */

.intent,
.vertical-card,
.product-card,
.case-card,
.built-card,
.insight-grid article {

  position:relative;

  overflow:hidden;

  isolation:isolate;

  background:#171613;

  border-color:
    rgba(255,255,255,.10);

}


/* Photo layer */

.intent::before,
.vertical-card::before,
.product-card::before,
.case-card::before,
.built-card::before,
.insight-grid article::before {

  content:"";

  position:absolute;

  inset:0;

  z-index:-2;

  pointer-events:none;

  background-image:
    var(--human-image);

  background-size:cover;

  background-position:
    var(--human-position, center);

  opacity:
    var(--human-opacity,.62);

  filter:
    saturate(.78)
    contrast(.95);

  transition:
    transform .65s ease,
    opacity .45s ease,
    filter .45s ease;

}


/* Readability layer */

.intent::after,
.vertical-card::after,
.product-card::after,
.case-card::after,
.built-card::after,
.insight-grid article::after {

  content:"";

  position:absolute;

  inset:0;

  z-index:-1;

  pointer-events:none;

  background:

    linear-gradient(
      180deg,
      rgba(12,12,10,.08) 5%,
      rgba(12,12,10,.28) 42%,
      rgba(12,12,10,.93) 100%
    ),

    linear-gradient(
      90deg,
      rgba(12,12,10,.16),
      transparent 65%
    );

}


/* Controlled editorial movement */

.intent:hover::before,
.vertical-card:hover::before,
.product-card:hover::before,
.case-card:hover::before,
.built-card:hover::before,
.insight-grid article:hover::before {

  transform:scale(1.035);

  opacity:.78;

  filter:
    saturate(.92)
    contrast(.98);

}


/* ------------------------------------------------------------
   8 BUSINESS PROBLEMS
   ------------------------------------------------------------ */

.intent {

  min-height:250px;

  display:flex;

  flex-direction:column;

  justify-content:flex-end;

  padding:22px;

  border-radius:
    4px 4px 20px 4px;

}

.intent strong {

  margin:
    7px 0 5px;

  font-size:20px;

}

.intent small {

  color:
    rgba(245,241,233,.76);

  font-size:11px;

}

.intent.active {

  border-color:
    rgba(197,154,85,.60);

  box-shadow:
    inset 0 0 0 1px
    rgba(197,154,85,.14);

}


/* Implement AI */

.intent:nth-child(1) {

  --human-image:
    url("media/future/ai.webp");

  --human-position:
    center;

}


/* Increase sales */

.intent:nth-child(2) {

  --human-image:
    url("media/everyday/customer.webp");

  --human-position:
    center 34%;

}


/* Reduce costs */

.intent:nth-child(3) {

  --human-image:
    url("media/everyday/operations.webp");

  --human-position:
    center;

}


/* Startup */

.intent:nth-child(4) {

  --human-image:
    url("media/everyday/entrepreneur.webp");

  --human-position:
    center;

}


/* Software */

.intent:nth-child(5) {

  --human-image:
    url("media/future/digital.webp");

  --human-position:
    center;

}


/* Cybersecurity */

.intent:nth-child(6) {

  --human-image:
    url("media/future/automation.webp");

  --human-position:
    center;

}


/* Cloud */

.intent:nth-child(7) {

  --human-image:
    url("media/future/digital.webp");

  --human-position:
    72% center;

}


/* Guidance */

.intent:nth-child(8) {

  --human-image:
    url("media/everyday/meeting.webp");

  --human-position:
    center;

}


/* ------------------------------------------------------------
   7 CAPABILITY CARDS
   ------------------------------------------------------------ */

.vertical-card {

  min-height:330px;

  justify-content:flex-end;

  border-radius:
    3px 3px 22px 3px;

}

.vertical-card h3 {

  margin-top:auto;

  padding-top:110px;

  font-size:22px;

}

.vertical-card p {

  color:
    rgba(245,241,233,.72);

}

.vertical-card a {

  color:var(--accent2);

}


/* AI */

.vertical-card:nth-child(1) {

  --human-image:
    url("media/future/ai.webp");

}


/* Software */

.vertical-card:nth-child(2) {

  --human-image:
    url("media/future/digital.webp");

}


/* Venture */

.vertical-card:nth-child(3) {

  --human-image:
    url("media/everyday/entrepreneur.webp");

}


/* Cloud / Security */

.vertical-card:nth-child(4) {

  --human-image:
    url("media/future/automation.webp");

}


/* Workplace */

.vertical-card:nth-child(5) {

  --human-image:
    url("media/everyday/operations.webp");

}


/* Growth */

.vertical-card:nth-child(6) {

  --human-image:
    url("media/everyday/customer.webp");

}


/* Advisory */

.vertical-card:nth-child(7) {

  --human-image:
    url("media/everyday/meeting.webp");

}


/* ------------------------------------------------------------
   PRODUCT / SPRINT CARDS
   ------------------------------------------------------------ */

.product-card {

  min-height:300px;

  display:flex;

  flex-direction:column;

  justify-content:flex-end;

  border-radius:
    4px 18px 4px 4px;

}

.product-card h3 {

  margin-top:auto;

  padding-top:90px;

  font-size:21px;

}

.product-card p {

  color:
    rgba(245,241,233,.74);

}


/* AI readiness */

.product-card:nth-child(1) {

  --human-image:
    url("media/future/ai.webp");

}


/* AI agent */

.product-card:nth-child(2) {

  --human-image:
    url("media/future/automation.webp");

}


/* Startup MVP */

.product-card:nth-child(3) {

  --human-image:
    url("media/everyday/entrepreneur.webp");

}


/* Cyber */

.product-card:nth-child(4) {

  --human-image:
    url("media/future/digital.webp");

  --human-position:
    80% center;

}


/* Cloud */

.product-card:nth-child(5) {

  --human-image:
    url("media/everyday/operations.webp");

}


/* UX */

.product-card:nth-child(6) {

  --human-image:
    url("media/everyday/customer.webp");

}


/* ------------------------------------------------------------
   BUILT BY i9
   ------------------------------------------------------------ */

.built-card {

  min-height:310px;

  display:flex;

  flex-direction:column;

  justify-content:flex-end;

  border-radius:
    20px 3px 3px 3px;

}

.built-card h3 {

  margin-top:auto;

  padding-top:90px;

  font-size:24px;

}

.built-card p {

  color:
    rgba(245,241,233,.74);

}

.built-card:nth-child(1) {

  --human-image:
    url("media/everyday/entrepreneur.webp");

}

.built-card:nth-child(2) {

  --human-image:
    url("media/future/digital.webp");

}

.built-card:nth-child(3) {

  --human-image:
    url("media/everyday/meeting.webp");

}


/* ------------------------------------------------------------
   CASES
   Human context behind product evidence
   ------------------------------------------------------------ */

.case-card {

  min-height:350px;

  border-radius:
    3px 20px 3px 3px;

}

.case-card h3 {

  margin-top:auto;

  padding-top:105px;

}

.case-card p {

  color:
    rgba(245,241,233,.74);

}

.case-card:nth-child(1) {

  --human-image:
    url("media/outcomes/experience.webp");

}

.case-card:nth-child(2) {

  --human-image:
    url("media/everyday/customer.webp");

}

.case-card:nth-child(3) {

  --human-image:
    url("media/outcomes/growth.webp");

}

.case-card:nth-child(4) {

  --human-image:
    url("media/future/automation.webp");

}

.case-card:nth-child(5) {

  --human-image:
    url("media/everyday/entrepreneur.webp");

}


/* ------------------------------------------------------------
   TECHNOLOGY RADAR / INSIGHTS
   ------------------------------------------------------------ */

.insight-grid article {

  min-height:285px;

  display:flex;

  flex-direction:column;

  justify-content:flex-end;

}

.insight-grid article h3 {

  margin-top:auto;

  padding-top:80px;

}

.insight-grid article p {

  color:
    rgba(245,241,233,.72);

}

.insight-grid article:nth-child(1) {

  --human-image:
    url("media/future/ai.webp");

}

.insight-grid article:nth-child(2) {

  --human-image:
    url("media/future/automation.webp");

}

.insight-grid article:nth-child(3) {

  --human-image:
    url("media/everyday/entrepreneur.webp");

}


/* ------------------------------------------------------------
   BUSINESS OUTCOMES
   Turn list into richer editorial surface
   ------------------------------------------------------------ */

.outcome-stage {

  overflow:hidden;

  border-top:
    1px solid
    rgba(255,255,255,.08);

  padding-top:42px;

}

.outcome-copy {

  position:relative;

}

.outcome-copy::before {

  content:"";

  display:block;

  width:100%;

  aspect-ratio:16/10;

  margin-bottom:24px;

  background:

    linear-gradient(
      180deg,
      transparent,
      rgba(10,10,8,.20)
    ),

    url("media/outcomes/growth.webp")
    center / cover no-repeat;

  border-radius:
    3px 22px 3px 3px;

}


/* ------------------------------------------------------------
   INDUSTRIES
   More human editorial depth without extra images
   ------------------------------------------------------------ */

.industries {

  position:relative;

  overflow:hidden;

}

.industries::before {

  content:"";

  position:absolute;

  inset:
    80px 0 auto auto;

  width:42%;

  height:340px;

  z-index:-1;

  background:

    linear-gradient(
      90deg,
      rgba(17,17,15,1),
      rgba(17,17,15,.18)
    ),

    url("media/everyday/customer.webp")
    center / cover no-repeat;

  opacity:.72;

}

.industry-pills {

  max-width:760px;

}


/* ------------------------------------------------------------
   METHODOLOGY
   ------------------------------------------------------------ */

.impact-section {

  position:relative;

}

.impact-section::before {

  content:"";

  display:block;

  width:100%;

  height:380px;

  margin-bottom:45px;

  background:

    linear-gradient(
      180deg,
      transparent 44%,
      rgba(17,17,15,.72)
    ),

    url("media/everyday/operations.webp")
    center / cover no-repeat;

  border-radius:
    22px 3px 3px 3px;

}


/* ------------------------------------------------------------
   EVOLUTION
   ------------------------------------------------------------ */

.evolution {

  position:relative;

  overflow:hidden;

}

.evolution::before {

  content:"";

  display:block;

  width:100%;

  height:360px;

  margin-bottom:46px;

  background:

    linear-gradient(
      180deg,
      transparent,
      rgba(17,17,15,.64)
    ),

    url("media/everyday/meeting.webp")
    center / cover no-repeat;

  border-radius:
    3px 3px 24px 3px;

}


/* ------------------------------------------------------------
   INTELLIGENCE LAYER
   Keep dashboard language intentionally ONLY here
   ------------------------------------------------------------ */

.radar-section {

  background:
    linear-gradient(
      180deg,
      rgba(16,17,15,0),
      rgba(9,10,9,.82)
    );

}

.radar-score,
.opportunity-list {

  background:#11120f;

  border-color:
    rgba(255,255,255,.09);

}

.radar-meter i {

  background:
    linear-gradient(
      90deg,
      var(--accent),
      var(--accent2)
    );

}


/* ------------------------------------------------------------
   TECHNOLOGY ECOSYSTEM
   Technical, but not neon
   ------------------------------------------------------------ */

.tech-filter.active {

  background:var(--ivory);

  color:var(--ink);

}

.tech-tile {

  background:#171713;

}

.tech-tile:hover {

  border-color:
    rgba(197,154,85,.38);

}


/* ------------------------------------------------------------
   SON.IA
   Humanized premium advisory
   ------------------------------------------------------------ */

.v11-sonia {

  box-shadow:
    0 36px 90px
    rgba(0,0,0,.22);

}

.v11-sonia > img {

  min-height:320px;

}

.v11-sonia-copy h3 {

  font-size:
    clamp(34px,4vw,54px);

}


/* ------------------------------------------------------------
   HUMAN IMAGE RHYTHM
   Prevent long card-only stretches
   ------------------------------------------------------------ */

.verticals,
.products-section,
.authority,
.capability-deep,
.insights-section {

  padding-top:120px;

  padding-bottom:120px;

}


/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */

@media(max-width:700px) {

  .intent {

    min-height:230px;

  }

  .vertical-card,
  .product-card,
  .case-card,
  .built-card,
  .insight-grid article {

    min-height:330px;

  }

  .vertical-card h3,
  .product-card h3,
  .case-card h3,
  .built-card h3,
  .insight-grid article h3 {

    padding-top:115px;

  }

  .industries::before {

    position:relative;

    inset:auto;

    display:block;

    width:100%;

    height:280px;

    margin-bottom:28px;

    background:

      linear-gradient(
        180deg,
        transparent,
        rgba(17,17,15,.50)
      ),

      url("media/everyday/customer.webp")
      center / cover no-repeat;

  }

  .impact-section::before,
  .evolution::before {

    height:290px;

  }

}


/* ------------------------------------------------------------
   REDUCED MOTION
   ------------------------------------------------------------ */

@media(prefers-reduced-motion:reduce) {

  .intent::before,
  .vertical-card::before,
  .product-card::before,
  .case-card::before,
  .built-card::before,
  .insight-grid article::before {

    transition:none;

  }

}


/* ============================================================
   V11.4 BENCHMARK CONVERSION ARCHITECTURE
   ============================================================ */

/* Conversion journey rail */

.v114-flow{
  width:min(var(--max),calc(100% - 48px));
  margin:10px auto 0;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:24px;
  align-items:center;
  padding:14px 18px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.v114-flow>span{
  color:var(--muted);
  font-size:9px;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.v114-flow ol{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:4px;
  margin:0;
  padding:0;
}

.v114-flow li{
  display:flex;
  align-items:center;
  gap:6px;
  color:#827d74;
  font-size:9px;
  transition:.2s ease;
}

.v114-flow li b{
  color:#67635c;
}

.v114-flow li.active{
  color:var(--ivory);
}

.v114-flow li.active b{
  color:var(--accent2);
}

.v114-flow>a{
  color:var(--accent2);
  font-size:10px;
  font-weight:800;
  white-space:nowrap;
}


/* Commercial hierarchy */

.v114-stage{
  scroll-margin-top:96px;
}

.v114-stage-attention{
  padding-bottom:58px;
}

.v114-stage-problem{
  padding-top:88px;
}

.v114-stage-solution{
  padding-top:82px;
}

.v114-stage-proof{
  padding-top:90px;
}

.v114-stage-entry{
  padding-top:90px;
}

.v114-stage-authority{
  padding-top:92px;
}

.v114-stage-convert{
  padding-top:90px;
}


/* Mid-funnel conversion interruption */

.v114-micro-cta{
  width:min(var(--max),calc(100% - 48px));
  margin:0 auto 55px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:24px;
  align-items:center;
  padding:24px 28px;
  background:var(--ivory);
  color:var(--ink);
  border-radius:3px 20px 3px 3px;
}

.v114-micro-cta span{
  display:block;
  color:#777268;
  font-size:10px;
}

.v114-micro-cta strong{
  display:block;
  margin-top:4px;
  font:650 21px "Space Grotesk",Inter,sans-serif;
}

.v114-micro-cta .btn-primary{
  background:#1a1916;
  color:#f3eee5;
}


/* Reduce homepage vertical fatigue */

.v114-secondary{
  padding-top:72px;
  padding-bottom:72px;
}

.v114-secondary .section-heading{
  margin-bottom:26px;
}

.v114-secondary .section-heading h2{
  font-size:clamp(30px,3.3vw,46px);
}


/* Capabilities stop consuming several folds */

.capability-deep .cap-stack{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.capability-deep .cap-detail{
  align-self:start;
}


/* Industry context becomes compact */

.industries{
  min-height:460px;
}

.industry-pills{
  gap:9px;
}


/* Products become the low-risk purchase point */

.products-section{
  position:relative;
}

.products-section .product-card{
  border-color:rgba(197,154,85,.18);
}


/* Authority remains strong but shorter */

.authority .case-grid{
  gap:8px;
}

.authority .case-card{
  min-height:315px;
}


/* Evolution should feel like a single visual timeline */

.evolution-line{
  gap:0;
}

.evolution-line article{
  padding:16px 12px;
}


/* Son.ia becomes visually the handoff */

.v11-sonia{
  margin-bottom:24px;
}

.v11-sonia-copy .btn{
  min-width:210px;
}


/* Fewer competing CTA styles */

.vertical-card a,
.product-card a,
.case-card a{
  font-weight:750;
}

.vertical-card a::after,
.product-card a::after,
.case-card a::after{
  content:"";
}


/* MOBILE */

@media(max-width:800px){

  .v114-flow{
    width:100%;
    padding:12px 16px;
    grid-template-columns:1fr auto;
  }

  .v114-flow>span{
    display:none;
  }

  .v114-flow ol{
    overflow-x:auto;
    grid-template-columns:repeat(5,minmax(82px,1fr));
    scrollbar-width:none;
  }

  .v114-flow ol::-webkit-scrollbar{
    display:none;
  }

  .v114-flow li{
    white-space:nowrap;
  }

  .v114-flow>a{
    display:none;
  }

  .v114-micro-cta{
    width:calc(100% - 32px);
    grid-template-columns:1fr;
    padding:22px;
  }

  .v114-micro-cta .btn{
    width:100%;
  }

  .capability-deep .cap-stack{
    grid-template-columns:1fr;
  }

  .v114-secondary{
    padding-top:58px;
    padding-bottom:58px;
  }

}


/* ============================================================
   V11.5 CONVERSION COMPRESSION
   ============================================================ */

.v115-deep{
  padding-top:74px;
  padding-bottom:82px;
}

.v115-deep > .section-heading{
  max-width:760px;
}

.v115-deep-disclosure{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.v115-deep-disclosure > summary{
  min-height:76px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:20px;
  align-items:center;
  cursor:pointer;
  list-style:none;
  font:
    650 18px
    "Space Grotesk",
    Inter,
    sans-serif;
}

.v115-deep-disclosure > summary::-webkit-details-marker{
  display:none;
}

.v115-deep-disclosure > summary b{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:50%;
  font-size:18px;
  font-weight:400;
  transition:transform .25s ease;
}

.v115-deep-disclosure[open] > summary b{
  transform:rotate(45deg);
}

.v115-deep-content{
  padding:10px 0 30px;
}

.v115-deep-content > .section-shell{
  width:100%;
  padding-top:64px;
  padding-bottom:64px;
}

/* Do not recreate huge nested viewport gaps */

.v115-deep-content .v114-secondary{
  padding-top:58px;
  padding-bottom:58px;
}

/* Dense technical content becomes intentionally compact */

.v115-deep-content .tech-grid{
  grid-template-columns:repeat(6,minmax(0,1fr));
}

.v115-deep-content .capability-deep .cap-stack{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.v115-deep-content .evolution::before{
  height:260px;
}

/* Main conversion path gets stronger separation */

#radar,
#products,
#impact,
#cases-real,
#executive-form{
  position:relative;
}

#products::after,
#cases-real::after{
  content:"";
  display:block;
  width:90px;
  height:1px;
  margin:70px auto 0;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(197,154,85,.55),
    transparent
  );
}

/* Son.ia / conversion culmination */

#executive-form{
  padding-top:100px;
}

.v11-sonia{
  margin-bottom:38px;
}

/* Avoid excessive visual height in principal cards */

@media(min-width:1101px){

  .intent{
    min-height:225px;
  }

  .vertical-card,
  .product-card{
    min-height:285px;
  }

  .case-card{
    min-height:300px;
  }

}

/* Mobile progressive disclosure */

@media(max-width:800px){

  .v115-deep{
    padding-top:56px;
    padding-bottom:64px;
  }

  .v115-deep-disclosure > summary{
    min-height:70px;
    font-size:16px;
  }

  .v115-deep-content > .section-shell{
    padding-top:52px;
    padding-bottom:52px;
  }

  .v115-deep-content .tech-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .v115-deep-content .capability-deep .cap-stack{
    grid-template-columns:1fr;
  }

}


/* ============================================================
   V11.6B
   VISUAL DIVERSITY SURGICAL LAYER
   Goal: reduce perceptible repetition without adding new files.
   ============================================================ */

/*
 Same asset may appear again only with a substantially different
 editorial crop / treatment.
*/

/* Problems */

.intent:nth-child(1){
  --human-position:48% 30%;
  --human-opacity:.68;
}

.intent:nth-child(2){
  --human-position:58% 28%;
  --human-opacity:.72;
}

.intent:nth-child(3){
  --human-position:42% 46%;
  --human-opacity:.64;
}

.intent:nth-child(4){
  --human-position:66% 42%;
  --human-opacity:.70;
}

.intent:nth-child(5){
  --human-position:30% 40%;
  --human-opacity:.65;
}

.intent:nth-child(6){
  --human-position:72% 38%;
  --human-opacity:.63;
}

.intent:nth-child(7){
  --human-position:82% 52%;
  --human-opacity:.60;
}

.intent:nth-child(8){
  --human-position:35% 35%;
  --human-opacity:.72;
}


/* Capabilities */

.vertical-card:nth-child(odd)::before{
  filter:
    saturate(.68)
    contrast(.98)
    brightness(.92);
}

.vertical-card:nth-child(even)::before{
  filter:
    saturate(.86)
    contrast(.93)
    brightness(.82);
}

.vertical-card:nth-child(1){
  --human-position:42% 25%;
}

.vertical-card:nth-child(2){
  --human-position:70% 48%;
}

.vertical-card:nth-child(3){
  --human-position:54% 34%;
}

.vertical-card:nth-child(4){
  --human-position:78% 42%;
}

.vertical-card:nth-child(5){
  --human-position:32% 42%;
}

.vertical-card:nth-child(6){
  --human-position:62% 28%;
}

.vertical-card:nth-child(7){
  --human-position:40% 30%;
}


/* Sprints */

.product-card:nth-child(1){
  --human-position:55% 22%;
}

.product-card:nth-child(2){
  --human-position:76% 48%;
}

.product-card:nth-child(3){
  --human-position:36% 38%;
}

.product-card:nth-child(4){
  --human-position:86% 42%;
}

.product-card:nth-child(5){
  --human-position:28% 48%;
}

.product-card:nth-child(6){
  --human-position:64% 32%;
}


/* Cases */

.case-card:nth-child(1){
  --human-position:48% 28%;
}

.case-card:nth-child(2){
  --human-position:70% 34%;
}

.case-card:nth-child(3){
  --human-position:38% 50%;
}

.case-card:nth-child(4){
  --human-position:80% 44%;
}

.case-card:nth-child(5){
  --human-position:44% 30%;
}


/* Alternate overlays to avoid repeating the exact same card language */

.intent:nth-child(4n+1)::after,
.vertical-card:nth-child(3n+1)::after,
.product-card:nth-child(3n+1)::after,
.case-card:nth-child(3n+1)::after{
  background:
    linear-gradient(
      180deg,
      rgba(12,12,10,.02) 0%,
      rgba(12,12,10,.20) 42%,
      rgba(12,12,10,.94) 100%
    );
}

.intent:nth-child(4n+2)::after,
.vertical-card:nth-child(3n+2)::after,
.product-card:nth-child(3n+2)::after,
.case-card:nth-child(3n+2)::after{
  background:
    linear-gradient(
      110deg,
      rgba(12,12,10,.08) 0%,
      rgba(12,12,10,.20) 52%,
      rgba(12,12,10,.92) 100%
    );
}

.intent:nth-child(4n+3)::after,
.vertical-card:nth-child(3n)::after,
.product-card:nth-child(3n)::after,
.case-card:nth-child(3n)::after{
  background:
    linear-gradient(
      155deg,
      rgba(12,12,10,.05) 0%,
      rgba(12,12,10,.25) 46%,
      rgba(12,12,10,.95) 100%
    );
}


/* Preserve facial/context visibility on mobile */

@media(max-width:700px){

  .intent::before,
  .vertical-card::before,
  .product-card::before,
  .case-card::before{
    background-position:
      var(--human-position,center);
  }

}


/* ==========================================================
   V11.7 FUNCTIONAL EXPERIENCE RECOVERY
   ========================================================== */

/* Fix the visibly broken / oversized result fold */

.v112-results{
  grid-template-columns:
    minmax(340px,.9fr)
    minmax(0,1.35fr);

  gap:clamp(36px,5vw,72px);
  align-items:center;
}

.v112-results-copy h2{
  max-width:620px;

  font-size:
    clamp(38px,3.4vw,54px);

  line-height:1.02;
}

.v112-results-copy p{
  font-size:15px;
  line-height:1.65;
}

.v112-results-images{
  min-width:0;
}

.v112-results-images figure{
  background:#1b1a17;
}

.v112-results-images img{
  min-width:100%;
  object-fit:cover;
}


/* Clear interactive feedback */

.intent,
.profile-pill,
.outcome-tabs button,
.tech-filter,
.industry-pills button{
  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    opacity .18s ease;
}

.industry-pills button.active{
  background:var(--ivory);
  color:var(--ink);
  border-color:var(--ivory);
}

.radar-feedback{
  margin:14px 0 0;
  color:var(--muted);
  font-size:11px;
  line-height:1.5;
}


/* Commercial links need visible meaning */

.vertical-card a,
.product-card a,
.case-card a{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  margin-top:14px;
  color:var(--ivory);
  font-size:11px;
}

.vertical-card a:hover,
.product-card a:hover,
.case-card a:hover{
  color:var(--accent2);
}


/* Selected problem is unambiguous */

.intent.active{
  outline:
    1px solid
    rgba(197,154,85,.52);

  outline-offset:-1px;
}


/* Interactive elements must look interactive */

.outcome-tabs button,
.tech-filter,
.industry-pills button,
.profile-pill,
.intent,
#simulateRadar,
.v115-deep-disclosure > summary{
  cursor:pointer;
}


/* hidden means actually hidden */

.tech-tile[hidden]{
  display:none !important;
}


/* Scroll targets should not hide behind sticky header */

[id]{
  scroll-margin-top:96px;
}


/* Mobile result fold */

@media(max-width:800px){

 .v112-results{
   grid-template-columns:1fr;
 }

 .v112-results-copy h2{
   font-size:
     clamp(34px,10vw,46px);
 }

 .v112-results-images{
   grid-template-rows:
     260px 160px;
 }

}


/* Small screens */

@media(max-width:420px){

 .v112-results-images{
   grid-template-columns:1fr;
   grid-template-rows:none;
 }

 .v112-results-images figure:first-child{
   grid-column:auto;
 }

 .v112-results-images figure{
   height:220px;
 }

}

/* =========================================================
   P4.5 HUMAN EXPERIENCE + VISUAL STORYTELLING
   ========================================================= */

.i9-human-context{
  width:min(1180px,calc(100% - 32px));
  margin:30px auto 36px;
  position:relative;
}

.i9-human-context__media{
  position:relative;
  overflow:hidden;
  border-radius:24px;
  aspect-ratio:16/7;
  background:#111827;
  box-shadow:0 22px 60px rgba(10,20,35,.14);
}

.i9-human-context__media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(
      180deg,
      rgba(7,17,31,.01),
      rgba(7,17,31,.10)
    );
}

.i9-human-context img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

@media(max-width:900px){

  .i9-human-context{
    width:calc(100% - 28px);
    margin:22px auto 28px;
  }

  .i9-human-context__media{
    aspect-ratio:16/9;
  }

}

@media(max-width:600px){

  .i9-human-context{
    width:calc(100% - 24px);
    margin:18px auto 24px;
  }

  .i9-human-context__media{
    aspect-ratio:4/3;
    border-radius:18px;
  }

}

/* ==========================================================
   i9STARTUPS EVO V12
   7-FOLD COMMERCIAL ARCHITECTURE
   MOBILE FIRST
   ========================================================== */

.v12-home{
  margin:0;
  overflow-x:hidden;
}

.v12-header{
  position:sticky;
  top:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:14px max(18px,4vw);
  background:rgba(7,17,31,.92);
  backdrop-filter:blur(18px);
}

.v12-brand{
  text-decoration:none;
  font-weight:800;
}

.v12-brand small{
  display:block;
  font-size:10px;
  opacity:.65;
}

.v12-header nav{
  display:flex;
  gap:8px;
  overflow-x:auto;
}

.v12-header nav a{
  white-space:nowrap;
  font-size:12px;
  text-decoration:none;
  padding:8px 10px;
}

.v12-fold{
  padding:64px 18px;
  min-height:auto;
}

.v12-wrap{
  width:min(1180px,100%);
  margin:auto;
}

.v12-eyebrow{
  display:block;
  font-size:11px;
  letter-spacing:.14em;
  font-weight:800;
  margin-bottom:14px;
}

.v12-fold h1{
  font-size:clamp(36px,10vw,72px);
  line-height:.98;
  max-width:900px;
}

.v12-fold h2{
  font-size:clamp(30px,8vw,58px);
  line-height:1.02;
  max-width:900px;
}

.v12-fold p{
  max-width:760px;
  line-height:1.65;
}

.v12-hero-grid,
.v12-sonia-grid{
  display:grid;
  gap:30px;
}

.v12-hero-media,
.v12-sonia figure{
  margin:0;
  overflow:hidden;
  border-radius:24px;
}

.v12-hero-media img,
.v12-sonia figure img,
.v12-trust-grid img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.v12-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:28px;
}

.v12-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:12px 18px;
  border-radius:999px;
  text-decoration:none;
  cursor:pointer;
}

.v12-problem-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:30px;
}

.v12-choice{
  min-height:72px;
  border-radius:16px;
  cursor:pointer;
}

.v12-recommendation{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:20px;
  padding:22px;
  margin-top:24px;
  border-radius:22px;
}

.v12-score strong{
  font-size:42px;
}

.v12-capability-grid{
  display:grid;
  gap:14px;
  margin-top:30px;
}

.v12-capability-card{
  padding:22px;
  border-radius:20px;
}

.v12-capability-number{
  font-size:12px;
  opacity:.6;
}

.v12-capability-card h3{
  font-size:21px;
}

.v12-capability-cta{
  display:inline-block;
  margin-top:12px;
}

.v12-profile-grid{
  display:grid;
  gap:12px;
  margin-top:28px;
}

.v12-profile-grid button{
  text-align:left;
  padding:22px;
  border-radius:20px;
  font-size:20px;
}

.v12-profile-grid small{
  display:block;
  margin-top:6px;
  opacity:.65;
}

.v12-market-title{
  margin-top:34px;
  font-size:11px;
  letter-spacing:.13em;
}

.v12-market-grid{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}

.v12-market-grid button{
  padding:9px 12px;
  border-radius:999px;
}

.v12-trust-grid{
  display:grid;
  gap:12px;
  margin-top:28px;
}

.v12-trust-grid figure{
  aspect-ratio:16/10;
  overflow:hidden;
  margin:0;
  border-radius:20px;
}

.v12-proof-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  margin-top:18px;
}

.v12-proof-grid div{
  padding:18px;
  border-radius:18px;
}

.v12-proof-grid strong{
  display:block;
  font-size:32px;
}

.v12-sonia-card{
  padding:24px;
  border-radius:22px;
}

.v12-sonia-card strong{
  display:block;
  font-size:26px;
  margin:8px 0;
}

.v12-radar{
  margin-top:18px;
}

.v12-radar strong{
  font-size:42px;
}

.v12-form{
  display:grid;
  gap:12px;
  margin-top:28px;
  max-width:760px;
}

.v12-form input,
.v12-form select,
.v12-form textarea{
  width:100%;
  padding:14px 16px;
  border-radius:14px;
  box-sizing:border-box;
}

.v12-footer{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:30px max(18px,4vw);
}

@media(min-width:720px){

  .v12-fold{
    padding:86px 32px;
  }

  .v12-problem-grid{
    grid-template-columns:repeat(4,1fr);
  }

  .v12-capability-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .v12-profile-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .v12-trust-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .v12-proof-grid{
    grid-template-columns:repeat(4,1fr);
  }

}

@media(min-width:980px){

  .v12-hero-grid,
  .v12-sonia-grid{
    grid-template-columns:1.05fr .95fr;
    align-items:center;
  }

  .v12-capability-grid{
    grid-template-columns:repeat(3,1fr);
  }

}

@media(max-width:520px){

  .v12-header{
    align-items:flex-start;
    flex-direction:column;
  }

  .v12-header nav{
    width:100%;
  }

  .v12-fold{
    padding-top:54px;
    padding-bottom:54px;
  }

  .v12-recommendation{
    grid-template-columns:1fr;
  }

  .v12-score{
    text-align:left;
  }

}

/* === I9 P5 PREMIUM START === */

/*
 i9Startups EVO V12
 Premium Experience Layer
 Mobile-first / human / editorial / business
*/

/* ---------- GLOBAL RHYTHM ---------- */

.v12-home{
  --i9-bg:#f4f1eb;
  --i9-surface:#ffffff;
  --i9-ink:#17212b;
  --i9-muted:#65717c;
  --i9-line:rgba(23,33,43,.11);
  --i9-dark:#111c26;
  --i9-radius:24px;
  background:var(--i9-bg);
  color:var(--i9-ink);
}

.v12-home *{
  box-sizing:border-box;
}

.v12-wrap{
  width:min(1180px,100%);
}

.v12-fold{
  position:relative;
  padding:68px 20px;
}

.v12-fold + .v12-fold{
  border-top:1px solid var(--i9-line);
}

.v12-fold h1,
.v12-fold h2,
.v12-fold h3{
  letter-spacing:-.035em;
  text-wrap:balance;
}

.v12-fold p{
  color:var(--i9-muted);
  font-size:16px;
}

.v12-eyebrow{
  color:#59656e;
  font-size:10px;
  letter-spacing:.18em;
}


/* ---------- HEADER ---------- */

.v12-header{
  min-height:64px;
  padding:11px 18px;
  background:rgba(17,28,38,.94);
  box-shadow:0 8px 30px rgba(0,0,0,.08);
}

.v12-brand{
  color:#fff;
  line-height:1.05;
}

.v12-brand small{
  margin-top:4px;
  color:rgba(255,255,255,.64);
  letter-spacing:.04em;
}

.v12-header nav{
  scrollbar-width:none;
}

.v12-header nav::-webkit-scrollbar{
  display:none;
}

.v12-header nav a{
  color:rgba(255,255,255,.82);
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  min-height:40px;
  display:inline-flex;
  align-items:center;
}

.v12-header nav a:hover,
.v12-header nav a:focus-visible{
  background:#fff;
  color:#17212b;
}


/* ---------- HERO ---------- */

.v12-hero{
  background:
    radial-gradient(circle at 12% 15%,rgba(189,161,108,.14),transparent 28%),
    var(--i9-dark);
  color:#fff;
  padding-top:52px;
  padding-bottom:52px;
}

.v12-hero .v12-eyebrow,
.v12-hero p{
  color:rgba(255,255,255,.70);
}

.v12-hero h1{
  margin:12px 0 18px;
  max-width:760px;
  font-size:clamp(38px,11vw,62px);
  line-height:.98;
  color:#fff;
}

.v12-hero p{
  max-width:620px;
  font-size:17px;
}

.v12-hero-media{
  aspect-ratio:4/3;
  box-shadow:0 30px 80px rgba(0,0,0,.26);
}

.v12-hero-media img{
  object-position:center;
}

.v12-actions{
  gap:9px;
}

.v12-btn{
  min-height:48px;
  border:1px solid rgba(23,33,43,.16);
  font-weight:700;
  transition:
    transform .2s ease,
    box-shadow .2s ease,
    background .2s ease;
}

.v12-btn:hover{
  transform:translateY(-2px);
}

.v12-hero .v12-btn{
  border-color:rgba(255,255,255,.24);
  color:#fff;
}

.v12-hero .v12-btn.primary{
  background:#fff;
  color:#17212b;
}

.v12-hero .v12-btn.ghost{
  background:transparent;
}


/* ---------- PROBLEM NAVIGATOR ---------- */

#problem{
  background:#f7f5f0;
}

#problem h2{
  max-width:760px;
}

.v12-problem-grid{
  gap:10px;
}

.v12-choice{
  appearance:none;
  border:1px solid var(--i9-line);
  background:rgba(255,255,255,.82);
  color:var(--i9-ink);
  text-align:left;
  padding:16px;
  font-size:15px;
  font-weight:700;
  box-shadow:0 6px 22px rgba(23,33,43,.035);
  transition:.2s ease;
}

.v12-choice:hover,
.v12-choice:focus-visible{
  transform:translateY(-2px);
  border-color:rgba(23,33,43,.30);
  background:#fff;
}

.v12-choice.active,
.v12-choice[aria-pressed="true"]{
  background:var(--i9-dark);
  color:#fff;
}

.v12-recommendation{
  background:var(--i9-dark);
  color:#fff;
  box-shadow:0 24px 60px rgba(17,28,38,.12);
}

.v12-recommendation p,
.v12-recommendation small{
  color:rgba(255,255,255,.65);
}

.v12-score{
  white-space:nowrap;
}


/* ---------- CAPABILITIES ---------- */

#solutions{
  background:#fff;
}

.v12-capability-grid{
  gap:12px;
}

.v12-capability-card{
  position:relative;
  min-height:210px;
  display:flex;
  flex-direction:column;
  border:1px solid var(--i9-line);
  background:#faf9f6;
  box-shadow:0 8px 28px rgba(23,33,43,.035);
  transition:.22s ease;
}

.v12-capability-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 45px rgba(23,33,43,.08);
}

.v12-capability-card h3{
  margin:18px 0 8px;
  font-size:21px;
}

.v12-capability-card p{
  font-size:14px;
  margin-bottom:18px;
}

.v12-capability-cta{
  margin-top:auto;
  font-weight:750;
  color:var(--i9-ink);
}


/* ---------- BUSINESS CONTEXT ---------- */

#business-context{
  background:#eeeae2;
}

.v12-profile-grid button{
  appearance:none;
  border:1px solid var(--i9-line);
  background:#fff;
  color:var(--i9-ink);
  cursor:pointer;
  min-height:110px;
  transition:.2s ease;
}

.v12-profile-grid button:hover,
.v12-profile-grid button:focus-visible{
  transform:translateY(-3px);
  box-shadow:0 14px 34px rgba(23,33,43,.08);
}

.v12-profile-grid button.active,
.v12-profile-grid button[aria-pressed="true"]{
  background:var(--i9-dark);
  color:#fff;
}

.v12-market-title{
  font-weight:800;
  color:#59656e;
}

.v12-market-grid{
  gap:9px;
}

.v12-market-grid button{
  appearance:none;
  min-height:44px;
  border:1px solid rgba(23,33,43,.13);
  background:rgba(255,255,255,.72);
  color:var(--i9-ink);
  cursor:pointer;
  transition:.2s ease;
}

.v12-market-grid button:hover,
.v12-market-grid button:focus-visible{
  background:#fff;
  transform:translateY(-1px);
}

.v12-market-grid button.active,
.v12-market-grid button[aria-pressed="true"]{
  background:var(--i9-dark);
  color:#fff;
}


/* ---------- HUMAN TRUST ---------- */

.v12-trust{
  background:#fff;
}

.v12-trust-grid{
  gap:10px;
}

.v12-trust-grid figure{
  border-radius:22px;
  box-shadow:0 15px 42px rgba(23,33,43,.08);
}

.v12-trust-grid img{
  transition:transform .7s ease;
}

.v12-trust-grid figure:hover img{
  transform:scale(1.025);
}

.v12-proof-grid div{
  border:1px solid var(--i9-line);
  background:#f7f5f0;
}

.v12-proof-grid strong{
  letter-spacing:-.05em;
}

.v12-proof-grid span{
  color:var(--i9-muted);
  font-size:13px;
}


/* ---------- SON.IA ---------- */

.v12-sonia{
  background:
    radial-gradient(circle at 85% 15%,rgba(189,161,108,.13),transparent 30%),
    var(--i9-dark);
  color:#fff;
}

.v12-sonia .v12-eyebrow,
.v12-sonia > .v12-wrap > div > p{
  color:rgba(255,255,255,.68);
}

.v12-sonia figure{
  aspect-ratio:4/3;
  box-shadow:0 28px 70px rgba(0,0,0,.25);
}

.v12-sonia-card{
  margin-top:24px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(14px);
}

.v12-sonia-card small,
.v12-sonia-card p,
.v12-radar span,
.v12-radar p{
  color:rgba(255,255,255,.68);
}

.v12-sonia-card .v12-btn.primary{
  background:#fff;
  color:#17212b;
}


/* ---------- CONVERSION ---------- */

.v12-conversion{
  background:#f7f5f0;
}

.v12-form{
  padding:18px;
  border:1px solid var(--i9-line);
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 50px rgba(23,33,43,.06);
}

.v12-form input,
.v12-form select,
.v12-form textarea{
  min-height:50px;
  border:1px solid rgba(23,33,43,.14);
  background:#faf9f6;
  color:var(--i9-ink);
  font:inherit;
}

.v12-form textarea{
  min-height:130px;
  resize:vertical;
}

.v12-form input:focus,
.v12-form select:focus,
.v12-form textarea:focus{
  outline:2px solid rgba(23,33,43,.20);
  outline-offset:1px;
  background:#fff;
}


/* ---------- FOOTER ---------- */

.v12-footer{
  background:var(--i9-dark);
  color:#fff;
  align-items:center;
}

.v12-footer span{
  color:rgba(255,255,255,.60);
}


/* ---------- TOUCH / ACCESSIBILITY ---------- */

.v12-home button,
.v12-home a{
  -webkit-tap-highlight-color:transparent;
}

.v12-home button:focus-visible,
.v12-home a:focus-visible,
.v12-home input:focus-visible,
.v12-home textarea:focus-visible,
.v12-home select:focus-visible{
  outline:3px solid rgba(189,161,108,.55);
  outline-offset:3px;
}


/* ---------- MOBILE 320-519 ---------- */

@media(max-width:519px){

  .v12-header{
    position:sticky;
    flex-direction:column;
    align-items:stretch;
    gap:9px;
  }

  .v12-header nav{
    width:100%;
  }

  .v12-header nav a{
    flex:0 0 auto;
    min-height:38px;
  }

  .v12-fold{
    padding:58px 18px;
  }

  .v12-hero{
    padding-top:42px;
  }

  .v12-hero h1{
    font-size:clamp(38px,11.2vw,52px);
  }

  .v12-hero-media{
    aspect-ratio:1/1;
  }

  .v12-problem-grid{
    grid-template-columns:1fr 1fr;
  }

  .v12-choice{
    min-height:78px;
  }

  .v12-capability-card{
    min-height:0;
  }

  .v12-market-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .v12-market-grid button{
    border-radius:14px;
    text-align:left;
  }

  .v12-proof-grid{
    grid-template-columns:1fr 1fr;
  }

  .v12-form{
    padding:14px;
  }

}


/* ---------- TABLET ---------- */

@media(min-width:720px){

  .v12-fold{
    padding:82px 30px;
  }

  .v12-hero{
    padding-top:72px;
    padding-bottom:72px;
  }

  .v12-hero h1{
    font-size:clamp(54px,7vw,72px);
  }

  .v12-capability-grid{
    grid-template-columns:repeat(2,1fr);
  }

}


/* ---------- DESKTOP ---------- */

@media(min-width:980px){

  .v12-header{
    padding-left:max(28px,4vw);
    padding-right:max(28px,4vw);
  }

  .v12-fold{
    padding:100px 36px;
  }

  .v12-hero{
    min-height:calc(100svh - 68px);
    display:flex;
    align-items:center;
  }

  .v12-hero-grid{
    grid-template-columns:minmax(0,1.05fr) minmax(390px,.95fr);
    gap:58px;
  }

  .v12-hero h1{
    font-size:clamp(58px,5.2vw,78px);
  }

  .v12-hero-media{
    aspect-ratio:4/4.3;
    max-height:650px;
  }

  .v12-capability-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .v12-capability-card:last-child{
    grid-column:span 3;
    min-height:150px;
  }

  .v12-sonia-grid{
    grid-template-columns:.9fr 1.1fr;
    gap:64px;
  }

  .v12-sonia figure{
    aspect-ratio:4/4.2;
  }

  .v12-form{
    grid-template-columns:1fr 1fr;
    max-width:900px;
    padding:26px;
  }

  .v12-form textarea,
  .v12-form button,
  .v12-summary{
    grid-column:1/-1;
  }

}


/* ---------- LARGE DESKTOP ---------- */

@media(min-width:1440px){

  .v12-wrap{
    width:min(1240px,calc(100% - 80px));
  }

  .v12-fold{
    padding-top:112px;
    padding-bottom:112px;
  }

  .v12-hero h1{
    font-size:76px;
  }

}


/* ---------- REDUCED MOTION ---------- */

@media(prefers-reduced-motion:reduce){

  .v12-home *,
  .v12-home *::before,
  .v12-home *::after{
    scroll-behavior:auto !important;
    transition:none !important;
    animation:none !important;
  }

}

/* === I9 P5 PREMIUM END === */


/* === I9 P52 START === */

/* LANGUAGE + MENU */

.p52-tools{
 display:flex;
 align-items:center;
 gap:8px;
 margin-left:auto;
}

.p52-menu-toggle{
 min-height:42px;
 padding:8px 12px;
 border:1px solid rgba(255,255,255,.16);
 border-radius:999px;
 background:transparent;
 color:#fff;
 display:inline-flex;
 align-items:center;
 gap:7px;
 cursor:pointer;
}

.p52-languages{
 display:flex;
 align-items:center;
 gap:3px;
}

.p52-languages a{
 min-width:36px;
 min-height:36px;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 padding:5px 7px !important;
 border-radius:999px;
 font-size:11px !important;
}

.p52-languages a[aria-current="page"]{
 background:#fff;
 color:#17212b !important;
}

.p52-mobile-panel{
 position:fixed;
 z-index:150;
 top:112px;
 left:14px;
 right:14px;
 padding:12px;
 border-radius:20px;
 background:#111c26;
 box-shadow:0 24px 70px rgba(0,0,0,.28);
}

.p52-mobile-panel[hidden]{
 display:none !important;
}

.p52-mobile-panel a{
 display:flex;
 min-height:48px;
 align-items:center;
 padding:10px 14px;
 color:#fff;
 text-decoration:none;
 border-bottom:1px solid rgba(255,255,255,.09);
}

.p52-mobile-panel a:last-child{
 border-bottom:0;
}


/* JOURNEY */

.p52-journey{
 position:sticky;
 top:64px;
 z-index:80;
 display:flex;
 gap:6px;
 overflow-x:auto;
 padding:8px 14px;
 background:rgba(244,241,235,.94);
 border-bottom:1px solid rgba(23,33,43,.10);
 backdrop-filter:blur(16px);
 scrollbar-width:none;
}

.p52-journey::-webkit-scrollbar{
 display:none;
}

.p52-journey a{
 flex:0 0 auto;
 min-height:38px;
 display:flex;
 align-items:center;
 gap:6px;
 padding:6px 10px;
 border-radius:999px;
 color:#65717c;
 text-decoration:none;
 font-size:11px;
 font-weight:700;
 transition:.2s ease;
}

.p52-journey a span{
 width:22px;
 height:22px;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 border-radius:50%;
 border:1px solid rgba(23,33,43,.18);
 font-size:10px;
}

.p52-journey a.done{
 color:#17212b;
}

.p52-journey a.done span{
 background:#17212b;
 color:#fff;
 border-color:#17212b;
}

.p52-journey a.current{
 background:#fff;
 color:#17212b;
 box-shadow:0 4px 16px rgba(23,33,43,.08);
}


/* SELECTION FEEDBACK */

[data-intent].active,
[data-profile].active,
[data-p52-market].active{
 transform:translateY(-2px);
}

[data-p52-market].active{
 background:#111c26 !important;
 color:#fff !important;
}


/* MOBILE FIRST */

@media(max-width:719px){

 .v12-header{
   display:grid;
   grid-template-columns:1fr auto;
   align-items:center;
 }

 .v12-header > nav{
   display:none;
 }

 .p52-tools{
   grid-column:2;
   grid-row:1;
 }

 .p52-languages{
   position:absolute;
   right:16px;
   top:64px;
   z-index:151;
   padding:4px;
   border-radius:999px;
   background:rgba(17,28,38,.96);
 }

 .p52-journey{
   top:106px;
 }

}


/* DESKTOP */

@media(min-width:720px){

 .p52-menu-toggle{
   display:none;
 }

 .p52-mobile-panel{
   display:none !important;
 }

 .p52-journey{
   top:64px;
   justify-content:center;
 }

}

@media(min-width:1100px){

 .p52-journey a{
   padding-left:13px;
   padding-right:13px;
 }

}

/* === I9 P52 END === */



/* P9.3A VISUAL CONVERSION REFINEMENT
   Mobile-first / additive / architecture preserved
========================================================= */

/* Consistent section rhythm */

.v12-home section{
  scroll-margin-top:96px;
}

.v12-home .v12-wrap{
  width:min(100% - 32px,1180px);
  margin-inline:auto;
}

/* Stronger readable hierarchy */

.v12-home h1,
.v12-home h2,
.v12-home h3{
  text-wrap:balance;
}

.v12-home p{
  text-wrap:pretty;
}

.v12-home h2{
  max-width:18ch;
}

.v12-home section > .v12-wrap > p{
  max-width:68ch;
}

/* Journey controls must look actionable */

[data-intent],
[data-profile],
[data-p52-market]{
  cursor:pointer;
  touch-action:manipulation;
}

[data-intent]:active,
[data-profile]:active,
[data-p52-market]:active{
  transform:scale(.985);
}

/* Capabilities: reduce cognitive load */

.v12-capability-card{
  display:flex;
  flex-direction:column;
  min-width:0;
}

.v12-capability-card p{
  max-width:52ch;
}

.v12-capability-cta{
  margin-top:auto;
}

/* Selected context must be unmistakable */

[data-intent].active,
[data-profile].active,
[data-p52-market].active{
  position:relative;
}

[data-intent].active::after,
[data-profile].active::after,
[data-p52-market].active::after{
  content:"✓";
  display:inline-grid;
  place-items:center;
  width:22px;
  height:22px;
  margin-left:8px;
  border-radius:50%;
  font-size:12px;
  font-weight:800;
}

/* Son.ia becomes the principal intelligent handoff */

.v12-sonia-card{
  position:relative;
  isolation:isolate;
}

.v12-sonia-card strong{
  line-height:1.2;
}

.v12-radar{
  min-width:0;
}

/* Forms */

.v12-form input,
.v12-form select,
.v12-form textarea,
.v12-form button{
  min-height:48px;
}

.v12-form textarea{
  resize:vertical;
}

/* Avoid horizontal layout escape */

.v12-home img,
.v12-home video,
.v12-home svg{
  max-width:100%;
}

.v12-home{
  overflow-x:clip;
}


/* ======================================================
   MOBILE
====================================================== */

@media(max-width:719px){

  .v12-home .v12-wrap{
    width:min(100% - 28px,1180px);
  }

  .v12-header{
    min-height:64px;
  }

  .v12-hero{
    padding-top:28px;
  }

  .v12-hero h1{
    font-size:clamp(2rem,10vw,3.15rem);
    line-height:1.02;
  }

  .v12-hero p{
    font-size:1rem;
    line-height:1.55;
  }

  .v12-hero-media{
    min-height:260px;
  }

  .v12-hero-media img{
    width:100%;
    height:100%;
    object-fit:cover;
  }

  /* Horizontal decision rails instead of excessive height */

  .v12-profile-grid,
  .v12-market-grid{
    display:flex;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    scroll-snap-type:x proximity;
    gap:10px;
    padding-bottom:8px;
    scrollbar-width:none;
  }

  .v12-profile-grid::-webkit-scrollbar,
  .v12-market-grid::-webkit-scrollbar{
    display:none;
  }

  .v12-profile-grid button,
  .v12-market-grid button{
    flex:0 0 auto;
    scroll-snap-align:start;
    min-height:46px;
  }

  .v12-market-grid button{
    max-width:78vw;
  }

  /* Capability reading becomes linear */

  .v12-capability-grid{
    grid-template-columns:1fr;
  }

  .v12-capability-card{
    min-height:auto;
  }

  /* Sonia remains readable rather than compressed */

  .v12-sonia-grid{
    grid-template-columns:1fr;
  }

  .v12-sonia figure{
    min-height:260px;
  }

  /* Conversion form is thumb-friendly */

  .v12-form{
    grid-template-columns:1fr;
  }

  .v12-form input,
  .v12-form select,
  .v12-form textarea,
  .v12-form button{
    width:100%;
    font-size:16px;
  }

  .p52-journey{
    scroll-snap-type:x proximity;
  }

  .p52-journey a{
    scroll-snap-align:start;
  }
}


/* ======================================================
   TABLET
====================================================== */

@media(min-width:720px) and (max-width:979px){

  .v12-capability-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .v12-market-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}


/* ======================================================
   DESKTOP
====================================================== */

@media(min-width:980px){

  .v12-capability-card{
    min-height:280px;
  }

  .v12-hero-media img,
  .v12-sonia figure img{
    transition:transform .6s ease;
  }

  .v12-hero-media:hover img,
  .v12-sonia figure:hover img{
    transform:scale(1.018);
  }
}


/* Respect accessibility preferences */

@media(prefers-reduced-motion:reduce){

  .v12-home *,
  .v12-home *::before,
  .v12-home *::after{
    scroll-behavior:auto !important;
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
  }
}





/* P9.3C FINAL VISUAL SURGICAL PATCH
   Visual refinement only.
   Architecture / SEO / folds / Son.ia preserved.
============================================================ */


/* =========================================================
   1. PROBLEM -> SOLUTION
   Improve readability of photographic decision cards.
========================================================= */

.v12-home .intent{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}

.v12-home .intent::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(
      180deg,
      rgba(4,12,22,.12) 0%,
      rgba(4,12,22,.48) 54%,
      rgba(4,12,22,.82) 100%
    );
}

.v12-home .intent,
.v12-home .intent strong,
.v12-home .intent span,
.v12-home .intent small,
.v12-home .intent p{
  color:#fff;
  text-shadow:0 1px 12px rgba(0,0,0,.42);
}

.v12-home .intent.active::before{
  background:
    linear-gradient(
      180deg,
      rgba(0,55,92,.08) 0%,
      rgba(0,55,92,.42) 50%,
      rgba(0,35,66,.88) 100%
    );
}

.v12-home .intent:focus-visible{
  outline:3px solid currentColor;
  outline-offset:3px;
}


/* =========================================================
   2. CAPABILITY MICRO-IDENTITY
========================================================= */

.v12-capability-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}

.v12-capability-card::before{
  content:attr(data-p93c-cap);
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  margin-bottom:18px;
  border-radius:12px;
  border:1px solid rgba(20,72,110,.18);
  background:rgba(20,72,110,.07);
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.08em;
}

.v12-capability-card::after{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:3px;
  opacity:.72;
  background:linear-gradient(
    90deg,
    currentColor,
    transparent 70%
  );
}

.v12-capability-card:hover{
  transform:translateY(-2px);
}

.v12-capability-cta{
  font-weight:750;
}


/* =========================================================
   3. MARKET CONTEXT
   Market selections become visually differentiated without
   adding another fold or ten permanent images.
========================================================= */

[data-p52-market="true"]{
  position:relative;
}

[data-p52-market="true"]::before{
  content:attr(data-p93c-market);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:24px;
  height:24px;
  margin-right:7px;
  padding:0 5px;
  border-radius:999px;
  font-size:.65rem;
  font-weight:850;
  letter-spacing:.04em;
  opacity:.72;
  border:1px solid currentColor;
}

[data-p52-market="true"].active{
  box-shadow:
    0 10px 30px rgba(4,25,45,.12),
    inset 0 0 0 1px currentColor;
}


/* Context panel generated by JS */

.p93c-market-context{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:14px;
  margin-top:18px;
  padding:18px;
  border-radius:18px;
  border:1px solid rgba(20,72,110,.13);
  background:
    linear-gradient(
      135deg,
      rgba(20,72,110,.055),
      rgba(255,255,255,.72)
    );
}

.p93c-market-context[hidden]{
  display:none !important;
}

.p93c-market-eyebrow{
  margin:0 0 4px;
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.66;
}

.p93c-market-title{
  margin:0;
  font-size:clamp(1.05rem,2vw,1.35rem);
  line-height:1.18;
}

.p93c-market-copy{
  margin:6px 0 0;
  max-width:68ch;
  line-height:1.55;
}


/* =========================================================
   4. FINAL CTA
========================================================= */

#leadForm button[type="submit"]{
  min-height:52px;
  font-weight:850;
  letter-spacing:-.01em;
}

#leadForm button[type="submit"]::after{
  content:" →";
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:719px){

  .v12-home .intent{
    min-height:150px;
  }

  .v12-capability-card::before{
    width:34px;
    height:34px;
    margin-bottom:14px;
  }

  .p93c-market-context{
    padding:16px;
    border-radius:16px;
  }

  #leadForm button[type="submit"]{
    min-height:54px;
  }
}


/* =========================================================
   ACCESSIBILITY
========================================================= */

@media(prefers-reduced-motion:reduce){

  .v12-capability-card:hover{
    transform:none;
  }

}





/* P9.3D1 MOBILE HEADER UX PRIME
========================================================= */

@media(max-width:719px){

  .v12-header{
    min-height:66px;
    height:66px;
    padding:0 14px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
    position:sticky;
    top:0;
    z-index:160;
    background:rgba(10,22,34,.94);
    -webkit-backdrop-filter:blur(14px);
    backdrop-filter:blur(14px);
    box-shadow:0 1px 0 rgba(255,255,255,.08);
  }

  .v12-header .brand,
  .v12-header .v12-brand{
    min-width:0;
    max-width:100%;
  }

  .p93d-prime-tools{
    position:static;
    grid-column:2;
    grid-row:1;
    display:flex;
    align-items:center;
    gap:7px;
    margin-left:auto;
  }

  /* LANGUAGE */

  .p93d-language{
    position:relative;
  }

  .p93d-language-toggle,
  .p93d-menu-toggle{
    min-width:44px;
    height:44px;
    min-height:44px;
    border:1px solid rgba(255,255,255,.14);
    background:rgba(255,255,255,.055);
    color:#fff;
    border-radius:14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }

  .p93d-language-toggle{
    width:auto;
    padding:0 10px;
    gap:5px;
    font-size:11px;
  }

  .p93d-language-toggle strong{
    font-size:11px;
    letter-spacing:.05em;
  }

  .p93d-chevron{
    opacity:.58;
    transition:transform .18s ease;
  }

  .p93d-language-toggle[aria-expanded="true"] .p93d-chevron{
    transform:rotate(180deg);
  }

  .p52-languages.p93d-language-panel{
    position:absolute;
    top:50px;
    right:0;
    left:auto;
    z-index:190;
    display:grid;
    grid-template-columns:repeat(2,44px);
    gap:5px;
    width:auto;
    padding:7px;
    border-radius:16px;
    background:rgba(13,25,37,.985);
    border:1px solid rgba(255,255,255,.1);
    box-shadow:0 18px 50px rgba(0,0,0,.35);
  }

  .p52-languages.p93d-language-panel[hidden]{
    display:none !important;
  }

  .p52-languages.p93d-language-panel a{
    width:44px;
    min-width:44px;
    height:42px;
    min-height:42px;
    padding:0 !important;
    font-size:11px !important;
    border-radius:11px;
  }

  /* HAMBURGER */

  .p93d-menu-toggle{
    padding:0;
  }

  .p93d-menu-icon{
    width:18px;
    height:14px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
  }

  .p93d-menu-icon i{
    display:block;
    width:18px;
    height:1.5px;
    border-radius:99px;
    background:currentColor;
    transition:
      transform .2s ease,
      opacity .2s ease;
  }

  .p93d-menu-toggle[aria-expanded="true"]
  .p93d-menu-icon i:nth-child(1){
    transform:translateY(6px) rotate(45deg);
  }

  .p93d-menu-toggle[aria-expanded="true"]
  .p93d-menu-icon i:nth-child(2){
    opacity:0;
  }

  .p93d-menu-toggle[aria-expanded="true"]
  .p93d-menu-icon i:nth-child(3){
    transform:translateY(-6px) rotate(-45deg);
  }

  /* DRAWER */

  .p52-mobile-panel.p93d-mobile-panel{
    position:fixed;
    z-index:155;
    top:72px;
    left:10px;
    right:10px;
    max-height:calc(100dvh - 82px);
    overflow-y:auto;
    overscroll-behavior:contain;
    padding:12px;
    border-radius:22px;
    background:rgba(12,24,36,.985);
    border:1px solid rgba(255,255,255,.09);
    box-shadow:0 28px 80px rgba(0,0,0,.42);
    -webkit-backdrop-filter:blur(20px);
    backdrop-filter:blur(20px);
  }

  .p93d-menu-group{
    padding:7px 5px 10px;
  }

  .p93d-menu-group + .p93d-menu-group{
    border-top:1px solid rgba(255,255,255,.08);
    padding-top:14px;
  }

  .p93d-menu-group small{
    display:block;
    padding:0 9px 7px;
    color:rgba(255,255,255,.48);
    font-size:9px;
    font-weight:850;
    letter-spacing:.14em;
  }

  .p52-mobile-panel.p93d-mobile-panel a{
    min-height:46px;
    padding:9px 10px;
    border:0;
    border-radius:12px;
    font-size:14px;
    font-weight:650;
  }

  .p52-mobile-panel.p93d-mobile-panel a:hover,
  .p52-mobile-panel.p93d-mobile-panel a:focus-visible{
    background:rgba(255,255,255,.065);
  }

  .p52-mobile-panel
  .p93d-primary-action{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:2px;
    background:#fff;
    color:#102131 !important;
    font-weight:850 !important;
  }

  .p93d-primary-action span{
    font-size:18px;
  }

  .p93d-drawer-languages{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    padding:12px 5px 3px;
    border-top:1px solid rgba(255,255,255,.08);
  }

  .p93d-drawer-languages a{
    min-width:42px !important;
    width:42px;
    min-height:38px !important;
    height:38px;
    padding:0 !important;
    display:grid !important;
    place-items:center;
    border:1px solid rgba(255,255,255,.1) !important;
    border-radius:999px !important;
    font-size:10px !important;
  }

  .p93d-drawer-languages a[aria-current="page"]{
    background:#fff !important;
    color:#102131 !important;
  }

  /* Journey immediately follows compact header */

  .p52-journey{
    top:66px;
  }

  .v12-hero{
    padding-top:32px;
  }

}


/* Desktop remains governed by existing V12/P52 rules */

@media(min-width:720px){

  .p93d-language-toggle{
    display:none;
  }

  .p93d-drawer-languages{
    display:none;
  }

}





/* P9.3D2 HEADER AND CHALLENGE RECOVERY
   Corrects visual regressions without changing architecture.
============================================================ */


/* =========================================================
   A. RESTORE PROBLEM CARD PHOTOGRAPHY
========================================================= */

.v12-home .intent::before{

  content:"" !important;

  position:absolute !important;
  inset:0 !important;

  z-index:-1 !important;

  background-image:
    linear-gradient(
      180deg,
      rgba(5,15,27,.08) 0%,
      rgba(5,15,27,.22) 34%,
      rgba(5,15,27,.70) 76%,
      rgba(5,15,27,.91) 100%
    ),
    var(--human-image) !important;

  background-size:
    cover,
    cover !important;

  background-position:
    center,
    center !important;

  background-repeat:
    no-repeat,
    no-repeat !important;

  opacity:1 !important;
}


/* Selected problem remains visually stronger */

.v12-home .intent.active::before{

  background-image:
    linear-gradient(
      180deg,
      rgba(0,42,70,.04) 0%,
      rgba(0,42,70,.22) 35%,
      rgba(0,38,70,.70) 75%,
      rgba(0,28,52,.94) 100%
    ),
    var(--human-image) !important;
}


/* Text must always remain legible */

.v12-home .intent,
.v12-home .intent strong,
.v12-home .intent small,
.v12-home .intent span,
.v12-home .intent p{
  color:#fff !important;
  text-shadow:
    0 2px 14px rgba(0,0,0,.48);
}


/* =========================================================
   B. DESKTOP — DOUBLE VISUAL PRESENCE
========================================================= */

@media(min-width:720px){

  .v12-problem-grid .intent{
    min-height:320px !important;
    padding:24px !important;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
  }

  .v12-problem-grid .intent strong{
    font-size:clamp(
      1rem,
      1.45vw,
      1.26rem
    );
    line-height:1.15;
  }

  .v12-problem-grid .intent small{
    margin-top:7px;
    line-height:1.4;
  }

}


/* =========================================================
   C. MOBILE CARDS
========================================================= */

@media(max-width:719px){

  .v12-problem-grid .intent{
    min-height:180px !important;
    padding:16px !important;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
  }

  .v12-problem-grid .intent::before{
    background-position:
      center,
      center !important;
  }

}


/* =========================================================
   D. MOBILE HEADER / JOURNEY UX PRIME
========================================================= */

@media(max-width:719px){

  /* Single compact navigation plane */

  .v12-header{
    height:66px !important;
    min-height:66px !important;
  }

  /*
   * Journey 1–6 becomes a compact contextual rail,
   * not another oversized header.
   */

  .p52-journey{
    top:66px !important;
    min-height:48px;
    height:48px;

    display:flex;
    align-items:center;

    gap:6px;

    padding:
      5px
      10px;

    overflow-x:auto;
    overflow-y:hidden;

    scroll-snap-type:
      x proximity;

    scrollbar-width:none;

    background:
      rgba(247,249,251,.96);

    -webkit-backdrop-filter:
      blur(12px);

    backdrop-filter:
      blur(12px);

    border-bottom:
      1px solid
      rgba(17,33,48,.08);
  }

  .p52-journey::-webkit-scrollbar{
    display:none;
  }

  .p52-journey a{

    flex:0 0 auto;

    min-height:36px;

    padding:
      0
      9px !important;

    display:inline-flex;

    align-items:center;

    gap:5px;

    border-radius:999px;

    font-size:10px !important;

    line-height:1;

    white-space:nowrap;

    scroll-snap-align:start;
  }

  .p52-journey a span{

    width:22px;
    height:22px;

    min-width:22px;

    display:inline-grid;

    place-items:center;

    border-radius:50%;

    font-size:9px;

    font-weight:850;
  }

  .p52-journey a.current{
    font-weight:800;
  }

  /* Hero begins immediately after header + journey */

  .v12-hero{
    padding-top:28px !important;
  }

}


/* Very narrow screens */

@media(max-width:390px){

  .p52-journey a{
    padding:
      0
      7px !important;
  }

  .p52-journey a span{
    width:21px;
    height:21px;
    min-width:21px;
  }

}





/* P9.3D3B MOBILE MENU UX PRIME
   Mobile drawer final hierarchy.
========================================================= */

@media(max-width:719px){

  .p52-mobile-panel.p93d3-prime-drawer{
    top:72px;
    left:10px;
    right:10px;
    width:auto;
    padding:20px 16px 14px;
    border-radius:24px;

    background:
      linear-gradient(
        145deg,
        rgba(15,29,43,.99),
        rgba(8,19,30,.995)
      );

    border:
      1px solid
      rgba(255,255,255,.09);

    box-shadow:
      0 28px 80px
      rgba(0,0,0,.44);

    color:#fff;
  }


  .p93d3-intro{
    padding:1px 3px 14px;
    margin:0;

    font-size:
      clamp(
        18px,
        4.8vw,
        21px
      );

    line-height:1.12;
    font-weight:800;
    letter-spacing:-.025em;
    color:#fff;
  }


  .p52-mobile-panel
  .p93d3-main-cta{
    width:100%;
    min-height:56px;

    margin:0 0 12px;
    padding:0 17px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    border:0;
    border-radius:16px;

    background:#fff;
    color:#102131 !important;

    font-size:14px;
    font-weight:850;

    box-shadow:
      0 10px 28px
      rgba(0,0,0,.17);
  }


  .p93d3-main-cta strong{
    font-size:20px;
    line-height:1;
  }


  .p93d3-menu-grid{
    display:grid;

    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      );

    gap:9px;
  }


  .p52-mobile-panel
  .p93d3-menu-card{
    min-width:0;
    min-height:116px;

    padding:13px 12px;

    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;

    border:1px solid
      rgba(255,255,255,.085);

    border-radius:16px;

    background:
      rgba(255,255,255,.045);

    color:#fff !important;
    text-align:left;
  }


  .p93d3-menu-symbol{
    width:29px;
    height:29px;

    margin-bottom:10px;

    display:grid;
    place-items:center;

    border-radius:9px;

    border:
      1px solid
      rgba(255,255,255,.12);

    background:
      rgba(255,255,255,.055);

    color:
      rgba(255,255,255,.84);

    font-size:11px;
    font-weight:850;
  }


  .p93d3-menu-card strong{
    margin:0 0 4px;

    font-size:13px;
    line-height:1.15;
    font-weight:820;
    color:#fff;
  }


  .p93d3-menu-card small{
    display:block;
    margin:0;

    max-width:18ch;

    font-size:9.5px;
    line-height:1.35;
    font-weight:500;

    color:
      rgba(255,255,255,.53);
  }


  .p52-mobile-panel
  .p93d3-orientation{
    min-height:48px;

    margin-top:12px;
    padding:0 5px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    border:0;
    border-top:
      1px solid
      rgba(255,255,255,.08);

    border-radius:0;

    background:transparent;

    color:
      rgba(255,255,255,.83) !important;

    font-size:12px;
    font-weight:750;
  }


  .p93d3-menu-card:active,
  .p93d3-main-cta:active{
    transform:scale(.985);
  }


  /*
   * Critical:
   * languages exist only in header selector.
   */

  .p93d3-prime-drawer
  a[lang]{
    display:none !important;
  }

}


@media(max-width:370px){

  .p52-mobile-panel
  .p93d3-menu-card{
    min-height:108px;
    padding:11px 10px;
  }

  .p93d3-menu-card small{
    font-size:9px;
  }

}



/* ============================================================
   P9.3E1.2C FINAL MOBILE MENU HARMONY
   ============================================================ */

@media(max-width:719px){

  .p52-mobile-panel.p93d3-prime-drawer{

    background:
      radial-gradient(
        circle at 90% 0%,
        rgba(132,93,214,.38),
        transparent 40%
      ),
      radial-gradient(
        circle at 0% 100%,
        rgba(41,121,192,.34),
        transparent 46%
      ),
      linear-gradient(
        135deg,
        rgba(35,55,108,.985) 0%,
        rgba(60,55,126,.985) 52%,
        rgba(36,77,128,.985) 100%
      ) !important;

    border:
      1px solid rgba(222,230,255,.18) !important;

    box-shadow:
      0 22px 60px rgba(10,24,62,.30) !important;

    -webkit-backdrop-filter:
      blur(22px) saturate(140%) !important;

    backdrop-filter:
      blur(22px) saturate(140%) !important;
  }


  .p93d3-intro{
    color:#fff !important;
  }


  .p52-mobile-panel
  .p93d3-main-cta{

    background:
      linear-gradient(
        135deg,
        rgba(128,102,216,.98),
        rgba(57,126,197,.98)
      ) !important;

    color:#fff !important;

    border:
      1px solid rgba(255,255,255,.20) !important;

    box-shadow:
      0 10px 26px rgba(14,32,80,.24) !important;
  }


  .p52-mobile-panel
  .p93d3-menu-card{

    background:
      linear-gradient(
        145deg,
        rgba(255,255,255,.105),
        rgba(255,255,255,.048)
      ) !important;

    border:
      1px solid rgba(232,237,255,.14) !important;

    color:#fff !important;
  }


  .p52-mobile-panel
  .p93d3-menu-card strong{
    color:#fff !important;
  }


  .p52-mobile-panel
  .p93d3-menu-card small{
    color:rgba(235,241,255,.76) !important;
  }


  .p93d3-menu-symbol{

    background:
      rgba(255,255,255,.08) !important;

    border:
      1px solid rgba(255,255,255,.15) !important;

    color:#fff !important;
  }


  .p52-mobile-panel
  .p93d3-orientation{

    color:rgba(244,247,255,.92) !important;

    border-top:
      1px solid rgba(235,240,255,.13) !important;
  }

}


/* ============================================================
   LIVE JOURNEY PANEL
   ============================================================ */

.i9-live-journey{

  grid-column:1/-1;

  margin:4px 0 12px;

  padding:16px;

  border-radius:18px;

  border:
    1px solid rgba(73,91,165,.16);

  background:
    linear-gradient(
      135deg,
      rgba(66,102,170,.06),
      rgba(112,78,170,.055)
    );
}


.i9-live-head{

  display:flex;

  align-items:flex-start;

  justify-content:space-between;

  gap:12px;

  margin-bottom:12px;
}


.i9-live-head strong{

  display:block;

  font-size:.88rem;

  line-height:1.2;
}


.i9-live-head small{

  display:block;

  margin-top:3px;

  font-size:.69rem;

  opacity:.58;
}


.i9-live-progress{

  font-size:.67rem;

  font-weight:800;

  white-space:nowrap;

  opacity:.58;
}


.i9-live-grid{

  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:7px;
}


.i9-live-item{

  min-width:0;

  padding:9px 10px;

  border-radius:12px;

  border:
    1px solid rgba(62,86,142,.10);

  background:
    rgba(255,255,255,.67);
}


.i9-live-item small{

  display:block;

  margin-bottom:3px;

  font-size:.59rem;

  font-weight:850;

  letter-spacing:.06em;

  text-transform:uppercase;

  opacity:.47;
}


.i9-live-item strong{

  display:block;

  font-size:.72rem;

  line-height:1.25;

  overflow:hidden;

  text-overflow:ellipsis;
}


.i9-live-item.empty{
  opacity:.40;
}


.i9-auto-field{

  box-shadow:
    inset 3px 0 0
    rgba(77,93,190,.50) !important;
}


@media(max-width:719px){

  .i9-live-journey{
    padding:14px;
  }

  .i9-live-grid{
    grid-template-columns:1fr;
  }

}

/* ============================================================
   P9.3F MOBILE PRIME NAVY GLASS
   One visual system: header -> drawer -> journey
   ============================================================ */

@media(max-width:719px){

 .p52-mobile-panel.p93d3-prime-drawer{

   background:
     linear-gradient(
       180deg,
       rgba(11,25,54,.985) 0%,
       rgba(16,34,67,.982) 58%,
       rgba(18,39,74,.985) 100%
     ) !important;

   border:
     1px solid rgba(255,255,255,.10) !important;

   box-shadow:
     0 24px 64px rgba(3,12,32,.36) !important;

   -webkit-backdrop-filter:
     blur(20px) !important;

   backdrop-filter:
     blur(20px) !important;
 }


 .p52-mobile-panel .p93d3-main-cta{

   background:
     rgba(255,255,255,.96) !important;

   color:
     #10244a !important;

   border:
     1px solid rgba(255,255,255,.96) !important;

   box-shadow:
     0 8px 22px rgba(0,0,0,.16) !important;
 }


 .p52-mobile-panel .p93d3-menu-card{

   background:
     rgba(255,255,255,.055) !important;

   border:
     1px solid rgba(255,255,255,.085) !important;

   box-shadow:none !important;

   color:#fff !important;
 }


 .p52-mobile-panel .p93d3-menu-card:hover,
 .p52-mobile-panel .p93d3-menu-card:focus{

   background:
     rgba(255,255,255,.095) !important;

   border-color:
     rgba(255,255,255,.16) !important;
 }


 .p93d3-menu-symbol{

   background:
     rgba(255,255,255,.055) !important;

   border:
     1px solid rgba(255,255,255,.10) !important;

   color:
     rgba(255,255,255,.92) !important;
 }


 .p52-mobile-panel .p93d3-menu-card small{

   color:
     rgba(225,233,247,.66) !important;
 }


 .p52-mobile-panel .p93d3-orientation{

   color:
     rgba(230,237,249,.74) !important;

   border-top:
     1px solid rgba(255,255,255,.08) !important;
 }

}


/* Recommendation becomes explanatory, not cryptic */

.v12-recommendation #recCopy{

 max-width:760px;

 line-height:1.58;

 font-size:clamp(.9rem,1.15vw,1rem);
}


.p93f-score-label{

 display:block;

 margin-bottom:5px;

 font-size:.58rem;

 line-height:1.2;

 font-weight:850;

 letter-spacing:.08em;

 text-transform:uppercase;

 opacity:.62;
}


.p93f-score-info{

 max-width:190px;

 margin:7px 0 0;

 font-size:.61rem;

 line-height:1.35;

 opacity:.58;
}


@media(max-width:719px){

 .p93f-score-info{
   max-width:none;
 }

 .v12-recommendation #recCopy{
   line-height:1.5;
 }

}

/* ============================================================
   P9.3G SMART JOURNEY UX
   ============================================================ */

/*
 * Completed navigation step
 */
a.i9-step-complete{

 position:relative;

 opacity:1 !important;

 border-color:
   rgba(117,177,224,.34) !important;

 background:
   rgba(91,145,195,.09) !important;

 transition:
   background .22s ease,
   border-color .22s ease,
   opacity .22s ease,
   transform .22s ease;
}


a.i9-step-complete::after{

 content:"✓";

 display:inline-flex;

 align-items:center;
 justify-content:center;

 width:18px;
 height:18px;

 margin-left:7px;

 border-radius:50%;

 background:
   rgba(112,180,221,.16);

 border:
   1px solid rgba(130,193,229,.34);

 color:inherit;

 font-size:.64rem;
 font-weight:900;

 vertical-align:middle;
}


/*
 * Next stage
 */
a.i9-step-current{

 opacity:1 !important;

 box-shadow:
   inset 0 -2px 0
   rgba(129,177,223,.72);
}


/*
 * Form journey progress
 */
.i9-journey-progress{

 display:flex;

 align-items:center;

 gap:8px;

 margin:
   0 0 13px;

 padding:
   8px 10px;

 border-radius:11px;

 background:
   rgba(61,94,158,.055);

 font-size:.69rem;

 line-height:1.2;
}


.i9-progress-dot{

 width:7px;
 height:7px;

 flex:0 0 7px;

 border-radius:50%;

 background:
   currentColor;

 opacity:.58;
}


/*
 * Journey-owned fields remain available to JS/API
 * but disappear from the user-facing form.
 */
.i9-journey-hidden-field{

 position:absolute !important;

 width:1px !important;
 height:1px !important;

 padding:0 !important;
 margin:-1px !important;

 overflow:hidden !important;

 clip:
   rect(0,0,0,0) !important;

 white-space:nowrap !important;

 border:0 !important;

 opacity:0 !important;

 pointer-events:none !important;
}


/*
 * Optional human complement
 */
.i9-optional-context{

 grid-column:1/-1;

 display:block;

 margin-top:3px;
}


.i9-optional-context > span{

 display:block;

 margin-bottom:7px;

 font-size:.72rem;

 font-weight:750;
}


.i9-optional-context textarea{

 box-sizing:border-box;

 width:100%;

 min-height:84px;

 resize:vertical;

 padding:12px 13px;

 border:
   1px solid rgba(69,88,133,.16);

 border-radius:12px;

 background:
   rgba(255,255,255,.72);

 color:inherit;

 font:inherit;

 line-height:1.45;

 outline:none;

 transition:
   border-color .2s ease,
   box-shadow .2s ease,
   background .2s ease;
}


.i9-optional-context textarea:focus{

 background:#fff;

 border-color:
   rgba(72,108,177,.40);

 box-shadow:
   0 0 0 3px
   rgba(72,108,177,.07);
}


/*
 * Mobile: completion needs to remain discreet.
 */
@media(max-width:719px){

 a.i9-step-complete::after{

   width:16px;
   height:16px;

   margin-left:5px;

   font-size:.58rem;
 }


 .i9-journey-progress{

   font-size:.66rem;

   padding:8px 9px;
 }

}

/* ============================================================
   P9.3H1 CTA HARMONY
   ============================================================ */

#executive-form .v12-btn.primary,
#leadForm .v12-btn.primary{

  background:
    linear-gradient(
      135deg,
      #173b70 0%,
      #23558f 100%
    ) !important;

  color:
    #ffffff !important;

  border:
    1px solid
    rgba(24,61,111,.85) !important;

  box-shadow:
    0 8px 24px
    rgba(23,59,112,.16) !important;

  font-weight:800;

  letter-spacing:.01em;

  text-shadow:none !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    background .18s ease;
}


#executive-form .v12-btn.primary:hover,
#leadForm .v12-btn.primary:hover{

  background:
    linear-gradient(
      135deg,
      #204b84 0%,
      #2b65a5 100%
    ) !important;

  color:#ffffff !important;

  transform:
    translateY(-1px);

  box-shadow:
    0 12px 30px
    rgba(23,59,112,.22) !important;
}


#executive-form .v12-btn.primary:focus-visible,
#leadForm .v12-btn.primary:focus-visible{

  outline:
    3px solid
    rgba(55,115,185,.25);

  outline-offset:3px;
}


#executive-form .v12-btn.primary:disabled,
#leadForm .v12-btn.primary:disabled{

  opacity:.72;

  color:#ffffff !important;

  cursor:wait;
}


@media(max-width:719px){

  #executive-form .v12-btn.primary,
  #leadForm .v12-btn.primary{

    width:100%;

    min-height:52px;

    justify-content:center;

    text-align:center;
  }

}


/* P9.4B MOBILE JOURNEY RAIL */

@media(max-width:719px){

  .v12-progress-nav,
  .v12-step-nav,
  .v12-journey-nav,
  .v12-journey-steps,
  .i9-journey-nav,
  .i9-journey-steps,
  [data-journey-nav]{

    display:flex !important;
    flex-wrap:nowrap !important;

    justify-content:flex-start !important;
    align-items:center;

    gap:8px !important;

    width:100% !important;
    max-width:100% !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    box-sizing:border-box !important;

    padding:4px 14px 10px !important;

    scroll-snap-type:x proximity;
    scroll-padding-inline:14px;

    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;

    scrollbar-width:none;
  }


  .v12-progress-nav::-webkit-scrollbar,
  .v12-step-nav::-webkit-scrollbar,
  .v12-journey-nav::-webkit-scrollbar,
  .v12-journey-steps::-webkit-scrollbar,
  .i9-journey-nav::-webkit-scrollbar,
  .i9-journey-steps::-webkit-scrollbar,
  [data-journey-nav]::-webkit-scrollbar{

    display:none;
  }


  .v12-progress-nav > *,
  .v12-step-nav > *,
  .v12-journey-nav > *,
  .v12-journey-steps > *,
  .i9-journey-nav > *,
  .i9-journey-steps > *,
  [data-journey-nav] > *{

    flex:0 0 auto !important;

    min-width:max-content !important;

    scroll-snap-align:start;
  }


  .v12-progress-nav a,
  .v12-step-nav a,
  .v12-journey-nav a,
  .v12-journey-steps a,
  .i9-journey-nav a,
  .i9-journey-steps a,
  [data-journey-nav] a{

    white-space:nowrap !important;

    min-height:40px;

    display:inline-flex;

    align-items:center;
    justify-content:center;
  }

}


/* P9.4B FINAL CTA WHITE TEXT */

html body #leadForm button.v12-btn.primary[type="submit"],
html body #executive-form #leadForm button.v12-btn.primary[type="submit"]{

  background:
    linear-gradient(
      135deg,
      #173b70 0%,
      #23558f 100%
    ) !important;

  color:#ffffff !important;

  -webkit-text-fill-color:#ffffff !important;

  border-color:#173b70 !important;

  text-shadow:none !important;

  opacity:1 !important;
}


html body #leadForm button.v12-btn.primary[type="submit"]:hover,
html body #leadForm button.v12-btn.primary[type="submit"]:focus,
html body #leadForm button.v12-btn.primary[type="submit"]:focus-visible,
html body #leadForm button.v12-btn.primary[type="submit"]:active,
html body #leadForm button.v12-btn.primary[type="submit"]:disabled{

  color:#ffffff !important;

  -webkit-text-fill-color:#ffffff !important;
}


@media(max-width:719px){

  html body #leadForm button.v12-btn.primary[type="submit"]{

    width:100% !important;

    min-height:52px;

    text-align:center;

    justify-content:center;
  }

}



/* P9.4D EXACT HERO CTA + MOBILE RAIL */


/* ------------------------------------------------------------
   HERO CTA
   ------------------------------------------------------------ */

html body [data-i9-hero-cta="true"]{

  color:#ffffff !important;

  -webkit-text-fill-color:#ffffff !important;

  text-shadow:none !important;
}


html body [data-i9-hero-cta="true"] *,
html body [data-i9-hero-cta="true"]:hover,
html body [data-i9-hero-cta="true"]:focus,
html body [data-i9-hero-cta="true"]:focus-visible,
html body [data-i9-hero-cta="true"]:active{

  color:#ffffff !important;

  -webkit-text-fill-color:#ffffff !important;
}



/* ------------------------------------------------------------
   MOBILE JOURNEY RAIL
   ------------------------------------------------------------ */

@media(max-width:719px){

  html,
  body{

    width:100%;
    max-width:100%;

    overflow-x:hidden;
  }


  [data-i9-mobile-rail="true"]{

    display:flex !important;

    flex-direction:row !important;
    flex-wrap:nowrap !important;

    justify-content:flex-start !important;
    align-items:stretch !important;

    gap:8px !important;

    width:100% !important;
    max-width:100% !important;

    min-width:0 !important;

    margin-left:0 !important;
    margin-right:0 !important;

    padding:
      4px 14px 10px !important;

    box-sizing:border-box !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    -webkit-overflow-scrolling:
      touch;

    overscroll-behavior-x:
      contain;

    scroll-snap-type:
      x mandatory;

    scroll-padding-left:
      14px;

    scrollbar-width:
      none;
  }


  [data-i9-mobile-rail="true"]::-webkit-scrollbar{

    display:none;
  }


  [data-i9-mobile-rail="true"]
  > [data-i9-rail-item="true"]{

    flex:
      0 0 auto !important;

    width:auto !important;

    max-width:
      calc(82vw - 28px) !important;

    min-width:
      128px !important;

    box-sizing:
      border-box !important;

    scroll-snap-align:
      start;
  }


  [data-i9-mobile-rail="true"]
  > [data-i9-rail-item="true"] a,

  [data-i9-mobile-rail="true"]
  > [data-i9-rail-item="true"] button{

    width:100%;

    min-height:42px;

    box-sizing:
      border-box;

    white-space:
      nowrap;
  }

}

/* ==========================================================
   i9Startups R5D - Company Size
   ========================================================== */

.i9-company-size {
  width:100%;
  margin:22px 0;
}

.i9-company-size-label {
  display:block;
  margin-bottom:10px;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.68;
}

.i9-company-size-options {
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}

.i9-company-size-options button {
  appearance:none;
  border:1px solid rgba(20,20,20,.16);
  background:rgba(255,255,255,.72);
  color:inherit;
  border-radius:999px;
  padding:9px 17px;
  font:inherit;
  font-weight:650;
  cursor:pointer;
}

.i9-company-size-options button[data-i9-context-captured="true"] {
  background:#171717;
  border-color:#171717;
  color:#fff;
}

@media (max-width:767px) {
  .i9-company-size-options {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
  }

  .i9-company-size-options button {
    width:100%;
    padding:10px 5px;
    font-size:.84rem;
  }
}

/* ==========================================================
   END i9Startups R5D
   ========================================================== */

/* ==========================================================
   i9Startups R5E-FINAL - Journey cleanup
   ========================================================== */

[href="#sonia"],
[href="#executive-form"] {
  display:none !important;
}

/* Primary journey should now represent only the diagnostic flow */
.p52-journey,
.p93c-journey,
.v12-journey,
[class*="journey"] {
  justify-content:center;
}

/* ==========================================================
   END i9Startups R5E-FINAL
   ========================================================== */

/* =========================================================
   I9_R5E2_PRIMARY_CONTEXT
   ========================================================= */

.i9-primary-context{
  margin:0 0 28px;
  padding:24px;
  border:1px solid rgba(94,123,181,.22);
  border-radius:24px;
  background:rgba(248,249,253,.92);
}

.i9-primary-context-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  margin-bottom:20px;
}

.i9-primary-context-head h3{
  margin:0 0 4px;
}

.i9-primary-context-head p{
  margin:0;
  opacity:.65;
}

.i9-primary-context-head > strong{
  white-space:nowrap;
  opacity:.65;
}

.i9-primary-context-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.i9-primary-context-card{
  min-width:0;
  padding:18px 20px;
  border:1px solid rgba(94,123,181,.15);
  border-radius:18px;
  background:#fff;
}

.i9-primary-context-card span{
  display:block;
  margin-bottom:7px;
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.08em;
  opacity:.52;
}

.i9-primary-context-card strong{
  display:block;
  overflow-wrap:anywhere;
  font-size:1rem;
}

@media (max-width:720px){
  .i9-primary-context{
    padding:18px;
    border-radius:20px;
  }

  .i9-primary-context-head{
    display:block;
  }

  .i9-primary-context-head > strong{
    display:block;
    margin-top:10px;
  }

  .i9-primary-context-grid{
    grid-template-columns:1fr;
  }
}

/* /I9_R5E2_PRIMARY_CONTEXT */

/* ==========================================================
   I9STARTUPS R5F - UNIFIED HEADER FINAL
   Problema > Contexto > Mercado > Solucao
   ========================================================== */

/* Hide legacy duplicated institutional navigation. */
.v12-header > nav {
  display:none !important;
}

/*
 * Journey becomes the primary header navigation.
 * Same visual language as the original dark header.
 */
.p52-journey,
.p93c-journey,
.v12-journey {
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;

  z-index:1500 !important;

  min-height:76px;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;

  margin:0 !important;
  padding:11px 245px 11px 245px !important;

  background:#1f2b35 !important;
  border:0 !important;
  border-radius:0 !important;

  box-shadow:
    0 1px 0 rgba(255,255,255,.06),
    0 8px 26px rgba(0,0,0,.10);
}

.p52-journey a,
.p93c-journey a,
.v12-journey a {
  min-height:44px;

  display:inline-flex !important;
  align-items:center;
  justify-content:center;

  gap:8px;

  padding:8px 16px !important;

  color:rgba(255,255,255,.88) !important;
  background:transparent !important;

  border:1px solid rgba(255,255,255,.17) !important;
  border-radius:999px !important;

  text-decoration:none !important;
  font-weight:650;
  white-space:nowrap;
}

.p52-journey a:hover,
.p93c-journey a:hover,
.v12-journey a:hover {
  background:rgba(255,255,255,.055) !important;
  border-color:rgba(255,255,255,.30) !important;
}

.p52-journey a.is-active,
.p52-journey a.is-complete,
.p93c-journey a.is-active,
.p93c-journey a.is-complete,
.v12-journey a.is-active,
.v12-journey a.is-complete,
.p52-journey a[aria-current="true"],
.p93c-journey a[aria-current="true"],
.v12-journey a[aria-current="true"] {
  color:#fff !important;
  background:rgba(112,188,230,.09) !important;
  border-color:rgba(112,188,230,.52) !important;
}

/* Brand shares the unified header. */
.v12-brand {
  position:fixed !important;

  top:13px !important;
  left:28px !important;

  z-index:1600 !important;

  color:#fff !important;
}

/* Language controls share same line. */
.p93d-language,
.p93d-language-wrap,
[class*="language-switch"],
[class*="language-selector"] {
  z-index:1600 !important;
}

/*
 * Contexto is one semantic block:
 * business profile + operational size.
 */
.v12-profile-grid {
  margin-bottom:22px !important;
}

.i9-company-size {
  margin-top:2px !important;
  padding-top:20px !important;

  border-top:
    1px solid rgba(20,30,40,.09);
}

.i9-company-size-label {
  display:block;

  margin-bottom:11px !important;

  font-size:.78rem;
  font-weight:750;
  letter-spacing:.055em;
  text-transform:uppercase;
}

/*
 * Content offset for desktop fixed header.
 */
@media (min-width:901px) {
  body {
    padding-top:76px !important;
  }
}

/*
 * Mobile-first behavior:
 * brand/languages remain usable;
 * diagnostic journey becomes horizontally scrollable.
 */
@media (max-width:900px) {

  .p52-journey,
  .p93c-journey,
  .v12-journey {
    position:sticky !important;

    top:0 !important;

    min-height:auto;

    justify-content:flex-start !important;

    padding:9px 12px !important;

    overflow-x:auto;
    overscroll-behavior-x:contain;

    scrollbar-width:none;
  }

  .p52-journey::-webkit-scrollbar,
  .p93c-journey::-webkit-scrollbar,
  .v12-journey::-webkit-scrollbar {
    display:none;
  }

  .p52-journey a,
  .p93c-journey a,
  .v12-journey a {
    min-height:40px;
    padding:7px 13px !important;
  }

  .v12-brand {
    position:relative !important;

    top:auto !important;
    left:auto !important;
  }

  body {
    padding-top:0 !important;
  }

  .i9-company-size-options {
    display:grid !important;
    grid-template-columns:
      repeat(3,minmax(0,1fr)) !important;
  }
}

/* ==========================================================
   END I9STARTUPS R5F
   ========================================================== */


/* ==========================================================
   I9STARTUPS R5F.1
   SINGLE FIXED HEADER
   Brand | Journey | Languages
   ========================================================== */

/*
 * Header itself is the only fixed bar.
 */
.v12-header {
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;

  z-index:2000 !important;

  min-height:82px !important;

  display:grid !important;
  grid-template-columns:
    minmax(190px,1fr)
    auto
    minmax(190px,1fr) !important;

  align-items:center !important;

  padding:
    10px 28px !important;

  background:#1f2b35 !important;

  border-bottom:
    1px solid rgba(255,255,255,.06) !important;

  box-shadow:
    0 8px 26px rgba(0,0,0,.10) !important;
}

/*
 * Brand returns inside the header flow.
 */
.v12-brand {
  position:static !important;

  grid-column:1 !important;

  justify-self:start !important;

  margin:0 !important;

  z-index:auto !important;
}

/*
 * Journey is no longer a second fixed bar.
 */
.p52-journey,
.p93c-journey,
.v12-journey {
  position:static !important;

  grid-column:2 !important;

  justify-self:center !important;

  width:auto !important;
  min-height:0 !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;

  margin:0 !important;
  padding:0 !important;

  background:transparent !important;

  border:0 !important;
  border-radius:0 !important;

  box-shadow:none !important;
}

/*
 * Pills remain visually aligned with old dark header.
 */
.p52-journey a,
.p93c-journey a,
.v12-journey a {
  min-height:44px !important;

  padding:
    8px 16px !important;

  border:
    1px solid rgba(255,255,255,.17) !important;

  border-radius:
    999px !important;

  background:
    transparent !important;

  color:
    rgba(255,255,255,.88) !important;
}

/*
 * Language selector returns to the same grid row.
 */
.p93d-language,
.p93d-language-wrap,
[class*="language-switch"],
[class*="language-selector"] {
  position:static !important;

  grid-column:3 !important;

  justify-self:end !important;

  margin:0 !important;

  z-index:auto !important;
}

/*
 * Header's direct children should participate in same row.
 */
.v12-header > * {
  align-self:center;
}

/*
 * Page offset equals one header only.
 */
body {
  padding-top:82px !important;
}

/* ------------------------------------------
   DESKTOP / TABLET
   ------------------------------------------ */

@media (min-width:901px) {

  .v12-header {
    height:82px !important;
  }

  .p52-journey,
  .p93c-journey,
  .v12-journey {
    flex-wrap:nowrap !important;
    white-space:nowrap !important;
  }
}

/* ------------------------------------------
   MOBILE-FIRST
   ------------------------------------------ */

@media (max-width:900px) {

  .v12-header {
    position:sticky !important;

    min-height:auto !important;

    display:grid !important;

    grid-template-columns:
      minmax(0,1fr)
      auto !important;

    grid-template-areas:
      "brand lang"
      "journey journey";

    gap:10px 12px !important;

    padding:
      10px 12px !important;
  }

  .v12-brand {
    grid-area:brand !important;
  }

  .p93d-language,
  .p93d-language-wrap,
  [class*="language-switch"],
  [class*="language-selector"] {
    grid-area:lang !important;
  }

  .p52-journey,
  .p93c-journey,
  .v12-journey {
    grid-area:journey !important;

    justify-self:stretch !important;

    justify-content:flex-start !important;

    width:100% !important;

    overflow-x:auto !important;
    overscroll-behavior-x:contain;

    scrollbar-width:none;

    padding-bottom:2px !important;
  }

  .p52-journey::-webkit-scrollbar,
  .p93c-journey::-webkit-scrollbar,
  .v12-journey::-webkit-scrollbar {
    display:none;
  }

  body {
    padding-top:0 !important;
  }
}

/* ==========================================================
   END I9STARTUPS R5F.1
   ========================================================== */


/* ==========================================================
   I9STARTUPS R5F.2
   Physical Unified Header
   ========================================================== */

.v12-header {
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;

  z-index:3000 !important;

  min-height:82px !important;

  display:grid !important;
  grid-template-columns:
    minmax(210px,1fr)
    auto
    minmax(210px,1fr) !important;

  align-items:center !important;
  gap:18px !important;

  padding:10px 28px !important;

  background:#1f2b35 !important;
}

/* BRAND */
.v12-header .v12-brand {
  position:static !important;

  grid-column:1 !important;

  justify-self:start !important;
  align-self:center !important;

  margin:0 !important;
}

/* JOURNEY PHYSICALLY INSIDE HEADER */
.v12-header .i9-header-journey-slot {
  grid-column:2 !important;

  justify-self:center !important;
  align-self:center !important;

  min-width:0;
}

.v12-header .i9-header-journey-slot .p52-journey,
.v12-header .i9-header-journey-slot .p93c-journey,
.v12-header .i9-header-journey-slot .v12-journey {
  position:static !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  gap:10px !important;

  width:auto !important;
  min-height:0 !important;

  margin:0 !important;
  padding:0 !important;

  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

/* LANGUAGES */
.v12-header .p93d-language,
.v12-header .p93d-language-wrap,
.v12-header [class*="language-switch"],
.v12-header [class*="language-selector"] {
  position:static !important;

  grid-column:3 !important;

  justify-self:end !important;
  align-self:center !important;

  margin:0 !important;
}

/* Neutralize old journey positioning completely. */
body > .p52-journey,
body > .p93c-journey,
body > .v12-journey {
  position:static !important;
}

/* Exactly one header height. */
body {
  padding-top:82px !important;
}

/* MOBILE */
@media (max-width:900px) {

  .v12-header {
    position:sticky !important;

    display:grid !important;

    grid-template-columns:
      minmax(0,1fr)
      auto !important;

    grid-template-areas:
      "brand language"
      "journey journey";

    gap:9px 10px !important;

    min-height:auto !important;

    padding:9px 12px !important;
  }

  .v12-header .v12-brand {
    grid-area:brand !important;
  }

  .v12-header .i9-header-journey-slot {
    grid-area:journey !important;

    width:100%;
    justify-self:stretch !important;

    overflow:hidden;
  }

  .v12-header .i9-header-journey-slot .p52-journey,
  .v12-header .i9-header-journey-slot .p93c-journey,
  .v12-header .i9-header-journey-slot .v12-journey {

    justify-content:flex-start !important;

    width:100% !important;

    overflow-x:auto !important;
    overscroll-behavior-x:contain;

    scrollbar-width:none;
  }

  .v12-header .i9-header-journey-slot
  .p52-journey::-webkit-scrollbar,
  .v12-header .i9-header-journey-slot
  .p93c-journey::-webkit-scrollbar,
  .v12-header .i9-header-journey-slot
  .v12-journey::-webkit-scrollbar {
    display:none;
  }

  .v12-header .p93d-language,
  .v12-header .p93d-language-wrap,
  .v12-header [class*="language-switch"],
  .v12-header [class*="language-selector"] {
    grid-area:language !important;
  }

  body {
    padding-top:0 !important;
  }
}

/* ==========================================================
   END I9STARTUPS R5F.2
   ========================================================== */


/* ==========================================================
   I9STARTUPS R5F.3
   Definitive Desktop Header Geometry

   LEFT    = Brand
   CENTER  = Problema | Contexto | Mercado | Solucao
   RIGHT   = Languages
   ========================================================== */

@media (min-width:901px) {

  /*
   * One physical header bar.
   * Do not depend on grid placement anymore.
   */
  .v12-header {
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;

    height:82px !important;
    min-height:82px !important;

    display:block !important;

    padding:0 !important;
    margin:0 !important;

    background:#1f2b35 !important;

    z-index:3000 !important;

    overflow:visible !important;
  }

  /*
   * Brand - left.
   */
  .v12-header .v12-brand {
    position:absolute !important;

    left:28px !important;
    top:50% !important;

    transform:translateY(-50%) !important;

    width:auto !important;

    margin:0 !important;
    padding:0 !important;

    z-index:3 !important;
  }

  /*
   * Intelligent journey - true viewport/header center.
   */
  .v12-header .i9-header-journey-slot {
    position:absolute !important;

    left:50% !important;
    top:50% !important;

    transform:
      translate(-50%,-50%) !important;

    width:max-content !important;
    max-width:calc(100% - 520px) !important;

    margin:0 !important;
    padding:0 !important;

    z-index:2 !important;
  }

  .v12-header .i9-header-journey-slot
  .p52-journey,
  .v12-header .i9-header-journey-slot
  .p93c-journey,
  .v12-header .i9-header-journey-slot
  .v12-journey {

    position:static !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    flex-wrap:nowrap !important;

    gap:10px !important;

    width:max-content !important;
    min-height:0 !important;

    margin:0 !important;
    padding:0 !important;

    background:transparent !important;

    border:0 !important;

    box-shadow:none !important;

    white-space:nowrap !important;
  }

  /*
   * Languages - right.
   */
  .v12-header .p93d-language,
  .v12-header .p93d-language-wrap {

    position:absolute !important;

    right:28px !important;
    top:50% !important;

    transform:
      translateY(-50%) !important;

    width:auto !important;

    margin:0 !important;

    z-index:4 !important;
  }

  /*
   * If language buttons sit in another known selector,
   * keep that group on the right without affecting
   * children inside the language popup.
   */
  .v12-header > [class*="language-switch"],
  .v12-header > [class*="language-selector"] {

    position:absolute !important;

    right:28px !important;
    top:50% !important;

    transform:
      translateY(-50%) !important;

    margin:0 !important;

    z-index:4 !important;
  }

  /*
   * Only one header offset.
   */
  body {
    padding-top:82px !important;
  }

}

/* ----------------------------------------------------------
   Compact desktop / notebook protection
   ---------------------------------------------------------- */

@media (min-width:901px) and (max-width:1180px) {

  .v12-header .i9-header-journey-slot {
    max-width:calc(100% - 390px) !important;
  }

  .v12-header .i9-header-journey-slot
  .p52-journey a,
  .v12-header .i9-header-journey-slot
  .p93c-journey a,
  .v12-header .i9-header-journey-slot
  .v12-journey a {

    padding:
      7px 11px !important;

    font-size:
      .86rem !important;
  }

}

/* ----------------------------------------------------------
   Mobile remains responsive.
   Brand + language first row.
   Journey second row, scrollable.
   ---------------------------------------------------------- */

@media (max-width:900px) {

  .v12-header {
    position:sticky !important;
    top:0 !important;

    height:auto !important;
    min-height:auto !important;

    display:grid !important;

    grid-template-columns:
      minmax(0,1fr)
      auto !important;

    grid-template-areas:
      "brand language"
      "journey journey" !important;

    gap:9px 10px !important;

    padding:
      9px 12px !important;
  }

  .v12-header .v12-brand {
    position:static !important;

    grid-area:brand !important;

    transform:none !important;

    width:auto !important;
  }

  .v12-header .i9-header-journey-slot {
    position:static !important;

    grid-area:journey !important;

    transform:none !important;

    width:100% !important;
    max-width:100% !important;

    overflow:hidden !important;
  }

  .v12-header .i9-header-journey-slot
  .p52-journey,
  .v12-header .i9-header-journey-slot
  .p93c-journey,
  .v12-header .i9-header-journey-slot
  .v12-journey {

    width:100% !important;

    display:flex !important;

    justify-content:flex-start !important;

    overflow-x:auto !important;

    scrollbar-width:none;
  }

  .v12-header .i9-header-journey-slot
  .p52-journey::-webkit-scrollbar,
  .v12-header .i9-header-journey-slot
  .p93c-journey::-webkit-scrollbar,
  .v12-header .i9-header-journey-slot
  .v12-journey::-webkit-scrollbar {

    display:none;

  }

  .v12-header .p93d-language,
  .v12-header .p93d-language-wrap {

    position:static !important;

    grid-area:language !important;

    transform:none !important;

    justify-self:end !important;
  }

  body {
    padding-top:0 !important;
  }

}

/* ==========================================================
   END I9STARTUPS R5F.3
   ========================================================== */


/* ==========================================================
   I9STARTUPS R5F.4
   Mobile journey - 4 cards inside viewport
   ========================================================== */

@media (max-width:900px) {

  /*
   * Header itself must never create horizontal overflow.
   */
  .v12-header {
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
  }

  /*
   * Journey consumes exactly the available viewport width.
   */
  .v12-header .i9-header-journey-slot {
    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;
  }

  /*
   * Replace horizontal carousel with 4 equal columns.
   */
  .v12-header .i9-header-journey-slot .p52-journey,
  .v12-header .i9-header-journey-slot .p93c-journey,
  .v12-header .i9-header-journey-slot .v12-journey {

    width:100% !important;
    max-width:100% !important;

    display:grid !important;

    grid-template-columns:
      repeat(4,minmax(0,1fr)) !important;

    gap:6px !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;

    white-space:normal !important;
  }

  /*
   * Every card must shrink inside its own 25% column.
   */
  .v12-header .i9-header-journey-slot .p52-journey a,
  .v12-header .i9-header-journey-slot .p93c-journey a,
  .v12-header .i9-header-journey-slot .v12-journey a {

    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;

    min-height:48px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    gap:4px !important;

    margin:0 !important;
    padding:6px 5px !important;

    box-sizing:border-box !important;

    overflow:hidden !important;

    white-space:nowrap !important;

    font-size:.72rem !important;
    line-height:1.05 !important;
    font-weight:700 !important;

    letter-spacing:-.01em !important;
  }

  /*
   * Step numbers remain visible but compact.
   */
  .v12-header .i9-header-journey-slot .p52-journey a > span:first-child,
  .v12-header .i9-header-journey-slot .p93c-journey a > span:first-child,
  .v12-header .i9-header-journey-slot .v12-journey a > span:first-child {

    flex:0 0 auto !important;

    font-size:.67rem !important;

    margin:0 2px 0 0 !important;
  }

  /*
   * Absolutely prohibit horizontal page overflow.
   */
  html,
  body {
    max-width:100% !important;
    overflow-x:hidden !important;
  }

}

/*
 * Extra protection for narrow phones.
 */
@media (max-width:390px) {

  .v12-header .i9-header-journey-slot .p52-journey,
  .v12-header .i9-header-journey-slot .p93c-journey,
  .v12-header .i9-header-journey-slot .v12-journey {
    gap:4px !important;
  }

  .v12-header .i9-header-journey-slot .p52-journey a,
  .v12-header .i9-header-journey-slot .p93c-journey a,
  .v12-header .i9-header-journey-slot .v12-journey a {

    min-height:44px !important;

    padding:5px 3px !important;

    font-size:.67rem !important;
  }

}

/*
 * Very narrow legacy screens.
 */
@media (max-width:340px) {

  .v12-header .i9-header-journey-slot .p52-journey a,
  .v12-header .i9-header-journey-slot .p93c-journey a,
  .v12-header .i9-header-journey-slot .v12-journey a {

    font-size:.62rem !important;
    gap:2px !important;
  }

}

/* ==========================================================
   END I9STARTUPS R5F.4
   ========================================================== */


/* ==========================================================
   I9STARTUPS R5F.5
   Fixed intelligent header + section awareness
   ========================================================== */

/*
 * Header always remains visible.
 * Initial state = full opacity.
 */
.v12-header {
  position:fixed !important;

  top:0 !important;
  left:0 !important;
  right:0 !important;

  z-index:3000 !important;

  opacity:1 !important;

  transition:
    background-color .24s ease,
    box-shadow .24s ease,
    backdrop-filter .24s ease !important;
}

/*
 * Once scrolling begins:
 * visually 85% opaque while content stays fully readable.
 *
 * We deliberately alter background alpha instead of
 * opacity on the whole header, otherwise text/buttons
 * would also become transparent.
 */
.v12-header.i9-header-scrolled {
  background:
    rgba(31,43,53,.85) !important;

  -webkit-backdrop-filter:
    blur(14px) saturate(125%) !important;

  backdrop-filter:
    blur(14px) saturate(125%) !important;

  box-shadow:
    0 8px 30px rgba(0,0,0,.14) !important;

  border-bottom:
    1px solid rgba(255,255,255,.075) !important;
}

/*
 * Scroll-spy highlight.
 * Discreet — not confused with completion state.
 */
.v12-header
.i9-header-journey-slot
a.i9-scroll-active {

  background:
    rgba(126,196,232,.11) !important;

  border-color:
    rgba(126,196,232,.58) !important;

  box-shadow:
    inset 0 0 0 1px rgba(126,196,232,.07),
    0 0 0 1px rgba(126,196,232,.035) !important;

  color:#fff !important;

  transform:
    translateY(-1px);
}

/*
 * Thin contextual indicator.
 */
.v12-header
.i9-header-journey-slot
a.i9-scroll-active::after {

  content:"";

  position:absolute;

  left:24%;
  right:24%;
  bottom:-5px;

  height:2px;

  border-radius:999px;

  background:
    rgba(143,209,242,.82);
}

/*
 * Journey cards require positioning context.
 */
.v12-header
.i9-header-journey-slot
a {

  position:relative !important;

  transition:
    background-color .20s ease,
    border-color .20s ease,
    box-shadow .20s ease,
    transform .20s ease !important;
}

/*
 * Sections should stop below fixed header when clicking menu.
 */
#problem,
#business-context,
#solutions,
#capabilities {

  scroll-margin-top:
    100px;
}

/*
 * Mobile header ALSO remains fixed.
 * Previous sticky rule is superseded.
 */
@media (max-width:900px) {

  .v12-header {
    position:fixed !important;
    top:0 !important;

    width:100% !important;
  }

  /*
   * Mobile header is taller because navigation sits below brand.
   * Reserve the space so Hero never hides underneath it.
   */
  body {
    padding-top:
      160px !important;
  }

  .v12-header.i9-header-scrolled {
    background:
      rgba(31,43,53,.85) !important;
  }

  .v12-header
  .i9-header-journey-slot
  a.i9-scroll-active {

    transform:none;
  }

  .v12-header
  .i9-header-journey-slot
  a.i9-scroll-active::after {

    left:28%;
    right:28%;
    bottom:-3px;
  }

  #problem,
  #business-context,
  #solutions,
  #capabilities {

    scroll-margin-top:
      170px;
  }

}

/* Very small screens */
@media (max-width:390px) {

  body {
    padding-top:
      154px !important;
  }

}

/*
 * Accessibility:
 * no motion for users requesting reduced motion.
 */
@media (prefers-reduced-motion:reduce) {

  .v12-header,
  .v12-header
  .i9-header-journey-slot
  a {

    transition:none !important;
  }

}

/* ==========================================================
   END I9STARTUPS R5F.5
   ========================================================== */


/* ==========================================================
   I9STARTUPS R5F.6
   HEADER VISUAL LOCK
   Same geometry before / during / after scroll
   ========================================================== */

/* ----------------------------------------------------------
   DESKTOP
   ---------------------------------------------------------- */

@media (min-width:901px) {

  /*
   * Header geometry is immutable.
   */
  .v12-header,
  .v12-header.i9-header-scrolled {

    position:fixed !important;

    top:0 !important;
    left:0 !important;
    right:0 !important;

    width:100% !important;

    height:82px !important;
    min-height:82px !important;
    max-height:82px !important;

    margin:0 !important;
    padding:0 28px !important;

    box-sizing:border-box !important;

    display:block !important;

    background:rgba(31,43,53,1) !important;

    border:0 !important;
    border-bottom:
      1px solid rgba(255,255,255,.065) !important;

    box-shadow:
      0 6px 22px rgba(0,0,0,.09) !important;

    opacity:1 !important;

    overflow:visible !important;

    z-index:3000 !important;

    transition:
      background-color .22s ease,
      box-shadow .22s ease,
      backdrop-filter .22s ease !important;
  }

  /*
   * Only visual property changed after scroll:
   * background alpha 1.00 -> 0.85.
   *
   * Geometry remains 100% identical.
   */
  .v12-header.i9-header-scrolled {

    background:
      rgba(31,43,53,.85) !important;

    -webkit-backdrop-filter:
      blur(14px) saturate(120%) !important;

    backdrop-filter:
      blur(14px) saturate(120%) !important;

    box-shadow:
      0 6px 22px rgba(0,0,0,.11) !important;
  }

  /* BRAND */
  .v12-header .v12-brand,
  .v12-header.i9-header-scrolled .v12-brand {

    position:absolute !important;

    left:28px !important;
    top:50% !important;

    transform:
      translateY(-50%) !important;

    margin:0 !important;
    padding:0 !important;

    width:auto !important;
    height:auto !important;

    background:
      transparent !important;

    opacity:1 !important;
  }

  /* JOURNEY SLOT */
  .v12-header .i9-header-journey-slot,
  .v12-header.i9-header-scrolled
  .i9-header-journey-slot {

    position:absolute !important;

    left:50% !important;
    top:50% !important;

    transform:
      translate(-50%,-50%) !important;

    width:max-content !important;
    max-width:
      calc(100% - 520px) !important;

    height:52px !important;
    min-height:52px !important;
    max-height:52px !important;

    margin:0 !important;
    padding:0 !important;

    display:flex !important;
    align-items:center !important;

    background:
      transparent !important;

    border:0 !important;
    box-shadow:none !important;

    opacity:1 !important;
  }

  /*
   * Remove every inherited background around journey.
   */
  .v12-header
  .i9-header-journey-slot
  .p52-journey,

  .v12-header
  .i9-header-journey-slot
  .p93c-journey,

  .v12-header
  .i9-header-journey-slot
  .v12-journey,

  .v12-header.i9-header-scrolled
  .i9-header-journey-slot
  .p52-journey,

  .v12-header.i9-header-scrolled
  .i9-header-journey-slot
  .p93c-journey,

  .v12-header.i9-header-scrolled
  .i9-header-journey-slot
  .v12-journey {

    position:static !important;

    width:max-content !important;

    height:52px !important;
    min-height:52px !important;
    max-height:52px !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    flex-wrap:nowrap !important;

    gap:10px !important;

    margin:0 !important;
    padding:0 !important;

    background:
      transparent !important;

    border:0 !important;
    border-radius:0 !important;

    box-shadow:none !important;

    opacity:1 !important;

    overflow:visible !important;
  }

  /*
   * CARDS:
   * exact same dimensions in every state.
   */
  .v12-header
  .i9-header-journey-slot a,

  .v12-header
  .i9-header-journey-slot a:hover,

  .v12-header
  .i9-header-journey-slot a:focus,

  .v12-header
  .i9-header-journey-slot a.is-active,

  .v12-header
  .i9-header-journey-slot a.is-complete,

  .v12-header
  .i9-header-journey-slot a.i9-scroll-active {

    position:relative !important;

    box-sizing:border-box !important;

    width:auto !important;
    min-width:190px !important;
    max-width:190px !important;

    height:52px !important;
    min-height:52px !important;
    max-height:52px !important;

    margin:0 !important;

    padding:
      0 18px !important;

    display:inline-flex !important;

    align-items:center !important;
    justify-content:center !important;

    gap:10px !important;

    border-width:1px !important;
    border-style:solid !important;

    border-radius:
      999px !important;

    font-size:
      .95rem !important;

    line-height:
      1 !important;

    white-space:
      nowrap !important;

    /*
     * CRITICAL:
     * never move/grow active card.
     */
    transform:
      none !important;

    scale:
      1 !important;
  }

  /*
   * Default / completed card.
   */
  .v12-header
  .i9-header-journey-slot a {

    background:
      transparent !important;

    border-color:
      rgba(255,255,255,.18) !important;

    color:
      rgba(255,255,255,.91) !important;

    box-shadow:
      none !important;
  }

  /*
   * Scroll-position highlight.
   *
   * Dimensions NEVER change.
   */
  .v12-header
  .i9-header-journey-slot
  a.i9-scroll-active {

    background:
      rgba(109,185,226,.10) !important;

    border-color:
      rgba(109,185,226,.68) !important;

    color:
      #fff !important;

    box-shadow:
      inset 0 0 0 1px
        rgba(109,185,226,.07) !important;

    transform:
      none !important;
  }

  /*
   * Keep indicator entirely inside card.
   * Avoid apparent height change.
   */
  .v12-header
  .i9-header-journey-slot
  a.i9-scroll-active::after {

    content:"" !important;

    position:absolute !important;

    left:32% !important;
    right:32% !important;

    bottom:4px !important;

    height:2px !important;

    border-radius:
      999px !important;

    background:
      rgba(132,203,239,.90) !important;
  }

  /* LANGUAGES */
  .v12-header .p93d-language,
  .v12-header .p93d-language-wrap,

  .v12-header.i9-header-scrolled
  .p93d-language,

  .v12-header.i9-header-scrolled
  .p93d-language-wrap {

    position:absolute !important;

    right:28px !important;
    top:50% !important;

    transform:
      translateY(-50%) !important;

    margin:0 !important;
    padding:0 !important;

    background:
      transparent !important;

    opacity:1 !important;
  }

  /*
   * One constant offset.
   */
  body {
    padding-top:
      82px !important;
  }

}


/* ----------------------------------------------------------
   NOTEBOOK
   Same geometry principle, slightly narrower pills.
   ---------------------------------------------------------- */

@media (min-width:901px) and (max-width:1280px) {

  .v12-header
  .i9-header-journey-slot a,

  .v12-header
  .i9-header-journey-slot a:hover,

  .v12-header
  .i9-header-journey-slot a.i9-scroll-active {

    min-width:
      155px !important;

    max-width:
      155px !important;

    padding:
      0 12px !important;

    font-size:
      .86rem !important;
  }

}


/* ----------------------------------------------------------
   MOBILE
   Geometry also immutable during scroll.
   ---------------------------------------------------------- */

@media (max-width:900px) {

  .v12-header,
  .v12-header.i9-header-scrolled {

    position:fixed !important;

    top:0 !important;
    left:0 !important;
    right:0 !important;

    width:100% !important;

    margin:0 !important;

    box-sizing:
      border-box !important;

    background:
      rgba(31,43,53,1) !important;

    opacity:1 !important;
  }

  .v12-header.i9-header-scrolled {

    background:
      rgba(31,43,53,.85) !important;
  }

  /*
   * No scroll-state geometry changes.
   */
  .v12-header
  .i9-header-journey-slot a,

  .v12-header
  .i9-header-journey-slot
  a.i9-scroll-active {

    transform:
      none !important;

    scale:
      1 !important;

    box-shadow:
      none !important;
  }

  /*
   * Active state = color/border only.
   */
  .v12-header
  .i9-header-journey-slot
  a.i9-scroll-active {

    background:
      rgba(109,185,226,.10) !important;

    border-color:
      rgba(109,185,226,.68) !important;
  }

  .v12-header
  .i9-header-journey-slot
  a.i9-scroll-active::after {

    bottom:
      3px !important;
  }

}


/* ----------------------------------------------------------
   Accessibility
   ---------------------------------------------------------- */

@media (prefers-reduced-motion:reduce) {

  .v12-header,
  .v12-header *,
  .v12-header *::before,
  .v12-header *::after {

    transition:
      none !important;

    animation:
      none !important;
  }

}

/* ==========================================================
   END I9STARTUPS R5F.6
   ========================================================== */


/* ==========================================================
   I9STARTUPS R5F.7
   Journey background neutralization
   ========================================================== */

/*
 * Slot and journey container must be visually nonexistent.
 * Only the individual navigation pills remain visible.
 */
.v12-header .i9-header-journey-slot,
.v12-header.i9-header-scrolled .i9-header-journey-slot,

.v12-header .i9-header-journey-slot > *,
.v12-header.i9-header-scrolled .i9-header-journey-slot > *,

.v12-header .i9-header-journey-slot .p52-journey,
.v12-header .i9-header-journey-slot .p93c-journey,
.v12-header .i9-header-journey-slot .v12-journey,

.v12-header.i9-header-scrolled .i9-header-journey-slot .p52-journey,
.v12-header.i9-header-scrolled .i9-header-journey-slot .p93c-journey,
.v12-header.i9-header-scrolled .i9-header-journey-slot .v12-journey {

  background:
    transparent !important;

  background-color:
    transparent !important;

  background-image:
    none !important;

  box-shadow:
    none !important;

  border:
    0 !important;

  outline:
    0 !important;

}

/*
 * Neutralize legacy decorative surfaces.
 */
.v12-header .i9-header-journey-slot::before,
.v12-header .i9-header-journey-slot::after,

.v12-header .i9-header-journey-slot .p52-journey::before,
.v12-header .i9-header-journey-slot .p52-journey::after,

.v12-header .i9-header-journey-slot .p93c-journey::before,
.v12-header .i9-header-journey-slot .p93c-journey::after,

.v12-header .i9-header-journey-slot .v12-journey::before,
.v12-header .i9-header-journey-slot .v12-journey::after {

  content:
    none !important;

  display:
    none !important;

  background:
    transparent !important;

  box-shadow:
    none !important;

}

/*
 * IMPORTANT:
 * Restore navigation pill borders because the generic
 * child reset above must not visually flatten the cards.
 */
.v12-header
.i9-header-journey-slot
a {

  border:
    1px solid rgba(255,255,255,.18) !important;

  background:
    transparent !important;

}

/*
 * Active scroll item keeps only its discreet contextual state.
 */
.v12-header
.i9-header-journey-slot
a.i9-scroll-active {

  background:
    rgba(109,185,226,.10) !important;

  border-color:
    rgba(109,185,226,.68) !important;

  box-shadow:
    inset 0 0 0 1px
    rgba(109,185,226,.07) !important;

}

/* ==========================================================
   END I9STARTUPS R5F.7
   ========================================================== */