/* =========================================================
   Shared overlay
========================================================= */
.hrm-overlay{
  position:fixed; inset:0; z-index:99999;
  background:rgba(18,20,28,0.72);
  display:none; align-items:flex-start; justify-content:center;
  padding:32px 16px; overflow-y:auto;
  font-family:'Work Sans', sans-serif;
}
.hrm-overlay.hrm-show{display:flex;}
.hrm-hp{position:absolute !important; left:-9999px !important; width:1px; height:1px; opacity:0;}

/* =========================================================
   Submit Your Voice modal
========================================================= */
#hrm-voice-overlay .hrm-modal{
  position:relative; background:#F8F4EA; color:#12141C;
  width:100%; max-width:520px; border-radius:10px;
  padding:34px 30px 30px; box-shadow:0 30px 70px rgba(0,0,0,0.35);
}
.hrm-close{
  position:absolute; top:14px; right:16px; border:none; background:transparent;
  font-size:26px; line-height:1; cursor:pointer; color:#12141C; opacity:0.6;
}
.hrm-close:hover{opacity:1;}
.hrm-close-light{color:#F7F4EC;}

.hrm-eyebrow{
  font-family:'Space Mono', monospace; font-size:10.5px; letter-spacing:0.14em;
  text-transform:uppercase; color:#AE5734; margin-bottom:6px;
}
#hrm-voice-overlay h3{font-family:'Fraunces', serif; font-size:26px; margin:0 0 8px;}
.hrm-sub{font-size:13.5px; opacity:0.7; margin:0 0 22px;}

.hrm-field{margin-bottom:16px;}
.hrm-field label{
  display:flex; justify-content:space-between; align-items:baseline;
  font-family:'Space Mono', monospace; font-size:10.5px; letter-spacing:0.06em;
  text-transform:uppercase; opacity:0.65; margin-bottom:6px;
}
.hrm-word-count{font-family:'Work Sans', sans-serif; text-transform:none; letter-spacing:0; opacity:0.7;}
.hrm-word-count.hrm-over{color:#AE5734; font-weight:700;}
.hrm-field input[type="text"],
.hrm-field input[type="email"],
.hrm-field select,
.hrm-field textarea{
  width:100%; border:1.5px solid rgba(18,20,28,0.15); border-radius:8px;
  padding:11px 13px; font-size:14px; font-family:'Work Sans', sans-serif;
  background:#fff; color:#12141C;
}
.hrm-field input[type="file"]{width:100%; font-size:13px;}
.hrm-field textarea{resize:vertical;}
.hrm-field-row{display:flex; gap:14px;}
.hrm-field-row .hrm-field{flex:1;}

.hrm-error{color:#AE5734; font-size:13px; margin:-4px 0 12px; min-height:1px;}
.hrm-submit-btn{
  width:100%; background:#12141C; color:#F8F4EA; border:none; border-radius:999px;
  padding:14px 20px; font-size:13px; font-weight:700; letter-spacing:0.06em;
  text-transform:uppercase; cursor:pointer;
}
.hrm-submit-btn:disabled{opacity:0.6; cursor:default;}

.hrm-success{display:none; text-align:center; padding:10px 6px;}
.hrm-success.hrm-show{display:block;}
.hrm-check{
  width:56px; height:56px; border-radius:50%; background:#12141C; color:#F8F4EA;
  display:flex; align-items:center; justify-content:center; margin:0 auto 18px; font-size:24px;
}
.hrm-success h3{font-family:'Fraunces', serif; font-size:22px; margin:0 0 10px;}
.hrm-success p{font-size:13.5px; opacity:0.75; line-height:1.6; margin:0 0 22px;}

@media (max-width:600px){
  .hrm-field-row{flex-direction:column; gap:0;}
}

/* =========================================================
   Subscribe modal — full redesign matching the client-provided
   reference page (emerald/gold palette, Bodoni Moda + Manrope).
========================================================= */
#hrm-subscribe-overlay{ padding:0; background:rgba(12,31,26,0.82); align-items:flex-start; }
#hrm-subscribe-overlay .hrm-sub-page{
  --emerald:#16332C; --emerald-deep:#0C1F1A; --emerald-soft:#24443B;
  --gold:#C9A227; --gold-soft:#E4C766; --cream:#F7F4EC; --ink:#17191A;
  --sage:#A9BFB4; --line:rgba(23,25,26,0.12); --line-light:rgba(247,244,236,0.18);
  position:relative; width:100%; max-width:480px; margin:0 auto;
  background:var(--cream); color:var(--ink); font-family:'Manrope', sans-serif;
  border-radius:0; min-height:100vh; padding-bottom:0; overflow:hidden;
}
@media (min-width:560px){
  #hrm-subscribe-overlay{padding:26px 16px;}
  #hrm-subscribe-overlay .hrm-sub-page{min-height:auto; max-height:92vh; overflow-y:auto; border-radius:16px; box-shadow:0 30px 70px rgba(0,0,0,0.4);}
}

.hrm-sub-page h1, .hrm-sub-page h2, .hrm-sub-page h3{font-family:'Bodoni Moda', serif;}

/* ---- Masthead ---- */
.hrm-sub-masthead{text-align:center; padding:34px 24px 16px; background:var(--cream);}
.hrm-sub-cover{display:none;} /* replaced by the hero visual below */
.hrm-sub-word{font-family:'Bodoni Moda',serif; font-weight:700; font-size:38px; letter-spacing:3px; margin:0; color:var(--ink);}
.hrm-sub-word-img{height:90px; width:auto; margin:0 auto; display:block;}
.hrm-sub-eyebrow{margin-top:6px; font-size:10.5px; letter-spacing:4px; font-weight:700; color:var(--gold); text-transform:uppercase;}

/* ---- Hero (copy + tilted cover visual) ---- */
.hrm-sub-hero{display:flex; align-items:center; gap:16px; padding:4px 24px 24px;}
.hrm-sub-hero-copy{flex:1.15;}
.hrm-sub-hero h1{font-size:25px; line-height:1.16; margin:0 0 12px; font-weight:600;}
.hrm-sub-hero em{font-style:italic; color:var(--gold);}
.hrm-sub-hero p{font-size:13.5px; line-height:1.55; margin:0; color:#3c4340;}
.hrm-strike{text-decoration:line-through; opacity:0.55;}
.hrm-sub-hero-visual{flex:1; display:flex; justify-content:center; align-items:center; position:relative; min-height:100px;}
.hrm-sub-hero-visual::before{
  content:""; position:absolute; width:140px; height:140px;
  background:radial-gradient(circle, rgba(201,162,39,0.35), rgba(201,162,39,0) 70%); z-index:0;
}
.hrm-sub-hero-visual .frame{position:relative; z-index:1; width:100px; aspect-ratio:3/4; border-radius:8px; overflow:hidden; transform:rotate(6deg); box-shadow:0 20px 34px rgba(12,31,26,0.35); border:3px solid var(--cream);}
.hrm-sub-hero-visual .frame img{display:block; width:100%;}

/* ---- Cover slideshows (hero visual + "What's included" card) ---- */
.hrm-slideshow{position:relative; overflow:hidden;}
.hrm-slideshow .hrm-slide{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity 1s ease; pointer-events:none;
}
.hrm-slideshow .hrm-slide.hrm-slide-active{opacity:1; pointer-events:auto;}

/* ---- Toggle ---- */
.hrm-toggle-wrap{padding:0 24px 20px;}
.hrm-toggle{position:relative; display:flex; background:#DCD7C8; border-radius:999px; padding:5px; height:48px;}
.hrm-thumb{position:absolute; top:5px; left:5px; width:calc(50% - 5px); height:calc(100% - 10px); background:var(--cream); border:1.5px solid var(--ink); border-radius:999px; transition:transform .3s cubic-bezier(.65,0,.35,1);}
.hrm-toggle.hrm-state-print .hrm-thumb{transform:translateX(100%);}
.hrm-toggle button{position:relative; z-index:1; flex:1; border:0; background:transparent; font-family:'Manrope',sans-serif; font-weight:800; font-size:12px; letter-spacing:0.06em; color:#565f5a; cursor:pointer;}
.hrm-toggle button.hrm-active{color:var(--ink);}

/* ---- Pricing panels ---- */
.hrm-panels{padding:0 24px;}
.hrm-panel{display:none;}
.hrm-panel.hrm-active{display:block;}
.hrm-price-card{border:1.5px solid var(--line); border-radius:16px; padding:18px 18px 16px; margin-bottom:14px; position:relative; background:var(--cream);}
.hrm-price-card.hrm-selected,
.hrm-price-card.hrm-hero-offer{border-color:var(--ink); border-width:2px;}
.hrm-badge{position:absolute; top:-11px; right:16px; background:var(--ink); color:var(--cream); font-size:10px; font-weight:800; letter-spacing:1px; padding:5px 12px; border-radius:999px; text-transform:uppercase;}
.hrm-price-head{display:flex; align-items:flex-start; gap:10px;}
.hrm-radio{width:18px; height:18px; min-width:18px; border-radius:50%; border:1.5px solid #9aa39d; margin-top:3px; position:relative;}
.hrm-selected .hrm-radio, .hrm-hero-offer .hrm-radio{border-color:var(--ink);}
.hrm-selected .hrm-radio::after, .hrm-hero-offer .hrm-radio::after{content:""; position:absolute; inset:3px; border-radius:50%; background:var(--ink);}
.hrm-price-head h3{margin:0; font-size:17px; font-weight:600;}
.hrm-amount{font-size:19px; font-weight:800; margin:2px 0 10px 28px; font-family:'Manrope',sans-serif;}
.hrm-includes{margin:0 0 8px 28px; padding:9px 12px; border:1px dashed #b7bfb9; border-radius:9px; font-size:12.5px; line-height:1.5;}
.hrm-fine{margin:0 0 0 28px; font-size:11px; color:#7c8580; font-style:italic;}

/* ---- Cover picker ---- */
.hrm-cover-pick{padding:4px 24px 20px;}
.hrm-cover-pick-head h3{font-size:18px; margin:0 0 4px; font-weight:600;}
.hrm-cover-pick-head p{font-size:12.5px; opacity:0.7; margin:0 0 14px;}
.hrm-cover-pick-scroll{
  display:flex; gap:12px; overflow-x:auto; -webkit-overflow-scrolling:touch;
  padding-bottom:6px; scroll-snap-type:x mandatory;
}
.hrm-cover-pick-item{
  flex:0 0 auto; width:92px; border:2px solid transparent; border-radius:10px;
  background:transparent; padding:0; cursor:pointer; scroll-snap-align:start;
  text-align:center; font-family:'Manrope', sans-serif;
}
.hrm-cover-pick-img-wrap{position:relative; display:block;}
.hrm-cover-pick-item img{
  width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:8px; display:block;
  box-shadow:0 8px 18px rgba(12,31,26,0.18);
}
.hrm-cover-check{
  position:absolute; top:6px; right:6px; width:22px; height:22px; border-radius:50%;
  background:#2e9e5b; color:#fff; font-size:12px; font-weight:800; line-height:22px;
  text-align:center; box-shadow:0 2px 6px rgba(12,31,26,0.35);
  opacity:0; transform:scale(0.6); transition:opacity .18s ease, transform .18s ease;
}
.hrm-cover-pick-title{
  display:block; font-size:10.5px; margin-top:6px; line-height:1.3; color:var(--ink); opacity:0.75;
}
.hrm-cover-pick-item.hrm-cover-selected img{box-shadow:0 0 0 2px var(--gold), 0 8px 18px rgba(12,31,26,0.3);}
.hrm-cover-pick-item.hrm-cover-selected .hrm-cover-check{opacity:1; transform:scale(1);}
.hrm-cover-pick-item.hrm-cover-selected .hrm-cover-pick-title{opacity:1; font-weight:700;}

.hrm-cta{
  display:block; width:calc(100% - 48px); margin:6px 24px 6px; background:var(--ink); color:var(--cream);
  border:none; padding:15px 20px; border-radius:999px; font-family:'Manrope',sans-serif; font-weight:800; font-size:13px;
  letter-spacing:0.05em; text-transform:uppercase; cursor:pointer;
}
.hrm-cta:hover{background:var(--emerald);}
.hrm-instructions{font-size:12.5px; opacity:0.7; padding:0 24px; margin:14px 0 8px; line-height:1.5;}
.hrm-sub-follow{font-size:12.5px; opacity:0.8; padding:0 24px 8px; display:flex; align-items:center; gap:8px;}
.hrm-sub-follow a{color:var(--ink); font-weight:700; text-decoration:underline;}
.hrm-dot{color:var(--gold);}

.hrm-sub-rule{border:0; border-top:1px solid var(--line); margin:14px 24px 22px;}

/* ---- Included / cover section ---- */
.hrm-sub-included{padding:0 24px 6px;}
.hrm-sub-included h2{font-size:21px; margin:0 0 14px; font-weight:600;}
.hrm-sub-included .sub-eyebrow{font-style:italic; font-size:16px; margin:0 0 2px;}
.hrm-sub-included .sub-copy{font-size:13px; color:#3c4340; margin:0 0 16px;}
.hrm-sub-cover-wrap{display:flex; justify-content:center; margin-bottom:16px;}
.hrm-sub-cover-wrap .cover-card{width:70%; aspect-ratio:3/4; border-radius:10px; overflow:hidden; box-shadow:0 26px 46px rgba(12,31,26,0.28);}
.hrm-sub-cover-wrap img{display:block; width:100%;}

/* ---- Gift banner ---- */
.hrm-sub-gift{margin:0 24px 26px; background:var(--emerald); color:var(--cream); border-radius:16px; padding:26px 22px; text-align:center;}
.hrm-sub-gift h3{font-weight:600; font-size:18px; margin:0 0 16px; line-height:1.35;}
.hrm-sub-gift h3 em{color:var(--gold-soft); font-style:italic;}
.hrm-sub-gift button{background:transparent; border:1.5px solid var(--cream); color:var(--cream); padding:11px 22px; border-radius:999px; font-family:'Manrope',sans-serif; font-weight:800; font-size:12px; letter-spacing:0.8px; cursor:pointer;}
.hrm-sub-gift button:hover{background:var(--cream); color:var(--emerald);}

/* ---- FAQ ---- */
.hrm-sub-faq{padding:0 24px 8px;}
.hrm-sub-faq h2{font-size:21px; margin:0 0 6px; font-weight:600;}
.hrm-faq-item{border-top:1px solid var(--line); padding:16px 0;}
.hrm-faq-item:last-child{border-bottom:1px solid var(--line);}
.hrm-faq-q{display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-weight:700; font-size:13.5px; font-family:'Manrope',sans-serif;}
.hrm-faq-q .hrm-chev{transition:transform .25s ease; font-size:14px; color:#565f5a;}
.hrm-faq-item.hrm-open .hrm-chev{transform:rotate(180deg);}
.hrm-faq-a{max-height:0; overflow:hidden; transition:max-height .3s ease; font-size:13px; color:#3c4340; line-height:1.6;}
.hrm-faq-item.hrm-open .hrm-faq-a{max-height:240px; padding-top:10px;}

/* ---- Sub-footer + sticky CTA bar ---- */
.hrm-sub-footer{background:var(--emerald-deep); color:var(--sage); margin-top:30px;}
.hrm-sub-footer-inner{padding:30px 24px 18px;}
.hrm-sub-footer .word{font-family:'Bodoni Moda',serif; font-weight:700; font-size:24px; color:var(--cream); text-align:center; letter-spacing:2px; margin:0 0 18px;}
.hrm-sub-footer .word-img{height:62px; width:auto; margin:0 auto 18px; display:block; filter:drop-shadow(1px 1px 0 #fff) drop-shadow(-1px -1px 0 #fff) drop-shadow(1px -1px 0 #fff) drop-shadow(-1px 1px 0 #fff) drop-shadow(1px 0 0 #fff) drop-shadow(-1px 0 0 #fff) drop-shadow(0 1px 0 #fff) drop-shadow(0 -1px 0 #fff);}
.hrm-sub-footer a{color:var(--gold-soft); text-decoration:underline;}
.hrm-sub-footer p{font-size:11.5px; line-height:1.7; margin:0 0 12px;}
.hrm-sub-legal{text-align:center; font-size:11.5px; line-height:2.1; border-top:1px solid var(--line-light); padding:16px 24px 18px;}
.hrm-sub-legal a{margin:0 6px; color:var(--gold-soft);}

.hrm-sub-bottombar{
  position:sticky; bottom:0; display:flex; align-items:center; justify-content:space-between; gap:14px;
  background:var(--ink); color:var(--cream); padding:14px 20px; z-index:5;
}
.hrm-sub-bottombar .info{font-size:11px; line-height:1.4;}
.hrm-sub-bottombar .info b{display:block; font-size:12.5px; letter-spacing:0.3px;}
.hrm-sub-bottombar button{
  background:var(--gold); color:var(--emerald-deep); border:0; padding:12px 18px; border-radius:999px;
  font-family:'Manrope',sans-serif; font-weight:800; font-size:12px; letter-spacing:0.4px; white-space:nowrap; cursor:pointer;
}
.hrm-sub-bottombar button:hover{background:var(--gold-soft);}

/* ---- Payment / receipt form ---- */
.hrm-pay-wrap{display:none; padding:24px 24px 0;}
.hrm-pay-wrap.hrm-show{display:block;}
.hrm-pay-form h3{font-size:20px; margin:10px 0 6px;}
.hrm-sub-note{font-size:12.5px; opacity:0.75; margin:0 0 16px;}
.hrm-pay-form .hrm-field{margin-bottom:14px;}
.hrm-pay-form .hrm-field label{
  font-family:'Space Mono',monospace; font-size:10.5px; letter-spacing:0.06em; text-transform:uppercase;
  opacity:0.6; display:block; margin-bottom:6px;
}
.hrm-pay-form input{
  width:100%; border:1.5px solid rgba(23,25,26,0.15); border-radius:8px; padding:11px 13px;
  font-size:14px; background:#fff; color:var(--ink); font-family:'Manrope',sans-serif;
}
.hrm-pay-form .hrm-submit-btn{background:var(--ink); color:var(--cream); font-family:'Manrope',sans-serif;}

#hrm-sub-success{display:none; text-align:center; padding:20px 24px 40px;}
#hrm-sub-success.hrm-show{display:block;}
#hrm-sub-success .hrm-check{background:var(--emerald);}
#hrm-sub-success h3{font-size:20px; margin:0 0 10px;}
.hrm-success-cover{display:flex; align-items:center; justify-content:center; gap:12px; margin:0 0 16px;}
.hrm-success-cover img{width:52px; aspect-ratio:3/4; object-fit:cover; border-radius:6px; box-shadow:0 8px 16px rgba(12,31,26,0.25);}
.hrm-success-cover span{font-size:13.5px; font-weight:700; text-align:left; max-width:24ch;}

@media (max-width:420px){
  .hrm-sub-hero{flex-direction:column; text-align:center;}
  .hrm-sub-hero-visual{order:-1; margin-bottom:6px;}
}
