/* Grada Nuevo — Nautical chart intro (home hero). Scoped under .ic-hero */
.ic-hero{
  --ink:#070707; --l1:#f2f2f2; --l2:#b3b3b3; --l3:#6f6f6f; --l4:#3b3b3b; --l5:#232323;
  --m1:#575757; --m2:#3d3d3d; --m3:#2a2a2a; --m4:#1b1b1b; --fill:#161616;
  --ease:cubic-bezier(.2,.7,.1,1); --intro:5s;
  position:relative;height:100svh;min-height:560px;overflow:hidden;isolation:isolate;background:var(--ink);color:var(--l1)
}
.ic-hero .stage{position:absolute;left:50%;top:50%;width:max(100vw,100vh);aspect-ratio:1;transform:translate(-50%,-50%) scale(1.08);transform-origin:50% 50%}
.ic-hero .layer{position:absolute;pointer-events:none}
.ic-hero .layer svg{display:block;width:100%;height:100%;overflow:visible}
@media (orientation:portrait){.ic-hero .layer.rose{margin-top:9.5%}}
.ic-hero .par{transition:transform .9s var(--ease)}
.ic-hero .spin{animation:ic-spin var(--t,240s) linear infinite;will-change:transform}
.ic-hero .spin.rev{animation-direction:reverse}
@keyframes ic-spin{to{transform:rotate(360deg)}}
.ic-hero .tx{font-family:var(--font-body);font-weight:600;letter-spacing:.22em;text-transform:uppercase}
.ic-hero .num{font-family:var(--font-body);font-weight:500;font-variant-numeric:tabular-nums}
.ic-hero .sym{font-family:var(--font-head);font-weight:400}
.ic-hero .ping{position:absolute;width:3.2%;aspect-ratio:1;border:1px solid var(--l3);border-radius:50%;transform:translate(-50%,-50%) scale(.3);opacity:0;animation:ic-ping 4.8s var(--ease) infinite}
.ic-hero .ping.b{animation-delay:2.4s}
@keyframes ic-ping{0%{opacity:.9;transform:translate(-50%,-50%) scale(.3)}100%{opacity:0;transform:translate(-50%,-50%) scale(3.2)}}
.ic-hero .flash{position:absolute;inset:0;pointer-events:none;z-index:2;opacity:0;transition:opacity .6s;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.10),rgba(255,255,255,0) 14%)}
.has-pointer .ic-hero .flash{opacity:1}
.ic-hero .vignette{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(130% 100% at 50% 60%,rgba(7,7,7,0) 55%,rgba(7,7,7,.75) 100%),linear-gradient(to bottom,rgba(7,7,7,.8),rgba(7,7,7,0) 22%)}
.ic-hero .veil{position:absolute;inset:0;z-index:4;background:var(--ink);pointer-events:none;opacity:0}
.ic-hero .ic-sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.ic-hero .pause{position:absolute;z-index:6;right:clamp(16px,4vw,56px);bottom:clamp(16px,4vh,40px);width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:transparent;border:1px solid var(--l4);color:var(--l3);cursor:pointer;transition:color .2s,border-color .2s;padding:0}
.ic-hero .pause:hover{color:var(--l1);border-color:var(--l2)}
.ic-hero .pause svg{width:12px;height:12px}
.ic-hero .pause .i-play{display:none}
.is-paused .ic-hero .pause .i-play{display:block}.is-paused .ic-hero .pause .i-pause{display:none}
.ic-hero .pause:focus-visible{outline:2px solid var(--l1);outline-offset:3px}

.intro-play .ic-hero .stage{animation:ic-dive var(--intro) var(--ease) both}
@keyframes ic-dive{from{transform:translate(-50%,-50%) scale(2.8)}to{transform:translate(-50%,-50%) scale(1.08)}}
.intro-play .ic-hero .veil{animation:ic-veil 2.6s ease both}
@keyframes ic-veil{from{opacity:1}to{opacity:0}}
.intro-play .ic-hero .draw{stroke-dasharray:1;stroke-dashoffset:1;animation:ic-draw 2.8s var(--ease) var(--d,0s) forwards}
@keyframes ic-draw{to{stroke-dashoffset:0}}
.intro-play .ic-hero .lbl{opacity:0;animation:ic-fade 1.4s ease var(--d,1.6s) forwards}
@keyframes ic-fade{to{opacity:1}}
.intro-play .ic-hero .ping{animation-delay:3.2s}
.intro-play .ic-hero .ping.b{animation-delay:5.6s}
.is-paused .ic-hero .spin,.is-paused .ic-hero .ping{animation-play-state:paused}

@media (prefers-reduced-motion:reduce){
  .ic-hero .stage,.ic-hero .spin,.ic-hero .ping,.ic-hero .veil,.ic-hero .draw,.ic-hero .lbl{animation:none!important}
  .ic-hero .draw{stroke-dasharray:none!important;stroke-dashoffset:0!important}
  .ic-hero .lbl{opacity:1!important}
  .ic-hero .ping{display:none}
  .ic-hero .par{transition:none}
  .ic-hero .pause{display:none}
}

/* Home: διάφανο μενού πάνω από το χάρτη, χωρίς footer */
.is-home .top-bar,.is-home .top-bar.scrolled{background:transparent!important;backdrop-filter:none;box-shadow:none;border-bottom-color:transparent}
.is-home .top-bar.menu-open{background:transparent!important}
html:not(.intro-play):not(.intro-done) .ic-hero .veil{opacity:1}