*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#161616;background:#f5f2eb}.site-header{height:108px;background:#070909;color:#FFFFFF;display:flex;align-items:center;padding:8px 30px;position:sticky;top:0;z-index:20;box-shadow:0 2px 18px #0008}.brand{display:block;height:100%;aspect-ratio:1;flex:0 0 auto}.brand img{height:100%;width:100%;display:block;object-fit:contain}.nav{margin-left:auto;display:flex;align-items:center;gap:30px}.nav a{color:#FFFFFF;text-decoration:none;text-transform:uppercase;font-weight:700;font-size:14px;letter-spacing:.4px;padding:10px 0}.nav a:hover,.nav a.active{color:#e1a52b;border-bottom:3px solid #e1a52b}.nav-cta{background:#e1a52b!important;color:#111!important;padding:16px 22px!important;border:0!important}.menu-toggle{display:none;background:none;border:0;color:#FFFFFF;font-size:28px;margin-left:auto}.hero{position:relative;min-height:690px;overflow:hidden;background:#071318}.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,9,12,.92) 0%,rgba(3,9,12,.72) 31%,rgba(3,9,12,.18) 62%,rgba(3,9,12,.02) 100%)}.hero-content{position:relative;z-index:2;width:min(560px,48vw);padding:82px 0 50px 5vw;color:#FFFFFF}.eyebrow,.section-kicker{color:#e1a52b;text-transform:uppercase;font-size:15px;font-weight:800;letter-spacing:2px;margin:0 0 18px}.why .section-kicker.red{color:#e1a52b}.hero h1{font-size:clamp(42px,4.5vw,70px);line-height:.99;margin:0;font-weight:900;letter-spacing:-1px}.hero h1 em{font-style:normal;color:#e1a52b}.accent-line{width:48px;height:4px;background:#d22a20;margin:25px 0}.hero-copy{font-size:18px;line-height:1.5;max-width:510px}.hero-buttons{display:flex;gap:16px;flex-wrap:wrap;margin:28px 0}.button{display:inline-block;text-decoration:none;text-transform:uppercase;font-weight:900;letter-spacing:.4px;padding:17px 25px;border:2px solid #e1a52b;cursor:pointer}.button.gold{background:#e1a52b;color:#111}.button.outline{background:transparent;color:#fff}.button.light{color:#fff}.trust-row{display:flex;gap:28px;flex-wrap:wrap}.trust-row span{font-size:14px;color:#e1a52b}.trust-row b,.trust-row small{display:block;margin-left:20px;color:#fff}.trust-row small{font-size:12px;color:#ddd}.section{padding:55px 4vw}.services{text-align:center}.services h2,.professionals h2,.estimate h2{font-size:38px;text-transform:uppercase;margin:0 0 32px}.section-kicker{color:#c42b22;margin-bottom:8px}.service-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;max-width:1650px;margin:0 auto}.service-grid article{min-height:145px;border:1px solid #d9d3c8;background:#fbf9f4;padding:22px 8px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.service-grid span{font-size:38px;color:#c58a20;line-height:1}.service-grid h3{font-size:14px;margin:12px 0 0;line-height:1.25}.why{display:grid;grid-template-columns:32% 68%;background:#060909;color:#fff}.why-copy{padding:45px 35px}.why-copy ul{list-style:none;padding:0;margin:20px 0 30px}.why-copy li{margin:12px 0;padding-left:22px}.why-copy li:before{content:"✓";color:#e1a52b;margin-left:-22px;margin-right:10px;font-weight:bold}.project-strip{display:grid;grid-template-columns:repeat(3,1fr);position:relative;min-height:350px}.project-card{background-size:cover;background-position:center;position:relative}.project-card:after{content:"";position:absolute;inset:0;background:#0003}.project-card span{position:absolute;bottom:22px;left:20px;right:20px;z-index:2;text-align:center;color:#fff;text-transform:uppercase;font-weight:900;font-size:15px}.p1{background-image:url("assets/project-carpentry.jpeg")}.p2{background-image:url("assets/project-deck.jpeg")}.p3{background-image:url("assets/project-stairs.jpeg")}.strip-title{position:absolute;bottom:0;left:0;right:0;background:#000b;color:#e1a52b;text-align:center;padding:12px;font-weight:900;letter-spacing:1.2px;z-index:3}.testimonial{padding:38px 8vw;background:#eee9df;display:flex;gap:25px;align-items:center;font-size:18px}.quote-mark{font-size:80px;color:#c42b22;line-height:.6}.testimonial strong{display:inline-block;margin-top:8px}.professionals{padding:65px 8vw;display:grid;grid-template-columns:1fr 1fr;gap:60px;background:#fff}.professionals p{font-size:18px;line-height:1.6}.pro-list{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-content:center}.pro-list span{padding:20px;border-left:4px solid #e1a52b;background:#f4f1ea;font-weight:700}.estimate{padding:70px 8vw;display:grid;grid-template-columns:1fr 1fr;gap:60px;background:#101314;color:#fff}.estimate h2{color:#fff}.estimate p{font-size:18px;line-height:1.5}.estimate form{display:flex;flex-direction:column;gap:12px}.estimate input,.estimate textarea{font:inherit;padding:15px;border:1px solid #555;background:#1c2021;color:#fff}.form-note{font-size:12px!important;color:#aaa}.estimate button{align-self:flex-start}footer{background:#050708;color:#fff;padding:45px 5vw 25px;display:grid;grid-template-columns:1.2fr 1.3fr 1.2fr;gap:38px;align-items:start;position:relative}.footer-brand{display:flex;flex-direction:column;justify-content:space-between;min-height:100%}.footer-brand img{width:340px;height:auto;max-height:260px;object-fit:contain}.footer-contact,.footer-links-wrap{display:flex;flex-direction:column;gap:12px}.footer-contact-stack{display:flex;flex-direction:column;gap:8px}.footer-contact-stack p{margin:0}.quick-links,.social-links,.service-area-list{display:flex;flex-direction:column;gap:8px}.quick-links{margin-top:0}.social-links{margin-top:0}.follow-bravo{margin-top:10px}.footer h3{color:#e1a52b;text-transform:uppercase;margin:0;font-size:17px;letter-spacing:.04em;font-weight:800}footer a{color:#fff;text-decoration:none;margin:0;font-size:17px;line-height:1.5}footer a:hover{color:#e1a52b}footer p{line-height:1.6;margin:0;color:#ddd;font-size:17px}.copyright{margin-top:auto;padding-top:18px;border-top:1px solid rgba(255,255,255,.12);color:#999;font-size:14px;line-height:1.6}.service-area-list{margin-top:2px}.social-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:5px;font-weight:800;font-size:16px;line-height:1}.facebook-icon{background:#1877F2;color:#fff;font-family:Arial,sans-serif}.instagram-icon{background:linear-gradient(135deg,#833AB4,#E1306C,#F77737);color:#fff;border-radius:7px;font-size:18px}.social-links a{display:inline-flex;align-items:center;gap:8px;text-decoration:none}.social-links a:hover{color:#e1a52b}@media(max-width:1000px){.site-header{height:90px;padding:6px 18px}.brand{height:100%}.nav{gap:16px}.nav a{font-size:11px}.service-grid{grid-template-columns:repeat(3,1fr)}.service-grid article:last-child{grid-column:auto}.hero{min-height:650px}.hero-content{width:65vw}.why{grid-template-columns:1fr}.project-strip{min-height:300px}footer{grid-template-columns:1fr 1fr}}@media(max-width:700px){.site-header{height:78px}.brand{height:100%}.menu-toggle{display:block}.nav{display:none;position:absolute;top:78px;left:0;right:0;background:#070909;padding:15px 25px;flex-direction:column;align-items:stretch;gap:8px}.footer{grid-template-columns:1fr}.footer-brand img{width:100%;max-width:280px}nav.open{display:flex}.nav-cta{text-align:center}.hero{min-height:680px}.hero-photo{object-position:55% center}.hero-content{width:100%;padding:55px 24px 30px}.hero h1{font-size:42px}.hero-copy{font-size:16px}.trust-row{gap:12px}.service-grid{grid-template-columns:repeat(2,1fr)}.service-grid article:last-child{grid-column:auto}.project-strip{grid-template-columns:1fr;min-height:700px}.project-card{min-height:220px}.professionals,.estimate{grid-template-columns:1fr;gap:25px;padding:45px 24px}.pro-list{grid-template-columns:1fr}.testimonial{padding:30px 24px;font-size:15px}.services{padding:45px 18px}footer{grid-template-columns:1fr;padding:40px 24px}.copyright{grid-column:1}.estimate button{width:100%}}

@media(min-width:701px){
  .estimate{grid-template-columns:1fr 1fr;gap:60px;padding:70px 8vw}
  .estimate button{width:auto}
  footer{grid-template-columns:1.2fr 1.3fr 1.2fr;padding:45px 5vw 25px}
}
.featured-project{padding:72px 3vw;background:#f5f2eb}
.about-section{padding:80px 8vw;background:#fff}
.about-content{max-width:900px;margin:0 auto}
.about-content h2{font-size:38px;line-height:1.15;margin:0 0 28px;text-transform:uppercase}
.about-content h3{font-size:25px;color:#c42b22;margin:48px 0 14px}
.about-content p{font-size:18px;line-height:1.7;margin:0 0 18px}
.about-content .section-kicker{margin-bottom:12px}
.featured-project-heading{max-width:820px;margin:0 auto 35px;text-align:center}
.featured-project-heading h2{font-size:38px;text-transform:uppercase;margin:0 0 18px}
.featured-project-heading p:last-child{font-size:18px;line-height:1.6;color:#555}
.featured-project-gallery{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;max-width:1650px;margin:auto}
.featured-project-gallery figure{margin:0;background:#fff;box-shadow:0 3px 14px #0002;overflow:hidden}
.featured-project-gallery img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.featured-project-gallery figcaption{padding:12px 14px;font-weight:800;font-size:14px}
@media(max-width:1000px){.featured-project-gallery{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.featured-project{padding:50px 18px}.featured-project-heading h2{font-size:30px}.featured-project-gallery{grid-template-columns:1fr}}
@media(max-width:700px){.about-section{padding:50px 24px}.about-content h2{font-size:30px}.about-content h3{font-size:22px;margin-top:38px}.about-content p{font-size:16px;line-height:1.65}}
@media(max-width:700px){.footer-logo-frame{width:min(300px,100%);height:auto;aspect-ratio:1}}
.social-links {
  margin-top: 10px;
}

.social-links a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  text-decoration: none;
}

.social-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 5px;
  font-weight: 800;
  font-size: 16px;
  line-height: 1;
}

.facebook-icon {
  background: #1877F2;
  color: #fff;
  font-family: Arial, sans-serif;
}

.instagram-icon {
  background: linear-gradient(135deg, #833AB4, #E1306C, #F77737);
  color: #fff;
  border-radius: 7px;
  font-size: 18px;
}

.why .project-strip {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-height: 350px;
}

.why .project-card {
  min-height: 0;
}

@media(min-width:1001px) {
  .why {
    grid-template-columns: 20% 80%;
  }
}

.brand img {
}

.footer-brand img {
  width: 100%;
  height: 100%;
  max-height: none;
  border-radius: 50%;
  object-fit: contain;
  object-position: center;
  background: #f51f26;
}

.footer-logo-frame {
  width: min(100%, 450px);
  height: auto;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  background: #f51f26;
  position: relative;
}

.footer-logo-frame > img {
  width: 134%;
  height: auto;
  max-width: none;
  position: absolute;
  left: 50.4%;
  top: 50.5%;
  transform: translate(-50%, -50%);
}

.brand img {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 50%;
  object-fit: contain;
  object-position: center;
  background: #f51f26;
}

.brand-logo-frame {
  display: block;
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  background: #f51f26;
  position: relative;
}

.brand-logo-frame > img {
  width: 134%;
  height: auto;
  max-width: none;
  position: absolute;
  left: 50.4%;
  top: 50.5%;
  transform: translate(-50%, -50%);
}

@media(max-width:700px) {
  .footer-logo-frame {
    width: min(100%, 320px);
  }
}/* =========================================
   BRAVO PROJECT GALLERY
   ========================================= */

.gallery-section {
  padding: 90px 1.5vw;
  background: #f5f2ec;
}

.gallery-heading {
  max-width: 760px;
  margin: 0 auto 45px;
  text-align: center;
}

.gallery-heading h2 {
  margin: 0 0 14px;
  font-size: clamp(2rem, 4vw, 3.2rem);
}

.gallery-heading p:last-child {
  margin: 0;
  color: #555;
  line-height: 1.7;
}

.gallery-grid {
  max-width: none;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
}

.gallery-grid figure {
  margin: 0;
  overflow: hidden;
  background: #fff;
  border-radius: 4px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.gallery-grid img {
  display: block;
  width: 100%;
  height: 280px;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.gallery-grid figure:hover img {
  transform: scale(1.04);
}

.gallery-grid figcaption {
  padding: 16px 18px;
  font-weight: 600;
  color: #222;
}

.gallery-grid figure {
  cursor: pointer;
}

.gallery-grid figure:focus-visible {
  outline: 3px solid #c8a24a;
  outline-offset: 3px;
}

.gallery-status {
  grid-column: 1 / -1;
  text-align: center;
  color: #666;
  margin: 20px 0;
}

/* Lightbox */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4vh 4vw;
  background: rgba(7, 9, 9, 0.92);
}

.lightbox[hidden] {
  display: none;
}

.submit-overlay {
  position: fixed;
  inset: 0;
  width: 100vw;
  min-height: 100vh;
  z-index: 200;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  background: rgba(7, 9, 9, 0.72);
  color: #FFFFFF;
  text-align: center;
}

.submit-overlay[hidden] {
  display: none;
}

.submit-overlay p {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
}

.submit-logo {
  width: min(28vw, 150px);
  height: auto;
  aspect-ratio: 1;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
}

.submit-spinner {
  width: 48px;
  height: 48px;
  border: 4px solid rgba(255, 255, 255, 0.3);
  border-top-color: #e1a52b;
  border-radius: 50%;
  animation: submit-spin 0.8s linear infinite;
}

@keyframes submit-spin {
  to { transform: rotate(360deg); }
}

.lightbox-figure {
  margin: 0;
  max-width: 90vw;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}

.lightbox-image {
  max-width: 90vw;
  max-height: 78vh;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 6px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.lightbox-caption {
  color: #FFFFFF;
  font-weight: 600;
  text-align: center;
  max-width: 90vw;
}

.lightbox-close,
.lightbox-nav {
  position: absolute;
  background: rgba(255, 255, 255, 0.1);
  color: #FFFFFF;
  border: 1px solid rgba(255, 255, 255, 0.25);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease;
}

.lightbox-close:hover,
.lightbox-nav:hover {
  background: rgba(200, 162, 74, 0.9);
}

.lightbox-close {
  top: 20px;
  right: 24px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  font-size: 30px;
  line-height: 1;
}

.lightbox-nav {
  top: 50%;
  transform: translateY(-50%);
  width: 54px;
  height: 54px;
  border-radius: 50%;
  font-size: 34px;
  line-height: 1;
}

.lightbox-prev {
  left: 24px;
}

.lightbox-next {
  right: 24px;
}

/* Tablet */
@media (max-width: 900px) {
  .gallery-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Phone */
@media (max-width: 600px) {
  .gallery-section {
    padding: 65px 20px;
  }

  .gallery-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .gallery-grid img {
    height: 250px;
  }
}

.why .section-kicker.red { color: #e1a52b !important; }
.small-job-note { margin: 18px 0 0; max-width: 500px; color: #FFFFFF; font-size: 15px; line-height: 1.3; }
.small-job-note strong { display: inline-block; margin-bottom: 3px; color: #e1a52b; text-transform: uppercase; font-size: 16px; letter-spacing: .8px; }
.small-job-note { font-family: inherit; font-size: 18px; font-weight: 400; line-height: 1.5; letter-spacing: normal; max-width: 510px; }
.small-job-note strong { display: inline; margin: 0; color: #e1a52b; font-family: inherit; font-size: inherit; font-weight: 700; line-height: inherit; letter-spacing: inherit; text-transform: none; }
.small-job-note .small-job-text { font-family: inherit; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: normal; }
.estimate-kicker { color: #e1a52b !important; }
.hero-content > h1 { font-size: clamp(35.7px, 3.825vw, 59.5px); }
.small-job-note { font-size: 17.25px; }
.small-job-note strong { font-size: 18px; }
.small-job-note { font-family: inherit; font-size: 18px; font-weight: 400; line-height: 1.5; letter-spacing: normal; max-width: 510px; }
.small-job-note strong { display: inline; margin: 0; color: #e1a52b; font-family: inherit; font-size: inherit; font-weight: 700; line-height: inherit; letter-spacing: inherit; text-transform: none; }
.hero-content .eyebrow { font-size: 18px; }
.small-job-note, .small-job-note strong { font-size: 18px; }
.small-job-note { font-size: 18px; line-height: 1.5; }
.small-job-note .small-job-text { font-size: 16px; line-height: 24px; }

.small-job-note span.small-job-text {
  font-size: 16px !important;
  line-height: 24px !important;
  font-weight: 400 !important;
  letter-spacing: normal !important;
  font-family: inherit !important;
}
.p1{background-image:url("assets/W. Saanich Church Retoration-01-.jpeg")}.p2{background-image:url("assets/W. Saanich Church Retoration-02-.jpeg")}.p3{background-image:url("assets/W. Saanich Church Retoration-03-.jpeg")}
.estimate-contact-block { display: flex; flex-direction: column; gap: 8px; margin-top: 18px; font-size: 17px; line-height: 1.5; }
.estimate-contact-block a, .estimate-contact-block p { color: #FFFFFF; text-decoration: none; margin: 0; }
.estimate-contact-block p { color: #FFFFFF; }
@media (max-width: 700px) {
  .small-job-note { font-size: 16px; }
}
#about .section-kicker.red { font-size: 19px; }
#about li { font-size: 20px; }

.small-job-note .small-job-text {
  font-size: 16px !important;
  line-height: 24px !important;
  font-weight: 400 !important;
  letter-spacing: normal !important;
  font-family: inherit !important;
}

