:root {
    /* ── Dex University ── blue (institutional) · orange (primary action) · white ── */
    --navy:        #0b2b5e;   /* headings, top bar, hero, footer */
    --blue:        #14459b;
    --blue2:       #1c5fd0;   /* links, active states */
    --light-blue:  #eef3fc;

    --orange:      #f47b20;   /* reserved for the primary action only */
    --orange-dark: #d9631a;
    --light-orange:#fff4ea;

    --gray:        #f5f6f8;   /* page background */
    --border:      #dfe3e8;   /* hairlines */
    --border-mid:  #cbd2d9;   /* input borders */
    --text:        #2c3340;
    --muted:       #667085;
    --danger:      #b42318;
    --success:     #15803d;
    --warn-bg:     #fffaf0;
    --warn-border: #f2d9a8;
    --warn-text:   #7c4a03;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif;
    color: var(--text);
    background: var(--gray);
    font-size: 15px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a { text-decoration: none; color: inherit; }

/* ── Container ── */
.container { max-width:1180px; margin:0 auto; padding:0 1.25rem; }

/* ── Top Bar ── */
.top-bar { background: var(--navy); color: #c6d2e8; font-size: .78rem; padding: .4rem 0; }
.top-bar-inner { display:flex; justify-content:space-between; align-items:center; gap:.4rem; flex-wrap:wrap; }
.top-bar a { color: #c6d2e8; }
.top-bar-contacts { display:flex; gap:1.5rem; flex-wrap:wrap; }
.top-bar .social a { display:inline-flex; align-items:center; justify-content:center;
    width:24px; height:24px; border-radius:2px; margin-left:4px; font-size:.7rem; color:#c6d2e8; }
.top-bar .social a:hover { color:#fff; }

/* ── Navbar ── */
nav.main-nav { background:#fff; border-bottom:1px solid var(--border); padding:.65rem 0;
    position:sticky; top:0; z-index:100; }
.nav-inner { display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.nav-logo { display:flex; align-items:center; gap:11px; }
.nav-logo img { height:46px; width:auto; }
.nav-logo .brand-text { line-height:1.25; }
.nav-logo .brand-name { font-size:1.02rem; font-weight:600; color:var(--navy); letter-spacing:-.01em; }
.nav-logo .brand-sub  { font-size:.72rem; color:var(--muted); font-weight:400; }
.nav-links { display:flex; align-items:center; gap:1.6rem; list-style:none; }
.nav-links a { font-size:.86rem; font-weight:400; color:var(--text); padding:.35rem 0;
    border-bottom:2px solid transparent; transition:color .15s, border-color .15s; }
.nav-links a:hover { color:var(--blue2); border-color:var(--blue2); }
.btn-apply { background:var(--orange); color:#fff !important; border-radius:3px;
    padding:.45rem 1.1rem !important; border:none !important; font-weight:500; border-bottom:none !important; }
.btn-apply:hover { background:var(--orange-dark); border-color:transparent !important; }

/* Hamburger */
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer;
    background:none; border:none; padding:.4rem; }
.hamburger span { display:block; width:22px; height:2px; background:var(--navy);
    border-radius:1px; transition:.25s; }
.hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity:0; }
.hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* Mobile nav drawer */
.mobile-menu { display:none; background:#fff; border-top:1px solid var(--border); }
.mobile-menu.open { display:block; }
.mobile-menu ul { list-style:none; padding:.25rem 0; }
.mobile-menu ul li a { display:block; padding:.7rem 1.25rem; font-size:.9rem;
    color:var(--text); border-bottom:1px solid var(--gray); }
.mobile-menu ul li:last-child a { border-bottom:none; }
.mobile-menu ul li a:hover { background:var(--gray); color:var(--blue2); }
.mobile-menu .btn-apply { display:block; margin:.8rem 1.25rem; text-align:center;
    padding:.6rem !important; border-radius:3px !important; }

/* ── Hero ── */
.hero { position:relative; min-height:230px; display:flex; align-items:center;
    background: linear-gradient(to right, rgba(11,43,94,.92) 0%, rgba(11,43,94,.78) 55%, rgba(11,43,94,.55)),
    url('../uploads/campus-banner.jpeg') center 40%/cover no-repeat;
    border-bottom:3px solid var(--orange); }
.hero-content { color:#fff; padding:2.75rem 0; max-width:640px; }
.hero-content h1 { font-size:1.85rem; font-weight:600; margin-bottom:.5rem; letter-spacing:-.01em; }
.hero-content p.sub { font-size:.95rem; color:#c8d6ef; font-weight:400; max-width:520px; }
.hero-content p.tag { font-size:.78rem; color:#9db4dc; letter-spacing:.12em;
    text-transform:uppercase; margin-bottom:.45rem; font-weight:500; }
/* Kept for markup compatibility; no longer used as a decorative badge. */
.hero-secure { display:none; }

/* ── Step Indicator ── */
.steps-bar { background:#fff; border-bottom:1px solid var(--border); padding:1.15rem 0 1rem; }
.steps-track { display:flex; align-items:flex-start; justify-content:center; gap:0; }
.step-item { display:flex; align-items:flex-start; }
.step-circle { width:30px; height:30px; border-radius:50%; border:1px solid var(--border-mid);
    background:#fff; display:flex; align-items:center; justify-content:center;
    font-weight:500; font-size:.8rem; color:var(--muted); transition:.2s; flex-shrink:0; }
.step-label { text-align:center; margin-top:.45rem; }
.step-label .step-title { font-size:.76rem; font-weight:500; color:var(--muted); line-height:1.3; }
.step-label .step-desc  { font-size:.7rem; color:#98a2b3; margin-top:.1rem; }
.step-box { display:flex; flex-direction:column; align-items:center; width:112px; }
.step-connector { width:36px; height:1px; background:var(--border-mid); flex-shrink:0; margin-top:15px; }
.step-item.active .step-circle { background:var(--blue2); border-color:var(--blue2); color:#fff; }
.step-item.active .step-title  { color:var(--navy); font-weight:600; }
.step-item.done   .step-circle { background:#fff; border-color:var(--blue2); color:var(--blue2); }
.step-item.done   .step-title  { color:var(--text); }
.step-item.done   .step-connector { background:var(--blue2); }

/* Mobile step label */
.mobile-step-label { display:none; text-align:center; margin-top:.65rem;
    font-size:.82rem; color:var(--navy); font-weight:600; }

/* ── Information strip ── */
.info-banner { background:#fff; border-bottom:1px solid var(--border); }
.info-banner-row { display:flex; flex-wrap:wrap; }
.info-card { padding:1.05rem 1.5rem; border-right:1px solid var(--border); flex:1; min-width:180px; }
.info-card:first-child { padding-left:0; }
.info-card:last-child { border-right:none; }
/* Icon slot retained in the cascade but not rendered. */
.info-card .icon { display:none; }
.info-card .label { font-size:.72rem; color:var(--muted); text-transform:uppercase;
    letter-spacing:.06em; font-weight:600; margin-bottom:.2rem; }
.info-card .val  { font-size:.94rem; font-weight:600; color:var(--navy); }
.info-card .sub  { font-size:.76rem; color:var(--muted); margin-top:.1rem; }

/* ── Main Layout ── */
.main-wrap { padding:2rem 0 3.5rem; }
.main-layout { display:flex; gap:1.75rem; align-items:flex-start; }
.sidebar-wrap { width:250px; flex-shrink:0; position:sticky; top:86px; }
.form-area { flex:1; min-width:0; }

/* ── Application navigation ── */
.sidebar { background:#fff; border:1px solid var(--border); border-radius:3px; overflow:hidden; }
.sidebar-title { font-size:.7rem; font-weight:600; color:var(--muted); letter-spacing:.07em;
    text-transform:uppercase; padding:.9rem 1.1rem .6rem; border-bottom:1px solid var(--border); }
.sidebar-item { display:flex; align-items:flex-start; gap:11px; padding:.7rem 1.1rem;
    border-left:3px solid transparent; cursor:pointer; transition:background .15s;
    border-bottom:1px solid var(--gray); }
.sidebar-item:hover { background:var(--gray); }
.sidebar-item.active { background:var(--light-blue); border-left-color:var(--blue2); }
/* Step number replaces the old decorative icon tile. */
.sidebar-item .s-num { width:22px; height:22px; border-radius:50%; background:var(--gray);
    border:1px solid var(--border-mid); display:flex; align-items:center; justify-content:center;
    font-size:.72rem; font-weight:500; color:var(--muted); flex-shrink:0; margin-top:1px; }
.sidebar-item.active .s-num { background:var(--blue2); border-color:var(--blue2); color:#fff; }
.sidebar-item.done   .s-num { background:#fff; border-color:var(--blue2); color:var(--blue2); }
.sidebar-item .s-icon { display:none; }
.sidebar-item.active .s-icon { display:none; }
.sidebar-item .s-title { font-size:.84rem; font-weight:500; color:var(--text); line-height:1.35; }
.sidebar-item.active .s-title { color:var(--navy); font-weight:600; }
.sidebar-item .s-desc  { font-size:.74rem; color:var(--muted); }
/* Each item already carries a bottom hairline, so no border-top here. */
.sidebar-tips { padding:.9rem 1.1rem 1rem; background:var(--gray); }
.sidebar-tips .t-head { font-size:.72rem; font-weight:600; color:var(--navy);
    text-transform:uppercase; letter-spacing:.05em; margin-bottom:.5rem; }
.sidebar-tips li { font-size:.78rem; color:var(--muted); margin-bottom:.35rem; line-height:1.45; }

/* ── Form card ── */
.form-card { background:#fff; border:1px solid var(--border); border-radius:3px; padding:1.9rem 2rem 2rem; }
.form-card h3 { font-size:1.15rem; font-weight:600; color:var(--navy); margin-bottom:.3rem; letter-spacing:-.01em; }
.form-card .form-sub { font-size:.86rem; color:var(--muted); margin-bottom:1.6rem;
    padding-bottom:1.1rem; border-bottom:1px solid var(--border); }

/* Grouping inside a step */
.form-section { margin-top:1.75rem; padding-top:1.4rem; border-top:1px solid var(--border); }
.form-section-title { font-size:.82rem; font-weight:600; color:var(--navy);
    text-transform:uppercase; letter-spacing:.05em; margin-bottom:1rem; }

.form-label { display:block; font-size:.81rem; font-weight:500; color:#40485a; margin-bottom:.35rem; }
.form-label .req { color:var(--danger); font-weight:400; margin-left:1px; }
.helper { font-size:.76rem; color:var(--muted); margin-top:.35rem; line-height:1.45; }

.form-control, .form-select { border:1px solid var(--border-mid); border-radius:3px;
    padding:.55rem .75rem; font-size:.88rem; width:100%; min-height:40px; color:var(--text);
    transition:border-color .15s, box-shadow .15s; font-family:inherit;
    background:#fff; -webkit-appearance:none; appearance:none; }
.form-control::placeholder { color:#9aa3b2; }
.form-select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23667085' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right .75rem center; padding-right:2rem; }
.form-select[size] { background-image:none; padding-right:.75rem; }
.form-control:focus, .form-select:focus { border-color:var(--blue2); outline:none;
    box-shadow:0 0 0 3px rgba(28,95,208,.12); }
.form-control:invalid:not(:placeholder-shown) { border-color:#e5a3a3; }

.input-group { display:flex; }
.input-group .prefix { background:var(--gray); border:1px solid var(--border-mid); border-right:none;
    border-radius:3px 0 0 3px; padding:.55rem .7rem; font-size:.82rem; color:var(--muted);
    display:flex; align-items:center; gap:5px; white-space:nowrap; flex-shrink:0; }
.input-group .form-control { border-radius:0 3px 3px 0; }

/* ── Department dropdown ── */
.dept-select-wrap { position:relative; }
.dept-trigger { display:flex; align-items:center; gap:8px; border:1px solid var(--border-mid);
    border-radius:3px; padding:.55rem .75rem; font-size:.88rem; background:#fff;
    cursor:pointer; transition:.15s; min-height:40px; user-select:none; }
.dept-trigger:hover { border-color:var(--muted); }
.dept-trigger:focus { border-color:var(--blue2); box-shadow:0 0 0 3px rgba(28,95,208,.12); outline:none; }
.dept-trigger.has-val { color:var(--navy); }
.dept-dropdown { display:none; position:absolute; top:calc(100% + 3px); left:0; right:0;
    background:#fff; border:1px solid var(--border-mid); border-radius:3px;
    box-shadow:0 4px 14px rgba(16,24,40,.10); z-index:50; overflow:hidden; }
.dept-dropdown.open { display:block; }
.dept-search-row { display:flex; align-items:center; gap:8px; padding:.5rem .75rem;
    border-bottom:1px solid var(--border); background:var(--gray); }
.dept-search-input { border:none; outline:none; font-size:.86rem; flex:1;
    background:transparent; color:var(--text); font-family:inherit; }
.dept-list { max-height:230px; overflow-y:auto; }
.dept-option { padding:.55rem .85rem; font-size:.85rem; color:var(--text); cursor:pointer;
    border-bottom:1px solid var(--gray); transition:.1s; }
.dept-option:last-child { border-bottom:none; }
.dept-option:hover { background:var(--light-blue); }
.dept-option.selected { background:var(--light-blue); color:var(--navy); font-weight:600; }
.dept-option .dept-fee-tag { font-size:.74rem; color:var(--muted); margin-left:6px; }
.dept-option.selected .dept-fee-tag { color:var(--blue2); }
.dept-empty { padding:.85rem 1rem; font-size:.83rem; color:var(--muted); text-align:center; }

/* ── Grids ── */
.form-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:1.15rem 1.25rem; }
.form-grid-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1.15rem 1.25rem; }
.span-2 { grid-column:span 2; }
.span-3 { grid-column:span 3; }

/* ── Step navigation row ── */
.form-nav { display:flex; justify-content:space-between; align-items:center;
    flex-wrap:wrap; gap:.8rem; margin-top:1.9rem; padding-top:1.3rem; border-top:1px solid var(--border); }

/* ── Password requirements ── */
.pw-reqs { margin-top:.5rem; }
.pw-reqs .req { display:flex; align-items:center; gap:7px; font-size:.76rem; color:var(--muted); margin-bottom:.15rem; }
.pw-reqs .req::before { content:""; width:5px; height:5px; border-radius:50%%;
    background:var(--border-mid); flex-shrink:0; transition:background .15s; }
.pw-reqs .req.met { color:var(--success); }
.pw-reqs .req.met::before { background:var(--success); }
.pw-reqs .req i { display:none; }

/* ── Payment methods ── */
.payment-methods { display:flex; gap:.7rem; flex-wrap:wrap; margin:.5rem 0 0; }
.pm-btn { flex:1; min-width:120px; border:1px solid var(--border-mid); border-radius:3px;
    background:#fff; padding:.75rem; display:flex; flex-direction:column; align-items:center;
    gap:.35rem; cursor:pointer; transition:.15s; user-select:none; }
.pm-btn:hover { border-color:var(--muted); }
.pm-btn img { height:30px; object-fit:contain; }
.pm-btn span { font-size:.78rem; color:var(--muted); font-weight:500; }
.pm-btn.selected { border-color:var(--blue2); box-shadow:inset 0 0 0 1px var(--blue2); background:var(--light-blue); }
.pm-btn.selected span { color:var(--navy); }

/* ── Buttons ── */
.btn-primary-app { background:var(--orange); color:#fff; border:1px solid var(--orange); border-radius:3px;
    padding:.6rem 1.5rem; font-size:.87rem; font-weight:500; cursor:pointer; transition:.15s;
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    white-space:nowrap; min-height:40px; font-family:inherit; }
.btn-primary-app:hover { background:var(--orange-dark); border-color:var(--orange-dark); }
.btn-primary-app:disabled { opacity:.6; cursor:not-allowed; }
.btn-outline-app { background:#fff; color:var(--text); border:1px solid var(--border-mid);
    border-radius:3px; padding:.6rem 1.2rem; font-size:.87rem; font-weight:500;
    cursor:pointer; transition:.15s; display:inline-flex; align-items:center; justify-content:center;
    gap:6px; white-space:nowrap; min-height:40px; font-family:inherit; }
.btn-outline-app:hover { border-color:var(--muted); background:var(--gray); }
.btn-outline-app:disabled { opacity:.6; cursor:not-allowed; }

/* ── Review ── */
.review-section { border:1px solid var(--border); border-radius:3px; padding:1.1rem 1.25rem; margin-bottom:1rem; }
.review-section h5 { font-size:.76rem; font-weight:600; color:var(--muted);
    text-transform:uppercase; letter-spacing:.06em; margin-bottom:.8rem;
    padding-bottom:.55rem; border-bottom:1px solid var(--border); }
.review-row { display:flex; gap:1rem; margin-bottom:.45rem; font-size:.85rem; }
.review-row .rv-label { color:var(--muted); min-width:150px; flex-shrink:0; }
.review-row .rv-value { color:var(--text); font-weight:500; }

/* ── Bottom information row ── */
.bottom-row { padding:2.25rem 0; background:#fff; border-top:1px solid var(--border); }
.bottom-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0; }
.bottom-card { padding:0 2rem; border-right:1px solid var(--border); }
.bottom-card:first-child { padding-left:0; }
.bottom-card:last-child { border-right:none; padding-right:0; }
.bottom-card h5 { font-size:.78rem; font-weight:600; color:var(--navy); margin-bottom:1rem;
    text-transform:uppercase; letter-spacing:.06em; }
.steps-list .step-li { display:flex; align-items:flex-start; gap:10px; margin-bottom:.7rem; }
.steps-list .step-num { width:21px; height:21px; border-radius:50%; background:var(--gray);
    border:1px solid var(--border-mid); color:var(--muted); font-size:.7rem; font-weight:500;
    display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:1px; }
.steps-list .step-num.done { background:var(--blue2); border-color:var(--blue2); color:#fff; }
.steps-list .step-text strong { font-size:.83rem; font-weight:500; color:var(--text); display:block; }
.steps-list .step-text small { font-size:.76rem; color:var(--muted); }
.pm-logos { display:flex; gap:.7rem; margin-bottom:.9rem; flex-wrap:wrap; align-items:center; }
.pm-logos img { height:38px; border:1px solid var(--border); border-radius:3px; padding:5px; background:#fff; }
.secure-note { font-size:.76rem; color:var(--muted); margin-top:.85rem;
    padding-top:.7rem; border-top:1px solid var(--border); }
.why-item { margin-bottom:.85rem; padding-left:.85rem; border-left:2px solid var(--border); }
.why-icon { display:none; }
.why-title { font-size:.83rem; font-weight:600; color:var(--navy); }
.why-desc  { font-size:.77rem; color:var(--muted); line-height:1.45; }

/* ── Enquiries strip (was the promotional CTA band) ── */
.cta-section { background:var(--navy); color:#fff; padding:1.5rem 0; }
.cta-inner { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1.25rem; }
.cta-section h3 { font-size:1rem; font-weight:600; }
.cta-section p  { color:#c8d6ef; font-size:.85rem; margin-top:.15rem; }
.btn-cta { background:transparent; color:#fff; border:1px solid rgba(255,255,255,.45); border-radius:3px;
    padding:.55rem 1.3rem; font-weight:500; cursor:pointer; font-size:.86rem;
    display:inline-flex; align-items:center; gap:8px; flex-shrink:0; font-family:inherit; }
.btn-cta:hover { background:rgba(255,255,255,.1); border-color:#fff; }

/* ── Footer ── */
footer { background:#08224a; color:#93a7c9; padding:2.5rem 0 0; font-size:.85rem; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.5fr; gap:2.25rem; }
footer .f-brand { font-size:.95rem; font-weight:600; color:#fff; letter-spacing:.02em; }
footer .f-sub   { font-size:.75rem; color:#7a90b6; margin-top:.1rem; }
footer .f-desc  { font-size:.8rem; color:#7a90b6; margin:.7rem 0 1rem; line-height:1.6; }
footer .f-social a { display:inline-flex; align-items:center; justify-content:center;
    width:28px; height:28px; border-radius:2px; border:1px solid rgba(255,255,255,.18);
    color:#93a7c9; font-size:.75rem; margin-right:6px; }
footer .f-social a:hover { border-color:#fff; color:#fff; }
footer h6 { color:#fff; font-size:.78rem; font-weight:600; margin-bottom:.85rem;
    text-transform:uppercase; letter-spacing:.06em; }
footer ul { list-style:none; }
footer ul li { margin-bottom:.45rem; }
footer ul li a { font-size:.8rem; color:#7a90b6; }
footer ul li a:hover { color:#fff; }
footer .contact-item { display:flex; align-items:flex-start; gap:8px; font-size:.8rem;
    color:#7a90b6; margin-bottom:.5rem; line-height:1.5; }
footer .contact-item i { color:#5d7bad; margin-top:3px; flex-shrink:0; font-size:.75rem; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.08); padding:.9rem 0; margin-top:1.75rem;
    font-size:.75rem; color:#6c84af; }
.footer-bottom-inner { display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5rem; }

/* ── Toast ── */
.app-toast { position:fixed; top:84px; right:20px; z-index:9999; min-width:280px; max-width:380px;
    background:#fff; border:1px solid var(--border); border-radius:3px;
    box-shadow:0 6px 20px rgba(16,24,40,.12);
    padding:.85rem 1rem; display:none; border-left:3px solid var(--blue2); }
.app-toast.show { display:flex; align-items:flex-start; gap:10px; animation:slideIn .25s ease; }
.app-toast.error   { border-left-color:var(--danger); }
.app-toast.success { border-left-color:var(--success); }
@keyframes slideIn { from { opacity:0; transform:translateY(-8px); } to { opacity:1; transform:translateY(0); } }

/* ── Payment pending modal ── */
.pay-overlay { position:fixed; inset:0; background:rgba(16,24,40,.55); z-index:200;
    display:none; align-items:center; justify-content:center; padding:1rem; }
.pay-overlay.show { display:flex; }
.pay-modal { background:#fff; border-radius:4px; padding:1.9rem; max-width:420px; width:100%;
    text-align:center; box-shadow:0 12px 40px rgba(16,24,40,.2); }
.pay-modal .pm-icon { display:none; }
.pay-modal h4 { font-size:1.05rem; font-weight:600; color:var(--navy); margin-bottom:.6rem; }
.pay-modal p { font-size:.86rem; color:var(--muted); line-height:1.6; }
.pay-modal .btn-row { display:flex; gap:.7rem; justify-content:center; margin-top:1.4rem; flex-wrap:wrap; }

/* ── Spinner ── */
.spinner { display:inline-block; width:15px; height:15px; border:2px solid rgba(255,255,255,.45);
    border-top-color:#fff; border-radius:50%; animation:spin .7s linear infinite; }
.spinner.dark { border-color:rgba(16,24,40,.15); border-top-color:var(--navy); }
@keyframes spin { to { transform:rotate(360deg); } }

/* ── Fee / reference summary ── */
.ref-box { background:var(--gray); border:1px solid var(--border); border-radius:3px; padding:1.1rem 1.25rem;
    margin-bottom:1.5rem; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:.8rem; }
.ref-box .amount-label { font-size:.72rem; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; font-weight:600; }
.ref-box .amount-val   { font-size:1.4rem; font-weight:600; color:var(--navy); margin-top:.1rem; }
.ref-box .amount-note  { font-size:.75rem; color:var(--muted); }
.ref-box .ref-label    { font-size:.72rem; color:var(--muted); text-align:right; text-transform:uppercase; letter-spacing:.06em; font-weight:600; }
.ref-box .ref-val      { font-size:.95rem; font-weight:600; color:var(--navy); font-family:'Consolas',monospace; text-align:right; margin-top:.1rem; }

/* ── Notices ── */
.notice { border:1px solid var(--warn-border); background:var(--warn-bg); border-radius:3px;
    padding:.85rem 1rem; font-size:.82rem; color:var(--warn-text); line-height:1.55; }
.notice strong { font-weight:600; }
.notice-title { font-weight:600; margin-bottom:.3rem; }

/* ─────────────────────────────────────────────
   RESPONSIVE
───────────────────────────────────────────── */

/* ── Tablet (≤992px) ── */
@media (max-width:992px) {
    .sidebar-wrap { display:none; }
    .form-grid-3 { grid-template-columns:1fr 1fr; }
    .span-3 { grid-column:span 2; }
    .footer-grid { grid-template-columns:1fr 1fr; gap:1.75rem; }
    .bottom-grid { grid-template-columns:1fr; }
    .bottom-card { border-right:none; border-bottom:1px solid var(--border);
        padding:1.25rem 0; }
    .bottom-card:first-child { padding-top:0; }
    .bottom-card:last-child { border-bottom:none; padding-bottom:0; }
    .step-box { width:88px; }
    .step-connector { width:22px; }
    .step-label .step-desc { display:none; }
    .form-card { padding:1.6rem 1.5rem; }
}

/* ── Mobile (≤768px) ── */
@media (max-width:768px) {
    .top-bar-contacts .loc { display:none; }

    .nav-links { display:none; }
    .hamburger { display:flex; }

    .hero { min-height:180px; }
    .hero-content { padding:2rem 0; }
    .hero-content h1 { font-size:1.35rem; }
    .hero-content p.sub { font-size:.87rem; }
    .hero-content p.tag { font-size:.7rem; }

    /* Step indicator: circles only */
    .steps-bar { padding:.85rem 0 .7rem; }
    .step-box { width:40px; }
    .step-connector { width:12px; margin-top:13px; }
    .step-label { display:none; }
    .step-circle { width:26px; height:26px; font-size:.75rem; }
    .mobile-step-label { display:block; }

    /* Information strip: 2×2 */
    .info-banner-row { display:grid; grid-template-columns:1fr 1fr; }
    .info-card { border-right:none; border-bottom:1px solid var(--border); min-width:0;
        padding:.85rem 1rem; }
    .info-card:first-child { padding-left:1rem; }
    .info-card:nth-child(odd)  { border-right:1px solid var(--border); }
    .info-card:nth-child(3),
    .info-card:nth-child(4)   { border-bottom:none; }

    .main-wrap { padding:1.25rem 0 2.5rem; }
    .main-layout { flex-direction:column; }
    .form-area { width:100%; }

    .form-card { padding:1.25rem 1.15rem 1.4rem; }
    .form-card h3 { font-size:1.05rem; }
    .form-card .form-sub { margin-bottom:1.25rem; padding-bottom:.9rem; }

    .form-grid-2, .form-grid-3 { grid-template-columns:1fr; gap:1rem; }
    .span-2, .span-3 { grid-column:span 1; }

    .form-nav { flex-direction:column-reverse; align-items:stretch; }
    .form-nav .btn-primary-app,
    .form-nav .btn-outline-app { width:100%; }

    .payment-methods { gap:.5rem; }
    .pm-btn { padding:.6rem .4rem; min-width:0; }

    .review-row { flex-direction:column; gap:.1rem; }
    .review-row .rv-label { min-width:unset; font-size:.76rem; }
    .review-row .rv-value { font-size:.85rem; }

    .cta-inner { flex-direction:column; text-align:center; }
    .btn-cta { width:100%; justify-content:center; }

    .footer-grid { grid-template-columns:1fr; gap:1.5rem; }
    .footer-bottom-inner { flex-direction:column; gap:.3rem; text-align:center; }

    .app-toast { left:10px; right:10px; min-width:unset; max-width:unset; top:72px; }

    .bottom-grid { grid-template-columns:1fr; }
}

/* ── Small mobile (≤480px) ── */
@media (max-width:480px) {
    .container { padding:0 .9rem; }

    .top-bar-inner { justify-content:center; }
    .top-bar-contacts { justify-content:center; font-size:.73rem; gap:.8rem; }
    .top-bar .social { display:none; }

    .nav-logo img { height:38px; }
    .nav-logo .brand-name { font-size:.92rem; }
    .nav-logo .brand-sub { font-size:.68rem; }

    .hero-content h1 { font-size:1.2rem; }

    .info-card { padding:.7rem .8rem; }
    .info-card:first-child { padding-left:.8rem; }
    .info-card .val { font-size:.85rem; }

    .form-card { padding:1.1rem 1rem 1.25rem; }
    .ref-box { flex-direction:column; align-items:flex-start; }
    .ref-box .ref-label, .ref-box .ref-val { text-align:left; }

    .btn-primary-app, .btn-outline-app { padding:.55rem 1rem; font-size:.85rem; }

    .pay-modal { padding:1.4rem 1.15rem; }
}