/* Regras móveis já aprovadas. Só entram pelo media do <link>, quando a layout viewport é de telemóvel. */

.top nav { display: none; }
.brand b { font-size: 13px; }
#searchBtn { display: none; }
.hero { min-height: 650px; padding: 100px 22px 65px; }
.hero h1 { font-size: 65px; }
.hero p { font-size: 15px; }
.places { display: none; }
.section { padding: 65px 20px; }
.rail { grid-auto-columns: 82vw; }
.card { height: 420px; }
.pulse { margin: 10px 20px; padding: 30px 24px; grid-template-columns: 1fr; }
.pulse h2 { font-size: 42px; }
.stats { grid-template-columns: 1fr 1fr; }
.stats div:nth-child(odd) { border-left: 0; }
.grid { display: flex; overflow: auto; }
.music-card { min-width: 44vw; }
.product-grid { grid-template-columns: 1fr 1fr; }
.product:nth-child(1) { grid-column: span 2; min-height: 540px; }
.product { min-height: 340px; }
.experience-grid { grid-template-columns: 1fr; }
.exp { height: 450px; }
.culture { padding: 80px 22px; }
.player { bottom: 10px; height: 66px; }
.player .vol-only { display: none; }
.track { flex: 1; }
.overlay { padding: 100px 24px; }
.overlay h2 { font-size: 42px; }
.overlay input { font-size: 24px; }

.brand img { width: 36px; }
.actions { margin-left: auto; }
.actions #searchBtn { display: inline-flex; }
.actions #favBtn, .actions #profileBtn { display: none; }
.hero { height: 72vh; min-height: 520px; max-height: 620px; }
.net-label { display: none; }
.bottom-nav { position: fixed; z-index: 35; left: 0; right: 0; bottom: 0; display: flex; height: calc(68px + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); background: #07090df2; border-top: 1px solid var(--border); backdrop-filter: blur(16px); }
.bottom-nav a, .bottom-nav a:link, .bottom-nav a:visited, .bottom-nav a:hover, .bottom-nav a:active, .bottom-nav a:focus {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 48px;
  color: #c5ced8; -webkit-text-fill-color: #c5ced8; text-decoration: none; font-size: 11px; font-weight: 600; letter-spacing: .02em;
}
.bottom-nav .nav-ico { width: 40px; height: 28px; display: grid; place-items: center; border-radius: 10px; color: #d7dee6; }
.bottom-nav .nav-ico svg { width: 22px; height: 22px; display: block; }
.bottom-nav .nav-ico svg, .bottom-nav .nav-ico svg * { fill: #c5ced8; stroke: none; }
.bottom-nav .nav-tx { color: #c5ced8; -webkit-text-fill-color: #c5ced8; }
.bottom-nav a[aria-current="page"],
.bottom-nav a[aria-current="page"]:link,
.bottom-nav a[aria-current="page"]:visited,
.bottom-nav a[aria-current="page"]:hover,
.bottom-nav a[aria-current="page"]:active,
.bottom-nav a[aria-current="page"]:focus { color: #fff; -webkit-text-fill-color: #fff; }
.bottom-nav a[aria-current="page"] .nav-tx { color: #fff; -webkit-text-fill-color: #fff; }
.bottom-nav a[aria-current="page"] .nav-ico { background: #ffffff18; color: #fff; }
.bottom-nav a[aria-current="page"] .nav-ico svg,
.bottom-nav a[aria-current="page"] .nav-ico svg * { fill: #fff; }
.player { bottom: calc(80px + env(safe-area-inset-bottom)); left: 10px; right: 10px; height: 72px; padding-top: 16px; }
.track { width: auto; min-width: 0; }
.player .progress { display: block; position: absolute; left: 14px; right: 14px; top: 7px; }
.player .time, .player .vol-only { display: none; }
html { scroll-padding-bottom: calc(160px + env(safe-area-inset-bottom)); }
main { padding-bottom: calc(148px + env(safe-area-inset-bottom)); }
.page-pad, .site-foot { padding-left: 20px; padding-right: 20px; }
.agro-grid, .prod-grid, .check-grid, .facts, .logi-list { grid-template-columns: 1fr; }
.agro-banner, .detail-banner { padding: 108px 20px 32px; height: auto; min-height: 420px; }
.banner-back { left: 20px; top: 96px; }
.agro-banner h1, .detail-banner h1 { font-size: 42px; }
.person { grid-template-columns: 88px 1fr; }
.person img { width: 88px; height: 88px; }
.market { grid-auto-columns: 78vw; }
.chain { grid-template-columns: 1fr 1fr; }
.map-stage { height: 420px; width: 192px; }
.product-grid { grid-template-columns: 1fr 1fr; }
.product-grid .product,
.product-grid .product:nth-child(1) { grid-column: auto; grid-row: auto; min-height: 340px; height: 340px; }
.plan-grid { grid-template-columns: 1fr 1fr; }
.install-sheet { bottom: calc(84px + env(safe-area-inset-bottom)); }
body:has(#player:not(.hidden)) .install-sheet { bottom: calc(168px + env(safe-area-inset-bottom)); }

@media (max-width: 420px) {
  .page-pad .agro-actions { flex-direction: column; align-items: stretch; }
  .page-pad .agro-actions > * { justify-content: center; text-align: center; }
}
@media (max-width: 700px) {
  .action-bar, .action-bar-main { flex-direction: column; align-items: stretch; }
  .action-bar .next-link { margin-left: 0; }
}
@media (max-width: 700px) {
  .modal-veil { align-items: flex-end; padding: 0; }
  .modal { width: 100%; max-height: 92vh; border-radius: 22px 22px 0 0; padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
  .overlay h2 { font-size: 36px; }
  .composer { flex-direction: column; }
}
@media (max-width: 400px) {
  .brand img { width: 34px; }
  .fav-thumb { width: 48px; height: 48px; }
  .fav-remove span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
  #queueBtn { display: none; }
  .hero h1 { font-size: 52px; }
  .culture h2 { font-size: 46px; }
  .agro-banner h1, .detail-banner h1 { font-size: 36px; }
  .bottom-nav a { font-size: 10px; }
}
@media (max-width: 800px) {
  .profile-hero, .sub-hero { align-items: flex-start; }
  .sub-hero { flex-direction: column; }
  .profile-grid, .plan-grid, .plan-grid-modal { grid-template-columns: 1fr; }
  .plan-card { min-height: 0; }
}