:root{
  --fluid-width:100vw;
  --fluid-height:100vh;
  --page-gutter:clamp(16px,calc(var(--fluid-width) * .0333),72px);
  --header-height:clamp(77px,calc(var(--fluid-width) * .065),104px);
}
@supports(height:100dvh){:root{--fluid-height:100dvh}}
html,body{min-width:0;max-width:100%;width:100%}
main{min-width:0}
@supports(container-type:inline-size){main{container-type:inline-size;--fluid-width:100cqw}}
body{font-size:clamp(14px,calc(var(--fluid-width) * .009),17px)}
.container{width:min(1840px,calc(100% - 2 * var(--page-gutter)))}
.header .brand>img{width:clamp(173px,calc(var(--fluid-width) * .17),260px)}
.header nav{gap:clamp(16px,calc(var(--fluid-width) * .018),36px)}
.header nav>a:not(.btn),.nav-more>summary{font-size:clamp(11px,calc(var(--fluid-width) * .0075),14px)}
.header .btn{font-size:clamp(11px,calc(var(--fluid-width) * .0075),14px)}
.section{padding-block:clamp(48px,calc(var(--fluid-width) * .055),112px)}
.page-intro h1{font-size:clamp(30px,calc(var(--fluid-width) * .037),72px);max-width:1200px}
.page-intro>div>p:not(.kicker){font-size:clamp(13px,calc(var(--fluid-width) * .009),17px);max-width:70ch}
.about-grid>div>p,.environment-grid>div>p:not(.kicker),.contact-grid>div>p:not(.kicker),.channel-layout aside>p{font-size:clamp(13px,calc(var(--fluid-width) * .009),17px);max-width:70ch}
.about-grid>div>p.lead{font-size:clamp(15px,calc(var(--fluid-width) * .011),21px)}
.purpose-grid p,.solution-card>p,.quality-steps p,.people-card p,.environment-principles p,.environment-topics p,.environment-statement>p{font-size:clamp(13px,calc(var(--fluid-width) * .0085),16px)}
.solution-card>strong{font-size:clamp(13px,calc(var(--fluid-width) * .0085),16px)}
.solution-card h3{font-size:clamp(20px,calc(var(--fluid-width) * .014),27px)}
.card-action,.field label,.form-card>p,.consent{font-size:clamp(12px,calc(var(--fluid-width) * .0085),16px)}
.field input,.field select,.field textarea{font-size:16px}
.field small,.form-note{font-size:clamp(11px,calc(var(--fluid-width) * .0075),14px)}
.solutions-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.footer-main>div>a:not(.brand){font-size:clamp(11px,calc(var(--fluid-width) * .008),15px)}
.footer-main>div>p{font-size:clamp(12px,calc(var(--fluid-width) * .008),15px)}

/* A real photograph from the supplied presentation replaces the AI panorama. */
.hero.hero-coast{min-height:min(1000px,calc(var(--fluid-height) - var(--header-height) - var(--utility-height) - 1px))}
.hero-coast .hero-image{object-position:56% 56%}
.hero-coast .hero-shade{background:linear-gradient(90deg,#032c43ed 0%,#032c43cd 27%,#032c4370 51%,#032c4320 75%,#032c430c),linear-gradient(0deg,#032c4380,transparent 44%)}
.hero.hero-coast h1{font-size:clamp(30px,min(calc(var(--fluid-width) * .049),calc(var(--fluid-height) * .072)),88px);max-width:1100px;letter-spacing:clamp(-3px,-.17vw,-1.4px)}
.hero-coast .hero-content{padding-block:clamp(28px,calc(var(--fluid-height) * .045),72px)}
.hero-coast .hero-content>p:not(.kicker){font-size:clamp(13px,calc(var(--fluid-width) * .0105),19px);max-width:580px;line-height:1.8}
.hero-coast .hero-actions .btn{font-size:clamp(12px,calc(var(--fluid-width) * .008),15px);min-height:52px}
.hero-coast .hero-environment{font-size:clamp(11px,calc(var(--fluid-width) * .008),15px)}
.hero-coast .hero-note{font-size:clamp(9px,calc(var(--fluid-width) * .0065),12px);max-width:580px;letter-spacing:.6px}
.hero-coast .hero-bottom{font-size:clamp(8px,calc(var(--fluid-width) * .0055),11px);gap:24px;padding-right:calc(var(--page-gutter) + 72px)}

@media(max-width:1319px){
  .hero.hero-coast h1{max-width:920px}
  .solutions-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1049px){
  :root{--header-height:81px}
  .header nav{gap:0;padding-inline:var(--page-gutter)}
  .header nav>a:not(.btn),.nav-more>summary{font-size:14px;min-height:45px;display:flex;align-items:center}
  .header .btn{font-size:13px}
  .about-grid,.environment-grid,.quality-grid,.contact-grid,.channel-layout{gap:clamp(28px,calc(var(--fluid-width) * .04),65px)}
  .hero.hero-coast h1{font-size:clamp(32px,min(calc(var(--fluid-width) * .055),calc(var(--fluid-height) * .072)),64px)}
  .hero-coast .hero-shade{background:linear-gradient(90deg,#032c43ed,#032c43c4 35%,#032c4355),linear-gradient(0deg,#032c436b,transparent 60%)}
}
@media(max-width:719px){
  :root{--header-height:77px}
  .hero.hero-coast h1{font-size:clamp(30px,calc(var(--fluid-width) * .091),55px);max-width:100%}
  .hero-coast .hero-image{object-position:64% center}
  .hero-coast .hero-shade{background:linear-gradient(90deg,#032c43e6,#032c43b5),linear-gradient(0deg,#032c436b,transparent 70%)}
  .hero-coast .hero-bottom{font-size:7px;align-items:center}
  .hero-coast .hero-bottom>span{max-width:none;flex:1}
  .hero-coast .hero-bottom>a{font-size:7px;flex:0 0 86px}
  .hero-coast .hero-content{padding-block:32px}
  .hero-coast .hero-content>p:not(.kicker){max-width:480px;font-size:14px}
  .hero-coast .hero-actions{flex-direction:column;align-items:stretch}
  .hero-coast .hero-actions .btn{width:100%;min-width:0}
  .hero-coast .hero-environment{font-size:11px}
  .hero-coast .hero-note{font-size:9px;max-width:100%}
  .people-card{padding:24px 20px}
}
@media(max-width:619px){.solutions-grid{grid-template-columns:1fr}}
@media(max-height:500px) and (min-width:720px){
  .hero.hero-coast h1{font-size:32px}
  .hero-coast .hero-content{padding-block:26px}
}