/* LEFAMI V1.3 FULL WIDTH — 2026-10-13
   Shared page gutter aligns header, hero and every section. */

:root {
  --page-gutter:clamp(21px,3vw,64px)
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth
}

body {
  margin:0;
  color:#173549;
  background:#fcfcfa;
  font:16px/1.65 Arial,sans-serif
}

a {
  color:inherit;
  text-decoration:none
}

button,input,select,textarea {
  font:inherit
}

a,button {
  touch-action:manipulation
}

a:focus-visible,button:focus-visible {
  outline:3px solid #ed9b4b;
  outline-offset:4px
}

.wrap {
  width:100%;
  max-width:none;
  margin:0 auto;
  padding:0 var(--page-gutter)
}

.top {
  background:#123e58;
  color:#fff;
  font-size:12px;
  padding:8px 0
}

.top .wrap {
  display:flex;
  justify-content:space-between
}

header {
  background:#fff;
  border-bottom:1px solid #e2e7e8;
  position:sticky;
  top:0;
  z-index:20
}

.nav {
  display:flex;
  align-items:center;
  gap:28px;
  height:91px
}

.brand {
  display:flex;
  align-items:center;
  gap:9px;
  margin-right:auto
}

.brand img {
  width:61px;
  height:61px;
  object-fit:contain
}

.brand strong {
  font-size:25px;
  letter-spacing:2px;
  color:#144b70
}

.brand small {
  display:block;
  font-size:9px;
  letter-spacing:2px
}

nav {
  display:flex;
  gap:23px;
  font-size:14px
}

.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  padding:13px 23px;
  background:#e88231;
  color:#fff;
  border:0;
  border-radius:3px;
  font-weight:700;
  cursor:pointer
}

.btn.secondary {
  background:transparent;
  border:1px solid #bac9d0;
  color:#174960
}

.lang {
  font-weight:bold;
  font-size:13px
}

.hero {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.03fr);
  width:100%;
  max-width:none;
  margin:0;
  min-height:580px;
  padding:0 var(--page-gutter);
  background:#edf3f4
}

.hero-copy {
  min-width:0;
  padding:76px clamp(24px,4vw,72px) 72px 0;
  background:#edf3f4
}

.eyebrow {
  text-transform:uppercase;
  font-size:12px;
  font-weight:bold;
  letter-spacing:2px;
  color:#3e687e;
  margin:0 0 22px
}

h1 {
  font-size:clamp(38px,4.1vw,61px);
  line-height:1.12;
  letter-spacing:-2px;
  margin:0 0 27px;
  color:#123f59
}

h1 span {
  color:#d6772d
}

p {
  margin:0 0 22px
}

.lead {
  color:#536976;
  max-width:490px
}

.actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap
}

.hero-image {
  position:relative;
  min-width:0;
  min-height:440px;
  overflow:hidden
}

.hero-image img {
  display:block;
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:100%;
  object-fit:cover;
  object-position:center
}

.caption {
  position:absolute;
  bottom:28px;
  left:28px;
  background:#fff;
  padding:15px 21px;
  font-size:12px;
  max-width:85%;
  border-left:3px solid #e88231
}

.strip {
  border-bottom:1px solid #dce3e4;
  background:white
}

.strip .wrap {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  padding-top:25px;
  padding-bottom:25px
}

.strip b {
  font-size:15px
}

.strip small {
  display:block;
  color:#6e7f87
}

.strip div+div {
  border-left:1px solid #dce3e4;
  padding-left:40px
}

section {
  padding:82px 0
}

.heading {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:30px;
  margin-bottom:34px
}

h2 {
  font-size:37px;
  line-height:1.22;
  letter-spacing:-1px;
  margin:0 0 15px
}

h3 {
  font-size:23px;
  line-height:1.3;
  margin:0 0 15px
}

.muted {
  color:#647984
}

.cards {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px
}

.card {
  background:white;
  border:1px solid #dde5e7;
  overflow:hidden
}

.card img {
  width:100%;
  height:260px;
  object-fit:cover;
  transition:transform .4s
}

.card:hover img {
  transform:scale(1.025)
}

.card .body {
  padding:27px
}

.index {
  font-size:12px;
  color:#cc742d;
  letter-spacing:2px;
  margin-bottom:12px
}

.textlink {
  font-size:14px;
  font-weight:bold;
  color:#1c5578
}

.split {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:65px;
  align-items:center
}

.split>img {
  width:100%;
  height:430px;
  object-fit:cover
}

.dark {
  background:#133f57;
  color:white
}

.dark .eyebrow,.dark .muted {
  color:#b2cbd7
}

.dark .btn.secondary {
  color:white
}

.lines {
  margin:28px 0
}

.lines div {
  border-top:1px solid #ffffff30;
  padding:13px 0;
  display:flex;
  gap:18px
}

.lines span {
  color:#e9995d
}

.steps {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:25px
}

.step strong {
  font-size:35px;
  font-weight:normal;
  color:#c47b41;
  display:block;
  margin-bottom:15px
}

.step h3 {
  font-size:18px
}

.step p {
  font-size:14px;
  color:#647984
}

.gallery {
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:18px
}

.gallery img {
  width:100%;
  height:265px;
  object-fit:cover
}

figure {
  margin:0
}

figcaption {
  font-size:13px;
  padding-top:12px;
  color:#657b87
}

.quote {
  background:#edf3f4
}

.form {
  background:white;
  padding:35px;
  border:1px solid #d5e0e5
}

.fields {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:18px
}

label {
  display:block;
  font-size:13px;
  font-weight:bold
}

input,select,textarea {
  width:100%;
  padding:11px;
  background:#fbfcfc;
  border:1px solid #bdccd3;
  border-radius:2px;
  color:#163c53;
  margin-top:6px
}

textarea {
  min-height:105px
}

.wide {
  grid-column:1/-1
}

.note {
  font-size:12px;
  color:#6a7c87;
  margin:17px 0
}

.contact-line {
  padding:15px 0;
  border-bottom:1px solid #cfdde2
}

.contact-line small {
  display:block;
  color:#66808e;
  font-size:12px
}

footer {
  background:#0e2c3d;
  color:#c2d0d8;
  padding:55px 0 25px;
  font-size:13px
}

.foot {
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:50px
}

.foot h3 {
  color:white;
  font-size:20px
}

.foot a {
  display:block;
  margin-bottom:8px
}

.copyright {
  border-top:1px solid #ffffff20;
  margin-top:35px;
  padding-top:23px;
  display:flex;
  justify-content:space-between
}

.pagehero {
  background:#edf3f4;
  padding:62px 0
}

.pagehero h1 {
  max-width:850px
}

.article {
  width:100%;
  max-width:none;
  margin:0 auto
}

.article h2 {
  font-size:29px;
  margin-top:38px
}

.article li {
  margin-bottom:10px
}

details {
  padding:18px 0;
  border-bottom:1px solid #cbd8de
}

summary {
  cursor:pointer;
  font-weight:bold
}

details p {
  margin-top:14px
}

.mobile-toggle {
  display:none
}

.badge {
  font-size:12px;
  border:1px solid #cbd9df;
  padding:5px 10px;
  display:inline-block;
  margin-bottom:20px
}

@media(max-width:1000px) {
  nav {
  gap:13px;
  font-size:12px
}

.nav {
  gap:15px
}

.nav>.btn {
  display:none
}

.hero-copy {
  padding:50px 28px 50px 0
}

.split {
  gap:35px
}

.steps {
  grid-template-columns:repeat(3,1fr)
}


}

@media(max-width:700px) {
  .wrap {
  padding:0 var(--page-gutter)
}

.top .wrap span {
  display:none
}

.nav {
  height:75px
}

.brand img {
  width:48px;
  height:48px
}

.brand strong {
  font-size:22px
}

.mobile-toggle {
  display:block;
  border:0;
  background:#edf3f4;
  padding:8px
}

nav {
  display:none;
  position:absolute;
  top:75px;
  left:0;
  right:0;
  background:white;
  padding:22px;
  flex-direction:column;
  font-size:16px;
  border-bottom:1px solid #ddd
}

nav.open {
  display:flex
}

.hero {
  grid-template-columns:1fr
}

.hero-copy {
  padding:43px 0
}

.hero-image {
  min-height:310px
}

h1 {
  font-size:42px
}

section {
  padding:52px 0
}

h2 {
  font-size:30px
}

.heading {
  display:block
}

.cards,.split,.gallery {
  grid-template-columns:1fr
}

.card img {
  height:250px
}

.split>img {
  height:300px
}

.strip .wrap {
  gap:12px
}

.strip div+div {
  padding-left:12px
}

.strip b {
  font-size:12px
}

.strip small {
  font-size:10px
}

.steps {
  grid-template-columns:1fr 1fr
}

.fields {
  grid-template-columns:1fr
}

.form {
  padding:23px
}

.foot {
  grid-template-columns:1fr;
  gap:25px
}

.copyright {
  display:block
}

.gallery img {
  height:260px
}

.actions .btn {
  padding:12px 18px
}

.pagehero {
  padding:42px 0
}


}


.honey {
  display:none!important
}

button:disabled {
  opacity:.65;
  cursor:wait
}

[role=status] {
  white-space:pre-wrap
}

 .quote-form [role=status] {
  font-size:14px;
  color:#164f6e
}



.hero > *, .cards > *, .split > *, .fields > *, .gallery > *, .foot > *  {
   min-width:0;
   
}


img  {
   max-width:100%;
   
}


textarea  {
   resize:vertical;
   
}


.contact-line, .foot, .note  {
   overflow-wrap:anywhere;
   
}


@media (max-width:1100px)  {
  
 .nav  {
   height:75px;
   
}


 .nav > .btn  {
   display:none;
   
}


 .mobile-toggle  {
   display:block;
   border:0;
   background:#edf3f4;
   padding:8px;
   
}


 nav  {
   display:none;
   position:absolute;
   top:75px;
   left:0;
   right:0;
   background:white;
   padding:22px var(--page-gutter);
   flex-direction:column;
   font-size:16px;
   border-bottom:1px solid #ddd;
   
}


 nav.open  {
   display:flex;
   
}



}


@media (max-width:700px)  {
  
 .hero  {
   grid-template-columns:1fr;
   
}


 .hero-image  {
   min-height:310px;
   
}



}