/* ARISA R09 — mobile hero composed like the owner's reference: models fill the frame, copy sits on a
   soft cream fade at the lower edge, then "Find your everyday" category cards. Desktop is unchanged. */
.mobile-everyday{display:none}

/* Woven motifs added in R09 (all breakpoints) */
.hero-title-emphasis.has-tape:after{display:none}
.woven-tape{position:absolute;left:2%;right:2%;bottom:-.04em;height:clamp(4px,.12em,7px);width:96%;overflow:visible;pointer-events:none}
.woven-tape .tape-warp{stroke:#3d302a;stroke-width:1;vector-effect:non-scaling-stroke}
.woven-tape .tape-weft{fill:none;stroke:var(--wine);stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0;animation:lf-draw .7s 1.15s linear both}
.woven-tape .tape-knot{stroke:#3d302a;stroke-width:1;vector-effect:non-scaling-stroke}
.woven-tape .tape-reveal{transform-box:fill-box;transform-origin:left center;animation:lf-reveal .55s .95s cubic-bezier(.65,0,.35,1) both}
.woven-tape .tape-reveal-late{transform-box:fill-box;transform-origin:left center;animation:lf-reveal .7s 1.15s linear both}
#app.is-swapping .woven-tape *{animation:none!important}

.basket-seam{height:20px;margin:0 0 30px;pointer-events:none}
.basket-seam svg{display:block;width:100%;height:100%;overflow:hidden}
.basket-seam .bk-h{stroke:#d3b07a;stroke-width:1.5;stroke-linecap:round}
.basket-seam .bk-v{stroke:#a87a45;stroke-width:1.5;stroke-linecap:round}
.basket-seam .bk-zig{fill:none;stroke:var(--wine);stroke-width:1.3;stroke-linejoin:round}
.basket-seam .bk-rule{stroke:#cdb592;stroke-width:.8}
.basket-seam .m-reveal{animation-duration:2.2s;animation-timing-function:cubic-bezier(.45,0,.35,1)}
.basket-seam .bk-zig.m-thread{animation-duration:2.2s;animation-delay:.35s}

@media(max-width:700px){
 /* Header: thin divider between menu and language pill, as in the reference. */
 .menu-toggle{margin-right:9px}
 .nav>.lang-switch{position:relative}
 .nav>.lang-switch:before{content:'';position:absolute;left:-6px;top:6px;bottom:6px;width:1px;background:var(--line)}
 .nav>.lang-switch button{min-width:24px;height:30px;padding:0 3px}

 /* Hero frame */
 .hero{display:block;position:relative;height:clamp(470px,calc(100svh - 160px),540px);min-height:0;background:#e9dccb;overflow:hidden}
 .hero-stage{position:absolute;inset:0;height:auto;z-index:0}
 .hero-stage .hero-backdrop{object-position:70% center}
 .hero-stage .hero-person{height:93%;bottom:1%;width:auto}
 .hero-stage .hero-woman{left:1%;right:auto;z-index:2}
 .hero-stage .hero-man{left:40%;right:auto;z-index:1}

 /* Copy over a soft fade — faces stay above it. */
 .hero .hero-text-wrap{position:absolute;left:0;right:0;bottom:0;width:100%;height:auto;margin:0;z-index:3;padding-top:96px;background:linear-gradient(to bottom,#efe5d800 0,#efe5d880 26%,#f2eadfe6 55%,#f5f0e8 82%)}
 .hero-copy{padding:0 22px 22px;width:100%;height:auto;background:transparent}
 .hero-copy .eyebrow{font-size:10px;letter-spacing:.22em;margin:0 0 2px}
 .hero-copy .hero-title{margin:0}
 .hero-title-lead{font-size:clamp(44px,12.8vw,54px);font-weight:600;line-height:1.12;letter-spacing:-.01em}
 .hero-title-line{font-size:clamp(23px,6.6vw,28px);font-weight:400;line-height:1.45;margin-top:2px}
 html[lang=th] .hero-title-lead{line-height:1.38;letter-spacing:0}
 html[lang=th] .hero-title-line{line-height:1.6;margin-top:0}
 .hero-copy .hero-title+p{font-size:12.5px;line-height:1.6;margin:8px 0 16px;max-width:none}
 .hero-copy .hero-title+p br{display:none}
 .hero-copy .button{width:100%;min-height:50px;font-size:14px;justify-content:center;gap:16px;padding:10px 20px}

 /* Find your everyday */
 .mobile-everyday{display:block;padding:24px 18px 4px}
 .mobile-everyday h2{font-size:20px;line-height:1.5;font-weight:500;margin-bottom:12px}
 .everyday-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
 .everyday-card{position:relative;display:flex;align-items:center;justify-content:flex-end;height:82px;border-radius:12px;overflow:hidden;background:#ece2d4;isolation:isolate;transition:border-radius .3s ease}
 .everyday-card img{position:absolute;left:0;top:0;width:56%;height:100%;object-fit:cover;object-position:52% 18%;-webkit-mask-image:linear-gradient(90deg,#000 45%,transparent);mask-image:linear-gradient(90deg,#000 45%,transparent);z-index:-1}
 .everyday-card:last-child img{object-position:40% 30%}
 .everyday-label{width:46%;padding:0 10px 0 4px;display:flex;flex-direction:column;align-items:flex-start;gap:2px;font-size:13px;line-height:1.3;font-weight:500;color:var(--ink)}
 .everyday-label svg{width:18px;height:18px;color:var(--wine)}
 .everyday-card:active{opacity:.88}
 .everyday-card:focus-visible{outline-offset:3px}
 .basket-seam{height:15px;margin-bottom:20px}
}
@media(max-width:360px){.everyday-label{font-size:12px}.hero-title-lead{font-size:42px}}
/* Landscape phones: keep the copy readable without covering the faces. */
@media(max-width:700px) and (orientation:landscape){
 .hero{height:auto}
 .hero-stage{position:relative;height:300px}
 .hero .hero-text-wrap{position:relative;padding-top:0;background:#f5f0e8}
 .hero-copy{padding-top:14px}
}
@media(prefers-reduced-motion:reduce){.woven-tape *,.basket-seam *{animation:none!important}}
.motion-off .woven-tape *,.motion-off .basket-seam *{animation:none!important}