/* ==========================================================================
   Компонент: люлката на Нютон (inc/cradle.php, [ih_cradle variant="hero|mini|404"]) – мокъп v1.14
   SVG-то не е елемент на Bricks, а Bricks извежда CSS на глобален клас само като .клас.brxe-<елемент> –
   затова и размерите на малките (ih-final__mark, ih-notfound__mark) са тук, не в глобалните класове.
   ========================================================================== */

.ih-cradle {
	width: 72%;
	height: auto;
	overflow: visible;
}

.ih-cradle.ih-final__mark {
	width: 9.6rem;
}

.ih-cradle.ih-notfound__mark {
	width: 16rem;
}

.ih-cradle__frame {
	fill: none;
	stroke: var(--ih-color-ink);
	stroke-width: 6;
	stroke-linecap: round;
}

.ih-cradle__string {
	stroke: var(--ih-color-ink);
	stroke-width: 3;
}

.ih-cradle__ball {
	fill: var(--ih-color-surface);
	stroke: url(#ih-cradle-grad);
	stroke-width: 6;
}

.ih-cradle--light .ih-cradle__frame,
.ih-cradle--light .ih-cradle__string {
	stroke: var(--ih-color-surface);
}

.ih-cradle--light .ih-cradle__ball {
	fill: var(--ih-color-ink);
	stroke: var(--ih-color-surface);
}

/* Малката люлка е 9.6rem – по-дебели линии, за да се четат като знака. */
.ih-final__mark .ih-cradle__frame { stroke-width: 12; }
.ih-final__mark .ih-cradle__string { stroke-width: 6; }
.ih-final__mark .ih-cradle__ball { stroke-width: 10; }

.ih-notfound__ball {
	stroke: url(#ih-cradle-grad-404);
}

/* Hero: обвивката на Shortcode елемента е елементът в решетката (вместо display: contents от base.css) –
   така кутията с aspect-ratio расте с люлката както в мокъпа (на 991 люлката е по-висока от 16:10). */
.ih-hero__visual > .brxe-shortcode {
	display: block;
	width: 72%;
}

.ih-hero__visual > .brxe-shortcode > .ih-cradle {
	display: block;
	width: 100%;
}

/* Телефон: само люлката в hero е по-малка (HANDOFF т. 40 – в мокъпа правилото засягаше и малките). */
@media (max-width: 767px) {
	.ih-hero__visual > .brxe-shortcode {
		width: 56%;
	}
}