:root{
  color-scheme:light;
  --paper:#fffaf1;
  --white:#ffffff;
  --ink:#26303a;
  --muted:#69747f;
  --green:#00ad62;
  --orange:#f5a623;
  --line:#eadfca;
}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0}
body{
  background:
    radial-gradient(circle at 10% 10%,#e9f7f5 0 90px,transparent 91px),
    radial-gradient(circle at 92% 92%,#fff1c6 0 120px,transparent 121px),
    var(--paper);
  color:var(--ink);
  font-family:"Hiragino Maru Gothic ProN","Yu Gothic",sans-serif;
}
.page{
  min-height:100svh;
  display:grid;
  place-items:center;
  padding:24px 16px;
}
.movie-card{
  width:min(100%,560px);
  padding:28px 22px 24px;
  text-align:center;
  background:var(--white);
  border:2px solid #ffffff;
  border-radius:30px;
  box-shadow:0 12px 34px #5b47351c;
}
.eyebrow{
  margin:0 0 6px;
  color:var(--green);
  font-size:14px;
  font-weight:800;
  letter-spacing:.04em;
}
h1{
  margin:0;
  font-size:clamp(34px,9vw,52px);
  line-height:1.2;
  font-weight:800;
}
.lead{
  display:inline-block;
  margin:10px 0 18px;
  padding:5px 16px 6px;
  color:#fff;
  background:var(--orange);
  border-radius:999px;
  font-size:17px;
  font-weight:800;
}
.movie{
  display:block;
  width:min(100%,340px);
  height:auto;
  aspect-ratio:73/135;
  margin:0 auto;
  background:#fff;
  border:0;
  border-radius:20px;
  box-shadow:0 8px 20px #26303a20;
  object-fit:cover;
}
.help{
  margin:16px 0 0;
  color:var(--muted);
  font-size:15px;
  font-weight:700;
}
@media(max-width:520px){
  .page{padding:12px 10px}
  .movie-card{padding:20px 12px 18px;border-radius:24px}
  .eyebrow{font-size:12px}
  .lead{margin-bottom:14px}
  .movie{width:min(100%,330px);border-radius:16px}
}
