/*
Theme Name: Brugon Services
Theme URI: https://brugonservices.com
Author: Brugon Services Limited
Description: Professional theme for Brugon Services Limited, built for Elementor. Includes custom Elementor widgets (hero slider, services, certifications, testimonials, booking form) and company details in the Customizer.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: brugon
*/
:root{--bg:#fff;--alt:#f2f7f5;--ink:#0c2a2c;--muted:#506669;--line:#dbe6e3;--brand:#0f5a52;--brand-ink:#fff;--accent:#e9a82b;--deep:#0a3532}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.7 "Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
h1,h2,h3{font-family:Manrope,"Segoe UI",system-ui,sans-serif;line-height:1.15;margin:0;letter-spacing:-.015em}
a{color:inherit}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
.wrap{max-width:1140px;margin:0 auto;padding:0 24px}
.top{background:var(--deep);color:#d9ece7;font-size:14px}
.top .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 24px;padding-top:8px;padding-bottom:8px}
.top a{text-decoration:none}
.site-header{position:sticky;top:0;z-index:20;background:var(--bg);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:10px;padding-bottom:10px}
.brand{display:flex;flex-direction:column;align-items:flex-start;text-decoration:none;line-height:1.2}
.brand img,.brand svg{height:52px;width:auto;display:block}
.brand span{font:800 13px Manrope,sans-serif;color:var(--brand);margin-top:4px;letter-spacing:.01em}
#primary-nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0;font-weight:500;font-size:15px}
#primary-nav a{text-decoration:none;color:var(--muted)}#primary-nav a:hover{color:var(--ink)}
.btn{display:inline-block;background:var(--brand);color:var(--brand-ink);padding:13px 26px;border-radius:10px;font:700 15px Manrope,sans-serif;text-decoration:none;border:0;cursor:pointer}
.btn:hover{filter:brightness(1.1)}
.slider .btn.light{background:#fff;color:#0a3532}
.btn.line{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.7)}
@media(max-width:860px){#primary-nav ul{display:none}}
/* slider */
.slider{position:relative;background:var(--deep);color:#fff;overflow:hidden}
.slides{display:flex;transition:transform .7s ease}
.slide{min-width:100%;padding:84px 0 108px;position:relative;background:linear-gradient(120deg,var(--deep),#0f5a52)}
.slide:nth-child(2){background:linear-gradient(120deg,#0b3a46,#17806a)}
.slide:nth-child(3){background:linear-gradient(120deg,#143b2f,#2b7d4f)}
.slide .wrap{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:center}
.slide small{display:inline-block;font:700 14px Manrope,sans-serif;color:var(--accent);margin-bottom:16px}
.slide h1,.slide h2{font-size:clamp(34px,5.2vw,62px);font-weight:800}
.slide p{font-size:19px;color:#cfe5df;max-width:54ch;margin:20px 0 32px}
.slide .cta{display:flex;gap:12px;flex-wrap:wrap}
.slide svg{width:100%;max-width:280px;justify-self:center;opacity:.9}
.ctrl{position:absolute;left:0;right:0;bottom:34px}
.ctrl .wrap{display:flex;align-items:center;gap:14px}
.dots{display:flex;gap:10px}
.dots button{width:36px;height:6px;border-radius:3px;border:0;background:rgba(255,255,255,.35);cursor:pointer;padding:0}
.dots button[aria-current="true"]{background:var(--accent)}
.arr{background:rgba(255,255,255,.15);color:#fff;border:0;width:40px;height:40px;border-radius:50%;cursor:pointer;font-size:18px}
.arr:hover{background:rgba(255,255,255,.3)}
@media(max-width:820px){.slide .wrap{grid-template-columns:1fr}.slide svg{display:none}.slide{padding:56px 0 100px}}
section{padding:84px 0}
.alt{background:var(--alt)}
.head{max-width:680px;margin-bottom:42px}
.head small{font:700 14px Manrope,sans-serif;color:var(--brand)}
.head h2{font-size:clamp(28px,4vw,42px);margin-top:8px}
.head p{color:var(--muted);margin:14px 0 0}
.about{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:start}
.about p{color:var(--muted);margin:16px 0 0}
.form{background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:30px}
.form h3{font-size:24px;margin-bottom:18px}
.field{display:block;font-weight:500;font-size:15px;margin-bottom:14px}
.field input,.field select,.field textarea{display:block;width:100%;margin-top:6px;padding:12px 14px;border:1.5px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);font:400 16px "Public Sans",sans-serif}
.note{min-height:1.4em;margin-top:12px;font-size:15px}
@media(max-width:860px){.about{grid-template-columns:1fr;gap:32px}}
.grid5{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:30px}
.card .ic{width:46px;height:46px;border-radius:12px;background:var(--alt);display:grid;place-items:center;margin-bottom:18px}
.card .ic svg{width:24px;height:24px;stroke:var(--brand);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.card h3{font-size:21px;margin-bottom:10px}
.card p{color:var(--muted);margin:0 0 14px;font-size:16px}
.card ul{margin:0;padding-left:18px;color:var(--muted);font-size:15px}
@media(max-width:940px){.grid5{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.grid5{grid-template-columns:1fr}}
.certs{display:flex;align-items:center;gap:36px;flex-wrap:wrap;justify-content:center}
.cert{display:flex;align-items:center;gap:16px;background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:18px 26px}
.cert img{height:64px;width:auto;display:block}
.cert b{font:800 18px Manrope,sans-serif;display:block}
.cert span{font-size:14px;color:var(--muted)}
.cta-band{background:var(--brand);color:var(--brand-ink);padding:64px 0}
.cta-band .wrap{display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap}
.cta-band h2{font-size:clamp(26px,3.4vw,38px);max-width:22ch}
.cta-band ul{list-style:none;padding:0;margin:14px 0 0;display:flex;gap:10px 26px;flex-wrap:wrap;font-weight:500}
.cta-band .btn{background:#fff;color:#0a3532}
.why{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.why ul{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.why li{padding-left:34px;position:relative}
.why li::before{content:"";position:absolute;left:4px;top:.5em;width:15px;height:8px;border-left:3px solid var(--brand);border-bottom:3px solid var(--brand);transform:rotate(-45deg)}
.badge{background:var(--deep);color:#fff;border-radius:20px;padding:44px;text-align:center}
.badge b{display:block;font:800 34px Manrope,sans-serif;color:var(--accent);line-height:1.2}
.badge span{color:#cfe5df}
@media(max-width:860px){.why{grid-template-columns:1fr}}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.quote{background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:28px;margin:0}
.quote p{margin:0 0 18px;color:var(--ink)}
.quote b{display:block;font-family:Manrope,sans-serif}.quote span{font-size:14px;color:var(--muted)}
@media(max-width:900px){.quotes{grid-template-columns:1fr}}
.site-footer{background:var(--deep);color:#cfe5df;padding:60px 0 30px;font-size:16px}
.site-footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:36px}
.site-footer h4{margin:0 0 14px;font:800 17px Manrope,sans-serif;color:#fff}
.site-footer p,.site-footer ul{margin:0;padding:0;list-style:none}.site-footer li{margin-bottom:6px}
.site-footer a{text-decoration:none}.site-footer a:hover{text-decoration:underline}
.site-footer .brand span{color:#fff}
.copy{border-top:1px solid rgba(255,255,255,.15);margin-top:40px;padding-top:20px;font-size:14px}
@media(max-width:900px){.site-footer .cols{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.site-footer .cols{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.btn.light{background:#fff;color:#0a3532}.btn.line{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.7)}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px 12px;z-index:99}
.admin-bar .site-header{top:32px}
.brand span{font:800 13px Manrope,sans-serif;color:var(--brand);margin-top:4px;display:block}
.brand{display:flex;flex-direction:column;align-items:flex-start;text-decoration:none}
.brand img{height:52px;width:auto}
#primary-nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0}
#primary-nav a{text-decoration:none;color:var(--muted);font-weight:500;font-size:15px}
#primary-nav .current-menu-item>a,#primary-nav a:hover{color:var(--ink)}
.menu-toggle{display:none;background:none;border:1.5px solid var(--line);border-radius:10px;width:44px;height:44px;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.menu-toggle span{display:block;width:20px;height:2px;background:var(--ink)}
@media(max-width:860px){.menu-toggle{display:flex;margin-left:auto}.hdr-cta{display:none}#primary-nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);padding:12px 24px}#primary-nav.open{display:block}#primary-nav ul{flex-direction:column;gap:14px}.site-header{position:sticky}}
.site-footer .brand img{background:#fff;border-radius:12px;padding:6px}
.site-footer .brand span{color:#fff}.social a{margin-right:14px}
.card.hl{background:var(--brand);color:var(--brand-ink);border:0}.card.hl p{color:inherit}.card.hl h3{margin-bottom:12px}
.head.center{margin-inline:auto;text-align:center}
.msg{padding:12px 14px;border-radius:10px;font-size:15px;margin:0 0 16px}.msg.ok{background:#e3f5ec;color:#0b5a3b}.msg.bad{background:#fdecea;color:#9a2a1f}
.info{display:grid;gap:16px}.info b{display:block;font-family:Manrope,sans-serif}.info a{text-decoration:none}
.plain{padding-top:56px;padding-bottom:56px}
.brugon-sec{--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;--gap:0px;--content-width:100%;--margin-top:0px;--margin-bottom:0px}
.brugon-sec>.elementor-widget{margin:0;width:100%}
.elementor-widget[class*="elementor-widget-brugon_"]{width:100%;margin:0}
.elementor-widget[class*="elementor-widget-brugon_"] section{padding:84px 0}
.slide small,.head small{text-transform:uppercase;letter-spacing:.08em}
