@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
  --base-color: #ffffff;
  --text-color: #000000;
  --primary-color: #ffc06e;
  --secondary-color: #8D8DFF;
  --color-1: #F9F6F3;
  --color-2: #F3F7F9;
  --color-3: #F6F3F9;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-family: Poppins, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  color: var(--text-color);
}

body {
  padding: 1em;
  background-color: var(--base-color);
}

h1, h2, h3 {
  font-family: Merriweather, Poppins, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

nav {
  margin: 1em auto 3em auto;
  width: min(1000px, 100%);
}

nav ul {
  display: flex;
  align-items: center;
  list-style-type: none;
  gap: 2em;
}

nav li:first-child {
  font-family: Merriweather, Poppins, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-weight: bold;
  margin-right: auto;
}

nav a {
  text-decoration: none;
  color: var(--text-color);
}

nav a:hover {
  text-decoration: underline;
}

 .admin-link {
	 color:#8D8DFF; text-decoration: none; font-weight: 700; border: 1px solid #0a66c2; padding: 5px 10px; border-radius: 15px; transition: 0.3s; }
 .admin-link:hover {
	 background:#ffc06e; color: white; }




.container-org {
 	 display: flex;
 	 justify-content: center; /* Centers horizontally */
 	 align-items: center;     /* Centers vertically */
 	 height: 90vh;           /* Full viewport height */
 	 width: 90vw;            /* Full viewport width */



 	 position: relative;
 		 /*width: 100%;*/
  	 padding: 10px;
}

.container img-org {
 	 max-width: 100%;
 	 height: auto;
}

img-org {
 	 padding: inherit;
 	 margin:auto;
 	 width: auto;
 	 display: block;
}

txt {
 	 height: 100px;
 	 line-height: 100px;
 	 text-align: center;
 	 border: 2px dashed #f69c55;
}
.text-overlay {
 	 position: absolute;
 	 top: 70%;
 	 left: 50%;
    	 transform: translate(-50%, -50%);
 	 background-color: rgba(0, 0, 0, 0.6);
 	 color: white;
 	 padding: 0px;
 	 font-size: 18px;
 	 text-align: center;
 	 margin: 0;
 	 line-height: 1.0;
}
.fixpics {
	 position: relative;
	 width: 100%;
  	 padding: 5px;
}
 .license-banner {
	 background: #fffbeb; border: 1px solid #fef3c7; color: var(--gold-license); display: inline-block; padding: 8px 20px; border-radius: 50px; font-weight: 700; font-size: 0.9rem; margin-bottom: 20px; }
 .linkedin-link {
	 color: #0a66c2; text-decoration: none; font-weight: 700; border: 1px solid #0a66c2; padding: 5px 15px; border-radius: 15px; transition: 0.3s; }
 .linkedin-link:hover {
	 background: #0a66c2; color: white; }
 .badge-tech {
	 display: inline-block;
         background-color: #e9ecef;
         color: #495057;
         padding: 0.5em 0.7em;
         margin: 0.2em;
         border-radius: 0.25rem;
         font-weight: normal;
         height : auto;
 }
 .skill-card {
         height: auto;
         border: 1px solid #dee2e6;
         border-radius: 0.5rem;
         box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
 }
section {
  padding: 3em min(2em, 15%);
  background-color: var(--color-2);
  text-align: center;
}
section p {
  margin-top: 1em;
  font-size: 1.25rem;
}

section:nth-child(3){
  background-color: var(--color-3);
}

header, section {
  margin: 2em auto;
  width: min(75em, 100%);
  background-color: var(--color-1);
  padding: min(2em, 15%);
  border-radius: 1em;
}

@media(max-width: 988px){
  header {
    text-align: center;
  }
  nav ul {
  display: flex;
  flex-direction:column; /* default, but explicitly set for clarity */
}
  header .text-container {
    padding-top: 0;
  }
}
ul {
  /* This is the default, but explicitly setting it ensures consistency */
  text-align: left;
  /* Optional: removes default browser padding and margin for a "hard left" alignment */
  padding: 0;
  margin: 0;
}

li {
  /* This is also the default */
  text-align: left;
}


@media(max-width: 600px) {


  header {
    margin-top: 0;
  }

  .cta-button {
    margin-top: .5em;
    width: 100%;
  }

  .grid-container {
    display: flex;
    flex-direction: column;
  }

  .text-container p {
    font-size: 1rem;
  }

  h2 {
    font-size: 1.5rem;
  }
nav ul {
  display: flex;
  flex-direction:column; /* default, but explicitly set for clarity */
}


}