/** Shopify CDN: Minification failed

Line 306:0 Unexpected "}"
Line 433:0 Unexpected "}"

**/
/* ==========================================================================
   PLEENA · Sistema de scroll, reveals y secciones de marca
   Mobile-first. Todo visible por defecto si el JS falla.
   ========================================================================== */

:root{
  --pl-bg:#F6F1EA;
  --pl-bg-deep:#EDE3D8;
  --pl-ink:#2B211B;
  --pl-soft:#7A6A5D;
  --pl-line:#E2D5C6;
  --pl-accent:#C09A7E;
  --pl-deep:#8A6A52;
  --pl-ease:cubic-bezier(.22,1,.36,1);
  --pl-pad:20px;
}
@media (min-width:900px){ :root{ --pl-pad:clamp(28px,4vw,72px); } }

.pl{position:relative;background:var(--pl-bg);color:var(--pl-ink);font-family:var(--font-body-family,inherit);-webkit-font-smoothing:antialiased;overflow:clip}
.pl *,.pl *::before,.pl *::after{box-sizing:border-box}
.pl p{margin:0}
.pl a{color:inherit;text-decoration:none}
.pl img{display:block;max-width:100%}
.pl strong,.pl b{font-weight:inherit;color:var(--pl-accent)}

/* color:inherit es obligatorio — el tema pinta h1/h2/h3 con su propio color
   y eso rompe los títulos claros sobre fondo oscuro.
   --pl-display lo fija la sección del símbolo para toda la página. */
.pl-h{font-family:var(--pl-display,var(--font-heading-family,inherit));font-weight:var(--pl-display-weight,var(--font-heading-weight,600));line-height:1.07;letter-spacing:-.025em;margin:0;color:inherit}
.pgal__name,.pfp__name,.pexp__tile h3,.prit__step h3,.pcta__title,.pgal__title{color:inherit}
.pl-eyebrow{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--pl-deep);margin:0;font-weight:500}
.pl-sub{font-size:clamp(15px,3.7vw,18px);line-height:1.62;color:var(--pl-soft)}
.pl-wrap{padding-left:var(--pl-pad);padding-right:var(--pl-pad);max-width:1340px;margin:0 auto;width:100%}

/* ---------- botones (especificidad alta: `.pl a` pisa el color si no) ------ */
.pl .pl-btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:54px;padding:0 28px;border-radius:999px;font-family:inherit;font-size:15px;font-weight:600;letter-spacing:.01em;border:1px solid transparent;cursor:pointer;text-align:center;position:relative;overflow:hidden;transition:transform .35s var(--pl-ease),background .35s,color .35s,border-color .35s,box-shadow .35s}
.pl .pl-btn--solid{background:var(--pl-ink);color:#fff}
.pl .pl-btn--solid:hover{background:var(--pl-deep);box-shadow:0 14px 34px -14px rgba(43,33,27,.55)}
.pl .pl-btn--ghost{border-color:currentColor;background:transparent}
.pl .pl-btn--ghost:hover{background:currentColor}
.pl .pl-btn--light{background:#fff;color:#2B211B}
.pl .pl-btn--light:hover{box-shadow:0 16px 38px -16px rgba(0,0,0,.5)}
.pl .pl-btn:active{transform:scale(.97)}
.pl .pl-btn svg{flex:0 0 auto}
/* brillo que cruza el botón al pasar el cursor */
.pl .pl-btn::after{content:"";position:absolute;top:0;bottom:0;width:45%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:translateX(-220%) skewX(-16deg);transition:transform .7s var(--pl-ease);pointer-events:none}
.pl .pl-btn--light::after{background:linear-gradient(100deg,transparent,rgba(43,33,27,.14),transparent)}
.pl .pl-btn:hover::after{transform:translateX(320%) skewX(-16deg)}

/* ---------- reveals (solo se ocultan si el JS arrancó) ---------- */
.pl-js [data-preveal]{opacity:0;transform:translateY(26px);transition:opacity .9s var(--pl-ease) var(--d,0s),transform .9s var(--pl-ease) var(--d,0s);will-change:opacity,transform}
.pl-js [data-preveal="fade"]{transform:none}
.pl-js [data-preveal="rise"]{transform:translateY(54px)}
.pl-js [data-preveal="scale"]{transform:scale(1.06)}
.pl-js [data-preveal="left"]{transform:translateX(-28px)}
.pl-js [data-preveal="mask"]{opacity:1;transform:none;clip-path:inset(0 0 103% 0);transition:clip-path 1.2s var(--pl-ease) var(--d,0s)}
.pl-js [data-preveal="none"]{opacity:1;transform:none}
[data-preveal-on]{opacity:1 !important;transform:none !important;clip-path:inset(0 0 0 0) !important}

/* ---------- reveal por palabras ---------- */
.pl-words .pl-word{display:inline-block;overflow:hidden;padding-bottom:.16em;margin-bottom:-.16em;vertical-align:bottom}
.pl-words .pl-word > i{display:inline-block;font-style:inherit}
.pl-js .pl-words .pl-word > i{transform:translateY(115%);transition:transform 1.05s var(--pl-ease) var(--d,0s)}
.pl-js .pl-words[data-preveal-on] .pl-word > i{transform:none}

/* ---------- puntos flotantes (compartido) ---------- */
.pl-dots{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.pl-dots i{position:absolute;display:block;width:var(--s,4px);height:var(--s,4px);border-radius:50%;background:var(--pl-dot,rgba(192,154,126,.6));box-shadow:0 0 12px var(--pl-dot,rgba(192,154,126,.5));opacity:0;animation:plDot var(--t,9s) ease-in-out var(--dl,0s) infinite}
.pl-dots i.is-ring{width:calc(var(--s,4px) * 2.6);height:calc(var(--s,4px) * 2.6);background:none;box-shadow:none;border:1px solid var(--pl-dot,rgba(192,154,126,.6));animation-name:plDotRing}
.pl-dots i.is-soft{width:calc(var(--s,4px) * 1.9);height:calc(var(--s,4px) * 1.9);filter:blur(1.7px)}
@keyframes plDot{
  0%{opacity:0;transform:translate3d(0,18px,0) scale(.45)}
  20%{opacity:.95}
  56%{opacity:.62;transform:translate3d(calc(var(--mx,0px) / 2),-12px,0) scale(1)}
  100%{opacity:0;transform:translate3d(var(--mx,0px),-34px,0) scale(.55)}
}
@keyframes plDotRing{
  0%{opacity:0;transform:translate3d(0,14px,0) scale(.3)}
  28%{opacity:.55}
  62%{opacity:.4;transform:translate3d(calc(var(--mx,0px) / 2),-14px,0) scale(.9)}
  100%{opacity:0;transform:translate3d(var(--mx,0px),-32px,0) scale(1.2)}
}

/* ---------- brillo que barre un texto ---------- */
.pl-shine{position:relative;display:inline-block}
.pl-shine::after{content:attr(data-text);position:absolute;left:0;top:0;white-space:nowrap;background:linear-gradient(100deg,transparent 38%,var(--pl-shine,rgba(255,255,255,.95)) 50%,transparent 62%);background-size:260% 100%;background-repeat:no-repeat;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;pointer-events:none;animation:plShine 5.5s ease-in-out 1s infinite}
@keyframes plShine{0%{background-position:260% 0}45%,100%{background-position:-160% 0}}

/* ==========================================================================
   01 · HERO
   ========================================================================== */
.plh{position:relative;min-height:88vh;min-height:88svh;display:flex;align-items:flex-end;isolation:isolate}
.plh--full{min-height:calc(100vh - var(--plh-cut,0px));min-height:calc(100svh - var(--plh-cut,0px))}
.plh__media{position:absolute;inset:-9% 0;z-index:0;overflow:hidden;transform:translate3d(0,var(--plh-y,0),0);will-change:transform}
.plh__media img{width:100%;height:100%;object-fit:cover;object-position:var(--plh-pos,center);animation:plKen 24s ease-in-out infinite alternate}
@keyframes plKen{from{transform:scale(1)}to{transform:scale(1.09)}}
.plh__fallback{position:absolute;inset:0;background:radial-gradient(120% 90% at 20% 15%,#F2E7DD 0%,#E3D2C4 55%,#C9AE9B 100%)}
.plh__veil{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(22,18,15,.44) 0%,rgba(22,18,15,.10) 18%,rgba(22,18,15,.38) 40%,rgba(22,18,15,.74) 60%,rgba(22,18,15,.94) 100%)}
.plh .pl-dots{z-index:1;--pl-dot:rgba(255,255,255,.75)}
.plh__inner{position:relative;z-index:2;width:100%;padding-top:16vh;isolation:isolate;padding-bottom:clamp(74px,19vw,94px)}
.plh__eyebrow{color:rgba(255,255,255,.86);display:inline-flex;align-items:center;gap:12px}
.plh__eyebrow::before{content:"";display:block;width:clamp(22px,7vw,40px);height:1px;background:var(--plh-accent,#E8CDBC);transform-origin:left;animation:plLine 1.4s var(--pl-ease) .2s both}
@keyframes plLine{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.pl .plh__title{color:#fff;font-size:clamp(2.45rem,10.2vw,6.4rem);margin:14px 0 0;max-width:14ch}
.plh__title .pl-word > i,.plh__eyebrow,.plh__sub{text-shadow:0 1px 3px rgba(22,18,15,.55),0 2px 22px rgba(22,18,15,.65)}
.plh__title em{font-style:normal;color:var(--plh-accent,#E8CDBC);display:block}
.plh__sub{color:rgba(255,255,255,.92);max-width:32ch;margin-top:16px}
.plh__cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.plh__cta .pl-btn{flex:1 1 0;min-width:0;padding:0 14px;font-size:14px}
.plh__cue{position:absolute;left:50%;bottom:12px;z-index:3;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;color:rgba(255,255,255,.7);font-size:9px;letter-spacing:.22em;text-transform:uppercase;pointer-events:none}
.plh__cue span{display:block;width:1px;height:28px;background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,0));animation:plCue 2.1s var(--pl-ease) infinite}
@keyframes plCue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@media (min-width:900px){
  .plh__cta{gap:12px;margin-top:30px}
  .plh__cta .pl-btn{flex:0 0 auto;padding:0 30px;font-size:15px}
  .plh__inner{padding-bottom:clamp(56px,6vw,92px)}
  .plh__sub{font-size:19px;max-width:38ch}
  .plh__cue{bottom:20px;font-size:10px}
  .plh__cue span{height:38px}
  /* en escritorio el texto vive a la izquierda: se oscurece esa franja */
  .plh__veil{background:
    linear-gradient(180deg,rgba(22,18,15,.36) 0%,rgba(22,18,15,.04) 26%,rgba(22,18,15,.06) 46%,rgba(22,18,15,.52) 100%),
    linear-gradient(96deg,rgba(22,18,15,.86) 0%,rgba(22,18,15,.72) 34%,rgba(22,18,15,.34) 58%,rgba(22,18,15,.04) 80%,rgba(22,18,15,0) 100%)}
}

/* ==========================================================================
   02 · SYMBOL STORY (el símbolo se abre y nace el wordmark)
   ========================================================================== */
.psym{position:relative;background:var(--psym-bg,#F2EBE4);color:var(--pl-ink)}
.psym__track{position:relative;height:var(--psym-h,230vh)}
.psym__stage{position:sticky;top:0;height:calc(100vh - var(--psym-cut,0px));height:calc(100svh - var(--psym-cut,0px));display:grid;place-items:center;overflow:hidden;padding:0 var(--pl-pad)}
.psym .pl-dots{--pl-dot:var(--psym-dot,rgba(192,154,126,.6))}
.psym__inner{position:relative;z-index:1;width:100%;max-width:980px;display:grid;grid-template-columns:1fr;place-items:center;text-align:center}
.psym__glow{grid-area:1/1;position:absolute;width:min(120vw,900px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,var(--psym-glow,rgba(192,154,126,.28)) 0%,rgba(192,154,126,0) 68%);z-index:0;pointer-events:none;animation:plBreathe 7s ease-in-out infinite}
@keyframes plBreathe{0%,100%{transform:scale(.92);opacity:.75}50%{transform:scale(1.06);opacity:1}}

.psym__mark{grid-area:1/1;position:relative;z-index:1;width:min(74vw,340px);height:auto;overflow:visible}
.psym__mark path,.psym__mark circle{fill:none;stroke:var(--psym-mark,#2B211B);stroke-width:7;stroke-linecap:round;vector-effect:non-scaling-stroke}
.psym__ring{opacity:.55}
.psym__bar{transform-box:fill-box;transform-origin:center}
.psym__eL,.psym__eR{transform-box:fill-box;transform-origin:center}

/* el trazo se dibuja solo al cargar. En CSS y no en GSAP a propósito:
   una animación CSS con fill-mode both siempre acaba en su estado final,
   aunque el navegador congele los frames intermedios. */
.psym__stage.is-live .psym__ring{stroke-dasharray:704;animation:plDrawRing 1.5s var(--pl-ease) .2s both}
.psym__stage.is-live .psym__eL{stroke-dasharray:268;animation:plDrawE 1.1s var(--pl-ease) .5s both}
.psym__stage.is-live .psym__eR{stroke-dasharray:268;animation:plDrawE 1.1s var(--pl-ease) .64s both}
.psym__stage.is-live .psym__bar{stroke-dasharray:196;animation:plDrawBar .7s var(--pl-ease) 1.18s both}
@keyframes plDrawRing{from{stroke-dashoffset:704}to{stroke-dashoffset:0}}
@keyframes plDrawE{from{stroke-dashoffset:268}to{stroke-dashoffset:0}}
@keyframes plDrawBar{from{stroke-dashoffset:196}to{stroke-dashoffset:0}}

/* el nombre queda exactamente sobre el centro del símbolo;
   bajada y frase cuelgan debajo sin desplazarlo */
.psym__reveal{grid-area:1/1;position:relative;z-index:2;display:grid;place-items:center;width:100%;pointer-events:none}
.psym__sub{position:absolute;top:100%;left:0;right:0;margin-top:clamp(16px,4vw,26px);display:grid;gap:10px;place-items:center}
.psym__word{position:relative;font-family:var(--pl-display,var(--font-heading-family,inherit));font-weight:var(--pl-display-weight,var(--font-heading-weight,600));font-size:clamp(3rem,15vw,9rem);line-height:1;letter-spacing:-.03em;color:var(--psym-mark,#2B211B);white-space:nowrap}
.psym__word img{width:min(72vw,520px);height:auto}
.psym__claim{max-width:26ch;font-size:clamp(14px,3.7vw,18px);line-height:1.6;color:var(--pl-soft)}
.psym__tag{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--pl-deep)}
.psym__progress{position:absolute;left:50%;bottom:clamp(54px,11vh,86px);transform:translateX(-50%);width:min(46vw,190px);height:1px;background:rgba(43,33,27,.14);z-index:3;overflow:hidden}
.psym__progress i{display:block;height:100%;width:100%;background:var(--pl-deep);transform:scaleX(var(--psym-p,0));transform-origin:left}
.psym__cue{position:absolute;left:50%;bottom:clamp(18px,4.5vh,34px);transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--pl-deep);opacity:.7;pointer-events:none}
.psym__cue span{display:block;width:1px;height:24px;background:linear-gradient(180deg,currentColor,transparent);animation:plCue 2.1s var(--pl-ease) infinite}

/* estado por defecto (sin JS): marca chica arriba + nombre debajo */
.psym__stage:not(.is-live) .psym__mark{grid-area:auto;width:min(34vw,140px);margin-bottom:26px}
.psym__stage:not(.is-live) .psym__reveal{grid-area:auto}
.psym__stage:not(.is-live) .psym__sub{position:relative;top:auto}
.psym__stage:not(.is-live) .psym__progress,.psym__stage:not(.is-live) .psym__cue{display:none}

/* ==========================================================================
   03 · STICKY GALLERY (scroll vertical → recorrido horizontal)
   ========================================================================== */
.pgal{position:relative;background:var(--pgal-bg,#2B211B);color:#fff}
.pgal__track{position:relative}
.pgal__stage{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;gap:clamp(16px,3vh,30px);overflow:hidden;padding:clamp(72px,12vh,110px) 0 clamp(52px,9vh,80px)}
.pgal .pl-dots{--pl-dot:var(--pgal-accent,rgba(224,194,178,.5))}
.pgal__head{position:relative;z-index:1;display:flex;align-items:flex-end;justify-content:space-between;gap:18px}
.pgal__head .pl-eyebrow{color:var(--pl-on-soft,rgba(255,255,255,.7))}
.pgal__title{font-size:clamp(1.8rem,7vw,3.4rem);max-width:16ch;margin-top:8px}
.pgal__count{font-size:12px;letter-spacing:.18em;color:var(--pl-on-faint,rgba(255,255,255,.55));white-space:nowrap;font-variant-numeric:tabular-nums}

.pgal__rail{position:relative;z-index:1;display:flex;gap:14px;padding:4px var(--pl-pad);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;will-change:transform}
.pgal__rail::-webkit-scrollbar{display:none}
.pgal--live .pgal__rail{overflow:visible;scroll-snap-type:none;padding-right:0}

.pgal__card{position:relative;flex:0 0 auto;width:min(74vw,320px);scroll-snap-align:center;display:flex;flex-direction:column;gap:14px}
.pgal__shot{position:relative;aspect-ratio:4/5;border-radius:18px;overflow:hidden;background:#EDE3D8}
.pgal__shot img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--pl-ease)}
.pgal__card:hover .pgal__shot img{transform:scale(1.05)}
.pgal__idx{position:absolute;top:12px;left:12px;font-size:10px;letter-spacing:.18em;padding:6px 10px;border-radius:999px;background:rgba(0,0,0,.42);backdrop-filter:blur(6px);color:#fff}
.pgal__badge{position:absolute;top:12px;right:12px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;padding:6px 10px;border-radius:999px;background:var(--pgal-ink-ac,#8A5F44);color:#fff;font-weight:600}
.pgal__meta{display:flex;flex-direction:column;gap:5px}
.pgal__name{font-family:var(--pl-display,var(--font-heading-family,inherit));font-weight:var(--pl-display-weight,var(--font-heading-weight,600));font-size:16px;line-height:1.3;letter-spacing:-.01em}
.pgal__note{font-size:13px;line-height:1.5;color:var(--pl-on-soft,rgba(255,255,255,.6))}
.pgal__price{display:flex;align-items:baseline;gap:8px;font-size:15px;margin-top:2px}
.pgal__price s{color:var(--pl-on-faint,rgba(255,255,255,.42));font-size:13px}
.pgal__link{margin-top:6px;font-size:13px;letter-spacing:.02em;display:inline-flex;align-items:center;gap:7px;color:var(--pl-on,#fff);border-bottom:1px solid currentColor;padding-bottom:3px;align-self:flex-start}

.pgal__bar{position:relative;z-index:1;margin:0 var(--pl-pad);height:2px;background:var(--pl-on-hair,rgba(255,255,255,.14));overflow:hidden;border-radius:2px}
.pgal__bar i{display:block;height:100%;background:var(--pgal-accent,#E7CDB6);transform:scaleX(var(--pgal-p,0));transform-origin:left;transition:transform .12s linear}
.pgal__hint{position:relative;z-index:1;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--pl-on-faint,rgba(255,255,255,.42));text-align:center}

@media (min-width:900px){
  .pgal__card{width:min(42vw,520px)}
  .pgal__rail{gap:22px}
  .pgal__note{font-size:14px}
  .pgal__name{font-size:18px}
}

/* ==========================================================================
   04 · RITUAL (puntos, destellos y línea que se dibuja)
   ========================================================================== */
.prit{position:relative;padding:clamp(60px,13vw,130px) 0;background:var(--prit-bg,#F7F3EF);color:var(--prit-text,#2B211B);overflow:clip}
.prit .pl-dots{--pl-dot:var(--prit-accent,rgba(192,154,126,.55))}
.prit__inner{position:relative;z-index:1}
.prit__head{display:grid;gap:12px;justify-items:center;text-align:center;margin-bottom:clamp(34px,8vw,64px)}
.prit__head .pl-eyebrow{color:var(--prit-accent,#8A6A52)}
.prit__title{font-size:clamp(1.9rem,7.6vw,3.6rem);max-width:17ch}
.prit__sub{max-width:44ch;color:var(--prit-soft,#6E6158)}

.prit__steps{list-style:none;margin:0;padding:0;display:grid;gap:clamp(22px,6vw,28px);position:relative}
/* línea que une los pasos y se dibuja con el scroll */
.prit__steps::before{content:"";position:absolute;left:34px;top:34px;bottom:34px;width:1px;background:linear-gradient(180deg,var(--prit-accent,#C09A7E),transparent);opacity:.35;transform:scaleY(var(--prit-line,0));transform-origin:top;transition:transform .2s linear}
.prit__step{position:relative;display:grid;grid-template-columns:68px 1fr;gap:16px;align-items:start;padding:18px;border-radius:18px;background:var(--prit-card,rgba(255,255,255,.72));border:1px solid var(--prit-border,#E4D9CE);overflow:hidden}
/* destello que cruza la tarjeta al aparecer */
.prit__step::after{content:"";position:absolute;top:0;bottom:0;left:0;width:60%;background:linear-gradient(105deg,transparent 28%,var(--prit-shine,rgba(255,255,255,.85)) 50%,transparent 72%);transform:translateX(-160%) skewX(-14deg);pointer-events:none}
.prit__step[data-preveal-on]::after{animation:plCardShine 1.6s var(--pl-ease) .25s 1}
@keyframes plCardShine{to{transform:translateX(320%) skewX(-14deg)}}

.prit__orb{position:relative;width:68px;height:68px;display:grid;place-items:center;flex:0 0 auto}
.prit__orb b{position:relative;z-index:2;font-family:var(--pl-display,var(--font-heading-family,inherit));font-weight:var(--pl-display-weight,var(--font-heading-weight,600));font-size:17px;letter-spacing:-.02em;color:var(--prit-accent,#8A6A52)}
.prit__orb i{position:absolute;inset:0;border-radius:50%;border:1px solid var(--prit-accent,#C09A7E);opacity:0;animation:plOrb 3.2s ease-out var(--dl,0s) infinite}
.prit__orb i:nth-child(2){animation-delay:calc(var(--dl,0s) + 1.1s)}
.prit__orb i:nth-child(3){animation-delay:calc(var(--dl,0s) + 2.2s)}
.prit__orb::before{content:"";position:absolute;inset:14px;border-radius:50%;background:var(--prit-orb,rgba(192,154,126,.16));z-index:1}
@keyframes plOrb{0%{transform:scale(.58);opacity:0}25%{opacity:.75}100%{transform:scale(1.05);opacity:0}}

.prit__step h3{font-family:var(--pl-display,var(--font-heading-family,inherit));font-weight:var(--pl-display-weight,var(--font-heading-weight,600));font-size:clamp(17px,4.6vw,21px);letter-spacing:-.02em;margin:6px 0 0}
.prit__step p{font-size:14px;line-height:1.58;color:var(--prit-soft,#6E6158);margin-top:6px}
.prit__tag{display:inline-block;margin-top:10px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--prit-accent,#8A6A52);border:1px solid currentColor;border-radius:999px;padding:5px 10px;opacity:.85}

@media (min-width:860px){
  .prit__steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
  .prit__steps::before{left:34px;right:34px;top:52px;bottom:auto;width:auto;height:1px;background:linear-gradient(90deg,var(--prit-accent,#C09A7E),transparent);transform:scaleX(var(--prit-line,0));transform-origin:left}
  .prit__step{grid-template-columns:1fr;gap:6px;padding:26px 24px 28px}
  .prit__step p{font-size:14.5px}
}

/* ==========================================================================
   05 · CIERRE
   ========================================================================== */
.pcta{position:relative;padding:clamp(66px,15vw,140px) 0;background:var(--pcta-bg,#2B211B);color:#fff;overflow:clip}
.pcta__glow{position:absolute;left:50%;top:38%;width:min(150vw,1050px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,var(--pcta-halo,rgba(192,154,126,.36)) 0%,rgba(192,154,126,0) 64%);pointer-events:none;animation:plBreathe 9s ease-in-out infinite}
.pcta .pl-dots{--pl-dot:var(--pcta-accent,rgba(224,194,178,.7))}
.pcta__rule{position:absolute;left:50%;top:0;width:min(70vw,420px);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,var(--pcta-accent,#E7CDB6),transparent);opacity:.5}
.pcta__inner{position:relative;z-index:1;display:grid;gap:clamp(16px,4vw,24px);justify-items:center;text-align:center}
.pcta .pl-eyebrow{color:var(--pcta-accent,#E7CDB6)}
.pcta__title{font-size:clamp(2.1rem,9vw,5rem);max-width:15ch}
.pcta__sub{max-width:40ch;color:var(--pcta-soft,rgba(255,255,255,.72))}
.pcta__btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;width:100%;margin-top:8px}
.pcta__btns .pl-btn{flex:1 1 0;min-width:0;padding:0 16px;font-size:14px}
.pcta .pl-btn--ghost{color:inherit;border-color:var(--pcta-hair2,rgba(255,255,255,.5))}
.pcta .pl-btn--ghost:hover{background:currentColor;border-color:currentColor}
.pcta .pl-btn--ghost:hover span{color:var(--pcta-bg,#2B211B)}
/* el botón principal se invierte solo según el fondo de la sección */
.pcta .pl-btn--main{background:var(--pcta-btn-bg,#fff);color:var(--pcta-btn-fg,#2B211B)}
.pcta .pl-btn--main:hover{box-shadow:0 18px 40px -18px rgba(43,33,27,.55)}
.pcta .pl-btn--main::after{background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent)}
@media (min-width:760px){ .pcta__btns .pl-btn{flex:0 0 auto;padding:0 30px;font-size:15px} }

.pcta__marquee{position:relative;z-index:1;margin-top:clamp(28px,6vw,48px);width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.pcta__marquee ul{display:flex;gap:36px;list-style:none;margin:0;padding:0;width:max-content;animation:plMarquee var(--pcta-speed,26s) linear infinite}
.pcta__marquee li{font-family:var(--pl-display,var(--font-heading-family,inherit));font-weight:var(--pl-display-weight,var(--font-heading-weight,600));font-size:clamp(1.3rem,5.4vw,2.4rem);letter-spacing:-.02em;color:var(--pcta-faint,rgba(255,255,255,.34));white-space:nowrap;display:flex;align-items:center;gap:36px}
.pcta__marquee li::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--pcta-accent,#E7CDB6);opacity:.9;flex:0 0 auto;box-shadow:0 0 10px var(--pcta-accent,#E7CDB6)}
@keyframes plMarquee{to{transform:translateX(-50%)}}

.pcta__trust{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%;margin-top:clamp(30px,7vw,54px);border-top:1px solid var(--pcta-hair,rgba(255,255,255,.14));padding-top:clamp(24px,5vw,36px)}
.pcta__trust div{position:relative;display:grid;gap:6px;justify-items:center;text-align:center;padding:0 4px}
.pcta__trust em{display:block;width:7px;height:7px;border-radius:50%;background:var(--pcta-accent,#E7CDB6);margin-bottom:4px;position:relative}
.pcta__trust em::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--pcta-accent,#E7CDB6);opacity:0;animation:plOrb 3s ease-out var(--dl,0s) infinite}
.pcta__trust b{font-family:var(--pl-display,var(--font-heading-family,inherit));font-weight:var(--pl-display-weight,var(--font-heading-weight,600));font-size:clamp(12.5px,3.3vw,16px);letter-spacing:-.01em;color:inherit;line-height:1.25}
.pcta__trust span{font-size:11px;line-height:1.45;color:var(--pcta-soft,rgba(255,255,255,.58))}
@media (min-width:760px){ .pcta__trust{gap:16px} .pcta__trust span{font-size:12.5px} }

/* ==========================================================================
   CAPAS DE AMBIENTE · partículas y hebras de cabello
   ========================================================================== */
.pl-sparks{position:absolute;inset:0;z-index:0;pointer-events:none}
.pl-sparks canvas{position:absolute !important;inset:0 !important;width:100% !important;height:100% !important}
/* con mousemove el contenedor sí escucha el cursor, pero deja pasar los clics */
.pl-sparks.is-interactive,.pl-sparks.is-interactive canvas{pointer-events:auto}

.pl-hair{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.pl-hair svg{width:100%;height:100%;display:block}
.pl-hair path{fill:none;stroke:var(--plh-strand,#C9A08F);stroke-width:1.2;stroke-linecap:round;
  transform-origin:center;animation:plWave var(--dur,14s) ease-in-out var(--dl,0s) infinite}
}

/* ==========================================================================
   EXPLORA · accesos al catálogo (sin hablar de producto)
   ========================================================================== */
.pexp{position:relative;padding:clamp(60px,13vw,130px) 0;background:var(--pexp-bg,#EDE3D8);color:var(--pexp-text,#2B211B);overflow:clip}
.pexp__inner{position:relative;z-index:1}
.pexp__head{display:grid;gap:12px;justify-items:center;text-align:center;margin-bottom:clamp(30px,7vw,56px)}
.pexp__head .pl-eyebrow{color:var(--pexp-accent,#8A6A52)}
.pexp__title{font-size:clamp(1.9rem,7.6vw,3.6rem);max-width:16ch}
.pexp__sub{max-width:42ch;color:var(--pexp-soft,#7A6A5D)}

.pexp__grid{display:grid;gap:12px}
@media (min-width:820px){ .pexp__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px} }

.pexp__tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;
  min-height:clamp(178px,42vw,290px);padding:22px;border-radius:20px;overflow:hidden;
  background:var(--pexp-tile,#FFFFFF);border:1px solid var(--pexp-border,rgba(192,154,126,.26));
  transition:transform .55s var(--pl-ease),box-shadow .55s var(--pl-ease),border-color .4s}
.pexp__tile:hover{transform:translateY(-5px);box-shadow:0 26px 54px -30px rgba(43,33,27,.45);border-color:var(--pexp-accent,#C09A7E)}
.pexp__tile::before{content:"";position:absolute;inset:auto -30% -55% -30%;height:82%;border-radius:50%;
  background:radial-gradient(circle,var(--pexp-glow,rgba(192,154,126,.30)) 0%,transparent 68%);pointer-events:none;
  animation:plBreathe 8s ease-in-out var(--dl,0s) infinite}
.pexp__tile::after{content:"";position:absolute;top:0;bottom:0;left:0;width:55%;pointer-events:none;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.75) 50%,transparent 70%);
  transform:translateX(-170%) skewX(-14deg)}
.pexp__tile[data-preveal-on]::after{animation:plCardShine 1.7s var(--pl-ease) .3s 1}

.pexp__num{position:absolute;top:18px;left:22px;font-size:10px;letter-spacing:.2em;color:var(--pexp-accent,#8A6A52);opacity:.8}
.pexp__dot{position:absolute;top:18px;right:20px;width:8px;height:8px;border-radius:50%;background:var(--pexp-accent,#C09A7E)}
.pexp__dot::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid currentColor;color:var(--pexp-accent,#C09A7E);opacity:0;animation:plOrb 3s ease-out var(--dl,0s) infinite}
.pexp__tile h3{position:relative;font-family:var(--pl-display,var(--font-heading-family,inherit));font-weight:var(--pl-display-weight,var(--font-heading-weight,600));font-size:clamp(1.35rem,5.6vw,2rem);letter-spacing:-.025em;margin:0}
.pexp__tile p{position:relative;font-size:13.5px;line-height:1.55;color:var(--pexp-soft,#7A6A5D);max-width:24ch}
.pexp__go{position:relative;display:inline-flex;align-items:center;gap:8px;margin-top:6px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--pexp-accent,#8A6A52)}
.pexp__go svg{transition:transform .4s var(--pl-ease)}
.pexp__tile:hover .pexp__go svg{transform:translateX(5px)}
.pexp__foot{display:flex;justify-content:center;margin-top:clamp(28px,6vw,48px);position:relative;z-index:1}

/* panel suave detrás del texto del hero: la foto ya no se lo come */
.plh__inner::before{content:"";position:absolute;z-index:-1;pointer-events:none;
  inset:-6vh -14vw -4vh calc(var(--pl-pad) * -1.6);
  background:radial-gradient(115% 95% at 4% 78%,rgba(22,18,15,.88) 0%,rgba(22,18,15,.66) 38%,rgba(22,18,15,.28) 62%,rgba(22,18,15,0) 82%)}
@media (min-width:900px){ .plh__inner::before{inset:-8vh -34vw -6vh calc(var(--pl-pad) * -1.4)} }

/* ---- tiles de Explora con foto de fondo ---- */
.pexp__tile{justify-content:flex-end;min-height:clamp(230px,56vw,360px);isolation:isolate}
.pexp__bg{position:absolute;inset:0;z-index:-2;overflow:hidden;border-radius:inherit}
.pexp__bg img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--pl-ease)}
.pexp__tile:hover .pexp__bg img{transform:scale(1.07)}
.pexp__bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(43,33,27,.18) 0%,rgba(43,33,27,.05) 34%,rgba(43,33,27,.62) 72%,rgba(43,33,27,.9) 100%)}
/* con foto, el texto va en blanco */
.pexp__tile:has(.pexp__bg){border-color:transparent}
.pexp__tile:has(.pexp__bg) h3,.pexp__tile:has(.pexp__bg) .pexp__num{color:#fff}
.pexp__tile:has(.pexp__bg) p{color:rgba(255,255,255,.86)}
.pexp__tile:has(.pexp__bg) .pexp__go{color:var(--pexp-accent,#E7CDB6)}
.pexp__tile:has(.pexp__bg)::before{display:none}

/* ==========================================================================
   RESEÑAS · mechón que se dibuja al bajar y reseñas con fade
   ========================================================================== */
.ptl{position:relative;padding:clamp(62px,13vw,132px) 0;background:var(--ptl-bg,#121212);color:var(--ptl-text,#fff);overflow:clip}
.ptl__wrap{position:relative;z-index:1}
.ptl__head{display:grid;gap:12px;justify-items:center;text-align:center;margin-bottom:clamp(36px,8vw,68px)}
.ptl__head .pl-eyebrow{color:var(--pl-on-soft,#C9A08F)}
.ptl__title{font-size:clamp(1.9rem,7.6vw,3.6rem);max-width:17ch;color:inherit}
.ptl__summary{display:flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.06em;color:var(--ptl-soft)}
.ptl__summary .ptl__stars{font-size:14px;letter-spacing:.12em;color:var(--pl-on,#C9A08F)}

.ptl__body{position:relative}
/* el mechón: se dibuja con el scroll y además ondula */
.ptl__strand{position:absolute;left:0;top:0;bottom:0;width:62px;z-index:0;pointer-events:none;
  clip-path:inset(0 0 calc((1 - var(--ptl-draw,1)) * 100%) 0)}
.ptl__strand svg{width:100%;height:100%;display:block;overflow:visible}
.ptl__line{fill:none;stroke:var(--ptl-accent,#C9A08F);stroke-linecap:round;vector-effect:non-scaling-stroke;
  transform-origin:center;animation:plWave var(--dur,13s) ease-in-out var(--dl,0s) infinite}
.ptl__line--a{stroke-width:1;opacity:.34;--dur:15s;--dl:0s}
.ptl__line--b{stroke-width:1.8;opacity:.62;--dur:12s;--dl:-2.5s}
.ptl__line--c{stroke-width:1;opacity:.34;--dur:17s;--dl:-5s}

.ptl__items{list-style:none;margin:0;padding:0;display:grid;gap:clamp(16px,4.5vw,26px);position:relative;z-index:1}
.ptl__item{position:relative;padding-left:64px}
.ptl__node{position:absolute;left:23px;top:30px;width:15px;height:15px;display:grid;place-items:center}
.ptl__node::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--ptl-accent,#C9A08F);
  box-shadow:0 0 0 4px var(--ptl-bg,#121212),0 0 14px var(--ptl-accent,#C9A08F)}
.ptl__node i{position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--ptl-accent,#C9A08F);opacity:0}
.ptl__item[data-preveal-on] .ptl__node i{animation:plOrb 2.8s ease-out .2s 3}

.ptl__card{position:relative;padding:20px;border-radius:18px;background:var(--ptl-card,#1A1A1A);
  border:1px solid var(--ptl-border,rgba(201,160,143,.26));overflow:hidden}
.ptl__card::after{content:"";position:absolute;top:0;bottom:0;left:0;width:58%;pointer-events:none;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.8) 50%,transparent 70%);
  transform:translateX(-170%) skewX(-14deg)}
.ptl__item[data-preveal-on] .ptl__card::after{animation:plCardShine 1.6s var(--pl-ease) .3s 1}

.ptl__top{display:flex;align-items:center;gap:13px;margin-bottom:12px}
.ptl__face{width:46px;height:46px;flex:0 0 auto;border-radius:50%;overflow:hidden;
  border:2px solid var(--ptl-accent,#C9A08F)}
.ptl__face img{width:100%;height:100%;object-fit:cover}
.ptl__card .ptl__stars{font-size:14px;letter-spacing:.14em;color:var(--ptl-ink-ac,#8A5F44)}
.ptl__quote{margin:0;font-family:var(--pl-display,var(--font-heading-family,inherit));
  font-weight:var(--pl-display-weight,var(--font-heading-weight,600));
  font-size:clamp(15.5px,4.4vw,19px);line-height:1.44;letter-spacing:-.018em;color:inherit}
.ptl__quote::before{content:"“"}
.ptl__quote::after{content:"”"}
.ptl__author{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:13px;font-size:12.5px;color:var(--ptl-soft)}
.ptl__author strong{font-weight:600;color:inherit}
.ptl__badge{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--ptl-ink-ac,#8A5F44);
  border:1px solid currentColor;border-radius:999px;padding:4px 9px}

.ptl__closing{margin:clamp(40px,9vw,76px) auto 0;max-width:20ch;text-align:center;
  font-size:clamp(1.5rem,6.2vw,2.8rem);line-height:1.18;letter-spacing:-.028em;color:inherit}

@media (min-width:880px){
  .ptl__strand{left:50%;width:120px;transform:translateX(-50%)}
  .ptl__items{gap:clamp(6px,1.6vw,18px)}
  .ptl__item{padding-left:0;width:calc(50% - 46px)}
  .ptl__item:nth-child(odd){margin-right:auto;text-align:right}
  .ptl__item:nth-child(even){margin-left:auto}
  .ptl__item:nth-child(odd) .ptl__node{left:auto;right:-53px}
  .ptl__item:nth-child(even) .ptl__node{left:-53px}
  .ptl__item:nth-child(odd) .ptl__top{flex-direction:row-reverse}
  .ptl__item:nth-child(odd) .ptl__author{justify-content:flex-end}
  .ptl__card{padding:24px 26px}
  .ptl__quote{font-size:19px}
}

}

/* ---- botón final con destellos ---- */
.pcta__wish-wrap{position:relative;z-index:1;display:grid;justify-items:center;gap:14px;margin-top:10px;width:100%}
.pcta .pcta__wish{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:64px;padding:0 clamp(28px,7vw,52px);border-radius:999px;overflow:visible;
  font-family:var(--pl-display,var(--font-heading-family,inherit));font-weight:var(--pl-display-weight,500);
  font-size:clamp(16px,4.4vw,21px);letter-spacing:-.015em;text-align:center;
  background:var(--pcta-btn-bg,#2B211B);color:var(--pcta-btn-fg,#F4EEE7);
  box-shadow:0 18px 44px -20px rgba(43,33,27,.6),0 0 0 0 var(--pcta-accent,#C09A7E);
  animation:plWishPulse 3.4s ease-in-out infinite;
  transition:transform .4s var(--pl-ease),box-shadow .4s var(--pl-ease)}
.pcta__wish:hover{transform:translateY(-3px) scale(1.02)}
.pcta__wish:active{transform:scale(.98)}
.pcta__wish svg{flex:0 0 auto;transition:transform .4s var(--pl-ease)}
.pcta__wish:hover svg{transform:translateX(6px)}
.pcta__wish-txt{position:relative;z-index:2}
@keyframes plWishPulse{
  0%,100%{box-shadow:0 18px 44px -20px rgba(43,33,27,.6),0 0 0 0 rgba(192,154,126,.55)}
  50%{box-shadow:0 18px 44px -20px rgba(43,33,27,.6),0 0 0 14px rgba(192,154,126,0)}
}
/* brillo que cruza */
.pcta__wish::after{content:"";position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none;
  background:linear-gradient(100deg,transparent 38%,rgba(255,255,255,.3) 50%,transparent 62%);
  background-size:260% 100%;background-repeat:no-repeat;animation:plShine 4.5s ease-in-out 1s infinite}
/* destellos alrededor */
.pcta__wish-sparks{position:absolute;inset:-26px -30px;z-index:1;pointer-events:none}
.pcta__wish-sparks i{position:absolute;width:var(--s,4px);height:var(--s,4px);border-radius:50%;
  background:var(--pcta-accent,#C09A7E);box-shadow:0 0 10px var(--pcta-accent,#C09A7E);opacity:0;
  animation:plWishSpark 2.8s ease-in-out var(--dl,0s) infinite}
@keyframes plWishSpark{
  0%{opacity:0;transform:scale(.3) translateY(6px)}
  30%{opacity:1;transform:scale(1) translateY(0)}
  60%{opacity:.7;transform:scale(.85) translateY(-6px)}
  100%{opacity:0;transform:scale(.3) translateY(-14px)}
}
.pcta__wish-note{font-size:12px;letter-spacing:.06em;color:var(--pcta-soft,rgba(43,33,27,.7))}

/* ==========================================================================
   CIERRE · el símbolo se vuelve a unir
   ========================================================================== */
.pfin{position:relative;min-height:92vh;min-height:92svh;display:flex;align-items:center;
  padding:clamp(70px,14vw,130px) 0;background:var(--pfin-bg,#33261F);color:var(--pfin-text,#F6F1EA);overflow:clip}
.pfin__halo{position:absolute;left:50%;top:44%;width:min(150vw,1000px);aspect-ratio:1;transform:translate(-50%,-50%);
  border-radius:50%;pointer-events:none;animation:plBreathe 9s ease-in-out infinite;
  background:radial-gradient(circle,var(--pfin-halo,rgba(231,205,182,.32)) 0%,transparent 64%)}
.pfin .pl-dots{--pl-dot:var(--pfin-accent,#E7CDB6)}
.pfin__inner{position:relative;z-index:1;display:grid;gap:clamp(14px,3.4vw,22px);justify-items:center;text-align:center}
.pfin .pl-eyebrow{color:var(--pl-on-soft,#E7CDB6)}
.pfin__title{font-size:clamp(2.1rem,9vw,4.8rem);max-width:14ch;color:inherit}
.pfin__sub{max-width:34ch;color:var(--pfin-soft)}

/* el símbolo se rearma: las dos "e" vuelven, la barra las une, el aro cierra */
.pfin__mark{width:min(46vw,190px);height:auto;overflow:visible;margin-bottom:clamp(6px,2vw,14px)}
.pfin__mark path,.pfin__mark circle{fill:none;stroke:var(--pfin-accent,#E7CDB6);stroke-width:7;
  stroke-linecap:round;vector-effect:non-scaling-stroke}
.pfin__eL,.pfin__eR,.pfin__bar{transform-box:fill-box;transform-origin:center}
.pl-js .pfin__mark .pfin__eL{transform:translateX(-128%) rotate(-14deg);opacity:0}
.pl-js .pfin__mark .pfin__eR{transform:translateX(128%) rotate(14deg);opacity:0}
.pl-js .pfin__mark .pfin__bar{transform:scaleX(0)}
.pl-js .pfin__mark .pfin__ring{opacity:0;transform:scale(1.9);transform-origin:50% 50%}
.pfin__mark[data-preveal-on] .pfin__eL,.pfin__mark[data-preveal-on] .pfin__eR{
  transform:none;opacity:.9;transition:transform 1.25s var(--pl-ease) .1s,opacity .9s var(--pl-ease) .1s}
.pfin__mark[data-preveal-on] .pfin__bar{transform:scaleX(1);transition:transform .7s var(--pl-ease) 1.05s}
.pfin__mark[data-preveal-on] .pfin__ring{opacity:.5;transform:scale(1);
  transition:opacity 1.1s var(--pl-ease) 1.3s,transform 1.1s var(--pl-ease) 1.3s}

/* botón con destellos */
.pfin__cta{display:grid;justify-items:center;gap:13px;margin-top:clamp(8px,2vw,16px)}
.pfin .pfin__wish{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:66px;padding:0 clamp(28px,7vw,54px);border-radius:999px;
  font-family:var(--pl-display,var(--font-heading-family,inherit));font-weight:var(--pl-display-weight,500);
  font-size:clamp(16px,4.4vw,21px);letter-spacing:-.015em;text-align:center;
  background:var(--pfin-btn-bg,#F6F1EA);color:var(--pfin-btn-fg,#33261F);
  animation:plWishPulse 3.4s ease-in-out infinite;
  transition:transform .4s var(--pl-ease)}
.pfin__wish:hover{transform:translateY(-3px) scale(1.02)}
.pfin__wish:active{transform:scale(.98)}
.pfin__wish svg{flex:0 0 auto;transition:transform .4s var(--pl-ease)}
.pfin__wish:hover svg{transform:translateX(6px)}
.pfin__wish-txt{position:relative;z-index:2}
.pfin__wish::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;overflow:hidden;
  background:linear-gradient(100deg,transparent 38%,rgba(255,255,255,.34) 50%,transparent 62%);
  background-size:260% 100%;background-repeat:no-repeat;animation:plShine 4.5s ease-in-out 1s infinite}
.pfin__sparks{position:absolute;inset:-28px -32px;z-index:1;pointer-events:none}
.pfin__sparks i{position:absolute;width:var(--s,4px);height:var(--s,4px);border-radius:50%;
  background:var(--pfin-accent,#E7CDB6);box-shadow:0 0 11px var(--pfin-accent,#E7CDB6);opacity:0;
  animation:plWishSpark 2.8s ease-in-out var(--dl,0s) infinite}
.pfin__note{font-size:12px;letter-spacing:.06em;color:var(--pfin-soft)}

.pfin__trust{list-style:none;margin:clamp(16px,4vw,28px) 0 0;padding:0;display:flex;flex-wrap:wrap;
  justify-content:center;gap:10px 22px;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--pfin-soft)}
.pfin__trust li{display:flex;align-items:center;gap:8px}
.pfin__trust li span{width:6px;height:6px;border-radius:50%;background:var(--pfin-accent,#E7CDB6);flex:0 0 auto}

/* ==========================================================================
   HERO DIVIDIDO · la foto en su propio bloque, nunca se recorta mal
   ========================================================================== */
.plh--split{display:block;min-height:0;align-items:stretch;
  padding:clamp(26px,6vw,64px) 0 clamp(42px,9vw,92px);
  background:var(--plh-bg,#fff);color:var(--plh-text,#2B211B)}
.plh--split .plh__grid{position:relative;z-index:2;display:grid;gap:clamp(22px,5vw,40px);align-items:center;width:100%}
.plh--split .plh__shot{order:-1;position:relative;border-radius:26px;overflow:hidden;aspect-ratio:4/5;
  background:var(--pl-bg-deep,#EDE3D8);box-shadow:0 34px 70px -40px rgba(43,33,27,.45)}
.plh--split .plh__shot img{width:100%;height:100%;object-fit:cover;object-position:var(--plh-pos,center);
  animation:plKen 24s ease-in-out infinite alternate}
.plh--split .plh__copy{display:grid;justify-items:start;text-align:left}
.plh--split .plh__title{color:var(--plh-text,#2B211B);font-size:clamp(2.3rem,9.4vw,4.4rem);
  max-width:13ch;text-shadow:none}
.plh--split .plh__title em{color:var(--plh-ink-ac,#8A5F44)}
.plh--split .plh__eyebrow{color:var(--pl-on-soft,#7A6A5D)}
.plh--split .plh__eyebrow::before{background:var(--plh-accent,#C9A08F)}
.plh--split .plh__sub{color:var(--pl-on-soft,#7A6A5D);text-shadow:none;max-width:34ch}
.plh--split .plh__cue{position:static;transform:none;margin:22px auto 0;color:var(--pl-on-soft,#7A6A5D)}
.plh--split .plh__cue span{background:linear-gradient(180deg,currentColor,transparent)}
.plh--split .pl-dots{--pl-dot:var(--plh-accent,#C9A08F)}
@media (min-width:900px){
  .plh--split .plh__grid{grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,70px)}
  .plh--split .plh__shot{order:0}
  .plh--split .plh__title{font-size:clamp(2.9rem,4.8vw,4.4rem)}
}

/* ==========================================================================
   RESEÑAS · una por pantalla, con el mechón bajando al lado
   ========================================================================== */
.ptl__track{position:relative;height:var(--ptl-h,600vh)}
.ptl__stage{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:clamp(16px,3.4vh,30px);
  padding:clamp(74px,12vh,116px) var(--pl-pad) clamp(54px,9vh,86px);overflow:hidden}
.ptl__deck{position:relative;z-index:2;width:100%;max-width:620px;flex:1 1 auto;
  display:flex;align-items:center;justify-content:center;min-height:clamp(290px,44vh,410px)}
.ptl__stage.is-live .ptl__rev{position:absolute;left:0;right:0;top:50%;opacity:0;will-change:opacity,transform}
.ptl__stage:not(.is-live) .ptl__deck{display:grid;gap:18px;min-height:0}
.ptl__rev{width:100%;display:grid;gap:14px;justify-items:center;text-align:center;
  padding:clamp(26px,6vw,44px) clamp(20px,5vw,40px);border-radius:26px;
  background:var(--ptl-card,#FFFFFF);border:1px solid var(--ptl-border,rgba(201,160,143,.3));
  box-shadow:0 34px 76px -46px rgba(43,33,27,.5)}
.ptl__rev .ptl__face{width:clamp(58px,15vw,78px);height:clamp(58px,15vw,78px)}
.ptl__rev .ptl__stars{font-size:17px;letter-spacing:.16em;color:var(--ptl-ink-ac,#8A5F44)}
.ptl__rev .ptl__quote{font-size:clamp(1.15rem,5vw,1.9rem);line-height:1.34;max-width:22ch}
.ptl__rev .ptl__author{justify-content:center;margin-top:4px}
.ptl__rail{position:relative;z-index:2;display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.ptl__rail i{display:block;width:7px;height:7px;border-radius:50%;background:var(--ptl-accent,#C9A08F);
  opacity:.28;transition:opacity .35s var(--pl-ease),transform .35s var(--pl-ease)}
.ptl__rail i.is-on{opacity:1;transform:scale(1.6)}
/* el mechón cruza toda la escena, de fondo */
.ptl .ptl__strand{left:50%;width:min(86vw,620px);transform:translateX(-50%);opacity:.6}
@media (min-width:880px){ .ptl__deck{max-width:740px} .ptl .ptl__strand{width:min(56vw,760px)} }

/* ondulación más marcada: las curvas suben y bajan de verdad */
@keyframes plWave{
  0%{transform:translate3d(0,-4.2%,0) scaleY(1.06) skewX(0deg)}
  22%{transform:translate3d(2.6%,2.2%,0) scaleY(.95) skewX(2.1deg)}
  48%{transform:translate3d(-2.2%,5.4%,0) scaleY(1.08) skewX(-1.9deg)}
  74%{transform:translate3d(2.2%,-2.6%,0) scaleY(.94) skewX(1.6deg)}
  100%{transform:translate3d(0,-4.2%,0) scaleY(1.06) skewX(0deg)}
}

/* ---- las curvas se dibujan con el scroll cuando llevan pl-hair--draw ---- */
.pl-hair--draw{clip-path:inset(0 0 calc((1 - var(--ptl-draw,1)) * 100%) 0)}
.pl-hair path{stroke-width:1.2}

/* ==========================================================================
   BOTÓN DEL CIERRE · movimiento de verdad, no solo la sombra
   ========================================================================== */
.pfin .pfin__wish{
  background:linear-gradient(115deg,var(--pfin-btn-bg,#2B211B) 0%,var(--pfin-btn-bg2,#4A3A2F) 48%,var(--pfin-btn-bg,#2B211B) 100%);
  background-size:230% 100%;
  animation:plWishPulse 3.2s ease-in-out infinite,
            plWishFloat 4.4s ease-in-out infinite,
            plWishBg 7s linear infinite;
  transition:box-shadow .4s var(--pl-ease),filter .4s var(--pl-ease),scale .35s var(--pl-ease)}
/* scale va como propiedad aparte para que no pelee con el transform del flote */
.pfin .pfin__wish:hover{scale:1.035;filter:brightness(1.1)}
.pfin .pfin__wish:active{scale:.98}
@keyframes plWishFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-5px) scale(1.022)}}
@keyframes plWishBg{0%{background-position:0% 0}100%{background-position:230% 0}}

/* doble onda expansiva */
@keyframes plWishPulse{
  0%{box-shadow:0 20px 46px -22px rgba(43,33,27,.55),0 0 0 0 var(--pfin-ring,rgba(201,160,143,.75)),0 0 0 0 var(--pfin-ring,rgba(201,160,143,.4))}
  50%{box-shadow:0 20px 46px -22px rgba(43,33,27,.55),0 0 0 15px rgba(201,160,143,0),0 0 0 7px var(--pfin-ring2,rgba(201,160,143,.3))}
  100%{box-shadow:0 20px 46px -22px rgba(43,33,27,.55),0 0 0 26px rgba(201,160,143,0),0 0 0 34px rgba(201,160,143,0)}
}

/* brillo más marcado y más seguido */
.pfin__wish::after{background:linear-gradient(100deg,transparent 36%,rgba(255,255,255,.62) 50%,transparent 64%);
  background-size:250% 100%;animation:plShine 3.2s ease-in-out .6s infinite}

/* la flecha se mueve sola */
.pfin__wish svg{animation:plArrow 2.1s ease-in-out infinite}
.pfin__wish:hover svg{transform:none}
@keyframes plArrow{0%,100%{transform:translateX(0)}50%{transform:translateX(6px)}}

/* chispas visibles sobre blanco Y sobre el botón oscuro:
   núcleo crema con aro tostado */
.pfin__sparks{inset:-34px -38px}
.pfin__sparks i{width:var(--s,5px);height:var(--s,5px);
  background:#FFF3E8;
  box-shadow:0 0 0 1px var(--pfin-ink-ac,#8A5F44),0 0 12px var(--pfin-accent,#C9A08F);
  animation:plWishSpark 2.4s ease-in-out var(--dl,0s) infinite}
@keyframes plWishSpark{
  0%{opacity:0;transform:scale(.25) translateY(8px)}
  25%{opacity:1;transform:scale(1.15) translateY(0)}
  55%{opacity:.85;transform:scale(.9) translateY(-7px)}
  100%{opacity:0;transform:scale(.25) translateY(-18px)}
}

/* ---- puntos visibles sobre blanco: halo + aro fino ---- */
.pl-dots i{box-shadow:0 0 12px var(--pl-dot,#C9A08F),0 0 0 1px rgba(43,33,27,.10)}

/* ---- la sombra del botón ya no se corta a los lados ----
   El anillo se expandía más de lo que cabía en la sección, y `overflow:clip`
   lo recortaba en horizontal. Se le deja aire al botón y el anillo se achica
   en pantallas angostas. */
.pfin{overflow-clip-margin:44px}
.pfin__cta{padding-inline:clamp(40px,11vw,60px)}
.pfin .pfin__wish{--ring-a:20px;--ring-b:26px}
@media (min-width:640px){ .pfin .pfin__wish{--ring-a:26px;--ring-b:34px} }
@keyframes plWishPulse{
  0%{box-shadow:0 20px 46px -22px rgba(43,33,27,.55),0 0 0 0 var(--pfin-ring,rgba(201,160,143,.75)),0 0 0 0 var(--pfin-ring,rgba(201,160,143,.4))}
  50%{box-shadow:0 20px 46px -22px rgba(43,33,27,.55),0 0 0 var(--ring-a,20px) rgba(201,160,143,0),0 0 0 7px var(--pfin-ring2,rgba(201,160,143,.3))}
  100%{box-shadow:0 20px 46px -22px rgba(43,33,27,.55),0 0 0 var(--ring-b,26px) rgba(201,160,143,0),0 0 0 calc(var(--ring-b,26px) + 8px) rgba(201,160,143,0)}
}
.pfin__sparks{inset:-26px -30px}

/* ==========================================================================
   AMBIENTE PREMIUM · aurora difuminada + arcos que giran + grano de película
   Todo CSS puro; va detrás del contenido y no intercepta el puntero.
   ========================================================================== */
.pl-deco{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  --pl-deco-c:#C9A08F;--pl-deco-i:1;
  -webkit-mask-image:radial-gradient(116% 104% at 50% 46%,#000 38%,transparent 100%);
          mask-image:radial-gradient(116% 104% at 50% 46%,#000 38%,transparent 100%)}

.pl-deco__aurora{position:absolute;inset:-20%;filter:blur(62px);opacity:calc(.52 * var(--pl-deco-i))}
.pl-deco__blob{position:absolute;display:block;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,var(--pl-deco-c) 0%,transparent 70%)}
.pl-deco__blob--1{width:52%;aspect-ratio:1;left:-8%;top:-4%;opacity:.55;animation:plDrift1 26s ease-in-out infinite}
.pl-deco__blob--2{width:44%;aspect-ratio:1;right:-6%;top:12%;opacity:.44;animation:plDrift2 33s ease-in-out infinite}
.pl-deco__blob--3{width:58%;aspect-ratio:1;left:14%;bottom:-16%;opacity:.4;animation:plDrift3 39s ease-in-out infinite}
.pl-deco__blob--4{width:34%;aspect-ratio:1;right:16%;bottom:2%;opacity:.5;animation:plDrift2 29s ease-in-out -13s infinite}
@keyframes plDrift1{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(7%,5%,0) scale(1.16)}}
@keyframes plDrift2{0%,100%{transform:translate3d(0,0,0) scale(1.08)}50%{transform:translate3d(-8%,7%,0) scale(.9)}}
@keyframes plDrift3{0%,100%{transform:translate3d(0,0,0) scale(.94)}50%{transform:translate3d(5%,-6%,0) scale(1.2)}}

/* arcos concéntricos: medio borde visible para que el giro se note */
.pl-deco__arcs{position:absolute;inset:0}
.pl-deco__arcs span{position:absolute;left:50%;top:50%;width:var(--w,60%);aspect-ratio:1;
  border-radius:50%;border:1px solid transparent;border-top-color:var(--pl-deco-c);
  border-right-color:var(--pl-deco-c);opacity:calc(.3 * var(--pl-deco-i));
  animation:plArcSpin var(--t,42s) linear infinite}
.pl-deco__arcs span:nth-child(even){animation-direction:reverse;opacity:calc(.19 * var(--pl-deco-i))}
@keyframes plArcSpin{
  from{transform:translate(-50%,-50%) rotate(0deg)}
  to{transform:translate(-50%,-50%) rotate(360deg)}
}

/* grano de película: textura fina, nunca ensucia el blanco */
.pl-deco__grain{position:absolute;inset:-60px;opacity:calc(.17 * var(--pl-deco-i));
  mix-blend-mode:multiply;background-repeat:repeat;background-size:200px 200px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)'/%3E%3C/svg%3E");
  animation:plGrain 7s steps(5) infinite}
@keyframes plGrain{
  0%{transform:translate3d(0,0,0)}     20%{transform:translate3d(-3%,2%,0)}
  40%{transform:translate3d(2%,-3%,0)} 60%{transform:translate3d(-2%,-2%,0)}
  80%{transform:translate3d(3%,1%,0)}  100%{transform:translate3d(0,0,0)}
}
/* el contenido de cada sección siempre por encima del ambiente */
.pl>.pl-wrap,.pl__inner,.psym__inner,.pgal__inner,.ptl__inner,.pfin__inner{position:relative;z-index:1}

@media (prefers-reduced-motion:reduce){
  .pl-deco__blob,.pl-deco__arcs span,.pl-deco__grain{animation:none}
}

/* ==========================================================================
   CIERRE · el símbolo late en bucle y la sección respira en vertical
   ========================================================================== */
/* margen de recorte generoso: el halo del botón no se corta por ningún lado */
.pfin{overflow-clip-margin:130px}
/* el aire del botón vive en el flujo, no depende del recorte del padre */
.pfin__cta{margin-top:0;padding:clamp(26px,6.5vw,46px) clamp(40px,11vw,60px)}

/* el «ee» se rearma en bucle infinito y nunca sale del lienzo */
.pfin__mark{width:min(48vw,200px);overflow:visible}
.pl-js .pfin__mark .pfin__eL,.pl-js .pfin__mark .pfin__eR,
.pl-js .pfin__mark .pfin__bar,.pl-js .pfin__mark .pfin__ring{transform:none;opacity:1}
.pfin__mark .pfin__eL{animation:plFinL 9s var(--pl-ease,cubic-bezier(.22,1,.36,1)) infinite}
.pfin__mark .pfin__eR{animation:plFinR 9s var(--pl-ease,cubic-bezier(.22,1,.36,1)) infinite}
.pfin__mark .pfin__bar{animation:plFinBar 9s var(--pl-ease,cubic-bezier(.22,1,.36,1)) infinite}
.pfin__mark .pfin__ring{animation:plFinRing 9s var(--pl-ease,cubic-bezier(.22,1,.36,1)) infinite}
.pfin__mark[data-preveal-on] .pfin__eL,.pfin__mark[data-preveal-on] .pfin__eR,
.pfin__mark[data-preveal-on] .pfin__bar,.pfin__mark[data-preveal-on] .pfin__ring{transition:none}
@keyframes plFinL{
  0%{transform:translateX(-58%) rotate(-11deg);opacity:0}
  20%,70%{transform:none;opacity:.9}
  90%,100%{transform:translateX(-58%) rotate(-11deg);opacity:0}
}
@keyframes plFinR{
  0%{transform:translateX(58%) rotate(11deg);opacity:0}
  20%,70%{transform:none;opacity:.9}
  90%,100%{transform:translateX(58%) rotate(11deg);opacity:0}
}
@keyframes plFinBar{
  0%,13%{transform:scaleX(0);opacity:0}
  30%,70%{transform:scaleX(1);opacity:.9}
  86%,100%{transform:scaleX(0);opacity:0}
}
@keyframes plFinRing{
  0%,24%{opacity:0;transform:scale(1.45)}
  44%,70%{opacity:.5;transform:scale(1)}
  88%,100%{opacity:0;transform:scale(1.45)}
}
@media (prefers-reduced-motion:reduce){
  .pfin__mark .pfin__eL,.pfin__mark .pfin__eR,
  .pfin__mark .pfin__bar,.pfin__mark .pfin__ring{animation:none;opacity:.9}
}

/* en PC la sección se estira hacia abajo, no a lo ancho */
@media (min-width:900px){
  .pfin{min-height:100vh;min-height:100svh;padding-block:clamp(96px,10vw,150px)}
  .pfin__inner{max-width:660px;margin-inline:auto;gap:clamp(20px,2.2vw,30px)}
  .pfin__title{max-width:11ch;font-size:clamp(3rem,4.4vw,4.3rem)}
  .pfin__sub{max-width:27ch;font-size:clamp(1rem,1.15vw,1.15rem)}
  .pfin__mark{width:206px}
  .pfin__trust{max-width:430px;gap:12px 20px}
  .pfin__halo{width:min(88vw,760px);top:40%}
}

/* móvil: el mismo ambiente, la mitad del coste (blur más corto, grano quieto,
   un blob menos y la cola de puntos fuera) */
@media (max-width:767px){
  .pl-deco__aurora{filter:blur(40px)}
  .pl-deco__blob--4{display:none}
  .pl-deco__grain{animation:none;opacity:calc(.12 * var(--pl-deco-i))}
  .pl-deco__arcs span:nth-child(n+4){display:none}
  .pl-dots i:nth-child(n+45){display:none}
}

/* ==========================================================================
   HORIZONTE CURVO · arco gigante + resplandor + máscara radial
   Adaptado a fondo claro: el arco es crema y la línea del borde es el acento.
   ========================================================================== */
.pl-horiz{position:absolute;left:50%;bottom:0;z-index:0;pointer-events:none;
  width:min(100%,1680px);height:var(--pl-horiz-h,320px);transform:translateX(-50%);
  overflow:hidden;
  -webkit-mask-image:radial-gradient(62% 78% at 50% 100%,#000 12%,transparent 80%);
          mask-image:radial-gradient(62% 78% at 50% 100%,#000 12%,transparent 80%)}

/* el resplandor que sube desde el centro de la base */
.pl-horiz__glow{position:absolute;inset:0;display:block;
  background:radial-gradient(circle at bottom center,var(--pl-horiz-c,#C9A08F),transparent 74%);
  opacity:calc(.4 * var(--pl-horiz-i))}

/* el arco: 200% de ancho y medio fuera, así solo se ve su curva superior */
.pl-horiz__arc{position:absolute;left:-50%;top:54%;display:block;
  width:200%;aspect-ratio:1 / .7;border-radius:10%;
  background:linear-gradient(to bottom,#FFFCFA 0%,#FFFFFF 42%)}

/* la línea del horizonte, encendida */
.pl-horiz__line{position:absolute;left:-50%;top:54%;display:block;
  width:200%;aspect-ratio:1 / .7;border-radius:10%;
  border-top:1.5px solid var(--pl-horiz-c,#C9A08F);
  opacity:calc(.85 * var(--pl-horiz-i));
  box-shadow:0 -2px 30px -4px var(--pl-horiz-c,#C9A08F);
  animation:plHorizPulse 7s ease-in-out infinite}
@keyframes plHorizPulse{
  0%,100%{opacity:calc(.62 * var(--pl-horiz-i))}
  50%{opacity:calc(.95 * var(--pl-horiz-i))}
}
@media (prefers-reduced-motion:reduce){ .pl-horiz__line{animation:none} }

/* el cierre: el horizonte manda abajo, así que la aurora se retira de esa zona */
.pfin .pl-deco__aurora{-webkit-mask-image:linear-gradient(to bottom,#000 52%,transparent 92%);
          mask-image:linear-gradient(to bottom,#000 52%,transparent 92%)}

/* ==========================================================================
   CAJA DE EFECTOS · meteoros, rayos, destellos, rejilla, anillos y gotas
   Todo CSS puro, detrás del contenido, sin interceptar el puntero.
   ========================================================================== */
.pl-fx{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  --pl-fx-c:#C9A08F;--pl-fx-i:1}

/* — rejilla finísima, recortada con máscara radial para que no llegue a los bordes */
.pl-fx__grid{position:absolute;inset:0;opacity:calc(.5 * var(--pl-fx-i));
  background-image:linear-gradient(to right,var(--pl-fx-c) 1px,transparent 1px),
                   linear-gradient(to bottom,var(--pl-fx-c) 1px,transparent 1px);
  background-size:76px 76px;
  -webkit-mask-image:radial-gradient(58% 58% at 50% 46%,#000 0%,transparent 76%);
          mask-image:radial-gradient(58% 58% at 50% 46%,#000 0%,transparent 76%)}

/* — haces de luz: dos conos que giran muy despacio en sentidos opuestos */
.pl-fx__rays{position:absolute;left:50%;top:-40%;width:170%;aspect-ratio:1;
  transform:translateX(-50%);
  -webkit-mask-image:radial-gradient(52% 52% at 50% 30%,#000 0%,transparent 72%);
          mask-image:radial-gradient(52% 52% at 50% 30%,#000 0%,transparent 72%)}
.pl-fx__rays span{position:absolute;inset:0;display:block;border-radius:50%;
  opacity:calc(.3 * var(--pl-fx-i));
  background:conic-gradient(from 0deg,transparent 0deg,var(--pl-fx-c) 4deg,transparent 12deg,
    transparent 40deg,var(--pl-fx-c) 45deg,transparent 56deg,transparent 100deg,
    var(--pl-fx-c) 104deg,transparent 116deg,transparent 180deg,
    var(--pl-fx-c) 186deg,transparent 198deg,transparent 260deg,
    var(--pl-fx-c) 265deg,transparent 276deg,transparent 360deg);
  animation:plRays 58s linear infinite}
.pl-fx__rays span:nth-child(2){animation-duration:86s;animation-direction:reverse;
  opacity:calc(.18 * var(--pl-fx-i));filter:blur(3px)}
@keyframes plRays{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* — anillos que se expanden desde el centro, como una onda en el agua */
.pl-fx__rings{position:absolute;left:50%;top:50%;width:0;height:0}
.pl-fx__rings span{position:absolute;left:0;top:0;display:block;
  width:min(62vw,540px);aspect-ratio:1;margin:calc(min(62vw,540px) / -2);
  border-radius:50%;border:1px solid var(--pl-fx-c);opacity:0;
  animation:plRingOut 8s ease-out var(--dl,0s) infinite}
@keyframes plRingOut{
  0%{opacity:0;transform:scale(.18)}
  16%{opacity:calc(.5 * var(--pl-fx-i))}
  100%{opacity:0;transform:scale(1.5)}
}

/* — meteoros: cabeza brillante y cola en degradado, en diagonal */
.pl-fx__meteors{position:absolute;inset:-10% -20%}
.pl-fx__meteors i{position:absolute;width:3px;height:3px;border-radius:50%;
  background:var(--pl-fx-c);box-shadow:0 0 0 1px rgba(201,160,143,.22),0 0 14px var(--pl-fx-c);
  opacity:0;transform:rotate(-38deg);
  animation:plMeteor var(--du,5s) cubic-bezier(.2,.5,.4,1) var(--dl,0s) infinite}
.pl-fx__meteors i::before{content:"";position:absolute;top:50%;right:2px;
  width:var(--len,120px);height:1.5px;transform:translateY(-50%);border-radius:2px;
  background:linear-gradient(to left,var(--pl-fx-c),transparent)}
@keyframes plMeteor{
  0%{opacity:0;transform:rotate(-38deg) translate3d(0,0,0) scale(.6)}
  8%{opacity:calc(.9 * var(--pl-fx-i))}
  62%{opacity:calc(.55 * var(--pl-fx-i))}
  100%{opacity:0;transform:rotate(-38deg) translate3d(340px,0,0) scale(.9)}
}

/* — destellos de cuatro puntas: titilan y giran, el gesto clásico de belleza */
.pl-fx__stars svg{position:absolute;width:var(--sz,14px);height:var(--sz,14px);
  fill:var(--pl-fx-c);opacity:0;transform-origin:50% 50%;
  filter:drop-shadow(0 0 6px var(--pl-fx-c));
  animation:plStarTwinkle var(--du,7s) ease-in-out var(--dl,0s) infinite}
@keyframes plStarTwinkle{
  0%,100%{opacity:0;transform:scale(.3) rotate(0deg)}
  14%{opacity:calc(.95 * var(--pl-fx-i));transform:scale(1) rotate(35deg)}
  30%{opacity:calc(.35 * var(--pl-fx-i));transform:scale(.72) rotate(70deg)}
  46%{opacity:calc(.85 * var(--pl-fx-i));transform:scale(1.06) rotate(110deg)}
  70%{opacity:calc(.2 * var(--pl-fx-i));transform:scale(.6) rotate(160deg)}
}

/* — gotas de sérum: flotan, giran y llevan su propio reflejo */
.pl-fx__drops i{position:absolute;width:var(--sz,16px);height:var(--sz,16px);
  border-radius:52% 48% 46% 54% / 48% 44% 56% 52%;opacity:0;
  background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.92) 0%,
    var(--pl-fx-c) 46%,rgba(201,160,143,.42) 100%);
  box-shadow:inset 0 -2px 6px rgba(255,255,255,.55),0 3px 12px -3px var(--pl-fx-c);
  animation:plDropFloat var(--du,13s) ease-in-out var(--dl,0s) infinite}
@keyframes plDropFloat{
  0%{opacity:0;transform:translate3d(0,26px,0) rotate(0deg) scale(.7)}
  18%{opacity:calc(.72 * var(--pl-fx-i))}
  50%{opacity:calc(.6 * var(--pl-fx-i));transform:translate3d(14px,-18px,0) rotate(170deg) scale(1)}
  82%{opacity:calc(.5 * var(--pl-fx-i))}
  100%{opacity:0;transform:translate3d(-8px,-52px,0) rotate(340deg) scale(.78)}
}

/* móvil: los efectos caros se recortan, no se apagan */
@media (max-width:767px){
  .pl-fx__rays span:nth-child(2){display:none}
  .pl-fx__grid{background-size:54px 54px;opacity:calc(.34 * var(--pl-fx-i))}
  .pl-fx__meteors i:nth-child(n+4){display:none}
  .pl-fx__stars svg:nth-child(n+7){display:none}
  .pl-fx__drops i:nth-child(n+5){display:none}
  .pl-fx__rings span:nth-child(n+3){display:none}
}
@media (prefers-reduced-motion:reduce){
  .pl-fx__rays span,.pl-fx__rings span,.pl-fx__meteors i,
  .pl-fx__stars svg,.pl-fx__drops i{animation:none}
  .pl-fx__stars svg{opacity:.5;transform:scale(1)}
}

/* ==========================================================================
   DOS REMATES MÁS · haz girando en el borde del botón y degradado en el título
   ========================================================================== */
@property --pl-beam{syntax:'<angle>';inherits:false;initial-value:0deg}

.pfin .pfin__wish{isolation:isolate}
.pfin__wish::before{content:"";position:absolute;inset:-2px;border-radius:inherit;padding:2px;
  pointer-events:none;
  background:conic-gradient(from var(--pl-beam),transparent 0deg,var(--pfin-accent,#C9A08F) 24deg,
    #FFF6EE 33deg,var(--pfin-accent,#C9A08F) 42deg,transparent 72deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:plBeamSpin 3.6s linear infinite}
@keyframes plBeamSpin{to{--pl-beam:360deg}}

/* el título del cierre con degradado que respira (la idea del bg-clip-text) */
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .pfin__title .pl-word > i{
    background:linear-gradient(180deg,var(--pfin-text,#2B211B) 0%,var(--pfin-ink-ac,#8A5F44) 96%);
    background-size:100% 240%;
    -webkit-background-clip:text;background-clip:text;
    -webkit-text-fill-color:transparent;color:transparent;
    animation:plTitleGrad 9s ease-in-out infinite}
  @keyframes plTitleGrad{
    0%,100%{background-position:50% 0%}
    50%{background-position:50% 100%}
  }
}
@media (prefers-reduced-motion:reduce){
  .pfin__wish::before,.pfin__title .pl-word > i{animation:none}
}
