/* Витрина студии «Ваш сайтик»: почти чёрный текст, фирменный жёлтый (как у плашки «Хочу такой сайт»), плотный гротеск.
   Жёлтый — только как фон (кнопки, подсветки): как цвет текста на светлом он нечитаем. */
:root {
	--bg: #fafaf7;
	--surface: #ffffff;
	--muted: #f1f0ea;
	--ink: #121211;
	--ink-2: #56554f;
	--line: #e3e1d9;
	--dark: #121211;
	--dark-2: #1d1d1b;
	--dark-ink: #f6f5f0;
	--dark-ink-2: #b9b8b0;
	--accent: #ffd23f;
	--accent-soft: #fff4c7;
	--accent-line: rgb(18 18 17 / 18%);
	--font-head: "Manrope", system-ui, sans-serif;
	--head-weight: 800;
	--head-tracking: -0.035em;
	--head-line: 1.03;
	--h1: clamp(2.4rem, 1.3rem + 3.6vw, 4.3rem);
	--h2: clamp(2rem, 1.4rem + 2.4vw, 3.4rem);
	--radius: 16px;
	--radius-lg: 22px;
	--radius-img: 14px;
	--radius-btn: 999px;
	--shadow-sm: 0 1px 2px rgb(18 18 17 / 6%), 0 4px 14px rgb(18 18 17 / 5%);
	--shadow: 0 22px 44px -22px rgb(18 18 17 / 30%);
}
.preset-studio a:hover { color: var(--ink); }
.preset-studio :focus-visible { outline-color: var(--ink); }
.preset-studio h1 strong, .preset-studio h2 strong { font-weight: inherit; background: linear-gradient(transparent 60%, var(--accent) 60%, var(--accent) 92%, transparent 92%); padding: 0 .06em; }
.preset-studio .sf-eyebrow { color: var(--ink); }
.preset-studio .sf-eyebrow::before { width: 10px; height: 10px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px rgb(255 210 63 / 35%); }
.preset-studio .sf-checks li::before { background: var(--accent); }
.preset-studio .sf-checks li::after { background: var(--ink); }
.preset-studio .sf-badge__v, .preset-studio .sf-stat__v, .preset-studio .sf-step::before { color: var(--ink); }
.preset-studio .sf-step::before { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--accent); font: 800 1.05rem/1 var(--font-body); }
.preset-studio .sf-step::after { top: 24px; left: 64px; background: var(--line); }
.preset-studio .sf-feature__ico { background: var(--accent); }
.preset-studio .sf-feature__ico::after { background: var(--ink); }
.preset-studio .sf-pain__a::before { background: var(--ink); }
.preset-studio .sf-card__more a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.preset-studio .sf-btn--primary .wp-block-button__link, .preset-studio .sf-button--primary { box-shadow: 0 10px 24px -14px rgb(18 18 17 / 45%); }
.preset-studio .sf-btn--primary .wp-block-button__link:hover, .preset-studio .sf-button--primary:hover { background: #ffdc66; color: var(--ink); }
.preset-studio .sf-tone--dark .sf-btn--primary .wp-block-button__link { color: var(--ink); }
.preset-studio .sf-nav__list a::after { height: 3px; }
.preset-studio .sf-sec--hero .sf-hero__img img { aspect-ratio: auto; box-shadow: none; border-radius: 0; }
.preset-studio .sf-field input:focus, .preset-studio .sf-field textarea:focus { border-color: var(--ink); box-shadow: 0 0 0 4px var(--accent-soft); }
.preset-studio .sf-option input:checked + span, .preset-studio .sf-chip input:checked + span { border-color: var(--ink); }

/* Первый экран витрины: колонка с макетом шире, макет выходит за правый край контейнера */
@media (min-width: 1024px) {
	.preset-studio .sf-hero__grid { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: 40px; }
	.preset-studio .sf-sec--hero .sf-hero__img { margin-right: calc(-1 * min(8vw, 120px)) !important; }
}
.preset-studio .sf-sec--hero { overflow: hidden; }