:root{
  --bg:#F6F7F9; --card:#fff; --line:#DCE0E6; --line-2:#D6DBE1;
  --navy:#16213A; --navy-2:#1E2C49; --ink:#2A2F38; --ink-2:#586172; --muted:#5C6573; --muted-2:#AEB5BF;
  --green:#C9A24A; --green-d:#8A6D1E; --green-soft:#FBF6E9; --green-line:#EBDBB0;
  --wa:#C9A24A; --gold:#8A6D1E; --feat:#EF8A2B; --heart:#E5484D; --star:#F5A623;
  --shadow-xs:0 1px 2px rgba(20,30,50,.06); --shadow-sm:0 1px 2px rgba(20,30,50,.05),0 5px 12px -5px rgba(20,30,50,.10);
  --shadow:0 2px 6px -2px rgba(20,30,50,.07),0 12px 26px -10px rgba(20,30,50,.13); --shadow-lg:0 8px 18px -6px rgba(20,30,50,.12),0 26px 54px -18px rgba(20,30,50,.22);
  --sans:"Plus Jakarta Sans",system-ui,-apple-system,sans-serif; --maxw:1280px;
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; overflow-x:hidden; }
body{ font-family:var(--sans); color:var(--ink); background:var(--bg); font-size:15px; line-height:1.5; -webkit-font-smoothing:antialiased; }
body.lock{ overflow:hidden; }
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }
.container{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 22px; }
.tnum{ font-variant-numeric:tabular-nums; }
.lbl{ font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.sec-h{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:18px; flex-wrap:wrap; }
.sec-h h2{ font-size:clamp(20px,2.5vw,27px); font-weight:700; color:var(--navy); letter-spacing:-.02em; } .sec-h p{ color:var(--muted); font-size:14px; margin-top:3px; } .sec-h a{ font-size:13.5px; font-weight:600; color:var(--green-d); }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:7px; font-family:var(--sans); font-weight:600; font-size:13.5px; padding:10px 15px; border-radius:8px; cursor:pointer; border:1px solid transparent; transition:transform .14s,background .18s,box-shadow .2s,border-color .18s,color .18s; white-space:nowrap; }
.btn--green{ background:var(--green); color:#16213A; } .btn--green:hover{ background:var(--green-d); color:#fff; } .btn--wa{ background:var(--wa); color:#16213A; } .btn--wa:hover{ filter:brightness(.96); }
.btn--navy{ background:var(--navy); color:#fff; } .btn--navy:hover{ filter:brightness(1.18); } .btn--out{ background:#fff; color:var(--ink); border-color:var(--line-2); } .btn--out:hover{ border-color:var(--navy); }
.btn--sm{ padding:8px 12px; font-size:12.5px; } .btn--full{ width:100%; } .btn--lg{ padding:13px 22px; font-size:15px; }
.mark{ flex:none; } .word{ font-weight:700; letter-spacing:-.03em; } .word .gd{ color:var(--gold); }

.ubar{ background:var(--navy); color:#C5CEDD; font-size:12px; } .ubar__in{ display:flex; align-items:center; justify-content:center; gap:7px 20px; flex-wrap:wrap; padding:7px 14px; text-align:center; } .ubar b{ color:#fff; } .ubar .v{ color:#E8C56B; font-weight:600; } .ubar .sep{ opacity:.3; }

.hd{ background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:40; box-shadow:var(--shadow-xs); }
.hd__in{ display:flex; align-items:center; gap:26px; height:70px; }
.brand{ display:flex; align-items:center; gap:11px; }
.brand .mark{ height:40px; width:auto; animation:brandin .7s cubic-bezier(.2,.8,.2,1) both; }
.brandtxt{ display:flex; flex-direction:column; justify-content:center; line-height:1.05; animation:brandin .7s cubic-bezier(.2,.8,.2,1) .08s both; }
.brand .word{ font-size:23px; letter-spacing:-.03em; color:#16213A; }
.brand 
.slogan{ font-size:10.5px; font-weight:600; letter-spacing:.02em; color:var(--ink-2); margin-top:2px; white-space:nowrap; }

@keyframes brandin{ from{ opacity:0; transform:translateY(-7px); } to{ opacity:1; transform:none; } }
@media(max-width:680px){ .slogan{ display:none; } .brand .word{ font-size:21px; } .brand .mark{ height:38px; } }
.hd__nav{ display:flex; gap:2px; } .hd__nav a{ font-size:13.5px; font-weight:600; color:var(--ink-2); padding:8px 11px; border-radius:8px; } .hd__nav a:hover{ background:var(--bg); color:var(--navy); }
@media(max-width:680px){ .hd__nav.open{ display:flex; position:absolute; top:68px; left:0; right:0; flex-direction:column; background:#fff; padding:10px 16px 14px; gap:2px; box-shadow:var(--shadow); border-bottom:1px solid var(--line); z-index:39; } }
.hd__r{ margin-left:auto; display:flex; align-items:center; gap:11px; }
.nocall{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; color:var(--green-d); background:var(--green-soft); padding:6px 11px; border-radius:999px; } .nocall .d{ width:7px; height:7px; border-radius:50%; background:var(--green); }
.menu-btn{ display:none; width:40px; height:38px; border:1px solid var(--line-2); border-radius:8px; background:#fff; cursor:pointer; align-items:center; justify-content:center; }
.menu-btn span,.menu-btn span::before,.menu-btn span::after{ content:""; display:block; width:17px; height:2px; background:var(--navy); border-radius:8px; position:relative; } .menu-btn span::before{ position:absolute; top:-5px; } .menu-btn span::after{ position:absolute; top:5px; }

/* search hero */
.searchwrap{ position:relative; padding:54px 0 50px; overflow:hidden; background:#F4F6FA; }
.searchwrap__bg{ position:absolute; inset:0; overflow:hidden; background:radial-gradient(760px 360px at 18% 2%,rgba(201,162,74,.09),transparent 62%),radial-gradient(720px 360px at 86% 10%,rgba(96,165,250,.06),transparent 64%),linear-gradient(180deg,#FCFCFD 0%,#F2F5FB 100%); opacity:1; }.searchwrap__bg::before{ content:""; position:absolute; left:50%; top:-12%; width:680px; height:400px; margin-left:-340px; border-radius:50%; background:radial-gradient(closest-side,rgba(201,162,74,.07),transparent 72%); filter:blur(40px); pointer-events:none; animation:fzAurora 17s ease-in-out infinite; }@keyframes fzAurora{0%,100%{transform:translate(-9%,0) scale(1)}50%{transform:translate(11%,20px) scale(1.16)}}@media(prefers-reduced-motion:reduce){.searchwrap__bg::before{animation:none}}.searchwrap__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,18,36,.55) 0%,rgba(11,18,36,.35) 45%,rgba(11,18,36,.92) 100%)}
.searchwrap__bg::after{ content:""; position:absolute; inset:0; background:radial-gradient(rgba(22,33,58,.045) 1px,transparent 1.4px) 0 0/24px 24px; }
.searchwrap__in{ position:relative; text-align:center; }
.searchwrap h1{ color:#16213A; font-size:clamp(28px,4vw,46px); font-weight:700; letter-spacing:-.026em; } .searchwrap h1 em{ font-style:normal; color:#A87C1E; }
.searchwrap p{ color:#586172; font-size:15.5px; margin-top:8px; }
.search{ background:#fff; border:1px solid #E3E7EE; border-radius:16px; box-shadow:var(--shadow-lg); padding:7px; margin:22px auto 0; max-width:980px; display:grid; grid-template-columns:1.2fr 1fr 1fr 1.1fr auto; gap:3px; text-align:left; }
.sf{ position:relative; display:flex; flex-direction:column; justify-content:center; padding:9px 14px; border-radius:8px; } .sf+.sf{ box-shadow:-1px 0 0 var(--line); } .sf:hover{ background:var(--bg); }
.sf label{ font-size:10px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); } .sf select{ appearance:none; border:none; background:transparent; font-family:var(--sans); font-weight:600; font-size:14.5px; color:var(--navy); cursor:pointer; padding:2px 16px 0 0; } .sf::after{ content:"⌄"; position:absolute; right:12px; bottom:10px; color:var(--green); pointer-events:none; }
.search .go{ display:flex; } .search .go .btn{ height:100%; padding:0 24px; }
.chips{ display:flex; gap:9px; flex-wrap:wrap; justify-content:center; margin-top:18px; }
.chips .c{ font-size:13px; font-weight:600; color:#fff; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18); padding:7px 13px; border-radius:999px; cursor:pointer; transition:.15s; } .chips .c:hover{ background:rgba(255,255,255,.22); } .chips .c .h{ color:#E8C56B; }
.smeta{ text-align:center; margin-top:13px; font-size:13.5px; font-weight:600; color:#586172; }
.smeta b{ color:#8A6D1E; }.searchwrap #chips .c{color:#16213A!important;background:#fff!important;border:1px solid #DCE0E6!important}.searchwrap #chips .c:hover{border-color:#C9A24A!important}
.sf select:focus{ outline:none; }
.sf:focus-within{ background:var(--bg); box-shadow:inset 0 0 0 2px var(--green); }
.search:focus-within{ box-shadow:0 0 0 3px rgba(201,162,74,.20), 0 22px 44px -18px rgba(0,0,0,.42); }
.search .go .sgo{ display:inline-flex; align-items:center; transition:transform .15s,box-shadow .2s; }
.search .go .sgo:hover{ transform:translateY(-1px); box-shadow:0 12px 24px -8px rgba(201,162,74,.55); }

.tstrip{ background:#fff; border-bottom:1px solid var(--line); }
.tstrip__in{ display:flex; align-items:center; justify-content:center; gap:10px 20px; flex-wrap:wrap; padding:14px 22px; text-align:center; }
.tstrip span{ font-size:12.5px; font-weight:600; color:var(--ink-2); }
.tstrip .sep{ color:var(--line-2); }

/* sections */
.sec{ padding:54px 0; } .sec.alt{ background:#fff; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }

/* emirate tiles */
.emis{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.emi{ position:relative; height:170px; border-radius:16px; overflow:hidden; cursor:pointer; box-shadow:var(--shadow-xs); background:linear-gradient(150deg,#22325a,#13203a 58%,#0c1730); transition:transform .18s,box-shadow .22s; }
.emi:hover{ transform:translateY(-3px); box-shadow:var(--shadow-sm); }
.emi__glow{ position:absolute; right:-30px; top:-30px; width:160px; height:160px; border-radius:50%; z-index:0; pointer-events:none; }
.emi__sky{ position:absolute; left:0; right:0; bottom:0; height:62px; z-index:0; opacity:.5; pointer-events:none; }
.emi::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,transparent 48%,rgba(8,13,26,.5)); pointer-events:none; }
.emi__c{ position:absolute; left:18px; bottom:15px; right:16px; z-index:2; color:#fff; } .emi__c .n{ font-size:20px; font-weight:700; letter-spacing:-.01em; } .emi__c .m{ font-size:12.5px; color:#C7D2E6; margin-top:3px; }

/* business type tiles */
.types{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.type{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:20px 14px; text-align:center; cursor:pointer; transition:transform .16s,border-color .16s,box-shadow .2s; } .type:hover{ transform:translateY(-3px); border-color:var(--green-line); box-shadow:var(--shadow-sm); }
.type .i{ width:48px; height:48px; border-radius:12px; background:var(--green-soft); display:flex; align-items:center; justify-content:center; font-size:21px; font-weight:700; color:var(--green-d); margin:0 auto 11px; } .type .i svg{ width:24px; height:24px; stroke:var(--green-d); fill:none; stroke-width:1.7; } .type .n{ font-size:14px; font-weight:600; color:var(--navy); } .type .m{ font-size:12px; color:var(--muted); margin-top:2px; }

/* results */
.rlayout{ display:grid; grid-template-columns:236px 1fr; gap:22px; align-items:start; }
.rail{ position:sticky; top:74px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:4px 16px 14px; box-shadow:var(--shadow-xs); }
.rail__h{ display:flex; align-items:center; justify-content:space-between; padding:13px 0 11px; border-bottom:1px solid var(--line); } .rail__h .t{ font-size:14px; font-weight:600; color:var(--navy); } .rail__h .clr{ font-size:12px; font-weight:600; color:var(--green-d); cursor:pointer; }
.fg{ padding:14px 0; border-bottom:1px solid var(--line); } .fg:last-child{ border-bottom:none; } .fg>.lbl{ display:block; margin-bottom:10px; }
.seg{ display:flex; gap:4px; } .seg button{ flex:1; font-weight:600; font-size:13px; color:var(--ink-2); background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:8px 0; cursor:pointer; } .seg button.on{ background:var(--green); color:#16213A; border-color:var(--green); }
.opt{ display:flex; align-items:center; gap:9px; padding:6px 0; cursor:pointer; font-size:13.5px; color:var(--ink-2); } .opt input{ accent-color:var(--green); width:15px; height:15px; }
.sortbar{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:14px; } .sortbar .cnt{ font-size:15px; font-weight:600; color:var(--navy); } .sortbar .cnt .sub{ color:var(--muted); font-weight:500; font-size:13px; }
.sortbar__r{ margin-left:auto; display:flex; align-items:center; gap:8px; } .sortbar__r label{ font-size:13px; color:var(--muted); } .selw{ position:relative; } .selw select{ appearance:none; font-weight:600; font-size:13px; color:var(--navy); background:#fff; border:1px solid var(--line-2); border-radius:8px; padding:8px 28px 8px 12px; cursor:pointer; font-family:var(--sans); } .selw::after{ content:"⌄"; position:absolute; right:11px; top:45%; transform:translateY(-50%); color:var(--green); pointer-events:none; } .mfilter{ display:none; }
.grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.card{ background:var(--card); border:1px solid var(--line); border-radius:12px; overflow:hidden; box-shadow:var(--shadow-xs); transition:transform .18s,box-shadow .22s,border-color .18s; display:flex; flex-direction:column; } .card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-sm); border-color:var(--line-2); }
.ph{ position:relative; height:172px; background-size:cover; background-position:center; } .ph::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.28),transparent 38%,transparent 70%,rgba(0,0,0,.3)); }
.ph__tl{ position:absolute; top:10px; left:10px; display:flex; gap:6px; z-index:1; } .ph__tr{ position:absolute; top:10px; right:10px; z-index:1; }
.pbadge{ display:inline-flex; align-items:center; gap:5px; font-size:10.5px; font-weight:600; padding:4px 8px; border-radius:8px; } .pbadge.verified{ background:var(--green); color:#16213A; } .pbadge.feat{ background:var(--navy); color:#E8C56B; }
.save{ width:30px; height:30px; border-radius:50%; background:rgba(255,255,255,.92); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:15px; color:#7A828D; box-shadow:var(--shadow-xs); } .save:hover,.save.on{ color:var(--heart); }
.ph__count{ position:absolute; bottom:9px; right:10px; z-index:1; font-size:11px; font-weight:600; color:#fff; background:rgba(0,0,0,.5); padding:3px 8px; border-radius:8px; } .ph__zone{ position:absolute; bottom:9px; left:11px; z-index:1; color:#fff; font-weight:600; font-size:14px; text-shadow:0 1px 3px rgba(0,0,0,.5); }
.brandchip{ position:absolute; bottom:9px; left:10px; z-index:2; display:flex; align-items:center; gap:9px; max-width:calc(100% - 54px); } .brandchip .lg{ width:46px; height:46px; border-radius:12px; background:#fff; box-shadow:0 2px 9px rgba(0,0,0,.28); display:flex; align-items:center; justify-content:center; overflow:hidden; flex:none; } .brandchip .lg img{ width:100%; height:100%; object-fit:contain; padding:6px; } .brandchip .lg.mono{ color:#fff; font-weight:700; font-size:19px; } .brandchip .znm{ color:#fff; font-weight:700; font-size:14px; line-height:1.15; text-shadow:0 1px 5px rgba(0,0,0,.7); }
.dwlogo{ height:36px; width:auto; max-width:130px; background:#fff; border-radius:8px; padding:5px 8px; vertical-align:middle; margin-right:11px; box-shadow:0 2px 8px rgba(0,0,0,.2); }
.cb{ padding:12px 14px 13px; display:flex; flex-direction:column; flex:1; } .cb__price{ font-size:21px; font-weight:700; color:var(--navy); letter-spacing:-.01em; animation:fzrep .5s ease; } @keyframes fzrep{ 0%{ color:var(--green-d); transform:translateY(-3px); opacity:.35; } 100%{ color:var(--navy); transform:none; opacity:1; } } .cb__price .c{ font-size:13px; font-weight:600; color:var(--muted); } .cb__price .per{ font-size:12px; font-weight:600; color:var(--muted); margin-left:6px; }
.cb__title{ font-size:14px; font-weight:600; color:var(--ink); margin-top:5px; } .cb__loc{ font-size:12.5px; color:var(--muted); margin-top:3px; display:flex; align-items:center; gap:5px; } .cb__loc svg{ width:13px; height:13px; fill:none; stroke:var(--green-d); stroke-width:1.8; flex:none; }
.cb__specs{ display:flex; flex-wrap:wrap; gap:5px 13px; margin-top:11px; padding-top:11px; border-top:1px solid var(--line); }
.cb__acts{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.actchip{ font-size:11px; font-weight:600; color:#6E5410; background:rgba(182,138,36,.08); border:1px solid rgba(182,138,36,.22); border-radius:999px; padding:3px 9px; } .sp{ display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--ink-2); font-weight:600; } .sp svg{ width:15px; height:15px; fill:none; stroke:var(--ink-2); stroke-width:1.7; flex:none; }
.cb__foot{ display:flex; align-items:center; gap:7px; margin-top:auto; padding-top:13px; } .cb__foot .btn{ flex:1; } .cmp{ display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ink-2); cursor:pointer; padding:8px 9px; border:1px solid var(--line); border-radius:8px; } .cmp input{ accent-color:var(--green); }

/* budget tiles */
.budgets{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.bud{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px 18px; cursor:pointer; transition:.16s; } .bud:hover{ border-color:var(--green-line); box-shadow:var(--shadow-sm); transform:translateY(-2px); } .bud.on{ border-color:var(--green); background:var(--green-soft); }
.bud .a{ font-size:24px; font-weight:700; color:var(--navy); } .bud .m{ font-size:13px; color:var(--muted); margin-top:3px; } .bud .cta{ font-size:12.5px; font-weight:600; color:var(--green-d); margin-top:12px; }

/* guides */
.guides{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.guide{ background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; cursor:pointer; transition:transform .16s,box-shadow .2s; } .guide:hover{ transform:translateY(-3px); box-shadow:var(--shadow-sm); }
.guide img{ width:100%; height:120px; object-fit:cover; } .guide .gb{ padding:14px; } .guide .tag{ font-size:10.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--green-d); } .guide h3{ font-size:15px; font-weight:600; color:var(--navy); margin-top:6px; line-height:1.3; } .guide .rd{ font-size:12.5px; color:var(--muted); margin-top:8px; }

/* stats */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1px solid var(--line); border-radius:16px; overflow:hidden; background:#fff; }
.stat{ padding:28px 20px; text-align:center; border-right:1px solid var(--line); } .stat:last-child{ border-right:none; } .stat .n{ font-size:34px; font-weight:700; color:var(--green-d); letter-spacing:-.02em; } .stat .l{ font-size:13px; color:var(--ink-2); margin-top:5px; }

/* reviews */
.revs{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.rev{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px; } .rev .stars{ color:var(--star); font-size:15px; letter-spacing:2px; } .rev p{ font-size:14.5px; color:var(--ink); margin-top:12px; line-height:1.6; } .rev .by{ display:flex; align-items:center; gap:10px; margin-top:16px; } .rev .av{ width:36px; height:36px; border-radius:50%; background:var(--navy); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:600; font-size:14px; } .rev .nm{ font-size:13.5px; font-weight:600; color:var(--navy); } .rev .rl{ font-size:12px; color:var(--muted); }

/* app banner */
.app{ background:linear-gradient(120deg,var(--navy),var(--navy-2)); border-radius:16px; padding:40px; display:grid; grid-template-columns:1fr auto; gap:30px; align-items:center; overflow:hidden; position:relative; }
.app::before{ content:""; position:absolute; right:-40px; top:-40px; width:300px; height:300px; background:radial-gradient(circle,rgba(201,162,74,.16),transparent 65%); }
.app h2{ color:#fff; font-size:clamp(24px,3vw,34px); font-weight:700; letter-spacing:-.02em; } .app p{ color:#BCC6D6; font-size:15px; margin-top:10px; max-width:42ch; }
.app .badges{ display:flex; gap:11px; margin-top:20px; flex-wrap:wrap; } .app .badge{ display:inline-flex; align-items:center; gap:9px; background:#000; color:#fff; padding:10px 16px; border-radius:12px; font-weight:600; } .app .badge .ic{ font-size:22px; } .app .badge small{ display:block; font-size:9.5px; font-weight:500; opacity:.8; } .app .badge b{ font-size:15px; }
.phones{ position:relative; z-index:1; }
.phone{ width:170px; height:330px; background:#fff; border:6px solid #0B1422; border-radius:16px; box-shadow:var(--shadow-lg); overflow:hidden; }
.phone__not{ height:22px; background:#0B1422; border-radius:0 0 12px 12px; width:90px; margin:0 auto; }
.phone__ph{ height:120px; background:url("https://images.unsplash.com/photo-1546412414-e1885259563a?auto=format&fit=crop&w=400&q=60") center/cover; } .phone__b{ padding:12px; } .phone__pr{ font-size:18px; font-weight:700; color:var(--navy); } .phone__t{ font-size:12px; color:var(--ink-2); margin-top:3px; } .phone__chip{ display:inline-block; font-size:10px; font-weight:600; color:var(--green-d); background:var(--green-soft); padding:4px 8px; border-radius:8px; margin-top:10px; }

/* faq */
.faq{ max-width:720px; margin:0 auto; } .qa{ border-bottom:1px solid var(--line); } .qa__q{ display:flex; justify-content:space-between; gap:14px; padding:17px 2px; cursor:pointer; font-size:15.5px; font-weight:600; color:var(--navy); } .qa__q .ic{ color:var(--green); font-size:19px; transition:transform .3s; } .qa.open .ic{ transform:rotate(45deg); } .qa__a{ max-height:0; overflow:hidden; transition:max-height .35s ease; } .qa.open .qa__a{ max-height:170px; } .qa__a p{ padding:0 2px 17px; color:var(--ink-2); }

/* compare bar / drawer / modal (shared) */
.cbar{ position:fixed; left:50%; bottom:20px; transform:translate(-50%,150%); z-index:45; background:var(--navy); color:#fff; border-radius:12px; box-shadow:var(--shadow-lg); display:flex; align-items:center; gap:14px; padding:11px 13px 11px 18px; transition:transform .35s cubic-bezier(.2,.8,.2,1); } .cbar.show{ transform:translate(-50%,0); } .cbar .t{ font-size:13px; } .cbar .pills{ display:flex; gap:6px; } .cbar .cp{ font-size:12px; background:rgba(255,255,255,.13); padding:5px 9px; border-radius:8px; display:flex; gap:6px; } .cbar .cp .x{ cursor:pointer; opacity:.7; }
.overlay{ position:fixed; inset:0; z-index:60; background:rgba(15,22,38,.5); opacity:0; pointer-events:none; transition:opacity .3s; } .overlay.show{ opacity:1; pointer-events:auto; }
.drawer{ position:fixed; inset:0; width:100%; background:var(--bg); z-index:61; box-shadow:var(--shadow-lg); transform:translateY(18px); opacity:0; pointer-events:none; transition:transform .34s cubic-bezier(.2,.8,.2,1),opacity .26s; overflow-y:auto; -webkit-overflow-scrolling:touch; } .drawer.show{ transform:none; opacity:1; pointer-events:auto; }
.ztop{ position:sticky; top:0; z-index:6; background:rgba(246,247,249,.94); -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px); display:flex; align-items:center; gap:10px; padding:11px 22px; border-bottom:1px solid var(--line); }
.ztop .back{ display:inline-flex; align-items:center; gap:7px; font-weight:600; color:var(--navy); cursor:pointer; border:1px solid var(--line-2); background:#fff; border-radius:8px; padding:9px 14px; font-size:13.5px; } .ztop .back:hover{ border-color:var(--navy); }
.zwrap{ max-width:1140px; margin:0 auto; padding:22px 22px 80px; }
.zhero{ position:relative; height:230px; border-radius:16px; overflow:hidden; background-size:cover; background-position:center; box-shadow:var(--shadow); } .zhero::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(15,22,38,.12),rgba(15,22,38,.8)); }
.zhero__c{ position:absolute; left:0; right:0; bottom:0; z-index:1; display:flex; align-items:center; gap:15px; padding:20px 24px; flex-wrap:wrap; } .zhero__lg{ width:64px; height:64px; border-radius:16px; background:#fff; box-shadow:0 4px 14px rgba(0,0,0,.3); display:flex; align-items:center; justify-content:center; overflow:hidden; flex:none; } .zhero__lg img{ width:100%; height:100%; object-fit:contain; padding:9px; } .zhero__lg.mono{ color:#fff; font-weight:700; font-size:26px; }
.zhero__n{ color:#fff; font-size:clamp(24px,3.4vw,34px); font-weight:700; letter-spacing:-.02em; text-shadow:0 1px 6px rgba(0,0,0,.45); } .zhero__loc{ color:#E7ECF4; font-size:14px; margin-top:3px; display:flex; align-items:center; gap:6px; } .zhero__loc svg{ width:15px; height:15px; fill:none; stroke:#E8C56B; stroke-width:1.8; flex:none; }
.zlede{ font-size:16px; color:var(--ink-2); line-height:1.6; margin:20px 2px 0; max-width:760px; }
.zgrid{ display:grid; grid-template-columns:1fr 384px; gap:26px; align-items:start; margin-top:24px; }
.zaside{ position:sticky; top:80px; }
.zmain{ display:flex; flex-direction:column; gap:16px; }
.zcard{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:20px 22px; box-shadow:var(--shadow-xs); } .zcard h3{ font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--green-d); font-weight:600; margin-bottom:13px; }
.qbox{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:18px; box-shadow:var(--shadow); } .qbox__h{ font-size:16px; font-weight:700; color:var(--navy); margin-bottom:13px; letter-spacing:-.01em; }
.qsum{ background:var(--green-soft); border:1px solid var(--green-line); border-radius:12px; padding:13px 15px; margin:14px 0; } .qsum .qn{ font-size:13px; color:var(--ink-2); line-height:1.5; } .qsum .qn b{ color:var(--navy); font-weight:700; } .qsum .qt{ display:flex; align-items:baseline; justify-content:space-between; margin-top:8px; padding-top:8px; border-top:1px dashed var(--green-line); } .qsum .qt .l{ font-size:12.5px; color:var(--ink-2); } .qsum .qt .v{ font-size:26px; font-weight:700; color:var(--navy); letter-spacing:-.01em; }
.qnote{ font-size:11.5px; color:var(--muted); margin-top:12px; text-align:center; line-height:1.5; }
/* ===== guided zone wizard ===== */
.zwrap--wiz{ max-width:1040px; } .zhero--sm{ height:150px; }
.wsteps{ display:flex; align-items:center; justify-content:center; gap:6px; margin:26px auto 4px; max-width:580px; }
.wstep{ display:flex; align-items:center; gap:9px; } .wsnum{ width:30px; height:30px; border-radius:50%; background:#fff; border:1.5px solid var(--line-2); color:var(--muted); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; flex:none; transition:.2s; } .wslab{ font-size:13px; font-weight:600; color:var(--muted); white-space:nowrap; }
.wstep.on .wsnum{ background:var(--navy); border-color:var(--navy); color:#fff; } .wstep.on .wslab{ color:var(--navy); }
.wstep.done .wsnum{ background:var(--green); border-color:var(--green); color:#16213A; } .wstep.done .wslab{ color:var(--green-d); }
.wsbar{ flex:1; height:2px; background:var(--line-2); min-width:20px; max-width:64px; }
.wbody{ margin-top:18px; min-height:240px; }
.wq{ font-size:clamp(21px,3vw,27px); font-weight:700; color:var(--navy); letter-spacing:-.02em; text-align:center; } .wsub{ font-size:14.5px; color:var(--ink-2); text-align:center; margin:7px auto 0; max-width:580px; }
.wback{ display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--ink-2); background:none; border:none; cursor:pointer; margin-bottom:14px; font-family:var(--sans); } .wback:hover{ color:var(--navy); }
.vcards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; margin-top:24px; }
.vcard{ position:relative; text-align:left; background:#fff; border:1.5px solid var(--line); border-radius:16px; padding:20px; cursor:pointer; transition:transform .15s,border-color .15s,box-shadow .2s; font-family:var(--sans); } .vcard:hover{ transform:translateY(-3px); border-color:var(--green); box-shadow:var(--shadow); }
.vcard__n{ font-size:20px; font-weight:700; color:var(--navy); letter-spacing:-.01em; } .vcard__s{ font-size:12.5px; color:var(--muted); margin-top:5px; min-height:32px; } .vcard__p{ font-size:18px; font-weight:700; color:var(--green-d); margin-top:12px; } .vcard__p span{ font-size:12px; font-weight:600; color:var(--muted); } .vcard__go{ display:block; font-size:12.5px; font-weight:600; color:var(--green-d); margin-top:12px; }
.pcards{ display:flex; flex-direction:column; gap:12px; margin:24px auto 0; max-width:680px; }
.pcard{ text-align:left; background:#fff; border:1.5px solid var(--line); border-radius:16px; padding:17px 19px; cursor:pointer; transition:border-color .15s,box-shadow .2s,transform .12s; font-family:var(--sans); } .pcard:hover{ border-color:var(--green); box-shadow:var(--shadow-sm); transform:translateY(-2px); }
.pcard__top{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; } .pcard__n{ font-size:15.5px; font-weight:700; color:var(--navy); } .pcard__p{ font-size:19px; font-weight:700; color:var(--navy); white-space:nowrap; } .pcard__m{ font-size:12.5px; color:var(--muted); margin-top:4px; }
.pcard__inc{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:10px; } .pcard__inc span{ font-size:12px; color:var(--ink-2); } .pcard__go{ display:block; font-size:12.5px; font-weight:600; color:var(--green-d); margin-top:11px; }
.wreview{ display:grid; grid-template-columns:1fr 360px; gap:24px; align-items:start; margin-top:8px; } .wrev__main{ display:flex; flex-direction:column; gap:18px; }
.wrev__hd{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; } .wrev__zone{ font-size:12px; color:var(--muted); font-weight:600; text-transform:uppercase; letter-spacing:.05em; } .wrev__pkg{ font-size:22px; font-weight:700; color:var(--navy); letter-spacing:-.01em; margin-top:3px; }
.wrev__price{ background:linear-gradient(135deg,var(--navy),var(--navy-2)); color:#fff; border-radius:16px; padding:22px 24px; box-shadow:var(--shadow); } .wrev__amt{ font-size:38px; font-weight:700; letter-spacing:-.02em; } .wrev__amt span{ font-size:18px; font-weight:600; opacity:.7; } .wrev__meta{ font-size:13px; color:#BFC8D6; margin-top:6px; }
.wrev__sec h4{ font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--green-d); font-weight:600; margin-bottom:11px; } .wrev__cols{ display:grid; grid-template-columns:1fr 1fr; gap:18px; } .wrev__cta{ position:sticky; top:78px; }
@media (max-width:880px){ .wreview{ grid-template-columns:1fr; } .wrev__cta{ position:static; } .wrev__cols{ grid-template-columns:1fr; } .wslab{ display:none; } }
/* ===== wizard SaaS polish: live total bar · flags · checkout ===== */
.zwrap--wiz{ padding-bottom:92px; }
.wsumbar{ position:fixed; left:0; right:0; bottom:0; z-index:65; background:linear-gradient(135deg,#16213A,#1E2C49); border-top:1px solid rgba(201,162,74,.32); box-shadow:0 -12px 34px -18px rgba(8,14,28,.85); }
.wsumbar.hide{ display:none; }
.wsumbar__in{ max-width:1040px; margin:0 auto; padding:11px 22px; min-height:60px; display:flex; align-items:center; gap:16px; }
.wsumbar__l{ flex:1 1 auto; min-width:0; }
.wsumbar__lab{ font-size:10px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; color:#C9A24A; }
.wsumbar__crumb{ font-size:13px; color:#C6CFDC; font-weight:600; margin-top:3px; line-height:1.35; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.wsumbar__crumb b{ color:#fff; font-weight:700; } .wsumbar__crumb .sep{ color:#54627c; margin:0 6px; } .wsumbar__crumb .ph{ color:#8C9AB2; font-weight:600; }
.wsumbar__sp{ margin-left:auto; text-align:right; flex:none; }
.wsumbar__from{ font-size:10px; letter-spacing:.05em; text-transform:uppercase; color:#9FB0C6; font-weight:600; }
.wsumbar__amt{ font-size:23px; font-weight:700; letter-spacing:-.01em; line-height:1.1; background:linear-gradient(100deg,#a87f2f,#ffe39a 50%,#a87f2f); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.wsumbar__amt small{ font-size:13px; -webkit-text-fill-color:#C9A24A; }
.wsumbar__amt.flash{ animation:sumflash .45s ease; }
@keyframes sumflash{ 0%{ transform:scale(1); } 38%{ transform:scale(1.06); } 100%{ transform:scale(1); } }
@media (max-width:560px){ .wsumbar__crumb .full{ display:none; } .wsumbar__in{ padding:10px 16px; gap:10px; } .wsumbar__amt{ font-size:20px; } }
.vcard__flag,.pcard__flag{ position:absolute; top:-10px; left:16px; z-index:1; font-size:10px; font-weight:700; letter-spacing:.03em; color:#3D2D06; background:linear-gradient(135deg,#F4E2B8,#E8C56B 45%,#C9A24A); border-radius:999px; padding:3px 10px; box-shadow:0 5px 12px -5px rgba(150,110,30,.7); }
.pcard__flag{ left:16px; }
.vcard.pop{ border-color:#E3C572; } .vcard.pop:hover{ border-color:#C9A24A; }
.vcard.sel,.pcard.sel{ border-color:var(--green)!important; box-shadow:0 0 0 3px var(--green-soft),var(--shadow-sm); }
.vcard__tick,.pcard__tick{ position:absolute; top:13px; right:13px; width:21px; height:21px; border-radius:50%; background:var(--green); color:#16213A; display:none; align-items:center; justify-content:center; font-size:11px; font-weight:700; }
.pcard__tick{ top:-8px; right:-8px; box-shadow:0 2px 6px -1px rgba(14,135,107,.5); }
.vcard.sel .vcard__tick,.pcard.sel .pcard__tick{ display:flex; }
.pcard{ position:relative; } .pcard.val{ border-color:#E3C572; }
.qbox--co{ border:1.5px solid #EBDBB0; box-shadow:0 16px 40px -18px rgba(150,110,30,.34); }
.qco__break{ border-top:1px dashed var(--green-line); margin-top:11px; padding-top:10px; font-size:11.5px; color:var(--muted); line-height:1.5; }
.qco__trust{ margin:13px 0 2px; display:flex; flex-direction:column; gap:7px; }
.qco__trust li{ list-style:none; font-size:11.8px; color:var(--ink-2); display:flex; gap:8px; align-items:flex-start; line-height:1.45; } .qco__trust .c{ color:var(--green-d); font-weight:700; flex:none; }
/* ===== per-zone cost calculator (Meydan-style) ===== */
.zwrap--calc{ max-width:1140px; padding-bottom:96px; }
.zhero--cl{ height:152px; }
.calchead{ margin:22px 2px 2px; max-width:780px; } .calchead h1{ font-size:clamp(23px,3.2vw,31px); font-weight:700; color:var(--navy); letter-spacing:-.02em; line-height:1.15; } .calchead p{ font-size:14.5px; color:var(--ink-2); line-height:1.6; margin-top:9px; }
.calcgrid{ display:grid; grid-template-columns:1fr 372px; gap:24px; align-items:start; margin-top:18px; }
.calcmain{ display:flex; flex-direction:column; gap:16px; min-width:0; }
.calcside{ position:sticky; top:78px; }
.calcbelow{ display:flex; flex-direction:column; gap:16px; margin-top:16px; }
.cblock{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:20px 22px; box-shadow:var(--shadow-xs); }
.cblock__h{ display:flex; align-items:center; gap:11px; flex-wrap:wrap; font-size:16.5px; font-weight:700; color:var(--navy); letter-spacing:-.01em; }
.cblock__no{ width:25px; height:25px; border-radius:50%; background:var(--navy); color:#fff; font-size:13px; font-weight:700; display:flex; align-items:center; justify-content:center; flex:none; }
.cblock__opt{ font-size:10.5px; font-weight:600; color:var(--muted); background:var(--bg); border:1px solid var(--line); border-radius:999px; padding:2px 9px; text-transform:uppercase; letter-spacing:.04em; }
.cblock__sub{ font-size:13.5px; color:var(--ink-2); margin:8px 0 0; line-height:1.5; }
.cblock__h2{ font-size:16px; font-weight:700; color:var(--navy); letter-spacing:-.01em; margin-bottom:13px; }
.vcards--cl{ grid-template-columns:repeat(auto-fit,minmax(146px,1fr)); gap:11px; margin-top:16px; }
.vcards--cl .vcard{ padding:15px 15px 16px; border-radius:16px; }
.vcards--cl .vcard__n{ font-size:17px; } .vcards--cl .vcard__s{ font-size:11.5px; min-height:30px; margin-top:4px; }
.vcards--cl .vcard__p{ font-size:16px; margin-top:10px; color:var(--navy); } .vcards--cl .vcard__p span{ font-size:10px; display:block; color:var(--muted); font-weight:600; text-transform:uppercase; letter-spacing:.05em; margin-bottom:1px; }
.cpkg{ border:1px solid var(--green-line); background:var(--green-soft); border-radius:12px; padding:14px 16px; margin-top:2px; }
.cpkg__top{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; } .cpkg__n{ font-size:15px; font-weight:700; color:var(--navy); } .cpkg__p{ font-size:18px; font-weight:700; color:var(--green-d); white-space:nowrap; }
.cpkg__m{ font-size:12.5px; color:var(--ink-2); margin-top:4px; } .cpkg__inc{ display:flex; flex-wrap:wrap; gap:5px 14px; margin-top:9px; } .cpkg__inc span{ font-size:12px; color:var(--ink-2); }
.addons{ display:flex; flex-direction:column; gap:8px; margin-top:7px; }
.addon{ display:flex; align-items:center; gap:13px; text-align:left; width:100%; background:#fff; border:1.5px solid var(--line); border-radius:12px; padding:13px 15px; cursor:pointer; font-family:var(--sans); transition:border-color .15s,box-shadow .15s,background .15s; }
.addon:hover{ border-color:var(--green-line); } .addon.on{ border-color:var(--green); background:var(--green-soft); box-shadow:0 0 0 3px var(--green-soft); }
.addon__chk{ width:22px; height:22px; border-radius:8px; border:1.5px solid var(--line-2); background:#fff; color:#fff; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; flex:none; } .addon.on .addon__chk{ background:var(--green); border-color:var(--green); }
.addon__main{ flex:1; min-width:0; } .addon__n{ display:block; font-size:14px; font-weight:600; color:var(--navy); } .addon__s{ display:block; font-size:12px; color:var(--muted); margin-top:2px; line-height:1.4; }
.addon__p{ font-size:14px; font-weight:700; color:var(--navy); white-space:nowrap; flex:none; }
.qsumm{ background:#fff; border:1.5px solid #EBDBB0; border-radius:16px; padding:20px; box-shadow:0 16px 40px -18px rgba(150,110,30,.34); }
.qsumm__h{ font-size:11px; letter-spacing:.08em; text-transform:uppercase; font-weight:700; color:var(--green-d); }
.qsumm__zone{ font-size:17px; font-weight:700; color:var(--navy); letter-spacing:-.01em; margin:3px 0 12px; }
.qrows{ display:flex; flex-direction:column; }
.qrow{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--line); font-size:13.5px; color:var(--ink-2); }
.qrow b{ color:var(--navy); font-weight:700; white-space:nowrap; } .qrow--add span{ color:var(--green-d); } .qrow--add b{ color:var(--green-d); }
.qsumm__tot{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-top:12px; padding-top:13px; border-top:2px solid var(--navy); }
.qsumm__tot span{ font-size:13px; font-weight:600; color:var(--ink-2); } .qsumm__tot b{ font-size:30px; font-weight:700; color:var(--navy); letter-spacing:-.02em; line-height:1; } .qsumm__tot b small{ font-size:15px; font-weight:600; color:var(--muted); margin-right:2px; }
.qsumm__sub{ font-size:11.5px; color:var(--muted); text-align:center; margin:11px 0 14px; }
.qsumm .qco__trust{ margin-top:14px; }
.cfeats{ display:grid; grid-template-columns:1fr 1fr; gap:12px; } .cfeat{ border:1px solid var(--line); border-radius:12px; padding:14px 15px; } .cfeat__n{ font-size:13.5px; font-weight:700; color:var(--navy); margin-bottom:4px; } .cfeat__m{ font-size:12.5px; color:var(--ink-2); line-height:1.5; }
.cgriddoc{ display:grid; grid-template-columns:1fr 1fr; gap:26px; }
@media (max-width:940px){ .calcgrid{ grid-template-columns:1fr; } .calcside{ position:static; } .cfeats,.cgriddoc{ grid-template-columns:1fr; } }
@media (min-width:941px){ .wsumbar{ display:none!important; } }
/* ===== Meydan-style full calculator: duration, shareholders, activities w/ photos, visa types, explainer ===== */
.durtiles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:8px; margin-top:7px; }
.durtile{ position:relative; text-align:left; background:#fff; border:1.5px solid var(--line); border-radius:12px; padding:13px 15px; cursor:pointer; font-family:var(--sans); font-size:15px; font-weight:700; color:var(--navy); transition:border-color .15s,box-shadow .15s,transform .12s; }
.durtile span{ display:block; font-size:11px; font-weight:600; color:var(--muted); margin-top:3px; }
.durtile:hover{ border-color:var(--green-line); transform:translateY(-1px); } .durtile.on{ border-color:var(--green); box-shadow:0 0 0 3px var(--green-soft); }
.durnote{ font-size:12px; color:var(--green-d); font-weight:600; margin-top:9px; min-height:14px; }
.stepper{ display:inline-flex; align-items:center; border:1.5px solid var(--line); border-radius:12px; overflow:hidden; background:#fff; flex:none; }
.stepper button{ width:38px; height:38px; border:none; background:#fff; font-size:20px; font-weight:600; color:var(--navy); cursor:pointer; line-height:1; font-family:var(--sans); transition:background .12s; }
.stepper button:hover{ background:var(--green-soft); color:var(--green-d); }
.stepper b{ min-width:42px; text-align:center; font-size:16px; font-weight:700; color:var(--navy); }
.sharerow{ display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:15px; flex-wrap:wrap; }
.sharerow__t{ font-size:13.5px; color:var(--ink-2); flex:1; min-width:180px; }
.vtypes{ display:flex; flex-direction:column; gap:8px; margin-top:7px; }
.vtype{ display:flex; align-items:center; gap:13px; border:1px solid var(--line); border-radius:12px; padding:11px 14px; }
.vtype__ic{ font-size:22px; flex:none; line-height:1; }
.vtype__main{ flex:1; min-width:0; } .vtype__n{ font-size:14px; font-weight:700; color:var(--navy); } .vtype__s{ font-size:12px; color:var(--muted); margin-top:1px; }
.actsgrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:11px; margin-top:15px; }
.actcard{ position:relative; height:104px; border-radius:12px; overflow:hidden; border:1.5px solid var(--line); background:linear-gradient(135deg,var(--navy),var(--navy-2)); cursor:pointer; padding:0; font-family:var(--sans); transition:border-color .15s,box-shadow .15s,transform .12s; }
.actcard:hover{ transform:translateY(-2px); } .actcard__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.actcard::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg,rgba(12,20,38,.10),rgba(12,20,38,.80)); }
.actcard__lab{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:10px 12px; color:#fff; font-size:12.5px; font-weight:700; text-align:left; text-shadow:0 1px 4px rgba(0,0,0,.55); line-height:1.25; }
.actcard__chk{ position:absolute; top:9px; right:9px; z-index:3; width:22px; height:22px; border-radius:50%; background:var(--green); color:#16213A; display:none; align-items:center; justify-content:center; font-size:12px; font-weight:700; box-shadow:0 2px 6px rgba(0,0,0,.3); }
.actcard.on{ border-color:var(--green); box-shadow:0 0 0 3px var(--green-soft); } .actcard.on .actcard__chk{ display:flex; }
.actcard__pop{ position:absolute; top:9px; left:9px; z-index:3; font-size:9px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#3D2D06; background:linear-gradient(135deg,#F4E2B8,#E8C56B 45%,#C9A24A); border-radius:999px; padding:3px 8px; }
.actcard.noimg .actcard__img{ display:none; }
.actnote{ font-size:12px; color:var(--muted); margin-top:11px; }
.qrow--note span{ color:var(--ink-2); } .qrow--note b{ color:var(--muted); font-weight:600; font-size:12px; }
.qsumm__sel{ font-size:11.5px; color:var(--ink-2); background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:8px 11px; margin:11px 0 0; line-height:1.45; }
.explain{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.excard{ border:1px solid var(--line); border-radius:16px; overflow:hidden; background:#fff; }
.excard__img{ height:120px; width:100%; object-fit:cover; display:block; background:linear-gradient(135deg,var(--navy),var(--navy-2)); }
.excard__b{ padding:14px 16px; } .excard__h{ font-size:14.5px; font-weight:700; color:var(--navy); margin-bottom:5px; } .excard__b p{ font-size:12.8px; color:var(--ink-2); line-height:1.55; }
@media (max-width:760px){ .explain{ grid-template-columns:1fr; } }
/* ===== license type tiles ===== */
.lictiles{ display:grid; grid-template-columns:1fr 1fr; gap:11px; margin-top:15px; }
.lictile{ position:relative; text-align:left; background:#fff; border:1.5px solid var(--line); border-radius:16px; padding:15px 16px; cursor:pointer; font-family:var(--sans); transition:border-color .15s,box-shadow .15s,transform .12s; }
.lictile__e{ font-size:22px; display:block; line-height:1; } .lictile__n{ display:block; font-size:15px; font-weight:700; color:var(--navy); margin-top:8px; } .lictile__s{ display:block; font-size:12px; color:var(--muted); margin-top:3px; }
.lictile:hover{ border-color:var(--green-line); transform:translateY(-1px); } .lictile.on{ border-color:var(--green); box-shadow:0 0 0 3px var(--green-soft); }
@media (max-width:520px){ .lictiles{ grid-template-columns:1fr; } }
/* ===== activity search + groups + sub-activities ===== */
.actsearch{ display:flex; align-items:center; gap:9px; background:#fff; border:1.5px solid var(--line); border-radius:12px; padding:0 14px; margin-top:15px; }
.actsearch__i{ font-size:15px; opacity:.6; flex:none; } .actsearch input{ flex:1; border:none; outline:none; background:none; font-family:var(--sans); font-size:16px; color:var(--navy); padding:13px 0; }
.actsearch:focus-within{ border-color:var(--green); box-shadow:0 0 0 3px var(--green-soft); }
.grpgrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:11px; margin-top:13px; }
.grpcard{ position:relative; text-align:left; background:#fff; border:1.5px solid var(--line); border-radius:12px; padding:14px 14px 13px; cursor:pointer; font-family:var(--sans); transition:border-color .15s,box-shadow .15s,transform .12s; }
.grpcard:hover{ border-color:var(--green-line); transform:translateY(-2px); }
.grpcard__chk{ position:absolute; top:10px; right:10px; width:20px; height:20px; border-radius:8px; border:1.5px solid var(--line-2); background:#fff; color:#fff; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; }
.grpcard.has .grpcard__chk{ background:var(--green); border-color:var(--green); } .grpcard.has,.grpcard.open{ border-color:var(--green); }
.grpcard.open{ box-shadow:0 0 0 3px var(--green-soft); }
.grpcard__e{ font-size:24px; display:block; line-height:1; } .grpcard__n{ display:block; font-size:13.5px; font-weight:700; color:var(--navy); margin-top:9px; line-height:1.25; } .grpcard__m{ display:block; font-size:11.5px; color:var(--muted); margin-top:3px; }
.subwrap{ margin-top:13px; }
.subhead{ font-size:13px; font-weight:700; color:var(--navy); margin:6px 0 10px; }
.subchips{ display:flex; flex-wrap:wrap; gap:8px; }
.subchip{ display:inline-flex; align-items:center; gap:5px; background:#fff; border:1.5px solid var(--line); border-radius:999px; padding:8px 13px; font-family:var(--sans); font-size:12.5px; font-weight:600; color:var(--navy); cursor:pointer; transition:border-color .14s,background .14s; }
.subchip i{ font-style:normal; font-size:10.5px; color:var(--muted); font-weight:600; } .subchip:hover{ border-color:var(--green-line); }
.subchip.on{ border-color:var(--green); background:var(--green-soft); color:var(--green-d); } .subchip.on i{ color:var(--green-d); opacity:.8; }
.actnote{ font-size:12px; color:var(--muted); margin-top:12px; }
/* ===== visa type photo cards ===== */
.vcards2{ display:grid; grid-template-columns:repeat(3,1fr); gap:13px; margin-top:15px; }
.vcard2{ border:1.5px solid var(--line); border-radius:16px; overflow:hidden; background:#fff; display:flex; flex-direction:column; }
.vcard2__img{ height:120px; width:100%; object-fit:cover; display:block; background:linear-gradient(135deg,var(--navy),var(--navy-2)); }
.vcard2.noimg .vcard2__img{ display:none; }
.vcard2__b{ padding:13px 15px 15px; display:flex; flex-direction:column; gap:7px; flex:1; }
.vcard2__n{ font-size:14.5px; font-weight:700; color:var(--navy); } .vcard2__s{ font-size:12px; color:var(--ink-2); line-height:1.45; flex:1; }
.vcard2 .stepper{ align-self:flex-start; margin-top:2px; }
@media (max-width:760px){ .vcards2{ grid-template-columns:1fr; } .vcard2{ flex-direction:row; } .vcard2__img{ width:120px; height:auto; flex:none; } }
/* ===== activity selector v2 (creative) + per-visa price ===== */
.actsel{ margin-top:13px; } .actsel__h{ font-size:11px; letter-spacing:.05em; text-transform:uppercase; font-weight:700; color:var(--green-d); margin-bottom:8px; }
.actsel__row{ display:flex; flex-wrap:wrap; gap:7px; }
.acttag{ display:inline-flex; align-items:center; gap:7px; background:var(--green-soft); border:1px solid var(--green-line); color:var(--green-d); border-radius:999px; padding:6px 8px 6px 12px; font-family:var(--sans); font-size:12px; font-weight:600; cursor:pointer; }
.acttag span{ font-weight:700; font-size:14px; line-height:1; opacity:.7; } .acttag:hover{ background:#fff; }
.grpcard.has .grpcard__chk{ background:var(--green); border-color:var(--green); color:#16213A; border-radius:50%; font-size:11px; }
.subpanel{ background:var(--bg); border:1px solid var(--line); border-radius:12px; padding:15px 16px; margin-top:13px; }
.subgrid{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.subrow{ display:flex; align-items:center; gap:10px; text-align:left; background:#fff; border:1.5px solid var(--line); border-radius:12px; padding:10px 12px; cursor:pointer; font-family:var(--sans); transition:border-color .14s,background .14s; }
.subrow:hover{ border-color:var(--green-line); } .subrow.on{ border-color:var(--green); background:var(--green-soft); }
.subrow__box{ width:20px; height:20px; border-radius:8px; border:1.5px solid var(--line-2); background:#fff; color:#fff; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; flex:none; }
.subrow.on .subrow__box{ background:var(--green); border-color:var(--green); }
.subrow__t{ font-size:12.5px; font-weight:600; color:var(--navy); line-height:1.3; } .subrow__t i{ display:block; font-style:normal; font-size:10.5px; color:var(--muted); font-weight:600; margin-top:1px; }
.submore{ font-size:12px; color:var(--muted); margin-top:10px; }
.vcard2__p{ font-size:13px; font-weight:700; color:var(--green-d); }
@media (max-width:560px){ .subgrid{ grid-template-columns:1fr; } }
/* ===== design polish pass: airier, larger, softer ===== */
.zwrap--calc{ max-width:1180px; }
.zhero--cl{ height:180px; }
.calchead{ margin:24px 2px 4px; }
.calchead h1{ font-size:clamp(26px,3.6vw,36px); letter-spacing:-.025em; }
.calchead p{ font-size:15px; }
.calcgrid{ gap:28px; }
.calcmain{ gap:18px; }
.cblock{ padding:24px 26px; border-radius:16px; box-shadow:0 8px 26px -16px rgba(16,33,58,.20); }
.cblock__h{ font-size:18px; gap:12px; }
.cblock__no{ width:28px; height:28px; font-size:14px; }
.cblock__sub{ font-size:14px; }
.cblock__h2{ font-size:17.5px; }
.qsumm{ padding:22px 22px 24px; border-radius:16px; box-shadow:0 22px 50px -22px rgba(150,110,30,.40); }
.qsumm__zone{ font-size:18px; }
.qrow{ padding:10px 0; font-size:14px; }
.qsumm__tot{ margin-top:14px; padding-top:15px; } .qsumm__tot b{ font-size:34px; } .qsumm__tot b small{ font-size:16px; }
.vcards2{ gap:14px; }
.vcard2{ border-radius:16px; box-shadow:0 6px 20px -14px rgba(16,33,58,.2); }
.vcard2__img{ height:142px; }
.vcard2__n{ font-size:15.5px; } .vcard2__s{ font-size:12.5px; }
.lictile{ padding:17px 18px; border-radius:16px; } .lictile__n{ font-size:15.5px; }
.durtile{ padding:15px 17px; }
.grpcard{ padding:16px 15px; border-radius:16px; } .grpcard__e{ font-size:26px; } .grpcard__n{ font-size:14px; }
.subpanel{ padding:16px 17px; border-radius:16px; } .subrow{ padding:11px 13px; }
.addon{ padding:14px 16px; border-radius:12px; }
.actsearch{ padding:2px 15px; border-radius:12px; } .actsearch input{ padding:14px 0; }
.excard{ border-radius:16px; } .excard__img{ height:128px; }
.cfeat{ padding:15px 16px; border-radius:12px; }
@media (max-width:920px){ .zgrid{ grid-template-columns:1fr; } .zaside{ position:static; } .zhero{ height:190px; } }
#printQuote{ display:none; }
#printQuote .pq{ font-family:var(--sans); color:#16213A; padding:8px 4px; } #printQuote .pqh{ display:flex; justify-content:space-between; align-items:flex-start; border-bottom:3px solid #C9A24A; padding-bottom:16px; } #printQuote .pqb{ font-size:26px; font-weight:700; } #printQuote .pqb i{ color:#C9A24A; font-style:normal; } #printQuote .pqm{ color:#8A929D; font-size:12px; } #printQuote .pqlg{ height:40px; margin-bottom:8px; } #printQuote .pqpill{ display:inline-block; background:#FBF6E9; color:#8A6D1E; font-size:11px; font-weight:600; padding:4px 9px; border-radius:8px; margin-top:6px; } #printQuote h2{ font-size:13px; margin:24px 0 8px; text-transform:uppercase; letter-spacing:.04em; color:#8A6D1E; } #printQuote .pqrow{ display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid #eee; font-size:14px; } #printQuote .pqtot{ display:flex; justify-content:space-between; padding:14px 0; font-size:22px; font-weight:700; border-top:2px solid #16213A; margin-top:6px; } #printQuote ul{ padding-left:18px; font-size:13px; color:#586172; line-height:1.7; } #printQuote .pqfoot{ margin-top:30px; font-size:11px; color:#8A929D; border-top:1px solid #eee; padding-top:12px; }
@media print{ html,body{ background:#fff !important; } body.lock{ overflow:visible !important; } body>*:not(#printQuote){ display:none !important; } #printQuote{ display:block !important; } }
.dw__hero{ height:170px; background-size:cover; background-position:center; position:relative; } .dw__hero::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.45)); } .dw__hx{ position:absolute; top:14px; right:14px; z-index:1; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.92); border:none; cursor:pointer; font-size:17px; } .dw__hname{ position:absolute; bottom:14px; left:18px; z-index:1; color:#fff; font-size:24px; font-weight:700; text-shadow:0 1px 4px rgba(0,0,0,.5); }
.dw__b{ padding:18px 20px 30px; } .dw__loc{ font-size:13px; color:var(--muted); } .dw__price{ display:flex; align-items:baseline; gap:8px; margin:14px 0; padding:14px 16px; background:#fff; border:1px solid var(--line); border-radius:12px; } .dw__price .a{ font-size:30px; font-weight:700; color:var(--navy); } .dw__price .per{ font-size:12.5px; color:var(--muted); margin-left:auto; }
.dw h3{ font-size:11px; letter-spacing:.07em; text-transform:uppercase; color:var(--green-d); margin:22px 0 11px; font-weight:600; }
.ptable{ border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fff; } .ptable .pr{ display:flex; justify-content:space-between; padding:10px 14px; font-size:13.5px; border-bottom:1px solid var(--line); } .ptable .pr:last-child{ border-bottom:none; } .ptable .pr.on{ background:var(--green-soft); } .ptable .pr .v{ font-weight:700; color:var(--navy); }
.dlist{ list-style:none; display:flex; flex-direction:column; gap:8px; } .dlist li{ display:flex; gap:10px; font-size:13.5px; color:var(--ink-2); align-items:center; } .dlist li .b{ width:19px; height:19px; border-radius:8px; background:var(--green-soft); color:var(--green-d); display:flex; align-items:center; justify-content:center; font-size:10px; flex:none; }
.tl{ list-style:none; } .tl li{ display:grid; grid-template-columns:auto 1fr auto; gap:12px; padding:10px 0; border-bottom:1px solid var(--line); align-items:center; } .tl li:last-child{ border-bottom:none; } .tl .n{ width:24px; height:24px; border-radius:50%; background:var(--green-soft); color:var(--green-d); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:600; } .tl .x{ font-size:13.5px; } .tl .d{ font-size:12px; color:var(--muted); }
.dw__cta{ position:sticky; bottom:0; background:var(--bg); padding:14px 20px; border-top:1px solid var(--line); }
.pkglist{ display:flex; flex-direction:column; gap:8px; } .pkgrow{ display:flex; align-items:center; gap:11px; padding:11px 13px; border:1.5px solid var(--line); border-radius:12px; background:#fff; cursor:pointer; transition:border-color .15s,box-shadow .15s; } .pkgrow:hover{ border-color:var(--green-line); } .pkgrow:has(input:checked){ border-color:var(--green); box-shadow:0 0 0 3px var(--green-soft); } .pkgrow input{ accent-color:var(--green); width:17px; height:17px; flex:none; } .pkgrow__main{ flex:1; min-width:0; } .pkgrow__n{ font-size:13.5px; font-weight:600; color:var(--navy); } .pkgrow__m{ font-size:11.5px; color:var(--muted); margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .pkgrow__p{ font-size:15px; font-weight:700; color:var(--navy); white-space:nowrap; } .dwq{ font-size:12.5px; color:var(--ink-2); margin-bottom:9px; } .dwq b{ color:var(--navy); } .setupbox{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:13px; margin-top:9px; } .setupbox input{ width:100%; padding:11px 12px; border:1px solid var(--line-2); border-radius:8px; font-family:var(--sans); font-size:16px; margin-bottom:8px; }
.cmodal{ position:fixed; inset:0; z-index:62; display:flex; align-items:center; justify-content:center; padding:22px; opacity:0; pointer-events:none; transition:opacity .3s; } .cmodal.show{ opacity:1; pointer-events:auto; } .cmodal__in{ background:#fff; border-radius:16px; box-shadow:var(--shadow-lg); max-width:820px; width:100%; max-height:86vh; max-height:86dvh; overflow:auto; } .cmodal__h{ position:sticky; top:0; background:#fff; display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid var(--line); font-weight:700; color:var(--navy); }
.cmptable{ width:100%; border-collapse:collapse; } .cmptable th,.cmptable td{ padding:12px 16px; text-align:left; border-bottom:1px solid var(--line); font-size:13.5px; } .cmptable th{ font-size:11px; text-transform:uppercase; color:var(--muted); } .cmptable .zn{ font-size:16px; font-weight:700; color:var(--navy); } .cmptable .pp{ font-size:19px; font-weight:700; color:var(--navy); } .cmptable td.best{ color:var(--green-d); } .cmptable .rl{ color:var(--muted); }

/* footer (Dubizzle-style big) */
.foot{ background:var(--navy); color:#A9B4C6; padding:16px 0 12px; } .foot__grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr 1fr; gap:16px; } .foot .fcolh{ font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:#fff; margin-bottom:8px; } .fgl a{ color:#cfe0f5; text-decoration:none; } .fgl a:hover{ text-decoration:underline; } .foot ul{ list-style:none; display:flex; flex-direction:column; gap:6px; } .foot ul a{ font-size:13.5px; color:#BFC8D6; } .foot ul a:hover{ color:#E8C56B; }
.foot .word{ color:#fff; font-size:21px; } .foot .word .gd{ color:#E8C56B; } .foot__b p{ font-size:12.5px; margin-top:4px; line-height:1.4; } .foot__b b{ color:#fff; } .foot__b .appmini{ display:flex; gap:8px; margin-top:7px; } .foot__b .appmini a{ background:#0B1422; color:#fff; padding:7px 12px; border-radius:8px; font-size:12px; font-weight:600; }
.foot__b .social{ display:flex; gap:8px; margin-top:7px; } .foot__b .social a{ width:38px; height:38px; border-radius:12px; background:#0B1422; display:flex; align-items:center; justify-content:center; color:#BFC8D6; transition:transform .16s,color .16s,background .16s; } .foot__b .social a:hover{ color:#16213A; background:var(--green); transform:translateY(-2px); } .foot__b .social svg{ width:19px; height:19px; fill:currentColor; }
.foot__bot{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:34px; padding-top:20px; border-top:1px solid rgba(255,255,255,.1); font-size:12.5px; color:#8893A4; }

.reveal{ opacity:0; transform:translateY(14px); transition:opacity .6s ease,transform .6s ease; } .reveal.in{ opacity:1; transform:none; }
::selection{ background:var(--green-soft); }

/* ===== home design upgrade: nav underline, difference, marquee, cta band ===== */
.hd__nav a{ position:relative; }
.hd__nav a::after{ content:""; position:absolute; left:11px; right:11px; bottom:4px; height:2px; background:var(--green); border-radius:8px; transform:scaleX(0); transform-origin:left; transition:transform .24s ease; }
.hd__nav a:hover::after{ transform:scaleX(1); }
.hd.scrolled{ box-shadow:0 8px 26px -14px rgba(20,30,50,.32); }
.vs{ display:grid; grid-template-columns:1fr 1fr; gap:18px; max-width:880px; margin:0 auto; }
.vs__col{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:24px 22px; }
.vs__col--us{ position:relative; border:1.5px solid var(--green); box-shadow:0 20px 44px -24px rgba(201,162,74,.5); }
.vs__badge{ position:absolute; top:-12px; left:22px; background:var(--green); color:#16213A; font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; padding:5px 12px; border-radius:999px; }
.vs__h{ font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; margin-bottom:15px; color:var(--navy); }
.vs__col--them .vs__h{ color:var(--muted); }
.vs ul{ list-style:none; display:flex; flex-direction:column; gap:12px; }
.vs li{ display:flex; gap:10px; font-size:14px; color:var(--ink-2); align-items:flex-start; line-height:1.45; }
.vs .x{ color:#C46; font-weight:700; flex:none; }
.vs .c{ color:var(--green-d); font-weight:700; flex:none; }
.vs{ position:relative; }
.vs__col{ transition:transform .2s,box-shadow .2s; }
.vs__col--them{ opacity:.9; filter:grayscale(.3); background:#FAFBFC; }
.vs__col--them .x{ display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; background:#FBEAEF; font-size:11px; }
.vs__col--us{ transform:translateY(-6px); background:linear-gradient(180deg,#fff 58%,var(--green-soft)); box-shadow:0 30px 60px -26px rgba(201,162,74,.55); }
.vs__col--us:hover{ transform:translateY(-11px); box-shadow:0 40px 74px -24px rgba(201,162,74,.66); }
.vs__col--us .c{ display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; background:var(--green-soft); font-size:12px; }
.vs::after{ content:"VS"; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:46px; height:46px; border-radius:50%; background:var(--navy); color:#fff; font-weight:700; font-size:13px; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 22px rgba(12,23,48,.3); border:4px solid var(--bg); z-index:4; }
@media(max-width:760px){ .vs::after{ display:none; } .vs__col--us{ transform:none; } }
.rrow{ transition:background .15s; }
.rrow:hover{ background:var(--green-soft); }
.rrow--cheap{ background:linear-gradient(90deg,var(--green-soft),transparent 72%); }
.rrow a{ color:inherit; text-decoration:none; }
.rrow a:hover{ color:var(--green-d); text-decoration:underline; }
.pbar{ height:5px; width:100%; max-width:150px; border-radius:999px; background:#EAEEF3; margin-top:7px; overflow:hidden; }
.pbar i{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,var(--green),var(--gold)); }
.marqwrap{ background:var(--bg); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:34px 0; }
.marqhead{ text-align:center; margin-bottom:22px; }
.marqhead h3{ font-size:clamp(18px,2.6vw,25px); font-weight:700; color:var(--navy); letter-spacing:-.015em; margin-top:7px; }
.marq{ overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); }
.marq__row{ display:flex; gap:16px; white-space:nowrap; width:max-content; animation:marq 42s linear infinite; }
.marq:hover .marq__row{ animation-play-state:paused; }
.mlogo{ display:inline-flex; align-items:center; justify-content:center; height:66px; padding:0 30px; background:#fff; border:1px solid var(--line); border-radius:16px; flex:none; box-shadow:var(--shadow-xs); transition:transform .15s ease,box-shadow .2s; }
.mlogo:hover{ transform:translateY(-3px); box-shadow:var(--shadow-sm); }
.mlogo img{ height:34px; width:auto; max-width:160px; object-fit:contain; display:block; }
.mlogo.mono{ font-size:17px; font-weight:700; letter-spacing:-.01em; color:var(--navy); }
@keyframes marq{ to{ transform:translateX(-50%); } }
.cta-band{ background:linear-gradient(120deg,var(--navy),var(--navy-2)); color:#fff; border-top:3px solid var(--gold); position:relative; overflow:hidden; }
.cta-band::before{ content:""; position:absolute; right:-60px; top:-60px; width:320px; height:320px; background:radial-gradient(circle,rgba(201,162,74,.16),transparent 65%); }
.cta-band__in{ position:relative; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:15px 0; flex-wrap:wrap; }
.cta-band h2{ font-size:clamp(23px,3vw,32px); font-weight:700; letter-spacing:-.02em; }
.cta-band p{ color:#BCC6D6; font-size:15px; margin-top:7px; }
.cta-band__btns{ display:flex; gap:11px; flex-wrap:wrap; }
@media(max-width:760px){ .vs{ grid-template-columns:1fr; } .cta-band__in{ flex-direction:column; align-items:flex-start; } }
/* featured real deal + includes */
.offerwrap{ display:flex; flex-direction:column; gap:16px; }
.incs{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.inc{ position:relative; overflow:hidden; isolation:isolate; display:flex; gap:13px; align-items:flex-start; background:#16213A center/cover no-repeat; border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:15px 17px; color:#fff; box-shadow:var(--shadow-sm); transition:transform .15s ease,box-shadow .2s; }
.inc::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:linear-gradient(120deg,rgba(13,22,44,.94),rgba(13,22,44,.8) 58%,rgba(11,42,30,.72)); }
.inc>*{ position:relative; z-index:1; }
.inc:hover{ transform:translateY(-2px); box-shadow:var(--shadow); }
.inc__i{ position:relative; width:40px; height:40px; border-radius:12px; background:rgba(201,162,74,.16); display:flex; align-items:center; justify-content:center; flex:none; }
.inc__i svg{ width:21px; height:21px; stroke:#E8C56B; fill:none; stroke-width:1.7; }
.inc__tag{ position:relative; font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#E8C56B; margin-bottom:3px; }
.inc__t{ position:relative; font-size:14px; font-weight:600; color:#fff; line-height:1.3; }
.inc__m{ position:relative; font-size:12px; color:#AEBBD0; margin-top:2px; }
/* SHAMS-style package tiles */
.btn--gold{ background:linear-gradient(135deg,#f4e2b8,#e8c56b 45%,#c9a24a 75%,#f4e2b8); background-size:200% 100%; color:#241803; } .btn--gold:hover{ background-position:100% 0; }
.pkgwrap{ position:relative; }
.pkgs{ display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; padding:6px 2px 14px; -webkit-overflow-scrolling:touch; scrollbar-width:thin; scrollbar-color:var(--line-2) transparent; }
.pkgs::-webkit-scrollbar{ height:8px; } .pkgs::-webkit-scrollbar-thumb{ background:var(--line-2); border-radius:8px; } .pkgs::-webkit-scrollbar-track{ background:transparent; }
.pkgcard{ flex:0 0 calc((100% - 18px)/2); scroll-snap-align:start; position:relative; background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--shadow-xs); transition:transform .16s ease,box-shadow .22s,border-color .18s; }
.pkgcard:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--line-2); }
.pkgcard.feat{ border:1.5px solid var(--gold); box-shadow:0 26px 54px -26px rgba(182,138,36,.45); }
.pkg__photo{ position:relative; height:124px; background:#16213A center/cover no-repeat; flex:none; }
.pkg__photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(8,14,28,.12),transparent 40%,rgba(8,14,28,.42)); }
.pkg__ribbon{ position:absolute; top:12px; right:12px; z-index:3; background:linear-gradient(135deg,#f4e2b8,#c9a24a); color:#241803; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:6px 12px; border-radius:999px; box-shadow:0 8px 18px -6px rgba(0,0,0,.4); }
.pkg__logo{ position:absolute; left:16px; bottom:-22px; z-index:2; width:54px; height:54px; border-radius:12px; background:#fff; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; overflow:hidden; box-shadow:0 6px 16px rgba(0,0,0,.22); }
.pkg__logo img{ width:100%; height:100%; object-fit:contain; padding:8px; }
.pkg__logo.mono{ font-weight:700; font-size:21px; color:var(--navy); background:var(--green-soft); }
.pkg__body{ padding:30px 20px 20px; display:flex; flex-direction:column; flex:1; }
.pkg__zn{ font-size:16px; font-weight:700; color:var(--navy); letter-spacing:-.01em; line-height:1.2; }
.pkg__loc{ font-size:12.5px; color:var(--muted); display:flex; align-items:center; gap:5px; margin-top:3px; }
.pkg__loc svg{ width:13px; height:13px; fill:none; stroke:var(--green-d); stroke-width:1.8; }
.pkg__price{ margin:13px 0 2px; }
.pkg__price .c{ font-size:13px; font-weight:600; color:var(--muted); }
.pkg__price .a{ font-size:31px; font-weight:700; color:var(--navy); letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.pkgcard.feat .pkg__price .a{ color:var(--green-d); }
.pkg__price .p{ display:block; font-size:12px; color:var(--muted); margin-top:3px; }
.pkg__feats{ list-style:none; display:flex; flex-direction:column; gap:8px; margin:14px 0 16px; }
.pkg__feats li{ display:flex; gap:9px; font-size:13px; color:var(--ink-2); align-items:flex-start; line-height:1.4; }
.pkg__feats .ck{ color:var(--green-d); font-weight:700; flex:none; }
.pkg__cta{ margin-top:auto; }
.pkg__tag{ align-self:flex-start; margin-top:9px; font-size:11.5px; font-weight:700; letter-spacing:.01em; color:var(--green-d); background:var(--green-soft); border:1px solid rgba(201,162,74,.28); padding:4px 11px; border-radius:999px; }
.pkg__visa{ display:flex; gap:7px; flex-wrap:wrap; margin:12px 0 2px; }
.pkg__visa span{ font-size:11.5px; font-weight:600; color:var(--ink-2); background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:3px 9px; white-space:nowrap; }
.pkg__visa span b{ color:var(--navy); font-weight:700; }
.pkgs-nav{ position:absolute; top:96px; z-index:6; width:42px; height:42px; border-radius:50%; background:#fff; border:1px solid var(--line); box-shadow:var(--shadow); cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:22px; line-height:1; color:var(--navy); transition:.15s; }
.pkgs-nav:hover{ border-color:var(--navy); transform:scale(1.06); } .pkgs-nav.prev{ left:-14px; } .pkgs-nav.next{ right:-14px; }
.pkgs{ scroll-behavior:smooth; scrollbar-width:none; }
.pkgs::-webkit-scrollbar{ height:0; }
.pkgcard{ transition:transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .26s,border-color .18s; }
.pkgcard:hover{ transform:translateY(-6px) scale(1.012); }
.pkgcard.feat{ animation:featglow 3s ease-in-out infinite; }
@keyframes featglow{ 0%,100%{ box-shadow:0 26px 54px -26px rgba(182,138,36,.42); } 50%{ box-shadow:0 30px 60px -22px rgba(182,138,36,.66); } }
.pkg__ribbon{ background-size:200% 100%; animation:ribbonsheen 3.2s linear infinite; }
@keyframes ribbonsheen{ to{ background-position:200% 0; } }
.pkgdots{ display:flex; justify-content:center; gap:7px; margin-top:6px; }
.pkgdots button{ width:24px; height:24px; padding:0; border:none; background:none; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; } .pkgdots button::before{ content:""; width:7px; height:7px; border-radius:999px; background:var(--line-2); transition:width .25s,background .25s; }
.pkgdots button.on::before{ width:22px; background:var(--green-d); }
@media(prefers-reduced-motion:reduce){ .pkgs{ scroll-behavior:auto; } .pkgcard.feat,.pkg__ribbon{ animation:none; } }
@media(max-width:820px){ .pkgcard{ flex:0 0 calc((100% - 18px)/2); } }
@media(max-width:560px){ .pkgcard{ flex:0 0 90%; } .pkgs-nav{ display:none; } }
@media(max-width:760px){ .incs{ grid-template-columns:1fr; } }

@media (max-width:1000px){ .rlayout{ grid-template-columns:1fr; } .rail{ display:none; } .mfilter{ display:inline-flex; } .grid{ grid-template-columns:repeat(2,1fr); } .emis{ grid-template-columns:repeat(2,1fr); } .types{ grid-template-columns:repeat(3,1fr); } .budgets{ grid-template-columns:repeat(2,1fr); } .guides{ grid-template-columns:repeat(2,1fr); } .revs{ grid-template-columns:1fr; } .stats{ grid-template-columns:repeat(2,1fr); } .search{ grid-template-columns:1fr 1fr; } .search .go{ grid-column:1/-1; } .search .go .btn{ width:100%; padding:13px; } .sf+.sf{ box-shadow:none; } .app{ grid-template-columns:1fr; } .phones{ display:none; } .foot__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:680px){ .hd__nav{ display:none; } .menu-btn{ display:flex; } .grid,.emis,.types,.budgets,.guides{ grid-template-columns:1fr; } .search{ grid-template-columns:1fr; } .sf+.sf{ box-shadow:0 -1px 0 var(--line); } .stats{ grid-template-columns:1fr; } .stat{ border-right:none; border-bottom:1px solid var(--line); } .foot__grid{ grid-template-columns:1fr; } }
/* ===== mobile polish + PWA safe-area ===== */
@media (max-width:680px){ .hd__r .nocall{ display:none; } .hd__in{ gap:12px; } .ubar__in{ font-size:11px; gap:3px 12px; padding:6px 12px; } }
@media (max-width:400px){ .ubar__in .v{ display:none; } .ubar__in .sep:last-of-type{ display:none; } }
.ubar{ padding-top:env(safe-area-inset-top,0px); }
@media (prefers-reduced-motion:reduce){ *{ animation:none!important; transition:none!important; } .reveal{ opacity:1; transform:none; } }

/* ===== premium motion upgrades v1 (aurora · card glow · badge float · CTA glow) ===== */
.searchwrap__bg{z-index:0}
.searchwrap::after{content:"";position:absolute;inset:-25%;z-index:1;pointer-events:none;
 background:radial-gradient(38% 40% at 24% 30%,rgba(192,145,63,.34),transparent 70%),radial-gradient(36% 38% at 78% 66%,rgba(201,162,74,.26),transparent 70%),radial-gradient(40% 42% at 60% 16%,rgba(201,162,74,.16),transparent 72%);
 filter:blur(4px);animation:fzAurora 22s ease-in-out infinite alternate}
@keyframes fzAurora{0%{transform:translate3d(-3%,-2%,0) scale(1.04)}100%{transform:translate3d(3%,3%,0) scale(1.16)}}
.searchwrap__in{position:relative;z-index:2}
.card{transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .26s,border-color .2s}
.card:hover{transform:translateY(-5px);box-shadow:0 18px 38px rgba(20,30,50,.14),0 0 0 1px rgba(182,138,36,.5),0 10px 26px rgba(182,138,36,.2);border-color:var(--gold)}
.brand 

.btn--wa,.btn--gold{transition:transform .16s,box-shadow .22s,background-position .5s}
.btn--wa:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(201,162,74,.42)}
.btn--gold:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(201,162,74,.5);background-position:100% 0}
@media(prefers-reduced-motion:reduce){.searchwrap::after,.brand .mark{animation:none}.card:hover{transform:none}}

/* ===== how-it-works + stats polish ===== */
#how .types{position:relative}
#how .types::before{content:"";position:absolute;top:44px;left:11%;right:11%;height:2px;z-index:0;background:linear-gradient(90deg,transparent,rgba(201,162,74,.35),rgba(182,138,36,.6),rgba(201,162,74,.35),transparent)}
#how .type{cursor:default;position:relative;z-index:1;opacity:0;transform:translateY(16px) scale(.97);transition:opacity .55s cubic-bezier(.2,.7,.3,1),transform .55s cubic-bezier(.2,.7,.3,1),box-shadow .26s,border-color .2s}
#how .types.reveal{opacity:1;transform:none}
#how .types.in .type{opacity:1;transform:none}
#how .types.in .type:nth-child(1){transition-delay:.04s}#how .types.in .type:nth-child(2){transition-delay:.13s}#how .types.in .type:nth-child(3){transition-delay:.22s}#how .types.in .type:nth-child(4){transition-delay:.31s}
#how .type:hover{transform:translateY(-6px);border-color:var(--gold);box-shadow:0 18px 40px rgba(20,30,50,.12),0 0 0 1px rgba(182,138,36,.4),0 10px 26px rgba(182,138,36,.16)}
#how .type .i{background:linear-gradient(145deg,var(--green-soft),#F4E2B8);animation:howGlow 3s ease-in-out infinite;transition:transform .24s cubic-bezier(.2,.7,.3,1),box-shadow .26s}
#how .type:hover .i{transform:scale(1.12);box-shadow:0 10px 24px rgba(182,138,36,.32)}
@keyframes howGlow{0%,100%{box-shadow:0 4px 14px rgba(201,162,74,.16)}50%{box-shadow:0 7px 20px rgba(201,162,74,.32)}}
.stats .stat{transition:transform .2s}.stats .stat:hover{transform:translateY(-2px)}
.stats .stat .n{transition:text-shadow .3s}.stats .stat:hover .n{text-shadow:0 6px 20px rgba(201,162,74,.3)}
@media(max-width:720px){#how .types::before{display:none}}
@media(prefers-reduced-motion:reduce){#how .type .i{animation:none}#how .type{opacity:1;transform:none}#how .type:hover,#how .type:hover .i{transform:none}}
/* --- site-wide SaaS polish (consistency with zone pages) --- */
.card,.pkgcard,.guide,.emi,.type,.bud,.rev{transition:transform .16s cubic-bezier(.2,.8,.2,1),box-shadow .22s,border-color .16s}
.card:hover,.pkgcard:hover,.guide:hover,.rev:hover{transform:translateY(-4px);box-shadow:0 18px 40px -20px rgba(16,33,58,.45)}
.emi:hover,.type:hover,.bud:hover{transform:translateY(-3px);box-shadow:0 14px 30px -18px rgba(16,33,58,.4)}
#compare tbody tr,#results tbody tr{transition:background .15s}#compare tbody tr:hover,#results tbody tr:hover{background:#FBF6E9}
.btn{transition:transform .15s,box-shadow .22s,filter .15s}.btn--green:hover,.btn--navy:hover,.btn--gold:hover{transform:translateY(-1px)}
/* SaaS product preview */
.prod{display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center;margin-top:6px}
.prodview{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 34px 64px -34px rgba(16,33,58,.55)}
.prodbar{display:flex;align-items:center;gap:6px;padding:11px 14px;background:#EEF2F7;border-bottom:1px solid var(--line)}
.prodbar__d{width:10px;height:10px;border-radius:50%;background:#cfd6df}.prodbar__u{margin-left:12px;font-size:11.5px;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:#fff;border:1px solid var(--line);border-radius:8px;padding:3px 11px}
.prodbody{padding:22px 24px}
.prodq__h{font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--green-d);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.prodq__z{font-size:17px;font-weight:700;color:var(--navy);margin:3px 0 12px}
.prodq__row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--ink-2)}.prodq__row b{color:var(--navy);font-weight:700;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.prodq__tot{display:flex;justify-content:space-between;align-items:baseline;margin-top:12px;padding-top:13px;border-top:2px solid var(--navy)}.prodq__tot span{font-size:13px;font-weight:600;color:var(--ink-2)}.prodq__tot b{font-size:30px;font-weight:700;color:var(--navy);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:-.02em}
.prodq__note{font-size:11.5px;color:var(--muted);text-align:center;margin-top:11px}
.prodfeat{list-style:none;margin:0 0 18px;display:flex;flex-direction:column;gap:13px}.prodfeat li{font-size:14.5px;color:var(--ink-2);line-height:1.5;padding-left:27px;position:relative}.prodfeat li::before{content:"✓";position:absolute;left:0;top:-1px;color:var(--green-d);font-weight:700}.prodfeat li b{color:var(--navy)}
@media(max-width:820px){.prod{grid-template-columns:1fr;gap:22px}}
.prodfade{transition:opacity .22s ease,transform .22s ease}.prodfade.out{opacity:0;transform:translateY(8px)}
.prodpills{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin-top:15px}
.prodpills button{width:44px;height:44px;border:none;background:none;cursor:pointer;padding:0;display:inline-flex;align-items:center;justify-content:center}.prodpills button::before{content:"";width:8px;height:8px;border-radius:50%;background:#cfd6df;transition:width .22s,background .22s}.prodpills button.on::before{width:24px;border-radius:8px;background:var(--green-d)}.prodpills button:hover::before{background:var(--green)}