/* Koko Blue: mobile app layout */
.mobile-brand,.mobile-instagram,.mobile-bottom-nav{display:none}
@media(max-width:700px){
html{scroll-padding-top:135px}body{padding-bottom:calc(78px + env(safe-area-inset-bottom));overflow-x:hidden}
.store-header{height:auto;min-height:118px;display:grid;grid-template-columns:48px minmax(0,1fr) 40px;gap:8px 10px;padding:10px 16px 12px;position:sticky;top:0;z-index:12;background:#fffdfbf5;backdrop-filter:blur(12px);border-bottom:1px solid #f0e7ed}
.store-header>a:first-child{grid-column:1;grid-row:1}.store-header .logo{width:48px;height:48px;display:block}
.mobile-brand{display:block;grid-column:2;grid-row:1;font:600 24px 'Playfair Display',Georgia,serif;color:#995bcb;white-space:nowrap}.mobile-brand em{font:400 29px Parisienne,cursive;color:#171b42}
.mobile-instagram{display:flex;grid-column:3;grid-row:1;align-items:center;justify-content:center;color:#9158ba;min-height:40px}.mobile-instagram svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8}
.store-header .search{grid-column:1/-1;grid-row:2;width:100%;height:42px;padding:10px 15px;min-width:0;background:#fbf6fa;font-size:14px}.store-header .bag{display:none}
.hero{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);min-height:0;height:158px;margin:14px 16px 0;border-radius:17px;background:linear-gradient(105deg,#fde0ec,#fff0e6);position:relative;isolation:isolate;overflow:hidden}
.hero-copy{min-width:0;padding:18px 0 14px 16px;position:relative;z-index:1}.hero .eyebrow,.hero .benefits,.hero #heroText{display:none}
.hero h1{font-size:clamp(21px,5.7vw,28px);line-height:1.13;white-space:normal;margin:0 0 13px;overflow-wrap:normal;letter-spacing:-.6px}.hero h1 em{font-size:1.08em;white-space:normal;line-height:1.12;margin-top:4px}
.hero .primary{padding:9px 15px;font-size:11px;min-height:34px;box-shadow:none}
.hero>img{width:100%;height:158px;max-height:158px;min-width:0;object-fit:contain;object-position:center;background:transparent;align-self:center}
.collection{padding:14px 16px 10px}.pills{gap:8px;padding:0 0 16px;justify-content:flex-start;scrollbar-width:none}.pills::-webkit-scrollbar{display:none}.pill{padding:9px 18px;font-size:12px;border:0;background:#f5edf8;min-height:36px}.pill.active{background:linear-gradient(#b47ce3,#995dcf)}
.section-title{align-items:center;margin-bottom:10px}.section-title h2{font-size:24px;line-height:1.15;margin:0}.section-title>span{display:none}.section-title h2 small{font-size:17px}
.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}.product-card{border:0;box-shadow:none;background:transparent;border-radius:12px}.product-card img{height:clamp(142px,39vw,200px);object-position:50% 18%;border-radius:12px;display:block}.card-body{padding:8px 0 0}.card-body h3{font-size:12px;line-height:1.35;margin-bottom:3px}.card-body .price{font-size:13px}.card-body .swatches{margin:7px 0;gap:7px;min-height:19px}.card-body .swatch{width:18px;height:18px}.add-row .primary{font-size:11px;min-height:34px;padding:7px 10px;border-radius:20px;width:100%;background:#eedbfa;color:#723ba0;box-shadow:none;font-weight:600}.demo-note{font-size:10px;margin:20px 0 10px}.steps{font-size:10px;padding:18px 12px;border-radius:18px;margin:0 16px;gap:10px}
.mobile-bottom-nav{position:fixed;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(4,1fr);height:calc(70px + env(safe-area-inset-bottom));padding:7px 8px calc(7px + env(safe-area-inset-bottom));background:#fffdfbf7;backdrop-filter:blur(12px);border-top:1px solid #ece2f0;z-index:25;box-shadow:0 -3px 16px #3a234508}
.mobile-bottom-nav button,.mobile-bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;position:relative;font-size:10px;min-height:50px;color:#171b42;border-radius:12px;padding:4px}.mobile-bottom-nav svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.mobile-bottom-nav .active{color:#8d45c2;background:#faf4fe}.mobile-bottom-nav .nav-wa{color:#16af55}.mobile-count{position:absolute;top:1px;left:calc(50% + 8px);background:#f49abc;color:white;font:600 10px 'DM Sans',sans-serif;border-radius:20px;padding:2px 5px;min-width:16px}
#quickWhatsApp,.quick-whatsapp{display:none!important}
#drawer.drawer{width:100%;padding:20px 18px calc(98px + env(safe-area-inset-bottom));bottom:0;background:#fffbfd;box-shadow:none;z-index:24;overscroll-behavior:contain}
#drawer h2{font-size:27px;margin-bottom:8px}#drawer>p{font-size:13px;line-height:1.5}#drawer .cart-row{padding:12px;background:#fff;border:1px solid #eee6ed;border-radius:14px;margin:10px 0;gap:12px}#drawer .cart-row img{width:80px;height:95px;border-radius:10px}#drawer .cart-row h3{font-size:13px}#drawer .qty{gap:12px}#drawer .qty button{min-width:32px;min-height:32px}#drawer .form-stack{background:#fff;border:1px solid #eee6ed;border-radius:15px;padding:15px;gap:12px;margin:18px 0}#drawer input,#drawer textarea{font-size:16px;border-radius:12px}#drawer .subtotal{background:#fff;padding:15px;border-radius:12px;border:1px solid #eee6ed;font-size:18px;margin-bottom:10px}#drawer .whatsapp{border-radius:30px;background:#18bf59;min-height:52px;font-size:14px}#drawer #order{padding-bottom:8px}
#detail{padding:18px;border-radius:18px;max-height:calc(100dvh - 110px);width:calc(100% - 24px)}.detail-grid{gap:16px}.detail-grid img{height:260px;object-fit:contain;background:#fcf1f7}.detail-grid h2{font-size:25px}.detail-grid .primary{width:100%;min-height:46px}.sizes button{min-width:44px;min-height:44px}footer{padding:28px 20px 20px}#toast{bottom:calc(87px + env(safe-area-inset-bottom));width:max-content;max-width:90%;font-size:13px;z-index:110}
}
@media(min-width:701px){.mobile-bottom-nav{display:none!important}}
@media(max-width:350px){.hero{height:150px}.hero>img{height:150px;max-height:150px}.hero h1{font-size:20px}.mobile-brand{font-size:21px}.mobile-brand em{font-size:25px}.section-title h2{font-size:21px}}
