/* ═══ PROBLEMA / MANIFESTO ═══ */
.problem-header { max-width:700px; margin-bottom:52px }
.problem-g {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px; background:var(--rule);
  border:1px solid var(--rule); border-radius:var(--r2); overflow:hidden;
}
.problem-card {
  background:var(--off); padding:clamp(28px,3.5vw,44px) clamp(24px,3vw,36px);
  display:flex; flex-direction:column; gap:14px;
  transition:background .2s;
}
.problem-card:hover { background:var(--off2) }
.problem-num { font-family:var(--fm); font-size:9px; letter-spacing:.22em; color:var(--gray2) }
.problem-title { font-size:16px; font-weight:600; color:var(--ink); letter-spacing:-.01em; line-height:1.25 }
.problem-text { font-size:13px; font-weight:400; line-height:1.8; color:var(--gray) }


/* ═══ O Δ — REDESENHADO ═══ */
.delta-g {
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(48px,8vw,96px); align-items:center;
}
.delta-visual {
  display:flex; flex-direction:column; align-items:center; gap:32px;
}
.delta-sym-wrap {
  position:relative;
  width:clamp(180px,22vw,260px); height:clamp(180px,22vw,260px);
  display:flex; align-items:center; justify-content:center;
}
.delta-ring {
  position:absolute; border-radius:50%;
  border:1px solid rgba(255,255,255,.07);
  animation:ring-pulse 5s ease-in-out infinite;
}
.delta-ring.r1 { width:100%; height:100% }
.delta-ring.r2 { width:68%; height:68%; animation-delay:.8s }
.delta-ring.r3 { width:38%; height:38%; animation-delay:1.6s }
@keyframes ring-pulse {
  0%,100% { opacity:.4; transform:scale(1) }
  50% { opacity:.9; transform:scale(1.02) }
}
.delta-sym {
  font-family:var(--fm); font-weight:300; line-height:1;
  font-size:clamp(60px,10vw,120px); color:#fff;
  letter-spacing:-.03em; position:relative; z-index:1;
  animation:sym-breathe 5s ease-in-out infinite;
}
@keyframes sym-breathe {
  0%,100% { opacity:.85 }
  50% { opacity:1 }
}
.delta-concepts { display:flex; gap:clamp(12px,2.5vw,28px); flex-wrap:wrap; justify-content:center; max-width:clamp(280px,32vw,360px) }
.delta-c {
  font-family:var(--fm); font-size:9px; letter-spacing:.28em;
  text-transform:uppercase; color:rgba(255,255,255,.32);
  padding-top:14px; position:relative;
}
.delta-c::before {
  content:''; position:absolute; top:0; left:50%;
  width:1px; height:8px; background:rgba(255,255,255,.14);
  transform:translateX(-50%);
}
.delta-text { display:flex; flex-direction:column }
.delta-pairs-v2 {
  margin-top:28px; border:1px solid rgba(255,255,255,.07);
  border-radius:var(--r2); overflow:hidden;
}
.delta-pair-v2 {
  display:flex; align-items:center; gap:16px;
  padding:13px 20px; border-bottom:1px solid rgba(255,255,255,.06);
}
.delta-pair-v2:last-child { border-bottom:none }
.dp-from {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(14px,1.6vw,18px); font-weight:300;
  color:rgba(255,255,255,.45); letter-spacing:-.01em; min-width:0;
}
.dp-arrow { font-family:var(--fm); font-size:12px; color:rgba(255,255,255,.25); flex-shrink:0 }
.dp-to {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(14px,1.6vw,18px); font-weight:300;
  color:#fff; letter-spacing:-.01em; min-width:0;
}


/* ═══ MÉTODO (STEPS) ═══ */
.steps {
  display:grid; grid-template-columns:repeat(4,1fr);
  margin-top:52px; background:#0D0D0C;
  border:1px solid rgba(255,255,255,.06); border-radius:var(--r2); overflow:hidden;
}
.step {
  padding:clamp(28px,3.2vw,40px) clamp(20px,2.4vw,32px);
  border-right:1px solid rgba(255,255,255,.06);
  transition:background .22s;
}
.step:last-child { border-right:none }
.step:hover { background:rgba(255,255,255,.04) }
.step-n {
  font-family:var(--fm); font-size:9px; letter-spacing:.22em;
  color:rgba(255,255,255,.35); margin-bottom:28px;
  display:flex; align-items:center; gap:12px;
}
.step-n::after { content:''; flex:1; height:1px; background:rgba(255,255,255,.07) }
.step-h {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:20px; font-weight:300; color:#fff;
  margin-bottom:10px; letter-spacing:-.012em;
}
.step-p { font-size:13px; font-weight:400; line-height:1.8; color:rgba(255,255,255,.68) }


/* ═══ SERVIÇOS (CARDS) ═══ */
.sol-g {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:0; margin-top:52px;
  border:1px solid var(--rule); border-radius:var(--r2); overflow:hidden;
}
.sol-card {
  padding:clamp(28px,3.2vw,40px) clamp(22px,2.8vw,36px);
  border-right:1px solid var(--rule); border-bottom:1px solid var(--rule);
  background:var(--off);
  display:flex; flex-direction:column;
  transition:background .28s var(--ease), box-shadow .28s var(--ease); position:relative;
  overflow:hidden;
}
.sol-card:nth-child(n+4) { border-bottom:none }
.sol-card:nth-child(3n) { border-right:none }
.sol-card::after {
  content:'Δ';
  position:absolute; bottom:14px; right:18px;
  font-family:var(--fd); font-optical-sizing:auto; font-weight:200;
  font-size:20px; color:var(--rule2);
  opacity:0; transition:opacity .35s var(--ease), transform .35s var(--ease);
  transform:translateY(4px);
  pointer-events:none;
}
.sol-card:hover { background:var(--off2) }
.sol-card:hover::after { opacity:1; transform:translateY(0) }
.sol-card:hover .sarr { opacity:1; transform:translate(0,0) }
.sol-top { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:24px }
.sol-icon { width:28px; height:28px; display:flex; align-items:center; justify-content:center }
.sol-icon svg { width:16px; height:16px; stroke:var(--ink); fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round }
.sarr { opacity:0; transform:translate(-4px,4px); transition:opacity .25s, transform .3s var(--ease); color:var(--gray2) }
.sarr svg { width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:1.6; stroke-linecap:round }
.sol-num { font-family:var(--fm); font-size:9px; letter-spacing:.18em; color:var(--gray2); margin-bottom:8px }
.sol-title { font-size:14px; font-weight:600; letter-spacing:-.01em; color:var(--ink); margin-bottom:8px; line-height:1.3 }
.sol-desc { font-size:13px; font-weight:400; line-height:1.8; color:var(--gray) }


/* ═══ MOCKUP / SISTEMA ═══ */
.mkup-g {
  margin-top:52px;
  display:grid; grid-template-columns:1fr; gap:16px;
}
.mkup-win {
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px; overflow:hidden;
}
.mkup-bar {
  height:36px; background:rgba(255,255,255,.04);
  border-bottom:1px solid rgba(255,255,255,.06);
  display:flex; align-items:center; padding:0 12px; gap:6px;
}
.mkup-dot {
  width:7px; height:7px; border-radius:50%;
  background:rgba(255,255,255,.1); flex-shrink:0;
}
.mkup-title {
  font-family:var(--fm); font-size:8.5px; letter-spacing:.14em;
  color:rgba(255,255,255,.24); margin-left:6px;
}
.mkup-body { display:grid; grid-template-columns:44px 1fr; min-height:220px }
.mkup-side {
  background:rgba(0,0,0,.18); border-right:1px solid rgba(255,255,255,.05);
  padding:14px 0; display:flex; flex-direction:column; align-items:center; gap:9px;
}
.mkup-side-item {
  width:24px; height:24px; border-radius:5px; background:rgba(255,255,255,.05);
}
.mkup-side-item.is-active { background:rgba(255,255,255,.14) }
.mkup-main { display:flex; flex-direction:column }
.mkup-metrics {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px; background:rgba(255,255,255,.05);
  border-bottom:1px solid rgba(255,255,255,.05);
}
.mkup-metric { background:rgba(255,255,255,.02); padding:12px 14px }
.mkup-metric-val {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:20px; font-weight:300; color:rgba(255,255,255,.9); letter-spacing:-.02em;
}
.mkup-metric-lbl {
  font-family:var(--fm); font-size:7.5px; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(255,255,255,.28); margin-top:3px;
}
.mkup-chart-area { padding:14px; flex:1; display:flex; flex-direction:column; gap:10px }
.mkup-chart-label {
  font-family:var(--fm); font-size:8px; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(255,255,255,.24);
}
.mkup-bars { display:flex; align-items:flex-end; gap:5px; height:64px }
.mkup-bar-col {
  flex:1; height:var(--h); background:rgba(255,255,255,.09);
  border-radius:2px 2px 0 0; min-height:6px;
}
.mkup-bar-col.is-active { background:rgba(255,255,255,.26) }
.mkup-win--main .mkup-body { min-height:240px }
.mkup-sm-g { display:grid; grid-template-columns:repeat(3,1fr); gap:16px }
.mkup-kb { padding:12px; display:flex; flex-direction:column; gap:9px }
.mkup-kb-row {
  display:flex; align-items:center; gap:9px;
  padding:8px 10px; background:rgba(255,255,255,.03); border-radius:6px;
}
.mkup-kb-icon {
  width:18px; height:18px; border-radius:4px;
  background:rgba(255,255,255,.08); flex-shrink:0;
}
.mkup-kb-lines { display:flex; flex-direction:column; gap:5px; flex:1 }
.mkup-line { height:4px; background:rgba(255,255,255,.08); border-radius:2px }
.mkup-flow { padding:14px 12px; display:flex; align-items:center; gap:6px; flex-wrap:wrap }
.mkup-flow-node {
  padding:5px 10px; background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08); border-radius:5px;
  font-family:var(--fm); font-size:8.5px; letter-spacing:.08em;
  color:rgba(255,255,255,.42);
}
.mkup-flow-node.is-active { background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.16); color:rgba(255,255,255,.8) }
.mkup-flow-arr { font-family:var(--fm); font-size:10px; color:rgba(255,255,255,.18) }
.mkup-status { padding:0 12px 12px; display:flex; align-items:center; gap:7px }
.mkup-status-dot { width:6px; height:6px; border-radius:50%; background:rgba(100,210,120,.65); flex-shrink:0 }
.mkup-status-txt { font-family:var(--fm); font-size:8.5px; letter-spacing:.1em; color:rgba(255,255,255,.3) }

/* improved mockup details */
.mkup-breadcrumb {
  padding:7px 14px; border-bottom:1px solid rgba(255,255,255,.05);
  display:flex; align-items:center; gap:6px;
}
.mkup-bc-item {
  font-family:var(--fm); font-size:7.5px; letter-spacing:.1em;
  color:rgba(255,255,255,.28);
}
.mkup-bc-sep { font-family:var(--fm); font-size:7.5px; color:rgba(255,255,255,.14) }
.mkup-bc-active { color:rgba(255,255,255,.55) }
.mkup-metric-trend {
  font-family:var(--fm); font-size:7px; letter-spacing:.06em;
  margin-top:2px;
}
.mkup-trend-up { color:rgba(100,210,120,.75) }
.mkup-bar-days {
  display:flex; gap:5px; margin-top:5px;
}
.mkup-bar-days span {
  flex:1; font-family:var(--fm); font-size:6.5px; letter-spacing:.03em;
  text-align:center; color:rgba(255,255,255,.2);
}
.mkup-kb-badge {
  font-family:var(--fm); font-size:7px; letter-spacing:.1em;
  padding:2px 7px; border-radius:3px;
  background:rgba(255,255,255,.06); color:rgba(255,255,255,.38);
  flex-shrink:0;
}

/* governance mockup */
.mkup-gov { padding:10px 12px }
.mkup-gov-row {
  display:grid; grid-template-columns:72px 1fr 1fr 1fr;
  align-items:center; padding:6px 0;
  border-bottom:1px solid rgba(255,255,255,.04);
}
.mkup-gov-row:last-child { border-bottom:none }
.mkup-gov-head span {
  font-family:var(--fm); font-size:7px; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.28); text-align:center;
}
.mkup-gov-head span:first-child { text-align:left }
.mkup-gov-role { font-family:var(--fm); font-size:7.5px; letter-spacing:.06em; color:rgba(255,255,255,.45) }
.mkup-gov-dot {
  width:7px; height:7px; border-radius:50%;
  background:rgba(255,255,255,.08); margin:0 auto;
}
.mkup-gov-yes { background:rgba(100,210,120,.55) }


/* ═══ APLICAÇÕES ═══ */
.aplic-g {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:0; margin-top:52px;
  border:1px solid var(--rule); border-radius:var(--r2); overflow:hidden;
}
.aplic-card {
  padding:clamp(28px,3.2vw,40px) clamp(22px,2.8vw,32px);
  border-right:1px solid var(--rule); border-bottom:1px solid var(--rule);
  background:var(--off);
  display:flex; flex-direction:column; position:relative; overflow:hidden;
  transition:background .28s var(--ease);
}
.aplic-card:nth-child(3n)   { border-right:none }
.aplic-card:last-child      { border-right:none }
.aplic-card:nth-child(n+7)  { border-bottom:none }
.aplic-card::after {
  content:'Δ';
  position:absolute; bottom:14px; right:18px;
  font-family:var(--fd); font-optical-sizing:auto; font-weight:200;
  font-size:18px; color:var(--rule2);
  opacity:0; transition:opacity .35s var(--ease), transform .35s var(--ease);
  transform:translateY(4px); pointer-events:none;
}
.aplic-card:hover { background:var(--off2) }
.aplic-card:hover::after { opacity:1; transform:translateY(0) }
.aplic-icon {
  width:34px; height:34px; margin-bottom:20px;
  display:flex; align-items:center; justify-content:center;
}
.aplic-icon svg { width:18px; height:18px; stroke:var(--ink); fill:none; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round }
.aplic-num { font-family:var(--fm); font-size:9px; letter-spacing:.22em; color:var(--gray2); margin-bottom:10px }
.aplic-h { font-size:15px; font-weight:600; color:var(--ink); letter-spacing:-.01em; line-height:1.25; margin-bottom:10px }
.aplic-p { font-size:13px; font-weight:400; line-height:1.78; color:var(--gray) }


/* ═══ PORTFÓLIO / PROJETOS ═══ */
.port-header { margin-bottom:52px }

.proj-card {
  border:1px solid var(--rule); border-radius:var(--r2); overflow:hidden;
  background:var(--white);
  transition:box-shadow .3s;
}
.proj-card:hover { box-shadow:0 4px 32px rgba(0,0,0,.06) }

.proj-head {
  display:flex; align-items:center; justify-content:space-between;
  padding:18px clamp(22px,3vw,36px);
  border-bottom:1px solid var(--rule);
}
.proj-cats { display:flex; gap:8px; flex-wrap:wrap }
.proj-cat {
  font-family:var(--fm); font-size:8.5px; letter-spacing:.18em; text-transform:uppercase;
  padding:5px 12px; border-radius:100px;
  border:1px solid var(--rule); color:var(--gray2);
}
.proj-num { font-family:var(--fm); font-size:9px; letter-spacing:.28em; color:var(--rule) }

.proj-body { display:grid; grid-template-columns:1fr 1fr }

.proj-text {
  padding:clamp(32px,4vw,52px) clamp(24px,3.5vw,44px);
  border-right:1px solid var(--rule);
  display:flex; flex-direction:column;
}
.proj-title {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(22px,2.6vw,34px); font-weight:300;
  color:var(--ink); letter-spacing:-.022em; line-height:1.1;
  margin-bottom:12px;
}
.proj-desc {
  font-size:14px; font-weight:400; line-height:1.8; color:var(--gray);
  margin-bottom:28px;
}

.proj-blocks { display:flex; flex-direction:column; margin-bottom:28px }
.proj-block { padding:13px 0; border-top:1px solid var(--rule) }
.proj-block:last-child { border-bottom:1px solid var(--rule) }
.proj-block-label {
  font-family:var(--fm); font-size:8px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gray2); margin-bottom:6px;
}
.proj-block-text { font-size:13px; font-weight:400; line-height:1.75; color:var(--gray) }

.proj-chips { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:28px }
.proj-chip {
  font-family:var(--fm); font-size:8px; letter-spacing:.1em;
  padding:5px 12px; border-radius:100px;
  border:1px solid var(--rule); color:var(--gray);
  transition:border-color .18s, color .18s, background .18s;
}
.proj-chip:hover { border-color:var(--gray2); color:var(--ink); background:var(--off) }

.proj-ctas { display:flex; gap:10px; flex-wrap:wrap; margin-top:auto; padding-top:4px }

/* Mockup pane */
.proj-mockup {
  background:var(--black);
  padding:clamp(20px,2.8vw,32px);
  display:flex; align-items:stretch;
}
.proj-mock-win {
  width:100%; display:flex; flex-direction:column;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08); border-radius:10px; overflow:hidden;
}
.proj-mock-bar {
  height:30px; background:rgba(255,255,255,.04);
  border-bottom:1px solid rgba(255,255,255,.06);
  display:flex; align-items:center; padding:0 10px; gap:5px;
}
.proj-mock-dot { width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.1); flex-shrink:0 }
.proj-mock-title {
  font-family:var(--fm); font-size:7.5px; letter-spacing:.12em;
  color:rgba(255,255,255,.2); margin-left:6px;
}
.proj-mock-body { display:flex; flex:1; min-height:0 }
.proj-mock-side {
  background:rgba(0,0,0,.25); border-right:1px solid rgba(255,255,255,.05);
  padding:12px 0; display:flex; flex-direction:column; align-items:center; gap:8px;
  width:34px; flex-shrink:0;
}
.proj-mock-si { width:18px; height:18px; border-radius:4px; background:rgba(255,255,255,.05) }
.proj-mock-si.is-active { background:rgba(255,255,255,.16) }
.proj-mock-main { flex:1; display:flex; flex-direction:column; overflow:hidden }

.proj-mock-kpis {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:1px; background:rgba(255,255,255,.05);
  border-bottom:1px solid rgba(255,255,255,.05); flex-shrink:0;
}
.proj-mock-kpi { background:rgba(255,255,255,.02); padding:10px 10px }
.proj-mock-kpi-val {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:16px; font-weight:300; color:rgba(255,255,255,.88); letter-spacing:-.02em;
}
.proj-mock-kpi-lbl {
  font-family:var(--fm); font-size:6px; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.52); margin-top:3px;
}

.proj-mock-chart-area { padding:10px 12px; border-bottom:1px solid rgba(255,255,255,.04); flex-shrink:0 }
.proj-mock-chart-lbl {
  font-family:var(--fm); font-size:7px; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.48); margin-bottom:8px;
}
.proj-mock-bars { display:flex; align-items:flex-end; gap:4px; height:44px }
.proj-mock-bar-col {
  flex:1; height:var(--h); background:rgba(255,255,255,.09);
  border-radius:2px 2px 0 0; min-height:4px;
}
.proj-mock-bar-col.is-active { background:rgba(255,255,255,.30) }

.proj-mock-table { padding:0 10px 8px; flex:1; overflow:hidden }
.proj-mock-th {
  display:grid; grid-template-columns:1fr 1fr 1fr;
  padding:5px 0; border-bottom:1px solid rgba(255,255,255,.06);
  font-family:var(--fm); font-size:6px; letter-spacing:.12em; text-transform:uppercase;
  color:rgba(255,255,255,.28);
}
.proj-mock-tr {
  display:grid; grid-template-columns:1fr 1fr 1fr;
  padding:5px 0; border-bottom:1px solid rgba(255,255,255,.04); align-items:center;
}
.proj-mock-tr:last-child { border-bottom:none }
.proj-mock-td-name { font-family:var(--fm); font-size:7.5px; letter-spacing:.04em; color:rgba(255,255,255,.58) }
.proj-mock-td-date { font-family:var(--fm); font-size:7px; color:rgba(255,255,255,.28) }
.proj-mock-status {
  font-family:var(--fm); font-size:6.5px; letter-spacing:.1em;
  padding:2px 7px; border-radius:100px; width:fit-content;
}
.proj-status-ok  { background:rgba(100,210,120,.12); color:rgba(100,210,120,.8) }
.proj-status-mid { background:rgba(200,175,90,.10);  color:rgba(200,175,90,.75) }
.proj-status-rev { background:rgba(200,120,90,.10);  color:rgba(200,120,90,.75) }

/* Impact metrics */
.proj-metrics {
  display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--rule);
}
.proj-metric {
  padding:clamp(18px,2.2vw,28px) clamp(18px,2.5vw,32px);
  border-right:1px solid var(--rule);
  display:flex; flex-direction:column; gap:5px;
  transition:background .18s;
}
.proj-metric:last-child { border-right:none }
.proj-metric:hover { background:var(--off) }
.proj-metric-icon {
  font-family:var(--fm); font-size:14px; color:var(--ink); margin-bottom:4px;
}
.proj-metric-h { font-size:13px; font-weight:600; color:var(--ink); letter-spacing:-.01em }
.proj-metric-p  { font-size:12px; font-weight:400; line-height:1.7; color:var(--gray) }

/* Expandable architecture */
.proj-expand {
  max-height:0; overflow:hidden;
  transition:max-height .65s cubic-bezier(.16,1,.3,1);
}
.proj-expand.open { max-height:700px; border-top:1px solid var(--rule) }
.proj-expand-inner { padding:clamp(28px,3.5vw,44px) clamp(24px,3.5vw,44px) }
.proj-expand-title {
  font-family:var(--fm); font-size:9.5px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--gray2); margin-bottom:28px;
}
.proj-arch-g {
  display:grid; grid-template-columns:repeat(5,1fr);
  gap:1px; background:var(--rule);
  border:1px solid var(--rule); border-radius:var(--r); overflow:hidden;
}
.proj-arch-block { background:var(--off); padding:20px 18px }
.proj-arch-n { font-family:var(--fm); font-size:9px; letter-spacing:.22em; color:var(--gray2); margin-bottom:10px }
.proj-arch-h { font-size:13px; font-weight:600; color:var(--ink); margin-bottom:8px }
.proj-arch-p { font-size:12px; font-weight:400; line-height:1.75; color:var(--gray) }


/* ═══ CTA FINAL ═══ */
.cta-sec { text-align:center; position:relative }
.cta-bg-grid {
  position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);
  background-size:64px 64px;
}
.cta-inner { position:relative; z-index:1; max-width:620px; margin:0 auto }
.cta-delta {
  font-family:var(--fd); font-optical-sizing:auto; font-size:clamp(56px,9vw,108px); font-weight:200;
  color:rgba(255,255,255,.14); line-height:1; margin-bottom:28px; letter-spacing:-.04em;
  animation:deltaPulse 9s ease-in-out infinite;
}
.cta-btns { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:36px }


/* ═══ SOBRE ═══ */
.sobre-g {
  display:grid; grid-template-columns:5fr 7fr;
  gap:clamp(48px,8vw,96px); align-items:start;
}
.sobre-stats {
  border:1px solid var(--rule); border-radius:var(--r2); overflow:hidden; margin-top:32px;
}
.astat {
  padding:16px 20px; border-bottom:1px solid var(--rule);
  display:flex; align-items:baseline; gap:12px; transition:background .18s;
}
.astat:last-child { border-bottom:none }
.astat:hover { background:var(--off2) }
.astat-v {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:20px; font-weight:300; color:var(--ink);
  letter-spacing:-.02em; white-space:nowrap;
}
.astat-l { font-size:12.5px; color:var(--gray) }
.sobre-body p { font-size:15px; font-weight:400; line-height:1.9; color:var(--gray); margin-bottom:16px }
.sobre-body p strong { color:var(--ink); font-weight:600 }
.pullquote {
  margin-top:32px; padding:20px 24px;
  border-left:2px solid var(--ink);
  background:var(--off2); border-radius:0 var(--r2) var(--r2) 0;
}
.pullquote p {
  font-family:var(--fd); font-optical-sizing:auto;
  font-style:italic; font-size:16px; font-weight:300;
  line-height:1.65; color:var(--ink); margin:0;
}


/* ═══ SOL-LINK ═══ */
.sol-link {
  display:inline-block; margin-top:14px;
  font-family:var(--fm); font-size:10px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gray2); text-decoration:none;
  transition:color .2s;
}
.sol-link:hover { color:var(--ink) }


/* ═══ CAP-G (2×2 capability grid on home) ═══ */
.cap-g {
  display:grid; grid-template-columns:repeat(2,1fr);
  gap:0; border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
}
.cap-g .sol-card { border-right:1px solid var(--rule); border-bottom:1px solid var(--rule); border-radius:0 }
.cap-g .sol-card:nth-child(2n) { border-right:none }
.cap-g .sol-card:nth-child(n+3) { border-bottom:none }


/* ═══ PAGE HERO (cabeçalho de páginas internas) ═══ */
.page-hero {
  background:var(--black);
  padding:clamp(108px,14vw,160px) 0 clamp(56px,7vw,96px);
  position:relative; overflow:hidden;
}
.page-hero::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px, transparent 1px);
  background-size:80px 80px;
}
.page-hero-delta {
  position:absolute; right:-1%; top:50%; transform:translateY(-50%);
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(200px,28vw,380px); font-weight:200;
  color:rgba(255,255,255,.024); line-height:1;
  pointer-events:none; user-select:none; -webkit-font-smoothing:antialiased;
}
.page-hero .h2 { color:#fff }
.page-hero .h2 em { color:rgba(255,255,255,.42) }
.page-hero .lede { color:rgba(255,255,255,.62) }
.page-hero .eyebrow { color:rgba(255,255,255,.35) }


/* ═══ TEASER (destaque SF-36 na home) ═══ */
.teaser {
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(40px,6vw,80px); align-items:center;
  border:1px solid var(--rule); border-radius:var(--r2);
  padding:clamp(40px,5.5vw,72px); margin-top:52px;
  transition:box-shadow .3s var(--ease);
}
.teaser:hover { box-shadow:0 8px 48px rgba(0,0,0,.07) }
.teaser-right {
  align-self:stretch; display:flex; align-items:stretch;
  border-radius:var(--r2); overflow:hidden; min-height:220px;
}
.teaser-right .proj-mockup { flex:1; border-radius:0 }
.teaser-meta { display:flex; align-items:center; gap:10px; margin-bottom:20px; flex-wrap:wrap }
.teaser-cat {
  font-family:var(--fm); font-size:9px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gray2);
  padding:4px 10px; border:1px solid var(--rule); border-radius:2px;
}
.teaser-num { font-family:var(--fm); font-size:10px; letter-spacing:.14em; color:var(--rule2); margin-left:auto }
.teaser-h {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(22px,3vw,34px); font-weight:300;
  letter-spacing:-.025em; color:var(--ink); line-height:1.1; margin-bottom:14px;
}
.teaser-p { font-size:14px; line-height:1.8; color:var(--gray); margin-bottom:24px; max-width:440px }
.teaser-bullets {
  list-style:none; display:flex; flex-direction:column; gap:8px;
  margin-bottom:32px;
}
.teaser-bullets li {
  font-family:var(--fm); font-size:10px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--gray2);
  display:flex; align-items:center; gap:10px;
}
.teaser-bullets li::before {
  content:''; width:16px; height:1px; background:var(--rule); flex-shrink:0;
}
.teaser-stats { display:flex; gap:32px; margin-bottom:32px; flex-wrap:wrap }
.teaser-stat strong {
  display:block; font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(28px,4vw,40px); font-weight:300;
  color:var(--ink); letter-spacing:-.03em; line-height:1;
}
.teaser-stat span {
  font-family:var(--fm); font-size:9.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gray2); margin-top:5px; display:block;
}


/* ═══ FEAT-G (features em 3 colunas, páginas internas) ═══ */
.feat-g {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:0; border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
}
.feat-card {
  padding:clamp(24px,3vw,40px) clamp(20px,2.5vw,32px);
  border-right:1px solid var(--rule);
  display:flex; flex-direction:column; gap:12px;
  transition:background .25s var(--ease);
}
.feat-card:last-child { border-right:none }
.feat-card:hover { background:var(--off2) }
.feat-num { font-family:var(--fm); font-size:9px; letter-spacing:.22em; color:var(--gray2) }
.feat-h { font-size:14px; font-weight:600; letter-spacing:-.01em; color:var(--ink); line-height:1.3 }
.feat-p { font-size:13px; line-height:1.8; color:var(--gray) }

/* Variante 2×2 */
.feat-g--2col { grid-template-columns:1fr 1fr }
.feat-g--2col .feat-card:nth-child(2n) { border-right:none }
.feat-g--2col .feat-card:nth-child(n+3) { border-top:1px solid var(--rule) }


/* ═══ VALUES-G (sobre) ═══ */
.values-g {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:0; border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
}
.value-card {
  padding:clamp(28px,3.5vw,44px) clamp(24px,3vw,36px);
  border-right:1px solid var(--rule);
  display:flex; flex-direction:column; gap:14px;
}
.value-card:last-child { border-right:none }
.value-sym { font-family:var(--fm); font-size:13px; color:var(--gray2) }
.value-h { font-size:15px; font-weight:600; letter-spacing:-.01em; color:var(--ink) }
.value-p { font-size:13px; line-height:1.8; color:var(--gray) }


/* ═══ BEFORE / AFTER (SF-36) ═══ */
.before-after {
  display:grid; grid-template-columns:1fr 1fr;
  gap:0; border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
}
.ba-col { padding:clamp(28px,4vw,52px) }
.ba-col:first-child { border-right:1px solid var(--rule); background:var(--off2) }
.ba-head {
  font-family:var(--fm); font-size:9px; letter-spacing:.28em;
  text-transform:uppercase; color:var(--gray2);
  margin-bottom:24px; display:flex; align-items:center; gap:10px;
}
.ba-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0 }
.ba-dot--before { background:rgba(180,60,60,.45) }
.ba-dot--after  { background:rgba(60,150,90,.5) }
.ba-items { list-style:none; display:flex; flex-direction:column; gap:11px }
.ba-item {
  display:flex; align-items:flex-start; gap:10px;
  font-size:13.5px; line-height:1.6; color:var(--gray);
}
.ba-item::before { content:'—'; color:var(--rule2); flex-shrink:0; margin-top:1px }
.ba-col:last-child .ba-item { color:var(--ink); font-weight:400 }
.ba-col:last-child .ba-item::before { content:'↗'; color:var(--ink); font-weight:500 }


/* ═══ PROJ TIMELINE ═══ */
.proj-timeline {
  display:flex; flex-direction:column;
  border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
}
.proj-tl-item {
  display:grid; grid-template-columns:52px 1fr;
  gap:28px; padding:clamp(20px,3vw,32px) clamp(24px,3vw,36px);
  border-bottom:1px solid var(--rule); align-items:start;
  transition:background .2s;
}
.proj-tl-item:last-child { border-bottom:none }
.proj-tl-item:hover { background:var(--off2) }
.proj-tl-n { font-family:var(--fm); font-size:9px; letter-spacing:.22em; color:var(--rule2); padding-top:3px }
.proj-tl-h { font-size:14px; font-weight:600; color:var(--ink); letter-spacing:-.01em; margin-bottom:4px }
.proj-tl-p { font-size:13px; line-height:1.75; color:var(--gray) }


/* ═══ SOBRE — MANIFESTO TEXT ═══ */
.manifesto-wrap { text-align:center; max-width:820px; margin:0 auto }
.manifesto-text {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(19px,2.6vw,28px); font-weight:300;
  line-height:1.65; color:var(--ink); letter-spacing:-.018em;
}
.manifesto-text em { font-style:italic; color:var(--gray2) }


/* ═══ SOBRE — COMO PENSAMOS ═══ */
.como-g {
  display:flex; flex-direction:column;
  border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
}
.como-item {
  display:grid; grid-template-columns:72px 1fr;
  gap:32px; padding:clamp(20px,3.5vw,36px) clamp(24px,3vw,36px);
  border-bottom:1px solid var(--rule); align-items:center;
  transition:background .2s;
}
.como-item:last-child { border-bottom:none }
.como-item:hover { background:var(--off2) }
.como-n {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(28px,4.5vw,48px); font-weight:200;
  color:var(--rule); letter-spacing:-.04em; line-height:1;
}
.como-body {}
.como-h { font-size:15px; font-weight:600; color:var(--ink); letter-spacing:-.01em; margin-bottom:4px }
.como-p { font-size:13.5px; line-height:1.7; color:var(--gray) }


/* ═══ PROJ-LIST (listagem em projetos.html) ═══ */
.proj-list { display:flex; flex-direction:column; gap:0; border:1px solid var(--rule); border-radius:var(--r2); overflow:hidden; margin-top:40px }
.proj-list-item {
  display:grid; grid-template-columns:60px 1fr auto;
  gap:24px; align-items:start;
  padding:clamp(24px,3.5vw,40px) clamp(24px,3vw,36px);
  border-bottom:1px solid var(--rule); text-decoration:none;
  transition:background .2s;
}
.proj-list-item:last-child { border-bottom:none }
.proj-list-item:hover { background:var(--off2) }
.proj-list-n { font-family:var(--fm); font-size:11px; letter-spacing:.2em; color:var(--rule2) }
.proj-list-body { display:flex; flex-direction:column; gap:6px }
.proj-list-cats { display:flex; gap:8px; flex-wrap:wrap }
.proj-list-h { font-family:var(--fd); font-optical-sizing:auto; font-size:clamp(16px,2.2vw,22px); font-weight:300; letter-spacing:-.02em; color:var(--ink); line-height:1.2 }
.proj-list-p { font-size:13px; line-height:1.7; color:var(--gray) }
.proj-list-arr { color:var(--gray2); font-size:18px; flex-shrink:0 }
.proj-list-item:hover .proj-list-arr { color:var(--ink) }
.proj-list-keys { list-style:none; display:flex; flex-wrap:wrap; gap:4px 18px; margin-top:10px }
.proj-list-key {
  font-family:var(--fm); font-size:9px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--gray2);
  display:flex; align-items:center; gap:6px;
}
.proj-list-key::before {
  content:''; width:3px; height:3px; border-radius:50%;
  background:var(--rule2); flex-shrink:0;
}
.proj-list-status {
  display:inline-flex; align-items:center; gap:7px;
  font-family:var(--fm); font-size:9px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gray2);
  padding:3px 10px; border:1px solid var(--rule);
  border-radius:100px; margin-top:14px; width:fit-content;
}
.proj-list-status-dot {
  width:5px; height:5px; border-radius:50%; flex-shrink:0; background:var(--rule2);
}
.proj-list-status.is-active .proj-list-status-dot { background:rgba(100,200,140,.7) }
.proj-list-act {
  font-family:var(--fm); font-size:10px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--gray2); text-decoration:none;
  display:inline-flex; align-items:center; gap:6px;
  margin-top:16px; transition:color .2s;
}
.proj-list-act:hover { color:var(--ink) }


/* ═══ PROJ-SECTION (rótulo de seção dentro de /projetos) ═══ */
.proj-section-lbl {
  font-family:var(--fm); font-size:9px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--gray2);
  display:flex; align-items:center; gap:16px; margin-bottom:24px;
}
.proj-section-lbl::after { content:''; flex:1; height:1px; background:var(--rule) }


/* ═══ PROD-G (grid 2×2 de produtos) ═══ */
.prod-g {
  display:grid; grid-template-columns:1fr 1fr;
  gap:0; border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:40px;
}
.prod-card {
  padding:clamp(28px,3.5vw,44px) clamp(24px,3vw,36px);
  border-right:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  display:flex; flex-direction:column; gap:16px;
  transition:background .22s var(--ease);
}
.prod-card:nth-child(2n) { border-right:none }
.prod-card:nth-child(n+3) { border-bottom:none }
.prod-card:hover { background:var(--off2) }
.prod-card:focus-within { background:var(--off2); box-shadow:inset 0 0 0 1px var(--gray2) }
.prod-top { display:flex; flex-direction:column; gap:6px }
.prod-vertical {
  font-family:var(--fm); font-size:9px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--gray2);
}
.prod-name {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(20px,2.4vw,28px); font-weight:300;
  letter-spacing:-.025em; color:var(--ink); line-height:1.1;
}
.prod-pitch { font-size:13.5px; line-height:1.75; color:var(--gray); flex:1 }
.prod-keys { list-style:none; display:flex; flex-direction:column; gap:7px }
.prod-key {
  font-size:12.5px; line-height:1.6; color:var(--gray2);
  display:flex; align-items:flex-start; gap:8px;
}
.prod-key::before { content:'—'; color:var(--rule2); flex-shrink:0; margin-top:1px }
.prod-foot { display:flex; flex-direction:column; gap:10px; margin-top:4px }
.prod-status {
  display:flex; align-items:center; gap:7px;
  font-family:var(--fm); font-size:9px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--gray2);
}
.prod-status-dot { width:6px; height:6px; border-radius:50%; background:var(--rule2); flex-shrink:0 }
.prod-status.is-active .prod-status-dot { background:rgba(100,200,140,.75) }
.prod-cta {
  font-family:var(--fm); font-size:9.5px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink); text-decoration:none;
  display:inline-flex; align-items:center; gap:6px;
  transition:opacity .2s var(--ease);
}
.prod-cta:hover { opacity:.55 }


/* ═══ PORTF-TEASE-G (baú de projetos na home) ═══ */
.portf-tease-g {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:0; border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:32px;
}
.portf-tease-card {
  padding:clamp(20px,2.5vw,32px) clamp(18px,2.2vw,26px);
  border-right:1px solid var(--rule);
  display:flex; flex-direction:column; gap:8px;
  text-decoration:none; transition:background .2s;
}
.portf-tease-card:last-child { border-right:none }
.portf-tease-card:hover { background:var(--off2) }
.portf-tease-card:focus-visible,
.proj-list-item:focus-visible,
.eco-pillar-link:focus-visible,
.sol-link:focus-visible,
.prod-cta:focus-visible {
  outline:2px solid var(--ink);
  outline-offset:-3px;
}
.portf-tease-cat { font-family:var(--fm); font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:var(--gray2) }
.portf-tease-h { font-size:13px; font-weight:500; color:var(--ink); letter-spacing:-.01em; line-height:1.35; flex:1 }
.portf-tease-lnk { font-family:var(--fm); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--gray2); padding-top:10px; transition:color .2s }
.portf-tease-card:hover .portf-tease-lnk { color:var(--ink) }


/* ═══ AUTHORITY QUOTE (página /ia e outras) ═══ */
.authority-sec { text-align:center; padding:clamp(56px,7vw,96px) 0 }
.authority-quote {
  font-family:var(--fd); font-optical-sizing:auto; font-weight:300;
  font-size:clamp(20px,2.8vw,32px); line-height:1.5;
  color:rgba(255,255,255,.88); letter-spacing:-.02em;
  max-width:780px; margin:0 auto;
}
.authority-quote em { font-style:italic; color:rgba(255,255,255,.45) }


/* ═══ IA IMPL STEPS (Como implementamos) ═══ */
.ia-steps {
  display:flex; flex-direction:column;
  border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
}
.ia-step {
  display:grid; grid-template-columns:56px 1fr;
  gap:0; align-items:stretch;
  border-bottom:1px solid var(--rule);
  transition:background .22s var(--ease);
}
.ia-step:last-child { border-bottom:none }
.ia-step:hover { background:var(--off2) }
.ia-step-n {
  display:flex; align-items:center; justify-content:center;
  font-family:var(--fm); font-size:9px; letter-spacing:.22em;
  color:var(--rule2); border-right:1px solid var(--rule);
  flex-shrink:0;
}
.ia-step-body { padding:clamp(18px,2.5vw,28px) clamp(20px,2.8vw,32px) }
.ia-step-h { font-size:14px; font-weight:600; color:var(--ink); letter-spacing:-.01em; margin-bottom:4px }
.ia-step-p { font-size:13px; line-height:1.75; color:var(--gray) }


/* ═══ KEYFRAMES GLOBAIS (usados em múltiplas páginas) ═══ */
@keyframes fadeUp { from { opacity:0; transform:translateY(22px) } to { opacity:1; transform:none } }
@keyframes fadeIn { from { opacity:0 } to { opacity:1 } }
@keyframes mhCW  { to { transform:rotate(360deg) } }
@keyframes mhCCW { to { transform:rotate(-360deg) } }
@keyframes deltaPulse { 0%,100% { opacity:.82 } 50% { opacity:1 } }


/* ═══ MÉTODO — HERO (m-hero) ═══ */
.m-hero {
  background:var(--black); color:#fff;
  position:relative; overflow:hidden;
  min-height:clamp(520px,78vh,820px);
  display:flex; flex-direction:column;
}
.m-hero-grid {
  position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:
    linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.07) 1px, transparent 1px);
  background-size:72px 72px;
}
.m-hero-vig {
  position:absolute; inset:0; pointer-events:none; z-index:1;
  background:radial-gradient(ellipse 80% 100% at 28% 55%, transparent 30%, var(--black) 95%);
}
.m-hero-body {
  flex:1; display:grid; grid-template-columns:1fr 1fr;
  align-items:center; gap:clamp(40px,6vw,80px);
  padding:clamp(120px,15vw,180px) var(--pad) clamp(64px,8vw,96px);
  max-width:var(--max); margin:0 auto; width:100%;
  position:relative; z-index:2;
}
.m-hero-left { max-width:560px }
.m-hero-eyebrow {
  display:inline-flex; align-items:center; gap:12px;
  margin-bottom:32px;
  opacity:0; animation:fadeUp .7s var(--ease) .1s both;
}
.m-hero-eyebrow-delta {
  font-family:var(--fd); font-optical-sizing:auto; font-weight:200;
  font-size:18px; line-height:1; color:rgba(255,255,255,.38);
}
.m-hero-eyebrow-label {
  font-family:var(--fm); font-size:9px; letter-spacing:.32em;
  text-transform:uppercase; color:rgba(255,255,255,.32);
}
.m-hero-h1 {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(34px,5vw,68px); font-weight:300;
  line-height:1.04; letter-spacing:-.03em; color:#fff;
  margin-bottom:24px;
  opacity:0; animation:fadeUp .8s var(--ease) .2s both;
}
.m-hero-h1 em { font-style:italic; font-weight:200; color:rgba(255,255,255,.42) }
.m-hero-sub {
  font-size:clamp(14px,1.4vw,16px); font-weight:300;
  line-height:1.85; color:rgba(255,255,255,.62);
  margin-bottom:44px;
  opacity:0; animation:fadeUp .8s var(--ease) .32s both;
}
.m-steps-bar {
  display:flex; align-items:center; flex-wrap:wrap; gap:0;
  border-top:1px solid rgba(255,255,255,.07); padding-top:22px;
  opacity:0; animation:fadeUp .7s var(--ease) .48s both;
}
.m-step-lbl {
  font-family:var(--fm); font-size:9px; letter-spacing:.2em;
  text-transform:uppercase; color:rgba(255,255,255,.3); padding-right:14px;
}
.m-step-sep { font-family:var(--fm); font-size:10px; color:rgba(255,255,255,.13); padding-right:14px }
.m-hero-right { display:flex; align-items:center; justify-content:center }
.m-viz {
  width:clamp(220px,34vw,440px); aspect-ratio:1;
  opacity:0; animation:fadeIn 1.4s var(--ease) .5s both;
}
.m-viz-svg { width:100%; height:100% }
.m-viz-outer { transform-origin:240px 240px; animation:mhCW 110s linear infinite }
.m-viz-inner { transform-origin:240px 240px; animation:mhCCW 82s linear infinite }


/* ═══ MÉTODO — ETAPA FLOW ═══ */
.etapa-flow { display:flex; flex-direction:column; margin-top:64px }
.etapa-item {
  border:1px solid var(--rule); border-radius:var(--r2); overflow:hidden;
  transition:box-shadow .3s var(--ease);
}
.etapa-item + .etapa-item { margin-top:2px }
.etapa-item:hover { box-shadow:0 4px 32px rgba(0,0,0,.07) }
.etapa-head {
  display:grid; grid-template-columns:auto 1fr; align-items:baseline;
  gap:clamp(16px,2.5vw,28px);
  padding:clamp(20px,2.8vw,32px) clamp(24px,3.5vw,44px);
  border-bottom:1px solid var(--rule);
}
.etapa-big-n {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(40px,6vw,72px); font-weight:200;
  color:var(--rule); letter-spacing:-.04em; line-height:1;
}
.etapa-name {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(22px,2.8vw,36px); font-weight:300;
  color:var(--ink); letter-spacing:-.022em; line-height:1.05;
}
.etapa-cols { display:grid; grid-template-columns:1fr 1fr 1fr; gap:0 }
.etapa-col {
  padding:clamp(20px,2.8vw,32px) clamp(20px,3vw,36px);
  border-right:1px solid var(--rule);
}
.etapa-col:last-child { border-right:none }
.etapa-col-lbl {
  font-family:var(--fm); font-size:9px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--gray2); margin-bottom:14px;
}
.etapa-problem {
  font-family:var(--fd); font-optical-sizing:auto;
  font-style:italic; font-size:clamp(13px,1.4vw,15px);
  font-weight:200; line-height:1.7; color:var(--gray);
}
.etapa-actions { list-style:none; display:flex; flex-direction:column; gap:8px }
.etapa-actions li {
  font-family:var(--fm); font-size:11px; letter-spacing:.03em;
  color:var(--gray); display:flex; align-items:flex-start; gap:8px; line-height:1.5;
}
.etapa-actions li::before { content:'→'; color:var(--rule2); flex-shrink:0 }
.etapa-result {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(15px,1.8vw,19px); font-weight:300;
  line-height:1.5; color:var(--ink); letter-spacing:-.012em;
}
.etapa-conn {
  display:flex; justify-content:center; align-items:center;
  height:28px; position:relative;
}
.etapa-conn::before {
  content:''; position:absolute; left:50%; top:0; bottom:0;
  width:1px; background:var(--rule); transform:translateX(-50%);
}
.etapa-conn-sym {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:13px; font-weight:200; color:var(--rule2);
  position:relative; z-index:1; background:var(--white); padding:0 8px;
}


/* ═══ MÉTODO — ENTREGÁVEIS ═══ */
.entrega-g {
  display:grid; grid-template-columns:repeat(4,1fr); gap:0;
  border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
}
.entrega-col {
  padding:clamp(24px,3vw,40px) clamp(18px,2.5vw,28px);
  border-right:1px solid var(--rule);
  display:flex; flex-direction:column;
  transition:background .22s var(--ease);
}
.entrega-col:last-child { border-right:none }
.entrega-col:hover { background:var(--off2) }
.entrega-n { font-family:var(--fm); font-size:9px; letter-spacing:.22em; color:var(--gray2); margin-bottom:8px }
.entrega-title {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(15px,2vw,20px); font-weight:300;
  color:var(--ink); letter-spacing:-.015em; line-height:1.15;
  margin-bottom:18px; padding-bottom:16px; border-bottom:1px solid var(--rule);
}
.entrega-list { list-style:none; display:flex; flex-direction:column; gap:10px }
.entrega-item {
  font-size:13px; line-height:1.5; color:var(--gray);
  display:flex; align-items:flex-start; gap:8px;
}
.entrega-item::before { content:'→'; color:var(--rule2); flex-shrink:0 }


/* ═══ MÉTODO — NÃO / SIM ═══ */
.nao-sim {
  display:grid; grid-template-columns:1fr 1fr; gap:0;
  border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
}
.ns-col { padding:clamp(32px,4.5vw,60px) clamp(28px,4vw,52px) }
.ns-col:first-child { border-right:1px solid var(--rule); background:var(--off) }
.ns-head {
  font-family:var(--fm); font-size:9px; letter-spacing:.28em;
  text-transform:uppercase; color:var(--gray2);
  display:flex; align-items:center; gap:10px; margin-bottom:28px;
}
.ns-badge {
  display:inline-flex; width:16px; height:16px; border-radius:50%;
  align-items:center; justify-content:center; flex-shrink:0;
  border:1px solid currentColor; font-size:9px; line-height:1; font-weight:600;
}
.ns-badge--no  { color:rgba(180,60,60,.5) }
.ns-badge--yes { color:rgba(60,150,90,.6) }
.ns-items { list-style:none; display:flex; flex-direction:column; gap:14px }
.ns-item { font-size:14px; line-height:1.6; color:var(--gray); display:flex; align-items:flex-start; gap:10px }
.ns-col:first-child .ns-item::before  { content:'—'; color:var(--rule2); flex-shrink:0 }
.ns-col:last-child .ns-item  { color:var(--ink) }
.ns-col:last-child .ns-item::before { content:'→'; color:var(--ink); flex-shrink:0; font-weight:500 }


/* ═══ CASE HERO ═══ */
.case-hero {
  background:var(--black); color:#fff;
  position:relative; overflow:hidden;
}
.case-hero-grid {
  position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:
    linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.07) 1px, transparent 1px);
  background-size:72px 72px;
}
.case-hero-vig {
  position:absolute; inset:0; pointer-events:none; z-index:1;
  background:radial-gradient(ellipse 90% 110% at 18% 60%, transparent 28%, var(--black) 88%);
}
.case-hero-body {
  display:grid; grid-template-columns:1fr 1fr;
  align-items:center; gap:clamp(40px,6vw,80px);
  padding:clamp(120px,15vw,176px) var(--pad) clamp(56px,7vw,80px);
  max-width:var(--max); margin:0 auto; width:100%;
  position:relative; z-index:2;
}
.case-hero-left { max-width:560px }
.case-hero-eyebrow {
  font-family:var(--fm); font-size:9px; letter-spacing:.32em;
  text-transform:uppercase; color:rgba(255,255,255,.32);
  display:inline-flex; align-items:center; gap:12px;
  margin-bottom:24px;
  opacity:0; animation:fadeUp .7s var(--ease) .08s both;
}
.case-hero-eyebrow::before {
  content:'Δ';
  font-family:var(--fd); font-optical-sizing:auto; font-weight:200;
  font-size:13px; color:rgba(255,255,255,.38); line-height:1;
}
.case-hero-back {
  font-family:var(--fm); font-size:9px; letter-spacing:.18em;
  text-transform:uppercase; color:rgba(255,255,255,.3);
  text-decoration:none; display:inline-flex; align-items:center; gap:8px;
  margin-bottom:32px;
  opacity:0; animation:fadeUp .6s var(--ease) .04s both;
  transition:color .2s;
}
.case-hero-back:hover { color:rgba(255,255,255,.65) }
.case-hero-h1 {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(38px,5.8vw,76px); font-weight:300;
  line-height:1.0; letter-spacing:-.03em; color:#fff;
  margin-bottom:14px;
  opacity:0; animation:fadeUp .8s var(--ease) .15s both;
}
.case-hero-sub {
  font-family:var(--fm); font-size:9px; letter-spacing:.18em;
  text-transform:uppercase; color:rgba(255,255,255,.32);
  margin-bottom:24px; line-height:1.6;
  opacity:0; animation:fadeUp .7s var(--ease) .24s both;
}
.case-hero-p {
  font-size:clamp(14px,1.4vw,15px); font-weight:300;
  line-height:1.9; color:rgba(255,255,255,.6);
  margin-bottom:36px;
  opacity:0; animation:fadeUp .8s var(--ease) .32s both;
}
.case-hero-btns {
  display:flex; gap:12px; flex-wrap:wrap;
  opacity:0; animation:fadeUp .7s var(--ease) .4s both;
}
.case-hero-right {
  display:flex; align-items:center; justify-content:center;
  opacity:0; animation:fadeIn 1.2s var(--ease) .48s both;
}
.case-mock {
  width:100%; max-width:480px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:var(--r2); overflow:hidden;
  background:rgba(10,9,8,.8);
  box-shadow:0 32px 96px rgba(0,0,0,.5);
}
.case-mock-bar {
  display:flex; align-items:center; gap:6px;
  padding:10px 14px;
  background:rgba(0,0,0,.3); border-bottom:1px solid rgba(255,255,255,.06);
  flex-shrink:0;
}
.case-mock-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0 }
.case-mock-dot:nth-child(1) { background:rgba(255,95,87,.55) }
.case-mock-dot:nth-child(2) { background:rgba(255,189,46,.45) }
.case-mock-dot:nth-child(3) { background:rgba(40,200,80,.45) }
.case-mock-title {
  font-family:var(--fm); font-size:8px; letter-spacing:.12em;
  color:rgba(255,255,255,.28); margin-left:8px;
}
.case-mock-kpis {
  display:grid; grid-template-columns:repeat(4,1fr);
  border-bottom:1px solid rgba(255,255,255,.05);
}
.case-mock-kpi {
  padding:12px 10px; border-right:1px solid rgba(255,255,255,.05);
  display:flex; flex-direction:column; gap:4px;
}
.case-mock-kpi:last-child { border-right:none }
.case-mock-kpi-v {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:16px; font-weight:300; color:rgba(255,255,255,.85);
  letter-spacing:-.02em; line-height:1;
}
.case-mock-kpi-l {
  font-family:var(--fm); font-size:6.5px; letter-spacing:.1em;
  text-transform:uppercase; color:rgba(255,255,255,.52); line-height:1.3;
}
.case-mock-chart {
  padding:12px 14px; border-bottom:1px solid rgba(255,255,255,.05);
}
.case-mock-chart-lbl {
  font-family:var(--fm); font-size:7px; letter-spacing:.1em;
  text-transform:uppercase; color:rgba(255,255,255,.48); margin-bottom:10px;
}
.case-mock-bars { display:flex; align-items:flex-end; gap:5px; height:52px }
.case-mock-bar-col {
  flex:1; background:rgba(255,255,255,.14); border-radius:2px 2px 0 0;
  height:var(--h);
}
.case-mock-bar-col.hi { background:rgba(255,255,255,.32) }
.case-mock-table { padding:0 14px 12px }
.case-mock-th {
  display:grid; grid-template-columns:1fr 72px 64px;
  padding:8px 0 6px;
  font-family:var(--fm); font-size:6.5px; letter-spacing:.1em;
  text-transform:uppercase; color:rgba(255,255,255,.2);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.case-mock-tr {
  display:grid; grid-template-columns:1fr 72px 64px;
  padding:7px 0; border-bottom:1px solid rgba(255,255,255,.04);
  align-items:center;
}
.case-mock-tr:last-child { border-bottom:none }
.case-mock-patient { font-family:var(--fm); font-size:7.5px; color:rgba(255,255,255,.55) }
.case-mock-date { font-family:var(--fm); font-size:7px; color:rgba(255,255,255,.25) }
.case-mock-badge {
  font-family:var(--fm); font-size:6.5px; letter-spacing:.06em;
  padding:2px 6px; border-radius:2px; text-transform:uppercase; width:fit-content;
}
.case-mock-badge--ok  { background:rgba(40,200,80,.18); color:rgba(100,220,120,.8) }
.case-mock-badge--mid { background:rgba(255,200,50,.12); color:rgba(255,210,80,.7) }
.case-mock-badge--rev { background:rgba(180,60,60,.18); color:rgba(220,100,100,.8) }
.case-kpi-bar {
  display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.07);
  position:relative; z-index:2;
  max-width:var(--max); margin:0 auto; width:100%;
}
.ch-kpi {
  padding:clamp(20px,2.8vw,32px) var(--pad);
  border-right:1px solid rgba(255,255,255,.07);
  display:flex; flex-direction:column; gap:6px;
}
.ch-kpi:last-child { border-right:none }
.ch-kpi-v {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(20px,2.5vw,28px); font-weight:300; color:#fff;
  letter-spacing:-.02em; line-height:1;
}
.ch-kpi-l {
  font-family:var(--fm); font-size:8.5px; letter-spacing:.2em;
  text-transform:uppercase; color:rgba(255,255,255,.52);
}


/* ═══ PROB GRID ═══ */
.prob-g {
  display:grid; grid-template-columns:repeat(4,1fr);
  border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
  background:var(--rule); gap:1px;
}
.prob-card {
  background:var(--off); padding:clamp(22px,2.8vw,34px) clamp(18px,2.5vw,26px);
  display:flex; flex-direction:column; gap:10px;
  transition:background .2s;
}
.prob-card:hover { background:var(--off2) }
.prob-icon {
  width:32px; height:32px; display:flex; align-items:center; justify-content:center;
  color:var(--gray2);
}
.prob-icon svg { width:17px; height:17px; stroke:currentColor; stroke-width:1.5; fill:none; stroke-linecap:round; stroke-linejoin:round }
.prob-h { font-size:13px; font-weight:600; color:var(--ink); letter-spacing:-.01em; line-height:1.25 }
.prob-p { font-size:12px; line-height:1.7; color:var(--gray) }


/* ═══ SOL MODULES ═══ */
.sol-mod-g {
  display:grid; grid-template-columns:repeat(4,1fr);
  border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
  background:var(--rule); gap:1px;
}
.sol-mod {
  background:var(--white); padding:clamp(24px,3vw,36px) clamp(20px,2.5vw,28px);
  display:flex; flex-direction:column; gap:12px;
  transition:background .2s;
}
.sol-mod:hover { background:var(--off) }
.sol-mod-n { font-family:var(--fm); font-size:9px; letter-spacing:.22em; color:var(--gray2) }
.sol-mod-h { font-size:14px; font-weight:600; color:var(--ink); letter-spacing:-.01em }
.sol-mod-p { font-size:12px; line-height:1.75; color:var(--gray) }


/* ═══ ARCH CONNECTED (4 blocos) ═══ */
.arch-conn-g {
  display:grid; grid-template-columns:repeat(4,1fr);
  margin-top:52px; border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; background:var(--rule); gap:1px;
}
.arch-block {
  background:var(--white); padding:clamp(28px,3.5vw,48px) clamp(22px,3vw,32px);
  display:flex; flex-direction:column; gap:0;
  transition:background .25s;
}
.arch-block:hover { background:var(--off) }
.arch-block-n {
  font-family:var(--fm); font-size:9px; letter-spacing:.22em; color:var(--gray2);
  margin-bottom:16px;
}
.arch-block-h { font-size:15px; font-weight:600; color:var(--ink); letter-spacing:-.015em; margin-bottom:20px; line-height:1.2 }
.arch-block-list { list-style:none; display:flex; flex-direction:column; gap:9px }
.arch-block-list li {
  font-size:12.5px; line-height:1.6; color:var(--gray);
  display:flex; align-items:flex-start; gap:8px;
}
.arch-block-list li::before {
  content:'→'; color:var(--rule); flex-shrink:0;
  font-family:var(--fm); font-size:10px; margin-top:1px;
}


/* ═══ RBAC ═══ */
.rbac-wrap {
  margin-top:52px; border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r2); overflow:hidden;
}
.rbac-level {
  display:grid; grid-template-columns:40px 1fr 140px;
  align-items:center; gap:24px;
  padding:clamp(16px,2.2vw,24px) clamp(24px,3vw,36px);
  border-bottom:1px solid rgba(255,255,255,.06);
  transition:background .2s;
}
.rbac-level:last-child { border-bottom:none }
.rbac-level:hover { background:rgba(255,255,255,.04) }
.rbac-n {
  font-family:var(--fm); font-size:9px; letter-spacing:.22em;
  color:rgba(255,255,255,.22); text-align:center;
}
.rbac-info { display:flex; flex-direction:column; gap:4px }
.rbac-h { font-size:13.5px; font-weight:500; color:rgba(255,255,255,.82); letter-spacing:-.01em }
.rbac-p { font-size:11.5px; color:rgba(255,255,255,.36); line-height:1.5 }
.rbac-bar-wrap { height:3px; background:rgba(255,255,255,.08); border-radius:2px }
.rbac-bar { height:100%; border-radius:2px; background:rgba(255,255,255,.32) }


/* ═══ DIFERENCIAIS ═══ */
.diff-g {
  display:grid; grid-template-columns:repeat(3,1fr);
  border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
}
.diff-col {
  padding:clamp(28px,3.5vw,52px) clamp(24px,3vw,40px);
  border-right:1px solid var(--rule); display:flex; flex-direction:column; gap:14px;
  transition:background .2s;
}
.diff-col:last-child { border-right:none }
.diff-col:hover { background:var(--off) }
.diff-n { font-family:var(--fm); font-size:9px; letter-spacing:.22em; color:var(--gray2) }
.diff-h { font-size:16px; font-weight:600; color:var(--ink); letter-spacing:-.015em; line-height:1.2 }
.diff-p { font-size:13px; line-height:1.8; color:var(--gray); margin-bottom:6px }
.diff-list { list-style:none; display:flex; flex-direction:column; gap:7px }
.diff-list li {
  font-size:12.5px; color:var(--gray);
  display:flex; align-items:flex-start; gap:8px;
}
.diff-list li::before { content:'—'; color:var(--rule2); flex-shrink:0; margin-top:2px }


/* ═══ IMPACT CARDS ═══ */
.impact-g {
  display:grid; grid-template-columns:repeat(4,1fr);
  border:1px solid var(--rule); border-radius:var(--r2);
  overflow:hidden; margin-top:52px;
  background:var(--rule); gap:1px;
}
.impact-card {
  background:var(--off); padding:clamp(22px,2.8vw,36px) clamp(18px,2.5vw,28px);
  display:flex; flex-direction:column; gap:10px;
  transition:background .2s;
}
.impact-card:hover { background:var(--off2) }
.impact-sym { font-family:var(--fm); font-size:13px; color:var(--gray2) }
.impact-h { font-size:13px; font-weight:600; color:var(--ink); letter-spacing:-.01em }
.impact-p { font-size:12px; line-height:1.7; color:var(--gray) }


/* ═══ HΔBITVS LABS BLOCK ═══ */
.habitvs-block {
  text-align:center; max-width:600px; margin:0 auto;
  padding:clamp(56px,8vw,96px) var(--pad);
}
.habitvs-block-logo {
  font-family:var(--fm); font-size:10px; letter-spacing:.44em;
  text-transform:uppercase; color:rgba(255,255,255,.3);
  display:flex; align-items:center; gap:16px; justify-content:center;
  margin-bottom:36px;
}
.habitvs-block-logo::before,
.habitvs-block-logo::after {
  content:''; flex:1; height:1px; background:rgba(255,255,255,.07); max-width:56px;
}
.habitvs-block-h {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(20px,2.8vw,30px); font-weight:300;
  letter-spacing:-.02em; color:#fff; margin-bottom:20px; line-height:1.25;
}
.habitvs-block-p { font-size:14px; line-height:1.9; color:rgba(255,255,255,.5); margin-bottom:16px }
.habitvs-block-tag {
  font-family:var(--fd); font-optical-sizing:auto; font-style:italic;
  font-size:clamp(15px,1.8vw,18px); font-weight:200;
  color:rgba(255,255,255,.38); line-height:1.4;
}

/* ──────────────────────────────────────────────────────────────
   LEGIBILIDADE v2 — aumento mais perceptível em todo o site (jun/2026)
   Corpo, subtítulos, lede, hero, eyebrow, nav e componentes do
   ecossistema. Reforço maior no mobile. Não mexe nos micro-rótulos
   mono (var(--fm)) dos mockups de tela, que são decorativos.
   ────────────────────────────────────────────────────────────── */

/* Texto-base e linha editorial */
.lede { font-size:clamp(16.5px,1.7vw,19px); line-height:1.75 }
.body { font-size:16px }
.hero-sub { font-size:clamp(16px,1.5vw,18px); line-height:1.8 }

/* Rótulos e navegação (mono) — sobem ~1.5px */
.eyebrow { font-size:11.5px }
.nav-links a { font-size:11px }

/* Corpo de texto (parágrafos de leitura) → 15.5px */
.problem-text, .step-p, .sol-desc, .aplic-p, .feat-p, .value-p,
.proj-block-text, .proj-tl-p, .proj-list-p, .ia-step-p, .diff-p,
.como-p, .feat-quote, .teaser-p, .ns-item, .habitvs-block-p,
.sobre-body p, .portf-tease-h { font-size:15.5px; line-height:1.75 }

/* Parágrafos mais compactos → 14.5px */
.proj-metric-p, .proj-arch-p, .prob-p, .sol-mod-p, .impact-p,
.arch-block-p, .rbac-p { font-size:14.5px }

/* Subtítulos de cards → 16.5px */
.sol-title, .feat-h, .aplic-h, .value-h, .como-h, .proj-tl-h,
.ia-step-h, .sol-mod-h, .prob-h, .impact-h, .proj-metric-h,
.proj-arch-h { font-size:16.5px }

/* Títulos médios → 17.5px */
.problem-title, .diff-h { font-size:17.5px }

/* ── Mobile: leitura confortável (≤600px) ── */
@media (max-width:600px) {
  .lede { font-size:17.5px }
  .hero-sub { font-size:17px; line-height:1.8 }

  .problem-text, .step-p, .sol-desc, .aplic-p, .feat-p, .value-p,
  .proj-block-text, .proj-tl-p, .proj-list-p, .ia-step-p, .diff-p,
  .como-p, .feat-quote, .teaser-p, .ns-item, .habitvs-block-p,
  .sobre-body p, .portf-tease-h,
  .proj-metric-p, .proj-arch-p, .prob-p, .sol-mod-p, .impact-p,
  .arch-block-p { font-size:16px; line-height:1.75 }

  .sol-title, .feat-h, .aplic-h, .proj-tl-h, .ia-step-h, .sol-mod-h,
  .prob-h, .impact-h, .value-h, .como-h { font-size:17px }

  .problem-title, .diff-h { font-size:18px }
}

/* ──────────────────────────────────────────────────────────────
   ECOSSISTEMA / ARQUITETURA — hub HΔBITVS + 3 camadas
   Usado na home (#arquitetura) e na página ecossistema.html.
   Prefixo .eco- (sem colisão com .arch- do case SF-36).
   ────────────────────────────────────────────────────────────── */

/* Hub central (marca) + haste de conexão */
.eco-hub { text-align:center; margin-top:52px }
.eco-hub-logo {
  font-family:var(--fs); font-weight:600; font-size:clamp(19px,2.2vw,24px);
  letter-spacing:.16em; color:var(--ink);
}
.s-dark .eco-hub-logo { color:#fff }
.eco-hub-tag {
  font-family:var(--fm); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gray2); margin-top:10px;
}
.eco-stem { width:1px; height:40px; background:var(--rule); margin:18px auto -1px }
.s-dark .eco-stem { background:rgba(255,255,255,.16) }

/* Grade de 3 pilares (camadas) */
.eco-pillars {
  display:grid; grid-template-columns:repeat(3,1fr);
  border:1px solid var(--rule); border-radius:var(--r2); overflow:hidden;
}
.s-dark .eco-pillars { border-color:rgba(255,255,255,.1) }
.eco-pillar {
  padding:34px 30px; position:relative;
  border-right:1px solid var(--rule);
  display:flex; flex-direction:column;
}
.eco-pillar:last-child { border-right:none }
.s-dark .eco-pillar { border-color:rgba(255,255,255,.1) }
.eco-pillar-lbl {
  font-family:var(--fm); font-size:10px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gray2); margin-bottom:6px;
}
.eco-badge {
  display:inline-flex; align-items:center; gap:6px; align-self:flex-start;
  font-family:var(--fm); font-size:8px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gray2); border:1px solid var(--rule); border-radius:100px; padding:4px 10px;
  margin-bottom:14px;
}
.eco-badge::before { content:''; width:5px; height:5px; border-radius:50%; background:var(--gray2) }
.s-dark .eco-badge { color:rgba(255,255,255,.5); border-color:rgba(255,255,255,.16) }
.eco-pillar-h {
  font-family:var(--fd); font-optical-sizing:auto; font-weight:300;
  font-size:clamp(21px,2.2vw,26px); letter-spacing:-.02em; color:var(--ink); line-height:1.08;
}
.s-dark .eco-pillar-h { color:#fff }
.eco-pillar-p { font-size:15px; line-height:1.7; color:var(--gray); margin-top:12px }
.s-dark .eco-pillar-p { color:rgba(255,255,255,.6) }
.eco-tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:18px }
.eco-tag {
  font-family:var(--fm); font-size:10.5px; letter-spacing:.03em;
  color:var(--gray); background:var(--off); border:1px solid var(--rule);
  padding:5px 10px; border-radius:100px;
}
.s-dark .eco-tag { color:rgba(255,255,255,.62); background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.1) }
.eco-pillar-link {
  font-family:var(--fm); font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--gray2); margin-top:auto; padding-top:22px; transition:color .2s;
}
.eco-pillar:hover .eco-pillar-link { color:var(--ink) }
.s-dark .eco-pillar:hover .eco-pillar-link { color:#fff }

/* Detalhe por camada (página ecossistema.html) */
.eco-layer {
  display:grid; grid-template-columns:240px 1fr; gap:48px;
  padding:44px 0; border-top:1px solid var(--rule);
}
.eco-layer:last-child { border-bottom:1px solid var(--rule) }
.eco-layer-n { font-family:var(--fm); font-size:10.5px; letter-spacing:.24em; color:var(--gray2); margin-bottom:12px }
.eco-layer-h {
  font-family:var(--fd); font-optical-sizing:auto; font-weight:300;
  font-size:clamp(24px,3vw,34px); letter-spacing:-.02em; color:var(--ink); line-height:1.05;
}
.eco-layer-sub { font-family:var(--fm); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--gray2); margin-top:10px }
.eco-layer-p { font-size:16px; line-height:1.8; color:var(--gray); max-width:560px }
.eco-layer-items { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px }

@media (max-width:760px) {
  .eco-pillars { grid-template-columns:1fr }
  .eco-pillar { border-right:none; border-bottom:1px solid var(--rule) }
  .eco-pillar:last-child { border-bottom:none }
  .s-dark .eco-pillar { border-color:rgba(255,255,255,.1) }
  .eco-layer { grid-template-columns:1fr; gap:20px; padding:36px 0 }
  .eco-pillar-p, .eco-layer-p { font-size:16px }
}