/* Lady Confectionery — global styles (ported from Lady Confectionery.dc.html) */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Manrope,system-ui,sans-serif;color:#222;background:#fff;-webkit-font-smoothing:antialiased}
a{color:#DC0B19;text-decoration:none}
a:hover{color:#AA2223}
button{font-family:inherit}
input,select,textarea{font-family:Manrope,sans-serif}
::selection{background:#FDCC03;color:#5A3B00}
@keyframes floatA{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-22px) rotate(3deg)}}
@keyframes floatB{0%,100%{transform:translateY(0) rotate(6deg)}50%{transform:translateY(-16px) rotate(-4deg)}}
@keyframes floatC{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-28px) rotate(2deg)}}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes marqueeRev{0%{transform:translateX(-50%)}100%{transform:translateX(0)}}
@keyframes spinSlow{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
@keyframes floatD{0%,100%{transform:translateY(0) rotate(9deg)}50%{transform:translateY(-26px) rotate(-5deg)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-15px)}}
.lady-float{will-change:transform}
.lady-cut{filter:drop-shadow(0 22px 26px rgba(0,0,0,.28));will-change:transform}
@media (prefers-reduced-motion: reduce){.lady-float,.lady-marquee,.lady-cut{animation:none !important}}

/* Arabic / RTL */
.lady-ar,.lady-ar button,.lady-ar input,.lady-ar select,.lady-ar textarea,.lady-ar h1,.lady-ar h2,.lady-ar h3,.lady-ar p,.lady-ar label,.lady-ar span,.lady-ar div,.lady-ar a{font-family:'Cairo',sans-serif !important}
.lady-ar [dir],.lady-ar{letter-spacing:normal !important}
.lady-ar [style*="text-align:left"]{text-align:right !important}
.lady-ar .lady-marquee{direction:ltr !important;animation:marqueeRev 26s linear infinite !important}
.lady-ar .lady-footer-grid a{text-align:right}
.lady-ar .lady-footer-grid button{text-align:right !important}

/* hover / focus states (style-hover / style-focus ports) */
.hv-nav:hover{background:#FDCC03 !important;color:#5A3B00 !important}
.hv-cta:hover{background:#FFD82E !important;transform:translateY(-1px)}
.hv-spring:hover{transform:translateY(3px);box-shadow:0 9px 0 #B98A00 !important}
.hv-ghost:hover{background:rgba(255,255,255,.14) !important}
.hv-ghost2:hover{background:rgba(255,255,255,.2) !important}
.hv-cat:hover{transform:translateY(-6px) rotate(-1deg);box-shadow:0 26px 40px -22px rgba(0,0,0,.5)}
.hv-dark:hover{background:#000 !important}
.hv-redline:hover{border-color:#DC0B19 !important}
.hv-prod:hover{transform:translateY(-6px);box-shadow:0 26px 46px -22px rgba(34,34,34,0.45) !important}
.hv-imgzoom:hover{transform:scale(1.06)}
.hv-reddark:hover{background:#AA2223 !important}
.hv-quotebtn:hover{background:#FFF4F4 !important;border-color:#DC0B19 !important}
.hv-redtext:hover{color:#DC0B19 !important}
.hv-lift:hover{transform:translateY(-2px)}
.hv-social:hover{background:#DC0B19 !important;transform:translateY(-2px)}
.hv-maroon:hover{color:#AA2223 !important}
.fc-red:focus{border-color:#DC0B19 !important}

/* responsive */
@media (max-width: 920px){
  .lady-desktop-nav{display:none !important}
  .lady-burger{display:block !important}
  .lady-cat-grid{grid-template-columns:repeat(2,1fr) !important}
  .lady-prod-grid{grid-template-columns:repeat(2,1fr) !important}
  .lady-story-grid{grid-template-columns:1fr !important}
  .lady-detail-grid{grid-template-columns:1fr !important}
  .lady-detail-gallery{position:static !important}
  .lady-quote-grid{grid-template-columns:1fr !important}
  .lady-footer-grid{grid-template-columns:1fr 1fr !important;gap:28px !important}
  .lady-sticky-quote{display:block !important}
  .lady-detail-cta{display:none !important}
  .lady-cut-extra{display:none !important}
}
@media (max-width: 560px){
  .lady-cut{width:96px !important}
  .lady-cat-grid{grid-template-columns:1fr !important}
  .lady-prod-grid{grid-template-columns:1fr !important}
  .lady-field-grid{grid-template-columns:1fr !important}
  .lady-footer-grid{grid-template-columns:1fr !important}
  .lady-lang{display:none !important}
}

/* hero slider */
.lady-hero-track{transition:transform .65s cubic-bezier(.65,.05,.3,1)}
.lady-hero-arrow:hover{background:rgba(255,255,255,.3) !important}
@media (prefers-reduced-motion: reduce){.lady-hero-track{transition:none}}
@media (max-width: 920px){
  .lady-hero-grid{grid-template-columns:1fr !important;padding:112px 24px 124px !important;gap:12px !important;min-height:0 !important}
  .lady-hero-copy{grid-column:1 !important;grid-row:2 !important;align-items:center !important;text-align:center;padding:0 !important}
  .lady-hero-stage{grid-column:1 !important;grid-row:1 !important;min-height:300px !important}
  .lady-hero-img{width:min(230px,60%) !important;max-height:260px !important}
  .lady-orbit{width:62px !important}
  .lady-hero-arrow{display:none !important}
}
/* Stacking three tall cards eats most of a phone screen, so lay each one out
   as a row instead: icon, figure, label. text-align:start and the natural flex
   direction keep it mirrored in Arabic. */
@media (max-width: 560px){
  .lady-stats-grid{grid-template-columns:1fr !important;gap:12px !important}
  .lady-stat{display:flex !important;align-items:center !important;gap:14px !important;
             padding:14px 18px !important;text-align:start !important}
  .lady-stat-ico{flex:none !important;margin:0 !important;width:44px !important;height:44px !important;border-radius:13px !important}
  .lady-stat > div:nth-child(2){flex:none;font-size:30px !important}
  .lady-stat > div:nth-child(3){margin-top:0 !important}
}

/* oversized hanging logo */
@media (max-width: 560px){
  .lady-logo{height:78px !important}
}

/* products dropdown */
.lady-navwrap:hover .lady-dropdown,
.lady-navwrap:focus-within .lady-dropdown{opacity:1 !important;visibility:visible !important;transform:translateX(-50%) translateY(0) !important}
.lady-dditem:hover{background:#FAF5F2 !important}
.lady-ar .lady-dditem{text-align:right !important}

/* accessibility */
.lady-skip{position:fixed;top:0;left:0;z-index:200;background:#DC0B19;color:#fff;font-family:Manrope,sans-serif;font-weight:800;font-size:14px;padding:12px 18px;border-radius:0 0 12px 0;transform:translateY(-150%);transition:transform .15s ease}
.lady-skip:focus{transform:translateY(0);color:#fff}
:focus-visible{outline:3px solid #FDCC03;outline-offset:2px;border-radius:6px}
#main:focus{outline:none}
#lady-totop:hover{background:#AA2223}

/* blog */
.lady-post-body p:last-child{margin-bottom:0}

/* product gallery thumb strip */
.lady-detail-gallery{min-width:0}
.lady-thumbs{scrollbar-width:thin;scrollbar-color:#DCD3CD transparent;-webkit-overflow-scrolling:touch}
.lady-thumbs::-webkit-scrollbar{height:6px}
.lady-thumbs::-webkit-scrollbar-thumb{background:#DCD3CD;border-radius:99px}
.lady-thumbs::-webkit-scrollbar-track{background:transparent}
/* belt-and-braces: never let a stray element create a sideways scroll (clip keeps sticky working) */
#app{overflow-x:clip}
