/* =========================================================
   AMRANY Home cinematic hero — single continuous scene
   Scoped home header overrides live at the bottom.
   ========================================================= */

.home-hero{
  --hh-ink:#05060a;
  --hh-navy:#07101f;
  --hh-gold:#d5a33b;
  --hh-gold-soft:#f5c45c;
  --hh-gold-pale:#ffe5a0;
  --hh-cream:#f3e8d0;
  --hh-bar:108px;   /* services bar height, refined by JS */
  /* --hh-chrome (announcement bar height) is set on :root by the hero script */
  position:relative;
  width:100%;
  min-height:calc(100vh - var(--hh-chrome, 0px));
  min-height:calc(100svh - var(--hh-chrome, 0px));
  overflow:hidden;
  isolation:isolate;
  background:var(--hh-ink);
  color:#fff;
}

.home-hero__background{
  position:absolute;
  inset:0;
  z-index:0;
  background:
    radial-gradient(ellipse 70% 40% at 50% 58%, rgba(245,196,92,.10), transparent 58%),
    linear-gradient(180deg, #07101f 0%, #05060a 55%, #020305 100%);
  pointer-events:none;
}

/* ---- Countries: tall slanted panels, ~50-55% ---- */
.home-hero__countries{
  position:absolute;
  left:0;right:0;top:0;
  z-index:4;
  height:42%;
  display:grid;
  grid-template-columns:repeat(8,minmax(0,1fr));
  gap:0;
  padding:0;
  pointer-events:none;
}
.home-hero__country{
  position:relative;
  min-width:0;
  height:100%;
  overflow:hidden;
  clip-path:polygon(8% 0,100% 0,92% 100%,0 100%);
  margin:0 -1px;
  opacity:0;
  transform:translateY(-12px);
  pointer-events:auto;
}
.home-hero__country:first-child{clip-path:polygon(0 0,100% 0,92% 100%,0 100%)}
.home-hero__country:last-child{clip-path:polygon(8% 0,100% 0,100% 100%,0 100%)}
.home-hero__country-media{
  position:absolute;inset:0;
  background-image:
    linear-gradient(180deg,rgba(5,6,10,.18) 0%,rgba(5,6,10,.05) 28%,rgba(5,6,10,.55) 78%,rgba(5,6,10,.88) 100%),
    var(--panel-image);
  background-size:cover;
  background-position:var(--panel-pos,50% 45%);
  background-repeat:no-repeat;
  transform:scale(1.04);
  transition:transform .6s ease,filter .6s ease;
}
.home-hero__country-media::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:30%;
  background:linear-gradient(180deg,transparent,rgba(5,6,10,.98) 48%,#05060a 100%);
  pointer-events:none;
}
.home-hero__country:hover .home-hero__country-media{transform:scale(1.08);filter:saturate(1.12) brightness(1.06)}
.home-hero__country::after{
  content:"";
  position:absolute;
  top:6%;right:0;bottom:12%;
  width:1px;
  background:linear-gradient(180deg,transparent,rgba(213,163,59,.9),transparent);
  box-shadow:0 0 8px rgba(245,196,92,.35);
  transform:skewX(-6deg);
  pointer-events:none;
  z-index:2;
}
.home-hero__country:last-child::after{display:none}
.home-hero__country-name{
  position:absolute;
  left:0;right:0;bottom:3.2%;
  z-index:3;
  text-align:center;
  font-family:var(--serif,Georgia,serif);
  font-size:clamp(.58rem,1vw,.78rem);
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--hh-gold-pale);
  text-shadow:0 2px 12px rgba(0,0,0,.75);
}

/* Fade countries into earth */
.home-hero__countries::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-1px;
  height:28%;
  background:linear-gradient(180deg,transparent,rgba(7,16,31,.55) 55%,rgba(5,6,10,.92));
  pointer-events:none;
  z-index:5;
}

/* ---- Earth (stays ABOVE the services bar — no giant blue disc) ---- */
.home-hero__earth-layer{
  position:absolute;
  left:50%;
  bottom:118px;
  z-index:2;
  width:125%;
  height:46%;
  transform:translateX(-50%);
  opacity:0;
  pointer-events:none;
  overflow:hidden;
  mask-image:linear-gradient(180deg,transparent 0%,#000 16%,#000 78%,transparent 100%);
  -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 16%,#000 78%,transparent 100%);
}
.home-hero__earth{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center 38%;
  filter:brightness(.98) saturate(1.08) contrast(1.04);
}

.home-hero__atmosphere{
  position:absolute;
  left:0;right:0;
  top:42%;
  bottom:118px;
  z-index:3;
  pointer-events:none;
  background:
    radial-gradient(ellipse 48% 28% at 50% 68%, rgba(255,229,160,.18), transparent 62%),
    linear-gradient(180deg,rgba(5,6,10,.35) 0%,transparent 24%,transparent 70%,rgba(2,3,5,.55) 100%);
  opacity:0;
}

/* ---- Book light: rises from spine (limited, no giant ellipse) ---- */
.home-hero__book-light{
  position:absolute;
  left:50%;
  bottom:84px;
  z-index:6;
  width:min(380px,46vw);
  height:min(260px,30vh);
  transform:translateX(-50%);
  pointer-events:none;
  opacity:0;
  overflow:hidden;
}
.book-core-light{
  position:absolute;
  left:50%;
  bottom:18%;
  width:12px;height:12px;
  border-radius:50%;
  transform:translateX(-50%);
  background:#fff;
  box-shadow:0 0 14px 5px #fff, 0 0 28px 10px var(--hh-gold-pale);
}
.book-glow{
  position:absolute;
  left:50%;
  bottom:8%;
  width:85%;
  height:85%;
  transform:translateX(-50%);
  background:radial-gradient(ellipse at center,
    rgba(255,215,120,.35) 0%,
    rgba(215,163,59,.12) 35%,
    transparent 70%);
  mix-blend-mode:screen;
}
.book-rays{
  position:absolute;
  left:50%;
  bottom:16%;
  width:100%;
  height:90%;
  transform:translateX(-50%);
  mix-blend-mode:screen;
}
.book-rays i{
  position:absolute;
  left:50%;
  bottom:0;
  width:2px;
  height:100%;
  transform-origin:bottom center;
  background:linear-gradient(180deg,transparent 0%,rgba(255,229,160,.05) 25%,rgba(255,229,160,.4) 70%,rgba(255,255,255,.65) 100%);
  filter:blur(1.2px);
  opacity:.7;
}
.book-rays i:nth-child(1){transform:translateX(-50%) rotate(-22deg)}
.book-rays i:nth-child(2){transform:translateX(-50%) rotate(-14deg)}
.book-rays i:nth-child(3){transform:translateX(-50%) rotate(-7deg)}
.book-rays i:nth-child(4){transform:translateX(-50%) rotate(0);width:3px;opacity:.9}
.book-rays i:nth-child(5){transform:translateX(-50%) rotate(7deg)}
.book-rays i:nth-child(6){transform:translateX(-50%) rotate(14deg)}
.book-rays i:nth-child(7){transform:translateX(-50%) rotate(22deg)}
.book-atmosphere{
  position:absolute;
  left:50%;
  bottom:10%;
  width:58%;
  height:36%;
  transform:translateX(-50%);
  background:radial-gradient(ellipse at center,rgba(245,196,92,.22),transparent 70%);
  filter:blur(14px);
}

/* ---- Animated book (just above services bar) ---- */
.home-hero__book{
  position:absolute;
  left:50%;
  bottom:88px;
  z-index:7;
  width:clamp(190px,min(21vw,30vh),330px);
  aspect-ratio:16/10;
  transform:translateX(-50%) translateY(24px) scale(.94);
  opacity:0;
  perspective:1200px;
}
.animated-book__stage{
  position:relative;
  width:100%;
  height:100%;
  transform-style:preserve-3d;
  transform:rotateX(52deg);
}
.animated-book__spine{
  position:absolute;
  left:50%;
  top:8%;
  bottom:8%;
  width:3.2%;
  transform:translateX(-50%);
  background:linear-gradient(90deg,#0d0a07,#3a2a14 45%,#120e09);
  border-radius:1px;
  z-index:5;
  box-shadow:0 0 12px rgba(255,229,160,.25);
}
.animated-book__cover,
.animated-book__pages{
  position:absolute;
  top:5%;
  bottom:5%;
  width:48%;
  transform-style:preserve-3d;
  transition:transform 1.4s cubic-bezier(.22,.7,.2,1);
}
.animated-book__cover--left,
.animated-book__pages--left{
  left:2%;
  transform-origin:right center;
}
.animated-book__cover--right,
.animated-book__pages--right{
  right:2%;
  transform-origin:left center;
}
.animated-book__pages{
  z-index:2;
  background:
    linear-gradient(90deg,rgba(0,0,0,.22),transparent 24%),
    linear-gradient(180deg,rgba(255,244,214,.45),rgba(255,244,214,0) 52%),
    repeating-linear-gradient(180deg,#fbf3e1 0 12px,#eee0c1 12px 13px);
  border-radius:2px 3px 3px 2px;
  box-shadow:inset 0 0 26px rgba(120,90,30,.10), 0 0 34px rgba(255,229,160,.22);
}
.animated-book__pages--left{
  background:
    linear-gradient(270deg,rgba(0,0,0,.22),transparent 24%),
    linear-gradient(180deg,rgba(255,244,214,.45),rgba(255,244,214,0) 52%),
    repeating-linear-gradient(180deg,#fbf3e1 0 12px,#eee0c1 12px 13px);
  border-radius:3px 2px 2px 3px;
}
.animated-book__cover{
  z-index:3;
  background:
    linear-gradient(135deg,rgba(213,163,59,.22),transparent 42%),
    linear-gradient(180deg,#1a140e 0%,#0c0907 100%);
  border-radius:2px;
  box-shadow:none;
}
.animated-book[style*="--book-cover"] .animated-book__cover{
  background:
    linear-gradient(135deg,rgba(213,163,59,.18),transparent 40%),
    linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.55)),
    var(--book-cover) center/cover no-repeat,
    #1a140e;
}
/* A country with no artwork yet: quiet gold-on-dark panel instead of a
   visible placeholder file. Upload the real image in the Customizer. */
.home-hero__country.is-placeholder .home-hero__country-media{
  background-image:
    linear-gradient(180deg,rgba(5,6,10,.25) 0%,rgba(5,6,10,.55) 60%,rgba(5,6,10,.92) 100%),
    radial-gradient(ellipse 80% 50% at 50% 34%, rgba(213,163,59,.20), transparent 68%),
    linear-gradient(180deg,#0d1728 0%,#080d16 70%,#05060a 100%);
  transform:none;
}
.home-hero__earth-layer.is-placeholder{
  outline:1px dashed rgba(213,163,59,.35);
}
.animated-book__cover--left{
  box-shadow:inset -1px 0 0 rgba(213,163,59,.35);
}
.animated-book__cover--right{
  box-shadow:inset 1px 0 0 rgba(213,163,59,.35);
}

/* Closed */
.animated-book .animated-book__cover--left{transform:rotateY(84deg) translateZ(2px)}
.animated-book .animated-book__pages--left{transform:rotateY(80deg)}
.animated-book .animated-book__cover--right{transform:rotateY(-84deg) translateZ(2px)}
.animated-book .animated-book__pages--right{transform:rotateY(-80deg)}

/* Opening */
.animated-book.is-opening .animated-book__cover--left{transform:rotateY(44deg) translateZ(2px)}
.animated-book.is-opening .animated-book__pages--left{transform:rotateY(34deg)}
.animated-book.is-opening .animated-book__cover--right{transform:rotateY(-44deg) translateZ(2px)}
.animated-book.is-opening .animated-book__pages--right{transform:rotateY(-34deg)}

/* Open — the covers lie back flat so the lit pages are what you actually see */
.animated-book.is-open .animated-book__cover--left{transform:rotateY(168deg) translateZ(2px)}
.animated-book.is-open .animated-book__pages--left{transform:rotateY(7deg) translateZ(2px)}
.animated-book.is-open .animated-book__cover--right{transform:rotateY(-168deg) translateZ(2px)}
.animated-book.is-open .animated-book__pages--right{transform:rotateY(-7deg) translateZ(2px)}

.home-hero__bottom-gradient{
  position:absolute;
  left:0;right:0;
  bottom:100px;
  z-index:5;
  height:48px;
  background:linear-gradient(180deg,transparent,rgba(2,3,5,.85));
  pointer-events:none;
}

/* ---- Solid services bar (opaque — hides earth behind) ---- */
.home-hero__categories{
  position:absolute;
  left:0;right:0;bottom:0;
  z-index:12;
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:0;
  min-height:108px;
  padding:18px 0 20px;
  background:linear-gradient(to bottom, rgba(4,5,7,.98), #020305);
  border-top:1px solid rgba(213,163,59,.22);
  opacity:0;
  transform:translateY(10px);
}
.home-hero__cat{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  width:100%;
  text-align:center;
  color:#f4e4bd;
  text-decoration:none;
  padding:6px 10px;
  border-right:1px solid rgba(213,163,59,.35);
  transition:color .2s ease, transform .2s ease;
}
.home-hero__cat:last-child{border-right:0}
.home-hero__cat:hover{color:#fff;transform:translateY(-1px)}
.home-hero__cat-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:auto;
  height:auto;
  border:0;
  border-radius:0;
  background:transparent;
  color:#d7a63e;
  filter:drop-shadow(0 0 8px rgba(213,163,59,.15));
}
.home-hero__cat-icon svg{
  width:42px;
  height:42px;
  display:block;
}
.home-hero__cat-label{
  display:block;
  font-size:clamp(.72rem,1.05vw,.95rem);
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  line-height:1.25;
  max-width:12em;
}

/* =========================================================
   BRAND BLOCK — the site logo, animated, at the centre
   ========================================================= */
.home-hero__brand{
  position:absolute;
  left:50%;
  bottom:calc(132px + 19vh);
  z-index:9;
  width:min(780px,88vw);
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:clamp(8px,1.4vh,20px);
  pointer-events:none;
}

.home-hero__brand-aura{
  position:absolute;
  left:50%;
  top:36%;
  width:min(620px,86vw,64vh);
  aspect-ratio:1;
  transform:translate(-50%,-50%) scale(.55);
  background:radial-gradient(circle at center,
    rgba(255,229,160,.20) 0%,
    rgba(213,163,59,.10) 32%,
    rgba(213,163,59,.04) 48%,
    transparent 66%);
  opacity:0;
  z-index:-1;
  pointer-events:none;
}

/* ---- Logo ---- */
.home-hero__logo{
  position:relative;
  width:min(180px,12.5vw,22vh);
  min-width:86px;
  max-width:46vw;
  opacity:0;
  transform:translateY(34px) scale(.78);
  filter:blur(8px);
}
.home-hero__logo-float{
  position:relative;
  display:block;
  line-height:0;
}
.home-hero__logo-img{
  position:relative;
  display:block;
  width:100%;
  height:auto;
  z-index:2;
  filter:
    drop-shadow(0 12px 30px rgba(0,0,0,.6))
    drop-shadow(0 0 1.5px rgba(255,235,190,.85));
}
/* Gold silhouette behind the mark: lifts the navy strokes off the dark scene */
.home-hero__logo-glow{
  position:absolute;
  inset:-8%;
  z-index:1;
  background:radial-gradient(circle at 50% 45%, #ffe5a0 0%, #d5a33b 55%, #b4832c 100%);
  -webkit-mask:var(--hero-logo) center/contain no-repeat;
  mask:var(--hero-logo) center/contain no-repeat;
  filter:blur(14px);
  opacity:.5;
  pointer-events:none;
}
/* Light sweep, clipped to the exact shape of the logo */
.home-hero__logo-shine{
  position:absolute;
  inset:0;
  z-index:3;
  -webkit-mask:var(--hero-logo) center/contain no-repeat;
  mask:var(--hero-logo) center/contain no-repeat;
  background:linear-gradient(112deg,
    transparent 40%,
    rgba(255,255,255,.72) 47%,
    rgba(255,240,205,.92) 50%,
    rgba(255,255,255,.72) 53%,
    transparent 60%);
  background-size:260% 100%;
  background-position:190% 0;
  background-repeat:no-repeat;
  mix-blend-mode:screen;
  opacity:0;
  pointer-events:none;
}

/* ---- Wordmark ---- */
.home-hero__title{
  margin:0;
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:center;
  gap:0 .32em;
  max-width:100%;
  font-family:var(--serif,Georgia,"Times New Roman",serif);
  font-size:clamp(1.05rem,min(3vw,4.4vh),2.35rem);
  font-weight:700;
  line-height:1.08;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.home-hero__title-word{
  display:inline-block;
  background:linear-gradient(100deg,
    #b8842c 0%,
    #e9c473 18%,
    #fff3d2 34%,
    #e0b45f 48%,
    #b8842c 66%,
    #f0d391 84%,
    #c79338 100%);
  background-size:230% 100%;
  background-position:0 0;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  opacity:0;
  transform:translateY(22px);
  filter:drop-shadow(0 4px 16px rgba(0,0,0,.55));
}

/* ---- Tagline ---- */
.home-hero__tagline{
  margin:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(10px,1.8vw,24px);
  width:100%;
  opacity:0;
  transform:translateY(10px);
}
.home-hero__tagline span{
  font-size:clamp(.58rem,min(.95vw,1.5vh),.82rem);
  font-weight:600;
  letter-spacing:.4em;
  text-indent:.4em;
  text-transform:uppercase;
  color:rgba(243,232,208,.88);
  text-shadow:0 2px 14px rgba(0,0,0,.7);
  white-space:nowrap;
}
.home-hero__tagline::before,
.home-hero__tagline::after{
  content:"";
  flex:0 1 auto;
  height:1px;
  width:clamp(22px,7vw,110px);
  background:linear-gradient(90deg,transparent,rgba(213,163,59,.9));
}
.home-hero__tagline::after{
  background:linear-gradient(90deg,rgba(213,163,59,.9),transparent);
}

/* Arabic: no letter-spacing, it breaks the script */
html[dir="rtl"] .home-hero__title,
html[dir="rtl"] .home-hero__tagline span{
  letter-spacing:0;
  text-indent:0;
}
html[dir="rtl"] .home-hero__title{
  font-size:clamp(1rem,min(2.8vw,4.2vh),2.2rem);
}
/* A Latin site name keeps its own reading order inside an RTL page */
.home-hero__title[dir="ltr"]{direction:ltr}
html[dir="rtl"] .home-hero__tagline span{
  font-size:clamp(.78rem,min(1.35vw,2vh),1.05rem);
  font-weight:700;
}

/* ---- Light motes rising from the book ---- */
.home-hero__motes{
  position:absolute;
  left:50%;
  bottom:88px;
  z-index:8;
  width:min(340px,42vw);
  height:min(320px,38vh);
  transform:translateX(-50%);
  pointer-events:none;
  opacity:0;
}
.home-hero__motes i{
  position:absolute;
  bottom:0;
  width:3px;
  height:3px;
  border-radius:50%;
  background:var(--hh-gold-pale);
  box-shadow:0 0 6px 1px rgba(255,229,160,.7);
  opacity:0;
}
.home-hero__motes i:nth-child(1){left:12%;--dur:9s;--del:0s;--dx:14px}
.home-hero__motes i:nth-child(2){left:24%;--dur:11s;--del:1.4s;--dx:-18px}
.home-hero__motes i:nth-child(3){left:36%;--dur:8.5s;--del:2.6s;--dx:10px}
.home-hero__motes i:nth-child(4){left:46%;--dur:12s;--del:.8s;--dx:-12px}
.home-hero__motes i:nth-child(5){left:55%;--dur:10s;--del:3.4s;--dx:16px}
.home-hero__motes i:nth-child(6){left:66%;--dur:9.5s;--del:2s;--dx:-14px}
.home-hero__motes i:nth-child(7){left:78%;--dur:11.5s;--del:4.2s;--dx:12px}
.home-hero__motes i:nth-child(8){left:88%;--dur:10.5s;--del:5s;--dx:-10px}
.home-hero__motes i:nth-child(9){left:50%;--dur:13s;--del:6s;--dx:8px}

@keyframes hh-mote{
  0%{opacity:0;transform:translate(0,0) scale(.6)}
  12%{opacity:.85}
  70%{opacity:.5}
  100%{opacity:0;transform:translate(var(--dx,0),-100%) scale(1.05)}
}


/* =========================================================
   CUT-OUT MODE — real transparent artwork (docs/hero)
   Panels, globe and book are PNG/WebP cut-outs, not CSS shapes.
   ========================================================= */
.home-hero__countries.is-cutout{
  height:auto;
  top:0;
  align-items:start;
  z-index:4;
  pointer-events:none;
}
.home-hero__countries.is-cutout .home-hero__country{
  position:relative;
  height:auto;
  overflow:visible;
  clip-path:none;
  margin:0;
  pointer-events:auto;
}
.home-hero__countries.is-cutout .home-hero__country:first-child,
.home-hero__countries.is-cutout .home-hero__country:last-child{clip-path:none}
.home-hero__countries.is-cutout .home-hero__country::after{display:none}
.home-hero__countries.is-cutout .home-hero__country-img{
  display:block;
  width:124%;
  max-width:none;
  height:auto;
  max-height:min(50vh,470px);
  object-fit:contain;
  object-position:top center;
  margin-inline:-12%;
  filter:drop-shadow(0 20px 34px rgba(0,0,0,.6));
  transition:transform .55s cubic-bezier(.2,.7,.2,1), filter .55s ease;
}
.home-hero__countries.is-cutout .home-hero__country:hover .home-hero__country-img{
  transform:translateY(-7px) scale(1.03);
  filter:drop-shadow(0 28px 44px rgba(0,0,0,.68)) saturate(1.1) brightness(1.07);
}
/* Panels melt into the night below */
.home-hero__countries.is-cutout::after{
  height:20%;
  background:linear-gradient(180deg,transparent,rgba(5,6,10,.55) 62%,rgba(5,6,10,.92));
}

/* ---- Globe cut-out ---- */
.home-hero__earth-layer.is-cutout{
  width:min(142%,1700px);
  height:auto;
  bottom:calc(var(--hh-bar,108px) - 22px);
  overflow:visible;
  mask-image:none;
  -webkit-mask-image:none;
}
.home-hero__earth-layer.is-cutout .home-hero__earth{
  height:auto;
  max-height:none;
  object-fit:contain;
  filter:none;
}

/* ---- Book cut-out ---- */
.home-hero__book--image{
  width:clamp(300px,min(38vw,44vh),660px);
  aspect-ratio:auto;
  bottom:calc(var(--hh-bar,108px) - 34px);
  perspective:none;
}
.home-hero__book-img{
  display:block;
  width:100%;
  height:auto;
  filter:drop-shadow(0 16px 38px rgba(0,0,0,.6));
}
.home-hero.is-lit .home-hero__book--image .home-hero__book-img{
  animation:hh-book-breathe 7.5s 1.1s ease-in-out infinite;
}
@keyframes hh-book-breathe{
  0%,100%{filter:drop-shadow(0 16px 38px rgba(0,0,0,.6)) drop-shadow(0 -4px 22px rgba(255,196,92,.24))}
  50%{filter:drop-shadow(0 16px 38px rgba(0,0,0,.6)) drop-shadow(0 -10px 44px rgba(255,214,130,.48))}
}
/* The artwork carries its own starburst — keep only the soft ambient glow */
.home-hero.has-book-image .book-core-light,
.home-hero.has-book-image .book-rays{display:none}
.home-hero.has-book-image .book-glow{opacity:.7}
.home-hero.has-book-image .home-hero__book-light{
  bottom:calc(var(--hh-bar,108px) - 40px);
  width:min(460px,54vw);
  height:min(240px,26vh);
}

/* ---- Sequence ---- */
.home-hero.is-ready .home-hero__country{
  animation:hh-country-in .75s cubic-bezier(.2,.7,.2,1) forwards;
}
.home-hero.is-ready .home-hero__country:nth-child(1){animation-delay:.04s}
.home-hero.is-ready .home-hero__country:nth-child(2){animation-delay:.09s}
.home-hero.is-ready .home-hero__country:nth-child(3){animation-delay:.14s}
.home-hero.is-ready .home-hero__country:nth-child(4){animation-delay:.19s}
.home-hero.is-ready .home-hero__country:nth-child(5){animation-delay:.24s}
.home-hero.is-ready .home-hero__country:nth-child(6){animation-delay:.29s}
.home-hero.is-ready .home-hero__country:nth-child(7){animation-delay:.34s}
.home-hero.is-ready .home-hero__country:nth-child(8){animation-delay:.39s}
@keyframes hh-country-in{to{opacity:1;transform:none}}

.home-hero.is-book-visible .home-hero__book{
  opacity:1;
  transform:translateX(-50%) translateY(0) scale(1);
  transition:opacity .6s ease, transform .8s cubic-bezier(.2,.7,.2,1);
}
.home-hero.is-lit .home-hero__book-light,
.home-hero.is-lit .home-hero__atmosphere{opacity:1;transition:opacity 1.1s ease}
.home-hero.is-lit .home-hero__earth-layer{opacity:1;transition:opacity 1.2s ease}
.home-hero.is-complete .home-hero__categories{
  opacity:1;transform:none;transition:opacity .7s ease,transform .7s ease;
}
.home-hero.is-lit .home-hero__motes i{
  animation:hh-mote var(--dur,10s) var(--del,0s) linear infinite;
}
.home-hero.is-lit .home-hero__motes{
  opacity:1;transition:opacity 1.4s ease;
}

/* ---- Brand reveal ---- */
.home-hero.is-brand .home-hero__brand-aura{
  animation:hh-aura-in 1.6s cubic-bezier(.2,.7,.2,1) forwards,
            hh-aura-pulse 7s 1.6s ease-in-out infinite;
}
@keyframes hh-aura-in{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.55)}
  100%{opacity:1;transform:translate(-50%,-50%) scale(1)}
}
@keyframes hh-aura-pulse{
  0%,100%{opacity:1;transform:translate(-50%,-50%) scale(1)}
  50%{opacity:.72;transform:translate(-50%,-50%) scale(1.06)}
}

.home-hero.is-brand .home-hero__logo{
  animation:hh-logo-in 1.15s cubic-bezier(.19,.9,.26,1) forwards;
}
@keyframes hh-logo-in{
  0%{opacity:0;transform:translateY(34px) scale(.78);filter:blur(8px)}
  60%{opacity:1}
  100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}
}
.home-hero.is-brand .home-hero__logo-float{
  animation:hh-logo-float 6.5s 1.1s ease-in-out infinite;
}
@keyframes hh-logo-float{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-9px)}
}
.home-hero.is-brand .home-hero__logo-glow{
  animation:hh-logo-glow 5s 1.1s ease-in-out infinite;
}
@keyframes hh-logo-glow{
  0%,100%{opacity:.42;filter:blur(14px)}
  50%{opacity:.72;filter:blur(19px)}
}
.home-hero.is-brand .home-hero__logo-shine{
  opacity:1;
  animation:hh-logo-shine 6s 1.5s ease-in-out infinite;
}
@keyframes hh-logo-shine{
  0%{background-position:190% 0}
  26%{background-position:-90% 0}
  100%{background-position:-90% 0}
}

.home-hero.is-brand .home-hero__title-word{
  animation:hh-word-in .85s cubic-bezier(.2,.8,.24,1) forwards,
            hh-word-shimmer 9s linear infinite;
  animation-delay:calc(.28s + var(--w,0) * .13s), calc(2.4s + var(--w,0) * .5s);
}
@keyframes hh-word-in{
  0%{opacity:0;transform:translateY(22px)}
  100%{opacity:1;transform:translateY(0)}
}
@keyframes hh-word-shimmer{
  0%{background-position:0 0}
  50%{background-position:100% 0}
  100%{background-position:0 0}
}

.home-hero.is-brand .home-hero__tagline{
  animation:hh-tagline-in 1s .72s cubic-bezier(.2,.8,.24,1) forwards;
}
@keyframes hh-tagline-in{
  0%{opacity:0;transform:translateY(10px)}
  100%{opacity:1;transform:translateY(0)}
}

/* =========================================================
   HOME HEADER ONLY (other pages keep existing styles)
   ========================================================= */
body.has-cinematic-hero{
  overflow-x:hidden;
}
body.has-cinematic-hero .announcement{
  position:relative;
  z-index:70;
  margin:0;
  opacity:1 !important;
  transform:none !important;
}
/* The header floats over the top of the scene, so the whole composition
   (flags → globe → book → services bar) fits in one screen. */
body.has-cinematic-hero .site-main{
  position:relative;
  z-index:1;
  margin-top:calc(-1 * var(--hh-header, 0px));
}
body.has-cinematic-hero .site-header{
  position:sticky;
  top:0;
  z-index:65;
  background:linear-gradient(180deg,rgba(5,6,10,.82),rgba(5,6,10,.28) 75%,transparent);
  border-bottom:0;
  opacity:1 !important;
  transform:none !important;
}
body.has-cinematic-hero .site-header.is-solid{
  background:rgba(11,11,13,.96);
  border-bottom:1px solid rgba(198,161,91,.25);
}
body.has-cinematic-hero .header-inner{
  align-items:center;
  min-height:70px;
}
body.has-cinematic-hero .brand .custom-logo{
  max-height:52px;
  width:auto;
}
body.has-cinematic-hero .primary-nav>ul>li.menu-item-has-children{
  display:inline-flex;
  align-items:center;
  gap:4px;
}
body.has-cinematic-hero .primary-nav .submenu-toggle{
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 2px;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:rgba(255,255,255,.72);
  line-height:1;
  box-shadow:none;
}
body.has-cinematic-hero .primary-nav .submenu-toggle svg{
  width:12px;
  height:12px;
  opacity:.75;
}
body.has-cinematic-hero .primary-nav .submenu-toggle[aria-expanded="true"]{
  color:var(--hh-gold-soft,#f5c45c);
  background:transparent !important;
}

/* Responsive */
@media (max-width:1100px){
  .home-hero__countries{height:42%}
  .home-hero__book{width:clamp(200px,26vw,320px)}
  .home-hero__cat-icon svg{width:36px;height:36px}
  .home-hero__brand{bottom:calc(126px + 16vh)}
}
@media (max-width:900px){
  .home-hero__countries{
    height:auto;
    min-height:0;
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .home-hero__country,
  .home-hero__country:first-child,
  .home-hero__country:last-child{
    clip-path:none;
    min-height:118px;
  }
  .home-hero__country::after{transform:none;top:10%;bottom:20%}
  .home-hero__earth-layer{width:130%;height:42%;bottom:168px}
  .home-hero__atmosphere{bottom:168px}
  .home-hero__book,.home-hero__book-light{bottom:168px}
  .home-hero__motes{bottom:168px;height:34vh}
  .home-hero__bottom-gradient{bottom:150px}
  .home-hero__brand{
    bottom:calc(190px + 14vh);
    width:min(600px,90vw);
  }
  .home-hero__logo{width:min(140px,17vw,17vh)}
  .home-hero__categories{grid-template-columns:repeat(3,minmax(0,1fr));min-height:150px}
  .home-hero__cat{border-right:1px solid rgba(213,163,59,.28);border-bottom:1px solid rgba(213,163,59,.18);padding:14px 8px}
  .home-hero__cat:nth-child(3n){border-right:0}
  .home-hero__cat:nth-child(n+4){border-bottom:0}
}
@media (max-width:640px){
  .home-hero{min-height:calc(100svh - var(--hh-chrome, 0px))}
  .home-hero__countries{
    grid-template-columns:repeat(4,minmax(0,1fr));
    min-height:0;
  }
  .home-hero__country,
  .home-hero__country:first-child,
  .home-hero__country:last-child{min-height:86px;opacity:1;transform:none}
  .home-hero__country-name{font-size:.52rem;letter-spacing:.1em;bottom:5%}
  .home-hero.is-ready .home-hero__country{animation:none}
  .home-hero__earth-layer{width:140%;height:36%;bottom:220px}
  .home-hero__atmosphere{bottom:220px}
  .home-hero__book{width:min(58vw,240px);bottom:220px}
  .home-hero__book-light{bottom:220px;height:28vh;width:min(320px,72vw)}
  .home-hero__motes{bottom:220px;height:26vh;width:min(280px,70vw)}
  .home-hero__bottom-gradient{bottom:200px}
  .home-hero__brand{
    bottom:calc(232px + 14vh);
    width:min(440px,92vw);
    gap:10px;
  }
  .home-hero__logo{width:min(112px,24vw,15vh)}
  .home-hero__title{letter-spacing:.1em}
  .home-hero__tagline::before,
  .home-hero__tagline::after{width:clamp(14px,8vw,42px)}
  .home-hero__tagline span{letter-spacing:.28em;text-indent:.28em}
  .home-hero__categories{grid-template-columns:repeat(2,minmax(0,1fr));min-height:210px;padding:12px 0}
  .home-hero__cat{border-right:1px solid rgba(213,163,59,.28);border-bottom:1px solid rgba(213,163,59,.18)}
  .home-hero__cat:nth-child(2n){border-right:0}
  .home-hero__cat:nth-child(n+5){border-bottom:0}
  .home-hero__cat-icon svg{width:34px;height:34px}
  body.has-cinematic-hero .site-header{
    background:rgba(11,11,13,.94);
  }
}
@media (prefers-reduced-motion:reduce){
  .home-hero__country,
  .home-hero__book,
  .home-hero__book-light,
  .home-hero__earth-layer,
  .home-hero__atmosphere,
  .home-hero__categories,
  .home-hero__brand-aura,
  .home-hero__logo,
  .home-hero__logo-float,
  .home-hero__logo-glow,
  .home-hero__title-word,
  .home-hero__tagline{opacity:1 !important;transform:none !important;animation:none !important;transition:none !important;filter:none}
  .home-hero__book{transform:translateX(-50%) !important}
  .home-hero__brand-aura{transform:translate(-50%,-50%) !important}
  .home-hero__logo-img{filter:drop-shadow(0 12px 30px rgba(0,0,0,.6))}
  .home-hero__logo-glow{opacity:.5 !important;filter:blur(14px)}
  .home-hero__logo-shine,
  .home-hero__motes{display:none}
  .animated-book .animated-book__cover--left,
  .animated-book .animated-book__pages--left{transform:rotateY(6deg)!important}
  .animated-book .animated-book__cover--right,
  .animated-book .animated-book__pages--right{transform:rotateY(-6deg)!important}
}

/* The hero remains complete and usable if JavaScript is unavailable. */
.no-js .home-hero__country,
.no-js .home-hero__book,
.no-js .home-hero__book-light,
.no-js .home-hero__earth-layer,
.no-js .home-hero__atmosphere,
.no-js .home-hero__categories,
.no-js .home-hero__brand-aura,
.no-js .home-hero__logo,
.no-js .home-hero__title-word,
.no-js .home-hero__tagline{
  opacity:1 !important;
  animation:none !important;
  transition:none !important;
}
.no-js .home-hero__logo{filter:none !important}
.no-js .home-hero__logo-shine,
.no-js .home-hero__motes{display:none}
.no-js .home-hero__country,
.no-js .home-hero__categories,
.no-js .home-hero__logo,
.no-js .home-hero__title-word,
.no-js .home-hero__tagline{transform:none !important}
.no-js .home-hero__brand-aura{transform:translate(-50%,-50%) !important}
.no-js .home-hero__book{transform:translateX(-50%) !important}
.no-js .animated-book .animated-book__cover--left,
.no-js .animated-book .animated-book__pages--left{transform:rotateY(6deg)!important}
.no-js .animated-book .animated-book__cover--right,
.no-js .animated-book .animated-book__pages--right{transform:rotateY(-6deg)!important}