:root{--navy:#17183b;--purple:#6b4fd6;--pink:#ff5fa7;--green:#58c77d;--orange:#ff9d4d;--muted:#6b6e82}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Poppins,sans-serif;color:var(--navy);background:#fff}img{max-width:100%;display:block}a{text-decoration:none;color:inherit}.container{width:min(1160px,92%);margin:auto}
.header{position:sticky;top:0;z-index:30;background:#fffffff2;backdrop-filter:blur(12px);border-bottom:1px solid #ececf4}.nav{height:78px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px}.brand img{width:58px;height:58px;object-fit:contain}.brand strong{font-family:Fredoka;font-size:1.35rem;color:var(--purple);display:block}.brand small{font-size:.66rem;text-transform:uppercase}.menu-btn{display:none;border:0;background:#eeeafd;border-radius:12px;padding:9px 13px;font-size:1.3rem}nav{display:flex;gap:24px;font-weight:600}nav a:hover{color:var(--purple)}
.hero{padding:76px 0;background:radial-gradient(circle at 10% 20%,#fff0cd,transparent 32%),radial-gradient(circle at 90% 15%,#ffd7e8,transparent 27%),linear-gradient(135deg,#fffaf5,#f3efff,#eef8ff)}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center}.eyebrow{text-transform:uppercase;letter-spacing:.1em;color:var(--purple);font-size:.8rem;font-weight:700}.hero h1,h2,h3{font-family:Fredoka}.hero h1{font-size:clamp(3rem,6vw,5.3rem);line-height:1.05;margin:15px 0}.hero h1 span{background:linear-gradient(90deg,var(--purple),var(--pink));background-clip:text;color:transparent}.hero p,.section-head p,.about p,.food-section p,.academy p,.contact-section p{color:var(--muted);line-height:1.7}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:28px 0}.btn{display:inline-flex;padding:14px 21px;border-radius:14px;font-weight:700}.primary{background:linear-gradient(90deg,var(--purple),#9554dd);color:#fff}.secondary{border:2px solid #dcd4ff;background:#fff;color:var(--purple)}.trust{display:flex;gap:14px;flex-wrap:wrap;color:#555a75;font-weight:600;font-size:.9rem}.hero-logo img{width:min(500px,95%);margin:auto;filter:drop-shadow(0 20px 30px #1b1d3a24)}
.shortcut-section{margin-top:0;padding:28px 0;background:#fff}.shortcuts{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.shortcuts a{border:1px solid #ece8f6;border-radius:18px;padding:22px;text-align:center;box-shadow:0 10px 26px #1b1d3a0d}.bubble{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;font-size:1.5rem}.purple{background:#ebe2ff}.pink{background:#ffe2f1}.green{background:#dcf8e8}.orange{background:#ffe8d4}.shortcuts h3{margin:0 0 7px}.shortcuts p{margin:0;color:var(--muted);font-size:.86rem}
.section{padding:82px 0}.section-head{max-width:760px;margin-bottom:34px}.section-head h2,.academy h2,.food-section h2,.about h2,.contact-section h2{font-size:clamp(2rem,4vw,3.2rem);margin:8px 0}.hamster-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.hamster-card{position:relative;border:1px solid #e9e5f4;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 10px 26px #1b1d3a0d}.status{position:absolute;top:10px;left:10px;padding:5px 9px;border-radius:999px;font-size:.7rem;font-weight:700}.available{background:#c9f3c2;color:#2b6227}.reserved{background:#ffd675;color:#704d00}.soon{background:#e8d0ff;color:#61308b}.hamster-photo{height:200px;display:grid;place-items:center;background:linear-gradient(135deg,#eee8ff,#fff0dc);font-size:5rem}.hamster-info{padding:17px}.hamster-info h3{margin:0 0 6px}.hamster-info p{color:var(--muted);font-size:.84rem}.hamster-info>span{background:#fff0d0;border-radius:999px;padding:4px 8px;font-size:.72rem}.hamster-info a{display:block;border:1px solid #a47cff;color:var(--purple);border-radius:10px;padding:9px;text-align:center;margin-top:13px;font-size:.8rem;font-weight:700}
.academy{padding:58px 0;background:linear-gradient(135deg,#15143d,#2b1d69,#6f35dc);color:#fff}.academy-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.pink-text{color:#ff8ac0}.academy-list{display:grid;gap:16px}.academy-list article{display:flex;gap:14px;align-items:flex-start}.academy-list article>span{width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,#8d5cff,#ff5fa7)}.academy-list h3{margin:0}.academy-list p{margin:4px 0 0;color:#ddd9ef;font-size:.88rem}
.food-section{padding:54px 0;background:#f7f4ff}.food-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:36px;align-items:center}.search-row{display:flex;gap:10px}.search-row input{flex:1;border:1px solid #ddd6f3;border-radius:12px;padding:13px 15px}.search-row button{border:0;border-radius:12px;background:var(--purple);color:#fff;padding:0 22px;font-weight:700}.suggestions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.suggestions button{border:0;border-radius:999px;background:#fff;padding:7px 12px}.food-result{background:#fff;border:1px solid #e4def5;border-radius:12px;padding:14px;color:var(--muted)}.food-result.good{background:#eefbf4;color:#22634a;border-color:#bde7d1}.food-result.warn{background:#fff8e8;color:#725811;border-color:#efdda9}.food-result.bad{background:#fff0f4;color:#8a3049;border-color:#efc7d2}
.about{background:#fff}.about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:center}.about-grid img{width:min(430px,90%);margin:auto}.contact-section{padding:70px 0;background:linear-gradient(135deg,#fff0d7,#f1eaff)}.contact-card{display:grid;grid-template-columns:120px 1fr;gap:24px;align-items:center;background:#fff;border-radius:24px;padding:28px;box-shadow:0 15px 40px #1b1d3a10}.contact-card img{width:110px}
footer{background:#11122f;color:#d8d9e8}.footer{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px;padding:40px 0}.footer-brand{display:flex;gap:13px}.footer-brand img{width:72px;height:72px}.footer strong{color:#fff;font-family:Fredoka}.footer a,.footer span{display:block;margin:7px 0;font-size:.86rem}.footer p{color:#b9bad0}.copyright{border-top:1px solid #ffffff14;padding:17px 0;text-align:center;font-size:.8rem}
@media(max-width:900px){.hero-grid,.academy-grid,.food-grid,.about-grid{grid-template-columns:1fr}.shortcuts,.hamster-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.menu-btn{display:block}nav{display:none;position:absolute;top:78px;left:0;right:0;background:#fff;padding:20px 4%;flex-direction:column;align-items:stretch;border-bottom:1px solid #eee}nav.show{display:flex}.footer{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}
@media(max-width:520px){.shortcuts,.hamster-grid{grid-template-columns:1fr}.trust{flex-direction:column;gap:8px}.search-row{flex-direction:column}.search-row button{padding:12px}.contact-card{grid-template-columns:1fr;text-align:center}.contact-card img{margin:auto}.footer{grid-template-columns:1fr}.footer-brand{grid-column:auto}}

.care-section{padding:58px 0;background:linear-gradient(135deg,#15143d,#2b1d69,#6f35dc);color:#fff}
.care-heading{max-width:760px;margin-bottom:30px}
.care-heading h2{font-size:clamp(2rem,4vw,3.2rem);margin:8px 0}
.care-heading p{color:#ddd9ef;line-height:1.7}
.care-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.care-grid article{display:flex;gap:14px;align-items:flex-start;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:20px}
.care-grid article>span{width:46px;height:46px;flex:0 0 46px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#8d5cff,#ff5fa7);font-size:1.4rem}
.care-grid h3{margin:0 0 6px}
.care-grid p{margin:0;color:#ddd9ef;font-size:.88rem;line-height:1.6}
@media(max-width:900px){.care-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.care-grid{grid-template-columns:1fr}}

.luna-card{overflow:hidden}
.luna-scroll{
  display:flex;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  background:linear-gradient(135deg,#f7f3ff,#fff7ef)
}
.luna-scroll::-webkit-scrollbar{display:none}
.luna-slide{min-width:100%;height:290px;padding:14px;scroll-snap-align:start}
.luna-slide img{
  width:100%;height:100%;display:block;object-fit:cover;object-position:center;
  border-radius:15px
}
.scroll-note{
  padding:8px 12px;text-align:center;font-size:.76rem;font-weight:600;
  color:#6a637f;background:#f8f5ff;border-bottom:1px solid #eae4f6
}
.luna-tags{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 12px}
.tag-female,.tag-age,.tag-bicolor{
  display:inline-flex;padding:7px 11px;border-radius:999px;font-weight:700
}
.tag-female{background:#ffe2f0;color:#79224e}
.tag-age{background:#e9e2ff;color:#3f2b7e}
.tag-bicolor{background:#fff0cf;color:#4e3a14;margin-bottom:12px}
.whatsapp-info{
  display:flex!important;width:100%;align-items:center;justify-content:center;gap:9px;
  padding:12px 16px!important;margin-top:12px;border:none!important;
  border-radius:13px!important;background:#25d366!important;color:#fff!important;
  font-weight:800!important
}
.wa-circle{
  width:24px;height:24px;border:2px solid #fff;border-radius:50%;
  display:grid;place-items:center;font-size:.72rem
}
.contact-info{width:auto;display:inline-flex!important}
@media(max-width:520px){.luna-slide{height:265px;padding:11px}}

/* Tarjeta de Mochi */
.mochi-card{overflow:hidden}
.mochi-scroll{
  display:flex;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  background:linear-gradient(135deg,#f7f3ff,#fff7ef)
}
.mochi-scroll::-webkit-scrollbar{display:none}
.mochi-slide{
  min-width:100%;
  height:290px;
  padding:14px;
  scroll-snap-align:start
}
.mochi-slide img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  border-radius:15px
}
.photo-note{
  padding:8px 12px;
  text-align:center;
  font-size:.76rem;
  font-weight:600;
  color:#6a637f;
  background:#f8f5ff;
  border-bottom:1px solid #eae4f6
}
.mochi-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:10px 0 12px
}
@media(max-width:520px){
  .mochi-slide{height:265px;padding:11px}
}

/* Tarjeta de Chispa */
.chispa-card{overflow:hidden}
.chispa-scroll{
  display:flex;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  background:linear-gradient(135deg,#f7f3ff,#fff7ef)
}
.chispa-scroll::-webkit-scrollbar{display:none}
.chispa-slide{
  min-width:100%;
  height:290px;
  padding:14px;
  scroll-snap-align:start
}
.chispa-slide img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  border-radius:15px
}
.chispa-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:10px 0 12px
}
@media(max-width:520px){
  .chispa-slide{height:265px;padding:11px}
}

/* Página principal multipágina */
.intro-hero{
  padding:72px 0;
  background:radial-gradient(circle at 10% 20%,#fff0cd,transparent 32%),radial-gradient(circle at 90% 15%,#ffd7e8,transparent 27%),linear-gradient(135deg,#fffaf5,#f3efff,#eef8ff)
}
.intro-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.intro-copy h1{font-family:Fredoka;font-size:clamp(3rem,6vw,5rem);line-height:1.05;margin:14px 0 24px}
.intro-copy h1 span{background:linear-gradient(90deg,var(--purple),var(--pink));background-clip:text;color:transparent}
.intro-message{background:#fff;border:1px solid #ebe7f5;border-radius:24px;padding:28px;box-shadow:0 16px 42px rgba(27,29,58,.08)}
.intro-message p{color:var(--muted);line-height:1.82;margin:0 0 16px}
.intro-message p:last-child{margin-bottom:0}.intro-message strong{color:var(--purple)}
.intro-logo img{width:min(470px,95%);margin:auto;filter:drop-shadow(0 20px 30px rgba(27,29,58,.18))}
.intro-links{padding:38px 0 76px;background:#fff}
.page-links{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.page-links a{background:#fff;border:1px solid #ebe7f5;border-radius:18px;padding:22px 16px;text-align:center;box-shadow:0 10px 28px rgba(27,29,58,.06);transition:.2s}
.page-links a:hover{transform:translateY(-3px)}
.page-links span{display:block;font-size:2rem;margin-bottom:10px}.page-links h3{margin:0 0 6px}.page-links p{font-size:.82rem;margin:0;color:var(--muted)}
body>main>section:first-child:not(.intro-hero){padding-top:72px}
@media(max-width:900px){.intro-grid{grid-template-columns:1fr}.page-links{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.intro-hero{padding:52px 0}.intro-message{padding:21px}.page-links{grid-template-columns:1fr}}

/* Menú superior con iconos y títulos */
.header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(14px);
  border-bottom:1px solid #ececf4;
}

.nav{
  min-height:92px;
  height:auto;
  display:flex;
  align-items:center;
  gap:24px;
  padding:10px 0;
}

.brand{
  flex:0 0 auto;
}

.icon-nav{
  margin-left:auto;
  display:flex;
  align-items:stretch;
  justify-content:flex-end;
  gap:7px;
}

.icon-nav-link{
  min-width:82px;
  padding:8px 9px;
  border-radius:14px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  color:var(--navy);
  transition:background .2s, color .2s, transform .2s;
}

.icon-nav-link:hover,
.icon-nav-link.active{
  color:var(--purple);
  background:#f1edff;
  transform:translateY(-1px);
}

.menu-icon{
  display:block;
  font-size:1.35rem;
  line-height:1;
}

.menu-title{
  display:block;
  font-size:.76rem;
  line-height:1.2;
  font-weight:700;
  white-space:nowrap;
}

.intro-hero{
  min-height:calc(100vh - 92px);
  display:flex;
  align-items:center;
}

/* Las tarjetas de enlaces grandes fueron eliminadas del inicio */
.intro-links,
.page-links{
  display:none !important;
}

@media(max-width:900px){
  .nav{
    width:100%;
    flex-wrap:wrap;
    gap:8px;
    padding:9px 0 0;
  }

  .brand{
    width:100%;
    padding:0 2%;
  }

  .brand img{
    width:54px;
    height:54px;
  }

  .icon-nav{
    order:2;
    width:100%;
    margin-left:0;
    padding:7px 4% 10px;
    overflow-x:auto;
    justify-content:flex-start;
    gap:7px;
    background:#fff;
    border-top:1px solid #f0edf7;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }

  .icon-nav::-webkit-scrollbar{
    display:none;
  }

  .icon-nav-link{
    min-width:78px;
    flex:0 0 auto;
    padding:8px 7px;
  }

  .intro-hero{
    min-height:auto;
    padding-top:50px;
  }
}

@media(max-width:520px){
  .brand strong{
    font-size:1.3rem;
  }

  .brand small{
    display:block;
    font-size:.62rem;
  }

  .icon-nav-link{
    min-width:74px;
  }

  .menu-title{
    font-size:.72rem;
  }
}


/* =========================
   MENÚ RETRÁCTIL EN CELULAR
   ========================= */

.menu-toggle{
  display:none;
  margin-left:auto;
  width:56px;
  height:56px;
  border:none;
  border-radius:18px;
  background:#efe9ff;
  color:var(--navy);
  font-size:1.9rem;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(27,29,58,.08);
}

@media(max-width:900px){
  .nav{
    position:relative;
    width:100%;
    flex-wrap:nowrap;
    align-items:center;
    gap:12px;
    padding:12px 0;
  }

  .brand{
    width:auto;
    padding:0;
    flex:1 1 auto;
    min-width:0;
  }

  .menu-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    margin-right:4%;
  }

  .icon-nav{
    display:none;
    position:absolute;
    top:100%;
    left:4%;
    right:4%;
    z-index:70;
    margin:10px 0 0;
    padding:12px;
    border:1px solid #ece7fa;
    border-radius:20px;
    background:#ffffff;
    box-shadow:0 18px 42px rgba(27,29,58,.14);
    overflow:visible;
  }

  .icon-nav.show{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:10px;
  }

  .icon-nav-link{
    min-width:unset;
    width:100%;
    padding:12px 10px;
    border:1px solid #f0ebff;
    background:#faf8ff;
  }

  .menu-title{
    font-size:.78rem;
  }

  .intro-hero,
  .page-hero{
    padding-top:36px;
  }
}

@media(max-width:520px){
  .menu-toggle{
    width:54px;
    height:54px;
    border-radius:16px;
    font-size:1.8rem;
  }

  .icon-nav.show{
    grid-template-columns:1fr 1fr;
  }

  .brand{
    padding-left:4%;
  }

  .brand img{
    width:54px;
    height:54px;
  }

  .brand strong{
    font-size:1.25rem;
  }

  .brand small{
    font-size:.62rem;
  }
}

/* ===================================================
   HAMIVERSE MENÚ RETRÁCTIL CORREGIDO — V2
   Estas reglas finales tienen prioridad sobre las anteriores.
   =================================================== */

.header{
  position:sticky !important;
  top:0;
  z-index:1000 !important;
  overflow:visible !important;
}

.nav{
  position:relative !important;
  overflow:visible !important;
}

.menu-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  width:58px;
  height:58px;
  padding:0;
  margin-left:auto;
  border:0;
  border-radius:18px;
  background:#eee9ff;
  color:#17183b;
  font-size:2rem;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 9px 24px rgba(27,29,58,.12);
}

.menu-toggle span{
  display:block;
  line-height:1;
}

@media (max-width:900px){
  .nav{
    min-height:86px !important;
    height:auto !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:10px !important;
    padding:12px 4% !important;
  }

  .brand{
    width:auto !important;
    max-width:calc(100% - 72px);
    flex:1 1 auto !important;
    min-width:0 !important;
    padding:0 !important;
  }

  .brand img{
    flex:0 0 auto;
    width:58px !important;
    height:58px !important;
  }

  .brand div{
    min-width:0;
  }

  .brand strong{
    display:block;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .menu-toggle{
    display:inline-flex !important;
    flex:0 0 58px !important;
    position:relative !important;
    z-index:1002 !important;
  }

  .icon-nav{
    display:none !important;
    position:absolute !important;
    top:calc(100% + 8px) !important;
    left:4% !important;
    right:4% !important;
    width:auto !important;
    max-height:calc(100vh - 130px);
    overflow-y:auto !important;
    margin:0 !important;
    padding:12px !important;
    border:1px solid #e9e3fa !important;
    border-radius:20px !important;
    background:#fff !important;
    box-shadow:0 20px 48px rgba(27,29,58,.18) !important;
    z-index:1001 !important;
  }

  .icon-nav.show{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }

  .icon-nav-link{
    width:100% !important;
    min-width:0 !important;
    padding:13px 9px !important;
    border:1px solid #eee9fb !important;
    border-radius:14px !important;
    background:#faf8ff !important;
  }

  .icon-nav-link.active{
    color:#6b4fd6 !important;
    background:#eee9ff !important;
  }

  .intro-hero,
  .page-hero{
    padding-top:34px !important;
  }
}

@media (max-width:520px){
  .nav{
    padding:10px 16px !important;
  }

  .brand img{
    width:54px !important;
    height:54px !important;
  }

  .brand strong{
    font-size:1.15rem !important;
  }

  .brand small{
    display:block !important;
    font-size:.58rem !important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .menu-toggle{
    width:54px !important;
    height:54px !important;
    flex-basis:54px !important;
    border-radius:16px !important;
    font-size:1.85rem !important;
  }

  .icon-nav{
    left:16px !important;
    right:16px !important;
  }
}