/* StudyFlow v33 — Start-point section only */
.sf-guide-hub{
  padding:28px 0 84px !important;
  background:#fff !important;
}
.sf-guide-hub .container{
  width:min(1540px,calc(100% - 34px)) !important;
  max-width:none !important;
}
.sf-guide-panel{
  position:relative;
  overflow:hidden;
  padding:48px;
  border:1px solid #dce8e1;
  border-radius:32px;
  background:
    radial-gradient(circle at 94% 5%,rgba(116,151,133,.16),transparent 24%),
    linear-gradient(145deg,#f4f8f6 0%,#edf5f1 100%);
  box-shadow:0 24px 65px rgba(7,31,22,.07);
}
.sf-guide-panel:before{
  content:"";
  position:absolute;
  width:190px;
  height:190px;
  right:-90px;
  bottom:-95px;
  border-radius:50%;
  border:1px solid rgba(29,91,64,.11);
  pointer-events:none;
}
.sf-guide-hub-head{
  position:relative;
  z-index:1;
  display:grid !important;
  grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr) !important;
  gap:54px !important;
  align-items:end !important;
  max-width:none !important;
  margin:0 0 34px !important;
  padding-bottom:32px;
  border-bottom:1px solid #cfddd5;
}
.sf-guide-heading-copy{min-width:0}
.sf-guide-hub .sf-kicker{
  display:inline-flex !important;
  width:auto !important;
  max-width:max-content !important;
  align-items:center;
  gap:9px;
  margin:0 0 18px !important;
  padding:8px 13px !important;
  border:1px solid #bfd2c7 !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.76) !important;
  color:#15553b !important;
  font-size:.68rem !important;
  line-height:1 !important;
  letter-spacing:.13em !important;
  font-weight:900 !important;
}
.sf-guide-hub .sf-kicker:before{
  content:"";
  width:17px;
  height:2px;
  border-radius:999px;
  background:#1d6b4a;
}
.sf-guide-hub-head h2{
  max-width:720px !important;
  margin:0 !important;
  color:#082f20 !important;
  font-size:clamp(2.65rem,4vw,4.5rem) !important;
  line-height:.96 !important;
  letter-spacing:-.055em !important;
  text-wrap:balance;
}
.sf-guide-hub-head>p{
  max-width:410px !important;
  margin:0 0 5px !important;
  color:#5f7168 !important;
  font-size:1.03rem !important;
  line-height:1.68 !important;
}
.sf-guide-hub-grid{
  position:relative;
  z-index:1;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important;
  margin:0 !important;
  border:0 !important;
}
.sf-guide-card{
  position:relative;
  display:flex !important;
  flex-direction:column;
  min-height:278px;
  padding:26px 26px 24px !important;
  overflow:hidden;
  border:1px solid #d7e3dc !important;
  border-radius:24px !important;
  background:rgba(255,255,255,.94) !important;
  color:#0a3223 !important;
  text-decoration:none !important;
  box-shadow:0 12px 34px rgba(10,49,34,.055) !important;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background .22s ease !important;
}
.sf-guide-card:after{
  content:"";
  position:absolute;
  inset:auto -42px -62px auto;
  width:145px;
  height:145px;
  border-radius:50%;
  background:#eef5f1;
  transition:transform .28s ease,background .28s ease;
  pointer-events:none;
}
.sf-guide-card:hover{
  transform:translateY(-6px) !important;
  border-color:#afcbbb !important;
  background:#fff !important;
  box-shadow:0 22px 48px rgba(10,49,34,.11) !important;
}
.sf-guide-card:hover:after{
  transform:scale(1.18);
  background:#e4f0e9;
}
.sf-guide-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:30px;
}
.sf-guide-number{
  display:grid !important;
  place-items:center;
  width:42px !important;
  height:42px !important;
  flex:0 0 auto;
  border:1px solid #d8e5dd;
  border-radius:50% !important;
  background:#f2f7f4 !important;
  color:#15553b !important;
  font-size:.72rem !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
}
.sf-guide-icon{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  border-radius:15px;
  background:#0b4a33;
  color:#fff;
  box-shadow:0 8px 18px rgba(11,74,51,.15);
}
.sf-guide-icon svg{
  width:24px;
  height:24px;
  stroke:currentColor;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.sf-guide-card h3{
  position:relative;
  z-index:1;
  margin:0 0 11px !important;
  color:#082f20 !important;
  font-size:1.42rem !important;
  line-height:1.12 !important;
  letter-spacing:-.035em !important;
}
.sf-guide-card p{
  position:relative;
  z-index:1;
  min-height:0 !important;
  margin:0 !important;
  max-width:330px;
  color:#63746c !important;
  font-size:.96rem !important;
  line-height:1.58 !important;
}
.sf-guide-card-link{
  position:relative;
  z-index:1;
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-top:auto !important;
  padding-top:24px;
  color:#0c563b !important;
  font-size:.85rem !important;
  font-weight:900 !important;
}
.sf-guide-card-link span{
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  flex:0 0 auto;
  border-radius:50%;
  background:#edf5f1;
  font-size:1rem;
  transition:transform .2s ease,background .2s ease;
}
.sf-guide-card:hover .sf-guide-card-link span{
  transform:translateX(4px);
  background:#dcece4;
}

@media(max-width:980px){
  .sf-guide-hub{padding:24px 0 72px !important}
  .sf-guide-panel{padding:36px}
  .sf-guide-hub-head{
    grid-template-columns:1fr !important;
    gap:18px !important;
    align-items:start !important;
  }
  .sf-guide-hub-head>p{max-width:650px !important}
  .sf-guide-hub-grid{grid-template-columns:1fr !important}
  .sf-guide-card{min-height:0}
  .sf-guide-card p{max-width:680px}
}

@media(max-width:640px){
  .sf-guide-hub{padding:18px 0 58px !important}
  .sf-guide-hub .container{width:min(100% - 28px,1540px) !important}
  .sf-guide-panel{
    padding:24px 18px 18px;
    border-radius:24px;
  }
  .sf-guide-hub-head{
    margin-bottom:22px !important;
    padding-bottom:22px;
  }
  .sf-guide-hub .sf-kicker{
    margin-bottom:14px !important;
    padding:7px 11px !important;
    font-size:.62rem !important;
  }
  .sf-guide-hub-head h2{
    font-size:clamp(2.25rem,10.5vw,3.3rem) !important;
  }
  .sf-guide-hub-head>p{
    font-size:.94rem !important;
    line-height:1.58 !important;
  }
  .sf-guide-hub-grid{gap:12px !important}
  .sf-guide-card{
    padding:21px 20px 19px !important;
    border-radius:20px !important;
  }
  .sf-guide-card-top{margin-bottom:20px}
  .sf-guide-number{width:38px !important;height:38px !important}
  .sf-guide-icon{width:43px;height:43px;border-radius:13px}
  .sf-guide-card h3{font-size:1.25rem !important}
  .sf-guide-card p{font-size:.91rem !important}
  .sf-guide-card-link{padding-top:20px}
}

html[dir="rtl"] .sf-guide-card-link span{transform:scaleX(-1)}
html[dir="rtl"] .sf-guide-card:hover .sf-guide-card-link span{transform:scaleX(-1) translateX(4px)}


/* v34: align section width with hero and tighten the transition between sections */
.sf-hero-v23{padding-bottom:24px !important;}
.sf-hero-v23 + .sf-guide-hub{padding-top:24px !important;}
@media(max-width:640px){
  .sf-hero-v23{padding-bottom:24px !important;}
  .sf-hero-v23 + .sf-guide-hub{padding-top:16px !important;}
}
