.na-query { position:relative; min-width:0; color:#fff; font-family:'Plus Jakarta Sans',sans-serif; --query-gap:10px; --query-slide:calc((100% - 30px)/4.1); }
.na-query *, .na-query *::before, .na-query *::after { box-sizing:border-box; }
.na-query__intro { position:relative; padding-right:112px; margin-bottom:48px; min-height:36px; }
.na-query__intro .c-section-intro { margin-bottom:0; }

.na-query__intro .text { max-width:1041px; font-size:16px; line-height:1.75; color:#aaa; }
.na-query__controls { display:flex; gap:16px; position:absolute; right:0; bottom:0; }
.na-query [hidden] { display:none!important; }
.na-query__controls button { display:grid; place-items:center; width:36px; height:36px; padding:3px; border:1px solid #777; border-radius:0; background:#000; color:#fff; cursor:pointer; }
.na-query__controls svg,.na-query-card__arrow svg { width:100%; height:100%; }
.na-query__controls button:disabled { opacity:.3; cursor:default; }
.na-query :is(a,button,[tabindex]):focus-visible { outline:2px solid #fff; outline-offset:4px; }
.na-query__track { --f-carousel-slide-width:var(--query-slide); --f-carousel-gap:var(--query-gap); position:relative; }
.na-query:not(.has-carousel) .na-query__track { display:flex; gap:var(--query-gap); overflow-x:auto; scroll-snap-type:x mandatory; }
.na-query__slide { flex:0 0 var(--query-slide); width:var(--query-slide); scroll-snap-align:start; }
.na-query-card { position:relative; height:100%; min-height:490px; padding:30px 26px; border:1px solid #333; isolation:isolate; --query-corner-color:#bbb; background:linear-gradient(160deg,#000 25%,#383838 100%); display:flex; flex-direction:column; }
.na-query-card::after,.na-query__choice::after { content:''; position:absolute; inset:-1px; pointer-events:none; color:var(--query-corner-color,#bbb); transition:color .3s ease; background:linear-gradient(currentColor,currentColor) left top/10px 1px no-repeat,linear-gradient(currentColor,currentColor) left top/1px 10px no-repeat,linear-gradient(currentColor,currentColor) right top/10px 1px no-repeat,linear-gradient(currentColor,currentColor) right top/1px 10px no-repeat,linear-gradient(currentColor,currentColor) left bottom/10px 1px no-repeat,linear-gradient(currentColor,currentColor) left bottom/1px 10px no-repeat,linear-gradient(currentColor,currentColor) right bottom/10px 1px no-repeat,linear-gradient(currentColor,currentColor) right bottom/1px 10px no-repeat; }
.na-query-card__media { position:relative; z-index:1; display:grid; place-items:center; aspect-ratio:1; width:100%; margin:auto 0 20px; }
.na-query-card__media .c-media,.na-query-card__media figure { width:100%; margin:0; }
.na-query-card__media img { display:block; width:100%; height:auto; object-fit:contain; transition:transform .3s ease; }
@media (hover:hover) and (pointer:fine) { .na-query--applications .na-query-card:hover .na-query-card__media img { transform:translateY(-5px); } }
.na-query-card__body { position:relative; z-index:1; }
.na-query-card__title { margin:0; color:#fff; }
.na-query-card__title span { display:block; }
.na-query a { color:inherit; text-decoration:none; }
.na-query-card__text { margin-top:14px; color:#aaa; font-size:16px; line-height:1.7; }
.na-query-card__text p { margin:0; }
.na-query-card__link { position:absolute; inset:0; z-index:2; }
.na-query--benefits .na-query-card { min-height:560px; padding:48px 40px 70px; text-align:center; }
.na-query--benefits .na-query-card__media { margin:0 0 25px; }
.na-query--benefits .na-query-card__media,.na-query__choice .na-query-card__media { border:3px solid #fff; border-radius:50%; background:radial-gradient(ellipse at bottom,#a40008, #180000 65%,#020202); box-shadow:0 0 8px #f3000a,0 0 25px #f3000a,0 0 45px #f3000a66; padding:6%; }
.na-query--benefits .na-query-card__media img,.na-query__choice .na-query-card__media img { aspect-ratio:1; object-fit:contain; }
.na-query--applications .na-query-card { padding:48px 25px 25px; }
.na-query--applications .na-query-card__body { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; background:#000; }

.na-query-card__arrow { flex:0 0 36px; height:36px; padding:4px; border:1px solid #777; }
.na-query--benefits-spotlight { padding:100px 0 65px; isolation:isolate; background:#000; text-align:center; }
.na-query--benefits-spotlight::before { content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; background:url('../images/benefits-spotlight-background.webp') center center/1000px 1000px repeat-x; }
.na-query--benefits-spotlight .na-query__intro { padding:0; min-height:0; margin:0; }
.na-query--benefits-spotlight .na-query__intro:has(.c-section-intro) { margin-bottom:40px; }
.na-query--benefits-spotlight .na-query__controls { z-index:3; left:50%; right:auto; top:145px; bottom:auto; width:min(960px,98%); transform:translateX(-50%); justify-content:space-between; pointer-events:none; }
.na-query--benefits-spotlight .na-query__controls button { pointer-events:auto; }
.na-query--benefits-spotlight .na-query__track { --query-slide:300px; --query-gap:0px; max-width:900px; margin:auto; }
.na-query--benefits-spotlight .na-query__slide { display:grid; place-items:center; height:300px; scroll-snap-align:center; }
.na-query__choice { display:block; position:relative; width:260px; padding:0; border:0; border-radius:0; background:none; cursor:pointer; color:#fff; transform:scale(.6); transition:transform .35s ease; }
.na-query__choice .na-query-card__media { margin:0; padding:0; }
.na-query__choice::after { opacity:0; filter:drop-shadow(0 0 5px red); }
.is-current .na-query__choice { transform:scale(1); }
.is-current .na-query__choice::after { opacity:1; }
.na-query__panel { padding:35px 24px 0; }
.na-query__heading { margin:0; }
.na-query__heading span { margin-top:20px; }
.na-query__description { max-width:470px; margin:28px auto 20px; color:#aaa; font-size:16px; line-height:1.6; }
.na-query__more { display:inline-block; border:1px solid #bbb; padding:15px 25px; font-size:16px; font-weight:700; }
.na-query__more:hover { background:#b9000b; }
@media (max-width:1100px) { .na-query { --query-slide:calc((100% - 20px)/3.1); } .na-query-card,.na-query--benefits .na-query-card { min-height:430px; padding:24px 20px 35px; } .na-query-card__title { margin:0; color:#fff; } }
@media (max-width:800px) { .na-query { --query-slide:calc((100% - 10px)/2.15); } .na-query__intro { margin-bottom:28px; } .na-query--benefits-spotlight { padding-top:55px; } .na-query--benefits-spotlight .na-query__track { --query-slide:230px; } .na-query__choice { width:210px; } .na-query--benefits-spotlight .na-query__slide { height:250px; } .na-query--benefits-spotlight .na-query__controls { top:115px; } }
@media (max-width:540px) { .na-query { --query-slide:85%; } .na-query__intro { padding-right:0; padding-bottom:52px; } .na-query__controls { gap:12px; } .na-query--benefits-spotlight .na-query__intro { padding:0; } .na-query--benefits-spotlight .na-query__track { --query-slide:210px; } .na-query__choice { width:190px; } .na-query--benefits-spotlight .na-query__controls { top:110px; } .na-query__panel { padding-inline:16px; } .na-query-card__text { font-size:14px; } }
@media (prefers-reduced-motion:reduce) { .na-query * { transition:none!important; scroll-behavior:auto!important; } }

/* Item appearance is independent of grid/list/carousel placement. */
.na-query-item { height:100%; min-width:0; }
.na-query-item .na-query-card__media > a { display:block; width:100%; }
.c-query.layout-grid:has(.na-query-item),.c-query.layout-list:has(.na-query-item) { gap:10px; }
.c-carousel:has(.na-query-item) { --f-carousel-gap:10px; }

/* Shared project navigation: arrows above; arrows + dots below. */
[data-tns-carousel] { --f-arrow-width:36px; --f-arrow-height:36px; --f-button-border:1px solid #777; --f-arrow-border-radius:0; --f-arrow-color:#fff; --f-arrow-bg:#000; --f-arrow-hover-bg:#a9000a; --f-button-outline-color:#fff; }
[data-tns-carousel]:has(> .is-arrow):not(:has(> .f-carousel__dots)) { margin-top:64px; }
[data-tns-carousel].f-carousel.is-horizontal > .f-button.is-arrow { inset:-60px 0 auto auto; transform:none; translate:none; }
[data-tns-carousel].f-carousel.is-horizontal > .f-button.is-arrow.is-prev { left:auto; right:52px; }
[data-tns-carousel].f-carousel.is-horizontal > .f-button.is-arrow.is-next { left:auto; right:0; }
[data-tns-carousel] > .is-prev svg path { d:path('M20 12H4m7-7-7 7 7 7'); }
[data-tns-carousel] > .is-next svg path { d:path('M4 12h16m-7-7 7 7-7 7'); }
[data-tns-carousel]:has(> .f-carousel__dots) { padding-bottom:64px; margin-bottom:0; }
[data-tns-carousel].f-carousel.is-horizontal:has(> .f-carousel__dots) > .f-button.is-arrow { top:auto; bottom:0; }
[data-tns-carousel].f-carousel.is-horizontal:has(> .f-carousel__dots) > .f-button.is-arrow.is-prev { left:0; right:auto; }
[data-tns-carousel] > .f-carousel__dots { position:absolute; inset:auto 52px 0; width:auto; min-height:36px; margin:0; padding:0; display:flex; justify-content:center; align-items:center; flex-wrap:wrap; }
.na-query--benefits-spotlight .na-query__controls { top:24px; bottom:auto; right:24px; left:auto; width:auto; transform:none; gap:16px; }
.na-query--benefits-spotlight .na-query__intro { position:static; }
.na-query--benefits-spotlight.has-query-dots { padding-bottom:120px; }
.na-query--benefits-spotlight.has-query-dots .na-query__controls { top:auto; bottom:24px; left:24px; right:24px; width:auto; }
.na-query__dots { position:absolute; bottom:24px; left:80px; right:80px; min-height:36px; display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:8px; }
.na-query__dots button { width:24px; height:24px; padding:8px; border:0; background:transparent; color:#fff; cursor:pointer; }
.na-query__dots button::after { content:''; display:block; width:8px; height:8px; background:currentColor; border-radius:50%; opacity:.4; }
.na-query__dots button[aria-current=true]::after { opacity:1; }


.na-query-section > .c-section-intro .text { max-width:1041px; font-size:16px; line-height:1.75; color:#aaa; }

/* Fade only the dot layer, keeping the grey base and content fully opaque. */
.na-query-card::before {
    content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
    background:radial-gradient(circle,#7775 .7px,transparent 1px) 0 35px/10px 10px;
    -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 30%,transparent 80%);
    mask-image:linear-gradient(to bottom,#000 0%,#000 30%,transparent 80%);
}
.na-query-card::after { z-index:3; }
.na-query--benefits .na-query-card {
    --benefit-scale:1; --benefit-ring:0px; --benefit-text-offset:0px;
}
.na-query--benefits .na-query-card__media {
    transform:scale(var(--benefit-scale));
    box-shadow:inset 0 0 0 var(--benefit-ring) #fff,0 0 8px #f3000a,0 0 25px #f3000a,0 0 45px #f3000a66;
    transition:transform .3s ease,box-shadow .3s ease;
}
.na-query--benefits .na-query-card__body {
    transform:translateY(var(--benefit-text-offset)); transition:transform .3s ease;
}
.na-query--benefits .na-query-card:has(:focus-visible) {
    --benefit-scale:1.045; --benefit-ring:5px; --benefit-text-offset:10px; --query-corner-color:#f3000a;
}
@media (hover:hover) and (pointer:fine) {
    .na-query--benefits .na-query-card:hover {
        --benefit-scale:1.045; --benefit-ring:5px; --benefit-text-offset:10px; --query-corner-color:#f3000a;
    }
}
@media (prefers-reduced-motion:reduce) {
    .na-query-card::after { transition:none; }
    .na-query--benefits .na-query-card__media,.na-query--benefits .na-query-card__body { transform:none; }
}