/* DUNEUS · Newsletter popup
 * ------------------------------------------------------------------------ */

.dn-pop { position: fixed; inset: 0; z-index: 9990; }
.dn-pop[hidden] { display: none; }

.dn-pop__scrim {
  position: absolute;
  inset: 0;
  background: var(--pop-scrim, #000);
  opacity: 0;
  transition: opacity 0.28s ease;
}
.dn-pop.is-open .dn-pop__scrim { opacity: var(--pop-scrim-a, 0.55); }

.dn-pop__panel {
  position: absolute;
  display: flex;
  overflow: hidden;
  background: var(--pop-bg, #fff);
  border-radius: var(--pop-radius, 4px);
  color: var(--pop-fg, #111);
  /* Entry motion is set per layout below. */
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.32s cubic-bezier(.2, .7, .2, 1);
}
.dn-pop.is-open .dn-pop__panel { opacity: 1; }

/* ---- Centre modal ---- */
.dn-pop__panel {
  top: 50%;
  inset-inline-start: 50%;
  transform: translate(-50%, -46%);
  width: min(var(--pop-w, 880px), calc(100vw - 2rem));
  max-height: calc(100vh - 2rem);
}
[dir='rtl'] .dn-pop__panel { transform: translate(50%, -46%); }
.dn-pop.is-open .dn-pop__panel { transform: translate(-50%, -50%); }
[dir='rtl'] .dn-pop.is-open .dn-pop__panel { transform: translate(50%, -50%); }

/* ---- Bottom bar ---- */
.dn-pop[data-layout='bar'] .dn-pop__panel {
  top: auto;
  bottom: 0;
  inset-inline: 0;
  inset-inline-start: 0;
  width: 100%;
  max-width: none;
  border-radius: 0;
  transform: translateY(100%);
  max-height: 70vh;
}
[dir='rtl'] .dn-pop[data-layout='bar'] .dn-pop__panel { transform: translateY(100%); }
.dn-pop[data-layout='bar'].is-open .dn-pop__panel,
[dir='rtl'] .dn-pop[data-layout='bar'].is-open .dn-pop__panel { transform: translateY(0); }
.dn-pop[data-layout='bar'] .dn-pop__body { max-width: var(--d-max, 1440px); margin-inline: auto; width: 100%; }
.dn-pop[data-layout='bar'] .dn-pop__media { display: none; }

/* ---- Side panel ---- */
.dn-pop[data-layout='side'] .dn-pop__panel {
  top: 0;
  bottom: 0;
  inset-inline-end: 0;
  inset-inline-start: auto;
  width: min(440px, 100vw);
  max-height: none;
  border-radius: 0;
  flex-direction: column;
  transform: translateX(100%);
}
[dir='rtl'] .dn-pop[data-layout='side'] .dn-pop__panel { transform: translateX(-100%); }
.dn-pop[data-layout='side'].is-open .dn-pop__panel { transform: translateX(0); }
.dn-pop[data-layout='side'] .dn-pop__media { flex: 0 0 auto; height: 40%; }

/* ---- Close ---- */
.dn-pop__close {
  all: unset;
  box-sizing: border-box;
  cursor: pointer;
  position: absolute;
  top: 12px;
  inset-inline-end: 12px;
  z-index: 3;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: var(--pop-fg, #111);
  background: rgba(255, 255, 255, 0.85);
  transition: background-color 0.18s ease;
}
.dn-pop__close:hover { background: #fff; }
.dn-pop__close svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }

/* ---- Media ---- */
.dn-pop__media { flex: 0 0 45%; background: var(--duneus-bg-secondary, #F0F0F0); }
.dn-pop__media img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---- Body ---- */
.dn-pop__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.75rem;
  padding: clamp(1.5rem, 4vw, 2.75rem);
  overflow-y: auto;
}

.dn-pop__eyebrow {
  font-family: var(--duneus-font-en-heading, 'Montserrat'), sans-serif;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--pop-eyebrow, #FF5100);
}
[dir='rtl'] .dn-pop__eyebrow { letter-spacing: 0; text-transform: none; }

.dn-pop__title {
  margin: 0;
  font-family: var(--duneus-font-en-heading, 'Montserrat'), sans-serif;
  font-weight: 900;
  font-size: var(--pop-heading-m, 26px);
  line-height: 1.05;
  letter-spacing: -0.015em;
  text-transform: uppercase;
  color: var(--pop-fg, #111);
}
[dir='rtl'] .dn-pop__title { text-transform: none; letter-spacing: 0; }
@media (min-width: 768px) { .dn-pop__title { font-size: var(--pop-heading-d, 38px); } }

.dn-pop__text { margin: 0; color: var(--pop-muted, #6A6A6A); font-size: 0.9375rem; line-height: 1.7; }

/* ---- Form ---- */
.dn-pop__form { margin-block-start: 0.5rem; }
.dn-pop__fields { display: flex; flex-wrap: wrap; gap: 10px; }
.dn-pop__fields input[type='email'] {
  flex: 1 1 200px;
  min-width: 0;
  height: 52px;
  padding-inline: 1rem;
  background: transparent;
  border: 1px solid var(--pop-field-border, #DDD);
  border-radius: var(--pop-radius, 4px);
  color: var(--pop-fg, #111);
  font-family: inherit;
  font-size: 0.9375rem;
}
.dn-pop__fields input[type='email']:focus { outline: none; border-color: var(--pop-fg, #111); }

.dn-pop__submit {
  all: unset;
  box-sizing: border-box;
  cursor: pointer;
  flex: 0 0 auto;
  height: 52px;
  padding-inline: clamp(1.5rem, 4vw, 2.25rem);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--pop-btn-bg, #111);
  color: var(--pop-btn-fg, #fff);
  border-radius: var(--pop-radius, 4px);
  font-family: var(--duneus-font-en-heading, 'Montserrat'), sans-serif;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  transition: filter 0.18s ease, opacity 0.18s ease;
}
[dir='rtl'] .dn-pop__submit { letter-spacing: 0; text-transform: none; }
.dn-pop__submit:hover { filter: brightness(1.1); }
.dn-pop__submit.is-busy { opacity: 0.6; cursor: wait; }
@media (max-width: 520px) { .dn-pop__fields input[type='email'], .dn-pop__submit { flex: 1 1 100%; } }

.dn-pop__consent {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-block-start: 0.85rem;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--pop-muted, #6A6A6A);
  cursor: pointer;
}
.dn-pop__consent input { margin-top: 0.2em; flex: 0 0 auto; }

.dn-pop__error { margin: 0.75rem 0 0; font-size: 0.8125rem; color: #D33; }
.dn-pop__error[hidden] { display: none; }
.dn-pop__privacy { margin: 0.85rem 0 0; font-size: 0.75rem; line-height: 1.6; color: var(--pop-muted, #6A6A6A); }

.dn-pop__decline {
  all: unset;
  cursor: pointer;
  display: inline-block;
  margin-block-start: 0.85rem;
  font-size: 0.8125rem;
  color: var(--pop-muted, #6A6A6A);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---- Success ---- */
.dn-pop__success[hidden] { display: none; }
.dn-pop__success { display: flex; flex-direction: column; align-items: flex-start; gap: 0.85rem; }
.dn-pop__tick { display: inline-flex; color: var(--pop-eyebrow, #FF5100); }
.dn-pop__tick svg { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.dn-pop__successtext { margin: 0; font-size: 1rem; color: var(--pop-fg, #111); }

.dn-pop__coupon {
  display: flex;
  align-items: stretch;
  gap: 0;
  border: 1px dashed var(--pop-field-border, #DDD);
  border-radius: var(--pop-radius, 4px);
  overflow: hidden;
}
.dn-pop__coupon code {
  padding: 0.85rem 1.1rem;
  font-family: var(--duneus-font-en-heading, 'Montserrat'), sans-serif;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--pop-fg, #111);
}
.dn-pop__coupon button {
  all: unset;
  cursor: pointer;
  padding: 0.85rem 1.1rem;
  background: var(--pop-btn-bg, #111);
  color: var(--pop-btn-fg, #fff);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
[dir='rtl'] .dn-pop__coupon button { letter-spacing: 0; text-transform: none; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* On a phone the centre modal becomes a sheet — a boxed dialog on a small
   screen wastes the edges and reads as a banner ad. */
@media (max-width: 640px) {
  .dn-pop__panel {
    top: auto;
    bottom: 0;
    inset-inline-start: 0;
    transform: translateY(100%);
    width: 100%;
    max-width: none;
    border-radius: var(--pop-radius, 4px) var(--pop-radius, 4px) 0 0;
    max-height: 88vh;
    flex-direction: column;
  }
  [dir='rtl'] .dn-pop__panel { transform: translateY(100%); }
  .dn-pop.is-open .dn-pop__panel,
  [dir='rtl'] .dn-pop.is-open .dn-pop__panel { transform: translateY(0); }
  .dn-pop__media { flex: 0 0 auto; height: 30vh; }
}

@media (prefers-reduced-motion: reduce) {
  .dn-pop__scrim, .dn-pop__panel, .dn-pop__submit, .dn-pop__close { transition: none; }
}