/* Bahadur Tours and Travels — public site design system */
:root{
  --sky-50:#f0f9ff;--sky-100:#e0f2fe;--sky-200:#bae6fd;--sky-300:#7dd3fc;--sky-400:#38bdf8;--sky-500:#0ea5e9;--sky-600:#0284c7;--sky-700:#0369a1;--sky-900:#0c4a6e;
  --navy:#0a1f38;--navy-2:#10304f;--ink:#0d1f30;--muted:#5d7081;--line:#e2ebf2;--paper:#fff;--tint:#f5fafe;
  --gold:#d9a84e;--maroon:#7a0f08;--leaf:#0d6049;--wa:#25d366;
  --display:'Bricolage Grotesque','Instrument Sans',system-ui,sans-serif;--body:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --gutter:clamp(16px,5vw,72px);--r-lg:32px;--r:22px;--r-sm:14px;
  --ease:cubic-bezier(.2,.75,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font:400 17px/1.6 var(--body);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.modal-open{overflow:hidden}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;letter-spacing:-.025em;line-height:1.04;margin:0;color:var(--navy);text-wrap:balance}
p{margin:0}
.wrap{width:min(1400px,100%);margin:0 auto;padding:0 var(--gutter)}
.section{padding:clamp(72px,10vw,140px) 0}
.h2{font-size:clamp(36px,5.6vw,76px)}
.h3{font-size:clamp(26px,3vw,40px)}
.lead{font-size:clamp(17px,1.5vw,20px);color:var(--muted);max-width:56ch}
.eyebrow{display:flex;justify-content:space-between;gap:16px;font-size:15px;padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:clamp(36px,6vw,72px);color:var(--muted)}
.eyebrow b{color:var(--navy);font-weight:600}.eyebrow b i{font-style:normal;color:var(--muted);font-weight:400;margin-right:8px}
.kicker{display:inline-block;color:var(--sky-600);font-weight:600;font-size:15px;margin-bottom:12px}
.center{text-align:center}.center .lead{margin-inline:auto}
i[class*=hgi]{line-height:1}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 26px;border-radius:99px;border:1px solid transparent;font-weight:600;font-size:16px;cursor:pointer;transition:transform .25s var(--ease),background .2s,box-shadow .25s,color .2s,border-color .2s;white-space:nowrap}
.btn i{font-size:18px;transition:transform .25s var(--ease)}
.btn:hover{transform:translateY(-2px)}.btn:hover i{transform:translateX(3px)}
.btn:active{transform:none}
.btn-white{background:#fff;color:var(--navy);box-shadow:0 12px 30px -14px rgba(10,31,56,.5)}
.btn-glass{background:rgba(255,255,255,.24);color:#fff;border-color:rgba(255,255,255,.55)}
.btn-glass:hover{background:rgba(255,255,255,.3)}
.btn-dark{background:var(--navy);color:#fff}
.btn-dark:hover{background:var(--navy-2);box-shadow:0 14px 30px -14px rgba(10,31,56,.7)}
.btn-sky{background:var(--sky-500);color:#fff}
.btn-sky:hover{background:var(--sky-600);box-shadow:0 14px 30px -14px var(--sky-600)}
.btn-line{background:#fff;color:var(--navy);border-color:var(--line)}
.btn-line:hover{border-color:var(--sky-400);color:var(--sky-700)}
.btn-wa{background:var(--wa);color:#07361b}
.btn.small{padding:10px 18px;font-size:14.5px}
.link-arrow{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--navy)}
.link-arrow i{transition:transform .25s var(--ease)}
.link-arrow:hover i{transform:translate(3px,-3px)}

/* Nav */
.site-nav{position:fixed;inset:14px 0 auto;z-index:60;padding:0 var(--gutter);pointer-events:none;transition:transform .35s var(--ease)}
.site-nav.hide{transform:translateY(-120%)}
.nav-bar{pointer-events:auto;width:min(1280px,100%);margin:0 auto;display:flex;align-items:center;gap:14px;padding:7px 8px 7px 18px;background:rgba(255,255,255,.96);border:1px solid rgba(255,255,255,.7);border-radius:99px;box-shadow:0 14px 34px -22px rgba(10,31,56,.5)}
.nav-logo img{height:54px;width:auto}
.nav-links{display:flex;gap:4px;margin:0 auto}
.nav-links a{padding:8px 14px;border-radius:99px;font-weight:500;font-size:15.5px;color:#2b4256;transition:background .2s,color .2s}
.nav-links a:hover,.nav-links a.active{background:var(--sky-100);color:var(--sky-700)}
.nav-cta{display:flex;gap:6px;align-items:center}
.nav-burger{display:none;width:44px;height:44px;border-radius:50%;border:0;background:var(--sky-100);color:var(--sky-700);cursor:pointer;align-items:center;justify-content:center}
.nav-burger i{font-size:22px}
.mob-nav{position:fixed;inset:0;z-index:70;background:linear-gradient(170deg,var(--sky-500),var(--sky-700) 70%,var(--navy));padding:88px var(--gutter) 32px;display:flex;flex-direction:column;gap:6px;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s;overflow-y:auto}
.mob-nav.open{opacity:1;visibility:visible}
.mob-nav a.big{font:600 34px/1.2 var(--display);color:#fff;padding:6px 0;transform:translateY(14px);opacity:0;transition:transform .4s var(--ease),opacity .4s}
.mob-nav.open a.big{transform:none;opacity:1}
.mob-nav .close{position:absolute;top:22px;right:var(--gutter);width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.2);color:#fff;cursor:pointer;display:grid;place-items:center}
.mob-nav .foot{margin-top:auto;display:grid;gap:10px;padding-top:24px}

/* Hero */
.hero-track{position:relative}
.hero{position:relative;height:100svh;min-height:680px;overflow:hidden;color:#fff;background:linear-gradient(180deg,#0f6fc4 0%,#1f8fdf 34%,#5cb9f2 66%,#bfe7fb 92%,#e8f6fe 100%)}
.hero .sun{position:absolute;right:12%;top:12%;width:46vw;height:46vw;border-radius:50%;background:radial-gradient(circle,rgba(255,250,225,.55),rgba(255,255,255,0) 62%);pointer-events:none}
.cloud{position:absolute;pointer-events:none;user-select:none;will-change:transform}
.c1{width:clamp(420px,38vw,720px);left:-9%;bottom:15%;opacity:.96}
.c2{width:clamp(340px,30vw,580px);right:-8%;bottom:22%;opacity:.95}
.c3{width:clamp(240px,20vw,380px);left:15%;top:17%;opacity:.8}
.c4{width:clamp(220px,17vw,340px);right:17%;top:13%;opacity:.7}
.bank{position:absolute;left:50%;bottom:-13%;width:max(1500px,132vw);transform:translateX(-50%);pointer-events:none}
.bank.back{bottom:-3%;opacity:.92}
.hero-copy{position:absolute;z-index:6;left:0;right:0;top:clamp(104px,15vh,160px);text-align:center;padding:0 var(--gutter)}
.hero-tag{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:99px;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.35);font-size:14.5px;font-weight:500;margin-bottom:16px}
.hero-tag span{width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.28)}
.hero h1{color:#fff;font-size:clamp(44px,min(6.6vw,11.5vh),104px);font-weight:600;line-height:.98;text-shadow:0 2px 40px rgba(6,60,120,.25)}
.hero h1 .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.hero h1 .w>span{display:inline-block}
.hero p.sub{max-width:600px;margin:16px auto 22px;color:#eef8ff;font-size:clamp(16px,1.4vw,19px);line-height:1.5}
.hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.plane{position:absolute;z-index:4;right:-260px;top:30%;width:clamp(180px,20vw,330px);pointer-events:none}
.trail{position:absolute;z-index:3;left:0;top:0;width:100%;height:100%;pointer-events:none}
.porthole{position:absolute;z-index:7;left:50%;bottom:-46px;width:clamp(220px,min(23vw,37vh),340px);aspect-ratio:.8;transform:translateX(-50%) rotate(-7deg);border-radius:44%/38%;background:linear-gradient(145deg,#fff,#dfe9f2 45%,#fff 70%,#c5d4e2);box-shadow:0 40px 70px -24px rgba(8,48,100,.6),inset 0 0 0 1px rgba(255,255,255,.8)}
.porthole .pane{position:absolute;inset:7.5%;border-radius:inherit;overflow:hidden;background:#0f6fc4;box-shadow:inset 0 0 0 6px #eef3f8,inset 0 14px 26px rgba(8,38,70,.45)}
.porthole .pane img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s}
.porthole .pane img.on{opacity:1}
.porthole .shade{position:absolute;left:8%;right:8%;top:6%;height:13%;border-radius:40% 40% 12px 12px/100% 100% 12px 12px;background:linear-gradient(180deg,#f9fbfd,#d9e4ee);box-shadow:0 8px 12px -6px rgba(8,38,70,.45)}
.porthole .glow{position:absolute;inset:7.5%;border-radius:inherit;box-shadow:inset 0 0 26px 4px rgba(255,210,150,.5);pointer-events:none}
.hero-fill{position:absolute;inset:0;z-index:7;pointer-events:none;background:#0f6fc4 center 30%/cover no-repeat;clip-path:inset(100% 50% 0 50% round 40px);visibility:hidden}
.hero-fill-copy{position:absolute;left:var(--gutter);bottom:clamp(30px,6vh,64px);color:#fff}
.hero-fill-copy strong{display:block;font:600 clamp(36px,6vw,84px)/1 var(--display);letter-spacing:-.02em;text-shadow:0 2px 30px rgba(4,30,60,.5)}
.hero-fill-copy span{font-size:18px;text-shadow:0 1px 12px rgba(4,30,60,.6)}
.scroll-cue{position:absolute;z-index:8;left:50%;margin-left:clamp(150px,16vw,240px);bottom:26px;display:flex;align-items:center;gap:8px;color:var(--navy);font-size:14px;font-weight:600}
.scroll-cue b{display:block;width:2px;height:34px;background:rgba(10,31,56,.2);position:relative;overflow:hidden}
.scroll-cue b::after{content:'';position:absolute;inset:0;background:var(--navy);animation:cue 2s var(--ease) infinite}
@keyframes cue{from{transform:translateY(-100%)}to{transform:translateY(100%)}}

/* Why */
.pill-head{font-size:clamp(38px,6.6vw,92px);text-align:center;line-height:1.08}
.pill-head .pic{display:inline-block;vertical-align:-.1em;height:.86em;width:1.9em;border-radius:99px;overflow:hidden;margin:0 .06em}
.pill-head .pic.sm{width:1.35em}
.pill-head .pic img{width:100%;height:100%;object-fit:cover}
.why-lead{margin:22px auto 26px;text-align:center;max-width:56ch;color:var(--muted);font-size:clamp(17px,1.5vw,20px)}
.collage{display:grid;grid-template-columns:1fr minmax(0,2.05fr) 1fr;gap:clamp(20px,3.4vw,52px);align-items:end;margin-top:clamp(40px,5vw,64px)}
.collage h3{font-size:24px;margin-bottom:8px}
.collage .note{color:var(--muted);font-size:16px}
.collage .thumb{border-radius:18px;overflow:hidden;margin:26px 0 8px;aspect-ratio:1.5;max-width:250px}
.collage .thumb img,.collage .capsule img,.collage .main img{width:100%;height:100%;object-fit:cover}
.collage .main{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:1.17}
.chip{position:absolute;left:18px;bottom:18px;display:inline-flex;align-items:center;gap:9px;padding:9px 16px;background:#fff;border-radius:99px;font-weight:600;font-size:15px;box-shadow:0 12px 26px -14px rgba(10,31,56,.5)}
.chip i{width:8px;height:8px;border-radius:50%;background:var(--sky-500)}
.chip small{color:var(--muted);font-weight:400;font-size:15px}
.collage .right{text-align:right;display:flex;flex-direction:column;align-items:flex-end}
.collage .capsule{width:min(180px,80%);aspect-ratio:.55;border-radius:999px;overflow:hidden;margin-bottom:26px}
.collage .big{font:600 clamp(48px,6vw,84px)/1 var(--display);letter-spacing:-.03em;color:var(--navy)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(48px,7vw,88px);border-top:1px dashed #c9d7e2}
.stats div{position:relative;padding:28px 12px 8px;text-align:center;border-left:1px dashed #c9d7e2}
.stats div:first-child{border-left:0}
.stats div::before{content:'';position:absolute;left:-3px;top:-3px;width:5px;height:5px;background:var(--navy);border-radius:50%}
.stats div:first-child::before{left:0}
.stats b{display:block;font:500 clamp(44px,6.4vw,92px)/1 var(--display);letter-spacing:-.03em;color:var(--navy);font-variant-numeric:tabular-nums}
.stats div>span{display:block;color:var(--muted);margin-top:12px;font-size:16px;line-height:1.35}

/* Plan cards */
.split-head{display:grid;grid-template-columns:1.5fr 1fr;gap:32px;align-items:start;margin-bottom:clamp(36px,5vw,64px)}
.bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.tile{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:clamp(480px,50vw,690px);display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(24px,3vw,42px);transition:transform .5s var(--ease)}
.tile:hover{transform:translateY(-6px)}
.tile.navy{background:var(--navy);color:#fff;justify-content:space-between}
.tile.navy h3{color:#fff;font-size:clamp(32px,3.4vw,50px)}
.tile.navy p{color:#b4c6d6;margin-bottom:18px}
.tile.photo{color:#fff}
.tile.photo>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.tile.photo:hover>img{transform:scale(1.05)}
.tile.photo::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,28,52,.6),transparent 34%)}
.tile.photo h3{position:relative;z-index:2;color:#fff;font-size:clamp(26px,2.6vw,36px)}
.chat-mock{position:absolute;z-index:2;left:clamp(18px,2.4vw,30px);right:clamp(18px,4vw,72px);top:clamp(18px,2.4vw,30px);background:#fff;color:var(--ink);border-radius:20px;padding:18px 20px;box-shadow:0 22px 40px -22px rgba(6,28,52,.6)}
.chat-mock strong{font:600 20px var(--display);display:block;margin-bottom:10px;color:var(--navy)}
.chat-mock em{font-style:normal;color:var(--sky-500)}
.bub{width:fit-content;max-width:92%;padding:9px 14px;border-radius:13px;font-size:14.5px;margin-top:8px;line-height:1.35}
.bub.me{background:var(--sky-500);color:#fff}.bub.ai{background:#f1f5f9}
.tile.blue{background:var(--sky-500);color:#fff}
.tile.blue h3{position:relative;color:#fff;font-size:clamp(26px,2.6vw,36px)}
.tile.blue svg.path{position:absolute;inset:0;width:100%;height:100%}
.day-card{position:relative;background:#fff;color:var(--ink);border-radius:18px;padding:16px 20px;margin:0 auto 26px;width:min(340px,100%);box-shadow:0 26px 40px -24px rgba(6,28,52,.6)}
.day-card header{display:flex;align-items:center;gap:10px;font:600 18px var(--display);color:var(--navy);margin-bottom:8px}
.day-card header small{font:600 12px var(--body);color:#e4623a;background:#feeee7;border-radius:99px;padding:2px 9px}
.day-card li{display:grid;grid-template-columns:46px 12px 1fr;gap:9px;align-items:center;font-size:14.5px;padding:7px 0}
.day-card ul{list-style:none;margin:0;padding:0}
.day-card li span{color:var(--muted);font-size:13px}
.day-card li i{width:10px;height:10px;border-radius:50%;border:2.5px solid #e4623a}
.day-card li:first-child i{background:#e4623a}

/* Places */
.places{display:grid;grid-template-columns:minmax(0,1.13fr) minmax(0,1.5fr);gap:clamp(16px,2vw,26px)}
.place-view{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:clamp(320px,38vw,560px);background:var(--sky-100)}
.place-view img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.05);transition:opacity .7s,transform 1.2s var(--ease)}
.place-view img.on{opacity:1;transform:none}
.place-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.4vw,18px)}
.place{display:flex;flex-direction:column;justify-content:space-between;min-height:clamp(150px,18vw,270px);padding:clamp(16px,2vw,26px);border:1px solid var(--line);border-radius:var(--r);background:#fff;transition:background .3s,color .3s,border-color .3s,transform .4s var(--ease)}
.place header{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.place strong{min-width:0;font:600 clamp(17px,1.65vw,25px)/1.14 var(--display);letter-spacing:-.02em;color:var(--navy);transition:color .3s}
.place strong small{display:block;font-weight:400;color:var(--muted);font-size:.72em;margin-top:2px;transition:color .3s}
.place span{color:var(--muted);transition:color .3s}
.place i{flex:none;font-size:20px;transition:transform .3s var(--ease)}
.place.on,.place:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.place.on strong,.place:hover strong{color:#fff}
.place.on strong small,.place.on span,.place:hover strong small,.place:hover span{color:#a9bdcf}
.place:hover i{transform:translate(3px,-3px)}

/* Package cards */
.pk-rail{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px var(--gutter) 24px;margin:0 calc(var(--gutter)*-1);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.pk-rail::-webkit-scrollbar{display:none}
.pk-rail .pk{flex:0 0 clamp(280px,31vw,420px);scroll-snap-align:center}
.pk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:22px}
.pk{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:transform .4s var(--ease),box-shadow .4s,border-color .3s}
.pk:hover{transform:translateY(-6px);box-shadow:0 30px 50px -34px rgba(10,50,90,.5);border-color:var(--sky-200)}
.pk-img{position:relative;display:block;aspect-ratio:1.4;overflow:hidden;background:var(--sky-100)}
.pk-img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.pk:hover .pk-img img{transform:scale(1.06)}
.pk-badge{position:absolute;left:12px;top:12px;padding:4px 12px;background:#fff;border-radius:99px;font-size:13.5px;font-weight:600;color:var(--navy)}
.pk-body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
.pk-meta{font-size:14px;color:var(--muted)}
.pk h3{font-size:23px;line-height:1.14}
.pk-sum{color:var(--muted);font-size:15.5px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pk-inc{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.pk-inc span{display:inline-flex;gap:5px;align-items:center;font-size:13px;color:var(--sky-700);background:var(--sky-50);padding:3px 9px;border-radius:99px}
.pk-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:12px;border-top:1px solid var(--line)}
.pk-price small{display:block;font-size:12.5px;color:var(--muted)}
.pk-price b{font:600 19px var(--display);color:var(--navy)}
.pk.skel{min-height:420px;background:linear-gradient(90deg,#eef5fa 25%,#f8fbfe 50%,#eef5fa 75%);background-size:200% 100%;animation:skel 1.3s infinite}
@keyframes skel{to{background-position:-200% 0}}

/* Flow */
.flow{position:relative;background:linear-gradient(180deg,#fff,var(--sky-50) 26%,var(--sky-100));overflow:hidden}
.flow-map{position:relative;margin-top:44px}
.flow-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;position:relative;z-index:2;align-items:start}
.flow-step{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:0 24px 40px -36px rgba(10,50,90,.6)}
.flow-step:nth-child(even){margin-top:120px}
.flow-step b{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--sky-100);color:var(--sky-700);font-weight:700;margin-bottom:14px}
.flow-step h3{font-size:23px;margin-bottom:6px}
.flow-step p{color:var(--muted);font-size:15.5px}
.flow-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:1;pointer-events:none}

/* Umrah band */
.band{position:relative;border-radius:var(--r-lg);overflow:hidden;color:#fff;min-height:clamp(440px,48vw,620px);display:flex;align-items:flex-end}
.band>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.band::after{content:'';position:absolute;inset:0;background:linear-gradient(80deg,rgba(6,20,40,.82),rgba(6,20,40,.2) 70%)}
.band-copy{position:relative;z-index:2;padding:clamp(24px,5vw,64px);max-width:640px}
.band-copy h2{color:#fff}.band-copy p{color:#dbe6f0;margin:14px 0 22px}
.band-copy .kicker{color:var(--sky-300)}

/* Fleet */
.fleet{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(24px,5vw,72px);align-items:center}
.fleet ul{list-style:none;padding:0;margin:20px 0 26px;display:grid;gap:8px}
.fleet li{display:flex;gap:10px;align-items:center}
.fleet li i{color:var(--sky-600)}
.fleet-media{display:grid;grid-template-columns:1.1fr 1fr;gap:14px}
.fleet-media video,.fleet-media img{width:100%;height:100%;object-fit:cover;border-radius:var(--r);background:var(--sky-100);aspect-ratio:.72}
.fleet-media>:last-child{margin-top:44px}

/* Reels */
.reels{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:8px}
.reels::-webkit-scrollbar{display:none}
.reel{position:relative;flex:0 0 clamp(220px,22vw,280px);aspect-ratio:9/16;border-radius:var(--r);overflow:hidden;background:var(--navy);scroll-snap-align:start}
.reel video{width:100%;height:100%;object-fit:cover}
.reel b{position:absolute;left:14px;right:14px;bottom:14px;color:#fff;font-weight:600;text-shadow:0 1px 6px rgba(0,0,0,.6)}
.reel button{position:absolute;right:10px;top:10px;width:36px;height:36px;border:0;border-radius:50%;background:rgba(0,0,0,.45);color:#fff;cursor:pointer;display:grid;place-items:center}

/* Reviews */
.quotes{position:relative;max-width:1100px;margin:0 auto;text-align:center}
.quote{font:500 clamp(28px,4.2vw,56px)/1.16 var(--display);letter-spacing:-.02em;color:var(--navy);margin:0}
.quote-by{margin-top:22px;color:var(--muted)}
.quote-by b{color:var(--navy);font-weight:600}
.quote-nav{display:flex;justify-content:center;gap:8px;margin-top:22px}
.quote-nav button{width:10px;height:10px;padding:0;border-radius:50%;border:0;background:var(--sky-200);cursor:pointer;transition:transform .2s,background .2s}
.quote-nav button.on{background:var(--sky-500);transform:scale(1.3)}

/* Marquee */
.marquee{overflow:hidden;display:flex;gap:16px;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.marquee-track{display:flex;gap:16px;flex:none;animation:slide 44s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee img{height:clamp(200px,24vw,320px);width:auto;border-radius:var(--r);object-fit:cover;flex:none}
@keyframes slide{to{transform:translateX(calc(-100% - 16px))}}

/* Map */
.map-card{position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--sky-100);height:clamp(380px,46vw,580px)}
.map-card>div:first-child{position:absolute;inset:0}
.map-note{position:absolute;left:18px;top:18px;background:#fff;border-radius:18px;padding:18px 20px;max-width:330px;box-shadow:0 24px 40px -26px rgba(6,28,52,.6);z-index:3}
.map-note h3{font-size:24px;margin-bottom:4px}
.map-note p{color:var(--muted);font-size:15px;margin-bottom:12px}

/* Footer */

/* Floats */
.fab-wa{position:fixed;right:18px;bottom:18px;z-index:50;width:56px;height:56px;border-radius:50%;background:var(--wa);color:#fff;display:grid;place-items:center;box-shadow:0 14px 26px -10px rgba(10,120,60,.7);transition:transform .25s var(--ease)}
.fab-wa:hover{transform:scale(1.08)}
.fab-wa svg{width:28px;height:28px}
.ai-fab{position:fixed;left:18px;bottom:18px;z-index:50;display:flex;align-items:center;gap:9px;padding:10px 16px 10px 12px;border:0;border-radius:99px;background:var(--navy);color:#fff;cursor:pointer;font-weight:600;font-size:15px;box-shadow:0 16px 30px -14px rgba(10,31,56,.7);transition:transform .25s var(--ease)}
.ai-fab:hover{transform:translateY(-2px)}
body.detail .ai-fab span{display:none}body.detail .ai-fab{padding:13px}
.ai-fab i{font-size:20px;color:var(--sky-300)}
.ai-panel{position:fixed;left:18px;bottom:78px;z-index:55;width:min(390px,calc(100vw - 36px));background:#fff;border-radius:22px;box-shadow:0 40px 70px -24px rgba(10,31,56,.5);border:1px solid var(--line);padding:16px;display:none;flex-direction:column;gap:10px;max-height:min(600px,calc(100svh - 110px))}
.ai-panel.show{display:flex}
.ai-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.ai-head strong{font:600 19px var(--display);color:var(--navy);display:block}
.ai-head small{color:var(--muted)}
.ai-x{border:0;background:var(--sky-50);width:32px;height:32px;border-radius:50%;cursor:pointer;display:grid;place-items:center;flex:none}
.chat{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:7px;min-height:150px}
.ai-msg{max-width:88%;padding:9px 13px;border-radius:14px;font-size:15px;line-height:1.4;white-space:pre-line}
.ai-msg-bot{background:#f1f6fa;align-self:flex-start}
.ai-msg-user{background:var(--sky-500);color:#fff;align-self:flex-end}
.ai-typing{display:flex;gap:4px}
.ai-typing span{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:dot 1s infinite}
.ai-typing span:nth-child(2){animation-delay:.15s}.ai-typing span:nth-child(3){animation-delay:.3s}
@keyframes dot{50%{transform:translateY(-4px);opacity:.4}}
.ai-chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;flex:none}
.ai-chip{flex:none;border:1px solid var(--sky-200);background:var(--sky-50);color:var(--sky-700);border-radius:99px;padding:4px 12px;font-size:14px;cursor:pointer}
#chat-form{display:flex;gap:6px}
#chat-form input{flex:1;min-width:0;border:1px solid var(--line);border-radius:12px;padding:10px 12px;outline:none}
#chat-form input:focus{border-color:var(--sky-400)}
#chat-form button{width:44px;border:0;border-radius:12px;background:var(--sky-500);color:#fff;cursor:pointer;font-size:18px}

/* Modal + forms */
.modal{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;padding:16px;background:rgba(10,31,56,.5);backdrop-filter:blur(6px)}
.modal.show{display:flex}
.modal-card{background:#fff;border-radius:26px;width:min(620px,100%);max-height:calc(100svh - 32px);overflow-y:auto;padding:clamp(20px,3vw,32px);position:relative;animation:pop .3s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(16px) scale(.98)}}
.modal-card h2{font-size:30px;margin-bottom:4px}
.modal-card>p{color:var(--muted);margin-bottom:16px;font-size:16px}
.modal-x{position:absolute;right:14px;top:14px;width:38px;height:38px;border:0;border-radius:50%;background:var(--sky-50);cursor:pointer;display:grid;place-items:center}
.f-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.f-grid .full{grid-column:1/-1}
.f{display:flex;flex-direction:column;gap:5px;font-size:14.5px;font-weight:600;color:#3a5163;min-width:0}
.f input,.f select,.f textarea{width:100%;padding:12px 14px;border:1px solid #d6e2ec;border-radius:12px;background:#fff;outline:none;font-weight:400;font-size:16px;transition:border-color .2s,box-shadow .2s}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--sky-400);box-shadow:0 0 0 3px rgba(56,189,248,.2)}
.f textarea{resize:vertical;min-height:84px}
.f-check{display:flex;gap:9px;align-items:flex-start;font-size:15px;color:var(--muted);margin:12px 0}
.f-check input{margin-top:4px;accent-color:var(--sky-600)}
.f-check a{color:var(--sky-700);text-decoration:underline}
.f-note{font-size:14px;color:var(--muted);text-align:center;margin-top:8px}
.done{text-align:center;padding:10px 0}
.done i{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--sky-100);color:var(--sky-600);font-size:30px;margin:0 auto 12px}
.done code{font:600 19px var(--body);color:var(--navy);background:var(--sky-50);padding:4px 12px;border-radius:9px}
.done .row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:16px}

/* Inner page hero */
.page-hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#0f6fc4,#2c9ae6 55%,#a9dcf8 88%,#fff);color:#fff;padding:clamp(130px,17vw,200px) 0 clamp(80px,11vw,140px);text-align:center}
.page-hero h1{color:#fff;font-size:clamp(42px,7vw,96px)}
.page-hero p{max-width:58ch;margin:16px auto 0;color:#eef8ff;font-size:clamp(17px,1.5vw,20px)}
.page-hero .cloud{opacity:.9}
.page-hero .bank{bottom:-34%}
.page-hero .wrap{position:relative;z-index:2}
.page-hero .search-bar{margin:26px auto 0}
.search-bar{display:flex;align-items:center;gap:8px;background:#fff;border-radius:99px;padding:7px 8px 7px 20px;max-width:560px;color:var(--ink);box-shadow:0 22px 40px -22px rgba(6,40,90,.6)}
.search-bar input{flex:1;min-width:0;border:0;outline:0;background:none;font-size:17px;padding:8px 0}
.search-bar i{font-size:20px;color:var(--muted)}

/* Catalogue */
.cat-bar{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:84px 0 12px;margin-top:-1px}
.cat-tools{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;max-width:100%}
.tabs::-webkit-scrollbar{display:none}
.tabs button{flex:none;border:1px solid var(--line);background:#fff;border-radius:99px;padding:8px 16px;font-weight:600;font-size:15px;color:#3a5163;cursor:pointer;transition:all .2s}
.tabs button:hover{border-color:var(--sky-300)}
.tabs button.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.cat-right{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:15px}
.cat-right select{border:1px solid var(--line);border-radius:99px;padding:8px 14px;background:#fff}
.empty-state{text-align:center;padding:60px 20px;color:var(--muted);grid-column:1/-1}

/* Package detail */
.pd-hero{position:relative;height:clamp(460px,76vh,760px);color:#fff;overflow:hidden;background:var(--navy)}
.pd-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pd-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,24,44,.78),rgba(6,24,44,.08) 55%,rgba(6,24,44,.3))}
.pd-hero .wrap{position:absolute;left:0;right:0;bottom:clamp(24px,5vw,56px);z-index:2}
.pd-hero h1{color:#fff;font-size:clamp(38px,6.4vw,88px);max-width:18ch}
.pd-crumb{display:inline-flex;gap:8px;align-items:center;font-size:15px;color:#dbe9f4;margin-bottom:12px}
.pd-crumb:hover{color:#fff}
.pd-facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.pd-facts span{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(8px);padding:6px 13px;border-radius:99px;font-size:15px}
.pd-tabs{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.pd-tabs nav{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding-top:82px}
.pd-tabs nav::-webkit-scrollbar{display:none}
.pd-tabs a{flex:none;padding:11px 15px;font-weight:600;color:var(--muted);border-bottom:2.5px solid transparent;font-size:15.5px;transition:color .2s,border-color .2s}
.pd-tabs a.on,.pd-tabs a:hover{color:var(--sky-700);border-color:var(--sky-500)}
.pd-layout{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:clamp(24px,4vw,64px);align-items:start;padding-top:clamp(28px,4vw,48px);padding-bottom:64px}
.pd-sec{padding:clamp(26px,3.4vw,42px) 0;border-bottom:1px solid var(--line);scroll-margin-top:150px}
.pd-sec:first-child{padding-top:0}.pd-sec:last-child{border-bottom:0}
.pd-sec h2{font-size:clamp(28px,3vw,40px);margin-bottom:14px}
.pd-desc{color:#3e5364;white-space:pre-line}
.hl-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.hl-grid div{display:flex;gap:10px;align-items:flex-start;background:var(--sky-50);border-radius:14px;padding:12px 14px;font-size:16px}
.hl-grid i{color:var(--sky-600);margin-top:3px}
.days{position:relative}
.days-tools{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.days-tools button{border:0;background:none;color:var(--sky-700);font-weight:600;cursor:pointer;padding:0;font-size:15.5px}
.day{position:relative;padding-left:52px}
.day::before{content:'';position:absolute;left:19px;top:44px;bottom:-4px;width:2px;background:repeating-linear-gradient(180deg,var(--sky-300) 0 6px,transparent 6px 12px)}
.day:last-child::before{display:none}
.day summary{list-style:none;cursor:pointer;padding:10px 0;display:flex;align-items:center;gap:12px;font-weight:600;font-size:18px;color:var(--navy)}
.day summary::-webkit-details-marker{display:none}
.day summary b{position:absolute;left:0;top:8px;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--sky-500);color:#fff;font-size:14.5px}
.day summary i{margin-left:auto;transition:transform .25s}
.day[open] summary i{transform:rotate(180deg)}
.day p{color:var(--muted);padding:0 0 12px;margin:0}
.cover{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cover>div{border-radius:18px;padding:18px 20px;background:var(--sky-50)}
.cover>div.no{background:#faf6f5}
.cover h3{font-size:20px;margin-bottom:8px}
.cover span{display:flex;gap:9px;align-items:flex-start;padding:4px 0;font-size:16px}
.cover i{margin-top:4px;color:var(--sky-600)}
.cover .no i{color:#b0524a}
.arrange{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.arrange article{border:1px solid var(--line);border-radius:18px;padding:18px}
.arrange small{color:var(--sky-700);font-weight:600}
.arrange h3{font-size:21px;margin:4px 0}
.arrange p{color:var(--muted);font-size:15.5px}
.pd-gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:150px;gap:10px}
.pd-gallery button{border:0;padding:0;border-radius:14px;overflow:hidden;cursor:zoom-in;background:var(--sky-50)}
.pd-gallery button:first-child{grid-column:span 2;grid-row:span 2}
.pd-gallery img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.pd-gallery button:hover img{transform:scale(1.05)}
.pd-map{height:320px;border-radius:18px;overflow:hidden;background:var(--sky-50)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;padding:13px 0;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-size:22px;line-height:1;color:var(--sky-600)}
.faq details[open] summary::after{content:'−'}
.faq p{color:var(--muted);padding-bottom:14px}
.rv{border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:10px}
.rv .stars,.stars{color:var(--gold);letter-spacing:2px}
.rv footer{color:var(--muted);font-size:15px;margin-top:6px}
.side{position:sticky;top:150px}
.book-card{border:1px solid var(--line);border-radius:22px;padding:20px;background:#fff;box-shadow:0 30px 50px -40px rgba(10,50,90,.6)}
.book-card small{color:var(--muted)}
.book-card .price{font:600 32px/1.1 var(--display);color:var(--navy);letter-spacing:-.02em}
.book-card .f{margin-top:12px}
.calc{background:var(--sky-50);border-radius:12px;padding:10px 14px;margin-top:12px;display:flex;justify-content:space-between;align-items:center;font-weight:600}
.book-card .btn{width:100%;margin-top:10px}
.mini-links{display:flex;justify-content:center;gap:16px;margin-top:12px;font-size:15px;color:var(--sky-700)}
.mini-links a,.mini-links button{display:inline-flex;gap:5px;align-items:center;border:0;background:none;color:inherit;cursor:pointer;padding:0;font-weight:600}
.mob-book{display:none;position:fixed;left:0;right:0;bottom:0;z-index:45;background:#fff;border-top:1px solid var(--line);padding:10px 16px;align-items:center;justify-content:space-between;gap:12px}
.mob-book b{font:600 19px var(--display);color:var(--navy)}
.lightbox{position:fixed;inset:0;z-index:90;background:rgba(6,18,32,.92);display:none;align-items:center;justify-content:center;padding:18px}
.lightbox.show{display:flex}
.lightbox img{max-width:min(1200px,100%);max-height:86vh;border-radius:12px;object-fit:contain}
.lightbox button{position:absolute;top:16px;right:16px;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;cursor:pointer;font-size:22px}

/* Umrah */
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.tier{border:1px solid var(--line);border-radius:var(--r);padding:26px;display:flex;flex-direction:column;background:#fff;transition:transform .4s var(--ease),box-shadow .4s}
.tier:hover{transform:translateY(-6px);box-shadow:0 30px 50px -36px rgba(10,50,90,.5)}
.tier.pop{background:var(--navy);color:#fff;border-color:var(--navy)}
.tier.pop h3{color:#fff}.tier.pop p,.tier.pop li{color:#c4d4e3}
.tier small{color:var(--sky-600);font-weight:600}.tier.pop small{color:var(--sky-300)}
.tier h3{font-size:28px;margin:4px 0}
.tier .amt{font:600 34px var(--display);margin:8px 0 2px}
.tier p{color:var(--muted);font-size:15.5px}
.tier ul{list-style:none;margin:16px 0;padding:0;flex:1}
.tier li{display:flex;gap:9px;padding:5px 0;font-size:15.5px}
.tier li i{color:var(--sky-500);margin-top:4px}
.incl{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.incl div{background:var(--sky-50);border-radius:16px;padding:18px}
.incl i{font-size:24px;color:var(--sky-600)}
.incl strong{display:block;margin:8px 0 2px;font-weight:600}
.incl small{color:var(--muted);font-size:14.5px;line-height:1.4;display:block}
.tl{max-width:820px;margin:0 auto}
.tl>div{display:grid;grid-template-columns:76px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.tl b{font:600 22px var(--display);color:var(--sky-600)}
.tl h3{font-size:21px;margin-bottom:3px}
.tl p{color:var(--muted);font-size:16px}
.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:14px}
.photo-grid figure{margin:0;position:relative;border-radius:18px;overflow:hidden;aspect-ratio:1.2;background:var(--sky-50)}
.photo-grid figure button{all:unset;display:block;width:100%;height:100%;cursor:zoom-in}
.photo-grid img,.photo-grid video{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.photo-grid figure:hover img{transform:scale(1.05)}
.photo-grid figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 10px;color:#fff;background:linear-gradient(0deg,rgba(6,24,44,.75),transparent);font-size:15px;pointer-events:none}
.photo-grid figcaption b{display:block;font-weight:600}

/* Stories, guides, legal */
.rv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr));gap:16px}
.rv-card{border:1px solid var(--line);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:10px}
.rv-card blockquote{margin:0;font-size:17px}
.rv-card footer{margin-top:auto;color:var(--muted);font-size:15px}
.rv-card footer b{display:block;color:var(--navy);font-weight:600}
.share{background:var(--sky-50);border-radius:var(--r-lg);padding:clamp(22px,4vw,52px);display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(22px,4vw,56px)}
.guide-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(330px,100%),1fr));gap:22px}
.guide{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);display:flex;flex-direction:column;transition:transform .4s var(--ease)}
.guide:hover{transform:translateY(-5px)}
.guide img{width:100%;aspect-ratio:1.6;object-fit:cover;background:var(--sky-50)}
.guide div{padding:16px 18px 20px}
.guide small{color:var(--sky-700);font-weight:600}
.guide h3{font-size:23px;margin:4px 0 6px}
.guide p{color:var(--muted);font-size:16px}
.article{max-width:760px;margin:0 auto}
.article img{width:100%;border-radius:var(--r);margin:0 0 26px}
.article p{margin:0 0 18px;color:#334a5c;font-size:18px}
.legal{display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:start}
.legal aside{position:sticky;top:100px;display:flex;flex-direction:column;font-size:15.5px}
.legal aside a{padding:5px 0;color:var(--muted)}.legal aside a:hover{color:var(--sky-700)}
.legal section{padding-bottom:28px;margin-bottom:28px;border-bottom:1px solid var(--line);scroll-margin-top:100px}
.legal h2{font-size:clamp(25px,2.6vw,32px);margin-bottom:10px;display:flex;gap:12px;align-items:baseline}
.legal h2 small{font-size:15px;color:var(--sky-600);font-family:var(--body);font-weight:600}
.legal li,.legal p{color:#3e5364}
.legal ul{padding-left:20px;margin:8px 0}
.legal li{margin:5px 0}
.notes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:36px}
.notes div{background:var(--sky-50);padding:14px 16px;border-radius:14px;font-size:15.5px}
.notes b{display:block;font-weight:600}

/* Reveal: only hidden once JS confirms it can show them again */
.can-animate [data-reveal]{opacity:0;transform:translateY(26px)}
.can-animate [data-reveal].in{opacity:1;transform:none;transition:opacity .8s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}

@media(max-width:1080px){
  .nav-links{display:none}.nav-burger{display:flex}.nav-cta{margin-left:auto}
  .bento{grid-template-columns:1fr 1fr}.bento .tile.navy{grid-column:1/-1;min-height:340px}
  .places{grid-template-columns:1fr}.place-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pd-layout{grid-template-columns:1fr}.side{position:static;display:none}.mob-book{display:flex}body.detail{padding-bottom:70px}
  body.detail .ai-fab,body.detail .fab-wa{bottom:84px}
  
  .incl{grid-template-columns:1fr 1fr}.tiers{grid-template-columns:1fr}
  .flow-steps{grid-template-columns:1fr 1fr}.flow-step:nth-child(even){margin-top:0}.flow-svg{display:none}
}
@media(max-width:780px){
  body{font-size:16px}
  .collage{grid-template-columns:1fr 1fr}.collage .main{grid-column:1/-1;grid-row:1}.collage .capsule{margin-bottom:14px}
  .stats{grid-template-columns:1fr 1fr}.stats div:nth-child(3){border-left:0}.stats div:nth-child(n+3){border-top:1px dashed #c9d7e2}
  .split-head,.fleet,.share,.legal{grid-template-columns:1fr}.legal aside{display:none}
  .bento{grid-template-columns:1fr}.tile{min-height:440px}
  .place-grid{grid-template-columns:1fr 1fr}
  .hl-grid,.cover,.arrange,.f-grid{grid-template-columns:1fr}.notes{grid-template-columns:1fr}
  .pd-gallery{grid-template-columns:1fr 1fr;grid-auto-rows:130px}
  .porthole{bottom:-40px;width:230px}
  .c1,.c2{bottom:12%}.c3,.c4{display:none}.page-hero .cloud:not(.bank){display:none}.plane{top:58%}
  .hero{min-height:640px}.hero-copy{top:96px}
  .scroll-cue{display:none}.ai-fab span{display:none}.ai-fab{padding:13px}
  .cat-bar{position:static;padding-top:14px}.cat-right{width:100%;justify-content:space-between}
  .nav-logo img{height:44px}.nav-cta .btn{display:none}
  .pd-tabs nav{padding-top:10px}
  .flow-steps{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
@media print{.site-nav,.fab-wa,.ai-fab,.ai-panel,.ft,.ft-cta,.mob-book{display:none!important}}

/* ── Decor and flow ─────────────────────────────────────────────── */
body{animation:page-in .45s ease}
@keyframes page-in{from{opacity:0}}

.flightline{position:fixed;left:0;right:0;top:0;height:3px;z-index:75;pointer-events:none}
.flightline::before{content:'';position:absolute;inset:0;transform:scaleX(var(--p,0));transform-origin:left;background:linear-gradient(90deg,var(--sky-300),var(--sky-500) 60%,var(--gold))}
.flightline svg{position:absolute;top:-6px;left:calc(var(--p,0)*100% - 13px);width:15px;height:15px;fill:var(--gold);filter:drop-shadow(0 1px 2px rgba(10,31,56,.35))}

.sun::after{content:'';position:absolute;inset:-22%;border-radius:50%;background:radial-gradient(circle,transparent 30%,#2b97e3 70%),repeating-conic-gradient(rgba(255,255,255,.2) 0 5deg,transparent 5deg 15deg);opacity:.75;will-change:rotate;animation:spin 90s linear infinite}
@keyframes spin{to{rotate:360deg}}
.birds{position:absolute;left:0;top:20%;z-index:3;display:flex;gap:22px;align-items:flex-end;animation:birds 42s linear infinite;pointer-events:none}
.birds i{display:block;width:20px;height:9px;border-top:2px solid rgba(255,255,255,.85);border-radius:50% 50% 0 0;transform-origin:center bottom;animation:flap .7s ease-in-out infinite alternate}
.birds i:nth-child(2){margin-bottom:13px;animation-delay:.2s}.birds i:nth-child(3){margin-bottom:-6px;animation-delay:.4s}
@keyframes flap{to{transform:scaleY(.35)}}
@keyframes birds{from{transform:translate(-14vw,50px)}to{transform:translate(114vw,-60px)}}

.float-card{position:absolute;z-index:9;bottom:clamp(120px,21vh,210px);width:210px;padding:12px 16px;background:rgba(255,255,255,.95);color:var(--navy);border-radius:16px;box-shadow:0 24px 40px -22px rgba(6,40,90,.6);animation:bob 6s ease-in-out infinite}
.float-card small{display:block;font-size:12.5px;color:var(--muted)}
.float-card b{display:flex;align-items:center;gap:8px;font:600 21px/1.25 var(--display)}
.float-card b i{color:var(--sky-500);font-size:18px}
.float-card span{font-size:13.5px;color:var(--muted)}
.fc-left{left:clamp(24px,14vw,230px);rotate:-5deg;border-left:4px dashed var(--sky-300)}
.fc-right{right:clamp(24px,14vw,230px);rotate:4deg;animation-delay:-3s}
@keyframes bob{50%{translate:0 -14px}}

#why{position:relative;overflow:hidden}
#why .wrap{position:relative;z-index:1}
.orb{position:absolute;border-radius:50%;pointer-events:none;background:radial-gradient(circle,var(--sky-100),transparent 68%);animation:drift 18s ease-in-out infinite alternate}
.o1{width:560px;height:560px;left:-180px;top:6%}
.o2{width:680px;height:680px;right:-240px;bottom:4%;background:radial-gradient(circle,#fdf3dc,transparent 66%);animation-delay:-8s}
@keyframes drift{to{translate:50px -40px;scale:1.12}}

.spin-badge{position:absolute;z-index:3;width:118px;height:118px;left:calc(60% + 6px);top:-46px;display:grid;place-items:center}
.spin-badge svg{position:absolute;inset:0;animation:spin 26s linear infinite}
.spin-badge i{position:relative;color:var(--sky-300);font-size:30px}
.collage{position:relative}

.kinetic{overflow:hidden;padding:clamp(20px,3vw,34px) 0;background:var(--navy);color:#fff;rotate:-1.4deg;width:104%;margin-left:-2%;box-shadow:0 30px 50px -40px rgba(10,31,56,.7)}
.k-row{display:flex;width:max-content;will-change:transform}
.k-row span{display:inline-flex;align-items:center;font:600 clamp(32px,5.4vw,78px)/1.15 var(--display);letter-spacing:-.02em;padding-right:.5em;white-space:nowrap}
.k-row span::after{content:'';display:inline-block;width:.46em;height:.46em;margin-left:.5em;background:var(--gold);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%)}
.k-row.alt span{font-size:clamp(20px,2.6vw,36px);color:transparent;-webkit-text-stroke:1px var(--sky-300)}
.k-row.alt span::after{background:var(--sky-400)}

.arc{position:absolute;left:0;top:10px;width:100%;height:auto;max-height:320px;pointer-events:none;z-index:0}
.arc path{stroke:var(--gold);stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:0;opacity:.55}
#places{position:relative}#places .wrap{position:relative;z-index:1}
.split-head{position:relative}
.stamp{position:absolute;z-index:0;padding:7px 15px;border:2.5px solid currentColor;outline:1px solid currentColor;outline-offset:3px;border-radius:9px;text-align:center;rotate:var(--tilt,-6deg);opacity:.72;pointer-events:none;line-height:1.15}
.stamp b{display:block;font:700 19px var(--display);letter-spacing:.09em}
.stamp small{font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.s-gold{color:#b98526}.s-maroon{color:var(--maroon)}

.rail-nav{display:flex;align-items:center;gap:8px}
.rail-btn{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:#fff;cursor:pointer;display:grid;place-items:center;transition:background .2s,color .2s,scale .2s}
.rail-btn:hover{background:var(--navy);color:#fff;scale:1.06}
.pk-rail.dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.pk-rail.dragging a{pointer-events:none}
.bento,.pk-rail,.pk-grid,.tiers{perspective:1300px}
.pk,.tile,.tier{transition:transform .4s var(--ease),box-shadow .4s,border-color .3s,rotate .25s ease-out}
.pk::before,.tile::before,.tier::before{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.28),transparent 62%)}
.pk:hover::before,.tile:hover::before,.tier:hover::before{opacity:1}
.tier{position:relative;overflow:hidden}
.pk-badge{z-index:2}
.pk-grid .pk{animation:card-in .6s var(--ease) backwards}
.pk-grid .pk:nth-child(3n+2){animation-delay:.07s}.pk-grid .pk:nth-child(3n){animation-delay:.14s}
@keyframes card-in{from{opacity:0;transform:translateY(26px)}}
.btn-sky,.btn-dark,.btn-white{position:relative;overflow:hidden}
.btn-sky::after,.btn-dark::after,.btn-white::after{content:'';position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.38),transparent);transform:skewX(-18deg);transition:left .6s var(--ease);pointer-events:none}
.btn-sky:hover::after,.btn-dark:hover::after,.btn-white:hover::after{left:120%}

.wave{position:absolute;left:0;right:0;height:clamp(40px,5.4vw,78px);overflow:hidden;pointer-events:none;z-index:2;line-height:0}
.wave.top{top:-1px}.wave.bottom{bottom:-1px;rotate:180deg}
.wave svg{position:absolute;left:0;top:0;width:200%;height:100%;animation:wave 13s linear infinite;max-width:none}
.wave svg+svg{animation-duration:21s;animation-direction:reverse;opacity:.5}
@keyframes wave{to{transform:translateX(-50%)}}
.flow{padding-block:clamp(110px,13vw,180px)}
#thread{position:absolute;left:0;top:0;width:100%;pointer-events:none;z-index:0;overflow:visible}
#thread path.line{stroke:var(--sky-300);stroke-width:2.2;stroke-dasharray:8 11;fill:none}
main.has-thread>section,main.has-thread>.hero-track{position:relative;z-index:1}
main{overflow-x:clip}
.page-hero .flyer{position:absolute;left:0;top:30%;width:clamp(120px,13vw,190px);z-index:1;pointer-events:none}

.tl{position:relative;padding-left:30px}
.line-rail{position:absolute;left:6px;top:10px;bottom:10px;width:2px;background:var(--sky-200)}
.days .line-rail{left:19px;top:30px;bottom:30px;background:none;z-index:0}
.line-rail i{position:absolute;left:0;top:0;width:100%;height:100%;background:var(--sky-500);transform:scaleY(var(--f,0));transform-origin:top}
.line-rail b{position:absolute;left:50%;top:calc(var(--f,0)*100%);width:22px;height:22px;margin:-11px 0 0 -11px;background:var(--gold);clip-path:polygon(50% 100%,12% 8%,50% 26%,88% 8%)}
body.umrah .flow{background-color:#f6fbff;background-image:linear-gradient(180deg,rgba(255,255,255,.2),rgba(224,242,254,.6)),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96' fill='none' stroke='%23d9a84e' stroke-opacity='.3'%3E%3Cpath d='M48 12 58 38 84 48 58 58 48 84 38 58 12 48 38 38Z'/%3E%3Cpath d='M22 22 41 34 48 12 55 34 74 22 62 41 84 48 62 55 74 74 55 62 48 84 41 62 22 74 34 55 12 48 34 41Z'/%3E%3C/svg%3E")}
@media(max-width:1180px){.float-card{display:none}}
@media(max-width:1080px){#thread,#thread-plane{display:none}.spin-badge{display:none}}
@media(max-width:780px){.stamp{display:none}.kinetic{rotate:-1deg}.rail-btn{display:none}.arc{display:none}}
@media(prefers-reduced-motion:reduce){.k-row{flex-wrap:wrap;width:auto}}
@media print{.flightline,#thread,#thread-plane,.wave,.orb,.stamp,.spin-badge{display:none!important}}

/* ── Footer: trip box and moving skyline ────────────────────────── */
.ft-cta{text-align:center;padding:clamp(60px,8vw,110px) var(--gutter) clamp(40px,5vw,70px);background:#fff;position:relative;overflow:hidden}
.ft-art{width:clamp(250px,30vw,430px);height:auto;margin:0 auto 18px;animation:ft-float 7s ease-in-out infinite}
@keyframes ft-float{50%{translate:0 -14px;rotate:1.2deg}}
.ft-cta h2{font-size:clamp(34px,4.4vw,60px);max-width:13ch;margin:0 auto 28px}
.ft-box{width:min(680px,100%);margin:0 auto;background:var(--sky-50);border:1px solid var(--sky-100);border-radius:28px;padding:20px 22px 16px;text-align:left;transition:box-shadow .3s,border-color .3s}
.ft-box:focus-within{border-color:var(--sky-300);box-shadow:0 0 0 4px rgba(56,189,248,.16)}
.ft-box textarea{display:block;width:100%;border:0;outline:0;background:none;resize:none;font-size:17px;line-height:1.5;color:var(--ink)}
.ft-box textarea::placeholder{color:#7f92a3}
.ft-box>div{display:flex;justify-content:space-between;align-items:center;margin-top:10px}
.ft-wa{width:46px;height:46px;border-radius:50%;background:#fff;color:#16a34a;display:grid;place-items:center;box-shadow:0 6px 14px -8px rgba(10,50,90,.5);transition:transform .25s var(--ease)}
.ft-wa:hover{transform:translateY(-2px)}.ft-wa svg{width:22px;height:22px}
.ft{background:#fff;position:relative;overflow:hidden}
.ft-links{display:grid;grid-template-columns:1.8fr repeat(3,minmax(130px,.6fr));gap:32px;padding-top:clamp(30px,4vw,56px)}
.ft-brand img{height:104px;width:auto}
.ft-brand p{color:var(--muted);margin:10px 0 12px;font-size:16px}
.ft-social{display:flex;gap:8px}
.ft-social a{width:40px;height:40px;border-radius:50%;background:var(--sky-50);color:var(--sky-700);display:grid;place-items:center;transition:background .2s,color .2s,transform .25s var(--ease)}
.ft-social a:hover{background:var(--sky-500);color:#fff;transform:translateY(-3px)}
.ft-social svg{width:19px;height:19px}
.ft-links h4{font:600 15px var(--body);letter-spacing:.06em;text-transform:uppercase;color:#3a5163;margin-bottom:12px}
.ft-links>div:not(.ft-brand) a{display:block;color:var(--muted);padding:4px 0;font-size:16px;transition:color .2s,translate .2s}
.ft-links>div:not(.ft-brand) a:hover{color:var(--sky-700);translate:3px 0}
.ft-copy{color:#8a9cac;font-size:14px;padding-top:22px}
.skyline{position:relative;height:clamp(400px,44vw,740px);margin-top:10px;overflow:hidden;user-select:none}
.sky-in{position:absolute;top:0;bottom:0;left:50%;width:max(100%,980px);translate:-50% 0}
.stk{position:absolute}
#thread-plane{position:absolute;left:0;top:0;width:40px;height:33px;z-index:0;pointer-events:none;will-change:transform}
#thread-plane svg{display:block;width:100%;height:100%}
.stk img{display:block;width:100%;height:auto;transform-origin:50% 90%;animation:stk-sway var(--t,4s) ease-in-out var(--d,0s) infinite alternate;transition:scale .3s var(--ease);cursor:grab;touch-action:pan-y}
.stk img:hover{scale:1.05}
.stk img:active{cursor:grabbing}
@keyframes stk-sway{from{rotate:-1.3deg;translate:0 3px}to{rotate:1.3deg;translate:0 -5px}}
.stk-sun img{animation:spin 28s linear infinite;transform-origin:50% 50%}
.stk-puff img{animation:stk-drift calc(var(--t,4s)*3) ease-in-out var(--d,0s) infinite alternate}
@keyframes stk-drift{to{translate:46px -6px}}
.stk-sailboat img,.stk-houseboat img,.stk-kashmir img{animation-name:stk-bob}
@keyframes stk-bob{from{rotate:-2.4deg;translate:-5px 5px}to{rotate:2.4deg;translate:7px -5px}}
.stk-plane{position:absolute;left:0;top:7%;width:12%;z-index:2;animation:stk-fly 24s linear infinite;pointer-events:none}
@keyframes stk-fly{from{transform:translate(-20vw,50px) rotate(-5deg)}to{transform:translate(115vw,-30px) rotate(-5deg)}}
@media(max-width:860px){.ft-links{grid-template-columns:1fr 1fr 1fr}.ft-brand{grid-column:1/-1}}
@media(max-width:520px){.ft-links{grid-template-columns:1fr 1fr}.ft-box{padding:16px 16px 14px}}
@media(prefers-reduced-motion:reduce){.ft-art,.stk img,.stk-plane{animation:none}}

.resting,.resting *,.resting *::before,.resting *::after{animation-play-state:paused!important}
