:root{
  --bg:#101a2d;
  --panel:#17243c;
  --text:#f7f9fc;
  --muted:#b9c4d4;
  --gold:#d7e1ef;
  --line:rgba(255,255,255,.13);
  --max:1180px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,sans-serif;background:radial-gradient(circle at 80% 0,rgba(117,150,198,.16),transparent 30%),var(--bg);color:var(--text);line-height:1.6}a{color:inherit;text-decoration:none}.container{width:min(calc(100% - 34px),var(--max));margin:auto}.site-header{position:sticky;top:0;z-index:20;background:rgba(11,12,15,.82);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}.nav{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:22px}.brand{display:flex;align-items:center;gap:10px;font-weight:800}.brand-mark{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(214,225,239,.72);color:#f4f7fb;font-size:.8rem}.nav-links{display:flex;gap:24px;font-size:.94rem}.menu-btn{display:none;background:none;border:0;color:#fff;font-size:1.35rem}.hero{min-height:calc(100vh - 74px);position:relative;display:grid;align-items:end;border-bottom:1px solid var(--line);overflow:hidden}.hero-media{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,18,34,.06),rgba(8,18,34,.72)),linear-gradient(135deg,rgba(27,46,78,.34),rgba(14,25,45,.16)),url('photos/waterfall-b.jpg') center 48%/cover no-repeat}.hero-content{position:relative;z-index:2;padding:130px 0 68px;max-width:900px}.eyebrow{font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:#cbd8e8;font-weight:700}h1,h2,h3{line-height:1.08;margin-top:0}h1{font-size:clamp(2.7rem,7vw,6.3rem);letter-spacing:-.045em}h2{font-size:clamp(2rem,4vw,3.4rem);letter-spacing:-.03em}p{color:var(--muted)}.hero-copy{max-width:720px;font-size:1.12rem}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border-radius:999px;border:1px solid var(--line);font-weight:700;background:rgba(255,255,255,.04)}.btn.primary{background:#dce5f2;color:#14213a;border-color:transparent}.actions{display:flex;gap:12px;flex-wrap:wrap}.section{padding:90px 0}.section-heading{display:grid;grid-template-columns:1fr .7fr;gap:36px;align-items:end;margin-bottom:34px}.cards,.price-grid,.portal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card,.price-card{border:1px solid var(--line);border-radius:24px;padding:28px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.022))}.number{font-size:.78rem;letter-spacing:.14em;color:#cbd8e8;margin-bottom:36px}.list{list-style:none;padding:0;display:grid;gap:10px}.list li:before{content:'• ';color:var(--gold)}.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:24px;overflow:hidden}.stat{padding:24px;background:#14213a}.stat strong{display:block;font-size:1.4rem}.portfolio-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.project-card{grid-column:span 6;min-height:310px;border:1px solid var(--line);border-radius:24px;position:relative;background:linear-gradient(180deg,transparent,rgba(6,14,27,.90)),radial-gradient(circle at 70% 20%,rgba(112,149,204,.22),transparent 24%),linear-gradient(135deg,#263a5b,#15233b)}.project-card.wide{grid-column:span 12}.project-content{position:absolute;left:0;right:0;bottom:0;padding:26px}.subhero{padding:105px 0 58px;border-bottom:1px solid var(--line)}.split{display:grid;grid-template-columns:1fr 1fr;gap:18px}.input{width:100%;padding:15px;border:1px solid var(--line);border-radius:14px;background:#16243d;color:#fff}.form{display:grid;gap:14px}.footer{padding:48px 0;border-top:1px solid var(--line)}.footer-grid{display:grid;grid-template-columns:1.4fr .6fr .6fr;gap:30px}.note{font-size:.86rem;color:#858a94}.price{font-size:2rem;font-weight:800;margin:16px 0}.price small{font-size:.85rem;color:var(--muted)}@media(max-width:900px){.section-heading,.split,.footer-grid{grid-template-columns:1fr}.cards,.price-grid,.portal-grid{grid-template-columns:1fr 1fr}.stats{grid-template-columns:1fr 1fr}.menu-btn{display:block}.nav-links{display:none;position:absolute;top:74px;left:17px;right:17px;flex-direction:column;background:#14213a;border:1px solid var(--line);padding:18px;border-radius:18px}.nav-links.open{display:flex}}@media(max-width:640px){.cards,.price-grid,.portal-grid,.stats{grid-template-columns:1fr}.project-card,.project-card.wide{grid-column:span 12}.section{padding:68px 0}}


/* ===== Populated preview v2 ===== */
.site-header{background:rgba(16,26,45,.92)}
.nav{min-height:82px}
.brand-logo{display:block;width:auto;height:auto;max-width:155px;max-height:54px;object-fit:contain}
.footer-logo{display:block;width:auto;height:auto;max-width:190px;max-height:76px;object-fit:contain;margin-bottom:14px}

/* Make the real imagery clearly visible in service cards. */
.card.photo-card{
  min-height:360px;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  background-image:
    linear-gradient(
      180deg,
      rgba(7,16,31,.02) 0%,
      rgba(7,16,31,.05) 38%,
      rgba(7,16,31,.55) 63%,
      rgba(7,16,31,.94) 100%
    ),
    var(--card-photo);
  background-size:cover;
  background-position:center;
  padding:26px;
}
.card.photo-card .number{
  position:absolute;
  top:18px;
  left:20px;
  margin:0;
  padding:6px 9px;
  border-radius:999px;
  background:rgba(16,26,45,.74);
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(7px);
}
.card.photo-card h3{margin-bottom:8px}
.card.photo-card p{color:rgba(247,249,252,.84);margin-bottom:0}
.card.photo-card.church-card{background-position:center 34%}
.card.photo-card.sunset-card{background-position:center 58%}

/* Portfolio / project imagery */
.project-card.photo-project{
  min-height:390px;
  background-image:
    linear-gradient(180deg,rgba(8,18,34,.02) 32%,rgba(8,18,34,.84) 100%),
    var(--project-photo);
  background-size:cover;
  background-position:center;
}
.project-card.wide.photo-project{min-height:430px}
.project-card.church-project{background-position:center 34%}
.project-card.sunset-project{background-position:center 56%}

/* Photo-backed page headers so inner pages don't feel empty. */
.subhero.photo-subhero{
  position:relative;
  min-height:330px;
  display:grid;
  align-items:end;
  overflow:hidden;
  background-image:
    linear-gradient(180deg,rgba(10,23,43,.18),rgba(10,23,43,.90)),
    var(--subhero-photo);
  background-size:cover;
  background-position:center;
}
.subhero.photo-subhero .container{position:relative;z-index:1}
.subhero.photo-subhero p{color:rgba(247,249,252,.80)}

/* Pricing section banners: enough imagery without turning pricing into a gallery. */
.pricing-banner{
  height:240px;
  border-radius:22px;
  border:1px solid var(--line);
  margin:4px 0 22px;
  background-image:
    linear-gradient(90deg,rgba(12,26,47,.12),rgba(12,26,47,.36)),
    var(--pricing-photo);
  background-size:cover;
  background-position:center;
  overflow:hidden;
}
.pricing-banner.church{background-position:center 35%}
.pricing-banner.sunset{background-position:center 58%}

.price-card{
  position:relative;
  overflow:hidden;
}
.price-card::before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;width:3px;
  background:rgba(220,229,242,.48);
}
.price-card .price{color:#fff}

/* Projects page image-backed cards */
.project-list-card{
  min-height:300px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  position:relative;
  overflow:hidden;
  background-image:
    linear-gradient(180deg,rgba(8,18,34,.08),rgba(8,18,34,.92)),
    var(--card-photo);
  background-size:cover;
  background-position:center;
}
.project-list-card > *{position:relative;z-index:1}

/* Contact image */
.contact-photo{
  min-height:430px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  position:relative;
  overflow:hidden;
  background-image:
    linear-gradient(180deg,rgba(8,18,34,.08),rgba(8,18,34,.88)),
    url('photos/church.jpg');
  background-size:cover;
  background-position:center 42%;
}
.contact-photo p,.contact-photo li{color:rgba(247,249,252,.88)}

@media(max-width:900px){
  .brand-logo{max-width:132px;max-height:48px}
}
@media(max-width:640px){
  .nav{min-height:72px}
  .brand-logo{max-width:118px;max-height:42px}
  .card.photo-card{min-height:330px}
  .pricing-banner{height:190px}
  .project-card.photo-project,.project-card.wide.photo-project{min-height:340px}
}