/* =========================================================================
   SHAHZAD BROTHERS GLOBAL ENTERPRISES
   Design concept: "Site Drawing" — the visual language of a construction
   set of drawings. Blueprint-grid grounds, dimension-line rules used as
   section dividers/labels, crop-marked cards like sheet corners, mono
   annotations for data. Amber = safety/hi-vis, Ink = blueprint navy.
   ========================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --ink:        #16202B;
  --ink-2:      #1E2C3A;
  --steel:      #2E4A5E;
  --paper:      #ECEEF0;
  --paper-2:    #F7F8F9;
  --line:       #D5DAE0;
  --line-strong:#B7BFC8;
  --amber:      #E2792E;
  --amber-dark: #B85F1F;
  --graphite:   #4B5560;
  --graphite-2: #8993A0;
  --white:      #FFFFFF;

  --display: 'Barlow Condensed', sans-serif;
  --body: 'Inter', sans-serif;
  --mono: 'IBM Plex Mono', monospace;

  --maxw: 1180px;
}

*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  font-family: var(--body);
  color: var(--graphite);
  background: var(--paper);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{
  font-family: var(--display);
  color: var(--ink);
  font-weight: 700;
  line-height: 1.05;
  margin: 0 0 .5em;
  letter-spacing: .01em;
}
p{ margin: 0 0 1em; }
.container{
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 28px;
}

/* Focus visibility */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline: 2px solid var(--amber);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior:auto !important; }
}

/* -------------------------------------------------------------------------
   Blueprint grid background (used on dark + paper sections)
   ------------------------------------------------------------------------- */
.grid-bg{
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size: 42px 42px;
}
.grid-bg-light{
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 42px 42px;
}

/* -------------------------------------------------------------------------
   Dimension-line rule — the site's signature device.
   A labeled measurement line, like an annotation on a working drawing.
   ------------------------------------------------------------------------- */
.dim-rule{
  display:flex;
  align-items:center;
  gap:14px;
  margin: 0 0 40px;
  color: var(--graphite-2);
}
.dim-rule::before, .dim-rule::after{
  content:"";
  flex:1;
  height:1px;
  background: var(--line-strong);
  position:relative;
}
.dim-rule::before{ margin-left:0; }
.dim-rule .dim-label{
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  white-space:nowrap;
  color: var(--steel);
}
.dim-rule.on-dark{ color: rgba(255,255,255,.35); }
.dim-rule.on-dark::before, .dim-rule.on-dark::after{ background: rgba(255,255,255,.25); }
.dim-rule.on-dark .dim-label{ color: var(--amber); }

/* -------------------------------------------------------------------------
   Header / Nav
   ------------------------------------------------------------------------- */
.site-header{
  position: sticky; top:0; z-index: 100;
  background: var(--ink);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  height: 84px;
}
.brand{ display:flex; flex-direction:column; line-height:1; }
.brand .brand-main{
  font-family: var(--display);
  font-weight: 700;
  font-size: 22px;
  letter-spacing: .03em;
  color: var(--white);
  text-transform: uppercase;
}
.brand .brand-main span{ color: var(--amber); }
.brand .brand-sub{
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: .18em;
  color: var(--graphite-2);
  text-transform: uppercase;
  margin-top: 3px;
}
.nav-toggle{
  display:none;
  background:none; border:1px solid rgba(255,255,255,.25); border-radius:4px;
  width:42px; height:38px; cursor:pointer; position:relative;
}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:""; position:absolute; left:10px; right:10px; height:2px; background:var(--white);
}
.nav-toggle span{ top:18px; }
.nav-toggle span::before{ top:-7px; }
.nav-toggle span::after{ top:7px; }

.main-nav ul{ display:flex; gap: 4px; align-items:center; }
.main-nav a{
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.72);
  padding: 10px 14px;
  display:block;
  border-bottom: 2px solid transparent;
  transition: color .15s ease, border-color .15s ease;
}
.main-nav a:hover, .main-nav a.active{
  color: var(--white);
  border-color: var(--amber);
}
.main-nav a.cta{
  background: var(--amber);
  color: var(--ink);
  font-weight: 600;
  border-radius: 2px;
  border-bottom-color: transparent;
  margin-left: 8px;
}
.main-nav a.cta:hover{ background: var(--amber-dark); color: var(--white); }

@media (max-width: 900px){
  .nav-toggle{ display:block; }
  .main-nav{
    position:absolute; top:84px; left:0; right:0;
    background: var(--ink);
    border-bottom: 1px solid rgba(255,255,255,.08);
    max-height:0; overflow:hidden;
    transition: max-height .25s ease;
  }
  .main-nav.open{ max-height: 420px; }
  .main-nav ul{ flex-direction:column; align-items:stretch; padding: 8px 28px 20px; gap:0; }
  .main-nav a{ padding: 13px 0; border-bottom:1px solid rgba(255,255,255,.06); }
  .main-nav a.cta{ text-align:center; margin: 12px 0 0; }
}

/* -------------------------------------------------------------------------
   Buttons
   ------------------------------------------------------------------------- */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family: var(--mono);
  font-size: 13px; letter-spacing:.06em; text-transform:uppercase;
  padding: 14px 24px;
  border-radius: 2px;
  border: 1px solid transparent;
  cursor:pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .1s ease;
}
.btn:hover{ transform: translateY(-1px); }
.btn-amber{ background: var(--amber); color: var(--ink); font-weight:600; }
.btn-amber:hover{ background: var(--amber-dark); color: var(--white); }
.btn-outline-dark{ border-color: rgba(255,255,255,.35); color: var(--white); }
.btn-outline-dark:hover{ border-color: var(--amber); color: var(--amber); }
.btn-outline{ border-color: var(--line-strong); color: var(--ink); }
.btn-outline:hover{ border-color: var(--steel); color: var(--steel); }
.btn-arrow::after{ content:"→"; }

/* -------------------------------------------------------------------------
   Hero
   ------------------------------------------------------------------------- */
.hero{
  background: var(--ink);
  color: var(--white);
  position:relative;
  overflow:hidden;
  padding: 84px 0 96px;
}
.hero-inner{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 48px;
  align-items:center;
  position:relative; z-index:2;
}
.hero .eyebrow{
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--amber);
  display:flex; align-items:center; gap:10px;
  margin-bottom: 22px;
}
.hero .eyebrow::before{ content:""; width:22px; height:1px; background:var(--amber); }
.hero h1{
  color: var(--white);
  font-size: clamp(40px, 5.4vw, 64px);
  max-width: 12.5em;
}
.hero h1 em{ color: var(--amber); font-style:normal; }
.hero p.lead{
  color: rgba(255,255,255,.7);
  font-size: 17px;
  max-width: 46ch;
  margin: 18px 0 30px;
}
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; }

.hero-art{ position:relative; }
.hero-art svg{ width:100%; height:auto; }

@media (max-width: 900px){
  .hero-inner{ grid-template-columns: 1fr; }
  .hero-art{ order:-1; max-width:320px; margin: 0 auto; }
}

/* -------------------------------------------------------------------------
   Stat / dimension strip
   ------------------------------------------------------------------------- */
.stat-strip{ background: var(--paper-2); border-bottom:1px solid var(--line); }
.stat-strip .container{
  display:grid; grid-template-columns: repeat(4,1fr);
  padding: 0;
}
.stat{
  padding: 34px 24px;
  border-left: 1px solid var(--line);
  text-align:center;
}
.stat:first-child{ border-left:none; }
.stat .num{
  font-family: var(--display); font-weight:700; color: var(--ink);
  font-size: 40px; line-height:1;
}
.stat .num span{ color: var(--amber); }
.stat .lbl{
  font-family: var(--mono); font-size: 11px; letter-spacing:.1em;
  text-transform:uppercase; color: var(--graphite-2); margin-top:8px;
}
@media (max-width: 760px){
  .stat-strip .container{ grid-template-columns: repeat(2,1fr); }
  .stat:nth-child(3){ border-left:none; }
}

/* -------------------------------------------------------------------------
   Sections
   ------------------------------------------------------------------------- */
section{ padding: 88px 0; }
.section-head{ max-width: 640px; margin-bottom: 48px; }
.section-head h2{ font-size: clamp(30px, 3.6vw, 42px); }
.section-head p{ color: var(--graphite); font-size: 16px; }
.on-dark{ background: var(--ink); color: rgba(255,255,255,.75); }
.on-dark h2, .on-dark h3, .on-dark h4{ color: var(--white); }
.on-steel{ background: var(--steel); color: rgba(255,255,255,.82); }
.on-steel h2, .on-steel h3{ color: var(--white); }

/* -------------------------------------------------------------------------
   Crop-mark card — like a corner-marked drawing sheet
   ------------------------------------------------------------------------- */
.crop-card{
  position:relative;
  background: var(--white);
  border: 1px solid var(--line);
  padding: 30px 26px;
}
.crop-card::before, .crop-card::after,
.crop-card > .cc-b1, .crop-card > .cc-b2{
  content:""; position:absolute; width:14px; height:14px;
  border-color: var(--amber); border-style:solid; border-width:0;
}
.crop-card::before{ top:-1px; left:-1px; border-top-width:2px; border-left-width:2px; }
.crop-card::after{ top:-1px; right:-1px; border-top-width:2px; border-right-width:2px; }

.crop-card{ transition: border-color .15s ease, transform .15s ease; }
.crop-card:hover{ transform: translateY(-3px); border-color: var(--line-strong); }

/* -------------------------------------------------------------------------
   Grids
   ------------------------------------------------------------------------- */
.grid{ display:grid; gap: 26px; }
.grid-3{ grid-template-columns: repeat(3,1fr); }
.grid-2{ grid-template-columns: repeat(2,1fr); }
.grid-4{ grid-template-columns: repeat(4,1fr); }
@media (max-width: 900px){
  .grid-3, .grid-4{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 620px){
  .grid-2, .grid-3, .grid-4{ grid-template-columns: 1fr; }
}

/* Service card */
.service-card .icon{
  width:46px; height:46px; margin-bottom:18px;
  color: var(--amber);
}
.service-card h3{ font-size: 22px; margin-bottom: 8px; }
.service-card p{ font-size: 14.5px; color: var(--graphite); margin-bottom:0; }
.service-card .tag{
  display:block; font-family:var(--mono); font-size:11px; letter-spacing:.1em;
  color: var(--graphite-2); text-transform:uppercase; margin-bottom:12px;
}

/* Project card */
.project-card{ padding:0; overflow:hidden; }
.project-card .thumb{
  background: var(--ink); aspect-ratio: 4/3; position:relative; overflow:hidden;
}
.project-card .thumb svg{ position:absolute; inset:0; width:100%; height:100%; }
.project-card .thumb .cat{
  position:absolute; bottom:12px; left:12px;
  font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
  background: var(--amber); color: var(--ink); padding:4px 10px;
}
.project-card .body{ padding: 20px 22px 24px; }
.project-card h3{ font-size: 21px; margin-bottom:4px; }
.project-card .loc{
  font-family: var(--mono); font-size:12px; color: var(--graphite-2);
}

/* Process timeline (numbered — genuine sequence) */
.process{ counter-reset: step; }
.process .grid-4{ gap: 0; }
.step{
  position:relative; padding: 0 22px 0 0; border-right:1px solid var(--line);
}
.step:last-child{ border-right:none; }
.step .step-num{
  font-family: var(--mono); font-size:13px; color:var(--amber);
  display:block; margin-bottom:14px;
}
.step h4{ font-size:19px; margin-bottom:8px; }
.step p{ font-size:14px; margin-bottom:0; }
@media (max-width: 900px){
  .step{ border-right:none; border-bottom:1px solid var(--line); padding: 0 0 24px; margin-bottom:24px; }
}

/* Blog card */
.post-card .date{
  font-family: var(--mono); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase;
  color: var(--amber); display:block; margin-bottom:10px;
}
.post-card h3{ font-size: 21px; }
.post-card .excerpt{ font-size:14.5px; color:var(--graphite); }
.post-card .read{
  font-family: var(--mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase;
  color: var(--steel); display:inline-block; margin-top:8px;
}

/* CTA band */
.cta-band{
  background: var(--ink); color: var(--white);
  text-align:center; padding: 80px 0;
}
.cta-band h2{ color:var(--white); font-size: clamp(28px,4vw,40px); }
.cta-band p{ color: rgba(255,255,255,.65); max-width: 46ch; margin:0 auto 30px; }

/* -------------------------------------------------------------------------
   Forms
   ------------------------------------------------------------------------- */
.form-row{ display:grid; grid-template-columns: 1fr 1fr; gap:20px; }
@media (max-width:620px){ .form-row{ grid-template-columns:1fr; } }
.field{ margin-bottom: 20px; }
.field label{
  display:block; font-family:var(--mono); font-size:11.5px; letter-spacing:.08em;
  text-transform:uppercase; color: var(--graphite-2); margin-bottom:8px;
}
.field input, .field textarea, .field select{
  width:100%; font-family: var(--body); font-size:15px; color:var(--ink);
  background: var(--white); border: 1px solid var(--line-strong);
  padding: 13px 14px; border-radius:2px;
}
.field textarea{ min-height:140px; resize:vertical; }
.field input:focus, .field textarea:focus{ border-color: var(--amber); }

.alert{
  padding: 16px 18px; border-left:3px solid var(--amber); background:var(--paper-2);
  font-size:14.5px; margin-bottom:28px;
}
.alert.ok{ border-color:#3E8E5B; }
.alert.err{ border-color:#C24444; }

/* -------------------------------------------------------------------------
   Page header (interior pages)
   ------------------------------------------------------------------------- */
.page-header{ background: var(--ink); color:var(--white); padding: 58px 0 54px; }
.page-header .eyebrow{
  font-family:var(--mono); font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--amber);
  margin-bottom:12px; display:block;
}
.page-header h1{ color:var(--white); font-size: clamp(32px,4.4vw,50px); margin-bottom:10px; }
.page-header p{ color: rgba(255,255,255,.65); max-width:58ch; margin-bottom:0; }
.breadcrumb{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.06em; color:var(--graphite-2);
  text-transform:uppercase; margin-top:16px;
}
.breadcrumb a{ color: var(--graphite-2); }
.breadcrumb a:hover{ color: var(--amber); }

/* -------------------------------------------------------------------------
   Footer
   ------------------------------------------------------------------------- */
.site-footer{ background: var(--ink-2); color: rgba(255,255,255,.65); padding: 68px 0 0; }
.footer-grid{
  display:grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 40px;
  padding-bottom: 50px; border-bottom:1px solid rgba(255,255,255,.08);
}
.footer-grid h4{
  color: var(--white); font-family:var(--mono); font-size:12px; letter-spacing:.1em;
  text-transform:uppercase; margin-bottom:18px; font-weight:500;
}
.footer-grid ul li{ margin-bottom:10px; }
.footer-grid a:hover{ color: var(--amber); }
.footer-grid .brand-main{ font-size:20px; }
.footer-about p{ font-size:14px; color: rgba(255,255,255,.55); max-width:32ch; }
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center;
  padding: 22px 0; font-family:var(--mono); font-size:11.5px; color: rgba(255,255,255,.4);
  flex-wrap:wrap; gap:10px;
}
@media (max-width:900px){
  .footer-grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width:560px){
  .footer-grid{ grid-template-columns: 1fr; }
}
/* Professional refresh */
:root{--paper:#fff;--paper-2:#f3f5f7;--ink:#102535;--ink-2:#132c40;--amber:#e88234;--graphite:#52616e;--display:'Barlow Condensed','Arial Narrow',Arial,sans-serif}
body{font-size:16px}h1,h2,h3{letter-spacing:-.02em}h2{font-size:clamp(2.2rem,4vw,3.5rem);line-height:1.08}h3{font-size:1.65rem;line-height:1.18}section{padding:90px 0}.site-header{background:#fff;border-bottom:1px solid #dfe5e9}.brand-main{font-size:25px}.brand-sub{font-size:12px;letter-spacing:.1em}.main-nav a{font-size:14px}.main-nav .cta{background:var(--ink);color:white}.eyebrow{font-size:13px;letter-spacing:.12em;line-height:1.6}.btn{font-size:15px;border-radius:2px;padding:15px 25px}.btn-arrow::after{content:none}.photo-hero{position:relative;isolation:isolate;min-height:650px;background:#102535;overflow:hidden;padding:85px 0 100px}.hero-photo{position:absolute;inset:0;z-index:-2;background:url('../images/construction.jpg') center 57%/cover}.photo-hero:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(9,28,43,.97) 0%,rgba(9,28,43,.88) 38%,rgba(9,28,43,.12) 100%)}.photo-hero .hero-inner{display:block}.photo-hero h1{font-size:clamp(3.2rem,6.2vw,5.5rem);max-width:760px;line-height:.99;color:white;margin:22px 0}.photo-hero h1 em{font-style:normal;color:#efa463}.photo-hero .lead{color:#d3dce4;max-width:535px;font-size:18px;line-height:1.75}.photo-hero .eyebrow{color:#efac76}.photo-hero .btn-outline-dark{color:#fff;border-color:#8395a3}.photo-note{position:absolute;right:25px;bottom:20px;font-size:12px;color:#fff;background:#102535a8;padding:5px 9px}.capability-strip{background:#102535;color:#fff;border-top:1px solid #ffffff20}.capability-strip .container{display:grid;grid-template-columns:repeat(4,1fr)}.capability-strip span{padding:24px 16px;font-size:14px;border-right:1px solid #ffffff20;text-align:center}.intro-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px}.large-copy{font-size:23px;color:var(--ink);line-height:1.5}.text-link,.service-link{font-size:14px;color:#934710;font-weight:600;border-bottom:1px solid #e7a771;padding-bottom:5px;display:inline-block}.services-section{background:#f2f5f7}.section-head{align-items:end}.section-head h2{max-width:630px}.section-head p{max-width:330px}.crop-card{border:1px solid #dce3e8;background:#fff;padding:32px;box-shadow:none}.crop-card:before,.crop-card:after{display:none}.service-card{position:relative;min-height:245px;transition:transform .2s,border-color .2s;display:flex;flex-direction:column}.service-card:hover{transform:translateY(-4px);border-color:var(--amber)}.service-card .tag{position:static;margin-bottom:24px;font-size:14px;color:#95501d}.service-card h3{max-width:260px}.service-link{margin-top:auto;align-self:start}.on-dark{background:var(--ink)}.on-dark h2,.on-dark h3{color:#fff}.on-dark p{color:#c0cbd5}.on-dark .eyebrow{color:#efa463}.editorial-split{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}figure{margin:0}.editorial-split img{width:100%;height:410px;object-fit:cover}figcaption{font-size:12px;margin-top:12px;color:#60717e;line-height:1.5}.on-dark figcaption{color:#b9c8d4}.process .grid{margin-top:45px}.step{border-top:2px solid #d9e1e7;padding-top:20px}.step-num{font-size:36px;color:#a75519}.step h3{font-size:25px}.cta-band{background:#e9eef2;text-align:center}.cta-band h2{color:var(--ink)}.cta-band p{color:#52616e}.page-header{background:#102535;padding:70px 0}.page-header h1{font-size:clamp(3rem,5vw,4.7rem);color:white;max-width:950px}.page-header p{color:#c5d2dd;max-width:750px;font-size:18px}.page-header .eyebrow{color:#efa463}.scope-list{margin:25px 0}.scope-list li{border-bottom:1px solid #dce3e8;padding:12px 0}.scope-list li:before{content:'•';color:#b56020;margin-right:12px}.scope-panel{padding:45px;background:#102535;color:#c5d2dd;border-left:4px solid var(--amber)}.scope-panel h3{color:#fff;margin-top:20px}.scope-panel p{line-height:2.1}.portfolio-note{padding:25px 30px;border-left:3px solid var(--amber);background:#f2f5f7;margin-bottom:35px}.portfolio-note p{margin:8px 0 0}.project-card{padding:0;overflow:hidden}.project-card>img{height:285px;width:100%;object-fit:cover}.project-card .body{padding:30px}.post-card h2{font-size:30px;margin:18px 0}.post-card p{margin-bottom:0}.site-footer{background:#0a1b29}.footer-grid{gap:40px}.site-footer p,.site-footer li{font-size:14px}.footer-bottom{font-size:12px}.field input,.field textarea{font-size:16px}.skip-link{position:absolute;left:12px;top:-70px;background:#fff;color:#102535;padding:12px;z-index:999}.skip-link:focus{top:12px}main{overflow:clip}
@media(min-width:900px){.site-header .container{min-height:92px}.hero-actions{margin-top:30px}}
@media(max-width:850px){section{padding:60px 0}.intro-layout,.editorial-split{gap:35px}.grid-3{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}.photo-hero{min-height:620px}.capability-strip .container{grid-template-columns:repeat(2,1fr)}.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.container{padding:0 22px}.intro-layout,.editorial-split,.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.photo-hero{padding:65px 0 80px;min-height:650px}.photo-hero:after{background:rgba(9,28,43,.8)}.photo-hero h1{font-size:3.35rem}.hero-actions{display:flex;flex-wrap:wrap;gap:12px}.hero-actions .btn{margin:0}.capability-strip span{font-size:13px;padding:17px 8px}.editorial-split img{height:290px}.footer-grid{grid-template-columns:1fr}.section-head{display:block}.section-head p{margin-top:18px}.brand-main{font-size:21px}.brand-sub{font-size:11px}.page-header{padding:50px 0}.scope-panel{padding:30px}.photo-note{right:12px;left:22px;width:fit-content}.form-row{grid-template-columns:1fr}.grid{gap:22px}.service-card{min-height:230px}}
.site-header .brand-main{color:var(--ink);font-size:25px}.site-header .brand-sub{color:#52616e;font-size:12px;letter-spacing:.09em}.main-nav a{color:#405565;font-family:var(--body);letter-spacing:0;text-transform:none}.main-nav a:hover,.main-nav a.active{color:var(--ink)}.main-nav a.cta{color:#fff;background:var(--ink)}.nav-toggle{border-color:#bec9d1}.nav-toggle span,.nav-toggle span:before,.nav-toggle span:after{background:var(--ink)}.service-card p{font-size:16px;margin-bottom:22px}.section-head{max-width:none;display:flex;gap:40px;justify-content:space-between}.section-head h2{font-size:clamp(2.2rem,4vw,3.5rem)}.process .grid-4{gap:25px}.step{border-right:none}.on-dark .btn{color:var(--ink)}
@media(max-width:900px){.main-nav{background:white;border-bottom-color:#dce3e8}.main-nav a{border-bottom-color:#dce3e8}}
@media(max-width:600px){.site-header .brand-main{font-size:21px}.site-header .brand-sub{font-size:10px}.section-head{display:block}}

/* SBGE supplied identity: navy and gold */
:root{--amber:#c7a13a;--amber-dark:#947219;--ink:#142648;--ink-2:#1c3155}
.site-header .brand{flex-direction:row;align-items:center;gap:14px}.brand-logo{width:132px;height:80px;object-fit:contain;background:transparent}.brand-copy{display:flex;flex-direction:column;gap:4px}.site-header .brand-main{font-size:20px}.site-header .brand-sub{font-size:10px}.site-header .container{height:104px}.footer-logo{width:235px;height:auto;background:transparent}.registration-section{background:#eef1f5}.registration-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:32px}.registration-card{padding:24px;background:white;border-top:3px solid var(--amber)}.registration-card>span{font-size:13px;color:#536174}.registration-card h3{font-size:25px;margin:16px 0 8px}.registration-card p{margin:0}.client-layout{display:grid;grid-template-columns:1.5fr 1fr;align-items:center;gap:50px}.client-name{border:1px solid #d9dfe7;padding:32px;text-align:center;font-size:60px;font-weight:700;letter-spacing:-.04em;color:var(--ink)}.client-name span{font-size:32px;font-weight:400;letter-spacing:0}.service-jump{display:flex;gap:10px;flex-wrap:wrap;padding-top:28px;padding-bottom:28px}.service-jump a{font-size:14px;padding:9px 13px;background:#eef1f5;border:1px solid #dde2e9}.service-jump a:hover{border-color:var(--amber)}section[id]{scroll-margin-top:115px}.table-scroll{overflow-x:auto}.pec-table{border-collapse:collapse;width:100%;background:#fff;font-size:16px}.pec-table caption{text-align:left;padding:16px 0;color:#536174}.pec-table th,.pec-table td{padding:20px;border:1px solid #d8dfe7;text-align:left;vertical-align:top}.pec-table thead{background:var(--ink);color:white}.pec-table tbody th{white-space:nowrap;width:155px;color:var(--ink)}.photo-hero h1 em,.photo-hero .eyebrow,.page-header .eyebrow,.on-dark .eyebrow{color:#e2c46f}.text-link,.service-link,.service-card .tag{color:#765a13}.text-link,.service-link{border-color:#c7a13a}.step-num{color:#856514}.service-card{min-height:280px}
@media(min-width:901px) and (max-width:1100px){.brand-copy{display:none}}
@media(max-width:900px){.main-nav{top:104px}.registration-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.brand-logo{width:112px;height:68px}.site-header .container{height:86px}.main-nav{top:86px}.brand-copy{display:none}.registration-grid,.client-layout{grid-template-columns:1fr}.registration-card{padding:22px}.client-name{font-size:50px}.pec-table th,.pec-table td{padding:14px}.pec-table{font-size:14px}section[id]{scroll-margin-top:95px}}

.nav-toggle span:before,.nav-toggle span:after{left:0;right:0}

/* A light footer keeps the transparent navy-and-gold logo legible. */
.site-footer{background:#edf1f5;color:#405268}.footer-grid h4{color:var(--ink)}.footer-about p,.footer-bottom{color:#405268}.footer-grid{border-bottom-color:#cfd8e1}.brand-logo,.footer-logo{background:transparent}

/* Approved logo-only header */
.site-header .container{height:156px;min-height:0;gap:32px}
.site-header .brand{flex:0 0 auto;gap:0}
.site-header .brand-logo{width:215px;height:auto;max-height:138px;object-fit:contain}
.site-header .main-nav{flex:0 0 auto}
section[id]{scroll-margin-top:172px}
@media(max-width:900px){
  .site-header .container{height:130px;gap:20px}
  .site-header .brand-logo{width:184px;max-height:114px}
  .site-header .main-nav{top:100%}
  section[id]{scroll-margin-top:146px}
}
@media(max-width:600px){
  .site-header .container{height:116px}
  .site-header .brand-logo{width:160px;max-height:100px}
  section[id]{scroll-margin-top:132px}
}