/*
========================================================
 Brandsborg Interactive
 Project : Website
 File    : layout.css
 Build   : 0011
 Version : 0.8.0
========================================================
*/
.site-header{position:relative;z-index:10;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:86px;padding:0 clamp(20px,4vw,62px);border-bottom:1px solid var(--line);background:rgba(8,9,11,.88);backdrop-filter:blur(18px)}.brand{display:inline-flex;align-items:center;gap:13px;width:max-content;text-decoration:none}.brand>span:last-child{display:grid;line-height:1.15}.brand strong{font-size:.92rem;letter-spacing:.08em;text-transform:uppercase}.brand small{margin-top:5px;color:var(--muted);font-size:.72rem}.main-nav{display:flex;gap:clamp(18px,3vw,40px)}.main-nav a{position:relative;color:var(--muted);font-size:.78rem;font-weight:800;letter-spacing:.1em;text-decoration:none;text-transform:uppercase}.main-nav a:after{position:absolute;right:0;bottom:-9px;left:0;height:2px;background:var(--orange);transform:scaleX(0);transition:.18s;content:""}.main-nav a:hover{color:var(--text)}.main-nav a:hover:after{transform:scaleX(1)}.lang{display:flex;justify-self:end;align-items:center;gap:4px;padding:6px 8px;border:1px solid var(--line);border-radius:999px;color:var(--muted)}.lang button{padding:5px 7px;border:0;color:var(--muted);background:transparent;cursor:pointer;font-size:.72rem;font-weight:900}.lang button[aria-pressed=true]{color:var(--orange)}.hero{position:relative;display:grid;grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr);gap:clamp(40px,7vw,110px);align-items:center;min-height:calc(100vh - 86px);padding:clamp(60px,9vw,138px) clamp(22px,6vw,88px);overflow:hidden;isolation:isolate}.hero-copy{z-index:2}.hero h1{display:grid;margin:0;font-size:clamp(3.7rem,9vw,8.7rem);line-height:.82;letter-spacing:-.075em;text-transform:uppercase}.hero h1 span{color:#d7d9de;font-size:.39em;letter-spacing:.02em}.hero h1 strong{font-weight:950}.lead{max-width:720px;margin:28px 0 0;color:#c8ccd3;font-size:clamp(1rem,1.7vw,1.25rem)}.actions{display:flex;flex-wrap:wrap;gap:13px;margin-top:34px}.meta{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:760px;margin:48px 0 0}.meta div{padding:14px 16px;border-top:1px solid var(--line)}.meta dt{color:var(--muted);font-size:.68rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase}.meta dd{margin:4px 0 0;font-size:.86rem;font-weight:700}.grid-bg{position:absolute;inset:0;z-index:-3;opacity:.34;background-image:linear-gradient(rgba(255,138,0,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,138,0,.08) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(to bottom,#000,transparent 86%)}.glow{position:absolute;z-index:-2;top:12%;right:3%;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(255,138,0,.2),transparent 68%)}.section{padding:clamp(70px,9vw,132px) clamp(22px,6vw,88px);border-top:1px solid var(--line)}.section-head{display:grid;grid-template-columns:minmax(0,.9fr) minmax(300px,1.1fr);gap:clamp(30px,7vw,110px);align-items:end;margin-bottom:44px}.section-head .eyebrow{grid-column:1/-1;margin-bottom:-8px}.section-head h2{margin:0;font-size:clamp(2.4rem,5vw,5.1rem);line-height:.97;letter-spacing:-.055em}.section-head>p:last-child{margin:0;color:var(--muted);font-size:1.04rem}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.company{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(36px,8vw,140px);align-items:center;background:linear-gradient(120deg,rgba(255,138,0,.1),transparent 46%),var(--panel)}.company h2{margin:0;font-size:clamp(2rem,4vw,4.2rem);line-height:1;letter-spacing:-.05em}.company blockquote{margin:0;font-size:clamp(1.5rem,3vw,3rem);font-weight:780;line-height:1.12;letter-spacing:-.035em}.footer{display:grid;grid-template-columns:1fr auto auto;gap:32px;align-items:end;padding:32px clamp(22px,6vw,88px);border-top:1px solid var(--line);color:var(--muted);background:#07080a;font-size:.78rem}.footer strong{color:var(--text);letter-spacing:.08em;text-transform:uppercase}.footer p{margin:5px 0 0}.build{display:grid;gap:4px;text-align:right}
/* BUILD 0004 · Optical spacing */
.brand-lockup {
  gap: 18px;
}

.hero-emblem {
  transform: translateY(8px);
}


/* ======================================================
 BUILD 0010 · STICKY NAVIGATION
 Keeps language and primary navigation available while scrolling.
 ====================================================== */

.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  transition:
    min-height 180ms ease,
    background-color 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    backdrop-filter 180ms ease;
}

.site-header.is-scrolled {
  min-height: 68px;
  background: rgba(7, 8, 10, 0.94);
  border-bottom-color: rgba(255, 138, 0, 0.34);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.30);
  backdrop-filter: blur(18px);
}

.site-header.is-scrolled .brand-copy small,
.site-header.is-scrolled .brand > span:last-child small {
  opacity: 0;
  max-height: 0;
  margin-top: 0;
  overflow-x: clip;
  overflow-y: visible;
}

.site-header .brand-copy small,
.site-header .brand > span:last-child small {
  transition:
    opacity 160ms ease,
    max-height 160ms ease,
    margin-top 160ms ease;
}

.site-header.is-scrolled .brand-mark {
  transform: scale(0.92);
}

.site-header .brand-mark {
  transition: transform 160ms ease;
}


/* BUILD 0010 REV A · Sticky header hotfix
   The previous build placed the sticky header inside a shell with overflow:hidden,
   which creates a scrolling ancestor and prevents the header from sticking. */
.site-shell {
  overflow-x: clip !important;
  overflow-y: visible !important;
}

.site-header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 9999;
}
