@font-face {
  font-family: Manrope;
  src: url('/fonts/manrope/manrope-latin-variable.woff2') format('woff2');
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}
@font-face {
  font-family: Space Grotesk;
  src: url('/fonts/space-grotesk/space-grotesk-latin-variable.woff2') format('woff2');
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
}
:root {
  --fib-xs: 0.75rem;
  --fib-sm: 0.875rem;
  --fib-base: 1rem;
  --fib-md: 1.236rem;
  --fib-lg: 1.618rem;
  --fib-xl: 2.058rem;
  --fib-2xl: 2.618rem;
  --fib-3xl: 3.236rem;
  --crimson: #dc143c;
  --ink: #17212b;
  --muted: #59636e;
  --line: #e1e5e7;
  --paper: #f5f4ef;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 6rem;
}
body {
  margin: 0;
  color: var(--ink);
  background: #fff;
  font-family: Manrope, 'Segoe UI', sans-serif;
  -webkit-font-smoothing: antialiased;
}
h1,
h2,
h3,
p,
figure {
  margin: 0;
}
h1,
h2,
h3 {
  font-family:
    Space Grotesk,
    Manrope,
    sans-serif;
  text-wrap: balance;
}
h1 {
  font-size: var(--fib-xl);
  line-height: 1.12;
  letter-spacing: -0.04em;
}
h2 {
  font-size: var(--fib-xl);
  line-height: 1.22;
  letter-spacing: -0.03em;
}
h3 {
  font-size: var(--fib-md);
  line-height: 1.4;
}
p,
li,
dd {
  line-height: 1.8;
}
a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 4px;
}
button,
input {
  font: inherit;
}
a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible {
  outline: 2px solid var(--crimson);
  outline-offset: 4px;
}
button {
  cursor: pointer;
}
.wrap {
  max-width: 76rem;
  margin: 0 auto;
  padding: 0 1.25rem;
}
.site-header {
  background: #fff;
  border-bottom: 1px solid var(--line);
}
.header-inner {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
  min-height: 5rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.brand {
  font-family:
    Space Grotesk,
    Manrope,
    sans-serif;
  font-weight: 700;
  font-size: var(--fib-md);
}
.header-inner > span {
  font-size: var(--fib-xs);
  color: var(--muted);
}
.header-inner form {
  margin-left: auto;
}
.text-button {
  padding: 0.5rem;
  border: 0;
  background: none;
  text-decoration: underline;
  text-underline-offset: 4px;
  color: var(--muted);
  font-size: var(--fib-sm);
}
.eyebrow {
  color: #b21132;
  font-size: var(--fib-xs);
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  min-height: 3rem;
  padding: 1rem 1.3rem;
  border: 0;
  border-radius: 0.8rem;
  background: var(--crimson);
  color: #fff;
  font-size: var(--fib-sm);
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
}
.button:hover {
  background: #b21132;
}
.button span {
  font-size: var(--fib-md);
}
.small {
  font-size: var(--fib-xs);
  color: var(--muted);
}
.login {
  min-height: calc(100vh - 11rem);
  display: grid;
  gap: 2.5rem;
  align-content: center;
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.login-intro h1 {
  margin-top: 1rem;
}
.login-intro > p:not(.eyebrow) {
  margin-top: 1.25rem;
  color: var(--muted);
  max-width: 30rem;
}
.login-intro > a {
  display: inline-block;
  margin-top: 1.5rem;
  color: #b21132;
  font-size: var(--fib-sm);
}
.login-card {
  padding: 2rem;
  border: 1px solid var(--line);
  border-radius: 1.25rem;
  box-shadow: 0 18px 50px -35px #17212b70;
}
.login-card h2 {
  font-size: var(--fib-lg);
}
.login-card > p {
  margin-top: 0.75rem;
  color: var(--muted);
  font-size: var(--fib-sm);
}
.login-card label {
  display: block;
  margin-top: 1.75rem;
  font-size: var(--fib-sm);
  font-weight: 700;
}
.login-card input[type='password'] {
  display: block;
  width: 100%;
  padding: 0.85rem;
  margin-top: 0.65rem;
  border: 1px solid #9da7b0;
  border-radius: 0.6rem;
  min-height: 3rem;
}
.login-card .button {
  width: 100%;
  margin-top: 1.25rem;
}
.login-card .error {
  color: #a2102d;
  background: #fff0f3;
  padding: 0.8rem;
  border-radius: 0.5rem;
}
.hero {
  padding: 3rem 0;
  background: var(--paper);
}
.hero-grid {
  display: grid;
  gap: 2.5rem;
  align-items: center;
}
.plan-label {
  font-weight: 700;
  font-size: var(--fib-sm);
  color: var(--muted);
  margin-top: 1rem;
}
.hero h1 {
  margin-top: 0.75rem;
  max-width: 19ch;
}
.lead {
  font-size: var(--fib-base);
  line-height: 1.8;
  color: var(--muted);
  margin-top: 1.5rem;
  max-width: 34rem;
}
.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  align-items: center;
  margin-top: 2rem;
}
.actions > a:not(.button) {
  font-size: var(--fib-sm);
  font-weight: 600;
}
.hero .small {
  margin-top: 1.25rem;
  max-width: 35rem;
}
.hero figure {
  position: relative;
  overflow: hidden;
  border-radius: 1.5rem;
  background: #dce0da;
}
.hero img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  object-fit: cover;
}
.hero figure::after {
  content: '';
  position: absolute;
  inset: 55% 0 0;
  background: linear-gradient(transparent, #101a23e0);
  pointer-events: none;
}
.hero figcaption {
  position: absolute;
  z-index: 1;
  inset: auto 1.5rem 1.25rem;
  color: #fff;
  font-size: var(--fib-sm);
  font-weight: 600;
}
.section {
  padding: 3.5rem 0;
}
.section-heading {
  display: grid;
  gap: 1.5rem;
  margin-bottom: 2rem;
}
.section-heading h2 {
  margin-top: 1rem;
}
.section-heading > p {
  font-size: var(--fib-base);
  color: var(--muted);
}
.deliverables {
  display: grid;
  gap: 1.25rem;
}
.deliverable {
  border: 1px solid var(--line);
  border-radius: 1rem;
  padding: 1.75rem;
}
.number {
  display: block;
  color: #b21132;
  font-size: var(--fib-xs);
  margin-bottom: 1.25rem;
}
.deliverable > p {
  margin-top: 1rem;
  color: var(--muted);
  font-size: var(--fib-sm);
}
.deliverable ul,
.plain-list {
  padding-left: 1.15rem;
  margin: 1.25rem 0 0;
  font-size: var(--fib-sm);
  color: var(--muted);
}
li {
  padding-left: 0.2rem;
  margin-top: 0.6rem;
}
li::marker {
  color: #b21132;
}
.tinted {
  background: var(--paper);
}
.example-grid,
.two-columns,
.faq-grid {
  display: grid;
  gap: 2.5rem;
}
.example-grid h2,
.two-columns h2,
.faq-grid h2 {
  margin-top: 1rem;
}
.example-grid p:not(.eyebrow) {
  margin-top: 1.25rem;
  color: var(--muted);
}
.example-steps {
  list-style: none;
  counter-reset: step;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 0.85rem;
}
.example-steps li {
  counter-increment: step;
  display: flex;
  align-items: start;
  gap: 1rem;
  margin: 0;
  background: white;
  border: 1px solid var(--line);
  padding: 1rem 1.25rem;
  border-radius: 0.8rem;
  color: var(--muted);
  font-size: var(--fib-sm);
}
.example-steps li::before {
  content: counter(step, decimal-leading-zero);
  color: #b21132;
  font-weight: 700;
  flex-shrink: 0;
}
.soft-card {
  padding: 1.75rem;
  background: var(--paper);
  border-radius: 1rem;
}
.soft-card .small {
  margin-top: 1.25rem;
}
.terms {
  margin: 1.5rem 0 0;
}
.terms > div {
  padding: 1rem 0;
  border-bottom: 1px solid #d9dede;
}
.terms dt {
  font-weight: 700;
  font-size: var(--fib-sm);
  line-height: 1.5;
}
.terms dd {
  margin: 0.5rem 0 0;
  font-size: var(--fib-sm);
  color: var(--muted);
}
details {
  border-bottom: 1px solid var(--line);
}
summary {
  padding: 1.25rem 0;
  font-size: var(--fib-sm);
  line-height: 1.6;
  cursor: pointer;
  font-weight: 700;
}
details p {
  color: var(--muted);
  font-size: var(--fib-sm);
  padding-bottom: 1.5rem;
}
.closing {
  padding: 3.5rem 0;
  background: #0a0a0a;
  color: white;
}
.closing .eyebrow {
  color: #ffb9c5;
}
.closing h2 {
  margin-top: 1rem;
  max-width: 35rem;
}
.closing p:not(.eyebrow) {
  margin-top: 1.25rem;
  max-width: 38rem;
  color: #c0c7cd;
}
.closing-inner {
  display: grid;
  align-items: center;
  gap: 2rem;
}
.closing .button {
  width: fit-content;
}
.footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1rem;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  font-size: var(--fib-xs);
  color: var(--muted);
}
@media (min-width: 768px) {
  h1 {
    font-size: var(--fib-3xl);
  }
  .wrap {
    padding-left: 2rem;
    padding-right: 2rem;
  }
  .login {
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
  }
  .deliverables {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .hero {
    padding: 4rem 0;
  }
  .hero-grid {
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
  }
  .section {
    padding: 4.5rem 0;
  }
  .section-heading {
    grid-template-columns: 1.1fr 1fr;
    gap: 4rem;
    align-items: end;
  }
  .example-grid,
  .two-columns {
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
  }
  .faq-grid {
    grid-template-columns: 0.85fr 1.2fr;
    gap: 4rem;
  }
  .closing-inner {
    grid-template-columns: 1.4fr 1fr;
    gap: 4rem;
  }
  .closing .button {
    justify-self: end;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}
@media print {
  .site-header,
  .footer,
  .actions,
  .closing,
  .login {
    display: none;
  }
  .section,
  .hero {
    padding: 1rem 0;
  }
  body {
    font-size: 10pt;
  }
  .deliverables,
  .two-columns {
    display: block;
  }
  .deliverable {
    break-inside: avoid;
    margin-bottom: 1rem;
  }
  details {
    break-inside: avoid;
  }
  details > * {
    display: block !important;
  }
  .hero-grid {
    display: block;
  }
  .hero figure {
    max-width: 20rem;
    margin-top: 1rem;
  }
  h1 {
    font-size: var(--fib-2xl);
  }
  h2 {
    font-size: var(--fib-lg);
  }
  a {
    color: #111;
  }
  .tinted,
  .hero,
  .soft-card {
    background: white;
  }
}

/* Menú público del Plan Básico. */
.price-note { padding: 1.5rem; background: var(--paper); border-radius: 1rem; margin-top: 2rem; }
.price-note p { margin-top: .5rem; }
.catalog-nav { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; margin: 1.5rem 0 3rem; font-size: var(--fib-sm); }
.catalog-group { margin-top: 3rem; scroll-margin-top: 2rem; }
.catalog-heading { display: flex; gap: 1rem; align-items: flex-start; margin-bottom: 1.5rem; }
.catalog-heading h3 { font-size: var(--fib-lg); }
.catalog-heading p { margin-top: .5rem; color: var(--muted); }
.group-number { font-family: 'Space Grotesk', sans-serif; font-size: var(--fib-lg); color: #b21132; }
.service-grid { display: grid; gap: 1rem; }
.service-card { display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--line); border-radius: 1.25rem; padding: 1.5rem; background: white; }
.service-cycle { font-size: var(--fib-xs); color: #b21132; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.service-card h4 { font-family: 'Space Grotesk', sans-serif; font-size: var(--fib-md); line-height: 1.4; margin: .75rem 0; text-wrap: balance; }
.service-card > p:not(.service-cycle) { color: var(--muted); font-size: var(--fib-sm); }
.service-price { margin: 1.5rem 0 1rem; display: flex; align-items: baseline; flex-wrap: wrap; gap: .25rem .5rem; }
.service-price > span { font-size: var(--fib-xs); color: var(--muted); }
.service-price strong { font-family: 'Space Grotesk', sans-serif; font-size: var(--fib-2xl); letter-spacing: -.04em; }
.recurring { flex-basis: 100%; color: #b21132; font-weight: 700; font-size: var(--fib-sm); }
.service-card ul { padding-left: 1.1rem; font-size: var(--fib-sm); margin: 0 0 1rem; }
.service-card li + li { margin-top: .5rem; }
.service-card details { margin-top: auto; font-size: var(--fib-sm); }
.service-card details p { margin-top: .75rem; color: var(--muted); }
.service-contact { display: flex; justify-content: space-between; gap: .5rem; color: #b21132; font-weight: 700; font-size: var(--fib-sm); margin-top: 1.25rem; padding: .5rem 0; }
.market-note { margin-top: 3rem; font-size: var(--fib-sm); }
.market-note p { margin-top: 1rem; }
@media (min-width: 640px) { .service-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (min-width: 1024px) { .service-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media print { .service-grid { display: block; } .service-card { break-inside: avoid; margin-bottom: 1rem; } .catalog-nav,.service-contact { display: none; } }
.breadcrumbs { display:flex; flex-wrap:wrap; gap:.5rem; color:var(--muted); font-size:var(--fib-xs); margin-bottom:2rem; }
.service-intro-grid { display:grid; gap:2rem; align-items:start; }
.service-quote { border:1px solid var(--line); border-radius:1.25rem; background:white; padding:1.5rem; min-width:0; }
.service-quote p + p { margin-top:1rem; }
.service-quote > p,.service-quote > a { font-size:var(--fib-sm); }
.service-quote > a { display:inline-block; margin-top:1rem; }
.related-services { display:grid; gap:1rem; margin:2rem 0; }
.service-hero .lead { margin-top:1.5rem; }
@media(min-width:768px) { .service-intro-grid { grid-template-columns:1.5fr 1fr; gap:4rem; } .related-services { grid-template-columns:repeat(2,minmax(0,1fr)); } }

.service-example-image { margin:1.25rem 0; }
.service-example-image img { display:block; width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; border-radius:1rem; }

.service-card .service-contact { margin-top:auto; padding-top:1.5rem; }
.service-detail-visual img { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; border-radius:1.25rem; }
.service-disclosures details p { margin-top:1rem; }