/* Дизайн сайта ЛогоНани — по скилу logonani-design и её «Визуальной базе» (пример 2).
   Один шрифт Involve, шесть цветов, контраст светлого и тёмного,
   розовый маркер под 1–2 словами, ярлыки-таблетки, номера в розовых кружках, оливковые галочки. */
:root{
  --grafit:#1F1D1D; --moloko:#FFF9F5; --roza:#D9869E; --roza-sv:#F4D6DF; --oliva:#7E8B72; --seryj:#B8AEA8;
  --tekst-2:rgba(31,29,29,0.78);
}

/* Маркер под ключевым словом (как «УДЕРЖАТЬ» в её примере) */
.marker{background:linear-gradient(transparent 55%,var(--roza-sv) 55%,var(--roza-sv) 92%,transparent 92%);padding:0 4px;margin:0 -4px;-webkit-box-decoration-break:clone;box-decoration-break:clone;}

/* Ярлык-таблетка: «КАК Я РАБОТАЮ», «ИГРА» */
.yarlyk{display:inline-flex;align-items:center;gap:8px;background:var(--roza);color:var(--moloko) !important;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;font-size:0.875em;line-height:1;padding:8px 16px;border-radius:999px;margin:0 0 16px !important;}
.yarlyk.svetlyj{background:var(--roza-sv);color:var(--grafit) !important;}

/* Номер в розовом кружке */
.krug{width:48px;height:48px;flex:none;border-radius:50%;background:var(--roza);color:var(--moloko);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:20px;line-height:1;margin:0 0 16px;}

/* Оливковая галочка перед строкой */
.galka{position:relative;padding-left:32px !important;}
.galka::before{content:"";position:absolute;left:0;top:2px;width:22px;height:22px;border-radius:50%;background:var(--oliva) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFF9F5' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/14px no-repeat;}
ul.galki{list-style:none;padding-left:0 !important;}
ul.galki li{position:relative;padding-left:32px;margin:0 0 8px;}
ul.galki li::before{content:"";position:absolute;left:0;top:4px;width:22px;height:22px;border-radius:50%;background:var(--oliva) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFF9F5' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/14px no-repeat;}

/* Тёмная полоса: смена светлого и тёмного по странице */
.temno{background:var(--grafit) !important;color:var(--moloko);}
.temno h2,.temno h3{color:var(--moloko) !important;}
.temno p{color:rgba(255,249,245,0.78) !important;}

/* Карточки: молочная плашка, тонкая линия, мягкая тень */
.plashka{background:var(--moloko);border:1px solid rgba(184,174,168,0.45);border-radius:24px;box-shadow:0 8px 24px rgba(31,29,29,0.06);}

/* Кнопки отвечают на нажатие */
a[style*="border-radius:999px"],button{transition:transform .15s ease,filter .15s ease,background-color .15s ease;}
a[style*="border-radius:999px"]:active,button:active{transform:scale(0.97);}
a[style*="background:#D9869E"]:hover{filter:brightness(0.94);color:var(--moloko) !important;}
a[style*="border:1.5px solid #1F1D1D"]:hover{background:var(--grafit) !important;color:var(--moloko) !important;}

/* «+» в вопросах — розовый кружок */
details summary>span:last-child{width:32px;height:32px;flex:none;border-radius:50%;background:var(--roza-sv);color:var(--grafit) !important;display:inline-flex;align-items:center;justify-content:center;font-size:1.25em !important;line-height:1;transition:transform .2s ease;}
details[open] summary>span:last-child{transform:rotate(45deg);background:var(--roza);color:var(--moloko) !important;}