.devotional-pin-badges-page{background:#030916;color:#f5f7fb}
.devotional-pin-badges-hero{padding-top:10px}
.devotional-pin-badges-hero-frame{overflow:hidden;border:1px solid rgba(80,190,255,.22);border-radius:24px;box-shadow:0 28px 80px rgba(0,0,0,.42)}
.devotional-pin-badges-hero-frame img{display:block;width:100%;height:auto}
.catalogue-section{padding-top:72px}
.collection-filters{display:flex;gap:10px;overflow-x:auto;padding:4px 0 18px;scrollbar-width:none}
.collection-filters::-webkit-scrollbar{display:none}
.filter-chip{white-space:nowrap;border:1px solid rgba(79,183,255,.28);background:rgba(8,23,45,.82);color:#dce8f6;border-radius:999px;padding:11px 17px;cursor:pointer;font-weight:700}
.filter-chip:hover,.filter-chip.is-active{border-color:#20a8ff;background:linear-gradient(180deg,#138ff0,#075aae);color:white;box-shadow:0 0 24px rgba(32,168,255,.2)}
.catalogue-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:12px 0 28px}
.catalogue-summary{display:flex;flex-direction:column;gap:5px}
.catalogue-summary span{color:#9fb0c5;font-size:.9rem}
.sort-control select{min-width:210px;padding:12px 40px 12px 14px;border:1px solid rgba(79,183,255,.3);border-radius:9px;background:#07162b;color:#f5f7fb}
.designer-product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.designer-card{position:relative;overflow:hidden;border:1px solid rgba(125,165,205,.25);border-radius:21px;background:linear-gradient(165deg,rgba(11,30,57,.97),rgba(3,11,25,.98));box-shadow:0 20px 44px rgba(0,0,0,.3);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.designer-card:hover{transform:translateY(-7px);border-color:#1e90ff;box-shadow:0 0 34px rgba(30,144,255,.32),0 22px 50px rgba(0,0,0,.45)}
.product-media{position:relative;aspect-ratio:1/1;overflow:hidden;background:radial-gradient(circle at 50% 60%,rgba(28,110,190,.28),transparent 62%)}
.product-media img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.designer-card:hover .product-media img{transform:scale(1.04)}
.product-badge{position:absolute;left:14px;top:14px;border:1px solid rgba(80,190,255,.45);border-radius:7px;padding:6px 10px;background:rgba(3,15,32,.86);font-size:.7rem;font-weight:800;letter-spacing:.06em}
.product-badge.best{border-color:#f3b64d;color:#ffd477}
.wishlist,.quick-view{position:absolute;right:13px;width:42px;height:42px;border:1px solid rgba(255,255,255,.24);border-radius:50%;background:rgba(2,10,23,.78);color:#fff;font-size:1.25rem;cursor:pointer}
.wishlist{top:13px}.quick-view{top:64px;opacity:0;transform:translateX(8px);transition:.25s ease}
.designer-card:hover .quick-view{opacity:1;transform:none}
.product-body{padding:18px}
.product-category{color:#2caeff;font-size:.75rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.product-title{font-family:Georgia,"Times New Roman",serif;font-size:1.25rem;margin:8px 0 8px}
.rating{display:flex;align-items:center;gap:8px;color:#ffc34d;font-size:.88rem}
.rating small{color:#9daabd}
.price-row{display:flex;align-items:center;gap:10px;margin:13px 0}
.sale-price{font-size:1.55rem;font-weight:850;color:#2aa8ff}.mrp{text-decoration:line-through;color:#9199a6}.discount{font-size:.7rem;background:#123963;color:#bfe4ff;border-radius:5px;padding:4px 7px}
.feature-row{display:flex;gap:10px;border-top:1px solid rgba(255,255,255,.09);padding-top:13px;margin-top:10px;color:#d4deea;font-size:.78rem}
.feature-row span{flex:1}
.view-product{display:flex;align-items:center;justify-content:center;margin-top:16px;padding:12px;border-radius:9px;background:linear-gradient(180deg,#168ef0,#0758ac);color:white;text-decoration:none;font-weight:800}
.pagination{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:38px}
.pagination button{min-width:42px;height:42px;padding:0 13px;border:1px solid rgba(75,180,255,.3);border-radius:8px;background:#07162b;color:#eaf3ff;cursor:pointer}
.pagination button.is-active{background:linear-gradient(180deg,#168ef0,#0758ac);border-color:#2aafff}
.pagination button:disabled{opacity:.35;cursor:not-allowed}
.bulk-panel{display:flex;justify-content:space-between;align-items:center;gap:35px;padding:42px;border:1px solid rgba(75,180,255,.3);border-radius:24px;background:linear-gradient(135deg,rgba(14,39,72,.95),rgba(4,13,28,.98));box-shadow:0 25px 65px rgba(0,0,0,.35)}
.bulk-panel h2{margin:8px 0 12px}.bulk-panel p{max-width:700px;color:#aab9cb;line-height:1.7}
.bulk-benefits{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}
.bulk-benefits span{padding:8px 11px;border:1px solid rgba(75,180,255,.22);border-radius:999px;color:#d7e5f5;font-size:.82rem}
.related-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.related-card{display:block;padding:27px;border:1px solid rgba(75,180,255,.22);border-radius:19px;background:linear-gradient(145deg,rgba(15,38,68,.9),rgba(4,13,28,.98));text-decoration:none;color:white}
.related-card span{color:#35b5ff;font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;font-weight:800}
.related-card h3{margin:10px 0}.related-card p{margin:0;color:#9fb0c5;line-height:1.55}
@media(max-width:1100px){.designer-product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
.devotional-pin-badges-hero-frame{border-radius:14px}.catalogue-section{padding-top:52px}.catalogue-toolbar{align-items:flex-start;flex-direction:column}.sort-control,.sort-control select{width:100%}
.designer-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.product-body{padding:12px}.product-title{font-size:1rem}.sale-price{font-size:1.25rem}.mrp,.discount{font-size:.65rem}.feature-row{display:none}.wishlist{width:36px;height:36px}.quick-view{display:none}.product-badge{font-size:.6rem;padding:5px 8px}.view-product{font-size:.78rem;padding:10px}.bulk-panel{align-items:flex-start;flex-direction:column;padding:28px}.related-grid{grid-template-columns:1fr}.catalogue-summary span{display:none}
}


/* Designer Mugs v1.1 refinements */

/* Breadcrumbs: aligned with the locked category-page treatment */
.devotional-pin-badges-page .breadcrumbs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  padding: 16px 0 18px;
  color: #9fb0c5;
  font-size: 0.88rem;
  line-height: 1.4;
}

.devotional-pin-badges-page .breadcrumbs a {
  color: #b8c8da;
  text-decoration: none;
  transition: color 220ms ease;
}

.devotional-pin-badges-page .breadcrumbs a:hover,
.devotional-pin-badges-page .breadcrumbs a:focus-visible {
  color: #39b8ff;
}

.devotional-pin-badges-page .breadcrumbs span[aria-hidden="true"],
.devotional-pin-badges-page .breadcrumbs .breadcrumb-separator {
  color: rgba(156, 190, 222, 0.55);
  font-size: 0.78rem;
}

.devotional-pin-badges-page .breadcrumbs .breadcrumb-current {
  color: #f4f8fd;
  font-weight: 700;
}

/* Smooth ambient illumination behind each product card */
.designer-card {
  isolation: isolate;
  transition:
    transform 380ms cubic-bezier(.22, .61, .36, 1),
    border-color 420ms ease,
    box-shadow 520ms ease;
}

.designer-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -22%;
  pointer-events: none;
  background:
    radial-gradient(
      circle at 50% 43%,
      rgba(39, 164, 255, 0.34) 0%,
      rgba(23, 115, 210, 0.17) 30%,
      rgba(5, 31, 66, 0.05) 56%,
      transparent 74%
    );
  opacity: 0;
  transform: scale(0.86);
  filter: blur(18px);
  transition:
    opacity 620ms cubic-bezier(.22, .61, .36, 1),
    transform 760ms cubic-bezier(.22, .61, .36, 1),
    filter 650ms ease;
}

.designer-card:hover::before,
.designer-card:focus-within::before {
  opacity: 1;
  transform: scale(1);
  filter: blur(11px);
}

.designer-card:hover,
.designer-card:focus-within {
  transform: translateY(-7px);
  border-color: rgba(45, 169, 255, 0.92);
  box-shadow:
    0 0 38px rgba(30, 144, 255, 0.24),
    0 24px 54px rgba(0, 0, 0, 0.44);
}

.product-media img {
  transition: transform 680ms cubic-bezier(.22, .61, .36, 1);
}

.quick-view {
  transition:
    opacity 420ms ease,
    transform 480ms cubic-bezier(.22, .61, .36, 1),
    border-color 300ms ease,
    background 300ms ease;
}

@media (prefers-reduced-motion: reduce) {
  .designer-card,
  .designer-card::before,
  .product-media img,
  .quick-view {
    transition-duration: 0.01ms !important;
  }
}

@media (max-width: 760px) {
  .devotional-pin-badges-page .breadcrumbs {
    gap: 7px;
    padding: 12px 0 15px;
    font-size: 0.78rem;
  }

  /* Touch devices do not need a persistent hover glow */
  .designer-card::before {
    display: none;
  }
}

/* Version 4.0.3: mobile catalogue alignment polish */
.designer-product-grid{
  align-items:stretch;
}
.designer-card{
  display:flex;
  flex-direction:column;
  height:100%;
}
.designer-card .product-body{
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
}
.designer-card .product-title{
  min-height:2.45em;
}
.designer-card .rating{
  min-height:1.35rem;
}
.designer-card .price-row{
  display:grid;
  grid-template-columns:auto auto minmax(44px,1fr);
  align-items:center;
  column-gap:8px;
}
.designer-card .discount{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  justify-self:end;
  min-width:44px;
  min-height:34px;
  padding:4px 6px;
  text-align:center;
  line-height:1.05;
  white-space:normal;
  box-sizing:border-box;
}
.designer-card .view-product{
  margin-top:auto;
}

@media(max-width:760px){
  .designer-product-grid{
    grid-auto-rows:1fr;
  }
  .designer-card .product-body{
    min-height:205px;
  }
  .designer-card .product-category{
    min-height:1.05rem;
  }
  .designer-card .product-title{
    min-height:2.55em;
    line-height:1.18;
  }
  .designer-card .rating{
    min-height:2.1rem;
    align-items:flex-start;
    flex-wrap:wrap;
    gap:2px 6px;
    line-height:1.1;
  }
  .designer-card .price-row{
    grid-template-columns:auto auto minmax(42px,1fr);
    min-height:42px;
    gap:5px;
    margin:10px 0 12px;
  }
  .designer-card .discount{
    width:46px;
    min-width:46px;
    min-height:36px;
    padding:4px;
    font-size:.62rem;
  }
  .designer-card .view-product{
    min-height:40px;
    box-sizing:border-box;
  }
}

/* Version 5.0.3: unified catalogue metadata and specification alignment */
.product-category{
  color:#2caeff;
}
.designer-card .feature-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:center;
  gap:12px;
  min-height:42px;
  margin-top:auto;
  padding-top:13px;
  border-top:1px solid rgba(255,255,255,.09);
  color:#d4deea;
  font-size:.76rem;
  line-height:1.2;
}
.designer-card .feature-row span{
  min-width:0;
  white-space:nowrap;
}
.designer-card .feature-row span:last-child{
  justify-self:end;
  text-align:right;
}
.designer-card .view-product{
  margin-top:10px;
}
@media(max-width:1180px) and (min-width:761px){
  .designer-card .feature-row{
    font-size:.7rem;
    gap:7px;
  }
}
@media(max-width:760px){
  .designer-card .feature-row{display:none}
  .designer-card .view-product{margin-top:auto}
}

/* Version 7.0.1: master product-listing template */
.v701-designer-keychains .designer-shopping-realm{padding-bottom:84px}
.v701-designer-keychains .designer-style-orbit{margin-top:24px}
.v701-designer-keychains .designer-style-orbit .category-item{appearance:none;color:inherit;font:inherit;cursor:pointer;text-align:center}
.v701-designer-keychains .designer-style-orbit .category-item.is-active{border-color:rgba(83,205,255,.95)!important;box-shadow:0 0 38px rgba(34,168,255,.28),inset 0 0 32px rgba(40,145,255,.12)!important}
.v701-designer-keychains .catalogue-continuum{margin-top:24px;padding-top:24px;border-top:1px solid rgba(116,187,255,.12)}
.v701-designer-keychains .catalogue-toolbar{padding:16px 18px;border:1px solid rgba(92,178,255,.18);border-radius:16px;background:linear-gradient(135deg,rgba(9,26,49,.76),rgba(4,14,29,.74));backdrop-filter:blur(12px)}
.v701-designer-keychains .catalogue-summary{flex-direction:row;align-items:center;gap:14px;flex-wrap:wrap}
.v701-designer-keychains .catalogue-total{padding:7px 11px;border:1px solid rgba(60,190,255,.25);border-radius:999px;color:#50c5ff;font-size:.76rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.v701-designer-keychains .sort-control{display:flex;align-items:center;gap:10px;color:#aebed0;font-size:.82rem;font-weight:700}
.v701-designer-keychains .product-media{aspect-ratio:4/4.45}
.v701-designer-keychains .wishlist,.v701-designer-keychains .quick-view{display:none}
.v701-designer-keychains .product-body{padding:19px 19px 20px}
.v701-designer-keychains .product-title{font-size:1.18rem}
.v701-designer-keychains .view-product{min-height:46px;transition:transform .22s ease,box-shadow .22s ease,filter .22s ease}
.v701-designer-keychains .view-product:hover{transform:translateY(-2px);filter:brightness(1.08);box-shadow:0 10px 25px rgba(24,142,240,.3)}
.v701-designer-keychains .related-promo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.v701-designer-keychains .related-promo{position:relative;isolation:isolate;min-height:310px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;padding:32px;border:1px solid rgba(102,190,255,.28);border-radius:24px;color:#fff;text-decoration:none;background-size:cover;background-position:center;box-shadow:0 24px 58px rgba(0,0,0,.34);transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}
.v701-designer-keychains .related-promo::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(180deg,rgba(2,9,20,.14),rgba(2,9,20,.96) 80%)}
.v701-designer-keychains .related-promo:hover{transform:translateY(-6px);border-color:#39b8ff;box-shadow:0 0 36px rgba(32,168,255,.2),0 28px 64px rgba(0,0,0,.45)}
.v701-designer-keychains .related-promo.festival{background-image:url('../assets/images/AR-Festival-Mugs-Hero-Banner.png')}
.v701-designer-keychains .related-promo.birthday{background-image:url('../assets/images/AR-Birthday-Mugs-Hero-Banner.png')}
.v701-designer-keychains .related-promo.anniversary{background-image:url('../assets/images/AR-Anniversary-Mugs-Hero-Banner.png')}
.v701-designer-keychains .related-promo.devotional{background-image:url('../assets/images/AR-Devotional-Mugs-Hero-Banner.png')}
.v701-designer-keychains .related-promo span{color:#55cfff;font-size:.74rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.v701-designer-keychains .related-promo h3{margin:9px 0 8px;font:clamp(1.65rem,3vw,2.3rem) Georgia,serif}
.v701-designer-keychains .related-promo p{max-width:520px;margin:0 0 18px;color:#c7d4e2;line-height:1.65}
.v701-designer-keychains .related-promo b{font-size:.9rem;color:#eef9ff}
@media(max-width:900px){.v701-designer-keychains .related-promo-grid{grid-template-columns:1fr}.v701-designer-keychains .related-promo{min-height:270px}}
@media(max-width:760px){.v701-designer-keychains .designer-shopping-realm{padding-bottom:58px}.v701-designer-keychains .catalogue-continuum{margin-top:12px;padding-top:14px}.v701-designer-keychains .catalogue-toolbar{padding:14px}.v701-designer-keychains .catalogue-summary{align-items:flex-start;flex-direction:column;gap:7px}.v701-designer-keychains .sort-control{width:100%;justify-content:space-between}.v701-designer-keychains .product-media{aspect-ratio:1/1.08}.v701-designer-keychains .related-promo{min-height:230px;padding:23px;border-radius:18px}}


/* Version 7.0.2: Feedback 2 refinements */
.v702-designer-keychains .personalise-cta-panel{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:22px;padding:26px 28px;border:1px solid rgba(92,178,255,.2);border-radius:22px;background:linear-gradient(145deg,rgba(57,125,255,.075),rgba(255,255,255,.022));box-shadow:0 20px 48px rgba(0,0,0,.18)}
.v702-designer-keychains .personalise-cta-panel h3{margin:7px 0 8px;font:clamp(1.65rem,3vw,2.2rem) Georgia,serif}
.v702-designer-keychains .personalise-cta-panel p{max-width:760px;margin:0;color:#aebfd0;line-height:1.7}
.v702-designer-keychains .personalise-cta-panel .btn{flex:0 0 auto;white-space:nowrap}
.v702-designer-keychains .related-collection-rail .collection-card{display:block;text-decoration:none;color:inherit}
.v702-designer-keychains .related-collection-rail .collection-card h4{margin-top:28px}
@media(max-width:760px){.v702-designer-keychains .personalise-cta-panel{align-items:flex-start;flex-direction:column;padding:22px}.v702-designer-keychains .personalise-cta-panel .btn{width:100%;text-align:center}.v702-designer-keychains .related-collection-rail{margin-right:-12px;padding-right:12px}}


/* Version 7.0.3: actionable twin CTAs over the approved Designer Mugs hero */
.devotional-pin-badges-hero-frame{position:relative}
.designer-hero-actions{
  position:absolute;
  left:4.35%;
  top:59.55%;
  z-index:3;
  display:flex;
  gap:1.5%;
  width:39.9%;
  height:6.85%;
}
.designer-hero-cta{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7%;
  width:49.25%;
  height:100%;
  border:1px solid rgba(102,190,255,.9);
  border-radius:10px;
  background:linear-gradient(180deg,#2f8eff 0%,#1465d4 48%,#0a3e9f 100%);
  box-shadow:0 8px 22px rgba(0,73,190,.38),inset 0 1px 0 rgba(255,255,255,.3);
  color:#fff;
  text-decoration:none;
  text-transform:uppercase;
  font-weight:800;
  font-size:clamp(7px,1.05vw,16px);
  line-height:1;
  letter-spacing:.01em;
  cursor:pointer;
  transition:transform .2s ease,box-shadow .2s ease,filter .2s ease,border-color .2s ease;
}
.designer-hero-cta svg{
  width:clamp(12px,2.1vw,32px);
  height:clamp(12px,2.1vw,32px);
  flex:0 0 auto;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.designer-hero-cta:hover{
  transform:translateY(-3px);
  filter:brightness(1.12);
  border-color:#b8e6ff;
  box-shadow:0 12px 30px rgba(0,116,255,.5),0 0 20px rgba(42,166,255,.28),inset 0 1px 0 rgba(255,255,255,.4);
}
.designer-hero-cta:active{transform:translateY(0) scale(.985)}
.designer-hero-cta:focus-visible{outline:3px solid #fff;outline-offset:3px}
#collection,#bulk-orders{scroll-margin-top:96px}
@media(max-width:760px){
  .designer-hero-actions{left:4.35%;top:59.55%;width:39.9%;height:6.85%;gap:1.5%}
  .designer-hero-cta{border-radius:5px;font-size:clamp(5px,1.05vw,8px);gap:5%;border-width:1px}
  .designer-hero-cta svg{width:clamp(8px,2.1vw,14px);height:clamp(8px,2.1vw,14px)}
}
@media(prefers-reduced-motion:reduce){.designer-hero-cta{transition:none}}

/* =========================================================
   Version 7.0.4 — Final Designer Mugs template lock
   ========================================================= */
.v704-festival-pin-badges .devotional-pin-badges-hero-frame{position:relative}
.v704-festival-pin-badges .devotional-pin-badges-hero-frame img{display:block;width:100%;height:auto}
.v704-festival-pin-badges .designer-hero-actions{display:none!important}

.v704-festival-pin-badges .personalise-cta-panel{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  margin-top:22px;
  padding:26px 28px;
  border:1px solid rgba(92,178,255,.2);
  border-radius:22px;
  background:linear-gradient(145deg,rgba(57,125,255,.075),rgba(255,255,255,.022));
  box-shadow:0 20px 48px rgba(0,0,0,.18)
}
.v704-festival-pin-badges .personalise-cta-panel h3{
  margin:7px 0 8px;
  font:clamp(1.65rem,3vw,2.2rem) Georgia,serif
}
.v704-festival-pin-badges .personalise-cta-panel p{
  max-width:760px;
  margin:0;
  color:#aebfd0;
  line-height:1.7
}
.v704-festival-pin-badges .personalise-cta-panel .btn{
  flex:0 0 auto;
  white-space:nowrap
}
@media(max-width:760px){
  .v704-festival-pin-badges .personalise-cta-panel{
    align-items:flex-start;
    flex-direction:column;
    padding:22px
  }
  .v704-festival-pin-badges .personalise-cta-panel .btn{
    width:100%;
    text-align:center
  }
}

/* =========================================================
   Version 7.0.5 — Designer Mugs mobile spacing and overflow QA
   ========================================================= */
@media(max-width:760px){
  html,body{max-width:100%;overflow-x:clip}

  /* Tighten hero-divider-catalogue rhythm. */
  .v704-festival-pin-badges .mug-hero + .mugs-section-divider{
    margin-top:18px!important;
    margin-bottom:8px!important;
  }
  .v704-festival-pin-badges .designer-shopping-realm{
    padding-top:8px!important;
  }
  .v704-festival-pin-badges .designer-shopping-realm .section-head{
    margin-bottom:14px!important;
  }

  /* Give Sort By and the select a clear visual gap. */
  .v704-festival-pin-badges .sort-control{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    column-gap:16px!important;
  }
  .v704-festival-pin-badges .sort-control select{
    width:100%;
    min-width:0;
  }

  /* Remove surplus card space below View Product. */
  .v704-festival-pin-badges .designer-product-grid{
    grid-auto-rows:auto!important;
    align-items:start!important;
  }
  .v704-festival-pin-badges .designer-card{
    height:auto!important;
  }
  .v704-festival-pin-badges .designer-card .product-body,
  .v704-festival-pin-badges .designer-product-grid > article .product-body{
    display:flex!important;
    flex-direction:column!important;
    min-height:0!important;
    height:auto!important;
    padding:12px!important;
    row-gap:0!important;
  }
  .v704-festival-pin-badges .designer-card .product-category{min-height:0!important}
  .v704-festival-pin-badges .designer-card .product-title{min-height:0!important;margin:7px 0 6px!important}
  .v704-festival-pin-badges .designer-card .rating{min-height:0!important;margin-bottom:6px!important}
  .v704-festival-pin-badges .designer-card .price-row{min-height:44px!important;margin:5px 0 10px!important}
  .v704-festival-pin-badges .designer-card .view-product{
    margin-top:0!important;
    margin-bottom:0!important;
    align-self:stretch!important;
  }

  /* Keep swipe rails inside the viewport and stop body-level sideways movement. */
  .v704-festival-pin-badges .related-mug-collections,
  .v704-festival-pin-badges .related-mug-collections .container{
    max-width:100%;
    overflow:hidden;
  }
  .v704-festival-pin-badges .related-collection-rail{
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:12px!important;
    box-sizing:border-box;
    overscroll-behavior-inline:contain;
    touch-action:pan-x pan-y;
  }
  .v704-festival-pin-badges .related-collection-rail .collection-card:last-child{
    margin-right:0!important;
  }
}


/* =========================================================
   Version 7.0.6 — Mobile View Product alignment
   ========================================================= */
@media(max-width:760px){
  .v704-festival-pin-badges .designer-product-grid{
    align-items:stretch!important;
    grid-auto-rows:1fr!important;
  }
  .v704-festival-pin-badges .designer-card{
    display:flex!important;
    flex-direction:column!important;
    height:100%!important;
  }
  .v704-festival-pin-badges .designer-card .product-media{flex:0 0 auto!important}
  .v704-festival-pin-badges .designer-card .product-body{
    display:flex!important;
    flex:1 1 auto!important;
    flex-direction:column!important;
    height:100%!important;
    min-height:0!important;
  }
  .v704-festival-pin-badges .designer-card .product-category{
    min-height:29px!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }
  .v704-festival-pin-badges .designer-card .product-title{
    min-height:40px!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }
  .v704-festival-pin-badges .designer-card .rating{min-height:20px!important}
  .v704-festival-pin-badges .designer-card .price-row{min-height:44px!important}
  .v704-festival-pin-badges .designer-card .view-product{
    margin-top:auto!important;
    width:100%!important;
    min-height:42px!important;
    box-sizing:border-box!important;
  }
}

/* =========================================================
   Version 7.0.7 — Laptop hero single-border micro-fix
   The approved banner artwork already contains its own outline.
   Remove only the additional wrapper border on laptop/desktop.
   Mobile styling remains unchanged.
   ========================================================= */
@media (min-width: 761px) {
  .v704-festival-pin-badges .devotional-pin-badges-hero-frame {
    border: 0;
  }
}

/* =========================================================
   Version 7.0.8 — Static laptop/desktop Designer Mugs hero
   Keep the approved artwork border fixed and identical before,
   during and after pointer hover. This intentionally overrides
   the global .hero-frame:hover img zoom interaction.
   ========================================================= */
@media (min-width: 761px) {
  .v704-festival-pin-badges .devotional-pin-badges-hero-frame,
  .v704-festival-pin-badges .devotional-pin-badges-hero-frame:hover {
    overflow: hidden;
    border: 0;
  }

  .v704-festival-pin-badges .devotional-pin-badges-hero-frame img,
  .v704-festival-pin-badges .devotional-pin-badges-hero-frame:hover img {
    transform: none !important;
    transition: none !important;
  }
}

/* =========================================================
   Version 7.0.9 — Laptop sort-control alignment correction
   Keeps the label and select comfortably inside the toolbar,
   with a stable, left-aligned native dropdown control.
   ========================================================= */
@media (min-width: 761px) {
  .v704-festival-pin-badges .catalogue-toolbar {
    padding-right: 28px;
  }

  .v704-festival-pin-badges .sort-control {
    flex: 0 0 auto;
    min-width: 350px;
    margin-left: auto;
    padding-right: 2px;
    justify-content: flex-end;
    gap: 16px;
    white-space: nowrap;
  }

  .v704-festival-pin-badges .sort-control > span {
    display: inline-block;
    flex: 0 0 auto;
    min-width: 52px;
    margin: 0;
    text-align: right;
    line-height: 1.2;
  }

  .v704-festival-pin-badges .sort-control select {
    display: block;
    flex: 0 0 220px;
    width: 220px;
    min-width: 220px;
    max-width: 220px;
    margin: 0;
    box-sizing: border-box;
    text-align: left;
    text-align-last: left;
    vertical-align: middle;
  }
}

/* =========================================================
   Version 7.0.10 — Designer hero motion + sort control polish
   - Restores a premium hover response without scaling the image,
     so the artwork border stays completely static.
   - Stacks the Sort By label directly above the native select,
     keeping both left edges aligned on desktop and mobile.
   - Removes the persistent browser focus halo after selection.
   ========================================================= */

/* Static artwork geometry with a subtle animated outer glow. */
.v704-festival-pin-badges .devotional-pin-badges-hero-frame {
  transform: translateZ(0);
  transition: box-shadow 420ms ease, filter 420ms ease;
}
.v704-festival-pin-badges .devotional-pin-badges-hero-frame:hover {
  box-shadow: 0 30px 86px rgba(0,0,0,.48), 0 0 30px rgba(45,169,255,.16);
  filter: brightness(1.018);
}
.v704-festival-pin-badges .devotional-pin-badges-hero-frame img,
.v704-festival-pin-badges .devotional-pin-badges-hero-frame:hover img {
  transform: none !important;
  transition: none !important;
}

/* One predictable stacked control: label and field share one left edge. */
.v704-festival-pin-badges .sort-control {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 7px !important;
  width: 220px;
  min-width: 220px;
  margin-left: auto;
  padding: 0 !important;
  white-space: normal;
}
.v704-festival-pin-badges .sort-control > span {
  display: block;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0 2px;
  text-align: left;
  line-height: 1.2;
}
.v704-festival-pin-badges .sort-control select {
  display: block;
  width: 220px !important;
  min-width: 220px !important;
  max-width: 220px !important;
  margin: 0 !important;
  box-sizing: border-box;
  text-align: left;
  text-align-last: left;
  outline: none !important;
  box-shadow: none !important;
}
.v704-festival-pin-badges .sort-control select:focus,
.v704-festival-pin-badges .sort-control select:focus-visible,
.v704-festival-pin-badges .sort-control select:active {
  outline: none !important;
  box-shadow: none !important;
  border-color: rgba(79,183,255,.48);
}

@media (max-width: 760px) {
  .v704-festival-pin-badges .sort-control {
    width: min(220px, 100%);
    min-width: 0;
    margin-left: 0;
  }
  .v704-festival-pin-badges .sort-control select {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 220px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .v704-festival-pin-badges .devotional-pin-badges-hero-frame {
    transition: none !important;
  }
}

/* =========================================================
   Version 7.0.11 — Restore proven reference hero interaction
   and return Sort By to the approved inline desktop layout.
   ========================================================= */
@media (min-width: 761px) {
  /* Match the hover behaviour in the user-approved reference HTML. */
  .v711-reference-hero-animation .devotional-pin-badges-hero-frame,
  .v711-reference-hero-animation .devotional-pin-badges-hero-frame:hover {
    overflow: hidden;
    border: 0;
    filter: none;
    box-shadow: 0 28px 80px rgba(0,0,0,.42);
    transition: box-shadow .35s ease;
  }

  .v711-reference-hero-animation .devotional-pin-badges-hero-frame img {
    display: block;
    width: 100%;
    height: auto;
    transform: scale(1);
    transform-origin: center center;
    transition: transform .8s ease !important;
  }

  .v711-reference-hero-animation .devotional-pin-badges-hero-frame:hover img {
    transform: scale(1.015) !important;
  }

  /* Approved reference alignment: label close to and centred with field. */
  .v711-reference-hero-animation .catalogue-toolbar {
    align-items: center;
    padding-right: 18px;
  }

  .v711-reference-hero-animation .sort-control {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    width: auto;
    min-width: 0;
    margin-left: auto;
    padding: 0 !important;
    white-space: nowrap;
  }

  .v711-reference-hero-animation .sort-control > span {
    display: inline-block;
    width: auto;
    min-width: 0;
    margin: 0;
    padding: 0;
    text-align: right;
    line-height: 1.2;
  }

  .v711-reference-hero-animation .sort-control select {
    display: block;
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
    margin: 0 !important;
    padding: 12px 40px 12px 14px;
    box-sizing: border-box;
    text-align: left;
    text-align-last: left;
    outline: none !important;
    box-shadow: none !important;
  }

  .v711-reference-hero-animation .sort-control select:focus,
  .v711-reference-hero-animation .sort-control select:focus-visible,
  .v711-reference-hero-animation .sort-control select:active {
    outline: none !important;
    box-shadow: none !important;
    border-color: rgba(79,183,255,.3);
  }
}

@media (prefers-reduced-motion: reduce) {
  .v711-reference-hero-animation .devotional-pin-badges-hero-frame img {
    transition: none !important;
  }
}

/* =========================================================
   Version 7.0.12 — Smooth static-border hero animation
   + fully aligned custom Sort By dropdown.
   The banner artwork never scales or moves. Animation is
   produced by a clipped light sweep and outer glow only.
   ========================================================= */
@media (min-width:761px){
  .v712-smooth-static-hero .devotional-pin-badges-hero-frame,
  .v712-smooth-static-hero .devotional-pin-badges-hero-frame:hover{
    position:relative;
    overflow:hidden;
    border:0;
    filter:none;
    transform:none;
    box-shadow:0 28px 80px rgba(0,0,0,.42);
    transition:box-shadow 900ms cubic-bezier(.22,.61,.36,1);
  }
  .v712-smooth-static-hero .devotional-pin-badges-hero-frame::after{
    content:"";
    position:absolute;
    inset:-18% -42%;
    pointer-events:none;
    background:linear-gradient(108deg,transparent 37%,rgba(90,190,255,0) 43%,rgba(110,205,255,.20) 49%,rgba(255,255,255,.14) 52%,rgba(82,177,255,.12) 56%,transparent 64%);
    transform:translateX(-48%);
    opacity:0;
    transition:transform 1400ms cubic-bezier(.16,1,.3,1),opacity 320ms ease;
    will-change:transform,opacity;
  }
  .v712-smooth-static-hero .devotional-pin-badges-hero-frame:hover{
    box-shadow:0 30px 86px rgba(0,0,0,.5),0 0 42px rgba(50,164,255,.22);
  }
  .v712-smooth-static-hero .devotional-pin-badges-hero-frame:hover::after{
    transform:translateX(48%);
    opacity:1;
  }
  .v712-smooth-static-hero .devotional-pin-badges-hero-frame img,
  .v712-smooth-static-hero .devotional-pin-badges-hero-frame:hover img{
    display:block;
    width:100%;
    height:auto;
    transform:none!important;
    transition:none!important;
  }

  .v712-smooth-static-hero .catalogue-toolbar{align-items:center;padding-right:18px;overflow:visible}
  .v712-smooth-static-hero .sort-control{
    position:relative;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:10px!important;
    width:auto!important;
    min-width:0!important;
    margin-left:auto!important;
    padding:0!important;
    white-space:nowrap;
    overflow:visible;
  }
  .v712-smooth-static-hero .sort-label{margin:0;padding:0;line-height:1.2;color:#f5f7fb;font-weight:700}
  .v712-smooth-static-hero .custom-sort{position:relative;width:220px;flex:0 0 220px}
  .v712-smooth-static-hero .custom-sort-trigger{
    width:220px;height:48px;padding:0 14px;
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    border:1px solid rgba(79,183,255,.42);border-radius:10px;
    background:#07162b;color:#f5f7fb;font:inherit;font-weight:700;text-align:left;
    box-shadow:none;outline:none;cursor:pointer;
  }
  .v712-smooth-static-hero .custom-sort-trigger:hover{border-color:rgba(90,195,255,.72)}
  .v712-smooth-static-hero .custom-sort-trigger:focus-visible{outline:2px solid rgba(90,195,255,.55);outline-offset:2px}
  .v712-smooth-static-hero .custom-sort-chevron{font-size:18px;line-height:1;transform:translateY(-1px);transition:transform .22s ease}
  .v712-smooth-static-hero .custom-sort.is-open .custom-sort-chevron{transform:rotate(180deg) translateY(1px)}
  .v712-smooth-static-hero .custom-sort-menu{
    position:absolute;z-index:80;top:calc(100% + 6px);left:0;width:220px;
    padding:6px;border:1px solid rgba(79,183,255,.35);border-radius:10px;
    background:#101827;box-shadow:0 18px 38px rgba(0,0,0,.48);
  }
  .v712-smooth-static-hero .custom-sort-menu[hidden]{display:none}
  .v712-smooth-static-hero .custom-sort-menu button{
    display:block;width:100%;padding:9px 12px;border:0;border-radius:7px;
    background:transparent;color:#f5f7fb;font:inherit;text-align:left;cursor:pointer;
  }
  .v712-smooth-static-hero .custom-sort-menu button:hover,
  .v712-smooth-static-hero .custom-sort-menu button[aria-selected="true"]{background:#2456b8}
  .v712-smooth-static-hero .native-sort-select{
    position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
    overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
  }
}
@media (prefers-reduced-motion:reduce){
  .v712-smooth-static-hero .devotional-pin-badges-hero-frame,
  .v712-smooth-static-hero .devotional-pin-badges-hero-frame::after{transition:none!important}
}


/* =========================================================
   Version 7.0.13 — Reference-style smooth hero animation
   with a genuinely static outer border.

   The latest artwork contains its own edge line. The image is
   slightly cropped at rest so that internal edge is never shown.
   The visible border belongs only to the frame and therefore
   cannot move while the image scales smoothly underneath it.
   ========================================================= */
@media (min-width:761px){
  .v713-static-border-smooth-hero .devotional-pin-badges-hero-frame,
  .v713-static-border-smooth-hero .devotional-pin-badges-hero-frame:hover{
    position:relative;
    overflow:hidden;
    border:1px solid rgba(80,190,255,.22) !important;
    border-radius:24px;
    filter:none !important;
    transform:none !important;
    box-shadow:0 28px 80px rgba(0,0,0,.42) !important;
    transition:border-color 420ms ease,box-shadow 520ms ease !important;
  }

  .v713-static-border-smooth-hero .devotional-pin-badges-hero-frame::after{
    display:none !important;
    content:none !important;
  }

  .v713-static-border-smooth-hero .devotional-pin-badges-hero-frame img{
    display:block;
    width:100%;
    height:auto;
    transform:scale(1.022) !important;
    transform-origin:center center;
    transition:transform 800ms ease !important;
    will-change:transform;
  }

  .v713-static-border-smooth-hero .devotional-pin-badges-hero-frame:hover img{
    transform:scale(1.037) !important;
  }

  .v713-static-border-smooth-hero .devotional-pin-badges-hero-frame:hover{
    border-color:rgba(80,190,255,.34) !important;
    box-shadow:0 30px 86px rgba(0,0,0,.48),0 0 30px rgba(50,164,255,.12) !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .v713-static-border-smooth-hero .devotional-pin-badges-hero-frame img{
    transition:none !important;
  }
}


/* =========================================================
   Version 7.0.14 — Smooth hero animation in both directions

   Fixes a specificity conflict inherited from v7.0.12 where
   the hover state applied transition:none. The transition is
   now declared on both resting and hovered states, keeping the
   fixed outer frame/border completely stationary.
   ========================================================= */
@media (min-width:761px){
  .v714-smooth-bidirectional-hero .devotional-pin-badges-hero-frame img,
  .v714-smooth-bidirectional-hero .devotional-pin-badges-hero-frame:hover img{
    transition:transform 800ms cubic-bezier(.22,.61,.36,1) !important;
    will-change:transform;
  }

  .v714-smooth-bidirectional-hero .devotional-pin-badges-hero-frame,
  .v714-smooth-bidirectional-hero .devotional-pin-badges-hero-frame:hover{
    transform:none !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .v714-smooth-bidirectional-hero .devotional-pin-badges-hero-frame img,
  .v714-smooth-bidirectional-hero .devotional-pin-badges-hero-frame:hover img{
    transition:none !important;
  }
}

/* =========================================================
   Version 7.1.1 — Mobile QA: catalogue Sort By alignment
   Laptop rules remain untouched. On phones the custom control
   is stacked cleanly beneath the result summary and the hidden
   native select is removed from the visual flow.
   ========================================================= */
@media (max-width:760px){
  .v714-smooth-bidirectional-hero .catalogue-toolbar{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:16px !important;
    padding:16px !important;
    overflow:visible !important;
  }
  .v714-smooth-bidirectional-hero .catalogue-summary{
    width:100% !important;
  }
  .v714-smooth-bidirectional-hero .sort-control{
    position:relative !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:8px !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
  }
  .v714-smooth-bidirectional-hero .sort-label{
    display:block !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1.2 !important;
    text-align:left !important;
  }
  .v714-smooth-bidirectional-hero .custom-sort{
    position:relative !important;
    display:block !important;
    width:100% !important;
    min-width:0 !important;
  }
  .v714-smooth-bidirectional-hero .custom-sort-trigger{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100% !important;
    min-width:0 !important;
    height:48px !important;
    margin:0 !important;
    padding:0 14px !important;
    border:1px solid rgba(79,183,255,.42) !important;
    border-radius:10px !important;
    background:#07162b !important;
    color:#f5f7fb !important;
    font:inherit !important;
    font-weight:700 !important;
    text-align:left !important;
    box-shadow:none !important;
    outline:none !important;
  }
  .v714-smooth-bidirectional-hero .custom-sort-menu{
    position:absolute !important;
    z-index:80 !important;
    top:calc(100% + 6px) !important;
    left:0 !important;
    width:100% !important;
    padding:6px !important;
    border:1px solid rgba(79,183,255,.35) !important;
    border-radius:10px !important;
    background:#101827 !important;
    box-shadow:0 18px 38px rgba(0,0,0,.48) !important;
  }
  .v714-smooth-bidirectional-hero .custom-sort-menu[hidden]{display:none !important;}
  .v714-smooth-bidirectional-hero .custom-sort-menu button{
    display:block !important;
    width:100% !important;
    padding:9px 12px !important;
    border:0 !important;
    border-radius:7px !important;
    background:transparent !important;
    color:#f5f7fb !important;
    font:inherit !important;
    text-align:left !important;
  }
  .v714-smooth-bidirectional-hero .custom-sort-menu button[aria-selected="true"]{
    background:#2456b8 !important;
  }
  .v714-smooth-bidirectional-hero .native-sort-select{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    clip-path:inset(50%) !important;
    white-space:nowrap !important;
    border:0 !important;
    opacity:0 !important;
    pointer-events:none !important;
  }
}

/* =========================================================
   v8.1.1 — Premium Section Divider parity with locked Mugs
   ========================================================= */
.v810-designer-keychains .keychains-section-divider,
.v810-designer-keychains .devotional-pin-badges-hero + .keychains-section-divider{
  display:block;
  width:min(680px,82vw);
  height:3px;
  margin:70px auto;
  background:linear-gradient(90deg,transparent,rgba(74,187,255,.22) 18%,rgba(122,220,255,.88) 50%,rgba(74,187,255,.22) 82%,transparent);
  box-shadow:0 0 18px rgba(35,169,255,.22);
  clip-path:none;
  border-radius:999px;
}
@media(max-width:760px){
  .v810-designer-keychains .keychains-section-divider,
  .v810-designer-keychains .devotional-pin-badges-hero + .keychains-section-divider{
    width:min(680px,82vw);
    height:3px;
    margin:70px auto;
  }
  .v810-designer-keychains .devotional-pin-badges-hero + .keychains-section-divider{
    margin-top:18px;
    margin-bottom:8px;
  }
}

/* =========================================================
   v8.1.3 — Designer Keychains mobile catalogue QA
   - Removes surplus card space below View Product.
   - Keeps pagination fully contained within the phone viewport.
   ========================================================= */
@media (max-width:760px){
  .v810-designer-keychains .designer-product-grid{
    grid-auto-rows:auto!important;
    align-items:start!important;
  }
  .v810-designer-keychains .designer-card{
    height:auto!important;
  }
  .v810-designer-keychains .designer-card .product-body{
    flex:0 0 auto!important;
    height:auto!important;
    min-height:0!important;
    padding:12px 12px 6px!important;
  }
  .v810-designer-keychains .designer-card .view-product{
    margin-top:10px!important;
    margin-bottom:0!important;
  }
  .v810-designer-keychains .pagination{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
    gap:6px;
    padding:0 2px;
    overflow:hidden;
    flex-wrap:nowrap;
  }
  .v810-designer-keychains .pagination button{
    flex:0 0 38px;
    min-width:38px;
    width:38px;
    height:40px;
    padding:0;
  }
}

/* =========================================================
   v8.1.4 — Mobile pagination edge containment
   Keeps the complete control group comfortably inside narrow
   phone viewports with visible rounded corners on both sides.
   ========================================================= */
@media (max-width:760px){
  .v810-designer-keychains .pagination{
    width:max-content!important;
    max-width:calc(100% - 24px)!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding:0!important;
    gap:6px!important;
    overflow:visible!important;
    justify-content:center!important;
  }
  .v810-designer-keychains .pagination button{
    flex:0 0 38px!important;
    width:38px!important;
    min-width:38px!important;
    max-width:38px!important;
    height:40px!important;
    box-sizing:border-box!important;
  }
}

/* v9.1.1 Festival Pin Badges corrective overrides */
.devotional-pin-badges-page .devotional-pin-badges-hero-frame,
.devotional-pin-badges-page .devotional-pin-badges-hero-frame:hover{
  overflow:hidden;
}
.devotional-pin-badges-page .devotional-pin-badges-hero-frame img,
.devotional-pin-badges-page .devotional-pin-badges-hero-frame:hover img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  object-position:center center;
  transform:none !important;
  transition:none !important;
}
.pin-badges-section-divider{height:1px;max-width:calc(100% - 48px);margin:0 auto;background:linear-gradient(90deg,transparent,rgba(45,169,255,.32),transparent)}

/* =========================================================
   v9.1.2 — Locked Mugs hero and premium divider parity
   - The complete wide Pin Badges artwork defines the frame height.
   - No letterboxing, no forced 16:9 crop, and no horizontal drift.
   - Smooth approved zoom-in / zoom-out interaction is retained.
   - Section dividers match the locked Mugs DS-003 specification.
   ========================================================= */
.devotional-pin-badges-page .devotional-pin-badges-hero-frame,
.devotional-pin-badges-page .devotional-pin-badges-hero-frame:hover{
  position:relative;
  overflow:hidden;
  height:auto !important;
  aspect-ratio:auto !important;
  border:1px solid rgba(80,190,255,.22) !important;
  border-radius:24px;
  background:transparent !important;
  transform:none !important;
  filter:none !important;
  box-shadow:0 28px 80px rgba(0,0,0,.42) !important;
  transition:border-color 420ms ease,box-shadow 520ms ease !important;
}
.devotional-pin-badges-page .devotional-pin-badges-hero-frame::after{
  display:none !important;
  content:none !important;
}
.devotional-pin-badges-page .devotional-pin-badges-hero-frame img,
.devotional-pin-badges-page .devotional-pin-badges-hero-frame:hover img{
  display:block;
  width:100%;
  height:auto !important;
  max-width:none;
  aspect-ratio:auto !important;
  object-fit:initial !important;
  object-position:center center !important;
  transform-origin:center center;
  transition:transform 800ms cubic-bezier(.22,.61,.36,1) !important;
  will-change:transform;
}
@media (min-width:761px){
  .devotional-pin-badges-page .devotional-pin-badges-hero-frame img{
    transform:scale(1) !important;
  }
  .devotional-pin-badges-page .devotional-pin-badges-hero-frame:hover img{
    transform:scale(1.015) !important;
  }
  .devotional-pin-badges-page .devotional-pin-badges-hero-frame:hover{
    border-color:rgba(80,190,255,.34) !important;
    box-shadow:0 30px 86px rgba(0,0,0,.48),0 0 30px rgba(50,164,255,.12) !important;
  }
}
@media (max-width:760px){
  .devotional-pin-badges-page .devotional-pin-badges-hero-frame,
  .devotional-pin-badges-page .devotional-pin-badges-hero-frame:hover{
    border-radius:14px;
  }
  .devotional-pin-badges-page .devotional-pin-badges-hero-frame img,
  .devotional-pin-badges-page .devotional-pin-badges-hero-frame:hover img{
    transform:none !important;
  }
}
@media (prefers-reduced-motion:reduce){
  .devotional-pin-badges-page .devotional-pin-badges-hero-frame img,
  .devotional-pin-badges-page .devotional-pin-badges-hero-frame:hover img{
    transition:none !important;
  }
}

.devotional-pin-badges-page .pin-badges-section-divider,
.devotional-pin-badges-page .devotional-pin-badges-hero + .pin-badges-section-divider{
  display:block;
  width:min(680px,82vw);
  max-width:none;
  height:3px;
  margin:70px auto;
  background:linear-gradient(90deg,transparent,rgba(74,187,255,.22) 18%,rgba(122,220,255,.88) 50%,rgba(74,187,255,.22) 82%,transparent);
  box-shadow:0 0 18px rgba(35,169,255,.22);
  clip-path:none;
  border-radius:999px;
}
@media(max-width:760px){
  .devotional-pin-badges-page .pin-badges-section-divider,
  .devotional-pin-badges-page .devotional-pin-badges-hero + .pin-badges-section-divider{
    width:min(680px,82vw);
    height:3px;
    margin:70px auto;
  }
  .devotional-pin-badges-page .devotional-pin-badges-hero + .pin-badges-section-divider{
    margin-top:18px;
    margin-bottom:8px;
  }
}