/* Embed Modal v1.0 — reusable component for iframe/script embeds
   Use this for bookings, ticketing, video embeds, scheduling widgets or external forms.
   Trigger: data-embed-modal-open="modal-key"
   Modal: data-embed-modal="modal-key"
*/
.embed-modal[hidden]{
  display:none !important;
}

.embed-modal{
  position:fixed;
  inset:0;
  z-index:99999;
  display:grid;
  place-items:center;
  padding:24px;
  isolation:isolate;
}

.embed-modal__overlay{
  position:absolute;
  inset:0;
  background:rgba(44,38,32,.48);
  backdrop-filter:blur(8px);
}

.embed-modal__dialog{
  position:relative;
  z-index:1;
  width:min(1080px, calc(100vw - 32px));
  max-height:min(90vh, 920px);
  overflow:auto;
  border:1px solid rgba(44,38,32,.10);
  border-radius:32px;
  background:#fff;
  box-shadow:0 38px 110px -50px rgba(44,38,32,.62);
}

.embed-modal__dialog:focus{
  outline:none;
}

.embed-modal__close{
  position:sticky;
  top:18px;
  float:right;
  z-index:3;
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  margin:18px 18px -62px auto;
  border:1px solid rgba(44,38,32,.10);
  border-radius:50%;
  background:rgba(255,255,255,.92);
  color:var(--ink);
  font-size:1.55rem;
  line-height:1;
  cursor:pointer;
  box-shadow:0 12px 28px -24px rgba(44,38,32,.46);
}

.embed-modal__header{
  padding:38px 38px 18px;
}

.embed-modal__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:0 0 16px;
  color:var(--terracotta);
  font-size:.74rem;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.embed-modal__eyebrow::before{
  content:"";
  width:28px;
  height:1px;
  background:currentColor;
}

.embed-modal__header h2{
  max-width:760px;
  margin:0 0 8px;
  color:var(--ink);
  font-family:var(--serif);
  font-size:clamp(2rem,3.7vw,3.45rem);
  line-height:1.04;
  letter-spacing:-.045em;
}

.embed-modal__header p{
  max-width:720px;
  margin:0;
  color:var(--ink-soft);
  line-height:1.65;
}

.embed-modal__embed{
  padding:0 38px 38px;
}

.embed-modal__iframe{
  display:block;
  width:100%;
  min-height:620px;
  border:1px solid rgba(44,38,32,.09);
  border-radius:22px;
  background:#fff;
}

.embed-modal--iframe-large .embed-modal__iframe{
  min-height:720px;
}

.embed-modal__fallback{
  margin:14px 0 0;
  color:var(--ink-soft);
  font-size:.94rem;
}

.embed-modal__fallback a{
  color:var(--terracotta);
  font-weight:800;
  text-decoration:none;
}


/* v0282 — popup surfaces are plain white and no-header embeds start below the close button. */
.embed-modal--no-header .embed-modal__embed{
  padding:72px 24px 24px;
  background:#fff;
}

.embed-modal--no-header .embed-modal__iframe{
  min-height:740px;
}

body.embed-modal-open{
  overflow:hidden;
}

@media(max-width:680px){
  .embed-modal{
    position:fixed !important;
    inset:0 !important;
    z-index:2147483400 !important;
    display:block;
    width:100vw;
    height:100dvh;
    min-height:100vh;
    padding:0 !important;
    background:#fff;
    overflow:hidden;
    overscroll-behavior:contain;
  }

  .embed-modal__overlay{
    display:none !important;
  }

  .embed-modal__dialog{
    position:fixed !important;
    inset:0 !important;
    z-index:2147483401;
    width:100vw !important;
    max-width:none !important;
    height:100dvh !important;
    min-height:100vh;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:#fff !important;
    box-shadow:none !important;
    overflow:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }

  .embed-modal__close{
    position:fixed !important;
    top:calc(env(safe-area-inset-top, 0px) + 12px) !important;
    right:14px !important;
    z-index:2147483402 !important;
    width:48px;
    height:48px;
    margin:0 !important;
    border:1px solid rgba(44,38,32,.12);
    border-radius:999px;
    background:#fff;
    color:var(--ink);
    font-size:1.65rem;
    line-height:1;
    box-shadow:0 14px 32px -22px rgba(44,38,32,.42);
  }

  .embed-modal__header{
    padding:calc(env(safe-area-inset-top, 0px) + 74px) 18px 14px;
    background:#fff;
  }

  .embed-modal__eyebrow{
    margin-bottom:12px;
  }

  .embed-modal__header h2{
    font-size:clamp(1.8rem,9vw,2.55rem);
  }

  .embed-modal__embed{
    padding:0 10px 16px !important;
    background:#fff;
  }

  .embed-modal__iframe,
  .embed-modal--iframe-large .embed-modal__iframe{
    width:100%;
    min-height:calc(100dvh - 220px) !important;
    border:0 !important;
    border-radius:0 !important;
    background:#fff;
  }


  .embed-modal--no-header .embed-modal__embed{
    padding:calc(env(safe-area-inset-top, 0px) + 70px) 0 0 !important;
    background:#fff;
  }

  .embed-modal--no-header .embed-modal__iframe,
  .embed-modal--no-header.embed-modal--iframe-large .embed-modal__iframe{
    min-height:calc(100dvh - 72px) !important;
    border:0 !important;
    border-radius:0 !important;
  }

  .embed-modal__fallback{
    padding:0 12px 18px;
    margin:0;
    background:#fff;
    text-align:center;
  }
}
