/*
 * Phase 28 — isolated UI corrections.
 * All rules are scoped to body.sam-phase28-ui to protect unrelated templates.
 */

/* 1) Desktop navigation: one to two readable type steps larger without widening the shell. */
body.sam-phase28-ui .sam-header-desktop-nav .sam-menu>li>a{
  padding-inline:clamp(7px,.66vw,10px);
  font-size:clamp(.78rem,.80vw,.89rem);
  font-weight:800;
  letter-spacing:.045em;
}
body.sam-phase28-ui .sam-header-desktop-nav .sam-menu .sub-menu a{
  font-size:.82rem;
  line-height:1.3!important;
}

/* 2) Logo: protected square frame with rounded corners. */
body.sam-phase28-ui .sam-header-system .sam-logo-mark{
  overflow:hidden!important;
  padding:6px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:14px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 24px rgba(0,0,0,.2)!important;
}
body.sam-phase28-ui .sam-header-system .sam-logo-mark img,
body.sam-phase28-ui .sam-header-system .sam-logo-mark .custom-logo{
  width:100%!important;
  height:100%!important;
  padding:0!important;
  border-radius:8px!important;
  object-fit:contain!important;
}
body.sam-phase28-ui .sam-mobile-nav__brand .sam-logo-mark{
  border-radius:12px!important;
  padding:5px!important;
}

/* 3) Mobile drawer: a true side drawer, constrained to the viewport with its own scroll region. */
body.sam-phase28-ui .sam-mobile-nav{
  height:calc(100vh - var(--sam-p27-admin-offset))!important;
  height:calc(100dvh - var(--sam-p27-admin-offset))!important;
  min-height:0!important;
  overflow:hidden!important;
}
body.sam-phase28-ui .sam-mobile-nav__panel{
  width:min(370px,88vw)!important;
  max-width:calc(100vw - 34px)!important;
  height:100%!important;
  min-height:0!important;
  max-height:100%!important;
  overflow:hidden!important;
  padding-bottom:env(safe-area-inset-bottom,0px);
}
body.sam-phase28-ui .sam-mobile-nav__head{
  flex:0 0 auto;
}
body.sam-phase28-ui .sam-mobile-nav__menu{
  flex:1 1 auto;
  min-height:0;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,177,22,.5) rgba(255,255,255,.04);
}
body.sam-phase28-ui .sam-mobile-nav__menu::-webkit-scrollbar{width:5px}
body.sam-phase28-ui .sam-mobile-nav__menu::-webkit-scrollbar-track{background:rgba(255,255,255,.035)}
body.sam-phase28-ui .sam-mobile-nav__menu::-webkit-scrollbar-thumb{background:rgba(255,177,22,.48);border-radius:99px}
body.sam-phase28-ui .sam-header-system .sam-header-actions--mobile{
  position:relative;
  flex:0 0 auto;
  margin:0 16px!important;
  padding:14px 0!important;
}
body.sam-phase28-ui .sam-mobile-nav__footer{
  flex:0 0 auto;
  padding:11px 16px calc(14px + env(safe-area-inset-bottom,0px))!important;
}

/* 4) Header cart popover. */
body.sam-phase28-ui .sam-header-cart-wrap{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}
body.sam-phase28-ui .sam-header-cart{
  cursor:pointer;
  font-family:inherit;
}
body.sam-phase28-ui .sam-header-cart[aria-expanded="true"]{
  border-color:rgba(255,177,22,.72)!important;
  background:rgba(255,177,22,.15)!important;
}
body.sam-phase28-ui .sam-cart-popover{
  position:absolute;
  z-index:1450;
  top:calc(100% + 14px);
  right:0;
  width:min(340px,calc(100vw - 24px));
  padding:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.13);
  border-radius:18px;
  background:linear-gradient(180deg,#151820 0%,#0c0e13 100%);
  color:#fff;
  box-shadow:0 28px 80px rgba(0,0,0,.5);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-8px) scale(.985);
  transform-origin:top right;
  transition:opacity .18s ease,transform .2s ease,visibility .18s ease;
}
body.sam-phase28-ui .sam-header-cart-wrap.is-open .sam-cart-popover{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
}
body.sam-phase28-ui .sam-cart-popover:before{
  content:"";
  position:absolute;
  right:22px;
  top:-7px;
  width:13px;
  height:13px;
  border-left:1px solid rgba(255,255,255,.13);
  border-top:1px solid rgba(255,255,255,.13);
  background:#151820;
  transform:rotate(45deg);
}
body.sam-phase28-ui .sam-cart-popover__head{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:16px 17px 13px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
body.sam-phase28-ui .sam-cart-popover__head span{
  font-family:"Barlow Condensed",Impact,sans-serif;
  font-size:1rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
body.sam-phase28-ui .sam-cart-popover__close{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  padding:0;
  border:1px solid rgba(255,255,255,.1);
  border-radius:9px;
  background:rgba(255,255,255,.045);
  color:#fff;
  font-size:1.15rem;
  line-height:1;
  cursor:pointer;
}
body.sam-phase28-ui .sam-cart-popover__close:hover,
body.sam-phase28-ui .sam-cart-popover__close:focus-visible{
  border-color:rgba(255,177,22,.55);
  background:rgba(255,177,22,.13);
  outline:none;
}
body.sam-phase28-ui .sam-cart-popover__items{
  display:grid;
  gap:0;
  max-height:255px;
  overflow:auto;
}
body.sam-phase28-ui .sam-cart-popover__item{
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  padding:12px 16px;
  border-bottom:1px solid rgba(255,255,255,.065);
}
body.sam-phase28-ui .sam-cart-popover__thumb{
  display:block;
  width:48px;
  height:48px;
  overflow:hidden;
  border-radius:11px;
  background:rgba(255,255,255,.06);
}
body.sam-phase28-ui .sam-cart-popover__thumb img{width:100%;height:100%;object-fit:cover}
body.sam-phase28-ui .sam-cart-popover__item-copy{display:grid;gap:4px;min-width:0}
body.sam-phase28-ui .sam-cart-popover__item-copy a{
  overflow:hidden;
  color:#fff;
  font-size:.78rem;
  font-weight:800;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body.sam-phase28-ui .sam-cart-popover__item-copy small{color:rgba(255,255,255,.5);font-size:.68rem}
body.sam-phase28-ui .sam-cart-popover__item-price{color:var(--sam-p27-accent);font-size:.73rem;font-weight:900;white-space:nowrap}
body.sam-phase28-ui .sam-cart-popover__more{
  padding:9px 16px;
  color:rgba(255,255,255,.5);
  font-size:.69rem;
  text-align:center;
}
body.sam-phase28-ui .sam-cart-popover__empty{
  padding:26px 18px 21px;
  text-align:center;
}
body.sam-phase28-ui .sam-cart-popover__empty strong{display:block;font-size:.92rem}
body.sam-phase28-ui .sam-cart-popover__empty span{display:block;margin-top:7px;color:rgba(255,255,255,.5);font-size:.76rem;line-height:1.5}
body.sam-phase28-ui .sam-cart-popover__foot{
  display:grid;
  gap:11px;
  padding:14px 16px 16px;
  background:rgba(255,255,255,.025);
}
body.sam-phase28-ui .sam-cart-popover__subtotal{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  color:rgba(255,255,255,.58);
  font-size:.75rem;
}
body.sam-phase28-ui .sam-cart-popover__subtotal strong{color:#fff;font-size:.9rem}
body.sam-phase28-ui .sam-cart-popover__view{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 14px;
  border-radius:11px;
  background:var(--sam-p27-accent);
  color:#121318!important;
  font-family:"Barlow Condensed",Impact,sans-serif;
  font-size:.82rem;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase;
}
body.sam-phase28-ui .sam-cart-popover__view:hover{filter:brightness(1.04);transform:translateY(-1px)}

/* 6) About mini-stat contrast: light cards always use dark readable copy. */
body.sam-phase28-ui .sam-home #about .sam-mini-stats>div{
  background:#f5f5f7!important;
  border-color:rgba(17,18,22,.12)!important;
}
body.sam-phase28-ui .sam-home #about .sam-mini-stats strong{
  color:#14151a!important;
}
body.sam-phase28-ui .sam-home #about .sam-mini-stats span{
  color:#656872!important;
}

/* 7) Mobile horizontal snap rails for repeated cards to reduce page height. */
@media(max-width:767px){
  body.sam-phase28-ui .sam-home :is(
    .sam-problem-grid,
    .sam-service-grid,
    .sam-solution-grid,
    .sam-p26-work-grid,
    .sam-p15-product-grid,
    .sam-package-grid,
    .sam-p15-proof-grid,
    .sam-team-grid,
    .sam-post-grid,
    .sam-stats-grid,
    .sam-mini-stats
  ){
    display:grid!important;
    grid-template-columns:none!important;
    grid-auto-flow:column!important;
    grid-auto-columns:minmax(260px,82%)!important;
    gap:14px!important;
    width:auto!important;
    margin-inline:0 -11px!important;
    padding:4px 22px 16px 0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    overscroll-behavior-inline:contain;
    scroll-padding-inline:0 22px;
    scroll-snap-type:inline mandatory;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,177,22,.6) rgba(0,0,0,.08);
    -webkit-overflow-scrolling:touch;
  }
  body.sam-phase28-ui .sam-home :is(
    .sam-problem-grid,
    .sam-service-grid,
    .sam-solution-grid,
    .sam-p26-work-grid,
    .sam-p15-product-grid,
    .sam-package-grid,
    .sam-p15-proof-grid,
    .sam-team-grid,
    .sam-post-grid,
    .sam-stats-grid,
    .sam-mini-stats
  )::-webkit-scrollbar{height:5px}
  body.sam-phase28-ui .sam-home :is(
    .sam-problem-grid,
    .sam-service-grid,
    .sam-solution-grid,
    .sam-p26-work-grid,
    .sam-p15-product-grid,
    .sam-package-grid,
    .sam-p15-proof-grid,
    .sam-team-grid,
    .sam-post-grid,
    .sam-stats-grid,
    .sam-mini-stats
  )::-webkit-scrollbar-track{background:rgba(0,0,0,.07);border-radius:99px}
  body.sam-phase28-ui .sam-home :is(
    .sam-problem-grid,
    .sam-service-grid,
    .sam-solution-grid,
    .sam-p26-work-grid,
    .sam-p15-product-grid,
    .sam-package-grid,
    .sam-p15-proof-grid,
    .sam-team-grid,
    .sam-post-grid,
    .sam-stats-grid,
    .sam-mini-stats
  )::-webkit-scrollbar-thumb{background:rgba(255,177,22,.65);border-radius:99px}
  body.sam-phase28-ui .sam-home :is(
    .sam-problem-grid,
    .sam-service-grid,
    .sam-solution-grid,
    .sam-p26-work-grid,
    .sam-p15-product-grid,
    .sam-package-grid,
    .sam-p15-proof-grid,
    .sam-team-grid,
    .sam-post-grid,
    .sam-stats-grid,
    .sam-mini-stats
  )>*{
    min-width:0!important;
    width:auto!important;
    grid-column:auto!important;
    grid-row:auto!important;
    scroll-snap-align:start;
    scroll-snap-stop:always;
  }
  body.sam-phase28-ui .sam-home .sam-mini-stats{grid-auto-columns:minmax(230px,76%)!important}
  body.sam-phase28-ui .sam-home .sam-stats-grid{grid-auto-columns:minmax(210px,68%)!important;padding-block:5px 12px!important}
  body.sam-phase28-ui .sam-home .sam-stat{
    min-height:150px;
    display:grid;
    place-content:center;
    padding:22px 18px;
    border:1px solid rgba(255,255,255,.1);
    border-radius:16px;
    background:rgba(255,255,255,.055);
    backdrop-filter:blur(6px);
  }
  body.sam-phase28-ui .sam-home .sam-p26-work-card{
    align-self:stretch;
  }
}

/* Header/cart responsive safeguards. */
@media(max-width:1280px){
  body.sam-phase28-ui .sam-header-desktop-nav .sam-menu>li>a{font-size:.74rem;padding-inline:6px}
}
@media(max-width:1024px){
  body.sam-phase28-ui .sam-header-system .sam-header-actions--mobile .sam-header-cart-wrap{
    width:48px;
    height:48px;
  }
  body.sam-phase28-ui .sam-header-system .sam-header-actions--mobile .sam-header-cart{
    width:48px!important;
    min-width:48px!important;
  }
  body.sam-phase28-ui .sam-header-system .sam-header-actions--mobile .sam-cart-popover{
    position:fixed;
    top:calc(var(--sam-p27-admin-offset) + var(--sam-p27-header-h) + 10px);
    right:12px;
    left:auto;
    width:min(320px,calc(90vw - 28px));
    transform-origin:top right;
  }
}
@media(max-width:560px){
  body.sam-phase28-ui .sam-mobile-nav__panel{
    width:min(350px,90vw)!important;
    max-width:calc(100vw - 24px)!important;
  }
  body.sam-phase28-ui .sam-mobile-nav__menu{padding:12px 14px 8px!important}
  body.sam-phase28-ui .sam-menu--mobile>li>a{
    min-height:60px!important;
    font-size:1.08rem!important;
  }
  body.sam-phase28-ui .sam-mobile-nav__footer span{display:none}
  body.sam-phase28-ui .sam-mobile-nav__footer{justify-content:flex-end}
}

@media(prefers-reduced-motion:reduce){
  body.sam-phase28-ui .sam-cart-popover,
  body.sam-phase28-ui .sam-cart-popover__view{transition:none!important}
}