/* ==========================================================================
   Niccodome — polish layer (3.22.0)
   Loads after app.css. Spacing, header scale, testimonial carousel, cards.
   ========================================================================== */

/* 1. Header → first section: 20px on desktop. */
@media (min-width:768px){
	#ncd-main{padding-top:20px}
	.ncd-home>.ncd-hero:first-child,.ncd-home>*:first-child{margin-top:0}
}

/* 2. Desktop header: a touch larger, still airy. */
@media (min-width:768px){
	header[data-purpose="site-navigation-header"] .ncd-shell{height:5.5rem}
	header[data-purpose="site-navigation-header"] .ncd-nav{font-size:15px;letter-spacing:.02em}
	header[data-purpose="site-navigation-header"] .ncd-nav>li>a,header[data-purpose="site-navigation-header"] .ncd-nav>a{padding-left:.9rem;padding-right:.9rem}
	header[data-purpose="site-navigation-header"] .ncd-nav svg{width:1rem;height:1rem}
	header[data-purpose="site-navigation-header"] svg.w-5{width:1.5rem;height:1.5rem}
	header[data-purpose="site-navigation-header"] svg.w-4{width:1.25rem;height:1.25rem}
	header[data-purpose="site-navigation-header"] [data-purpose="brand-logo"] svg,header[data-purpose="site-navigation-header"] [data-purpose="brand-logo"] img{height:2.4rem;width:auto}
	header[data-purpose="site-navigation-header"] .space-x-4>:not([hidden])~:not([hidden]){margin-left:1.25rem}
	header[data-purpose="site-navigation-header"] .lg\:space-x-6>:not([hidden])~:not([hidden]){margin-left:1.5rem}
	header[data-purpose="site-navigation-header"] [data-open="#searchModal"]{width:14rem}
	header[data-purpose="site-navigation-header"] [data-open="#searchModal"]>div{font-size:.85rem;padding-top:.6rem;padding-bottom:.6rem;padding-left:1rem}
	header[data-purpose="site-navigation-header"] [data-open="#searchModal"] svg{width:1.05rem;height:1.05rem;top:.7rem;right:.9rem}
	header[data-purpose="site-navigation-header"] [data-currency] , header[data-purpose="site-navigation-header"] .ncd-currency{font-size:.9rem}
}

/* 3. Testimonials: one carousel, every width. */
.ncd-quotes__head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}
.ncd-quotes__head>div:first-child{text-align:left}
.ncd-quotes__nav{display:flex;gap:.5rem;flex:none}
.ncd-quotes__btn{width:2.75rem;height:2.75rem;border-radius:9999px;border:1px solid #e2e8f0;background:#fff;color:#0f172a;display:grid;place-items:center;transition:background .15s,transform .15s}
.ncd-quotes__btn:hover{background:#f1f5f9}.ncd-quotes__btn:active{transform:scale(.94)}
.dark .ncd-quotes__btn{background:#161925;border-color:#2a2e3f;color:#f8fafc}.dark .ncd-quotes__btn:hover{background:#1e293b}
.ncd-quotes__track{display:flex;gap:1.25rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;overscroll-behavior-x:contain;padding:4px;margin:-4px}
.ncd-quote{flex:0 0 100%;scroll-snap-align:start;margin:0;background:#fff;border:1px solid #f1f5f9;border-radius:1.5rem;padding:1.5rem 1.6rem;box-shadow:0 1px 2px rgba(0,0,0,.05);display:flex;flex-direction:column;gap:.9rem;min-height:190px}
.dark .ncd-quote{background:#161925;border-color:#2a2e3f}
@media (min-width:640px){.ncd-quote{flex-basis:calc((100% - 1.25rem)/2)}}
@media (min-width:1024px){.ncd-quote{flex-basis:calc((100% - 2.5rem)/3)}}
.ncd-quote__stars{display:flex;gap:2px;color:#fbbf24}.ncd-quote__stars svg{width:1.1rem;height:1.1rem}
.ncd-quote__text{font-size:.95rem;line-height:1.6;color:#334155;flex:1}.dark .ncd-quote__text{color:#cbd5e1}
.ncd-quote__name{display:flex;align-items:center;gap:.6rem;font-size:.8rem;font-weight:800;color:#0f172a}.dark .ncd-quote__name{color:#fff}
.ncd-quote__avatar{width:2rem;height:2rem;border-radius:9999px;display:grid;place-items:center;font-size:.8rem;font-weight:900;color:#fff;background:linear-gradient(135deg,#9333ea,#4f46e5)}
.ncd-quotes__dots{display:flex;justify-content:center;gap:.4rem;margin-top:1.25rem}
.ncd-quotes__dots button{width:.5rem;height:.5rem;border-radius:9999px;background:#cbd5e1;border:0;padding:0;transition:width .25s,background .25s}
.ncd-quotes__dots button.is-on{width:1.5rem;background:#9333ea}
.dark .ncd-quotes__dots button{background:#334155}.dark .ncd-quotes__dots button.is-on{background:#c084fc}

/* 4. Product cards: room to breathe, product floats on the tint, clearer price. */
.ncd-card--v2{padding:.9rem;gap:0}
@media (min-width:640px){.ncd-card--v2{padding:1.1rem}}
.ncd-card--v2>a.aspect-square{padding:11%;margin-bottom:.9rem;border-radius:1.25rem}
.ncd-card--v2 .ncd-card__img{object-fit:contain;filter:drop-shadow(0 12px 18px rgba(15,23,42,.14))}
.ncd-card--v2 .ncd-card__title{min-height:2.6em}
.ncd-card--v2 .ncd-card__title a:hover{color:#7e22ce}.dark .ncd-card--v2 .ncd-card__title a:hover{color:#c084fc}
.ncd-card--v2>div:first-child>p{min-height:0}
.ncd-card--v2>div:last-child{margin-top:1rem;padding-top:.85rem;gap:.6rem}
.ncd-card--v2 .ncd-card-price{font-size:1rem;font-weight:900;letter-spacing:-.01em}
.ncd-card--v2 .ncd-from{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#64748b;margin-right:.15rem}
.dark .ncd-card--v2 .ncd-from{color:#94a3b8}
.ncd-card--v2 [data-add-to-cart],.ncd-card--v2 [data-quick-view],.ncd-card--v2>div:last-child a.rounded-full{padding:.55rem 1.1rem;font-size:.72rem;letter-spacing:.06em;border-radius:9999px}
.ncd-card--v2 .ncd-card-wish{top:1rem;right:1rem;width:2.4rem;height:2.4rem}
@media (min-width:640px){.ncd-card--v2 .ncd-card-wish{top:1.25rem;right:1.25rem}}
.ncd-card--v2:hover{border-color:#e9d5ff}
.dark .ncd-card--v2:hover{border-color:#4c1d95}
.products{gap:1rem}@media (min-width:640px){.products{gap:1.4rem}}


/* 5. Notices: inline close button, no duplicate pseudo-icon. */
.ncd-notice{position:relative;align-items:center}
.ncd-notice .ncd-notice__text{flex:1;min-width:0}
.ncd-notice__close{flex:none;width:2rem;height:2rem;border-radius:9999px;display:grid;place-items:center;background:transparent;border:0;color:inherit;opacity:.65;cursor:pointer;transition:opacity .15s,background .15s}
.ncd-notice__close:hover{opacity:1;background:rgba(0,0,0,.06)}
.ncd-notice.is-dismissed{animation:ncdNoticeOut .22s ease forwards}
@keyframes ncdNoticeOut{to{opacity:0;transform:translateY(-6px);height:0;padding-top:0;padding-bottom:0;margin:0;overflow:hidden}}

/* 6. Light / dark logo swap. */
.ncd-logo--dark{display:none}
.dark .ncd-logo--dark{display:block}
.dark .ncd-logo--light{display:none}

/* 7. Motion: content and cards settle in; routed pages fade. */
@media (prefers-reduced-motion:no-preference){
	.products>li,.ncd-row>li,.ncd-rail>li{animation:ncdRise .55s cubic-bezier(.2,.7,.2,1) both}
	.products>li:nth-child(2),.ncd-row>li:nth-child(2){animation-delay:40ms}
	.products>li:nth-child(3),.ncd-row>li:nth-child(3){animation-delay:80ms}
	.products>li:nth-child(4),.ncd-row>li:nth-child(4){animation-delay:120ms}
	.products>li:nth-child(5),.ncd-row>li:nth-child(5){animation-delay:160ms}
	.products>li:nth-child(6),.ncd-row>li:nth-child(6){animation-delay:200ms}
	.products>li:nth-child(7),.ncd-row>li:nth-child(7){animation-delay:240ms}
	.products>li:nth-child(8),.ncd-row>li:nth-child(8){animation-delay:280ms}
	.products>li:nth-child(n+9),.ncd-row>li:nth-child(n+9){animation-delay:320ms}
	#ncd-main.is-entering{animation:ncdFade .32s ease both}
	#ncd-main.is-leaving{opacity:.55;transition:opacity .25s ease}
	.ncd-card--v2 .ncd-card__img{transition:transform .5s cubic-bezier(.2,.7,.2,1)}
	.ncd-card--v2:hover .ncd-card__img{transform:translateY(-4px) scale(1.04)}
	.btn,.ncd-partners__btn,[data-add-to-cart],[data-quick-view]{transition:transform .15s ease,box-shadow .2s ease,background-color .2s ease}
	.btn:hover,[data-add-to-cart]:hover,[data-quick-view]:hover{transform:translateY(-1px)}
}
@keyframes ncdRise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes ncdFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* 8. Skeleton while a routed page is loading (router adds .is-leaving while fetching). */
#ncd-main.is-leaving{position:relative}
#ncd-main.is-leaving::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);background-size:200% 100%;animation:ncdShimmer 1.1s linear infinite;pointer-events:none;border-radius:1.5rem}
.dark #ncd-main.is-leaving::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);background-size:200% 100%}
@keyframes ncdShimmer{to{background-position:-200% 0}}
.sk{background:linear-gradient(90deg,#eef0f5 25%,#f6f7fb 50%,#eef0f5 75%);background-size:200% 100%;animation:ncdShimmer 1.4s linear infinite}
.dark .sk{background:linear-gradient(90deg,#222638 25%,#2a2e3f 50%,#222638 75%);background-size:200% 100%}

/* 9. Assurance cards: a swipe carousel below 900px, side by side above. */
@media (max-width:899px){
	.ncd-assure{display:flex;gap:.75rem;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px;margin:-4px}
	.ncd-assure::-webkit-scrollbar{display:none}
	.ncd-assure__item{flex:0 0 86%;scroll-snap-align:start}
}
/* 10. Login card: partner banner + centred legal line. */
.nc-partner-strip{display:flex;align-items:center;gap:12px;margin:-4px 0 18px;padding:12px 14px;border-radius:14px;background:linear-gradient(135deg,#f5f0ff,#fdf6e3);border:1px solid #ead9ff;color:#321847}
.dark .nc-partner-strip{background:linear-gradient(135deg,#231634,#2a2412);border-color:#3b2a57;color:#f1e8ff}
.nc-partner-strip__text{flex:1;min-width:0;font-size:12.5px;line-height:1.4}
.nc-partner-strip__text strong{display:block;font-size:13.5px}
.nc-partner-strip__btn{flex:none;height:36px;padding:0 14px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#1a1206;background:linear-gradient(135deg,#f1dc9a,#c9a24a);text-decoration:none;display:inline-flex;align-items:center}
.nc-legal{text-align:center}
.nc-pass{position:relative}
.nc-pass input{padding-right:2.9rem}
.nc-pass__eye{position:absolute;right:.35rem;top:50%;transform:translateY(-50%);width:2.25rem;height:2.25rem;border-radius:999px;display:grid;place-items:center;border:0;background:transparent;color:#94a3b8;cursor:pointer}
.nc-pass__eye:hover{color:#334155;background:#f1f5f9}.dark .nc-pass__eye:hover{background:#1e293b;color:#e2e8f0}
.nc-pass__eye .eye-off{display:none}.nc-pass.is-shown .eye-off{display:block}.nc-pass.is-shown .eye-on{display:none}

/* 11. Mobile header logo: never wider than the bar allows. */
@media (max-width:767px){ header.md\:hidden .ncd-logo{width:auto!important;max-width:150px;max-height:40px;height:auto} }