/* paimen homepage visual hotfix preview */
html,
body {
  max-width: 100%;
  overflow-x: hidden !important;
}

main > section:first-child > div.absolute.inset-0.z-30.overflow-hidden {
  display: none !important;
}

main > section:first-child {
  background: #020814 !important;
}

main > section:first-child .relative.h-full.w-full.overflow-hidden {
  border-radius: 10px !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14), 0 28px 90px rgba(0, 8, 24, 0.42);
}

main > section:first-child .relative.h-full.w-full.overflow-hidden::before,
main > section:first-child .relative.h-full.w-full.overflow-hidden::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

main > section:first-child .relative.h-full.w-full.overflow-hidden::before {
  z-index: 12;
  background:
    radial-gradient(circle at 50% 42%, rgba(72, 215, 255, 0.28), transparent 26rem),
    linear-gradient(to bottom, rgba(1, 6, 14, 0.18), rgba(1, 7, 16, 0.58));
}

main > section:first-child .relative.h-full.w-full.overflow-hidden::after {
  z-index: 13;
  opacity: 0.42;
  background-image:
    radial-gradient(circle, rgba(255, 255, 255, 0.72) 0 1px, transparent 1.5px),
    radial-gradient(circle, rgba(72, 215, 255, 0.42) 0 1px, transparent 1.5px);
  background-position:
    0 0,
    38px 28px;
  background-size:
    112px 112px,
    148px 148px;
  animation: paimenParticleDrift 14s linear infinite;
}

main > section:first-child video {
  filter: saturate(1.08) contrast(1.08) brightness(0.82) !important;
}

main > section:first-child h1 {
  font-family: Georgia, "Times New Roman", serif !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-shadow:
    0 0 22px rgba(72, 215, 255, 0.82),
    0 0 56px rgba(72, 215, 255, 0.46),
    0 2px 18px rgba(0, 0, 0, 0.42) !important;
}

main > section:first-child p {
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.46) !important;
}

.paimen-phone-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.65rem;
  color: inherit;
  font-weight: 700;
  text-decoration: none;
}

.paimen-phone-link:hover {
  text-decoration: underline;
}

.paimen-contact-phone {
  margin: -1.4rem auto 2rem;
  max-width: 42rem;
  border: 1px solid rgba(8, 145, 178, 0.22);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(236, 254, 255, 0.92), rgba(240, 253, 250, 0.92));
  padding: 1rem 1.1rem;
  text-align: center;
  color: #164e63;
  box-shadow: 0 12px 36px rgba(15, 118, 110, 0.08);
}

.paimen-contact-phone a {
  color: #0f766e;
  font-size: 1.2rem;
  font-weight: 800;
  text-decoration: none;
}

section table a {
  color: #0f766e;
  font-weight: 700;
  text-decoration: none;
}

section table a:hover {
  text-decoration: underline;
}

@keyframes paimenParticleDrift {
  to {
    background-position:
      70px 110px,
      -64px 96px;
  }
}

@media (max-width: 640px) {
  header > div {
    padding: 0.85rem 1rem !important;
  }

  header a[href="/"] {
    font-size: 1rem !important;
  }

  header button[aria-label*="メニュー"] {
    padding: 0.45rem !important;
  }

  main > section:first-child {
    height: 100svh !important;
    min-height: 38rem;
  }

  main > section:first-child .relative.h-full.w-full.p-2 {
    padding: 0 !important;
  }

  main > section:first-child .relative.h-full.w-full.overflow-hidden {
    display: grid !important;
    place-items: center !important;
    border-radius: 0 !important;
    background:
      radial-gradient(circle at 50% 44%, rgba(72, 215, 255, 0.28), transparent 17rem),
      linear-gradient(180deg, #041a2b 0%, #03101d 48%, #020814 100%) !important;
  }

  main > section:first-child .relative.h-full.w-full.overflow-hidden > .absolute.inset-0:first-child {
    inset: auto !important;
    z-index: 0 !important;
    width: min(100vw, 34rem) !important;
    height: auto !important;
    aspect-ratio: 716 / 480 !important;
    opacity: 0.92 !important;
    overflow: hidden !important;
  }

  main > section:first-child video {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    background: transparent !important;
  }

  main > section:first-child .relative.h-full.w-full.overflow-hidden::before {
    z-index: 1 !important;
    background:
      linear-gradient(to bottom, rgba(2, 8, 20, 0.12), rgba(2, 8, 20, 0.54)),
      radial-gradient(circle at 50% 48%, transparent 0 9rem, rgba(2, 8, 20, 0.46) 19rem) !important;
  }

  main > section:first-child .relative.h-full.w-full.overflow-hidden::after {
    z-index: 2 !important;
  }

  main > section:first-child .absolute.inset-0.z-20.flex.items-center.justify-center {
    z-index: 4 !important;
    padding: 0 1.1rem !important;
  }

  main > section:first-child .absolute.bottom-8.left-1\/2.z-20 {
    z-index: 4 !important;
  }

  main > section:first-child .absolute.inset-0.z-20.flex.items-center.justify-center > div {
    width: min(100%, 22rem);
    padding: 0 !important;
  }

  main > section:first-child .absolute.inset-0.z-20.flex.items-center.justify-center p {
    margin-bottom: 0.9rem !important;
    font-size: 0.78rem !important;
    letter-spacing: 0.22em !important;
  }

  main > section:first-child h1 {
    font-size: clamp(1.72rem, 7.8vw, 2rem) !important;
    line-height: 1.34 !important;
  }

  main > section:not(:first-child) {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
  }

  main > section:not(:first-child) .mx-auto.max-w-7xl {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  main h2 {
    font-size: 2rem !important;
  }

  main h3 {
    font-size: clamp(1.18rem, 5.2vw, 1.45rem) !important;
    line-height: 1.8 !important;
  }

  main p,
  main a,
  main li,
  main td,
  main th {
    overflow-wrap: anywhere;
  }

  footer {
    overflow-wrap: anywhere;
  }
}

@media (prefers-reduced-motion: reduce) {
  main > section:first-child .relative.h-full.w-full.overflow-hidden::after {
    animation: none;
  }
}