/* === Ark Newsletter Popup – final adjustments (unified white) === */

/* ─────────────────────────  POPUP LOOK  ────────────────────────── */

/* 1 ▸ dark translucent backdrop */
.pum-overlay{
  background:rgba(11,21,60,.60)!important;  /* 60 % opacity navy */
  opacity:1!important;
}

/* 2 ▸ OUTER container (now the only white box)  */
#popmake-962.pum-container{
  background:#ffffff!important;          /* 💡 single white */
  box-shadow:0 4px 24px rgba(0,0,0,.05)!important;
  border-radius:8px!important;
  padding:0!important;

  /* centred “window” constraints */
  max-width:480px!important;
  width:90vw!important;
  max-height:90vh!important;
  margin:auto!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  border:none!important;
  outline:none!important;
}

/* 3 ▸ inner wrapper – now ONLY handles spacing   */
#popmake-962 .ark-subscribe-modal{
  background:transparent!important;      /* no extra layer */
  box-shadow:none!important;
  border-radius:8px!important;           /* follow corners */
  padding:48px 40px!important;           /* keep spacing   */
  text-align:center;
}

/* (mobile spacing tweak) */
@media(max-width:480px){
  #popmake-962 .ark-subscribe-modal{padding:32px 24px!important;}
}

/* 4 ▸ form elements (unchanged) */
.ark-form{display:flex!important;flex-direction:column!important;align-items:center!important;gap:24px!important;}
.ark-form input[type=email]{width:100%!important;max-width:360px!important;padding:12px 24px!important;border:1px solid #3EB5F9!important;border-radius:27px!important;background:rgba(255,255,255,.40)!important;font-size:16px!important;}
.ark-terms{display:flex!important;align-items:center!important;justify-content:center!important;gap:.5rem!important;color:#595959!important;font-size:16px!important;}
.ark-terms input[type=checkbox]{margin-top:0!important;}
.ark-btn{min-width:200px!important;padding:12px 32px!important;border-radius:18px!important;background:#3EB5F9!important;color:#fff!important;font-size:16px!important;font-weight:700!important;cursor:pointer!important;transition:background .2s!important;margin:0 auto!important;}
.ark-btn:hover:not([disabled]){background:#1091e2!important;}
.ark-btn[disabled]{opacity:.4!important;cursor:not-allowed!important;}

/* 5 ▸ neat underlined Close link */
.ark-close-link{margin-top:12px;}
.ark-close-link a{font-size:14px;color:#0B153C;text-decoration:underline;}
.ark-close-link a:hover{opacity:.8;}


/* ───────────────────────  NO-JUMP BODY LOCK  ───────────────────── */

html{scrollbar-gutter:stable;}           /* keep gutter always */

body.popup-locked{                      /* (added by JS)      */
  position:fixed;
  inset:0;
  width:100%;
  overflow-y:scroll;                    /* show gutter        */
  padding-right:0!important;
  margin-right:0!important;
}


/* ===============================================================
   Ark Popup #962 – compact vertical rhythm & responsive padding
   (append after the existing stylesheet)
   ===============================================================*/

/* 1 ▸ kill default WP margins on headings / paragraphs inside   */
#popmake-962 h2,
#popmake-962 p{                 /* headline + helper text lines  */
  margin:0 0 16px;              /* was the browser default 24-32 */
}
#popmake-962 p:last-child{margin-bottom:0;}

/* 2 ▸ tighter gap between form rows                            */
#popmake-962 .ark-form{gap:18px!important;}  /* was 24 */

/* 3 ▸ calm checkbox line                                       */
#popmake-962 .ark-terms{gap:6px!important;}  /* was 8-9px */

/* 4 ▸ responsive card padding
------------------------------------------------------------------
   – tall view-ports (≥ 720 px): keep generous spacing
   – medium heights (600-719):   trim a little
   – short heights (< 600):      minimal padding & row gap        */
@media (min-height:720px){            /* desktop, laptop          */
  #popmake-962.pum-container{padding:48px 40px!important;}
}

@media (min-height:600px) and (max-height:719px){
  #popmake-962.pum-container{padding:36px 30px!important;}
  #popmake-962 .ark-form{gap:16px!important;}
}

@media (max-height:599px){            /* very short laptop / mobile */
  #popmake-962.pum-container{padding:28px 22px!important;}
  #popmake-962 .ark-form{gap:12px!important;}
  /* shrink button + input heights a touch */
  #popmake-962 .ark-btn{padding:10px 24px!important;}
  #popmake-962 input[type=email]{padding:10px 20px!important;}
}

/* 5 ▸ keep card-white on outer wrapper only (safety)            */
#popmake-962 .ark-subscribe-modal{background:transparent!important;}


/* ===========================================================
   Ark Popup #962 – ultra-compact vertical spacing
   (append after everything else)
   ===========================================================*/

/* 1 ▸ outer card padding – keep side padding, slice the top/bottom */
#popmake-962.pum-container{
  padding-top:24px!important;   /* was 48 / 36 / 28 */
  padding-bottom:24px!important;
}

/* 2 ▸ headline margins */
#popmake-962 h2{margin:0 0 12px!important;}   /* was 16 */

/* 3 ▸ shrink the gap between elements further */
#popmake-962 .ark-form{gap:14px!important;}   /* was 18-12 adaptive */

/* 4 ▸ checkbox line sits snugly under the input */
#popmake-962 .ark-terms{
  margin-top:-2px!important;    /* pull upward a hair */
  gap:4px!important;            /* slightly tighter   */
}

/* 5 ▸ shave the button height a touch */
#popmake-962 .ark-btn{
  padding:10px 28px!important;  /* was 12 × 32 */
}

/* 6 ▸ keep the Close link tight to the button */
#popmake-962 .ark-close-link{margin-top:8px!important;}

/* 7 ▸ still apply the adaptive padding on phones */
@media(max-height:599px){
  #popmake-962.pum-container{
    padding-top:20px!important;
    padding-bottom:20px!important;
  }
  #popmake-962 .ark-form{gap:10px!important;}
}

/* ────────────────────────────────────────────────
   Ark Popup #962 – relocate the × close icon
   ────────────────────────────────────────────────*/

#popmake-962 button.pum-close{
  display:block!important;      /* make sure it exists            */
  position:absolute!important;  /* take it out of normal flow     */
  top:8px!important;            /* distance from card edge        */
  right:8px!important;
  width:28px!important;
  height:28px!important;
  line-height:28px!important;
  border-radius:50%!important;
  background:transparent!important;
  color:#7a7a7a!important;      /* grey icon                      */
  font-size:20px!important;
  font-weight:700!important;
  text-align:center!important;
  cursor:pointer!important;
  box-shadow:none!important;    /* remove plugin default shadow   */
  border:none!important;
}

#popmake-962 button.pum-close:hover{
  background:rgba(0,0,0,.06)!important;   /* soft hover circle       */
  color:#000!important;
}
