/* FIZO Hero — Elementor Widget structural styles
   Colors, fonts, spacing are controlled from Elementor (Style tab) via inline/dynamic CSS.
   This file only holds structure/layout/animation that isn't meant to be edited per-instance. */

.fizo-hero-section{
  position:relative;
  overflow:hidden;
  width:100%;
}
.fizo-hero-inner{
  position:relative;
  display:grid;
  grid-template-columns:1.08fr .92fr;
  align-items:center;
  gap:30px;
  width:100%;
  margin:0 auto;
}
.fizo-hero-inner.fizo-no-art{
  grid-template-columns:1fr;
}
.fizo-hero-glow{
  content:"";
  position:absolute;
  inset:18% -10% -20% 40%;
  pointer-events:none;
  z-index:0;
}
.fizo-hero-copy{
  position:relative;
  z-index:2;
  max-width:720px;
}
.fizo-eyebrow{
  display:flex;
  align-items:center;
  gap:9px;
  margin:0 0 25px;
  text-transform:uppercase;
}
.fizo-pulse{
  display:inline-block;
  width:7px;
  height:7px;
  border-radius:50%;
  flex:0 0 auto;
  box-shadow:0 0 0 6px rgba(255,106,42,.08);
}
.fizo-heading{
  margin:0 0 36px;
}
.fizo-heading em{
  font-style:normal;
}
.fizo-lead{
  max-width:570px;
  margin:0 0 34px;
}
.fizo-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:27px;
}
.fizo-btn-primary{
  display:inline-flex;
  align-items:center;
  gap:22px;
  padding:16px 19px;
  border-radius:100px;
  text-transform:uppercase;
  transition:transform .25s ease, box-shadow .25s ease;
}
.fizo-btn-primary:hover{
  transform:translateY(-2px);
}
.fizo-text-link{
  display:inline-flex;
  align-items:center;
  text-transform:uppercase;
}
.fizo-text-link span,
.fizo-btn-primary span{
  margin-inline-start:8px;
}

/* Visual / art side */
.fizo-art{
  position:relative;
  z-index:2;
  height:min(620px,58vw);
  min-height:430px;
}
.fizo-frame{
  position:absolute;
}
.fizo-frame-back{
  inset:9% 4% 8% 12%;
  border:1px solid rgba(255,255,255,.11);
  transform:rotate(5deg);
}
.fizo-frame-main{
  inset:4% 12% 10% 2%;
  overflow:hidden;
  box-shadow:30px 30px 80px rgba(0,0,0,.45);
}
.fizo-frame-main-glow{
  content:"";
  position:absolute;
  width:280px;
  height:280px;
  border-radius:50%;
  right:-90px;
  bottom:-110px;
  filter:blur(2px);
  opacity:.9;
  pointer-events:none;
}
.fizo-frame-top,
.fizo-frame-bottom{
  position:absolute;
  left:22px;
  right:22px;
  display:flex;
  justify-content:space-between;
  text-transform:uppercase;
  z-index:2;
}
.fizo-frame-top{ top:19px; }
.fizo-frame-bottom{ bottom:18px; }
.fizo-hero-letter{
  position:absolute;
  font-size:min(38vw,440px);
  font-weight:900;
  line-height:.75;
  letter-spacing:-.14em;
  left:11%;
  top:21%;
  color:transparent;
  -webkit-text-stroke:2px rgba(255,255,255,.76);
  transform:rotate(-7deg);
}
.fizo-tag{
  position:absolute;
  padding:9px 12px;
  text-transform:uppercase;
  box-shadow:0 12px 25px rgba(0,0,0,.5);
}
.fizo-tag-one{ left:-3%; top:25%; transform:rotate(-6deg); }
.fizo-tag-two{ right:0; bottom:19%; transform:rotate(5deg); }

.fizo-scroll-cue{
  position:absolute;
  bottom:34px;
  left:0;
  display:flex;
  align-items:center;
  gap:13px;
  text-transform:uppercase;
}
.fizo-scroll-cue i{
  display:block;
  width:48px;
  height:1px;
}

@media(max-width:900px){
  .fizo-hero-inner{
    grid-template-columns:1fr;
    padding-top:40px;
  }
  .fizo-art{
    height:480px;
    min-height:0;
    margin-top:25px;
  }
  .fizo-scroll-cue{ display:none; }
}

@media(max-width:620px){
  .fizo-art{ height:370px; }
  .fizo-frame-main{ inset:4% 6% 10% 0; }
  .fizo-frame-back{ inset:8% 0 8% 8%; }
  .fizo-hero-letter{ font-size:270px; }
  .fizo-tag-one{ left:-3%; top:22%; }
  .fizo-tag-two{ right:-1%; bottom:17%; }
}

@media(prefers-reduced-motion:reduce){
  .fizo-btn-primary{ transition:none; }
}