/* Members page - classes prefixed sd- to avoid clashes with style.css */
.sd-section{margin-bottom:40px}
.sd-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,320px));gap:28px;justify-content:start}

/* ---------- card: white by default, orange liquid glass on hover ---------- */
.sd-card{
  position:relative;overflow:hidden;isolation:isolate;
  background:#fff;border:1px solid #e3eaf2;border-radius:20px;
  padding:30px 20px 20px;text-align:center;
  box-shadow:0 4px 14px rgba(18,38,63,.07);
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease,background .45s ease,border-color .45s ease,backdrop-filter .45s ease;
  opacity:0;animation:sd-in .6s ease forwards;
}
.sd-card:nth-child(2){animation-delay:.12s}

/* orange glass layer (fades in on hover) */
.sd-card::before{
  content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:0;
  background:
    radial-gradient(120% 80% at 20% 0%,rgba(255,255,255,.55),rgba(255,255,255,0) 55%),
    radial-gradient(90% 70% at 90% 100%,rgba(255,94,0,.40),rgba(255,94,0,0) 60%),
    linear-gradient(145deg,rgba(255,168,84,.55),rgba(255,110,20,.38));
  transition:opacity .45s ease;
}
/* moving specular sheen */
.sd-card::after{
  content:"";position:absolute;top:-20%;bottom:-20%;left:-60%;width:40%;z-index:-1;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-20deg);opacity:0;
}
.sd-card:hover{
  transform:translateY(-8px) scale(1.02);
  background:rgba(255,190,120,.18);
  -webkit-backdrop-filter:blur(18px) saturate(180%);backdrop-filter:blur(18px) saturate(180%);
  border-color:rgba(255,255,255,.75);
  box-shadow:
    0 18px 40px rgba(255,100,10,.30),
    0 0 26px rgba(255,140,50,.35),
    inset 0 1.5px 0 rgba(255,255,255,.9),
    inset 0 -2px 8px rgba(255,90,0,.25);
}
.sd-card:hover::before{opacity:1}
.sd-card:hover::after{animation:sd-sheen 1.1s ease forwards}

.sd-card h3{margin:18px 0 4px;color:#1f4e79;font-size:1.1rem;transition:color .35s}
.sd-role{color:#e0692f;font-weight:700;font-size:.88rem;margin-bottom:8px;transition:color .35s}
.sd-card p{color:#5b6b7c;font-size:.92rem;margin:8px 0 14px}
.sd-card p:empty{display:none}
.sd-card:hover h3{color:#3d1d05}
.sd-card:hover .sd-role{color:#8a2e00}

/* ---------- square photo, no permanent glow ---------- */
.sd-photo{position:relative;width:140px;height:140px;margin:0 auto;border-radius:16px;transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease}
.sd-photo img{display:block;width:100%;height:100%;object-fit:cover;border-radius:16px;background:#e8edf3;border:3px solid #fff;box-sizing:border-box;box-shadow:0 3px 10px rgba(18,38,63,.18);transition:transform .45s ease,border-color .45s ease}
.sd-card:hover .sd-photo{transform:translateY(-2px);box-shadow:0 0 0 2px rgba(255,255,255,.7),0 10px 26px rgba(255,100,10,.45),0 0 22px rgba(255,140,50,.55);}
.sd-card:hover .sd-photo img{transform:scale(1.04);border-color:rgba(255,255,255,.95)}

.sd-guides{list-style:none;margin:0 0 6px;padding:0;font-size:.86rem;color:#33475b;line-height:1.7;transition:color .35s}
.sd-guides a{color:#e0692f;text-decoration:none;font-weight:600}
.sd-guides a:hover{text-decoration:underline}
.sd-card:hover .sd-guides{color:#3d1d05}
.sd-card:hover .sd-guides a{color:#8a2e00}

/* ---------- links with png icons ---------- */
.sd-links{display:flex;flex-wrap:wrap;gap:8px 16px;justify-content:center;margin-top:10px}
.sd-card a.sd-link{display:inline-flex;align-items:center;gap:6px;color:#1f4e79;font-weight:600;font-size:.88rem;line-height:1;text-decoration:none;transition:color .25s,transform .25s}
.sd-card a.sd-link:hover{color:#8a2e00;transform:translateY(-2px)}
.sd-card a.sd-link .sd-ico{width:18px;height:18px;object-fit:contain;display:block;transition:transform .25s}
.sd-card a.sd-link:hover .sd-ico{transform:scale(1.2) rotate(-6deg)}
.sd-card:hover a.sd-link{color:#3d1d05}

/* ---------- profile pages (anbu.html, msrrao.html) ---------- */
.profile{max-width:760px;margin:0 auto;text-align:center}
.profile .avatar{width:160px;height:160px;border-radius:18px;object-fit:cover;border:3px solid #fff;box-shadow:0 4px 14px rgba(18,38,63,.25);margin:0 auto 14px;display:block}
.profile .links2 a{margin:0 8px}
.back{display:inline-block;margin-bottom:16px}

@keyframes sd-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes sd-sheen{0%{left:-60%;opacity:0}20%{opacity:1}100%{left:130%;opacity:0}}

@media(max-width:640px){.sd-grid{grid-template-columns:1fr;justify-content:center}}
@media(prefers-reduced-motion:reduce){.sd-card{animation:none;opacity:1}.sd-card:hover::after{animation:none}.sd-card,.sd-photo,.sd-photo img{transition:none}}
