/* Global resets and layout */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
  background:#dbeaeb;
  color:#111;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  padding:2rem 1rem;
}

.page{display:flex;justify-content:center}

.center{
  width:100%;
  max-width:640px;
  margin:0 auto;
}

.banner{
  width:100%;
  height:auto;
  display:block;
  border-radius:12px;
  background:#fff;
  /* padding:1rem; */
  box-shadow:0 2px 8px rgba(16,24,40,0.06);
}

.iframe-wrapper{
  position:relative;
  padding-top:46.25%; /* mantiene la relación proporcionada */
  min-height:500px;
  background:#fff;
  border-radius:17px;
  margin-top:2rem;
  overflow:hidden;
  box-shadow:0 6px 18px rgba(16,24,40,0.06);
}

.iframe-wrapper iframe{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  border:0;
  padding:2rem; /* espacio interno según solicitud */
  box-sizing:border-box;
}

/* Ajustes responsivos */
@media (max-width:420px){
  .iframe-wrapper iframe{padding:0.75rem 1rem}
  .banner{border-radius:10px}
  .iframe-wrapper{border-radius:12px}
}