/* 📬 صفحة «اطلب خدمتك» العامة — ألوان الهوية النشطة (--idc) + ذهبي */
@font-face{font-family:'Cairo';src:url(/fonts/Cairo-Variable.ttf) format('truetype');font-weight:200 1000;font-display:swap}
@font-face{font-family:'Tajawal';src:url(/fonts/Tajawal-Medium.ttf) format('truetype');font-weight:400 500;font-display:swap}
@font-face{font-family:'Tajawal';src:url(/fonts/Tajawal-Bold.ttf) format('truetype');font-weight:600 700;font-display:swap}
@font-face{font-family:'Tajawal';src:url(/fonts/Tajawal-ExtraBold.ttf) format('truetype');font-weight:800;font-display:swap}
@font-face{font-family:'Tajawal';src:url(/fonts/Tajawal-Black.ttf) format('truetype');font-weight:900;font-display:swap}
:root{--gold:#c9a24a;--gold-d:#8a6516;--gold-l:#fbf3dc;--ink:#132a1e;--muted:#5f7068;--line:#e2ebe5;--bg:#f5f8f6;--err:#c62828;--wa:#1faa59}
.ct{--idc:#0f4d2c;--idc-d:color-mix(in srgb,var(--idc) 70%,#000);--idc-l:color-mix(in srgb,var(--idc) 9%,#fff)}
*{box-sizing:border-box}
html,body{margin:0}
body{overflow-x:clip;font-family:'Tajawal','Cairo',system-ui,sans-serif;background:var(--bg);color:var(--ink);line-height:1.6;-webkit-tap-highlight-color:transparent;min-height:100vh}
[hidden]{display:none!important}
body::before{content:"";position:fixed;inset:0;z-index:-1;opacity:.6;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cpath d='M32 6l5 13 13 5-13 5-5 13-5-13-13-5 13-5z' fill='%23c9a24a' fill-opacity='.07'/%3E%3C/svg%3E")}

/* ---------- الرأس ---------- */
.ct-hero{position:relative;color:#fff;text-align:center;padding:22px 16px 74px;overflow:hidden;
  background:radial-gradient(circle at 85% -10%,color-mix(in srgb,var(--idc) 50%,#4fbf85) 0,transparent 55%),radial-gradient(circle at 0 110%,rgba(201,162,74,.28) 0,transparent 45%),linear-gradient(160deg,color-mix(in srgb,var(--idc) 85%,#fff 6%),var(--idc) 50%,var(--idc-d));
  border-radius:0 0 34px 34px;box-shadow:0 12px 34px rgba(10,50,30,.22)}
.ct-band{position:absolute;top:0;left:0;right:0;height:7px;background:linear-gradient(90deg,#a57a22,#f3d27a,#a57a22)}
.ct-hero-in{position:relative;max-width:640px;margin:0 auto}
.ct-brand{display:flex;justify-content:center;margin:8px 0 6px}
.ct-logo{width:92px;height:92px;border-radius:50%;background:#fff;padding:5px;border:3px solid var(--gold);box-shadow:0 0 0 5px rgba(201,162,74,.22),0 10px 24px rgba(0,0,0,.25)}
.ct-logo img{width:100%;height:100%;object-fit:contain;border-radius:50%;display:block}
.ct-wide{display:none;background:#fff;border-radius:22px;padding:10px 18px;box-shadow:0 0 0 4px rgba(201,162,74,.35),0 12px 28px rgba(0,0,0,.25)}
.ct-wide img{display:block;width:150px;height:auto}
.ct-brand.has-wide .ct-logo{display:none}.ct-brand.has-wide .ct-wide{display:block}
.ct-brand.has-wide ~ .ct-name{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ct-name{font-family:Cairo;font-weight:900;font-size:1.7rem;letter-spacing:.4px;line-height:1.3;margin-top:4px}
.ct-name .g{color:#f3d27a}
.ct-sub{margin:8px auto 0;font-weight:800;font-size:.92rem;color:#fbe7a6;display:inline-block;padding:4px 14px;border-radius:99px;background:rgba(0,0,0,.16);border:1px solid rgba(243,210,122,.35);line-height:1.6}
.ct-title{font-family:Cairo;font-weight:900;font-size:clamp(1.8rem,8vw,2.5rem);margin:14px 0 2px;line-height:1.3;text-shadow:0 4px 14px rgba(0,0,0,.25)}
.ct-lead{margin:2px auto 0;max-width:470px;font-weight:600;opacity:.95;font-size:1rem}

/* ---------- المحتوى ---------- */
.ct-wrap{max-width:640px;margin:-50px auto 0;padding:0 14px 26px;position:relative;z-index:2}
.ct-card{background:#fff;border-radius:24px;box-shadow:0 12px 34px rgba(10,50,30,.10);padding:20px 16px;margin-bottom:16px;border-top:5px solid var(--gold)}
.ct-quick{background:#fff;border-radius:22px;box-shadow:0 12px 34px rgba(10,50,30,.10);padding:14px;margin-bottom:16px}
.ct-quick-t{margin:0 0 10px;font-weight:800;color:var(--idc);text-align:center;font-size:.95rem}
.ct-wa-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ct-wa{display:flex;align-items:center;gap:9px;text-decoration:none;color:#fff;background:linear-gradient(135deg,#2bd46a,#128c4a);border-radius:16px;padding:10px 11px;box-shadow:0 8px 18px rgba(18,140,74,.28);transition:transform .12s,box-shadow .2s;min-width:0}
.ct-wa:active{transform:scale(.98)}
.ct-wa:hover{box-shadow:0 10px 22px rgba(18,140,74,.4)}
.ct-wa b{display:block;font-size:.92rem;font-weight:900;line-height:1.35}
.ct-wa i{font-style:normal;display:block;font-size:.72rem;font-weight:800;opacity:.9;line-height:1.2}
.ct-wa small{display:block;font-size:.76rem;font-weight:700;opacity:.92;text-align:right;unicode-bidi:plaintext}
.ct-wa-ic{flex:0 0 auto;width:30px;height:30px;border-radius:50%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%2325d366' d='M16 3C8.8 3 3 8.7 3 15.8c0 2.5.7 4.9 2 7L3 29l6.4-2c2 1.1 4.3 1.7 6.6 1.7 7.2 0 13-5.7 13-12.8S23.2 3 16 3z'/%3E%3Cpath fill='%23fff' d='M12.1 9.6c-.3-.6-.6-.6-.9-.6h-.8c-.3 0-.7.1-1.1.5-.4.4-1.4 1.4-1.4 3.4s1.5 3.9 1.7 4.2c.2.3 2.8 4.5 7 6.1 3.5 1.4 4.2 1.1 4.9 1 .8-.1 2.4-1 2.8-1.9.3-.9.3-1.7.2-1.9-.1-.2-.4-.3-.8-.5s-2.4-1.2-2.8-1.3c-.4-.1-.6-.2-.9.2-.3.4-1 1.3-1.3 1.6-.2.3-.5.3-.9.1-.4-.2-1.7-.6-3.2-2-1.2-1-2-2.3-2.2-2.7-.2-.4 0-.6.2-.8l.6-.7c.2-.2.3-.4.4-.7.1-.3.1-.5 0-.7l-1.5-3z'/%3E%3C/svg%3E") center/22px no-repeat}
.ct-h{font-family:Cairo;font-weight:900;font-size:1.12rem;color:var(--idc);margin:4px 0 12px;display:flex;align-items:center;flex-wrap:wrap;gap:8px;line-height:1.4}
.ct-h small{font-family:Tajawal;font-weight:700;color:var(--muted);font-size:.8rem}
.ct-step{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#e2bd61,#b38a2c);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:.95rem;flex:0 0 auto;box-shadow:0 3px 8px rgba(160,120,20,.3)}
.ct-h:not(:first-child){margin-top:24px;padding-top:18px;border-top:1.5px dashed var(--line)}

/* بطاقات الخدمات */
.ct-svcs{display:grid;gap:10px}
.svc{display:block;cursor:pointer;position:relative}
.svc input{position:absolute;opacity:0;width:1px;height:1px}
.svc-in{display:flex;align-items:center;gap:12px;padding:12px;border-radius:18px;border:2px solid var(--line);background:linear-gradient(170deg,#fff,#fafcfb);transition:border-color .15s,box-shadow .15s,background .15s,transform .1s}
.svc:hover .svc-in{border-color:color-mix(in srgb,var(--gold) 60%,var(--line))}
.svc:active .svc-in{transform:scale(.99)}
.svc-ic{flex:0 0 auto;width:50px;height:50px;border-radius:15px;display:flex;align-items:center;justify-content:center;font-size:1.65rem;background:var(--idc-l);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--idc) 14%,#fff)}
.svc-tx{flex:1;min-width:0}
.svc-tx b{display:block;font-family:Cairo;font-weight:800;font-size:1rem;line-height:1.4;color:var(--ink)}
.svc-tx small{display:block;color:var(--muted);font-weight:600;font-size:.82rem;line-height:1.5}
.svc-ck{flex:0 0 auto;width:26px;height:26px;border-radius:9px;border:2px solid #c9d6ce;background:#fff;position:relative;transition:all .15s}
.svc input:checked + .svc-in{border-color:var(--idc);background:linear-gradient(170deg,#fff,var(--idc-l));box-shadow:0 8px 20px color-mix(in srgb,var(--idc) 18%,transparent)}
.svc input:checked + .svc-in .svc-ck{background:var(--idc);border-color:var(--idc)}
.svc input:checked + .svc-in .svc-ck::after{content:"";position:absolute;left:8px;top:3px;width:6px;height:12px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
.svc input:checked + .svc-in .svc-ic{background:linear-gradient(135deg,#f6e3a9,#e3bf63)}
.svc input:focus-visible + .svc-in{outline:3px solid color-mix(in srgb,var(--gold) 70%,#fff);outline-offset:2px}
.ct-pkg{margin:-4px 8px 4px;padding:10px 12px;border-radius:0 0 16px 16px;background:var(--gold-l);border:1.5px solid #efdca6;border-top:0}
.ct-pkg-t{display:block;font-weight:900;color:var(--gold-d);font-size:.88rem;margin-bottom:6px}
.ct-pkg-t small{font-weight:700;color:#9a7b35}

/* الحقول */
.fld{margin-bottom:14px}
.fld>label,.fld .lbl{display:block;font-weight:800;margin-bottom:6px;font-size:.95rem}
.fld small{font-weight:600;color:var(--muted);font-size:.8rem}
.req{color:var(--err)}
input[type=text],input[type=tel],textarea,select{width:100%;font:inherit;font-size:1rem;font-weight:600;color:var(--ink);background:#fbfdfc;border:2px solid var(--line);border-radius:14px;padding:11px 13px;outline:none;transition:border-color .15s,box-shadow .15s}
textarea{resize:vertical;min-height:96px;line-height:1.7}
select{appearance:none;-webkit-appearance:none;background:#fbfdfc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%235f7068' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat 14px center/12px 8px;padding-left:36px}
input:focus,textarea:focus,select:focus{border-color:var(--idc);box-shadow:0 0 0 4px color-mix(in srgb,var(--idc) 13%,transparent);background-color:#fff}
.invalid{border-color:var(--err)!important;box-shadow:0 0 0 4px rgba(198,40,40,.1)!important}
.hint{display:block;color:var(--muted);font-size:.8rem;font-weight:600;margin-top:5px}
.hint.cnt{text-align:left}
.grid2{display:grid;gap:0 12px}
@media(min-width:560px){.grid2{grid-template-columns:1fr 1fr}}
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:8px}
.seg label{cursor:pointer;position:relative}
.seg input,.chip input{position:absolute;opacity:0;width:1px;height:1px}
.seg span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;text-align:center;padding:7px 4px;border-radius:13px;border:2px solid var(--line);background:#fff;font-weight:800;font-size:.84rem;line-height:1.35;min-height:52px;transition:all .15s}
.seg i{font-style:normal;font-size:.78rem;color:var(--muted);font-weight:800}
.seg input:checked + span{border-color:var(--idc);background:var(--idc-l);color:var(--idc)}
.seg input:checked + span i{color:var(--idc)}
.seg input:focus-visible + span,.chip input:focus-visible + span{outline:3px solid color-mix(in srgb,var(--gold) 70%,#fff);outline-offset:1px}
.ph-box{display:flex;align-items:stretch;direction:ltr;border:2px solid var(--line);border-radius:14px;background:#fbfdfc;overflow:hidden;transition:border-color .15s,box-shadow .15s}
.ph-box:focus-within{border-color:var(--idc);box-shadow:0 0 0 4px color-mix(in srgb,var(--idc) 13%,transparent);background:#fff}
.ph-box.invalid{border-color:var(--err)}
.ph-cc{display:flex;align-items:center;padding:0 12px;background:var(--idc-l);color:var(--idc);font-weight:900;border-right:2px solid var(--line);font-size:1rem}
.ph-box input{border:0!important;box-shadow:none!important;border-radius:0;background:transparent;letter-spacing:.5px;text-align:left}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{cursor:pointer;position:relative}
.chip span{display:inline-block;padding:7px 13px;border-radius:99px;border:2px solid var(--line);background:#fff;font-weight:800;font-size:.88rem;transition:all .15s}
.chip input:checked + span{border-color:var(--idc);background:var(--idc);color:#fff}
.ct-pkg .chip input:checked + span{border-color:var(--gold-d);background:linear-gradient(135deg,#d9b55b,#a57a22)}
.hp{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;opacity:0;pointer-events:none}
.ct-err{color:var(--err);font-weight:800;font-size:.86rem;margin-top:6px}
.ct-err.big{background:#fdecea;border-radius:12px;padding:9px 12px;text-align:center}
.ct-submit{width:100%;font-family:Cairo;font-weight:900;font-size:1.18rem;border:0;border-radius:18px;padding:15px;color:#fff;cursor:pointer;margin-top:6px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--idc) 80%,#2a9d62),var(--idc) 60%,var(--idc-d));box-shadow:0 10px 24px color-mix(in srgb,var(--idc) 35%,transparent),inset 0 -3px 0 rgba(0,0,0,.15);transition:transform .1s,opacity .2s}
.ct-submit:active{transform:scale(.99)}
.ct-submit:disabled{opacity:.6;cursor:wait}
.ct-privacy{text-align:center;color:var(--muted);font-size:.8rem;font-weight:700;margin:10px 0 0}

/* شاشة الشكر */
.ct-thanks{text-align:center;padding:28px 16px 22px;outline:none;animation:pop .45s ease both}
@keyframes pop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.ok-ic{width:84px;height:84px;margin:0 auto 10px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.8rem;font-weight:900;color:#fff;background:linear-gradient(135deg,#2bd46a,#128c4a);box-shadow:0 0 0 8px #e3f7ea,0 12px 26px rgba(18,140,74,.3)}
.ct-thanks h2{font-family:Cairo;font-weight:900;color:var(--idc);font-size:1.45rem;margin:6px 0 6px;line-height:1.45}
.ct-thanks .muted{color:var(--muted);font-weight:700;margin:0 0 6px}
.th-or{font-weight:800;color:var(--gold-d);margin:16px 0 10px}
.ct-again{margin-top:16px;font:inherit;font-weight:800;color:var(--idc);background:var(--idc-l);border:0;border-radius:12px;padding:9px 16px;cursor:pointer}
@media(max-width:380px){.ct-wa b{font-size:.8rem}.ct-wa{padding:9px 8px;gap:7px}.ct-wa-ic{width:26px;height:26px;background-size:19px}.seg span{font-size:.78rem}}
@media(min-width:700px){.ct-hero{padding-bottom:84px}.ct-card{padding:26px 26px}.ct-svcs{grid-template-columns:1fr 1fr;grid-auto-flow:row dense}.ct-pkg{grid-column:1/-1;margin:-2px 0 2px;border-radius:16px;border-top:1.5px solid #efdca6}.svc-in{height:100%}}
