/* ═══════════════════════════════════════════════════════════════
   aiyujapan.com/go · «TU LLAVE A JAPÓN» (tema claro .theme-go)
   ───────────────────────────────────────────────────────────────
   Estilo sticker: borde grueso de tinta + sombra desplazada.
   Usa los tokens de tokens.css, las animaciones ai* de base.css y
   los componentes de components.css (.btn, .card, .acc, .segmented,
   .stepper…). Aquí solo va lo propio de /go (prefijo go-).
   Índice:
     1. Página y utilidades
     2. Avisos superiores (Comic Con en vivo · «Te invitó…»)
     3. Cabecera y franja del llavero
     4. Portada: vuelo, nubes, destellos, título, palabras que giran
     5. Atajos
     6. Cinta de tiendas
     7. Destacado del mes
     8. Cupón de bienvenida (ticket)
     9. Cotizador (pegar el link)
    10. Dos formas de comprar (pestañas, pasos, dirección)
    11. Calculadora
    12. Seguimiento del pedido
    13. Ideas: categorías y «Búscalo así en Mercari»
    14. Referidos
    15. Aiyunboxing y reseñas
    16. Preguntas frecuentes
    17. Redes
    18. Pie de página
    19. Pantallas chicas y escritorio
    20. Movimiento reducido
   ═══════════════════════════════════════════════════════════════ */

/* ── 1. Página y utilidades ───────────────────────────────── */
.go-page { padding-bottom: calc(44px + env(safe-area-inset-bottom)); }
.go-jp { font-family: var(--f-jp); font-weight: 700; }
.go-h2 { font-size: 28px; line-height: 1.15; margin-top: 6px; }

/* Efecto «se levanta» al pasar el dedo/mouse y «se hunde» al tocar */
.go-lift { transition: transform .15s ease, background .2s, color .2s; }
.go-lift:hover { transform: translate(-2px, -2px); }
.go-lift:active { transform: translate(2px, 2px); }

/* Subrayado amarillo de marcador («Japón», nombre de la persona) */
.go-mark { background: linear-gradient(transparent 58%, var(--yellow) 58%, var(--yellow) 92%, transparent 92%); padding: 0 4px; }

/* Aviso para navegadores sin JavaScript */
.go-noscript { margin: 24px var(--gutter) 0; padding: 14px 16px; border-radius: var(--r-lg); background: var(--yellow-soft); border: 2px solid #D9A000; font-size: 14px; line-height: 1.5; color: #3B2E00; }
.go-noscript b { display: block; }

/* ── 2. Avisos superiores ─────────────────────────────────── */
/* Comic Con en vivo (solo con el stand abierto) */
.go-live { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 4px 10px; padding: 9px 14px; background: var(--cc-bg); color: #fff; font-size: 12.5px; font-weight: 700; line-height: 1.3; text-align: center; text-decoration: none; }
.go-live:hover { color: var(--cc-yellow); }
.go-live u { text-underline-offset: 3px; }
.go-live__pill { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: var(--r-pill); background: var(--cc-red); font-size: 11px; font-weight: 800; letter-spacing: .1em; }

/* «Te invitó…» */
.go-invite { margin: 0 var(--gutter) 10px; display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: var(--r-lg); background: #fff; border: 2.5px solid var(--ink); box-shadow: 4px 4px 0 var(--yellow); animation: aiRise .4s var(--ease-out); }
.go-invite img { flex: none; }
.go-invite__k { font-size: 11px; font-weight: 800; letter-spacing: .1em; color: #8A6400; }
.go-invite p { font-size: 14px; line-height: 1.4; font-weight: 600; }

/* ── 3. Cabecera y franja del llavero ─────────────────────── */
.go-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 18px; }
.go-header__logo { flex: none; border-radius: 6px; }
.go-header__logo img { width: 150px; height: 30px; }
.go-account { flex: none; font-weight: 700; font-size: 14px; color: var(--ink); text-decoration: none; padding: 9px 16px; border: 2px solid var(--ink); border-radius: var(--r-pill); background: #fff; box-shadow: var(--sh-1); }
.go-account:hover { color: var(--ink); }
.go-account.is-user { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: 13.5px; letter-spacing: .04em; padding: 4px 13px 4px 4px; }
.go-account__avatar { flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--sky-2); border: 1.5px solid var(--ink); overflow: hidden; display: flex; align-items: flex-start; justify-content: center; }
.go-account__avatar img { width: 34px; height: 40px; max-width: none; object-fit: contain; margin-top: 1px; }
.go-account__name { max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.go-strip { margin: 0 var(--gutter) 10px; display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: var(--r-md); background: var(--ink); color: #fff; font-size: 12.5px; font-weight: 600; line-height: 1.35; }
.go-strip svg { flex: none; color: var(--yellow); }

/* ── 4. Portada ───────────────────────────────────────────── */
.go-hero { margin: 0 var(--gutter); position: relative; border: 2.5px solid var(--ink); border-radius: 28px; background: linear-gradient(170deg, #A9E1FA 0%, #D9F1FD 46%, #FFF1C2 100%); box-shadow: var(--sh-4); overflow: hidden; padding: 18px 20px 22px; }
.go-hero > * { position: relative; }

/* Escena del vuelo: camino punteado, nubes, destellos y la capibara en avión */
.go-flight { position: relative; height: 252px; }
.go-flight__path { position: absolute; inset: 0; width: 100%; height: 252px; }
.go-flight__path path { animation: aiDash 3s linear infinite; }
.go-cloud { position: absolute; animation: aiDrift 7s ease-in-out infinite; }
.go-cloud--a { left: 8px; top: 34px; }
.go-cloud--b { right: 4px; top: 150px; animation-duration: 9s; animation-delay: 1s; }
.go-twinkle { position: absolute; animation: aiTwinkle 2.6s ease-in-out infinite; }
.go-twinkle--a { left: 86px; top: 12px; }
.go-twinkle--b { right: 70px; top: 70px; animation-duration: 3.2s; animation-delay: .8s; }
.go-twinkle--c { left: 40px; top: 120px; animation-duration: 2.9s; animation-delay: 1.4s; }
.go-place { position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: var(--r-pill); background: #fff; border: 2px solid var(--ink); box-shadow: var(--sh-1); font-size: 11.5px; font-weight: 800; letter-spacing: .06em; white-space: nowrap; }
.go-place .jp { letter-spacing: .06em; }
.go-place--from { left: 0; bottom: 6px; }
.go-place--to { right: 0; top: 4px; background: var(--yellow); }
.go-place__dot { width: 10px; height: 10px; border-radius: 50%; background: var(--cc-red); border: 1.5px solid var(--ink); }
.go-flight__shadow { position: absolute; left: 50%; bottom: 10px; width: 120px; height: 14px; margin-left: -60px; border-radius: 50%; background: rgba(22, 32, 46, .16); animation: aiShadow 4.5s ease-in-out infinite; }
.go-flight__plane { position: absolute; z-index: 1; left: 50%; top: 14px; width: 190px; height: 228px; margin-left: -95px; object-fit: contain; animation: aiFly 4.5s ease-in-out infinite; }

/* Título y subtítulos */
.go-hero__title { margin: 6px 0 0; text-align: center; font-size: 42px; line-height: 1.05; letter-spacing: -.01em; color: var(--ink); }
/* «Tu llave a Japón» mide ~8 em: se achica lo justo para quedar en una línea, como en el diseño */
.go-hero__title:not(.is-hello) { font-size: min(42px, calc((100vw - 74px) / 8.2)); }
.go-hero__title.is-hello { font-size: 36px; line-height: 1.08; }
.go-hero__jp { text-align: center; font-family: var(--f-jp); font-weight: 700; font-size: 13px; letter-spacing: .34em; color: var(--link); margin-top: 8px; }

/* «Trae [palabra] de Japón»: la caja oscura se ajusta a la palabra más larga */
.go-rotator { margin-top: 12px; display: flex; justify-content: center; align-items: center; gap: 7px; font-size: 18px; font-weight: 700; color: var(--ink-2); line-height: 28px; }
.go-rotator__box { display: inline-block; min-width: 128px; height: 28px; padding: 0 8px; overflow: hidden; border-radius: 9px; background: var(--ink); color: var(--yellow); text-align: center; font-family: var(--f-display); font-weight: 800; }
.go-rotator__list { display: block; will-change: transform; }
.go-rotator__list > span { display: block; height: 28px; white-space: nowrap; }

.go-hero__sub { margin: 8px auto 0; max-width: 320px; text-align: center; font-size: 15px; line-height: 1.5; color: var(--ink-2); }
.go-hero__sub:empty { display: none; }
.go-hero__cta { margin-top: 16px; gap: 10px; padding: 16px clamp(12px, 4vw, 20px); font-size: clamp(16px, 4.9vw, 19px); border-radius: var(--r-lg); box-shadow: var(--sh-3); }
.go-hero__chip { display: flex; justify-content: center; margin-top: 12px; }
.go-gift { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 700; color: var(--ink); background: #fff; border: 2px dashed var(--ink); border-radius: var(--r-pill); padding: 6px 13px; text-align: center; }
.go-gift svg { flex: none; color: #D9A000; }

/* Insignias de confianza */
.go-badges { margin: 18px 0 0; padding: 0; list-style: none; }
.go-badge { background: rgba(255, 255, 255, .8); border-radius: var(--r-md); padding: 10px 6px; text-align: center; font-size: 12px; line-height: 1.3; font-weight: 600; color: var(--ink-2); }
.go-badge b { display: block; font-family: var(--f-display); font-weight: 800; font-size: 15px; color: var(--ink); }

/* ── 5. Atajos ────────────────────────────────────────────── */
.go-tiles { margin: 18px var(--gutter) 0; }
.go-tile { display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 12px 4px 10px; border: 2px solid var(--ink); border-radius: 16px; background: #fff; box-shadow: var(--sh-2); text-decoration: none; color: var(--ink); text-align: center; }
.go-tile:hover { color: var(--ink); }
.go-tile__ico { width: 38px; height: 38px; border-radius: 12px; background: var(--tile-bg, #fff); border: 2px solid var(--ink); display: flex; align-items: center; justify-content: center; color: var(--ink); }
.go-tile__txt { font-size: 12px; font-weight: 700; line-height: 1.2; }

/* ── 6. Cinta de tiendas (se mueve sola; dos copias para que no se corte) ── */
.go-marquee { margin: 30px -10px 0; transform: rotate(-2deg); background: var(--ink); overflow: hidden; padding: 11px 0; border-top: 3px solid var(--yellow); border-bottom: 3px solid var(--yellow); }
.go-marquee__track { display: flex; width: max-content; animation: aiMarquee var(--go-marquee-s, 26s) linear infinite; }
.go-marquee__group { display: flex; align-items: center; gap: 18px; padding-right: 18px; font-family: var(--f-display); font-weight: 800; font-size: 16px; letter-spacing: .08em; color: var(--yellow); white-space: nowrap; }
.go-marquee__group i { font-style: normal; color: var(--sky); }

/* ── 7. Destacado del mes ─────────────────────────────────── */
.go-feat { --card-pad: 0; --feat-img: clamp(84px, 27vw, 118px); margin-top: 34px; border-radius: 24px; overflow: hidden; }
.go-feat__bar { background: var(--ink); display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 16px; font-size: 12px; font-weight: 800; letter-spacing: .1em; }
.go-feat__bar span:first-child { color: var(--yellow); }
.go-feat__bar span:last-child { color: var(--sky-2); text-align: right; }
.go-feat__img { position: absolute; right: 6px; top: 50px; width: var(--feat-img); height: auto; object-fit: contain; animation: aiBob 3.6s ease-in-out infinite; }
.go-feat__body { padding: 18px 18px 20px; display: flex; flex-direction: column; gap: 12px; }
/* El texto deja lugar a la mascota (6 px de aire) en cualquier ancho */
.go-feat__title { max-width: min(210px, calc(100% - var(--feat-img) + 6px)); font-size: 25px; line-height: 1.15; }
.go-feat__text { max-width: min(230px, calc(100% - var(--feat-img) + 6px)); font-size: 15px; line-height: 1.5; color: var(--ink-2); }
.go-feat__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.go-feat__chip { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; padding: 6px 11px; border-radius: var(--r-pill); background: var(--sky-bg); border: 1.5px solid var(--ink); }
.go-feat__chip .dot { background: var(--dot, var(--sky)); }
.go-feat__cta { align-self: flex-start; padding: 12px 18px; font-weight: 700; }

/* ── 8. Cupón de bienvenida (ticket con muescas y brillo) ── */
.go-coupon { margin-top: 30px; }
.go-ticket { position: relative; display: flex; border: 2.5px solid var(--ink); border-radius: var(--r-xl); background: var(--yellow); box-shadow: var(--sh-4); overflow: hidden; color: var(--ink); }
.go-ticket__main { flex-grow: 1; min-width: 0; padding: 18px 14px 18px 20px; display: flex; flex-direction: column; gap: 4px; }
.go-ticket__k { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 11.5px; font-weight: 800; letter-spacing: .12em; }
.go-ticket__badge { font-size: 10.5px; letter-spacing: .08em; padding: 3px 8px; border-radius: var(--r-pill); background: var(--ink); color: var(--yellow); }
.go-ticket__amt { font-family: var(--f-display); font-weight: 800; font-size: clamp(48px, 15vw, 60px); line-height: 1; }
.go-ticket__txt { font-size: 14px; line-height: 1.4; font-weight: 600; color: #3B2E00; }
.go-ticket__cut { width: 0; border-left: 2.5px dashed var(--ink); margin: 16px 0; }
.go-ticket__side { --side: 108px; flex: none; width: var(--side); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 10px 6px; }
.go-ticket__side img { width: 78px; height: 92px; object-fit: contain; animation: aiBob 3s ease-in-out infinite; }
.go-ticket__side span { font-size: 11px; font-weight: 800; letter-spacing: .06em; text-align: center; }
.go-ticket__notch { position: absolute; right: 97px; width: 24px; height: 24px; border-radius: 50%; background: var(--sky-bg); border: 2.5px solid var(--ink); }
.go-ticket__notch--top { top: -14px; }
.go-ticket__notch--bottom { bottom: -14px; }
/* Brillo que cruza el ticket. Quieto (sin animación) queda fuera, a la izquierda. */
.go-ticket__shine { position: absolute; top: 0; bottom: 0; left: 0; width: 56px; transform: translateX(-140%) skewX(-18deg); background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .7), rgba(255, 255, 255, 0)); animation: aiShine 4s ease-in-out infinite; pointer-events: none; }
.go-coupon__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 14px; padding: 0 2px; }
.go-coupon__fine { font-size: 12.5px; line-height: 1.4; color: var(--ink-3); }
.go-coupon__fine a { font-weight: 600; }
.go-coupon__cta { flex: none; min-height: 0; padding: 11px 16px; border-radius: 12px; font-size: 14px; font-weight: 700; }

/* ── 9. Cotizador ─────────────────────────────────────────── */
.go-quote { --card-bg: var(--sky-3); margin-top: 34px; border-radius: 24px; padding: 20px 18px; }
.go-quote__img { position: absolute; right: 8px; top: -26px; width: 88px; height: 105px; object-fit: contain; animation: aiBob 3.4s ease-in-out infinite; }
.go-quote h2 { margin-top: 6px; max-width: min(230px, calc(100% - 84px)); font-size: 24px; line-height: 1.15; }
.go-quote__label { display: block; font-size: 13px; font-weight: 700; margin: 16px 0 6px; }
.go-quote__row { display: flex; gap: 8px; }
.go-quote__row .input { flex: 1 1 auto; min-width: 0; min-height: 50px; border-radius: var(--r-md); padding: 12px 14px; }
.go-quote__send { flex: none; min-height: 50px; padding: 0 18px; font-size: 16px; border-width: 2px; border-radius: var(--r-md); box-shadow: var(--sh-2); }
.go-store { margin-top: 10px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 13px; font-weight: 600; color: var(--ink-2); animation: aiRise .3s ease-out; }
.go-store__name { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--r-pill); background: #fff; border: 1.5px solid var(--ink); font-weight: 800; color: var(--ink); }
.go-store__name .dot { background: var(--dot, var(--sky)); }
.go-examples { margin-top: 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ink-3); }
.go-examples:empty { display: none; }
.go-examples > span { font-weight: 600; }
.go-examples button { font-size: 12.5px; font-weight: 700; padding: 5px 10px; border-radius: var(--r-pill); border: 1.5px dashed var(--link); background: #fff; color: var(--link); }
.go-examples button:hover { background: var(--sky-bg); }
.go-msg { margin-top: 12px; display: flex; gap: 9px; align-items: center; border-radius: var(--r-md); padding: 11px 12px; font-size: 14px; font-weight: 600; animation: aiRise .35s ease-out; }
.go-msg svg { flex: none; }
.go-msg--ok { background: #fff; border: 2px solid var(--green); color: var(--green-ink); }
.go-msg--warn { background: var(--yellow-soft); border: 2px solid #D9A000; color: #5C4300; }
.go-quote__note { margin-top: 12px; font-size: 12.5px; line-height: 1.45; color: var(--ink-3); }

/* ── 10. Dos formas de comprar ────────────────────────────── */
.go-how { margin-top: 42px; }
.go-seg { margin-top: 16px; gap: 6px; padding: 5px; border-radius: var(--r-lg); }
.go-seg button { font-size: 15px; padding: 12px 6px; border-radius: 13px; }
.go-plan { margin-top: 14px; border-radius: var(--r-xl); }
.go-plan.is-in { animation: aiRise .3s ease-out; }
.go-plan__top { display: flex; align-items: center; gap: 12px; }
.go-plan__top img { flex: none; width: 92px; height: 92px; object-fit: contain; }
.go-plan--casillero .go-plan__top img { height: 100px; }
.go-plan__info { flex-grow: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.go-plan__tag { align-self: flex-start; font-size: 11.5px; font-weight: 800; letter-spacing: .1em; background: var(--sky-3); color: #1F5F80; padding: 5px 10px; border-radius: var(--r-pill); }
.go-plan--casillero .go-plan__tag { background: var(--yellow-soft); color: #5C4300; }
.go-plan__price b { font-family: var(--f-display); font-weight: 800; font-size: 30px; line-height: 1; }
.go-plan__price span { font-size: 13px; font-weight: 600; color: var(--ink-3); }
.go-plan__ideal { font-size: 13px; line-height: 1.4; color: var(--ink-3); }

/* Pasos con línea que los une */
.go-steps { display: flex; flex-direction: column; margin: 16px 0 0; padding: 0; list-style: none; }
.go-step { display: flex; gap: 14px; }
.go-step__rail { display: flex; flex-direction: column; align-items: center; }
.go-step__num { flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--yellow); border: 2px solid var(--ink); font-family: var(--f-display); font-weight: 800; display: flex; align-items: center; justify-content: center; color: var(--ink); }
.go-step__num--send { background: var(--sky); }
.go-step__line { width: 2.5px; flex-grow: 1; min-height: 18px; background: var(--ink); }
.go-step__body { padding-bottom: 16px; }
.go-step:last-child .go-step__body { padding-bottom: 0; }
.go-step__t { font-weight: 700; font-size: 16px; }
.go-step__d { font-size: 14px; line-height: 1.45; color: var(--ink-3); }

/* Dirección en Osaka (con cuenta) / aviso (sin cuenta) */
.go-addr { margin-top: 16px; border: 2px dashed var(--ink); border-radius: 16px; background: var(--sky-bg); padding: 12px 14px; }
.go-addr__head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.go-addr__k { font-size: 11.5px; font-weight: 800; letter-spacing: .1em; color: var(--link); }
.go-addr__btn { flex: none; font-size: 12.5px; font-weight: 800; padding: 6px 12px; border-radius: var(--r-sm); border: 0; background: var(--ink); color: #fff; transition: background .2s; }
.go-addr__btn.is-flash { background: var(--green); }
.go-addr__txt { margin-top: 8px; font-size: 14px; line-height: 1.55; }
.go-addr__note { margin-top: 6px; font-size: 12px; color: var(--ink-3); }
.go-addr-guest { margin-top: 16px; display: flex; gap: 10px; align-items: center; border-radius: 16px; background: var(--yellow-soft); padding: 12px 14px; font-size: 13.5px; line-height: 1.45; color: #3B2E00; }
.go-addr-guest svg { flex: none; color: #8A6400; }

/* ── 11. Calculadora ──────────────────────────────────────── */
.go-calc { margin-top: 16px; border: 2.5px solid var(--ink); border-radius: var(--r-xl); background: var(--ink); color: #fff; padding: 18px; box-shadow: 5px 5px 0 var(--sky); }
.go-calc__head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.go-calc__title { font-size: 18px; line-height: 1.2; }
.go-calc__k { flex: none; font-size: 11px; font-weight: 800; letter-spacing: .1em; color: var(--yellow); }
.go-calc__qty { margin-top: 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 14px; color: #C9D6E8; }
.go-calc .stepper button { width: 36px; height: 36px; }
.go-calc .stepper button[aria-disabled="true"] { opacity: .4; cursor: default; }
.go-calc .stepper output { min-width: 36px; }
.go-calc__rows { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; font-size: 14px; }
.go-calc__row { display: flex; justify-content: space-between; gap: 10px; }
.go-calc__row > span { color: #C9D6E8; }
.go-calc__row > b { font-weight: 700; white-space: nowrap; }
.go-calc__row--coupon > b { color: var(--yellow); }
.go-calc__sep { height: 0; border-top: 1.5px dashed rgba(255, 255, 255, .3); }
.go-calc__total { align-items: baseline; }
.go-calc__total > span { color: #fff; font-weight: 700; }
.go-calc__total output { font-family: var(--f-display); font-weight: 800; font-size: 28px; color: var(--yellow); white-space: nowrap; }
.go-calc__note { margin-top: 10px; font-size: 12px; line-height: 1.45; color: #9FB0C8; }

/* ── 12. Seguimiento del pedido (barra animada) ───────────── */
.go-track { margin-top: 34px; border-radius: 24px; display: flex; gap: 12px; align-items: center; }
.go-track > img { flex: none; width: 84px; height: 104px; object-fit: contain; }
.go-track__t { font-size: 19px; line-height: 1.2; }
.go-track__d { font-size: 13px; line-height: 1.4; color: var(--ink-3); margin-top: 4px; }
.go-track__bar { position: relative; margin-top: 14px; height: 26px; }
.go-track__rail { position: absolute; left: 8px; right: 8px; top: 11px; height: 4px; border-radius: 4px; background: var(--sky-3); }
.go-track__fill { position: absolute; left: 8px; top: 11px; height: 4px; width: 72%; border-radius: 4px; background: var(--ink); animation: aiTrack 5s ease-in-out infinite; }
.go-track__dots { position: absolute; inset: 0; display: flex; justify-content: space-between; }
.go-track__dots span { width: 18px; height: 18px; margin-top: 4px; border-radius: 50%; background: var(--ink); border: 2px solid var(--ink); }
.go-track__dots .is-now { background: var(--yellow); animation: goPulse 1.8s ease-out infinite; }
.go-track__dots .is-next { background: #fff; }
.go-track__labels { display: flex; justify-content: space-between; gap: 4px; margin: 2px 0 0; padding: 0; list-style: none; font-size: 10.5px; font-weight: 700; color: var(--ink-3); }
.go-track__labels .is-now { color: var(--ink); }
@keyframes goPulse { 0% { box-shadow: 0 0 0 0 rgba(255, 194, 26, .75); } 70% { box-shadow: 0 0 0 12px rgba(255, 194, 26, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 194, 26, 0); } }

/* ── 13. Ideas: categorías y «Búscalo así» ────────────────── */
.go-ideas { margin: 42px 0 0; }
.go-ideas__head { padding: 0 var(--gutter); }
.go-ideas__lead { margin-top: 6px; font-size: 14px; line-height: 1.45; color: var(--ink-3); }
.go-cats { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter); padding: 14px var(--gutter) 12px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.go-cats::-webkit-scrollbar { display: none; }
.go-cat { flex: none; scroll-snap-align: start; width: 142px; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 10px 12px; border: 2.5px solid var(--ink); border-radius: 20px; background: var(--cat-bg, #fff); box-shadow: 2px 2px 0 rgba(22, 32, 46, .25); transition: transform .2s, box-shadow .2s; color: var(--ink); text-align: center; }
.go-cat[aria-pressed="true"] { box-shadow: var(--sh-3); transform: translateY(-4px); }
.go-cat img { width: 96px; height: 104px; object-fit: contain; }
.go-cat b { font-family: var(--f-display); font-weight: 800; font-size: 15.5px; line-height: 1.2; }
.go-cat span { font-size: 12px; line-height: 1.35; color: var(--ink-3); }

.go-term { margin: 4px var(--gutter) 0; border: 2.5px solid var(--ink); border-radius: 20px; background: #fff; box-shadow: var(--sh-3); padding: 14px 16px; }
.go-term__k { font-size: 11.5px; font-weight: 800; letter-spacing: .1em; color: var(--link); }
.go-term__row { margin-top: 8px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.go-term__jp { font-family: var(--f-jp); font-weight: 700; font-size: 28px; line-height: 1.15; overflow-wrap: anywhere; }
.go-term__roma { font-size: 13px; color: var(--ink-3); margin-top: 2px; }
.go-term__btn { flex: none; font-weight: 800; font-size: 13.5px; padding: 10px 14px; border-radius: 12px; border: 2px solid var(--ink); background: var(--yellow); color: var(--ink); }
.go-term__btn.is-flash { background: var(--green); color: #fff; }
.go-term__hint { margin-top: 8px; font-size: 12.5px; line-height: 1.45; color: var(--ink-3); }

/* ── 14. Referidos ────────────────────────────────────────── */
.go-refer { --card-bg: var(--yellow-soft); --kicker: #8A6400; margin-top: 42px; border-radius: 24px; padding: 20px 18px; overflow: hidden; }
/* La mascota «flota» a la derecha: el texto la rodea y debajo usa todo el ancho */
.go-refer__img { float: right; width: 104px; height: 124px; margin: -12px -14px 4px 8px; object-fit: contain; animation: aiBob 3.8s ease-in-out infinite; }
.go-refer h2 { margin-top: 6px; font-size: 25px; line-height: 1.15; }
.go-refer__p { margin-top: 10px; font-size: 14.5px; line-height: 1.5; color: #3B2E00; }
.go-refer__block { clear: both; }
.go-refer__cta { margin-top: 16px; gap: 10px; padding: 14px; border-radius: var(--r-md); font-size: 16px; font-weight: 700; }
.go-refer__note { margin-top: 10px; font-size: 12.5px; line-height: 1.45; text-align: center; color: #5C4300; }
.go-refer__note b { white-space: nowrap; }

.go-code { margin-top: 16px; display: flex; align-items: center; gap: 10px; background: #fff; border: 2.5px dashed var(--ink); border-radius: 16px; padding: 10px 10px 10px 14px; }
.go-code__k { font-size: 11px; font-weight: 800; letter-spacing: .1em; color: #8A6400; }
.go-code__v { font-family: var(--f-display); font-weight: 800; font-size: 26px; letter-spacing: .06em; line-height: 1.1; overflow-wrap: anywhere; }
.go-code__link { margin-top: 2px; font-size: 12px; font-weight: 600; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.go-code__btn { flex: none; font-weight: 800; font-size: 14px; padding: 11px 14px; border-radius: 12px; border: 0; background: var(--ink); color: #fff; }
.go-code__btn.is-flash { background: var(--green); }
.go-share { margin-top: 10px; display: flex; gap: 8px; }
/* Verde WhatsApp con texto tinta (blanco sobre este verde no alcanza el contraste mínimo) */
.go-wa { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; justify-content: center; gap: 10px; background: #25D366; color: var(--ink); border: 2.5px solid var(--ink); box-shadow: var(--sh-2); font-weight: 800; font-size: 15.5px; padding: 13px; border-radius: var(--r-md); text-decoration: none; }
.go-wa:hover { color: var(--ink); }
.go-wa svg { flex: none; }
.go-share__more { flex: none; width: 54px; display: flex; align-items: center; justify-content: center; border: 2.5px solid var(--ink); border-radius: var(--r-md); background: #fff; box-shadow: var(--sh-2); color: var(--ink); }
.go-refer__stats { margin-top: 12px; gap: 8px; }
.go-refer__stat { background: rgba(255, 255, 255, .75); border-radius: var(--r-md); padding: 10px; text-align: center; }
.go-refer__stat b { display: block; font-family: var(--f-display); font-weight: 800; font-size: 22px; }
.go-refer__stat span { font-size: 12px; font-weight: 600; color: #5C4300; }
.go-refer__steps { clear: both; margin: 14px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; font-size: 13px; line-height: 1.4; color: #3B2E00; }
.go-refer__steps li { display: flex; gap: 8px; }
.go-refer__steps i { flex: none; width: 20px; height: 20px; border-radius: 50%; background: var(--ink); color: var(--yellow); font-size: 11px; font-weight: 800; font-style: normal; display: flex; align-items: center; justify-content: center; }

/* ── 15. Aiyunboxing y reseñas ────────────────────────────── */
.go-more { margin-top: 30px; gap: 12px; }
.go-more__card { display: flex; flex-direction: column; gap: 8px; padding: 14px 14px 16px; border: 2.5px solid var(--ink); border-radius: 20px; background: #fff; box-shadow: var(--sh-3); text-decoration: none; color: var(--ink); }
.go-more__card:hover { color: var(--ink); }
.go-more__card img { width: 70px; height: 78px; object-fit: contain; }
.go-more__ico { width: 70px; height: 78px; display: flex; align-items: center; justify-content: flex-start; }
.go-more__t { font-family: var(--f-display); font-weight: 800; font-size: 17px; line-height: 1.2; }
.go-more__d { font-size: 13px; line-height: 1.4; color: var(--ink-3); }
.go-more__go { margin-top: auto; font-size: 13px; font-weight: 700; color: var(--link); }

/* ── 16. Preguntas frecuentes (usa .acc de components.css) ── */
.go-faq { margin-top: 42px; }
.go-faq .title-row > img { width: 70px; height: 96px; margin-bottom: -8px; }
.go-faq__list .acc { margin-top: 12px; }
.go-faq__list .acc > button { font-family: var(--f-text); color: var(--ink); }

/* ── 17. Redes ────────────────────────────────────────────── */
.go-social { margin-top: 42px; }
.go-social .title-row > img { width: 76px; height: 92px; }
.go-social__list { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
.go-social__row { display: flex; align-items: center; gap: 14px; padding: 13px 16px; border: 2.5px solid var(--ink); border-radius: var(--r-lg); background: #fff; box-shadow: var(--sh-2); text-decoration: none; color: var(--ink); }
.go-social__row:hover { color: var(--ink); }
.go-social__row > svg:first-child { flex: none; }
.go-social__txt { flex-grow: 1; min-width: 0; display: flex; flex-direction: column; }
.go-social__txt b { font-weight: 700; font-size: 16px; }
.go-social__txt span { font-size: 13px; color: var(--ink-3); }
.go-social__go { flex: none; }
.go-social__web { flex: none; width: 34px; height: 34px; border-radius: var(--r-sm); background: var(--sky); border: 2px solid var(--ink); display: flex; align-items: center; justify-content: center; }

/* ── 18. Pie de página ────────────────────────────────────── */
.go-footer { margin: 46px var(--gutter) 0; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.go-footer__hi { display: flex; align-items: flex-start; }
.go-footer__hi img { flex: none; width: 104px; height: 112px; object-fit: contain; animation: aiFloat 6s ease-in-out infinite; }
.go-footer__bubble { margin: 4px 0 0 -12px; white-space: nowrap; font-family: var(--f-display); font-weight: 800; font-size: 13px; padding: 6px 10px; border-radius: var(--r-md); background: #fff; border: 2px solid var(--ink); box-shadow: var(--sh-1); }
.go-footer__name { font-family: var(--f-display); font-weight: 800; font-size: 16px; }
.go-footer__info { font-size: 13px; color: var(--ink-3); }
.go-footer__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; font-size: 13px; font-weight: 600; }

/* ── 19. Pantallas chicas y escritorio ────────────────────── */
@media (max-width: 359px) {
  .go-header { padding: 12px 14px; }
  .go-header__logo img { width: 128px; height: 26px; }
  .go-hero { padding: 16px 14px 20px; }
  .go-flight__plane { width: 160px; height: 192px; margin-left: -80px; top: 40px; }
  .go-hero__title:not(.is-hello) { font-size: min(42px, calc((100vw - 62px) / 8.2)); }
  .go-hero__title.is-hello { font-size: 30px; }
  .go-rotator { font-size: 16px; gap: 5px; }
  .go-tile__txt { font-size: 11px; }
  .go-ticket__main { padding-left: 16px; }
  .go-ticket__side { width: 92px; }
  .go-ticket__notch { right: 81px; }
  .go-coupon__foot { flex-wrap: wrap; }
  .go-calc { padding: 16px 14px; }
  .go-calc__title { font-size: 16px; }
  .go-calc__total output { font-size: 24px; }
  .go-h2 { font-size: 25px; }
}
/* En escritorio la página es una columna centrada con aire arriba */
@media (min-width: 720px) {
  .go-page { padding-top: 18px; }
}

/* ── 20. Movimiento reducido ──────────────────────────────── */
/* base.css ya acorta todas las animaciones; aquí se apagan del todo para que
   cada pieza quede quieta en su posición natural (cinta al inicio, barra al 72 %). */
@media (prefers-reduced-motion: reduce) {
  .go-page *, .go-page *::before, .go-page *::after { animation: none !important; }
  .go-lift:hover, .go-lift:active { transform: none; }
}
