/* Impact Window Production v2: matches the live WordPress site (Salient theme + "Use Any Font"),
   measured at 1440px wide. Two parts deliberately keep the Cloudflare (yellow) version's look:
   the Contact Us form (.iwp-form without .iwp-stacked) and the Projects photo grid (.gallery). */
/* The live site serves a regular-only Times New Roman file, so its bold text is the browser's
   synthesized bold. This declares only the visitor's own installed regular Times New Roman, so bold
   is synthesized the same way; no font file is served. */
@font-face{font-family:'iwp-times';src:local('Times New Roman'),local('TimesNewRomanPSMT'),local('Times New Roman Regular');font-weight:400}
:root{
  --bg:#000000; --card:#111111; --text:#ffffff; --muted:#d8d8d8;
  --yellow:#fec107; --yellow-dark:#e0aa00; --gold-btn:#e6ae03; --ink:#000000;
  --serif:'iwp-times','Times New Roman',Times,serif;
  --content-w:min(1245px, 100vw - 180px);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--serif);font-size:17px;line-height:27px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
/* the live site forces Times New Roman on these elements (Use Any Font plugin) */
h1,h2,h3,h4,h5,h6,body,p,blockquote,li,a,strong,b,em{font-family:var(--serif)!important}
img{max-width:100%;height:auto}
[hidden]{display:none!important}
a{color:var(--yellow)}
p{margin:0;padding-bottom:1.5em}
h1,h2,h3,h4,h5,h6{font-weight:700;margin:0 0 8px}
strong,b{font-weight:600}
.desk-br{display:inline}  /* the live hero heading wraps after "Door" on desktop */
h1{font-size:54px;line-height:62px;font-weight:600}
.as-h1{font-size:54px;line-height:62px;font-weight:600;text-transform:none}  /* h2 styled like the old in-content h1 (one h1 per page) */
h2{font-size:50px;line-height:60px;text-transform:capitalize}
h3{font-size:24px;line-height:34px;text-transform:capitalize}
h4{font-size:16px;line-height:32px;font-weight:600}
h5{font-size:16px;line-height:26px;font-weight:600}
h6{font-size:20px;line-height:28px;font-weight:600;color:var(--yellow)}
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
.wrap{max-width:1425px;margin:0 auto;padding-left:90px;padding-right:90px}

/* ---------- header: transparent, over the hero / page header ---------- */
.top{position:absolute;top:0;left:0;right:0;z-index:50;color:var(--yellow)}
.top-in{max-width:1425px;margin:0 auto;height:186px;padding:0 90px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.logo{display:block;justify-self:start}
.logo img{display:block;width:183px;height:auto}
.nav{display:flex;align-items:center}
.nav a{margin:0 10px;color:var(--yellow);text-decoration:none;font-weight:700;font-size:22px;line-height:32px;text-transform:capitalize;transition:color .2s}
.nav a span{position:relative;display:inline-block;line-height:25px}
.nav a span::after{content:"";position:absolute;left:0;right:0;bottom:-3px;border-top:2px solid #fff;transform:scaleX(0);transform-origin:left;transition:transform .3s}
.nav a:hover,.nav a[aria-current=page]{color:#ffffff}
.nav a:hover span::after,.nav a[aria-current=page] span::after{transform:scaleX(1)}
.hdr-right{justify-self:end;align-self:start;margin-top:51px;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.hdr-phone{color:var(--yellow);text-decoration:none;font-weight:700;font-size:20px;line-height:24px;white-space:nowrap;transition:color .2s}
.hdr-phone:hover{color:#fff}
.hdr-phone .fi{height:18px;margin-right:6px}
.badges{display:flex;gap:5px;align-items:center}
.badges img{display:block;width:61px;height:61px}
.menu-btn{display:none;background:none;border:0;padding:12px 5px;width:32px;height:44px;cursor:pointer}
.menu-btn span,.menu-btn span::before,.menu-btn span::after{display:block;width:22px;height:2px;background:#fff;position:relative}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0}
.menu-btn span::before{top:-7px}
.menu-btn span::after{top:7px}

/* ---------- home hero ---------- */
/* live Nectar slider: 741px tall from 1300px wide, 740 x (width / 1100) below that; text centred under the header */
.banner{position:relative;height:741px;padding:180px 100px 0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background-size:cover;background-position:50% 50%;color:#fff}
.banner h1{font-size:80px;line-height:90px;letter-spacing:-1px;margin:0 0 8px;font-weight:700;text-transform:capitalize}
.banner p{font-size:19px;line-height:29px;font-weight:700;padding:0;margin:0 0 8px;text-transform:capitalize}
@media (max-width:1299px){.banner{height:calc(100vw * 740 / 1100)}}
@media (max-width:1300px){
  .banner h1{font-size:64px;line-height:72px}
  .banner p{font-size:14px;line-height:24px}
}

/* ---------- inner page header ---------- */
.page-header{position:relative;height:450px;padding-top:286px;background-size:cover;background-position:50% 50%}
.page-header h1{color:#fff;margin:0;font-size:44px;line-height:54px}

/* ---------- rows and columns (WPBakery grid) ---------- */
.container-wrap{padding-bottom:40px}
.row{padding-top:70px;padding-bottom:70px}
.cols{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:25px;align-items:start}
.cols.vcenter{align-items:start}  /* set to centre in WPBakery, but the live page renders top-aligned */
.cols > .col + .col > .img-anim{margin-left:auto}
.cols.inner{margin:0 0 25.5px}
.cols.inner:last-child{margin-bottom:0}
.col{min-width:0}
.span-12{grid-column:span 12}.span-10{grid-column:span 10}.span-9{grid-column:span 9}.span-8{grid-column:span 8}
.span-6{grid-column:span 6}.span-4{grid-column:span 4}.span-3{grid-column:span 3}.span-2{grid-column:span 2}
.card{padding:clamp(22px,3.2vw,44px)}
.text{margin-bottom:25.5px}
.page-home .text,.col > .text:last-child{margin-bottom:0}
.text > :last-child,.col p:last-child{padding-bottom:0}
/* section spacing on the WPBakery pages: 25px under plain rows, none under rows with a background;
   the live About page also has an empty 25px row after every section */
.row{margin-bottom:25.5px}
.row.has-bg{margin-bottom:0}
.page-about-us .row{margin-bottom:51px}
.page-about-us .row.has-bg{margin-bottom:25.5px}
.container-wrap > .row:last-child{margin-bottom:0}
.img-anim{display:block;width:550px;max-width:100%;border-radius:10px}
.icon{color:var(--yellow);display:block;width:84px;padding:20px;margin:0 auto;line-height:0}

/* buttons (Salient nectar buttons: square corners) */
.btn-wrap{margin:0;padding:0}
.btn{display:inline-block;text-decoration:none;font-weight:600;border-radius:0;transition:opacity .2s}
.btn:hover{opacity:.85}
.btn-large{font-size:14px;line-height:20px;padding:15px 35px;background:var(--yellow);color:#000;margin-bottom:10px}
.btn-medium{font-size:12px;line-height:20px;padding:10px 24px;background:var(--gold-btn);color:#fff;margin-bottom:10px}
.btn-hero{font-size:16px;line-height:17.6px;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:10px 15px;background:var(--yellow);color:#fff}
.label{color:var(--yellow)}

/* ---------- home ---------- */
.page-home .row{padding:0;margin:25px 0 0}
.page-home #ro-about{margin-top:69px}
.page-home #ro-ben{margin-top:26px}
.about-cols{display:grid;grid-template-columns:715fr 504fr;gap:26px;align-items:start}
.form-cols{display:grid;grid-template-columns:1fr 1fr;gap:25px;align-items:start}
.home-img{display:block}
.about-cols .home-img{width:100%}
#ro-ben h2{margin-bottom:10px}
.benefits{display:grid;grid-template-columns:1fr 1fr;gap:26px 25px;margin-top:26px}
.cola1 p{padding-bottom:0}
.home-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin-top:25px}
.home-gallery img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
.milestones{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;text-align:center}
.milestones .num{display:block;font-size:62px;line-height:62px;font-weight:600}
.milestones .sub{display:block;margin-top:5px}

/* ---------- projects galleries (kept from the Cloudflare version) ---------- */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.g-item{display:block;overflow:hidden}
.g-item img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;transition:transform .35s}
.g-item:hover img{transform:scale(1.05)}

/* ---------- quote form ---------- */
/* Contact Us: kept from the Cloudflare version */
.iwp-form{max-width:680px;margin-top:10px}
.iwp-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:22px}
.iwp-full{grid-column:1/-1}
.iwp-form label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600;color:var(--yellow);font-family:Arial,Helvetica,sans-serif}
.iwp-form input{width:100%;padding:14px 16px;border:1px solid #8a8a8a;border-radius:4px;background:#fff;font-size:16px;color:#1a1a1a;font-family:Arial,Helvetica,sans-serif}
.iwp-form input:focus{border-color:#000;outline:3px solid var(--yellow);outline-offset:0}
.iwp-form input.bad{border-color:var(--yellow);outline:2px solid var(--yellow)}
.iwp-form button{background:var(--yellow);color:#000;border:0;border-radius:4px;padding:16px 36px;font-size:17px;font-weight:700;cursor:pointer;font-family:Arial,Helvetica,sans-serif}
.iwp-form button:hover{background:var(--yellow-dark)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.cf-turnstile{margin:0 0 12px}
.form-msg{margin:16px 0 0;padding:12px 16px;border-left:4px solid var(--yellow);background:var(--card);font-family:Arial,Helvetica,sans-serif;font-size:15px}
/* Home: the live site's stacked Contact Form 7 form */
.iwp-stacked{margin-top:0}
.iwp-stacked .iwp-grid{display:block;margin:0}
.iwp-stacked label{font-family:var(--serif);line-height:27px}
.iwp-stacked input{width:296px;max-width:100%;font-family:var(--serif);line-height:24px}
.iwp-stacked button{margin-top:22px;border-radius:0;padding:15px 22px;font-size:17px;line-height:20px}

/* ---------- footer ---------- */
.foot{background:var(--bg);color:var(--yellow)}
.foot-in{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;padding-top:75px;padding-bottom:79px}
.foot p{padding:0;margin:0 0 30px}
.foot h4{color:var(--yellow);margin:0 0 20px}
.foot a{color:var(--yellow);text-decoration:none;transition:color .2s}
.foot a:hover,.foot a:active{color:#ffffff}
.contact-list a{display:block;margin-bottom:8px}
.fi{height:17px;width:auto;vertical-align:-2px;margin-right:1px}
.foot-nav{display:flex;flex-direction:column;gap:8px}
.foot-logo{display:block;width:242px;height:auto;margin-bottom:23px}
.foot-legal{padding:45px 0;font-size:14px;line-height:22px;text-align:center}
.foot-legal .wrap{padding-top:3px}

/* ---------- lightbox ---------- */
.lb{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center;flex-direction:column;padding:20px}
.lb img{max-width:min(92vw,1200px);max-height:82vh;width:auto;height:auto;background:#fff}
.lb p{margin:12px 0 0;padding:0;color:#fff}
.lb button{position:absolute;background:none;border:0;color:#fff;cursor:pointer;font-size:46px;line-height:1;width:56px;height:56px}
.lb-x{top:12px;right:12px}
.lb-prev{left:8px;top:50%;transform:translateY(-50%)}
.lb-next{right:8px;top:50%;transform:translateY(-50%)}

/* ---------- responsive (phone values measured on the live site at 390px) ---------- */
@media (max-width:999px){
  .wrap{padding-left:6vw;padding-right:6vw}
  .top-in{height:94px;padding:12px 6vw;grid-template-columns:1fr auto}
  .logo img{width:98px}
  .top-in{grid-template-columns:1fr auto auto}
  .hdr-right{grid-column:2;grid-row:1;margin-top:0;align-self:center;margin-right:14px}
  .menu-btn{grid-column:3;grid-row:1}
  .hdr-phone{font-size:16px}
  .badges{display:none}
  .menu-btn{display:block;justify-self:end}
  .nav{display:none;grid-column:1/-1;flex-direction:column;align-items:stretch;background:rgba(0,0,0,.95);padding:8px 16px;margin:0 -6vw}
  .nav.open{display:flex}
  .nav a{margin:0;border-bottom:1px solid #222;padding:12px 0}
  .cols,.about-cols,.form-cols{grid-template-columns:1fr}
  .cols > .col{grid-column:1/-1}
  .cols > .col.empty{height:0}  /* the live theme keeps empty side columns as 25px spacers on phones */
  .gallery{grid-template-columns:repeat(3,1fr)}
  .foot-in{grid-template-columns:1fr;gap:40px;padding-top:55px;padding-bottom:55px}
  h2{font-size:38px;line-height:45px}
  h3{font-size:20px;line-height:28px}
  .banner{display:block;padding:calc(100vw * 85 / 390) 6vw 0}
  .banner h1{font-size:calc(100vw * 15 / 390);line-height:1.4;letter-spacing:0;margin-bottom:3px}
  .banner p{font-size:max(6px, calc(100vw * 6 / 390));line-height:1.8;padding-bottom:7px;margin:0 0 10px}
  .btn-hero{font-size:10px;line-height:11px}
  .desk-br{display:none}
  .page-header{height:212px;padding-top:119px}
  .page-header h1{font-size:36px;line-height:39px}
  .home-img,.about-cols .home-img{width:100%}
  .iwp-stacked input{width:100%}
  .home-gallery{grid-template-columns:1fr}
  .page-home #ro-about{margin-top:40px}
}
@media (max-width:690px){
  .benefits,.milestones,.iwp-grid{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr 1fr}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
