.gallery-card{position:relative;border:1px solid #d3e2eb;border-radius:8px;overflow:hidden;background:#f4f8fa}.gallery-card>button.gallery-open{width:100%;border:0;border-radius:0}.gallery-card .heart-control{position:absolute;right:10px;top:10px;display:grid;place-items:center;width:44px;height:44px;padding:0;background:white;border:1px solid #b9d0df;border-radius:50%;box-shadow:0 2px 8px #00365220;color:#006ab6}.heart-control svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8}.heart-control[aria-pressed=true] svg{fill:currentColor}.gallery-card .note-link{border:0;background:transparent;padding:6px 12px 12px;font-size:12px;text-decoration:underline}.detail-heart{display:flex;align-items:center;gap:10px;padding:10px 14px;margin:0 0 12px;border:1px solid #bed5e4;border-radius:6px;background:white;color:#006ab6;font:600 14px Montserrat,Arial;cursor:pointer}.favourite-note{margin:14px 0}.favourite-note[hidden]{display:none}.favourite-note label{display:block;font-size:15px;font-weight:600}.favourite-note small{font-size:12px;font-weight:400;color:#617887}.favourite-note textarea{display:block;width:100%;box-sizing:border-box;border:1px solid #b9d0df;border-radius:6px;padding:12px;margin:8px 0;font:16px/1.5 Montserrat,Arial}#show-favourites{margin-left:auto}.brief-item{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid #d3e2eb}.brief-item img{width:120px;height:90px;object-fit:contain;background:#f4f8fa}.brief-item p{white-space:pre-wrap;font-size:14px;margin:6px 0}.brief-item h3{font-size:15px;margin:0}.brief-disclaimer{font-size:12px;color:#617887}#favourites-brief{width:min(800px,calc(100vw - 24px))}#favourites-brief h3.category-title{color:#004b76;font:24px Georgia,serif;margin:24px 0 6px}.gallery-grid h3{grid-column:1/-1;margin:14px 0 0;font:24px Georgia,serif;color:#004b76}@media(max-width:650px){#show-favourites{margin-left:0}.brief-item img{width:90px;height:75px}}

/* Light overlay; retain the 44px touch target. */
.gallery-card .heart-control{background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.65);box-shadow:none;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
.gallery-card .heart-control svg{width:21px;height:21px;filter:drop-shadow(0 1px 1px rgba(255,255,255,.8))}
.gallery-card .heart-control:hover,.gallery-card .heart-control:focus-visible{background:rgba(255,255,255,.85)}
.gallery-card .heart-control[aria-pressed=true]{background:rgba(255,255,255,.7)}

/* White heart fill with blue outline; filled blue indicates a saved favourite. */
.gallery-card .heart-control svg{width:24px;height:24px;fill:#fff;filter:none}
.gallery-card .heart-control[aria-pressed=true] svg{fill:currentColor}

/* Full branded plan sheets, without cropping the header, footer or drawing. */
.gallery-grid .gallery-card .plan img{aspect-ratio:210 / 297;object-fit:contain;padding:8px;background:#fff}
.gallery-grid{align-items:stretch}

/* Floorplans use the entire available viewport, with the whole page fitted. */
.plan-screen{box-sizing:border-box;position:fixed;inset:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:12px;border:0;background:#eef4f7;color:#004b76;overflow:hidden}
.plan-screen[open]{display:flex;flex-direction:column;gap:8px}
.plan-screen::backdrop{background:#002b46ee}
.plan-screen-toolbar,.plan-screen-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-shrink:0}
.plan-screen button{min-width:44px;min-height:44px;padding:8px 12px;border:1px solid #bed5e4;border-radius:6px;background:#fff;color:#004b76;font:600 14px Montserrat,Arial;cursor:pointer}
.plan-screen .detail-heart{margin:0;padding:9px;display:grid;place-items:center}
.plan-screen-page{position:relative;flex:1;min-height:0;min-width:0}
.plan-screen-page img{display:block;width:100%;height:100%;object-fit:contain}
.plan-screen-nav p{margin:0;text-align:center;font:12px/1.4 Montserrat,Arial}
.plan-screen :focus-visible{outline:3px solid #1e87f0;outline-offset:2px}
@media(max-width:650px){.plan-screen{padding:8px;padding-top:max(8px,env(safe-area-inset-top));padding-bottom:max(8px,env(safe-area-inset-bottom))}}

.plan-facts{padding:0 12px 12px;font:13px/1.5 Montserrat,Arial;color:#004b76}.plan-facts p{margin:0 0 6px}.plan-facts-stats{font-weight:700}.plan-facts-width{color:#526e80;font-size:12px}.plan-facts summary{cursor:pointer;min-height:30px;display:list-item;padding-top:4px;font-weight:600}.plan-facts ul{padding-left:18px;margin:4px 0 8px}.plan-facts .plan-room-note{font-size:12px;color:#526e80}.gallery-card .gallery-open span{padding-bottom:8px}

.plan-facts{padding-top:12px}.plan-features-heading{font-weight:600;padding-top:4px}

/* Match neighbouring card heights to the tallest content in each grid row. */
.gallery-card{display:flex;flex-direction:column;align-self:stretch}
.gallery-card>.gallery-open{flex-shrink:0}
.gallery-card>.note-link{margin-top:auto}

.gallery-width-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;margin:12px 0}.gallery-width-controls[hidden]{display:none}.gallery-width-controls label{display:flex;align-items:center;gap:10px;font:600 14px Montserrat,Arial;color:#004b76}.gallery-width-controls select{min-height:44px;min-width:135px;background:white;border:1px solid #bed5e4;border-radius:6px;padding:8px 12px;font:500 14px Montserrat,Arial;color:#004b76}.gallery-width-controls small{font:12px/1.5 Montserrat,Arial;color:#526e80}

/* Compact catalogue-style filtering, without an additional mobile heading row. */
.gallery-width-controls{padding:12px 14px;border:1px solid #dbe3e8;border-radius:16px;background:#fff;display:grid;grid-template-columns:minmax(150px,260px) auto;justify-content:start;align-items:end;gap:12px;margin:12px 0}
.gallery-width-controls label{display:flex;flex-direction:column;align-items:stretch;gap:6px}
.gallery-width-controls label>span{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#404041;font-weight:700}
.gallery-width-controls select{width:100%;min-width:0;border-radius:24px;min-height:42px;font-size:12px;padding:8px 14px}
.gallery-width-reset{min-height:42px;padding:8px 18px;border:1px solid #bed5e4;border-radius:24px;color:#006ab6;background:#fff;font:500 12px Montserrat,Arial;cursor:pointer}
.gallery-width-controls[hidden]{display:none}
@media(max-width:650px){.gallery-width-controls{grid-template-columns:minmax(0,1fr) auto;padding:10px;gap:10px}.gallery-width-reset{padding:8px 14px}}

.gallery-tools .detail-heart{margin:0;margin-left:auto}.gallery-tools [hidden]{display:none}.gallery-tools{align-items:center;flex-wrap:wrap}

/* Use the same inset triangular indicator as Home Designs filter selects. */
.gallery-width-controls select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,#404041 50%),linear-gradient(135deg,#404041 50%,transparent 50%);background-position:calc(100% - 18px) calc(50% - 3px),calc(100% - 12px) calc(50% - 3px);background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:36px}

/* Mobile gallery: prioritise imagery while keeping a 44px favourite hit area. */
@media (max-width:650px){
  #work-gallery.work-gallery{width:calc(100vw - 12px);max-width:none;padding:12px 8px}
  #work-gallery .gallery-grid{gap:8px}
  #work-gallery .gallery-open:not(.plan)>span{display:none}
  #work-gallery .gallery-card .heart-control{top:0;right:0;width:44px;height:44px;border:0;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;overflow:visible;isolation:isolate}
  #work-gallery .gallery-card .heart-control::before{content:"";position:absolute;inset:6px;border:1px solid rgba(255,255,255,.65);border-radius:50%;background:rgba(255,255,255,.5);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);z-index:-1}
  #work-gallery .gallery-card .heart-control svg{width:18px;height:18px}
  #work-gallery .gallery-card .heart-control[aria-pressed=true]::before{background:rgba(255,255,255,.7)}
  #work-gallery .gallery-card .heart-control:focus-visible::before{background:rgba(255,255,255,.85)}
}

/* Mobile-only disclosure; desktop keeps the full feature list. */
.plan-features-toggle{display:none}
@media(max-width:650px){
  .plan-facts .plan-features-heading{display:none}
  .plan-facts .plan-feature-list{display:none}
  .plan-facts.features-expanded .plan-feature-list{display:block}
  .gallery-grid .plan-features-toggle{display:flex;align-items:center;justify-content:space-between;gap:6px;width:100%;min-height:44px;padding:4px 0;border:0;border-radius:0;background:transparent;font:600 12px/1.4 Montserrat,Arial;color:#004b76;text-align:left}
  .plan-features-toggle::after{content:"";width:6px;height:6px;margin-right:3px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
  .plan-features-toggle[aria-expanded=true]::after{transform:rotate(225deg)}
}

/* Keep the editor itself visible above phone keyboards; no image competes for space. */
.gallery-note-dialog{box-sizing:border-box;position:fixed;inset:auto;left:50%;top:calc(var(--gallery-note-top,0px) + 12px);transform:translateX(-50%);width:min(600px,calc(100vw - 24px));height:min(420px,calc(var(--gallery-note-height,100dvh) - 24px));max-width:none;max-height:calc(var(--gallery-note-height,100dvh) - 24px);margin:0;padding:16px;border:1px solid #c4d8e5;border-radius:14px;background:#fff;color:#304550;overflow:auto;overscroll-behavior:contain}
.gallery-note-dialog::backdrop{background:#002b46bb}.gallery-note-dialog form{display:flex;flex-direction:column;gap:10px;height:100%;min-height:0}.gallery-note-dialog h2{margin:0;color:#004b76;font:500 28px/1.15 Georgia,serif}.gallery-note-subject{margin:0;font:500 13px/1.4 Montserrat,Arial;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;flex-shrink:0}.gallery-note-dialog label{font:600 13px/1.4 Montserrat,Arial}.gallery-note-dialog label span{font-weight:400}.gallery-note-dialog textarea{box-sizing:border-box;flex:1;min-height:64px;width:100%;margin:0;padding:10px;border:1px solid #b9d0df;border-radius:8px;font:400 16px/1.4 Montserrat,Arial;resize:none}.gallery-note-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;flex-shrink:0}.gallery-note-actions button,.favourite-note>[data-gallery-note]{min-height:44px;border:1px solid #b9d0df;border-radius:24px;padding:8px 12px;background:#fff;color:#006ab6;font:500 13px/1.4 Montserrat,Arial;cursor:pointer}.gallery-note-actions button[type=submit]{background:#006ab6;color:#fff;border-color:#006ab6}.gallery-note-dialog :focus-visible{outline:2px solid #006ab6;outline-offset:2px}

/* Image navigation sits just inside the left and right photo edges. */
.plan-screen-nav{justify-content:center}.plan-screen-nav p{min-width:0}
.plan-screen .plan-screen-arrow{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;min-width:48px;padding:0;border-radius:50%;background:#fffffff2;box-shadow:0 2px 12px #002b4633;display:grid;place-items:center;z-index:1}
.plan-screen-arrow span{font:36px/1 Arial,sans-serif;display:block;margin-top:-3px}
.plan-screen-arrow[data-plan-prev]{left:calc(var(--photo-inset,0px) + 8px)}
.plan-screen-arrow[data-plan-next]{right:calc(var(--photo-inset,0px) + 8px)}
@media(max-width:650px){.plan-screen .plan-screen-arrow{width:44px;height:44px;min-width:44px}.plan-screen-arrow[data-plan-prev]{left:calc(var(--photo-inset,0px) + 4px)}.plan-screen-arrow[data-plan-next]{right:calc(var(--photo-inset,0px) + 4px)}}

/* Allow normal vertical scrolling and pinch zoom; JS handles horizontal swipes. */
.gallery-image-scroll,.plan-screen-page{touch-action:pan-y pinch-zoom}
.gallery-image-scroll img,.plan-screen-page img{user-select:none;-webkit-user-drag:none}
