/* ELFIRA Group V11.1 — photo-real MacBook scene integrated into the hero.
   Desktop is split; mobile stacks. Artwork has feathered transparent edges. */
.hero.section-wrap{
  max-width:1380px;
  width:calc(100% - 92px);
  padding-top:149px;
  padding-bottom:78px;
}
.hero:before,body.dark .hero:before{
  right:-9%;top:8%;width:69%;height:500px;
  background:radial-gradient(ellipse at center,rgba(166,167,176,.09),transparent 72%);
  filter:blur(38px);
}
.hero-stage{
  display:grid;
  grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
  align-items:center;
  gap:0;
  position:relative;
  min-height:495px;
}
.hero-stage .hero-text{
  position:relative;
  z-index:2;
  min-width:0;
}
.hero-stage .hero-text h1{
  font-size:clamp(74px,7.2vw,116px);
  line-height:.97;
  letter-spacing:-.085em;
}
.hero-stage .hero-text>p{
  max-width:490px;
  font-size:clamp(17px,1.55vw,21px);
  line-height:1.52;
  margin:30px 0 27px;
}
.hero-stage .hero-actions{gap:24px}
.hero-stage .hero-note{margin-top:36px}
.hero-device-scene{
  width:118%;
  max-width:none;
  margin-left:-7%;
  aspect-ratio:940/519;
  position:relative;
  min-width:0;
  pointer-events:none;
  z-index:1;
}
.hero-device-scene img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  border:0;
  user-select:none;
  -webkit-user-drag:none;
}
body:not(.dark) .hero-device-scene img{
  filter:drop-shadow(0 18px 34px rgba(24,25,33,.10));
}
.hero .showcase-shell{margin-top:8px}
@media(max-width:1220px){
 .hero.section-wrap{width:calc(100% - 64px)}
 .hero-stage{min-height:420px}
 .hero-stage .hero-text h1{font-size:clamp(69px,7.1vw,94px)}
 .hero-stage .hero-text>p{font-size:17px;max-width:420px}
 .hero-device-scene{width:115%;margin-left:-5%}
}
@media(max-width:950px){
 .hero.section-wrap{padding-top:142px;padding-bottom:65px}
 .hero-stage{display:flex;flex-direction:column;align-items:stretch;gap:8px;min-height:0}
 .hero-stage .hero-text h1{font-size:clamp(72px,10.5vw,108px)}
 .hero-stage .hero-text>p{max-width:650px}
 .hero-device-scene{
   width:min(112%,760px);
   margin:-1px auto 0;
   aspect-ratio:940/519;
 }
 .hero .showcase-shell{margin-top:5px}
}
@media(max-width:700px){
 .hero.section-wrap{
   width:calc(100% - 36px);
   padding-top:129px;
   padding-bottom:57px;
 }
 .hero-stage{gap:5px}
 .hero-stage .hero-text h1{
   font-size:clamp(48px,13vw,77px);
   letter-spacing:-.081em;
 }
 .hero-stage .hero-text>p{
   max-width:370px;
   margin:24px 0 23px;
   font-size:16px;
 }
 .hero-stage .hero-note{margin-top:27px}
 .hero-device-scene{
   width:116%;
   margin-left:-8%;
   margin-top:5px;
   aspect-ratio:940/519;
 }
 .hero .showcase-shell{margin-top:4px}
}
@media(max-width:380px){
 .hero.section-wrap{width:calc(100% - 30px)}
 .hero-device-scene{width:120%;margin-left:-10%}
}
@media(prefers-reduced-motion:reduce){
 .hero-device-scene img{animation:none!important;transition:none!important}
}