/* =========================================
   HERO
========================================= */

.admission-hero {
  position: relative;

  min-height: 760px;

  display: flex;
  align-items: center;

  padding-top: 90px;

  overflow: hidden;

  color: white;

  background:
    radial-gradient(
      circle at 80% 30%,
      rgba(255, 255, 255, 0.12),
      transparent 28%
    ),
    linear-gradient(
      125deg,
      #061d33 0%,
      var(--primary-dark) 45%,
      var(--primary) 100%
    );
}


.admission-hero::before {
  content: "";

  position: absolute;

  width: 650px;
  height: 650px;

  right: -260px;
  top: -210px;

  border-radius: 50%;

  border:
    1px solid
    rgba(255,255,255,0.12);
}


.admission-hero::after {
  content: "";

  position: absolute;

  width: 380px;
  height: 380px;

  right: 100px;
  bottom: -240px;

  border-radius: 50%;

  background:
    rgba(255,255,255,0.035);
}


.admission-hero-container {
  position: relative;

  z-index: 2;

  display: grid;

  grid-template-columns:
    1.2fr 0.8fr;

  gap: 80px;

  align-items: center;
}


.admission-hero-content {
  max-width: 820px;
}


.admission-hero-label {
  display: block;

  margin-bottom: 18px;

  font-size: 0.78rem;
  font-weight: 800;

  letter-spacing: 0.18em;

  text-transform: uppercase;

  color:
    rgba(255,255,255,0.68);
}


.admission-hero h1 {
  margin-bottom: 28px;

  font-size:
    clamp(
      3.3rem,
      7vw,
      6.4rem
    );

  line-height: 0.98;

  color: white;
}


.admission-hero p {
  max-width: 660px;

  margin-bottom: 35px;

  font-size: 1.08rem;

  line-height: 1.8;

  color:
    rgba(255,255,255,0.72);
}


.admission-hero-actions {
  display: flex;

  flex-wrap: wrap;

  gap: 12px;
}


.admission-primary-button,
.admission-secondary-button,
.admission-white-button {
  min-height: 52px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  padding: 0 24px;

  border-radius: 100px;

  font-weight: 700;

  transition:
    transform 0.25s ease,
    background 0.25s ease;
}


.admission-primary-button:hover,
.admission-secondary-button:hover,
.admission-white-button:hover {
  transform: translateY(-3px);
}


.admission-primary-button {
  background: white;

  color:
    var(--primary-dark);
}


.admission-secondary-button {
  border:
    1px solid
    rgba(255,255,255,0.35);

  color: white;
}


.admission-hero-decoration {
  position: relative;

  min-height: 330px;

  display: flex;

  flex-direction: column;

  align-items: center;
  justify-content: center;

  border:
    1px solid
    rgba(255,255,255,0.14);

  border-radius: 35px;

  background:
    rgba(255,255,255,0.06);

  backdrop-filter: blur(10px);
}


.admission-big-year {
  font-size:
    clamp(
      4rem,
      10vw,
      7rem
    );

  font-weight: 800;

  line-height: 1;

  color: white;
}


.admission-hero-decoration span {
  margin-top: 15px;

  font-size: 0.85rem;

  font-weight: 800;

  letter-spacing: 0.25em;

  text-transform: uppercase;

  color:
    rgba(255,255,255,0.55);
}


/* =========================================
   INTRODUCCIÓN
========================================= */

.admission-intro {
  padding:
    120px 0
    95px;

  text-align: center;
}


.admission-intro-container {
  max-width: 850px;
}


.admission-eyebrow {
  display: block;

  margin-bottom: 12px;

  color: var(--primary);

  font-size: 0.76rem;

  font-weight: 800;

  letter-spacing: 0.15em;

  text-transform: uppercase;
}


.admission-intro h2,
.admission-section-title h2 {
  margin-bottom: 20px;

  color:
    var(--primary-dark);

  font-size:
    clamp(
      2.5rem,
      5vw,
      4.3rem
    );

  line-height: 1.08;
}


.admission-intro p {
  margin: 0;

  color:
    var(--text-light);

  font-size: 1.04rem;

  line-height: 1.9;
}


/* =========================================
   TÍTULOS SECCIÓN
========================================= */

.admission-section-title {
  max-width: 760px;

  margin-bottom: 60px;
}


.admission-section-title p {
  color:
    var(--text-light);

  line-height: 1.8;
}


/* =========================================
   PROCESO
========================================= */

.admission-process {
  padding:
    100px 0
    130px;

  background:
    var(--background);
}


.admission-timeline {
  position: relative;

  display: grid;

  grid-template-columns:
    repeat(4, 1fr);

  gap: 18px;
}


.admission-timeline::before {
  content: "";

  position: absolute;

  top: 52px;

  left: 8%;
  right: 8%;

  height: 2px;

  background:
    var(--border);
}


.admission-step {
  position: relative;

  z-index: 2;

  padding:
    0 0
    30px;
}


.admission-step-number {
  width: 105px;
  height: 105px;

  display: flex;

  align-items: center;
  justify-content: center;

  margin-bottom: 30px;

  border-radius: 50%;

  border:
    1px solid
    var(--border);

  background: white;

  color:
    var(--primary);

  font-size: 1.7rem;

  font-weight: 800;

  box-shadow:
    0 8px 35px
    rgba(12,38,65,0.07);
}


.admission-step-card {
  min-height: 320px;

  padding: 30px;

  border:
    1px solid
    var(--border);

  border-radius: 25px;

  background: white;

  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}


.admission-step-card:hover {
  transform:
    translateY(-6px);

  box-shadow:
    var(--shadow);
}


.admission-step-card span {
  display: block;

  margin-bottom: 10px;

  color:
    var(--primary);

  font-size:
    0.72rem;

  font-weight:
    800;

  letter-spacing:
    0.12em;

  text-transform:
    uppercase;
}


.admission-step-card h3 {
  margin-bottom: 17px;

  color:
    var(--primary-dark);

  font-family:
    "Playfair Display",
    serif;

  font-size:
    1.7rem;
}


.admission-step-card p {
  margin: 0;

  color:
    var(--text-light);

  font-size:
    0.9rem;

  line-height:
    1.8;
}


/* =========================================
   CONTACTO
========================================= */

.admission-contact {
  padding:
    100px 0;

  background:
    var(--primary-dark);

  color: white;
}


.admission-contact-container {
  display: grid;

  grid-template-columns:
    1.3fr 0.7fr;

  gap: 70px;

  align-items: center;
}


.admission-contact-label {
  display: block;

  margin-bottom: 12px;

  font-size: 0.76rem;

  font-weight: 800;

  letter-spacing: 0.14em;

  text-transform: uppercase;

  color:
    rgba(255,255,255,0.6);
}


.admission-contact h2 {
  max-width: 700px;

  margin-bottom: 18px;

  color: white;

  font-size:
    clamp(
      2.4rem,
      5vw,
      4.2rem
    );
}


.admission-contact p {
  max-width: 700px;

  color:
    rgba(255,255,255,0.68);

  line-height: 1.8;
}


.admission-contact-details {
  display: flex;

  flex-wrap: wrap;

  gap: 12px 25px;

  margin-top: 25px;

  color:
    rgba(255,255,255,0.73);

  font-size: 0.9rem;
}


.admission-contact-details a {
  color: white;
}


.admission-contact-action {
  display: flex;

  justify-content: flex-end;
}


.admission-white-button {
  background: white;

  color:
    var(--primary-dark);
}


/* =========================================
   DOCUMENTOS
========================================= */

.admission-documents {
  padding:
    125px 0;

  background: white;
}


.documents-grid {
  display: grid;

  grid-template-columns:
    repeat(2, 1fr);

  gap: 20px;
}


.document-card {
  display: grid;

  grid-template-columns:
    76px 1fr;

  gap: 24px;

  align-items: start;

  padding: 30px;

  border:
    1px solid
    var(--border);

  border-radius: 25px;

  background: white;

  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}


.document-card:hover {
  transform:
    translateY(-5px);

  box-shadow:
    var(--shadow);
}


.document-icon {
  width: 70px;
  height: 82px;

  display: flex;

  align-items: center;
  justify-content: center;

  position: relative;

  border-radius:
    10px 10px 15px 10px;

  background:
    var(--primary);

  color: white;

  font-size: 0.75rem;

  font-weight: 800;
}


.document-icon::after {
  content: "";

  position: absolute;

  top: 0;
  right: 0;

  width: 18px;
  height: 18px;

  background:
    rgba(255,255,255,0.22);

  border-radius:
    0 0 0 7px;
}


.document-info h3 {
  margin-bottom: 8px;

  color:
    var(--primary-dark);

  font-size: 1.08rem;
}


.document-info p {
  margin-bottom: 20px;

  color:
    var(--text-light);

  font-size: 0.86rem;

  line-height: 1.65;
}


.document-actions {
  display: flex;

  flex-wrap: wrap;

  gap: 9px;
}


.document-view,
.document-download {
  min-height: 41px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  padding:
    0 16px;

  border-radius: 100px;

  font-size: 0.78rem;

  font-weight: 700;

  transition:
    transform 0.2s ease,
    background 0.2s ease;
}


.document-view:hover,
.document-download:hover {
  transform:
    translateY(-2px);
}


.document-view {
  border: none;

  background:
    var(--primary);

  color: white;
}


.document-download {
  border:
    1px solid
    var(--border);

  background: white;

  color:
    var(--primary);
}


/* =========================================
   MODAL PDF
========================================= */

.pdf-modal {
  position: fixed;

  inset: 0;

  z-index: 5000;

  display: none;

  align-items: center;
  justify-content: center;

  padding: 24px;
}


.pdf-modal.open {
  display: flex;
}


.pdf-modal-background {
  position: absolute;

  inset: 0;

  background:
    rgba(3,18,31,0.86);

  backdrop-filter:
    blur(7px);
}


.pdf-modal-window {
  position: relative;

  z-index: 2;

  width:
    min(
      1200px,
      100%
    );

  height:
    min(
      850px,
      90vh
    );

  display: flex;

  flex-direction: column;

  overflow: hidden;

  border-radius: 25px;

  background: white;

  box-shadow:
    0 30px 100px
    rgba(0,0,0,0.4);
}


.pdf-modal-header {
  min-height: 80px;

  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 20px;

  padding:
    15px 22px;

  border-bottom:
    1px solid
    var(--border);
}


.pdf-modal-header span {
  display: block;

  margin-bottom: 2px;

  color:
    var(--text-light);

  font-size: 0.68rem;

  font-weight: 800;

  letter-spacing:
    0.08em;

  text-transform:
    uppercase;
}


.pdf-modal-header h3 {
  margin: 0;

  color:
    var(--primary-dark);

  font-size: 1rem;
}


.pdf-modal-actions {
  display: flex;

  align-items: center;

  gap: 15px;
}


.pdf-modal-actions a {
  color:
    var(--primary);

  font-size:
    0.82rem;

  font-weight:
    700;
}


.pdf-modal-actions button {
  width: 42px;
  height: 42px;

  border: none;

  border-radius: 50%;

  background:
    var(--background);

  color:
    var(--primary-dark);

  font-size:
    1.5rem;
}


.pdf-modal-body {
  flex: 1;

  background:
    #e8edf2;
}


.pdf-modal-body iframe {
  width: 100%;
  height: 100%;

  border: none;
}


/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 1000px) {

  .admission-hero-container {
    grid-template-columns:
      1fr;
  }


  .admission-hero-decoration {
    display: none;
  }


  .admission-timeline {
    grid-template-columns:
      repeat(2,1fr);
  }


  .admission-timeline::before {
    display: none;
  }

}


@media (max-width: 800px) {

  .admission-contact-container {
    grid-template-columns:
      1fr;

    gap: 35px;
  }


  .admission-contact-action {
    justify-content:
      flex-start;
  }


  .documents-grid {
    grid-template-columns:
      1fr;
  }

}


@media (max-width: 600px) {

  .admission-hero {
    min-height: 690px;
  }


  .admission-timeline {
    grid-template-columns:
      1fr;
  }


  .admission-step {
    display: grid;

    grid-template-columns:
      70px 1fr;

    gap: 15px;
  }


  .admission-step-number {
    width: 60px;
    height: 60px;

    margin: 0;

    font-size: 1.1rem;
  }


  .admission-step-card {
    min-height: 0;

    padding: 24px;
  }


  .document-card {
    grid-template-columns:
      55px 1fr;

    gap: 17px;

    padding: 22px;
  }


  .document-icon {
    width: 52px;
    height: 62px;
  }


  .pdf-modal {
    padding: 0;
  }


  .pdf-modal-window {
    width: 100%;
    height: 100vh;

    border-radius: 0;
  }


  .pdf-modal-actions a {
    display: none;
  }

}