/* Seminario EAM 2027 · sección destacada en la página principal */

@font-face {
  font-family: "Caslon Graphique";
  src: url("../fonts/CaslonGraphique.otf") format("opentype");
  font-display: swap;
}

.s27 { --s27-sky-ink: #3c7290; --s27-orange: #ffa550; --s27-orange-deep: #ef7d22; --s27-brown: #8c5323; --s27-cream: #f2f0e1; --s27-ink: #2f3b45; }
.s27-display { font-family: "Caslon Graphique", Georgia, serif; text-transform: uppercase; font-weight: 400; letter-spacing: .01em; }
.s27-nowrap { white-space: nowrap; }

/* Bloque principal */
.s27-hero {
  position: relative; overflow: hidden; color: #fff; padding: 90px 0;
  background: linear-gradient(rgba(38,78,102,.38), rgba(38,78,102,.38)), #5e9ab2 url("../img/seminario2027/bg-blue.webp") center / cover;
}
.s27-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 40px; align-items: center; }
.s27-kicker { font-family: "Montserrat", sans-serif; font-weight: 700; font-size: 13px; letter-spacing: .22em; text-transform: uppercase; margin: 0 0 16px; opacity: .92; }
.s27-title { font-size: clamp(30px, 5vw, 72px); line-height: .98; color: #fbf6e6; margin: 0; text-shadow: 0 6px 30px rgba(30,60,80,.35); }
.s27-tagline { font-family: "Caslon Graphique", Georgia, serif; font-size: clamp(19px, 2.2vw, 26px); margin: 16px 0 26px; }
.s27-meta { font-family: "Montserrat", sans-serif; font-size: 17px; line-height: 1.6; border-left: 3px solid var(--s27-orange); padding-left: 16px; margin: 0 0 14px; }
.s27-meta strong { font-size: 20px; }
.s27-speaker { font-family: "Montserrat", sans-serif; font-size: 16px; margin: 0 0 28px; }
.s27-cta { display: flex; flex-wrap: wrap; gap: 12px; }

.s27-btn {
  display: inline-flex; align-items: center; justify-content: center; padding: 13px 26px; border-radius: 999px; border: 2px solid transparent;
  font-family: "Montserrat", sans-serif; font-weight: 700; font-size: 14px; letter-spacing: .12em; text-transform: uppercase; text-decoration: none;
  transition: transform .2s ease, background-color .2s ease, color .2s ease;
}
.s27-btn:hover { transform: translateY(-2px); }
.s27-btn:focus-visible { outline: 3px solid var(--s27-orange-deep); outline-offset: 3px; }
.s27-btn-sun { background: var(--s27-orange-deep); color: #fff; box-shadow: 0 8px 24px -10px rgba(239,125,34,.9); }
.s27-btn-sun:hover { background: #d96a12; color: #fff; }
.s27-btn-ghost { border-color: rgba(255,255,255,.9); color: #fff; }
.s27-btn-ghost:hover { background: rgba(255,255,255,.15); color: #fff; }
.s27-btn-dark { border-color: var(--s27-brown); color: var(--s27-brown); }
.s27-btn-dark:hover { background: var(--s27-brown); color: var(--s27-cream); }

.s27-art { position: relative; aspect-ratio: 1; width: 100%; max-width: 440px; justify-self: center; }
.s27-art::before { content: ""; position: absolute; inset: -14%; border-radius: 50%; background: radial-gradient(circle, rgba(255,165,80,.45), transparent 62%); }
.s27-art .s27-sun { position: absolute; inset: 0; width: 100%; }
.s27-art .s27-cloud { position: absolute; width: 80%; left: -28%; bottom: 0; animation: s27-float 9s ease-in-out infinite; }
@keyframes s27-float { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(6%); } }

/* Franja del memorial */
.s27-memorial { background: linear-gradient(135deg, #f2f0e1 0%, #e3e3e6 60%, #d4dae4 100%); color: var(--s27-ink); padding: 44px 0; }
.s27-mem-grid { display: grid; grid-template-columns: 150px 1fr auto; gap: 32px; align-items: center; }
.s27-mem-photo { width: 150px; height: 150px; border-radius: 50%; object-fit: cover; border: 5px solid #fff; box-shadow: 0 0 0 7px rgba(255,165,80,.55), 0 20px 40px -24px rgba(47,59,69,.7); }
.s27-mem-kicker { font-family: "Montserrat", sans-serif; font-weight: 700; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--s27-sky-ink); margin: 0 0 8px; }
.s27-mem-title { font-size: clamp(28px, 3.4vw, 40px); color: var(--s27-ink); margin: 0 0 10px; line-height: 1.05; }
.s27-memorial p.s27-mem-text { font-size: 16px; line-height: 1.6; margin: 0; color: #4a5560; }
.s27-free { display: inline-block; background: var(--s27-orange-deep); color: #fff; font-family: "Montserrat", sans-serif; font-weight: 700; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; margin-top: 12px; }

@media (max-width: 991px) {
  .s27-hero { padding: 64px 0; }
  .s27-grid { grid-template-columns: 1fr; }
  .s27-art { order: -1; max-width: 260px; }
  .s27-mem-grid { grid-template-columns: 110px 1fr; gap: 20px; }
  .s27-mem-photo { width: 110px; height: 110px; }
  .s27-mem-grid .s27-btn { grid-column: 1 / -1; justify-self: start; }
}
@media (max-width: 575px) {
  .s27-mem-grid { grid-template-columns: 1fr; }
  .s27-mem-photo { margin: 0 auto; }
}
@media (prefers-reduced-motion: reduce) { .s27-art .s27-cloud { animation: none; } .s27-btn { transition: none; } }