/* PR73 landing width + navbar follow-up.
   Make the public page use the viewport cleanly, keep the desktop nav full-bleed,
   and collapse mobile to one compact row with Sign in + Guest mode. */

body.recs-landing.landing-balanced .balanced-shell{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}

body.recs-landing.landing-balanced .balanced-nav{
  width:100%!important;
  max-width:none!important;
  box-sizing:border-box!important;
  padding-left:clamp(18px,3vw,48px)!important;
  padding-right:clamp(18px,3vw,48px)!important;
  grid-template-columns:minmax(190px,1fr) auto minmax(190px,1fr)!important;
  gap:20px!important;
}
body.recs-landing.landing-balanced .balanced-brand{justify-self:start!important}
body.recs-landing.landing-balanced .balanced-links{justify-self:center!important}
body.recs-landing.landing-balanced .balanced-nav-actions{
  justify-self:end!important;
  min-width:0!important;
}

body.recs-landing.landing-balanced .balanced-main{
  width:100%!important;
  max-width:none!important;
  box-sizing:border-box!important;
  padding-bottom:42px!important;
}
body.recs-landing.landing-balanced :is(.balanced-hero,.balanced-section,.balanced-cta,.balanced-footer){
  box-sizing:border-box!important;
  width:100%!important;
  max-width:none!important;
  padding-left:clamp(18px,3vw,48px)!important;
  padding-right:clamp(18px,3vw,48px)!important;
}
body.recs-landing.landing-balanced .balanced-hero{
  grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr)!important;
}
body.recs-landing.landing-balanced .balanced-section{
  padding-top:clamp(68px,8vw,96px)!important;
  padding-bottom:clamp(68px,8vw,96px)!important;
}
body.recs-landing.landing-balanced .balanced-cta{
  margin-left:clamp(18px,3vw,48px)!important;
  margin-right:clamp(18px,3vw,48px)!important;
  width:auto!important;
}
body.recs-landing.landing-balanced .balanced-footer{
  padding-top:24px!important;
  padding-bottom:30px!important;
}

@media(max-width:900px){
  body.recs-landing.landing-balanced .balanced-nav{
    min-height:calc(68px + env(safe-area-inset-top,0px))!important;
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    gap:10px!important;
    padding-top:calc(8px + env(safe-area-inset-top,0px))!important;
    padding-right:max(14px,env(safe-area-inset-right,0px))!important;
    padding-bottom:8px!important;
    padding-left:max(14px,env(safe-area-inset-left,0px))!important;
  }
  body.recs-landing.landing-balanced .balanced-links{
    display:none!important;
  }
  body.recs-landing.landing-balanced .balanced-nav-actions{
    justify-self:end!important;
    width:auto!important;
    display:flex!important;
    gap:7px!important;
  }
  body.recs-landing.landing-balanced .balanced-nav-actions .landing-btn{
    display:inline-flex!important;
    width:auto!important;
    min-width:0!important;
    min-height:40px!important;
    padding:0 13px!important;
    white-space:nowrap!important;
  }
  body.recs-landing.landing-balanced :is(.balanced-hero,.balanced-section,.balanced-footer){
    padding-left:14px!important;
    padding-right:14px!important;
  }
  body.recs-landing.landing-balanced .balanced-hero{
    grid-template-columns:1fr!important;
    gap:34px!important;
  }
  body.recs-landing.landing-balanced .balanced-cta{
    margin-left:14px!important;
    margin-right:14px!important;
    padding-left:18px!important;
    padding-right:18px!important;
  }
}

@media(max-width:560px){
  body.recs-landing.landing-balanced .balanced-nav{
    padding-left:max(10px,env(safe-area-inset-left,0px))!important;
    padding-right:max(10px,env(safe-area-inset-right,0px))!important;
  }
  body.recs-landing.landing-balanced .balanced-brand{
    gap:7px!important;
  }
  body.recs-landing.landing-balanced .balanced-brand-mark{
    width:30px!important;
    height:30px!important;
  }
  body.recs-landing.landing-balanced .balanced-nav-actions{
    gap:6px!important;
  }
  body.recs-landing.landing-balanced .balanced-nav-actions .landing-btn{
    min-height:38px!important;
    padding:0 11px!important;
    border-radius:11px!important;
    font-size:.78rem!important;
  }
  body.recs-landing.landing-balanced :is(.balanced-hero,.balanced-section,.balanced-footer){
    padding-left:10px!important;
    padding-right:10px!important;
  }
  body.recs-landing.landing-balanced .balanced-cta{
    margin-left:10px!important;
    margin-right:10px!important;
  }
}

/* Capture the user's real accent on the root before the landing page applies
   its light-mode contrast overrides on body. Brand paint always uses this. */
html{--recs-brand-accent:var(--accent)}

/* PR75: landing-page light mode uses a dark neutral accent instead of the
   site's white accent. This keeps accent copy, progress fills, outlines and
   controls visible on pale landing surfaces without changing dark mode. */
html[data-theme="light"] body.recs-landing.landing-balanced{
  --accent:#111318!important;
  --accent-dim:rgba(17,19,24,.12)!important;
  --accent-btn-text:#fff!important;
  color:#111318!important;
}

html[data-theme="light"] body.recs-landing.landing-balanced :is(
  .balanced-brand,
  .balanced-links a,
  .balanced-eyebrow,
  .balanced-hero h1,
  .balanced-hero-copy,
  .balanced-guest,
  .balanced-section-label,
  .balanced-section-heading h2,
  .balanced-section-heading p,
  .balanced-demo-head span,
  .balanced-demo-head h3,
  .activity-sample strong,
  .activity-sample span,
  .activity-stars,
  .dna-mini-top,
  .dna-mini-top b,
  .dna-mini-tags span,
  .recs-mini-prompt,
  .recs-mini-card strong,
  .recs-mini-card span,
  .balanced-app-top,
  .balanced-app-tabs b,
  .balanced-app-heading h3,
  .balanced-app-heading p,
  .balanced-poster-copy strong,
  .balanced-poster-copy span,
  .balanced-app-note,
  .balanced-app-note span,
  .balanced-app-note strong,
  .balanced-fit,
  .balanced-cta,
  .balanced-cta p,
  .balanced-footer,
  .balanced-footer button
){
  color:#111318!important;
  -webkit-text-fill-color:#111318!important;
}

html[data-theme="light"] body.recs-landing.landing-balanced .landing-btn:not(.primary){
  color:#111318!important;
  -webkit-text-fill-color:#111318!important;
  border-color:rgba(17,19,24,.30)!important;
  background:rgba(255,255,255,.56)!important;
}
html[data-theme="light"] body.recs-landing.landing-balanced .landing-btn.primary,
html[data-theme="light"] body.recs-landing.landing-balanced .auth-submit{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  background:#111318!important;
  border-color:#111318!important;
}

html[data-theme="light"] body.recs-landing.landing-balanced :is(
  .balanced-brand-mark,
  .balanced-media-line span,
  .balanced-app,
  .balanced-fit,
  .balanced-poster-card,
  .balanced-app-note,
  .balanced-section,
  .balanced-demo,
  .balanced-demo-head,
  .activity-sample,
  .dna-mini-row,
  .dna-mini-tags span,
  .recs-mini-prompt,
  .recs-mini-card,
  .balanced-cta
){
  border-color:rgba(17,19,24,.22)!important;
}

html[data-theme="light"] body.recs-landing.landing-balanced .balanced-nav{
  border-bottom-color:rgba(17,19,24,.24)!important;
}
html[data-theme="light"] body.recs-landing.landing-balanced .balanced-footer{
  border-top-color:rgba(17,19,24,.22)!important;
}
html[data-theme="light"] body.recs-landing.landing-balanced .balanced-bg::after{
  background-image:
    linear-gradient(rgba(17,19,24,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(17,19,24,.045) 1px,transparent 1px)!important;
}

/* Poster artwork intentionally stays dark; retain white title lettering there. */
html[data-theme="light"] body.recs-landing.landing-balanced .poster-art .poster-name{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}

/* PR75: all RECS branding uses one solid selected accent, never a text gradient. */
body.recs-landing.landing-balanced .balanced-brand,
body.recs-landing.landing-balanced .balanced-brand > span:last-child{
  background:none!important;
  background-image:none!important;
  color:var(--recs-brand-accent,var(--accent))!important;
  -webkit-text-fill-color:var(--recs-brand-accent,var(--accent))!important;
  -webkit-background-clip:border-box!important;
  background-clip:border-box!important;
}