body[data-demo] section { padding: 0; }
body[data-demo] .wrap { width: min(1120px, calc(100% - 40px)); }
.client-nav { margin-left: auto; display: flex; gap: 18px; align-items: center; }
.client-nav a { text-decoration: none; font-size: 14px; font-weight: 500; }
.d-hero { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 36px; align-items: end; padding: 42px 0 8px; }
.d-hero h1 { font-size: clamp(2.5rem, 4.6vw, 4.15rem); margin: 10px 0 12px; max-width: 14ch; }
.d-hero .lead { font-size: 1.08rem; max-width: 38ch; }
.d-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 22px; }
.d-photo { position: relative; overflow: hidden; min-height: 520px; background: #111; }
.d-photo img, .d-wide img, .d-pair img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.d-block { padding: 64px 0 0; }
.d-label { font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 600; }
.d-block h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); max-width: 18ch; margin: 8px 0 0; }
.d-intro { max-width: 46ch; margin-top: 10px; }
.d-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 22px; }
.d-card { padding: 22px; min-height: 100%; }
.d-card h3 { font-size: 1.25rem; margin-bottom: 8px; }
.d-card p { margin: 0; line-height: 1.6; }
.d-card .num { margin-bottom: 10px; }
.d-split { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 28px; align-items: start; margin-top: 22px; }
.d-form { display: grid; gap: 10px; padding: 22px; }
.d-form label { display: grid; gap: 6px; font-size: 13px; }
.d-form input, .d-form textarea, .d-form select { width: 100%; border: 1px solid rgba(0,0,0,0.16); padding: 12px; font: 400 15px/1.4 Inter, sans-serif; background: #fff; color: #1c1915; }
.d-form textarea { min-height: 110px; }
.d-wide { position: relative; overflow: hidden; min-height: 280px; margin-top: 18px; }
.d-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; }
.d-pair article { position: relative; }
.d-pair .frame { position: relative; overflow: hidden; height: 340px; background: #111; }
.d-pair h3, .d-pair p { margin-top: 10px; }
.d-sheet { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 18px; border: 1px solid rgba(255,255,255,0.14); }
.d-sheet div { padding: 18px 16px; border-right: 1px solid rgba(255,255,255,0.14); }
.d-sheet div:last-child { border-right: 0; }
.d-sheet span { display: block; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: #94a3b8; }
.d-sheet strong { display: block; margin-top: 8px; font-family: Syne, Inter, sans-serif; font-size: 1.25rem; font-weight: 650; }
.d-line strong { font-family: Syne, Inter, sans-serif; font-size: 1.35rem; }
.d-meter { display: flex; justify-content: space-between; gap: 18px; align-items: end; padding: 22px; margin-top: 18px; }
.d-meter output { font-family: Syne, Inter, sans-serif; font-size: 2.4rem; line-height: 1; }
.d-note { font-size: 13px; margin-top: 8px; }
body[data-demo="salud"] { background: #f3efe8; color: #1c1915; }
body[data-demo="salud"] .nav { background: #f3efe8; border-bottom-color: rgba(28,25,21,0.08); }
body[data-demo="salud"] .client-nav a, body[data-demo="salud"] .logo { color: #1c1915; }
body[data-demo="salud"] .d-label, body[data-demo="salud"] .num { color: #8a6232; }
body[data-demo="salud"] .lead, body[data-demo="salud"] .d-intro, body[data-demo="salud"] .d-card p, body[data-demo="salud"] .d-note { color: #4e463c; }
body[data-demo="salud"] .d-card, body[data-demo="salud"] .d-form { background: #fff; border: 1px solid rgba(28,25,21,0.08); }
body[data-demo="salud"] .btn { background: #1c1915; color: #f3efe8; border-color: #1c1915; }
body[data-demo="salud"] .btn.ghost { background: transparent; color: #1c1915; }
body[data-demo="reformas"] { background: #efeae4; color: #1a1916; }
body[data-demo="reformas"] .nav { background: #efeae4; border-bottom-color: rgba(26,25,22,0.08); }
body[data-demo="reformas"] .client-nav a, body[data-demo="reformas"] .logo { color: #1a1916; }
body[data-demo="reformas"] .d-label, body[data-demo="reformas"] .num { color: #6d5b45; }
body[data-demo="reformas"] .lead, body[data-demo="reformas"] .d-intro, body[data-demo="reformas"] .d-card p, body[data-demo="reformas"] .d-note { color: #4a453d; }
body[data-demo="reformas"] .d-card, body[data-demo="reformas"] .d-form, body[data-demo="reformas"] .d-meter { background: #f7f4ef; border: 1px solid rgba(26,25,22,0.08); }
body[data-demo="reformas"] .btn { background: #1a1916; color: #efeae4; border-color: #1a1916; }
body[data-demo="reformas"] .btn.ghost { background: transparent; color: #1a1916; }
body[data-demo="b2b"] .d-line { border-top-color: rgba(255,255,255,0.12); }
body[data-demo="b2b"] .d-card, body[data-demo="b2b"] .d-form { background: #0c1018; border: 1px solid rgba(255,255,255,0.08); }
body[data-demo="b2b"] .d-form input, body[data-demo="b2b"] .d-form textarea, body[data-demo="b2b"] .d-form select { background: #07090f; color: #f8fafc; border-color: rgba(255,255,255,0.16); }
body[data-demo="b2b"] .client-nav a { color: #f8fafc; }
body[data-demo="b2b"] .d-label, body[data-demo="b2b"] .num { color: #00f0ff; }
@media (max-width: 860px) {
  .client-nav { display: none; }
  .d-hero, .d-grid, .d-split, .d-pair, .d-line, .d-sheet { grid-template-columns: 1fr; }
  .d-photo { min-height: 240px; }
  .d-pair .frame { height: 220px; }
  .d-meter { flex-direction: column; align-items: flex-start; }
}
