/* Тема повторяет shamana.taplink.ws: фон #07191b, кнопки #103335 r40, текст белый.
   Шрифты оригинала (taplink font map): заголовки = Oswald (id 7), акцентный текст = Amatic SC (id 9). */
@font-face { font-family: 'Amatic SC'; font-weight: 400; font-style: normal; font-display: swap;
  src: url(fonts/AmaticSC-400-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Amatic SC'; font-weight: 400; font-style: normal; font-display: swap;
  src: url(fonts/AmaticSC-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+2122; }
@font-face { font-family: 'Amatic SC'; font-weight: 700; font-style: normal; font-display: swap;
  src: url(fonts/AmaticSC-700-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Amatic SC'; font-weight: 700; font-style: normal; font-display: swap;
  src: url(fonts/AmaticSC-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+2122; }
@font-face { font-family: 'Oswald'; font-weight: 400; font-style: normal; font-display: swap;
  src: url(fonts/Oswald-400-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Oswald'; font-weight: 400; font-style: normal; font-display: swap;
  src: url(fonts/Oswald-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+2122; }

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: #07191b;
  color: #fff;
  font: 300 17px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.bg-top {
  position: absolute; top: 0; left: 0; right: 0; height: 450px;
  background: url("img/theme_bg.webp") 50% 0 / cover no-repeat;
  z-index: -1;
}
/* Лёгкая вуаль: ветки леса читаются, как в оригинале; плавный уход в фон снизу */
.bg-top::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(7,25,27,.05) 0%, rgba(7,25,27,.25) 70%, #07191b 100%);
}
.col { max-width: 640px; margin: 0 auto; padding: 28px 16px 48px; display: flex; flex-direction: column; gap: 14px; }

.small { font-size: 12.5px; color: #8fa6aa; text-align: center; line-height: 1.45; }
.small.amatic {
  font-family: 'Amatic SC', cursive; font-weight: 700; font-size: 17px; line-height: 1.3;
  color: #d9e6e8; text-shadow: 0 1px 6px rgba(7,25,27,.8);
}
.text.amatic { font-family: 'Amatic SC', cursive; font-weight: 400; font-size: 28px; line-height: 1.3; }
.hero { text-align: center; margin-top: 6px; }
.avatar { border-radius: 50%; border: 3px solid rgba(255,255,255,.85); box-shadow: 0 4px 24px rgba(0,0,0,.45); }
.hero-title { margin-top: 10px; color: #6b898f; font-weight: 400; letter-spacing: .04em; }
h1.name { font-family: 'Oswald', sans-serif; font-size: 30px; font-weight: 400; text-transform: uppercase; text-align: center; letter-spacing: .05em; }
.text { color: #e8f0f1; }
h2 { font-family: 'Oswald', sans-serif; font-weight: 400; text-transform: uppercase; letter-spacing: .08em; text-align: center; margin-bottom: 10px; font-size: 20px; }

/* Кнопки-ссылки */
.btn {
  display: flex; align-items: center; gap: 14px;
  background: #103335; border-radius: 40px; padding: 14px 22px;
  color: #fff; text-decoration: none;
  box-shadow: 0 2px 10px rgba(0,0,0,.25);
  transition: transform .15s ease, background .15s ease;
}
a.btn:hover { background: #164547; transform: translateY(-1px); }
.btn-icon { font-size: 22px; flex: 0 0 auto; width: 30px; text-align: center; }
.btn-thumb { border-radius: 10px; flex: 0 0 auto; }
.btn-text { display: flex; flex-direction: column; min-width: 0; }
.btn-title { font-weight: 400; }
.btn-sub { font-size: 13px; color: #9fb7bb; margin-top: 2px; }
.section-head { margin-top: 26px; background: #0d2b2d; border: 1px solid #1d4a4d; scroll-margin-top: 16px; }
.msg.wa { background: #0e4d38; } .msg.wa:hover { background: #14684c; }
.msg.tg { background: #0e3a56; } .msg.tg:hover { background: #145179; }

/* FAQ-аккордеоны */
.faq { border-bottom: 1px solid rgba(255,255,255,.12); }
.faq summary {
  cursor: pointer; list-style: none; padding: 13px 34px 13px 4px;
  position: relative; font-weight: 400; color: #e8f0f1;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+"; position: absolute; right: 8px; top: 50%; translate: 0 -50%;
  font-size: 22px; font-weight: 200; color: #6b898f; transition: rotate .2s ease;
}
.faq[open] summary::after { rotate: 45deg; }
.faq-body { padding: 2px 4px 16px; color: #c3d4d6; font-size: 15.5px; }

/* Карусели */
.carousel { margin: 10px 0; }
.track {
  display: flex; gap: 10px; overflow-x: auto;
  scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
  scrollbar-width: none; border-radius: 14px;
}
.track::-webkit-scrollbar { display: none; }
/* Единое окно для всех слайдов: 4/5, кадрирование по центру (cover) */
.slide { flex: 0 0 100%; scroll-snap-align: center; aspect-ratio: 4 / 5; }
.slide img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 14px; }
.dots { display: flex; justify-content: center; gap: 6px; margin-top: 10px; flex-wrap: wrap; }
.dot {
  width: 7px; height: 7px; border-radius: 50%; border: 0; padding: 0;
  background: rgba(255,255,255,.3); cursor: pointer; transition: background .2s;
}
.dot.on { background: #fff; }

/* Прайс */
.pricing { margin-top: 26px; }
.price-row { display: flex; align-items: baseline; gap: 8px; padding: 7px 0; font-size: 15px; }
.price-title { color: #dce8e9; }
.price-dots { flex: 1; border-bottom: 1px dotted rgba(255,255,255,.25); min-width: 20px; }
.price-val { color: #fff; font-weight: 400; white-space: nowrap; }

.divider { text-align: center; color: #6b898f; font-size: 26px; margin: 10px 0; opacity: .8; }
.media-card {
  display: flex; gap: 14px; align-items: flex-start;
  background: rgba(255,255,255,.05); border-radius: 18px; padding: 16px 20px;
}
footer a { color: #8fa6aa; }
footer { margin-top: 24px; }
