.about-page { background: #f5f1e9; color: #111; }
.about-page main { overflow: hidden; }
.about-hero { position: relative; min-height: clamp(600px, 82svh, 820px); display: flex; align-items: flex-end; border-bottom: 4px solid #111; isolation: isolate; }
.about-hero > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.about-hero-shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(8,8,8,.83), rgba(8,8,8,.25) 58%, rgba(8,8,8,.05)); }
.about-hero-copy { width: min(760px, 88vw); padding: clamp(3rem, 5vw, 5.5rem) clamp(1.25rem, 5vw, 5.5rem); color: #fff; }
.about-kicker,.about-index { margin: 0 0 1rem; font-size: .78rem; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.about-kicker { width: max-content; padding: .5rem .75rem; border: 2px solid #111; border-radius: 999px; color: #111; background: #ffe600; }
.about-hero h1,.about-intro h2,.about-lines h2,.about-trust h2,.about-close h2 { margin: 0; font-weight: 900; letter-spacing: -.065em; text-wrap: balance; }
.about-hero h1 { max-width: 10ch; font-size: clamp(3.8rem, 6vw, 6.4rem); line-height: .86; }
.about-hero-copy > p:not(.about-kicker) { max-width: 43ch; margin: 1.6rem 0 2rem; font-size: clamp(1.05rem, 1.45vw, 1.35rem); line-height: 1.5; }
.about-pill { min-height: 52px; width: max-content; display: inline-flex; align-items: center; justify-content: center; gap: 1rem; padding: .8rem 1.15rem; border: 3px solid #111; border-radius: 999px; color: #111; background: #ffe600; box-shadow: 6px 7px 0 #111; font-size: .82rem; font-weight: 900; text-decoration: none; text-transform: uppercase; transition: transform .2s ease, box-shadow .2s ease; }
.about-pill:hover,.about-pill:focus-visible { transform: translateY(-4px); box-shadow: 9px 11px 0 #111; }
.about-pill.dark { color: #fff; background: #111; box-shadow: 6px 7px 0 #e81778; }
.about-pill.light { background: #fff; }
.about-intro { display: grid; grid-template-columns: minmax(180px,.28fr) minmax(0,1fr); gap: clamp(2rem, 5vw, 5rem); padding: clamp(4rem, 6vw, 6.5rem) clamp(1.25rem, 6vw, 7rem); border-bottom: 4px solid #111; background: #ffe600; }
.about-intro h2,.about-lines h2,.about-trust h2 { font-size: clamp(3.2rem, 4.6vw, 5.2rem); line-height: .9; }
.about-intro > div { max-width: 1000px; }
.about-intro p:not(.about-lead) { max-width: 60ch; font-size: 1.12rem; line-height: 1.65; }
.about-lead { max-width: 34ch; margin: 1.5rem 0 1rem; font-size: clamp(1.25rem, 1.8vw, 1.8rem); font-weight: 700; line-height: 1.3; }
.about-values { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-bottom: 4px solid #111; background: #e81778; }
.about-values article { min-height: 250px; padding: clamp(1.6rem, 2.5vw, 2.6rem); border-right: 3px solid #111; color: #fff; }
.about-values article:last-child { border-right: 0; }
.about-values span { color: #ffe600; font-size: .78rem; font-weight: 900; }
.about-values h3 { max-width: 10ch; margin: 2rem 0 .8rem; font-size: clamp(1.8rem, 2.5vw, 3rem); line-height: .94; letter-spacing: -.05em; }
.about-values p { max-width: 26ch; line-height: 1.5; }
.about-lines { display: grid; grid-template-columns: minmax(360px,.78fr) minmax(0,1.22fr); min-height: 600px; border-bottom: 4px solid #111; }
.about-lines-copy { display: flex; flex-direction: column; justify-content: center; gap: 1.25rem; padding: clamp(3rem, 4.5vw, 5rem); background: #19afd2; border-right: 4px solid #111; }
.about-lines-copy > p:not(.about-index) { max-width: 45ch; font-size: 1.08rem; line-height: 1.6; }
.about-pack-grid { display: grid; grid-template-columns: repeat(3,1fr); background: #6828a2; }
.about-pack-grid a { min-width: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: .35rem; padding: 2.25rem 1rem 2rem; border-right: 3px solid #111; color: #fff; text-align: center; text-decoration: none; }
.about-pack-grid a:last-child { border-right: 0; }
.about-pack-grid img { width: min(90%, 290px); height: clamp(300px, 31vw, 410px); object-fit: contain; filter: drop-shadow(10px 13px 0 rgba(0,0,0,.32)); transition: transform .35s ease; }
.about-pack-grid a:hover img { transform: translateY(-12px) rotate(-2deg); }
.about-pack-grid strong { margin-top: .7rem; color: #ffe600; font-size: clamp(1.35rem, 2vw, 2.25rem); letter-spacing: -.04em; }
.about-pack-grid span { font-size: .78rem; font-weight: 800; text-transform: uppercase; }
.about-trust { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 4px solid #111; background: #111; color: #fff; }
.about-trust-photo { min-height: 540px; border-right: 4px solid #111; }
.about-trust-photo img { width: 100%; height: 100%; object-fit: cover; }
.about-trust-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(3rem, 5vw, 5.5rem); background: #6828a2; }
.about-trust-copy > p:not(.about-index) { max-width: 44ch; margin: 1.4rem 0 1.8rem; font-size: 1.08rem; line-height: 1.6; }
.about-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1.4rem; }
.about-text-link { color: #fff; font-weight: 900; text-transform: uppercase; text-underline-offset: .4rem; }
.about-close { min-height: 440px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.2rem; padding: 4rem 1.25rem; text-align: center; background: #ffe600; }
.about-close p { margin: 0; font-size: .82rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.about-close h2 { font-size: clamp(4rem, 7.5vw, 8rem); line-height: .84; }
.about-close > div { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; margin-top: 1rem; }
@media (max-width: 980px) {
  .about-values { grid-template-columns: repeat(2,1fr); }
  .about-values article:nth-child(2) { border-right: 0; }
  .about-values article:nth-child(-n+2) { border-bottom: 3px solid #111; }
  .about-lines,.about-trust { grid-template-columns: 1fr; }
  .about-lines-copy,.about-trust-photo { border-right: 0; border-bottom: 4px solid #111; }
  .about-pack-grid img { height: 460px; }
}
@media (max-width: 700px) {
  .about-hero { min-height: 78svh; }
  .about-hero-shade { background: linear-gradient(0deg,rgba(8,8,8,.88),rgba(8,8,8,.06) 76%); }
  .about-hero-copy { padding: 3rem 1.25rem; }
  .about-hero h1 { font-size: clamp(3.5rem, 16vw, 5.6rem); }
  .about-intro { grid-template-columns: 1fr; gap: 2rem; }
  .about-intro h2,.about-lines h2,.about-trust h2 { font-size: clamp(3.2rem,14vw,5rem); }
  .about-values { grid-template-columns: 1fr; }
  .about-values article { min-height: 250px; border-right: 0; border-bottom: 3px solid #111; }
  .about-values article:last-child { border-bottom: 0; }
  .about-values h3 { margin-top: 2rem; }
  .about-pack-grid { grid-template-columns: 1fr; }
  .about-pack-grid a { min-height: 570px; border-right: 0; border-bottom: 3px solid #111; }
  .about-pack-grid a:last-child { border-bottom: 0; }
  .about-pack-grid img { width: min(78%, 310px); height: 430px; }
  .about-trust-photo { min-height: 420px; }
  .about-close { min-height: 520px; }
  .about-close h2 { font-size: clamp(4.5rem,20vw,7rem); }
}
