.elementor-819 .elementor-element.elementor-element-39c494c{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-819 .elementor-element.elementor-element-6f22eca{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-819 .elementor-element.elementor-element-2102ce9{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-819 .elementor-element.elementor-element-decc2a4{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-819 .elementor-element.elementor-element-c1deea5{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;--flex-wrap:nowrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-819 .elementor-element.elementor-element-ae8a608{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-819 .elementor-element.elementor-element-2b251ee{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-819 .elementor-element.elementor-element-7cebe28{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-819 .elementor-element.elementor-element-0646ebf{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}@media(min-width:768px){.elementor-819 .elementor-element.elementor-element-6f22eca{--width:100%;}.elementor-819 .elementor-element.elementor-element-2102ce9{--width:100%;}.elementor-819 .elementor-element.elementor-element-decc2a4{--width:100%;}.elementor-819 .elementor-element.elementor-element-c1deea5{--width:100%;}.elementor-819 .elementor-element.elementor-element-ae8a608{--width:100%;}.elementor-819 .elementor-element.elementor-element-2b251ee{--width:100%;}.elementor-819 .elementor-element.elementor-element-7cebe28{--width:100%;}.elementor-819 .elementor-element.elementor-element-0646ebf{--width:100%;}}/* Start custom CSS for html, class: .elementor-element-8989c8b *//* ========================================================= ISBET — CONTRATE APRENDIZES HERO INTERNO PADRÃO OFICIAL 2026 ========================================================= */ /* ========================================================= SECTION ========================================================= */ .contrate-hero .ct-hero { position: relative; width: 100%; margin: 0; overflow: hidden; padding-block: clamp(64px, 7vw, 88px); background: linear-gradient( 135deg, #FAF8F8 0%, #F6F1F2 48%, #F1E7E9 100% ); font-family: var(--font-primary); } /* ========================================================= SHAPE PRINCIPAL ========================================================= */ .contrate-hero .ct-hero::before { content: ""; position: absolute; width: 620px; height: 620px; top: -350px; right: -230px; border-radius: 50%; background: rgba(188,12,36,.10); pointer-events: none; } /* ========================================================= SHAPE SECUNDÁRIO ========================================================= */ .contrate-hero .ct-hero::after { content: ""; position: absolute; width: 340px; height: 340px; right: 8%; bottom: -230px; border-radius: 50%; background: rgba(255,102,0,.055); pointer-events: none; } /* ========================================================= WRAP ========================================================= */ .contrate-hero .ct-hero__wrap { position: relative; z-index: 2; width: min(1200px, calc(100% - 48px)); margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(420px, .78fr); gap: clamp(48px, 6vw, 76px); align-items: center; } /* ========================================================= CONTENT ========================================================= */ .contrate-hero .ct-hero__content { min-width: 0; } /* ========================================================= EYEBROW ========================================================= */ .contrate-hero .ct-hero__eyebrow { margin: 0 0 10px; font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .09em; text-transform: uppercase; color: var(--red-primary); } /* ========================================================= H1 ========================================================= */ .contrate-hero .ct-hero__title { max-width: 720px; margin: 0; font-size: clamp(2.4rem, 4.5vw, 4rem); font-weight: 700; line-height: 1.04; letter-spacing: -0.045em; color: var(--night); } .contrate-hero .ct-hero__title span { display: block; color: var(--red-primary); } /* ========================================================= TEXT ========================================================= */ .contrate-hero .ct-hero__text { max-width: 620px; margin: 22px 0 0; font-size: clamp(1rem, 1.12vw, var(--text-body)); font-weight: 400; line-height: 1.75; color: var(--ink-60); } /* ========================================================= ACTIONS ========================================================= */ .contrate-hero .ct-hero__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; } /* ========================================================= BUTTON ========================================================= */ .contrate-hero .ct-hero__btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 11px 18px; border: 1px solid transparent; border-radius: 8px; font-size: var(--text-sm); font-weight: 700; line-height: 1; text-decoration: none; transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease; } /* ========================================================= PRIMARY ========================================================= */ .contrate-hero .ct-hero__btn--primary { background: var(--red-primary); border-color: var(--red-primary); color: var(--white); } /* ========================================================= SECONDARY ========================================================= */ .contrate-hero .ct-hero__btn--secondary { background: transparent; border-color: var(--ink-10); color: var(--night); } /* ========================================================= BUTTON SVG ========================================================= */ .contrate-hero .ct-hero__btn svg { width: 15px; height: 15px; flex: 0 0 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= TRUST ========================================================= */ .contrate-hero .ct-hero__trust { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 24px; } .contrate-hero .ct-hero__trust > div { display: inline-flex; align-items: center; gap: 7px; font-size: var(--text-support); font-weight: 500; line-height: 1.4; color: var(--ink-40); } .contrate-hero .ct-hero__trust > div > span { width: 20px; height: 20px; flex: 0 0 20px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--green-light); color: var(--green); } .contrate-hero .ct-hero__trust svg { width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 2.3; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= PANEL ========================================================= */ .contrate-hero .ct-hero__panel { position: relative; overflow: hidden; width: 100%; min-width: 0; padding: 28px; border: 1px solid rgba(255,255,255,.05); border-radius: 14px; background: linear-gradient( 145deg, #021627 0%, #071E31 100% ); box-shadow: 0 18px 42px rgba(2,22,39,.13); } /* ========================================================= PANEL SHAPE ========================================================= */ .contrate-hero .ct-hero__panel::before { content: ""; position: absolute; width: 210px; height: 210px; top: -95px; right: -90px; border-radius: 50%; background: rgba(188,12,36,.28); pointer-events: none; } /* ========================================================= PANEL EYEBROW ========================================================= */ .contrate-hero .ct-hero__panel-eyebrow { position: relative; z-index: 1; margin: 0 0 8px; font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .09em; text-transform: uppercase; color: var(--orange); } /* ========================================================= PANEL TITLE ========================================================= */ .contrate-hero .ct-hero__panel-title { position: relative; z-index: 1; max-width: 380px; margin: 0; font-size: clamp(1.15rem, 1.7vw, 1.4rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: var(--white); } /* ========================================================= FEATURES ========================================================= */ .contrate-hero .ct-hero__features { position: relative; z-index: 1; display: grid; gap: 10px; margin-top: 22px; } /* ========================================================= FEATURE ========================================================= */ .contrate-hero .ct-hero__feature { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 12px; align-items: start; padding: 14px; border: 1px solid rgba(255,255,255,.09); border-radius: 10px; background: rgba(255,255,255,.045); } /* ========================================================= NUMBER ========================================================= */ .contrate-hero .ct-hero__feature > span { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; border-radius: 8px; background: rgba(188,12,36,.22); font-size: 10px; font-weight: 700; line-height: 1; color: #ff8796; } /* ========================================================= FEATURE TITLE ========================================================= */ .contrate-hero .ct-hero__feature strong { display: block; margin-bottom: 3px; font-size: var(--text-sm); font-weight: 700; line-height: 1.4; color: var(--white); } /* ========================================================= FEATURE TEXT ========================================================= */ .contrate-hero .ct-hero__feature p { margin: 0; font-size: var(--text-card); font-weight: 400; line-height: 1.55; color: rgba(255,255,255,.68); } /* ========================================================= HOVER ========================================================= */ @media (hover:hover) and (pointer:fine) { .contrate-hero .ct-hero__btn--primary:hover { background: var(--red-wine); border-color: var(--red-wine); color: var(--white); transform: translateY(-1px); } .contrate-hero .ct-hero__btn--secondary:hover { border-color: var(--red-primary); color: var(--red-primary); transform: translateY(-1px); } } /* ========================================================= TABLET ========================================================= */ @media (max-width: 960px) { .contrate-hero .ct-hero__wrap { grid-template-columns: 1fr; gap: 36px; } .contrate-hero .ct-hero__panel { max-width: 620px; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 640px) { .contrate-hero .ct-hero { padding-block: 48px; } .contrate-hero .ct-hero__wrap { width: calc(100% - 32px); gap: 30px; } .contrate-hero .ct-hero__title { font-size: clamp(2.1rem, 10vw, 2.6rem); } .contrate-hero .ct-hero__text { font-size: var(--text-base); line-height: 1.7; } .contrate-hero .ct-hero__actions { flex-direction: column; } .contrate-hero .ct-hero__btn { width: 100%; } .contrate-hero .ct-hero__trust { display: grid; gap: 9px; } .contrate-hero .ct-hero__panel { padding: 22px; border-radius: 12px; } .contrate-hero .ct-hero::before { width: 420px; height: 420px; top: -250px; right: -230px; } .contrate-hero .ct-hero::after { display: none; } } /* ========================================================= FOCUS ========================================================= */ .contrate-hero .ct-hero a:focus-visible { outline: 3px solid rgba(188,12,36,.20); outline-offset: 3px; } /* ========================================================= REDUCED MOTION ========================================================= */ @media (prefers-reduced-motion: reduce) { .contrate-hero .ct-hero__btn { transition: none !important; } .contrate-hero .ct-hero__btn:hover { transform: none; } }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-0101b81 *//* ========================================================= ISBET — CONTRATE APRENDIZES BLOCO 02 — POR QUE CONTRATAR PADRÃO 2026 ========================================================= */ /* ========================================================= SECTION ========================================================= */ .contrate-porque .ct-porque { width: 100%; margin: 0; padding-block: clamp(64px, 7vw, 84px); background: var(--white); } /* ========================================================= WRAP ========================================================= */ .contrate-porque .ct-porque__wrap { width: min(1200px, calc(100% - 48px)); margin-inline: auto; } /* ========================================================= HEAD ========================================================= */ .contrate-porque .ct-porque__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr); gap: clamp(36px, 5vw, 72px); align-items: end; margin-bottom: 34px; } /* ========================================================= EYEBROW ========================================================= */ .contrate-porque .ct-porque__eyebrow { margin: 0 0 10px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .09em; text-transform: uppercase; color: var(--red-primary); } /* ========================================================= H2 ========================================================= */ .contrate-porque .ct-porque__title { max-width: 700px; margin: 0; font-family: var(--font-primary); font-size: clamp(1.9rem, 3vw, 2.4rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.04em; color: var(--night); } .contrate-porque .ct-porque__title span { display: block; color: var(--red-primary); } /* ========================================================= INTRO ========================================================= */ .contrate-porque .ct-porque__intro { max-width: 560px; margin: 0; font-family: var(--font-primary); font-size: clamp(1rem, 1.12vw, var(--text-body)); font-weight: 400; line-height: 1.72; color: var(--ink-60); } /* ========================================================= GRID ========================================================= */ .contrate-porque .ct-porque__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } /* ========================================================= CARD ========================================================= */ .contrate-porque .ct-porque__card { min-width: 0; min-height: 100%; display: flex; flex-direction: column; padding: 24px; border: 1px solid var(--ink-10); border-radius: 14px; background: var(--ink-02); box-shadow: none; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; } .contrate-porque .ct-porque__card:hover { transform: translateY(-3px); border-color: rgba(188, 12, 36, .16); box-shadow: 0 8px 22px rgba(2, 22, 39, .05); } /* ========================================================= LEGAL CARD ========================================================= */ .contrate-porque .ct-porque__card--legal { background: var(--night); border-color: var(--night); box-shadow: none; } /* ========================================================= ICON ========================================================= */ .contrate-porque .ct-porque__icon { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; border-radius: 10px; background: rgba(188, 12, 36, .08); color: var(--red-primary); } .contrate-porque .ct-porque__card--legal .ct-porque__icon { background: rgba(255, 255, 255, .08); color: var(--orange); } .contrate-porque .ct-porque__icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= LABEL ========================================================= */ .contrate-porque .ct-porque__label { display: block; margin-bottom: 8px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .08em; text-transform: uppercase; color: var(--red-primary); } .contrate-porque .ct-porque__card--legal .ct-porque__label { color: var(--orange); } /* ========================================================= H3 ========================================================= */ .contrate-porque .ct-porque__card h3 { margin: 0; font-family: var(--font-primary); font-size: clamp(1.05rem, 1.3vw, 1.2rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: var(--night); } .contrate-porque .ct-porque__card--legal h3 { color: var(--white); } /* ========================================================= CARD TEXT ========================================================= */ .contrate-porque .ct-porque__card p { margin: 10px 0 0; font-family: var(--font-primary); font-size: var(--text-card); font-weight: 400; line-height: 1.65; color: var(--ink-60); } .contrate-porque .ct-porque__card--legal p { color: rgba(255, 255, 255, .72); } /* ========================================================= LEGAL NOTE ========================================================= */ .contrate-porque .ct-porque__note { margin-top: auto; padding-top: 22px; } .contrate-porque .ct-porque__note::before { content: ""; display: block; width: 100%; height: 1px; margin-bottom: 16px; background: rgba(255, 255, 255, .10); } .contrate-porque .ct-porque__note strong { display: block; margin-bottom: 6px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .07em; text-transform: uppercase; color: var(--orange); } .contrate-porque .ct-porque__note span { display: block; font-family: var(--font-primary); font-size: var(--text-support); font-weight: 400; line-height: 1.6; color: rgba(255, 255, 255, .72); } /* ========================================================= FOOTER STRIP ========================================================= */ .contrate-porque .ct-porque__footer { margin-top: 18px; display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 20px 22px; border: 1px solid var(--ink-10); border-radius: 12px; background: var(--white); } /* ========================================================= FOOTER TEXT ========================================================= */ .contrate-porque .ct-porque__footer strong { display: block; margin-bottom: 5px; font-family: var(--font-primary); font-size: var(--text-sm); font-weight: 700; line-height: 1.4; color: var(--night); } .contrate-porque .ct-porque__footer span { display: block; font-family: var(--font-primary); font-size: var(--text-support); font-weight: 400; line-height: 1.5; color: var(--ink-60); } /* ========================================================= BUTTON ========================================================= */ .contrate-porque .ct-porque__button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; flex-shrink: 0; padding: 11px 18px; border: 1px solid var(--red-primary); border-radius: 8px; background: var(--red-primary); font-family: var(--font-primary); font-size: var(--text-sm); font-weight: 700; line-height: 1; color: var(--white); text-decoration: none; transition: background .2s ease, border-color .2s ease, transform .2s ease; } .contrate-porque .ct-porque__button:hover, .contrate-porque .ct-porque__button:focus-visible { background: var(--red-wine); border-color: var(--red-wine); color: var(--white); transform: translateY(-1px); } /* ========================================================= BUTTON SVG ========================================================= */ .contrate-porque .ct-porque__button svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= TABLET ========================================================= */ @media (max-width: 960px) { .contrate-porque .ct-porque__head { grid-template-columns: 1fr; gap: 16px; } .contrate-porque .ct-porque__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .contrate-porque .ct-porque__card--legal { grid-column: 1 / -1; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 640px) { .contrate-porque .ct-porque { padding-block: 52px; } .contrate-porque .ct-porque__wrap { width: calc(100% - 32px); } .contrate-porque .ct-porque__head { margin-bottom: 28px; } .contrate-porque .ct-porque__title { font-size: clamp(1.8rem, 8vw, 2.15rem); } .contrate-porque .ct-porque__grid { grid-template-columns: 1fr; gap: 14px; } .contrate-porque .ct-porque__card--legal { grid-column: auto; } .contrate-porque .ct-porque__card { padding: 20px; } .contrate-porque .ct-porque__footer { flex-direction: column; align-items: stretch; } .contrate-porque .ct-porque__button { width: 100%; } } /* ========================================================= ACCESSIBILITY ========================================================= */ .contrate-porque .ct-porque a:focus-visible { outline: 3px solid rgba(188, 12, 36, .22); outline-offset: 3px; } /* ========================================================= REDUCED MOTION ========================================================= */ @media (prefers-reduced-motion: reduce) { .contrate-porque .ct-porque *, .contrate-porque .ct-porque *::before, .contrate-porque .ct-porque *::after { transition: none !important; } .contrate-porque .ct-porque__card:hover, .contrate-porque .ct-porque__button:hover { transform: none; } }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-9cedb55 *//* ========================================================= ISBET — CONTRATE APRENDIZES BLOCO 03 — CALCULADORA DE COTAS PADRÃO 2026 ========================================================= */ /* ========================================================= SECTION ========================================================= */ .contrate-calculadora .s-calc-aprendiz { width: 100%; margin: 0; padding-block: clamp(64px, 7vw, 84px); background: var(--ink-02); } /* ========================================================= WRAP ========================================================= */ .contrate-calculadora .s-calc-aprendiz__wrap { width: min(1200px, calc(100% - 48px)); margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(360px, .82fr); gap: clamp(42px, 6vw, 72px); align-items: center; } /* ========================================================= FORM ========================================================= */ .contrate-calculadora .s-calc-aprendiz__form { min-width: 0; display: flex; flex-direction: column; gap: 22px; } /* ========================================================= HEAD ========================================================= */ .contrate-calculadora .s-calc-aprendiz__head { max-width: 680px; } /* ========================================================= EYEBROW ========================================================= */ .contrate-calculadora .s-calc-aprendiz__eyebrow { margin: 0 0 10px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .09em; text-transform: uppercase; color: var(--red-primary); } /* ========================================================= H2 ========================================================= */ .contrate-calculadora .s-calc-aprendiz__title { max-width: 700px; margin: 0; font-family: var(--font-primary); font-size: clamp(1.9rem, 3vw, 2.4rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.04em; color: var(--night); } .contrate-calculadora .s-calc-aprendiz__title span { display: block; color: var(--red-primary); } /* ========================================================= INTRO ========================================================= */ .contrate-calculadora .s-calc-aprendiz__intro { max-width: 620px; margin: 16px 0 0; font-family: var(--font-primary); font-size: clamp(1rem, 1.12vw, var(--text-body)); font-weight: 400; line-height: 1.72; color: var(--ink-60); } /* ========================================================= LEGAL NOTE ========================================================= */ .contrate-calculadora .s-calc-aprendiz__legal-note { margin-top: 20px; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; align-items: start; padding: 16px; border: 1px solid var(--ink-10); border-radius: 12px; background: var(--white); } .contrate-calculadora .s-calc-aprendiz__legal-icon { width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 9px; background: rgba(188, 12, 36, .08); color: var(--red-primary); } .contrate-calculadora .s-calc-aprendiz__legal-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .contrate-calculadora .s-calc-aprendiz__legal-note p { margin: 0; font-family: var(--font-primary); font-size: var(--text-card); font-weight: 400; line-height: 1.65; color: var(--ink-60); } .contrate-calculadora .s-calc-aprendiz__legal-note strong { font-weight: 700; color: var(--night); } /* ========================================================= STEPS ========================================================= */ .contrate-calculadora .s-calc-aprendiz__steps { display: flex; align-items: center; margin: 2px 0 0; } .contrate-calculadora .s-calc-aprendiz__step-item { display: flex; flex-direction: column; align-items: center; gap: 7px; } .contrate-calculadora .s-calc-aprendiz__step-num { width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--ink-10); font-family: var(--font-primary); font-size: 10px; font-weight: 700; color: var(--ink-40); transition: background .2s ease, color .2s ease; } .contrate-calculadora .s-calc-aprendiz__step-label { font-family: var(--font-primary); font-size: var(--text-support); font-weight: 600; white-space: nowrap; color: var(--ink-40); transition: color .2s ease; } .contrate-calculadora .s-calc-aprendiz__step-item.active .s-calc-aprendiz__step-num { background: var(--red-primary); color: var(--white); } .contrate-calculadora .s-calc-aprendiz__step-item.active .s-calc-aprendiz__step-label { color: var(--red-primary); font-weight: 700; } .contrate-calculadora .s-calc-aprendiz__step-item.done .s-calc-aprendiz__step-num { background: var(--green); color: var(--white); } .contrate-calculadora .s-calc-aprendiz__step-item.done .s-calc-aprendiz__step-label { color: var(--green); } .contrate-calculadora .s-calc-aprendiz__step-line { flex: 1; height: 1px; margin: 0 10px 21px; background: var(--ink-10); } /* ========================================================= STEP CARD ========================================================= */ .contrate-calculadora .s-calc-aprendiz__etapa { display: none; flex-direction: column; gap: 18px; padding: 24px; border: 1px solid var(--ink-10); border-radius: 14px; background: var(--white); box-shadow: none; } .contrate-calculadora .s-calc-aprendiz__etapa.active { display: flex; } /* ========================================================= STEP HEAD ========================================================= */ .contrate-calculadora .s-calc-aprendiz__stage-head > span { display: block; margin-bottom: 6px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .08em; text-transform: uppercase; color: var(--red-primary); } .contrate-calculadora .s-calc-aprendiz__stage-head h3 { margin: 0; font-family: var(--font-primary); font-size: clamp(1.05rem, 1.35vw, 1.2rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: var(--night); } .contrate-calculadora .s-calc-aprendiz__stage-head p { margin: 7px 0 0; font-family: var(--font-primary); font-size: var(--text-card); font-weight: 400; line-height: 1.65; color: var(--ink-60); } /* ========================================================= FIELDS ========================================================= */ .contrate-calculadora .s-calc-aprendiz__fields-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; } .contrate-calculadora .s-calc-aprendiz__field { display: flex; flex-direction: column; gap: 7px; } .contrate-calculadora .s-calc-aprendiz__label { font-family: var(--font-primary); font-size: var(--text-support); font-weight: 600; line-height: 1.45; color: var(--night); } .contrate-calculadora .s-calc-aprendiz__input { width: 100%; min-height: 48px; padding: 11px 14px; border: 1px solid var(--ink-10); border-radius: 8px; outline: none; background: var(--white); font-family: var(--font-primary); font-size: 16px; font-weight: 400; color: var(--night); transition: border-color .2s ease, box-shadow .2s ease; } .contrate-calculadora .s-calc-aprendiz__input:focus { border-color: var(--red-primary); box-shadow: 0 0 0 3px rgba(188, 12, 36, .08); } /* ========================================================= BUTTON GROUP ========================================================= */ .contrate-calculadora .s-calc-aprendiz__btns { display: flex; flex-wrap: wrap; gap: 10px; } /* ========================================================= BUTTON ========================================================= */ .contrate-calculadora .s-calc-aprendiz__btn { min-height: 44px; width: fit-content; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 11px 18px; border: 1px solid var(--red-primary); border-radius: 8px; background: var(--red-primary); cursor: pointer; font-family: var(--font-primary); font-size: var(--text-sm); font-weight: 700; line-height: 1; color: var(--white); text-decoration: none; transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease; } .contrate-calculadora .s-calc-aprendiz__btn:hover, .contrate-calculadora .s-calc-aprendiz__btn:focus-visible { background: var(--red-wine); border-color: var(--red-wine); color: var(--white); transform: translateY(-1px); } .contrate-calculadora .s-calc-aprendiz__btn svg { width: 14px; height: 14px; flex-shrink: 0; } .contrate-calculadora .s-calc-aprendiz__btn--outline { background: transparent; border-color: var(--ink-10); color: var(--night); } .contrate-calculadora .s-calc-aprendiz__btn--outline:hover, .contrate-calculadora .s-calc-aprendiz__btn--outline:focus-visible { background: transparent; border-color: var(--red-primary); color: var(--red-primary); } /* ========================================================= RESULT ========================================================= */ .contrate-calculadora .s-calc-aprendiz__resultado { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .contrate-calculadora .s-calc-aprendiz__resultado-card { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 22px; text-align: center; border-radius: 12px; } .contrate-calculadora .s-calc-aprendiz__resultado-card--min { background: rgba(188, 12, 36, .06); border: 1px solid rgba(188, 12, 36, .14); } .contrate-calculadora .s-calc-aprendiz__resultado-card--max { background: rgba(255, 102, 0, .06); border: 1px solid rgba(255, 102, 0, .16); } .contrate-calculadora .s-calc-aprendiz__resultado-label { font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-60); } .contrate-calculadora .s-calc-aprendiz__resultado-valor { font-family: var(--font-primary); font-size: clamp(2.4rem, 5vw, 3.4rem); font-weight: 800; line-height: 1; letter-spacing: -0.04em; } .contrate-calculadora .s-calc-aprendiz__resultado-card--min .s-calc-aprendiz__resultado-valor { color: var(--red-primary); } .contrate-calculadora .s-calc-aprendiz__resultado-card--max .s-calc-aprendiz__resultado-valor { color: var(--orange-dark); } .contrate-calculadora .s-calc-aprendiz__resultado-desc { font-family: var(--font-primary); font-size: var(--text-support); color: var(--ink-40); } /* ========================================================= RESULT INFO ========================================================= */ .contrate-calculadora .s-calc-aprendiz__resultado-info { margin: 0; padding: 15px; border: 1px solid var(--ink-10); border-radius: 9px; background: var(--ink-02); font-family: var(--font-primary); font-size: var(--text-card); line-height: 1.6; color: var(--ink-60); } .contrate-calculadora .s-calc-aprendiz__resultado-info strong { font-weight: 700; color: var(--night); } /* ========================================================= RESULT NOTE ========================================================= */ .contrate-calculadora .s-calc-aprendiz__result-note { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px; align-items: start; } .contrate-calculadora .s-calc-aprendiz__result-note > span { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--green-light); color: var(--green); } .contrate-calculadora .s-calc-aprendiz__result-note svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .contrate-calculadora .s-calc-aprendiz__result-note p { margin: 0; font-family: var(--font-primary); font-size: var(--text-support); line-height: 1.6; color: var(--ink-60); } /* ========================================================= VISUAL PANEL ========================================================= */ .contrate-calculadora .s-calc-aprendiz__visual { overflow: hidden; border-radius: 14px; background: var(--night); box-shadow: 0 12px 32px rgba(2, 22, 39, .08); } /* ========================================================= VISUAL IMAGE ========================================================= */ .contrate-calculadora .s-calc-aprendiz__visual-image { position: relative; overflow: hidden; } .contrate-calculadora .s-calc-aprendiz__visual-image::after { content: ""; position: absolute; inset: 52% 0 0; background: linear-gradient( to bottom, transparent, rgba(2, 22, 39, .72) ); pointer-events: none; } .contrate-calculadora .s-calc-aprendiz__visual img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; } /* ========================================================= VISUAL CONTENT ========================================================= */ .contrate-calculadora .s-calc-aprendiz__visual-content { padding: 24px; } .contrate-calculadora .s-calc-aprendiz__visual-content > span { display: block; margin-bottom: 8px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .09em; text-transform: uppercase; color: var(--orange); } .contrate-calculadora .s-calc-aprendiz__visual-content strong { display: block; font-family: var(--font-primary); font-size: clamp(1.15rem, 1.6vw, 1.35rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: var(--white); } .contrate-calculadora .s-calc-aprendiz__visual-content p { margin: 10px 0 0; font-family: var(--font-primary); font-size: var(--text-card); line-height: 1.65; color: rgba(255, 255, 255, .72); } .contrate-calculadora .s-calc-aprendiz__visual-content a { min-height: 44px; display: inline-flex; align-items: center; gap: 7px; margin-top: 18px; font-family: var(--font-primary); font-size: var(--text-sm); font-weight: 700; color: var(--white); text-decoration: none; transition: color .2s ease; } .contrate-calculadora .s-calc-aprendiz__visual-content a:hover, .contrate-calculadora .s-calc-aprendiz__visual-content a:focus-visible { color: var(--orange); } .contrate-calculadora .s-calc-aprendiz__visual-content a svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= TABLET ========================================================= */ @media (max-width: 900px) { .contrate-calculadora .s-calc-aprendiz__wrap { grid-template-columns: 1fr; gap: 36px; } .contrate-calculadora .s-calc-aprendiz__visual { max-width: 620px; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 640px) { .contrate-calculadora .s-calc-aprendiz { padding-block: 52px; } .contrate-calculadora .s-calc-aprendiz__wrap { width: calc(100% - 32px); gap: 30px; } .contrate-calculadora .s-calc-aprendiz__title { font-size: clamp(1.8rem, 8vw, 2.15rem); } .contrate-calculadora .s-calc-aprendiz__legal-note { grid-template-columns: 36px minmax(0, 1fr); padding: 14px; } .contrate-calculadora .s-calc-aprendiz__legal-icon { width: 34px; height: 34px; } .contrate-calculadora .s-calc-aprendiz__etapa { padding: 20px; } .contrate-calculadora .s-calc-aprendiz__fields-grid { grid-template-columns: 1fr; } .contrate-calculadora .s-calc-aprendiz__resultado { grid-template-columns: 1fr; } .contrate-calculadora .s-calc-aprendiz__btns { flex-direction: column; } .contrate-calculadora .s-calc-aprendiz__btn { width: 100%; } .contrate-calculadora .s-calc-aprendiz__visual { display: none; } } /* ========================================================= ACCESSIBILITY ========================================================= */ .contrate-calculadora .s-calc-aprendiz__btn:focus-visible, .contrate-calculadora .s-calc-aprendiz a:focus-visible, .contrate-calculadora .s-calc-aprendiz__input:focus-visible { outline: 3px solid rgba(188, 12, 36, .22); outline-offset: 3px; } /* ========================================================= REDUCED MOTION ========================================================= */ @media (prefers-reduced-motion: reduce) { .contrate-calculadora .s-calc-aprendiz *, .contrate-calculadora .s-calc-aprendiz *::before, .contrate-calculadora .s-calc-aprendiz *::after { transition: none !important; } .contrate-calculadora .s-calc-aprendiz__btn:hover { transform: none; } }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-11550e1 *//* ========================================================= ISBET — CONTRATE APRENDIZES BLOCO 04 — COMO FUNCIONA PADRÃO 2026 ========================================================= */ /* ========================================================= SECTION ========================================================= */ .contrate-como-funciona .ct-como { width: 100%; margin: 0; padding-block: clamp(64px, 7vw, 84px); background: var(--white); } /* ========================================================= WRAP ========================================================= */ .contrate-como-funciona .ct-como__wrap { width: min(1200px, calc(100% - 48px)); margin-inline: auto; } /* ========================================================= HEAD ========================================================= */ .contrate-como-funciona .ct-como__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr); gap: clamp(36px, 5vw, 72px); align-items: end; margin-bottom: 34px; } /* ========================================================= EYEBROW ========================================================= */ .contrate-como-funciona .ct-como__eyebrow { margin: 0 0 10px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .09em; text-transform: uppercase; color: var(--red-primary); } /* ========================================================= H2 ========================================================= */ .contrate-como-funciona .ct-como__title { max-width: 700px; margin: 0; font-family: var(--font-primary); font-size: clamp(1.9rem, 3vw, 2.4rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.04em; color: var(--night); } .contrate-como-funciona .ct-como__title span { display: block; color: var(--red-primary); } /* ========================================================= INTRO ========================================================= */ .contrate-como-funciona .ct-como__intro { max-width: 560px; margin: 0; font-family: var(--font-primary); font-size: clamp(1rem, 1.12vw, var(--text-body)); font-weight: 400; line-height: 1.72; color: var(--ink-60); } /* ========================================================= JOURNEY ========================================================= */ .contrate-como-funciona .ct-como__journey { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } /* ========================================================= CONNECTION LINE ========================================================= */ .contrate-como-funciona .ct-como__journey::before { content: ""; position: absolute; top: 42px; left: 8%; right: 8%; height: 1px; background: var(--ink-10); z-index: 0; } /* ========================================================= ITEM ========================================================= */ .contrate-como-funciona .ct-como__item { position: relative; z-index: 1; min-width: 0; min-height: 100%; padding: 22px; border: 1px solid var(--ink-10); border-radius: 14px; background: var(--ink-02); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; } .contrate-como-funciona .ct-como__item:hover { transform: translateY(-3px); border-color: rgba(188, 12, 36, .16); box-shadow: 0 8px 22px rgba(2, 22, 39, .05); } /* ========================================================= NUMBER ========================================================= */ .contrate-como-funciona .ct-como__number { position: absolute; top: 15px; right: 16px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .08em; color: var(--ink-40); } /* ========================================================= ICON ========================================================= */ .contrate-como-funciona .ct-como__icon { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; border: 1px solid var(--ink-10); border-radius: 10px; background: var(--white); color: var(--red-primary); } .contrate-como-funciona .ct-como__icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= LABEL ========================================================= */ .contrate-como-funciona .ct-como__content > span { display: block; margin-bottom: 7px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .08em; text-transform: uppercase; color: var(--red-primary); } /* ========================================================= H3 ========================================================= */ .contrate-como-funciona .ct-como__content h3 { margin: 0; font-family: var(--font-primary); font-size: clamp(1.05rem, 1.3vw, 1.2rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: var(--night); } /* ========================================================= ITEM TEXT ========================================================= */ .contrate-como-funciona .ct-como__content p { margin: 8px 0 0; font-family: var(--font-primary); font-size: var(--text-card); font-weight: 400; line-height: 1.65; color: var(--ink-60); } /* ========================================================= FOOTER STRIP ========================================================= */ .contrate-como-funciona .ct-como__footer { margin-top: 18px; display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 20px 22px; border: 1px solid var(--night); border-radius: 12px; background: var(--night); } /* ========================================================= FOOTER ICON ========================================================= */ .contrate-como-funciona .ct-como__footer-icon { width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255, 255, 255, .08); color: var(--orange); } .contrate-como-funciona .ct-como__footer-icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= FOOTER TITLE ========================================================= */ .contrate-como-funciona .ct-como__footer strong { display: block; margin-bottom: 4px; font-family: var(--font-primary); font-size: var(--text-sm); font-weight: 700; line-height: 1.4; color: var(--white); } /* ========================================================= FOOTER TEXT ========================================================= */ .contrate-como-funciona .ct-como__footer span { display: block; font-family: var(--font-primary); font-size: var(--text-support); font-weight: 400; line-height: 1.55; color: rgba(255, 255, 255, .68); } /* ========================================================= BUTTON ========================================================= */ .contrate-como-funciona .ct-como__button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 11px 18px; border: 1px solid var(--red-primary); border-radius: 8px; background: var(--red-primary); font-family: var(--font-primary); font-size: var(--text-sm); font-weight: 700; line-height: 1; color: var(--white); text-decoration: none; transition: background .2s ease, border-color .2s ease, transform .2s ease; } .contrate-como-funciona .ct-como__button:hover, .contrate-como-funciona .ct-como__button:focus-visible { background: var(--red-wine); border-color: var(--red-wine); color: var(--white); transform: translateY(-1px); } .contrate-como-funciona .ct-como__button svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= TABLET ========================================================= */ @media (max-width: 960px) { .contrate-como-funciona .ct-como__head { grid-template-columns: 1fr; gap: 16px; } .contrate-como-funciona .ct-como__journey { grid-template-columns: repeat(2, minmax(0, 1fr)); } .contrate-como-funciona .ct-como__journey::before { display: none; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 640px) { .contrate-como-funciona .ct-como { padding-block: 52px; } .contrate-como-funciona .ct-como__wrap { width: calc(100% - 32px); } .contrate-como-funciona .ct-como__head { margin-bottom: 28px; } .contrate-como-funciona .ct-como__title { font-size: clamp(1.8rem, 8vw, 2.15rem); } .contrate-como-funciona .ct-como__intro { font-size: var(--text-base); line-height: 1.7; } .contrate-como-funciona .ct-como__journey { grid-template-columns: 1fr; gap: 14px; } .contrate-como-funciona .ct-como__item { padding: 20px; } .contrate-como-funciona .ct-como__footer { grid-template-columns: 38px minmax(0, 1fr); padding: 18px; } .contrate-como-funciona .ct-como__button { grid-column: 1 / -1; width: 100%; margin-top: 4px; } } /* ========================================================= ACCESSIBILITY ========================================================= */ .contrate-como-funciona .ct-como a:focus-visible { outline: 3px solid rgba(188, 12, 36, .22); outline-offset: 3px; } /* ========================================================= REDUCED MOTION ========================================================= */ @media (prefers-reduced-motion: reduce) { .contrate-como-funciona .ct-como *, .contrate-como-funciona .ct-como *::before, .contrate-como-funciona .ct-como *::after { transition: none !important; } .contrate-como-funciona .ct-como__item:hover, .contrate-como-funciona .ct-como__button:hover { transform: none; } }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-6a66526 *//* ========================================================= ISBET — CONTRATE APRENDIZES BLOCO 05 — BENEFÍCIOS PARA A EMPRESA PADRÃO 2026 ========================================================= */ /* ========================================================= SECTION ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa { width: 100%; margin: 0; padding-block: clamp(64px, 7vw, 84px); background: var(--ink-02); } /* ========================================================= WRAP ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa__wrap { width: min(1200px, calc(100% - 48px)); margin-inline: auto; } /* ========================================================= HEAD ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa__head { max-width: 760px; margin: 0 0 34px; text-align: left; } /* ========================================================= EYEBROW ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa__eyebrow { margin: 0 0 10px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .09em; text-transform: uppercase; color: var(--red-primary); } /* remove decoração antiga */ .contrate-beneficios-empresa .s-benefits-empresa__eyebrow::before { display: none; } /* ========================================================= H2 ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa__title { max-width: 700px; margin: 0; font-family: var(--font-primary); font-size: clamp(1.9rem, 3vw, 2.4rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.04em; color: var(--night); } .contrate-beneficios-empresa .s-benefits-empresa__title span { display: block; color: var(--red-primary); } /* ========================================================= INTRO ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa__intro { max-width: 620px; margin: 16px 0 0; font-family: var(--font-primary); font-size: clamp(1rem, 1.12vw, var(--text-body)); font-weight: 400; line-height: 1.72; color: var(--ink-60); } /* ========================================================= GRID ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } /* ========================================================= CARD ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa__card { min-width: 0; min-height: 100%; display: flex; flex-direction: column; padding: 22px; border: 1px solid var(--ink-10); border-radius: 14px; background: var(--white); box-shadow: none; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; } .contrate-beneficios-empresa .s-benefits-empresa__card:hover { transform: translateY(-3px); border-color: rgba(188, 12, 36, .16); box-shadow: 0 8px 22px rgba(2, 22, 39, .05); } /* ========================================================= CARD TOP ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa__card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 18px; } /* ========================================================= ICON ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa__icon { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; flex: 0 0 44px; border-radius: 10px; } .contrate-beneficios-empresa .s-benefits-empresa__icon svg { width: 20px; height: 20px; } /* RED */ .contrate-beneficios-empresa .s-benefits-empresa__icon--red { background: rgba(188, 12, 36, .08); color: var(--red-primary); } /* ORANGE */ .contrate-beneficios-empresa .s-benefits-empresa__icon--orange { background: rgba(255, 102, 0, .09); color: var(--orange); } /* GREEN */ .contrate-beneficios-empresa .s-benefits-empresa__icon--green { background: var(--green-light); color: var(--green); } /* WINE */ .contrate-beneficios-empresa .s-benefits-empresa__icon--wine { background: rgba(115, 1, 15, .08); color: var(--red-wine); } /* NIGHT */ .contrate-beneficios-empresa .s-benefits-empresa__icon--night { background: rgba(2, 22, 39, .07); color: var(--night); } /* PINK */ .contrate-beneficios-empresa .s-benefits-empresa__icon--pink { background: rgba(188, 12, 36, .08); color: var(--red-primary); } /* ========================================================= TAG ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa__tag { display: inline-flex; align-items: center; justify-content: center; min-height: 28px; max-width: 190px; padding: 6px 10px; border-radius: 999px; background: var(--ink-02); font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1.25; text-align: center; color: var(--ink-40); } /* ========================================================= H3 ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa__card-title { margin: 0; font-family: var(--font-primary); font-size: clamp(1.05rem, 1.3vw, 1.2rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: var(--night); } /* ========================================================= CARD TEXT ========================================================= */ .contrate-beneficios-empresa .s-benefits-empresa__card-text { margin: 9px 0 0; font-family: var(--font-primary); font-size: var(--text-card); font-weight: 400; line-height: 1.65; color: var(--ink-60); } /* ========================================================= TABLET ========================================================= */ @media (max-width: 960px) { .contrate-beneficios-empresa .s-benefits-empresa__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 640px) { .contrate-beneficios-empresa .s-benefits-empresa { padding-block: 52px; } .contrate-beneficios-empresa .s-benefits-empresa__wrap { width: calc(100% - 32px); } .contrate-beneficios-empresa .s-benefits-empresa__head { margin-bottom: 28px; } .contrate-beneficios-empresa .s-benefits-empresa__title { font-size: clamp(1.8rem, 8vw, 2.15rem); } .contrate-beneficios-empresa .s-benefits-empresa__intro { font-size: var(--text-base); line-height: 1.7; } .contrate-beneficios-empresa .s-benefits-empresa__grid { grid-template-columns: 1fr; gap: 14px; } .contrate-beneficios-empresa .s-benefits-empresa__card { padding: 20px; } .contrate-beneficios-empresa .s-benefits-empresa__card-top { margin-bottom: 16px; } } /* ========================================================= REDUCED MOTION ========================================================= */ @media (prefers-reduced-motion: reduce) { .contrate-beneficios-empresa .s-benefits-empresa__card { transition: none !important; } .contrate-beneficios-empresa .s-benefits-empresa__card:hover { transform: none; } }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-cd809fc *//* ========================================================= ISBET — CONTRATE APRENDIZES BLOCO 06 — APOIO AO RH PADRÃO 2026 ========================================================= */ /* ========================================================= SECTION ========================================================= */ .contrate-beneficios .ct-beneficios { width: 100%; margin: 0; padding-block: clamp(64px, 7vw, 84px); background: var(--white); } /* ========================================================= WRAP ========================================================= */ .contrate-beneficios .ct-beneficios__wrap { width: min(1200px, calc(100% - 48px)); margin-inline: auto; } /* ========================================================= HEAD ========================================================= */ .contrate-beneficios .ct-beneficios__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr); gap: clamp(36px, 5vw, 72px); align-items: end; margin-bottom: 34px; } /* ========================================================= EYEBROW ========================================================= */ .contrate-beneficios .ct-beneficios__eyebrow { margin: 0 0 10px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .09em; text-transform: uppercase; color: var(--red-primary); } /* ========================================================= H2 ========================================================= */ .contrate-beneficios .ct-beneficios__title { max-width: 700px; margin: 0; font-family: var(--font-primary); font-size: clamp(1.9rem, 3vw, 2.4rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.04em; color: var(--night); } .contrate-beneficios .ct-beneficios__title span { display: block; color: var(--red-primary); } /* ========================================================= INTRO ========================================================= */ .contrate-beneficios .ct-beneficios__intro { max-width: 560px; margin: 0; font-family: var(--font-primary); font-size: clamp(1rem, 1.12vw, var(--text-body)); font-weight: 400; line-height: 1.72; color: var(--ink-60); } /* ========================================================= LAYOUT ========================================================= */ .contrate-beneficios .ct-beneficios__layout { display: grid; grid-template-columns: minmax(340px, .82fr) minmax(0, 1.18fr); gap: 16px; align-items: stretch; } /* ========================================================= MAIN CARD ========================================================= */ .contrate-beneficios .ct-beneficios__main { min-width: 0; padding: 28px; border: 1px solid var(--night); border-radius: 14px; background: var(--night); color: var(--white); } /* ========================================================= MAIN LABEL ========================================================= */ .contrate-beneficios .ct-beneficios__main-label { display: block; margin-bottom: 8px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .08em; text-transform: uppercase; color: var(--orange); } /* ========================================================= MAIN H3 ========================================================= */ .contrate-beneficios .ct-beneficios__main h3 { max-width: 480px; margin: 0; font-family: var(--font-primary); font-size: clamp(1.2rem, 1.7vw, 1.45rem); font-weight: 700; line-height: 1.28; letter-spacing: -0.025em; color: var(--white); } /* ========================================================= MAIN TEXT ========================================================= */ .contrate-beneficios .ct-beneficios__main > p { max-width: 520px; margin: 12px 0 0; font-family: var(--font-primary); font-size: var(--text-card); font-weight: 400; line-height: 1.68; color: rgba(255, 255, 255, .72); } /* ========================================================= MAIN LIST ========================================================= */ .contrate-beneficios .ct-beneficios__main-list { display: grid; gap: 0; margin-top: 24px; } .contrate-beneficios .ct-beneficios__main-list > div { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; align-items: start; padding: 15px 0; border-top: 1px solid rgba(255, 255, 255, .10); } /* ========================================================= LIST NUMBER ========================================================= */ .contrate-beneficios .ct-beneficios__main-list > div > span { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255, 255, 255, .07); font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; color: var(--orange); } /* ========================================================= LIST TITLE ========================================================= */ .contrate-beneficios .ct-beneficios__main-list strong { display: block; font-family: var(--font-primary); font-size: var(--text-sm); font-weight: 700; line-height: 1.4; color: var(--white); } /* ========================================================= LIST TEXT ========================================================= */ .contrate-beneficios .ct-beneficios__main-list p { margin: 4px 0 0; font-family: var(--font-primary); font-size: var(--text-support); font-weight: 400; line-height: 1.55; color: rgba(255, 255, 255, .64); } /* ========================================================= FEATURES GRID ========================================================= */ .contrate-beneficios .ct-beneficios__features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } /* ========================================================= FEATURE ========================================================= */ .contrate-beneficios .ct-beneficios__feature { min-width: 0; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: start; padding: 22px; border: 1px solid var(--ink-10); border-radius: 14px; background: var(--ink-02); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; } .contrate-beneficios .ct-beneficios__feature:hover { transform: translateY(-3px); border-color: rgba(188, 12, 36, .16); box-shadow: 0 8px 22px rgba(2, 22, 39, .05); } /* ========================================================= ICON ========================================================= */ .contrate-beneficios .ct-beneficios__icon { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; flex: 0 0 44px; border-radius: 10px; background: rgba(188, 12, 36, .08); color: var(--red-primary); } .contrate-beneficios .ct-beneficios__icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= FEATURE LABEL ========================================================= */ .contrate-beneficios .ct-beneficios__feature span { display: block; margin-bottom: 7px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .07em; text-transform: uppercase; color: var(--red-primary); } /* ========================================================= FEATURE H3 ========================================================= */ .contrate-beneficios .ct-beneficios__feature h3 { margin: 0; font-family: var(--font-primary); font-size: clamp(1.05rem, 1.3vw, 1.2rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: var(--night); } /* ========================================================= FEATURE TEXT ========================================================= */ .contrate-beneficios .ct-beneficios__feature p { margin: 8px 0 0; font-family: var(--font-primary); font-size: var(--text-card); font-weight: 400; line-height: 1.65; color: var(--ink-60); } /* ========================================================= TABLET ========================================================= */ @media (max-width: 960px) { .contrate-beneficios .ct-beneficios__head { grid-template-columns: 1fr; gap: 16px; } .contrate-beneficios .ct-beneficios__layout { grid-template-columns: 1fr; } .contrate-beneficios .ct-beneficios__main { max-width: 720px; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 640px) { .contrate-beneficios .ct-beneficios { padding-block: 52px; } .contrate-beneficios .ct-beneficios__wrap { width: calc(100% - 32px); } .contrate-beneficios .ct-beneficios__head { margin-bottom: 28px; } .contrate-beneficios .ct-beneficios__title { font-size: clamp(1.8rem, 8vw, 2.15rem); } .contrate-beneficios .ct-beneficios__intro { font-size: var(--text-base); line-height: 1.7; } .contrate-beneficios .ct-beneficios__main { padding: 22px; } .contrate-beneficios .ct-beneficios__features { grid-template-columns: 1fr; gap: 14px; } .contrate-beneficios .ct-beneficios__feature { padding: 20px; } } /* ========================================================= REDUCED MOTION ========================================================= */ @media (prefers-reduced-motion: reduce) { .contrate-beneficios .ct-beneficios *, .contrate-beneficios .ct-beneficios *::before, .contrate-beneficios .ct-beneficios *::after { transition: none !important; } .contrate-beneficios .ct-beneficios__feature:hover { transform: none; } }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-3b4e8cc *//* ========================================================= ISBET · CONTRATE APRENDIZES BLOCO · FORMAÇÃO E ESTRUTURA PADRÃO VISUAL OFICIAL 2026 ========================================================= */ .contrate-formacao .ct-formacao{ width:100%; padding-block:clamp(72px,8vw,96px); background:var(--white); font-family:var(--font-primary); color:var(--ink); } .contrate-formacao .ct-formacao *, .contrate-formacao .ct-formacao *::before, .contrate-formacao .ct-formacao *::after{ box-sizing:border-box; } .contrate-formacao .ct-formacao__wrap{ width:min(1200px,calc(100% - 48px)); margin-inline:auto; } .contrate-formacao .ct-formacao__head{ display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,.72fr); gap:clamp(36px,6vw,84px); align-items:end; margin-bottom:40px; } .contrate-formacao .ct-formacao__eyebrow{ margin:0 0 10px; font-family:var(--font-primary); font-size:.75rem; font-weight:700; line-height:1.2; letter-spacing:.10em; text-transform:uppercase; color:var(--red-primary); } .contrate-formacao .ct-formacao__title{ max-width:760px; margin:0; font-family:var(--font-primary); font-size:clamp(1.9rem,3vw,2.4rem); font-weight:700; line-height:1.1; letter-spacing:-.04em; color:var(--night); } .contrate-formacao .ct-formacao__title span{ display:block; color:var(--red-primary); } .contrate-formacao .ct-formacao__intro{ max-width:500px; margin:0; font-family:var(--font-primary); font-size:var(--text-body,1rem); font-weight:400; line-height:1.7; color:var(--ink-60); } .contrate-formacao .ct-formacao__layout{ display:grid; grid-template-columns:minmax(340px,.82fr) minmax(0,1.18fr); gap:16px; align-items:stretch; } .contrate-formacao .ct-formacao__main{ padding:clamp(28px,3vw,36px); border-radius:18px; background:var(--night); color:var(--white); } .contrate-formacao .ct-formacao__main-top > span{ display:block; margin-bottom:8px; font-family:var(--font-primary); font-size:.72rem; font-weight:700; line-height:1.2; letter-spacing:.09em; text-transform:uppercase; color:var(--orange); } .contrate-formacao .ct-formacao__main h3{ max-width:430px; margin:0; font-family:var(--font-primary); font-size:clamp(1.15rem,1.8vw,1.35rem); font-weight:700; line-height:1.35; letter-spacing:-.02em; color:var(--white); } .contrate-formacao .ct-formacao__main p{ max-width:510px; margin:12px 0 0; font-family:var(--font-primary); font-size:var(--text-card,.875rem); font-weight:400; line-height:1.7; color:rgba(255,255,255,.68); } .contrate-formacao .ct-formacao__topics{ margin-top:30px; display:grid; gap:0; } .contrate-formacao .ct-formacao__topics > div{ display:grid; grid-template-columns:38px minmax(0,1fr); gap:12px; align-items:center; padding-block:14px; border-top:1px solid rgba(255,255,255,.10); } .contrate-formacao .ct-formacao__topics span{ width:34px; height:34px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:rgba(255,255,255,.07); font-family:var(--font-primary); font-size:.72rem; font-weight:700; color:var(--orange); } .contrate-formacao .ct-formacao__topics strong{ font-family:var(--font-primary); font-size:var(--text-card,.875rem); font-weight:700; line-height:1.45; color:var(--white); } .contrate-formacao .ct-formacao__side{ display:grid; gap:12px; } .contrate-formacao .ct-formacao__feature{ display:grid; grid-template-columns:48px minmax(0,1fr); gap:16px; align-items:start; padding:22px; border:1px solid var(--ink-10); border-radius:14px; background:var(--ink-02); } .contrate-formacao .ct-formacao__icon{ width:46px; height:46px; display:flex; align-items:center; justify-content:center; border-radius:10px; background:var(--white); border:1px solid var(--ink-10); color:var(--red-primary); } .contrate-formacao .ct-formacao__icon svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; } .contrate-formacao .ct-formacao__feature span{ display:block; margin-bottom:5px; font-family:var(--font-primary); font-size:.72rem; font-weight:700; line-height:1.2; letter-spacing:.08em; text-transform:uppercase; color:var(--red-primary); } .contrate-formacao .ct-formacao__feature h3{ margin:0; font-family:var(--font-primary); font-size:1.08rem; font-weight:700; line-height:1.4; letter-spacing:-.02em; color:var(--night); } .contrate-formacao .ct-formacao__feature p{ margin:7px 0 0; font-family:var(--font-primary); font-size:var(--text-card,.875rem); font-weight:400; line-height:1.65; color:var(--ink-40); } .contrate-formacao .ct-formacao__footer{ margin-top:18px; display:flex; align-items:center; justify-content:space-between; gap:28px; padding:20px 22px; border:1px solid var(--ink-10); border-radius:14px; background:var(--ink-02); } .contrate-formacao .ct-formacao__footer strong{ display:block; margin-bottom:4px; font-family:var(--font-primary); font-size:1rem; font-weight:700; line-height:1.4; color:var(--night); } .contrate-formacao .ct-formacao__footer span{ display:block; font-family:var(--font-primary); font-size:var(--text-card,.875rem); font-weight:400; line-height:1.6; color:var(--ink-40); } .contrate-formacao .ct-formacao__button{ min-height:44px; display:inline-flex; align-items:center; justify-content:center; gap:7px; flex-shrink:0; padding:11px 16px; border-radius:8px; background:var(--red-primary); border:1px solid var(--red-primary); font-family:var(--font-primary); font-size:var(--text-sm,.875rem); font-weight:700; line-height:1.2; color:var(--white); text-decoration:none; transition:background-color .18s ease,border-color .18s ease,transform .18s ease; } .contrate-formacao .ct-formacao__button:hover{ background:var(--red-wine); border-color:var(--red-wine); transform:translateY(-1px); } .contrate-formacao .ct-formacao__button:active{ transform:translateY(0); } .contrate-formacao .ct-formacao__button svg{ width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } @media (max-width:960px){ .contrate-formacao .ct-formacao__head, .contrate-formacao .ct-formacao__layout{ grid-template-columns:1fr; } .contrate-formacao .ct-formacao__head{ gap:18px; } .contrate-formacao .ct-formacao__intro{ max-width:680px; } } @media (max-width:640px){ .contrate-formacao .ct-formacao{ padding-block:52px; } .contrate-formacao .ct-formacao__wrap{ width:calc(100% - 32px); } .contrate-formacao .ct-formacao__head{ margin-bottom:30px; } .contrate-formacao .ct-formacao__eyebrow{ font-size:.70rem; } .contrate-formacao .ct-formacao__title{ font-size:clamp(1.75rem,8vw,2.15rem); } .contrate-formacao .ct-formacao__intro{ font-size:var(--text-base,.9375rem); } .contrate-formacao .ct-formacao__main{ padding:24px 20px; border-radius:16px; } .contrate-formacao .ct-formacao__feature{ grid-template-columns:44px minmax(0,1fr); gap:14px; padding:19px 18px; } .contrate-formacao .ct-formacao__icon{ width:42px; height:42px; } .contrate-formacao .ct-formacao__footer{ flex-direction:column; align-items:flex-start; gap:18px; padding:20px 18px; } .contrate-formacao .ct-formacao__button{ width:100%; } } .contrate-formacao .ct-formacao a:focus-visible{ outline:3px solid rgba(188,12,36,.28); outline-offset:3px; } @media (prefers-reduced-motion:reduce){ .contrate-formacao .ct-formacao *, .contrate-formacao .ct-formacao *::before, .contrate-formacao .ct-formacao *::after{ transition:none !important; } }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-2b251ee *//* ========================================================= CONTRATE APRENDIZES | FORMAÇÃO E ESTRUTURA ========================================================= */ .contrate-formacao .ct-formacao { width: 100%; padding-block: clamp(68px, 7vw, 92px); background: var(--white); } .contrate-formacao .ct-formacao__wrap { width: min(1200px, calc(100% - 48px)); margin-inline: auto; } /* ========================================================= CABEÇALHO ========================================================= */ .contrate-formacao .ct-formacao__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr); gap: clamp(36px, 6vw, 84px); align-items: end; margin-bottom: 34px; } .contrate-formacao .ct-formacao__eyebrow { margin: 0 0 10px; font-family: var(--font-primary); font-size: 11px; font-weight: 700; line-height: 1.2; letter-spacing: .09em; text-transform: uppercase; color: var(--red-primary); } .contrate-formacao .ct-formacao__title { margin: 0; font-family: var(--font-primary); font-size: clamp(1.75rem, 2.2vw, 2rem); font-weight: 700; line-height: 1.14; letter-spacing: -0.03em; color: var(--night); } .contrate-formacao .ct-formacao__title span { display: block; color: var(--red-primary); } .contrate-formacao .ct-formacao__intro { margin: 0; font-family: var(--font-primary); font-size: 13.5px; line-height: 1.65; color: var(--ink-60); } /* ========================================================= LAYOUT ========================================================= */ .contrate-formacao .ct-formacao__layout { display: grid; grid-template-columns: minmax(340px, .82fr) minmax(0, 1.18fr); gap: 14px; align-items: stretch; } /* ========================================================= BLOCO PRINCIPAL ========================================================= */ .contrate-formacao .ct-formacao__main { padding: 28px; border-radius: 16px; background: var(--night); color: var(--white); } .contrate-formacao .ct-formacao__main-top > span { display: block; margin-bottom: 6px; font-family: var(--font-primary); font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--orange); } .contrate-formacao .ct-formacao__main h3 { margin: 0; font-family: var(--font-primary); font-size: 19px; font-weight: 700; line-height: 1.3; color: var(--white); } .contrate-formacao .ct-formacao__main p { margin: 10px 0 0; font-family: var(--font-primary); font-size: 11.5px; line-height: 1.6; color: rgba(255,255,255,.62); } /* TÓPICOS */ .contrate-formacao .ct-formacao__topics { margin-top: 24px; display: grid; gap: 9px; } .contrate-formacao .ct-formacao__topics > div { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 10px; align-items: center; padding-top: 11px; border-top: 1px solid rgba(255,255,255,.09); } .contrate-formacao .ct-formacao__topics span { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255,255,255,.07); font-size: 8.5px; font-weight: 700; color: var(--orange); } .contrate-formacao .ct-formacao__topics strong { font-family: var(--font-primary); font-size: 11px; font-weight: 700; color: var(--white); } /* ========================================================= SIDE ========================================================= */ .contrate-formacao .ct-formacao__side { display: grid; gap: 10px; } .contrate-formacao .ct-formacao__feature { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: start; padding: 20px; border: 1px solid var(--ink-10); border-radius: 14px; background: var(--ink-02); } /* ÍCONE */ .contrate-formacao .ct-formacao__icon { width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; border-radius: 10px; background: var(--white); border: 1px solid var(--ink-10); color: var(--red-primary); } .contrate-formacao .ct-formacao__icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; } /* TEXTO */ .contrate-formacao .ct-formacao__feature span { display: block; margin-bottom: 4px; font-family: var(--font-primary); font-size: 8.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--red-primary); } .contrate-formacao .ct-formacao__feature h3 { margin: 0; font-family: var(--font-primary); font-size: 13.5px; font-weight: 700; line-height: 1.35; color: var(--night); } .contrate-formacao .ct-formacao__feature p { margin: 6px 0 0; font-family: var(--font-primary); font-size: 10.5px; line-height: 1.5; color: var(--ink-40); } /* ========================================================= FOOTER ========================================================= */ .contrate-formacao .ct-formacao__footer { margin-top: 16px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 18px 20px; border: 1px solid var(--ink-10); border-radius: 13px; background: var(--ink-02); } .contrate-formacao .ct-formacao__footer strong { display: block; margin-bottom: 3px; font-family: var(--font-primary); font-size: 12.5px; font-weight: 700; color: var(--night); } .contrate-formacao .ct-formacao__footer span { display: block; font-family: var(--font-primary); font-size: 10.5px; line-height: 1.45; color: var(--ink-40); } /* BOTÃO */ .contrate-formacao .ct-formacao__button { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; flex-shrink: 0; padding: 10px 15px; border-radius: 8px; background: var(--red-primary); border: 1px solid var(--red-primary); font-family: var(--font-primary); font-size: 11.5px; font-weight: 700; color: var(--white); text-decoration: none; } .contrate-formacao .ct-formacao__button:hover { background: var(--red-wine); border-color: var(--red-wine); } .contrate-formacao .ct-formacao__button svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= TABLET ========================================================= */ @media (max-width: 960px) { .contrate-formacao .ct-formacao__head, .contrate-formacao .ct-formacao__layout { grid-template-columns: 1fr; } .contrate-formacao .ct-formacao__head { gap: 16px; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 640px) { .contrate-formacao .ct-formacao { padding-block: 52px; } .contrate-formacao .ct-formacao__wrap { width: calc(100% - 32px); } .contrate-formacao .ct-formacao__head { margin-bottom: 27px; } .contrate-formacao .ct-formacao__eyebrow { font-size: 10px; } .contrate-formacao .ct-formacao__title { font-size: 1.75rem; } .contrate-formacao .ct-formacao__intro { font-size: 13px; } .contrate-formacao .ct-formacao__main { padding: 22px; } .contrate-formacao .ct-formacao__feature { padding: 18px; } .contrate-formacao .ct-formacao__footer { flex-direction: column; align-items: flex-start; } .contrate-formacao .ct-formacao__button { width: 100%; } } /* ========================================================= ACESSIBILIDADE ========================================================= */ .contrate-formacao .ct-formacao a:focus-visible { outline: 3px solid rgba(188,12,36,.28); outline-offset: 3px; } @media (prefers-reduced-motion: reduce) { .contrate-formacao .ct-formacao *, .contrate-formacao .ct-formacao *::before, .contrate-formacao .ct-formacao *::after { transition: none !important; } }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-0754f4f *//* ========================================================= ISBET — CONTRATE APRENDIZES BLOCO 08 — CURSOS + VANTAGENS PADRÃO 2026 ========================================================= */ .contrate-cursos-vantagens .ct-cursos-vantagens { width: 100%; margin: 0; padding-block: clamp(64px, 7vw, 84px); background: var(--white); } .contrate-cursos-vantagens .ct-cursos-vantagens__wrap { width: min(1200px, calc(100% - 48px)); margin-inline: auto; } /* ========================================================= CURSOS | HEAD ========================================================= */ .contrate-cursos-vantagens .ct-cursos__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr); gap: clamp(36px, 5vw, 72px); align-items: end; margin-bottom: 34px; } .contrate-cursos-vantagens .ct-cursos__eyebrow { margin: 0 0 10px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .09em; text-transform: uppercase; color: var(--red-primary); } .contrate-cursos-vantagens .ct-cursos__title { max-width: 700px; margin: 0; font-family: var(--font-primary); font-size: clamp(1.9rem, 3vw, 2.4rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.04em; color: var(--night); } .contrate-cursos-vantagens .ct-cursos__title span { display: block; color: var(--red-primary); } .contrate-cursos-vantagens .ct-cursos__intro { max-width: 560px; margin: 0; font-family: var(--font-primary); font-size: clamp(1rem, 1.12vw, var(--text-body)); line-height: 1.72; color: var(--ink-60); } /* ========================================================= CURSOS | GRID ========================================================= */ .contrate-cursos-vantagens .ct-cursos__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } /* ========================================================= CURSO CARD ========================================================= */ .contrate-cursos-vantagens .ct-curso-card { overflow: hidden; border: 1px solid var(--ink-10); border-radius: 14px; background: var(--night); box-shadow: none; transition: transform .2s ease, box-shadow .2s ease; } .contrate-cursos-vantagens .ct-curso-card:hover { transform: translateY(-3px); box-shadow: 0 8px 22px rgba(2,22,39,.06); } .contrate-cursos-vantagens .ct-curso-card__image { overflow: hidden; } .contrate-cursos-vantagens .ct-curso-card__image img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .3s ease; } .contrate-cursos-vantagens .ct-curso-card:hover img { transform: scale(1.02); } .contrate-cursos-vantagens .ct-curso-card__body { padding: 16px 18px 18px; background: var(--night); } .contrate-cursos-vantagens .ct-curso-card__body span { display: block; margin-bottom: 5px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .08em; text-transform: uppercase; color: var(--orange); } .contrate-cursos-vantagens .ct-curso-card__body h3 { margin: 0; font-family: var(--font-primary); font-size: clamp(1.05rem, 1.3vw, 1.2rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: var(--white); } /* ========================================================= CURSOS | CTA ========================================================= */ .contrate-cursos-vantagens .ct-cursos__cta-wrap { display: flex; justify-content: flex-start; margin-top: 24px; } .contrate-cursos-vantagens .ct-cursos__cta { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 11px 18px; border: 1px solid var(--red-primary); border-radius: 8px; background: var(--red-primary); font-family: var(--font-primary); font-size: var(--text-sm); font-weight: 700; line-height: 1; color: var(--white); text-decoration: none; transition: background .2s ease, border-color .2s ease, transform .2s ease; } .contrate-cursos-vantagens .ct-cursos__cta:hover, .contrate-cursos-vantagens .ct-cursos__cta:focus-visible { background: var(--red-wine); border-color: var(--red-wine); color: var(--white); transform: translateY(-1px); } .contrate-cursos-vantagens .ct-cursos__cta svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= VANTAGENS ========================================================= */ .contrate-cursos-vantagens .ct-vantagens { margin-top: clamp(68px, 8vw, 92px); padding-top: clamp(58px, 6vw, 72px); border-top: 1px solid var(--ink-10); } /* ========================================================= VANTAGENS | HEAD ========================================================= */ .contrate-cursos-vantagens .ct-vantagens__head { max-width: 760px; margin: 0 0 34px; text-align: left; } .contrate-cursos-vantagens .ct-vantagens__eyebrow { margin: 0 0 10px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .09em; text-transform: uppercase; color: var(--red-primary); } .contrate-cursos-vantagens .ct-vantagens__eyebrow::before { display: none; } .contrate-cursos-vantagens .ct-vantagens__head h2 { max-width: 700px; margin: 0; font-family: var(--font-primary); font-size: clamp(1.9rem, 3vw, 2.4rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.04em; color: var(--night); } .contrate-cursos-vantagens .ct-vantagens__head h2 span { display: block; color: var(--red-primary); } .contrate-cursos-vantagens .ct-vantagens__head > p:last-child { max-width: 620px; margin: 16px 0 0; font-family: var(--font-primary); font-size: clamp(1rem, 1.12vw, var(--text-body)); line-height: 1.72; color: var(--ink-60); } /* ========================================================= VANTAGENS | GRID ========================================================= */ .contrate-cursos-vantagens .ct-vantagens__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } /* ========================================================= VANTAGEM CARD ========================================================= */ .contrate-cursos-vantagens .ct-vantagem { min-width: 0; padding: 22px; border: 1px solid var(--ink-10); border-radius: 14px; background: var(--ink-02); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; } .contrate-cursos-vantagens .ct-vantagem:hover { transform: translateY(-3px); border-color: rgba(188,12,36,.16); box-shadow: 0 8px 22px rgba(2,22,39,.05); } .contrate-cursos-vantagens .ct-vantagem__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 18px; } /* ========================================================= ICON ========================================================= */ .contrate-cursos-vantagens .ct-vantagem__icon { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; flex: 0 0 44px; border-radius: 10px; background: rgba(188,12,36,.08); color: var(--red-primary); } .contrate-cursos-vantagens .ct-vantagem__icon--orange { background: rgba(255,102,0,.09); color: var(--orange); } .contrate-cursos-vantagens .ct-vantagem__icon--green { background: var(--green-light); color: var(--green); } .contrate-cursos-vantagens .ct-vantagem__icon--wine { background: rgba(115,1,15,.08); color: var(--red-wine); } .contrate-cursos-vantagens .ct-vantagem__icon--night { background: rgba(2,22,39,.07); color: var(--night); } .contrate-cursos-vantagens .ct-vantagem__icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= TAG ========================================================= */ .contrate-cursos-vantagens .ct-vantagem__tag { display: inline-flex; align-items: center; justify-content: center; min-height: 28px; max-width: 190px; padding: 6px 10px; border-radius: 999px; background: var(--white); font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1.25; text-align: center; color: var(--ink-40); } /* ========================================================= H3 ========================================================= */ .contrate-cursos-vantagens .ct-vantagem h3 { margin: 0; font-family: var(--font-primary); font-size: clamp(1.05rem, 1.3vw, 1.2rem); font-weight: 700; line-height: 1.3; letter-spacing: -0.02em; color: var(--night); } /* ========================================================= TEXT ========================================================= */ .contrate-cursos-vantagens .ct-vantagem > p { margin: 9px 0 0; font-family: var(--font-primary); font-size: var(--text-card); line-height: 1.65; color: var(--ink-60); } /* ========================================================= TABLET ========================================================= */ @media (max-width: 960px) { .contrate-cursos-vantagens .ct-cursos__head { grid-template-columns: 1fr; gap: 16px; } .contrate-cursos-vantagens .ct-cursos__grid, .contrate-cursos-vantagens .ct-vantagens__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 640px) { .contrate-cursos-vantagens .ct-cursos-vantagens { padding-block: 52px; } .contrate-cursos-vantagens .ct-cursos-vantagens__wrap { width: calc(100% - 32px); } .contrate-cursos-vantagens .ct-cursos__head { margin-bottom: 28px; } .contrate-cursos-vantagens .ct-cursos__title, .contrate-cursos-vantagens .ct-vantagens__head h2 { font-size: clamp(1.8rem, 8vw, 2.15rem); } .contrate-cursos-vantagens .ct-cursos__intro, .contrate-cursos-vantagens .ct-vantagens__head > p:last-child { font-size: var(--text-base); line-height: 1.7; } .contrate-cursos-vantagens .ct-cursos__grid, .contrate-cursos-vantagens .ct-vantagens__grid { grid-template-columns: 1fr; gap: 14px; } .contrate-cursos-vantagens .ct-cursos__cta { width: 100%; } .contrate-cursos-vantagens .ct-vantagens { margin-top: 56px; padding-top: 48px; } .contrate-cursos-vantagens .ct-vantagem { padding: 20px; } } /* ========================================================= ACCESSIBILITY ========================================================= */ .contrate-cursos-vantagens a:focus-visible { outline: 3px solid rgba(188,12,36,.22); outline-offset: 3px; } /* ========================================================= REDUCED MOTION ========================================================= */ @media (prefers-reduced-motion: reduce) { .contrate-cursos-vantagens *, .contrate-cursos-vantagens *::before, .contrate-cursos-vantagens *::after { transition: none !important; } .contrate-cursos-vantagens .ct-curso-card:hover, .contrate-cursos-vantagens .ct-vantagem:hover, .contrate-cursos-vantagens .ct-cursos__cta:hover { transform: none; } }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-7cebe28 */.elementor-819 .elementor-element.elementor-element-7cebe28{ background: #f7f8fb; }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-910bca3 *//* ========================================================= ISBET — CONTRATE APRENDIZES EMPRESAS PARCEIRAS + CTA FINAL PADRÃO 2026 ========================================================= */ /* ========================================================= SECTION ========================================================= */ .contrate-parceiros .s-partners.isbet-partners-marquee { position: relative; width: 100%; margin: 0; overflow: hidden; padding-block: clamp(64px, 7vw, 84px); background: var(--ink-02); } /* ========================================================= WRAP ========================================================= */ .contrate-parceiros .s-partners.isbet-partners-marquee .wrap { width: min(1200px, calc(100% - 48px)); margin-inline: auto; } /* ========================================================= PARTNERS HEAD ========================================================= */ .contrate-parceiros .partners-head { max-width: 720px; margin: 0 0 34px; text-align: left; } /* ========================================================= EYEBROW ========================================================= */ .contrate-parceiros .partners-eyebrow { margin: 0 0 10px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .09em; text-transform: uppercase; color: var(--red-primary); } /* ========================================================= H2 ========================================================= */ .contrate-parceiros .partners-head h2 { max-width: 700px; margin: 0; font-family: var(--font-primary); font-size: clamp(1.9rem, 3vw, 2.4rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.04em; color: var(--night); } .contrate-parceiros .partners-head h2 span { display: block; color: var(--red-primary); } /* ========================================================= INTRO ========================================================= */ .contrate-parceiros .partners-intro { max-width: 620px; margin: 16px 0 0; font-family: var(--font-primary); font-size: clamp(1rem, 1.12vw, var(--text-body)); font-weight: 400; line-height: 1.72; color: var(--ink-60); } /* ========================================================= MARQUEE ========================================================= */ .contrate-parceiros .partners-marquee { position: relative; display: flex; flex-direction: column; gap: 12px; } .contrate-parceiros .partners-track-row { position: relative; overflow: hidden; mask-image: linear-gradient( to right, transparent 0, black 8%, black 92%, transparent 100% ); -webkit-mask-image: linear-gradient( to right, transparent 0, black 8%, black 92%, transparent 100% ); } .contrate-parceiros .partners-track { display: flex; align-items: center; gap: 14px; width: max-content; } /* ========================================================= ANIMATION ========================================================= */ .contrate-parceiros .row-right .partners-track { animation: partnersRight 32s linear infinite; } .contrate-parceiros .row-left .partners-track { animation: partnersLeft 34s linear infinite; } @keyframes partnersRight { from { transform: translateX(0); } to { transform: translateX(-50%); } } @keyframes partnersLeft { from { transform: translateX(-50%); } to { transform: translateX(0); } } /* ========================================================= LOGO CARD ========================================================= */ .contrate-parceiros .partner-logo-card { min-width: 148px; height: 64px; display: inline-flex; align-items: center; justify-content: center; padding: 12px 18px; border: 1px solid var(--ink-10); border-radius: 999px; background: var(--white); box-shadow: none; filter: grayscale(1); opacity: .68; transition: opacity .2s ease, filter .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease; } .contrate-parceiros .partner-logo-card:hover { opacity: 1; filter: grayscale(0); border-color: rgba(188, 12, 36, .16); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(2, 22, 39, .05); } .contrate-parceiros .partner-logo-card img { display: block; width: auto; height: auto; max-width: 110px; max-height: 28px; object-fit: contain; } /* ========================================================= PAUSE ========================================================= */ .contrate-parceiros .partners-marquee:hover .partners-track { animation-play-state: paused; } /* ========================================================= CTA FINAL ========================================================= */ .contrate-parceiros .partners-cta { position: relative; overflow: hidden; margin-top: 48px; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr); gap: clamp(36px, 5vw, 64px); align-items: center; padding: clamp(30px, 4vw, 44px); border-radius: 16px; background: var(--night); } /* ========================================================= DECORATION ========================================================= */ .contrate-parceiros .partners-cta::before { content: ""; position: absolute; width: 320px; height: 320px; top: -190px; right: -150px; border-radius: 50%; background: rgba(188, 12, 36, .14); pointer-events: none; } /* ========================================================= CTA CONTENT ========================================================= */ .contrate-parceiros .partners-cta__content, .contrate-parceiros .partners-cta__panel { position: relative; z-index: 1; } /* ========================================================= CTA EYEBROW ========================================================= */ .contrate-parceiros .partners-cta__eyebrow { margin: 0 0 10px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .09em; text-transform: uppercase; color: var(--orange); } /* ========================================================= CTA H2 ========================================================= */ .contrate-parceiros .partners-cta__content h2 { max-width: 640px; margin: 0; font-family: var(--font-primary); font-size: clamp(1.9rem, 3vw, 2.4rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.04em; color: var(--white); } .contrate-parceiros .partners-cta__content h2 span { display: block; color: var(--orange); } /* ========================================================= CTA TEXT ========================================================= */ .contrate-parceiros .partners-cta__text { max-width: 600px; margin: 16px 0 0; font-family: var(--font-primary); font-size: clamp(1rem, 1.12vw, var(--text-body)); font-weight: 400; line-height: 1.7; color: rgba(255, 255, 255, .70); } /* ========================================================= CTA ACTIONS ========================================================= */ .contrate-parceiros .partners-cta__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; } /* ========================================================= BUTTONS ========================================================= */ .contrate-parceiros .partners-cta__button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 11px 18px; border: 1px solid transparent; border-radius: 8px; font-family: var(--font-primary); font-size: var(--text-sm); font-weight: 700; line-height: 1; text-decoration: none; transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease; } /* PRIMARY */ .contrate-parceiros .partners-cta__button--primary { border-color: var(--red-primary); background: var(--red-primary); color: var(--white); } .contrate-parceiros .partners-cta__button--primary:hover, .contrate-parceiros .partners-cta__button--primary:focus-visible { border-color: var(--red-wine); background: var(--red-wine); color: var(--white); transform: translateY(-1px); } /* SECONDARY */ .contrate-parceiros .partners-cta__button--secondary { border-color: rgba(255, 255, 255, .24); background: transparent; color: var(--white); } .contrate-parceiros .partners-cta__button--secondary:hover, .contrate-parceiros .partners-cta__button--secondary:focus-visible { border-color: rgba(255, 255, 255, .42); background: rgba(255, 255, 255, .06); color: var(--white); transform: translateY(-1px); } /* ========================================================= BUTTON SVG ========================================================= */ .contrate-parceiros .partners-cta__button svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= CTA PANEL ========================================================= */ .contrate-parceiros .partners-cta__panel { padding: 22px; border: 1px solid rgba(255, 255, 255, .10); border-radius: 14px; background: rgba(255, 255, 255, .05); } /* ========================================================= PANEL HEAD ========================================================= */ .contrate-parceiros .partners-cta__panel-head { padding-bottom: 16px; border-bottom: 1px solid rgba(255, 255, 255, .10); } .contrate-parceiros .partners-cta__panel-head small { display: block; margin-bottom: 6px; font-family: var(--font-primary); font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: .08em; text-transform: uppercase; color: var(--orange); } .contrate-parceiros .partners-cta__panel-head strong { display: block; font-family: var(--font-primary); font-size: clamp(1.05rem, 1.3vw, 1.2rem); font-weight: 700; line-height: 1.3; color: var(--white); } /* ========================================================= PANEL LIST ========================================================= */ .contrate-parceiros .partners-cta__panel-list { display: grid; gap: 12px; margin-top: 18px; } .contrate-parceiros .partners-cta__panel-list > div { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px; align-items: center; } /* ========================================================= CHECK ========================================================= */ .contrate-parceiros .partners-cta__panel-list span { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(31, 140, 90, .18); color: #7ED4A9; } .contrate-parceiros .partners-cta__panel-list svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; } /* ========================================================= PANEL TEXT ========================================================= */ .contrate-parceiros .partners-cta__panel-list p { margin: 0; font-family: var(--font-primary); font-size: var(--text-card); font-weight: 400; line-height: 1.5; color: rgba(255, 255, 255, .74); } /* ========================================================= TABLET ========================================================= */ @media (max-width: 900px) { .contrate-parceiros .partners-cta { grid-template-columns: 1fr; gap: 30px; } .contrate-parceiros .partners-cta__panel { max-width: 640px; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 640px) { .contrate-parceiros .s-partners.isbet-partners-marquee { padding-block: 52px; } .contrate-parceiros .s-partners.isbet-partners-marquee .wrap { width: calc(100% - 32px); } .contrate-parceiros .partners-head { margin-bottom: 28px; } .contrate-parceiros .partners-head h2, .contrate-parceiros .partners-cta__content h2 { font-size: clamp(1.8rem, 8vw, 2.15rem); } .contrate-parceiros .partners-intro, .contrate-parceiros .partners-cta__text { font-size: var(--text-base); line-height: 1.7; } .contrate-parceiros .partners-marquee { gap: 10px; } .contrate-parceiros .partners-track { gap: 10px; } .contrate-parceiros .partner-logo-card { min-width: 128px; height: 56px; padding: 10px 14px; } .contrate-parceiros .partner-logo-card img { max-width: 92px; max-height: 24px; } .contrate-parceiros .row-right .partners-track { animation-duration: 24s; } .contrate-parceiros .row-left .partners-track { animation-duration: 26s; } .contrate-parceiros .partners-cta { margin-top: 36px; padding: 26px 20px; border-radius: 14px; } .contrate-parceiros .partners-cta__actions { flex-direction: column; align-items: stretch; } .contrate-parceiros .partners-cta__button { width: 100%; } } /* ========================================================= ACCESSIBILITY ========================================================= */ .contrate-parceiros .s-partners a:focus-visible { outline: 3px solid rgba(255, 102, 0, .30); outline-offset: 3px; } /* ========================================================= REDUCED MOTION ========================================================= */ @media (prefers-reduced-motion: reduce) { .contrate-parceiros .partners-track { animation: none !important; } .contrate-parceiros .partner-logo-card, .contrate-parceiros .partners-cta__button { transition: none !important; } .contrate-parceiros .partner-logo-card:hover, .contrate-parceiros .partners-cta__button:hover { transform: none; } }/* End custom CSS */