:root{--ink:#090a0a;--yellow:#ffbd18;--yellow2:#ffc62a;--white:#fff;--muted:#e1e1e1}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#080909;color:#fff;font-family:"Manrope",sans-serif;overflow-x:hidden}a{text-decoration:none}.container-xl{max-width:1340px}
.header{padding:22px 0;z-index:20;background:transparent;transition:background .3s ease,box-shadow .3s ease,backdrop-filter .3s ease,padding .3s ease}.header.scrolled{background:rgba(8,9,9,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 8px 30px rgba(0,0,0,.28);padding:12px 0}.header-inner{min-height:80px;display:grid;grid-template-columns:190px 1fr 250px;align-items:center;gap:24px}.brand img{width:150px;height:auto;display:block}.main-nav{display:none!important}.main-nav a{position:relative;color:#fff;text-transform:uppercase;font-size:13px;font-weight:800;letter-spacing:.04em;padding:14px 0;opacity:.92}.main-nav a:hover,.main-nav a.active{color:var(--yellow)}.main-nav a.active:after{content:"";position:absolute;left:0;right:0;bottom:3px;height:3px;background:var(--yellow);border-radius:3px}.header-social{justify-self:end;display:inline-flex;align-items:center;gap:13px;padding:14px 22px;border:2px solid var(--yellow);border-radius:999px;color:var(--yellow);font-weight:800;font-size:14px;transition:.25s}.header-social i:first-child{font-size:21px}.header-social i:last-child{font-size:14px}.header-social:hover{background:var(--yellow);color:#0a0a0a;transform:translateY(-2px)}
.hero{position:relative;min-height:100vh;padding:165px 0 160px;display:flex;align-items:center;overflow:hidden;background:#0a0b0b url('../img/pet-pattern-dark.png') center/cover no-repeat}.hero:before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.30);z-index:0}.hero-container{position:relative;z-index:3}.hero-copy{padding:15px 0 50px}.eyebrow{font-size:15px;letter-spacing:.26em;font-weight:500;color:#fff;margin-bottom:18px}.hero h1{font-family:"Outfit",sans-serif;font-size:clamp(58px,5.6vw,88px);line-height:.91;letter-spacing:-.045em;font-weight:900;margin:0 0 30px;max-width:690px;color:#fff}.hero h1 span{display:inline-block;color:var(--yellow);font-style:normal;position:relative}.hero h1 span:after{content:"";position:absolute;left:46%;bottom:-18px;width:230px;height:7px;background:var(--yellow);border-radius:100%;transform:translateX(-50%) rotate(-1deg)}.hero h1 em{font-style:normal;font-size:.63em;letter-spacing:-.02em}.lead{max-width:565px;font-size:17px;line-height:1.65;color:#f2f2f2;margin:0 0 30px;font-weight:500}.lead strong{color:var(--yellow);font-weight:800}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.btn-main{display:inline-flex;align-items:center;gap:13px;background:var(--yellow);color:#090909;padding:17px 25px;border-radius:999px;font-size:14px;text-transform:uppercase;font-weight:900;transition:.25s}.btn-main i:first-child{font-size:21px}.btn-main i:last-child{margin-left:10px}.btn-main:hover{color:#090909;background:#ffd15a;transform:translateY(-4px);box-shadow:0 14px 35px rgba(255,189,24,.22)}.microcopy{display:flex;align-items:center;gap:13px;margin-top:17px;font-size:12px;color:#e8e8e8}.microcopy strong{color:#fff}.microcopy span{height:16px;width:1px;background:rgba(255,255,255,.55)}
.visual-wrap{position:relative}.visual-stage{position:relative;min-height:620px;display:flex;align-items:center;justify-content:center}.pets{position:relative;z-index:3;width:min(100%,670px);max-height:650px;object-fit:contain;filter:drop-shadow(0 25px 35px rgba(0,0,0,.42));animation:float 4s ease-in-out infinite}@keyframes float{50%{transform:translateY(-8px)}}.crown{position:absolute;z-index:4;top:28px;left:40%;width:112px;height:auto;color:var(--yellow);transform:rotate(-8deg);filter:drop-shadow(0 2px 0 rgba(255,189,24,.15))}.heart-bubble{position:absolute;z-index:6;width:78px;height:auto;right:0;top:245px;object-fit:contain;mix-blend-mode:screen;filter:drop-shadow(0 8px 15px rgba(0,0,0,.25))}.status-card{position:absolute;z-index:7;left:5%;right:8%;bottom:15px;display:flex;align-items:center;gap:18px;background:#fff;color:#0a0a0a;padding:19px 24px;border-radius:25px;border:3px solid #111;box-shadow:9px 9px 0 var(--yellow);transform:rotate(-1deg)}.status-icon{width:62px;height:62px;display:grid;place-items:center;font-size:45px;flex:0 0 auto}.status-copy{display:grid;grid-template-columns:auto 1fr;align-items:end;column-gap:10px;width:100%;font-family:"Outfit",sans-serif}.status-copy strong{font-size:31px;line-height:1;font-weight:900}.status-copy b{font-size:24px;line-height:1;color:var(--yellow);font-weight:900}.progress{grid-column:1/-1;margin-top:14px;height:16px;border:3px solid #111;border-radius:999px;padding:2px;overflow:hidden}.progress i{display:block;width:58%;height:100%;border-radius:999px;background:repeating-linear-gradient(135deg,var(--yellow) 0 14px,#ffd766 14px 22px)}
.yellow-band{position:absolute;left:0;right:0;bottom:0;height:120px;background:var(--yellow);z-index:10;color:#0a0a0a}.band-wave{position:absolute;left:0;right:0;top:-55px;width:100%;height:56px;color:var(--yellow);display:block}.band-inner{height:100%;display:grid;grid-template-columns:repeat(4,1fr);align-items:center}.band-inner>div{height:54px;display:flex;align-items:center;justify-content:center;gap:18px;border-right:1px solid rgba(0,0,0,.45);font-family:"Outfit",sans-serif;font-size:16px;font-weight:900;letter-spacing:.05em}.band-inner>div:last-child{border-right:0}.band-inner i{font-size:31px}.paw-icon{width:34px;height:34px;display:block;flex:0 0 auto;color:#090a0a}
@media(max-width:1100px){.header-inner{grid-template-columns:160px 1fr 190px}.main-nav{gap:25px}.header-social span{display:none}.hero h1{font-size:64px}.status-copy strong{font-size:26px}.status-copy b{font-size:20px}}
@media(max-width:991px){.header{padding:12px 18px;background:transparent;backdrop-filter:none}.header.scrolled{background:rgba(8,9,9,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:10px 18px}.header-inner{display:flex;justify-content:space-between;min-height:64px}.brand img{width:125px}.main-nav{display:none}.header-social{padding:11px 15px}.hero{padding:120px 20px 180px;min-height:auto;background-size:auto 100%;background-repeat:repeat}.hero-copy{text-align:center}.eyebrow{font-size:12px}.lead{margin-inline:auto}.hero-actions{justify-content:center}.microcopy{justify-content:center}.visual-stage{min-height:560px;margin-top:5px}.pets{max-height:560px}.heart-bubble{right:5%;top:210px}.crown{top:10px}.yellow-band{height:120px}.band-inner{grid-template-columns:repeat(2,1fr)}.band-inner>div{border-right:0}.band-inner>div:nth-child(odd){border-right:1px solid rgba(0,0,0,.35)}}
@media(max-width:575px){.header{padding:8px 12px}.header-inner{min-height:56px}.brand img{width:105px}.header-social{padding:9px 12px}.header-social i:last-child{display:none}.hero{padding:105px 16px 205px}.eyebrow{font-size:9px;letter-spacing:.18em}.hero h1{font-size:47px}.hero h1 em{font-size:.62em}.hero h1 span:after{width:150px;height:5px;bottom:-11px}.lead{font-size:15px;line-height:1.55}.btn-main{width:100%;justify-content:center;padding:15px}.microcopy{font-size:10px;gap:8px}.visual-stage{min-height:400px}.pets{max-height:405px}.crown{width:72px;top:8px;left:38%}.heart-bubble{width:58px;right:0;top:145px}.status-card{left:2%;right:2%;bottom:0;padding:12px 14px;gap:10px;border-radius:18px;box-shadow:6px 6px 0 var(--yellow)}.status-icon{width:40px;height:40px;font-size:30px}.status-copy strong{font-size:20px}.status-copy b{font-size:16px}.progress{height:12px;margin-top:9px}.yellow-band{height:155px}.band-wave{top:-39px;height:40px}.band-inner{grid-template-columns:repeat(2,1fr);padding:10px}.band-inner>div{gap:8px;font-size:11px;height:58px;text-align:center}.band-inner i{font-size:21px}.paw-icon{width:24px;height:24px}}

/* Rediseño hero más expresivo */
.hero{padding-top:150px;background-size:auto 100%;background-repeat:repeat;background-position:center top}
.hero:before{background:radial-gradient(circle at 63% 42%,rgba(255,189,24,.055),transparent 25%),rgba(0,0,0,.22)}
.hero-copy{position:relative;z-index:5}
.eyebrow{display:inline-block;font-family:"Outfit",sans-serif;font-size:20px;line-height:1.05;letter-spacing:.04em;font-weight:800;transform:rotate(-3deg);margin:0 0 22px 22px;text-align:center}
.eyebrow b{color:var(--yellow);font-size:1.12em}
.hero h1{font-size:clamp(64px,6.2vw,98px);line-height:.84;letter-spacing:-.055em;transform:rotate(-1deg);margin-bottom:34px}
.hero h1 span{font-size:1.03em;text-shadow:0 5px 0 rgba(0,0,0,.18)}
.hero h1 span:after{width:88%;height:9px;left:50%;bottom:-13px;transform:translateX(-50%) rotate(-3deg)}
.hero h1 em{font-size:.57em;letter-spacing:-.035em;display:inline-block;margin:10px 0 0 30px;transform:rotate(-2deg)}
.lead{max-width:520px}
.visual-stage{min-height:660px;transform:scale(1.06);transform-origin:center}
.pets{width:min(108%,720px);max-height:690px;animation:float 4s ease-in-out infinite}
.crown{top:0;left:35%;width:130px;transform:rotate(-9deg)}
.heart-bubble{width:92px;right:-2%;top:235px}
.status-card{left:0;right:2%;bottom:4px;padding:22px 25px;transform:rotate(-2deg);box-shadow:10px 11px 0 var(--yellow)}
.status-card:before{content:"";position:absolute;width:85px;height:38px;left:18px;top:-22px;background:rgba(255,196,36,.9);transform:rotate(-8deg);clip-path:polygon(3% 9%,97% 0,94% 90%,0 100%);opacity:.9}
.status-copy{padding-right:105px}
.card-note{position:absolute;right:24px;bottom:23px;font-family:"Outfit",sans-serif;font-weight:900;font-size:13px;line-height:1.1;text-align:center;transform:rotate(-8deg);color:#2a2a2a}
.yellow-band{height:115px}
.band-wave{top:-42px;height:43px}
.band-inner>div{font-size:18px;transform:rotate(-1deg)}
.paw-icon{width:38px;height:38px}
@media(max-width:991px){.hero h1{font-size:68px}.eyebrow{margin-left:0}.visual-stage{transform:none}.status-copy{padding-right:90px}}
@media(max-width:575px){.hero h1{font-size:49px}.eyebrow{font-size:14px}.hero h1 em{margin-left:0}.visual-stage{min-height:420px}.status-copy{padding-right:62px}.card-note{right:10px;bottom:16px;font-size:9px}.status-card:before{width:58px;height:26px;top:-15px}.yellow-band{height:155px}.band-inner>div{font-size:11px}}

/* Animated footer wave */
.band-wave-wrap{position:absolute;left:0;right:0;top:-55px;height:56px;overflow:hidden;color:var(--yellow);pointer-events:none}
.band-wave-wrap .band-wave{position:absolute;top:0;left:0;width:200%;height:100%;color:inherit;display:block;animation:laikaWaveTravel 9s linear infinite;will-change:transform}
@keyframes laikaWaveTravel{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media(max-width:575px){.band-wave-wrap{top:-39px;height:40px}.band-wave-wrap .band-wave{animation-duration:7s}}
@media(prefers-reduced-motion:reduce){.band-wave-wrap .band-wave{animation:none}}

/* Subtle motion for footer messages */
.band-inner > div { animation: laikaFooterFloat 4.8s ease-in-out infinite; will-change: transform; }
.band-inner > div:nth-child(2) { animation-delay: -.9s; }
.band-inner > div:nth-child(3) { animation-delay: -1.8s; }
.band-inner > div:nth-child(4) { animation-delay: -2.7s; }
@keyframes laikaFooterFloat {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}
@media (max-width:575px) {
  .band-inner > div { animation-duration: 4.2s; }
  @keyframes laikaFooterFloat {
    0%,100% { transform: translateY(0); }
    50% { transform: translateY(-2px); }
  }
}
@media (prefers-reduced-motion:reduce) { .band-inner > div { animation:none; } }

/* Ajuste: centrar el claim superior con el bloque de textos del hero */
.hero-copy .eyebrow{
  display:block;
  width:100%;
  max-width:565px;
  margin:0 0 22px 0;
  text-align:center;
}
@media(max-width:991px){
  .hero-copy .eyebrow{margin-left:auto;margin-right:auto;}
}

/* Siluetas animadas en el footer */
.footer-pet-track{position:absolute;left:0;right:0;top:3px;height:48px;z-index:3;pointer-events:none;overflow:hidden;color:#090a0a}
.walking-cat,.fetch-dog{position:absolute;top:0;width:46px;height:32px;will-change:transform}
.walking-cat{left:-58px;animation:catCross 18s linear infinite}
.fetch-dog{right:-62px;width:52px;animation:dogFetch 16s linear infinite}
.walking-cat svg,.fetch-dog svg{display:block;width:100%;height:100%;overflow:visible}
.fetch-ball{position:absolute;right:-20px;top:23px;width:10px;height:10px;border:2px solid currentColor;border-radius:50%;animation:ballFetch 16s linear infinite;will-change:transform}
@keyframes catCross{0%{transform:translateX(0) translateY(0)}12%{transform:translateX(14vw) translateY(-1px)}25%{transform:translateX(29vw) translateY(1px)}38%{transform:translateX(44vw) translateY(-1px)}50%{transform:translateX(58vw) translateY(1px)}63%{transform:translateX(73vw) translateY(-1px)}75%{transform:translateX(87vw) translateY(1px)}88%{transform:translateX(102vw) translateY(-1px)}100%{transform:translateX(calc(100vw + 70px)) translateY(0)}}
@keyframes dogFetch{0%{transform:translateX(0) translateY(0)}12%{transform:translateX(-14vw) translateY(-1px)}25%{transform:translateX(-29vw) translateY(1px)}38%{transform:translateX(-44vw) translateY(-1px)}50%{transform:translateX(-58vw) translateY(1px)}63%{transform:translateX(-73vw) translateY(-1px)}75%{transform:translateX(-87vw) translateY(1px)}88%{transform:translateX(-102vw) translateY(-1px)}100%{transform:translateX(calc(-100vw - 75px)) translateY(0)}}
@keyframes ballFetch{0%{transform:translateX(0) translateY(0) rotate(0)}12%{transform:translateX(-15vw) translateY(-3px) rotate(-180deg)}25%{transform:translateX(-30vw) translateY(1px) rotate(-360deg)}38%{transform:translateX(-45vw) translateY(-3px) rotate(-540deg)}50%{transform:translateX(-59vw) translateY(1px) rotate(-720deg)}63%{transform:translateX(-74vw) translateY(-3px) rotate(-900deg)}75%{transform:translateX(-88vw) translateY(1px) rotate(-1080deg)}88%{transform:translateX(-103vw) translateY(-3px) rotate(-1260deg)}100%{transform:translateX(calc(-100vw - 90px)) translateY(0) rotate(-1440deg)}}
@media(max-width:575px){.footer-pet-track{top:2px;height:38px}.walking-cat{width:34px}.fetch-dog{width:39px}.fetch-ball{width:8px;height:8px;top:18px}.walking-cat{animation-duration:14s}.fetch-dog,.fetch-ball{animation-duration:13s}}
@media(prefers-reduced-motion:reduce){.walking-cat,.fetch-dog,.fetch-ball{animation:none;display:none}}

/* Silueta de perro suministrada por el usuario: se conserva su dibujo original */
.fetch-ball{display:none!important}
.fetch-dog.supplied-dog{width:74px;height:50px;display:flex;align-items:center;justify-content:center;overflow:visible}
.fetch-dog.supplied-dog img{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
@media (max-width: 768px){.fetch-dog.supplied-dog{width:58px;height:39px}}
