:root {
  --color-primary: #ffc107;
  --color-secondary: #222831;
  --color-background: #f7f7f7;
  --color-text: #2e2e2e;
  --color-accent: #1976d2;
  --color-emphasis: #ff6f00;
  --color-white: #fff;
  --font-body: "Inter", Arial, sans-serif;
  --font-heading: "Roboto Slab", Georgia, serif;
  --space-1: .5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-6: 3rem;
  --radius: .5rem;
  --shadow: 0 4px 16px rgb(0 0 0 / 12%);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--color-background); color: var(--color-text); font-family: var(--font-body); line-height: 1.5; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.container { width: min(100% - 2rem, 1120px); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.skip-link { position: fixed; z-index: 20; top: 0; left: var(--space-2); padding: var(--space-2); background: var(--color-primary); color: var(--color-secondary); transform: translateY(-120%); }
.skip-link:focus { transform: translateY(0); }
.site-header { position: sticky; z-index: 10; top: 0; background: var(--color-secondary); box-shadow: var(--shadow); }
.site-header__inner { display: flex; min-height: 4.5rem; align-items: center; justify-content: space-between; gap: var(--space-2); }
.brand { flex: 0 0 auto; }
.brand img { width: 160px; height: 40px; object-fit: contain; object-position: left center; }
.menu-toggle { display: grid; width: 44px; height: 44px; padding: 10px; place-content: center; gap: 4px; border: 0; border-radius: var(--radius); background: transparent; cursor: pointer; }
.menu-toggle span:not(.sr-only) { display: block; width: 24px; height: 2px; background: var(--color-white); }
.main-nav { display: none; position: absolute; top: 100%; right: 0; left: 0; padding: var(--space-2); background: var(--color-secondary); border-top: 1px solid rgb(255 255 255 / 15%); }
.main-nav.is-open { display: block; }
.main-nav__list { display: grid; margin: 0; padding: 0; list-style: none; }
.main-nav a { display: flex; min-height: 44px; align-items: center; padding: 0 var(--space-2); color: var(--color-white); text-decoration: none; border-radius: var(--radius); }
.main-nav a:hover, .main-nav a[aria-current="page"] { background: var(--color-primary); color: var(--color-secondary); font-weight: 700; }
.section { padding-block: var(--space-6); }
.section--muted { background: var(--color-white); }
.section--hero { min-height: 18rem; display: grid; align-items: center; background: var(--color-secondary); color: var(--color-white); }
h1, h2, h3 { margin: 0 0 var(--space-2); font-family: var(--font-heading); line-height: 1.2; }
h1 { font-size: clamp(2rem, 6vw, 3.5rem); }
h2 { font-size: clamp(1.5rem, 4vw, 2.25rem); }
.site-footer { padding-block: var(--space-4); background: var(--color-secondary); color: var(--color-white); }
.site-footer p { margin: 0 0 var(--space-1); }
.whatsapp-float { position: fixed; z-index: 9; right: var(--space-2); bottom: var(--space-2); display: inline-flex; min-width: 44px; min-height: 44px; align-items: center; justify-content: center; padding: 0 var(--space-2); border-radius: 999px; background: #25d366; color: #102b19; box-shadow: var(--shadow); font-weight: 700; text-decoration: none; }
.whatsapp-float:hover { background: #1ebe5d; }

@media (min-width: 768px) { .menu-toggle { display: none; } .main-nav { display: block; position: static; padding: 0; border: 0; } .main-nav__list { display: flex; gap: var(--space-1); } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }
.hero{position:relative;display:grid;min-height:37rem;overflow:hidden;align-items:center;color:var(--color-white);background:var(--color-secondary)}.hero__image,.hero__overlay{position:absolute;inset:0;width:100%;height:100%}.hero__image{object-fit:cover;object-position:68% center}.hero__overlay{background:linear-gradient(90deg,rgb(18 22 25 / 96%),rgb(18 22 25 / 20%))}.hero__content{position:relative;max-width:48rem;padding-block:var(--space-6)}.hero__text{font-size:1.2rem}.eyebrow{color:var(--color-emphasis);font-size:.82rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.hero .eyebrow{color:var(--color-primary)}.button-group{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3)}.button{display:inline-flex;min-height:46px;align-items:center;justify-content:center;padding:.65rem 1.1rem;border:2px solid transparent;border-radius:var(--radius);font-weight:700;text-decoration:none}.button--primary{background:var(--color-primary);color:var(--color-secondary)}.button--outline{border-color:#fff;color:#fff}.section-heading{max-width:44rem;margin-bottom:var(--space-4)}.card-grid{display:grid;gap:var(--space-2)}.card{padding:var(--space-3);border-radius:var(--radius);background:var(--color-white);box-shadow:var(--shadow)}.brand-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-2);padding:0;list-style:none}.brand-grid li{display:grid;min-height:5rem;place-items:center;border:1px solid #ddd;border-radius:var(--radius);font-family:var(--font-heading)}.pillar{padding:var(--space-3);border-left:4px solid var(--color-primary);background:var(--color-secondary);color:#fff}.section--call{background:var(--color-secondary);color:#fff}.callout{display:grid;gap:var(--space-3)}.callout__actions{display:grid;align-content:center;justify-items:start;gap:var(--space-2)}.phone-link{color:#fff;font-size:1.2rem;font-weight:700}.testimonial{max-width:52rem;text-align:center}.testimonial blockquote{font-family:var(--font-heading);font-size:clamp(1.35rem,3vw,2rem)}@media (min-width:768px){.card-grid--services,.card-grid--pillars{grid-template-columns:repeat(2,1fr)}.brand-grid{grid-template-columns:repeat(5,1fr)}.callout{grid-template-columns:1.5fr 1fr;align-items:center}}@media (min-width:1024px){.card-grid--services,.card-grid--pillars{grid-template-columns:repeat(4,1fr)}}
