/* SourcingPromo — the destination pages: the solutions hub and a single service, the occasion hub
   and a single occasion, the FAQs, about, contact, the short quote form, its confirmation, the
   privacy page and the 404.

   Every rule is prefixed `pages-` so it can never reach another page's markup, and every value comes
   from tokens.css. Mobile first: one column, and the second column only from the width where the
   reading actually needs it. Nothing here needs JavaScript — the FAQ is a native details/summary. */

/* ---------- page rhythm ---------- */
.pages-hero__inner{display:grid;gap:1.5rem}
.pages-hero__copy{display:flex;flex-direction:column;gap:1rem;min-width:0}
.pages-hero__lede{max-width:65ch}
.pages-hero__actions{margin:.25rem 0 0}
.pages-hero__media{
  margin:0;border:1px solid var(--line);border-radius:var(--radius-lg);
  overflow:hidden;background:var(--sand-2);
}
.pages-hero__img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
@media (min-width:960px){
  .pages-hero--media .pages-hero__inner{
    grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
    align-items:center;gap:clamp(1.5rem,4vw,3rem);
  }
}
.pages-prose{max-width:var(--maxw-narrow)}
.pages-text{color:var(--ink-2);max-width:70ch;line-height:1.6;margin:0}
.pages-locked{max-width:34rem}

/* ---------- cards (services, occasions, related reading) ---------- */
.pages-cards,.pages-related__grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr))}
.pages-card{min-width:0}
.pages-card__media{display:block}
.pages-card__img{width:100%;height:100%;object-fit:cover}
.pages-card__placeholder{width:100%;height:100%;letter-spacing:.08em}
.pages-card__text{margin:0;line-height:1.5}
.pages-card__foot{align-items:center}
.pages-card .link-arrow{align-self:flex-start}

/* ---------- a block of fixed wording ---------- */
.pages-block{max-width:88ch}
.pages-block+.pages-block{margin-top:clamp(2rem,4vw,3rem)}
.pages-block h2{margin-bottom:.6rem}
.pages-block .note+.cluster{margin-top:1.1rem}

/* ---------- a parent occasion's own children (taxonomy-occasion.php) ---------- */
.pages-subterms__title{
  margin:0;font-size:var(--step--1);font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-3);
}
.pages-subterms__list{list-style:none;margin:0;padding:0}
.pages-subterms__list a.tag{text-decoration:none;border:1px solid transparent}
.pages-subterms__list a.tag:hover{border-color:var(--brand);background:var(--brand-tint);color:var(--brand-dark)}
.pages-block--plain{max-width:74ch}
.pages-block-section .wrap>h2{margin-bottom:.6rem}
.pages-step h3,.pages-point h3{font-size:var(--step-1);margin-bottom:.3rem}
.pages-step p:last-child,.pages-point p:last-child{margin:0}

/* ---------- numbered steps ---------- */
.pages-steps{list-style:none;margin:1.25rem 0 0;padding:0;display:grid;gap:1.15rem}
@media (min-width:720px){
  .pages-steps{grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr))}
}
.pages-step{min-width:0}
.pages-step__num{
  margin:0 0 .35rem;font-family:var(--font-mono);font-size:var(--step--1);
  font-weight:600;letter-spacing:.1em;color:var(--brand-dark);
}
.pages-steps-section .wrap>h2{margin-bottom:.4rem}

/* ---------- points (four short claims) ---------- */
.pages-points{list-style:none;margin:1.25rem 0 0;padding:0;display:grid;gap:1.15rem}
@media (min-width:720px){
  .pages-points{grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr))}
}
.pages-point{min-width:0}

/* ---------- lists ---------- */
.pages-list{margin:.9rem 0 0;padding-left:1.15rem;display:grid;gap:.45rem;color:var(--ink-2);max-width:72ch}
.pages-list li{line-height:1.55}
.pages-list--check{list-style:none;padding-left:0}
.pages-list--check li{position:relative;padding-left:1.7rem}
.pages-list--check li::before{
  content:"";position:absolute;left:.15rem;top:.5em;
  width:.6rem;height:.32rem;border-left:2px solid var(--ok);border-bottom:2px solid var(--ok);
  transform:rotate(-45deg);
}

/* ---------- panels ---------- */
.pages-panel{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:clamp(1.1rem,2.4vw,1.6rem);display:flex;flex-direction:column;gap:.8rem;min-width:0;
}
.pages-panel--sand{background:var(--sand)}
.pages-panel__title{font-size:var(--step-1)}
.pages-panel .note{max-width:58ch}
.pages-panel .cluster{margin:0}
.pages-panel .facts{margin:0}
.pages-about-lines{margin-top:1.25rem;max-width:44rem}
.pages-about-membership .pages-panel{max-width:50rem}

/* ---------- one service: reading column plus the quote panel ---------- */
.pages-service__inner{display:grid;gap:clamp(1.5rem,4vw,3rem)}
.pages-service__main{min-width:0}
@media (min-width:960px){
  .pages-service__inner{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);align-items:start}
  .pages-service__aside{position:sticky;top:5.5rem;align-self:start}
}
.pages-related__block+.pages-related__block{margin-top:1.75rem}
.pages-related__title{font-size:var(--step-2);margin-bottom:1rem}

/* ---------- occasions: the product list ---------- */
.pages-head{margin-bottom:1.25rem;display:flex;flex-direction:column;gap:.4rem}
.pages-head h2{font-size:var(--step-2)}
.pages-products{grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr))}
.pages-more{margin-top:1.5rem}
.pages-pagination{margin-top:1.75rem}
.pages-pagination .nav-links{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.pages-pagination .page-numbers{
  display:inline-flex;align-items:center;justify-content:center;min-width:2.25rem;height:2.25rem;
  padding:0 .55rem;border:1px solid var(--line-strong);border-radius:var(--radius-sm);
  background:var(--paper);color:var(--ink-2);font-size:var(--step--1);
  font-weight:600;text-decoration:none;
}
.pages-pagination .page-numbers:hover{border-color:var(--ink);color:var(--ink)}
.pages-pagination .page-numbers.current{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.pages-pagination .screen-reader-text{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ---------- the FAQ disclosure ---------- */
.pages-faq__group{border-top:1px solid var(--line);margin-top:2rem;padding-top:1.5rem}
.pages-faq__group:first-child{border-top:0;margin-top:0;padding-top:0}
.pages-faq__title{font-size:var(--step-2);margin-bottom:1rem}
.pages-faq__items{display:grid;gap:.6rem;max-width:80ch}
.pages-faq__item{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);
  padding:.85rem 1.05rem;
}
.pages-faq__item[open]{background:var(--sand);border-color:var(--line-strong)}
.pages-faq__q{
  display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;
  list-style:none;cursor:pointer;font-size:1.0625rem;font-weight:600;line-height:1.35;
}
.pages-faq__q::-webkit-details-marker{display:none}
.pages-faq__marker{
  flex:0 0 auto;width:.7rem;height:.7rem;margin-top:.4rem;
  border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);
  transform:rotate(45deg);transition:transform .15s;
}
.pages-faq__item[open] .pages-faq__marker{transform:rotate(-135deg);border-color:var(--brand-dark)}
.pages-faq__answer{
  margin-top:.7rem;padding-top:.7rem;border-top:1px solid var(--line);
  color:var(--ink-2);line-height:1.6;max-width:70ch;
}
.pages-faq__answer p{margin:0}
.pages-faq__answer p+p{margin-top:.6rem}
.pages-faq__q:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:var(--radius-sm)}
@media (prefers-reduced-motion:reduce){.pages-faq__marker{transition:none}}

/* ---------- empty states ---------- */
.pages-empty{max-width:60ch;margin-inline:auto;display:flex;flex-direction:column;gap:.6rem}
.pages-empty p{margin:0}
.pages-empty__actions{justify-content:center;margin-top:.5rem}

/* ---------- the quote call to action ---------- */
.pages-cta{background:var(--sand);border-top:1px solid var(--line)}
.pages-cta__inner{display:grid;gap:1.25rem}
@media (min-width:860px){
  .pages-cta__inner{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:center;gap:2rem}
}
.pages-cta__copy{display:flex;flex-direction:column;gap:.7rem;min-width:0}
.pages-cta__actions{margin:0}

/* ---------- the 404 ---------- */
.pages-search{display:grid;gap:.5rem;margin-top:.5rem;max-width:36rem}
.pages-search__label{font-size:var(--step--1);font-weight:600;color:var(--ink-2)}
@media (min-width:560px){
  .pages-search{grid-template-columns:minmax(0,1fr) auto;align-items:end}
  .pages-search__label{grid-column:1/-1}
}
.pages-doors{list-style:none;margin:1.25rem 0 0;padding:0;display:grid;gap:1.1rem}
@media (min-width:720px){
  .pages-doors{grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr))}
}
.pages-door{
  background:var(--sand);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:1.1rem 1.2rem;display:flex;flex-direction:column;gap:.4rem;min-width:0;
}
.pages-door h3{font-size:var(--step-1)}
.pages-door h3 a{text-decoration:none}
.pages-door p{margin:0}
.pages-404__cta{margin-top:clamp(1.5rem,4vw,2.5rem)}

/* ---------- focus ---------- */
.pages-card .link-arrow:focus-visible,
.pages-door h3 a:focus-visible,
.pages-more a:focus-visible,
.pages-faq__q:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:var(--radius-sm)}

/* ---------- print: the page without its controls ---------- */
@media print{
  .pages-cta,.pages-pagination,.pages-search,.pages-faq__marker{display:none}
  .pages-faq__item{border:0;padding:0;background:none}
}
