/* ========================================================================== ACSR - SECTIONS.CSS Component Styles Extracted from styles.css All page components, utilities, and interactive elements ========================================================================== */ PRELOADER & LOADING ANIMATIONS (Global) ========================================================================== */ .preloader{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg, var(--brand-primary), var(--primary-dark));display:flex;align-items:center;justify-content:center;z-index:10000;transition:opacity 0.6s ease, visibility 0.6s ease}body.loading{overflow:hidden}.preloader.hidden{opacity:0;visibility:hidden}.preloader-spinner{width:60px;height:60px;position:relative}.preloader-spinner::before{content:'';position:absolute;inset:0;border:4px solid transparent;border-top:4px solid var(--accent);border-radius:50%;animation:spin 1s linear infinite}.preloader-spinner::after{content:'';position:absolute;inset:8px;border:4px solid transparent;border-top:4px solid var(--white-80);border-radius:50%;animation:spin 0.8s linear infinite reverse}@keyframes spin{to{transform:rotate(360deg)}}.scroll-indicator{position:fixed;top:0;left:0;width:100%;height:4px;background:var(--brand-accent-20);z-index:9999}.scroll-progress{height:100%;background:linear-gradient(90deg, var(--accent), var(--accent-glow));transform-origin:left;transform:scaleX(0);transition:transform 0.1s ease}@keyframes fadeInUp{from{opacity:0;transform:translateY(60px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInLeft{from{opacity:0;transform:translateX(-60px)}to{opacity:1;transform:translateX(0)}}@keyframes fadeInRight{from{opacity:0;transform:translateX(60px)}to{opacity:1;transform:translateX(0)}}.fade-up{animation:fadeInUp 0.8s ease forwards}.fade-left{animation:fadeInLeft 0.8s ease forwards}.fade-right{animation:fadeInRight 0.8s ease forwards}.stagger-item{opacity:0;animation:fadeInUp 0.8s ease forwards}.stagger-item:nth-child(1){animation-delay:0.1s}.stagger-item:nth-child(2){animation-delay:0.2s}.stagger-item:nth-child(3){animation-delay:0.3s}.stagger-item:nth-child(4){animation-delay:0.4s}section{transform:translateY(20px);opacity:0;transition:all 0.8s cubic-bezier(0.4, 0, 0.2, 1)}section.animate-in{transform:translateY(0);opacity:1}/* ========================================================================== SECTION 1:HERO SECTION - "Custom Garage Storage Arizona" ========================================================================== */ .hero-section{min-height:92vh;position:relative;display:flex;align-items:center;background:linear-gradient(135deg, var(--brand-primary), var(--primary-dark));overflow:hidden;clip-path:polygon(0 0, 100% 0, 100% 85%, 0 100%);padding:2rem 0}.hero-section::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:var(--brand-primary-80);z-index:1;pointer-events:none}.hero-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:transparent;z-index:0}.hero-content{position:relative;z-index:2;max-width:1400px;margin:0 auto;padding:0 2rem;display:grid;grid-template-columns:0.9fr 1.1fr;gap:3rem;align-items:center;min-height:80vh}.hero-text{color:white;text-align:center}.hero-experience{color:var(--white-80);font-size:0.95rem;font-weight:500;margin-bottom:1rem;opacity:0.9}.hero-title{font-size:clamp(1.4rem, 3vw, 1.8rem);font-weight:800;line-height:1.2;margin-bottom:1rem;color:white;text-shadow:0 2px 4px var(--black-30);position:relative;z-index:3}.hero-price-highlight{display:block;color:var(--accent-glow);font-size:clamp(2.8rem, 5vw, 3.5rem);font-weight:900;margin-top:0.5rem;text-shadow:0 2px 6px var(--brand-accent-40);animation:price-pulse 2s ease-in-out infinite;position:relative;z-index:3}@keyframes price-pulse{0%, 100%{transform:scale(1)}50%{transform:scale(1.05)}}.hero-description{font-size:1.25rem;margin-bottom:var(--spacing-xl);opacity:0.95;line-height:1.7}.hero-features{display:grid;grid-template-columns:repeat(2, 1fr);gap:var(--spacing-md);margin-bottom:var(--spacing-2xl);justify-items:center}.hero-feature-item{display:flex;align-items:center;gap:var(--spacing-sm);background:var(--white-10);backdrop-filter:blur(10px);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius-sm);border:1px solid var(--white-20);transition:var(--transition-base)}.hero-feature-item:hover{background:var(--white-15);transform:translateX(5px);box-shadow:var(--shadow-glow)}.hero-feature-icon{width:20px;height:20px;color:var(--accent-glow)}.hero-actions{display:flex;gap:var(--spacing-lg);flex-wrap:wrap;justify-content:center}.hero-btn-primary{background:var(--accent);color:white;padding:1rem 2.5rem;border:none;border-radius:var(--border-radius-sm);font-size:1.125rem;font-weight:600;text-decoration:none;cursor:pointer;position:relative;overflow:hidden;transition:var(--transition-base);display:inline-flex;align-items:center;gap:0.5rem}.hero-btn-primary::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, var(--white-30), transparent);transition:left 0.6s ease}.hero-btn-primary:hover{transform:translateY(-3px);box-shadow:var(--shadow-glow)}.hero-btn-primary:hover::before{left:100%}.hero-btn-secondary{background:var(--white-15);color:white;padding:1rem 2rem;border:2px solid var(--white-30);border-radius:var(--border-radius-sm);font-size:1rem;font-weight:600;text-decoration:none;backdrop-filter:blur(10px);transition:var(--transition-base);display:inline-flex;align-items:center;gap:0.5rem}.hero-btn-secondary:hover{background:var(--white-30);border-color:var(--white-50);transform:translateY(-2px)}/* ========================================================================== HERO GALLERY - 4x1x4 VERTICAL LAYOUT WITH SLIDESHOW ========================================================================== */ .hero-gallery{position:relative;display:flex;flex-direction:column;gap:12px;height:710px;width:100%;padding:0;will-change:auto;contain:layout style paint;transform:translate3d(0, 0, 0);backface-visibility:hidden;perspective:1000px;isolation:isolate}.gallery-row{display:grid;grid-template-columns:repeat(4, 1fr);gap:12px;height:140px}.gallery-featured{position:relative;height:400px;overflow:hidden;border-radius:12px;box-shadow:var(--shadow-md);cursor:pointer;margin:0;transition:transform var(--transition-base), box-shadow var(--transition-base);contain:layout style paint;padding:0;display:flex;align-items:center;justify-content:center}.gallery-featured .gallery-image{width:100%;height:100%;object-fit:cover;object-position:center;display:block;position:absolute;top:0;left:0}.gallery-item{position:relative;overflow:hidden;cursor:pointer;border-radius:10px;transition:transform var(--transition-base), box-shadow var(--transition-base);box-shadow:var(--shadow-sm);contain:layout style paint;will-change:auto;display:flex;align-items:center;justify-content:center}.gallery-item .gallery-image{width:100%;height:100%;object-fit:cover;object-position:center;display:block;position:absolute;top:0;left:0}.gallery-image{width:100%;height:100%;object-fit:cover;object-position:center;transition:opacity 0.8s var(--ease-smooth), transform var(--transition-base), filter var(--transition-base);filter:brightness(0.92) contrast(1.08) saturate(1.1);will-change:transform, opacity;transform:translate3d(0, 0, 0)}/* ========================================================================== HERO GALLERY OVERLAY SYSTEM - CONSOLIDATED AND CLEAN ========================================================================== */ .hero-gallery .gallery-overlay{position:absolute;bottom:0;left:0;right:0;width:100%;height:100%;background:linear-gradient(to top, var(--brand-primary-60) 0%, var(--brand-primary-40) 30%, var(--brand-primary-20) 70%, transparent 100%);color:white;padding:0.75rem;margin:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;border-radius:inherit;box-sizing:border-box;opacity:0;visibility:hidden;transition:opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), visibility 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);z-index:3}.hero-gallery .gallery-overlay::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to left, var(--brand-accent-25) 0%, var(--brand-accent-15) 50%, transparent 100%);border-radius:inherit;z-index:1;opacity:0;transition:opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94)}.hero-gallery .gallery-overlay::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to bottom, transparent 0%, var(--brand-primary-15) 50%, var(--brand-primary-25) 100%);border-radius:inherit;z-index:2;opacity:0;transition:opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94)}.gallery-title{font-size:0.85rem;font-weight:700;margin-bottom:0.2rem;text-shadow:0 2px 6px var(--black-90), 0 1px 3px var(--black-80);letter-spacing:0.3px;position:relative;z-index:3;color:white}.gallery-subtitle{font-size:0.7rem;opacity:0.95;line-height:1.2;text-shadow:0 2px 5px var(--black-90), 0 1px 2px var(--black-70);position:relative;z-index:3;color:var(--white-95)}.gallery-featured .gallery-title{font-size:1.1rem}.gallery-featured .gallery-subtitle{font-size:0.85rem}/* ========================================================================== HOVER EFFECTS & SLIDESHOW ANIMATIONS - ACSR PERFORMANCE PATTERNS ========================================================================== */ .gallery-item:hover, .gallery-featured:hover{transform:translateY(-4px) scale(1.02);box-shadow:var(--shadow-dark-glow);z-index:10;will-change:transform;border-radius:inherit}.gallery-item:hover .gallery-image, .gallery-featured:hover .gallery-image{transform:translate3d(0, 0, 0) scale(1.06);filter:brightness(1.1) contrast(1.05)}.hero-gallery .gallery-item:hover .gallery-overlay, .hero-gallery .gallery-featured:hover .gallery-overlay{opacity:1;visibility:visible;background:linear-gradient(to top, var(--brand-primary-70) 0%, var(--brand-primary-50) 30%, var(--brand-primary-30) 70%, transparent 100%);backdrop-filter:blur(1px)}.hero-gallery .gallery-item:hover .gallery-overlay::before, .hero-gallery .gallery-featured:hover .gallery-overlay::before{opacity:1;background:linear-gradient(to left, var(--brand-accent-30) 0%, var(--brand-accent-20) 50%, transparent 100%)}.hero-gallery .gallery-item:hover .gallery-overlay::after, .hero-gallery .gallery-featured:hover .gallery-overlay::after{opacity:1;background:linear-gradient(to bottom, transparent 0%, var(--brand-primary-25) 50%, var(--brand-primary-40) 100%)}.hero-gallery.slideshow-paused{animation-play-state:paused}.hero-gallery.slideshow-paused .gallery-image{will-change:auto}.hero-gallery:hover .gallery-item:not(:hover), .hero-gallery:hover .gallery-featured:not(:hover){opacity:0.7;transform:scale(0.98)}/* ========================================================================== ADVANCED CAROUSEL SLIDESHOW WITH ACSR PERFORMANCE PATTERNS ========================================================================== */ .gallery-item, .gallery-featured{position:relative;overflow:hidden;transition:box-shadow var(--transition-base), filter var(--transition-base)}.carousel-sliding{will-change:transform;z-index:10;transition:transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94)}.gallery-item.slide-to-new-position, .gallery-featured.slide-to-new-position{position:relative;z-index:15;will-change:transform;transition:transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94)}.carousel-sliding .gallery-image{opacity:1;transform:translate3d(0, 0, 0);will-change:auto}@keyframes slideOutLeft{0%{transform:translate3d(0, 0, 0)}100%{transform:translate3d(-100%, 0, 0)}}@keyframes slideInFromRight{0%{transform:translate3d(100%, 0, 0)}100%{transform:translate3d(0, 0, 0)}}@keyframes slideOutRight{0%{transform:translate3d(0, 0, 0)}100%{transform:translate3d(100%, 0, 0)}}@keyframes slideInFromLeft{0%{transform:translate3d(-100%, 0, 0)}100%{transform:translate3d(0, 0, 0)}}.hero-gallery.sliding{contain:layout style paint;will-change:auto}.gallery-item, .gallery-featured{backface-visibility:hidden;transform:translate3d(0, 0, 0)}/* ========================================================================== ACSR PERFORMANCE OPTIMIZATION PATTERNS ========================================================================== */ .gallery-image{transform:translateZ(0);backface-visibility:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.gallery-item.loaded .gallery-image{will-change:auto}.gallery-item.animating .gallery-image{will-change:transform, opacity}.about-image-gallery{display:flex;justify-content:flex-start;align-items:center;width:100%;padding-left:2rem}.trust-image-grid{display:grid;grid-template-columns:repeat(2, 240px);grid-template-rows:repeat(4, 240px);gap:20px;max-width:500px;margin:0 auto;justify-content:center}.trust-image-tile{position:relative;width:180px;height:180px;aspect-ratio:1;overflow:hidden;border-radius:16px;background:var(--bg-secondary);cursor:pointer;transition:all 0.4s ease;box-shadow:var(--shadow-sm)}.trust-tile-image{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform 0.6s ease;image-orientation:from-image;display:block}@supports (animation-timeline:scroll()){.gallery-item{animation-timeline:auto}}.gallery-item:focus, .gallery-featured:focus{outline:2px solid var(--accent);outline-offset:2px;transform:translateY(-2px)}.gallery-item:focus:not(:focus-visible), .gallery-featured:focus:not(:focus-visible){outline:none}@supports (overscroll-behavior:contain){.hero-gallery{overscroll-behavior:contain}}@supports (content-visibility:auto){.gallery-item:not(.visible){content-visibility:auto;contain-intrinsic-size:140px}}/* ========================================================================== ACSR LOADING STATES & PERFORMANCE INDICATORS ========================================================================== */ .gallery-image.loading{background:linear-gradient(90deg, var(--brand-primary-10) 25%, var(--brand-primary-30) 50%, var(--brand-primary-10) 75%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite}@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}.gallery-image.loaded{animation:fadeInUp 0.6s var(--ease-smooth) forwards}.gallery-image.error{background:var(--bg-secondary);position:relative}.gallery-image.error::after{content:'Image not available';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);color:var(--color-slate-600);font-size:0.875rem;text-align:center}/* ========================================================================== RESPONSIVE DESIGN ========================================================================== */ @media (max-width:1024px){.hero-content{grid-template-columns:1fr 1fr;gap:var(--spacing-xl)}.gallery-hero{grid-column:1 / 2;grid-row:1 / 2;clip-path:none;border-radius:12px}.gallery-medium{grid-column:2 / 3;grid-row:1 / 2;clip-path:none;border-radius:12px}.gallery-tall{grid-column:1 / 2;grid-row:2 / 3;clip-path:none;border-radius:12px}.gallery-square{grid-column:2 / 3;grid-row:2 / 3;clip-path:none;border-radius:12px}.gallery-wide, .gallery-accent-1, .gallery-accent-2, .gallery-showcase{display:none}.gallery-item:hover{transform:scale(1.03);border-radius:inherit}}@media (max-width:1024px){.about-content{grid-template-columns:1fr;gap:var(--space-xl)}.about-text{order:1;width:100%;max-width:800px;margin:0 auto}.about-image-gallery{order:2;width:100%;padding-left:0}.trust-image-grid{grid-template-columns:repeat(3, 1fr);grid-template-rows:auto;max-width:100%;padding:0 var(--space-lg)}}@media (max-width:768px){.hero-content{grid-template-columns:1fr;gap:var(--spacing-xl);text-align:center}.gallery-row{height:60px;gap:var(--spacing-sm)}.hero-gallery{height:300px}.gallery-featured{height:120px;margin:0}.gallery-bottom{margin-bottom:50px}.gallery-item:hover, .gallery-featured:hover{transform:scale(1.02);border-radius:inherit}.carousel-sliding{transform-style:preserve-3d;backface-visibility:hidden;will-change:transform}.gallery-hero, .gallery-medium, .gallery-tall, .gallery-square{clip-path:none;border-radius:10px}.gallery-hero{grid-column:1 / 2;grid-row:1 / 2}.gallery-medium{grid-column:2 / 3;grid-row:1 / 2}.gallery-tall{grid-column:1 / 2;grid-row:2 / 3}.gallery-square{grid-column:2 / 3;grid-row:2 / 3}.gallery-wide, .gallery-accent-1, .gallery-accent-2, .gallery-showcase{display:none}.gallery-item:hover{transform:scale(1.02);border-radius:inherit}.hero-gallery .gallery-overlay{padding:0.8rem;height:40%}.hero-gallery .gallery-overlay::before{background:linear-gradient(to left, var(--brand-accent-50) 0%, var(--brand-accent-25) 50%, transparent 100%)}.hero-gallery .gallery-overlay::after{background:linear-gradient(to bottom, transparent 0%, var(--brand-primary-20) 50%, var(--brand-primary-30) 100%)}.gallery-title{font-size:0.85rem}.gallery-subtitle{font-size:0.7rem}}/* ========================================================================== ACCESSIBILITY & REDUCED MOTION SUPPORT - ACSR STANDARDS ========================================================================== */ @media (prefers-reduced-motion:reduce){.hero-gallery, .gallery-item, .gallery-featured, .gallery-image{animation:none;transition-duration:0.01ms}.carousel-sliding{transform:none;transition:opacity 0.3s ease}.gallery-item:hover, .gallery-featured:hover{transform:none;box-shadow:0 0 0 2px var(--accent)}.gallery-image{will-change:auto}.hero-gallery .gallery-overlay{background:linear-gradient(to top, var(--brand-primary-40) 0%, var(--brand-primary-25) 70%, transparent 100%)}.hero-gallery .gallery-overlay::before{background:linear-gradient(to left, var(--brand-accent-25) 0%, transparent 60%)}.hero-gallery .gallery-overlay::after{background:none}.hero-gallery .gallery-item:hover .gallery-overlay, .hero-gallery .gallery-featured:hover .gallery-overlay{opacity:1 !important;visibility:visible !important}.hero-gallery .gallery-item:hover .gallery-overlay::before, .hero-gallery .gallery-featured:hover .gallery-overlay::before{opacity:0.8}.gallery-image.slide-transition-reduced{opacity:0;transition:opacity 0.3s ease}.gallery-image.slide-transition-reduced.loaded{opacity:1}}@media (prefers-contrast:high){.hero-gallery .gallery-overlay{background:var(--black-90);border:2px solid currentColor}.gallery-title{color:white;text-shadow:none}}/* ========================================================================== GALLERY OVERLAY RESPONSIVE ADJUSTMENTS ========================================================================== */ /* ========================================================================== SECTION 1.5:CALCULATOR SECTION - "Interactive Price Calculator" ========================================================================== */ .calculator-section{padding:var(--spacing-2xl) 0;background:var(--bg-secondary);position:relative;overflow:hidden;margin-top:-6rem;padding-top:8rem}.calculator-section::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%2335645a' fill-opacity='0.03'%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") repeat;pointer-events:none;z-index:0}.calculator-section .container{position:relative;z-index:1}.calculator-section .section-header{text-align:center;margin-bottom:var(--spacing-xl)}.calculator-section .section-title{font-size:clamp(2rem, 4vw, 2.5rem);font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-lg);position:relative}.calculator-section .section-title::after{content:'';position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:80px;height:4px;background:linear-gradient(90deg, var(--brand-primary), var(--accent));border-radius:2px}.calculator-section .section-subtitle{font-size:1.125rem;color:var(--color-slate-600);max-width:600px;margin:0 auto;line-height:1.7}.dual-calculator-container{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-xl);margin-bottom:var(--spacing-xl);align-items:stretch}.calculator-container{background:var(--bg-primary);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;transition:var(--transition-base);display:flex;flex-direction:column;height:100%;opacity:1;transform:translateY(0);transition:all 0.6s var(--ease-smooth);border:3px solid var(--brand-primary)}.calculator-container:hover{transform:translateY(-8px) scale(1.02);box-shadow:var(--shadow-dark-glow);border-color:var(--accent);box-shadow:0 0 30px var(--brand-primary-40), var(--shadow-dark-glow)}.calculator-container:hover .calculator-title-header{background:linear-gradient(135deg, var(--accent) 0%, var(--accent-glow) 100%);transform:scaleX(1.02);transition:all 0.3s var(--ease-smooth)}.calculator-card{display:flex;flex-direction:column;background:white;border-radius:var(--border-radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);flex:1;height:100%;transition:var(--transition-base);border-top-left-radius:var(--border-radius-lg);border-top-right-radius:var(--border-radius-lg);border-bottom-left-radius:var(--border-radius-lg);border-bottom-right-radius:var(--border-radius-lg)}.calculator-container:hover .calculator-card{box-shadow:var(--shadow-dark-glow)}.calculator-image{position:relative;overflow:hidden;height:240px;width:100%;flex-shrink:0}.calculator-main-image{width:100%;height:100%;object-fit:cover;transition:transform 0.8s var(--ease-smooth)}.calculator-image:hover .calculator-main-image{transform:scale(1.05)}.calculator-image-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent, var(--brand-primary-90));color:white;padding:var(--spacing-lg);transform:translateY(100%);transition:transform var(--transition-base);border-bottom-left-radius:var(--border-radius-sm);border-bottom-right-radius:var(--border-radius-sm)}.calculator-image:hover .calculator-image-overlay{transform:translateY(0)}.overlay-title{font-size:1.25rem;font-weight:700;margin-bottom:var(--spacing-xs)}.overlay-subtitle{font-size:0.95rem;opacity:0.9}.calculator-title-header{background:linear-gradient(135deg, var(--brand-primary), var(--primary-dark));color:white;padding:var(--spacing-lg) var(--spacing-xl);text-align:center;border-top-left-radius:var(--border-radius-lg);border-top-right-radius:var(--border-radius-lg);position:relative;overflow:hidden;flex-shrink:0}.calculator-title-header::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, var(--white-10), transparent);transition:left 0.8s ease}.calculator-container:hover .calculator-title-header::before{left:100%}.calculator-main-title{font-size:1.5rem;font-weight:700;margin:0;color:white;text-shadow:0 2px 4px var(--black-30);position:relative;z-index:1}.calculator-price-display{background:linear-gradient(135deg, var(--brand-primary), var(--primary-dark));color:white;padding:var(--spacing-lg) var(--spacing-lg);text-align:center;position:relative;overflow:hidden;flex-shrink:0;border-bottom:3px solid var(--accent)}.calculator-price-display::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(45deg, var(--white-10) 25%, transparent 25%, transparent 50%, var(--white-10) 50%, var(--white-10) 75%, transparent 75%);background-size:20px 20px;opacity:0.3;pointer-events:none}.price-highlight{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:var(--spacing-md);margin-bottom:var(--spacing-sm)}.price-label{font-size:1.125rem;font-weight:600;opacity:0.9}.price-amount{font-size:2rem;font-weight:800;text-shadow:0 2px 4px var(--black-20);color:var(--accent)}.price-note{font-size:0.875rem;opacity:0.8;position:relative;z-index:2}.calculator-sliders{padding:var(--spacing-xl) var(--spacing-xl);background:linear-gradient(135deg, var(--bg-secondary), var(--brand-primary-3));border-bottom:2px solid var(--brand-primary-10);position:relative;flex-shrink:0;text-align:center}.calculator-sliders::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg, var(--brand-primary), var(--accent));opacity:0.6}.calculator-features{padding:0;background:transparent;margin-bottom:0;margin-top:auto;text-align:center}.feature-item{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-md);color:var(--color-slate-600);font-size:0.95rem;padding:var(--spacing-sm) var(--spacing-md);background:var(--bg-secondary);border-radius:var(--border-radius-sm);transition:var(--transition-base)}.feature-item:hover{background:var(--brand-primary-5);transform:translateY(-2px)}.feature-item:last-child{margin-bottom:0}.feature-icon{width:16px;height:16px;color:var(--accent);flex-shrink:0}.calculator-controls{padding:var(--spacing-xl) var(--spacing-lg);padding-top:var(--spacing-lg);flex:1;display:flex;flex-direction:column;text-align:center;background:linear-gradient(135deg, var(--white-80), var(--color-white))}.control-group{margin-bottom:var(--spacing-lg)}.control-group:last-child{margin-bottom:0}.control-label{display:block;font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-sm);text-align:center}.slider-label{display:block;font-size:1rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-sm);text-align:center;background:var(--bg-primary);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius-sm);box-shadow:var(--shadow-sm)}.slider-value{color:var(--brand-primary);font-size:1.25rem;font-weight:800;background:var(--accent-light);padding:2px 8px;border-radius:var(--border-radius-sm);margin-left:var(--spacing-sm)}.size-selector, .config-selector{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);justify-content:center}.control-btn{padding:0.75rem 1.25rem;background:var(--bg-secondary);border:2px solid transparent;border-radius:var(--border-radius-md);font-size:0.9rem;font-weight:600;color:var(--color-slate-600);cursor:pointer;transition:var(--transition-base);position:relative;overflow:hidden;text-align:center;min-height:45px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm)}.control-btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, var(--brand-primary-10), transparent);transition:left 0.6s ease}.control-btn:hover::before{left:100%}.control-btn.active{background:var(--brand-primary);border-color:var(--brand-primary);color:white;transform:translateY(-3px) scale(1.02);box-shadow:var(--shadow-dark-glow);font-weight:700}.control-btn:hover{border-color:var(--accent);transform:translateY(-2px) scale(1.01);box-shadow:var(--shadow-md);background:var(--brand-primary-5);color:var(--brand-primary)}.control-btn.active:hover{background:var(--brand-primary);color:white}.control-btn:active{transform:translateY(-1px)}.slider-container{position:relative;margin:var(--spacing-md) 0;padding:var(--spacing-sm) 0}.quantity-slider{-webkit-appearance:none;width:100%;height:12px;border-radius:6px;background:var(--bg-secondary);outline:none;position:relative;z-index:2;cursor:pointer;border:2px solid var(--brand-primary-20)}.quantity-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg, var(--accent), var(--accent-glow));cursor:grab;box-shadow:0 4px 12px var(--brand-accent-40), 0 2px 4px var(--black-20);transition:all 0.2s ease;border:3px solid white;position:relative}.quantity-slider::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 6px 16px var(--brand-accent-50), 0 3px 6px var(--black-30)}.quantity-slider::-webkit-slider-thumb:active{cursor:grabbing;transform:scale(1.05)}.quantity-slider::-moz-range-thumb{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg, var(--accent), var(--accent-glow));cursor:grab;border:3px solid white;box-shadow:0 4px 12px var(--brand-accent-40), 0 2px 4px var(--black-20);transition:all 0.2s ease}.quantity-slider::-moz-range-thumb:hover{transform:scale(1.15);box-shadow:0 6px 16px var(--brand-accent-50), 0 3px 6px var(--black-30)}.slider-track{position:absolute;top:50%;left:0;right:0;height:12px;background:var(--bg-secondary);border-radius:6px;transform:translateY(-50%);pointer-events:none;border:2px solid var(--brand-primary-20);overflow:hidden}.slider-progress{height:100%;background:linear-gradient(90deg, var(--brand-primary), var(--accent));border-radius:4px;transition:width 0.2s ease;position:relative}.slider-progress::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(45deg, var(--white-20) 25%, transparent 25%, transparent 50%, var(--white-20) 50%);background-size:8px 8px;animation:slide 1s linear infinite}@keyframes slide{0%{transform:translateX(-8px)}100%{transform:translateX(8px)}}.quantity-labels{display:flex;justify-content:space-between;margin-top:var(--spacing-md);padding:0 var(--spacing-sm)}.quantity-labels span{font-size:0.875rem;font-weight:600;color:var(--color-slate-600);background:var(--bg-secondary);padding:4px 8px;border-radius:var(--border-radius-sm);min-width:24px;text-align:center;transition:var(--transition-base)}.quantity-labels span:hover{background:var(--brand-primary);color:white;transform:scale(1.05)}.addon-toggles{display:flex;flex-direction:row;gap:var(--spacing-md);flex-wrap:wrap;justify-content:center}.addon-toggle{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);cursor:pointer;padding:var(--spacing-md);border-radius:var(--border-radius-sm);background:var(--bg-secondary);transition:var(--transition-base);position:relative;overflow:hidden;flex:1;min-width:0}.addon-toggle::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, var(--brand-primary-5), transparent);transition:left 0.8s ease}.addon-toggle:hover::before{left:100%}.addon-toggle:hover{background:var(--brand-primary-5);transform:translateY(-2px)}.addon-toggle input[type="checkbox"]{display:none}.toggle-switch{width:50px;height:26px;background:var(--color-gray-300);border-radius:13px;position:relative;transition:var(--transition-base);flex-shrink:0}.toggle-switch::before{content:'';position:absolute;width:22px;height:22px;border-radius:50%;background:white;top:2px;left:2px;transition:var(--transition-base);box-shadow:var(--shadow-sm)}.addon-toggle input:checked + .toggle-switch{background:var(--accent);box-shadow:inset 0 0 0 1px var(--accent-glow)}.addon-toggle input:checked + .toggle-switch::before{transform:translateX(24px)}.toggle-label{font-size:0.85rem;color:var(--text-primary);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.calculator-result{background:linear-gradient(135deg, var(--bg-secondary), var(--brand-primary-5));border-radius:var(--border-radius-md);padding:var(--spacing-xl);border:1px solid var(--brand-primary-10);position:relative;overflow:hidden}.result-breakdown{margin-bottom:var(--spacing-lg)}.breakdown-item{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-sm);font-size:0.95rem;color:var(--color-slate-600)}.breakdown-item:last-child{margin-bottom:0}.result-total{display:flex;justify-content:space-between;align-items:center;padding-top:var(--spacing-lg);border-top:2px solid var(--brand-primary-10);font-size:1.125rem;font-weight:700;color:var(--text-primary)}.total-amount{font-size:1.5rem;color:var(--brand-primary);font-weight:800}.result-note{margin-top:var(--spacing-md);font-size:0.875rem;color:var(--color-slate-600);font-style:italic;text-align:center}.calculator-cta{background:linear-gradient(135deg, var(--brand-primary), var(--primary-dark));border-radius:var(--border-radius-lg);padding:var(--spacing-3xl);text-align:center;color:white;position:relative;overflow:hidden}.calculator-cta::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M20 20c0-5.5-4.5-10-10-10s-10 4.5-10 10 4.5 10 10 10 10-4.5 10-10zm10 0c0-5.5-4.5-10-10-10s-10 4.5-10 10 4.5 10 10 10 10-4.5 10-10z'/%3E%3C/g%3E%3C/svg%3E") repeat;pointer-events:none;z-index:0}.cta-section{background:linear-gradient(135deg, var(--brand-primary) 0%, var(--primary-dark) 100%);padding:var(--space-12) 0;margin:var(--space-16) 0;text-align:center}.cta-content{position:relative;z-index:1;max-width:600px;margin:0 auto}.cta-content h2{font-size:var(--text-3xl);font-weight:700;color:white;margin-bottom:var(--space-4)}.cta-content p{font-size:var(--text-lg);color:var(--white-90);margin-bottom:var(--space-6)}.cta-button{background:var(--accent);color:white;padding:var(--space-4) var(--space-8);border-radius:var(--radius-lg);text-decoration:none;font-weight:600;font-size:var(--text-lg);display:inline-block;transition:all var(--transition-base)}.cta-button:hover{background:var(--accent-dark);transform:translateY(-2px);box-shadow:var(--shadow-xl)}@media (max-width:768px){.cta-section{padding:var(--space-8) 0;margin:var(--space-12) 0}.cta-content h2{font-size:var(--text-2xl)}.cta-content p{font-size:var(--text-base)}.cta-button{padding:var(--space-3) var(--space-6);font-size:var(--text-base)}}.calculator-cta h3{font-size:1.375rem;font-weight:700;margin-bottom:var(--spacing-md)}.calculator-cta p{font-size:1.125rem;margin-bottom:var(--spacing-xl);opacity:0.9;max-width:500px;margin-left:auto;margin-right:auto}.cta-buttons{display:flex;gap:var(--spacing-lg);justify-content:center;flex-wrap:wrap}.btn-primary, .btn-secondary{padding:1rem 2rem;border-radius:var(--border-radius-sm);font-size:1rem;font-weight:600;text-decoration:none;cursor:pointer;transition:var(--transition-base);display:inline-flex;align-items:center;gap:var(--spacing-sm);position:relative;overflow:hidden}.btn-primary > *, .btn-secondary > *{position:relative;z-index:1}.btn-primary{background:var(--accent);color:white;border:2px solid var(--accent)}.btn-secondary{background:transparent;color:white;border:2px solid var(--white-30)}.btn-primary::before, .btn-secondary::before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;background:var(--white-20);border-radius:50%;transform:translate(-50%, -50%);transition:all 0.6s ease;z-index:-1}.btn-primary:hover, .btn-secondary:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-primary:hover::before, .btn-secondary:hover::before{width:300px;height:300px}.btn-secondary:hover{background:var(--white-10);border-color:var(--white-80)}@media (max-width:768px){.dual-calculator-container{grid-template-columns:1fr;gap:var(--spacing-lg)}.calculator-card{flex-direction:column}.calculator-image{height:200px}.calculator-title-header{padding:var(--spacing-md) var(--spacing-lg)}.calculator-main-title{font-size:1.25rem}.calculator-price-display{padding:var(--spacing-sm) var(--spacing-md)}.price-amount{font-size:1.5rem}.calculator-sliders{padding:var(--spacing-md) var(--spacing-lg)}.calculator-controls{padding:var(--spacing-md);padding-top:var(--spacing-sm)}.size-selector, .config-selector{flex-direction:column}.control-btn{text-align:center;min-height:40px;padding:0.625rem 1rem;font-size:0.85rem}.addon-toggles{flex-direction:column;gap:var(--spacing-sm)}.addon-toggle{flex:none}.quantity-slider::-webkit-slider-thumb{width:28px;height:28px}.quantity-slider::-moz-range-thumb{width:28px;height:28px}.slider-label{font-size:0.9rem}.slider-value{font-size:1rem}.cta-buttons{flex-direction:column;align-items:center}.btn-primary, .btn-secondary{width:100%;max-width:280px;justify-content:center}}@media (max-width:480px){.calculator-section{padding:var(--spacing-lg) 0}.calculator-image{height:180px}.calculator-title-header{padding:var(--spacing-sm) var(--spacing-md)}.calculator-main-title{font-size:1.125rem}.calculator-price-display{padding:var(--spacing-sm) var(--spacing-md)}.price-amount{font-size:1.25rem}.calculator-cta{padding:var(--spacing-md)}.calculator-sliders{padding:var(--spacing-sm) var(--spacing-md)}.calculator-controls{padding:var(--spacing-sm);padding-top:var(--spacing-xs)}.control-btn{min-height:38px;padding:0.5rem 0.75rem;font-size:0.8rem}.quantity-slider::-webkit-slider-thumb{width:24px;height:24px}.quantity-slider::-moz-range-thumb{width:24px;height:24px}.toggle-label{font-size:0.75rem}.toggle-switch{width:40px;height:22px}.toggle-switch::before{width:18px;height:18px}.addon-toggle input:checked + .toggle-switch::before{transform:translateX(18px)}}@keyframes slideInFromLeft{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}@keyframes slideInFromRight{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}/* ========================================================================== SECTION 2:PRICING SECTION - "Professional Garage Storage Solutions Arizona" ========================================================================== */ .pricing-section{padding:var(--spacing-3xl) 0;background:var(--bg-primary);position:relative;margin-top:0}.pricing-section::before{content:'';position:absolute;top:0;left:0;right:0;height:200px;background:linear-gradient(180deg, var(--primary-dark) 0%, transparent 100%);clip-path:polygon(0 0, 100% 0, 100% 50%, 0 100%)}.pricing-header{text-align:center;margin-bottom:4rem}.pricing-section .section-header{text-align:center;margin-bottom:var(--spacing-2xl)}.pricing-section .section-title{font-size:clamp(2rem, 4vw, 2.5rem);font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-lg)}.pricing-section .section-subtitle{font-size:1.125rem;color:var(--color-slate-600);max-width:600px;margin:0 auto;line-height:1.7}.pricing-title{font-size:clamp(2.5rem, 5vw, 3.5rem);font-weight:800;margin-bottom:1rem;color:var(--text-primary);position:relative}.pricing-title::after{content:'';position:absolute;bottom:-10px;left:50%;transform:translateX(-50%);width:80px;height:4px;background:linear-gradient(90deg, var(--brand-primary), var(--accent));border-radius:2px}.pricing-subtitle{font-size:1.25rem;color:var(--color-slate-600);max-width:600px;margin:0 auto;line-height:1.6}.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(350px, 1fr));gap:2rem;margin-bottom:4rem}.pricing-card{background:var(--bg-primary);border-radius:var(--border-radius-lg);padding:2rem;position:relative;box-shadow:var(--shadow-sm);border:2px solid transparent;transition:var(--transition-slow);overflow:hidden}.pricing-card::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg, var(--brand-primary) 0%, var(--accent) 100%);opacity:0;transition:var(--transition-base);z-index:-1}.pricing-card:hover{transform:translateY(-10px) scale(1.02);box-shadow:var(--shadow-dark-glow);border-color:var(--brand-primary)}.pricing-card:hover::before{opacity:0.05}.pricing-card.featured{border-color:var(--accent);transform:scale(1.05);box-shadow:var(--shadow-glow)}.pricing-card.featured::before{opacity:0.1}.pricing-badge{position:absolute;top:-10px;right:2rem;background:var(--accent);color:white;padding:0.5rem 1.5rem;border-radius:20px;font-size:0.875rem;font-weight:600;text-transform:uppercase;letter-spacing:1px}.pricing-card-image{width:100%;height:200px;border-radius:var(--border-radius-md);overflow:hidden;margin-bottom:1.5rem;position:relative}.pricing-card-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s ease}.pricing-card:hover .pricing-card-image img{transform:scale(1.1)}.pricing-card-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg, var(--brand-primary-80) 0%, var(--brand-accent-50) 35%, var(--brand-primary-80) 70%, var(--brand-accent-50) 100%);opacity:0;transition:var(--transition-base);display:flex;align-items:center;justify-content:center;color:white;font-weight:600}.pricing-card:hover .pricing-card-overlay{opacity:1}.pricing-card-title{font-size:1.5rem;font-weight:700;margin-bottom:0.5rem;color:var(--text-primary)}.pricing-card-price{display:flex;align-items:baseline;margin-bottom:1.5rem}.pricing-price-currency{font-size:1.5rem;color:var(--color-slate-600)}.pricing-price-amount{font-size:2.25rem;font-weight:800;color:var(--brand-primary);margin:0 0.25rem}.pricing-price-period{color:var(--color-slate-600)}.pricing-features{list-style:none;margin-bottom:1.5rem}.pricing-feature{display:flex;align-items:center;gap:0.75rem;padding:0.5rem 0;color:var(--text-primary)}.pricing-check-icon{width:18px;height:18px;color:var(--accent);flex-shrink:0}.pricing-expand-trigger{width:100%;background:var(--brand-primary);color:white;border:none;padding:1rem;border-radius:var(--border-radius-sm);font-weight:600;cursor:pointer;transition:var(--transition-base);position:relative;overflow:hidden}.pricing-expand-trigger::after{content:'▼';position:absolute;right:1rem;transition:transform 0.3s ease}.pricing-expand-trigger:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-md)}.pricing-expand-trigger.active::after{transform:rotate(180deg)}.pricing-expandable-content{max-height:0;overflow:hidden;transition:max-height 0.5s ease;margin-top:1rem}.pricing-expandable-content.active{max-height:300px}.pricing-expand-text{background:var(--bg-secondary);padding:1.5rem;border-radius:var(--border-radius-sm);color:var(--color-slate-600);line-height:1.7}/* ========================================================================== PRICING SECTION SPECIFIC CLASSES (for pricing-section-*) ========================================================================== */ .pricing-section-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(350px, 1fr));gap:2rem;margin-bottom:4rem}.pricing-section-card.featured{order:2}.pricing-section-card:nth-child(2){order:1}.pricing-section-card:nth-child(3){order:3}.pricing-section-card{background:var(--bg-primary);border-radius:var(--border-radius-lg);padding:2rem;position:relative;box-shadow:var(--shadow-sm);border:2px solid transparent;transition:var(--transition-slow);overflow:hidden}.pricing-section-card::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg, var(--brand-primary) 0%, var(--accent) 100%);opacity:0;transition:var(--transition-base);z-index:-1}.pricing-section-card:hover{transform:translateY(-10px) scale(1.02);box-shadow:var(--shadow-dark-glow);border-color:var(--brand-primary)}.pricing-section-card:hover::before{opacity:0.05}.pricing-section-card.featured{border-color:var(--accent);transform:scale(1.05);box-shadow:var(--shadow-glow)}.pricing-section-card.featured::before{opacity:0.1}.pricing-section-card .card-badge{position:absolute;top:-10px;right:2rem;background:var(--accent);color:white;padding:0.5rem 1.5rem;border-radius:var(--border-radius-full);font-weight:600;font-size:0.875rem;z-index:2}.pricing-section-card .card-image{width:100%;height:200px;border-radius:var(--border-radius-md);overflow:hidden;margin-bottom:1.5rem;position:relative}.pricing-section-card .card-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s ease}.pricing-section-card:hover .card-image img{transform:scale(1.1)}.pricing-section-card .card-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg, var(--brand-primary-80) 0%, var(--brand-accent-50) 35%, var(--brand-primary-80) 70%, var(--brand-accent-50) 100%);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity 0.3s ease;color:white;font-weight:600;font-size:1.1rem;text-align:center;text-shadow:0 2px 4px var(--black-50)}.pricing-section-card:hover .card-overlay{opacity:1}.pricing-section-card .card-title{font-size:1.25rem;font-weight:700;margin-bottom:0.5rem;color:var(--text-primary)}.pricing-section-card .card-price{display:flex;align-items:baseline;margin-bottom:1.5rem}.pricing-section-card .price-currency{font-size:1.5rem;color:var(--color-slate-600)}.pricing-section-card .price-amount{font-size:2.25rem;font-weight:800;color:var(--accent);margin:0 0.25rem}.pricing-section-card .price-period{font-size:1rem;color:var(--color-slate-600)}.pricing-section-card .card-features{list-style:none;margin-bottom:1.5rem}.pricing-section-card .card-features .feature{display:flex;align-items:center;gap:0.75rem;padding:0.5rem 0;color:var(--text-primary)}.pricing-section-card .check-icon{width:18px;height:18px;color:var(--accent);flex-shrink:0}.pricing-section-card .expand-trigger{background:var(--bg-secondary);border:2px solid var(--brand-primary);color:var(--brand-primary);padding:0.75rem 1.5rem;border-radius:var(--border-radius-full);font-weight:600;cursor:pointer;transition:var(--transition-base);width:100%;margin-bottom:1rem}.pricing-section-card .expand-trigger:hover, .pricing-section-card .expand-trigger.expanded{background:var(--brand-primary);color:white}.pricing-section-card .expandable-content{max-height:0;overflow:hidden;transition:max-height 0.3s ease, opacity 0.3s ease;opacity:0}.pricing-section-card .expandable-content.expanded{max-height:1000px !important;opacity:1}.pricing-section-card .expand-text{padding:1.25rem;color:var(--color-slate-600);line-height:1.7;background:var(--white-5);border-radius:10px;border:1px solid var(--brand-accent-10)}.service-areas{text-align:center;margin-top:4rem;padding:2rem;background:var(--bg-secondary);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--brand-primary-10)}.service-areas h3{font-size:1.5rem;margin-bottom:1rem;color:var(--text-primary);font-weight:700}.service-areas p{color:var(--color-slate-600);line-height:1.6;font-size:1rem}.service-areas strong{color:var(--brand-primary);font-weight:600}/* ========================================================================== SECTION 3:GALLERY SECTION - "Professional Garage Storage Installation" ========================================================================== */ .gallery-section{padding:5rem 0;background:var(--bg-secondary);position:relative}.gallery-section .section-header{text-align:center;margin-bottom:var(--spacing-2xl)}.gallery-section .section-title{font-size:clamp(2rem, 4vw, 2.5rem);font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-lg)}.gallery-section .section-subtitle{font-size:1.125rem;color:var(--color-slate-600);max-width:600px;margin:0 auto;line-height:1.7}.gallery-section::before{content:'';position:absolute;top:0;left:0;right:0;height:100px;background:var(--bg-primary);clip-path:polygon(0 0, 100% 0, 100% 100%, 0 80%)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(400px, 1fr));gap:2rem}.gallery-item{position:relative;border-radius:var(--border-radius-lg);overflow:hidden;aspect-ratio:4/3;cursor:pointer;transition:var(--transition-slow)}.gallery-item:hover{transform:translateY(-5px) scale(1.02);box-shadow:var(--shadow-dark-glow);border-radius:inherit}.gallery-image{width:100%;height:100%;object-fit:cover;transition:transform 0.8s ease}.gallery-item:hover .gallery-image{transform:scale(1.15)}.gallery-overlay-title{font-size:1.5rem;font-weight:700;margin-bottom:0.5rem;position:relative;z-index:3;text-shadow:0 2px 6px var(--black-90), 0 1px 3px var(--black-80);color:white}.gallery-overlay-description{opacity:0.95;margin-bottom:1rem;position:relative;z-index:3;text-shadow:0 2px 5px var(--black-90), 0 1px 2px var(--black-70);color:var(--white-95)}.gallery-overlay-details{max-height:0;overflow:hidden;transition:max-height 0.5s ease;font-size:0.9rem;line-height:1.6}.gallery-item:hover .gallery-overlay-details{max-height:200px}/* ========================================================================== GALLERY SECTION SPECIFIC CLASSES (for gallery-section-*) ========================================================================== */ .gallery-section-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(400px, 1fr));gap:2rem}@media (min-width:1200px){.gallery-section-grid{grid-template-columns:repeat(3, 1fr)}}@media (max-width:1199px) and (min-width:768px){.gallery-section-grid{grid-template-columns:repeat(2, 1fr)}}@media (max-width:767px){.gallery-section-grid{grid-template-columns:1fr}}.gallery-section-item{position:relative;border-radius:var(--border-radius-lg);overflow:hidden;aspect-ratio:4/3;max-height:400px;cursor:pointer;transition:var(--transition-slow);box-shadow:var(--shadow-sm)}.gallery-section-item:hover{transform:translateY(-5px) scale(1.02);box-shadow:var(--shadow-dark-glow);border-radius:inherit}.gallery-section-image{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform 0.8s ease;image-orientation:from-image;display:block}.gallery-section-item:hover .gallery-section-image{transform:scale(1.15)}.gallery-section-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to top, var(--brand-primary-60) 0%, var(--brand-primary-40) 30%, var(--brand-primary-20) 70%, transparent 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:2rem;opacity:0;visibility:hidden;transition:all 0.4s ease;color:white;box-sizing:border-box}.gallery-section-overlay::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to left, var(--brand-accent-25) 0%, var(--brand-accent-15) 50%, transparent 100%);border-radius:inherit;z-index:1;opacity:0;transition:opacity 0.4s ease}.gallery-section-overlay::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to bottom, transparent 0%, var(--brand-primary-15) 50%, var(--brand-primary-25) 100%);border-radius:inherit;z-index:2;opacity:0;transition:opacity 0.4s ease}.gallery-section-item:hover .gallery-section-overlay{opacity:1;visibility:visible;background:linear-gradient(to top, var(--brand-primary-70) 0%, var(--brand-primary-50) 30%, var(--brand-primary-30) 70%, transparent 100%);backdrop-filter:blur(1px)}.gallery-section-item:hover .gallery-section-overlay::before{opacity:1;background:linear-gradient(to left, var(--brand-accent-30) 0%, var(--brand-accent-20) 50%, transparent 100%)}.gallery-section-item:hover .gallery-section-overlay::after{opacity:1;background:linear-gradient(to bottom, transparent 0%, var(--brand-primary-25) 50%, var(--brand-primary-40) 100%)}.gallery-section-overlay-title{font-size:1.25rem;font-weight:700;margin-bottom:0.5rem;position:relative;z-index:3;text-shadow:0 2px 6px var(--black-90), 0 1px 3px var(--black-80);color:white;line-height:1.2}.gallery-section-overlay-description{font-size:1rem;font-weight:500;margin-bottom:1rem;opacity:0.95;position:relative;z-index:3;text-shadow:0 2px 4px var(--black-80);color:white;line-height:1.3}.gallery-section-overlay-details{font-size:0.9rem;line-height:1.6;opacity:0;max-height:0;overflow-y:auto;overflow-x:hidden;transition:opacity 0.3s ease 0.2s, max-height 0.3s ease 0.2s;position:relative;z-index:3;text-shadow:0 1px 3px var(--black-70);color:var(--white-95);scrollbar-width:thin;scrollbar-color:var(--white-50) var(--white-10)}.gallery-section-overlay-details::-webkit-scrollbar{width:6px}.gallery-section-overlay-details::-webkit-scrollbar-track{background:var(--white-10);border-radius:3px}.gallery-section-overlay-details::-webkit-scrollbar-thumb{background:var(--white-50);border-radius:3px}.gallery-section-overlay-details::-webkit-scrollbar-thumb:hover{background:var(--white-80)}.gallery-section-item:hover .gallery-section-overlay-details{opacity:1;max-height:300px}/* ========================================================================== TRUST SIGNALS & SOCIAL PROOF SECTION ========================================================================== */ .trust-signals-section{padding:var(--spacing-3xl) 0;background:var(--bg-primary);position:relative;overflow:hidden}.trust-signals-section::before{content:'';position:absolute;top:0;left:0;right:0;height:150px;background:linear-gradient(180deg, var(--bg-secondary) 0%, var(--bg-primary) 100%);clip-path:polygon(0 0, 100% 0, 100% 70%, 0 100%)}.trust-signals-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(350px, 1fr));gap:var(--spacing-xl);margin-bottom:var(--spacing-3xl)}.testimonial-card{background:var(--bg-primary);padding:var(--spacing-xl);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);border:3px solid transparent;transition:var(--transition-base);position:relative;overflow:hidden}.testimonial-card::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg, var(--brand-primary) 0%, var(--accent) 100%);opacity:0;transition:var(--transition-base);z-index:-1}.testimonial-card:hover{transform:translateY(-8px);border-color:var(--brand-primary);box-shadow:var(--shadow-dark-glow)}.testimonial-card:hover::before{opacity:0.05}.testimonial-stars{display:flex;gap:4px;margin-bottom:var(--spacing-md)}.star{color:var(--accent);font-size:1.25rem;text-shadow:0 2px 4px var(--brand-accent-30)}.testimonial-text{font-size:1.125rem;line-height:1.7;color:var(--text-primary);font-style:italic;margin-bottom:var(--spacing-lg);position:relative}.testimonial-text::before{content:'"';font-size:2.25rem;color:var(--accent);position:absolute;top:-10px;left:-15px;font-family:Georgia, serif;opacity:0.3}.testimonial-author{color:var(--color-slate-600);font-weight:600;padding-left:var(--spacing-lg);border-left:3px solid var(--accent)}.trust-indicators{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));gap:var(--spacing-lg);text-align:center}.trust-indicator{padding:var(--spacing-lg);background:var(--bg-secondary);border-radius:var(--border-radius-md);transition:var(--transition-base);border:2px solid transparent}.trust-indicator:hover{transform:translateY(-4px);border-color:var(--brand-primary);background:var(--brand-primary-3)}.trust-icon{width:72px;height:72px;margin:0 auto var(--spacing-md);padding:var(--spacing-md);background:linear-gradient(135deg, var(--brand-primary), var(--primary-dark));border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;transition:var(--transition-base)}.trust-indicator:hover .trust-icon{background:linear-gradient(135deg, var(--accent), var(--accent-glow));transform:scale(1.1);box-shadow:var(--shadow-glow)}.trust-indicator h3{font-size:1.25rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-sm)}.trust-indicator p{color:var(--color-slate-600);line-height:1.6}/* ========================================================================== GLOBAL SECTION HEADERS ========================================================================== */ .section-header{text-align:center;margin-bottom:var(--spacing-2xl);max-width:800px;margin-left:auto;margin-right:auto}.section-title{font-size:clamp(2rem, 4vw, 2.5rem);font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-lg);position:relative}.section-title::after{content:'';position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:80px;height:4px;background:linear-gradient(90deg, var(--brand-primary), var(--accent));border-radius:2px}.section-subtitle{font-size:1.125rem;color:var(--color-slate-600);max-width:700px;margin:0 auto var(--spacing-lg);line-height:1.7;text-align:center}/* ========================================================================== INTERACTIVE DECISION MATRIX SECTION ========================================================================== */ .benefits-comparison-section{padding:var(--spacing-3xl) 0;background:var(--bg-secondary);position:relative}.benefits-comparison-section .section-header{text-align:center;margin-bottom:var(--spacing-2xl)}.benefits-comparison-section .section-title{font-size:clamp(2rem, 4vw, 2.75rem);font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-lg);position:relative}.benefits-comparison-section .section-title::after{content:'';position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:100px;height:4px;background:linear-gradient(90deg, var(--brand-primary), var(--accent));border-radius:2px}.benefits-comparison-section .section-subtitle{font-size:1.125rem;color:var(--color-slate-600);max-width:700px;margin:0 auto;line-height:1.7}.storage-decision-guide{background:var(--bg-primary);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-lg);border:2px solid var(--brand-primary);position:relative;overflow:hidden}.storage-decision-guide::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg, var(--brand-primary), var(--accent), var(--brand-primary));opacity:0.8}.guide-intro{padding:var(--spacing-xl) var(--spacing-xl) var(--spacing-lg);text-align:center;border-bottom:1px solid var(--brand-primary-10)}.guide-title{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-md)}.guide-description{font-size:1rem;color:var(--color-slate-600);line-height:1.6;max-width:600px;margin:0 auto}.decision-factors{background:var(--bg-primary)}.decision-factor{border-bottom:1px solid var(--brand-primary-10);transition:all 0.3s ease;position:relative}.decision-factor:hover{background:var(--brand-primary-3);border-left:4px solid var(--accent);padding-left:calc(var(--spacing-lg) - 4px)}.decision-factor:last-child{border-bottom:none}.factor-header{padding:var(--spacing-lg) var(--spacing-xl);text-align:center;border-bottom:1px solid var(--brand-primary-10)}.expand-toggle-center{display:flex;justify-content:center;align-items:center}.factor-title{font-size:1.125rem;font-weight:600;color:var(--text-primary);margin:0}.expand-toggle{width:40px;height:40px;border:2px solid var(--accent);border-radius:50%;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.3s ease;color:var(--accent)}.expand-toggle:hover{border-color:var(--accent);background:var(--accent);color:white;transform:scale(1.05);box-shadow:0 4px 8px var(--brand-accent-20)}.toggle-icon{font-size:1.25rem;font-weight:300;transition:transform 0.3s ease;line-height:1}.decision-factor.expanded .toggle-icon{transform:rotate(45deg)}.decision-factor.expanded .expand-toggle{background:var(--accent);color:white;border-color:var(--accent)}.factor-preview{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--spacing-md);align-items:center;margin:0 var(--spacing-xl) var(--spacing-xl);padding:var(--spacing-lg);background:var(--brand-primary-3);border-radius:var(--border-radius-sm)}.option-summary{background:linear-gradient(135deg, var(--bg-primary), var(--brand-primary-3));padding:var(--spacing-lg);display:flex;flex-direction:column;gap:var(--spacing-xs);text-align:center;border-radius:var(--border-radius-sm);border:2px solid var(--brand-primary-10);transition:all 0.3s ease;position:relative;overflow:hidden}.option-summary::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg, var(--brand-primary), var(--accent));opacity:0;transition:opacity 0.3s ease}.option-summary:hover{background:linear-gradient(135deg, var(--brand-primary-3), var(--brand-accent-10));border-color:var(--brand-primary);transform:translateY(-3px);box-shadow:0 8px 25px var(--brand-primary-15)}.option-summary:hover::before{opacity:1}.acsr-option{}.alternative-option{}.option-label{font-size:0.8125rem;font-weight:600;color:var(--color-slate-600);text-transform:uppercase;letter-spacing:0.05em;margin-bottom:var(--spacing-xs)}.option-detail{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-xs)}.acsr-option .option-detail{color:var(--brand-primary)}.alternative-option .option-detail{color:var(--color-slate-600)}.option-note{font-size:0.8125rem;color:var(--color-slate-600);font-style:italic}.factor-details{max-height:0;overflow:hidden;background:linear-gradient(135deg, var(--brand-primary-3), var(--brand-accent-10));transition:max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);border-top:2px solid var(--accent);box-shadow:inset 0 2px 4px var(--black-5)}.decision-factor.expanded .factor-details{max-height:2000px}.details-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-xl);padding:var(--spacing-xl);max-width:1000px;margin:0 auto}.detail-section h5{font-size:1rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-md);padding-bottom:var(--spacing-xs);border-bottom:2px solid var(--brand-primary);display:inline-block;text-align:center;width:100%}.detail-section:last-child h5{border-bottom-color:var(--color-slate-500)}.detail-section{background:var(--bg-primary);padding:var(--spacing-lg);border-radius:var(--border-radius-sm);border:1px solid var(--brand-primary-10);box-shadow:var(--shadow-sm)}.detail-section ul{list-style:none;padding:0;margin:0}.detail-section li{padding:var(--spacing-sm) var(--spacing-md);border-bottom:1px solid var(--black-5);font-size:0.9375rem;line-height:1.5;color:var(--text-primary);border-radius:var(--border-radius-xs);margin-bottom:var(--spacing-xs);transition:background-color 0.2s ease}.detail-section li:hover{background:var(--brand-primary-3)}.detail-section li:last-child{border-bottom:none;margin-bottom:0}.detail-section strong{font-weight:600;color:var(--text-primary)}.factor-guidance{grid-column:1 / -1;background:var(--bg-primary);padding:var(--spacing-lg);border-radius:var(--border-radius-sm);border:2px solid var(--accent);margin-top:var(--spacing-lg);text-align:center}.factor-guidance p{margin:0;font-size:0.9375rem;line-height:1.6;color:var(--text-primary)}.factor-guidance strong{color:var(--accent);font-weight:600}.decision-summary{background:linear-gradient(135deg, var(--brand-primary-5), var(--brand-accent-10));border-top:1px solid var(--brand-primary-10);padding:var(--spacing-xl);text-align:center}.summary-content h3{font-size:1.375rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-md)}.summary-content p{font-size:1rem;color:var(--color-slate-600);line-height:1.6;margin-bottom:var(--spacing-lg);max-width:700px;margin-left:auto;margin-right:auto}.next-steps{background:var(--bg-primary);padding:var(--spacing-lg);border-radius:var(--border-radius-sm);border:1px solid var(--brand-primary);max-width:600px;margin:0 auto}.next-steps p{margin:0;font-size:1rem;color:var(--text-primary)}.next-steps strong{color:var(--brand-primary);font-weight:600}.matrix-header{background:linear-gradient(135deg, var(--brand-primary), var(--primary-dark));color:white;padding:var(--spacing-xl);text-align:center;position:relative}.matrix-header::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M20 20c0-5.5-4.5-10-10-10s-10 4.5-10 10 4.5 10 10 10 10-4.5 10-10zm10 0c0-5.5-4.5-10-10-10s-10 4.5-10 10 4.5 10 10 10 10-4.5 10-10z'/%3E%3C/g%3E%3C/svg%3E") repeat;pointer-events:none}.matrix-title{font-size:1.75rem;font-weight:700;position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm)}.matrix-icon{font-size:2rem}.interaction-hint{font-size:0.75rem;opacity:0.6;font-weight:400;background:var(--white-10);padding:4px 12px;border-radius:16px;backdrop-filter:blur(10px);margin-top:var(--spacing-sm)}.matrix-columns-header{display:grid;grid-template-columns:2fr 2fr 2fr;background:var(--brand-primary-80);color:white;padding:var(--spacing-lg);font-weight:600}.column-label{text-align:center;font-size:1.125rem}.acsr-column{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm)}.brand-logo{font-weight:700;font-size:1.25rem}.winner-badge{background:linear-gradient(135deg, var(--brand-primary), var(--accent));color:white;padding:4px 12px;border-radius:20px;font-size:0.75rem;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;opacity:0.9}.matrix-features{background:var(--bg-primary)}.matrix-row{display:grid;grid-template-columns:2fr 2fr 2fr;border-bottom:1px solid var(--brand-primary-10);transition:var(--transition-base);position:relative}.matrix-row:hover{background:var(--brand-primary-3);box-shadow:0 1px 4px var(--brand-primary-10);transition:all 0.3s ease}.matrix-row.expanded{background:var(--brand-primary-5)}.matrix-row:last-child{border-bottom:none}.feature-cell{padding:var(--spacing-lg);display:flex;align-items:center;gap:var(--spacing-sm);cursor:pointer;transition:var(--transition-base)}.feature-cell:hover{background:var(--brand-primary-3);transition:background 0.3s ease}.feature-icon{font-size:1.5rem;width:32px;text-align:center}.feature-name{font-weight:600;color:var(--text-primary);font-size:1rem;flex:1}.expand-indicator{font-size:1rem;font-weight:600;color:var(--brand-primary);width:24px;height:24px;border:1.5px solid var(--brand-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all 0.3s ease;line-height:1;opacity:0.7}.matrix-row:hover .expand-indicator{opacity:1;border-width:2px}.matrix-row.expanded .expand-indicator{background:var(--brand-primary);color:white;transform:rotate(45deg)}.acsr-cell, .competitor-cell{padding:var(--spacing-lg);text-align:center;display:flex;flex-direction:column;gap:var(--spacing-sm);border-left:1px solid var(--brand-primary-10)}.acsr-cell.winner{background:linear-gradient(135deg, var(--brand-primary-5), var(--brand-accent-10));border-left-color:var(--brand-primary);border-left-width:3px;position:relative}.acsr-cell.winner::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg, var(--brand-primary), var(--accent));opacity:0.3}.competitor-cell{background:var(--black-5);border-left:2px solid var(--black-20)}.score{font-size:1.5rem;font-weight:800;padding:var(--spacing-sm);border-radius:50px;margin-bottom:var(--spacing-sm)}.acsr-cell .score{background:linear-gradient(135deg, var(--brand-primary), var(--accent));color:white}.competitor-cell .score{background:linear-gradient(135deg, var(--color-slate-500), var(--color-slate-600));color:white}.summary{font-weight:700;font-size:1rem;color:var(--text-primary)}.highlight{font-size:0.875rem;color:var(--color-slate-600);font-weight:600}.acsr-cell .highlight{color:var(--brand-primary)}.feature-details{grid-column:1 / -1;background:linear-gradient(135deg, var(--bg-secondary), var(--brand-primary-3));border-top:2px solid var(--brand-primary-30);max-height:0;overflow:hidden;opacity:0;transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1);box-shadow:inset 0 2px 4px var(--black-5)}.feature-details.expanded{max-height:800px;opacity:1;padding:var(--spacing-xl)}.details-content{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-xl);max-width:1000px;margin:0 auto}.acsr-details, .competitor-details{background:var(--bg-primary);padding:var(--spacing-lg);border-radius:var(--border-radius-md);box-shadow:var(--shadow-sm)}.acsr-details{border:2px solid var(--brand-primary)}.competitor-details{border:2px solid var(--color-slate-500)}.acsr-details h4{color:var(--brand-primary);font-size:1.125rem;font-weight:700;margin-bottom:var(--spacing-md)}.competitor-details h4{color:var(--color-slate-600);font-size:1.125rem;font-weight:700;margin-bottom:var(--spacing-md)}.acsr-details ul, .competitor-details ul{list-style:none;padding:0;margin:0}.acsr-details li, .competitor-details li{padding:var(--spacing-sm) 0;border-bottom:1px solid var(--black-10);font-size:0.9375rem;line-height:1.5}.acsr-details li:last-child, .competitor-details li:last-child{border-bottom:none}.matrix-summary{background:linear-gradient(135deg, var(--brand-primary), var(--primary-dark));color:white;padding:var(--spacing-xl);text-align:center}.overall-score{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-xl);margin-bottom:var(--spacing-xl);max-width:600px;margin:0 auto var(--spacing-xl)}.acsr-total, .competitor-total{padding:var(--spacing-lg);border-radius:var(--border-radius-md);background:var(--white-10);backdrop-filter:blur(10px)}.score-label{display:block;font-size:0.875rem;opacity:0.8;margin-bottom:var(--spacing-sm)}.score-value{display:block;font-size:2rem;font-weight:800;margin-bottom:var(--spacing-sm)}.score-grade{display:block;font-size:1.25rem;font-weight:700;padding:var(--spacing-sm);border-radius:20px}.acsr-total .score-grade{background:var(--accent);color:white}.competitor-total .score-grade{background:var(--color-slate-500);color:white}.decision-recommendation h3{font-size:1.5rem;font-weight:700;margin-bottom:var(--spacing-md)}.decision-recommendation p{font-size:1.125rem;opacity:0.9;line-height:1.6;max-width:800px;margin:0 auto}.comparison-cta{text-align:center;margin-top:var(--spacing-2xl);padding:var(--spacing-xl);background:linear-gradient(135deg, var(--brand-primary), var(--primary-dark));border-radius:var(--border-radius-lg);color:white;position:relative;overflow:hidden}.comparison-cta::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") repeat;pointer-events:none}.comparison-cta h3{font-size:1.375rem;margin-bottom:var(--spacing-md);position:relative;z-index:1}.comparison-cta p{font-size:1.125rem;opacity:0.9;margin-bottom:var(--spacing-lg);position:relative;z-index:1}.comparison-btn{font-size:1.125rem;padding:var(--spacing-md) var(--spacing-xl);position:relative;z-index:1}.cta-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:1.5rem}.cta-buttons .comparison-btn{flex:1;min-width:200px;max-width:280px}========================================================================== */ .locations-section{padding:var(--spacing-3xl) 0;background:var(--bg-secondary);position:relative}.locations-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(350px, 1fr));gap:var(--spacing-xl);margin-bottom:var(--spacing-2xl)}.location-card{background:var(--bg-primary);padding:var(--spacing-xl);border-radius:var(--border-radius-lg);border:3px solid transparent;box-shadow:var(--shadow-sm);transition:var(--transition-base);text-align:center;position:relative;overflow:hidden}.location-card::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg, var(--brand-primary) 0%, var(--accent) 100%);opacity:0;transition:var(--transition-base);z-index:0}.location-card:hover{transform:translateY(-8px) scale(1.02);border-color:var(--brand-primary);box-shadow:var(--shadow-dark-glow)}.location-card:hover::before{opacity:0.05}.location-card > *{position:relative;z-index:1}.location-icon{width:80px;height:80px;margin:0 auto var(--spacing-lg);background:linear-gradient(135deg, var(--brand-primary), var(--primary-dark));border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;transition:var(--transition-base)}.location-card:hover .location-icon{background:linear-gradient(135deg, var(--accent), var(--accent-glow));transform:scale(1.1);box-shadow:var(--shadow-glow)}.location-card h3{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-md)}.location-card p{color:var(--color-slate-600);line-height:1.7;margin-bottom:var(--spacing-lg)}.location-features{display:flex;flex-direction:column;gap:var(--spacing-sm);text-align:left}.location-features span{color:var(--text-primary);font-weight:500;font-size:0.95rem;display:flex;align-items:center;gap:var(--spacing-sm)}.location-features span::before{content:'✓';color:var(--accent);font-weight:800;font-size:1rem}.locations-cta{text-align:center}.btn-primary.locations-btn, .locations-btn{font-size:1.25rem !important;padding:var(--space-lg) var(--space-2xl) !important;background:var(--brand-primary) !important;color:var(--color-white) !important;border:2px solid var(--brand-primary) !important;border-radius:var(--radius-xl) !important;text-decoration:none !important;display:inline-flex !important;align-items:center !important;gap:var(--space-md) !important;font-weight:600 !important;transition:all var(--transition-base) !important;box-shadow:0 4px 12px var(--brand-primary-30) !important}.btn-primary.locations-btn:hover, .locations-btn:hover{background:var(--brand-accent) !important;border-color:var(--brand-accent) !important;transform:translateY(-2px) !important;box-shadow:0 8px 20px var(--brand-accent-40) !important}.locations-btn svg{width:24px;height:24px}/* ========================================================================== ABOUT SECTION ========================================================================== */ .about-section{padding:var(--spacing-3xl) 0;background:var(--bg-primary);position:relative;overflow:hidden}.about-section::before{content:'';position:absolute;top:20%;left:-200px;width:400px;height:400px;background:linear-gradient(45deg, var(--brand-primary), var(--accent));opacity:0.03;border-radius:50%;animation:float 8s ease-in-out infinite}.about-content{display:grid;grid-template-columns:3fr 2fr;gap:var(--space-2xl);align-items:center;max-width:1200px;margin:0 auto}.about-text{text-align:center;padding:var(--space-xl) var(--space-lg)}.about-text .section-title{text-align:center;margin-bottom:var(--space-xl);font-size:clamp(1.875rem, 4vw, 2.5rem);line-height:1.2}.about-text .lead{text-align:center;margin-bottom:var(--space-xl);font-size:clamp(1.125rem, 2.5vw, 1.25rem);line-height:1.6;padding:0 var(--space-md)}.about-text p{text-align:center;margin-bottom:var(--space-lg);line-height:1.65;font-size:clamp(0.9rem, 2vw, 1rem);padding:0 var(--space-sm)}.about-text ul, .about-text li{text-align:center}/* Process section collapsible timeline - DISABLED DUE TO CONFLICTS .process-section-timeline-item{margin-bottom:2rem;border:1px solid var(--border-light);border-radius:var(--border-radius-lg);background:var(--bg-primary);box-shadow:var(--shadow-sm);overflow:hidden}*/ .process-section-timeline-content{padding:1.5rem}.process-section-timeline-header{display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:0.5rem 0;border-radius:var(--border-radius-md);transition:background-color 0.3s ease}.process-section-timeline-header:hover{background-color:var(--bg-secondary);padding:0.5rem 1rem;margin:-0.5rem -1rem 0.5rem -1rem}.process-section-timeline-title{margin:0;font-size:1.25rem;color:var(--text-primary)}.timeline-toggle-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background-color:var(--accent);color:white;transition:transform 0.3s ease, background-color 0.3s ease}.timeline-toggle-icon svg{transition:transform 0.3s ease}.expandable-content.active ~ .process-section-timeline-header .timeline-toggle-icon{background-color:var(--accent-dark)}.expandable-content.active ~ .process-section-timeline-header .timeline-toggle-icon svg{transform:rotate(180deg)}.expandable-content{max-height:0;overflow:hidden;transition:max-height 0.4s ease-out;margin-top:0}.expandable-content.active{max-height:1000px;margin-top:1rem}.about-story{margin-bottom:var(--spacing-2xl)}.about-story .lead{font-size:1.25rem;font-weight:600;color:var(--text-primary);line-height:1.7;margin-bottom:var(--spacing-lg)}.about-story p{font-size:1.125rem;color:var(--color-slate-600);line-height:1.7;margin-bottom:var(--spacing-lg)}.about-stats{display:grid;grid-template-columns:repeat(2, 1fr);gap:var(--spacing-lg);margin-bottom:var(--spacing-2xl);padding:var(--spacing-xl);background:var(--bg-secondary);border-radius:var(--border-radius-lg);border:3px solid var(--brand-primary)}.stat-item{text-align:center;padding:var(--spacing-md)}.stat-number{font-size:2rem;font-weight:800;color:var(--accent);line-height:1;margin-bottom:var(--spacing-sm);text-shadow:0 2px 4px var(--brand-accent-20)}.stat-label{font-size:0.95rem;color:var(--color-slate-600);font-weight:600;text-transform:uppercase;letter-spacing:1px}.about-values h3{font-size:1.5rem;color:var(--text-primary);margin-bottom:var(--spacing-lg);font-weight:700}.values-list{list-style:none;padding:0}.values-list li{padding:var(--spacing-md) 0;border-bottom:1px solid var(--brand-primary-10);color:var(--color-slate-600);line-height:1.6;position:relative;padding-left:var(--spacing-lg)}.values-list li::before{content:'✓';position:absolute;left:0;color:var(--accent);font-weight:800;font-size:1.125rem}.values-list li:last-child{border-bottom:none}.about-image{position:relative;border-radius:var(--border-radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);transition:var(--transition-base)}.about-image:hover{transform:scale(1.02);box-shadow:var(--shadow-dark-glow)}.about-main-image{width:100%;height:400px;object-fit:cover;transition:transform var(--transition-base)}.about-image:hover .about-main-image{transform:scale(1.05)}.about-image-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent, var(--brand-primary-90));color:white;padding:var(--spacing-xl);transform:translateY(100%);transition:transform var(--transition-base)}.about-image:hover .about-image-overlay{transform:translateY(0)}.overlay-content h4{font-size:1.25rem;font-weight:700;margin-bottom:var(--spacing-sm)}.overlay-content p{font-size:0.95rem;opacity:0.9}/* ========================================================================== SECTION 4:PROCESS/TIMELINE SECTION ========================================================================== */ .process-section{padding:5rem 0;background:var(--bg-primary);position:relative;overflow:hidden}.process-section::before{content:'';position:absolute;top:20%;right:-200px;width:400px;height:400px;background:linear-gradient(45deg, var(--brand-primary), var(--accent));opacity:0.05;border-radius:50%;animation:float 6s ease-in-out infinite}@keyframes float{0%, 100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-30px) rotate(180deg)}}.process-timeline{position:relative;max-width:1000px;margin:0 auto}.timeline-item{display:grid;grid-template-columns:80px 1fr;gap:2rem;margin-bottom:4rem;position:relative}.timeline-item::before{content:'';position:absolute;left:40px;top:80px;bottom:-2rem;width:2px;background:linear-gradient(180deg, var(--brand-primary) 0%, var(--accent) 100%)}.timeline-item:last-child::before{display:none}.timeline-marker{width:80px;height:80px;background:var(--brand-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:1.5rem;font-weight:700;position:relative;z-index:1;transition:var(--transition-slow);box-shadow:0 0 0 4px var(--bg-primary), 0 0 0 6px var(--brand-primary)}.timeline-item:hover .timeline-marker{background:var(--accent);transform:scale(1.1);box-shadow:0 0 0 4px var(--bg-primary), 0 0 0 6px var(--accent), var(--shadow-glow)}.timeline-content{padding-top:1rem}.timeline-title{font-size:1.5rem;font-weight:700;margin-bottom:1rem;color:var(--text-primary)}.timeline-description{color:var(--color-slate-600);line-height:1.7;margin-bottom:1rem}.timeline-expand{color:var(--brand-primary);text-decoration:none;font-weight:600;transition:var(--transition-base);display:inline-flex;align-items:center;gap:0.5rem}.timeline-expand:hover{color:var(--accent);transform:translateX(5px)}.process-section-timeline{position:relative;max-width:1000px;margin:0 auto}.process-section-timeline-item{display:grid;grid-template-columns:80px 1fr;gap:2rem;margin-bottom:4rem;position:relative}.process-section-timeline-item::before{content:'';position:absolute;left:40px;top:80px;bottom:-2rem;width:2px;background:linear-gradient(180deg, var(--brand-primary) 0%, var(--accent) 100%)}.process-section-timeline-item:last-child::before{display:none}.process-section-timeline-marker{width:80px;height:80px;background:var(--brand-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:1.5rem;font-weight:700;position:relative;z-index:2;transition:var(--transition-base);box-shadow:0 0 0 4px var(--bg-primary)}.process-section-timeline-item:hover .process-section-timeline-marker{background:var(--accent);transform:scale(1.1);box-shadow:0 0 0 4px var(--bg-primary), 0 0 0 6px var(--accent), var(--shadow-glow)}.process-section-timeline-content{background:var(--bg-primary);padding:2rem;border-radius:12px;border:2px solid transparent;box-shadow:0 4px 6px var(--black-5);transition:all 0.3s ease;position:relative}.process-section-timeline-content:hover{transform:translateY(-2px);border-color:var(--brand-primary);box-shadow:0 8px 25px var(--black-10)}.process-section-timeline-header{display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:1rem;margin:-1rem;border-radius:8px;transition:all 0.3s ease;position:relative;background:transparent}.process-section-timeline-header:hover{background:linear-gradient(135deg, var(--color-info-light), var(--color-error-light));transform:translateX(4px)}.process-section-timeline-header:active{transform:translateX(2px) scale(0.98)}.process-section-timeline-title{font-size:1.375rem;font-weight:700;color:var(--text-primary);margin:0;transition:color 0.3s ease;flex:1}.process-section-timeline-header:hover .process-section-timeline-title{color:var(--brand-primary)}.timeline-toggle-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--brand-primary);color:white;transition:all 0.3s ease;flex-shrink:0;margin-left:1rem}.process-section-timeline-header:hover .timeline-toggle-icon{background:var(--accent);transform:scale(1.1)}.timeline-toggle-icon svg{transition:transform 0.3s ease;width:16px;height:16px}.process-section-timeline-header.expanded .timeline-toggle-icon svg{transform:rotate(180deg)}.process-section-timeline-description{color:var(--color-slate-600);line-height:1.7;margin:1rem 0;transition:color 0.3s ease}.expandable-content{max-height:0;overflow:hidden;transition:max-height 0.6s ease, opacity 0.4s ease;margin-top:1.5rem;opacity:0}.expandable-content.active{max-height:800px;opacity:1}.expand-text{padding:1.5rem;background:var(--white-5);border-radius:12px;border:1px solid var(--brand-accent-10);line-height:1.6;color:var(--color-slate-600);box-shadow:inset 0 1px 3px var(--black-5)}/* ========================================================================== RESPONSIVE DESIGN ========================================================================== */ @media (max-width:1024px) and (min-width:769px){.trust-indicators{grid-template-columns:repeat(2, 1fr);gap:var(--spacing-xl);max-width:800px;margin:0 auto}.trust-indicator{padding:var(--spacing-xl)}}@media (max-width:767px){.hero-features{grid-template-columns:1fr;gap:var(--spacing-sm)}.hero-actions{flex-direction:column;align-items:center;gap:var(--spacing-md)}.pricing-grid, .pricing-section-grid, .gallery-grid, .gallery-section-grid{grid-template-columns:1fr}.timeline-item, .process-section-timeline-item{grid-template-columns:60px 1fr;gap:var(--spacing-md)}.timeline-marker, .process-section-timeline-marker{width:60px;height:60px;font-size:1.25rem}.process-section-timeline-item::before{left:30px}.trust-signals-grid{grid-template-columns:1fr;gap:var(--spacing-lg)}.trust-indicators{grid-template-columns:repeat(2, 1fr);gap:var(--spacing-lg)}.factor-preview{grid-template-columns:1fr;gap:var(--spacing-md);margin:0 var(--spacing-md) var(--spacing-lg);text-align:center}.expand-toggle-center{order:-1;margin-bottom:var(--spacing-md)}.factor-header{padding:var(--spacing-md) var(--spacing-lg)}.details-grid{grid-template-columns:1fr;gap:var(--spacing-lg);padding:var(--spacing-lg)}.guide-intro{padding:var(--spacing-lg)}.guide-title{font-size:1.25rem}.guide-description{font-size:0.9375rem}.comparison-header, .comparison-row{grid-template-columns:1fr;gap:var(--spacing-md);text-align:center}.feature-name{font-weight:700;font-size:1.125rem;margin-bottom:var(--spacing-md);background:var(--bg-secondary);padding:var(--spacing-md);border-radius:var(--border-radius-sm)}.comparison-btn{font-size:1.125rem;padding:var(--spacing-md) var(--spacing-lg)}.faq-question{padding:var(--spacing-md) var(--spacing-lg);font-size:1rem}.faq-answer p, .faq-answer ul{padding-left:var(--spacing-lg);padding-right:var(--spacing-lg)}.locations-grid{grid-template-columns:1fr;gap:var(--spacing-lg)}.location-features{text-align:center}.about-text{padding:var(--space-lg) var(--space-md)}.trust-image-grid{grid-template-columns:repeat(2, 1fr);padding:0 var(--space-md)}.trust-image-tile{width:100%;height:auto;aspect-ratio:1}.about-stats{grid-template-columns:1fr;gap:var(--spacing-md)}.stat-number{font-size:2rem}}@media (max-width:480px){.trust-indicators{grid-template-columns:1fr}.trust-image-grid{grid-template-columns:1fr;padding:0 var(--space-sm)}.trust-icon{width:60px;height:60px}.testimonial-card{padding:var(--spacing-lg)}.locations-btn, .comparison-btn{width:100%;max-width:320px;margin:0 auto}.about-stats{padding:var(--spacing-md)}.stat-number{font-size:1.375rem}}.reviews-carousel-container{margin:var(--spacing-3xl) 0;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:var(--spacing-lg);width:100vw;margin-left:calc(-50vw + 50%);padding:0 2rem}.reviews-carousel{overflow:hidden;position:relative;width:100%;height:clamp(240px, 30vw, 300px)}.carousel-track{display:flex;gap:clamp(1rem, 3vw, 2rem);animation-timing-function:linear;animation-iteration-count:infinite;width:200%}.carousel-ltr .carousel-track{animation-name:slideLeft;animation-duration:30s}.carousel-rtl .carousel-track{animation-name:slideRight;animation-duration:25s}.google-review-card{background:var(--bg-primary);border-radius:var(--border-radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-lg);transition:all 0.3s ease;position:relative;overflow:hidden;width:clamp(280px, 25vw, 400px);height:clamp(200px, 20vw, 260px);flex-shrink:0;text-decoration:none;color:inherit;border:3px solid transparent;background-clip:padding-box}.carousel-ltr .google-review-card{border-color:var(--brand-primary)}.carousel-rtl .google-review-card{border-color:var(--accent)}@keyframes slideLeft{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}@keyframes slideRight{0%{transform:translateX(-50%)}100%{transform:translateX(0)}}.google-review-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg, var(--brand-primary) 0%, var(--accent) 100%);opacity:0;transition:opacity var(--transition-base)}.google-review-card:hover{box-shadow:var(--shadow-xl);border-color:var(--brand-primary);text-decoration:none;color:inherit;z-index:20}.google-review-card:hover::before{opacity:1}.reviews-carousel:hover .carousel-track{animation-play-state:paused}.reviewer-info{margin-bottom:var(--spacing-xs)}.reviewer-info strong{display:block;color:var(--text-primary);font-weight:600;font-size:1.1rem}.reviewer-meta{font-size:0.875rem;color:var(--color-slate-600);opacity:0.8}.google-stars{display:flex;gap:2px;margin-bottom:var(--spacing-xs)}.google-stars .star{color:var(--accent);font-size:1.2rem;text-shadow:0 2px 4px var(--brand-accent-30)}.review-text{font-size:0.85rem;line-height:1.4;color:var(--text-primary);font-style:italic;margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;position:relative}.center-text{text-align:center}@media (max-width:1024px){.pinwheel-container{height:700px}.pinwheel-hub{width:100px;height:100px}.pinwheel-hub::before{width:75px;height:75px}.pinwheel-hub::after{width:35px;height:35px}@keyframes carouselRide{0%{transform:translate(-50%, -50%) rotate(0deg) translateX(280px) translateY(0px)}12.5%{transform:translate(-50%, -50%) rotate(45deg) translateX(280px) translateY(-25px)}25%{transform:translate(-50%, -50%) rotate(90deg) translateX(280px) translateY(-40px)}37.5%{transform:translate(-50%, -50%) rotate(135deg) translateX(280px) translateY(-25px)}50%{transform:translate(-50%, -50%) rotate(180deg) translateX(280px) translateY(0px)}62.5%{transform:translate(-50%, -50%) rotate(225deg) translateX(280px) translateY(25px)}75%{transform:translate(-50%, -50%) rotate(270deg) translateX(280px) translateY(40px)}87.5%{transform:translate(-50%, -50%) rotate(315deg) translateX(280px) translateY(25px)}100%{transform:translate(-50%, -50%) rotate(360deg) translateX(280px) translateY(0px)}}}@media (max-width:768px){.pinwheel-reviews-carousel{margin:var(--spacing-2xl) 0}.pinwheel-container{height:600px}.google-review-card{width:clamp(240px, 30vw, 320px);height:clamp(180px, 25vw, 240px);padding:var(--spacing-md)}.reviews-carousel-container{padding:0 1rem}.pinwheel-hub{width:80px;height:80px}.pinwheel-hub::before{width:60px;height:60px}.pinwheel-hub::after{width:30px;height:30px}@keyframes carouselRide{0%{transform:translate(-50%, -50%) rotate(0deg) translateX(200px) translateY(0px)}12.5%{transform:translate(-50%, -50%) rotate(45deg) translateX(200px) translateY(-20px)}25%{transform:translate(-50%, -50%) rotate(90deg) translateX(200px) translateY(-30px)}37.5%{transform:translate(-50%, -50%) rotate(135deg) translateX(200px) translateY(-20px)}50%{transform:translate(-50%, -50%) rotate(180deg) translateX(200px) translateY(0px)}62.5%{transform:translate(-50%, -50%) rotate(225deg) translateX(200px) translateY(20px)}75%{transform:translate(-50%, -50%) rotate(270deg) translateX(200px) translateY(30px)}87.5%{transform:translate(-50%, -50%) rotate(315deg) translateX(200px) translateY(20px)}100%{transform:translate(-50%, -50%) rotate(360deg) translateX(200px) translateY(0px)}}.review-text{-webkit-line-clamp:4}}@media (max-width:480px){.pinwheel-container{height:500px}.google-review-card{width:clamp(200px, 35vw, 280px);height:clamp(160px, 28vw, 220px);padding:var(--spacing-sm)}.reviews-carousel-container{padding:0 0.5rem}.pinwheel-hub{width:60px;height:60px}.pinwheel-hub::before{width:45px;height:45px}.pinwheel-hub::after{width:25px;height:25px}@keyframes carouselRide{0%{transform:translate(-50%, -50%) rotate(0deg) translateX(160px) translateY(0px)}12.5%{transform:translate(-50%, -50%) rotate(45deg) translateX(160px) translateY(-15px)}25%{transform:translate(-50%, -50%) rotate(90deg) translateX(160px) translateY(-25px)}37.5%{transform:translate(-50%, -50%) rotate(135deg) translateX(160px) translateY(-15px)}50%{transform:translate(-50%, -50%) rotate(180deg) translateX(160px) translateY(0px)}62.5%{transform:translate(-50%, -50%) rotate(225deg) translateX(160px) translateY(15px)}75%{transform:translate(-50%, -50%) rotate(270deg) translateX(160px) translateY(25px)}87.5%{transform:translate(-50%, -50%) rotate(315deg) translateX(160px) translateY(15px)}100%{transform:translate(-50%, -50%) rotate(360deg) translateX(160px) translateY(0px)}}.review-text{font-size:0.85rem;-webkit-line-clamp:3}.reviewer-info strong{font-size:1rem}}@media (prefers-reduced-motion:reduce){.pinwheel-card{animation:none}.pinwheel-card[data-position="1"]{transform:translate(-50%, -50%) rotate(0deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="2"]{transform:translate(-50%, -50%) rotate(22.5deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="3"]{transform:translate(-50%, -50%) rotate(45deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="4"]{transform:translate(-50%, -50%) rotate(67.5deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="5"]{transform:translate(-50%, -50%) rotate(90deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="6"]{transform:translate(-50%, -50%) rotate(112.5deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="7"]{transform:translate(-50%, -50%) rotate(135deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="8"]{transform:translate(-50%, -50%) rotate(157.5deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="9"]{transform:translate(-50%, -50%) rotate(180deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="10"]{transform:translate(-50%, -50%) rotate(202.5deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="11"]{transform:translate(-50%, -50%) rotate(225deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="12"]{transform:translate(-50%, -50%) rotate(247.5deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="13"]{transform:translate(-50%, -50%) rotate(270deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="14"]{transform:translate(-50%, -50%) rotate(292.5deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="15"]{transform:translate(-50%, -50%) rotate(315deg) translateX(350px) translateY(0px)}.pinwheel-card[data-position="16"]{transform:translate(-50%, -50%) rotate(337.5deg) translateX(350px) translateY(0px)}}.google-review-card:focus{outline:2px solid var(--brand-primary);outline-offset:2px;z-index:30}/* ========================================================================== LOCATION SECTION STYLES ========================================================================== */ .map-section{background:var(--neutral-50);padding:var(--spacing-2xl) var(--spacing-lg)}.map-container{max-width:1200px;margin:0 auto}.map-header{text-align:center;margin-bottom:var(--spacing-xl)}.map-header h3{font-size:2rem;color:var(--brand-primary);margin-bottom:var(--spacing-md)}.map-header p{font-size:1.125rem;color:var(--neutral-700);margin-bottom:var(--spacing-lg);max-width:600px;margin-left:auto;margin-right:auto}.business-address{background:var(--brand-neutral-white);padding:var(--space-lg);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);border:2px solid var(--brand-primary);margin:0 auto var(--space-lg);max-width:400px;text-align:center}.business-address strong{color:var(--brand-primary);font-size:1.25rem;display:block;margin-bottom:var(--spacing-sm)}.business-address a{color:var(--accent);text-decoration:none;font-weight:600}.business-address a:hover{text-decoration:underline}.map-embed{text-align:center}.map-embed iframe{border-radius:12px;box-shadow:var(--shadow-md);border:1px solid var(--neutral-200)}/* ========================================================================== ACSR - Advanced CSS Implementation Using DCF 5.0 Framework Principles ========================================================================== */ /* ========================================================================== Base Styles & Reset ========================================================================== */ *, *::before, *::after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;font-size:var(--text-base);line-height:var(--leading-normal);color:var(--color-text-primary);background:var(--color-bg-primary);overflow-x:hidden}img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}/* ========================================================================== Container & Layout ========================================================================== */ .container{max-width:1200px;margin:0 auto;padding:0 var(--space-6)}@media (max-width:768px){.container{padding:0 var(--space-4)}}/* ========================================================================== Navigation with Advanced Hover Effects ========================================================================== */ .navbar{position:fixed;top:0;left:0;right:0;background:var(--white-95);backdrop-filter:blur(10px);border-bottom:1px solid var(--color-border);z-index:1000;transition:var(--transition-base)}.nav-wrapper{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) 0;gap:var(--space-8)}.nav-brand{flex-shrink:0}.brand-name{font-size:var(--text-2xl);font-weight:800;color:var(--color-primary);margin:0;letter-spacing:-0.5px}.brand-tagline{font-size:var(--text-xs);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:1px}.nav-main{display:flex;gap:var(--space-8);align-items:center}.nav-link{position:relative;font-weight:500;color:var(--color-text-primary);transition:var(--transition-fast);padding:var(--space-2) 0}.nav-link::after{content:'';position:absolute;bottom:-2px;left:0;width:0;height:2px;background:var(--color-primary);transition:width 0.3s var(--ease-out-quint)}.nav-link:hover{color:var(--color-primary)}.nav-link:hover::after{width:100%}.btn-call{display:flex;flex-direction:column;align-items:center;padding:var(--space-2) var(--space-4);background:var(--color-primary);color:white;border-radius:var(--radius-lg);transition:var(--transition-base);position:relative;overflow:hidden}.btn-call:hover{background:var(--color-primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-call .btn-text{font-size:var(--text-lg);font-weight:700}.btn-call .btn-subtext{font-size:var(--text-xs);opacity:0.9}/* ========================================================================== Hero Section with Advanced Animations ========================================================================== */ .hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;padding-top:80px}.hero-background{position:absolute;top:0;left:0;right:0;bottom:0;z-index:-2}.hero-bg-image{width:100%;height:100%;object-fit:cover;object-position:center}.hero-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(180deg, var(--brand-primary-90) 0%, var(--brand-primary-70) 50%, var(--brand-primary-90) 100%);z-index:-1}.hero-content{text-align:center;color:white;position:relative;z-index:1}.hero-badge{display:inline-block;padding:var(--space-2) var(--space-4);background:var(--white-15);backdrop-filter:blur(10px);border:1px solid var(--white-20);border-radius:var(--radius-full);margin-bottom:var(--space-6)}.badge-text{font-size:var(--text-sm);font-weight:600;text-transform:uppercase;letter-spacing:1px}.hero-title{font-size:clamp(1.4rem, 3vw, 1.8rem);font-weight:800;line-height:1.1;margin-bottom:var(--space-6);text-shadow:0 4px 8px var(--black-20)}.hero-price{display:block;color:var(--color-accent);font-size:1.2em;margin-top:var(--space-2);animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%, 100%{transform:scale(1)}50%{transform:scale(1.05)}}.hero-subtitle{font-size:clamp(1.1rem, 3vw, 1.5rem);line-height:var(--leading-relaxed);max-width:600px;margin:0 auto var(--space-8);opacity:0.95}.hero-features{display:flex;justify-content:center;gap:var(--space-6);margin-bottom:var(--space-8);flex-wrap:wrap}.feature-item{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);font-weight:500}.feature-icon{width:20px;height:20px;stroke-width:2;color:var(--color-accent)}.hero-actions{display:flex;gap:var(--space-4);justify-content:center;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--space-3) var(--space-6);border-radius:var(--radius-lg);font-weight:600;transition:var(--transition-base);position:relative;overflow:hidden;cursor:pointer;border:none;outline:none}.btn-large{padding:var(--space-4) var(--space-8);font-size:var(--text-lg)}.btn-primary{background:var(--color-accent);color:white;position:relative}.btn-primary::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, var(--white-20), transparent);transition:left 0.6s ease-out;z-index:0;pointer-events:none}.btn-primary:hover::before{left:100%}.btn-primary:hover{background:var(--color-accent-hover);transform:translateY(-3px);box-shadow:0 10px 30px var(--brand-accent-30)}.btn-secondary{background:var(--white-15);color:white;backdrop-filter:blur(10px);border:1px solid var(--white-30);gap:var(--space-2)}.btn-secondary:hover{background:var(--white-30);transform:translateY(-2px)}.btn-arrow{width:20px;height:20px;transition:transform 0.3s ease-out}.btn-secondary:hover .btn-arrow{transform:translateX(4px)}.btn-outline{background:transparent;color:var(--color-primary);border:2px solid var(--color-primary)}.btn-outline:hover{background:var(--color-primary);color:white;transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-block{width:100%}.hero-scroll-indicator{position:absolute;bottom:var(--space-8);left:50%;transform:translateX(-50%);text-align:center;color:white;animation:bounce 2s infinite}@keyframes bounce{0%, 20%, 50%, 80%, 100%{transform:translateX(-50%) translateY(0)}40%{transform:translateX(-50%) translateY(-10px)}60%{transform:translateX(-50%) translateY(-5px)}}.scroll-text{font-size:var(--text-sm);opacity:0.8;display:block;margin-bottom:var(--space-2)}.scroll-arrow{width:30px;height:30px;margin:0 auto;border-right:2px solid white;border-bottom:2px solid white;transform:rotate(45deg);opacity:0.8}/* ========================================================================== Entrance Animations ========================================================================== */ .animate-fade-in{opacity:0;animation:fadeIn 0.6s ease-out forwards}.animate-slide-up{opacity:0;transform:translateY(30px);animation:slideUp 0.6s ease-out forwards}.animate-slide-up-delay{opacity:0;transform:translateY(30px);animation:slideUp 0.6s ease-out 0.2s forwards}.animate-fade-in-delay{opacity:0;animation:fadeIn 0.6s ease-out 0.4s forwards}.animate-scale-in{opacity:0;transform:scale(0.9);animation:scaleIn 0.6s var(--ease-out-back) 0.6s forwards}@keyframes fadeIn{to{opacity:1}}@keyframes slideUp{to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{to{opacity:1;transform:scale(1)}}/* ========================================================================== Pricing Section with Card Hover Effects ========================================================================== */ .pricing-section{padding:var(--space-20) 0;background:var(--color-bg-secondary)}.section-header{text-align:center;margin-bottom:var(--space-16)}.section-title{font-size:clamp(2rem, 5vw, 3rem);font-weight:800;color:var(--color-text-primary);margin-bottom:var(--space-4);line-height:1.2}.section-subtitle{font-size:var(--text-xl);color:var(--color-text-secondary);max-width:600px;margin:0 auto;line-height:var(--leading-relaxed)}.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:var(--space-8);margin-bottom:var(--space-12)}.pricing-card{background:var(--color-bg-primary);border-radius:var(--radius-2xl);overflow:hidden;box-shadow:var(--shadow-md);transition:var(--transition-base);position:relative;transform-style:preserve-3d;perspective:1000px}.pricing-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 20px 40px var(--brand-primary-15)}.pricing-card.featured{border:2px solid var(--color-accent);transform:scale(1.05)}.pricing-card.featured:hover{transform:scale(1.08) translateY(-8px);box-shadow:0 25px 50px var(--brand-accent-20)}.card-badge{position:absolute;top:var(--space-4);right:var(--space-4);background:var(--color-accent);color:white;padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:600;z-index:10;animation:pulse 2s ease-in-out infinite}.card-image{position:relative;height:200px;overflow:hidden;background:var(--color-bg-muted)}.card-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s ease-out}.pricing-card:hover .card-image img{transform:scale(1.1)}.image-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(180deg, transparent 0%, var(--black-70) 100%);padding:var(--space-4);transform:translateY(100%);transition:transform 0.3s ease-out}.pricing-card:hover .image-overlay{transform:translateY(0)}.overlay-text{color:white;font-size:var(--text-sm);font-weight:600;text-transform:uppercase;letter-spacing:1px}.card-content{padding:var(--space-6)}.card-title{font-size:var(--text-xl);font-weight:700;color:var(--color-text-primary);margin-bottom:var(--space-4)}.card-price{display:flex;align-items:baseline;margin-bottom:var(--space-6)}.price-currency{font-size:var(--text-xl);color:var(--color-text-secondary);margin-right:var(--space-1)}.price-amount{font-size:var(--text-5xl);font-weight:800;color:var(--accent);line-height:1}.price-period{font-size:var(--text-base);color:var(--color-text-secondary);margin-left:var(--space-2)}.card-features{list-style:none;margin-bottom:var(--space-6)}.card-features .feature-item{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-3) 0;border-bottom:1px solid var(--color-border)}.card-features .feature-item:last-child{border-bottom:none}.feature-check{width:20px;height:20px;color:var(--color-accent);flex-shrink:0;margin-top:2px}.expandable-trigger{cursor:pointer;position:relative}.expandable-trigger::after{content:'▼';position:absolute;right:var(--space-4);top:50%;transform:translateY(-50%);transition:transform 0.3s ease-out;font-size:var(--text-sm)}.expandable-trigger.expanded::after{transform:translateY(-50%) rotate(180deg)}.expandable-content{max-height:0;overflow:hidden;transition:max-height 0.5s var(--ease-out-quint)}.expandable-content.expanded{max-height:500px;margin-top:var(--space-4)}.expand-text{color:var(--color-text-secondary);line-height:var(--leading-relaxed);padding:var(--space-4);background:var(--color-bg-secondary);border-radius:var(--radius-lg)}.pricing-note{background:var(--color-bg-primary);border-radius:var(--radius-xl);padding:var(--space-8);text-align:center;box-shadow:var(--shadow-md)}.note-title{font-size:var(--text-2xl);font-weight:700;color:var(--color-text-primary);margin-bottom:var(--space-4)}.note-text{color:var(--color-text-secondary);line-height:var(--leading-relaxed);max-width:600px;margin:0 auto}.link-phone{color:var(--color-primary);font-weight:600;text-decoration:underline;transition:var(--transition-fast)}.link-phone:hover{color:var(--color-primary-dark)}/* ========================================================================== Gallery Section with Advanced Hover Effects ========================================================================== */ .gallery-section{padding:var(--space-20) 0;background:var(--color-bg-primary)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(350px, 1fr));gap:var(--space-6);margin-bottom:var(--space-12)}.gallery-item{position:relative;overflow:hidden;border-radius:var(--radius-xl);background:var(--color-bg-muted);transition:var(--transition-base)}.gallery-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl)}.gallery-image{position:relative;height:300px;overflow:hidden}.gallery-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s var(--ease-out-quint)}.gallery-item:hover .gallery-image img{transform:scale(1.1)}.gallery-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(180deg, transparent 0%, var(--brand-primary-90) 100%);display:flex;align-items:flex-end;padding:var(--space-6);opacity:0;transition:opacity 0.3s ease-out}.gallery-item:hover .gallery-overlay{opacity:1}.overlay-content{color:white;transform:translateY(20px);transition:transform 0.3s ease-out 0.1s}.gallery-item:hover .overlay-content{transform:translateY(0)}.overlay-title{font-size:var(--text-xl);font-weight:700;margin-bottom:var(--space-2)}.overlay-description{font-size:var(--text-sm);opacity:0.9;margin-bottom:var(--space-4)}.btn-expand{background:var(--white-20);color:white;padding:var(--space-2) var(--space-4);border:1px solid var(--white-30);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:600;cursor:pointer;transition:var(--transition-fast)}.btn-expand:hover{background:var(--white-30);transform:translateY(-2px)}.expandable-details{max-height:0;overflow:hidden;transition:max-height 0.5s ease-out;padding:0 var(--space-6)}.expandable-details.expanded{max-height:200px;padding:var(--space-4) var(--space-6)}.gallery-cta{text-align:center;padding:var(--space-12) 0}.cta-text{font-size:var(--text-2xl);font-weight:700;color:var(--color-text-primary);margin-bottom:var(--space-6)}/* ========================================================================== Process Timeline with Animations ========================================================================== */ .process-section{padding:var(--space-20) 0;background:var(--color-bg-secondary)}.process-timeline{position:relative;max-width:800px;margin:0 auto}.timeline-item{display:flex;gap:var(--space-6);margin-bottom:var(--space-12);position:relative;opacity:0;transform:translateY(30px);animation:slideUpFade 0.6s ease-out forwards}.timeline-item:nth-child(1){animation-delay:0.1s}.timeline-item:nth-child(2){animation-delay:0.2s}.timeline-item:nth-child(3){animation-delay:0.3s}@keyframes slideUpFade{to{opacity:1;transform:translateY(0)}}.timeline-marker{position:relative;flex-shrink:0;width:60px;height:60px;background:var(--color-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-lg);transition:var(--transition-base)}.timeline-item:hover .timeline-marker{transform:scale(1.1);background:var(--color-primary-dark)}.marker-number{color:white;font-size:var(--text-2xl);font-weight:700}.timeline-content{flex:1;padding-bottom:var(--space-8)}.timeline-title{font-size:var(--text-2xl);font-weight:700;color:var(--color-text-primary);margin-bottom:var(--space-3)}.timeline-description{color:var(--color-text-secondary);line-height:var(--leading-relaxed);margin-bottom:var(--space-4)}.btn-expand-inline{background:transparent;color:var(--color-primary);padding:var(--space-2) var(--space-4);border:1px solid var(--color-primary);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:600;cursor:pointer;transition:var(--transition-fast)}.btn-expand-inline:hover{background:var(--color-primary);color:white;transform:translateX(4px)}/* ========================================================================== About Section ========================================================================== */ .about-section{padding:var(--space-20) 0;background:var(--color-bg-primary)}.about-description{font-size:var(--text-xl);color:var(--color-text-secondary);line-height:var(--leading-relaxed);margin-bottom:var(--space-8)}.about-features{margin-bottom:var(--space-12)}.about-feature{margin-bottom:var(--space-6);padding:var(--space-4);background:var(--color-bg-secondary);border-radius:var(--radius-lg);transition:var(--transition-base)}.about-feature:hover{transform:translateX(8px);box-shadow:var(--shadow-md)}.feature-title{font-size:var(--text-xl);font-weight:700;color:var(--color-primary);margin-bottom:var(--space-2)}.feature-text{color:var(--color-text-secondary);line-height:var(--leading-relaxed)}.about-cta{text-align:center;padding:var(--space-8);background:var(--color-bg-secondary);border-radius:var(--radius-xl)}.cta-lead{font-size:var(--text-xl);font-weight:600;color:var(--color-text-primary);margin-bottom:var(--space-4)}.cta-note{font-size:var(--text-sm);color:var(--color-text-secondary);margin-top:var(--space-3)}.about-image{position:relative;border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-xl)}.about-image img{width:100%;height:auto;display:block}.image-caption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(180deg, transparent 0%, var(--black-70) 100%);color:white;padding:var(--space-4);font-size:var(--text-sm);font-weight:600}/* ========================================================================== Footer - Enhanced Mobile-Responsive Design ========================================================================== */ .container{padding:0 1rem}.footer-minimal{gap:0.75rem}.footer-info{gap:0.5rem}.footer-brand{font-size:1.125rem}.footer-phone{font-size:1rem;padding:0.4rem 0.8rem}.footer-nav-compact{gap:0.5rem}.footer-nav-compact a{font-size:0.8rem;padding:0.4rem 0.6rem}}@media (prefers-color-scheme:dark){.footer{background:var(--color-gray-900)}.footer-phone{background:var(--brand-accent-15)}}/* ========================================================================== Responsive Adjustments ========================================================================== */ @media (max-width:768px){.nav-main{display:none}.hero-features{flex-direction:column;align-items:center}.hero-actions{flex-direction:column;width:100%}.btn-large{width:100%}.pricing-grid{grid-template-columns:1fr}.pricing-card.featured{transform:scale(1)}.gallery-grid{grid-template-columns:1fr}}/* ========================================================================== Performance Optimizations ========================================================================== */ @media (prefers-reduced-motion:reduce){*, *::before, *::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important}}.pricing-card, .gallery-item, .btn, .nav-link::after{will-change:transform;transform:translateZ(0)}.animate-complete{will-change:auto}/* ========================================================================== Enhanced Location Cards with Progressive Disclosure ========================================================================== */ .expanded-service-areas{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:var(--space-6);margin-top:var(--space-8)}.location-card{background:var(--color-bg-primary);border:2px solid var(--color-border);border-radius:12px;padding:var(--space-6);text-align:center;transition:all var(--transition-base);position:relative;overflow:hidden}.location-card:hover{transform:translateY(-4px);box-shadow:0 10px 25px var(--black-15);border-color:var(--color-primary)}.location-card.primary-area{border-color:var(--color-primary);background:linear-gradient(135deg, var(--color-bg-primary), var(--color-sky-50))}.location-card.secondary-area{border-color:var(--color-accent);background:linear-gradient(135deg, var(--color-bg-primary), var(--color-cream))}.location-card .location-icon{width:48px;height:48px;margin:0 auto var(--space-4);background:var(--color-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;transition:all var(--transition-base)}.location-card.secondary-area .location-icon{background:var(--color-accent)}.location-card:hover .location-icon{transform:scale(1.1) rotate(5deg)}.location-card h4{font-size:var(--text-xl);font-weight:700;color:var(--color-text-primary);margin-bottom:var(--space-2)}.service-tag{display:inline-block;background:var(--color-primary);color:white;padding:var(--space-1) var(--space-3);border-radius:20px;font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:0.5px;margin-bottom:var(--space-4)}.location-card.secondary-area .service-tag{background:var(--color-accent)}.location-expand{background:transparent;border:2px solid var(--color-primary);color:var(--color-primary);padding:var(--space-2) var(--space-6);border-radius:25px;font-weight:600;font-size:var(--text-sm);cursor:pointer;transition:all var(--transition-fast);margin-bottom:var(--space-4)}.location-card.secondary-area .location-expand{border-color:var(--color-accent);color:var(--color-accent)}.location-expand:hover{background:var(--color-primary);color:white;transform:translateY(-2px)}.location-card.secondary-area .location-expand:hover{background:var(--color-accent)}.location-details{max-height:0;opacity:0;overflow:hidden;transition:all var(--transition-slow);text-align:left}.location-details.expanded{max-height:300px;opacity:1;padding-top:var(--space-4)}.location-details p{font-size:var(--text-sm);color:var(--color-text-secondary);margin-bottom:var(--space-4)}.location-features{display:flex;flex-direction:column;gap:var(--space-2)}.location-features span{font-size:var(--text-xs);color:var(--color-text-primary);display:flex;align-items:center;gap:var(--space-2)}.location-features span::before{content:'✓';color:var(--color-primary);font-weight:bold}.floating-circles{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:-1;overflow:hidden}.floating-circle{position:absolute;background:linear-gradient(45deg, var(--color-primary), var(--color-accent));border-radius:50%;opacity:0.03;animation:float 20s infinite linear}.floating-circle:nth-child(1){width:80px;height:80px;top:10%;left:10%;animation-delay:0s}.floating-circle:nth-child(2){width:120px;height:120px;top:70%;right:10%;animation-delay:-5s}.floating-circle:nth-child(3){width:60px;height:60px;bottom:20%;left:60%;animation-delay:-10s}.floating-circle:nth-child(4){width:100px;height:100px;top:30%;right:30%;animation-delay:-15s}@keyframes float{0%, 100%{transform:translateY(0px) rotate(0deg)}25%{transform:translateY(-20px) rotate(90deg)}50%{transform:translateY(-40px) rotate(180deg)}75%{transform:translateY(-20px) rotate(270deg)}}.comparison-row{transition:all var(--transition-base);position:relative}.comparison-row:hover{background:var(--color-bg-secondary);transform:scale(1.02);border-radius:8px}.interactive-row{cursor:pointer}.interactive-row .feature-name{display:flex;align-items:center;justify-content:space-between}.comparison-expand-icon{transition:transform var(--transition-base);opacity:0.6}.interactive-row:hover .comparison-expand-icon{opacity:1}.interactive-row.expanded .comparison-expand-icon{transform:rotate(180deg)}.comparison-details{grid-column:1 / -1;max-height:0;opacity:0;overflow:hidden;transition:all var(--transition-slow);background:var(--color-bg-secondary);border-radius:8px;margin-top:var(--space-4)}.comparison-details.expanded{max-height:500px;opacity:1;padding:var(--space-6)}.detail-content{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6)}.overhead-detail, .cabinet-detail{background:var(--color-bg-primary);padding:var(--space-4);border-radius:8px;border-left:4px solid var(--color-primary)}.cabinet-detail{border-left-color:var(--color-accent)}.overhead-detail h4, .cabinet-detail h4{color:var(--color-text-primary);font-size:var(--text-lg);margin-bottom:var(--space-3)}.overhead-detail ul, .cabinet-detail ul{list-style:none;padding:0}.overhead-detail li, .cabinet-detail li{padding:var(--space-2) 0;border-bottom:1px solid var(--color-border);color:var(--color-text-secondary);font-size:var(--text-sm)}.overhead-detail li:last-child, .cabinet-detail li:last-child{border-bottom:none}@media (max-width:768px){.detail-content{grid-template-columns:1fr;gap:var(--space-4)}}/* ========================================================================== Dual Google Reviews Carousel Section Styles ========================================================================== */ .center-text{text-align:center}/* ========================================================================== Merry-Go-Round Reviews Carousel Styles ========================================================================== */ .carousel-reviews-section{margin:var(--space-12) 0;position:relative;overflow:visible;padding:var(--space-8) 0}.carousel-reviews-section h2, .carousel-reviews-section .section-title{margin-bottom:1.5rem !important;font-weight:700;color:var(--text-primary, var(--color-gray-900))}.carousel-reviews-section p, .carousel-reviews-section .section-description{margin-bottom:4rem !important;font-size:1.125rem;line-height:1.6;color:var(--text-secondary, var(--color-gray-600));max-width:800px;margin-left:auto;margin-right:auto;padding:0 2rem}.carousel-container{position:relative;width:100%;height:900px;display:flex;align-items:center;justify-content:center;perspective:1500px;transform-style:preserve-3d}.carousel-pole{position:absolute;width:20px;height:700px;background:linear-gradient(180deg, var(--color-primary) 0%, var(--color-primary-dark) 50%, var(--color-primary) 100% );border-radius:10px;top:50%;left:50%;transform:translate(-50%, -50%);z-index:5;box-shadow:0 0 20px rgba(var(--color-primary-rgb), 0.3), inset 0 0 10px var(--black-20)}.pole-top{position:absolute;top:-30px;left:50%;transform:translateX(-50%);width:100px;height:60px;background:linear-gradient(135deg, var(--color-accent) 0%, var(--color-primary) 50%, var(--color-accent) 100% );border-radius:50px 50px 20px 20px;box-shadow:var(--shadow-lg);z-index:10}.pole-top::before{content:'';position:absolute;top:-15px;left:50%;transform:translateX(-50%);width:80px;height:30px;background:var(--color-gold, var(--color-warning-gold));border-radius:50%;box-shadow:0 4px 15px var(--color-warning-gold)}.pole-base{position:absolute;bottom:-50px;left:50%;transform:translateX(-50%);width:120px;height:80px;background:linear-gradient(135deg, var(--color-primary-dark) 0%, var(--color-primary) 50%, var(--color-primary-dark) 100% );border-radius:60px;box-shadow:var(--shadow-lg);z-index:3}.pole-base::before{content:'';position:absolute;top:20px;left:50%;transform:translateX(-50%);width:80px;height:40px;background:var(--color-bg-primary);border-radius:40px;border:3px solid var(--color-primary)}.carousel-container::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:700px;height:700px;border:2px dashed rgba(var(--color-primary-rgb), 0.3);border-radius:50%;z-index:1}.carousel-container::after{content:'';position:absolute;bottom:50px;left:50%;transform:translateX(-50%);width:800px;height:30px;background:linear-gradient(90deg, transparent 0%, rgba(var(--color-primary-rgb), 0.1) 20%, rgba(var(--color-primary-rgb), 0.2) 50%, rgba(var(--color-primary-rgb), 0.1) 80%, transparent 100% );border-radius:50px;z-index:2}.google-review-card{background:var(--color-bg-primary);border-radius:var(--radius-xl);padding:var(--space-6);border:1px solid var(--color-border);box-shadow:var(--shadow-lg);transition:all 0.3s ease;position:relative;overflow:hidden;width:320px;height:280px;display:block;text-decoration:none;color:inherit;transform-style:preserve-3d;backface-visibility:hidden}.carousel-card{position:absolute;top:50%;left:50%;transform-origin:50% 50%;z-index:8}.carousel-card[data-position="1"]{animation:carouselCard1 80s linear infinite}.carousel-card[data-position="2"]{animation:carouselCard2 80s linear infinite}.carousel-card[data-position="3"]{animation:carouselCard3 80s linear infinite}.carousel-card[data-position="4"]{animation:carouselCard4 80s linear infinite}.carousel-card[data-position="5"]{animation:carouselCard5 80s linear infinite}.carousel-card[data-position="6"]{animation:carouselCard6 80s linear infinite}.carousel-card[data-position="7"]{animation:carouselCard7 80s linear infinite}.carousel-card[data-position="8"]{animation:carouselCard8 80s linear infinite}.carousel-card[data-position="9"]{animation:carouselCard9 80s linear infinite}.carousel-card[data-position="10"]{animation:carouselCard10 80s linear infinite}.carousel-card[data-position="11"]{animation:carouselCard11 80s linear infinite}.carousel-card[data-position="12"]{animation:carouselCard12 80s linear infinite}.carousel-card[data-position="13"]{animation:carouselCard13 80s linear infinite}.carousel-card[data-position="14"]{animation:carouselCard14 80s linear infinite}.carousel-card[data-position="15"]{animation:carouselCard15 80s linear infinite}.carousel-card[data-position="16"]{animation:carouselCard16 80s linear infinite}@keyframes carouselCard1{0%{transform:translate(-50%, -50%) rotate(0deg) translateX(350px) translateY(0px)}25%{transform:translate(-50%, -50%) rotate(90deg) translateX(350px) translateY(-25px)}50%{transform:translate(-50%, -50%) rotate(180deg) translateX(350px) translateY(0px)}75%{transform:translate(-50%, -50%) rotate(270deg) translateX(350px) translateY(25px)}100%{transform:translate(-50%, -50%) rotate(360deg) translateX(350px) translateY(0px)}}@keyframes carouselCard2{0%{transform:translate(-50%, -50%) rotate(22.5deg) translateX(350px) translateY(-5px)}25%{transform:translate(-50%, -50%) rotate(112.5deg) translateX(350px) translateY(-30px)}50%{transform:translate(-50%, -50%) rotate(202.5deg) translateX(350px) translateY(-5px)}75%{transform:translate(-50%, -50%) rotate(292.5deg) translateX(350px) translateY(20px)}100%{transform:translate(-50%, -50%) rotate(382.5deg) translateX(350px) translateY(-5px)}}@keyframes carouselCard3{0%{transform:translate(-50%, -50%) rotate(45deg) translateX(350px) translateY(-10px)}25%{transform:translate(-50%, -50%) rotate(135deg) translateX(350px) translateY(-35px)}50%{transform:translate(-50%, -50%) rotate(225deg) translateX(350px) translateY(-10px)}75%{transform:translate(-50%, -50%) rotate(315deg) translateX(350px) translateY(15px)}100%{transform:translate(-50%, -50%) rotate(405deg) translateX(350px) translateY(-10px)}}@keyframes carouselCard4{0%{transform:translate(-50%, -50%) rotate(67.5deg) translateX(350px) translateY(-15px)}25%{transform:translate(-50%, -50%) rotate(157.5deg) translateX(350px) translateY(-40px)}50%{transform:translate(-50%, -50%) rotate(247.5deg) translateX(350px) translateY(-15px)}75%{transform:translate(-50%, -50%) rotate(337.5deg) translateX(350px) translateY(10px)}100%{transform:translate(-50%, -50%) rotate(427.5deg) translateX(350px) translateY(-15px)}}@keyframes carouselCard5{0%{transform:translate(-50%, -50%) rotate(90deg) translateX(350px) translateY(-20px)}25%{transform:translate(-50%, -50%) rotate(180deg) translateX(350px) translateY(-45px)}50%{transform:translate(-50%, -50%) rotate(270deg) translateX(350px) translateY(-20px)}75%{transform:translate(-50%, -50%) rotate(360deg) translateX(350px) translateY(5px)}100%{transform:translate(-50%, -50%) rotate(450deg) translateX(350px) translateY(-20px)}}@keyframes carouselCard6{0%{transform:translate(-50%, -50%) rotate(112.5deg) translateX(350px) translateY(-15px)}25%{transform:translate(-50%, -50%) rotate(202.5deg) translateX(350px) translateY(-40px)}50%{transform:translate(-50%, -50%) rotate(292.5deg) translateX(350px) translateY(-15px)}75%{transform:translate(-50%, -50%) rotate(382.5deg) translateX(350px) translateY(10px)}100%{transform:translate(-50%, -50%) rotate(472.5deg) translateX(350px) translateY(-15px)}}@keyframes carouselCard7{0%{transform:translate(-50%, -50%) rotate(135deg) translateX(350px) translateY(-10px)}25%{transform:translate(-50%, -50%) rotate(225deg) translateX(350px) translateY(-35px)}50%{transform:translate(-50%, -50%) rotate(315deg) translateX(350px) translateY(-10px)}75%{transform:translate(-50%, -50%) rotate(405deg) translateX(350px) translateY(15px)}100%{transform:translate(-50%, -50%) rotate(495deg) translateX(350px) translateY(-10px)}}@keyframes carouselCard8{0%{transform:translate(-50%, -50%) rotate(157.5deg) translateX(350px) translateY(-5px)}25%{transform:translate(-50%, -50%) rotate(247.5deg) translateX(350px) translateY(-30px)}50%{transform:translate(-50%, -50%) rotate(337.5deg) translateX(350px) translateY(-5px)}75%{transform:translate(-50%, -50%) rotate(427.5deg) translateX(350px) translateY(20px)}100%{transform:translate(-50%, -50%) rotate(517.5deg) translateX(350px) translateY(-5px)}}@keyframes carouselCard9{0%{transform:translate(-50%, -50%) rotate(180deg) translateX(350px) translateY(0px)}25%{transform:translate(-50%, -50%) rotate(270deg) translateX(350px) translateY(-25px)}50%{transform:translate(-50%, -50%) rotate(360deg) translateX(350px) translateY(0px)}75%{transform:translate(-50%, -50%) rotate(450deg) translateX(350px) translateY(25px)}100%{transform:translate(-50%, -50%) rotate(540deg) translateX(350px) translateY(0px)}}@keyframes carouselCard10{0%{transform:translate(-50%, -50%) rotate(202.5deg) translateX(350px) translateY(5px)}25%{transform:translate(-50%, -50%) rotate(292.5deg) translateX(350px) translateY(-20px)}50%{transform:translate(-50%, -50%) rotate(382.5deg) translateX(350px) translateY(5px)}75%{transform:translate(-50%, -50%) rotate(472.5deg) translateX(350px) translateY(30px)}100%{transform:translate(-50%, -50%) rotate(562.5deg) translateX(350px) translateY(5px)}}@keyframes carouselCard11{0%{transform:translate(-50%, -50%) rotate(225deg) translateX(350px) translateY(10px)}25%{transform:translate(-50%, -50%) rotate(315deg) translateX(350px) translateY(-15px)}50%{transform:translate(-50%, -50%) rotate(405deg) translateX(350px) translateY(10px)}75%{transform:translate(-50%, -50%) rotate(495deg) translateX(350px) translateY(35px)}100%{transform:translate(-50%, -50%) rotate(585deg) translateX(350px) translateY(10px)}}@keyframes carouselCard12{0%{transform:translate(-50%, -50%) rotate(247.5deg) translateX(350px) translateY(15px)}25%{transform:translate(-50%, -50%) rotate(337.5deg) translateX(350px) translateY(-10px)}50%{transform:translate(-50%, -50%) rotate(427.5deg) translateX(350px) translateY(15px)}75%{transform:translate(-50%, -50%) rotate(517.5deg) translateX(350px) translateY(40px)}100%{transform:translate(-50%, -50%) rotate(607.5deg) translateX(350px) translateY(15px)}}@keyframes carouselCard13{0%{transform:translate(-50%, -50%) rotate(270deg) translateX(350px) translateY(20px)}25%{transform:translate(-50%, -50%) rotate(360deg) translateX(350px) translateY(-5px)}50%{transform:translate(-50%, -50%) rotate(450deg) translateX(350px) translateY(20px)}75%{transform:translate(-50%, -50%) rotate(540deg) translateX(350px) translateY(45px)}100%{transform:translate(-50%, -50%) rotate(630deg) translateX(350px) translateY(20px)}}@keyframes carouselCard14{0%{transform:translate(-50%, -50%) rotate(292.5deg) translateX(350px) translateY(15px)}25%{transform:translate(-50%, -50%) rotate(382.5deg) translateX(350px) translateY(-10px)}50%{transform:translate(-50%, -50%) rotate(472.5deg) translateX(350px) translateY(15px)}75%{transform:translate(-50%, -50%) rotate(562.5deg) translateX(350px) translateY(40px)}100%{transform:translate(-50%, -50%) rotate(652.5deg) translateX(350px) translateY(15px)}}@keyframes carouselCard15{0%{transform:translate(-50%, -50%) rotate(315deg) translateX(350px) translateY(10px)}25%{transform:translate(-50%, -50%) rotate(405deg) translateX(350px) translateY(-15px)}50%{transform:translate(-50%, -50%) rotate(495deg) translateX(350px) translateY(10px)}75%{transform:translate(-50%, -50%) rotate(585deg) translateX(350px) translateY(35px)}100%{transform:translate(-50%, -50%) rotate(675deg) translateX(350px) translateY(10px)}}@keyframes carouselCard16{0%{transform:translate(-50%, -50%) rotate(337.5deg) translateX(350px) translateY(5px)}25%{transform:translate(-50%, -50%) rotate(427.5deg) translateX(350px) translateY(-20px)}50%{transform:translate(-50%, -50%) rotate(517.5deg) translateX(350px) translateY(5px)}75%{transform:translate(-50%, -50%) rotate(607.5deg) translateX(350px) translateY(30px)}100%{transform:translate(-50%, -50%) rotate(697.5deg) translateX(350px) translateY(5px)}}.google-review-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg, var(--color-primary) 0%, var(--color-accent) 100%);opacity:0;transition:opacity var(--transition-base)}.google-review-card:hover{box-shadow:var(--shadow-xl);border-color:var(--color-primary-light);text-decoration:none;color:inherit;z-index:20}.google-review-card:hover::before{opacity:1}.carousel-container:hover .carousel-card{animation-play-state:paused}.reviewer-info{margin-bottom:var(--space-3)}.reviewer-info strong{display:block;font-size:var(--text-base);font-weight:600;color:var(--color-text-primary);margin-bottom:var(--space-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reviewer-meta{font-size:var(--text-sm);color:var(--color-text-secondary);display:flex;align-items:center;gap:var(--space-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.google-stars{margin-bottom:var(--space-3);display:flex;gap:2px}.google-stars .star{color:var(--color-warning);font-size:var(--text-base);line-height:1;text-shadow:0 1px 2px var(--black-10)}.review-text{font-size:var(--text-sm);line-height:1.5;color:var(--color-text-secondary);font-style:italic;position:relative;padding-left:var(--space-3);margin:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical}.review-text::before{content:'"';position:absolute;left:0;top:-6px;font-size:var(--text-lg);color:var(--color-primary);font-weight:700;font-family:serif}.review-text::after{content:'"';font-size:var(--text-lg);color:var(--color-primary);font-weight:700;font-family:serif;margin-left:var(--space-1)}@media (max-width:1200px){.carousel-container{height:750px}.carousel-pole{height:600px}.carousel-card[data-position="1"]{transform:translate(-50%, -50%) rotate(0deg) translateX(280px) translateY(0px)}.carousel-card[data-position="2"]{transform:translate(-50%, -50%) rotate(22.5deg) translateX(280px) translateY(-15px)}.carousel-card[data-position="3"]{transform:translate(-50%, -50%) rotate(45deg) translateX(280px) translateY(-25px)}.carousel-card[data-position="4"]{transform:translate(-50%, -50%) rotate(67.5deg) translateX(280px) translateY(-30px)}.carousel-card[data-position="5"]{transform:translate(-50%, -50%) rotate(90deg) translateX(280px) translateY(-25px)}.carousel-card[data-position="6"]{transform:translate(-50%, -50%) rotate(112.5deg) translateX(280px) translateY(-15px)}.carousel-card[data-position="7"]{transform:translate(-50%, -50%) rotate(135deg) translateX(280px) translateY(0px)}.carousel-card[data-position="8"]{transform:translate(-50%, -50%) rotate(157.5deg) translateX(280px) translateY(15px)}.carousel-card[data-position="9"]{transform:translate(-50%, -50%) rotate(180deg) translateX(280px) translateY(25px)}.carousel-card[data-position="10"]{transform:translate(-50%, -50%) rotate(202.5deg) translateX(280px) translateY(30px)}.carousel-card[data-position="11"]{transform:translate(-50%, -50%) rotate(225deg) translateX(280px) translateY(25px)}.carousel-card[data-position="12"]{transform:translate(-50%, -50%) rotate(247.5deg) translateX(280px) translateY(15px)}.carousel-card[data-position="13"]{transform:translate(-50%, -50%) rotate(270deg) translateX(280px) translateY(0px)}.carousel-card[data-position="14"]{transform:translate(-50%, -50%) rotate(292.5deg) translateX(280px) translateY(-15px)}.carousel-card[data-position="15"]{transform:translate(-50%, -50%) rotate(315deg) translateX(280px) translateY(-25px)}.carousel-card[data-position="16"]{transform:translate(-50%, -50%) rotate(337.5deg) translateX(280px) translateY(-30px)}@keyframes carouselRotate{0%{transform:translate(-50%, -50%) rotate(0deg) translateX(280px)}100%{transform:translate(-50%, -50%) rotate(360deg) translateX(280px)}}}@media (prefers-reduced-motion:reduce){.carousel-card{animation:none}.carousel-card[data-position="1"]{transform:translate(-50%, -50%) rotate(0deg) translateX(350px) translateY(0px)}.carousel-card[data-position="2"]{transform:translate(-50%, -50%) rotate(22.5deg) translateX(350px) translateY(-20px)}.carousel-card[data-position="3"]{transform:translate(-50%, -50%) rotate(45deg) translateX(350px) translateY(-35px)}.carousel-card[data-position="4"]{transform:translate(-50%, -50%) rotate(67.5deg) translateX(350px) translateY(-40px)}.carousel-card[data-position="5"]{transform:translate(-50%, -50%) rotate(90deg) translateX(350px) translateY(-35px)}.carousel-card[data-position="6"]{transform:translate(-50%, -50%) rotate(112.5deg) translateX(350px) translateY(-20px)}.carousel-card[data-position="7"]{transform:translate(-50%, -50%) rotate(135deg) translateX(350px) translateY(0px)}.carousel-card[data-position="8"]{transform:translate(-50%, -50%) rotate(157.5deg) translateX(350px) translateY(20px)}.carousel-card[data-position="9"]{transform:translate(-50%, -50%) rotate(180deg) translateX(350px) translateY(35px)}.carousel-card[data-position="10"]{transform:translate(-50%, -50%) rotate(202.5deg) translateX(350px) translateY(40px)}.carousel-card[data-position="11"]{transform:translate(-50%, -50%) rotate(225deg) translateX(350px) translateY(35px)}.carousel-card[data-position="12"]{transform:translate(-50%, -50%) rotate(247.5deg) translateX(350px) translateY(20px)}.carousel-card[data-position="13"]{transform:translate(-50%, -50%) rotate(270deg) translateX(350px) translateY(0px)}.carousel-card[data-position="14"]{transform:translate(-50%, -50%) rotate(292.5deg) translateX(350px) translateY(-20px)}.carousel-card[data-position="15"]{transform:translate(-50%, -50%) rotate(315deg) translateX(350px) translateY(-35px)}.carousel-card[data-position="16"]{transform:translate(-50%, -50%) rotate(337.5deg) translateX(350px) translateY(-40px)}}.google-review-card:focus{outline:2px solid var(--color-primary);outline-offset:2px;z-index:30}.google-review-card{background:var(--bg-primary, var(--color-white)) !important;border-radius:16px !important;padding:1.5rem !important;margin:0.5rem !important;box-shadow:0 4px 12px var(--black-8) !important;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;position:relative !important;overflow:hidden !important}.carousel-ltr .google-review-card{border:3px solid var(--brand-primary) !important;background:linear-gradient(135deg, var(--color-white) 0%, var(--color-mint-white) 100%) !important;box-shadow:0 4px 12px var(--brand-primary-15), 0 2px 4px var(--brand-primary-10) !important}.carousel-ltr .google-review-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg, var(--brand-primary) 0%, var(--brand-primary-lighter) 100%);border-radius:16px 16px 0 0}.carousel-rtl .google-review-card{border:3px solid var(--brand-accent) !important;background:linear-gradient(135deg, var(--color-white) 0%, var(--color-off-white) 100%) !important;box-shadow:0 4px 12px var(--brand-accent-15), 0 2px 4px var(--brand-accent-10) !important}.carousel-rtl .google-review-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg, var(--brand-accent) 0%, var(--brand-accent-light) 100%);border-radius:16px 16px 0 0}.carousel-ltr .google-review-card:hover{transform:translateY(-6px) scale(1.02) !important;border-color:var(--brand-primary-dark) !important;box-shadow:0 8px 25px var(--brand-primary-20), 0 4px 8px var(--brand-primary-10) !important}.carousel-rtl .google-review-card:hover{transform:translateY(-6px) scale(1.02) !important;border-color:var(--color-error) !important;box-shadow:0 8px 25px var(--brand-accent-20), 0 4px 8px var(--brand-accent-10) !important}/* ========================================================================== Google Maps Section Styles ========================================================================== */ .locations-map{margin:var(--space-16) 0 var(--space-12) 0;background:var(--brand-neutral-white);padding:var(--space-xl) var(--space-lg);border-radius:var(--radius-2xl);box-shadow:var(--shadow-sm)}.map-header{text-align:center;margin-bottom:var(--space-8)}.map-header h3{font-size:var(--text-2xl);font-weight:700;color:var(--color-text-primary);margin-bottom:var(--space-3)}.map-header p{font-size:var(--text-lg);color:var(--color-text-secondary);max-width:600px;margin:0 auto}.map-container{position:relative;overflow:hidden;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);border:1px solid var(--color-border);background:var(--color-bg-muted)}.map-container iframe{width:100%;height:450px;border:none;display:block}/* ========================================================================== SERVING ARIZONA COMMUNITIES SECTION - RESTORED & ENHANCED ========================================================================== */ .locations-section{padding:4rem 0;background:var(--bg-secondary, var(--color-slate-50));position:relative}.locations-section .section-header{text-align:center;margin-bottom:3rem}.locations-section .section-title{font-size:2.5rem;font-weight:700;color:var(--text-primary, var(--color-gray-900));margin-bottom:1.5rem}.locations-section .section-subtitle{font-size:1.125rem;line-height:1.6;color:var(--text-secondary, var(--color-gray-600));max-width:700px;margin:0 auto}.locations-grid, .expanded-service-areas{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:2rem;margin-top:3rem}.location-card{background:var(--bg-primary, var(--color-white));border:3px solid transparent;border-radius:16px;padding:2rem;text-align:center;transition:all 0.3s ease;position:relative;overflow:hidden;box-shadow:0 4px 12px var(--black-8)}.location-card{border-color:var(--brand-primary);background:linear-gradient(135deg, var(--color-white) 0%, var(--color-mint-white) 100%)}.location-icon{width:60px;height:60px;margin:0 auto 1.5rem;background:var(--brand-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:1.5rem;font-weight:bold;transition:all 0.3s ease}.location-card:hover{transform:translateY(-6px);box-shadow:0 12px 30px var(--black-15);border-color:var(--brand-accent) !important;background:linear-gradient(135deg, var(--color-white) 0%, var(--color-off-white) 100%)}.location-card:hover .location-icon{transform:scale(1.1);background:var(--brand-accent)}.location-card h3, .location-card h4{font-size:1.25rem;font-weight:700;color:var(--text-primary, var(--color-gray-900));margin-bottom:1rem}.location-card p{font-size:1rem;line-height:1.6;color:var(--text-secondary, var(--color-gray-600));margin-bottom:1.5rem}.service-tag{display:none}.locations-cta{margin-top:var(--space-xl);text-align:center;background:var(--brand-neutral-light);padding:var(--space-xl) var(--space-lg);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm)}@media (width < 48rem){.locations-grid, .expanded-service-areas{grid-template-columns:1fr;gap:1.5rem}.location-card{padding:1.5rem}.locations-section .section-title{font-size:2rem}}/* ========================================================================== Trust Section Image Gallery - Square Tiles ========================================================================== */ .about-image-gallery{width:100%}.trust-image-tile{position:relative;width:100%;height:100%;aspect-ratio:1;overflow:hidden;border-radius:16px;background:var(--color-bg-muted);cursor:pointer;transition:all 0.4s var(--ease-out-quint);box-shadow:var(--shadow-sm)}.trust-image-tile:hover{transform:translateY(-6px) scale(1.02);box-shadow:var(--shadow-xl);z-index:10}.trust-tile-image{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform 0.6s var(--ease-out-quint)}.trust-image-tile:hover .trust-tile-image{transform:scale(1.08)}.trust-tile-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to top, var(--brand-primary-60) 0%, var(--brand-primary-40) 30%, var(--brand-primary-20) 70%, transparent 100%);display:flex;align-items:flex-end;justify-content:center;color:white;padding:0.5rem;opacity:0;visibility:hidden;transition:all 0.4s ease;box-sizing:border-box}.trust-image-tile:hover .trust-tile-overlay{opacity:1;visibility:visible;background:linear-gradient(to top, var(--brand-primary-70) 0%, var(--brand-primary-50) 30%, var(--brand-primary-30) 70%, transparent 100%);backdrop-filter:blur(1px)}.trust-tile-overlay span{font-size:0.6rem;font-weight:700;text-align:center;line-height:1.0;text-shadow:0 2px 6px var(--black-90), 0 1px 3px var(--black-80);z-index:3}.trust-image-tile:nth-child(n+11){display:none !important}.trust-image-tile:nth-child(1){animation-delay:0.1s}.trust-image-tile:nth-child(2){animation-delay:0.2s}.trust-image-tile:nth-child(3){animation-delay:0.3s}.trust-image-tile:nth-child(4){animation-delay:0.4s}.trust-image-tile:nth-child(5){animation-delay:0.5s}.trust-image-tile:nth-child(6){animation-delay:0.6s}.trust-image-tile:nth-child(7){animation-delay:0.7s}.trust-image-tile:nth-child(8){animation-delay:0.8s}.trust-image-tile:nth-child(9){animation-delay:0.9s}.trust-image-tile:nth-child(10){animation-delay:1.0s}/* ========================================================================== Enhanced Timeline Section with Cascading Design ========================================================================== */ /* Timeline container enhancements - DISABLED, USING ORIGINAL .process-section-timeline{position:relative;margin-top:var(--space-16)}*/ /* DISABLED - CONFLICTED WITH ORIGINAL TIMELINE .process-section-timeline::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:3px;background:linear-gradient(to bottom, var(--color-primary) 0%, var(--color-accent) 50%, var(--color-primary) 100%);transform:translateX(-50%);z-index:1}*/ /* Timeline item enhancements - DISABLED DUE TO CONFLICTS .process-section-timeline-item{position:relative;margin-bottom:var(--space-20);z-index:2}.process-section-timeline-item:nth-child(odd){padding-left:calc(50% + var(--space-12));animation:slideInRight 0.8s ease-out forwards;animation-delay:calc(0.2s * var(--timeline-index, 1))}.process-section-timeline-item:nth-child(even){padding-right:calc(50% + var(--space-12));text-align:right;animation:slideInLeft 0.8s ease-out forwards;animation-delay:calc(0.2s * var(--timeline-index, 2))}*/ /* Timeline marker enhancements - DISABLED DUE TO CONFLICTS .process-section-timeline-marker{position:absolute;left:50%;top:0;width:60px;height:60px;background:linear-gradient(135deg, var(--color-primary), var(--color-accent));border:4px solid var(--color-bg-primary);border-radius:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;font-size:var(--text-xl);font-weight:700;color:white;z-index:3;box-shadow:var(--shadow-lg);transition:all 0.4s var(--ease-out-quint)}.process-section-timeline-item:hover .process-section-timeline-marker{transform:translateX(-50%) scale(1.1);box-shadow:var(--shadow-xl)}*/ /* Timeline content enhancements - DISABLED DUE TO CONFLICTS .process-section-timeline-content{background:var(--color-bg-primary);padding:var(--space-8);border-radius:var(--radius-xl);border:2px solid transparent;box-shadow:var(--shadow-md);transition:all 0.4s var(--ease-out-quint);position:relative}.process-section-timeline-content::before{content:'';position:absolute;top:var(--space-6);width:0;height:0;border:15px solid transparent}.process-section-timeline-item:nth-child(odd) .process-section-timeline-content::before{left:-30px;border-right-color:var(--color-bg-primary)}.process-section-timeline-item:nth-child(even) .process-section-timeline-content::before{right:-30px;border-left-color:var(--color-bg-primary)}.process-section-timeline-item:hover .process-section-timeline-content{transform:translateY(-4px);border-color:var(--color-primary-light);box-shadow:var(--shadow-xl)}*/ /* ========== ALL TIMELINE STYLES BELOW DISABLED DUE TO CONFLICTS ========== .process-section-timeline-expand{display:inline-flex;align-items:center;gap:var(--space-2);color:var(--color-primary);text-decoration:none;font-weight:600;font-size:var(--text-sm);margin-top:var(--space-4);padding:var(--space-3) var(--space-4);border:1px solid var(--color-primary);border-radius:var(--radius-md);transition:all var(--transition-base);background:transparent}.process-section-timeline-expand:hover{background:var(--color-primary);color:white;transform:translateX(4px)}.process-section-timeline-expand svg{transition:transform var(--transition-base)}.process-section-timeline-expand:hover svg{transform:translateX(4px)}.process-section-timeline-header{display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:var(--space-4);margin:calc(-1 * var(--space-4));border-radius:var(--radius-lg);transition:all 0.3s var(--ease-out-quint);position:relative;background:transparent}.process-section-timeline-header:hover{background:linear-gradient(135deg, var(--color-info-light), var(--color-error-light));transform:translateX(4px)}.process-section-timeline-header:active{transform:translateX(2px) scale(0.98)}.process-section-timeline-title{font-size:var(--text-xl);font-weight:700;color:var(--color-text-primary);margin:0;transition:color 0.3s ease}.process-section-timeline-header:hover .process-section-timeline-title{color:var(--color-primary)}.timeline-toggle-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--color-primary);color:white;transition:all 0.3s var(--ease-out-quint);flex-shrink:0}.process-section-timeline-header:hover .timeline-toggle-icon{background:var(--color-primary-dark);transform:scale(1.1)}.timeline-toggle-icon svg{transition:transform 0.3s var(--ease-out-quint)}.expandable-content.active ~ .process-section-timeline-header .timeline-toggle-icon svg, .process-section-timeline-header.expanded .timeline-toggle-icon svg{transform:rotate(180deg)}.process-section-timeline-description{color:var(--color-text-secondary);line-height:var(--leading-relaxed);margin:var(--space-4) 0;transition:color 0.3s ease}.expandable-content{max-height:0;overflow:hidden;transition:max-height 0.6s var(--ease-out-quint), opacity 0.4s ease;margin-top:var(--space-6);opacity:0}.expandable-content.active{max-height:800px;opacity:1}.expand-text{padding:var(--space-6);background:var(--white-5);border-radius:var(--radius-lg);border:1px solid var(--brand-accent-10);line-height:var(--leading-relaxed);color:var(--color-text-secondary);box-shadow:inset 0 1px 3px var(--black-5)}@keyframes slideInRight{from{opacity:0;transform:translateX(-50px)}to{opacity:1;transform:translateX(0)}}@keyframes slideInLeft{from{opacity:0;transform:translateX(50px)}to{opacity:1;transform:translateX(0)}}@media (max-width:768px){.process-section-timeline::before{left:30px}.process-section-timeline-item:nth-child(odd), .process-section-timeline-item:nth-child(even){padding-left:80px;padding-right:0;text-align:left}.process-section-timeline-marker{left:30px}.process-section-timeline-content::before{left:-30px !important;right:auto !important;border-right-color:var(--color-bg-primary) !important;border-left-color:transparent !important}}========== END DISABLED TIMELINE STYLES ========== */ /* ========================================================================== Floating Decorative Circles for Hidden Depth ========================================================================== */ .hero-section, .trust-signals-section, .benefits-comparison-section, .locations-section, .about-section, .process-section{position:relative}.floating-circles{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden;z-index:0}.floating-circle{position:absolute;border-radius:50%;background:linear-gradient(135deg, var(--brand-primary-3) 0%, var(--brand-accent-10) 100%);backdrop-filter:blur(1px);animation:floatCircle 20s infinite linear}.floating-circle.small{width:40px;height:40px}.floating-circle.medium{width:80px;height:80px}.floating-circle.large{width:120px;height:120px}.floating-circle.extra-large{width:200px;height:200px;opacity:0.02}.floating-circle.slow{animation-duration:25s}.floating-circle.fast{animation-duration:15s}@keyframes floatCircle{0%{transform:translateY(0px) rotate(0deg)}25%{transform:translateY(-20px) rotate(90deg)}50%{transform:translateY(-10px) rotate(180deg)}75%{transform:translateY(-30px) rotate(270deg)}100%{transform:translateY(0px) rotate(360deg)}}@keyframes pulseCircle{0%, 100%{transform:scale(1);opacity:0.03}50%{transform:scale(1.2);opacity:0.06}}.floating-circle.pulse{animation:pulseCircle 8s infinite ease-in-out}.hero-section .floating-circles .floating-circle:nth-child(1){top:10%;left:15%;animation-delay:-2s}.hero-section .floating-circles .floating-circle:nth-child(2){top:60%;right:10%;animation-delay:-8s}.hero-section .floating-circles .floating-circle:nth-child(3){bottom:20%;left:5%;animation-delay:-15s}.trust-signals-section .floating-circles .floating-circle:nth-child(1){top:20%;right:20%;animation-delay:-5s}.trust-signals-section .floating-circles .floating-circle:nth-child(2){bottom:30%;left:10%;animation-delay:-12s}.benefits-comparison-section .floating-circles .floating-circle:nth-child(1){top:15%;left:8%;animation-delay:-3s}.benefits-comparison-section .floating-circles .floating-circle:nth-child(2){top:70%;right:15%;animation-delay:-10s}.locations-section .floating-circles .floating-circle:nth-child(1){top:25%;left:12%;animation-delay:-6s}.locations-section .floating-circles .floating-circle:nth-child(2){bottom:15%;right:8%;animation-delay:-14s}.about-section .floating-circles .floating-circle:nth-child(1){top:30%;right:18%;animation-delay:-4s}.about-section .floating-circles .floating-circle:nth-child(2){bottom:40%;left:6%;animation-delay:-11s}.process-section .floating-circles .floating-circle:nth-child(1){top:10%;left:20%;animation-delay:-7s}.process-section .floating-circles .floating-circle:nth-child(2){top:80%;right:12%;animation-delay:-13s}.process-section .floating-circles .floating-circle:nth-child(3){top:45%;right:25%;animation-delay:-9s}@media (prefers-reduced-motion:reduce){.floating-circle{animation:none}}/* ========================================================================== ESSENTIAL MOBILE FIXES ========================================================================== */ /* ========================================================================== DCF FRAMEWORK RESPONSIVE DESIGN SYSTEM Framework-compliant mobile-first responsive design ========================================================================== */ .container{container-type:inline-size;width:100%;margin-inline:auto;padding-inline:clamp(1rem, 5vw, 2rem);max-width:min(100% - 2rem, 1440px)}section{padding-block:clamp(2rem, 8vw, 4rem)}}@keyframes slideDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}/* ========================================================================== CONSOLIDATED MOBILE-FIRST RESPONSIVE SYSTEM Single source of truth for all mobile responsive behavior ========================================================================== */ @media (max-width:480px){.hero-gallery{height:280px;gap:4px}.gallery-row{height:55px;gap:4px}.gallery-featured{height:120px}.gallery-title{font-size:0.6rem}.gallery-subtitle{font-size:0.5rem}}@media (width >= 48rem) and (width < 64rem){.hero-gallery{height:600px;gap:10px}.gallery-row{grid-template-columns:repeat(3, 1fr);height:120px}.gallery-featured{height:180px}.gallery-bottom{margin-bottom:60px}.gallery-top .gallery-item:nth-child(4), .gallery-bottom .gallery-item:nth-child(4){display:none}}.hero-features{display:grid;grid-template-columns:repeat(2, 1fr);gap:1rem;margin-bottom:2rem;justify-items:center}.hero-actions{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center}@media (width < 48rem){.hero-section{min-height:110vh !important;padding-bottom:4rem !important}.hero-content{grid-template-columns:1fr !important;gap:clamp(1.5rem, 4vw, 2.5rem) !important;text-align:center}.hero-gallery{height:460px !important;gap:15px !important}.gallery-row{height:70px !important;grid-template-columns:repeat(3, 1fr)}.hero-gallery .gallery-featured, .gallery-featured{height:180px !important}.gallery-bottom{margin-bottom:40px !important}.hero-gallery .gallery-overlay{height:100% !important;top:0 !important;bottom:0 !important}.gallery-item{position:relative !important;overflow:hidden !important}.hero-features{grid-template-columns:1fr 1fr !important;gap:0.75rem !important;margin-bottom:2rem !important}.hero-actions{flex-direction:column !important;gap:1rem !important;align-items:center !important;width:100% !important}.hero-btn-primary, .hero-btn-secondary{width:100% !important;max-width:280px !important;text-align:center !important;justify-content:center !important}}@container (width < 400px){.gallery-grid{grid-template-columns:1fr;gap:1rem}}@container (width >= 400px) and (width < 800px){.gallery-grid{grid-template-columns:repeat(2, 1fr);gap:1.5rem}}@container (width >= 800px){.gallery-grid{grid-template-columns:repeat(3, 1fr);gap:2rem}}.hero-title{font-size:clamp(2.5rem, 5vw, 4rem);line-height:1.1;margin-bottom:clamp(1rem, 3vw, 2rem)}.hero-subtitle{font-size:clamp(1.1rem, 2.5vw, 1.5rem);line-height:1.4;margin-bottom:clamp(1.5rem, 4vw, 3rem)}@media (any-hover:none) and (any-pointer:coarse){.nav-toggle{padding:0.75rem;font-size:1.75rem}.nav-links a{padding:1rem;font-size:1.125rem}.gallery-item{min-height:200px}}/* ========================================================================== CLEAN RESPONSIVE NAVIGATION & HERO - 2024 REDESIGN ========================================================================== */ .navbar{position:fixed !important;top:0;left:0;right:0;background:var(--color-white) !important;border-bottom:1px solid var(--brand-primary-10) !important;z-index:1000 !important;transition:all 0.3s ease !important;height:80px !important}.navbar.scrolled{background:var(--color-white) !important;box-shadow:0 4px 20px var(--brand-primary-15) !important}.nav-container{max-width:1400px !important;margin:0 auto !important;padding:0 1rem !important;display:flex !important;align-items:center !important;justify-content:space-between !important;height:100% !important}.nav-logo{display:flex !important;align-items:center !important;text-decoration:none !important;transition:transform 0.3s ease !important}.nav-logo img{height:50px !important;width:auto !important;object-fit:contain !important}.nav-logo:hover{transform:scale(1.05) !important}.nav-links{display:flex !important;list-style:none !important;margin:0 !important;padding:0 !important;align-items:center !important;gap:2rem !important}.nav-link{color:var(--brand-neutral-dark) !important;text-decoration:none !important;font-weight:500 !important;font-size:0.95rem !important;transition:color 0.3s ease !important;white-space:nowrap !important}.nav-link:hover{color:var(--brand-secondary) !important}.nav-dropdown{position:relative !important}.dropdown-menu{position:absolute !important;top:100% !important;left:0 !important;background:white !important;border-radius:var(--radius-lg) !important;box-shadow:0 10px 30px var(--black-10) !important;padding:0.5rem 0 !important;min-width:200px !important;opacity:0 !important;visibility:hidden !important;transform:translateY(-10px) !important;transition:all 0.3s ease !important;z-index:1001 !important;list-style:none !important}.nav-dropdown:hover .dropdown-menu{opacity:1 !important;visibility:visible !important;transform:translateY(0) !important}.dropdown-menu li{margin:0 !important}.dropdown-menu a{display:block !important;padding:0.75rem 1rem !important;color:var(--brand-neutral-dark) !important;text-decoration:none !important;transition:background-color 0.3s ease !important}.dropdown-menu a:hover{background-color:var(--brand-neutral-light) !important;color:var(--brand-secondary) !important}.nav-cta{background:var(--brand-secondary) !important;color:white !important;padding:0.75rem 1.5rem !important;border-radius:var(--radius-lg) !important;text-decoration:none !important;font-weight:600 !important;transition:all 0.3s ease !important;white-space:nowrap !important}.nav-cta:hover{background:var(--brand-secondary-dark) !important;transform:translateY(-1px) !important}.nav-toggle{display:none !important;background:none !important;border:none !important;font-size:1.5rem !important;color:var(--brand-primary) !important;cursor:pointer !important;padding:0.5rem !important;z-index:1002 !important}.hero-section{min-height:100vh !important;position:relative !important;display:flex !important;align-items:center !important;background:linear-gradient(135deg, var(--brand-primary-80), var(--brand-primary-60)), url('images/0815181546.jpg') center/cover !important;overflow:hidden !important;padding:6rem 0 2rem !important}.hero-content{max-width:1400px !important;margin:0 auto !important;padding:0 1rem !important;display:grid !important;grid-template-columns:1fr 1fr !important;gap:3rem !important;align-items:center !important;position:relative !important;z-index:2 !important}.hero-text{color:white !important}.hero-experience{display:inline-block !important;background:var(--brand-accent-50) !important;color:white !important;padding:0.5rem 1rem !important;border-radius:var(--radius-lg) !important;font-size:0.9rem !important;font-weight:600 !important;margin-bottom:1rem !important}.hero-title{font-size:clamp(2rem, 5vw, 3.5rem) !important;font-weight:700 !important;line-height:1.1 !important;margin-bottom:1rem !important}.hero-price-highlight{display:block !important;color:var(--brand-secondary) !important;font-size:clamp(1.25rem, 3vw, 1.75rem) !important;margin-top:0.5rem !important}.hero-description{font-size:1.125rem !important;line-height:1.6 !important;opacity:0.9 !important;margin-bottom:2rem !important}.hero-features{display:grid !important;grid-template-columns:repeat(2, 1fr) !important;gap:1rem !important;margin-bottom:2rem !important}.hero-feature-item{display:flex !important;align-items:center !important;gap:0.75rem !important}.hero-feature-icon{width:20px !important;height:20px !important;color:var(--brand-secondary) !important}.hero-actions{display:flex !important;gap:1rem !important;flex-wrap:wrap !important}.hero-btn-primary, .hero-btn-secondary{display:inline-flex !important;align-items:center !important;gap:0.5rem !important;padding:1rem 2rem !important;border-radius:var(--radius-lg) !important;font-weight:600 !important;text-decoration:none !important;transition:all 0.3s ease !important}.hero-btn-primary{background:var(--brand-secondary) !important;color:white !important}.hero-btn-primary:hover{background:var(--brand-secondary-dark) !important;transform:translateY(-2px) !important}.hero-btn-secondary{background:var(--white-10) !important;color:white !important;border:2px solid var(--white-30) !important}.hero-btn-secondary:hover{background:var(--white-20) !important}.hero-gallery{display:flex !important;flex-direction:column !important;gap:1rem !important;height:100% !important;min-height:500px !important}.gallery-row{display:grid !important;grid-template-columns:repeat(3, 1fr) !important;gap:1rem !important;flex:1 !important}.gallery-featured{grid-column:span 3 !important;position:relative !important;overflow:hidden !important;border-radius:var(--radius-lg) !important;cursor:pointer !important}.gallery-item{position:relative !important;overflow:hidden !important;border-radius:var(--radius-lg) !important;cursor:pointer !important}.gallery-item img, .gallery-featured img{width:100% !important;height:100% !important;object-fit:cover !important;transition:transform 0.3s ease !important}.gallery-item:hover img, .gallery-featured:hover img{transform:scale(1.05) !important}.gallery-overlay{position:absolute !important;inset:0 !important;background:var(--brand-primary-80) !important;color:white !important;display:flex !important;align-items:center !important;justify-content:center !important;font-weight:600 !important;opacity:0 !important;transition:opacity 0.3s ease !important}.gallery-item:hover .gallery-overlay, .gallery-featured:hover .gallery-overlay{opacity:1 !important}/* ========================================================================== RESPONSIVE BREAKPOINTS - CLEAN & CONSISTENT ========================================================================== */ @media (max-width:1023px){.nav-links{gap:1.5rem !important}.hero-content{gap:2rem !important}.hero-features{grid-template-columns:1fr !important}}@media (max-width:767px){.nav-container{padding:0 1rem !important}.nav-links{position:fixed !important;top:80px !important;left:0 !important;right:0 !important;background:white !important;flex-direction:column !important;padding:2rem 1rem !important;gap:1rem !important;box-shadow:0 4px 20px var(--black-10) !important;transform:translateY(-100%) !important;opacity:0 !important;visibility:hidden !important;transition:all 0.3s ease !important}.nav-links.active{transform:translateY(0) !important;opacity:1 !important;visibility:visible !important}.nav-toggle{display:block !important}.nav-cta{display:inline-flex !important;padding:0.5rem 1rem !important;font-size:0.9rem !important}.hero-section{min-height:100vh !important;padding:6rem 0 2rem !important}.hero-content{grid-template-columns:1fr !important;gap:2rem !important;text-align:center !important}.hero-features{grid-template-columns:1fr !important;gap:0.75rem !important}.hero-actions{justify-content:center !important}.gallery-row{grid-template-columns:1fr 1fr !important;gap:0.75rem !important}.gallery-featured{grid-column:span 2 !important}.hero-gallery{min-height:400px !important;gap:0.75rem !important}}@media (max-width:480px){.navbar{height:70px !important}.nav-links{top:70px !important}.hero-section{padding:5rem 0 2rem !important}.hero-content{padding:0 1rem !important}.gallery-row{grid-template-columns:1fr !important}.gallery-featured{grid-column:span 1 !important}.hero-actions{flex-direction:column !important}.hero-btn-primary, .hero-btn-secondary{width:100% !important;justify-content:center !important}}/* ========================================================================== UNIVERSAL HERO & GALLERY FIXES FOR ALL PAGES - MOBILE OPTIMIZED ========================================================================== */ .hero-section{min-height:100vh !important;height:auto !important;clip-path:none !important}.hero-section::before{height:100% !important;min-height:100% !important}@media (max-width:767px){.hero-section{min-height:auto !important;height:auto !important;padding:5rem 1rem 3rem !important;clip-path:none !important}.hero-section::before{position:absolute !important;top:0 !important;left:0 !important;right:0 !important;bottom:0 !important;height:auto !important;min-height:100% !important}.hero-content{min-height:auto !important;height:auto !important;padding:2rem 1rem !important;position:relative !important;z-index:2 !important}.hero-gallery, .gallery-row, .gallery-item, .gallery-featured{position:relative !important;z-index:3 !important}.hero-section[style*="height"], .hero-section[style*="min-height"]{height:auto !important;min-height:auto !important}.hero-section{min-height:fit-content !important}}.gallery-grid, .gallery-row{display:grid !important;grid-template-columns:repeat(3, 1fr) !important;gap:1rem !important}.gallery-featured, .gallery-main{grid-column:span 3 !important}.gallery-2x2{display:grid !important;grid-template-columns:repeat(2, 1fr) !important;gap:1rem !important}.gallery-3x3{display:grid !important;grid-template-columns:repeat(3, 1fr) !important;gap:1rem !important}@media (max-width:767px){.gallery-grid, .gallery-row, .gallery-2x2, .gallery-3x3{grid-template-columns:repeat(2, 1fr) !important;gap:0.5rem !important}.gallery-featured, .gallery-main{grid-column:span 2 !important}}@media (max-width:480px){.gallery-grid, .gallery-row, .gallery-2x2, .gallery-3x3{grid-template-columns:1fr !important}.gallery-featured, .gallery-main{grid-column:span 1 !important}}@media (max-width:767px){.nav-logo img{height:40px !important}}@media (max-width:480px){.nav-logo img{height:35px !important}}.nav-dropdown .dropdown-menu{position:static !important;opacity:1 !important;visibility:visible !important;transform:none !important;box-shadow:none !important;padding:0 !important;margin-top:0.5rem !important}@media (min-width:768px){.nav-dropdown .dropdown-menu{position:absolute !important;opacity:0 !important;visibility:hidden !important;transform:translateY(-10px) !important;box-shadow:0 10px 30px var(--black-10) !important;padding:0.5rem 0 !important;margin-top:0 !important}.nav-dropdown:hover .dropdown-menu{opacity:1 !important;visibility:visible !important;transform:translateY(0) !important}}/* ========================================================================== FIX CALCULATOR SECTION OVERLAPPING HERO ========================================================================== */ .calculator-section{margin-top:0 !important}@media (max-width:767px){.calculator-section{margin-top:0 !important;padding-top:2rem !important}/* ========================================================================== .faq-section h2, .faq-section .section-title{margin-bottom:1.5rem !important;font-weight:700;color:var(--text-primary, var(--color-gray-900))}.faq-section > p, .faq-section .section-description{margin-bottom:3rem !important;font-size:1.125rem;line-height:1.6;color:var(--text-secondary, var(--color-gray-600));max-width:800px;margin-left:auto;margin-right:auto;text-align:center}.faq-container{max-width:900px;margin:0 auto;margin-top:3rem}.faq-item{background:var(--bg-primary);border:2px solid var(--brand-primary-10);border-radius:var(--border-radius-md);margin-bottom:var(--spacing-lg);box-shadow:var(--shadow-sm);transition:var(--transition-base);overflow:hidden}.faq-item:hover{border-color:var(--brand-primary);box-shadow:var(--shadow-md)}.faq-item.active{border-color:var(--accent);box-shadow:var(--shadow-dark-glow)}.faq-question{width:100%;padding:var(--spacing-lg) var(--spacing-xl);background:transparent;border:none;text-align:left;cursor:pointer;font-size:1.125rem;font-weight:600;color:var(--text-primary);display:flex;justify-content:space-between;align-items:center;transition:var(--transition-base);position:relative;overflow:hidden}.faq-question::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, var(--brand-primary-10), transparent);transition:left 0.5s ease}.faq-question:hover::before{left:100%}.faq-question:hover{color:var(--accent)}.faq-question svg{transition:transform var(--transition-base);color:var(--accent);flex-shrink:0}.faq-item.active .faq-question svg{transform:rotate(180deg)}.faq-answer{max-height:0;overflow:hidden;transition:max-height 0.4s ease, padding 0.4s ease;background:var(--bg-secondary)}.faq-answer.active{max-height:2000px;padding:var(--spacing-lg) var(--spacing-xl);border-top:1px solid var(--brand-primary-10)}.faq-answer p{color:var(--text);line-height:1.7;margin:0}.faq-answer ul{padding:0 var(--spacing-xl) var(--spacing-lg) var(--spacing-2xl)}.faq-answer li{color:var(--text);line-height:1.6;margin-bottom:var(--spacing-xs)}@media (max-width:768px){.faq-question{padding:var(--spacing-md) var(--spacing-lg);font-size:1rem}.faq-answer.active{padding:var(--spacing-md) var(--spacing-lg)}}.home-faq-section{padding:var(--space-20) 0;background:linear-gradient(135deg, var(--brand-primary-5) 0%, var(--bg-primary) 50%, rgba(var(--brand-secondary-rgb), 0.05) 100% );position:relative;overflow:hidden}.home-faq-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(min(100%, 500px), 1fr));gap:var(--spacing-2xl);max-width:1200px;margin:0 auto;margin-top:var(--spacing-3xl)}.home-faq-card{background:var(--bg-primary);border-radius:var(--border-radius-lg);overflow:hidden;box-shadow:0 4px 6px var(--brand-primary-10), 0 1px 3px var(--brand-primary-5);transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);border:1px solid var(--brand-primary-15)}.home-faq-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px var(--brand-primary-20), 0 4px 8px var(--brand-primary-10);border-color:var(--brand-primary-30)}.home-faq-card.expanded{border-color:var(--accent);box-shadow:0 8px 16px rgba(var(--brand-secondary-rgb), 0.2), 0 4px 8px rgba(var(--brand-secondary-rgb), 0.1)}.home-faq-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-lg);padding:var(--spacing-xl);cursor:pointer;background:linear-gradient(180deg, var(--bg-primary) 0%, var(--brand-primary-3) 100% );position:relative;overflow:hidden}.home-faq-card-header::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent 0%, rgba(var(--brand-secondary-rgb), 0.1) 50%, transparent 100% );transition:left 0.6s ease}.home-faq-card-header:hover::before{left:100%}.home-faq-card.expanded .home-faq-card-header{background:linear-gradient(180deg, rgba(var(--brand-secondary-rgb), 0.05) 0%, var(--brand-primary-5) 100% )}.home-faq-title{font-size:1.125rem;font-weight:600;color:var(--text-primary);margin:0;line-height:1.4;transition:color 0.3s ease;position:relative;z-index:1}.home-faq-card-header:hover .home-faq-title{color:var(--accent)}.home-faq-card.expanded .home-faq-title{color:var(--accent)}.home-faq-toggle{flex-shrink:0;width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg, var(--brand-primary) 0%, var(--brand-primary-80) 100% );display:flex;align-items:center;justify-content:center;transition:all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);box-shadow:0 2px 8px var(--brand-primary-30);position:relative;z-index:1}.home-faq-card:hover .home-faq-toggle{transform:scale(1.1);box-shadow:0 4px 12px var(--brand-primary-40)}.home-faq-card.expanded .home-faq-toggle{background:linear-gradient(135deg, var(--accent) 0%, rgba(var(--brand-secondary-rgb), 0.8) 100% );transform:rotate(135deg);box-shadow:0 4px 12px rgba(var(--brand-secondary-rgb), 0.4)}.home-faq-plus{font-size:1.5rem;font-weight:300;color:var(--bg-primary);line-height:1;display:flex;align-items:center;justify-content:center;width:100%;height:100%;transform:translateY(-1px);transition:transform 0.3s ease}.home-faq-content{max-height:0;overflow:hidden;transition:max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1), padding 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease;opacity:0;background:var(--bg-secondary)}.home-faq-card.expanded .home-faq-content{max-height:1000px;padding:var(--spacing-xl);opacity:1;border-top:2px solid rgba(var(--brand-secondary-rgb), 0.2)}.home-faq-content p{color:var(--text-secondary);line-height:1.8;margin:0 0 var(--spacing-md) 0;font-size:1rem}.home-faq-content p:last-child{margin-bottom:0}.home-faq-content strong{color:var(--text-primary);font-weight:600}.home-faq-content ul{margin:var(--spacing-md) 0;padding-left:var(--spacing-2xl);list-style:none}.home-faq-content li{color:var(--text-secondary);line-height:1.7;margin-bottom:var(--spacing-sm);position:relative;padding-left:var(--spacing-md)}.home-faq-content li::before{content:'→';position:absolute;left:0;color:var(--accent);font-weight:600}.home-faq-content .service-areas-grid ul{display:grid;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));gap:var(--spacing-sm);padding-left:0;margin:var(--spacing-lg) 0}.home-faq-content .service-areas-grid li{padding-left:var(--spacing-md);font-size:0.95rem}.home-faq-content .timeline-simple{background:var(--brand-primary-5);border-radius:var(--border-radius-md);padding:var(--spacing-lg);margin:var(--spacing-lg) 0}.home-faq-content .timeline-step{color:var(--text-secondary);padding:var(--spacing-sm) 0;border-left:3px solid var(--accent);padding-left:var(--spacing-lg);margin-bottom:var(--spacing-md)}.home-faq-content .timeline-step:last-child{margin-bottom:0}@media (max-width:768px){.home-faq-section{padding:var(--space-16) 0}.home-faq-grid{grid-template-columns:1fr;gap:var(--spacing-lg)}.home-faq-card-header{padding:var(--spacing-lg)}.home-faq-title{font-size:1rem}.home-faq-toggle{width:28px;height:28px}.home-faq-plus{font-size:1.25rem}.home-faq-card.expanded .home-faq-content{padding:var(--spacing-lg)}.home-faq-content .service-areas-grid ul{grid-template-columns:1fr}}@media (max-width:480px){.home-faq-card-header{padding:var(--spacing-md);gap:var(--spacing-md)}.home-faq-title{font-size:0.95rem}.home-faq-card.expanded .home-faq-content{padding:var(--spacing-md)}}