/* Journalist Requests & Expert Commentary — page styles.
   Layout approved 13 Oct 2026 (jr-v7). Colours and type come from site.css tokens only.
   Every class is prefixed jr- so nothing here can affect another page. */

.jr-sec{ padding-block:var(--sec-y-sm); border-top:1px solid var(--line-stone) }
.jr-sec h2{ max-width:24ch; text-wrap:balance }
.jr-lede{ font-size:var(--t-lead); color:var(--charcoal-mid); max-width:60ch }
.jr-head{ display:grid; gap:1rem; margin-bottom:clamp(1.85rem,3.4vw,2.6rem) }
.jr-head .eyebrow{ margin-bottom:0 }

/* hero */
.jr-hero{ padding-block:clamp(2rem,4vw,3.6rem) clamp(2.6rem,5vw,4.6rem); display:grid; gap:1.4rem }
.jr-hero .eyebrow{ margin-bottom:0 }
.jr-hero h1{ max-width:18ch; text-wrap:balance }

/* two-column text sections */
.jr-split{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(1.75rem,5vw,4.5rem) }
.jr-split > div{ min-width:0 }
.jr-prose{ display:grid; gap:1.1rem; max-width:62ch; color:var(--charcoal-mid) }

/* how it works */
.jr-steps{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); background:var(--white); border:1px solid var(--line-stone) }
.jr-step{ padding:1.6rem 1.5rem; display:grid; gap:.5rem; align-content:start; min-width:0;
  border-right:1px solid var(--line-stone); border-bottom:1px solid var(--line-stone) }
.jr-step:nth-child(3n){ border-right:0 }
.jr-step:nth-last-child(-n+3){ border-bottom:0 }
.jr-step__n{ font-family:var(--display); font-size:1.5rem; line-height:1; color:var(--olive); font-variant-numeric:tabular-nums }
.jr-step p{ color:var(--charcoal-mid); font-size:.95rem }

/* pricing */
#programs{ scroll-margin-top:7rem }
.jr-cred{ font-size:.88rem; color:var(--charcoal-soft); max-width:72ch; padding-top:1rem; border-top:1px solid var(--line-stone) }
.jr-plans{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1rem,2vw,1.6rem); align-items:stretch }
.jr-plan{ position:relative; min-width:0; background:var(--white); border-top:2px solid var(--citron);
  padding:clamp(1.7rem,2.6vw,2.2rem); display:grid; grid-template-rows:auto auto auto 1fr auto; gap:1.35rem }
.jr-plan--feat{ background:var(--charcoal); color:var(--on-dark); border-top-color:var(--citron);
  box-shadow:0 22px 40px -26px rgba(29,31,30,.45) }
.jr-plan--feat h3{ color:var(--ivory) }
.jr-tag{ position:absolute; top:-.85rem; left:clamp(1.7rem,2.6vw,2.2rem); background:var(--citron); color:var(--charcoal);
  font-size:.64rem; font-weight:600; letter-spacing:.17em; text-transform:uppercase; padding:.35rem .8rem }
.jr-plan h3{ font-size:clamp(1.35rem,1.9vw,1.65rem) }
.jr-for{ font-size:.94rem; color:var(--charcoal-mid); margin-top:.35rem }
.jr-plan--feat .jr-for{ color:var(--on-dark-soft) }
.jr-price{ display:flex; align-items:baseline; flex-wrap:wrap; gap:.5rem }
.jr-price strong{ font-family:var(--display); font-weight:500; font-size:clamp(2.1rem,3.2vw,2.6rem); line-height:1; font-variant-numeric:tabular-nums }
.jr-price span{ font-size:.85rem; color:var(--charcoal-soft) }
.jr-plan--feat .jr-price span{ color:var(--on-dark-soft) }
.jr-cap{ display:flex; align-items:center; gap:1.1rem; padding:1rem 1.15rem; background:var(--stone) }
.jr-plan--feat .jr-cap{ background:rgba(184,201,40,.14) }
.jr-cap b{ font-family:var(--display); font-weight:500; font-size:clamp(3.2rem,5vw,4.1rem); line-height:.9; font-variant-numeric:tabular-nums }
.jr-plan--feat .jr-cap b{ color:var(--citron) }
.jr-cap small{ font-size:.9rem; font-weight:600; line-height:1.35 }
.jr-cap small em{ display:block; font-style:normal; font-weight:400; font-size:.8rem; color:var(--charcoal-soft); margin-top:.2rem }
.jr-plan--feat .jr-cap small em{ color:var(--on-dark-soft) }
.jr-rows{ display:grid }
.jr-rows li{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:1rem; align-items:baseline;
  padding:.7rem 0; border-top:1px solid var(--line-stone); font-size:.9rem }
.jr-plan--feat .jr-rows li{ border-top-color:rgba(244,242,237,.16) }
.jr-rows li span:last-child{ text-align:right; font-weight:600; max-width:22ch }
.jr-rows li.jr-no span:last-child{ font-weight:400; color:var(--charcoal-soft) }
.jr-plan .btn{ justify-content:center; width:100% }

.jr-terms{ margin-top:1.6rem; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.25rem; font-size:.86rem; color:var(--charcoal-mid) }
.jr-terms div{ display:grid; gap:.25rem; align-content:start; min-width:0 }
.jr-terms b{ color:var(--charcoal); font-weight:600 }
.jr-conditions{ margin-top:1.8rem; padding:1.5rem 1.7rem; background:var(--white); border:1px solid var(--line-stone) }
.jr-conditions h3{ font-size:1.1rem; margin-bottom:.8rem }
.jr-conditions ul{ columns:2; column-gap:2.5rem; font-size:.86rem; color:var(--charcoal-mid); line-height:1.6 }
.jr-conditions li{ break-inside:avoid; padding-left:1rem; position:relative; margin-bottom:.55rem }
.jr-conditions li::before{ content:""; position:absolute; left:0; top:.6em; width:.4rem; height:.4rem; background:var(--citron) }

/* why Mackasey */
.jr-more{ background:var(--white); border:1px solid var(--line-stone); padding:clamp(1.8rem,4vw,3rem);
  display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:clamp(1.75rem,4vw,3.5rem) }
.jr-more > div{ min-width:0 }
.jr-more__copy{ display:grid; gap:1rem; align-content:start }
.jr-more__copy .eyebrow{ margin-bottom:0 }
.jr-more__copy p:not(.eyebrow){ color:var(--charcoal-mid) }
.jr-pillars > div{ padding-block:1rem; border-top:1px solid var(--line-stone); display:grid; gap:.25rem }
.jr-pillars > div:first-child{ border-top:0; padding-top:0 }
.jr-pillars b{ font-weight:600 }
.jr-pillars p{ font-size:.93rem; color:var(--charcoal-mid) }
.jr-report-head{ margin-top:clamp(2.4rem,4vw,3.4rem); display:grid; gap:.4rem }
.jr-report-head p{ color:var(--charcoal-mid) }
.jr-report{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:1.5rem; border-top:2px solid var(--charcoal) }
.jr-report div{ padding:1.1rem 1.1rem 0 0; display:grid; gap:.35rem; min-width:0; align-content:start }
.jr-report b{ font-family:var(--display); font-weight:500; font-size:1.15rem }
.jr-report p{ font-size:.88rem; color:var(--charcoal-mid) }

/* proof */
.jr-proof{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(1.75rem,5vw,4rem) }
.jr-proof > div{ min-width:0; display:grid; gap:1rem; align-content:start }
.jr-proof .eyebrow{ margin-bottom:0 }
.jr-proof p{ color:var(--charcoal-mid) }
.jr-outlets{ display:flex; flex-wrap:wrap; gap:.4rem 1.3rem; font-family:var(--display); font-size:1.2rem; color:var(--charcoal) !important }
.jr-case{ background:var(--white); border-top:2px solid var(--citron); padding:1.3rem 1.4rem; display:grid; gap:.5rem }
.jr-case b{ font-family:var(--display); font-weight:500; font-size:1.15rem }
.jr-case p{ font-size:.93rem }
.jr-quote{ align-self:center }
.jr-quote blockquote{ margin:0; font-family:var(--display); font-style:italic; font-size:clamp(1.25rem,1.9vw,1.55rem); line-height:1.46; color:var(--charcoal) }
.jr-quote figcaption{ margin-top:1rem; font-size:.78rem; letter-spacing:.06em; color:var(--charcoal-soft) }
.jr-quote figcaption strong{ display:block; color:var(--charcoal); font-weight:600; letter-spacing:.14em; text-transform:uppercase; font-size:.7rem; margin-bottom:.2rem }

/* FAQ */
.jr-faq{ max-width:860px }
.jr-faq details{ border-top:1px solid var(--line-stone) }
.jr-faq details:last-child{ border-bottom:1px solid var(--line-stone) }
.jr-faq summary{ cursor:pointer; list-style:none; position:relative; padding:1.15rem 2.5rem 1.15rem 0;
  font-family:var(--display); font-weight:500; font-size:var(--t-h3); line-height:1.32 }
.jr-faq summary::-webkit-details-marker{ display:none }
.jr-faq summary::after{ content:"+"; position:absolute; right:.25rem; top:.95rem; font-family:var(--sans); font-weight:400; font-size:1.5rem; color:var(--olive) }
.jr-faq details[open] summary::after{ content:"\2212" }
.jr-faq__a{ padding:0 0 1.35rem; display:grid; gap:.8rem; max-width:70ch; color:var(--charcoal-mid); font-size:.95rem }

/* closing */
.jr-final{ display:grid; gap:1.2rem; padding-block:var(--sec-y) }
.jr-final .eyebrow{ margin-bottom:0 }
.jr-final .btn-row{ margin-top:.5rem }

@media (max-width:900px){
  .jr-split,.jr-more,.jr-proof{ grid-template-columns:1fr }
  .jr-plans{ grid-template-columns:1fr; gap:2.2rem }
  .jr-plan--feat{ order:-1 }
  .jr-steps{ grid-template-columns:1fr 1fr }
  .jr-step{ border-right:1px solid var(--line-stone) !important; border-bottom:1px solid var(--line-stone) !important }
  .jr-step:nth-child(2n){ border-right:0 !important }
  .jr-step:nth-last-child(-n+2){ border-bottom:0 !important }
  .jr-terms{ grid-template-columns:1fr 1fr }
  .jr-conditions ul{ columns:1 }
  .jr-report{ grid-template-columns:1fr 1fr; row-gap:1rem }
}
@media (max-width:520px){
  .jr-steps{ grid-template-columns:1fr }
  .jr-step{ border-right:0 !important; border-bottom:1px solid var(--line-stone) !important }
  .jr-step:last-child{ border-bottom:0 !important }
  .jr-terms{ grid-template-columns:1fr }
  .jr-conditions{ padding:1.25rem }
}
