/* ============================================================
   FUNDACIÓN FRUTOS DE MIS RAÍCES — styles.css v5
   ============================================================ */

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

/* ============================================================ 01. VARIABLES ============================================================ */
:root {
    --verde:         #4A7A28;
    --verde-oscuro:  #2E5018;
    --verde-claro:   #6BA038;
    --verde-hoja:    #5A8C30;
    --sol:           #F0D468;
    --sol-claro:     #FDF9E4;
    --sol-medio:     #F8E898;
    --sol-oscuro:    #C8A418;
    --sol-borde:     #E8C848;
    --cielo:         #A8D4EE;
    --cielo-claro:   #E8F5FC;
    --blanco:        #FFFFFF;
    --crema:         #FDFBF2;
    --crema-oscuro:  #F0E8CC;
    --gris-texto:    #3E3828;
    --gris-claro:    #7A7060;
    --sombra:        0 4px 24px rgba(74,122,40,0.11);
    --sombra-hover:  0 14px 44px rgba(74,122,40,0.20);
    --sombra-card:   0 8px 32px rgba(0,0,0,0.10);
    --radio:         14px;
    --radio-grande:  22px;
    --fuente-titulo: 'Lora', serif;
    --fuente-cuerpo: 'Nunito', sans-serif;
    --wa-green:      #25D366;
}

/* ============================================================ 02. RESET ============================================================ */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:84px; }
body { font-family:var(--fuente-cuerpo); font-size:1rem; color:var(--gris-texto); line-height:1.75; background:var(--crema); overflow-x:hidden; }
h1,h2,h3 { font-family:var(--fuente-titulo); font-weight:700; line-height:1.25; color:var(--verde-oscuro); }
h4,h5,h6 { font-family:var(--fuente-cuerpo); font-weight:700; color:var(--verde-oscuro); }
p { font-family:var(--fuente-cuerpo); font-size:1.05rem; line-height:1.8; text-align:left; }
a { text-decoration:none; color:inherit; transition:all .3s ease; }
ul { list-style:none; }
img { max-width:100%; height:auto; display:block; }
.container { max-width:1300px; margin:0 auto; padding:0 2rem; }
.text-center { text-align:center; }

/* ============================================================ 03. LOADER ============================================================ */
.page-loader { position:fixed; inset:0; background:var(--cielo-claro); display:flex; align-items:center; justify-content:center; z-index:9999; transition:opacity .5s ease; }
.page-loader.fade-out { opacity:0; pointer-events:none; }
.loader-spinner { width:46px; height:46px; border:4px solid var(--crema-oscuro); border-top:4px solid var(--verde); border-radius:50%; animation:spin 1s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }

/* ============================================================ 04. ANIMACIONES ============================================================ */
@keyframes fadeInUp  { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeIn    { from{opacity:0} to{opacity:1} }
@keyframes slideIn   { from{transform:translateY(-36px);opacity:0} to{transform:translateY(0);opacity:1} }
@keyframes float     { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
@keyframes waPulse   { 0%{transform:scale(1);opacity:.55;} 80%{transform:scale(1.65);opacity:0;} 100%{transform:scale(1.65);opacity:0;} }

.fade-in-up      { animation:fadeInUp .75s ease-out forwards; opacity:0; }
.animate-delay-1 { animation-delay:.10s; }
.animate-delay-2 { animation-delay:.25s; }
.animate-delay-3 { animation-delay:.40s; }
.animate-delay-5 { animation-delay:.65s; }

/* ============================================================ 05. HOJAS DE MAÍZ ============================================================ */
.corn-leaves-deco { position:absolute; inset:0; pointer-events:none; z-index:0; overflow:hidden; }
.corn-leaves-deco svg { position:absolute; opacity:1; }

/* ============================================================ 06. HEADER — Celeste muy suave, siempre visible ============================================================ */
.main-header {
    background: linear-gradient(180deg,
        #fefce8 0%,
        #fefae0 60%,
        rgba(254,250,224,0) 100%
    );
    border-bottom: none;
    box-shadow: none;
    padding: .85rem 0;
    position: sticky;
    top: 0;
    z-index: 1000;
    overflow: visible;
}

/* Difuminado suave sin línea dura — capa extra debajo */
.main-header::before {
    content: '';
    position: absolute;
    bottom: -120px;
    left: 0;
    right: 0;
    height: 120px;
    background: linear-gradient(to bottom,
        rgba(254,250,224,0.38) 0%,
        rgba(254,250,224,0.15) 45%,
        rgba(254,250,224,0.04) 75%,
        transparent 100%
    );
    pointer-events: none;
    z-index: -1;
}
/* Rayos solares diagonales muy sutiles */
.main-header::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(118deg, rgba(255,230,60,0.07) 0%, transparent 38%),
        linear-gradient(82deg,  transparent 55%, rgba(255,225,50,0.05) 100%),
        linear-gradient(145deg, rgba(255,235,80,0.06) 0%, transparent 30%),
        linear-gradient(55deg,  transparent 62%, rgba(255,228,60,0.04) 100%);
    pointer-events: none;
    z-index: 0;
}

/* Nav hover — solo cambia color de letra */
.nav-link { font-family:var(--fuente-cuerpo); font-size:.95rem; font-weight:800; color:var(--verde-oscuro); text-transform:uppercase; letter-spacing:1.5px; position:relative; padding:.4rem .5rem; transition:color .25s ease; }
.nav-link::after { content:''; position:absolute; bottom:-2px; left:50%; transform:translateX(-50%); width:0; height:2.5px; background:#c0823a; border-radius:2px; transition:width .3s ease; }
.nav-link:hover { color:#6b7c2a; }
.nav-link:hover::after { width:100%; background:#6b7c2a; }

.sun-rays-deco { position:absolute; inset:0; pointer-events:none; z-index:0; overflow:hidden; }
.header-container { max-width:1300px; margin:0 auto; padding:0 2rem; display:flex; justify-content:space-between; align-items:center; gap:2rem; position:relative; z-index:1; }
.header-logo-section { display:flex; align-items:center; gap:1.2rem; }
.header-logo { width:56px; height:56px; border-radius:50%; object-fit:contain; background:white; flex-shrink:0; }
.header-title { font-family:var(--fuente-titulo); font-size:1.2rem; font-weight:700; color:var(--verde-oscuro); margin:0; line-height:1.25; }
.header-nav { flex:1; display:flex; justify-content:flex-end; }
.nav-list { display:flex; gap:2rem; list-style:none; margin:0; padding:0; }
.mobile-menu-toggle { display:none; flex-direction:column; justify-content:center; align-items:center; gap:6px; width:44px; height:44px; background:transparent; border:2px solid transparent; border-radius:10px; cursor:pointer; padding:.5rem; transition:all .3s ease; position:relative; z-index:1001; }
.mobile-menu-toggle:hover { background:rgba(74,122,40,.06); border-color:rgba(240,212,104,.35); }
.mobile-menu-toggle span { width:24px; height:2.5px; background:var(--verde-oscuro); border-radius:3px; transition:all .35s cubic-bezier(.23,1,.32,1); transform-origin:center; display:block; }
.mobile-menu-toggle.active span:nth-child(1) { transform:translateY(8.5px) rotate(45deg); background:var(--sol-oscuro); }
.mobile-menu-toggle.active span:nth-child(2) { opacity:0; transform:scaleX(0); }
.mobile-menu-toggle.active span:nth-child(3) { transform:translateY(-8.5px) rotate(-45deg); background:var(--sol-oscuro); }

/* ============================================================ 07. HERO ============================================================ */
.hero-section { position:relative; min-height:100vh; min-height:100svh; display:flex; align-items:center; padding:4rem 0 8rem; overflow:hidden; background:linear-gradient(168deg, #EAF6FF 0%, #F2F9FF 35%, #FDFBF2 100%); }
.hero-section::before { content:''; position:absolute; top:-80px; right:-80px; width:380px; height:380px; border-radius:50%; background:radial-gradient(circle, rgba(240,212,104,.22) 0%, rgba(240,212,104,.07) 50%, transparent 72%); pointer-events:none; }
.hero-container { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center; position:relative; z-index:1; }
.hero-content { z-index:2; }
.hero-badge { display:inline-flex; align-items:center; gap:.4rem; padding:.55rem 1.4rem; background:var(--sol); border-radius:50px; margin-bottom:1.75rem; box-shadow:0 4px 18px rgba(240,212,104,.50); }
.hero-badge span { color:var(--verde-oscuro); font-family:var(--fuente-cuerpo); font-weight:800; font-size:.82rem; letter-spacing:2px; text-transform:uppercase; }
.hero-title { font-family:var(--fuente-titulo); font-size:clamp(2.4rem,4.5vw,3.8rem); margin-bottom:1.5rem; line-height:1.15; color:var(--verde-oscuro); }
.hero-title-accent { color:var(--sol-oscuro); display:block; font-style:italic; }
.hero-description { font-size:clamp(1rem,1.5vw,1.13rem); line-height:1.85; margin-bottom:2.25rem; color:#3A4E5A; }
.hero-description strong { color:var(--verde-oscuro); font-weight:700; }
.hero-cta { display:flex; gap:1rem; flex-wrap:wrap; }
.btn { padding:.9rem 2rem; border-radius:50px; font-family:var(--fuente-cuerpo); font-weight:700; font-size:.95rem; cursor:pointer; transition:all .3s ease; border:none; display:inline-block; }
.btn-primary-hero { background:var(--verde); color:white; box-shadow:0 4px 16px rgba(74,122,40,.30); }
.btn-primary-hero:hover { background:var(--verde-oscuro); transform:translateY(-3px); }
.btn-secondary-hero { background:rgba(255,255,255,.75); color:var(--verde-oscuro); border:2.5px solid var(--verde); backdrop-filter:blur(4px); }
.btn-secondary-hero:hover { background:var(--verde); color:white; transform:translateY(-3px); }
.btn-disabled { cursor:not-allowed; opacity:.65; }
.btn-disabled:hover { transform:none !important; }
.image-wrapper { position:relative; }
.hero-image-container { position:relative; border-radius:var(--radio-grande); overflow:hidden; box-shadow:0 24px 64px rgba(74,122,40,.20), 0 0 0 6px rgba(255,255,255,.55); }
.hero-actual-image { width:100%; height:auto; display:block; }
.image-overlay { position:absolute; inset:0; background:linear-gradient(135deg, rgba(74,122,40,.05), rgba(240,212,104,.07)); }
.floating-card { position:absolute; background:white; padding:.9rem 1.4rem; border-radius:14px; box-shadow:0 8px 28px rgba(74,122,40,.14); display:flex; align-items:center; gap:.6rem; animation:float 3s ease-in-out infinite; border-left:4px solid var(--sol-borde); }
.floating-card-1 { top:10%; left:-2%; }
.floating-card-2 { bottom:20%; right:-2%; animation-delay:1s; }
.floating-card-3 { top:50%; left:-2%; animation-delay:2s; }
.card-icon { font-size:1.4rem; }
.card-text { font-family:var(--fuente-cuerpo); font-weight:700; color:var(--verde-oscuro); font-size:.85rem; }
.hero-waves { position:absolute; bottom:0; left:0; width:100%; overflow:hidden; line-height:0; }
.hero-waves svg { width:100%; height:100px; }

/* ============================================================ 08. PRÓXIMAMENTE ============================================================ */
.donation-options-section { padding:6rem 0 5rem; background:linear-gradient(180deg, var(--crema) 0%, #FEFBE8 55%, var(--sol-claro) 100%); position:relative; overflow:hidden; }
.section-header { max-width:820px; margin:0 auto 3.5rem; position:relative; z-index:1; }
.section-title { font-family:var(--fuente-titulo); font-size:clamp(1.8rem,3vw,2.4rem); color:var(--verde-oscuro); margin-bottom:1rem; }
.section-description { font-size:1.05rem; line-height:1.8; color:var(--gris-claro); text-align:left; max-width:780px; margin-left:auto; margin-right:auto; }
.donation-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:2rem; max-width:1100px; margin:0 auto; position:relative; z-index:1; }
.donation-card { background:var(--blanco); border:2px solid var(--crema-oscuro); border-radius:var(--radio-grande); padding:2.5rem 2rem; text-align:center; transition:all .35s ease; position:relative; overflow:hidden; box-shadow:0 2px 16px rgba(240,212,104,.10); }
.donation-card::before { content:''; position:absolute; bottom:0; left:0; width:100%; height:4px; background:linear-gradient(90deg, var(--sol-borde), var(--sol-oscuro)); transform:scaleX(0); transform-origin:left; transition:transform .35s ease; }
.donation-card:hover { transform:translateY(-8px); box-shadow:var(--sombra-hover); border-color:var(--sol-borde); }
.donation-card:hover::before { transform:scaleX(1); }
.donation-card-featured { background:linear-gradient(145deg, #FFFDE8 0%, #FEFBF0 100%); border:2.5px solid var(--sol-borde); transform:scale(1.04); box-shadow:0 8px 32px rgba(240,212,104,.22); }
.coming-soon-badge { position:absolute; top:1rem; right:1rem; background:var(--sol); color:var(--verde-oscuro); padding:.3rem .9rem; border-radius:50px; font-size:.78rem; font-weight:700; letter-spacing:.5px; }
.donation-icon { font-size:2.8rem; color:var(--verde); margin-bottom:1.4rem; }
.donation-card-featured .donation-icon { color:var(--sol-oscuro); }
.donation-title { font-family:var(--fuente-titulo); font-size:1.6rem; color:var(--verde-oscuro); margin-bottom:.9rem; }
.donation-description { font-size:1rem; color:#666; line-height:1.7; margin-bottom:2rem; }
.btn-donation-action { padding:.85rem 1.8rem; border-radius:50px; background:var(--verde); color:white; border:none; font-family:var(--fuente-cuerpo); font-weight:700; font-size:.92rem; cursor:not-allowed; opacity:.55; display:inline-flex; align-items:center; gap:.5rem; }

/* ============================================================ 09. ALIADOS — SCROLL INFINITO ============================================================ */
.partners-section { padding:6rem 0 2rem; background:linear-gradient(180deg, var(--sol-claro) 0%, #FEFBE8 50%, #F5F0E0 100%); overflow:hidden; position:relative; }

.partners-trust-line { display:flex; align-items:center; justify-content:center; gap:1.5rem; margin:2.5rem 0 3rem; flex-wrap:wrap; position:relative; z-index:1; }
.partners-trust-line span { font-family:var(--fuente-cuerpo); font-size:.75rem; font-weight:800; color:var(--gris-claro); text-transform:uppercase; letter-spacing:2px; }
.partners-trust-line hr { flex:1; border:none; border-top:1px solid var(--crema-oscuro); max-width:140px; }

/* ── Marquee de logos: scroll continuo infinito ── */
.partners-marquee-wrapper {
    position:relative; z-index:1;
    width:100%; overflow:hidden;
    padding:1.5rem 0 3rem;
    transform: translateZ(0);
    mask-image:linear-gradient(90deg, transparent 0%, black 6%, black 94%, transparent 100%);
    -webkit-mask-image:linear-gradient(90deg, transparent 0%, black 6%, black 94%, transparent 100%);
}
@keyframes marquee-infinite {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.partners-marquee-track {
    display: flex;
    gap: 400px;
    align-items: center;
    width: max-content;
    animation: marquee-infinite 70s linear infinite;
    will-change: transform;
}

/* Tarjeta de logo */
.partner-logo-card {
    position: relative;
    width: 260px;         /* más grande */
    height: 180px;
    flex-shrink: 0;
    background: var(--blanco);
    border-radius: var(--radio-grande);
    border: 2px solid var(--crema-oscuro);
    box-shadow: var(--sombra-card);
    cursor: pointer;
    overflow: hidden;
    transition: box-shadow .3s ease, border-color .3s ease, transform .3s ease;
}
.partner-logo-card:hover { box-shadow:0 12px 36px rgba(74,122,40,.18), 0 0 0 3px rgba(240,212,104,.35); border-color:var(--sol-borde); transform:translateY(-5px); }

.plc-logo-wrap { width:100%; height:100%; display:flex; align-items:center; justify-content:center; padding:1.5rem; }
.plc-logo-wrap img { max-width:100%; max-height:100%; object-fit:contain; filter:grayscale(20%) opacity(.88); transition:filter .35s ease; }
.partner-logo-card:hover .plc-logo-wrap img { filter:grayscale(0%) opacity(1); }
.plc-fallback { font-family:var(--fuente-titulo); font-weight:700; font-size:1.1rem; color:var(--verde-oscuro); text-align:center; letter-spacing:1px; }

/* Overlay descripción dentro del logo al hover */
.plc-desc-overlay { position:absolute; inset:0; background:linear-gradient(160deg, rgba(30,58,16,.90) 0%, rgba(74,122,40,.85) 100%); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:1.2rem; opacity:0; transition:opacity .35s ease; border-radius:calc(var(--radio-grande) - 2px); text-align:center; }
.partner-logo-card:hover .plc-desc-overlay { opacity:1; }
.plc-desc-name { font-family:var(--fuente-titulo); font-size:.82rem; font-weight:800; color:var(--sol-borde); text-transform:uppercase; letter-spacing:1.2px; margin-bottom:.5rem; }
.plc-desc-text { font-family:var(--fuente-cuerpo); font-size:.80rem; font-weight:500; color:rgba(255,255,255,.92); line-height:1.45; }
.plc-click-hint { margin-top:.7rem; font-size:.72rem; color:rgba(255,255,255,.55); font-style:italic; }

/* ============================================================ 10. MODAL DE ALIADO ============================================================ */
.partner-modal-overlay { display:flex; position:fixed; inset:0; z-index:2000; background:rgba(30,58,16,.60); backdrop-filter:blur(6px); align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity .3s ease, visibility .3s ease; }
.partner-modal-overlay.show { opacity:1; visibility:visible; }

.partner-modal-box { background:var(--blanco); border-radius:var(--radio-grande); max-width:520px; width:92%; position:relative; animation:slideIn .35s ease; box-shadow:0 32px 80px rgba(0,0,0,.28); overflow:hidden; }

/* Hojas dentro del modal */
.partner-modal-box .modal-corn-leaf { position:absolute; pointer-events:none; z-index:0; }

/* ── BOTÓN X CERRAR — siempre visible arriba derecha ── */
.partner-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--verde-oscuro);
    border: 2.5px solid var(--sol-borde);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.2rem;
    transition: all .25s ease;
    z-index: 999;
    box-shadow: 0 4px 18px rgba(0,0,0,.30);
}
.partner-modal-close:hover { background:var(--sol-borde); color:var(--verde-oscuro); transform:scale(1.12) rotate(90deg); }

.partner-modal-logo-zone { background:linear-gradient(150deg, var(--cielo-claro) 0%, var(--sol-claro) 100%); padding:2.5rem 3rem 2rem; display:flex; align-items:center; justify-content:center; min-height:170px; border-bottom:3px solid var(--sol-borde); position:relative; z-index:1; }
.partner-modal-logo-zone img { max-width:200px; max-height:120px; object-fit:contain; }
.pm-logo-fallback { font-family:var(--fuente-titulo); font-size:1.8rem; font-weight:700; color:var(--verde-oscuro); letter-spacing:2px; }
.partner-modal-body { padding:2rem 2.5rem 1.5rem; border-bottom:1px solid var(--crema-oscuro); position:relative; z-index:1; }
.partner-modal-body h3 { font-family:var(--fuente-titulo); font-size:1.4rem; color:var(--verde-oscuro); margin-bottom:.8rem; }
.partner-modal-body p { font-size:.98rem; line-height:1.8; color:#555; text-align:left; }
.partner-modal-socials { padding:1.4rem 2.5rem; display:flex; align-items:center; gap:1rem; flex-wrap:wrap; position:relative; z-index:1; }
.partner-modal-socials-label { font-family:var(--fuente-cuerpo); font-size:.78rem; font-weight:800; color:var(--gris-claro); text-transform:uppercase; letter-spacing:1.5px; margin-right:.5rem; }
.pm-social { width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.1rem; color:white; text-decoration:none; transition:all .25s cubic-bezier(.34,1.56,.64,1); box-shadow:0 4px 12px rgba(0,0,0,.15); }
.pm-social:hover { transform:translateY(-4px) scale(1.1); box-shadow:0 8px 20px rgba(0,0,0,.22); }
.pm-social--instagram { background:linear-gradient(135deg,#833ab4,#fd1d1d,#fcb045); }
.pm-social--x { background:#000; }
.pm-social--linkedin { background:#0077b5; }
.pm-social--whatsapp { background:#25D366; }
.pm-social--github { background:#24292e; }
.pm-social-email-plain {
    font-family: var(--fuente-cuerpo);
    font-size: .9rem;
    font-weight: 600;
    color: var(--verde-oscuro);
    text-decoration: none;
    border-bottom: 1px solid rgba(46,80,24,.25);
    transition: color .2s, border-color .2s;
}
.pm-social-email-plain:hover {
    color: var(--verde);
    border-bottom-color: var(--verde);
}

/* ============================================================ 11. NOSOTROS ============================================================ */
.quienes-hero { padding:7rem 0 5rem; background:linear-gradient(160deg, #EAF6FF 0%, #F5FBFF 40%, var(--crema) 100%); position:relative; overflow:hidden; }
.quienes-hero .hero-title { font-size:clamp(2rem,4vw,3.2rem); color:var(--verde-oscuro); margin-bottom:1rem; }
.quienes-subtitle { font-family:var(--fuente-titulo); font-size:clamp(1.15rem,2vw,1.35rem); font-weight:600; color:var(--sol-oscuro); margin-bottom:3rem; font-style:italic; }
.quienes-content { max-width:900px; margin:0 auto; position:relative; z-index:1; }
.quienes-text { font-size:clamp(1rem,1.4vw,1.08rem); line-height:1.9; color:var(--gris-texto); margin-bottom:1.75rem; }
.quienes-text strong { color:var(--verde-oscuro); font-weight:700; }
.quienes-highlight { background:white; border:2px solid rgba(240,212,104,.30); border-left:5px solid var(--sol-borde); border-radius:var(--radio); padding:2rem 2.5rem; margin-top:2.5rem; box-shadow:var(--sombra); }
.quienes-highlight p { line-height:1.85; margin:0; font-weight:500; }
.quienes-highlight i { margin-right:.4rem; color:var(--sol-oscuro); }
.text-highlight { color:var(--sol-oscuro); font-weight:800; }
.hero-subtitle { font-size:1.05rem; line-height:1.8; color:#3A4E5A; }

/* ============================================================ 12. MISIÓN / MODALES ============================================================ */
.mission-cards-section { padding:5rem 0 6rem; background:linear-gradient(180deg, var(--crema) 0%, var(--sol-claro) 60%, #FEFBE8 100%); }
.mission-cards-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:2rem; }
.mission-card { background:var(--blanco); padding:2.5rem 2rem; border-radius:var(--radio-grande); text-align:center; cursor:pointer; transition:all .35s ease; border:2px solid var(--crema-oscuro); position:relative; overflow:hidden; box-shadow:0 2px 16px rgba(240,212,104,.08); }
.mission-card::after { content:''; position:absolute; top:0; left:0; width:100%; height:4px; background:linear-gradient(90deg,var(--sol-borde),var(--verde)); transform:scaleX(0); transition:transform .35s ease; }
.mission-card:hover { transform:translateY(-8px); box-shadow:var(--sombra-hover); border-color:var(--sol-borde); }
.mission-card:hover::after { transform:scaleX(1); }
.card-icon i { font-size:3.5rem; color:var(--verde); }
.card-icon { margin-bottom:1.5rem; }
.mission-card h3 { font-family:var(--fuente-titulo); font-size:1.5rem; margin-bottom:.9rem; color:var(--verde-oscuro); }
.mission-card p { font-size:.98rem; color:#666; line-height:1.7; }
.arrow-down { margin-top:1.2rem; font-size:1.4rem; color:var(--sol-oscuro); }

/* Modal base */
.modal { display:none; position:fixed; z-index:1000; inset:0; background:rgba(30,58,16,.50); backdrop-filter:blur(4px); animation:fadeIn .3s ease; }
.modal.show { display:flex; align-items:center; justify-content:center; }
.modal-content { background:white; padding:3.5rem 3rem 2.5rem; border-radius:var(--radio-grande); max-width:680px; width:90%; max-height:90vh; overflow-y:auto; position:relative; animation:slideIn .3s ease; border-top:5px solid var(--sol-borde); }
.modal-content .modal-corn-leaf { position:absolute; pointer-events:none; z-index:0; }

/* ── BOTÓN X en modales de nosotros ── */
.modal-content .close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--verde-oscuro);
    border: 2.5px solid var(--sol-borde);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    font-weight: bold;
    color: white;
    cursor: pointer;
    transition: all .25s ease;
    z-index: 999;
    box-shadow: 0 4px 18px rgba(0,0,0,.30);
    line-height: 1;
    text-decoration: none;
}
.modal-content .close:hover { background:var(--sol-borde); color:var(--verde-oscuro); transform:scale(1.12) rotate(90deg); }
.modal-content h2 { font-family:var(--fuente-titulo); color:var(--verde-oscuro); margin-bottom:1.5rem; font-size:1.8rem; position:relative; z-index:1; }
.modal-content p { font-size:1rem; line-height:1.85; color:#555; margin-bottom:1rem; position:relative; z-index:1; }
.modal-content p:last-child { margin-bottom:0; }

/* ============================================================ 13. EQUIPO ============================================================ */
.team-section { padding:5rem 0 6rem; background:linear-gradient(180deg,#FEFBE8 0%,var(--crema) 50%, #F5F0E0 100%); }
.team-title { font-family:var(--fuente-titulo); font-size:clamp(1.8rem,3vw,2.4rem); color:var(--verde-oscuro); margin-bottom:1rem; }
.team-subtitle { max-width:860px; margin:0 auto 3rem; font-size:1.05rem; line-height:1.8; color:#666; text-align:left; }
.team-tabs { margin-bottom:3rem; display:flex; justify-content:center; gap:1rem; flex-wrap:wrap; }
.tab-button { padding:.8rem 2rem; background:transparent; border:2.5px solid var(--verde); color:var(--verde-oscuro); font-family:var(--fuente-cuerpo); font-weight:700; font-size:.95rem; cursor:pointer; border-radius:50px; transition:all .3s ease; }
.tab-button.active,.tab-button:hover { background:var(--verde); color:white; }
.team-group { display:none; }
.team-group.active { display:block; }
/* Fila centrada de 2 tarjetas */
.team-cards-centered-row {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-top: 2rem;
}
.team-cards-centered-row .team-card {
    flex: 0 0 calc(25% - 1.5rem);
    max-width: calc(25% - 1.5rem);
}

/* Etiquetas de sección dentro del tab: Fundadores / Equipo */
.team-section-label {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 1.2rem;
    margin-bottom: 2rem;
}
.team-section-label::before,
.team-section-label::after {
    content: '';
    flex: 1;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--sol-borde), transparent);
    border-radius: 2px;
}
.team-section-word {
    font-family: var(--fuente-titulo);
    font-size: 2.4rem;
    font-weight: 800;
    color: var(--verde-oscuro);
    letter-spacing: .04em;
    white-space: nowrap;
    text-transform: uppercase;
    opacity: .85;
}

.team-cards-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(190px,1fr)); gap:2rem; }

/* Equipo: 4 fijas arriba, 3 centradas abajo */
.equipo-grid { grid-template-columns:repeat(4, 1fr); }

/* Voluntarios: flex wrap centrado, 5 por fila, últimas 2 centradas automáticamente */
.voluntarios-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2rem;
}
.voluntarios-grid .team-card {
    flex: 0 1 calc(20% - 1.7rem);
    min-width: 170px;
    max-width: 220px;
}
.team-card { text-align:center; padding:1.75rem 1.25rem; background:white; border-radius:var(--radio); transition:all .3s ease; position:relative; border:2px solid transparent; }
.team-card:hover { transform:translateY(-6px); box-shadow:var(--sombra-hover); border-color:var(--sol-borde); }
.team-card img { width:150px; height:150px; border-radius:50%; margin:0 auto 1rem; border:4px solid var(--sol-borde); object-fit:cover; cursor:pointer; transition:transform .3s; }
.team-card img:hover { transform:scale(1.05); }
.team-card .name { font-weight:800; font-size:1rem; color:var(--verde-oscuro); margin-bottom:.4rem; text-align:center; }
.team-card .role { font-size:.86rem; color:var(--gris-claro); font-weight:500; text-align:center; line-height:1.4; }
.team-card .role-title { font-weight:600; color:var(--verde-oscuro); }
.team-card .photo-upload { position:absolute; top:10px; right:10px; background:var(--sol-borde); color:var(--verde-oscuro); border:none; border-radius:50%; width:34px; height:34px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .3s ease; box-shadow:0 2px 8px rgba(0,0,0,.18); }
.team-card .photo-upload:hover { transform:scale(1.12); background:var(--verde); color:white; }
.team-card .photo-upload input { display:none; }

/* ============================================================ 14. CONTACTO ============================================================ */
.contact-hero-section { padding:5rem 0 6rem; background:linear-gradient(160deg,#2A5018 0%,var(--verde) 50%, #4A7A28 100%); color:white; position:relative; overflow:hidden; }
.contact-hero-section::before { content:''; position:absolute; top:-60px; right:-60px; width:300px; height:300px; border-radius:50%; background:rgba(255,255,255,.04); }
.contact-hero-section .hero-title { color:white; font-size:clamp(1.8rem,3.5vw,2.6rem); margin-bottom:1.25rem; }
.contact-hero-section .hero-subtitle { font-size:1.05rem; line-height:1.8; color:rgba(255,255,255,.88); max-width:820px; margin:0 auto 2rem; }
.hero-cta-box { background:rgba(255,255,255,.12); backdrop-filter:blur(8px); color:white; padding:1.2rem 2rem; border-radius:var(--radio); max-width:560px; margin:0 auto; text-align:center; font-weight:600; font-size:1rem; border:1px solid rgba(255,255,255,.2); }
.contact-main-section { padding:5rem 0 6rem; background:linear-gradient(180deg, #EAF6FF 0%, var(--crema) 60%, #FEFBE8 100%); }
.contact-grid { display:grid; grid-template-columns:1fr 1.25fr; gap:2.5rem; max-width:1200px; margin:0 auto; }
.contact-info-column { background:white; padding:2.5rem; border-radius:var(--radio-grande); box-shadow:var(--sombra); border-top:5px solid var(--verde); }
.contact-form-column { background:white; padding:2.5rem; border-radius:var(--radio-grande); box-shadow:var(--sombra); border-top:5px solid var(--sol-borde); }
.contact-item { display:flex; align-items:flex-start; gap:1.25rem; margin-bottom:2rem; padding-bottom:2rem; border-bottom:1px solid var(--crema-oscuro); }
.contact-item:last-of-type { border-bottom:none; }
.contact-icon-circle { width:52px; height:52px; background:var(--verde); border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.contact-icon-circle i { color:white; font-size:1.2rem; }
.contact-details h3 { font-size:1.1rem; font-weight:700; color:var(--verde-oscuro); margin-bottom:.3rem; }
.contact-details p { font-size:.98rem; color:#666; }
.location-section { margin-top:2rem; }
.location-title { font-family:var(--fuente-titulo); font-size:1.25rem; color:var(--verde-oscuro); margin-bottom:1rem; }
.map-container-new { width:100%; height:240px; border-radius:var(--radio); overflow:hidden; box-shadow:0 4px 16px rgba(0,0,0,.08); border:2px solid var(--crema-oscuro); }
.form-description { font-size:1rem; color:#777; margin-bottom:2rem; line-height:1.7; }
.contact-form-new,.contact-form { display:flex; flex-direction:column; gap:1.25rem; }
.form-row-new { display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
.form-group-new,.form-group { display:flex; flex-direction:column; }
.form-group-new label,.form-group label { font-weight:700; color:var(--verde-oscuro); margin-bottom:.5rem; font-size:.9rem; letter-spacing:.3px; }
.form-group-new input,.form-group-new select,.form-group-new textarea,.form-group input,.form-group select,.form-group textarea { padding:.9rem 1rem; border:2px solid #e5e5e5; border-radius:10px; font-family:var(--fuente-cuerpo); font-size:.98rem; color:var(--gris-texto); background:var(--crema); transition:all .3s ease; }
.form-group-new input:focus,.form-group-new select:focus,.form-group-new textarea:focus,.form-group input:focus,.form-group select:focus,.form-group textarea:focus { outline:none; border-color:var(--verde); box-shadow:0 0 0 3px rgba(74,122,40,.10); background:white; }
.form-group-new textarea,.form-group textarea { resize:vertical; min-height:120px; }
.btn-submit-new,.btn-submit { padding:1rem 2.5rem; background:var(--verde); color:white; border:none; border-radius:50px; font-family:var(--fuente-cuerpo); font-size:1rem; font-weight:700; cursor:pointer; transition:all .3s ease; display:inline-flex; align-items:center; justify-content:center; gap:.7rem; box-shadow:0 4px 16px rgba(74,122,40,.28); }
.btn-submit-new:hover,.btn-submit:hover { background:var(--verde-oscuro); transform:translateY(-3px); }
.form-footer { margin-top:2rem; padding:1.5rem; background:var(--crema); border-radius:var(--radio); border-left:4px solid var(--sol-borde); }
.form-footer p { font-size:.9rem; color:#666; margin-bottom:.5rem; display:flex; align-items:center; gap:.5rem; }
.form-footer p:last-child { margin-bottom:0; }
.form-footer i { color:var(--verde); }
.form-success-box { background:#f0faf0; border-left:5px solid #43a047; border-radius:var(--radio); padding:1.5rem; margin-top:1.5rem; }
.form-success-title { font-weight:800; color:#2e7d32; font-size:1.2rem; margin-bottom:.4rem; }
.form-success-subtitle { font-weight:500; color:#388e3c; margin-bottom:.75rem; }
.form-success-msg { font-size:.95rem; color:#388e3c; }
.form-notification { margin-top:1rem; padding:1rem 1.4rem; border-radius:var(--radio); font-size:.95rem; font-weight:600; animation:fadeInUp .4s ease; }
.form-notification--success { background:#f0faf0; color:#2e7d32; border-left:4px solid #43a047; }
.form-notification--error { background:#fce4ec; color:#c62828; border-left:4px solid #e53935; }

/* ============================================================ 15. FOOTER — Café verdoso, 3 columnas ============================================================ */
.main-footer {
    background: linear-gradient(168deg, #4a7e2a 0%, #366020 50%, #2a5018 100%);
    border-top: 4px solid var(--sol-borde);
    padding: 3.5rem 0 0;
    color: rgba(255,255,255,.88);
    position: relative;
    overflow: hidden;
}
.footer-container {
    max-width: 1300px; margin: 0 auto; padding: 0 2rem;
    display: grid;
    grid-template-columns: 1.1fr 1.6fr 0.9fr;
    gap: 3rem;
    margin-bottom: 3rem;
    align-items: start;
    position: relative; z-index: 1;
}
.footer-section { display:flex; flex-direction:column; }
.footer-logo-section { align-items:flex-start; }
.footer-logo { width:64px; height:64px; border-radius:50%; object-fit:contain; background:white; flex-shrink:0; margin-bottom:1rem; }
.footer-brand { font-family:var(--fuente-titulo); font-size:1.1rem; font-weight:700; color:white; margin:0 0 .25rem; line-height:1.3; }
.footer-heading { font-size:.75rem; font-weight:800; color:var(--sol-borde); text-transform:uppercase; letter-spacing:2.5px; margin-bottom:1.25rem; }
.footer-description { font-size:.92rem; line-height:1.85; color:rgba(255,255,255,.62); }
.footer-brand-row { display:flex; align-items:center; gap:.9rem; margin-bottom:1.4rem; cursor:pointer; }
.footer-brand-row .footer-logo { margin-bottom:0; flex-shrink:0; }
.footer-logo-section a:hover .footer-brand { color:var(--sol-borde); }
.footer-logo-section a:hover .footer-logo { box-shadow:0 0 0 3px rgba(240,180,50,.35); }

/* Iconos sociales MÁS SEPARADOS */
.footer-social-icons {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;                               /* más espacio entre iconos */
    padding-top: 1.2rem;
    border-top: 1px solid rgba(255,255,255,.14);
}
.social-icon { width:42px; height:42px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:rgba(255,255,255,.11); border:1.5px solid rgba(255,255,255,.18); color:rgba(255,255,255,.85); font-size:.95rem; text-decoration:none; transition:all .22s cubic-bezier(.34,1.56,.64,1); }
.social-icon:hover { transform:translateY(-4px) scale(1.1); border-color:transparent; color:white; }
.social-icon--instagram:hover { background:linear-gradient(135deg,#833ab4,#fd1d1d,#fcb045); }
.social-icon--facebook:hover { background:#1877f2; }
.social-icon--tiktok:hover { background:#010101; box-shadow:0 0 0 1.5px #69c9d0; }
.social-icon--x { font-size:.88rem; }
.social-icon--x:hover { background:#000; }
.social-icon--youtube:hover { background:#ff0000; }
.social-icon--linkedin:hover { background:#0a66c2; }

.footer-links { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.75rem; }
.footer-link { font-size:.95rem; font-weight:600; color:rgba(255,255,255,.70); text-decoration:none; transition:all .3s ease; display:flex; align-items:center; gap:.5rem; }
.footer-link::before { content:'→'; color:var(--sol-borde); transition:transform .3s; }
.footer-link:hover { color:var(--sol-medio); transform:translateX(4px); }
.footer-bottom { max-width:1300px; margin:0 auto; padding:1.5rem 2rem; border-top:1px solid rgba(255,255,255,.10); text-align:center; position:relative; z-index:1; }
.footer-bottom p { font-size:.86rem; color:rgba(255,255,255,.40); margin:0; }

/* ============================================================ 16. WHATSAPP ============================================================ */
.whatsapp-float { position:fixed; bottom:24px; right:24px; z-index:9999; display:flex; align-items:center; text-decoration:none; }
.whatsapp-btn-circle { width:62px; height:62px; border-radius:50%; background:var(--wa-green); display:flex; align-items:center; justify-content:center; font-size:2.2rem; color:white; flex-shrink:0; box-shadow:0 4px 16px rgba(37,211,102,.45),0 2px 6px rgba(0,0,0,.18); transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease; position:relative; }
.whatsapp-btn-circle::before { content:''; position:absolute; inset:-7px; border-radius:50%; background:var(--wa-green); opacity:0; animation:waPulse 2.6s ease-out infinite; }
.whatsapp-float:hover .whatsapp-btn-circle { transform:scale(1.1); }
.whatsapp-tooltip { background:#1C1C1C; color:white; padding:9px 16px; border-radius:10px; font-size:.84rem; font-weight:700; white-space:nowrap; position:absolute; right:calc(100% + 14px); top:50%; transform:translateY(-50%) translateX(10px); opacity:0; pointer-events:none; transition:all .25s ease; box-shadow:0 4px 18px rgba(0,0,0,.28); }
.whatsapp-tooltip::after { content:''; position:absolute; top:50%; right:-6px; transform:translateY(-50%); border:6px solid transparent; border-left-color:#1C1C1C; border-right:0; }
.whatsapp-float:hover .whatsapp-tooltip { opacity:1; transform:translateY(-50%) translateX(0); }

/* ============================================================ 17. RESPONSIVE ============================================================ */

@media (max-width:1100px) {
    .container { max-width:960px; }
    .donation-grid { grid-template-columns:1fr; max-width:480px; margin:0 auto; }
    .donation-card-featured { transform:none; }
}
@media (max-width:968px) {
    .header-nav { position:fixed; top:0; right:-110%; width:min(88vw,320px); height:100dvh; background:#fff; padding:0; box-shadow:-12px 0 60px rgba(0,0,0,.2); transition:right .4s cubic-bezier(.16,1,.3,1); z-index:1000; display:flex; flex-direction:column; overflow-y:auto; }
    .header-nav.active { right:0; }
    .header-nav::before { content:'Navegación'; display:flex; align-items:center; flex-shrink:0; position:sticky; top:0; padding:1.2rem 1.5rem; background:linear-gradient(135deg,var(--verde-oscuro) 0%,var(--verde) 100%); color:white; font-family:var(--fuente-titulo); font-size:1rem; font-weight:700; letter-spacing:.5px; border-bottom:3px solid var(--sol-borde); z-index:2; }
    .nav-list { flex-direction:column; align-items:stretch; gap:0; padding:1rem 0 2rem; flex:1; }
    .nav-list li { padding:0 1rem; }
    .nav-link { display:flex; align-items:center; gap:.8rem; font-size:1rem; font-weight:700; color:var(--verde-oscuro); padding:.9rem 1rem; border-radius:12px; width:100%; letter-spacing:.5px; }
    .nav-link::before { content:''; width:8px; height:8px; border-radius:50%; background:var(--sol-borde); flex-shrink:0; }
    .nav-link::after { display:none; }
    .nav-link:hover { background:rgba(74,122,40,.07); color:var(--sol-oscuro); transform:translateX(4px); }
    .mobile-menu-toggle { display:flex !important; }
    .header-nav::after { content:'Frutos de Mis Raíces'; display:block; text-align:center; padding:1.2rem; color:rgba(74,122,40,.35); font-family:var(--fuente-titulo); font-size:.75rem; letter-spacing:1px; border-top:1px solid rgba(74,122,40,.10); margin-top:auto; }
    body::before { content:''; position:fixed; inset:0; background:rgba(30,58,16,.6); backdrop-filter:blur(3px); opacity:0; visibility:hidden; transition:all .4s ease; z-index:999; }
    body.menu-open::before { opacity:1; visibility:visible; }
    body.menu-open { overflow:hidden; }
    .hero-container { grid-template-columns:1fr; text-align:center; }
    .hero-image { order:-1; max-width:500px; margin:0 auto; }
    .hero-cta { justify-content:center; }
    .floating-card { display:none; }
    .contact-grid { grid-template-columns:1fr; }
    .form-row-new { grid-template-columns:1fr; }
    .mission-cards-grid { grid-template-columns:1fr; }
}
/* ============================================================
   RESPONSIVE — 768px
   ============================================================ */
@media (max-width:768px) {
    body { overflow-x:hidden; }

    /* Header */
    .header-logo { width:44px; height:44px; }
    .header-logo-section { gap:.5rem; }
    .header-title { font-size:.75rem; line-height:1.2; }

    /* Hero */
    .hero-section { padding:4rem 0 3rem; min-height:auto; }
    .hero-title { font-size:clamp(1.8rem,6vw,2.6rem); margin-bottom:1rem; }
    .hero-description { font-size:.97rem; line-height:1.7; margin-bottom:1.5rem; }
    .hero-badge { margin-bottom:1.25rem; }

    /* Secciones generales */
    .section-title { font-size:1.6rem; margin-bottom:.75rem; }
    .section-description { font-size:.95rem; line-height:1.65; text-align:center; }
    .section-header { margin-bottom:2rem; }

    /* Donation */
    .donation-options-section { padding:3.5rem 0 3rem; }
    .donation-grid { grid-template-columns:1fr; max-width:100%; gap:1.25rem; }
    .donation-card { padding:1.75rem 1.5rem; }
    .donation-title { font-size:1.35rem; margin-bottom:.65rem; }
    .donation-description { font-size:.93rem; margin-bottom:1.5rem; }

    /* Partners / Aliados */
    .partners-section { padding:3.5rem 0 3rem; }
    .partners-trust-line { margin:1.5rem 0 2rem; }
    .partners-marquee-wrapper { padding:1rem 0 2rem; }
    .partners-marquee-track { gap: 160px; }
    .partner-logo-card { width: 180px; height: 130px; }

    /* Nosotros */
    .quienes-hero { padding:4.5rem 0 3rem; }
    .quienes-subtitle { margin-bottom:1.75rem; font-size:1.1rem; }
    .quienes-text { font-size:.97rem; line-height:1.75; margin-bottom:1.25rem; }
    .quienes-highlight { padding:1.5rem; margin-top:1.75rem; }
    .mission-cards-section { padding:3rem 0 3.5rem; }
    .mission-card { padding:1.75rem 1.5rem; }
    .mission-card h3 { font-size:1.25rem; margin-bottom:.65rem; }

    /* Equipo */
    .team-section { padding:3rem 0 3.5rem; }
    .team-title { font-size:1.6rem; margin-bottom:.75rem; }
    .team-subtitle { font-size:.95rem; line-height:1.65; margin-bottom:2rem; }
    .team-tabs { margin-bottom:2rem; gap:.75rem; }
    .team-cards-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; }
    .equipo-grid { grid-template-columns:repeat(2,1fr); }
    .voluntarios-grid { display:flex; flex-wrap:wrap; gap:.75rem; }
    .voluntarios-grid .team-card { flex:0 1 calc(50% - .4rem); min-width:0; max-width:none; }
    .team-cards-centered-row { display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; margin-top:.75rem; }
    .team-cards-centered-row .team-card { flex:unset; max-width:100%; }
    .team-card { display:flex; flex-direction:column; align-items:center; padding:.9rem .6rem; text-align:center; }
    .team-card img { width:80px; height:80px; margin:0 auto .7rem; flex-shrink:0; border-width:3px; }
    .team-card .name { font-size:.82rem; text-align:center; margin-bottom:2px; }
    .team-card .role { font-size:.72rem; text-align:center; line-height:1.35; }
    .team-card .photo-upload { top:6px; right:6px; width:26px; height:26px; font-size:.65rem; }

    /* Contacto */
    .contact-hero-section { padding:3.5rem 0 3rem; }
    .contact-hero-section .hero-title { font-size:clamp(1.5rem,5vw,2rem); margin-bottom:.9rem; }
    .contact-hero-section .hero-subtitle { font-size:.95rem; }
    .contact-main-section { padding:3rem 0 3.5rem; }
    .contact-grid { grid-template-columns:1fr; gap:1.5rem; }
    .contact-info-column, .contact-form-column { padding:1.75rem 1.5rem; }
    .contact-item { gap:.9rem; margin-bottom:1.25rem; padding-bottom:1.25rem; }
    .contact-details h3 { font-size:1rem; }
    .contact-details p { font-size:.9rem; }

    /* Modal */
    .modal-content { padding:2rem 1.5rem; }

    /* Footer */
    .main-footer { padding:2.5rem 0 0; }
    .footer-container { grid-template-columns:1fr; text-align:center; gap:1.75rem; padding:0 1.5rem 2rem; }
    .footer-logo-section { align-items:center; }
    .footer-brand-row { justify-content:center; flex-direction:column; align-items:center; gap:.6rem; }
    .footer-brand-row .footer-logo { width:64px; height:64px; object-fit:contain; border-radius:50%; background:white; border:none; box-shadow:0 2px 10px rgba(0,0,0,0.15); }
    .footer-logo { width:64px; height:64px; object-fit:contain; border-radius:50%; background:white; border:none; box-shadow:0 2px 10px rgba(0,0,0,0.15); }
    .footer-brand { font-size:1rem; }
    .footer-heading { margin-bottom:.9rem; }
    .footer-description { font-size:.9rem; line-height:1.7; }
    .footer-social-icons { justify-content:center; gap:.6rem; flex-wrap:wrap; }
    .footer-link::before { display:none; }
    .footer-links { align-items:center; gap:.65rem; }
    .footer-link { justify-content:center; font-size:.9rem; }
    .footer-bottom { padding:1.25rem 1.5rem; }
    .footer-bottom p { font-size:.8rem; }

    /* Misc */
    .hide-mobile { display:none !important; }
    .show-mobile { display:block !important; }
    .whatsapp-btn-circle { width:54px; height:54px; font-size:1.9rem; }
    .whatsapp-tooltip { display:none; }
    .partner-modal-box { max-width:96%; }
    .partner-modal-logo-zone { padding:2rem; min-height:130px; }
    .partner-modal-body { padding:1.5rem; }
    .partner-modal-socials { padding:1rem 1.5rem; }
}

/* ============================================================
   RESPONSIVE — 480px
   ============================================================ */
@media (max-width:480px) {
    .container { padding:0 1.1rem; }

    /* Header */
    .header-logo { width:40px; height:40px; }
    .header-title { font-size:.7rem; }
    .header-logo-section { gap:.25rem; }

    /* Hero */
    .hero-section { padding:3.5rem 0 2.5rem; }
    .hero-title { font-size:clamp(1.6rem,7vw,2.2rem); }
    .hero-description { font-size:.93rem; }
    .hero-cta { flex-direction:column; }
    .btn { width:100%; text-align:center; }

    /* Secciones */
    .donation-options-section { padding:2.75rem 0 2.5rem; }
    .partners-section { padding:2.75rem 0 2.5rem; }
    .quienes-hero { padding:4rem 0 2.5rem; }
    .mission-cards-section { padding:2.5rem 0 3rem; }
    .team-section { padding:2.5rem 0 3rem; }
    .contact-hero-section { padding:3rem 0 2.5rem; }
    .contact-main-section { padding:2.5rem 0 3rem; }
    .contact-info-column, .contact-form-column { padding:1.5rem 1.2rem; }

    /* Equipo */
    .team-cards-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.6rem; }
    .equipo-grid { grid-template-columns:repeat(2,1fr); }
    .voluntarios-grid { display:flex; flex-wrap:wrap; gap:.6rem; }
    .voluntarios-grid .team-card { flex:0 1 calc(50% - .3rem); min-width:0; max-width:none; }
    .team-cards-centered-row { display:grid; grid-template-columns:repeat(2,1fr); gap:.6rem; margin-top:.6rem; }
    .team-cards-centered-row .team-card { flex:unset; max-width:100%; }
    .tab-button { display:block; width:100%; margin:.3rem 0; }
    .team-tabs { margin-bottom:1.5rem; }
    .team-card { display:flex; flex-direction:column; align-items:center; padding:.75rem .5rem; text-align:center; }
    .team-card img { width:68px; height:68px; margin:0 auto .55rem; flex-shrink:0; border-width:2.5px; }
    .team-card .name { font-size:.78rem; text-align:center; margin-bottom:2px; }
    .team-card .role { font-size:.69rem; text-align:center; line-height:1.3; }
    .team-card .photo-upload { top:5px; right:5px; width:22px; height:22px; font-size:.58rem; }
    .team-section-word { font-size:1.6rem; }

    /* Modal en móvil */
    .modal-content {
        padding: 3rem 1.25rem 1.75rem;
        width: 95%;
        max-height: 88vh;
        overflow-y: auto;
    }
    .modal-content .close {
        top: .6rem;
        right: .6rem;
        width: 36px;
        height: 36px;
        font-size: .85rem;
    }
    .modal-content h2 { font-size: 1.35rem; margin-bottom: 1rem; }
    .modal-content p { font-size: .93rem; line-height: 1.65; }

    /* Marquee en móvil */
    .partners-marquee-track { gap: 100px; }
    .partner-logo-card { width: 160px; height: 110px; }
    .plc-fallback { font-size: .85rem; }

    /* Footer */
    .footer-container { padding:0 1.1rem 1.75rem; gap:1.5rem; }
    .footer-bottom { padding:1rem 1.1rem; }
}