/* Home aprobado: recursos y composición propios. Navegación en css/dm-sitio.css. */
*{box-sizing:border-box}body{margin:0;background:#0D2366;color:#fff;font-family:'Figtree',Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}
main{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:125px 4vw 30px}
.letters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2%;width:min(100%,1200px,calc((100svh - 280px)*2.04));flex:none;margin:auto}.letter{position:relative;width:100%;aspect-ratio:1/1}.letter video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:48% center;display:block}.letter.d{clip-path:url(#dclip)}.letter.m{clip-path:url(#mclip)}.letter.m video{object-position:56% center}
.caption{position:static;width:100%;padding-top:32px;flex:none;display:flex;justify-content:space-between;align-items:end;gap:25px}.caption p{margin:0}.caption .tag{font-family:'Outfit',sans-serif;font-size:clamp(18px,2.3vw,32px);font-weight:500;letter-spacing:.03em;line-height:1.3}
.dm-play{display:inline-flex;align-items:center;gap:10px;flex:none;white-space:nowrap;background:none;border:0;padding:0;color:#fff;min-height:44px;font-size:13px}.dm-play-circle{display:grid;place-items:center;width:44px;height:44px;border:1px solid #ffffff80;border-radius:50%;transition:color .2s,border-color .2s}.dm-play svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5}.dm-play-icon{display:none}.dm-play[data-paused=true] .dm-play-icon{display:block}.dm-play[data-paused=true] .dm-pause-icon{display:none}.dm-play:hover .dm-play-circle{color:#FF4D52;border-color:#FF4D52}.dm-play:focus-visible{outline:2px solid #FF4D52;outline-offset:6px}
@media(max-width:600px){main{padding:105px 6vw 26px;min-height:100svh}.letters{width:100%;margin:auto 0}.caption{align-items:flex-start;flex-direction:column;gap:22px;padding-top:36px}.caption .tag{font-size:20px;max-width:300px;line-height:1.25}}
@media(min-width:601px) and (max-height:500px){main{min-height:500px}.letters{width:min(65%,600px)}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}