@font-face{font-family:'Bahij TheSansArabic';src:url('font/Bahij TheSansArabic/Bahij TheSansArabic-Light.ttf') format('truetype');font-weight:300;font-display:swap}
@font-face{font-family:'Bahij TheSansArabic';src:url('font/Bahij TheSansArabic/Bahij TheSansArabic-Plain.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Bahij TheSansArabic';src:url('font/Bahij TheSansArabic/Bahij TheSansArabic-SemiBold.ttf') format('truetype');font-weight:500 600;font-display:swap}
@font-face{font-family:'Bahij TheSansArabic';src:url('font/Bahij TheSansArabic/Bahij TheSansArabic-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:'Bahij TheSansArabic';src:url('font/Bahij TheSansArabic/Bahij TheSansArabic-ExtraBold.ttf') format('truetype');font-weight:800 900;font-display:swap}
:root{--teal:#6fb9a5;--ink:#042725;--ink2:#073835;--text:#042725;--muted:#b5c6bd;--line:rgba(231,193,116,.72);--sand:#f6ecd6;--white:#f6ecd6;--gold:#e4bd70;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}
html,body{height:100%;margin:0;overflow:hidden;touch-action:manipulation}
body{position:relative;background:radial-gradient(circle at 52% -18%,#0a4a43 0%,var(--ink) 52%,#021d1d 100%);color:var(--white);font-family:'Bahij TheSansArabic','Segoe UI',Tahoma,sans-serif}body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.18;background-image:repeating-linear-gradient(135deg,transparent 0 18px,rgba(226,191,116,.075) 19px 20px,transparent 21px 42px);mask-image:radial-gradient(ellipse at 50% 30%,#000,transparent 76%)}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
.screen{position:absolute;inset:0;display:flex;flex-direction:column;padding:92px 5vw 28px;transition:opacity .5s,transform .5s}
.screen.off{opacity:0;pointer-events:none;transform:scale(.98)}
body.lang-switching [data-i18n],body.lang-switching [data-i18n-alt],body.lang-switching [data-i18n-placeholder],body.lang-switching [data-i18n-aria]{opacity:.25;transform:translateY(4px)}
[data-i18n],[data-i18n-alt],[data-i18n-placeholder],[data-i18n-aria]{transition:opacity .2s,transform .2s}
.lang-picker{position:fixed;z-index:20;top:12px;left:50%;display:flex;gap:10px;align-items:center;justify-content:center;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 24px);padding:0}
.lang-btn{padding:12px 22px;border:1px solid rgba(111,185,165,.45);border-radius:999px;background:transparent;color:var(--white);font-weight:700;font-size:clamp(14px,1.4vw,20px);line-height:1;white-space:nowrap;transition:background .25s,color .25s,border-color .25s,transform .25s}
.lang-btn:hover{transform:translateY(-2px);border-color:var(--teal)}
.lang-btn.active{background:var(--teal);border-color:var(--teal);color:var(--ink)}
.fullscreen-btn{position:fixed;z-index:21;top:12px;left:12px;width:44px;height:44px;display:grid;place-items:center;border:1px solid rgba(111,185,165,.45);border-radius:50%;background:rgba(4,39,37,.72);color:var(--white);backdrop-filter:blur(8px);transition:background .25s,border-color .25s,transform .25s}
.fullscreen-btn:hover{background:var(--ink2);border-color:var(--teal);transform:scale(1.05)}
.fullscreen-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
/* attract */
#attract{align-items:center;justify-content:center;text-align:center}
html::before{content:'';position:fixed;inset:-20px;z-index:-3;pointer-events:none;background:var(--ink) url(../media/homecover.jpg) center/cover no-repeat;filter:blur(5px) saturate(1.1);transform:scale(1.03)}
html::after{content:'';position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,rgba(7,56,53,.58),rgba(4,39,37,.82) 85%)}
#attract>*{position:relative;z-index:1}
#attract h1{font-size:clamp(28px,4.4vw,58px);font-weight:700;margin:34px 0 14px;white-space:nowrap;line-height:1.3}
#attract p{position:relative;width:0;min-width:100%;white-space:nowrap;font-size:16px;font-weight:300;line-height:1.8;opacity:.8;margin:0;padding-top:18px}
.hero-text{display:flex;flex-direction:column;align-items:stretch;width:fit-content;max-width:94vw;margin-bottom:40px}
#attract p::before{content:'';position:absolute;top:0;left:50%;width:130px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);transform:translateX(-50%) scaleX(0);animation:lineDraw 1s .9s both cubic-bezier(.2,.8,.2,1)}
@keyframes lineDraw{to{transform:translateX(-50%) scaleX(1)}}
.touch{padding:20px 56px;border-radius:60px;background:var(--gold);color:var(--ink);font-weight:700;font-size:clamp(20px,2.6vw,30px);animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(228,189,112,.55)}70%{box-shadow:0 0 0 28px rgba(228,189,112,0)}100%{box-shadow:0 0 0 0 rgba(228,189,112,0)}}
.brand-hero{--rx:0deg;--ry:0deg;position:relative;width:clamp(140px,15vw,210px);perspective:900px;cursor:pointer}
.brand-tilt{position:relative;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.brand-tilt img{display:block;width:100%;height:auto;filter:url(#logoTint);animation:brandFloat 6s ease-in-out infinite}
.brand-tilt::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%) 200% 0/250% 100% no-repeat;-webkit-mask:url(../media/logowhite.png) center/contain no-repeat;mask:url(../media/logowhite.png) center/contain no-repeat;animation:brandShine 2.4s ease-in-out .8s infinite,brandFloat 6s ease-in-out infinite}
#attract:not(.off) .brand-hero{animation:brandIn 1.2s both cubic-bezier(.2,.8,.2,1)}
#attract:not(.off) h1{animation:brandIn 1s .25s both cubic-bezier(.2,.8,.2,1)}
#attract:not(.off) p{animation:brandIn 1s .4s both cubic-bezier(.2,.8,.2,1)}
.brand-hero.tap .brand-tilt{animation:brandPop .6s cubic-bezier(.2,.8,.2,1)}
@keyframes brandIn{from{opacity:0;transform:translateY(24px) scale(.94)}to{opacity:1;transform:none}}
@keyframes brandFloat{0%,100%{translate:0 0}50%{translate:0 -8px}}
@keyframes brandShine{0%{background-position:200% 0}45%,100%{background-position:-100% 0}}
@keyframes brandPop{40%{scale:1.08}100%{scale:1}}
/* home */
header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.logo{font-weight:700;font-size:clamp(20px,2.4vw,30px);display:flex;gap:12px;align-items:center}
.logo img{display:block;width:auto;height:clamp(44px,5vw,64px);max-width:min(240px,38vw);object-fit:contain}
.home-t{font-size:clamp(26px,3.6vw,46px);font-weight:700;margin:0 0 4px}
.home-s{opacity:.7;font-weight:300;margin:0 0 22px;font-size:clamp(15px,1.8vw,22px)}
.grid{flex:1;display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:1fr 1fr;gap:16px;min-height:0}
.tile{position:relative;overflow:hidden;border-radius:26px;padding:24px;text-align:right;background:linear-gradient(145deg,rgba(8,63,58,.95),rgba(3,42,40,.87));border:1px solid var(--line);display:flex;flex-direction:column;justify-content:flex-end;gap:6px;box-shadow:0 18px 48px rgba(0,17,16,.28);transition:transform .25s,background .25s}
.tile:active{transform:scale(.97);background:var(--line)}
.tile b{font-size:clamp(20px,2.4vw,32px);font-weight:700}
.tile span{font-weight:300;color:var(--muted);opacity:.9;font-size:clamp(13px,1.4vw,18px)}
.tile svg{position:absolute;top:18px;left:18px;width:64px;height:64px;opacity:.9}
.tile.a{grid-column:span 3;grid-row:span 1;background:var(--sand);color:var(--text);border-color:var(--sand)}
.tile.a span{opacity:1}
.tile.b{grid-column:span 3}
.tile.c{grid-column:span 2}
.tile.cta{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.tile.cta span{color:var(--ink);opacity:1}
@media(max-width:800px){.screen{overflow:hidden;padding-top:82px}html,body{overflow:hidden}.lang-picker{gap:6px;overflow:hidden;justify-content:flex-start}.lang-btn{padding:11px 15px}.grid{grid-template-columns:1fr 1fr;grid-template-rows:none}.tile,.tile.a,.tile.b,.tile.c{grid-column:span 1;min-height:150px}.tile.a{grid-column:span 2}}
/* panels */
.bar{display:flex;align-items:center;gap:18px;margin-bottom:18px}
.back{padding:14px 28px;border-radius:40px;background:var(--ink2);border:1px solid var(--line);font-weight:500;font-size:18px}
.bar h2{margin:0;font-size:clamp(24px,3.2vw,40px)}
.body{flex:1;display:flex;gap:24px;min-height:0}
.build-layout{flex-direction:row}
.build-visual{flex:0 0 60%;min-width:0;display:flex;flex-direction:column;gap:10px}
.build-details{flex:1;display:flex;flex-direction:column;justify-content:center;min-width:0}
.build-details .chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.build-details .chip{width:100%;padding:14px 10px}
.card{background:linear-gradient(145deg,rgba(8,63,58,.95),rgba(3,42,40,.87));border:1px solid var(--line);border-radius:26px;padding:26px;box-shadow:0 18px 48px rgba(0,17,16,.28)}
.stage{flex:1.6;position:relative;display:grid;place-items:center;padding:12px;min-height:0}
.stage-visual{position:relative;width:100%;height:auto;flex:1 1 auto;min-width:0;min-height:260px;overflow:hidden;display:grid;place-items:center}
.stage-image{position:absolute;inset:0;display:block;width:100%;height:100%;max-height:100%;min-width:0;min-height:0;object-fit:contain;transform:scale(1.35);filter:drop-shadow(0 18px 24px rgba(4,39,37,.22));will-change:transform}
.stage-image-next{z-index:1;pointer-events:none;transition:opacity .12s linear}
.tour-visual{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:18px;background:var(--ink)}
.tour-zoom{--z:1;position:absolute;inset:0;transform-origin:0 0;transition:transform 1.1s cubic-bezier(.22,.8,.2,1);will-change:transform}
.tour-zoom img{display:block;width:100%;height:100%;object-fit:cover;transition:filter 1.1s ease}
.tour-zoom.zoomed img{filter:brightness(.92) saturate(1.05)}
.tour-zoom .hs{scale:calc(1 / var(--z));transition:scale 1.1s cubic-bezier(.22,.8,.2,1),opacity .5s}
.tour-zoom.zoomed .hs:not(.on){opacity:.55}
.tour-visual::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 0 rgba(4,39,37,0);transition:box-shadow 1.1s ease}
.tour-visual:has(.zoomed)::after{box-shadow:inset 0 0 90px 10px rgba(4,39,37,.45)}
.screen:not(.off) .tour-visual{animation:tourReveal .7s both cubic-bezier(.2,.8,.2,1)}
@keyframes tourReveal{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
.info{flex:1;display:flex;flex-direction:column;gap:12px}
.info h3{margin:0;font-size:clamp(22px,2.6vw,34px);color:var(--gold)}
.info p{margin:0;font-size:clamp(16px,1.8vw,22px);line-height:1.8;font-weight:300}
.hs{position:absolute;left:calc(var(--x) * 1%);top:calc(var(--y) * 1%);width:44px;height:44px;transform:translate(-50%,-50%);cursor:pointer;animation:hotspotIn .5s both cubic-bezier(.2,.8,.2,1);animation-delay:calc(.35s + (var(--i) * .08s))}
.hs .p{position:absolute;inset:0;border-radius:50%;background:var(--teal);opacity:.38;animation:ring 2s infinite}
.hs .d{position:absolute;inset:9px;border-radius:50%;background:var(--white);border:3px solid var(--ink2);transition:transform .25s,background .25s,box-shadow .25s}
.hs.on .d{background:var(--white);transform:scale(1.18);box-shadow:0 0 0 5px rgba(228,189,112,.25)}
@keyframes hotspotIn{from{opacity:0;transform:translate(-50%,-50%) scale(.6)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes ring{0%{transform:scale(.6);opacity:.6}100%{transform:scale(1.6);opacity:0}}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{padding:14px 24px;border-radius:40px;border:1px solid var(--line);background:transparent;font-size:clamp(15px,1.6vw,20px)}
.chip.on{background:var(--gold);color:var(--ink);border-color:var(--gold);font-weight:700}
.range{width:100%;accent-color:var(--gold);height:50px;margin:8px 0}
.stage-range{flex:0 0 30px;width:100%;height:30px;margin:0;writing-mode:horizontal-tb;direction:rtl;accent-color:var(--gold)}
.nums{display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:clamp(10px,1.4vw,20px);flex:1;min-height:0}
.num:nth-child(5){grid-column:2/4}.num:nth-child(6){grid-column:4/6}.num:nth-child(7){grid-column:6/8}.num:nth-child(-n+4){grid-column:span 2}
.num{container-type:size;min-height:0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:min(2.2cqh,8px);padding:8px 12px;border-radius:22px;background:linear-gradient(145deg,rgba(8,63,58,.92),rgba(3,42,40,.8));border:1px solid rgba(228,189,112,.28);overflow:hidden;opacity:0;transform:translateY(26px) scale(.96);transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s,box-shadow .35s}
.nums.in .num{animation:numIn .7s calc(var(--i) * .09s) both cubic-bezier(.2,.8,.2,1)}
@keyframes numIn{from{opacity:0;transform:translateY(26px) scale(.96)}to{opacity:1;transform:none}}
.num::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 0,rgba(228,189,112,.22),transparent 65%);opacity:0;transition:opacity .4s}
.num:hover,.num:active{transform:translateY(-6px);border-color:var(--gold);box-shadow:0 18px 34px rgba(0,0,0,.3)}
.num:hover::before,.num:active::before{opacity:1}
.num .ico{position:relative;flex:none;width:clamp(26px,min(17cqh,17cqw),52px);height:clamp(26px,min(17cqh,17cqw),52px);padding:min(2.4cqh,9px);border-radius:50%;background:rgba(228,189,112,.12);border:1px solid rgba(228,189,112,.4);fill:none;stroke:var(--gold);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;box-sizing:content-box;transition:transform .5s cubic-bezier(.2,.8,.2,1),background .3s}
.nums.in .ico *{stroke-dasharray:80;animation:icoDraw 1.4s calc(.3s + var(--i) * .09s) both ease-out}
@keyframes icoDraw{from{stroke-dashoffset:80}to{stroke-dashoffset:0}}
.num:hover .ico{transform:rotate(-8deg) scale(1.12);background:rgba(228,189,112,.24)}
.num.tap .ico{animation:icoPop .6s cubic-bezier(.2,.8,.2,1)}
.num.tap::after{content:'';position:absolute;left:50%;top:38px;width:20px;height:20px;margin:-10px;border-radius:50%;border:2px solid var(--gold);animation:ripple .8s ease-out forwards}
@keyframes icoPop{40%{transform:scale(1.3) rotate(10deg)}100%{transform:none}}
@keyframes ripple{to{transform:scale(11);opacity:0}}
.num b{position:relative;display:flex;align-items:baseline;justify-content:center;gap:2px;font-size:clamp(22px,min(16cqh,12cqw),54px);color:var(--gold);line-height:1.1;font-variant-numeric:tabular-nums}
.num b em{font-style:normal;font-size:.7em}
.num i{font-style:normal}
.num strong{position:relative;font-size:clamp(14px,min(8.5cqh,7.5cqw),23px);font-weight:700}
.num span{position:relative;font-size:clamp(10px,min(6.2cqh,5.4cqw),15px);font-weight:300;line-height:1.5;opacity:.82}
@media(max-width:800px){.nums{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(4,minmax(0,1fr))}.num:nth-child(n){grid-column:auto}.num:nth-child(7){grid-column:span 2}}
#quote .body{align-items:center;justify-content:center}
.form{flex:0 1 auto;width:min(560px,100%);display:flex;flex-direction:column;gap:12px;padding:clamp(18px,2.4vw,30px)}
.form input{width:100%;padding:14px 18px;border-radius:14px;border:1px solid rgba(228,189,112,.35);background:rgba(3,42,40,.6);color:var(--white);font:inherit;font-size:clamp(14px,1.4vw,17px);user-select:text;-webkit-user-select:text;transition:border-color .3s,box-shadow .3s,background .3s}
.form input::placeholder{color:rgba(246,236,214,.5)}
.form input:focus{outline:none;border-color:var(--gold);background:rgba(3,42,40,.85);box-shadow:0 0 0 4px rgba(228,189,112,.18)}
.wa{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:6px;padding:14px;border-radius:14px;background:#6fb9a5;color:#042725;font-weight:700;font-size:clamp(15px,1.6vw,19px);transition:transform .3s,box-shadow .3s,background .3s}
.wa svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.wa:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,0,0,.3);background:#7fc7b4}
.wa:active{transform:scale(.98)}
@media(max-width:800px){.body{flex-direction:column}.build-layout{flex-direction:column}.build-visual{flex:1 1 auto;min-height:0}.stage-visual{min-height:220px}.stage-range{flex:0 0 auto;width:100%;height:34px}.stage{min-height:0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* sectors */
[hidden]{display:none!important}
.plans-wrap{flex:1;min-height:0;display:flex}
.sectors,.sector-detail{flex:1;min-height:0;min-width:0}
.sectors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.8vw,26px)}
.sector{position:relative;container-type:size;min-height:0;display:flex;flex-direction:column;border-radius:26px;overflow:hidden;text-align:center;background:linear-gradient(160deg,rgba(8,63,58,.95),rgba(3,42,40,.85));border:1px solid rgba(228,189,112,.3);animation:numIn .8s calc(var(--i) * .12s) both cubic-bezier(.2,.8,.2,1);transition:transform .4s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .4s}
.sector:hover,.sector:active{transform:translateY(-8px);border-color:var(--gold);box-shadow:0 24px 44px rgba(0,0,0,.35)}
.sector-img{position:relative;flex:1;min-height:0;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 40%,rgba(228,189,112,.2),transparent 70%),linear-gradient(145deg,#0a4a43,#052f2c)}
.sector-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.22,.8,.2,1)}
.sector-img::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(3,42,40,.85))}
.sector:hover .sector-img img{transform:scale(1.1)}
.sector .ico,.sd-head .ico,.item .ico{fill:none;stroke:var(--gold);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sector .ico{position:relative;z-index:1;width:min(34cqh,40cqw);height:min(34cqh,40cqw);filter:drop-shadow(0 6px 14px rgba(0,0,0,.45));transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.sector-img img~.ico{opacity:.9;width:min(14cqh,18cqw);height:min(14cqh,18cqw);position:absolute;top:14px;inset-inline-start:14px;padding:8px;border-radius:50%;background:rgba(3,42,40,.7);border:1px solid rgba(228,189,112,.45);box-sizing:content-box}
.sector:hover .ico{transform:scale(1.1) rotate(-6deg)}
.sector .ico *{stroke-dasharray:90;animation:icoDraw 1.4s calc(.4s + var(--i) * .12s) both ease-out}
.sector b{flex:none;padding:clamp(12px,3cqh,22px) 14px;font-size:clamp(18px,min(5.2cqh,6.4cqw),32px);font-weight:700;line-height:1.3}
.sector .go{position:absolute;bottom:14px;inset-inline-end:16px;width:12px;height:12px;border-top:3px solid var(--gold);border-inline-start:3px solid var(--gold);transform:rotate(-45deg);transition:transform .3s;opacity:.8}
[dir=rtl] .sector .go{transform:rotate(-45deg)}
[dir=ltr] .sector .go{transform:rotate(135deg)}
.sector.tap::after,.item.tap::after{content:'';position:absolute;left:50%;top:50%;width:20px;height:20px;margin:-10px;border-radius:50%;border:2px solid var(--gold);animation:ripple .8s ease-out forwards;pointer-events:none}
.sector-detail{display:flex;flex-direction:column;gap:clamp(10px,1.6vw,20px);animation:numIn .6s both cubic-bezier(.2,.8,.2,1)}
.sd-head{display:flex;align-items:center;gap:14px;flex:none}
.sd-head .ico{width:44px;height:44px;padding:8px;border-radius:50%;background:rgba(228,189,112,.12);border:1px solid rgba(228,189,112,.4);box-sizing:content-box}
.sd-head h3{margin:0;color:var(--gold);font-size:clamp(22px,2.8vw,38px)}
.sd-head .back{margin-inline-end:6px}
.items{flex:1;min-height:0;display:grid;grid-template-columns:repeat(24,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:clamp(10px,1.4vw,20px)}
.items .item{grid-column:span 6}
.items.n5 .item{grid-column:span 8}
.items.n5 .item:nth-child(4){grid-column:5/13}.items.n5 .item:nth-child(5){grid-column:13/21}
.items.n7 .item:nth-child(5){grid-column:4/10}.items.n7 .item:nth-child(6){grid-column:10/16}.items.n7 .item:nth-child(7){grid-column:16/22}
.item{position:relative;container-type:size;min-height:0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:min(6cqh,14px);padding:10px 14px;text-align:center;border-radius:22px;overflow:hidden;background:linear-gradient(145deg,rgba(8,63,58,.92),rgba(3,42,40,.8));border:1px solid rgba(228,189,112,.28);animation:numIn .7s calc(.15s + var(--i) * .08s) both cubic-bezier(.2,.8,.2,1);transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s,box-shadow .35s}
.item::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 0,rgba(228,189,112,.22),transparent 65%);opacity:0;transition:opacity .4s}
.item:hover,.item:active{transform:translateY(-6px);border-color:var(--gold);box-shadow:0 18px 34px rgba(0,0,0,.3)}
.item:hover::before,.item:active::before{opacity:1}
.item .ico{position:relative;flex:none;width:clamp(26px,min(26cqh,24cqw),56px);height:clamp(26px,min(26cqh,24cqw),56px);padding:min(5cqh,11px);border-radius:50%;background:rgba(228,189,112,.12);border:1px solid rgba(228,189,112,.4);box-sizing:content-box;transition:transform .5s cubic-bezier(.2,.8,.2,1),background .3s}
.item .ico *{stroke-dasharray:90;animation:icoDraw 1.4s calc(.4s + var(--i) * .08s) both ease-out}
.item:hover .ico{transform:rotate(-8deg) scale(1.12);background:rgba(228,189,112,.24)}
.item.tap .ico{animation:icoPop .6s cubic-bezier(.2,.8,.2,1)}
.item strong{position:relative;font-size:clamp(13px,min(11cqh,8cqw),24px);font-weight:700;line-height:1.45}
@media(max-width:800px){.sectors{grid-template-columns:1fr;grid-template-rows:repeat(3,minmax(0,1fr))}.items{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(var(--rows),minmax(0,1fr))}.items .item,.items.n5 .item:nth-child(n),.items.n7 .item:nth-child(n){grid-column:auto}.items .item:last-child:nth-child(odd){grid-column:span 2}}
@media(prefers-reduced-motion:reduce){.num{opacity:1;transform:none}}
/* inner sector cards: translucent white, green content */
.item{background:linear-gradient(145deg,rgba(246,236,214,.9),rgba(246,236,214,.74));border:1px solid rgba(255,255,255,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--ink)}
.item::before{background:radial-gradient(circle at 50% 0,rgba(111,185,165,.38),transparent 65%)}
.item:hover,.item:active{border-color:#fff;box-shadow:0 18px 34px rgba(0,0,0,.28)}
.item .ico{stroke:var(--ink2);background:rgba(7,56,53,.09);border-color:rgba(7,56,53,.35)}
.item:hover .ico{background:rgba(7,56,53,.18)}
.item.tap::after{border-color:var(--ink2)}
/* premium stages */
.pv-frame{position:relative;flex:1;min-height:0;border-radius:18px;overflow:hidden;background:var(--ink);isolation:isolate}
.pv-drift{position:absolute;inset:0;animation:pvDrift 22s ease-in-out infinite alternate;will-change:transform}
.pv-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.pv-next{pointer-events:none}
@keyframes pvDrift{from{transform:scale(1.02) translate(0,0)}to{transform:scale(1.09) translate(-1.2%,-.8%)}}
.pv-frame::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(3,42,40,.45),transparent 22%)}
.pv-badge{position:absolute;z-index:2;top:16px;inset-inline-start:16px;display:flex;align-items:baseline;gap:6px;padding:8px 16px;border-radius:999px;background:rgba(3,42,40,.55);border:1px solid rgba(228,189,112,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);direction:ltr}
.pv-badge b{font-size:clamp(20px,2.4vw,30px);color:var(--gold);line-height:1}
.pv-badge span{font-size:clamp(12px,1.2vw,16px);opacity:.8}
.pv .build-details .chips{grid-template-columns:repeat(2,minmax(0,1fr))}
.pv .chip{display:flex;align-items:center;gap:10px;text-align:start;line-height:1.3;transition:background .3s,color .3s,border-color .3s,transform .3s}
.pv .chip:hover{transform:translateY(-2px);border-color:var(--gold)}
.pv .chip i{font-style:normal;font-weight:700;font-size:.85em;opacity:.7;flex:none}
.pv .chip.on i{opacity:1}
/* build type popup */
.choice{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:20px}
.choice-back{position:absolute;inset:0;background:rgba(2,29,28,.5);backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);opacity:0;transition:opacity .45s ease,backdrop-filter .45s ease,-webkit-backdrop-filter .45s ease}
.choice.open .choice-back{opacity:1;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.choice-panel{position:relative;width:min(960px,94vw);max-height:92vh;display:flex;flex-direction:column;padding:clamp(18px,3vw,38px);border-radius:32px;text-align:center;background:linear-gradient(150deg,rgba(10,74,67,.88),rgba(3,42,40,.92));border:1px solid rgba(228,189,112,.45);box-shadow:0 40px 90px rgba(0,0,0,.5);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);opacity:0;transform:translateY(40px) scale(.92);transition:opacity .45s ease,transform .6s cubic-bezier(.2,.9,.25,1.05)}
.choice.open .choice-panel{opacity:1;transform:none}
.choice-panel h3{margin:0 0 6px;font-size:clamp(24px,3.4vw,44px);color:var(--gold)}
.choice-panel p{margin:0 0 clamp(14px,2.4vw,28px);font-weight:300;font-size:clamp(14px,1.7vw,21px);opacity:.85}
.choice-x{position:absolute;top:16px;inset-inline-end:16px;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(228,189,112,.5);transition:transform .35s,background .3s}
.choice-x:hover{background:rgba(228,189,112,.18);transform:rotate(90deg)}
.choice-x svg{width:18px;height:18px;fill:none;stroke:var(--gold);stroke-width:2;stroke-linecap:round}
.choice-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,26px);min-height:0}
.choice-card{position:relative;display:flex;flex-direction:column;min-height:0;overflow:hidden;border-radius:24px;text-align:center;background:rgba(246,236,214,.08);border:1px solid rgba(246,236,214,.28);opacity:0;transform:translateY(34px) scale(.95);transition:opacity .6s calc(.2s + var(--i) * .12s) ease,transform .7s calc(.2s + var(--i) * .12s) cubic-bezier(.2,.9,.25,1.05),border-color .3s,box-shadow .4s}
.choice.open .choice-card{opacity:1;transform:none}
.choice.open .choice-card:hover{transform:translateY(-8px);border-color:var(--gold);box-shadow:0 24px 44px rgba(0,0,0,.4);transition-delay:0s,0s,0s,0s}
.choice.open .choice-card:active,.choice-card.picked{transform:scale(.97)!important;transition-duration:.2s!important;transition-delay:0s!important}
.choice-card.picked{border-color:var(--gold);box-shadow:0 0 0 4px rgba(228,189,112,.35)}
.cc-img{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:var(--ink)}
.cc-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s cubic-bezier(.22,.8,.2,1)}
.choice-card:hover .cc-img img{transform:scale(1.1)}
.cc-img::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(3,42,40,.6))}
.cc-tag{position:absolute;z-index:1;top:12px;inset-inline-start:12px;display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border-radius:999px;font-style:normal;font-weight:700;font-size:15px;letter-spacing:.08em;color:var(--ink);background:linear-gradient(135deg,#f3d58f,#d7a94a);box-shadow:0 6px 16px rgba(0,0,0,.35)}
.cc-tag svg{width:16px;height:16px;fill:var(--ink)}
.cc-txt{display:flex;flex-direction:column;gap:6px;padding:clamp(12px,2vw,22px) 18px clamp(16px,2.4vw,28px)}
.cc-txt b{font-size:clamp(18px,2.4vw,30px)}
.cc-txt small{font-size:clamp(12px,1.35vw,17px);font-weight:300;opacity:.8;line-height:1.6}
.choice-card.premium{border-color:rgba(228,189,112,.55)}
.choice-card .go{position:absolute;bottom:14px;inset-inline-end:16px;width:11px;height:11px;border-top:3px solid var(--gold);border-inline-start:3px solid var(--gold)}
[dir=rtl] .choice-card .go{transform:rotate(-45deg)}[dir=ltr] .choice-card .go{transform:rotate(135deg)}
@media(max-width:700px){.choice-cards{grid-template-columns:1fr}.cc-img{aspect-ratio:21/8}}
@media(max-height:560px){.cc-img{aspect-ratio:21/8}.choice-panel p{display:none}}
@media(prefers-reduced-motion:reduce){.choice-panel,.choice-card{opacity:1;transform:none}.choice:not(.open){display:none}}
@media(max-width:800px){.pv-frame{min-height:220px}.pv .build-details .chips{grid-template-columns:1fr 1fr}}
/* three-way choice */
.choice-panel{width:min(1180px,95vw)}
.choice-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.choice-card.vip{border-color:rgba(228,189,112,.85)}
.choice-card.vip .cc-tag{padding:6px 14px}
@media(max-width:900px){.choice-cards{grid-template-columns:1fr}.cc-img{aspect-ratio:21/8}.choice-panel{overflow-y:auto}}
/* autoplay control */
.scrub-row{display:flex;align-items:center;gap:14px;width:100%;flex:none}
.scrub-row .stage-range{flex:1 1 auto;width:auto;min-width:0}
.play-btn{position:relative;flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:rgba(3,42,40,.55);border:1px solid rgba(228,189,112,.4);transition:transform .3s cubic-bezier(.2,.8,.2,1),background .3s,border-color .3s}
.play-btn:hover{transform:scale(1.08);border-color:var(--gold);background:rgba(228,189,112,.16)}
.play-btn:active{transform:scale(.94)}
.play-btn .pr{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);transform:rotate(-90deg);pointer-events:none}
.play-btn .pr circle{fill:none;stroke:var(--gold);stroke-width:3;stroke-linecap:round;stroke-dasharray:132;stroke-dashoffset:calc(132px * (1 - var(--t,0)));opacity:0;transition:opacity .3s}
.play-btn.on .pr circle{opacity:1}
.play-btn .pi{width:20px;height:20px;fill:var(--gold);transition:transform .3s}
.play-btn .pl{margin-inline-start:3px}
.play-btn .pa{display:none}
.play-btn.on .pl{display:none}
.play-btn.on .pa{display:block}
.play-btn.on{background:rgba(228,189,112,.14);border-color:rgba(228,189,112,.7)}
.build-details .chip{font-size:clamp(13px,1.35vw,17px);padding:12px 10px}
/* tour types */
#tour .stage{display:flex;flex-direction:column;justify-content:center;gap:12px}

#tour .stage{container-type:size;align-items:center}
#tour .tour-visual{flex:none;width:min(100cqw,calc(100cqh * 16 / 9));align-self:center}
@media(max-width:800px){#tour .stage{container-type:normal}#tour .tour-visual{width:100%}}
/* tour: smaller text, larger image */
#tour .stage{flex:2.6;padding:10px;gap:8px}
#tour .info{flex:1;padding:18px;gap:8px;min-width:0}
#tour .info h3{font-size:clamp(17px,1.8vw,24px)}
#tour .info p{font-size:clamp(12px,1.25vw,16px);line-height:1.75}
#tour .info .chip{padding:8px 12px;font-size:clamp(11px,1.1vw,14px)}
#tour .tour-visual{width:min(100cqw,calc(100cqh * 16 / 9))}
.tour-badge{margin-inline-start:auto;display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border-radius:999px;border:1px solid rgba(228,189,112,.55);background:rgba(3,42,40,.55);font-size:clamp(13px,1.3vw,17px);font-weight:700;transition:background .3s,transform .3s}
.tour-badge:hover{background:rgba(228,189,112,.18);transform:translateY(-2px)}
.tour-badge::after{content:'';width:8px;height:8px;border-bottom:2px solid var(--gold);border-inline-end:2px solid var(--gold);transform:rotate(45deg) translateY(-2px)}
.tour-visual{touch-action:none}
.tour-visual:has(.zoomed){cursor:grab}
.tour-visual.dragging{cursor:grabbing}
.tour-zoom.dragging{transition:none!important}
/* brand cursor */
*,*::before,*::after{cursor:url(../media/cursor.png) 20 20,auto!important}
input[type=text],input[type=tel],input[type=number],input:not([type]){cursor:text!important}