/* INESC Button element — WPBakery
 * Every value is driven by a CSS custom property so that the WPBakery
 * controls (colors, padding, margin, border, hover, link) can override
 * the preset on a per-instance basis.
 */

.iidc-btn-wrap {
    display: block;
    width: 100%;
}
.iidc-btn-wrap--left   { text-align: left; }
.iidc-btn-wrap--center { text-align: center; }
.iidc-btn-wrap--right  { text-align: right; }

.iidc-btn {
    /* Brand palette defaults (INESC: deep blue, lime green, slate gray). */
    --iidc-btn-color:               #ffffff;
    --iidc-btn-color-hover:         #ffffff;
    --iidc-btn-bg:                  #0f3e5c;
    --iidc-btn-bg-hover:            #8ac24a;
    --iidc-btn-border-color:        transparent;
    --iidc-btn-border-color-hover:  transparent;
    --iidc-btn-border-width:        1px;
    --iidc-btn-border-style:        solid;
    --iidc-btn-border-radius:       4px;
    --iidc-btn-padding:             8px 18px;
    --iidc-btn-margin:              0;
    --iidc-btn-font-size:           14px;
    --iidc-btn-font-weight:         600;
    --iidc-btn-text-transform:      none;
    --iidc-btn-letter-spacing:      0;
    --iidc-btn-min-width:           0;
    --iidc-btn-transition:          200ms;
    --iidc-btn-circle-size:         32px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    box-sizing: border-box;
    color: var(--iidc-btn-color);
    background: var(--iidc-btn-bg);
    border: var(--iidc-btn-border-width) var(--iidc-btn-border-style) var(--iidc-btn-border-color);
    border-radius: var(--iidc-btn-border-radius);
    padding: var(--iidc-btn-padding);
    margin: var(--iidc-btn-margin);
    font-size: var(--iidc-btn-font-size);
    font-weight: var(--iidc-btn-font-weight);
    text-transform: var(--iidc-btn-text-transform);
    letter-spacing: var(--iidc-btn-letter-spacing);
    min-width: var(--iidc-btn-min-width);
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    transition:
        background-color var(--iidc-btn-transition) ease,
        color            var(--iidc-btn-transition) ease,
        border-color     var(--iidc-btn-transition) ease,
        transform        var(--iidc-btn-transition) ease,
        box-shadow       var(--iidc-btn-transition) ease;
}

.iidc-btn:hover,
.iidc-btn:focus-visible {
    color: var(--iidc-btn-color-hover);
    background: var(--iidc-btn-bg-hover);
    border-color: var(--iidc-btn-border-color-hover);
    text-decoration: none;
    outline: none;
}

/* Icon */
.iidc-btn__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--iidc-btn-icon-size, 1em);
    line-height: 1;
    color: inherit;
    flex-shrink: 0;
}
.iidc-btn--icon-left  .iidc-btn__icon { order: 0; }
.iidc-btn--icon-right .iidc-btn__icon { order: 2; }
.iidc-btn--icon-right .iidc-btn__text,
.iidc-btn--icon-right .iidc-btn__subtitle { order: 1; }

.iidc-btn--lift:hover,
.iidc-btn--lift:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(0, 0, 0, .12);
}

/* ============================================================
 * Preset: Small CTA — solid (e.g. "see all >")
 * passive: solid green / white text  →  active: deep blue / white
 * ============================================================ */
.iidc-btn--cta-solid {
    --iidc-btn-color:               #ffffff;
    --iidc-btn-bg:                  #8ac24a;
    --iidc-btn-border-color:        #8ac24a;
    --iidc-btn-color-hover:         #ffffff;
    --iidc-btn-bg-hover:            #0f3e5c;
    --iidc-btn-border-color-hover:  #0f3e5c;
    --iidc-btn-padding:             6px 14px;
    --iidc-btn-font-size:           13px;
    --iidc-btn-border-radius:       4px;
}

/* ============================================================
 * Preset: Small CTA — outlined (e.g. "see all >")
 * passive: green outline / green text  →  active: solid green / white
 * ============================================================ */
.iidc-btn--cta-outline {
    --iidc-btn-color:               #8ac24a;
    --iidc-btn-bg:                  transparent;
    --iidc-btn-border-color:        #8ac24a;
    --iidc-btn-color-hover:         #ffffff;
    --iidc-btn-bg-hover:            #8ac24a;
    --iidc-btn-border-color-hover:  #8ac24a;
    --iidc-btn-border-width:        1px;
    --iidc-btn-padding:             6px 14px;
    --iidc-btn-font-size:           13px;
    --iidc-btn-border-radius:       4px;
}

/* ============================================================
 * Preset: Medium CTA — solid (e.g. "SUBSCRIBE!>")
 * passive: solid green / white   →   active: deep blue / white
 * ============================================================ */
.iidc-btn--cta-medium {
    --iidc-btn-color:               #ffffff;
    --iidc-btn-bg:                  #8ac24a;
    --iidc-btn-border-color:        #8ac24a;
    --iidc-btn-color-hover:         #ffffff;
    --iidc-btn-bg-hover:            #0f3e5c;
    --iidc-btn-border-color-hover:  #0f3e5c;
    --iidc-btn-padding:             10px 22px;
    --iidc-btn-font-size:           14px;
    --iidc-btn-font-weight:         700;
    --iidc-btn-text-transform:      uppercase;
    --iidc-btn-letter-spacing:      0.5px;
    --iidc-btn-border-radius:       4px;
}

/* ============================================================
 * Preset: Large CTA — two-line (e.g. "Societal Digital
 * Transformation"). Bold subtitle stacks below the text.
 * passive: solid deep blue / white  →  active: white / green text
 * ============================================================ */
.iidc-btn--cta-large {
    --iidc-btn-color:               #ffffff;
    --iidc-btn-bg:                  #0f3e5c;
    --iidc-btn-border-color:        #0f3e5c;
    --iidc-btn-color-hover:         #8ac24a;
    --iidc-btn-bg-hover:            #ffffff;
    --iidc-btn-border-color-hover:  #0f3e5c;
    --iidc-btn-padding:             16px 26px;
    --iidc-btn-font-size:           14px;
    --iidc-btn-font-weight:         400;
    --iidc-btn-min-width:           220px;
    --iidc-btn-border-radius:       4px;

    flex-direction: column;
    align-items: center;
    text-align: center;
    line-height: 1.3;
    gap: 2px;
}
.iidc-btn--cta-large .iidc-btn__text     { font-weight: 400; }
.iidc-btn--cta-large .iidc-btn__subtitle { font-weight: 700; font-size: 1.1em; }

/* ============================================================
 * Preset: Text link (e.g. "TERMO")
 * No background, no border — colored uppercase text only.
 * ============================================================ */
.iidc-btn--text-link {
    --iidc-btn-color:               #8ac24a;
    --iidc-btn-color-hover:         #0f3e5c;
    --iidc-btn-bg:                  transparent;
    --iidc-btn-bg-hover:            transparent;
    --iidc-btn-border-color:        transparent;
    --iidc-btn-border-color-hover:  transparent;
    --iidc-btn-border-width:        0;
    --iidc-btn-padding:             0;
    --iidc-btn-font-weight:         700;
    --iidc-btn-font-size:           15px;
    --iidc-btn-text-transform:      uppercase;
    --iidc-btn-letter-spacing:      1px;
}
.iidc-btn--text-link.iidc-btn--lift:hover,
.iidc-btn--text-link.iidc-btn--lift:focus-visible {
    transform: none;
    box-shadow: none;
}

/* ============================================================
 * Preset: Circle — solid  (passive solid colored dot)
 * ============================================================ */
.iidc-btn--circle-solid,
.iidc-btn--circle-outline {
    width:  var(--iidc-btn-circle-size);
    height: var(--iidc-btn-circle-size);
    min-width: 0;
    padding: 0;
    border-radius: 50%;
    flex-shrink: 0;
    gap: 0;
}
/* Hide text inside circles — show only the icon (if any). */
.iidc-btn--circle-solid   .iidc-btn__text,
.iidc-btn--circle-outline .iidc-btn__text,
.iidc-btn--circle-solid   .iidc-btn__subtitle,
.iidc-btn--circle-outline .iidc-btn__subtitle { display: none; }
.iidc-btn--circle-solid   .iidc-btn__icon,
.iidc-btn--circle-outline .iidc-btn__icon {
    font-size: var(--iidc-btn-icon-size, calc(var(--iidc-btn-circle-size) * 0.42));
}

.iidc-btn--circle-solid {
    --iidc-btn-color:               #ffffff;
    --iidc-btn-bg:                  #0f3e5c;
    --iidc-btn-border-color:        #0f3e5c;
    --iidc-btn-color-hover:         #0f3e5c;
    --iidc-btn-bg-hover:            #ffffff;
    --iidc-btn-border-color-hover:  #0f3e5c;
    --iidc-btn-border-width:        2px;
}

/* ============================================================
 * Preset: Circle — outlined
 * ============================================================ */
.iidc-btn--circle-outline {
    --iidc-btn-color:               #0f3e5c;
    --iidc-btn-bg:                  transparent;
    --iidc-btn-border-color:        #0f3e5c;
    --iidc-btn-color-hover:         #ffffff;
    --iidc-btn-bg-hover:            #0f3e5c;
    --iidc-btn-border-color-hover:  #0f3e5c;
    --iidc-btn-border-width:        2px;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .iidc-btn { transition: none; }
    .iidc-btn--lift:hover,
    .iidc-btn--lift:focus-visible { transform: none; }
}