/* Just Verify — final mobile experience layer.
   Loaded after every route stylesheet so the phone experience remains
   consistent without changing the approved desktop compositions. */

.mobile-disclosure-content {
  display: contents;
}

.mobile-disclosure-toggle,
.mobile-toc-toggle {
  display: none;
}

@media (max-width: 760px) {
  :root {
    --jv-mobile-gutter: 20px;
    --jv-mobile-section: clamp(48px, 13vw, 62px);
  }

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

  body {
    -webkit-text-size-adjust: 100%;
  }

  img,
  canvas,
  svg,
  video,
  iframe,
  table {
    max-width: 100%;
  }

  /* Mobile content is visible immediately. Scroll effects are enhancement,
     never a requirement for reading the page or following an anchor. */
  body [data-motion] {
    opacity: 1 !important;
    transform: none !important;
  }

  body [id] {
    scroll-margin-top: calc(var(--hd-height-mobile, 68px) + 16px) !important;
  }

  /* Header — retain the important Contact Us action alongside the menu. */
  .global-header .hd-shell {
    width: calc(100% - 16px) !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
  }

  .global-header .hd-brand {
    min-width: 0;
    padding-inline: 4px 6px !important;
  }

  .global-header .brand-logo-frame {
    width: clamp(116px, 34vw, 145px) !important;
    min-width: 0;
  }

  .global-header .brand-slogan {
    display: none !important;
  }

  .global-header .hd-actions {
    gap: 6px !important;
    padding-left: 4px !important;
  }

  .global-header .hd-cta {
    min-height: 42px !important;
    padding-inline: clamp(9px, 2.6vw, 13px) !important;
    font-size: clamp(.56rem, 2.45vw, .66rem) !important;
    letter-spacing: .035em !important;
    white-space: nowrap;
  }

  .global-header .nav-toggle {
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px;
  }

  .global-header .hd-nav {
    max-height: calc(100dvh - var(--hd-height-mobile, 68px));
    padding: 8px 8px max(18px, env(safe-area-inset-bottom)) !important;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .global-header .hd-nav a {
    min-height: 54px !important;
    padding: 14px 16px !important;
    font-size: .76rem !important;
  }

  /* Shared typography and rhythm. */
  body.inner-page main h1,
  body.page-roundtables main h1,
  .legal-hero h1 {
    max-width: none !important;
    font-size: clamp(2.25rem, 10.5vw, 2.9rem) !important;
    line-height: 1.055 !important;
    letter-spacing: -.035em !important;
    text-wrap: balance;
  }

  body.inner-page main h2,
  body.page-roundtables main h2,
  .legal-main h2 {
    max-width: none;
    font-size: clamp(1.9rem, 8.4vw, 2.5rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -.03em !important;
    text-wrap: balance;
  }

  body.inner-page .inner-page-main > .section:not(:first-child),
  body.page-roundtables .roundtables-section {
    padding-block: var(--jv-mobile-section) !important;
  }

  body.inner-page :is(.section-heading, .tt-section-heading, .rt-section-heading) {
    margin-bottom: 30px;
  }

  body.inner-page main :is(p, li) {
    overflow-wrap: anywhere;
  }

  /* Hero copy, actions and approved artwork. */
  body.inner-page :is(
    .inner-page-hero,
    .solutions-hero,
    .resources-hero-grid,
    .partners-hero,
    .contact-hero,
    .trust-lab-hero,
    .tt-hero
  ) {
    gap: 30px !important;
    padding-top: 42px !important;
    padding-bottom: 48px !important;
  }

  body.inner-page main > section:first-of-type .hero-actions,
  body.page-roundtables .rt-hero .hero-actions {
    display: grid !important;
    width: 100%;
    grid-template-columns: 1fr;
    gap: 12px !important;
    margin-top: 26px !important;
  }

  body.inner-page main > section:first-of-type .hero-actions .button,
  body.page-roundtables .rt-hero .hero-actions .button {
    width: 100% !important;
    min-height: 50px !important;
    justify-content: center;
    text-align: center;
  }

  body.inner-page [data-inner-hero-scene],
  body.inner-page :is(
    .about-hero-image,
    .initiative-hero-image,
    .tt-hero-visual,
    .solutions-hero-visual,
    .resources-hero-visual,
    .trust-lab-hero .inner-hero-visual,
    .partners-hero .inner-hero-visual,
    .contact-hero .inner-hero-visual
  ) {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  body.inner-page [data-inner-hero-scene] > :is(img, picture),
  body.inner-page [data-inner-hero-scene] > picture > img,
  body.inner-page :is(
    .about-hero-image,
    .initiative-hero-image,
    .tt-hero-visual,
    .solutions-hero-visual,
    .resources-hero-visual,
    .trust-lab-hero .inner-hero-visual,
    .partners-hero .inner-hero-visual,
    .contact-hero .inner-hero-visual
  ) > img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: none !important;
    object-fit: contain !important;
    object-position: center !important;
  }

  /* Homepage: preserve the 3D direction while removing forced phone overflow. */
  .home-page .home-hero-copy {
    padding: 30px var(--jv-mobile-gutter) 34px !important;
  }

  .home-page .home-hero-copy h1 {
    font-size: clamp(2.25rem, 10.7vw, 2.95rem) !important;
    line-height: 1.05 !important;
  }

  .home-page .home-hero .hero-actions {
    display: grid !important;
    width: 100%;
    grid-template-columns: 1fr;
    gap: 12px !important;
  }

  .home-page .home-hero .hero-actions .button {
    width: 100% !important;
    min-height: 50px;
    justify-content: center;
  }

  .home-page .hero-architecture {
    width: 100% !important;
    min-width: 0 !important;
    margin-inline: 0 !important;
  }

  .home-page .trust-architecture-25d {
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .home-page .architecture-stage {
    width: 100% !important;
    min-width: 0 !important;
    transform-origin: center;
  }

  .home-page :is(.stack-tabs, .infrastructure-items) {
    grid-template-columns: 1fr !important;
  }

  .home-page :is(.stack-tabs button, .infrastructure-items button) {
    min-height: 50px;
    text-align: left;
  }

  .home-page :is(.verification-gap-v2, .verification-environment-v2, .architecture-band) {
    padding-block: var(--jv-mobile-section) !important;
  }

  /* Cards, ledgers and routes: content-height rows are easier to scan. */
  body.inner-page :is(
    .inner-priority-grid,
    .inner-activity-grid,
    .inner-audience-grid,
    .inner-route-grid,
    .contact-ecosystem-grid,
    .solutions-starting-points-grid,
    .solutions-current-grid,
    .solutions-delivery-grid,
    .solutions-modular-grid,
    .solutions-outputs-grid,
    .solutions-route-grid,
    .solutions-pathway-list,
    .trust-lab-card-grid,
    .trust-lab-focus-ledger,
    .trust-lab-output-grid,
    .trust-lab-horizon-grid,
    .trust-lab-horizon-v2-grid,
    .trust-lab-contribution-routes,
    .partners-route-grid,
    .contact-route-grid,
    .contact-next-list,
    .tt-source-grid,
    .tt-series-route,
    .tt-inquiry-grid,
    .tt-process-grid,
    .tt-perspective-map,
    .tt-principle-grid
  ) {
    grid-template-columns: 1fr !important;
  }

  body.inner-page :is(
    .inner-priority-grid > *,
    .inner-activity-grid > *,
    .inner-audience-grid > *,
    .inner-route-grid > *,
    .contact-ecosystem-card,
    .solutions-starting-points-grid > *,
    .solutions-current-grid > *,
    .solutions-delivery-grid > *,
    .solutions-modular-grid > *,
    .solutions-outputs-grid > *,
    .solutions-route-grid > *,
    .solutions-pathway-list > *,
    .trust-lab-card-grid > *,
    .trust-lab-focus-ledger > *,
    .trust-lab-output-grid > *,
    .trust-lab-horizon-grid > *,
    .trust-lab-horizon-v2-grid > *,
    .trust-lab-contribution-routes > *,
    .partners-route-card,
    .contact-route-card,
    .contact-next-list > *,
    .tt-source-grid > *,
    .tt-series-route > *,
    .tt-inquiry-grid > *,
    .tt-process-grid > *,
    .tt-perspective-map > *,
    .tt-principle-grid > *
  ) {
    min-height: 0 !important;
  }

  body.page-about .about-route-map a {
    display: grid !important;
    min-height: 50px !important;
    align-content: center;
    padding: 14px 0 !important;
    border-bottom: 1px solid rgba(20, 39, 77, .14) !important;
  }

  body.page-about .about-route-map a:last-child {
    border-bottom: 0 !important;
  }

  body.page-about :is(.mission-vision-feature > article, .principle-item, .leadership-identity) {
    min-height: 0 !important;
    padding: 22px 0 !important;
  }

  body.page-initiative :is(.initiative-question-section, .initiative-ecosystem-section) {
    padding-inline: var(--jv-mobile-gutter) !important;
  }

  body.page-initiative .initiative-question-section h2 {
    max-width: 20ch !important;
  }

  body.page-solutions .solutions-current-grid > article {
    padding: 24px 58px 26px 20px !important;
  }

  body.page-solutions .solutions-current-grid > article::after {
    top: 22px !important;
    right: 18px !important;
  }

  body.page-trust-lab :is(.trust-lab-development-route, .trust-lab-system-strip) {
    grid-template-columns: 1fr !important;
    overflow: visible !important;
  }

  body.page-partners :is(.partners-route-card, .partners-process-list > li),
  body.page-contact :is(.contact-route-card, .contact-next-list > li) {
    min-height: 0 !important;
    padding: 22px 20px !important;
  }

  body.page-partners .partners-process-list {
    grid-template-columns: 1fr !important;
  }

  body.page-partners .partners-process-list > li::after {
    display: none !important;
  }

  body.page-contact .contact-direct-details dl > div {
    grid-template-columns: 1fr !important;
    gap: 6px;
  }

  /* Forms: comfortable tap targets and no iOS focus zoom. */
  body.inner-page :is(input, select, textarea),
  body.page-roundtables :is(input, select, textarea),
  .global-footer :is(input, select, textarea) {
    min-height: 48px !important;
    font-size: 16px !important;
  }

  body.inner-page :is(
    .partners-form-grid,
    .contact-form-grid,
    .tt-form-grid,
    .roundtables-form-grid,
    .enquiry-form
  ) {
    grid-template-columns: 1fr !important;
  }

  body.inner-page :is(.partners-enquiry-form, .contact-enquiry-form, .tt-interest-form),
  body.page-roundtables .roundtables-invitation-form {
    padding: 20px 18px !important;
  }

  body.inner-page :is(.partners-field, .contact-field, .tt-form-wide),
  body.page-roundtables .roundtables-field {
    grid-column: 1 !important;
  }

  body.inner-page form .button,
  body.page-roundtables form .button {
    width: 100% !important;
    min-height: 50px;
    justify-content: center;
  }

  /* Roundtables: retain the distinctive inquiry field at a phone-appropriate scale. */
  body.page-roundtables .roundtables-shell {
    width: calc(100% - 40px) !important;
  }

  body.page-roundtables .rt-inquiry-field {
    min-height: clamp(390px, 112vw, 450px) !important;
  }

  body.page-roundtables :is(
    .rt-city-route,
    .rt-day-track,
    .rt-perspective-map,
    .rt-facts-grid,
    .rt-purpose-route,
    .rt-inquiry-grid,
    .rt-privacy-output-grid,
    .rt-stewardship-grid
  ) {
    grid-template-columns: 1fr !important;
  }

  body.page-roundtables .rt-day-session {
    min-height: 0 !important;
  }

  body.page-roundtables :is(.rt-date-lockup, .rt-timetable-header) {
    width: 100%;
  }

  /* Legal and participant pages. */
  .legal-shell,
  .legal-document-layout {
    width: calc(100% - 40px) !important;
  }

  .legal-hero {
    padding: 48px 0 42px !important;
  }

  .legal-document-layout {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding-top: 34px !important;
    padding-bottom: 64px !important;
  }

  .legal-toc-label,
  .legal-toc-title {
    display: none !important;
  }

  .mobile-toc-toggle,
  .mobile-disclosure-toggle {
    display: flex;
    width: 100%;
    min-height: 50px;
    align-items: center;
    justify-content: space-between;
    border: 0;
    padding: 0;
    color: inherit;
    background: transparent;
    font: 600 .72rem/1.3 var(--mono, "Fragment Mono", monospace);
    letter-spacing: .08em;
    text-align: left;
    text-transform: uppercase;
    cursor: pointer;
  }

  .mobile-toc-toggle {
    border-top: 1px solid rgba(21, 37, 75, .24);
    border-bottom: 1px solid rgba(21, 37, 75, .18);
    color: #101c3c;
  }

  .mobile-disclosure-icon {
    position: relative;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
  }

  .mobile-disclosure-icon::before,
  .mobile-disclosure-icon::after {
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    height: 1px;
    background: currentColor;
    content: "";
    transition: transform 160ms ease;
  }

  .mobile-disclosure-icon::after {
    transform: rotate(90deg);
  }

  [aria-expanded="true"] > .mobile-disclosure-icon::after {
    transform: rotate(0);
  }

  .legal-toc ol {
    grid-template-columns: 1fr !important;
    padding-top: 8px !important;
  }

  .legal-toc a {
    min-height: 44px !important;
    align-content: center;
    padding-block: 10px !important;
  }

  .legal-clause {
    scroll-margin-top: calc(var(--hd-height-mobile, 68px) + 16px) !important;
  }

  .legal-clause + .legal-clause {
    margin-top: 44px !important;
  }

  .legal-clause h2 {
    align-items: flex-start !important;
    gap: 10px !important;
    font-size: clamp(1.4rem, 6.6vw, 1.72rem) !important;
  }

  .legal-clause :is(p, li, address) {
    font-size: 1rem !important;
    line-height: 1.72 !important;
  }

  .participant-policy-page :is(.participant-callout, .participant-highlight-callout) {
    padding: 20px 18px !important;
  }

  .participant-policy-page .participant-principle-grid {
    grid-template-columns: 1fr !important;
  }

  .cookie-policy-page .legal-table-wrap {
    overflow: visible !important;
    border: 0 !important;
  }

  .cookie-policy-page .legal-table {
    display: block;
    width: 100% !important;
    min-width: 0 !important;
  }

  .cookie-policy-page .legal-table caption {
    display: block;
    border: 1px solid rgba(66, 88, 125, .24);
  }

  .cookie-policy-page .legal-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .cookie-policy-page .legal-table tbody,
  .cookie-policy-page .legal-table tr,
  .cookie-policy-page .legal-table td {
    display: block;
    width: 100%;
  }

  .cookie-policy-page .legal-table tr {
    margin-top: 14px;
    border: 1px solid rgba(66, 88, 125, .24);
    background: #fffdf8;
  }

  .cookie-policy-page .legal-table td {
    display: grid;
    grid-template-columns: minmax(92px, 34%) minmax(0, 1fr);
    gap: 12px;
    padding: 12px 14px !important;
    overflow-wrap: anywhere;
  }

  .cookie-policy-page .legal-table td::before {
    color: #87671e;
    content: attr(data-mobile-label);
    font: 500 .66rem/1.45 var(--mono, "Fragment Mono", monospace);
    letter-spacing: .045em;
    text-transform: uppercase;
  }

  /* Footer: brand remains visible; information groups become concise accordions. */
  .home-page .global-footer.site-footer,
  .inner-page .global-footer.site-footer,
  .legal-page .global-footer.site-footer,
  .privacy-page .global-footer.site-footer,
  .cookie-policy-page .global-footer.site-footer,
  .participant-policy-page .global-footer.site-footer {
    padding: 38px var(--jv-mobile-gutter) 0 !important;
  }

  .global-footer .footer-newsletter {
    gap: 20px !important;
    padding-bottom: 28px !important;
  }

  .global-footer .footer-newsletter-form {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .global-footer .footer-email-field input,
  .global-footer .footer-subscribe-button {
    min-height: 50px !important;
  }

  .global-footer .footer-newsletter-consent,
  .global-footer .footer-newsletter-consent span {
    white-space: normal !important;
  }

  .global-footer .footer-brand-block {
    padding: 24px 0 !important;
  }

  .global-footer .footer-column {
    padding: 0 !important;
  }

  .global-footer .footer-column > h3 {
    margin: 0 !important;
  }

  .global-footer .footer-column .mobile-disclosure-toggle {
    color: var(--gold-light, #dfbc66);
  }

  .global-footer .mobile-disclosure-content {
    display: grid;
    gap: 2px;
    padding: 0 0 18px;
  }

  .global-footer .footer-column.is-mobile-open .mobile-disclosure-content {
    padding-top: 2px;
  }

  .global-footer .footer-explore-grid {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  .global-footer .footer-column a,
  .global-footer .footer-contact-details a {
    min-height: 46px !important;
    align-items: center;
  }

  .global-footer .footer-program-logos {
    width: min(100%, 240px) !important;
    max-width: 240px !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding-top: 8px;
  }

  .global-footer .footer-legal-links {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  .global-footer .footer-legal-links a {
    min-height: 44px !important;
    justify-content: flex-start;
  }

  .floating-back-top {
    bottom: max(14px, env(safe-area-inset-bottom)) !important;
    min-height: 48px !important;
    max-width: calc(100% - 32px);
  }
}

@media (max-width: 420px) {
  :root {
    --jv-mobile-gutter: 18px;
  }

  .global-header .brand-logo-frame {
    width: clamp(108px, 32vw, 128px) !important;
  }

  .global-header .hd-cta {
    min-height: 40px !important;
    padding-inline: 9px !important;
    font-size: .56rem !important;
  }

  .global-header .nav-toggle {
    width: 40px !important;
    height: 40px !important;
    flex-basis: 40px;
  }

  body.inner-page .inner-page-main > .section:not(:first-child),
  body.page-roundtables .roundtables-section {
    padding-block: 48px !important;
  }

  .home-page :is(.infrastructure-items, .compact-lifecycle-cue ol, .org-outcomes) {
    grid-template-columns: 1fr !important;
  }

  body.page-roundtables .rt-inquiry-field {
    min-height: 380px !important;
  }

  .cookie-policy-page .legal-table td {
    grid-template-columns: 1fr;
    gap: 5px;
  }
}

@media (max-width: 340px) {
  :root {
    --jv-mobile-gutter: 16px;
  }

  .global-header .hd-shell {
    width: calc(100% - 10px) !important;
  }

  .global-header .brand-logo-frame {
    width: 104px !important;
  }

  .global-header .hd-actions {
    gap: 4px !important;
  }

  .global-header .hd-cta {
    padding-inline: 7px !important;
    font-size: .53rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-disclosure-icon::after,
  .floating-back-top {
    transition: none !important;
  }
}
