/* Phone layout: an open photograph first, readable live text beneath it. Desktop reference art is untouched. */
@media(max-width:980px){
 body{overflow-wrap:break-word}
 .shell,.hero-copy,.about-copy,.prose,.article-body,.contact-grid>div,.form-panel,.rate-card,.service-card,.product-guide-card,.footer-grid>div,.ult-grid>div{min-width:0}
 .site-header .menu-toggle{min-width:44px;min-height:44px;justify-content:flex-end}
 .header-inner nav a{min-height:44px}
 input:not([type=hidden]),textarea,select{font-size:16px!important}
 .button,.wsite-button,.product-shop-link{min-height:44px}
 .product-shop-link{display:inline-flex;align-items:center}
 .purium-section-nav a{display:inline-flex;align-items:center;min-height:44px}
 .contact-link{min-height:44px;overflow-wrap:anywhere}
 .contact-link span[aria-hidden]{flex-shrink:0}
 .video-frame{min-width:0;width:100%}
 .video-frame iframe{max-width:100%}
 .about-image{max-width:100%}
 .footer-grid>div>a{overflow-wrap:anywhere}
 .article-sidebar nav{max-width:100%}
}
@media(max-width:700px){
 .immersive-home #main>.hero-immersive{--hero-photo-height:clamp(245px,72vw,330px);display:block;min-height:0;height:auto;padding:calc(var(--hero-photo-height) + 16px) 24px 42px;background:#38223c}
 .immersive-home .hero-immersive>.hero-backdrop{position:absolute;top:0;bottom:auto;left:0;right:0;width:100%;max-width:100%;height:var(--hero-photo-height);object-fit:cover;object-position:50% 28%;opacity:1;filter:none}
 .immersive-home .hero.hero-immersive:before{top:calc(var(--hero-photo-height) - 60px);bottom:auto;left:0;right:0;width:100%;height:75px;background:linear-gradient(to bottom,rgba(56,34,60,0),#38223c 85%);opacity:1;transform:none}
 .immersive-home .hero.hero-immersive:after{left:auto;right:-15px;bottom:0;top:auto;width:105px;height:180px;opacity:.2}
 .immersive-home .hero-immersive .hero-copy{position:relative;max-width:100%;padding:0;margin:0}
 .immersive-home .hero-immersive h1{font-size:clamp(37px,9.7vw,58px);line-height:1.12;letter-spacing:-1px}
 .immersive-home .hero-immersive h1 em{letter-spacing:-1.2px}
 .immersive-home .hero-immersive .hero-small{font-size:21px;line-height:1.45;max-width:560px}
 .immersive-home .hero-immersive .hero-actions{gap:20px;margin-top:27px;max-width:100%}
 .immersive-home .hero-immersive .hero-actions .button{max-width:100%;white-space:normal;text-align:left;font-size:17px;padding:15px 25px;gap:15px}
 .immersive-home .hero-immersive .hero-actions .text-link{font-size:21px;min-height:44px;align-items:center}
 .immersive-home .hero-immersive .hero-footnote{margin-top:23px;font-size:11px;letter-spacing:.3px;line-height:1.8;max-width:100%;white-space:normal}
 .hero-divider{margin:24px 0 21px}
 .product-guide-actions{width:100%}
 .product-guide-actions .text-link{min-height:44px;align-items:center;white-space:normal}
 .hero-actions{max-width:100%}
 .hero-actions .button{max-width:100%;white-space:normal}
 #contact-form{grid-template-columns:minmax(0,1fr)}
 #contact-form input,#contact-form textarea{max-width:100%;min-width:0}
 #contact-form .wsite-button{width:100%;min-height:48px}
 .section-top>.text-link{white-space:normal}
 .resource-themes{max-width:100%;flex-wrap:wrap}
 .resource-themes span{white-space:normal}
 .page-hero h1{font-size:clamp(36px,9.5vw,48px)}
 .purium-subtitle{font-size:clamp(22px,6vw,27px)}
 .closing-inner .button{min-height:48px}
 .footer-bottom{flex-wrap:wrap;gap:12px}
}
@media(max-width:480px){
 .services-grid{grid-template-columns:minmax(0,1fr)}
 .service-card{min-height:0;padding:26px}
 .service-card h3{font-size:29px;max-width:100%}
 .service-card p{font-size:14px;line-height:1.8;margin-bottom:24px}
 .service-card-top{margin-bottom:21px}
 .service-card-link{font-size:11px;min-height:30px;display:inline-flex;align-items:center}
 .article-body .section-photo,.article-body .section-photo-right{float:none;clear:both;width:min(var(--photo-width,220px),100%);max-width:100%;margin:4px auto 25px}
 .credentials-editorial .credential-item{max-width:100%;min-width:0;align-items:center}
 .credential-item>span{min-width:0;overflow-wrap:normal}
 .form-panel{padding:22px}
 .product-guide-card{padding:24px}
 .purium-hero-photo img{height:220px}
 .brand{max-width:calc(100% - 52px)}
}
@media(max-width:370px){
 .immersive-home #main>.hero-immersive{padding-inline:20px;min-height:0}
 .immersive-home .hero-immersive h1{font-size:35px}
 .immersive-home .hero-immersive .hero-small{font-size:19px}
 .immersive-home .hero-immersive .hero-actions .button{font-size:16px;padding:14px 21px}
 .immersive-home>.site-header .brand>span{font-size:22px}
 .immersive-home>.site-header .brand img{width:27px}
 .shell{width:calc(100% - 32px)}
}
/* Keep the clear photo area in phone landscape and tablet viewports too. */
@media(min-width:701px) and (max-width:980px){
 .immersive-home #main>.hero-immersive{--hero-photo-height:clamp(330px,48vw,430px);min-height:0;height:auto;padding:calc(var(--hero-photo-height) + 28px) 5.6vw 55px}
 .immersive-home .hero-immersive>.hero-backdrop{top:0;bottom:auto;left:0;right:0;width:100%;max-width:100%;height:var(--hero-photo-height);object-fit:cover;object-position:50% 28%;opacity:1}
 .immersive-home .hero.hero-immersive:before{top:calc(var(--hero-photo-height) - 65px);bottom:auto;left:0;right:0;width:100%;height:90px;background:linear-gradient(to bottom,rgba(56,34,60,0),#38223c 85%);opacity:1}
 .immersive-home .hero-immersive .hero-copy{max-width:100%}
 .immersive-home .hero-immersive .hero-small{max-width:700px}
 .immersive-home .hero-immersive .hero-small br{display:none}
 .immersive-home .hero.hero-immersive:after{left:auto;right:0;top:auto;bottom:0;width:140px;height:210px;opacity:.2}
}
@media(max-width:980px){.immersive-home .hero-immersive .hero-small{margin-top:26px}}