/* Hulk Pare-Brise — unified 2026 visual layer */
:root {
  --default-font: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --heading-font: "Manrope", system-ui, sans-serif;
  --nav-font: "Manrope", system-ui, sans-serif;
  --background-color: #f6f9f7;
  --default-color: #34423a;
  --heading-color: #142219;
  --accent-color: #16833a;
  --surface-color: #ffffff;
  --contrast-color: #ffffff;
  --hp-green: #16833a;
  --hp-green-dark: #0b5b28;
  --hp-green-soft: #eaf7ee;
  --hp-gold: #f5c842;
  --hp-ink: #142219;
  --hp-muted: #66736b;
  --hp-line: #dde7e0;
  --hp-radius: 18px;
  --hp-shadow: 0 18px 50px rgba(20, 65, 35, .10);
}

html { scroll-padding-top: 88px; }
body { overflow-x: hidden; background: #f6f9f7; font-size: 16px; line-height: 1.65; }
body::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(circle at 8% 12%, rgba(22,131,58,.08), transparent 28rem); }
h1,h2,h3,h4,h5,h6 { color: var(--hp-ink); font-weight: 800; letter-spacing: -.035em; }
p { color: var(--hp-muted); }
a,button,.btn { touch-action: manipulation; }
a:focus-visible,button:focus-visible,.btn:focus-visible,.form-control:focus,.form-select:focus { outline: 3px solid rgba(22,131,58,.24); outline-offset: 3px; }

/* Header and navigation */
.header { min-height: 76px !important; height: auto !important; padding: 8px 0 !important; background: rgba(9,73,31,.96) !important; border-bottom: 1px solid rgba(255,255,255,.12); box-shadow: 0 8px 30px rgba(8,45,21,.12); backdrop-filter: blur(14px); }
.header .container-xl { min-height: 60px; }
.header .logo { min-height: 48px; }
.header .logo .sitename { margin: 0; color: #fff !important; font-family: var(--heading-font) !important; font-size: 1.2rem; font-weight: 800; letter-spacing: -.04em; text-transform: uppercase; }
.header .logo .sitename span { color: #6ae181 !important; }
.header .logo-bg { width: 230px !important; height: 60px !important; background-size: contain !important; filter: drop-shadow(0 3px 8px rgba(0,0,0,.08)); }
.navmenu a { min-height: 44px; display: flex !important; align-items: center; color: rgba(255,255,255,.82) !important; font-family: var(--nav-font); font-size: .9rem !important; font-weight: 700 !important; border-radius: 10px; transition: color .2s, background-color .2s; }
.navmenu a:hover,.navmenu a.active { color: #fff !important; background: rgba(255,255,255,.10); }
.mobile-nav-toggle { width: 46px; height: 46px; display: grid; place-items: center; color: #fff !important; border: 1px solid rgba(255,255,255,.22); border-radius: 12px; }
.header .btn-getstarted,.navmenu .btn-getstarted { min-height: 46px; display: inline-flex !important; align-items: center; justify-content: center; padding: 0 20px !important; color: #26310d !important; background: linear-gradient(135deg,#ffdb66,var(--hp-gold)) !important; border: 0; border-radius: 12px !important; font-weight: 800 !important; box-shadow: 0 8px 22px rgba(245,200,66,.2); }

/* Page rhythm */
.main { min-height: calc(100vh - 76px); }
.section { padding: 88px 0; }
.light-background { --background-color: #edf5ef; }
.section-title { padding-bottom: 42px; }
.section-title h2 { font-size: clamp(1.75rem,4vw,2.55rem); }
.section-title h2::after { width: 54px; height: 4px; border-radius: 99px; }
.section-title p { max-width: 680px; margin-inline: auto; }

/* Homepage */
.hero { min-height: min(820px,100vh); padding-top: 140px !important; padding-bottom: 70px !important; color: var(--hp-ink) !important; background: radial-gradient(circle at 78% 28%,rgba(22,131,58,.13),transparent 28rem),linear-gradient(145deg,#fff 0%,#eef7f0 100%) !important; }
.hero h2 { max-width: 690px; color: var(--hp-ink) !important; font-size: clamp(2.1rem,5vw,4.25rem) !important; line-height: 1.05 !important; letter-spacing: -.055em; }
.hero p { color: var(--hp-muted) !important; font-size: clamp(1rem,2vw,1.2rem) !important; }
.hero ul { display: grid; gap: 9px; margin: 22px 0; padding: 0; list-style: none; color: #35443a; }
.hero ul li { position: relative; padding-left: 30px; }
.hero ul li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 21px; height: 21px; display: grid; place-items: center; color: #fff; background: var(--hp-green); border-radius: 50%; font-size: .72rem; font-weight: 900; }
.hero .btn-get-started { min-height: 54px; display: inline-flex; align-items: center; justify-content: center; padding: 0 22px !important; color: #26310d !important; background: linear-gradient(135deg,#ffdc6e,var(--hp-gold)) !important; border: 0 !important; border-radius: 13px !important; font-weight: 800 !important; box-shadow: 0 11px 26px rgba(182,141,13,.18); transition: transform .2s,box-shadow .2s; }
.hero .hero-img img { filter: drop-shadow(0 28px 36px rgba(20,65,35,.16)); }
.clients { padding: 25px 0; background: #fff !important; border-block: 1px solid var(--hp-line); }
.clients img { opacity: .65; filter: grayscale(1); transition: .25s; }
.clients img:hover { opacity: 1; filter: none; }
.about .content,.about .col-lg-6:last-child { padding: clamp(22px,4vw,36px); background: #fff; border: 1px solid var(--hp-line); border-radius: var(--hp-radius); box-shadow: 0 12px 36px rgba(20,65,35,.06); }
.about .row { align-items: stretch; }
.about .read-more { min-height: 48px; display: inline-flex; align-items: center; gap: 10px; padding: 0 18px; border-radius: 11px; }
.service-item,.icon-box,.team-member,.testimonial-item,.portfolio-content { border: 1px solid var(--hp-line) !important; border-radius: var(--hp-radius) !important; box-shadow: 0 12px 38px rgba(20,65,35,.07) !important; overflow: hidden; transition: transform .25s,box-shadow .25s !important; }
.service-item:hover,.icon-box:hover,.portfolio-content:hover { transform: translateY(-5px); box-shadow: var(--hp-shadow) !important; }
.cta { border-radius: 0; }

/* Admin pages, cards and data tables */
.main > br,.main > .container-xxl > br { display: none; }
.main > .container-xxl,.main > .container { padding-top: 120px !important; padding-bottom: 64px !important; }
.main .text-center h6 { display: inline-flex; margin-bottom: 12px; padding: 7px 12px; color: var(--hp-green-dark) !important; background: var(--hp-green-soft); border-radius: 99px; font-size: .76rem; font-weight: 800; letter-spacing: .07em; }
.main .text-center h1 { max-width: 800px; margin-inline: auto; font-size: clamp(1.7rem,4vw,2.65rem); }
.card { background: #fff; border: 1px solid var(--hp-line) !important; border-radius: var(--hp-radius) !important; box-shadow: var(--hp-shadow) !important; overflow: hidden; }
.card-header { padding: 18px 22px; border: 0; font-weight: 800; }
.card-header.bg-success { background: linear-gradient(135deg,var(--hp-green),var(--hp-green-dark)) !important; }
.card-body { padding: clamp(20px,4vw,30px); }
.form-control,.form-select { min-height: 50px; padding: 11px 14px; color: var(--hp-ink); background-color: #fbfdfb; border: 1px solid #cad8ce; border-radius: 11px; font-size: 16px; box-shadow: none; }
textarea.form-control { min-height: 110px; }.form-control:focus,.form-select:focus { background:#fff; border-color:var(--hp-green); box-shadow:0 0 0 4px rgba(22,131,58,.11); outline:0; }
.btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 9px 16px; border-radius: 10px; font-weight: 750; transition: transform .2s,box-shadow .2s,background-color .2s; }
.btn-success { background: var(--hp-green); border-color: var(--hp-green); }.btn-success:hover { background: var(--hp-green-dark); border-color: var(--hp-green-dark); }
.btn-danger { background: #c83d38; border-color: #c83d38; }.btn-sm { min-width: 44px; min-height: 44px; }
.alert { border: 0; border-radius: 13px; box-shadow: 0 8px 24px rgba(20,65,35,.06); }
.table { margin-top: 20px !important; background: #fff; border: 1px solid var(--hp-line); border-collapse: separate; border-spacing: 0; border-radius: 16px; overflow: hidden; box-shadow: 0 15px 40px rgba(20,65,35,.07); }
.table thead th { padding: 16px 14px; color: #405048; background: #edf4ef !important; border-bottom: 1px solid var(--hp-line); font-size: .78rem; letter-spacing: .035em; text-transform: uppercase; }
.table tbody td { padding: 14px; border-color: #edf1ee; }.table tbody tr { transition: background-color .18s; }.table tbody tr:hover { background: #f4faf6; }.table a { font-weight: 700; }
.dataTables_wrapper .dataTables_filter input,.dataTables_wrapper .dataTables_length select { min-height: 42px; border: 1px solid #cad8ce !important; border-radius: 9px; background: #fff; }
.page-link { color: var(--hp-green-dark); border-radius: 8px; margin: 0 2px; }.active>.page-link,.page-link.active { background:var(--hp-green);border-color:var(--hp-green); }

/* Login */
body:has(form[action*="login"]) .main { background: radial-gradient(circle at 20% 18%,rgba(22,131,58,.1),transparent 28rem); }
body:has(form[action*="login"]) .main .container { max-width: 980px; }
body:has(form[action*="login"]) .main img { width: min(420px,90%); max-height: 240px; object-fit: contain; filter: drop-shadow(0 18px 24px rgba(20,65,35,.14)); }
body:has(form[action*="login"]) .col-md-6 { width: min(100%,520px); }
body:has(form[action*="login"]) form { padding: clamp(22px,5vw,38px); background:#fff; border:1px solid var(--hp-line); border-radius:20px; box-shadow:var(--hp-shadow); }

.scroll-top { width: 48px; height: 48px; right: 18px; bottom: 18px; background: var(--hp-green); border-radius: 14px; box-shadow: 0 10px 25px rgba(13,92,41,.25); }
.footer { color: rgba(255,255,255,.76); background: #0b3c20 !important; }
.footer .footer-top { padding-top: 64px; }.footer h4,.footer .sitename { color:#fff !important; }.footer a { color:rgba(255,255,255,.74) !important; }.footer a:hover { color:#75e68b !important; }.footer .copyright { border-top:1px solid rgba(255,255,255,.1); }.footer .social-links a { width:44px;height:44px;border-color:rgba(255,255,255,.24); }

@media (max-width:1199px) {
  .navmenu ul { background:#fff !important; border:1px solid var(--hp-line); border-radius:16px !important; box-shadow:0 22px 55px rgba(20,65,35,.18); }
  .navmenu a { color:var(--hp-ink) !important; margin:3px 8px; }.navmenu a:hover,.navmenu a.active { color:var(--hp-green-dark) !important; background:var(--hp-green-soft); }
  .navmenu .btn-getstarted { margin:8px !important; }
}
@media (max-width:767px) {
  .header { min-height:66px !important; }.header .container-xl { min-height:50px; }.header .logo-bg { width:170px !important;height:48px !important; }.header .logo .sitename{font-size:1rem;}
  .section { padding:64px 0; }.hero { min-height:auto;padding:105px 0 58px !important;text-align:left !important; }.hero h2{font-size:clamp(2rem,11vw,3rem)!important}.hero .d-flex.mt-3{display:grid!important;gap:10px;width:100%}.hero .btn-get-started{width:100%;margin-left:0!important;text-align:center}.hero .hero-img{margin-bottom:8px}.hero .hero-img img{max-height:290px}
  .about .content,.about .col-lg-6:last-child { padding:22px; }.main > .container-xxl,.main > .container { padding-top:96px !important; }.main .text-center h1{margin-bottom:28px!important}.table{min-width:680px}.dataTables_wrapper{overflow-x:auto;padding-bottom:8px}.dataTables_wrapper>.row{min-width:680px}.card-body{padding:20px}.btn{min-height:48px}.scroll-top{bottom:calc(14px + env(safe-area-inset-bottom));}
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; } }
