/* Contact page: «كيف نساعدك؟» path cards (radio) → form with only the path's fields → «بيانات التواصل» card.
   Without JS every field shows (the server validates by path); with JS (.is-js) fields follow the chosen path. */
.sdo-w--contact .sdo-ct-anchor{position:relative;top:-120px}
.sdo-w--contact .sdo-ct{margin-top:clamp(32px,5vw,60px);display:grid;gap:clamp(28px,5vw,56px)}
@media(min-width:1024px){.sdo-w--contact .sdo-ct--split{grid-template-columns:minmax(0,1.6fr) minmax(0,.9fr);align-items:start}.sdo-w--contact .sdo-ct__aside{position:sticky;top:110px}}
.sdo-w--contact .sdo-ct__main{display:grid;gap:clamp(26px,4vw,40px);min-width:0;margin:0}
.sdo-w--contact .sdo-ct__h{margin:0 0 6px;font-family:var(--sdo-head-ff);font-size:clamp(1.45rem,3vw,2rem);font-weight:700;line-height:1.35;color:var(--sdo-ink)}
.sdo-w--contact .sdo-ct__iam{margin:0 0 16px;font-size:.95rem;font-weight:600;color:var(--sdo-sand-deep)}
.sdo-tone--dark.sdo-w--contact .sdo-ct__iam{color:var(--sdo-sand)}

/* Paths */
.sdo-w--contact .sdo-ct__paths{display:grid;gap:12px}
@media(min-width:600px){.sdo-w--contact .sdo-ct__paths{grid-template-columns:repeat(2,minmax(0,1fr))}}
.sdo-w--contact .sdo-ct__path{position:relative;display:flex;align-items:flex-start;gap:16px;min-height:100%;padding:clamp(18px,2.4vw,24px);border:1px solid var(--sdo-line);border-radius:22px;background:var(--sdo-surface);cursor:pointer;transition:border-color .6s var(--sdo-ease),background .6s var(--sdo-ease),transform .8s var(--sdo-ease),box-shadow .8s var(--sdo-ease)}
.sdo-w--contact .sdo-ct__path:hover{border-color:var(--sdo-sand);transform:translateY(-3px)}
.sdo-w--contact .sdo-ct__path input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.sdo-w--contact .sdo-ct__pin{flex:none;display:grid;place-items:center;width:50px;height:50px;border-radius:50%;font-size:22px;color:var(--sdo-accent);background:var(--sdo-sand-wash);transition:background .6s var(--sdo-ease),color .6s var(--sdo-ease)}
.sdo-w--contact .sdo-ct__pt{display:flex;flex-direction:column;gap:4px;min-width:0;padding-inline-end:22px}
.sdo-w--contact .sdo-ct__pt strong{font-family:var(--sdo-head-ff);font-size:clamp(1.15rem,2vw,1.3rem);font-weight:700;line-height:1.4;color:var(--sdo-ink)}
.sdo-w--contact .sdo-ct__pt em{font-style:normal;font-size:.93rem;line-height:1.7;color:var(--sdo-muted)}
.sdo-w--contact .sdo-ct__pt small{margin-top:6px;font-size:.8rem;color:var(--sdo-muted)}
.sdo-w--contact .sdo-ct__pt small b{font-weight:600;color:var(--sdo-accent)}
.sdo-w--contact .sdo-ct__tick{position:absolute;top:18px;inset-inline-end:18px;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--sdo-line);transition:background .5s var(--sdo-ease),border-color .5s var(--sdo-ease)}
.sdo-w--contact .sdo-ct__tick::after{content:"";position:absolute;inset:5px 6px 7px;border:solid var(--sdo-accent-ink);border-width:0 0 2px 2px;transform:rotate(-45deg) scale(0);transition:transform .5s var(--sdo-ease)}
.sdo-w--contact .sdo-ct__path:has(input:checked){border-color:var(--sdo-accent);background:linear-gradient(160deg,var(--sdo-sand-wash),transparent 70%),var(--sdo-surface);box-shadow:0 18px 40px -28px color-mix(in srgb,var(--sdo-wine) 60%,transparent)}
.sdo-w--contact .sdo-ct__path:has(input:checked) .sdo-ct__pin{background:var(--sdo-accent);color:var(--sdo-accent-ink)}
.sdo-w--contact .sdo-ct__path:has(input:checked) .sdo-ct__tick{background:var(--sdo-accent);border-color:var(--sdo-accent)}
.sdo-w--contact .sdo-ct__path:has(input:checked) .sdo-ct__tick::after{transform:rotate(-45deg) scale(1)}
.sdo-w--contact .sdo-ct__path:has(input:focus-visible){outline:2px solid var(--sdo-sand);outline-offset:3px}

/* Form */
.sdo-w--contact .sdo-ct__form{display:grid;gap:22px;padding:clamp(22px,4vw,40px);border:1px solid var(--sdo-line);border-radius:clamp(22px,3vw,30px);background:var(--sdo-surface)}
.sdo-w--contact .sdo-ct__pick{display:none;align-items:center;gap:10px;margin:0;color:var(--sdo-muted)}
.sdo-w--contact .sdo-ct__pickic{transform:rotate(90deg);color:var(--sdo-sand)}
.sdo-w--contact.is-js:not(.has-path) .sdo-ct__pick{display:flex}
.sdo-w--contact.is-js:not(.has-path) .sdo-ct__fields,.sdo-w--contact.is-js:not(.has-path) .sdo-ct__send{display:none}
.sdo-w--contact .sdo-ct__fields{display:grid;gap:18px 16px}
@media(min-width:700px){.sdo-w--contact .sdo-ct__fields{grid-template-columns:repeat(2,minmax(0,1fr))}.sdo-w--contact .sdo-ct__f--choice,.sdo-w--contact .sdo-ct__f--textarea{grid-column:1/-1}}
.sdo-w--contact .sdo-ct__f[hidden]{display:none}
.sdo-w--contact .sdo-ct__f.is-in{animation:sdo-ct-in .7s var(--sdo-ease)}
@keyframes sdo-ct-in{from{opacity:0;transform:translate3d(0,8px,0)}to{opacity:1;transform:none}}
.sdo-w--contact .sdo-ct__f>label,.sdo-w--contact .sdo-ct__f legend{display:block;margin:0 0 8px;padding:0;font-size:.9rem;font-weight:600;color:var(--sdo-ink)}
.sdo-w--contact .sdo-ct__f fieldset{margin:0;padding:0;border:0;min-width:0}
.sdo-w--contact .sdo-ct__req{display:none;margin-inline-start:3px;color:var(--sdo-sand-deep)}
.sdo-w--contact .sdo-ct__f.is-req .sdo-ct__req{display:inline}
.sdo-w--contact .sdo-ct__lbl-tenant{display:none}
.sdo-w--contact .sdo-ct[data-path=tenant] .sdo-ct__lbl-tenant{display:inline}
.sdo-w--contact .sdo-ct[data-path=tenant] .sdo-ct__lbl-def{display:none}
.sdo-w--contact .sdo-ct input[type=text],.sdo-w--contact .sdo-ct input[type=tel],.sdo-w--contact .sdo-ct input[type=email],.sdo-w--contact .sdo-ct input[type=number],.sdo-w--contact .sdo-ct input[type=date],.sdo-w--contact .sdo-ct select,.sdo-w--contact .sdo-ct textarea{box-sizing:border-box;display:block;width:100%;min-height:54px;margin:0;padding:12px 16px;border:1px solid color-mix(in srgb,var(--sdo-ink) 18%,transparent);border-radius:14px;background:var(--sdo-surface);font:inherit;font-size:1rem;line-height:1.6;color:var(--sdo-ink);box-shadow:none;transition:border-color .4s var(--sdo-ease),box-shadow .4s var(--sdo-ease)}
.sdo-w--contact .sdo-ct textarea{min-height:130px;resize:vertical}
.sdo-w--contact .sdo-ct input[dir=ltr]{text-align:right}
html:not([dir=rtl]) .sdo-w--contact .sdo-ct input[dir=ltr]{text-align:left}
.sdo-w--contact .sdo-ct input:focus,.sdo-w--contact .sdo-ct select:focus,.sdo-w--contact .sdo-ct textarea:focus{outline:none;border-color:var(--sdo-accent);box-shadow:0 0 0 4px var(--sdo-sand-wash)}
.sdo-w--contact .sdo-ct__f.is-bad input,.sdo-w--contact .sdo-ct__f.is-bad select,.sdo-w--contact .sdo-ct__f.is-bad textarea{border-color:#b32d2e}
.sdo-w--contact .sdo-ct__chips{display:flex;flex-wrap:wrap;gap:8px}
.sdo-w--contact .sdo-ct__chips label{position:relative;cursor:pointer}
.sdo-w--contact .sdo-ct__chips input{position:absolute;opacity:0;width:1px;height:1px}
.sdo-w--contact .sdo-ct__chips span{display:inline-flex;align-items:center;min-height:46px;padding:0 20px;border:1px solid color-mix(in srgb,var(--sdo-ink) 18%,transparent);border-radius:99px;font-size:.95rem;color:var(--sdo-ink);transition:background .4s var(--sdo-ease),color .4s var(--sdo-ease),border-color .4s var(--sdo-ease)}
.sdo-w--contact .sdo-ct__chips label:hover span{border-color:var(--sdo-sand)}
.sdo-w--contact .sdo-ct__chips input:checked+span{background:var(--sdo-accent);border-color:var(--sdo-accent);color:var(--sdo-accent-ink)}
.sdo-w--contact .sdo-ct__chips input:focus-visible+span{outline:2px solid var(--sdo-sand);outline-offset:2px}
.sdo-w--contact .sdo-ct__err{margin:6px 0 0;font-size:.82rem;color:#b32d2e}
.sdo-w--contact .sdo-ct__err:empty{display:none}
.sdo-w--contact .sdo-ct__hp{position:absolute;inset-inline-start:-9999px;width:1px;height:1px;overflow:hidden}
.sdo-w--contact .sdo-ct__send{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px}
.sdo-w--contact .sdo-ct__btn{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:0 34px;border-radius:99px;background:var(--sdo-accent);color:var(--sdo-accent-ink);font-weight:600;transition:background .5s var(--sdo-ease),transform .6s var(--sdo-ease)}
.sdo-w--contact .sdo-ct__btn:hover{background:var(--sdo-wine-deep);color:#fff;transform:translateY(-2px)}
.sdo-tone--dark.sdo-w--contact .sdo-ct__btn:hover{background:var(--sdo-ivory);color:var(--sdo-deep)}
.sdo-w--contact .sdo-ct__btn:focus-visible{outline:2px solid var(--sdo-sand);outline-offset:3px}
.sdo-w--contact .sdo-ct__btn[aria-busy=true]{opacity:.7;pointer-events:none}
.sdo-w--contact .sdo-ct__btn[aria-busy=true] .sdo-arrow{animation:sdo-ct-nudge 1s var(--sdo-ease) infinite}
@keyframes sdo-ct-nudge{50%{transform:translateX(-6px)}}
.sdo-w--contact .sdo-ct__status{margin:0;font-size:.9rem;color:#b32d2e}
.sdo-w--contact .sdo-ct__status:empty{display:none}
@media(max-width:599px){.sdo-w--contact .sdo-ct__btn{width:100%}}
/* Sent */
.sdo-w--contact .sdo-ct__done{display:grid;justify-items:center;gap:8px;padding:clamp(32px,6vw,56px) 20px;border:1px solid var(--sdo-accent);border-radius:clamp(22px,3vw,30px);text-align:center;background:linear-gradient(160deg,var(--sdo-sand-wash),transparent 70%),var(--sdo-surface);animation:sdo-ct-in .9s var(--sdo-ease)}
.sdo-w--contact .sdo-ct__done[hidden]{display:none}
.sdo-w--contact .sdo-ct__doneic{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;font-size:28px;color:var(--sdo-accent-ink);background:var(--sdo-accent)}
.sdo-w--contact .sdo-ct__done h3{margin:8px 0 0;font-family:var(--sdo-head-ff);font-size:clamp(1.4rem,3vw,1.9rem);color:var(--sdo-ink)}
.sdo-w--contact .sdo-ct__done p{margin:0;max-width:30em;color:var(--sdo-muted)}
.sdo-w--contact .sdo-ct__main.is-sent .sdo-ct__pathsec,.sdo-w--contact .sdo-ct__main.is-sent .sdo-ct__form{display:none}

/* Details card */
.sdo-w--contact .sdo-ct__card{position:relative;overflow:hidden;isolation:isolate;padding:clamp(26px,4vw,40px);border-radius:clamp(24px,3vw,32px);color:var(--sdo-ivory);background:linear-gradient(160deg,var(--sdo-wine-deep),var(--sdo-night));box-shadow:0 30px 60px -40px rgba(0,0,0,.7)}
.sdo-w--contact .sdo-ct__card .sdo-ct__h{color:#fff;margin-bottom:18px}
.sdo-w--contact .sdo-ct__dl{margin:0;display:grid}
.sdo-w--contact .sdo-ct__dl>div{display:grid;gap:4px;padding:16px 0;border-bottom:1px solid color-mix(in srgb,var(--sdo-ivory) 12%,transparent)}
.sdo-w--contact .sdo-ct__dl>div:last-child{border-bottom:0}
.sdo-w--contact .sdo-ct__dl dt{display:flex;align-items:center;gap:10px;font-size:.82rem;color:var(--sdo-sand)}
.sdo-w--contact .sdo-ct__dic{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;font-size:15px;background:color-mix(in srgb,#fff 8%,transparent)}
.sdo-w--contact .sdo-ct__dl dd{margin:0;padding-inline-start:40px;font-size:1.08rem;color:#fff}
.sdo-w--contact .sdo-ct__dl dd a{color:#fff;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .4s var(--sdo-ease),color .4s var(--sdo-ease)}
.sdo-w--contact .sdo-ct__dl dd a:hover{color:var(--sdo-sand);border-color:var(--sdo-sand)}
.sdo-w--contact .sdo-ct__dl dd a[dir=ltr]{unicode-bidi:isolate}
.sdo-w--contact .sdo-ct__wave{position:absolute;z-index:-1;inset-inline-end:-10%;bottom:-8%;width:80%}
.sdo-w--contact .sdo-ct__wave path{stroke:var(--sdo-ivory);opacity:.12}
.sdo-w--contact .sdo-ct__wave path:nth-child(2){stroke:var(--sdo-sand);opacity:.28}
.sdo-tone--dark.sdo-w--contact .sdo-ct__card{background:linear-gradient(160deg,color-mix(in srgb,var(--sdo-wine) 40%,var(--sdo-night)),color-mix(in srgb,var(--sdo-night) 80%,#000));border:1px solid var(--sdo-line)}
@media (prefers-reduced-motion:reduce){.sdo-w--contact *{transition:none!important;animation:none!important}}
