/* ==========================================================================
   hut-header-v2.css — v1.13.1
   Header redesign rollout (approved mock: hut-header-redesign-mock).
   Scope: visual polish for the HUT header — utility-bar accent, nav
   underline, CTA material/gradient, sticky elevation on scroll, and the
   logo lockup size fix below.
   Deliberately additive: no rule here removes or restructures the existing
   cascade in hut.css / uiux-v3.css, and nothing here touches header.php.
   Loads last (after search-v2-fix.css) so equal-specificity rules here win
   deterministically without needing !important.

   Logo size fix (v1.13.1): hut.css originally sized the lockup at
   196x82 desktop / 168x76 mobile ("Canonical Hajj Umrah Taxi identity"),
   but uiux-v3.css's later `.scc-brand-hut .hut-brand-lockup` rule — same
   specificity, loaded after hut.css — silently shrank it to 148x74 desktop
   / 108x62 mobile. Confirmed live via computed styles before this fix.
   Restored below, sized to what the actual live header box (92px desktop,
   70px mobile) can hold without overflow — not a blind copy of hut.css's
   original numbers, since those assumed a taller mobile header than what's
   actually live today.
   ========================================================================== */

/* ---- logo lockup: restore intended size, shrunk by a later cascade layer ---- */
.scc-brand-hut .hut-brand-lockup{
  flex:0 0 196px;
  width:196px;
  height:84px;
}
.scc-brand-hut .hut-brand-lockup img{
  width:196px;
  height:auto;
  max-height:82px;
  object-fit:contain;
}
@media (max-width:720px){
  .scc-brand-hut .hut-brand-lockup{
    flex-basis:150px;
    width:150px;
    height:62px;
  }
  .scc-brand-hut .hut-brand-lockup img{
    width:150px;
    height:auto;
    max-height:60px;
  }
}
@media (max-width:400px){
  .scc-brand-hut .hut-brand-lockup{
    flex-basis:128px;
    width:128px;
    height:53px;
  }
  .scc-brand-hut .hut-brand-lockup img{
    width:128px;
    height:auto;
    max-height:51px;
  }
}

/* ---- utility strip: gold divider accent ---- */
.scc-brand-hut .hut-service-bar b{ position:relative; }
.scc-brand-hut .hut-service-bar b::before{
  content:"\2726";
  display:inline-block;
  margin-right:9px;
  color:#c6871e;
  font-size:9px;
  vertical-align:middle;
  transform:translateY(-1px);
}

/* ---- primary nav: animated underline instead of a flat swap ---- */
.scc-brand-hut .hut-nav a{
  position:relative;
  transition:color .18s ease;
}
.scc-brand-hut .hut-nav a::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:2px;
  background:var(--accent);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .22s cubic-bezier(.4,0,.2,1);
}
.scc-brand-hut .hut-nav a:hover,
.scc-brand-hut .hut-nav a:focus-visible{ border-color:transparent; }
.scc-brand-hut .hut-nav a:hover::after,
.scc-brand-hut .hut-nav a:focus-visible::after{ transform:scaleX(1); }
@media (prefers-reduced-motion: reduce){
  .scc-brand-hut .hut-nav a::after{ transition:none; }
}

/* ---- CTA: gold gradient, watermark, shine sweep, full pill ---- */
.scc-brand-hut .hut-header-cta{
  position:relative;
  overflow:hidden;
  border-radius:999px;
  background:
    radial-gradient(120% 220% at 18% 0%, rgba(255,255,255,.5), transparent 42%),
    linear-gradient(155deg, #ffd85c 0%, #ffc400 45%, #c6871e 100%);
  box-shadow:0 10px 22px -10px rgba(198,135,30,.6);
  transition:transform .18s ease, box-shadow .18s ease;
}
.scc-brand-hut .hut-header-cta:hover,
.scc-brand-hut .hut-header-cta:focus-visible{
  transform:translateY(-1px);
  box-shadow:0 14px 26px -10px rgba(198,135,30,.75);
}
.scc-brand-hut .hut-header-cta::before{
  content:"";
  position:absolute;
  top:50%; right:-10px;
  width:46px; height:46px;
  transform:translateY(-50%) rotate(12deg);
  background:rgba(16,20,24,.12);
  clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);
  pointer-events:none;
}
.scc-brand-hut .hut-header-cta::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.6) 45%, transparent 60%);
  transform:translateX(-120%);
  pointer-events:none;
}
.scc-brand-hut .hut-header-cta:hover::after{
  transform:translateX(120%);
  transition:transform .7s ease;
}
.scc-brand-hut .hut-header-cta span{
  position:relative;
  transition:transform .18s ease;
}
.scc-brand-hut .hut-header-cta:hover span{ transform:translateX(2px); }
@media (prefers-reduced-motion: reduce){
  .scc-brand-hut .hut-header-cta,
  .scc-brand-hut .hut-header-cta::after,
  .scc-brand-hut .hut-header-cta span{ transition:none; }
}

/* ---- sticky elevation on scroll (class toggled by site.js) ---- */
.scc-brand-hut .hut-header{ transition:box-shadow .25s ease, border-color .25s ease; }
.scc-brand-hut .hut-header.is-scrolled{
  border-bottom-color:#e2d5ab;
  box-shadow:0 14px 34px -18px rgba(33,27,13,.35);
}
@media (prefers-reduced-motion: reduce){
  .scc-brand-hut .hut-header{ transition:none; }
}