/* DC Health Connect · Caliza y granate */
:root {
  --bg-dark: #E8E9E6;
  --bg-elevated: #EFF0EC;
  --surface-dark: #F7F7F3;
  --surface-card: #F7F7F3;
  --border-dark: #CDD2CD;
  --text-main: #232D2D;
  --text-muted: #4A5A58;
  --text-bright: #232D2D;
  --accent-brass: #713D4D;
  --accent-rose: #713D4D;
  --accent-blue: #713D4D;
  --accent-plum: #713D4D;
  --accent-green: #3D6D5B;
}

html,
body {
  background: #E8E9E6;
  color: #232D2D;
}

body,
.growth-section,
.interface-showcase-section,
.simulator-section {
  background-image: none;
}

header {
  background: rgba(247, 247, 243, .96);
  border-bottom: 1px solid #CDD2CD;
  backdrop-filter: blur(10px);
}

header .nav-inner {
  max-width: 1440px;
  gap: 28px;
}

header .brand {
  margin-right: 16px;
}

header nav {
  margin-left: auto;
}

header nav ul {
  gap: 0;
}

header nav ul li a.nav-tab-link {
  padding: 8px 10px;
}

header .nav-actions {
  flex-shrink: 0;
}

@media (max-width: 1260px) {
  header .nav-inner {
    height: auto;
    min-height: 76px;
    flex-wrap: wrap;
    column-gap: 16px;
    row-gap: 0;
    padding-top: 12px;
    padding-bottom: 8px;
  }

  header .brand {
    margin-right: 0;
  }

  header .nav-actions {
    margin-left: auto;
  }

  header nav {
    order: 3;
    width: 100%;
    margin: 8px 0 0;
    overflow-x: auto;
    scrollbar-width: thin;
  }

  header nav ul {
    display: flex;
    width: max-content;
    gap: 4px;
    padding-bottom: 5px;
  }
}

@media (max-width: 680px) {
  header .btn-whatsapp-header {
    display: none;
  }

  header nav {
    overflow: visible;
  }

  header nav ul {
    width: 100%;
    flex-wrap: wrap;
    gap: 4px 6px;
  }

  header nav ul li a.nav-tab-link {
    font-size: .75rem;
    padding: 6px;
  }
}

@media (max-width: 420px) {
  header .nav-inner {
    column-gap: 10px;
  }

  header .brand {
    gap: 8px;
  }

  header .brand-mark {
    width: 32px;
    height: 32px;
  }

  header .brand-text {
    font-size: .96rem;
    gap: 4px;
  }
}

@media (max-width: 360px) {
  header .brand-text {
    font-size: .82rem;
  }

  header .lang-btn {
    padding: 4px 9px;
  }
}

.interface-feature-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  gap: 16px;
}

.realities-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
}

.journey-steps {
  grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
}

.security-grid,
.pricing-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
}

.simulator-grid,
.simulator-grid > *,
.parallel-translation-grid > * {
  min-width: 0;
}

@media (max-width: 420px) {
  .sim-controls-panel,
  .staff-console {
    padding: 20px;
  }

  .proc-btn {
    gap: 8px;
    min-width: 0;
  }

  .proc-btn .tag {
    flex-shrink: 0;
  }
}

@media (max-width: 420px) {
  .hero-ctas .btn,
  .hero-ctas .btn-whatsapp-hero {
    max-width: 100%;
    white-space: normal;
    text-align: center;
  }

}

@media (max-width: 680px) {
  #view-planes .btn-whatsapp-hero {
    max-width: 100%;
    padding: 14px 18px !important;
    white-space: normal;
    text-align: center;
  }
}

.brand,
.brand-text,
.brand-text span,
nav a:hover,
nav ul li a.nav-tab-link:hover {
  color: #232D2D;
}

.brand-text span {
  color: #713D4D;
}

.brand-mark {
  background: #713D4D;
  border: 1px solid #713D4D;
  color: #FFF;
  box-shadow: none;
}

.lang-switcher {
  background: #ECEDE9;
}

.lang-btn.active {
  background: #FFF;
  color: #713D4D;
  box-shadow: none;
}

nav ul li a.nav-tab-link.active,
nav ul li a.nav-tab-link:hover {
  background: #EFE7EA;
}

nav ul li a.nav-tab-link.active::after {
  box-shadow: none;
}

.btn,
.btn-whatsapp-hero,
.btn-whatsapp-primary,
.btn-whatsapp-header,
.wa-float-btn {
  border-radius: 8px;
}

.btn-primary,
.btn-whatsapp-hero,
.btn-whatsapp-primary,
.btn-whatsapp-header,
.wa-float-btn {
  background: #713D4D;
  border: 1px solid #713D4D;
  color: #FFF !important;
  box-shadow: none;
}

.btn-primary:hover,
.btn-whatsapp-hero:hover,
.btn-whatsapp-primary:hover,
.btn-whatsapp-header:hover,
.wa-float-btn:hover {
  background: #5D303E;
  border-color: #5D303E;
  box-shadow: none;
  transform: none;
}

.btn-secondary,
.btn-whatsapp-subtle {
  background: #F7F7F3;
  border: 1px solid #713D4D;
  color: #713D4D !important;
  backdrop-filter: none;
}

.btn-secondary:hover,
.btn-whatsapp-subtle:hover {
  background: #EFE7EA;
  border-color: #713D4D;
  color: #713D4D !important;
  box-shadow: none;
  transform: none;
}

.btn-whatsapp-subtle .wa-icon,
.hero-badge-pill .dot {
  color: #713D4D;
  background: #713D4D;
}

@media (max-width: 680px) {
  .wa-float-btn { border-radius: 50%; }
}

.badge,
.hero-badge-pill,
.chip,
.sec-icon {
  background: #F7F7F3;
  border: 1px solid #CDD2CD;
  color: #713D4D;
}

.hero-media-wrapper,
.growth-visual-card,
.interface-window-frame {
  border-color: #CDD2CD;
  box-shadow: 0 14px 34px rgba(35, 45, 45, .12);
}

.hero-media-overlay {
  background: linear-gradient(to top, rgba(24, 30, 30, .92), transparent);
}

.hero-media-overlay .overlay-sub { color: #E7E9E6; }

.realities-section,
.journey-section,
.growth-section,
.security-section,
.pricing-section,
.interface-showcase-section,
.comp-matrix-container {
  border-color: #CDD2CD;
}

.reality-card,
.stat-callout-card,
.stat-card-box,
.step-card,
.sec-card,
.custom-feature-pill-box,
.growth-kpi-card-v2,
.growth-deep-card,
.plan-card {
  border-radius: 10px;
  box-shadow: none;
}

.reality-card:hover {
  border-color: #713D4D;
  transform: none;
}

.stat-callout,
.stat-callout-card,
.plan-includes-header {
  background: #F2EAEC;
  border-color: #D9C8CD;
}

.stat-callout-card .stat-number,
.stat-number,
.stat-big-num,
.metric-val,
.step-number {
  font-family: var(--font-serif);
  font-weight: 400;
}

.interface-window-frame {
  --text-main: #E8EEEB;
  --text-muted: #C2CECB;
  --text-bright: #F7F7F3;
  --accent-brass: #D5A9B5;
  --accent-rose: #D5A9B5;
  --accent-blue: #B7C9C5;
  --accent-green: #B7C9C5;
  --accent-plum: #D5A9B5;
}

.interface-brand-badge,
.patient-badge-origin {
  background: rgba(213, 169, 181, .12);
  border-color: rgba(213, 169, 181, .35);
  color: #D5A9B5;
}

.window-dot.red,
.window-dot.yellow,
.window-dot.green { background: #899A96; }

.growth-kpi-card-v2.featured,
.plan-card.featured {
  background: #F7F7F3;
  border-color: #713D4D;
  box-shadow: none;
}

.growth-metrics-row {
  background: #F7F7F3;
  border-color: #CDD2CD;
}

.growth-deep-card [style*="background: rgba(0,0,0"] {
  background: #EDEFEA !important;
}

.plan-badge {
  background: #713D4D;
  color: #FFF;
  border-radius: 4px;
}

.trust-bar {
  background: #713D4D;
  border: 1px solid #713D4D;
  border-radius: 10px;
  padding: clamp(28px, 4vw, 52px);
}

.trust-bar-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 48px;
}

.trust-kicker {
  grid-column: 1;
  color: #F1DDE3;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.trust-bar-context {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: end;
  max-width: 490px;
  margin: 0;
  color: #F2E9EB;
  font-size: 1rem;
  line-height: 1.5;
}

.trust-statement {
  grid-column: 1;
  margin: 12px 0 0;
  color: #F7F7F3;
  font-size: clamp(1.7rem, 2.9vw, 2.8rem);
  font-weight: 400;
  line-height: 1.08;
}

.trust-badges-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 40px;
}

.trust-badge {
  border-top: 1px solid #A47785;
  padding-top: 18px;
}

.badge-code {
  display: block;
  color: #FFF;
  font-weight: 700;
  font-size: clamp(1rem, 1.3vw, 1.18rem);
}

.badge-label {
  display: block;
  color: #F2E9EB;
  font-size: .78rem;
  line-height: 1.4;
  margin-top: 5px;
}

@media (max-width: 760px) {
  .trust-bar-header {
    grid-template-columns: 1fr;
  }

  .trust-bar-context {
    grid-column: 1;
    grid-row: auto;
    margin-top: 16px;
  }

  .trust-badges-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

.comp-table-wrapper {
  background: #F7F7F3;
  border-color: #CDD2CD;
  box-shadow: none;
}

.comp-table th {
  background: #232D2D;
  color: #FFF;
  border-color: #526260;
}

.comp-table th.col-plan2 {
  background: #713D4D;
  border-color: #875A67;
}

.comp-table th .th-sub { color: #F1D9DF; }

.comp-category-row td {
  background: #EFE7EA;
  color: #713D4D;
  border-color: #D9C8CD;
}

.feature-row { border-color: #DEE1DC; }
.feature-row:hover { background: #F1F2EE; }
.cell-premium {
  background: #F7F2F3;
  border-color: #E3D7DA;
}

.bullet-green,
.bullet-red { box-shadow: none; border: 0; }
.bullet-green { background: #467565; }
.bullet-red { background: #A7989A; }

.feat-limit-text {
  background: #ECEDE9;
  border-color: #D5D9D4;
}

.feat-limit-text.highlight {
  color: #713D4D;
  background: #F0E6E9;
  border-color: #D9C8CD;
}

.simulator-section {
  --bg-dark: #232D2D;
  --bg-elevated: #2D3A39;
  --surface-dark: #2B3938;
  --surface-card: #354441;
  --border-dark: #5B6C68;
  --text-main: #F1F2EE;
  --text-muted: #C2CECB;
  --text-bright: #FFF;
  --accent-brass: #E0B7C2;
  --accent-rose: #E0B7C2;
  --accent-blue: #B7C9C5;
  --accent-plum: #E0B7C2;
  background: #232D2D;
  border-color: #232D2D;
  color: #F1F2EE;
}

.simulator-section .sim-controls-panel,
.simulator-section .staff-console {
  border-color: #5B6C68;
  box-shadow: none;
}

.simulator-section .proc-btn.active,
.simulator-section .lang-sim-pill.active,
.simulator-section .patient-case-btn.active {
  background: rgba(224, 183, 194, .13);
  border-color: #E0B7C2;
  box-shadow: none;
}

.simulator-section .btn-send-patient {
  background: #713D4D;
  border-color: #713D4D;
  box-shadow: none;
}

.cta-banner {
  background: #4C2B36;
  border-color: #4C2B36;
}

.cta-banner .cta-box h2 { color: #FFF; }
.cta-banner .cta-box p { color: #E9DDE0; }
.cta-banner .btn-whatsapp-hero,
.cta-banner .btn-whatsapp-primary {
  background: #F7F7F3;
  border-color: #F7F7F3;
  color: #713D4D !important;
}

footer {
  background: #E0E3DF;
  border-color: #CDD2CD;
  padding-bottom: 110px;
}

.footer-bottom-bar,
.legal-notice { border-color: #CDD2CD; }
.footer-wa-pill {
  background: #F7F7F3;
  color: #713D4D;
  border-color: #D9C8CD;
}

.footer-wa-pill:hover { background: #EFE7EA; }

@media (prefers-reduced-motion: reduce) {
  .btn,
  .reality-card,
  .wa-float-btn { transition: none; }
}