/* Photo layout controls shared by the editor and public pages. */
.cms-photo,.page-intro-visual.cms-photo{display:block;box-sizing:border-box;width:var(--photo-width,180px);max-width:min(100%,var(--photo-width,180px));min-width:0;height:auto;aspect-ratio:var(--photo-ratio,1 / 1);border-radius:9px;overflow:hidden;background:#e6eef1;}
.cms-photo>img,.page-intro-visual.cms-photo>img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--photo-x,50%) var(--photo-y,50%);}
.cms-photo.photo-left{float:left;margin:0 24px 14px 0;clear:left;}
.cms-photo.photo-right{float:right;margin:0 0 14px 24px;clear:right;}
.cms-photo.photo-center{float:none;margin:18px auto 22px;clear:both;}
/* Flow-root keeps the page-intro image and text together; the photo itself floats to wrap text. */
.page-intro:has(.cms-photo){display:flow-root;}
.page-intro:has(.cms-photo) .page-intro-copy{display:contents;}
.cms-effect-hover,.cms-effect-lift,.cms-effect-glow{transition:transform .35s ease,box-shadow .35s ease,filter .35s ease;}
.cms-effect-hover:hover{transform:scale(1.025)}
.cms-effect-lift:hover{transform:translateY(-4px)}
.cms-effect-glow:hover{box-shadow:0 12px 30px rgba(5,78,97,.14)}
.cms-effect-fade{animation:cms-fade-in .65s ease both}
.cms-effect-rise{animation:cms-rise-in .7s ease both}
@keyframes cms-fade-in{from{opacity:0}to{opacity:1}}
@keyframes cms-rise-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:640px){.cms-photo,.page-intro-visual.cms-photo{max-width:min(42%,var(--photo-width,180px));}.cms-photo.photo-center{max-width:min(100%,var(--photo-width,180px))}.cms-photo.photo-left{margin-right:14px}.cms-photo.photo-right{margin-left:14px}}
@media(prefers-reduced-motion:reduce){.cms-effect-hover,.cms-effect-lift,.cms-effect-glow{transition:none!important}.cms-effect-fade,.cms-effect-rise{animation:none!important}.cms-effect-hover:hover,.cms-effect-lift:hover{transform:none!important}.cms-effect-glow:hover{box-shadow:none!important}}

/* Clear photo selection in the editor, even when a parent clips image outlines. */
#visual .editor-selected-photo{outline:4px solid #00a6b4!important;outline-offset:3px;box-shadow:0 0 0 6px rgba(0,166,180,.13);}
#visual .editor-selected-photo img{outline:0!important;}
.editor-photo-picker{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin:0 0 14px;padding:10px;border-radius:6px;background:#eaf5f7;}
.editor-photo-picker select{max-width:430px;width:min(100%,430px);min-width:180px;padding:9px;border:1px solid #8ab3bd;border-radius:5px;font:inherit;font-size:13px;background:#fff;}
.editor-photo-picker button{border:1px solid #8ab3bd;border-radius:5px;background:#fff;padding:9px 11px;cursor:pointer;}
.editor-photo-picker button:disabled{opacity:.5;cursor:default;}
.editor-picker-help{font-size:12px;color:#456674;}
#visual figure img,#visual .cms-photo img{cursor:pointer!important;}

/* Responsive, editor-created photo rows (two/three across on desktop). */
.cms-photo-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;width:100%;clear:both;float:none;margin:18px 0 22px;align-items:start;}
.cms-photo-row:has(> .cms-photo:nth-child(3)){grid-template-columns:repeat(3,minmax(0,1fr));}
.cms-photo-row > .cms-photo,.page-intro .cms-photo-row > .cms-photo{float:none!important;clear:none!important;width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;aspect-ratio:var(--photo-ratio,4 / 3);}
.cms-photo-row > .cms-photo > img{height:100%;width:100%;object-fit:cover;}
.page-intro:has(.cms-photo-row){display:flow-root;}
@media(max-width:740px){.cms-photo-row:has(> .cms-photo:nth-child(3)){grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:520px){.cms-photo-row,.cms-photo-row:has(> .cms-photo:nth-child(3)){grid-template-columns:1fr;gap:12px}.cms-photo-row > .cms-photo{max-height:320px;}}
/* Editor-only move grips/drop indicators. */
#visual .cms-photo,#visual .hero-photo,#visual .photo-feature-image,#visual .page-intro-visual{position:relative;overflow:visible;}
#visual .cms-photo > img{border-radius:8px;}
#visual .cms-drag-handle{position:absolute;right:5px;top:5px;z-index:6;padding:5px 8px;border:1px solid #0a5364;border-radius:5px;color:white;background:#075b70;font:600 12px/1.35 system-ui,sans-serif;cursor:grab;box-shadow:0 2px 6px #0003;user-select:none;}
#visual .cms-drag-handle:active{cursor:grabbing;}
#visual .cms-drop-target{outline:3px dashed #0396a3!important;outline-offset:5px;}
#visual .cms-is-dragging{opacity:.45;}
.editor-photo-position{font-size:13px;line-height:1.5;padding:10px 12px;margin:0 0 10px;color:#28556a;background:#f0f7f8;border-left:3px solid #0a8696;}
.editor-position-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:15px;}
.editor-position-actions label{display:flex;gap:8px;align-items:center;font-size:12px;font-weight:600;}
.editor-position-actions select{width:min(390px,100%);font-size:13px;padding:7px;border:1px solid #bfd0d8;border-radius:5px;}
.editor-position-actions button{padding:8px 11px;border:1px solid #b5cbd5;border-radius:5px;background:#fff;cursor:pointer;}
.editor-position-actions button:disabled{opacity:.45;cursor:default;}

#editor-js-status.editor-status-good{color:#08764f!important}
#visual .cms-drag-handle{touch-action:none;pointer-events:auto}