/* Oracle breach check — mirrors the live Next.js page (bg #020E27, 966px column, glass input, eye watermark,
   18px narrative with yellow accents, amber disclaimer box, #0F1931 band). */
.pg-obs { position: relative; overflow: hidden; background: #020e27; color: #fff; margin-bottom: calc(-1 * clamp(40px, 6vw, 80px)); }
.pg-obs__container { width: min(100% - 32px, 966px); margin-inline: auto; }
.pg-obs__frame { position: absolute; top: -84px; left: 50%; transform: translateX(-50%); width: 1166px; height: 1070px; pointer-events: none; z-index: 1; }
.pg-obs__frame::before, .pg-obs__frame::after { content: ""; position: absolute; top: 0; bottom: 0; width: 1px; background: rgba(255, 255, 255, 0.12); }
.pg-obs__frame::before { left: 0; } .pg-obs__frame::after { right: 0; }

.pg-obs__hero { position: relative; z-index: 2; padding: 106px 0 40px; min-height: 740px; display: flex; flex-direction: column; justify-content: center; }
.pg-obs__head { position: relative; }
.pg-obs__head h1 { font-family: var(--font); font-weight: 700; font-size: 2.25rem; line-height: 1.12; letter-spacing: -0.01em; max-width: 672px; margin: 0; }
.pg-obs__sub { max-width: 672px; margin: 12px 0 40px; font-size: 1.15rem; line-height: 1.5; opacity: 0.5; }
.pg-obs__mark { position: absolute; top: 0; right: 0; pointer-events: none; }
.pg-obs__mark img { width: 275px; height: auto; }
.pg-obs__search {
  position: relative; display: flex; align-items: center; gap: 20px; height: 44px; width: 405px; max-width: 100%; padding-left: 16px; border-radius: 9px;
  border: 1px solid rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.02); backdrop-filter: blur(50px); -webkit-backdrop-filter: blur(50px);
}
.pg-obs__search input { flex: 1; min-width: 0; height: 100%; background: transparent; border: 0; outline: none; color: #fff; font-size: 0.75rem; }
.pg-obs__search input::placeholder { color: rgba(255, 255, 255, 0.3); }
.pg-obs__search-btn { margin: 0 4px 0 auto; height: calc(100% - 8px); padding: 0 16px; border-radius: 5px; background: #fff; color: #000; font-size: 0.875rem; font-family: var(--font); outline: 4px solid rgba(255, 255, 255, 0.08); transition: background 0.2s; }
.pg-obs__search-btn:hover { background: #e9edf5; }
.pg-obs__search-btn[disabled] { opacity: 0.7; cursor: progress; }
.pg-obs .form-error { margin: 6px 0 0; min-height: 0; }
.pg-obs .form-error:empty { display: none; }
.pg-obs .result { margin: 24px 0 0; }
.pg-obs .result .email-result__badge { background: rgba(255, 255, 255, 0.02); border-radius: 10px; }
.pg-obs .result p { font-size: 1.05rem; }

.pg-obs__story { max-width: 896px; margin: 40px 0 8px; }
.pg-obs__story p { font-size: 1.125rem; line-height: 1.55; margin: 0 0 16px; color: #fff; }
.pg-obs__list { margin-bottom: 16px; }
.pg-obs__list p { margin-bottom: 8px; }
.pg-obs__list ul { margin: 0; padding-left: 24px; list-style: disc; display: grid; gap: 4px; color: #d1d5db; font-size: 1.05rem; }
.pg-obs__yellow { color: #eab308; }
.pg-obs__bold { font-weight: 600; }
.pg-obs__gray { color: #d1d5db !important; }
.pg-obs__disclaimer {
  max-width: 896px; margin: 8px 0 40px; display: flex; align-items: flex-start; gap: 12px; padding: 16px; border-radius: 8px;
  border: 1px solid rgba(234, 179, 8, 0.2); background: rgba(234, 179, 8, 0.05); backdrop-filter: blur(4px);
}
.pg-obs__warn { color: #eab308; flex: none; display: grid; place-items: center; width: 20px; height: 24px; }
.pg-obs__warn .ico { width: 18px; height: 18px; }
.pg-obs__disclaimer p { margin: 0; }
.pg-obs__disclaimer-title { color: #eab308; font-weight: 500; margin-bottom: 4px !important; }
.pg-obs__disclaimer-text { font-size: 0.875rem; line-height: 1.5; color: rgba(254, 249, 195, 0.8); }

.pg-obs__band { position: relative; overflow: hidden; background: #0f1931; }
.pg-obs__band-in { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 64px 32px; }
.pg-obs__band-in p { margin: 0; font-size: 1.25rem; line-height: 1.5; }
.pg-obs__band-btn { flex: none; padding: 12px; border-radius: 8px; background: #fff; color: #000; font-size: 0.875rem; transition: background 0.2s, transform 0.2s; }
.pg-obs__band-btn:hover { background: #e9edf5; color: #000; transform: translateY(-1px); }
.pg-obs__band-bg { position: absolute; right: 0; bottom: 0; width: 600px; height: auto; z-index: 0; pointer-events: none; }

@media (max-width: 1200px) { .pg-obs__frame { display: none; } }
@media (max-width: 900px) { .pg-obs__mark { opacity: 0.5; right: -40px; } }
@media (max-width: 760px) {
  .pg-obs__hero { padding: 40px 0 32px; min-height: 0; }
  .pg-obs__head h1 { font-size: 1.9rem; }
  .pg-obs__sub { font-size: 1rem; margin-bottom: 28px; }
  .pg-obs__mark { right: -70px; top: -10px; opacity: 0.3; }
  .pg-obs__mark img { width: 220px; }
  .pg-obs__search { width: 100%; }
  .pg-obs__story p { font-size: 1.05rem; }
  .pg-obs__band-in { flex-direction: column; align-items: flex-start; padding: 48px 8px; }
}
