/* =========================================
   VINTAGE ALIGNMENT — NAV:
   Gold links + tall brackets + clean hover underline
   ========================================= */

:root{
  --va-gold:#C8A24D;
  --va-gold-soft: color-mix(in srgb, #C8A24D 70%, transparent);
}

/* base link */
header .wp-block-navigation__container.wp-block-navigation a.wp-block-navigation-item__content{
  position:relative;
  display:inline-block;
  color:var(--va-gold) !important;
  text-decoration:none !important;
  padding:6px 10px;
  transition:opacity .18s ease, color .18s ease;
  -webkit-tap-highlight-color: transparent;
}

/* TALL BRACKETS */
header .wp-block-navigation__container.wp-block-navigation a.wp-block-navigation-item__content::before,
header .wp-block-navigation__container.wp-block-navigation a.wp-block-navigation-item__content::after{
  position:absolute;
  top:50%;
  transform:translateY(-50%) scaleY(1.35);
  transform-origin:center;
  opacity:0;
  transition:opacity .16s ease, transform .16s ease;
  color:var(--va-gold);
  line-height:1;
  font-size:1.25em;
  pointer-events:none;
}

header .wp-block-navigation__container.wp-block-navigation a.wp-block-navigation-item__content::before{
  content:"[";
  left:-6px;
}

header .wp-block-navigation__container.wp-block-navigation a.wp-block-navigation-item__content::after{
  content:"]";
  right:-6px;
}

/* LABEL */
header .wp-block-navigation__container.wp-block-navigation
a.wp-block-navigation-item__content .wp-block-navigation-item__label{
  position:relative;
  display:inline-block;
  padding-bottom:4px;
}

/* THIN UNDERLINE — only hover */
header .wp-block-navigation__container.wp-block-navigation
a.wp-block-navigation-item__content .wp-block-navigation-item__label::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:1px;
  background:var(--va-gold-soft);
  opacity:0;
  transform:translateY(2px);
  transition:opacity .18s ease, transform .18s ease;
}

/* hover: brackets + underline */
header .wp-block-navigation__container.wp-block-navigation a.wp-block-navigation-item__content:hover::before{
  opacity:1;
  transform:translateY(-50%) translateX(-2px) scaleY(1.35);
}
header .wp-block-navigation__container.wp-block-navigation a.wp-block-navigation-item__content:hover::after{
  opacity:1;
  transform:translateY(-50%) translateX(2px) scaleY(1.35);
}
header .wp-block-navigation__container.wp-block-navigation
a.wp-block-navigation-item__content:hover .wp-block-navigation-item__label::after{
  opacity:1;
  transform:translateY(0);
}

/* remove underline on focus after click */
header .wp-block-navigation__container.wp-block-navigation
a.wp-block-navigation-item__content:focus .wp-block-navigation-item__label::after{
  opacity:0 !important;
  transform:translateY(2px) !important;
}

/* ACTIVE PAGE — only brackets, no underline */
header .wp-block-navigation__container.wp-block-navigation .current-menu-item > a.wp-block-navigation-item__content::before,
header .wp-block-navigation__container.wp-block-navigation .current_page_item > a.wp-block-navigation-item__content::before,
header .wp-block-navigation__container.wp-block-navigation .current-menu-item > a.wp-block-navigation-item__content::after,
header .wp-block-navigation__container.wp-block-navigation .current_page_item > a.wp-block-navigation-item__content::after{
  opacity:1;
}

/* =========================================
   VINTAGE ALIGNMENT — LOGO HOVER EFFECT
   ========================================= */

header .custom-logo{
  transition:
    transform .28s ease,
    filter .28s ease,
    opacity .28s ease;
  will-change:transform;
}

/* hover */
header .custom-logo:hover{

  /* легке підняття — authority feel */
  transform:translateY(-2px);

  /* мікро gold highlight, НЕ luxury glow */
  filter:
    brightness(1.05)
    drop-shadow(0 2px 6px rgba(200,162,77,.25));

  opacity:.95;
}

/* active click — маленький press ефект */
header .custom-logo:active{
  transform:translateY(0px) scale(.98);
}


/* =========================================
   FIX — dropdown brackets stay inside menu box
   ========================================= */

/* submenu links: give room for brackets INSIDE */
header .wp-block-navigation .wp-block-navigation__submenu-container
a.wp-block-navigation-item__content{
  padding-left:18px !important;
  padding-right:18px !important;
}

/* move brackets inside dropdown */
header .wp-block-navigation .wp-block-navigation__submenu-container
a.wp-block-navigation-item__content::before{
  left:6px !important;      /* було -6px */
}

header .wp-block-navigation .wp-block-navigation__submenu-container
a.wp-block-navigation-item__content::after{
  right:6px !important;     /* було -6px */
}

/* optional: make dropdown underline a bit cleaner */
header .wp-block-navigation .wp-block-navigation__submenu-container
a.wp-block-navigation-item__content .wp-block-navigation-item__label{
  padding-bottom:3px !important;
}


/* =========================================
   FIX — remove dotted focus, keep clean focus-visible
   ========================================= */

/* прибрати стандартний пунктир при кліку мишкою */
header a:focus,
header button:focus{
  outline: none !important;
}

/* показувати фокус ТІЛЬКИ коли навігація клавіатурою (Tab) */
header a:focus-visible,
header button:focus-visible{
  outline: 2px solid rgba(200,162,77,.55) !important;
  outline-offset: 4px;
  border-radius: 2px;
}

/* конкретно для лого (щоб не було рамки навколо картинки) */
header .custom-logo-link:focus,
header .custom-logo-link:focus-visible{
  outline: 2px solid rgba(200,162,77,.55) !important;
  outline-offset: 6px;
}




/* =========================================
  /* =========================================
   VINTAGE ALIGNMENT — FOOTER SOCIAL ICONS
   Horizontal gold separators (FIXED)
   ========================================= */

:root{
  --va-gold:#C8A24D;
  --va-gold-line:rgba(200,162,77,.45);
}

/* container */
footer .wp-block-social-links{
  gap:28px !important;          /* трохи більший gap щоб лінії було видно */
  align-items:center;
}

/* item */
footer .wp-block-social-link{
  position:relative;
  display:flex;
  align-items:center;
  color:var(--va-gold) !important;
}

/* icon size */
footer .wp-block-social-links svg{
  width:28px !important;
  height:28px !important;
  transition:transform .22s ease, filter .22s ease, opacity .22s ease;
}

/* ===== HORIZONTAL GOLD LINE ===== */
footer .wp-block-social-link:not(:last-child)::after{
  content:"";
  position:absolute;
  left:100%;                     
  margin-left:7px;              
  top:50%;
  transform:translateY(-50%);
  width:16px;
  height:1px;
  background:var(--va-gold-line);
}

/* hover */
footer .wp-block-social-link:hover svg{
  transform:translateY(-1px) scale(1.06);
  filter:drop-shadow(0 3px 8px rgba(200,162,77,.30));
  opacity:.96;
}

/* press */
footer .wp-block-social-link:active svg{
  transform:translateY(0) scale(.97);
  filter:none;
}
/* =========================================
   VINTAGE ALIGNMENT — LOGO HOVER (REFINED)
   ========================================= */

footer .custom-logo{
  position:relative;
  transition:
    transform .35s ease,
    filter .35s ease,
    opacity .35s ease;
  will-change:transform;
}

/* subtle authority hover */
footer .custom-logo:hover{

  /* легке підняття */
  transform:translateY(-2px);

  /* micro gold highlight */
  filter:
    brightness(1.05)
    drop-shadow(0 4px 10px rgba(200,162,77,.28));

  opacity:.96;
}

/* press effect */
footer .custom-logo:active{
  transform:translateY(0px) scale(.97);
  filter:none;
}

/* ===== ultra-thin gold line reveal under logo ===== */
footer .custom-logo-link{
  position:relative;
  display:inline-block;
}

footer .custom-logo-link::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-6px;
  width:0%;
  height:1px;
  background:rgba(200,162,77,.55);
  transform:translateX(-50%);
  transition:width .28s ease;
}

footer .custom-logo-link:hover::after{
  width:60%;
}


/* Blog Featured Image – responsive */

.wp-block-post-featured-image.aligncenter{
  margin:0 0 28px 0!important;
  padding:0!important;
  width:100%;
}

.wp-block-post-featured-image.aligncenter a{
  display:block;
  width:100%;
  border-radius:18px;
  overflow:hidden;
  position:relative;
  background:#111;
  box-shadow:0 10px 30px rgba(0,0,0,.18),0 2px 10px rgba(0,0,0,.08);
  transition:transform .35s ease,box-shadow .35s ease;
}

.wp-block-post-featured-image.aligncenter a::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom,rgba(0,0,0,.04),rgba(0,0,0,.16));
  pointer-events:none;
  transition:opacity .35s ease;
}

.wp-block-post-featured-image.aligncenter img{
  display:block;
  width:100%;
  height:auto!important;
  aspect-ratio:16/9;
  object-fit:cover!important;
  transition:transform .45s ease;
}

/* hover */
@media (hover:hover) and (pointer:fine){
  .wp-block-post-featured-image.aligncenter a:hover{
    transform:translateY(-3px);
    box-shadow:0 18px 40px rgba(0,0,0,.22),0 6px 18px rgba(0,0,0,.10);
  }

  .wp-block-post-featured-image.aligncenter a:hover img{
    transform:scale(1.03);
  }

  .wp-block-post-featured-image.aligncenter a:hover::after{
    opacity:.75;
  }
}

/* tablet */
@media (max-width:1024px){
  .wp-block-post-featured-image.aligncenter{margin-bottom:24px!important;}
  .wp-block-post-featured-image.aligncenter a{border-radius:16px;}
}

/* mobile */
@media (max-width:767px){
  .wp-block-post-featured-image.aligncenter{margin-bottom:20px!important;}
  .wp-block-post-featured-image.aligncenter a{border-radius:14px;}
  .wp-block-post-featured-image.aligncenter img{aspect-ratio:4/3;}
}

/* small phones */
@media (max-width:480px){
  .wp-block-post-featured-image.aligncenter a{border-radius:12px;}
  .wp-block-post-featured-image.aligncenter img{aspect-ratio:1.2/1;}
}
