.example-intro{display:grid;grid-template-columns:minmax(0,1fr) 240px;align-items:end;gap:32px;margin:36px 0 40px}
.example-intro h1{max-width:24ch;margin:0 0 20px;font-size:clamp(30px,4vw,48px);line-height:1.04}
.example-meta{margin:0;color:var(--ink,#103879);font-weight:700}
.example-hint{margin:0;line-height:1.55;font-size:15px;color:#426687}
.example-grid{--example-columns:4;display:grid;grid-template-columns:repeat(var(--example-columns),minmax(0,1fr));gap:16px;align-items:start}
.example-grid.is-masonry{display:block;position:relative}
.example-grid.is-masonry>.example-tile{position:absolute;top:0;left:0;width:var(--masonry-tile-width)}
.example-tile{position:relative;min-width:0}
.example-photo{position:relative;display:block;width:100%;padding:0;border:0;border-radius:20px;overflow:hidden;aspect-ratio:var(--photo-ratio);background:linear-gradient(135deg,#e9faff,#fff5ed);cursor:zoom-in;transition:transform .18s ease}
.example-photo img{display:block;width:100%;height:auto;object-fit:contain}
.example-videos{display:grid;gap:24px;margin:0 0 40px;max-width:1000px}
.example-video-player{width:100%;aspect-ratio:16/9;border:0;border-radius:20px;background:#e9faff;display:block}
.example-video-link{display:inline-block;margin-top:10px;color:#103879;font-size:14px}
.example-photo:active{transform:scale(.985)}
.example-photo:focus-visible,.example-retry:focus-visible{outline:3px solid #079dc5;outline-offset:4px}
.example-photo-number{position:absolute;bottom:10px;right:10px;padding:4px 9px;border-radius:12px;background:#fff;color:#103879;font-size:12px;font-weight:800;pointer-events:none}
.example-image-error{position:absolute;inset:0;align-items:center;justify-content:center;padding:24px;color:#103879;font-size:14px}
.example-image-error:not([hidden]){display:flex}
.example-retry{display:block;margin:10px auto 0;padding:9px 14px;border:0;border-radius:12px;background:#fff0e1;color:#103879;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.example-retry[hidden]{display:none}
.example-gallery-status:not([hidden]){margin:0 0 20px;padding:16px 20px;border-radius:16px;background:#e9faff;color:#103879}
.example-cta{margin:72px 0 28px;padding:36px;border-radius:28px;background:#fff6ec}
.example-cta h2{margin:0 0 16px;line-height:1.06}
.example-cta p{margin:0 0 24px}
@media(max-width:900px){.example-grid{--example-columns:3}.example-intro{grid-template-columns:1fr;gap:18px}.example-hint{max-width:44ch}}
@media(max-width:600px){.example-grid{--example-columns:2;gap:10px}.example-photo,.example-video-player{border-radius:14px}.example-intro{margin:24px 0 28px;gap:14px}.example-intro h1{font-size:30px;line-height:1.06}.example-cta{margin-top:44px;padding:24px}.example-photo-number{bottom:7px;right:7px}.example-hint{font-size:14px}.example-videos{margin-bottom:28px}}
@media(prefers-reduced-motion:reduce){.example-photo{transition:none}}
