/* Safo Sepulcro — home v3 "Marco editorial" (estilo h7). Se carga encima de safo.css + safo-v2.css */

/* ---------- HERO v3: vídeo enmarcado + marca grande ---------- */
.hero-v3{position:relative;min-height:100svh;display:grid;place-items:center;overflow:hidden;background:#010302;isolation:isolate}
.hero-v3 .frame{position:absolute;inset:7vh 6vw;z-index:0;overflow:hidden;border:1px solid rgba(240,107,39,.35);opacity:0;animation:v3fade 1.4s ease .2s forwards}
.hero-v3 .frame video{width:100%;height:100%;object-fit:cover;display:block}
.hero-v3 .frame:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(1,3,2,.35),rgba(1,3,2,.15) 45%,rgba(1,3,2,.55))}
.hero-v3 .corner{position:absolute;z-index:3;font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:rgba(239,232,218,.55);opacity:0;animation:v3fade 1.2s ease 1.5s forwards}
.hero-v3 .c-tl{top:calc(7vh + 16px);left:calc(6vw + 18px)}
.hero-v3 .c-tr{top:calc(7vh + 16px);right:calc(6vw + 18px);text-align:right}
.hero-v3 .c-bl{bottom:calc(7vh + 16px);left:calc(6vw + 18px)}
.hero-v3 .c-br{bottom:calc(7vh + 16px);right:calc(6vw + 18px);text-align:right}
.hero-v3 .corner b{display:block;color:var(--ember);font-weight:700}
.hero-v3 .wrap{position:relative;z-index:4;text-align:center;padding:0 4vw}
.hero-v3 h1.seo-title{margin:0 0 18px;font-size:11px;letter-spacing:.58em;text-transform:uppercase;color:var(--ember);font-family:Inter,sans-serif;font-weight:700;opacity:0;animation:v3fade 1.2s ease .35s forwards;text-shadow:0 2px 16px #000}
.hero-v3 .brand-title{font-family:Cinzel,serif;font-weight:900;text-transform:uppercase;font-size:min(9.8vw,142px);line-height:.86;margin:0;letter-spacing:-.035em;text-shadow:0 10px 60px rgba(1,3,2,.9)}
.hero-v3 .brand-title .l{display:block;overflow:visible}
.hero-v3 .brand-title .l span{display:block;transform:translateY(112%);animation:v3rise 1.2s cubic-bezier(.16,1,.3,1) forwards}
.hero-v3 .brand-title .l1 span{animation-delay:.5s}
.hero-v3 .brand-title .l2{color:transparent;-webkit-text-stroke:1.4px rgba(239,232,218,.85)}
.hero-v3 .brand-title .l2 span{animation-delay:.66s}
.hero-v3 .hero-sub{max-width:480px;margin:3.5vh auto 0;color:#e3dbcc;font-size:clamp(14px,1.4vw,17px);line-height:1.75;opacity:0;animation:v3fade 1.2s ease 1.2s forwards;text-shadow:0 2px 16px #000}
.hero-v3 .hero-cta{margin-top:3.5vh;display:flex;gap:12px;justify-content:center;flex-wrap:wrap;opacity:0;animation:v3fade 1.2s ease 1.4s forwards}
.hero-v3 .btn{backdrop-filter:blur(4px)}
.hero-v3 .btn.primary{box-shadow:0 0 40px rgba(240,107,39,.4)}
@keyframes v3rise{to{transform:translateY(0)}}
@keyframes v3fade{to{opacity:1}}

/* ---------- Toques editoriales para el resto (estilo h7) ---------- */
main section.sec, main section.pf2, main section.final{position:relative}
.lead-block .kicker, .final .kicker, .hannya .kicker{display:inline-flex;align-items:center;gap:14px}
.lead-block .kicker:before, .final .kicker:before, .hannya .kicker:before{content:"";width:44px;height:1px;background:var(--ember)}
/* hairline de sección tipo marco */
.edge-sec{border-top:1px solid rgba(240,107,39,.16)}
/* índice editorial en cabeceras de sección */
.sec-num{font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:rgba(239,232,218,.4);margin-bottom:10px}
.sec-num b{color:var(--ember);font-weight:700}

/* ---------- Móvil (mismas garantías que h7) ---------- */
@media(max-width:700px){
  .hero-v3{min-height:100dvh;min-height:100svh;place-items:center;padding:76px 18px 34px;overflow:hidden}
  .hero-v3 .frame{inset:0;border:0;opacity:.95}
  .hero-v3 .frame video{object-position:center center;filter:brightness(.82) contrast(1.05)}
  .hero-v3 .frame:after{background:linear-gradient(to bottom,rgba(1,3,2,.72),rgba(1,3,2,.18) 35%,rgba(1,3,2,.42) 62%,rgba(1,3,2,.84))}
  .hero-v3 .corner{display:none}
  .hero-v3 .wrap{width:100%;max-width:360px;padding:0;text-align:center;margin:0 auto}
  .hero-v3 h1.seo-title{font-size:10px;line-height:1.4;letter-spacing:.24em;margin:0 0 12px;overflow-wrap:anywhere}
  .hero-v3 .brand-title{font-size:clamp(42px,15.5vw,62px);line-height:.9;letter-spacing:-.045em;max-width:100%}
  .hero-v3 .hero-sub{margin:22px auto 0;max-width:310px;font-size:14px;line-height:1.55}
  .hero-v3 .hero-cta{margin-top:22px;gap:9px}
  .hero-v3 .btn{padding:13px 20px;font-size:11px;width:min(100%,260px)}
}
@media(max-height:620px) and (max-width:700px){
  .hero-v3{padding-top:58px;padding-bottom:22px}
  .hero-v3 h1.seo-title{margin-bottom:8px;font-size:9px}
  .hero-v3 .brand-title{font-size:clamp(36px,13vw,50px)}
  .hero-v3 .hero-sub{margin-top:14px;font-size:13px;line-height:1.45}
  .hero-v3 .hero-cta{margin-top:14px}
  .hero-v3 .btn{padding:11px 18px}
}
