/* AMOCARE Final Premium UI Layer
   Keeps the original D1/R2/admin functionality intact and enhances presentation only. */
:root{
  --pink:#ff5f99;
  --glass:rgba(255,255,255,.76);
  --glass-strong:rgba(255,255,255,.9);
  --ease-premium:cubic-bezier(.2,.75,.2,1);
  --ease-spring:cubic-bezier(.16,1,.3,1);
}
html{scroll-padding-top:145px}
body{
  background:
    radial-gradient(circle at 8% 16%,rgba(255,215,230,.22),transparent 22rem),
    radial-gradient(circle at 94% 38%,rgba(225,215,255,.22),transparent 26rem),
    #fff;
}
body::before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.26;
  background-image:linear-gradient(rgba(255,255,255,.72),rgba(255,255,255,.72)),radial-gradient(circle at 1px 1px,rgba(105,55,93,.1) 1px,transparent 0);
  background-size:auto,24px 24px;
  mask-image:linear-gradient(to bottom,black,transparent 72%);
}
::selection{background:var(--pink-200);color:var(--purple-deep)}

/* Top progress + refined sticky header */
.scroll-progress{position:fixed;left:0;top:0;width:100%;height:3px;z-index:200;pointer-events:none;background:transparent}
.scroll-progress>span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--pink-500),#9d65d7,#66c6ff);box-shadow:0 0 14px rgba(255,95,153,.45);transition:width .08s linear}
.site-header{transition:box-shadow .35s var(--ease-premium),background .35s var(--ease-premium),transform .35s var(--ease-premium)}
.site-header.scrolled{background:rgba(255,255,255,.88);box-shadow:0 12px 38px rgba(78,34,68,.09)}
.site-header.scrolled .header-main{min-height:76px}
.header-main{transition:min-height .35s var(--ease-premium)}
.brand-logo{transition:transform .35s var(--ease-spring),filter .35s ease}
.brand:hover .brand-logo{transform:scale(1.025);filter:saturate(1.05)}
.main-nav a{position:relative;overflow:hidden}
.main-nav a:not(.active)::after{content:"";position:absolute;left:16px;right:16px;bottom:6px;height:2px;border-radius:10px;background:linear-gradient(90deg,var(--pink-500),var(--purple));transform:scaleX(0);transform-origin:left;transition:transform .28s var(--ease-premium)}
.main-nav a:not(.active):hover::after{transform:scaleX(1)}
.header-search input{transition:border-color .25s,box-shadow .25s,transform .25s;background .25s}
.header-search input:focus{transform:translateY(-1px);background:#fff}
.header-search button,.btn{position:relative;overflow:hidden;isolation:isolate}
.header-search button::after,.btn::after{content:"";position:absolute;inset:-100% auto -100% -60%;width:38%;z-index:-1;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);transition:left .65s var(--ease-premium)}
.header-search button:hover::after,.btn:hover::after{left:125%}
.tool-link,.icon-btn{border:1px solid transparent}
.tool-link:hover,.icon-btn:hover{border-color:rgba(255,95,153,.16);box-shadow:0 12px 28px rgba(107,44,91,.08)}

/* Announcement shimmer */
.announcement{position:relative;overflow:hidden;background-size:180% 180%;animation:announcementGradient 12s ease infinite}
.announcement::after{content:"";position:absolute;inset:0 auto 0 -25%;width:16%;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);transform:skewX(-18deg);animation:announcementShine 7s ease-in-out infinite}
@keyframes announcementGradient{50%{background-position:100% 50%}}
@keyframes announcementShine{0%,58%{left:-25%}82%,100%{left:125%}}

/* Hero: premium entrance + ambient motion */
.hero{position:relative;isolation:isolate}
.hero::before{content:"";position:absolute;inset:-120px 0 auto;min-height:520px;z-index:-1;pointer-events:none;background:radial-gradient(circle at 22% 20%,rgba(255,216,231,.28),transparent 32%),radial-gradient(circle at 78% 22%,rgba(218,205,255,.26),transparent 30%);filter:blur(12px)}
.hero-shell{transform:translateY(14px);opacity:0;transition:opacity .85s ease,transform 1s var(--ease-spring),box-shadow .4s ease}
.page-ready .hero-shell{transform:none;opacity:1}
.hero-shell:hover{box-shadow:0 34px 100px rgba(126,63,105,.16)}
.hero-copy-box .eyebrow,.hero-copy-box h1,.hero-copy-box .hero-kicker,.hero-copy-box .hero-copy,.hero-copy-box .hero-actions,.hero-copy-box .hero-benefits{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .8s var(--ease-spring)}
.page-ready .hero-copy-box .eyebrow{opacity:1;transform:none;transition-delay:.12s}
.page-ready .hero-copy-box h1{opacity:1;transform:none;transition-delay:.2s}
.page-ready .hero-copy-box .hero-kicker{opacity:1;transform:none;transition-delay:.28s}
.page-ready .hero-copy-box .hero-copy{opacity:1;transform:none;transition-delay:.34s}
.page-ready .hero-copy-box .hero-actions{opacity:1;transform:none;transition-delay:.42s}
.page-ready .hero-copy-box .hero-benefits{opacity:1;transform:none;transition-delay:.5s}
.hero h1,.page-hero h1{text-wrap:balance;text-shadow:0 1px 0 rgba(255,255,255,.7)}
.hero h1 .accent,.page-hero .accent{background:linear-gradient(135deg,#f2387d 5%,#ff72aa 52%,#8b4dc7 120%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-art{--mx:0;--my:0;perspective:1000px}
.hero-photo.main{translate:calc(var(--mx) * 13px) calc(var(--my) * 10px)}
.hero-photo.secondary{translate:calc(var(--mx) * -9px) calc(var(--my) * -7px)}
.hero-photo.third{translate:calc(var(--mx) * 7px) calc(var(--my) * -9px)}
.hero-sticker{translate:calc(var(--mx) * -5px) calc(var(--my) * 7px);animation:stickerFloat 5.6s ease-in-out infinite}
.hero-orb{animation:orbPulse 9s ease-in-out infinite;box-shadow:inset 0 0 60px rgba(255,255,255,.35),0 28px 70px rgba(123,70,121,.1)}
.hero-photo::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 20%,rgba(255,255,255,.18) 42%,transparent 58%);transform:translateX(-130%);transition:transform .8s ease}
.hero-shell:hover .hero-photo::after{transform:translateX(130%)}
@keyframes orbPulse{0%,100%{transform:scale(1);filter:saturate(1)}50%{transform:scale(1.035);filter:saturate(1.08)}}
@keyframes stickerFloat{0%,100%{transform:rotate(7deg) translateY(0)}50%{transform:rotate(4deg) translateY(-7px)}}

/* Sections and reveal choreography */
.section,.section-sm{position:relative}
.soft-panel{background:linear-gradient(180deg,rgba(255,249,252,.85),rgba(255,255,255,.7) 46%,rgba(249,246,255,.82));border-block:1px solid rgba(238,230,236,.72)}
.section-title-row h2,.section-head h2{position:relative}
.section-title-row h2::after,.section-head h2::after{content:"";display:block;width:46px;height:3px;border-radius:9px;margin-top:9px;background:linear-gradient(90deg,var(--pink-500),var(--purple));transform:scaleX(.4);transform-origin:left;transition:transform .7s var(--ease-spring)}
.section-title-row:has(+ .category-scroll) h2::after,.section-head.in h2::after,.section-title-row:hover h2::after{transform:scaleX(1)}
.reveal{filter:blur(2px);transform:translateY(26px) scale(.988);transition:opacity .72s ease,transform .82s var(--ease-spring),filter .72s ease}
.reveal.in{filter:none;transform:none}
.category-strip .reveal:nth-child(2),.product-grid .reveal:nth-child(2),.values-grid .reveal:nth-child(2){transition-delay:.06s}
.category-strip .reveal:nth-child(3),.product-grid .reveal:nth-child(3),.values-grid .reveal:nth-child(3){transition-delay:.12s}
.category-strip .reveal:nth-child(4),.product-grid .reveal:nth-child(4){transition-delay:.18s}
.category-strip .reveal:nth-child(5),.product-grid .reveal:nth-child(5){transition-delay:.08s}
.category-strip .reveal:nth-child(6),.product-grid .reveal:nth-child(6){transition-delay:.14s}
.category-strip .reveal:nth-child(7),.product-grid .reveal:nth-child(7){transition-delay:.2s}
.category-strip .reveal:nth-child(8),.product-grid .reveal:nth-child(8){transition-delay:.26s}

/* Category cards */
.category-mini{position:relative;isolation:isolate;overflow:hidden;transform:translateZ(0);box-shadow:0 10px 32px rgba(79,37,72,.05)}
.category-mini::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;background:radial-gradient(circle at 50% 0,rgba(255,215,232,.52),transparent 55%);transition:opacity .35s ease}
.category-mini:hover{transform:translateY(-7px) scale(1.018);border-color:rgba(255,95,153,.24);box-shadow:0 22px 52px rgba(83,44,72,.12)}
.category-mini:hover::before{opacity:1}
.category-thumb{box-shadow:inset 0 0 0 1px rgba(255,255,255,.7);transition:transform .48s var(--ease-spring),box-shadow .35s ease}
.category-mini:hover .category-thumb{transform:scale(1.055) rotate(-1.5deg);box-shadow:0 15px 30px rgba(90,43,77,.12)}
.category-thumb img{transition:transform .65s var(--ease-spring)}
.category-mini:hover .category-thumb img{transform:scale(1.09)}
.view-all{transition:color .25s,transform .25s}
.view-all:hover{transform:translateX(4px);color:var(--pink-700)}

/* Trust features */
.features{background:rgba(255,255,255,.82);backdrop-filter:blur(16px);box-shadow:0 18px 46px rgba(78,35,68,.075)}
.feature{transition:background .3s ease,transform .35s var(--ease-spring)}
.feature:hover{background:linear-gradient(180deg,#fff,#fff8fb);transform:translateY(-2px)}
.feature-icon{transition:transform .38s var(--ease-spring),box-shadow .3s}
.feature:hover .feature-icon{transform:translateY(-3px) rotate(-4deg) scale(1.06);box-shadow:0 12px 24px rgba(113,53,97,.1)}

/* Product cards */
.product-card{isolation:isolate;will-change:transform;box-shadow:0 12px 34px rgba(83,44,72,.06);transition:transform .42s var(--ease-spring),box-shadow .42s ease,border-color .32s ease}
.product-card::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(255,245,250,.66));opacity:0;transition:opacity .35s}
.product-card:hover{transform:translateY(-9px);border-color:rgba(255,95,153,.24);box-shadow:0 28px 64px rgba(83,44,72,.14)}
.product-card:hover::before{opacity:1}
.product-media{isolation:isolate}
.product-media::before{content:"View details";position:absolute;z-index:4;left:50%;bottom:14px;transform:translate(-50%,10px);opacity:0;white-space:nowrap;padding:8px 13px;border-radius:999px;background:rgba(35,27,47,.78);backdrop-filter:blur(9px);color:#fff;font-size:.69rem;font-weight:850;letter-spacing:.02em;box-shadow:0 8px 25px rgba(30,20,30,.18);transition:opacity .28s,transform .35s var(--ease-spring)}
.product-card:hover .product-media::before{opacity:1;transform:translate(-50%,0)}
.product-media::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,transparent 55%,rgba(42,27,42,.1));opacity:0;transition:opacity .3s}
.product-card:hover .product-media::after{opacity:1}
.product-media img{will-change:transform;transition:transform .72s var(--ease-spring),filter .45s ease}
.product-card:hover .product-media img{transform:scale(1.065);filter:saturate(1.04)}
.badge{z-index:5;box-shadow:0 8px 18px rgba(52,28,45,.09);backdrop-filter:blur(8px)}
.wish-btn{z-index:5;transition:transform .3s var(--ease-spring),background .25s,color .25s,box-shadow .25s}
.wish-btn:hover{transform:scale(1.08);background:var(--pink-600);color:#fff;box-shadow:0 10px 20px rgba(242,56,125,.22)}
.product-title{transition:color .25s}
.product-card:hover .product-title{color:var(--pink-700)}
.price{letter-spacing:-.02em}
.product-actions .btn{transition:transform .3s var(--ease-spring),box-shadow .3s ease,background .3s ease}
.product-actions .btn:active{transform:translateY(1px) scale(.985)}

/* Order flow, lookbook, CTA */
.order-flow{box-shadow:0 34px 82px rgba(91,45,146,.25);background-size:180% 180%;animation:flowGradient 14s ease infinite}
.order-flow::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 85% 30%,rgba(255,255,255,.12),transparent 22%),radial-gradient(circle at 18% 90%,rgba(255,255,255,.09),transparent 25%)}
@keyframes flowGradient{50%{background-position:100% 50%}}
.flow-step{position:relative;z-index:1;transition:transform .36s var(--ease-spring),background .3s,border-color .3s}
.flow-step:hover{transform:translateX(5px);background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.2)}
.step-no{transition:transform .36s var(--ease-spring)}
.flow-step:hover .step-no{transform:rotate(-6deg) scale(1.06)}
.lookbook figure{box-shadow:0 14px 34px rgba(63,32,56,.08);transition:transform .45s var(--ease-spring),box-shadow .4s}
.lookbook figure:hover{transform:translateY(-5px);box-shadow:0 25px 56px rgba(63,32,56,.14)}
.lookbook img{transition:transform .8s var(--ease-spring),filter .5s}
.lookbook figure:hover img{transform:scale(1.075);filter:saturate(1.05)}
.lookbook figcaption{transform:translateY(4px);transition:transform .35s var(--ease-spring)}
.lookbook figure:hover figcaption{transform:none}
.cta-band{box-shadow:0 18px 50px rgba(95,43,82,.08);transition:transform .4s var(--ease-spring),box-shadow .4s ease}
.cta-band:hover{transform:translateY(-3px);box-shadow:0 28px 70px rgba(95,43,82,.12)}
.cta-band::before{content:"";position:absolute;inset:-120% auto -120% -25%;width:15%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);transform:rotate(20deg);animation:ctaShine 8s ease-in-out infinite}
@keyframes ctaShine{0%,62%{left:-25%}84%,100%{left:120%}}

/* Inner pages */
.page-hero{position:relative;overflow:hidden;isolation:isolate}
.page-hero::before,.page-hero::after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(4px);pointer-events:none}
.page-hero::before{width:310px;height:310px;right:-85px;top:-145px;background:radial-gradient(circle,#e9dcff 0,#f5ecff 50%,transparent 72%);animation:pageOrb 8s ease-in-out infinite}
.page-hero::after{width:220px;height:220px;left:-80px;bottom:-150px;background:radial-gradient(circle,#ffdce9 0,#fff0f6 52%,transparent 72%);animation:pageOrb 10s ease-in-out infinite reverse}
.page-hero .container{opacity:0;transform:translateY(18px);transition:opacity .75s ease,transform .85s var(--ease-spring)}
.page-ready .page-hero .container{opacity:1;transform:none}
@keyframes pageOrb{50%{transform:translateY(16px) scale(1.05)}}
.shop-toolbar{position:sticky;top:142px;z-index:18;padding:12px;border-radius:18px;background:rgba(255,255,255,.82);border:1px solid rgba(238,230,236,.82);backdrop-filter:blur(18px);box-shadow:0 12px 35px rgba(80,38,69,.06)}
.search-wrap input{background:rgba(255,255,255,.9);transition:border-color .25s,box-shadow .25s,transform .25s}
.search-wrap input:focus{border-color:var(--pink-300);box-shadow:0 0 0 4px rgba(255,95,153,.08);transform:translateY(-1px)}
.chip{transition:transform .28s var(--ease-spring),box-shadow .28s,background .28s,color .28s,border-color .28s}
.chip:hover{transform:translateY(-2px);border-color:var(--pink-300);box-shadow:0 8px 18px rgba(98,43,81,.07)}
.chip.active{box-shadow:0 10px 23px rgba(242,56,125,.2)}
.about-image{position:relative;overflow:hidden}
.about-image::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 28%,rgba(255,255,255,.2) 44%,transparent 60%);transform:translateX(-130%);animation:imageShine 9s ease-in-out infinite}
@keyframes imageShine{0%,65%{transform:translateX(-130%)}85%,100%{transform:translateX(130%)}}
.value-card,.contact-card,.contact-form{transition:transform .4s var(--ease-spring),box-shadow .4s,border-color .3s}
.value-card:hover,.contact-card:hover,.contact-form:hover{transform:translateY(-5px);border-color:rgba(255,95,153,.2);box-shadow:0 25px 56px rgba(85,38,73,.11)}
.contact-row{transition:transform .3s var(--ease-spring),border-color .3s,background .3s,box-shadow .3s}
.contact-row:hover{transform:translateX(5px);border-color:var(--pink-200);background:#fff;box-shadow:0 10px 25px rgba(82,39,70,.07)}

/* Product modal */
.product-modal-overlay{transition:opacity .3s ease,visibility .3s;background:rgba(29,20,31,.56);backdrop-filter:blur(10px)}
.product-modal{opacity:0;transform:translateY(24px) scale(.97);transition:opacity .35s ease,transform .45s var(--ease-spring);border:1px solid rgba(255,255,255,.65);box-shadow:0 40px 120px rgba(42,24,38,.3)}
.product-modal-overlay.show .product-modal{opacity:1;transform:none}
.product-modal-main{position:relative;background:linear-gradient(145deg,#fff7fa,#f8f2ff);box-shadow:inset 0 0 0 1px rgba(255,255,255,.8)}
.product-modal-main img{transition:opacity .2s ease,transform .45s var(--ease-spring)}
.product-modal-main.switching img{opacity:.15;transform:scale(.98)}
.product-thumbs button{transition:transform .28s var(--ease-spring),border-color .25s,box-shadow .25s}
.product-thumbs button:hover{transform:translateY(-2px)}
.product-thumbs button.active{border-color:var(--pink-500);box-shadow:0 7px 18px rgba(242,56,125,.14)}
.product-modal-close{transition:transform .3s var(--ease-spring),background .25s}
.product-modal-close:hover{transform:rotate(6deg) scale(1.05);background:#fff}

/* Cart + floating actions */
.cart-drawer{transition:transform .45s var(--ease-spring);border-left:1px solid rgba(236,226,233,.9)}
.cart-overlay{backdrop-filter:blur(7px)}
.cart-item{transition:background .25s,transform .28s var(--ease-spring);border-radius:14px;padding-inline:8px}
.cart-item:hover{background:#fff8fb;transform:translateX(-2px)}
.cart-count.bump{animation:cartBump .42s var(--ease-spring)}
@keyframes cartBump{40%{transform:scale(1.35) rotate(-8deg)}100%{transform:none}}
.floating-whatsapp{animation:waFloat 3.8s ease-in-out infinite;box-shadow:0 16px 35px rgba(10,169,95,.24)}
@keyframes waFloat{50%{transform:translateY(-5px)}}
.toast{box-shadow:0 14px 40px rgba(35,24,35,.2);backdrop-filter:blur(12px)}

/* Footer */
.site-footer{position:relative;overflow:hidden;background:radial-gradient(circle at 12% 0,rgba(255,95,153,.11),transparent 30%),radial-gradient(circle at 95% 30%,rgba(121,74,179,.17),transparent 30%),#211a2d}
.site-footer::after{content:"";position:absolute;right:-70px;bottom:-120px;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.04)}
.footer-links a,.socials a{transition:transform .25s,color .25s,background .25s,border-color .25s}
.footer-links a:hover{transform:translateX(3px)}
.socials a:hover{transform:translateY(-3px);background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.14)}

/* Responsive polish */
@media(max-width:980px){
  .site-header.scrolled .header-main{min-height:76px}
  .shop-toolbar{top:135px}
  .hero-art{--mx:0!important;--my:0!important}
}
@media(max-width:760px){
  html{scroll-padding-top:110px}
  body::before{opacity:.14;background-size:auto,28px 28px}
  .site-header.scrolled .header-main{min-height:62px}
  .shop-toolbar{position:relative;top:auto;padding:8px;border-radius:15px}
  .hero-shell{transform:translateY(8px)}
  .hero-photo.main,.hero-photo.secondary,.hero-photo.third,.hero-sticker{translate:none!important}
  .hero-orb{animation:none}
  .product-card:hover{transform:translateY(-4px)}
  .product-media::before{display:none}
  .reveal{filter:none;transform:translateY(18px)}
  .mobile-bottom-bar{transition:transform .35s var(--ease-spring),box-shadow .3s}
  .mobile-bottom-bar:hover{box-shadow:0 20px 52px rgba(55,28,49,.19)}
  .floating-whatsapp{animation:none}
  .product-modal{transform:translateY(36px) scale(.99)}
  .product-modal-overlay.show .product-modal{transform:none}
}
@media(prefers-reduced-motion:reduce){
  .announcement,.announcement::after,.hero-orb,.hero-sticker,.order-flow,.cta-band::before,.about-image::after,.floating-whatsapp,.page-hero::before,.page-hero::after{animation:none!important}
  .hero-shell,.hero-copy-box .eyebrow,.hero-copy-box h1,.hero-copy-box .hero-kicker,.hero-copy-box .hero-copy,.hero-copy-box .hero-actions,.hero-copy-box .hero-benefits,.page-hero .container{opacity:1!important;transform:none!important}
}

/* Lightweight catalogue loading state */
.product-skeleton{border:1px solid #f0e7ed;border-radius:22px;overflow:hidden;background:#fff;box-shadow:0 10px 30px rgba(83,44,72,.045)}
.product-skeleton-media{aspect-ratio:1;background:linear-gradient(100deg,#fff5f9 25%,#fff 42%,#f6effb 58%,#fff5f9 75%);background-size:260% 100%;animation:skeletonSweep 1.45s ease-in-out infinite}
.product-skeleton-body{padding:14px;display:grid;gap:8px}.product-skeleton-body i{display:block;height:11px;border-radius:99px;background:#f4edf2}.product-skeleton-body i:nth-child(1){width:82%}.product-skeleton-body i:nth-child(2){width:48%}.product-skeleton-body i:nth-child(3){width:36%;height:14px;margin-top:4px;background:#f9dce8}
@keyframes skeletonSweep{to{background-position:-160% 0}}
@media(max-width:760px){.product-skeleton{border-radius:17px}.product-skeleton-body{padding:10px}}
@media(prefers-reduced-motion:reduce){.product-skeleton-media{animation:none}}