/* October model: five services, a consistent symbol system and two photo rows. */
header{width:90%;max-width:1200px;border:0;border-radius:0;padding:15px 0;gap:48px;height:100px;background:#000;box-shadow:none}header .brand{width:210px;height:75px}header nav{max-width:900px;padding:18px 28px;border-radius:7px;background:#000;border-color:#30343b}header nav a,header nav button{font-size:12px}
.ref-service-choice svg,.photo-label svg{stroke-width:1.8;stroke-linejoin:round}
.ref-service-choice .hex-icon{filter:none;color:#999;background:linear-gradient(150deg,#252628,#020304);border-radius:0}
.ref-service-choice.selected .hex-icon,.ref-service-choice:hover .hex-icon{color:var(--accent);background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 15%,#141518),#020304);filter:drop-shadow(0 0 4px color-mix(in srgb,var(--accent) 45%,transparent))}
header .mega .ref-service-row{grid-template-columns:repeat(5,minmax(0,1fr))}
#inicio .home-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:120px 120px;gap:10px;max-width:1230px;margin:0 auto 65px}
#inicio .photo-card.camera{grid-column:1/4;grid-row:1}
#inicio .photo-card.fire{grid-column:4/7;grid-row:1}
#inicio .photo-card.alarm{grid-column:1/3;grid-row:2}
#inicio .photo-card.fence{grid-column:3/5;grid-row:2}
#inicio .photo-card.access{grid-column:5/7;grid-row:2}
#inicio .photo-card{border:1px solid #59616b;border-radius:10px;transition:border-color .25s,box-shadow .25s;background:#090a0c}
#inicio .photo-label{inset:auto 22px 17px;gap:11px;font-size:12px;letter-spacing:1.1px;transition:font-size .25s}
#inicio .photo-label svg{color:var(--card-accent);width:34px;height:34px;min-width:34px;filter:none;transition:width .25s,height .25s}
#inicio .photo-card:hover,#inicio .photo-card:focus-visible{border-color:var(--card-accent);box-shadow:0 0 18px color-mix(in srgb,var(--card-accent) 45%,transparent)}
#inicio .photo-card:hover .photo-label,#inicio .photo-card:focus-visible .photo-label{font-size:16px}
#inicio .photo-card:hover .photo-label svg,#inicio .photo-card:focus-visible .photo-label svg{width:43px;height:43px}
#inicio .photo-card .crop{transform:none;transition:transform .6s}#inicio .photo-card:hover .crop{transform:scale(1.025)}
#inicio .home-trust{max-width:1230px;margin-top:0;background:radial-gradient(ellipse at 50% 110%,#0066cb99,transparent 46%),linear-gradient(0deg,#0b0e12,#000 70%)}
#inicio .trust-heading{padding:0 140px}.trust-heading h2{font-size:30px}.trust-heading p{font-size:17px}
#conocenos .trust-grid article:nth-child(1) svg{color:#16afe4}#conocenos .trust-grid article:nth-child(2) svg{color:#00dab0}#conocenos .trust-grid article:nth-child(3) svg{color:#ffca40}#conocenos .trust-grid article:nth-child(4) svg{color:#ff7545}
#conocenos .team-carousel-dots button{background:#f15a31}#conocenos .team-carousel-dots button[aria-pressed=true]{background:#ff8a5d}
.service-detail .ref-detail-top{margin-bottom:160px}.service-detail .ref-detail-top .ref-service-row{max-width:640px;gap:20px}
.service-detail .ref-detail-top .ref-service-choice .hex-icon{width:60px;height:70px;margin-bottom:9px}
.service-detail .ref-detail-top .ref-service-choice svg{width:32px;height:32px}.service-detail .ref-detail-top .ref-service-choice>span:last-child{font-size:9px;letter-spacing:.5px}
.service-detail .ref-detail-peak{top:280px;height:280px}.service-detail .service-hero h1{font-size:28px;letter-spacing:3px}.service-detail .service-main-photo img{aspect-ratio:2.3;object-position:center}
.service-detail .service-benefits{margin-top:45px;margin-bottom:45px}.service-detail .service-benefits article{padding:24px 20px;background:linear-gradient(115deg,color-mix(in srgb,var(--service-accent) 9%,#02050a),#02050a)}
.service-detail .primary{background:linear-gradient(100deg,var(--service-accent),color-mix(in srgb,var(--service-accent) 74%,#18191c));border:0;min-height:40px;font-size:12px}.service-detail .service-main-photo figcaption{font-size:10px}
.service-detail .ref-example-heading h2{font-size:24px}.service-detail .service-scope{padding-top:32px;border-top:1px solid #26303c}
#servicio-acceso .ref-application:nth-child(2) img{object-position:75% 50%}#servicio-acceso .ref-application:nth-child(3) img{object-position:65% 35%}#servicio-acceso .ref-application:nth-child(4) img{object-position:55% 70%}
#servicios .ref-service-choice[data-service=camaras]{--accent:#2389ff}#servicios .ref-service-choice[data-service=cercos]{--accent:#ffb323}#servicios .ref-service-choice[data-service=alarmas]{--accent:#ff753c}#servicios .ref-service-choice[data-service=incendios]{--accent:#ff3e45}#servicios .ref-service-choice[data-service=acceso]{--accent:#00bd91}
#proyectos .project-filter-label{max-width:1100px}#proyectos .work-filters{gap:18px;max-width:1200px;margin:25px auto 55px;flex-wrap:wrap}#proyectos .work-filters button{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:11px 18px;font-size:14px;background:#000;border-color:#303944}
#proyectos .work-filters button svg{width:25px;height:25px;color:var(--accent)}#proyectos .work-filters button[aria-pressed=true]{background:#242c32;border-color:#a1a8b3}#proyectos .work-filters button[aria-pressed=true] svg{color:#fff}
#proyectos .model2-project-strips{display:grid;grid-template-columns:1fr!important;gap:48px;max-width:none;margin:0 -5%;width:110%}
#proyectos .model2-project-track{display:flex;gap:20px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#253852 transparent;padding:8px 45px 20px;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);overscroll-behavior-inline:contain}
#proyectos .model2-project-track:focus-visible{outline:1px solid #297dd8;outline-offset:-2px}
#proyectos .model2-project-track .project-card{flex:0 0 clamp(210px,23vw,300px)}#proyectos .model2-project-track .project-photo{aspect-ratio:1.65}#proyectos .model2-project-track:nth-child(2){padding-left:130px}
#proyectos .model2-project-track .tag{color:#dce1e7;background:#000c;border:1px solid var(--accent);font-size:11px;padding:3px 18px;border-radius:6px}
#proyectos .model2-project-track .project-consult{border:0;color:var(--accent)}#proyectos .model2-project-track .project-card h2{font-size:16px}#proyectos .model2-project-track .project-card p{font-size:11px}
#proyectos.fence-selected{--project-accent:#a26a05}#proyectos.fence-selected .ref-fence-title .primary{background:#ffb323}#proyectos.fence-selected .work-filters button[data-work-filter=cercos]{background:#ffb323;color:#000}
#clientes .model2-clients{display:grid;grid-template-columns:repeat(8,1fr);gap:0;max-width:1200px;margin:0 auto 65px;padding:0 30px}
#clientes .model2-clients .client{height:110px;grid-column:span 2;opacity:.85;transform:none}
#clientes .model2-clients .client:nth-child(n+5){height:100px;grid-column:span 1;transform:translateX(50%)}
#clientes .model2-clients .client:nth-child(5){grid-column:1/2}#clientes .model2-clients .client:nth-child(6){grid-column:2/4}#clientes .model2-clients .client:nth-child(7){grid-column:4/5}#clientes .model2-clients .client:nth-child(8){grid-column:5/7}#clientes .model2-clients .client:nth-child(9){grid-column:7/8}
#clientes .model2-clients .client img{display:block;width:100%;height:100%;object-fit:contain;filter:grayscale(1);opacity:.9}
#clientes .model2-clients .client:hover img{opacity:1;filter:none}#clientes .ref-stories{gap:10px}#clientes .ref-story{background:#050a09}
#clientes .ref-featured-card{border-color:#287cbb;background:radial-gradient(ellipse at 75% 110%,#0061ba99,transparent 65%)}#clientes #featured-name{color:#e72170}#clientes .ref-featured-card .eyebrow{letter-spacing:2px}
.site-footer .footer-panel{background:linear-gradient(0deg,#111315,#000 80%);border-color:#303944}.site-footer .footer-identity{border-bottom:0}.site-footer .footer-tabs button{font-size:13px}.site-footer .footer-end{border-top:0}
@media(max-width:1100px){header{gap:25px}header nav{padding:18px;gap:15px}header nav a,header nav button{font-size:10px}header .brand{width:180px}#inicio .photo-label{font-size:10px;inset:auto 15px 15px}#inicio .photo-card:hover .photo-label{font-size:13px}#inicio .photo-label svg{width:30px;height:30px;min-width:30px}#inicio .trust-heading{padding:0}#inicio .home-trust>.button{position:static;margin-top:25px}}
@media(max-width:800px){header .brand{width:150px}header nav{gap:10px;padding:15px}header nav a,header nav button{font-size:9px}#inicio .home-grid{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:125px 125px}#inicio .photo-card.camera{grid-column:1/4;grid-row:1}#inicio .photo-card.fire{grid-column:4/7;grid-row:1}#inicio .photo-card.alarm{grid-column:1/3;grid-row:2}#inicio .photo-card.fence{grid-column:3/5;grid-row:2}#inicio .photo-card.access{grid-column:5/7;grid-row:2}#inicio .photo-label{font-size:9px;gap:7px;letter-spacing:.3px}#inicio .photo-label svg{width:26px;height:26px;min-width:26px}.service-detail .service-hero h1{font-size:25px}.service-detail .ref-detail-top .ref-service-row{gap:10px}.service-detail .ref-detail-peak{top:270px}#clientes .model2-clients{padding:0}#proyectos .work-filters{gap:10px}#proyectos .work-filters button{font-size:12px;padding:9px 13px}}
@media(max-width:600px){header{height:90px;max-width:none;width:90%}header .brand{width:170px;height:65px}header nav.mobile-open{font-size:15px;padding:20px}header nav.mobile-open a,header nav.mobile-open button{font-size:14px}header .mega .ref-service-row{grid-template-columns:repeat(3,minmax(0,1fr))}#inicio .intro{min-height:350px}#inicio .home-grid{grid-template-columns:1fr 1fr;grid-template-rows:150px 150px 150px;gap:9px;margin-bottom:45px}#inicio .photo-card.camera{grid-column:1;grid-row:1}#inicio .photo-card.fire{grid-column:2;grid-row:1}#inicio .photo-card.alarm{grid-column:1;grid-row:2}#inicio .photo-card.fence{grid-column:2;grid-row:2}#inicio .photo-card.access{grid-column:1/3;grid-row:3}#inicio .photo-label{font-size:10px;inset:auto 12px 14px}#inicio .photo-card:hover .photo-label{font-size:11px}#inicio .photo-card:hover .photo-label svg{width:30px;height:30px}.trust-heading h2{font-size:25px}.trust-heading p{font-size:14px}.service-detail .ref-detail-top .ref-service-row{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.service-detail .ref-detail-top .ref-service-choice .hex-icon{width:44px;height:52px}.service-detail .ref-detail-top .ref-service-choice svg{width:25px;height:25px}.service-detail .ref-detail-top .ref-service-choice>span:last-child{font-size:7px;letter-spacing:0}.service-detail .ref-detail-peak{top:245px;height:220px}.service-detail .ref-detail-top{margin-bottom:120px}.service-detail .ref-detail-top h2{font-size:20px}.service-detail .service-hero{gap:25px}.service-detail .service-main-photo img{aspect-ratio:1.8}.service-detail .ref-example-heading h2{font-size:21px}#clientes .model2-clients{grid-template-columns:repeat(6,1fr);gap:10px}#clientes .model2-clients .client,#clientes .model2-clients .client:nth-child(n+5){grid-column:span 2;transform:none;height:75px}#proyectos .model2-project-strips{width:110%;margin:0 -5%;gap:28px}#proyectos .model2-project-track{padding:8px 20px 20px;gap:15px}#proyectos .model2-project-track:nth-child(2){padding-left:60px}#proyectos .model2-project-track .project-card{flex-basis:220px}#proyectos .work-filters{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;padding-bottom:10px}#proyectos .work-filters button{flex-shrink:0}.site-footer .footer-identity h2{font-size:23px}}
@media(prefers-reduced-motion:reduce){#inicio .photo-card,#inicio .photo-label,#inicio .photo-label svg,#inicio .photo-card .crop{transition:none}}

#clientes .model2-video-library{max-width:1200px;margin:25px auto 45px;border:1px solid #29353f;border-radius:10px;padding:18px 24px;background:#05090e}#clientes .model2-video-library>summary{cursor:pointer;font-size:12px;letter-spacing:1.5px;color:#a4b8cc}#clientes .model2-video-library[open]>summary{margin-bottom:30px}#clientes .model2-video-library .client-stories,#clientes .model2-video-library .client-media{margin-bottom:25px}

/* Home image formats: top 1000 × 200; bottom 650 × 190. */
#inicio .home-grid{grid-template-rows:auto auto;align-items:start}
#inicio .photo-card{height:auto;min-height:0;aspect-ratio:650 / 190}
#inicio .photo-card.camera,#inicio .photo-card.fire{aspect-ratio:1000 / 200}
#inicio .photo-card.camera .crop{transform:none}
#inicio .photo-card.camera .crop img{position:static;display:block;width:100%;height:100%;max-width:100%;object-fit:cover;object-position:50% 15%}
@media(max-width:600px){
 #inicio .home-grid{grid-template-columns:1fr;grid-template-rows:repeat(5,auto)}
 #inicio .photo-card.camera,#inicio .photo-card.fire,#inicio .photo-card.alarm,#inicio .photo-card.fence,#inicio .photo-card.access{grid-column:1;grid-row:auto}
}

/* Uploaded photographs for the three Home services. */
#inicio .photo-card.camera .crop img{object-position:50% 49%}
#inicio .photo-card.fire .crop img,#inicio .photo-card.access .crop img{position:static;display:block;width:100%;height:100%;max-width:100%;object-fit:cover}
/* Fit the equipment within the existing banner sizes without stretching it. */
#inicio .photo-card.camera .crop,#inicio .photo-card.fire .crop,#inicio .photo-card.access .crop{background:#080b10;transform:none}
#inicio .photo-card.camera .crop img,#inicio .photo-card.fire .crop img,#inicio .photo-card.access .crop img{position:absolute;display:block;left:0;top:-50%;width:100%;height:200%;max-width:100%;object-fit:contain;object-position:85% 50%}
#inicio .photo-card.access .crop img{top:-15%;height:140%;object-position:90% 50%}
/* Extend each photograph's own tones across the complete banner. */
#inicio .photo-card.camera .crop:before,#inicio .photo-card.fire .crop:before{content:'';position:absolute;inset:-35px;background-size:cover;background-repeat:no-repeat;filter:blur(28px) grayscale(1);transition:filter .35s;pointer-events:none}
#inicio .photo-card.camera .crop:before{background-image:url('home-camaras-noviembre.jpeg');background-position:50% 49%}
#inicio .photo-card.fire .crop:before{background-image:url('home-incendio-noviembre.jpeg');background-position:50% 59%}
#inicio .photo-card.camera:hover .crop:before,#inicio .photo-card.camera:focus-visible .crop:before,#inicio .photo-card.fire:hover .crop:before,#inicio .photo-card.fire:focus-visible .crop:before{filter:blur(28px) grayscale(0)}
#inicio .photo-card.camera .crop img,#inicio .photo-card.fire .crop img{left:50%;width:auto;max-width:none;transform:translateX(-50%);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
