/* HK-350: Hip Kit Club sign-up page (product 54). Scoped to .hkcj so nothing else on the site changes. */
.hkcj{--g:#1f4d3a;--c:#9b2335;--gold:#e3a72f;--cr:#fbf6ee;--ink:#1d1d1b;--mu:#45443f;
  font:400 19px/1.6 "Source Sans 3","Roboto",sans-serif;color:var(--ink);text-align:left}
html.html-kit-club-signup body{overflow-x:clip}
/* no theme gap between the trust bar and the gold banner */
html.html-kit-club-signup .master-wrapper-content{padding-top:0}
.hkcj *,.hkcj *:before,.hkcj *:after{box-sizing:border-box}
.hkcj h1,.hkcj h2,.hkcj h3{font-family:Lora,Georgia,serif;color:var(--g);line-height:1.2;margin:0 0 .45em;font-weight:700;text-transform:none;letter-spacing:0;text-align:inherit}
.hkcj h1{font-size:50px}.hkcj h2{font-size:36px}.hkcj h3{font-size:24px}
.hkcj p{margin:0 0 1em;font-size:inherit;line-height:inherit}
.hkcj img{max-width:100%}
.hkcj .bleed{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.hkcj .w{max-width:1240px;margin:0 auto;padding:0 32px}
.hkcj .banner{background:var(--gold);color:#1d1d1b;text-align:center;font-weight:700;padding:12px 16px;font-size:19px}
.hkcj .btn{display:inline-flex;align-items:center;justify-content:center;min-height:60px;padding:0 34px;background:var(--g);color:#fff;font:700 22px "Source Sans 3","Roboto",sans-serif;border:0;border-radius:10px;text-decoration:none;cursor:pointer;text-transform:none}
.hkcj .btn:hover,.hkcj .btn:focus{color:#fff;filter:brightness(1.12)}
.hkcj .btn.c{background:var(--c)}
.hkcj .kick{font-family:Lora,Georgia,serif;letter-spacing:.28em;color:var(--c);font-weight:700;font-size:18px;text-transform:uppercase}
.hkcj section{padding:60px 0}.hkcj .cr{background:var(--cr)}
.hkcj .gr{background:var(--g);color:#fff}.hkcj .gr h2,.hkcj .gr h3{color:#fff}
.hkcj .center{text-align:center}.hkcj .mu{color:var(--mu)}
.hkcj .reas{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:8px}
.hkcj .reas li{padding-left:30px;position:relative;list-style:none}
.hkcj .reas li:before{content:"\2713";position:absolute;left:0;color:var(--g);font-weight:700}
.hkcj .hero{display:grid;grid-template-columns:.85fr 1.3fr;gap:48px;align-items:start;padding:44px 0}
.hkcj .hero>*,.hkcj .grid2>*{min-width:0}
.hkcj .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.hkcj .grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.hkcj .card{background:#fff;border:1px solid #e1d9cb;border-radius:14px;padding:24px}
.hkcj .num{display:inline-flex;width:48px;height:48px;border-radius:50%;background:var(--c);color:#fff;font-weight:700;align-items:center;justify-content:center;margin-bottom:10px;font-size:20px}
/* carousel */
.hkcj .car{position:relative}
.hkcj .track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:14px;scroll-behavior:smooth}
.hkcj .track::-webkit-scrollbar{display:none}
.hkcj .slide{flex:0 0 100%;scroll-snap-align:start;margin:0;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.12)}
.hkcj .slide img{width:100%;height:520px;object-fit:cover;display:block}
.hkcj .slide figcaption{padding:12px 16px;font-size:18px;color:var(--ink)}
.hkcj .arw{position:absolute;top:240px;width:56px;height:56px;border-radius:50%;border:0;background:#fff;color:var(--g);font-size:30px;line-height:1;box-shadow:0 2px 10px rgba(0,0,0,.25);cursor:pointer;padding:0}
.hkcj .arw.l{left:-20px}.hkcj .arw.r{right:-20px}
.hkcj .thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:12px}
.hkcj .thumbs button{padding:0;border:3px solid transparent;border-radius:8px;background:none;min-height:44px;cursor:pointer}
.hkcj .thumbs button.on{border-color:var(--g)}
.hkcj .thumbs img{width:100%;height:84px;object-fit:cover;border-radius:5px;display:block}
.hkcj .dots{display:none;justify-content:center;gap:4px;margin-top:10px}
.hkcj .dots button{width:44px;height:44px;border:0;background:none;padding:0;cursor:pointer}
.hkcj .dots button i{display:block;width:12px;height:12px;border-radius:50%;background:#b9b2a3;margin:auto}
.hkcj .dots button.on i{background:var(--g)}
/* past kits */
.hkcj .pk{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.hkcj .pk figure{margin:0;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 6px 18px rgba(0,0,0,.1)}
.hkcj .pk img{width:100%;height:440px;object-fit:cover;display:block}
/* Kimberly */
.hkcj .kim{display:grid;grid-template-columns:260px 1fr;gap:36px;align-items:center;max-width:980px;margin:0 auto}
.hkcj .kim figure{margin:0;text-align:center}
.hkcj .kim figure img{width:240px;height:240px;border-radius:50%;object-fit:cover;border:8px solid #fff;box-shadow:0 0 0 4px var(--gold),0 8px 20px rgba(0,0,0,.15)}
.hkcj .kim .note{font-size:20px;line-height:1.6}
.hkcj .kim .sig{font-family:Lora,Georgia,serif;font-style:italic;font-size:30px;color:var(--g);margin:0}
/* offer panel */
.hkcj .offer{display:grid;grid-template-columns:1.15fr 1fr;gap:48px;align-items:center;max-width:1176px;margin:0 auto;background:#fff;border:3px solid var(--g);border-radius:16px;padding:36px}
.hkcj .oimg img{width:100%;border-radius:12px;transform:rotate(-1.5deg);box-shadow:0 10px 26px rgba(0,0,0,.15)}
.hkcj .buy{display:flex;gap:24px;align-items:center;flex-wrap:wrap;background:var(--cr);border-radius:12px;padding:18px 22px;margin-top:18px}
.hkcj .pill{display:inline-block;background:#fdf1d6;border:2px solid var(--gold);color:var(--g);font-weight:700;font-size:18px;border-radius:999px;padding:4px 14px;margin-bottom:8px}
.hkcj .price{font:700 44px "Source Sans 3","Roboto",sans-serif;color:var(--g);margin:0;line-height:1.2}
.hkcj .per{display:block;font-size:18px;color:var(--mu)}
/* FAQ */
.hkcj details{border-bottom:1px solid #d8d0c2;padding:12px 0}
.hkcj summary{font-weight:700;font-size:20px;min-height:44px;display:flex;align-items:center;cursor:pointer}
.hkcj details p{margin:8px 0 0}
.hkcj .sticky{display:none}
@media (max-width:600px){
  .hkcj h1{font-size:34px}.hkcj h2{font-size:28px}.hkcj h3{font-size:22px}
  .hkcj .w{padding:0 16px}
  .hkcj .hero,.hkcj .offer,.hkcj .grid3,.hkcj .grid4{grid-template-columns:1fr;gap:20px}
  .hkcj .hero{padding:28px 0}
  .hkcj .offer{padding:20px}
  .hkcj section{padding:40px 0}
  .hkcj .btn{width:100%}
  .hkcj .slide{flex-basis:86%}.hkcj .slide img{height:300px}
  .hkcj .arw,.hkcj .thumbs{display:none}.hkcj .dots{display:flex}
  .hkcj .pk{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px}
  .hkcj .pk figure{flex:0 0 86%;scroll-snap-align:start}.hkcj .pk img{height:300px}
  .hkcj .kim{grid-template-columns:1fr;gap:18px}
  .hkcj .kim figure img{width:200px;height:200px}
  .hkcj .sticky{display:flex;position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:2px solid var(--g);padding:10px 12px;gap:10px;align-items:center;box-shadow:0 -4px 14px rgba(0,0,0,.15);z-index:1000}
  .hkcj .sticky .btn{min-height:56px;font-size:20px;padding:0 16px}
  .hkcj .sticky span{font-weight:700;color:var(--g);font-size:18px;white-space:nowrap}
  html.html-kit-club-signup body{padding-bottom:84px}
}
/* the Ajax Cart plugin rewrites the offer button's classes, so style it by position */
.hkcj .buy button.add-to-cart-button{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;width:auto;height:auto;min-height:60px;padding:0 34px;background:var(--c);color:#fff;font:700 22px "Source Sans 3","Roboto",sans-serif;text-transform:none;letter-spacing:0;border:0;border-radius:10px;line-height:1.2;opacity:1}
@media (max-width:600px){.hkcj .buy .ajax-cart-button-wrapper,.hkcj .buy button.add-to-cart-button{width:100%}}