/* =========================================================
   MSHINDO PARISH — QUICK FINDER ART (curved lines)
   ========================================================= */

.finder.fz-ready { overflow: hidden; padding-top: 140px; padding-bottom: 150px; isolation: isolate; }
.finder.fz-ready > .container { position: relative; z-index: 2; }

/* ---------- curved section edges ---------- */
.fz-wave { position: absolute; left: 0; width: 100%; height: 90px; z-index: 1; pointer-events: none; }
.fz-wave-top { top: -1px; }
.fz-wave-bottom { bottom: -1px; }
.fz-wave-line { stroke-dasharray: 1600; stroke-dashoffset: 1600; transition: stroke-dashoffset 2.4s ease; }
.fz-drawn .fz-wave-line { stroke-dashoffset: 0; }

/* ---------- flowing background lines ---------- */
.fz-lines { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; transition: transform .2s linear; }
.fz-line { fill: none; stroke: url(#faGold); stroke-width: 2; vector-effect: non-scaling-stroke; opacity: .55;
    stroke-dasharray: 1800; stroke-dashoffset: 1800; transition: stroke-dashoffset 2.8s cubic-bezier(.45,0,.2,1); }
.fz-line.maroon { stroke: url(#faMaroon); opacity: .22; stroke-width: 3; }
.fz-line.thin { stroke-width: 1; opacity: .4; stroke-dasharray: 4 10; stroke-dashoffset: 0; animation: faFlow 18s linear infinite; }
.fz-line.l2 { opacity: .3; transition-delay: .3s; }
.fz-line.l3 { transition-delay: .5s; }
.fz-line.l4 { opacity: .35; transition-delay: .7s; }
.fz-drawn .fz-line:not(.thin) { stroke-dashoffset: 0; }
@keyframes faFlow { to { stroke-dashoffset: -280; } }

/* ---------- corner flourishes ---------- */
.fz-curl { position: absolute; width: 150px; height: 150px; z-index: 1; pointer-events: none; opacity: 0; transition: opacity 1.2s ease 1s; }
.fz-curl path { fill: none; stroke: var(--accent-gold); stroke-width: 2; stroke-linecap: round; }
.fz-curl circle { fill: var(--accent-gold); }
.fz-curl-tl { top: 100px; left: 26px; }
.fz-curl-br { bottom: 110px; right: 26px; transform: rotate(180deg); }
.fz-drawn .fz-curl { opacity: .55; }

/* ---------- heading swoosh ---------- */
.fz-swoosh { display: block; width: min(360px, 70%); height: 34px; margin: -6px auto 6px; overflow: visible; }
.fz-swoosh path { fill: none; stroke: var(--accent-gold); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 460; stroke-dashoffset: 460; transition: stroke-dashoffset 1.6s ease .3s; }
.fz-swoosh path.thin { stroke: var(--primary-maroon); stroke-width: 1.5; opacity: .45; transition-delay: .7s; }
.fz-swoosh circle { fill: var(--primary-maroon); transform-origin: 214px 22px; transform: scale(0); transition: transform .5s cubic-bezier(.34,1.56,.64,1) 1.4s; }
.fz-drawn .fz-swoosh path { stroke-dashoffset: 0; }
.fz-drawn .fz-swoosh circle { transform: scale(1); }
.finder.fz-ready h2::after { display: none; }   /* the swoosh replaces the straight underline */

/* ---------- arched tiles ---------- */
.finder.fz-ready .finder-grid { gap: 26px; margin-top: 44px; }
.finder.fz-ready .finder-tile {
    border-radius: 140px 140px 14px 14px;       /* church-window arch */
    padding: 34px 18px 58px;
    background: linear-gradient(180deg, #fffdf8 0%, var(--bg-white) 60%);
    border-width: 2px;
    box-shadow: 0 10px 25px rgba(0,0,0,.08), inset 0 0 0 6px #fff, inset 0 0 0 7px rgba(212,175,55,.35);
}
.finder.fz-ready .finder-tile:hover {
    box-shadow: 0 26px 50px rgba(0,0,0,.16), 0 18px 40px rgba(212,175,55,.22), inset 0 0 0 6px #fff, inset 0 0 0 7px var(--accent-gold);
}

/* icon in a drawn ring */
.fz-icon-wrap { position: relative; width: 84px; height: 84px; display: grid; place-items: center; margin-bottom: 14px; }
.finder.fz-ready .finder-tile .fz-icon-wrap i { margin: 0; position: relative; z-index: 1; }
.fz-icon-wrap::before { content: ''; position: absolute; inset: 12px; border-radius: 50%; background: radial-gradient(circle, rgba(212,175,55,.16), rgba(139,17,17,.05) 70%); transition: all .5s cubic-bezier(.34,1.56,.64,1); }
.finder-tile:hover .fz-icon-wrap::before { inset: 6px; background: radial-gradient(circle, rgba(139,17,17,.95), var(--primary-dark)); box-shadow: 0 0 22px rgba(212,175,55,.45); }
.fz-ring { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; transition: transform 1.2s cubic-bezier(.34,1.2,.64,1); }
.fz-ring circle, .fz-ring path { fill: none; stroke-linecap: round; }
.fz-ring .r1 { stroke: rgba(212,175,55,.35); stroke-width: 1.5; stroke-dasharray: 3 6; }
.fz-ring .r2 { stroke: var(--accent-gold); stroke-width: 3; }
.fz-ring .r3 { stroke: var(--primary-maroon); stroke-width: 3; opacity: .55; }
.finder-tile:hover .fz-ring { transform: rotate(200deg); }
.finder-tile:hover .fz-ring .r3 { stroke: var(--accent-light); opacity: 1; }

/* curved gold base wave inside each tile */
.fz-tile-wave { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 38px; pointer-events: none; transition: transform .6s cubic-bezier(.34,1.56,.64,1); transform: translateY(10px); }
.fz-tile-wave .w1 { fill: rgba(212,175,55,.28); }
.fz-tile-wave .w2 { fill: rgba(139,17,17,.9); transition: fill .4s ease; }
.finder-tile:hover .fz-tile-wave { transform: translateY(0) scaleY(1.25); transform-origin: bottom; }
.finder-tile:hover .fz-tile-wave .w2 { fill: var(--accent-gold); }

/* small number on the wave */
.fz-num { position: absolute; bottom: 8px; left: 50%; transform: translateX(-50%); z-index: 2; font-family: 'Cinzel', serif; font-size: .78rem; font-weight: 700; letter-spacing: 2px; color: var(--accent-gold); transition: color .4s ease, letter-spacing .4s ease; }
.finder-tile:hover .fz-num { color: var(--primary-dark); letter-spacing: 4px; }

/* the tile's text sits above the decorations */
.finder.fz-ready .finder-tile strong, .finder.fz-ready .finder-tile small { position: relative; z-index: 2; }

/* ---------- responsive ---------- */
@media (max-width: 768px) {
    .finder.fz-ready { padding-top: 100px; padding-bottom: 110px; }
    .fz-lines { opacity: .45; }
    .fz-wave { height: 50px; }
    .fz-curl { width: 80px; height: 80px; }
    .fz-curl-tl { top: 60px; left: 8px; }
    .fz-curl-br { bottom: 60px; right: 8px; }
    .finder.fz-ready .finder-grid { gap: 14px; }
    .finder.fz-ready .finder-tile { border-radius: 90px 90px 12px 12px; padding: 24px 10px 48px; }
    .fz-icon-wrap { width: 64px; height: 64px; margin-bottom: 8px; }
}
@media (prefers-reduced-motion: reduce) {
    .fz-line, .fz-wave-line, .fz-swoosh path { stroke-dashoffset: 0 !important; transition: none !important; }
    .fz-line.thin { animation: none; }
}
body.a11y-still .fz-line, body.a11y-still .fz-wave-line, body.a11y-still .fz-swoosh path { stroke-dashoffset: 0 !important; }
body.a11y-still .fz-swoosh circle { transform: scale(1) !important; }
body.a11y-still .fz-curl { opacity: .55 !important; }