@charset "utf-8";
/* Naireen · plans.css — #plans */

/* ---------- plans ---------- */
.plans{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; align-items:stretch}
.plan{position:relative; display:flex; flex-direction:column; gap:13px; background:var(--card); border:1px solid var(--line);
  border-radius:20px; padding:clamp(22px,2.4vw,30px); backdrop-filter:blur(13px); -webkit-backdrop-filter:blur(13px);
  transition:border-color .4s, transform .4s cubic-bezier(.16,1,.3,1)}
.plan:hover{border-color:rgba(214,174,91,.45); transform:translateY(-4px)}
.plan.feat{border-color:rgba(214,174,91,.5); background:rgba(214,174,91,.06)}
.plan-b{position:absolute; top:-10px; inset-inline-start:clamp(22px,2.4vw,30px); font-family:var(--f-ui); font-size:10px;
  letter-spacing:.12em; text-transform:uppercase; color:#0B0B0E; background:var(--gold); border-radius:999px; padding:4px 11px}
.plan-k{margin:0; font-family:var(--f-ar-display); font-size:clamp(25px,2.8vw,31px); color:var(--ivory); line-height:1.2}
.plan-d{margin:0; font-size:14.5px; color:var(--mist); border-bottom:1px solid var(--line-soft); padding-bottom:14px}
.plan .ul{flex:1}
.plan-p{margin:0; font-family:var(--f-ui); font-size:12px; letter-spacing:.07em; color:var(--gold); border-top:1px solid var(--line-soft); padding-top:15px}
.plan .btn{align-self:flex-start}
.plans-note{margin:26px 0 0; font-size:13.5px; line-height:1.9; color:var(--stone); text-align:center}
@media (max-width:980px){ .plans{grid-template-columns:minmax(0,1fr)} .plan-b{top:-10px} }