/* ==========================================================================
   PJC · Design System del sitio público — Capillas Memoriales
   Paleta corporativa existente, tipografía Roboto / Roboto Slab.
   Se carga DESPUÉS del tema Limitless para poder sobrescribirlo.
   ========================================================================== */

:root{
    /* ---- Marca ---- */
    --pjc-navy:#00004c;
    --pjc-navy-800:#0d1a52;
    --pjc-navy-600:#243066;
    --pjc-steel:#374c67;
    --pjc-bronze:#8D805E;
    --pjc-bronze-dark:#6f6448;
    --pjc-gold:#baa059;
    --pjc-sand:#e8e1bc;
    --pjc-sand-soft:#f5f1e2;
    --pjc-purple:#5D4180;

    /* ---- Neutros ---- */
    --pjc-ink:#15161c;
    --pjc-body:#585b66;
    --pjc-muted:#8a8d97;
    --pjc-line:#e5e2da;
    --pjc-line-soft:#f0eee8;
    --pjc-paper:#ffffff;
    --pjc-shell:#faf9f6;

    /* ---- Elevación ---- */
    --pjc-sh-1:0 1px 2px rgba(21,22,28,.05), 0 4px 14px rgba(21,22,28,.05);
    --pjc-sh-2:0 2px 6px rgba(21,22,28,.06), 0 14px 36px rgba(21,22,28,.09);
    --pjc-sh-3:0 6px 18px rgba(21,22,28,.08), 0 28px 60px rgba(21,22,28,.13);

    /* ---- Forma ---- */
    --pjc-r-sm:10px;
    --pjc-r:16px;
    --pjc-r-lg:24px;
    --pjc-r-xl:34px;

    /* ---- Ritmo ---- */
    --pjc-gut:clamp(20px, 4vw, 40px);
    --pjc-block:clamp(56px, 8vw, 116px);

    --pjc-ease:cubic-bezier(.22,.61,.36,1);

    /* ---- Tipografía ---- */
    --pjc-font-sans:"Roboto", -apple-system, "Segoe UI", sans-serif;
    --pjc-font-serif:"Roboto Slab", "Roboto", Georgia, serif;
    --pjc-fw-light:300;
    --pjc-fw-regular:400;
    --pjc-fw-medium:500;
    --pjc-fw-semibold:600;
    --pjc-fw-bold:700;
    --pjc-fs-2xs:.72rem;   /* 11.5px  rótulos de grupo */
    --pjc-fs-xs:.8rem;     /* 12.8px  notas, topbar */
    --pjc-fs-sm:.875rem;   /* 14px    botones de header, subítems */
    --pjc-fs-nav:.94rem;   /* 15px    navegación principal */

    /* ---- Foco accesible ---- */
    --pjc-focus:0 0 0 3px #fff, 0 0 0 5px var(--pjc-gold);
}

/* ==========================================================================
   Base
   ========================================================================== */

body.pjc-body{
    background:var(--pjc-paper);
    color:var(--pjc-body);
    font-family:"Roboto", -apple-system, "Segoe UI", sans-serif;
    font-size:16.5px;
    line-height:1.7;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
}

.pjc-body ::selection{ background:var(--pjc-sand); color:var(--pjc-navy); }

.pjc-body img{ max-width:100%; }

.pjc-shell{
    width:100%;
    max-width:1200px;
    margin:0 auto;
    padding:0 var(--pjc-gut);
}
.pjc-shell--narrow{ max-width:880px; }
.pjc-shell--wide{ max-width:1420px; }

/* ==========================================================================
   Tipografía
   ========================================================================== */

.pjc-display,
.pjc-h1, .pjc-h2, .pjc-h3, .pjc-h4{
    font-family:"Roboto Slab", "Roboto", Georgia, serif;
    color:var(--pjc-navy);
    font-weight:500;
    line-height:1.14;
    letter-spacing:-.015em;
    margin:0 0 .5em 0;
}
.pjc-display{ font-size:clamp(2.6rem, 6.2vw, 4.6rem); font-weight:400; }
.pjc-h1{ font-size:clamp(2.1rem, 4.6vw, 3.35rem); }
.pjc-h2{ font-size:clamp(1.7rem, 3.4vw, 2.5rem); }
.pjc-h3{ font-size:clamp(1.25rem, 2.1vw, 1.6rem); line-height:1.25; }
.pjc-h4{ font-size:clamp(1.05rem, 1.5vw, 1.22rem); line-height:1.35; font-weight:600; }

.pjc-eyebrow{
    display:inline-block;
    font-family:"Roboto", sans-serif;
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.22em;
    text-transform:uppercase;
    color:var(--pjc-bronze);
    margin-bottom:1em;
}
.pjc-eyebrow::before{
    content:"";
    display:inline-block;
    width:26px;
    height:1.5px;
    background:var(--pjc-bronze);
    vertical-align:middle;
    margin-right:.7em;
    transform:translateY(-1px);
}

.pjc-lead{
    font-size:clamp(1.02rem, 1.5vw, 1.18rem);
    line-height:1.75;
    color:var(--pjc-body);
    margin:0 0 1.4em 0;
}
.pjc-text{ margin:0 0 1.15em 0; }
.pjc-text:last-child{ margin-bottom:0; }

.pjc-measure{ max-width:62ch; }
.pjc-center{ text-align:center; }
.pjc-center .pjc-measure{ margin-left:auto; margin-right:auto; }

/* Sobre fondo oscuro */
.pjc-on-dark,
.pjc-on-dark .pjc-h1,
.pjc-on-dark .pjc-h2,
.pjc-on-dark .pjc-h3,
.pjc-on-dark .pjc-h4,
.pjc-on-dark .pjc-display{ color:#fff; }
.pjc-on-dark .pjc-lead,
.pjc-on-dark .pjc-text{ color:rgba(255,255,255,.82); }
.pjc-on-dark .pjc-eyebrow{ color:var(--pjc-sand); }
.pjc-on-dark .pjc-eyebrow::before{ background:var(--pjc-sand); }

/* ==========================================================================
   Secciones
   ========================================================================== */

.pjc-section{
    position:relative;
    padding:var(--pjc-block) 0;
    background:var(--pjc-paper);
}
.pjc-section--shell{ background:var(--pjc-shell); }
.pjc-section--sand{ background:var(--pjc-sand-soft); }
.pjc-section--sand-solid{ background:var(--pjc-sand); }
.pjc-section--navy{ background:var(--pjc-navy); }
.pjc-section--steel{ background:var(--pjc-steel); }
.pjc-section--tight{ padding:clamp(38px, 5vw, 68px) 0; }

.pjc-section-head{
    max-width:720px;
    margin:0 0 clamp(34px, 5vw, 58px) 0;
}
.pjc-section-head--center{ margin-left:auto; margin-right:auto; text-align:center; }

/* Filete decorativo sutil, reemplaza las "líneas retro" duras */
.pjc-rule{
    width:56px;
    height:2px;
    background:linear-gradient(90deg, var(--pjc-bronze), rgba(141,128,94,0));
    border:0;
    margin:0 0 1.6em 0;
}
.pjc-section-head--center .pjc-rule{ margin-left:auto; margin-right:auto; background:linear-gradient(90deg, rgba(141,128,94,0), var(--pjc-bronze), rgba(141,128,94,0)); }

/* ==========================================================================
   Botones
   ========================================================================== */

.pjc-btn{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.6em;
    padding:15px 32px;
    border:1.5px solid transparent;
    border-radius:100px;
    font-family:"Roboto", sans-serif;
    font-size:.93rem;
    font-weight:600;
    letter-spacing:.06em;
    text-transform:uppercase;
    text-decoration:none;
    cursor:pointer;
    overflow:hidden;
    transition:transform .35s var(--pjc-ease), box-shadow .35s var(--pjc-ease), background .3s ease, color .3s ease, border-color .3s ease;
}
.pjc-btn:focus-visible{ outline:3px solid var(--pjc-gold); outline-offset:3px; }
.pjc-btn:hover{ text-decoration:none; transform:translateY(-2px); }

/* brillo diagonal al pasar el cursor */
.pjc-btn::after{
    content:"";
    position:absolute;
    top:0; left:-120%;
    width:60%; height:100%;
    background:linear-gradient(100deg, transparent, rgba(255,255,255,.28), transparent);
    transition:left .7s var(--pjc-ease);
    pointer-events:none;
}
.pjc-btn:hover::after{ left:135%; }

.pjc-btn--primary{
    background:var(--pjc-navy);
    color:#fff;
    box-shadow:0 8px 22px rgba(0,0,76,.24);
}
.pjc-btn--primary:hover{ background:var(--pjc-bronze); color:#fff; box-shadow:0 12px 30px rgba(141,128,94,.34); }

.pjc-btn--bronze{
    background:var(--pjc-bronze);
    color:#fff;
    box-shadow:0 8px 22px rgba(141,128,94,.26);
}
.pjc-btn--bronze:hover{ background:var(--pjc-navy); color:#fff; }

.pjc-btn--outline{
    background:transparent;
    color:var(--pjc-navy);
    border-color:var(--pjc-line);
}
.pjc-btn--outline:hover{ border-color:var(--pjc-navy); background:var(--pjc-navy); color:#fff; }

.pjc-btn--ghost-light{
    background:rgba(255,255,255,.1);
    color:#fff;
    border-color:rgba(255,255,255,.5);
    backdrop-filter:blur(6px);
}
.pjc-btn--ghost-light:hover{ background:#fff; color:var(--pjc-navy); border-color:#fff; }

.pjc-btn--light{ background:#fff; color:var(--pjc-navy); box-shadow:var(--pjc-sh-1); }
.pjc-btn--light:hover{ background:var(--pjc-sand); color:var(--pjc-navy); }

.pjc-btn--sm{ padding:11px 22px; font-size:.8rem; }
.pjc-btn--lg{ padding:18px 42px; font-size:1rem; }
.pjc-btn--block{ display:flex; width:100%; }

/* Enlace con subrayado animado */
.pjc-link{
    color:var(--pjc-navy);
    font-weight:600;
    text-decoration:none;
    background-image:linear-gradient(currentColor, currentColor);
    background-position:0 100%;
    background-repeat:no-repeat;
    background-size:0 1.5px;
    transition:background-size .35s var(--pjc-ease), color .3s ease;
}
.pjc-link:hover{ background-size:100% 1.5px; color:var(--pjc-bronze); text-decoration:none; }

/* ==========================================================================
   Hero
   ========================================================================== */

.pjc-hero{
    position:relative;
    min-height:clamp(440px, 72vh, 760px);
    display:flex;
    align-items:flex-end;
    overflow:hidden;
    background:var(--pjc-navy);
}
.pjc-hero--short{ min-height:clamp(320px, 48vh, 480px); }

.pjc-hero-media{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    transform:scale(1.06);
    animation:pjcKenBurns 22s var(--pjc-ease) forwards;
}
@keyframes pjcKenBurns{ to{ transform:scale(1); } }

.pjc-hero-veil{
    position:absolute;
    inset:0;
    background:
        linear-gradient(180deg, rgba(0,0,40,.42) 0%, rgba(0,0,40,.12) 38%, rgba(0,0,40,.80) 100%),
        linear-gradient(90deg, rgba(0,0,40,.58) 0%, rgba(0,0,40,0) 62%);
}

.pjc-hero-body{
    position:relative;
    z-index:2;
    width:100%;
    padding:clamp(46px, 8vw, 96px) 0;
}
.pjc-hero-copy{ max-width:660px; }

.pjc-hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:34px;
}

/* Indicador de scroll */
.pjc-scroll-cue{
    position:absolute;
    left:50%;
    bottom:22px;
    z-index:3;
    width:26px;
    height:42px;
    margin-left:-13px;
    border:1.5px solid rgba(255,255,255,.5);
    border-radius:14px;
}
.pjc-scroll-cue::after{
    content:"";
    position:absolute;
    left:50%;
    top:8px;
    width:3px; height:7px;
    margin-left:-1.5px;
    border-radius:2px;
    background:#fff;
    animation:pjcCue 1.9s var(--pjc-ease) infinite;
}
@keyframes pjcCue{
    0%{ opacity:0; transform:translateY(0); }
    35%{ opacity:1; }
    75%{ opacity:0; transform:translateY(14px); }
    100%{ opacity:0; }
}

/* ==========================================================================
   Carrusel del inicio  ·  Remake Fase 2 (ver remakeuxui.md)
   Pantalla completa (alto visible − cabecera). Las artes se muestran completas
   sobre un fondo ambiental desenfocado y cálido de la misma imagen.
   Transición en fundido lento + acercamiento muy sutil.
   ========================================================================== */

.pjc-hero-carousel{
    --pjc-hero-fade:1.8s;
    position:relative;
    height:calc(100vh - var(--pjc-chrome-h, 124px));
    height:calc(100svh - var(--pjc-chrome-h, 124px));
    min-height:420px;
    background:var(--pjc-navy);
    overflow:hidden;
}
.pjc-hero-carousel .carousel,
.pjc-hero-carousel .carousel-inner,
.pjc-hero-carousel .carousel-item{ height:100%; }

/* Fundido lento y cálido (sobrescribe los .6s de Bootstrap) */
.pjc-hero-carousel .carousel-item{
    transition-duration:var(--pjc-hero-fade);
    transition-timing-function:cubic-bezier(.45,.05,.25,1);
}
.pjc-hero-carousel.pjc-hero-carousel .carousel-fade .active.carousel-item-left,
.pjc-hero-carousel.pjc-hero-carousel .carousel-fade .active.carousel-item-right{
    transition:opacity 0s var(--pjc-hero-fade);
}

/* Fondo ambiental: misma imagen, desenfocada, con velo cálido */
.pjc-hero-ambient{
    position:absolute;
    inset:-60px;
    background-size:cover;
    background-position:center;
    filter:blur(34px) saturate(1.15) brightness(.92);
    transform:scale(1.1);
}
.pjc-hero-carousel .carousel-item::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    background:
        radial-gradient(ellipse at center, rgba(0,0,0,0) 45%, rgba(0,0,40,.28) 100%),
        linear-gradient(180deg, rgba(186,160,89,.10) 0%, rgba(141,128,94,.16) 100%);
    pointer-events:none;
}

/* Arte completo, sin recortes */
.pjc-hero-slide{
    position:absolute;
    inset:0;
    z-index:2;
    display:block;
}
.pjc-hero-slide:focus{ outline:none; }
.pjc-hero-slide:focus-visible{ box-shadow:inset 0 0 0 4px var(--pjc-gold); }
.pjc-hero-slide img{
    width:100%;
    height:100%;
    object-fit:cover;                          /* cubre sin deformar */
    object-position:var(--pjc-foco, center);   /* punto focal por slide */
    transform:scale(1);
    transform-origin:var(--pjc-foco, center);
}
/* Pantallas verticales: el arte panorámico se muestra completo */
@media (max-aspect-ratio: 5/4){
    .pjc-hero-slide img{ object-fit:contain; object-position:center; transform-origin:center; }
}

/* Acercamiento lento mientras el slide está visible */
.pjc-hero-carousel .carousel-item.active .pjc-hero-ambient,
.pjc-hero-carousel .carousel-item-next .pjc-hero-ambient,
.pjc-hero-carousel .carousel-item-prev .pjc-hero-ambient{ animation:pjcHeroDriftBg 14s linear forwards; }
.pjc-hero-carousel .carousel-item.active .pjc-hero-slide img,
.pjc-hero-carousel .carousel-item-next .pjc-hero-slide img,
.pjc-hero-carousel .carousel-item-prev .pjc-hero-slide img{ animation:pjcHeroDrift 11s cubic-bezier(.33,0,.25,1) forwards; }
.pjc-hero-carousel .is-paused .pjc-hero-ambient,
.pjc-hero-carousel .is-paused .pjc-hero-slide img{ animation-play-state:paused; }

@keyframes pjcHeroDriftBg{ from{ transform:scale(1.1); } to{ transform:scale(1.2); } }
/* Zoom in suave durante cada banner: 9s visibles + 1.8s de fundido ≈ 11s. Con el punto focal
   de cada slide (texto a la izquierda) un 6% no recorta el texto de las artes. */
@keyframes pjcHeroDrift{ from{ transform:scale(1); } to{ transform:scale(1.06); } }

/* ---- Controles: píldora de cristal abajo a la derecha ---- */
.pjc-hero-ui{
    position:absolute;
    right:clamp(16px, 3vw, 40px);
    bottom:clamp(16px, 3vw, 32px);
    z-index:5;
    display:flex;
    align-items:center;
    gap:4px;
    padding:5px;
    border-radius:100px;
    background:rgba(0,0,40,.38);
    -webkit-backdrop-filter:blur(10px);
    backdrop-filter:blur(10px);
    box-shadow:0 8px 24px rgba(0,0,40,.18);
}
.pjc-hero-arrow{
    width:38px; height:38px;
    display:inline-flex; align-items:center; justify-content:center;
    border:0;
    border-radius:50%;
    background:transparent;
    color:#fff;
    font-size:18px;
    cursor:pointer;
    transition:background .3s ease;
}
.pjc-hero-pause{ font-size:12px; margin-left:4px; border-left:1px solid rgba(255,255,255,.18); border-radius:0 50% 50% 0; }
.pjc-hero-arrow:hover{ background:rgba(255,255,255,.14); }
.pjc-hero-arrow:focus{ outline:none; }
.pjc-hero-arrow:focus-visible{ box-shadow:0 0 0 2px var(--pjc-gold); }

.pjc-hero-carousel .pjc-hero-dots{
    position:static;
    display:flex;
    align-items:center;
    gap:2px;
    margin:0 4px;
    padding:0;
    list-style:none;
}
.pjc-hero-dots button{
    display:inline-flex; align-items:center; justify-content:center;
    width:auto; height:30px;
    padding:0 5px;
    border:0;
    background:transparent;
    cursor:pointer;
}
.pjc-hero-dots button span{
    display:block;
    width:22px; height:3px;
    border-radius:3px;
    background:rgba(255,255,255,.5);
    transition:width .6s var(--pjc-ease), background .6s ease;
}
.pjc-hero-dots button.active span{ width:40px; background:var(--pjc-sand); }
.pjc-hero-dots button:hover span{ background:#fff; }
.pjc-hero-dots button:focus{ outline:none; }
.pjc-hero-dots button:focus-visible span{ box-shadow:0 0 0 2px var(--pjc-gold); }

/* Indicador de scroll hacia la siguiente sección */
.pjc-hero-cue{ z-index:5; text-decoration:none; }
.pjc-hero-cue:focus{ outline:none; }
.pjc-hero-cue:focus-visible{ box-shadow:0 0 0 3px var(--pjc-gold); }
#pjcAfterHero{ display:block; scroll-margin-top:var(--pjc-header-h-compact, 64px); }

@media (max-width: 767px){
    .pjc-hero-carousel{ min-height:360px; }
    .pjc-hero-ui{ right:50%; transform:translateX(50%); }
    .pjc-hero-cue{ display:none; }
}

@media (prefers-reduced-motion: reduce){
    .pjc-hero-carousel{ --pjc-hero-fade:.01s; }
    .pjc-hero-carousel .pjc-hero-ambient,
    .pjc-hero-carousel .pjc-hero-slide img{ animation:none !important; }
}

/* ==========================================================================
   Nuestros servicios (inicio)  ·  Remake Fase 3 (ver remakeuxui.md)
   Base: carrusel horizontal nativo a todo el ancho (móvil, tablet, sin JS,
   movimiento reducido). .is-escena (escritorio con JS): escena fija en la que
   el scroll vertical desplaza los servicios en horizontal.
   ========================================================================== */

.pjc-svc{
    position:relative;
    background:var(--pjc-paper);
    overflow-x:clip;            /* sin scroll horizontal de página; 'clip' (no 'hidden') para no romper el sticky */
}
.pjc-svc-head{
    text-align:center;
    padding:clamp(48px, 6vw, 84px) var(--pjc-gut) 22px;
}
.pjc-svc-head .pjc-h2{ margin:0; }
.pjc-svc-indice{ display:none; }

/* ---- Base: carrusel horizontal con scroll-snap ---- */
.pjc-svc-track{
    display:flex;
    gap:16px;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:var(--pjc-gut);
    padding:10px var(--pjc-gut) 26px;
    max-width:1200px;               /* respeta el ancho del contenedor (.pjc-shell) */
    margin:0 auto;
    scrollbar-width:none;
    outline:none;
}
.pjc-svc-track::-webkit-scrollbar{ display:none; }
.pjc-svc-item{
    flex:0 0 min(84%, 520px);
    scroll-snap-align:start;
    display:flex;
    flex-direction:column;
    background:#fff;
    border:1px solid var(--pjc-line-soft);
    border-radius:var(--pjc-r-lg);
    box-shadow:var(--pjc-sh-1);
    overflow:hidden;
}
.pjc-svc-foto{
    position:relative;
    aspect-ratio:4 / 3;
    overflow:hidden;
    background:var(--pjc-shell);
}
.pjc-svc-foto img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}
.pjc-svc-texto{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    padding:20px 22px 24px;
}
.pjc-svc-contador{
    margin:0 0 6px;
    font-size:var(--pjc-fs-xs);
    font-weight:var(--pjc-fw-medium);
    letter-spacing:.12em;
    color:var(--pjc-bronze);
}
.pjc-svc-titulo{
    margin:0 0 8px;
    font-family:var(--pjc-font-serif);
    font-size:1.4rem;
    font-weight:var(--pjc-fw-medium);
    line-height:1.2;
    color:var(--pjc-navy);
}
.pjc-svc-desc{
    margin:0 0 20px;
    font-size:.97rem;
    line-height:1.6;
    color:var(--pjc-body);
}
.pjc-svc-acciones{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px 20px;
    margin-top:auto;
}
.pjc-svc-acciones .pjc-btn{
    text-transform:none;
    letter-spacing:.01em;
    font-weight:var(--pjc-fw-medium);
    font-size:var(--pjc-fs-sm);
}
.pjc-svc-link{
    display:inline-flex;
    align-items:center;
    gap:.5em;
    font-size:var(--pjc-fs-sm);
    font-weight:var(--pjc-fw-medium);
    color:var(--pjc-navy);
    text-decoration:none;
}
.pjc-svc-link .fa, .pjc-svc-acciones .pjc-btn .fa-arrow-right{ transition:transform .3s ease; }
.pjc-svc-link:hover{ color:var(--pjc-bronze-dark); text-decoration:none; }
.pjc-svc-link:hover .fa, .pjc-svc-acciones .pjc-btn:hover .fa-arrow-right{ transform:translateX(3px); }
.pjc-svc-link:focus{ outline:none; }
.pjc-svc-link:focus-visible{ box-shadow:var(--pjc-focus); border-radius:4px; }

.pjc-svc-hint{
    margin:0 0 clamp(40px, 6vw, 64px);
    text-align:center;
    font-size:var(--pjc-fs-xs);
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--pjc-muted);
}

@media (min-width: 600px){
    .pjc-svc-item{ flex-basis:min(46%, 520px); }
}

/* ---- Escena horizontal (escritorio) ---- */
.pjc-svc-ventana{ display:contents; }      /* en la base no agrega caja: el track es el carrusel */
.pjc-svc-textos{ display:none; }

/* La escena se fija bajo el header compacto (cuando se llega aquí, el header ya se encogió) */
.pjc-svc.is-escena{
    --pjc-svc-top:var(--pjc-header-h-compact, 64px);
    --pjc-svc-alto:calc(100vh - var(--pjc-svc-top));
}
.pjc-svc.is-escena .pjc-svc-head,
.pjc-svc.is-escena .pjc-svc-hint,
.pjc-svc.is-escena .pjc-svc-item .pjc-svc-texto,
.pjc-svc.is-escena .pjc-svc-contador{ display:none; }

/* Alto de la pista = escena + un tramo de ~85vh por cada cambio de servicio */
.pjc-svc.is-escena .pjc-svc-pista{
    position:relative;
    height:calc(var(--pjc-svc-alto) + (var(--pjc-svc-n) - .65) * 85vh);
}
/* La escena ocupa el ancho del contenedor del sitio (1200px, como .pjc-shell) */
.pjc-svc.is-escena .pjc-svc-stage{
    position:sticky;
    top:var(--pjc-svc-top, 84px);
    height:var(--pjc-svc-alto);
    min-height:560px;
    max-width:1200px;
    margin:0 auto;
    overflow:hidden;
}

/* Ventana de fotos: tarjeta redondeada a la izquierda; la tira se desliza dentro */
.pjc-svc.is-escena .pjc-svc-ventana{
    display:block;
    position:absolute;
    top:clamp(24px, 5vh, 56px);
    bottom:clamp(24px, 5vh, 56px);
    left:var(--pjc-gut);
    width:calc(57% - var(--pjc-gut));
    overflow:hidden;
    border-radius:var(--pjc-r-xl);
    box-shadow:0 1px 2px rgba(21,22,28,.06), 0 18px 44px rgba(21,22,28,.14);
    -webkit-mask-image:-webkit-radial-gradient(white, black);   /* recorte redondeado estable en Safari */
}
.pjc-svc.is-escena .pjc-svc-ventana::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    border-radius:inherit;
    background:
        linear-gradient(180deg, rgba(186,160,89,.05), rgba(141,128,94,.12)),
        linear-gradient(to top, rgba(0,0,40,.22), rgba(0,0,40,0) 32%);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
    pointer-events:none;
}
/* Las fotos se apilan en el mismo lugar y cambian con un fundido (no se desplazan) */
.pjc-svc.is-escena .pjc-svc-track{
    position:relative;
    height:100%;
    padding:0;
    overflow:visible;
    scroll-snap-type:none;
}
.pjc-svc.is-escena .pjc-svc-item{
    position:absolute;
    inset:0;
    height:100%;
    border:0;
    border-radius:0;
    box-shadow:none;
    background:transparent;
    opacity:0;
    visibility:hidden;
    /* la foto que sale se queda debajo hasta que la nueva terminó de aparecer: fundido sin “bajón” a blanco */
    transition:opacity 0s linear 1.4s, visibility 0s linear 1.4s;
}
.pjc-svc.is-escena .pjc-svc-item.is-activo{
    z-index:1;
    opacity:1;
    visibility:visible;
    /* la foto que entra aparece encima, suavemente */
    transition:opacity 1.4s cubic-bezier(.45,.05,.35,1), visibility 0s;
}
.pjc-svc.is-escena .pjc-svc-foto{
    height:100%;
    aspect-ratio:auto;
}
/* La foto que entra se asienta con un acercamiento suave; además sigue levemente al cursor */
.pjc-svc.is-escena .pjc-svc-foto img{
    scale:1.14;
    transform:translate3d(var(--mx, 0px), var(--my, 0px), 0);
    transition:scale 2.2s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1);
}
.pjc-svc.is-escena .pjc-svc-item.is-activo .pjc-svc-foto img{ scale:1.05; }

/* Columna derecha: índice fijo arriba y el texto del servicio debajo, siempre sobre blanco */
.pjc-svc.is-escena .pjc-svc-indice,
.pjc-svc.is-escena .pjc-svc-textos{
    position:absolute;
    right:var(--pjc-gut);
    width:min(430px, calc(43% - var(--pjc-gut) - 40px));
    z-index:3;
}
.pjc-svc.is-escena .pjc-svc-indice{
    display:block;
    bottom:calc(50% + 34px);
}
.pjc-svc-indice-titulo{
    margin:0 0 22px;
    font-family:var(--pjc-font-serif);
    font-size:clamp(1.5rem, 2.2vw, 1.9rem);
    font-weight:var(--pjc-fw-regular);
    line-height:1.2;
    color:var(--pjc-navy);
}
.pjc-svc-pasos{
    display:grid;
    grid-template-columns:repeat(var(--pjc-svc-n), 1fr);
    gap:10px;
    margin:0;
    padding:0;
    list-style:none;
}
.pjc-svc-paso{
    display:block;
    width:100%;
    padding:0 0 4px;
    border:0;
    background:none;
    font-family:var(--pjc-font-sans);
    font-size:.74rem;
    font-weight:var(--pjc-fw-regular);
    line-height:1.3;
    text-align:left;
    color:var(--pjc-muted);
    cursor:pointer;
    transition:color .4s ease;
}
.pjc-svc-paso:hover, .pjc-svc-paso.is-activo{ color:var(--pjc-navy); }
.pjc-svc-paso:focus{ outline:none; }
.pjc-svc-paso:focus-visible{ box-shadow:var(--pjc-focus); border-radius:4px; }
.pjc-svc-barra{
    display:block;
    height:2px;
    margin-bottom:9px;
    border-radius:2px;
    overflow:hidden;
    background:var(--pjc-line);
}
.pjc-svc-barra span{
    display:block;
    width:100%;
    height:100%;
    background:var(--pjc-bronze);
    transform:scaleX(var(--progreso, 0));
    transform-origin:left center;
}
.pjc-svc-num{
    display:block;
    margin-bottom:2px;
    font-size:.68rem;
    font-weight:var(--pjc-fw-medium);
    letter-spacing:.1em;
    color:var(--pjc-bronze);
}

/* Textos: entran desde la derecha y salen hacia la izquierda, como la tira de fotos */
.pjc-svc.is-escena .pjc-svc-textos{
    display:block;
    top:50%;
    height:260px;
}
.pjc-svc-texto-escena{
    position:absolute;
    top:0; left:0; right:0;
    opacity:0;
    visibility:hidden;
    transform:translateX(48px);
    transition:opacity .55s ease, transform .9s cubic-bezier(.22,.61,.36,1), visibility 0s linear .9s;
}
.pjc-svc-texto-escena.is-pasado{ transform:translateX(-48px); }
.pjc-svc-texto-escena.is-activo{
    opacity:1;
    visibility:visible;
    transform:none;
    transition:opacity .7s ease .15s, transform 1s cubic-bezier(.22,.61,.36,1) .1s, visibility 0s;
}
.pjc-svc-texto-escena .pjc-svc-contador{ display:none; }
.pjc-svc-texto-escena .pjc-svc-titulo{ font-size:clamp(2rem, 3.2vw, 2.75rem); font-weight:var(--pjc-fw-regular); margin-bottom:12px; }
.pjc-svc-texto-escena .pjc-svc-desc{ font-size:1.02rem; max-width:420px; margin-bottom:26px; }

@media (prefers-reduced-motion: reduce){
    .pjc-svc-foto img, .pjc-svc-texto-escena, .pjc-svc-link .fa{ transition:none !important; }
}

/* ==========================================================================
   Rejillas y tarjetas
   ========================================================================== */

.pjc-grid{
    display:grid;
    gap:clamp(18px, 2.4vw, 30px);
}
.pjc-grid--2{ grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); }
.pjc-grid--3{ grid-template-columns:repeat(auto-fit, minmax(272px, 1fr)); }
.pjc-grid--4{ grid-template-columns:repeat(auto-fit, minmax(224px, 1fr)); }

.pjc-card{
    position:relative;
    background:var(--pjc-paper);
    border:1px solid var(--pjc-line-soft);
    border-radius:var(--pjc-r-lg);
    overflow:hidden;
    box-shadow:var(--pjc-sh-1);
    transition:transform .45s var(--pjc-ease), box-shadow .45s var(--pjc-ease), border-color .45s ease;
    display:flex;
    flex-direction:column;
    height:100%;
}
.pjc-card:hover{
    transform:translateY(-6px);
    box-shadow:var(--pjc-sh-3);
    border-color:var(--pjc-line);
}

.pjc-card-media{
    position:relative;
    overflow:hidden;
    background:var(--pjc-shell);
    aspect-ratio:4/3;
}
.pjc-card-media img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform 1.1s var(--pjc-ease);
}
.pjc-card:hover .pjc-card-media img{ transform:scale(1.07); }
.pjc-card-media::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(0,0,40,0) 55%, rgba(0,0,40,.34) 100%);
    opacity:0;
    transition:opacity .45s ease;
}
.pjc-card:hover .pjc-card-media::after{ opacity:1; }

.pjc-card-body{
    padding:clamp(20px, 2.4vw, 30px);
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    gap:.4em;
}
.pjc-card-body .pjc-btn{ margin-top:auto; align-self:flex-start; }
.pjc-card-title{
    font-family:"Roboto Slab", Georgia, serif;
    font-size:1.16rem;
    font-weight:500;
    color:var(--pjc-navy);
    line-height:1.3;
    margin:0;
}
.pjc-card-text{
    font-size:.95rem;
    color:var(--pjc-body);
    margin:.35em 0 1.2em 0;
}


/* Tarjeta con número (planes) */
.pjc-plan-index{
    font-family:"Roboto Slab", Georgia, serif;
    font-size:.9rem;
    font-weight:600;
    letter-spacing:.16em;
    color:var(--pjc-bronze);
    text-transform:uppercase;
}

/* ==========================================================================
   Bloque dividido texto / imagen
   ========================================================================== */

.pjc-split{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
    gap:clamp(28px, 5vw, 70px);
    align-items:center;
}
.pjc-split--reverse .pjc-split-media{ order:2; }

.pjc-split-media{
    position:relative;
    border-radius:var(--pjc-r-lg);
    overflow:hidden;
    box-shadow:var(--pjc-sh-2);
}
.pjc-split-media img{ width:100%; height:auto; display:block; transition:transform 1.2s var(--pjc-ease); }
.pjc-split-media:hover img{ transform:scale(1.04); }

/* Imagen suelta sin recorte (logos, artes con fondo) */
.pjc-art{ display:block; width:100%; height:auto; }
.pjc-art--center{ margin:0 auto; }
.pjc-art--cap{ max-width:420px; }
.pjc-art--framed{
    border-radius:var(--pjc-r);
    box-shadow:var(--pjc-sh-1);
}

/* ==========================================================================
   Galería con lightbox
   ========================================================================== */

.pjc-gallery{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(230px, 1fr));
    gap:14px;
}
.pjc-gallery-item{
    position:relative;
    display:block;
    aspect-ratio:4/3;
    border-radius:var(--pjc-r);
    overflow:hidden;
    background:var(--pjc-shell);
    box-shadow:var(--pjc-sh-1);
    transition:transform .45s var(--pjc-ease), box-shadow .45s var(--pjc-ease);
}
.pjc-gallery-item:hover{ transform:translateY(-4px); box-shadow:var(--pjc-sh-2); }
.pjc-gallery-item img{
    width:100%; height:100%;
    object-fit:cover;
    display:block;
    transition:transform 1.1s var(--pjc-ease);
}
.pjc-gallery-item:hover img{ transform:scale(1.09); }
.pjc-gallery-item::after{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(0,0,40,.34);
    opacity:0;
    transition:opacity .4s ease;
}
.pjc-gallery-item:hover::after{ opacity:1; }
.pjc-gallery-zoom{
    position:absolute;
    z-index:2;
    top:50%; left:50%;
    width:46px; height:46px;
    margin:-23px 0 0 -23px;
    border-radius:50%;
    border:1.5px solid rgba(255,255,255,.85);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:16px;
    opacity:0;
    transform:scale(.7);
    transition:opacity .4s ease, transform .4s var(--pjc-ease);
}
.pjc-gallery-item:hover .pjc-gallery-zoom{ opacity:1; transform:scale(1); }

/* Item destacado (primera foto más grande en pantallas amplias) */
@media (min-width: 992px){
    .pjc-gallery--feature .pjc-gallery-item:first-child{
        grid-column:span 2;
        grid-row:span 2;
        aspect-ratio:auto;
    }
}

/* ==========================================================================
   Obituarios
   ========================================================================== */

.pjc-obit{
    text-align:center;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:.2em;
}
.pjc-obit-photo{
    position:relative;
    width:clamp(140px, 18vw, 196px);
    aspect-ratio:1;
    border-radius:50%;
    overflow:hidden;
    margin-bottom:20px;
    box-shadow:0 0 0 1px var(--pjc-line), 0 12px 30px rgba(21,22,28,.14);
    transition:transform .5s var(--pjc-ease), box-shadow .5s var(--pjc-ease);
}
.pjc-obit:hover .pjc-obit-photo{
    transform:translateY(-5px);
    box-shadow:0 0 0 1px var(--pjc-bronze), 0 18px 40px rgba(21,22,28,.2);
}
.pjc-obit-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.pjc-obit-name{
    font-family:"Roboto Slab", Georgia, serif;
    font-size:1.02rem;
    font-weight:500;
    color:var(--pjc-navy);
    line-height:1.35;
    margin:0;
}
.pjc-obit-date{
    font-size:.83rem;
    letter-spacing:.1em;
    text-transform:uppercase;
    color:var(--pjc-bronze);
    margin:0;
}

/* --------------------------------------------------------------------------
   Libro de Memorias en el inicio · Remake Fase 4 (ver remakeuxui.md)
   Mismo diseño; solo entrada animada, serena y escalonada. Usa el .is-in que
   pone el revelado del layout (IntersectionObserver) sobre cada .pjc-reveal.
   -------------------------------------------------------------------------- */

/* El encabezado no se mueve en bloque: animan sus partes, en secuencia */
.pjc-lm .pjc-section-head.pjc-reveal{ opacity:1; transform:none; }

.pjc-lm .pjc-section-head .pjc-eyebrow{
    opacity:0;
    transform:translateY(10px);
    transition:opacity .7s ease, transform .9s var(--pjc-ease);
}
.pjc-lm .pjc-section-head .pjc-eyebrow::before{
    transform:scaleX(0);
    transform-origin:left center;
    transition:transform 1.1s var(--pjc-ease) .25s;
}
/* Título: cada palabra aparece de lo borroso a lo nítido */
.pjc-lm-word{
    display:inline-block;
    opacity:0;
    transform:translateY(.4em);
    filter:blur(8px);
    transition:opacity 1s ease, transform 1.1s var(--pjc-ease), filter 1.1s ease;
    transition-delay:calc(.25s + var(--w, 0) * .14s);
}
/* Filete: se dibuja desde el centro */
.pjc-lm .pjc-section-head .pjc-rule{
    transform:scaleX(0);
    transition:transform 1.2s var(--pjc-ease) .75s;
}
.pjc-lm .pjc-section-head .pjc-lead{
    opacity:0;
    transform:translateY(14px);
    transition:opacity 1s ease .9s, transform 1.1s var(--pjc-ease) .9s;
}
.pjc-lm .pjc-section-head.is-in .pjc-eyebrow,
.pjc-lm .pjc-section-head.is-in .pjc-lead,
.pjc-lm .pjc-section-head.is-in .pjc-lm-word{ opacity:1; transform:none; filter:none; }
.pjc-lm .pjc-section-head.is-in .pjc-eyebrow::before,
.pjc-lm .pjc-section-head.is-in .pjc-rule{ transform:scaleX(1); }

/* Obituarios: la foto se abre como un iris, se asienta y aparece un filete interior */
.pjc-lm .pjc-obit.pjc-reveal{ opacity:1; transform:none; transition:none; }
.pjc-lm .pjc-obit{ --lm-d:0s; }
.pjc-lm .pjc-obit[data-d="1"]{ --lm-d:.22s; }
.pjc-lm .pjc-obit[data-d="2"]{ --lm-d:.44s; }

.pjc-lm .pjc-obit-photo{ background:var(--pjc-sand-soft); }
.pjc-lm .pjc-obit-photo img{
    clip-path:circle(0% at 50% 50%);
    transform:scale(1.18);
    transition:clip-path 1.4s var(--pjc-ease) var(--lm-d), transform 2.2s var(--pjc-ease) var(--lm-d);
}
.pjc-lm .pjc-obit-photo::after{
    content:"";
    position:absolute;
    inset:7px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.75);
    opacity:0;
    transform:scale(1.08);
    transition:opacity 1s ease calc(var(--lm-d) + 1s), transform 1.4s var(--pjc-ease) calc(var(--lm-d) + 1s);
    pointer-events:none;
}
.pjc-lm .pjc-obit-name,
.pjc-lm .pjc-obit-date{
    opacity:0;
    transform:translateY(12px);
    transition:opacity .9s ease, transform 1s var(--pjc-ease);
}
.pjc-lm .pjc-obit-name{ transition-delay:calc(var(--lm-d) + .55s); }
.pjc-lm .pjc-obit-date{ transition-delay:calc(var(--lm-d) + .7s); }

.pjc-lm .pjc-obit.is-in .pjc-obit-photo img{ clip-path:circle(75% at 50% 50%); transform:scale(1); }
.pjc-lm .pjc-obit.is-in .pjc-obit-photo::after{ opacity:1; transform:none; }
.pjc-lm .pjc-obit.is-in .pjc-obit-name,
.pjc-lm .pjc-obit.is-in .pjc-obit-date{ opacity:1; transform:none; }

/* Hover: además del ascenso existente, la foto se acerca despacio */
.pjc-lm .pjc-obit.is-in:hover .pjc-obit-photo img{ transform:scale(1.06); transition:transform 1.6s var(--pjc-ease); }

/* Botón: la flecha avanza al pasar el cursor */
.pjc-lm .pjc-btn .fa-arrow-right{ transition:transform .35s var(--pjc-ease); }
.pjc-lm .pjc-btn:hover .fa-arrow-right{ transform:translateX(4px); }

@media (prefers-reduced-motion: reduce){
    .pjc-lm .pjc-section-head .pjc-eyebrow, .pjc-lm .pjc-section-head .pjc-eyebrow::before,
    .pjc-lm-word, .pjc-lm .pjc-section-head .pjc-rule, .pjc-lm .pjc-section-head .pjc-lead,
    .pjc-lm .pjc-obit-photo img, .pjc-lm .pjc-obit-photo::after,
    .pjc-lm .pjc-obit-name, .pjc-lm .pjc-obit-date{
        opacity:1 !important; transform:none !important; filter:none !important;
        clip-path:none !important; transition:none !important;
    }
}

/* ==========================================================================
   Servicios del día
   ========================================================================== */

.pjc-filterbar{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:10px;
    margin-bottom:14px;
}
.pjc-chip{
    display:inline-flex;
    align-items:center;
    gap:.5em;
    padding:11px 26px;
    border-radius:100px;
    border:1.5px solid rgba(255,255,255,.4);
    background:rgba(255,255,255,.1);
    color:#fff;
    font-size:.86rem;
    font-weight:600;
    letter-spacing:.04em;
    cursor:pointer;
    backdrop-filter:blur(6px);
    transition:all .3s var(--pjc-ease);
}
.pjc-chip:hover{ background:rgba(255,255,255,.22); transform:translateY(-2px); }
.pjc-chip.is-active{ background:#fff; color:var(--pjc-navy); border-color:#fff; }

.pjc-service-card{
    position:relative;
    background:var(--pjc-paper);
    border-radius:var(--pjc-r-lg);
    padding:74px 28px 30px 28px;
    margin-top:56px;
    text-align:center;
    box-shadow:var(--pjc-sh-2);
    border:1px solid var(--pjc-line-soft);
    height:calc(100% - 56px);
    transition:transform .45s var(--pjc-ease), box-shadow .45s var(--pjc-ease);
}
.pjc-service-card:hover{ transform:translateY(-6px); box-shadow:var(--pjc-sh-3); }
.pjc-service-avatar{
    position:absolute;
    top:-52px;
    left:50%;
    transform:translateX(-50%);
    width:104px;
    height:104px;
    border-radius:50%;
    overflow:hidden;
    background:#fff;
    padding:5px;
    box-shadow:0 8px 24px rgba(21,22,28,.16);
}
.pjc-service-avatar img{ width:100%; height:100%; object-fit:cover; border-radius:50%; display:block; }
.pjc-service-sala{
    font-family:"Roboto Slab", Georgia, serif;
    font-size:.86rem;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--pjc-bronze);
    margin:0 0 .5em 0;
}
.pjc-service-name{
    font-family:"Roboto Slab", Georgia, serif;
    font-size:1.3rem;
    font-weight:500;
    color:var(--pjc-navy);
    line-height:1.3;
    margin:0 0 18px 0;
}
.pjc-service-meta{
    list-style:none;
    margin:0;
    padding:18px 0 0 0;
    border-top:1px solid var(--pjc-line-soft);
    text-align:left;
    font-size:.87rem;
    color:var(--pjc-body);
}
.pjc-service-meta li{ padding:5px 0; display:flex; gap:.6em; }
.pjc-service-meta b{
    color:var(--pjc-muted);
    font-weight:600;
    text-transform:uppercase;
    font-size:.72rem;
    letter-spacing:.08em;
    flex:0 0 92px;
    padding-top:2px;
}

/* ==========================================================================
   Formularios
   ========================================================================== */

.pjc-field-group{ margin-bottom:18px; }
.pjc-label{
    display:block;
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--pjc-bronze);
    margin-bottom:8px;
}
.pjc-input,
.pjc-select,
.pjc-textarea{
    width:100%;
    background:#fff;
    border:1.5px solid var(--pjc-line);
    border-radius:var(--pjc-r-sm);
    padding:14px 17px;
    font-family:"Roboto", sans-serif;
    font-size:.98rem;
    color:var(--pjc-ink);
    transition:border-color .28s ease, box-shadow .28s ease, background .28s ease;
}
.pjc-input::placeholder,
.pjc-textarea::placeholder{ color:var(--pjc-muted); }
.pjc-input:focus,
.pjc-select:focus,
.pjc-textarea:focus{
    outline:none;
    border-color:var(--pjc-bronze);
    box-shadow:0 0 0 4px rgba(141,128,94,.14);
}
.pjc-textarea{ resize:vertical; min-height:132px; line-height:1.6; }
.pjc-select{ appearance:none; cursor:pointer; padding-right:44px;
    background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238D805E' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 15px center;
    background-size:17px;
}

.pjc-form-card{
    background:#fff;
    border-radius:var(--pjc-r-lg);
    padding:clamp(26px, 3.4vw, 44px);
    box-shadow:var(--pjc-sh-2);
    border:1px solid var(--pjc-line-soft);
}

.pjc-alert{
    display:none;
    border-radius:var(--pjc-r-sm);
    padding:13px 17px;
    font-size:.92rem;
    margin-bottom:16px;
    background:#fdecea;
    border:1px solid #f4c9c3;
    color:#b23b2c;
}

/* ==========================================================================
   Contacto
   ========================================================================== */

.pjc-contact-list{ list-style:none; margin:0; padding:0; }
.pjc-contact-list li{
    display:flex;
    align-items:flex-start;
    gap:16px;
    padding:15px 0;
    border-bottom:1px solid var(--pjc-line-soft);
}
.pjc-contact-list li:last-child{ border-bottom:0; }
.pjc-contact-ico{
    flex:0 0 auto;
    width:42px; height:42px;
    border-radius:50%;
    background:var(--pjc-sand-soft);
    color:var(--pjc-bronze);
    display:flex; align-items:center; justify-content:center;
    font-size:16px;
}
.pjc-contact-k{
    display:block;
    font-size:.72rem;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--pjc-muted);
    font-weight:700;
}
.pjc-contact-v{ color:var(--pjc-navy); font-weight:500; }
a.pjc-contact-v:hover{ color:var(--pjc-bronze); text-decoration:none; }

.pjc-map{
    width:100%;
    height:100%;
    min-height:340px;
    border:0;
    display:block;
    border-radius:var(--pjc-r-lg);
    box-shadow:var(--pjc-sh-2);
    filter:grayscale(.28) contrast(1.02);
    transition:filter .5s ease;
}
.pjc-map:hover{ filter:none; }

/* ==========================================================================
   Contacto del inicio  ·  Remake Fase 5 (ver remakeuxui.md)
   Bloque de cierre en azul medianoche con resplandores suaves; información en
   tarjetas de cristal y formulario en tarjeta blanca con etiquetas flotantes.
   ========================================================================== */

.pjc-ct{
    --ct-ink:#060a2c;
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:clamp(64px, 9vw, 128px) 0;
    color:rgba(255,255,255,.72);
    background:
        radial-gradient(900px 520px at 88% -8%, rgba(186,160,89,.20), rgba(186,160,89,0) 62%),
        radial-gradient(760px 520px at -6% 108%, rgba(93,65,128,.30), rgba(93,65,128,0) 60%),
        linear-gradient(165deg, var(--ct-ink) 0%, var(--pjc-navy) 52%, var(--pjc-navy-800) 100%);
    border-bottom:1px solid rgba(255,255,255,.07);   /* separa del footer (también navy) */
}
/* Trama de puntos muy tenue */
.pjc-ct::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background-image:radial-gradient(rgba(255,255,255,.07) 1px, transparent 1.2px);
    background-size:22px 22px;
    -webkit-mask-image:linear-gradient(180deg, rgba(0,0,0,.9), rgba(0,0,0,.25));
    mask-image:linear-gradient(180deg, rgba(0,0,0,.9), rgba(0,0,0,.25));
}
/* Resplandor que respira despacio */
.pjc-ct-glow{
    position:absolute;
    z-index:-1;
    width:620px; height:620px;
    right:-140px; top:28%;
    border-radius:50%;
    background:radial-gradient(circle, rgba(186,160,89,.16), rgba(186,160,89,0) 65%);
    filter:blur(10px);
    animation:pjcCtGlow 14s ease-in-out infinite alternate;
    pointer-events:none;
}
@keyframes pjcCtGlow{
    from{ transform:translate3d(0,0,0) scale(1); opacity:.8; }
    to{ transform:translate3d(-60px,-40px,0) scale(1.12); opacity:1; }
}

.pjc-ct-grid{
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(0, 1.02fr);
    gap:clamp(36px, 6vw, 96px);
    align-items:start;
    max-width:1240px;
    margin:0 auto;
}

/* ---------- Información ---------- */
.pjc-ct .pjc-eyebrow{ color:var(--pjc-gold); }
.pjc-ct .pjc-eyebrow::before{ background:var(--pjc-gold); }
.pjc-ct-title{
    margin:0 0 14px;
    font-family:var(--pjc-font-serif);
    font-size:clamp(2.4rem, 4.6vw, 3.6rem);
    font-weight:var(--pjc-fw-regular);
    line-height:1.05;
    letter-spacing:-.02em;
    color:#fff;
}
.pjc-ct-lead{
    max-width:460px;
    margin:0 0 30px;
    font-size:1.04rem;
    font-weight:var(--pjc-fw-light);
    line-height:1.7;
    color:rgba(255,255,255,.72);
}
.pjc-ct-k{
    display:block;
    font-size:var(--pjc-fs-2xs);
    font-weight:var(--pjc-fw-medium);
    letter-spacing:.16em;
    text-transform:uppercase;
    color:rgba(255,255,255,.55);
}

/* Emergencia destacada */
.pjc-ct-sos{
    position:relative;
    display:flex;
    align-items:center;
    gap:18px;
    padding:18px 22px;
    margin-bottom:14px;
    border-radius:var(--pjc-r);
    background:linear-gradient(120deg, rgba(186,160,89,.22), rgba(186,160,89,.06));
    border:1px solid rgba(186,160,89,.45);
    color:#fff;
    text-decoration:none;
    transition:transform .4s var(--pjc-ease), border-color .4s ease, background .4s ease;
}
.pjc-ct-sos:hover{ color:#fff; text-decoration:none; transform:translateY(-2px); border-color:var(--pjc-gold); background:linear-gradient(120deg, rgba(186,160,89,.30), rgba(186,160,89,.10)); }
.pjc-ct-sos:focus-visible{ outline:none; box-shadow:0 0 0 3px var(--ct-ink), 0 0 0 5px var(--pjc-gold); }
.pjc-ct-sos-ico{
    position:relative;
    flex:0 0 auto;
    display:inline-flex; align-items:center; justify-content:center;
    width:50px; height:50px;
    border-radius:50%;
    background:var(--pjc-gold);
    color:var(--ct-ink);
    font-size:19px;
}
.pjc-ct-sos-ico::after{
    content:"";
    position:absolute;
    inset:-6px;
    border-radius:50%;
    border:1px solid rgba(186,160,89,.6);
    animation:pjcCtPulse 2.6s var(--pjc-ease) infinite;
}
@keyframes pjcCtPulse{
    0%{ transform:scale(.85); opacity:.9; }
    100%{ transform:scale(1.35); opacity:0; }
}
.pjc-ct-sos-txt{ flex:1 1 auto; }
.pjc-ct-sos .pjc-ct-k{ color:var(--pjc-sand); }
.pjc-ct-sos-v{
    display:block;
    font-family:var(--pjc-font-serif);
    font-size:1.75rem;
    font-weight:var(--pjc-fw-regular);
    line-height:1.15;
    letter-spacing:.01em;
}
.pjc-ct-sos-go{ opacity:.7; transition:transform .35s var(--pjc-ease), opacity .35s ease; }
.pjc-ct-sos:hover .pjc-ct-sos-go{ transform:translateX(4px); opacity:1; }

/* Tarjetas de cristal: PBX y correo */
.pjc-ct-cards{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
    margin-bottom:26px;
}
.pjc-ct-card{
    display:block;
    min-width:0;
    padding:18px 20px;
    border-radius:var(--pjc-r);
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.10);
    -webkit-backdrop-filter:blur(8px);
    backdrop-filter:blur(8px);
    color:#fff;
    text-decoration:none;
    transition:background .35s ease, border-color .35s ease, transform .4s var(--pjc-ease);
}
.pjc-ct-card:hover{ color:#fff; text-decoration:none; background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.22); transform:translateY(-2px); }
.pjc-ct-card:focus-visible{ outline:none; box-shadow:0 0 0 2px var(--pjc-gold); }
.pjc-ct-card .fa{ display:block; margin-bottom:12px; font-size:16px; color:var(--pjc-gold); }
.pjc-ct-v{
    display:block;
    margin-top:3px;
    font-size:.98rem;
    font-weight:var(--pjc-fw-regular);
    color:#fff;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

/* Sucursales */
.pjc-ct-sedes{ list-style:none; margin:0 0 26px; padding:0; }
.pjc-ct-sedes li{
    display:grid;
    grid-template-columns:auto minmax(0, 1fr) auto;
    align-items:center;
    gap:14px;
    padding:14px 0;
    border-top:1px solid rgba(255,255,255,.09);
}
.pjc-ct-sedes li:last-child{ border-bottom:1px solid rgba(255,255,255,.09); }
.pjc-ct-sede-ico{
    display:inline-flex; align-items:center; justify-content:center;
    width:36px; height:36px;
    border-radius:50%;
    background:rgba(255,255,255,.06);
    color:var(--pjc-gold);
}
.pjc-ct-sede-n{ display:block; font-size:.98rem; font-weight:var(--pjc-fw-medium); color:#fff; }
.pjc-ct-sede-d{ display:block; font-size:.86rem; font-weight:var(--pjc-fw-light); color:rgba(255,255,255,.62); }
.pjc-ct-sede-go{
    font-size:var(--pjc-fs-xs);
    font-weight:var(--pjc-fw-medium);
    letter-spacing:.02em;
    color:var(--pjc-sand);
    white-space:nowrap;
    text-decoration:none;
}
.pjc-ct-sede-go:hover{ color:#fff; text-decoration:underline; text-underline-offset:3px; }
.pjc-ct-sede-go:focus-visible{ outline:2px solid var(--pjc-gold); outline-offset:3px; border-radius:3px; }
.pjc-ct-sede-go .fa{ font-size:.85em; margin-left:3px; }

/* Mapa en tono nocturno; recupera el color al interactuar */
.pjc-ct-map{
    position:relative;
    border-radius:var(--pjc-r-lg);
    overflow:hidden;
    border:1px solid rgba(255,255,255,.12);
    box-shadow:0 24px 60px rgba(0,0,20,.45);
    aspect-ratio:16 / 9;
}
.pjc-ct-map iframe{
    display:block;
    width:100%;
    height:100%;
    border:0;
    filter:grayscale(1) invert(.92) hue-rotate(185deg) brightness(.9) contrast(.92) saturate(.6);
    transition:filter .6s ease;
}
.pjc-ct-map:hover iframe,
.pjc-ct-map:focus-within iframe{ filter:none; }

/* ---------- Formulario ---------- */
.pjc-ct-form-wrap{ position:relative; }
.pjc-ct-form-wrap::before{            /* halo dorado detrás de la tarjeta */
    content:"";
    position:absolute;
    inset:-1px;
    border-radius:calc(var(--pjc-r-xl) + 1px);
    background:linear-gradient(150deg, rgba(186,160,89,.7), rgba(186,160,89,0) 40%, rgba(255,255,255,0) 60%, rgba(186,160,89,.35));
    z-index:0;
}
.pjc-ct-form{
    position:relative;
    z-index:1;
    padding:clamp(28px, 3.6vw, 48px);
    border-radius:var(--pjc-r-xl);
    background:#fff;
    box-shadow:0 40px 90px rgba(0,0,25,.45);
}
.pjc-ct-form-title{
    margin:0 0 6px;
    font-family:var(--pjc-font-serif);
    font-size:clamp(1.5rem, 2.3vw, 1.9rem);
    font-weight:var(--pjc-fw-regular);
    color:var(--pjc-navy);
}
.pjc-ct-form-sub{ margin:0 0 26px; font-size:.95rem; color:var(--pjc-body); }

.pjc-ct-fields{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
    margin-bottom:16px;
}

/* Campo con etiqueta flotante */
.pjc-fl{ position:relative; }
.pjc-fl--full{ grid-column:1 / -1; }
.pjc-fl-input{
    display:block;
    width:100%;
    height:58px;
    padding:24px 16px 8px;
    border:1px solid var(--pjc-line);
    border-radius:14px;
    background:var(--pjc-shell);
    font-family:var(--pjc-font-sans);
    font-size:1rem;
    font-weight:var(--pjc-fw-regular);
    color:var(--pjc-ink);
    transition:border-color .25s ease, background .25s ease, box-shadow .25s ease;
    -webkit-appearance:none;
    appearance:none;
}
.pjc-fl-textarea{ height:auto; min-height:132px; padding-top:28px; resize:vertical; line-height:1.6; }
.pjc-fl-label{
    position:absolute;
    left:17px; top:19px;
    margin:0;
    font-size:.98rem;
    font-weight:var(--pjc-fw-regular);
    color:var(--pjc-muted);
    pointer-events:none;
    transform-origin:left top;
    transition:transform .22s var(--pjc-ease), color .22s ease, top .22s var(--pjc-ease);
}
.pjc-fl-input:hover{ border-color:#d6d2c6; }
.pjc-fl-input:focus{
    outline:none;
    background:#fff;
    border-color:var(--pjc-bronze);
    box-shadow:0 0 0 4px rgba(141,128,94,.14);
}
.pjc-fl-input:focus + .pjc-fl-label,
.pjc-fl-input:not(:placeholder-shown) + .pjc-fl-label,
.pjc-fl--select .pjc-fl-label{
    top:9px;
    transform:scale(.76);
    font-weight:var(--pjc-fw-medium);
    letter-spacing:.04em;
    color:var(--pjc-bronze-dark);
}
.pjc-fl--select .pjc-fl-input{
    cursor:pointer;
    padding-right:46px;
    background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238D805E' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 16px center;
    background-size:17px;
}

.pjc-ct-send{ margin-top:4px; padding-top:17px; padding-bottom:17px; text-transform:none; letter-spacing:.02em; font-weight:var(--pjc-fw-medium); }
.pjc-ct-send .fa{ transition:transform .4s var(--pjc-ease); }
.pjc-ct-send:hover .fa{ transform:translate(4px, -3px); }
.pjc-ct-note{
    margin:14px 0 0;
    text-align:center;
    font-size:var(--pjc-fs-xs);
    color:var(--pjc-muted);
}
.pjc-ct-note .fa{ margin-right:4px; color:var(--pjc-bronze); }

/* ---------- Responsive ---------- */
@media (max-width: 991px){
    .pjc-ct-grid{ grid-template-columns:1fr; }
    .pjc-ct-form-wrap{ max-width:640px; }
}
@media (max-width: 575px){
    .pjc-ct-cards,
    .pjc-ct-fields{ grid-template-columns:1fr; }
    .pjc-ct-sedes li{ grid-template-columns:auto minmax(0, 1fr); }
    .pjc-ct-sede-go{ grid-column:2; }
    .pjc-ct-sos-v{ font-size:1.5rem; }
}

@media (prefers-reduced-motion: reduce){
    .pjc-ct-glow, .pjc-ct-sos-ico::after{ animation:none; }
    .pjc-ct-sos, .pjc-ct-card, .pjc-fl-label, .pjc-ct-map iframe{ transition:none; }
}

/* ==========================================================================
   Franja de llamada a la acción
   ========================================================================== */

.pjc-cta{
    position:relative;
    overflow:hidden;
    background:var(--pjc-navy);
    color:#fff;
}
.pjc-cta--steel{ background:var(--pjc-steel); }
.pjc-cta--sand{ background:var(--pjc-sand); }
.pjc-cta--sand .pjc-h2, .pjc-cta--sand .pjc-lead{ color:var(--pjc-navy); }
.pjc-cta::before{
    content:"";
    position:absolute;
    top:-40%; right:-8%;
    width:520px; height:520px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(186,160,89,.24), rgba(186,160,89,0) 68%);
    pointer-events:none;
}
.pjc-cta-inner{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:26px;
}
.pjc-cta-inner .pjc-lead{ margin-bottom:0; }

/* Franja de emergencia con teléfono */
.pjc-phone-strip{
    display:inline-flex;
    align-items:center;
    gap:16px;
    background:rgba(255,255,255,.1);
    border:1px solid rgba(255,255,255,.25);
    border-radius:100px;
    padding:12px 28px 12px 14px;
    backdrop-filter:blur(6px);
    text-decoration:none;
    transition:background .3s ease, transform .3s var(--pjc-ease);
}
.pjc-phone-strip:hover{ background:rgba(255,255,255,.2); transform:translateY(-2px); text-decoration:none; }
.pjc-phone-ico{
    width:46px; height:46px;
    border-radius:50%;
    background:var(--pjc-sand);
    color:var(--pjc-navy);
    display:flex; align-items:center; justify-content:center;
    font-size:18px;
    flex:0 0 auto;
}
.pjc-phone-k{ display:block; font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.7); font-weight:700; }
.pjc-phone-v{ display:block; font-family:"Roboto Slab", Georgia, serif; font-size:1.32rem; color:#fff; line-height:1.2; }

/* Latido suave para el icono de emergencia */
.pjc-pulse{ position:relative; }
.pjc-pulse::before{
    content:"";
    position:absolute;
    inset:-6px;
    border-radius:50%;
    border:2px solid var(--pjc-sand);
    opacity:0;
    animation:pjcPulse 2.4s var(--pjc-ease) infinite;
}
@keyframes pjcPulse{
    0%{ transform:scale(.85); opacity:.7; }
    70%{ transform:scale(1.35); opacity:0; }
    100%{ opacity:0; }
}

/* ==========================================================================
   Listas de características
   ========================================================================== */

.pjc-checklist{ list-style:none; margin:0 0 1.4em 0; padding:0; }
.pjc-checklist li{
    position:relative;
    padding:9px 0 9px 34px;
    font-size:.95rem;
    color:var(--pjc-body);
    border-bottom:1px solid var(--pjc-line-soft);
}
.pjc-checklist li:last-child{ border-bottom:0; }
.pjc-checklist li::before{
    content:"";
    position:absolute;
    left:2px; top:16px;
    width:14px; height:8px;
    border-left:2px solid var(--pjc-bronze);
    border-bottom:2px solid var(--pjc-bronze);
    transform:rotate(-45deg);
}

.pjc-includes-title{
    display:inline-block;
    font-size:.74rem;
    font-weight:700;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--pjc-navy);
    background:var(--pjc-sand);
    border-radius:100px;
    padding:6px 16px;
    margin-bottom:14px;
}

/* ==========================================================================
   Mosaico de formas de pago
   ========================================================================== */

.pjc-tile{
    position:relative;
    display:block;
    border-radius:var(--pjc-r);
    overflow:hidden;
    background:#fff;
    border:1px solid var(--pjc-line-soft);
    box-shadow:var(--pjc-sh-1);
    transition:transform .45s var(--pjc-ease), box-shadow .45s var(--pjc-ease);
}
.pjc-tile:hover{ transform:translateY(-5px); box-shadow:var(--pjc-sh-2); }
.pjc-tile img{ width:100%; height:auto; display:block; }

/* ==========================================================================
   Blog / enlaces externos
   ========================================================================== */

.pjc-post{ display:block; text-decoration:none; height:100%; }
.pjc-post:hover{ text-decoration:none; }
.pjc-post-media{
    position:relative;
    aspect-ratio:16/10;
    border-radius:var(--pjc-r);
    overflow:hidden;
    box-shadow:var(--pjc-sh-1);
    margin-bottom:16px;
}
.pjc-post-media img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.1s var(--pjc-ease); }
.pjc-post:hover .pjc-post-media img{ transform:scale(1.08); }
.pjc-post-media::after{
    content:"";
    position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(0,0,40,0) 45%, rgba(0,0,40,.55) 100%);
}
.pjc-post-title{
    font-family:"Roboto Slab", Georgia, serif;
    font-size:1rem;
    font-weight:500;
    color:var(--pjc-navy);
    line-height:1.35;
    margin:0 0 10px 0;
    transition:color .3s ease;
}
.pjc-post:hover .pjc-post-title{ color:var(--pjc-bronze); }
.pjc-post-more{
    font-size:.76rem;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--pjc-bronze);
}
.pjc-post-more i{ transition:transform .35s var(--pjc-ease); display:inline-block; margin-left:.4em; }
.pjc-post:hover .pjc-post-more i{ transform:translateX(5px); }

/* ==========================================================================
   Marco embebido (libro de memorias)
   ========================================================================== */

.pjc-embed{
    position:relative;
    border-radius:var(--pjc-r-lg);
    overflow:hidden;
    box-shadow:var(--pjc-sh-3);
    background:#fff;
    border:1px solid var(--pjc-line-soft);
}
.pjc-embed iframe{ display:block; width:100%; border:0; }

.pjc-video-hero{
    position:relative;
    overflow:hidden;
    background:var(--pjc-navy);
    max-height:min(72vh, 620px);
}
.pjc-video-hero video{
    width:100%;
    height:100%;
    max-height:min(72vh, 620px);
    object-fit:cover;
    object-position:center;
    display:block;
}
.pjc-video-veil{
    position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(0,0,40,.5) 0%, rgba(0,0,40,.15) 45%, rgba(0,0,40,.72) 100%);
    display:flex;
    align-items:flex-end;
}

/* ==========================================================================
   Revelado al hacer scroll
   ========================================================================== */

.pjc-reveal{
    opacity:0;
    transform:translateY(26px);
    transition:opacity .85s var(--pjc-ease), transform .85s var(--pjc-ease);
    will-change:opacity, transform;
}
.pjc-reveal.is-in{ opacity:1; transform:none; }
.pjc-reveal[data-d="1"]{ transition-delay:.09s; }
.pjc-reveal[data-d="2"]{ transition-delay:.18s; }
.pjc-reveal[data-d="3"]{ transition-delay:.27s; }
.pjc-reveal[data-d="4"]{ transition-delay:.36s; }
.pjc-reveal[data-d="5"]{ transition-delay:.45s; }
.pjc-reveal[data-d="6"]{ transition-delay:.54s; }

@media (prefers-reduced-motion: reduce){
    .pjc-reveal{ opacity:1; transform:none; transition:none; }
    .pjc-hero-media{ animation:none; transform:none; }
    .pjc-scroll-cue::after, .pjc-pulse::before{ animation:none; }
    .pjc-body *{ scroll-behavior:auto !important; }
}

/* ==========================================================================
   Encabezado del sitio  ·  Remake Fase 1 (ver remakeuxui.md)
   Navegación en Roboto ligera y en tipo oración; Emergencia como CTA primario.
   ========================================================================== */

/* Saltar al contenido (WCAG 2.4.1) */
.pjc-skip{
    position:absolute;
    left:16px; top:-60px;
    z-index:2000;
    padding:10px 18px;
    border-radius:var(--pjc-r-sm);
    background:var(--pjc-navy);
    color:#fff;
    font-size:var(--pjc-fs-sm);
    font-weight:var(--pjc-fw-medium);
    text-decoration:none;
    transition:top .2s ease;
}
.pjc-skip:focus{ top:12px; color:#fff; text-decoration:none; outline:none; box-shadow:var(--pjc-focus); }
#pjcMain:focus{ outline:none; }

/* ---- Barra superior ---- */
.pjc-topbar{
    background:var(--pjc-navy);
    color:rgba(255,255,255,.82);
    font-family:var(--pjc-font-sans);
    font-size:var(--pjc-fs-xs);
    font-weight:var(--pjc-fw-light);
    letter-spacing:.02em;
}
.pjc-topbar strong{ font-weight:var(--pjc-fw-medium); }
.pjc-topbar a{ color:rgba(255,255,255,.82); text-decoration:none; transition:color .25s ease; }
.pjc-topbar a:hover{ color:var(--pjc-sand); text-decoration:none; }
.pjc-topbar a:focus-visible{ outline:2px solid var(--pjc-gold); outline-offset:3px; border-radius:2px; }
.pjc-topbar-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:8px 24px;
    padding:9px 0;
}
.pjc-topbar-group{ display:flex; align-items:center; flex-wrap:wrap; gap:8px 22px; }
.pjc-topbar-group a{ display:inline-flex; align-items:center; gap:.5em; }
.pjc-topbar-sep{ color:rgba(255,255,255,.28); }

/* ---- Header ---- */
.pjc-header{
    position:sticky;
    top:0;
    z-index:1030;
    background:rgba(255,255,255,.9);
    -webkit-backdrop-filter:blur(14px) saturate(1.4);
    backdrop-filter:blur(14px) saturate(1.4);
    border-bottom:1px solid var(--pjc-line-soft);
    font-family:var(--pjc-font-sans);
    transition:box-shadow .35s ease, background .35s ease;
}
.pjc-header.is-stuck{ box-shadow:0 6px 26px rgba(21,22,28,.09); background:rgba(255,255,255,.96); }

/* Alturas del header: normal y compacta (al hacer scroll hacia abajo).
   Otras secciones usan --pjc-header-h-compact (p. ej. la escena de Nuestros servicios). */
:root{ --pjc-header-h-full:84px; --pjc-header-h-compact:64px; }
.pjc-header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    min-height:var(--pjc-header-h-full);
    transition:min-height .4s var(--pjc-ease);
}
.pjc-header.is-stuck .pjc-header-inner{ min-height:var(--pjc-header-h-compact); }

.pjc-brand{ display:inline-flex; align-items:center; flex:0 0 auto; border-radius:6px; }
.pjc-brand:focus-visible{ outline:none; box-shadow:var(--pjc-focus); }
.pjc-brand img{
    width:clamp(140px, 13vw, 180px);
    height:auto;
    transform-origin:left center;
    transition:transform .35s var(--pjc-ease);
}
.pjc-header.is-stuck .pjc-brand img{ transform:scale(.8); }

/* ---- Navegación principal ---- */
.pjc-nav{ display:flex; align-items:center; gap:2px; margin-left:auto; }
.pjc-nav-link{
    position:relative;
    display:inline-flex;
    align-items:center;
    gap:.35em;
    padding:10px 13px;
    border:0;
    border-radius:8px;
    background:transparent;
    font-family:var(--pjc-font-sans);
    font-size:var(--pjc-fs-nav);
    font-weight:var(--pjc-fw-regular);
    letter-spacing:.005em;
    line-height:1.4;
    text-transform:none;
    color:var(--pjc-navy);
    text-decoration:none;
    cursor:pointer;
    transition:color .28s ease, background .28s ease;
    white-space:nowrap;
}
.pjc-nav-link .fa{ font-size:.85em; opacity:.6; transition:transform .3s var(--pjc-ease); }
.pjc-nav-link::after{
    content:"";
    position:absolute;
    left:13px; right:13px; bottom:4px;
    height:1px;
    background:var(--pjc-bronze);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .38s var(--pjc-ease);
}
.pjc-nav-link:hover, .pjc-nav-link.is-active{ color:var(--pjc-bronze-dark); text-decoration:none; }
.pjc-nav-link:hover::after, .pjc-nav-link.is-active::after{ transform:scaleX(1); }
.pjc-nav-link:focus{ outline:none; }
.pjc-nav-link:focus-visible{ box-shadow:var(--pjc-focus); }

/* ---- Desplegables ---- */
.pjc-drop{ position:relative; }
.pjc-drop:hover > .pjc-nav-link .fa,
.pjc-drop.is-open > .pjc-nav-link .fa{ transform:rotate(180deg); }
.pjc-drop-panel{
    position:absolute;
    top:calc(100% + 10px);
    left:0;
    min-width:280px;
    background:#fff;
    border:1px solid var(--pjc-line-soft);
    border-radius:var(--pjc-r);
    box-shadow:var(--pjc-sh-3);
    padding:8px;
    opacity:0;
    visibility:hidden;
    transform:translateY(-8px);
    transition:opacity .3s ease, transform .3s var(--pjc-ease), visibility .3s;
}
/* Puente invisible: el hover no se pierde al cruzar el hueco de 10px */
.pjc-drop-panel::before{
    content:"";
    position:absolute;
    left:0; right:0; top:-12px;
    height:12px;
}
.pjc-drop:hover .pjc-drop-panel,
.pjc-drop.is-open .pjc-drop-panel{ opacity:1; visibility:visible; transform:none; }
.pjc-drop-item{
    display:block;
    padding:10px 14px;
    border-radius:9px;
    font-size:var(--pjc-fs-sm);
    font-weight:var(--pjc-fw-regular);
    line-height:1.4;
    color:var(--pjc-ink);
    text-decoration:none;
    transition:background .25s ease, color .25s ease, padding-left .25s var(--pjc-ease);
}
.pjc-drop-item:hover,
.pjc-drop-item:focus-visible{ background:var(--pjc-sand-soft); color:var(--pjc-navy); padding-left:20px; text-decoration:none; outline:none; }
.pjc-drop-item.is-active{ color:var(--pjc-bronze-dark); }
.pjc-drop-note{
    display:block;
    margin-top:2px;
    font-size:var(--pjc-fs-xs);
    font-weight:var(--pjc-fw-light);
    color:var(--pjc-muted);
}

/* ---- Acciones: Emergencia (primaria) y Pagar en línea (secundaria) ---- */
.pjc-header-actions{ display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.pjc-header-actions .pjc-btn{
    padding:10px 20px;
    font-size:var(--pjc-fs-sm);
    font-weight:var(--pjc-fw-medium);
    letter-spacing:.01em;
    text-transform:none;
}
.pjc-header-actions .pjc-btn:focus{ outline:none; }
.pjc-header-actions .pjc-btn:focus-visible{ outline:none; box-shadow:var(--pjc-focus); }
/* Emergencia: rótulo y número apilados para un botón compacto */
.pjc-header-actions .pjc-nav-sos{
    display:inline-grid;
    grid-template-columns:auto auto;
    grid-template-rows:auto auto;
    column-gap:10px;
    align-items:center;
    padding:7px 20px 7px 16px;
    line-height:1.15;
    text-align:left;
}
.pjc-nav-sos .fa{ grid-row:1 / span 2; font-size:1.05rem; }
.pjc-nav-sos-k{
    font-size:var(--pjc-fs-2xs);
    font-weight:var(--pjc-fw-light);
    letter-spacing:.06em;
    opacity:.85;
}
.pjc-nav-sos-v{
    font-size:.98rem;
    font-weight:var(--pjc-fw-medium);
    letter-spacing:.03em;
}

/* ---- Botón hamburguesa ---- */
.pjc-burger{
    display:none;
    width:46px; height:46px;
    border:1px solid var(--pjc-line);
    border-radius:12px;
    background:#fff;
    cursor:pointer;
    padding:0;
    position:relative;
}
.pjc-burger:focus{ outline:none; }
.pjc-burger:focus-visible{ box-shadow:var(--pjc-focus); }
.pjc-burger span{
    position:absolute;
    left:13px;
    width:20px; height:1.5px;
    background:var(--pjc-navy);
    border-radius:2px;
    transition:transform .35s var(--pjc-ease), opacity .25s ease, top .35s var(--pjc-ease);
}
.pjc-burger span:nth-child(1){ top:16px; }
.pjc-burger span:nth-child(2){ top:22px; }
.pjc-burger span:nth-child(3){ top:28px; }
.pjc-burger.is-open span:nth-child(1){ top:22px; transform:rotate(45deg); }
.pjc-burger.is-open span:nth-child(2){ opacity:0; }
.pjc-burger.is-open span:nth-child(3){ top:22px; transform:rotate(-45deg); }

/* ---- Menú móvil ---- */
.pjc-mobile{
    position:fixed;
    inset:0;
    z-index:1040;
    background:rgba(0,0,40,.45);
    -webkit-backdrop-filter:blur(3px);
    backdrop-filter:blur(3px);
    opacity:0;
    visibility:hidden;
    font-family:var(--pjc-font-sans);
    transition:opacity .35s ease, visibility .35s;
}
.pjc-mobile.is-open{ opacity:1; visibility:visible; }
.pjc-mobile-panel{
    position:absolute;
    top:0; right:0;
    width:min(400px, 88vw);
    height:100%;
    background:#fff;
    box-shadow:-14px 0 44px rgba(21,22,28,.2);
    padding:24px 22px 40px 22px;
    overflow-y:auto;
    transform:translateX(102%);
    transition:transform .45s var(--pjc-ease);
}
.pjc-mobile.is-open .pjc-mobile-panel{ transform:none; }
.pjc-mobile-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding-bottom:18px;
    border-bottom:1px solid var(--pjc-line-soft);
    margin-bottom:16px;
}
.pjc-mobile-close{
    width:44px; height:44px;
    border:1px solid var(--pjc-line);
    border-radius:12px;
    background:#fff;
    color:var(--pjc-navy);
    font-size:20px;
    font-weight:var(--pjc-fw-light);
    cursor:pointer;
    line-height:1;
}
.pjc-mobile-close:focus{ outline:none; }
.pjc-mobile-close:focus-visible{ box-shadow:var(--pjc-focus); }

/* Emergencia destacada al abrir el menú */
.pjc-mobile-sos{
    display:flex;
    align-items:center;
    gap:14px;
    padding:14px 16px;
    margin-bottom:10px;
    border-radius:var(--pjc-r);
    background:var(--pjc-navy);
    color:#fff;
    text-decoration:none;
}
.pjc-mobile-sos:hover{ background:var(--pjc-navy-800); color:#fff; text-decoration:none; }
.pjc-mobile-sos:focus-visible{ outline:none; box-shadow:var(--pjc-focus); }
.pjc-mobile-sos-ico{
    display:inline-flex; align-items:center; justify-content:center;
    width:42px; height:42px;
    border-radius:50%;
    background:rgba(255,255,255,.12);
    font-size:17px;
}
.pjc-mobile-sos-k{ display:block; font-size:var(--pjc-fs-xs); font-weight:var(--pjc-fw-light); letter-spacing:.04em; opacity:.85; }
.pjc-mobile-sos-v{ display:block; font-family:var(--pjc-font-serif); font-size:1.3rem; font-weight:var(--pjc-fw-regular); line-height:1.2; }

.pjc-mobile-link{
    display:block;
    padding:14px 6px;
    border-bottom:1px solid var(--pjc-line-soft);
    color:var(--pjc-navy);
    font-size:1rem;
    font-weight:var(--pjc-fw-regular);
    letter-spacing:.005em;
    text-transform:none;
    text-decoration:none;
}
.pjc-mobile-sub{
    display:block;
    padding:11px 6px 11px 22px;
    border-bottom:1px solid var(--pjc-line-soft);
    color:var(--pjc-body);
    font-size:var(--pjc-fs-sm);
    font-weight:var(--pjc-fw-regular);
    text-decoration:none;
}
.pjc-mobile-link:hover, .pjc-mobile-sub:hover,
.pjc-mobile-link.is-active, .pjc-mobile-sub.is-active{ color:var(--pjc-bronze-dark); text-decoration:none; }
.pjc-mobile-link.is-active, .pjc-mobile-sub.is-active{ box-shadow:inset 2px 0 0 var(--pjc-bronze); }
.pjc-mobile-link:focus-visible, .pjc-mobile-sub:focus-visible{ outline:none; box-shadow:var(--pjc-focus); border-radius:6px; }
.pjc-mobile-group{
    padding:18px 6px 7px 6px;
    font-size:var(--pjc-fs-2xs);
    font-weight:var(--pjc-fw-medium);
    letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--pjc-muted);
}
.pjc-mobile-pbx{
    display:block;
    margin-top:14px;
    text-align:center;
    font-size:var(--pjc-fs-sm);
    font-weight:var(--pjc-fw-light);
    color:var(--pjc-body);
    text-decoration:none;
}
.pjc-mobile-pbx:hover{ color:var(--pjc-navy); text-decoration:none; }

/* ---- Puntos de corte ---- */
@media (max-width: 1400px){
    .pjc-nav-pay{ display:none !important; }   /* Pagar en línea sigue en el menú móvil */
    .pjc-nav-link{ padding:10px 11px; }
    .pjc-nav-link::after{ left:11px; right:11px; }
}
/* Header compacto: también se reducen enlaces y botones */
.pjc-nav-link{ transition:color .28s ease, background .28s ease, padding .4s var(--pjc-ease); }
.pjc-header.is-stuck .pjc-nav-link{ padding-top:7px; padding-bottom:7px; }
.pjc-header-actions .pjc-btn{ transition:transform .35s var(--pjc-ease), box-shadow .35s var(--pjc-ease), background .3s ease, color .3s ease, border-color .3s ease, padding .4s var(--pjc-ease); }
.pjc-header.is-stuck .pjc-header-actions .pjc-nav-pay{ padding-top:8px; padding-bottom:8px; }
.pjc-header.is-stuck .pjc-header-actions .pjc-nav-sos{ padding-top:4px; padding-bottom:4px; }
.pjc-burger{ transition:transform .4s var(--pjc-ease); }
.pjc-header.is-stuck .pjc-burger{ transform:scale(.9); }

@media (max-width: 1200px){
    :root{ --pjc-header-h-full:76px; --pjc-header-h-compact:62px; }
    .pjc-nav{ display:none; }
    .pjc-burger{ display:block; }
    .pjc-nav-pay{ display:inline-flex !important; }
}
@media (max-width: 767px){
    .pjc-nav-pay{ display:none !important; }
    .pjc-topbar .pjc-hide-sm{ display:none; }  /* gana a .pjc-topbar-group a */
}
@media (max-width: 575px){
    .pjc-nav-sos-k{ display:none; }            /* en móvil: ícono + número */
    :root{ --pjc-header-h-full:68px; --pjc-header-h-compact:58px; }
    .pjc-header-actions .pjc-nav-sos{ padding:10px 14px; column-gap:8px; }
    .pjc-header.is-stuck .pjc-header-actions .pjc-nav-sos{ padding:7px 13px; }
    .pjc-header-inner{ gap:10px; }
    .pjc-brand img{ width:128px; }
}

/* ---- Movimiento reducido (WCAG 2.3.3) ---- */
@media (prefers-reduced-motion: reduce){
    .pjc-header, .pjc-header-inner, .pjc-brand img, .pjc-nav-link, .pjc-nav-link::after, .pjc-nav-link .fa,
    .pjc-header-actions .pjc-btn, .pjc-burger,
    .pjc-drop-panel, .pjc-drop-item, .pjc-burger span, .pjc-mobile, .pjc-mobile-panel, .pjc-skip{
        transition:none !important;
    }
    .pjc-btn:hover{ transform:none; }
    .pjc-btn::after{ display:none; }
}

/* ==========================================================================
   Pie de página
   ========================================================================== */

.pjc-footer{
    background:var(--pjc-navy);
    color:rgba(255,255,255,.68);
    font-size:.92rem;
    padding:clamp(52px, 7vw, 84px) 0 0 0;
}
.pjc-footer-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
    gap:clamp(28px, 4vw, 54px);
    padding-bottom:clamp(36px, 5vw, 56px);
}
.pjc-footer-title{
    font-family:"Roboto Slab", Georgia, serif;
    font-size:1rem;
    font-weight:500;
    color:#fff;
    margin:0 0 18px 0;
    letter-spacing:.02em;
}
.pjc-footer p{ margin:0 0 .9em 0; line-height:1.75; }
.pjc-footer a{ color:rgba(255,255,255,.68); text-decoration:none; transition:color .25s ease; }
.pjc-footer a:hover{ color:var(--pjc-sand); text-decoration:none; }
.pjc-footer-list{ list-style:none; margin:0; padding:0; }
.pjc-footer-list li{ margin-bottom:.85em; line-height:1.6; }
.pjc-footer-brand img{ width:190px; height:auto; margin-bottom:20px; }
.pjc-footer-social{ display:flex; gap:10px; margin-top:16px; }
.pjc-footer-social a{
    width:40px; height:40px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.22);
    display:flex; align-items:center; justify-content:center;
    font-size:15px;
    transition:all .3s var(--pjc-ease);
}
.pjc-footer-social a:hover{ background:var(--pjc-sand); color:var(--pjc-navy); border-color:var(--pjc-sand); transform:translateY(-3px); }
.pjc-footer-bar{
    border-top:1px solid rgba(255,255,255,.12);
    padding:22px 0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:12px;
    font-size:.84rem;
    color:rgba(255,255,255,.5);
}
.pjc-footer-bar a{ color:rgba(255,255,255,.5); }

/* Métodos de pago en el pie */
.pjc-paylogos{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.pjc-paylogos img{ height:20px; width:auto; opacity:.75; filter:brightness(0) invert(1); transition:opacity .3s ease; }
.pjc-paylogos img:hover{ opacity:1; }

/* ==========================================================================
   Utilidades
   ========================================================================== */

.pjc-mt-0{ margin-top:0 !important; }
.pjc-mb-0{ margin-bottom:0 !important; }
.pjc-mt-3{ margin-top:clamp(18px,2.4vw,30px); }
.pjc-mt-4{ margin-top:clamp(26px,3.4vw,42px); }
.pjc-full{ width:100%; }
.pjc-relative{ position:relative; }
.pjc-hide-sm{ display:initial; }

@media (max-width: 767px){
    .pjc-hide-sm{ display:none; }
    .pjc-split--reverse .pjc-split-media{ order:0; }
    .pjc-cta-inner{ flex-direction:column; align-items:flex-start; }
    .pjc-service-meta b{ flex-basis:78px; }
    .pjc-gallery{ grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:10px; }
}