/* Chin Chin · estados y utilidades. El resto de los estilos van en línea, como marca el handoff. */
html{scroll-behavior:smooth}
body{margin:0;background:#FBF3E4;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
*{box-sizing:border-box}
img{display:block;max-width:100%}
:focus-visible{outline:3px solid #2A211C;outline-offset:3px;border-radius:4px}

@keyframes ccMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes ccPop{from{opacity:0;transform:translateY(10px) scale(.5)}to{opacity:1;transform:none}}
@keyframes ccSwing{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(-2deg)}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  [style*="ccSwing"],[style*="ccMarquee"]{animation:none!important}
  *{animation-duration:.01ms!important;animation-iteration-count:1!important}
}

/* Hovers y focus que el prototipo declaraba con atributos */
.cc-nav-cta{transition:background .25s,color .25s}
.cc-nav-cta:hover{background:#FBF3E4}
.cc-cta-crema{transition:background .3s,color .3s}
.cc-cta-crema:hover{background:#F2C230;color:#2A211C}
.cc-link-sub{transition:border-color .25s}
.cc-link-sub:hover{border-bottom-color:#FBF3E4}
.cc-send{transition:transform .25s,background .25s,opacity .25s}
.cc-send:hover{transform:translateY(-2px);background:#A8301C}
.cc-dish{transition:padding .3s}
.cc-dish:hover{padding-left:8px}
.cc-row{transition:padding .35s}
.cc-row:hover{padding-left:14px}
.cc-cta-lift{transition:transform .3s}
.cc-cta-lift:hover{transform:translateY(-3px) rotate(-1.5deg)}
.cc-wa{transition:background .25s,color .25s}
.cc-wa:hover{background:#FBF3E4;color:#C43B24}
.cc-planner{transition:color .25s,border-color .25s}
.cc-planner:hover{color:#F2C230;border-bottom-color:#F2C230}
.cc-input{transition:border-color .2s}
.cc-input:focus{border-bottom-color:#C43B24;outline:none}
.cc-faq-q{transition:color .2s}
.cc-faq-q:hover{color:#C43B24}

/* Mad Libs: los campos se adaptan al ancho en móvil */
@media (max-width:560px){
  .cc-madlibs{font-size:19px!important;line-height:2.2!important}
  .cc-input{width:100%!important;max-width:220px}
}

/* La franja tricolor y el marquee no deben provocar scroll lateral */
#cc-root{overflow-x:hidden}