/* Safe & Secure kit pages: About, Contact, 404 (2026-11-02).
   Sits on top of ssl-safes.css (the shared kit, scoped .sfp) and only adds the
   parts those pages need. Everything is scoped .sfp.pgp so nothing reaches the
   shared chrome, the footer or the booking popup. Tokens are the kit's. */

/* Hero photo tile: a real <img> inside the kit's .ph box (no background-image,
   so the LCP photo is discoverable and gets fetchpriority). */
.sfp.pgp .pg-ph{position:relative;overflow:hidden}
.sfp.pgp .pg-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:14px}
.sfp.pgp .pg-ph.light{background:var(--white)}
.sfp.pgp .pg-ph.light img{object-fit:contain;padding:12px}
.sfp.pgp .pg-ph.cut{background:var(--yellow)}
.sfp.pgp .pg-ph.cut img{object-fit:contain;object-position:center bottom;padding:14px 10px 0}

/* Navy address tile under the hero photo. */
.sfp.pgp .pg-visit{text-decoration:none;font-size:14px;line-height:1.4}
.sfp.pgp .pg-visit b{display:block;font-family:var(--disp);font-weight:800;font-size:22px;letter-spacing:-.015em;color:var(--white);text-transform:uppercase}
.sfp.pgp .pg-visit .pin{background:var(--yellow);color:var(--navy)}
.sfp.pgp .pg-visit:hover b{box-shadow:inset 0 -2px 0 var(--yellow)}

/* Story: H2 left, prose right. */
.sfp.pgp .pg-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:56px;align-items:start;margin:20px 0 56px}
.sfp.pgp .pg-prose p{font-size:17px;line-height:1.65;max-width:62ch}
.sfp.pgp .pg-prose p+p{margin-top:16px}
.sfp.pgp .pg-prose a{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* Team: cut-outs on yellow, the name and role on the white strip below. */
.sfp.pgp .pg-team{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.sfp.pgp .pg-tm{background:var(--white);border:1px solid var(--line);border-radius:20px;overflow:hidden;display:flex;flex-direction:column}
.sfp.pgp .pg-tm-ph{background:var(--yellow);aspect-ratio:284/313;display:flex;align-items:flex-end;justify-content:center;padding:18px 18px 0}
.sfp.pgp .pg-tm-ph img{width:100%;height:100%;object-fit:contain;object-position:center bottom;display:block}
.sfp.pgp .pg-tm-b{padding:20px 22px 22px;display:flex;flex-direction:column;gap:4px;font-size:15px}
.sfp.pgp .pg-tm-n{font-family:var(--disp);font-weight:800;font-size:26px;letter-spacing:-.02em;color:var(--navy);text-transform:uppercase;line-height:1}
.sfp.pgp .pg-tm-r{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--navy3);margin-bottom:8px;padding-bottom:12px;border-bottom:2px dashed var(--line2)}

/* Service-card titles link to the service page; keep the kit's look. */
.sfp.pgp .kt-sc h3 a{color:inherit;text-decoration:none}
.sfp.pgp .kt-sc h3 a:hover{box-shadow:inset 0 -2px 0 var(--yellow)}

/* Shop details list (About visit band, Contact visit band). */
.sfp.pgp .pg-dl{margin:22px 0 26px;display:grid;gap:0;border-top:2px dashed var(--line2)}
.sfp.pgp .pg-dl>div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.sfp.pgp .pg-dl dt{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--navy3);padding-top:3px}
.sfp.pgp .pg-dl dd{margin:0;font-weight:600;color:var(--navy)}
.sfp.pgp .pg-dl a{color:var(--navy)}
.sfp.pgp .kt-areas-card img{width:100%;height:340px;object-fit:cover;display:block}
.sfp.pgp .faqg a{color:var(--navy);font-weight:600}

/* Contact: three ways to reach us. */
.sfp.pgp .pg-ways{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.sfp.pgp .pg-way{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:26px;display:flex;flex-direction:column;gap:12px;min-height:270px}
.sfp.pgp .pg-way .ic{width:44px;height:44px;border-radius:12px;background:var(--navy);color:var(--yellow);display:grid;place-items:center}
.sfp.pgp .pg-way .lbl{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--navy3);margin-top:8px}
.sfp.pgp .pg-way .big{font-family:var(--disp);font-weight:800;font-size:28px;line-height:1.05;letter-spacing:-.02em;color:var(--navy);text-decoration:none}
.sfp.pgp .pg-way p{font-size:15px}
.sfp.pgp .pg-way .acts{margin-top:auto;padding-top:16px;border-top:2px dashed var(--line2)}
.sfp.pgp .pg-way .acts .pill{padding:14px 20px;font-size:13px}
.sfp.pgp .pg-way.navy{background:var(--navy);border-color:var(--navy);color:#C9C7D6}
.sfp.pgp .pg-way.navy .ic{background:var(--yellow);color:var(--navy)}
.sfp.pgp .pg-way.navy .lbl{color:var(--cream)}
.sfp.pgp .pg-way.navy .big{color:var(--white)}
.sfp.pgp .pg-way.navy .acts{border-color:var(--navy3)}

/* Contact: a note band (lockouts, accounts). */
.sfp.pgp .pg-notes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.sfp.pgp .pg-note{background:var(--tile);border-radius:20px;padding:28px;display:flex;flex-direction:column;gap:10px}
.sfp.pgp .pg-note .st{font-family:var(--disp);font-weight:700;font-size:24px;letter-spacing:-.02em;color:var(--navy)}
.sfp.pgp .pg-note p{font-size:15px;max-width:52ch}
.sfp.pgp .pg-note a{color:var(--navy);font-weight:600}
.sfp.pgp .pg-note.y{background:var(--yellow);color:var(--navy)}

/* 404: the big number and the way back. */
.sfp.pgp .pg-404{font-family:var(--disp);font-weight:900;font-size:clamp(120px,18vw,240px);line-height:.8;letter-spacing:-.06em;color:var(--yellow);text-shadow:4px 4px 0 var(--navy3)}
.sfp.pgp .pg-path{font-size:14px;color:var(--muted);word-break:break-all}
.sfp.pgp .pg-path code{font-family:var(--sans);font-weight:600;color:var(--navy);background:var(--tile);border-radius:6px;padding:2px 8px}
.sfp.pgp .pg-big{background:var(--navy);color:#C9C7D6;padding:30px 30px 28px;display:flex;flex-direction:column;justify-content:space-between;gap:20px;grid-row:span 2}
.sfp.pgp .pg-links{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sfp.pgp .pg-links a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;background:var(--navy2);color:var(--white);text-decoration:none;font-weight:600}
.sfp.pgp .pg-links a:hover{background:var(--navy3)}
.sfp.pgp .pg-links svg{color:var(--yellow);flex:none}

.sfp.pgp .pg-links.four{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.sfp.pgp .pg-notes.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.sfp.pgp .pg-fine{margin-top:28px;font-size:15px;max-width:70ch}
.sfp.pgp .pg-404+h1{margin-top:-4px}

@media (max-width:1000px){
  .sfp.pgp .pg-links.four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sfp.pgp .pg-notes.three{grid-template-columns:1fr}
  .sfp.pgp .pg-split{grid-template-columns:1fr;gap:20px;margin-bottom:40px}
  .sfp.pgp .pg-team{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sfp.pgp .pg-ways{grid-template-columns:1fr}
  .sfp.pgp .pg-way{min-height:0}
  .sfp.pgp .pg-big{grid-row:auto}
}
@media (max-width:700px){
  .sfp.pgp .pg-links.four{grid-template-columns:1fr}
  .sfp.pgp .pg-notes{grid-template-columns:1fr}
  .sfp.pgp .pg-dl>div{grid-template-columns:1fr;gap:4px}
  .sfp.pgp .kt-areas-card img{height:240px}
  .sfp.pgp .pg-team{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:-16px;padding-inline:16px}
  .sfp.pgp .pg-team::-webkit-scrollbar{display:none}
  .sfp.pgp .pg-tm{flex:0 0 72%;scroll-snap-align:start}
  .sfp.pgp .pg-tm-n{font-size:22px}
}
