@font-face { font-family: 'icomoon'; src: url("../fonts/icomoon/icomoon.eot?srf3rx"); src: url("../fonts/icomoon/icomoon.eot?srf3rx#iefix") format("embedded-opentype"), url("../fonts/icomoon/icomoon.ttf?srf3rx") format("truetype"), url("../fonts/icomoon/icomoon.woff?srf3rx") format("woff"), url("../fonts/icomoon/icomoon.svg?srf3rx#icomoon") format("svg"); font-weight: normal; font-style: normal; }

html { overflow: -moz-scrollbars-none; -ms-overflow-style: none; scrollbar-width: none; }
::-webkit-scrollbar { display: none; }

body { font-family: "Source Sans Pro", Arial, sans-serif; font-weight: 300; font-size: 20px; line-height: 1.5; color: #e6edf3; color: rgba(230, 237, 243, 0.9); background: #0d1117; height: 100%; position: relative; background-size: cover; background-attachment: fixed; background-repeat: no-repeat; background-position: center center; opacity: 0; transition: background-image 1s ease-in-out; }
@media screen and (max-width: 800px) { body { background-position: center center; background-repeat: no-repeat; } }

a { color: #58a6ff; -webkit-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
a:hover, a:active, a:focus { color: #79b8ff; outline: none; text-decoration: none; }

p { margin-bottom: 1.5em; }

h1, h2, h3, h4, h5, h6 { color: #e6edf3; font-family: "Source Sans Pro", Arial, sans-serif; font-weight: 400; margin: 0 0 30px 0; }

::-webkit-selection { color: #fff; background: #58a6ff; }
::-moz-selection { color: #fff; background: #58a6ff; }
::selection { color: #fff; background: #58a6ff; }

#back { position: relative; top: 0; bottom: 0; left: 0; right: 0; z-index: -100; }

#fh5co-main { max-width: 1000px; min-height: 600px; margin: 5em auto 5em auto; position: relative; background: rgba(22, 27, 34, 0.95); overflow: hidden; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -webkit-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
@media screen and (max-width: 800px) { #fh5co-main { margin: 2em .5em 5em .5em; } }

#fh5co-header .display-tc h1, .fh5co-cover .display-tc h1 { font-family: "Kaushan Script", cursive; margin-bottom: 30px; font-size: 50px; line-height: 1.3; font-weight: 300; -webkit-transform: rotate(-5deg); transform: rotate(-5deg); }
#fh5co-header .display-tc h1 span, .fh5co-cover .display-tc h1 span { padding: 4px 15px; position: relative; }

.fh5co-tab-wrap { position: relative; }
.fh5co-tab-wrap .fh5co-tab-menu { list-style: none; text-align: center; margin-bottom: 2em; position: relative; top: -.5em; padding: 0; margin: 0; }
@media screen and (max-width: 800px) { .fh5co-tab-wrap .fh5co-tab-menu { top: -7px; } }
.fh5co-tab-wrap .fh5co-tab-menu li { display: inline-block; text-align: center; padding: 0; margin: 0; }
.fh5co-tab-wrap .fh5co-tab-menu li a { padding: 2em 1em 1em 1em; position: relative; color: rgba(230, 237, 243, 0.6); z-index: 10; display: inline-block; -webkit-transition: 0.3s; transition: 0.3s; }
.fh5co-tab-wrap .fh5co-tab-menu li a .icon { display: block; position: relative; font-size: 22px; bottom: 0; -webkit-transition: 0.3s; transition: 0.3s; }
.fh5co-tab-wrap .fh5co-tab-menu li a .menu-text { display: block; -webkit-transition: 0.5s; transition: 0.5s; }
@media screen and (max-width: 800px) { .fh5co-tab-wrap .fh5co-tab-menu li a .menu-text { display: none; } }
@media screen and (max-width: 800px) { .fh5co-tab-wrap .fh5co-tab-menu li a { padding: 1em .5em .5em .5em; } }
.fh5co-tab-wrap .fh5co-tab-menu li a:after { position: absolute; content: ""; height: 0; background: #58a6ff; z-index: -1; top: 0; left: 0; width: 100%; -webkit-transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275); transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275); -webkit-border-radius: 7px; border-radius: 7px; }
.fh5co-tab-wrap .fh5co-tab-menu li a:hover { color: #fff; text-decoration: none; }
.fh5co-tab-wrap .fh5co-tab-menu li a:hover .icon { bottom: 10px; }
@media screen and (max-width: 800px) { .fh5co-tab-wrap .fh5co-tab-menu li a:hover .icon { bottom: 0px; } }
.fh5co-tab-wrap .fh5co-tab-menu li a:hover:after { height: 100%; }
.fh5co-tab-wrap .fh5co-tab-menu li.active .icon { bottom: 10px; }
@media screen and (max-width: 800px) { .fh5co-tab-wrap .fh5co-tab-menu li.active .icon { bottom: 0px; } }
.fh5co-tab-wrap .fh5co-tab-menu li.active > a { color: #fff; text-decoration: none; }
.fh5co-tab-wrap .fh5co-tab-menu li.active > a:after { height: 100%; }
.fh5co-tab-wrap .fh5co-tab-content { padding-left: 4em; padding-right: 4em; position: absolute; top: 0; opacity: 0; visibility: hidden; width: 100%; }
@media screen and (max-width: 800px) { .fh5co-tab-wrap .fh5co-tab-content { padding-left: .5em; padding-right: .5em; } }
.fh5co-tab-wrap .fh5co-tab-content.active { opacity: 1; visibility: visible; }
.fh5co-tab-wrap .fh5co-tab-content .fh5co-content-inner { padding: 7em 2em 5em 2em; float: left; width: 100%; position: relative; }
@media screen and (max-width: 800px) { .fh5co-tab-wrap .fh5co-tab-content .fh5co-content-inner { padding: 4em .5em 5em .5em; } }

figure { margin-bottom: 1.5em; }

/* FIXED: Smaller KPI numbers */
.fh5co-counter .fh5co-number { font-size: 48px; color: #58a6ff; font-weight: 600; margin: 0; padding: 0; line-height: 1; }
.fh5co-counter .fh5co-number.fh5co-left { float: left; width: 20%; }
@media screen and (max-width: 800px) { .fh5co-counter .fh5co-number.fh5co-left { width: 100%; line-height: 1.2; text-align: center; margin-bottom: 10px; } }
.fh5co-counter .fh5co-text { float: right; text-align: left; width: 75%; }
@media screen and (max-width: 800px) { .fh5co-counter .fh5co-text { width: 100%; text-align: center; } }
.fh5co-counter .fh5co-text h3 { margin: 0; padding: 0; position: relative; font-size: 18px; }

.fh5co-inicio { padding: 0; margin: 0; text-align: right; }
.fh5co-inicio li { padding: 0; margin: 0; font-size: 40px; list-style: none; display: inline-block; }

.fh5co-social { padding: 0; margin: 0; text-align: center; }
.fh5co-social li { padding: 0; margin: 0; list-style: none; display: inline-block; }
.fh5co-social li a { font-size: 22px; color: #e6edf3; padding: 10px 20px; display: inline-block; -webkit-border-radius: 7px; border-radius: 7px; }
@media screen and (max-width: 800px) { .fh5co-social li a { padding: 10px 8px; } }
.fh5co-social li a:hover { color: #58a6ff; }

.fh5co-feature { text-align: left; width: 100%; float: left; margin-bottom: 20px; }
.fh5co-feature .fh5co-icon { float: left; width: 10%; display: block; margin-top: 5px; }
.fh5co-feature .fh5co-icon i { color: #58a6ff; font-size: 40px; }
.fh5co-feature .fh5co-icon img { width: 50px; height: 50px; object-fit: contain; border-radius: 8px; }
.fh5co-feature .fh5co-text { float: right; width: 85%; }
@media screen and (max-width: 800px) { .fh5co-feature .fh5co-text { width: 80%; } }
@media screen and (max-width: 480px) { .fh5co-feature .fh5co-text { width: 72%; } }
.fh5co-feature .fh5co-text h2, .fh5co-feature .fh5co-text h3 { margin: 0; padding: 0; }
.fh5co-feature .fh5co-text h3 { font-weight: 300; margin-bottom: 10px; color: rgba(230, 237, 243, 0.9); font-size: 20px; }
.fh5co-feature .fh5co-text h2 { font-size: 16px; letter-spacing: 2px; font-weight: bold; text-transform: uppercase; }

.chart { width: 160px; height: 160px; margin: 0 auto 30px auto; position: relative; text-align: center; }
.chart span { position: absolute; top: 50%; left: 0; margin-top: -30px; width: 100%; }
.chart span strong { display: block; }
.chart canvas { position: absolute; left: 0; top: 0; }

#fh5co-footer { margin-top: 50px; background: #161b22; clear: both; color: rgba(230, 237, 243, 0.6); font-size: 14px; position: absolute; bottom: 0; width: 100%; padding: 20px 20px; line-height: 1.2; }
#fh5co-footer small { font-size: 14px; }
#fh5co-footer .fh5co-author { display: block; }
@media screen and (max-width: 800px) { #fh5co-footer .fh5co-author { display: inline-block; } }

@media screen and (max-width: 480px) { .col-xxs-12 { float: none; width: 100%; } }

.row-bottom-padded-lg { padding-bottom: 7em; }
@media screen and (max-width: 800px) { .row-bottom-padded-lg { padding-bottom: 1em; } }
.row-bottom-padded-md { padding-bottom: 4em; }
@media screen and (max-width: 800px) { .row-bottom-padded-md { padding-bottom: 1em; } }
.row-bottom-padded-sm { padding-bottom: 1em; }

#cf { position: relative; height: 200px; width: 180px; margin: 0 auto; }
#cf img.bottom { opacity: 0; }
#cf img { position: absolute; left: 0; -webkit-transition: opacity 1s ease-in-out; transition: opacity 1s ease-in-out; }
#cf img.opaque { opacity: 1; }
#cf img.transparent { opacity: 0; }
#cf_onclick { cursor: pointer; }

#myBG, #myBMW, #enlace { border-radius: 5px; cursor: pointer; transition: 0.3s; }
#myBG:hover, #myBMW:hover, #enlace:hover { opacity: 0.7; }

span.icons { color: #e6edf3 }
span.lighttext { color: #58a6ff; }

/* Scroll Indicator */
.header { position: fixed; top: 0; z-index: 1; width: 100%; background-color: #161b22; }
.progress-container { width: 100%; height: 8px; background: #30363d; }
.progress-bar { height: 8px; background: #58a6ff; width: 0%; }

/* Shake Avatar */
#Avatar:hover { animation: shake 0.5s; animation-iteration-count: infinite; }
@keyframes shake { 0% { transform: translate(1px, 1px) rotate(0deg); } 10% { transform: translate(-1px, -2px) rotate(-1deg); } 20% { transform: translate(-3px, 0px) rotate(1deg); } 30% { transform: translate(3px, 2px) rotate(0deg); } 40% { transform: translate(1px, -1px) rotate(1deg); } 50% { transform: translate(-1px, 2px) rotate(-1deg); } 60% { transform: translate(-3px, 1px) rotate(0deg); } 70% { transform: translate(3px, 1px) rotate(-1deg); } 80% { transform: translate(-1px, -1px) rotate(1deg); } 90% { transform: translate(1px, 2px) rotate(0deg); } 100% { transform: translate(1px, -2px) rotate(-1deg); } }

/* Toggle Switch */
div.toggle { position: fixed; bottom: 15px; right: 15px; }
.switch { position: relative; display: inline-block; width: 30px; height: 17px; }
.switch input { opacity: 0; width: 0; height: 0; }
.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #58a6ff; -webkit-transition: .4s; transition: .4s; }
.slider:before { position: absolute; content: ""; height: 13px; width: 13px; left: 2px; bottom: 2px; background-color: #0d1117; -webkit-transition: .4s; transition: .4s; }
input:checked + .slider { background-color: #79b8ff; }
input:checked + .slider:before { -webkit-transform: translateX(13px); transform: translateX(13px); }
.slider.round { border-radius: 17px; }
.slider.round:before { border-radius: 50%; }

/* Snackbar */
#snackbar { visibility: hidden; min-width: 256px; margin-left: -132px; background-color: #161b22; color: #e6edf3; text-align: center; font-size: 14px; border-radius: 7px; padding: 16px; position: fixed; z-index: 1; left: 50%; bottom: 30px; }
#snackbar.show { visibility: visible; -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s; animation: fadein 0.5s, fadeout 0.5s 2.5s; }
@keyframes fadein { from { bottom: 0; opacity: 0; } to { bottom: 30px; opacity: 1; } }
@keyframes fadeout { from { bottom: 30px; opacity: 1; } to { bottom: 0; opacity: 0; } }

/* Company/University Logo styling */
.logo-icon { width: 50px; height: 50px; object-fit: contain; border-radius: 8px; background: #21262d; padding: 5px; box-shadow: 0 2px 4px rgba(0,0,0,0.3); }

/* Links section buttons */
.link-btn { display: inline-flex; align-items: center; gap: 10px; padding: 15px 25px; margin: 10px; background: #58a6ff; color: #0d1117; border-radius: 30px; font-size: 16px; font-weight: 500; transition: all 0.3s ease; text-decoration: none; }
.link-btn:hover { background: #79b8ff; color: #0d1117; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(88,166,255,0.3); text-decoration: none; }
.link-btn i { font-size: 20px; }

/* City indicator */
.city-indicator { position: fixed; bottom: 15px; left: 15px; background: rgba(22,27,34,0.8); color: #e6edf3; padding: 8px 15px; border-radius: 20px; font-size: 13px; z-index: 100; backdrop-filter: blur(5px); transition: opacity 0.5s ease; }
.city-indicator i { margin-right: 5px; color: #58a6ff; }

/* Sync Status Indicator */
.sync-status { position: fixed; top: 15px; left: 15px; background: rgba(22,27,34,0.95); padding: 10px 15px; border-radius: 10px; font-size: 12px; z-index: 1000; box-shadow: 0 2px 10px rgba(0,0,0,0.3); line-height: 1.6; }
.sync-status .sync-item { display: flex; align-items: center; gap: 8px; }
.sync-status .sync-item i { width: 16px; color: #58a6ff; }
.sync-status .sync-label { color: #8b949e; }
.sync-status .sync-value { color: #e6edf3; font-weight: 500; }
.sync-status .sync-source { background: #1f3a5f; color: #58a6ff; padding: 2px 8px; border-radius: 10px; font-size: 10px; margin-left: 5px; }

/* Icon-only link buttons */
.icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 60px; height: 60px; margin: 10px; background: #58a6ff; color: #0d1117; border-radius: 50%; font-size: 24px; transition: all 0.3s ease; text-decoration: none; box-shadow: 0 4px 15px rgba(88,166,255,0.3); }
.icon-btn:hover { background: #79b8ff; color: #0d1117; transform: translateY(-3px) scale(1.1); box-shadow: 0 6px 20px rgba(88,166,255,0.4); text-decoration: none; }
.icon-btn-label { display: block; font-size: 12px; color: #8b949e; margin-top: 5px; }
.icon-btn-wrapper { display: inline-block; text-align: center; margin: 10px 20px; }

/* Logo with fallback styling */
.logo-icon { width: 50px; height: 50px; object-fit: contain; border-radius: 8px; background: #21262d; padding: 5px; box-shadow: 0 2px 4px rgba(0,0,0,0.3); }
.logo-icon.loading { background: linear-gradient(90deg, #21262d 25%, #30363d 50%, #21262d 75%); background-size: 200% 100%; animation: shimmer 1.5s infinite; }
@keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }

/* Icon font override - Use Font Awesome */
[class^="icon-"], [class*=" icon-"] {
    font-family: 'FontAwesome' !important;
}
.icon-user:before { content: "\f007"; }
.icon-graduation-cap:before { content: "\f19d"; }
.icon-briefcase:before { content: "\f0b1"; }
.icon-code:before { content: "\f121"; }
.icon-trophy:before { content: "\f091"; }
.icon-envelope:before { content: "\f0e0"; }
.icon-qrcode:before { content: "\f029"; }
.icon-linkedin:before { content: "\f0e1"; }
.icon-phone:before { content: "\f095"; }
.icon-arrow-up:before { content: "\f062"; }
.icon-globe:before { content: "\f0ac"; }
.icon-check:before { content: "\f00c"; }
.icon-cog:before { content: "\f013"; }
.icon-paper-plane:before { content: "\f1d8"; }
.icon-file-pdf-o:before { content: "\f1c1"; }
.icon-users:before { content: "\f0c0"; }
.icon-cloud:before { content: "\f0c2"; }
.icon-flash:before { content: "\f0e7"; }
.icon-star:before { content: "\f005"; }
.icon-creative-commons:before { content: "\f25e"; }
.icon-desktop:before { content: "\f108"; }
.icon-laptop:before { content: "\f109"; }
.icon-tablet:before { content: "\f10a"; }
.icon-mobile:before { content: "\f10b"; }
.icon-adjust:before { content: "\f042"; }
.icon-home:before { content: "\f015"; }
.icon-map-marker:before { content: "\f041"; }

/* Footer Group Links */
.footer-group-links { margin-top: 15px; padding-top: 15px; border-top: 1px solid rgba(255,255,255,0.1); }
.footer-group-links .group-label { color: #8b949e; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; margin-right: 10px; }
.footer-group-links .group-link { display: inline-flex; align-items: center; gap: 6px; margin: 5px 15px; padding: 8px 16px; background: linear-gradient(135deg, #58a6ff 0%, #388bfd 100%); color: #0d1117; border-radius: 20px; text-decoration: none; font-size: 12px; font-weight: 500; transition: all 0.3s ease; box-shadow: 0 2px 8px rgba(88,166,255,0.3); }
.footer-group-links .group-link:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(88,166,255,0.4); color: #0d1117; text-decoration: none; }
.footer-group-links .group-link i { font-size: 14px; }

/* Click Counter */
.click-counter { font-size: 10px; color: #6e7681; margin-left: 5px; }
