/* ==============================================
   Callsystem Tag Cloud — tag-cloud.css v2.0
   Paleta extraída do logo Callsystem
   Azul marinho : #141c34
   Verde        : #2e563e / #3d7a54
   Amarelo      : #ddc934 / #b5a027
   Lilás        : #908ea3
================================================= */

.cstc-tag-cloud {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    width: 100%;
}

.cstc-align-center { justify-content: center; }
.cstc-align-left   { justify-content: flex-start; }
.cstc-align-right  { justify-content: flex-end; }

.cstc-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 22px;
    border-radius: 999px;
    font-size: 13.5px;
    font-weight: 400;
    letter-spacing: 0.015em;
    line-height: 1;
    white-space: nowrap;
    cursor: default;
    text-decoration: none;
    transition: transform 0.15s ease, filter 0.15s ease;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
}

a.cstc-tag { cursor: pointer; }

.cstc-tag:hover {
    transform: scale(1.07);
    filter: brightness(1.08);
    text-decoration: none;
}

/* Clara */
.cstc-tag.t-light {
    background-color: #e8eaf2;
    color: #141c34;
    box-shadow: inset 2px 2px 5px rgba(255,255,255,.85), inset -2px -2px 5px rgba(100,110,160,.18);
}

/* Verde médio */
.cstc-tag.t-green {
    background-color: #3d7a54;
    color: #c8e8d5;
    box-shadow: inset 2px 2px 5px rgba(255,255,255,.12), inset -2px -2px 5px rgba(20,50,30,.30);
}

/* Verde escuro */
.cstc-tag.t-green-dark {
    background-color: #2e563e;
    color: #a8d4bc;
    box-shadow: inset 2px 2px 5px rgba(255,255,255,.10), inset -2px -2px 5px rgba(10,30,20,.35);
}

/* Amarelo */
.cstc-tag.t-yellow {
    background-color: #ddc934;
    color: #3a3000;
    box-shadow: inset 2px 2px 5px rgba(255,255,255,.30), inset -2px -2px 5px rgba(120,100,0,.25);
}

/* Dourado escuro */
.cstc-tag.t-yellow-dark {
    background-color: #b5a027;
    color: #2a2400;
    box-shadow: inset 2px 2px 5px rgba(255,255,255,.18), inset -2px -2px 5px rgba(80,60,0,.30);
}

/* Lilás */
.cstc-tag.t-lilac {
    background-color: #908ea3;
    color: #ffffff;
    box-shadow: inset 2px 2px 5px rgba(255,255,255,.20), inset -2px -2px 5px rgba(40,38,70,.30);
}

/* Marinho */
.cstc-tag.t-navy {
    background-color: #141c34;
    color: #c5cce0;
    box-shadow: inset 2px 2px 5px rgba(255,255,255,.08), inset -2px -2px 5px rgba(0,0,20,.40);
}

@media (max-width: 480px) {
    .cstc-tag { font-size: 12.5px; padding: 7px 16px; }
}