/* ZemTools — premium homepage design preview.
   Scoped to the homepage only. No calculator logic, URLs, metadata or shared tool pages are changed. */

.home-page main{
  max-width:1160px!important;
}

.home-page .home-hero{
  isolation:isolate;
  position:relative!important;
  overflow:hidden!important;
  margin:8px 0 20px!important;
  padding:clamp(38px,5.2vw,60px) clamp(18px,4.5vw,62px) 46px!important;
  border:1px solid #d9e7fb!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 88% 12%,rgba(14,165,233,.15),transparent 28%),
    radial-gradient(circle at 8% 100%,rgba(37,99,235,.11),transparent 34%),
    linear-gradient(135deg,#eff6ff 0%,#ffffff 54%,#f0f9ff 100%)!important;
  box-shadow:0 22px 52px rgba(30,64,175,.085),inset 0 1px 0 rgba(255,255,255,.9)!important;
}

.home-page .home-hero::before{
  inset:0!important;
  left:auto!important;
  right:-90px!important;
  top:-120px!important;
  width:420px!important;
  height:420px!important;
  background:radial-gradient(circle,rgba(59,130,246,.12) 0%,rgba(59,130,246,0) 68%)!important;
  z-index:0!important;
}

.home-page .home-hero::after{
  content:"";
  position:absolute;
  right:7%;
  bottom:-110px;
  width:260px;
  height:260px;
  border:1px solid rgba(59,130,246,.12);
  border-radius:50%;
  box-shadow:0 0 0 28px rgba(59,130,246,.025),0 0 0 58px rgba(59,130,246,.018);
  pointer-events:none;
  z-index:0;
}

.home-page .home-hero>*{
  position:relative;
  z-index:1;
}

.home-page .home-hero .eyebrow{
  padding:7px 12px!important;
  border-color:#c9ddff!important;
  background:rgba(255,255,255,.82)!important;
  box-shadow:0 4px 12px rgba(37,99,235,.06);
  font-size:12px!important;
  letter-spacing:.25px!important;
}

.home-page .home-hero h1{
  max-width:840px!important;
  font-size:clamp(35px,5.2vw,54px)!important;
  line-height:1.08!important;
  letter-spacing:-.052em!important;
}

.home-page .home-hero h1::after{
  width:70px!important;
  height:4px!important;
  margin-top:20px!important;
  background:linear-gradient(90deg,#1d4ed8,#0ea5e9)!important;
}

.home-page .home-hero p{
  max-width:710px!important;
  font-size:17px!important;
  line-height:1.72!important;
}

.home-page .home-search{
  max-width:720px!important;
  margin-top:26px!important;
}

.home-page .home-search .search-field{
  height:64px!important;
}

.home-page .home-search .search-field input,
.home-page .home-search .search-field input[type="text"]{
  height:64px!important;
  min-height:64px!important;
  padding:14px 124px 14px 54px!important;
  border:1px solid #c7d8ef!important;
  border-radius:17px!important;
  background:#fff!important;
  box-shadow:0 12px 28px rgba(15,53,110,.10),inset 0 1px 0 #fff!important;
  font-size:16px!important;
}

.home-page .home-search .search-field input:focus{
  border-color:#3b82f6!important;
  box-shadow:0 0 0 4px rgba(59,130,246,.12),0 12px 28px rgba(15,53,110,.09)!important;
}

.home-page .home-search .search-field .search-icon{
  left:19px!important;
  top:32px!important;
}

.home-page .home-search .search-field .search-go{
  top:8px!important;
  right:8px!important;
  width:100px!important;
  min-width:100px!important;
  height:48px!important;
  min-height:48px!important;
  border-radius:13px!important;
  background:linear-gradient(135deg,#1d4ed8,#0284c7)!important;
  box-shadow:0 7px 16px rgba(37,99,235,.2)!important;
  font-size:13px!important;
}

.home-page .home-search .search-suggestions{
  border-color:#d8e4f2!important;
  border-radius:16px!important;
}

.home-page .quick-links{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:13px!important;
  margin-top:14px!important;
}

.home-page .quick-links a{
  min-height:64px;
  padding:12px 14px!important;
  gap:12px!important;
  border-radius:16px!important;
  background:#fff!important;
  font-size:13px!important;
  box-shadow:0 7px 20px rgba(15,23,42,.045)!important;
}

.home-page .quick-links a:hover{
  transform:translateY(-2px)!important;
  border-color:#b9d4f8!important;
  box-shadow:0 13px 28px rgba(37,99,235,.09)!important;
}

.home-page .quick-links .quick-icon{
  width:38px!important;
  height:38px!important;
  flex-basis:38px!important;
  border-radius:12px!important;
}

.home-page .home-section{
  margin-top:42px!important;
}

.home-page .home-section-head{
  margin-bottom:20px!important;
}

.home-page .home-section-head h2{
  font-size:25px!important;
  letter-spacing:-.04em!important;
}

.home-page .latest-grid{
  gap:16px!important;
}

.home-page .latest-card,
.home-page .category-card{
  border-radius:20px!important;
  box-shadow:0 8px 24px rgba(15,23,42,.05)!important;
}

.home-page .latest-card{
  padding:25px!important;
}

.home-page .latest-card h3{
  font-size:20px!important;
}

.home-page .latest-card:focus-within,
.home-page .category-card:focus-visible{
  outline:3px solid rgba(37,99,235,.22)!important;
  outline-offset:3px!important;
}

.home-page .category-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:15px!important;
}

.home-page .category-card{
  min-height:190px!important;
  padding:21px!important;
}

.home-page .category-icon{
  width:44px!important;
  height:44px!important;
  border-radius:13px!important;
}

.home-page .directory-banner{
  padding:18px 20px!important;
  border-radius:18px!important;
  background:linear-gradient(115deg,#f1f7ff 0%,#fff 72%)!important;
  border-color:#dce8f8!important;
}

.home-page .directory-banner a{
  min-height:44px!important;
  padding:11px 18px!important;
}

.home-page .future-panel{
  gap:14px!important;
  padding:22px!important;
  border-radius:20px!important;
  box-shadow:0 8px 24px rgba(15,23,42,.045)!important;
}

.home-page .future-chip{
  border-radius:15px!important;
  background:linear-gradient(180deg,#f8fbff,#f4f8fd)!important;
}

@media(max-width:900px){
  .home-page .quick-links{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .home-page .category-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:650px){
  .home-page main{
    padding:16px 14px 48px!important;
  }
  .home-page .home-hero{
    margin:4px 0 16px!important;
    padding:34px 17px 30px!important;
    border-radius:23px!important;
  }
  .home-page .home-hero::before{
    right:-170px!important;
    top:-150px!important;
    width:340px!important;
    height:340px!important;
  }
  .home-page .home-hero::after{
    right:-80px;
    bottom:-130px;
    width:220px;
    height:220px;
  }
  .home-page .home-hero h1{
    font-size:clamp(32px,8.5vw,38px)!important;
    line-height:1.1!important;
  }
  .home-page .home-hero p{
    font-size:15px!important;
    line-height:1.65!important;
  }
  .home-page .home-search{
    margin-top:22px!important;
  }
  .home-page .home-search .search-field,
  .home-page .home-search .search-field input,
  .home-page .home-search .search-field input[type="text"]{
    height:58px!important;
    min-height:58px!important;
  }
  .home-page .home-search .search-field input,
  .home-page .home-search .search-field input[type="text"]{
    padding:12px 15px 12px 47px!important;
    border-radius:15px!important;
    font-size:15px!important;
  }
  .home-page .home-search .search-field .search-icon{
    left:15px!important;
    top:29px!important;
  }
  .home-page .home-search .search-field .search-go{
    display:none!important;
  }
  .home-page .quick-links{
    display:flex!important;
    gap:10px!important;
    margin:7px -2px 28px!important;
  }
  .home-page .quick-links a{
    flex:0 0 auto!important;
    min-width:160px!important;
    min-height:62px!important;
    padding:10px 12px!important;
  }
  .home-page .home-section{
    margin-top:30px!important;
  }
  .home-page .home-section-head h2{
    font-size:22px!important;
  }
  .home-page .latest-card{
    padding:21px!important;
  }
  .home-page .category-grid{
    grid-template-columns:1fr!important;
  }
  .home-page .category-card{
    min-height:0!important;
  }
  .home-page .future-panel{
    padding:17px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .home-page .home-hero *,
  .home-page .quick-links a,
  .home-page .latest-card,
  .home-page .category-card{
    transition:none!important;
  }
}