/* mobile-perfect.css
 *
 * Network-wide responsive finish layer for the 19 static launch domains.
 * Loaded after each page's local styles. Keeps the existing editorial identity,
 * but fixes mobile correctness: no horizontal clipping, repaired variable type
 * utilities, 44px touch targets, calmer cards, readable forms, and tablet-safe
 * grid behavior. PNN / Michigan Inside Next.js sites intentionally excluded.
 */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  overflow-x: clip;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

img,
svg,
video,
canvas {
  max-width: 100%;
  height: auto;
}

.reveal,
.reveal.is-visible,
.reveal.in {
  opacity: 1 !important;
  transform: none !important;
}

/* Tailwind v4 generated these arbitrary text tokens as colors. Restore their
   intended font-size behavior for the launch pages that use the shared scale. */
.text-\[var\(--t-12\)\] { font-size: var(--t-12) !important; color: inherit; }
.text-\[var\(--t-14\)\] { font-size: var(--t-14) !important; color: inherit; }
.text-\[var\(--t-16\)\] { font-size: var(--t-16) !important; color: inherit; }
.text-\[var\(--t-19\)\] { font-size: var(--t-19) !important; color: inherit; }
.text-\[var\(--t-22\)\] { font-size: var(--t-22) !important; color: inherit; }
.text-\[var\(--t-28\)\] { font-size: var(--t-28) !important; color: inherit; }
.text-\[var\(--t-36\)\] { font-size: var(--t-36) !important; color: inherit; }
.text-\[var\(--t-48\)\] { font-size: var(--t-48) !important; color: inherit; }
.text-\[var\(--t-64\)\] { font-size: var(--t-64) !important; color: inherit; }
.text-\[var\(--t-84\)\] { font-size: var(--t-84) !important; color: inherit; }
.text-\[var\(--t-120\)\] { font-size: var(--t-120) !important; color: inherit; }
.text-\[var\(--t-220\)\] { font-size: var(--t-220) !important; color: inherit; }

a,
button,
input,
textarea,
select {
  touch-action: manipulation;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

@media (min-width: 768px) {
  .md\:hidden {
    display: none !important;
  }

  .md\:flex {
    display: flex !important;
  }

  .md\:block {
    display: block !important;
  }

  .md\:inline {
    display: inline !important;
  }

  .md\:inline-block {
    display: inline-block !important;
  }
}

@media (max-width: 900px) {
  .max-w-7xl,
  .max-w-6xl,
  .max-w-5xl,
  .max-w-4xl,
  .max-w-3xl,
  .max-w-screen-2xl {
    max-width: min(100%, 48rem) !important;
  }

  .md\:sticky {
    position: static !important;
  }

  nav {
    flex-wrap: wrap !important;
  }

  nav[class*="backdrop-blur"],
  header[class*="backdrop-blur"],
  [class*="backdrop-blur"] {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  nav .nav-label {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  nav a,
  nav button,
  footer a,
  footer button,
  .sh-network a,
  .sh-network-tag a,
  .sh-network button,
  .nav-link,
  .btn-primary,
  .btn-secondary,
  .listen-cta,
  a.font-semibold,
  a[class*="md:inline"],
  a[class*="hidden md:block"],
  a.inline-block,
  a.inline-flex,
  a.block,
  a[class*="rounded"],
  a[class*="px-"],
  button.inline-flex,
  button[class*="rounded"] {
    min-height: 44px !important;
    min-width: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }

  nav a[class*="text-xs"],
  nav a[class*="text-sm"],
  footer a[class*="text-xs"],
  footer a[class*="text-sm"],
  .sh-network a[class*="text-xs"],
  .sh-network a[class*="text-sm"],
  a[href="/support/"],
  a[href="/sponsors/"],
  a[href="/sponsor/"],
  a[href="/services/"],
  a[href="/commission/"],
  a[href="/engage/"],
  a[href^="mailto:"][class*="break-all"],
  a[href*="PLACEHOLDER_openladder_coffee_5"],
  a[href*="PLACEHOLDER_haller_coffee_5"],
  a[href="#"][class*="transition-colors"],
  a[href="https://stevenhaller.com"][class*="hover:underline"] {
    min-height: 44px !important;
    min-width: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }

  .nav-link {
    min-width: 44px !important;
    width: auto !important;
    white-space: nowrap !important;
  }

  .sh-network a,
  footer a.block,
  main a.block {
    display: flex !important;
  }
}

@media (min-width: 768px) and (max-width: 900px) {
  .gap-x-8 {
    column-gap: 1.25rem !important;
  }

  .gap-x-6 {
    column-gap: 1rem !important;
  }

  nav > .nav-label {
    display: none !important;
  }

  .md\:hidden {
    display: none !important;
  }

  .md\:flex {
    display: flex !important;
  }

  .md\:block {
    display: block !important;
  }

  .md\:inline {
    display: inline-flex !important;
  }
}

@media (max-width: 700px) {
  body {
    line-height: 1.62;
  }

  .px-6,
  .md\:px-8,
  .max-w-7xl,
  .max-w-6xl,
  .max-w-5xl,
  .max-w-4xl,
  .max-w-3xl,
  .max-w-2xl,
  .max-w-screen-2xl {
    width: 100% !important;
    padding-left: max(1rem, env(safe-area-inset-left)) !important;
    padding-right: max(1rem, env(safe-area-inset-right)) !important;
  }

  body > * {
    max-width: 100vw !important;
  }

  h1,
  .display-h1,
  .display-h2,
  .fraunces-display,
  .font-fraunces-display,
  .serif-display,
  .display-serif,
  .book-serif,
  .film-serif,
  .serif-head {
    text-wrap: balance;
    overflow-wrap: anywhere;
    letter-spacing: 0 !important;
    line-height: 1.02 !important;
  }

  body * {
    min-width: 0;
  }

  .flex {
    min-width: 0;
  }

  p,
  li,
  blockquote {
    max-width: calc(100vw - 2rem) !important;
    white-space: normal !important;
  }

  header p,
  main p,
  section p {
    width: 100%;
    max-width: min(100%, 36ch) !important;
  }

  header .text-lg,
  header .text-xl,
  header .md\:text-xl,
  header .md\:text-lg {
    font-size: 1.0625rem !important;
    line-height: 1.55 !important;
  }

  .text-7xl,
  .lg\:text-7xl,
  .md\:text-7xl {
    font-size: 4rem !important;
  }

  .text-6xl,
  .lg\:text-6xl,
  .md\:text-6xl,
  .lg\:text-\[82px\],
  .lg\:text-\[68px\] {
    font-size: 3.5rem !important;
  }

  .text-5xl,
  .md\:text-5xl {
    font-size: 2.75rem !important;
  }

  .text-4xl,
  .md\:text-4xl {
    font-size: 2.35rem !important;
  }

  .text-\[var\(--t-220\)\],
  .text-\[var\(--t-120\)\] {
    font-size: 4.75rem !important;
    letter-spacing: 0 !important;
    line-height: 0.92 !important;
  }

  .text-\[var\(--t-84\)\],
  .text-\[var\(--t-64\)\] {
    font-size: 4rem !important;
  }

  .text-\[var\(--t-48\)\],
  .text-\[var\(--t-36\)\] {
    font-size: 2.75rem !important;
  }

  .tracking-\[-6px\],
  .md\:tracking-\[-3px\],
  .md\:tracking-\[-3\.2px\],
  .tracking-tighter {
    letter-spacing: 0 !important;
  }

  nav,
  header,
  section,
  aside,
  footer {
    max-width: 100%;
  }

  nav.sticky,
  header.sticky,
  [class~="sticky"][class*="top-"] {
    position: static !important;
  }

  nav[class*="backdrop-blur"],
  header[class*="backdrop-blur"],
  [class*="backdrop-blur"] {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  nav img[alt="Closed Ladder"] {
    display: none !important;
  }

  nav a,
  nav button,
  footer a,
  footer button,
  .sh-network a,
  .sh-network button,
  .btn-primary,
  .btn-secondary,
  .listen-cta,
  .nav-link,
  a.inline-block,
  a.inline-flex,
  a.block,
  a[class*="rounded"],
  a[class*="px-"],
  button.inline-flex,
  button[class*="rounded"],
  a[href="/support/"],
  a[href="/sponsors/"],
  a[href="/sponsor/"],
  a[href="/services/"],
  a[href="/commission/"],
  a[href="/engage/"],
  a[href^="mailto:"][class*="break-all"],
  a[href*="PLACEHOLDER_openladder_coffee_5"],
  a[href*="PLACEHOLDER_haller_coffee_5"],
  a[href="#"][class*="transition-colors"],
  a[href="https://stevenhaller.com"][class*="hover:underline"] {
    min-height: 44px !important;
    min-width: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  .sh-network a,
  .sh-network-tag a,
  footer a,
  footer a.block,
  main a.block {
    display: flex !important;
    min-height: 44px !important;
    align-items: center !important;
  }

  .sh-network-tag a {
    width: 100%;
    margin-top: 0.35rem;
  }

  nav .flex,
  nav [class*="gap-x"] {
    row-gap: 0.5rem;
  }

  form {
    width: 100%;
  }

  input,
  textarea,
  select,
  button[type="submit"] {
    min-height: 48px;
    width: 100%;
  }

  div.rounded-3xl,
  article.rounded-3xl,
  section.rounded-3xl,
  aside.rounded-3xl,
  a.rounded-3xl,
  div.rounded-2xl,
  article.rounded-2xl,
  section.rounded-2xl,
  aside.rounded-2xl,
  a.rounded-2xl {
    border-radius: 8px !important;
  }

  .grid-cols-2 {
    grid-template-columns: 1fr !important;
  }

  .sh-network {
    margin-top: 2.5rem !important;
    padding: 1.5rem 1rem 1rem !important;
  }

  .sh-network-grid {
    grid-template-columns: 1fr !important;
  }

  p,
  li,
  blockquote {
    overflow-wrap: anywhere;
  }
}

@media (min-width: 701px) and (max-width: 1100px) {
  .text-\[var\(--t-220\)\] {
    font-size: 9rem !important;
    letter-spacing: 0 !important;
  }

  .text-\[var\(--t-120\)\] {
    font-size: 7rem !important;
  }
}

@supports not (overflow: clip) {
  html,
  body {
    overflow-x: hidden;
  }
}
