/* Plegas Solutions — self-hosted fonts (SIL Open Font License 1.1, see fonts/OFL-*.txt).
   Montserrat (bold / extra-bold italic) = headings, echoing the bold italic logo and the brochure titles;
   Inter = body/UI. */
@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/montserrat-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:800;font-display:swap;src:url(fonts/montserrat-latin-800-normal.woff2) format('woff2')}
@font-face{font-family:'Montserrat';font-style:italic;font-weight:800;font-display:swap;src:url(fonts/montserrat-latin-800-italic.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/inter-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/inter-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/inter-latin-600-normal.woff2) format('woff2')}

:root{
 --orange:#E2642C;     /* logo orange */
 --orange-ink:#C0491B; /* darker orange for small text / buttons on white (AA) */
 --navy:#121E48;       /* brochure navy */
 --black:#000000;
 --white:#FFFFFF;
 --mist:#F3F4F8;
 --ink:#14182B;
 --muted:#4A5170;
 --head:'Montserrat','Arial Black',system-ui,sans-serif;
 --sans:'Inter',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5.5rem}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--sans);font-size:1.0625rem;line-height:1.65;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy)}
a:focus-visible,button:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 1.5rem}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:var(--navy);color:var(--white);padding:.5rem 1rem;z-index:50}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Header (white, per sketch "Blanc") */
header.site{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.97);border-bottom:1px solid rgba(18,30,72,.12);backdrop-filter:saturate(1.4) blur(6px)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:.6rem;padding-bottom:.6rem}
.logo img{height:58px;width:auto}
.head-right{display:flex;align-items:center;gap:1.25rem}
nav ul{list-style:none;margin:0;padding:0;display:flex;gap:.2rem 1.1rem;flex-wrap:wrap}
nav a{display:inline-block;padding:.4rem 0;color:var(--navy);text-decoration:none;font-family:var(--head);font-weight:700;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase}
nav a:hover{color:var(--orange-ink);text-decoration:underline;text-decoration-color:var(--orange);text-decoration-thickness:2px;text-underline-offset:6px}
.lang-switch{margin:0;display:flex;gap:0;font-family:var(--head);font-size:.74rem;font-weight:700;letter-spacing:.08em}
.lang-switch a{color:var(--navy);text-decoration:none;padding:.4rem .55rem;min-width:44px;min-height:36px;text-align:center;border:2px solid var(--navy)}
.lang-switch a+a{border-left:0}
.lang-switch a[aria-current="page"]{background:var(--navy);color:var(--white)}
.menu-toggle{display:none;align-items:center;gap:.6rem;background:var(--navy);color:var(--white);border:0;border-radius:999px;font:700 .78rem var(--head);letter-spacing:.1em;text-transform:uppercase;padding:.7rem 1.1rem;cursor:pointer;min-height:44px}
.bars,.bars::before,.bars::after{display:block;width:18px;height:2px;background:currentColor;position:relative;content:""}
.bars::before{position:absolute;top:-6px}.bars::after{position:absolute;top:6px}

/* Bands */
section.band{padding:5rem 0;position:relative}
.white{background:var(--white)}
.navy{background:var(--navy);color:#E7EAF4}
.black{background:var(--black);color:#E9E9E9}
.orange{background:var(--orange);color:var(--black)}
.wave{line-height:0;margin:-1px 0}
.wave svg{display:block;width:100%;height:clamp(48px,7vw,110px)}
.kicker{font-family:var(--head);font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.76rem;color:var(--orange-ink);margin:0 0 1rem}
.navy .kicker,.black .kicker{color:var(--orange)}
.orange .kicker{color:var(--black)}
h1,h2{font-family:var(--head);font-weight:800;font-style:italic;letter-spacing:-.01em}
h2{font-size:clamp(1.9rem,4.2vw,3rem);line-height:1.1;margin:0 0 1.25rem;color:var(--navy)}
h2 em{font-style:italic;color:var(--orange)}
.navy h2,.black h2{color:var(--white)}
.orange h2{color:var(--white)}
.orange h2 em{color:var(--black)}
.lead{font-size:1.15rem;line-height:1.6;margin:0 0 1.5rem}
.narrow{max-width:44rem}
.white .lead{color:var(--muted)}
.cols{display:grid;grid-template-columns:1fr 1.1fr;gap:3rem;align-items:start}
h3.mini{font-family:var(--head);font-weight:700;font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;margin:1.5rem 0 .75rem;color:inherit}
.white h3.mini{color:var(--navy)}

/* Chips */
.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.55rem}
.chips li{border-radius:999px;padding:.45rem 1rem;font-weight:500;font-size:.95rem;line-height:1.3}
.navy-chips li{background:var(--mist);color:var(--navy);border:1px solid rgba(18,30,72,.14)}
.chips.light li{border:1px solid rgba(255,255,255,.35);color:var(--white)}
.chips.dark li{background:#15161A;border:1px solid #33343C;color:var(--white)}
.chips.on-orange li{background:var(--black);color:var(--white)}

/* Buttons */
.actions{display:flex;flex-wrap:wrap;gap:.9rem;margin:0}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;background:var(--orange-ink);color:var(--white)!important;text-decoration:none;font-family:var(--head);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.82rem;padding:.9rem 1.6rem;border:2px solid var(--orange-ink);border-radius:999px;transition:background .2s,border-color .2s}
.btn .ext{margin-left:.55rem;flex:0 0 auto}
.cta-row{margin-top:2rem}
.btn:hover{background:var(--navy);border-color:var(--navy)}
.btn.ghost-light{background:transparent;border-color:rgba(255,255,255,.8)}
.btn.ghost-light:hover{background:var(--white);color:var(--navy)!important;border-color:var(--white)}

/* Hero / Welcome */
.hero{padding:0 0 4.5rem;overflow:hidden}
.hero-photo{position:absolute;top:0;right:0;width:62%;height:640px;background:url(img/hero-pneumatics.jpg) center/cover no-repeat;
 -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 45%);mask-image:linear-gradient(90deg,transparent 0,#000 45%);opacity:.55}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,30,72,.1) 40%,var(--navy) 100%)}
.hero-inner{position:relative;z-index:1;padding-top:6rem;padding-bottom:4rem}
.hero h1{margin:0;color:var(--white);font-size:clamp(2.6rem,7vw,5.4rem);line-height:1.02;max-width:15ch}
.hero h1 em{color:var(--orange)}
.hero .tag{font-family:var(--head);font-weight:700;font-size:clamp(1.05rem,2.2vw,1.35rem);color:var(--white);margin:1.6rem 0 1rem;max-width:36rem;padding-left:1rem;border-left:4px solid var(--orange)}
.hero .sub{max-width:40rem;margin:0 0 2.25rem;color:#C9CFE3}
#axes{position:relative;z-index:1}
.axes-title{font-size:clamp(1.7rem,3.6vw,2.6rem)}
.axes-title .kicker{display:block;font-style:normal;margin-bottom:.8rem}
.axes{list-style:none;margin:2rem 0 2.5rem;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem}
.axis{display:flex;flex-direction:column;height:100%;background:var(--white);color:var(--ink);text-decoration:none;border-radius:18px 18px 18px 4px;padding:1.5rem 1.35rem 1.25rem;position:relative;border-bottom:5px solid var(--orange);transition:transform .2s}
.axis:hover{transform:translateY(-4px)}
.axis .num{font-family:var(--head);font-weight:800;font-style:italic;font-size:2.4rem;line-height:1;color:var(--orange);margin-bottom:.8rem}
.axis strong{font-family:var(--head);font-weight:800;font-size:1.08rem;line-height:1.25;color:var(--navy);margin-bottom:.5rem}
.axis .ad{font-size:.95rem;color:var(--muted);flex:1}
.axis .arrow{margin-top:1rem;font-weight:700;color:var(--orange-ink);font-size:1.2rem}
.brands{font-family:var(--head);font-weight:700;color:var(--white);font-size:1.1rem;margin:0 0 1.5rem}
.markets{display:grid;grid-template-columns:1fr 1fr;gap:2rem}
.markets h3{font-family:var(--head);font-weight:700;font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:var(--orange);margin:0 0 .75rem}

/* Shop */
.fam-title{font-family:var(--head);font-weight:800;font-style:italic;color:var(--navy);font-size:1.35rem;margin:3.5rem 0 1.25rem}
.fams{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.fam{display:flex;align-items:center;gap:1rem;background:var(--white);border:1px solid rgba(18,30,72,.12);border-radius:16px;padding:.6rem 1rem .6rem .6rem}
.fam img{width:92px;height:92px;flex:0 0 92px;border-radius:10px}
.fam span{font-weight:600;color:var(--navy);line-height:1.35;font-size:.98rem}
.ind{margin:1.75rem 0 2rem;color:var(--muted);font-style:italic}

/* Custom */
.process{list-style:none;margin:2.5rem 0 1rem;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:none;max-width:900px}
.process li{position:relative;display:flex;flex-direction:column;align-items:center;gap:.6rem;font-family:var(--head);font-weight:800;font-style:italic;font-size:1.25rem;color:var(--black)}
.process li::before{content:"";position:absolute;top:30px;left:50%;width:100%;height:3px;background:var(--black)}
.process li:last-child::before{display:none}
.process .sn{position:relative;z-index:1;width:60px;height:60px;border-radius:50%;background:var(--white);color:var(--orange-ink);display:flex;align-items:center;justify-content:center;font-size:1.4rem;box-shadow:0 0 0 4px var(--black)}

/* Compressors */
.specs{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:2.5rem}
.spec{border-top:3px solid var(--orange);padding-top:1.25rem}
.spec h3{font-family:var(--head);font-weight:700;font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:var(--orange);margin:0 0 .9rem}

/* Systems */
.unit-wrap{display:flex;justify-content:center;align-items:center;background:var(--mist);border-radius:28px 28px 28px 6px;padding:2.5rem;color:var(--navy)}
.unit{width:100%;max-width:360px;height:auto}

section.slim{padding:3.5rem 0}

/* Contact */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:2rem;margin:2rem 0 2.25rem;max-width:980px}
.contact-grid h3{font-family:var(--head);font-size:.76rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--orange-ink);margin:0 0 .4rem}
.contact-grid p{margin:0;font-size:1.1rem}
.contact-grid a{word-break:break-word;font-weight:600}

/* Footer */
footer{background:var(--navy);color:#C9CFE3;font-size:.92rem;padding:2.5rem 0 6.5rem}
.flogo{height:72px;width:auto;margin-bottom:1.75rem}
footer .legal-title{font-family:var(--head);font-weight:800;font-style:italic;font-size:1.2rem;color:var(--white);margin:0 0 1.25rem}
footer .legal{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:2rem}
footer h3{font-family:var(--head);font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--orange);margin:0 0 .75rem}
footer p{margin:0 0 .35rem}
footer a{color:var(--white)}
footer .copy{margin-top:2.5rem;padding-top:1.25rem;border-top:1px solid rgba(255,255,255,.18);color:#AEB5CF}

/* Floating Quote / Chat (bottom-right, as sketched) */
.floating{position:fixed;right:1rem;bottom:1rem;z-index:40;display:flex;gap:.5rem;filter:drop-shadow(0 6px 16px rgba(0,0,0,.25))}
.fab{display:inline-flex;align-items:center;gap:.5rem;min-height:48px;padding:.7rem 1.1rem;border-radius:999px;text-decoration:none;font-family:var(--head);font-weight:700;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;border:2px solid var(--white)}
.fab.quote{background:var(--orange-ink);color:var(--white)}
.fab.chat{background:var(--navy);color:var(--white)}
.fab:hover{filter:brightness(1.12)}

/* Responsive */
@media (max-width:1140px){
 .js .menu-toggle{display:inline-flex}
 .js .head-right{display:none;position:absolute;left:0;right:0;top:100%;background:var(--white);border-bottom:3px solid var(--orange);padding:1rem 1.5rem 1.5rem;flex-direction:column;align-items:flex-start;box-shadow:0 12px 24px rgba(18,30,72,.12)}
 .js .head-right.open{display:flex}
 .js nav ul{flex-direction:column;gap:0}
 .js nav a{padding:.65rem 0;font-size:.85rem}
 html:not(.js) header.site .wrap{flex-wrap:wrap}
 .axes{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
 .cols,.markets,.specs{grid-template-columns:1fr;gap:1.75rem}
 .fams{grid-template-columns:1fr 1fr}
 section.band{padding:3.75rem 0}
 .hero{padding:0 0 3.5rem}
 .hero-inner{padding-top:3.5rem;padding-bottom:3rem}
 .hero-photo{width:100%;height:420px;opacity:.35;-webkit-mask-image:none;mask-image:none}
 .unit-wrap{padding:1.5rem}
}
@media (max-width:560px){
 .logo img{height:48px}
 .axes{grid-template-columns:1fr}
 .fams{gap:.75rem}
 .fam{flex-direction:column;align-items:stretch;text-align:center;gap:.5rem;padding:.6rem .6rem .8rem}
 .fam img{width:100%;height:auto;flex:none}
 .fam span{font-size:.88rem}
 .fam:last-child:nth-child(odd){grid-column:1/-1;flex-direction:row;align-items:center;text-align:left}
 .fam:last-child:nth-child(odd) img{width:110px;flex:0 0 110px}
 .process{grid-template-columns:repeat(2,1fr);row-gap:1.5rem}
 .process li:nth-child(2)::before{display:none}
 .actions .btn{width:100%}
 .fab{padding:.6rem .9rem}
}
/* BEGIN shop-stretched-link (generated by build_solutions.py) */
/* Whole "Axe 01 / Pillar 1" section is clickable: the CTA's ::after covers the position:relative section.
   Only one real link (the CTA) stays focusable; no nested <a>. */
.shop-band{cursor:pointer}
.shop-band .shop-link::after{content:"";position:absolute;inset:0;z-index:1;border-radius:0}
.shop-band .fam{transition:border-color .2s,box-shadow .2s,transform .2s}
.shop-band:hover .fam{border-color:rgba(226,100,44,.55);box-shadow:0 6px 18px rgba(18,30,72,.08)}
.shop-band:hover .shop-link{background:var(--navy);border-color:var(--navy)}
.shop-band:has(.shop-link:focus-visible) .fam{border-color:rgba(226,100,44,.55)}
@media (prefers-reduced-motion:reduce){.shop-band .fam{transition:none}}
/* Same for the compressors & air dryers section: the whole section opens the Odoo store. */
.co-band{cursor:pointer;position:relative}
.co-band .co-link::after{content:"";position:absolute;inset:0;z-index:1;border-radius:0}
.co-band:hover .co-link{background:#fff;border-color:#fff;color:var(--navy)}
/* END shop-stretched-link */