/* Frogmen polish layer: natural hero slideshow, soft service pages, animated icon buttons. */
:root{--fm-soft-bg:#f6f9fc;--fm-soft-tint:#eef4fb;--fm-soft-line:rgba(16,38,68,.08);--fm-soft-shadow:0 24px 60px -28px rgba(16,38,68,.28);--fm-radius-lg:28px;--fm-radius-md:20px}

/* ---------- Home hero: full-bleed natural background slideshow ---------- */
.fm-hero{position:relative;max-width:none;margin:12px 16px 0;border:0;border-radius:var(--fm-radius-lg);background:#0a1a2e;overflow:hidden;isolation:isolate;height:clamp(560px,calc(100svh - 128px),820px)}
.fm-hero .fm-slides{position:absolute;inset:0}
.fm-hero .fm-slide{position:absolute;inset:0;display:block;height:auto;min-height:0;opacity:0;visibility:hidden;transition:opacity 1.4s ease,visibility 0s 1.4s}
.fm-hero .fm-slide.is-active{opacity:1;visibility:visible;transition:opacity 1.4s ease,visibility 0s}
.fm-hero .fm-slide-media{position:absolute;inset:0;min-height:0;background:#0a1a2e}
.fm-hero .fm-slide-media img{transform:scale(1.08);transition:transform 9s cubic-bezier(.25,.1,.25,1)}
.fm-hero .fm-slide.is-active .fm-slide-media img{transform:scale(1)}
.fm-hero .fm-slide-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,18,36,.78) 0%,rgba(6,18,36,.45) 42%,rgba(6,18,36,.05) 75%),linear-gradient(0deg,rgba(6,18,36,.55) 0%,transparent 35%)}
.fm-hero .fm-slide-copy{position:relative;z-index:2;height:100%;max-height:none;overflow:visible;display:flex;flex-direction:column;justify-content:center;max-width:680px;padding:0 clamp(24px,6vw,96px) 70px}
.fm-hero .fm-slide-copy>*{opacity:0;transform:translateY(18px);transition:opacity .9s var(--fm-ease),transform .9s var(--fm-ease)}
.fm-hero .fm-slide.is-active .fm-slide-copy>*{opacity:1;transform:none}
.fm-hero .fm-slide.is-active .fm-slide-copy>:nth-child(2){transition-delay:.12s}
.fm-hero .fm-slide.is-active .fm-slide-copy>:nth-child(3){transition-delay:.24s}
.fm-hero .fm-slide.is-active .fm-slide-copy>:nth-child(4){transition-delay:.36s}
.fm-hero .fm-slide-copy .eyebrow{color:#9fd3ff;margin-bottom:22px;display:inline-flex;align-items:center;gap:12px}
.fm-hero .fm-slide-copy .eyebrow::before{content:"";width:28px;height:1px;background:currentColor}
.fm-hero .fm-slide-copy h1,.fm-hero .fm-slide-copy h2{color:#fff;font-size:clamp(42px,6vw,88px);font-weight:600;letter-spacing:-.04em;line-height:1.02;text-wrap:balance}
.fm-hero .fm-slide-intro{color:rgba(255,255,255,.82);font-size:17px;max-width:500px}
.fm-hero .fm-slide-copy .button{align-self:flex-start;background:#fff;color:#0d2442;box-shadow:0 14px 34px -12px rgba(0,0,0,.45);border-radius:999px;padding:8px 8px 8px 26px;gap:16px;min-height:54px;font-size:14px}
.fm-hero .fm-slide-copy .button:hover{background:#fff;box-shadow:0 18px 44px -12px rgba(0,0,0,.55)}
.fm-hero .fm-slide-copy .button .fm-icon{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--fm-blue-deep),var(--fm-blue));color:#fff}
.fm-hero .fm-slide-bottom{position:absolute;z-index:3;left:0;right:0;bottom:0;padding:0 clamp(24px,6vw,96px) 30px;background:none;border:0;align-items:flex-end}
.fm-hero .fm-slide-bottom p{color:rgba(255,255,255,.62);font-size:10.5px}
.fm-hero .fm-slide-bottom p span{color:rgba(255,255,255,.3)}
.fm-hero .fm-slide-controls{gap:18px;align-items:center}
.fm-hero .fm-dot{all:unset;cursor:pointer;display:grid;gap:9px;width:clamp(56px,7vw,96px);color:rgba(255,255,255,.55);font:600 11px/1 var(--fm-font-body);letter-spacing:.12em;transition:color .3s}
.fm-hero .fm-dot b{font-weight:600}
.fm-hero .fm-dot i{display:block;height:2px;border-radius:2px;background:rgba(255,255,255,.25);overflow:hidden}
.fm-hero .fm-dot em{display:block;height:100%;width:0;background:#fff}
.fm-hero .fm-dot.is-active{color:#fff}
.fm-hero .fm-dot.is-active em{width:100%}
.fm-hero.is-running .fm-dot.is-active em{animation:fm-progress var(--fm-interval,7000ms) linear both}
.fm-hero .fm-dot:hover{color:#fff}
.fm-hero .fm-dot:focus-visible,.fm-hero .fm-pause:focus-visible{outline:2px solid #9fd3ff;outline-offset:6px;border-radius:4px}
.fm-hero .fm-pause{all:unset;cursor:pointer;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);backdrop-filter:blur(6px);transition:background .3s,transform .3s var(--fm-ease)}
.fm-hero .fm-pause:hover{background:rgba(255,255,255,.2);transform:scale(1.06)}
.fm-hero .fm-pause span{width:10px;height:11px;border-left:3px solid #fff;border-right:3px solid #fff;box-sizing:border-box}
.fm-hero .fm-pause.is-play span{width:0;height:0;border:0;border-left:10px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent;margin-left:3px}
@keyframes fm-progress{from{width:0}to{width:100%}}
@media(max-width:900px){
 .fm-hero{margin:8px 10px 0;border-radius:20px;height:clamp(540px,calc(100svh - 104px),720px)}
 .fm-hero .fm-slide-media::after{background:linear-gradient(0deg,rgba(6,18,36,.85) 0%,rgba(6,18,36,.45) 55%,rgba(6,18,36,.2) 100%)}
 .fm-hero .fm-slide-copy{justify-content:flex-end;padding:0 22px 96px}
 .fm-hero .fm-slide-copy h1,.fm-hero .fm-slide-copy h2{font-size:clamp(38px,10vw,54px)}
 .fm-hero .fm-slide-intro{font-size:15px}
 .fm-hero .fm-slide-bottom{padding:0 22px 24px}
 .fm-hero .fm-slide-bottom p{display:none}
 .fm-hero .fm-slide-controls{margin:0;width:100%}
 .fm-hero .fm-dot{flex:1;width:auto}
}

/* ---------- Animated icon buttons (Lottie-style micro motion) ---------- */
.button>span[aria-hidden="true"]:not(:empty),a>span.fm-icon,a>i[aria-hidden="true"]:not(:empty):not(.cart-count),.fm-icon{display:inline-grid;place-items:center;position:relative;overflow:hidden;width:30px;height:30px;flex:none;border-radius:50%;line-height:1;font-style:normal;transition:transform .45s var(--fm-ease),background-color .3s}
.button-primary>span[aria-hidden="true"]:not(:empty){background:rgba(255,255,255,.16)}
.button-outline>span[aria-hidden="true"]:not(:empty),.button-light>span[aria-hidden="true"]:not(:empty){background:var(--fm-soft-tint);color:var(--fm-blue)}
.button{transition:transform .35s var(--fm-ease),box-shadow .35s var(--fm-ease),background-color .35s ease,color .35s ease}
.button:hover{transform:translateY(-2px)}
.button:active{transform:translateY(0) scale(.98)}
a:hover>span[aria-hidden="true"]:not(:empty),a:focus-visible>span[aria-hidden="true"]:not(:empty),a:hover>i[aria-hidden="true"]:not(:empty):not(.cart-count),a:focus-visible>i[aria-hidden="true"]:not(:empty):not(.cart-count),button:hover>span.fm-icon{animation:fm-icon-fly .7s var(--fm-ease) both}
a:hover>.fm-icon svg,a:focus-visible>.fm-icon svg{animation:fm-icon-ring .8s ease both}
a.fm-tel:hover>.fm-icon{animation:none}
@keyframes fm-icon-fly{0%{transform:none}35%{transform:translate(9px,-9px) scale(.85);opacity:0}36%{transform:translate(-9px,9px) scale(.85);opacity:0}70%{transform:translate(1px,-1px) scale(1.12);opacity:1}100%{transform:none;opacity:1}}
@keyframes fm-icon-ring{0%,100%{transform:rotate(0)}20%{transform:rotate(-14deg)}40%{transform:rotate(12deg)}60%{transform:rotate(-8deg)}80%{transform:rotate(4deg)}}
.button-primary::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.28) 50%,transparent 70%);transform:translateX(-120%);pointer-events:none}
.button-primary{position:relative;overflow:hidden}
.button-primary:hover::after{transform:translateX(120%);transition:transform .9s var(--fm-ease)}

/* ---------- Service pages: soft, editorial redesign ---------- */
.fm-service-page{background:var(--fm-soft-bg)}
.fm-service-page .page-hero{position:relative;display:grid;grid-template-columns:1fr;place-items:end start;min-height:clamp(480px,72vh,680px);margin:100px 16px 0;padding:0;border:0;border-radius:var(--fm-radius-lg);overflow:hidden;background:#0d2240;text-align:left;isolation:isolate}
.fm-service-page .page-hero-image{position:absolute;inset:0;max-width:none;aspect-ratio:auto;border-radius:0;box-shadow:none;z-index:-1}
.fm-service-page .page-hero-image img{animation:fm-slow-zoom 14s ease-out both}
.fm-service-page .page-hero-image::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,22,42,.7),rgba(8,22,42,.1) 60%),linear-gradient(90deg,rgba(8,22,42,.35),transparent 60%)}
.fm-service-page .page-hero-copy{margin:clamp(20px,4vw,56px);max-width:640px;padding:clamp(26px,3.4vw,44px);border-radius:var(--fm-radius-md);background:rgba(255,255,255,.86);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);box-shadow:var(--fm-soft-shadow);border:1px solid rgba(255,255,255,.6)}
.fm-service-page .page-hero.has-image .page-hero-copy h1,.fm-service-page .page-hero-copy h1{font-size:clamp(32px,4vw,56px);font-weight:600;line-height:1.08;letter-spacing:-.035em;color:#0d2442}
.fm-service-page .page-hero-copy>p:last-child{margin:18px 0 0;font-size:16px;color:#4f6178}
.fm-service-page .page-hero:not(.has-image){background:linear-gradient(140deg,#e7f0fa,#f8fbfe);place-items:center start}
.fm-service-page .page-hero:not(.has-image) .page-hero-copy{background:none;box-shadow:none;backdrop-filter:none;border:0}
@keyframes fm-slow-zoom{from{transform:scale(1.1)}to{transform:scale(1)}}

.fm-service-page .fm-service-tabs{position:sticky;top:96px;z-index:20;margin:-34px auto 0;width:max-content;max-width:calc(100% - 32px);padding:6px;gap:4px;border:1px solid var(--fm-soft-line);border-radius:999px;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 14px 40px -18px rgba(16,38,68,.3);scrollbar-width:none}
.fm-service-page .fm-service-tabs::-webkit-scrollbar{display:none}
.fm-service-page .fm-service-tabs a{border:0;border-radius:999px;padding:11px 18px;font-size:13px;font-weight:600;color:#4a5f78;transition:background .3s,color .3s}
.fm-service-page .fm-service-tabs a:hover{background:var(--fm-soft-tint);color:#0d2442}
.fm-service-page .fm-service-tabs a[aria-current=page]{background:#0d2442;color:#fff}

.fm-service-page .native-content-system{display:grid;grid-template-columns:minmax(260px,.75fr) 2fr;gap:clamp(32px,5vw,80px);max-width:1320px;margin:0 auto;padding-top:clamp(70px,8vw,120px)}
.fm-service-page .native-content-heading{position:sticky;top:180px;align-self:start;margin:0;display:block}
.fm-service-page .native-content-heading h2{font-size:clamp(28px,2.8vw,40px);font-weight:600;letter-spacing:-.03em;line-height:1.15;color:#0d2442;margin:0 0 18px}
.fm-service-page .native-content-heading>p{color:#5b6e85;margin:0;padding-top:18px;border-top:1px solid var(--fm-soft-line)}
.fm-service-page .native-content-service .native-content-grid{display:grid;gap:18px;border:0;counter-reset:fmcard}
.fm-service-page .native-content-service .native-content-card{position:relative;display:grid;grid-template-columns:1fr;gap:16px;padding:clamp(26px,3vw,40px);background:#fff;border:1px solid var(--fm-soft-line);border-radius:var(--fm-radius-md);box-shadow:0 1px 2px rgba(16,38,68,.04);transition:box-shadow .5s var(--fm-ease),transform .5s var(--fm-ease),border-color .4s}
.fm-service-page .native-content-service .native-content-card:hover{transform:translateY(-3px);box-shadow:var(--fm-soft-shadow);border-color:rgba(11,95,255,.16)}
.fm-service-page .native-content-service .native-content-card:nth-child(even){background:linear-gradient(160deg,#fff 40%,#f1f7fd)}
.fm-service-page .native-content-service .native-card-index{display:flex;align-items:center;gap:14px}
.fm-service-page .native-content-service .native-card-index span{width:auto;height:auto;border:0;border-radius:999px;padding:7px 12px;background:var(--fm-soft-tint);color:var(--fm-blue);font-size:11px;font-weight:700;letter-spacing:.14em}
.fm-service-page .native-content-service .native-card-index i{display:block;flex:1;height:1px;background:linear-gradient(90deg,var(--fm-soft-line),transparent)}
.fm-service-page .native-content-service .native-content-card>h2{font-size:clamp(21px,1.9vw,27px);font-weight:600;letter-spacing:-.02em;color:#0d2442}
.fm-service-page .native-rich-text{grid-column:auto;color:#4f6178;font-size:15.5px;line-height:1.85}
.fm-service-page .native-rich-text ul{list-style:none;padding:0;display:grid;gap:10px}
.fm-service-page .native-rich-text li{position:relative;padding:12px 16px 12px 44px;border-radius:12px;background:var(--fm-soft-bg)}
.fm-service-page .native-rich-text li::before{content:"";position:absolute;left:16px;top:19px;width:14px;height:8px;border-left:2px solid var(--fm-blue);border-bottom:2px solid var(--fm-blue);transform:rotate(-45deg)}
.fm-service-page .native-rich-text strong{color:#0d2442}
.fm-service-page .native-rich-text img{border-radius:16px}
.fm-service-page .native-content-service .is-faq{background:#fff}
.fm-service-page .native-accordion .faq-item{border-radius:14px;border:1px solid var(--fm-soft-line);margin-bottom:10px;background:var(--fm-soft-bg);overflow:hidden}
.fm-service-page .native-accordion .faq-item.is-open{background:#fff;box-shadow:0 12px 30px -20px rgba(16,38,68,.35)}

.fm-service-page .service-command-band{max-width:1320px;margin:clamp(40px,5vw,72px) auto;padding:clamp(32px,5vw,64px);border-radius:var(--fm-radius-lg);background:radial-gradient(circle at 85% 10%,rgba(11,95,255,.12),transparent 45%),linear-gradient(140deg,#ffffff,#eaf2fb);border:1px solid var(--fm-soft-line);box-shadow:var(--fm-soft-shadow)}
.fm-service-page .service-command-copy h2{font-weight:600;letter-spacing:-.03em;color:#0d2442}
.fm-service-page .service-command-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.fm-service-page .fm-tel{display:inline-flex;align-items:center;gap:10px;padding:8px 18px 8px 8px;border-radius:999px;background:#fff;border:1px solid var(--fm-soft-line);color:#0d2442;font-weight:600;text-decoration:none;transition:box-shadow .3s,transform .3s var(--fm-ease)}
.fm-service-page .fm-tel:hover{transform:translateY(-2px);box-shadow:0 12px 30px -16px rgba(16,38,68,.4)}
.fm-service-page .fm-tel .fm-icon{width:36px;height:36px;background:var(--fm-soft-tint);color:var(--fm-blue)}
.fm-service-page .service-command-navigation{border:0;border-radius:var(--fm-radius-md);padding:10px;background:rgba(255,255,255,.75);backdrop-filter:blur(10px)}
.fm-service-page .service-command-navigation>p{padding:14px 16px 6px;margin:0;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#7a8ba0}
.fm-service-page .service-command-navigation a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-radius:14px;border:0;color:#0d2442;text-decoration:none;transition:background .3s,padding .4s var(--fm-ease)}
.fm-service-page .service-command-navigation a:hover{background:#fff;padding-left:22px}
.fm-service-page .service-command-navigation a i{background:var(--fm-soft-tint);color:var(--fm-blue)}
.fm-service-page .cta-band{margin:0 16px 16px;border-radius:var(--fm-radius-lg)}

@media(max-width:900px){
 .fm-service-page .page-hero{margin:88px 10px 0;min-height:520px;border-radius:20px}
 .fm-service-page .page-hero-copy{margin:12px;padding:22px}
 .fm-service-page .fm-service-tabs{top:84px;margin-top:-26px}
 .fm-service-page .native-content-system{grid-template-columns:1fr;gap:28px;padding-left:16px;padding-right:16px}
 .fm-service-page .native-content-heading{position:static}
 .fm-service-page .service-command-band{margin:32px 10px;padding:26px 20px}
 .fm-service-page .cta-band{margin:0 10px 10px}
}

@media(prefers-reduced-motion:reduce){
 .fm-hero .fm-slide,.fm-hero .fm-slide-media img,.fm-hero .fm-slide-copy>*{transition:none!important}
 .fm-hero .fm-slide-media img,.fm-service-page .page-hero-image img{transform:none;animation:none}
 .fm-hero.is-running .fm-dot.is-active em,a:hover>span[aria-hidden="true"],a:hover>i[aria-hidden="true"],a:hover>.fm-icon svg{animation:none!important}
 .button:hover,.fm-service-page .native-content-service .native-content-card:hover{transform:none}
}

/* ---------- Header navigation icons with Lottie-style hover motion ---------- */
.primary-menu a,.cart-link{display:inline-flex;align-items:center;gap:9px}
.primary-menu>li>a{display:flex}
.fm-nav-icon{display:inline-grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:var(--fm-soft-tint,#eef4fb);color:var(--fm-blue);transition:background-color .35s ease,color .35s ease,transform .45s var(--fm-ease)}
.fm-nav-icon svg{overflow:visible;transform-origin:50% 50%}
.fm-nav-icon svg *{stroke-dasharray:1;stroke-dashoffset:0}
.sub-menu .fm-nav-icon{width:32px;height:32px;border-radius:10px;background:#f2f6fb}
.sub-menu a{display:flex;align-items:center;gap:12px}
.cart-link{padding:6px 6px 6px 6px;border-radius:999px;transition:background-color .3s}
.cart-link:hover{background:var(--fm-soft-tint,#eef4fb)}
.cart-link .fm-nav-label{margin-right:2px}

/* draw-on + spring pop, triggered on hover or keyboard focus */
a:hover>.fm-nav-icon,a:focus-visible>.fm-nav-icon{background:var(--fm-blue);color:#fff;animation:fm-nav-pop .6s cubic-bezier(.34,1.56,.64,1) both}
a:hover>.fm-nav-icon svg *,a:focus-visible>.fm-nav-icon svg *{animation:fm-nav-draw .75s cubic-bezier(.65,0,.35,1) both}
a:hover>.fm-nav-icon svg :nth-child(2),a:focus-visible>.fm-nav-icon svg :nth-child(2){animation-delay:.08s}
a:hover>.fm-nav-icon svg :nth-child(3),a:focus-visible>.fm-nav-icon svg :nth-child(3){animation-delay:.16s}
a:hover>.fm-nav-icon svg :nth-child(n+4),a:focus-visible>.fm-nav-icon svg :nth-child(n+4){animation-delay:.24s}
@keyframes fm-nav-draw{0%{stroke-dashoffset:1}100%{stroke-dashoffset:0}}
@keyframes fm-nav-pop{0%{transform:scale(1)}40%{transform:scale(.82)}75%{transform:scale(1.12)}100%{transform:scale(1)}}

/* per-icon personality */
a:hover>.fm-nav-icon-services svg,a:hover>.fm-nav-icon-rescue svg,a:hover>.fm-nav-icon-position svg{animation:fm-nav-spin .9s cubic-bezier(.34,1.3,.64,1) both}
a:hover>.fm-nav-icon-contact svg,a:hover>.fm-nav-icon-bag svg{animation:fm-nav-wiggle .7s ease both}
a:hover>.fm-nav-icon-scooter svg,a:hover>.fm-nav-icon-drone svg,a:hover>.fm-nav-icon-hull svg{animation:fm-nav-float 1.2s ease-in-out infinite}
a:hover>.fm-nav-icon-comms svg,a:hover>.fm-nav-icon-beacon svg{animation:fm-nav-pulse 1s ease-out infinite}
a:hover>.fm-nav-icon-inspect svg{animation:fm-nav-scan 1s ease-in-out both}
a:hover>.fm-nav-icon-home svg,a:hover>.fm-nav-icon-products svg,a:hover>.fm-nav-icon-tank svg{animation:fm-nav-hop .6s cubic-bezier(.34,1.56,.64,1) both}
@keyframes fm-nav-spin{from{transform:rotate(-90deg)}to{transform:rotate(0)}}
@keyframes fm-nav-wiggle{0%,100%{transform:rotate(0)}20%{transform:rotate(-12deg)}40%{transform:rotate(10deg)}60%{transform:rotate(-6deg)}80%{transform:rotate(3deg)}}
@keyframes fm-nav-float{0%,100%{transform:translate(0,0)}50%{transform:translate(2px,-2px)}}
@keyframes fm-nav-pulse{0%{transform:scale(.85);opacity:.6}60%{transform:scale(1.08);opacity:1}100%{transform:scale(1)}}
@keyframes fm-nav-scan{0%{transform:translate(0,0)}30%{transform:translate(-2px,1px)}60%{transform:translate(2px,-1px)}100%{transform:translate(0,0)}}
@keyframes fm-nav-hop{0%{transform:translateY(0)}40%{transform:translateY(-3px)}100%{transform:translateY(0)}}

@media(min-width:901px) and (max-width:1200px){.primary-menu>li>a>.fm-nav-icon{display:none}}
@media(prefers-reduced-motion:reduce){a:hover>.fm-nav-icon,a:hover>.fm-nav-icon svg,a:hover>.fm-nav-icon svg *{animation:none!important}}
