/* About: the homepage block (.bc-about) and the /about-us page (#bc-about-page), both from about.py */

/* ---- Homepage block ------------------------------------------------------------------------------------------- */
.col-12.p-0.m-0.mb-5:has(> .bc-about){margin-bottom:0!important}
.bc-about{position:relative;overflow:hidden;background:#0b0b0c;color:#fff;font-family:'DM Sans',system-ui,sans-serif}
.bc-about:before{content:"";position:absolute;right:-12%;top:-35%;width:62%;height:130%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(255,140,0,.16),rgba(255,140,0,0))}
.bc-about *{box-sizing:border-box}
.bc-about__in{position:relative;max-width:1440px;margin:0 auto;padding:104px 64px;display:grid;
  grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:72px;align-items:center}
.bc-about__photo{position:relative;aspect-ratio:4/3;border-radius:28px;overflow:hidden;
  background:#141414 url(/_vercel/image?url=%2Fimages%2Fphotos%2Fabout-home.jpg&w=1200&q=75) center/cover no-repeat;box-shadow:0 30px 70px rgba(0,0,0,.5)}
.bc-about__photo:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,8,9,.55) 0%,rgba(8,8,9,0) 34%)}
.bc-about__tag{position:absolute;left:20px;bottom:20px;z-index:1;display:inline-flex;align-items:center;gap:10px;padding:11px 16px;border-radius:999px;
  background:rgba(11,11,12,.78);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.14);font-size:14px;font-weight:700}
.bc-about__tag:before{content:"";width:8px;height:8px;border-radius:50%;background:#ff8c00}
.bc-about .bc-about__eyebrow{margin:0 0 14px!important;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#ffb35c}
.bc-about .bc-about__title{margin:0 0 24px;font-family:Sora,system-ui,sans-serif;font-size:clamp(32px,3.8vw,52px);font-weight:800;
  letter-spacing:-.03em;line-height:1.06;color:#fff;text-align:left}
.bc-about__title em{display:block;font-style:normal;color:#ff8c00}
.bc-about .bc-about__body > p:not(.bc-about__eyebrow){margin:0 0 16px!important;max-width:600px;font-size:18px;line-height:1.65;color:#c9c9cf}
.bc-about .bc-about__facts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr) minmax(0,1fr);margin:32px 0 36px;padding:22px 0;
  border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
.bc-about__facts > div{padding:0 22px;border-left:1px solid rgba(255,255,255,.12)}
.bc-about__facts > div:first-child{padding-left:0;border-left:0}
.bc-about .bc-about__facts dt{margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#8b8b93}
.bc-about .bc-about__facts dd{margin:0;font-size:15px;font-weight:500;line-height:1.55;color:#fff}
.bc-about__ctas{display:flex;flex-wrap:wrap;gap:12px}
.bc-about .bc-about__btn,#bc-about-page .ab-btn{display:inline-flex;align-items:center;justify-content:center;height:54px;padding:0 26px;border-radius:14px;
  border:1.5px solid rgba(255,255,255,.28);background:transparent;color:#fff;font-weight:700;font-size:16px;text-decoration:none;
  transition:border-color .15s,background .15s,transform .15s}
.bc-about .bc-about__btn:hover,#bc-about-page .ab-btn:hover{border-color:#ff8c00;color:#fff}
.bc-about .bc-about__btn--primary,#bc-about-page .ab-btn--primary{background:#ff8c00;border-color:#ff8c00;color:#141414}
.bc-about .bc-about__btn--primary:hover,#bc-about-page .ab-btn--primary:hover{background:#ffa033;border-color:#ffa033;color:#141414;transform:translateY(-2px)}

/* ---- /about-us ------------------------------------------------------------------------------------------------- */
#bc-about-page{font-family:'DM Sans',system-ui,sans-serif;color:#141414}
#bc-about-page *{box-sizing:border-box}
#bc-about-page .ab-in{max-width:1440px;margin:0 auto;padding-left:64px;padding-right:64px}
#bc-about-page .ab-eyebrow{margin:0 0 14px!important;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#b35f00}
#bc-about-page h2{margin:0;font-family:Sora,system-ui,sans-serif;font-size:clamp(30px,3.4vw,44px);font-weight:800;letter-spacing:-.025em;line-height:1.1;color:#141414}
#bc-about-page .ab-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
#bc-about-page .ab-head{max-width:640px;margin-bottom:44px}
#bc-about-page .ab-sub{margin:16px 0 0!important;font-size:16.5px;line-height:1.6;color:#52525b}
/* "Call us at 905-595-7777." stays on one line instead of splitting the number */
#bc-about-page .ab-sub span{white-space:nowrap}
#bc-about-page .ab-sub a{color:#141414;font-weight:700;text-decoration:none;border-bottom:2px solid #ffc27a}
#bc-about-page .ab-sub a:hover{border-color:#ff8c00}

/* intro (dark) */
.ab-intro{position:relative;overflow:hidden;background:#0b0b0c;color:#fff}
.ab-intro:before{content:"";position:absolute;right:-10%;top:-30%;width:60%;height:120%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(255,140,0,.18),rgba(255,140,0,0))}
#bc-about-page .ab-intro .ab-eyebrow{color:#ffb35c}
.ab-intro__grid{position:relative;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:64px;align-items:center;padding-top:80px;padding-bottom:64px}
#bc-about-page h1{margin:0 0 24px;font-family:Sora,system-ui,sans-serif;font-size:clamp(40px,5vw,68px);font-weight:800;letter-spacing:-.03em;line-height:1.03;color:#fff}
#bc-about-page h1 em{display:block;font-style:normal;color:#ff8c00}
#bc-about-page .ab-lead{margin:0 0 14px!important;max-width:580px;font-size:19px;line-height:1.6;color:#c9c9cf}
.ab-intro__photo{position:relative;aspect-ratio:4/3;border-radius:28px;overflow:hidden;
  background:#141414 url(/images/photos/about-page.jpg?v=2) center/cover no-repeat;box-shadow:0 30px 70px rgba(0,0,0,.5)}
.ab-intro__photo:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,8,9,.5) 0%,rgba(8,8,9,0) 32%)}
.ab-badge{position:absolute;left:20px;bottom:20px;z-index:1;padding:12px 18px;border-radius:999px;background:rgba(255,255,255,.94);color:#141414;
  font-size:15px;font-weight:700;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.ab-stats{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:32px 0 56px;border-top:1px solid rgba(255,255,255,.1)}
.ab-stats > div{padding:0 28px;border-left:1px solid rgba(255,255,255,.1)}
.ab-stats > div:first-child{padding-left:0;border-left:0}
.ab-stats strong{display:block;margin-bottom:4px;font-family:Sora,system-ui,sans-serif;font-size:34px;font-weight:800;letter-spacing:-.02em;color:#fff}
.ab-stats span{font-size:15px;line-height:1.45;color:#a0a0a8}

/* how it works */
.ab-how{padding:96px 0;background:#f6f6f7}
.ab-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.ab-step{position:relative;padding:28px 26px 30px;border-radius:22px;background:#fff;border:1px solid #ececef;box-shadow:0 1px 2px rgba(16,16,20,.04);
  transition:transform .2s,box-shadow .2s,border-color .2s}
.ab-step:hover{transform:translateY(-3px);box-shadow:0 16px 32px rgba(16,16,20,.08);border-color:#ffd7a8}
.ab-step b{display:flex;align-items:center;justify-content:center;width:46px;height:46px;margin-bottom:22px;border-radius:14px;background:#141414;
  color:#ff8c00;font-family:Sora,system-ui,sans-serif;font-size:18px}
#bc-about-page .ab-step h3{margin:0 0 8px;font-family:Sora,system-ui,sans-serif;font-size:19px;font-weight:700;letter-spacing:-.01em;color:#141414}
#bc-about-page .ab-step p{margin:0!important;font-size:15.5px;line-height:1.6;color:#52525b}

/* questions */
.ab-faq{padding:96px 0;background:#fff}
.ab-faq__grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:64px;align-items:start}
.ab-faq details{border-bottom:1px solid #ececef}
.ab-faq details:first-child{border-top:1px solid #ececef}
.ab-faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 0;list-style:none;cursor:pointer;
  font-family:Sora,system-ui,sans-serif;font-size:18px;font-weight:700;letter-spacing:-.01em;color:#141414;transition:color .15s}
.ab-faq summary::-webkit-details-marker{display:none}
.ab-faq summary:hover{color:#b35f00}
.ab-faq summary:after{content:"";flex:0 0 auto;width:36px;height:36px;border-radius:50%;
  background:#f4f4f5 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141414' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/14px no-repeat;
  transition:transform .25s ease,background-color .25s}
.ab-faq details[open] summary:after{transform:rotate(45deg);background-color:#ffedd5}
#bc-about-page .ab-faq details p{margin:0 0 24px!important;max-width:640px;font-size:16.5px;line-height:1.7;color:#52525b}

/* visit */
.ab-visit{padding:0 0 96px;background:#fff}
.ab-visit__card{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,4fr) minmax(0,4fr);gap:48px;padding:52px;border-radius:28px;color:#fff;
  background:linear-gradient(120deg,#1c1c20 0%,#111113 55%,#2a1a08 100%);border:1px solid rgba(255,140,0,.25)}
#bc-about-page .ab-visit .ab-eyebrow{color:#ffb35c}
#bc-about-page .ab-visit h2{color:#fff}
#bc-about-page .ab-visit h3{margin:6px 0 18px;font-family:Sora,system-ui,sans-serif;font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff}
#bc-about-page .ab-addr{margin:16px 0 0!important;font-size:18px;line-height:1.6;color:#c9c9cf}
.ab-hours{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 20px;font-size:15.5px}
.ab-hours > div{display:contents}
#bc-about-page .ab-hours dt{font-weight:500;color:#a0a0a8}
#bc-about-page .ab-hours dd{margin:0;color:#fff;text-align:right}
.ab-contact{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.ab-contact span{display:block;font-size:13px;color:#8b8b93}
#bc-about-page .ab-contact a{color:#fff;font-size:17px;font-weight:700;text-decoration:none}
#bc-about-page .ab-contact a:hover{color:#ff8c00}

/* ---- Smaller screens ------------------------------------------------------------------------------------------- */
@media (max-width:1100px){
  .bc-about__in{grid-template-columns:1fr;gap:40px;padding:72px 32px}
  .bc-about__photo{grid-row:1}
  #bc-about-page .ab-in{padding-left:32px;padding-right:32px}
  .ab-intro__grid{grid-template-columns:1fr;gap:40px;padding-top:56px}
  .ab-intro__photo{grid-row:1}
  .ab-stats{grid-template-columns:1fr 1fr;row-gap:28px}
  .ab-stats > div:nth-child(3){padding-left:0;border-left:0}
  .ab-steps{grid-template-columns:1fr 1fr}
  .ab-faq__grid{grid-template-columns:1fr;gap:8px}
  .ab-visit__card{grid-template-columns:1fr 1fr;gap:40px}
  .ab-visit__card > div:first-child{grid-column:1/-1}
}
@media (max-width:640px){
  .bc-about__in{padding:56px 16px;gap:28px}
  .bc-about__photo,.ab-intro__photo{border-radius:20px}
  .bc-about__tag,.ab-badge{left:14px;bottom:14px;font-size:13px;padding:9px 14px}
  .bc-about .bc-about__body > p:not(.bc-about__eyebrow){font-size:16.5px}
  .bc-about .bc-about__facts{grid-template-columns:1fr;row-gap:16px}
  .bc-about__facts > div{padding:0;border-left:0}
  .bc-about .bc-about__btn,#bc-about-page .ab-btn{flex:1 1 100%}
  #bc-about-page .ab-in{padding-left:16px;padding-right:16px}
  .ab-intro__grid{padding-top:40px;gap:28px}
  #bc-about-page .ab-lead{font-size:17px}
  .ab-stats{padding-bottom:44px}
  .ab-stats > div{padding:0 0 0 16px}
  .ab-stats > div:nth-child(odd){padding-left:0;border-left:0}
  .ab-stats strong{font-size:28px}
  .ab-how,.ab-faq{padding:64px 0}
  .ab-steps{grid-template-columns:1fr;gap:12px}
  .ab-faq summary{font-size:17px;padding:20px 0}
  .ab-visit{padding-bottom:64px}
  .ab-visit__card{grid-template-columns:1fr;gap:32px;padding:32px 22px;border-radius:22px}
}

/* ---- The About page rises in when it opens (scroll reveals for the rest: /motion/motion.js) -------------------- */
@media (prefers-reduced-motion:no-preference){
  @keyframes ab-up{from{opacity:0;transform:translate3d(0,24px,0)}to{opacity:1;transform:none}}
  .ab-intro__text > *,.ab-intro__photo{animation:ab-up .85s cubic-bezier(.2,.7,.2,1) backwards}
  .ab-intro__text > :nth-child(2){animation-delay:.1s}
  .ab-intro__text > :nth-child(3){animation-delay:.2s}
  .ab-intro__text > :nth-child(4){animation-delay:.28s}
  .ab-intro__text > :nth-child(5){animation-delay:.36s}
  .ab-intro__photo{animation-delay:.2s}
}
#bc-about-page [data-bc-stat][hidden]{display:none}