/* bevan-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Bevan';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/bevan-v26-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* cambay-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cambay';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/cambay-v14-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


  * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }

body {
  min-height: 100vh;
  font-family: 'Cambay', sans-serif;
  background-color: #87CEFA;
  background-image: url("images/background.jpg");
  background-size: cover;
  background-attachment: fixed;
  color: #e2e8f0;
  line-height: 1.6; 
}

.page {
  max-width: 1200px;
  margin: 0 auto;
  padding: 2.8rem 1.25rem 3.5rem;
  background: radial-gradient(circle at top, rgba(15, 23, 42, 0.75), rgba(15, 23, 42, 0.98));
}

  /* ---Typography--- */
      h1 {
        font-family: 'Bevan', serif;
        font-size: 2.25rem;
        margin-bottom: 1rem;
        letter-spacing: 0.03em;
      }

      h2 {
        font-size: 1.25rem;
        font-weight: 600;
        margin-bottom: 0.35rem;
      }

      p {
        font-size: 1rem;
        color: #94a3b8;
      }

  /* --Intro / heading-- */

      .intro {
        background: rgba(2, 6, 23, 0.2);
        border: 1px solid rgba(148, 163, 184, 0.25);
        border-radius: 1.1rem;
        padding: 1.5rem 1.25rem 1.2rem;
        margin-bottom: 2.5rem;
        backdrop-filter: blur(4px);
      }

      .intro p {
        max-width: 760px;
      }

  /* ---Grid gallery--- */

      .movie-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
        gap: 1.5rem;

      }

      .movie-card {
        background: rgba(15, 23, 42, 0.5);
        border: 1px solid rgba(148, 163, 184, 0.2);
        border-radius: 1.1rem;
        overflow: hidden;
        backdrop-filter: blur(4px);
        box-shadow: 0 18px 35px rgba(0, 0, 0, 0.25);
      }


.poster-wrap {
  background: #020617;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 380px;           
  overflow: hidden;
}

.poster-wrap img {
  max-width: 300px;
  width: 100%;
  height: 100%;
  object-fit: cover;       
}


      .movie-body {
        padding: 1rem 1.05rem 1.1rem;
      }

      .movie-title {
        display: inline-block;
        margin-bottom: 0.45rem;
        color: #e2e8f0;
      }

      .movie-desc {
        font-size: 0.9rem;
      }

      