/* ==========================================================================
   Главное меню SOLARGY — единая перетекающая панель.
   Файл собран 01.09.2026. Настройки вида — в menu-settings.php.
   ========================================================================== */

/* свои элементы считаем по границе — на сайте сброса может не быть */
.sgm,.sgm *,.sgm *::before,.sgm *::after,
ul.nav.sgm-nav,ul.nav.sgm-nav *,.sgm-glow{box-sizing:border-box}

:root{
	--sgm-orange:#f17e00;
	--sgm-orange-dk:#d97100;
	--sgm-ink:#1d1d1b;
	--sgm-muted:#6b6f6a;
	--sgm-rule:#e7e7e7;
	--sgm-panel:#ffffff;
	--sgm-pad:32px;
	--sgm-rail:258px;
	--sgm-footH:46px;
}

/* ── строка меню ─────────────────────────────────────────────────────── */
/* ВАЖНО: ul и li НЕ трогаем — их раскладку задаёт вёрстка сайта
   (flex, gap 10px, justify-content: space-around, высота строки 26 px).
   Своё добавляем только внутри ссылки: стрелку и подсветку. */
.sgm-nav .sgm-item{
	display:inline-flex;align-items:center;gap:5px;
	text-decoration:none;color:inherit;cursor:pointer;white-space:nowrap;
	transition:color .15s ease;
}
.sgm-nav .sgm-item:hover{color:var(--sgm-orange)}
.sgm-nav .sgm-item .sgm-chev{width:9px;height:9px;opacity:.5;transition:transform .22s ease,opacity .22s ease}
.sgm-nav .sgm-item[aria-expanded="true"]{color:var(--sgm-orange)}
.sgm-nav .sgm-item[aria-expanded="true"] .sgm-chev{transform:rotate(180deg);opacity:1}
.sgm-nav .sgm-item:focus-visible{outline:2px solid var(--sgm-orange);outline-offset:-4px;border-radius:8px}

/* ── панель ──────────────────────────────────────────────────────────── */
.sgm{
	position:fixed;top:0;left:0;z-index:9990;
	transform-origin:top center;will-change:transform,width,height;
}
.sgm[hidden]{display:none !important}
.sgm__arrow{
	position:absolute;top:-7px;width:16px;height:16px;display:block;
	background:var(--sgm-panel);transform:rotate(45deg);border-radius:3px;
}
.sgm__box{
	position:relative;overflow:hidden;width:100%;height:100%;
	background:var(--sgm-panel);border-radius:20px;
	box-shadow:0 26px 64px -20px rgba(0,0,0,.42),0 2px 10px rgba(0,0,0,.10);
}
/* оранжевая подложка низа — страховка на время перетекания */
.sgm__box::after{
	content:"";position:absolute;left:0;right:0;bottom:0;z-index:0;
	height:var(--sgm-footH,0px);background:var(--sgm-orange);pointer-events:none;
}

.sgm[data-state="closed"]{opacity:0;transform:translateY(-6px) scale(.97);pointer-events:none}
.sgm[data-state="open"]{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
.sgm[data-anim="none"]{transition:none}
.sgm[data-anim="open"]{transition:opacity .19s ease,transform .22s cubic-bezier(.2,.8,.2,1)}
.sgm[data-anim="morph"]{transition:opacity .19s ease,transform .34s cubic-bezier(.4,0,.15,1),
	width .34s cubic-bezier(.4,0,.15,1),height .34s cubic-bezier(.4,0,.15,1),left .34s cubic-bezier(.4,0,.15,1)}
.sgm[data-anim="close"]{transition:opacity .15s ease,transform .17s ease}

/* стеклянная подложка */
.sgm.is-glass .sgm__box,.sgm.is-glass .sgm__arrow{
	background:rgba(255,255,255,.74);
	backdrop-filter:blur(26px) saturate(1.5);
	-webkit-backdrop-filter:blur(26px) saturate(1.5);
}
.sgm.is-glass .sgm-quick{background:linear-gradient(180deg,rgba(247,139,29,.94) 0%,rgba(241,126,0,.94) 100%)}

/* формы панели */
.sgm.shape-rect .sgm__box,.sgm.shape-rect .sgm-rail,.sgm.shape-rect .sgm-quick{border-radius:0}
.sgm.shape-full .sgm__box{border-radius:0 0 22px 22px}
.sgm.shape-full .sgm-rail{border-radius:0}
.sgm.shape-full .sgm-quick{border-radius:0 0 22px 22px}
.sgm.shape-full .sgm__arrow{display:none}
.sgm.shape-bevel .sgm__box{
	border-radius:0;
	clip-path:polygon(20px 0,calc(100% - 20px) 0,100% 20px,100% calc(100% - 20px),
		calc(100% - 20px) 100%,20px 100%,0 calc(100% - 20px),0 20px);
}
.sgm.shape-bevel .sgm-rail,.sgm.shape-bevel .sgm-quick{border-radius:0}
.sgm.shape-rays .sgm__box{border-radius:0;clip-path:var(--sgm-rays,none)}
.sgm.shape-rays .sgm-rail{border-radius:0}
.sgm.shape-rays .sgm-quick{border-radius:0;padding-bottom:30px}
.sgm.shape-bevel .sgm__box,.sgm.shape-rays .sgm__box{box-shadow:none}
.sgm.shape-bevel,.sgm.shape-rays{filter:drop-shadow(0 18px 28px rgba(0,0,0,.38))}

/* ── содержимое раздела ──────────────────────────────────────────────── */
.sgm-pane{
	position:absolute;top:0;left:0;z-index:1;width:max-content;
	max-width:min(1180px,calc(100vw - 48px));
	padding:26px var(--sgm-pad) calc(26px + var(--sgm-footH,46px));
	opacity:0;pointer-events:none;transform:translateX(var(--sgm-dir,10px));
	transition:opacity .17s ease,transform .24s cubic-bezier(.2,.8,.2,1);
	font-family:"Exo 2",sans-serif;
}
.sgm-pane.is-on{opacity:1;pointer-events:auto;transform:none;transition-delay:.05s}
.sgm-pane.is-fill{height:100%;overflow:hidden}
.sgm-pane.is-full{max-width:none}
.sgm-pane.is-scroll{height:100%;overflow-y:auto;overscroll-behavior:contain}

.sgm-cols{display:flex;gap:20px var(--sgm-pad);align-items:stretch;flex-wrap:wrap}
.sgm-col{min-width:0}
.sgm-cap{
	margin:0 0 11px;padding-left:9px;
	font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
	color:var(--sgm-orange);
}
.sgm-lnk{
	display:block;padding:6px 9px;border-radius:8px;text-decoration:none;
	color:var(--sgm-ink);font-size:13.5px;font-weight:500;line-height:1.35;white-space:nowrap;
	transition:background .13s ease,color .13s ease;
}
.sgm-lnk:hover,.sgm-lnk:focus-visible{background:rgba(241,126,0,.10);color:var(--sgm-orange);outline:none}
.sgm-lnk small{display:block;font-size:11px;font-weight:400;color:var(--sgm-muted);margin-top:2px}
.sgm-lnk:hover small{color:#b8792f}
.sgm-lnk--more{display:inline-flex;align-items:center;gap:7px;margin-top:6px;color:var(--sgm-orange);font-weight:700}
.sgm-lnk--more svg{width:13px;height:9px;flex:0 0 auto;transition:transform .18s ease}
.sgm-lnk--more:hover svg{transform:translateX(3px)}

/* ── правая полка ────────────────────────────────────────────────────── */
.sgm-rail{
	flex:0 0 var(--sgm-rail,258px);
	margin:-26px calc(var(--sgm-pad) * -1) -26px 0;padding:20px 22px;
	background:#f7f7f4;border-left:1px solid var(--sgm-rule);border-radius:0 20px 0 0;
	display:flex;flex-direction:column;
}
.sgm-rail > .sgm-ask:last-child,.sgm-rail > .sgm-promo:last-child{margin-top:auto}
.sgm-pane.is-wide .sgm-rail{flex:1 1 var(--sgm-rail,258px)}
.sgm-rail__cap{
	margin:0 0 10px;font-size:10.5px;font-weight:700;letter-spacing:.12em;
	text-transform:uppercase;color:var(--sgm-muted);
}
.sgm-row{
	display:flex;gap:10px;align-items:flex-start;padding:5px 8px;margin:0 -8px;
	border-radius:9px;text-decoration:none;color:var(--sgm-ink);transition:background .13s ease;
}
.sgm-row:hover,.sgm-row:focus-visible{background:rgba(241,126,0,.10);outline:none}
.sgm-row svg{width:15px;height:15px;flex:0 0 auto;margin-top:2px;color:var(--sgm-orange)}
.sgm-row b{display:block;font-size:12.5px;font-weight:600;line-height:1.25;white-space:nowrap}
.sgm-row i{display:block;font-style:normal;font-size:11px;color:var(--sgm-muted);margin-top:1px;white-space:nowrap}
.sgm-row:hover i{color:#b8792f}
.sgm-row--wide{align-items:flex-start;padding:9px 8px}
.sgm-row--wide b,.sgm-row--wide i{white-space:normal}
.sgm-row--wide i{line-height:1.42;margin-top:3px}

.sgm-dl{
	display:flex;gap:11px;align-items:flex-start;padding:11px 12px;margin:0 0 16px;
	border:1px solid var(--sgm-rule);border-radius:11px;background:#fff;
	text-decoration:none;color:var(--sgm-ink);transition:border-color .15s ease,box-shadow .15s ease;
}
.sgm-dl:hover,.sgm-dl:focus-visible{border-color:var(--sgm-orange);box-shadow:0 6px 16px -10px rgba(241,126,0,.6);outline:none}
.sgm-dl svg{width:17px;height:17px;flex:0 0 auto;margin-top:1px;color:var(--sgm-orange)}
.sgm-dl b{display:block;font-size:12.5px;font-weight:700;line-height:1.25}
.sgm-dl i{display:block;font-style:normal;font-size:11px;color:var(--sgm-muted);margin-top:2px}

.sgm-ask{margin-top:16px;padding-top:16px;border-top:1px solid var(--sgm-rule)}
.sgm-ask b{display:block;font-size:12.5px;font-weight:700;margin-bottom:6px}
.sgm-ask p{margin:0 0 11px;font-size:11.5px;line-height:1.5;color:var(--sgm-muted)}

.sgm-go{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--sgm-orange);text-decoration:none}
.sgm-go svg{width:13px;height:9px;transition:transform .18s ease}
.sgm-go:hover svg{transform:translateX(3px)}
.sgm-go:hover{text-decoration:underline}

/* карточка новости */
.sgm-promo{margin-top:16px;padding-top:14px;border-top:1px solid var(--sgm-rule)}
.sgm-promo a{text-decoration:none}
.sgm-promo__cap{margin:0 0 5px;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--sgm-orange)}
.sgm-promo__pic{
	display:block;position:relative;height:88px;border-radius:11px;overflow:hidden;margin-bottom:10px;
	background:radial-gradient(120px 60px at 62% 22%,rgba(255,236,205,.95),transparent 68%),
		linear-gradient(148deg,#f7a03a 0%,#f17e00 46%,#8a5416 100%);
}
.sgm-promo__pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.sgm-promo__t{display:block;font-size:13px;font-weight:700;line-height:1.32;color:var(--sgm-ink);margin-bottom:5px}
.sgm-promo a:hover .sgm-promo__t{color:var(--sgm-orange)}
.sgm-promo__d{display:block;font-style:normal;font-size:11px;color:var(--sgm-muted);margin-bottom:10px}

/* ── оранжевая полоса быстрых ссылок ─────────────────────────────────── */
.sgm-quick{
	position:absolute;left:0;right:0;bottom:0;z-index:2;
	padding:15px var(--sgm-pad);
	background:linear-gradient(180deg,#f78b1d 0%,var(--sgm-orange) 100%);
	border-radius:0 0 20px 20px;
	display:flex;gap:11px 24px;align-items:center;flex-wrap:nowrap;
}
.sgm-quick > *{flex:0 0 auto}
.sgm-pane.is-footwrap .sgm-quick{flex-wrap:wrap}
.sgm-quick__go{
	display:inline-flex;align-items:center;gap:9px;white-space:nowrap;
	font-size:13.5px;font-weight:800;letter-spacing:.015em;color:#fff;text-decoration:none;
	padding:7px 13px;margin:-7px -13px;border-radius:10px;transition:background .15s ease;
}
.sgm-quick__go:hover,.sgm-quick__go:focus-visible{background:rgba(255,255,255,.20);outline:none;color:#fff}
.sgm-quick__go svg{width:15px;height:10px;flex:0 0 auto;transition:transform .18s ease}
.sgm-quick__go:hover svg{transform:translateX(4px)}
.sgm-quick__sep{width:1px;align-self:stretch;background:rgba(255,255,255,.34);margin:-2px 3px}
.sgm-quick__note{
	display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
	font-size:12.5px;font-weight:500;color:rgba(255,255,255,.95);
}
.sgm-quick__note::before{content:"";width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.8);flex:0 0 auto}

/* ── свечение под шапкой ─────────────────────────────────────────────── */
.sgm-glow{
	position:fixed;z-index:1;pointer-events:none;
	opacity:var(--sgm-glowOn,1);transition:opacity .3s ease;
	background:radial-gradient(58% 100% at 50% 0%,
		hsl(var(--sgm-glowH,32) 100% 62% / calc(var(--sgm-glowP,55) / 100)) 0%,
		hsl(var(--sgm-glowH,32) 100% 58% / calc(var(--sgm-glowP,55) / 260)) 42%,
		transparent 72%);
	filter:blur(22px);
}

/* ── формы шапки ─────────────────────────────────────────────────────── */
.header.sgm-hdr{position:relative}
.header.sgm-hdr > .sgm-hdr__bg{
	content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
	background:inherit;
}
.header.sgm-hdr-rect{border-radius:0}
.header.sgm-hdr-bevel{
	border-radius:0;
	clip-path:polygon(24px 0,calc(100% - 24px) 0,100% 24px,100% calc(100% - 24px),
		calc(100% - 24px) 100%,24px 100%,0 calc(100% - 24px),0 24px);
}
.header.sgm-hdr-rays{border-radius:0;clip-path:var(--sgm-rays,none);padding-bottom:22px}
.header.sgm-hdr-full{border-radius:0}

@media (max-width:900px){
	.sgm-cols{flex-wrap:wrap;max-width:88vw}
	.sgm-rail{flex-basis:100%;margin-left:0;border-left:0;border-top:1px solid var(--sgm-rule);border-radius:0}
}
@media (prefers-reduced-motion:reduce){
	.sgm,.sgm-pane,.sgm-chev,.sgm-glow{transition-duration:.01ms !important}
}

/* ==========================================================================
   Пункты, открывающие всплывающую форму, выводятся тегом <button>.
   Браузер рисует кнопку своим шрифтом и рамкой — снимаем ТОЛЬКО это.
   Размер шрифта, отступы и цвет оставляем классам, иначе кнопка
   перестаёт совпадать с соседней ссылкой. 01.09.2026
   ========================================================================== */
button.sgm-lnk,
button.sgm-row,
button.sgm-go,
button.sgm-quick__go{
	font-family:inherit;
	background:none;
	border:0;
	cursor:pointer;
	text-align:left;
	-webkit-appearance:none;
	appearance:none;
}
/* эти два — блочные, тянутся на всю колонку, как и ссылки-аналоги */
button.sgm-lnk,
button.sgm-row{width:100%}


/* ── наследие старого меню ───────────────────────────────────────────
   НАСЛЕДИЕ СТАРОГО МЕНЮ. В style.css есть правила, которые при наведении
   на любой пункт меняли форму шапки: обнуляли нижнее скругление, делали
   фон прозрачным и подставляли подложку ::before под выпадающий блок.
   Старое меню рисовалось внутри шапки, поэтому ей приходилось
   разворачиваться. Новая панель самостоятельна — шапка при наведении
   меняться не должна. Возвращаем ей её обычный вид. */
header.desktop .container .header:has(.bottom .nav-wrap ul.nav > li:hover){
	border-radius:30px !important;
	background-color:rgba(255,255,255,.73) !important;
	-webkit-backdrop-filter:blur(30px) saturate(120%) !important;
	backdrop-filter:blur(30px) saturate(120%) !important;
}
header.desktop .container .header:has(.bottom .nav-wrap ul.nav > li:hover)::before{
	content:none !important;display:none !important;
}
