/* Reading and touch adjustments for the LP below the hero. */
@media (max-width: 700px) {
  .header-contact { min-height: 44px; font-size: 11px; line-height: 1.4; }
  .section { padding-block: 56px; }
  .section-label { margin-bottom: 28px; padding-bottom: 16px; gap: 12px; font-size: 10px; }
  .section-label > span:first-child { flex-shrink: 0; }
  .section-label > span:last-child:not(:first-child) { font-size: 11px; line-height: 1.7; max-width: 58%; text-align: right; }
  .section-heading { margin-bottom: 32px; }
  .section-heading > p, .showcase-heading > p { font-size: 14px; line-height: 1.9; margin-top: 16px; padding-bottom: 0; }
  .section .button { min-height: 54px; padding: 14px 18px; gap: 16px; font-size: 14px; line-height: 1.6; }
  .section .text-link { min-height: 48px; max-width: 100%; font-size: 14px; line-height: 1.8; padding-block: 9px; gap: 14px; }
  .section .text-link > span { flex-shrink: 0; font-size: 23px; }
  .section .footnote { font-size: 12px; line-height: 1.9; margin-top: 20px; }

  /* Service overview */
  .section-description { font-size: 14px; line-height: 1.95; margin-bottom: 20px; }
  .about-grid { gap: 36px; }
  .about-grid .body-copy { font-size: 14px; line-height: 2; margin-bottom: 22px; }
  .past-work-note { padding: 16px; margin-bottom: 20px; }
  .past-work-note .small-en { font-size: 10px; line-height: 1.6; }
  .past-work-note strong { font-size: 17px; margin-block: 8px; }
  .past-work-note p { font-size: 13px; line-height: 1.95; }
  .benefit-list article { padding-block: 24px; gap: 14px; }
  .benefit-list h3 { font-size: 20px; line-height: 1.6; }
  .benefit-list p { font-size: 14px; line-height: 1.9; }
  .benefit-number { font-size: 12px; }
  .benefit-list .small-en { font-size: 10px; }

  /* Examples: all three panels still share one intrinsic grid height. */
  .showcase-heading { margin-bottom: 24px; }
  .showcase-tabs { gap: 8px; margin-bottom: 24px; }
  .showcase-tabs button {
    min-height: 60px; padding: 12px 8px; justify-content: center;
    text-align: center; font-size: 13px; line-height: 1.6; letter-spacing: 0;
  }
  .showcase-tabs button > span:first-child, .showcase-tabs button > span:last-child { display: none; }
  .showcase-panels > .showcase-panel { gap: 24px; }
  .showcase-copy { min-height: 0; }
  .showcase-copy .pill { font-size: 10px; padding: 5px 10px; margin-bottom: 16px; }
  .showcase-copy h3 { font-size: 27px; line-height: 1.65; margin-bottom: 18px; }
  .showcase-copy > p { font-size: 14px; line-height: 2; margin-bottom: 16px; }
  .minimal-list li { font-size: 13px; line-height: 2.1; padding-left: 20px; }
  .showcase-copy .light-link { margin-top: 20px; }
  .showcase-copy .demo-note { font-size: 12px; line-height: 1.9; color: #c4c4b8; padding-top: 20px; }
  .motion-control {
    left: 16px; right: auto; bottom: 10px; z-index: 5;
    min-height: 44px; min-width: 140px; padding: 8px 12px;
    background: #fffffff2; border: 1px solid #b8b8aa; font-size: 18px;
  }
  .motion-control > span { font-size: 10px; }
  .showcase-panels .web-demo-bottom > div { min-width: 0; }
  .showcase-panels .web-demo-bottom a {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 44px; max-width: 47%; padding: 8px 10px;
    font-size: 10px; line-height: 1.5; text-align: center; white-space: normal;
  }

  /* Use cases */
  .use-grid { gap: 32px 24px; }
  .use-image { aspect-ratio: 1.6; }
  .use-image > span { font-size: 10px; padding: 9px 12px; }
  .use-copy { margin-top: 16px; padding-left: 14px; border-left-width: 3px; }
  .use-copy h3 { font-size: 20px; line-height: 1.6; margin-bottom: 8px; }
  .use-copy p { font-size: 14px; line-height: 1.9; margin-bottom: 8px; }
  .use-tags { font-size: 12px; line-height: 1.9; }

  /* Pricing */
  .plans-grid { grid-template-columns: minmax(0,1fr); gap: 24px; }
  .plan { min-width: 0; padding: 26px 24px; }
  .plan-top { font-size: 12px; margin-bottom: 18px; }
  .plan h3 { font-size: 24px; margin-bottom: 14px; }
  .plan-description { font-size: 14px; line-height: 1.9; }
  .plan-price { font-size: clamp(36px,12vw,46px); }
  .plan-price > small { font-size: 12px; }
  .plan-tax { font-size: 12px; line-height: 1.8; margin-bottom: 20px; }
  .plan-delivery { font-size: 14px; padding-block: 12px; }
  .plan-delivery > strong { font-size: 20px; }
  .plan-features { margin: 20px 0 24px; }
  .plan-features li { font-size: 14px; line-height: 2; padding-left: 20px; }
  .plan .button { min-height: 56px; font-size: 14px; padding-inline: 16px; }
  .plan-recommended { margin-top: 32px; }
  .recommend-label { top: -32px; height: 32px; padding-top: 5px; font-size: 12px; }
  .all-plans { padding: 20px; gap: 12px 16px; font-size: 12px; line-height: 1.7; }
  .all-plans > strong { font-size: 10px; }
  .all-plans > span:nth-child(2) { flex-basis: 100%; border-right: 0; padding-right: 0; }

  /* Process and suitable printed materials */
  .flow-grid { gap: 32px 22px; }
  .step-number { font-size: 40px; padding-bottom: 14px; }
  .flow-grid h3 { font-size: 18px; line-height: 1.6; margin-block: 16px 10px; }
  .flow-grid p { font-size: 14px; line-height: 1.9; }
  .materials { padding: 24px; gap: 22px; margin-top: 36px; }
  .materials .small-en { font-size: 10px; }
  .materials h3 { font-size: 22px; }
  .materials li { font-size: 14px; line-height: 1.8; padding-block: 8px 12px; }
  .materials li:before { top: 13px; }

  /* FAQ */
  .faq-section { padding-top: 12px; }
  .faq-grid { gap: 24px; }
  .faq-list summary { min-height: 64px; font-size: 15px; line-height: 1.8; padding-block: 20px; gap: 12px; }
  .faq-list summary:before { font-size: 16px; }
  .faq-list summary > span { font-size: 24px; flex-shrink: 0; }
  .faq-list details > p { font-size: 14px; line-height: 2; padding: 0 0 24px 26px; }

  /* Contact and inquiry */
  .contact-grid { gap: 32px; }
  .contact-copy > p { font-size: 15px; line-height: 2; }
  .contact-direct > span { font-size: 12px; }
  .contact-direct > a { min-height: 48px; line-height: 1.5; }
  .contact-copy .contact-no-charge { font-size: 12px; line-height: 1.9; margin-top: 20px; }
  .form-card { padding: 28px 22px; min-width: 0; }
  .form-header { flex-direction: column; align-items: flex-start; gap: 6px; margin-bottom: 20px; }
  .form-header h3 { font-size: 21px; line-height: 1.6; }
  .form-header > span { font-size: 12px; }
  .local-notice { font-size: 12px; line-height: 1.9; padding: 14px; margin-bottom: 26px; }
  .local-notice > strong { font-size: 12px; margin-bottom: 6px; }
  .form-field { margin-bottom: 24px; }
  .form-field > label, .plan-fieldset legend { font-size: 14px; line-height: 1.8; margin-bottom: 10px; }
  .optional { font-size: 12px; }
  .form-field input, .form-field select, .form-field textarea { min-height: 52px; font-size: 16px; padding: 13px 12px; line-height: 1.7; }
  .form-field input::placeholder, .form-field textarea::placeholder { font-size: 14px; }
  .form-field textarea { min-height: 170px; }
  .plan-fieldset { margin-bottom: 24px; }
  .plan-options { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .plan-options > label { min-height: 72px; min-width: 0; padding: 12px 10px; gap: 8px; font-size: 14px; line-height: 1.6; }
  .plan-options > label:first-child { font-size: 13px; }
  .plan-options > label > span { min-width: 0; overflow-wrap: anywhere; }
  .plan-options input { width: 20px; height: 20px; }
  .plan-options small { display: block; margin: 3px 0 0; font-size: 12px; }
  .plan-choice-line { display: block; }
  .field-hint { font-size: 12px; line-height: 1.8; margin-top: 8px; }
  .textarea-meta > span:last-child { font-size: 11px; line-height: 2; }
  .field-error { font-size: 13px; line-height: 1.8; margin-top: 6px; }
  .consent-label { min-height: 56px; font-size: 13px; line-height: 1.9; padding-block: 8px; gap: 10px; }
  .consent-label > input { width: 22px; height: 22px; margin-top: 10px; }
  .consent-label .privacy-trigger { display: inline-flex; align-items: center; min-height: 44px; line-height: 1.6; }
  .consent-ending { white-space: nowrap; }
  .submit-button { margin-top: 20px; }
  .section .submit-button { min-height: 56px; font-size: 15px; }
  .form-note { font-size: 12px; line-height: 1.9; margin-top: 14px; }
  .form-error { font-size: 13px; line-height: 1.9; padding: 14px; }
  .form-result { padding-block: 28px; }
  .form-result > p:not(.small-en), .form-result #email-note { font-size: 14px; line-height: 2; }
  .receipt-number strong { font-size: 14px; }

  /* Dialogs and footer */
  .dialog-content { padding: 48px 24px 28px; }
  .dialog h2 { font-size: 24px; line-height: 1.6; }
  .dialog .eyebrow { font-size: 10px; }
  .dialog-close {
    position: sticky; top: 0; right: auto; z-index: 2;
    display: flex; align-items: center; justify-content: center;
    width: 48px; height: 48px; margin: -44px -18px -4px auto; background: #fff;
  }
  .dialog-description { font-size: 14px; line-height: 1.9; }
  .confirmation-list > div { padding-block: 16px; gap: 8px; }
  .confirmation-list dt { font-size: 12px; }
  .confirmation-list dd { font-size: 14px; line-height: 1.9; }
  .confirm-actions { flex-direction: column-reverse; gap: 12px; }
  .confirm-actions .button { flex: none !important; width: 100%; min-height: 52px; padding: 14px 18px; font-size: 14px; }
  .privacy-dialog p { font-size: 14px; line-height: 2; }
  .privacy-dialog h3 { font-size: 16px; }
  .privacy-dialog .footnote { font-size: 12px; }
  .site-footer { padding-bottom: calc(104px + env(safe-area-inset-bottom,0px)); }
  .footer-top > p { font-size: 13px; line-height: 1.9; }
  .back-top { width: 48px; height: 48px; }
  .company-information { font-size: 12px; line-height: 1.9; gap: 8px; }
  .footer-links { font-size: 12px; line-height: 1.8; gap: 6px 18px; }
  .footer-links > a, .footer-links > button { display: inline-flex; align-items: center; min-height: 44px; }
  .footer-links > small { font-size: 10px; margin-top: 14px; }
  .mobile-cta { bottom: max(12px,env(safe-area-inset-bottom,0px)); min-height: 56px; padding-block: 12px; font-size: 14px; line-height: 1.4; }
  .mobile-cta > span { font-size: 23px; line-height: 1; }
}
@media (max-width: 520px) {
  .use-grid { grid-template-columns: minmax(0,1fr); gap: 32px; }
  .use-image { aspect-ratio: 1.7; }
}
@media (max-width: 380px) {
  .header-contact { font-size: 10px; padding-inline: 10px; }
  .section .button { padding-inline: 14px; gap: 12px; }
  .plan { padding-inline: 20px; }
  .plan .button { font-size: 13px; }
  .flow-grid { grid-template-columns: minmax(0,1fr); gap: 28px; }
  .flow-grid > li { display: grid; grid-template-columns: 54px minmax(0,1fr); column-gap: 18px; }
  .step-number { grid-row: 1/3; font-size: 34px; display: block; align-self: start; }
  .step-number > span { display: none; }
  .flow-grid h3 { margin-block: 0 8px; }
  .flow-grid p { grid-column: 2; }
  .materials { padding-inline: 20px; }
  .form-card { padding-inline: 18px; }
  .plan-options > label { padding-inline: 8px; gap: 6px; font-size: 13px; }
  .plan-options > label:first-child { font-size: 12px; }
  .dialog-content { padding-inline: 20px; }
}