/* The supplied mobile board is the intended layout for phones and compact tablets. */
@media (max-width: 900px) {
  .desktop { display: none; }
  .mobile { display: block; overflow: hidden; }
  .mobile > header { position: sticky; z-index: 10; top: 0; display: flex; align-items: center; justify-content: space-between; height: 64px; padding: 0 20px; background: rgba(250,249,245,.92); backdrop-filter: blur(16px); }
  .mobile .logo { font-size: 17px; }
  .mobile .logo span { font-size: 8px; }
  .menu { display: grid; place-content: center; gap: 6px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--olive); }
  .menu i { display: block; width: 18px; height: 2px; background: #fff; }
  .mobile nav { position: absolute; top: 58px; right: 20px; display: grid; width: 210px; padding: 10px; border: 1px solid var(--line); border-radius: 20px; background: #faf9f5; box-shadow: 0 15px 32px rgba(41,48,33,.14); }
  .mobile nav a { padding: 11px 12px; }
  .mobile main > section { padding: 72px 20px; }
  .mobile h2 { font-size: 34px; }
  .mobile main > section > p:not(.eyebrow) { margin-top: 24px; font-size: 17px; line-height: 1.52; }
  .full { display: flex; width: 100%; }
  .m-hero { position: relative; min-height: 693px; overflow: hidden; padding: 0 !important; }
  .m-hero > img { width: 100%; height: 693px; object-fit: cover; }
  .m-hero > div { position: absolute; right: 20px; bottom: 24px; left: 20px; }
  .m-hero h1 { font-size: 35px; line-height: 1.02; }
  .m-hero h1 em { font-weight: 400; }
  .m-hero .button { margin-top: 20px; }
  .mobile #m-produto h2 { font-size: 24px; line-height: 1.3; font-weight: 400; letter-spacing: -.03em; }
  .m-glass { display: flex; justify-content: space-between; min-height: 168px; margin: 28px 0 20px; padding: 24px 20px; border: 1px solid rgba(255,255,255,.75); border-radius: 22px; background: rgba(255,255,255,.28); box-shadow: inset 0 1px #fff; backdrop-filter: blur(20px); }
  .m-glass .eyebrow { margin-bottom: 3px; font-size: 10px; }
  .m-glass h3 { font-size: 22px; }.m-glass strong { display: block; margin-top: 8px; font-size: 26px; }.m-glass p:not(.eyebrow) { max-width: 190px; margin-top: 4px; font-size: 12px; line-height: 1.4; }
  .m-glass img { width: 102px; height: 136px; object-fit: cover; border-radius: 16px; }
  .mobile figure { margin: 24px 0; overflow: hidden; border-radius: 22px; }.mobile figure img { width: 100%; height: auto; }
  .m-assets { background: #e8ebe0; }.m-assets > div { display: flex; gap: 12px; overflow-x: auto; margin: 26px -20px 0; padding: 0 20px 12px; scroll-snap-type: x mandatory; }.m-assets figure { position: relative; flex: 0 0 280px; margin: 0; scroll-snap-align: start; }.m-assets figure img { aspect-ratio: 1; object-fit: cover; }.m-assets figcaption { position: absolute; bottom: 10px; left: 10px; max-width: 80%; padding: 7px 10px; border-radius: 11px; background: rgba(247,247,238,.93); font-size: 13px; }
  .mobile #m-tecnologia { background: linear-gradient(180deg,#f1efe8,#e7ebdf,#f1efe8); }.action { padding: 20px 0; }.action h3 { font-size: 23px; }
  .mobile ol { display: grid; gap: 12px; margin: 24px 0 0; padding: 0; list-style: none; }.mobile ol li { display: grid; grid-template-columns: 34px 1fr; gap: 14px; padding: 18px; border: 1px solid #c8d4b7; border-radius: 18px; background: #dce4cf; }.mobile ol b { color: #526640; font-size: 27px; line-height: 1; }.mobile ol h3 { font-size: 18px; }.mobile ol p { margin-top: 5px; font-size: 13px; line-height: 1.4; }
  .m-testimonials { background: radial-gradient(ellipse at 10% 40%,#c9d4bdaa,transparent 70%),radial-gradient(ellipse at 80% 90%,#ddd0b4aa,transparent 70%); }.m-testimonials h2 { margin-bottom: 28px; }.m-testimonials figure { margin: 16px 0 0; padding: 24px; border: 1px solid rgba(255,255,255,.7); background: rgba(255,255,255,.32); backdrop-filter: blur(16px); }.m-testimonials blockquote { font-size: 19px; line-height: 1.44; }.m-testimonials figcaption { display: flex; flex-direction: column; gap: 3px; margin-top: 20px; font-size: 14px; }.m-testimonials figcaption span { font-size: 12px; }
  .m-final { margin: 24px 20px 0 !important; padding: 32px 24px !important; border-radius: 24px; background: var(--olive); color: var(--page); }.m-final h2 { margin-top: 13px; font-size: 31px; }.m-final .preview { width: 100%; margin: 24px 0 16px; }.m-final .preview img { height: 170px; }
  .mobile > footer { margin-top: 48px; padding: 36px 24px 24px; background: #f6f6f4; color: #424a40; }.m-brands { display: flex; align-items: center; gap: 18px; }.m-brands img:first-child { width: 122px; height: 36px; object-fit: contain; }.m-brands img:nth-child(2) { width: 52px; height: 42px; object-fit: contain; }.m-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin: 32px 0; }.mobile footer h3 { margin: 26px 0 9px; font-size: 14px; }.mobile footer p { font-size: 12px; line-height: 1.65; }.mobile footer small { display: block; margin-top: 32px; padding-top: 18px; border-top: 1px solid #d5d8d0; font-size: 10px; }.credit { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 18px; font-size: 12px; }.credit img { width: 104px; height: 20px; object-fit: contain; border-radius: 5px; background: #2e5736; }
}
