/* =============================================================
   SECURITY-PATCH ADDITIONS — append to end of styles.css
   fixes: L-01 (inline event handlers), form success state
   ============================================================= */

/* FIX-L01: Footer designer link hover — replaces onmouseover/onmouseout
   inline event handlers that were blocked by CSP and are bad practice. */
.footer-designer-link {
  color: rgba(255, 255, 255, .8);
  text-decoration: none;
  border-bottom: 1px solid var(--gold-ln);
  transition: color .2s ease, border-color .2s ease;
}
.footer-designer-link:hover,
.footer-designer-link:focus-visible {
  color: #C9A83C;
  border-color: var(--gold);
  outline: none;
}

/* Contact form — success state */
.fok {
  display: none;
  text-align: center;
  padding: 2.5rem 1.5rem;
  border: 1px solid var(--gold-ln);
  border-radius: 6px;
  background: rgba(201, 168, 60, .05);
  color: var(--tm);
}
.fok.sh {
  display: block;
}
.fok h4 {
  font-size: 1.3rem;
  color: var(--gold);
  margin-bottom: .4rem;
}
.fok p {
  font-size: .9rem;
  color: rgba(255, 255, 255, .6);
}

/* Cloudflare Turnstile widget — dark theme alignment */
.cf-turnstile {
  margin: .75rem 0 .5rem;
}
.cf-turnstile iframe {
  border-radius: 4px;
}

/* Form error message visible state */
.fe {
  display: none;
  font-size: .78rem;
  color: #e05252;
  margin-top: .3rem;
}
.fe.sh {
  display: block;
}

/* Form field invalid state */
.fc.er {
  border-color: #e05252 !important;
  box-shadow: 0 0 0 2px rgba(224, 82, 82, .18);
}

/* =============================================================
   SITE-WIDE TURNSTILE GATE OVERLAY
   Added v3.4 — covers all pages, not just the contact form
   ============================================================= */

/* Full-screen overlay — sits above everything */
#mwry-gate {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(ellipse at 60% 30%, rgba(201,168,60,.06) 0%, transparent 60%),
    linear-gradient(160deg, #0a0b0d 0%, #0f1014 40%, #080a0c 100%);
  padding: 1.5rem;
  /* No pointer-events passthrough — gate blocks all interaction */
}

/* Card */
#mwry-gate-card {
  background: #111318;
  border: 1px solid rgba(201,168,60,.18);
  border-radius: 12px;
  padding: 2.5rem 2rem 2rem;
  max-width: 380px;
  width: 100%;
  text-align: center;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.4),
    0 24px 64px rgba(0,0,0,.6),
    0 0 80px rgba(201,168,60,.04);
  font-family: 'Poppins', sans-serif;
}

/* Shield icon */
#mwry-gate-logo {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(201,168,60,.12), rgba(201,168,60,.04));
  border: 1px solid rgba(201,168,60,.25);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.25rem;
  color: #C9A83C;
}

/* Title */
#mwry-gate-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: #e8edf8;
  margin: 0 0 .4rem;
  letter-spacing: -.01em;
}

/* Subtitle */
#mwry-gate-sub {
  font-size: .82rem;
  color: rgba(255,255,255,.45);
  margin: 0 0 1.5rem;
  line-height: 1.5;
}

/* Widget container — centred */
#mwry-gate-widget {
  display: flex;
  justify-content: center;
  min-height: 65px;
  margin-bottom: 1rem;
}

/* Turnstile iframe inside widget — let it breathe */
#mwry-gate-widget iframe {
  border-radius: 6px;
}

/* Fine print */
#mwry-gate-note {
  font-size: .7rem;
  color: rgba(255,255,255,.25);
  margin: 0;
  line-height: 1.5;
}

/* Error message */
#mwry-gate-error {
  font-size: .78rem;
  color: #e05252;
  margin: .75rem 0 0;
}
#mwry-gate-error button#mwry-retry {
  background: none;
  border: none;
  color: #C9A83C;
  cursor: pointer;
  font-size: inherit;
  font-family: inherit;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 2px;
}
#mwry-gate-error button#mwry-retry:hover {
  color: #e0be5e;
}

/* Responsive — smaller card on mobile */
@media (max-width: 420px) {
  #mwry-gate-card {
    padding: 2rem 1.25rem 1.5rem;
    border-radius: 10px;
  }
  #mwry-gate-title { font-size: 1rem; }
}