/* Safo Sepulcro — menú fullscreen (móvil). Vanilla, paleta brasa. */

/* Botón hamburguesa / cerrar — solo móvil */
.menu-toggle{
  display:none;
  position:fixed;top:16px;right:16px;z-index:210;
  align-items:center;gap:10px;
  background:rgba(2,5,4,.55);backdrop-filter:blur(8px);
  border:1px solid rgba(240,107,39,.35);border-radius:100px;
  padding:10px 16px 10px 18px;color:var(--ink);cursor:pointer;
  font-family:Inter,system-ui,sans-serif;font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;line-height:1;
  -webkit-tap-highlight-color:transparent;transition:border-color .3s,background .3s;
}
.menu-toggle:active{transform:scale(.97)}
.menu-toggle .mt-label{overflow:hidden;height:12px;display:inline-block;position:relative;min-width:44px;text-align:left}
.menu-toggle .mt-label b{display:block;font-weight:600;transition:transform .5s cubic-bezier(.65,.01,.05,.99)}
.menu-toggle .mt-label b + b{position:absolute;top:0;left:0;transform:translateY(120%)}
.smenu-open .menu-toggle .mt-label b{transform:translateY(-120%)}
.smenu-open .menu-toggle .mt-label b + b{transform:translateY(0)}
.menu-toggle .mt-ico{position:relative;width:15px;height:15px;color:var(--ember);transition:transform .55s cubic-bezier(.65,.01,.05,.99)}
.smenu-open .menu-toggle .mt-ico{transform:rotate(315deg)}
.menu-toggle .mt-ico:before,.menu-toggle .mt-ico:after{content:"";position:absolute;background:currentColor}
.menu-toggle .mt-ico:before{top:7px;left:0;width:15px;height:1.6px}
.menu-toggle .mt-ico:after{left:7px;top:0;width:1.6px;height:15px}

/* Overlay fullscreen */
.smenu{
  position:fixed;inset:0;z-index:200;display:block;
  visibility:hidden;pointer-events:none;
}
.smenu .smenu-scrim{
  position:absolute;inset:0;background:rgba(1,3,2,.4);
  opacity:0;transition:opacity .5s ease;
}
.smenu-open .smenu .smenu-scrim{opacity:1}

/* Paneles que entran deslizando (3 capas de profundidad) */
.smenu-panel{
  position:absolute;inset:0;transform:translateX(101%);
  transition:transform .62s cubic-bezier(.65,.01,.05,.99);
}
.smenu-panel.p1{background:#0a0605;transition-delay:0s}
.smenu-panel.p2{background:#100907;transition-delay:.06s}
.smenu-panel.p3{
  background:
    radial-gradient(circle at 82% 12%,rgba(240,107,39,.20),transparent 46%),
    radial-gradient(circle at 12% 88%,rgba(157,23,18,.22),transparent 44%),
    #060302;
  transition-delay:.12s;
}
.smenu-open .smenu-panel{transform:translateX(0)}

/* Formas ambientales (brasa) */
.smenu-shapes{position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .8s ease .25s}
.smenu-open .smenu-shapes{opacity:1}
.smenu-shapes span{position:absolute;border-radius:50%;filter:blur(2px);animation:smFloat 9s ease-in-out infinite}
.smenu-shapes .s1{width:180px;height:180px;top:-40px;right:-30px;background:radial-gradient(circle,rgba(240,107,39,.18),transparent 70%)}
.smenu-shapes .s2{width:240px;height:240px;bottom:-70px;left:-50px;background:radial-gradient(circle,rgba(157,23,18,.20),transparent 70%);animation-delay:-3s}
.smenu-shapes .s3{width:90px;height:90px;top:30%;left:12%;background:radial-gradient(circle,rgba(135,170,164,.10),transparent 70%);animation-delay:-5s}
.smenu-shapes .s4{width:60px;height:60px;bottom:26%;right:16%;background:radial-gradient(circle,rgba(240,107,39,.22),transparent 70%);animation-delay:-1.5s}
@keyframes smFloat{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(14px,-18px) scale(1.08)}}

/* Contenido del menú */
.smenu-inner{
  position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;
  justify-content:center;padding:96px 34px 40px;
}
.smenu-eyebrow{
  color:var(--ember);font-size:10px;letter-spacing:.4em;text-transform:uppercase;
  margin-bottom:24px;opacity:0;transform:translateY(12px);
  transition:opacity .5s ease .3s,transform .5s ease .3s;
}
.smenu-open .smenu-eyebrow{opacity:1;transform:none}
.smenu-list{list-style:none;margin:0;padding:0}
.smenu-list li{overflow:hidden}
.smenu-list a{
  display:block;font-family:Cinzel,serif;font-weight:800;text-transform:uppercase;
  font-size:clamp(30px,10vw,46px);line-height:1.28;color:var(--ink);
  text-decoration:none;letter-spacing:.01em;
  transform:translateY(115%) rotate(6deg);opacity:0;
  transition:transform .6s cubic-bezier(.65,.01,.05,.99),opacity .6s ease,color .25s;
}
.smenu-list a:active{color:var(--ember)}
.smenu-open .smenu-list a{transform:none;opacity:1}
/* cascada */
.smenu-open .smenu-list li:nth-child(1) a{transition-delay:.30s}
.smenu-open .smenu-list li:nth-child(2) a{transition-delay:.36s}
.smenu-open .smenu-list li:nth-child(3) a{transition-delay:.42s}
.smenu-open .smenu-list li:nth-child(4) a{transition-delay:.48s}
.smenu-open .smenu-list li:nth-child(5) a{transition-delay:.54s}
.smenu-open .smenu-list li:nth-child(6) a{transition-delay:.60s}
.smenu-list a .idx{
  font-family:Inter,sans-serif;font-size:12px;font-weight:500;color:var(--ember);
  vertical-align:super;margin-right:12px;letter-spacing:0;
}

.smenu-foot{
  margin-top:auto;display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  padding-top:28px;border-top:1px solid rgba(239,232,218,.12);
  opacity:0;transform:translateY(12px);
  transition:opacity .5s ease .55s,transform .5s ease .55s;
}
.smenu-open .smenu-foot{opacity:1;transform:none}
.smenu-foot a{color:var(--muted);font-size:12px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none}
.smenu-foot a:active{color:var(--ember)}
.smenu-foot .smenu-lang{border:1px solid var(--line);border-radius:100px;padding:7px 14px;color:var(--ink)}

/* Activación por breakpoint: móvil/tablet muestra botón + oculta nav inline */
@media(max-width:920px){
  .menu-toggle{display:flex}
  .top nav{display:none !important}
}
/* Bloquear scroll del body con el menú abierto */
body.smenu-locked{overflow:hidden}
@media(prefers-reduced-motion:reduce){
  .smenu-panel,.smenu-list a,.smenu-eyebrow,.smenu-foot,.smenu .smenu-scrim{transition-duration:.001s}
  .smenu-shapes span{animation:none}
}
