/* Super Stubborn — Newsletter
   GEGENEREERD uit de mockup (sectie `newsletter`) door port_to_wp.py.
   Gedeelde componenten en tokens staan in assets/css/superstubborn.css. */

.ssx-newsletter{ overflow-x:clip; }

/* ---- Editorial CTA band with darkened background photo ---- */
.ssx-newsletter__panel{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-radius:var(--ss-r-lg);
  background:var(--ss-brown-1);
  box-shadow:var(--ss-shadow-lg);
  padding:var(--ss-sp-8) var(--ss-sp-6);
}
@media (min-width:640px){
  .ssx-newsletter__panel{ padding:var(--ss-sp-9) var(--ss-sp-8); }
}
@media (min-width:960px){
  .ssx-newsletter__panel{ padding:var(--ss-sp-10) var(--ss-sp-9); }
}

/* Background photo layer (assigned landscape .ssimg-11), heavily darkened */
.ssx-newsletter__bg{
  position:absolute;
  inset:0;
  z-index:0;
}
.ssx-newsletter__photo{
  height:100%;
  border-radius:0;
}
.ssx-newsletter__scrim{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(92deg,
      rgba(17,16,15,0.94) 0%,
      rgba(17,16,15,0.86) 44%,
      rgba(17,16,15,0.58) 100%),
    linear-gradient(0deg,
      rgba(17,16,15,0.9) 0%,
      rgba(42,28,23,0.55) 55%,
      rgba(17,16,15,0.6) 100%);
}

/* ---- Content ---- */
.ssx-newsletter__inner{
  position:relative;
  z-index:2;
  max-width:640px;
}

.ssx-newsletter__title{
  margin-top:var(--ss-sp-5);
  margin-bottom:var(--ss-sp-5);
  color:var(--ss-white);
}
@media (min-width:960px){
  .ssx-newsletter__title{ margin-top:var(--ss-sp-6); }
}

.ssx-newsletter__copy{
  max-width:44ch;
}

/* ---- Form ---- */
.ssx-newsletter__form{
  margin-top:var(--ss-sp-8);
  max-width:34rem;
}
.ssx-newsletter__field{ margin:0; }
.ssx-newsletter__label{
  display:block;
  font-family:var(--ss-body);
  font-size:var(--ss-fs-label);
  text-transform:uppercase;
  letter-spacing:0.28em;
  font-weight:600;
  color:var(--ss-text-muted);
  margin-bottom:var(--ss-sp-3);
}
.ssx-newsletter__row{
  display:flex;
  flex-direction:column;
  gap:var(--ss-sp-4);
  align-items:stretch;
}
@media (min-width:560px){
  .ssx-newsletter__row{
    flex-direction:row;
    align-items:flex-end;
    gap:var(--ss-sp-5);
  }
}

.ssx-newsletter__input{
  flex:1 1 auto;
  min-width:0;
  background:transparent;
  border:0;
  border-bottom:1px solid var(--ss-hairline-accent);
  padding:var(--ss-sp-3) 0;
  font-family:var(--ss-body);
  font-size:var(--ss-fs-lead);
  letter-spacing:0.01em;
  color:var(--ss-beige);
  border-radius:0;
  transition:border-color var(--ss-dur-2) var(--ss-ease);
}
.ssx-newsletter__input::placeholder{ color:var(--ss-text-faint); }
.ssx-newsletter__input:focus{ outline:none; border-bottom-color:var(--ss-orange); }
.ssx-newsletter__input:focus-visible{
  outline:none;
  border-bottom-color:var(--ss-orange);
  box-shadow:0 1px 0 0 var(--ss-orange);
}
.ssx-newsletter__input[readonly]{ color:var(--ss-text-muted); }

.ssx-newsletter__submit{
  flex:0 0 auto;
  white-space:nowrap;
}
@media (max-width:559px){
  .ssx-newsletter__submit{ width:100%; }
}

.ssx-newsletter__note{
  margin-top:var(--ss-sp-4);
  font-size:var(--ss-fs-small);
  letter-spacing:0.04em;
}
.ssx-newsletter__success{
  margin-top:var(--ss-sp-4);
  font-size:var(--ss-fs-lead);
  color:var(--ss-text);
}
.ssx-newsletter__success-strong{
  color:var(--ss-orange);
  font-weight:700;
  letter-spacing:0.01em;
}

.ssx-newsletter__form.is-done .ssx-newsletter__input{
  border-bottom-color:var(--ss-hairline);
}

@media (prefers-reduced-motion: reduce){
  .ssx-newsletter__input{ transition:none; }
}