/* Revision 03: existing institutional colors, fonts and card treatments retained. */
:root { --header-offset: 6.5rem; }
html { scroll-behavior: smooth; }
[hidden] { display: none !important; }
section[id], [id="execucao"], [id="projetos-engenharia"], [id="estruturas-metalicas"], #conteudo-principal {
  scroll-margin-top: var(--header-offset);
}
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid #075382;
  outline-offset: 4px;
}
footer a:focus-visible { outline-color: #38BDF8; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: rgba(14,131,200,.14); }
button { cursor: pointer; }
a, button, input, select, textarea { touch-action: manipulation; }
h1, h2, h3, p, a, button { overflow-wrap: anywhere; }
main:focus { outline: none; }
.skip-link { position: fixed; top: 1rem; left: 1rem; transform: translateY(-180%); z-index: 100; background: #fff; color: #075382; padding: .875rem 1.25rem; border-radius: .75rem; font-weight: 700; box-shadow: 0 4px 20px #0A254033; }
.skip-link:focus { transform: translateY(0); }
.header-layout { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; min-height: 5rem; padding-top: .75rem; padding-bottom: .75rem; }
.site-brand { flex-shrink: 1; min-width: 0; max-width: 100%; }
.site-brand > div:first-child { flex-shrink: 0; }
.site-brand > div:last-child { min-width: 0; }
.site-brand span { overflow-wrap: anywhere; }
img { max-width: 100%; height: auto; }
svg { max-width: 100%; }
main .flex > span[data-i18n], #topbar .flex > span[data-i18n] { min-width: 0; overflow-wrap: anywhere; }
.badge-soft { max-width: 100%; }
#hero .badge-soft > span[data-i18n] { min-width: 0; flex-shrink: 1; overflow-wrap: anywhere; }
.navigation-toggle { display: none; align-items: center; gap: .5rem; justify-content: center; min-width: 5rem; min-height: 44px; border-radius: .65rem; border: 1px solid #64748B; color: #075382; font-size: .8125rem; font-weight: 700; padding: .5rem .75rem; background: #fff; margin-left: auto; }
.navigation-panel { display: flex; align-items: center; flex-wrap: wrap; width: 100%; gap: .75rem; }
.site-nav { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; font-size: .875rem; font-weight: 500; line-height: 1.5; color: #475569; }
.nav-link { display: inline-flex; align-items: center; min-height: 44px; gap: .375rem; padding: .5rem .25rem; transition: color .25s ease; }
.nav-link:hover, .nav-link[aria-current="location"] { color: #075382; }
.services-disclosure { position: relative; }
.services-toggle { background: none; border: 0; font: inherit; color: inherit; }
.services-toggle[aria-expanded="true"] > svg { transform: rotate(180deg); }
.services-links { position: absolute; top: 100%; left: 0; z-index: 60; width: 19rem; max-width: calc(100vw - 3rem); padding: .5rem; border-radius: .75rem; border: 1px solid #E2E8F0; background: #fff; box-shadow: 0 12px 28px -8px #0A254026; }
.services-links a { display: flex; align-items: center; min-height: 44px; border-radius: .5rem; padding: .625rem .75rem; font-size: .8125rem; line-height: 1.5; color: #334155; }
.services-links a:hover { color: #075382; background: #F0F7FD; }
.language-switch { display: flex; align-items: center; gap: .25rem; flex-shrink: 0; }
.language-button { display: inline-flex; flex-direction: column; gap: 2px; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border-radius: .65rem; border: 1px solid transparent; background: transparent; }
.language-code { color: #334155; font-size: 9px; font-weight: 700; line-height: 1; }
.language-button svg { border-radius: 2px; }
.language-button[aria-pressed="true"] { background: #E0F0FA; border-color: #075382; box-shadow: inset 0 -3px #075382; }
.nav-whatsapp, .nav-quote { min-height: 44px; }
.nav-whatsapp { white-space: normal; }
#site-header:not(.navigation-ready) .services-links[hidden] { display: block !important; position: static; box-shadow: none; }
#site-header:not(.navigation-ready) .language-switch { display: none; }
#topbar > div { row-gap: .5rem; }
#topbar > div > div { flex-wrap: wrap; min-width: 0; }
#topbar .rounded-full { flex-shrink: 0; }
.card-clean-hover { transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
@media (hover: hover) { .card-clean-hover:hover { transform: translateY(-2px); } }
.form-control { min-height: 44px; }
.field-error { color: #9F1239; font-size: .75rem; line-height: 1.5; margin-top: .375rem; }
.field-error:empty, .form-status:empty { display: none; }
.form-control[aria-invalid="true"] { border-color: #9F1239; border-width: 2px; }
.form-status:not(:empty) { padding: 1rem; background: #F0F7FD; border: 1px solid #075382; border-radius: .75rem; color: #0A2540; }
.form-status.is-error { color: #9F1239; border-color: #9F1239; background: #FFF1F2; }
#contato > div > div > div { min-width: 0; }
input, select, textarea { max-width: 100%; }
footer a { display: inline-flex; align-items: center; min-height: 24px; }
footer li { min-width: 0; }
.floating-contact:focus-visible { outline-color: #0A2540; }
.floating-contact > span { color: white; }
/* Animation starts only on intersection. The default state is fully visible, including without JS. */
@keyframes union-fade-up { from { opacity: .12; transform: translateY(var(--reveal-distance, 32px)); } to { opacity: 1; transform: none; } }
@keyframes union-slide-left { from { opacity: .12; transform: translateX(calc(-1 * var(--reveal-slide, 30px))); } to { opacity: 1; transform: none; } }
@keyframes union-slide-right { from { opacity: .12; transform: translateX(var(--reveal-slide, 30px)); } to { opacity: 1; transform: none; } }
.reveal-enter { animation: union-fade-up var(--reveal-duration, 1000ms) cubic-bezier(.22,1,.36,1) var(--reveal-delay, 0ms) both; }
.reveal-enter[data-reveal="left"] { animation-name: union-slide-left; }
.reveal-enter[data-reveal="right"] { animation-name: union-slide-right; }
.reveal-enter:focus-within { animation: none; }
@media (max-width: 1279px) {
  .navigation-ready .navigation-toggle { display: inline-flex; }
  .navigation-ready .navigation-panel:not(.is-open) { display: none; }
  .navigation-panel { align-items: stretch; padding-top: .75rem; padding-bottom: .25rem; border-top: 1px solid #E2E8F0; }
  .site-nav { width: 100%; display: flex; flex-direction: column; align-items: stretch; gap: .125rem; }
  .services-disclosure { width: 100%; }
  .nav-link { width: 100%; padding: .625rem .75rem; border-radius: .5rem; }
  .services-toggle { justify-content: space-between; }
  .services-links { position: static; width: 100%; max-width: 100%; margin: .25rem 0 .5rem; box-shadow: none; background: #F8FAFC; }
  .language-switch { width: 100%; }
  .navigation-panel > a { flex: 1 1 11rem; justify-content: center; }
  #site-header { max-height: 100dvh; overflow-y: auto; overscroll-behavior: contain; }
}
@media (min-width: 1280px) {
  .header-layout { flex-wrap: wrap; gap: 2rem; }
  .navigation-panel { flex: 1 1 45rem; flex-wrap: wrap; margin-left: 0; width: auto; min-width: 0; max-width: 100%; gap: .75rem; }
  .site-nav { flex: 0 1 auto; flex-wrap: wrap; min-width: 0; gap: 1rem; }
  .language-switch { margin-left: auto; }
  .nav-whatsapp, .nav-quote { flex-shrink: 0; padding-left: .75rem; padding-right: .75rem; }
}
@media (max-width: 639px) {
  #projetos .flex.items-center.justify-between { flex-wrap: wrap; gap: .5rem; }
  .floating-contact { right: 1rem; bottom: 1rem; padding: .75rem; }
  #contato .contact-form-panel { padding: 1rem; }
}
@media (max-width: 399px) {
  .site-brand { gap: .5rem; }
  .site-brand > div:first-child { width: 2.5rem; height: 2.5rem; }
  .site-brand .text-xl { font-size: 1.125rem; }
  .site-brand .text-\[10px\] { font-size: .5rem; }
  .header-layout { gap: .5rem; }
  .navigation-toggle { min-width: 4rem; padding: .5rem; }
}
/* Shared typography applies only to main section headings, never the Hero or card titles. */
main .section-title {
  font-family: "Space Grotesk", sans-serif;
  font-size: 1.875rem;
  font-weight: 700;
  line-height: 2.25rem;
  letter-spacing: normal;
  color: #0F172A;
}
.site-nav .nav-link { font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; }
main a[href], .nav-whatsapp, .nav-quote, button[type="submit"] { transition-duration: 250ms; }
#projetos .typology-intro { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 640px) {
  main .section-title { font-size: 2.25rem; line-height: 2.5rem; }
}
@media (min-width: 768px) {
  #projetos .typology-intro {
    grid-template-columns: minmax(0, 1fr) minmax(0, min(42%, 28rem));
    column-gap: 1.5rem;
    row-gap: .5rem;
  }
  #projetos .typology-intro > div { display: contents; }
  #projetos .typology-intro > div > span { grid-column: 1; grid-row: 1; }
  #projetos .typology-intro h2 { grid-column: 1; grid-row: 2; margin-top: 0; }
  #projetos .typology-intro > p { grid-column: 2; grid-row: 2; margin: 0; }
}
@media (max-width: 639px) {
  .reveal-enter { --reveal-duration: 950ms; --reveal-distance: 26px; --reveal-slide: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  html.scroll-smooth, html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .reveal-enter { opacity: 1; transform: none; }
  .card-clean-hover:hover, a:hover, .group:hover img { transform: none !important; }
}

/* Revision 04: reserve image space without changing the approved motion system. */
.brand-logo-frame { width: 3rem; height: 3rem; flex-shrink: 0; }
.brand-logo-image { display: block; width: 100%; height: 100%; object-fit: contain; }
.project-cards { display: grid; grid-template-columns: minmax(0, 1fr); grid-auto-rows: 1fr; gap: 2rem; width: 100%; }
.project-card { display: flex; flex-direction: column; min-width: 0; }
.project-card-body { padding: 1.5rem; flex: 1; }
.project-card-heading { display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.project-card-heading h3 { min-width: 0; margin: 0; }
.project-card-heading .card-icon { flex-shrink: 0; width: 3rem; height: 3rem; display: flex; align-items: center; justify-content: center; margin: 0; }
.card-icon > svg { width: 1.5rem; height: 1.5rem; }
.card-image-slot { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: .65rem; background: #F1F5F9; }
.image-placeholder { position: absolute; inset: 0; border: 1px dashed #CBD5E1; border-radius: inherit; background: linear-gradient(135deg, #F8FAFC, #F1F5F9); }
.image-placeholder::before { content: ""; position: absolute; left: 50%; top: 50%; width: 1.75rem; height: 1.25rem; border: 1px solid #CBD5E1; border-radius: .2rem; transform: translate(-50%, -50%); }
.image-placeholder::after { content: ""; position: absolute; left: 50%; top: 50%; width: .7rem; height: .7rem; border-left: 1px solid #CBD5E1; border-top: 1px solid #CBD5E1; transform: translate(-50%, -25%) rotate(45deg); }
.card-image-slot > img { display: block; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.project-card > .card-image-slot { height: 16rem; aspect-ratio: auto; border-radius: 0; flex-shrink: 0; }
/* Thumbnail and existing icon share the original icon band; no card-height increase. */
.compact-card-media { --media-band-height: 4.5rem; display: flex; align-items: flex-start; gap: .75rem; height: var(--media-band-height); }
.compact-card-media--differential { --media-band-height: 4.25rem; }
.compact-card-media .card-icon { flex: 0 0 3rem; height: 3rem; display: flex; align-items: center; justify-content: center; margin: 0; }
.compact-card-media .card-image-slot { flex: 0 1 auto; width: min(calc(var(--media-band-height) * 16 / 9), calc(100% - 3.75rem)); min-width: 0; margin-left: auto; }
@media (min-width: 768px) {
  .project-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .project-cards { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .project-card:first-child { grid-column: 2 / span 2; }
  .project-card:last-child { grid-column: 4 / span 2; }
}
/* Shared track heights align longer journey titles and descriptions without fixed heights. */
@supports (grid-template-rows: subgrid) {
  @media (min-width: 640px) {
    #jornada .journey-grid { row-gap: 0; }
    #jornada .journey-step { display: grid; grid-template-rows: subgrid; grid-row: span 3; padding-bottom: 2rem; }
  }
  @media (min-width: 1280px) {
    #jornada .journey-step { padding-bottom: 0; }
  }
}

/* Revision 05: approved photographs and contact states; no changes to motion parameters. */
.card-image-slot > img.card-photo--contain { object-fit: contain; }
[data-image-slot="steel-fabrication"] > img { object-position: 50% 55%; }
[data-image-slot="steel-assembly"] > img { object-position: 50% 60%; }
#diferenciais .differential-card { padding-top: 1.25rem; padding-bottom: 1.25rem; }
.differential-heading { display: flex; align-items: center; gap: .75rem; margin-bottom: .75rem; }
.differential-heading > .card-icon { flex-shrink: 0; margin: 0; }
.differential-heading h3 { min-width: 0; margin: 0; }
@media (min-width: 1280px) {
  #diferenciais .differential-card { min-height: 16.25rem; }
  .differential-heading { min-height: 5.25rem; }
}
.corp-email { min-width: 0; overflow-wrap: anywhere; }
.corp-email:hover { text-decoration: underline; }
.form-honeypot { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; pointer-events: none; }
button[type="submit"]:disabled { opacity: .7; cursor: wait; }

/* Revision 06: framing for the approved horizontal strengthening photo. */
[data-image-slot="structural-strengthening"] > img { object-fit: cover; object-position: 50% 45%; }