/* =========================================================
   YMS UI — loader, fullscreen menu, service icons
   ========================================================= */
:root{
  --yms-ink:#000;
  --yms-paper:#fff;
  --yms-muted:rgba(255,255,255,.45);
  --yms-ease:cubic-bezier(.76,0,.24,1);
}
html.yms-loading,
html.yms-menu-open{overflow:hidden}

/* ---------------- LOADER ---------------- */
.yms-loader{
  position:fixed;inset:0;z-index:100000;background:var(--yms-ink);color:var(--yms-paper);
  display:flex;flex-direction:column;justify-content:space-between;
  padding:clamp(20px,4vw,48px);
  clip-path:inset(0 0 0 0);
  transition:clip-path 1.1s var(--yms-ease);
}
.yms-loader.is-done{clip-path:inset(0 0 100% 0)}
.yms-loader__logo{width:clamp(120px,14vw,190px);height:auto;opacity:.9}
.yms-loader__bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}
.yms-loader__label{font-size:12px;letter-spacing:.3em;color:var(--yms-muted)}
.yms-loader__label span{display:block;margin-top:6px;color:var(--yms-paper)}
.yms-counter{display:flex;font-size:clamp(80px,18vw,240px);font-weight:500;line-height:1;letter-spacing:-.04em}
.yms-counter__col{height:1em;overflow:hidden}
.yms-counter__strip{display:flex;flex-direction:column;transition:transform .6s var(--yms-ease)}
.yms-counter__strip span{height:1em;display:block}
.yms-counter__pct{font-size:.25em;align-self:flex-start;margin-left:.15em;margin-top:.2em;color:var(--yms-muted)}
.yms-loader__bar{position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--yms-paper);
  transform:scaleX(0);transform-origin:left;transition:transform .6s var(--yms-ease)}

/* ---------------- BURGER ---------------- */
.yms-burger{
  position:fixed;top:var(--yms-burger-top,28px);right:var(--yms-burger-side,clamp(20px,4vw,48px));z-index:99991;
  background:none;border:0;padding:8px 0;margin:0;cursor:pointer;color:#fff;
  display:flex;align-items:center;gap:14px;
  font:500 13px/1 inherit;font-family:inherit;letter-spacing:.25em;
  mix-blend-mode:difference; /* stays visible on light & dark sections */
}
html.yms-menu-open .yms-burger{mix-blend-mode:normal}
.yms-burger__txt{height:1em;overflow:hidden;display:block}
.yms-burger__txt > span{display:flex;flex-direction:column;transition:transform .6s var(--yms-ease)}
.yms-burger__txt i{font-style:normal;height:1em;display:block}
html.yms-menu-open .yms-burger__txt > span{transform:translateY(-1em)}
.yms-burger__lines{width:34px;height:12px;position:relative;display:block}
.yms-burger__lines::before,.yms-burger__lines::after{content:"";position:absolute;left:0;width:100%;height:1.5px;background:currentColor;
  transition:transform .6s var(--yms-ease),top .6s var(--yms-ease)}
.yms-burger__lines::before{top:0}
.yms-burger__lines::after{top:10px}
html.yms-menu-open .yms-burger__lines::before{top:5px;transform:rotate(45deg)}
html.yms-menu-open .yms-burger__lines::after{top:5px;transform:rotate(-45deg)}
.yms-burger:focus-visible{outline:1px solid currentColor;outline-offset:6px}

/* ---------------- MENU OVERLAY ---------------- */
.yms-menu{
  position:fixed;inset:0;z-index:99990;background:var(--yms-ink);color:var(--yms-paper);
  display:flex;flex-direction:column;justify-content:space-between;
  padding:120px clamp(20px,4vw,48px) clamp(20px,4vw,48px);
  clip-path:inset(0 0 100% 0);visibility:hidden;
  transition:clip-path .9s var(--yms-ease),visibility 0s .9s;
}
html.yms-menu-open .yms-menu{clip-path:inset(0 0 0 0);visibility:visible;transition:clip-path .9s var(--yms-ease),visibility 0s}

.yms-menu__list{list-style:none;margin:0;padding:0}
.yms-menu__list li{border-bottom:1px solid rgba(255,255,255,.12);margin:0}
.yms-menu__list a{display:flex;align-items:flex-start;gap:clamp(12px,2vw,28px);color:var(--yms-paper);text-decoration:none;
  padding:clamp(6px,1.2vh,14px) 0}
.yms-menu__num{font-size:13px;letter-spacing:.1em;color:var(--yms-muted);padding-top:.9em;min-width:2ch;
  opacity:0;transform:translateY(10px);transition:opacity .5s,transform .6s var(--yms-ease)}
.yms-menu__label{font-size:clamp(44px,9vw,120px);font-weight:500;line-height:1;letter-spacing:-.03em;text-transform:uppercase;display:flex;flex-wrap:wrap}

/* split chars: 1em window, 2 stacked copies (reveal + hover roll) */
.yms-menu .ch{display:inline-block;height:1em;overflow:hidden}
.yms-menu .ch__in{display:flex;flex-direction:column;transform:translateY(50%);transition:transform .8s var(--yms-ease)}
.yms-menu .ch__in i{font-style:normal;height:1em;display:block}
html.yms-menu-open .yms-menu .ch__in{transform:translateY(0)}
html.yms-menu-open .yms-menu__num{opacity:1;transform:none}
@media (hover:hover){
  html.yms-menu-open .yms-menu__list a:hover .ch__in{transform:translateY(-50%);transition-duration:.55s}
}

.yms-menu__foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;font-size:14px;color:var(--yms-muted);
  opacity:0;transition:opacity .4s}
html.yms-menu-open .yms-menu__foot{opacity:1;transition:opacity .6s .7s}
.yms-menu__foot a{color:var(--yms-paper);text-decoration:none}

/* ---------------- SERVICE ICONS (in .yms-row__tick) — tile ---------------- */
.yms-home .yms-row .yms-row__tick{
  flex:none;align-self:center;display:grid;place-items:center;
  width:1em;height:1em;border-radius:.22em;
  background:rgba(143,165,176,.22);color:var(--yms-foam,#eef2f1);
  transform:none;
  transition:background .5s var(--yms-ease),color .4s,transform .7s var(--yms-ease);
}
.yms-home .yms-row .yms-row__tick svg.yms-icon{
  width:.52em;height:.52em;display:block;overflow:visible;
  fill:none!important;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;
}
@media (hover:hover){
  .yms-home .yms-row:hover .yms-row__tick{
    background:var(--yms-steel,#8fa5b0);color:var(--yms-navy,#0c0c0c);transform:scale(1.06);
  }
}
.yms-icon *{transform-box:fill-box;transform-origin:center}

/* draw-on when the row scrolls into view */
.yms-icon [pathLength]{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.4s var(--yms-ease)}
.yms-row.is-in .yms-icon [pathLength],
html:not(.yms-ui-js) .yms-icon [pathLength]{stroke-dashoffset:0}
.yms-row.is-in .yms-icon [pathLength]:nth-child(2){transition-delay:.12s}
.yms-row.is-in .yms-icon [pathLength]:nth-child(3){transition-delay:.24s}
.yms-row.is-in .yms-icon [pathLength]:nth-child(n+4){transition-delay:.36s}

/* hover micro-motions */
@keyframes yms-bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-1.2px) rotate(-3deg)}}
@keyframes yms-swing{0%,100%{transform:rotate(0)}30%{transform:rotate(12deg)}70%{transform:rotate(-10deg)}}
@keyframes yms-spin{to{transform:rotate(360deg)}}
.yms-row:hover .i-tug{animation:yms-bob 1.4s ease-in-out infinite}
.yms-icon .i-buoy{transition:transform .9s var(--yms-ease)}
.yms-row:hover .i-buoy{transform:rotate(90deg)}
.yms-icon .i-anchor{transform-origin:50% 0}
.yms-row:hover .i-anchor{animation:yms-swing 1.2s ease-in-out}
.yms-icon .i-wrench{transition:transform .7s var(--yms-ease)}
.yms-row:hover .i-wrench{transform:rotate(-35deg)}
.yms-icon .i-hand{transform-box:view-box;transform-origin:12px 12px}
.yms-row:hover .i-hand{animation:yms-spin 1.6s var(--yms-ease)}

@media (prefers-reduced-motion:reduce){
  .yms-loader,.yms-loader *,.yms-menu,.yms-menu *,.yms-burger *,.yms-icon,.yms-icon *{
    transition-duration:.01ms!important;animation:none!important;
  }
}

/* ---------------- CONTACT (homepage) ---------------- */
.yms-home .yms-contact--v2{
  position:relative;overflow:hidden;isolation:isolate;
  padding:clamp(5rem,12vw,10rem) 0 clamp(3rem,7vw,6rem);
  background:#040d4f;color:#fff;
}
.yms-contact--v2 .yms-contact__glow{
  position:absolute;z-index:-1;inset:auto -20% -60% auto;width:min(1100px,120vw);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(closest-side,rgba(63,132,226,.55),rgba(16,33,194,.25) 55%,transparent 75%);
  filter:blur(20px);pointer-events:none;
}
.yms-contact--v2 .yms-contact__top{
  display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(1rem,2.5vw,2rem);row-gap:2rem;align-items:end;
  margin-bottom:clamp(3rem,7vw,6rem);
}
.yms-contact--v2 .yms-contact__title{
  grid-column:1 / 8;margin:0;
  font-size:clamp(3.2rem,10vw,9.5rem);font-weight:600;line-height:.9;letter-spacing:-.045em;text-transform:none;color:#fff;
}
.yms-contact--v2 .yms-contact__title .yms-line:nth-child(2) .yms-line-in{color:rgba(255,255,255,.4);font-weight:300}
.yms-contact__pulse{
  position:relative;display:inline-block;width:.14em;height:.14em;border-radius:50%;margin-left:.2em;vertical-align:.14em;
  background:#3ddc84;
}
.yms-contact__pulse::after{
  content:"";position:absolute;inset:0;border-radius:50%;background:#3ddc84;
  animation:yms-pulse 2s ease-out infinite;
}
@keyframes yms-pulse{0%{transform:scale(1);opacity:.6}80%,100%{transform:scale(2.6);opacity:0}}
.yms-contact--v2 .yms-contact__text{
  grid-column:8 / -1;margin:0;max-width:34ch;
  font-size:clamp(1rem,1.25vw,1.15rem);line-height:1.65;color:rgba(255,255,255,.72);
}

.yms-contact__ctas{border-bottom:1px solid rgba(255,255,255,.18)}
.yms-cta{
  position:relative;display:flex;align-items:center;gap:clamp(1rem,3vw,2.5rem);
  padding:clamp(1.25rem,3vw,2.25rem) clamp(.25rem,1vw,1rem);
  border-top:1px solid rgba(255,255,255,.18);
  color:#fff;text-decoration:none;overflow:hidden;isolation:isolate;
}
.yms-cta::before{
  content:"";position:absolute;inset:0;z-index:-1;background:#fff;
  transform:scaleY(0);transform-origin:bottom;transition:transform .6s var(--yms-ease);
}
.yms-cta__icon,.yms-cta__arrow{flex:none;display:grid;place-items:center;border-radius:50%;
  transition:background .5s var(--yms-ease),border-color .5s var(--yms-ease),transform .6s var(--yms-ease),color .4s}
.yms-cta__icon{width:clamp(44px,5vw,64px);height:clamp(44px,5vw,64px);border:1px solid rgba(255,255,255,.25)}
.yms-cta__arrow{margin-left:auto;width:clamp(44px,5vw,64px);height:clamp(44px,5vw,64px);background:#fff;color:#040d4f}
.yms-cta svg{width:42%;height:42%;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.yms-cta__txt{
  font-size:clamp(1.5rem,4.6vw,4.2rem);font-weight:500;letter-spacing:-.03em;line-height:1.05;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;
  transition:color .4s,transform .6s var(--yms-ease);
}
@media (hover:hover){
  .yms-cta:hover::before{transform:scaleY(1)}
  .yms-cta:hover{color:#040d4f}
  .yms-cta:hover .yms-cta__txt{transform:translateX(.35em)}
  .yms-cta:hover .yms-cta__icon{border-color:rgba(4,13,79,.25)}
  .yms-cta:hover .yms-cta__arrow{background:#040d4f;color:#fff;transform:rotate(45deg)}
}
.yms-cta:focus-visible{outline:2px solid #3f84e2;outline-offset:-2px}

@media (max-width:900px){
  .yms-contact--v2 .yms-contact__title,
  .yms-contact--v2 .yms-contact__text{grid-column:1 / -1}
}
@media (max-width:520px){
  .yms-cta__icon{display:none}
  .yms-cta__txt{font-size:clamp(1.15rem,6.4vw,1.6rem)}
}
@media (prefers-reduced-motion:reduce){
  .yms-contact__pulse::after{animation:none}
}

/* ---------------- FOOTER WORDMARK ---------------- */
.yms-wordmark{
  background:none;color:inherit;overflow:hidden;
  padding:clamp(2.5rem,6vw,5rem) clamp(12px,1.6vw,24px) clamp(1rem,2.5vw,2rem);
}
.yms-wordmark__inner{width:100%}
.yms-wordmark__row{
  display:block;width:max-content;white-space:nowrap;
  font-family:Manrope,system-ui,sans-serif;font-weight:800;letter-spacing:-.045em;
  line-height:.82;text-transform:uppercase;
  font-size:9vw; /* overwritten by JS fit */
}
.yms-wordmark__row + .yms-wordmark__row{margin-top:.04em}
.yms-wm-ch{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em;margin-bottom:-.06em}
.yms-wm-ch > span{display:inline-block;transform:translateY(105%);
  transition:transform 1.2s var(--yms-ease),color .5s}
.yms-wordmark.is-in .yms-wm-ch > span{transform:none}
@media (hover:hover){
  .yms-wm-ch:hover > span{color:#8fa5b0;transition:transform 1.2s var(--yms-ease),color .15s}
}
html:not(.yms-ui-js) .yms-wm-ch > span{transform:none}
@media (prefers-reduced-motion:reduce){
  .yms-wm-ch > span{transform:none!important;transition:none!important}
}

/* ---------------- MOBILE CALL BAR ---------------- */
.yms-callbar{display:none}
@media (max-width:899px){
  .yms-callbar{
    position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:9000;
    display:flex;gap:8px;
    transform:translateY(160%);transition:transform .6s var(--yms-ease);
  }
  .yms-callbar.is-visible{transform:none}
  html.yms-menu-open .yms-callbar,html.yms-loading .yms-callbar{transform:translateY(160%)}
  .yms-callbar a{
    display:flex;align-items:center;justify-content:center;gap:10px;height:56px;border-radius:999px;
    text-decoration:none;font:600 15px/1 Manrope,system-ui,sans-serif;letter-spacing:.02em;
    box-shadow:0 10px 30px rgba(0,0,0,.35);
  }
  .yms-callbar__call{flex:1;background:#fff;color:#040d4f}
  .yms-callbar__mail{width:56px;flex:none;background:#040d4f;color:#fff;border:1px solid rgba(255,255,255,.2)}
  .yms-callbar svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
  .yms-callbar__dot{width:8px;height:8px;border-radius:50%;background:#2fbf6f;position:relative}
  .yms-callbar__dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:#2fbf6f;animation:yms-pulse 2s ease-out infinite}
  /* old round phone button is replaced by the bar on mobile */
  .callnow{display:none!important}
  .site-footer{padding-bottom:84px}
}

/* ---------------- PAGES (About etc.) ---------------- */
.yms-page{padding:clamp(3rem,8vw,7rem) 0}
.yms-page__grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(1rem,2.5vw,2rem)}
.yms-page__label{grid-column:1 / 4;display:flex;flex-direction:column;gap:.4rem;
  font-size:12px;letter-spacing:.22em;text-transform:uppercase;opacity:.55;align-self:start;position:sticky;top:120px}
.yms-prose{grid-column:4 / -1;max-width:56rem}
.yms-prose > *:first-child{margin-top:0}
.yms-prose p{font-size:clamp(1.05rem,1.3vw,1.25rem);line-height:1.75;margin:0 0 1.4em;opacity:.85}
.yms-prose p:empty,.yms-prose p:has(> br:only-child){display:none}
.yms-prose p:first-of-type{font-size:clamp(1.5rem,2.8vw,2.5rem);line-height:1.3;letter-spacing:-.02em;font-weight:500;opacity:1}
.yms-prose img{display:block;width:100%;height:auto;max-height:70vh;object-fit:cover;border-radius:6px;margin:0 0 clamp(2rem,4vw,3.5rem)}
.yms-prose h2,.yms-prose h3{font-weight:600;letter-spacing:-.02em;line-height:1.15;margin:2em 0 .6em}
.yms-prose a{color:inherit;text-decoration:underline;text-underline-offset:.2em}
@media (max-width:899px){
  .yms-page__label{display:none}
  .yms-prose{grid-column:1 / -1}
}

/* ---------------- CONTACT PAGE ---------------- */
.yms-contactpage--v2 .yms-info,
.yms-contactpage--v2 .yms-form{grid-column:1 / -1}
.yms-contactpage--v2 .yms-form{margin-top:clamp(2.5rem,5vw,4rem)}
.yms-info--v2{margin:0;border-bottom:1px solid color-mix(in srgb,currentColor 18%,transparent)}
.yms-info__row{
  position:relative;display:flex;align-items:center;gap:clamp(1rem,3vw,2.5rem);
  padding:clamp(1.25rem,2.6vw,2rem) clamp(.25rem,1vw,1rem);
  border-top:1px solid color-mix(in srgb,currentColor 18%,transparent);
  color:inherit;text-decoration:none;isolation:isolate;overflow:hidden;
}
a.yms-info__row::before{content:"";position:absolute;inset:0;z-index:-1;background:currentColor;opacity:.06;
  transform:scaleY(0);transform-origin:bottom;transition:transform .6s var(--yms-ease)}
.yms-info__icon,.yms-info__arrow{flex:none;display:grid;place-items:center;border-radius:50%;
  width:clamp(44px,4.6vw,60px);height:clamp(44px,4.6vw,60px);transition:transform .6s var(--yms-ease)}
.yms-info__icon{border:1px solid color-mix(in srgb,currentColor 25%,transparent)}
.yms-info__arrow{margin-left:auto;border:1px solid color-mix(in srgb,currentColor 25%,transparent)}
.yms-info__row svg{width:42%;height:42%;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.yms-info__body{display:flex;flex-direction:column;gap:.45rem;min-width:0}
.yms-info__label{font-size:12px;letter-spacing:.22em;text-transform:uppercase;opacity:.55}
.yms-info__value{font-size:clamp(1.3rem,3.4vw,3rem);font-weight:500;letter-spacing:-.025em;line-height:1.1;
  overflow-wrap:anywhere;transition:transform .6s var(--yms-ease)}
@media (hover:hover){
  a.yms-info__row:hover::before{transform:scaleY(1)}
  a.yms-info__row:hover .yms-info__value{transform:translateX(.3em)}
  a.yms-info__row:hover .yms-info__arrow{transform:rotate(45deg)}
}
@media (max-width:520px){ .yms-info__icon{display:none} }

.yms-map--v2 iframe{display:block;filter:grayscale(1) contrast(1.05);transition:filter .6s}
.yms-map--v2:hover iframe{filter:none}
@media (max-width:899px){ #myBtn{bottom:84px!important} }