/* yt-facade: privacy-friendly YouTube embed. No request to YouTube until the visitor clicks play.
   Markup: see yt-facade.mjs (ytFacade) and YT-FACADE.md. Reuse: link this file + yt-facade.js on any page. */
.ytf{margin:18px 0;max-width:760px}
.ytf-btn{position:relative;display:block;width:100%;aspect-ratio:16/9;padding:0;border:1px solid rgba(255,255,255,.12);border-radius:12px;overflow:hidden;background:#0b0d10;cursor:pointer;color:#fff}
.ytf-btn img,.ytf-btn iframe{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover;display:block}
.ytf-play{position:absolute;left:50%;top:50%;width:68px;height:68px;margin:-34px 0 0 -34px;border-radius:50%;background:rgba(8,9,10,.72);border:2px solid #fff;display:grid;place-items:center;transition:transform .15s,background .15s}
.ytf-play svg{width:28px;height:28px;margin-left:4px;fill:#fff}
.ytf-btn:hover .ytf-play{transform:scale(1.08);background:rgba(8,9,10,.9)}
.ytf-btn:focus-visible{outline:3px solid var(--sec-accent,#3df29a);outline-offset:3px}
.ytf.is-on .ytf-btn{cursor:default}
.ytf figcaption{margin-top:8px;font-size:14px}
.ytf-link{color:inherit;text-decoration:underline;text-underline-offset:3px}
@media (prefers-reduced-motion:reduce){.ytf-play{transition:none}}
.hub-video{margin:20px 0}
.hub-video p{margin:0 0 6px}
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;list-style:none;margin:24px 0;padding:0}
.vcard h3{margin:10px 0 4px}
.vcard p{margin:4px 0}
.vcard .ytf{margin:0}

/* ---- service pages: full width + attention animation + lightbox (Shachar 20.10) ---- */
@property --ytf-a{syntax:'<angle>';inherits:false;initial-value:0deg}
.ytf{max-width:none;margin:18px 0 0}
.ytf-btn{overflow:visible;isolation:isolate;border-radius:14px}
.ytf-btn img{border-radius:14px;z-index:1;transition:transform .8s ease}
.ytf-btn::before{content:"";position:absolute;inset:-2px;z-index:0;border-radius:16px;background:conic-gradient(from var(--ytf-a),#3df29a,#5aa9ff,#b36bff,#3df29a);opacity:.5;filter:blur(7px)}
.ytf-btn::after{content:"";position:absolute;inset:0;z-index:2;border-radius:14px;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.16) 50%,transparent 65%);background-size:250% 100%;background-position:130% 0;opacity:0}
.ytf-play{z-index:3}
.ytf-play::before,.ytf-play::after{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid rgba(255,255,255,.7);opacity:0}
.ytf.is-live .ytf-btn:not(:hover):not(:focus-visible)::before{animation:ytf-spin 7s linear infinite}
.ytf.is-live .ytf-btn:not(:hover):not(:focus-visible)::after{animation:ytf-shine 6s ease-in-out infinite}
.ytf.is-live .ytf-btn:not(:hover):not(:focus-visible) .ytf-play::before{animation:ytf-ring 2.6s ease-out infinite}
.ytf.is-live .ytf-btn:not(:hover):not(:focus-visible) .ytf-play::after{animation:ytf-ring 2.6s ease-out 1.3s infinite}
.ytf-btn:hover img,.ytf-btn:focus-visible img{transform:scale(1.025)}
@keyframes ytf-spin{to{--ytf-a:360deg}}
@keyframes ytf-ring{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.9);opacity:0}}
@keyframes ytf-shine{0%,70%{background-position:130% 0;opacity:0}75%{opacity:1}100%{background-position:-30% 0;opacity:0}}
@media (prefers-reduced-motion:reduce){.ytf .ytf-btn::before,.ytf .ytf-btn::after,.ytf .ytf-play::before,.ytf .ytf-play::after{animation:none!important}.ytf-btn img{transition:none}.ytf-btn:hover img,.ytf-btn:focus-visible img{transform:none}}
html.ytl-lock{overflow:hidden}
.ytl{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center}
.ytl-bg{position:absolute;inset:0;background:rgba(3,4,6,.88);backdrop-filter:blur(3px)}
.ytl-box{position:relative;width:100%;display:grid;place-items:center;padding:56px 16px 16px}
.ytl-frame{width:min(1280px,calc(100vw - 32px),calc((100vh - 96px) * 16 / 9));aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#000;box-shadow:0 20px 80px rgba(0,0,0,.6)}
.ytl-frame iframe{display:block;width:100%;height:100%;border:0}
.ytl-x{position:absolute;top:10px;right:14px;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(8,9,10,.7);color:#fff;cursor:pointer}
.ytl-x:hover{background:rgba(255,255,255,.16)}
.ytl-x:focus-visible{outline:3px solid #3df29a;outline-offset:2px}
@media (max-width:640px){.ytl-box{padding:56px 0 0}.ytl-frame{width:100vw;border-radius:0}}
.ytl-sent{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0}
.yt-more{margin-top:36px}
.yt-more h3{margin:0 0 4px}
.yt-more-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;list-style:none;margin:12px 0 0;padding:0}
.yt-more-card h4{margin:0 0 6px;font-size:1.05em}
.yt-more-card p{margin:0 0 4px}
.yt-more-card .ytf{margin:10px 0 0}
.yt-more-link{margin-top:10px!important}
.yt-more-link a{text-decoration:underline;text-underline-offset:3px}
@media (max-width:760px){.yt-more-grid{grid-template-columns:1fr}}