:root{
    --sc-bg:#020d1e;
    --sc-card:#06203b;
    --sc-cyan:#2bd4ff;
    --sc-blue:#2682ff;
    --sc-text:#f4f8ff;
    --sc-muted:#a9bdd0;
    --sc-line:rgba(53,199,255,.2)
}
*{
    box-sizing:border-box
}
html{
    scroll-behavior:smooth
}
.smartcall-page{
    margin:0;
    background:var(--sc-bg);
    color:var(--sc-text);
    overflow-x:hidden
}
.sc-shell{
    width:min(1420px,calc(100% - 72px));
    margin:auto
}
.sc-kicker{
    color:#43d8ff;
    font-weight:800;
    font-size:12px;
    letter-spacing:.12em
}
.sc-hero{
    position:relative;
    min-height:760px;
    padding-top:86px;
    overflow:hidden;
    background:#031124
}
.sc-hero-bg{
    position:absolute;
    inset:0;
    background:url('assets/business/Futuristic-hero.png') center/cover no-repeat;
    filter:saturate(1.08) brightness(1.04)
}
.sc-hero-shade{
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,rgba(1,12,28,.78) 0%,rgba(1,14,31,.62) 42%,rgba(1,15,31,.18) 75%,rgba(1,12,26,.34)),linear-gradient(0deg,rgba(2,13,30,.72) 0%,transparent 32%)
}
.sc-hero-grid{
    position:relative;
    z-index:2;
    min-height:674px;
    display:grid;
    grid-template-columns:1.05fr .95fr;
    align-items:center;
    gap:70px
}
.sc-copy{
    max-width:700px
}
.sc-copy h1{
    font-size:clamp(48px,5vw,78px);
    line-height:1.06;
    margin:18px 0 22px;
    font-weight:800;
    letter-spacing:-.035em
}
.sc-copy h1 em{
    font-style:normal;
    color:#46cfff
}
.sc-copy>p{
    font-size:18px;
    line-height:1.9;
    color:#c1d1df;
    max-width:660px
}
.sc-actions{
    display:flex;
    gap:12px;
    margin-top:30px
}
.sc-actions .btn,.sc-secondary{
    min-height:54px;
    padding:0 24px;
    border-radius:13px;
    display:inline-flex;
    align-items:center;
    gap:18px;
    text-decoration:none;
    font-weight:800
}
.sc-secondary{
    border:1px solid rgba(69,200,255,.28);
    color:#eaf7ff;
    background:rgba(4,25,48,.62)
}
.sc-benefits{
    display:flex;
    gap:28px;
    margin-top:30px;
    color:#bcd0df;
    font-size:13px
}
.sc-benefits span{
    display:flex;
    gap:8px;
    align-items:center
}
.sc-benefits span::first-letter{
    color:#39d7ff
}
.sc-visual{
    min-height:520px;
    position:relative
}
.sc-elevator-card{
    position:absolute;
    right:5%;
    bottom:12%;
    width:min(390px,90%);
    padding:24px;
    border:1px solid rgba(60,211,255,.34);
    border-radius:22px;
    background:linear-gradient(145deg,rgba(4,35,65,.86),rgba(2,18,36,.92));
    box-shadow:0 30px 80px rgba(0,0,0,.4),0 0 45px rgba(26,179,255,.12);
    backdrop-filter:blur(15px)
}
.sc-elevator-card small{
    display:block;
    color:#56dbff;
    font-size:11px;
    letter-spacing:.14em
}
.sc-elevator-card strong{
    display:block;
    font-size:25px;
    margin:9px 0 20px
}
.pulse{
    position:absolute;
    width:9px;
    height:9px;
    border-radius:50%;
    background:#34e8a4;
    top:25px;
    left:24px;
    box-shadow:0 0 18px #34e8a4
}
.floor{
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-top:1px solid var(--sc-line);
    padding-top:17px;
    color:#a9bfd0
}
.floor b{
    font-size:38px;
    color:#fff
}
.sc-how,.sc-usecases,.sc-feature{
    padding:86px 0
}
.sc-heading{
    text-align:center;
    max-width:760px;
    margin:0 auto 38px
}
.sc-heading h2,.sc-feature h2,.sc-cta h2{
    font-size:clamp(30px,3vw,46px);
    line-height:1.2;
    margin:10px 0
}
.sc-heading p,.sc-feature p,.sc-cta p{
    color:var(--sc-muted);
    line-height:1.8
}
.sc-steps{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px
}
.sc-steps article{
    padding:28px;
    border:1px solid var(--sc-line);
    border-radius:18px;
    background:linear-gradient(180deg,rgba(8,40,70,.72),rgba(3,20,39,.9));
    min-height:200px
}
.sc-steps i{
    font-style:normal;
    color:#43d8ff;
    font-size:14px
}
.sc-steps b{
    display:block;
    font-size:22px;
    margin:28px 0 8px
}
.sc-steps p{
    color:#9eb5c8;
    line-height:1.7;
    margin:0
}
.sc-usecases{
    background:#031225
}
.sc-use-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px
}
.sc-use{
    height:420px;
    border-radius:20px;
    overflow:hidden;
    position:relative;
    background-size:cover;
    background-position:center;
    border:1px solid rgba(62,190,255,.18)
}
.sc-use::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,rgba(1,12,27,.98),rgba(1,13,29,.08) 70%)
}
.sc-use>div{
    position:absolute;
    z-index:2;
    bottom:0;
    padding:28px
}
.sc-use span{
    color:#3ed9ff;
    font-size:12px;
    font-weight:800
}
.sc-use h3{
    font-size:24px;
    margin:8px 0
}
.sc-use p{
    color:#b6c8d7;
    line-height:1.65;
    margin:0
}
.sc-hotel{
    background-image:url('assets/business/Luxury-Lobby.png')
}
.sc-hospital{
    background-image:url('assets/business/Smart-Hospital.png')
}
.sc-building{
    background-image:url('assets/business/Nightscape.png')
}
.sc-feature-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center
}
.sc-feature-art{
    height:460px;
    border-radius:24px;
    background:linear-gradient(90deg,rgba(1,15,31,.25),rgba(1,15,31,.02)),url('assets/elevator-city.webp') center/cover no-repeat;
    border:1px solid var(--sc-line)
}
.sc-mini-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:28px
}
.sc-mini-grid span{
    padding:17px;
    border-radius:13px;
    border:1px solid var(--sc-line);
    background:rgba(5,30,55,.65)
}
.sc-mini-grid b{
    display:block;
    color:#3bd7ff;
    margin-bottom:5px
}
.sc-mini-grid small{
    font-size:13px;
    color:#d3e0ea
}
.sc-cta{
    padding:20px 0 80px
}
.sc-cta-box{
    min-height:180px;
    border-radius:22px;
    border:1px solid rgba(54,206,255,.28);
    background:radial-gradient(circle at 80% 20%,rgba(33,153,255,.18),transparent 35%),linear-gradient(90deg,#06213d,#03162b);
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:34px 42px;
    gap:30px
}
.sc-cta-box p{
    margin:0
}
.sc-cta-box .btn{
    min-width:190px;
    justify-content:center
}
.reveal{
    opacity:1;
    transform:none
}
@media(max-width:900px){
    .sc-shell{
        width:min(100% - 28px,760px)
    }
    .sc-hero-grid,.sc-feature-grid{
        grid-template-columns:1fr
    }
    .sc-hero-grid{
        padding:80px 0 50px
    }
    .sc-visual{
        min-height:300px
    }
    .sc-steps,.sc-use-grid{
        grid-template-columns:1fr
    }
    .sc-use{
        height:340px
    }
    .sc-benefits{
        flex-wrap:wrap
    }
    .sc-cta-box{
        flex-direction:column;
        align-items:flex-start
    }
    .sc-copy h1{
        font-size:48px
    }
}
@media(max-width:560px){
    .sc-copy h1{
        font-size:39px
    }
    .sc-copy>p{
        font-size:15px
    }
    .sc-actions{
        flex-direction:column
    }
    .sc-actions>*{
        justify-content:center
    }
    .sc-mini-grid{
        grid-template-columns:1fr
    }
    .sc-hero{
        padding-top:72px
    }
}

/* STEP 3 — HERO GLASS CENTER: keep person + elevator visible */
.sc-hero-bg{
    filter:saturate(1.08) brightness(1.16) contrast(1.01);
}
.sc-hero-shade{
    background:
      linear-gradient(90deg,rgba(1,12,28,.22) 0%,rgba(1,14,31,.13) 28%,rgba(1,15,31,.10) 50%,rgba(1,14,31,.10) 72%,rgba(1,12,26,.18) 100%),
      linear-gradient(0deg,rgba(2,13,30,.34) 0%,rgba(2,13,30,.04) 44%,rgba(2,13,30,.08) 100%);
}
.sc-hero-grid{
    display:flex;
    justify-content:center;
    align-items:center;
    min-height:674px;
    padding:52px 0 44px;
}
.sc-copy{
    width:min(690px,calc(100% - 40px));
    max-width:690px;
    padding:38px 44px 34px;
    text-align:center;
    border:1px solid rgba(83,207,255,.30);
    border-radius:24px;
    background:linear-gradient(145deg,rgba(3,24,46,.66),rgba(2,16,33,.48));
    box-shadow:0 26px 75px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.06),0 0 42px rgba(32,175,255,.08);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}
.sc-copy h1{
    font-size:clamp(45px,4.5vw,68px);
    margin:15px 0 18px;
}
.sc-copy>p{
    max-width:590px;
    margin-inline:auto;
    font-size:17px;
    line-height:1.85;
}
.sc-actions{
    justify-content:center;
    margin-top:25px;
}
.sc-benefits{
    justify-content:center;
    flex-wrap:wrap;
    gap:14px 24px;
    margin-top:24px;
}
.sc-visual{display:none !important;}

@media(max-width:900px){
  .sc-hero-grid{padding:48px 0 40px;}
  .sc-copy{padding:32px 24px 28px;}
}
@media(max-width:560px){
  .sc-copy{width:calc(100% - 10px);padding:27px 18px 24px;border-radius:19px;}
  .sc-copy h1{font-size:39px;}
}

/* STEP 4 — SMART CALL HERO MOTION ONLY */
@keyframes scGlassEnter{
  from{opacity:0;transform:translateY(22px) scale(.985);filter:blur(2px)}
  to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}
}
@keyframes scLineEnter{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes scSignalTravel{
  0%{inset-inline-start:5%;opacity:0;transform:translateY(-50%) scale(.7)}
  12%{opacity:.95}
  82%{opacity:.95}
  100%{inset-inline-start:91%;opacity:0;transform:translateY(-50%) scale(.7)}
}
.sc-copy{
  position:relative;
  overflow:hidden;
  animation:scGlassEnter .78s cubic-bezier(.2,.72,.25,1) both;
}
.sc-copy .sc-kicker{animation:scLineEnter .55s .16s ease-out both;}
.sc-copy h1{animation:scLineEnter .62s .24s ease-out both;}
.sc-copy h1 em{display:inline-block;animation:scLineEnter .62s .38s ease-out both;}
.sc-copy>p{animation:scLineEnter .55s .48s ease-out both;}
.sc-actions{animation:scLineEnter .55s .58s ease-out both;}
.sc-benefits span{opacity:0;animation:scLineEnter .48s ease-out both;}
.sc-benefits span:nth-child(1){animation-delay:.68s;}
.sc-benefits span:nth-child(2){animation-delay:.78s;}
.sc-benefits span:nth-child(3){animation-delay:.88s;}
.sc-copy::after{
  content:"";
  position:absolute;
  top:8px;
  inset-inline-start:5%;
  width:8px;
  height:8px;
  border-radius:50%;
  pointer-events:none;
  background:#5eeaff;
  box-shadow:0 0 8px #42dcff,0 0 18px rgba(66,220,255,.85),0 0 32px rgba(66,220,255,.42);
  animation:scSignalTravel 5.4s 1.1s ease-in-out infinite;
}
.sc-actions .btn-primary{
  transition:transform .22s ease,box-shadow .22s ease,filter .22s ease;
}
.sc-actions .btn-primary:hover{
  transform:translateY(-2px);
  filter:brightness(1.06);
  box-shadow:0 14px 34px rgba(26,132,255,.36),0 0 24px rgba(62,213,255,.18);
}
@media(prefers-reduced-motion:reduce){
  .sc-copy,.sc-copy .sc-kicker,.sc-copy h1,.sc-copy h1 em,.sc-copy>p,.sc-actions,.sc-benefits span,.sc-copy::after{
    animation:none !important;
    opacity:1 !important;
    transform:none !important;
  }
}

/* STEP 6 — USE CASE IMAGE CARDS: premium edge reveal + hover lift */
.sc-use-grid{
  gap:18px;
  overflow:visible;
}
.sc-use{
  isolation:isolate;
  overflow:visible;
  border:1px solid rgba(75,210,255,.34);
  box-shadow:0 18px 42px rgba(0,0,0,.24),0 0 0 1px rgba(255,255,255,.018) inset;
  transition:transform .34s cubic-bezier(.2,.72,.25,1),border-color .34s ease,box-shadow .34s ease,filter .34s ease;
  will-change:transform;
}
.sc-use::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  border-radius:inherit;
  background:inherit;
  background-size:cover;
  background-position:center;
  transform:scale(1);
  transition:transform .48s cubic-bezier(.2,.72,.25,1),filter .4s ease;
  clip-path:inset(0 round 20px);
  pointer-events:none;
}
.sc-use::after{
  z-index:1;
  border-radius:inherit;
  background:linear-gradient(0deg,rgba(1,12,27,.94) 0%,rgba(1,13,29,.48) 36%,rgba(1,13,29,.06) 72%);
  transition:background .34s ease,box-shadow .34s ease;
  pointer-events:none;
}
.sc-use>div{
  transition:transform .34s cubic-bezier(.2,.72,.25,1);
}
.sc-use:hover{
  z-index:5;
  transform:translateY(-9px) scale(1.018);
  border-color:rgba(73,220,255,.78);
  box-shadow:0 28px 58px rgba(0,0,0,.34),0 0 0 1px rgba(72,216,255,.16),0 0 34px rgba(35,190,255,.18);
}
.sc-use:hover::before{
  transform:scale(1.075);
  filter:saturate(1.08) brightness(1.08);
}
.sc-use:hover::after{
  background:linear-gradient(0deg,rgba(1,12,27,.91) 0%,rgba(1,13,29,.34) 38%,rgba(1,13,29,.025) 74%);
  box-shadow:inset 0 0 0 1px rgba(110,229,255,.12);
}
.sc-use:hover>div{
  transform:translateY(-5px);
}
.sc-use h3,.sc-use p,.sc-use span{
  position:relative;
  z-index:3;
}

@media(max-width:900px){
  .sc-use{overflow:hidden;}
  .sc-use:hover{transform:translateY(-5px);}
}
@media(hover:none){
  .sc-use:hover{transform:none;box-shadow:0 18px 42px rgba(0,0,0,.24);}
  .sc-use:hover::before{transform:none;filter:none;}
  .sc-use:hover>div{transform:none;}
}
@media(prefers-reduced-motion:reduce){
  .sc-use,.sc-use::before,.sc-use::after,.sc-use>div{transition:none !important;}
  .sc-use:hover{transform:none;}
  .sc-use:hover::before{transform:none;}
}

/* STEP 7 — FINAL INTEGRATION VISUAL: brighter image + subtle elevator motion illusion */
.sc-feature-art{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  /* Keep the same image, but reveal more of it by reducing the dark layer. */
  background-image:
    linear-gradient(90deg,rgba(1,15,31,.09),rgba(1,15,31,0)),
    url('assets/elevator-city.webp');
  background-size:auto,cover;
  background-repeat:no-repeat;
  background-position:center,center 52%;
  box-shadow:inset 0 0 0 1px rgba(67,210,255,.04);
  animation:scElevatorTravel 8s cubic-bezier(.45,.05,.55,.95) infinite alternate;
}
.sc-feature-art::before{
  content:"";
  position:absolute;
  z-index:1;
  top:-34%;
  left:14%;
  right:14%;
  height:30%;
  pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(76,216,255,.05) 35%,rgba(86,224,255,.24) 52%,rgba(76,216,255,.05) 68%,transparent);
  filter:blur(.2px);
  opacity:.78;
  animation:scElevatorLight 5.6s ease-in-out infinite;
}
.sc-feature-art::after{
  content:"";
  position:absolute;
  z-index:2;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:
    linear-gradient(90deg,transparent 16%,rgba(65,213,255,.09) 16.25%,transparent 16.7%),
    linear-gradient(90deg,transparent 82%,rgba(65,213,255,.08) 82.25%,transparent 82.7%);
  opacity:.7;
  animation:scElevatorEdgePulse 3.8s ease-in-out infinite;
}
@keyframes scElevatorTravel{
  0%{background-position:center,center 56%;filter:brightness(1.06) saturate(1.04)}
  48%{background-position:center,center 49%;filter:brightness(1.11) saturate(1.07)}
  58%{background-position:center,center 49%;filter:brightness(1.12) saturate(1.08)}
  100%{background-position:center,center 43%;filter:brightness(1.07) saturate(1.05)}
}
@keyframes scElevatorLight{
  0%{top:-34%;opacity:0}
  12%{opacity:.7}
  50%{opacity:.9}
  88%{opacity:.7}
  100%{top:104%;opacity:0}
}
@keyframes scElevatorEdgePulse{
  0%,100%{opacity:.35}
  50%{opacity:.82}
}
@media(hover:hover) and (pointer:fine){
  .sc-feature-art:hover{
    box-shadow:inset 0 0 0 1px rgba(77,221,255,.24),0 0 28px rgba(42,193,255,.10);
  }
}
@media(prefers-reduced-motion:reduce){
  .sc-feature-art,.sc-feature-art::before,.sc-feature-art::after{
    animation:none !important;
  }
  .sc-feature-art{
    background-position:center,center 50%;
    filter:brightness(1.1) saturate(1.05);
  }
}




/* STEP 10 — SECTION 2 VISUAL POLISH ONLY
   Scoped strictly to .sc-how so later finished sections stay untouched. */
.sc-how{
  position:relative;
  padding:78px 0 92px;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 16%,rgba(36,157,255,.075),transparent 34%),
    linear-gradient(180deg,#020d1e 0%,#031226 100%);
}
.sc-how::before{
  content:"";
  position:absolute;
  width:560px;
  height:560px;
  left:50%;
  top:34%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(43,212,255,.055),transparent 68%);
  pointer-events:none;
}
.sc-how .sc-shell{position:relative;z-index:1;}
.sc-how .sc-heading{margin-bottom:48px;}
.sc-how .sc-heading .sc-kicker{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:7px 13px;
  border:1px solid rgba(66,213,255,.16);
  border-radius:999px;
  background:rgba(6,35,62,.48);
}
.sc-how .sc-heading .sc-kicker::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:#45e5ff;
  box-shadow:0 0 12px rgba(69,229,255,.8);
}
.sc-how .sc-heading h2{margin:15px 0 10px;}
.sc-how .sc-heading p{margin:0;}

.sc-how .sc-steps{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.sc-how .sc-steps::before{
  content:"";
  position:absolute;
  top:48px;
  left:12%;
  right:12%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(50,203,255,.48) 15%,rgba(50,203,255,.48) 85%,transparent);
  box-shadow:0 0 14px rgba(38,183,255,.12);
  z-index:0;
}
.sc-how .sc-steps article{
  position:relative;
  z-index:1;
  min-height:224px;
  padding:34px 30px 30px;
  border:1px solid rgba(57,196,255,.20);
  border-radius:20px;
  background:
    radial-gradient(circle at 88% 0%,rgba(38,139,255,.11),transparent 35%),
    linear-gradient(155deg,rgba(7,39,69,.88),rgba(3,20,39,.94));
  box-shadow:0 18px 45px rgba(0,0,0,.16),inset 0 1px rgba(255,255,255,.025);
  overflow:hidden;
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease,background .28s ease;
}
.sc-how .sc-steps article::before{
  content:"";
  position:absolute;
  top:-38px;
  inset-inline-end:-38px;
  width:116px;
  height:116px;
  border-radius:50%;
  border:1px solid rgba(63,216,255,.11);
  box-shadow:0 0 0 18px rgba(63,216,255,.018),0 0 0 36px rgba(63,216,255,.012);
  pointer-events:none;
}
.sc-how .sc-steps article::after{
  content:"";
  position:absolute;
  inset-inline-start:0;
  bottom:0;
  width:0;
  height:2px;
  background:linear-gradient(90deg,#25baff,#51e3ff);
  box-shadow:0 0 16px rgba(52,207,255,.55);
  transition:width .35s ease;
}
.sc-how .sc-steps article:hover{
  transform:translateY(-6px);
  border-color:rgba(67,216,255,.42);
  box-shadow:0 24px 58px rgba(0,0,0,.24),0 0 30px rgba(33,169,255,.075),inset 0 1px rgba(255,255,255,.04);
}
.sc-how .sc-steps article:hover::after{width:100%;}
.sc-how .sc-steps i{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:54px;
  height:54px;
  margin-bottom:24px;
  border:1px solid rgba(58,210,255,.34);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(12,67,105,.82),rgba(4,34,62,.92));
  color:#58ddff;
  font-size:14px;
  font-weight:800;
  font-style:normal;
  box-shadow:0 10px 26px rgba(0,0,0,.18),0 0 18px rgba(36,190,255,.07);
}
.sc-how .sc-steps i::after{
  content:"";
  position:absolute;
  width:7px;
  height:7px;
  border-radius:50%;
  inset-inline-end:-4px;
  top:8px;
  background:#45e9b1;
  box-shadow:0 0 10px rgba(69,233,177,.8);
}
.sc-how .sc-steps b{
  display:block;
  margin:0 0 10px;
  font-size:23px;
  line-height:1.35;
  color:#f4f8ff;
}
.sc-how .sc-steps p{
  max-width:92%;
  margin:0;
  color:#a9bfd1;
  font-size:15px;
  line-height:1.8;
}
@media(max-width:900px){
  .sc-how{padding:66px 0 74px;}
  .sc-how .sc-heading{margin-bottom:34px;}
  .sc-how .sc-steps{grid-template-columns:1fr;gap:14px;}
  .sc-how .sc-steps::before{display:none;}
  .sc-how .sc-steps article{min-height:0;padding:26px 24px;}
  .sc-how .sc-steps i{width:48px;height:48px;margin-bottom:18px;}
  .sc-how .sc-steps p{max-width:none;}
}

/* STEP 9 — Restore Section 2 scroll reveal animation only */
.sc-how.sc-how-motion-ready .sc-steps article{
  opacity:0;
  transform:translateY(22px);
}
.sc-how.sc-how-motion-ready.sc-how-in .sc-steps article{
  animation:scHowStepReveal .62s cubic-bezier(.2,.72,.25,1) both;
}
.sc-how.sc-how-motion-ready.sc-how-in .sc-steps article:nth-child(1){animation-delay:.06s;}
.sc-how.sc-how-motion-ready.sc-how-in .sc-steps article:nth-child(2){animation-delay:.18s;}
.sc-how.sc-how-motion-ready.sc-how-in .sc-steps article:nth-child(3){animation-delay:.30s;}

@keyframes scHowStepReveal{
  from{opacity:0;transform:translateY(22px)}
  to{opacity:1;transform:translateY(0)}
}

@media (prefers-reduced-motion:reduce){
  .sc-how.sc-how-motion-ready .sc-steps article{
    opacity:1;
    transform:none;
    animation:none !important;
  }
}

/* SMART CALL — HEADER ALIGNMENT FIX ONLY
   Scoped to this page. Footer and page sections are intentionally untouched. */
.smartcall-page .site-header{
  width:100% !important;
  max-width:none !important;
  min-height:108px !important;
  padding:0 72px !important;
  display:flex !important;
  align-items:center !important;
  gap:30px !important;
  box-sizing:border-box !important;
}

.smartcall-page .site-header .brand.official-brand{
  flex:0 0 270px !important;
  width:270px !important;
  min-width:270px !important;
  max-width:270px !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
}

.smartcall-page .site-header .brand.official-brand img{
  display:block !important;
  width:100% !important;
  max-width:270px !important;
  height:auto !important;
  object-fit:contain !important;
}

.smartcall-page .site-header .nav{
  flex:1 1 auto !important;
  min-width:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:30px !important;
  margin:0 !important;
  padding:0 !important;
  white-space:nowrap !important;
}

.smartcall-page .site-header .nav a{
  flex:0 0 auto !important;
  margin:0 !important;
  white-space:nowrap !important;
}

.smartcall-page .site-header .header-actions{
  flex:0 0 auto !important;
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  margin:0 !important;
  white-space:nowrap !important;
}

.smartcall-page .site-header .lang-switch{
  flex:0 0 auto !important;
  min-width:116px !important;
  margin:0 !important;
}

@media (max-width:1500px){
  .smartcall-page .site-header{padding-inline:42px !important;gap:22px !important;}
  .smartcall-page .site-header .brand.official-brand{flex-basis:235px !important;width:235px !important;min-width:235px !important;max-width:235px !important;}
  .smartcall-page .site-header .brand.official-brand img{max-width:235px !important;}
  .smartcall-page .site-header .nav{gap:20px !important;}
}

@media (max-width:1180px){
  .smartcall-page .site-header{padding-inline:24px !important;}
  .smartcall-page .site-header .brand.official-brand{flex-basis:210px !important;width:210px !important;min-width:210px !important;max-width:210px !important;}
  .smartcall-page .site-header .brand.official-brand img{max-width:210px !important;}
  .smartcall-page .site-header .nav{gap:14px !important;}
}

/* SMART CALL — ENGLISH HEADER FIT FIX ONLY
   LTR only. Footer and all Smart Call content sections remain untouched. */
html[lang="en"] .smartcall-page .site-header{
  padding-inline:48px !important;
  gap:22px !important;
}
html[lang="en"] .smartcall-page .site-header .brand.official-brand{
  flex:0 0 300px !important;
  width:300px !important;
  min-width:300px !important;
  max-width:300px !important;
}
html[lang="en"] .smartcall-page .site-header .brand.official-brand img{
  width:300px !important;
  max-width:300px !important;
}
html[lang="en"] .smartcall-page .site-header .nav{
  gap:25px !important;
  justify-content:center !important;
}
html[lang="en"] .smartcall-page .site-header .nav a{
  font-size:16px !important;
  line-height:1.2 !important;
}
html[lang="en"] .smartcall-page .site-header .header-actions{
  gap:14px !important;
}
html[lang="en"] .smartcall-page .site-header .lang-switch{
  min-width:128px !important;
  width:128px !important;
}
html[lang="en"] .smartcall-page .site-header .header-actions .btn-sm{
  min-width:214px !important;
  padding-inline:22px !important;
  justify-content:center !important;
}

@media (max-width:1700px){
  html[lang="en"] .smartcall-page .site-header{padding-inline:34px !important;gap:18px !important;}
  html[lang="en"] .smartcall-page .site-header .brand.official-brand{flex-basis:270px !important;width:270px !important;min-width:270px !important;max-width:270px !important;}
  html[lang="en"] .smartcall-page .site-header .brand.official-brand img{width:270px !important;max-width:270px !important;}
  html[lang="en"] .smartcall-page .site-header .nav{gap:20px !important;}
  html[lang="en"] .smartcall-page .site-header .nav a{font-size:15px !important;}
  html[lang="en"] .smartcall-page .site-header .lang-switch{min-width:118px !important;width:118px !important;}
  html[lang="en"] .smartcall-page .site-header .header-actions .btn-sm{min-width:190px !important;padding-inline:18px !important;}
}

@media (max-width:1450px){
  html[lang="en"] .smartcall-page .site-header{padding-inline:24px !important;gap:14px !important;}
  html[lang="en"] .smartcall-page .site-header .brand.official-brand{flex-basis:225px !important;width:225px !important;min-width:225px !important;max-width:225px !important;}
  html[lang="en"] .smartcall-page .site-header .brand.official-brand img{width:225px !important;max-width:225px !important;}
  html[lang="en"] .smartcall-page .site-header .nav{gap:14px !important;}
  html[lang="en"] .smartcall-page .site-header .nav a{font-size:14px !important;}
  html[lang="en"] .smartcall-page .site-header .lang-switch{min-width:104px !important;width:104px !important;}
  html[lang="en"] .smartcall-page .site-header .header-actions .btn-sm{min-width:170px !important;padding-inline:14px !important;}
}