/* 99for1.AI v5.29 — mobile QA hardening
   Last-in cascade layer. Designed around viewport behavior, not user-agent sniffing. */

:root{--mobile-gutter:14px}
html,body{max-width:100%;overflow-x:hidden}
img,video,iframe,svg,canvas{max-width:100%;height:auto}

@media (max-width:1100px), (pointer:coarse) and (max-width:1366px){
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:hidden}
  body{width:100%!important;min-width:0!important;overflow-x:hidden!important}
  *,*:before,*:after{box-sizing:border-box}
  input,textarea,select,button{max-width:100%;font-size:16px!important}
  .wrap{width:calc(100% - (var(--mobile-gutter) * 2))!important;max-width:none!important;margin-inline:auto!important}

  /* Public homepage responsive shell */
  .nav{position:sticky!important;top:0!important;z-index:100!important;background:rgba(6,6,6,.97)!important;backdrop-filter:blur(14px)}
  .nav-inner{min-height:60px!important;gap:10px!important}
  .nav-links{display:none!important}
  .public-brand,.brand-logo-link{min-width:0!important}
  .public-brand .brand-logo-img{width:118px!important;max-width:40vw!important;height:auto!important}
  .nav .btn,.nav .btn-sm{min-height:42px!important;padding:9px 11px!important;white-space:nowrap!important}
  .retheme-hero{min-height:0!important;padding-top:58vw!important;background-size:100% auto!important;background-position:center top!important;background-repeat:no-repeat!important;background-color:#080808!important}
  .hero-grid{display:block!important;min-height:0!important}
  .hero-copy{padding:18px 0 38px!important;max-width:none!important}
  .hero-copy h1{font-size:clamp(3rem,13vw,4.8rem)!important;line-height:.86!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  .hero-actions .btn{width:100%!important;justify-content:center!important}
  .parchment-grid,.section-heading,.ask-grid,.letters-grid,.apparel-grid,.story-grid,.feminine-section,.nature-grid-section,.stats-grid,.team-grid{grid-template-columns:1fr!important}

  /* Header + navigation */
  .app-top{position:sticky!important;top:0!important;z-index:120!important;background:rgba(5,5,5,.98)!important}
  .app-top .nav-inner{min-height:58px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important}
  .brand-logo-img{width:108px!important;max-width:34vw!important;height:auto!important}
  .brand-tagline{display:none!important}
  .header-profile-link{min-width:0!important;padding:7px 8px!important}
  .header-profile-link span{display:none!important}
  .app-top .btn-sm{min-height:40px!important;padding:9px 10px!important;font-size:.58rem!important;white-space:nowrap!important}

  .app-layout{display:block!important;width:100%!important;min-width:0!important}
  .side{position:sticky!important;top:58px!important;z-index:110!important;width:100%!important;height:auto!important;display:flex!important;flex-flow:row nowrap!important;gap:4px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:7px 8px!important;border-right:0!important;border-bottom:1px solid rgba(214,164,77,.24)!important;background:rgba(8,7,6,.98)!important;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .side::-webkit-scrollbar{display:none}
  .side a{flex:0 0 auto!important;display:flex!important;align-items:center!important;min-height:40px!important;padding:9px 11px!important;white-space:nowrap!important;font-size:.72rem!important}
  .main{width:100%!important;min-width:0!important;max-width:none!important;padding:18px var(--mobile-gutter) max(34px,env(safe-area-inset-bottom,0px))!important;overflow:visible!important}
  .main>*{max-width:100%;min-width:0}
  .main h1{font-size:clamp(2.35rem,10vw,3.35rem)!important;line-height:.94!important;overflow-wrap:normal}
  .main h2{max-width:100%;overflow-wrap:normal}

  /* Home title + metrics: compact 2x2 instead of four giant vertical cards */
  .today-title-row{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:12px!important}
  .profile-daily-link{width:100%!important;min-width:0!important}
  .kpis{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin:14px 0 16px!important}
  .kpi{min-width:0!important;padding:12px!important;min-height:86px!important}
  .kpi span{font-size:.62rem!important;letter-spacing:.1em!important}
  .kpi strong{font-size:1.12rem!important;overflow-wrap:anywhere!important}

  /* Daily card: content participates in layout, never absolute/clipped */
  .daily-experience{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    min-height:70svh!important;
    height:auto!important;
    margin:14px 0 0!important;
    overflow:hidden!important;
    background-size:cover!important;
    background-position:var(--daily-bg-position,center center)!important;
  }
  .daily-experience-top{position:relative!important;z-index:5!important;display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:10px!important;padding:14px!important}
  .daily-source-label{max-width:64%!important;font-size:.60rem!important;line-height:1.35!important}
  .daily-new-button{flex:0 0 auto!important;border:0!important;background:rgba(0,0,0,.58)!important;color:#ef2a25!important;font-weight:900!important;font-size:.76rem!important;padding:10px 9px!important;letter-spacing:.1em!important}
  .daily-experience .daily-experience-center,
  .daily-experience.pos-left-center .daily-experience-center,
  .daily-experience.pos-right-center .daily-experience-center,
  .daily-experience.pos-center .daily-experience-center{
    position:relative!important;
    inset:auto!important;
    z-index:4!important;
    margin-top:auto!important;
    min-height:0!important;
    width:100%!important;
    padding:132px 18px 30px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-end!important;
    align-items:flex-start!important;
    text-align:left!important;
    background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.18) 16%,rgba(0,0,0,.75) 58%,rgba(0,0,0,.94) 100%)!important;
  }
  .daily-experience .daily-immersive-copy{
    width:100%!important;
    max-width:100%!important;
    font-size:clamp(1.82rem,7.3vw,2.75rem)!important;
    line-height:1.02!important;
    overflow-wrap:break-word!important;
    word-break:normal!important;
    hyphens:auto!important;
    text-wrap:balance;
  }
  .daily-experience .daily-immersive-reference{max-width:100%!important;font-size:.86rem!important}
  .daily-experience .daily-immersive-actions{display:flex!important;justify-content:flex-start!important;align-items:center!important;gap:12px!important;flex-wrap:wrap!important;margin-top:22px!important}
  .daily-icon-action{min-width:70px!important;min-height:66px!important}
  .daily-experience-controls{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;align-items:stretch!important;margin:0 0 28px!important;padding:12px!important}
  .daily-experience-controls>div{display:grid!important;gap:4px!important}
  .daily-experience-controls strong{white-space:normal!important;font-size:1rem!important}
  .daily-experience-controls .btn{width:100%!important;min-height:44px!important}

  /* Next steps: no horizontal partial-card overlap */
  .next-step-home,.resource-home{margin:30px 0 42px!important}
  .section-heading-row{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:8px!important;margin-bottom:14px!important}
  .section-heading-row h2{font-size:clamp(2.5rem,11vw,3.4rem)!important;line-height:.95!important}
  .next-step-strip{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:none!important;
    grid-auto-flow:row!important;
    grid-auto-columns:auto!important;
    gap:10px!important;
    width:100%!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
    background:transparent!important;
  }
  .next-step-strip>*{width:100%!important;min-width:0!important;scroll-snap-align:none!important}
  .next-step-tile{min-height:240px!important;padding:22px!important;background-position:center!important}
  .next-step-tile strong{font-size:2.25rem!important;max-width:84%!important}

  /* Resources */
  .resource-grid,.resource-grid-large{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}
  .resource-card{display:grid!important;grid-template-rows:190px auto!important;width:100%!important;min-width:0!important}
  .resource-card>div:last-child{padding:18px!important}

  /* Forms/cards/grids */
  .grid-2,.grid-3,.grid-4,.stats-grid,.team-grid,.church-result-grid,.doctrine-grid,.church-search-options,.church-location-actions,.theme-choice-grid,.tts-controls,.content-type-grid,.group-directory,.book-grid{grid-template-columns:1fr!important}
  .card,.form-card,.testimony,.list-item,.next-step-sidecard{width:100%!important;min-width:0!important;padding:17px!important}
  .btn{min-height:44px!important;touch-action:manipulation}
  textarea,input,select{width:100%!important}

  /* First visit */
  .first-visit-hero{display:grid!important;grid-template-columns:1fr!important;gap:12px!important}
  .first-visit-hero>div:first-child{min-height:430px!important;padding:26px 20px!important;background-position:70% center!important}
  .first-visit-hero h1{font-size:clamp(2.7rem,11vw,3.5rem)!important;line-height:.96!important}
  .first-visit-note{padding:22px!important}
  .first-visit-note strong{font-size:1.95rem!important}

  /* Baptism */
  .baptism-hero{min-height:62svh!important;background-position:58% center!important;align-items:flex-end!important}
  .baptism-hero>div{max-width:100%!important;padding:26px 20px!important}
  .baptism-hero h1{font-size:clamp(3rem,13vw,4rem)!important}

  /* Apologetics: face stays visible, copy stays readable */
  .apol-visual-hero{display:flex!important;flex-direction:column!important;justify-content:flex-end!important;min-height:62svh!important;padding:26px 20px!important;background-position:73% center!important}
  .apol-visual-copy{max-width:100%!important}
  .apol-visual-copy h1{font-size:clamp(2.9rem,12vw,4rem)!important;line-height:.95!important}
  .apol-visual-copy p{font-size:1.1rem!important;line-height:1.4!important}
  .apol-visual-note{font-size:1.25rem!important;text-align:left!important;align-self:flex-start!important;margin-top:14px!important}
  .ai-answer-shell{display:grid!important;grid-template-columns:1fr!important}

  /* Curated voices */
  .voice-browser{display:grid!important;grid-template-columns:1fr!important;min-height:0!important}
  .voice-feature{display:grid!important;grid-template-rows:220px auto!important}
  .voice-feature-media{min-height:220px!important}
  .voice-feature-copy{padding:18px!important}
  .voice-feature-copy h2{font-size:clamp(2.3rem,10vw,3.3rem)!important}
  .voice-feature-actions{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .voice-feature-actions .btn{width:100%!important}
  .voice-roster-list{max-height:none!important;display:grid!important;grid-template-columns:1fr!important}
  .voice-roster-item{display:grid!important;grid-template-columns:64px minmax(0,1fr) 18px!important;width:100%!important;min-width:0!important}
  .voice-roster-thumb{width:64px!important;height:64px!important;object-fit:cover!important}

  /* Tables */
  .table-wrap,.responsive-table,.data-table-wrap{width:100%!important;max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch}
  table{min-width:680px}
}

@media (min-width:701px) and (max-width:1100px){
  .kpis{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .next-step-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .resource-grid,.resource-grid-large{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .grid-2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .first-visit-hero{grid-template-columns:1.15fr .85fr!important}
  .daily-experience .daily-immersive-copy{font-size:clamp(2.2rem,5.6vw,3.6rem)!important;max-width:82%!important}
}

@media(max-width:430px){
  :root{--mobile-gutter:10px}
  .brand-logo-img{width:100px!important}
  .kpis{gap:6px!important}
  .kpi{padding:10px!important;min-height:78px!important}
  .daily-experience{min-height:68svh!important}
  .daily-experience .daily-experience-center,
  .daily-experience.pos-left-center .daily-experience-center,
  .daily-experience.pos-right-center .daily-experience-center,
  .daily-experience.pos-center .daily-experience-center{padding:110px 15px 26px!important}
  .daily-experience .daily-immersive-copy{font-size:clamp(1.72rem,7.8vw,2.45rem)!important}
  .next-step-tile{min-height:220px!important}
}

@media (max-width:1100px) and (orientation:landscape), (pointer:coarse) and (max-width:1366px) and (orientation:landscape){
  .side{top:54px!important}
  .daily-experience{min-height:92svh!important}
  .daily-experience .daily-experience-center,
  .daily-experience.pos-left-center .daily-experience-center,
  .daily-experience.pos-right-center .daily-experience-center,
  .daily-experience.pos-center .daily-experience-center{padding-top:90px!important}
  .apol-visual-hero,.baptism-hero{min-height:88svh!important}
}

@supports(padding:max(0px)){
  @media (max-width:1100px), (pointer:coarse) and (max-width:1366px){
    .app-top{padding-left:max(0px,env(safe-area-inset-left));padding-right:max(0px,env(safe-area-inset-right))}
    .main{padding-bottom:max(34px,env(safe-area-inset-bottom))!important}
  }
}
