/* ============================================================
   Amir Institute — css/parents.css
   Page stylesheet for parents.html. Loaded after css/site.css.
   ============================================================ */

/* ── the two logins: the reason most parents open this page ── */
.logingrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));
  gap:clamp(18px,2.4vw,30px);max-width:1040px;margin:0 auto}
.logincard{display:flex;align-items:center;gap:clamp(16px,2vw,22px);
  background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);
  padding:clamp(22px,2.6vw,30px);box-shadow:var(--shadow-sm);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s}
.logincard:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:transparent}
.logincard:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.login-ic{flex:none;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;
  background:var(--green-100);color:var(--green-800)}
.login-ic svg{width:27px;height:27px}
.login-tx{flex:1;min-width:0;display:block}
.login-tx b{display:block;font-size:1.14rem;color:var(--ink);line-height:1.25;margin-bottom:5px}
.login-tx span{display:block;font-size:.93rem;color:var(--body);line-height:1.55}
.logincard .btn{flex:none;pointer-events:none}
.login-note{text-align:center;font-size:.92rem;color:var(--muted);margin:26px auto 0;max-width:56ch}
.login-note a{color:var(--green-700);font-weight:700;text-decoration:underline}

/* ── calendar + key dates ── */
.cal-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(26px,4vw,64px);
  align-items:center;max-width:1180px;margin:0 auto}
.keydates{background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);
  padding:clamp(24px,3vw,36px);box-shadow:var(--shadow-sm)}
.keydates h3{font-size:1.16rem;margin-bottom:16px}
.keydates ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.keydates li{display:flex;gap:11px;align-items:flex-start;font-size:.96rem;
  padding-bottom:11px;border-bottom:1px solid var(--line)}
.keydates li:last-child{border-bottom:0;padding-bottom:0}
.keydates li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;
  background:var(--gold);margin-top:.55em}
.keydates ul.todo li{color:var(--gold-dark);font-weight:600}
.btn.todo{opacity:.55;cursor:not-allowed;pointer-events:none}

/* ── next three events ── */
.upgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(282px,1fr));
  gap:clamp(18px,2.2vw,28px);max-width:1180px;margin:0 auto}
.upcard{background:#fff;border:1px solid var(--line);border-left:4px solid var(--gold);
  border-radius:var(--r);padding:clamp(22px,2.4vw,30px)}
.up-when{display:block;font-size:.75rem;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold-dark);margin-bottom:10px}
.upcard h3{font-size:1.14rem;margin-bottom:9px}
.upcard p{font-size:.94rem;line-height:1.62;margin:0}

@media (max-width:860px){
  .cal-grid{grid-template-columns:1fr}
  .logincard{flex-wrap:wrap}
  .logincard .btn{width:100%;text-align:center;justify-content:center}
}
.inline-link{color:var(--green-700);font-weight:700;text-decoration:underline}
