/* ---------- Подвал «Морское дно» ----------
   Общий для главной и страниц услуг. Сверху три колонки — услуги, работы,
   связь; ниже строка с юрлицом и документами; в самом низу логотип во всю
   ширину, наполовину ушедший в дно, по контуру проходит луч прожектора.
   Значения цветов — из tokens.css, своих здесь только эффекты. */
.seabed{
  position:relative;overflow:hidden;isolation:isolate;
  padding:clamp(3.6rem,9vh,5.6rem) 0 0;
  /* фото дна: песок и камни внизу, лучи сверху. Сверху его гасит градиент,
     чтобы подвал без шва продолжал экран «дно» и колонки читались */
  background:
    linear-gradient(0deg,rgba(1,4,10,.78) 0%,rgba(1,4,10,0) 16%),
    linear-gradient(180deg,#030810 0%,rgba(3,8,16,.82) 22%,rgba(3,8,16,.35) 50%,rgba(3,8,16,0) 72%),
    url("seabed-floor.webp") center bottom / cover no-repeat,
    #02060c;
  border-top:1px solid var(--line);
  color:var(--mute);font-family:var(--body);
}
/* отсвет снизу — свет проходит сквозь ил */
.seabed::before{
  content:"";position:absolute;z-index:-1;left:50%;bottom:-28%;width:130%;height:70%;
  transform:translateX(-50%);pointer-events:none;
  background:radial-gradient(50% 50% at 50% 50%,rgba(44,121,196,.14) 0%,rgba(44,121,196,.04) 45%,rgba(44,121,196,0) 72%);
}
.seabed-in{position:relative;max-width:1240px;margin:0 auto;padding:0 var(--gutter)}
.seabed-cols{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem)}
.sb-h{margin:0 0 1rem;font-family:var(--mono);font-size:var(--fs-hud);font-weight:400;letter-spacing:.24em;
  text-transform:uppercase;color:var(--kicker)}
.seabed ul{list-style:none;margin:0;padding:0;display:grid;gap:.15rem}
/* страницы услуг задают свои отступы и маркеры спискам — здесь они не нужны */
.seabed li{margin:0;padding:0;line-height:1.4}
.seabed li::before{content:none !important}
.seabed a{color:var(--text-soft);text-decoration:none;display:inline-flex;align-items:center;gap:.4em;
  min-height:32px;border-bottom:1px solid transparent;
  transition:color var(--t-fast) ease,border-color var(--t-fast) ease}
.seabed a:hover{color:var(--foam);border-bottom-color:var(--link-underline)}
.seabed a:focus-visible{outline:2px solid var(--lumen);outline-offset:3px;border-radius:2px}
.sb-out::after{content:"↗";font-size:.8em;color:var(--lumen);opacity:.7}
.sb-all{color:var(--lumen) !important}
.sb-phone{font-family:var(--display);font-weight:300;font-size:clamp(1.35rem,2.2vw,1.8rem);
  letter-spacing:-.01em;color:var(--foam) !important}
.sb-mail{font-family:var(--display);font-size:1.08rem;color:var(--foam) !important}
.sb-note{margin:.5rem 0 0;font-size:var(--fs-sm);line-height:1.55;max-width:38ch}
/* квадратные кнопки-иконки связи */
.sb-icons{display:flex;gap:.7rem;margin-top:1.2rem}
.seabed a.sb-ico{
  width:52px;height:52px;min-height:0;justify-content:center;border-radius:12px;
  border:1px solid rgba(134,219,255,.34);background:rgba(3,9,19,.72);color:var(--lumen);
  box-shadow:0 6px 24px -10px rgba(0,0,0,.8);
  transition:background var(--t-fast) ease,border-color var(--t-fast) ease,box-shadow var(--t-fast) ease,transform var(--t-fast) ease;
}
.seabed a.sb-ico svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.seabed a.sb-ico:hover{background:rgba(44,121,196,.42);border-color:var(--lumen);color:#fff;
  box-shadow:var(--glow);transform:translateY(-2px)}

.seabed-legal{
  margin-top:clamp(.6rem,1.6vh,1.2rem);padding:.8rem 0 1.3rem;
  /* без подложки: строка лежит на затемнённом крае фото, тень держит контраст */
  color:#B9D3E6;text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 12px rgba(1,4,10,.9);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.4rem 2rem;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;line-height:1.8;
}
.seabed-legal nav{display:flex;flex-wrap:wrap;gap:0 1.4rem}
.seabed-legal a{color:#B9D3E6}
.seabed-legal .sb-up{color:var(--kicker)}

/* логотип-рельеф на песке, над строкой с документами */
.seabed-mark{position:relative;margin-top:clamp(2.4rem,7vh,4rem);padding:0 clamp(.6rem,2vw,1.6rem);
  pointer-events:none}
.seabed-mark svg{display:block;width:100%;height:auto;overflow:visible;
  --lg-ink:url(#sbInk);--lg-k:url(#sbK);
  stroke:url(#sbSweep);stroke-width:16;stroke-linejoin:round}
/* пузырьки поднимаются со дна */
.sb-bubbles{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.sb-bubbles i{position:absolute;bottom:-20px;width:var(--s,6px);height:var(--s,6px);border-radius:50%;
  border:1px solid rgba(134,219,255,.45);box-shadow:inset -1px 1px 0 rgba(223,246,255,.5);
  left:var(--x,50%);opacity:0;animation:sb-rise var(--d,9s) linear var(--w,0s) infinite}
@keyframes sb-rise{0%{transform:translate(0,0);opacity:0}10%{opacity:.8}
  50%{transform:translate(6px,-45vh)}90%{opacity:.6}100%{transform:translate(-4px,-90vh);opacity:0}}

@media (max-width:860px){
  .seabed{background-image:
    linear-gradient(0deg,rgba(1,4,10,.8) 0%,rgba(1,4,10,0) 18%),
    linear-gradient(180deg,#030810 0%,rgba(3,8,16,.9) 55%,rgba(3,8,16,.45) 78%,rgba(3,8,16,.1) 92%),
    url("seabed-floor-m.webp")}
  .seabed-cols{grid-template-columns:1fr 1fr}
  .sb-contact{grid-column:1 / -1}
}
@media (max-width:520px){
  .seabed-cols{grid-template-columns:1fr}
  .seabed-legal{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
  .sb-bubbles{display:none}
  .seabed a,.seabed a.sb-ico{transition:none}
  .seabed a.sb-ico:hover{transform:none}
}