/* Phone/tablet refinements only. The approved desktop layout is unchanged. */
.preview-zoom-toggle{display:none}
@media(max-width:600px){.hero-shot.hero-shot figcaption{justify-content:space-between}.hero-shot figcaption:after{content:'Tap to explore ↗';color:var(--primary);font-size:11px}}
@media(max-width:800px){
  .site-header:after{content:'';position:absolute;inset:auto 0 -1px;height:2px;background:var(--primary);transform:scaleX(var(--reading-progress,0));transform-origin:left;pointer-events:none}
  .menu-toggle{min-height:44px;border-radius:9px;transition:background .2s,color .2s}
  .menu-toggle[aria-expanded=true]{background:var(--wash);color:var(--primary)}
  .site-header nav.open{animation:mobile-menu-in .22s ease-out}
  .site-header nav a:not(.button){min-height:48px;display:flex;align-items:center}
  .tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;padding:4px;border:1px solid #e7dee2;border-radius:11px;background:#f4ecef}
  .tabs button{min-width:0;min-height:44px;padding:10px 5px;border:0;border-radius:7px;text-align:center;font-size:14px;transition:background .2s,color .2s,box-shadow .2s}
  .tabs button[aria-selected=true]{background:white;color:var(--primary);box-shadow:0 2px 5px #38131e0b}
  .role-showcase{gap:20px}.role-panel>p{margin-top:16px;font-size:16px;line-height:1.6}
  .preview-frame{border-radius:12px;box-shadow:0 8px 24px #38131e08}
  .preview-frame .preview-caption{padding:12px 14px;gap:8px}
  .preview-caption small{white-space:nowrap}
  .benefit-step{padding:24px;border:1px solid var(--line);border-radius:14px;margin-bottom:20px;background:white;overflow:hidden}
  .benefit-step:last-child{margin-bottom:0}.step-number{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;background:var(--wash);margin-bottom:18px}
  .benefit-step h3{font-size:23px}.benefit-step p{font-size:16px}
  .mobile-benefit{position:relative;overflow:hidden;padding:0;background:var(--wash);text-align:left;cursor:zoom-in;border-radius:9px;margin-top:24px;transition:transform .65s var(--ease),opacity .65s var(--ease)}
  .mobile-benefit img{display:block;width:100%;height:auto}
  .mobile-benefit:after{content:'Explore screen ↗';display:block;font-size:12px;font-weight:500;padding:10px 12px;color:var(--primary);background:white;border-top:1px solid var(--line)}
  .benefit-step.pending .mobile-benefit{transform:translateY(12px) scale(.98);opacity:.4}
  .feature-grid summary,.faq-list summary{min-height:48px;align-content:center}
  .feature-grid details[open] p,.faq-list details[open] p{animation:mobile-menu-in .25s ease-out}
  .enquiry-actions{width:100%}.enquiry-actions .button{width:100%;min-height:50px}.contact-links a{min-height:44px;display:inline-flex;align-items:center}
  .product-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);border-radius:14px;overflow:hidden}
  .product-dialog[open]{display:flex;flex-direction:column;animation:mobile-menu-in .22s ease-out}
  .product-dialog header{position:relative;flex-shrink:0;gap:10px;padding:14px 16px}
  .product-dialog h2{font-size:17px}.product-dialog header p{font-size:11px}
  .product-image-viewport{overflow:auto;overscroll-behavior:contain;min-height:0;background:var(--wash)}
  .product-image-viewport img{display:block;width:100%;max-width:none;height:auto}
  .product-image-viewport.zoomed img{width:960px}
  .preview-zoom-toggle{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:48px;padding:12px 16px;background:white;border:0;border-top:1px solid var(--line);font-size:13px;font-weight:600;color:var(--primary);flex-shrink:0}
  .preview-zoom-toggle:after{content:'+';font-size:20px}.preview-zoom-toggle[aria-pressed=true]:after{content:'−'}
  .quote-dialog{width:calc(100vw - 16px);height:calc(100dvh - 16px);border-radius:12px}
  .quote-dialog header,.quote-dialog footer{flex-shrink:0}
  .quote-dialog footer a{display:inline-flex;min-height:40px;align-items:center}
  @keyframes mobile-menu-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
}
@media(max-width:600px){
  .wrap{padding-inline:max(22px,env(safe-area-inset-left));padding-right:max(22px,env(safe-area-inset-right))}
  .hero{padding-top:34px}.hero h1{font-size:36px;line-height:1.16;letter-spacing:-.035em}.hero .lead{max-width:340px;margin:0 auto 24px}
  .hero .actions{display:flex;flex-direction:column;gap:8px;max-width:340px;margin:auto}.hero .actions .button{width:100%;min-height:50px;font-size:15px}.hero .text-link{display:flex;align-items:center;justify-content:center;min-height:44px;width:100%}
  .hero-shot{margin-top:24px;border-radius:12px 12px 0 0}.hero-shot .image-zoom{max-height:none}.hero-shot figcaption{font-size:12px;padding:10px 12px}
  .section{padding-block:48px}.section-heading{margin-bottom:24px}.section-heading h2{font-size:27px;line-height:1.25}.eyebrow{font-size:11px;letter-spacing:.07em}
  .benefit-step{padding:20px}.benefit-step h3{font-size:22px}.benefit-step p br{display:none}
  .enquiry{padding:28px 24px}.enquiry h2{font-size:30px}.faq-section{margin-top:40px}.faq-list p{font-size:15px}.footer{padding-bottom:max(24px,env(safe-area-inset-bottom))}
}
@media(max-width:350px){.tabs button{font-size:12px}.preview-caption{font-size:11px}.preview-caption small{font-size:10px}.product-dialog header{padding-inline:12px}}
@media(max-width:800px) and (prefers-reduced-motion:reduce){.benefit-step.pending .mobile-benefit{transform:none;opacity:1}.site-header nav.open,.feature-grid details[open] p,.faq-list details[open] p{animation:none}}