/* Paleta elegida por el propietario: Coolors / d9ed92 … 184e77.
   Los tonos claros se reservan para fondos; el texto usa los azules oscuros. */
:root {
  --lime: #d9ed92;
  --light-green: #b5e48c;
  --green-soft: #99d98c;
  --mint: #76c893;
  --sea-green: #52b69a;
  --teal: #34a0a4;
  --cyan: #168aad;
  --blue: #1a759f;
  --deep-blue: #1e6091;
  --navy: #184e77;

  --ink: var(--navy);
  --green: var(--navy);
  --accent: var(--lime);
  --muted: var(--deep-blue);
  --line: color-mix(in srgb, var(--teal) 23%, white);
  --wash: color-mix(in srgb, var(--lime) 17%, white);
  --paper: #fff;
}

::selection { background: var(--light-green); color: var(--navy); }
a:focus-visible, button:focus-visible { outline-color: var(--blue); }
.brand-logo { background: var(--navy); }
.brand-pe, .header-inner nav > a:not(.nav-cta):hover,
.text-link:hover, .strip-inner a:hover, .watch-label,
.about-section .eyebrow, .section-heading .eyebrow,
.community-section .eyebrow { color: var(--blue); }
.eyebrow-line { background: var(--teal); }
.hero h1 > span::after { background: var(--lime); }
.hero-footnote, .feature-number, .video-meta, .videos-status,
.strip-inner a > span, .excel-card .resource-category,
.excel-card .resource-note, .network-arrow, .footer-bottom {
  color: var(--deep-blue);
}
.muted-heading { color: var(--blue); }

.button-dark { background: var(--navy); color: white; }
.button-dark:hover { background: var(--deep-blue); }
.button-lime { background: var(--lime); color: var(--navy); }
.button-lime:hover { background: var(--light-green); }
.nav-cta:hover, .community-links > a:hover { background: var(--wash); }

.hero-feature {
  background: linear-gradient(125deg, var(--navy), var(--deep-blue));
  border-color: var(--line);
  box-shadow: 0 18px 45px #184e7712;
}
.feature-topline {
  background: linear-gradient(100deg, color-mix(in srgb, var(--lime) 36%, white), color-mix(in srgb, var(--mint) 16%, white));
  color: var(--navy);
}
.feature-copy p, .dashboard-card > p:not(.resource-category),
.dashboard-card .resource-note {
  color: color-mix(in srgb, var(--light-green) 32%, white);
}
.feature-link { border-color: #ffffff38; }
.feature-link:hover { color: var(--lime); }
.pill, .pill-light { color: var(--lime); border-color: var(--sea-green); }
.pill-outline { color: var(--deep-blue); border-color: var(--line); }
.video-cover, .video-thumbnail { background: var(--navy); }
.video-play svg { fill: var(--navy); }
.card-play { background: white; color: var(--navy); }
.video-platform, .video-duration, .resource-preview > span {
  background: #184e77f5;
  color: white;
}
.video-card:hover { box-shadow: 0 14px 32px #184e7712; }

.resources-section {
  background: linear-gradient(135deg, var(--wash), color-mix(in srgb, var(--sea-green) 10%, white));
  border-color: var(--line);
}
.dashboard-card { background: var(--navy); }
.resource-preview, .excel-preview {
  background: linear-gradient(135deg, color-mix(in srgb, var(--green-soft) 26%, white), color-mix(in srgb, var(--cyan) 12%, white));
}
.excel-preview img { filter: drop-shadow(0 3px 8px #184e7722); }
.resource-icon { background: #ffffff12; color: var(--light-green); }
.excel-card .resource-icon { background: var(--light-green); color: var(--navy); }
.resource-category { color: var(--light-green); }
.resource-tags span { border-color: var(--line); color: var(--deep-blue); }
.topic-number { color: var(--navy); background: var(--lime); }
.topic-list > div:nth-child(2) .topic-number { background: var(--light-green); }
.topic-list > div:nth-child(3) .topic-number { background: var(--green-soft); }

.network-icon.youtube { background: var(--lime); color: var(--navy); }
.network-icon.instagram { background: var(--light-green); color: var(--navy); }
.network-icon.tiktok { background: var(--green-soft); color: var(--navy); }
.network-icon.facebook { background: var(--mint); color: var(--navy); }
footer { background: color-mix(in srgb, var(--teal) 7%, white); }

/* Iconos de las redes con sus colores de marca y nombres siempre legibles. */
.strip-inner { flex-wrap: wrap; gap: 12px 32px; padding-block: 12px; }
.strip-inner a { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; }
.strip-inner .social-brand-icon { width: 24px; height: 24px; flex: 0 0 24px; object-fit: contain; }
@media (max-width: 760px) {
  .strip-inner { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 16px; padding-block: 18px; }
  .strip-inner > span { grid-column: 1 / -1; text-align: center; margin-bottom: 8px; }
  .strip-inner a { justify-content: flex-start; gap: 8px; padding-block: 6px; }
}

/* Vista real del recurso: conservar la interfaz completa, sin recortes. */
.dashboard-preview img { object-fit: contain; }
.privacy-page { max-width: 820px; padding-top: 76px; padding-bottom: 80px; }
.privacy-page h1 { font-size: clamp(2.5rem, 6vw, 4.2rem); letter-spacing: -.045em; line-height: 1.1; margin: 16px 0 24px; }
.privacy-lead { font-size: 1.2rem; line-height: 1.7; }
.privacy-date { color: var(--muted); font-size: .85rem; margin: 22px 0 40px; }
.privacy-page section { border-top: 1px solid var(--line); padding: 28px 0 12px; }
.privacy-page section h2 { font-size: 1.45rem; letter-spacing: -.025em; margin-bottom: 16px; }
.privacy-page section p { line-height: 1.8; margin-bottom: 16px; }
.privacy-page section a { text-decoration: underline; text-underline-offset: 3px; }
.privacy-page > .button { margin-top: 24px; }
@media (max-width: 600px) {
  .privacy-page { padding-top: 44px; padding-bottom: 48px; }
  .privacy-page .privacy-lead { font-size: 1.05rem; }
  .footer-nav { flex-wrap: wrap; }
}
