/* case-head.css — the poster-style top of a case-study page (scifinder, formulus, analytical methods).
   Tokens only, no new colours or fonts. Language borrowed from the home page's work panels: a flat
   CAS-green field, a giant one-tone title cropped by the field's bottom edge, small type set full
   width above it. Loads after scifinder-layout.css, which declares GT America Condensed.

   The giant word is sized as width / ratio, where ratio = the word's width at font-size 1 in Harry
   Obese at .02em tracking. Change a title and the ratio (--ratio, set on .ph-word) must be re-measured. */
.poster-head{
  position:relative;overflow:hidden;
  background:var(--ph-ground,var(--forest-700));
  color:var(--apricot-50);
  --focus-ring:var(--apricot-50);
}
/* the company's colours, as on the home page's work panels (CAS is the default) */
.poster-head--oclc{--ph-ground:var(--inkblue-700);--ph-deep:var(--inkblue-900);}
.poster-head--craft{--ph-ground:var(--orange-700);--ph-deep:var(--orange-900);}
/* a header with no tagline: the info block follows the back pill directly */
.ph-inner--nolead .ph-info{padding-top:0;}
/* pages with no write-up yet: just the back pill and the giant title */
.ph-inner--title .ph-word{margin-top:clamp(3rem,8vw,7rem);}
.poster-head a,.poster-head p,.poster-head h2,.poster-head dd{color:inherit;}   /* site.css sets dark ink on these */
.ph-inner{
  max-width:96rem;margin-inline:auto;
  padding:clamp(1.5rem,3vw,2.5rem) var(--step) 0;
  container-type:inline-size;
  display:grid;
  grid-template-columns:minmax(0,1fr);
}

.ph-back{
  grid-row:1;
  font-family:var(--gt,"GT America Condensed",var(--ui));font-weight:500;
  font-size:.9rem;letter-spacing:.14em;text-transform:uppercase;line-height:1;
}
.ph-back a{text-decoration:none;border:1px solid currentColor;border-radius:999px;padding:.55rem .95rem;display:inline-block;transition:background-color .2s ease,color .2s ease;}
.ph-back a:hover{background:var(--apricot-50);color:var(--ph-ground,var(--forest-700));}

.ph-lead{grid-row:2;padding-top:clamp(1.75rem,4vw,3.5rem);}
.ph-line{
  font-family:var(--display-alt);font-weight:400;
  font-size:clamp(1.6rem,4vw,3.75rem);line-height:1.1;letter-spacing:-.005em;
  text-wrap:balance;
}

.ph-info{grid-row:3;padding-bottom:clamp(3rem,7vw,6.5rem);}   /* air between the jump links and the giant word */
.ph-facts{display:flex;flex-wrap:wrap;margin:clamp(1.75rem,3vw,2.5rem) 0 0;padding:0;border-top:1px solid var(--apricot-50);}
.ph-facts > div{padding:clamp(.85rem,1.4vw,1.1rem) 1.5rem 0;border-left:1px solid color-mix(in srgb,var(--apricot-50) 40%,transparent);display:flex;flex-direction:column;gap:.3rem;}
.ph-facts > div:first-child{padding-left:0;border-left:none;}
.ph-facts dt{font-family:var(--display-alt);font-weight:400;font-size:1.0625rem;line-height:1.2;color:var(--apricot-100);}   /* apricot 200 was 4.46:1 on forest 700, just under AA; 100 is 5.39:1 */
.ph-facts dd{margin:0;font-family:var(--body-text);font-size:1.05rem;line-height:1.4;letter-spacing:.022em;}
.ph-overview{margin-top:clamp(1.5rem,3vw,2.25rem);}
.ph-overview h2{font-family:var(--display-alt);font-weight:400;font-size:clamp(1.5rem,2.2vw,2rem);line-height:1;text-transform:uppercase;letter-spacing:.02em;}
.ph-overview p{margin-top:.9rem;max-width:72rem;font-family:var(--body-text);font-size:clamp(1rem,1.15vw,1.15rem);line-height:1.5;letter-spacing:.022em;}
.ph-nav{
  display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.5rem;
  margin-top:clamp(1.25rem,2.4vw,1.75rem);padding-top:1rem;border-top:1px solid var(--apricot-50);
  font-family:var(--body-text);font-size:1.05rem;letter-spacing:.022em;
}
.ph-nav-label{font-family:var(--gt,"GT America Condensed",var(--ui));font-weight:500;font-size:.9rem;letter-spacing:.14em;text-transform:uppercase;margin-right:-.5rem;}
.ph-nav a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.28em;}
.ph-nav a:hover{text-decoration-thickness:2px;}

/* the page's real title: the h1 is visually hidden, the giant word is its picture */
.ph-h1{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.ph-word{
  grid-row:4;
  font-family:var(--display);
  font-size:calc(100cqw / var(--ratio,3.65));
  line-height:.78;letter-spacing:.02em;font-kerning:none;white-space:nowrap;
  color:var(--ph-deep,var(--forest-900));
  margin-bottom:-.15em;                            /* a lighter crop than the home panels, so the title stays readable */
  user-select:none;
}

@media (max-width:63.99rem){
  .ph-lead{padding-top:1.75rem;}
  .ph-info{padding-bottom:2rem;}
  .ph-facts{margin-top:1.5rem;}
}
@media (prefers-reduced-motion:reduce){.ph-back a{transition:none;}}