/* =========================
   CRT Landing Header — v2
   Compact brand bar · logo + centred tagline
   ========================= */

.crt-brand-header{
  /* Full-bleed inside HubSpot / Atlas wrappers — scrollbar-safe (no width:100vw) */
  --crt-bh-bleed:max(0px, calc((100vw - 100%) / 2));
  width:auto;
  max-width:none;
  margin-left:calc(-1 * var(--crt-bh-bleed));
  margin-right:calc(-1 * var(--crt-bh-bleed));
  padding-left:var(--crt-bh-bleed);
  padding-right:var(--crt-bh-bleed);
  position:relative;
  display:flex;
  justify-content:center;
  isolation:isolate;
  overflow:hidden;
  z-index:9999;
  box-sizing:border-box;

  --crt-logo-h-active:var(--crt-logo-h, 56px);
  --crt-logo-y-active:var(--crt-logo-y, 0px);
  --crt-tag-x-active:var(--crt-tag-x, 0px);
  --crt-tag-y-active:var(--crt-tag-y, 0px);
  --crt-tag-fs-active:var(--crt-tag-fs, 18px);
  --crt-tag-align-active:var(--crt-tag-align, center);
  --crt-tag-maxw-active:var(--crt-tag-maxw, 640px);
  --crt-pt-active:var(--crt-pt, 32px);
  --crt-pb-active:var(--crt-pb, 32px);

  transition:
    background-color .28s ease,
    box-shadow .28s ease,
    backdrop-filter .28s ease,
    -webkit-backdrop-filter .28s ease;
}

@supports (width:100dvw){
  .crt-brand-header{
    --crt-bh-bleed:max(0px, calc((100dvw - 100%) / 2));
  }
}

/* ----- Theme presets (when no background override) ----- */

.crt-brand-header--theme-light:not(.has-bg-override){
  background:var(--crt-brand-gradient, linear-gradient(180deg, #3d5169 0%, #f7f4ef 100%));
  --crt-tag-color:rgba(255, 255, 255, 0.93);
  --crt-switch-text:#ffffff;
  --crt-switch-bg:rgba(15, 20, 30, 0.55);
  --crt-switch-border:rgba(255, 255, 255, 0.2);
  --crt-switch-dd-bg:rgba(15, 20, 30, 0.94);
}

.crt-brand-header--theme-light .crt-brand-header__logo-fallback{
  color:#ffffff;
}

.crt-brand-header.has-tagline-shadow.crt-brand-header--theme-light .crt-brand-header__tagline,
.crt-brand-header.has-tagline-shadow.crt-brand-header--theme-dark .crt-brand-header__tagline,
.crt-brand-header.has-tagline-shadow.crt-brand-header--theme-overlay .crt-brand-header__tagline{
  text-shadow:0 1px 2px rgba(0, 0, 0, var(--crt-tag-shadow-opacity, 0.18));
}

.crt-brand-header--theme-minimal:not(.has-bg-override){
  background:var(--crt-nav-bg, #f7f4ef);
  --crt-tag-color:#3d4654;
  --crt-switch-text:#ffffff;
  --crt-switch-bg:rgba(26, 32, 44, 0.72);
  --crt-switch-border:rgba(255, 255, 255, 0.18);
  --crt-switch-dd-bg:rgba(26, 32, 44, 0.92);
}

.crt-brand-header--theme-dark:not(.has-bg-override){
  background:linear-gradient(180deg, var(--crt-dark-top, #1a2332) 0%, var(--crt-dark-bottom, #243044) 100%);
  --crt-tag-color:rgba(255, 255, 255, 0.92);
  --crt-switch-text:#ffffff;
  --crt-switch-bg:rgba(255, 255, 255, 0.14);
  --crt-switch-border:rgba(255, 255, 255, 0.22);
  --crt-switch-dd-bg:rgba(15, 20, 30, 0.94);
}

.crt-brand-header--theme-overlay:not(.has-bg-override){
  background:rgba(15, 20, 30, var(--crt-overlay-bg-opacity, 0.55));
  backdrop-filter:blur(var(--crt-overlay-blur, 10px));
  -webkit-backdrop-filter:blur(var(--crt-overlay-blur, 10px));
  --crt-tag-color:rgba(255, 255, 255, 0.94);
  --crt-switch-text:#ffffff;
  --crt-switch-bg:rgba(255, 255, 255, 0.14);
  --crt-switch-border:rgba(255, 255, 255, 0.22);
  --crt-switch-dd-bg:rgba(15, 20, 30, 0.94);
}

.crt-brand-header--theme-dark .crt-brand-header__logo-fallback,
.crt-brand-header--theme-overlay .crt-brand-header__logo-fallback,
.crt-brand-header--theme-light .crt-brand-header__logo-fallback{
  color:#ffffff;
}

/* ----- Background override ----- */

.crt-brand-header.has-bg-override{
  background:var(--crt-bg-base, transparent);
}

.crt-brand-header.has-bg-override::after{
  content:"";
  position:absolute;
  inset:-2px;
  background-image:var(--crt-bg, none);
  background-size:cover;
  background-repeat:no-repeat;
  background-position:var(--crt-bg-pos, 50% 50%);
  pointer-events:none;
  -webkit-clip-path:inset(2px);
  clip-path:inset(2px);
  z-index:0;
}

.crt-brand-header.has-bg-override::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:var(--crt-overlay, transparent);
  pointer-events:none;
  -webkit-clip-path:inset(2px);
  clip-path:inset(2px);
  z-index:1;
}

.crt-brand-header.has-bg-override:not(.has-bg-override--image)::after,
.crt-brand-header.has-bg-override:not(.has-bg-override--image)::before{
  display:none;
}

/* ----- Sticky ----- */

.crt-brand-header.is-sticky{
  position:fixed;
  top:var(--crt-sticky-top, 0px);
  left:0;
  right:0;
  --crt-bh-bleed:0px;
  width:100%;
  max-width:none;
  margin-left:0;
  margin-right:0;
  padding-left:0;
  padding-right:0;
  z-index:99999;
}

.crt-brand-header.is-sticky.is-scrolled{
  backdrop-filter:blur(var(--crt-sticky-blur, 8px));
  -webkit-backdrop-filter:blur(var(--crt-sticky-blur, 8px));
  box-shadow:0 8px 24px rgba(0, 0, 0, var(--crt-sticky-shadow-opacity, 0.08));
}

.crt-brand-header.is-sticky.is-scrolled .crt-brand-header__inner{
  --crt-pt-active:max(14px, calc(var(--crt-pt, 32px) - 4px));
  --crt-pb-active:max(14px, calc(var(--crt-pb, 32px) - 4px));
}

.crt-brand-header.has-sticky-compact-tagline.is-sticky.is-scrolled{
  --crt-logo-h-active:calc(var(--crt-logo-h, 56px) * 0.92);
  --crt-tag-fs-active:max(13px, calc(var(--crt-tag-fs, 18px) - 1px));
}

/* ----- Inner grid ----- */

.crt-brand-header__inner{
  position:relative;
  width:100%;
  max-width:min(100%, var(--crt-maxw, 1680px));
  padding-top:calc(var(--crt-pt-active) + env(safe-area-inset-top, 0px));
  padding-bottom:var(--crt-pb-active);
  padding-left:calc(var(--crt-pl, 28px) + env(safe-area-inset-left, 0px));
  padding-right:calc(var(--crt-pr, 28px) + env(safe-area-inset-right, 0px));
  display:grid;
  grid-template-columns:auto minmax(0, 1fr) auto;
  grid-template-areas:"logo tagline switch";
  align-items:center;
  column-gap:var(--crt-gap, 20px);
  row-gap:0;
  z-index:2;
  box-sizing:border-box;
  transition:padding .24s ease;
}

.crt-brand-header.has-no-switcher .crt-brand-header__inner{
  grid-template-columns:auto minmax(0, 1fr);
  grid-template-areas:"logo tagline";
}

/* ----- Logo ----- */

.crt-brand-header__logo{
  grid-area:logo;
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  min-width:0;
  max-width:min(100%, var(--crt-logo-maxw, 360px));
  text-decoration:none;
  transform:translateY(var(--crt-logo-y-active, 0px));
  transition:transform .24s ease;
}

.crt-brand-header__logo img{
  max-height:var(--crt-logo-h-active);
  max-width:100%;
  width:auto;
  height:auto;
  display:block;
}

.crt-brand-header__logo-fallback{
  color:var(--crt-tag-color, #4a5568);
  font-weight:700;
  font-size:14px;
  line-height:1.2;
  text-decoration:none;
  white-space:nowrap;
}

/* ----- Tagline (centred on desktop — v2) ----- */

.crt-brand-header__tagline-wrap{
  grid-area:tagline;
  min-width:0;
  display:flex;
  justify-content:center;
  align-items:center;
}

.crt-brand-header--tagline-after-logo{
  /* Tablet logo (48px): +4px nudge · Desktop logo (59px): auto-lifts ~7px */
  --crt-tag-baseline-nudge:calc(
    4px - clamp(0px, calc(var(--crt-logo-h-active, 56px) - 48px), 16px) * 0.6
  );
}

.crt-brand-header--tagline-after-logo .crt-brand-header__inner{
  align-items:baseline;
}

.crt-brand-header--tagline-after-logo .crt-brand-header__logo{
  line-height:0;
}

.crt-brand-header--tagline-after-logo .crt-brand-header__tagline-wrap{
  justify-content:flex-start;
  align-items:baseline;
}

.crt-brand-header--tagline-after-logo .crt-brand-header__tagline{
  width:auto;
  max-width:min(var(--crt-tag-maxw-active), 100%);
  text-align:left;
}

.crt-brand-header--tagline-after-logo .crt-lang{
  align-self:center;
}

/* Inline: match tagline baseline to the visually shifted logo lockup */
@media (min-width:550px){
  .crt-brand-header--tagline-after-logo .crt-brand-header__tagline{
    white-space:nowrap;
    text-wrap:nowrap;
    transform:translate(
      var(--crt-tag-x-active, 0px),
      calc(var(--crt-tag-y-active, 0px) + var(--crt-logo-y-active, 0px) + var(--crt-tag-baseline-nudge, 0px))
    );
  }
}

.crt-brand-header__tagline-wrap.is-empty{
  min-height:0;
}

.crt-brand-header__tagline{
  margin:0;
  max-width:min(var(--crt-tag-maxw-active), 100%);
  width:100%;
  color:var(--crt-tag-color, #4a5568);
  font-size:var(--crt-tag-fs-active);
  font-weight:var(--crt-tag-fw, 400);
  font-style:var(--crt-tag-style, normal);
  line-height:var(--crt-tag-lh, 1.25);
  text-align:var(--crt-tag-align-active, center);
  transform:translate(var(--crt-tag-x-active, 0px), var(--crt-tag-y-active, 0px));
  transition:transform .24s ease;
  text-wrap:balance;
  white-space:normal;
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:manual;
}

/* ----- Language switcher ----- */

.crt-brand-header .crt-lang{
  grid-area:switch;
  position:relative;
  z-index:10;
  justify-self:end;
  align-self:center;
}

.crt-brand-header .crt-lang__summary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:var(--crt-switch-minw, 56px);
  padding:var(--crt-switch-py, 8px) var(--crt-switch-px, 12px);
  border-radius:var(--crt-switch-radius, 999px);
  background:var(--crt-switch-bg);
  border:1px solid var(--crt-switch-border);
  color:var(--crt-switch-text, #fff);
  font-size:var(--crt-switch-fs, 13px);
  font-weight:700;
  line-height:1;
  cursor:pointer;
}

.crt-brand-header .crt-lang__panel{
  position:fixed;
  top:0;
  left:0;
  z-index:2147483000;
  min-width:132px;
  max-width:min(220px, 88vw);
  max-height:min(260px, calc(100svh - 24px));
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:8px;
  border-radius:14px;
  background:var(--crt-switch-dd-bg);
  border:1px solid var(--crt-switch-border);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:0 18px 40px rgba(0, 0, 0, 0.22);
  display:none;
  flex-direction:column;
  gap:6px;
}

.crt-brand-header .crt-lang__panel.is-open{
  display:flex;
}

.crt-brand-header .crt-lang__item{
  width:100%;
  display:flex;
  align-items:center;
  gap:8px;
  text-align:left;
  padding:10px;
  border-radius:10px;
  border:0;
  background:rgba(255, 255, 255, 0.1);
  color:var(--crt-switch-text, #fff);
  cursor:pointer;
  font-size:var(--crt-switch-fs, 13px);
  font-weight:600;
}

.crt-brand-header .crt-lang__item:hover{
  background:rgba(255, 255, 255, 0.16);
}

.crt-brand-header .crt-lang__flag{
  width:20px;
  display:inline-flex;
  justify-content:center;
}

.crt-brand-header .crt-lang__item[disabled]{
  opacity:0.5;
  cursor:default;
}

/* ----- Tablet ----- */

@media (max-width:1024px){
  .crt-brand-header{
    --crt-logo-h-active:var(--crt-logo-h-t, 48px);
    --crt-logo-y-active:var(--crt-logo-y-t, 0px);
    --crt-tag-x-active:var(--crt-tag-x-t, 0px);
    --crt-tag-y-active:var(--crt-tag-y-t, 0px);
    --crt-tag-fs-active:max(16px, calc(var(--crt-tag-fs, 18px) - 1px));
  }

  .crt-brand-header__inner{
    column-gap:max(12px, calc(var(--crt-gap, 20px) - 4px));
    padding-left:calc(20px + env(safe-area-inset-left, 0px));
    padding-right:calc(20px + env(safe-area-inset-right, 0px));
  }
}

/* ----- Compact inline (550–768): tagline stays beside logo ----- */

@media (max-width:768px) and (min-width:550px){
  .crt-brand-header--tagline-after-logo{
    --crt-tag-fs-active:min(15px, var(--crt-tag-fs-active, 18px));
  }

  .crt-brand-header__inner{
    column-gap:max(10px, calc(var(--crt-gap, 20px) - 6px));
  }
}

/* Narrow inline (550–640): slightly smaller type to avoid wrap */

@media (max-width:640px) and (min-width:550px){
  .crt-brand-header--tagline-after-logo{
    --crt-tag-fs-active:14px;
  }

  .crt-brand-header__inner{
    column-gap:max(8px, calc(var(--crt-gap, 20px) - 8px));
  }
}

/* ----- Mobile stack (≤549): tagline drops below logo ----- */

@media (max-width:767px){
  .crt-brand-header{
    --crt-bh-bleed:0px;
    width:100%;
    max-width:100%;
    margin-left:0;
    margin-right:0;
    padding-left:0;
    padding-right:0;
  }
}

@media (max-width:549px){
  .crt-brand-header{
    --crt-logo-h-active:var(--crt-logo-h-m, 40px);
    --crt-logo-y-active:var(--crt-logo-y-m, 0px);
    --crt-tag-x-active:var(--crt-tag-x-m, 0px);
    --crt-tag-y-active:var(--crt-tag-y-m, 0px);
    --crt-tag-fs-active:var(--crt-tag-fs-m, 14px);
    --crt-tag-maxw-active:min(var(--crt-tag-maxw-m, 100%), 100%);
  }

  .crt-brand-header__inner{
    grid-template-columns:minmax(0, 1fr) auto;
    grid-template-areas:
      "logo switch"
      "tagline tagline";
    align-items:start;
    row-gap:10px;
    column-gap:12px;
    padding-top:calc(var(--crt-pt-m, 16px) + env(safe-area-inset-top, 0px));
    padding-bottom:var(--crt-pb-m, 18px);
    padding-left:14px;
    padding-right:14px;
  }

  .crt-brand-header.has-no-switcher .crt-brand-header__inner{
    grid-template-columns:1fr;
    grid-template-areas:
      "logo"
      "tagline";
  }

  .crt-brand-header__logo{
    align-self:center;
    justify-self:start;
  }

  .crt-brand-header.has-no-switcher .crt-brand-header__logo{
    justify-self:start;
  }

  .crt-brand-header--tagline-after-logo .crt-brand-header__inner{
    align-items:start;
  }

  .crt-brand-header--tagline-after-logo .crt-brand-header__logo,
  .crt-brand-header--tagline-after-logo .crt-brand-header__tagline-wrap,
  .crt-brand-header--tagline-after-logo .crt-lang{
    align-self:start;
  }

  .crt-brand-header--tagline-after-logo .crt-brand-header__tagline-wrap{
    justify-content:flex-start;
    align-items:flex-start;
    width:100%;
    padding-left:var(--crt-tag-stack-indent, 0px);
    box-sizing:border-box;
  }

  .crt-brand-header--tagline-after-logo .crt-brand-header__tagline{
    white-space:normal;
    text-wrap:balance;
    text-align:left;
    width:auto;
    max-width:100%;
  }

  .crt-brand-header:not(.crt-brand-header--tagline-after-logo) .crt-brand-header__tagline-wrap{
    justify-content:center;
    align-items:center;
  }

  .crt-brand-header:not(.crt-brand-header--tagline-after-logo){
    --crt-tag-align-active:var(--crt-tag-align-m, center);
  }

  .crt-brand-header .crt-lang{
    align-self:center;
  }

  .crt-brand-header.has-sticky-compact-tagline.is-sticky.is-scrolled{
    --crt-tag-fs-active:max(13px, calc(var(--crt-tag-fs-m, 14px) - 1px));
  }
}

@media (max-width:480px){
  .crt-brand-header__inner{
    row-gap:8px;
    padding-left:14px;
    padding-right:14px;
  }

  .crt-brand-header--tagline-after-logo{
    --crt-tag-fs-active:max(13px, calc(var(--crt-tag-fs-m, 14px) - 1px));
  }

  .crt-brand-header .crt-lang__summary{
    padding:7px 10px;
    font-size:12px;
  }
}