/* ==========================================================================
   Greenhills — Lead capture (Popup 1: Admission inquiry, Popup 2: Trust builder)
   Navy-Prestige aligned, theme-agnostic (light UI), mobile-first, non-intrusive.
   ========================================================================== */

/* ---------- shared ---------- */
.lc-hidden{display:none !important}
.lc-backdrop{
  position:fixed;inset:0;z-index:1000;display:flex;align-items:flex-end;justify-content:center;
  background:rgba(6,18,32,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  opacity:0;transition:opacity .28s ease;padding:0}
.lc-backdrop.lc-show{opacity:1}
@media (min-width:600px){.lc-backdrop{align-items:center;padding:1.5rem}}

/* ---------- Popup 1: admission inquiry modal ---------- */
.lc-modal{
  width:100%;max-width:440px;background:var(--warm-white,#fff);color:var(--charcoal,#16241c);
  border-radius:20px 20px 0 0;box-shadow:0 -8px 40px rgba(6,22,37,.3);
  transform:translateY(24px);transition:transform .32s cubic-bezier(.2,.7,.2,1);
  overflow:hidden;font-family:var(--font-ui,Manrope,system-ui,sans-serif)}
.lc-backdrop.lc-show .lc-modal{transform:translateY(0)}
@media (min-width:600px){.lc-modal{border-radius:20px}}

.lc-head{position:relative;padding:22px 22px 14px;color:#fff;
  background:linear-gradient(150deg,var(--navy-950,#0a1f3a),var(--navy-850,#123056))}
.lc-head::after{content:"";position:absolute;inset:0;opacity:.5;
  background:radial-gradient(80% 70% at 85% 0%,rgba(198,137,42,.28),transparent 60%)}
.lc-head > *{position:relative;z-index:1}
.lc-badge{display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--accent-soft,#d8b465);margin-bottom:8px}
.lc-head h3{font-family:var(--font-body,Bitter,Georgia,serif);font-size:1.4rem;line-height:1.2;
  margin:0;font-weight:700}
.lc-head p{margin:6px 0 0;font-size:.9rem;color:rgba(255,255,255,.85);line-height:1.45}
.lc-close{position:absolute;top:12px;right:12px;z-index:2;width:34px;height:34px;border:0;
  border-radius:50%;background:rgba(255,255,255,.16);color:#fff;font-size:1.1rem;line-height:1;
  cursor:pointer;display:grid;place-items:center;transition:background .15s}
.lc-close:hover{background:rgba(255,255,255,.3)}

.lc-body{padding:18px 22px 22px;display:flex;flex-direction:column;gap:12px}
.lc-field{display:flex;flex-direction:column;gap:5px}
.lc-field label{font-size:.76rem;font-weight:700;color:var(--muted,#54655a);letter-spacing:.01em}
.lc-field input,.lc-field select{
  width:100%;min-height:48px;padding:12px 14px;border:1.5px solid var(--line,#e6e9df);
  border-radius:12px;font-size:1rem;font-family:inherit;background:#fff;color:var(--charcoal,#16241c);
  transition:border-color .15s,box-shadow .15s}
.lc-field input:focus,.lc-field select:focus{outline:none;border-color:var(--accent,#1f7a46);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent,#1f7a46) 18%,transparent)}
.lc-row{display:flex;gap:10px}.lc-row .lc-field{flex:1}
.lc-submit{margin-top:6px;min-height:54px;border:0;border-radius:14px;cursor:pointer;
  font-size:1.02rem;font-weight:700;font-family:inherit;color:#fff;letter-spacing:.01em;
  background:#1f7a46;background:linear-gradient(180deg,#2f9d57,#1c6e3f);
  box-shadow:0 12px 26px rgba(28,110,63,.34),inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .15s,box-shadow .15s,filter .15s}
.lc-submit:hover{transform:translateY(-1px);filter:brightness(1.05);box-shadow:0 16px 32px rgba(28,110,63,.4),inset 0 1px 0 rgba(255,255,255,.22)}
.lc-submit:disabled{opacity:.7;cursor:progress}
.lc-fine{font-size:.72rem;color:var(--muted,#69747d);text-align:center;margin:2px 0 0}
.lc-trustline{display:flex;align-items:center;justify-content:center;gap:6px;font-size:.74rem;
  color:var(--muted,#69747d);font-weight:600;margin-top:2px}

.lc-success{padding:34px 24px 30px;text-align:center;display:flex;flex-direction:column;
  align-items:center;gap:10px}
.lc-success .lc-check{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;
  background:color-mix(in srgb,var(--accent,#1f7a46) 14%,#fff);color:var(--accent,#1f7a46)}
.lc-success h3{font-family:var(--font-body,Bitter,serif);margin:0;font-size:1.35rem;color:var(--navy-950,#0a1f3a)}
.lc-success p{margin:0;color:var(--muted,#54655a);font-size:.92rem;line-height:1.5;max-width:30ch}

/* ---------- Optional label + preferred-contact radio group ---------- */
.lc-opt{font-weight:500;color:var(--muted,#69747d);text-transform:none;letter-spacing:0}
.lc-choice{display:flex;gap:8px}
.lc-choice label{flex:1;position:relative;cursor:pointer}
.lc-choice input{position:absolute;opacity:0;width:0;height:0}
.lc-choice span{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 6px;
  border:1.5px solid var(--line,#e6e9df);border-radius:11px;font-size:.84rem;font-weight:600;
  color:var(--muted,#54655a);background:#fff;transition:border-color .15s,background .15s,color .15s;text-align:center}
.lc-choice input:checked + span{border-color:var(--accent,#1f7a46);color:var(--accent,#1f7a46);
  background:color-mix(in srgb,var(--accent,#1f7a46) 8%,#fff);font-weight:700}
.lc-choice input:focus-visible + span{outline:2px solid var(--accent,#1f7a46);outline-offset:2px}

/* ---------- Achievement popup (admin-managed, shows first) ----------
   Two modes:
   • image set   → IMAGE ONLY, shown whole (never cropped), sized to the viewport
   • no image    → text card fallback (title / description / CTA)          */
.ach-backdrop{align-items:center !important;padding:16px !important}
.ach-modal{position:relative;padding:0;overflow:hidden}
.ach-close{position:absolute;top:10px;right:10px;z-index:3;background:rgba(10,31,58,.62);color:#fff;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.25)}

/* Image-only: the modal hugs the image; the image is never cropped.
   `padding-top` reserves a band ABOVE the image for the close button, so the
   button can never overlap artwork on any image or screen size. */
.ach-image-only{background:transparent;border-radius:0;box-shadow:none;overflow:visible;
  width:auto;max-width:min(620px,92vw);transform:none !important;display:inline-block;
  line-height:0;padding-top:56px;position:relative}
.ach-image-only img{display:block;width:auto;height:auto;max-width:min(620px,92vw);
  max-height:calc(88svh - 68px);object-fit:contain;border-radius:14px;
  box-shadow:0 26px 70px rgba(0,0,0,.45)}
.ach-image-only a{display:block;line-height:0}

/* Close button: OUTSIDE the image, top-right of the popup container.
   Solid light chip so it reads on any artwork; 44px = touch target minimum. */
.ach-image-only .ach-close{
  position:absolute;top:2px;right:0;z-index:4;
  width:44px;height:44px;border-radius:50%;
  display:grid;place-items:center;cursor:pointer;
  background:#fff;color:#0a1f3a;border:1px solid rgba(0,0,0,.08);
  box-shadow:0 6px 20px rgba(0,0,0,.4);
  font-size:0;line-height:0;
  -webkit-backdrop-filter:none;backdrop-filter:none;
  transition:transform .15s ease, background .15s ease}
.ach-image-only .ach-close svg{width:20px;height:20px;display:block}
.ach-image-only .ach-close:hover{transform:scale(1.06);background:#f2f4f7}
.ach-image-only .ach-close:focus-visible{outline:3px solid #fff;outline-offset:3px}

.ach-body{padding:22px 22px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:9px}
.ach-badge{font-size:.64rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--accent,#1f7a46)}
.ach-body h3{margin:0;font-family:var(--font-body,Bitter,Georgia,serif);font-size:1.42rem;line-height:1.22;
  color:var(--navy-950,#0a1f3a);text-wrap:balance}
.ach-body p{margin:0;font-size:.93rem;line-height:1.6;color:var(--muted,#54655a);max-width:38ch}
.ach-cta{margin-top:6px;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:50px;padding:0 22px;border-radius:13px;text-decoration:none;color:#fff;font-weight:700;
  background:linear-gradient(180deg,#2f9d57,#1c6e3f);
  box-shadow:0 10px 24px rgba(28,110,63,.3),inset 0 1px 0 rgba(255,255,255,.2);
  transition:transform .15s,filter .15s}
.ach-cta:hover{transform:translateY(-1px);filter:brightness(1.05)}

@media (prefers-reduced-motion:reduce){
  .lc-backdrop,.lc-modal{transition:opacity .01s}
  .lc-modal{transform:none}
}
