/* LetsGiro shared layout: DIV1 from index, DIV9 distribution from /settimana */
:root{
  --top-layer:116px;
  --bottom-layer:68px;
}

#div1{
  position:fixed;
  inset:0 0 auto 0;
  z-index:100;
  height:var(--top-layer);
  display:flex;
  justify-content:center;
  align-items:center;
  pointer-events:none;
  background:transparent;
}
#div1 .brand{
  width:min(225px,56vw);
  text-align:center;
  line-height:1;
}
#logoMount{
  width:100%;
  height:88px;
  display:flex;
  align-items:center;
  justify-content:center;
}
#logoMount svg{width:100%;height:100%;display:block}
#div1 .tagline{
  margin-top:5px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.22em;
  color:#fff;
  text-shadow:0 1px 8px rgba(0,0,0,.55);
}
body.layout-header-flow #div1{
  position:relative;
  inset:auto;
  z-index:auto;
  width:100%;
  pointer-events:auto;
}
body.layout-header-flow #div1 .brand{pointer-events:auto}
body:not(.layout-home) #logoMount{cursor:pointer}

#div9{
  position:fixed;
  z-index:110;
  left:0;
  right:0;
  bottom:0;
  min-height:var(--bottom-layer);
  padding-bottom:env(safe-area-inset-bottom);
  background:#fff;
  color:#004646;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 -6px 22px rgba(0,0,0,.13);
}
#div9 .nav-btn{
  min-height:var(--bottom-layer);
  border:0;
  background:transparent;
  color:#004646;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  cursor:pointer;
  font-size:10px;
  font-weight:800;
  flex:1 1 0;
  min-width:0;
  text-decoration:none;
}
#div9 .nav-btn svg{
  width:25px;
  height:25px;
  stroke:currentColor;
  fill:none;
  stroke-width:2;
}
#div9 .nav-btn.active{color:#ff9500}
#div9 .nav-btn[hidden]{display:none!important}

/* Content safety for flow pages that now use fixed DIV9 */
body.layout-header-flow .account-shell{padding-bottom:calc(var(--bottom-layer) + env(safe-area-inset-bottom) + 32px);}