/* Slovra V6 — PART 1.5
   Home alignment pass: one desktop content rail for Hero / Today / Units / Tools.
   Keeps Part 1.4 colors and typography intact. */

:root{
  --p15-home-rail:980px;
  --p15-home-gap:18px;
}

/* --------------------------------------------------------------------------
   Desktop / large tablet: every primary home section shares one exact rail.
   The visual center already accounted for the desktop navigation rail; this
   pass only removes the mixed 720/980/1120 widths that made the page ragged.
   -------------------------------------------------------------------------- */
@media (min-width:960px){
  #screen-home.slovra-home-simple .hero-banner-container,
  #screen-home.slovra-home-simple .slovra-simple-home,
  #screen-home.slovra-home-simple .slovra-home-preview,
  #screen-home.slovra-home-simple #v21-feature-panel{
    width:min(calc(100% - 56px),var(--p15-home-rail))!important;
    max-width:var(--p15-home-rail)!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
  }

  /* Equal vertical rhythm between the three main blocks. */
  #screen-home.slovra-home-simple .hero-banner-container{
    margin-bottom:var(--p15-home-gap)!important;
  }
  #screen-home.slovra-home-simple .slovra-simple-home{
    margin-top:0!important;
    margin-bottom:var(--p15-home-gap)!important;
  }
  #screen-home.slovra-home-simple .slovra-home-preview{
    margin-top:0!important;
    margin-bottom:22px!important;
    gap:13px!important;
  }

  /* Section heading follows exactly the unit grid edges. */
  #screen-home .slovra-preview-head{
    width:100%!important;
    padding:0 2px!important;
    margin:0!important;
    display:flex!important;
    align-items:flex-end!important;
    justify-content:space-between!important;
    box-sizing:border-box!important;
  }
  #screen-home .slovra-preview-head strong,
  #screen-home .slovra-preview-head button{
    margin:0!important;
  }

  /* Units and quick tools use the same three-column geometry. */
  #screen-home .slovra-unit-preview,
  #screen-home .slovra-tool-dock{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:12px!important;
    box-sizing:border-box!important;
  }

  #screen-home .slovra-tool-dock{
    margin-top:1px!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  #screen-home .slovra-tool-dock button{
    width:100%!important;
    min-height:82px!important;
    margin:0!important;
    padding:12px 16px!important;
    border-radius:18px!important;
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    align-items:center!important;
    justify-content:initial!important;
    gap:12px!important;
    text-align:left!important;
  }
  #screen-home .slovra-tool-dock span,
  #screen-home .slovra-tool-dock button:nth-child(1) span,
  #screen-home .slovra-tool-dock button:nth-child(2) span,
  #screen-home .slovra-tool-dock button:nth-child(3) span{
    width:42px!important;
    height:42px!important;
    flex-basis:42px!important;
    margin:0!important;
  }
  #screen-home .slovra-tool-dock b{
    font-size:16px!important;
    line-height:1.05!important;
    text-align:left!important;
    justify-self:start!important;
  }

  /* When the user expands the full unit/class grids, keep those on the same
     rail as the preview instead of falling back to the old full-width layout. */
  #screen-home.slovra-home-simple.slovra-units-open > .leader-subtitle.slovra-simple-units-title,
  #screen-home.slovra-home-simple.slovra-classes-open > .leader-subtitle.slovra-simple-classes-title,
  #screen-home.slovra-home-simple.slovra-units-open > #category-grid,
  #screen-home.slovra-home-simple.slovra-classes-open > #grade-grid{
    width:min(calc(100% - 56px),var(--p15-home-rail))!important;
    max-width:var(--p15-home-rail)!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
  }
  #screen-home.slovra-home-simple.slovra-units-open > .leader-subtitle.slovra-simple-units-title,
  #screen-home.slovra-home-simple.slovra-classes-open > .leader-subtitle.slovra-simple-classes-title{
    left:auto!important;
    padding-left:2px!important;
    padding-right:2px!important;
  }

  /* One consistent card baseline. */
  #screen-home .slovra-unit-preview > *,
  #screen-home .slovra-tool-dock > *{
    min-width:0!important;
  }
}

/* --------------------------------------------------------------------------
   Mid widths: one fluid gutter value prevents the sections from drifting.
   -------------------------------------------------------------------------- */
@media (min-width:721px) and (max-width:959px){
  #screen-home.slovra-home-simple .hero-banner-container,
  #screen-home.slovra-home-simple .slovra-simple-home,
  #screen-home.slovra-home-simple .slovra-home-preview,
  #screen-home.slovra-home-simple #v21-feature-panel{
    width:calc(100% - 36px)!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  #screen-home .slovra-tool-dock{
    width:100%!important;
    max-width:none!important;
  }
}

/* --------------------------------------------------------------------------
   Mobile: leave the established 2-column focus cards intact, only normalize
   shared side gutters so Hero / Today / Units do not shift by a few pixels.
   -------------------------------------------------------------------------- */
@media (max-width:720px){
  #screen-home.slovra-home-simple .hero-banner-container,
  #screen-home.slovra-home-simple .slovra-simple-home,
  #screen-home.slovra-home-simple .slovra-home-preview,
  #screen-home.slovra-home-simple #v21-feature-panel{
    width:calc(100% - 24px)!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
  }
  #screen-home .slovra-preview-head{padding-left:1px!important;padding-right:1px!important}
  #screen-home .slovra-tool-dock{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important}
}
