
:root{
  --bg:#050505;
  --bg2:#0a0a0a;
  --text:#f4efe7;
  --muted:#b7b0a6;
  --line:rgba(255,255,255,.08);
  --gold:#c79f5a;
  --gold2:#e1c38f;
  --radius:28px;
  --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;font-family:Inter,Arial,sans-serif;color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(199,159,90,.10), transparent 22%),
    linear-gradient(180deg,#030303,#0a0a0a 50%,#0b0b0b);
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.container{width:min(calc(100% - 32px),var(--max));margin:0 auto}
.header{
  position:fixed;inset:0 0 auto 0;z-index:60;background:rgba(5,5,5,.55);
  backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:.25s ease;
}
.header.scrolled{background:rgba(5,5,5,.92);border-color:var(--line)}
.nav{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{text-transform:uppercase;letter-spacing:.18em;font-size:.84rem;font-weight:700}
.menu{display:flex;gap:24px;align-items:center}
.menu a{color:var(--muted)}
.menu a:hover,.menu a.active{color:var(--text)}
.cta{padding:14px 18px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.03);color:var(--text)!important}
.hero{position:relative;min-height:100vh;overflow:hidden;display:grid;place-items:center}
.hero-slides,.hero-slide{position:absolute;inset:0}
.hero-slide{background-size:cover;background-position:center;opacity:0;transform:scale(1.08);transition:opacity 1.1s ease, transform 4.5s ease}
.hero-slide.active{opacity:1;transform:scale(1.14)}
.hero-overlay{position:absolute;inset:0;background:radial-gradient(circle at 50% 42%, rgba(255,255,255,.03), transparent 14%), linear-gradient(180deg, rgba(4,4,4,.60), rgba(4,4,4,.34) 38%, rgba(5,5,5,.86) 100%)}
.watermark-wrap{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.watermark{width:min(118vw,1500px);opacity:.14;transform:scale(1.22);will-change:transform,opacity}
.hero-copy{position:relative;z-index:3;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px;padding:0 16px}
.eyebrow{margin:0;text-transform:uppercase;letter-spacing:.22em;font-size:.75rem;color:var(--gold2);font-weight:700}
h1,h2,h3,p{margin:0}
h1{font-size:clamp(2.2rem,5.2vw,5rem);line-height:.94;letter-spacing:-.04em;max-width:10ch}
h2{font-size:clamp(1.8rem,4vw,3.2rem);line-height:1.02;letter-spacing:-.03em;max-width:14ch}
h3{font-size:1.08rem;line-height:1.15}
.lead,.section-copy,.contact-copy,.project-desc{max-width:58ch;color:var(--muted);line-height:1.7}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px}
.btn{min-height:56px;padding:0 24px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-weight:700}
.btn-primary{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#111}
.btn-secondary{border:1px solid var(--line);background:rgba(255,255,255,.03)}
.badges,.chips{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.badge,.chip{padding:10px 14px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--muted)}
.hero-note{color:rgba(243,239,232,.72);font-size:.82rem;text-transform:uppercase;letter-spacing:.16em;margin-top:4px}
.section{padding:110px 0;position:relative}
.section::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(94%,1160px);height:1px;background:linear-gradient(90deg, transparent, rgba(255,255,255,.08), transparent)}
.section-dark{background:linear-gradient(180deg, rgba(255,255,255,.012), rgba(255,255,255,.005))}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:18px;flex-wrap:wrap;margin-bottom:28px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.panel{border:1px solid var(--line);background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.024));border-radius:var(--radius);box-shadow:0 18px 55px rgba(0,0,0,.24)}
.pad{padding:24px}
.pad p{color:var(--muted);line-height:1.7;margin-top:10px}
.project-card{position:relative;overflow:hidden;min-height:390px}
.project-card img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.project-card:hover img,.gallery-item:hover img{transform:scale(1.04)}
.overlay{position:absolute;inset:auto 0 0 0;padding:22px;background:linear-gradient(180deg, transparent, rgba(0,0,0,.88))}
.tag{display:inline-block;margin-bottom:8px;text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;color:var(--gold2)}
.overlay p{color:#d6d0c7;line-height:1.55;margin-top:8px}
.form-card{padding:28px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-grid .full{grid-column:1 / -1}
label{display:grid;gap:8px;font-size:.9rem;color:var(--muted)}
input,textarea,select{width:100%;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--text);padding:16px;font:inherit}
textarea{min-height:140px;resize:vertical}
.submit{margin-top:18px}
.project-hero{min-height:78vh}
.project-hero .hero-overlay{background:linear-gradient(180deg, rgba(4,4,4,.56), rgba(4,4,4,.30) 36%, rgba(5,5,5,.88) 100%)}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.gallery-item{overflow:hidden;border-radius:24px;border:1px solid var(--line);background:rgba(255,255,255,.03);min-height:280px}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.footer{padding:36px 0 56px;border-top:1px solid var(--line);text-align:center}
.footer img{width:min(100%,320px);margin:0 auto 12px}
.footer p{color:var(--muted)}
@media (max-width:1100px){
  .grid-4,.grid-3,.gallery{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  .menu{display:none}
  .grid-4,.grid-3,.gallery,.form-grid{grid-template-columns:1fr}
  .form-grid .full{grid-column:auto}
  .watermark{width:min(132vw,900px);opacity:.11}
  h1{font-size:clamp(2rem,10vw,3rem);max-width:11ch}
}


/* 3 second loading screen */
.site-loader{
  position:fixed; inset:0; z-index:9999; display:grid; place-items:center;
  background:
    radial-gradient(circle at 50% 40%, rgba(199,159,90,.08), transparent 20%),
    linear-gradient(180deg, #020202 0%, #070707 100%);
  transition:opacity .7s ease, visibility .7s ease;
}
.site-loader.is-hidden{
  opacity:0; visibility:hidden; pointer-events:none;
}
.loader-inner{
  width:min(88vw, 640px);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:1.1rem; text-align:center;
}
.loader-logo{
  width:min(72vw, 420px);
  opacity:.98;
  transform:translateY(12px) scale(1.04);
  animation:loaderLogoIn 1.1s cubic-bezier(.2,.84,.22,1) forwards;
}
@keyframes loaderLogoIn{
  from{opacity:0; transform:translateY(18px) scale(1.08)}
  to{opacity:.98; transform:translateY(0) scale(1.04)}
}
.loader-line{
  width:min(72vw, 280px); height:2px; background:rgba(255,255,255,.08);
  overflow:hidden; border-radius:999px;
}
.loader-line span{
  display:block; width:100%; height:100%; transform:translateX(-100%);
  background:linear-gradient(90deg, rgba(255,255,255,0), var(--gold2), rgba(255,255,255,0));
  animation:loaderSweep 1.45s ease-in-out infinite;
}
@keyframes loaderSweep{
  0%{transform:translateX(-100%)}
  100%{transform:translateX(100%)}
}
.loader-text{
  margin:0; color:rgba(243,239,232,.82); text-transform:uppercase;
  letter-spacing:.22em; font-size:.78rem;
}
body.is-loading{overflow:hidden}


/* fixed identical preview cards */
.grid-3.projects-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:16px;
}
.projects-grid > .project-card{
  min-height:340px !important;
  height:340px !important;
  max-height:340px !important;
  overflow:hidden;
  position:relative;
}
.projects-grid > .project-card > a{
  position:absolute;
  inset:0;
  display:block;
}
.projects-grid > .project-card img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.projects-grid > .project-card .overlay{
  min-height:128px;
}
.projects-grid > .project-card:hover{
  transform:translateY(-6px);
  box-shadow:0 22px 60px rgba(0,0,0,.36);
  transition:transform .32s ease, box-shadow .32s ease;
}

.feature-strip{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.feature-box{
  border:1px solid var(--line);
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
  border-radius:24px;
  padding:24px;
}
.feature-box p{
  margin-top:10px;
  color:var(--muted);
  line-height:1.7;
}

.insta-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:12px;
}
.insta-tile{
  aspect-ratio:1/1;
  border-radius:22px;
  overflow:hidden;
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
}
.insta-tile img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .35s ease;
}
.insta-tile:hover img{
  transform:scale(1.05);
}

.review-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.review-card{
  border:1px solid var(--line);
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.024));
  border-radius:24px;
  padding:24px;
}
.review-stars{
  letter-spacing:.18em;
  color:var(--gold2);
  margin-bottom:12px;
}
.review-card p{
  color:var(--muted);
  line-height:1.7;
  margin-top:10px;
}
.review-name{
  margin-top:16px;
  color:var(--text);
  font-weight:700;
}
.review-role{
  margin-top:4px;
  color:rgba(243,239,232,.58);
  font-size:.92rem;
}

@media (max-width:1100px){
  .feature-strip{grid-template-columns:repeat(2,1fr)}
  .insta-grid{grid-template-columns:repeat(3,1fr)}
  .review-grid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .grid-3.projects-grid{grid-template-columns:1fr}
  .feature-strip{grid-template-columns:1fr}
  .insta-grid{grid-template-columns:repeat(2,1fr)}
}


/* identical homepage project cards */
.projects-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.projects-grid > .project-card{
  position:relative;
  height:340px !important;
  min-height:340px !important;
  max-height:340px !important;
  overflow:hidden;
}
.projects-grid > .project-card > a{
  position:absolute;
  inset:0;
  display:block;
}
.projects-grid > .project-card img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.projects-grid > .project-card .overlay{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
}
@media (max-width:760px){
  .projects-grid{grid-template-columns:1fr;}
}


/* publish preview refinements */
.sr-only{
  position:absolute!important;
  width:1px!important;height:1px!important;
  padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;border:0!important;
}
.hero-minimal .hero-copy{
  gap:18px;
}
.hero-minimal .hero-copy .lead{
  max-width:780px;
  font-size:clamp(1rem,1.6vw,1.18rem);
  line-height:1.75;
  color:rgba(244,239,231,.86);
}
.hero-minimal .hero-copy .sublead{
  text-transform:uppercase;
  letter-spacing:.22em;
  font-size:.72rem;
  color:var(--gold2);
}
.hero-minimal .hero-actions{
  margin-top:6px;
}
.hero-minimal .hero-note{
  display:none;
}
.section-copy.wide{
  max-width:920px;
}
.contact-layout{
  display:grid;
  grid-template-columns:0.95fr 1.05fr;
  gap:16px;
}
.contact-card{
  border:1px solid var(--line);
  border-radius:24px;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
  padding:24px;
}
.contact-list{
  display:grid;
  gap:14px;
  margin-top:18px;
}
.contact-row{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:14px;
  align-items:start;
  padding:12px 0;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.contact-row:last-child{border-bottom:0}
.contact-row span:first-child{
  color:rgba(244,239,231,.6);
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:.72rem;
}
.contact-row a,.contact-row strong,.contact-row div{
  color:var(--text);
}
.social-links{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:18px;
}
.social-pill{
  padding:12px 16px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.03);
}
.services-grid-lux{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.services-grid-lux .panel{
  min-height:215px;
}
.services-grid-lux p{
  color:var(--muted);
  line-height:1.75;
  margin-top:10px;
}
.footer .footer-grid{
  display:grid;
  grid-template-columns:1fr auto;
  gap:18px;
  align-items:center;
}
.footer .footer-meta{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  color:rgba(244,239,231,.72);
  font-size:.95rem;
}
@media (max-width:980px){
  .services-grid-lux{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact-layout{grid-template-columns:1fr}
}
@media (max-width:760px){
  .services-grid-lux{grid-template-columns:1fr}
  .contact-row{grid-template-columns:1fr;gap:6px}
}


.about-hero-clean .hero-copy{
  align-items:flex-start;
}
.about-hero-clean .hero-copy .lead{
  max-width:720px;
}
.about-split{
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  gap:20px;
  align-items:start;
}
.about-photo-card{
  border:1px solid var(--line);
  border-radius:28px;
  overflow:hidden;
  background:rgba(255,255,255,.03);
}
.about-photo-card img{
  width:100%;
  height:auto;
  display:block;
}
.about-copy-card{
  border:1px solid var(--line);
  border-radius:28px;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
  padding:28px;
}
.about-copy-card p{
  color:var(--muted);
  line-height:1.8;
}
.about-points{
  display:grid;
  gap:14px;
  margin-top:18px;
}
.about-points .point{
  padding:14px 0;
  border-top:1px solid rgba(255,255,255,.06);
}
.about-points .point:first-child{
  border-top:0;
  padding-top:0;
}
@media (max-width:900px){
  .about-split{grid-template-columns:1fr;}
}


/* final polish */
.hero-minimal .hero-copy .lead{
  max-width:860px;
}
.hero-minimal .hero-slides .hero-slide{
  background-position:center center;
}


/* final responsive QA pass */
html, body{
  max-width:100%;
  overflow-x:hidden;
}
*,
*::before,
*::after{
  box-sizing:border-box;
}
img, video, iframe{
  max-width:100%;
  height:auto;
}
.container{
  width:min(calc(100% - 24px), var(--max));
}
.hero,
.section,
.footer,
.panel,
.project-card,
.gallery-item,
.form-card,
.about-photo-card,
.about-copy-card,
.contact-card{
  max-width:100%;
}
.watermark{
  max-width:none;
}
.hero-copy{
  width:min(100%, 980px);
  margin-inline:auto;
  padding-left:12px;
  padding-right:12px;
}
.hero-actions{
  justify-content:center;
}
.hero-actions .btn{
  max-width:100%;
}
.lead,
.section-copy,
.contact-copy,
.project-desc{
  width:min(100%, 860px);
}
.grid-3,
.grid-4,
.projects-grid,
.gallery,
.contact-layout,
.about-split,
.services-grid-lux,
.feature-strip,
.review-grid,
.insta-grid,
.form-grid{
  min-width:0;
}
.grid-3 > *,
.grid-4 > *,
.projects-grid > *,
.gallery > *,
.contact-layout > *,
.about-split > *,
.services-grid-lux > *,
.feature-strip > *,
.review-grid > *,
.insta-grid > *,
.form-grid > *{
  min-width:0;
}
.project-card,
.projects-grid > .project-card{
  width:100%;
}
.overlay h3,
.panel h3,
.contact-row div,
.contact-row a,
.footer-meta,
.brand{
  word-break:break-word;
}
input, textarea, select, button{
  font-size:16px;
}
textarea{
  max-width:100%;
}
.social-links{
  align-items:center;
}
.footer .footer-grid{
  align-items:center;
}
.footer .footer-meta{
  justify-content:center;
}

@media (max-width:1100px){
  .container{
    width:min(calc(100% - 24px), var(--max));
  }
}

@media (max-width:900px){
  .about-split,
  .contact-layout{
    grid-template-columns:1fr !important;
  }
  .footer .footer-grid{
    grid-template-columns:1fr;
    text-align:center;
  }
}

@media (max-width:760px){
  .header{
    backdrop-filter:blur(10px);
  }
  .nav{
    min-height:74px;
  }
  .brand{
    font-size:.74rem;
    letter-spacing:.12em;
    max-width:68%;
    line-height:1.3;
  }
  .menu{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    justify-content:flex-end;
  }
  .menu a{
    font-size:.84rem;
  }
  .cta{
    padding:11px 14px;
  }
  .hero{
    min-height:100svh;
  }
  .hero-copy{
    gap:14px;
    padding-left:10px;
    padding-right:10px;
  }
  .hero-minimal .hero-copy .lead,
  .lead{
    font-size:.98rem;
    line-height:1.65;
  }
  .hero-actions{
    flex-direction:column;
    align-items:stretch;
    width:min(100%, 360px);
  }
  .hero-actions .btn{
    width:100%;
  }
  .chips,
  .badges,
  .social-links{
    justify-content:flex-start;
  }
  .projects-grid{
    grid-template-columns:1fr !important;
  }
  .projects-grid > .project-card{
    height:320px !important;
    min-height:320px !important;
    max-height:320px !important;
  }
  .grid-3,
  .grid-4,
  .gallery,
  .services-grid-lux,
  .feature-strip,
  .review-grid{
    grid-template-columns:1fr !important;
  }
  .gallery-item{
    min-height:240px;
  }
  .panel,
  .contact-card,
  .about-copy-card,
  .form-card{
    padding:20px;
  }
  .form-grid{
    grid-template-columns:1fr !important;
  }
  .form-grid .full{
    grid-column:auto !important;
  }
  .contact-row{
    grid-template-columns:1fr !important;
    gap:6px;
  }
  .footer{
    padding-bottom:40px;
  }
}

@media (max-width:480px){
  .container{
    width:min(calc(100% - 20px), var(--max));
  }
  .brand{
    max-width:100%;
  }
  .menu{
    gap:8px;
  }
  .menu a{
    font-size:.8rem;
  }
  .hero-minimal .hero-copy .lead,
  .lead{
    font-size:.94rem;
  }
  .projects-grid > .project-card{
    height:300px !important;
    min-height:300px !important;
    max-height:300px !important;
  }
  .gallery-item{
    min-height:220px;
  }
}


/* About page polish */
.about-copy-card h3{
  margin-bottom:14px;
}
.about-copy-card p{
  margin-bottom:16px;
}
.why-ultrabuild{
  margin-top:34px;
  padding-top:8px;
}
.why-ultrabuild > p{
  color:var(--muted);
  line-height:1.8;
  margin-bottom:18px;
}
.why-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin:24px 0;
}
.why-item{
  padding:20px 0;
  border-top:1px solid rgba(255,255,255,.08);
}
.why-item h3{
  font-size:1rem;
  line-height:1.35;
  margin-bottom:8px;
}
.why-item p{
  color:var(--muted);
  line-height:1.75;
  margin:0;
}
@media (max-width:760px){
  .why-grid{
    grid-template-columns:1fr;
  }
}


/* Pre-live spacing refinements */
.hero-copy-raised{
  padding-top: clamp(12px, 3vw, 42px);
}
.hero-copy-raised .hero-subtext-inline{
  display:block;
  margin-top: 10px;
}
.hero-actions-raised{
  margin-top: 28px;
  position: relative;
}
@media (min-width: 900px){
  .hero-copy-raised{
    transform: translateY(-26px);
  }
  .hero-actions-raised{
    transform: translateY(-14px);
  }
}
@media (max-width: 899px){
  .hero-copy-raised{
    transform: translateY(-8px);
  }
  .hero-actions-raised{
    margin-top: 20px;
    transform: none;
  }
}
@media (max-width: 640px){
  .hero-actions-raised{
    gap: 12px;
    flex-wrap: wrap;
  }
  .hero-actions-raised a,
  .hero-actions-raised button{
    width: 100%;
    justify-content: center;
  }
}
