/* Portfolio editorial register: project contexts and historical names.
   Content stays in normal flow. The common graphic never identifies a brand. */
#brand.brand-history{
  --pf-gutter:clamp(3rem,6vw,5.5rem);
  position:relative;isolation:isolate;margin:4rem 0;padding:2.5rem 0 2rem;
  border-block:1px solid var(--line-2);
}
#brand h3{
  max-width:19ch;font:420 clamp(2rem,3vw,2.5rem)/1.08 var(--f-d);
  letter-spacing:-.032em;color:var(--ink);text-wrap:balance;
}
#brand .pf-intro{max-width:48ch;margin-top:1.25rem;color:var(--ink-2);font-size:1rem;line-height:1.6}
#brand .pf-kicker{position:relative;z-index:1;margin:0;color:var(--ink-3)}
#brand .pf-current{position:relative;margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--line)}
#brand .pf-current-names{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem 2.5rem;
  list-style:none;margin:1.4rem 0 0;padding:0;
}
#brand .pf-current-names li{
  position:relative;padding-left:1.2rem;min-width:0;
  font:420 clamp(1.15rem,1.7vw,1.55rem)/1.28 var(--f-d);letter-spacing:-.018em;color:var(--ink);
}
#brand .pf-current-names li::before{
  content:"";position:absolute;left:0;top:.63em;width:.45rem;height:1px;
  background:var(--signal-blue,#8ab9ed);
}
#brand .pf-current-names li:nth-child(even)::before{background:var(--signal-red,#e39a91)}
#brand .pf-history{
  position:relative;margin-top:3rem;padding:1.75rem 0 1rem var(--pf-gutter);
  border-top:1px solid var(--line);
}
#brand .brand-names{
  position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:start;gap:1.9rem 2rem;list-style:none;margin:1.8rem 0 0;padding:0 0 1rem;
}
#brand .brand-names li{
  min-width:0;color:var(--ink);cursor:inherit;
  font:420 clamp(1.15rem,1.7vw,1.55rem)/1.22 var(--f-d);letter-spacing:-.02em;
  overflow-wrap:break-word;
}
.pf-weave{
  position:absolute;inset:0;z-index:0;width:100%;height:100%;max-width:none;
  overflow:hidden;pointer-events:none;fill:none;stroke-linecap:round;
}
.pf-weave path{vector-effect:non-scaling-stroke}
.pf-weave-blue{stroke:var(--signal-blue,#8ab9ed)}
.pf-weave-red{stroke:var(--signal-red,#e39a91)}
.pf-weave-base{stroke-width:1;opacity:.12}
.pf-weave-trace{stroke-width:1.15;stroke-dasharray:1;stroke-dashoffset:1;opacity:.65}
.pf-weave-trace.pf-weave-red{opacity:.48}
.pf-weave-rule{stroke-width:1;opacity:.28}
@media(max-width:1100px) and (min-width:900px){
  #brand .brand-names{column-gap:1.3rem;font-size:1.1rem}
  #brand .brand-names li{font-size:1.1rem}
}
@media(max-width:699px){
  #brand.brand-history{--pf-gutter:1.35rem;margin-block:3rem;padding-block:2rem 1.25rem}
  #brand h3{font-size:clamp(1.9rem,7.8vw,2.7rem)}
  #brand .pf-intro{font-size:.9375rem}
  #brand .pf-current-names{gap:1.1rem 1.25rem}
  #brand .pf-current-names li{font-size:1.05rem;padding-left:.8rem}
  #brand .pf-current-names li::before{width:.3rem}
  #brand .pf-history{margin-top:2.3rem;padding-top:1.35rem}
  #brand .brand-names{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6rem 1rem}
  #brand .brand-names li{font-size:1.075rem;line-height:1.25}
  .pf-weave-trace{stroke-width:1}
}
@media print{.pf-weave{display:none}}