@font-face {
  font-family: "Source Han Serif CN";
  src: url("./assets/fonts/SourceHanSerifCN-VF.otf.woff2") format("woff2");
  font-style: normal;
  font-weight: 250 900;
  font-display: swap;
}

html { font-size: 10px; scroll-behavior: smooth; scroll-padding-top: 8rem; }
body, button, .font-kalice, .button { font-family: "Source Han Serif CN", "Songti SC", serif; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
img { display: block; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid #3a96ec; outline-offset: 4px; }
.skip-link { position: fixed; z-index: 10001; top: -7rem; left: 2rem; padding: 1rem 1.5rem; color: white; background: var(--blue--blue); }
.skip-link:focus { top: 1rem; }

.hipp-site-header { font-family: "Source Han Serif CN", "Songti SC", serif; }
.nav_brand { width: max-content; font-size: 2.3rem; font-weight: 700; letter-spacing: -.06em; }
.nav_button { display: none; color: var(--blue--blue); border: 0; background: transparent; }
.nav_menu-items { display: none; }
.nav_menu-items.is-open { display: flex; }
.nav_menu-items a { color: var(--light-blue--light-blue); font-size: 2.8rem; }
.nav_menu-items a:hover { color: white; }
.nav_button-base { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 4rem; height: 4rem; }

.section_hp-hero > .padding-global { width: 100%; }
.hero-screen img, .hero-screen video { display: block; width: 100%; height: 100%; object-fit: cover; }
.hero-screen .hero-demo-still { display: none; }
.point-icon { width: 2.8rem; height: 2.8rem; }
.local-mark { color: var(--blue--blue); font-size: 2rem; font-weight: 700; letter-spacing: -.05em; }
.grove-path { display: grid; grid-template-columns: minmax(25rem, .8fr) minmax(0, 1.35fr); gap: clamp(4rem, 7vw, 10rem); padding: 9.6rem 0; }
.grove-path-intro { display: flex; flex-direction: column; align-items: flex-start; gap: 2.4rem; max-width: 40rem; }
.grove-path-intro h2 { margin: 0; }
.grove-path-intro > p:last-child { max-width: 32rem; }
.grove-path-list { list-style: none; width: 100%; margin: 0; padding: 0; border-top: 1px solid var(--blue--blue-10); }
.grove-path-step { display: grid; grid-template-columns: 2.8rem minmax(0, 1fr) 2rem; gap: 2.4rem; align-items: start; padding: 2.4rem 0 2.8rem; border-bottom: 1px solid var(--blue--blue-10); color: var(--blue--blue); }
.grove-path-copy { display: flex; flex-direction: column; align-items: flex-start; gap: .8rem; }
.grove-path-number, .grove-path-label { font-size: 1.2rem; color: var(--blue--blue-50); }
.grove-path-number { padding-top: .2rem; }
.grove-path-copy strong { font-size: 2.4rem; font-weight: 400; line-height: 1.4; }
.grove-path-description { max-width: 57rem; font-size: 1.5rem; line-height: 1.75; color: var(--blue--blue-70); }
.grove-path-arrow { font-size: 2.2rem; line-height: 1; transition: transform .25s ease; }
.grove-path-step:hover .grove-path-arrow, .grove-path-step:focus-visible .grove-path-arrow { transform: translate(.3rem, -.3rem); }

.tab_link { appearance: none; border-top: 0; border-left: 0; border-right: 0; font: inherit; cursor: pointer; }
.tab_item:not(.w--tab-active) { display: none; }
.tabs_card { gap: 0; justify-content: flex-start; min-height: 0; }
.tabs_card-illu { order: -1; }
.tabs_card-head, .tabs_card-foot { display: none; }
.tabs_card-illu-image { aspect-ratio: 16 / 10; object-fit: cover; }
.tabs_side-link { display: block; appearance: none; pointer-events: auto; border-top: 0; border-left: 0; border-right: 0; background: transparent; text-align: left; font: inherit; cursor: pointer; transition: color .25s ease; }
.tabs_side-link:hover { color: var(--brown--brown); }
.tabs_side-link::after { content: ""; position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .35s ease; }
.tabs_side-link.w--current::after { transform: scaleX(1); }
.tabs_side-copy { display: none; margin-top: 1.2rem; white-space: normal; }
.tabs_side-link.w--current .tabs_side-copy { display: block; }
.tabs_side-copy-title { display: block; color: var(--brown--brown); font-size: 1.7rem; line-height: 1.4; }
.tabs_side-copy-description { display: block; margin-top: .8rem; color: var(--brown--brown-70); font-size: 1.4rem; line-height: 1.6; }

.grove-feature-list { display: grid; grid-template-columns: 1fr 1fr; width: 100%; border-top: 1px solid #dbe4f833; }
.grove-feature-list > div { display: flex; flex-direction: column; gap: .8rem; padding: 2.8rem 2rem; border-bottom: 1px solid #dbe4f833; }
.grove-feature-list > div:nth-child(odd) { border-right: 1px solid #dbe4f833; }
.grove-feature-list strong { color: var(--light-blue--light-blue); font-size: 2rem; font-weight: 500; }
.grove-feature-list span { color: var(--light-blue--light-blue-70); font-size: 1.4rem; }
.hp-devices_browser { height: auto; aspect-ratio: 16 / 10; border: 1px solid var(--blue--blue-10); border-radius: 1rem; box-shadow: 0 22px 46px #0b214b1a; }
.hipp-site-footer { font-family: "Source Han Serif CN", "Songti SC", serif; }
.grove-footer-logo { color: var(--blue--blue); font-size: 3rem; font-weight: 700; letter-spacing: -.06em; }

@media screen and (max-width: 1496px) {
  html { font-size: calc(.43985148514851485rem + .198019801980198vw); }
}
@media screen and (max-width: 991px) {
  html { font-size: 10px; }
  .nav_brand { width: auto; }
  .nav-items, .hipp-site-header .nav-actions { display: none; }
  .nav_button { display: flex; position: relative; z-index: 4001; }
  .hipp-site-header .nav_menu-items:not(.is-open) { display: none; }
  .hipp-site-header .nav_menu-items.is-open { z-index: 4000; display: flex; width: 100%; flex-direction: column; align-items: flex-start; justify-content: center; gap: 2.8rem; padding: 8rem 3.2rem; background: #0b214bfa; }
  .hipp-site-header:has(.nav_menu-items.is-open) .navbar { position: relative; z-index: 4001; background: #0b214b; }
  .hipp-site-header:has(.nav_menu-items.is-open) .nav_brand { color: white; }
  .hipp-site-header:has(.nav_menu-items.is-open) .menu_top-line,
  .hipp-site-header:has(.nav_menu-items.is-open) .menu_bottom-line { background-color: white; }
  .hipp-site-header:has(.nav_menu-items.is-open) .menu_top-line { transform: translateY(4px) rotate(45deg); }
  .hipp-site-header:has(.nav_menu-items.is-open) .menu_bottom-line { transform: translateY(-4px) rotate(-45deg); }
  .container-large.hero-new { gap: 5.6rem; }
  .hp-hero_container, .new-hero-container { width: 100%; flex: none; }
  .hp-screen_scene { position: relative; }
  .new-hero-container { min-height: 45rem; }
  .grove-path { grid-template-columns: 1fr; gap: 4rem; padding: 6rem 0; }
  .grove-path-intro { max-width: 60rem; }
  .tabs_menu { padding-left: 0; }
  .tabs_head, .tabs_cards { width: 100%; }
  .tabs_side-copy { display: none !important; }
  .tabs_card { overflow: visible; }
  .tabs_card-illu { overflow: hidden; border-radius: 1.2rem; }
  .tabs_card-head { display: flex; margin-bottom: 0; padding: 2.4rem 0 0; background-image: none; }
  .tabs_card-foot { display: flex; margin-top: 0; padding: 1rem 0 0; background-image: none; }
  .tabs_sidebar { position: static; display: flex; gap: 1.8rem; width: 100%; padding: 0; margin-bottom: 2.4rem; overflow-x: auto; scrollbar-width: none; }
  .tabs_sidebar::-webkit-scrollbar { display: none; }
  .tabs_side-link { flex: 0 0 auto; width: auto; padding: .8rem 0 1.2rem; }
  .tabs_content-inner { display: block; }
  .hp-devices_content { gap: 2rem; }
}
@media screen and (max-width: 767px) {
  .nav_brand { font-size: 2.2rem; }
  .section_hp-hero { padding-top: 5.2rem; padding-bottom: 3rem; }
  .hp-hero_container { padding-top: 0; }
  .hp-hero_head h1 { font-size: clamp(3.4rem, 9vw, 5rem); line-height: 1.24; }
  .new-hero-container { min-height: 23rem; }
  .hp-screen_scene { width: 100%; }
  .screen-container.is-home { width: 100%; margin-left: 0; }
  .hero-bg-gradient { top: 30rem; }
  .hp-hero_points.is-new { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3.6rem 1.6rem; padding-top: 2rem; padding-bottom: 6rem; }
  .hp-hero_point { width: 100%; max-width: none; }
  .grove-path { gap: 3.2rem; padding: 3.6rem 0; }
  .grove-path-step { grid-template-columns: 2.4rem minmax(0, 1fr) 1.6rem; gap: 1.2rem; padding: 2.2rem 0; }
  .grove-path-copy strong { font-size: 2rem; }
  .grove-path-description { font-size: 1.4rem; }
  .tabs_menu { gap: 1.6rem; flex-wrap: wrap; }
  .tabs_card { min-height: 0; }
  .tabs_card-head { padding-top: 2.4rem; }
  .tabs_card-foot { padding-top: .8rem; }
  .grove-feature-list { grid-template-columns: 1fr; }
  .grove-feature-list > div:nth-child(odd) { border-right: 0; }
  .hp-devices_content { flex-direction: column; }
  .hp-devices_item { width: 100%; }
  .hp-devices_browser { max-width: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero-screen .hero-demo-video { display: none; }
  .hero-screen .hero-demo-still { display: block; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}