/* ═══════════════════════════════════════
   SHARED COMPONENTS
═══════════════════════════════════════ */
.card{
  margin:0 20px 14px;
  padding:18px;
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:var(--r);
  box-shadow:var(--shadow);
  transition:.2s;
}
@media(min-width:768px){.card{margin:0 32px 14px;}}

.btn{
  width:100%;padding:15px;
  background:var(--accent);color:#fff;
  border:none;border-radius:10px;
  font-family:'Outfit',sans-serif;font-size:14px;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;
  cursor:pointer;transition:.2s;
}
.btn:hover{background:var(--accent2);transform:translateY(-1px);}
.btn-ghost{
  background:transparent;color:var(--text3);
  border:1px solid var(--border2);
}
.btn-ghost:hover{border-color:var(--text2);color:var(--text2);background:transparent;transform:none;}

.sec-hdr{
  padding:16px 20px 10px;
  display:flex;justify-content:space-between;align-items:center;
}
@media(min-width:768px){.sec-hdr{padding:20px 32px 10px;}}
.sec-t{font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--text3);}
.sec-l{font-size:12px;color:var(--accent2);cursor:pointer;}
.sec-l:hover{color:var(--accent);}