@font-face {
  font-family: 'Montserrat';
  src: url('../Resources/Fonts/Montserrat-Regular.ttf') format('truetype');
  font-weight: 400; font-style: normal;
}
@font-face {
  font-family: 'Montserrat';
  src: url('../Resources/Fonts/Montserrat-Bold.ttf') format('truetype');
  font-weight: 700; font-style: normal;
}
@font-face {
  font-family: 'Montserrat';
  src: url('../Resources/Fonts/Montserrat-SemiBold.ttf') format('truetype');
  font-weight: 600; font-style: normal;
}
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@700&display=swap');

/* ===== Base ===== */
* { margin:0; padding:0; box-sizing:border-box; }
html, body { height:100%; }
body {
  font-family:'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:#f4f4f4; color:#000;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.roman { font-family:'Cinzel', serif; font-weight:700; color:#00594E; margin-right:6px; }

/* ===== Contenedor ===== */
.container {
  max-width:1100px; margin:20px auto; background:#fff;
  border-radius:18px; box-shadow:0 6px 20px rgba(0,0,0,0.08); overflow:hidden;
}
.content { padding:40px 20px; }

/* ===== Header (idéntico) ===== */
.header {
  display:grid; grid-template-columns:auto 1fr auto; align-items:center;
  column-gap:20px; margin-bottom:20px; padding-top:10px;
}
.header h1 {
  font-size:clamp(1.8rem,4vw,2.5rem); font-weight:700; color:#00594E; text-align:center; line-height:1.2;
}
.logo-universidad, .logo-seminario { max-height:90px; width:auto; object-fit:contain; }

/* ===== Menú ===== */
.menu {
  display:flex; justify-content:center; gap:15px;
  margin-bottom:30px; flex-wrap:wrap;
}
.btn-nav {
  background:#00594E; color:#fff; padding:12px 20px;
  border-radius:10px; text-decoration:none; font-weight:600; font-size:1rem;
  transition:transform .2s, background-color .2s, filter .2s;
  min-height:44px; display:inline-flex; align-items:center; justify-content:center;
}
.btn-nav:hover { background:#B5A160; transform:scale(1.05); }

/* ===== Card ===== */
.card {
  background:#fff; border:2px solid #00594E; border-radius:12px; padding:24px;
  box-shadow:0 6px 16px rgba(0,0,0,0.08); margin-bottom:20px;
}
.card h2 { color:#00594E; margin-bottom:12px; }

/* ===== Player ===== */
.player {
  position:relative; padding-bottom:56.25%; height:0; overflow:hidden;
  border-radius:12px; border:1px solid #00594E; background:#000;
}
.player iframe {
  position:absolute; top:0; left:0; width:100%; height:100%; border-radius:12px; border:0;
}

/* ===== Alertas ===== */
.alert {
  padding:12px 20px; margin:10px 0; border-radius:8px; font-weight:600; text-align:center;
}
.alert-success { background:#DFF2E4; color:#00594E; border:1px solid #00594E; }
.alert-error { background:#FDE2E2; color:#D8000C; border:1px solid #D8000C; }

/* ===== Footer (idéntico) ===== */
.footer {
  background:#00594E; color:#fff; padding:30px; display:grid; grid-template-columns:auto 1fr auto;
  align-items:center; column-gap:20px; text-align:center;
}
.footer-center { display:flex; flex-direction:column; align-items:center; gap:6px; }
.footer p { margin:5px 0; font-size:0.9rem; line-height:1.5; }
.footer-container p:first-child { font-size:1rem; margin-bottom:4px; font-weight:600; }
.footer .logo-universidad, .footer .logo-seminario { max-height:100px; width:auto; object-fit:contain; }

/* =========================
   BREAKPOINTS RESPONSIVE
========================= */

/* Tablets ≤ 900px */
@media (max-width: 900px) {
  .content { padding: 28px 18px; }
  .menu { gap: 12px; }
  .btn-nav { padding: 12px 16px; font-size: 0.98rem; }
  .card { padding: 20px; }
  .logo-universidad, .logo-seminario { max-height: 76px; }
}

/* Móviles ≤ 700px (coincide con tu plantilla) */
@media (max-width: 700px) {
  .header { grid-template-columns:1fr; row-gap:12px; }
  .logo-universidad, .logo-seminario { justify-self:center; max-height:64px; }
  .header h1 { max-width:90%; justify-self:center; }

  /* Menú en 1 columna, botones a ancho completo */
  .menu {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding: 0 2px;
  }
  .btn-nav {
    width: 100%;
    max-width: none;
    padding: 14px 16px;
    font-size: 0.95rem;
    border-radius: 12px;
  }

  .content { padding: 24px 14px; }
  .card { padding: 18px; }
  .card h2 { font-size: 1.15rem; }

  .footer { grid-template-columns:1fr; row-gap:12px; }
  .footer .logo-universidad, .footer .logo-seminario { justify-self:center; max-height:56px; }
}

/* Móviles pequeños ≤ 400px */
@media (max-width: 400px) {
  .btn-nav { font-size: 0.92rem; padding: 14px; }
  .card { padding: 16px; }
  .footer p { font-size: 0.85rem; }
}

/* Accesibilidad: reducir “salto” en hover en pantallas táctiles */
@media (hover: none) {
  .btn-nav:hover { transform:none; }
}
