/* United Construction Group — Homepage V2 concept. Loads ONLY on the /home-v2/ page. */
:root{
  --navy:#071C48; --navy-2:#0B2559; --navy-3:#04122F;
  --orange:#F97104; --orange-2:#FF8A2B;
  --steel:#C8D5DC; --mist:#F9FAFD; --white:#FFFFFF; --ink:#333333;
  --rule:rgba(200,213,220,.22);
  --max:1280px; --r:999px; --rc:14px;
  --roof:clamp(46px,7vw,118px);
}
/* neutralise Elementor canvas wrappers so the design controls its own layout */
.ucg-v2, .ucg-v2 *{box-sizing:border-box}
body.ucg-v2-page{margin:0;padding:0;font-family:'Poppins',system-ui,sans-serif;background:var(--navy);color:var(--white);font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.ucg-v2-page .elementor-section-wrap,body.ucg-v2-page .elementor-section,body.ucg-v2-page .elementor-container,body.ucg-v2-page .elementor-column,body.ucg-v2-page .elementor-widget-wrap,body.ucg-v2-page .elementor-widget,body.ucg-v2-page .e-con,body.ucg-v2-page .e-con-inner,body.ucg-v2-page .elementor-widget-html{margin:0!important;padding:0!important;max-width:none!important;width:100%!important}
html{scroll-behavior:smooth}
.ucg-v2 img{display:block;max-width:100%}
.ucg-v2 a{color:inherit;text-decoration:none}
.ucg-v2 h1,.ucg-v2 h2,.ucg-v2 h3,.ucg-v2 h4{font-weight:600;line-height:1.08;letter-spacing:-.02em;margin:0}
.ucg-v2 p,.ucg-v2 ul,.ucg-v2 ol,.ucg-v2 blockquote,.ucg-v2 figure{margin:0;padding:0}
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 32px}
.ucg-v2 section{position:relative}

.eyebrow{font-size:12px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--orange);display:flex;align-items:center;gap:12px}
.eyebrow::before{content:"";width:32px;height:1px;background:var(--orange)}
.eyebrow.center{justify-content:center}
.eyebrow.center::after{content:"";width:32px;height:1px;background:var(--orange)}
.ucg-v2 h1{font-size:clamp(38px,6.2vw,84px)}
.ucg-v2 h2{font-size:clamp(30px,3.9vw,54px)}
.ucg-v2 h3{font-size:clamp(20px,1.6vw,24px);line-height:1.2}
.lede{font-size:clamp(16px,1.35vw,19px);font-weight:300;color:rgba(255,255,255,.74);max-width:60ch}

.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 32px;font-size:13.5px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;border:1px solid transparent;border-radius:var(--r);transition:.28s cubic-bezier(.2,.7,.3,1);cursor:pointer;font-family:inherit}
.btn-primary{background:var(--orange);color:#fff}
.btn-primary:hover{background:var(--orange-2);transform:translateY(-2px);box-shadow:0 14px 34px -12px rgba(249,113,4,.75)}
.btn-ghost{border-color:rgba(255,255,255,.34);color:#fff}
.btn-ghost:hover{border-color:var(--orange);color:var(--orange);background:rgba(249,113,4,.08);transform:translateY(-2px)}
.btn .arw{transition:transform .28s}
.btn:hover .arw{transform:translateX(5px)}
.btn-sm{padding:12px 24px;font-size:12.5px}

.ucg-v2 header{position:fixed;inset:0 0 auto 0;z-index:200;transition:.35s}
.topbar{background:var(--navy-3);border-bottom:1px solid var(--rule);font-size:12.5px;color:rgba(255,255,255,.62)}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:40px;gap:24px}
.topbar a:hover{color:var(--orange)}
.topbar .lic{letter-spacing:.1em;text-transform:uppercase;font-size:11px}
.topbar .soc{display:flex;gap:16px;align-items:center}
.ucg-v2 nav{background:rgba(7,28,72,.9);backdrop-filter:blur(16px);border-bottom:1px solid var(--rule)}
.ucg-v2 nav .wrap{display:flex;align-items:center;justify-content:space-between;height:80px;gap:24px}
.ucg-v2 nav .logo img{height:38px;width:auto}
.menu{display:flex;gap:26px;font-size:12.5px;font-weight:400;letter-spacing:.11em;text-transform:uppercase;align-items:center;list-style:none}
.menu>li{list-style:none;position:relative}
.menu>li>a{position:relative;padding:28px 0;display:flex;align-items:center;gap:6px;color:rgba(255,255,255,.88)}
.menu>li>a::after{content:"";position:absolute;left:0;bottom:24px;width:0;height:2px;background:var(--orange);transition:width .3s}
.menu>li:hover>a::after{width:100%}
.menu>li:hover>a{color:#fff}
.caret{font-size:8px;opacity:.7;transition:transform .3s}
.menu>li:hover .caret{transform:rotate(180deg)}
.sub{position:absolute;top:100%;left:-20px;min-width:290px;background:var(--navy-3);border:1px solid var(--rule);border-radius:var(--rc);padding:10px;opacity:0;visibility:hidden;transform:translateY(10px);transition:.28s;box-shadow:0 24px 60px -20px rgba(0,0,0,.7);list-style:none}
.menu>li:hover .sub{opacity:1;visibility:visible;transform:none}
.sub li a{display:block;padding:11px 16px;border-radius:8px;font-size:12px;letter-spacing:.06em;color:rgba(255,255,255,.75);text-transform:none}
.sub li a:hover{background:rgba(249,113,4,.14);color:var(--orange)}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px}
.burger span{width:24px;height:2px;background:#fff;border-radius:2px;transition:.3s}
.mobile{display:none;background:var(--navy-3);border-top:1px solid var(--rule);max-height:0;overflow:hidden;transition:max-height .45s cubic-bezier(.2,.7,.3,1)}
.mobile.open{max-height:80vh;overflow-y:auto}
.mobile ul{list-style:none;padding:12px 20px 24px}
.mobile a{display:block;padding:13px 0;font-size:13px;letter-spacing:.12em;text-transform:uppercase;border-bottom:1px solid var(--rule)}
.mobile .sub-m a{padding-left:16px;font-size:12px;text-transform:none;letter-spacing:.04em;color:rgba(255,255,255,.62);border-bottom:0;padding-top:8px;padding-bottom:8px}

.hero{min-height:100vh;display:flex;align-items:flex-end;overflow:hidden}
.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(105deg,rgba(4,18,47,.94) 0%,rgba(7,28,72,.80) 42%,rgba(7,28,72,.30) 100%),linear-gradient(to top,rgba(4,18,47,.96) 0%,transparent 55%)}
.hero .wrap{position:relative;z-index:2;padding-top:190px}
.tagline{display:flex;align-items:center;gap:16px;font-size:clamp(12px,1.05vw,14px);font-weight:500;letter-spacing:.42em;text-transform:uppercase;color:#fff}
.tagline .peak{flex:0 0 auto;width:26px;height:14px;overflow:visible}
.tagline .peak path{fill:none;stroke:var(--orange);stroke-width:2.2;stroke-linecap:square;stroke-linejoin:miter}
.tagline .rule{flex:1;max-width:120px;height:1px;background:linear-gradient(to right,rgba(249,113,4,.85),rgba(249,113,4,0))}
.hero h1{max-width:16ch;margin:26px 0 22px}
.hero h1 em{font-style:normal;color:var(--orange);display:block}
.hero .lede{max-width:52ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:38px}
.hero-strip{margin-top:64px;border-top:1px solid var(--rule);display:grid;grid-template-columns:repeat(4,1fr)}
.hero-strip>div{padding:26px 26px 30px;border-right:1px solid var(--rule)}
.hero-strip>div:last-child{border-right:0}
.hero-strip .k{font-size:clamp(26px,2.6vw,38px);font-weight:600;color:#fff;letter-spacing:-.02em;line-height:1}
.hero-strip .l{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.56);margin-top:9px}

.ticker{background:var(--orange);overflow:hidden;padding:14px 0}
.ticker-in{display:flex;gap:56px;white-space:nowrap;animation:slide 34s linear infinite;font-size:12.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:#fff}
.ticker-in span{display:flex;align-items:center;gap:56px}
.ticker-in span::after{content:"\25C6";font-size:8px;opacity:.65}
@keyframes slide{to{transform:translateX(-50%)}}

.pad{padding:clamp(80px,9vw,140px) 0}
.sec-head{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:end;margin-bottom:60px}
.sec-head h2{margin-top:20px}

.markets{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.mkt{position:relative;min-height:460px;overflow:hidden;border-radius:var(--rc);background:var(--navy-2);display:flex;flex-direction:column;justify-content:flex-end;padding:34px 28px;isolation:isolate}
.mkt img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1s cubic-bezier(.2,.7,.3,1);filter:grayscale(.5)}
.mkt::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(4,18,47,.95) 12%,rgba(7,28,72,.55) 55%,rgba(7,28,72,.32) 100%);transition:.5s}
.mkt:hover img{transform:scale(1.09);filter:grayscale(0)}
.mkt:hover::before{background:linear-gradient(to top,rgba(249,113,4,.92) 0%,rgba(7,28,72,.72) 62%,rgba(7,28,72,.32) 100%)}
.mkt .num{font-size:11px;letter-spacing:.2em;color:var(--orange);margin-bottom:auto;transition:.4s}
.mkt:hover .num{color:#fff}
.mkt h3{margin-bottom:12px}
.mkt ul{list-style:none;font-size:13.5px;color:rgba(255,255,255,.72);max-height:0;overflow:hidden;transition:max-height .55s cubic-bezier(.2,.7,.3,1),margin .4s;display:flex;flex-direction:column;gap:5px}
.mkt:hover ul{max-height:190px;margin-top:4px;color:rgba(255,255,255,.94)}
.mkt ul li::before{content:"\2014";color:var(--orange);margin-right:9px}
.mkt:hover ul li::before{color:#fff}
.mkt .go{margin-top:18px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);display:flex;align-items:center;gap:8px}
.mkt:hover .go{color:#fff}

.svc-sec{background:var(--mist);color:var(--ink)}
.svc-sec h2{color:var(--navy)}
.svc-sec .lede{color:rgba(51,51,51,.72)}
.svcs{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.svc{background:#fff;border-radius:var(--rc);overflow:hidden;border:1px solid rgba(7,28,72,.08);transition:.4s cubic-bezier(.2,.7,.3,1);display:flex;flex-direction:column}
.svc:hover{transform:translateY(-8px);box-shadow:0 26px 54px -24px rgba(7,28,72,.42);border-color:rgba(249,113,4,.4)}
.svc .ph{position:relative;overflow:hidden;aspect-ratio:16/10}
.svc .ph img{width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.3,1)}
.svc:hover .ph img{transform:scale(1.08)}
.svc .body{padding:28px 26px 30px;display:flex;flex-direction:column;flex:1}
.svc h3{color:var(--navy);font-size:20px;margin-bottom:10px}
.svc p{font-size:14.5px;color:rgba(51,51,51,.7);margin-bottom:20px;flex:1}
.svc .lk{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);font-weight:500;display:flex;align-items:center;gap:8px}
.svc .lk .arw{transition:transform .28s}
.svc:hover .lk .arw{transform:translateX(5px)}

.delivery{background:var(--navy-3)}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:52px}
.tab{padding:13px 26px;font-size:12.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);cursor:pointer;border:1px solid var(--rule);border-radius:var(--r);transition:.3s;background:none;font-family:inherit}
.tab:hover{color:#fff;border-color:rgba(255,255,255,.42)}
.tab.on{color:#fff;background:var(--orange);border-color:var(--orange)}
.panel{display:none;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center;animation:fade .5s}
.panel.on{display:grid}
@keyframes fade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.panel h3{font-size:clamp(24px,2.4vw,34px);margin-bottom:18px}
.panel p{color:rgba(255,255,255,.68);margin-bottom:26px;max-width:52ch}
.panel ol{list-style:none;counter-reset:s;display:grid;gap:14px}
.panel ol li{counter-increment:s;display:flex;gap:16px;font-size:14.5px;color:rgba(255,255,255,.78)}
.panel ol li::before{content:counter(s,decimal-leading-zero);font-weight:600;color:var(--orange);font-size:12.5px;letter-spacing:.08em;padding-top:3px}
.panel figure img{aspect-ratio:4/3.2;object-fit:cover;width:100%;border-radius:var(--rc)}

.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:40px}
.chip{padding:11px 22px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--rule);border-radius:var(--r);color:rgba(255,255,255,.66);cursor:pointer;transition:.28s;background:none;font-family:inherit}
.chip:hover{border-color:var(--orange);color:#fff}
.chip.on{background:var(--orange);border-color:var(--orange);color:#fff}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{position:relative;overflow:hidden;border-radius:var(--rc);background:var(--navy-2);aspect-ratio:4/3.15;display:flex;flex-direction:column;justify-content:flex-end;padding:28px}
.card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.3,1)}
.card::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(4,18,47,.93) 8%,rgba(7,28,72,.18) 68%)}
.card:hover img{transform:scale(1.07)}
.card .meta{position:relative;z-index:2}
.card .tag{display:inline-block;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--orange);border:1px solid rgba(249,113,4,.5);border-radius:var(--r);padding:5px 13px;margin-bottom:14px}
.card h3{font-size:19px}
.card p{font-size:13px;color:rgba(255,255,255,.6);margin-top:7px}
.card.hide{display:none}

.clients{background:var(--mist);color:var(--ink);padding:clamp(72px,8vw,110px) 0}
.clients .chead{text-align:center;margin-bottom:52px}
.clients .cap{font-size:11.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--orange);margin-bottom:16px}
.clients .chead h2{color:var(--navy);font-size:clamp(26px,3.1vw,42px)}
.clients .chead p{color:rgba(51,51,51,.62);font-size:15.5px;margin-top:14px}
.logos{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}
.logo-cell{background:#fff;border:1px solid rgba(7,28,72,.09);border-radius:var(--rc);height:clamp(140px,13vw,180px);display:flex;align-items:center;justify-content:center;padding:clamp(18px,2vw,30px);transition:.38s cubic-bezier(.2,.7,.3,1)}
.logo-cell:hover{transform:translateY(-6px);border-color:rgba(249,113,4,.45);box-shadow:0 20px 44px -22px rgba(7,28,72,.4)}
.logo-cell img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;filter:grayscale(1);opacity:.68;transition:.38s}
.logo-cell:hover img{filter:none;opacity:1;transform:scale(1.05)}
.logo-cell.tall img{max-height:88%}

.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:56px}
.why-cell{background:var(--navy-2);border:1px solid var(--rule);border-radius:var(--rc);padding:38px 30px;transition:.4s cubic-bezier(.2,.7,.3,1);position:relative;overflow:hidden}
.why-cell:hover{transform:translateY(-6px);border-color:rgba(249,113,4,.55);box-shadow:0 26px 54px -26px rgba(0,0,0,.7)}
.why-cell .ic{width:54px;height:54px;border:1px solid rgba(249,113,4,.55);border-radius:14px;display:flex;align-items:center;justify-content:center;color:var(--orange);margin-bottom:24px;transition:.4s cubic-bezier(.2,.7,.3,1);background:rgba(249,113,4,.07)}
.why-cell .ic svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.why-cell:hover .ic{background:var(--orange);color:#fff;border-color:var(--orange);transform:translateY(-2px)}
.why-cell .idx{position:absolute;top:26px;right:28px;font-size:11px;font-weight:500;letter-spacing:.14em;color:rgba(249,113,4,.45);transition:.4s}
.why-cell:hover .idx{color:var(--orange)}
.why-cell h3{font-size:19px;margin-bottom:11px}
.why-cell p{font-size:14.5px;color:rgba(255,255,255,.62)}

.quote{background:var(--orange);color:#fff;padding:clamp(60px,6vw,90px) 0}
.quote .wrap{display:grid;grid-template-columns:auto 1fr;gap:52px;align-items:center}
.quote .mark{font-size:120px;line-height:.7;font-weight:600;opacity:.35}
.quote blockquote{font-size:clamp(19px,2vw,29px);font-weight:400;line-height:1.35;letter-spacing:-.01em;max-width:38ch}
.quote cite{display:block;margin-top:22px;font-style:normal;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;opacity:.85}

.roof-sec{position:relative;margin-top:calc(var(--roof) * -1);padding-top:calc(var(--roof) + clamp(50px,6vw,90px));padding-bottom:clamp(80px,9vw,130px);clip-path:polygon(0 var(--roof), 50% 0, 100% var(--roof), 100% 100%, 0 100%);overflow:hidden}
.roof-sec .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.roof-sec::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(170deg,rgba(7,28,72,.90) 0%,rgba(4,18,47,.96) 62%)}
.roof-sec .wrap{position:relative;z-index:3}
.ridge{position:absolute;top:0;left:0;width:100%;height:calc(var(--roof) + 60px);z-index:2;pointer-events:none}
.ridge svg{width:100%;height:100%;display:block}
.ridge .beam-1{fill:none;stroke:var(--orange);stroke-width:3;vector-effect:non-scaling-stroke}
.ridge .beam-2{fill:none;stroke:rgba(200,213,220,.34);stroke-width:1.5;vector-effect:non-scaling-stroke}
.ridge .beam-3{fill:none;stroke:rgba(249,113,4,.28);stroke-width:1.5;vector-effect:non-scaling-stroke}
.ridge .rafter{stroke:rgba(200,213,220,.16);stroke-width:1;vector-effect:non-scaling-stroke}
.peak-badge{position:absolute;top:calc(var(--roof) * .34);left:50%;transform:translateX(-50%);z-index:4;display:flex;align-items:center;gap:10px;font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--orange);white-space:nowrap}

.form-shell{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(40px,5vw,76px);align-items:start;margin-top:52px}
.form-copy h2{margin:20px 0 18px}
.form-copy .lede{margin-bottom:30px}
.trust{display:grid;gap:14px;list-style:none;margin-top:8px}
.trust li{display:flex;gap:13px;align-items:flex-start;font-size:14.5px;color:rgba(255,255,255,.74)}
.trust .tick{width:22px;height:22px;flex:0 0 22px;border-radius:50%;background:rgba(249,113,4,.16);border:1px solid rgba(249,113,4,.55);color:var(--orange);display:flex;align-items:center;justify-content:center;font-size:11px;margin-top:2px}
.contact-row{display:flex;gap:34px;flex-wrap:wrap;margin-top:38px;padding-top:26px;border-top:1px solid var(--rule)}
.contact-row .l{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.contact-row .v{font-size:17px;font-weight:500;margin-top:6px}
.contact-row a:hover{color:var(--orange)}

.intake{position:relative;border:1px solid var(--rule);border-radius:22px;padding:clamp(30px,3.2vw,46px);background:radial-gradient(120% 90% at 100% 0%, rgba(249,113,4,.14) 0%, rgba(249,113,4,0) 55%),rgba(255,255,255,.045);backdrop-filter:blur(10px);overflow:hidden;cursor:pointer;transition:.45s cubic-bezier(.2,.7,.3,1);width:100%;text-align:left;font-family:inherit;display:block;color:inherit}
.intake::before{content:"";position:absolute;inset:0;z-index:0;opacity:.5;background-image:linear-gradient(rgba(200,213,220,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(200,213,220,.08) 1px,transparent 1px);background-size:34px 34px;-webkit-mask-image:radial-gradient(85% 75% at 70% 25%,#000 0%,transparent 78%);mask-image:radial-gradient(85% 75% at 70% 25%,#000 0%,transparent 78%)}
.intake:hover{border-color:rgba(249,113,4,.6);transform:translateY(-5px);box-shadow:0 34px 70px -34px rgba(0,0,0,.85)}
.intake>*{position:relative;z-index:1}
.intake-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:30px}
.intake-kicker{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--orange);margin-bottom:12px}
.intake h3{font-size:clamp(22px,2.1vw,29px);line-height:1.15}
.intake .roofmark{flex:0 0 auto;width:46px;height:26px;overflow:visible;opacity:.9}
.intake .roofmark path{fill:none;stroke:var(--orange);stroke-width:2;stroke-linejoin:miter}
.intake .roofmark path.faint{stroke:rgba(200,213,220,.3)}
.steps{list-style:none;display:grid;gap:0;border-top:1px solid var(--rule);margin-bottom:30px}
.steps li{display:flex;align-items:center;gap:16px;padding:15px 0;border-bottom:1px solid var(--rule);font-size:14.5px;color:rgba(255,255,255,.72);transition:.35s}
.intake:hover .steps li{color:rgba(255,255,255,.94)}
.steps .n{flex:0 0 30px;height:30px;border-radius:50%;border:1px solid rgba(249,113,4,.45);color:var(--orange);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:500;transition:.35s}
.intake:hover .steps li:nth-child(1) .n{background:var(--orange);color:#fff;border-color:var(--orange)}
.steps .t{margin-left:auto;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.34)}
.intake-cta{display:flex;align-items:center;justify-content:space-between;gap:18px}
.intake-open{display:inline-flex;align-items:center;gap:11px;background:var(--orange);color:#fff;border-radius:var(--r);padding:16px 30px;font-size:13.5px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;transition:.3s}
.intake:hover .intake-open{background:var(--orange-2);box-shadow:0 14px 34px -12px rgba(249,113,4,.8)}
.intake-open .arw{transition:transform .3s}
.intake:hover .intake-open .arw{transform:translateX(5px)}
.intake-note{font-size:12.5px;color:rgba(255,255,255,.44);text-align:right;line-height:1.45}

.scrim{position:fixed;inset:0;background:rgba(4,18,47,.72);backdrop-filter:blur(6px);opacity:0;visibility:hidden;transition:.45s;z-index:900}
.scrim.on{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;height:100%;width:min(640px,100%);background:var(--navy-3);border-left:1px solid var(--rule);z-index:901;transform:translateX(100%);transition:transform .55s cubic-bezier(.22,.9,.28,1);display:flex;flex-direction:column;box-shadow:-40px 0 90px -30px rgba(0,0,0,.85)}
.drawer.on{transform:none}
.drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:26px 28px;border-bottom:1px solid var(--rule);flex:0 0 auto}
.drawer-head .k{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--orange);margin-bottom:9px}
.drawer-head h3{font-size:21px}
.drawer-head p{font-size:13px;color:rgba(255,255,255,.5);margin-top:7px}
.x{flex:0 0 auto;width:42px;height:42px;border-radius:50%;border:1px solid var(--rule);background:none;color:#fff;font-size:19px;cursor:pointer;transition:.3s;display:flex;align-items:center;justify-content:center;font-family:inherit;line-height:1}
.x:hover{background:var(--orange);border-color:var(--orange);transform:rotate(90deg)}
.drawer-body{flex:1;overflow-y:auto;background:#fff}
.drawer-body iframe{width:100%;min-height:1600px;border:0;display:block}
.drawer-loading{padding:70px 28px;text-align:center;color:rgba(7,28,72,.5);font-size:14px}
.spin{width:34px;height:34px;border:2px solid rgba(7,28,72,.14);border-top-color:var(--orange);border-radius:50%;margin:0 auto 18px;animation:sp .8s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}

.ucg-v2 footer{background:var(--navy-3);border-top:1px solid var(--rule);padding:70px 0 34px;font-size:14px;color:rgba(255,255,255,.6)}
.f-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:44px;padding-bottom:48px;border-bottom:1px solid var(--rule)}
.ucg-v2 footer .flogo{height:40px;margin-bottom:20px}
.ucg-v2 footer h4{font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:#fff;margin-bottom:18px;font-weight:500}
.ucg-v2 footer ul{list-style:none;display:grid;gap:11px}
.ucg-v2 footer a:hover{color:var(--orange)}
.f-tag{display:inline-block;margin-top:18px;font-size:11.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--orange)}
.f-bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;padding-top:26px;font-size:12.5px;color:rgba(255,255,255,.4)}

.rv{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.3,1),transform .8s cubic-bezier(.2,.7,.3,1)}
.rv.in{opacity:1;transform:none}

@media(max-width:1180px){.menu{gap:18px;font-size:11.5px}}
@media(max-width:1080px){
  .markets{grid-template-columns:repeat(2,1fr)}
  .svcs{grid-template-columns:repeat(2,1fr)}
  .grid{grid-template-columns:repeat(2,1fr)}
  .logos{grid-template-columns:repeat(3,1fr)}
  .why-grid{grid-template-columns:1fr 1fr}
  .panel.on{grid-template-columns:1fr;gap:36px}
  .form-shell{grid-template-columns:1fr;gap:44px}
  .f-grid{grid-template-columns:1fr 1fr}
  .menu,.ucg-v2 nav .btn{display:none}
  .burger{display:flex}
  .mobile{display:block}
}
@media(max-width:760px){
  .wrap{padding:0 20px}
  .topbar .lic{display:none}
  .hero .wrap{padding-top:150px}
  .hero-strip{grid-template-columns:1fr 1fr}
  .hero-strip>div{border-bottom:1px solid var(--rule)}
  .hero-strip>div:nth-child(2){border-right:0}
  .sec-head{grid-template-columns:1fr;gap:24px}
  .markets{grid-template-columns:1fr}
  .mkt{min-height:340px}
  .mkt ul{max-height:190px;margin-top:4px}
  .svcs{grid-template-columns:1fr}
  .grid{grid-template-columns:1fr}
  .why-grid{grid-template-columns:1fr}
  .quote .wrap{grid-template-columns:1fr;gap:0}
  .quote .mark{font-size:76px}
  .f-grid{grid-template-columns:1fr}
  .peak-badge{font-size:9px;letter-spacing:.2em}
  .drawer{width:100%}
  .intake-cta{flex-direction:column;align-items:stretch;gap:14px}
  .intake-note{text-align:left}
}
@media(max-width:560px){.logos{grid-template-columns:repeat(2,1fr)}}

/* =========================================================
   COLOUR GUARD  —  scoped to .ucg-v2 only, no body class,
   no JS dependency. Astra sets global heading colours that
   outrank plain element selectors, so these are forced.
   ========================================================= */
.ucg-v2 h1,.ucg-v2 h2,.ucg-v2 h3,.ucg-v2 h4,.ucg-v2 h5,.ucg-v2 h6,
.ucg-v2 blockquote,.ucg-v2 cite{color:#fff !important}
.ucg-v2 p,.ucg-v2 li,.ucg-v2 span,.ucg-v2 a{color:inherit}
.ucg-v2{color:#fff}

/* orange accents */
.ucg-v2 .eyebrow,
.ucg-v2 .mkt .num,.ucg-v2 .mkt .go,
.ucg-v2 .svc .lk,.ucg-v2 .card .tag,
.ucg-v2 .clients .cap,.ucg-v2 .peak-badge,
.ucg-v2 .intake-kicker,.ucg-v2 .steps .n,
.ucg-v2 .trust .tick,.ucg-v2 .drawer-head .k,
.ucg-v2 .f-tag,.ucg-v2 .why-cell .ic{color:var(--orange) !important}
.ucg-v2 .hero h1 em{color:var(--orange) !important}
.ucg-v2 .why-cell .idx{color:rgba(249,113,4,.55) !important}
.ucg-v2 .panel ol li::before,.ucg-v2 .mkt ul li::before{color:var(--orange)}

/* muted copy on dark */
.ucg-v2 .lede{color:rgba(255,255,255,.74) !important}
.ucg-v2 .hero-strip .l{color:rgba(255,255,255,.56)}
.ucg-v2 .mkt ul{color:rgba(255,255,255,.86)}
.ucg-v2 .panel p{color:rgba(255,255,255,.68) !important}
.ucg-v2 .panel ol li{color:rgba(255,255,255,.78)}
.ucg-v2 .card p{color:rgba(255,255,255,.6) !important}
.ucg-v2 .why-cell p{color:rgba(255,255,255,.62) !important}
.ucg-v2 .trust li{color:rgba(255,255,255,.74)}
.ucg-v2 .steps li{color:rgba(255,255,255,.86)}
.ucg-v2 .steps .t{color:rgba(255,255,255,.4)}
.ucg-v2 .intake-note{color:rgba(255,255,255,.5)}
.ucg-v2 .contact-row .l{color:rgba(255,255,255,.5)}
.ucg-v2 .drawer-head p{color:rgba(255,255,255,.5) !important}
.ucg-v2 .chip,.ucg-v2 .tab{color:rgba(255,255,255,.7)}
.ucg-v2 .chip.on,.ucg-v2 .tab.on{color:#fff}
.ucg-v2 footer{color:rgba(255,255,255,.6)}
.ucg-v2 .f-bot{color:rgba(255,255,255,.45)}
.ucg-v2 .topbar{color:rgba(255,255,255,.62)}

/* LIGHT sections keep navy text */
.ucg-v2 .svc-sec h2,.ucg-v2 .svc h3,
.ucg-v2 .clients .chead h2{color:var(--navy) !important}
.ucg-v2 .svc-sec .lede{color:rgba(51,51,51,.72) !important}
.ucg-v2 .svc p{color:rgba(51,51,51,.7) !important}
.ucg-v2 .clients .chead p{color:rgba(51,51,51,.62) !important}
.ucg-v2 .drawer-loading{color:rgba(7,28,72,.5) !important}

/* footer logo was rendering full-size */
.ucg-v2 footer .flogo{height:40px !important;width:auto !important;max-width:230px}

/* reveal animation only runs once JS is alive — otherwise content
   would stay invisible when scripts are delayed or blocked */
.ucg-v2 .rv{opacity:1;transform:none}
.ucg-v2.anim .rv{opacity:0;transform:translateY(28px)}
.ucg-v2.anim .rv.in{opacity:1;transform:none}

/* hover effects only where hovering actually exists — on touch they
   were sticking on after a tap */
@media (hover:none){
  .ucg-v2 .mkt:hover img{transform:none;filter:grayscale(.5)}
  .ucg-v2 .mkt:hover::before{background:linear-gradient(to top,rgba(4,18,47,.95) 12%,rgba(7,28,72,.55) 55%,rgba(7,28,72,.32) 100%)}
  .ucg-v2 .mkt:hover .num,.ucg-v2 .mkt:hover .go{color:var(--orange) !important}
  .ucg-v2 .mkt:hover ul li::before{color:var(--orange)}
  .ucg-v2 .svc:hover,.ucg-v2 .why-cell:hover,.ucg-v2 .logo-cell:hover,.ucg-v2 .intake:hover{transform:none;box-shadow:none}
  .ucg-v2 .logo-cell:hover img{transform:none}
}

/* nav CTA */
.ucg-v2 nav .btn-sm{padding:9px 18px;font-size:11px;letter-spacing:.08em;gap:7px;flex:0 0 auto;white-space:nowrap}
.ucg-v2 nav .wrap{gap:18px}
@media(max-width:1320px){
  .ucg-v2 .menu{gap:16px;font-size:11px}
  .ucg-v2 nav .btn-sm{padding:8px 15px;font-size:10.5px}
}

/* =========================================================
   MOBILE
   ========================================================= */
@media(max-width:1080px){
  /* the top utility bar was wrapping onto two lines and colliding */
  .ucg-v2 .topbar{display:none}
  .ucg-v2 nav .wrap{height:66px}
  .ucg-v2 nav .logo img{height:32px}
  .ucg-v2 .hero .wrap{padding-top:110px}

  /* market cards: lists always open, no hover needed */
  .ucg-v2 .mkt ul{max-height:none;margin-top:6px;color:rgba(255,255,255,.86)}
  .ucg-v2 .mkt{min-height:auto;padding:30px 24px 26px}
  .ucg-v2 .mkt img{filter:grayscale(.35)}
  .ucg-v2 .mkt::before{background:linear-gradient(to top,rgba(4,18,47,.96) 30%,rgba(7,28,72,.72) 70%,rgba(7,28,72,.5) 100%)}
  .ucg-v2 .mkt .num{margin-bottom:120px}
}

@media(max-width:760px){
  .ucg-v2 h1{font-size:clamp(34px,10vw,52px)}
  .ucg-v2 h2{font-size:clamp(27px,7.4vw,40px)}
  .ucg-v2 .hero{min-height:auto;padding-bottom:54px}
  .ucg-v2 .hero .wrap{padding-top:100px}
  .ucg-v2 .hero h1{margin:20px 0 18px;max-width:none}
  .ucg-v2 .hero-cta .btn{flex:1 1 100%;justify-content:center}
  .ucg-v2 .hero-strip{margin-top:44px}
  .ucg-v2 .hero-strip>div{padding:20px 16px 22px}
  .ucg-v2 .tagline{letter-spacing:.26em;gap:12px}
  .ucg-v2 .tagline .rule{max-width:60px}

  .ucg-v2 .pad{padding:64px 0}
  .ucg-v2 .sec-head{margin-bottom:38px}
  .ucg-v2 .mkt .num{margin-bottom:90px}

  /* horizontal scrollers instead of cramped wrapping */
  .ucg-v2 .tabs,.ucg-v2 .filters{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .ucg-v2 .tabs::-webkit-scrollbar,.ucg-v2 .filters::-webkit-scrollbar{display:none}
  .ucg-v2 .tab,.ucg-v2 .chip{white-space:nowrap;flex:0 0 auto}

  .ucg-v2 .panel.on{gap:28px}
  .ucg-v2 .why-cell{padding:30px 24px}
  .ucg-v2 .why-cell .idx{top:20px;right:22px}

  .ucg-v2 .clients{padding:64px 0}
  .ucg-v2 .logo-cell{height:118px;padding:18px}

  .ucg-v2 .quote .wrap{gap:10px}
  .ucg-v2 .roof-sec{padding-bottom:64px}
  .ucg-v2 .form-shell{margin-top:34px}
  .ucg-v2 .contact-row{gap:24px}
  .ucg-v2 .intake{padding:26px 22px}
  .ucg-v2 .intake-open{justify-content:center;width:100%}

  .ucg-v2 footer{padding:52px 0 28px}
  .ucg-v2 .f-grid{gap:34px;padding-bottom:34px}
  .ucg-v2 .f-bot{flex-direction:column;gap:10px}

  /* mobile drawer menu spacing */
  .ucg-v2 .mobile ul{padding:10px 20px 26px}
  .ucg-v2 .mobile li .btn{width:100%;justify-content:center;margin-top:6px}
}

/* never allow a stray element to widen the page */
.ucg-v2{overflow-x:clip}
/* =========================================================
   STICKY HEADER — the utility bar collapses on scroll-down
   and slides back in on scroll-up. The nav stays pinned.
   ========================================================= */
.ucg-v2 header{transform:none !important}
.ucg-v2 .topbar{height:40px;overflow:hidden;transition:height .38s cubic-bezier(.2,.7,.3,1),opacity .28s ease,border-color .38s}
.ucg-v2 .topbar .wrap{height:40px}
/* topbar collapse removed — utility bar stays visible at all times */
/* nav tightens slightly once stuck, so it reads as a compact bar */
.ucg-v2 nav{transition:background .35s,box-shadow .35s,height .35s}
.ucg-v2 header.compact nav{background:rgba(4,18,47,.94);box-shadow:0 10px 30px -18px rgba(0,0,0,.9)}

@media(max-width:1080px){

}
/* =========================================================
   UTILITY BAR ALWAYS ON
   The whole header stays pinned and the utility bar never
   collapses — phone and email remain reachable at any scroll
   depth. Only the subtle darkening of the nav is kept.
   ========================================================= */
.ucg-v2 header.compact .topbar{height:40px;opacity:1;border-bottom-color:var(--rule)}
.ucg-v2 header.compact nav .wrap{height:80px}
@media(max-width:1080px){
  .ucg-v2 header.compact nav .wrap{height:66px}
}
/* =========================================================
   MOBILE UTILITY BAR
   Brought back on small screens. The long credential line is
   dropped (it was wrapping to two lines and colliding with the
   phone number) leaving a single centred contact strip.
   ========================================================= */
@media(max-width:1080px){
  .ucg-v2 .topbar{display:block;height:36px}
  .ucg-v2 .topbar .wrap{height:36px;justify-content:center;gap:18px;padding:0 16px}
  .ucg-v2 .topbar .lic{display:none}
  .ucg-v2 .topbar .soc{gap:16px;font-size:12px;white-space:nowrap}
  .ucg-v2 header.compact .topbar{height:36px}
  /* header is now 36 + 66 = 102px tall, so the hero clears it */
  .ucg-v2 .hero .wrap{padding-top:146px}
}
@media(max-width:760px){
  .ucg-v2 .topbar .wrap{gap:14px;padding:0 14px}
  .ucg-v2 .topbar .soc{gap:14px;font-size:11.5px}
  .ucg-v2 .hero .wrap{padding-top:138px}
}
@media(max-width:400px){
  .ucg-v2 .topbar .soc{font-size:10.5px;gap:11px}
}
/* =========================================================
   UTILITY BAR TYPE SIZE
   The size was being set on the .soc wrapper only, so the
   <a> links inside kept inheriting the theme's link sizing
   and rendered far larger than intended. Sized on the links
   themselves so nothing can override them.
   ========================================================= */
.ucg-v2 .topbar,
.ucg-v2 .topbar .soc,
.ucg-v2 .topbar .soc a,
.ucg-v2 .topbar .lic{font-size:12.5px !important;line-height:1.2 !important}
.ucg-v2 .topbar .lic{font-size:11px !important}
.ucg-v2 .topbar .soc a{letter-spacing:.01em;font-weight:400}

@media(max-width:1080px){
  .ucg-v2 .topbar,
  .ucg-v2 .topbar .soc,
  .ucg-v2 .topbar .soc a{font-size:12px !important}
}
@media(max-width:760px){
  .ucg-v2 .topbar,
  .ucg-v2 .topbar .soc,
  .ucg-v2 .topbar .soc a{font-size:11.5px !important}
  .ucg-v2 .topbar .soc{gap:14px}
}
@media(max-width:420px){
  .ucg-v2 .topbar,
  .ucg-v2 .topbar .soc,
  .ucg-v2 .topbar .soc a{font-size:10.5px !important}
  .ucg-v2 .topbar .soc{gap:10px}
  .ucg-v2 .topbar .wrap{padding:0 12px}
}
/* =========================================================
   CLIENT LOGO MARQUEE
   Continuous right-to-left belt. The row is duplicated in the
   markup and the track travels exactly -50%, so the seam lands
   on an identical frame and the loop is invisible.
   ========================================================= */
.ucg-v2 .logos-marquee{position:relative;overflow:hidden;width:100%;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 6%,#000 94%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0,#000 6%,#000 94%,transparent 100%)}
.ucg-v2 .logo-track{display:flex;flex-wrap:nowrap;width:max-content;gap:22px;
  animation:ucgLogoBelt 46s linear infinite;will-change:transform}
.ucg-v2 .logos-marquee:hover .logo-track{animation-play-state:paused}
@keyframes ucgLogoBelt{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 11px))}}
.ucg-v2 .logo-track .logo-cell{flex:0 0 auto;width:220px;height:150px;margin:0}
@media(max-width:760px){
  .ucg-v2 .logo-track{gap:16px;animation-duration:34s}
  @keyframes ucgLogoBelt{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 8px))}}
  .ucg-v2 .logo-track .logo-cell{width:158px;height:112px;padding:16px}
}
@media(prefers-reduced-motion:reduce){
  .ucg-v2 .logo-track{animation:none}
  .ucg-v2 .logos-marquee{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
}
/* =========================================================
   MARQUEE FULL BLEED + LARGER LOGOS
   The belt sat inside the 1280px content wrapper, so it began
   and ended with the text column. It now breaks out to the
   full viewport width and the edge fade is removed, so logos
   run right off both sides.
   ========================================================= */
.ucg-v2 .logos-marquee{
  width:100vw;
  margin-left:calc(50% - 50vw);
  -webkit-mask-image:none;
  mask-image:none;
}
.ucg-v2 .logo-track{gap:24px;padding:0}
@keyframes ucgLogoBelt{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 12px))}}
.ucg-v2 .logo-track .logo-cell{width:268px;height:178px;padding:20px}
.ucg-v2 .logo-track .logo-cell img{max-width:100%;max-height:100%}
.ucg-v2 .logo-track .logo-cell.tall img{max-height:96%}

@media(max-width:1080px){
  .ucg-v2 .logo-track{gap:20px}
  @keyframes ucgLogoBelt{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 10px))}}
  .ucg-v2 .logo-track .logo-cell{width:230px;height:156px;padding:18px}
}
@media(max-width:760px){
  .ucg-v2 .logo-track{gap:14px;animation-duration:32s}
  @keyframes ucgLogoBelt{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 7px))}}
  .ucg-v2 .logo-track .logo-cell{width:180px;height:124px;padding:15px}
}
/* =========================================================
   CLIENTS SECTION SPACING
   Tighter band — the logo belt reads as a proof strip rather
   than a full section, so it needs less air than the others.
   ========================================================= */
.ucg-v2 .clients{padding:clamp(42px,4.4vw,62px) 0}
.ucg-v2 .clients .chead{margin-bottom:clamp(26px,2.6vw,34px)}
.ucg-v2 .clients .chead p{margin-top:10px}
@media(max-width:760px){
  .ucg-v2 .clients{padding:38px 0}
  .ucg-v2 .clients .chead{margin-bottom:24px}
}
/* =========================================================
   REVEAL FAIL-SAFE
   The scroll animation is decoration only. If scripting is
   delayed, blocked, or the page is captured/printed before the
   observer runs, everything must still be visible.
   ========================================================= */
.ucg-v2 .rv{opacity:1 !important;transform:none !important}
.ucg-v2.anim .rv{opacity:0 !important;transform:translateY(24px) !important}
.ucg-v2.anim .rv.in{opacity:1 !important;transform:none !important}
@media print{ .ucg-v2 .rv,.ucg-v2.anim .rv{opacity:1 !important;transform:none !important} }
@media(prefers-reduced-motion:reduce){
  .ucg-v2 .rv,.ucg-v2.anim .rv{opacity:1 !important;transform:none !important;transition:none}
}

/* ---- footer tidy ---- */
.ucg-v2 footer{padding:56px 0 28px}
.ucg-v2 footer .flogo{height:36px !important;max-width:200px;margin-bottom:16px}
.ucg-v2 footer p{font-size:14px;line-height:1.6}
.ucg-v2 .f-grid{grid-template-columns:1.7fr 1fr 1fr 1fr;gap:40px;padding-bottom:36px;align-items:start}
.ucg-v2 .f-tag{margin-top:14px;font-size:11px}
.ucg-v2 footer ul{gap:9px}
.ucg-v2 footer li{font-size:14px}
@media(max-width:1080px){ .ucg-v2 .f-grid{grid-template-columns:1fr 1fr;gap:32px} }
@media(max-width:760px){ .ucg-v2 .f-grid{grid-template-columns:1fr;gap:28px} }
/* =========================================================
   AMENITY ICON HOVER
   The colour guard forced the icon orange with !important,
   which also won on :hover — so the tile filled orange and the
   icon disappeared into it. Hover now flips the glyph to white.
   ========================================================= */
.ucg-v2 .why-cell:hover .ic{color:#fff !important;background:var(--orange);border-color:var(--orange)}
.ucg-v2 .why-cell:hover .ic svg{stroke:#fff !important}
.ucg-v2 .why-cell .ic svg{stroke:currentColor}
/* (touch override removed — it was cancelling the white-on-orange hover) */
/* =========================================================
   ICON HOVER FINAL
   Orange tile, white glyph. Declared last and unconditionally
   so no media query or earlier !important can undo it.
   ========================================================= */
.ucg-v2 .why-cell:hover .ic,
.ucg-v2 .why-cell:focus-within .ic{
  color:#fff !important;
  background:var(--orange) !important;
  border-color:var(--orange) !important;
}
.ucg-v2 .why-cell:hover .ic svg,
.ucg-v2 .why-cell:focus-within .ic svg{stroke:#fff !important}
/* =========================================================
   ORANGE BALANCE
   The page was running heavily navy. Orange is added at
   structural points — numbers, tags, edges, buttons — rather
   than as broad fills, so it reads as accent, not decoration.
   ========================================================= */

/* 1. hero stat figures */
.ucg-v2 .hero-strip .k{color:var(--orange) !important}
.ucg-v2 .hero-strip>div{position:relative}
.ucg-v2 .hero-strip>div::before{content:"";position:absolute;top:-1px;left:0;width:34px;height:2px;background:var(--orange)}

/* 2. market card numbers become filled chips */
.ucg-v2 .mkt .num{display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;background:var(--orange);color:#fff !important;
  font-weight:600;letter-spacing:.02em;font-size:12px}
.ucg-v2 .mkt:hover .num{background:#fff;color:var(--orange) !important}

/* 3. project tags: filled instead of outlined */
.ucg-v2 .card .tag{background:var(--orange);border-color:var(--orange);color:#fff !important;font-weight:500}

/* 4. portfolio button becomes primary */
.ucg-v2 #projects .btn-ghost{background:var(--orange);border-color:var(--orange);color:#fff !important}
.ucg-v2 #projects .btn-ghost:hover{background:var(--orange-2);border-color:var(--orange-2);color:#fff !important;
  box-shadow:0 14px 34px -12px rgba(249,113,4,.75)}

/* 5. orange corner bracket on the delivery images (from the original concept) */
.ucg-v2 .panel figure{position:relative}
.ucg-v2 .panel figure::after{content:"";position:absolute;left:-14px;bottom:-14px;
  width:104px;height:104px;border-left:3px solid var(--orange);border-bottom:3px solid var(--orange);
  border-bottom-left-radius:4px;pointer-events:none}

/* 6. amenity cards get an orange top edge that widens on hover */
.ucg-v2 .why-cell::before{content:"";position:absolute;top:0;left:0;width:56px;height:3px;
  background:var(--orange);transition:width .45s cubic-bezier(.2,.7,.3,1)}
.ucg-v2 .why-cell:hover::before{width:100%}

/* 7. service cards (light section) get the same top edge */
.ucg-v2 .svc{position:relative}
.ucg-v2 .svc::before{content:"";position:absolute;top:0;left:0;width:0;height:4px;
  background:var(--orange);z-index:3;transition:width .45s cubic-bezier(.2,.7,.3,1)}
.ucg-v2 .svc:hover::before{width:100%}

/* 8. warm glow so the darkest bands aren't flat navy */
.ucg-v2 .delivery::before,
.ucg-v2 #why::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(70% 55% at 88% 8%, rgba(249,113,4,.13) 0%, rgba(249,113,4,0) 60%)}
.ucg-v2 .delivery>*,.ucg-v2 #why>*{position:relative;z-index:1}

/* 9. footer: orange column headings + a rule across the top */
.ucg-v2 footer{border-top:3px solid var(--orange)}
.ucg-v2 footer h4{color:var(--orange) !important}

/* 10. section eyebrow rule a touch stronger */
.ucg-v2 .eyebrow::before{width:44px;height:2px}

/* 11. filter chips + tabs read warmer at rest */
.ucg-v2 .chip{border-color:rgba(249,113,4,.32)}
.ucg-v2 .tab{border-color:rgba(249,113,4,.32)}

/* 12. intake card edge */
.ucg-v2 .intake{border-color:rgba(249,113,4,.4)}
/* =========================================================
   ORANGE DOMINANT
   Two full sections flip to orange surfaces so the brand
   colour leads the page instead of trimming it. The testimonial
   moves to deep navy so it doesn't merge with the amenity band.
   ========================================================= */

/* ---------- 1. MARKETS on orange ---------- */
.ucg-v2 #markets{background:var(--orange)}
.ucg-v2 #markets::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(80% 60% at 12% 0%, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 62%)}
.ucg-v2 #markets>*{position:relative;z-index:1}
.ucg-v2 #markets .eyebrow{color:#fff !important}
.ucg-v2 #markets .eyebrow::before{background:#fff}
.ucg-v2 #markets h2{color:#fff !important}
.ucg-v2 #markets .lede{color:rgba(255,255,255,.92) !important}
/* cards read as deep navy panels sitting on the orange */
.ucg-v2 #markets .mkt::before{background:linear-gradient(to top,rgba(4,18,47,.97) 14%,rgba(7,28,72,.72) 58%,rgba(7,28,72,.46) 100%)}
.ucg-v2 #markets .mkt:hover::before{background:linear-gradient(to top,rgba(4,18,47,.99) 6%,rgba(7,28,72,.86) 62%,rgba(7,28,72,.5) 100%)}
.ucg-v2 #markets .mkt .num{background:#fff;color:var(--orange) !important}
.ucg-v2 #markets .mkt:hover .num{background:var(--orange);color:#fff !important}
.ucg-v2 #markets .mkt .go{color:var(--orange) !important}
.ucg-v2 #markets .mkt:hover .go{color:#fff !important}
.ucg-v2 #markets .mkt ul li::before{color:var(--orange) !important}

/* ---------- 2. AMENITIES on orange ---------- */
.ucg-v2 #why{background:var(--orange)}
.ucg-v2 #why::before{background:radial-gradient(75% 60% at 88% 4%, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 60%)}
.ucg-v2 #why .eyebrow{color:#fff !important}
.ucg-v2 #why .eyebrow::before{background:#fff}
.ucg-v2 #why h2{color:#fff !important}
.ucg-v2 #why .lede{color:rgba(255,255,255,.92) !important}
.ucg-v2 .why-cell{background:var(--navy);border-color:rgba(4,18,47,.35)}
.ucg-v2 .why-cell:hover{background:var(--navy-3);border-color:rgba(4,18,47,.6);
  box-shadow:0 26px 54px -22px rgba(60,26,0,.55)}
.ucg-v2 .why-cell::before{background:#fff}
.ucg-v2 .why-cell .idx{color:rgba(255,255,255,.45) !important}
.ucg-v2 .why-cell:hover .idx{color:#fff !important}
.ucg-v2 .why-cell .ic{border-color:rgba(249,113,4,.75);background:rgba(249,113,4,.14)}
.ucg-v2 .why-cell p{color:rgba(255,255,255,.7) !important}

/* ---------- 3. TESTIMONIAL moves to deep navy ---------- */
.ucg-v2 .quote{background:var(--navy-3) !important;position:relative;overflow:hidden}
.ucg-v2 .quote::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(60% 90% at 6% 50%, rgba(249,113,4,.20) 0%, rgba(249,113,4,0) 65%)}
.ucg-v2 .quote .wrap{position:relative;z-index:1}
.ucg-v2 .quote .mark{color:var(--orange) !important;opacity:1}
.ucg-v2 .quote blockquote{color:#fff !important}
.ucg-v2 .quote cite{color:var(--orange) !important;opacity:1}

/* ---------- 4. warmer hero + contact bands ---------- */
.ucg-v2 .hero::after{background:
  linear-gradient(105deg,rgba(4,18,47,.93) 0%,rgba(7,28,72,.76) 40%,rgba(249,113,4,.16) 100%),
  linear-gradient(to top,rgba(4,18,47,.96) 0%,transparent 55%)}
.ucg-v2 .roof-sec::after{background:
  linear-gradient(170deg,rgba(7,28,72,.88) 0%,rgba(4,18,47,.95) 58%),
  radial-gradient(55% 45% at 88% 92%, rgba(249,113,4,.22) 0%, rgba(249,113,4,0) 70%)}

/* ---------- 5. projects band gets a warm floor ---------- */
.ucg-v2 #projects{background:linear-gradient(180deg,var(--navy) 0%,var(--navy) 72%,#0a2352 100%)}
.ucg-v2 #projects::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--orange)}

/* ---------- 6. services band: orange header rule ---------- */
.ucg-v2 .svc-sec{border-top:4px solid var(--orange);border-bottom:4px solid var(--orange)}
.ucg-v2 .clients{border-bottom:4px solid var(--orange)}
/* =========================================================
   ORANGE DIAL-BACK
   Two full orange sections was too much — large fields of it
   stop reading as an accent. Markets and Amenities return to
   navy; the testimonial goes back to being the single orange
   band. Everything keeps the stronger accent layer: orange
   figures, chips, tags, edges, brackets and buttons.
   ========================================================= */

/* ---- MARKETS back to navy ---- */
.ucg-v2 #markets{background:transparent}
.ucg-v2 #markets::before{background:radial-gradient(70% 55% at 90% 4%, rgba(249,113,4,.14) 0%, rgba(249,113,4,0) 62%)}
.ucg-v2 #markets .eyebrow{color:var(--orange) !important}
.ucg-v2 #markets .eyebrow::before{background:var(--orange)}
.ucg-v2 #markets .lede{color:rgba(255,255,255,.74) !important}
.ucg-v2 #markets .mkt::before{background:linear-gradient(to top,rgba(4,18,47,.95) 12%,rgba(7,28,72,.55) 55%,rgba(7,28,72,.32) 100%)}
.ucg-v2 #markets .mkt:hover::before{background:linear-gradient(to top,rgba(249,113,4,.92) 0%,rgba(7,28,72,.72) 62%,rgba(7,28,72,.32) 100%)}
.ucg-v2 #markets .mkt .num{background:var(--orange);color:#fff !important}
.ucg-v2 #markets .mkt:hover .num{background:#fff;color:var(--orange) !important}

/* ---- AMENITIES back to navy ---- */
.ucg-v2 #why{background:transparent}
.ucg-v2 #why::before{background:radial-gradient(70% 55% at 88% 8%, rgba(249,113,4,.13) 0%, rgba(249,113,4,0) 60%)}
.ucg-v2 #why .eyebrow{color:var(--orange) !important}
.ucg-v2 #why .eyebrow::before{background:var(--orange)}
.ucg-v2 #why .lede{color:rgba(255,255,255,.74) !important}
.ucg-v2 .why-cell{background:var(--navy-2);border-color:var(--rule)}
.ucg-v2 .why-cell:hover{background:var(--navy-2);border-color:rgba(249,113,4,.55);
  box-shadow:0 26px 54px -26px rgba(0,0,0,.7)}
.ucg-v2 .why-cell::before{background:var(--orange)}
.ucg-v2 .why-cell .idx{color:rgba(249,113,4,.5) !important}
.ucg-v2 .why-cell:hover .idx{color:var(--orange) !important}

/* ---- TESTIMONIAL is the one orange band again ---- */
.ucg-v2 .quote{background:var(--orange) !important}
.ucg-v2 .quote::before{background:radial-gradient(60% 90% at 6% 50%, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 65%)}
.ucg-v2 .quote .mark{color:#fff !important;opacity:.4}
.ucg-v2 .quote blockquote{color:#fff !important}
.ucg-v2 .quote cite{color:#fff !important;opacity:.88}

/* ---- softer warm light in the hero ---- */
.ucg-v2 .hero::after{background:
  linear-gradient(105deg,rgba(4,18,47,.94) 0%,rgba(7,28,72,.80) 44%,rgba(249,113,4,.10) 100%),
  linear-gradient(to top,rgba(4,18,47,.96) 0%,transparent 55%)}

/* ---- trim the heavy section borders back to hairlines ---- */
.ucg-v2 .svc-sec{border-top:2px solid var(--orange);border-bottom:2px solid var(--orange)}
.ucg-v2 .clients{border-bottom:2px solid var(--orange)}
.ucg-v2 #projects::after{height:3px}
/* =========================================================
   WARM TIER  —  40 / 60
   The light bands used #F9FAFD, a cold blue-grey that reads as
   navy family. Swapping them to a warm cream moves ~21% of the
   page into the orange family with zero added saturation, and a
   full-orange CTA strip carries the rest.
   ========================================================= */
:root{ --cream:#FDF4EC; --cream-line:rgba(180,110,50,.16); }

/* ---- light sections become warm ---- */
.ucg-v2 .svc-sec,
.ucg-v2 .clients{background:var(--cream) !important}
.ucg-v2 .svc-sec{border-top:2px solid var(--orange);border-bottom:2px solid var(--orange)}
.ucg-v2 .clients{border-bottom:2px solid var(--orange)}
.ucg-v2 .svc{border-color:var(--cream-line)}
.ucg-v2 .svc:hover{border-color:rgba(249,113,4,.45);box-shadow:0 26px 54px -24px rgba(120,60,10,.34)}
.ucg-v2 .logo-cell{border-color:var(--cream-line)}
.ucg-v2 .logo-cell:hover{box-shadow:0 20px 44px -22px rgba(120,60,10,.34)}
.ucg-v2 .svc-sec .lede{color:rgba(70,45,25,.74) !important}
.ucg-v2 .svc p{color:rgba(70,45,25,.72) !important}
.ucg-v2 .clients .chead p{color:rgba(70,45,25,.66) !important}

/* ---- full-orange CTA strip ---- */
.ucg-v2 .cta-strip{background:var(--orange);position:relative;overflow:hidden;
  padding:clamp(44px,4.6vw,64px) 0}
.ucg-v2 .cta-strip::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 120% at 88% 20%, rgba(255,255,255,.18) 0%, rgba(255,255,255,0) 62%)}
.ucg-v2 .cta-strip .wrap{position:relative;z-index:1}
.ucg-v2 .cta-strip-in{display:flex;align-items:center;justify-content:space-between;gap:36px;flex-wrap:wrap}
.ucg-v2 .cta-kicker{font-size:11px;letter-spacing:.26em;text-transform:uppercase;
  color:rgba(255,255,255,.82);margin-bottom:12px}
.ucg-v2 .cta-strip h2{color:#fff !important;font-size:clamp(26px,3.1vw,42px);max-width:18ch}
.ucg-v2 .cta-actions{display:flex;gap:14px;flex-wrap:wrap}
.ucg-v2 .btn-oncolor{background:#fff;color:var(--orange) !important;border-color:#fff}
.ucg-v2 .btn-oncolor:hover{background:var(--navy);color:#fff !important;border-color:var(--navy);
  transform:translateY(-2px);box-shadow:0 14px 34px -12px rgba(4,18,47,.6)}
.ucg-v2 .btn-oncolor-ghost{background:transparent;color:#fff !important;border-color:rgba(255,255,255,.6)}
.ucg-v2 .btn-oncolor-ghost:hover{background:rgba(255,255,255,.14);border-color:#fff;transform:translateY(-2px)}
@media(max-width:760px){
  .ucg-v2 .cta-strip-in{flex-direction:column;align-items:flex-start;gap:26px}
  .ucg-v2 .cta-actions{width:100%}
  .ucg-v2 .cta-actions .btn{flex:1 1 100%;justify-content:center}
}
/* =========================================================
   LIVE HOMEPAGE
   The theme header is sticky and sits in the document flow, so
   the hero no longer needs to clear a fixed bar.
   ========================================================= */
.ucg-v2 .hero{min-height:calc(100vh - 120px)}
.ucg-v2 .hero .wrap{padding-top:96px}
@media(max-width:1080px){ .ucg-v2 .hero .wrap{padding-top:78px} }
@media(max-width:760px){ .ucg-v2 .hero{min-height:auto} .ucg-v2 .hero .wrap{padding-top:64px} }