html {scroll-behavior: smooth;}
html :where(img) {height: auto; max-width: initial;}

/* Banner */
.hero { height: auto; overflow: hidden; background-image: url("../images/seguro-simplificado/pattern-2.png"), url("../images/seguro-simplificado/pattern-1.png"); background-position: 70% center, left center; background-repeat: no-repeat no-repeat;	background-size: contain contain; position: relative; }
.hero__image { width: 60%; height: 100%; position: absolute; top: 0; right: 0; background: url("../images/seguro-simplificado/banner-bg.png"); background-size: contain; background-position: bottom right; background-repeat: no-repeat; }
@media only screen and (min-width: 1040px) and (max-width: 1440px){ .hero__image { width: 55%; }  }
@media (max-width: 990px) { .hero__image { display: none;}  }
.hero__description { padding-bottom: 70px; width: 50%; }
.hero__description .t-breadcrumbs, .hero__description .t-breadcrumbs a, .hero__description .t-breadcrumbs .breadcrumb_last { color: var(--t-white); }
.hero__description .t-breadcrumbs a:hover { color: var(--t-white); opacity: 0.8; text-decoration: underline; }
@media (max-width: 990px) {.hero__description {width: 100%; padding-left: 15px; padding-right: 15px;}}
.hero__description h1 { font-size: 3rem; font-weight: 900; line-height: 1}
.hero__description h2 { font-size: 1.125rem}
.hero__description h1::after {content: ''; display: block; width: 80%; height: 3px; background: var(--t-yellow); margin: 25px 0 40px;}
@media (max-width: 990px) {.hero__description h1 {font-size: 2rem;} .hero__description h2 br {display: none;}}
@media only screen and (min-width: 1024px) and (max-width: 1440px){.hero__description h1 { font-size: 2rem;} .hero__description {padding-bottom: 0;} .hero__description h1::after {margin: 12px 0 0;}}

/* Tarja */
.bloco-tarja h2{font-size: 1.9375rem; font-weight: 900;}
@media only screen and (min-width: 1024px) and (max-width: 1440px){.bloco-tarja h2{font-size: 1.5rem;}}

/* Proteger */
.bloco-oferecer {height: 800px; background-image: url("../images/seguro-simplificado/bloco-patrimonio-bg.png"); background-position: center right; background-repeat: no-repeat;	background-size: cover;}
.bloco-oferecer h2 {font-size: 2.5rem; font-weight: 300;}
.bloco-oferecer h2 strong {font-weight: 900}
@media (max-width: 990px) {.bloco-oferecer {height: auto; background-position: center left;} .bloco-oferecer h2 {font-size: 1.5rem;}}
@media only screen and (min-width: 1024px) and (max-width: 1440px){.bloco-oferecer {height: auto; background-position: center left;} .bloco-oferecer h2 {font-size: 1.8rem;}}

/* Medida */
.bloco-medida h3 {font-size: 2.5rem; font-weight: 900}
.bloco-medida p {font-size: 2rem;}
.bloco-medida .position-direita {width: 55%}
.bloco-medida-lista ul {margin: 0; padding: 0; position: relative; width: 70%;}
.bloco-medida-lista ul .plus-btn {position: absolute; height: 40px; right: 0; top: -50px}
.bloco-medida-lista ul .plus-btn img {filter: invert(1) brightness(2); transform: rotate(45deg);}
.bloco-medida-lista ul li {font-size: 1.5rem;}
.bloco-medida-conteudo, .bloco-medida .container-fluid {position: relative;}
.bloco-medida-lista {width: 65%; height: 100%; background: var(--t-blue); position: absolute; right: 0; bottom: 0; clip-path: polygon(235px 0, 100% 0%, 100% 100%, 0% 100%); padding-left: 21rem; padding-top: 10rem; transform: translateX(105%); transition: all 0.5s ease;}
.mostrar-bloco {transform: translateX(0); transition: all 0.5s ease;}
.bloco-medida-lista::after {content: ''; display: block; width: 30px; height: 130%; background: var(--t-vertical-gradient); position: absolute; top: -90px; left: 100px; transform: rotate(18.2deg);}
.plus-btn {position: absolute; right: 150px; bottom: 0; border: none; background: transparent; width: auto; height: auto;}
.plus-btn:hover {opacity: 0.5; transition: all 0.5s ease}
@media (max-width: 990px) {.bloco-medida h3 {font-size: 2rem;} .bloco-medida p {font-size: 1rem;} .bloco-medida-lista ul li {font-size: 1rem;} .bloco-medida-lista ul .plus-btn {right: 20px; top: -50px} .bloco-medida .position-direita {width: 95%} .bloco-medida-lista ul {width: 100%;} .bloco-medida-lista {position: fixed; z-index: 99999999; width: 100%; height: 105vh; top: -20px; overflow: hidden; padding-left: 2rem; padding-top: 5rem; clip-path:none; } .bloco-medida-lista::after {display: none;}}
@media only screen and (min-width: 1024px) and (max-width: 1440px){.bloco-medida h3 {font-size: 1.5rem;} .bloco-medida p {font-size: 1rem;} .bloco-medida-lista ul li {font-size: 1rem;} .bloco-medida-lista {width: 72%; padding-left: 18rem; padding-top: 6rem;} .bloco-medida-lista::after {transform: rotate(28deg); left: 110px;}}

/* Slide */
.bloco-coberturas {background: #E5E5E5; background-image: url("../images/seguro-simplificado/pattern-3.png"), url("../images/seguro-simplificado/pattern-4.png"); background-position: left top, right bottom; background-repeat: no-repeat no-repeat;	background-size: contain contain; }
.bloco-coberturas h2::after {content: ''; display: block; width: 40%; height: 2px; background: var(--t-yellow); margin: 40px 0 60px;}
.slide-card {position: relative; height: 240px; padding: 25px;}
.slide-card::after {content: ''; width: 3px; height: 100%; background: var(--t-vertical-gradient); display: block; position: absolute; right: -13px; top: 0;}
.slide-title {display: grid; grid-template-columns: 20px 1fr; gap: 15px;}
@media (max-width: 990px) {.bloco-coberturas {background-image:none;} .slide-card::after {display: none;} .slide-title {grid-template-columns: 1fr;} .slide-title figure {display: none;} .slide-title h3 {font-size: 1.5rem;}}
@media only screen and (min-width: 1024px) and (max-width: 1440px){.bloco-coberturas {background-position: -9% top, right bottom;} .slide-title h3 {font-size: 1.4rem;} .bloco-coberturas h2 {font-size: 1.5rem;}}


/* Vai Seguro */
.bloco-planos p {font-size: 2rem;}
.bloco-planos p strong {font-weight: 900}
.bloco-planos .position-direita {width: 55%}
@media (max-width: 990px) {.bloco-planos p {font-size: 1.2rem;} .bloco-planos .position-direita {width: 95%}}
@media only screen and (min-width: 1024px) and (max-width: 1440px){.bloco-planos p {font-size: 1.4rem;}}

/* Formulário */
.bloco-formulario {background-image: url("../images/seguro-farma/bloco-formulario-bg.png"); background-position: bottom right; background-repeat: no-repeat;	background-size: cover;}
.bloco-formulario h2 {font-size: 3rem; font-weight: 900}
.bloco-formulario h3 {font-size: 1.5rem;}
.bloco-formulario input:not([type='checkbox']) { border-radius: 0; border: 1px solid #78909C; background: transparent; height: 56px; font-size: 14px; color: var(--t-white); }
.bloco-formulario select { border-radius: 0; border: 1px solid #78909C; background: transparent; height: 56px; color: var(--t-white); font-size: 14px; }
.bloco-formulario .select select { -webkit-appearance: none; -moz-appearance: none; background-image: url(../images/icones/down.svg); background-repeat: no-repeat; background-position: right 15px center; background-repeat: no-repeat; }
.bloco-formulario .form-control option { color: #000; }
.bloco-formulario input::placeholder { color: #F5F7F8; font-size: 14px; }
.bloco-formulario p a {font-weight: bold;}
.bloco-formulario p a:hover {color: var(--t-white);}
@media (max-width: 990px) {.d-grid-form {grid-template-columns: 1fr;} .bloco-formulario h2 {font-size: 2rem;} .bloco-formulario h3 {font-size: 1.1rem;}}
@media only screen and (min-width: 1024px) and (max-width: 1440px){.bloco-formulario h2 {font-size: 1.5rem;} .bloco-formulario h3 {font-size: 1.1rem;}}

/* Especialista */
.bloco-especialista h3 {font-size: 2.5rem; font-weight: 900}
.bloco-especialista p {font-size: 2rem;}
.bloco-especialista .position-direita {width: 55%}
@media (max-width: 990px) {.bloco-especialista h3 {font-size: 2rem;} .bloco-especialista p {font-size: 1.1rem;} .bloco-especialista .position-direita {width: 95%}}
@media only screen and (min-width: 1024px) and (max-width: 1440px){.bloco-especialista h3 {font-size: 1.5rem;} .bloco-especialista p {font-size: 1.1rem;}}