/* Candidate cosmetic storefront skin. Load only in the CUSTOMER index,
   after style.css and brand.css. No admin, payment, or AI behavior changes.
   Brand logo is not recolored. No external assets, trackers or fonts. */
:root{--beauty-paper:#faf7f2;--beauty-sand:#eadfcf;--beauty-rose:#eedfd9;--beauty-ink:#26313a}
body{background:var(--beauty-paper);color:var(--beauty-ink)}
#root main h1,#root main h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.03em}
#root main h1{font-size:clamp(2.45rem,5.3vw,4.8rem);line-height:1.06}
#root main h2{font-size:clamp(1.9rem,3.2vw,3.1rem);line-height:1.15}
#root .hero{gap:clamp(1.5rem,4vw,4.5rem);padding-block:clamp(1.4rem,4vw,3.5rem)}
#root .hero .lead{max-width:38ch;line-height:1.65}
#root .hero-art{background:linear-gradient(140deg,#f5ebe0,#eedfd9);border:0;border-radius:3px}
#root .hero-art:before{border-color:#fff8}
#root .product-grid{gap:clamp(1rem,2.5vw,2rem)}
#root .product-card{background:transparent;border:0;border-radius:0;box-shadow:none}
#root .product-art{background:#f1e9df;border:0;border-radius:3px}
#root .product-card:nth-child(2n) .product-art{background:#eee5e1}
#root .product-card .content{padding:1.15rem 0 1.7rem}
#root .product-card h3{font-family:Georgia,'Times New Roman',serif;font-size:1.48rem;line-height:1.25;font-weight:400;color:var(--beauty-ink)}
#root .product-card .sub{line-height:1.6;color:#51585f}
#root .product-card .actions{gap:.8rem;flex-wrap:wrap}
#root .purchase-choice h2{font-family:Arial,Helvetica,sans-serif;font-size:1.04rem;font-weight:600;letter-spacing:0}
#root .purchase-option{border-color:#d9d3c9;background:#fff;border-radius:4px}
#root .purchase-option.featured{background:#0a3fb5;color:#fff;border-color:#0a3fb5}
#root .purchase-option span{line-height:1.55}
#root .strip{border-color:#e3dacd;background:transparent}
#root .banner{background:#eee4da;border:0;border-radius:3px;color:var(--beauty-ink)}
#root .banner h2{color:var(--beauty-ink)}
#root .banner .sub{color:#51585f}
#root .steps{gap:2rem}
#root .steps .stepnum{color:#765a46}
#root .section{padding-block:clamp(2rem,5vw,4rem)}
#root .footer{border-color:#e3dacd}
#root a:focus-visible,#root button:focus-visible,#root input:focus-visible,#root select:focus-visible{outline:3px solid #1a5cf0;outline-offset:3px}
@media(max-width:760px){#root .hero h1{font-size:2.65rem}#root .product-card .btn{min-height:48px}#root .hero-art{height:320px}#root .purchase-options{grid-template-columns:1fr}#root .product-card .content{padding-inline:0}#root .section{padding-block:2rem}}
@media(prefers-reduced-motion:reduce){#root *{scroll-behavior:auto!important;transition:none!important}}

#root .beauty-hero{grid-template-columns:1.05fr 1fr;align-items:center}
.beauty-photo{margin:0;position:relative;height:650px;overflow:hidden;background:#eadfcf;border-radius:4px}
.beauty-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.beauty-photo figcaption{position:absolute;bottom:12px;left:16px;background:#faf7f2e8;padding:5px 9px;font-size:11px;color:#26313a}
#root .purchase-options{grid-template-columns:1fr}#root .purchase-option{padding:17px 20px;min-height:80px}
#root .product-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.beauty-story{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;margin:40px 0 65px}
.beauty-story-detail{min-height:300px;background:linear-gradient(135deg,#eadfcf,#eedfd9);display:flex;flex-direction:column;align-items:center;justify-content:center}
.beauty-story-detail span{font:italic 100px Georgia;color:#765a46}.beauty-story-detail small{letter-spacing:.22em;color:#765a46}
#root .workspace .viewer.placeholder{background:#eee5e1;min-height:470px;border:0}
@media(max-width:760px){#root .beauty-hero{grid-template-columns:1fr}.beauty-photo{height:380px}#root .beauty-hero h1{max-width:12ch}.beauty-story{grid-template-columns:1fr;gap:24px}.beauty-story-detail{min-height:200px}#root .product-art{height:290px}#root .workspace .viewer.placeholder{min-height:340px}}

/* Keep the private-label composition and brand labels fully visible. */
#root .beauty-photo img{aspect-ratio:4/5;object-fit:contain;height:auto}

/* Authentic Flex Group mark and descriptor, without a substitute wordmark. */
.beauty-story-detail img{width:min(78%,360px);height:auto;object-fit:contain;margin-bottom:20px}
.beauty-story-detail small{color:#002067}
#root .beauty-photo{height:auto;align-self:center}
#root .beauty-photo img{display:block;width:100%;height:auto}

/* Integrated project, pack and label review before cart. */
.static-product{display:block;width:100%;height:auto;max-height:620px;object-fit:contain}
#viewer[data-renderer="static"]{display:flex;align-items:center;justify-content:center}
#viewer[data-renderer="static"] img{width:100%;height:100%;object-fit:contain}
.label-review,.commercial-preview{margin-top:20px}.label-review h2,.commercial-preview h2{font-size:1.5rem!important}
.label-review .label-flat{display:block;width:100%;max-height:520px;object-fit:contain;margin:16px auto;background:#fff}
.saved-preview{display:grid;grid-template-columns:1fr 1fr;gap:16px;background:#f7f3ee;border-radius:4px;margin:12px 0}
.saved-preview img{width:100%;height:220px;object-fit:contain}
.studio-preview{min-width:0}
@media(max-width:760px){.saved-preview img{height:160px}.label-review .label-flat{max-height:440px}}