/* Lekha & Co.: tablet and desktop. The hero composes the whole width as one picture: the firm's
   statement and its action on the left, the next due date read out on the right, and the year
   strip under both, edge to edge. */

@media (min-width: 720px) {
  :root {
    --gutter: 28px;
    --header-h: 68px;
  }

  .hide-small {
    display: inline;
  }

  .show-small {
    display: none;
  }

  .header-cta {
    min-height: 44px;
    padding: 0.5em 1.05em;
  }

  .hero {
    padding: 34px 0 34px;
  }

  .hero-grid {
    grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
    column-gap: 40px;
    row-gap: 28px;
    align-items: end;
  }

  .hero-year {
    grid-column: 1 / -1;
  }

  .year {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .part {
    padding: 56px 0;
  }

  .part-grid {
    grid-template-columns: 9rem minmax(0, 1fr);
    gap: 24px;
  }

  .part-n {
    flex-direction: column;
    gap: 2px;
    padding-top: 6px;
    border-top: 1px solid var(--rule-strong);
  }

  .page-head .part-n {
    border-top: 0;
  }

  .ind-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 36px;
  }

  .offices {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 36px;
  }

  .entry {
    grid-template-columns: 11rem minmax(0, 1fr);
    gap: 20px;
  }

  .entry-date {
    padding-top: 3px;
  }

  .col-who {
    display: table-cell;
    width: 30%;
  }

  .footer-grid {
    grid-template-columns: 1.3fr 1fr 1fr;
  }

  .imprint {
    grid-column: 1 / -1;
  }

  .imprint .kv {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 36px;
  }
}

@media (min-width: 1080px) {
  .nav-wide {
    display: block;
    margin-right: 6px;
  }

  .nav-wide ul {
    display: flex;
    gap: 2px;
  }

  .nav-wide a {
    display: block;
    padding: 10px 10px;
    color: var(--ink);
    text-decoration: none;
    font-weight: 600;
  }

  .nav-wide a:hover {
    color: var(--teal);
    text-decoration: underline;
  }

  .nav-wide a[aria-current="page"] {
    color: var(--teal);
    box-shadow: inset 0 -3px 0 var(--teal);
  }

  .nav-small {
    display: none;
  }

  .header-call {
    display: inline-flex;
  }

  .wm-name {
    font-size: 1.45rem;
  }

  .hero {
    padding: 40px 0 36px;
  }

  .hero-grid {
    grid-template-columns: minmax(0, 2.1fr) minmax(0, 1fr);
    column-gap: 56px;
  }

  .year {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }

  .year-more {
    grid-column: 1 / -1;
    text-align: right;
  }

  .next {
    padding: 18px 22px 20px;
  }

  .next-day {
    font-size: 5.6rem;
  }

  .part-grid {
    grid-template-columns: 12rem minmax(0, 1fr);
    gap: 40px;
  }

  .svc {
    grid-template-columns: 4rem minmax(0, 1fr) minmax(0, 15rem);
  }

  .svc-leads {
    grid-column: 3;
    grid-row: 1;
    flex-direction: column;
    align-items: flex-start;
  }

  .roll {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 40px;
  }

  .ind-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .offices {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .consult-grid {
    grid-template-columns: minmax(0, 40rem) minmax(0, 1fr);
    gap: 56px;
  }

  .footer-grid {
    grid-template-columns: 1.4fr 1fr 1fr 2fr;
  }

  .imprint {
    grid-column: auto;
  }

  .imprint .kv {
    display: block;
  }
}

@media (min-width: 1600px) {
  :root {
    --wrap: 1520px;
  }

  .d {
    font-size: 0.875rem;
  }

  .hero h1 {
    font-size: 5rem;
  }

  .hero-text {
    max-width: 52ch;
  }
}

/* On a phone the Punjabi name would run under the header's button: it shows from tablet width up. */
@media (max-width: 719px) {
  .wm-local {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  * {
    scroll-behavior: auto !important;
  }
}