/* V38: mobile structure correction only. Desktop intentionally untouched. */
@media (max-width: 720px){
  .v36-services-page .wrap{width:calc(100% - 20px);max-width:640px}

  /* Hero: preserve a clear text field and keep the photo on the right. */
  .v36-hero{
    background:
      linear-gradient(90deg,rgba(248,253,255,1) 0%,rgba(248,253,255,1) 52%,rgba(248,253,255,.99) 63%,rgba(248,253,255,.84) 74%,rgba(248,253,255,.25) 90%,rgba(248,253,255,.04) 100%),
      url('../assets/subpages/20261011_services-hero-reference-crop.webp') 100% center/auto 100% no-repeat;
  }
  .v36-hero-copy{max-width:340px;padding:26px 0 44px}
  .v36-hero h1{max-width:340px;font-size:1.95rem;line-height:1.34;letter-spacing:-.035em}
  .v36-hero-lead{max-width:326px;font-size:.88rem;line-height:1.62}

  /* Support cards stay 2 columns like the approved comp, but copy gets priority. */
  .v36-support-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .v36-support-card{
    grid-template-columns:22px minmax(0,1fr);
    gap:6px;
    min-height:96px;
    padding:10px 7px;
    align-items:center;
  }
  .v36-icon svg{width:22px;height:22px}
  .v36-support-card h3{
    margin:0 0 4px;
    font-size:.8rem;
    line-height:1.35;
    letter-spacing:-.025em;
    word-break:keep-all;
    overflow-wrap:normal;
  }
  .v36-support-card p{
    font-size:.7rem;
    line-height:1.45;
    letter-spacing:-.01em;
    word-break:normal;
    overflow-wrap:break-word;
  }

  /* Pricing: two-column mobile card.
     Left = plan identity, right = price + features. This avoids crushing Japanese copy. */
  .v36-plan-grid{gap:10px}
  .v36-plan-card{
    display:grid;
    grid-template-columns:40% 60%;
    grid-template-rows:auto 1fr;
    grid-template-areas:
      "intro price"
      "intro features";
    min-height:148px;
    overflow:visible;
  }
  .v36-plan-intro{
    grid-area:intro;
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:100%;
    padding:16px 12px;
    border-radius:8px 0 0 8px;
    text-align:left;
  }
  .v36-plan-intro h3{
    font-size:1rem;
    line-height:1.35;
    letter-spacing:-.025em;
    word-break:keep-all;
    overflow-wrap:normal;
  }
  .v36-plan-intro p{font-size:.75rem;line-height:1.5}
  .v36-plan-price{
    grid-area:price;
    display:flex;
    align-items:baseline;
    justify-content:flex-start;
    gap:4px;
    margin:0;
    padding:14px 12px 3px;
  }
  .v36-plan-price strong{font-size:1.42rem;line-height:1.15;white-space:nowrap}
  .v36-plan-price small{font-size:.58rem;white-space:nowrap}
  .v36-plan-card ul{
    grid-area:features;
    margin:0;
    padding:5px 12px 14px;
    gap:3px;
    align-content:start;
  }
  .v36-plan-card li{
    font-size:.76rem;
    line-height:1.42;
    padding-left:1.25em;
    word-break:keep-all;
    overflow-wrap:normal;
  }
  .v36-recommend{top:-11px}

  /* Secondary services: keep 2x2, but stop squeezing labels and prices into one narrow line. */
  .v36-option-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .v36-option-grid article{
    grid-template-columns:30px minmax(0,1fr);
    gap:7px;
    min-height:96px;
    padding:10px 9px;
    align-items:center;
  }
  .v36-option-icon{font-size:1.55rem}
  .v36-option-grid h3{
    margin-bottom:3px;
    font-size:.76rem;
    line-height:1.35;
    letter-spacing:-.02em;
    word-break:normal;
    overflow-wrap:break-word;
  }
  .v36-option-grid h3 strong{
    display:block;
    margin:2px 0 0;
    font-size:1rem;
    line-height:1.2;
    white-space:nowrap;
  }
  .v36-option-grid h3 small{font-size:.54rem}
  .v36-option-grid p{font-size:.67rem;line-height:1.4}

  /* CTA needs breathing room after the dense comparison content. */
  .v36-contact-cta{padding-top:26px}
  .v36-contact-inner{padding:18px 16px 18px;gap:14px}
  .v36-contact-inner h2{font-size:1.42rem;line-height:1.35}
  .v36-contact-inner>div>p{font-size:.76rem;line-height:1.5}
}

@media (max-width: 430px){
  .v36-services-page .wrap{width:calc(100% - 20px)}
  .v36-header-inner{padding-inline:0}
  .v36-brand{font-size:1.16rem}
  .v36-header-cta{padding:10px 11px}
  .v36-hero h1{font-size:1.88rem}
  .v36-section-head h2{font-size:1.4rem;line-height:1.38}
  .v36-section-head>p:last-child{font-size:.78rem;line-height:1.5}

  .v36-support-card h3{font-size:.78rem}
  .v36-support-card p{font-size:.68rem}

  .v36-plan-card{grid-template-columns:41% 59%;min-height:150px}
  .v36-plan-intro{padding:15px 11px}
  .v36-plan-intro h3{font-size:.96rem}
  .v36-plan-intro p{font-size:.72rem}
  .v36-plan-price{padding:13px 10px 3px}
  .v36-plan-price strong{font-size:1.34rem}
  .v36-plan-card ul{padding:5px 10px 13px}
  .v36-plan-card li{font-size:.73rem;line-height:1.4}

  .v36-option-grid article{grid-template-columns:28px minmax(0,1fr);min-height:94px;padding:9px 8px}
  .v36-option-grid h3{font-size:.73rem}
  .v36-option-grid h3 strong{font-size:.96rem}
  .v36-option-grid p{font-size:.64rem}
}

/* V38 self-review pass 2: Japanese line breaks and hero readability */
@media (max-width:430px){
  .v36-hero{
    background:
      linear-gradient(90deg,rgba(248,253,255,1) 0%,rgba(248,253,255,1) 55%,rgba(248,253,255,.99) 66%,rgba(248,253,255,.9) 76%,rgba(248,253,255,.34) 91%,rgba(248,253,255,.05) 100%),
      url('../assets/subpages/20261011_services-hero-reference-crop.webp') 108% center/auto 100% no-repeat;
  }
  .v36-hero-copy{max-width:348px}
  .v36-hero h1{max-width:348px;font-size:1.82rem;line-height:1.36}
  .v36-hero-lead{max-width:346px;font-size:.8rem;line-height:1.6}
  .v36-hero-lead span{display:block;white-space:nowrap}

  .v36-support-card p br{display:block}
  .v36-support-card p{font-size:.67rem}

  .v36-option-grid article:nth-child(2) h3{letter-spacing:-.04em}
}
@media (max-width:720px){.v38-option-title-line{display:block}}
@media (min-width:721px){.v38-option-title-line{display:inline}}