/* ===================== v47: mobile fixes (hero overlap, search box) =====================
   Loads last. To undo: delete css/v47.css, its <link> in index.html, and the placeholder line in js/app.js (openSearch). */

/* ---------- Search box: the moving product strip was forcing the whole dialog wider than the screen ---------- */
html body .sbox{grid-template-columns:minmax(0,1fr)}
html body .sbox .sp,html body .sbox .smq,html body .sbox #sidle{min-width:0;max-width:100%}
html body .sbox .smq{overflow:hidden}
html body #md{padding:max(10px,env(safe-area-inset-top)) 10px max(10px,env(safe-area-inset-bottom))}
html body .mbox{max-height:calc(100dvh - 20px)}

/* quieter, smaller, shorter search field (all screens) */
html body .sbig .sp .sfield{max-width:680px;width:100%;margin:0 auto;padding:0 18px;gap:10px;border-width:1.5px;min-height:50px}
html body .sbig .sp .sfield svg{width:20px;height:20px}
html body .sbig .sp .sfield input{font:400 16px/1.2 Jost,sans-serif;letter-spacing:.01em;padding:12px 0;text-overflow:ellipsis}
html body .sbig .sp .sfield input::placeholder{font-size:15px;font-weight:300;color:#a79d86}
html body .sbig .sbe{text-align:center}
html body .sbig .ssg{max-width:680px;width:100%;margin-left:auto;margin-right:auto}
html body .schips{justify-content:center}

@media(max-width:600px){
 html body .sbox.sbig{width:100%;min-height:0;max-height:calc(100dvh - 20px);border-radius:16px}
 html body .sbig .sp{padding:52px 16px 24px;gap:14px}
 html body .sbig .sp .sfield{min-height:46px;padding:0 14px}
 html body .sbig .sp .sfield input{padding:11px 0}
 html body .sbig .sbe{font-size:11px;letter-spacing:.2em}
 /* category chips: one tidy swipe row instead of a wrapped pile */
 html body .schips{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:2px 16px}
 html body .schips::-webkit-scrollbar{display:none}
 html body .schip{flex:none;padding:8px 14px;font-size:13.5px}
 html body .smq{margin-top:4px}
 html body .mx{top:6px;right:8px}
 html body .sgi{font-size:15px;padding:11px 14px;gap:10px}
 html body .sgi small{font-size:12.5px}
 html body .sgt{font-size:10px;min-width:64px;padding:4px 8px}
}

/* ---------- Hero on phones: the text sits above the 4 gallery links (strip height is measured by js/v47.js into --sh) ---------- */
@media(max-width:900px){
 html body .cine,html[data-th=home] body.hpage .cine{height:auto!important;min-height:max(min(calc(100svh - 150px),760px),calc(var(--sh,130px) + var(--hdr,111px) + 410px))!important}
 html body .cine .hsl .cc{margin:0!important;padding:calc(var(--hdr,111px) + 18px) 6vw calc(var(--sh,130px) + 24px)!important}
 html body .cine .hsl .cc .sub{margin:12px auto 22px}
}
@media(max-width:400px){
 html body .cstrip a{padding:13px 12px;column-gap:8px}
 html body .cstrip b{font-size:15px;line-height:1.15}
 html body .cstrip em{font-size:15px}
 html body .cstrip span{font-size:10px;letter-spacing:.14em}
}