/* R21 — shared Retainly homepage shell on all Vue public pages */
:root {color-scheme:light}
html,body {max-width:100%;overflow-x:clip}
.site-header{position:relative;z-index:25;background:#fff}
.site-header .header-inner{max-width:1200px;margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:18px}
.site-header .main-nav{display:flex;gap:clamp(9px,1.3vw,22px);align-items:center}
.site-header .main-nav a{font-size:clamp(13px,1.05vw,15px);line-height:1.6;white-space:nowrap}
.site-header .header-actions>a:not(.button){font-size:clamp(13px,1.05vw,15px)}
.site-header .brand-slogan{font-size:clamp(11px,.95vw,13px)}
.site-footer .footer-top>p,.site-footer .footer-policy-links a,.site-footer .footer-bottom,.site-footer .footer-bottom a{font-size:clamp(12px,1vw,14px);line-height:1.9}
.site-footer .footer-policy-links{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px}
.site-footer .footer-bottom nav{display:flex;flex-wrap:wrap;gap:12px 20px}
.site-header .menu-toggle{display:none;border:1px solid #e5d6ee;border-radius:10px;background:#fff;flex-shrink:0;min-width:44px;min-height:44px;padding:10px;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.site-header .menu-toggle span{width:20px;height:2px;background:#6f439f;display:block;border-radius:4px}
.public-mobile-nav,.public-mobile-drawer,.public-menu-overlay{display:none!important}
/* Avoid guest-store's legacy header variant overriding the approved homepage shell */
body[data-vue-page$="/products"] .site-header,body[data-vue-page$="/home"] .site-header{box-shadow:none}
@media(max-width:1050px){
 .site-header .main-nav{gap:12px}.site-header .header-inner{width:calc(100% - 32px)}
 .site-header .header-actions{gap:9px}
 .site-header .main-nav a{font-size:12px}
}
@media(max-width:900px){
 .site-header .menu-toggle{display:flex}
 .site-header .main-nav{display:none;position:absolute;inset-inline:16px;top:calc(100% - 2px);border:1px solid #e9e0f0;background:white;box-shadow:0 16px 34px #37214e2b;border-radius:0 0 18px 18px;padding:14px;flex-direction:column;align-items:stretch;max-height:72dvh;overflow-y:auto;z-index:40}
 .site-header .main-nav.is-open{display:flex}
 .site-header .main-nav a,.site-header .main-nav a:first-child{display:block;padding:11px 12px;font-size:15px}
 .site-header .header-inner{min-height:74px}.site-header .header-actions .button{padding:9px 12px;font-size:12px}
 .site-header .brand{width:clamp(78px,13vw,110px)}
 .site-footer .footer-top{flex-wrap:wrap;gap:14px 20px}
 .site-footer .footer-policy-links{gap:8px 18px}
 .site-footer .footer-bottom{flex-direction:column;align-items:center;text-align:center;gap:8px}
}
@media(max-width:600px){
 .site-header .header-inner{width:calc(100% - 24px);min-height:70px;gap:8px}
 .site-header .header-actions{gap:8px}
 .site-header .header-actions .login-link{display:none}
 .site-header .header-actions .button{min-height:40px;font-size:12px;padding:8px 10px}
 .site-header .brand-slogan{font-size:10px}
 .site-footer .footer-top{padding-block:24px}
 .site-footer .footer-top .button{width:100%;justify-content:center}
 .site-footer .footer-bottom nav{gap:8px 16px;justify-content:center}
 .page-width,.content-width{max-width:calc(100% - 24px)}
 .shop-grid,.explore-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,245px),1fr));gap:16px}
 img,video,iframe,svg{max-width:100%}
}
@media(max-width:360px){.site-header .header-actions .button{display:none}}