/* Public/auth shell uses the approved Logivio icon and wordmark. */
.public-navbar {
  position: relative !important;
  min-height: 70px;
  padding-block: .45rem;
  background: rgba(255,255,255,.98) !important;
  border-bottom: 1px solid #dbe4e1 !important;
  box-shadow: 0 4px 18px rgba(15,23,42,.05);
  backdrop-filter: blur(16px);
}
.public-navbar .container-fluid { max-width: 1320px; }
.public-navbar .navbar-brand { display:inline-flex; align-items:center; width:190px; height:56px; padding:0; background:url("/static/images/logivio-brand.svg") left center/contain no-repeat; text-decoration:none !important; }
.public-navbar .navbar-brand:hover,.public-navbar .navbar-brand:focus { text-decoration:none !important; }
.public-navbar .navbar-brand img { display:none; }
.public-navbar .public-brand-icon { display:none; }
.public-navbar .navbar-brand::before,.public-navbar .navbar-brand::after { content:none; }
.public-navbar .nav-link { display:none !important; }
.public-navbar .navbar-toggler { display:none !important; }
.public-navbar .navbar-collapse { display:flex !important; flex-basis:auto; }
.public-navbar .navbar-nav { margin-left:auto; flex-direction:row; align-items:center; gap:.6rem; padding:0 !important; }
.public-navbar .btn-outline-light { color:#0b1220; border-color:#0b1220; background:#fff; }
.public-navbar .btn-outline-light:hover,.public-navbar .btn-outline-light:focus { color:#fff; background:#0b1220; }
.public-navbar .btn-success { color:#fff !important; }

/* Brand lockups on authentication and public content pages. */
a[href="/"]:has(img[alt="Logivio"]) { text-decoration:none !important; }
a[href="/"]:has(img[alt="Logivio"]):hover { text-decoration:none !important; }
img[alt="Logivio"]:not(.public-navbar-logo) { content:url("/static/images/logivio-brand.svg"); width:auto; max-width:220px; height:auto !important; }

/* Only the homepage hero may use display-scale typography. */
.public-navbar ~ .container.mt-4 h1,
.public-navbar ~ .container.mt-4 .display-1,
.public-navbar ~ .container.mt-4 .display-2,
.public-navbar ~ .container.mt-4 .display-3,
.public-navbar ~ .container.mt-4 .display-4 {
  font-size:clamp(2.2rem,3.4vw,3.25rem) !important;
  line-height:1.1 !important;
  letter-spacing:-.035em !important;
}
.public-navbar ~ .container.mt-4 h2 { font-size:clamp(1.65rem,2.3vw,2.25rem) !important; line-height:1.15 !important; }
.public-navbar ~ .container.mt-4 h3 { font-size:clamp(1.25rem,1.65vw,1.75rem) !important; line-height:1.2 !important; }
.public-navbar ~ .container.mt-4 .card h1,
.public-navbar ~ .container.mt-4 form h1 { font-size:clamp(1.9rem,2.6vw,2.55rem) !important; }
.public-navbar ~ .container.mt-4 .card h2,
.public-navbar ~ .container.mt-4 .card h3 { font-size:clamp(1.45rem,2vw,2rem) !important; }

@media (max-width:767.98px) {
  .public-navbar { min-height:62px; }
  .public-navbar .container-fluid {
    display:grid !important;
    grid-template-columns:44px minmax(0,1fr);
    align-items:center;
    gap:.5rem;
    width:100%;
  }
  .public-navbar .navbar-brand {
    display:block;
    width:44px;
    min-width:44px;
    height:46px;
    background:none !important;
    overflow:hidden;
  }
  .public-navbar .navbar-brand .public-brand-wordmark { display:none !important; }
  .public-navbar .navbar-brand .public-brand-icon {
    display:block !important;
    width:40px;
    height:40px;
    max-width:40px;
    object-fit:contain;
  }
  .public-navbar .navbar-collapse {
    display:block !important;
    width:100%;
    min-width:0;
  }
  .public-navbar .navbar-nav {
    display:flex;
    width:100%;
    min-width:0;
    flex-wrap:nowrap;
    justify-content:flex-end;
    gap:.35rem;
  }
  .public-navbar .navbar-nav .btn {
    flex:0 0 auto;
    width:auto !important;
    min-width:0;
    margin:0 !important;
    padding-inline:.65rem;
    font-size:.82rem;
    white-space:nowrap;
  }
  .public-navbar ~ .container.mt-4 h1,
  .public-navbar ~ .container.mt-4 .display-1,
  .public-navbar ~ .container.mt-4 .display-2,
  .public-navbar ~ .container.mt-4 .display-3,
  .public-navbar ~ .container.mt-4 .display-4 { font-size:clamp(2rem,9vw,2.7rem) !important; }
}