/* =========================================================
   42 ГРЕБКА К МЕЧТЕ — стили лендинга
   Mobile-first. Палитра снята с макета плаката.
   ========================================================= */

:root{
  /* Глубина воды */
  --deep-1:#041a33;
  --deep-2:#062442;
  --deep-3:#0b3a6b;
  --deep-4:#1256a0;
  --deep-5:#1a72c4;

  /* Золото / пергамент */
  --gold:#e8c36a;
  --gold-2:#c9992f;
  --gold-3:#8f6a1e;
  --parch:#f7e9c7;
  --parch-2:#ecd9ac;

  /* Красный (номера клеток) */
  --red:#c8342e;
  --red-2:#9d211d;

  --ink:#0d2b4a;
  --white:#f4f8fd;
  --muted:#a9c6e4;

  --r-s:10px;
  --r-m:16px;
  --r-l:22px;

  --wrap:1160px;
  --pad:clamp(16px,4vw,28px);

  --font-h:"Oswald","Arial Narrow",Impact,system-ui,sans-serif;
  --font-b:"Rubik","Segoe UI",Roboto,Arial,sans-serif;

  --shadow:0 14px 40px rgba(2,14,30,.45);
  --shadow-s:0 6px 18px rgba(2,14,30,.35);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:76px;-webkit-text-size-adjust:100%}

body{
  margin:0;
  font-family:var(--font-b);
  font-size:16px;
  line-height:1.62;
  color:var(--white);
  background:var(--deep-2);
  background-image:
    radial-gradient(120% 70% at 50% -10%, #1f7ac2 0%, rgba(31,122,194,0) 55%),
    linear-gradient(180deg,#0d4a86 0%,#093566 32%,#062a4e 62%,#04203c 100%);
  background-attachment:fixed;
  overflow-x:hidden;
}

img{max-width:100%;height:auto;display:block}
a{color:var(--gold);text-decoration:none}
button{font:inherit}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding-inline:var(--pad)}
.wrap--narrow{max-width:820px}

/* ---------- Типографика ---------- */
.h1{
  font-family:var(--font-h);
  font-weight:700;
  font-size:clamp(2.6rem,11vw,5.4rem);
  line-height:.94;
  letter-spacing:.01em;
  margin:.1em 0 .35em;
  color:var(--parch);
  text-transform:uppercase;
  text-shadow:0 4px 0 rgba(4,22,44,.55), 0 14px 34px rgba(0,0,0,.4);
}
.h1 .excl{color:var(--gold)}

.h2{
  font-family:var(--font-h);
  font-weight:600;
  font-size:clamp(1.7rem,5.4vw,2.7rem);
  line-height:1.1;
  text-transform:uppercase;
  letter-spacing:.015em;
  color:var(--parch);
  text-align:center;
  margin:0 0 .5em;
  text-shadow:0 3px 0 rgba(4,22,44,.4);
}
.h2--left{text-align:left}

.sec h3{
  font-family:var(--font-h);
  font-weight:600;
  font-size:1.16rem;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:var(--gold);
  margin:0 0 .45em;
  line-height:1.2;
}

.sec__lead{
  max-width:64ch;margin:0 auto 2.4em;text-align:center;
  color:var(--muted);font-size:1.03rem;
}
.sec__lead--left{margin-inline:0;text-align:left}

.eyebrow{
  display:inline-block;
  font-family:var(--font-h);font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;
  font-size:.78rem;color:var(--gold);
  border:1px solid rgba(232,195,106,.42);
  border-radius:100px;padding:.4em 1.1em;
}

.ribbon{
  display:inline-block;
  background:linear-gradient(180deg,var(--deep-5),var(--deep-4));
  border:1px solid rgba(232,195,106,.5);
  color:var(--parch);
  font-family:var(--font-h);font-weight:500;
  letter-spacing:.08em;text-transform:uppercase;
  font-size:clamp(.75rem,2.6vw,.92rem);
  padding:.45em 1.2em;border-radius:6px;
  box-shadow:var(--shadow-s);
  margin-bottom:1.4em;
}

.note{
  max-width:60ch;margin:2em auto 0;text-align:center;
  font-size:.92rem;color:var(--muted);
  background:rgba(4,22,44,.4);
  border:1px dashed rgba(232,195,106,.35);
  border-radius:var(--r-m);padding:1em 1.2em;
}
.note b{color:var(--gold)}

/* ---------- Кнопки ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:var(--font-h);font-weight:600;
  letter-spacing:.04em;text-transform:uppercase;
  font-size:.95rem;line-height:1;
  padding:.95em 1.6em;border:0;border-radius:100px;
  cursor:pointer;text-align:center;
  transition:transform .16s ease, box-shadow .16s ease, filter .16s ease;
  will-change:transform;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn:focus-visible{outline:3px solid var(--gold);outline-offset:3px}

.btn--gold{
  background:linear-gradient(180deg,#f3d68d 0%,var(--gold) 45%,var(--gold-2) 100%);
  color:#4a3208;
  box-shadow:0 6px 0 var(--gold-3), var(--shadow-s);
}
.btn--gold:hover{box-shadow:0 8px 0 var(--gold-3), var(--shadow)}

.btn--red{
  background:linear-gradient(180deg,#e15048 0%,var(--red) 50%,var(--red-2) 100%);
  color:#fff;
  box-shadow:0 6px 0 #6e1512, var(--shadow-s);
}
.btn--red:hover{box-shadow:0 8px 0 #6e1512, var(--shadow)}

.btn--ghost{
  background:rgba(255,255,255,.06);
  color:var(--parch);
  border:1.5px solid rgba(232,195,106,.5);
  backdrop-filter:blur(4px);
}
.btn--ghost:hover{background:rgba(255,255,255,.12)}

.btn--lg{padding:1.05em 1.9em;font-size:1.02rem}
.btn--sm{padding:.7em 1.15em;font-size:.82rem}
.btn--full{width:100%}

/* ---------- Пузыри (фон) ---------- */
.bubbles{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.bub{
  position:absolute;bottom:-12vh;border-radius:50%;
  background:radial-gradient(circle at 32% 28%, rgba(255,255,255,.75), rgba(160,215,255,.22) 45%, rgba(120,190,255,.06) 70%);
  border:1px solid rgba(255,255,255,.28);
  animation:rise linear infinite;
}
@keyframes rise{
  0%{transform:translateY(0) translateX(0) scale(.85);opacity:0}
  10%{opacity:.65}
  90%{opacity:.5}
  100%{transform:translateY(-118vh) translateX(var(--dx,14px)) scale(1.05);opacity:0}
}
@media (prefers-reduced-motion:reduce){
  .bub{animation:none;display:none}
  html{scroll-behavior:auto}
}

/* ---------- Шапка ---------- */
.header{
  position:sticky;top:0;z-index:60;
  background:rgba(6,32,60,.72);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(232,195,106,.22);
  transition:background .25s ease, box-shadow .25s ease;
}
.header.is-stuck{background:rgba(5,26,50,.94);box-shadow:0 6px 24px rgba(0,0,0,.35)}
.header__in{display:flex;align-items:center;gap:14px;min-height:64px}

.brand{display:flex;align-items:center;gap:10px;color:var(--parch);flex:0 0 auto}
.brand__logo{width:34px;height:auto;filter:drop-shadow(0 2px 4px rgba(0,0,0,.4))}
.brand__txt{
  font-family:var(--font-h);font-weight:500;text-transform:uppercase;
  font-size:.72rem;line-height:1.05;letter-spacing:.06em;color:var(--muted);
}
.brand__txt b{color:var(--gold);font-weight:700;font-size:.86rem}

.nav{display:none;margin-left:auto;gap:22px}
.nav a{
  font-family:var(--font-h);font-weight:500;text-transform:uppercase;
  font-size:.82rem;letter-spacing:.05em;color:var(--parch);
  padding:.35em 0;border-bottom:2px solid transparent;transition:.18s;
}
.nav a:hover,.nav a.is-active{color:var(--gold);border-bottom-color:var(--gold)}
.header__cta{display:none}

.burger{
  margin-left:auto;width:42px;height:38px;border:0;border-radius:10px;
  background:rgba(255,255,255,.08);display:grid;place-content:center;gap:5px;cursor:pointer;
}
.burger span{display:block;width:20px;height:2px;background:var(--parch);border-radius:2px;transition:.22s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:899px){
  .nav.is-open{
    display:flex;flex-direction:column;gap:0;
    position:absolute;left:0;right:0;top:100%;
    background:rgba(5,26,50,.98);
    border-bottom:1px solid rgba(232,195,106,.25);
    padding:8px var(--pad) 16px;
  }
  .nav.is-open a{padding:.85em 0;border-bottom:1px solid rgba(255,255,255,.07)}
}
@media (min-width:900px){
  .nav{display:flex}
  .burger{display:none}
  .header__cta{display:inline-flex;margin-left:6px}
}

/* ---------- HERO ---------- */
.hero{position:relative;z-index:1;padding:clamp(28px,7vw,64px) 0 clamp(40px,8vw,80px);overflow:hidden}
.hero__bg{
  position:absolute;inset:0;z-index:-1;
  background:url("assets/hero-bg.jpg") center/cover no-repeat;
  opacity:.28;
  mask-image:linear-gradient(180deg,#000 0%,#000 45%,transparent 100%);
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 45%,transparent 100%);
}
.hero__in{display:grid;gap:clamp(28px,6vw,48px);align-items:center}
.hero__text{text-align:center}
.hero__lead{font-size:clamp(1rem,3.4vw,1.14rem);color:#d8e8fa;max-width:56ch;margin:0 auto 1.7em}
.hero__btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:1.8em}

.chips{list-style:none;display:flex;flex-wrap:wrap;gap:9px;justify-content:center;padding:0;margin:0}
.chip{
  font-size:.82rem;color:var(--parch);
  background:rgba(255,255,255,.07);
  border:1px solid rgba(232,195,106,.3);
  border-radius:100px;padding:.45em .95em;
}

.hero__poster{margin:0;text-align:center}
.hero__poster img{
  margin:0 auto;border-radius:var(--r-m);
  border:3px solid var(--gold-2);
  box-shadow:var(--shadow), 0 0 0 6px rgba(232,195,106,.12);
  max-width:min(100%,430px);
  transform:rotate(-1.2deg);
}
.hero__poster figcaption{margin-top:1em;font-size:.86rem;color:var(--muted)}

@media (min-width:900px){
  .hero__in{grid-template-columns:1.05fr .95fr}
  .hero__text{text-align:left}
  .hero__lead{margin-inline:0}
  .hero__btns,.chips{justify-content:flex-start}
  .hero__poster img{max-width:100%}
}

/* ---------- Общие секции ---------- */
.sec{position:relative;z-index:1;padding:clamp(48px,9vw,92px) 0}
.sec--problem{background:rgba(3,18,36,.4)}
.sec--gallery{background:rgba(3,18,36,.4)}
.sec--faq{background:rgba(3,18,36,.4)}

.grid{display:grid;gap:18px}
@media (min-width:640px){.grid--3,.grid--4{grid-template-columns:repeat(2,1fr)}}
@media (min-width:980px){
  .grid--3{grid-template-columns:repeat(3,1fr)}
  .grid--4{grid-template-columns:repeat(4,1fr)}
}

/* Золотая рамка «как у клеток плаката» */
.framed{
  background:linear-gradient(180deg,rgba(18,60,108,.86),rgba(8,36,68,.9));
  border:2px solid var(--gold-2);
  border-radius:var(--r-l);
  box-shadow:inset 0 0 0 1px rgba(232,195,106,.25), var(--shadow-s);
}

/* ---------- Проблема ---------- */
.pcard{
  background:linear-gradient(180deg,rgba(18,60,108,.86),rgba(8,36,68,.9));
  border:2px solid var(--gold-2);
  border-radius:var(--r-l);
  box-shadow:inset 0 0 0 1px rgba(232,195,106,.25), var(--shadow-s);
  padding:26px 22px;
}
.pcard__ico{width:46px;height:46px;color:var(--gold);margin-bottom:14px}
.pcard__ico svg{width:100%;height:100%}
.pcard p{margin:0;color:#cfe2f5;font-size:.97rem}

/* ---------- Шаги ---------- */
.steps{list-style:none;margin:0 0 clamp(36px,6vw,56px);padding:0;display:grid;gap:18px;counter-reset:s}
@media (min-width:640px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1040px){.steps{grid-template-columns:repeat(4,1fr)}}

.step{
  position:relative;
  background:linear-gradient(180deg,rgba(18,60,108,.86),rgba(8,36,68,.92));
  border:2px solid var(--gold-2);
  border-radius:var(--r-l);
  box-shadow:inset 0 0 0 1px rgba(232,195,106,.25), var(--shadow-s);
  padding:30px 20px 24px;
}
.step__num{
  position:absolute;top:-16px;left:20px;
  width:38px;height:38px;border-radius:50%;
  display:grid;place-items:center;
  background:radial-gradient(circle at 35% 30%,#e6564d,var(--red) 55%,var(--red-2));
  border:2px solid var(--gold);
  color:#fff;font-family:var(--font-h);font-weight:700;font-size:1.1rem;
  box-shadow:0 4px 10px rgba(0,0,0,.4);
}
.step__ico{width:54px;height:54px;color:var(--gold);margin:6px 0 14px}
.step__ico svg{width:100%;height:100%}
.step p{margin:0;color:#cfe2f5;font-size:.95rem}

/* стрелка между шагами — как на плакате */
@media (min-width:1040px){
  .step:not(:last-child)::after{
    content:"";position:absolute;right:-14px;top:50%;
    width:0;height:0;transform:translateY(-50%);
    border:8px solid transparent;border-left-color:var(--gold-2);
  }
}

.openposter{margin:0;text-align:center}
.openposter img{
  margin:0 auto;max-width:min(100%,520px);
  border-radius:var(--r-m);border:3px solid var(--gold-2);
  box-shadow:var(--shadow), 0 0 0 6px rgba(232,195,106,.12);
}
.openposter figcaption{margin-top:1em;font-size:.88rem;color:var(--muted);max-width:52ch;margin-inline:auto}
.openposter__note{display:block;margin-top:.5em;font-size:.83rem;color:var(--gold);opacity:.9}

/* ---------- Преимущества ---------- */
.bcard{
  background:linear-gradient(180deg,rgba(18,60,108,.8),rgba(8,36,68,.88));
  border:2px solid rgba(232,195,106,.55);
  border-radius:var(--r-l);
  padding:26px 22px;
  box-shadow:var(--shadow-s);
  transition:transform .2s ease, border-color .2s ease;
}
.bcard:hover{transform:translateY(-4px);border-color:var(--gold)}
.bcard__ico{width:46px;height:46px;color:var(--gold);margin-bottom:14px}
.bcard__ico svg{width:100%;height:100%}
.bcard p{margin:0;color:#cfe2f5;font-size:.95rem}

/* ---------- Галерея клеток ---------- */
/* 4 клетки: 2×2 на телефоне, в один ряд на десктопе */
.gallery{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}
@media (min-width:900px){.gallery{grid-template-columns:repeat(4,1fr)}}

.cell{margin:0;text-align:center}
.cell img{
  border-radius:14px;
  border:3px solid var(--gold-2);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.15), var(--shadow-s);
  transition:transform .22s ease, box-shadow .22s ease;
  background:var(--deep-3);
}
.cell:hover img{transform:translateY(-5px) scale(1.02);box-shadow:0 16px 32px rgba(0,0,0,.5)}
.cell figcaption{
  margin-top:.7em;font-family:var(--font-h);font-weight:500;
  text-transform:uppercase;letter-spacing:.05em;
  font-size:.76rem;color:var(--gold);
}

/* ---------- Два варианта ---------- */
.plans{display:grid;gap:22px}
@media (min-width:900px){.plans{grid-template-columns:repeat(2,1fr);align-items:stretch}}

.plan{
  display:flex;flex-direction:column;
  background:linear-gradient(180deg,rgba(20,66,118,.9),rgba(7,32,60,.94));
  border:3px solid var(--gold-2);
  border-radius:var(--r-l);
  box-shadow:inset 0 0 0 2px rgba(232,195,106,.2), var(--shadow);
  padding:clamp(24px,4vw,34px);
}
.plan--team{border-color:var(--red);box-shadow:inset 0 0 0 2px rgba(200,52,46,.25), var(--shadow)}

.plan__head{margin-bottom:14px}
.plan__tag{
  display:inline-block;
  font-family:var(--font-h);font-weight:600;font-size:.72rem;
  letter-spacing:.14em;text-transform:uppercase;
  background:var(--gold);color:#4a3208;
  padding:.35em .9em;border-radius:100px;margin-bottom:.9em;
}
.plan__tag--red{background:var(--red);color:#fff}
.plan h3{font-size:1.5rem;color:var(--parch);margin:0}

.plan__price{
  font-family:var(--font-h);font-weight:700;
  color:var(--gold);line-height:1;margin:.15em 0 .9em;
}
.plan__price b{font-size:clamp(2.4rem,8vw,3.2rem)}
.plan__price span{font-size:1.6rem}
.plan__price--req{
  font-size:clamp(1.25rem,4.6vw,1.6rem);
  color:#ffb9b4;text-transform:uppercase;letter-spacing:.03em;
  padding:.35em 0;
}

.plan__list{list-style:none;margin:0 0 1.6em;padding:0;flex:1}
.plan__list li{position:relative;padding-left:1.7em;margin-bottom:.6em;color:#cfe2f5;font-size:.96rem}
.plan__list li::before{
  content:"";position:absolute;left:0;top:.55em;
  width:10px;height:10px;border-radius:50%;
  background:var(--gold);box-shadow:0 0 0 3px rgba(232,195,106,.2);
}
.plan--team .plan__list li::before{background:var(--red);box-shadow:0 0 0 3px rgba(200,52,46,.22)}
.plan__hint{margin:.9em 0 0;font-size:.85rem;color:var(--muted);text-align:center}

/* ---------- Отзывы ---------- */
.review{
  margin:0;
  background:linear-gradient(180deg,var(--parch) 0%,var(--parch-2) 100%);
  color:var(--ink);
  border:2px solid var(--gold-3);
  border-radius:var(--r-l);
  padding:26px 24px;
  box-shadow:var(--shadow-s);
  position:relative;
}
.review::before{
  content:"“";position:absolute;top:-6px;left:16px;
  font-family:Georgia,serif;font-size:4.6rem;line-height:1;
  color:rgba(143,106,30,.28);
}
.review blockquote{margin:0 0 1.1em;font-size:.98rem;line-height:1.6;position:relative}
.review figcaption{display:flex;flex-direction:column;border-top:1px solid rgba(143,106,30,.35);padding-top:.9em}
.review figcaption b{font-family:var(--font-h);font-weight:600;text-transform:uppercase;letter-spacing:.03em;color:#6b4d13}
.review figcaption span{font-size:.85rem;color:#5c6b7d}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:12px}
.faq__i{
  background:linear-gradient(180deg,rgba(18,60,108,.8),rgba(8,36,68,.88));
  border:2px solid rgba(232,195,106,.45);
  border-radius:var(--r-m);
  overflow:hidden;
}
.faq__i[open]{border-color:var(--gold)}
.faq__i summary{
  cursor:pointer;list-style:none;
  padding:1.05em 3em 1.05em 1.2em;
  font-family:var(--font-h);font-weight:500;
  font-size:1.02rem;color:var(--parch);
  position:relative;
}
.faq__i summary::-webkit-details-marker{display:none}
.faq__i summary::after{
  content:"";position:absolute;right:1.2em;top:50%;
  width:10px;height:10px;margin-top:-7px;
  border-right:2.5px solid var(--gold);border-bottom:2.5px solid var(--gold);
  transform:rotate(45deg);transition:transform .22s ease;
}
.faq__i[open] summary::after{transform:rotate(-135deg);margin-top:-3px}
.faq__i summary:hover{color:var(--gold)}
.faq__a{padding:0 1.2em 1.2em;color:#cfe2f5;font-size:.96rem}
.faq__a p{margin:0}

/* ---------- Форма и контакты ---------- */
.order__in{display:grid;gap:26px}
@media (min-width:980px){.order__in{grid-template-columns:1.25fr .75fr;align-items:start}}

.order__form{
  background:linear-gradient(180deg,rgba(20,66,118,.9),rgba(7,32,60,.94));
  border:3px solid var(--gold-2);
  border-radius:var(--r-l);
  box-shadow:inset 0 0 0 2px rgba(232,195,106,.18), var(--shadow);
  padding:clamp(24px,4vw,38px);
}

.form{display:grid;gap:16px}
.field{display:grid;gap:6px}
/* display:grid у .field перебивает [hidden]{display:none} браузера —
   без этой строки поле «команда/школа» видно всегда */
.field[hidden]{display:none}
.field label,.check span{font-size:.9rem;font-weight:500;color:var(--parch)}
.req{color:var(--red);font-weight:700}

.field input,.field select,.field textarea{
  width:100%;font:inherit;font-size:.98rem;
  color:var(--ink);background:var(--parch);
  border:2px solid var(--gold-3);border-radius:12px;
  padding:.8em .95em;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.field textarea{resize:vertical;min-height:88px}
.field select{
  appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%238f6a1e' stroke-width='2' fill='none' stroke-linecap='round'/></svg>");
  background-repeat:no-repeat;background-position:right 1em center;background-size:12px;
  padding-right:2.6em;cursor:pointer;
}
.field input::placeholder,.field textarea::placeholder{color:#8b7a55}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(232,195,106,.25);
}
.field.is-invalid input,.field.is-invalid select{border-color:var(--red);box-shadow:0 0 0 4px rgba(200,52,46,.2)}

.err{display:none;color:#ffb0ab;font-size:.82rem}
.field.is-invalid .err,.err.is-shown{display:block}
.err--check{margin-top:-8px}

.check{display:flex;align-items:flex-start;gap:10px;cursor:pointer;margin-top:2px}
.check input{
  flex:0 0 auto;width:20px;height:20px;margin-top:2px;
  accent-color:var(--gold-2);cursor:pointer;
}
.check span{font-size:.86rem;color:var(--muted);line-height:1.45}

.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

.form__status{margin:.2em 0 0;font-size:.92rem;text-align:center;min-height:1.2em}
.form__status.is-ok{color:#8be3a8}
.form__status.is-err{color:#ffb0ab}
.form__status.is-warn{color:var(--gold)}
#submitBtn[disabled]{opacity:.6;cursor:progress;transform:none}

/* Пергамент контактов */
.parchment{
  background:
    radial-gradient(120% 100% at 50% 0%, #fdf3dc 0%, var(--parch) 40%, var(--parch-2) 100%);
  color:var(--ink);
  border:3px solid var(--gold-3);
  border-radius:var(--r-l);
  padding:clamp(22px,4vw,30px);
  box-shadow:var(--shadow);
}
.parchment h3{font-family:var(--font-h);text-transform:uppercase;color:#6b4d13;margin:0 0 .3em;font-size:1.3rem;letter-spacing:.02em}
.parchment > p{margin:0 0 1.2em;font-size:.92rem;color:#5c6b7d}
.parchment__note{margin:1.1em 0 0;font-size:.82rem;color:#5c6b7d;text-align:center}

.clink{
  display:flex;align-items:center;gap:12px;
  background:rgba(255,255,255,.55);
  border:2px solid rgba(143,106,30,.35);
  border-radius:14px;padding:.75em .9em;margin-bottom:10px;
  color:var(--ink);transition:transform .16s ease, border-color .16s ease, background .16s ease;
}
.clink:hover{transform:translateX(3px);border-color:var(--gold-2);background:#fff}
.clink__ico{
  flex:0 0 auto;width:40px;height:40px;border-radius:50%;
  display:grid;place-items:center;color:#fff;
}
.clink__ico svg{width:22px;height:22px}
.clink__ico--wa{background:#25a35a}
.clink__ico--tg{background:#2aa3e0}
.clink__ico--tel{background:var(--red)}
.clink__txt{display:flex;flex-direction:column;line-height:1.25}
.clink__txt b{font-size:1rem;color:#2c3d52}
.clink__txt em{font-style:normal;font-size:.8rem;color:#6c7c8f}

/* ---------- Футер ---------- */
.footer{position:relative;z-index:1;margin-top:clamp(40px,8vw,80px);background:var(--deep-2);padding-top:210px}
.seabed{position:absolute;left:0;right:0;top:0;height:196px;pointer-events:none;overflow:hidden}
.seabed__wave{position:absolute;left:0;right:0;top:0;width:100%;height:150px}
.deco{position:absolute;bottom:0;opacity:.92}
.deco--lighthouse{left:3%;width:46px;bottom:4px}
.deco--chest{right:4%;width:76px;bottom:4px}
.deco--weed{width:26px;bottom:0;opacity:.6}
.deco--weed1{left:15%}
.deco--weed2{right:17%}
.deco--fish{width:42px;left:44%;bottom:74px;opacity:.85;animation:swim 16s ease-in-out infinite alternate}
@keyframes swim{from{transform:translateX(-30px)}to{transform:translateX(60px)}}
@media (prefers-reduced-motion:reduce){.deco--fish{animation:none}}
@media (max-width:620px){
  .deco--weed2,.deco--fish{display:none}
  .deco--lighthouse{width:34px}
  .deco--chest{width:56px}
}

.footer__in{
  position:relative;z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:16px;
  text-align:center;padding-bottom:34px;
}
.footer__brand{display:flex;align-items:center;gap:10px}
.footer__brand img{width:44px;height:auto}
.footer__brand span{
  font-family:var(--font-h);font-weight:600;text-transform:uppercase;
  letter-spacing:.06em;color:var(--gold);font-size:1rem;
}
.footer__nav{display:flex;flex-wrap:wrap;gap:6px 22px;justify-content:center}
.footer__nav a{font-size:.88rem;color:var(--muted)}
.footer__nav a:hover{color:var(--gold)}
.footer__legal{margin:0;font-size:.8rem;color:#7fa0c2;max-width:60ch}
/* сноска про дистанцию тренировки */
.footer__note{margin:0;font-size:.84rem;color:var(--muted);max-width:60ch}
.ast{color:var(--gold);font-weight:700}
sup.ast{font-size:.7em;margin-left:.1em}

/* ---------- Плавающая кнопка (моб.) ---------- */
.fab{
  position:fixed;left:16px;right:16px;bottom:14px;z-index:55;
  display:none;justify-content:center;align-items:center;
  font-family:var(--font-h);font-weight:600;text-transform:uppercase;
  letter-spacing:.05em;font-size:.95rem;
  background:linear-gradient(180deg,#f3d68d,var(--gold) 45%,var(--gold-2));
  color:#4a3208;padding:1em;border-radius:100px;
  box-shadow:0 5px 0 var(--gold-3), 0 12px 28px rgba(0,0,0,.45);
}
@media (max-width:899px){
  .fab.is-visible{display:flex}
  body{padding-bottom:0}
}

/* ---------- Появление при скролле ---------- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .55s ease, transform .55s ease}
.reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
}