
.xc-about,
.xc-about *{
  box-sizing:border-box;
}

.xc-about{
  width:100%;
  padding:78px 32px 84px;
  background:#FFFFFF;
  font-family:Arial,Helvetica,sans-serif;
}

.xc-about-inner{
  max-width:1450px;
  margin:0 auto;
}


/* =========================================================
   MAIN LAYOUT
   ========================================================= */

.xc-about-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  min-height:620px;
}


/* =========================================================
   PHOTO SIDE
   ========================================================= */

.xc-about-photo{
  position:relative;
  min-height:620px;
  overflow:hidden;

  background-image:url("/assets/photos/e4e02725a73eaac5.webp");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}

.xc-about-photo::after{
  content:"";
  position:absolute;
  inset:0;

  background:
    linear-gradient(
      to top,
      rgba(5,5,5,.46) 0%,
      rgba(5,5,5,.10) 35%,
      rgba(5,5,5,0) 65%
    );
}


/* PHOTO CAPTION */

.xc-about-photo-caption{
  position:absolute;
  left:30px;
  bottom:28px;
  z-index:2;

  max-width:330px;

  padding:17px 20px;

  background:rgba(5,5,5,.94);

  border-left:3px solid var(--mfd-accent,#E00018);
}

.xc-about-photo-caption small{
  display:block;

  margin-bottom:5px;

  color:var(--mfd-accent,#E00018) !important;

  font-size:9px;
  font-weight:900;
  letter-spacing:1.7px;

  text-transform:uppercase;
}

.xc-about-photo-caption strong{
  display:block;

  color:#FFFFFF !important;

  font-size:14px;
  line-height:1.45;

  font-weight:700;
}


/* =========================================================
   CONTENT SIDE
   ========================================================= */

.xc-about-content{
  padding:58px 58px 52px;

  background:#FFFFFF;

  border-top:1px solid #DEDEDE;
  border-right:1px solid #DEDEDE;
  border-bottom:1px solid #DEDEDE;
}


/* KICKER */

.xc-about-kicker{
  display:flex;
  align-items:center;
  gap:12px;

  margin-bottom:18px;

  color:var(--mfd-accent,#E00018) !important;

  font-size:10px;
  font-weight:900;
  letter-spacing:2.2px;

  text-transform:uppercase;
}

.xc-about-kicker::before{
  content:"";

  width:34px;
  height:2px;

  background:var(--mfd-accent,#E00018);
}


/* TITLE */

.xc-about-title{
  max-width:600px;

  margin:0 0 25px !important;

  color:#050505 !important;

  font-size:clamp(40px,4.4vw,62px);
  line-height:.98;

  font-weight:900;
  letter-spacing:-1.8px;

  text-transform:uppercase;
}

.xc-about-title span{
  display:block;
  color:var(--mfd-accent,#E00018) !important;
}


/* TEXT */

.xc-about-lead{
  max-width:590px;

  margin:0 0 17px !important;

  color:#252525 !important;

  font-size:16px;
  line-height:1.75;

  font-weight:600;
}

.xc-about-text{
  max-width:590px;

  margin:0 !important;

  color:#5E5E5E !important;

  font-size:14px;
  line-height:1.8;
}

.xc-about-text-second{
  margin-top:15px !important;
}


/* =========================================================
   TRUST POINTS
   ========================================================= */

.xc-about-points{
  margin-top:35px;

  border-top:1px solid #DEDEDE;
}

.xc-about-point{
  position:relative;

  padding:20px 0 20px 30px;

  border-bottom:1px solid #DEDEDE;
}

.xc-about-point::before{
  content:"";

  position:absolute;
  left:0;
  top:27px;

  width:12px;
  height:12px;

  border:2px solid var(--mfd-accent,#E00018);

  transform:rotate(45deg);
}

.xc-about-point strong{
  display:block;

  margin-bottom:6px;

  color:#050505 !important;

  font-size:14px;
  line-height:1.4;

  font-weight:900;
}

.xc-about-point span{
  display:block;

  max-width:520px;

  color:#5E5E5E !important;

  font-size:13px;
  line-height:1.65;
}


/* =========================================================
   BOTTOM MESSAGE
   ========================================================= */

.xc-about-bottom{
  display:grid;
  grid-template-columns:1.25fr .75fr;

  margin-top:16px;

  background:
    linear-gradient(
      135deg,
      #111111 0%,
      #050505 100%
    );
}

.xc-about-bottom-text{
  padding:30px 34px;
}

.xc-about-bottom-text small{
  display:block;

  margin-bottom:7px;

  color:var(--mfd-accent,#E00018) !important;

  font-size:9px;
  font-weight:900;
  letter-spacing:1.8px;

  text-transform:uppercase;
}

.xc-about-bottom-text p{
  max-width:800px;

  margin:0 !important;

  color:#FFFFFF !important;

  font-size:15px;
  line-height:1.65;

  font-weight:600;
}


/* RIGHT CTA */

.xc-about-bottom-cta{
  display:flex;
  align-items:center;
  justify-content:center;

  padding:25px;

  border-left:1px solid rgba(255,255,255,.14);
}

.xc-about-bottom-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:52px;

  padding:0 28px;

  background:var(--mfd-accent,#E00018);

  color:#FFFFFF !important;

  text-decoration:none !important;

  font-size:10px;
  font-weight:900;
  letter-spacing:1.5px;

  text-transform:uppercase;

  transition:
    background .2s ease,
    transform .2s ease;
}

.xc-about-bottom-link:hover{
  background:var(--mfd-accent-hover,#B80014);

  transform:translateY(-2px);
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

  .xc-about-grid{
    grid-template-columns:1fr;
  }

  .xc-about-photo{
    min-height:500px;

    background-image:url("/assets/photos/e4e02725a73eaac5.webp");
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
  }

  .xc-about-content{
    border-left:1px solid #DEDEDE;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:650px){

  .xc-about{
    padding:50px 16px 60px;
  }

  .xc-about-photo{
    min-height:360px;

    background-image:url("/assets/photos/e4e02725a73eaac5.webp");
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
  }

  .xc-about-photo-caption{
    left:18px;
    right:18px;
    bottom:18px;

    max-width:none;
  }

  .xc-about-content{
    padding:36px 22px 38px;
  }

  .xc-about-title{
    font-size:39px;
  }

  .xc-about-lead{
    font-size:15px;
  }

  .xc-about-point{
    padding-left:27px;
  }

  .xc-about-bottom{
    grid-template-columns:1fr;
  }

  .xc-about-bottom-text{
    padding:25px 22px;
  }

  .xc-about-bottom-cta{
    justify-content:flex-start;

    padding:0 22px 25px;

    border-left:0;
  }

  .xc-about-bottom-link{
    width:100%;
  }

}



/* =========================================================
   BASE
   ========================================================= */

.mfd-wall,
.mfd-wall *{
  box-sizing:border-box;
}

.mfd-wall{
  width:100%;
  padding:76px 32px 88px;

  background:#FFFFFF;

  font-family:Arial,Helvetica,sans-serif;
}

.mfd-wall-wrap{
  width:100%;
  max-width:1450px;
  margin:0 auto;
}


/* =========================================================
   HEADER
   ========================================================= */

.mfd-wall-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:30px;

  margin-bottom:36px;
}

.mfd-wall-kicker{
  display:flex;
  align-items:center;
  gap:12px;

  margin-bottom:12px;

  color:var(--mfd-accent,#E00018) !important;

  font-size:10px;
  font-weight:900;
  letter-spacing:2.5px;

  text-transform:uppercase;
}

.mfd-wall-kicker::before{
  content:"";

  width:34px;
  height:2px;

  background:var(--mfd-accent,#E00018);
}

.mfd-wall-title{
  margin:0 !important;

  color:#050505 !important;

  font-size:clamp(40px,5vw,66px);
  line-height:.95;

  font-weight:900;
  letter-spacing:-2px;

  text-transform:uppercase;
}

.mfd-wall-title span{
  display:block;

  color:var(--mfd-accent,#E00018) !important;
}

.mfd-wall-location{
  padding-bottom:7px;

  color:#050505 !important;

  font-size:9px;
  font-weight:900;
  letter-spacing:2px;

  text-transform:uppercase;
}


/* =========================================================
   GRID
   ========================================================= */

.mfd-wall-grid{
  display:grid;

  grid-template-columns:
    1.2fr .75fr 1fr;

  grid-template-rows:
    250px 310px 235px;

  gap:14px;
}


/* =========================================================
   PHOTO
   ========================================================= */

.mfd-wall-photo{
  position:relative;

  display:block;

  overflow:hidden;

  background:#050505;

  text-decoration:none !important;
}

.mfd-wall-photo img{
  width:100%;
  height:100%;

  display:block;

  object-fit:cover;

  transition:
    transform .55s ease,
    filter .4s ease;

  filter:
    saturate(.94)
    contrast(1.04);
}

.mfd-wall-photo::after{
  content:"";

  position:absolute;
  inset:0;

  background:
    linear-gradient(
      to top,
      rgba(5,5,5,.62) 0%,
      rgba(5,5,5,.12) 45%,
      rgba(5,5,5,.01) 100%
    );

  opacity:.55;

  transition:opacity .35s ease;
}

.mfd-wall-photo:hover img{
  transform:scale(1.045);

  filter:
    saturate(1)
    contrast(1.05);
}

.mfd-wall-photo:hover::after{
  opacity:.34;
}


/* =========================================================
   POSITIONS
   ========================================================= */

.mfd-wall-photo--1{
  grid-column:1 / 2;
  grid-row:1 / 3;
}

.mfd-wall-photo--2{
  grid-column:2 / 3;
  grid-row:1 / 2;
}

.mfd-wall-photo--3{
  grid-column:3 / 4;
  grid-row:1 / 2;
}

.mfd-wall-photo--4{
  grid-column:2 / 4;
  grid-row:2 / 3;
}

.mfd-wall-photo--5{
  grid-column:1 / 3;
  grid-row:3 / 4;
}

.mfd-wall-photo--6{
  grid-column:3 / 4;
  grid-row:3 / 4;
}


/* =========================================================
   NUMBER MARK
   ========================================================= */

.mfd-wall-number{
  position:absolute;

  z-index:4;

  left:18px;
  bottom:16px;

  color:#FFFFFF !important;

  font-size:9px;
  font-weight:900;
  letter-spacing:2px;

  text-transform:uppercase;
}

.mfd-wall-number::before{
  content:"";

  display:inline-block;

  width:26px;
  height:2px;

  margin-right:9px;
  margin-bottom:3px;

  background:var(--mfd-accent,#E00018);
}


/* =========================================================
   CENTER BRAND PANEL
   ========================================================= */

.mfd-wall-brand{
  position:absolute;

  z-index:6;

  left:50%;
  top:50%;

  width:265px;

  padding:28px 26px 26px;

  transform:translate(-50%,-50%);

  background:
    linear-gradient(
      145deg,
      #111111 0%,
      #050505 100%
    );

  border-top:4px solid var(--mfd-accent,#E00018);

  box-shadow:
    0 18px 44px rgba(5,5,5,.24);

  text-align:center;

  pointer-events:none;
}

.mfd-wall-brand small{
  display:block;

  margin-bottom:10px;

  color:var(--mfd-accent,#E00018) !important;

  font-size:8px;
  font-weight:900;
  letter-spacing:2px;

  text-transform:uppercase;
}

.mfd-wall-brand strong{
  display:block;

  color:#FFFFFF !important;

  font-size:26px;
  line-height:1;

  font-weight:900;

  letter-spacing:-.6px;

  text-transform:uppercase;
}

.mfd-wall-brand span{
  display:block;

  margin-top:10px;

  color:rgba(255,255,255,.68) !important;

  font-size:9px;
  font-weight:700;
  letter-spacing:1.4px;

  text-transform:uppercase;
}


/* =========================================================
   GRID WRAPPER
   ========================================================= */

.mfd-wall-stage{
  position:relative;
}


/* =========================================================
   BOTTOM BAR
   ========================================================= */

.mfd-wall-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:25px;

  margin-top:28px;
  padding-top:22px;

  border-top:1px solid #DEDEDE;
}

.mfd-wall-bottom-text{
  color:#050505 !important;

  font-size:9px;
  font-weight:900;
  letter-spacing:1.7px;

  text-transform:uppercase;
}

.mfd-wall-button{
  min-height:50px;

  padding:0 24px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  gap:12px;

  background:var(--mfd-accent,#E00018);

  color:#FFFFFF !important;

  text-decoration:none !important;

  font-size:9px;
  font-weight:900;
  letter-spacing:1.5px;

  text-transform:uppercase;

  transition:
    transform .2s ease,
    background .2s ease;
}

.mfd-wall-button:hover{
  transform:translateY(-2px);

  background:var(--mfd-accent-hover,#B80014);
}

.mfd-wall-button span{
  font-size:17px;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

  .mfd-wall-grid{
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto;
  }

  .mfd-wall-photo{
    grid-column:auto !important;
    grid-row:auto !important;

    height:300px;
  }

  .mfd-wall-photo--1,
  .mfd-wall-photo--4{
    grid-column:1 / 3 !important;

    height:430px;
  }

  .mfd-wall-stage{
    padding-bottom:0;
  }

  .mfd-wall-brand{
    width:240px;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:650px){

  .mfd-wall{
    padding:52px 16px 60px;
  }

  .mfd-wall-head{
    display:block;

    margin-bottom:24px;
  }

  .mfd-wall-title{
    font-size:39px;
  }

  .mfd-wall-location{
    margin-top:15px;
    padding:0;
  }

  .mfd-wall-grid{
    grid-template-columns:1fr;

    gap:12px;
  }

  .mfd-wall-photo,
  .mfd-wall-photo--1,
  .mfd-wall-photo--4{
    grid-column:auto !important;

    height:270px;
  }

  .mfd-wall-photo--1{
    height:330px;
  }

  .mfd-wall-brand{
    position:relative;

    left:auto;
    top:auto;

    width:100%;

    margin-top:12px;

    transform:none;

    pointer-events:auto;
  }

  .mfd-wall-bottom{
    flex-direction:column;
    align-items:flex-start;

    gap:16px;
  }

  .mfd-wall-button{
    width:100%;
  }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media(max-width:390px){

  .mfd-wall-photo,
  .mfd-wall-photo--1,
  .mfd-wall-photo--4{
    height:235px;
  }

  .mfd-wall-photo--1{
    height:285px;
  }

}

