:root{
  --navy:#060d2c;
  --orange:#f89404;
  --orange-soft:#f6a842;
  --ink:#1d2236;
  --muted:#5a6075;
  --light:#f4f6fa;
  --cut:28px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"DM Sans",system-ui,sans-serif;color:var(--ink);background:#fff;line-height:1.6;font-size:17px}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{line-height:1.15;margin:0 0 .5em}
em{font-style:normal;color:var(--orange-soft)}
.wrap{width:min(1140px,100% - 32px);margin-inline:auto}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:16px;background:#fff;padding:8px 12px;z-index:9}

/* signature angled corners */
.cut{clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut))}

.btn{display:inline-block;background:var(--orange);color:#fff;font-weight:800;text-transform:uppercase;letter-spacing:.02em;text-decoration:none;padding:18px 32px;border:0;cursor:pointer;font:inherit;font-weight:800;
  clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px);transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-2px);background:#e88700}
.btn-light{background:#f5f9fc;color:var(--orange)}
.btn-light:hover{background:#fff}

/* hero */
.hero{color:#fff;padding-top:90px!important;background:linear-gradient(rgba(6,13,44,.55),rgba(6,13,44,.75)),url(hero.webp) center/cover no-repeat;padding:28px 0 110px}
.hero-inner{display:flex;flex-direction:column;align-items:flex-start}
.lede{font-size:1.2rem;max-width:620px;margin:0 0 28px;opacity:.92}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap}
.hero-review{margin:36px 0 0;font-weight:500;max-width:560px;border-left:3px solid var(--orange);padding-left:14px}
.hero-review span{display:block;font-size:.85rem;color:var(--orange-soft);margin-top:2px}

/* top bar */
.topbar{position:sticky;top:0;z-index:20;background:var(--navy);border-bottom:1px solid rgba(255,255,255,.08)}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0}
.topbar .logo img{width:120px}
.top-actions{display:flex;align-items:center;gap:24px}
.top-actions a{color:#fff;text-decoration:none;font-weight:500}
.top-phone{font-size:1.3rem;font-weight:800!important}
.top-mail{opacity:.85}
.btn-sm{padding:12px 20px;font-size:.9rem}
.top-actions .btn{color:#fff}
.hero-contact{list-style:none;padding:0;margin:40px 0 70px;display:grid;gap:18px}
.hero-contact span{color:var(--orange-soft);font-weight:500;margin-right:20px}
.hero-contact a{text-decoration:none;font-size:1.3rem}
.hero-contact a.big{font-size:1.9rem}
.hero h1{font-size:clamp(1.95rem,5.5vw,3.8rem);font-weight:700;max-width:720px}
.hero h1 em{display:block;font-weight:800}

/* intro */
.banner{background:var(--navy);color:#fff;padding:36px 40px;margin-top:-60px;position:relative;border-radius:0 0 0 28px;clip-path:polygon(0 0,100% 0,100% calc(100% - 40px),calc(100% - 40px) 100%,0 100%)}
.banner h2{font-size:clamp(1.6rem,3.4vw,2.3rem);font-weight:800;margin:0 0 8px}
.banner p{margin:0;font-size:1.15rem;font-weight:500;max-width:760px}
.intro{padding-bottom:70px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-top:56px}
.badge{display:inline-block;background:var(--light);border-left:4px solid var(--orange);padding:10px 14px;font-weight:700}

/* steps */
.steps{background:var(--light);padding:70px 0}
.step-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.step-grid li{background:var(--orange);color:#fff;text-align:center;padding:40px 24px}
.step-grid h3{font-size:1.9rem;font-weight:800}
.step-grid p{margin:0;font-weight:500}
.cta-row{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:56px;flex-wrap:wrap}
.cta-row h2{font-size:2rem}
.cta-row h2 a,.mt a{text-decoration:none;color:var(--navy)}
.cta-row p{margin:0;color:var(--muted)}

/* brands */
.brands{padding:48px 0;border-bottom:1px solid #e6e8ef}
.brand-row{display:flex;justify-content:space-around;align-items:center;gap:32px;flex-wrap:wrap}
.brand-row img{max-height:60px;width:auto;filter:grayscale(1);opacity:.8;transition:.2s}
.brand-row img:hover{filter:none;opacity:1}

/* review */
.review{padding:20px 0 80px}
blockquote{margin:0;background:var(--navy);color:#fff;padding:40px}
blockquote p{font-size:1.5rem;font-weight:700;margin:8px 0 0}
.q-label{color:var(--orange-soft);font-weight:700;font-size:.9rem;text-transform:uppercase;letter-spacing:.06em}
.mt{margin-top:32px;font-size:2rem}

/* services */
.services{background:var(--navy);color:#fff;padding:80px 0}
.services h2{font-size:2.4rem;color:var(--orange-soft)}
.service-list{list-style:none;padding:0;margin:0;columns:2;column-gap:48px}
.service-list li{break-inside:avoid;padding:10px 0 10px 26px;position:relative;border-bottom:1px solid rgba(255,255,255,.1)}
.service-list li::before{content:"";position:absolute;left:0;top:19px;width:10px;height:10px;background:var(--orange);transform:rotate(45deg)}

/* contact */
.contact{padding:80px 0}
.contact .split{margin-top:0;align-items:start}
.contact h2{font-size:2.4rem;color:var(--navy)}
.rounded{border-radius:0 0 28px 0;margin-top:24px}
.form{background:var(--light);padding:40px;display:grid;gap:16px}
.form label{display:grid;gap:6px;font-weight:700;font-size:.95rem}
.form input,.form textarea{font:inherit;padding:12px 14px;border:1px solid #cfd4e0;background:#fff;border-radius:2px}
.form input:focus,.form textarea:focus{outline:2px solid var(--orange);border-color:transparent}
.form .btn{justify-self:start}
.hp{position:absolute;left:-9999px}

/* footer */
.footer{background:var(--navy);color:#fff;padding:48px 0 32px}
.foot-inner{display:flex;flex-direction:column;align-items:center;text-align:center}
.footer .logo img{width:150px}
.footer .hero-contact{margin:24px 0}
.footer .hero-contact a{font-size:1.1rem}
.small{font-size:.85rem;opacity:.6;margin:0}
.spark{display:flex;align-items:center;gap:10px;margin-top:20px;text-decoration:none;font-size:.8rem;opacity:.8}
.spark img{width:96px}
.areas{font-size:1.1rem}
.mob-bar{display:none}

@media (max-width:980px){.top-mail{display:none}}
@media (max-width:820px){
  .top-actions .btn{display:none}
  .topbar .logo img{width:96px}
  .top-phone{font-size:1.1rem}
  .mob-bar{display:grid;grid-template-columns:1fr 1fr;position:fixed;bottom:0;left:0;right:0;z-index:30}
  .mob-bar a{padding:16px;text-align:center;font-weight:800;text-decoration:none;color:#fff;background:var(--navy);text-transform:uppercase}
  .mob-bar a+a{background:var(--orange)}
  body{padding-bottom:56px}
  .hero{padding-top:56px!important}
  .split,.step-grid{grid-template-columns:1fr}
  .service-list{columns:1}
  .banner{padding:28px 22px}
  .hero{padding-bottom:90px}
  .hero-contact span{display:block;margin:0}
  .form,blockquote{padding:28px 22px}
}