/* Hybrid (from Concept C) — about: the stance */
.sg-ab-hero { position: relative; min-height: min(78vh, 720px); display: flex; align-items: flex-end; overflow: hidden; isolation: isolate; }
.sg-ab-vid { -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent); mask-image: linear-gradient(180deg, #000 70%, transparent); position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.sg-ab-shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(12,10,8,.9), rgba(12,10,8,.55) 45%, rgba(12,10,8,.1)), linear-gradient(180deg, transparent 60%, rgba(12,10,8,.4)); }
.sg-ab-in { width: 100%; padding-top: 80px; padding-bottom: 70px; }
.sg-oaths { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin-top: 26px; }
.sg-oath { position: relative; padding: 30px 24px 26px; border-radius: 16px; background: var(--panel); border: 1px solid var(--umber); display: grid; gap: 10px; align-content: start; transition: border-color .3s, box-shadow .3s; }
.sg-oath .sg-seal { width: 58px; height: 58px; font: 900 17px/1 var(--font-display); cursor: pointer; }
.sg-oath.sworn { border-color: var(--gold-hair); box-shadow: 0 0 30px rgba(212,175,55,.12); }
.sg-oath .sg-p { margin: 0; }
.sg-flow { list-style: none; margin: 26px 0 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0; counter-reset: f; }
.sg-flow li { position: relative; display: grid; justify-items: center; text-align: center; gap: 8px; padding: 0 6px; }
.sg-flow li:not(:last-child)::after { content: ''; position: absolute; top: 32px; left: calc(50% + 36px); right: calc(-50% + 36px); height: 2px; background: repeating-linear-gradient(90deg, var(--gold-hair) 0 6px, transparent 6px 11px); }
.sg-flow a { display: grid; justify-items: center; gap: 8px; text-decoration: none; color: inherit; }
.sg-flow .sg-fm { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; font-size: 28px; color: #3a2508; background: var(--sg-wax-gold); box-shadow: 0 8px 20px rgba(0,0,0,.55), inset 0 0 0 3px rgba(90,60,10,.35), 0 0 0 4px rgba(12,10,8,.7); transition: transform .3s var(--ease-spring); }
.sg-flow a:hover .sg-fm { transform: scale(1.1) rotate(-6deg); }
.sg-flow b { font: 700 14px/1.2 var(--font-heading); color: var(--cream); }
.sg-flow small { font: italic 14px/1.3 var(--font-lore); color: var(--cream-dim); }
.sg-isnt li iconify-icon { color: #ff8a9b; }
@media (max-width: 900px) {
  .sg-oaths { grid-template-columns: 1fr; }
  .sg-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 26px; }
  .sg-flow li::after { display: none; }
}
@media (max-width: 1150px) and (min-width: 901px) { .sg-oaths { grid-template-columns: repeat(2, minmax(0, 1fr)); } }