/* reset by rafaux */
* { margin: 0px; padding: 0px; border: 0px; font-weight: normal; font-size: 100%; list-style: none; line-height: 1; outline: 0px; background: none; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -ms-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; }

/* var */
:root { --primary: #133365; --gold: #D2B58B; --silver: #E4E4E4; --fonttitle: 'Mokoko'; }

/* global class */
.container { display: block; width: auto; max-width: 1200px; height: auto; margin: 0px auto; }

/* base */
a { text-decoration: none; transition: all .5s ease; }
body { background: #fff; color: var(--primary); font: normal 14px 'Poppins', sans-serif; overflow-x: hidden; }
figure { margin: 0px !important; }
input, textarea, select, button { font: normal 14px 'Poppins', sans-serif; appearance: none; -webkit-appearance: none; border-radius: 0px; cursor: pointer; }
input[type=submit], button { transition: all .5s ease; }

/* header */
#header { position: fixed; z-index: 10; top: 0px; left: 0px; display: flex; justify-content: space-between; align-items: center; width: 100%; height: auto; padding: 30px; transition: all .5s ease; }
#header span.logo img { width: 200px; }
#header nav { display: flex; justify-content: space-between; align-items: center; white-space: nowrap; }
#header nav ul { display: flex; justify-content: space-between; align-items: center; gap: 40px; }
#header nav ul li a { color: #fff; font-weight: bold; font-size: 14px; }
#header nav ul li a:hover,
#header nav ul li.on a { color: var(--gold); }
#header nav ul.social { margin: 0px 70px; }
#header nav ul.social li a { font-size: 16px; }
#header span.wp a { padding: 10px 20px; background-color: var(--gold); border: 1px solid var(--gold); color: var(--primary); font-weight: bold; font-size: 12px; }
#header span.wp a i { margin-right: 15px; }
#header span.wp a:hover { background-color: var(--primary); color: var(--gold); }

    /* header -> toggle */
    #header span.toggle-menu { display: none; position: absolute; top: 58px; left: 260px; width: 20px; height: 20px; border-top: 2px solid var(--gold); transition: all .5s ease; cursor: pointer; }
    #header span.toggle-menu::before { position: absolute; top: 4px; left: 0px; width: 100%; height: 2px; background-color: var(--gold); content: ''; }
    #header span.toggle-menu::after { position: absolute; top: 10px; left: 0px; width: 100%; height: 2px; background-color: var(--gold); content: ''; }

    /* header -> on */
    #header.on { padding: 20px; background-color: var(--primary); }
    #header.on span.logo img { width: 140px; }
    #header.on span.wp a:hover { border-color: var(--gold); }
    #header.on span.toggle-menu { top: 38px; left: 190px; }

    /* header -> int */
    #header.int { background-color: var(--primary); }
    #header.int span.wp a:hover { border-color: var(--gold); }

/* banner */
#banner { width: 100%; height: 600px; max-height: 100vh; background-color: #000; overflow: hidden; }
#banner section { width: 100%; height: 100%; }
#banner section article,
#banner section article figure { position: relative; width: 100%; height: 600px; max-height: 100vh; }
#banner section article figure::before { position: absolute; z-index: 2; top: 0px; left: 0px; width: 100%; height: 200px; background: linear-gradient(to bottom, rgba(0,0,0,.8), transparent); content: ''; }
#banner section article figure::after { position: absolute; z-index: 2; bottom: 0px; left: 0px; width: 100%; height: 400px; background: linear-gradient(to top, rgba(0,0,0,.8), transparent); content: ''; }
#banner section article figure img { width: 100%; height: 100%; object-fit: cover; }
#banner section article figcaption { position: absolute; z-index: 3; bottom: 110px; left: 0px; width: 100%; text-align: center; }
#banner section article figcaption h2 a { display: block; margin-bottom: 30px; font-size: 60px; font-family: var(--fonttitle); color: #fff; }
#banner section article figcaption span { display: inline-block; width: auto; margin: 0px 20px; color: var(--gold); font-weight: bold; } 
#banner .slick-dots { position: absolute; z-index: 3; bottom: 40px; left: 50%; width: auto; transform: translateX(-50%); }
#banner .slick-dots li { display: inline-block; width: 10px; height: 10px; margin: 0px 10px; border: 2px solid #fff; border-radius: 100%; text-indent: -9999em; cursor: pointer; }
#banner .slick-dots li.slick-active { background-color: var(--gold); border-color: var(--gold); }

/* cover */
#cover { position: relative; width: 100%; height: 600px; max-height: 100vh; background-color: #000; }
#cover::before { position: absolute; z-index: 2; top: 0px; left: 0px; width: 280px; height: 100%; background-color: var(--primary); content: ''; }
#cover::after { position: absolute; z-index: 1; top: 0px; left: 0px; width: 100%; height: 200px; background: linear-gradient(to bottom, rgba(0,0,0,.8), transparent); content: ''; }
#cover figcaption { position: absolute; z-index: 2; bottom: 60px; left: 50%; margin-left: -600px; padding-right: 60px; }
#cover figcaption h1 { display: block; width: auto; margin-bottom: 20px; font-size: 72px; font-family: var(--fonttitle); color: #fff; }
#cover figcaption span a { display: inline-block; width: auto; margin-right: 40px; font-weight: bold; font-size: 12px; color: var(--gold); text-align: center; }
#cover figcaption span a i { display: block; margin-bottom: 5px; font-size: 24px; }
#cover figcaption span:last-of-type a { margin-right: 0px; }
#cover img { position: absolute; top: 0px; left: 280px; width: calc(100% - 280px); height: 100%; opacity: .6; object-fit: cover; }

	/* cover -> blog */
	#cover.cover-blog figcaption h1 { font-size: 60px; }
	#cover.cover-blog figcaption p { display: block; font-weight: bold; font-size: 20px; color: #fff; line-height: 1.2; }

    /* cover -> biarro */
    #cover.cover-bairro figcaption h1 { font-size: 48px; }
		
/* descricao */
#descricao { padding: 40px 0px; }
#descricao p { display: block; margin-bottom: 20px; line-height: 1.6; }

/* busca */
#busca { position: relative; margin-bottom: 70px; padding: 70px 0px; }
#busca::before { position: absolute; z-index: -1; top: 0px; left: 0px; width: 50%; height: 100%; background: #fff url('../img/pattern.jpg') repeat; background-size: contain; content: ''; }
#busca::after { position: absolute; z-index: 1; top: 50%; left: -950px; width: 1000px; height: 1000px; background-color: var(--primary); content: ''; }
#busca header { text-align: center; }
#busca header h6 { display: block; font-size: 48px; font-family: var(--fonttitle); }
#busca p { display: block; font-size: 24px; font-family: var(--fonttitle); text-align: center; }
#busca form fieldset { display: flex; width: 820px; height: 75px; margin: 50px auto 0px auto; padding: 0px 10px; background-color: #fff; border: 1px solid var(--gold); align-items: center; }
#busca form label.input { position: relative; width: calc(100% - 50px); height: 50px; }
#busca form label.input input { width: 100%; height: 50px; padding: 0px 30px; color: var(--primary); }
#busca form label.input small { position: absolute; top: 50%; left: 30px; transform: translateY(-50%); font-family: var(--fonttitle); font-size: 20px; transition: all .5s ease; }
#busca form label.input small b { display: block; margin-top: 7px; font-family: 'Titillium Web'; font-weight: bold; font-size: 14px; color: var(--gold); }
#busca form label.input small.off { top: 30%; opacity: 0; }
#busca form label:last-of-type { width: 50px; height: auto; }
#busca form label:last-of-type input { width: 50px; height: 50px; background: var(--primary) url('../img/busca-submit.svg') no-repeat center center; text-indent: -9999em; }
#busca form label:last-of-type input:hover { background-color: var(--gold); }
#busca nav ul { padding: 0px 100px; }
#busca nav ul li { display: block; text-align: center; }
#busca nav ul li img { display: block; width: auto; height: 130px; margin: 0px auto 20px auto; }
#busca nav ul li strong { font-family: var(--fonttitle); font-size: 18px; color: var(--primary); }
#busca .slick-dots { display: inline-block; width: 100%; height: auto; margin-top: 40px; text-align: center; }
#busca .slick-dots li { display: inline-block; width: 10px; height: 10px; margin: 0px 7px; border: 3px solid var(--primary); border-radius: 100%; text-indent: -9999em; cursor: pointer; }
#busca .slick-dots li.slick-active { background-color: var(--primary); }
#busca .slick-arrow { position: absolute; top: 50%; transform: translateY(-50%); font-size: 24px; }
#busca .slick-arrow.prev { left: 20px; }
#busca .slick-arrow.next { right: 20px; }

/* filtro */
#filtro { margin: 180px 0px 60px 0px; }
#filtro .items form { display: flex; width: 100%; padding: 40px; justify-content: space-between; align-items: flex-end; background-color: var(--silver); gap: 40px; }
#filtro .items form label { position: relative; width: 100%; cursor: pointer; }
#filtro .items form label:hover .lista { display: block; }
#filtro .items form strong { display: block; margin-bottom: 5px; font-weight: bold; font-size: 12px; }
#filtro .items form span.select { position: relative; display: block; width: 100%; height: 40px; padding: 0px 20px; background-color: #fff; line-height: 36px; font-weight: bold; font-size: 14px; }
#filtro .items form span.select::after { position: absolute; top: 5px; right: 5px; width: 30px; height: 30px; background-color: var(--gold); color: var(--primary); font-weight: 300; font-family: 'Font Awesome 5 Pro'; font-size: 14px; text-align: center; line-height: 30px; transition: all .5s ease; content: '\f063'; }
#filtro .items form input[type=submit] { width: 100%; height: 40px; background-color: var(--primary); color: var(--gold); font-weight: bold; font-size: 12px; text-transform: uppercase; }

    /* lista */
    #filtro .lista { display: none; position: absolute; z-index: 3; top: 56px; left: 0px; width: 100%; height: 150px; padding: 10px 20px; overflow-y: auto; background-color: #fff; box-shadow: 0px 40px 40px rgba(0,0,0,.5); }
    #filtro .lista li { display: block; padding: 10px 0px; font-size: 13px; text-transform: lowercase; cursor: pointer; }
    #filtro .lista li b { display: inline-block; width: 10px; height: 10px; margin-right: 7px; border: 1px solid var(--primary); vertical-align: middle; content: ''; }
    #filtro .lista li.on b { background-color: var(--primary); color: #fff; font-family: 'Font Awesome 5 Pro'; content: '\f00c'; }

/* lancamentos */
#lancamentos { padding-bottom: 100px; }
#lancamentos.int { padding-top: 200px; }
#lancamentos.lanc-search { padding-top: 210px; }
#lancamentos header h1 { display: block; margin-bottom: 70px; font-size: 30px; font-family: var(--fonttitle); text-align: center; }
#lancamentos section { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 14px; margin-bottom: 40px; }
#lancamentos section article { position: relative; display: block; width: 100%; height: 400px; background-color: #000; }
#lancamentos section article img { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; object-fit: cover; }
#lancamentos section article sup { position: absolute; top: 30px; left: 30px; padding: 8px 12px; background-color: var(--gold); color: var(--primary); font-weight: bold; }
#lancamentos section article figcaption { position: absolute; z-index: 2; bottom: 30px; left: 30px; width: calc(100% - 60px); height: 70px; padding: 15px; background-color: #fff; }
#lancamentos section article figcaption h2 { display: block; margin-bottom: 10px; font-weight: bold; color: var(--primary); }
#lancamentos section article figcaption span { display: inline-block; width: auto; margin-right: 20px; color: var(--gold); font-weight: bold; }
#lancamentos section article figcaption::after { position: absolute; top: 10px; right: 10px; width: 50px; height: 50px; background-color: var(--silver); color: var(--primary); font-weight: 300; font-family: 'Font Awesome 5 Pro'; font-size: 20px; text-align: center; line-height: 50px; transition: all .5s ease; content: '\f061'; }
#lancamentos section article:hover figcaption::after { background-color: var(--primary); color: var(--gold); }
#lancamentos footer { display: block; text-align: center; }
#lancamentos footer span a { display: inline-block; width: auto; padding: 10px 60px 12px 60px; background-color: var(--primary); font-weight: bold; font-size: 14px; color: #fff; text-transform: uppercase; }
#lancamentos footer span a:hover { background-color: var(--gold); }

/* apartamento */
#apartamento { position: relative; padding: 70px 0px; }
#apartamento::before { position: absolute; z-index: -1; top: 0px; left: 0px; width: 280px; height: 80%; background: #fff url('../img/pattern.jpg') repeat; background-size: 800px; content: ''; }
#apartamento header small { display: block; font-family: var(--fonttitle); font-size: 18px; }
#apartamento header h6 { display: block; font-family: var(--fonttitle); font-size: 60px; }
#apartamento .list { margin: 40px 0px; padding-left: 120px; }
#apartamento .list ul li { display: inline-block; width: auto; margin-right: 20px; vertical-align: top; }
#apartamento .list ul li:last-of-type { margin-right: 0px; }
#apartamento .list ul li i { display: block; margin-bottom: 7px; font-size: 24px; color: var(--gold); }
#apartamento .list ul li strong { font-weight: bold; color: var(--gold); }
#apartamento section { padding-left: 120px; }
#apartamento section p { display: block; margin-bottom: 30px; line-height: 1.8; }
#apartamento section span { display: inline-block; width: auto; padding: 10px 15px; background-color: var(--primary); color: var(--gold); font-weight: bold; }
#apartamento .gal { width: 100%; height: auto; margin: 70px 0px 30px 0px; }
#apartamento .gal li { margin: 0px 10px; }
#apartamento .gal img { width: 100%; height: 240px; object-fit: cover; }
#apartamento .gal .slick-dots { display: inline-block; width: 100%; margin-top: 40px; text-align: center; }
#apartamento .gal .slick-dots li { display: inline-block; width: 10px; height: 10px; margin: 0px 10px; border: 2px solid var(--primary); border-radius: 100%; text-indent: -9999em; cursor: pointer; }
#apartamento .gal .slick-dots li.slick-active { background-color: var(--gold); border-color: var(--gold); }
#apartamento .gal .slick-dots li:only-child { display: none; }
#apartamento .gal h6 { display: block; padding: 100px 0px 40px; font-size: 36px; font-family: var(--fonttitle); }

/* table */
.table h6 { display: block; margin-bottom: 40px; font-size: 40px; font-family: var(--fonttitle); }
.table table { display: table; width: 100%; height: auto; background-color: #fff; border-radius: 20px; overflow: hidden; border: 1px solid #eee; }
.table table th { height: 40px; padding: 0px 20px; background-color: var(--primary); color: var(--gold); text-align: left; font-family: var(--fonttitle); font-size: 12px; text-transform: uppercase; }
.table table td { height: 40px; padding: 0px 20px; }
.table table tr:nth-of-type(even) { background-color: #f3f3f3; }

/* studios */
.studios { padding: 200px 0px 70px 0px; }
.studios header h1 { display: block; margin-bottom: 20px !important; font-family: var(--fonttitle); font-size: 36px; text-align: center; }
.studios header h2 { display: block; margin-bottom: 60px !important; font-family: var(--fonttitle); font-size: 20px; text-align: center; }

/* bairros */
#bairros { padding: 200px 0px 70px 0px; }
#bairros header h1 { display: block; margin-bottom: 20px; font-family: var(--fonttitle); font-size: 36px; text-align: center; }
#bairros header p { display: block; margin-bottom: 60px; font-family: var(--fonttitle); font-size: 20px; text-align: center; }
#bairros section { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 25px; }
#bairros section article { position: relative; display: block; width: 100%; height: 300px; background-color: #000; border-radius: 10px; overflow: hidden; }
#bairros section article a { position: relative; z-index: 6; display: block; width: 100%; height: 100%; }
#bairros section article a::before { position: absolute; z-index: 2; bottom: 0px; left: 0px; width: 100%; height: 50%; background: linear-gradient(to top, #000, transparent); content: ''; }
#bairros section article img { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; object-fit: cover; }
#bairros section article h2 { position: absolute; z-index: 3; bottom: 40px; left: 0px; width: 100%; height: auto; text-align: center; font-weight: bold; font-size: 16px; color: #fff; }

    /* bairros -> single */
    #single-bairro { padding: 70px 0px; }
    #single-bairro h1,
    #single-bairro h2,
    #single-bairro h3 { display: block; margin-bottom: 30px; font-family: var(--fonttitle); font-size: 24px }
    #single-bairro p { display: block; margin-bottom: 30px; line-height: 1.8; }
    #single-bairro ul { display: block; padding-left: 30px; }
    #single-bairro ul li { position: relative; display: block; margin-bottom: 20px; line-height: 1.8; }
    #single-bairro ul li::before { position: absolute; top: 10px; left: -20px; width: 5px; height: 5px; background-color: var(--gold); content: ''; }
    #single-bairro strong { font-weight: bold; }


/* blog */
#blog { padding: 70px 0px; background: #fff url('../img/pattern.jpg') repeat; background-size: 800px; }
#blog header h6 { display: block; margin-bottom: 40px; font-family: var(--fonttitle); font-size: 48px; text-align: center; }
#blog section { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 30px; }
#blog section article figure { position: relative; display: block; width: 100%; height: 260px; margin-bottom: 20px; }
#blog section article figure img { display: block; width: 100%; height: 100%; object-fit: cover; }
#blog section article h2 { display: block; margin: 20px 0px 7px 0px; padding-right: 40px; font-family: var(--fonttitle); font-size: 20px; line-height: 1.2; color: var(--primary); }
#blog section article p { display: block; padding-right: 40px; line-height: 1.4; color: var(--primary); }

/* blog -> int */
#blog.int { background: var(--primary); }
#blog.int header h6 { color: #fff; }
#blog.int section article h2,
#blog.int section article p { color: #fff; }

/* blog -> page */
#blog.page { margin: 100px 0px 60px 0px; background: #fff; }

/* map */
#map { width: 100%; height: 400px; background-color: var(--primary); }
#map iframe { display: inline-block; width: 100%; height: 100%; }

/* form */
#form { padding: 70px 0px; background-color: var(--gold); }
#form h6 { display: block; margin-bottom: 70px; font-family: var(--fonttitle); font-size: 40px; text-align: center; }
#form form { display: block; width: 400px; height: auto; margin: 0px auto; }
#form form input { display: block; width: 100%; height: 45px; margin-bottom: 10px; padding: 0px 20px; background-color: #F6DFBD; color: var(--primary); font-weight: bold; font-size: 14px; }
#form form input::placeholder { color: var(--primary); }
#form form input[type=submit] { background-color: var(--primary); color: #fff; }
#call-form { display: block; margin-bottom: 100px; text-align: center; }
#call-form a { display: inline-block; width: auto; padding: 20px 40px; background-color: var(--primary); color: var(--gold); font-weight: bold; border-radius: 10px; }
#call-form a:hover { background-color: var(--gold); color: var(--primary); }

    /* form -> contact */
    #form.contact { margin-top: 132px; padding: 70px 0px 130px 0px; background-color: var(--primary); }
    #form.contact h6 { color: var(--gold); }
    #form.contact form { width: 680px; }
    #form.contact form input { background-color: #11233f; color: #fff; }
    #form.contact form textarea { display: block; width: 100%; height: 120px; margin-bottom: 10px; padding: 20px; background-color: #11233f; color: #fff; font-weight: bold; font-size: 14px; }
    #form.contact form ::placeholder { color: rgba(255,255,255,.3); }
    #form.contact form input[type=submit] { background-color: var(--gold); color: var(--primary); }

/* quem somos */
#quem-somos { padding-bottom: 100px; }
#quem-somos .container { display: flex; align-items: center; }
#quem-somos figure { position: relative; display: block; width: 50%; height: 480px; }
#quem-somos figure img { position: absolute; top: 0px; right: 0px; width: 50vmax; height: 100%; object-fit: cover; }
#quem-somos section { width: 50%; padding-left: 70px; }
#quem-somos section h2 { display: block; margin-bottom: 20px; padding-right: 100px; font-family: var(--fonttitle); font-size: 30px; }
#quem-somos section p { display: block; margin-bottom: 20px; line-height: 1.6; }
#quem-somos section span a { display: inline-block; margin-top: 20px; padding: 10px 20px; background-color: var(--gold); color: var(--primary); font-weight: bold; font-size: 14px; }
#quem-somos section span a i { margin-right: 15px; }
#quem-somos section span a:hover { background-color: var(--primary); color: var(--gold); }

/* footer */
#footer { padding: 70px 0px; background: #fff url('../img/pattern.jpg') repeat; background-size: 800px; text-align: center; }

/* menu */
#menu { display: none; position: fixed; z-index: 20; top: 0px; left: 0px; width: 100%; height: 100%; background-color: var(--primary); text-align: center; }
#menu span.logo img { display: block; width: 140px; height: auto; margin: 40px auto; }
#menu span.wp a { display: inline-block; margin-bottom: 40px; padding: 10px 20px; background-color: var(--gold); border: 1px solid var(--gold); color: var(--primary); font-weight: bold; font-size: 14px; }
#menu span.wp a i { margin-right: 15px; }
#menu ul li { display: block; font-size: 14px; }
#menu ul li a { display: block; padding: 10px 0px; font-weight: bold; color: #fff; }
#menu ul.social { position: absolute; bottom: 70px; left: 50%; transform: translateX(-50%); }
#menu ul.social li { display: inline-block; width: auto; margin: 0px 10px; font-size: 20px; }
#menu sup { position: absolute; top: 30px; right: 30px; color: var(--gold); font-size: 30px; cursor: pointer; }

/* float wp */
span.float-wp a { position: fixed; z-index: 9000; bottom: 30px; left: 30px; width: 50px; height: 50px; border-radius: 100%; background-color: #25d366; color: #fff; font-size: 24px; line-height: 50px; text-align: center; }

/* wpcf7 */
.wpcf7 br { display: none; }
.wpcf7-not-valid-tip { margin: -5px 0px 15px 0px; font-weight: bold !important; font-size: 12px !important; }
.wpcf7 form .wpcf7-response-output { margin: 0px !important; padding: 0px !important; border: none !important; color: var(--primary); font-weight: bold; font-size: 12px; text-align: center; }

/* load more */
.elm-button { padding: 10px 40px; border-radius: 60px; font-weight: bold; }