/* Mare Group — independent static implementation. */
*, *::before, *::after { box-sizing: border-box; }
html { color-scheme: dark; }
body { margin: 0; background: #151814; font-family: Montserrat, sans-serif; font-weight: 300; -webkit-font-smoothing: antialiased; }
a { color: inherit; }
button, input { font: inherit; }
img, video { display: block; }
.mare-hero { position: relative; display: flex; flex-direction: column; width: 100%; min-height: 720px; height: 100svh; overflow: hidden; background-color: #151814; background-image: url("assets/images/hero-poster.jpg"); background-size: cover; background-position: center; padding-top: 30px; padding-right: 5%; padding-bottom: 32px; padding-left: 5%; color: #f6f4ed; font-family: Montserrat, sans-serif; font-weight: 300; }
.mare-hero-video { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: 0; }
.mare-hero-shade { position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; z-index: 1; pointer-events: none; background-image: linear-gradient(90deg,rgba(0,0,0,0.38),rgba(0,0,0,0.12) 66%),linear-gradient(0deg,rgba(0,0,0,0.30),rgba(0,0,0,0) 35%); }
.mare-header { position: relative; z-index: 2; display: flex; align-items: flex-start; justify-content: space-between; column-gap: 36px; width: 100%; }
.mare-brand { position: relative; display: block; overflow: hidden; width: 140px; height: 54.6px; flex-shrink: 0; }
.mare-brand-image { position: absolute; width: 166.6667%; max-width: none; height: auto; left: -34.1667%; top: -179.0598%; }
.mare-nav { display: flex; align-items: center; column-gap: 38px; padding-top: 4px; }
.mare-nav-link { color: #f6f4ed; text-decoration: none; font-size: 14px; line-height: 1.6; font-weight: 300; }
.mare-language { display: flex; align-items: center; column-gap: 5px; margin-left: 14px; color: #f6f4ed; font-size: 13px; line-height: 1.6; }
.mare-language-link { color: #f6f4ed; text-decoration: none; }
.mare-language-divider { opacity: 0.6; }
.mare-main { position: relative; z-index: 2; display: flex; align-items: center; flex-grow: 1; padding-top: 62px; padding-bottom: 62px; }
.mare-content { width: 100%; }
.mare-title { margin-top: 0px; margin-right: 0px; margin-bottom: 24px; margin-left: 0px; color: #f6f4ed; font-family: Montserrat, sans-serif; font-size: clamp(52px,5.15vw,100px); line-height: 1.12; font-weight: 200; letter-spacing: -0.045em; }
.mare-title-line { display: block; }
.mare-services { margin-top: 0px; margin-bottom: 0px; font-size: clamp(14px,1.25vw,22px); line-height: 1.6; font-weight: 300; letter-spacing: -0.025em; }
.mare-cta { display: inline-flex; align-items: center; justify-content: center; column-gap: 12px; margin-top: 60px; padding-top: 19px; padding-right: 38px; padding-bottom: 19px; padding-left: 38px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgba(246,244,237,0.85); border-right-color: rgba(246,244,237,0.85); border-bottom-color: rgba(246,244,237,0.85); border-left-color: rgba(246,244,237,0.85); color: #f6f4ed; background-color: rgba(0,0,0,0.05); text-decoration: none; font-size: 17px; font-weight: 300; line-height: 1.4; }
.mare-brand-links { display: flex; column-gap: 70px; margin-top: 28px; }
.mare-secondary-link { color: #f6f4ed; text-decoration: none; font-size: 14px; line-height: 1.6; }
.mare-footer { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; column-gap: 24px; padding-top: 19px; border-top-width: 1px; border-top-style: solid; border-top-color: rgba(246,244,237,0.52); }
.mare-location { margin-top: 0px; margin-bottom: 0px; font-size: 11px; line-height: 1.5; }
.mare-contact { display: flex; align-items: center; column-gap: 28px; }
.mare-email { color: #f6f4ed; text-decoration: none; font-size: 13px; line-height: 1.5; }
.mare-instagram { display: flex; align-items: center; justify-content: center; color: #f6f4ed; width: 24px; height: 24px; }
@media screen and (max-width: 991px) { .mare-nav { column-gap: 22px; } .mare-nav-link { font-size: 12px; } .mare-language { margin-left: 0px; font-size: 12px; } .mare-title { font-size: 7vw; } .mare-services { max-width: 650px; font-size: 16px; } .mare-main { padding-top: 74px; padding-bottom: 74px; } }
@media screen and (max-width: 767px) { .mare-hero { min-height: 700px; padding-top: 26px; padding-right: 6%; padding-bottom: 24px; padding-left: 6%; } .mare-header { flex-wrap: wrap; row-gap: 26px; } .mare-brand { width: 110px; height: 42.9px; } .mare-nav { flex-wrap: wrap; column-gap: 20px; row-gap: 10px; width: 100%; } .mare-language { position: absolute; top: 4px; right: 0px; } .mare-main { padding-top: 60px; padding-bottom: 60px; } .mare-title { font-size: 8vw; letter-spacing: -0.04em; } .mare-services { max-width: 480px; font-size: 14px; line-height: 1.8; } .mare-cta { margin-top: 36px; font-size: 14px; padding-top: 17px; padding-right: 24px; padding-bottom: 17px; padding-left: 24px; } .mare-brand-links { column-gap: 36px; margin-top: 24px; } .mare-secondary-link { font-size: 12px; } .mare-footer { align-items: flex-start; flex-direction: column; row-gap: 15px; } .mare-contact { justify-content: space-between; width: 100%; } .mare-location { font-size: 10px; } .mare-email { font-size: 12px; } }
@media screen and (max-width: 479px) { .mare-hero { min-height: 660px; } .mare-title { font-size: 8.2vw; } .mare-nav { column-gap: 17px; } .mare-nav-link { font-size: 10px; } .mare-services { max-width: 300px; font-size: 12px; } .mare-main { padding-top: 44px; padding-bottom: 48px; } }
.mare-services, .mare-location { color: #f6f4ed; }
.mare-hero a:focus-visible { outline: 2px solid #f6f4ed; outline-offset: 6px; }
.mare-nav-link, .mare-secondary-link, .mare-email, .mare-language-link { transition: opacity 160ms ease; }
.mare-nav-link:hover, .mare-secondary-link:hover, .mare-email:hover { opacity: .72; }
.mare-language-link[aria-current="true"] { text-decoration: underline; text-underline-offset: 4px; }
.mare-cta { transition: background-color 180ms ease; }
.mare-cta:hover { background-color: rgba(246,244,237,.12); }
@supports not (height: 100svh) { .mare-hero { height: 100vh; } }
@media (prefers-reduced-motion: reduce) {
 .mare-hero-video { visibility: hidden; }
 .mare-hero a { transition: none; }
}