/* EIDOS’CHIC Taplink Glass Luxury V13
   Цель: ближе к референсу — легче, тоньше, дороже, меньше пластика.
*/

:root {
  --ec-ink: #2f2827;
  --ec-ink-soft: rgba(47, 40, 39, .78);
  --ec-muted: rgba(70, 58, 56, .56);
  --ec-line: rgba(255, 255, 255, .64);
  --ec-line-soft: rgba(255, 255, 255, .34);
  --ec-glass: rgba(255, 255, 255, .30);
  --ec-glass-light: rgba(255, 255, 255, .44);
  --ec-blush: rgba(255, 166, 195, .30);
  --ec-aqua: rgba(205, 252, 249, .40);
  --ec-champagne: rgba(250, 232, 214, .42);
  --ec-smoky: #4b3d3a;
}

* {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  background: #fbf3ef;
}

body.taplink-body {
  margin: 0;
  min-height: 100vh;
  font-family: Inter, Arial, sans-serif;
  color: var(--ec-ink);
  background:
    radial-gradient(circle at 86% 6%, rgba(206, 255, 250, .72), transparent 32%),
    radial-gradient(circle at 8% 84%, rgba(255, 164, 190, .54), transparent 38%),
    radial-gradient(circle at 76% 92%, rgba(218, 198, 232, .32), transparent 34%),
    linear-gradient(145deg, #fffaf7 0%, #faeee9 48%, #f8dce4 100%);
  overflow-x: hidden;
}

/* Мягкая дизайнерская глубина фона */
body.taplink-body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(255,255,255,.42), transparent 22%, rgba(255,255,255,.16) 48%, transparent 72%),
    repeating-linear-gradient(
      115deg,
      rgba(255,255,255,.055) 0,
      rgba(255,255,255,.055) 1px,
      transparent 1px,
      transparent 9px
    );
  opacity: .55;
}

body.taplink-body::after {
  content: "";
  position: fixed;
  width: 460px;
  height: 460px;
  right: -220px;
  top: -170px;
  z-index: 0;
  pointer-events: none;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255,255,255,.76), rgba(255,255,255,0) 70%);
  filter: blur(2px);
}

.taplink-page {
  position: relative;
  z-index: 1;
  width: min(100%, 430px);
  min-height: 100vh;
  margin: 0 auto;
  padding: 14px 10px 26px;
}

/* Общие glass-карточки */
.taplink-main-card,
.taplink-contact-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  border: 1px solid rgba(255,255,255,.62);
  background:
    radial-gradient(circle at 86% 4%, rgba(205,252,249,.35), transparent 39%),
    radial-gradient(circle at 8% 92%, rgba(255,155,186,.24), transparent 44%),
    linear-gradient(145deg, rgba(255,255,255,.46), rgba(255,255,255,.17));

  -webkit-backdrop-filter: blur(30px) saturate(145%);
  backdrop-filter: blur(30px) saturate(145%);

  box-shadow:
    0 22px 64px rgba(83, 51, 49, .12),
    inset 0 1px 0 rgba(255,255,255,.86),
    inset 0 -16px 34px rgba(88, 56, 56, .045),
    0 0 0 1px rgba(255,255,255,.18);
}

.taplink-main-card {
  padding: 25px 13px 16px;
  border-radius: 34px;
}

/* Внутренняя rim-рамка — даёт ощущение толщины стекла */
.taplink-main-card::before,
.taplink-contact-card::before {
  content: "";
  position: absolute;
  inset: 7px;
  z-index: -1;
  border-radius: inherit;
  border: 1px solid rgba(255,255,255,.42);
  background:
    linear-gradient(145deg, rgba(255,255,255,.18), rgba(255,255,255,0) 44%),
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.22), transparent 30%);
  pointer-events: none;
}

.taplink-main-card::after,
.taplink-contact-card::after {
  content: "";
  position: absolute;
  left: 22px;
  right: 22px;
  top: 12px;
  height: 1px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.76), transparent);
  opacity: .78;
  pointer-events: none;
}

/* Логотип: меньше, легче, ближе к референсу */
.taplink-logo {
  margin: 0 0 22px;
  text-align: center;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(25px, 7.1vw, 33px);
  font-weight: 400;
  letter-spacing: .22em;
  line-height: 1;
  color: rgba(78, 64, 62, .78);
  text-transform: uppercase;
  text-shadow: 0 1px 0 rgba(255,255,255,.48);
}

/* Меню */
.taplink-menu {
  display: grid;
  gap: 10px;
}

.taplink-btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  width: 100%;
  min-height: 54px;
  padding: 13px 17px;

  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.64);
  text-decoration: none;

  color: rgba(47, 40, 39, .88);
  font-size: 17px;
  line-height: 1.16;
  font-weight: 400;
  letter-spacing: -.01em;

  background:
    radial-gradient(circle at 91% 13%, rgba(210,252,249,.25), transparent 36%),
    radial-gradient(circle at 8% 88%, rgba(255,165,195,.18), transparent 40%),
    linear-gradient(145deg, rgba(255,255,255,.34), rgba(255,255,255,.13));

  -webkit-backdrop-filter: blur(26px) saturate(150%);
  backdrop-filter: blur(26px) saturate(150%);

  box-shadow:
    0 9px 24px rgba(74, 48, 46, .06),
    inset 0 1px 0 rgba(255,255,255,.82),
    inset 0 -10px 22px rgba(77, 50, 50, .045),
    0 0 0 1px rgba(255,255,255,.12);
}

.taplink-btn::before {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: inherit;
  border: 1px solid rgba(255,255,255,.24);
  background: linear-gradient(145deg, rgba(255,255,255,.16), transparent 48%);
  pointer-events: none;
}

.taplink-btn::after {
  content: "";
  position: absolute;
  left: 18px;
  right: 52px;
  top: 7px;
  height: 1px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255,255,255,.58), transparent);
  opacity: .68;
  pointer-events: none;
}

.taplink-btn-text {
  min-width: 0;
}

.taplink-arrow {
  flex: 0 0 auto;
  color: rgba(55, 47, 46, .46);
  font-size: 23px;
  line-height: 1;
  transform: translateY(-1px);
}

/* Социальные иконки: менее игрушечные */
.taplink-icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  margin-left: -3px;
  border-radius: 999px;
  color: rgba(255,255,255,.94);
  font-size: 13px;
  line-height: 1;
  background:
    radial-gradient(circle at 30% 22%, rgba(255,255,255,.64), rgba(255,255,255,0) 38%),
    linear-gradient(145deg, rgba(199,154,226,.70), rgba(232,132,176,.72));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.56),
    0 6px 13px rgba(173, 92, 141, .12);
}

.taplink-btn-social {
  justify-content: flex-start;
}

.taplink-btn-social .taplink-btn-text {
  flex: 1 1 auto;
}

.taplink-btn:hover,
.taplink-btn:active {
  background:
    radial-gradient(circle at 91% 13%, rgba(210,252,249,.34), transparent 36%),
    radial-gradient(circle at 8% 88%, rgba(255,165,195,.24), transparent 40%),
    linear-gradient(145deg, rgba(255,255,255,.42), rgba(255,255,255,.18));
}

/* Тёмный блок: smoky taupe, мягче и премиальнее */
.taplink-full-site {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  margin: 13px 0 0;
  min-height: 72px;
  padding: 13px 14px;

  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.32);
  text-decoration: none;
  color: #fff;

  background:
    radial-gradient(circle at 11% 12%, rgba(255,255,255,.16), transparent 34%),
    radial-gradient(circle at 92% 16%, rgba(216,248,244,.12), transparent 40%),
    linear-gradient(145deg, rgba(83, 68, 64, .90), rgba(58, 48, 46, .91));

  -webkit-backdrop-filter: blur(24px) saturate(130%);
  backdrop-filter: blur(24px) saturate(130%);

  box-shadow:
    0 14px 34px rgba(62, 42, 40, .16),
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -13px 27px rgba(0,0,0,.18);
}

.taplink-full-left {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.taplink-bag {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 31px;
  height: 31px;
  border-radius: 999px;
  color: rgba(255,255,255,.86);
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(255,255,255,.07);
  font-size: 14px;
}

.taplink-full-title {
  display: block;
  font-size: 16.5px;
  line-height: 1.08;
  font-weight: 400;
  color: #fff;
}

.taplink-full-subtitle {
  display: block;
  max-width: 270px;
  margin-top: 3px;
  font-size: 10.8px;
  line-height: 1.25;
  color: rgba(255,255,255,.68);
}

.taplink-full-arrow {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 31px;
  height: 31px;
  border-radius: 999px;
  color: #fff;
  font-size: 20px;
  border: 1px solid rgba(255,255,255,.24);
  background: rgba(255,255,255,.07);
}

/* Контакты — компактнее */
.taplink-contact-card {
  margin-top: 14px;
  padding: 22px 13px 18px;
  border-radius: 32px;
}

.taplink-section-title {
  position: relative;
  margin: 0 0 16px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(27px, 8vw, 36px);
  line-height: 1;
  font-weight: 400;
  color: rgba(42,35,34,.90);
  text-shadow: 0 1px 0 rgba(255,255,255,.42);
}

.taplink-section-title::after {
  content: "✦";
  position: absolute;
  right: 14px;
  top: 2px;
  font-size: 13px;
  color: rgba(203, 130, 150, .74);
}

.taplink-contact-list {
  display: grid;
  gap: 10px;
}

.taplink-contact-note {
  margin: 15px auto 0;
  max-width: 320px;
  text-align: center;
  font-size: 13.5px;
  line-height: 1.42;
  color: rgba(70, 58, 57, .50);
}

.taplink-footer-space {
  height: 4px;
}

@media (max-width: 430px) {
  .taplink-page {
    padding: 12px 8px 24px;
  }

  .taplink-main-card {
    padding: 23px 12px 15px;
    border-radius: 33px;
  }

  .taplink-logo {
    margin-bottom: 20px;
  }

  .taplink-btn {
    min-height: 52px;
    padding: 12px 16px;
    font-size: 16.5px;
  }

  .taplink-contact-card {
    padding: 21px 12px 17px;
  }
}

@media (max-width: 360px) {
  .taplink-page {
    padding-left: 7px;
    padding-right: 7px;
  }

  .taplink-logo {
    font-size: 23px;
    letter-spacing: .18em;
  }

  .taplink-btn {
    min-height: 50px;
    font-size: 15.5px;
  }

  .taplink-icon {
    width: 26px;
    height: 26px;
    font-size: 12px;
  }

  .taplink-full-subtitle {
    font-size: 10.3px;
  }
}

/* === EIDOS’CHIC TAPLINK GLASS V14 OVERRIDES START === */
/* Цель v14: тоньше, воздушнее, ближе к premium Taplink reference */

body.taplink-body {
  background:
    radial-gradient(circle at 88% 5%, rgba(213, 255, 251, .62), transparent 30%),
    radial-gradient(circle at 5% 86%, rgba(255, 174, 198, .38), transparent 35%),
    radial-gradient(circle at 74% 88%, rgba(221, 205, 232, .22), transparent 32%),
    linear-gradient(145deg, #fffaf7 0%, #fbf0ec 53%, #f8e3e8 100%) !important;
}

body.taplink-body::before {
  opacity: .42 !important;
  background:
    linear-gradient(120deg, rgba(255,255,255,.34), transparent 24%, rgba(255,255,255,.12) 48%, transparent 74%),
    repeating-linear-gradient(
      115deg,
      rgba(255,255,255,.045) 0,
      rgba(255,255,255,.045) 1px,
      transparent 1px,
      transparent 10px
    ) !important;
}

.taplink-page {
  width: min(100%, 410px) !important;
  padding: 16px 14px 28px !important;
}

.taplink-main-card {
  padding: 23px 12px 15px !important;
  border-radius: 32px !important;
  background:
    radial-gradient(circle at 88% 4%, rgba(207,252,249,.28), transparent 38%),
    radial-gradient(circle at 7% 91%, rgba(255,165,190,.18), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.38), rgba(255,255,255,.135)) !important;
  box-shadow:
    0 18px 52px rgba(83, 51, 49, .095),
    inset 0 1px 0 rgba(255,255,255,.80),
    inset 0 -14px 30px rgba(88, 56, 56, .036),
    0 0 0 1px rgba(255,255,255,.16) !important;
}

.taplink-main-card::before,
.taplink-contact-card::before {
  inset: 6px !important;
  border-color: rgba(255,255,255,.36) !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,0) 42%),
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.18), transparent 28%) !important;
}

.taplink-logo {
  margin-bottom: 19px !important;
  font-size: clamp(23px, 6.35vw, 30px) !important;
  letter-spacing: .215em !important;
  color: rgba(76, 62, 60, .74) !important;
}

.taplink-menu {
  gap: 9px !important;
}

.taplink-btn {
  min-height: 49px !important;
  padding: 11px 15px !important;
  font-size: 15.8px !important;
  border-color: rgba(255,255,255,.58) !important;
  background:
    radial-gradient(circle at 92% 14%, rgba(210,252,249,.22), transparent 35%),
    radial-gradient(circle at 7% 88%, rgba(255,165,195,.13), transparent 39%),
    linear-gradient(145deg, rgba(255,255,255,.30), rgba(255,255,255,.105)) !important;
  box-shadow:
    0 8px 21px rgba(74, 48, 46, .052),
    inset 0 1px 0 rgba(255,255,255,.76),
    inset 0 -9px 20px rgba(77, 50, 50, .036),
    0 0 0 1px rgba(255,255,255,.10) !important;
}

.taplink-btn::before {
  inset: 4px !important;
  border-color: rgba(255,255,255,.20) !important;
}

.taplink-btn::after {
  left: 17px !important;
  right: 50px !important;
  top: 6px !important;
  opacity: .58 !important;
}

.taplink-arrow {
  font-size: 21px !important;
  color: rgba(55, 47, 46, .40) !important;
}

.taplink-icon {
  width: 26px !important;
  height: 26px !important;
  margin-left: -2px !important;
  font-size: 12px !important;
  opacity: .88 !important;
  background:
    radial-gradient(circle at 30% 22%, rgba(255,255,255,.58), rgba(255,255,255,0) 38%),
    linear-gradient(145deg, rgba(198,154,226,.58), rgba(232,132,176,.62)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.48),
    0 5px 11px rgba(173, 92, 141, .09) !important;
}

.taplink-full-site {
  margin-top: 12px !important;
  min-height: 66px !important;
  padding: 12px 13px !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 11% 12%, rgba(255,255,255,.14), transparent 34%),
    radial-gradient(circle at 92% 16%, rgba(216,248,244,.10), transparent 40%),
    linear-gradient(145deg, rgba(80, 66, 62, .86), rgba(61, 50, 48, .88)) !important;
  box-shadow:
    0 12px 28px rgba(62, 42, 40, .135),
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -12px 24px rgba(0,0,0,.15) !important;
}

.taplink-bag,
.taplink-full-arrow {
  width: 29px !important;
  height: 29px !important;
}

.taplink-full-title {
  font-size: 15.5px !important;
}

.taplink-full-subtitle {
  max-width: 250px !important;
  font-size: 10.2px !important;
  line-height: 1.23 !important;
}

.taplink-contact-card {
  margin-top: 14px !important;
  padding: 19px 12px 16px !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 86% 4%, rgba(205,252,249,.24), transparent 38%),
    radial-gradient(circle at 8% 92%, rgba(255,155,186,.16), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.35), rgba(255,255,255,.12)) !important;
}

.taplink-section-title {
  margin-bottom: 14px !important;
  font-size: clamp(25px, 7.2vw, 32px) !important;
  color: rgba(42,35,34,.86) !important;
}

.taplink-section-title::after {
  right: 12px !important;
  top: 1px !important;
  font-size: 12px !important;
  opacity: .76 !important;
}

.taplink-contact-list {
  gap: 9px !important;
}

.taplink-contact-note {
  margin-top: 13px !important;
  max-width: 300px !important;
  font-size: 12.8px !important;
  color: rgba(70, 58, 57, .46) !important;
}

@media (max-width: 430px) {
  .taplink-page {
    padding: 14px 12px 26px !important;
  }

  .taplink-main-card {
    padding: 22px 11px 14px !important;
    border-radius: 31px !important;
  }

  .taplink-logo {
    font-size: 25px !important;
    margin-bottom: 18px !important;
  }

  .taplink-btn {
    min-height: 48px !important;
    padding: 10px 14px !important;
    font-size: 15.5px !important;
  }

  .taplink-full-site {
    min-height: 64px !important;
  }

  .taplink-contact-card {
    padding: 18px 11px 15px !important;
  }
}

@media (max-width: 360px) {
  .taplink-logo {
    font-size: 22px !important;
    letter-spacing: .18em !important;
  }

  .taplink-btn {
    min-height: 47px !important;
    font-size: 14.7px !important;
  }

  .taplink-full-subtitle {
    font-size: 9.8px !important;
  }
}
/* === EIDOS’CHIC TAPLINK GLASS V14 OVERRIDES END === */

/* === TELEGRAM ICON V15 START === */
/* Правильная узнаваемая Telegram-иконка: голубой круг + белый самолётик */

.taplink-icon-telegram {
  width: 28px !important;
  height: 28px !important;
  margin-left: -2px !important;
  padding: 0 !important;
  overflow: hidden !important;

  background:
    radial-gradient(circle at 30% 22%, rgba(255,255,255,.42), rgba(255,255,255,0) 32%),
    linear-gradient(145deg, #2db7f5 0%, #229ed9 56%, #168ac4 100%) !important;

  border: 1px solid rgba(255,255,255,.52) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.42),
    inset 0 -4px 9px rgba(0,72,120,.18),
    0 6px 14px rgba(34,158,217,.18) !important;
}

.taplink-icon-telegram svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  transform: translate(-.5px, .3px) rotate(-2deg) !important;
  fill: #ffffff !important;
}

.taplink-icon-telegram path {
  fill: #ffffff !important;
}
/* === TELEGRAM ICON V15 END === */

/* === SOCIAL ORIGINAL ICONS V16 START === */

.taplink-icon-img {
  flex: 0 0 auto !important;
  display: grid !important;
  place-items: center !important;
  width: 28px !important;
  height: 28px !important;
  margin-left: -2px !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.taplink-icon-img img {
  display: block !important;
  width: 28px !important;
  height: 28px !important;
  object-fit: contain !important;
}

.taplink-icon-telegram img {
  border-radius: 999px !important;
  filter: drop-shadow(0 5px 10px rgba(34,158,217,.18)) !important;
}

.taplink-icon-max {
  border-radius: 8px !important;
  overflow: hidden !important;
}

.taplink-icon-max img {
  width: 28px !important;
  height: 28px !important;
  border-radius: 8px !important;
  object-fit: cover !important;
  filter: drop-shadow(0 5px 10px rgba(137,75,210,.15)) !important;
}

.taplink-icon-whatsapp img {
  width: 29px !important;
  height: 29px !important;
  filter: drop-shadow(0 5px 10px rgba(37,211,102,.16)) !important;
}

/* === SOCIAL ORIGINAL ICONS V16 END === */

/* === MAX ICON CLEAN V18 START === */
/* Убираем визуальный чёрный кант MAX-иконки за счёт внутреннего crop + увеличения изображения */

.taplink-icon-max {
  width: 30px !important;
  height: 30px !important;
  margin-left: -3px !important;

  display: grid !important;
  place-items: center !important;

  overflow: hidden !important;
  border-radius: 10px !important;

  background:
    linear-gradient(145deg, #1faeff 0%, #3957ff 42%, #9a55e8 100%) !important;

  border: 0 !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.36),
    0 5px 12px rgba(87, 84, 220, .13) !important;
}

.taplink-icon-max img {
  width: 38px !important;
  height: 38px !important;
  max-width: none !important;
  max-height: none !important;

  object-fit: cover !important;
  object-position: center center !important;

  transform: scale(1.18) !important;
  transform-origin: center center !important;

  border-radius: 12px !important;
  filter: none !important;
}

/* На всякий случай убираем старые тени/рамки, которые могли давать эффект ободка */
.taplink-icon-max,
.taplink-icon-max::before,
.taplink-icon-max::after,
.taplink-icon-max img {
  outline: none !important;
}
/* === MAX ICON CLEAN V18 END === */

/* === MAX REAL ICON V19 START === */
/* MAX: используем качественную иконку как есть, без crop, без scale, без обрезки */

.taplink-icon-max {
  width: 30px !important;
  height: 30px !important;
  margin-left: -2px !important;
  padding: 0 !important;

  display: grid !important;
  place-items: center !important;

  overflow: visible !important;
  border-radius: 9px !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.taplink-icon-max img {
  display: block !important;
  width: 30px !important;
  height: 30px !important;

  max-width: 30px !important;
  max-height: 30px !important;

  object-fit: contain !important;
  object-position: center center !important;

  transform: none !important;
  border-radius: 9px !important;
  filter: drop-shadow(0 5px 10px rgba(102, 80, 210, .13)) !important;
}
/* === MAX REAL ICON V19 END === */

/* === MAX ORIGINAL PNG V20 START === */

.taplink-icon-max {
  width: 30px !important;
  height: 30px !important;
  margin-left: -2px !important;
  padding: 0 !important;

  display: grid !important;
  place-items: center !important;

  overflow: visible !important;
  border-radius: 9px !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.taplink-icon-max img {
  display: block !important;
  width: 30px !important;
  height: 30px !important;

  max-width: 30px !important;
  max-height: 30px !important;

  object-fit: contain !important;
  object-position: center center !important;

  transform: none !important;
  border-radius: 9px !important;
  filter: none !important;
}
/* === MAX ORIGINAL PNG V20 END === */