/* COMAYTI — A1 / brand green. 1. Fonts, tokens and reset */
@font-face {
  font-family:Inter;
  src:url('fonts/inter-400.woff2') format('woff2');
  font-weight:400;
  font-display:swap;
}
@font-face {
  font-family:Inter;
  src:url('fonts/inter-500.woff2') format('woff2');
  font-weight:500;
  font-display:swap;
}
@font-face {
  font-family:Inter;
  src:url('fonts/inter-600.woff2') format('woff2');
  font-weight:600;
  font-display:swap;
}
@font-face {
  font-family:Inter;
  src:url('fonts/inter-700.woff2') format('woff2');
  font-weight:700;
  font-display:swap;
}
@font-face {
  font-family:Inter;
  src:url('fonts/inter-800.woff2') format('woff2');
  font-weight:800;
  font-display:swap;
}
:root {
  --brand:#00695f;
  --brand-deep:#00534b;
  --ink:#101415;
  --muted:#59615f;
  --line:#d9dfdc;
  --paper:#fff;
  --soft:#f4f6f4;
  --max:1280px;
  --header:88px;
  color-scheme:light;
}
* {
  box-sizing:border-box;
}
html {
  scroll-padding-top:110px;
}
body {
  margin:0;
  color:var(--ink);
  background:var(--paper);
  font:400 16px/1.65 Inter,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
button,input,select,textarea {
  font:inherit;
}
button,a,input,select,textarea {
  -webkit-tap-highlight-color:transparent;
}
button {
  cursor:pointer;
}
button {
  border-radius:0;
}
a {
  color:inherit;
  text-decoration:none;
}
img {
  max-width:100%;
  display:block;
}
h1,h2,h3,p {
  margin:0;
}
h1,h2,h3 {
  line-height:1.07;
}
h1,h2 {
  letter-spacing:-.055em;
  font-weight:700;
}
h3 {
  letter-spacing:-.025em;
  font-weight:600;
}
p {
  line-height:1.75;
}
ul {
  padding-left:1.3em;
}
[hidden] {
  display:none!important;
}
:focus-visible {
  outline:3px solid var(--brand);
  outline-offset:5px;
}
::selection {
  background:#bce0d3;
}
.wrap {
  width:min(var(--max),calc(100% - 96px));
  margin-inline:auto;
}
.skip {
  position:fixed;
  top:10px;
  left:10px;
  transform:translateY(-180%);
  background:#fff;
  padding:12px 18px;
  z-index:100;
}
.skip:focus {
  transform:none;
}
.icon {
  width:20px;
  height:20px;
  flex:0 0 20px;
}
.white-icon {
  filter:invert(1);
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  min-height:50px;
  padding:13px 23px;
  background:var(--brand);
  color:#fff;
  border:1px solid var(--brand);
  font-size:14px;
  font-weight:600;
  transition:background .18s;
}
.button:hover {
  background:var(--brand-deep);
}
.button.white {
  background:#fff;
  color:var(--ink);
  border-color:#fff;
}
.button.white:hover {
  background:#e6f0eb;
}
.button.outline {
  background:transparent;
  color:var(--ink);
  border-color:#a9b5af;
}
.button.outline:hover {
  background:var(--soft);
}
.text-link {
  display:inline-flex;
  gap:20px;
  align-items:center;
  color:var(--brand);
  font-size:14px;
  font-weight:600;
  padding-block:8px;
}
.text-link:hover {
  text-decoration:underline;
  text-underline-offset:5px;
}
.actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.kicker {
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:600;
  color:var(--muted);
}
.muted {
  color:var(--muted);
}
/* 2. Header and accessible navigation */
.topbar {
  background:var(--brand);
  color:white;
  font-size:11px;
}
.topbar .wrap {
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:36px;
  gap:20px;
}
.top-contacts {
  display:flex;
  align-items:center;
  gap:28px;
}
.top-contacts a {
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:7px 0;
}
.top-contacts .icon {
  width:15px;
  height:15px;
  flex-basis:15px;
}
.lang {
  display:flex;
  align-items:center;
  gap:10px;
}
.lang a {
  padding:7px 3px;
}
.lang a[aria-current] {
  font-weight:800;
  text-decoration:underline;
  text-underline-offset:4px;
}
.site-header {
  position:sticky;
  top:0;
  z-index:30;
  background:#fff;
  border-bottom:1px solid #edf0ed;
  transition:transform .24s ease,background-color .24s ease;
}
.header-inner {
  min-height:var(--header);
  display:flex;
  gap:35px;
  align-items:center;
  justify-content:space-between;
}
.logo {
  width:220px;
  height:auto;
}
.main-nav {
  display:flex;
  align-items:center;
  gap:28px;
  font-size:13px;
  font-weight:500;
}
.main-nav>a {
  padding:16px 0;
  position:relative;
}
.main-nav>a:hover,.main-nav>a[aria-current] {
  color:var(--brand);
}
.main-nav>a[aria-current]:after {
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:6px;
  border-bottom:2px solid var(--brand);
}
.menu-toggle {
  display:none;
  background:white;
  border:1px solid var(--line);
  width:46px;
  height:46px;
  align-items:center;
  justify-content:center;
}
/* 3. Homepage — selected design */
.home-intro {
  position:relative;
  isolation:isolate;
  padding:62px 0 54px;
  overflow:hidden;
}
.home-intro h1 {
  max-width:760px;
  font-size:clamp(48px,5.5vw,78px);
  line-height:1;
  letter-spacing:-.065em;
  font-weight:800;
}
.home-intro h1 span {
  display:block;
}
.home-intro:before,.solutions-home:before,.contact-band:before,.page-hero:before {
  content:'';
  position:absolute;
  inset:0;
  background:url('circuits-animated.svg') right center/auto 100% no-repeat;
  opacity:.65;
  pointer-events:none;
  z-index:-1;
}
/* The compact circuit composition balances the headline without another photo. */
.intro-layout {display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:32px;align-items:center}
.intro-copy {min-width:0;position:relative;z-index:1}
.home-intro:before {display:none}
.motion-paused .home-intro:before,.motion-paused .solutions-home:before,.motion-paused .contact-band:before,.motion-paused .page-hero:before {background-image:url('circuits.svg')}
@media(max-width:900px) {
 .intro-layout {grid-template-columns:minmax(0,1fr) 200px;gap:20px}
 .home-intro h1 {font-size:clamp(40px,5.8vw,56px)}
}
@media(max-width:650px) {
 .intro-layout {display:block}
}
.signature-line {
  display:flex;
  align-items:center;
  gap:20px;
  margin-top:35px;
  font-size:10px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--muted);
  max-width:540px;
  line-height:1.6;
}
.signature-line:before {
  content:'';
  display:block;
  width:25%;
  height:1px;
  background:#aebdb7;
  flex-shrink:0;
  border-left:20px solid var(--brand);
}
.hero-media {
  position:relative;
  min-height:500px;
  background:#1b2422;
  isolation:isolate;
  overflow:hidden;
}
.hero-media>.hero-photo {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:74% 48%;
  z-index:-2;
}
.hero-media .wrap {
  min-height:500px;
  display:flex;
  align-items:center;
}
.hero-message {
  position:relative;
  width:34%;
  padding:48px 0;
  color:white;
}
.hero-message:before {
  content:'';
  position:absolute;
  inset:-180px -65px -180px -50vw;
  background:var(--brand);
  transform:skewX(-12deg);
  transform-origin:bottom;
  z-index:-1;
}
.hero-message h2 {
  font-size:clamp(36px,3.55vw,54px);
  letter-spacing:-.045em;
  line-height:1.08;
  margin-bottom:34px;
  max-width:340px;
}
.hero-message .button {
  gap:14px;
  padding-inline:20px;
}
.solutions-home {
  padding:76px 0 0;
  position:relative;
  isolation:isolate;
}
.solutions-home:before {
  inset:140px 65% 90px 0;
  background-position:left center;
  background-size:auto 100%;
  opacity:.6;
}
.solutions-layout {
  display:grid;
  grid-template-columns:.9fr 1fr;
  gap:74px;
}
.solutions-title h2 {
  font-size:clamp(40px,4.2vw,62px);
  max-width:470px;
}
.service-index {
  display:grid;
  grid-auto-flow:column;
  grid-template-rows:repeat(4,1fr);
  grid-template-columns:1fr 1fr;
  column-gap:44px;
}
.service-index a {
  display:flex;
  gap:15px;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
  padding:20px 0;
  font-size:20px;
  font-weight:500;
  line-height:1.3;
  letter-spacing:-.025em;
}
.service-index a:nth-child(4n) {
  border-bottom:0;
}
.service-index a:hover {
  color:var(--brand);
}
.service-index .icon {
  width:18px;
  opacity:0;
  transition:opacity .18s;
}
.service-index a:hover .icon,.service-index a:focus-visible .icon {
  opacity:1;
}
.partners {
  border-top:1px solid var(--line);
  margin-top:55px;
  padding:20px 0 28px;
}
.partners-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:12px;
}
.partners h2,.partners h3 {
  font-size:11px;
  font-weight:500;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.partner-controls {
  display:flex;
  gap:20px;
  align-items:center;
}
.partner-controls a,.partner-toggle {
  font-size:11px;
  background:none;
  border:0;
  color:var(--muted);
  padding:8px 0;
  min-height:36px;
}
.partner-toggle {
  text-decoration:underline;
  text-underline-offset:4px;
}
.partner-viewport {
  overflow-x:auto;
  scrollbar-width:none;
  touch-action:pan-y;
  overscroll-behavior-x:contain;
  cursor:grab;
  user-select:none;
  padding:6px 0;
}
.partner-viewport::-webkit-scrollbar {
  display:none;
}
.partner-viewport.dragging {
  cursor:grabbing;
}
.partner-track {
  display:flex;
  width:max-content;
  gap:38px;
  list-style:none;
  margin:0;
  padding:0;
}
.partner-logo {
  flex:0 0 145px;
  width:145px;
  height:65px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.partner-logo img {
  width:132px;
  height:50px;
  object-fit:contain;
  pointer-events:none;
  -webkit-user-drag:none;
}
.brand-story {
  position:relative;
  background:var(--brand);
  color:white;
  padding:62px 0;
}
.brand-story .wrap {
  display:grid;
  grid-template-columns:.9fr 1fr;
  gap:74px;
  align-items:center;
}
.brand-story h2 {
  font-size:clamp(42px,4.5vw,66px);
  max-width:500px;
}
.brand-story .story-text>p {
  font-size:19px;
  font-weight:400;
  line-height:1.6;
  max-width:550px;
}
.brand-story .text-link {
  color:white;
  margin-top:12px;
}
.brand-story :focus-visible {
  outline-color:white;
}
.proof {
  display:grid;
  grid-template-columns:1fr 1fr 1.2fr;
  gap:20px;
  margin-top:29px;
}
.proof>div+div {
  border-left:1px solid #ffffff60;
  padding-left:23px;
}
.proof strong {
  display:block;
  font-size:28px;
  line-height:1.2;
  font-weight:700;
  white-space:nowrap;
}
.proof span {
  display:block;
  margin-top:9px;
  font-size:13px;
  line-height:1.5;
}
.support-photo {
  width:100%;
  height:310px;
  object-fit:cover;
  object-position:center 53%;
}
.contact-band {
  position:relative;
  isolation:isolate;
  padding:52px 0;
}
.contact-band:before {
  left:85%;
  background-size:auto 220%;
  background-position:right bottom;
}
.contact-band .wrap {
  display:grid;
  grid-template-columns:1.1fr 1fr 1.1fr;
  gap:42px;
  align-items:center;
}
.contact-band h2 {
  font-size:44px;
}
.contact-cell {
  display:flex;
  flex-direction:column;
  gap:15px;
  border-left:1px solid var(--line);
  padding-left:30px;
  font-size:14px;
  line-height:1.6;
}
.contact-cell a {
  display:flex;
  align-items:flex-start;
  gap:16px;
}
.contact-cell a:hover {
  color:var(--brand);
}
/* 4. Internal page layout */
.breadcrumb {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  font-size:12px;
  color:var(--muted);
  padding:25px 0;
}
.breadcrumb a:hover {
  text-decoration:underline;
}
.page-hero {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:30px 0 62px;
}
.page-hero:before {
  left:65%;
  opacity:.55;
}
.page-hero .kicker {
  margin-bottom:20px;
  color:var(--brand);
}
.page-hero h1 {
  font-size:clamp(42px,5vw,72px);
  max-width:950px;
}
.page-hero .lead {
  font-size:20px;
  line-height:1.65;
  max-width:730px;
  color:var(--muted);
  margin-top:24px;
}
.page-hero .actions {
  margin-top:28px;
}
/* Interior illustrations: restrained technical linework with a shared motion preference. */
.page-hero-layout {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:16px;align-items:center}
.page-hero-copy {min-width:0;position:relative;z-index:1}
.page-hero-layout h1 {font-size:clamp(36px,4.3vw,64px)}
.page-motion {width:100%;max-width:420px;justify-self:end;pointer-events:none;color:var(--brand)}
.page-motion svg {display:block;width:100%;height:auto;overflow:visible}
.page-hero:has(.page-motion):before {display:none}
/* One continuous hero canvas: the illustration dissolves toward the copy. */
.home-intro,.page-hero {background:linear-gradient(100deg,#fff 32%,#fafcfb 59%,#eaf3ef 100%)}
.hero-atmosphere {position:absolute;inset:0;pointer-events:none;z-index:0;mask-image:linear-gradient(90deg,transparent 14%,rgba(0,0,0,.07) 40%,#000 76%);-webkit-mask-image:linear-gradient(90deg,transparent 14%,rgba(0,0,0,.07) 40%,#000 76%)}
.hero-atmosphere svg {display:block;width:100%;height:100%}
.atmosphere-lines {fill:none;stroke:#00695f;stroke-width:1;opacity:.16}
.atmosphere-light {fill:none;stroke:#168675;stroke-width:1.8;stroke-dasharray:9 91;opacity:.4}
.atmosphere-light path {animation:detail-flow 14s linear infinite}
.page-motion,.hero-landscape {position:relative;z-index:1}
.detail-object {transform-origin:50% 52%;animation:detail-hover 10s ease-in-out infinite}
.detail-drawing {fill:none;stroke:#4a8879;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.detail-surface {fill:#f8fcfa;fill-opacity:.85;stroke:#7aa697;stroke-width:1.2}
.detail-chassis {fill:#e4efea;fill-opacity:.75;stroke:#759e90}
.detail-edge {fill:#c5dcd1;fill-opacity:.45;stroke:#8eb2a3}
.detail-slot,.detail-screen {fill:#f8fcfa;fill-opacity:.85;stroke:#9bbbac}
.detail-dot {fill:#238d73;stroke:none;animation:detail-breathe 4.8s ease-in-out infinite}
.detail-dot:nth-child(3n) {animation-delay:-1.7s}
.detail-signal {stroke:#16846e;stroke-width:2.4;stroke-dasharray:10 90;animation:detail-flow 6.8s linear infinite}
.detail-signal:nth-child(4n) {animation-delay:-1.9s}
.detail-signal:nth-child(6n) {animation-delay:-3.2s}
.detail-layer {animation:detail-settle 8s ease-in-out infinite;animation-delay:var(--phase,0s)}
.detail-scan {animation:detail-scan 6s ease-in-out infinite;stroke:#16846e;stroke-width:2}
.detail-check {stroke:#00695f;stroke-width:2.5;stroke-dasharray:80;animation:detail-confirm 7s ease-in-out infinite}
@keyframes detail-flow {from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes detail-breathe {0%,100%{opacity:.4}45%,65%{opacity:1}}
@keyframes detail-settle {0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes detail-scan {0%,100%{transform:translateY(-18px);opacity:.15}50%{transform:translateY(95px);opacity:.7}}
@keyframes detail-hover {0%,100%{transform:translateY(2px)}50%{transform:translateY(-5px)}}
@keyframes detail-confirm {0%,15%{stroke-dashoffset:80;opacity:0}35%,85%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
.motion-paused .hero-atmosphere * {animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce) {.hero-atmosphere * {animation:none!important}}
@media(max-width:650px) {.hero-atmosphere {mask-image:linear-gradient(180deg,transparent 25%,#000 90%);-webkit-mask-image:linear-gradient(180deg,transparent 25%,#000 90%)}}
@media print {.hero-atmosphere {display:none}}
.motion-paused .page-motion * {animation-play-state:paused!important}
.site-header.header-away {transform:translateY(calc(-100% - 2px));pointer-events:none}
.site-header.header-scrolled {background:rgba(250,251,249,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}

.site-header:focus-within {transform:none;pointer-events:auto}
@media(max-width:900px) {
 .page-hero-layout {grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:24px}
 .page-hero-layout h1 {font-size:clamp(34px,5vw,48px)}
}
@media(max-width:650px) {
 .page-hero-layout {grid-template-columns:1fr;gap:24px}
 .page-motion {max-width:245px;justify-self:center}
 .page-hero-layout h1 {font-size:36px}

}
@media(prefers-reduced-motion:reduce) {
 .page-motion * {animation:none!important}
 .site-header {transition:none}
}
@media print {.page-motion {display:none}.site-header.header-away {transform:none}}

.editorial-photo {
  width:100%;
  height:360px;
  object-fit:cover;
  object-position:center;
}
/* Editorial scenes retain enough height for people and equipment to read naturally. */
.editorial-photo[class*="editorial-photo--"],.panorama-photo {width:100%;height:auto;aspect-ratio:3/1;object-fit:cover}

.content-section {
  padding:65px 0;
}
.section-top {
  display:flex;
  justify-content:space-between;
  gap:40px;
  align-items:flex-end;
  margin-bottom:35px;
}
.section-top h2 {
  font-size:40px;
  max-width:680px;
}
.section-top p {
  max-width:440px;
  color:var(--muted);
}
.service-catalogue {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 60px;
}
.catalogue-item {
  display:flex;
  align-items:flex-start;
  gap:22px;
  padding:30px 0;
  border-top:1px solid var(--line);
}
.catalogue-item h2 {
  font-size:28px;
  letter-spacing:-.035em;
  margin-bottom:13px;
}
.catalogue-item p {
  color:var(--muted);
  font-size:15px;
  max-width:470px;
}
.catalogue-item .icon {
  margin-left:auto;
  flex-shrink:0;
  margin-top:4px;
}
.catalogue-item:hover h2 {
  color:var(--brand);
}
.service-layout {
  display:grid;
  grid-template-columns:250px minmax(0,1fr);
  gap:75px;
  padding-block:55px 80px;
}
.service-sidebar {
  align-self:start;
  position:sticky;
  top:120px;
}
.service-sidebar h2 {
  font-size:13px;
  letter-spacing:0;
  margin-bottom:15px;
}
.service-sidebar a {
  display:block;
  font-size:13px;
  color:var(--muted);
  padding:10px 0;
  border-bottom:1px solid var(--line);
}
.service-sidebar a[aria-current] {
  color:var(--brand);
  font-weight:600;
}
.service-sections article {
  padding:31px 0;
  border-top:1px solid var(--line);
  scroll-margin-top:120px;
}
.service-sections article:first-child {
  padding-top:0;
  border-top:0;
}
.service-sections h2 {
  font-size:29px;
  letter-spacing:-.035em;
  margin-bottom:17px;
  max-width:720px;
}
.service-sections p {
  color:var(--muted);
  max-width:760px;
}
.service-sections .service-figure {
  margin:30px 0;
}
.service-figure img {
  width:100%;
  height:260px;
  object-fit:cover;
}
.inline-cta {
  background:var(--soft);
  padding:28px;
  margin-top:30px;
}
.inline-cta h2 {
  font-size:26px;
}
.inline-cta p {
  margin-bottom:20px;
}
.story-layout {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:95px;
}
.story-layout>.statement {
  font-size:42px;
  line-height:1.2;
  letter-spacing:-.045em;
  max-width:460px;
  font-weight:600;
}
.prose-sections section {
  border-top:1px solid var(--line);
  padding:28px 0;
}
.prose-sections section:first-child {
  border-top:0;
  padding-top:0;
}
.prose-sections h2 {
  font-size:28px;
  margin-bottom:18px;
}
.prose-sections p {
  color:var(--muted);
}
.why-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px 75px;
}
.why-grid section {
  border-top:1px solid var(--line);
  padding-top:24px;
}
.why-grid h2 {
  font-size:27px;
  margin-bottom:16px;
}
.why-grid p {
  color:var(--muted);
}
.related-links {
  display:flex;
  gap:10px 30px;
  flex-wrap:wrap;
  padding-top:20px;
}
.partners-grid {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:25px;
}
.partner-tile {
  padding:28px 16px;
  background:var(--soft);
  text-align:center;
}
.partner-tile img {
  height:55px;
  width:140px;
  object-fit:contain;
  margin:auto;
}
.partner-tile span {
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-top:18px;
}
.empty-blog {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
}
.empty-blog h2 {
  font-size:36px;
  margin-bottom:20px;
}
.empty-blog p {
  color:var(--muted);
  margin-bottom:20px;
}
.empty-blog>.editorial-photo {
  width:100%;
  height:340px;
  object-fit:cover;
}
.contact-layout {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:100px;
}
.contact-details h2 {
  font-size:30px;
  margin-bottom:24px;
}
.contact-details address {
  font-style:normal;
  line-height:1.8;
  color:var(--muted);
  margin:23px 0;
}
.contact-details>a {
  display:block;
  font-size:20px;
  margin:9px 0;
  color:var(--brand);
}
.contact-details>.text-link {
  display:inline-flex;
}
.contact-details .hours {
  margin:24px 0;
  color:var(--muted);
  font-size:14px;
}
.social-links {
  display:flex;
  gap:22px;
  flex-wrap:wrap;
  font-size:12px;
}
.social-links a {
  text-decoration:underline;
  text-underline-offset:4px;
}
.contact-form {
  background:var(--soft);
  padding:35px;
}
.contact-form h2 {
  font-size:28px;
  margin-bottom:15px;
}
.contact-form>p {
  font-size:14px;
  color:var(--muted);
  margin-bottom:22px;
}
.form-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.field {
  display:flex;
  flex-direction:column;
  gap:7px;
  font-size:13px;
}
.field.full {
  grid-column:1/-1;
}
.field input,.field select,.field textarea {
  width:100%;
  min-width:0;
  background:white;
  border:1px solid #a8b4ad;
  border-radius:0;
  padding:11px 12px;
  color:var(--ink);
}
.field textarea {
  resize:vertical;
  min-height:130px;
}
.contact-form .button {
  margin-top:22px;
}
.form-note {
  font-size:12px;
  line-height:1.6;
  color:var(--muted);
  margin-top:15px;
}
.form-note a {
  text-decoration:underline;
}
.form-status {
  font-size:14px;
  color:var(--brand);
  margin-top:16px;
}
.legal {
  max-width:840px;
  margin:auto;
  padding-bottom:60px;
}
.legal h2 {
  font-size:27px;
  margin:30px 0 16px;
}
.legal p {
  color:var(--muted);
  margin-bottom:22px;
}
.legal .notice {
  border-left:3px solid var(--brand);
  padding:10px 0 10px 20px;
  font-size:14px;
}
.policy-table {
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}
.policy-table th,.policy-table td {
  text-align:left;
  vertical-align:top;
  padding:15px 12px;
  border-bottom:1px solid var(--line);
}
.policy-table th {
  background:var(--soft);
}
.table-wrap {
  overflow-x:auto;
}
.sitemap-list {
  columns:2;
  list-style:none;
  padding:0;
}
.sitemap-list li {
  break-inside:avoid;
  padding:10px 0;
}
.sitemap-list a {
  color:var(--brand);
}
/* 5. Footer */
.site-footer {
  font-size:12px;
  background:#fff;
}
.footer-main {
  border-top:1px solid var(--line);
  padding:35px 0;
  display:grid;
  grid-template-columns:1.15fr 1fr 1.15fr 1fr;
  gap:35px;
}
.footer-brand .logo {
  width:170px;
}
.footer-brand p {
  color:var(--muted);
  font-size:12px;
  margin-top:14px;
  max-width:230px;
}
.footer-column h2 {
  font-size:12px;
  letter-spacing:0;
  margin-bottom:15px;
  font-weight:600;
}
.footer-column a {
  display:block;
  padding:4px 0;
  color:var(--muted);
  font-size:12px;
}
.footer-column a:hover {
  color:var(--brand);
  text-decoration:underline;
}
.footer-bottom {
  border-top:1px solid var(--line);
  padding:18px 0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:11px;
}
.footer-bottom>div {
  display:flex;
  gap:20px;
  align-items:center;
  flex-wrap:wrap;
}
.text-button {
  font-size:inherit;
  border:0;
  background:none;
  padding:8px 0;
  color:inherit;
  text-decoration:underline;
  text-underline-offset:3px;
}
/* 6. Consent */
.consent {
  position:fixed;
  left:22px;
  bottom:22px;
  background:#fff;
  width:min(455px,calc(100% - 44px));
  padding:25px;
  border:1px solid var(--line);
  box-shadow:0 8px 35px #142c2326;
  z-index:60;
  max-height:calc(100dvh - 44px);
  overflow:auto;
}
.consent h2 {
  font-size:20px;
  letter-spacing:-.025em;
  margin-bottom:12px;
}
.consent p {
  font-size:13px;
  color:var(--muted);
  margin-bottom:14px;
}
.consent p a {
  text-decoration:underline;
}
.consent .actions {
  gap:8px;
}
.consent .button {
  font-size:12px;
  min-height:43px;
  padding:10px 12px;
  flex:1;
  gap:0;
}
.preferences {
  font-size:13px;
  margin:10px 0 15px;
}
.preferences label {
  display:flex;
  align-items:center;
  gap:10px;
  min-height:36px;
}
.preferences input {
  accent-color:var(--brand);
  width:17px;
  height:17px;
}
#save-preferences {
  width:100%;
  margin-top:10px;
}
/* 7. Responsive composition */
@media(min-width:1600px) {
  .home-intro {
    padding-top:80px;
    padding-bottom:68px;
  }
  .hero-media,.hero-media .wrap {
    min-height:560px;
  }
  .hero-media>.hero-photo {
    object-position:78% 48%;
  }
}
@media(max-width:1150px) {
  .wrap {
    width:calc(100% - 64px);
  }
  .main-nav {
    gap:19px;
    font-size:12px;
  }
  .logo {
    width:190px;
  }
  .solutions-layout,.brand-story .wrap {
    gap:45px;
  }
  .service-index {
    column-gap:30px;
  }
  .hero-media,.hero-media .wrap {
    min-height:450px;
  }
  .hero-message {
    width:34%;
  }
  .hero-message:before {
    right:-45px;
  }
  .proof {
    gap:15px;
  }
  .proof>div+div {
    padding-left:15px;
  }
  .proof strong {
    font-size:25px;
  }
  .proof span {
    font-size:12px;
  }
  .contact-band .wrap {
    gap:25px;
  }
  .contact-cell {
    padding-left:22px;
  }
  .contact-band h2 {
    font-size:37px;
  }
  .service-layout {
    grid-template-columns:210px 1fr;
    gap:45px;
  }
  .story-layout {
    gap:55px;
  }
  .contact-layout {
    gap:50px;
  }
}
@media(max-width:900px) {
  :root {
    --header:76px;
  }
  .header-inner {
    flex-wrap:wrap;
    gap:0;
  }
  .logo {
    width:185px;
  }
  .menu-toggle {
    display:flex;
  }
  .main-nav {
    order:3;
    flex-basis:100%;
    flex-wrap:wrap;
    gap:5px 24px;
    padding-bottom:15px;
  }
  .js .main-nav {
    display:none;
  }
  .js .main-nav.open {
    display:flex;
  }
  .home-intro h1 {
    font-size:clamp(40px,5.8vw,56px);
  }
  .home-intro {
    padding:48px 0;
  }
  .hero-message {
    width:39%;
  }
  .hero-message h2 {
    font-size:38px;
  }
  .hero-message .button {
    font-size:12px;
    padding-inline:14px;
  }
  .solutions-layout {
    grid-template-columns:.8fr 1fr;
    gap:35px;
  }
  .solutions-title h2 {
    font-size:40px;
  }
  .service-index a {
    font-size:17px;
    padding:17px 0;
  }
  .brand-story .wrap {
    gap:35px;
  }
  .brand-story h2 {
    font-size:43px;
  }
  .brand-story .story-text>p {
    font-size:16px;
  }
  .proof strong {
    font-size:23px;
  }
  .proof {
    gap:10px;
  }
  .proof>div+div {
    padding-left:10px;
  }
  .proof span {
    font-size:11px;
  }
  .contact-band .wrap {
    grid-template-columns:1fr 1fr;
  }
  .contact-band h2 {
    grid-column:1/-1;
  }
  .contact-cell:first-of-type {
    padding-left:0;
    border-left:0;
  }
  .partners-grid {
    grid-template-columns:repeat(4,1fr);
  }
  .service-catalogue {
    gap:0 35px;
  }
  .service-layout {
    display:block;
  }
  .service-sidebar {
    position:static;
    display:flex;
    flex-wrap:wrap;
    gap:8px 20px;
    margin-bottom:40px;
  }
  .service-sidebar h2 {
    width:100%;
    margin-bottom:0;
  }
  .service-sidebar a {
    border:0;
    padding:5px 0;
    font-size:12px;
  }
  .footer-main {
    grid-template-columns:1fr 1fr;
    gap:30px;
  }
  .contact-layout {
    gap:35px;
  }
  .contact-form {
    padding:25px;
  }
  .form-grid {
    grid-template-columns:1fr;
  }
  .story-layout {
    grid-template-columns:1fr 1.2fr;
    gap:40px;
  }
  .story-layout>.statement {
    font-size:34px;
  }
  .section-top h2 {
    font-size:33px;
  }
}
@media(max-width:650px) {
  .wrap {
    width:calc(100% - 40px);
  }
  .topbar .wrap {
    gap:10px;
    font-size:10px;
  }
  .top-contacts {
    gap:15px;
  }
  .top-contacts .icon {
    display:none;
  }
  .lang {
    gap:5px;
  }
  .header-inner {
    min-height:72px;
  }
  .logo {
    width:172px;
  }
  .main-nav {
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding-top:10px;
  }
  .main-nav>a {
    padding:12px 0;
  }
  .main-nav>a[aria-current]:after {
    display:none;
  }
  .home-intro {
    padding:38px 0;
  }
  .home-intro h1 {
    font-size:clamp(39px,8.3vw,55px);
    line-height:1.04;
    letter-spacing:-.055em;
  }
  .home-intro:before {
    left:65%;
    opacity:.4;
  }
  .signature-line {
    font-size:8px;
    letter-spacing:.12em;
    gap:15px;
    margin-top:25px;
    max-width:350px;
  }
  .hero-media {
    display:flex;
    flex-direction:column;
    min-height:0;
    padding-top:56%;
  }
  .hero-media>.hero-photo {
    height:auto;
    aspect-ratio:16/9;
    object-fit:cover;
    object-position:80% center;
    inset:0 0 auto;
    z-index:-1;
  }
  .hero-media .wrap {
    min-height:0;
    width:100%;
    background:var(--brand);
  }
  .hero-message {
    width:100%;
    padding:29px 20px 32px;
    display:grid;
    grid-template-columns:1fr;
    gap:23px;
  }
  .hero-message:before {
    display:none;
  }
  .hero-message h2 {
    font-size:36px;
    max-width:360px;
    margin:0;
  }
  .hero-message .button {
    justify-self:start;
    font-size:13px;
  }
  .solutions-home {
    padding-top:45px;
  }
  .solutions-layout {
    grid-template-columns:1fr;
    gap:25px;
  }
  .solutions-title h2 {
    font-size:40px;
    max-width:380px;
  }
  .solutions-title .signature-line {
    margin-top:20px;
  }
  .service-index {
    column-gap:25px;
  }
  .service-index a {
    font-size:17px;
    min-height:78px;
    padding:18px 0;
  }
  .service-index .icon {
    display:none;
  }
  .solutions-home:before {
    inset:0 0 60% 55%;
    background-position:right;
    opacity:.35;
  }
  .partners {
    margin-top:30px;
    padding-bottom:22px;
  }
  .partners-heading {
    gap:10px;
    align-items:center;
  }
  .partners h2,.partners h3 {
    font-size:10px;
  }
  .partner-controls {
    gap:12px;
  }
  .partner-controls a,.partner-toggle {
    font-size:10px;
  }
  .partner-track {
    gap:25px;
  }
  .partner-logo {
    width:120px;
    flex-basis:120px;
    height:55px;
  }
  .partner-logo img {
    width:115px;
    height:42px;
  }
  .brand-story {
    padding:40px 0;
  }
  .brand-story .wrap {
    grid-template-columns:1fr;
    gap:26px;
  }
  .brand-story h2 {
    font-size:43px;
    max-width:370px;
  }
  .brand-story .story-text>p {
    font-size:16px;
  }
  .proof {
    margin-top:25px;
    gap:15px;
  }
  .proof>div+div {
    padding-left:15px;
  }
  .proof strong {
    font-size:25px;
  }
  .proof span {
    font-size:11px;
  }
  .support-photo {
    height:220px;
    object-position:54% center;
  }
  .contact-band {
    padding:38px 0;
  }
  .contact-band .wrap {
    grid-template-columns:1fr;
    gap:25px;
  }
  .contact-band h2 {
    font-size:38px;
  }
  .contact-cell,.contact-cell:first-of-type {
    padding-left:0;
    border-left:0;
    font-size:14px;
  }
  .contact-band:before {
    left:75%;
    opacity:.35;
  }
  .footer-main {
    padding:30px 0;
    gap:28px 20px;
  }
  .footer-brand {
    grid-column:1/-1;
  }
  .footer-brand .logo {
    width:160px;
  }
  .footer-brand p {
    max-width:350px;
  }
  .footer-bottom {
    align-items:flex-start;
    font-size:10px;
  }
  .footer-bottom>div {
    gap:12px;
  }
  .breadcrumb {
    font-size:11px;
    padding:18px 0;
  }
  .page-hero {
    padding:24px 0 40px;
  }
  .page-hero h1 {
    font-size:42px;
    letter-spacing:-.05em;
  }
  .page-hero .lead {
    font-size:17px;
    margin-top:22px;
  }
  .page-hero:before {
    left:70%;
    opacity:.35;
  }
  .page-hero .kicker {
    font-size:10px;
  }
  .editorial-photo {
    height:230px;
  }
  .content-section {
    padding:43px 0;
  }
  .section-top {
    display:block;
    margin-bottom:25px;
  }
  .section-top h2 {
    font-size:32px;
  }
  .section-top p {
    margin-top:20px;
  }
  .service-catalogue {
    grid-template-columns:1fr;
  }
  .catalogue-item {
    padding:25px 0;
  }
  .catalogue-item h2 {
    font-size:27px;
  }
  .service-layout {
    padding:30px 0 45px;
  }
  .service-sections h2 {
    font-size:27px;
  }
  .service-sections p {
    font-size:15px;
  }
  .service-figure img {
    height:210px;
  }
  .story-layout {
    grid-template-columns:1fr;
    gap:35px;
  }
  .story-layout>.statement {
    font-size:34px;
  }
  .why-grid {
    grid-template-columns:1fr;
    gap:28px;
  }
  .why-grid h2 {
    font-size:27px;
  }
  .partners-grid {
    grid-template-columns:repeat(2,1fr);
    gap:15px;
  }
  .partner-tile {
    padding:20px 12px;
  }
  .partner-tile img {
    width:110px;
    height:45px;
  }
  .empty-blog {
    grid-template-columns:1fr;
    gap:30px;
  }
  .empty-blog h2 {
    font-size:31px;
  }
  .empty-blog>.editorial-photo {
    height:240px;
  }
  .contact-layout {
    grid-template-columns:1fr;
    gap:35px;
  }
  .contact-form {
    padding:25px 20px;
  }
  .contact-details h2 {
    font-size:28px;
  }
  .legal h2 {
    font-size:24px;
  }
  .legal p {
    font-size:15px;
  }
  .sitemap-list {
    columns:1;
  }
  .policy-table {
    font-size:12px;
  }
  .policy-table th,.policy-table td {
    padding:12px 8px;
  }
  .consent {
    left:12px;
    bottom:12px;
    width:calc(100% - 24px);
    max-height:calc(100dvh - 24px);
    padding:20px;
  }
  .consent .button {
    font-size:11px;
    padding-inline:10px;
  }
}
@media(max-width:360px) {
  .wrap {
    width:calc(100% - 32px);
  }
  .top-contacts {
    gap:9px;
  }
  .topbar .wrap {
    font-size:9px;
  }
  .home-intro h1 {
    font-size:36px;
  }
  .proof {
    gap:10px;
  }
  .proof>div+div {
    padding-left:10px;
  }
  .proof strong {
    font-size:22px;
  }
  .consent .actions {
    flex-direction:column;
  }
  .service-index a {
    font-size:16px;
  }
}
/* 8. Motion / printing */
@media(prefers-reduced-motion:reduce) {
  .solutions-home:before,.contact-band:before,.page-hero:before {background-image:url("circuits.svg")}
  *,*:before,*:after {
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important;
  }
}
@media print {
  body {
    font-family:Arial,sans-serif;
    font-size:11pt;
    color:black;
  }
  .wrap {
    width:100%;
  }
  .site-header {
    position:static;
  }
  .topbar,.main-nav,.menu-toggle,.consent,.partner-controls,.service-sidebar,.contact-form,.support-photo,.hero-photo,.hero-media,.site-footer .footer-column,.text-button {
    display:none!important;
  }
  .home-intro,.page-hero,.content-section,.brand-story,.contact-band {
    padding:20px 0;
  }
  .home-intro h1 {
    font-size:38pt;
  }
  .home-intro:before,.solutions-home:before,.contact-band:before,.page-hero:before {
    display:none;
  }
  .brand-story {
    background:white;
    color:black;
  }
  .brand-story h2 {
    font-size:28pt;
  }
  .brand-story .text-link {
    color:black;
  }
  .solutions-layout,.brand-story .wrap,.story-layout,.contact-layout,.service-layout {
    display:block;
  }
  .service-index a,.service-sections article,.why-grid section {
    break-inside:avoid;
  }
  .partner-viewport {
    overflow:visible;
  }
  .partner-track {
    width:100%;
    flex-wrap:wrap;
    gap:10px;
  }
  .partner-logo {
    width:100px;
    flex-basis:100px;
  }
  .partner-logo[aria-hidden=true] {
    display:none;
  }
  .contact-band .wrap {
    grid-template-columns:1fr 1fr;
  }
  .logo {
    width:150px;
  }
  .page-hero h1 {
    font-size:30pt;
  }
  .editorial-photo {
    height:180px;
  }
  .footer-main {
    display:block;
  }
  .footer-brand p {
    max-width:none;
  }
}

/* Solution swatches: horizontal labels, independent disclosures, no carousel. */
.hero-landscape{position:relative;overflow:hidden;width:100%;padding:28px 0;border-top:1px solid #c7d6d1;border-bottom:1px solid #c7d6d1}
.hero-landscape img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.landscape-light{position:absolute;inset:12% auto 12% 0;width:12%;background:linear-gradient(90deg,transparent,#ffffffb3,transparent);transform:skewX(-18deg);animation:landscape-pass 9s ease-in-out infinite}
.landscape-rule{height:3px;width:32%;background:var(--brand);margin-top:20px}
@keyframes landscape-pass{0%,20%{transform:translateX(-160%) skewX(-18deg);opacity:0}35%{opacity:.6}85%,100%{transform:translateX(950%) skewX(-18deg);opacity:0}}
.deck-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:36px}
.deck-heading .solutions-title h2{max-width:820px;font-size:clamp(32px,4vw,54px)}
.deck-heading .signature-line{margin-top:24px}
@media(max-width:650px){.hero-landscape{margin-top:28px}.deck-heading .solutions-title h2{font-size:34px}.editorial-photo[class*="editorial-photo--"],.panorama-photo{min-height:0;aspect-ratio:3/1}}
.motion-paused .landscape-light{animation:none}
@media(prefers-reduced-motion:reduce){.landscape-light{animation:none}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
