:root {
  --request-navy: #0b2545;
  --request-gold: #b08d3e;
  --request-bg: #f6f8fb;
  --request-card: #fff;
  --request-border: #e3e8ef;
  --request-muted: #64748b;
  --request-info: #3575a8;
  --request-info-bg: #edf6fc;
  --request-success: #2d8f6e;
  --request-shadow: 0 16px 38px rgba(11, 37, 69, .07);
}
.service-request-page { background: var(--request-bg); overflow-x: hidden; }
.service-request-content { width: min(100%, 1420px); margin: 0 auto; padding: 28px clamp(14px, 3vw, 40px) 56px; }
.request-intro { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:24px; }
.request-breadcrumb { display:flex; flex-wrap:wrap; gap:8px; color:var(--request-muted); font-size:.78rem; margin-bottom:12px; }
.request-breadcrumb a:hover { color:var(--request-gold); }
.request-intro h2 { margin:0; color:var(--request-navy); font-family:Morabba, Dana, sans-serif; font-size:clamp(1.65rem, 3vw, 2.4rem); line-height:1.35; }
.request-intro p { margin:8px 0 0; color:var(--request-muted); font-size:.94rem; line-height:1.9; }
.request-back { display:inline-flex; align-items:center; gap:8px; color:var(--request-navy); font-size:.86rem; font-weight:700; white-space:nowrap; }
.request-back:hover { color:var(--request-gold); }
.request-progress { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); margin-bottom:24px; padding:16px 20px; border:1px solid var(--request-border); border-radius:16px; background:#fff; box-shadow:var(--request-shadow); }
.request-step { display:flex; align-items:center; gap:10px; min-width:0; color:#a0acba; }
.request-step:not(:last-child)::after { content:""; height:1px; flex:1; margin:0 12px; background:#e7ebf0; }
.request-step.is-active { color:var(--request-navy); }
.request-step__number { display:grid; place-items:center; width:32px; height:32px; flex:none; border:1px solid currentColor; border-radius:50%; font-size:.75rem; font-weight:800; }
.request-step.is-active .request-step__number { border-color:var(--request-gold); background:var(--request-gold); color:#fff; box-shadow:0 6px 14px rgba(176,141,62,.2); }
.request-step__label { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.82rem; font-weight:700; }
.request-layout { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:22px; align-items:start; }
.request-main { display:grid; gap:18px; min-width:0; }
.request-card, .request-summary { border:1px solid var(--request-border); border-radius:18px; background:var(--request-card); box-shadow:var(--request-shadow); }
.request-card { padding:clamp(18px, 2.4vw, 28px); }
.request-card__heading, .summary-heading { display:flex; align-items:flex-start; gap:12px; margin-bottom:20px; }
.request-card__heading h3, .summary-heading h3 { margin:0; color:var(--request-navy); font-size:1.08rem; }
.request-card__heading p { margin:5px 0 0; color:var(--request-muted); font-size:.82rem; line-height:1.8; }
.request-icon { display:grid; place-items:center; width:42px; height:42px; flex:none; border-radius:12px; background:rgba(176,141,62,.12); color:var(--request-gold); font-size:1.2rem; }
.service-hero { display:flex; align-items:center; gap:14px; padding-bottom:22px; margin-bottom:20px; border-bottom:1px solid #edf0f4; }
.service-hero__copy { min-width:0; }
.service-hero__category { color:var(--request-gold); font-size:.78rem; font-weight:700; }
.service-hero h3 { margin:5px 0 0; color:var(--request-navy); font-size:clamp(1.1rem,2vw,1.35rem); overflow-wrap:anywhere; }
.type-badge { display:inline-flex; align-items:center; gap:6px; margin-right:auto; padding:7px 10px; border-radius:999px; font-size:.72rem; font-weight:700; white-space:normal; text-align:center; }
.type-badge.fixed { color:var(--request-success); background:#eaf7f1; }
.type-badge.review { color:var(--request-info); background:var(--request-info-bg); }
.service-meta { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.meta-item dt { margin-bottom:5px; color:var(--request-muted); font-size:.76rem; }
.meta-item dd { margin:0; color:var(--request-navy); font-size:.91rem; font-weight:700; overflow-wrap:anywhere; }
.service-description { margin-top:20px; padding-top:18px; border-top:1px solid #edf0f4; }
.service-description h4 { margin:0 0 8px; color:var(--request-navy); font-size:.85rem; }
.service-description p { margin:0; color:#526173; font-size:.88rem; line-height:2; }
.request-form-card.review-mode { border-color:rgba(53,117,168,.34); box-shadow:0 16px 38px rgba(53,117,168,.09); }
.request-form label { display:block; margin-bottom:9px; color:var(--request-navy); font-size:.9rem; font-weight:800; }
.request-form textarea { display:block; width:100%; min-height:210px; padding:15px; border:1px solid #d6dee8; border-radius:13px; outline:none; resize:vertical; background:#fbfcfe; color:var(--request-navy); direction:rtl; font:inherit; font-size:.9rem; line-height:2; transition:border-color .2s, box-shadow .2s, background .2s; }
.request-form textarea::placeholder { color:#9aa7b5; }
.request-form textarea:focus { border-color:var(--request-gold); background:#fff; box-shadow:0 0 0 4px rgba(176,141,62,.12); }
.request-form textarea[aria-invalid=true] { border-color:#c45c5c; box-shadow:0 0 0 4px rgba(196,92,92,.1); }
.form-footer { display:flex; justify-content:space-between; gap:12px; margin-top:9px; color:var(--request-muted); font-size:.74rem; }
.form-error { color:#b34f4f; }
.review-callout, .fixed-callout { display:flex; gap:12px; padding:15px; border-radius:13px; font-size:.82rem; line-height:1.9; }
.review-callout { color:#285d83; background:var(--request-info-bg); }
.fixed-callout { color:#36745e; background:#eff9f4; }
.review-callout strong, .fixed-callout strong { display:block; color:var(--request-navy); }
.request-summary { position:sticky; top:108px; padding:22px; }
.summary-heading { align-items:center; padding-bottom:17px; border-bottom:1px solid #edf0f4; }
.summary-heading .request-icon { width:38px; height:38px; }
.summary-list { display:grid; gap:15px; margin:18px 0; }
.summary-row { display:grid; gap:5px; min-width:0; }
.summary-row span { color:var(--request-muted); font-size:.76rem; }
.summary-row strong { color:var(--request-navy); font-size:.88rem; overflow-wrap:anywhere; }
.summary-price { margin:18px 0; padding:16px; border-radius:13px; background:linear-gradient(135deg,#f8f2e6,#fffaf1); }
.summary-price span { display:block; color:var(--request-muted); font-size:.75rem; }
.summary-price strong { display:block; margin-top:5px; color:var(--request-navy); font-size:1.05rem; line-height:1.8; overflow-wrap:anywhere; }
.summary-note { margin:0 0 18px; color:var(--request-muted); font-size:.77rem; line-height:1.9; }
.submit-button { display:flex; align-items:center; justify-content:center; gap:9px; width:100%; min-height:50px; padding:0 16px; border:0; border-radius:12px; background:linear-gradient(135deg,#0b2545,#153d67); color:#fff; font:inherit; font-size:.9rem; font-weight:800; box-shadow:0 12px 24px rgba(11,37,69,.18); transition:transform .2s, box-shadow .2s, opacity .2s; }
.submit-button:hover:not(:disabled), .submit-button:focus-visible:not(:disabled) { transform:translateY(-2px); box-shadow:0 16px 28px rgba(11,37,69,.24); outline:none; }
.submit-button:disabled { cursor:not-allowed; opacity:.58; box-shadow:none; }
.spinner { width:17px; height:17px; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; border-radius:50%; animation:spin .8s linear infinite; }
.state-card { padding:48px 24px; text-align:center; border:1px solid var(--request-border); border-radius:18px; background:#fff; box-shadow:var(--request-shadow); }
.state-card h2 { margin:0 0 8px; color:var(--request-navy); font-size:1.2rem; }
.state-card p { margin:0 0 20px; color:var(--request-muted); line-height:1.9; }
.state-card a { display:inline-flex; align-items:center; min-height:44px; padding:0 18px; border-radius:10px; background:var(--request-navy); color:#fff; }

/* Documents & Payment specific */
.document-card { padding:16px; display:block; }
.document-card .doc-description { color:var(--request-muted); margin-top:6px; }
.document-card .doc-meta div { margin-top:6px; color:var(--request-muted); font-size:.88rem; }
.document-card .button-secondary { background:#f3f4f6; color:var(--request-navy); border-radius:10px; padding:8px 12px; border:1px solid var(--request-border); }
.document-card .submit-button { min-width:120px; }
.document-card[data-uploaded="1"] { border:1px solid rgba(45,143,110,.12); box-shadow:0 8px 22px rgba(45,143,110,.04); }
.document-card[data-uploaded="1"] .request-icon { background:rgba(45,143,110,.12); color:var(--request-success); }

/* disabled proceed button */
.submit-button.disabled, .submit-button[aria-disabled="true"] { opacity:.6; pointer-events:none; filter:grayscale(.05); }
@keyframes spin { to { transform:rotate(360deg); } }
@media (max-width: 1050px) { .request-layout { grid-template-columns:minmax(0,1fr) 300px; } }
@media (max-width: 820px) { .request-layout { grid-template-columns:1fr; } .request-summary { position:static; order:2; } .request-intro { align-items:flex-start; flex-direction:column; gap:12px; } }
@media (max-width: 520px) { .service-request-content { padding:20px 12px 40px; } .request-progress { padding:12px 9px; gap:4px; } .request-step { display:block; text-align:center; } .request-step:not(:last-child)::after { display:block; width:100%; margin:8px 0 0; } .request-step__number { margin:0 auto 5px; width:28px; height:28px; } .request-step__label { display:block; font-size:.68rem; white-space:normal; line-height:1.5; } .request-card, .request-summary { border-radius:14px; padding:16px; } .service-hero { align-items:flex-start; flex-wrap:wrap; } .type-badge { margin-right:0; } .service-meta { grid-template-columns:1fr; gap:12px; } .request-form textarea { min-height:190px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; } }

/* Enhanced hero, typography, cards and responsive tweaks */
.service-hero { align-items:center; gap:20px; }
.service-hero__category { font-size:.9rem; letter-spacing:.2px; }
.service-hero h1, .service-hero h3 { margin:0; }

.hero-visual { width:84px; height:84px; border-radius:16px; display:grid; place-items:center; background:linear-gradient(135deg, rgba(11,37,69,0.06), rgba(176,141,62,0.06)); box-shadow:0 12px 30px rgba(11,37,69,.06); }

.service-hero__meta { color:var(--request-muted); font-size:.95rem; }

.service-description { margin-top:18px; color:#3b4a57; line-height:1.95; font-size:1rem; }
.service-description h4 { font-size:1.05rem; margin-bottom:8px; }

.cta-row { display:flex; gap:12px; align-items:center; }
.cta-row .submit-button { min-height:48px; padding:0 20px; border-radius:12px; font-size:1rem; }
.cta-row .button-secondary { background:transparent; border:1px solid var(--request-border); padding:10px 16px; border-radius:12px; }

.document-card { transition:transform .18s ease, box-shadow .18s ease; }
.document-card:hover { transform:translateY(-4px); box-shadow:0 10px 30px rgba(11,37,69,.06); }

.request-summary { padding:22px; border-radius:16px; }
.summary-list .summary-row { padding:10px 0; border-bottom:1px dashed #eef3f7; }
.summary-list .summary-row:last-child { border-bottom:none; }

.type-badge { font-size:.82rem; padding:8px 12px; border-radius:999px; }
.type-badge.fixed { background:linear-gradient(90deg,#eaf7f1,#f3fff9); color:var(--request-success); }
.type-badge.review { background:linear-gradient(90deg,#eef7fd,#f8fbff); color:var(--request-info); }

/* Responsive stack and tweaks */
@media (max-width: 1050px) { .request-layout { grid-template-columns:1fr 320px; } }
@media (max-width: 880px) {
  .request-layout { grid-template-columns:1fr; }
  .request-summary { position:static; order:2; margin-top:18px; }
  .service-hero { flex-direction:column; align-items:flex-start; gap:12px; }
  .cta-row { width:100%; }
}
@media (max-width:520px){
  .service-hero__copy h1 { font-size:1.25rem; }
  .service-description { font-size:.98rem; }
  .cta-row .submit-button { width:100%; }
}
