/* CSS Reset and Normalize */ *,*::before,*::after {box-sizing:border-box;margin:0;padding:0;} html {line-height:1.15;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;scroll-behavior:smooth;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} body {margin:0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-display:swap;} img {max-width:100%;height:auto;display:block;} a {text-decoration:none;color:inherit;} button {font-family:inherit;font-size:100%;line-height:1.15;margin:0;border:none;background:none;cursor:pointer;} /* CSS Custom Properties for Theme Variables */ :root {/* Light mode colors */ --primary-bg:#ffffff;--secondary-bg:#f8f9fa;--text-primary:#212529;--text-secondary:#495057;/* Improved contrast from #6c757d */ --accent-color:#008b72;/* Darker teal for better contrast on light backgrounds */ --border-color:#dee2e6;--shadow-color:rgba(0,0,0,0.1);/* Typography */ --font-size-xs:0.75rem;--font-size-base:1rem;--font-size-sm:0.875rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;/* Spacing */ --spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-2xl:3rem;--spacing-3xl:4rem;/* Responsive breakpoints */ --mobile:320px;--tablet:768px;--desktop:1024px;--large-desktop:1200px;/* Border radius */ --border-radius-sm:0.25rem;--border-radius-md:0.5rem;--border-radius-lg:0.75rem;/* Transitions */ --transition-fast:0.15s ease-in-out;--transition-normal:0.3s ease-in-out;--transition-slow:0.5s ease-in-out;} /* Dark mode theme variables */ @media (prefers-color-scheme:dark) {:root {--primary-bg:#1a1a1a;--secondary-bg:#2d2d2d;--text-primary:#ffffff;--text-secondary:#cccccc;/* Improved contrast from #b0b0b0 */ --accent-color:#00f5d4;/* Bright teal for dark mode */ --border-color:#404040;--shadow-color:rgba(0,0,0,0.3);}} /* Theme-aware logo switching */ .logo {transition:opacity var(--transition-normal);max-width:100%;height:auto;} /* Light mode:show light logo,hide dark logo */ .logo-light {display:block;} .logo-dark {display:none;} /* Dark mode:hide light logo,show dark logo */ @media (prefers-color-scheme:dark) {.logo-light {display:none;} .logo-dark {display:block;}} /* Base body styles with theme variables */ body {background-color:var(--primary-bg);color:var(--text-primary);transition:background-color var(--transition-normal),color var(--transition-normal);} /* Typography styles */ h1,h2,h3,h4,h5,h6 {font-weight:600;line-height:1.2;margin:0;color:var(--text-primary);} h1 {font-size:var(--font-size-4xl);} h2 {font-size:var(--font-size-3xl);} h3 {font-size:var(--font-size-2xl);} h4 {font-size:var(--font-size-xl);} h5 {font-size:var(--font-size-lg);} h6 {font-size:var(--font-size-base);} p {margin:0;line-height:1.6;color:var(--text-primary);} /* Responsive typography */ @media (max-width:768px) {h1 {font-size:var(--font-size-3xl);} h2 {font-size:var(--font-size-2xl);} h3 {font-size:var(--font-size-xl);}} /* Ensure all elements inherit theme transitions */ * {transition:background-color var(--transition-normal),color var(--transition-normal),border-color var(--transition-normal),box-shadow var(--transition-normal);} /* Theme toggle */ .theme-toggle-container {position:fixed;bottom:20px;right:20px;z-index:1000;} .theme-toggle {background:var(--accent-color);background:#008b72;/* Fallback */ border:none;border-radius:50%;width:50px;height:50px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px var(--shadow-color);box-shadow:0 2px 10px rgba(0,0,0,0.2);/* Fallback */ transition:all var(--transition-normal);transition:all 0.3s ease-in-out;/* Fallback */ font-size:20px;color:white;} .theme-toggle:hover {transform:scale(1.1);box-shadow:0 4px 15px var(--shadow-color);box-shadow:0 4px 15px rgba(0,0,0,0.3);/* Fallback */} .theme-toggle:focus {outline:2px solid var(--accent-color);outline:2px solid #008b72;/* Fallback */ outline-offset:2px;} .theme-toggle-icon {transition:transform var(--transition-fast);transition:transform 0.15s ease-in-out;/* Fallback */} /* Dark mode styles for toggle */ @media (prefers-color-scheme:dark) {.theme-toggle {background:var(--accent-color);background:#00f5d4;/* Fallback */} .theme-toggle:focus {outline-color:var(--accent-color);outline-color:#00f5d4;/* Fallback */}} /* Manual dark mode class */ .dark-theme {--primary-bg:#1a1a1a;--secondary-bg:#2d2d2d;--text-primary:#ffffff;--text-secondary:#cccccc;--accent-color:#00f5d4;--border-color:#404040;--shadow-color:rgba(0,0,0,0.3);} .dark-theme .logo-light {display:none;} .dark-theme .logo-dark {display:block;} .light-theme {--primary-bg:#ffffff;--secondary-bg:#f8f9fa;--text-primary:#212529;--text-secondary:#495057;--accent-color:#008b72;--border-color:#dee2e6;--shadow-color:rgba(0,0,0,0.1);} .light-theme .logo-light {display:block;} .light-theme .logo-dark {display:none;} /* Responsive theme toggle */ @media (max-width:768px) {.theme-toggle-container {bottom:15px;right:15px;} .theme-toggle {width:44px;height:44px;font-size:18px;}} /* Skip navigation for accessibility */ .skip-navigation {position:absolute;top:0;left:0;z-index:1000;} .skip-link {position:absolute;top:-100px;left:6px;background:var(--accent-color);color:white;padding:12px 16px;text-decoration:none;border-radius:var(--border-radius-sm);font-weight:600;font-size:var(--font-size-sm);z-index:1001;transition:top var(--transition-fast);border:2px solid transparent;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;white-space:nowrap;opacity:0;visibility:hidden;} .skip-link:nth-child(2) {left:200px;} .skip-link:nth-child(3) {left:380px;} .skip-link:focus {top:6px;outline:2px solid white;outline-offset:2px;opacity:1;visibility:visible;} /* Ensure skip links work on mobile */ @media (max-width:768px) {.skip-link {font-size:var(--font-size-xs);padding:8px 12px;} .skip-link:nth-child(2) {left:140px;} .skip-link:nth-child(3) {left:260px;}} /* CSS Animations and Visual Enhancements */ /* Simple fade-in animation for page load */ @keyframes fadeIn {from {opacity:0;transform:translateY(10px);} to {opacity:1;transform:translateY(0);}} /* Apply subtle entrance animation to main sections */ .hero-section,.services-section,.contact-section {animation:fadeIn 0.6s ease-out;} /* Enhanced hover effects for interactive elements with performance optimizations */ .contact-item:hover {-webkit-transform:translateY(-2px);-ms-transform:translateY(-2px);transform:translateY(-2px);box-shadow:0 6px 20px var(--shadow-color);box-shadow:0 6px 20px rgba(0,0,0,0.1);/* Fallback */ border-color:var(--accent-color);border-color:#008b72;/* Fallback */ will-change:transform,box-shadow;} .service-item:hover,.service-item:focus {color:var(--accent-color);transform:translateY(-1px);outline:none;} .practice-image-container:hover {box-shadow:0 8px 25px var(--shadow-color);transform:translateY(-2px);} .practice-image:hover {transform:scale(1.02);} .contact-link:hover {color:var(--accent-color);} .logo:hover {transform:scale(1.02);} /* Smooth theme switching transitions */ * {transition:background-color var(--transition-normal),color var(--transition-normal),border-color var(--transition-normal),box-shadow var(--transition-normal),transform var(--transition-fast);} /* Respect user's motion preferences */ @media (prefers-reduced-motion:reduce) {*,*::before,*::after {animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important;} .logo {transition:none;} .skip-link {transition:none;} .hero-section,.services-section,.contact-section {animation:none !important;} .contact-item:hover,.service-item:hover,.practice-image-container:hover,.practice-image:hover,.contact-link:hover,.logo:hover {transform:none !important;}} /* Main page structure using CSS Grid with fallbacks */ .page-container {/* Fallback for older browsers */ display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;/* Modern grid layout */ display:grid;grid-template-rows:auto 1fr auto;min-height:100vh;max-width:var(--large-desktop);max-width:1200px;/* Fallback for older browsers */ margin:0 auto;padding:0 var(--spacing-md);padding:0 1rem;/* Fallback */} /* Header styles */ header {padding:var(--spacing-lg) 0;border-bottom:1px solid var(--border-color);background-color:var(--primary-bg);} /* Header container with cross-browser support */ .header-container {display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;max-width:var(--large-desktop);max-width:1200px;/* Fallback */ margin:0 auto;padding:0 var(--spacing-md);padding:0 1rem;/* Fallback */} /* Logo container with cross-browser support */ .logo-container {display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;width:100%;} /* Logo base styles with performance optimizations */ .logo {max-width:100%;height:auto;transition:opacity var(--transition-normal);transition:opacity 0.3s ease-in-out;/* Fallback */ will-change:opacity;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0);} /* Responsive logo sizing */ @media (max-width:480px) {.logo {max-width:180px;height:auto;}} @media (min-width:481px) and (max-width:768px) {.logo {max-width:200px;height:auto;}} @media (min-width:769px) {.logo {max-width:250px;height:auto;}} /* Main content area using Flexbox with fallbacks */ .main-content {display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:var(--spacing-2xl);padding:var(--spacing-2xl) 0;padding:3rem 0;/* Fallback */} /* Fallback for gap property in older browsers */ @supports not (gap:1rem) {.main-content > * + * {margin-top:3rem;}} /* Section layouts using Flexbox */ .section {display:flex;flex-direction:column;gap:var(--spacing-lg);} /* Content grid for larger sections with fallbacks */ .content-grid {/* Fallback for older browsers */ display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;/* Modern grid layout */ display:grid;grid-template-columns:1fr;gap:var(--spacing-xl);-webkit-box-align:start;-ms-flex-align:start;align-items:start;} /* Fallback for gap property */ @supports not (gap:1rem) {.content-grid > * + * {margin-top:2rem;}} /* Contact section using Flexbox */ .contact-section {display:flex;flex-direction:column;gap:var(--spacing-md);} .contact-item {display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm);border-radius:var(--border-radius-md);transition:background-color var(--transition-fast);} .contact-item:hover {background-color:var(--secondary-bg);} /* Mobile-first responsive breakpoints */ /* Tablet styles */ @media (min-width:768px) {.page-container {padding:0 var(--spacing-xl);} .header-container {padding:0 var(--spacing-xl);} .main-content {gap:var(--spacing-3xl);padding:var(--spacing-3xl) 0;} .content-grid {grid-template-columns:1fr 1fr;gap:var(--spacing-2xl);} .contact-section {flex-direction:row;flex-wrap:wrap;gap:var(--spacing-lg);} .contact-item {flex:1;min-width:200px;justify-content:center;}} /* Desktop styles */ @media (min-width:1024px) {.page-container {padding:0 var(--spacing-2xl);} .header-container {padding:0 var(--spacing-2xl);} .main-content {padding:var(--spacing-3xl) 0;} .content-grid {grid-template-columns:2fr 1fr;gap:var(--spacing-3xl);} .section {gap:var(--spacing-xl);}} /* Large desktop styles */ @media (min-width:1200px) {.main-content {gap:4rem;} .content-grid {gap:4rem;}} /* Services Section Styles */ .services-section {padding:var(--spacing-lg) 0;background-color:var(--primary-bg);} .services-container {max-width:var(--large-desktop);margin:0 auto;padding:0 var(--spacing-md);} .services-section h2 {font-size:var(--font-size-2xl);font-weight:600;text-align:center;margin-bottom:var(--spacing-lg);color:var(--text-primary);line-height:1.2;} .services-list {list-style:none;padding:0;margin:0 auto var(--spacing-xl) auto;display:grid;grid-template-columns:1fr;gap:var(--spacing-sm);justify-items:center;} .service-item {font-size:var(--font-size-sm);font-weight:400;color:var(--text-secondary);padding:var(--spacing-xs) var(--spacing-md);transition:all var(--transition-normal);line-height:1.4;text-align:center;border-radius:var(--border-radius-sm);} .service-item:hover {color:var(--accent-color);transform:translateY(-1px);} .approach-section {text-align:center;margin:0 auto;padding:0 var(--spacing-lg);} .approach-section p {padding:var(--spacing-md) var(--spacing-xl);text-align:initial;} .approach-section h3 {font-size:var(--font-size-lg);font-weight:600;color:var(--accent-color);margin-bottom:var(--spacing-md);line-height:1.3;} .approach-description {font-size:var(--font-size-sm);color:var(--text-primary);line-height:1.5;} /* Tablet:2 columns */ @media (min-width:768px) {.services-list {grid-template-columns:repeat(2,1fr);gap:var(--spacing-xs);} .service-item {font-size:var(--font-size-base);padding:var(--spacing-sm) var(--spacing-lg);} .services-section h2 {font-size:var(--font-size-3xl);}} /* Desktop:4 columns */ @media (min-width:1024px) {.services-list {grid-template-columns:repeat(4,1fr);gap:var(--spacing-lg);} .service-item {font-size:var(--font-size-lg);padding:var(--spacing-md) var(--spacing-xl);}} /* Accessibility improvements for services section */ @media (prefers-reduced-motion:reduce) {.service-title {transition:none;} .service-title:hover {transform:none;}} /* Print styles for services section */ @media print {.services-section {background-color:transparent;padding:var(--spacing-lg) 0;} .service-title {color:#333;} .service-title:hover {color:#333;}} /* Utility classes for common layouts */ .flex-center {display:flex;justify-content:center;align-items:center;} .flex-between {display:flex;justify-content:space-between;align-items:center;} .flex-column {display:flex;flex-direction:column;} .grid-auto {display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--spacing-lg);} /* Responsive text alignment */ .text-center {text-align:center;} @media (min-width:768px) {.text-center-mobile {text-align:left;}} /* Hero Section Styles */ .hero-section {padding:var(--spacing-2xl) 0;text-align:center;background-color:var(--primary-bg);} .hero-container {max-width:var(--large-desktop);margin:0 auto;padding:0 var(--spacing-md);} .hero-section h1 {font-size:var(--font-size-4xl);font-weight:700;margin-bottom:var(--spacing-md);color:var(--text-primary);} .hero-subtitle {font-size:var(--font-size-xl);color:var(--text-secondary);font-weight:300;max-width:600px;margin:0 auto;} @media (min-width:768px) {.hero-container {padding:0 var(--spacing-lg);} .hero-section {padding:var(--spacing-3xl) 0;}} @media (min-width:1024px) {.hero-container {padding:0 var(--spacing-xl);}} /* Contact Section Styles */ .contact-section {padding:var(--spacing-2xl) 0;background-color:var(--secondary-bg);} .contact-container {max-width:var(--large-desktop);margin:0 auto;padding:0 var(--spacing-md);} .contact-section h2 {font-size:var(--font-size-2xl);font-weight:600;text-align:center;margin-bottom:var(--spacing-xl);color:var(--text-primary);line-height:1.2;} .contact-content {display:grid;grid-template-columns:1fr;gap:var(--spacing-xl);align-items:start;} /* Practice image within contact section */ .practice-image-container {width:100%;max-width:100%;border-radius:var(--border-radius-lg);overflow:hidden;box-shadow:0 4px 15px var(--shadow-color);transition:box-shadow var(--transition-normal),transform var(--transition-normal);aspect-ratio:4/3;} .practice-image-container:hover {box-shadow:0 6px 20px var(--shadow-color);transform:translateY(-2px);} .practice-image {width:100%;height:100%;display:block;object-fit:cover;transition:transform var(--transition-slow);} .practice-image:hover {transform:scale(1.02);} .contact-info {display:grid;grid-template-columns:1fr;gap:var(--spacing-md);width:100%;} /* Mobile:Stack contact items in a more compact way */ @media (max-width:767px) {.contact-content {gap:var(--spacing-lg);} .practice-image-container {max-width:300px;margin:0 auto;aspect-ratio:3/2;} .contact-info {gap:var(--spacing-sm);} .contact-item {min-height:90px;padding:var(--spacing-md);} .contact-item h3 {font-size:var(--font-size-sm);margin-bottom:var(--spacing-xs);} .phone-link {font-size:var(--font-size-lg);} .email-link,.address-link {font-size:var(--font-size-sm);}} .contact-item {display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--spacing-lg);border-radius:var(--border-radius-lg);background-color:var(--primary-bg);transition:all var(--transition-normal);border:1px solid var(--border-color);min-height:120px;justify-content:center;} .contact-item:hover {transform:translateY(-2px);box-shadow:0 4px 15px var(--shadow-color);border-color:var(--accent-color);} .contact-item h3 {font-size:var(--font-size-base);font-weight:600;color:var(--accent-color);margin-bottom:var(--spacing-sm);line-height:1.3;text-transform:uppercase;letter-spacing:0.5px;} .contact-link {display:inline-block;font-size:var(--font-size-lg);color:var(--text-primary);text-decoration:none;font-weight:500;transition:color var(--transition-fast);line-height:1.4;} .contact-link:hover,.contact-link:focus {color:var(--accent-color);text-decoration:underline;} .contact-link:focus {outline:2px solid var(--accent-color);outline-offset:2px;border-radius:var(--border-radius-sm);} /* Enhanced keyboard navigation and focus management */ *:focus {outline:2px solid var(--accent-color);outline-offset:2px;} /* Focus styles for interactive elements */ a:focus,button:focus,input:focus,textarea:focus,select:focus {outline:2px solid var(--accent-color);outline-offset:2px;border-radius:var(--border-radius-sm);} /* Focus styles for contact items */ .contact-item:focus-within {outline:2px solid var(--accent-color);outline-offset:2px;transform:translateY(-2px);box-shadow:0 4px 15px var(--shadow-color);border-color:var(--accent-color);} /* High contrast mode support */ @media (prefers-contrast:high) {:root {--text-secondary:#000000;--accent-color:#008b72;--border-color:#000000;} *:focus {outline:3px solid;outline-offset:2px;} .skip-link:focus {outline:3px solid white;outline-offset:2px;} .contact-item {border:2px solid var(--border-color);} .service-item {color:var(--text-primary);}} @media (prefers-contrast:high) and (prefers-color-scheme:dark) {:root {--text-secondary:#ffffff;--accent-color:#00f5d4;--border-color:#ffffff;}} /* Focus management for reduced motion users */ @media (prefers-reduced-motion:reduce) {.contact-item:focus-within {transform:none;}} /* Screen reader only content */ .sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;} /* Screen reader only content that becomes visible on focus */ .sr-only-focusable:focus {position:static;width:auto;height:auto;padding:inherit;margin:inherit;overflow:visible;clip:auto;white-space:normal;} /* Ensure minimum touch target sizes for mobile accessibility */ @media (max-width:768px) {.contact-link,.skip-link {min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:12px;}} /* Improve text spacing for readability */ p,li {word-spacing:0.1em;letter-spacing:0.01em;} /* Ensure sufficient line height for readability */ body {line-height:1.6;} h1,h2,h3,h4,h5,h6 {line-height:1.3;} /* Improve focus indicators for better visibility */ .contact-item:focus-within .contact-link {text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:2px;} /* Specific styling for different contact types */ .phone-link {font-weight:600;letter-spacing:0.5px;font-size:var(--font-size-xl);} .email-link {word-break:break-all;font-size:var(--font-size-base);} .address-link {line-height:1.5;font-size:var(--font-size-base);} /* Responsive design for contact section */ @media (min-width:768px) {.contact-container {padding:0 var(--spacing-lg);} .contact-content {grid-template-columns:1fr 1fr;gap:var(--spacing-2xl);align-items:center;} .practice-image-container {max-width:100%;aspect-ratio:4/3;} .contact-info {grid-template-columns:1fr;gap:var(--spacing-lg);} .contact-item {min-height:100px;} .contact-section h2 {font-size:var(--font-size-3xl);} .contact-item h3 {font-size:var(--font-size-lg);} .phone-link {font-size:var(--font-size-2xl);} .email-link,.address-link {font-size:var(--font-size-lg);}} @media (min-width:1024px) {.contact-container {padding:0 var(--spacing-xl);} .contact-section {padding:var(--spacing-3xl) 0;} .contact-content {grid-template-columns:1.2fr 1fr;gap:var(--spacing-3xl);} .contact-info {gap:var(--spacing-xl);} .contact-item {min-height:110px;}} /* Accessibility improvements for contact section */ @media (prefers-reduced-motion:reduce) {.contact-item {transition:none;} .contact-item:hover {transform:none;} .practice-image-container {transition:none;} .practice-image-container:hover {transform:none;} .practice-image {transition:none;} .practice-image:hover {transform:none;}} /* Print styles for contact section */ @media print {.contact-section {background-color:transparent;} .contact-content {flex-direction:column;gap:var(--spacing-lg);} .practice-image-container {box-shadow:none;border:1px solid #ccc;} .practice-image-container:hover {box-shadow:none;transform:none;} .contact-item {background-color:transparent;border:1px solid #ccc;box-shadow:none;} .contact-item:hover {transform:none;box-shadow:none;} .contact-link {color:#333;text-decoration:underline;}} /* Container max-widths for content sections */ .container {width:100%;max-width:var(--large-desktop);margin:0 auto;padding:0 var(--spacing-md);} @media (min-width:768px) {.container {padding:0 var(--spacing-lg);}} @media (min-width:1024px) {.container {padding:0 var(--spacing-xl);}} / * Cross-browser compatibility fixes */ /* Fix for Internet Explorer */ @media screen and (-ms-high-contrast:active),(-ms-high-contrast:none) {.page-container {display:-ms-flexbox;-ms-flex-direction:column;} .header-container,.logo-container {display:-ms-flexbox;-ms-flex-pack:center;-ms-flex-align:center;} .main-content {display:-ms-flexbox;-ms-flex-direction:column;} .contact-content {display:-ms-flexbox;-ms-flex-direction:column;}} /* Fix for older Safari versions */ @supports (-webkit-appearance:none) {.logo {-webkit-transform:translateZ(0);} .contact-item:hover {-webkit-transform:translateY(-2px);}} /* Performance optimizations */ /* Optimize animations for better performance */ .contact-item,.practice-image-container,.practice-image,.logo {-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-perspective:1000px;perspective:1000px;} /* Optimize transforms for GPU acceleration */ .contact-item:hover,.practice-image-container:hover,.practice-image:hover,.service-item:hover {-webkit-transform:translateZ(0);transform:translateZ(0);} /* Optimize font rendering */ body,h1,h2,h3,h4,h5,h6 {-webkit-font-feature-settings:"kern" 1;-moz-font-feature-settings:"kern" 1;-o-font-feature-settings:"kern" 1;font-feature-settings:"kern" 1;font-kerning:normal;} /* Optimize image rendering */ img {-ms-interpolation-mode:bicubic;image-rendering:-webkit-optimize-contrast;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;} .practice-image {image-rendering:auto;} /* Optimize scrolling performance */ html {-webkit-overflow-scrolling:touch;overflow-scrolling:touch;} /* Removed conflicting flexbox rule - using grid instead */ .contact-info {display:-ms-grid;display:grid;-ms-grid-columns:1fr;grid-template-columns:1fr;} /* Fix for CSS custom properties fallbacks */ .contact-item {background-color:#ffffff;/* Fallback */ background-color:var(--primary-bg);color:#212529;/* Fallback */ color:var(--text-primary);border:1px solid #dee2e6;/* Fallback */ border:1px solid var(--border-color);} .contact-link {color:#212529;/* Fallback */ color:var(--text-primary);} .contact-link:hover {color:#008b72;/* Fallback */ color:var(--accent-color);} /* Dark mode fallbacks for browsers that don't support prefers-color-scheme */ @media (max-width:0px) {.dark-mode {--primary-bg:#1a1a1a;--secondary-bg:#2d2d2d;--text-primary:#ffffff;--text-secondary:#cccccc;--accent-color:#00f5d4;--border-color:#404040;--shadow-color:rgba(0,0,0,0.3);}} /* Fix for older versions of Chrome and Safari */ @supports not (display:grid) {.content-grid {display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;} .contact-content {display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;} .contact-info {display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;}} /* Fix for browsers that don't support CSS custom properties */ @supports not (color:var(--primary-bg)) {:root {/* Light mode fallbacks */} body {background-color:#ffffff;color:#212529;} .contact-item {background-color:#ffffff;color:#212529;border:1px solid #dee2e6;} .contact-link {color:#212529;} .contact-link:hover {color:#008b72;} .service-item {color:#495057;} .service-item:hover {color:#008b72;} .contact-item h3 {color:#008b72;} .approach-section h3 {color:#008b72;}} /* Performance optimization for animations */ @media (prefers-reduced-motion:no-preference) {.contact-item,.practice-image-container,.practice-image,.service-item,.logo {will-change:transform;}} /* Reset will-change after animations complete */ .contact-item:not(:hover),.practice-image-container:not(:hover),.practice-image:not(:hover),.service-item:not(:hover),.logo:not(:hover) {will-change:auto;} /* Optimize critical rendering path */ .hero-section,.services-section {contain:layout style paint;} /* Fix for older Firefox versions */ @-moz-document url-prefix() {.contact-item {display:-moz-box;-moz-box-orient:vertical;-moz-box-pack:center;-moz-box-align:center;} .services-list {display:-moz-box;-moz-box-orient:horizontal;-moz-box-pack:center;-moz-box-align:center;}} /* Optimize for print */ @media print {* {-webkit-print-color-adjust:exact !important;color-adjust:exact !important;} .contact-item,.practice-image-container {break-inside:avoid;page-break-inside:avoid;} .hero-section,.services-section,.contact-section {break-after:avoid;page-break-after:avoid;}} /* Fix for touch devices */ @media (hover:none) and (pointer:coarse) {.contact-item:hover,.practice-image-container:hover,.practice-image:hover,.service-item:hover,.logo:hover {transform:none;} .contact-item {-webkit-tap-highlight-color:rgba(0,0,0,0.1);tap-highlight-color:rgba(0,0,0,0.1);}} /* Optimize for high DPI displays */ @media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi) {.logo {image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;}} /* Fix for Windows high contrast mode */ @media (-ms-high-contrast:active) {.contact-item {border:2px solid;} .contact-link {text-decoration:underline;} .skip-link:focus {outline:2px solid;}} /* Optimize loading performance */ .practice-image {content-visibility:auto;contain-intrinsic-size:400px 300px;} /* Fix for older Edge versions */ @supports (-ms-ime-align:auto) {.page-container {display:-ms-grid;-ms-grid-rows:auto 1fr auto;} .contact-content {display:-ms-grid;-ms-grid-columns:1fr;}}
