/* MYKENOS landing · tokens y estilos del handoff v3 (pixel-perfect) */
html, body { margin: 0; padding: 0; background: #0a0a11; color: #e9e2d0; }
body { font-family: system-ui, 'Segoe UI', sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: #d4a843; text-decoration: none; }
a:hover { color: #e8c46a; }
::selection { background: #d4a843; color: #0a0a11; }
html { scroll-behavior: smooth; }

@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes glowPulse { 0%, 100% { opacity: .55; transform: scale(1); } 50% { opacity: 1; transform: scale(1.08); } }
@keyframes floatY { 0%, 100% { transform: rotate(-4deg) translateY(0); } 50% { transform: rotate(-4deg) translateY(-14px); } }
@keyframes heroIn { from { opacity: 0; transform: translateY(60px) rotate(-4deg); } to { opacity: 1; transform: translateY(0) rotate(-4deg); } }

.greca {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2028'%3E%3Crect%20x%3D'1'%20y%3D'0'%20width%3D'24'%20height%3D'2'%20fill%3D'%23d4a843'%2F%3E%3Crect%20x%3D'1'%20y%3D'26'%20width%3D'24'%20height%3D'2'%20fill%3D'%23d4a843'%2F%3E%3Cpath%20fill%3D'none'%20stroke%3D'%23d4a843'%20stroke-width%3D'2.4'%20d%3D'M25%2024%20H3%20V4%20H25%20V17%20H10.5%20V10.5%20H18%20V14'%2F%3E%3C%2Fsvg%3E");
  background-repeat: repeat-x;
}

.rv { opacity: 0; transform: translateY(28px); transition: opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1); }
.rv.in { opacity: 1; transform: none; }

.snapx { scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: #d4a84344 transparent; }
.snapx::-webkit-scrollbar { height: 6px; }
.snapx::-webkit-scrollbar-thumb { background: #d4a84333; border-radius: 99px; }

/* ---------- NAVBAR ---------- */
.nav { position: sticky; top: 0; z-index: 50; background: rgba(10,10,17,.82); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid rgba(255,255,255,.06); }
.nav-inner { max-width: 1140px; margin: 0 auto; padding: 12px 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.brand { display: flex; align-items: center; gap: 11px; color: #e9e2d0; }
.brand:hover { color: #fff; }
.brand-tile { width: 34px; height: 34px; border-radius: 9px; background-color: #151020; background-size: auto 12px; background-position: center; border: 1px solid rgba(212,168,67,.4); box-shadow: inset 0 0 14px rgba(212,168,67,.18); }
.brand-m { width: 34px; height: 34px; border-radius: 9px; display: block; }
.wordmark { font-family: 'Oswald', sans-serif; font-weight: 600; font-size: 19px; letter-spacing: .14em; }
.wordmark b { color: #d4a843; font-weight: 600; }
.nav-right { display: flex; align-items: center; gap: 20px; }
.nav-links { display: none; gap: 22px; font-size: 13.5px; font-weight: 500; }
.nav-links a { color: #b9b2a0; }
.nav-links a:hover { color: #d4a843; }
@media (min-width: 760px) { .nav-links { display: flex; } }
.lang-pills { display: inline-flex; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.08); border-radius: 999px; padding: 3px; gap: 2px; }
.lang-btn { border: none; cursor: pointer; padding: 5px 13px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: .06em; background: transparent; color: #b9b2a0; font-family: inherit; }
.lang-btn.active { background: #d4a843; color: #0a0a11; }

/* ---------- HERO ---------- */
.hero { position: relative; overflow: hidden; }
.hero-glow { position: absolute; top: -180px; right: -140px; width: 560px; height: 560px; border-radius: 50%; background: radial-gradient(circle, rgba(212,168,67,.22), transparent 65%); filter: blur(40px); animation: glowPulse 7s ease-in-out infinite; pointer-events: none; }
.hero-grid { max-width: 1140px; margin: 0 auto; padding: clamp(56px,9vh,110px) 20px clamp(56px,9vh,100px); display: grid; grid-template-columns: repeat(auto-fit, minmax(300px,1fr)); gap: 48px; align-items: center; position: relative; }
.hero-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; }
.badge { display: inline-flex; align-items: center; gap: 8px; border: 1px solid rgba(212,168,67,.45); border-radius: 999px; padding: 7px 15px; font-size: 12px; font-weight: 700; letter-spacing: .12em; color: #d4a843; text-transform: uppercase; }
.hero h1 { margin: 0; font-family: 'Oswald', sans-serif; font-weight: 700; font-size: clamp(40px,6vw,68px); line-height: 1.04; letter-spacing: .015em; color: #f2ecda; text-transform: uppercase; }
.tagline { color: #d4a843; font-weight: 600; font-size: .62em; letter-spacing: .03em; }
.hero-sub { margin: 0; font-size: 16.5px; line-height: 1.65; color: #b9b2a0; max-width: 46ch; text-wrap: pretty; }
.cta { display: inline-flex; align-items: center; gap: 10px; padding: 15px 30px; min-height: 44px; box-sizing: border-box; background: #d4a843; color: #0a0a11; font-family: 'Oswald', sans-serif; font-weight: 600; font-size: 15.5px; letter-spacing: .1em; text-transform: uppercase; border-radius: 13px; box-shadow: 0 8px 28px rgba(212,168,67,.35); transition: transform .25s, box-shadow .25s, background .25s; white-space: nowrap; }
.cta:hover { background: #e8c46a; color: #0a0a11; transform: translateY(-2px); box-shadow: 0 14px 38px rgba(212,168,67,.45); }

.cred-wrap { display: flex; justify-content: center; padding: 24px 0; }
.cred { width: min(330px, 88%); background: linear-gradient(160deg, #16121f, #0e0e17); border: 1px solid rgba(212,168,67,.4); border-radius: 20px; padding: 22px; box-shadow: 0 26px 60px rgba(0,0,0,.55); animation: heroIn 1.1s cubic-bezier(.16,1,.3,1) both, floatY 7s ease-in-out 1.1s infinite; }
.cred-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.cred-title { font-family: 'Oswald', sans-serif; font-weight: 600; font-size: 14px; letter-spacing: .22em; color: #d4a843; text-transform: uppercase; }
.cred-greca { width: 52px; height: 8px; background-size: auto 8px; opacity: .8; }
.cred-id { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.cred-avatar { width: 54px; height: 54px; border-radius: 14px; background: rgba(212,168,67,.12); border: 1px solid rgba(212,168,67,.35); display: flex; align-items: center; justify-content: center; font-family: 'Oswald', sans-serif; font-weight: 700; color: #d4a843; font-size: 16px; }
.cred-lines { display: flex; flex-direction: column; gap: 5px; }
.sk1 { width: 130px; height: 11px; border-radius: 4px; background: rgba(255,255,255,.14); }
.sk2 { width: 90px; height: 9px; border-radius: 4px; background: rgba(255,255,255,.08); }
.cred-feats { display: flex; flex-direction: column; gap: 9px; }
.feat { display: flex; align-items: center; gap: 9px; font-size: 13px; color: #b9b2a0; }
.feat.dim { color: #8f8878; }
.dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.dot.green { background: #5fae46; }
.dot.orange { background: #ff6b35; }

/* ---------- SECCIONES ---------- */
.kicker { font-family: 'Oswald', sans-serif; font-size: 12.5px; font-weight: 700; letter-spacing: .14em; color: #d4a843; text-transform: uppercase; }
.mito { padding: clamp(56px,9vh,96px) 20px; border-top: 1px solid rgba(255,255,255,.06); }
.mito-inner { max-width: 660px; margin: 0 auto; display: flex; flex-direction: column; gap: 24px; text-align: center; }
.mito-p { margin: 0; font-family: 'Newsreader', Georgia, serif; font-size: clamp(19px,4vw,24px); line-height: 1.6; color: #e6dfcc; text-wrap: pretty; }
.mito-q { margin: 0; font-family: 'Newsreader', Georgia, serif; font-style: italic; font-size: clamp(17px,3.8vw,21px); line-height: 1.6; color: #d4a843; text-wrap: pretty; }

.greca-sep { display: flex; justify-content: center; padding: 8px 20px; }
.greca-sep svg { max-width: 80%; overflow: visible; }

.mapa { padding: clamp(48px,8vh,88px) 0; }
.mapa-inner { max-width: 1140px; margin: 0 auto; display: flex; flex-direction: column; gap: 30px; }
.mapa-head { text-align: center; display: flex; flex-direction: column; gap: 10px; padding: 0 20px; }
.mapa h2 { margin: 0; font-family: 'Oswald', sans-serif; font-weight: 600; font-size: clamp(28px,3.6vw,42px); letter-spacing: .02em; color: #f2ecda; text-transform: uppercase; }
.strip { display: flex; gap: 18px; overflow-x: auto; padding: 18px 20px 26px; }
.card { scroll-snap-align: center; flex: 0 0 280px; display: flex; flex-direction: column; gap: 14px; padding: 26px 24px 28px; border-radius: 21px; box-shadow: 0 26px 60px rgba(0,0,0,.55); transition: transform .3s cubic-bezier(.16,1,.3,1), border-color .3s; }
.card-live { background: linear-gradient(180deg, rgba(212,168,67,.08), rgba(255,255,255,.015)); border: 1px solid rgba(212,168,67,.4); color: inherit; }
.card-live:hover { transform: translateY(-10px) scale(1.02) !important; border-color: #d4a843; color: inherit; }
.card-soon { background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015)); border: 1px solid rgba(255,255,255,.08); }
.card-soon:hover { transform: translateY(-10px) scale(1.02) !important; border-color: rgba(212,168,67,.55); }
.card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.card-icon { width: 46px; height: 46px; border-radius: 13px; background: rgba(212,168,67,.1); display: flex; align-items: center; justify-content: center; font-size: 24px; color: #d4a843; }
.card-soon .card-icon { background: rgba(255,255,255,.05); color: #8f8878; opacity: .9; }
.badge-live { display: inline-flex; align-items: center; gap: 7px; font-family: 'Oswald', sans-serif; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: #5fae46; border: 1px solid rgba(95,174,70,.4); padding: 5px 11px; border-radius: 999px; }
.badge-live .dot-pulse { width: 7px; height: 7px; border-radius: 50%; background: #5fae46; animation: pulse 2s ease-in-out infinite; }
.badge-soon { font-family: 'Oswald', sans-serif; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: #ff6b35; border: 1px solid rgba(255,107,53,.4); padding: 5px 11px; border-radius: 999px; }
.card-name { font-family: 'Oswald', sans-serif; font-weight: 600; font-size: 22px; letter-spacing: .08em; text-transform: uppercase; }
.card-live .card-name { color: #d4a843; }
.card-soon .card-name { color: #9c9484; }
.card-desc { margin: 0; font-size: 14.5px; line-height: 1.65; text-wrap: pretty; }
.card-live .card-desc { color: #b9b2a0; }
.card-soon .card-desc { color: #8f8878; }
.card-link { margin-top: auto; font-family: 'Oswald', sans-serif; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: #5fae46; }

.valores { padding: clamp(48px,8vh,88px) 20px; }
.valores-inner { max-width: 1020px; margin: 0 auto; display: flex; flex-direction: column; gap: 32px; }
.valores .kicker { text-align: center; }
.val-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap: 20px; }
.val-card { display: flex; flex-direction: column; gap: 14px; padding: 26px 24px 30px; background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015)); border: 1px solid rgba(255,255,255,.08); border-radius: 21px; transition: transform .3s cubic-bezier(.16,1,.3,1), border-color .3s; }
.val-card:hover { transform: translateY(-6px); border-color: rgba(212,168,67,.55); }
.val-glyph { width: 46px; height: 46px; border-radius: 13px; background: rgba(212,168,67,.1); display: flex; align-items: center; justify-content: center; font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 19px; color: #d4a843; }
.val-title { font-family: 'Oswald', sans-serif; font-weight: 600; font-size: 19px; letter-spacing: .05em; color: #f2ecda; text-transform: uppercase; }
.val-desc { margin: 0; font-size: 14.5px; line-height: 1.65; color: #b9b2a0; text-wrap: pretty; }

/* ---------- FOOTER ---------- */
.footer { border-top: 1px solid rgba(255,255,255,.06); padding: 38px 20px 30px; }
.footer-inner { max-width: 1140px; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; }
.footer-brand { display: flex; align-items: center; gap: 12px; }
.footer-tile { display: inline-flex; width: 34px; height: 34px; border-radius: 9px; background-color: #151020; background-size: auto 12px; background-position: center; border: 1px solid rgba(212,168,67,.4); }
.footer-copy { font-size: 13.5px; color: #8f8878; }
.footer-nav { display: flex; gap: 22px; font-family: 'Oswald', sans-serif; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; }
.footer-nav a { color: #b9b2a0; }
.footer-nav a:hover { color: #d4a843; }
.footer-greca { height: 10px; background-size: auto 10px; opacity: .9; }

/* ---------- LEGALES ---------- */
.legal-main { max-width: 660px; margin: 0 auto; padding: clamp(48px,9vh,96px) 20px; display: flex; flex-direction: column; gap: 26px; }
.legal-main h1 { margin: 0; font-family: 'Oswald', sans-serif; font-weight: 600; font-size: clamp(28px,5vw,40px); letter-spacing: .04em; color: #f2ecda; text-transform: uppercase; }
.legal-block { display: flex; flex-direction: column; gap: 6px; }
.legal-lang { font-family: 'Oswald', sans-serif; font-size: 12px; font-weight: 700; letter-spacing: .14em; color: #d4a843; text-transform: uppercase; }
.legal-text { margin: 0; font-size: 15px; line-height: 1.65; color: #b9b2a0; }
.legal-back { font-family: 'Oswald', sans-serif; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; }

/* ---------- REDUCED MOTION ---------- */
@media (prefers-reduced-motion: reduce) {
  .hero-glow, .cred, .badge-live .dot-pulse { animation: none !important; }
  .cred { transform: rotate(-4deg); opacity: 1; }
  .rv { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
  svg[data-greca-draw] path { stroke-dasharray: none !important; stroke-dashoffset: 0 !important; transition: none !important; }
}