.elementor-151 .elementor-element.elementor-element-611af99{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0%;--padding-bottom:0%;--padding-left:5%;--padding-right:5%;}.elementor-151 .elementor-element.elementor-element-611af99:not(.elementor-motion-effects-element-type-background), .elementor-151 .elementor-element.elementor-element-611af99 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}.elementor-151 .elementor-element.elementor-element-e28677f{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-widget-theme-site-logo .widget-image-caption{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-151 .elementor-element.elementor-element-01003ee img{width:40%;}.elementor-151 .elementor-element.elementor-element-a0396bc{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );line-height:var( --e-global-typography-primary-line-height );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before,
					.elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-size:var( --e-global-typography-accent-font-size );font-weight:var( --e-global-typography-accent-font-weight );}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-menu-toggle{margin:0 auto;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu .elementor-item{font-family:"Montserrat", Sans-serif;font-size:0.9rem;font-weight:400;line-height:1.6em;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu--main .elementor-item{color:#FFFFFF;fill:#FFFFFF;padding-left:20px;padding-right:20px;padding-top:0px;padding-bottom:0px;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu--main .elementor-item:hover,
					.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu--main .elementor-item:focus{color:#C9A86A;fill:#C9A86A;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:#C9A86A;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-framed .elementor-item:before,
					.elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-framed .elementor-item:after{border-color:#C9A86A;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu--main .elementor-item.elementor-item-active{color:#C9A86A;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item.elementor-item-active:before,
					.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item.elementor-item-active:after{background-color:#C9A86A;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-framed .elementor-item.elementor-item-active:before,
					.elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-framed .elementor-item.elementor-item-active:after{border-color:#C9A86A;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-framed .elementor-item:before{border-width:1px;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-framed.e--animation-draw .elementor-item:before{border-width:0 0 1px 1px;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-framed.e--animation-draw .elementor-item:after{border-width:1px 1px 0 0;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-framed.e--animation-corners .elementor-item:before{border-width:1px 0 0 1px;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-framed.e--animation-corners .elementor-item:after{border-width:0 1px 1px 0;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-underline .elementor-item:after,
					 .elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-overline .elementor-item:before,
					 .elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-double-line .elementor-item:before,
					 .elementor-151 .elementor-element.elementor-element-7ad0cd0 .e--pointer-double-line .elementor-item:after{height:1px;}.elementor-151 .elementor-element.elementor-element-7ad0cd0{--e-nav-menu-horizontal-menu-item-margin:calc( 0px / 2 );}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu--main:not(.elementor-nav-menu--layout-horizontal) .elementor-nav-menu > li:not(:last-child){margin-bottom:0px;}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu--dropdown{background-color:var( --e-global-color-941ce3b );}.elementor-151 .elementor-element.elementor-element-d123640{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--flex-wrap:nowrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-size:var( --e-global-typography-accent-font-size );font-weight:var( --e-global-typography-accent-font-weight );line-height:var( --e-global-typography-accent-line-height );}.elementor-151 .elementor-element.elementor-element-c6f5ac7 .elementor-button{background-color:var( --e-global-color-c3dbbb6 );font-family:"Montserrat", Sans-serif;font-size:0.8rem;font-weight:600;text-transform:uppercase;line-height:1.2em;fill:var( --e-global-color-primary );color:var( --e-global-color-primary );border-radius:30px 30px 30px 30px;}.elementor-151 .elementor-element.elementor-element-c6f5ac7 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:1024px){.elementor-widget-theme-site-logo .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-size:var( --e-global-typography-accent-font-size );}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu .elementor-item{font-size:16px;line-height:1.6em;}.elementor-widget-button .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );}.elementor-151 .elementor-element.elementor-element-c6f5ac7 .elementor-button{font-size:16px;line-height:1em;}}@media(max-width:767px){.elementor-151 .elementor-element.elementor-element-611af99{--flex-wrap:wrap;}.elementor-151 .elementor-element.elementor-element-e28677f{--width:48%;}.elementor-widget-theme-site-logo .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-151 .elementor-element.elementor-element-01003ee img{width:100%;}.elementor-151 .elementor-element.elementor-element-a0396bc{--width:44%;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-size:var( --e-global-typography-accent-font-size );}.elementor-151 .elementor-element.elementor-element-7ad0cd0 .elementor-nav-menu .elementor-item{font-size:16px;line-height:1.6em;}.elementor-151 .elementor-element.elementor-element-7ad0cd0{--nav-menu-icon-size:30px;}.elementor-widget-button .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );}.elementor-151 .elementor-element.elementor-element-c6f5ac7 .elementor-button{font-size:16px;line-height:1em;}}@media(min-width:768px){.elementor-151 .elementor-element.elementor-element-e28677f{--width:30%;}.elementor-151 .elementor-element.elementor-element-a0396bc{--width:40%;}.elementor-151 .elementor-element.elementor-element-d123640{--width:30%;}}/* Start custom CSS *//* ============================================
   UNNION BARBERS · STYLES
   Editorial Atelier · Dark themed
   All .elementor-151s are prefixed .unnion-* for
   safe portability to WordPress/Elementor.
   ============================================ */

/* -------- Design Tokens -------- */
:root {
  /* Colors */
  --color-bg-main: #070707;
  --color-bg-soft: #101010;
  --color-bg-card: #151515;
  --color-bg-elevated: #1E1E1E;

  --color-text-main: #F4F0E8;
  --color-text-muted: #A9A39A;
  --color-text-soft: #D6D0C8;

  --color-accent: #C9A86A;
  --color-accent-hover: #E0BE7A;
  --color-copper: #A76545;

  --color-border: rgba(255, 255, 255, 0.10);
  --color-border-strong: rgba(201, 168, 106, 0.35);

  --color-success-whatsapp: #25D366;

  /* Typography */
  --font-display: 'Bebas Neue', 'Oswald', 'Anton', sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, 'JetBrains Mono', Menlo, monospace;

  /* Fluid type scale */
  --fs-h1: clamp(3.5rem, 8vw, 7rem);
  --fs-h2: clamp(2.25rem, 4.5vw, 4rem);
  --fs-h3: clamp(1.5rem, 2.5vw, 2rem);
  --fs-body: clamp(1rem, 1.1vw, 1.125rem);
  --fs-small: 0.875rem;
  --fs-eyebrow: 0.75rem;

  /* Spacing */
  --space-section: clamp(4rem, 10vw, 8rem);
  --space-block: clamp(2rem, 5vw, 4rem);
  --container-max: 1280px;
  --container-pad: clamp(1.25rem, 4vw, 3rem);

  /* Motion */
  --ease-out: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 200ms;
  --dur-mid: 300ms;
  --dur-slow: 600ms;
}

/* -------- Reset (minimal) -------- */
*, *::before, *::after {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
.unnion-body {
  margin: 0;
  background: var(--color-bg-main);
  color: var(--color-text-main);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
.unnion-body img,
.unnion-body svg {
  display: block;
  max-width: 100%;
  height: auto;
}
.unnion-body a {
  color: inherit;
  text-decoration: none;
}
.unnion-body button {
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  color: inherit;
}

/* -------- Container utility -------- */
.unnion-container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}

/* -------- Skip link (a11y) -------- */
.unnion-skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  background: var(--color-accent);
  color: var(--color-bg-main);
  padding: 0.75rem 1.25rem;
  font-weight: 600;
  z-index: 9999;
}
.unnion-skip-link:focus {
  left: 1rem;
  top: 1rem;
}

/* -------- Focus visible -------- */
.unnion-body :focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 4px;
  border-radius: 2px;
}

/* -------- Reduced motion -------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ============================================
   Section blocks are added below in subsequent
   tasks, in source order.
   ============================================ */


/* ============================================
   HEADER · Unnion Barbers
   Editorial atelier, dark themed.
   ============================================ */
.unnion-header {
  position: sticky;
  top: 0;
  z-index: 100;
  width: 100%;
  background: rgba(7, 7, 7, 0.7);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
  border-bottom: 1px solid var(--color-border);
  transition: background var(--dur-mid) var(--ease-out),
              border-color var(--dur-mid) var(--ease-out);
}
.unnion-header.is-scrolled {
  background: rgba(7, 7, 7, 0.92);
  border-bottom-color: rgba(255, 255, 255, 0.14);
}

.unnion-header__inner {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
  min-height: 72px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 1.5rem;
}

/* -------- Logo -------- */
.unnion-header__logo {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  color: var(--color-text-main);
  transition: color var(--dur-fast) var(--ease-out);
  justify-self: start;
  position: relative;
}
.unnion-header__logo:hover { color: var(--color-accent-hover); }
.unnion-header__logo-mark {
  display: inline-flex;
  color: var(--color-accent);
  transform: translateY(-1px);
  transition: transform var(--dur-mid) var(--ease-out);
}
.unnion-header__logo:hover .unnion-header__logo-mark {
  transform: translateY(-1px) rotate(-6deg);
}
.unnion-header__logo-word {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
  font-family: var(--font-display);
  font-size: 1.15rem;
  letter-spacing: 0.18em;
  line-height: 1;
}
.unnion-header__logo-primary { color: var(--color-text-main); }
.unnion-header__logo-secondary {
  color: var(--color-text-muted);
  font-size: 0.95rem;
  letter-spacing: 0.22em;
}
.unnion-header__logo-divider {
  width: 14px;
  height: 1px;
  background: var(--color-border-strong);
  display: inline-block;
  transform: translateY(-3px);
}

/* -------- Center nav (desktop) -------- */
.unnion-header__nav { justify-self: center; }
.unnion-header__nav-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: clamp(1.25rem, 2.5vw, 2.25rem);
}
.unnion-header__nav-link {
  position: relative;
  display: inline-block;
  font-family: var(--font-body);
  font-size: 0.74rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-text-soft);
  padding: 0.5rem 0;
  transition: color var(--dur-fast) var(--ease-out);
}
.unnion-header__nav-link::before {
  content: attr(data-num);
  position: absolute;
  top: -0.45rem;
  left: 0;
  font-family: var(--font-body);
  font-size: 0.5rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  color: var(--color-accent);
  opacity: 0;
  transform: translateY(2px);
  transition: opacity var(--dur-fast) var(--ease-out),
              transform var(--dur-fast) var(--ease-out);
}
.unnion-header__nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0.15rem;
  height: 1px;
  width: 100%;
  background: var(--color-accent);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--dur-mid) var(--ease-out);
}
.unnion-header__nav-link:hover,
.unnion-header__nav-link:focus-visible { color: var(--color-accent); }
.unnion-header__nav-link:hover::before,
.unnion-header__nav-link:focus-visible::before {
  opacity: 0.85;
  transform: translateY(0);
}
.unnion-header__nav-link:hover::after,
.unnion-header__nav-link:focus-visible::after { transform: scaleX(1); }

/* -------- Right actions -------- */
.unnion-header__actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  justify-self: end;
}
.unnion-header__lang {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  font-family: var(--font-body);
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  user-select: none;
}
.unnion-header__lang-active { color: var(--color-text-main); }
.unnion-header__lang-sep {
  display: inline-block;
  width: 1px;
  height: 11px;
  background: var(--color-border);
}

.unnion-header__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.7rem 1.1rem;
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #070707;
  background: var(--color-accent);
  border: 1px solid var(--color-accent);
  border-radius: 2px;
  transition: background var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out),
              transform var(--dur-fast) var(--ease-out);
  position: relative;
  overflow: hidden;
}
.unnion-header__cta svg { transition: transform var(--dur-mid) var(--ease-out); }
.unnion-header__cta:hover {
  background: var(--color-accent-hover);
  border-color: var(--color-accent-hover);
}
.unnion-header__cta:hover svg { transform: translateX(3px); }
.unnion-header__cta:active { transform: translateY(1px); }

.unnion-header__burger {
  display: none;
  position: relative;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-border);
  border-radius: 2px;
  background: transparent;
  color: var(--color-text-main);
  transition: border-color var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out);
}
.unnion-header__burger:hover {
  border-color: var(--color-border-strong);
  color: var(--color-accent);
}
.unnion-header__burger-lines {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  gap: 5px;
  width: 22px;
}
.unnion-header__burger-lines span {
  display: block;
  height: 1px;
  width: 100%;
  background: currentColor;
  transition: transform var(--dur-mid) var(--ease-out),
              opacity var(--dur-fast) var(--ease-out),
              width var(--dur-mid) var(--ease-out);
}
.unnion-header__burger-lines span:nth-child(2) { width: 70%; }
.unnion-header__burger:hover .unnion-header__burger-lines span:nth-child(2) { width: 100%; }
.unnion-header__burger[aria-expanded="true"] .unnion-header__burger-lines span:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}
.unnion-header__burger[aria-expanded="true"] .unnion-header__burger-lines span:nth-child(2) {
  opacity: 0;
}
.unnion-header__burger[aria-expanded="true"] .unnion-header__burger-lines span:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

/* ============================================
   DRAWER · mobile
   ============================================ */
.unnion-drawer {
  position: fixed;
  inset: 0;
  z-index: 200;
  pointer-events: none;
  visibility: hidden;
  transition: visibility 0s linear var(--dur-mid);
}
.unnion-drawer[aria-hidden="false"] {
  pointer-events: auto;
  visibility: visible;
  transition-delay: 0s;
}
.unnion-drawer__overlay {
  position: absolute;
  inset: 0;
  background: rgba(7, 7, 7, 0.55);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  opacity: 0;
  transition: opacity var(--dur-mid) var(--ease-out);
  cursor: pointer;
}
.unnion-drawer[aria-hidden="false"] .unnion-drawer__overlay { opacity: 1; }

.unnion-drawer__panel {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: min(420px, 92vw);
  background: var(--color-bg-main);
  background-image:
    radial-gradient(120% 60% at 100% 0%, rgba(201, 168, 106, 0.06), transparent 60%),
    linear-gradient(180deg, var(--color-bg-soft), var(--color-bg-main));
  border-left: 1px solid var(--color-border);
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform var(--dur-slow) var(--ease-out);
  will-change: transform;
}
.unnion-drawer[aria-hidden="false"] .unnion-drawer__panel { transform: translateX(0); }

.unnion-drawer__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem var(--container-pad);
  min-height: 72px;
  border-bottom: 1px solid var(--color-border);
}
.unnion-drawer__eyebrow {
  font-family: var(--font-body);
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.unnion-drawer__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--color-border);
  border-radius: 2px;
  color: var(--color-text-main);
  transition: color var(--dur-fast) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out),
              transform var(--dur-mid) var(--ease-out);
}
.unnion-drawer__close:hover {
  color: var(--color-accent);
  border-color: var(--color-border-strong);
  transform: rotate(90deg);
}

.unnion-drawer__nav {
  flex: 1;
  padding: clamp(1.5rem, 4vw, 2.5rem) var(--container-pad);
  overflow-y: auto;
}
.unnion-drawer__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}
.unnion-drawer__list li {
  border-bottom: 1px solid var(--color-border);
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 500ms var(--ease-out),
              transform 500ms var(--ease-out);
  transition-delay: 0ms;
}
.unnion-drawer[aria-hidden="false"] .unnion-drawer__list li {
  opacity: 1;
  transform: translateY(0);
  transition-delay: calc(180ms + var(--i) * 70ms);
}
.unnion-drawer__list a {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: baseline;
  gap: 1rem;
  padding: 1rem 0;
  color: var(--color-text-main);
  position: relative;
  transition: color var(--dur-fast) var(--ease-out),
              padding-left var(--dur-mid) var(--ease-out);
}
.unnion-drawer__list a::before {
  content: "";
  position: absolute;
  left: -0.6rem;
  top: 50%;
  width: 0;
  height: 1px;
  background: var(--color-accent);
  transform: translateY(-50%);
  transition: width var(--dur-mid) var(--ease-out);
}
.unnion-drawer__list a:hover,
.unnion-drawer__list a:focus-visible {
  color: var(--color-accent);
  padding-left: 0.5rem;
}
.unnion-drawer__list a:hover::before,
.unnion-drawer__list a:focus-visible::before { width: 0.4rem; }
.unnion-drawer__num {
  font-family: var(--font-body);
  font-size: 0.65rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  color: var(--color-text-muted);
  transform: translateY(-0.6em);
}
.unnion-drawer__label {
  font-family: var(--font-display);
  font-size: clamp(2rem, 7vw, 2.85rem);
  letter-spacing: 0.04em;
  line-height: 1;
}

.unnion-drawer__foot {
  padding: clamp(1.25rem, 4vw, 2rem) var(--container-pad);
  border-top: 1px solid var(--color-border);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.unnion-drawer__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.95rem 1.25rem;
  font-family: var(--font-body);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #070707;
  background: var(--color-accent);
  border-radius: 2px;
  transition: background var(--dur-fast) var(--ease-out);
}
.unnion-drawer__cta:hover { background: var(--color-accent-hover); }
.unnion-drawer__cta svg { transition: transform var(--dur-mid) var(--ease-out); }
.unnion-drawer__cta:hover svg { transform: translateX(3px); }
.unnion-drawer__meta {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  font-family: var(--font-body);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  color: var(--color-text-muted);
}

/* ============================================
   HEADER · RESPONSIVE
   ============================================ */
@media (max-width: 900px) {
  .unnion-header__nav { display: none; }
  .unnion-header__lang { display: none; }
  .unnion-header__cta { display: none; }
  .unnion-header__burger { display: inline-flex; }
  .unnion-header__inner { grid-template-columns: 1fr auto; }
  .unnion-header__logo-secondary { display: none; }
  .unnion-header__logo-divider { display: none; }
}
@media (min-width: 901px) {
  .unnion-drawer { display: none; }
}

/* ============================================
   HEADER · REDUCED MOTION
   ============================================ */
@media (prefers-reduced-motion: reduce) {
  .unnion-drawer__panel { transition-duration: 1ms; }
  .unnion-drawer__list li {
    transition-duration: 1ms;
    transition-delay: 0ms !important;
  }
}/* End custom CSS */