/* Liberty Law — Approach pillars */
/* width:100% + min-width:0: with an aspect-ratio, min-height also sets a
   minimum *width* (480px × 16/10 = 768px), which pushed the stage 31px past
   the page on tablets. Pinning the width lets min-height only add height. */
/* The ratio is a floor, not a fixed height: ::before holds the 21:9 space and the
   copy shares its grid cell, so a long intro grows the stage instead of being
   clipped by overflow:hidden (an aspect-ratio box with overflow hidden never grows). */
.lls-approach__stage{position:relative;margin:0;border-radius:20px;overflow:hidden;min-height:480px;width:100%;min-width:0;background:#0a0a0c;display:grid}
.lls-approach__stage::before{content:"";grid-area:1/1;padding-top:42.857%}
.lls .lls-approach__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.lls-approach__stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(10,10,12,0) 22%,rgba(10,10,12,.55) 58%,rgba(10,10,12,.92) 100%),linear-gradient(90deg,rgba(10,10,12,.55) 0%,rgba(10,10,12,0) 62%)}
.lls-approach__over{grid-area:1/1;align-self:end;position:relative;z-index:2;padding:clamp(1.75rem,4vw,3.5rem);max-width:46rem}
.lls-approach p.lls-approach__eyebrow{font-size:.75rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#fff;display:flex;align-items:center;gap:.9rem}
.lls-approach__eyebrow::before{content:"";width:40px;height:3px;background:var(--lls-red-on-photo)}
.lls-approach .lls-approach__over .lls__h2{margin-top:1rem;max-width:18ch}
.lls-approach .lls-approach__over .lls__lede{margin-top:1.25rem;max-width:52ch;font-size:clamp(1rem,1.35vw,1.125rem)}
.lls-approach__stage figcaption{position:absolute;z-index:2;top:1.25rem;right:1.5rem;font-size:.75rem;line-height:1.4;color:rgba(255,255,255,.78);background:rgba(10,10,12,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:999px;padding:.4rem .9rem}

.lls-approach h3.lls-approach__sub{margin-top:clamp(3rem,6vw,4.5rem);font-size:.75rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.66)}
.lls-pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.75rem,3.5vw,3rem);margin-top:1.5rem}
.lls-pillar{position:relative;padding-top:1.75rem;margin:0}
/* the rule draws in when the pillar arrives */
.lls-pillar::before,.lls-pillar::after{content:"";position:absolute;top:0;left:0;height:2px}
.lls-pillar::before{right:0;background:rgba(255,255,255,.16)}
.lls-pillar::after{width:100%;background:var(--lls-red-on-photo);transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.2,.7,.25,1) .25s}
.lls-pillar.is-in::after{transform:scaleX(1)}
/* Solid, not outlined: Alexandria's contours overlap, and a text-stroke draws
   those overlaps as stray lines inside the 1 and the 3. */
.lls-pillar__no{display:block;font-size:clamp(2.75rem,4.6vw,4rem);line-height:1;font-weight:700;letter-spacing:-.05em;color:rgba(255,255,255,.2)}
.lls-approach .lls-pillar h4{margin-top:1.25rem;font-size:clamp(1.25rem,1.9vw,1.5rem);line-height:1.2;font-weight:700;color:#fff;letter-spacing:-.02em}
.lls-approach .lls-pillar p{margin-top:.875rem;font-size:.9375rem;line-height:1.8;color:rgba(255,255,255,.74)}

@media (max-width:1024px){.lls-approach__stage::before{padding-top:62.5%}}
@media (max-width:900px){.lls-pillars{grid-template-columns:minmax(0,1fr);gap:2.25rem}}
@media (max-width:640px){
  .lls-approach__stage{min-height:560px;border-radius:16px}
  .lls-approach__stage::before{padding-top:0}
  .lls-approach__stage figcaption{top:.875rem;right:.875rem}
}
@media (prefers-reduced-motion:reduce){.lls-pillar::after{transition:none;transform:scaleX(1)}}