/* Core card layout */
.cre-card__wrap { width: 100%; position: relative; }
.cre-card { position: relative; width: 100%; height: 380px; overflow: hidden; display: grid; }
.cre-card__image { position: absolute; inset: 0; }
.cre-card__image img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Text content on front */
.cre-card__content { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 1.25rem; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.35); background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.45) 100%); }
.cre-card__title { margin: 0 0 .25rem; line-height: 1.2; }
.cre-card__subtitle { opacity: .9; }
.cre-card__btn { display: inline-block; margin-top: .75rem; padding: .6rem .95rem; font-weight: 600; text-decoration: none; background: rgba(255,255,255,.12); color: #fff; border: 1px solid rgba(255,255,255,.35); backdrop-filter: blur(2px); }

/* Overlay (revealed panel) */
.cre-card__overlay { position: absolute; inset: auto 0 0 0; background: rgba(15,15,18,.9); color: #fff; padding: 1.25rem; transform: translateY(100%); transition: transform var(--cre-duration, 400ms) var(--cre-ease, ease); z-index: 3; }
.cre-card__overlay h4 { margin: 0 0 .5rem; }
.cre-card__reveal { opacity: .95; }
.cre-card__icon { position: absolute; top: .85rem; right: 1rem; display: inline-flex; align-items: center; }

/* Hover trigger */
.cre-card[data-trigger="hover"]:hover .cre-card__overlay { transform: translateY(0); }

/* Click trigger toggled via JS */
.cre-card.is-revealed .cre-card__overlay { transform: translateY(0); }

/* Small helpers */
.cre-card * { box-sizing: border-box; }