/* White studio atmosphere with the platform's emerald colour in the mist. */
:root{--bg:#fbfdfc;--text:#193d34;--muted:#577369;--gold:#187b5f;--line:#225f4324;color-scheme:light}
html{scroll-behavior:auto}
body{background:#f7faf8;color:var(--text)}
.site-shell{box-shadow:none;background:#fbfdfc}
.hero{background:#f8fcfa}
.hero-atmosphere{background:radial-gradient(ellipse at 24% 43%,#c5eadb 0%,#e6f4ed 33%,#fbfdfc 70%)}
.hero-atmosphere:before{display:none}
.hero-atmosphere:after{background:radial-gradient(ellipse at 69% 3%,#c3e4d76b,transparent 52%),linear-gradient(0deg,#f8fcfa,transparent 34%)}
.hero-grid{opacity:.2;filter:brightness(.4)}
.header .brand small,.header nav,.header-tools button,.hero-coordinate,.model-callout{color:#526f64}
.header nav a{color:#557366}.header nav a:hover,.header nav a.active{color:#116f52}
.page-scrolled .header{background:#fbfdfcec;box-shadow:0 1px 0 var(--line)}
.side-rail{background:linear-gradient(#e6f4edee,#f8fcfae8);color:#235646}
.rail-mark,.rail-links a,.rail-caption,.rail-bottom{color:#39705b}
.hero-sub{color:#355e4e}.hero-detail{color:#597368}
.button,.hero-copy .button{background:#ffffff90;border-color:#398667;color:#175f47;box-shadow:0 8px 24px #2a775015}
.button:hover,.hero-copy .button:hover{background:#d5efe1;color:#154b39;border-color:#236d50}
.hero-track-tabs button,.hero-track-tabs button>span,.scroll-cue{color:#526f61}
.hero-track-tabs .selected,.hero-track-tabs .selected>span{color:#106d4e}
.hero-pagination,.gallery-navigation{background:linear-gradient(90deg,#d7ece1a8,#f4faf740 48%,#d7ece168);border-color:var(--line)}
.hero-pagination p,#hero-count i,.gallery-counter{color:#587466}
.round-arrow:hover{color:#103d2d}
.ambient-frame{border-color:#389977;opacity:.14;box-shadow:inset 0 0 28px #38997726,0 0 35px #3899771c;filter:blur(14px)}
.ambient-frame:before{border-color:#30835e}
.about{background:radial-gradient(ellipse at 85% 15%,#d9eee3b0,transparent 62%),linear-gradient(#fcfefd,#f1f8f4)}
.programs{background:radial-gradient(ellipse at 42% 48%,#cce8d9a0,transparent 65%),linear-gradient(#f8fcfa,#fcfefd)}
.launch{background:radial-gradient(ellipse at 50% 65%,#d0eadbc0,transparent 68%),#f8fcfa}
.section-kicker,.section-kicker>[lang=en],.about-copy p,.about-photo figcaption p{color:#446858}
.about-copy .muted,.program-heading>p,.about-photo figcaption>span,.launch-body .eyebrow,.launch-body>p:not(.eyebrow){color:#607b6e}
.about-banner h2,.about-banner p,.about-banner>div>span{color:#f7fff9}
.gallery-main{box-shadow:0 28px 65px #1c5f3e22;border-color:#49785b30}
.gallery-side{box-shadow:0 20px 50px #1c5f3e20}
.gallery-copy h3,.gallery-copy p,.gallery-meta,.track-eyebrow{color:#f1f8f0}
.program-tabs button{color:#536f61}.program-tabs .selected{color:#166b4d;background:#bcdfcd66}
.gallery-dots>button{background:#91afa0}.gallery-dots .selected{background:#187b5f}
.launch-detail{background:#ffffffa8;color:#446858}
.launch-watermark{color:#2777470a}
footer{background:#e9f4ed;color:#5e7769}
.model-stage canvas,.model-stage.tracing canvas{filter:none;transition:none}
.emblem-halo{display:none}.stage-orbit{display:none}
.model-stage:before{content:'';position:absolute;z-index:0;left:28%;bottom:17%;width:44%;height:8%;border-radius:50%;background:radial-gradient(ellipse,#164f384f,transparent 68%);filter:blur(12px);transform:rotate(-8deg);opacity:calc(.2 + var(--build-progress,0) * .8);pointer-events:none}
.model-stage canvas{position:relative;z-index:1}
.loading-screen{position:fixed;inset:0;z-index:1000;isolation:isolate}
.loading-surface{position:absolute;inset:0;background:radial-gradient(ellipse at 47% 49%,#d3ecdf,#f5faf7 55%,#fff 90%);transition:opacity 850ms ease}
.loading-stage{position:absolute;min-height:0!important;max-width:none;z-index:1;cursor:default}
.loading-stage .model-loader,.loading-stage .model-callout{display:none}
.loading-stage .model-fallback{display:none}.loading-stage.unavailable .model-fallback{display:block;opacity:1}
.loading-brand{position:absolute;top:8%;left:0;right:0;display:flex;gap:13px;align-items:center;justify-content:center;color:#285b46;font-size:14px;letter-spacing:.4px;z-index:2}
.loading-brand img{width:28px;height:34px}
.loading-caption{position:absolute;bottom:8%;left:20px;right:20px;text-align:center;z-index:2;pointer-events:none;color:#245640}
.loading-caption b{display:block;font-size:18px;font-weight:500}.loading-caption>span{display:block;font-size:11px;margin-top:10px;color:#779486}
.loading-meter{width:140px;height:2px;background:#bed5c9;overflow:hidden;margin:22px auto 0}.loading-meter i{display:block;height:100%;background:#22815c;transform:scaleX(var(--loading-progress,0));transform-origin:center;transition:transform .12s linear}
.loading-brand,.loading-caption{transition:opacity .5s ease,translate .7s ease}
.is-docking .loading-surface,.is-docking .loading-brand,.is-docking .loading-caption{opacity:0}.is-docking .loading-caption{translate:0 8px}
.is-docking{pointer-events:none}
.intro-pending .site-shell,.intro-pending .side-rail{visibility:hidden;opacity:0}
.intro-revealing .header,.intro-revealing .side-rail,.intro-revealing .hero-copy,.intro-revealing .hero-coordinate,.intro-revealing .hero-footer,.intro-revealing .hero-pagination{animation:none}
.motion-ready .section .about-banner,.motion-ready .section .about-layout,.motion-ready .section .program-heading,.motion-ready .section .gallery,.motion-ready .section .launch-body,.motion-ready .section.in-view .about-banner,.motion-ready .section.in-view .about-layout,.motion-ready .section.in-view .program-heading,.motion-ready .section.in-view .gallery,.motion-ready .section.in-view .launch-body{opacity:var(--panel-opacity,1);transform:translate3d(0,var(--panel-shift,0px),0) scale(var(--panel-scale,1));filter:none;transition:none;will-change:transform,opacity}
.launch:after{content:'';position:absolute;left:14%;top:5%;width:72%;height:88%;background:#24644c;mask:url('assets/riyadh-towers-white-line-art.png') center/contain no-repeat;mask-mode:luminance;opacity:.10;filter:blur(.35px);z-index:-1;pointer-events:none}
.architecture-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3;pointer-events:none;mix-blend-mode:multiply;opacity:.18;filter:grayscale(1) contrast(.28) brightness(1.57) blur(.35px);mask-image:radial-gradient(ellipse at 38% 45%,black 12%,#0009 46%,transparent 78%);scale:1.035;translate:calc(var(--pointer-x,0) * -16px) calc(var(--pointer-y,0) * -12px + var(--scroll-depth,0px));transition:translate .7s cubic-bezier(.16,1,.3,1)}
.section>.architecture-film{z-index:-1;opacity:.12;mask-image:radial-gradient(ellipse at 50% 48%,black 15%,transparent 77%)}
.motion-geometry{position:absolute;width:180px;max-height:230px;object-fit:contain;z-index:-1;mix-blend-mode:multiply;opacity:.075;pointer-events:none;animation:technical-float 24s ease-in-out infinite alternate;animation-play-state:paused}
.media-active .motion-geometry{animation-play-state:running}
.motion-geometry{margin-left:calc(var(--pointer-x,0) * 12px);margin-top:calc(var(--pointer-y,0) * 8px);transition:margin 1s ease}
.hero .geometry-polygon{left:8%;top:14%;width:155px;rotate:-10deg}.hero .geometry-circle{right:10%;top:14%;width:180px;rotate:8deg;animation-delay:-11s}
.about .geometry-polygon{right:2%;bottom:4%;width:185px;rotate:14deg;opacity:.055}
.programs .geometry-circle{left:2%;top:30%;width:210px;rotate:-12deg;animation-delay:-8s}
@keyframes technical-float{from{translate:0 0;rotate:-3deg}to{translate:16px -22px;rotate:3deg}}
/* Entrances use opacity and transforms only; the 3D canvas keeps its own timeline. */
.soft-motion-ready .soft-enter:not(.is-revealed){opacity:0;translate:0 18px}
.soft-enter.is-entering{will-change:translate,opacity}
.hero h1>.soft-enter{display:inline-block}
.program-tabs,.about-number{position:relative}
.section:before,.hero-pagination:before,.gallery-navigation:before,.program-tabs:before,.about-number:before{content:'';position:absolute;left:0;right:0;top:-1px;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent 45%,#65b89988 48.5%,#e8fff5 50%,#46a47b99 51.5%,transparent 55%);background-size:300% 100%;filter:drop-shadow(0 0 3px #4dba8990);animation:separator-laser 5s linear infinite}
.gallery-navigation:before,.about-number:before{animation-delay:-4s}.program-tabs:before{animation-delay:-8s}
.eyebrow-rule{background:linear-gradient(90deg,#83b49c55,#267657aa,#83b49c55);background-size:220% 100%;animation:separator-glide 10s ease-in-out infinite alternate}
@keyframes separator-glide{from{background-position:15% 0}to{background-position:85% 0}}
@keyframes separator-laser{from{background-position:100% 0}to{background-position:0% 0}}
/* Controls attract the pointer; photographs tilt without replacing gallery transforms. */
.button,.round-arrow,.social-icon,.hero-track-tabs button,.program-tabs button,.header nav a,.rail-links a,.brand,.text-link,.scroll-cue,.rail-mark,.gallery-dots button,.header-tools button,#gallery-autoplay{translate:var(--magnet-x,0px) var(--magnet-y,0px);transition:translate .35s cubic-bezier(.16,1,.3,1),background .25s,color .25s,box-shadow .3s}
.hero h1,h2,h3{transition:text-shadow .45s ease}
.hero h1:hover,h2:hover,h3:hover{text-shadow:0 4px 22px #559e7c28}
.button:hover,.button:focus-visible{box-shadow:0 10px 30px #2a77502b}
.about-photo,.gallery-main,.gallery-side{rotate:1 1 0 calc(var(--tilt-x,0deg) + var(--tilt-y,0deg));transition:rotate .6s cubic-bezier(.16,1,.3,1),box-shadow .4s}
.about-photo>img{transition:scale .8s cubic-bezier(.16,1,.3,1)}
.about-photo:hover>img{scale:1.025}
.hero-atmosphere:after{translate:calc(var(--pointer-x,0) * 20px) calc(var(--pointer-y,0) * 14px);transition:translate 1s ease}
.ambient-frame{margin-left:calc(var(--pointer-x,0) * 10px);margin-top:calc(var(--pointer-y,0) * 10px);transition:margin .9s ease}
.launch:after{translate:calc(var(--pointer-x,0) * -10px) calc(var(--pointer-y,0) * -8px + var(--scroll-depth,0px));transition:translate .8s ease}
.social-links{display:flex;align-items:center;gap:12px;direction:ltr}
.rail-social{flex-direction:column;gap:12px;margin-top:40px;flex-shrink:0}
.social-icon{position:relative;display:grid;place-items:center;width:34px;height:34px;border:1px solid #356b4e25;border-radius:50%;background:#ffffff60;color:#356b55}
.social-icon svg{width:17px;height:17px;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}
.social-icon:hover,.social-icon:focus-visible{color:#0f6b49;background:#e4f5eb;box-shadow:0 4px 18px #2b855529}
.social-name{position:absolute;opacity:0;visibility:hidden;pointer-events:none;inset-inline-end:calc(100% + 10px);top:50%;translate:0 -50%;background:#f8fcfa;border:1px solid #356b4e20;border-radius:5px;padding:6px 9px;font:10px Inter,sans-serif;white-space:nowrap;transition:opacity .2s}
html[lang=en] .rail-social .social-name{inset-inline-end:auto;inset-inline-start:calc(100% + 10px)}
.social-icon:hover .social-name,.social-icon:focus-visible .social-name{opacity:1;visibility:visible}
.footer-social .social-name{inset-inline-end:auto;left:50%;top:auto;bottom:calc(100% + 8px);translate:-50% 0}
.social-notice{position:fixed;bottom:24px;left:50%;translate:-50% 0;z-index:100;padding:15px 22px;max-width:90%;width:max-content;background:#f8fcfa;border:1px solid #356b4e30;border-radius:10px;box-shadow:0 10px 40px #164b3820;font-size:13px;color:#285942}
footer{flex-wrap:wrap;gap:24px}footer>a:last-child{margin-inline-start:auto}
/* Balance the footer columns so the social group sits at the exact content centre. */
footer{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center}
footer>.brand{justify-self:start}footer>.footer-social{justify-content:center;justify-self:center}footer>a:last-child{justify-self:end;margin-inline-start:0}
.header,html[lang=ar] .header{transition:transform .4s cubic-bezier(.22,1,.36,1),opacity .3s ease,background .4s,box-shadow .4s}
html.header-hidden .header,html[lang=ar].header-hidden .header{transform:translateY(-110%);opacity:0;pointer-events:none}
html.header-hidden .header:has(:focus-visible){transform:none;opacity:1;pointer-events:auto}
.simple-geometry{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.primitive{position:absolute;display:block;color:#477d692e;border-color:currentColor;translate:calc(var(--pointer-x,0) * 15px) calc(var(--pointer-y,0) * 10px + var(--scroll-depth,0px));transition:translate 1s ease;animation:primitive-drift 26s ease-in-out infinite alternate;animation-play-state:paused}
.primitive-square{width:80px;height:80px;border:1px solid;top:14%;left:12%;rotate:24deg}
.primitive-ring{width:110px;height:110px;border:1px solid;border-radius:50%;right:7%;bottom:15%;animation-delay:-9s}
.primitive-ring:after{content:'';position:absolute;inset:12px;border:1px dashed currentColor;border-radius:50%}
.primitive-cube{width:110px;left:7%;bottom:15%;stroke-width:.8;animation-delay:-14s}
.primitive-triangle{width:85px;right:10%;top:18%;stroke-width:.8;animation-delay:-5s}
.about .primitive-square{left:48%;top:62%;width:55px;height:55px}.about .primitive-cube{bottom:5%;left:3%;width:85px}
.programs .primitive-ring{right:5%;top:12%;bottom:auto;width:80px;height:80px}.programs .primitive-triangle{top:auto;bottom:9%;right:6%}
.launch .primitive-square{left:9%;top:20%;width:65px;height:65px}.launch .primitive-cube{left:auto;right:10%;bottom:20%;width:95px}
.launch .primitive-ring{right:auto;left:12%;bottom:14%;width:85px;height:85px}
.motion-ready .scene-active .primitive{animation-play-state:running}
@keyframes primitive-drift{from{transform:translateY(-7px) rotate(-4deg)}to{transform:translateY(9px) rotate(5deg)}}
@media(min-height:900px) and (min-width:781px){.rail-social{position:absolute;top:50%;margin-top:0;translate:0 -50%}}
@media(max-width:1100px){footer{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}footer>.footer-social{grid-row:2;grid-column:1/-1;width:100%;padding-top:16px;border-top:1px solid var(--line)}footer>a:last-child{grid-column:2;grid-row:1}}
@media(max-width:780px){.primitive-square{width:45px;height:45px;left:4%;top:9%}.primitive-ring{width:60px;height:60px;right:3%;bottom:9%}.primitive-cube{width:65px;left:3%;bottom:8%}.primitive-triangle{width:55px;right:4%;top:17%}.simple-geometry{opacity:.7}}
@media(prefers-reduced-motion:reduce){.primitive{animation:none;translate:none}.header,html[lang=ar] .header{transition:none}}
@media(max-height:800px) and (min-width:781px){.rail-social{gap:8px;margin-top:25px}.rail-caption{font-size:6px;letter-spacing:1.8px}.rail-links{margin-top:60px;gap:26px}}
@media(max-width:780px){.architecture-film{opacity:.12}.section>.architecture-film{opacity:.10}.footer-social{order:2;width:100%;justify-content:center;padding-top:16px;border-top:1px solid var(--line)}.footer-social .social-icon{width:38px;height:38px}.about-photo:hover>img{scale:1}}
@media(prefers-reduced-motion:reduce){.architecture-film,.launch:after,.hero-atmosphere:after{translate:none;scale:1}.about-photo,.gallery-main,.gallery-side{rotate:none}.about-photo>img{scale:1}.button,.round-arrow,.social-icon,.hero-track-tabs button,.program-tabs button,.header nav a,.rail-links a{translate:none}}
@media(max-width:780px){.hero-atmosphere{background:radial-gradient(ellipse at 35% 60%,#d3ecdf,#f8fcfa 74%)}.hero-atmosphere:after{background:linear-gradient(0deg,#f8fcfa,transparent 28%)}.header nav{background:#f6fcf9f5;box-shadow:0 15px 40px #225c3d12;backdrop-filter:blur(18px)}.loading-brand{font-size:12px;top:7%}.loading-caption{bottom:8%}.loading-caption b{font-size:16px}.launch:after{left:0;width:100%;opacity:.08}.architecture-film{object-position:40% center;opacity:.11}.hero .geometry-polygon{left:-20px;top:12%;width:120px;opacity:.05}.hero .geometry-circle{right:-30px;top:50%;width:160px}.programs .geometry-circle{width:140px;opacity:.045}}
@media(prefers-reduced-motion:reduce){.soft-motion-ready .soft-enter:not(.is-revealed){opacity:1;translate:none}.section:before,.hero-pagination:before,.gallery-navigation:before,.program-tabs:before,.about-number:before,.eyebrow-rule,.motion-geometry{animation:none}}
.hero-track-tabs .track-icon,.program-tabs .track-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;flex:0 0 24px;color:#317960}
.track-icon:before{content:none;display:none}
.track-icon svg{display:block;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.hero-track-tabs button:hover .track-icon,.program-tabs button:hover .track-icon{color:#0c7853}
.track-info-open{overflow:hidden}
.track-info{position:fixed;inset:0;margin:auto;width:min(430px,calc(100% - 32px));max-height:calc(100dvh - 40px);overflow:auto;padding:25px 28px 24px;border:1px solid #a9cdbc80;border-radius:22px;background:radial-gradient(ellipse at 0 0,#daf1e6aa,transparent 65%),#f8fcfa;color:#214a39;box-shadow:0 30px 100px #153c3938;text-align:start}
.track-info[open]{animation:track-info-enter .38s cubic-bezier(.16,1,.3,1) both}
.track-info::backdrop{background:#153d322c;backdrop-filter:blur(7px);animation:track-info-backdrop .3s ease both}
.track-info-top,.track-info-heading,.track-info-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px}
.track-info-top{font-size:11px;color:#648574}
#track-info-close{display:grid;place-items:center;width:32px;height:32px;border:1px solid #9dbfac60;border-radius:50%;color:#3f6c56;transition:background .2s,rotate .25s}
#track-info-close:hover{background:#dcefe4;rotate:90deg}
#track-info-close:focus-visible{outline:2px solid #328b66;outline-offset:3px}
#track-info-close svg{width:15px;height:15px;stroke:currentColor;stroke-width:1.5;fill:none}
.track-info-heading{margin-top:22px}
.track-info-symbol{display:grid;place-items:center;width:54px;height:54px;border:1px solid #79af9240;border-radius:16px;background:linear-gradient(145deg,#e1f3e9,#f7fcf9);color:#207a55}
.track-info-symbol svg{width:28px;height:28px;stroke:currentColor;stroke-width:1.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
#track-info-number{font:10px Inter,sans-serif;letter-spacing:2px;color:#8baa9a}
.track-info h2{font-size:25px;line-height:1.5;letter-spacing:-.5px;margin:19px 0 11px}
.track-info p{font-size:14px;line-height:1.95;color:#5e796b;margin:0}
.track-info-bottom{margin-top:25px;padding-top:18px;border-top:1px solid #659b782c;font-size:10px;color:#648574}
.track-info-status{display:flex;align-items:center;gap:6px;white-space:nowrap;color:#287e58}
.track-info-status i{width:5px;height:5px;border-radius:50%;background:#56a27c;box-shadow:0 0 9px #56a27c55}
html[lang=en] .track-info h2{font-size:23px;letter-spacing:-.7px}
html[lang=en] .track-info p{font-size:13px;line-height:1.8}
@keyframes track-info-enter{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes track-info-backdrop{from{opacity:0}to{opacity:1}}
@media(max-width:780px){.track-info{padding:21px 22px;border-radius:19px}.track-info h2{font-size:23px}.program-tabs .track-icon{width:20px;flex-basis:20px}.track-info-bottom{gap:10px}}
@media(prefers-reduced-motion:reduce){.track-info[open],.track-info::backdrop{animation:none}#track-info-close{transition:none}}
html[lang=ar] #hero-title{direction:rtl;text-align:right;unicode-bidi:isolate;letter-spacing:0}
html[lang=ar] #hero-title>span{direction:rtl;unicode-bidi:isolate}
html[lang=ar] #hero-title>em{display:flex;flex-direction:row;direction:rtl;justify-content:flex-start;align-items:baseline;gap:.12em;unicode-bidi:isolate;letter-spacing:0}
.slogan-pause{direction:ltr;unicode-bidi:isolate;font-size:.65em;letter-spacing:0;order:2}
.slogan-words{direction:rtl;unicode-bidi:isolate;order:1}
.primitive-ring{animation:primitive-drift 26s ease-in-out infinite alternate,ring-breathe 5.5s ease-in-out infinite;animation-delay:-9s,-1.5s;animation-play-state:paused}
.primitive-ring:after{animation:inner-ring-breathe 5.5s ease-in-out infinite;animation-delay:-1.5s;animation-play-state:paused}
.geometry-circle{animation:technical-float 32s ease-in-out infinite alternate,circle-breathe 6.5s ease-in-out infinite;animation-play-state:paused}
.motion-ready .scene-active .primitive-ring:after,.motion-ready .scene-active .geometry-circle{animation-play-state:running}
@keyframes ring-breathe{0%,100%{scale:1;opacity:.65}50%{scale:1.045;opacity:1}}
@keyframes inner-ring-breathe{0%,100%{scale:.98;opacity:.55}50%{scale:1.025;opacity:.9}}
@keyframes circle-breathe{0%,100%{scale:.98}50%{scale:1.035}}
@media(prefers-reduced-motion:reduce){.primitive-ring,.primitive-ring:after,.geometry-circle{animation:none;scale:1}}
.engineering-question{display:flex;align-items:center;gap:11px;width:min(100%,375px);margin-top:17px;padding:12px 14px;border:1px solid #57967830;border-radius:12px;background:#f8fffb85;text-align:start;box-shadow:0 5px 25px #37734b06;color:#2a6550;translate:var(--magnet-x,0px) var(--magnet-y,0px);transition:background .25s,border-color .25s,translate .35s}
.engineering-question:hover,.engineering-question:focus-visible{background:#fafffd;border-color:#44876370}
.question-icon{width:26px;flex:0 0 26px}.question-icon svg{width:24px;height:24px;stroke-width:1.2}
.question-copy{display:flex;flex-direction:column;gap:4px;flex:1}.question-copy small{font-size:10px;font-weight:400;color:#789184}.question-copy b{font-size:12px;line-height:1.7;font-weight:500}.question-arrow{font:18px Inter,sans-serif;color:#60957c}
.hero-copy .button{margin-top:18px}
.idea-journey{position:relative;margin-top:64px;padding:30px 30px 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(110deg,#ecf7f180,transparent)}
.journey-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:30px}.journey-code{font:9px Inter,sans-serif;letter-spacing:1.8px;color:#759081}.journey-heading h3{font-size:22px;font-weight:600;color:#305b47;letter-spacing:0}
html[lang=ar] .journey-heading{direction:rtl}
html[lang=ar] .journey-heading h3{order:-1;text-align:right}
.journey-code{direction:ltr;unicode-bidi:isolate}
.journey-steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:relative;gap:20px;text-align:center}
.journey-steps:before,.journey-steps:after{content:'';position:absolute;inset-inline:12.5%;top:18px;height:1px;background:#83a58d35;pointer-events:none}
.journey-steps:after{background:linear-gradient(90deg,#9ccab0,#258362);box-shadow:0 0 6px #6ca88740;transform:scaleX(var(--journey-progress,0));transform-origin:right center;transition:transform .12s linear}
html[lang=en] .journey-steps:after{transform-origin:left center}
.journey-steps li{position:relative;z-index:1}.journey-node{display:grid;place-items:center;margin:auto;width:37px;height:37px;border:1px solid #b4cfbe;border-radius:50%;background:#f5fbf7;color:#739982;font:10px Inter,sans-serif;transition:background .5s,color .5s,border-color .5s,box-shadow .5s}
.is-connected .journey-node{background:#e1f3e9;border-color:#478f69;color:#287f59;box-shadow:0 0 0 5px #6da2820b}
.journey-steps h4{font-size:16px;font-weight:600;margin:15px 0 7px;color:#37634f}.journey-steps p{font-size:12px;line-height:1.8;color:#809486;margin:0}
.blueprint-measurements{position:absolute;inset:0;opacity:0;transition:opacity .6s;pointer-events:none;color:#3c826562;font:8px Inter,sans-serif;letter-spacing:1.4px;direction:ltr}
.blueprint-active .blueprint-measurements,.section:focus-within .blueprint-measurements,.hero:focus-within .blueprint-measurements{opacity:1}
.measure-axis{position:absolute;left:11%;top:25%;padding-top:9px;border-top:1px solid #588d6535;width:85px;text-align:center}
.measure-axis:before,.measure-axis:after{content:'';position:absolute;top:-4px;width:1px;height:8px;background:#588d6555}.measure-axis:before{left:0}.measure-axis:after{right:0}
.measure-angle{position:absolute;right:9%;top:28%;padding:12px 0 0 12px;border-top:1px solid #588d6535;border-left:1px solid #588d6535;width:36px;height:36px}
.measure-scale{position:absolute;left:8%;bottom:12%;padding-inline:8px;border-inline:1px solid #588d6535}
.upcoming-topic{position:relative;z-index:2;max-width:820px;margin:40px auto 10px;display:grid;grid-template-columns:1fr 1.1fr;border:1px solid #82ad932e;border-radius:17px;overflow:hidden;background:#f9fdfaeb;box-shadow:0 12px 45px #356f4910;text-align:start}
.upcoming-image{position:relative;min-height:250px;overflow:hidden}.upcoming-image img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:scale .8s}.upcoming-topic:hover .upcoming-image img{scale:1.035}
.upcoming-stamp{position:absolute;inset-inline-start:18px;top:18px;padding:7px 11px;border-radius:30px;background:#f1faf1e8;color:#487256;font-size:10px;backdrop-filter:blur(8px)}
.upcoming-copy{padding:30px}.upcoming-eyebrow{font-size:10px;color:#6e937d}.upcoming-copy h3{font-size:25px;line-height:1.55;font-weight:600;margin:12px 0;color:#2b5c46}.upcoming-copy p{font-size:13px;line-height:1.9;color:#788f7d}.upcoming-copy .text-link{margin-top:17px;font-size:11px;display:flex;gap:20px;align-items:center;color:#367d56;width:fit-content}
@media(max-width:1100px){.hero h1{font-size:44px}.engineering-question{padding:10px 12px}.question-copy b{font-size:11px}.hero-copy .eyebrow{margin-bottom:18px}}
@media(max-width:780px){.engineering-question{width:100%;max-width:430px;margin-top:15px}.hero h1{font-size:clamp(32px,8.7vw,58px)}.idea-journey{margin-top:36px;padding:25px 5px 18px}.journey-heading{align-items:start;flex-direction:column;gap:12px;margin-bottom:26px}.journey-code{font-size:7px;letter-spacing:1px}.journey-heading h3{font-size:20px}.journey-steps{gap:6px}.journey-node{width:29px;height:29px;font-size:9px}.journey-steps:before,.journey-steps:after{top:14px}.journey-steps h4{font-size:13px;margin-top:12px}.journey-steps p{font-size:10px;line-height:1.7}.upcoming-topic{grid-template-columns:1fr;max-width:440px;margin-top:32px}.upcoming-image{min-height:200px}.upcoming-copy{padding:23px}.upcoming-copy h3{font-size:23px}.measure-axis{left:5%;width:45px}.measure-scale{font-size:6px;left:3%}}
@media(prefers-reduced-motion:reduce){.journey-steps:after,.journey-node,.blueprint-measurements,.engineering-question,.upcoming-image img{transition:none}.upcoming-topic:hover .upcoming-image img{scale:1}}
.social-dialog{width:min(460px,calc(100% - 32px))}
#social-dialog-close{display:grid;place-items:center;width:32px;height:32px;border:1px solid #9dbfac60;border-radius:50%;color:#3f6c56;transition:background .2s,rotate .25s}
#social-dialog-close:hover{background:#dcefe4;rotate:90deg}
#social-dialog-close:focus-visible{outline:2px solid #328b66;outline-offset:3px}
#social-dialog-close svg{width:15px;height:15px;stroke:currentColor;stroke-width:1.5;fill:none}
.social-dialog h2{margin-top:21px;font-size:26px}
.social-dialog p{font-size:13px;line-height:1.8}
.social-dialog-links{display:grid;gap:9px;margin:22px 0 20px;direction:inherit}
.social-dialog-links .social-name{display:none}
.social-dialog-links .social-account{display:flex;align-items:center;gap:14px;width:100%;height:auto;min-height:58px;border:1px solid #8eb49d30;border-radius:12px;padding:10px 15px;background:#ffffff80;text-align:start;color:#397a5a;box-shadow:none;transition:background .25s,border-color .25s,translate .25s}
.social-dialog-links .social-account:hover{background:#e8f5ed;border-color:#51966f70;translate:0 -1px}
.social-dialog-links .social-account svg{width:23px;height:23px;flex:0 0 23px;stroke-width:1.3}
.social-account-copy{flex:1;display:flex;flex-direction:column;gap:5px}
.social-account-copy b{font:500 12px Inter,sans-serif;color:#365e49;direction:ltr;unicode-bidi:isolate;align-self:flex-start}
.social-account-copy small{font:10px Inter,sans-serif;color:#849d8d;align-self:flex-start}
.social-account-arrow{font:17px Inter,sans-serif;color:#80a28e}
.social-dialog-note{display:flex;align-items:center;justify-content:center;gap:8px;padding-top:16px;border-top:1px solid var(--line);font-size:11px;color:#7e9789}
html[lang=en] .social-dialog h2{font-size:23px}
@media(max-width:780px){.social-dialog{padding:21px 22px}.social-dialog h2{font-size:24px}.social-dialog-links .social-account{min-height:56px;padding:10px 13px}}
@media(prefers-reduced-motion:reduce){#social-dialog-close,.social-dialog-links .social-account{transition:none}.social-dialog-links .social-account:hover{translate:none}}
/* Floating navigation, with a compact mobile menu and the existing scroll hide. */
.header,html[lang=ar] .header{top:14px;left:calc(var(--rail) + 24px);right:24px;width:auto;height:76px;padding:0 26px;border:1px solid #8db6a43d;border-radius:24px;background:#fafffcad;backdrop-filter:blur(20px);box-shadow:0 8px 32px #22573e0d;gap:22px}
html[lang=ar] .header{left:24px;right:calc(var(--rail) + 24px)}
.page-scrolled .header{background:#fafffce8;box-shadow:0 10px 38px #22573e18}
.header .brand{min-width:0;gap:10px}
.header .brand img{width:33px;height:42px}
.header .brand b{font-size:16px}.header .brand small{font-size:6px;letter-spacing:1.3px;margin-top:5px}
.header nav{gap:4px;padding:5px;border:1px solid #76a89120;background:#dceee34a;border-radius:30px;font-size:12px}
.header nav a{padding:10px 18px;border-radius:24px;white-space:nowrap}
.header nav a.active{background:#197b5d;color:#fff;box-shadow:0 3px 10px #197b5d20}
.header nav a:hover:not(.active){background:#d8eee2;color:#176347}
.header nav .active:after{display:none}
.header-tools{gap:8px}
.header-tools #language{min-height:38px;padding:8px 13px;border:1px solid #80ad972f;border-radius:22px;background:#fff9;color:#316c53}
.header nav a:focus-visible,.header-tools button:focus-visible{outline:2px solid #2c9874;outline-offset:3px}
html.header-hidden .header,html[lang=ar].header-hidden .header{transform:translateY(calc(-100% - 24px))}
@media(max-width:1100px){.header,html[lang=ar] .header{padding-inline:20px;gap:12px}.header .brand b{font-size:14px}.header nav a{padding:10px 12px}}
@media(max-width:980px){
 .header,html[lang=ar] .header{display:flex;top:10px;left:calc(var(--rail) + 12px);right:12px;height:66px;padding:0 14px;border-radius:20px;gap:10px}
 html[lang=ar] .header{left:12px;right:calc(var(--rail) + 12px)}
 .header .brand img{width:27px;height:35px}.header .brand b,html[lang=en] .header .brand b{font-size:12px;white-space:normal}.header .brand small{font-size:5px;letter-spacing:.7px}
 .header-tools,html[lang=ar] .header-tools{display:flex;gap:6px;flex-shrink:0}
 .header-tools #language{font-size:10px;min-height:34px;padding:7px 10px}
 #menu-toggle,html[lang=ar] #menu-toggle{display:grid;place-items:center;width:34px;height:34px;padding:7px;border:1px solid #80ad972f;border-radius:50%;background:#fff9}
 #menu-toggle svg{width:18px;height:18px}
 .header nav{display:none;position:absolute;top:calc(100% + 10px);left:0;right:0;padding:10px;border:1px solid #8db6a44a;border-radius:20px;background:#f7fcf9f5;box-shadow:0 14px 35px #22573e18;flex-direction:column;align-items:stretch;gap:4px;backdrop-filter:blur(20px)}
 .header nav.open{display:flex}.header nav a{padding:12px 17px;border-radius:12px}
}
@media(prefers-reduced-motion:reduce){.header,html[lang=ar] .header{transition:none}}

/* Readable supporting copy over the pale architectural background. */
:root{--muted:#385b4d}
.hero-sub{font-size:23px;font-weight:700;color:#234e3f}
.hero-detail{font-size:18px;font-weight:500;line-height:1.85;color:#355a4b}
.engineering-question{color:#18553e;background:#f8fffbeb;border-color:#57967852}
.question-copy small{font-size:12px;font-weight:500;color:#426b56}
.question-copy b{font-size:15px;font-weight:700;line-height:1.65}
.question-arrow{color:#277656}
.hero-copy .button{font-size:16px;color:#126344}
.hero-track-tabs button,.hero-track-tabs button>span,.scroll-cue{color:#345e4b}
.track-caption b{font-size:14px;font-weight:700}
.program-tabs button{font-size:14px;font-weight:700;color:#345e4b}
.hero-pagination p{font-size:14px;font-weight:500;color:#3b604e}
.about-copy p{font-size:18px;font-weight:500;color:#355a4b}
.about-copy .muted,.program-heading>p{font-size:16px;font-weight:500;color:#426351}
.journey-steps p,.upcoming-copy p{font-size:14px;font-weight:500;color:#466753}
.upcoming-eyebrow,.upcoming-stamp{font-size:12px;font-weight:500;color:#3e664d}
.social-dialog p{font-size:15px;color:#426351}
.social-account-copy small,.social-dialog-note{font-size:12px;color:#486b54}
html[lang=en] .hero-sub{font-size:20px}
html[lang=en] .hero-detail{font-size:16px}
html[lang=en] .track-caption b,html[lang=en] .program-tabs button{font-size:12px;font-weight:600}
@media(max-width:1100px){
 .hero-sub{font-size:21px}.hero-detail{font-size:17px}
 .question-copy b{font-size:14px}.track-caption b{font-size:13px}
 .about-copy p{font-size:17px}.program-heading>p{font-size:15px}
}
@media(max-width:780px){
 .hero-sub{font-size:20px}.hero-detail{font-size:16px;line-height:1.8}
 .question-copy small{font-size:12px}.question-copy b{font-size:14px}
 .hero-copy .button{font-size:15px}.track-caption b{font-size:13px}
 .program-tabs button{font-size:12px}.hero-pagination p{font-size:12px}
 .about-copy p{font-size:17px}.about-copy .muted,.program-heading>p{font-size:15px}
 .journey-steps p{font-size:12px}
 html[lang=en] .hero-sub{font-size:18px}
 html[lang=en] .hero-detail{font-size:15px}
 html[lang=en] .hero-copy .button{font-size:13px}
 html[lang=en] .track-caption b,html[lang=en] .program-tabs button{font-size:11px}
}
