/* AngelBoy V201 · portada limpia + escenario React para dedicatorias */
:root{
  --ab201-plum:#2a071b;
  --ab201-wine:#57122f;
  --ab201-pink:#ff4f9a;
  --ab201-rose:#ff7bb8;
  --ab201-violet:#8b5cf6;
  --ab201-cyan:#68e4ff;
}

.ab-home-hero-v201{
  grid-template-columns:minmax(0,1.02fr) minmax(390px,.98fr);
  gap:clamp(42px,6vw,86px);
  min-height:680px;
  padding:88px 0 58px;
}
.ab-home-glow-v201{
  inset:-28%;
  background:
    radial-gradient(circle at 13% 35%,rgba(198,34,122,.24),transparent 27%),
    radial-gradient(circle at 72% 29%,rgba(124,58,237,.18),transparent 30%),
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:auto,auto,78px 78px,78px 78px;
  mask-image:linear-gradient(to bottom,#000 0 87%,transparent);
}
.ab-home-copy-v201 h1{
  max-width:750px;
  margin:18px 0 24px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(50px,6.1vw,84px);
  font-weight:700;
  line-height:.98;
  letter-spacing:-.055em;
  text-wrap:balance;
}
.ab-home-copy-v201 h1 span{
  background:linear-gradient(110deg,#fff 0%,#ffd6e9 28%,#ff7bb8 67%,#c084fc 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.ab-home-copy-v201>p{
  max-width:665px;
  color:#d4ccd8;
  font-size:clamp(17px,1.45vw,20px);
  line-height:1.68;
}
.ab-home-search-v201{
  max-width:660px;
  margin-top:30px;
  border-color:rgba(255,255,255,.15);
  background:rgba(12,8,24,.56);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 16px 45px rgba(0,0,0,.2);
}
.ab-home-search-v201:focus-within{
  border-color:rgba(255,123,184,.58);
  box-shadow:0 0 0 4px rgba(255,79,154,.1),0 18px 52px rgba(0,0,0,.25);
}
.ab-home-search-v201 button{
  min-width:118px;
  color:#fff;
  background:linear-gradient(135deg,#d43b94,#ff365f);
  box-shadow:0 10px 25px rgba(255,54,95,.22);
}
.ab-home-actions-v201{margin-top:2px;gap:12px}
.ab-home-actions-v201 .ab-btn-v200{min-height:50px;padding-inline:22px}
.ab-home-actions-v201 .ab-btn-v200 span{margin-left:9px;font-size:18px}

.ab-home-showcase-v201{min-height:500px;perspective:1100px}
.ab-showcase-window-v201{
  width:min(590px,100%);
  border-radius:30px;
  background:linear-gradient(150deg,rgba(31,21,52,.96),rgba(8,7,20,.98));
  box-shadow:0 42px 110px rgba(0,0,0,.54),0 0 85px rgba(221,42,130,.16);
  transform:rotate(1.25deg) translateZ(0);
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease;
}
.ab-showcase-window-v201:hover{
  transform:rotate(.25deg) translateY(-6px);
  box-shadow:0 48px 125px rgba(0,0,0,.58),0 0 100px rgba(221,42,130,.22);
}
.ab-react-story-root-v201{min-height:440px}
.ab-story-stage-v201{
  --stage-x:0px;
  --stage-y:0px;
  position:relative;
  isolation:isolate;
  display:grid;
  place-items:center;
  min-height:440px;
  overflow:hidden;
  padding:42px 30px;
  background:
    radial-gradient(circle at 50% 42%,rgba(255,47,126,.22),transparent 28%),
    radial-gradient(circle at 20% 75%,rgba(88,117,255,.13),transparent 28%),
    linear-gradient(145deg,#14091f,#100817 58%,#090715);
}
.ab-story-stage-v201::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-5;
  opacity:.72;
  background:
    radial-gradient(circle at 50% 50%,rgba(255,255,255,.11) 0 1px,transparent 1.6px) 0 0/38px 38px,
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px) 0 0/56px 56px,
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px) 0 0/56px 56px;
  transform:translate3d(calc(var(--stage-x) * -.18),calc(var(--stage-y) * -.18),0);
  transition:transform .25s ease-out;
}
.ab-story-grid-v201{
  position:absolute;
  inset:0;
  z-index:-4;
  opacity:.3;
  background:linear-gradient(120deg,transparent 10%,rgba(255,90,164,.1) 48%,transparent 82%);
  animation:ab201-grid-sweep 7s linear infinite;
}
.ab-story-glow-v201{
  position:absolute;
  width:280px;
  aspect-ratio:1;
  z-index:-3;
  border-radius:50%;
  filter:blur(52px);
  opacity:.44;
  background:conic-gradient(from 90deg,var(--ab201-pink),var(--ab201-violet),var(--ab201-cyan),var(--ab201-pink));
  animation:ab201-glow-breathe 5.5s ease-in-out infinite;
}
.ab-story-orbit-v201{
  position:absolute;
  left:50%;
  top:50%;
  z-index:-2;
  width:390px;
  height:185px;
  border:1px solid rgba(255,110,181,.42);
  border-radius:50%;
  box-shadow:0 0 18px rgba(255,79,154,.14),inset 0 0 18px rgba(139,92,246,.08);
  transform:translate(-50%,-50%) rotate(-12deg) translate3d(var(--stage-x),var(--stage-y),0);
  animation:ab201-orbit-one 11s linear infinite;
}
.ab-story-orbit-v201::before,.ab-story-orbit-v201::after{
  content:"";
  position:absolute;
  width:9px;
  height:9px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 14px #fff,0 0 28px var(--ab201-pink);
}
.ab-story-orbit-v201::before{left:13%;top:14%}
.ab-story-orbit-v201::after{right:8%;bottom:21%;background:var(--ab201-cyan);box-shadow:0 0 14px var(--ab201-cyan),0 0 28px var(--ab201-violet)}
.ab-story-orbit-v201.orbit-two{
  width:320px;
  height:250px;
  border-color:rgba(104,228,255,.3);
  transform:translate(-50%,-50%) rotate(24deg) translate3d(calc(var(--stage-x) * -.75),calc(var(--stage-y) * -.75),0);
  animation:ab201-orbit-two 14s linear infinite reverse;
}
.ab-story-heart-v201{
  position:absolute;
  left:50%;
  top:50%;
  z-index:-1;
  display:grid;
  place-items:center;
  width:235px;
  aspect-ratio:1;
  border-radius:46% 54% 52% 48%;
  transform:translate(-50%,-50%) translate3d(calc(var(--stage-x) * .45),calc(var(--stage-y) * .45),0);
  background:radial-gradient(circle,rgba(255,43,125,.18),rgba(126,58,242,.08) 48%,transparent 70%);
  filter:drop-shadow(0 0 25px rgba(255,70,145,.22));
  animation:ab201-heart-float 4.8s ease-in-out infinite;
}
.ab-story-heart-v201 span{
  color:rgba(255,183,218,.19);
  font-family:Georgia,serif;
  font-size:210px;
  line-height:1;
  text-shadow:0 0 34px rgba(255,75,153,.28);
}
.ab-story-particle-v201{
  position:absolute;
  left:var(--left);
  top:var(--top);
  width:var(--size);
  height:var(--size);
  z-index:-1;
  border-radius:50%;
  opacity:var(--opacity);
  background:var(--particle-color);
  box-shadow:0 0 10px var(--particle-color);
  animation:ab201-particle var(--duration) ease-in-out var(--delay) infinite alternate;
}
.ab-story-code-v201{
  position:absolute;
  z-index:-1;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  color:rgba(225,215,255,.34);
  background:rgba(8,6,18,.38);
  font:600 10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;
  backdrop-filter:blur(5px);
  animation:ab201-code-float 7s ease-in-out infinite;
}
.ab-story-code-v201.code-a{left:8%;top:22%;transform:rotate(-8deg)}
.ab-story-code-v201.code-b{right:7%;bottom:21%;transform:rotate(6deg);animation-delay:-3.2s}
.ab-story-copy-v201{
  position:relative;
  z-index:3;
  max-width:470px;
  text-align:center;
  transform:translate3d(calc(var(--stage-x) * .18),calc(var(--stage-y) * .18),0);
  transition:transform .2s ease-out;
}
.ab-story-copy-v201>span{
  display:inline-block;
  margin-bottom:14px;
  color:#f7a7d0;
  font-size:11px;
  font-weight:900;
  letter-spacing:.21em;
}
.ab-story-copy-v201 h2{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(43px,5.3vw,65px);
  font-weight:700;
  line-height:.93;
  letter-spacing:-.045em;
  text-wrap:balance;
  text-shadow:0 10px 38px rgba(0,0,0,.4);
}
.ab-story-copy-v201 h2 strong{
  display:block;
  color:#ff77b5;
  font-weight:700;
}
.ab-story-copy-v201 p{
  margin:17px auto 0;
  color:#ddd4e4;
  font-size:15px;
  line-height:1.6;
}
.ab-story-copy-v201.is-changing{animation:ab201-copy-change .62s ease both}
.ab-story-progress-v201{
  position:absolute;
  left:50%;
  bottom:25px;
  z-index:4;
  display:flex;
  gap:7px;
  transform:translateX(-50%);
}
.ab-story-progress-v201 button{
  width:7px;
  height:7px;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.28);
  cursor:pointer;
  transition:.25s ease;
}
.ab-story-progress-v201 button[aria-current="true"]{width:27px;background:linear-gradient(90deg,var(--ab201-pink),var(--ab201-violet))}

.ab-category-strip-v201{margin-top:6px;margin-bottom:34px}
.ab-category-strip-v201 a{transition:background .2s ease,color .2s ease,transform .2s ease}
.ab-category-strip-v201 a:hover{color:#fff;background:rgba(255,79,154,.13);transform:translateY(-2px)}

.ab-dedication-version-v201{
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);
  align-items:center;
  gap:clamp(34px,5vw,72px);
  width:min(1240px,calc(100% - 36px));
  margin:30px auto 20px;
  padding:clamp(34px,5vw,64px);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:34px;
  background:
    radial-gradient(circle at 80% 25%,rgba(255,79,154,.13),transparent 28%),
    radial-gradient(circle at 12% 85%,rgba(124,58,237,.12),transparent 26%),
    linear-gradient(145deg,rgba(34,13,28,.94),rgba(11,9,24,.96));
  box-shadow:0 35px 100px rgba(0,0,0,.3);
}
.ab-dedication-version-v201::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:.35;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:54px 54px;
}
.ab-dedication-copy-v201>span{
  color:#f6a6ce;
  font-size:11px;
  font-weight:950;
  letter-spacing:.18em;
}
.ab-dedication-copy-v201 h2{
  margin:14px 0 18px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(38px,4.2vw,61px);
  line-height:1;
  letter-spacing:-.045em;
  text-wrap:balance;
}
.ab-dedication-copy-v201 p{color:#bfb7c7;line-height:1.72;font-size:16px}
.ab-dedication-actions-v201{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}
.ab-dedication-card-v201{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(180px,.68fr);
  gap:24px;
  min-height:380px;
  padding:clamp(25px,3.5vw,44px);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  border-radius:28px;
  background:
    radial-gradient(circle at 45% 15%,rgba(255,84,159,.2),transparent 25%),
    linear-gradient(135deg,rgba(88,18,52,.68),rgba(23,10,31,.88));
  box-shadow:0 24px 75px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.06);
}
.ab-dedication-message-v201{align-self:center;position:relative;z-index:2}
.ab-dedication-message-v201>span{color:#f8b3d3;font-size:10px;font-weight:950;letter-spacing:.17em}
.ab-dedication-message-v201 blockquote{
  margin:16px 0;
  color:#fff;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(27px,3vw,43px);
  line-height:1.08;
  letter-spacing:-.035em;
}
.ab-dedication-message-v201>p{max-width:530px;color:#d9c8d3;line-height:1.65}
.ab-dedication-player-v201{
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  margin-top:24px;
  padding:11px 13px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  background:rgba(7,5,15,.34);
  backdrop-filter:blur(10px);
}
.ab-dedication-player-v201 button{
  width:40px;
  height:40px;
  border:0;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(135deg,#ff4f9a,#8b5cf6);
  cursor:pointer;
  box-shadow:0 8px 22px rgba(255,79,154,.28);
}
.ab-dedication-player-v201 button.is-playing{animation:ab201-player-pulse 1.3s ease-in-out infinite}
.ab-dedication-player-v201 strong,.ab-dedication-player-v201 span{display:block}
.ab-dedication-player-v201 strong{font-size:13px}
.ab-dedication-player-v201 span,.ab-dedication-player-v201 time{color:#a99eae;font-size:11px}
.ab-dedication-photo-v201{
  position:relative;
  align-self:center;
  margin:0;
  padding:9px 9px 34px;
  border-radius:8px;
  background:#f5e8ec;
  box-shadow:0 18px 45px rgba(0,0,0,.42);
  transform:rotate(3deg);
}
.ab-dedication-photo-v201 img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:4px;filter:saturate(.85) contrast(1.04)}
.ab-dedication-photo-v201 figcaption{position:absolute;left:10px;right:10px;bottom:9px;color:#4a2434;font:600 11px/1.2 Georgia,serif;text-align:center}
.ab-dedication-petals-v201 i{
  position:absolute;
  z-index:1;
  width:15px;
  height:23px;
  border-radius:80% 15% 75% 25%;
  background:linear-gradient(145deg,#ff79b5,#9f174e);
  opacity:.62;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.25));
  animation:ab201-petal-fall 7s linear infinite;
}
.ab-dedication-petals-v201 i:nth-child(1){left:10%;top:-8%;animation-delay:-1s}
.ab-dedication-petals-v201 i:nth-child(2){left:38%;top:-12%;animation-delay:-4.3s;animation-duration:9s}
.ab-dedication-petals-v201 i:nth-child(3){left:63%;top:-10%;animation-delay:-2.1s;animation-duration:8s}
.ab-dedication-petals-v201 i:nth-child(4){left:84%;top:-15%;animation-delay:-6.2s;animation-duration:10s}
.ab-dedication-petals-v201 i:nth-child(5){left:26%;top:-18%;animation-delay:-7.5s;animation-duration:11s}

/* La sección de cuatro beneficios V200 fue retirada de la composición V201. */
.ab-benefits-v200{display:none!important}

@keyframes ab201-grid-sweep{0%{transform:translateX(-35%)}100%{transform:translateX(35%)}}
@keyframes ab201-glow-breathe{50%{transform:scale(1.16) rotate(25deg);opacity:.58}}
@keyframes ab201-orbit-one{to{transform:translate(-50%,-50%) rotate(348deg) translate3d(var(--stage-x),var(--stage-y),0)}}
@keyframes ab201-orbit-two{to{transform:translate(-50%,-50%) rotate(384deg) translate3d(calc(var(--stage-x) * -.75),calc(var(--stage-y) * -.75),0)}}
@keyframes ab201-heart-float{50%{transform:translate(-50%,-53%) scale(1.04) translate3d(calc(var(--stage-x) * .45),calc(var(--stage-y) * .45),0)}}
@keyframes ab201-particle{to{transform:translate3d(14px,-22px,0) scale(1.65);opacity:.18}}
@keyframes ab201-code-float{50%{translate:0 -12px;opacity:.55}}
@keyframes ab201-copy-change{0%{opacity:.3;transform:translateY(10px) scale(.98)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes ab201-player-pulse{50%{box-shadow:0 0 0 8px rgba(255,79,154,.08),0 8px 22px rgba(255,79,154,.3)}}
@keyframes ab201-petal-fall{0%{transform:translate3d(0,-20px,0) rotate(0deg)}100%{transform:translate3d(55px,460px,0) rotate(480deg)}}

@media(max-width:1050px){
  .ab-home-hero-v201{grid-template-columns:minmax(0,1fr) minmax(340px,.82fr);gap:32px}
  .ab-dedication-version-v201{grid-template-columns:1fr}
  .ab-dedication-copy-v201{max-width:760px}
}
@media(max-width:860px){
  .ab-home-hero-v201{grid-template-columns:1fr;min-height:auto;padding-top:58px}
  .ab-home-copy-v201{text-align:center}
  .ab-home-copy-v201 h1,.ab-home-copy-v201>p,.ab-home-search-v201{margin-left:auto;margin-right:auto}
  .ab-home-actions-v201{justify-content:center}
  .ab-home-showcase-v201{min-height:auto}
  .ab-showcase-window-v201{max-width:620px;transform:none}
  .ab-showcase-window-v201:hover{transform:translateY(-4px)}
  .ab-dedication-card-v201{grid-template-columns:1fr minmax(150px,230px)}
}
@media(max-width:640px){
  .ab-home-hero-v201{width:min(100% - 24px,1240px);padding-top:38px;padding-bottom:38px}
  .ab-home-copy-v201 h1{font-size:clamp(43px,12vw,61px)}
  .ab-home-search-v201{display:grid;gap:8px;padding:8px}
  .ab-home-search-v201 input{min-height:46px}
  .ab-home-search-v201 button{width:100%}
  .ab-home-actions-v201 .ab-btn-v200{width:100%}
  .ab-react-story-root-v201,.ab-story-stage-v201{min-height:390px}
  .ab-story-stage-v201{padding:42px 18px}
  .ab-story-orbit-v201{width:310px;height:150px}
  .ab-story-orbit-v201.orbit-two{width:260px;height:205px}
  .ab-story-copy-v201 h2{font-size:clamp(41px,13vw,55px)}
  .ab-story-code-v201{display:none}
  .ab-dedication-version-v201{width:min(100% - 24px,1240px);padding:26px 18px;border-radius:26px}
  .ab-dedication-card-v201{grid-template-columns:1fr;min-height:auto;padding:25px 18px}
  .ab-dedication-photo-v201{width:min(230px,78%);margin:6px auto 0;transform:rotate(2deg)}
  .ab-dedication-actions-v201 .ab-btn-v200{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .ab-story-grid-v201,.ab-story-glow-v201,.ab-story-orbit-v201,.ab-story-heart-v201,.ab-story-particle-v201,.ab-story-code-v201,.ab-dedication-petals-v201 i,.ab-dedication-player-v201 button.is-playing{animation:none!important}
  .ab-showcase-window-v201,.ab-category-strip-v201 a{transition:none!important}
}
