/* BW · formas suaves e movimento
   Ajustes compartilhados por todas as páginas, sem bibliotecas externas. */
:root {
  --radius-panel: 32px;
  --radius-card: 24px;
  --radius-field: 14px;
  --ease-bw: cubic-bezier(.22, 1, .36, 1);
}
body { background: #fff; }
.header {
  top: 14px;
  height: 84px;
  margin: 14px 2% 18px;
  padding: 0 3.1%;
  border: 1px solid #dfe7e580;
  border-radius: 999px;
  background: #fffffff2;
  box-shadow: 0 8px 35px #093f4b08;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  transition: box-shadow .3s ease, background .3s ease;
  view-transition-name: bw-header;
}
.header.is-scrolled { background: #ffffffeb; box-shadow: 0 10px 35px #093f4b16; }
.header nav>a:not(.button) { transition: color .2s ease; }
.button, .floating-contact, .filters button {
  border-radius: 999px;
  transition: transform .3s var(--ease-bw), background .25s ease,
    box-shadow .3s ease, color .25s ease, border-color .25s ease;
}
.button { padding: 17px 27px; }
.button>span, .text-link>span { transition: transform .3s var(--ease-bw); }
.button:active, .floating-contact:active { transform: scale(.97); }
.button:focus-visible { outline-offset: 5px; }
.text-link { transition: color .25s ease, border-color .25s ease; }
.floating-contact { view-transition-name: bw-contact; }
.menu-toggle { border-radius: 50%; min-width: 44px; min-height: 44px; justify-content: center; align-items: center; }
.menu-toggle span { transition: transform .25s var(--ease-bw); }
.menu-toggle[aria-expanded=true] span:first-child { transform: translateY(4px) rotate(45deg); }
.menu-toggle[aria-expanded=true] span:last-child { transform: translateY(-4px) rotate(-45deg); }
.hero { margin: 0 2%; gap: 16px; grid-template-columns: minmax(0,48fr) minmax(0,52fr); }
.hero-copy { border-radius: var(--radius-panel); }
.hero-photo { border-radius: var(--radius-panel); isolation: isolate; }
.hero-bottom a {
  border: 1px solid #ffffff35;
  width: 44px; height: 44px;
  display: grid; place-items: center;
  border-radius: 50%;
  transition: background .25s ease, transform .25s ease;
}
.hero-bottom a:hover { background: #ffffff15; transform: translateY(3px); }
.region-strip { border-bottom: 0; padding-top: 27px; padding-bottom: 15px; }
.solutions { margin: 0 2%; padding-left: 4.2%; padding-right: 4.2%; border-radius: var(--radius-panel); }
.service-grid { gap: 20px; border: 0; }
.service-card {
  border: 1px solid #dde4df;
  border-radius: var(--radius-card);
  background: #fff;
  transition: translate .35s var(--ease-bw), box-shadow .35s ease, border-color .35s ease;
}
.service-card .service-number {
  width: 48px; height: 48px; display: grid; place-items: center;
  border-radius: 50%; background: var(--paper); margin-bottom: 30px;
}
.service-card .text-link { border-bottom-color: #c4cfcc; }
.feature { margin: 22px 2%; gap: 20px; }
.feature>figure, .feature-copy { border-radius: var(--radius-panel); overflow: hidden; }
.feature-copy { background: var(--paper); padding: 75px 10%; }
.feature figcaption, .page-hero figcaption { border-radius: 999px; padding: 4px 12px; }
.values-band { margin: 0 2%; border-radius: var(--radius-panel); }
.faq-list details, .faq-list details:first-child {
  border: 1px solid var(--line); border-radius: 18px; padding: 21px 24px; margin-bottom: 12px;
  transition: background .25s ease, border-color .25s ease;
}
.faq-list details[open] { background: var(--paper); border-color: #c7d2cd; }
.faq-list summary { align-items: center; }
.faq-list summary span { transition: transform .25s var(--ease-bw); }
.cta { border-radius: var(--radius-panel); }
.page-hero { margin: 0 2%; border-radius: var(--radius-panel); }
.page-hero.with-photo { overflow: hidden; }
.page-hero:not(.with-photo) { padding-left: 4.2%; padding-right: 4.2%; }
.delivery, .note-panel { border-radius: var(--radius-panel); }
.delivery { margin: 0 2%; padding-left: 4.2%; padding-right: 4.2%; }
.three article { border: 1px solid var(--line); border-radius: var(--radius-card); padding: 30px; }
.gallery-card { padding: 12px 12px 24px; border: 1px solid var(--line); border-radius: var(--radius-card); }
.gallery-card figure { border-radius: 17px; }
.gallery-card figcaption { border-radius: 999px; padding: 6px 12px; }
.gallery-card>.eyebrow, .gallery-card>h3, .gallery-card>.text-link { margin-left: 10px; margin-right: 10px; }
.gallery-card { transition: translate .35s var(--ease-bw), box-shadow .35s ease; }
.empty-state, .gallery-notice { border-radius: 16px; }
.gallery-notice { background: var(--paper); border-left: 0; padding: 16px 22px; }
#contact-form { border-radius: var(--radius-panel); }
input, select, textarea { border-radius: var(--radius-field); transition: border-color .25s ease, box-shadow .25s ease; }
input:hover, select:hover, textarea:hover { border-color: #7c9799; }
input:focus, select:focus, textarea:focus { border-color: var(--green); box-shadow: 0 0 0 4px #093f4b09; }
#message-preview { border-radius: 16px; }
dialog { border-radius: 28px; box-shadow: 0 30px 100px #001c3655; }
.dialog-close { border-radius: 50%; }
.project-thumbs button, .project-thumbs img { border-radius: 10px; }

/* Entrada: a página é utilizável desde o primeiro instante. */
@keyframes bw-rise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: translateY(0); } }
@keyframes bw-photo { from { opacity: .35; transform: scale(1.065); } to { opacity: 1; transform: scale(1); } }
@keyframes bw-panel { from { opacity: 0; transform: translateY(16px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes bw-menu { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@keyframes bw-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: no-preference) {
  .hero-copy>.eyebrow { animation: bw-rise .75s var(--ease-bw) .06s both; }
  .hero-copy>h1 { animation: bw-rise .95s var(--ease-bw) .14s both; }
  .hero-copy>.lead { animation: bw-rise .85s var(--ease-bw) .25s both; }
  .hero-copy>.button { animation: bw-rise .8s var(--ease-bw) .36s backwards; }
  .hero-bottom { animation: bw-rise .8s var(--ease-bw) .42s backwards; }
  .hero-photo>img { animation: bw-photo 1.5s var(--ease-bw) both; }
  .hero-photo figcaption { animation: bw-rise .85s var(--ease-bw) .48s both; }
  .page-hero>div>.eyebrow { animation: bw-rise .7s var(--ease-bw) .05s both; }
  .page-hero h1 { animation: bw-rise .9s var(--ease-bw) .12s both; }
  .page-hero>div>p:not(.eyebrow) { animation: bw-rise .85s var(--ease-bw) .23s both; }
  .page-hero figure img { animation: bw-photo 1.2s var(--ease-bw) both; }
  .reveal-pending { opacity: 0; transform: translateY(30px); }
  .reveal-in { animation: bw-rise .8s var(--ease-bw) var(--reveal-delay, 0ms) backwards; }
  .gallery-card { animation: bw-rise .6s var(--ease-bw) both; }
  .gallery-card:nth-child(2) { animation-delay: .08s; }
  .gallery-card:nth-child(3) { animation-delay: .16s; }
  dialog[open] { animation: bw-panel .35s var(--ease-bw) both; }
  dialog[open]::backdrop { animation: bw-fade .3s ease both; }
  .faq-list details[open]>p { animation: bw-rise .3s var(--ease-bw) both; }
  #mobile-menu:not([hidden]) { animation: bw-menu .28s var(--ease-bw) both; }
  #contact-ready:not([hidden]) { animation: bw-rise .45s var(--ease-bw) both; }
}
/* Transições nativas entre documentos. Links, histórico e abrir em nova aba
   mantêm o comportamento normal; navegadores sem suporte usam a entrada acima. */
@view-transition { navigation: auto; }
@keyframes bw-page-out { to { opacity: 0; transform: translateY(-10px); } }
@keyframes bw-page-in { from { opacity: 0; transform: translateY(14px); } }
::view-transition-old(root) { animation: bw-page-out .24s ease both; }
::view-transition-new(root) { animation: bw-page-in .55s var(--ease-bw) both; }
::view-transition-group(bw-header), ::view-transition-group(bw-contact) { animation-duration: .4s; }

@media (hover:hover) and (pointer:fine) {
  .button:hover, .floating-contact:hover { transform: translateY(-3px); box-shadow: 0 10px 24px #093f4b22; }
  .button:hover>span, .text-link:hover>span { transform: translate(3px,-3px); }
  .service-card:hover, .gallery-card:hover { translate: 0 -6px; box-shadow: 0 18px 40px #093f4b12; border-color: #a9c0be; }
  .gallery-card:hover img { transform: scale(1.045); }
  .filters button:hover { transform: translateY(-2px); border-color: var(--green); }
}
@media (max-width:900px) {
  .header { padding: 0 4%; top: 10px; margin: 10px 3% 14px; height: 76px; }
  .hero { margin: 0 3%; gap: 12px; }
  #mobile-menu:not([hidden]) { top: 97px; left: 3%; right: 3%; border: 1px solid var(--line); border-radius: 24px; padding: 20px 24px; }
  #mobile-menu a { padding: 9px 12px; border-radius: 12px; }
  #mobile-menu a:hover { background: var(--paper); }
  .three { gap: 20px; }
  .three article { padding: 25px; }
  .feature-copy { padding: 55px 9%; }
}
@media (max-width:600px) {
  :root { --radius-panel: 26px; --radius-card: 22px; }
  html { scroll-padding-top: 108px; }
  .header { height: 70px; padding: 0 4%; gap: 8px; }
  .header .brand img { width: 74px; }
  .header nav>.button { padding: 10px 15px; gap: 12px; }
  .menu-toggle { padding: 10px; min-width: 36px; }
  .hero { grid-template-columns: minmax(0,1fr); min-height: auto; }
  .hero-copy { padding: 36px 7% 22px; }
  .hero-photo { min-height: 350px; }
  .hero .eyebrow { letter-spacing: .12em; }
  .hero-bottom { font-size: 12px; letter-spacing: .07em; gap: 15px; }
  .hero-bottom a { flex-shrink: 0; }
  .hero h1 { font-size: clamp(2.5rem,10vw,3.75rem); }
  .service-grid { gap: 16px; }
  .service-card { padding: 28px; }
  .solutions { padding-left: 5%; padding-right: 5%; }
  .feature { margin: 16px 3%; gap: 14px; }
  .feature-copy { padding: 40px 7%; }
  .values-band { margin: 0 3%; }
  .faq-list details, .faq-list details:first-child { padding: 19px 20px; }
  .faq-list summary { font-size: 16px; }
  .cta { margin: 0 3%; }
  .page-hero { margin: 0 3%; }
  .page-hero:not(.with-photo) { padding-left: 7%; padding-right: 7%; }
  .page-hero.with-photo>div { padding: 42px 7%; }
  .page-hero h1, .page-hero.with-photo h1 { font-size: clamp(2.25rem,9.5vw,2.8rem); }
  .delivery { margin: 0 3%; padding-left: 7%; padding-right: 7%; }
  .floating-contact { width: 50px; height: 50px; justify-content: center; }
  #mobile-menu:not([hidden]) { top: 91px; }
  .gallery-card figure { height: 340px; }
}
/* A preferência de movimento do aparelho vale também para a navegação. */
@media (prefers-reduced-motion:reduce) {
  @view-transition { navigation: none; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  html { scroll-behavior: auto; }
  .reveal-pending { opacity: 1; transform: none; }
  .button:hover, .floating-contact:hover, .service-card:hover, .gallery-card:hover,
  .filters button:hover, .button:hover>span, .text-link:hover>span { transform: none; translate: none; }
  ::view-transition-old(root), ::view-transition-new(root), ::view-transition-group(*) { animation: none !important; }
}
