cloud-atlas{display:block;container-type:inline-size;color:#edf6ff;font:15px/1.7 Tahoma,Arial,sans-serif;--gold:#ffd17b;--line:#26516b;--muted:#a6bed2}cloud-atlas *{box-sizing:border-box}cloud-atlas button,cloud-atlas select{font:inherit}cloud-atlas button,cloud-atlas a,cloud-atlas select{touch-action:manipulation}cloud-atlas button{cursor:pointer}cloud-atlas :focus-visible{outline:3px solid var(--gold);outline-offset:5px}cloud-atlas .mo-shell{direction:ltr;position:relative;isolation:isolate;overflow:hidden;padding:24px;min-height:660px;background:radial-gradient(ellipse at 49% 48%,#07395a 0,#041a32 37%,#010c1c 76%);border:1px solid #183a53;border-radius:24px;display:grid;grid-template-columns:minmax(170px,.75fr) minmax(500px,2.3fr) minmax(240px,.95fr);gap:22px;align-items:center}cloud-atlas .mo-shell:before{content:'';z-index:-1;position:absolute;inset:0;background-image:radial-gradient(circle,#b5dbff 0 1px,transparent 1.3px),radial-gradient(circle,#3e92c1 0 1px,transparent 1.3px);background-size:137px 109px,83px 173px;opacity:.25}cloud-atlas .mo-gallery,cloud-atlas .mo-card{direction:rtl}cloud-atlas h1{font-size:34px;line-height:1.3;margin:0 0 6px}cloud-atlas p{color:var(--muted);margin:0 0 18px}cloud-atlas .mo-kicker{color:var(--gold);font-size:12px;letter-spacing:2px}cloud-atlas .mo-photo{width:100%;height:154px;object-fit:cover;border-radius:15px;display:block;border:1px solid var(--line)}cloud-atlas .mo-photo.second{object-position:15% 80%;height:120px;margin-top:12px}cloud-atlas .mo-gallery label{display:block;font-size:12px;color:var(--muted);margin:24px 0 5px}cloud-atlas select{width:100%;color:white;border:1px solid var(--line);background:#061e33;border-radius:10px;padding:10px}cloud-atlas .mo-center{position:relative;min-width:0}cloud-atlas .mo-pick{direction:rtl;text-align:center;margin:0 0 16px}cloud-atlas .mo-pick label{display:block;font-size:12px;color:var(--muted);margin:0 0 6px}cloud-atlas .mo-pick select{max-width:360px;margin:0 auto;display:block;text-align:center}cloud-atlas .mo-tabs{direction:rtl;display:flex;gap:3px;justify-content:center;overflow:auto;border:1px solid var(--line);border-radius:24px;background:#051d33;padding:4px;scrollbar-width:thin}cloud-atlas .mo-tabs button{white-space:nowrap;border:0;border-radius:20px;background:none;color:#bcd0df;font-size:12px;padding:7px 10px}cloud-atlas .mo-tabs button[aria-pressed=true]{background:#0879ef;color:white;box-shadow:0 0 17px #078ffc66}cloud-atlas .mo-stage{height:530px;position:relative}cloud-atlas canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}cloud-atlas canvas:active{cursor:grabbing}cloud-atlas .mo-services{position:absolute;inset:0;pointer-events:none}cloud-atlas .mo-service{position:absolute;pointer-events:auto;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:5px;width:90px;color:#dceafa;background:none;border:0;padding:0;font-size:12px}cloud-atlas .mo-service-top{left:50%;top:15%}cloud-atlas .mo-service-bottom{left:50%;top:85%}cloud-atlas .mo-icon{width:47px;height:47px;border:1px solid #91b2cb;border-radius:50%;display:grid;place-items:center;background:#04172ce6;transition:.2s}cloud-atlas .mo-service:hover .mo-icon{background:#12344a;border-color:#fff;transform:scale(1.08)}cloud-atlas .mo-service[aria-pressed=true]{color:var(--gold)}cloud-atlas .mo-service[aria-pressed=true] .mo-icon{color:var(--gold);border-color:var(--gold);background:#463414;box-shadow:0 0 22px #ffbf4366}cloud-atlas svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}cloud-atlas .mo-controls{display:flex;justify-content:center;gap:10px;align-items:center;color:var(--muted);font-size:12px}cloud-atlas .mo-controls button{border:1px solid var(--line);border-radius:20px;color:#bce8ff;background:#061b30;padding:6px 13px}cloud-atlas .mo-card{border:0;border-radius:0;overflow:visible;background:none;box-shadow:none}cloud-atlas .mo-cover{height:205px;background-size:cover;background-position:center;position:relative}cloud-atlas .mo-cover:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 40%,#07192b)}cloud-atlas .mo-content{padding:24px}cloud-atlas .mo-service-name{display:flex;align-items:center;gap:10px;color:var(--gold)}cloud-atlas h2{font-size:27px;margin:12px 0 10px;line-height:1.4}cloud-atlas .mo-desc{font-size:14px;min-height:96px}cloud-atlas .mo-details{width:100%;text-align:center;display:block;text-decoration:none;padding:11px 15px;background:linear-gradient(#ffe3a1,#eab15b);color:#092037;font-weight:bold;border:0;border-radius:10px}cloud-atlas .mo-tip{position:absolute;pointer-events:none;z-index:3;border-radius:12px;background:#061a2ef0;border:1px solid #7edbff;padding:3px 10px;transform:translate(-50%,-140%);font-size:12px;white-space:nowrap}cloud-atlas .mo-empty{height:100%;display:grid;place-items:center;padding:20px;color:var(--muted)}cloud-atlas dialog{direction:rtl;color:white;background:#071d32;border:1px solid var(--line);border-radius:22px;width:min(480px,90vw);padding:28px}cloud-atlas dialog::backdrop{background:#000b;backdrop-filter:blur(7px)}cloud-atlas .mo-close{border:1px solid var(--line);border-radius:50%;background:transparent;color:white;float:left;width:38px;height:38px}cloud-atlas .mo-more{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:24px}cloud-atlas .mo-more button{border:1px solid var(--line);background:#102e46;color:white;padding:12px;border-radius:10px}
@container(max-width:1150px){cloud-atlas .mo-shell{grid-template-columns:170px minmax(430px,1fr);gap:14px;padding:16px}cloud-atlas .mo-card{grid-column:1/-1;display:grid;grid-template-columns:220px 1fr}cloud-atlas .mo-cover{height:100%;min-height:200px}cloud-atlas .mo-desc{min-height:0}cloud-atlas .mo-content{padding:18px}cloud-atlas .mo-stage{height:490px}}
@container(max-width:680px){cloud-atlas .mo-shell{display:flex;flex-direction:column;padding:16px;border-radius:16px;gap:22px}cloud-atlas .mo-center{order:1;width:100%}cloud-atlas .mo-gallery{order:3;width:100%}cloud-atlas .mo-card{order:2;display:block;width:100%}cloud-atlas .mo-stage{height:410px}cloud-atlas .mo-icon{width:38px;height:38px}cloud-atlas .mo-service{width:70px;font-size:11px;gap:2px}cloud-atlas .mo-tabs{justify-content:start}cloud-atlas .mo-card .mo-cover{height:180px;min-height:0}cloud-atlas .mo-gallery h1{font-size:26px}cloud-atlas .mo-photo{height:180px}cloud-atlas .mo-photo.second{display:none}}
@media(prefers-reduced-motion:reduce){cloud-atlas *{transition:none!important}}
/* Cloud Atlas palette and information circles */
cloud-atlas{color:#092858;--gold:#077bff;--line:#c3dff7;--muted:#5a7495;--circle:140px}
cloud-atlas .mo-shell{min-height:1040px;grid-template-columns:minmax(180px,.8fr) minmax(610px,2.6fr) minmax(245px,1fr);background:linear-gradient(rgba(230,247,255,.55),rgba(237,248,255,.72) 60%,rgba(237,248,255,.88)),url('/cloud-atlas/assets/istanbul-bg.png') center bottom/cover no-repeat;border-color:#d4eafa;gap:20px}
cloud-atlas .mo-shell:before{background:none}
cloud-atlas h1,cloud-atlas h2{color:#072858}cloud-atlas .mo-kicker{color:#0679ed}
cloud-atlas select{background:white;color:#0d3863;border-color:#bedbf2}
cloud-atlas .mo-photo{height:205px;border:4px solid white;box-shadow:0 8px 24px #2866a31c;border-radius:20px}
cloud-atlas .mo-photo.second{height:205px}
cloud-atlas .mo-pick{background:#fff;border:1px solid #d2eaff;border-radius:16px;padding:14px 18px;box-shadow:0 8px 20px #1875d61a;max-width:420px;margin:0 auto 16px}cloud-atlas .mo-pick label{color:#0679ed;font-weight:700;font-size:13px}cloud-atlas .mo-pick select{max-width:100%;font-size:15px;padding:11px}cloud-atlas .mo-tabs{background:#ffffffb3;border-color:#c5e2f6}
cloud-atlas .mo-tabs button{color:#32567d}
cloud-atlas .mo-tabs button[aria-pressed=true]{color:white;background:#087bff;box-shadow:0 4px 12px #258dff33}
cloud-atlas .mo-stage{height:800px}
cloud-atlas .mo-service{width:var(--circle);height:var(--circle);padding:13px 16px;border:2px solid #c3e2ff;border-radius:50%;background:#ffffffed;box-shadow:0 7px 20px #2b87d41c;color:#0b2d5a;gap:4px;justify-content:center;text-align:center;direction:rtl;line-height:1.35}
cloud-atlas .mo-service .mo-icon{width:28px;height:28px;background:none;border:0;box-shadow:none;color:#087bff}
cloud-atlas .mo-service svg{width:25px;height:25px}
cloud-atlas .mo-service strong{font-size:17px;font-weight:800;line-height:1.3}
cloud-atlas .mo-value{display:block;font-size:13px;font-weight:800;color:#087bff;min-height:1.4em}cloud-atlas .mo-value:empty:before{content:'…';opacity:.4;font-weight:400}cloud-atlas .mo-service[aria-pressed=true] .mo-value{color:#fff}cloud-atlas .mo-service .mo-brief{display:none}cloud-atlas .mo-brief{font-size:12px;line-height:1.5;max-width:108px;white-space:normal;overflow-wrap:anywhere;color:#325d89}cloud-atlas .mo-more button{display:flex;flex-direction:column;align-items:flex-start;gap:4px}cloud-atlas .mo-more-value{font-size:12px;font-weight:700;color:#087bff}cloud-atlas .mo-more-value:empty{display:none}
cloud-atlas .mo-arrow{display:none}
cloud-atlas .mo-service:hover{border-color:#087bff;background:#eff8ff;box-shadow:0 9px 25px #1681e833}
cloud-atlas .mo-service:hover .mo-icon{background:none;border:0;transform:none}
cloud-atlas .mo-service[aria-pressed=true]{color:white;background:linear-gradient(145deg,#1595ff,#0069ed);border-color:#64b9ff;box-shadow:0 8px 25px #087bff44}
cloud-atlas .mo-service[aria-pressed=true] .mo-icon{color:white;background:none;border:0;box-shadow:none}
cloud-atlas .mo-service[aria-pressed=true] .mo-brief{color:#fff}
cloud-atlas .mo-service[aria-pressed=true] .mo-arrow{color:#087bff;background:#fff}
cloud-atlas .mo-card{background:none;border:0;box-shadow:none;padding:0;border-radius:0}
cloud-atlas .mo-cover{border-radius:16px;height:230px;background-color:#e8f5ff}
cloud-atlas .mo-cover:after{background:none}
cloud-atlas .mo-content{padding:20px 12px 12px}
cloud-atlas .mo-desc{color:#5a7495;min-height:90px}
cloud-atlas .mo-details{background:linear-gradient(#128bff,#0067ef);color:white;box-shadow:0 5px 13px #087bff33}
cloud-atlas .mo-controls button{background:white;color:#086ccc;border-color:#c4dff6}
cloud-atlas .mo-tip{background:#fff;color:#082858;border-color:#8dc7f5;box-shadow:0 5px 15px #24588422}
cloud-atlas dialog{background:#fff;color:#082858;border-color:#beddf7;box-shadow:0 20px 70px #173b6455}
cloud-atlas dialog::backdrop{background:#1e436c55}
cloud-atlas .mo-close{color:#255c8f}
cloud-atlas .mo-more button{background:#eef7ff;color:#123c69;border-color:#cee5f8}
@container(max-width:1200px){cloud-atlas .mo-shell{grid-template-columns:180px minmax(610px,1fr);gap:18px;padding:18px}cloud-atlas .mo-card{grid-column:1/-1;display:grid;grid-template-columns:240px 1fr}cloud-atlas .mo-cover{height:100%;min-height:180px}cloud-atlas .mo-desc{min-height:0}}
@container(max-width:850px){cloud-atlas .mo-shell{display:flex;flex-direction:column;padding:14px;gap:24px}cloud-atlas .mo-center{order:1;width:100%}cloud-atlas .mo-card{order:2;width:100%;display:grid;grid-template-columns:1fr 1fr}cloud-atlas .mo-gallery{order:3;width:100%}cloud-atlas .mo-stage{height:auto}cloud-atlas canvas{height:400px;width:100%}cloud-atlas .mo-services{position:relative;inset:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 8px;padding:12px 0 20px;direction:rtl}cloud-atlas .mo-service{position:relative;left:auto!important;top:auto!important;transform:none;justify-self:center;width:140px;height:140px}cloud-atlas .mo-photo{height:220px}cloud-atlas .mo-photo.second{display:none}}
@container(max-width:620px){cloud-atlas .mo-services{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}cloud-atlas .mo-service{width:150px;height:150px}cloud-atlas .mo-card{display:block}cloud-atlas .mo-cover{height:220px}cloud-atlas .mo-controls{flex-wrap:wrap}cloud-atlas .mo-tabs{justify-content:start}}
@container(max-width:350px){cloud-atlas .mo-service{width:132px;height:145px;padding:10px}cloud-atlas .mo-service strong{font-size:14px}cloud-atlas .mo-services{gap:12px 4px}}
cloud-atlas.lang-en .mo-gallery,cloud-atlas.lang-en .mo-card,cloud-atlas.lang-en .mo-tabs,cloud-atlas.lang-en .mo-service,cloud-atlas.lang-en .mo-pick,cloud-atlas.lang-en dialog{direction:ltr}
/* Everything centered, both AR and EN */
cloud-atlas .mo-gallery,cloud-atlas .mo-card .mo-content,cloud-atlas .mo-desc,cloud-atlas h1,cloud-atlas h2,cloud-atlas .mo-country,cloud-atlas .mo-kicker,cloud-atlas .mo-dialog-body,cloud-atlas .mo-pick label{text-align:center}
cloud-atlas .mo-service-name{justify-content:center}
cloud-atlas .mo-more button{align-items:center;text-align:center}
/* Continent tabs (All / Asia / Europe / …) — bold and larger */
cloud-atlas .mo-tabs button{font-size:15px;font-weight:800;letter-spacing:.2px;padding:8px 15px}

/* "Choose your destination" — custom centered dropdown (replaces native <select>
   so every city row is centered in every browser, AR and EN). */
cloud-atlas .mo-pick{text-align:center}
cloud-atlas .mo-pick-field{position:relative;max-width:360px;margin:0 auto}
cloud-atlas .mo-pick-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;color:#0d3863;background:#fff;border:1px solid #bedbf2;border-radius:10px;padding:11px 14px;font-size:15px;font-weight:800;text-align:center}
cloud-atlas .mo-pick-caret{font-size:12px;opacity:.65}
cloud-atlas .mo-pick-list{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 6px);margin:0;padding:6px;list-style:none;max-height:280px;overflow:auto;background:#fff;border:1px solid #bedbf2;border-radius:12px;box-shadow:0 18px 40px #1875d633}
cloud-atlas .mo-pick-list li{padding:9px 12px;border-radius:8px;font-size:15px;font-weight:700;color:#0d3863;text-align:center;cursor:pointer}
cloud-atlas .mo-pick-list li:hover,cloud-atlas .mo-pick-list li:focus{background:#e8f3ff;outline:none}
cloud-atlas .mo-pick-list li[aria-selected="true"]{background:#0879ef;color:#fff}

/* Earth design: both side panels are just photos now — no service name,
   description or button — except the city name stays on the right panel
   only, as a plain caption under its two photos. Force block layout so the
   two-photo stack fills the panel at every width (overrides the old
   image+text grid splits below); keep .mo-details in the DOM (hidden) since
   tapping a service circle still needs to click it to open that service. */
cloud-atlas .mo-card{display:block}
cloud-atlas .mo-card .mo-service-name,cloud-atlas .mo-card .mo-desc,cloud-atlas .mo-card .mo-details{display:none}
cloud-atlas .mo-card .mo-content{padding:14px 4px 4px}
cloud-atlas .mo-card h2{font-size:20px;margin:0;text-align:center}
cloud-atlas .mo-gallery .mo-kicker,cloud-atlas .mo-gallery h1,cloud-atlas .mo-gallery .mo-country{display:none}