/* The request popup — the homepage's #contact block, verbatim (see intake.js).
   Every value below is the homepage's own: white 540px card, 22px radius,
   30px padding, 14px gaps, #dbe6ef input borders at 12px radius, the #17435e
   ink, the 999px "Send message" pill, and the drawn check on success. */
.rq-modal { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 20px; }
/* `hidden` must beat the grid rule above — an author `display` otherwise
   overrides the UA's [hidden], and the X / Escape / backdrop all set the
   attribute and nothing happened (owner, 2026-09-02). */
.rq-modal[hidden] { display: none; }
.rq-back { position: absolute; inset: 0; background: rgba(18, 41, 58, 0.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.rq-panel {
  position: relative; color-scheme: light; width: min(600px, 100%); max-height: calc(100vh - 40px); overflow: auto; box-sizing: border-box;
  border-radius: 30px; padding: 40px 30px 28px; text-align: center; color: #17435e;
  background: linear-gradient(180deg, #ffffff 0%, #c3e4f7 45%, #8fc8ec 100%);
  box-shadow: 0 30px 80px rgba(20, 60, 90, 0.35);
}
.rq-x {
  position: absolute; top: 14px; right: 14px; appearance: none; border: 0; cursor: var(--basis-cursor-pointer, pointer);
  width: 34px; height: 34px; border-radius: 999px; background: rgba(23, 67, 94, 0.08); color: #17435e; font-size: 22px; line-height: 1;
  display: grid; place-items: center;
}
.rq-x:hover { background: rgba(23, 67, 94, 0.16); }
.rq-title { margin: 0 auto; font-size: clamp(1.6rem, 3.2vw, 2.3rem); font-weight: 600; letter-spacing: -0.035em; color: #17435e; line-height: 1.08; max-width: 18ch; }
.rq-sub { margin: 12px auto 0; max-width: 46ch; color: rgba(23, 67, 94, 0.78); font-size: 1rem; line-height: 1.6; }
.rq-form {
  position: relative; max-width: 540px; margin: 26px auto 0; background: #ffffff; border-radius: 22px; padding: 30px;
  box-shadow: 0 24px 64px rgba(23, 67, 94, 0.28); text-align: left; display: flex; flex-direction: column; gap: 14px;
}
.rq-row { display: flex; gap: 14px; flex-wrap: wrap; }
.rq-row input { flex: 1 1 200px; min-width: 0; }
.rq-form input, .rq-form textarea {
  width: 100%; box-sizing: border-box; font: inherit; border: 1px solid #dbe6ef; border-radius: 12px; padding: 13px 15px;
  font-size: 0.98rem; color: #17435e; background: #ffffff; outline: none; transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.rq-form textarea { resize: vertical; min-height: 116px; }
.rq-form input:focus, .rq-form textarea:focus { border-color: #4a90c2; box-shadow: 0 0 0 3px rgba(74, 144, 194, 0.18); }
.rq-form input::placeholder, .rq-form textarea::placeholder { color: rgba(23, 67, 94, 0.55); }
.rq-hp { position: absolute !important; left: -9999px; width: 1px !important; height: 1px; opacity: 0; }
.rq-submit {
  margin-top: 4px; width: 100%; border: none; cursor: var(--basis-cursor-pointer, pointer); font: inherit; font-size: 1rem; font-weight: 600; padding: 16px 30px;
  border-radius: 999px; background: #17435e; color: #ffffff; box-shadow: 0 10px 30px rgba(18, 41, 58, 0.35);
  transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.3s ease;
}
.rq-submit:hover { transform: translateY(-2px); box-shadow: 0 14px 38px rgba(18, 41, 58, 0.42); }
.rq-submit:disabled { cursor: var(--basis-cursor-default, default); transform: none; }
.rq-status { margin: 0; font-size: 0.92rem; color: #b43c2c; }
.rq-done { position: absolute; inset: 0; border-radius: 22px; background: #ffffff; display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; z-index: 3; }
.rq-done svg { width: 104px; height: 104px; }
.rq-done circle { fill: none; stroke: #1f8f5f; stroke-width: 3; stroke-dasharray: 164; stroke-dashoffset: 164; }
.rq-done path { fill: none; stroke: #1f8f5f; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 40; stroke-dashoffset: 40; }
@keyframes rqSuccessFade { 0% { opacity: 0; } 14% { opacity: 1; } 80% { opacity: 1; } 100% { opacity: 0; } }
@keyframes rqDraw { to { stroke-dashoffset: 0; } }
body.rq-open { overflow: hidden; }
/* The shared popup follows the same public theme as its host page. */
[data-theme="dark"] .rq-panel {
  color-scheme: dark; color: #e9f1f7;
  background: linear-gradient(180deg, #0b161e 0%, #102535 45%, #142d40 100%);
}
[data-theme="dark"] .rq-title { color: #e9f1f7; }
[data-theme="dark"] .rq-sub { color: #b8ccd8; }
[data-theme="dark"] .rq-x { color: #e9f1f7; background: rgba(255,255,255,.08); }
[data-theme="dark"] .rq-x:hover { background: rgba(255,255,255,.16); }
[data-theme="dark"] :is(.rq-form, .rq-done) { background: #122230; }
[data-theme="dark"] .rq-form :is(input, textarea) { color: #e9f1f7; background: #122230; border-color: #22384a; }
[data-theme="dark"] .rq-form :is(input, textarea)::placeholder { color: #94aab9; }
[data-theme="dark"] .rq-form :is(input, textarea):focus { border-color: #4fb3f0; box-shadow: 0 0 0 3px rgba(79,179,240,.18); }
[data-theme="dark"] .rq-submit { background: #dceefa; color: #0b1b26; }
[data-theme="dark"] .rq-status { color: #ff8b7b; }
@media (max-width: 640px) {
  .rq-panel { padding: 40px 16px 20px; border-radius: 22px; }
  .rq-form { padding: 20px; margin-top: 28px; }
}