/* ============================================================
   CONSULTATION PAGE — page-specific layout only.
   Reuses tokens + shared components from style.css
   (.grid-4, .pricing-card, .form-box, .btn, .badge, .tag-pop,
   .page-hero, .section-pad, etc). Nothing here redefines
   those selectors.
   ============================================================ */

/* consultation option cards (free vs paid) */
.consult-cards{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:900px;margin:0 auto;}
.consult-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:28px;position:relative;}
.consult-card.accent-green{border-top:4px solid #1AA05D;}
.consult-card.accent-gold{border-top:4px solid #D4AF37;}
.cc-icon{width:48px;height:48px;border-radius:12px;background:#FFF1E3;color:var(--orange);display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:14px;}
.cc-tag{position:absolute;top:24px;right:24px;font-size:10px;font-weight:800;padding:4px 10px;border-radius:12px;background:#F5F5F5;color:#555;letter-spacing:.3px;}
.consult-card h3{font-size:17px;font-weight:800;margin:0 0 10px;}
.cc-list{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-direction:column;gap:8px;}
.cc-list li{font-size:13px;color:#333;display:flex;align-items:center;gap:8px;font-weight:600;}
.cc-list li i{color:#1AA05D;font-size:11px;flex-shrink:0;}
.cc-meta{font-size:11.5px;color:var(--gray);display:flex;align-items:center;gap:6px;margin-bottom:16px;}
.consult-card .btn{width:100%;justify-content:center;}

/* contact info card */
.consult-contact-card{max-width:640px;margin:0 auto;background:#FFFAF4;border:1px solid var(--border);border-radius:16px;padding:28px 32px;display:flex;flex-direction:column;gap:14px;}
.consult-contact-item{display:flex;align-items:center;gap:12px;font-size:13.5px;color:#333;}
.cci-icon{width:20px;color:var(--orange);text-align:center;flex-shrink:0;}
.btn-label{display:inline-flex;align-items:center;}

/* modal overlay + dialog */
.cm-overlay{position:fixed;inset:0;background:rgba(10,10,10,.55);display:none;align-items:center;justify-content:center;padding:20px;z-index:200;}
.cm-overlay.open{display:flex;}
.cm-modal{position:relative;background:#fff;border-radius:18px;max-width:560px;width:100%;max-height:88vh;overflow-y:auto;padding:36px 32px;box-shadow:0 40px 80px rgba(0,0,0,.3);}
.cm-close{position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:50%;border:none;background:#F5F5F5;color:#444;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s ease;}
.cm-close:hover{background:#EAEAEA;}
.cm-modal h3{font-size:19px;font-weight:800;margin:0 0 8px;padding-right:30px;}
.cm-sub{font-size:13px;color:var(--gray);margin:0 0 18px;}
.cm-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.cm-error{display:none;align-items:center;gap:8px;background:#FDECEC;color:#C0392B;font-size:12.5px;font-weight:600;padding:12px 16px;border-radius:8px;margin-bottom:14px;}
.cm-error.show{display:flex;}
.cm-privacy{display:flex;gap:10px;margin-top:18px;padding-top:18px;border-top:1px solid var(--border);}
.cm-privacy i{color:var(--gray);font-size:14px;margin-top:2px;flex-shrink:0;}
.cm-privacy p{font-size:11.5px;color:var(--gray);line-height:1.6;margin:0;}

/* success state */
.cm-success{text-align:center;padding:12px 0;}
.cm-check{width:60px;height:60px;border-radius:50%;background:#E8F8EF;color:#1AA05D;font-size:24px;display:flex;align-items:center;justify-content:center;margin:0 auto 18px;}
.cm-success h4{font-size:18px;margin:0 0 10px;}
.cm-success p{font-size:13.5px;color:var(--gray);line-height:1.7;margin:0 0 16px;}
.cm-contact-row{background:#FFFAF4;border-radius:12px;padding:18px;text-align:left;}
.cm-contact-row p{font-size:13px;margin:4px 0;}

/* button loading spinner */
.cm-spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;margin-right:8px;vertical-align:middle;animation:cmSpin .7s linear infinite;}
@keyframes cmSpin{to{transform:rotate(360deg);}}

@media(max-width:900px){
  .consult-cards{grid-template-columns:1fr;}
}
@media(max-width:600px){
  .cm-row{grid-template-columns:1fr;}
  .cm-modal{padding:28px 20px;}
}
.cci-label{display:block;font-size:13px;font-weight:800;color:var(--black);margin-bottom:2px;}