@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,300;0,400;0,600;0,800;1,400&display=swap');


html {
    scroll-behavior: smooth;
}

body {
    scroll-behavior: auto !important;    overflow-x: hidden;    font-family: 'Jost', sans-serif;
    font-weight: 400;font-size:1.2em;
}


::-webkit-scrollbar-track {
	background: #ffffff;       /* fundo branco */
}

::-webkit-scrollbar-thumb {
	background-color: #000000; /* cor preta da barra */
	border-radius: 0;          /* sem borda arredondada */
	border: none;
}

/* Firefox */
* {
	scrollbar-width: thin;          /* fino */
	scrollbar-color: #000000 #ffffff; /* polegar preto / trilho branco */
}



.container {
    max-width: 1290px !important;
}

figure.align-left {
	width: 100%;
0
	margin: 1rem 00;
}


figure.align-right {
	width: 100%;

	margin: 1rem 0;

}

table {
	border-collapse: collapse;
	width: 100%;
	background-color: #fff;
	line-height: 1.1;
	font-size: 0.9em;margin: 0 !important;
}

table th,
table td {
	border: 1px solid #000; /* mesma cor padrão do Bootstrap */
	padding: 0.5rem;
}

table th {
	background-color: #000;color:#fff; /* fundo claro para cabeçalhos */
}

table caption {
	caption-side: top;
	text-align: center;
	padding: 0.5rem;
	background-color:#000;color:#fff;
	font-weight:700;
}


h1, h2 {
    font-weight: 800;
}

.nav-link, a {color:#000;padding:10px 0;}

.nav-link:hover {text-decoration:underline;color:#000;}


figure { margin: 2vw 0;
    text-align: center;
    background: url("/img/bg-tramas.jpg");background-size:500px;
        padding: 4vw; }

    figure img , img{
        max-width: 100%;
        height: auto;
    }

figcaption {
	background-color: #fff;
	width: 100%;
	font-size: 0.85em;
	font-weight: 600;
	line-height: 1.1;
	text-align: left;
	padding: 15px;
}


main section { margin:10vh 0;}


main section:first-child {margin-top:0;}

main section:last-child {margin-bottom:0;}

/* controls */

.modal-content {
    border-radius: 0;
}

.btn,
.form-control,
.dropdown-menu,
.carousel-control-prev-icon,
.carousel-control-next-icon {
    border-radius: 0 !important; opacity:1!important;
}


.btn-close {
    background-size: cover;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");opacity:1!important;}

.carousel-indicators {column-gap:10px;}
.carousel-indicators [data-bs-target]
{border:1px solid #000; width:15px;height:15px;border-radius:100%;opacity:1;}

.carousel-indicators .active {
    background-color: #000;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    width: 4rem;
    height: 4rem;

}

.carousel-control-next, .carousel-control-prev {opacity:1;}

.carousel-control-prev-icon {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='none' stroke='%23000' stroke-linecap='square' stroke-linejoin='square' viewBox='0 0 24 24'%3E%3Cpath d='m15 6-6 6 6 6'/%3E%3C/svg%3E");
}
.carousel-control-next-icon {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='52' fill='none' stroke='%23000' stroke-linecap='square' stroke-linejoin='square' viewBox='0 0 24 24'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E");
}

.carousel-control-next {
    right: -10%;
}

.carousel-control-prev {
    left: -10%;
}

.btn-primary, .btn-primary:hover{
    background-color: transparent;
    border-color: transparent;
    color: #000;
}


/*header*/

#site-header {
transition: all 0.2s ease;background-color:#000;
}


.ttt-hero {background-image:url(../img/tramas-ttt.jpg);position:relative;}
.ttt-hero-mobile {background-image:url(../img/tramas-ttt-mobile.jpg);position:relative;}
.ttt-hero-mobile {height:170px;width:100%;background-size:contain;background-position:center;}

.info {
    width: 430px;
    height: 500px;
    position: absolute;
    line-height: 1.5;
    font-size: 16px;
    top: 66px;
    padding: 50px 90px 0 120px;
    right: 30px;
    background-repeat: no-repeat;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='372' height='317' fill='none'%3E%3Cpath fill='%23fff' d='M85 0h287v317H85z'/%3E%3Cpath fill='%23fff' d='M0 231.954 83.694 200 90 317 0 231.954Z'/%3E%3C/svg%3E");
}

.elementos a {text-decoration:none;}

nav.menu-secundario {
	width: 100%;
	text-transform: uppercase;
}

.articleMeta [class^="item-m"] {margin:3vh 0;}

[class^="item-m"] {background-size: 60px;
    background-repeat: no-repeat;
    background-position: center top;
    padding-top: 60px;
    width: 60px;
    text-align: center;
    font-size: 17px;display:block;}

.item-m-agua {
    background-image:url("../img/simbolo-agua.png");
}

.item-m-aire {
    background-image:url("../img/simbolo-ar.png");
}

.item-m-fuego {
    background-image:url("../img/simbolo-fogo.png");
}

.item-m-tierra {
    background-image:url("../img/simbolo-terra.png");
}

.item-m-mineral {
    background-image:url("../img/simbolo-mineral.png");
}

.lista-casos [class^="item-m"] , .carousel-item [class^="item-m"]{
    background-size: 50px;
    padding-top: 50px;
    width: 60px;
    font-size: 14px;
}

ul.elementos {
    display: flex    ;
    width: 100%;
    padding: 0;
    margin: 0;
    justify-content: space-evenly;max-width:1570px;
}

ul.elementos li {
    list-style: none;
}

.search-lang {    display: flex    ;    column-gap: 20px;}

.btn-menu, .btn-search, .btn-lang {
    background-size:40px;
    background-repeat:no-repeat;background-position:center;
    width:40px;height:40px;

}


.btn-menu{background-size:25px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35' height='35' fill='none'%3E%3Cpath stroke='%23fff' stroke-width='2' d='M0 1h35M0 18h35M0 34h35'/%3E%3C/svg%3E");
}

#site-header .btn-search
 {background-size:30px; background-repeat:no-repeat;background-position:center;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='47' height='52' fill='none'%3E%3Ccircle cx='20.567' cy='20.568' r='14.543' stroke='%23fff' stroke-width='2' transform='rotate(45.026 20.567 20.568)'/%3E%3Ccircle cx='20.567' cy='20.568' r='14.543' stroke='%23fff' stroke-width='2' transform='rotate(45.026 20.567 20.568)'/%3E%3Cpath stroke='%23fff' stroke-width='2' d='M30.301 33.726 46.23 50.347M30.301 33.726 46.23 50.347'/%3E%3C/svg%3E");
}

form.form-search .btn {background-size:30px; background-repeat:no-repeat;background-position:center;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='47' height='52' fill='none'%3E%3Ccircle cx='20.567' cy='20.568' r='14.543' stroke='%23000' stroke-width='2' transform='rotate(45.026 20.567 20.568)'/%3E%3Ccircle cx='20.567' cy='20.568' r='14.543' stroke='%23000' stroke-width='2' transform='rotate(45.026 20.567 20.568)'/%3E%3Cpath stroke='%23000' stroke-width='2' d='M30.301 33.726 46.23 50.347M30.301 33.726 46.23 50.347'/%3E%3C/svg%3E");
}

.btn-lang{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='55' height='55' fill='none'%3E%3Ccircle cx='27.033' cy='27.015' r='19.102' stroke='%23000' stroke-width='2' transform='rotate(45.026 27.033 27.015)'/%3E%3Ccircle cx='27.033' cy='27.015' r='19.102' stroke='%23000' stroke-width='2' transform='rotate(45.026 27.033 27.015)'/%3E%3Cpath stroke='%23000' stroke-width='2' d='m34.048 9 2 18-2 18M21.048 9l-3 18 3 18'/%3E%3Cpath stroke='%23000' stroke-width='2' d='M45.048 22.5 27.414 20 9.048 22.5M45.048 32l-18 3-18-3'/%3E%3C/svg%3E");
}

#OpenMenu:focus-visible, .btn-search:focus-visible {
outline: 2px solid #000;
outline-offset: 3px;
}


div#menuOffcanvas {background-color:#000;max-width:100%;}
div#menuOffcanvas a {color:#fff;}
div#menuOffcanvas .btn-close {background-size: cover;
    width: 30px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E");
    margin-top: 0.5rem;
    margin-right: 0.5rem;}



/* main */

main.homepage section {        margin: 10vh 0;    }


/* footer */

span.ddgo {
    font-size: 13px;
    opacity: 0.4;
}

footer.site-footer {
    margin: 10vh 0 0 0;
}

.site-info {text-align: center;
    font-size: 0.70em;
    margin: 20vh 0 0 0;}

.site-info p {
    margin: 0;
    padding: 0;
}

.linea {
    height: 40px;
    margin: 5vw 0;
    background-size: auto;
    background-repeat: no-repeat;
    border: 0;
    opacity: 1;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1401' height='41' fill='none'%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-width='2' d='M1399.33 6.702c-38.44-1.218-104.43-4.654-150.37-5.477-69.8-1.25-96.51 3.103-101.81 4.666-14.89 4.392-37.13 6.242-75.97 14.058-23.97 4.823-57.1 7.817-83.932 9.815-46.421 3.457-72.364 1.223-83.333.047-10.224-1.096-30.778-2.727-57.342-6.253-35.075-4.656-69.226-11.355-102.749-16.057-22.157-3.107-55.289-1.598-75.099-1.986-25.444-.498-41.044-1.963-58.747-1.575-38.269.838-85.152 3.514-103.259 4.702-6.815.446-13.852 1.963-33.927 3.902-43.4 4.193-75.673 9.815-84.514 10.203-20.286.89-40.055 3.514-68.758 4.701-14.018.58-22.405 3.515-34.459 6.266-9.797 2.235-19.862 2.75-34.363 4.701-17.122 2.304-30.905-.376-37.969-1.94-9.78-2.163-36.725-7.792-70.748-16.02-25.327-6.125-44.108-5.149-69.257-7.1-44.32-3.438-59.96 1.951-71.727 6.63'/%3E%3C/svg%3E");
}

form.form-search {
    display: flex;
}

form.form-search .btn {
    max-width: 50px;
    height: 50px;
    font-size: 0;
}

form.form-search  input {
    border:none;border-bottom: 2px solid;padding:0;text-align:center;
}

/* article */

div#resumo {
	max-width: 700px;
	font-weight: 400;
	line-height: 1.3;
}

p.authors {
	text-transform: uppercase;
	font-size: 0.85em;
}

a sup {
	font-size: 12px;
	font-weight: 600;
	display: inline-flex	;
	align-items: center;
	justify-content: center;
}

sup:before {
	content: '[';
}
sup:after {
	content: ']';
}

.article-rap {
	max-width: 450px;
}

.rap-text {
	font-style: italic;
	line-height: 1.3;
}
.rap-title {
	font-size: 0.8em;
	font-weight: bold;
}

.banner-fin {
    height:160px;
    width:100%;
    background-position:center;margin: 7vw 0 ;background-size: cover;background-repeat:no-repeat;

}

.fin {
    text-align: center;
    font-weight: 900;
    font-size: 2.5em;margin: 7vw 0;
}

.header-container h1 {  text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 8px;   }

.article-content h2 {
    margin: 3rem 0 1rem 0;
    padding: 1rem 0 0 0;
}

.article-content h3 {
	font-weight:600;
	margin: 2rem 0 1rem 0;
	padding: 1rem 0 0 0;
}

.article-content a {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
    transition: all 0.3s ease;
}

.article-content a:hover {
    text-decoration-thickness: 2px;
}
.header-container, #resumo, #intro {max-width:930px;}

.article-hero, .ttt-hero {
    background-size: cover;
    background-position: center;
    aspect-ratio: 1920 / 500; /* mantém proporção exata */
    padding-bottom: calc(500 / 1920 * 100%); /* ~29.17% */
}

.article-content { overflow:hidden;}

.articleMeta p {
    margin: 0;
    padding: 0;
    font-size: 0.8em;
}

.layout-article {
    display: grid;
    grid-template-columns: 1fr minmax(0, 1060px) auto;
}

.article-content {
    grid-column: 2; /* sempre no meio */
}

.articleIndex {
	width: 300px;
	border: 1px solid #000;
	background: #fff;
	position: sticky;
	top: 4vw;
	height: fit-content;
	grid-column: 3;
	margin-left: 5vw;
	margin-top: 60vh;

}
.articleIndex ol li ol li {display:none;}

.articleIndex a {
    color: #000;
    text-decoration: none;
}

.articleIndex a:hover {
    text-decoration: underline;
}

.nv {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.articleIndex ol {
    counter-reset: item;
    list-style: none;
    padding:0;margin:0;font-size:0.85em; line-height:1.2em;
}
.articleIndex li {
    display: block;padding:15px 30px;
}
.articleIndex li::before {
    content: counters(item, ".") ". ";
    counter-increment: item;
}

nav.articleIndex > ol > li:first-child {
    padding-top: 40px;
}

nav.articleIndex > ol > li:last-child {
    padding-bottom: 40px;
}


.articleIndex a {
    text-decoration: none;
}
.articleIndex a:hover {
    text-decoration: underline;
}

.articleIndex li.active{
    background-color: black;color:#fff;
}

.articleIndex li.active a{
    color: #fff;
}
/* article grid */


article .card h3 {
    text-transform: uppercase;
    font-weight: 700;
}

article .card h3 {
    text-decoration: underline;
}


.lado-a-lado {
display: flex; flex-wrap: wrap;
}

.lado-a-lado figure {
    margin: 0;
    flex: 1;
}

.lado-a-lado img {
    max-width: 100%;
    height: auto;
    display: block;width:100%;
}

.destaque {
    color: #fff;
    background: #000;
   padding: 4vw 10vw 4vw 7vw;
    margin: 3vw 0;
    position: relative;
}

.destaque::after {
    content: "";
    position: absolute;
    right: 5vw;
    top: 100px;
    height: calc(100% - 200px);
    width: 2px;
    background: #fff;
}


.destaque h2:first-of-type {
    margin-top: 0;
}

.destaque p:last-of-type {
    margin: 0; /* remove toda a margem do último parágrafo */
}
.destaque a{color:#fff;}

.q-simples {
	margin: 2rem auto;
	background: url(https://www.svgrepo.com/show/35740/left-quote-sketch.svg);
	background-size: 50px;
	padding: 0px 0 0 70px;
	background-repeat: no-repeat;
	max-width: 800px;
	line-height: 1.3;
}

blockquote {
	margin: 2rem 0;
	    background: url("../img/q-simples.svg");background-size:500px;
	padding: 4rem;
}

blockquote div {

}

blockquote p:last-child {	margin:0;}

blockquote footer {
	font-size: 0.8em;
	font-weight: bold;
}

.video, .iframe-trama {
	background: url("/img/bg-tramas.jpg");background-size:500px;
	padding: 4rem;
	margin: 2rem 0;
}

.v-container {
	position:relative;padding-bottom:56.25%;height:0;overflow:hidden;max-width:100%;
}


.s-top {position:fixed;width: 100%;z-index:1;}
.fixa-menu {position:relative;}

.logo-mobile {width:200px;    position: relative;
    top: 8px;}

@media (max-width: 1199.98px) {



	.video, .iframe-trama {
		padding: 1rem;
	}
    .layout-article {
        grid-template-columns: 1fr;
    }
    .article-content {
        grid-column: 1;
    }
    .articleIndex {
        display: none;
    }




}

@media (min-width: 1400px) {
.fixa-menu {position:fixed;}

figure.align-left {
	width: 50%;
	float: left;
	margin: 1rem 3rem 1rem 0;
}


figure.align-right {
	width: 50%;
	float: right;
	margin: 1rem 0 3rem 1rem

}
}


@media (min-width: 992px) {



	.q-simples {
		margin: 4rem auto;
		padding: 0px 8rem 0 70px;

	}

    .s-top {position:relative;width: 100%;}


    section h2 {font-size:2.6rem;margin: 0 0 20px 0;}
    .header-container h1 {font-size:4rem;}

    div#menuOffcanvas {max-width:300px;}

.p-fixed {position:fixed;}
    .lado-a-lado, .mosaico {
        flex-direction: row;
        align-items: flex-start;
    }

    .lado-a-lado img {
        width: 50%;
    }
}

@media (min-width: 765px) {
	#site-header {
	background-color:#fff;
	}
	.btn-menu{background-size:25px;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35' height='35' fill='none'%3E%3Cpath stroke='%23000' stroke-width='2' d='M0 1h35M0 18h35M0 34h35'/%3E%3C/svg%3E");
	}

	#site-header .btn-search {background-size:30px; background-repeat:no-repeat;background-position:center;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='47' height='52' fill='none'%3E%3Ccircle cx='20.567' cy='20.568' r='14.543' stroke='%23000' stroke-width='2' transform='rotate(45.026 20.567 20.568)'/%3E%3Ccircle cx='20.567' cy='20.568' r='14.543' stroke='%23000' stroke-width='2' transform='rotate(45.026 20.567 20.568)'/%3E%3Cpath stroke='%23000' stroke-width='2' d='M30.301 33.726 46.23 50.347M30.301 33.726 46.23 50.347'/%3E%3C/svg%3E");
	}
}