/* Ready Forms Studio — final storefront polish */
.hero-preview[role="link"]{cursor:pointer}
.hero-preview[role="link"]:focus-visible{outline:3px solid rgba(18,59,45,.35);outline-offset:4px;border-radius:26px}

/* Exact page-based bundle slider. */
.bundle-slider-v2{max-width:var(--container);margin:0 auto;position:relative;padding:0 46px}
.bundle-slider-v2 .bundle-viewport{overflow:hidden;width:100%}
.bundle-track-v2{display:flex!important;grid-template-columns:none!important;gap:0!important;max-width:none!important;margin:0!important;width:100%!important;will-change:transform}
.bundle-page{flex:0 0 100%;min-width:100%;width:100%;padding:0}
.bundle-page-grid{display:grid;gap:18px;width:100%;align-items:stretch}
.bundle-page-grid.bundle-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.bundle-page-grid.bundle-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.bundle-page-grid.bundle-cols-1{grid-template-columns:1fr}
.bundle-page .bundle-card{width:100%;min-width:0;margin:0}

/* Footer payment logos. */
.payment-logos{display:flex!important;align-items:center;justify-content:flex-end;gap:9px!important;flex-wrap:wrap}
.payment-logo-card{display:inline-flex;align-items:center;justify-content:center;width:92px;height:40px;padding:4px 6px;border-radius:9px;background:#fff;border:1px solid rgba(255,255,255,.22);box-shadow:0 5px 16px rgba(0,0,0,.08)}
.payment-logo-card svg{display:block;width:100%;height:100%}
.etsy-shop-badge{font-weight:800;letter-spacing:.04em}

/* Make the promotional art feel like a real banner rather than empty decoration. */
.promo-visual{background:
  radial-gradient(circle at 85% 14%,rgba(178,138,58,.18),transparent 25%),
  radial-gradient(circle at 12% 88%,rgba(61,105,82,.16),transparent 28%),
  linear-gradient(145deg,#edf4ee,#fff9f0)!important}
.promo-visual:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 0 48%,rgba(255,255,255,.34) 49% 50%,transparent 51% 100%);opacity:.55}
.hero-copy,.hero-visual{min-width:0}

@media(max-width:1050px){
  .bundle-slider-v2{padding:0 42px}
}

@media(max-width:700px){
  html,body{max-width:100%;overflow-x:hidden}

  /* Compact visual carousel: artwork stays visible without making the page excessively tall. */
  body .hero-carousel{padding:12px 4.5vw 10px!important}
  body .hero-shell{position:relative!important;display:block!important;min-height:342px!important;height:342px!important;padding:22px 18px 18px!important;border-radius:22px!important;overflow:hidden!important}
  body .hero-copy{position:relative!important;z-index:4!important;width:78%!important;max-width:78%!important;padding:0 8px 0 18px!important}
  body .hero-copy h1{font-size:28px!important;line-height:1.03!important;margin:9px 0 11px!important;letter-spacing:-.035em!important}
  body .hero-copy p{font-size:13px!important;line-height:1.52!important;margin:0!important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  body .hero-actions{margin-top:14px!important}
  body .hero-actions .btn{width:auto!important;min-height:40px!important;padding:9px 14px!important;font-size:12px!important}
  body .trust-row{position:absolute!important;left:18px!important;right:18px!important;bottom:17px!important;z-index:5!important;margin:0!important;display:flex!important;gap:6px!important;overflow-x:auto!important;flex-wrap:nowrap!important;scrollbar-width:none}
  body .trust-row::-webkit-scrollbar{display:none}
  body .trust-row span{min-width:max-content!important;width:auto!important;padding:6px 8px!important;font-size:9px!important;background:rgba(255,255,255,.86)!important}
  body .hero-visual{display:block!important;position:absolute!important;right:-24px!important;bottom:43px!important;width:56%!important;height:168px!important;min-height:168px!important;z-index:2!important;opacity:.96!important}
  body .hero-preview{display:block!important;width:100%!important;height:100%!important;min-height:0!important}
  body .promo-visual{display:block!important;width:100%!important;height:100%!important;min-height:0!important;border-radius:18px!important;transform:scale(.96);transform-origin:center}
  body .hero-arrow{z-index:7!important;top:48%!important;width:30px!important;height:30px!important;font-size:20px!important;box-shadow:none!important}
  body .hero-arrow.prev{left:5px!important}
  body .hero-arrow.next{right:5px!important}
  body .hero-dots{margin:8px auto 0!important;gap:6px!important}
  body .hero-dot{width:8px!important;height:8px!important}

  /* Simplify tiny promo artwork so it stays legible on a phone. */
  body .promo-chip{font-size:8px!important;padding:5px 7px!important}
  body .promo-window{inset:18px 16px 22px!important;border-radius:14px!important}
  body .promo-sheet{padding:12px!important}
  body .sheet-title{font-size:14px!important;margin-bottom:9px!important}
  body .sheet-kpis b{font-size:7px!important;padding:7px 4px!important}
  body .sheet-lines{height:48px!important;margin-top:9px!important}
  body .finance-card{left:14px!important;right:28px!important;top:14px!important;bottom:18px!important;padding:12px!important;border-radius:15px!important}
  body .finance-top{font-size:14px!important}
  body .finance-numbers{margin:8px 0!important;gap:4px!important}
  body .finance-numbers span{padding:6px!important}
  body .finance-numbers b{font-size:12px!important}
  body .finance-bars{height:55px!important;padding:6px!important;gap:4px!important}
  body .calc-card{right:8px!important;bottom:9px!important;width:70px!important;padding:8px!important;border-radius:12px!important}
  body .calc-card b{font-size:16px!important;margin:3px 0!important}
  body .calc-card span{font-size:7px!important}
  body .client-board,body .ops-board{inset:14px 20px 18px 12px!important;padding:10px!important;border-radius:14px!important}
  body .board-head,body .ops-title{font-size:14px!important;margin-bottom:7px!important}
  body .client-row{padding:5px 0!important;font-size:7px!important;grid-template-columns:16px 1fr auto!important;gap:4px!important}
  body .client-row b{font-size:6px!important;padding:3px 5px!important}
  body .mini-invoice{right:6px!important;bottom:8px!important;width:68px!important;height:86px!important;padding:8px!important}
  body .mini-invoice span{height:4px!important;margin-top:7px!important}
  body .ops-columns{gap:4px!important}
  body .ops-columns>div{padding:6px!important}
  body .ops-columns b{font-size:6px!important}
  body .ops-columns span{height:21px!important;margin-top:4px!important}
  body .capacity-ring{right:5px!important;bottom:6px!important;width:52px!important;height:52px!important;border-width:4px!important}
  body .capacity-ring b{font-size:13px!important}
  body .capacity-ring span{font-size:6px!important}
  body .form-stack{width:92px!important;height:110px!important;padding:8px!important;border-radius:9px!important}
  body .form-stack b{font-size:7px!important}
  body .form-stack span{height:4px!important;margin-top:8px!important}
  body .forms .f3{left:10px!important;top:24px!important}.forms .f2{left:43px!important;top:18px!important}.forms .f1{left:78px!important;top:14px!important}
  body .print-badge{right:5px!important;bottom:7px!important;padding:5px 7px!important;font-size:7px!important}
  body .bundle-box{inset:17px 25px 20px 12px!important;padding:13px!important;border-radius:15px!important}
  body .bundle-ribbon{font-size:6px!important;padding:4px 6px!important}
  body .bundle-icons{gap:5px!important;margin:13px 0 10px!important}
  body .bundle-icons span{width:25px!important;height:25px!important;font-size:12px!important}
  body .bundle-box strong{font-size:14px!important}
  body .bundle-mini{font-size:7px!important;padding:5px 7px!important}.bundle-mini.m1{right:5px!important;top:18px!important}.bundle-mini.m2{right:6px!important;top:48px!important}.bundle-mini.m3{right:10px!important;top:78px!important}

  /* Exact one-card bundle pages. */
  body .bundle-slider-v2{padding:0 34px!important;max-width:100%!important}
  body .bundle-page-grid{grid-template-columns:1fr!important;gap:0!important}
  body .bundle-page{width:100%!important;min-width:100%!important;flex-basis:100%!important}
  body .bundle-arrow{width:30px!important;height:30px!important;font-size:21px!important}
  body .bundle-arrow.prev{left:0!important}.bundle-arrow.next{right:0!important}
  body .bundle-dots{margin-top:12px!important}

  /* Footer is centered and payment marks are true logo tiles. */
  body .site-footer{padding:28px 5vw 24px!important}
  body .footer-top{display:grid!important;grid-template-columns:1fr!important;gap:18px!important;text-align:center!important;margin-bottom:16px!important}
  body .footer-brand{max-width:100%!important;display:flex!important;flex-direction:column!important;align-items:center!important;text-align:center!important;gap:9px!important}
  body .footer-brand img{width:72px!important;height:72px!important}
  body .footer-brand strong{font-size:18px!important;line-height:1.15!important}
  body .footer-brand p{max-width:330px!important;margin:5px auto 0!important;font-size:11px!important}
  body .footer-etsy-block{width:100%!important;text-align:center!important}
  body .etsy-shop-badge{width:100%!important;max-width:340px!important;margin:0 auto!important;justify-content:center!important;gap:9px!important}
  body .footer-logos{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;text-align:center!important;padding:14px 0!important}
  body .footer-logos .logo-group{justify-content:center!important;width:100%!important}
  body .payment-logos{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;width:100%!important}
  body .payment-logos .logo-label{grid-column:1/-1!important;text-align:center!important}
  body .payment-logo-card{width:100%!important;height:43px!important}
  body .payment-logo-card:last-child{grid-column:1/-1!important;max-width:170px!important;justify-self:center!important}
  body .footer-bottom{display:flex!important;flex-direction:column!important;align-items:center!important;text-align:center!important;gap:7px!important;font-size:10px!important}
}

@media(max-width:390px){
  body .hero-shell{height:350px!important;min-height:350px!important;padding-left:14px!important;padding-right:14px!important}
  body .hero-copy{width:82%!important;max-width:82%!important;padding-left:16px!important}
  body .hero-copy h1{font-size:26px!important}
  body .hero-visual{width:59%!important;right:-30px!important}
}
