/* Desktop spacing shared by the live pages and the editor's desktop canvas. */
@media (min-width: 1001px) {
  body #main > .hero { padding-block: 40px; }
  body #main > .intro:not(.resale-intro-banner):not(.notary-intro) {
    padding-top: 32px;
    padding-bottom: 24px;
  }
  body #main > .intro .eyebrow { margin-bottom: 16px; }
  body #main > .intro .lead { margin-top: 16px; margin-bottom: 8px; }
  body[data-page="home"] #main > .section { padding-block: 36px; }
  body[data-page="home"] #main .tiles { margin-top: 24px; }
  body #main > .notary-banner { margin-block: 24px; padding: 28px; }
  body #main > .columns { padding-top: 28px; padding-bottom: 36px; }

  body.yus-custom-page #main > .section:not(.yus-photo-section) {
    padding-top: 24px !important;
    padding-bottom: 20px !important;
  }
  body.yus-custom-page #main > .section.collection-group {
    padding-top: 16px !important;
  }
  body #main .collection-title { padding-top: 20px !important; }
  body #main .collection-title p { margin-top: 8px; margin-bottom: 0; }
  body #main p:empty { margin: 0; }

  /* The grid already has a capped width; nested side padding narrowed each card. */
  body main#main .products:not(:empty),
  body main#main .resale-product-grid {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 16px !important;
    padding-bottom: 24px !important;
    width: min(996px, 86%) !important;
  }
  body main#main .section .products:not(:empty),
  body main#main .section .resale-product-grid {
    width: 100% !important;
  }
  body #main .regular-candles-section > .products:empty,
  body #main .candle-bundles-section > .products:empty {
    min-height: 0;
    padding: 0;
    margin-top: 12px;
    margin-bottom: 16px;
  }
  body.bracelet-luxury #main > a[href="#bracelets/bracelet-8"] {
    margin-bottom: 20px !important;
  }
}

/* Compact homepage shared by the published page and editor preview. */
body.bracelet-luxury[data-page="home"] #main>.hero{min-height:0;padding-block:24px;gap:28px;align-items:center}
body.bracelet-luxury[data-page="home"] #main .hero h1{font-size:clamp(32px,3.3vw,44px);line-height:1.12;margin:12px 0}
body.bracelet-luxury[data-page="home"] #main .hero .eyebrow{margin-bottom:10px}
body.bracelet-luxury[data-page="home"] #main .hero .lead{font-size:16px;line-height:1.5;margin:12px 0;max-width:540px}
body.bracelet-luxury[data-page="home"] #main .hero .actions{gap:12px;margin-top:16px}
body.bracelet-luxury[data-page="home"] #main .brand-panel{min-height:0;padding:16px}
body.bracelet-luxury[data-page="home"] #main .brand-panel .large-mark{min-height:0;margin:10px 0}
body.bracelet-luxury[data-page="home"] #main .brand-panel .large-mark img{height:180px!important;width:100%!important;object-fit:contain}
body.bracelet-luxury[data-page="home"] #main .brand-panel p{margin:8px 0}
body.bracelet-luxury[data-page="home"] #main>.section{padding-block:24px}
body.bracelet-luxury[data-page="home"] #main .section>.eyebrow{margin-bottom:10px}
body.bracelet-luxury[data-page="home"] #main .section-heading{align-items:center;gap:16px}
body.bracelet-luxury[data-page="home"] #main .section-heading h2{font-size:clamp(26px,2.7vw,34px);line-height:1.15}
body.bracelet-luxury[data-page="home"] #main .section-heading p{margin:6px 0;font-size:14px}
body.bracelet-luxury[data-page="home"] #main .tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px;align-items:start}
body.bracelet-luxury[data-page="home"] #main .tile{min-height:0;padding:12px;display:flex;flex-direction:column}
body.bracelet-luxury[data-page="home"] #main .tile small{font-size:11px;line-height:1.3;margin-bottom:6px}
body.bracelet-luxury[data-page="home"] #main .tile img{height:110px!important;width:100%!important;margin:0 0 8px!important;object-fit:contain}
body.bracelet-luxury[data-page="home"] #main .yus-home-photo-slot{min-height:110px;height:110px;margin:0 0 8px}
body.bracelet-luxury[data-page="home"] #main .tile h3{font-size:20px;line-height:1.2;margin:0}
body.bracelet-luxury[data-page="home"] #main .tile p{font-size:12px;line-height:1.4;margin:6px 0}
body.bracelet-luxury[data-page="home"] #main .tile .link{font-size:12px;line-height:1.4;margin-top:8px}
body.bracelet-luxury[data-page="home"] #main>.notary-banner{min-height:0;margin-block:16px;padding:20px;gap:20px}
body.bracelet-luxury[data-page="home"] #main .notary-banner h2{font-size:28px;line-height:1.15;margin:8px 0}
body.bracelet-luxury[data-page="home"] #main .notary-banner p{margin:8px 0;line-height:1.45}
@media(min-width:1100px){body.bracelet-luxury[data-page="home"] #main .tiles{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:700px){
body.bracelet-luxury[data-page="home"] #main>.hero{padding:22px 6%;gap:18px}
body.bracelet-luxury[data-page="home"] #main .hero h1{font-size:32px}
body.bracelet-luxury[data-page="home"] #main .brand-panel{padding:12px}
body.bracelet-luxury[data-page="home"] #main .brand-panel .large-mark img{height:140px!important}
body.bracelet-luxury[data-page="home"] #main>.section{padding:20px 6%}
body.bracelet-luxury[data-page="home"] #main .tiles{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none;gap:10px}
body.bracelet-luxury[data-page="home"] #main .tile{padding:10px}
body.bracelet-luxury[data-page="home"] #main .tile h3{font-size:18px}
body.bracelet-luxury[data-page="home"] #main .tile img{height:100px!important}
body.bracelet-luxury[data-page="home"] #main .yus-home-photo-slot{min-height:100px;height:100px}
body.bracelet-luxury[data-page="home"] #main>.notary-banner{margin:12px 6%;padding:16px;gap:12px}
}
@media(max-width:350px){body.bracelet-luxury[data-page="home"] #main .tiles{grid-template-columns:1fr}}