/* Paleta compartida: pastel con más profundidad y presencia. */
:root {
  --blue: #284f7c;
  --cyan: #a9dfe7;
  --yellow: #efc870;
  --neutral: #fcf7f2;
  --cream: #fcf7f2;
  --ink: #243a55;
  --panel-blue: #456f9f;
  --panel-deep: #345c8c;
  --mist: #dceef3;
  --accent-ink: #885d1e;
}

body { background: var(--cream); color: var(--ink); }
body::-webkit-scrollbar-thumb { background: #789cc4; }
.reading-progress span, .progress span {
  background: linear-gradient(90deg, var(--yellow), #8fd2df, #668fbe);
}

/* Superficies oscuras: mantienen contraste, con azul menos saturado. */
.hero, .programs, .profile-hero, .work-story, .beliefs,
.dark-section, .annual-hero, .annual-quote, .profile-closing,
.front-closing, footer, .profile-footer, .front-footer, .annual-footer {
  background: var(--panel-blue);
  color: #fff;
}
.hero-wash {
  background: linear-gradient(90deg, #345c8ce8 0%, #456f9fc7 43%, #456f9f68 78%, #345c8c8c 100%),
              linear-gradient(0deg, #345c8cab, transparent 55%);
}
.profile-closing, .front-closing, .annual-quote, .annual-hero {
  background: linear-gradient(135deg, var(--panel-deep), var(--panel-blue) 60%, #5c86b4);
}
.program-stage:before, .front-statement:after, .work-story:after {
  background: #c9edf02b;
}
.profile-orb, .front-orb {
  background: radial-gradient(circle at 35% 35%, #c9edf07a, #c9edf010 60%, transparent 70%);
}
.hero-photo-halo {
  background: linear-gradient(145deg, #efc870, #e4a79f);
}
.hero-glass-card, .glass-chip, .visual-caption {
  background: #345c8ca3;
}
.profile-footer, .front-footer, .annual-footer, footer {
  background: var(--panel-deep);
}

/* Bloques claros y detalles de la portada. */
.about, .news, .contact, .instagram-section, .x-section.section,
.profile-intro, .journey, .front-intro, .annual-main, .year-switcher {
  background-color: var(--cream);
}
.videos { background: #c5e5eb; }
.social-story .x-intro {
  background: radial-gradient(circle at 82% 20%, #cce8ee 0%, transparent 35%),
              radial-gradient(circle at 12% 84%, #f3dfbf 0%, transparent 31%),
              var(--cream);
}
.x-section.section {
  background: linear-gradient(135deg, var(--cream), #deeff3 58%, var(--cream));
}
.social-feeds {
  background: linear-gradient(180deg, var(--mist), var(--cream));
}
.front-years, .annual-stage {
  background: linear-gradient(135deg, var(--cream), var(--mist));
}
.journey-quote { background: linear-gradient(125deg, #d5ecf0, #fff); }
.cursor-glow { background: #8dc8dd42; }
.news-card, .instagram-shell, .x-shell {
  box-shadow: 0 20px 55px #304c7317;
}
.about:before { background: #8dcbd83d; }
.contact:before { background: #efc8704a; }
.back-to-top, .profile-top, .front-top, .top {
  background: #456f9ff2;
  box-shadow: 0 12px 32px #304c7333;
}

/* Tarjetas: la fotografía conserva protagonismo y el texto sigue legible. */
.program-card { border-color: #e7eff5a3; box-shadow: 0 26px 58px #243b6470; }
.program-card:after {
  background: linear-gradient(180deg, #324c6a1c 0%, #324c6a50 39%, #273d63de 78%, #27395ef5 100%);
}
.program-card.angelelli:after {
  background: linear-gradient(180deg, #ae79552e 0%, #6c556a69 42%, #3d466cde 80%, #303d64f5 100%);
}
.program-card.revoluciona:after {
  background: linear-gradient(180deg, #b280a345 0%, #866e9a75 42%, #514d7cde 80%, #383e68f5 100%);
}
.program-card.fronteras:after {
  background: linear-gradient(180deg, #6ba6bb35 0%, #497d9b70 42%, #365e87de 80%, #304f7af5 100%);
}
.program-card .card-tag { background: #345c8c8f; }
.program-transform { color: var(--yellow); }
.year-card, .chapter { background: var(--panel-blue); }
.year-card:after { background: linear-gradient(90deg, #345c8cc2, #345c8c52); }
.chapter:before { background: linear-gradient(180deg, #345c8c38 5%, #294f7fe6 100%); }

/* Acentos sobre fondos claros: un poco más profundos para poder leerlos. */
.values b, .news-content time, .feed-heading span,
.chapter-index { color: var(--accent-ink); }
.chapter-index { color: var(--yellow); }
.arrow-link i, .contact-form button { background: var(--panel-blue); }
.contact-form button:hover { background: var(--panel-deep); }
.primary-button, .profile-primary, .front-primary, .annual-action {
  box-shadow: 0 14px 32px #304c7330;
}
.profile-top, .front-top, .top, .back-to-top { border-color: #ffffffb8; }

/* Cabeceras flotantes más delicadas. */
.site-header, .profile-header, .front-header, .annual-header {
  background: linear-gradient(100deg, #345c8c73, #638bb04a);
  border-bottom-color: #ffffff55;
}
.site-header.scrolled, .profile-header.scrolled,
.front-header.scrolled, .annual-header.scrolled {
  background: #fcf7f2e8;
  border-bottom-color: #ffffffbd;
  box-shadow: 0 12px 36px #304c731a;
}
@media (max-width: 980px) {
  .main-nav, .profile-nav, .front-nav, .annual-nav {
    background: #fcf7f2f2;
    box-shadow: 0 18px 45px #304c7324;
  }
}
@media (max-width: 620px) {
  .hero-wash {
    background: linear-gradient(90deg, #345c8cf2, #456f9fca),
                linear-gradient(0deg, #345c8ccc, transparent 70%);
  }
}

/* Dirección editorial: aire y contraste sin alterar la tipografía original. */
.kicker, .profile-kicker, .front-kicker, .eyebrow {
  letter-spacing: .15em;
}
.kicker > span, .profile-kicker > span,
.front-kicker > span, .eyebrow > span {
  width: 38px;
  height: 2px;
  border-radius: 999px;
}

/* Primeras pantallas: menos masa de color, fotografía más luminosa. */
.hero-wash {
  background: linear-gradient(90deg, #344f75e8 0%, #4f6d98bf 44%, #6b86a669 80%, #4f6d987b 100%),
              linear-gradient(0deg, #344f7580, transparent 55%);
}
.hero-video video, .hero-video iframe { filter: saturate(.78) contrast(.95); }
.hero-copy { max-width: 900px; }
.profile-hero, .front-hero {
  background: linear-gradient(130deg, #3c6596 0%, #527dab 72%, #7198c0 100%);
}
.front-hero-visual {
  border-radius: 30px;
  border-color: #ffffffa8;
  box-shadow: 0 28px 70px #2e45684a;
}
.front-hero-visual img { filter: saturate(.86); }
.profile-hero-art > img {
  filter: saturate(.86) drop-shadow(0 28px 45px #2e456849);
}
.front-hero-visual:after {
  background: linear-gradient(180deg, #304c7308, #304c7391);
}
.profile-orb, .front-orb { opacity: .65; }

/* Ritmo entre secciones y marcos de imagen más amables. */
.about {
  background: radial-gradient(ellipse at 94% 8%, #cfe7ed 0%, transparent 32%),
              radial-gradient(ellipse at 8% 92%, #f1ddd8 0%, transparent 28%),
              var(--cream);
}
.about-image img {
  border-radius: 28px;
  filter: saturate(.82) contrast(.96);
  box-shadow: 0 30px 70px #304c7321;
}
.about-image:before {
  inset: -16px 18px 16px -16px;
  border-color: #a9d7e3;
  border-radius: 31px;
}
.floating-stat.glass, .journey-quote, .contact-form.glass {
  background: #fffdfae8;
  border: 1px solid #dbe8ef;
  box-shadow: 0 24px 60px #304c7317;
}
.values div { border-color: #a9c2d88c; }
.values div:hover { background: #ffffffb8; }
.front-split-section.reverse {
  background: linear-gradient(110deg, #deeff3, #fbf1ed);
}
.front-split-section .split-image img {
  border-radius: 28px;
  box-shadow: 0 25px 60px #304c7321;
  filter: saturate(.84) contrast(.97);
}
.front-gallery { background: #f7fafb; }
.masonry-gallery img, .statement-image, .belief-image {
  border-radius: 32px;
}
.belief-image img { filter: saturate(.86); }

/* Iniciativas: conservan la entrada animada y ganan una presentación menos dura. */
.programs {
  background: linear-gradient(145deg, #3b6393 0%, #4978a8 55%, #5a88b3 100%);
}
.program-stage:before {
  width: 760px;
  height: 760px;
  background: #d8eef129;
  filter: blur(95px);
}
.program-card {
  border-radius: 38px;
  border-color: #ffffffa6;
  box-shadow: 0 22px 58px #253d6463;
}
.program-card.program-card > .card-photo { filter: saturate(.8) contrast(.96); }
.program-card:hover .card-photo { filter: saturate(.92) contrast(1); }
.program-card .card-tag {
  border-color: #ffffffa3;
  background: #3b587fad;
  border-radius: 999px;
}
.program-card .card-link b { background: var(--cream); }

/* Conversación y contacto: superficies claras, con un acento rosa muy sutil. */
.x-section.section {
  background: radial-gradient(ellipse at 92% 12%, #cfe7ed 0%, transparent 38%),
              radial-gradient(ellipse at 3% 86%, #f0dcd8 0%, transparent 31%),
              var(--cream);
}
.instagram-shell, .x-shell, .news-card {
  border: 1px solid #e2ecf0;
  border-radius: 34px;
  background: #fffefa;
  box-shadow: 0 20px 48px #304c7314;
}
.feed-heading h3 { font-weight: 600; }
.contact {
  background: radial-gradient(ellipse at 96% 9%, #cfe7ed 0%, transparent 36%),
              radial-gradient(ellipse at 8% 90%, #f1ddd8 0%, transparent 31%),
              var(--cream);
}
.contact-form {
  border: 1px solid #dce7ef;
  border-radius: 36px;
  box-shadow: 0 28px 68px #304c731b;
}
.field input, .field textarea { border-bottom-color: #a9bfd4; }
.field input:focus, .field textarea:focus { border-bottom-color: #587dab; }

/* Detalles comunes: botones, navegación y tarjetas más livianos. */
.primary-button, .profile-primary, .front-primary, .annual-action {
  background: #efc870;
  border: 1px solid #f7dda3;
  color: #304c73;
  border-radius: 999px;
}
.nav-button, .profile-nav-button, .front-nav-button, .annual-btn {
  border-color: #ffffffba;
  background: #ffffff26;
  box-shadow: inset 0 1px #ffffff6b;
}
.site-header.scrolled .nav-button,
.profile-header.scrolled .profile-nav-button,
.front-header.scrolled .front-nav-button,
.annual-header.scrolled .annual-btn {
  background: #fffdfaaf;
  border-color: #b9cfdf;
}
.chapter, .year-card { border-radius: 34px; }
.annual-stage, .front-years { background: linear-gradient(130deg, var(--cream), var(--mist)); }

@media (max-width: 620px) {
  .hero-wash {
    background: linear-gradient(90deg, #344f75ed, #5877a1bb),
                linear-gradient(0deg, #344f75bf, transparent 70%);
  }
  .about-image img { border-radius: 24px; }
  .front-hero-visual { border-radius: 24px; }
  .program-card { border-radius: 30px; }
  .instagram-shell, .x-shell, .news-card { border-radius: 26px; }
}

/* Segunda pasada: jerarquía, espacios y detalles editoriales. */
.about h2, .contact h2, .program-heading h2,
.x-intro h2, .intro-heading h2, .journey-head h2,
.work-copy h2, .beliefs-title h2, .front-title h2,
.years-heading h2, .annual-intro h2, .annual-stage h2 {
  text-wrap: balance;
}
.about-copy > p:not(.kicker), .contact-intro > p:not(.kicker),
.intro-copy p, .journey-copy p, .front-copy p,
.front-split-section .split-content p:not(.front-kicker),
.annual-intro p, .clone-section p {
  color: #52627a;
  font-size: clamp(15px, 1.05vw, 17px);
  line-height: 1.85;
}
.section, .profile-section, .front-section, .annual-main, .annual-stage {
  padding-top: clamp(92px, 9.5vw, 140px);
  padding-bottom: clamp(92px, 9.5vw, 140px);
}

/* Bloques de contenido con una silueta más orgánica. */
.profile-intro, .journey, .front-split-section {
  position: relative;
}
.profile-intro:after, .journey:after, .front-split-section:after {
  content: "";
  position: absolute;
  z-index: 0;
  width: clamp(180px, 20vw, 330px);
  aspect-ratio: 1;
  border: 1px solid #b9d4e185;
  border-radius: 50%;
  pointer-events: none;
}
.profile-intro:after { right: -10%; bottom: -16%; }
.journey:after { left: -9%; bottom: -22%; }
.front-split-section:after { right: -7%; bottom: -10%; }
.profile-intro > *, .journey > *, .front-split-section > * {
  position: relative;
  z-index: 1;
}
.intro-number, .front-number {
  color: #8ea8c330;
}

/* Perfil: relatos que se leen como piezas editoriales, no como bloques rígidos. */
.work-story {
  background: linear-gradient(145deg, #3b6597, #4e7ba9);
  border-radius: 0 0 clamp(42px, 7vw, 110px) 0;
}
.work-frame {
  border-color: #d9edf0a3;
  background: linear-gradient(145deg, #d7edf24f, #f5dca747);
}
.work-visual > span {
  background: #405d85c9;
  border-color: #ffffff9c;
}
.work-facts div { border-color: #d7e6ee75; }
.beliefs {
  background: linear-gradient(145deg, #345c8c 0%, #416f9f 55%, #527faa 100%);
}
.belief-card {
  min-height: 580px;
  border-color: #dce9ee52;
}
.belief-card + .belief-card { margin-top: 24px; }
.belief-image {
  border: 1px solid #ffffff7d;
  box-shadow: 0 24px 60px #263e6161;
}
.belief-copy {
  padding: clamp(12px, 2vw, 30px);
}
.belief-index {
  color: #ffffff21;
}
.profile-closing, .front-closing {
  border-radius: clamp(48px, 7vw, 110px) 0 0 0;
}

/* Galería cultural: ritmo alternado y fotografías menos cuadriculadas. */
.masonry-gallery {
  gap: clamp(14px, 1.7vw, 26px);
  align-items: start;
}
.masonry-gallery img {
  border: 1px solid #ffffff;
  border-radius: 28px;
  box-shadow: 0 18px 44px #304c7318;
  filter: saturate(.84) contrast(.97);
}
.masonry-gallery img:nth-child(3n + 2) {
  transform: translateY(clamp(12px, 2.2vw, 34px));
  border-radius: 28px;
}
.year-grid { gap: clamp(18px, 2vw, 30px); }
.year-card {
  border-color: #ffffff;
  box-shadow: 0 20px 52px #304c731c;
}
/* Páginas anuales: secciones de lectura más refinadas. */
.intro-wrapper {
  background: linear-gradient(135deg, #3b6595, #5782af) !important;
  border-radius: 0 0 clamp(48px, 7vw, 100px) 0;
}
.intro-wrapper h1, .intro-wrapper h2 {
  color: #fff4de !important;
  text-wrap: balance;
}
.clone-main {
  background: radial-gradient(ellipse at 95% 4%, #e4f1f4, transparent 27%),
              var(--cream) !important;
}
.clone-section { max-width: 1120px !important; }
.clone-section h1, .clone-section h2, .clone-section h3 {
  color: var(--blue) !important;
  text-wrap: balance;
}
.clone-section h2 {
  border-bottom: 0 !important;
  padding-bottom: 18px !important;
  position: relative;
}
.clone-section h2:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 72px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, #e6bd72, #9ecedc);
}
.clone-section .full-img,
.clone-section .photo-gallery img,
.clone-section .poster-gallery-2 img,
.clone-section .poster-gallery-4 img,
.clone-section .banner-gallery img,
.clone-section .banner-split img {
  border: 1px solid #fff;
  border-radius: 28px !important;
  box-shadow: 0 18px 46px #304c731a;
  filter: saturate(.86) contrast(.98);
}
.year-links a {
  border-color: #a9bfd4;
  background: #fffdfab8;
}

/* Cierres y pie con una transición más liviana. */
.profile-closing h2, .front-closing h2 {
  max-width: 1100px;
  text-wrap: balance;
}
.profile-closing:after, .front-closing:after, .annual-quote:after {
  border-color: #d4e9ee69;
  box-shadow: 0 0 0 72px #d7edf00d, 0 0 0 144px #ffffff0a;
}
footer, .profile-footer, .front-footer, .annual-footer {
  border-top: 1px solid #ffffff36;
}

@media (max-width: 980px) {
  .profile-intro:after, .journey:after, .front-split-section:after { opacity: .55; }
  .belief-card { min-height: 0; }
  .masonry-gallery img:nth-child(3n + 2) { transform: none; border-radius: 28px; }
}
@media (max-width: 620px) {
  .section, .profile-section, .front-section, .annual-main, .annual-stage {
    padding-top: 78px;
    padding-bottom: 78px;
  }
  .about-copy > p:not(.kicker), .contact-intro > p:not(.kicker),
  .intro-copy p, .journey-copy p, .front-copy p,
  .front-split-section .split-content p:not(.front-kicker),
  .annual-intro p, .clone-section p {
    font-size: 15px;
    line-height: 1.75;
  }
  .work-story, .profile-closing, .front-closing {
    border-radius: 0;
  }
  .belief-copy { padding: 8px 0; }
  .belief-copy h3 { font-size: clamp(34px, 10vw, 44px); }
  .intro-wrapper { border-radius: 0 0 46px 0; }
  .clone-main { padding-top: 46px !important; }
  .clone-section .photo-gallery img { height: auto; aspect-ratio: 4 / 3; }
}