/* SEFCO "Contact Us" page (task D5, "Intercom" concept). Loaded only on the contact pages by yousry-contact.php.
   Every rule hangs off a class set in Elementor > Advanced > CSS Classes. */
:root{
  --ys-amber:#FFB23E;
  --ys-ok:#2FA36B;
  --ys-steel:repeating-linear-gradient(90deg,rgba(255,255,255,.07) 0 1px,transparent 1px 3px),linear-gradient(160deg,#eef0f2 0%,#c7cdd3 38%,#e3e6e9 55%,#b3bac1 100%);
  --ys-card-shadow:0 18px 40px -24px rgba(17,26,36,.45);
}
html{scroll-padding-top:24px}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
@media (prefers-reduced-motion:reduce){.ys-ct *,.ys-ct *::before,.ys-ct *::after{transition:none!important;animation:none!important}}

/* ---------- shared ---------- */
.ys-em{color:var(--e-global-color-primary)}
.ys-tbd{outline:1.5px dashed var(--e-global-color-primary);outline-offset:3px;border-radius:3px}
html:lang(en) .ys-eyebrow .elementor-heading-title{text-transform:uppercase}
.ys-measure{max-width:58ch}
.ys-ct .elementor-heading-title{text-wrap:balance}
.ys-fix{flex-shrink:0!important}
.ys-flex1{flex:1 1 0%!important;min-width:0;--width:auto}
.ys-ltr .elementor-heading-title{direction:ltr;unicode-bidi:isolate}
.ys-ct .elementor-heading-title a{color:inherit;text-decoration:none}
.ys-btn-ghost .elementor-button{background:transparent!important;color:var(--e-global-color-ystint)!important;border:1px solid rgba(251,244,228,.5)!important}
.ys-btn-ghost .elementor-button:hover{border-color:var(--e-global-color-primary)!important;color:var(--e-global-color-primary)!important}
/* the amber dot-matrix used across the site */
.ys-mx{font-family:"Archivo",sans-serif;font-weight:800;color:var(--ys-amber);letter-spacing:.08em;line-height:1.15;text-shadow:0 0 10px rgba(255,178,62,.65);font-variant-numeric:tabular-nums;
  -webkit-mask:radial-gradient(circle,#000 52%,transparent 58%) 0 0/3px 3px;mask:radial-gradient(circle,#000 52%,transparent 58%) 0 0/3px 3px}
html:lang(ar) .ys-mx:not(.ys-time){font-family:"Alexandria",sans-serif;letter-spacing:0;font-weight:700;-webkit-mask:none;mask:none;text-shadow:0 0 8px rgba(255,178,62,.7)}

/* ---------- 1. hero ---------- */
.ys-c-hero{background-size:min(46%,720px) auto!important;background-repeat:no-repeat!important}
.ys-crumbs,.ys-crumbs a{color:var(--e-global-color-ysondark);text-decoration:none}
.ys-crumbs a:hover{color:var(--e-global-color-ystint)}
.ys-h1 .elementor-heading-title{max-width:13ch}
.ys-promise-w{border-top:1px solid rgba(255,255,255,.1);padding-top:var(--ys-space-m)}
.ys-promise{display:flex;flex-wrap:wrap;gap:10px 26px;margin:0}
.ys-promise>span{display:inline-flex;gap:10px;align-items:center}
.ys-promise i{width:8px;height:8px;border-radius:50%;background:var(--ys-amber);box-shadow:0 0 8px var(--ys-amber);flex:none}
@media (max-width:1024px){.ys-c-hero{background-size:cover!important;--overlay-opacity:1}.ys-c-hero::before{background:rgba(17,26,36,.86)!important}}

.ys-intercom{width:min(100%,410px)}
.ys-plate{position:relative;background:var(--ys-steel);border-radius:16px;padding:26px 26px 20px;box-shadow:0 40px 80px -30px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 0 rgba(0,0,0,.15)}
.ys-screw{position:absolute;width:12px;height:12px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#f4f5f6,#8d959c 70%);box-shadow:inset 0 0 0 1px rgba(0,0,0,.25)}
.ys-screw::after{content:"";position:absolute;inset:5px 2px;background:#6c747b;transform:rotate(35deg)}
.ys-screw.s1{top:10px;left:10px}.ys-screw.s2{top:10px;right:10px}.ys-screw.s3{bottom:10px;left:10px}.ys-screw.s4{bottom:10px;right:10px}
.ys-grille{width:92px;height:92px;margin:0 auto 18px;border-radius:50%;background:radial-gradient(circle,#2a323a 1.6px,transparent 2.1px) 0 0/9px 9px;
  -webkit-mask:radial-gradient(circle,#000 62%,transparent 64%);mask:radial-gradient(circle,#000 62%,transparent 64%)}
.ys-screen{background:#0b1118;border-radius:8px;padding:12px 14px;min-height:62px;display:grid;align-content:center;box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 6px 14px rgba(0,0,0,.6),0 1px 0 rgba(255,255,255,.6)}
.ys-screen .ys-mx{font-size:1.05rem;text-transform:uppercase;white-space:nowrap;overflow:hidden}
.ys-caret{display:inline-block;width:.55em;height:1em;background:var(--ys-amber);vertical-align:-2px;margin-inline-start:4px;animation:ys-blink 1s steps(1) infinite}
@keyframes ys-blink{50%{opacity:0}}
.ys-keys{display:grid;grid-template-columns:1fr 1fr;gap:18px 14px;margin-top:22px}
.ys-key,.ys-key:hover,.ys-key:focus{display:grid!important;justify-items:center;gap:8px;background:none!important;border:0!important;padding:0!important;cursor:pointer;color:#2b333b!important;box-shadow:none!important}
.ys-cap{width:68px;height:68px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 40% 35%,#fafbfb,#c3c9cf 70%);
  box-shadow:0 0 0 5px #9aa2a9,0 0 0 6px rgba(0,0,0,.25),0 6px 10px rgba(0,0,0,.25);transition:box-shadow .2s,transform .1s}
.ys-cap svg{width:26px;height:26px;stroke:#3a434c;fill:none;stroke-width:1.8}
.ys-key-sos .ys-cap{background:radial-gradient(circle at 40% 35%,#ffd77a,#e0a21c 70%)}
.ys-key-sos .ys-cap svg{stroke:#3d2a00}
.ys-key b{font-family:var(--e-global-typography-ysh6-font-family),sans-serif;font-size:.82rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;text-shadow:0 1px 0 rgba(255,255,255,.7);line-height:1.3;text-align:center}
html:lang(ar) .ys-key b{letter-spacing:0;font-size:.9rem}
.ys-key:hover .ys-cap{transform:translateY(-1px)}
.ys-key:active .ys-cap{transform:translateY(2px)}
.ys-key:focus-visible{outline:2px solid var(--e-global-color-primary)!important;outline-offset:4px}
.ys-key[aria-pressed="true"] .ys-cap{box-shadow:0 0 0 5px var(--ys-amber),0 0 0 6px rgba(0,0,0,.25),0 0 22px 4px rgba(255,178,62,.75)}
.ys-brand{margin:20px 0 0;text-align:center;font-family:"Archivo",sans-serif;font-size:.7rem;letter-spacing:.3em;color:#59626b;text-shadow:0 1px 0 rgba(255,255,255,.7)}
.ys-answer{margin-top:16px;background:#1A2633;border:1px solid rgba(255,178,62,.35);border-radius:12px;padding:16px 18px;color:var(--e-global-color-ysondark);font-size:.94rem;display:none}
.ys-answer.is-on{display:block;animation:ys-rise .35s ease-out}
@keyframes ys-rise{from{opacity:0;transform:translateY(8px)}}
.ys-answer b{color:var(--e-global-color-ystint)}
.ys-answer .ys-big{display:block;font-family:"Archivo",sans-serif;font-size:2rem;font-weight:800;color:var(--e-global-color-ystint);margin:4px 0 10px;text-decoration:none;direction:ltr;text-align:start;unicode-bidi:isolate}
html:lang(ar) .ys-answer .ys-big{text-align:right}
.ys-answer .ys-go{display:flex;justify-content:center;margin-top:12px;background:var(--e-global-color-primary);color:var(--e-global-color-secondary);font-family:var(--e-global-typography-accent-font-family),sans-serif;font-weight:600;padding:.85em 1.4em;border-radius:8px;text-decoration:none}
.ys-answer .ys-go:hover{background:var(--e-global-color-accent);color:#fff}
.ys-answer small{display:block;margin-top:10px;color:#8d98a4}

/* ---------- 2. direct lines ---------- */
.ys-handset{border-radius:12px;overflow:hidden}
.ys-figcap{background:rgba(17,26,36,.86);border-radius:8px;padding:12px 14px;backdrop-filter:blur(4px)}
.ys-clock{display:inline-flex;align-items:center;gap:12px;background:var(--e-global-color-secondary);border-radius:8px;padding:8px 14px}
.ys-clock small{color:var(--e-global-color-ysondark);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;font-family:var(--e-global-typography-yseyebr-font-family),sans-serif}
html:lang(ar) .ys-clock small{letter-spacing:0;font-size:.85rem}
.ys-time{font-size:1.15rem;direction:ltr;unicode-bidi:isolate}
.ys-lines{border-top:2px solid var(--e-global-color-secondary)}
.ys-line{border-bottom:1px solid var(--e-global-color-ysborder)}
.ys-led{display:block;width:12px;height:12px;border-radius:50%;background:#c3c9cf;box-shadow:inset 0 1px 2px rgba(0,0,0,.3)}
.ys-led.is-on{background:var(--ys-ok);box-shadow:0 0 0 3px rgba(47,163,107,.18),0 0 10px rgba(47,163,107,.7)}
.ys-led.is-always{background:var(--ys-amber);box-shadow:0 0 0 3px rgba(255,178,62,.2),0 0 10px rgba(255,178,62,.8)}
.ys-state .elementor-heading-title{font-size:.78rem!important;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:3px 10px;border-radius:999px;background:var(--e-global-color-yslight);white-space:nowrap}
html:lang(ar) .ys-state .elementor-heading-title{letter-spacing:0;font-size:.85rem!important}
.ys-state.is-on .elementor-heading-title{color:#1d7a4e!important;background:#e6f5ed}
.ys-state.is-always .elementor-heading-title{color:var(--e-global-color-accent)!important;background:var(--e-global-color-ystint)}
.ys-num .elementor-heading-title{font-family:"Archivo",sans-serif!important;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
html:lang(ar) .ys-num:not(.ys-ltr) .elementor-heading-title{font-family:var(--e-global-typography-ysh4-font-family),sans-serif!important}
.ys-num a:hover{color:var(--e-global-color-accent)!important}
.ys-line .ys-num,.ys-line .ys-state{flex-shrink:0}
@media (max-width:767px){
  .ys-line>.ys-flex1{flex-basis:calc(100% - 40px)!important}
  .ys-line .ys-state{margin-inline-start:30px}
}

/* ---------- 3. request form ---------- */
.ys-agents{border-radius:12px}
.ys-ready,.ys-card{border-radius:14px;box-shadow:var(--ys-card-shadow),0 0 0 1px var(--e-global-color-ysborder)}
.ys-sos-tip{display:none!important;border-radius:10px}
.ys-sos-tip.is-on{display:flex!important}
.ys-sos-tip a{color:var(--ys-amber)!important}
.ys-cform .ys-sos-tip{width:100%;margin:12px 0 4px}
.ys-cform .elementor-field-group-reason{flex-wrap:wrap}
/* reason radios as pills */
.ys-cform .elementor-field-type-radio .elementor-field-subgroup{display:flex;flex-wrap:wrap;gap:8px}
.ys-cform .elementor-field-type-radio .elementor-field-option{position:relative;margin:0!important;padding:0!important}
.ys-cform .elementor-field-type-radio input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.ys-cform .elementor-field-option label{display:inline-flex!important;align-items:center;gap:8px;padding:8px 14px!important;border-radius:999px;border:1px solid var(--e-global-color-ysborder);background:#fff;font-size:.9rem;cursor:pointer;transition:border-color .2s,background .2s;margin:0!important}
.ys-cform .elementor-field-option label::before{content:"";width:8px;height:8px;border-radius:50%;background:#c3c9cf}
.ys-cform .elementor-field-type-radio input:checked+label{border-color:var(--e-global-color-primary);background:var(--e-global-color-ystint);color:var(--e-global-color-secondary);font-weight:600}
.ys-cform .elementor-field-type-radio input:checked+label::before{background:var(--ys-amber);box-shadow:0 0 6px var(--ys-amber)}
.ys-cform .elementor-field-type-radio input:focus-visible+label{outline:2px solid var(--e-global-color-primary);outline-offset:2px}

/* ---------- 4. visit: lobby directory ---------- */
.ys-directory{border-radius:10px;background:repeating-linear-gradient(180deg,#151a1f 0 7px,#0e1216 7px 9px);box-shadow:0 0 0 8px #3b2c1b,0 0 0 9px #1d150c,0 40px 70px -30px rgba(0,0,0,.8);max-width:100%}
.ys-drow{border-top:1px dashed rgba(255,255,255,.18);margin-top:12px}
.ys-dt{flex:0 0 110px!important;width:110px!important}
html:lang(ar) .ys-dt{flex-basis:120px!important;width:120px!important}
.ys-dt .elementor-heading-title{text-transform:uppercase;letter-spacing:.14em;font-size:.75rem!important}
html:lang(ar) .ys-dt .elementor-heading-title{letter-spacing:0;font-size:.85rem!important}
.ys-drow>.ys-dd:not(.ys-tbd){flex:1 1 0%;min-width:0}
.ys-dd .elementor-heading-title{font-weight:500!important}
@media (max-width:767px){.ys-dt{flex-basis:auto!important;width:auto!important}}

/* ---------- 5. governorate panel ---------- */
.ys-big27 .elementor-heading-title{font-family:"Archivo",sans-serif!important;font-weight:800;font-size:clamp(5rem,12vw,9rem)!important;line-height:.9!important;text-shadow:0 0 30px rgba(255,178,62,.35)}
.ys-govs{background:linear-gradient(160deg,#1f2b38,#16212c);border-radius:14px;padding:22px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.ys-govs ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px 14px}
.ys-gov,.ys-gov:hover,.ys-gov:focus{width:100%;display:flex!important;gap:10px;align-items:center;background:none!important;border:0!important;padding:6px 4px!important;color:var(--e-global-color-ysondark)!important;cursor:pointer;text-align:start;font-size:.92rem!important;font-weight:400!important;border-radius:6px!important;box-shadow:none!important;line-height:1.4!important}
.ys-gov::before{content:"";flex:0 0 22px;height:22px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#e9ecef,#9aa2a9 70%);box-shadow:0 0 0 2px #3a4652}
.ys-gov:hover{color:var(--e-global-color-ystint)!important}
.ys-gov:focus-visible{outline:2px solid var(--e-global-color-primary)!important}
.ys-gov[aria-pressed="true"]{color:#fff!important}
.ys-gov[aria-pressed="true"]::before{box-shadow:0 0 0 2px var(--ys-amber),0 0 10px 2px rgba(255,178,62,.7)}
.ys-pick{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;font-size:.92rem;min-height:58px;color:var(--e-global-color-ysondark)}
.ys-pick b{color:var(--e-global-color-ystint)}
.ys-pick-go{color:var(--e-global-color-ystint);font-weight:600;text-decoration:none;border-bottom:1.5px solid var(--e-global-color-primary);padding-bottom:3px}
.ys-pick-go::after{content:" →";color:var(--e-global-color-primary)}
html[dir="rtl"] .ys-pick-go::after{content:" ←"}
.ys-pick-go[hidden]{display:none}
@media (max-width:767px){.ys-govs ul{grid-template-columns:repeat(2,1fr)}}

/* ---------- 6. FAQ ---------- */
.ys-faq .elementor-accordion-item{border:0!important;border-bottom:1px solid var(--e-global-color-ysborder)!important}
.ys-faq .elementor-accordion{border-top:2px solid var(--e-global-color-secondary)}
.ys-faq .elementor-tab-title{padding:20px 0!important;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-direction:row-reverse}
.ys-faq .elementor-tab-title .elementor-accordion-icon{float:none!important;flex:none}
.ys-faq .elementor-tab-content{padding:0 0 20px!important;border:0!important;max-width:62ch}
.ys-faq .elementor-accordion-title{color:var(--e-global-color-secondary)!important}
.ys-faq .elementor-accordion-icon{font-size:14px!important;width:auto!important}
.ys-faq .elementor-accordion-icon svg{width:14px!important;height:14px!important}

/* mobile hotline bar (shown after the hero, never in the editor) */
.ys-hotbar{position:fixed;inset-inline:0;bottom:0;z-index:90;background:var(--e-global-color-secondary);border-top:2px solid var(--e-global-color-primary);padding:10px 16px;display:none;align-items:center;justify-content:space-between;gap:12px;transform:translateY(100%);transition:transform .3s}
.ys-hotbar.is-on{transform:none}
.ys-hotbar span{color:var(--e-global-color-ysondark);font-size:.92rem}
.ys-hotbar a{background:var(--e-global-color-primary);color:var(--e-global-color-secondary);font-family:"Archivo","Alexandria",sans-serif;font-weight:800;text-decoration:none;padding:8px 14px;border-radius:8px;white-space:nowrap}
@media (max-width:767px){.ys-hotbar{display:flex}body:has(.ys-hotbar){padding-bottom:64px}}
.elementor-editor-active .ys-hotbar{display:none!important}