/* ============================================================
   RESPONSIVE FIX LAYER (site-wide: mobile / tablet / laptop / desktop)
   ============================================================ */
html,body{overflow-x:hidden!important;max-width:100vw}
img,video,iframe{max-width:100%;height:auto}
table{display:block;overflow-x:auto;max-width:100%}
@media (max-width:767px){
  h1,.elementor-heading-title.elementor-size-xxl{font-size:clamp(26px,7.5vw,40px)!important;line-height:1.2!important}
  h2{font-size:clamp(22px,6vw,32px)!important;line-height:1.25!important}
  h3{font-size:clamp(18px,5vw,26px)!important}
  .elementor-heading-title{word-break:break-word}
  .elementor-button{min-height:44px;padding:13px 26px!important}
  .elementor-section,.e-con{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}
  .elementor-widget:not(:last-child){margin-bottom:14px}
}
@media (min-width:768px) and (max-width:1024px){
  h1{font-size:clamp(32px,5vw,52px)!important}
  .elementor-button{min-height:44px}
}
/* very large screens (2K/4K): keep content contained, not stretched edge-to-edge */
@media (min-width:1920px){
  .ast-container,.elementor-section.elementor-section-boxed>.elementor-container{max-width:1700px!important;margin-left:auto!important;margin-right:auto!important}
}

/* ---------- brand logo: never clipped (mobile "R cut" fix) ----------
   Root cause: Astra .custom-logo-link is inline-block with line-height:15px while the SVG renders ~20px —
   the logo's bottom ~5px hangs below the branding box and gets covered by the row below.
   NOTE: header logo SIZE stays Astra's own (190px setting) — we only fix the clipping, not resize. */
.custom-logo-link{display:inline-flex!important;align-items:center!important;line-height:0!important;height:auto!important;overflow:visible!important}
.site-branding,.ast-site-identity{height:auto!important;overflow:visible!important}
.site-logo-img{line-height:0}
.site-header .custom-logo-link img{height:auto!important;object-fit:contain}
/* footer / Elementor image-box logos: never clipped */
.elementor-image-box-img img[src*="readymadeprint-logo"],.elementor-image-box-img img[data-src*="readymadeprint-logo"]{max-width:100%!important;width:auto!important;height:auto!important;object-fit:contain!important}
.elementor-image-box-img{overflow:visible!important;line-height:0}
.elementor-widget-image-box .elementor-image-box-wrapper{overflow:visible!important}
/* mobile: default Astra layout (logo LEFT — founder preferred it over centered, 2026-07-17); just keep clip-safe padding */
@media (max-width:921px){
  .site-branding{padding-top:6px!important;padding-bottom:6px!important}
}

/* ---------- product grids (New Arrival / Bestsellers / shop): stable cards, no layout shift ---------- */
ul.products li.product img{width:100%!important;height:auto!important;aspect-ratio:1/1;object-fit:cover}
ul.products li.product{min-width:0}
@media (max-width:480px){
  ul.products{grid-template-columns:repeat(2,1fr)!important;column-gap:12px!important}
  ul.products li.product{width:100%!important}
}

/* ============================================================
   SCROLL PROGRESS BAR (site-wide)
   ============================================================ */
#rmp3d-prog{position:fixed;top:0;left:0;height:3px;width:0;z-index:100000;background:linear-gradient(90deg,#ff2b45,#f5b942,#127a5f);border-radius:0 3px 3px 0;box-shadow:0 0 12px rgba(255,43,69,.45);transition:width .08s linear;pointer-events:none}

/* ============================================================
   CURSOR SPOTLIGHT (desktop, fine pointer only)
   ============================================================ */
#rmp3d-spot{position:fixed;width:560px;height:560px;border-radius:50%;pointer-events:none;z-index:1;
  background:radial-gradient(circle,rgba(255,43,69,.075),rgba(18,122,95,.04) 45%,transparent 70%);
  transform:translate(-50%,-50%);left:-600px;top:-600px;will-change:left,top;mix-blend-mode:multiply}
@media (hover:none),(pointer:coarse),(max-width:1023px){#rmp3d-spot{display:none}}

/* ============================================================
   FLOATING GRADIENT ORBS + GRAIN (home only)
   ============================================================ */
#rmp3d-orbs{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.rmp3d-orb{position:absolute;border-radius:50%;filter:blur(70px);opacity:.35;will-change:transform}
.rmp3d-orb.o1{width:420px;height:420px;background:radial-gradient(circle,#ff2b45,transparent 65%);top:-90px;left:-110px;animation:rmp3d-d1 22s ease-in-out infinite}
.rmp3d-orb.o2{width:380px;height:380px;background:radial-gradient(circle,#127a5f,transparent 65%);top:44%;right:-130px;animation:rmp3d-d2 26s ease-in-out infinite}
.rmp3d-orb.o3{width:300px;height:300px;background:radial-gradient(circle,#f5b942,transparent 65%);bottom:-80px;left:30%;animation:rmp3d-d3 30s ease-in-out infinite}
@keyframes rmp3d-d1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(70px,50px) scale(1.15)}}
@keyframes rmp3d-d2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-60px,-70px) scale(1.1)}}
@keyframes rmp3d-d3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(50px,-40px) scale(1.2)}}
#rmp3d-grain{position:fixed;inset:0;pointer-events:none;z-index:2;opacity:.028;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}
body>div,#page,.site,main{position:relative;z-index:1}

/* ============================================================
   3D SCROLL ENTRANCES (site-wide, hero excluded)
   ============================================================ */
.rmp3d-reveal{opacity:0;transform:perspective(1000px) translateY(44px) rotateX(7deg) scale(.98);transition:opacity .85s cubic-bezier(.16,.8,.3,1),transform .85s cubic-bezier(.16,.8,.3,1);will-change:opacity,transform}
.rmp3d-reveal.rmp3d-in{opacity:1;transform:none}

/* ============================================================
   3D TILT + GLASS HOVER on cards/images
   ============================================================ */
.rmp3d-tilt{transform-style:preserve-3d;will-change:transform;transition:transform .3s ease,box-shadow .3s ease;position:relative}
.rmp3d-tilt.rmp3d-live{transition:transform .06s linear}
.rmp3d-tilt:hover{box-shadow:0 26px 64px rgba(0,0,0,.18)}
.rmp3d-tilt::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s ease;
  background:linear-gradient(115deg,rgba(255,255,255,.16),transparent 42%,transparent 62%,rgba(255,255,255,.09));}
.rmp3d-tilt:hover::after{opacity:1}

/* ---------- buttons: magnetic + lift + sheen ---------- */
.elementor-button{position:relative;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease!important;will-change:transform}
.elementor-button:hover{box-shadow:0 14px 34px rgba(255,43,69,.32)!important}
.elementor-button:after{content:'';position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .55s ease}
.elementor-button:hover:after{left:130%}

/* ---------- hero float + headline shimmer (home) ---------- */
.rmp3d-float{animation:rmp3d-float 6s ease-in-out infinite}
@keyframes rmp3d-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.rmp3d-hline{background:linear-gradient(90deg,#ff2b45,#f5b942,#127a5f,#ff2b45);background-size:300% 3px;background-repeat:no-repeat;background-position:0 100%;animation:rmp3d-hline 6s linear infinite;padding-bottom:6px}
@keyframes rmp3d-hline{0%{background-position:0 100%}100%{background-position:300% 100%}}

@media (prefers-reduced-motion:reduce){
  #rmp3d-orbs,#rmp3d-grain,#rmp3d-spot,.rmp3d-float{display:none;animation:none}
  .rmp3d-reveal{opacity:1;transform:none;transition:none}
  .rmp3d-tilt{transform:none!important}
  .elementor-button:after{display:none}
  #rmp3d-prog{display:none}
}
@media (max-width:768px){.rmp3d-orb{filter:blur(50px);opacity:.25}#rmp3d-grain{opacity:.02}}