:root {
  --brand-violet: #714184;
  --brand-plum: #894477;
  --brand-raspberry: #a44865;
  --brand-terracotta: #c24d50;
  --brand-coral: #df5338;
  --brand-gradient: linear-gradient(90deg, #714184 0%, #894477 25%, #a44865 50%, #c24d50 75%, #df5338 100%);
  --brand-soft-gradient: linear-gradient(100deg, #714184 0%, #a44865 100%);
  --brand-warm-gradient: linear-gradient(100deg, #a44865 0%, #df5338 100%);
  --brand-paper: #f8f5f8;
  --brand-tint: #f0eaf1;
  --brand-ink: #302834;
  --brand-muted: #615667;
  --brand-rule: #d9cfdc;
  /* Legacy components inherit the same site-wide theme, including mobile states. */
  --ink: var(--brand-ink);
  --paper: var(--brand-paper);
  --muted: var(--brand-muted);
  --line: var(--brand-rule);
  --rule: var(--brand-rule);
  --accent: var(--brand-coral);
  --acid: var(--brand-violet);
  --red: var(--brand-coral);
}

/* Main editorial page: retain its existing geometry and type scale, recolor only. */
body {
  color: var(--brand-ink);
  background-color: var(--brand-paper);
}
body:before { display: none !important; }
.nav {
  background: rgba(248, 245, 248, .96);
  border-color: var(--brand-rule);
}
.nav-links, .scroll, .menu { color: var(--brand-muted); }
.brand, .nav-links a:hover, .nav-links a:focus-visible { color: var(--brand-violet); }
.nav-links a:focus-visible, .brand:focus-visible, .scroll:focus-visible,
.contact-links a:focus-visible, .venture:focus-visible {
  outline: 2px solid var(--brand-violet);
  outline-offset: 4px;
}
.nav-links { color: var(--brand-muted); }
.nav-links a:hover, .nav-links a:focus-visible { color: var(--brand-raspberry); }
.hero {
  background-color: var(--brand-paper);
  background-image:
    linear-gradient(90deg, transparent calc(25% - .5px), rgba(113, 65, 132, .09) 25%, transparent calc(25% + .5px)),
    linear-gradient(90deg, transparent calc(75% - .5px), rgba(164, 72, 101, .09) 75%, transparent calc(75% + .5px));
}
.eyebrow, .kicker, .light .kicker { color: var(--brand-plum); }
.eyebrow:after { color: var(--brand-terracotta); }
.hero h1 { color: var(--brand-violet); }
.hero h1 em {
  color: var(--brand-raspberry);
  background: none;
  -webkit-text-fill-color: currentColor;
}
.hero-bottom { border-color: var(--brand-rule); }
.hero-bottom p, .lead { color: var(--brand-ink); }
section { border-color: var(--brand-rule); }
h2, .mms-card h3, .venture h3, .step h3, .project h3,
.eco-title, .contact h2 { color: #454148; }
.light { color: var(--brand-ink); background: #f1ebf2; }
.light .section-head { border-color: var(--brand-rule); }
.mms-grid, .mms-card+.mms-card, .mms-card ul,
.process, .step+.step, .projects, .project,
.ventures, .venture, .mms-stats, .mms-stat+.mms-stat {
  border-color: var(--brand-rule) !important;
}
.mms-card li:before { color: var(--brand-raspberry); }
.step p, .project p, .venture-desc, .role, .num,
.mms-stat span, .footer, .about-portrait figcaption { color: var(--brand-muted); }
.num { color: var(--brand-plum); }
.project:after, .arrow, .venture:before { color: var(--brand-terracotta); }
.project {
  transition: background-color .25s ease, color .25s ease;
}
.project:hover {
  background: linear-gradient(100deg, #f0e7f1 0%, #f7e8e3 100%);
  color: var(--brand-ink);
}
.project:hover h3, .project:hover p, .project:hover:after { color: var(--brand-ink); }
.venture:hover, .venture:focus, .venture.open {
  background: linear-gradient(100deg, #eee5f1 0%, #f2e5ed 100%);
  color: #241d28;
}
.venture:hover h3, .venture:focus h3, .venture.open h3,
.venture:hover .role, .venture:focus .role, .venture.open .role,
.venture:hover .venture-desc, .venture:focus .venture-desc, .venture.open .venture-desc,
.venture:hover .arrow, .venture:focus .arrow, .venture.open .arrow,
.venture:hover:before, .venture:focus:before, .venture.open:before {
  color: #241d28;
}
.ecosystem {
  color: var(--brand-ink);
  background:
    linear-gradient(90deg, #714184, #894477, #a44865, #c24d50, #df5338) top / 100% 7px no-repeat,
    linear-gradient(115deg, #eee5f1 0%, #f3e8ec 58%, #f8e9e3 100%);
}
.ecosystem .kicker { color: var(--brand-plum); }
.eco-title, .eco-title span, .eco-copy { color: var(--brand-ink); }
.contact h2 { color: var(--brand-violet); }
.contact-links span, .contact-links a {
  color: var(--brand-ink);
  border-color: var(--brand-rule);
}
.contact-links a:hover, .contact-links a:focus-visible {
  color: #241d28;
  background: linear-gradient(100deg, #f2e5ed 0%, #f8e8e3 100%);
}
.footer { border-color: var(--brand-rule); }
.nav-links { background-color: var(--brand-paper); }

/* Brand surfaces use the exact gradients; dark overlay ensures readable banner copy. */
.ecosystem {
  background: linear-gradient(rgba(0, 0, 0, .22), rgba(0, 0, 0, .22)), var(--brand-gradient);
  color: #fff;
}
.ecosystem .kicker, .ecosystem .eco-title,
.ecosystem .eco-title span, .ecosystem .eco-copy { color: #fff; }
.scroll {
  background: var(--brand-coral);
  color: #201522;
  padding: .8rem 1.1rem;
  border-radius: 3px;
  white-space: nowrap;
}
.scroll:hover, .scroll:focus-visible { background: #f5d5cd; color: #201522; }

/* Compact link page shares the same palette without altering its mobile layout. */
html { background: var(--brand-paper); }
body:has(.page) {
  color: var(--brand-ink);
  background:
    linear-gradient(90deg, transparent calc(50% - .5px), rgba(113, 65, 132, .075) 50%, transparent calc(50% + .5px)),
    var(--brand-paper);
}
.page { color: var(--brand-ink); }
.topline { border-color: var(--brand-violet); }
.topline .index, .eyebrow, .projects .section-label { color: var(--brand-plum); }
.portrait-frame { background: var(--brand-violet); }
.portrait-frame::after { border-color: rgba(113, 65, 132, .2); }
h1 { color: var(--brand-violet); }
.positioning { color: #403744; }
.section-label {
  color: var(--brand-plum);
  border-color: var(--brand-violet);
}
.links li, .links li:last-child { border-color: var(--brand-rule); }
.link { color: var(--brand-ink); }
.link:hover, .link:focus-visible { color: var(--brand-violet); }
.link:focus-visible {
  outline: 3px solid var(--brand-violet);
  outline-offset: 4px;
}
.link-mark {
  border-color: var(--brand-plum);
  color: var(--brand-plum);
}
.link:hover .link-mark, .link:focus-visible .link-mark {
  background: var(--brand-warm-gradient);
  border-color: var(--brand-raspberry);
  color: #100b13;
}
.links li:first-child .link[href="/"] {
  background: var(--brand-soft-gradient);
  color: #fff;
  padding-inline: 12px;
}
.links li:first-child .link[href="/"] .link-mark { color: #fff; border-color: #fff; }
.links li:first-child .link[href="/"]:hover .link-mark,
.links li:first-child .link[href="/"]:focus-visible .link-mark {
  background: transparent;
  color: #fff;
}
.footer { color: var(--brand-muted); }
.footer a { color: var(--brand-violet); }
.footer a:hover, .footer a:focus-visible { color: var(--brand-raspberry); }

/* Center the onelink content while keeping each destination easy to scan. */
.page, .page .topline, .page .profile, .page section, .page .footer {
  text-align: center;
}
.page .topline, .page .footer { justify-content: center; }
.page .topline { flex-wrap: wrap; gap: .5rem 1rem; }
.page .portrait-frame { margin-inline: auto; }
.page .portrait-frame { border-radius: 50%; }
.page .portrait-frame::after { border-radius: inherit; }
.page .portrait-frame img { filter: none; }
.page .positioning { margin-inline: auto; }
.page .link {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 27px;
  align-items: center;
}
.page .link-label { text-align: center; }
.page .link-mark { grid-column: 2; grid-row: 1; }

/* Keep primary headings calm; reserve the palette gradient for brand accents. */
.hero h1, .hero h1 em, h1, h2,
.mms-card h3, .venture h3, .step h3, .project h3,
.eco-title, .contact h2 { color: #454148; }
.hero h1 em { background: none; -webkit-text-fill-color: currentColor; }
.ecosystem .eco-title, .ecosystem .eco-title span { color: #fff; }

/* Complete section coverage; keep neutral copy legible over tinted surfaces. */
#sobre-mi {
  background: linear-gradient(90deg, #f0eaf1, var(--brand-paper));
}
#mms, #ventures {
  background: linear-gradient(90deg, #eee6f1, #f4e9ef);
}
#metodo { background: var(--brand-paper); }
#proyectos {
  background: linear-gradient(90deg, #f4e9ef, #faeee9);
}
#contacto {
  background: linear-gradient(90deg, #f0eaf1, #faeee9);
}
.about-copy p, .mms-intro p, .mms-card p, .mms-card ul,
.process .step p, .contact-row p { color: var(--brand-ink); }
.mms-stat strong, .topline, .menu, .footer a,
.contact-links a { color: var(--brand-violet); }
.mms-stat span, .role, .about-portrait figcaption { color: var(--brand-plum); }
.section-head, .mms-grid .mms-card, .mms-stats .mms-stat,
.process .step, .projects .project {
  border-color: var(--brand-rule) !important;
}
.nav-links.open {
  background: var(--brand-paper);
  border-color: var(--brand-rule);
}
.project:hover, .project:focus-within {
  background: linear-gradient(90deg, #eee6f1, #fae4dd);
}
.page .link:hover, .page .link:focus-visible {
  background-color: var(--brand-tint);
}
::selection { color: #fff; background: var(--brand-violet); }

@media (prefers-reduced-motion: reduce) {
  .project { transition: none; }
}