/* === Coming Soon layout + Flodesk slot === */
.coming-wrap{
  min-height:100vh; display:grid; place-items:center;
  background:#1E3D59; padding:2rem;
}
.coming-card{
  width:min(820px,92vw);
  background:#101010; color:#EDEAE0;
  border:1px solid rgba(237,234,224,.16);
  border-radius:16px;
  box-shadow:0 10px 35px rgba(0,0,0,.45);
  text-align:center; padding:clamp(24px,4vw,48px);
}
.coming-logo img{ height:150px; width:auto; margin-bottom:1rem; }

.coming-card h1{
  font-family:'GT Super Display Super', serif; font-weight:700;
  font-size:clamp(1.8rem,4.8vw,2.6rem);
  color:#B08D57; margin:0 0 .5rem;
}
.coming-subhead {
  font-family: playfair-display, serif;
  font-weight: regular;
  font-size: clamp(1.1rem, 2.5vw, 1.4rem);
  color: #EDEAE0;
  margin: 0.5rem auto 1rem;
  max-width: 60ch;
  line-height: 1.4;
}


.coming-lede{
  font-family:playfair-display,serif; margin:0 auto 1.25rem; max-width:58ch; color:#EDEAE0;
}

/* Flodesk slot (keeps spacing even before you paste the embed) */
.signup-slot{
  margin: 0.75rem auto 0;
  max-width: 560px;
}

/* Optional: style Flodesk’s injected elements to match your brand */
#signup .fd-form .fd-button{
  background:#B08D57; color:#101010; border:1px solid #101010; border-radius:5px;
  padding:1rem 1.05rem; font-family:'GT Super Display Super', serif; font-weight:bold;
  box-shadow:2px 2px 0 #101010; transition:transform .2s ease, box-shadow .2s ease; cursor:pointer;
}
#signup .fd-form .fd-button:hover{ transform:translateY(-2px); box-shadow:4px 4px 0 #101010; }
#signup .fd-form input, #signup .fd-form select, #signup .fd-form textarea{
  border-radius:8px; background:#0f1011; color:#EDEAE0; border:1px solid rgba(237,234,224,.18);
}
#signup .fd-form input::placeholder{ color:#9a9a94; }

.coming-footer{ margin-top:1rem; color:#C9C4B8; font-size:.95rem; }

@media (max-width:480px){
  .coming-card h1{ font-size:clamp(1.7rem,7vw,2.1rem); }
}
/* --- Responsive polish --- */

/* Use dynamic viewport height to avoid mobile URL-bar jump */
.coming-wrap{
  min-height: 100svh;                 /* better than 100vh on mobile */
  display:grid; place-items:center;
  background:#1E3D59;
  padding: 2rem;
  padding-left: max(2rem, env(safe-area-inset-left));
  padding-right:max(2rem, env(safe-area-inset-right));
  padding-top:  max(2rem, env(safe-area-inset-top));
  padding-bottom:max(2rem, env(safe-area-inset-bottom));
}

/* Card scales nicely on all screens */
.coming-card{
  width:min(820px, 92vw);
  background:#101010; color:#EDEAE0;
  border:1px solid rgba(237,234,224,.16);
  border-radius:16px;
  box-shadow:0 10px 35px rgba(0,0,0,.45);
  text-align:center;
  padding: clamp(20px, 4vw, 48px);
}

/* Logo scales down gracefully on narrow phones */
.coming-logo img{
  height: clamp(100px, 18vw, 150px);
  width:auto;
  max-width: 90%;
  object-fit: contain;
  margin-bottom: 1rem;
}

/* Fluid headline size */
.coming-card h1{
  font-family:'GT Super Display Super', serif;
  font-weight:700;
  font-size: clamp(1.6rem, 4.8vw, 2.6rem);
  color:#B08D57;
  margin:0 0 .5rem;
}

/* Comfortable reading width */
.coming-lede{
  font-family: playfair-display, serif;
  margin: 0 auto 1.25rem;
  max-width: 58ch;
  color:#EDEAE0;
}

/* Flodesk slot stays centered and readable */
.signup-slot{ margin:.75rem auto 0; width:100%; max-width:560px; }

/* Touch-friendly inputs/buttons (Flodesk-injected) */
#signup .fd-form .fd-button{
  background:#B08D57; color:#101010; border:1px solid #101010; border-radius:5px;
  padding: 1rem 1.05rem;
  font-family:'GT Super Display Super', serif; font-weight:bold;
  box-shadow:2px 2px 0 #101010;
  transition: transform .2s ease, box-shadow .2s ease;
  cursor:pointer;
}
#signup .fd-form .fd-button:hover{ transform: translateY(-2px); box-shadow:4px 4px 0 #101010; }
#signup .fd-form input, #signup .fd-form select, #signup .fd-form textarea{
  border-radius:8px;
  background:#0f1011; color:#EDEAE0;
  border:1px solid rgba(237,234,224,.18);
  min-height: 48px;                 /* comfortable tap size */
}
#signup .fd-form input::placeholder{ color:#9a9a94; }

/* Clear focus styles for keyboard users */
#signup .fd-form .fd-button:focus-visible,
#signup .fd-form input:focus-visible{
  outline: 2px solid #B08D57;
  outline-offset: 2px;
}

/* Breakpoint helpers */
@media (max-width: 640px){
  .coming-card{ padding: clamp(16px, 6vw, 28px); }
  .coming-lede{ padding: 0 0.25rem; }
  /* Make form stack nicely on small screens if Flodesk uses inline layout */
  #signup .fd-form .fd-row { flex-direction: column !important; }
  #signup .fd-form .fd-field, 
  #signup .fd-form input, 
  #signup .fd-form .fd-button{ width: 100% !important; }
}

@media (max-width: 360px){
  .coming-card h1{ font-size: clamp(1.5rem, 6vw, 1.8rem); }
}
/* --- Edge-to-edge background + no gutters --- */
html, body {
  background: #1E3D59;   /* your site bg */
  margin: 0;
  padding: 0;
}

body {
  min-height: 100dvh;     /* robust across mobile browsers */
  overflow-x: hidden;     /* kill accidental 1px horizontal scroll */
}

/* Ensure the wrapper paints the same bg (belt & suspenders) */
.coming-wrap { background: #1E3D59; }

/* If the *card* border is what you're seeing, remove it: */
.coming-card {
  border: none;           /* was: 1px solid rgba(237,234,224,.16) */
  /* or keep a darker, subtler border: */
  /* border: 1px solid rgba(0,0,0,.3); */
}
/* --- iOS Safari edge/white-border fixes --- */
html, body {
  margin: 0;
  padding: 0;
  background: #1E3D59;                 /* ensure root paint matches your bg */
  height: 100%;                        /* baseline for -webkit-fill-available */
}

body {
  min-height: 100dvh;                  /* robust viewport unit */
  overflow-x: hidden;                  /* kill 1px horizontal jiggle */
}

/* iOS-specific: fill available height to avoid gaps at edges */
@supports (-webkit-touch-callout: none) {
  html { height: -webkit-fill-available; }
  body { min-height: -webkit-fill-available; }
}

/* Respect notches + avoid showing bg “gutters” as white during bounce */
.coming-wrap {
  background: #1E3D59;                 /* belt & suspenders */
  min-height: 100svh;
  padding-left: max(2rem, env(safe-area-inset-left));
  padding-right: max(2rem, env(safe-area-inset-right));
  padding-top: max(2rem, env(safe-area-inset-top));
  padding-bottom: max(2rem, env(safe-area-inset-bottom));
}

/* If what you’re seeing is the card’s border/shadow, soften or remove it */
@media (max-width: 480px) {
  .coming-card {
    border: none;                       /* or keep a darker border: #000 / .3 */
    box-shadow: 0 6px 24px rgba(0,0,0,.45);
  }
}

/* Tiny Safari rounding artifact on images inside rounded cards */
.coming-logo img { display: block; }
/* === Mobile Patch: iOS/Android safe, no white gutters === */
html,
body {
  margin: 0;
  padding: 0;
  background: #1E3D59;        /* your site background */
  height: 100%;               /* base for fill-available fallback */
}

body {
  min-height: 100svh;         /* robust viewport height on modern browsers */
  overflow-x: hidden;         /* stop 1px horizontal jiggle */
}

/* iOS/WebKit-specific fill available to plug tiny gaps */
@supports (-webkit-touch-callout: none) {
  html { height: -webkit-fill-available; }
  body { min-height: -webkit-fill-available; }
}

/* Respect notches and prevent edge flash during rubber-band scroll */
.coming-wrap {
  background: #1E3D59;        /* belt & suspenders */
  min-height: 100svh;         /* handles Safari dynamic toolbars */
  padding-left:  max(2rem, env(safe-area-inset-left));
  padding-right: max(2rem, env(safe-area-inset-right));
  padding-top:   max(2rem, env(safe-area-inset-top));
  padding-bottom:max(2rem, env(safe-area-inset-bottom));
}

/* Optional: soften border/shadow on small screens if it “reads” as a white edge */
@media (max-width: 480px) {
  .coming-card {
    border: none;              /* or use a darker one like: 1px solid rgba(0,0,0,.3) */
    box-shadow: 0 6px 24px rgba(0,0,0,.45);
  }
}

/* Avoid tiny rounding artifacts on images in rounded containers */
.coming-logo img { display: block; }