/* v3.11.27 — Safar V3 3D + App Experience recommendations 21–40 only.
   Everything is opt-in through .safar-fx-* classes and scoped to safar_make_v3. */

/* 21. Mobile full-screen package viewer */
.public-site[data-theme="safar_make_v3"] .safar-app-preview-host{position:relative!important}
.public-site[data-theme="safar_make_v3"] .safar-app-package-preview-button{display:none}
@media(max-width:767px){
 .public-site[data-theme="safar_make_v3"].safar-fx-package_fullscreen_viewer .safar-app-package-preview-button{position:absolute;display:grid;place-items:center;right:10px;top:10px;z-index:8;width:42px;height:42px;border:1px solid rgba(255,255,255,.22);border-radius:14px;background:rgba(5,13,26,.78);color:#f0c866;box-shadow:0 10px 28px rgba(0,0,0,.26);backdrop-filter:blur(14px);font-size:19px;font-weight:900}
}
.safar-app-fullscreen-backdrop{position:fixed;inset:0;z-index:10020;background:rgba(2,8,16,.68);opacity:0;pointer-events:none;transition:opacity .22s ease;backdrop-filter:blur(4px)}
.safar-app-fullscreen-backdrop.is-open{opacity:1;pointer-events:auto}
.safar-app-fullscreen{position:fixed;z-index:10021;left:50%;top:50%;width:min(720px,calc(100vw - 28px));max-height:min(86vh,780px);overflow:auto;translate:-50% -48%;opacity:0;pointer-events:none;border:1px solid rgba(255,255,255,.1);border-radius:26px;background:#071a2e;color:#eef2f7;box-shadow:0 32px 90px rgba(0,0,0,.45);transition:opacity .24s ease,translate .34s cubic-bezier(.2,.8,.2,1)}
.safar-app-fullscreen.is-open{translate:-50% -50%;opacity:1;pointer-events:auto}
.safar-app-fullscreen-bar{position:sticky;top:0;z-index:2;display:grid;grid-template-columns:28px 1fr 42px;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.08);background:rgba(7,26,46,.92);backdrop-filter:blur(18px)}
.safar-app-fullscreen-grip{width:24px;height:4px;border-radius:999px;background:rgba(255,255,255,.18)}
.safar-app-fullscreen-bar strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.safar-app-fullscreen-close{width:40px;height:40px;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:rgba(255,255,255,.05);color:#fff;font-size:20px}
.safar-app-fullscreen-body{padding:14px}.safar-app-package-preview-content{display:grid;gap:16px}.safar-app-package-preview-content>img{width:100%;max-height:44vh;object-fit:cover;border-radius:18px;box-shadow:0 18px 48px rgba(0,0,0,.3)}
.safar-app-package-preview-copy h3{font-size:24px;line-height:1.15;color:#fff}.safar-app-package-preview-copy p{margin-top:8px;color:#b8c5d2;font-size:13px;line-height:1.7}.safar-app-package-preview-cta{display:flex;align-items:center;justify-content:center;min-height:48px;margin-top:14px;border-radius:15px;background:linear-gradient(135deg,#f0c866,#d4a843);color:#07111f!important;font-size:13px;font-weight:900}
@media(max-width:767px){.safar-app-fullscreen{left:0;right:0;top:auto;bottom:0;width:100%;max-height:92vh;translate:0 105%;border-radius:28px 28px 0 0}.safar-app-fullscreen.is-open{translate:0 0}.safar-app-fullscreen-bar{grid-template-columns:36px 1fr 42px;padding-top:12px}.safar-app-fullscreen-grip{width:34px}}

/* 22. Animated counters */
.public-site[data-theme="safar_make_v3"].safar-fx-animated_counters [data-safar-counter-done="1"]{font-variant-numeric:tabular-nums;will-change:contents}

/* 23. Scroll-linked section depth */
.public-site[data-theme="safar_make_v3"].safar-fx-section_scroll_depth .safar-app-section-depth{position:relative;transform:none;transition:filter .22s ease;will-change:filter}
@media(min-width:1024px) and (prefers-reduced-motion:no-preference){.public-site[data-theme="safar_make_v3"].safar-fx-section_scroll_depth .safar-app-section-depth{filter:drop-shadow(0 14px 30px rgba(0,0,0,.035))}}

/* 24. 3D testimonial stack */
.public-site[data-theme="safar_make_v3"].safar-fx-testimonial_stack .safar-app-testimonial-stack{perspective:1200px}
.public-site[data-theme="safar_make_v3"].safar-fx-testimonial_stack .safar-app-testimonial-card{position:relative;transform-style:preserve-3d;box-shadow:0 12px 30px rgba(0,0,0,.12);transition:translate .32s cubic-bezier(.2,.8,.2,1),rotate .32s ease,box-shadow .32s ease}
.public-site[data-theme="safar_make_v3"].safar-fx-testimonial_stack .safar-app-testimonial-card:nth-child(3n+1){rotate:.25deg}.public-site[data-theme="safar_make_v3"].safar-fx-testimonial_stack .safar-app-testimonial-card:nth-child(3n+2){translate:0 6px;rotate:-.25deg}.public-site[data-theme="safar_make_v3"].safar-fx-testimonial_stack .safar-app-testimonial-card:nth-child(3n){translate:0 2px}
.public-site[data-theme="safar_make_v3"].safar-fx-testimonial_stack .safar-app-testimonial-card:hover{translate:0 -7px 18px;rotate:0deg;box-shadow:0 24px 52px rgba(0,0,0,.2)}

/* 25. Gallery depth viewer */
.public-site[data-theme="safar_make_v3"].safar-fx-gallery_depth_viewer img.safar-app-gallery-image{cursor:zoom-in;transition:scale .28s ease,filter .28s ease}.public-site[data-theme="safar_make_v3"].safar-fx-gallery_depth_viewer img.safar-app-gallery-image:hover{scale:1.015;filter:saturate(1.05) contrast(1.02)}
.safar-app-gallery-viewer{position:relative;display:grid;place-items:center;min-height:260px}.safar-app-gallery-viewer>img{display:block;max-width:100%;max-height:72vh;border-radius:18px;object-fit:contain;box-shadow:0 28px 72px rgba(0,0,0,.38)}
.safar-app-gallery-controls{position:absolute;inset:50% 12px auto;display:flex;justify-content:space-between;translate:0 -50%;pointer-events:none}.safar-app-gallery-controls button{pointer-events:auto;width:46px;height:46px;border:1px solid rgba(255,255,255,.16);border-radius:15px;background:rgba(4,12,24,.7);color:#f0c866;font-size:28px;backdrop-filter:blur(12px)}

/* 26. Map/location cards */
.public-site[data-theme="safar_make_v3"].safar-fx-map_location_cards .safar-app-map-host{position:relative!important;overflow:hidden;border-radius:22px}
.public-site[data-theme="safar_make_v3"] .safar-app-map-card{position:absolute;left:14px;top:14px;z-index:3;display:grid;gap:4px;width:min(300px,calc(100% - 28px));padding:13px 14px;border:1px solid rgba(255,255,255,.14);border-radius:17px;background:rgba(5,20,35,.84);color:#eef2f7;box-shadow:0 18px 42px rgba(0,0,0,.28);backdrop-filter:blur(16px)}
.public-site[data-theme="safar_make_v3"] .safar-app-map-card strong{font-size:12px}.public-site[data-theme="safar_make_v3"] .safar-app-map-card span{font-size:10px;line-height:1.5;color:#b6c4d2}.public-site[data-theme="safar_make_v3"] .safar-app-map-card a{margin-top:4px;color:#f0c866;font-size:10px;font-weight:800}

/* 27. App-style skeleton loader */
.safar-app-skeleton{position:fixed;z-index:10010;left:50%;top:calc(50% - 20px);display:grid;gap:9px;width:min(360px,70vw);padding:18px;translate:-50% -50%;opacity:0;pointer-events:none;border:1px solid rgba(255,255,255,.1);border-radius:20px;background:rgba(7,26,46,.9);box-shadow:0 24px 70px rgba(0,0,0,.32);backdrop-filter:blur(18px);transition:opacity .16s ease}.safar-app-skeleton.is-visible{opacity:1}.safar-app-skeleton i{display:block;height:12px;border-radius:999px;background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(240,200,102,.2),rgba(255,255,255,.06));background-size:220% 100%;animation:safarSkeleton 1.05s linear infinite}.safar-app-skeleton i:nth-child(2){width:78%}.safar-app-skeleton i:nth-child(3){width:56%}@keyframes safarSkeleton{to{background-position:-220% 0}}

/* 28. Page transition system */
.public-site[data-theme="safar_make_v3"].safar-fx-page_transitions main{transition:opacity .22s ease,translate .32s cubic-bezier(.2,.8,.2,1),filter .22s ease}
html.safar-app-page-leaving .public-site[data-theme="safar_make_v3"].safar-fx-page_transitions main{opacity:.35;translate:0 7px;filter:blur(1.5px)}
html.safar-app-page-entering .public-site[data-theme="safar_make_v3"].safar-fx-page_transitions main{animation:safarPageIn .38s cubic-bezier(.2,.8,.2,1) both}@keyframes safarPageIn{from{opacity:.45;translate:0 10px}to{opacity:1;translate:0 0}}

/* 29. Shared-element-style arrival */
.public-site[data-theme="safar_make_v3"].safar-fx-shared_element_transitions img.safar-app-shared-arrival{transform-origin:center;animation:safarSharedArrival .62s cubic-bezier(.2,.8,.2,1) both}@keyframes safarSharedArrival{0%{opacity:.4;scale:1.05;filter:blur(3px)}100%{opacity:1;scale:1;filter:none}}

/* 30. Animated search expansion */
.public-site[data-theme="safar_make_v3"] .safar-app-search-toggle{display:none}
@media(max-width:767px){
 .public-site[data-theme="safar_make_v3"].safar-fx-search_expansion .safar-app-search-toggle{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:46px;margin:10px 0 8px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(255,255,255,.055);color:#eef2f7;box-shadow:inset 0 1px 0 rgba(255,255,255,.04);backdrop-filter:blur(12px)}
 .public-site[data-theme="safar_make_v3"].safar-fx-search_expansion .safar-app-search-toggle span{color:#f0c866;font-size:20px}.public-site[data-theme="safar_make_v3"].safar-fx-search_expansion .safar-app-search-toggle strong{font-size:12px}
 .public-site[data-theme="safar_make_v3"].safar-fx-search_expansion .safar-app-search-expandable{max-height:0!important;overflow:hidden!important;opacity:0;translate:0 -6px;pointer-events:none;transition:max-height .36s cubic-bezier(.2,.8,.2,1),opacity .22s ease,translate .34s ease}
 .public-site[data-theme="safar_make_v3"].safar-fx-search_expansion .safar-app-search-expandable.is-open{max-height:520px!important;opacity:1;translate:0 0;pointer-events:auto}
}

/* 31. Command-style quick search */
.public-site[data-theme="safar_make_v3"] .safar-app-command-button{display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(255,255,255,.12);border-radius:13px;background:rgba(255,255,255,.045);color:#f0c866;font-size:21px}
.safar-app-command{position:fixed;inset:0;z-index:10030;display:grid;place-items:start center;padding:9vh 16px 16px;background:rgba(2,8,16,.62);opacity:0;pointer-events:none;backdrop-filter:blur(8px);transition:opacity .18s ease}.safar-app-command.is-open{opacity:1;pointer-events:auto}
.safar-app-command-panel{width:min(650px,100%);overflow:hidden;border:1px solid rgba(255,255,255,.11);border-radius:23px;background:#071a2e;color:#eef2f7;box-shadow:0 34px 90px rgba(0,0,0,.46)}
.safar-app-command-head{display:grid;grid-template-columns:30px 1fr 42px;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.08)}.safar-app-command-head>span{color:#f0c866;font-size:22px}.safar-app-command-head input{width:100%;height:44px;border:0!important;outline:0!important;background:transparent!important;color:#fff!important;font-size:14px}.safar-app-command-head button{width:40px;height:40px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.05);color:#fff;font-size:18px}
.safar-app-command-results{display:grid;gap:4px;max-height:min(56vh,480px);overflow:auto;padding:8px}.safar-app-command-results a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:10px 12px;border-radius:13px;color:#eef2f7}.safar-app-command-results a:hover{background:rgba(255,255,255,.055)}.safar-app-command-results strong{font-size:12px}.safar-app-command-results span{color:#f0c866;font-size:10px;font-weight:800}.safar-app-command-panel>small{display:block;padding:8px 13px 12px;color:#708399;font-size:9px}.safar-app-command-empty{padding:28px 14px;text-align:center;color:#8ca0b4;font-size:12px}
@media(max-width:767px){.safar-app-command{padding:0}.safar-app-command-panel{width:100%;height:100%;border-radius:0}.safar-app-command-results{max-height:calc(100vh - 118px)}}

/* 32. Floating notification/status chips */
.safar-app-status-stack{position:fixed;z-index:10015;right:16px;top:88px;display:grid;gap:8px;width:min(360px,calc(100vw - 32px));pointer-events:none}.safar-app-status-chip{padding:11px 13px;border:1px solid rgba(255,255,255,.12);border-radius:15px;background:rgba(7,26,46,.92);color:#eaf0f6;box-shadow:0 16px 38px rgba(0,0,0,.25);backdrop-filter:blur(14px);font-size:11px;line-height:1.5;animation:safarChipIn .3s cubic-bezier(.2,.8,.2,1) both}.safar-app-status-chip.is-leaving{opacity:0;translate:8px 0;transition:.2s ease}@keyframes safarChipIn{from{opacity:0;translate:12px 0}to{opacity:1;translate:0}}

/* 33. App-style empty states */
.public-site[data-theme="safar_make_v3"].safar-fx-empty_states .safar-app-empty-state{display:grid!important;place-items:center!important;gap:8px!important;min-height:150px!important;padding:24px!important;border:1px dashed rgba(212,168,67,.28)!important;border-radius:20px!important;background:linear-gradient(145deg,rgba(212,168,67,.045),rgba(255,255,255,.018))!important;text-align:center!important;color:#8fa1b4!important}
.public-site[data-theme="safar_make_v3"].safar-fx-empty_states .safar-app-empty-state:before{content:attr(data-empty-icon);display:grid;place-items:center;width:48px;height:48px;border:1px solid rgba(212,168,67,.2);border-radius:16px;background:rgba(212,168,67,.07);color:#f0c866;font-size:23px}

/* 34. Safe-area support */
.public-site[data-theme="safar_make_v3"].safar-fx-safe_area_support:not([data-premium-capsule-header="1"]){padding-left:env(safe-area-inset-left,0);padding-right:env(safe-area-inset-right,0)}
.public-site[data-theme="safar_make_v3"].safar-fx-safe_area_support:not([data-premium-capsule-header="1"]) .safar-v3-site-header{padding-top:env(safe-area-inset-top,0)}
.public-site[data-theme="safar_make_v3"].safar-fx-safe_area_support .safar-app-bottom-nav{padding-left:max(8px,env(safe-area-inset-left,0px));padding-right:max(8px,env(safe-area-inset-right,0px));padding-bottom:max(7px,env(safe-area-inset-bottom,0px))}

/* 35. Comfortable 44px+ mobile touch targets */
@media(max-width:767px){
 .public-site[data-theme="safar_make_v3"].safar-fx-touch_targets :is(button,.safar-v3-button,.safar-v3-button-gold,.safar-v3-button-outline,.safar-v3-button-whatsapp,.safar-v3-mobile-menu-item,.safar-v3-mobile-subitem,[data-brand-button]){min-height:44px;min-width:44px}
 .public-site[data-theme="safar_make_v3"].safar-fx-touch_targets :is(input,select,textarea){min-height:44px}
}

/* 36. Standalone PWA mode */
@media(display-mode:standalone){
 .public-site[data-theme="safar_make_v3"].safar-fx-pwa_standalone{min-height:100dvh}
 .public-site[data-theme="safar_make_v3"].safar-fx-pwa_standalone .safar-v3-site-header{overscroll-behavior:none}
}

/* 38. Mobile splash/loading experience */
.safar-app-splash{position:fixed;inset:0;z-index:10060;display:grid;align-content:center;justify-items:center;gap:12px;background:linear-gradient(155deg,#f8f5ed,#eef4f0);opacity:0;pointer-events:none;transition:opacity .22s ease}.safar-app-splash.is-visible{opacity:1}.safar-app-splash.is-leaving{opacity:0}
.safar-app-splash-mark{display:grid;place-items:center;width:66px;height:66px;border:1px solid rgba(15,122,82,.16);border-radius:22px;background:linear-gradient(145deg,#0f7a52,#0a5a3e);color:#f3d47f;box-shadow:0 18px 42px rgba(15,122,82,.18);font-size:19px;font-weight:900;letter-spacing:.08em}.safar-app-splash strong{color:#0d2333;font-size:17px}.safar-app-splash i{display:block;width:86px;height:3px;overflow:hidden;border-radius:99px;background:rgba(13,35,51,.08)}.safar-app-splash i:after{content:'';display:block;width:42%;height:100%;border-radius:inherit;background:#d4a843;animation:safarSplashLine .55s ease-in-out infinite alternate}@keyframes safarSplashLine{to{translate:125% 0}}

/* 39. Sticky contextual header modes */
.public-site[data-theme="safar_make_v3"].safar-fx-contextual_header:not([data-premium-capsule-header="1"]) .safar-app-header-context{display:inline-flex;align-items:center;min-height:30px;padding:0 10px;border:1px solid rgba(212,168,67,.2);border-radius:999px;background:rgba(212,168,67,.07);color:#dcb95d;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.07em;white-space:nowrap}
.public-site[data-theme="safar_make_v3"][data-premium-capsule-header="1"] .safar-app-header-context{display:none!important}
@media(max-width:1023px){.public-site[data-theme="safar_make_v3"] .safar-app-header-context{display:none!important}}

/* 40. Adaptive capsule size while scrolling deeply */
.public-site[data-theme="safar_make_v3"].safar-fx-adaptive_capsule:not([data-premium-capsule-header="1"])[data-safar-capsule-depth="mid"]>header.site-header-capsule{--safar-adaptive-scale:.985}
.public-site[data-theme="safar_make_v3"].safar-fx-adaptive_capsule:not([data-premium-capsule-header="1"])[data-safar-capsule-depth="compact"]>header.site-header-capsule{--safar-adaptive-scale:.955}
.public-site[data-theme="safar_make_v3"].safar-fx-adaptive_capsule:not([data-premium-capsule-header="1"])[data-safar-capsule-depth="mid"]>header.site-header-capsule,
.public-site[data-theme="safar_make_v3"].safar-fx-adaptive_capsule:not([data-premium-capsule-header="1"])[data-safar-capsule-depth="compact"]>header.site-header-capsule{transform:translateZ(0) scale(var(--safar-adaptive-scale,1));transform-origin:top center;transition:width .3s ease,max-width .3s ease,padding .3s ease,border-radius .3s ease,box-shadow .3s ease,transform .3s cubic-bezier(.2,.8,.2,1)}
@media(max-width:767px){.public-site[data-theme="safar_make_v3"].safar-fx-adaptive_capsule:not([data-premium-capsule-header="1"])[data-safar-capsule-depth="compact"]>header.site-header-capsule{--safar-adaptive-scale:.97}}

@media(prefers-reduced-motion:reduce){
 .safar-app-skeleton i,.safar-app-splash i:after{animation:none!important}.safar-app-fullscreen,.safar-app-command,.public-site[data-theme="safar_make_v3"] .safar-app-testimonial-card,.public-site[data-theme="safar_make_v3"] .safar-app-section-depth{transition:none!important;animation:none!important;transform:none!important;translate:0!important;rotate:0deg!important}.public-site[data-theme="safar_make_v3"] img.safar-app-shared-arrival{animation:none!important}
}