.page-finder { padding: clamp(3.5rem, 7vw, 7rem) 0; background: linear-gradient(175deg, #fff 0%, #fbfcfd 65%, #f7f9fb 100%); color: var(--ink); }
.page-finder__layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }

.page-finder__layout[data-reveal-group].is-armed > * { opacity: 0; transform: translateY(28px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.page-finder__layout[data-reveal-group].is-armed.is-visible > * { opacity: 1; transform: none; }
.page-finder__layout[data-reveal-group] > *:nth-child(1) { transition-delay: 0ms; }
.page-finder__layout[data-reveal-group] > *:nth-child(2) { transition-delay: 120ms; }

.page-finder__photos { position: relative; margin: 0 clamp(28px, 7%, 44px) clamp(28px, 7%, 44px) 0; }
.page-finder__photo { position: relative; margin: 0; overflow: hidden; background: #e4e9ef; }
.page-finder__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(195deg, rgba(0, 18, 51, 0) 60%, rgba(0, 18, 51, .16) 100%); pointer-events: none; }
.page-finder__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.page-finder__photo--main { border-radius: 18px; box-shadow: 0 2px 6px rgba(0, 10, 24, .07), 0 30px 60px -16px rgba(0, 10, 24, .22); }
.page-finder__photo--main img { aspect-ratio: 4 / 5; object-position: 54% center; }
.page-finder__photo--accent { position: absolute; right: clamp(-44px, -7%, -28px); bottom: clamp(-44px, -7%, -28px); z-index: 1; width: 52%; border: 6px solid #fff; border-radius: 13px; box-shadow: 0 2px 5px rgba(0, 10, 24, .08), 0 22px 40px -8px rgba(0, 10, 24, .24); }
.page-finder__photo--accent img { aspect-ratio: 4 / 3; object-position: center 35%; }

.page-finder__content { position: relative; min-width: 0; }
.page-finder__content::before { content: "K"; position: absolute; z-index: -1; top: -.3em; right: -.05em; color: rgba(0, 18, 51, .035); font-family: var(--font-display, sans-serif); font-size: 13rem; font-weight: 900; line-height: 1; pointer-events: none; }
.page-finder__eyebrow { position: relative; margin: 0 0 1rem; padding-left: 30px; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); font-weight: 750; }
.page-finder__eyebrow::before { content: ""; position: absolute; left: 0; top: 50%; width: 20px; height: 2px; transform: translateY(-50%); background: var(--action); border-radius: 2px; }
.page-finder h2 { margin: 0 0 1rem; font-family: var(--font-display, sans-serif); font-size: clamp(2.4rem, 5.5vw, 5.6rem); font-weight: 750; line-height: 1.02; letter-spacing: -.055em; color: #071d33; }
.page-finder h2 em { color: #07558d; font-style: normal; }
.page-finder__intro { color: var(--muted); font-size: .95rem; line-height: 1.65; margin-bottom: 2rem; }

.page-finder__rating { position: absolute; top: 18px; left: 18px; z-index: 2; max-width: 148px; padding: 12px 14px; border-radius: 14px; background: #fff; box-shadow: 0 20px 40px rgba(0, 10, 24, .22); text-align: left; }
.page-finder__rating-google { display: block; margin-bottom: 3px; color: var(--muted); font-size: .64rem; font-weight: 800; }
.page-finder__rating strong { display: block; color: #0c2335; font-family: var(--font-display, sans-serif); font-size: 1.15rem; font-weight: 900; line-height: 1; }
.page-finder__rating-stars { display: flex; gap: 2px; margin: 5px 0; }
.page-finder__rating-stars .lucide { width: 12px; height: 12px; color: #f5a623; fill: #f5a623; }
.page-finder__rating small { display: block; color: var(--muted); font-size: .66rem; font-weight: 700; }

.page-finder__search { display: block; margin-bottom: .5rem; color: var(--ink-soft); font-size: .8rem; font-weight: 650; }
.page-finder__field { display: flex; align-items: center; gap: .75rem; padding-bottom: .6rem; border-bottom: 2px solid var(--ink); transition: border-color .2s ease, box-shadow .2s ease; }
.page-finder__field:focus-within { border-bottom-color: var(--action); box-shadow: var(--focus-ring); }
.page-finder__field .lucide { flex: 0 0 auto; width: 20px; height: 20px; color: var(--action); }
.page-finder__field input { width: 100%; min-width: 0; min-height: 40px; border: 0; outline: 0; background: transparent; color: var(--ink); font: inherit; font-size: 1rem; font-weight: 650; }
.page-finder__field input::placeholder { color: var(--slate-soft); font-weight: 500; }
.page-finder__count { margin: 1rem 0; color: var(--muted); font-size: .75rem; min-height: 1.5em; }

.page-finder__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.25rem; padding: .6rem; border: 1px solid var(--line-strong); border-radius: 16px; background: #fff; box-shadow: 0 20px 44px rgba(0, 10, 24, .06); }
.page-finder__links a { display: grid; grid-template-columns: 38px minmax(0, 1fr) 20px; column-gap: .85rem; align-items: center; min-height: 64px; padding: .8rem .25rem; border-bottom: 1px solid var(--line); border-radius: 10px; color: var(--ink); text-decoration: none; transition: background-color .2s ease, padding .2s ease; }
.page-finder__links a .page-finder__icon { display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: rgba(var(--primary-rgb), .1); transition: transform .2s ease, background-color .2s ease; }
.page-finder__icon .lucide { width: 17px; height: 17px; color: var(--primary); }
.page-finder__links a[data-tone="action"] .page-finder__icon { background: rgba(var(--action-rgb), .1); }
.page-finder__links a[data-tone="action"] .page-finder__icon .lucide { color: var(--action); }
.page-finder__links a span { display: block; }
.page-finder__links a strong { display: block; font-size: .93rem; font-weight: 650; color: var(--ink); }
.page-finder__links a small { display: block; margin-top: .25rem; color: var(--muted); font-size: .74rem; }
.page-finder__tags { margin-top: .3rem; color: var(--slate-soft); font-size: .72rem; transition: color .2s ease; }
.page-finder__links a .page-finder__tags span { display: inline; }
.page-finder__tags span:not(:last-child)::after { content: " · "; color: var(--line-strong); }
.page-finder__links a:is(:hover, :focus-visible) .page-finder__tags { color: var(--primary); }
.page-finder__links a span[aria-hidden] .lucide { width: 14px; height: 14px; color: var(--muted); transition: transform .2s ease, color .2s ease; }
.page-finder__links a:last-child { grid-column: 1 / -1; border-bottom: 0; }
.page-finder__links a:is(:hover, :focus-visible) { background: var(--nav-chip-hover); padding-inline: .6rem; }
.page-finder__links a:is(:hover, :focus-visible) .page-finder__icon { transform: scale(1.08); background: rgba(var(--primary-rgb), .16); }
.page-finder__links a[data-tone="action"]:is(:hover, :focus-visible) .page-finder__icon { background: rgba(var(--action-rgb), .16); }
.page-finder__links a:is(:hover, :focus-visible) span[aria-hidden] .lucide { color: var(--action); transform: translate(2px, -2px); }
.page-finder__links a:focus-visible { outline: 2px solid var(--action); outline-offset: -3px; }
.page-finder__links a[hidden], .page-finder [hidden] { display: none; }

.page-finder__empty { padding: 1rem 0; color: var(--muted); font-size: .9rem; line-height: 1.6; }
.page-finder__empty a { color: var(--action); }
.page-finder__footer { display: inline-flex; align-items: center; gap: .4rem; margin-top: 1.2rem; padding: .4rem 0; color: var(--action); text-underline-offset: 4px; font-size: .85rem; transition: color .2s ease; }
.page-finder__footer span { transition: transform .2s ease; }
.page-finder__footer:is(:hover, :focus-visible) { color: var(--action-dark); }
.page-finder__footer:is(:hover, :focus-visible) span { transform: translate(3px, -3px); }

@media (max-width: 991.98px) {
  .page-finder__layout { grid-template-columns: minmax(0, 1fr); }
  .page-finder__content { grid-row: 1; }
  .page-finder__photos { max-width: 460px; }
  .page-finder__photo--main img { aspect-ratio: 4 / 3; }
}
@media (max-width: 575.98px) {
  .page-finder__links { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .page-finder__layout[data-reveal-group].is-armed > * { opacity: 1; transform: none; transition: none; }
}