/* Hygiene product library, using the shared petrol / mint design system. */
.filtration-studio .fg-products{background:radial-gradient(ellipse at 8% 25%,#28554a30,transparent 55%),#09191f;border-block:1px solid #a5cbd21e}
.filtration-studio .fg-products .section-heading>p{font:14px/1.85 Arial;color:#a7bfcc;max-width:340px}
.fg-filters{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 17px}
.fg-filters button{font:12px/1.5 Arial;color:#b6cfce;padding:12px 17px;border:1px solid #a5cbd22b;border-radius:12px;background:#0d222a;cursor:pointer}
.fg-filters button[aria-pressed=true]{background:linear-gradient(135deg,#28524d,#163439);color:#dbf4e8;border-color:#a9dbd05c;box-shadow:inset 0 1px #e8fff418}
.filtration-studio .fg-count{font:11px/1.6 Arial;color:#82a5af;margin:0 0 26px}
.fg-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.filtration-studio .fg-card{--fg-accent:#a9dbd0;position:relative;min-width:0;display:flex;flex-direction:column;padding:27px;border:1px solid #a5cbd22b;border-radius:24px;background:radial-gradient(ellipse at 100% 0,#70a98c15,transparent 65%),linear-gradient(145deg,#172e36,#0d2028);overflow:hidden;scroll-margin-top:110px;box-shadow:inset 0 1px #eafff410,0 15px 35px #00000012}
.fg-card:before{content:"";position:absolute;top:0;left:27px;width:100px;height:1px;background:linear-gradient(90deg,var(--fg-accent),transparent)}
.filtration-studio .fg-elastic{--fg-accent:#bbcdf0;background:radial-gradient(ellipse at 100% 0,#839dd522,transparent 65%),linear-gradient(145deg,#192d38,#0e2029)}
.filtration-studio .fg-positioning{--fg-accent:#e0c2b2;background:radial-gradient(ellipse at 100% 0,#b6859b20,transparent 65%),linear-gradient(145deg,#29303b,#0e2029)}
.filtration-studio .fg-lids{--fg-accent:#e4d2a4;background:radial-gradient(ellipse at 100% 0,#c7aa6520,transparent 65%),linear-gradient(145deg,#23333a,#0e2029)}
.fg-card header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px;color:var(--fg-accent);font:11px/1.6 Arial}
.fg-card header svg{width:44px;height:44px;flex:0 0 44px;padding:5px;border:1px solid #a5cbd225;border-radius:12px;background:#b5dec708}
.filtration-studio .fg-card h3{font:54px/1.05 OYTI,Arial;color:#e1efec;margin:0 0 22px;letter-spacing:-.03em}
.fg-card h3>span{display:block;font:10px/1.5 Arial;letter-spacing:.17em;color:#91b3bb;margin-bottom:9px}
.filtration-studio .fg-description{font:13px/1.85 Arial;color:#a7bfcc;margin:0 0 24px;min-height:73px}
.fg-metrics{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:16px;margin:0 0 28px;padding-top:21px;border-top:1px solid #a5cbd22b}
.fg-metrics>div{min-width:0}.fg-metrics dt{font:10px/1.6 Arial;color:#8bacb7;margin-bottom:11px}
.fg-metrics dd{margin:0;color:var(--fg-accent);font:34px/1.1 OYTI,Arial;letter-spacing:-.035em;white-space:nowrap}
.fg-metrics dd small{display:block;font:10px/1.6 Arial;color:#a5bec6;letter-spacing:0;margin-top:8px}
.fg-window{padding:18px 16px;border:1px solid #a5cbd223;border-radius:12px;background:#05172044}
.fg-window>div:first-child{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:19px;font:10px/1.6 Arial;color:#98b6bc}
.fg-window strong{font:14px/1.5 Arial;color:#d7e9e3;white-space:nowrap}
.fg-track{height:5px;position:relative;background:#60818b2b;border-radius:4px}
.fg-track i{display:block;position:absolute;height:5px;border-radius:4px;background:var(--fg-accent);box-shadow:0 0 12px #a9dbd032}
.fg-track i:before,.fg-track i:after{content:"";position:absolute;top:-2px;width:9px;height:9px;border-radius:50%;background:var(--fg-accent);border:2px solid #23403e;box-sizing:border-box}
.fg-track i:before{left:-3px}.fg-track i:after{right:-3px}
.fg-scale{display:flex;justify-content:space-between;margin-top:12px;font:9px/1.5 Arial;color:#6e929d}
.filtration-studio .fg-methods{font:11px/1.6 Arial;color:#93b5bd;margin:19px 0 22px}
.fg-enquiry{display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--fg-accent);font:12px/1.6 Arial;border-top:1px solid #a5cbd22b;padding-top:18px;margin-top:auto;text-decoration:none}
.fg-enquiry span{font-size:20px}
.fg-enquiry:hover{color:#e6fff3}
.fg-comparison{margin-top:27px;border:1px solid #a5cbd22b;border-radius:18px;background:#10252d;overflow:hidden}
.fg-comparison summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 26px;cursor:pointer;list-style:none;font:14px/1.5 Arial;color:#cce4dc}
.fg-comparison summary::-webkit-details-marker{display:none}
.fg-comparison[open] summary{border-bottom:1px solid #a5cbd22b}
.fg-comparison[open] summary>span{transform:rotate(45deg)}
.fg-table-scroll{overflow:auto;padding:0 25px 22px}
.fg-comparison table{border-collapse:collapse;width:100%;min-width:780px;font:12px/1.7 Arial;color:#b5ccce;text-align:left}
.fg-comparison caption{text-align:left;padding:21px 0;color:#88a9b3;font:11px/1.8 Arial}
.fg-comparison th,.fg-comparison td{padding:15px 12px;border-bottom:1px solid #a5cbd222;vertical-align:top}
.fg-comparison thead th{font-weight:400;color:#8eb7b8;font-size:10px}
.fg-comparison tbody th{font-weight:400;color:#d7e9e2;white-space:nowrap}
.filtration-studio .fg-technical-note{font:11px/1.85 Arial;color:#83a2ac;max-width:960px;margin:23px 0 0}
.filtration-studio .fg-context{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:33px;padding-top:24px;border-top:1px solid #a5cbd22b}
.fg-context>span{font:11px/1.6 Arial;color:#8fb2bb;margin-right:5px}
.fg-context>span:not(:first-child){margin-left:20px}
.fg-context a{display:inline-flex;align-items:center;gap:12px;padding:9px 13px;border:1px solid #a5cbd22b;border-radius:9px;background:#91cdb70a;color:#bce0d4;font:11px/1.6 Arial;text-decoration:none}
.fg-context a:hover{background:#91cdb71a}
#filtration-products [hidden]{display:none!important}
.fg-products :focus-visible,.fg-context a:focus-visible{outline:2px solid #c2f0dc;outline-offset:4px}
@media(max-width:1100px){.fg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.filtration-studio .fg-description{min-height:73px}}
@media(max-width:600px){.fg-grid{grid-template-columns:1fr;gap:17px}.filtration-studio .fg-card{padding:25px}.filtration-studio .fg-description{min-height:0}.fg-filters{gap:7px}.fg-filters button{font-size:11px;padding:10px 12px}.fg-context>span{width:100%;margin:9px 0 0!important}.fg-table-scroll{padding-inline:15px}.fg-comparison summary{padding:20px}.fg-metrics dd{font-size:34px}}

/* Filtration grade specifics. */
.filtration-studio .fg-card h3{font-size:clamp(34px,3.3vw,54px)}
.filtration-studio .fg-description{min-height:98px}
.fg-properties{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin:20px 0 12px;font:11px/1.7 Arial;color:#93b5bd}
.fg-properties strong{color:#cbe6dc;font-weight:400;margin-left:6px}
.fg-grade-note{font:11px/1.8 Arial;color:#a4bbc2;min-height:40px;margin:0 0 22px}
.fg-card:nth-child(2){--fg-accent:#bbcdf0}
.fg-card:nth-child(3){--fg-accent:#e4d2a4}
@media(max-width:1100px) and (min-width:601px){.fg-card:last-child{grid-column:1/-1}}
@media(max-width:600px){.filtration-studio .fg-description{min-height:0}.fg-grade-note{min-height:0}}
