Preview de mixed.css
/* MIXED CSS PACK */
/* Template: gestionsaludedith.com.ar/index.html */
/* Template mtime: 2026-04-09 12:08:18 */
/* external link (no embedded): https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,[email protected],400;12..96,500;12..96,600;12..96,700;12..96,800&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,400&display=swap */
/* external link (no embedded): https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css */
/* ===== INLINE <style> BLOCK #1 ===== */
:root {
--navy: #0EA5A4;
--navy-dark: #071e34;
--navy-mid: #123456;
--navy-light: #1a4a70;
--navy-soft: #e6eef6;
--navy-softer: #f0f5fa;
--white: #ffffff;
--offwhite: #f8fafc;
--text: #0f1923;
--text-light: #344155;
--muted: #64748b;
--border: #e2e8f0;
--border-dark: #c8d5e3;
--shadow-sm: 0 2px 8px rgba(10,43,74,.06);
--shadow-md: 0 8px 28px rgba(10,43,74,.10);
--shadow-lg: 0 20px 50px rgba(10,43,74,.14);
--shadow-xl: 0 32px 72px rgba(10,43,74,.18);
--radius-sm: 12px;
--radius-md: 20px;
--radius-lg: 28px;
--radius-xl: 36px;
--radius-full: 999px;
--font-display: 'Bricolage Grotesque', sans-serif;
--font-body: 'DM Sans', sans-serif;
--transition: .3s cubic-bezier(.25,.46,.45,.94);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
font-family: var(--font-body);
color: var(--text);
background: var(--white);
overflow-x: hidden;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
width: 100%;
max-width: 100%;
}
html, body {
max-width: 100%;
overflow-x: clip;
}
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
.reveal {
opacity: 0;
transform: translateY(28px);
transition: opacity .65s cubic-bezier(.25,.46,.45,.94), transform .65s cubic-bezier(.25,.46,.45,.94);
}
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: .1s; }
.reveal-delay-2 { transition-delay: .2s; }
.reveal-delay-3 { transition-delay: .3s; }
.reveal-delay-4 { transition-delay: .4s; }
.reveal-delay-5 { transition-delay: .5s; }
.section { padding: 100px 0; position: relative; }
.section-alt { background: var(--offwhite); }
.section-navy { background: var(--navy); }
.eyebrow {
display: inline-flex;
align-items: center;
gap: .45rem;
padding: .42rem 1rem;
border-radius: var(--radius-full);
background: var(--navy-soft);
color: var(--navy);
font-family: var(--font-body);
font-size: .72rem;
font-weight: 600;
letter-spacing: .1em;
text-transform: uppercase;
margin-bottom: 1.2rem;
border: 1px solid rgba(10,43,74,.12);
}
.eyebrow::before {
content: '';
width: 6px; height: 6px;
border-radius: 50%;
background: var(--navy);
opacity: .7;
}
.section-title {
font-family: var(--font-display);
font-size: clamp(2rem, 4vw, 3.1rem);
line-height: 1.06;
font-weight: 800;
color: var(--text);
margin-bottom: 1rem;
letter-spacing: -.03em;
}
.section-subtitle {
font-size: 1.05rem;
color: var(--muted);
max-width: 700px;
margin: 0 auto;
line-height: 1.7;
}
.text-center .section-title { letter-spacing: -.04em; }
.navbar {
background: rgba(255,255,255,.92);
backdrop-filter: blur(20px) saturate(180%);
-webkit-backdrop-filter: blur(20px) saturate(180%);
border-bottom: 1px solid rgba(10,43,74,.08);
padding: 0;
transition: box-shadow var(--transition), background var(--transition);
}
.navbar.scrolled {
box-shadow: 0 4px 30px rgba(10,43,74,.1);
background: rgba(255,255,255,.98);
}
.navbar .container { min-height: 72px; }
.navbar-brand {
display: flex;
align-items: center;
gap: .75rem;
padding: .75rem 0;
}
.brand-logo {
height: 42px;
width: auto;
object-fit: contain;
border-radius: 8px;
}
.brand-text {
display: flex;
flex-direction: column;
}
.brand-text strong {
font-family: var(--font-display);
font-size: .95rem;
font-weight: 700;
color: var(--text);
line-height: 1.1;
}
.brand-text span {
font-size: .7rem;
color: var(--muted);
font-weight: 500;
letter-spacing: .03em;
}
.nav-link {
font-family: var(--font-body);
font-weight: 500;
font-size: .88rem;
color: var(--text-light) !important;
padding: .55rem .9rem !important;
border-radius: 8px;
transition: color var(--transition), background var(--transition) !important;
letter-spacing: .01em;
}
.nav-link:hover { color: var(--navy) !important; background: var(--navy-soft); }
.navbar-toggler {
border: 1px solid var(--border);
border-radius: 10px;
padding: .4rem .6rem;
box-shadow: none !important;
}
.navbar-toggler:focus { box-shadow: none !important; }
.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%2810,43,74,1%29' stroke-linecap='round' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.nav-cta {
background: var(--navy);
color: #fff !important;
border-radius: var(--radius-full) !important;
padding: .52rem 1.25rem !important;
font-weight: 600 !important;
font-size: .85rem !important;
transition: background var(--transition), transform var(--transition), box-shadow var(--transition) !important;
letter-spacing: .02em;
}
.nav-cta:hover {
background: var(--navy-dark) !important;
color: #fff !important;
transform: translateY(-1px);
box-shadow: 0 8px 20px rgba(10,43,74,.25);
}
@media (max-width: 991.98px) {
.navbar-collapse {
background: var(--white);
border: 1px solid var(--border);
border-radius: var(--radius-md);
padding: 1rem 1.25rem;
margin-top: .65rem;
box-shadow: var(--shadow-lg);
}
.nav-cta { margin-top: .5rem; display: inline-block; text-align: center; }
}
@media (max-width: 991.98px) {
.navbar > .container {
flex-wrap: nowrap;
}
.navbar-brand {
flex: 1 1 auto;
min-width: 0;
margin-right: .75rem;
}
.brand-logo {
height: 36px;
flex: 0 0 auto;
}
.brand-text {
min-width: 0;
overflow: hidden;
}
.brand-text strong,
.brand-text span {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.brand-text strong {
font-size: .9rem;
}
.brand-text span {
font-size: .66rem;
}
.navbar-toggler {
flex: 0 0 auto;
margin-left: auto;
}
.navbar-collapse {
flex-basis: 100%;
width: 100%;
max-width: 100%;
overflow: hidden;
}
.navbar-nav {
width: 100%;
align-items: stretch !important;
}
.navbar-nav .nav-item,
.navbar-nav .nav-link,
.navbar-nav .nav-cta {
width: 100%;
}
}
@media (max-width: 575.98px) {
.navbar .container {
padding-left: .9rem;
padding-right: .9rem;
}
.brand-logo {
height: 34px;
}
.brand-text strong {
font-size: .84rem;
}
.brand-text span {
font-size: .62rem;
}
}
.btn-primary-custom,
.btn-outline-custom {
display: inline-flex;
align-items: center;
justify-content: center;
gap: .55rem;
border-radius: var(--radius-full);
padding: .88rem 1.8rem;
font-family: var(--font-body);
font-weight: 600;
font-size: .95rem;
letter-spacing: .01em;
transition: all var(--transition);
cursor: pointer;
border: 1.5px solid transparent;
}
.btn-primary-custom {
background: var(--navy);
color: #fff;
border-color: var(--navy);
box-shadow: 0 8px 28px rgba(10,43,74,.28);
}
.btn-primary-custom:hover {
background: var(--navy-dark);
border-color: var(--navy-dark);
color: #fff;
transform: translateY(-2px);
box-shadow: 0 14px 36px rgba(10,43,74,.36);
}
.btn-outline-custom {
background: transparent;
color: var(--navy);
border-color: rgba(10,43,74,.25);
}
.btn-outline-custom:hover {
background: var(--navy-soft);
border-color: var(--navy);
color: var(--navy);
transform: translateY(-2px);
}
#inicio {
padding-top: 148px;
padding-bottom: 80px;
background:
radial-gradient(ellipse 80% 60% at 70% 0%, rgba(10,43,74,.07) 0%, transparent 60%),
radial-gradient(ellipse 50% 40% at 0% 100%, rgba(10,43,74,.04) 0%, transparent 50%),
var(--offwhite);
overflow: hidden;
position: relative;
}
#inicio::before {
content: '';
position: absolute;
inset: 0;
background-image: radial-gradient(circle, rgba(10,43,74,.035) 1.5px, transparent 1.5px);
background-size: 36px 36px;
pointer-events: none;
}
.hero-eyebrow {
display: inline-flex;
align-items: center;
gap: .6rem;
padding: .5rem 1.1rem .5rem .75rem;
border-radius: var(--radius-full);
background: var(--white);
border: 1px solid var(--border-dark);
font-size: .78rem;
font-weight: 600;
color: var(--navy);
margin-bottom: 1.5rem;
box-shadow: var(--shadow-sm);
}
.hero-eyebrow .dot {
width: 8px; height: 8px;
border-radius: 50%;
background: var(--navy);
animation: pulse-dot 2s infinite;
}
@keyframes pulse-dot {
0%, 100% { box-shadow: 0 0 0 0 rgba(10,43,74,.4); }
50% { box-shadow: 0 0 0 5px rgba(10,43,74,.0); }
}
.hero-title {
font-family: var(--font-display);
font-size: clamp(2.6rem, 5.5vw, 4.6rem);
line-height: .98;
font-weight: 800;
color: var(--text);
letter-spacing: -.05em;
margin-bottom: 1.4rem;
}
.hero-title em {
font-style: normal;
color: var(--navy);
position: relative;
}
.hero-desc {
font-size: 1.05rem;
color: var(--muted);
line-height: 1.75;
max-width: 560px;
margin-bottom: 2rem;
}
.hero-stats {
display: flex;
gap: 1.5rem;
margin-bottom: 2.2rem;
flex-wrap: wrap;
}
.hero-stat {
display: flex;
flex-direction: column;
}
.hero-stat-num {
font-family: var(--font-display);
font-size: 1.6rem;
font-weight: 800;
color: var(--navy);
line-height: 1;
}
.hero-stat-label {
font-size: .75rem;
color: var(--muted);
font-weight: 500;
margin-top: .15rem;
}
.hero-stat-divider {
width: 1px;
background: var(--border);
align-self: stretch;
margin: .1rem 0;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: .9rem; margin-bottom: 2rem; }
.hero-panel {
background: var(--white);
border: 1px solid var(--border);
border-radius: var(--radius-xl);
padding: 1.5rem;
box-shadow: var(--shadow-xl);
position: relative;
}
.hero-panel-img-wrap {
background: linear-gradient(145deg, var(--navy-softer) 0%, var(--navy-soft) 100%);
border-radius: var(--radius-lg);
padding: 1.75rem;
display: flex;
align-items: center;
justify-content: center;
min-height: 200px;
margin-bottom: 1.25rem;
}
.hero-panel-img-wrap img {
max-height: 180px;
max-width: 100%;
object-fit: contain;
filter: drop-shadow(0 12px 28px rgba(10,43,74,.18));
}
.hero-chips {
display: grid;
grid-template-columns: 1fr 1fr;
gap: .75rem;
}
.hero-chip {
background: var(--offwhite);
border: 1px solid var(--border);
border-radius: var(--radius-md);
padding: .85rem 1rem;
font-size: .82rem;
font-weight: 600;
color: var(--text);
line-height: 1.35;
transition: border-color var(--transition), background var(--transition), transform var(--transition);
}
.hero-chip:hover {
border-color: var(--navy);
background: var(--navy-soft);
transform: translateY(-2px);
}
.hero-float-note {
position: absolute;
right: -24px;
bottom: 60px;
background: var(--navy);
color: #fff;
padding: 1rem 1.2rem;
border-radius: var(--radius-md);
box-shadow: 0 20px 50px rgba(10,43,74,.36);
max-width: 210px;
font-size: .82rem;
font-weight: 600;
line-height: 1.45;
z-index: 5;
}
.hero-float-note::before {
content: '';
position: absolute;
left: -8px;
top: 50%;
transform: translateY(-50%);
border: 8px solid transparent;
border-right-color: var(--navy);
border-left: 0;
}
@media (max-width: 991.98px) {
#inicio { padding-top: 130px; }
.hero-title { text-align: center; }
.hero-desc { text-align: center; margin-inline: auto; }
.hero-stats { justify-content: center; }
.hero-actions { justify-content: center; }
.hero-panel { margin-top: 2.5rem; }
.hero-float-note { right: 8px; bottom: -24px; position: static; margin-top: 1rem; max-width: none; }
.hero-float-note::before { display: none; }
}
@media (max-width: 767.98px) {
.hero-chips { grid-template-columns: 1fr; }
.hero-actions { flex-direction: column; }
.hero-actions .btn-primary-custom,
.hero-actions .btn-outline-custom { width: 100%; justify-content: center; }
}
.ticker-section {
overflow: hidden;
padding: 32px 0;
border-top: 1px solid var(--border);
border-bottom: 1px solid var(--border);
background: var(--white);
position: relative;
}
.ticker-section::before,
.ticker-section::after {
content: '';
position: absolute;
top: 0; bottom: 0;
width: 120px;
z-index: 2;
pointer-events: none;
}
.ticker-section::before { left: 0; background: linear-gradient(to right, var(--white), transparent); }
.ticker-section::after { right: 0; background: linear-gradient(to left, var(--white), transparent); }
.ticker-wrapper { width: 100%; overflow: hidden; }
.ticker-track {
display: flex;
align-items: center;
gap: 40px;
width: max-content;
animation: tickerMove 22s linear infinite;
}
.ticker-track:hover { animation-play-state: paused; }
.ticker-track img {
height: 52px;
width: auto;
max-width: 140px;
object-fit: contain;
filter: grayscale(1) opacity(.55);
transition: filter var(--transition), transform var(--transition);
}
.ticker-track img:hover {
filter: grayscale(0) opacity(1);
transform: scale(1.07);
}
@keyframes tickerMove {
0% { transform: translateX(0); }
100% { transform: translateX(-50%); }
}
@media (max-width: 768px) {
.ticker-track { gap: 24px; }
.ticker-track img { height: 40px; max-width: 100px; }
}
.check-list {
list-style: none;
padding: 0; margin: 0;
display: grid;
gap: .85rem;
}
.check-list li {
display: flex;
align-items: flex-start;
gap: .9rem;
font-weight: 500;
color: var(--text-light);
font-size: .95rem;
line-height: 1.55;
}
.check-icon {
width: 26px; height: 26px;
border-radius: 8px;
background: var(--navy-soft);
flex: 0 0 26px;
display: inline-flex;
align-items: center;
justify-content: center;
margin-top: .15rem;
}
.check-icon svg { width: 14px; height: 14px; color: var(--navy); }
.icon-badge {
width: 52px; height: 52px;
border-radius: 16px;
background: var(--navy-soft);
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 52px;
transition: background var(--transition), transform var(--transition);
}
.icon-badge svg { width: 22px; height: 22px; color: var(--navy); }
#quienes-somos .profile-card {
background: var(--white);
border: 1px solid var(--border);
border-radius: var(--radius-xl);
padding: 2rem 2.25rem;
box-shadow: var(--shadow-md);
}
.profile-header {
display: flex;
align-items: center;
gap: 1rem;
margin-bottom: 1.25rem;
}
.profile-avatar {
width: 56px; height: 56px;
border-radius: 50%;
background: var(--navy);
display: flex;
align-items: center;
justify-content: center;
flex: 0 0 56px;
}
.profile-avatar svg { width: 26px; height: 26px; color: rgba(255,255,255,.9); }
.profile-name {
font-family: var(--font-display);
font-size: 1.2rem;
font-weight: 800;
color: var(--text);
line-height: 1.1;
}
.profile-role {
font-size: .8rem;
color: var(--muted);
font-weight: 500;
}
.profile-bio {
color: var(--muted);
line-height: 1.7;
font-size: .95rem;
margin-bottom: 1.5rem;
}
.profile-chips {
display: grid;
grid-template-columns: 1fr 1fr;
gap: .75rem;
}
.profile-chip {
background: var(--offwhite);
border: 1px solid var(--border);
border-radius: var(--radius-sm);
padding: .75rem 1rem;
font-size: .82rem;
font-weight: 600;
color: var(--text);
line-height: 1.35;
transition: all var(--transition);
}
.profile-chip:hover {
border-color: var(--navy);
background: var(--navy-soft);
transform: translateY(-1px);
}
.service-card {
background: var(--white);
border: 1px solid var(--border);
border-radius: var(--radius-lg);
padding: 2rem;
height: 100%;
transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
position: relative;
overflow: hidden;
}
.service-card::before {
content: '';
position: absolute;
top: 0; left: 0; right: 0;
height: 3px;
background: var(--navy);
transform: scaleX(0);
transition: transform var(--transition);
}
.service-card:hover {
border-color: var(--border-dark);
box-shadow: var(--shadow-lg);
transform: translateY(-4px);
}
.service-card:hover::before { transform: scaleX(1); }
.service-card:hover .icon-badge { background: var(--navy); }
.service-card:hover .icon-badge svg { color: #fff; }
.service-card h3 {
font-family: var(--font-display);
font-size: 1.08rem;
font-weight: 700;
color: var(--text);
margin: 1.1rem 0 .65rem;
letter-spacing: -.02em;
}
.service-card p {
color: var(--muted);
font-size: .92rem;
line-height: 1.65;
margin: 0;
}
.coverage-card {
background: var(--white);
border: 1px solid var(--border);
border-radius: var(--radius-lg);
padding: 2.25rem;
height: 100%;
transition: box-shadow var(--transition), transform var(--transition);
}
.coverage-card:hover {
box-shadow: var(--shadow-lg);
transform: translateY(-4px);
}
.coverage-card h3 {
font-family: var(--font-display);
font-size: 1.12rem;
font-weight: 800;
color: var(--text);
margin: 1rem 0 .5rem;
letter-spacing: -.02em;
}
.coverage-card p { color: var(--muted); font-size: .92rem; line-height: 1.65; margin-bottom: 0; }
.coverage-card ul { list-style: none; padding: 0; margin: 1.25rem 0 0; display: grid; gap: .65rem; }
.coverage-card li {
display: flex;
align-items: center;
gap: .75rem;
font-weight: 600;
color: var(--text-light);
font-size: .9rem;
}
.coverage-dot {
width: 8px; height: 8px;
border-radius: 50%;
background: var(--navy);
flex: 0 0 8px;
}
.why-card {
background: var(--white);
border: 1px solid var(--border);
border-radius: var(--radius-lg);
padding: 1.75rem;
height: 100%;
display: flex;
flex-direction: column;
transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}
.why-card:hover {
border-color: rgba(10,43,74,.2);
box-shadow: var(--shadow-md);
transform: translateY(-3px);
}
.why-card:hover .icon-badge { background: var(--navy); }
.why-card:hover .icon-badge svg { color: #fff; }
.why-card h3 {
font-family: var(--font-display);
font-size: 1.05rem;
font-weight: 800;
color: var(--text);
margin: 1rem 0 .55rem;
letter-spacing: -.02em;
}
.why-card p {
color: var(--muted);
font-size: .9rem;
line-height: 1.65;
margin: 0;
}
.faq-item {
background: var(--white);
border: 1px solid var(--border);
border-radius: var(--radius-md) !important;
margin-bottom: .85rem;
overflow: hidden;
transition: border-color var(--transition), box-shadow var(--transition);
}
.faq-item:hover { border-color: var(--border-dark); }
.faq-item.open {
border-color: var(--navy);
box-shadow: 0 8px 30px rgba(10,43,74,.1);
}
.accordion-button {
font-family: var(--font-display);
font-weight: 700;
font-size: 1rem;
letter-spacing: -.02em;
color: var(--text) !important;
background: transparent !important;
padding: 1.3rem 1.5rem;
box-shadow: none !important;
border-radius: 0 !important;
transition: color var(--transition);
}
.accordion-button:not(.collapsed) {
color: var(--navy) !important;
background: transparent !important;
}
.accordion-button::after {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230a2b4a' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
background-size: 18px 18px;
width: 18px; height: 18px;
transition: transform var(--transition);
}
.accordion-button:focus { box-shadow: none !important; }
.accordion-body {
padding: .2rem 1.5rem 1.4rem;
color: var(--muted);
font-size: .95rem;
line-height: 1.7;
}
.contact-info-card {
background: var(--navy);
border-radius: var(--radius-xl);
padding: 2.5rem;
height: 100%;
color: #fff;
position: relative;
overflow: hidden;
}
.contact-info-card::before {
content: '';
position: absolute;
top: -60px; right: -60px;
width: 220px; height: 220px;
border-radius: 50%;
background: rgba(255,255,255,.04);
pointer-events: none;
}
.contact-info-card::after {
content: '';
position: absolute;
bottom: -80px; left: -40px;
width: 260px; height: 260px;
border-radius: 50%;
background: rgba(255,255,255,.03);
pointer-events: none;
}
.contact-info-title {
font-family: var(--font-display);
font-size: 1.5rem;
font-weight: 800;
color: #fff;
letter-spacing: -.03em;
margin-bottom: .6rem;
}
.contact-info-sub {
color: rgba(255,255,255,.65);
font-size: .9rem;
line-height: 1.65;
margin-bottom: 2rem;
}
.contact-items { display: grid; gap: 1.25rem; position: relative; z-index: 1; }
.contact-item {
display: flex;
align-items: flex-start;
gap: 1rem;
}
.contact-item-icon {
width: 44px; height: 44px;
border-radius: 13px;
background: rgba(255,255,255,.12);
display: flex;
align-items: center;
justify-content: center;
flex: 0 0 44px;
transition: background var(--transition);
}
.contact-item-icon svg { width: 20px; height: 20px; color: rgba(255,255,255,.9); }
.contact-item:hover .contact-item-icon { background: rgba(255,255,255,.2); }
.contact-item-label {
font-size: .72rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: .07em;
color: rgba(255,255,255,.5);
margin-bottom: .2rem;
}
.contact-item-value {
font-weight: 600;
color: rgba(255,255,255,.95);
font-size: .92rem;
}
.contact-item-value a { color: rgba(255,255,255,.95); transition: color var(--transition); }
.contact-item-value a:hover { color: #fff; text-decoration: underline; }
.form-card {
background: var(--white);
border: 1px solid var(--border);
border-radius: var(--radius-xl);
padding: 2.5rem;
height: 100%;
box-shadow: var(--shadow-md);
}
.form-card h3 {
font-family: var(--font-display);
font-size: 1.4rem;
font-weight: 800;
color: var(--text);
letter-spacing: -.03em;
margin-bottom: .4rem;
}
.form-card p {
color: var(--muted);
font-size: .88rem;
margin-bottom: 1.75rem;
}
.form-label-custom {
display: block;
font-size: .78rem;
font-weight: 600;
color: var(--text);
margin-bottom: .4rem;
letter-spacing: .02em;
text-transform: uppercase;
}
.form-control,
.form-select {
border-radius: var(--radius-sm) !important;
border: 1.5px solid var(--border) !important;
padding: .8rem 1rem !important;
font-family: var(--font-body);
font-size: .92rem;
color: var(--text) !important;
background: var(--offwhite) !important;
box-shadow: none !important;
transition: border-color var(--transition), background var(--transition), box-shadow var(--transition) !important;
}
.form-control:focus,
.form-select:focus {
border-color: var(--navy) !important;
background: var(--white) !important;
box-shadow: 0 0 0 4px rgba(10,43,74,.08) !important;
}
.form-control::placeholder { color: #9eafc0; }
footer {
background: var(--navy-dark);
color: rgba(255,255,255,.85);
padding: 56px 0 0;
position: relative;
overflow: hidden;
}
footer::before {
content: '';
position: absolute;
top: 0; left: 0; right: 0;
height: 1px;
background: linear-gradient(to right, transparent, rgba(255,255,255,.15), transparent);
}
.footer-brand-wrap {
display: flex;
align-items: center;
gap: .9rem;
margin-bottom: 1.1rem;
}
.footer-logo {
height: 42px;
width: auto;
border-radius: 8px;
}
.footer-brand-name {
font-family: var(--font-display);
font-weight: 700;
font-size: .95rem;
color: #fff;
line-height: 1.2;
}
.footer-brand-sub { font-size: .72rem; color: rgba(255,255,255,.45); }
.footer-desc {
color: rgba(255,255,255,.55);
font-size: .88rem;
line-height: 1.7;
max-width: 300px;
}
.footer-heading {
font-family: var(--font-display);
font-size: .85rem;
font-weight: 700;
color: rgba(255,255,255,.4);
text-transform: uppercase;
letter-spacing: .1em;
margin-bottom: 1.25rem;
}
.footer-links { display: grid; gap: .65rem; }
.footer-link {
color: rgba(255,255,255,.65);
font-size: .88rem;
font-weight: 500;
transition: color var(--transition), padding-left var(--transition);
}
.footer-link:hover { color: #fff; padding-left: 4px; }
.footer-bottom {
border-top: 1px solid rgba(255,255,255,.08);
margin-top: 3rem;
padding: 1.25rem 0;
}
.footer-copy {
color: rgba(255,255,255,.4);
font-size: .8rem;
}
.footer-copy a { color: rgba(255,255,255,.65); font-weight: 600; transition: color var(--transition); }
.footer-copy a:hover { color: #fff; }
.gal-gallery .carousel { max-width: 980px; margin-inline: auto; position: relative; }
.gal-frame {
height: clamp(220px,48vh,440px);
background: var(--white);
border-radius: var(--radius-md);
overflow: hidden;
box-shadow: var(--shadow-md);
display: flex;
align-items: center;
justify-content: center;
padding: 8px;
}
.gal-img {
width: auto !important; max-width: 100%;
height: auto !important; max-height: 100%;
object-fit: contain !important;
object-position: center;
display: block; cursor: zoom-in;
}
.gal-gallery .carousel-control-prev,
.gal-gallery .carousel-control-next {
z-index: 20; width: 50px; height: 50px;
top: 50%; transform: translateY(-50%);
opacity: 1;
background: rgba(10,43,74,.7);
border-radius: 50%;
margin: 0 12px;
}
.gal-gallery .carousel-control-prev { left: 0; }
.gal-gallery .carousel-control-next { right: 0; }
.gal-gallery .gal-ctrl-icon { width: 2.6rem; height: 2.6rem; background-size: 60% 60%; }
.gal-gallery .carousel-indicators { z-index: 10; bottom: -50px; }
.gal-gallery .carousel-indicators button {
width: 10px; height: 10px; border-radius: 50%;
background: rgba(0,0,0,.4); border: none;
}
.gal-gallery .carousel-indicators button.active { background: var(--navy); }
.gal-gallery { padding-bottom: 56px; }
#galLightbox .modal-content { background: #000; }
#galLightboxImg { max-height: 86vh; width: 100%; height: auto; object-fit: contain; background: #000; }
.gal-lightbox-nav {
position: absolute; top: 50%; transform: translateY(-50%);
border: 0; width: 44px; height: 44px; border-radius: 999px;
background: rgba(255,255,255,.18); color: #fff;
font-size: 30px; line-height: 44px; text-align: center;
z-index: 5; cursor: pointer;
}
.gal-lightbox-nav:hover { background: rgba(255,255,255,.28); }
.gal-lightbox-nav.gal-prev { left: 10px; }
.gal-lightbox-nav.gal-next { right: 10px; }
.divider {
height: 1px;
background: var(--border);
margin: 0;
}
@media (max-width: 575.98px) {
.section { padding: 72px 0; }
.profile-chips { grid-template-columns: 1fr; }
.form-card { padding: 1.75rem; }
.contact-info-card { padding: 1.75rem; }
}
/* ===== INLINE <style> BLOCK #2 ===== */
.wa-float{
position:fixed;
right:18px;
bottom:18px;
z-index:2147483647;
display:flex;
flex-direction:column;
align-items:flex-end;
font-family:inherit;
}
.wa-btn{
width:60px;
height:60px;
border-radius:50%;
border:none;
background:linear-gradient(135deg,#25D366,#128C7E);
color:#fff;
display:grid;
place-items:center;
cursor:pointer;
box-shadow:0 10px 30px rgba(37,211,102,.45);
transition:transform .25s ease, box-shadow .25s ease;
}
.wa-btn:hover{
transform:translateY(-3px) scale(1.05);
box-shadow:0 14px 36px rgba(37,211,102,.55);
}
.wa-card{
position:absolute;
right:0;
bottom:74px;
width:min(360px,92vw);
background:#fff;
border-radius:18px;
border:1px solid #e3e6ea;
box-shadow:0 18px 60px rgba(0,0,0,.25);
overflow:hidden;
transform:translateY(10px);
opacity:0;
transition:.25s ease;
pointer-events:none;
}
.wa-card[aria-modal="true"]{
transform:none;
opacity:1;
pointer-events:auto;
}
.wa-head{
display:flex;
align-items:center;
gap:12px;
padding:14px;
background:linear-gradient(135deg,#25D366,#128C7E);
color:#fff;
}
.wa-avatar{
width:40px;
height:40px;
background:#fff;
border-radius:10px;
display:grid;
place-items:center;
overflow:hidden;
flex:0 0 40px;
}
.wa-avatar img{
width:26px;
height:26px;
object-fit:contain;
}
.wa-meta{
min-width:0;
}
.wa-title{
font-weight:800;
line-height:1.1;
}
.wa-status{
font-size:.85rem;
opacity:.92;
line-height:1.2;
}
.wa-close{
margin-left:auto;
border:none;
background:transparent;
color:#fff;
font-size:24px;
cursor:pointer;
width:32px;
height:32px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
opacity:.9;
flex:0 0 32px;
}
.wa-close:hover{
opacity:1;
background:rgba(255,255,255,.14);
}
.wa-body{
padding:14px;
max-height:40vh;
overflow:auto;
background:#f8f9fa;
display:flex;
flex-direction:column;
gap:8px;
}
.wa-bubble{
max-width:88%;
padding:10px 12px;
border-radius:14px;
font-size:.95rem;
line-height:1.4;
box-shadow:0 4px 10px rgba(0,0,0,.08);
}
.wa-bot{
background:#fff;
border:1px solid #e3e6ea;
align-self:flex-start;
}
.wa-user{
background:#eaf7f0;
border:1px solid #cfeedd;
align-self:flex-end;
}
.wa-compose{
display:grid;
grid-template-columns:1fr auto;
gap:8px;
padding:10px;
border-top:1px solid #e3e6ea;
background:#fff;
}
.wa-compose textarea{
resize:none;
border-radius:12px;
padding:10px;
border:1px solid #e3e6ea;
font-family:inherit;
font-size:.95rem;
outline:none;
min-height:48px;
}
.wa-send{
background:#25D366;
color:#fff;
border:none;
border-radius:12px;
padding:0 16px;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
}
.wa-send:hover{
background:#1fb85a;
}
@media (max-width:480px){
.wa-float{
right:12px;
bottom:12px;
}
.wa-card{
width:min(360px, calc(100dvw - 24px));
max-width:calc(100dvw - 24px);
}
.wa-btn{
width:58px;
height:58px;
}
}
Manifest preview
{
"template": "gestionsaludedith.com.ar/index.html",
"template_mtime": 1775736498,
"template_mtime_human": "2026-04-09T12:08:18+00:00",
"css_links_found": [
"https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,[email protected],400;12..96,500;12..96,600;12..96,700;12..96,800&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,400&display=swap",
"https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
],
"css_links_external": [
"https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,[email protected],400;12..96,500;12..96,600;12..96,700;12..96,800&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,400&display=swap",
"https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
],
"css_links_embedded": [],
"inline_style_blocks": 2,
"inline_imports_external": [],
"inline_imports_embedded": [],
"missing_css_files": []
}