/**
 * JCR Theme mobile-only refinements.
 *
 * Scope is intentionally limited to phone/tablet portrait widths so desktop
 * layout and component behavior remain unchanged.
 *
 * @since 0.61.10
 */
@media (max-width: 767px) {
  html {
    overflow-x: clip;
    -webkit-text-size-adjust: 100%;
  }

  body {
    overflow-x: clip;
  }

  .wp-site-blocks,
  main,
  .entry-content,
  .wp-block-group,
  .wp-block-cover,
  .wp-block-columns,
  .wp-block-column {
    min-width: 0;
  }

  .wp-site-blocks > main,
  main.wp-block-group,
  .entry-content {
    overflow-wrap: anywhere;
  }

  .wp-block-image img,
  .wp-block-cover img,
  .wp-block-post-featured-image img,
  img {
    max-width: 100%;
    height: auto;
  }

  /* Keep the global content rhythm compact without flattening section hierarchy. */
  .entry-content > .wp-block-group,
  .entry-content > .wp-block-cover,
  .entry-content > section {
    scroll-margin-top: 84px;
  }

  .entry-content h1,
  .entry-content .wp-block-heading:is(h1) {
    font-size: clamp(2rem, 9vw, 2.75rem);
    line-height: 1.14;
    letter-spacing: -0.035em;
  }

  .entry-content h2,
  .entry-content .wp-block-heading:is(h2) {
    font-size: clamp(1.55rem, 7vw, 2.05rem);
    line-height: 1.25;
    letter-spacing: -0.025em;
  }

  .entry-content h3,
  .entry-content .wp-block-heading:is(h3) {
    font-size: clamp(1.15rem, 5.2vw, 1.45rem);
    line-height: 1.35;
  }

  .entry-content p,
  .entry-content li,
  .entry-content dd {
    line-height: 1.78;
  }

  /* WordPress columns should become a predictable one-column flow on phones. */
  .wp-block-columns:not(.is-not-stacked-on-mobile) {
    gap: 1.25rem;
  }

  .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
    flex-basis: 100% !important;
  }

  /* Buttons: larger touch target, no accidental narrow inline CTA. */
  .wp-block-buttons {
    gap: 0.75rem;
  }

  .wp-block-buttons:not(.is-content-justification-center):not(.is-content-justification-right),
  .jcr-cta .wp-block-buttons,
  .jcr-hero .wp-block-buttons,
  [class*="__actions"] .wp-block-buttons {
    width: 100%;
  }

  .wp-block-buttons:not(.is-content-justification-center):not(.is-content-justification-right) > .wp-block-button,
  .jcr-cta .wp-block-button,
  .jcr-hero .wp-block-button,
  [class*="__actions"] .wp-block-button {
    width: 100%;
  }

  .wp-block-buttons:not(.is-content-justification-center):not(.is-content-justification-right) .wp-block-button__link,
  .jcr-cta .wp-block-button__link,
  .jcr-hero .wp-block-button__link,
  [class*="__actions"] .wp-block-button__link {
    box-sizing: border-box;
    width: 100%;
    min-height: 48px;
    padding-inline: 1rem;
    white-space: normal;
  }

  a,
  button,
  input,
  select,
  textarea {
    -webkit-tap-highlight-color: rgba(18, 48, 74, 0.12);
  }

  button,
  input[type="button"],
  input[type="submit"],
  input[type="reset"] {
    min-height: 44px;
  }

  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  select,
  textarea {
    box-sizing: border-box;
    max-width: 100%;
    font-size: 16px;
  }

  textarea {
    min-height: 9rem;
  }

  /* Mobile tables remain usable rather than forcing the entire page wider. */
  .wp-block-table,
  .jcr-sales-table-wrap,
  [class*="table-wrap"],
  [class*="table-scroll"] {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  .wp-block-table table {
    min-width: 560px;
  }

  /* Cards and panels: retain hierarchy while reducing dead space. */
  [class*="card"],
  [class*="panel"],
  [class*="box"] {
    max-width: 100%;
  }

  .jcr-sales-choice,
  .jcr-sales-case-grid,
  .jcr-sales-resource-grid,
  .jcr-web-problems,
  .jcr-web-scope,
  .jcr-web-outcomes,
  .jcr-web-gates,
  .jcr-solution-standard,
  .jcr-about-risk-grid,
  .jcr-philosophy-grid,
  .jcr-service-belief ul,
  .jcr-location-related ul {
    gap: 0.85rem;
  }

  /* Header is intentionally phone-first: compact brand, generous menu target. */
  .jcr-nav-brand-inner {
    min-height: 62px;
    gap: 10px;
  }

  .jcr-nav-brand {
    gap: 9px;
  }

  .jcr-nav-mark {
    flex-basis: 43px;
    width: 43px;
    height: 43px;
  }

  .jcr-nav-mark svg {
    width: 31px;
    height: 31px;
  }

  .jcr-nav-brand-copy strong {
    font-size: clamp(1.02rem, 4.8vw, 1.22rem);
  }

  .jcr-nav-brand-copy small {
    margin-top: 3px;
    font-size: 0.56rem;
    line-height: 1.25;
  }

  .jcr-nav-toggle {
    flex: 0 0 46px;
    width: 46px;
    min-height: 46px;
    justify-content: center;
    padding: 8px;
  }

  .jcr-nav-toggle > span:last-child {
    display: none;
  }

  .jcr-mobile-drawer {
    width: min(94vw, 390px);
  }

  .jcr-mobile-head {
    min-height: 64px;
    padding-inline: 16px;
  }

  .jcr-mobile-body {
    padding: 14px 16px 20px;
  }

  .jcr-mobile-body a {
    min-height: 50px;
    padding: 11px 2px;
  }

  .jcr-mobile-actions {
    padding-inline: 16px;
  }

  /* Common hero/panel layouts: trim desktop breathing room, never crop copy. */
  .jcr-contact-hero__grid,
  .jcr-about-hero__inner,
  .jcr-onboarding-hero__grid,
  .jcr-phone-hero__grid,
  .jcr-web-hero > .jcr-solutions-wrap,
  .jcr-solution-primary,
  .jcr-sales-operator__grid,
  .jcr-office-outcome__inner,
  .jcr-home-web__inner {
    min-width: 0;
  }

  .jcr-contact-hero__grid > *,
  .jcr-about-hero__inner > *,
  .jcr-onboarding-hero__grid > *,
  .jcr-phone-hero__grid > *,
  .jcr-web-hero > .jcr-solutions-wrap > *,
  .jcr-solution-primary > *,
  .jcr-office-outcome__inner > *,
  .jcr-home-web__inner > * {
    min-width: 0;
  }

  /* Definition-list labels should not consume half the screen on small phones. */
  .jcr-footer-v2__identity dl > div,
  .jcr-location-facts dl > div,
  .jcr-contact-review dl,
  .jcr-legal-facts div,
  .jcr-deliverable-card dl div,
  .jcr-deliverable-card__use,
  .jcr-onboarding-price-box,
  .jcr-web-plan-guide dl > div {
    min-width: 0;
  }

  /* Phone consultation: structural mobile reset. Visible controls start immediately;
     security fields live at the end of the DOM and cannot reserve layout rows. */
  main.jcr-contact-page {
    margin-block-start: 0 !important;
    padding-top: 0 !important;
  }

  .jcr-phone-hero {
    margin: 0 !important;
    padding: 0.8rem 0 0.75rem !important;
  }

  .jcr-phone-hero__grid {
    gap: 0.8rem;
  }

  .jcr-phone-hero h1 {
    max-width: none;
    margin: 0.08em 0 0.32em;
    font-size: clamp(1.68rem, 7.8vw, 1.95rem);
    line-height: 1.14;
    letter-spacing: -0.035em;
  }

  .jcr-phone-title-line {
    white-space: nowrap;
  }

  .jcr-phone-hero > .jcr-contact-shell,
  .jcr-phone-form-section > .jcr-contact-shell {
    width: min(100% - 24px, 1180px);
  }

  .jcr-phone-hero p {
    margin-top: 0.5rem;
    margin-bottom: 0;
    line-height: 1.65;
  }

  .jcr-phone-hero aside {
    padding: 0.9rem 1rem;
    border-radius: 0.85rem;
    box-shadow: 0 10px 28px rgba(18, 48, 74, 0.07);
  }

  .jcr-phone-hero aside p {
    margin-top: 0.3rem;
  }

  .jcr-phone-form-section {
    margin: 0 !important;
    padding: 0.65rem 0 2.5rem !important;
  }

  .jcr-phone-form-card {
    min-height: 0 !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 1rem !important;
    border-radius: 0.9rem;
    box-shadow: 0 12px 32px rgba(18, 48, 74, 0.07);
  }

  .jcr-phone-form {
    display: block !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .jcr-phone-form > input[type="hidden"],
  .jcr-phone-form > .jcr-hp {
    display: none !important;
  }

  .jcr-phone-form > .jcr-error-summary {
    margin: 0 0 1rem !important;
  }

  .jcr-phone-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 0 1rem !important;
    padding: 0 !important;
    gap: 0.9rem;
  }

  .jcr-phone-grid > p,
  .jcr-phone-message,
  .jcr-phone-email {
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .jcr-phone-message,
  .jcr-phone-email,
  .jcr-phone-form > .jcr-contact-consent,
  .jcr-phone-form > .jcr-phone-note,
  .jcr-phone-form > .jcr-submit {
    margin-top: 1rem !important;
  }

  .jcr-phone-form > .jcr-contact-consent {
    margin-bottom: 0 !important;
  }


  /* Phone reservation consent: keep the sentence readable as one unit. */
  .jcr-phone-form .jcr-contact-consent {
    display: flex !important;
    align-items: flex-start !important;
    gap: 0.65rem !important;
    padding: 0.9rem 1rem !important;
  }

  .jcr-phone-form .jcr-contact-consent > input[type="checkbox"] {
    width: 1rem !important;
    height: 1rem !important;
    margin: 0.28rem 0 0 !important;
    flex: 0 0 1rem !important;
  }

  .jcr-phone-form .jcr-contact-consent__copy {
    display: block !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    line-height: 1.65 !important;
  }

  .jcr-phone-form .jcr-contact-consent__copy > a {
    white-space: nowrap !important;
  }

  .jcr-phone-form .jcr-contact-consent__tail {
    display: inline !important;
    white-space: nowrap !important;
  }

  .jcr-phone-form .jcr-contact-consent__tail .jcr-required {
    position: static !important;
    display: inline-block !important;
    margin: 0 0 0 0.45rem !important;
    white-space: nowrap !important;
    vertical-align: 0.12em !important;
  }

  /* Footer: readable stacking and safer touch spacing. */
  .jcr-footer-v2__contact-inner,
  .jcr-footer-v2__main > .jcr-footer-v2__container,
  .jcr-footer-v2__bottom > .jcr-footer-v2__container {
    gap: 1.35rem;
  }

  .jcr-footer-v2__nav a {
    min-height: 44px;
    display: flex;
    align-items: center;
  }

  /* Long labels/URLs must wrap instead of creating horizontal overflow. */
  .entry-content a,
  .jcr-mobile-body a,
  .jcr-footer-v2 a,
  code,
  pre {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  pre {
    max-width: 100%;
    overflow-x: auto;
    white-space: pre;
  }
}

@media (max-width: 420px) {
  .jcr-nav-container {
    width: calc(100% - 20px);
  }

  .jcr-nav-brand-copy > span {
    display: none;
  }

  .jcr-nav-brand-copy strong {
    font-size: 1.06rem;
  }

  .jcr-nav-brand-copy small {
    max-width: 13rem;
    font-size: 0.54rem;
  }

  .entry-content h1,
  .entry-content .wp-block-heading:is(h1) {
    font-size: clamp(1.85rem, 9.8vw, 2.35rem);
  }

  .jcr-mobile-actions {
    gap: 8px;
  }

}

@media (max-width: 340px) {
  .jcr-phone-title-line {
    white-space: normal;
  }
}