/* The Dieng Group theme — behaviour layer on top of the compiled design (app.css). */

/* ---- scroll reveal (replaces the original's JS animation library) -------- */
.js [data-reveal]:not(.is-in) { opacity: 0; transform: var(--rt, translateY(24px)); }
.js [data-reveal="t"]:not(.is-in) { opacity: 1; transform: var(--rt); }
.js [data-reveal].is-in { animation: dg-reveal .8s cubic-bezier(.22, 1, .36, 1) var(--rd, 0s) backwards; }
.js [data-reveal="t"].is-in { animation-name: dg-grow; animation-duration: 1s; }
@keyframes dg-reveal { from { opacity: 0; transform: var(--rt, translateY(24px)); } }
@keyframes dg-grow { from { transform: var(--rt); } }

.js img[data-fade] { opacity: 0; transition: opacity .7s ease; }
.js img[data-fade].is-loaded { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .js [data-reveal], .js [data-reveal]:not(.is-in) { opacity: 1 !important; transform: none !important; animation: none !important; }
  .js img[data-fade] { opacity: 1; transition: none; }
}

/* ---- desktop dropdown ----------------------------------------------------- */
[data-dd-panel] { opacity: 0; transform: translateY(8px) scale(.97); pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
[data-dd][data-open] > [data-dd-panel] { opacity: 1; transform: none; pointer-events: auto; }
[data-dd-btn] > span { display: inline-flex; transition: transform .2s ease; }
[data-dd][data-open] > [data-dd-btn] > span { transform: rotate(180deg); }

/* ---- mobile menu ---------------------------------------------------------- */
[data-m-panel]:not([hidden]) { animation: dg-pop .25s ease both; transform-origin: top right; }
@keyframes dg-pop { from { opacity: 0; transform: translateY(-6px) scale(.98); } }
[data-m-sub-btn] > span { display: inline-flex; transition: transform .2s ease; }
[data-m-sub-btn][aria-expanded="true"] > span { transform: rotate(180deg); }
[data-m-sub]:not([hidden]) { animation: dg-pop .2s ease both; }

/* ---- sector tabs ---------------------------------------------------------- */
[data-tab-panels] > [data-tab-panel]:not([hidden]) { animation: dg-fadein .45s ease both; }
@keyframes dg-fadein { from { opacity: 0; transform: translateY(6px); } }

/* ---- logged-in admin bar offset ------------------------------------------ */
.admin-bar nav.fixed { top: calc(3px + 32px); }
.admin-bar > div > .fixed.top-0 { top: 32px; }
@media (max-width: 782px) {
  .admin-bar nav.fixed { top: calc(3px + 46px); }
  .admin-bar > div > .fixed.top-0 { top: 46px; }
}
html { scroll-padding-top: 5rem; }

/* ---- inner pages ---- */
@keyframes dg-slide { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: none; } }
.dg-slide { animation: dg-slide .4s cubic-bezier(.22, 1, .36, 1) both; }
.dg-err-contact { margin-top: 1rem; }
@media (min-width: 640px) { .dg-err-contact { margin-top: 1.25rem; } }
