/* EDIT GUIDE: css/icon-tiles.css
   Shared navy-to-hot-orange icon tiles and focus states. This stylesheet loads last; change shared icon colours/sizes here.
   Search EDIT BLOCK for selectors/functions; see EDITING-GUIDE.md for the file map.
*/
/* SHARED ICON TILES: navy at rest, hot orange on interaction.
   A constant translucent highlight over an animated background colour makes the
   gradient transition smooth. Symbols, letters and product drawings are unchanged. */

/* EDIT BLOCK: .bw-site main :is(.bw-material-symbol,.bw-info-icon,.product-icon,.fitting-category-icon, .material-icon,.elbow-material-icon,.standard-icon,.elbow-standard-ico. Change the declarations below; shared overrides may load later. */
.bw-site main :is(.bw-material-symbol,.bw-info-icon,.product-icon,.fitting-category-icon,
 .material-icon,.elbow-material-icon,.standard-icon,.elbow-standard-icon,.industry-icon,
 .application-icon,.elbow-application-icon,.elbow-type-icon,.why-icon,.sector-icon,.tee-placeholder),
.bw-site .elbow-technical .et-card>i{
 display:inline-grid;place-items:center;align-self:start;flex:0 0 54px;
 width:54px;height:54px;padding:0;
 color:#ffb080;background-color:#0b2d49;
 background-image:linear-gradient(140deg,#ffffff24 0%,#ffffff05 48%,#00000018 100%);
 border:1px solid #54738a;border-radius:12px 12px 12px 4px;
 box-shadow:inset 0 1px 0 #ffffff24,0 6px 14px #0b1f3a24;
 transition:background-color 280ms ease,color 280ms ease,border-color 280ms ease,box-shadow 280ms ease;
}
/* Elbow technical cards previously had bare font icons. Restore the tile spacing. */

/* EDIT BLOCK: .bw-site .elbow-technical .et-card>i. Change the declarations below; shared overrides may load later. */
.bw-site .elbow-technical .et-card>i{font-size:24px;margin:0 0 20px}
/* Larger configuration illustrations retain their scale within the same badge family. */

/* EDIT BLOCK: .bw-site main .tee-placeholder. Change the declarations below; shared overrides may load later. */
.bw-site main .tee-placeholder{width:80px;height:80px;flex-basis:80px;align-self:auto;font-size:32px}

/* EDIT BLOCK: .bw-site main :is(.bw-card,.bw-material,.bw-info-card,.product-card,.fitting-category-card, .material-card,.elbow-material-card,.standard-card,.standard-item,.e. Change the declarations below; shared overrides may load later. */
.bw-site main :is(.bw-card,.bw-material,.bw-info-card,.product-card,.fitting-category-card,
 .material-card,.elbow-material-card,.standard-card,.standard-item,.elbow-standard-card,
 .industry-card,.application-card,.elbow-application-card,.elbow-type-card,.why-card,
 .sector-card,.et-card,.tee-type-card):is(:hover,:focus-visible,:focus-within)
 :is(.bw-material-symbol,.bw-info-icon,.product-icon,.fitting-category-icon,.material-icon,
 .elbow-material-icon,.standard-icon,.elbow-standard-icon,.industry-icon,.application-icon,
 .elbow-application-icon,.elbow-type-icon,.why-icon,.sector-icon,.tee-placeholder),
.bw-site .elbow-technical .et-card:is(:hover,:focus-visible,:focus-within)>i{
 background-color:#ff6a2a;
 background-image:linear-gradient(140deg,#ffffff24 0%,#ffffff05 48%,#00000018 100%);
 color:#0b1f3a;border-color:#ff6a2a;
 box-shadow:inset 0 1px 0 #ffffff40,0 7px 18px #ff6a2a35;
}
/* Drawings keep their fine grid instead of losing it on hover. */

/* EDIT BLOCK: .bw-site main .bw-product .bw-blueprint. Change the declarations below; shared overrides may load later. */
.bw-site main .bw-product .bw-blueprint{
 background-color:#0b2d49;
 background-image:linear-gradient(#ffffff09 1px,transparent 1px),linear-gradient(90deg,#ffffff09 1px,transparent 1px),linear-gradient(140deg,#ffffff18,#ffffff00 55%,#00000018);
 background-size:20px 20px,20px 20px,100% 100%;
 transition:background-color 280ms ease,border-color 280ms ease,box-shadow 280ms ease;
}

/* EDIT BLOCK: .bw-site main .bw-product:is(:hover,:focus-visible,:focus-within) .bw-blueprint. Change the declarations below; shared overrides may load later. */
.bw-site main .bw-product:is(:hover,:focus-visible,:focus-within) .bw-blueprint{
 background-color:#ff6a2a;border-color:#ff6a2a;
 background-image:linear-gradient(#ffffff18 1px,transparent 1px),linear-gradient(90deg,#ffffff18 1px,transparent 1px),linear-gradient(140deg,#ffffff18,#ffffff00 55%,#00000018);
 background-size:20px 20px,20px 20px,100% 100%;
}

/* EDIT BLOCK: .bw-site main .bw-product:focus-within .bw-blueprint :is(svg,span). Change the declarations below; shared overrides may load later. */
.bw-site main .bw-product:focus-within .bw-blueprint :is(svg,span){color:#0b1f3a}

/* EDIT BLOCK: .bw-site .elbow-technical a.et-card:is(:hover,:focus-visible). Change the declarations below; shared overrides may load later. */
.bw-site .elbow-technical a.et-card:is(:hover,:focus-visible){border-color:#ff6a2a;box-shadow:0 10px 24px #ff6a2a20}
/* Compact hero directories use the same tile, scaled to avoid crowding link labels. */

/* EDIT BLOCK: .bw-site main .sector-map .sector-icon. Change the declarations below; shared overrides may load later. */
.bw-site main .sector-map .sector-icon{width:38px;height:38px;flex-basis:38px;margin:0;border-radius:9px 9px 9px 3px}

/* EDIT BLOCK: .bw-site main .sector-map .sector-icon svg. Change the declarations below; shared overrides may load later. */
.bw-site main .sector-map .sector-icon svg{width:26px;height:26px}

/* EDIT BLOCK: .bw-site main .sector-map a:is(:hover,:focus-visible) .sector-icon. Change the declarations below; shared overrides may load later. */
.bw-site main .sector-map a:is(:hover,:focus-visible) .sector-icon{background-color:#ff6a2a;color:#0b1f3a;border-color:#ff6a2a}

/* EDIT BLOCK: @media(prefers-reduced-motion:reduce). Change the declarations below; shared overrides may load later. */
@media(prefers-reduced-motion:reduce){
 .bw-site main :is(.bw-material-symbol,.bw-info-icon,.product-icon,.fitting-category-icon,
 .material-icon,.elbow-material-icon,.standard-icon,.elbow-standard-icon,.industry-icon,
 .application-icon,.elbow-application-icon,.elbow-type-icon,.why-icon,.sector-icon,.tee-placeholder,.bw-blueprint),
 .bw-site .elbow-technical .et-card>i{transition:none}
}