/* FRIATO — Certificações e prêmios
   Mesma linguagem das páginas institucionais: cabeçalho em gradiente, seções creme/areia, cartões brancos
   com raio grande. Cartões inclinam na direção do mouse (friato-ds.js, .js-tilt) e entram em sequência. */

.fr-certpage__head { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: end; gap: 18px 48px; margin-bottom: clamp(26px, 3.6vw, 44px); }
.fr-certpage__head .fr-h2 { margin: 0; }
.fr-certpage__head .fr-section__sub { margin-top: 10px; }
.fr-certpage__note { position: relative; margin: 0; padding-left: 56px; font-size: 15px; line-height: 1.6; color: var(--fr-muted-text); }
.fr-certpage__note::before { content: ""; position: absolute; left: 0; top: .75em; width: 40px; height: 2px; border-radius: 2px; background: var(--fr-red); }
@media (max-width: 767.98px) {
    .fr-certpage__head { grid-template-columns: 1fr; }
}

/* ---------- Certificações: palco do selo em cima, texto embaixo ---------- */
.fr-cert-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: clamp(16px, 2vw, 24px); margin: 0; padding: 0; list-style: none; }
.fr-cert {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--fr-radius-card);
    background: var(--fr-white);
    box-shadow: 0 1px 0 var(--fr-sand), 0 14px 32px rgba(58, 18, 8, .07);
    transition: box-shadow .35s var(--fr-ease), transform .35s var(--fr-ease);
}
/* filete em gradiente que cresce no topo ao passar o mouse */
.fr-cert::before { content: ""; position: absolute; z-index: 2; left: 0; right: 0; top: 0; height: 4px; background: var(--fr-g-pill); transform: scaleX(0); transform-origin: left; transition: transform .5s var(--fr-ease); }
.fr-cert:hover::before, .fr-cert:focus-within::before { transform: scaleX(1); }
.fr-cert:hover { box-shadow: 0 1px 0 var(--fr-sand), 0 26px 50px rgba(212, 38, 31, .16); }

.fr-cert__stage {
    position: relative;
    display: grid;
    place-items: center;
    height: clamp(170px, 15vw, 200px);
    padding: 28px;
    background: linear-gradient(180deg, var(--fr-cream), var(--fr-white));
    border-bottom: 1px solid var(--fr-sand);
}
.fr-cert__stage img { position: relative; z-index: 1; width: auto; max-width: 78%; height: auto; max-height: 128px; object-fit: contain; transition: transform .5s var(--fr-ease); }
/* halo dourado tracejado que gira atrás do selo */
.fr-cert__halo {
    position: absolute;
    width: 150px;
    aspect-ratio: 1;
    border-radius: 50%;
    border: 1.5px dashed rgba(245, 181, 27, .55);
    opacity: 0;
    transform: scale(.7);
    transition: opacity .4s, transform .6s var(--fr-ease);
}
.fr-cert__halo::after { content: ""; position: absolute; width: 10px; height: 10px; left: 12%; top: 12%; border-radius: 50%; background: var(--fr-gold); box-shadow: 0 0 0 6px rgba(245, 181, 27, .2); }
.fr-cert:hover .fr-cert__halo { opacity: 1; transform: scale(1); animation: fr-spin 18s linear infinite; }
.fr-cert:hover .fr-cert__stage img { transform: translateZ(30px) scale(1.06); }

.fr-cert__body { display: flex; flex-direction: column; gap: 8px; flex: 1; padding: 20px 22px 24px; }
.fr-cert__kind { font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--fr-red); }
.fr-cert__title { margin: 0; font-size: 19px; font-weight: 800; line-height: 1.25; color: var(--fr-ink); }
.fr-cert__text { margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--fr-ink); opacity: .86; }
.fr-cert__more { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 10px; font-size: 14px; font-weight: 800; color: var(--fr-red); text-decoration: none; }
.fr-cert__more span[aria-hidden] { transition: transform .3s var(--fr-ease); }
.fr-cert__more:hover span[aria-hidden] { transform: translateX(4px); }
.fr-cert__more:focus-visible { outline: 3px solid var(--fr-gold); outline-offset: 3px; border-radius: 6px; }

@media (prefers-reduced-motion: reduce) {
    .fr-cert, .fr-cert::before, .fr-cert__stage img, .fr-cert__halo { transition: none; animation: none !important; }
}
