/* Yeli Boutique 5.5 — Atelier Motion & Authentic Portrait
 * Non-destructive visual refinements to the approved Rosa Editorial 5.4.
 * 2026-10-25 — No changes to business logic, admin, cloud, payments or AI.
 */
:root {
  --y55-ivory: #fffaf6;
  --y55-shell: #fff6f3;
  --y55-blush: #f9e8e8;
  --y55-rose: #cf698b;
  --y55-burgundy: #75203f;
  --y55-text: #7e5263;
  --y55-gold: #c9a577;
  --y55-border: #efcfd7;
  --y55-shadow: 0 17px 36px rgba(128,67,88,.10), 0 4px 12px rgba(128,67,88,.04);
  --y55-ease: cubic-bezier(.22,1,.36,1);
  --y55-fast: 180ms;
  --y55-normal: 320ms;
}
/* Respect the original rose identity. Contrast comes from type, not a plum wall. */
body{background:var(--y55-ivory)}
.v50-home.y54-home{
 background:radial-gradient(ellipse at 87% 0%,rgba(250,216,225,.34),transparent 48%),var(--y55-ivory);
}
/* Brand / controls: one consistent typographic and interaction language. */
.v50-header{
 background:rgba(255,250,247,.95)!important;
 border-bottom:1px solid rgba(218,169,181,.57)!important;
 box-shadow:0 5px 25px rgba(138,66,89,.065)!important;
 backdrop-filter:blur(16px);
 -webkit-backdrop-filter:blur(16px);
}
.v50-header .brand{letter-spacing:.055em!important}
.v50-header .nav-right>.yeli-lang-control{
 border-color:#edc7d1!important;
 box-shadow:inset 0 1px 4px #f1cfd43b;
}
.v50-header .nav-right>.yeli-lang-control button,
.v50-header .icon-btn,.v50-nav .nav-link,
.mobile-bottom button{
 transition:color var(--y55-fast) ease,background-color var(--y55-fast) ease,box-shadow var(--y55-fast) ease,transform var(--y55-fast) var(--y55-ease);
}
.v50-header .icon-btn:hover{color:#ba5576!important;background:#fbe9ec}
.v50-header .icon-btn:active{transform:scale(.94)}
.v50-header button:focus-visible,.mobile-bottom button:focus-visible{
 outline:3px solid var(--y55-rose);outline-offset:3px;
}
/* Hero: preserve all layout/text, use Yeli's actual seated photo instead of a synthetic cutout. */
.y54-hero{
 background:
  radial-gradient(ellipse at 89% 28%,rgba(249,194,203,.46),transparent 44%),
  linear-gradient(113deg,#fffaf5 0%,#fff6f0 44%,#f7dfe0 100%);
}
.y54-hero::before{opacity:.09}
.y54-hero::after{
 background:linear-gradient(90deg,#fffbf5 0%,rgba(255,250,246,.97) 19%,rgba(255,250,246,.91) 35%,rgba(255,250,246,.44) 55%,rgba(255,250,246,.02) 79%);
}
.y54-hero-person{
 top:0;right:0;width:67%;height:100%;max-width:none;
 object-fit:cover;object-position:50% 32%;
 filter:saturate(1.035) contrast(1.01);
 -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.28) 10%,#000 39%);
 mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.28) 10%,#000 39%);
}
.y54-hero-flower-a{background:rgba(239,170,190,.19);filter:blur(58px)}
.y54-hero-stilllife{opacity:.55;max-width:220px}
.y54-hero-copy .y54-overline{color:#ae4d73}
.y54-home .y54-hero h1{color:#6f203e;letter-spacing:-.055em;text-shadow:0 2px 14px rgba(255,252,247,.8)}
.y54-home .y54-hero h1 em{color:#c85c7e}
.v50-hero-copy.y54-hero-copy >p{color:#7f4e61}
.y54-signature{color:#bd6c82;opacity:.91}
.y54-hero-object{
 background:linear-gradient(137deg,rgba(255,247,242,.96),rgba(250,226,225,.79));
 border:1px solid #f6e0db;
 box-shadow:0 12px 28px rgba(128,71,84,.12);
}
/* A little more visual craftsmanship on controls and the brand promises. */
.y54-btn{
 border-color:#c78ca1;
 box-shadow:0 7px 18px rgba(127,66,88,.085);
 transition:background-color var(--y55-fast) ease,transform var(--y55-fast) var(--y55-ease),
 box-shadow var(--y55-normal) var(--y55-ease),border-color var(--y55-fast) ease,filter var(--y55-fast) ease;
}
.y54-btn-primary{
 background:linear-gradient(114deg,#8d3154 0%,#b44c72 62%,#ba5e7e 100%);
 border:1px solid rgba(251,236,216,.95);
 box-shadow:0 12px 26px rgba(139,42,81,.20),inset 0 1px 0 rgba(255,255,255,.23);
}
.y54-btn-outline{background:rgba(255,250,248,.88);border-color:#b8758b}
.y54-btn:active{transform:translateY(1px) scale(.992)}
.y54-promise{
 border:1px solid #ebc0c9;
 outline:2px solid rgba(255,255,255,.76);outline-offset:-8px;
 background:linear-gradient(118deg,rgba(255,253,251,.96),rgba(255,243,243,.93));
 box-shadow:var(--y55-shadow);
}
.y54-promise>div{color:#78314b}
.y54-promise-icon{color:#be607e}
/* Category cards: optical spacing, photography-led and polished touch responses. */
.y54-category-section{
 background:radial-gradient(circle at 100% 0%,rgba(249,208,215,.27),transparent 45%);
}
.y54-section-head h2{letter-spacing:-.052em}
.y54-section-head p{color:#795363}
.y54-category-card{
 border:1px solid rgba(230,177,188,.9);
 border-radius:26px;
 box-shadow:var(--y55-shadow);
 transition:transform var(--y55-normal) var(--y55-ease),box-shadow var(--y55-normal) var(--y55-ease),border-color var(--y55-normal) ease;
}
.y54-category-card>img{transition:transform 620ms var(--y55-ease),filter 420ms ease;filter:saturate(.99)}
.y54-category-card::after{
 content:'';position:absolute;inset:0 0 78px;pointer-events:none;
 background:linear-gradient(180deg,rgba(255,253,250,.07),transparent 60%,rgba(68,24,43,.06));
}
.y54-category-card-title{
 background:rgba(255,250,248,.95);border-top:1px solid rgba(255,255,255,.95);
 backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
.y54-category-card-title i{background:linear-gradient(145deg,#fff7f6,#f7dfe4);
 transition:transform var(--y55-normal) var(--y55-ease),background-color var(--y55-fast) ease}
/* Editorial collection: the same true portrait across sections, softer premium depth. */
.y54-curated{background:radial-gradient(ellipse at 97% 20%,rgba(244,195,202,.20),transparent 54%),var(--y55-ivory)}
.y54-curated-photo{
 background:#f9e4df;
 border:1px solid rgba(235,187,198,.77);
 box-shadow:0 15px 38px rgba(134,72,83,.12);
 border-radius:46% 46% 23px 23px / 27% 27% 23px 23px;
}
.y54-curated-photo>img{
 position:absolute;left:0;right:0;top:0;bottom:0;width:100%;height:100%;
 object-fit:cover;object-position:53% 29%;
 filter:saturate(.98);
}
.y54-curated-photo>span{
 right:7%;top:8%;color:#9b3c59;
 text-shadow:0 1px 15px rgba(255,255,255,.89);
}
.y54-curated-coming,.y54-curated-live{
 background:linear-gradient(128deg,rgba(255,248,246,.97),rgba(255,241,239,.91));
 border:1px solid #edc8d0;
 outline:2px solid rgba(255,255,255,.75);outline-offset:-9px;
 box-shadow:var(--y55-shadow);
}
.y54-polaroid{
 box-shadow:0 13px 24px rgba(122,63,76,.14);
 border-color:#efd4d4;
 transition:box-shadow var(--y55-normal) ease,filter var(--y55-normal) ease;
}
.y54-prelaunch-note{color:#886574}
/* Concierge/chat: bright, warm and credible without pretending sample replies are live. */
.y54-concierge{background:linear-gradient(139deg,#fff6f3,#ffeae9 74%,#fff8f4);border-radius:30px}
.y54-concierge-photo{
 border:1px solid #efcbd4;
 background:#f8e4e0;
 border-radius:43% 43% 20px 20px / 26% 26% 20px 20px;
 box-shadow:0 12px 31px rgba(130,69,89,.095);
}
.y54-concierge-photo img{
 position:absolute;inset:0;bottom:0;left:0;width:100%;height:100%;
 object-fit:cover;object-position:52% 24%;
}
.y54-chat-card{
 border:1px solid #efcbd3;
 outline:2px solid rgba(255,255,255,.77);outline-offset:-8px;
 background:linear-gradient(150deg,rgba(255,251,249,.98),rgba(255,245,245,.92));
 box-shadow:var(--y55-shadow);
}
.y54-chat-answer>div{box-shadow:0 7px 20px rgba(129,65,87,.09)}
.y54-chat-answer>img{
 object-position:50% 45%;
}
.y54-chat-suggest button{
 min-height:39px;
 transition:background-color var(--y55-fast) ease,transform var(--y55-fast) var(--y55-ease),border-color var(--y55-fast) ease;
}
.y54-chat-suggest button:active{transform:scale(.99)}
/* Mirroring/AI remain the original working routes; only the presentation changes. */
.y54-studio{
 background:linear-gradient(123deg,#fff6f5,#ffece9);
 border:1px solid #eec7d1;
 box-shadow:var(--y55-shadow);
 outline:2px solid rgba(255,255,255,.7);outline-offset:-8px;
}
.y54-studio-gallery img{
 transition:transform 400ms var(--y55-ease),box-shadow 400ms ease;
}
/* Core public shop controls get the same tactile feedback as the editorial landing. */
.v50-product-card,.v50-category-card,.product-card{
 transition:box-shadow var(--y55-normal) ease,transform var(--y55-normal) var(--y55-ease);
}
.v50-catalog-body .product-media img{transition:transform 520ms var(--y55-ease)}
.v50-catalog-search:focus-within{
 border-color:#c66b8a;box-shadow:0 0 0 3px rgba(209,123,147,.15);
}
.filter-chip,.product-add,.product-wish{transition:background-color var(--y55-fast) ease,color var(--y55-fast) ease,transform var(--y55-fast) ease}
.filter-chip:active,.product-add:active{transform:scale(.98)}
/* Keep existing floating assistant discoverable and above mobile safe-area. */
.yeli-help-launcher{border-color:rgba(255,248,246,.96);box-shadow:0 10px 28px rgba(126,50,78,.18),0 0 0 4px rgba(255,255,255,.76)}
.yeli-help-window{border-color:#ebcbd1}
.mobile-bottom{
 background:rgba(255,250,248,.96);
 border-top:1px solid #edcbd3;
 box-shadow:0 -8px 25px rgba(130,68,89,.07);
 -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
}
.mobile-bottom button.active{color:#953151}
.mobile-bottom button:active{transform:scale(.97)}
.mobile-bottom button{min-height:45px}
.mobile-bottom{padding-bottom:max(9px,env(safe-area-inset-bottom))}
:where(.y54-home,.v50-header,.mobile-bottom) :is(a,button):focus-visible{outline:3px solid #bd6382;outline-offset:3px}
/* Subtle page/section motion is progressive. Without the JS helper, all content remains visible. */
@media(prefers-reduced-motion:no-preference){
  .y55-reveal{opacity:0;transform:translateY(14px);
    transition:opacity 560ms var(--y55-ease),transform 560ms var(--y55-ease)}
  .y55-reveal.y55-visible{opacity:1;transform:translateY(0)}
  .y55-route-enter{animation:y55-page-in 240ms var(--y55-ease) both}
  @keyframes y55-page-in{from{opacity:.45;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
  .y55-hero-in .y54-hero-copy>*{animation:y55-hero-in 560ms var(--y55-ease) both}
  .y55-hero-in .y54-hero-copy>*:nth-child(2){animation-delay:85ms}
  .y55-hero-in .y54-hero-copy>*:nth-child(3){animation-delay:145ms}
  .y55-hero-in .y54-hero-copy>*:nth-child(4){animation-delay:205ms}
  @keyframes y55-hero-in{from{opacity:.35;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
}
@media(hover:hover) and (pointer:fine){
  .y54-btn:hover{transform:translateY(-3px);box-shadow:0 17px 35px rgba(142,65,89,.20)}
  .y54-category-card:hover{transform:translateY(-5px);box-shadow:0 21px 43px rgba(123,57,77,.19);border-color:#dda4b5}
  .y54-category-card:hover>img{transform:scale(1.035);filter:saturate(1.04)}
  .y54-category-card:hover .y54-category-card-title i{transform:translateX(3px)}
  .y54-chat-suggest button:hover{background:#fbe5eb;border-color:#d89fb1;transform:translateY(-1px)}
  .y54-studio-gallery img:hover{transform:translateY(-2px);box-shadow:0 9px 24px rgba(125,65,84,.14)}
  .product-card:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(129,64,82,.12)}
  .v50-catalog-body .product-media:hover img{transform:scale(1.025)}
}
@media(max-width:900px){
  .y54-hero-person{width:78%;right:-6%;object-position:48% 30%}
  .y54-hero::after{background:linear-gradient(90deg,#fffbf5 0%,rgba(255,250,246,.97) 18%,rgba(255,250,246,.77) 46%,rgba(255,250,246,.05) 88%)}
}
@media(max-width:600px){
  .v50-header{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
  .y54-hero{min-height:660px;background:linear-gradient(110deg,#fff9f4 0%,#ffece9 76%,#f9dadb)}
  .y54-hero-person{
   top:0;right:-15%;width:87%;height:100%;object-fit:cover;object-position:51% 24%;
   -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.31) 19%,#000 48%);
   mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.31) 19%,#000 48%);
  }
  .y54-hero::after{background:linear-gradient(90deg,rgba(255,250,245,.96) 0%,rgba(255,250,245,.92) 28%,rgba(255,250,245,.62) 53%,rgba(255,250,245,.06) 91%)}
  .v50-hero-copy.y54-hero-copy{max-width:81%;min-height:650px;justify-content:flex-start;padding-top:46px}
  .y54-home .y54-hero h1{font-size:clamp(41px,11.2vw,53px);line-height:1.015;letter-spacing:-.056em;max-width:320px}
  .y54-hero-stilllife{opacity:.43;right:-18px}
  .y54-hero-object{display:none!important}
  .y54-promise{margin-top:0;border-radius:19px}
  .y54-promise>div{font-size:12px;line-height:1.25}
  .y54-section-head h2{letter-spacing:-.055em}
  .y54-category-section{padding-top:73px}
  .y54-category-card{border-radius:17px}
  .y54-category-card-title{background:rgba(255,251,249,.96)}
  .y54-curated-photo{border-radius:35% 35% 15px 15px/24% 24% 15px 15px;height:303px}
  .y54-curated-photo img{left:0;bottom:0;width:100%;height:100%;object-fit:cover;object-position:50% 28%}
  .y54-concierge{border-radius:19px;background:linear-gradient(145deg,#fff7f4,#ffe9e7)}
  .y54-concierge-photo{min-height:270px}
  .y54-concierge-photo img{left:0;bottom:0;width:100%;height:100%;object-fit:cover;object-position:50% 27%}
  .y54-chat-card{outline-offset:-6px}
  .y54-studio{outline-offset:-6px}
  .yeli-help-launcher{bottom:calc(85px + env(safe-area-inset-bottom))}
}
@media(max-width:375px){
  .y54-home .y54-hero h1{font-size:42px;letter-spacing:-.06em}
  .y54-hero-person{right:-18%;width:91%}
  .v50-hero-copy.y54-hero-copy{max-width:84%}
  .y54-category-card-title strong{font-size:23px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important}
  .y54-home .y55-reveal{opacity:1!important;transform:none!important;transition:none!important}
  .y55-route-enter,.y55-hero-in .y54-hero-copy>*{animation:none!important}
  .y54-category-card,.y54-category-card img,.y54-btn,.y54-chat-suggest button,.mobile-bottom button,
  .y54-studio-gallery img{transition:none!important}
}
/* Final mobile editorial pass: make the curated story and guidance genuinely readable. */
@media(max-width:500px){
 .y54-curated-heading p{font-size:14px;line-height:1.52}
 .y54-curated-coming{grid-template-columns:minmax(0,1fr);gap:12px;padding:25px 19px 18px}
 .y54-curated-copy h3{font-size:clamp(41px,10.7vw,49px);line-height:1.06;margin:11px 0}
 .y54-curated-copy>p{max-width:100%;font-size:14px;line-height:1.52;margin:3px 0 8px}
 .y54-curated-copy .y54-overline{font-size:9px;letter-spacing:.12em}
 .y54-curated-actions{max-width:100%;gap:9px}
 .y54-curated-actions .y54-btn{min-height:46px;font-size:12px;padding:11px 17px;gap:9px}
 .y54-curated-actions .y54-btn span:last-child{font-size:19px}
 .y54-polaroids{min-height:222px;width:100%;max-width:360px;margin:0 auto;overflow:visible}
 .y54-polaroid{padding:6px 6px 13px}
 .y54-polaroid-1{left:3%;top:4%;width:41%;height:74%}
 .y54-polaroid-2{right:3%;top:1%;width:41%;height:74%}
 .y54-polaroid-3{left:34%;bottom:0;width:36%;height:61%;z-index:1}
 .y54-polaroid-note{z-index:2;top:1%;left:42%;padding:9px;font-size:12px}
 .y54-prelaunch-note{margin-top:0;font-size:10px;line-height:1.55;text-align:left}
 .y54-concierge-heading>p{font-size:13px;line-height:1.5}
 .y54-concierge-features small{font-size:9px}
 .y54-chat-question>span:last-child{font-size:12px}
 .y54-chat-answer p{font-size:13px;line-height:1.5}
 .y54-chat-suggest button{min-height:44px;font-size:11px}
 .y54-chat-safe{font-size:10px}
 .y54-studio-copy p{font-size:12px}
 .y54-studio-copy .y54-btn{min-height:44px;font-size:11px}
}