/* Responsive phone and small-tablet layout; desktop styling stays in style.css. */
:root{--nav-offset:95px}
html{scroll-padding-top:var(--nav-offset);-webkit-text-size-adjust:100%;text-size-adjust:100%}
[hidden]{display:none!important}
.mobile-menu-toggle,.mobile-only{display:none}
.site-header nav a,.text-link,.diagram-top button{touch-action:manipulation}
.intro>div,.section-heading>div,.movement-layout>div,.outlook-inner>div,.vessel-pair>figure,.monitoring-grid>figure,.dimensions>div{min-width:0}
@media(max-width:1050px){
 .movement-layout{grid-template-columns:minmax(0,1fr);gap:32px}
 .motion-diagram{width:100%;max-width:700px;justify-self:center}
 .movement-copy{width:100%;max-width:760px;justify-self:center}
}
@media(max-width:900px){
 :root{--page-gutter:clamp(16px,4.6vw,28px);--safe-gutter:max(var(--page-gutter),env(safe-area-inset-left),env(safe-area-inset-right))}
 html{scroll-padding-top:var(--nav-offset,80px)}
 body{font-size:1rem;line-height:1.65}
 .site-header{height:auto;min-height:64px;padding:10px var(--safe-gutter);padding-top:max(10px,env(safe-area-inset-top));gap:10px 20px;flex-wrap:wrap;justify-content:space-between}
 .site-header .brand{min-height:44px}
 .site-header .brand img{width:110px}
 .mobile-menu-toggle{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:44px;padding:8px 14px;background:transparent;border:0;border-radius:var(--radius-control);color:var(--blue);font-size:1rem;cursor:pointer;touch-action:manipulation}
 .mobile-menu-toggle{width:44px;padding:8px}
 .menu-symbol{position:relative;display:block;width:28px;height:18px}
 .menu-symbol span{position:absolute;left:0;width:28px;height:1.5px;border-radius:1px;background:currentColor}
 .menu-symbol span:nth-child(1){top:0}
 .menu-symbol span:nth-child(2){top:8px}
 .menu-symbol span:nth-child(3){top:16px;width:18px}
 .mobile-menu-toggle[aria-expanded="true"] .menu-symbol span:nth-child(1){top:8px;transform:rotate(45deg)}
 .mobile-menu-toggle[aria-expanded="true"] .menu-symbol span:nth-child(2){opacity:0}
 .mobile-menu-toggle[aria-expanded="true"] .menu-symbol span:nth-child(3){top:8px;width:28px;transform:rotate(-45deg)}
 .site-header nav{position:absolute;top:calc(100% + 8px);left:var(--safe-gutter);right:var(--safe-gutter);width:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;border:1px solid var(--line);border-radius:var(--radius-panel);padding:12px;background:var(--white);box-shadow:0 12px 32px #06122b14;max-height:calc(100dvh - 96px);overflow-y:auto;overscroll-behavior:contain}
 .site-header nav[data-mobile-open="false"]{display:none}
 .site-header nav a{display:flex;align-items:center;min-height:48px;padding:12px;border-radius:var(--radius-control);background:transparent;font-size:.9375rem;line-height:1.4}
 .site-header nav a:hover,.site-header nav a[aria-current="location"]{background:transparent;color:var(--blue)}
 .section-shell,.hero-content{width:calc(100% - 2 * var(--safe-gutter));max-width:680px}
 .hero{height:auto;min-height:0;max-height:none;display:flex;flex-direction:column}
 .hero-content{padding:30px 0}
 .hero-image{height:auto;aspect-ratio:16/9;object-fit:contain;object-position:center}
 .hero .eyebrow{font-size:.75rem;letter-spacing:.1em;max-width:350px}
 .hero h1{font-size:clamp(2.35rem,10.3vw,3.75rem);line-height:1.05;margin:20px 0;letter-spacing:-.045em}
 .text-link{min-height:44px;gap:22px;font-size:1rem;margin-top:20px}
 .hero-bottom{padding:14px 0;font-size:.75rem}
 h2{font-size:clamp(1.8rem,7.4vw,2.2rem);line-height:1.17;letter-spacing:-.035em;overflow-wrap:break-word}
 h2 br{display:none}
 .intro{padding-top:48px;padding-bottom:48px;grid-template-columns:minmax(0,1fr);gap:24px}
 .intro .lead{font-size:1.2rem;line-height:1.5}
 .section-heading{margin-bottom:24px}
 .section-heading>p{margin-top:18px;font-size:1rem}
 .system,.delivery,.movement{padding-bottom:48px}
 .photo-tag{display:none}
 .marker{width:28px;height:28px;font-size:.875rem;box-shadow:0 0 0 3px #ffffff25}
 .marker-one,.marker-two{top:23%}
 .system-key{gap:20px;grid-template-columns:minmax(0,1fr);padding:24px 0 28px}
 .system-key h3{font-size:1.125rem}
 .system-key p{font-size:1rem}
 .dimensions{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:0;border:0}
 .dimensions>div:nth-child(n){padding:18px 16px;border:1px solid #e0e8f2;border-radius:var(--radius-panel);background:var(--pale)}
 .dimensions strong{font-size:clamp(1.65rem,7vw,2rem)}
 .dimensions span{font-size:.875rem;line-height:1.5;overflow-wrap:break-word}
 .figure-note,.note,.movement-copy .note,.motion-diagram .figure-note{font-size:.875rem;line-height:1.65}
 .vessel-pair,.monitoring-grid{grid-template-columns:minmax(0,1fr);gap:22px}
 .vessel-pair>figure,.monitoring-grid>figure{border:1px solid var(--line);border-radius:var(--radius-panel);overflow:hidden;background:white}
 .vessel-pair img,.monitoring-grid img{border-radius:0;aspect-ratio:16/9}
 .vessel-pair figcaption,.monitoring-grid figcaption{padding:20px}
 .vessel-pair h3,.monitoring-grid h3{font-size:1.3rem}
 .injector-block{grid-template-columns:minmax(0,1fr);margin-top:34px}
 .injector-copy{padding:28px 22px}
 .injector-copy h2{font-size:1.9rem}
 .injector-block img{height:auto;min-height:0;aspect-ratio:16/9;object-fit:contain}
 .injector-block figcaption{padding:14px 20px;font-size:.875rem}
 .movement-layout{grid-template-columns:minmax(0,1fr);gap:26px}
 .motion-diagram{padding:18px 14px;margin:0;width:100%;min-width:0}
 .diagram-top{align-items:center;flex-wrap:wrap;gap:14px}
 .diagram-top .eyebrow{font-size:.75rem;max-width:160px;flex:1 1 130px}
 .diagram-top button{min-height:44px;min-width:116px;padding:9px 12px;font-size:.875rem;white-space:normal;line-height:1.4}
 .mobile-only{display:block}
 .motion-diagram svg{margin:0;overflow:hidden}
 .motion-diagram svg>.svg-main,.motion-diagram svg>.svg-label,.motion-diagram svg>.svg-small,.diagram-desktop-label{display:none}
 .diagram-mobile-direction{margin:18px 0 0;text-align:center;font-size:1rem;font-weight:600;line-height:1.5}
 .diagram-mobile-direction span{color:var(--blue);margin-left:8px}
 .diagram-mobile-markers circle{fill:#0000ff;stroke:white;stroke-width:2}
 .diagram-mobile-markers text{fill:white;font-family:var(--font);font-size:34px;font-weight:600;text-anchor:middle;dominant-baseline:central}
 .diagram-mobile-key{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;padding:0;margin:0;list-style:none;font-size:.875rem;line-height:1.5}
 .diagram-mobile-key li{display:flex;align-items:flex-start;gap:8px}
 .diagram-mobile-key li:last-child{grid-column:1/-1}
 .diagram-mobile-key li span{display:grid;place-items:center;flex:0 0 24px;height:24px;border-radius:50%;background:var(--blue);color:white;font-size:.875rem}
 .diagram-mobile-caption{font-size:1rem;font-weight:500;margin:18px 0 14px;line-height:1.5}
 .movement-copy>div{padding-left:34px}
 .movement-copy h3{line-height:1.3}
 .dilution-photo{margin-top:30px}
 .dilution-photo img{aspect-ratio:16/9;object-fit:contain}
 .dilution-photo figcaption{font-size:.875rem}
 .chemistry>.section-shell{padding-top:48px;padding-bottom:48px}
 #chemistry{scroll-margin-top:-16px}
 .chemistry-heading h2{font-size:clamp(1.8rem,7.4vw,2.2rem)}
 .chemistry-heading>p:last-child{font-size:1rem;margin-top:24px}
 .chemistry-sequence{grid-template-columns:minmax(0,1fr);gap:26px;margin:32px 0}
 .chemistry-sequence article{border:1px solid #ffffff25;border-radius:var(--radius-panel);background:#ffffff06;position:static;padding:20px;min-height:0;display:grid;grid-template-columns:28px minmax(0,1fr);gap:16px 12px}
 .chem-number{position:static;grid-column:1;grid-row:1;align-self:center;font-size:.875rem}
 .chem-symbol{position:static;grid-column:2;grid-row:1;font-size:2.4rem;line-height:1.2;margin:0;letter-spacing:-.04em}
 .chem-symbol>span{font-size:2rem}
 .chemistry-sequence h3{grid-column:1/-1;font-size:1.2rem;line-height:1.3}
 .chemistry-sequence p{grid-column:1/-1;font-size:1rem;margin:0}
 .chemistry-bottom{grid-template-columns:minmax(0,1fr);gap:20px;font-size:1rem}
 .monitoring{padding-top:48px;padding-bottom:48px}
 .monitoring-principles{grid-template-columns:minmax(0,1fr);gap:0;margin-top:32px;padding-top:0;border-top:1px solid var(--line)}
 .monitoring-principles article{min-width:0;padding:24px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent}
 .monitoring-principles h3{margin-top:10px;line-height:1.3}
 .monitoring-note{margin-top:24px}
 .outlook{padding-top:36px;padding-bottom:40px}
 .outlook-inner{grid-template-columns:minmax(0,1fr);gap:24px}
 .references .reference-links{grid-template-columns:minmax(0,1fr);gap:12px}
 .reference-links>a{min-height:48px;padding:18px}
 .reference-links>a+a{border-top:1px solid var(--line)}
 .reference-links strong{font-size:1rem;line-height:1.5;gap:14px;overflow-wrap:break-word}
 .references{padding-bottom:32px}
 footer{padding:28px var(--safe-gutter);flex-direction:column;align-items:flex-start;gap:20px;padding-bottom:max(28px,env(safe-area-inset-bottom))}
 footer>span{font-size:.875rem}
 footer>span:last-child{width:100%;text-align:left;border-top:1px solid #ffffff30;padding-top:16px}
}
@media(max-width:1000px) and (orientation:landscape){
 .site-header{padding-left:max(30px,env(safe-area-inset-left));padding-right:max(30px,env(safe-area-inset-right))}
 .hero{min-height:560px;height:auto}
 .hero-content{padding-top:45px;padding-bottom:115px}
 .section-shell,.hero-content{max-width:min(680px,calc(100% - 2 * max(24px,env(safe-area-inset-left),env(safe-area-inset-right))))}
}
@media(max-width:900px) and (orientation:landscape){.hero{min-height:0}.hero-content{padding:28px 0}.site-header{min-height:56px;padding-top:max(6px,env(safe-area-inset-top));padding-bottom:6px}}
@media(max-width:360px){.vessel-pair figcaption,.monitoring-grid figcaption,.chemistry-sequence article{padding:18px}.dimensions>div:nth-child(n){padding:16px 12px}.diagram-top{gap:10px}.diagram-top .eyebrow{flex-basis:110px}.diagram-mobile-key{grid-template-columns:minmax(0,1fr)}}
@media print{.mobile-menu-toggle{display:none!important}.site-header nav[data-mobile-open="false"]{display:flex}}
