body.vp-home-page {
  min-height: 100vh;
  overflow-x: clip;
  background: #d6e8f1 var(--vp-landscape) center top / cover fixed no-repeat;
}

.vp-home-main {
  display: grid;
  gap: clamp(18px, 2.5vw, 28px);
  padding-block: clamp(18px, 3vw, 38px) 52px;
}

.vp-home-hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(260px, .9fr);
  align-items: center;
  gap: clamp(18px, 3vw, 36px);
}
.vp-home-hero-stage { width: min(100%, 800px); }
.vp-home-hero .vp-hero-content { inset: 39% 10% 13% 8%; }
.vp-home-hero .vp-hero-logo {
  width: clamp(58px, 12vw, 132px);
  height: clamp(66px, 13vw, 138px);
  max-height: none;
}
.vp-home-hero .vp-title { margin: 0 0 4px; font-size: clamp(1.45rem, 4vw, 3rem); }
.vp-home-hero p { font-size: clamp(.75rem, 1.2vw, 1rem); }
.vp-home-note { width: min(100%, 350px); justify-self: center; }
.vp-home-note > .vp-panel { height: 100%; }
.vp-home-note .vp-home-kicker { margin-bottom: 12px; }
.vp-home-note p:last-child { margin-bottom: 0; }
.vp-home-note a { font-weight: 750; }
#appSections { display: grid; gap: 22px; }
#appSections[aria-busy="true"] { min-height: 120px; }
.vp-home-category { display: grid; gap: 24px; min-width: 0; }
.vp-home-category-heading { margin: 0; gap: 10px; font-size: clamp(1.2rem, 2.2vw, 1.6rem); }
.vp-home-category-icon { display: inline-flex; align-items: center; flex: 0 0 auto; }
.vp-home-category-icon svg { width: 26px; height: 26px; }
.vp-home-main .card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.vp-home-main .vp-home-app {
  position: relative;
  display: grid;
  grid-template-rows: 1fr auto auto;
  justify-items: center;
  align-content: start;
  gap: 8px;
  min-width: 0;
  min-height: 206px;
  padding: 14px 12px 12px;
  border: 3px solid var(--vp-frame);
  border-radius: 9px;
  background: var(--vp-paper);
  box-shadow: 0 3px 0 var(--vp-shadow);
  color: var(--vp-ink);
  text-align: center;
  text-decoration: none;
  transition: transform .14s ease, background-color .14s ease;
}
.vp-home-main .vp-home-app:hover { transform: translateY(-2px); background: var(--vp-honey); }
.vp-home-main .vp-home-app:focus-visible { outline: none; background: var(--vp-honey); box-shadow: inset 0 -4px 0 var(--vp-focus), 0 3px 0 var(--vp-shadow); }
.vp-home-app-logo { display: block; width: clamp(86px, 9vw, 118px); height: clamp(86px, 9vw, 118px); object-fit: contain; }
.vp-home-main .card-title { align-self: end; margin: 0; font-size: 1rem; font-weight: 850; }
.vp-home-main .card-desc { margin: 0; max-width: 34ch; font-size: .84rem; line-height: 1.4; }
.vp-home-main .card-btn,
.vp-home-main .coming-tag { display: inline-flex; align-items: center; justify-content: center; min-height: 30px; font-size: .85rem; font-weight: 750; }
.vp-home-main .card-flag { position: absolute; top: 8px; right: 8px; padding: 3px 8px; border: 2px solid var(--vp-frame); border-radius: 999px; background: var(--vp-moss); font-size: .72rem; font-weight: 800; }
.vp-home-main .card-flag-broken { background: var(--vp-blush); }
.vp-home-main .vp-home-app.disabled { background: var(--vp-stone); box-shadow: none; }

.vp-home-section-heading {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  max-width: 100%;
  margin: 8px 0 -10px;
  padding: 10px 16px;
  border: 2px solid var(--vp-frame);
  border-radius: 8px;
  background-color: var(--vp-wood);
  background-image: url('../_resources/vyrdepil-design/wood-contours.png');
  background-position: center;
  background-size: max(100%,1536px) auto;
  background-repeat: no-repeat;
  background-clip: padding-box;
  box-shadow: 0 3px 0 var(--vp-shadow);
}
.vp-home-section-heading [data-icon] { display: inline-flex; }
.vp-home-category .vp-home-category-heading { margin: 0; }
.vp-home-lower-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, 220px);
  align-items: stretch;
  justify-content: center;
  gap: clamp(16px, 3vw, 34px);
  width: min(100%, 1184px);
  margin-inline: auto;
}
.vp-home-lower-content { display: grid; align-content: start; gap: 24px; min-width: 0; }
.vp-home-policy-copy { min-width: 0; }
.vp-home-license {
  display: grid;
  gap: 0;
  width: 100%;
}
.vp-home-license .vp-home-policy { width: 100%; }
.vp-home-policy {
  width: min(100%, 930px);
  margin-inline: auto;
  background-color: var(--vp-paper);
}
.vp-home-policy-mascot { position: sticky; top: 108px; align-self: start; display: block; width: min(100%, 220px); height: auto; justify-self: center; object-fit: contain; }
.vp-home-policy :is(h3, h4) { margin: 1.5em 0 .55em; font-size: 1.15rem; }
.vp-home-policy p, .vp-home-policy li { line-height: 1.65; }
.vp-home-policy ul { padding-inline-start: 1.35em; }
.vp-home-policy .privacy-header { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.vp-home-policy .privacy-hicon { display: grid; place-items: center; flex: 0 0 54px; width: 54px; height: 54px; border-radius: 8px; background: var(--vp-moss); }
.vp-home-policy .privacy-hicon svg { width: 32px; height: 32px; }
.vp-home-policy .privacy-htitle { margin: 0; font-size: clamp(1.2rem, 2.3vw, 1.6rem); }
.vp-home-policy .privacy-highlight { margin-block: 20px; padding: 16px; border: 2px solid var(--vp-frame); border-radius: 8px; background: var(--vp-honey); }
.vp-home-policy .ai-marks { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); gap: 12px; }
.vp-home-policy .ai-mark { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 12px; border: 2px solid var(--vp-frame); border-radius: 8px; background: var(--vp-wood); }
.vp-home-policy .ai-mark-icon { flex: 0 0 auto; }
.vp-home-policy .ai-mark-text { display: grid; gap: 3px; }
.vp-home-policy .ai-mark-text span { font-size: .9rem; }
.vp-home-policy .accordion-box { margin-block: 12px; border: 2px solid var(--vp-frame); border-radius: 8px; background: var(--vp-wood); }
.vp-home-policy .accordion-box > summary { padding: 14px; font-weight: 800; cursor: pointer; }
.vp-home-policy .accordion-body { padding: 2px 14px 14px; }

@media (max-width: 1100px) {
  .vp-home-main .card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .vp-home-hero-layout { grid-template-columns: minmax(0, 1fr); }
  .vp-home-note { width: min(100%, 620px); }
  .vp-home-lower-layout { grid-template-columns: minmax(0, 1fr); }
  .vp-home-policy-mascot { display: none; }
}

@media (max-width: 620px) {
  .vp-home-main { width: calc(100% - 16px); gap: 14px; }
  .vp-home-note.vp-sign--grounded::before { left: -8px; }
  .vp-home-note.vp-sign--grounded::after { right: -8px; }
  .vp-home-hero .vp-hero-content { inset: 39% 8% 13% 8%; gap: 7px; }
  .vp-home-hero .vp-hero-logo { width: clamp(52px, 15vw, 82px); height: clamp(58px, 17vw, 92px); }
  .vp-home-note > .vp-panel { padding: 14px; }
  .vp-home-main .card-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
  .vp-home-category { gap: 18px; }
  .vp-home-category-heading { padding: 8px 10px; font-size: 1.08rem; }
  .vp-home-category-icon svg { width: 22px; height: 22px; }
  .vp-home-main .vp-home-app { grid-template-rows: auto auto; align-content: start; gap: 5px; min-height: 112px; padding: 7px 3px 6px; border-width: 2px; }
  .vp-home-app-logo { width: clamp(42px, 13vw, 58px); height: clamp(42px, 13vw, 58px); }
  .vp-home-main .card-title { align-self: start; font-size: clamp(.62rem, 2.8vw, .76rem); line-height: 1.15; overflow-wrap: anywhere; }
  .vp-home-main :is(.card-desc, .card-btn, .coming-tag, .card-flag) { display: none; }
  .vp-home-policy { padding: 16px; }
  .vp-home-policy .privacy-header { align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  .vp-home-main .vp-home-app { transition: none; }
}