/*** uncss> filename: C:/Users/fabricio/Desktop/Monk Holding f/Sitio web/assets/css/main.css ***/
@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,300italic,600,600italic,700");
@import url("fontawesome-all.min.css");

/*
Monk Holding 2025 fafrito
*/

html, body, div, span, h2, h3, h4, p, a, img, center, ul, li, article, header, nav, section {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;}

article, header, nav, section {
	display: block;}

body {
	line-height: 1;
}

ul {
	list-style: none;
}

body {
	-webkit-text-size-adjust: none;
}

/* Basic */

	html {
		box-sizing: border-box;
	}

	*, *:before, *:after {
		box-sizing: inherit;
	}

	body {
		padding-top: 3.5em;
	}

	body {
		font-family: 'Open Sans', sans-serif;
		line-height: 1.85em;
		color: #888;
		font-weight: 300;
		font-size: 13pt;
	}

	a {
		-moz-transition: color .2s ease-in-out;
		-webkit-transition: color .2s ease-in-out;
		-ms-transition: color .2s ease-in-out;
		transition: color .2s ease-in-out;
		color: #121212;
		text-decoration: underline;
	}

		a:hover {
			color: #ffffff !important;
		}
    
    @font-face {
		font-family: 'bison';
		src: url('assets/webfonts/bison.ttf') format('truetype');
	}
	
    #top img {
    width: 400px;   /* tamaño por defecto (celular) */
    max-width: 100%; /* evita que se desborde en pantallas chicas */
    }

    @media (min-width: 1024px) {
    #top img {
    width: 650px; /* tamaño para pantallas grandes */
    }
     }


	h2, h3, h4 {
		color: #121212;
		margin: 0 0 0.75em 0;
	}

	h2, h3, h4 {
		font-weight: 700;
	}

	h2 {
		font-size: 2em;
		letter-spacing: -0.015em;
	}

	h3 {
		font-size: 1.5em;
		letter-spacing: -0.015em;
	}

	p, ul {
		margin-bottom: 2em;
	}

	header {
		margin: 0 0 3em 0;
	}

/* Container */

	.container {
		margin: 0 auto;
		max-width: calc(100% - 50px);
		width: 1200px;
	}

		@media screen and (max-width: 1680px) {

			.container {
				width: 1200px;
			}

		}

		@media screen and (max-width: 1280px) {

			.container {
				width: 960px;
			}

		}

		@media screen and (max-width: 980px) {

			.container {
				width: 100%;
			}

		}

		@media screen and (max-width: 736px) {

			.container {
				width: 100%;
				max-width: calc(100% - 30px);
			}

		}

/* Row */

/* Form */

/* Tables */

/* Section/Article */

	section, article {
		margin-bottom: 3em;
	}

	section > :last-child,
	article > :last-child {
		margin-bottom: 0;
	}

/* Image */

/* Estilo por defecto para la imagen */

/* Media query para dispositivos con un ancho de pantalla menor a 600px */

/* Button */

.button {
	-webkit-appearance: none;
	display: inline-block;
	text-decoration: none;
	cursor: pointer;
	border: 0;
	border-radius: 0px;
	background: #121212;
	color: #fff !important;
	font-weight: 700;
	outline: 0;
	font-size: 1.1em;
	padding: 0.65em 1.5em 0.65em 1.5em;
	text-align: center;
	-moz-transition: background-color .25s ease-in-out;
	-webkit-transition: background-color .25s ease-in-out;
	-ms-transition: background-color .25s ease-in-out;
	transition: background-color .25s ease-in-out;
}

	.button:hover {
		background: #740820;
	}

	.button:active {
		background: #f8f8f8;
	}

	.button.large {
		font-size: 1.5em;
		padding: 0.75em 1.5em 0.75em 1.5em;
	}

/* Copyright */

#copyright {
	text-align: center;
	margin: 0em 0 0em 0;
}

	#copyright ul.links {
		display: inline-block;
		background: #2C2929;
		background: rgba(255, 255, 255, 0.05);
		border-radius: 5px;
		margin: 0;
		padding: 0.85em 2.25em 0.85em 2.25em;
	}



	ul {
		list-style: disc;
		padding-left: 1em;
	}

		ul li {
			padding-left: 0.5em;
		}



	.wrapper {
		background-image: url("images/bg.png");
		/*box-shadow: inset 0px 1px 0px 0px rgba(0, 0, 0, 0.05), inset 0px 2px 3px 0px rgba(0, 0, 0, 0.1);*/
		padding: 1em 0 2em 0;
		text-align: center;
	}

		.wrapper.style1 {
			background-image: none;
			background-color: #fff;
		}

		.wrapper.style4 {
			background-color: #121212;
			color: #999;
			text-shadow: -1px -1px 0px #181818;
		}

/* Nav */

	#nav {
		background-color: #121212;
		text-align: center;
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		z-index: 10000;
		cursor: default;
		height: 62px;
		line-height: 57px;
	}

		#nav ul {
			margin-bottom: 0;
			list-style: none;
			padding-left: 0;
		}

/* Articles */

	body > article {
		margin-bottom: 0;
	}

	#top {
		padding: 10em 0 4em 0;
		text-align: left;
	}

/* Copyright */

	#copyright {
		color: #666;
		font-size: 1em;
		line-height: 1em;
		list-style: none;
		padding-left: 0;
		margin-bottom: 0;
	}

		#copyright li {
			display: inline-block;
			border-left: solid 1px rgba(0, 0, 0, 0.5);
			box-shadow: -1px 0px 0px 0px rgba(255, 255, 255, 0.1);
			padding: 0 0 0 1em;
			margin: 0 0 0 1em;
		}

			#copyright li:first-child {
				border: 0;
				box-shadow: none;
				padding-left: 0;
				margin-left: 0;
			}

/* Large */

	@media screen and (max-width: 1280px) {

		/* Basic */

			body {
				font-size: 11pt;
			}

			header {
				margin: 0 0 4em 0;
			}

		/* Wrappers */

			.wrapper {
				padding: 2em 0 5em 0;
				text-align: center;
			}

		/* Articles */

			#top {
				padding: 8em 0;
			}

	}

/* Medium */

	@media screen and (max-width: 980px) {

		/* Articles */

			#top {
				text-align: center;
				padding: 3em 0;
			}

	}

/* Small */

	@media screen and (max-width: 736px) {

		/* Basic */

			body {
				padding-top: 44px;
			}

			body {
				line-height: 1.75em;
				font-size: 10pt;
				letter-spacing: 0;
			}

			h2, h3, h4 {
				font-size: 1.25em;
				margin: 0 0 0.4em 0;
			}

			header {
				margin: 0 0 2em 0;
			}

		/* Section/Article */

			section, article {
				clear: both;
			}

		/* Button */

			.button {
				text-align: center;
				font-size: 1.2em;
				width: 100%;
				padding: 1em 0 1em 0;
			}

				.button.large {
					font-size: 1.2em;
					letter-spacing: 0;
				}

		/* Actions */

		/* Box */

		/* Wrappers */

			.wrapper {
				padding: 3em 0;
				text-align: center;
			}

		/* Nav */

			#nav {
				height: 57px;
				line-height: 57px;
			}

		/* Articles */

			#top {
				padding: 3em 0;
			}

		/* Copyright */

			#copyright {
				font-size: 1em;
				margin: 0;
			}

				#copyright li {
					display: block;
					margin: 1em 0 0 0;
					padding: 0;
					box-shadow: none;
					border-left: 0;
				}

					#copyright li:first-child {
						margin-top: 0;
					}

	}
	section {
		flex: 1; /* Cada sección tomará un espacio igual */
		margin: 10px; /* Espaciado entre secciones */
		min-width: 250px; /* Ancho mínimo para cada sección */
	}

	/* Hacer la imagen responsiva */

/* ===== MONKHOLDING - SERVICES SECTION ===== */

.services {
  padding: 55px 10%;
  background: #f8f9fb;
  font-family: 'Inter', sans-serif;
}

.services .services-header {
  text-align: center;
  margin-bottom: 60px;
}

.services .section-tag {
  font-size: 12px;
  letter-spacing: 2px;
  color: #888;
}

.services .services-header h2 {
  font-size: 42px;
  margin: 10px 0;
  font-weight: 600;
  color: #111;
}

.services .services-header p {
  color: #666;
  font-size: 16px;
}

.services .services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 40px;
}

.services .service-card {
  background: #ffffff;
  padding: 40px;
  border-radius: 16px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.04);
  transition: all 0.3s ease;
  border: 1px solid #eee;
}

.services .service-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
}

.services .service-card h3 {
  font-size: 22px;
  margin-bottom: 10px;
  font-weight: 600;
  color: #111;
}

.services .service-sub {
  font-size: 14px;
  color: #777;
  margin-bottom: 20px;
}

.services .service-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.services .service-card ul li {
  margin-bottom: 10px;
  font-size: 14px;
  color: #444;
  position: relative;
  padding-left: 20px;
}

.services .service-card ul li::before {
  content: "";
  width: 6px;
  height: 6px;
  background: #111;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 7px;
}

/* ===== MONKHOLDING ABOUT ===== */

.about-monk{
  padding:40px 10%;
  background:#ffffff;
  font-family:'Inter', sans-serif;
}

.about-monk .about-box{
  max-width:700px;
  margin:auto;
  text-align:center;
}

.about-monk .about-tag{
  font-size:12px;
  letter-spacing:2px;
  color:#888;
}

.about-monk h2{
  font-size:36px;
  margin:10px 0 20px 0;
  font-weight:600;
  color:#111;
}

.about-monk .about-text{
  font-size:16px;
  color:#555;
  line-height:1.6;
  margin-bottom:30px;
}

.about-monk .about-contact{
  font-size:14px;
  color:#333;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.services{
padding-bottom:40px;
}

.about-monk{
padding-top:40px;
}