/* deploy-mobile-polish: 2026-08-24 */
@import url("style-base-20260824.css?v=20260824a");

/* Smartphone polish 2026-08-24: compact header, clear menu, equal phone/LINE access. */
@media (max-width:760px){
  body{padding-bottom:74px}

  .site-header .header-shell{
    height:70px!important;
    width:calc(100% - 20px)!important;
    gap:8px!important;
  }
  .site-header .brand{
    min-width:0!important;
    gap:9px!important;
  }
  .site-header .brand-mark{
    width:38px!important;
    height:38px!important;
    border-radius:10px!important;
  }
  .site-header .brand-copy{min-width:0!important}
  .site-header .brand-copy strong{
    font-size:16px!important;
    white-space:nowrap!important;
  }
  .site-header .brand-copy small{
    font-size:8px!important;
    white-space:nowrap!important;
  }
  .site-header .header-actions{
    flex:0 0 auto!important;
    gap:7px!important;
  }
  html body .site-header .header-phone,
  html body .site-header .header-call-button:not(.header-line-button){
    display:none!important;
  }
  html body .site-header .header-line-button,
  html body.home .site-header .header-line-button{
    display:inline-flex!important;
    width:44px!important;
    height:44px!important;
    min-height:44px!important;
    flex:0 0 44px!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
    gap:0!important;
    border:1px solid #06C755!important;
    border-radius:12px!important;
    background:#F4FFF8!important;
    color:#163D2B!important;
    box-shadow:none!important;
  }
  html body .site-header .header-line-button span{display:none!important}
  html body .site-header .header-line-button img,
  html body.home .site-header .header-line-button img{
    width:32px!important;
    height:32px!important;
    margin:0!important;
    border-radius:6px!important;
    object-fit:contain!important;
  }
  .site-header .menu-button{
    display:block!important;
    width:44px!important;
    height:44px!important;
    flex:0 0 44px!important;
    border-radius:12px!important;
  }
  .site-header .menu-button span:nth-of-type(2){left:11px!important;top:16px!important}
  .site-header .menu-button span:nth-of-type(3){left:11px!important;top:25px!important}
  .site-header .menu-button[aria-expanded="true"] span:nth-of-type(2),
  .site-header .menu-button[aria-expanded="true"] span:nth-of-type(3){top:21px!important}

  html body .mobile-menu:not([hidden]){
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    align-content:start!important;
    gap:10px!important;
    top:70px!important;
    height:calc(100dvh - 70px)!important;
    padding:14px 14px calc(24px + env(safe-area-inset-bottom))!important;
    background:#f6fafb!important;
    color:var(--ink)!important;
  }
  html body .mobile-menu nav{
    grid-column:1/-1!important;
    overflow:hidden!important;
    padding:3px 14px!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    background:#fff!important;
    box-shadow:0 10px 30px rgba(13,41,64,.07)!important;
  }
  html body .mobile-menu li{border-bottom:1px solid #e4edf1!important}
  html body .mobile-menu li:last-child{border-bottom:0!important}
  html body .mobile-menu nav a{
    min-height:49px!important;
    padding:0!important;
    color:var(--ink)!important;
    font-size:15px!important;
    font-weight:800!important;
  }
  html body .mobile-menu nav a::after{
    color:var(--teal)!important;
    font-size:14px!important;
  }
  html body .mobile-menu > .mobile-call{
    min-width:0!important;
    min-height:104px!important;
    margin:0!important;
    padding:12px 8px!important;
    align-content:center!important;
    justify-content:center!important;
    border-radius:14px!important;
    box-shadow:0 8px 22px rgba(13,41,64,.10)!important;
    text-align:center!important;
  }
  html body .mobile-menu > .mobile-call:not(.mobile-line-call){
    background:var(--teal)!important;
    color:#fff!important;
  }
  html body .mobile-menu > .mobile-line-call,
  html body.home .mobile-menu > .mobile-line-call{
    background:#F4FFF8!important;
    color:#163D2B!important;
    border:1px solid #06C755!important;
  }
  html body .mobile-menu > .mobile-call small{
    font-size:9.5px!important;
    line-height:1.4!important;
    white-space:normal!important;
  }
  html body .mobile-menu > .mobile-call strong{
    margin-top:5px!important;
    font-size:15px!important;
    line-height:1.25!important;
    white-space:nowrap!important;
    letter-spacing:0!important;
  }
  html body .mobile-menu > .mobile-call span{
    margin-top:5px!important;
    font-size:10px!important;
    line-height:1.35!important;
    white-space:normal!important;
  }
  html body .mobile-menu > .mobile-line-call .line-menu-title{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
  }
  html body .mobile-menu > .mobile-line-call img,
  html body.home .mobile-menu > .mobile-line-call img{
    width:30px!important;
    height:30px!important;
    flex:0 0 30px!important;
    margin:0!important;
    border-radius:6px!important;
  }

  html body .floating-call,
  html body .floating-line{
    min-height:56px!important;
    padding:10px 8px!important;
    border-radius:13px!important;
  }
  html body .floating-call span,
  html body .floating-line span{
    font-size:13.5px!important;
    font-weight:850!important;
    line-height:1.2!important;
  }
  html body .floating-line .line-brand-icon{
    width:27px!important;
    height:27px!important;
    margin-right:6px!important;
    border-radius:5px!important;
  }
  body.menu-open .floating-call,
  body.menu-open .floating-line{display:none!important}
}

@media (max-width:370px){
  .site-header .brand-copy small{display:none!important}
  html body .mobile-menu:not([hidden]){
    gap:8px!important;
    padding-left:11px!important;
    padding-right:11px!important;
  }
  html body .mobile-menu nav{
    padding-left:11px!important;
    padding-right:11px!important;
  }
  html body .mobile-menu > .mobile-call strong{font-size:14px!important}
  html body .floating-call span,
  html body .floating-line span{font-size:13px!important}
}

/* LINE soft-surface release: 2026-08-24f
   Official #06C755 stays as the accent; large filled green areas are softened. */
html body .site-header .header-line-button,
html body.home .site-header .header-line-button{
  background:#F4FFF8!important;
  border-color:#06C755!important;
  color:#163D2B!important;
  box-shadow:0 6px 16px rgba(6,199,85,.10)!important;
}
html body .site-header .header-line-button:hover,
html body.home .site-header .header-line-button:hover{
  background:#E8FFF0!important;
  border-color:#06C755!important;
  color:#163D2B!important;
  box-shadow:0 8px 20px rgba(6,199,85,.13)!important;
}
html body.home .hero-line-cta,
html body.home .contact-line-display,
html body .mobile-menu > .mobile-line-call,
html body.home .mobile-menu > .mobile-line-call,
html body .floating-line{
  background:#F4FFF8!important;
  border-color:#06C755!important;
  color:#163D2B!important;
  box-shadow:0 8px 20px rgba(6,199,85,.10)!important;
}
html body.home .hero-line-cta:hover,
html body.home .contact-line-display:hover,
html body .mobile-menu > .mobile-line-call:hover,
html body.home .mobile-menu > .mobile-line-call:hover,
html body .floating-line:hover{
  background:#E8FFF0!important;
  color:#163D2B!important;
}
html body.home .hero-line-cta small,
html body.home .hero-line-cta strong,
html body.home .hero-line-cta span,
html body.home .contact-line-display small,
html body.home .contact-line-display strong,
html body.home .contact-line-display span,
html body .mobile-menu > .mobile-line-call small,
html body .mobile-menu > .mobile-line-call strong,
html body .mobile-menu > .mobile-line-call span,
html body .floating-line span{
  color:#163D2B!important;
  opacity:1!important;
}

/* mobile-line-icon-size: 2026-08-24g */

/* mobile-line-header-cleanup: 2026-08-24h */
@media (max-width:760px){
  html body .site-header .header-line-button,
  html body.home .site-header .header-line-button{
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  html body .floating-line{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
  }
  html body .floating-line .line-brand-icon{
    width:27px!important;
    height:27px!important;
    flex:0 0 27px!important;
    display:block!important;
    margin:0!important;
    object-fit:contain!important;
    transform:none!important;
  }
  html body .floating-line span{
    display:block!important;
    line-height:1!important;
  }
}

/* mobile-line-icon-rebalance: 2026-08-24i */
@media (max-width:760px){
  html body .site-header .header-line-button,
  html body.home .site-header .header-line-button{
    width:44px!important;
    height:44px!important;
    min-height:44px!important;
    flex:0 0 44px!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  html body .site-header .header-line-button img,
  html body.home .site-header .header-line-button img{
    width:40px!important;
    height:40px!important;
    max-width:none!important;
    flex:0 0 40px!important;
    display:block!important;
    margin:0!important;
    object-fit:contain!important;
  }

  html body .floating-line{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:10px!important;
  }
  html body .floating-line .line-brand-icon{
    width:36px!important;
    height:36px!important;
    max-width:none!important;
    flex:0 0 36px!important;
    display:block!important;
    margin:0!important;
    object-fit:contain!important;
    transform:none!important;
  }
  html body .floating-line span{
    display:block!important;
    margin:0!important;
    line-height:1.1!important;
  }
}

/* mobile-menu-scroll-slide: 2026-08-24j */
@keyframes mobileMenuSlideIn{
  from{transform:translateX(26px);opacity:0}
  to{transform:translateX(0);opacity:1}
}
@media (max-width:760px){
  html body .mobile-menu:not([hidden]){
    grid-template-rows:minmax(0,1fr) auto!important;
    overflow:hidden!important;
    animation:mobileMenuSlideIn .24s cubic-bezier(.2,.8,.2,1) both!important;
  }
  html body .mobile-menu nav{
    min-height:0!important;
    max-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    touch-action:pan-y!important;
    scrollbar-width:thin!important;
    padding-bottom:14px!important;
  }
  html body .mobile-menu nav ul{
    min-height:max-content!important;
  }
  html body .mobile-menu > .mobile-call{
    align-self:stretch!important;
  }
}
@media (prefers-reduced-motion:reduce){
  html body .mobile-menu:not([hidden]){animation:none!important}
}
