/* SERVICES-r40 — services-app sheets/modal hardening for 360 / 430 / 768 / 1024.
   Scope: .services-app-page + .services-app-sheet only.
   Goal: close residual tablet text overlaps without touching JS/API flow. */

.services-app-page,
.services-app-sheet{
  --svc-safe-bottom:calc(82px + env(safe-area-inset-bottom));
}
.services-app-page *,
.services-app-sheet *{
  box-sizing:border-box;
}
.services-app-page :where(h1,b,strong,em,small,span,button,input,textarea),
.services-app-sheet :where(b,strong,em,span,button,input){
  min-width:0;
  overflow-wrap:anywhere;
  word-break:normal;
}
.services-app-phone{
  isolation:isolate;
}
.services-app-nav-head,
.services-app-topline,
.services-app-section-row{
  min-width:0;
}
.services-app-nav-head h1,
.services-app-home-head h1{
  max-width:100%;
  white-space:normal;
}
.services-app-search,
.services-app-emergency-row,
.services-app-grid,
.services-app-list,
.services-app-form,
.services-app-confirm-card,
.services-app-confirm-actions{
  min-width:0;
}
.services-app-tile,
.services-app-list-card,
.services-app-shop-card,
.services-app-selected-card,
.services-app-field,
.services-app-confirm-row{
  overflow:visible;
}
.services-app-list-body,
.services-app-shop-body,
.services-app-selected-card b,
.services-app-field span,
.services-app-confirm-row strong{
  min-width:0;
  max-width:100%;
}
.services-app-field span,
.services-app-selected-card b,
.services-app-selected-card em,
.services-app-confirm-row strong{
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
}
.services-app-selected-card em{
  flex:0 1 auto;
  text-align:right;
}
.services-app-textarea{
  width:100%;
  max-width:100%;
  line-height:1.45;
}
.services-app-submit,
.services-app-bottom-cta,
.services-app-secondary{
  min-height:44px;
  height:auto;
  line-height:1.18;
  padding-top:12px;
  padding-bottom:12px;
  white-space:normal;
  text-align:center;
}

/* 360px: narrow phone guard. */
@media (max-width:380px){
  .services-app-phone{
    width:100%;
    padding-left:12px;
    padding-right:12px;
  }
  .services-app-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }
  .services-app-tile{
    min-height:76px;
    padding:10px 7px;
  }
  .services-app-tile__label{
    font-size:11.5px;
    line-height:1.18;
  }
  .services-app-emergency-row{
    grid-template-columns:1fr;
  }
  .services-app-list-card,
  .services-app-shop-card{
    grid-template-columns:46px minmax(0,1fr) 18px;
    gap:10px;
    padding:10px;
  }
  .services-app-selected-card{
    display:grid;
    grid-template-columns:38px minmax(0,1fr);
    gap:10px;
  }
  .services-app-selected-card em{
    grid-column:2;
    text-align:left;
  }
  .services-app-confirm-row{
    grid-template-columns:1fr;
    gap:4px;
  }
  .services-app-sheet__custom{
    grid-template-columns:1fr;
  }
}

/* 430px: large phone / small foldable guard. */
@media (min-width:381px) and (max-width:767px){
  .services-app-phone{
    width:min(100%, 460px);
  }
  .services-app-tile{
    min-height:82px;
  }
  .services-app-list-card,
  .services-app-shop-card{
    min-height:88px;
  }
  .services-app-selected-card{
    min-height:74px;
  }
  .services-app-field{
    min-height:48px;
    height:auto;
    padding-top:10px;
    padding-bottom:10px;
    align-items:flex-start;
  }
}

/* Shared sheet safety. */
.services-app-sheet{
  padding:max(10px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom));
}
.services-app-sheet__panel{
  min-width:0;
  max-width:100%;
}
.services-app-sheet__head{
  min-width:0;
}
.services-app-sheet__head > div{
  min-width:0;
  flex:1 1 auto;
}
.services-app-sheet__head b,
.services-app-sheet__head span{
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
}
.services-app-sheet__head button{
  flex:0 0 auto;
}
.services-app-sheet__options{
  min-height:0;
  overscroll-behavior:contain;
}
.services-app-sheet__options button{
  height:auto;
  min-height:48px;
  align-items:flex-start;
  white-space:normal;
}
.services-app-sheet__options button span{
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  line-height:1.32;
}
.services-app-sheet__options button em{
  flex:0 0 auto;
}
.services-app-sheet__custom{
  min-width:0;
}
.services-app-sheet__custom input,
.services-app-sheet__custom button{
  min-width:0;
  height:auto;
  min-height:44px;
  white-space:normal;
}

/* 768px tablet portrait. */
@media (min-width:768px) and (max-width:1023px){
  .services-app-page{
    padding-left:24px;
    padding-right:24px;
  }
  .services-app-phone{
    width:min(100%, 820px);
    max-width:820px;
    padding:28px;
  }
  .services-app-page--home .services-app-phone{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    gap:22px;
    align-items:start;
  }
  .services-app-page--home .services-app-home-head,
  .services-app-page--home .services-app-search,
  .services-app-page--home .services-app-emergency-row,
  .services-app-page--home .services-app-nearby{
    grid-column:1;
  }
  .services-app-page--home .services-app-grid{
    grid-column:2;
    grid-row:1 / span 4;
  }
  .services-app-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
  }
  .services-app-page--home .services-app-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .services-app-tile{
    min-height:124px;
    padding:16px 12px;
  }
  .services-app-tile__label{
    font-size:15px;
    line-height:1.22;
  }
  .services-app-emergency-row{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
  }
  .services-app-emergency-row button{
    min-height:56px;
  }
  .services-app-page--category .services-app-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .services-app-list-card,
  .services-app-shop-card{
    min-height:112px;
    align-items:start;
  }
  .services-app-list-body,
  .services-app-shop-body{
    align-self:center;
    gap:5px;
  }
  .services-app-page--request .services-app-phone{
    display:grid;
    grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);
    gap:24px;
    align-items:start;
  }
  .services-app-page--request .services-app-nav-head,
  .services-app-page--request .services-app-selected-card,
  .services-app-page--request .services-app-form-note{
    grid-column:1;
  }
  .services-app-page--request .services-app-form{
    grid-column:2;
    grid-row:1 / span 4;
  }
  .services-app-page--request .services-app-nav-head{
    align-items:flex-start;
  }
  .services-app-field{
    min-height:56px;
    height:auto;
  }
  .services-app-page--confirm .services-app-phone{
    width:min(100%, 760px);
  }
  .services-app-confirm-row{
    grid-template-columns:minmax(150px,.32fr) minmax(0,1fr);
    gap:18px;
  }
  .services-app-sheet{
    padding:28px;
  }
  .services-app-sheet__panel{
    width:min(760px, calc(100vw - 56px));
    max-height:min(86dvh, 760px);
  }
  .services-app-sheet__options{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* 1024px+ wide tablet / desktop preview. */
@media (min-width:1024px){
  .services-app-page{
    padding-left:32px;
    padding-right:32px;
  }
  .services-app-phone{
    width:min(100%, 1080px);
    max-width:1080px;
    padding:32px;
  }
  .services-app-page--home .services-app-phone{
    grid-template-columns:minmax(330px,.42fr) minmax(0,.58fr);
    gap:30px;
  }
  .services-app-page--home .services-app-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
  }
  .services-app-tile{
    min-height:132px;
    border-radius:16px;
  }
  .services-app-tile__icon{
    width:42px;
    height:42px;
  }
  .services-app-tile svg{
    width:36px;
    height:36px;
  }
  .services-app-tile__label{
    font-size:15.5px;
  }
  .services-app-page--category .services-app-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
  }
  .services-app-page--request .services-app-phone{
    grid-template-columns:minmax(320px,.38fr) minmax(0,.62fr);
    gap:32px;
  }
  .services-app-page--request .services-app-form{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:14px;
    row-gap:10px;
  }
  .services-app-page--request .services-app-form-label{
    margin-bottom:-2px;
  }
  .services-app-page--request .services-app-textarea,
  .services-app-page--request .services-app-submit,
  .services-app-page--request .services-app-form-note{
    grid-column:1 / -1;
  }
  .services-app-page--confirm .services-app-phone{
    width:min(100%, 860px);
  }
  .services-app-confirm-card{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .services-app-confirm-row{
    min-height:62px;
    grid-template-columns:1fr;
    gap:5px;
    padding:12px 14px;
    border:1px solid #ececec;
    border-radius:14px;
    background:#fff;
  }
  .services-app-sheet{
    align-items:center;
    padding:36px;
  }
  .services-app-sheet__panel{
    width:min(900px, calc(100vw - 72px));
    max-height:min(86dvh, 820px);
    border-radius:30px;
  }
  .services-app-sheet__options{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
  }
  .services-app-sheet__custom{
    grid-template-columns:minmax(0,1fr) 150px;
  }
}

/* Landscape tablets with low height: reduce vertical pressure without clipping text. */
@media (min-width:768px) and (max-height:760px){
  .services-app-page{
    padding-top:12px;
  }
  .services-app-phone{
    padding-top:20px;
    padding-bottom:20px;
  }
  .services-app-home-head h1{
    font-size:clamp(26px,3vw,34px);
  }
  .services-app-tile{
    min-height:102px;
    padding-top:12px;
    padding-bottom:12px;
  }
  .services-app-page--request .services-app-phone{
    align-items:start;
  }
  .services-app-sheet__panel{
    max-height:92dvh;
  }
  .services-app-sheet__options{
    max-height:calc(92dvh - 190px);
  }
}
