/* Strona kamer — style ograniczone do tego komponentu. */
.vds-cameras { --camera-ink:#081b3d; --camera-muted:#536680; --camera-line:#d9e3ec; --camera-accent:#fe4158; color:var(--camera-ink); background:#fff; font-family:var(--vds-font-family,Inter,Arial,sans-serif); font-weight:400; overflow-wrap:anywhere; }
.vds-cameras,.vds-cameras * { box-sizing:border-box; }
.vds-cameras [hidden] { display:none!important; }
.vds-cameras__container { width:min(calc(100% - 3rem),90rem); margin-inline:auto; }
.vds-cameras__icon { display:block; width:1.4rem; height:1.4rem; flex:0 0 auto; }
.vds-cameras__hero { position:relative; isolation:isolate; display:grid; align-items:center; min-height:clamp(340px,30vw,490px); overflow:hidden; color:#fff; background:#123c5d; border-radius:0 0 50% 50% / 0 0 6% 6%; }
.vds-cameras__hero::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(7,36,61,.94),rgba(7,36,61,.7) 42%,rgba(7,36,61,.12) 82%); pointer-events:none; }
.vds-cameras__hero-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.vds-cameras__hero-content { padding-block:2rem 4rem; }
.vds-cameras__breadcrumbs { margin-bottom:2rem; font-size:.78rem; line-height:1.5; }
.vds-cameras__breadcrumbs ol { display:flex; flex-wrap:wrap; gap:.7rem 1rem; margin:0; padding:0; list-style:none; }
.vds-cameras__breadcrumbs li,.vds-cameras__breadcrumbs a { display:flex; align-items:center; gap:.6rem; }
.vds-cameras__breadcrumbs li+li::before { content:'›'; margin-right:.4rem; }
.vds-cameras__breadcrumbs a { color:#fff; text-decoration:none; }
.vds-cameras__breadcrumbs .vds-cameras__icon { width:1rem; height:1rem; }
.vds-cameras h1 { max-width:23ch; margin:0; color:inherit; font-size:clamp(2.5rem,4.2vw,4.5rem); font-weight:300; line-height:1.05; letter-spacing:-.04em; }
.vds-cameras__subtitle { max-width:55ch; margin:1.2rem 0 0; color:#fff; font-size:clamp(1rem,1.4vw,1.25rem); line-height:1.6; }
.vds-cameras__eyebrow { display:flex; align-items:center; gap:.8rem; margin:0 0 1rem; font-size:.67rem; font-weight:500; line-height:1.5; letter-spacing:.13em; text-transform:uppercase; }
.vds-cameras__eyebrow::before { content:''; flex:0 0 2rem; height:2px; background:var(--camera-accent); }
.vds-cameras__section { padding-block:clamp(2rem,3.5vw,3.5rem); }
.vds-cameras__heading { margin:0 0 1rem; color:inherit; font-size:clamp(1.8rem,2.8vw,3rem); font-weight:300; line-height:1.1; letter-spacing:-.04em; }
.vds-cameras__description { color:var(--camera-muted); font-size:.98rem; line-height:1.7; }
.vds-cameras__description p { margin:0 0 1rem; }
.vds-cameras__description p:last-child { margin-bottom:0; }
.vds-cameras__description h3 { margin:1.7rem 0 .7rem; color:var(--camera-ink); font-size:1.25rem; line-height:1.3; font-weight:500; letter-spacing:-.025em; }
.vds-cameras__description a { color:#b7253d; text-underline-offset:.2em; }
.vds-cameras__features { padding-block:1.7rem; background:linear-gradient(110deg,#fff,#f1f7fb); }
.vds-cameras__features ul { display:grid; grid-template-columns:repeat(var(--camera-feature-columns,4),minmax(0,1fr)); gap:1.5rem; margin:0; padding:0; list-style:none; }
.vds-cameras__features li { display:flex; align-items:center; justify-content:center; gap:1rem; padding:.5rem 1rem; font-size:.85rem; line-height:1.5; }
.vds-cameras__features li+li { border-left:1px solid var(--camera-line); }
.vds-cameras__features .vds-cameras__icon { width:2rem; height:2rem; color:#163f6b; }
.vds-cameras__features a { color:inherit; text-underline-offset:.2em; }
.vds-cameras__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; margin-top:2rem; }
.vds-cameras__card { min-width:0; overflow:hidden; border:1px solid var(--camera-line); border-radius:9px; background:#fff; box-shadow:0 5px 20px rgba(8,27,61,.035); }
.vds-cameras__media { position:relative; aspect-ratio:16/10; overflow:hidden; background:linear-gradient(140deg,#e6eff7,#d9e7f3); }
.vds-cameras__preview,.vds-cameras__media iframe { display:block; width:100%; height:100%; margin:0; border:0; }
.vds-cameras__preview { object-fit:cover; }
.vds-cameras__media iframe { position:absolute; inset:0; background:#0b213a; }
.vds-cameras__placeholder { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.8rem; height:100%; padding:1rem; color:#355b7c; font-size:.85rem; text-align:center; }
.vds-cameras__placeholder>.vds-cameras__icon { width:2.7rem; height:2.7rem; }
.vds-cameras .vds-cameras__play { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; width:100%; height:100%; margin:0; padding:0; border:0; border-radius:0; background:linear-gradient(0deg,rgba(8,27,61,.12),transparent); color:#fff; cursor:pointer; }
.vds-cameras__play>.vds-cameras__icon { width:3.8rem; height:3.8rem; padding:.9rem; border:2px solid rgba(255,255,255,.95); border-radius:50%; background:rgba(8,27,61,.6); transition:background .15s ease,transform .15s ease; }
.vds-cameras__play:hover>.vds-cameras__icon { background:#d82a44; transform:scale(1.06); }
.vds-cameras .vds-cameras__play:focus-visible { outline:3px solid #fff; outline-offset:-6px; }
.vds-cameras__card-copy { padding:1.25rem; }
.vds-cameras__region { margin:0 0 .45rem; color:#64778b; font-size:.73rem; line-height:1.4; }
.vds-cameras__card h3 { margin:0 0 .6rem; color:var(--camera-ink); font-size:1.2rem; font-weight:500; line-height:1.3; letter-spacing:-.025em; }
.vds-cameras__location { margin:0 0 .75rem; color:var(--camera-muted); font-size:.8rem; line-height:1.5; }
.vds-cameras__card .vds-cameras__description { font-size:.83rem; }
.vds-cameras__image-note { margin:.9rem 0 0; color:#64778b; font-size:.72rem; line-height:1.5; }
.vds-cameras__card-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.8rem; margin-top:1rem; padding-top:.9rem; border-top:1px solid var(--camera-line); }
.vds-cameras__card-actions a { display:inline-flex; align-items:center; gap:.5rem; color:#b7253d; font-size:.8rem; text-decoration:none; }
.vds-cameras__card-actions .vds-cameras__icon { width:1rem; height:1rem; }
.vds-cameras .vds-cameras__card-actions button { margin:0; padding:.35rem 0; border:0; border-radius:0; background:transparent; color:var(--camera-muted); font:inherit; font-size:.76rem; line-height:1.5; text-transform:none; letter-spacing:normal; cursor:pointer; text-decoration:underline; text-underline-offset:.2em; }
.vds-cameras__player-status { margin:.75rem 0 0; color:var(--camera-muted); font-size:.76rem; line-height:1.5; }
.vds-cameras__player-status:empty { display:none; }
.vds-cameras__source-note { margin-top:1.3rem; }
.vds-cameras__source-note .vds-cameras__description { font-size:.78rem; }
.vds-cameras__notice { margin:2rem 0; padding:1.2rem; background:#f0f5fa; border-radius:5px; font-size:.95rem; line-height:1.6; }
.vds-cameras__intro { padding-top:1rem; }
.vds-cameras__intro-grid { display:grid; gap:clamp(2rem,4vw,4rem); align-items:center; }
.vds-cameras__intro-grid--with-image { grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); }
.vds-cameras__intro-copy { min-width:0; }
.vds-cameras__intro .vds-cameras__description { max-width:85ch; }
.vds-cameras__intro-grid--with-image .vds-cameras__description { max-width:none; }
.vds-cameras__intro-media { min-width:0; overflow:hidden; border-radius:0; background:transparent; aspect-ratio:1/1; }
.vds-cameras__intro-image { display:block; width:100%; height:100%; object-fit:cover; object-position:center 62%; -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 90%,transparent); mask-image:linear-gradient(90deg,transparent,#000 12%,#000 90%,transparent); }
@media(max-width:1000px) {
    .vds-cameras__intro-grid--with-image { grid-template-columns:minmax(0,1fr); }
    .vds-cameras__intro-media { aspect-ratio:16/9; max-height:420px; }
}
.vds-cameras__tips { padding-top:1rem; }
.vds-cameras__tips-panel { padding:clamp(1.3rem,3vw,2rem); border-radius:8px; background:linear-gradient(110deg,#edf6ff,#f4f8fc); }
.vds-cameras__tips-panel>.vds-cameras__heading { margin-bottom:1.6rem; font-size:1.6rem; }
.vds-cameras__tips-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.6rem 2.5rem; }
.vds-cameras__tips-grid>article { display:flex; align-items:flex-start; gap:1rem; min-width:0; }
.vds-cameras__tips-grid>article>.vds-cameras__icon { color:#267eaf; }
.vds-cameras__tips-grid h3 { margin:0 0 .5rem; font-size:1rem; font-weight:500; line-height:1.4; }
.vds-cameras__tips-grid .vds-cameras__description { font-size:.87rem; }
.vds-cameras__faq { padding-top:1rem; }
.vds-cameras__faq-list { display:grid; gap:.6rem; margin-top:1.5rem; }
.vds-cameras__faq details { border:1px solid var(--camera-line); border-radius:5px; background:#fff; }
.vds-cameras__faq summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.1rem 1.2rem; cursor:pointer; list-style:none; font-size:.95rem; line-height:1.5; }
.vds-cameras__faq summary::-webkit-details-marker { display:none; }
.vds-cameras__faq summary>.vds-cameras__icon { width:1rem; height:1rem; color:var(--camera-accent); transition:transform .15s ease; }
.vds-cameras__faq details[open] summary { background:#f7f9fc; }
.vds-cameras__faq details[open] summary>.vds-cameras__icon { transform:rotate(180deg); }
.vds-cameras__faq details>.vds-cameras__description { padding:1rem 1.2rem 1.2rem; font-size:.9rem; }
.vds-cameras__cta { position:relative; isolation:isolate; overflow:hidden; margin-top:1.5rem; padding-block:clamp(3rem,5vw,5rem); background:#102f4c; color:#fff; border-radius:50% 50% 0 0 / 5% 5% 0 0; }
.vds-cameras__cta::after { content:''; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,rgba(7,28,48,.94),rgba(7,28,48,.72) 60%,rgba(7,28,48,.42)); pointer-events:none; }
.vds-cameras__cta-image { position:absolute; z-index:-2; inset:0; width:100%; height:100%; object-fit:cover; }
.vds-cameras__cta-copy { max-width:58rem; }
.vds-cameras__cta .vds-cameras__description { max-width:68ch; color:#fff; }
.vds-cameras__cta-links { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.8rem; }
.vds-cameras .vds-cameras__button { display:inline-flex; align-items:center; justify-content:space-between; gap:1.5rem; min-height:3.1rem; padding:.9rem 1.25rem; border:1px solid var(--camera-accent); border-radius:2px; background:var(--camera-accent); color:#fff; font-size:.8rem; font-weight:500; line-height:1.4; text-decoration:none; transition:background .15s ease,border-color .15s ease; }
.vds-cameras .vds-cameras__button:hover { background:#dc2943; border-color:#dc2943; }
.vds-cameras .vds-cameras__button--outline { border-color:rgba(255,255,255,.8); background:transparent; }
.vds-cameras .vds-cameras__button--outline:hover { border-color:#fff; background:rgba(255,255,255,.12); }
.vds-cameras__button>.vds-cameras__icon { width:1.1rem; height:1.1rem; }
.vds-cameras a:focus-visible,.vds-cameras button:focus-visible,.vds-cameras summary:focus-visible { outline:2px solid var(--camera-accent); outline-offset:4px; }
.vds-cameras__cta a:focus-visible { outline-color:#fff; }
@media(max-width:1000px) {
    .vds-cameras__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .vds-cameras__features ul { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .vds-cameras__features li:nth-child(3) { border-left:0; }
    .vds-cameras__features li { justify-content:flex-start; }
}
@media(max-width:700px) {
    .vds-cameras__container { width:calc(100% - 2rem); }
    .vds-cameras__hero { min-height:360px; }
    .vds-cameras__hero-content { padding-block:1.5rem 3rem; }
    .vds-cameras__breadcrumbs { margin-bottom:1.5rem; }
    .vds-cameras h1 { font-size:2.4rem; }
    .vds-cameras__grid,.vds-cameras__tips-grid { grid-template-columns:minmax(0,1fr); }
    .vds-cameras__features ul { gap:.6rem; }
    .vds-cameras__features li { gap:.7rem; padding:.5rem; font-size:.72rem; }
    .vds-cameras__features .vds-cameras__icon { width:1.7rem; height:1.7rem; }
    .vds-cameras__cta-links { flex-direction:column; align-items:stretch; }
}
@media(prefers-reduced-motion:reduce) { .vds-cameras * { transition:none!important; } }
