:root { --ll-popin-z: 2147483000; }

html.ll-popin-open, body.ll-popin-open { overflow: hidden !important; }

.ll-popin-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--ll-popin-z);
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: clamp(18px, 4vw, 52px) clamp(12px, 3vw, 36px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: rgba(0,0,0,.58);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--ll-popin-animation-duration,450ms) ease, visibility var(--ll-popin-animation-duration,450ms) ease;
}
.ll-popin-overlay.is-visible { opacity: 1; visibility: visible; }

.ll-popin {
  position: relative;
  flex: 0 0 auto;
  width: min(100%,760px);
  height: auto;
  overflow: visible;
  margin: auto 0;
  background: var(--ll-popin-bg,#fff);
  color: var(--ll-popin-fg,#111);
  box-shadow: 0 28px 90px rgba(0,0,0,.28);
  opacity: 0;
  transform: translateY(18px) scale(.985);
  filter: none;
  transition: transform var(--ll-popin-animation-duration,450ms) cubic-bezier(.22,1,.36,1), opacity var(--ll-popin-animation-duration,450ms) ease, filter var(--ll-popin-animation-duration,450ms) ease;
}

.ll-popin p {
  color: rgba(0,0,0,0.8);
}

.ll-popin-overlay.is-visible .ll-popin { opacity:1; transform:none; filter:none; }

.ll-popin--small { width:min(100%,420px); }
.ll-popin--medium { width:min(100%,640px); }
.ll-popin--large { width:min(100%,920px); }
.ll-popin--full-screen { width:min(100%,1440px); min-height:calc(100vh - clamp(36px,8vw,104px)); }

.ll-popin__close {
  position:absolute; top:12px; right:12px; z-index:10;
  width:38px; height:38px; border:1px solid rgba(255,255,255,.28); border-radius:999px;
  background:rgba(20,20,20,.66); color:#fff; font-size:23px; line-height:1; cursor:pointer;
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}

/* .popin-logo {
    max-height: 70px;
    position: absolute;
    left: 30px;
    top: 80px;
} */
.ll-popin__logo { position:relative; display:inline-block; text-align:center; width: 100%; }
.ll-popin__logo img {
      max-height: 70px;
}

.ll-popin__body { position:relative; z-index:1; padding:clamp(24px,4vw,44px); }
.ll-popin__intro { padding-right:42px; }
.ll-popin__title { margin:0 0 10px; font-size:clamp(1.5rem,3vw,2.4rem); line-height:1.08; }
.ll-popin__subtitle { margin:0 0 20px; opacity:.76; font-size:clamp(1rem,2vw,1.2rem); }
.ll-popin__content { line-height:1.6; margin-top:clamp(18px,3vw,28px); border:1px dashed rgba(0,0,0,0.25); padding: 25px; }

.ll-popin__header-media, .ll-popin__carousel {
  position:relative; width:100%; margin:clamp(14px,2.5vw,24px) 0 0; overflow:hidden; background:rgba(0,0,0,.04);
  aspect-ratio:16/7; max-height:min(38vh,380px);
}
.ll-popin[data-media-ratio="standard"] .ll-popin__header-media,
.ll-popin[data-media-ratio="standard"] .ll-popin__carousel { aspect-ratio:4/3; max-height:min(46vh,480px); }
.ll-popin[data-media-ratio="portrait"] .ll-popin__header-media,
.ll-popin[data-media-ratio="portrait"] .ll-popin__carousel { aspect-ratio:4/5; max-height:min(58vh,620px); }
.ll-popin[data-media-ratio="natural"] .ll-popin__header-media,
.ll-popin[data-media-ratio="natural"] .ll-popin__carousel { aspect-ratio:auto; max-height:none; }
.ll-popin__header-media img, .ll-popin__carousel img { display:block; width:100%; height:100%; object-fit:cover; object-position:var(--ll-popin-media-position,center); }
.ll-popin[data-media-ratio="natural"] .ll-popin__header-media img,
.ll-popin[data-media-ratio="natural"] .ll-popin__carousel img { height:auto; object-fit:contain; }

.ll-popin__carousel-track { display:flex; height:100%; transition:transform .45s cubic-bezier(.22,1,.36,1); }
.ll-popin__carousel-slide { min-width:100%; height:100%; }
.ll-popin__carousel-slide > a { display:block; height:100%; }
.ll-popin__carousel-nav { position:absolute; inset:50% 10px auto; transform:translateY(-50%); display:flex; justify-content:space-between; pointer-events:none; }
.ll-popin__carousel-nav button {
  pointer-events:auto; border:1px solid rgba(255,255,255,.35); width:42px; height:42px; border-radius:999px;
  /* background:rgba(15,15,15,.56);  */
  background: rgba(15, 15, 15, .26);
  color:#fff; cursor:pointer; font-size:27px; line-height:1;
  backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px);
}
.ll-popin__carousel-nav button:hover {
  background:rgba(15,15,15,.56);
}

.ll-popin__actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:24px; }
.ll-popin__button { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:11px 20px; border:1px solid transparent; background:var(--ll-popin-accent,#0b7d7d); color:var(--ll-popin-accent-contrast,#fff); text-decoration:none; font:inherit; font-weight:700; cursor:pointer; }
.ll-popin__dismiss-link { border:0; background:transparent; color:inherit; text-decoration:underline; cursor:pointer; padding:10px 0; }
.ll-popin__form { display:grid; gap:14px; margin-top:22px; }
.ll-popin__field { display:grid; gap:6px; }
.ll-popin__field input,.ll-popin__field select,.ll-popin__field textarea { width:100%; min-height:44px; padding:10px 12px; border:1px solid rgba(0,0,0,.2); background:rgba(255,255,255,.92); color:#111; font:inherit; box-sizing:border-box; }
.ll-popin--background-media { background-size:cover; background-position:center; }
.ll-popin--background-media::before { content:""; position:absolute; inset:0; background:var(--ll-popin-bg,rgba(255,255,255,.88)); pointer-events:none; }
.ll-popin__status { margin-top:12px; font-size:.95rem; }

/* Entrance animations */
.ll-popin-anim-in--fade .ll-popin { transform:none; }
.ll-popin-anim-in--slide-left .ll-popin { transform:translateX(-72px); }
.ll-popin-anim-in--slide-right .ll-popin { transform:translateX(72px); }
.ll-popin-anim-in--slide-up .ll-popin { transform:translateY(72px); }
.ll-popin-anim-in--scale .ll-popin { transform:scale(.94); }
.ll-popin-anim-in--reveal .ll-popin { transform:translateY(34px) scale(.992); }
.ll-popin-anim-in--soft-focus .ll-popin { transform:scale(.975); filter:blur(7px); }
.ll-popin-anim-in--none, .ll-popin-anim-in--none .ll-popin { transition:none !important; }

/* Exit animations */
.ll-popin-overlay.is-closing { opacity:0; }
.ll-popin-overlay.is-closing.ll-popin-anim-out--default .ll-popin { opacity:0; transform:translateY(18px) scale(.985); }
.ll-popin-overlay.is-closing.ll-popin-anim-out--fade .ll-popin { opacity:0; transform:none; }
.ll-popin-overlay.is-closing.ll-popin-anim-out--slide-left .ll-popin { opacity:0; transform:translateX(-72px); }
.ll-popin-overlay.is-closing.ll-popin-anim-out--slide-right .ll-popin { opacity:0; transform:translateX(72px); }
.ll-popin-overlay.is-closing.ll-popin-anim-out--slide-up .ll-popin { opacity:0; transform:translateY(-54px); }
.ll-popin-overlay.is-closing.ll-popin-anim-out--scale .ll-popin { opacity:0; transform:scale(.96); }
.ll-popin-overlay.is-closing.ll-popin-anim-out--reveal .ll-popin { opacity:0; transform:translateY(-24px) scale(.995); }
.ll-popin-overlay.is-closing.ll-popin-anim-out--soft-focus .ll-popin { opacity:0; transform:scale(.985); filter:blur(7px); }
.ll-popin-overlay.is-closing.ll-popin-anim-out--none, .ll-popin-overlay.is-closing.ll-popin-anim-out--none .ll-popin { transition:none !important; }

@media (max-width:640px) {
  .ll-popin-overlay { padding:10px; }
  .ll-popin { margin:auto 0; }
  .ll-popin__body { padding:22px 18px; }
  .ll-popin__header-media,.ll-popin__carousel { aspect-ratio:16/9; max-height:34vh; }
  .ll-popin__actions { flex-direction:column; }
  .ll-popin__button { width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  .ll-popin-overlay,.ll-popin,.ll-popin__carousel-track { transition:none !important; animation:none !important; }
}



/* ==========================================================
   POP-IN EYEBROW / PROMOTIONAL STRIP

   Uses the pop-in's existing --accent variable.
   Intended position:
       modal title
       eyebrow
       body_html
   ========================================================== */

.ll-popin__eyebrow {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 30px;

    margin: 25px 0 28px;
    padding: 10px 108px 10px 38px;

    min-height: 88px;

    background: var(--ll-popin-accent);
    color: var(--ll-popin-primary);
    
    border:1px solid rgba(0,0,0,0.3);
}


/* Main promotional message
   ---------------------------------- */

.ll-popin__eyebrow-text {
    font-size: clamp(18px, 1.65vw, 28px);
    line-height: 1.25;
    font-weight: 400;
    letter-spacing: .01em;
}


/* CTA
   ---------------------------------- */

.ll-popin__eyebrow-button {
    appearance: none;
    border: 0;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;

    min-height: 52px;
    padding: 14px 26px;

    background: var(--ll-popin-primary);
    color: var(--ll-popin-secondary);

    font: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: .02em;

    cursor: pointer;

    transition:
        transform .25s ease,
        opacity .25s ease;
}

.ll-popin__eyebrow-button:hover {
    transform: translateY(-2px);
    border: 1px solid var(--ll-popin-primary);
    background: var(--ll-popin-secondary);
    color: var(--ll-popin-primary);
}

.ll-popin__eyebrow-arrow {
    font-size: 20px;
    line-height: 1;
}


/* Vertical right-side flag
   ---------------------------------- */

.ll-popin__eyebrow-flag {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;

    width: 58px;

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

    background: var(--ll-popin-primary);
    color: var(--ll-popin-secondary);

    overflow: hidden;
}

.ll-popin__eyebrow-flag span {
    white-space: nowrap;

    font-size: 13px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;

    writing-mode: vertical-rl;
    text-orientation: mixed;
}


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

@media (max-width: 768px) {

    .ll-popin__eyebrow {
        grid-template-columns: 1fr;
        gap: 18px;

        padding:
            24px
            76px
            24px
            24px;
    }

    .ll-popin__eyebrow-button {
        justify-self: start;
    }

    .ll-popin__eyebrow-flag {
        width: 48px;
    }

}


@media (max-width: 480px) {

    .ll-popin__eyebrow {
        margin-bottom: 22px;
        padding:
            20px
            64px
            20px
            20px;
    }

    .ll-popin__eyebrow-text {
        font-size: 18px;
    }

    .ll-popin__eyebrow-button {
        width: 100%;
        padding-left: 16px;
        padding-right: 16px;
        font-size: 12px;
    }

    .ll-popin__eyebrow-flag {
        width: 42px;
    }

}
/* =========================================================
   v1.3.3 FINAL — full-screen funnel over visible background
   ========================================================= */
.ll-popin--background-media{
  background-image:var(--ll-popin-background-image);
  background-size:var(--ll-popin-background-size,cover);
  background-position:var(--ll-popin-background-position,center center);
  background-repeat:no-repeat;
}
.ll-popin--background-media::before{
  background:var(--ll-popin-background-overlay,rgba(255,255,255,.32));
}

/* Full-screen keeps the photography visible. Content/form occupies a
   controlled translucent column instead of washing out the entire image. */
.ll-popin--full-screen.ll-popin--background-media::before{
  background:var(--ll-popin-background-overlay,rgba(0,0,0,.28));
}
.ll-popin--full-screen .ll-popin__body{
  min-height:inherit;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
}
.ll-popin--full-screen .ll-popin__intro{
  max-width:min(760px,58%);
  text-shadow:0 1px 16px rgba(255,255,255,.28);
}
.ll-popin--full-screen .ll-popin__funnel-shell{
  width:min(720px,52%);
  margin-top:clamp(18px,3vw,34px);
  padding:clamp(18px,2.5vw,30px);
  box-sizing:border-box;
  background:rgba(255,255,255,.30);
  border:1px solid rgba(255,255,255,.38);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.ll-popin--full-screen .ll-popin__form{margin-top:0}
.ll-popin--full-screen .ll-popin__field input,
.ll-popin--full-screen .ll-popin__field textarea,
.ll-popin--full-screen .ll-popin__field select{
  background:rgba(255,255,255,.88);
}

/* Validation */
.ll-popin__field-error{
  display:none;
  margin-top:2px;
  font-size:.78rem;
  line-height:1.3;
  color:#8b1e1e;
}
.ll-popin__field.has-error .ll-popin__field-error{display:block}
.ll-popin__field.has-error input,
.ll-popin__field.has-error textarea,
.ll-popin__field.has-error select{
  border-color:#8b1e1e;
  outline:2px solid rgba(139,30,30,.10);
}
.ll-popin__status:not(:empty){padding-top:4px}

@media(max-width:800px){
  .ll-popin--full-screen .ll-popin__intro,
  .ll-popin--full-screen .ll-popin__funnel-shell{max-width:none;width:100%}
  .ll-popin--full-screen .ll-popin__funnel-shell{
    /* margin-top:auto; */
    background:rgba(255,255,255,.74);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }
  .ll-popin__title {
    text-align: center !important;
  }
}


/* v1.3.3 bugfix: refined editorial title typography */
.ll-popin__title {
  font-family: "Bodoni 72", Didot, "Bodoni MT", "Times New Roman", Georgia, serif;
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: .98;
  text-wrap: balance;
}
.ll-popin--full-screen .ll-popin__title {
  font-size: clamp(2.6rem, 5vw, 5.75rem);
  /* max-width: 12ch; */
}



/* =========================================================
   FUNNEL SUCCESS
   ========================================================= */

.ll-popin__success {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-height: 220px;
    padding: 30px;

    text-align: center;

    animation: ll-popin-success-in .5s
        cubic-bezier(.22,1,.36,1) both;
}

.ll-popin__success-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 62px;
    height: 62px;

    margin-bottom: 20px;

    border: 2px solid currentColor;
    border-radius: 50%;

    font-size: 30px;
    font-weight: 400;
    line-height: 1;
}

.ll-popin__success-title {
    margin-bottom: 8px;

    font-family:
        "Bodoni 72",
        Didot,
        "Bodoni MT",
        "Times New Roman",
        Georgia,
        serif;

    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 400;
    line-height: 1;

    letter-spacing: -.025em;
}

.ll-popin__success-message {
    max-width: 420px;

    font-size: 1rem;
    line-height: 1.5;

    opacity: .75;
}

@keyframes ll-popin-success-in {

    from {
        opacity: 0;
        transform: translateY(10px) scale(.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }

}