/* ============================================================================
   AKTION ENGENHARIA — site institucional
   Paleta ......... Aktion Minimal (azul #045086, amarelo #FFC724, carvão, ardósia)
   Estrutura ...... tokens e componentes no padrão do atlas-ds.css (prefixo --ak-)
   Regra .......... um único destaque amarelo por tela; amarelo nunca como texto
                    sobre branco — sempre preenchimento com texto carvão/navy
   ========================================================================= */

:root{
  /* ---- Marca ---- */
  --ak-blue:        #045086;   /* Azul Aktion — títulos, links, barras    */
  --ak-blue-deep:   #02263D;   /* fundo de hero e rodapé                  */
  --ak-blue-soft:   #E7F1F9;
  --ak-yellow:      #FFC724;   /* Amarelo Aktion — único destaque         */
  --ak-yellow-hover:#E6A800;

  /* ---- Texto ---- */
  --ak-charcoal:    #36454F;   /* texto corrido                           */
  --ak-slate:       #5F6E7D;   /* ardósia corrigida (#708090 reprova AA)  */
  --ak-text-inv:    #FFFFFF;

  /* ---- Superfícies ---- */
  --ak-bg:          #FFFFFF;
  --ak-bg-alt:      #F5F7F9;
  --ak-border:      #D3D3D3;   /* cinza claro — divisores                 */

  /* ---- Elevação (tonal + contorno, como no ATLAS) ---- */
  --ak-elev-1:      0 1px 2px rgba(4,80,134,.06);
  --ak-elev-2:      0 6px 18px -6px rgba(4,80,134,.18), 0 1px 2px rgba(4,80,134,.06);

  /* ---- Tipografia ---- */
  --ak-font:        'Montserrat', 'DejaVu Sans', system-ui, sans-serif;
  --ak-mono:        'JetBrains Mono', ui-monospace, monospace;

  /* ---- Forma e ritmo ---- */
  --ak-radius:      8px;
  --ak-radius-lg:   14px;
  --ak-wrap:        1160px;
  --ak-gutter:      clamp(16px, 4vw, 32px);

  color-scheme: light;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:80px; }
body{
  margin:0; background:var(--ak-bg); color:var(--ak-charcoal);
  font:400 16px/1.65 var(--ak-font); -webkit-font-smoothing:antialiased;
}
img,svg{ display:block; max-width:100%; }
a{ color:var(--ak-blue); }
h1,h2,h3{ color:var(--ak-blue); line-height:1.15; margin:0 0 .5em; letter-spacing:-.01em; }
h1{ font-size:clamp(2rem, 5vw, 3.4rem); font-weight:800; }
h2{ font-size:clamp(1.6rem, 3.4vw, 2.4rem); font-weight:800; }
h3{ font-size:1.1rem; font-weight:700; }
p{ margin:0 0 1em; }
:focus-visible{ outline:3px solid var(--ak-blue); outline-offset:3px; border-radius:4px; }

.ak-wrap{ max-width:var(--ak-wrap); margin:0 auto; padding:0 var(--ak-gutter); }
.ak-section{ padding:clamp(56px, 9vw, 104px) 0; }
.ak-section--alt{ background:var(--ak-bg-alt); }
.ak-overline{
  display:inline-block; font:600 .78rem/1 var(--ak-mono); letter-spacing:.12em;
  text-transform:uppercase; color:var(--ak-slate); margin-bottom:14px;
}
.ak-lead{ font-size:1.12rem; max-width:62ch; }
.ak-skip{ position:absolute; left:-9999px; }
.ak-skip:focus{ left:16px; top:16px; z-index:100; background:#fff; padding:8px 12px; }

/* ---- Cabeçalho ---- */
.ak-header{
  position:sticky; top:0; z-index:50; background:rgba(255,255,255,.94);
  backdrop-filter:saturate(1.4) blur(8px); border-bottom:1px solid var(--ak-border);
}
.ak-header .ak-wrap{ display:flex; align-items:center; justify-content:space-between; height:68px; gap:16px; }
.ak-logo{ color:var(--ak-blue); display:block; width:150px; }
.ak-logo svg{ width:100%; height:auto; }
.ak-nav{ display:flex; gap:clamp(12px, 3vw, 32px); align-items:center; }
.ak-nav a{ color:var(--ak-charcoal); text-decoration:none; font-weight:600; font-size:.95rem; }
.ak-nav a:hover{ color:var(--ak-blue); }

/* ---- Botões ---- */
.ak-btn{
  display:inline-flex; align-items:center; gap:8px; padding:13px 22px; border-radius:var(--ak-radius);
  font:700 .95rem/1 var(--ak-font); text-decoration:none; border:2px solid transparent;
  transition:background .15s, color .15s, border-color .15s;
}
.ak-btn--primary{ background:var(--ak-yellow); color:var(--ak-blue-deep); }
.ak-btn--primary:hover{ background:var(--ak-yellow-hover); }
.ak-btn--ghost{ color:#fff; border-color:rgba(255,255,255,.45); }
.ak-btn--ghost:hover{ border-color:#fff; }
.ak-btn--outline{ color:var(--ak-blue); border-color:var(--ak-blue); }
.ak-btn--outline:hover{ background:var(--ak-blue); color:#fff; }

/* ---- Hero ---- */
.ak-hero{
  position:relative; overflow:hidden; color:#fff;
  background:linear-gradient(135deg, var(--ak-blue-deep) 0%, var(--ak-blue) 100%);
  padding:clamp(72px, 12vw, 140px) 0 clamp(64px, 10vw, 120px);
}
/* malha 3×3 do módulo — mesma geometria do ícone AK */
.ak-hero::after{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.09;
  background-image:
    linear-gradient(#fff 1px, transparent 1px),
    linear-gradient(90deg, #fff 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(90deg, transparent 30%, #000 100%);
}
.ak-hero .ak-wrap{ position:relative; z-index:1; }
.ak-hero h1{ color:#fff; max-width:18ch; }
.ak-hero .ak-overline{ color:#AECBE4; }
.ak-hero .ak-lead{ color:#DCE8F2; }
.ak-hero__cta{ display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }

/* ---- Sobre ---- */
.ak-about{ display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(32px, 6vw, 72px); align-items:start; }
.ak-benefits{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.ak-benefits li{
  display:flex; gap:14px; align-items:flex-start; padding:16px 18px; background:var(--ak-bg);
  border:1px solid var(--ak-border); border-left:4px solid var(--ak-blue); border-radius:var(--ak-radius);
  font-weight:500;
}
.ak-benefits svg{ flex:none; width:22px; height:22px; color:var(--ak-blue); margin-top:1px; }

/* ---- Números (o destaque amarelo da página) ---- */
.ak-stats{ display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; margin-top:40px; }
.ak-stat{
  padding:28px 24px; border-radius:var(--ak-radius-lg); background:var(--ak-bg);
  border:1px solid var(--ak-border); box-shadow:var(--ak-elev-1);
}
.ak-stat--key{ background:var(--ak-yellow); border-color:var(--ak-yellow); }
.ak-stat--key .ak-stat__value, .ak-stat--key .ak-stat__label{ color:var(--ak-blue-deep); }
.ak-stat__value{
  display:block; font:700 clamp(2.2rem, 4.5vw, 3rem)/1 var(--ak-mono); color:var(--ak-blue);
  letter-spacing:-.03em; margin-bottom:12px;
}
.ak-stat__label{ color:var(--ak-charcoal); font-weight:500; }

.ak-highlights{ display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; margin-top:20px; }
.ak-highlight{ padding:22px 24px; border-top:3px solid var(--ak-blue); background:var(--ak-bg-alt); border-radius:0 0 var(--ak-radius) var(--ak-radius); }
.ak-highlight h3{ margin-bottom:.35em; }
.ak-highlight p{ margin:0; color:var(--ak-slate); font-size:.95rem; }

/* ---- Serviços ---- */
.ak-services{ display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; margin-top:40px; }
.ak-service{
  display:flex; flex-direction:column; padding:28px 26px; background:var(--ak-bg);
  border:1px solid var(--ak-border); border-radius:var(--ak-radius-lg);
  transition:box-shadow .2s, transform .2s, border-color .2s;
}
.ak-service:hover{ box-shadow:var(--ak-elev-2); transform:translateY(-2px); border-color:#B7C9D9; }
.ak-service__num{ font:600 .8rem/1 var(--ak-mono); color:var(--ak-slate); margin-bottom:18px; letter-spacing:.08em; }
.ak-service__icon{
  width:44px; height:44px; border-radius:10px; background:var(--ak-blue-soft); color:var(--ak-blue);
  display:grid; place-items:center; margin-bottom:18px;
}
.ak-service__icon svg{ width:24px; height:24px; }
.ak-service p{ margin:0; color:var(--ak-slate); font-size:.95rem; }

/* ---- Contato ---- */
.ak-contact{
  display:grid; grid-template-columns:1.2fr 1fr; gap:clamp(32px, 6vw, 64px); align-items:center;
  padding:clamp(32px, 5vw, 56px); border-radius:var(--ak-radius-lg); background:var(--ak-blue); color:#fff;
}
.ak-contact h2{ color:#fff; }
.ak-contact p{ color:#DCE8F2; }
.ak-contact__list{ list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.ak-contact__list li{ display:flex; flex-direction:column; gap:2px; padding-bottom:14px; border-bottom:1px solid rgba(255,255,255,.18); }
.ak-contact__list li:last-child{ border-bottom:0; padding-bottom:0; }
.ak-contact__list span{ font:600 .72rem/1 var(--ak-mono); letter-spacing:.12em; text-transform:uppercase; color:#AECBE4; }
.ak-contact__list a, .ak-contact__list strong{ color:#fff; font-weight:600; text-decoration:none; word-break:break-word; }
.ak-contact__list a:hover{ text-decoration:underline; }
.ak-contact .ak-btn--outline{ color:#fff; border-color:#fff; }
.ak-contact .ak-btn--outline:hover{ background:#fff; color:var(--ak-blue); }

/* ---- Rodapé ---- */
.ak-footer{ background:var(--ak-blue-deep); color:#B9CADA; padding:48px 0 32px; font-size:.92rem; }
.ak-footer .ak-wrap{ display:grid; gap:28px; }
.ak-footer__top{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:24px; }
.ak-footer .ak-logo{ color:#fff; width:140px; }
.ak-footer nav{ display:flex; gap:24px; flex-wrap:wrap; }
.ak-footer a{ color:#DCE8F2; text-decoration:none; }
.ak-footer a:hover{ color:#fff; text-decoration:underline; }
.ak-social{ display:flex; gap:10px; }
.ak-social a{
  width:40px; height:40px; display:grid; place-items:center; border-radius:50%;
  border:1px solid rgba(255,255,255,.25);
}
.ak-social a:hover{ border-color:#fff; text-decoration:none; }
.ak-social svg{ width:18px; height:18px; fill:currentColor; }
.ak-footer__bottom{ border-top:1px solid rgba(255,255,255,.14); padding-top:20px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; }
.ak-footer__bottom span{ font-family:var(--ak-mono); font-size:.82rem; }

/* ---- Responsivo ---- */
@media (max-width: 900px){
  .ak-about, .ak-contact{ grid-template-columns:1fr; }
  .ak-services, .ak-highlights{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width: 640px){
  .ak-stats, .ak-services, .ak-highlights{ grid-template-columns:1fr; }
  .ak-nav a:not(.ak-btn){ display:none; }
  .ak-nav .ak-btn{ padding:10px 14px; font-size:.88rem; }
  .ak-logo{ width:124px; }
}
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .ak-service{ transition:none; }
  .ak-service:hover{ transform:none; }
}
