        /* ── HERO ── */
        .page-hero {
            background:var(--crema); border-bottom:1px solid var(--borde);
            padding:72px 48px 64px;
        }
        .page-hero-inner { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; }
        .hero-eyebrow {
            display:inline-flex; align-items:center; gap:10px;
            font-size:.95rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase;
            color:var(--texto-2); margin-bottom:24px;
        }
        .hero-eyebrow-dot { width:10px; height:10px; border-radius:50%; background:var(--amarillo); animation:pulse 2.4s ease-in-out infinite; }
        @keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.35;transform:scale(.65)} }
        .page-hero { background:var(--crema); }
        .page-hero h1 { font-size:clamp(2.4rem, 5vw, 3.6rem); font-weight:900; letter-spacing:-.03em; margin-bottom:16px; line-height:1.05; text-transform:uppercase; }
        .page-hero h1 span { color:var(--coral); }
        .page-hero p { color:var(--texto-2); font-size:clamp(1.05rem, 1.4vw, 1.25rem); line-height:1.55; max-width:640px; }
        .hero-stats-pills { display:flex; gap:10px; flex-wrap:wrap; margin-top:28px; }
        .stat-pill { display:flex; align-items:center; gap:8px; font-size:.95rem; font-weight:600; color:var(--texto-2); background:white; border:1px solid var(--borde); padding:9px 16px; border-radius:50px; }
        .stat-pill strong { color:var(--texto); font-weight:700; }
        .stat-pill-dot { width:8px; height:8px; border-radius:50%; }

        /* ── SECCIONES ── */
        .section { padding:64px 48px; }
        .section + .section { padding-top:0; }
        .section-divider { border:none; border-top:1px solid var(--borde); margin:0 48px; max-width:1060px; }
        .section-label { font-size:.95rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--coral); margin-bottom:10px; }
        .section-title { font-size:clamp(2rem, 4vw, 2.6rem); font-weight:900; letter-spacing:-.02em; margin-bottom:10px; text-transform:uppercase; line-height:1.05; }
        .section-desc { color:var(--texto-2); font-size:1.1rem; line-height:1.55; margin-bottom:36px; max-width:680px; }

        /* ── GENERADOR DE CARTELES ── */
        .cartel-section { background:white; border-top:1px solid var(--borde); border-bottom:1px solid var(--borde); padding:64px 48px; }
        .cartel-section.locked { background:var(--crema); }
        .cartel-locked-actions { display:flex; flex-direction:column; gap:18px; margin-top:4px; align-items:flex-start; }
        .cartel-locked-note { font-size:1rem; color:var(--texto-2); }
        .cartel-locked-btns { display:flex; gap:12px; flex-wrap:wrap; }
        .btn-secondary-pill { display:inline-flex; align-items:center; gap:8px; background:transparent; color:var(--texto); border:1.5px solid var(--texto); font-size:.95rem; font-weight:700; padding:11px 22px; border-radius:6px; text-decoration:none; transition:background .15s, color .15s; }
        .btn-secondary-pill:hover { background:var(--texto); color:var(--crema); }
        .btn-primary-pill { display:inline-flex; align-items:center; gap:8px; background:var(--coral); color:#fff; font-size:.95rem; font-weight:700; padding:11px 22px; border-radius:6px; text-decoration:none; box-shadow:0 4px 16px rgba(247,108,94,.25); transition:background .15s, transform .15s, box-shadow .15s; }
        .btn-primary-pill:hover { background:var(--coral);filter:brightness(.88); transform:translateY(-1px); box-shadow:0 6px 20px rgba(247,108,94,.35); }
        .cartel-inner { }
        /* selector de formatos */
        .formatos-row { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-top:28px; margin-bottom:24px; }
        .formato-chip { display:flex; flex-direction:column; align-items:center; gap:5px; padding:14px 8px; border:1.5px solid var(--borde); border-radius:12px; cursor:pointer; background:white; transition:all .15s; text-align:center; }
        .formato-chip:hover { border-color:var(--coral); background:rgba(247,108,94,.04); }
        .formato-chip.sel { border-color:var(--coral); background:rgba(247,108,94,.07); box-shadow:0 0 0 3px rgba(247,108,94,.08); }
        .formato-chip .fc-icon { width:28px; height:28px; color:var(--coral); display:flex; align-items:center; justify-content:center; }
        .formato-chip .fc-icon svg { width:22px; height:22px; }
        .formato-chip.sel .fc-icon { color:var(--coral); }
        .formato-chip .fc-name { font-size:.8rem; font-weight:700; color:var(--dark); }
        .formato-chip .fc-dims { font-size:.8rem; color:var(--texto-2); }

        /* layout formulario + preview */
        .cartel-layout { display:grid; grid-template-columns:1fr 440px; gap:32px; align-items:start; }
        .cartel-form { display:flex; flex-direction:column; gap:14px; }
        .campo { display:flex; flex-direction:column; gap:6px; }
        .campo label { font-size:.95rem; font-weight:600; color:var(--dark); }
        .campo input, .campo select, .campo textarea { padding:10px 14px; border:1.5px solid var(--borde); border-radius:10px; font-size:.9rem; font-family:inherit; color:var(--dark); background:var(--bg); transition:border-color .2s,box-shadow .2s; }
        .campo input:focus, .campo select:focus, .campo textarea:focus { outline:none; border-color:var(--coral); background:white; box-shadow:0 0 0 3px rgba(247,108,94,.08); }
        .campo-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
        .upload-area { border:2px dashed var(--borde); border-radius:12px; padding:24px; text-align:center; cursor:pointer; background:var(--bg); transition:border-color .2s,background .2s; }
        .upload-area:hover { border-color:var(--coral); background:rgba(247,108,94,.03); }
        .upload-area input { display:none; }
        .upload-icon { width:40px; height:40px; margin:0 auto 8px; color:var(--texto-2); }
        .upload-text { font-size:.95rem; color:var(--texto-2); }
        .upload-text strong { color:var(--coral); }
        .btn-generar { background:var(--coral); color:white; border:none; border-radius:6px; padding:14px 28px; font-size:1rem; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px; box-shadow:0 3px 14px rgba(247,108,94,.28); transition:transform .15s,box-shadow .15s; }
        .btn-generar:hover { transform:translateY(-1px); box-shadow:0 6px 20px rgba(247,108,94,.35); }
        .cartel-preview-wrap { position:sticky; top:88px; background:var(--bg); border:1px solid var(--borde); border-radius:16px; padding:20px; display:flex; flex-direction:column; align-items:center; gap:14px; }
        .preview-label { font-size:.8rem; font-weight:700; letter-spacing:.8px; text-transform:uppercase; color:var(--texto-2); }
        #cartelCanvas { border-radius:10px; box-shadow:0 4px 20px rgba(22,22,43,.12); display:block; max-width:100%; height:auto; }
        .preview-btns { display:flex; gap:8px; width:100%; }
        .btn-dl { flex:1; padding:11px; border:none; border-radius:6px; font-size:.88rem; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:6px; transition:transform .15s,box-shadow .15s; }
        .btn-dl:hover { transform:translateY(-1px); }
        .btn-dl-png { background:var(--coral); color:white; box-shadow:0 2px 10px rgba(247,108,94,.25); }
        .btn-dl-png:hover { box-shadow:0 4px 16px rgba(247,108,94,.35); }
        .btn-dl-share { background:var(--bg); color:var(--coral); border:1.5px solid rgba(247,108,94,.25); }
        .btn-dl-share:hover { border-color:var(--coral); }

        /* ── RECURSOS ── */
        .recursos-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
        .recurso-card { background:white; border:1px solid var(--borde); border-radius:16px; padding:24px; display:flex; flex-direction:column; gap:12px; transition:box-shadow .2s,border-color .2s; }
        .recurso-card:hover { box-shadow:0 4px 20px rgba(247,108,94,.10); border-color:rgba(247,108,94,.2); }
        .recurso-icon { width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center; background:rgba(246,142,95,.12); }
        .recurso-icon svg { width:22px; height:22px; stroke:var(--tangerine); }
        .recurso-title { font-size:1.2rem; font-weight:800; color:var(--texto); }
        .recurso-desc { font-size:1rem; color:var(--texto-2); line-height:1.55; flex:1; }
        .recurso-link { display:inline-flex; align-items:center; gap:6px; font-size:.95rem; font-weight:700; text-decoration:none; color:var(--coral); transition:gap .15s; }
        .recurso-link:hover { gap:8px; }

        /* ── CONSEJOS ── */
        .consejos-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
        .consejo-card { background:white; border:1px solid var(--borde); border-radius:16px; padding:24px 28px; display:flex; gap:16px; align-items:flex-start; }
        .consejo-num { width:44px; height:44px; border-radius:12px; flex-shrink:0; background:rgba(246,142,95,.12); color:var(--tangerine); display:flex; align-items:center; justify-content:center; font-size:1.15rem; font-weight:900; }
        .consejo-title { font-size:1.2rem; font-weight:800; margin-bottom:6px; }
        .consejo-text { font-size:1.05rem; color:var(--texto-2); line-height:1.55; }
        .consejo-tag {
            display:inline-block; margin-top:14px;
            font-size:.95rem; font-weight:700; letter-spacing:1px; text-transform:uppercase;
            color:var(--texto); padding:0 .15em;
            background-image: linear-gradient(var(--amarillo), var(--amarillo));
            background-size: 100% 0.5em;
            background-position: 0 92%;
            background-repeat: no-repeat;
        }

        /* ── REENCUENTROS ── */

        /* ── PROTECTORAS ── */
        .prot-filtros { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:28px; align-items:center; }
        .prot-filtros select { padding:10px 16px; border:1.5px solid var(--borde); border-radius:8px; font-size:.95rem; background:white; color:var(--texto); cursor:pointer; }
        .prot-filtros select:focus { outline:none; border-color:var(--coral); }
        .prot-filtros button { padding:10px 22px; background:var(--coral); color:#fff; border:none; border-radius:6px; font-size:.95rem; font-weight:700; cursor:pointer; box-shadow:0 4px 16px rgba(247,108,94,.25); transition:background .15s, transform .15s; }
        .prot-filtros button:hover { background:var(--coral);filter:brightness(.88); transform:translateY(-1px); }
        .prot-filtros a { font-size:.95rem; color:var(--texto-2); text-decoration:none; }
        .prot-filtros a:hover { color:var(--coral); }
        .prot-count { margin-left:auto; font-size:.95rem; color:var(--texto-2); }

        .prot-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
        .prot-card {
            background:white; border:1px solid var(--borde); border-radius:16px;
            overflow:hidden; display:flex; flex-direction:column;
            text-decoration:none; color:inherit;
            transition:box-shadow .2s, transform .2s;
        }
        .prot-card:hover { box-shadow:0 4px 20px rgba(13,13,24,.08); transform:translateY(-2px); }
        .prot-card-img {
            height:130px; background:var(--crema);
            display:flex; align-items:center; justify-content:center;
            overflow:hidden; position:relative;
        }
        .prot-card-img img { width:100%; height:100%; object-fit:cover; }
        .prot-card-img .prot-placeholder { width:48px; height:48px; color:var(--texto-2); opacity:.5; }
        .prot-card-img .prot-placeholder svg { width:100%; height:100%; }
        .prot-badge-tipo {
            position:absolute; top:8px; left:8px;
            background:var(--texto); color:#fff;
            font-size:.8rem; font-weight:700; padding:3px 11px; border-radius:20px;
            text-transform:uppercase; letter-spacing:.05em;
        }
        .prot-badge-tipo.santuario { background:var(--tangerine); color:#fff; }
        .prot-badge-tipo.asociacion { background:var(--amarillo); color:var(--texto); }
        .prot-badge-tipo.refugio { background:var(--coral); color:#fff; }
        .prot-badge-tipo.fundacion { background:var(--texto); color:#fff; }
        .prot-badge-ver {
            position:absolute; top:8px; right:8px;
            background:var(--tangerine); color:#fff;
            width:22px; height:22px; border-radius:50%;
            display:flex; align-items:center; justify-content:center;
        }
        .prot-body { padding:14px 16px 16px; flex:1; display:flex; flex-direction:column; gap:6px; }
        .prot-nombre { font-size:1.15rem; font-weight:800; }
        .prot-lugar { font-size:.95rem; color:var(--texto-2); display:flex; align-items:center; gap:5px; }
        .prot-lugar svg { width:13px; height:13px; flex-shrink:0; stroke:var(--texto-2); }
        .prot-link-chip svg { width:12px; height:12px; flex-shrink:0; vertical-align:middle; margin-right:4px; }
        .prot-desc { font-size:1rem; color:var(--texto-2); line-height:1.55; flex:1;
            display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
        .prot-links { display:flex; flex-wrap:wrap; gap:6px; margin-top:4px; }
        .prot-link-chip {
            font-size:.95rem; font-weight:600; padding:4px 12px;
            border-radius:20px; text-decoration:none;
            background:white; border:1.5px solid var(--texto);
            color:var(--texto);
            display:inline-flex; align-items:center;
        }

        .prot-empty { text-align:center; padding:48px 24px; color:var(--texto-2); font-size:1rem; }
        .prot-cta {
            margin-top:48px; padding:36px 24px; text-align:center;
            border-top:1px solid var(--borde);
            display:flex; flex-direction:column; align-items:center; gap:8px;
        }
        .prot-cta-eyebrow { font-size:.95rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--coral); }
        .prot-cta p { font-size:1.2rem; color:var(--texto); font-weight:600; max-width:560px; line-height:1.4; margin-bottom:20px; }
        .prot-cta a { display:inline-block; padding:14px 30px; background:var(--coral); color:#fff; border-radius:6px; font-weight:700; text-decoration:none; font-size:1rem; box-shadow:0 4px 16px rgba(247,108,94,.25); transition:background .15s, transform .15s; }
        .prot-cta a:hover { background:var(--coral);filter:brightness(.88); transform:translateY(-1px); }

        /* ── RESPONSIVE ── */
        @media (max-width:900px) {
            .page-hero { padding:36px 20px 28px; }
            .cartel-section { padding:40px 20px; }
            .section { padding:40px 20px; }
            .section-divider { margin:0 20px; }
            .formatos-row { grid-template-columns:repeat(3,1fr); }
            .cartel-layout { grid-template-columns:1fr; }
            .cartel-preview-wrap { position:static; }
            .recursos-grid { grid-template-columns:1fr 1fr; }
            .reencuentros-grid { grid-template-columns:1fr 1fr; }
            .consejos-grid { grid-template-columns:1fr; }
            .page-hero-inner { flex-direction:column; align-items:flex-start; }
        }
        @media (max-width:600px) {
            .recursos-grid { grid-template-columns:1fr; }
            .reencuentros-grid { grid-template-columns:1fr; }
            .campo-row { grid-template-columns:1fr; }
            .formatos-row { grid-template-columns:repeat(2,1fr); }
            .prot-grid { grid-template-columns:1fr; }
            .prot-count { margin-left:0; }
        }
        @media (max-width:900px) and (min-width:601px) {
            .prot-grid { grid-template-columns:repeat(2,1fr); }
        }
