/* ============================================
"Исцеляющие беседы о себе" — стили для Tilda
Вставить в HTML-блок внутри тега
либо в настройках страницы Tilda (Доп. код -> CSS)
============================================ */
#iboc-root, #iboc-root *, #iboc-root *::before, #iboc-root *::after {
box-sizing: border-box;
}
#iboc-root {
--ibo-accent: #34C759;
--ibo-accent-dark: #1F8A3D;
--ibo-accent-light: #5ED17A;
--ibo-bg: #0E0D11;
--ibo-bg-2: #17151B;
--ibo-bg-light: #EDEAE5;
--ibo-text: #EDEAE5;
--ibo-text-muted: #A79E93;
--ibo-text-dim: #6E665E;
--ibo-border: #232028;
background: var(--ibo-bg);
color: var(--ibo-text);
font-family: 'Manrope', Arial, sans-serif;
line-height: 1.4;
}
#iboc-root a { color: inherit; text-decoration: none; }
#iboc-root a:hover { opacity: 0.85; }
#iboc-root h1, #iboc-root h2, #iboc-root h3 {
font-family: 'Unbounded', Arial, sans-serif;
font-weight: 700;
margin: 0;
overflow-wrap: break-word;
}
#iboc-root p, #iboc-root span, #iboc-root div, #iboc-root li { overflow-wrap: break-word; }
#iboc-root ::selection { background: var(--ibo-accent); color: #fff; }
/* ---------- layout helpers ---------- */
.ibo-page { width: 100%; display: flex; flex-direction: column; align-items: stretch; }
.ibo-section { width: 100%; box-sizing: border-box; padding: 90px 48px; display: flex; justify-content: center; }
.ibo-section--light { background: var(--ibo-bg-light); }
.ibo-section--alt { background: var(--ibo-bg-2); }
.ibo-wrap { width: 100%; }
.ibo-wrap--640 { max-width: 640px; }
.ibo-wrap--720 { max-width: 720px; }
.ibo-wrap--760 { max-width: 760px; }
.ibo-wrap--780 { max-width: 780px; }
.ibo-wrap--820 { max-width: 820px; }
.ibo-wrap--960 { max-width: 960px; }
.ibo-col { display: flex; flex-direction: column; }
.ibo-center { text-align: center; }
.ibo-eyebrow {
font-size: 13px;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--ibo-accent-dark);
font-weight: 700;
}
.ibo-section--alt .ibo-eyebrow,
.ibo-section:not(.ibo-section--light) .ibo-eyebrow {
color: var(--ibo-accent-light);
}
/* ---------- buttons ---------- */
.ibo-btn {
display: inline-block;
background: var(--ibo-accent);
color: #fff !important;
padding: 17px 42px;
border-radius: 999px;
font-size: 16px;
font-weight: 700;
font-family: 'Manrope', Arial, sans-serif;
border: none;
cursor: pointer;
text-align: center;
}
.ibo-btn:hover { background: var(--ibo-accent-dark); opacity: 1; }
.ibo-btn--sm { padding: 11px 24px; font-size: 14px; font-weight: 600; }
.ibo-btn--lg { padding: 19px 46px; font-size: 17px; }
/* ---------- nav ---------- */
.ibo-nav {
width: 100%;
box-sizing: border-box;
padding: 22px 48px;
display: flex;
justify-content: space-between;
align-items: center;
position: sticky;
top: 0;
background: rgba(14,13,17,0.88);
backdrop-filter: blur(8px);
z-index: 10;
border-bottom: 1px solid var(--ibo-border);
}
.ibo-nav__logo {
font-family: 'Unbounded', Arial, sans-serif;
font-size: 16px;
font-weight: 700;
letter-spacing: 0.02em;
text-transform: uppercase;
color: var(--ibo-text);
}
/* ---------- hero ---------- */
.ibo-hero {
width: 100%;
min-height: 660px;
box-sizing: border-box;
padding: 48px 48px 64px;
display: flex;
align-items: flex-start;
justify-content: flex-start;
position: relative;
overflow: hidden;
filter: grayscale(0.15);
background-image: linear-gradient(90deg, rgba(14,13,17,0.96) 0%, rgba(14,13,17,0.82) 42%, rgba(14,13,17,0.35) 75%, rgba(14,13,17,0.15) 100%), url('https://static.tildacdn.com/tild6235-6632-4661-b565-306664613734/2026-09-29_164043.jpg');
background-size: cover;
background-position: 75% 28%;
}
.ibo-hero__inner {
position: relative;
z-index: 1;
max-width: 560px;
display: flex;
flex-direction: column;
align-items: flex-start;
text-align: left;
gap: 30px;
}
.ibo-hero__eyebrow {
font-size: 13px;
letter-spacing: 0.16em;
text-transform: uppercase;
color: var(--ibo-accent-light);
font-weight: 700;
}
.ibo-hero__title {
font-size: 58px;
line-height: 1.1;
text-transform: uppercase;
color: var(--ibo-accent);
text-shadow: 0 2px 24px rgba(0,0,0,0.5);
}
.ibo-hero__text {
margin-top: 70px;
font-size: 19px;
line-height: 1.6;
color: #E8E3DB;
text-shadow: 0 1px 12px rgba(0,0,0,0.6);
}
.ibo-hero__btn { margin-top: 16px; }
.ibo-hero__meta { margin-top: 6px; font-size: 14px; color: #C7C0B8; }
/* ---------- typography blocks ---------- */
.ibo-h2 { font-size: 30px; text-transform: uppercase; }
.ibo-h2--hook { font-size: 32px; line-height: 1.3; text-transform: uppercase; color: #0E0D11; }
.ibo-h2--statement { font-size: 30px; line-height: 1.4; text-transform: uppercase; color: #0E0D11; }
.ibo-text { font-size: 18px; line-height: 1.7; color: #3A342C; }
.ibo-section:not(.ibo-section--light) .ibo-text { color: #C7C0B8; }
.ibo-text--strong { font-size: 18px; line-height: 1.7; color: var(--ibo-text); font-weight: 600; }
.ibo-quote-box {
display: flex;
flex-direction: column;
gap: 14px;
margin-top: 8px;
padding: 26px 28px;
background: var(--ibo-bg);
border-radius: 20px;
}
.ibo-quote-box p { margin: 0; font-size: 17px; color: var(--ibo-text); }
/* ---------- tags ---------- */
.ibo-tags { display: flex; flex-wrap: wrap; gap: 10px; }
.ibo-tag {
padding: 9px 20px;
border: 1.5px solid var(--ibo-accent);
color: var(--ibo-accent-light);
border-radius: 999px;
font-size: 15px;
}
/* ---------- timeline (how it works) ---------- */
.ibo-timeline { display: flex; flex-direction: column; }
.ibo-timeline__step { display: flex; gap: 24px; align-items: flex-start; }
.ibo-timeline__node { display: flex; flex-direction: column; align-items: center; flex-shrink: 0; }
.ibo-timeline__circle {
width: 56px; height: 56px; border-radius: 50%;
background: var(--ibo-accent);
display: flex; align-items: center; justify-content: center;
font-family: 'Unbounded', Arial, sans-serif;
font-size: 18px; font-weight: 700; color: #0E0D11;
flex-shrink: 0;
}
.ibo-timeline__line { width: 2px; flex: 1; min-height: 36px; background: var(--ibo-accent); opacity: 0.4; margin: 6px 0; }
.ibo-timeline__text { margin: 0 0 24px; padding-top: 14px; font-size: 17px; line-height: 1.5; color: #fff; font-weight: 600; }
.ibo-timeline__step:last-child .ibo-timeline__text { margin-bottom: 0; }
/* ---------- cards list (what you get) ---------- */
.ibo-cards { display: flex; flex-direction: column; gap: 14px; }
.ibo-card { padding: 18px 22px; background: var(--ibo-bg-2); border-radius: 14px; border: 1px solid var(--ibo-border); }
.ibo-card p { margin: 0; font-size: 17px; line-height: 1.5; color: var(--ibo-text); }
.ibo-highlight {
margin-top: 8px;
padding: 24px 26px;
border-left: 3px solid var(--ibo-accent);
background: var(--ibo-bg-2);
border-radius: 4px;
}
.ibo-highlight p { margin: 0; font-size: 17px; line-height: 1.6; color: var(--ibo-text); font-weight: 700; }
/* ---------- why maya ---------- */
.ibo-maya { display: flex; gap: 44px; align-items: flex-start; flex-wrap: wrap; width: 100%; }
.ibo-maya__photo {
width: 220px; height: 300px; object-fit: cover; object-position: top center;
border-radius: 16px; flex-shrink: 0; filter: grayscale(1);
}
.ibo-maya__content { flex: 1; min-width: 280px; display: flex; flex-direction: column; gap: 16px; }
.ibo-maya__name { margin: 0; font-size: 17px; font-weight: 700; color: var(--ibo-accent-light); }
.ibo-maya__content p.ibo-p { margin: 0; font-size: 17px; line-height: 1.7; color: var(--ibo-text); }
.ibo-maya__content p.ibo-p--strong { font-weight: 700; }
.ibo-pricing-note { margin-top: 12px; padding: 20px 22px; background: var(--ibo-bg-2); border-radius: 14px; border: 1px solid var(--ibo-border); }
.ibo-pricing-note p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--ibo-text-muted); }
.ibo-pricing-note p + p { margin-top: 12px; }
.ibo-credentials-lead { margin: 16px 0 0; font-size: 14px; line-height: 1.6; color: var(--ibo-text-dim); }
.ibo-credentials-list { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; font-size: 14px; line-height: 1.6; color: var(--ibo-text-muted); }
/* ---------- positioning statement ---------- */
.ibo-positioning p { margin: 0; font-size: 22px; line-height: 1.6; color: var(--ibo-text); font-weight: 600; }
/* ---------- organizational info ---------- */
.ibo-org-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; width: 100%; }
.ibo-org-card { padding: 24px; background: var(--ibo-bg-2); border-radius: 16px; border: 1px solid var(--ibo-border); }
.ibo-org-card__label { font-size: 12px; color: var(--ibo-accent-light); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 8px; }
.ibo-org-card__value { font-size: 18px; font-weight: 600; color: var(--ibo-text); }
/* ---------- FAQ ---------- */
.ibo-faq-list { display: flex; flex-direction: column; gap: 22px; }
.ibo-faq-item__q { font-size: 17px; font-weight: 700; margin-bottom: 6px; color: var(--ibo-text); }
.ibo-faq-item__a { margin: 0; font-size: 16px; line-height: 1.6; color: var(--ibo-text-muted); }
.ibo-faq-closing { margin: 8px 0 0; font-size: 17px; line-height: 1.6; color: var(--ibo-text); font-weight: 600; text-align: center; }
/* ---------- final CTA ---------- */
.ibo-final { width: 100%; box-sizing: border-box; padding: 110px 48px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 24px; background: var(--ibo-bg); }
.ibo-final__title { font-size: 38px; color: var(--ibo-text); max-width: 700px; line-height: 1.3; text-transform: uppercase; }
.ibo-final__text { margin: 0; font-size: 18px; color: var(--ibo-text-muted); max-width: 560px; line-height: 1.6; }
.ibo-final__contact { margin: 0; font-size: 14px; color: var(--ibo-text-dim); }
/* ---------- footer ---------- */
.ibo-footer { width: 100%; box-sizing: border-box; padding: 32px 48px; display: flex; justify-content: center; background: var(--ibo-bg); border-top: 1px solid var(--ibo-border); }
.ibo-footer p { font-size: 13px; color: var(--ibo-text-dim); margin: 0; }
/* ============================================
Адаптив для мобильных
============================================ */
@media (max-width: 680px) {
#iboc-root h1 { font-size: 34px !important; line-height: 1.18 !important; }
#iboc-root h2 { font-size: 22px !important; line-height: 1.3 !important; }
#iboc-root p { font-size: 15px !important; }
.ibo-section { padding: 48px 20px !important; }
.ibo-final { padding: 56px 20px !important; }
.ibo-footer { padding: 22px 20px !important; }
.ibo-nav { padding: 14px 20px !important; }
.ibo-hero {
min-height: 700px !important;
padding: 32px 20px 48px !important;
background-position: 68% 40% !important;
background-image: linear-gradient(180deg, rgba(14,13,17,0.35) 0%, rgba(14,13,17,0.62) 48%, rgba(14,13,17,0.94) 80%), url('https://static.tildacdn.com/tild3434-3466-4636-a639-656639363333/2026-09-29_163848.jpg') !important;
}
.ibo-hero__inner { max-width: 100% !important; }
.ibo-timeline { max-width: 100% !important; }
.ibo-org-grid { grid-template-columns: 1fr !important; }
.ibo-maya__photo { width: 140px !important; height: 190px !important; }
.ibo-btn { padding: 10px 18px !important; font-size: 13px !important; }
.ibo-btn--lg, .ibo-hero__btn, .ibo-org-cta, .ibo-final .ibo-btn { padding: 15px 32px !important; font-size: 15px !important; }
}