/* ===========================================
   AMERICAN ROYAL • Header UI (namespaced)
   Requires: Outfit via <link rel="preconnect" …>
   Wrapper: Add class="ar-header" to the header container
   =========================================== */

/* Tokens */
:root{
  --ar-navy:#002D6A;
  --ar-sky:#92B8E2;
  --ar-offwhite:#F7F6FB;
  --ar-cta:#BE3526;
  --ar-fg:#fff;
  --ar-cta-dark: #BE3526;
  }

/* Skin */
.ar-header{
  background:var(--ar-navy);
  color:var(--ar-fg);
  position:relative;
}

/* Type */
.ar-header .header-nav a,
.ar-header .header-nav-folder-title,
.ar-header .header-nav-folder-title-text{
  font-family:"Outfit",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  font-weight:200 !important;
  color:var(--ar-fg);
  letter-spacing:.01em;
  line-height:1.2;
  text-decoration:none;
}

/* Submenu items a bit bolder */
.ar-header .header-nav-folder-item a,
.ar-header .header-nav-folder-item a span,
.ar-header .header-nav-folder-item .header-nav-folder-item-content{
  font-family:"Outfit",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  font-weight:600 !important;
}

/* Mobile menu force Outfit */
@media (max-width:1024px){
  .ar-header .header-menu,
  .ar-header .header-menu-nav-list,
  .ar-header .header-menu-nav-item,
  .ar-header .header-menu-nav-item a,
  .ar-header .header-menu-nav-folder-title,
  .ar-header .header-menu-nav-folder-title-text,
  .ar-header .header-menu-cta a{
    font-family:"Outfit",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
    font-weight:400;
    letter-spacing:.015em;
    line-height:1.2;
  }
}

/* Active state */
.ar-header .header-nav-item--active > a,
.ar-header .header-nav-item--active > .header-nav-folder-title > .header-nav-folder-title-text{
  font-weight:600;
  text-decoration:none;
}

/* Layout width */
@media (min-width:1025px){
  .ar-header .header-title-nav-wrapper,
  .ar-header .header-nav-wrapper{
    max-width:1400px;
    margin-inline:auto;
    padding-inline:clamp(12px,2vw,32px);
  }
}

/* Icons inherit white */
.ar-header .header-nav svg,
.ar-header .header-nav .icon{ color:var(--ar-fg); fill:currentColor; }

/* Logo sizing */
.ar-header .header-title-logo{ display:flex; align-items:center; justify-content:center; padding-top:1rem; }
.ar-header .header-title-logo img{ display:block; height:auto; max-height:120px; margin-top:16px; }
@media (max-width:768px){ .ar-header .header-title-logo img{ max-height:80px; margin-top:8px; } }

/* Dropdown reveal animation (scoped) */
@keyframes ar-slideFadeIn{ from{opacity:0;transform:translateY(-10px)} to{opacity:1;transform:translateY(0)} }
.ar-header .header-nav-folder-content > .header-nav-folder-item{ animation:ar-slideFadeIn .4s ease forwards; opacity:0; }
.ar-header .header-nav-folder-content > .header-nav-folder-item:nth-child(1){animation-delay:.1s}
.ar-header .header-nav-folder-content > .header-nav-folder-item:nth-child(2){animation-delay:.2s}
.ar-header .header-nav-folder-content > .header-nav-folder-item:nth-child(3){animation-delay:.3s}
.ar-header .header-nav-folder-content > .header-nav-folder-item:nth-child(4){animation-delay:.4s}
.ar-header .header-nav-folder-content > .header-nav-folder-item:nth-child(5){animation-delay:.5s}
.ar-header .header-nav-folder-content > .header-nav-folder-item:nth-child(6){animation-delay:.6s}

/* Desktop nav centering & gaps */
@media (min-width:1025px){
  .ar-header .header-title, .ar-header .header-actions{ flex:0 0 auto; }
  .ar-header .header-nav-wrapper{ flex:1 1 auto; }
  .ar-header .header-nav{
    display: flex;
    align-items: center;
    height: clamp(60px,5.5vw,120px); /* match navy band height */
  }
  .ar-header .header-nav-list{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: clamp(12px,2.2vw,36px);
    row-gap: 0;
    flex-wrap: nowrap;
    height: 100%;
  }
  .ar-header .header-nav-item{ margin:0; white-space:nowrap; }
}

/* Full-bleed header image */
.ar-header .header-inner{
  background-size:cover !important;
  background-position:center 72% !important;
  background-repeat:no-repeat !important;
  min-height:clamp(180px,21vw,350px);
}
@media (min-width:1025px){
  .ar-header .header-inner{
    position:relative;
    width:100vw;
    left:50%;
    margin-left:-50vw;
  }
}

/* Navy band at bottom of header (desktop) */
@media (min-width:1025px){
  .ar-header .header-inner{ position:relative; z-index:0; }
  .ar-header .header-inner::before{
    content:"";
    position:absolute; left:0; right:0; bottom:0;
    height:clamp(60px,5.5vw,120px);
    background:var(--ar-navy);
    opacity:1; pointer-events:none; z-index:1;
  }
  .ar-header nav.header-nav{
    position:absolute; left:50%; transform:translateX(-50%);
    bottom:clamp(6px,1.2vw,16px); width:max-content; z-index:20;
  }
  .ar-header .header-title, .ar-header .header-actions{ position:relative; z-index:20; }
}

/* Submenu link color */
.ar-header .header-nav-folder-item a,
.ar-header .header-nav-folder-item a span,
.ar-header .header-nav-folder-item .header-nav-folder-item-content{
  color:var(--ar-offwhite) !important;
}

/* Hover: no underline + gentle zoom */
.ar-header .header-nav a,
.ar-header .header-nav-folder-title,
.ar-header .header-nav-folder-title-text,
.ar-header .header-nav-folder-item a{
  display:inline-flex; align-items:center;
  transition:transform .18s ease, color .15s ease; will-change:transform;
}
.ar-header .header-nav a:hover,
.ar-header .header-nav a:focus,
.ar-header .header-nav-folder-title:hover,
.ar-header .header-nav-folder-title:focus{ text-decoration:none !important; }
.ar-header .header-nav a:hover,
.ar-header .header-nav a:focus,
.ar-header .header-nav-folder-title:hover,
.ar-header .header-nav-folder-title:focus,
.ar-header .header-nav-folder-item a:hover,
.ar-header .header-nav-folder-item a:focus{ transform:scale(1.06); }

/* Always-on-top submenu (desktop) */
@media (min-width:1025px){
  .ar-header,
  .ar-header .header,
  .ar-header .header-inner,
  .ar-header .header-nav-wrapper,
  .ar-header .header-nav{ overflow:visible !important; }
  .ar-header .header-nav-folder-content{
    position:relative; z-index:1000 !important;
    background:var(--ar-navy) !important;
    border:0 !important; box-shadow:none !important;
  }
}

/* Remove Squarespace default header stripe */
.header-border{ border:none !important; }
.header-border{ border-width:0 !important; }

/* Kill the tiny horizontal scrollbar from header layout overflow */
.ar-header .header-inner{ overflow-x: clip; }
html, body{ overflow-x: clip; }

/* Remove padding below header on all pages */
.header-inner { padding: 0 !important; }

/* Use Veneer font for all headings except inside .ar-header */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Veneer', sans-serif !important;
}
.ar-header h1, .ar-header h2, .ar-header h3, .ar-header h4, .ar-header h5, .ar-header h6 {
  font-family: "Outfit", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
}

/* Remove large Squarespace inline padding below header on all pages */
[data-fluid-engine-section][style*="padding-top"] {
  padding-top: 0 !important;
}

div[data-controllers-bound="SectionWrapperController"][style*="padding-top"] {
  padding-top: 0 !important;
}

/* ================================
   Contribute Button CTA
   ================================ */

/* Make header a positioning context */
.ar-header { position: relative; }

/* ---------- Desktop: floating CTA ---------- */
@media (min-width:1025px){
  .ar-header{ position: relative; }

  .ar-header nav.header-nav-list a[href*="contribute"],
  .ar-header nav.header-nav-list a[href*="donate"],
  .ar-header nav.header-nav-list a[href*="donorbox"],
  .ar-header [data-animation-role="header-element"][href*="contribute"],
  .ar-header [data-animation-role="header-element"][href*="donate"],
  .ar-header [data-animation-role="header-element"][href*="donorbox"]{
    position: absolute;
    right: 4rem;              /* distance from right edge – tweak this */
    top: 2.5rem;                /* distance from top edge – tweak this */
    z-index: 5;

    background: var(--ar-cta) !important;
    color: #fff !important;
    font-family: "Outfit", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    font-weight: 700;
    font-size: 1.6rem;                /* ~60% larger */
    text-transform: uppercase;
    letter-spacing: .04em;
    
    padding: 0.5em 1.6em !important;    /* scale padding */
    border-radius: 9999px !important;
    line-height: 1;
    white-space: nowrap;
    display: inline-flex !important; align-items: center; justify-content: center;
    text-decoration: none !important;
    
    box-shadow: 0 2px 0 rgba(0,0,0,.18);
    transition:
      transform .32s cubic-bezier(.4,0,.2,1),
      box-shadow .32s cubic-bezier(.4,0,.2,1),
      background-color .2s ease,
      font-size .2s cubic-bezier(.4,0,.2,1);
  }

/* Hover: enlarge + keep red background */
.ar-header nav.header-nav-list a[href*="contribute"]:hover,
.ar-header nav.header-nav-list a[href*="donate"]:hover,
.ar-header nav.header-nav-list a[href*="donorbox"]:hover,
.ar-header [data-animation-role="header-element"][href*="contribute"]:hover,
.ar-header [data-animation-role="header-element"][href*="donate"]:hover,
.ar-header [data-animation-role="header-element"][href*="donorbox"]:hover{
  background: var(--ar-cta-dark) !important; /* stay red */
  color: #fff !important;                   /* force text white */
  font-size: 1.75rem;
  transform: scale(1.08);
  box-shadow: 0 4px 10px rgba(0,0,0,.22);
}

/* Active: pressed state, still solid red */
.ar-header nav.header-nav-list a[href*="contribute"]:active,
.ar-header nav.header-nav-list a[href*="donate"]:active,
.ar-header nav.header-nav-list a[href*="donorbox"]:active,
.ar-header [data-animation-role="header-element"][href*="contribute"]:active,
.ar-header [data-animation-role="header-element"][href*="donate"]:active,
.ar-header [data-animation-role="header-element"][href*="donorbox"]:active{
  background: var(--ar-cta) !important;  /* lock back to base red */
  color: #fff !important;
  transform: scale(1);
  box-shadow: 0 1px 0 rgba(0,0,0,.18);
}

  .ar-header nav.header-nav-list a[href*="contribute"]:focus-visible,
  .ar-header nav.header-nav-list a[href*="donate"]:focus-visible,
  .ar-header nav.header-nav-list a[href*="donorbox"]:focus-visible{
    outline: 2px solid var(--ar-sky);
    outline-offset: 3px;
    border-radius: 9999px;
  }
}

/* ---------- Mobile: drawer button ---------- */
@media (max-width:1024px){
  .sqs-mobile-nav .header-menu-nav a[href*="contribute"],
  .sqs-mobile-nav .header-menu-nav a[href*="donate"],
  .sqs-mobile-nav .header-menu-nav a[href*="donorbox"]{
    background: var(--ar-cta) !important;
    color: #fff !important;
    border-radius: .7rem !important;
    padding: 1.2rem 1.4rem !important;
    font-weight: 700;
    font-size: 1.3rem;
    line-height: 1;
  }
}

/* Avoid tiny horizontal scrollbar */
.ar-header .header-inner{ overflow-x: clip; }
html, body{ overflow-x: clip; }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .ar-header nav.header-nav-list a[href*="contribute"],
  .ar-header nav.header-nav-list a[href*="donate"],
  .ar-header nav.header-nav-list a[href*="donorbox"],
  .ar-header [data-animation-role="header-element"][href*="contribute"],
  .ar-header [data-animation-role="header-element"][href*="donate"],
  .ar-header [data-animation-role="header-element"][href*="donorbox"]{
    transition: none;
  }
}