/* About page design system. */
.about-page{background:var(--paper)}.about-hero{position:relative;min-height:520px;color:#fff;isolation:isolate}.about-hero:before{content:"";position:absolute;z-index:-1;inset:0;background-color:#080808;background-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.94) 34%,rgba(0,0,0,.18) 66%,rgba(0,0,0,.55) 100%),url("../images/west-palm-beach-boxing-coach.png");background-position:center,68% bottom;background-size:cover,auto calc(100% - 76px);background-repeat:no-repeat}.about-hero .wrap{max-width:1200px;min-height:520px;display:flex;align-items:center;padding-top:76px}.about-hero-copy{max-width:570px}.about-hero h1{margin:17px 0 10px;font:900 clamp(67px,5.2vw,98px)/.84 var(--display);letter-spacing:-1px;text-transform:uppercase}.about-hero h1 span,.about-hero h1 em{display:block}.about-hero-tagline{margin:0 0 11px;font:800 clamp(17px,1.45vw,25px)/1 var(--display);letter-spacing:5px;text-transform:uppercase}.about-hero .lede{margin:0;font-size:clamp(20px,1.55vw,27px);line-height:1.22}
.about-profile-grid{display:grid;grid-template-columns:43% 57%;gap:48px;align-items:center}.about-profile .about-portrait{min-height:535px;background:url("../images/frank-boxer.jpg") center 24%/cover no-repeat;filter:grayscale(1)}.about-profile-copy h2{margin:12px 0 18px;font:900 clamp(52px,4vw,76px)/.86 var(--display);text-transform:uppercase}.about-profile-copy p{max-width:675px;margin:0 0 16px;font-size:clamp(17px,1.25vw,22px);line-height:1.27}
.about-record{padding:29px 0 20px;background:radial-gradient(circle at 45% -80%,#343434,#090909 65%);color:#fff;text-align:center}.record-grid{display:grid;grid-template-columns:repeat(4,1fr)}.record-item{padding:0 24px;border-right:1px solid #8d8d8d}.record-item:last-child{border:0}.record-item strong{display:block;color:var(--red);font:900 clamp(33px,2.7vw,52px)/1 var(--display);text-transform:uppercase}.record-item span{display:block;margin-top:7px;font:800 clamp(13px,.9vw,17px)/1 var(--display);letter-spacing:3px;text-transform:uppercase}.about-record p{margin:20px 0 0;font-size:15px}.about-record a{color:#fff;text-decoration:underline}
.about-journey{padding-top:42px}.journey-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:38px;margin-top:35px;position:relative}.journey-grid:before{content:"";position:absolute;top:18px;right:8%;left:8%;height:2px;background:var(--red)}.journey-step{position:relative;padding:48px 20px 0}.journey-step span{position:absolute;z-index:1;top:0;left:20px;display:grid;width:38px;height:38px;place-items:center;border-radius:50%;background:var(--red);color:#fff;font:800 22px/1 var(--display)}.journey-step h3{margin:0;color:var(--red);font:900 clamp(27px,2.1vw,41px)/1 var(--display);text-transform:uppercase}.journey-step h4{margin:3px 0 10px;font:800 clamp(20px,1.5vw,28px)/1 var(--display);text-transform:uppercase}.journey-step p{margin:0;font-size:clamp(16px,1.1vw,20px);line-height:1.25}
.about-video{padding:45px 0 38px;background:radial-gradient(circle at 50% 0,#292929,#080808 62%);color:#fff;text-align:center}.about-video .section-title{color:#fff}.about-video>.wrap>p{margin:-7px 0 17px;font-size:clamp(18px,1.35vw,24px)}.video-frame{max-width:880px;margin:0 auto 17px;border:1px solid #aaa;aspect-ratio:16/9;background:#000}.video-frame iframe{display:block;width:100%;height:100%;border:0}.about-video .button{float:right;margin-right:max(0px,calc((100% - 880px)/2))}.about-video .wrap:after{content:"";display:table;clear:both}
.about-career{padding-top:44px}.career-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:23px;margin-top:26px}.career-card{min-height:190px;padding:28px;border:1px solid #717681}.career-card h3{margin:0;color:var(--red);font:900 clamp(30px,2.2vw,43px)/1 var(--display);text-transform:uppercase}.career-card p{max-width:345px;margin:10px 0 19px;font-size:clamp(17px,1.2vw,21px);line-height:1.2}.career-card .button{min-height:42px;font-size:17px}
@media(max-width:800px){.about-hero,.about-hero .wrap{min-height:530px}.about-hero:before{background-position:center,64% center;background-size:cover,auto 100%}.about-hero .wrap{padding-top:62px}.about-hero h1{font-size:clamp(56px,16vw,76px)}.about-hero-tagline{font-size:16px;letter-spacing:3px}.about-profile-grid,.career-grid{grid-template-columns:1fr;gap:28px}.about-profile .about-portrait{min-height:400px}.record-grid{grid-template-columns:repeat(2,1fr);row-gap:24px}.record-item:nth-child(2){border:0}.journey-grid{grid-template-columns:1fr;gap:16px}.journey-grid:before{top:0;bottom:0;left:38px;right:auto;width:2px;height:auto}.journey-step{padding:12px 0 16px 65px}.journey-step span{top:8px;left:19px}.about-video .button{float:none;margin-right:0}}
