/* Service maps, demonstrations and image viewer — Arselor brand surfaces. */
.service-media{padding-block:76px;background:var(--pale);border-block:1px solid var(--line)}
.service-media .section-heading{align-items:flex-start;margin-bottom:1.1rem}
.service-media .section-heading h2{max-width:960px;font-size:clamp(1.85rem,3vw,2.75rem)}
.sm-intro{max-width:920px;color:var(--muted);margin-bottom:2rem;font-size:1.02rem}
.sm-layout{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(270px,1fr);gap:1.6rem;align-items:start}
.sm-video-card{min-width:0;background:var(--surface,#fff);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.sm-player{position:relative;aspect-ratio:16/9;background:#fff;isolation:isolate;container-type:inline-size}
.sm-video-launch{position:absolute;inset:0;display:block;background:#07162c;color:#fff;overflow:hidden}
.sm-video-launch:focus-visible{outline:3px solid var(--red);outline-offset:-5px}
.vc-link{position:absolute;inset:0;display:block;aspect-ratio:auto;color:#fff;text-decoration:none;background:#07162c;overflow:hidden}
.vc-cover{position:absolute;inset:0;display:block;background:radial-gradient(ellipse at 65% 32%,#29445d,#0c1c30 65%);color:#fff;isolation:isolate}
.vc-image{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center 43%;transition:transform .4s ease}
.vc-shade{position:absolute;inset:0;background:linear-gradient(180deg,#06132430,transparent 29%,transparent 49%,#041020e8 100%)}
.vc-top{position:absolute;inset-block-start:4cqi;inset-inline:4cqi;display:flex;align-items:flex-start;justify-content:space-between;gap:3cqi}
.vc-vendors{display:flex;align-items:center;gap:1.5cqi;max-width:64%;height:clamp(29px,7cqi,52px);padding:1.3cqi 1.8cqi;border-radius:8px;background:#fff;box-shadow:0 3px 12px #0002}
.vc-vendor{display:flex;align-items:center;gap:1cqi;height:100%;min-width:0}
.vc-vendor>img{display:block;width:auto;height:100%;max-width:23cqi;object-fit:contain}
.vc-vendor-fortinet>img{width:23cqi}
.vc-vendor-azure>img,.vc-vendor-whatsapp>img{width:auto;aspect-ratio:1}
.vc-vendor-azure strong{font-size:clamp(13px,2.5cqi,20px);color:#20354e}
.vc-vendor-dark{background:#07162c;border-radius:4px;padding:2px 5px}
.vc-arselor{display:block;width:clamp(66px,14cqi,108px);height:auto;object-fit:contain;filter:drop-shadow(0 2px 5px #0004)}
.vc-play{position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);width:clamp(56px,12cqi,88px);height:clamp(42px,8.5cqi,64px);display:grid;place-items:center;border-radius:clamp(12px,2cqi,17px);background:#c5162e;box-shadow:0 6px 28px #0005;border:1px solid #ffffff33;transition:background .2s,transform .2s}
.vc-play svg{width:40%;height:55%;fill:#fff;margin-left:3px}
.vc-bottom{position:absolute;inset-inline:4.5cqi;inset-block-end:4cqi;display:flex;align-items:flex-end;justify-content:space-between;gap:3cqi}
.vc-title{display:block;color:#fff;font-size:clamp(19px,4.7cqi,38px);font-weight:750;line-height:1.12;letter-spacing:-.025em;max-width:69%;text-wrap:balance;text-shadow:0 2px 15px #0006}
[dir=rtl] .vc-title{letter-spacing:0;line-height:1.4;font-size:clamp(18px,4.3cqi,35px)}
.vc-watch{font-size:clamp(10px,1.7cqi,13px);line-height:1.4;font-weight:600;color:#fff;white-space:nowrap;padding-bottom:.3cqi}
.vc-link:hover .vc-image{transform:scale(1.035)}
.vc-link:hover .vc-play{background:#e11a36;transform:translate(-50%,-50%) scale(1.07)}
.vc-link:focus-visible{outline:3px solid #e7334b;outline-offset:-5px}
.vc-original .vc-image{object-position:center}
@container(max-width:450px){.vc-bottom{display:block}.vc-title{max-width:90%;font-size:clamp(18px,5.8cqi,26px)}.vc-watch{display:block;margin-top:1.3cqi;font-size:10px}.vc-vendors{height:30px;padding:5px 7px}.vc-vendor>img{max-width:26cqi}.vc-vendor-fortinet>img{width:26cqi}.vc-arselor{width:66px}.vc-play{top:45%}}
@media(prefers-reduced-motion:reduce){.vc-image,.vc-play{transition:none}.vc-link:hover .vc-image{transform:none}.vc-link:hover .vc-play{transform:translate(-50%,-50%)}}
.sm-meta{padding:1.2rem 1.35rem}
.sm-meta-top{display:flex;justify-content:space-between;gap:.8rem;align-items:center;flex-wrap:wrap;margin-bottom:.55rem}
.sm-meta-top>span{font-size:.8rem;font-weight:750;color:var(--accent-ink,var(--red))}
.sm-meta .text-link{font-size:.8rem;padding:0}
.sm-meta p{font-size:.8rem;color:var(--muted);margin:0;line-height:1.65}
.sm-gallery{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;min-width:0}
.sm-gallery-heading{grid-column:1/-1;margin:0;font-size:1.1rem;letter-spacing:-.02em}
.sm-gallery-hint{grid-column:1/-1;color:var(--muted);font-size:.81rem;margin:0 0 .35rem}
.sm-still{margin:0;border:1px solid var(--line);border-radius:12px;background:var(--surface,#fff);overflow:hidden;min-width:0;display:flex;flex-direction:column}
.sm-still a{display:block;aspect-ratio:4/3;background:#fff;position:relative;cursor:zoom-in}
.sm-still img{width:100%;height:100%;object-fit:contain;padding:8px}
.sm-still a:after{content:"+";position:absolute;bottom:8px;inset-inline-end:8px;width:27px;height:27px;border-radius:50%;background:#07162c;color:#fff;text-align:center;line-height:27px;font-size:20px;box-shadow:0 2px 10px #0002}
.sm-still figcaption{font-size:.75rem;line-height:1.5;padding:.8rem;color:var(--ink);border-top:1px solid var(--line)}
.sm-still:hover,.sm-still:focus-within{border-color:var(--card-hover,var(--red))}
.sm-gallery>.sm-next{grid-column:1/-1;margin-top:.35rem;padding:1.1rem 0 0;border-top:1px solid var(--line)}
.sm-next p{font-size:.88rem;color:var(--muted);margin:0 0 .7rem}
.sm-next .text-link{font-size:.86rem;line-height:1.5}
.sm-service-map{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,4vw,4rem);align-items:start}
.sm-map-visual{min-width:0}
.sm-map-visual>.sm-still a{aspect-ratio:3/2;background:linear-gradient(145deg,#f9fbfd,#e8edf3)}
.sm-map-visual>.sm-still img{padding:clamp(12px,2vw,24px)}
.sm-map-visual>.sm-still figcaption{font-size:.79rem;padding:.7rem 1rem}
.sm-map-visual>.sm-gallery-hint{font-size:.76rem;margin:.7rem 0 0}
.sm-map-contact{padding:1.5rem 0 0;margin-top:1.5rem;border-top:1px solid var(--line)}
.sm-map-contact h3{font-size:1.14rem;margin:0 0 .85rem;color:var(--ink)}
.sm-map-contact>.text-link{display:block;width:fit-content;font-size:.9rem;line-height:1.55;margin:.5rem 0}
.sm-map-direct{display:flex;gap:.3rem 1rem;flex-wrap:wrap;margin-top:1rem;color:var(--muted);font-size:.82rem}
.sm-map-direct a:hover{color:var(--accent-ink,var(--red));text-decoration:underline}
.sm-map-tree{min-width:0}
.sm-tree-root{display:flex;align-items:center;gap:1.1rem;padding:1.4rem;border-radius:15px;background:#07162c;border:1px solid #34465f;color:#fff;position:relative}
.sm-tree-root img{width:108px;height:auto;max-height:58px;object-fit:contain;flex-shrink:0;padding:7px;background:#fff;border-radius:8px}
.sm-tree-root span{font-size:.65rem;letter-spacing:.1em;font-weight:700;color:#cbd7e7}
.sm-tree-root h3{font-size:clamp(1.05rem,1.4vw,1.35rem);letter-spacing:-.015em;line-height:1.35;margin:.35rem 0 0;color:#fff}
.sm-tree-hint{font-size:.8rem;color:var(--muted);margin:1rem 0 .8rem;padding-inline-start:1.7rem}
.sm-tree-branches{list-style:none;padding:0 0 0 0;margin:0;position:relative}
.sm-tree-branches:before{content:"";position:absolute;top:0;bottom:32px;inset-inline-start:0;width:2px;background:var(--line)}
.sm-tree-branch{position:relative;padding-inline-start:1.7rem;margin:0 0 .9rem}
.sm-tree-branch:before{content:"";position:absolute;top:31px;inset-inline-start:0;width:1.7rem;height:2px;background:var(--line)}
.sm-tree-branch:after{content:"";position:absolute;top:28px;inset-inline-start:-3px;width:8px;height:8px;background:var(--red);border-radius:50%}
.sm-tree-branch details{border:1px solid var(--line);background:var(--surface,#fff);border-radius:12px;overflow:hidden}
.sm-tree-branch details[open]{border-color:var(--card-hover,var(--red));box-shadow:0 6px 24px #07162c08}
.sm-tree-branch summary{display:flex;align-items:center;gap:.8rem;list-style:none;cursor:pointer;padding:1rem 1.1rem;color:var(--ink);font-size:1rem;line-height:1.4;font-weight:750;min-height:64px}
.sm-tree-branch summary::-webkit-details-marker{display:none}
.sm-tree-branch summary:focus-visible{outline:3px solid var(--red);outline-offset:-4px;border-radius:10px}
.sm-branch-number{font-size:.75rem;color:var(--accent-ink,var(--red));font-variant-numeric:tabular-nums;font-weight:750}
.sm-branch-toggle{margin-inline-start:auto;flex-shrink:0;display:grid;place-items:center;width:25px;height:25px;border:1px solid var(--line);border-radius:50%;font-weight:500;font-size:1.1rem;color:var(--muted)}
.sm-branch-toggle:before{content:"+"}.sm-tree-branch details[open] .sm-branch-toggle:before{content:"−"}
.sm-branch-content{padding:0 1.1rem 1.1rem}
.sm-branch-content p{margin:0 0 .9rem;font-size:.88rem;line-height:1.7;color:var(--muted)}
.sm-branch-content ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.sm-branch-content li{font-size:.83rem;line-height:1.5;color:var(--ink);display:flex;align-items:flex-start;gap:.6rem}
.sm-branch-content li:before{content:"";width:5px;height:5px;flex-shrink:0;margin-top:.45rem;border-radius:50%;background:var(--red)}
.sm-map-scope{font-size:.76rem;color:var(--muted);padding-inline-start:1.7rem;margin:.9rem 0 0;line-height:1.65}
.sm-lightbox{width:min(1240px,calc(100vw - 32px));max-width:none;height:auto;max-height:calc(100dvh - 32px);padding:0;border:1px solid #536177;border-radius:16px;background:#07162c;color:#fff;box-shadow:0 25px 100px #0007;overflow:auto}
.sm-lightbox::backdrop{background:#030b18df;backdrop-filter:blur(6px)}
.sm-lightbox-head{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.8rem 1rem}
.sm-lightbox-head h2{font-size:1rem;letter-spacing:0;margin:0;color:#fff}
.sm-lightbox-close,.sm-lightbox-nav button{height:44px;min-width:44px;border:1px solid #536177;border-radius:8px;background:#14263d;color:white;font-size:1.25rem;flex-shrink:0}
.sm-lightbox figure{margin:0}.sm-lightbox-image{width:100%;height:min(65dvh,720px);background:#fff;object-fit:contain;padding:12px}
.sm-lightbox figcaption{padding:1rem 1.3rem;font-size:.9rem;line-height:1.6;color:#d3deed}
.sm-lightbox-nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0 1.3rem 1rem;flex-wrap:wrap}
.sm-lightbox-nav a{font-size:.85rem;text-decoration:underline;color:#fff;text-underline-offset:4px}
.sm-lightbox-controls{display:flex;align-items:center;gap:.8rem;direction:ltr}
.sm-lightbox-count{min-width:50px;text-align:center;font-size:.82rem}
html.sm-viewer-open{overflow:hidden}
.product-image-stage[data-media-image]{cursor:zoom-in}
@media(max-width:1000px){.sm-layout{grid-template-columns:minmax(0,1.5fr) minmax(240px,1fr)}.sm-gallery{gap:.6rem}.sm-meta-top{align-items:flex-start}.sm-gallery>.sm-next{padding-top:.8rem}}
@media(max-width:760px){.service-media{padding-block:50px}.sm-layout{grid-template-columns:1fr;gap:1.6rem}.sm-gallery{gap:.9rem}.sm-gallery>.sm-next{margin-top:.4rem}.sm-still a{aspect-ratio:16/10}.sm-play{width:60px;height:60px}.sm-meta{padding:1rem}.sm-transcript{padding-inline:1rem}.sm-lightbox-image{height:55dvh}.sm-lightbox-head{padding:.6rem .8rem}.sm-lightbox figcaption{padding:.8rem}.sm-lightbox-nav{padding:0 .8rem .8rem}.sm-intro{font-size:.95rem}}
@media(max-width:760px){.sm-service-map{grid-template-columns:1fr;gap:2rem}.sm-map-tree{grid-row:1}.sm-tree-root{padding:1rem;gap:.8rem}.sm-tree-root img{width:83px;padding:5px}.sm-tree-root h3{font-size:1.05rem}.sm-tree-root span{font-size:.58rem;letter-spacing:.06em}.sm-tree-branch{padding-inline-start:1.1rem}.sm-tree-branch:before{width:1.1rem}.sm-tree-branch summary{padding:1rem .85rem;font-size:.95rem;gap:.6rem}.sm-branch-content{padding-inline:.85rem}.sm-tree-hint,.sm-map-scope{padding-inline-start:1.1rem}.sm-map-visual>.sm-still a{max-height:340px}.sm-language{top:.6rem;inset-inline-end:.6rem;font-size:.65rem}.sm-play-label{font-size:.78rem;bottom:.8rem;inset-inline-start:.8rem}}