/* sc-ui redesign 2026-10-15: light, photo-first, chips (mirrors shopfashion sf-ui) */
:root{--bg:#FAF8F5;--ink:#111;--panel:#fff;--accent:#8A2E4B;--onaccent:#fff;--line:#E8E4DE;--body:Inter,"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
html,body{background:var(--bg);color:var(--ink);font-family:var(--body);overflow-x:hidden}
h1,h2,h3{font-family:var(--body);font-weight:600;letter-spacing:-.02em;color:var(--ink)}
section{color:var(--ink)}
.wrap{padding-left:20px;padding-right:20px;box-sizing:border-box}
header.nav{background:rgba(250,248,245,.92)!important;backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header.nav a,header.nav .logo{color:var(--ink)!important}
.eyebrow{font-family:var(--body);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#6b6460;background:none;border:0;padding:0}
.btn{background:var(--accent);color:#fff;border:0;border-radius:999px;min-height:48px;padding:12px 24px;display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:none;font-weight:600;text-decoration:none}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn.sm{min-height:44px;padding:10px 18px}
.fine{color:#6b6460;font-size:13px}
section.alt{background:#F4F1EC}
input,select,textarea{background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:16px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,.chip:focus-within{outline:3px solid var(--accent);outline-offset:2px}
section.hx{display:none!important}
.sch{padding:24px 20px 32px;display:grid;gap:14px;max-width:1120px;margin:0 auto;box-sizing:border-box}
.sch h1{font-size:34px;line-height:1.08;margin:0}
.sch .benefit{font-size:16px;color:#4a4542;margin:0}
.sch-steps{list-style:none;margin:0;padding:0;display:flex;gap:8px;flex-wrap:wrap}
.sch-steps li{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:#4a4542;background:#F1EDE7;border-radius:999px;padding:6px 12px;min-height:32px}
.sch-steps svg{width:16px;height:16px}
.sch-drop{position:relative;display:block;aspect-ratio:4/5;max-height:50svh;width:100%;border-radius:24px;overflow:hidden;background:#EFEAE3 url(/looks/look3.webp) 42% 30%/cover;border:0;padding:0;cursor:pointer}
.sch-drop:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,17,17,0) 50%,rgba(17,17,17,.4))}
.sch-drop .ai-label{position:absolute;top:12px;right:12px;z-index:2;font-size:12px;background:rgba(255,255,255,.9);color:#111;padding:4px 10px;border-radius:999px}
.sch-cta{width:100%;min-height:56px;font-size:17px}
.sch-cta svg{width:22px;height:22px}
.sch-alt{text-align:center;font-size:15px;color:var(--ink);text-decoration:underline;text-underline-offset:3px;padding:10px;min-height:44px;display:block;box-sizing:border-box}
.sch-priv{font-size:13px;color:#6b6460;margin:0;text-align:center}
@media(min-width:900px){.sch{grid-template-columns:1fr 1fr;column-gap:56px;padding:64px 24px;min-height:70vh;align-content:center}.sch>*{grid-column:1}.sch-drop{grid-column:2;grid-row:1/8;max-height:620px}.sch h1{font-size:54px}.sch-cta{width:auto;justify-self:start}.sch-alt,.sch-priv{text-align:left;padding-left:0}}
#tryon-sec{padding-top:32px}
#tryon-sec h2{font-size:28px}
#tryon-sec>.wrap>p:first-of-type{display:none}
#tryon>label:first-child{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#tryPrev{width:100%;max-height:60svh;object-fit:contain;background:#EFEAE3;border-radius:16px}
.sc-step{margin:16px 0}
.sc-step h3{font-size:15px;margin:0 0 8px}
.sc-row{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -20px;padding:2px 20px 8px;scrollbar-width:none}
.sc-row::-webkit-scrollbar{display:none}
.sc-chip{flex:0 0 auto;scroll-snap-align:start;min-height:44px;padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);font:inherit;font-size:15px;font-weight:400;display:inline-flex;align-items:center;gap:6px;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s,border-color .15s;-webkit-tap-highlight-color:transparent}
.sc-chip[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#fff}
.sc-dot{width:16px;height:16px;border-radius:50%;border:1px solid #0002;display:inline-block}
.sc-more{margin:12px 0}
.sc-more summary{min-height:44px;display:flex;align-items:center;font-size:15px;cursor:pointer;color:#4a4542}
.sc-more .row{display:grid;gap:8px;grid-template-columns:1fr 1fr}
.sc-more select,.sc-more input{width:100%;min-height:44px;box-sizing:border-box;padding:8px 12px}
#tryon .consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.4;padding:12px;border:1px solid var(--line);border-radius:16px;background:#fff;margin:12px 0}
#tryon .consent input{width:22px;height:22px;min-height:0;flex:0 0 auto;accent-color:var(--accent)}
#tryon button[type=submit]{width:100%;min-height:56px;font-size:17px}
@media(min-width:900px){#tryon button[type=submit]{width:auto;min-width:240px}}
#whoPick .taps,#concierge .taps{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;scrollbar-width:none;margin:0 -20px;padding:2px 20px 8px}
#whoPick .chip,#concierge .taps button{flex:0 0 auto;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);padding:8px 16px;font:inherit;font-size:15px;cursor:pointer}
#concierge textarea{width:100%;box-sizing:border-box;min-height:96px;font-size:16px;padding:14px}
#tryOut img{width:100%;border-radius:16px}
#tryOut figcaption .btn{margin:6px 6px 0 0}
.tf-wait{background:linear-gradient(100deg,#EFEAE3 30%,#F8F5F0 50%,#EFEAE3 70%)!important;background-size:300% 100%!important;animation:scsh 1.3s linear infinite;color:#6b6460!important}
@keyframes scsh{0%{background-position:100% 0}100%{background-position:-100% 0}}
@media(prefers-reduced-motion:reduce){.tf-wait{animation:none}}
.bbar{background:rgba(250,248,245,.96)!important;border-top:1px solid var(--line)!important;color:var(--ink)!important}
.bbar a{color:var(--ink)!important}
footer{background:#F4F1EC;color:var(--ink)}
footer a{color:var(--ink)}
img,video{max-width:100%}
header.nav .logo text{fill:#111}
header.nav .logo tspan{fill:#8A2E4B;filter:none}
header.nav .logo path{fill:#8A2E4B;stroke:#8A2E4B}
header.nav [class*=tag],header.nav .si-tag{color:#6b6460!important;text-shadow:none!important}
@media(max-width:899px){.sch-drop{max-height:40svh}.sch{padding-top:16px}}
header.nav .lg-sub{color:#8a817b!important;text-shadow:none!important;filter:none!important}