impercar.com.ar
https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swaphttps://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.csshttps://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.csshttps://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css:root {
--primary-color: #E63946;
--secondary-color: #1D3557;
--accent-color: #F1C40F;
--dark-color: #2C3E50;
--light-color: #F8F9FA;
--success-color: #2ECC71;
--info-color: #3498DB;
--warning-color: #E67E22;
}
body {
font-family: 'Montserrat', sans-serif;
scroll-behavior: smooth;
background-color: var(--light-color);
color: var(--dark-color);
overflow-x: hidden;
}
h1, h2, h3, h4, h5, .display-1, .display-2, .display-3, .display-4 {
font-family: 'Playfair Display', serif;
font-weight: 600;
}
/* Navbar */
.navbar {
background-color: rgba(29, 53, 87, 0.95);
backdrop-filter: blur(10px);
box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
padding: 15px 0;
transition: all 0.3s ease;
}
.navbar.scrolled {
padding: 10px 0;
background-color: rgba(29, 53, 87, 0.98);
}
.navbar-brand {
font-size: 1.8rem;
font-weight: 700;
letter-spacing: 1px;
}
.navbar-brand span {
color: var(--primary-color);
}
.nav-link {
font-weight: 500;
margin: 0 8px;
padding: 8px 15px !important;
border-radius: 50px;
transition: all 0.3s ease;
}
.nav-link:hover, .nav-link.active {
background-color: var(--primary-color);
color: white !important;
}
.navbar-toggler {
border: none;
padding: 0.5rem;
}
.navbar-toggler:focus {
box-shadow: none;
}
.navbar-toggler-icon {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
/* Botones flotantes */
.btn-wpp, .btn-ig {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 9999;
display: flex;
align-items: center;
justify-content: center;
width: 55px;
height: 55px;
border-radius: 50%;
color: white;
font-size: 24px;
text-decoration: none;
box-shadow: 0 4px 12px rgba(0,0,0,0.2);
transition: all 0.3s ease;
}
.btn-wpp {
background-color: #25D366;
margin-bottom: 70px; /* espacio con el ig */
}
.btn-ig {
background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}
.btn-wpp:hover, .btn-ig:hover {
transform: scale(1.1);
}
/* Hero Section */
.hero {
background: url('img/3.png') no-repeat center center / cover;
background-color: #1D3557;
color: white;
padding: 500px 0 150px;
text-align: center;
position: relative;
overflow: hidden;
}
.hero::before {
content: '';
position: absolute;
bottom: -50px;
left: 0;
width: 100%;
height: 100px;
background: var(--light-color);
transform: skewY(0deg);
z-index: 1;
}
.hero h1 {
font-size: 3.5rem;
margin-bottom: 20px;
text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
animation: fadeInUp 1s ease;
}
.hero p {
font-size: 1.3rem;
margin-bottom: 30px;
max-width: 700px;
margin-left: auto;
margin-right: auto;
animation: fadeInUp 1s ease 0.2s both;
}
.hero-buttons {
animation: fadeInUp 1s ease 0.4s both;
}
/* Section Titles */
.section-title {
position: relative;
display: inline-block;
margin-bottom: 50px;
color: var(--secondary-color);
}
.section-title::after {
content: '';
position: absolute;
bottom: -15px;
left: 50%;
transform: translateX(-50%);
width: 80px;
height: 4px;
background: var(--primary-color);
border-radius: 2px;
}
/* About Section */
.about-section {
padding: 100px 0;
position: relative;
}
.icon-box {
text-align: center;
padding: 40px 20px;
border-radius: 10px;
background: white;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
transition: all 0.3s ease;
height: 100%;
}
.icon-box:hover {
transform: translateY(-10px);
box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
}
.icon-box i {
font-size: 50px;
color: var(--primary-color);
margin-bottom: 20px;
background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
}
.icon-box h5 {
font-weight: 600;
margin-bottom: 15px;
color: var(--secondary-color);
}
/* Gallery Section */
.gallery-section {
padding: 80px 0;
background-color: #f5f7fa;
position: relative;
}
.gallery-section::before {
content: '';
position: absolute;
top: -50px;
left: 0;
width: 100%;
height: 100px;
background: var(--light-color);
transform: skewY(3deg);
z-index: 1;
}
.carousel {
border-radius: 15px;
overflow: hidden;
box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
}
.carousel img {
height: 500px;
object-fit: cover;
}
.carousel-control-prev, .carousel-control-next {
width: 50px;
height: 50px;
background-color: rgba(0, 0, 0, 0.3);
border-radius: 50%;
top: 50%;
transform: translateY(-50%);
opacity: 0;
transition: all 0.3s ease;
}
.carousel:hover .carousel-control-prev,
.carousel:hover .carousel-control-next {
opacity: 1;
}
/* Products Section */
.products-section {
padding: 100px 0;
background: white;
}
.product-category {
margin-bottom: 50px;
}
.product-category h4 {
position: relative;
padding-bottom: 15px;
margin-bottom: 30px;
color: var(--secondary-color);
}
.product-category h4::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 50px;
height: 3px;
background: var(--primary-color);
}
.product-card {
border: none;
border-radius: 10px;
padding: 30px 20px;
text-align: center;
margin-bottom: 30px;
background: white;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
transition: all 0.3s ease;
height: 100%;
position: relative;
overflow: hidden;
}
.product-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 5px;
height: 100%;
background: var(--primary-color);
transition: all 0.3s ease;
}
.product-card:hover {
transform: translateY(-10px);
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
}
.product-card:hover::before {
width: 100%;
opacity: 0.1;
}
.product-card h5 {
font-weight: 600;
margin-bottom: 10px;
color: var(--secondary-color);
}
.product-card .price {
font-weight: 700;
color: var(--primary-color);
font-size: 1.2rem;
}
/* FAQ Section */
.faq-section {
padding: 100px 0;
background: linear-gradient(135deg, #f5f7fa 0%, #e4e8ed 100%);
position: relative;
}
.faq-section::before {
content: '';
position: absolute;
top: -50px;
left: 0;
width: 100%;
height: 100px;
background: white;
/* ...cortado... */
/* Desktop / default */
#ticker-imagenes {
--img-height: 400px;
}
/* Tablets */
@media (max-width: 768px) {
#ticker-imagenes {
--img-height: 40vw; /* antes 150px */
}
}
/* Phones */
@media (max-width: 480px) {
#ticker-imagenes {
--img-height: 55vw; /* antes 120px -> ahora más grande */
}
}
#ticker-imagenes {
--img-height: 400px; /* 🛠️ Cambiá este valor para ajustar el tamaño de las imágenes */
overflow: hidden;
position: relative;
}
.ticker-track {
display: flex;
width: max-content;
animation: tickerScroll 30s linear infinite;
}
.ticker-track img {
height: var(--img-height);
width: auto;
margin-right: 20px;
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
object-fit: cover;
}
@keyframes tickerScroll {
0% { transform: translateX(0); }
100% { transform: translateX(-50%); }
}
}
/* ===== Config rápida ===== */
:root{
--vv-gap: 24px;
--vv-radius: 12px; /* Reducido el radio de las esquinas */
--vv-shadow: 0 12px 20px -10px rgba(0,0,0,.3); /* Sombra más sutil */
--vv-overlay-strength: .35;
--vv-overlay-speed: 7s;
--vv-border: 1px; /* Borde más delgado */
--vv-max-width: 300px; /* Ancho máximo para los videos */
}
/* ===== Layout ===== */
#videos-verticales.vv-section{
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--vv-max-width)), 1fr));
gap: var(--vv-gap);
padding: clamp(16px, 4vw, 32px);
background: #ffffff; /* Cambiado a blanco (puedes usar transparent si lo prefieres) */
justify-content: center; /* Centra las tarjetas */
max-width: 1200px; /* Ancho máximo de la sección */
margin: 0 auto; /* Centrar la sección */
}
.vv-card{
position: relative;
aspect-ratio: 9 / 16;
border-radius: var(--vv-radius);
overflow: hidden;
box-shadow: var(--vv-shadow);
isolation: isolate;
background: #111;
width: 100%;
max-width: var(--vv-max-width);
margin: 0 auto; /* Centrar la tarjeta */
}
/* Borde animado (opcional) */
.vv-card::before{
content:"";
position:absolute;
inset: calc(-1 * var(--vv-border));
border-radius: inherit;
background: linear-gradient(130deg,#6d28d9,#3b82f6,#ec4899,#6d28d9);
background-size: 300% 300%;
animation: vvBorder var(--vv-overlay-speed) linear infinite;
z-index:-1;
}
@keyframes vvBorder{
0%{ background-position: 0% 50%; }
100%{ background-position: 100% 50%; }
}
/* Video */
.vv-card video{
width:100%;
height:100%;
object-fit: cover;
display:block;
filter: contrast(1.05) saturate(1.05) brightness(.98);
}
/* Overlay animado que "maquilla" el video */
.vv-card::after{
content:"";
position:absolute;
inset:0;
border-radius: inherit;
background:
linear-gradient(to top, rgba(0,0,0,.5), transparent 25%, transparent 75%, rgba(0,0,0,.5)),
linear-gradient(120deg,
rgba(255,255,255,.06) 0%,
rgba(0,0,0,var(--vv-overlay-strength)) 45%,
rgba(255,255,255,.05) 60%,
rgba(0,0,0,var(--vv-overlay-strength)) 90%);
background-size: 100% 100%, 200% 200%;
mix-blend-mode: overlay;
animation: vvSweep var(--vv-overlay-speed) linear infinite;
pointer-events:none;
}
@keyframes vvSweep{
0%{ background-position: 0 0, 0% 50%; }
100%{ background-position: 0 0, 100% 50%; }
}
/* Responsive: ajustes para diferentes tamaños */
@media (max-width: 768px){
#videos-verticales.vv-section{
--vv-gap: 16px;
--vv-max-width: 280px; /* Más pequeño en móviles */
}
}
@media (max-width: 480px){
#videos-verticales.vv-section{
--vv-max-width: 240px; /* Aún más pequeño en móviles pequeños */
--vv-gap: 12px;
}
}
sistema-bar-salas
https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.csshttps://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700&family=Share+Tech+Mono&display=swap:root {
--dark-bg: #0f0f1a;
--darker-bg: #080810;
--panel-bg: rgba(15, 15, 30, 0.8);
--neon-blue: #00f0ff;
--neon-pink: #ff00f0;
--neon-purple: #b300ff;
--text-primary: #e0e0ff;
--text-secondary: #a0a0c0;
--panel-glow: rgba(0, 240, 255, 0.2);
--danger-red: #ff3864;
--success-green: #00ffa3;
--warning-orange: #ff9e00;
--scanline: rgba(0, 240, 255, 0.03);
}
body {
font-family: 'Share Tech Mono', monospace;
background-color: var(--dark-bg);
background-image:
linear-gradient(var(--scanline) 1px, transparent 1px),
linear-gradient(90deg, var(--scanline) 1px, transparent 1px);
background-size: 20px 20px;
color: var(--text-primary);
margin: 0;
padding: 0;
overflow-x: hidden;
letter-spacing: 0.5px;
}
/* CRT screen effect */
body::before {
content: "";
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(
rgba(18, 16, 16, 0) 50%,
rgba(0, 0, 0, 0.25) 50%
);
background-size: 100% 4px;
pointer-events: none;
z-index: 1000;
}
/* VHS distortion effect */
body::after {
content: "";
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background:
linear-gradient(0deg, rgba(0, 240, 255, 0.03) 0%, transparent 100%),
linear-gradient(90deg, rgba(255, 0, 240, 0.03) 0%, transparent 100%);
pointer-events: none;
z-index: 1000;
animation: vhs-flicker 0.1s infinite;
}
@keyframes vhs-flicker {
0% { opacity: 0.9; }
50% { opacity: 1; }
100% { opacity: 0.8; }
}
/* Typography */
h1, h2, h3, h4, h5, h6 {
font-family: 'Orbitron', sans-serif;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 2px;
color: var(--neon-blue);
text-shadow: 0 0 10px var(--panel-glow);
}
/* Main layout */
#caja-panel {
position: fixed;
left: 0;
top: 0;
height: 100vh;
width: 280px;
background: var(--panel-bg);
border-right: 1px solid var(--neon-blue);
padding: 25px;
z-index: 10000;
box-shadow: 0 0 30px var(--panel-glow);
transition: all 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55);
overflow-y: auto;
backdrop-filter: blur(5px);
}
#toggle-caja {
left: 100%;
margin-left: 5px;
position: absolute;
position: absolute;
top: 20px;
right: -45px;
background: var(--neon-blue);
color: var(--dark-bg);
border-radius: 50%;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
box-shadow: 0 0 15px var(--panel-glow);
font-size: 18px;
transition: all 0.3s ease;
border: none;
z-index: 10001;
}
#toggle-caja:hover {
transform: scale(1.1) rotate(90deg);
box-shadow: 0 0 25px var(--neon-pink);
background: var(--neon-pink);
}
#main-content {
margin-left: 280px;
padding: 30px;
transition: all 0.4s ease;
background: transparent;
}
/* Futuristic Cards */
.card {
background: var(--panel-bg);
border: 1px solid var(--neon-blue);
border-radius: 0;
margin-bottom: 25px;
box-shadow: 0 5px 25px rgba(0, 0, 0, 0.5);
transition: all 0.3s ease;
backdrop-filter: blur(5px);
overflow: hidden;
position: relative;
}
.card::before {
content: '';
position: absolute;
top: -2px;
left: -2px;
right: -2px;
bottom: -2px;
background: linear-gradient(45deg, var(--neon-blue), var(--neon-pink));
z-index: -1;
opacity: 0.3;
transition: opacity 0.3s ease;
}
.card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 35px rgba(0, 240, 255, 0.3);
border-color: var(--neon-pink);
}
.card:hover::before {
opacity: 0.6;
}
.card h5 {
color: var(--neon-blue);
font-size: 1.2rem;
padding-bottom: 12px;
margin-bottom: 15px;
border-bottom: 1px solid rgba(0, 240, 255, 0.3);
position: relative;
}
.card h5::after {
content: '';
position: absolute;
bottom: -1px;
left: 0;
width: 50px;
height: 2px;
background: var(--neon-blue);
}
/* Form Elements */
.form-control, .form-select {
background: rgba(10, 10, 20, 0.8);
border: 1px solid var(--neon-blue);
color: var(--text-primary);
border-radius: 0;
padding: 10px 15px;
transition: all 0.3s ease;
font-family: 'Share Tech Mono', monospace;
}
.form-control:focus, .form-select:focus {
background: rgba(15, 15, 30, 0.9);
border-color: var(--neon-pink);
box-shadow: 0 0 0 0.25rem rgba(0, 240, 255, 0.25);
color: white;
}
/* Buttons */
.btn {
border-radius: 0;
font-weight: 500;
padding: 8px 16px;
transition: all 0.3s ease;
font-family: 'Orbitron', sans-serif;
letter-spacing: 1px;
border: none;
text-transform: uppercase;
font-size: 0.8rem;
position: relative;
overflow: hidden;
}
.btn::after {
content: '';
position: absolute;
top: -50%;
left: -60%;
width: 200%;
height: 200%;
background: linear-gradient(
to bottom right,
rgba(255, 255, 255, 0.3),
rgba(255, 255, 255, 0)
);
transform: rotate(30deg);
transition: all 0.3s;
}
.btn:hover::after {
left: 100%;
}
.btn-success {
background: linear-gradient(135deg, var(--success-green), #00C782);
color: var(--dark-bg);
}
.btn-success:hover {
background: linear-gradient(135deg, #00E693, #00B372);
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(0, 255, 163, 0.3);
}
.btn-danger {
background: linear-gradient(135deg, var(--danger-red), #D1003F);
color: white;
}
.btn-danger:hover {
background: linear-gradient(135deg, #FF4D7A, #E10045);
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(255, 0, 117, 0.3);
}
.btn-sm {
padding: 5px 10px;
font-size: 0.7rem;
}
/* Ticket Box */
.ticket-box {
background: rgba(10, 10, 20, 0.8);
padding: 15px;
border-left: 4px solid var(--neon-blue);
font-size: 0.9rem;
font-family: 'Share Tech Mono', monospace;
box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);
border-radius: 0;
}
.ticket-box div {
margin-bottom: 5px;
display: flex;
justify-content: space-between;
}
.ticket-box div:last-child {
font-weight: bold;
color: var(--neon-blue);
margin-top: 10px;
padding-top: 8px;
border-top: 1px dashed rgba(0, 240, 255, 0.3);
}
/* List Items */
.list-group-item {
background: rgba(20, 20, 40, 0.8);
border: 1px solid rgba(0, 240, 255, 0.1);
color: var(--text-primary);
display: flex;
justify-content: space-between;
align-items: center;
padding: 8px 12px;
margin-bottom: 5px;
transition: all 0.3s ease;
font-family: 'Share Tech Mono', monospace;
border-radius: 0;
}
.list-group-item:hover {
background: rgba(30, 30, 60, 0.9);
border-color: rgba(0, 240, 255, 0.3);
}
.btn-remove {
background: transparent;
border: none;
color: va
/* ...cortado... */
teknopint.com.ar
https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.csshttps://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.csshttps://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.csshttps://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Montserrat:wght@400;500;600;700&display=swap:root {
--color-primary: #7b0cb5;
--color-primary-light: #6a5acd;
--color-secondary: #0056b3;
--color-accent: #ff6b6b;
--color-dark: #2c3e50;
--color-light: #f8f9fa;
--color-gray: #6c757d;
--transition: all 0.3s ease;
--shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.1);
--shadow-md: 0 5px 15px rgba(0, 0, 0, 0.1);
--shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.1);
--border-radius: 12px;
}
body {
font-family: 'Poppins', sans-serif;
color: var(--color-dark);
overflow-x: hidden;
scroll-behavior: smooth;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Montserrat', sans-serif;
font-weight: 600;
}
/* Navbar */
.navbar {
padding: 15px 0;
transition: var(--transition);
box-shadow: var(--shadow-sm);
background-color: white !important;
}
.navbar.scrolled {
padding: 10px 0;
box-shadow: var(--shadow-md);
}
.navbar-brand {
font-weight: 700;
color: var(--color-primary) !important;
font-size: 1.8rem;
display: flex;
align-items: center;
}
.navbar-brand i {
margin-right: 10px;
font-size: 1.5rem;
}
.nav-link {
font-weight: 500;
color: var(--color-dark) !important;
margin: 0 8px;
position: relative;
transition: var(--transition);
}
.nav-link:before {
content: '';
position: absolute;
width: 0;
height: 2px;
bottom: 0;
left: 0;
background-color: var(--color-primary);
transition: var(--transition);
}
.nav-link:hover:before {
width: 100%;
}
.nav-link.active:before {
width: 100%;
}
/* Hero Section */
.hero {
background: url('img/hero.png') center/cover no-repeat;
color: white;
height: 500px;
padding: 1060px 0 220px;
position: relative;
overflow: hidden;
}
@media (min-width: 992px) {
.hero {
padding-top: 320px;
padding-bottom: 280px;
min-height: 800px;
}
}
.hero:after {
content: '';
position: absolute;
bottom: -50px;
left: 0;
width: 100%;
height: 100px;
background: white;
transform: skewY(0deg);
z-index: 1;
}
.hero-content {
position: relative;
z-index: 2;
margin-top: 120px;
position: relative;
z-index: 2;
}
.hero h1 {
font-size: 3.2rem;
font-weight: 700;
margin-bottom: 20px;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.hero p {
font-size: 1.2rem;
max-width: 1000px;
margin: 0 auto 30px;
}
.btn-hero {
width: 50%;
padding: 12px 30px;
border-radius: 50px;
font-weight: 600;
letter-spacing: 0.5px;
transition: var(--transition);
margin: 0 10px;
}
.btn-hero-primary {
background-color: white;
color: var(--color-primary);
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}
.btn-hero-primary:hover {
transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
color: var(--color-primary);
}
.btn-hero-outline {
border: 2px solid white;
color: white;
}
.btn-hero-outline:hover {
background-color: white;
color: var(--color-primary);
transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}
/* Section General */
.section {
padding: 100px 0;
position: relative;
}
.section-title {
position: relative;
display: inline-block;
margin-bottom: 60px;
font-weight: 700;
}
.section-title:after {
content: '';
position: absolute;
width: 50px;
height: 3px;
background: var(--color-primary);
bottom: -15px;
left: 50%;
transform: translateX(-50%);
}
/* About Section */
.about-img {
border-radius: var(--border-radius);
box-shadow: var(--shadow-lg);
transition: var(--transition);
}
.about-img:hover {
transform: scale(1.02);
}
.about-content {
padding-left: 30px;
}
/* Services Section */
.services {
background-color: var(--color-light);
}
.service-card {
background: white;
border-radius: var(--border-radius);
padding: 30px;
margin-bottom: 30px;
box-shadow: var(--shadow-sm);
transition: var(--transition);
height: 100%;
border: 1px solid rgba(0, 0, 0, 0.05);
}
.service-card:hover {
transform: translateY(-10px);
box-shadow: var(--shadow-lg);
}
.service-icon {
font-size: 2.5rem;
color: var(--color-primary);
margin-bottom: 20px;
}
/* Why Choose Us */
.feature-card {
background: white;
border-radius: var(--border-radius);
padding: 25px;
margin-bottom: 30px;
box-shadow: var(--shadow-sm);
transition: var(--transition);
display: flex;
align-items: flex-start;
}
.feature-card:hover {
transform: translateY(-5px);
box-shadow: var(--shadow-md);
}
.feature-icon {
font-size: 1.5rem;
color: var(--color-primary);
margin-right: 15px;
margin-top: 3px;
}
/* Portfolio */
.portfolio {
background-color: var(--color-light);
}
.portfolio-item {
position: relative;
border-radius: var(--border-radius);
overflow: hidden;
margin-bottom: 30px;
box-shadow: var(--shadow-sm);
transition: var(--transition);
}
.portfolio-item img {
width: 100%;
height: 250px;
object-fit: cover;
transition: var(--transition);
}
.portfolio-item:hover {
box-shadow: var(--shadow-lg);
}
.portfolio-item:hover img {
transform: scale(1.05);
}
.portfolio-overlay {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding: 20px;
background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
color: white;
opacity: 0;
transition: var(--transition);
}
.portfolio-item:hover .portfolio-overlay {
opacity: 1;
}
/* FAQ */
.accordion-item {
margin-bottom: 15px;
border-radius: var(--border-radius) !important;
overflow: hidden;
border: none !important;
box-shadow: var(--shadow-sm);
}
.accordion-button {
font-weight: 600;
padding: 20px !important;
border-radius: var(--border-radius) !important;
}
.accordion-button:not(.collapsed) {
background-color: var(--color-primary);
color: white;
}
.accordion-button:focus {
box-shadow: none;
border-color: transparent;
}
/* Contact */
.contact {
background-color: var(--color-light);
}
.contact-form {
background: white;
padding: 40px;
border-radius: var(--border-radius);
box-shadow: var(--shadow-sm);
}
.form-control {
padding: 12px 15px;
border-radius: 8px !important;
border: 1px solid rgba(0, 0, 0, 0.1);
}
.form-control:focus {
box-shadow: none;
border-color: var(--color-primary);
}
.contact-info {
margin-top: 40px;
}
.contact-item {
display: flex;
align-items: center;
margin-bottom: 20px;
}
.contact-icon {
width: 50px;
height: 50px;
background: var(--color-primary);
color: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
/* ...cortado... */
.ticker-wrapper {
overflow: hidden;
position: relative;
}
.ticker-track {
display: flex;
animation: ticker-scroll 5s linear infinite;
gap: 2rem;
}
.ticker-track img {
width: var(--imgSize);
height: var(--imgSize);
object-fit: cover;
border-radius: 10px;
}
@keyframes ticker-scroll {
0% { transform: translateX(0); }
100% { transform: translateX(-50%); }
}
.ticker-track:hover {
animation-play-state: paused;
}
/* WhatsApp Float - El más hermoso del mundo */
.whatsapp-float-container {
position: fixed;
bottom: 30px;
right: 30px;
z-index: 9999;
perspective: 1000px;
}
.whatsapp-float {
position: relative;
transition: all 0.3s ease;
transform-style: preserve-3d;
}
.whatsapp-float:hover {
transform: translateY(-5px) rotate(5deg) scale(1.1);
}
.whatsapp-button {
display: block;
width: 70px;
height: 70px;
border-radius: 50%;
background: #25D366;
box-shadow: 0 10px 25px rgba(37, 211, 102, 0.3);
position: relative;
transition: all 0.3s ease;
animation: float 3s ease-in-out infinite;
}
.whatsapp-button:hover {
background: #128C7E;
transform: scale(1.1);
box-shadow: 0 15px 30px rgba(37, 211, 102, 0.4);
}
.whatsapp-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 40px;
height: 40px;
color: white;
}
.whatsapp-ico {
width: 100%;
height: 100%;
fill: white;
}
.whatsapp-pulse {
position: absolute;
width: 100%;
height: 100%;
background: rgba(37, 211, 102, 0.6);
border-radius: 50%;
opacity: 0;
animation: pulse 2s infinite;
}
.whatsapp-pulse-delayed {
position: absolute;
width: 100%;
height: 100%;
background: rgba(37, 211, 102, 0.4);
border-radius: 50%;
opacity: 0;
animation: pulse 2s infinite 0.5s;
}
.whatsapp-tooltip {
position: absolute;
right: 90px;
top: 50%;
transform: translateY(-50%);
background: white;
color: #333;
padding: 12px 15px;
border-radius: 10px;
font-size: 14px;
font-weight: 600;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
width: 200px;
text-align: center;
}
.whatsapp-tooltip small {
display: block;
font-size: 12px;
color: #666;
font-weight: normal;
margin-top: 3px;
}
.tooltip-arrow {
position: absolute;
right: -10px;
top: 50%;
transform: translateY(-50%);
width: 0;
height: 0;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-left: 10px solid white;
}
.whatsapp-float:hover .whatsapp-tooltip {
opacity: 1;
visibility: visible;
right: 80px;
}
@keyframes float {
0% { transform: translateY(0px); }
50% { transform: translateY(-10px); }
100% { transform: translateY(0px); }
}
@keyframes pulse {
0% { transform: scale(0.8); opacity: 0; }
70% { transform: scale(1.3); opacity: 0.4; }
100% { transform: scale(1.4); opacity: 0; }
}
/* Efecto de latido al cargar */
@keyframes heartbeat {
0% { transform: scale(1); }
25% { transform: scale(1.1); }
50% { transform: scale(1); }
75% { transform: scale(1.1); }
100% { transform: scale(1); }
}
/* Animación inicial */
.whatsapp-button {
animation: heartbeat 1.5s ease 2s 2, float 3s ease-in-out infinite 3s;
}
/* Responsive */
@media (max-width: 768px) {
.whatsapp-float-container {
bottom: 20px;
right: 20px;
}
.whatsapp-button {
width: 60px;
height: 60px;
}
.whatsapp-tooltip {
display: none;
}
}
ventadepasajesaparaguay.com
https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&family=Montserrat:wght@700;900&display=swaphttps://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.csshttps://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.csshttps://unpkg.com/[email protected]/dist/aos.css:root {
--primary: #003f8a;
--primary-dark: #002d62;
--secondary: #ff0033;
--secondary-light: #ff4d6d;
--white: #ffffff;
--light: #f8f9fa;
--gray-light: #e9ecef;
--gray: #6c757d;
--dark: #212529;
--success: #25d366;
--instagram: #E1306C;
--facebook: #3b5998;
--shadow-sm: 0 2px 8px rgba(0,0,0,0.08);
--shadow: 0 10px 30px rgba(0,0,0,0.1);
--shadow-lg: 0 15px 40px rgba(0,0,0,0.15);
--transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
body {
.hero { max-width: 100%; }
overflow-x: hidden;
font-family: 'Poppins', sans-serif;
color: var(--dark);
background-color: var(--light);
overflow-x: hidden;
scroll-behavior: smooth;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Montserrat', sans-serif;
font-weight: 800;
}
/* Navbar */
.navbar {
background-color: var(--primary);
box-shadow: var(--shadow);
padding: 15px 0;
transition: var(--transition);
}
.navbar.scrolled {
padding: 10px 0;
background-color: rgba(0, 63, 138, 0.98);
backdrop-filter: blur(10px);
}
.navbar-brand {
font-weight: 800;
font-size: 1.5rem;
color: var(--white) !important;
display: flex;
align-items: center;
}
.navbar-brand img {
height: 40px;
margin-right: 10px;
}
.nav-link {
color: var(--white) !important;
font-weight: 500;
margin: 0 8px;
padding: 8px 16px !important;
border-radius: 50px;
transition: var(--transition);
}
.nav-link:hover, .nav-link:focus {
color: var(--white) !important;
background-color: var(--secondary);
}
.nav-link.active {
background-color: var(--secondary);
}
.hero::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: radial-gradient(ellipse at center, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.7) 100%);
}
.hero-content {
position: relative;
z-index: 2;
}
.hero h1 {
font-size: 4.5rem;
margin-bottom: 1.5rem;
text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
animation: fadeInDown 1s ease both;
}
.hero p {
font-size: 1.5rem;
margin-bottom: 2rem;
text-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
animation: fadeInUp 1s ease both 0.3s;
}
.hero-title {
font-size: 3.5rem;
font-weight: 900;
margin-bottom: 20px;
line-height: 1.2;
}
.hero-subtitle {
font-size: 1.25rem;
opacity: 0.9;
margin-bottom: 30px;
max-width: 700px;
margin-left: auto;
margin-right: auto;
}
/* Botones */
.btn {
padding: 12px 28px;
border-radius: 50px;
font-weight: 600;
transition: var(--transition);
border: none;
}
.btn-primary {
background-color: var(--primary);
}
.btn-primary:hover {
background-color: var(--primary-dark);
transform: translateY(-3px);
box-shadow: var(--shadow);
}
.btn-secondary {
background-color: var(--secondary);
color: var(--white);
}
.btn-secondary:hover {
background-color: var(--secondary-light);
transform: translateY(-3px);
box-shadow: var(--shadow);
}
.btn-whatsapp {
background-color: var(--success);
color: var(--white);
padding: 14px 30px;
border-radius: 50px;
font-weight: 600;
display: inline-flex;
align-items: center;
box-shadow: var(--shadow);
transition: var(--transition);
}
.btn-whatsapp:hover {
transform: translateY(-3px);
box-shadow: var(--shadow-lg);
color: var(--white);
}
.btn-whatsapp i {
margin-right: 8px;
font-size: 1.2rem;
}
/* Secciones */
.section {
padding: 100px 0;
position: relative;
}
.section-title {
position: relative;
color: var(--primary);
font-weight: 800;
margin-bottom: 50px;
text-align: center;
}
.section-title::after {
content: '';
display: block;
width: 80px;
height: 4px;
background: linear-gradient(to right, var(--primary), var(--secondary));
margin: 15px auto 0;
border-radius: 2px;
}
/* Tarjetas de servicios */
.card-service {
background: var(--white);
border-radius: 15px;
padding: 40px 30px;
box-shadow: var(--shadow);
margin-bottom: 30px;
transition: var(--transition);
height: 100%;
border: none;
text-align: center;
}
.card-service:hover {
transform: translateY(-10px);
box-shadow: var(--shadow-lg);
}
.card-service .icon {
font-size: 3rem;
margin-bottom: 20px;
color: var(--secondary);
}
.card-service h3 {
font-weight: 700;
margin-bottom: 15px;
color: var(--primary);
}
/* Galería */
.gallery {
position: relative;
padding: 0;
}
.gallery::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 100px;
background: linear-gradient(to bottom, var(--light), transparent);
z-index: 2;
}
.gallery::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 100px;
background: linear-gradient(to top, var(--light), transparent);
z-index: 2;
}
.ticker-track {
min-width: 100%;
display: flex;
gap: 20px;
padding: 20px 0;
animation: ticker 30s linear infinite;
}
.ticker-item {
flex: 0 0 auto;
max-width: 300px;
border-radius: 15px;
overflow: hidden;
box-shadow: var(--shadow);
transition: var(--transition);
}
.ticker-item:hover {
transform: scale(1.05);
}
.ticker-item img {
width: 100%;
height: auto;
object-fit: contain;
display: block;
}
@keyframes ticker {
0% { transform: translateX(0); }
100% { transform: translateX(-50%); }
}
/* Empresas */
.companies {
background-color: var(--white);
padding: 60px 0;
}
.company-logo {
height: 100px;
opacity: 0.7;
transition: var(--transition);
}
.company-logo:hover {
filter: none;
opacity: 1;
transform: scale(1.1);
}
/* Contacto */
.contact-form {
background-color: var(--white);
border-radius: 15px;
padding: 40px;
box-shadow: var(--shadow);
max-width: 800px;
margin: 0 auto;
}
.form-control {
height: 50px;
border-radius: 10px;
border: 1px solid var(--gray-light);
padding: 10px 20px;
margin-bottom: 20px;
transition: var(--transition);
}
.form-control:focus {
border-color: var(--primary);
box-shadow: 0 0 0 0.25rem rgba(0, 63, 138, 0.25);
}
textarea.form-control {
height: auto;
min-height: 150px;
}
/* Footer */
.footer {
background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
color: var(--white);
padding: 60px 0 30px;
position: relative;
}
.footer::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 15px;
background: linear-gradient(to right, var(--primary), var(--secondar
/* ...cortado... */
construccionesquiroga.com.ar
https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.csshttps://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.csshttps://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&family=Playfair+Display:wght@400;500;600;700&display=swaphttps://unpkg.com/[email protected]/dist/aos.css:root {
--qc-primary: #1253c3;
--qc-secondary: #0d6efd;
--qc-accent: #ff6b35;
--qc-dark: #1a1a2e;
--qc-light: #f8f9fa;
--qc-gradient: linear-gradient(135deg, var(--qc-primary), var(--qc-secondary));
}
body {
font-family: 'Montserrat', sans-serif;
color: #333;
overflow-x: hidden;
}
h1, h2, h3, h4, h5, .section-title {
font-family: 'Playfair Display', serif;
font-weight: 700;
}
/* Navbar */
.navbar {
background-color: rgba(26, 26, 46, 0.95) !important;
backdrop-filter: blur(10px);
transition: all 0.3s ease;
}
.navbar.scrolled {
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
.navbar-brand {
font-weight: 700;
font-size: 1.5rem;
background: var(--qc-gradient);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.nav-link {
font-weight: 500;
position: relative;
padding: 0.5rem 1rem;
}
.nav-link::after {
content: '';
position: absolute;
bottom: 0;
left: 1rem;
width: 0;
height: 2px;
background: var(--qc-accent);
transition: width 0.3s ease;
}
.nav-link:hover::after {
width: calc(100% - 2rem);
}
/* Hero */
#inicio {
background: linear-gradient(135deg, rgba(18, 83, 195, 0.9), rgba(13, 110, 253, 0.9)), url("img/herox2.png") center/cover no-repeat fixed;
color: #fff;
min-height: 100vh;
display: flex;
align-items: center;
text-align: center;
position: relative;
overflow: hidden;
}
#inicio::before {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 100px;
background: linear-gradient(to top, var(--qc-light), transparent);
z-index: 1;
}
#inicio .container {
position: relative;
z-index: 2;
}
#inicio h1 {
font-size: 3.5rem;
font-weight: 700;
margin-bottom: 1.5rem;
text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}
#inicio p {
font-size: 1.5rem;
margin-bottom: 2.5rem;
font-weight: 300;
}
.hero-buttons .btn {
padding: 0.75rem 2rem;
font-weight: 600;
border-radius: 50px;
transition: all 0.3s ease;
margin: 0.5rem;
}
.btn-primary {
background: var(--qc-gradient);
border: none;
}
.btn-outline-light:hover {
background: rgba(255, 255, 255, 0.1);
}
/* Section Titles */
.section-title {
font-size: 2.5rem;
margin-bottom: 3rem;
position: relative;
display: inline-block;
}
.section-title::after {
content: '';
position: absolute;
bottom: -10px;
left: 0;
width: 60px;
height: 4px;
background: var(--qc-accent);
border-radius: 2px;
}
.text-center .section-title::after {
left: 50%;
transform: translateX(-50%);
}
/* Cards */
.card {
border: none;
border-radius: 15px;
overflow: hidden;
transition: all 0.3s ease;
height: 100%;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}
.card:hover {
transform: translateY(-10px);
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
}
.card-icon {
font-size: 2.5rem;
margin-bottom: 1rem;
background: var(--qc-gradient);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.card-title {
font-weight: 700;
margin-bottom: 1rem;
}
/* Features */
.feature-box {
padding: 2rem;
border-radius: 15px;
background: white;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
transition: all 0.3s ease;
height: 100%;
}
.feature-box:hover {
transform: translateY(-5px);
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
}
.feature-icon {
font-size: 2.5rem;
margin-bottom: 1.5rem;
background: var(--qc-gradient);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
/* Carousel */
#carouselTrabajos {
padding: 2rem 0;
}
#carouselTrabajos img {
max-width: 700px;
height: 450px;
object-fit: cover;
border-radius: 15px;
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
}
.carousel-control-prev, .carousel-control-next {
width: 50px;
height: 50px;
background-color: rgba(255, 255, 255, 0.2);
border-radius: 50%;
top: 50%;
transform: translateY(-50%);
backdrop-filter: blur(5px);
}
/* Accordion */
.accordion-button {
font-weight: 600;
padding: 1.25rem;
}
.accordion-button:not(.collapsed) {
background-color: rgba(13, 110, 253, 0.05);
color: var(--qc-primary);
}
.accordion-button:focus {
box-shadow: none;
border-color: rgba(13, 110, 253, 0.2);
}
/* Contact Form */
.form-control, .form-select {
padding: 0.75rem 1rem;
border-radius: 10px;
border: 1px solid #e0e0e0;
}
.form-control:focus, .form-select:focus {
border-color: var(--qc-primary);
box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
/* Floating buttons */
.floating-btn {
position: fixed;
right: 2rem;
width: 60px;
height: 60px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.75rem;
color: #fff;
z-index: 1050;
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
transition: all 0.3s ease;
}
.floating-btn:hover {
transform: scale(1.1);
}
.floating-btn.whatsapp {
bottom: 6rem;
background: #25D366;
}
.floating-btn.instagram {
bottom: 2rem;
background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
}
/* Footer */
footer {
background-color: var(--qc-dark);
position: relative;
overflow: hidden;
}
footer::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 5px;
background: var(--qc-gradient);
}
footer h5 {
font-weight: 700;
margin-bottom: 1.5rem;
color: white;
}
footer a {
color: rgba(255, 255, 255, 0.7);
text-decoration: none;
transition: all 0.3s ease;
}
footer a:hover {
color: white;
text-decoration: underline;
}
.social-icons {
display: flex;
gap: 1rem;
margin-top: 1.5rem;
}
.social-icons a {
width: 40px;
height: 40px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.1);
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s ease;
}
.social-icons a:hover {
background: var(--qc-primary);
transform: translateY(-3px);
}
/* Responsive Adjustments */
@media (max-width: 992px) {
#inicio h1 {
font-size: 2.75rem;
}
#inicio p {
font-size: 1.25rem;
}
.section-title {
font-size: 2rem;
}
}
@media (max-width: 768px) {
#inicio h1 {
font-size: 2.25rem;
}
.hero-buttons .btn {
display: b
/* ...cortado... */
porvosyparavos.com.ar
https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap@media(min-width: 1920px) {
.hidden-dne058 {
display: none !important
}
}
@media(min-width: 1200px) and (max-width: 1919px) {
.hidden-72rtr7 {
display: none !important
}
}
@media(min-width: 810px) and (max-width: 1199px) {
.hidden-ecmr9b {
display: none !important
}
}
@media(max-width: 809px) {
.hidden-1fn0g8o {
display: none !important
}
}
@media(min-width: 1200px) {
.hidden-be91op {
display: none !important
}
}
@media(min-width: 810px) and (max-width: 1199px) {
.hidden-12ozf32 {
display: none !important
}
}
@media(max-width: 809px) {
.hidden-1xvc6rx {
display: none !important
}
}
html,
body,
#main {
margin: 0;
padding: 0;
box-sizing: border-box
}
:root {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
* {
box-sizing: border-box;
-webkit-font-smoothing: inherit
}
h1,
h2,
h3,
h4,
h5,
h6,
p,
figure {
margin: 0
}
body,
input,
textarea,
select,
button {
font-size: 12px;
font-family: sans-serif
}
body {
--token-c56d8574-58b3-4dc7-b6e2-bd40137097b4: rgb(246, 245, 244);
--token-9f6765da-f121-4764-acfb-40e5fdac6ff8: rgb(204, 204, 204);
--token-d9a23d8b-f0e3-436d-bd92-cf361755e5f8: rgb(153, 153, 153);
--token-2c0da575-7b0a-4ad2-8e9a-95bde25d1bbd: rgb(51, 51, 51);
--token-e206300f-f993-4343-a0ac-348ae117b5b1: rgb(28, 27, 23);
--token-faaffceb-79fe-4d6d-af24-1f64ffe1c6eb: rgb(22, 22, 18)
}
#__framer-badge-container {
position: fixed;
bottom: 0;
padding: 20px;
width: 100%;
display: flex;
justify-content: right;
pointer-events: none;
z-index: 314159
}
.__framer-badge {
pointer-events: auto
}
@font-face {
font-family: Jost;
font-style: italic;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zUtBhPNqw73oHt5D4hTxM.woff2) format("woff2");
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116
}
@font-face {
font-family: Jost;
font-style: italic;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zUtBhPNqw73oHt7j4hTxM.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF
}
@font-face {
font-family: Jost;
font-style: italic;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zUtBhPNqw73oHt4D4h.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}
@font-face {
font-family: Jost;
font-style: italic;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zUtBhPNqw73oHt5D4hTxM.woff2) format("woff2");
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116
}
@font-face {
font-family: Jost;
font-style: italic;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zUtBhPNqw73oHt7j4hTxM.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF
}
@font-face {
font-family: Jost;
font-style: italic;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zUtBhPNqw73oHt4D4h.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}
@font-face {
font-family: Jost;
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zatBhPNqw73oDd4iYl.woff2) format("woff2");
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116
}
@font-face {
font-family: Jost;
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zatBhPNqw73ord4iYl.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF
}
@font-face {
font-family: Jost;
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zatBhPNqw73oTd4g.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}
@font-face {
font-family: Jost;
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zatBhPNqw73oDd4iYl.woff2) format("woff2");
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116
}
@font-face {
font-family: Jost;
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zatBhPNqw73ord4iYl.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF
}
@font-face {
font-family: Jost;
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zatBhPNqw73oTd4g.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}
@font-face {
font-family: Jost;
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zatBhPNqw73oDd4iYl.woff2) format("woff2");
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116
}
@font-face {
font-family: Jost;
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zatBhPNqw73ord4iYl.woff2) format("woff2");
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF
}
@font-face {
font-family: Jost;
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jost/v19/92zatBhPNqw73oTd4g.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}
@font-face {
font-family: Montaga;
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/montaga/v13/H4cnBX2Ml8rCkEO_4gEa7Q.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}
@font-face {
font-family: Inter;
src: url(https://framerusercontent.com/assets/5vvr9Vy74if2I6bQbJvbw7SY1pQ.woff2);
font-display: swap;
font-style: normal;
font-weight: 400;
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F
}
@font-face {
font-family: Inter;
src: url(https://framerusercontent.com/assets/EOr0mi4hNtlgWNn9if640EZzXCo.woff2);
font-display: swap;
font-style: normal;
font-weight: 400;
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116
}
@font-face {
font-family: Inter;
src: url(https://framerusercontent.com/assets/Y9k9QrlZAqio88Klkmbd8VoMQc.woff2);
font-display: swap;
font-style: normal;
font-wei
/* ...cortado... */