@layer bricks {.brxe-code{width:100%}}@layer bricks {:where(.brxe-heading).has-separator{align-items:center;display:inline-flex;gap:20px}:where(.brxe-heading)>[contenteditable]{display:inline-block;text-decoration:inherit}:where(.brxe-heading) .separator{border-top:1px solid;flex-grow:1;flex-shrink:0;height:1px}}#brxe-hgacsh {display: none} .hymn-bg-layer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; opacity: 0; transition: opacity 0.8s ease; z-index: 1; }@media (min-width: 769px) { .hymn-bg-layer { background-size: 300% 100%; } .hymn-grid-item[data-id="0"] .hymn-bg-layer { background-position: 0% center; }}@media (max-width: 768px) { .hymn-bg-layer { background-size: cover !important; background-position: center !important; opacity: 0 !important; } .hymn-grid-item[data-id="0"] .hymn-bg-layer:nth-child(1) { opacity: 1 !important; z-index: 2 !important; }} .hymn-title { font-size: clamp(1.4rem, 2.5vw, 2.2rem); font-weight: 700; margin-bottom: 8px; color: #fff; } .hymn-desc { font-size: clamp(0.9rem, 1.2vw, 1.1rem); opacity: 0.8; color: #fff; } .hymn-label { position: relative; z-index: 10; color: #fff; text-align: center; pointer-events: none; transform: translateY(10px); opacity: 0.9; transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.6s ease; } .hymn-grid-item:hover .hymn-label { transform: translateY(-5px); opacity: 1; } .hymn-grid-item { position: relative; text-decoration: none; overflow: hidden; border-right: 1px solid #fff; display: flex; align-items: center; justify-content: center; } .hymn-grid-item::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 5; transition: background 0.4s ease; } .hymn-grid-item:hover::before { background: rgba(0, 0, 0, 0.1); }@media (max-width: 768px) { .hymn-grid-item { height: 33.33vh; border-bottom: 1px solid #fff; }}@media (min-width: 769px) { .hymn-grid-item[data-id="1"] .hymn-bg-layer { background-position: 50% center; }}@media (max-width: 768px) { .hymn-grid-item[data-id="1"] .hymn-bg-layer:nth-child(2) { opacity: 1 !important; z-index: 2 !important; }}@media (min-width: 769px) { .hymn-grid-item[data-id="2"] .hymn-bg-layer { background-position: 100% center; }}@media (max-width: 768px) { .hymn-grid-item[data-id="2"] .hymn-bg-layer:nth-child(3) { opacity: 1 !important; z-index: 2 !important; }}.hymn-grid-container { display: grid; grid-template-columns: repeat(3, 1fr); width: 100%; height: 100vh; overflow: hidden; background: #000; }@media (max-width: 768px) { .hymn-grid-container { grid-template-columns: 1fr; height: auto; }}