/*
 Theme Name:   SIM NZ Child Theme
 Theme URI:    https://sim.org.nz/
 Description:  SIM NZ custom child theme to extend Bricks.
 Author:       Phil Botha
 Author URI:   https://philbotha.co.nz/
 Template:     bricks
 Version:      1.0
 Text Domain:  bricks
*/
:root {
  font-size: 100%;
  color: var(--black-green);
}

h1, h2, h3 {
	font-optical-sizing: none; 
	font-weight: 400;
	line-height: .9em;
}

header a, header span {
	font-weight: 600;
	line-height: 1.1em;
	color: var(--black-green)
}
.serif{
	font-family: var(--serif);
} 

@media (max-width: 579.98px) {
  .support {
    display: none !important;
  }
}
@media (max-width: 380px) {
  #brxe-bmpymv {
  font-size: 1rem !important;
  padding-right: .5rem !important;
  padding-left: .5rem !important;
  }
}

 .sim-burger span{
	color: var(--sim-red);
} 
.sim-burger:focus {
	outline: none;
	-webkit-tap-highlight-color: transparent;
}
.slider-content .title {
	font-family: var(--serif);
	text-wrap: balance !important;
    font-optical-sizing: none;  
}
.slider-content p {
	text-wrap: balance !important; 
}


.lead-in {
font-size: clamp(2.7994rem, 2.384rem + 1.8461vw, 3.8147rem);
font-family: var(--serif);
font-optical-sizing: none;
line-height: 1.05em;
}
/* enable smooth numeric transitions on a custom prop */
@property --p {
  syntax: "<number>";
  inherits: false;
  initial-value: 0;
}

/* Base link */
.mega-menu-sub-item {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .4rem;

  /* Tweakables */
  --arrow-size: 1em;
  --arrow-shift: 0.32em;        /* reduced travel so it stays closer to the link */
  --return-ease: cubic-bezier(.25,.7,.2,1);
  --return-duration: 280ms;
}


.mega-menu-sub-item::after {
  content: "";
  display: inline-block;
  width: var(--arrow-size);
  height: var(--arrow-size);
  margin-left: .1rem;
  background-color: currentColor;


  translate: calc(var(--p) * var(--arrow-shift)) 0;  
  scale: 1;                                          
  transform-origin: 60% 50%;

  transition:
    translate var(--return-duration) var(--return-ease),
    scale 180ms ease-out;

  -webkit-mask: url('data:image/svg+xml;utf8,\
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">\
    <g fill="none" stroke="%23fff" stroke-width="3" stroke-linecap="round" stroke-linejoin="round">\
      <path d="M5 12h12"/>\
      <path d="M13 6l6 6-6 6"/>\
    </g>\
  </svg>') center/contain no-repeat;
          mask: url('data:image/svg+xml;utf8,\
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">\
    <g fill="none" stroke="%23fff" stroke-width="3" stroke-linecap="round" stroke-linejoin="round">\
      <path d="M5 12h12"/>\
      <path d="M13 6l6 6-6 6"/>\
    </g>\
  </svg>') center/contain no-repeat;
}

.mega-menu-sub-item:hover::after,
.mega-menu-sub-item:focus-visible::after {
  /* position: smoothly move to the right */
  --p: 1;
  color: var(--sim-red);
  animation: arrow-breathe 900ms ease-in-out infinite alternate;
}

@keyframes arrow-breathe {
  0%   { scale: 1; }
  45%  { scale: 1.18; }
  100% { scale: 1.02; }
}
@media (prefers-reduced-motion: reduce) {
  .mega-menu-sub-item::after {
    transition: none !important;
  }
  .mega-menu-sub-item:hover::after,
  .mega-menu-sub-item:focus-visible::after {
    animation: none !important;
    --p: 1;
  }
}

#brxe-bmpymv, .bricks-button {
    padding: 8px 25px 12px 25px;
    justify-content: center;
    align-items: center;
    border: none;
    font-size: 1.3rem;
    text-wrap: nowrap;
    transition: all .2s ease;
	cursor: pointer;
}

#brxe-bmpymv:hover, .bricks-button:hover {
    box-shadow: rgba(0,0,0,.4) 0px 2px 4px,rgba(0,0,0,.3) 0px 7px 13px -3px,rgba(0,0,0,.2) 0px -3px 0px inset;
    transform: translatey(-2px)
}
#brxe-bmpymv:active, .bricks-button:active {
    box-shadow: rgba(0,0,0,.4) 0px 1px 2px,rgba(0,0,0,.3) 0px 7px 13px -3px,rgba(0,0,0,.2) 0px -3px 0px inset;
    transform: translatey(0px)
}