:root { --ink:#102832; --ink-soft:#28444d; --aqua:#48a9bd; --aqua-deep:#17657c; --paper:#f4f6f1; --white:#fff; --line:rgba(16,40,50,.16); --serif:Georgia,"Times New Roman",serif; --sans:"DM Sans",Arial,sans-serif; --display:"Manrope",Arial,sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); } button,a { font:inherit; } a { color:inherit; text-decoration:none; } img { display:block; max-width:100%; } .visually-hidden { clip:rect(0 0 0 0); clip-path:inset(50%); height:1px; overflow:hidden; position:absolute; white-space:nowrap; width:1px; }
.site-header { align-items:center; display:flex; height:88px; justify-content:space-between; left:0; padding:0 5.5vw; position:absolute; right:0; top:0; z-index:10; } .brand { display:block; width:164px; } .brand img { height:auto; width:100%; } .site-nav { align-items:center; color:var(--white); display:flex; font-size:13px; font-weight:700; gap:30px; letter-spacing:.045em; text-transform:uppercase; } .site-nav>a { position:relative; } .site-nav>a:not(.nav-contact)::after { background:currentColor; bottom:-7px; content:""; height:1px; left:0; position:absolute; transform:scaleX(0); transform-origin:left; transition:transform .25s ease; width:100%; } .site-nav>a:hover::after { transform:scaleX(1); } .nav-contact { border:1px solid rgba(255,255,255,.65); padding:12px 17px; transition:background .2s ease,color .2s ease; } .nav-contact:hover { background:var(--white); color:var(--ink); } .menu-toggle { background:transparent; border:0; cursor:pointer; display:none; padding:8px 0 8px 8px; }
.hero { color:var(--white); display:flex; flex-direction:column; justify-content:flex-end; min-height:min(860px,100vh); overflow:hidden; padding:150px 5.5vw 44px; position:relative; } .hero-media { background-image:url("assets/polaris-hero-industrial-silos.jpg"); background-position:center calc(50% + var(--parallax,0px)); background-size:cover; inset:0; position:absolute; transform:scale(1.03); } .hero-shade { background:rgba(7,24,32,.72); inset:0; position:absolute; } .hero-content,.hero-foot { position:relative; z-index:1; } .hero-content { max-width:850px; } .eyebrow,.section-kicker { font-size:11px; font-weight:700; letter-spacing:.14em; margin:0; text-transform:uppercase; } .eyebrow.light,.section-kicker.light { color:#b9e5eb; } h1,h2,h3,p { margin-top:0; } h1 { font-family:var(--display); font-size:clamp(50px,7.6vw,116px); font-weight:500; letter-spacing:-.035em; line-height:.94; margin:22px 0 28px; } h1 em,h2 em { color:#9ad6de; font-family:var(--serif); font-style:italic; font-weight:400; } .hero-copy { color:rgba(255,255,255,.81); font-size:clamp(16px,1.55vw,21px); line-height:1.5; max-width:600px; } .text-link { align-items:center; color:var(--aqua-deep); display:inline-flex; font-size:12px; font-weight:700; gap:12px; letter-spacing:.1em; margin-top:22px; text-transform:uppercase; } .text-link span { font-size:18px; transition:transform .2s ease; } .text-link:hover span { transform:translateX(5px); } .text-link.light { color:var(--white); } .hero-foot { border-top:1px solid rgba(255,255,255,.3); display:flex; font-size:11px; gap:48px; justify-content:space-between; letter-spacing:.08em; margin-top:84px; padding-top:16px; text-transform:uppercase; }
.section-pad { padding:130px 5.5vw; } .intro-grid { display:grid; gap:8vw; grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr); margin-top:50px; } .intro h2,.sector-heading h2,.approach h2,.contact h2 { font-family:var(--display); font-size:clamp(37px,5vw,76px); font-weight:500; letter-spacing:-.04em; line-height:1.02; margin-bottom:0; } .intro-copy { color:var(--ink-soft); font-size:17px; line-height:1.6; padding-top:9px; } .intro-copy p+p { margin-top:20px; } .proof-line { border-bottom:1px solid var(--line); border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(3,1fr); margin-top:104px; } .proof-line>div { min-height:150px; padding:29px 18px 25px 0; } .proof-line>div+div { border-left:1px solid var(--line); padding-left:32px; } .proof-line strong { color:var(--aqua-deep); display:block; font-family:var(--display); font-size:42px; font-weight:500; letter-spacing:-.04em; } .proof-line span { color:var(--ink-soft); display:block; font-size:12px; line-height:1.35; margin-top:9px; max-width:145px; }
.sectors { background:var(--ink); color:var(--white); } .sector-heading { display:grid; gap:8vw; grid-template-columns:.42fr 1fr; padding-bottom:76px; } .sector-heading-copy { max-width:710px; } .sector-heading h2 { margin-bottom:20px; } .sector-heading p { color:#bcd3d6; font-size:17px; line-height:1.55; max-width:480px; } .sector-explorer { border-top:1px solid rgba(255,255,255,.22); display:grid; grid-template-columns:minmax(330px,.8fr) minmax(500px,1.2fr); } .sector-list { border-right:1px solid rgba(255,255,255,.22); } .sector-trigger { align-items:center; background:transparent; border:0; border-bottom:1px solid rgba(255,255,255,.22); color:inherit; cursor:pointer; display:grid; font-family:var(--display); grid-template-columns:50px 1fr; min-height:119px; padding:21px 5.5vw; text-align:left; transition:background .25s ease,color .25s ease; width:100%; } .sector-trigger span { color:#90cbd5; font-family:var(--sans); font-size:11px; letter-spacing:.09em; } .sector-trigger strong { font-size:clamp(20px,2vw,29px); font-weight:500; letter-spacing:-.025em; } .sector-trigger:hover,.sector-trigger.is-active { background:#1c424e; } .sector-panel { display:grid; grid-template-columns:minmax(220px,1fr) minmax(280px,1fr); min-height:540px; } .sector-image-wrap { overflow:hidden; } .sector-image-wrap img { height:100%; object-fit:cover; transition:opacity .3s ease,transform .5s ease; width:100%; } .sector-panel-copy { display:flex; flex-direction:column; padding:52px 5.5vw 40px 45px; } .sector-number { color:#8ecdda; font-size:11px; font-weight:700; letter-spacing:.12em; } .sector-panel h3 { font-family:var(--display); font-size:clamp(28px,3.2vw,48px); font-weight:500; letter-spacing:-.04em; line-height:1; margin-bottom:20px; } .sector-lede { color:#d8e5e4; font-size:16px; line-height:1.55; } .sector-panel ul { color:#acc8cc; font-size:14px; line-height:1.45; list-style:none; margin:14px 0 12px; padding:0; } .sector-panel li { border-top:1px solid rgba(255,255,255,.19); padding:10px 0; } .sector-panel .text-link { color:#9bd4dc; margin-top:auto; }
.approach { background:#dfe9e5; display:grid; gap:8vw; grid-template-columns:minmax(290px,.84fr) minmax(340px,1.16fr); } .approach-image { min-height:670px; overflow:hidden; } .approach-image img { height:100%; object-fit:cover; width:100%; } .approach-copy { padding-top:3px; } .approach h2 { margin:46px 0 54px; } .approach-points { border-top:1px solid var(--line); } .approach-points article { border-bottom:1px solid var(--line); display:grid; gap:22px; grid-template-columns:32px 1fr; padding:22px 0; } .approach-points span { color:var(--aqua-deep); font-size:11px; font-weight:700; letter-spacing:.08em; padding-top:5px; } .approach-points h3 { font-family:var(--display); font-size:20px; font-weight:600; letter-spacing:-.025em; margin-bottom:7px; } .approach-points p { color:var(--ink-soft); font-size:15px; line-height:1.55; margin-bottom:0; }
.contact { background:#167089; color:var(--white); display:grid; gap:9vw; grid-template-columns:1.3fr .7fr; padding:130px 5.5vw 90px; } .contact h2 { margin:24px 0 38px; } .contact h2 em { color:#e9e4c2; } .contact-email { border-bottom:1px solid rgba(255,255,255,.48); display:inline-flex; font-family:var(--display); font-size:clamp(19px,2.6vw,37px); font-weight:500; gap:16px; letter-spacing:-.03em; padding-bottom:11px; } .contact-email span { color:#e9e4c2; transition:transform .2s ease; } .contact-email:hover span { transform:translate(4px,-4px); } .contact-meta { align-self:end; border-top:1px solid rgba(255,255,255,.35); padding-top:23px; } .contact-meta p { color:#d5e5e6; font-size:14px; line-height:1.58; margin-bottom:25px; } .contact-meta strong { color:var(--white); display:block; font-size:11px; letter-spacing:.1em; margin-bottom:8px; text-transform:uppercase; } .contact-meta a { text-decoration:underline; text-underline-offset:4px; }
.site-footer { align-items:end; background:var(--ink); color:#b9d0d0; display:grid; grid-template-columns:1fr 1fr 1fr; min-height:190px; padding:42px 5.5vw; } .footer-brand { transform:translateY(14px); width:145px; } .site-footer p { font-size:12px; line-height:1.45; margin:0; } .site-footer p:first-of-type { text-align:center; } .site-footer p:last-child { text-align:right; }
.reveal { opacity:0; transform:translateY(26px); transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1); } .reveal.is-visible { opacity:1; transform:translateY(0); } .delay-1 { transition-delay:.1s; }.delay-2 { transition-delay:.2s; }.delay-3 { transition-delay:.3s; }
@media (max-width:860px) { .site-header { height:76px; padding:0 24px; }.brand { width:142px; }.menu-toggle { display:block; position:relative; z-index:2; }.menu-toggle span:not(.visually-hidden) { background:var(--white); display:block; height:1px; margin:6px 0; transition:transform .2s ease; width:25px; }.menu-toggle[aria-expanded="true"] span:first-child { transform:translateY(3px) rotate(45deg); }.menu-toggle[aria-expanded="true"] span:nth-child(2) { transform:translateY(-4px) rotate(-45deg); }.site-nav { align-items:flex-start; background:var(--ink); flex-direction:column; gap:25px; inset:0; justify-content:center; opacity:0; padding:80px 24px 40px; pointer-events:none; position:fixed; transform:translateY(-12px); transition:opacity .25s ease,transform .25s ease; }.site-nav.is-open { opacity:1; pointer-events:auto; transform:translateY(0); }.site-nav a { font-family:var(--display); font-size:28px; letter-spacing:-.03em; text-transform:none; }.nav-contact { border:0; padding:0; }.hero { min-height:760px; padding:128px 24px 28px; }.hero-foot { font-size:9px; gap:14px; margin-top:60px; }.section-pad { padding:90px 24px; }.intro-grid,.sector-heading,.approach,.contact { grid-template-columns:1fr; }.intro-grid { gap:34px; margin-top:34px; }.proof-line { margin-top:64px; }.proof-line>div { min-height:125px; padding:20px 10px 20px 0; }.proof-line>div+div { padding-left:14px; }.proof-line strong { font-size:31px; }.proof-line span { font-size:10px; }.sector-heading { gap:28px; padding-bottom:52px; }.sector-explorer { grid-template-columns:1fr; }.sector-list { border-bottom:1px solid rgba(255,255,255,.22); border-right:0; }.sector-trigger { grid-template-columns:40px 1fr; min-height:78px; padding:15px 24px; }.sector-trigger strong { font-size:20px; }.sector-panel { grid-template-columns:1fr; }.sector-image-wrap { height:285px; }.sector-panel-copy { min-height:430px; padding:36px 24px 32px; }.approach { gap:53px; padding:90px 24px; }.approach-image { min-height:380px; }.approach h2 { margin:30px 0 38px; }.contact { gap:64px; padding:88px 24px 60px; }.site-footer { align-items:start; gap:28px; grid-template-columns:1fr; min-height:0; padding:38px 24px; }.footer-brand { transform:translateX(-11px); }.site-footer p:first-of-type,.site-footer p:last-child { text-align:left; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms !important; scroll-behavior:auto !important; transition-duration:.01ms !important; }.reveal { opacity:1; transform:none; } }