/* ── Portfolio PWA shell (mobile <=768px) — pixel-matched to the booking app's MobileAppBar + BottomTabNav. Desktop (>=769px) untouched. ── */ @media (min-width:769px){ #pwaTop,#pwaBottom,#pwaDrawer,#pwaScrim{display:none !important;} } @media (max-width:768px){ /* the app-shell is the ONLY mobile header — hide the website chrome on every page (home has with no .rd class, so target the classes directly) */ .rd-util, .rd-nav, body > header, body > footer { display:none !important; } /* normal-flow static inner pages: clear the fixed app bar */ body.rd { padding-top:calc(104px + env(safe-area-inset-top,0)) !important; } body { padding-bottom:calc(104px + env(safe-area-inset-bottom,0)) !important; } /* home's sticky full-height doors-hero uses top:72px (desktop nav) — re-anchor it below the mobile app-shell so it is not overlapped */ [data-hero]{ margin-top:calc(103px + env(safe-area-inset-top,0)) !important; top:calc(103px + env(safe-area-inset-top,0)) !important; height:calc(100svh - 103px - env(safe-area-inset-top,0)) !important; } /* safety net against stray horizontal overflow on small screens */ html, body { max-width:100% !important; overflow-x:clip !important; } iframe[title="Temple Assistant"]{ bottom:64px !important; } } /* top app bar (matches booking: rgba parchment + blur18/sat160 + same border/shadow) */ #pwaTop{position:fixed;top:0;left:0;right:0;z-index:1100;padding-top:env(safe-area-inset-top,0); background:rgba(255,251,242,.94);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%); border-bottom:1px solid rgba(176,130,44,.22);box-shadow:0 4px 18px rgba(42,10,26,.06);} .pwa-appbar{height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 8px;gap:6px;} .pwa-left{display:flex;align-items:center;gap:4px;min-width:0;} .pwa-actions{display:flex;align-items:center;gap:2px;flex-shrink:0;} .pwa-ic{width:38px;height:38px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;color:#7B2554;text-decoration:none;position:relative;padding:0;} .pwa-ic svg{width:21px;height:21px;} .pwa-ic.menu svg{width:22px;height:22px;} .pwa-badge{position:absolute;top:7px;right:8px;width:7px;height:7px;border-radius:50%;background:#8A2D5B;border:1.5px solid #FFFBF2;} .pwa-brand{display:flex;align-items:center;gap:9px;text-decoration:none;min-width:0;} .pwa-brand img{width:34px;height:34px;border-radius:50%;object-fit:cover;flex-shrink:0;border:1.5px solid rgba(176,130,44,.45);box-shadow:0 1px 6px rgba(58,10,36,.22);} .pwa-brand b{font-family:'Cormorant Garamond',Georgia,serif;font-size:19px;font-weight:600;color:#4A0F2E;line-height:1;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} /* chip strip */ .pwa-chips{height:48px;display:flex;align-items:center;gap:8px;padding:0 12px 8px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;} .pwa-chips::-webkit-scrollbar{display:none;} .pwa-chip{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;white-space:nowrap;text-decoration:none; background:#FFFBF2;border:1px solid rgba(176,130,44,.30);color:#2A0A1A;font-family:'DM Sans',system-ui,sans-serif;font-size:12.5px;font-weight:600;} .pwa-chip svg{width:16px;height:16px;} .pwa-chip.primary{background:linear-gradient(135deg,#7B2554,#4A0F2E);border-color:transparent;color:#FBF0DF;box-shadow:0 4px 14px rgba(58,10,36,.22);} .pwa-chip.primary svg{filter:brightness(0) invert(1);opacity:.95;} .pwa-ic svg,.pwa-chip svg,.pwa-tab svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;} /* bottom tab nav */ #pwaBottom{position:fixed;left:0;right:0;bottom:0;z-index:1100;display:flex;background:rgba(255,251,242,.94); -webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%); border-top:1px solid rgba(176,130,44,.28);box-shadow:0 -6px 24px rgba(42,10,26,.10);padding-bottom:env(safe-area-inset-bottom,0);} .pwa-tab{flex:1;height:60px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;position:relative;color:#8A6070;} .pwa-tab .acc{position:absolute;top:0;left:50%;transform:translateX(-50%);width:0;height:3px;border-radius:0 0 3px 3px;background:linear-gradient(135deg,#7B2554,#4A0F2E);transition:width .24s;} .pwa-tab svg{width:23px;height:23px;opacity:.55;} .pwa-tab span{font-family:'DM Sans',system-ui,sans-serif;font-size:10.5px;font-weight:500;} .pwa-tab.active{color:#8A2D5B;} .pwa-tab.active .acc{width:32px;} .pwa-tab.active svg{opacity:1;} .pwa-tab.active span{font-weight:700;} /* drawer */ #pwaScrim{position:fixed;inset:0;background:rgba(40,10,28,.5);z-index:1150;opacity:0;pointer-events:none;transition:opacity .25s;} #pwaScrim.open{opacity:1;pointer-events:auto;} #pwaDrawer{position:fixed;top:0;left:0;bottom:0;width:80%;max-width:320px;background:#FBF0DF;z-index:1160;transform:translateX(-100%);transition:transform .3s cubic-bezier(.22,1,.36,1);box-shadow:12px 0 40px rgba(40,10,28,.3);padding:16px 14px;overflow-y:auto;} #pwaDrawer.open{transform:translateX(0);} #pwaDrawer .dh{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;} #pwaDrawer a{display:block;padding:13px 8px;font-family:'DM Sans',system-ui,sans-serif;font-size:15px;color:#3A0A24;text-decoration:none;border-bottom:1px solid rgba(176,130,44,.15);} #pwaDrawer .grp{font-family:'DM Sans',system-ui,sans-serif;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#B0822C;margin:16px 8px 4px;} /* ── full authority lockup in the app bar (matches desktop brand) ── */ .pwa-brand .bt{display:flex;flex-direction:column;min-width:0;line-height:1.3} .pwa-brand .bt i{font-style:normal;font-family:'Noto Serif Kannada',serif;font-size:8.5px;letter-spacing:.02em;color:#EDD8B4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .pwa-brand .bt b{font-size:8.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#FFF9EC;white-space:normal;line-height:1.25} /* ── mobile polish: home doors/hero + sanctum band + footer ── */ @media (max-width:768px){ /* footer is desktop chrome — the app-shell bottom tabs replace it */ .rd-footer{display:none !important;} /* doors scroll journey: 260vh is far too long on a phone — quicker reveal */ [data-doortrack]{height:230vh !important;} /* align BOTH door logos to the same line; consistent whitespace around text */ .door-inner{place-items:start center !important;padding:9vh 18px 0 !important;} .door-inner img{width:74px !important;height:74px !important;margin-bottom:12px !important;} /* JS parallax nudges one door's content block — pin both so the logos align */ .door-inner > div{transform:none !important;} /* scroll/tap hint removed on mobile (overlapped the chat FAB) */ [data-door-hint]{display:none !important;} /* revealed hero: breathing room, no overlaps */ [data-hero]{padding-top:18px !important;} [data-sanctum]{padding-bottom:34px !important;gap:9px !important;} [data-deity]{height:38vh !important;max-height:340px;} /* smaller hero type so the whole reveal fits with whitespace */ [data-sanctum] > h1:not([aria-hidden]){font-size:clamp(22px,6.5vw,30px) !important;} [data-sanctum] > h1[aria-hidden]{font-size:clamp(16px,4.6vw,20px) !important;} [data-sanctum] > div[style*="Noto Serif Kannada"]{font-size:12px !important;} [data-sanctum] a[href="/book"]{padding:11px 26px !important;font-size:12px !important;} [data-deity-rays]{width:min(78vw,340px) !important;} [data-ascent-hint]{display:none !important;} /* sanctum band: altitude chip moves to the top-right so it never overlaps the title */ .sanctum-alt{bottom:auto !important;top:18px !important;} .sanctum-alt div{font-size:28px !important;} .sanctum-label{bottom:22px !important;right:16px;} }