/* Секции шаблона, скрытые до появления реального контента (см. ТЗ). Чтобы вернуть секцию — удалите её строку. */

/* Главная */
.framer-dqrnmk,            /* логотипы клиентов — нет логотипов и согласования */
.framer-9f10x7,            /* toolkit и проценты навыков */
.framer-9w2nnd,            /* таймлайн карьеры */
.framer-10xcqke,           /* статистика (3 года, 95%) */
.framer-11cicqo,           /* отзывы */
.framer-1evwntt,           /* Journal / блог */
.framer-homyyp,            /* тарифы */
.framer-qsesnd-container,  /* кнопка «Praxis template» */

/* Страница кейса */
.framer-qlftoi,            /* заголовок FAQ */
.framer-14g45vd,           /* список FAQ */
.framer-1gifwgm,           /* заголовок FAQ (мобильная версия) */

/* Везде */
.framer-d8p7vq             /* подписка на рассылку */
{ display: none !important; }

/* Третья соцсеть (Dribbble) — оставлены только Telegram и WhatsApp */
[class*="-container"]:has(> a[href*="dribbble.com"]) { display: none !important; }

/* Кнопка «Все проекты» под карточками на главной */
.framer-allprojects { align-self: center; }

/* Плашка «Made in Framer» */
#__framer-badge-container { display: none !important; }

/* Футер: вместо подписи шаблона — копирайт (исходная строка копирайта в карточке скрыта) */
.framer-1164cpt { display: none !important; }
.framer-z99530 { pointer-events: none; }
.framer-z99530 > :not(:first-child) { display: none !important; }
.framer-z99530 p { --framer-text-color: rgba(255, 255, 255, 0.9) !important; color: rgba(255, 255, 255, 0.9) !important; }  /* на тёмном низе градиента */

/* Первый экран: бейдж на всю высоту экрана, текст сгруппирован внизу карточки */
.framer-1qnt9k8 { min-height: min(calc(100svh - 144px - 24px), 900px); }  /* 144px — отступ под шнурок */
.framer-1rmunxm { flex: 1 0 auto !important; gap: 20px !important; padding: 28px 44px 40px !important; }
.framer-jdh0t8 h1 { --framer-font-size: clamp(36px, 5.8vh, 58px) !important; }
/* Нижняя группа: «10+ лет» → заголовок → подзаголовок → кнопки. Frame 136 «раскрыт», чтобы плашку можно было поставить над заголовком */
.framer-14fbrn5 { display: contents !important; }
.framer-6hj72 { order: 2; margin-top: auto !important; align-items: center !important; padding: 9px 16px !important; }
.framer-56y8sl { display: none !important; }                        /* без звёздочек — только «10+ лет в дизайне» */
.framer-juab96 p { --framer-font-size: 14px !important; }  /* воздух между шапкой и нижней группой */
.framer-jdh0t8 { order: 3; margin-top: -4px !important; }
.framer-30qsbh { order: 4; margin-top: -6px !important; }          /* заголовок ближе к подзаголовку */
.framer-qkek7f { order: 5; margin-top: 28px !important; flex-wrap: wrap !important; overflow: visible !important; }  /* группа текста чуть выше, кнопки ниже */
.framer-qfnzij, .framer-6hj72 { opacity: 1 !important; }         /* слоты и «10+ лет» (без SSR-анимации оставались прозрачными) */

/* Почта в футере: обычный текст вместо «подгонки» Framer, которая обрезала буквы */
.framer-1f5q9f7 p { --framer-font-size: clamp(22px, 6vw, 32px) !important; --framer-line-height: 1.25 !important; }

/* «Избранные проекты»: подзаголовок в две строки, заголовок ближе к карточкам */
.framer-169wap6 { width: min(400px, 100%) !important; max-width: none !important; }
.framer-fn7k3s { margin-bottom: -24px !important; }
@media (max-width: 609px) { .framer-fn7k3s { margin-bottom: -18px !important; } }

/* Аккордеоны: ответы с более свободным межстрочным интервалом */
.framer-174t1oc p { --framer-line-height: 1.55 !important; }

/* Аккордеоны: Framer переключает состояние мгновенно, плавность даём CSS-переходами (высоту анимирует accordion.js) */
.framer-174t1oc, .framer-1yk6ndl { transition: opacity .35s ease; }
.framer-1jozgda [data-framer-name="Icon"] *, .framer-3xc66a [data-framer-name="Icon"] * { transition: transform .45s cubic-bezier(.22, 1, .36, 1), opacity .3s ease, background-color .3s ease; }

/* «Чем я могу помочь»: подзаголовок шире, в две строки */
.framer-jsuqpc { width: min(460px, 100%) !important; max-width: none !important; }

/* Кейс: картинка проекта скруглена концентрично стеклянной рамке */
.framer-1c4dtvj { border-radius: 37px !important; }
@media (max-width: 609px) { .framer-1c4dtvj { border-radius: 30px !important; } }

/* Блок «Связаться»: фото, имя и стеклянные кнопки соцсетей внутри карточки */
.framer-1i1h1q5 h2 { --framer-font-size: clamp(28px, 7.6vw, 40px) !important; }  /* «Давайте поработаем вместе» — в две строки */
.framer-hqx796 { width: min(150px, 40vw) !important; height: min(150px, 40vw) !important; border-radius: 50% !important; }
.framer-hqx796 > *, .framer-hqx796 img { width: 100% !important; height: 100% !important; }
.framer-17i3r5r { gap: 12px !important; }
.framer-17i3r5r > [class*="-container"] { width: 52px !important; height: 52px !important; }
.framer-17i3r5r .framer-lusrrk {
  width: 100% !important; height: 100% !important; padding: 14px !important;
  background: var(--accent-grad) !important;                         /* тот же оранжевый, что у кнопки на бейдже */
  box-shadow: 0 8px 18px rgba(185, 73, 43, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.25);
  transition: transform .25s cubic-bezier(.22, 1, .36, 1), box-shadow .25s ease;
}
.framer-17i3r5r .framer-lusrrk:hover { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(185, 73, 43, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.25); }
.framer-17i3r5r .framer-1jpq6j3 { opacity: 1 !important; }
.framer-17i3r5r .framer-1jpq6j3 img { filter: brightness(0) invert(1); }   /* белые иконки */
.framer-17i3r5r .framer-1jpq6j3 { width: 24px !important; height: 24px !important; }

/* Акцент бейджа: глубокий оранжевый градиент (в тон прежней нижней заливке) —
   кнопка «Обсудить проект»; полоски слотов и точка — светлые тона того же оранжевого */
:root { --accent-grad: linear-gradient(100deg, #b3432a 0%, #d35a34 48%, #ec8a52 100%); }
.framer-hjjhhx .framer-xmwbwg { background: var(--accent-grad) !important; box-shadow: 0 10px 24px rgba(185, 73, 43, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.25); }
.framer-hjjhhx .framer-1rk3ce0-container { --token-52aefa32-77ec-4839-a61f-af30919fc997: #cf5a33; }  /* стрелка в белом кружке */
.framer-xnnfrd, .framer-hjnqhx { background: #f5ad7e !important; }   /* полоски слотов: однотонный светло-оранжевый */
.framer-1lblnxw { background: #ec8a52 !important; }

/* Шапка бейджа: полоски → «2 свободных слота для новых проектов» одной строкой →
   аватар с именем и ролью слева, кнопки соцсетей справа */
.framer-zpga6n { flex-direction: column !important; align-items: stretch !important; gap: 18px !important; width: 100% !important; overflow: visible !important; }
.framer-14u87tc { order: -1; align-items: center !important; margin: -12px 0 12px !important; }  /* ближе к полоскам, аватар на месте */
.framer-c6feu6 { display: none !important; }                        /* без точки — текст ровно по левому краю полосок */
.framer-qfnzij { flex-direction: row !important; align-items: baseline; gap: 4px; white-space: nowrap; }
.framer-o39ni0 { width: 100% !important; align-items: center !important; gap: 14px !important; }
.framer-139h0w5 { flex: 1 1 auto !important; width: auto !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; }
.framer-1c9ba9z { width: auto !important; flex: 1 1 0 !important; min-width: 0 !important; }
.framer-1bqh2ze, .framer-zlse1l { width: 100% !important; }
.framer-1bqh2ze p, .framer-zlse1l p { white-space: normal !important; }
.framer-vqge7s { gap: 8px !important; flex: none; }
.framer-vqge7s > [class*="-container"] { width: 40px !important; height: 40px !important; }
.framer-vqge7s .framer-lusrrk { width: 100% !important; height: 100% !important; padding: 10px !important; background-color: #f4f5f7 !important; border-radius: 50% !important; transition: background-color .25s ease; }
.framer-vqge7s .framer-lusrrk:hover { background-color: #eceef2 !important; }
.framer-vqge7s .framer-1jpq6j3 { width: 20px !important; height: 20px !important; opacity: .7 !important; }
@media (max-width: 609px) {
  .framer-vqge7s { gap: 6px !important; }
  .framer-vqge7s > [class*="-container"] { width: 36px !important; height: 36px !important; }
  .framer-vqge7s .framer-lusrrk { padding: 9px !important; }
  .framer-vqge7s .framer-1jpq6j3 { width: 18px !important; height: 18px !important; }
  .framer-o39ni0 { gap: 10px !important; }
  .framer-14u87tc { margin: -8px 0 8px !important; }
  .framer-1mcxvy3 { width: 46px !important; height: 46px !important; }
  .framer-1bqh2ze p { white-space: nowrap !important; --framer-font-size: 18px !important; }
}

/* Локация под карточкой: белый текст и белая иконка (иконка из спрайта с чёрной заливкой — рисуем маской) */
.framer-yetvzf p { --framer-letter-spacing: 0.01em !important; letter-spacing: 0.01em !important; --framer-text-color: rgba(255, 255, 255, 0.88) !important; color: rgba(255, 255, 255, 0.88) !important; text-shadow: 0 1px 2px rgba(12, 16, 24, 0.18); }
.framer-yetvzf p span { --framer-text-color: #ffffff !important; color: #ffffff !important; }
.framer-o6icz7 { gap: 6px !important; align-items: center !important; }
.framer-4p5edh { width: 17px !important; height: 17px !important; display: flex; background: #ffffff; -webkit-mask: url(/_assets/content/icons/location.svg) center / contain no-repeat; mask: url(/_assets/content/icons/location.svg) center / contain no-repeat; }
.framer-4p5edh > * { visibility: hidden !important; }

@media (max-width: 609px) {
  .framer-1qnt9k8 { min-height: calc(100svh - 70px - 16px); }
  .framer-1rmunxm { gap: 16px !important; padding: 18px 24px 28px !important; }
  .framer-jdh0t8 h1 { --framer-font-size: clamp(26px, min(4.4vh, 9vw), 40px) !important; }
}

/* Невысокие экраны: плотнее, чтобы бейдж всё равно помещался */
@media (min-width: 610px) and (max-height: 780px) {
  .framer-qkek7f { margin-top: 10px !important; }
  .framer-1qnt9k8 { padding-bottom: 14px !important; }
  .framer-1rmunxm { gap: 14px !important; padding: 20px 40px 24px !important; }
  .framer-jdh0t8 h1 { --framer-font-size: clamp(30px, 5.3vh, 44px) !important; }
}
@media (max-width: 609px) and (max-height: 720px) {
  .framer-6hj72 { padding: 6px 12px !important; }
  .framer-qkek7f { margin-top: 10px !important; }
  .framer-1qnt9k8 { padding-bottom: 14px !important; }
  .framer-1rmunxm { gap: 10px !important; padding: 12px 20px 14px !important; }
  .framer-jdh0t8 h1 { --framer-font-size: clamp(25px, min(4.1vh, 8.5vw), 30px) !important; }
}

/* На узких экранах (<380px) шаблон шире экрана на несколько пикселей — без горизонтального скролла */
html, body { overflow-x: clip; }

/* Фон-градиенты в духе newgenre.studio (границы считает gradient.js).
   Точки цвета расставлены с плавным замедлением к белому, чтобы не было видимой границы.
   — везде: блок «Связаться» снизу от тёмного (умбра → ночной синий) к белому наверху блока;
   — главная: сверху тёмный → синий → белый к блоку «Чем я могу помочь»;
   — кейсы: сверху тот же тёмный градиент до названия проекта (не ниже первого экрана).
   Чтобы убрать — удалите этот блок. */
body { background-color: #ffffff !important; }
#main > div:first-child {
  background:
    linear-gradient(0deg, #280e01 0%, #201a22 6%, #182644 12%, #2a3d62 19%, #3d5480 26%, #48628c 34%, #536f99 42%, #617ea8 49%, #6f8db6 56%, #819dc2 62%, #97b0d1 68%, #b1c5de 74%, #ccdaea 80%, #e0e9f3 85%, #f0f4f9 90%, #f9fbfd 94%, #fefefe 97%, #ffffff 100%) bottom / 100% var(--contact-h, 1200px) no-repeat,
    #ffffff !important;
}
body[class*="framer-body-augiA20Il"] #main > div:first-child {
  background:
    linear-gradient(180deg, #280e01 0%, #201a22 6%, #182644 12%, #2a3d62 19%, #3d5480 26%, #48628c 34%, #536f99 42%, #617ea8 49%, #6f8db6 56%, #819dc2 62%, #97b0d1 68%, #b1c5de 74%, #ccdaea 80%, #e0e9f3 85%, #f0f4f9 90%, #f9fbfd 94%, #fefefe 97%, #ffffff 100%) top / 100% var(--blue-end, 200vh) no-repeat,
    linear-gradient(0deg, #280e01 0%, #201a22 6%, #182644 12%, #2a3d62 19%, #3d5480 26%, #48628c 34%, #536f99 42%, #617ea8 49%, #6f8db6 56%, #819dc2 62%, #97b0d1 68%, #b1c5de 74%, #ccdaea 80%, #e0e9f3 85%, #f0f4f9 90%, #f9fbfd 94%, #fefefe 97%, #ffffff 100%) bottom / 100% var(--contact-h, 1200px) no-repeat,
    #ffffff !important;
}
body[class*="framer-body-gfi7VWATb"] #main > div:first-child {
  background:
    linear-gradient(180deg, #280e01 0%, #201a22 6%, #182644 12%, #2a3d62 19%, #3d5480 26%, #48628c 34%, #536f99 42%, #617ea8 49%, #6f8db6 56%, #819dc2 62%, #97b0d1 68%, #b1c5de 74%, #ccdaea 80%, #e0e9f3 85%, #f0f4f9 90%, #f9fbfd 94%, #fefefe 97%, #ffffff 100%) top / 100% var(--case-end, 100vh) no-repeat,
    linear-gradient(0deg, #280e01 0%, #201a22 6%, #182644 12%, #2a3d62 19%, #3d5480 26%, #48628c 34%, #536f99 42%, #617ea8 49%, #6f8db6 56%, #819dc2 62%, #97b0d1 68%, #b1c5de 74%, #ccdaea 80%, #e0e9f3 85%, #f0f4f9 90%, #f9fbfd 94%, #fefefe 97%, #ffffff 100%) bottom / 100% var(--contact-h, 1200px) no-repeat,
    #ffffff !important;
}

/* Страница «Проекты»: как блок проектов на главной — синий градиент от верха до блока «Связаться» */
body[class*="framer-body-sKLLAKmF_"] #main > div:first-child {
  background:
    linear-gradient(180deg, #280e01 0%, #201a22 6%, #182644 12%, #2a3d62 19%, #3d5480 26%, #48628c 34%, #536f99 42%, #617ea8 49%, #6f8db6 56%, #819dc2 62%, #97b0d1 68%, #b1c5de 74%, #ccdaea 80%, #e0e9f3 85%, #f0f4f9 90%, #f9fbfd 94%, #fefefe 97%, #ffffff 100%) top / 100% calc(100% - var(--contact-h, 1200px)) no-repeat,
    linear-gradient(0deg, #280e01 0%, #201a22 6%, #182644 12%, #2a3d62 19%, #3d5480 26%, #48628c 34%, #536f99 42%, #617ea8 49%, #6f8db6 56%, #819dc2 62%, #97b0d1 68%, #b1c5de 74%, #ccdaea 80%, #e0e9f3 85%, #f0f4f9 90%, #f9fbfd 94%, #fefefe 97%, #ffffff 100%) bottom / 100% var(--contact-h, 1200px) no-repeat,
    #ffffff !important;
}

/* «Избранные проекты» (главная) и страница «Проекты» на синем — белый заголовок и подзаголовок */
.framer-1j1rcpf h2, .framer-5a00kq h1 { --framer-text-color: #ffffff !important; color: #ffffff !important; }
.framer-169wap6 p, .framer-hskrmm p { --framer-text-color: rgba(255, 255, 255, 0.92) !important; color: rgba(255, 255, 255, 0.92) !important; }

/* Бейдж на первом экране и карточка «Связаться»: рамка вокруг белой карточки — полупрозрачное «стекло» вместо серой.
   isolation + clip по скруглению — чтобы размытие не вылезало за углы */
.framer-1qnt9k8, .framer-3r4k1m, .framer-19f95a1 {
  isolation: isolate;
  overflow: clip;
  background-clip: padding-box;
  background-color: rgba(255, 255, 255, 0.28) !important;
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  backdrop-filter: blur(18px) saturate(160%);
  --border-color: rgba(255, 255, 255, 0.55) !important;
  box-shadow: 0 20px 60px rgba(12, 16, 24, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.6);
}
.framer-1qnt9k8, .framer-19f95a1 { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6) !important; }  /* внешнюю тень режет родитель — без неё нет артефактов */
.framer-5hxpow, .framer-16y2off { background-color: rgba(255, 255, 255, 0.35) !important; }
/* Внутренние белые карточки скруглены концентрично рамке (радиус рамки минус отступ) — ровная полоса стекла в углах */
.framer-1rmunxm, .framer-ag458b { border-radius: 37px !important; }
@media (max-width: 609px) { .framer-1rmunxm, .framer-ag458b { border-radius: 30px !important; } }

/* ===== Страница «Обо мне» (/about): контент задан в about-page.mjs ===== */
.framer-hskrmm { width: min(440px, 100%) !important; max-width: none !important; }  /* подзаголовок страниц «Проекты» и «Обо мне» в две строки */
.about { display: flex; flex-direction: column; gap: 20px; width: 100%; font-family: "Manrope", "Manrope Placeholder", sans-serif; color: #171717; letter-spacing: -0.02em; }
.about-frame {
  padding: 9px; border-radius: 46px; isolation: isolate;
  background: rgba(255, 255, 255, 0.28);
  -webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55);
}
.about-card { background: #fff; border-radius: 37px; padding: 44px 40px 40px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.about-avatar { width: 128px; height: 128px; border-radius: 50%; object-fit: cover; margin-bottom: 18px; }
.about-name { margin: 0; font-size: 32px; font-weight: 600; letter-spacing: -0.04em; line-height: 1.1; }
.about-role { margin: 8px 0 0; font-size: 16px; font-weight: 600; color: rgba(23, 23, 23, 0.6); }
.about-loc { margin: 6px 0 0; font-size: 14px; font-weight: 500; color: rgba(23, 23, 23, 0.45); }
.about-bio { margin: 22px 0 0; font-size: 17px; font-weight: 500; line-height: 1.55; color: rgba(23, 23, 23, 0.75); max-width: 440px; }

.about-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.about-fact { background: #fff; border-radius: 28px; padding: 20px 18px; display: flex; flex-direction: column; gap: 6px; box-shadow: 0 10px 30px rgba(12, 16, 24, 0.06); }
.about-fact b { font-size: 26px; font-weight: 600; letter-spacing: -0.04em; background: var(--accent-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.about-fact span { font-size: 13px; font-weight: 500; line-height: 1.4; color: rgba(23, 23, 23, 0.6); }

.about-block { background: #fff; border-radius: 37px; padding: 32px 36px; box-shadow: 0 10px 30px rgba(12, 16, 24, 0.06); }
.about-block h3 { margin: 0 0 18px; font-size: 22px; font-weight: 600; letter-spacing: -0.04em; }
.about-tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.about-tags li { padding: 9px 14px; border-radius: 50px; background: #f4f5f7; font-size: 14px; font-weight: 600; }

.about-timeline { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.about-exp { display: grid; grid-template-columns: 96px 1fr; gap: 16px; padding: 18px 0; border-top: 1px solid rgba(23, 23, 23, 0.08); }
.about-exp:first-child { border-top: 0; padding-top: 0; }
.about-exp-period { font-size: 14px; font-weight: 600; color: #cf5a33; padding-top: 3px; }
.about-exp-title { font-size: 18px; font-weight: 600; color: #171717; text-decoration: none; letter-spacing: -0.03em; }
.about-exp-title::after { content: " ↗"; color: #cf5a33; }
.about-exp-title:hover { color: #cf5a33; }
.about-exp p { margin: 6px 0 0; font-size: 15px; font-weight: 500; line-height: 1.5; color: rgba(23, 23, 23, 0.65); }

@media (max-width: 609px) {
  .about { padding: 0 8px; box-sizing: border-box; }
  .about-frame { padding: 6px; border-radius: 36px; }
  .about-card { border-radius: 30px; padding: 32px 22px 28px; }
  .about-avatar { width: 104px; height: 104px; }
  .about-name { font-size: 26px; }
  .about-bio { font-size: 15px; }
  .about-facts { grid-template-columns: 1fr; }
  .about-fact { flex-direction: row; align-items: baseline; gap: 12px; padding: 16px 20px; }
  .about-fact b { font-size: 22px; flex: none; }
  .about-block { border-radius: 30px; padding: 26px 22px; }
  .about-exp { grid-template-columns: 1fr; gap: 4px; }
}
