:root{--bg:#f5f5f5;--fg:#121212;--accent:#a0524d}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font-family:"Poppins",system-ui,sans-serif;font-weight:300}
a{color:inherit}
header{display:flex;justify-content:space-between;align-items:center;padding:20px 4vw}
header .name{font-size:22px;font-weight:400;text-decoration:none;letter-spacing:-.01em}
nav{display:flex;gap:22px;align-items:center;font-size:14px}
nav a{text-decoration:none;padding-bottom:2px;border-bottom:1px solid transparent}
nav a.on{border-color:var(--fg)}
nav svg{width:16px;height:16px;display:block}
main{padding:0 4vw 60px;max-width:1500px;margin:0 auto}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 24px;padding-top:20px}
.thumb{display:block;width:100%;aspect-ratio:1;border:0;padding:0;border-radius:18px;overflow:hidden;background:#121212;cursor:pointer;position:relative}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.card:not(.off) .thumb:hover img{transform:scale(1.03)}
.card.off .thumb{cursor:default}
.card.off .thumb img{opacity:.55}
.thumb .play{position:absolute;inset:0;display:grid;place-items:center}
.card.off .play{display:none}
.play i{width:54px;height:54px;border-radius:50%;background:rgba(0,0,0,.55);display:grid;place-items:center}
.play i:after{content:"";border-left:16px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;margin-left:4px}
.meta{display:flex;justify-content:space-between;gap:10px;margin-top:12px;font-size:14.5px;font-weight:600}
.meta a{font-size:12.5px;font-weight:500;border-bottom:1px solid var(--fg);text-decoration:none;white-space:nowrap}
.sub{font-size:12.5px;font-weight:500;margin-top:6px;opacity:.75}
.two{display:grid;grid-template-columns:1fr 1fr;gap:5vw;padding-top:30px;align-items:start}
.two p{font-size:21px;line-height:1.5;margin:0 0 18px}
.two img.photo{width:100%;display:block}
.sig{width:200px;margin-top:10px}
form label{display:block;font-size:13px;margin:16px 0 6px}
form label small{opacity:.6}
form input,form textarea{width:100%;font:inherit;font-size:15px;padding:10px;border:1px solid #555;background:transparent}
form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
form textarea{min-height:140px}
form .chk{display:flex;gap:8px;align-items:center;font-size:13px;margin-top:12px}
form .chk input{width:auto}
form button{margin-top:20px;background:var(--accent);color:#fff;border:0;padding:14px 26px;font:inherit;font-size:14px;cursor:pointer}
#modal{position:fixed;inset:0;background:rgba(0,0,0,.88);display:none;place-items:center;z-index:9}
#modal.open{display:grid}
.wrap{width:min(92vw,1100px);aspect-ratio:16/9;position:relative}
.wrap iframe{width:100%;height:100%;border:0}
#close{position:absolute;right:0;top:-40px;background:none;border:0;color:#fff;font-size:24px;cursor:pointer}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}.two{grid-template-columns:1fr}}
@media(max-width:560px){.grid{grid-template-columns:1fr}.two p{font-size:18px}form .row{grid-template-columns:1fr}}
