/* 21st-inspired equal frames and image-card rail, adapted without React. */
.photo-gallery { --pg-ink:#173744; --pg-accent:#086c82; padding:48px 0; color:var(--pg-ink); min-width:0; }
.pg-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:24px; }
.pg-heading > div:first-child { max-width:760px; }
.pg-eyebrow { color:var(--pg-accent); font-size:12px; letter-spacing:.14em; font-weight:700; margin:0 0 10px; }
.pg-heading h2 { margin:0 0 12px; font-size:clamp(26px,3vw,40px); line-height:1.3; letter-spacing:-.03em; word-break:keep-all; }
.pg-heading p:not(.pg-eyebrow) { margin:0; font-size:16px; line-height:1.8; }
.pg-track { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.pg-card { min-width:0; margin:0; }
.pg-photo { position:relative; display:block; aspect-ratio:1; overflow:hidden; border-radius:14px; background:#e7eef0; color:white; }
.pg-photo img { display:block; width:100%; height:100%; object-fit:contain; }
.pg-zoom { position:absolute; right:12px; bottom:12px; display:grid; place-items:center; width:38px; height:38px; border-radius:50%; background:rgba(14,39,48,.84); font-size:22px; transition:background .2s; }
.pg-photo:hover .pg-zoom { background:#08778d; }
.pg-card figcaption { display:flex; gap:12px; margin-top:14px; font-size:14px; line-height:1.7; }
.pg-number { color:var(--pg-accent); font-size:12px; font-weight:700; padding-top:2px; }
.pg-hint { margin:16px 0 0; font-size:13px; color:#526b76; }
.photo-gallery--rail { margin:0 -24px 24px; padding:40px 24px; background:#eaf2f3; border-radius:20px; }
.photo-gallery--rail .pg-track { display:grid; grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:calc((100% - 44px)/3); overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:thin; scrollbar-color:#678b98 #d5e3e6; padding:0 0 18px; }
.photo-gallery--rail .pg-card { scroll-snap-align:start; }
.photo-gallery--rail .pg-photo { aspect-ratio:4/3; background:#d5e5e8; }
.pg-controls { display:flex; flex:none; gap:8px; }
.pg-controls[hidden] { display:none; }
.pg-controls button,.pg-lightbox button { display:grid; place-items:center; width:46px; min-height:46px; border:1px solid #adc1c9; background:#fff; color:#173744; border-radius:50%; cursor:pointer; font:inherit; font-size:22px; }
.pg-controls button:disabled { opacity:.35; cursor:default; }
.photo-gallery a:focus-visible,.photo-gallery button:focus-visible,.pg-track:focus-visible,.profile-tour-feature:focus-visible { outline:3px solid #087a94; outline-offset:4px; }
.pg-lightbox { width:min(1120px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); margin:auto; padding:18px; border:0; border-radius:16px; background:#102b37; color:#fff; }
.pg-lightbox::backdrop { background:rgba(3,13,21,.88); }
.pg-toolbar { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.pg-toolbar button { width:auto; padding:0 16px; border-radius:24px; font-size:15px; }
.pg-media { position:relative; height:min(68dvh,740px); margin-top:14px; }
.pg-media img { width:100%; height:100%; object-fit:contain; }
.pg-media p { position:absolute; inset:40% 20px auto; text-align:center; background:#102b37; padding:16px; }
.pg-bottom { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:14px 0; }
.pg-bottom button { flex:none; }
.pg-bottom p { margin:0; font-size:14px; line-height:1.6; text-align:center; }
.pg-lightbox > a { color:#fff; font-size:13px; text-underline-offset:4px; text-decoration:underline; }
html.pg-open { overflow:hidden; }
.profile-tour-feature { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); margin:40px 0 56px; border-radius:18px; overflow:hidden; background:#e5eff1; border:1px solid #cbdde1; color:#173744; }
.profile-tour-feature > img { display:block; width:100%; height:100%; aspect-ratio:4/3; object-fit:cover; }
.profile-tour-copy { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; padding:clamp(24px,4vw,52px); }
.profile-tour-copy h2 { margin:10px 0 18px; font-size:clamp(26px,3vw,42px); line-height:1.3; word-break:keep-all; }
.profile-tour-copy p { margin:0; line-height:1.8; }
.profile-tour-copy .profile-tour-action { display:inline-block; margin-top:24px; padding:12px 18px; background:#086c82; color:#fff; font-weight:700; border-radius:6px; }
.profile-tour-feature:hover .profile-tour-action { background:#124853; }
@media(max-width:760px) { .pg-heading { align-items:start; gap:14px; } .pg-heading h2 { font-size:27px; } .pg-track { grid-template-columns:1fr; gap:24px; } .photo-gallery--rail { margin-inline:-12px; padding:30px 12px; border-radius:12px; } .photo-gallery--rail .pg-track { grid-auto-columns:85%; gap:16px; } .photo-gallery--rail .pg-heading { flex-wrap:wrap; } .photo-gallery--rail .pg-controls { margin-left:auto; } .profile-tour-feature { grid-template-columns:1fr; } .profile-tour-feature > img { aspect-ratio:4/3; } .pg-lightbox { padding:12px; } .pg-media { height:57dvh; } }