/* ANDALUS_INSTALLMENT_CHECK_V1 — «اعرف قسطك وورقك»: the answer boxes (/24 quick form + /installment-check/)
   and the step-by-step page. Phone first; tablet/desktop just get more room. */

/* ---- the answer (both places) ---- */
.aic-box{ display:grid; gap:8px; padding:14px 14px 12px; border-radius:16px; background:#fff; border:1px solid rgba(76,43,32,.12); text-align:right; }
.aic-box__h{ font-size:1rem; font-weight:900; color:#4c2b20; line-height:1.5; }
.aic-check{ list-style:none; margin:0; padding:0; display:grid; gap:7px; }
.aic-check li{ position:relative; padding-inline-start:30px; font-weight:800; line-height:1.65; color:#1d1919; overflow-wrap:anywhere; }
.aic-check li::before{ content:"✓"; position:absolute; inset-inline-start:0; top:.1em; width:22px; height:22px; border-radius:50%;
  display:grid; place-items:center; background:#128c4a; color:#fff; font-size:.8rem; font-weight:900; line-height:1; }
.aic-note{ margin:0; font-size:.92rem; font-weight:750; line-height:1.7; color:#3b3335; }
.aic-note--soft{ color:#6d6467; font-weight:700; font-size:.86rem; }
.aic-money{ margin:0; font-size:1.15rem; font-weight:900; color:#1d1919; line-height:1.5; }
.aic-money small{ font-size:.8rem; font-weight:750; color:#6d6467; }
.aic-box--money{ background:linear-gradient(180deg,#fff,#fff8f3); border-color:rgba(189,146,87,.45); }
.aic-safe{ margin:0; padding:10px 12px; border-radius:12px; background:#f3f7ff; border:1px solid #d6e2fb; color:#20365f; font-size:.9rem; font-weight:800; line-height:1.65; }

/* the result card on the new page (same look as the /24 result) */
.aic-result{ display:grid; gap:12px; padding:16px; border-radius:20px; border:1px solid #cfe6d8; background:#f0faf4; color:#1d1919; font-weight:800; line-height:1.7; }
.aic-result.is-maybe{ border-color:#eadfa8; background:#fffbe8; }
.aic-result > strong{ display:block; font-size:1.2rem; font-weight:900; }
.aic-result .afsWaBig{ display:flex; align-items:center; justify-content:center; gap:10px; min-height:60px; padding:12px 18px; border-radius:16px;
  font-size:1.2rem; font-weight:900; line-height:1.3; text-decoration:none; background:#128c4a !important; color:#fff !important; border:1px solid #128c4a !important;
  box-shadow:0 8px 22px rgba(18,140,74,.28); }
.aic-result .afsWaBig:focus-visible{ outline:3px solid #0b5d31; outline-offset:3px; }
.aic-more{ display:flex; align-items:center; justify-content:center; min-height:48px; border-radius:14px; border:1px solid rgba(76,43,32,.25);
  background:#fff; color:#4c2b20; font-weight:900; text-decoration:none; }
.aic-again{ justify-self:center; min-height:44px; padding:6px 14px; border:0; background:none; color:#6d6467; font:inherit; font-weight:800; text-decoration:underline; cursor:pointer; }

/* ---- the step-by-step page ---- */
.aic-page{ background:#faf6f2; }
.aic-wrap{ width:min(640px, calc(100% - 32px)); margin-inline:auto; padding:22px 0 56px; }
.aic-crumbs{ font-size:.85rem; color:#6d6467; margin-bottom:10px; }
.aic-crumbs a{ color:inherit; }
.aic-head h1{ margin:0 0 8px; font-size:clamp(1.55rem, 5.4vw, 2.2rem); line-height:1.35; color:#2a1812; font-weight:900; }
.aic-head p{ margin:0 0 14px; color:#3b3335; font-weight:700; line-height:1.8; }
.aic-facts{ list-style:none; margin:0 0 18px; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.aic-facts li{ flex:0 0 auto; padding:6px 12px; border-radius:999px; background:#fff; border:1px solid rgba(76,43,32,.14); font-size:.86rem; font-weight:800; color:#4c2b20; }

.aic-card{ scroll-margin-top:180px; background:#fff; border:1px solid rgba(76,43,32,.12); border-radius:24px; padding:18px; box-shadow:0 14px 38px rgba(76,43,32,.08); }
.aic-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; min-height:44px; }
.aic-count{ font-size:.9rem; font-weight:850; color:#6d6467; }
.aic-back{ min-height:44px; padding:6px 12px; border-radius:12px; border:1px solid rgba(76,43,32,.18); background:#fff; color:#4c2b20; font:inherit; font-weight:850; cursor:pointer; }
.aic-progress{ height:8px; border-radius:99px; background:#f1e9e2; overflow:hidden; margin-bottom:16px; }
.aic-progress span{ display:block; margin-left:auto; height:100%; width:25%; border-radius:inherit; background:linear-gradient(90deg,#bd9257,#4c2b20); transition:width .3s ease; }

.aic-step{ border:0; margin:0; padding:0; min-width:0; animation:aicIn .28s ease both; }
.aic-step legend, .aic-step > label{ display:block; padding:0; margin:0 0 6px; font-size:1.25rem; font-weight:900; color:#1d1919; line-height:1.5; outline:none; }
.aic-hint{ margin:0 0 12px; color:#6d6467; font-weight:700; font-size:.92rem; line-height:1.7; }
.aic-choices{ display:grid; gap:9px; }
.aic-choice{ position:relative; display:block; cursor:pointer; }
.aic-choice input{ position:absolute; opacity:0; pointer-events:none; }
.aic-choice span{ display:grid; gap:2px; min-height:56px; padding:12px 14px; border-radius:16px; border:1.5px solid rgba(76,43,32,.16); background:#fff;
  align-content:center; transition:border-color .15s, background .15s, transform .15s; }
.aic-choice b{ font-weight:900; color:#1d1919; line-height:1.45; }
.aic-choice small{ font-weight:700; color:#6d6467; line-height:1.5; }
.aic-choice:hover span{ border-color:rgba(189,146,87,.7); }
.aic-choice input:focus-visible + span{ outline:3px solid #bd9257; outline-offset:2px; }
.aic-choice input:checked + span{ border-color:#4c2b20; background:#fff8f3; transform:translateY(-1px); }
.aic-choices--two{ grid-template-columns:repeat(2, minmax(0,1fr)); }
.aic-phone{ width:100%; box-sizing:border-box; min-height:56px; padding:10px 14px; border-radius:16px; border:1.5px solid rgba(76,43,32,.22);
  font:inherit; font-size:1.2rem; font-weight:800; text-align:left; letter-spacing:.04em; background:#fff; }
.aic-phone:focus{ outline:3px solid rgba(189,146,87,.55); outline-offset:1px; border-color:#4c2b20; }
.aic-err{ margin:8px 0 0; color:#a90f21; font-weight:850; font-size:.92rem; }
.aic-submit{ margin-top:14px; width:100%; min-height:58px; border:0; border-radius:16px; background:#4c2b20; color:#fff; font:inherit; font-size:1.12rem; font-weight:900; cursor:pointer; }
.aic-submit[disabled]{ opacity:.65; cursor:wait; }
.aic-sr{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.aic-below{ margin-top:18px; display:grid; gap:10px; }
.aic-below a{ display:inline-flex; align-items:center; min-height:44px; color:#4c2b20; font-weight:850; }

@keyframes aicIn{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce){ .aic-step{ animation:none; } .aic-progress span{ transition:none; } }
@media (min-width:768px){
  .aic-wrap{ padding-top:34px; }
  .aic-card{ padding:26px; }
  .aic-choices--list{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:360px){ .aic-choices--two{ grid-template-columns:1fr; } }