/* Soffice site enhancements: accessible controls, mobile images and contact anti-spam field. */
.soffice-product-card{display:block;background:transparent;border-radius:.75rem;overflow:hidden;cursor:pointer;text-align:inherit}
.soffice-product-card:focus-visible{outline:4px solid #176f82;outline-offset:4px}
.soffice-product-card img{display:block;width:100%;height:auto;aspect-ratio:7/10;object-fit:contain;background:#ecf6f6}
#banners img{display:block;width:auto;height:auto;max-width:100%;max-height:640px;margin-inline:auto;object-fit:contain}
.soffice-honeypot{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
#contact,#about,[id^="aquarium-filtration-wool"]{scroll-margin-top:6.5rem}
@media(max-width:576px){.masthead{padding-top:9rem!important}.navbar-brand img{max-width:160px}.portfolio-modal .modal-body{padding:1.2rem!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}}

/* Product details: always bounded by the viewport, even for 1800px tall source images. */
.soffice-product-modal .modal-dialog{max-width:min(720px,calc(100vw - 2rem));margin:1rem auto}
.soffice-product-modal .modal-content{max-height:calc(100dvh - 2rem);overflow:hidden}
.soffice-product-modal .modal-body{overflow-y:auto;overscroll-behavior:contain;padding:1rem 1.5rem 1.5rem}
.soffice-product-modal .portfolio-modal-title{font-size:clamp(1.2rem,2.5vw,1.7rem);line-height:1.35}
.soffice-product-modal .divider-custom{margin:.75rem auto 1rem}
.soffice-product-modal .soffice-modal-picture{display:block;margin:0 auto 1rem}
.soffice-product-modal .soffice-modal-image{display:block;max-width:min(100%,390px);max-height:min(52dvh,520px);width:auto;height:auto;object-fit:contain;margin-inline:auto}
.soffice-product-modal .modal-body p{max-width:62ch;margin-inline:auto;line-height:1.55}
@media (max-width:576px){
 .soffice-product-modal .modal-dialog{max-width:calc(100vw - 1rem);margin:.5rem auto}
 .soffice-product-modal .modal-content{max-height:calc(100dvh - 1rem)}
 .soffice-product-modal .modal-body{padding:.75rem!important}
 .soffice-product-modal .soffice-modal-image{max-width:min(100%,280px);max-height:38dvh}
 .soffice-product-modal .modal-body .btn{margin-bottom:.5rem}
}

/* Indexable product detail view; images remain bounded, without changing modal. */
.soffice-product-page-image{max-height:min(70vh,700px);width:auto;max-width:100%;object-fit:contain;background:#f3f8f8;border-radius:1rem}
.soffice-product-link{min-height:2.25rem}
