/* Respondo public polish — footer navigation and readable mobile pricing/signup.
   Scoped to marketing pages; owner dashboard, bot and widget unchanged. */

/* The site directory replaces the fullscreen public menu. */
#app .footer .footer-site-nav{
  display:block;
  margin-top:clamp(30px,5vw,56px);
  padding:clamp(24px,4vw,38px) 0 12px;
  border-top:1px solid rgba(125,139,161,.25);
  color:inherit;
}
#app .footer .footer-site-nav h4{
  margin:0 0 17px;
  font-size:12px;
  font-weight:750;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:inherit!important;
  -webkit-text-fill-color:currentColor!important;
}
#app .footer .footer-site-links{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px clamp(14px,2vw,30px);
}
#app .footer .footer-site-links a{
  display:flex;
  align-items:center;
  min-width:0;
  min-height:44px;
  padding:8px 0;
  font-size:clamp(14px,1.2vw,16px);
  font-weight:520;
  line-height:1.4;
  text-decoration:none;
  overflow-wrap:anywhere;
  color:inherit!important;
  -webkit-text-fill-color:currentColor!important;
  opacity:.9;
}
#app .footer .footer-site-links a:is(:hover,:focus-visible){opacity:1;text-decoration:underline;text-underline-offset:4px}
#app .footer .footer-site-links a:focus-visible{outline:2px solid #67aaff;outline-offset:3px}
@media(max-width:800px){
  #app .footer .footer-site-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 22px}
}
/* Keep the flag selector centered where the mobile menu button used to be. */
@media(max-width:760px){
  body.public-nav-active #app .nav .container.navin{position:relative!important}
  body.public-nav-active #app .nav .navactions{
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    transform:translate(-50%,-50%)!important;
    margin:0!important;
    max-width:calc(100% - 100px)!important;
    overflow:visible!important;
    justify-content:center!important;
  }
}

/* Price section: fix pale label chips with white text and badge clipping. */
#app .pricing-section{
  scroll-margin-top:90px;
}
#app .pricing-section .section-kicker{
  display:inline-flex!important;
  align-items:center;
  min-height:32px;
  padding:7px 13px!important;
  border:1px solid rgba(167,193,231,.27)!important;
  border-radius:999px!important;
  background:#1b2635!important;
  color:#f3f7ff!important;
  -webkit-text-fill-color:#f3f7ff!important;
  font-size:12px!important;
  line-height:1.25!important;
  white-space:normal;
  text-shadow:none!important;
  opacity:1!important;
}
#app .pricing-section .split-head h2{
  color:#f5f7fb!important;
  -webkit-text-fill-color:#f5f7fb!important;
  opacity:1!important;
  text-shadow:none!important;
  text-wrap:balance;
}
#app .pricing-section .split-head p{
  color:#bdc9d9!important;
  -webkit-text-fill-color:#bdc9d9!important;
  opacity:1!important;
}
#app .pricing-section .price-card .price-top{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  gap:9px 12px;
  font-size:11px!important;
  line-height:1.35;
  min-width:0;
}
#app .pricing-section .price-card .price-top > span:first-child{
  color:#eaf0f9!important;
  -webkit-text-fill-color:#eaf0f9!important;
  padding-top:7px;
}
#app .pricing-section .price-card .price-top > span:last-child{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  min-height:30px;
  padding:7px 11px!important;
  border:1px solid #51637a!important;
  border-radius:999px!important;
  background:#263345!important;
  color:#f3f8ff!important;
  -webkit-text-fill-color:#f3f8ff!important;
  font-size:10px!important;
  line-height:1.3!important;
  font-weight:750!important;
  text-shadow:none!important;
  opacity:1!important;
  max-width:100%;
  white-space:normal;
  text-align:center;
}
#app .pricing-section .price-card.featured .price-top > span:last-child{
  background:#1f4765!important;
  border-color:#397ca8!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
#app .pricing-section .price-card .pricevalue{
  color:#f8fbff!important;
  -webkit-text-fill-color:#f8fbff!important;
}
#app .pricing-section .price-card .pricevalue small{
  color:#c4d1e0!important;
  -webkit-text-fill-color:#c4d1e0!important;
}

/* The signup intro is on a dark page; old brand CSS specified dark text. */
#app .signup-dark-shell .r-brand-signup-intro{
  color:#f6f8fc!important;
  -webkit-text-fill-color:#f6f8fc!important;
  opacity:1!important;
  max-width:650px;
  padding:0 8px;
}
#app .signup-dark-shell .r-brand-signup-intro h1{
  color:#f7f9fe!important;
  -webkit-text-fill-color:#f7f9fe!important;
  font-weight:740!important;
  text-shadow:none!important;
  opacity:1!important;
  line-height:1.16!important;
  text-wrap:balance;
}
#app .signup-dark-shell .r-brand-signup-intro p{
  color:#bec9db!important;
  -webkit-text-fill-color:#bec9db!important;
  opacity:1!important;
  line-height:1.6!important;
}
#app .signup-dark-shell .r-brand-signup-intro .r-brand-eyebrow{
  color:#aebbd0!important;
  -webkit-text-fill-color:#aebbd0!important;
  opacity:1!important;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
}
#app .signup-dark-shell .r-brand-signup-intro .r-brand-eyebrow-line{
  background:rgba(180,199,228,.38)!important;
}

/* Compact readable cards on an actual phone rather than desktop overflow. */
@media(max-width:640px){
  #app .pricing-section .container{max-width:100%!important}
  #app .pricing-section .split-head{padding:0 4px;margin-bottom:28px!important}
  #app .pricing-section .split-head h2{
    font-size:clamp(34px,9vw,52px)!important;
    line-height:1.13!important;
    letter-spacing:-.055em!important;
    overflow-wrap:normal;
  }
  #app .pricing-section .split-head p{font-size:15px!important;line-height:1.65!important}
  #app .pricing-section .price-card{
    box-sizing:border-box;
    min-width:0;
    padding:clamp(21px,5vw,26px)!important;
    overflow:visible!important;
  }
  #app .pricing-section .price-card :is(li,p){overflow-wrap:break-word}
  #app .pricing-section .price-card .price-top > span:last-child{max-width:64%}
  #app .pricing-section .price-card .pricevalue{
    font-size:clamp(45px,12.5vw,64px)!important;
    white-space:nowrap;
  }
  #app .signup-dark-shell .formpage.signup-page{
    padding-top:clamp(38px,9vw,58px)!important;
  }
  #app .signup-dark-shell .r-brand-signup-intro{
    margin:0 auto 27px!important;
    width:calc(100% - 30px)!important;
  }
  #app .signup-dark-shell .r-brand-signup-intro h1{
    font-size:clamp(29px,8.2vw,39px)!important;
  }
  #app .signup-dark-shell .r-brand-signup-intro p{
    font-size:14px!important;
  }
}
@media(prefers-reduced-motion:reduce){
  #app .footer .footer-site-links a{transition:none!important}
}

/* Defensive rule for an old iOS Safari cached spiral template. Signup remains available in pricing/footer. */
#app .rs-spiral-section .rs-hero-actions a[data-respondo-hero-cta="signup"]{display:none!important}
#app .rs-spiral-section .rs-hero-actions{justify-content:center!important}

/* Chat-first navigation: site directory removed, legal footer retained. */
#app .footer .footer-ask-respondo{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:22px;
  margin-top:clamp(25px,4vw,42px);
  padding:clamp(21px,3vw,30px);
  border:1px solid rgba(170,184,205,.26);
  border-radius:21px;
  background:rgba(140,160,190,.065);
}
#app .footer .footer-ask-respondo strong{
  display:block;
  font-weight:730;
  font-size:clamp(18px,2.2vw,24px);
  line-height:1.2;
  color:inherit;
}
#app .footer .footer-ask-respondo p{
  margin:8px 0 0;
  max-width:670px;
  font-size:clamp(13px,1.3vw,15px);
  line-height:1.55;
  color:inherit;
  opacity:.78;
}
#app .footer .footer-chat-open{
  flex:0 0 auto;
  min-width:134px;
  min-height:45px;
  padding:11px 17px;
  border:1px solid rgba(145,166,196,.55);
  border-radius:999px;
  background:#f4f6fa;
  color:#10151c;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  transition:background-color .25s ease,transform .25s ease;
}
#app .footer .footer-chat-open:hover{background:#dce9f9;transform:translateY(-1px)}
#app .footer .footer-chat-open:focus-visible{outline:3px solid #80b6ff;outline-offset:3px}
.fx-assistant .fx-site-action{
  display:flex;
  align-items:center;
  justify-content:center;
  width:fit-content;
  max-width:100%;
  min-height:44px;
  margin-top:12px;
  padding:11px 15px;
  border:1px solid #b6cce5;
  border-radius:999px;
  background:#eef5ff;
  color:#154b8e!important;
  -webkit-text-fill-color:#154b8e!important;
  text-decoration:none!important;
  line-height:1.4;
  font-size:13px;
  font-weight:700;
  text-align:center;
  overflow-wrap:anywhere;
  transition:background-color .22s ease,border-color .22s ease;
}
.fx-assistant .fx-site-action:hover{background:#e0eeff;border-color:#8bb4e5}
.fx-assistant .fx-site-action:focus-visible{outline:3px solid #458fee;outline-offset:3px}
.fx-assistant .fx-quick{display:flex;flex-wrap:wrap;gap:7px}
.fx-assistant .fx-quick button{min-height:36px;line-height:1.3}
@media(max-width:640px){
  #app .footer .footer-ask-respondo{align-items:stretch;flex-direction:column;padding:21px 18px}
  #app .footer .footer-chat-open{width:100%}
  .fx-assistant .fx-site-action{min-height:44px;font-size:13px}
}
@media(prefers-reduced-motion:reduce){
  #app .footer .footer-chat-open,.fx-assistant .fx-site-action{transition:none!important;transform:none!important}
}

/* Compact public header: logo • languages • sign in. No hamburger or footer CTA. */
#app .nav .container.navin.public-simple-navin {
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;
  align-items:center!important;
  column-gap:clamp(6px,2vw,20px)!important;
}
#app .nav .public-simple-navin > .logo {
  grid-column:1;
  justify-self:start;
  min-width:0!important;
  margin:0!important;
}
#app .nav .public-simple-navin > .navactions {
  grid-column:2;
  justify-self:center;
  position:static!important;
  left:auto!important;
  top:auto!important;
  right:auto!important;
  transform:none!important;
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  flex:0 0 auto!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
}
#app .nav .public-simple-navin > .public-header-login {
  grid-column:3;
  justify-self:end;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  flex:none!important;
  min-height:42px;
  padding:10px clamp(13px,1.5vw,21px);
  border:1px solid rgba(255,255,255,.28);
  border-radius:13px;
  background:#f7f8fa;
  color:#11151d!important;
  -webkit-text-fill-color:#11151d!important;
  font-size:clamp(12px,1vw,14px);
  font-weight:720;
  line-height:1.2;
  letter-spacing:-.01em;
  white-space:nowrap;
  text-decoration:none!important;
  box-shadow:0 2px 9px rgba(0,0,0,.1);
  transition:background-color .24s ease,transform .24s ease;
}
#app .nav .public-simple-navin > .public-header-login:hover {
  background:#e3eaf5;
  transform:translateY(-1px);
}
#app .nav .public-simple-navin > .public-header-login:focus-visible {
  outline:3px solid #70b1ff!important;
  outline-offset:3px;
}
@media(max-width:680px) {
  #app .nav .container.navin.public-simple-navin {
    grid-template-columns:minmax(34px,1fr) auto minmax(74px,1fr)!important;
    column-gap:5px!important;
  }
  #app .nav .public-simple-navin > .logo .brand-word {display:none!important}
  #app .nav .public-simple-navin > .public-header-login {
    min-height:40px;
    padding:9px 12px;
    border-radius:11px;
    font-size:12px;
  }
}
@media(max-width:360px) {
  #app .nav .public-simple-navin > .public-header-login {
    min-height:38px;
    padding:9px 9px;
    font-size:11px;
  }
  #app .nav .public-simple-navin .app-language-option {
    width:25px!important;
    min-width:25px!important;
  }
}
@media(prefers-reduced-motion:reduce) {
  #app .nav .public-simple-navin > .public-header-login {
    transition:none!important;
    transform:none!important;
  }
}