@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap");
/* Ibrahim Al-Khalil hero ("cross"). The area's name runs huge across the page and passes over a tall photo in the middle: navy on the
   page, white where it crosses the photo (a second copy of the word, clipped to the photo's box). Facts sit around the photo, the intro
   and the site's own buttons underneath. On scroll the photo widens (more of the name turns white) and the name drifts sideways.
   No text shadows; motion runs for every visitor. */
.ib-hero{--ib-ease:cubic-bezier(.22,1,.36,1);--ib-h:clamp(520px,calc(100svh - 190px),800px);--ib-w:calc(var(--ib-h) / 1.28);--ib-grow:0px;--ib-r:30px;--p:0;--ib-cw:calc(var(--ib-w) + var(--p) * var(--ib-grow));
 position:relative;isolation:isolate;overflow:hidden;padding:clamp(118px,14vh,140px) 0 clamp(40px,6vh,64px);color:var(--navy,#0A2E4D);background:linear-gradient(180deg,#fff 0,#fff 70%,#F4F6F8 100%)}
#main>section.ib-hero{background:linear-gradient(180deg,#fff 0,#fff 70%,#F4F6F8 100%)}
.ib-hero .screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ib-wrap{position:relative}
.ib-hero p{margin:0}

/* Top corners, level with the photo's top edge */
.ib-meta{position:absolute;z-index:3;top:0;inset-inline:clamp(24px,3.4vw,56px);display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}
.ib-meta>div{width:calc(50% - var(--ib-w) / 2 - clamp(40px,4vw,72px));pointer-events:auto}
.ib-kicker{display:inline-flex;align-items:center;gap:9px;margin-bottom:14px!important;font-size:13.5px;font-weight:600;line-height:1.6;color:var(--teal,#0E7C77)}
.ib-kicker:before{content:'';flex:none;width:22px;height:1.5px;background:currentColor}
.ib-lead{max-width:340px;font-size:clamp(19px,1.55vw,23px);font-weight:700;line-height:1.55;color:var(--navy,#001C3C);text-wrap:balance}
.ib-status{display:flex;flex-direction:column;align-items:flex-end;text-align:end}
.ib-live{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:700;line-height:1.6;color:var(--navy,#001C3C)}
.ib-live i{position:relative;flex:none;width:8px;height:8px;border-radius:50%;background:#1FA855}
.ib-live i:after{content:'';position:absolute;inset:-5px;border-radius:50%;border:1.5px solid #1fa85566;animation:ib-ping 2.4s var(--ib-ease) infinite}
@keyframes ib-ping{0%{transform:scale(.5);opacity:1}100%{transform:scale(1.6);opacity:0}}
.ib-where{margin-top:6px!important;font-size:14px;font-weight:500;line-height:1.7;color:#0a2e4d99}

/* The stage: photo in the middle, the name across it */
.ib-stage{position:relative;height:var(--ib-h)}
.ib-photo{position:absolute;z-index:1;top:0;left:50%;width:var(--ib-cw);height:100%;margin:0;transform:translateX(-50%);border-radius:var(--ib-r);overflow:hidden;background:#dfe6ec;box-shadow:0 50px 80px -50px #001c3c73}
.ib-photo picture,.ib-photo img{display:block;width:100%;height:100%}
.ib-photo img{object-fit:cover;object-position:50% 45%}
.ib-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#001c3c66 0,#001c3c26 34%,#001c3c00 58%);pointer-events:none}

.ib-title{position:static;margin:0!important;font-size:inherit!important;line-height:inherit!important}
.ib-word{position:absolute;inset-inline-start:0;bottom:calc(var(--ib-h) * .03);display:flex;width:max-content;white-space:nowrap;font-size:var(--ib-fs,11.5vw);font-weight:800;line-height:1.12;letter-spacing:0;pointer-events:none;animation:ib-marquee var(--ib-dur,40s) linear infinite}
.ib-half,.ib-name{display:flex;align-items:center;flex:none}
.ib-sep{flex:none;width:.11em;height:.11em;margin:0 .36em;border-radius:50%;background:#D9A520}
@keyframes ib-marquee{from{transform:translateX(0)}to{transform:translateX(50%)}}
@keyframes ib-marquee-ltr{from{transform:translateX(0)}to{transform:translateX(-50%)}}
html[dir=ltr] .ib-word{animation-name:ib-marquee-ltr}
.ib-hero .ib-word{animation-play-state:running!important}
.ib-base{z-index:0;color:var(--navy,#001C3C)}
.ib-lit{position:absolute;z-index:2;inset:0;clip-path:inset(0 calc(50% - var(--ib-cw) / 2) round var(--ib-r));pointer-events:none}
.ib-white{color:#fff}
.ib-white .ib-sep{background:#fff}
.ib-hollow{color:transparent;-webkit-text-stroke:max(1.5px,.018em) var(--navy,#001C3C);paint-order:stroke}
.ib-white .ib-hollow{color:transparent;-webkit-text-stroke-color:#fff}

/* Facts around the photo, between the top corners and the name */
.ib-facts{position:absolute;z-index:3;top:0;left:0;right:0;height:var(--ib-h);pointer-events:none}
.ib-fact{position:absolute;z-index:3;top:25%;display:flex;flex-direction:column;gap:2px;width:clamp(130px,11vw,170px)}
.ib-fact b{font-size:clamp(26px,2.3vw,34px);font-weight:800;line-height:1.2;color:var(--navy,#001C3C)}
.ib-fact span{font-size:13.5px;font-weight:500;line-height:1.6;color:#0a2e4da6}
.ib-fact:before{content:'';display:block;width:100%;height:1px;margin-bottom:12px;background:#0a2e4d26}
.ib-fact-1{inset-inline-start:clamp(24px,3.4vw,56px)}
.ib-fact-2{inset-inline-start:calc(clamp(24px,3.4vw,56px) + clamp(130px,11vw,170px) + clamp(18px,2vw,32px))}
.ib-fact-3{inset-inline-end:calc(clamp(24px,3.4vw,56px) + clamp(130px,11vw,170px) + clamp(18px,2vw,32px))}
.ib-fact-4{inset-inline-end:clamp(24px,3.4vw,56px)}
.ib-fact-3,.ib-fact-4{text-align:end}

/* Under the stage: the intro on one side, the buttons on the other */
.ib-foot{position:relative;z-index:3;display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin:clamp(28px,4vh,44px) clamp(24px,3.4vw,56px) 0}
.ib-line{max-width:520px;font-size:clamp(15.5px,1.15vw,17px);font-weight:500;line-height:1.9;color:#0a2e4dc7}
.ib-actions{display:flex;flex-wrap:wrap;gap:12px;flex:none}
.ib-actions .button{display:inline-flex;align-items:center;justify-content:center;gap:10px;box-sizing:border-box}

/* Entrance: the photo opens from its centre, the name rises into place, the words fade up */
.ib-photo{clip-path:inset(12% 12% 12% 12% round var(--ib-r));transition:clip-path 1.3s var(--ib-ease)}
.ib-title,.ib-lit .ib-word{opacity:0;transition:opacity 1.1s var(--ib-ease) .15s}
.ib-rise,.ib-fact{opacity:0;transform:translateY(16px);transition:opacity .9s var(--ib-ease) .45s,transform .9s var(--ib-ease) .45s}
.ib-hero.is-ready .ib-photo{clip-path:inset(0 0 0 0 round var(--ib-r))}
.ib-hero.is-ready .ib-title,.ib-hero.is-ready .ib-lit .ib-word{opacity:1}
.ib-hero.is-ready .ib-rise,.ib-hero.is-ready .ib-fact{opacity:1;transform:none}
.ib-hero.is-ready .ib-fact-2,.ib-hero.is-ready .ib-fact-3{transition-delay:.55s}
.ib-hero.is-moving .ib-photo,.ib-hero.is-moving .ib-photo img{transition:none}

/* English */
html[dir=ltr] .ib-hero{font-family:Poppins,sans-serif}
html[dir=ltr] .ib-word{font-family:Poppins,sans-serif;font-weight:600;letter-spacing:-.045em;line-height:1}
html[dir=ltr] .ib-kicker{font-size:12px;letter-spacing:.14em;text-transform:uppercase}
html[dir=ltr] .ib-lead{font-size:clamp(18px,1.4vw,21px);letter-spacing:-.01em}

/* The floating WhatsApp circle waits until the hero (which has its own button) has scrolled away */
body.al-in-arch .al-float{opacity:0;visibility:hidden}

/* One background for the whole page (#F4F6F8), from the hero down to the hotels and the footer */
body.al-arch-page:has(#ib-hero),body:has(#ib-hero) .al-page,body:has(#ib-hero) #main{background:#F4F6F8}
body:has(#ib-hero) .st-tab-card{background:#F4F6F8}
body:has(#ib-hero) .st-tab-card:before,body:has(#ib-hero) .st-tab-card:after{background:radial-gradient(circle at 0 0,transparent 29px,#F4F6F8 30px)}
html[dir=rtl] body:has(#ib-hero) .st-tab-card:before,html[dir=rtl] body:has(#ib-hero) .st-tab-card:after{background:radial-gradient(circle at 100% 0,transparent 29px,#F4F6F8 30px)}

/* Narrower desktops: facts one per side */
@media(max-width:1180px) and (min-width:801px){
 .ib-hero{--ib-h:clamp(480px,calc(100svh - 200px),700px)}
 .ib-fact-2,.ib-fact-3{display:none}
 .ib-foot{flex-direction:column;align-items:flex-start;gap:22px}
}
@media(min-width:801px) and (max-height:760px){.ib-fact{top:22%}.ib-lead{font-size:18px}}

/* Phones and portrait tablets: the corners on top, the photo with the name in two lines across it, the facts in a 2x2 grid, then the
   intro and the buttons */
@media(max-width:800px),(max-aspect-ratio:3/4){
 .ib-hero{--ib-w:min(86vw,470px);--ib-h:calc(var(--ib-w) * 1.28);--ib-grow:0px;--ib-r:24px;padding:104px 0 36px}
 .ib-meta{position:relative;inset:auto;flex-direction:column;align-items:center;gap:14px;margin:0 20px 26px;text-align:center}
 .ib-meta>div{width:auto}
 .ib-kicker{margin-bottom:10px!important;font-size:12.5px}
 .ib-lead{max-width:none;font-size:20px}
 .ib-status{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 14px;text-align:center}
 .ib-live{font-size:13.5px}
 .ib-where{margin:0!important;font-size:13px}
 .ib-word{bottom:calc(var(--ib-h) * .06)}
 .ib-stage{margin-bottom:14px}
 .ib-fact{position:relative;inset:auto!important;top:auto;width:auto;display:flex!important;padding:14px 16px;border-radius:16px;background:#fff;border:1px solid #0a2e4d12;text-align:start!important}
 .ib-fact:before{display:none}
 .ib-fact b{font-size:24px}
 .ib-fact span{font-size:12.5px}
 .ib-facts{position:static;height:auto;display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 20px 0}
 .ib-foot{flex-direction:column;align-items:stretch;gap:20px;margin:22px 20px 0;text-align:center}
 .ib-line{max-width:none;font-size:15.5px;line-height:1.8;text-wrap:balance}
 .ib-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
 .ib-actions .button{padding-inline:12px;min-width:0}
}
@media(max-width:480px){.ib-actions{grid-template-columns:1fr}}

/* ---------- "How we pick your hotel" (after lerp's "How a project runs"): the heading stays in place on one side, a thin vertical line
   fills as you scroll, and the step at the middle of the screen lights up (navy title, teal time) while the others stay pale. ---------- */
#main>section.ib-run{position:relative;z-index:2;padding:clamp(90px,10vw,140px) 0 clamp(80px,9vw,130px);background:#F4F6F8;color:var(--navy,#0A2E4D)}
.ib-run-in{display:grid;grid-template-columns:minmax(0,.8fr) 1px minmax(0,1.6fr);gap:0 clamp(32px,4vw,70px);max-width:1320px;margin:0 auto;padding:0 clamp(20px,3.4vw,56px)}
.ib-run-stick{position:sticky;top:clamp(110px,14vh,140px)}
.al-page .ib-run h2{margin:0 0 30px;font-size:clamp(30px,3.1vw,48px);font-weight:800;line-height:1.25;color:var(--navy,#001C3C)}
.al-page .ib-run h2 span{display:block;color:var(--navy,#001C3C)}
.ib-run-stick .button{display:inline-flex;align-items:center;gap:10px}
.ib-run-track{position:relative;background:#0a2e4d1f}
.ib-run-track i{position:absolute;inset-inline:0;top:0;height:calc(var(--run,0) * 100%);background:var(--teal,#0E7C77)}
.ib-run-list{margin:0;padding:0;list-style:none}
.ib-run-row{display:grid;grid-template-columns:clamp(48px,5vw,90px) minmax(0,1fr) auto;gap:0 clamp(16px,2vw,32px);align-items:start;padding:0 0 clamp(90px,11vh,130px)}
.ib-run-row:last-child{padding-bottom:0}
.ib-run-num{font-size:clamp(34px,3vw,44px);font-weight:500;line-height:1.2;color:#0a2e4d40;transition:color .45s}
.al-page .ib-run h3{margin:0 0 18px;font-size:clamp(30px,3vw,46px);font-weight:700;line-height:1.25;color:#0a2e4d40;transition:color .45s}
.ib-run-body p{max-width:600px;margin:0;font-size:clamp(16px,1.25vw,19px);font-weight:500;line-height:1.85;color:#0a2e4d40;transition:color .45s}
.ib-run-time{padding-top:clamp(10px,1vw,16px);font-size:clamp(15px,1.2vw,18px);font-weight:600;line-height:1.5;white-space:nowrap;color:#0e7c7759;transition:color .45s}
.ib-run-row.is-active .ib-run-num{color:#0a2e4dbf}
.al-page .ib-run .ib-run-row.is-active h3{color:var(--navy,#001C3C)}
.ib-run-row.is-active .ib-run-body p{color:#0a2e4dbf}
.ib-run-row.is-active .ib-run-time{color:var(--teal,#0E7C77)}
html[dir=ltr] .ib-run{font-family:Poppins,sans-serif}
html[dir=ltr] .al-page .ib-run h2,html[dir=ltr] .al-page .ib-run h3{font-family:Poppins,sans-serif;font-weight:500;letter-spacing:-.035em}
@media(max-width:900px){
 .ib-run-in{grid-template-columns:1px minmax(0,1fr);gap:0 20px}
 .ib-run-side{grid-column:1/-1;margin-bottom:44px}
 .ib-run-stick{position:static}
 .al-page .ib-run h2{font-size:clamp(28px,7.4vw,36px);margin-bottom:22px}
 .ib-run-row{grid-template-columns:34px minmax(0,1fr);padding-bottom:64px}
 .ib-run-time{grid-column:2;grid-row:1;padding:0 0 8px;font-size:14px;white-space:normal}
 .ib-run-body{grid-column:2}
 .ib-run-num{grid-row:1/3;font-size:28px}
 .al-page .ib-run h3{font-size:24px;margin-bottom:12px}
 .ib-run-body p{font-size:15.5px}
}

/* ---------- Statement (after lerp's big intro text): words turn from pale to navy as the reader scrolls; the key phrases end teal. ---------- */
#main>section.ib-say{position:relative;z-index:2;padding:clamp(110px,13vw,190px) 0 clamp(40px,5vw,70px);background:#F4F6F8}
.ib-say-in{max-width:980px;margin:0 auto;text-align:center;padding:0 clamp(20px,3.4vw,56px)}
.ib-say-label{display:flex;align-items:center;justify-content:center;gap:12px;margin:0 0 30px!important;font-size:14px;font-weight:700;color:var(--teal,#0E7C77)}
.ib-say-label:before,.ib-say-label:after{content:"";width:34px;height:1px;background:currentColor}
.ib-say-text{margin:0!important;font-size:clamp(24px,2.6vw,40px);font-weight:700;line-height:1.5;color:var(--navy,#001C3C);text-wrap:balance}
.ib-w{color:#0a2e4d26;transition:color .35s}
.ib-w.is-on{color:var(--navy,#001C3C)}
.ib-w-em.is-on{color:var(--teal,#0E7C77)}
.ib-say-sign{display:flex;align-items:center;justify-content:center;gap:12px;margin:40px 0 0!important;font-size:15px;font-weight:600;color:#0a2e4d99}
.ib-say-sign i{width:9px;height:9px;border-radius:50%;background:#D9A520}
html[dir=ltr] .ib-say-text{font-family:Poppins,sans-serif;font-weight:500;letter-spacing:-.03em;line-height:1.3}

/* ---------- Around your hotel: two rows of rounded labels drifting in opposite directions (soft fade at both edges). ---------- */
#main>section.ib-street{position:relative;z-index:2;padding:clamp(70px,8vw,120px) 0 clamp(70px,8vw,120px);background:#F4F6F8;overflow:hidden}
.ib-street-head{max-width:820px;margin:0 auto 54px;padding:0 20px;text-align:center}
.ib-street-label{margin:0 0 16px!important;font-size:14px;font-weight:700;color:var(--teal,#0E7C77)}
.al-page .ib-street h2{margin:0 0 18px;font-size:clamp(36px,4.4vw,64px);font-weight:800;line-height:1.15;color:var(--navy,#001C3C)}
.al-page .ib-street h2 span{color:var(--teal,#0E7C77)}
.ib-street-lead{max-width:560px;margin:0 auto!important;font-size:clamp(16px,1.2vw,18px);line-height:1.85;color:#0a2e4dbf}
.ib-chips{direction:ltr;overflow:hidden;padding:7px 0;-webkit-mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.ib-chips-run{display:flex;width:max-content;animation:ib-chips 60s linear infinite}
.ib-chips-b .ib-chips-run{animation-direction:reverse;animation-duration:70s}
.ib-chips-half{display:flex;gap:14px;padding-right:14px}
.ib-chip{direction:rtl;display:inline-flex;align-items:center;gap:12px;padding:16px 26px;border-radius:999px;background:#fff;border:1px solid #0a2e4d14;font-size:clamp(16px,1.3vw,20px);font-weight:600;color:var(--navy,#001C3C);white-space:nowrap}
html[dir=ltr] .ib-chip{direction:ltr}
.ib-chip i{width:8px;height:8px;border-radius:50%;background:var(--teal,#0E7C77)}
.ib-chips-b .ib-chip{background:transparent;border-color:#0a2e4d2e}
.ib-chips-b .ib-chip i{background:#D9A520}
.ib-chips:hover .ib-chips-run{animation-play-state:paused}
@keyframes ib-chips{to{transform:translateX(-50%)}}
.ib-street-note{max-width:620px;margin:40px auto 0!important;padding:0 20px;font-size:14.5px;line-height:1.8;text-align:center;color:#0a2e4d99}

/* ---------- Book in one chat: heading + points + WhatsApp button beside a phone-like card; messages pop in one by one. ---------- */
#main>section.ib-chat{position:relative;z-index:2;padding:clamp(80px,9vw,130px) 0;background:#F4F6F8}
.ib-chat-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:clamp(40px,6vw,110px);align-items:center;max-width:1240px;margin:0 auto;padding:0 clamp(20px,3.4vw,56px)}
.ib-chat-label{margin:0 0 14px!important;font-size:14px;font-weight:700;color:var(--teal,#0E7C77)}
.al-page .ib-chat h2{margin:0 0 22px;font-size:clamp(36px,4.4vw,64px);font-weight:800;line-height:1.15;color:var(--navy,#001C3C)}
.al-page .ib-chat h2 span{display:block;color:var(--teal,#0E7C77)}
.ib-chat-lead{max-width:520px;margin:0 0 26px!important;font-size:clamp(16px,1.25vw,18px);line-height:1.85;color:#0a2e4dbf}
.ib-chat-points{margin:0 0 34px;padding:0;list-style:none}
.ib-chat-points li{display:flex;gap:12px;align-items:center;padding:12px 0;border-top:1px solid #0a2e4d14;font-size:16px;font-weight:600;color:var(--navy,#001C3C)}
.ib-chat-points li:last-child{border-bottom:1px solid #0a2e4d14}
.ib-chat-points i{flex:none;width:8px;height:8px;border-radius:50%;background:#D9A520}
.ib-chat-copy .button{display:inline-flex;align-items:center;gap:10px}
/* Phone: the same WhatsApp-style iPhone as the Ghazza page (light chat, IBM Plex Sans Arabic). */
.ibw-phone{position:relative;box-sizing:border-box;width:316px;height:620px;margin-inline:auto;padding:9px;border-radius:50px;background:#0d0d0f;box-shadow:0 0 0 1.5px #3a3a3f,0 50px 90px -40px #000000cc}
.ibw-screen{position:relative;display:flex;flex-direction:column;height:100%;overflow:hidden;border-radius:41px;background:#efeae2;font-family:"IBM Plex Sans Arabic",-apple-system,sans-serif}
.ibw-status{display:flex;align-items:center;justify-content:space-between;height:40px;padding:0 26px 0 30px;background:#008069;color:#fff;font:600 13px/1 "IBM Plex Sans Arabic",-apple-system,sans-serif}
.ibw-island{position:absolute;top:10px;left:50%;width:84px;height:24px;margin-left:-42px;border-radius:20px;background:#0d0d0f}
.ibw-sys{display:flex;align-items:center;gap:5px}.ibw-sys svg{height:10px;width:auto;fill:currentColor}
.ibw-bar{display:flex;align-items:center;gap:8px;padding:4px 12px 10px 6px;background:#008069;color:#fff}
html[dir=rtl] .ibw-bar{padding:4px 6px 10px 12px}
.ibw-back{flex:none;width:22px;height:22px}
html[dir=rtl] .ibw-back{transform:scaleX(-1)}
.ibw-avatar{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#fff;overflow:hidden}
.ibw-avatar img{width:82%;height:auto}
.ibw-who{display:flex;flex-direction:column;flex:1;min-width:0;line-height:1.25}
.ibw-who b{font-size:14.5px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ibw-who small{font-size:11.5px;color:#ffffffcc}
.ibw-acts{display:flex;gap:16px}.ibw-acts svg{width:21px;height:21px}
/* chat wallpaper: WhatsApp beige with a faint dotted texture */
.ibw-feed{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:0;padding:10px 10px 8px;overflow:hidden;background:#efeae2 radial-gradient(circle,#00000012 1px,transparent 1.3px) 0 0/16px 16px}
.ibw-day{align-self:center;margin-bottom:auto}
.ibw-day span{display:inline-block;padding:4px 10px;border-radius:7px;background:#fff;box-shadow:0 1px .5px #0b141a21;font-size:11px;font-weight:500;color:#54656f}
.ibw-msg{display:flex;max-height:0;opacity:0;transform:translateY(12px) scale(.98);transition:max-height .6s cubic-bezier(.22,1,.36,1),margin .6s cubic-bezier(.22,1,.36,1),opacity .45s,transform .55s cubic-bezier(.22,1,.36,1)}
.ibw-msg.is-in{max-height:320px;margin-top:6px;opacity:1;transform:none}
.ibw-in{justify-content:flex-start}
.ibw-out{justify-content:flex-end}
.ibw-bubble{position:relative;max-width:82%;padding:6px 9px 5px;border-radius:8px;box-shadow:0 1px .5px #0b141a21;font-size:13.5px;line-height:1.6;color:#111b21}
.ibw-bubble p{margin:0}
.ibw-in .ibw-bubble{background:#fff;border-start-start-radius:0}
.ibw-out .ibw-bubble{background:#d9fdd3;border-start-end-radius:0}
/* bubble tails */
.ibw-bubble::before{content:"";position:absolute;top:0;width:8px;height:13px;background:inherit;clip-path:polygon(0 0,100% 0,100% 100%)}
.ibw-in .ibw-bubble::before{inset-inline-start:-7px;clip-path:polygon(100% 0,0 0,100% 100%)}
.ibw-out .ibw-bubble::before{inset-inline-end:-7px;clip-path:polygon(0 0,100% 0,0 100%)}
html[dir=rtl] .ibw-in .ibw-bubble::before{clip-path:polygon(0 0,100% 0,0 100%)}
html[dir=rtl] .ibw-out .ibw-bubble::before{clip-path:polygon(100% 0,0 0,100% 100%)}
.ibw-bubble time{display:flex;align-items:center;justify-content:flex-end;gap:3px;margin-top:1px;font:400 10.5px/1 "IBM Plex Sans Arabic",-apple-system,sans-serif;color:#667781}
.ibw-read{width:16px;height:11px;color:#53bdeb}
.ibw-offer{width:82%;box-sizing:border-box}
.ibw-opt{display:flex;align-items:center;gap:9px;margin-top:6px;padding:8px 9px;border-radius:7px;background:#f0f2f5;border:1.5px solid transparent;transition:border-color .5s,background-color .5s}
.ibw-opt-no{flex:none;font:600 11px/1 "IBM Plex Sans Arabic",sans-serif;color:#8696a0}
.ibw-opt-txt{display:flex;flex-direction:column;line-height:1.45}
.ibw-opt-txt b{font-size:13px;font-weight:700;color:#111b21}
.ibw-opt-txt small{font-size:11px;color:#667781}
.ibw-feed.is-picked .ibw-opt.is-pick{border-color:#00a884;background:#e7f8f2}
.ibw-feed.is-picked .ibw-opt.is-pick .ibw-opt-no{color:#00a884}
.ibw-done{display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding:8px 9px 5px}
.ibw-done>span:nth-child(2){display:flex;flex-direction:column;flex:1;min-width:0;font-size:12.5px;color:#54656f}
.ibw-done b{font-size:13.5px;color:#111b21}
.ibw-done time{flex-basis:100%}
.ibw-tick{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#00a884;color:#fff}
.ibw-tick svg{width:15px;height:15px}
.ibw-typing{display:flex;gap:4px;align-self:flex-start;max-height:0;padding:0 12px;border-radius:8px;border-start-start-radius:0;background:#fff;box-shadow:0 1px .5px #0b141a21;opacity:0;overflow:hidden;transition:max-height .35s,opacity .35s,padding .35s}
.ibw-typing.is-on{max-height:40px;margin-top:6px;padding:11px 12px;opacity:1}
.ibw-typing i{width:6px;height:6px;border-radius:50%;background:#8696a0;animation:ibw-dot 1.2s infinite}
.ibw-typing i:nth-child(2){animation-delay:.15s}.ibw-typing i:nth-child(3){animation-delay:.3s}
@keyframes ibw-dot{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-3px);opacity:1}}
.ibw-input{display:flex;align-items:center;gap:6px;padding:6px 8px 16px;background:#efeae2}
.ibw-field{display:flex;align-items:center;gap:8px;flex:1;min-width:0;height:40px;padding:0 12px;border-radius:999px;background:#fff;box-shadow:0 1px .5px #0b141a21;font-size:13px;color:#8696a0}
.ibw-field span{flex:1;white-space:nowrap;overflow:hidden}
.ibw-field svg{flex:none;width:20px;height:20px;color:#8696a0;fill:currentColor}
.ibw-field svg path{fill:none}
.ibw-mic{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#00a884;color:#fff}
.ibw-mic svg{width:19px;height:19px;fill:currentColor}.ibw-mic svg path{fill:none}
.ibw-screen,.ibw-screen *{font-family:"IBM Plex Sans Arabic",-apple-system,sans-serif!important}
html[dir=ltr] .ib-street,html[dir=ltr] .ib-chat{font-family:Poppins,sans-serif}
html[dir=ltr] .al-page .ib-street h2,html[dir=ltr] .al-page .ib-chat h2{font-family:Poppins,sans-serif;font-weight:500;letter-spacing:-.035em}
@media(max-width:900px){
 .ib-chat-in{grid-template-columns:1fr}
 .ib-chat-copy .button{display:flex;justify-content:center}
 .ibw-phone{margin-top:40px}
 .ib-chip{padding:12px 20px;font-size:15px}
 .ib-street-head{margin-bottom:36px}
 .ib-say-text{line-height:1.6;font-size:22px}
}
@media(max-width:600px){.ibw-phone{width:300px;height:600px}}
@media(max-width:340px){.ibw-phone{width:100%}}