/* ==========================================================================
   Shagerd Class Hosseinam — main styles
   Reference design width: 1417px
   ========================================================================== */

:root {
	--shg-navy: #060551;
	--shg-navy-2: #1b1a66;
	--shg-ink: #0b0a45;
	--shg-text: #1a1a2e;
	--shg-orange: #f79534;
	--shg-orange-2: #f5a623;
	--shg-red: #941e2a;
	--shg-coral: #ed6c4d;
	--shg-plum: #23092d;
	--shg-gray: #a6a2a1;
	--shg-bg: #fcfcfd;
	--shg-dome: clamp(26px, 6.35vw, 90px);
	--shg-font: 'ShgVazir', Vazirmatn, Tahoma, 'Segoe UI', sans-serif;
	--shg-container: 1180px;
	--shg-radius: 14px;
	--shg-track-dir: ltr; /* course/product rows start from the left like the design; set to rtl to start from the right */
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
	margin: 0;
	background: var(--shg-navy);
	color: var(--shg-text);
	font-family: var(--shg-font);
	font-size: 16px;
	line-height: 1.8;
	direction: rtl;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

img, svg, video, iframe { max-width: 100%; }
img { height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, h4 { line-height: 1.4; margin: 0; }
p { margin: 0 0 1em; }
[hidden] { display: none !important; }

:focus-visible { outline: 3px solid var(--shg-orange); outline-offset: 3px; border-radius: 6px; }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px); white-space: nowrap;
}
.shg-skip {
	position: absolute; top: -60px; right: 16px; z-index: 1000;
	background: var(--shg-orange); color: #fff; padding: 8px 16px; border-radius: 8px;
}
.shg-skip:focus { top: 12px; }

.shg-ic { width: 1em; height: 1em; flex: none; }
.shg-sic { width: 1em; height: 1em; flex: none; display: block; }

.shg-container { width: min(100% - 40px, var(--shg-container)); margin-inline: auto; }
.shg-section { padding-block: 40px 20px; }
.shg-empty { text-align: center; padding: 60px 20px; color: #666; }

/* ---------- Buttons & fields ---------- */
.shg-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 50px; padding: 0 28px; border: 0; border-radius: var(--shg-radius);
	background: var(--shg-navy); color: #fff; font-weight: 700; font-size: 16px;
	transition: background .2s, transform .2s;
}
.shg-btn .shg-ic { font-size: 20px; }
.shg-btn:hover { background: var(--shg-orange); }
.shg-btn:active { transform: translateY(1px); }
.shg-btn--lg { min-height: 56px; font-size: 17px; }
.shg-btn--block { width: 100%; }
.shg-btn--ghost { background: transparent; color: var(--shg-navy); box-shadow: inset 0 0 0 2px var(--shg-navy); }
.shg-btn--ghost:hover { background: var(--shg-navy); color: #fff; }
.shg-btn[disabled] { opacity: .6; pointer-events: none; }
.shg-btn.is-loading { position: relative; color: transparent; }
.shg-btn.is-loading::after {
	content: ""; position: absolute; width: 22px; height: 22px; border-radius: 50%;
	border: 3px solid rgba(255,255,255,.4); border-top-color: #fff; animation: shg-spin .7s linear infinite;
}
@keyframes shg-spin { to { transform: rotate(360deg); } }

.shg-link { background: none; border: 0; padding: 0; color: var(--shg-orange); font-weight: 700; }
.shg-link[disabled] { color: #aaa; cursor: default; }

.shg-field { display: block; margin-bottom: 16px; }
.shg-field__label { display: block; font-size: 14px; font-weight: 700; color: var(--shg-ink); margin-bottom: 6px; }
.shg-field__input {
	width: 100%; height: 52px; padding: 0 16px; border-radius: var(--shg-radius);
	border: 2px solid #e2e2ee; background: #fff; transition: border-color .2s, box-shadow .2s;
}
.shg-field__input:focus { outline: 0; border-color: var(--shg-orange); box-shadow: 0 0 0 4px rgba(247,149,52,.18); }
.shg-field__input--ltr { direction: ltr; text-align: left; }
.shg-field__input--code { direction: ltr; text-align: center; font-size: 26px; letter-spacing: 12px; font-weight: 800; }
.shg-field__err { display: block; color: #c0392b; font-size: 13px; margin-top: 4px; min-height: 0; }
.shg-field__err:empty { display: none; }

/* ==========================================================================
   Header
   ========================================================================== */
.shg-header {
	position: relative; /* no z-index: children (socials, search) can sit above the lens */
	background: var(--shg-navy); color: #fff;
	padding: 22px 0 calc(var(--shg-dome) + 24px);
}
.shg-header__inner {
	position: relative; width: min(100% - 40px, 1080px); margin-inline: auto;
	display: flex; flex-direction: column; align-items: center;
}
.shg-header__logo img { width: 186px; height: auto; }
.shg-header__tools {
	position: absolute; left: -8px; top: 64px; display: flex; flex-direction: row-reverse; gap: 4px; align-items: center;
}
.shg-header__btn {
	display: inline-grid; place-items: center; width: 38px; height: 38px; padding: 0;
	background: none; border: 0; border-radius: 50%; color: var(--shg-orange); font-size: 28px;
	transition: background .2s;
}
.shg-header__btn:hover { background: rgba(255,255,255,.08); }
.shg-header__account { font-size: 24px; }
.shg-header__burger { display: none; }

.shg-nav { margin-top: 8px; }
.shg-nav__close { display: none; }
.shg-menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 50px; }
.shg-menu > li { position: relative; }
.shg-menu a {
	display: block; font-size: 23.5px; font-weight: 600; line-height: 2; color: #fff; white-space: nowrap;
	transition: color .2s;
}
.shg-menu a:hover { color: var(--shg-orange); }
.shg-menu .sub-menu {
	list-style: none; margin: 0; padding: 10px 0; position: absolute; top: 100%; right: -16px; min-width: 200px;
	background: #fff; border-radius: 14px; box-shadow: 0 16px 40px rgba(6,5,81,.25);
	opacity: 0; visibility: hidden; transform: translateY(6px); transition: .2s; z-index: 30;
}
.shg-menu li:hover > .sub-menu, .shg-menu li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.shg-menu .sub-menu a { color: var(--shg-ink); font-size: 16px; padding: 4px 18px; }
.shg-menu .sub-menu a:hover { color: var(--shg-orange); background: #fff6ec; }

.shg-social { display: flex; align-items: center; gap: 10px; direction: ltr; }
.shg-social__link { display: inline-grid; place-items: center; color: var(--shg-orange); transition: transform .2s, color .2s; }
.shg-social__link:hover { transform: translateY(-2px); color: #ffc27a; }
.shg-social--header { position: absolute; z-index: 12; left: 0; bottom: -34px; font-size: 26px; gap: 9px; }
.shg-social--nav { display: none; }

.shg-search {
	position: absolute; left: 0; right: 0; top: 100%; transform: translateY(calc(-1 * var(--shg-dome) - 10px));
	z-index: 30; width: min(100% - 40px, 640px); margin-inline: auto;
}
.shg-searchform { display: flex; background: #fff; border-radius: 999px; box-shadow: 0 16px 40px rgba(0,0,0,.25); overflow: hidden; }
.shg-searchform__input { flex: 1; min-width: 0; border: 0; padding: 0 24px; height: 56px; background: transparent; }
.shg-searchform__input:focus { outline: 0; }
.shg-searchform__btn { width: 64px; border: 0; background: var(--shg-orange); color: #fff; font-size: 24px; display: grid; place-items: center; }

/* ==========================================================================
   Main "lens" shape (dome on top, bulge at the bottom)
   ========================================================================== */
.shg-main { position: relative; z-index: 6; margin-top: calc(-1 * var(--shg-dome)); }
.shg-lens {
	background-color: var(--shg-bg);
	background-image: url(../img/pattern.svg);
	background-size: 102px 153px;
	border-radius: 50% 50% 50% 50% / var(--shg-dome) var(--shg-dome) var(--shg-dome) var(--shg-dome);
	padding: var(--shg-dome) 0 calc(var(--shg-dome) + 40px);
	overflow: clip;
	min-height: 60vh;
}
.shg-lens--flush { padding-bottom: calc(var(--shg-dome) + 60px); }

/* ==========================================================================
   Footer
   ========================================================================== */
.shg-footer { color: #fff; text-align: center; padding: 36px 20px 44px; }
.shg-footer__logo { display: inline-block; }
.shg-footer__logo img { width: 150px; margin-inline: auto; }
.shg-social--footer { justify-content: center; gap: 16px; margin-top: 16px; font-size: 38px; }
.shg-footer__text { margin: 18px 0 0; font-size: 13px; opacity: .6; }

/* ==========================================================================
   Category bar (courses / shop)
   ========================================================================== */
.shg-catbar { position: relative; z-index: 8; }
.shg-catbar__inner {
	display: flex; align-items: center; gap: 12px;
	padding: 6px 58px 6px 38px; min-height: 56px;
}
.shg-catbar--courses { box-shadow: 0 7px 9px -5px rgba(0,0,0,.28); }
.shg-catbar--shop .shg-catbar__inner { border-bottom: 3px solid #9a9a9a; }
.shg-catbar__menu { position: relative; flex: none; }
.shg-catbar__toggle {
	display: flex; align-items: center; gap: 8px; background: none; border: 0; padding: 4px 0;
	font-size: 17px; font-weight: 800; color: #111;
}
.shg-catbar__toggle .shg-ic { font-size: 26px; }
.shg-catbar__sep { width: 2px; height: 22px; background: #333; flex: none; }
.shg-catbar__list {
	list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px 40px;
	flex: 1; overflow-x: auto; scrollbar-width: none;
}
.shg-catbar__list::-webkit-scrollbar { display: none; }
.shg-catbar__list a {
	display: flex; align-items: center; gap: 6px; white-space: nowrap; font-size: 16px; color: #222;
	padding: 4px 0; border-bottom: 2px solid transparent; transition: color .2s, border-color .2s;
}
.shg-catbar__list .shg-ic { font-size: 30px; color: #111; }
.shg-catbar__list a:hover, .shg-catbar__list .is-active a { color: var(--shg-orange); border-bottom-color: var(--shg-orange); }
.shg-catbar__end { margin-inline-start: auto; position: relative; display: grid; place-items: center; font-size: 38px; color: #111; flex: none; }
.shg-catbar__end:hover { color: var(--shg-orange); }
.shg-catbar__badge {
	position: absolute; top: -4px; left: -8px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px;
	background: var(--shg-orange); color: #fff; font-size: 12px; font-weight: 700; line-height: 20px; text-align: center;
}
.shg-catbar__badge.is-zero { display: none; }
.shg-catbar__drop {
	list-style: none; margin: 0; padding: 10px; position: absolute; top: calc(100% + 10px); right: -10px; min-width: 230px;
	background: #fff; border-radius: 16px; box-shadow: 0 18px 44px rgba(6,5,81,.22); z-index: 40;
}
.shg-catbar__drop a { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 10px; font-size: 15px; }
.shg-catbar__drop a:hover { background: #fff4e8; color: var(--shg-orange); }
.shg-catbar__drop .shg-ic { font-size: 24px; }

/* ==========================================================================
   Courses page
   ========================================================================== */
.shg-hero { position: relative; width: 100%; height: min(calc(100vw * 700 / 1417), 78vh); min-height: 200px; margin-inline: auto; background: #1a0f2e; overflow: hidden; }
.shg-hero__slide img { object-position: center; }
.shg-hero__track, .shg-hero__slide { position: absolute; inset: 0; }
.shg-hero__slide { opacity: 0; visibility: hidden; transition: opacity .7s ease, visibility .7s; }
.shg-hero__slide.is-active { opacity: 1; visibility: visible; }
.shg-hero__slide a { display: block; height: 100%; }
.shg-hero__slide img { width: 100%; height: 100%; object-fit: cover; }
.shg-hero__nav {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
	width: 80px; height: 80px; border-radius: 50%; border: 0;
	display: grid; place-items: center; font-size: 30px; color: #2a2a2a;
	background: rgba(255,255,255,.28); backdrop-filter: blur(3px); transition: background .2s;
}
.shg-hero__nav:hover { background: rgba(255,255,255,.55); }
.shg-hero__nav--prev { right: 28px; }
.shg-hero__nav--next { left: 28px; }
.shg-hero__nav.is-static { pointer-events: none; }

.shg-crows { padding-top: 34px; }
.shg-crow { margin-bottom: 44px; }
.shg-crow__head {
	padding: 6px 22px 8px;
	background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,.7) 60%);
	box-shadow: 0 10px 12px -8px rgba(0,0,0,.14);
	position: relative; z-index: 1;
}
.shg-crow__title { display: flex; align-items: center; gap: 4px; font-size: 46px; font-weight: 400; color: #111; line-height: 1.5; }
.shg-crow__title a { display: inline-flex; align-items: center; gap: 4px; }
.shg-crow__title .shg-ic { font-size: 34px; }
.shg-crow__title a:hover { color: var(--shg-orange); }
.shg-crow__band {
	background: rgba(255,255,255,.55);
	box-shadow: inset 0 14px 16px -12px rgba(0,0,0,.14), inset 0 -14px 16px -12px rgba(0,0,0,.14), 0 12px 14px -10px rgba(0,0,0,.16);
	padding: 36px 0 46px;
}

/* ---------- Generic scroll carousel ---------- */
.shg-carousel { position: relative; }
.shg-carousel__track {
	display: flex; gap: 52px; overflow-x: auto; overscroll-behavior-x: contain;
	scroll-snap-type: x proximity; scrollbar-width: none; direction: var(--shg-track-dir);
	-webkit-overflow-scrolling: touch;
}
.shg-carousel__track::-webkit-scrollbar { display: none; }
.shg-carousel__track.is-grabbing { cursor: grabbing; scroll-snap-type: none; }
.shg-carousel__track:focus-visible { outline-offset: -3px; }
.shg-carousel__item { flex: none; scroll-snap-align: start; direction: rtl; }
.shg-carousel__btn {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
	width: 42px; height: 42px; border-radius: 50%; border: 0; padding: 0;
	display: grid; place-items: center; font-size: 17px; color: #333;
	background: rgba(210,210,215,.55); backdrop-filter: blur(2px); transition: opacity .2s, background .2s;
}
.shg-carousel__btn:hover { background: rgba(255,255,255,.9); }
.shg-carousel__btn.is-disabled { opacity: .55; }
.shg-prow__btn.is-disabled { opacity: .8; }
.shg-carousel__btn--left { left: 28px; }
.shg-carousel__btn--right { right: 28px; }

.shg-carousel--courses .shg-carousel__track { padding: 0 52px; scroll-padding: 0 52px; }

/* ---------- Course card ---------- */
.shg-ccard {
	position: relative; display: block; width: 238px; height: 180px; border-radius: 42px; overflow: hidden;
	background: #111; box-shadow: 0 6px 16px rgba(0,0,0,.08);
}
.shg-ccard img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.shg-ccard__ph { display: grid; place-items: center; height: 100%; color: rgba(255,255,255,.4); font-size: 54px; }
.shg-ccard__title {
	position: absolute; inset: auto 0 0; padding: 30px 18px 14px; color: #fff; font-size: 14px; font-weight: 700; line-height: 1.6;
	background: linear-gradient(to top, rgba(6,5,81,.9), rgba(6,5,81,0));
	opacity: 0; transform: translateY(8px); transition: .25s;
}
.shg-ccard:hover img, .shg-ccard:focus-visible img { transform: scale(1.05); }
.shg-ccard:hover .shg-ccard__title, .shg-ccard:focus-visible .shg-ccard__title { opacity: 1; transform: none; }

.shg-cgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(238px, 1fr)); gap: 36px; justify-items: center; }
.shg-cgrid .shg-ccard { width: 100%; max-width: 280px; aspect-ratio: 238 / 180; height: auto; }
.shg-cgrid .shg-ccard__title { opacity: 1; transform: none; }

.shg-archive-head { text-align: center; margin-bottom: 36px; }
.shg-archive-head .shg-crow__title { justify-content: center; }
.shg-archive-head--flush { padding: 30px 20px 0; }
.shg-archive-head__title { font-size: 34px; font-weight: 400; color: #111; }
.shg-archive-head__search { max-width: 560px; margin: 20px auto 0; }
.shg-archive-head__search .shg-searchform { box-shadow: 0 8px 26px rgba(6,5,81,.12); }

/* ---------- Single course ---------- */
.shg-course__top { display: grid; grid-template-columns: 1.35fr 1fr; gap: 40px; align-items: start; margin-bottom: 40px; }
.shg-course__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.shg-course__media img, .shg-course__media .shg-video { border-radius: 28px; overflow: hidden; box-shadow: 0 16px 36px rgba(6,5,81,.16); }
.shg-course__title { font-size: 32px; font-weight: 800; color: var(--shg-ink); margin-bottom: 16px; }
.shg-course__meta { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 8px; }
.shg-course__meta li { display: flex; gap: 10px; font-weight: 600; }
.shg-course__meta span { min-width: 60px; color: #888; font-weight: 500; }
.shg-course__excerpt { color: #444; }
.shg-video--ratio { position: relative; aspect-ratio: 16 / 9; }
.shg-video--ratio iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ==========================================================================
   Pillars (three items with red dots) — about + home
   ========================================================================== */
.shg-pillars { text-align: center; color: var(--shg-ink); font-weight: 600; }
.shg-pillars__title { font-size: 19px; font-weight: 800; margin-bottom: 18px; }
.shg-pillars__intro { font-size: 15px; margin-bottom: 26px; }
.shg-pillars__list { list-style: none; margin: 0 0 26px; padding: 0; display: grid; gap: 10px; font-size: 15px; }
.shg-pillars__list li::before {
	content: ""; display: block; width: 16px; height: 16px; border-radius: 50%; background: var(--shg-red); margin: 0 auto 2px;
}
.shg-pillars__outro { font-size: 15px; line-height: 1.9; margin: 0; }

/* ==========================================================================
   About
   ========================================================================== */
.shg-about { padding: 18px 20px 60px; text-align: center; color: var(--shg-ink); }
.shg-about__block { margin: 0 auto 46px; max-width: 760px; }
.shg-about__icon { display: inline-block; color: var(--shg-orange); font-size: 90px; line-height: 1; }
.shg-about__q { display: block; font-size: 96px; font-weight: 900; line-height: .95; color: var(--shg-orange); font-family: Arial, var(--shg-font); }
.shg-about__icon .shg-ic--pin path:first-child { fill: currentColor; }
.shg-about__icon .shg-ic--pin circle { fill: #fff; stroke: #fff; }
.shg-about__icon--media { font-size: 116px; }
.shg-about__title { font-size: 24px; font-weight: 800; margin: 0 0 30px; }
.shg-about .shg-pillars { font-weight: 700; }
.shg-about .shg-pillars__intro, .shg-about .shg-pillars__list, .shg-about .shg-pillars__outro { font-size: 18px; }
.shg-about .shg-pillars__intro { margin-bottom: 40px; }
.shg-about .shg-pillars__list { gap: 14px; margin-bottom: 36px; }
.shg-about .shg-pillars__list li::before { width: 20px; height: 20px; }
.shg-about__big { font-style: normal; font-size: 30px; font-weight: 800; line-height: 2.1; margin-top: 22px; }
.shg-about__big span { display: block; }
.shg-about__phone { font-size: 40px; font-weight: 900; letter-spacing: .5px; margin: 18px 0 0; font-variant-numeric: lining-nums; }
.shg-about__phone a:hover { color: var(--shg-orange); }
.shg-about__dash { margin: 0 2px; }
.shg-social--about { justify-content: center; gap: 10px; margin-top: 22px; font-size: 104px; }
.shg-social--about .shg-social__link { color: #000; }
.shg-social--about .shg-social__link:hover { color: var(--shg-navy); }
.shg-about__extra { text-align: right; }

/* ==========================================================================
   Home
   ========================================================================== */
.shg-main--home { background: transparent; }

/* 4 cards lens */
.shg-hcards {
	position: relative; z-index: 3;
	background: var(--shg-bg) url(../img/pattern.svg); background-size: 102px 153px;
	border-radius: 50% 50% 50% 50% / var(--shg-dome) var(--shg-dome) 70px 70px;
	padding: calc(var(--shg-dome) + 32px) 20px 108px;
}
.shg-hcards__grid {
	display: grid; grid-template-columns: repeat(4, 232px); justify-content: center; gap: 38px;
}
.shg-hcard { display: block; text-align: center; }
.shg-hcard__img {
	display: block; height: 180px; border-radius: 26px; overflow: hidden;
	box-shadow: 0 12px 26px rgba(0,0,0,.2); background: #ddd;
}
.shg-hcard__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.shg-hcard__title { display: block; margin-top: 16px; font-size: 17px; font-weight: 500; color: var(--shg-ink); }
a.shg-hcard:hover .shg-hcard__img img { transform: scale(1.06); }
a.shg-hcard:hover .shg-hcard__title { color: var(--shg-orange); }

/* Coverflow banner */
.shg-cover {
	--w: 56vw;
	position: relative; z-index: 1; margin-top: -70px;
	height: calc(var(--w) * .49375);
	background: var(--shg-plum); overflow: hidden;
}
.shg-cover__stage { position: absolute; inset: 0; }
.shg-cover__slide {
	position: absolute; top: 50%; left: 50%; width: var(--w); height: 100%;
	transform: translate(-50%, -50%); transition: transform .8s cubic-bezier(.22,.7,.2,1), opacity .8s, filter .8s;
	opacity: 0; display: block; overflow: hidden;
}
.shg-cover__slide img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; }
.shg-cover__slide::after { content: ""; position: absolute; inset: 0; background: rgba(35,9,45,.74); transition: opacity .8s; }
.shg-cover__slide[data-off="0"] { opacity: 1; z-index: 2; }
.shg-cover__slide[data-off="0"]::after { opacity: 0; }
.shg-cover__slide[data-off="1"] { opacity: 1; transform: translate(-150%, -50%); filter: blur(2px); z-index: 1; cursor: pointer; }
.shg-cover__slide[data-off="-1"] { opacity: 1; transform: translate(50%, -50%); filter: blur(2px); z-index: 1; cursor: pointer; }
.shg-cover__slide[data-off="2"] { transform: translate(-250%, -50%); }
.shg-cover__slide[data-off="-2"] { transform: translate(150%, -50%); }
.shg-cover:not(.is-ready) .shg-cover__slide:first-child { opacity: 1; }
.shg-cover__nav {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
	width: 56px; height: 56px; border-radius: 50%; border: 0; display: grid; place-items: center;
	font-size: 26px; color: #fff; background: rgba(255,255,255,.14); backdrop-filter: blur(4px);
	opacity: 0; transition: opacity .25s, background .2s;
}
.shg-cover:hover .shg-cover__nav, .shg-cover__nav:focus-visible { opacity: 1; }
.shg-cover__nav:hover { background: rgba(255,255,255,.3); }
.shg-cover__nav--prev { right: calc(50% - var(--w) / 2 - 76px); }
.shg-cover__nav--next { left: calc(50% - var(--w) / 2 - 76px); }

/* Org chart lens */
.shg-org {
	position: relative; z-index: 3; margin-top: -90px;
	background: #fff url(../img/doodle-org.svg); background-size: 620px 480px;
	border-radius: 50% 50% 50% 50% / 90px 90px 80px 80px;
	padding: 34px 20px 150px;
}
.shg-org__inner { max-width: 1240px; margin: 0 auto; position: relative; }
.shg-org__logo { width: 186px; margin: 0 auto; position: relative; z-index: 1; }
.shg-org__tree { position: relative; height: 34px; }
.shg-org__stem { position: absolute; top: -6px; bottom: 0; left: 50%; width: 4px; transform: translateX(-50%); background: repeating-linear-gradient(to bottom, #111 0 13px, transparent 13px 20px); }
.shg-org__bar { position: absolute; bottom: 0; left: 16.66%; right: 16.66%; height: 4px; background: repeating-linear-gradient(to left, #111 0 14px, transparent 14px 21px); }
.shg-org__cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.shg-org__col { position: relative; }
.shg-org__drop { display: block; width: 4px; margin: 0 auto 14px; background: repeating-linear-gradient(to bottom, #111 0 13px, transparent 13px 20px); }
.shg-org__col--1 .shg-org__drop { height: 44px; }
.shg-org__col--2 .shg-org__drop { height: 118px; }
.shg-org__col--3 .shg-org__drop { height: 54px; }
.shg-org .shg-pillars__title { font-size: 20px; }
.shg-org .shg-pillars__intro { font-size: 16px; font-weight: 700; margin-bottom: 30px; }
.shg-org .shg-pillars__list, .shg-org .shg-pillars__outro { font-size: 16px; font-weight: 700; }
.shg-org .shg-pillars__list { gap: 8px; }

/* Stripes + gallery */
.shg-stripes { display: block; padding-top: 110px; }
.shg-stripes span { display: block; }
.shg-stripes__red { height: 29px; background: var(--shg-red); }
.shg-stripes__coral { height: 34px; background: var(--shg-coral); margin-top: 134px; }
.shg-gallery {
	position: relative; margin-top: 0;
	background: linear-gradient(to bottom, #200b33 0%, #1a0a3a 42%, var(--shg-navy) 58%);
	padding-top: 40px;
}
.shg-gallery__lens {
	position: relative; background: #070707;
	background-image: radial-gradient(ellipse at 88% 0%, rgba(80,20,110,.45), transparent 42%);
	border-radius: 50% 50% 50% 50% / 70px 70px 80px 80px;
	padding: 18px 0 44px; overflow: hidden;
}
.shg-gallery__row { overflow: hidden; margin-bottom: 34px; direction: ltr; }
.shg-gallery__row:last-child { margin-bottom: 0; }
.shg-gallery__track {
	display: flex; width: max-content; gap: 24px;
	animation: shg-marquee var(--shg-speed, 40s) linear infinite;
}
.shg-gallery__row--2 .shg-gallery__track { animation-direction: reverse; gap: 34px; }
.shg-gallery__row--3 .shg-gallery__track { animation-duration: calc(var(--shg-speed, 40s) * 1.15); }
.shg-gallery__lens:hover .shg-gallery__track { animation-play-state: paused; }
.shg-gallery__item { flex: none; width: 172px; height: 134px; border-radius: 16px; overflow: hidden; }
.shg-gallery__row--2 .shg-gallery__item { width: 272px; height: 208px; border-radius: 24px; }
.shg-gallery__row--3 .shg-gallery__item { width: 160px; height: 124px; }
.shg-gallery__item img { width: 100%; height: 100%; object-fit: cover; }
@keyframes shg-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .shg-gallery__track { animation: none; } }

/* ==========================================================================
   Shop
   ========================================================================== */
.shg-shop { position: relative; }
.shg-shop::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	display: none;
}
.shg-shop > * { position: relative; }
.shg-prows { position: relative; background: #fff; }
.shg-prows::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: url(../img/doodle-shop.svg); background-size: 1180px 870px; filter: blur(1.6px);
}
.shg-prows > * { position: relative; }
.shg-shop__banner { min-height: 146px; }
.shg-shop__banner.has-img { min-height: 0; padding: 24px 38px; }
.shg-shop__banner img { width: 100%; border-radius: 24px; }

.shg-amazing { background: var(--shg-navy); padding: 36px 14px 28px 38px; }
.shg-amazing__inner { display: flex; align-items: stretch; gap: 20px; }
.shg-amazing__label {
	flex: none; width: 150px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
	color: var(--shg-orange);
}
.shg-amazing__title { font-size: 44px; font-weight: 300; line-height: 1.12; color: var(--shg-orange); }
.shg-amazing__pct { font-size: 44px; font-weight: 200; line-height: 1.4; }
.shg-amazing__all { display: inline-flex; align-items: center; gap: 4px; font-size: 15px; margin-top: 6px; }
.shg-amazing__all .shg-ic { font-size: 18px; }
.shg-amazing__all:hover { color: #fff; }
.shg-amazing__box {
	flex: 1; min-width: 0; border-radius: 16px; overflow: hidden; padding: 10px 0 18px 36px;
	background: var(--shg-navy-2) url(../img/doodle-amazing.svg); background-size: 840px 620px;
}
.shg-carousel--amazing .shg-carousel__track { gap: 42px; }

.shg-prows { padding: 40px 0 10px; }
.shg-prow { margin-bottom: 58px; }
.shg-prow__title { text-align: center; font-size: 38px; font-weight: 300; color: #111; margin-bottom: 62px; }
.shg-prow__title a:hover { color: var(--shg-orange); }
.shg-prow__frame {
	position: relative; width: min(100% - 120px, 1085px); margin: 0 auto;
	border: 3px solid var(--shg-orange); padding: 18px 0 16px;
}
.shg-carousel--products .shg-carousel__track { gap: 44px; padding: 0 72px; scroll-padding: 0 72px; }
.shg-prow__btn {
	width: 76px; height: 76px; font-size: 30px; color: #222;
	background: #f1f1f3; box-shadow: 0 8px 18px rgba(0,0,0,.18);
}
.shg-prow__btn:hover { background: #fff; color: var(--shg-orange); }
.shg-prow__btn.shg-carousel__btn--left { left: -38px; }
.shg-prow__btn.shg-carousel__btn--right { right: -38px; }

/* ---------- Product card ---------- */
.shg-prod { position: relative; width: 148px; height: 190px; border-radius: 48px; overflow: hidden; background: var(--shg-gray); }
.shg-prod--amazing { width: 172px; height: 236px; border-radius: 46px; background: #f1f1f1; }
.shg-prod__img { position: absolute; inset: 0; display: block; }
.shg-prod__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.shg-prod:hover .shg-prod__img img { transform: scale(1.06); }
.shg-prod__off {
	position: absolute; top: 14px; right: 14px; min-width: 40px; height: 26px; padding: 0 8px; border-radius: 13px;
	background: var(--shg-red); color: #fff; font-size: 13px; font-weight: 800; display: grid; place-items: center; line-height: 1;
}
.shg-prod__body {
	position: absolute; inset: auto 0 0; padding: 38px 14px 14px; color: #fff;
	background: linear-gradient(to top, rgba(6,5,81,.92) 0%, rgba(6,5,81,.6) 60%, rgba(6,5,81,0));
}
.shg-prod__title { font-size: 13px; font-weight: 700; line-height: 1.6; margin-bottom: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.shg-prod__foot { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.shg-prod__price { font-size: 12px; font-weight: 700; line-height: 1.5; }
.shg-prod__price del { opacity: .6; font-weight: 400; display: block; font-size: 11px; }
.shg-prod__price ins { text-decoration: none; }
.shg-prod__add {
	flex: none; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center;
	background: var(--shg-orange); color: #fff; font-size: 17px; transition: transform .2s, background .2s;
}
.shg-prod__add:hover { transform: scale(1.1); background: #fff; color: var(--shg-orange); }
.shg-prod__add.loading { opacity: .6; }
.shg-prod__add.added::after { content: none; }
.shg-prod .added_to_cart { display: none; }
.shg-prod.is-out .shg-prod__img img { filter: grayscale(.8); }

.shg-prod--amazing .shg-prod__img { inset: 10px 10px auto; height: 140px; border-radius: 36px; overflow: hidden; }
.shg-prod--amazing .shg-prod__body { background: none; color: var(--shg-ink); padding: 10px 14px 14px; }
.shg-prod--amazing .shg-prod__add { background: var(--shg-navy); }
.shg-prod--ph { box-shadow: none; }
.shg-prod--amazing.shg-prod--ph { background: #f1f1f1; }

/* Archive grid (categories, search, sale) */
.shg-shop-archive .woocommerce-breadcrumb { font-size: 14px; color: #777; margin-bottom: 10px; }
.shg-bc-sep { margin: 0 8px; opacity: .5; }
.shg-shop-archive__bar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 30px; }
.shg-shop-archive__bar .woocommerce-result-count, .shg-shop-archive__bar .woocommerce-ordering { margin: 0; float: none; }

/* ==========================================================================
   Posts
   ========================================================================== */
.shg-page-title { font-size: 34px; font-weight: 800; color: var(--shg-ink); margin-bottom: 24px; }
.shg-archive-head .shg-page-title { margin-bottom: 8px; }
.shg-pgrid-posts { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 30px; }
.shg-pcard { background: #fff; border-radius: 28px; overflow: hidden; box-shadow: 0 12px 30px rgba(6,5,81,.08); display: flex; flex-direction: column; transition: transform .25s, box-shadow .25s; }
.shg-pcard:hover { transform: translateY(-4px); box-shadow: 0 18px 38px rgba(6,5,81,.14); }
.shg-pcard__img { display: block; aspect-ratio: 4 / 3; background: var(--shg-navy); overflow: hidden; }
.shg-pcard__img img { width: 100%; height: 100%; object-fit: cover; }
.shg-pcard__ph { display: grid; place-items: center; height: 100%; }
.shg-pcard__ph img { width: 50%; height: auto; object-fit: contain; }
.shg-pcard__body { padding: 18px 22px 22px; }
.shg-pcard__date { font-size: 13px; color: var(--shg-orange); font-weight: 700; }
.shg-pcard__title { font-size: 18px; font-weight: 800; color: var(--shg-ink); margin: 4px 0 8px; }
.shg-pcard__title a:hover { color: var(--shg-orange); }
.shg-pcard__excerpt { font-size: 14px; color: #555; margin: 0; }

.shg-single { max-width: 860px; }
.shg-single__meta { color: #888; font-size: 14px; }
.shg-single__thumb { margin: 0 0 30px; }
.shg-single__thumb img { border-radius: 28px; width: 100%; }

.shg-prose { font-size: 17px; line-height: 2; }
.shg-prose h2 { font-size: 26px; margin: 1.4em 0 .6em; color: var(--shg-ink); }
.shg-prose h3 { font-size: 21px; margin: 1.3em 0 .5em; color: var(--shg-ink); }
.shg-prose a { color: var(--shg-orange); text-decoration: underline; text-underline-offset: 4px; }
.shg-prose img { border-radius: 18px; }
.shg-prose blockquote { margin: 1.5em 0; padding: 12px 24px; border-right: 4px solid var(--shg-orange); background: #fff7ee; border-radius: 12px; }
.shg-prose ul, .shg-prose ol { padding-right: 1.4em; }
.shg-prose figure { margin: 1.5em 0; }
.shg-prose .alignwide { width: min(100vw - 40px, 1100px); margin-inline: calc((min(100vw - 40px, 1100px) - 100%) / -2); }

.nav-links { display: flex; justify-content: center; gap: 8px; margin-top: 40px; flex-wrap: wrap; }
.nav-links .page-numbers { min-width: 44px; height: 44px; display: grid; place-items: center; padding: 0 12px; border-radius: 12px; background: #fff; box-shadow: 0 4px 12px rgba(6,5,81,.08); font-weight: 700; }
.nav-links .page-numbers.current, .nav-links a.page-numbers:hover { background: var(--shg-navy); color: #fff; }

.shg-comments { margin-top: 50px; }
.shg-comments__title { font-size: 22px; margin-bottom: 20px; }
.shg-comments__list { list-style: none; padding: 0; }
.shg-comments .comment-body { background: #fff; border-radius: 18px; padding: 16px 20px; margin-bottom: 14px; }
.comment-form input:not([type=submit]):not([type=checkbox]), .comment-form textarea { width: 100%; border: 2px solid #e2e2ee; border-radius: 12px; padding: 10px 14px; }
.comment-form .submit { background: var(--shg-navy); color: #fff; border: 0; border-radius: 12px; padding: 12px 28px; font-weight: 700; }

.shg-404 { text-align: center; max-width: 600px; }
.shg-404__num { font-size: 120px; font-weight: 900; color: var(--shg-orange); line-height: 1; margin-bottom: 10px; }
.shg-404 .shg-searchform { margin: 20px 0; box-shadow: 0 8px 24px rgba(6,5,81,.1); }

/* ==========================================================================
   News (posts page + single): center article + summaries sidebar
   ========================================================================== */
.shg-news { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 34px; align-items: start; }
.shg-news__main { min-width: 0; }
.shg-news__article { background: #fff; border-radius: 30px; padding: 34px 38px; box-shadow: 0 16px 44px rgba(6,5,81,.08); }
.shg-news__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; font-size: 14px; color: #888; margin-bottom: 10px; }
.shg-news__cats a { display: inline-block; background: #fff2e4; color: var(--shg-orange); font-weight: 700; padding: 2px 12px; border-radius: 999px; margin-inline-start: 4px; }
.shg-news__title { font-size: 30px; font-weight: 800; color: var(--shg-ink); line-height: 1.6; margin-bottom: 12px; }
.shg-news__title a:hover { color: var(--shg-orange); }
.shg-news__lead { font-size: 17px; font-weight: 600; color: #444; border-right: 4px solid var(--shg-orange); padding-right: 14px; margin-bottom: 22px; }
.shg-news__thumb { margin: 0 0 26px; }
.shg-news__thumb img { width: 100%; border-radius: 24px; }
.shg-news__content img { border-radius: 18px; margin-inline: auto; }
.shg-news__content .wp-block-gallery, .shg-news__content .gallery { gap: 12px; }
.shg-news__content .gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
.shg-news__content .gallery-item { margin: 0; width: auto !important; }
.shg-news__content .gallery-item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border: 0 !important; }
.shg-news__content .wp-block-gallery img { border-radius: 16px; }
.shg-news__content figcaption, .shg-news__content .wp-caption-text { font-size: 13px; color: #777; text-align: center; margin-top: 6px; }
.shg-news__content .wp-block-image, .shg-news__content .wp-caption { max-width: 100%; }
.shg-news__tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0 0; }
.shg-news__tags a { font-size: 13px; background: #f3f3fa; padding: 4px 12px; border-radius: 999px; }
.shg-news__tags a:hover { background: var(--shg-navy); color: #fff; }
.shg-news__nav { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 30px; }
.shg-news__nav a { display: block; background: #f6f6fb; border-radius: 16px; padding: 12px 16px; font-weight: 700; color: var(--shg-ink); line-height: 1.6; }
.shg-news__nav a:hover { background: var(--shg-navy); color: #fff; }
.shg-news__nav small { display: block; font-weight: 500; color: var(--shg-orange); font-size: 12px; }
.shg-news__next { text-align: left; grid-column: 2; }
.shg-news__readmore { text-align: center; margin: 22px 0 0; }

.shg-news__side { position: sticky; top: 20px; display: grid; gap: 22px; }
.admin-bar .shg-news__side { top: 52px; }
.shg-news__box, .shg-widget { background: #fff; border-radius: 26px; padding: 20px 18px; box-shadow: 0 14px 40px rgba(6,5,81,.08); }
.shg-news__boxtitle { font-size: 18px; font-weight: 800; color: var(--shg-ink); margin-bottom: 14px; display: flex; align-items: center; gap: 10px; }
.shg-news__boxtitle::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--shg-red); box-shadow: 0 0 0 4px rgba(148,30,42,.15); }
.shg-nlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.shg-nlist__link { display: flex; gap: 12px; align-items: flex-start; padding: 8px; border-radius: 16px; transition: background .2s; }
.shg-nlist__link:hover { background: #f6f6fb; }
.shg-nlist__item.is-current .shg-nlist__link { background: var(--shg-navy); color: #fff; }
.shg-nlist__thumb { flex: none; width: 88px; height: 70px; border-radius: 14px; overflow: hidden; background: var(--shg-navy); }
.shg-nlist__thumb img { width: 100%; height: 100%; object-fit: cover; }
.shg-nlist__thumb img.is-logo { object-fit: contain; padding: 8px; }
.shg-nlist__body { display: grid; gap: 2px; min-width: 0; }
.shg-nlist__title { font-size: 14px; font-weight: 800; line-height: 1.6; color: var(--shg-ink); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.shg-nlist__excerpt { font-size: 12px; line-height: 1.7; color: #666; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.shg-nlist__date { font-size: 11px; color: var(--shg-orange); font-weight: 700; }
.shg-nlist__item.is-current .shg-nlist__title, .shg-nlist__item.is-current .shg-nlist__excerpt { color: #fff; }
.shg-nlist__pager { display: flex; gap: 8px; justify-content: space-between; margin-top: 12px; }
.shg-nlist__more { flex: 1; text-align: center; font-size: 13px; font-weight: 700; padding: 8px; border-radius: 12px; background: #fff2e4; color: var(--shg-orange); }
.shg-nlist__more:hover { background: var(--shg-orange); color: #fff; }
.shg-widget ul { list-style: none; padding: 0; margin: 0; }
.shg-widget li { padding: 6px 0; border-bottom: 1px solid #f0f0f5; }

@media (max-width: 960px) {
	.shg-news { grid-template-columns: 1fr; }
	.shg-news__side { position: static; }
	.shg-news__article { padding: 22px 18px; border-radius: 24px; }
	.shg-news__title { font-size: 23px; }
}

/* ==========================================================================
   Auth (OTP)
   ========================================================================== */
.shg-auth-page { padding: 20px 20px 40px; }
.shg-auth {
	max-width: 460px; margin: 0 auto; background: #fff; border-radius: 30px;
	padding: 34px 34px 28px; box-shadow: 0 24px 60px rgba(6,5,81,.14); text-align: center;
}
.shg-auth__logo { width: 140px; margin: 0 auto 10px; }
.shg-auth__title { font-size: 24px; font-weight: 800; color: var(--shg-ink); margin-bottom: 6px; }
.shg-auth__sub { font-size: 14px; color: #666; margin-bottom: 24px; }
.shg-auth__step { display: none; text-align: right; }
.shg-auth__step.is-active { display: block; animation: shg-fade .3s ease; }
.shg-auth__step .shg-auth__title, .shg-auth__step .shg-auth__sub { text-align: center; }
.shg-auth__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.shg-auth__resend { display: flex; justify-content: space-between; align-items: center; margin: 14px 0 0; font-size: 14px; }
.shg-auth__timer { color: #888; font-variant-numeric: tabular-nums; direction: ltr; }
.shg-auth__msg { margin: 16px 0 0; font-size: 14px; font-weight: 600; min-height: 1.5em; }
.shg-auth__msg.is-error { color: #c0392b; }
.shg-auth__msg.is-ok { color: #1e8449; }
.shg-auth--done p { margin-bottom: 14px; }
@keyframes shg-fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* ---------- Registration wizard / chips ---------- */
.shg-wiz__progress { height: 8px; border-radius: 99px; background: #eeeef6; overflow: hidden; margin-bottom: 6px; }
.shg-wiz__progress i { display: block; height: 100%; width: 0; border-radius: 99px; background: linear-gradient(90deg, var(--shg-orange), var(--shg-red)); transition: width .35s ease; }
.shg-wiz__count { text-align: center; font-size: 13px; color: #888; margin: 0 0 14px; }
.shg-wiz__pane { display: none; }
.shg-wiz__pane.is-active { display: block; animation: shg-fade .3s ease; }
.shg-wiz__pane .shg-auth__title { font-size: 20px; margin-bottom: 18px; }
.shg-wiz__nav { display: flex; gap: 10px; margin-top: 8px; }
.shg-wiz__nav .shg-btn { flex: 1; }
.shg-birth { display: grid; grid-template-columns: 1fr 1.4fr 1.2fr; gap: 8px; }
select.shg-field__input { appearance: none; -webkit-appearance: none; padding-left: 34px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23060551' stroke-width='2'/%3E%3C/svg%3E") no-repeat left 14px center; }
.shg-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.shg-chip { position: relative; cursor: pointer; }
.shg-chip input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.shg-chip span { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px; border: 2px solid #e2e2ee; background: #fff; font-size: 14px; font-weight: 600; transition: .15s; }
.shg-chip input:checked + span { border-color: var(--shg-orange); background: #fff4e8; color: var(--shg-navy); }
.shg-chip input:focus-visible + span { outline: 3px solid var(--shg-orange); outline-offset: 2px; }
.shg-chips--big .shg-chip span { padding: 12px 18px; font-size: 15px; }
.shg-chips--big .shg-ic { font-size: 22px; }

/* ==========================================================================
   Card to card box
   ========================================================================== */
.shg-c2c { margin: 30px 0; padding: 26px; background: #fff; border-radius: 26px; box-shadow: 0 14px 40px rgba(6,5,81,.1); border: 2px solid #ffe2c4; }
.shg-c2c__title { display: flex; align-items: center; gap: 10px; font-size: 22px; font-weight: 800; color: var(--shg-ink); margin-bottom: 14px; }
.shg-c2c__title .shg-ic { font-size: 30px; color: var(--shg-orange); }
.shg-c2c__card {
	position: relative; max-width: 420px; aspect-ratio: 1.6; margin: 20px 0; padding: 22px 24px; border-radius: 22px; color: #fff;
	background: radial-gradient(circle at 90% 10%, rgba(247,149,52,.55), transparent 45%), linear-gradient(135deg, var(--shg-navy), #2b1060);
	display: flex; flex-direction: column; justify-content: space-between; box-shadow: 0 18px 40px rgba(6,5,81,.35);
}
.shg-c2c__bank { font-weight: 700; opacity: .9; }
.shg-c2c__num { font-size: 26px; font-weight: 800; letter-spacing: 2px; text-align: center; font-variant-numeric: tabular-nums; }
.shg-c2c__holder { font-weight: 700; }
.shg-c2c__sheba { font-size: 12px; opacity: .8; }
.shg-c2c__copy {
	position: absolute; left: 16px; top: 16px; display: inline-flex; align-items: center; gap: 6px;
	border: 0; border-radius: 999px; padding: 6px 12px; background: rgba(255,255,255,.18); color: #fff; font-size: 13px;
}
.shg-c2c__copy:hover { background: rgba(255,255,255,.3); }
.shg-c2c__note { color: #555; font-size: 14px; }
.shg-c2c__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 16px; margin-top: 10px; }
.shg-field--file input { width: 100%; padding: 12px; border: 2px dashed #e2e2ee; border-radius: var(--shg-radius); background: #fafafe; }
.shg-c2c__done { display: flex; gap: 14px; align-items: flex-start; background: #eefaf2; border-radius: 18px; padding: 16px 18px; }
.shg-c2c__done > .shg-ic { font-size: 30px; color: #1e8449; }
.shg-c2c__done p { margin: 4px 0 0; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1200px) {
	.shg-hcards__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; max-width: 1000px; margin: 0 auto; }
	.shg-hcard__img { height: auto; aspect-ratio: 232 / 180; }
}

@media (max-width: 960px) {
	.shg-header { padding-top: 16px; }
	.shg-header__logo img { width: 150px; }
	.shg-header__tools { top: 18px; }
	.shg-header__burger {
		display: grid; place-items: center; position: absolute; right: 0; top: 18px;
		width: 42px; height: 42px; border: 0; background: none; color: #fff; font-size: 30px;
	}
	.shg-social--header { display: none; }
	.shg-nav {
		position: fixed; top: 0; bottom: 0; right: 0; z-index: 100; width: min(82vw, 330px); margin: 0;
		background: var(--shg-navy); padding: 70px 26px 30px; overflow-y: auto;
		transform: translateX(105%); transition: transform .3s ease; box-shadow: -20px 0 50px rgba(0,0,0,.35);
	}
	.shg-nav.is-open { transform: none; }
	.shg-nav__close { display: grid; place-items: center; position: absolute; top: 16px; left: 16px; width: 42px; height: 42px; border: 0; background: rgba(255,255,255,.08); color: #fff; border-radius: 50%; font-size: 24px; }
	.shg-menu { flex-direction: column; gap: 2px; }
	.shg-menu a { font-size: 18px; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
	.shg-menu .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; background: transparent; padding: 0 16px 0 0; }
	.shg-menu .sub-menu a { color: rgba(255,255,255,.8); font-size: 16px; }
	.shg-social--nav { display: flex; margin-top: 26px; font-size: 26px; gap: 14px; }
	.shg-nav-backdrop { position: fixed; inset: 0; z-index: 99; background: rgba(3,2,30,.55); }
	body.shg-nav-open { overflow: hidden; }
	.shg-header { padding-bottom: calc(var(--shg-dome) + 18px); }

	.shg-catbar__inner { padding: 6px 18px; gap: 10px; }
	.shg-catbar__toggle span { display: none; }
	.shg-catbar__list { gap: 4px 22px; }
	.shg-catbar__list .shg-ic { font-size: 24px; }
	.shg-catbar__end { font-size: 30px; }

	.shg-hero__nav { width: 52px; height: 52px; font-size: 22px; }
	.shg-hero__nav--prev { right: 12px; }
	.shg-hero__nav--next { left: 12px; }

	.shg-crow__title { font-size: 32px; }
	.shg-crow__title .shg-ic { font-size: 28px; }
	.shg-ccard { width: 200px; height: 152px; border-radius: 34px; }
	.shg-carousel__track { gap: 24px; }
	.shg-carousel--courses .shg-carousel__track { padding: 0 20px; scroll-padding: 0 20px; }
	.shg-carousel__btn { display: none; }

	.shg-cover { --w: 78vw; margin-top: -30px; height: calc(var(--w) * .49375); }
	.shg-cover__slide { height: 100%; }
	.shg-cover__nav { display: none; }
	.shg-hcards { border-radius: 50% 50% 50% 50% / var(--shg-dome) var(--shg-dome) 30px 30px; padding-bottom: 56px; }
	.shg-org { margin-top: -30px; border-radius: 50% 50% 50% 50% / 30px 30px 40px 40px; padding: 30px 20px 90px; }
	.shg-stripes { padding-top: 50px; }
	.shg-org__tree, .shg-org__drop { display: none; }
	.shg-org__logo { margin-bottom: 28px; }
	.shg-org__cols { grid-template-columns: 1fr; gap: 40px; max-width: 520px; margin: 0 auto; }

	.shg-about__big { font-size: 22px; }
	.shg-about__phone { font-size: 26px; }
	.shg-social--about { font-size: 64px; flex-wrap: wrap; }

	.shg-amazing { padding: 24px 16px; }
	.shg-amazing__inner { flex-direction: column; gap: 14px; }
	.shg-amazing__label { width: auto; flex-direction: row; justify-content: space-between; gap: 10px; }
	.shg-amazing__title { font-size: 26px; }
	.shg-amazing__title br { display: none; }
	.shg-amazing__pct { font-size: 28px; margin-inline-end: auto; }
	.shg-amazing__box { padding: 12px 0 14px 16px; }
	.shg-prow__title { font-size: 28px; margin-bottom: 28px; }
	.shg-prow__frame { width: calc(100% - 32px); }
	.shg-carousel--products .shg-carousel__track { padding: 0 18px; gap: 18px; }

	.shg-course__top { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
	.shg-header__logo img { width: 124px; }
	.shg-hcards { padding-inline: 16px; }
	.shg-hcards__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
	.shg-hcard__img { border-radius: 20px; }
	.shg-hcard__title { font-size: 15px; margin-top: 10px; }
	.shg-cover { --w: 88vw; }
	.shg-gallery__item { width: 120px; height: 94px; border-radius: 12px; }
	.shg-gallery__row--2 .shg-gallery__item { width: 190px; height: 146px; border-radius: 18px; }
	.shg-gallery__row--3 .shg-gallery__item { width: 112px; height: 88px; }
	.shg-gallery__row { margin-bottom: 18px; }
	.shg-stripes__coral { margin-top: 70px; }
	.shg-stripes__red { height: 18px; }
	.shg-stripes__coral { height: 22px; }
	.shg-page-title { font-size: 26px; }
	.shg-auth { padding: 26px 20px 22px; border-radius: 24px; }
	.shg-auth__row { grid-template-columns: 1fr; gap: 0; }
	.shg-c2c { padding: 18px; }
	.shg-c2c__grid { grid-template-columns: 1fr; }
	.shg-c2c__num { font-size: 20px; }
	.shg-crow__band { padding: 22px 0 30px; }
	.shg-crow { margin-bottom: 36px; }
	.shg-crow__title { font-size: 26px; }
	.shg-ccard { width: 170px; height: 128px; border-radius: 28px; }
	.shg-prod { width: 132px; height: 172px; border-radius: 40px; }
	.shg-prod--amazing { width: 150px; height: 214px; border-radius: 38px; }
	.shg-prod--amazing .shg-prod__img { height: 122px; border-radius: 30px; }
	.shg-shop__banner { min-height: 60px; }
}

/* Course page: CTA + syllabus */
.shg-course__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 8px; }
.shg-course__price { font-size: 20px; font-weight: 800; color: var(--shg-ink); }
.shg-course__price del { font-size: 14px; color: #999; font-weight: 400; }
.shg-course__price ins { text-decoration: none; }
.shg-course__cols { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 30px; align-items: start; }
.shg-course__cols > .shg-prose:only-child { grid-column: 1 / -1; }
.shg-syllabus { background: #fff; border-radius: 24px; padding: 20px; box-shadow: 0 12px 30px rgba(6,5,81,.08); position: sticky; top: 20px; }
.shg-syllabus__title { font-size: 18px; font-weight: 800; color: var(--shg-ink); margin-bottom: 10px; }
.shg-syllabus__title small { font-size: 13px; color: #888; font-weight: 500; }
.shg-syllabus ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.shg-syllabus li { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 12px; font-size: 14px; font-weight: 600; }
.shg-syllabus li:nth-child(odd) { background: #fafafe; }
.shg-syllabus__n { flex: none; width: 28px; height: 28px; border-radius: 9px; display: grid; place-items: center; background: #eeeef6; font-size: 13px; }
.shg-syllabus li.is-done .shg-syllabus__n { background: #e8f7ee; color: #1e8449; }
.shg-syllabus__t { flex: 1; }
.shg-syllabus small { color: #888; font-weight: 500; }
.shg-syllabus__lock { color: #bbb; font-size: 18px; }
@media (max-width: 900px) { .shg-course__cols { grid-template-columns: 1fr; } .shg-syllabus { position: static; } }
.shg-pill--full { background: #fdecea; color: #c0392b; padding: 10px 18px; font-size: 15px; }
.shg-course__pre { align-items: flex-start; }
.shg-course__pre span { padding-top: 2px; }

/* Conditional registration survey */
.shg-survey{width:100%;min-width:0}.shg-survey [hidden]{display:none!important}.shg-survey__group{border:1px solid #d9dfe9;border-radius:14px;padding:16px;margin:16px 0;min-width:0}.shg-survey__group legend{font-weight:700;padding:0 6px;max-width:100%}.shg-survey__group label{display:flex;align-items:center;gap:9px;padding:9px 4px;cursor:pointer;line-height:1.7}.shg-survey__group input{width:18px;height:18px;accent-color:#2563eb;flex-shrink:0}.shg-survey textarea{min-height:120px;resize:vertical}.shg-survey .shg-field{min-width:0}.shg-survey .shg-field__input{max-width:100%;box-sizing:border-box}@media(max-width:600px){.shg-survey .shg-auth__row{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}.shg-survey__group{padding:12px;margin:12px 0}}

/* Footer trust seal and responsive brand row */
.shg-footer__brands { display:flex; justify-content:center; align-items:center; gap:28px; flex-wrap:wrap; }
.shg-footer__brands .shg-footer__logo { display:inline-flex; align-items:center; justify-content:center; }
.shg-footer__enamad { display:inline-flex; align-items:center; justify-content:center; min-width:100px; min-height:100px; }
.shg-footer__enamad img { display:block; width:100px; height:100px; object-fit:contain; }
.shg-social--footer { flex-wrap:wrap; }
.shg-social__link:focus-visible, .shg-footer__enamad:focus-visible { outline:2px solid #ffb35a; outline-offset:4px; border-radius:5px; }
@media(max-width:480px) { .shg-footer__brands { gap:14px; } .shg-footer__logo img { max-width:125px; height:auto; } .shg-footer__enamad img { width:86px; height:86px; } .shg-social--footer { gap:14px; } }

/* Preserve entire homepage cover images on every viewport. */
.shg-cover__slide { background: var(--shg-plum); }
.shg-cover__slide img { max-width: 100%; }
@media (max-width: 640px) {
  .shg-cover { --w: 92vw; margin-top: -16px; }
  .shg-cover__slide[data-off="1"] { transform: translate(-148%, -50%); }
  .shg-cover__slide[data-off="-1"] { transform: translate(48%, -50%); }
}
@media (prefers-reduced-motion: reduce) {
  .shg-cover__slide { transition-duration: .01ms; }
}
