/* _content/ClearoutJunk/Components/Layout/Footer.razor.rz.scp.css */
/* Footer Styles - ClearoutJunk */
.site-footer[b-2whbjcidv4] {
background: linear-gradient(135deg, #2c5530 0%, #1a3d1f 100%);
color: white;
margin-top: auto;
}
/* Footer Main Section */
.footer-main[b-2whbjcidv4] {
padding: 60px 0 40px 0;
position: relative;
}
.footer-main[b-2whbjcidv4]::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('data:image/svg+xml,') repeat-x;
background-size: 100px 100px;
opacity: 0.5;
}
.footer-content[b-2whbjcidv4] {
display: grid;
grid-template-columns: 2fr 1fr 1fr 1fr 1.5fr;
gap: 40px;
position: relative;
z-index: 1;
}
/* Company Info Section */
.company-info[b-2whbjcidv4] {
max-width: none;
}
.footer-brand[b-2whbjcidv4] {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 20px;
}
.footer-logo[b-2whbjcidv4] {
height: 40px;
width: auto;
}
.footer-brand-text[b-2whbjcidv4] {
font-size: 1.8rem;
font-weight: 700;
color: white;
}
.company-description[b-2whbjcidv4] {
color: rgba(255, 255, 255, 0.9);
line-height: 1.6;
margin-bottom: 25px;
font-size: 1rem;
}
.contact-info[b-2whbjcidv4] {
display: flex;
flex-direction: column;
gap: 12px;
}
.contact-item[b-2whbjcidv4] {
display: flex;
align-items: center;
gap: 10px;
}
.contact-icon[b-2whbjcidv4] {
font-size: 1.2rem;
width: 20px;
text-align: center;
}
.contact-link[b-2whbjcidv4] {
color: white;
text-decoration: none;
font-weight: 500;
transition: all 0.3s ease;
}
.contact-link:hover[b-2whbjcidv4] {
color: #68a077;
text-decoration: underline;
}
.contact-text[b-2whbjcidv4] {
color: rgba(255, 255, 255, 0.9);
font-weight: 500;
}
/* Footer Sections */
.footer-section[b-2whbjcidv4] {
display: flex;
flex-direction: column;
}
.footer-title[b-2whbjcidv4] {
color: white;
font-size: 1.2rem;
font-weight: 600;
margin-bottom: 20px;
border-bottom: 2px solid #4a7c59;
padding-bottom: 8px;
}
.footer-links[b-2whbjcidv4] {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 10px;
}
.footer-links li[b-2whbjcidv4] {
margin: 0;
}
.footer-links a[b-2whbjcidv4] {
color: rgba(255, 255, 255, 0.8);
text-decoration: none;
transition: all 0.3s ease;
font-size: 0.95rem;
display: block;
padding: 2px 0;
}
.footer-links a:hover[b-2whbjcidv4] {
color: white;
transform: translateX(5px);
text-decoration: underline;
}
/* CTA Section */
.cta-section[b-2whbjcidv4] {
background: rgba(255, 255, 255, 0.05);
padding: 30px;
border-radius: 15px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(10px);
}
.cta-section .footer-title[b-2whbjcidv4] {
border-bottom-color: #ff6b35;
margin-bottom: 15px;
}
.cta-text[b-2whbjcidv4] {
color: rgba(255, 255, 255, 0.9);
margin-bottom: 20px;
font-size: 0.95rem;
line-height: 1.5;
}
.footer-cta-buttons[b-2whbjcidv4] {
display: flex;
flex-direction: column;
gap: 12px;
margin-bottom: 25px;
}
.footer-btn[b-2whbjcidv4] {
padding: 12px 20px;
border: none;
border-radius: 25px;
font-weight: 600;
font-size: 0.95rem;
text-decoration: none;
text-align: center;
cursor: pointer;
transition: all 0.3s ease;
display: block;
}
.footer-btn.primary[b-2whbjcidv4] {
background: linear-gradient(135deg, #ff6b35 0%, #e55a2b 100%);
color: white;
box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3);
}
.footer-btn.primary:hover[b-2whbjcidv4] {
background: #e55a2b;
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(255, 107, 53, 0.4);
}
.footer-btn.secondary[b-2whbjcidv4] {
background: transparent;
color: white;
border: 2px solid white;
}
.footer-btn.secondary:hover[b-2whbjcidv4] {
background: white;
color: #2c5530;
transform: translateY(-2px);
}
.service-hours[b-2whbjcidv4] {
border-top: 1px solid rgba(255, 255, 255, 0.2);
padding-top: 20px;
}
.service-hours h4[b-2whbjcidv4] {
color: white;
font-size: 1rem;
margin-bottom: 10px;
font-weight: 600;
}
.service-hours p[b-2whbjcidv4] {
color: rgba(255, 255, 255, 0.8);
margin-bottom: 5px;
font-size: 0.9rem;
}
/* Footer Bottom */
.footer-bottom[b-2whbjcidv4] {
background: rgba(0, 0, 0, 0.2);
padding: 20px 0;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.footer-bottom-content[b-2whbjcidv4] {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 20px;
}
.copyright p[b-2whbjcidv4] {
color: rgba(255, 255, 255, 0.7);
margin: 0;
font-size: 0.9rem;
}
.certifications[b-2whbjcidv4] {
display: flex;
gap: 15px;
flex-wrap: wrap;
}
.cert-badge[b-2whbjcidv4] {
background: rgba(255, 255, 255, 0.1);
color: white;
padding: 6px 12px;
border-radius: 15px;
font-size: 0.8rem;
font-weight: 500;
border: 1px solid rgba(255, 255, 255, 0.2);
backdrop-filter: blur(5px);
}
.social-links[b-2whbjcidv4] {
display: flex;
gap: 15px;
}
.social-link[b-2whbjcidv4] {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
background: rgba(255, 255, 255, 0.1);
border-radius: 50%;
color: white;
text-decoration: none;
transition: all 0.3s ease;
border: 1px solid rgba(255, 255, 255, 0.2);
backdrop-filter: blur(5px);
}
.social-link:hover[b-2whbjcidv4] {
background: #4a7c59;
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(74, 124, 89, 0.3);
}
.social-icon[b-2whbjcidv4] {
font-size: 1.2rem;
}
/* Responsive Design */
@media (max-width: 1024px) {
.footer-content[b-2whbjcidv4] {
grid-template-columns: 2fr 1fr 1fr 1.5fr;
gap: 30px;
}
.footer-section:nth-child(3)[b-2whbjcidv4] {
display: none;
}
}
@media (max-width: 768px) {
.footer-main[b-2whbjcidv4] {
padding: 40px 0 30px 0;
}
.footer-content[b-2whbjcidv4] {
grid-template-columns: 1fr;
gap: 30px;
text-align: center;
}
.company-info[b-2whbjcidv4] {
text-align: center;
}
.contact-info[b-2whbjcidv4] {
align-items: center;
}
.footer-cta-buttons[b-2whbjcidv4] {
flex-direction: row;
justify-content: center;
}
.footer-btn[b-2whbjcidv4] {
flex: 1;
max-width: 140px;
}
.footer-bottom-content[b-2whbjcidv4] {
flex-direction: column;
text-align: center;
gap: 15px;
}
.certifications[b-2whbjcidv4] {
justify-content: center;
}
.social-links[b-2whbjcidv4] {
justify-content: center;
}
}
@media (max-width: 480px) {
.footer-main[b-2whbjcidv4] {
padding: 30px 0 20px 0;
}
.footer-content[b-2whbjcidv4] {
gap: 25px;
}
.cta-section[b-2whbjcidv4] {
padding: 25px 20px;
}
.footer-cta-buttons[b-2whbjcidv4] {
flex-direction: column;
}
.footer-btn[b-2whbjcidv4] {
max-width: none;
}
.certifications[b-2whbjcidv4] {
flex-direction: column;
align-items: center;
}
.cert-badge[b-2whbjcidv4] {
width: 100%;
max-width: 200px;
text-align: center;
}
}
/* Print Styles */
@media print {
.site-footer[b-2whbjcidv4] {
background: white !important;
color: black !important;
border-top: 2px solid #2c5530;
}
.footer-main[b-2whbjcidv4]::before {
display: none;
}
.footer-content[b-2whbjcidv4] {
grid-template-columns: 1fr 1fr;
gap: 30px;
}
.cta-section[b-2whbjcidv4],
.social-links[b-2whbjcidv4] {
display: none;
}
.footer-links a[b-2whbjcidv4],
.contact-link[b-2whbjcidv4] {
color: black !important;
text-decoration: underline;
}
.footer-title[b-2whbjcidv4] {
color: #2c5530 !important;
border-bottom-color: #2c5530;
}
.footer-brand-text[b-2whbjcidv4] {
color: #2c5530 !important;
}
}
/* _content/ClearoutJunk/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-2imhnkqsna] {
position: relative;
display: flex;
flex-direction: column;
}
main[b-2imhnkqsna] {
flex: 1;
}
.sidebar[b-2imhnkqsna] {
background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}
.top-row[b-2imhnkqsna] {
background-color: #f7f7f7;
border-bottom: 1px solid #d6d5d5;
justify-content: flex-end;
height: 3.5rem;
display: flex;
align-items: center;
}
.top-row[b-2imhnkqsna] a, .top-row[b-2imhnkqsna] .btn-link {
white-space: nowrap;
margin-left: 1.5rem;
text-decoration: none;
}
.top-row[b-2imhnkqsna] a:hover, .top-row[b-2imhnkqsna] .btn-link:hover {
text-decoration: underline;
}
.top-row[b-2imhnkqsna] a:first-child {
overflow: hidden;
text-overflow: ellipsis;
}
@media (max-width: 640.98px) {
.top-row[b-2imhnkqsna] {
justify-content: space-between;
}
.top-row[b-2imhnkqsna] a, .top-row[b-2imhnkqsna] .btn-link {
margin-left: 0;
}
}
@media (min-width: 641px) {
.page[b-2imhnkqsna] {
flex-direction: row;
}
.sidebar[b-2imhnkqsna] {
width: 250px;
height: 100vh;
position: sticky;
top: 0;
}
.top-row[b-2imhnkqsna] {
position: sticky;
top: 0;
z-index: 1;
}
.top-row.auth[b-2imhnkqsna] a:first-child {
flex: 1;
text-align: right;
width: 0;
}
.top-row[b-2imhnkqsna], article[b-2imhnkqsna] {
padding-left: 2rem !important;
padding-right: 1.5rem !important;
}
}
#blazor-error-ui[b-2imhnkqsna] {
background: lightyellow;
bottom: 0;
box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
display: none;
left: 0;
padding: 0.6rem 1.25rem 0.7rem 1.25rem;
position: fixed;
width: 100%;
z-index: 1000;
}
#blazor-error-ui .dismiss[b-2imhnkqsna] {
cursor: pointer;
position: absolute;
right: 0.75rem;
top: 0.5rem;
}
/* _content/ClearoutJunk/Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-ninv7kxlro] {
appearance: none;
cursor: pointer;
width: 3.5rem;
height: 2.5rem;
color: white;
position: absolute;
top: 0.5rem;
right: 1rem;
border: 1px solid rgba(255, 255, 255, 0.1);
background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}
.navbar-toggler:checked[b-ninv7kxlro] {
background-color: rgba(255, 255, 255, 0.5);
}
.top-row[b-ninv7kxlro] {
height: 3.5rem;
background-color: rgba(0,0,0,0.4);
}
.navbar-brand[b-ninv7kxlro] {
font-size: 1.1rem;
}
.bi[b-ninv7kxlro] {
display: inline-block;
position: relative;
width: 1.25rem;
height: 1.25rem;
margin-right: 0.75rem;
top: -1px;
background-size: cover;
}
.bi-house-door-fill-nav-menu[b-ninv7kxlro] {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}
.bi-plus-square-fill-nav-menu[b-ninv7kxlro] {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}
.bi-list-nested-nav-menu[b-ninv7kxlro] {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}
.bi-lock-nav-menu[b-ninv7kxlro] {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zM5 8h6a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}
.bi-person-nav-menu[b-ninv7kxlro] {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E");
}
.bi-person-badge-nav-menu[b-ninv7kxlro] {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
}
.bi-person-fill-nav-menu[b-ninv7kxlro] {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");
}
.bi-arrow-bar-left-nav-menu[b-ninv7kxlro] {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E");
}
.nav-item[b-ninv7kxlro] {
font-size: 0.9rem;
padding-bottom: 0.5rem;
}
.nav-item[b-ninv7kxlro] .nav-link {
color: #d7d7d7;
background: none;
border: none;
border-radius: 4px;
height: 3rem;
display: flex;
align-items: center;
line-height: 3rem;
width: 100%;
}
.nav-item[b-ninv7kxlro] a.active {
background-color: rgba(255,255,255,0.37);
color: white;
}
.nav-item[b-ninv7kxlro] .nav-link:hover {
background-color: rgba(255,255,255,0.1);
color: white;
}
.nav-scrollable[b-ninv7kxlro] {
display: none;
}
.navbar-toggler:checked ~ .nav-scrollable[b-ninv7kxlro] {
display: block;
}
@media (min-width: 641px) {
.navbar-toggler[b-ninv7kxlro] {
display: none;
}
.nav-scrollable[b-ninv7kxlro] {
/* Never collapse the sidebar for wide screens */
display: block;
/* Allow sidebar to scroll for tall menus */
height: calc(100vh - 3.5rem);
overflow-y: auto;
}
}
/* _content/ClearoutJunk/Components/Pages/About.razor.rz.scp.css */
/* Clearout Junk About Page Styles */
/* Reset and Base Styles */
*[b-dslm2n1t3g] {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body[b-dslm2n1t3g] {
font-family: 'Arial', sans-serif;
line-height: 1.6;
color: #333;
background-color: #ffffff;
}
.container[b-dslm2n1t3g] {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}
.image-placeholder img[b-dslm2n1t3g] {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 15px;
}
/* Typography */
h1[b-dslm2n1t3g], h2[b-dslm2n1t3g], h3[b-dslm2n1t3g] {
font-weight: 700;
margin-bottom: 1rem;
}
h1[b-dslm2n1t3g] {
font-size: 3rem;
color: #2c5530;
}
h2[b-dslm2n1t3g] {
font-size: 2.5rem;
color: #2c5530;
text-align: center;
margin-bottom: 1.5rem;
}
h3[b-dslm2n1t3g] {
font-size: 1.5rem;
color: #2c5530;
margin-bottom: 0.75rem;
}
p[b-dslm2n1t3g] {
margin-bottom: 1rem;
font-size: 1.1rem;
line-height: 1.7;
}
/* Hero Section */
.about-hero[b-dslm2n1t3g] {
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
padding: 100px 0;
text-align: center;
position: relative;
overflow: hidden;
}
.about-hero[b-dslm2n1t3g]::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('data:image/svg+xml,') repeat-x;
background-size: 100px 100px;
}
.hero-content[b-dslm2n1t3g] {
position: relative;
z-index: 1;
}
.about-hero h1[b-dslm2n1t3g] {
color: white;
font-size: 3.5rem;
margin-bottom: 1.5rem;
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}
.hero-subtitle[b-dslm2n1t3g] {
font-size: 1.3rem;
max-width: 600px;
margin: 0 auto;
opacity: 0.95;
color: white;
}
/* Our Story Section */
.our-story[b-dslm2n1t3g] {
padding: 80px 0;
background-color: #f8f9fa;
}
.story-grid[b-dslm2n1t3g] {
display: grid;
grid-template-columns: 2fr 1fr;
gap: 60px;
align-items: center;
}
.story-content h2[b-dslm2n1t3g] {
text-align: left;
margin-bottom: 2rem;
}
.story-intro[b-dslm2n1t3g] {
font-size: 1.2rem;
font-weight: 500;
color: #4a7c59;
margin-bottom: 2rem;
}
.story-highlights[b-dslm2n1t3g] {
display: flex;
gap: 40px;
margin: 40px 0;
flex-wrap: wrap;
}
.highlight-item[b-dslm2n1t3g] {
text-align: center;
}
.highlight-number[b-dslm2n1t3g] {
font-size: 3rem;
font-weight: 800;
color: #4a7c59;
line-height: 1;
}
.highlight-text[b-dslm2n1t3g] {
font-size: 1rem;
color: #666;
margin-top: 8px;
font-weight: 500;
}
.story-image[b-dslm2n1t3g] {
display: flex;
justify-content: center;
}
.image-placeholder[b-dslm2n1t3g] {
width: 300px;
height: 400px;
background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
border-radius: 15px;
display: flex;
align-items: center;
justify-content: center;
border: 3px solid #adb5bd;
}
.placeholder-content[b-dslm2n1t3g] {
text-align: center;
color: #6c757d;
}
.placeholder-icon[b-dslm2n1t3g] {
font-size: 3rem;
display: block;
margin-bottom: 1rem;
}
/* Our Values Section */
.our-values[b-dslm2n1t3g] {
padding: 80px 0;
background-color: white;
}
.section-subtitle[b-dslm2n1t3g] {
text-align: center;
font-size: 1.2rem;
color: #666;
max-width: 600px;
margin: 0 auto 4rem auto;
}
.values-grid[b-dslm2n1t3g] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
gap: 30px;
margin-top: 3rem;
}
.value-card[b-dslm2n1t3g] {
background: white;
padding: 30px;
border-radius: 15px;
text-align: center;
box-shadow: 0 5px 20px rgba(0,0,0,0.08);
transition: all 0.3s ease;
border: 2px solid #f8f9fa;
}
.value-card:hover[b-dslm2n1t3g] {
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(0,0,0,0.15);
border-color: #4a7c59;
}
.value-icon[b-dslm2n1t3g] {
font-size: 3rem;
margin-bottom: 1rem;
display: block;
}
.value-card h3[b-dslm2n1t3g] {
color: #2c5530;
margin-bottom: 1rem;
}
.value-card p[b-dslm2n1t3g] {
color: #666;
font-size: 1rem;
line-height: 1.6;
margin: 0;
}
/* Team Section */
.our-team[b-dslm2n1t3g] {
padding: 80px 0;
background-color: #f8f9fa;
}
.team-grid[b-dslm2n1t3g] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 40px;
margin-top: 3rem;
}
.team-member[b-dslm2n1t3g] {
background: white;
padding: 40px 30px;
border-radius: 20px;
text-align: center;
box-shadow: 0 5px 20px rgba(0,0,0,0.08);
transition: transform 0.3s ease;
}
.team-member:hover[b-dslm2n1t3g] {
transform: translateY(-5px);
}
.member-photo[b-dslm2n1t3g] {
width: 120px;
height: 120px;
margin: 0 auto 20px auto;
border-radius: 50%;
overflow: hidden;
}
.photo-placeholder[b-dslm2n1t3g] {
width: 100%;
height: 100%;
background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
display: flex;
align-items: center;
justify-content: center;
border: 3px dashed #adb5bd;
border-radius: 50%;
}
.photo-placeholder .placeholder-icon[b-dslm2n1t3g] {
font-size: 2.5rem;
color: #6c757d;
}
.member-title[b-dslm2n1t3g] {
color: #4a7c59;
font-weight: 600;
font-size: 1.1rem;
margin-bottom: 1rem;
}
.member-bio[b-dslm2n1t3g] {
color: #666;
font-size: 1rem;
line-height: 1.6;
margin: 0;
}
/* Community Impact Section */
.community-impact[b-dslm2n1t3g] {
padding: 80px 0;
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
}
.community-impact h2[b-dslm2n1t3g] {
color: white;
margin-bottom: 1rem;
}
.impact-intro[b-dslm2n1t3g] {
text-align: center;
font-size: 1.2rem;
margin-bottom: 3rem;
opacity: 0.95;
}
.impact-stats[b-dslm2n1t3g] {
display: flex;
justify-content: center;
gap: 60px;
margin-bottom: 4rem;
flex-wrap: wrap;
}
.impact-stat[b-dslm2n1t3g] {
text-align: center;
}
.stat-number[b-dslm2n1t3g] {
font-size: 3.5rem;
font-weight: 800;
color: white;
line-height: 1;
margin-bottom: 0.5rem;
}
.stat-label[b-dslm2n1t3g] {
font-size: 1.1rem;
opacity: 0.9;
font-weight: 500;
}
.impact-partnerships[b-dslm2n1t3g] {
max-width: 800px;
margin: 0 auto;
}
.impact-partnerships h3[b-dslm2n1t3g] {
color: white;
text-align: center;
font-size: 2rem;
margin-bottom: 2rem;
}
.partners-list[b-dslm2n1t3g] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 20px;
}
.partner-item[b-dslm2n1t3g] {
background: rgba(255,255,255,0.1);
padding: 20px;
border-radius: 10px;
backdrop-filter: blur(10px);
border: 1px solid rgba(255,255,255,0.2);
}
.partner-item strong[b-dslm2n1t3g] {
color: white;
font-weight: 600;
}
/* Certifications Section */
.certifications[b-dslm2n1t3g] {
padding: 80px 0;
background-color: white;
}
.cert-grid[b-dslm2n1t3g] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 30px;
margin-top: 3rem;
}
.cert-item[b-dslm2n1t3g] {
text-align: center;
padding: 30px 20px;
border-radius: 15px;
background: #f8f9fa;
transition: all 0.3s ease;
border: 2px solid transparent;
}
.cert-item:hover[b-dslm2n1t3g] {
transform: translateY(-5px);
border-color: #4a7c59;
box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}
.cert-icon[b-dslm2n1t3g] {
font-size: 3rem;
margin-bottom: 1rem;
display: block;
}
.cert-item h3[b-dslm2n1t3g] {
color: #2c5530;
font-size: 1.2rem;
margin-bottom: 0.5rem;
}
.cert-item p[b-dslm2n1t3g] {
color: #666;
font-size: 0.9rem;
margin: 0;
}
/* Call to Action Section */
.about-cta[b-dslm2n1t3g] {
padding: 80px 0;
background: linear-gradient(135deg, #2c5530 0%, #1a3d1f 100%);
color: white;
text-align: center;
}
.cta-content h2[b-dslm2n1t3g] {
color: white;
font-size: 2.5rem;
margin-bottom: 1.5rem;
}
.cta-content p[b-dslm2n1t3g] {
font-size: 1.2rem;
margin-bottom: 2.5rem;
opacity: 0.95;
}
.cta-buttons[b-dslm2n1t3g] {
display: flex;
justify-content: center;
gap: 20px;
flex-wrap: wrap;
}
.btn[b-dslm2n1t3g] {
padding: 16px 32px;
font-size: 1.1rem;
font-weight: 600;
border: none;
border-radius: 50px;
cursor: pointer;
text-decoration: none;
display: inline-block;
transition: all 0.3s ease;
text-align: center;
min-width: 200px;
}
.btn-large[b-dslm2n1t3g] {
padding: 18px 40px;
font-size: 1.2rem;
}
.btn-primary[b-dslm2n1t3g] {
background: #ff6b35;
color: white;
box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3);
}
.btn-primary:hover[b-dslm2n1t3g] {
background: #e55a2b;
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(255, 107, 53, 0.4);
}
.btn-secondary[b-dslm2n1t3g] {
background: transparent;
color: white;
border: 2px solid white;
}
.btn-secondary:hover[b-dslm2n1t3g] {
background: white;
color: #2c5530;
transform: translateY(-2px);
}
/* Responsive Design */
@media (max-width: 768px) {
.container[b-dslm2n1t3g] {
padding: 0 15px;
}
.about-hero h1[b-dslm2n1t3g] {
font-size: 2.5rem;
}
.hero-subtitle[b-dslm2n1t3g] {
font-size: 1.1rem;
}
.story-grid[b-dslm2n1t3g] {
grid-template-columns: 1fr;
gap: 40px;
}
.story-highlights[b-dslm2n1t3g] {
justify-content: center;
gap: 30px;
}
.highlight-number[b-dslm2n1t3g] {
font-size: 2.5rem;
}
.values-grid[b-dslm2n1t3g] {
grid-template-columns: 1fr;
gap: 20px;
}
.value-card[b-dslm2n1t3g] {
padding: 25px 20px;
}
.team-grid[b-dslm2n1t3g] {
grid-template-columns: 1fr;
gap: 30px;
}
.impact-stats[b-dslm2n1t3g] {
gap: 40px;
}
.stat-number[b-dslm2n1t3g] {
font-size: 2.8rem;
}
.cert-grid[b-dslm2n1t3g] {
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: 20px;
}
.cta-buttons[b-dslm2n1t3g] {
flex-direction: column;
align-items: center;
}
.btn[b-dslm2n1t3g] {
width: 100%;
max-width: 300px;
}
h2[b-dslm2n1t3g] {
font-size: 2rem;
}
.about-cta h2[b-dslm2n1t3g] {
font-size: 2rem;
}
}
@media (max-width: 480px) {
.about-hero[b-dslm2n1t3g] {
padding: 60px 0;
}
.about-hero h1[b-dslm2n1t3g] {
font-size: 2rem;
}
.our-story[b-dslm2n1t3g],
.our-values[b-dslm2n1t3g],
.our-team[b-dslm2n1t3g],
.community-impact[b-dslm2n1t3g],
.certifications[b-dslm2n1t3g],
.about-cta[b-dslm2n1t3g] {
padding: 60px 0;
}
.story-highlights[b-dslm2n1t3g] {
flex-direction: column;
gap: 20px;
}
.impact-stats[b-dslm2n1t3g] {
flex-direction: column;
gap: 30px;
}
}
/* _content/ClearoutJunk/Components/Pages/ContactUs.razor.rz.scp.css */
/* =============================================================================
CONTACT PAGE STYLES
============================================================================= */
/* Contact Hero */
.contact-hero[b-h1xtg90pd2] {
background: var(--gradient-primary);
padding: 120px 0 80px;
color: white;
text-align: center;
}
.contact-hero h1[b-h1xtg90pd2] {
font-size: 3rem;
font-weight: 700;
margin-bottom: 1.5rem;
color: white;
}
.hero-contact-options[b-h1xtg90pd2] {
display: flex;
justify-content: center;
gap: 2rem;
margin-top: 3rem;
flex-wrap: wrap;
}
.contact-option[b-h1xtg90pd2] {
display: flex;
align-items: center;
gap: 1rem;
background: rgba(255, 255, 255, 0.15);
backdrop-filter: blur(10px);
padding: 1.5rem 2rem;
border-radius: var(--border-radius-lg);
border: 2px solid rgba(255, 255, 255, 0.2);
transition: var(--transition);
text-decoration: none;
color: white;
min-width: 200px;
}
.contact-option:hover[b-h1xtg90pd2] {
background: rgba(255, 255, 255, 0.25);
transform: translateY(-3px);
color: white;
}
.contact-option.phone:hover[b-h1xtg90pd2] {
border-color: var(--accent-color);
}
.contact-option.instant[b-h1xtg90pd2] {
cursor: pointer;
}
.option-icon[b-h1xtg90pd2] {
font-size: 2.5rem;
flex-shrink: 0;
}
.option-title[b-h1xtg90pd2] {
font-weight: 700;
font-size: 1.1rem;
margin-bottom: 0.25rem;
}
.option-detail[b-h1xtg90pd2] {
font-size: 0.9rem;
opacity: 0.9;
}
/* Main Contact Section */
.contact-main[b-h1xtg90pd2] {
padding: var(--section-padding);
background: var(--bg-light);
}
.contact-grid[b-h1xtg90pd2] {
display: grid;
grid-template-columns: 2fr 1fr;
gap: 4rem;
align-items: start;
}
/* Contact Form Section */
.contact-form-section h2[b-h1xtg90pd2] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 2rem;
}
.form-intro[b-h1xtg90pd2] {
color: var(--text-muted);
margin-bottom: 2rem;
font-size: 1.1rem;
line-height: 1.6;
}
.contact-form[b-h1xtg90pd2] {
background: white;
padding: 3rem;
border-radius: var(--border-radius-lg);
box-shadow: var(--shadow-md);
border: 1px solid var(--border-light);
}
.form-row[b-h1xtg90pd2] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1.5rem;
margin-bottom: 1.5rem;
}
.form-group[b-h1xtg90pd2] {
margin-bottom: 1.5rem;
}
.form-group label[b-h1xtg90pd2] {
display: block;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 0.75rem;
font-size: 1rem;
}
.form-group input[b-h1xtg90pd2],
.form-group select[b-h1xtg90pd2],
.form-group textarea[b-h1xtg90pd2] {
width: 100%;
padding: 1rem 1.25rem;
border: 2px solid var(--border-light);
border-radius: var(--border-radius);
font-size: 1rem;
transition: var(--transition);
background: white;
font-family: inherit;
color: var(--text-secondary);
}
.form-group input:focus[b-h1xtg90pd2],
.form-group select:focus[b-h1xtg90pd2],
.form-group textarea:focus[b-h1xtg90pd2] {
outline: none;
border-color: var(--primary-color);
box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
background: #fafbfc;
}
.form-group textarea[b-h1xtg90pd2] {
resize: vertical;
min-height: 100px;
line-height: 1.5;
}
.form-group input[b-h1xtg90pd2]::placeholder,
.form-group textarea[b-h1xtg90pd2]::placeholder {
color: var(--text-muted);
opacity: 0.8;
}
.checkbox-group[b-h1xtg90pd2] {
display: flex;
align-items: flex-start;
gap: 1rem;
margin: 2rem 0;
}
.checkbox-label[b-h1xtg90pd2] {
display: flex;
align-items: flex-start;
gap: 0.75rem;
cursor: pointer;
margin-bottom: 0 !important;
line-height: 1.5;
}
.checkbox-label input[type="checkbox"][b-h1xtg90pd2] {
width: 18px;
height: 18px;
margin: 0;
accent-color: var(--primary-color);
flex-shrink: 0;
margin-top: 2px;
}
.submit-btn[b-h1xtg90pd2] {
width: 100%;
background: var(--gradient-cta);
color: white;
border: none;
padding: 1.25rem 2rem;
border-radius: var(--border-radius-pill);
font-weight: 700;
font-size: 1.1rem;
cursor: pointer;
transition: var(--transition);
display: flex;
align-items: center;
justify-content: center;
gap: 0.75rem;
margin-top: 1.5rem;
box-shadow: 0 8px 25px rgba(255, 107, 107, 0.3);
}
.submit-btn:hover[b-h1xtg90pd2] {
transform: translateY(-2px);
box-shadow: 0 12px 35px rgba(255, 107, 107, 0.4);
}
.submit-btn:disabled[b-h1xtg90pd2] {
opacity: 0.7;
cursor: not-allowed;
transform: none;
}
.btn-icon[b-h1xtg90pd2] {
font-size: 1.2rem;
transition: var(--transition);
}
.submit-btn:hover .btn-icon[b-h1xtg90pd2] {
transform: translateX(3px);
}
.form-note[b-h1xtg90pd2] {
margin-top: 1rem;
text-align: center;
color: var(--text-muted);
font-size: 0.9rem;
line-height: 1.4;
}
.form-note strong[b-h1xtg90pd2] {
color: var(--text-primary);
}
/* Contact Information Section */
.contact-info-section h2[b-h1xtg90pd2] {
color: var(--text-primary);
margin-bottom: 2rem;
font-size: 1.5rem;
}
.contact-methods[b-h1xtg90pd2] {
margin-bottom: 3rem;
}
.contact-method[b-h1xtg90pd2] {
display: flex;
align-items: flex-start;
gap: 1.25rem;
padding: 1.5rem;
background: white;
border-radius: var(--border-radius);
margin-bottom: 1rem;
border: 2px solid var(--border-light);
transition: var(--transition);
}
.contact-method:hover[b-h1xtg90pd2] {
background: #fafbfc;
box-shadow: var(--shadow-sm);
transform: translateY(-2px);
border-color: var(--primary-color);
}
.method-icon[b-h1xtg90pd2] {
font-size: 2rem;
background: var(--gradient-primary);
color: white;
width: 60px;
height: 60px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
box-shadow: 0 4px 15px rgba(102, 126, 234, 0.2);
}
.method-content h3[b-h1xtg90pd2] {
color: var(--text-primary);
margin-bottom: 0.5rem;
font-size: 1.1rem;
}
.method-content p[b-h1xtg90pd2] {
margin: 0.25rem 0;
color: var(--text-secondary);
}
.method-content a[b-h1xtg90pd2] {
color: var(--primary-color);
font-weight: 600;
text-decoration: none;
}
.method-content a:hover[b-h1xtg90pd2] {
text-decoration: underline;
}
.method-details[b-h1xtg90pd2] {
font-size: 0.9rem;
color: var(--text-muted) !important;
margin-top: 0.5rem;
}
/* Service Hours */
.service-hours[b-h1xtg90pd2] {
background: white;
padding: 2rem;
border-radius: var(--border-radius-lg);
margin-bottom: 3rem;
border: 2px solid var(--border-light);
}
.service-hours h3[b-h1xtg90pd2] {
color: var(--text-primary);
margin-bottom: 1.5rem;
font-size: 1.2rem;
border-bottom: 2px solid var(--primary-color);
padding-bottom: 0.5rem;
}
.hours-list[b-h1xtg90pd2] {
display: flex;
flex-direction: column;
gap: 1rem;
}
.hours-item[b-h1xtg90pd2] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.75rem 0;
border-bottom: 1px solid var(--border-light);
}
.hours-item:last-child[b-h1xtg90pd2] {
border-bottom: none;
}
.hours-item.emergency[b-h1xtg90pd2] {
background: linear-gradient(135deg, #e6f3ff 0%, #f0f8ff 100%);
padding: 1rem;
border-radius: var(--border-radius);
border: 2px solid var(--primary-color);
margin-top: 0.5rem;
}
.hours-item .day[b-h1xtg90pd2] {
font-weight: 600;
color: var(--text-primary);
}
.hours-item .time[b-h1xtg90pd2] {
color: var(--text-secondary);
font-weight: 500;
}
.hours-item.emergency .day[b-h1xtg90pd2],
.hours-item.emergency .time[b-h1xtg90pd2] {
color: var(--primary-color);
font-weight: 700;
}
/* Quick Facts */
.quick-facts[b-h1xtg90pd2] {
background: linear-gradient(135deg, #f0fff4 0%, #e6fffa 100%);
padding: 2rem;
border-radius: var(--border-radius-lg);
border: 2px solid var(--success-color);
}
.quick-facts h3[b-h1xtg90pd2] {
color: var(--text-primary);
margin-bottom: 1.5rem;
font-size: 1.2rem;
}
.facts-list[b-h1xtg90pd2] {
list-style: none;
padding: 0;
margin: 0;
}
.facts-list li[b-h1xtg90pd2] {
padding: 0.5rem 0;
color: var(--text-secondary);
font-weight: 500;
display: flex;
align-items: center;
gap: 0.5rem;
}
.facts-list li[b-h1xtg90pd2]::before {
content: "";
width: 6px;
height: 6px;
background: var(--success-color);
border-radius: 50%;
flex-shrink: 0;
}
/* Service Areas */
.service-areas[b-h1xtg90pd2] {
padding: var(--section-padding);
background: white;
}
.service-areas h2[b-h1xtg90pd2] {
text-align: center;
color: var(--text-primary);
margin-bottom: 1rem;
}
.section-subtitle[b-h1xtg90pd2] {
text-align: center;
color: var(--text-muted);
margin-bottom: 3rem;
font-size: 1.1rem;
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
.areas-grid[b-h1xtg90pd2] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 3rem;
margin-bottom: 3rem;
}
.area-column[b-h1xtg90pd2] {
background: var(--bg-light);
padding: 2rem;
border-radius: var(--border-radius-lg);
border-left: 4px solid var(--primary-color);
}
.area-column h3[b-h1xtg90pd2] {
color: var(--text-primary);
margin-bottom: 1.5rem;
font-size: 1.3rem;
}
.areas-list[b-h1xtg90pd2] {
list-style: none;
padding: 0;
margin: 0;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.5rem;
}
.areas-list li[b-h1xtg90pd2] {
padding: 0.5rem 0;
color: var(--text-secondary);
font-weight: 500;
border-bottom: 1px solid var(--border-light);
}
.area-note[b-h1xtg90pd2] {
grid-column: 1 / -1;
display: flex;
align-items: flex-start;
gap: 1.5rem;
background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
padding: 2rem;
border-radius: var(--border-radius-lg);
border: 2px solid #ffc107;
}
.note-icon[b-h1xtg90pd2] {
font-size: 2.5rem;
flex-shrink: 0;
}
.note-content h4[b-h1xtg90pd2] {
color: var(--text-primary);
margin-bottom: 0.75rem;
font-size: 1.1rem;
}
.note-content p[b-h1xtg90pd2] {
color: var(--text-secondary);
margin: 0;
line-height: 1.5;
}
.note-content a[b-h1xtg90pd2] {
color: var(--primary-color);
font-weight: 600;
text-decoration: none;
}
.note-content a:hover[b-h1xtg90pd2] {
text-decoration: underline;
}
/* Contact FAQ */
.contact-faq[b-h1xtg90pd2] {
padding: var(--section-padding);
background: var(--bg-light);
}
.contact-faq h2[b-h1xtg90pd2] {
text-align: center;
color: var(--text-primary);
margin-bottom: 3rem;
}
.faq-grid[b-h1xtg90pd2] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
gap: 2rem;
}
.faq-item[b-h1xtg90pd2] {
background: white;
padding: 2rem;
border-radius: var(--border-radius-lg);
transition: var(--transition);
border: 2px solid var(--border-light);
}
.faq-item:hover[b-h1xtg90pd2] {
transform: translateY(-3px);
box-shadow: var(--shadow-sm);
border-color: var(--primary-color);
}
.faq-item h3[b-h1xtg90pd2] {
color: var(--text-primary);
margin-bottom: 1rem;
font-size: 1.1rem;
line-height: 1.3;
}
.faq-item p[b-h1xtg90pd2] {
color: var(--text-secondary);
line-height: 1.6;
margin: 0;
}
/* Contact Responsive */
@media (max-width: 1024px) {
.contact-grid[b-h1xtg90pd2] {
grid-template-columns: 1fr;
gap: 3rem;
}
.areas-grid[b-h1xtg90pd2] {
grid-template-columns: 1fr;
gap: 2rem;
}
.areas-list[b-h1xtg90pd2] {
grid-template-columns: 1fr;
}
}
@media (max-width: 768px) {
.hero-contact-options[b-h1xtg90pd2] {
flex-direction: column;
align-items: center;
gap: 1rem;
}
.contact-option[b-h1xtg90pd2] {
width: 100%;
max-width: 300px;
justify-content: center;
}
.form-row[b-h1xtg90pd2] {
grid-template-columns: 1fr;
gap: 0;
}
.contact-form[b-h1xtg90pd2] {
padding: 2rem;
}
.contact-method[b-h1xtg90pd2] {
flex-direction: column;
text-align: center;
align-items: center;
}
.method-content[b-h1xtg90pd2] {
text-align: center;
}
.hours-item[b-h1xtg90pd2] {
flex-direction: column;
text-align: center;
gap: 0.25rem;
}
.area-note[b-h1xtg90pd2] {
flex-direction: column;
text-align: center;
align-items: center;
}
.faq-grid[b-h1xtg90pd2] {
grid-template-columns: 1fr;
gap: 1.5rem;
}
}
@media (max-width: 480px) {
.contact-hero h1[b-h1xtg90pd2] {
font-size: 2rem;
}
.contact-form[b-h1xtg90pd2] {
padding: 1.5rem;
}
.form-group input[b-h1xtg90pd2],
.form-group select[b-h1xtg90pd2],
.form-group textarea[b-h1xtg90pd2] {
padding: 0.875rem 1rem;
}
.submit-btn[b-h1xtg90pd2] {
padding: 1rem 1.5rem;
font-size: 1rem;
}
.contact-method[b-h1xtg90pd2] {
padding: 1.25rem;
}
.method-icon[b-h1xtg90pd2] {
width: 50px;
height: 50px;
font-size: 1.5rem;
}
.service-hours[b-h1xtg90pd2],
.quick-facts[b-h1xtg90pd2],
.area-column[b-h1xtg90pd2] {
padding: 1.5rem;
}
.area-note[b-h1xtg90pd2] {
padding: 1.5rem;
}
.faq-item[b-h1xtg90pd2] {
padding: 1.5rem;
}
}
/* Form validation styles */
.form-group input:invalid:not(:focus):not(:placeholder-shown)[b-h1xtg90pd2],
.form-group select:invalid:not(:focus)[b-h1xtg90pd2],
.form-group textarea:invalid:not(:focus):not(:placeholder-shown)[b-h1xtg90pd2] {
border-color: var(--error-color);
background: #fff5f5;
}
.form-group input:valid:not(:placeholder-shown)[b-h1xtg90pd2],
.form-group select:valid:not([value=""])[b-h1xtg90pd2],
.form-group textarea:valid:not(:placeholder-shown)[b-h1xtg90pd2] {
border-color: var(--success-color);
}
/* Loading state for submit button */
.submit-btn:disabled[b-h1xtg90pd2] {
background: #ccc;
cursor: not-allowed;
}
.submit-btn:disabled:hover[b-h1xtg90pd2] {
transform: none;
box-shadow: none;
}
/* _content/ClearoutJunk/Components/Pages/Home.razor.rz.scp.css */
/* HOME PAGE STYLES */
/* Hero Section */
.hero-section[b-p7t76zybsn] {
background: var(--gradient-primary) !important;
background-image: url('data:image/svg+xml,');
min-height: 100vh;
display: flex;
align-items: center;
position: relative;
overflow: hidden;
width: 100vw;
margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
}
.hero-overlay[b-p7t76zybsn] {
width: 100%;
padding: var(--section-padding);
}
.hero-content[b-p7t76zybsn] {
text-align: center;
color: white;
max-width: 900px;
margin: 0 auto;
}
.hero-title[b-p7t76zybsn] {
font-size: 3.5rem;
font-weight: 700;
margin-bottom: 1.5rem;
line-height: 1.1;
}
.highlight[b-p7t76zybsn] {
background: var(--gradient-accent);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}
.hero-subtitle[b-p7t76zybsn] {
font-size: 1.3rem;
margin-bottom: 2rem;
color: rgba(255, 255, 255, 0.95);
max-width: 700px;
margin-left: auto;
margin-right: auto;
}
.hero-features[b-p7t76zybsn] {
display: flex;
justify-content: center;
gap: 2rem;
margin: 2.5rem 0;
flex-wrap: wrap;
}
.feature-badge[b-p7t76zybsn] {
background: rgba(255, 255, 255, 0.15);
backdrop-filter: blur(10px);
padding: 1rem 1.5rem;
border-radius: var(--border-radius-pill);
display: flex;
align-items: center;
gap: 0.5rem;
border: 1px solid rgba(255, 255, 255, 0.2);
}
.feature-badge .icon[b-p7t76zybsn] {
font-size: 1.2rem;
}
.cta-section[b-p7t76zybsn] {
margin: 3rem 0;
}
.phone-cta[b-p7t76zybsn] {
margin-top: 1rem;
color: rgba(255, 255, 255, 0.9);
}
.phone-number[b-p7t76zybsn] {
color: var(--accent-color);
text-decoration: none;
font-weight: 700;
font-size: 1.3rem;
margin-left: 0.5rem;
}
.trust-indicators[b-p7t76zybsn] {
display: flex;
justify-content: center;
gap: 3rem;
margin-top: 3rem;
flex-wrap: wrap;
}
.trust-item[b-p7t76zybsn] {
color: rgba(255, 255, 255, 0.9);
font-size: 1rem;
}
/* Home Sections */
.services-preview[b-p7t76zybsn], .why-choose-us[b-p7t76zybsn], .social-proof[b-p7t76zybsn], .pricing-transparency[b-p7t76zybsn], .final-cta[b-p7t76zybsn] {
padding: var(--section-padding);
width: 100vw;
margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
}
.services-preview[b-p7t76zybsn] {
background: var(--bg-light);
}
.why-choose-us[b-p7t76zybsn] {
background: white;
}
.social-proof[b-p7t76zybsn] {
background: var(--bg-light);
}
.pricing-transparency[b-p7t76zybsn] {
background: white;
}
.final-cta[b-p7t76zybsn] {
background: var(--gradient-dark);
color: white;
}
.section-header[b-p7t76zybsn] {
text-align: center;
margin-bottom: 4rem;
}
.section-header h2[b-p7t76zybsn] {
font-size: 2.5rem;
color: var(--text-primary);
margin-bottom: 1rem;
}
.pricing-subtitle[b-p7t76zybsn] {
text-align: center;
font-size: 1.2rem;
color: var(--text-muted);
margin-bottom: 4rem;
max-width: 700px;
margin-left: auto;
margin-right: auto;
line-height: 1.6;
}
/* Grids and Cards */
.services-grid[b-p7t76zybsn], .advantages-grid[b-p7t76zybsn], .testimonials-grid[b-p7t76zybsn], .pricing-cards[b-p7t76zybsn] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 2rem;
}
.service-card[b-p7t76zybsn], .testimonial-card[b-p7t76zybsn] {
background: white;
padding: 2rem;
border-radius: var(--border-radius-lg);
text-align: center;
box-shadow: var(--shadow-md);
transition: var(--transition);
border: 2px solid var(--border-light);
}
.service-card:hover[b-p7t76zybsn], .testimonial-card:hover[b-p7t76zybsn] {
transform: translateY(-5px);
box-shadow: var(--shadow-lg);
}
.service-icon[b-p7t76zybsn] {
font-size: 3rem;
margin-bottom: 1rem;
}
.service-card h3[b-p7t76zybsn] {
font-size: 1.3rem;
margin-bottom: 1rem;
color: var(--text-primary);
}
.service-card p[b-p7t76zybsn] {
color: var(--text-muted);
line-height: 1.6;
margin: 0;
}
.advantage-card[b-p7t76zybsn] {
background: var(--gradient-primary);
color: white;
padding: 2.5rem;
border-radius: var(--border-radius-lg);
position: relative;
overflow: hidden;
}
.advantage-icon[b-p7t76zybsn] {
font-size: 3rem;
margin-bottom: 1rem;
}
.advantage-card h3[b-p7t76zybsn] {
font-size: 1.4rem;
margin-bottom: 1rem;
color: white;
}
.advantage-card p[b-p7t76zybsn] {
color: rgba(255, 255, 255, 0.95);
line-height: 1.6;
}
.comparison[b-p7t76zybsn] {
margin-top: 1.5rem;
padding-top: 1.5rem;
border-top: 1px solid rgba(255, 255, 255, 0.3);
}
.us[b-p7t76zybsn] {
display: block;
color: var(--accent-color);
font-weight: 600;
}
.them[b-p7t76zybsn] {
display: block;
color: rgba(255, 255, 255, 0.7);
text-decoration: line-through;
margin-top: 0.25rem;
}
.stars[b-p7t76zybsn] {
color: var(--accent-color);
font-size: 1.2rem;
margin-bottom: 1rem;
}
.customer[b-p7t76zybsn] {
margin-top: 1.5rem;
color: var(--text-muted);
}
/* Pricing */
.pricing-card[b-p7t76zybsn] {
background: white;
border: 2px solid var(--border-light);
padding: 2.5rem;
border-radius: var(--border-radius-lg);
text-align: center;
position: relative;
transition: var(--transition);
}
.pricing-card.featured[b-p7t76zybsn] {
border-color: var(--primary-color);
transform: scale(1.05);
box-shadow: 0 20px 40px rgba(102, 126, 234, 0.2);
}
.popular-badge[b-p7t76zybsn] {
position: absolute;
top: -10px;
left: 50%;
transform: translateX(-50%);
background: var(--gradient-cta);
color: white;
padding: 0.5rem 1.5rem;
border-radius: 20px;
font-size: 0.9rem;
font-weight: 600;
}
.price[b-p7t76zybsn] {
font-size: 2.5rem;
font-weight: 700;
color: var(--primary-color);
margin-bottom: 2rem;
}
.price span[b-p7t76zybsn] {
font-size: 1rem;
color: var(--text-muted);
}
.pricing-card ul[b-p7t76zybsn] {
list-style: none;
text-align: left;
}
.pricing-card li[b-p7t76zybsn] {
padding: 0.5rem 0;
border-bottom: 1px solid var(--border-light);
}
.pricing-card li[b-p7t76zybsn]:before {
content: "✓";
color: var(--success-color);
font-weight: 600;
margin-right: 0.5rem;
}
.pricing-note[b-p7t76zybsn] {
text-align: center;
padding: 1.5rem;
background: #f0fff4;
border-radius: 10px;
border: 1px solid var(--success-color);
}
/* Final CTA */
.cta-content[b-p7t76zybsn] {
text-align: center;
max-width: 800px;
margin: 0 auto;
}
.final-cta h2[b-p7t76zybsn] {
font-size: 2.5rem;
margin-bottom: 1rem;
color: white;
}
.final-cta p[b-p7t76zybsn] {
font-size: 1.2rem;
margin-bottom: 2.5rem;
color: rgba(255, 255, 255, 0.9);
}
.cta-buttons[b-p7t76zybsn] {
display: flex;
justify-content: center;
gap: 1.5rem;
margin-bottom: 2.5rem;
flex-wrap: wrap;
}
.guarantees[b-p7t76zybsn] {
display: flex;
justify-content: center;
gap: 2rem;
flex-wrap: wrap;
}
.guarantee[b-p7t76zybsn] {
color: rgba(255, 255, 255, 0.9);
font-size: 1rem;
}
/* Home responsive */
@media (max-width: 768px) {
.hero-title[b-p7t76zybsn] {
font-size: 2.5rem;
}
.hero-features[b-p7t76zybsn] {
gap: 1rem;
}
.feature-badge[b-p7t76zybsn] {
padding: 0.8rem 1rem;
}
.trust-indicators[b-p7t76zybsn] {
gap: 1.5rem;
}
.services-grid[b-p7t76zybsn], .advantages-grid[b-p7t76zybsn], .testimonials-grid[b-p7t76zybsn], .pricing-cards[b-p7t76zybsn] {
grid-template-columns: 1fr;
}
.pricing-card.featured[b-p7t76zybsn] {
transform: none;
}
.cta-buttons[b-p7t76zybsn] {
flex-direction: column;
align-items: center;
}
.guarantees[b-p7t76zybsn] {
flex-direction: column;
align-items: center;
gap: 1rem;
}
}
@media (max-width: 480px) {
.hero-title[b-p7t76zybsn] {
font-size: 2rem;
}
h2[b-p7t76zybsn] {
font-size: 2rem;
}
.hero-subtitle[b-p7t76zybsn] {
font-size: 1.1rem;
}
}
.hero-content-wrapper[b-p7t76zybsn] {
display: flex;
align-items: center;
gap: 3rem;
min-height: 600px;
}
.hero-content[b-p7t76zybsn] {
flex: 1;
max-width: 600px;
}
.hero-images[b-p7t76zybsn] {
flex: 1;
display: flex;
flex-direction: column;
gap: 1.5rem;
max-width: 500px;
}
.hero-image-item[b-p7t76zybsn] {
position: relative;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.hero-image-item:hover[b-p7t76zybsn] {
transform: translateY(-5px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}
.truck-image[b-p7t76zybsn], .junk-image[b-p7t76zybsn] {
width: 100%;
height: auto;
display: block;
}
.image-badge[b-p7t76zybsn] {
position: absolute;
bottom: 15px;
right: 15px;
background: rgba(0, 0, 0, 0.8);
color: white;
padding: 6px 12px;
border-radius: 15px;
font-size: 0.8rem;
font-weight: 500;
backdrop-filter: blur(10px);
}
.truck-badge[b-p7t76zybsn] {
background: rgba(34, 197, 94, 0.9); /* Green for professional */
}
.junk-badge[b-p7t76zybsn] {
background: rgba(59, 130, 246, 0.9); /* Blue for capability */
}
/* Mobile responsiveness */
@media (max-width: 768px) {
.hero-content-wrapper[b-p7t76zybsn] {
flex-direction: column;
text-align: center;
gap: 2rem;
}
.hero-images[b-p7t76zybsn] {
order: -1; /* Show images above text on mobile */
max-width: 100%;
}
.hero-images[b-p7t76zybsn] {
flex-direction: row; /* Side by side on mobile to save vertical space */
gap: 1rem;
}
.hero-image-item[b-p7t76zybsn] {
flex: 1;
}
}
@media (max-width: 480px) {
.hero-images[b-p7t76zybsn] {
flex-direction: column; /* Stack vertically on very small screens */
}
}
/* _content/ClearoutJunk/Components/Pages/Pricing.razor.rz.scp.css */
/* Pricing Page Styles - Self-Contained */
/* Pricing Hero */
.pricing-hero[b-vhvhmbqrkq] {
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
padding: 120px 0 80px;
color: white;
text-align: center;
position: relative;
overflow: hidden;
}
.pricing-hero[b-vhvhmbqrkq]::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('data:image/svg+xml,') repeat-x;
background-size: 100px 100px;
}
.hero-content[b-vhvhmbqrkq] {
position: relative;
z-index: 1;
}
.pricing-hero h1[b-vhvhmbqrkq] {
font-size: 3.5rem;
font-weight: 700;
margin-bottom: 1.5rem;
color: white;
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}
.hero-subtitle[b-vhvhmbqrkq] {
font-size: 1.2rem;
max-width: 700px;
margin: 0 auto 3rem auto;
opacity: 0.95;
line-height: 1.6;
}
.hero-benefits[b-vhvhmbqrkq] {
display: flex;
justify-content: center;
gap: 40px;
margin-top: 3rem;
flex-wrap: wrap;
}
.benefit-item[b-vhvhmbqrkq] {
display: flex;
align-items: center;
gap: 12px;
background: rgba(255, 255, 255, 0.15);
backdrop-filter: blur(10px);
padding: 20px 30px;
border-radius: 25px;
border: 1px solid rgba(255, 255, 255, 0.25);
transition: all 0.3s ease;
}
.benefit-item:hover[b-vhvhmbqrkq] {
background: rgba(255, 255, 255, 0.2);
transform: translateY(-2px);
}
.benefit-icon[b-vhvhmbqrkq] {
font-size: 1.8rem;
filter: drop-shadow(0 2px 4px rgba(0,0,0,0.1));
}
/* Main Pricing Section */
.main-pricing[b-vhvhmbqrkq] {
padding: 80px 0;
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
}
.main-pricing h2[b-vhvhmbqrkq] {
text-align: center;
color: #2c5530;
font-size: 2.5rem;
margin-bottom: 1.5rem;
font-weight: 600;
}
.pricing-intro[b-vhvhmbqrkq] {
text-align: center;
font-size: 1.2rem;
color: #666;
margin-bottom: 4rem;
max-width: 900px;
margin-left: auto;
margin-right: auto;
line-height: 1.7;
}
.pricing-tiers[b-vhvhmbqrkq] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
gap: 30px;
margin-bottom: 4rem;
max-width: 1600px;
margin-left: auto;
margin-right: auto;
}
.pricing-tier[b-vhvhmbqrkq] {
background: white;
border: 3px solid #e2e8f0;
border-radius: 20px;
padding: 30px;
text-align: center;
transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
position: relative;
display: flex;
flex-direction: column;
overflow: hidden;
}
.pricing-tier[b-vhvhmbqrkq]::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 4px;
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
opacity: 0;
transition: all 0.3s ease;
}
.pricing-tier:hover[b-vhvhmbqrkq] {
transform: translateY(-8px);
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15);
border-color: #4a7c59;
}
.pricing-tier:hover[b-vhvhmbqrkq]::before {
opacity: 1;
}
.pricing-tier.featured[b-vhvhmbqrkq] {
border-color: #4a7c59;
transform: scale(1.05);
box-shadow: 0 30px 60px rgba(74, 124, 89, 0.25);
background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
}
.pricing-tier.featured[b-vhvhmbqrkq]::before {
opacity: 1;
background: linear-gradient(135deg, #ff6b35 0%, #e55a2b 100%);
}
.pricing-tier.featured:hover[b-vhvhmbqrkq] {
transform: scale(1.05) translateY(-5px);
}
.popular-badge[b-vhvhmbqrkq] {
position: absolute;
top: -15px;
left: 50%;
transform: translateX(-50%);
background: linear-gradient(135deg, #ff6b35 0%, #e55a2b 100%);
color: white;
padding: 8px 20px;
border-radius: 20px;
font-size: 0.85rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3);
}
.tier-header[b-vhvhmbqrkq] {
margin-bottom: 2rem;
position: relative;
}
.tier-header h3[b-vhvhmbqrkq] {
color: #2c5530;
font-size: 1.75rem;
margin-bottom: 0.75rem;
font-weight: 700;
}
.tier-volume[b-vhvhmbqrkq] {
color: #666;
font-size: 1rem;
margin-bottom: 1.5rem;
background: #f8f9fa;
padding: 8px 16px;
border-radius: 25px;
display: inline-block;
}
.tier-price[b-vhvhmbqrkq] {
margin-bottom: 1.5rem;
position: relative;
}
.tier-price .price[b-vhvhmbqrkq] {
font-size: 3.5rem;
font-weight: 800;
color: #4a7c59;
display: block;
line-height: 1;
}
.price-note[b-vhvhmbqrkq] {
color: #666;
font-size: 0.95rem;
font-weight: 500;
margin-top: 0.5rem;
}
.tier-content[b-vhvhmbqrkq] {
flex-grow: 1;
margin-bottom: 2rem;
}
.tier-description[b-vhvhmbqrkq] {
color: #555;
line-height: 1.7;
margin-bottom: 2rem;
font-size: 1.05rem;
}
.tier-includes[b-vhvhmbqrkq] {
list-style: none;
text-align: left;
margin-bottom: 2rem;
background: #f8f9fa;
padding: 20px;
border-radius: 12px;
padding-left: 0;
}
.tier-includes li[b-vhvhmbqrkq] {
padding: 12px 20px;
color: #555;
border-bottom: 1px solid #e2e8f0;
font-weight: 500;
display: flex;
align-items: center;
}
.tier-includes li:last-child[b-vhvhmbqrkq] {
border-bottom: none;
}
.tier-includes li[b-vhvhmbqrkq]::before {
content: "✓";
color: #48bb78;
font-weight: 700;
margin-right: 12px;
background: #f0fff4;
width: 24px;
height: 24px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.8rem;
flex-shrink: 0;
}
.tier-examples[b-vhvhmbqrkq] {
background: linear-gradient(135deg, #e6f3ff 0%, #f0f8ff 100%);
padding: 20px;
border-radius: 12px;
font-size: 0.95rem;
color: #555;
text-align: left;
border-left: 4px solid #4a7c59;
margin-top: 1rem;
}
.tier-examples strong[b-vhvhmbqrkq] {
color: #2c5530;
display: block;
margin-bottom: 0.5rem;
}
.pricing-tier .btn[b-vhvhmbqrkq] {
padding: 14px 28px;
font-size: 1rem;
font-weight: 600;
border: none;
border-radius: 25px;
cursor: pointer;
text-decoration: none;
text-align: center;
transition: all 0.3s ease;
margin-top: auto;
}
.pricing-tier .btn-primary[b-vhvhmbqrkq] {
background: linear-gradient(135deg, #ff6b35 0%, #e55a2b 100%);
color: white;
box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3);
}
.pricing-tier .btn-primary:hover[b-vhvhmbqrkq] {
background: #e55a2b;
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(255, 107, 53, 0.4);
}
.pricing-tier .btn-outline[b-vhvhmbqrkq] {
background: transparent;
color: #4a7c59;
border: 2px solid #4a7c59;
}
.pricing-tier .btn-outline:hover[b-vhvhmbqrkq] {
background: #4a7c59;
color: white;
transform: translateY(-2px);
}
.pricing-note[b-vhvhmbqrkq] {
display: flex;
align-items: flex-start;
gap: 20px;
background: linear-gradient(135deg, #e6f3ff 0%, #f0f8ff 100%);
padding: 30px;
border-radius: 20px;
border: 2px solid #4a7c59;
box-shadow: 0 10px 25px rgba(74, 124, 89, 0.1);
}
.note-icon[b-vhvhmbqrkq] {
font-size: 2.5rem;
flex-shrink: 0;
filter: drop-shadow(0 2px 4px rgba(0,0,0,0.1));
}
.note-content[b-vhvhmbqrkq] {
color: #555;
line-height: 1.6;
font-size: 1.05rem;
}
.note-content strong[b-vhvhmbqrkq] {
color: #2c5530;
}
/* Service Add-ons */
.service-addons[b-vhvhmbqrkq] {
padding: 80px 0;
background: white;
}
.service-addons h2[b-vhvhmbqrkq] {
text-align: center;
color: #2c5530;
font-size: 2.5rem;
margin-bottom: 1.5rem;
font-weight: 600;
}
.section-intro[b-vhvhmbqrkq] {
text-align: center;
font-size: 1.15rem;
color: #666;
margin-bottom: 3rem;
max-width: 800px;
margin-left: auto;
margin-right: auto;
line-height: 1.6;
}
.addons-grid[b-vhvhmbqrkq] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 30px;
}
.addon-item[b-vhvhmbqrkq] {
background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
padding: 30px;
border-radius: 20px;
text-align: center;
transition: all 0.4s ease;
border: 2px solid transparent;
position: relative;
overflow: hidden;
}
.addon-item[b-vhvhmbqrkq]::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
transition: left 0.5s ease;
}
.addon-item:hover[b-vhvhmbqrkq] {
transform: translateY(-5px);
border-color: #4a7c59;
box-shadow: 0 20px 40px rgba(74, 124, 89, 0.15);
}
.addon-item:hover[b-vhvhmbqrkq]::before {
left: 100%;
}
.addon-icon[b-vhvhmbqrkq] {
font-size: 3.5rem;
margin-bottom: 1.5rem;
filter: drop-shadow(0 4px 8px rgba(0,0,0,0.1));
}
.addon-item h3[b-vhvhmbqrkq] {
color: #2c5530;
margin-bottom: 1.25rem;
font-size: 1.3rem;
font-weight: 600;
}
.addon-item p[b-vhvhmbqrkq] {
color: #666;
margin-bottom: 1.5rem;
line-height: 1.6;
font-size: 1.05rem;
}
.addon-price[b-vhvhmbqrkq] {
font-size: 1.4rem;
font-weight: 700;
color: #4a7c59;
}
/* Pricing Calculator */
.pricing-calculator[b-vhvhmbqrkq] {
padding: 80px 0;
background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
}
.pricing-calculator h2[b-vhvhmbqrkq] {
text-align: center;
color: #2c5530;
font-size: 2.5rem;
margin-bottom: 1.5rem;
font-weight: 600;
}
.calculator-intro[b-vhvhmbqrkq] {
text-align: center;
color: #666;
margin-bottom: 3rem;
max-width: 700px;
margin-left: auto;
margin-right: auto;
font-size: 1.1rem;
line-height: 1.6;
}
.calculator-container[b-vhvhmbqrkq] {
display: grid;
grid-template-columns: 2fr 1fr;
gap: 40px;
background: white;
padding: 40px;
border-radius: 20px;
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
border: 1px solid #e2e8f0;
}
.calculator-form h3[b-vhvhmbqrkq],
.calculator-results h3[b-vhvhmbqrkq] {
color: #2c5530;
margin-bottom: 2rem;
padding-bottom: 1rem;
border-bottom: 3px solid #4a7c59;
font-size: 1.5rem;
font-weight: 600;
}
.item-categories[b-vhvhmbqrkq] {
display: grid;
gap: 30px;
margin-bottom: 3rem;
}
.category-section[b-vhvhmbqrkq] {
background: #f8f9fa;
padding: 20px;
border-radius: 12px;
border-left: 4px solid #4a7c59;
}
.category-section h4[b-vhvhmbqrkq] {
color: #2c5530;
margin-bottom: 1.5rem;
font-size: 1.2rem;
font-weight: 600;
}
.item-checkboxes[b-vhvhmbqrkq] {
display: grid;
gap: 12px;
}
.item-checkbox[b-vhvhmbqrkq] {
display: flex;
align-items: center;
padding: 15px 20px;
background: white;
border-radius: 12px;
cursor: pointer;
transition: all 0.3s ease;
justify-content: space-between;
border: 2px solid transparent;
box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}
.item-checkbox:hover[b-vhvhmbqrkq] {
background: #e6f3ff;
border-color: #4a7c59;
transform: translateX(5px);
}
.item-checkbox input[type="checkbox"][b-vhvhmbqrkq] {
margin-right: 15px;
width: 18px;
height: 18px;
accent-color: #4a7c59;
}
.item-checkbox input[type="checkbox"]:checked + .checkmark + .item-name[b-vhvhmbqrkq] {
color: #4a7c59;
font-weight: 600;
}
.item-name[b-vhvhmbqrkq] {
flex-grow: 1;
color: #555;
font-weight: 500;
transition: all 0.3s ease;
}
.item-price[b-vhvhmbqrkq] {
font-weight: 700;
color: #4a7c59;
font-size: 1.1rem;
}
.calculator-form .btn-secondary[b-vhvhmbqrkq] {
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
padding: 14px 28px;
border: none;
border-radius: 25px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
box-shadow: 0 4px 15px rgba(74, 124, 89, 0.3);
}
.calculator-form .btn-secondary:hover[b-vhvhmbqrkq] {
background: #2c5530;
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(74, 124, 89, 0.4);
}
.calculator-results[b-vhvhmbqrkq] {
background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
padding: 30px;
border-radius: 20px;
height: fit-content;
position: sticky;
top: 2rem;
border: 2px solid #e2e8f0;
}
.selected-items[b-vhvhmbqrkq] {
margin-bottom: 2rem;
max-height: 250px;
overflow-y: auto;
background: white;
padding: 15px;
border-radius: 12px;
border: 1px solid #e2e8f0;
}
.selected-item[b-vhvhmbqrkq] {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px 0;
border-bottom: 1px solid #e2e8f0;
}
.selected-item:last-child[b-vhvhmbqrkq] {
border-bottom: none;
}
.selected-item .item-name[b-vhvhmbqrkq] {
color: #555;
font-weight: 500;
}
.selected-item .item-price[b-vhvhmbqrkq] {
color: #4a7c59;
font-weight: 700;
}
.no-items[b-vhvhmbqrkq] {
color: #666;
font-style: italic;
text-align: center;
padding: 2rem;
}
.estimate-total[b-vhvhmbqrkq] {
background: white;
padding: 20px;
border-radius: 12px;
margin-bottom: 1.5rem;
border: 2px solid #4a7c59;
box-shadow: 0 5px 15px rgba(74, 124, 89, 0.1);
}
.subtotal[b-vhvhmbqrkq],
.base-fee[b-vhvhmbqrkq] {
display: flex;
justify-content: space-between;
padding: 12px 0;
color: #555;
font-weight: 500;
border-bottom: 1px solid #e2e8f0;
}
.total[b-vhvhmbqrkq] {
display: flex;
justify-content: space-between;
padding: 15px 0;
border-top: 3px solid #4a7c59;
font-weight: 700;
font-size: 1.4rem;
color: #2c5530;
margin-top: 0.5rem;
}
.estimate-note[b-vhvhmbqrkq] {
background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
padding: 20px;
border-radius: 12px;
margin-bottom: 2rem;
border: 2px solid #ffc107;
border-left: 5px solid #ff6b35;
}
.estimate-note p[b-vhvhmbqrkq] {
color: #856404;
font-size: 0.95rem;
margin: 0;
line-height: 1.5;
font-weight: 500;
}
.calculator-results .btn-large[b-vhvhmbqrkq] {
width: 100%;
padding: 18px;
font-size: 1.1rem;
}
/* Pricing FAQ */
.pricing-faq[b-vhvhmbqrkq] {
padding: 80px 0;
background: white;
}
.pricing-faq h2[b-vhvhmbqrkq] {
text-align: center;
color: #2c5530;
font-size: 2.5rem;
margin-bottom: 3rem;
font-weight: 600;
}
.faq-grid[b-vhvhmbqrkq] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
gap: 30px;
}
.faq-item[b-vhvhmbqrkq] {
background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
padding: 30px;
border-radius: 20px;
transition: all 0.4s ease;
border: 2px solid transparent;
position: relative;
overflow: hidden;
}
.faq-item[b-vhvhmbqrkq]::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 4px;
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
transform: scaleX(0);
transition: transform 0.3s ease;
}
.faq-item:hover[b-vhvhmbqrkq] {
transform: translateY(-5px);
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
border-color: #4a7c59;
}
.faq-item:hover[b-vhvhmbqrkq]::before {
transform: scaleX(1);
}
.faq-item h3[b-vhvhmbqrkq] {
color: #2c5530;
margin-bottom: 1.5rem;
font-size: 1.3rem;
font-weight: 600;
line-height: 1.3;
}
.faq-item p[b-vhvhmbqrkq] {
color: #555;
line-height: 1.7;
margin: 0;
font-size: 1.05rem;
}
/* Pricing Guarantee */
.pricing-guarantee[b-vhvhmbqrkq] {
padding: 80px 0;
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
position: relative;
overflow: hidden;
}
.pricing-guarantee[b-vhvhmbqrkq]::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('data:image/svg+xml,');
}
.guarantee-content[b-vhvhmbqrkq] {
position: relative;
z-index: 1;
}
.guarantee-content h2[b-vhvhmbqrkq] {
text-align: center;
color: white;
margin-bottom: 4rem;
font-size: 2.5rem;
font-weight: 700;
}
.guarantee-points[b-vhvhmbqrkq] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
gap: 40px;
}
.guarantee-point[b-vhvhmbqrkq] {
text-align: center;
padding: 40px 30px;
background: rgba(255, 255, 255, 0.1);
backdrop-filter: blur(10px);
border-radius: 20px;
border: 2px solid rgba(255, 255, 255, 0.2);
transition: all 0.4s ease;
position: relative;
overflow: hidden;
}
.guarantee-point[b-vhvhmbqrkq]::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);
transition: left 0.6s ease;
}
.guarantee-point:hover[b-vhvhmbqrkq] {
transform: translateY(-5px);
background: rgba(255, 255, 255, 0.15);
border-color: rgba(255, 255, 255, 0.4);
}
.guarantee-point:hover[b-vhvhmbqrkq]::before {
left: 100%;
}
.guarantee-icon[b-vhvhmbqrkq] {
font-size: 4rem;
margin-bottom: 1.5rem;
filter: drop-shadow(0 4px 8px rgba(0,0,0,0.2));
}
.guarantee-point h3[b-vhvhmbqrkq] {
color: white;
margin-bottom: 1.5rem;
font-size: 1.4rem;
font-weight: 600;
}
.guarantee-point p[b-vhvhmbqrkq] {
color: rgba(255, 255, 255, 0.9);
line-height: 1.7;
margin: 0;
font-size: 1.05rem;
}
/* Pricing CTA */
.pricing-cta[b-vhvhmbqrkq] {
padding: 80px 0;
background: linear-gradient(135deg, #2d3748 0%, #4a5568 100%);
color: white;
text-align: center;
}
.pricing-cta h2[b-vhvhmbqrkq] {
color: white;
font-size: 2.5rem;
margin-bottom: 1.5rem;
font-weight: 700;
}
.pricing-cta p[b-vhvhmbqrkq] {
font-size: 1.3rem;
margin-bottom: 3rem;
max-width: 700px;
margin-left: auto;
margin-right: auto;
opacity: 0.95;
color: white;
}
.cta-buttons[b-vhvhmbqrkq] {
display: flex;
justify-content: center;
gap: 20px;
flex-wrap: wrap;
}
.cta-buttons .btn[b-vhvhmbqrkq] {
padding: 18px 40px;
font-size: 1.2rem;
font-weight: 600;
border-radius: 25px;
text-decoration: none;
transition: all 0.3s ease;
}
.cta-buttons .btn-primary[b-vhvhmbqrkq] {
background: linear-gradient(135deg, #ff6b35 0%, #e55a2b 100%);
color: white;
border: none;
box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3);
}
.cta-buttons .btn-primary:hover[b-vhvhmbqrkq] {
background: #e55a2b;
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(255, 107, 53, 0.4);
}
.cta-buttons .btn-secondary[b-vhvhmbqrkq] {
background: transparent;
color: white;
border: 2px solid white;
}
.cta-buttons .btn-secondary:hover[b-vhvhmbqrkq] {
background: white;
color: #2c5530;
transform: translateY(-2px);
}
/* Responsive Design */
@media (max-width: 1024px) {
.calculator-container[b-vhvhmbqrkq] {
grid-template-columns: 1fr;
gap: 30px;
}
.calculator-results[b-vhvhmbqrkq] {
position: static;
}
.pricing-tiers[b-vhvhmbqrkq] {
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 25px;
}
.pricing-tier.featured[b-vhvhmbqrkq] {
transform: none;
}
.guarantee-points[b-vhvhmbqrkq] {
grid-template-columns: 1fr;
gap: 30px;
}
}
@media (max-width: 768px) {
.pricing-hero[b-vhvhmbqrkq] {
padding: 80px 0 60px;
}
.pricing-hero h1[b-vhvhmbqrkq] {
font-size: 2.5rem;
}
.hero-benefits[b-vhvhmbqrkq] {
gap: 20px;
flex-direction: column;
align-items: center;
}
.benefit-item[b-vhvhmbqrkq] {
padding: 15px 25px;
font-size: 0.9rem;
}
.pricing-tiers[b-vhvhmbqrkq] {
grid-template-columns: 1fr;
gap: 20px;
}
.tier-price .price[b-vhvhmbqrkq] {
font-size: 2.8rem;
}
.addons-grid[b-vhvhmbqrkq] {
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 25px;
}
.faq-grid[b-vhvhmbqrkq] {
grid-template-columns: 1fr;
gap: 25px;
}
.calculator-container[b-vhvhmbqrkq] {
padding: 30px;
}
.category-section[b-vhvhmbqrkq] {
padding: 15px;
}
.item-checkbox[b-vhvhmbqrkq] {
padding: 12px 15px;
}
.guarantee-point[b-vhvhmbqrkq] {
padding: 30px 25px;
}
.guarantee-icon[b-vhvhmbqrkq] {
font-size: 3rem;
}
.cta-buttons[b-vhvhmbqrkq] {
flex-direction: column;
align-items: center;
}
.cta-buttons .btn[b-vhvhmbqrkq] {
width: 100%;
max-width: 300px;
}
}
@media (max-width: 480px) {
.pricing-hero[b-vhvhmbqrkq] {
padding: 60px 0 40px;
}
.pricing-hero h1[b-vhvhmbqrkq] {
font-size: 2rem;
}
.main-pricing[b-vhvhmbqrkq],
.service-addons[b-vhvhmbqrkq],
.pricing-calculator[b-vhvhmbqrkq],
.pricing-faq[b-vhvhmbqrkq],
.pricing-guarantee[b-vhvhmbqrkq],
.pricing-cta[b-vhvhmbqrkq] {
padding: 60px 0;
}
.tier-header h3[b-vhvhmbqrkq] {
font-size: 1.5rem;
}
.tier-price .price[b-vhvhmbqrkq] {
font-size: 2.5rem;
}
.calculator-container[b-vhvhmbqrkq] {
padding: 20px;
}
.estimate-total[b-vhvhmbqrkq] {
padding: 15px;
}
.total[b-vhvhmbqrkq] {
font-size: 1.2rem;
}
.addon-item[b-vhvhmbqrkq] {
padding: 25px 20px;
}
.addon-icon[b-vhvhmbqrkq] {
font-size: 3rem;
}
.faq-item[b-vhvhmbqrkq] {
padding: 25px 20px;
}
.guarantee-content h2[b-vhvhmbqrkq] {
font-size: 2rem;
}
.guarantee-point[b-vhvhmbqrkq] {
padding: 25px 20px;
}
.pricing-cta h2[b-vhvhmbqrkq] {
font-size: 2rem;
}
}
/* _content/ClearoutJunk/Components/Pages/PrivacyPolicy.razor.rz.scp.css */
/* Privacy Policy Page Styles */
/* Reset and Base Styles for Privacy Page */
.privacy-page *[b-grtpfj9zjh] {
margin: 0;
padding: 0;
box-sizing: border-box;
}
.privacy-page[b-grtpfj9zjh] {
font-family: 'Arial', sans-serif;
line-height: 1.6;
color: #333;
background-color: #ffffff;
}
.privacy-page .container[b-grtpfj9zjh] {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}
/* Typography */
.privacy-page h1[b-grtpfj9zjh] {
font-size: 3rem;
color: #2c5530;
font-weight: 700;
margin-bottom: 1rem;
}
.privacy-page h2[b-grtpfj9zjh] {
font-size: 2rem;
color: #2c5530;
font-weight: 600;
margin-bottom: 1.5rem;
border-bottom: 3px solid #4a7c59;
padding-bottom: 0.5rem;
}
.privacy-page h3[b-grtpfj9zjh] {
font-size: 1.5rem;
color: #2c5530;
font-weight: 600;
margin: 2rem 0 1rem 0;
}
.privacy-page h4[b-grtpfj9zjh] {
font-size: 1.2rem;
color: #2c5530;
font-weight: 600;
margin: 1.5rem 0 0.75rem 0;
}
.privacy-page p[b-grtpfj9zjh] {
margin-bottom: 1rem;
font-size: 1.1rem;
line-height: 1.7;
}
.privacy-page ul[b-grtpfj9zjh], .privacy-page ol[b-grtpfj9zjh] {
margin: 1rem 0 1rem 2rem;
}
.privacy-page li[b-grtpfj9zjh] {
margin-bottom: 0.5rem;
font-size: 1rem;
line-height: 1.6;
}
/* Hero Section */
.privacy-hero[b-grtpfj9zjh] {
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
padding: 80px 0;
text-align: center;
position: relative;
overflow: hidden;
}
.privacy-hero[b-grtpfj9zjh]::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('data:image/svg+xml,') repeat-x;
background-size: 100px 100px;
}
.hero-content[b-grtpfj9zjh] {
position: relative;
z-index: 1;
}
.privacy-hero h1[b-grtpfj9zjh] {
color: white;
font-size: 3.5rem;
margin-bottom: 1.5rem;
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}
.hero-subtitle[b-grtpfj9zjh] {
font-size: 1.2rem;
max-width: 700px;
margin: 0 auto 2.5rem auto;
opacity: 0.95;
line-height: 1.6;
}
.privacy-highlights[b-grtpfj9zjh] {
display: flex;
justify-content: center;
gap: 40px;
margin-bottom: 2rem;
flex-wrap: wrap;
}
.highlight-item[b-grtpfj9zjh] {
display: flex;
align-items: center;
gap: 10px;
background: rgba(255,255,255,0.1);
padding: 15px 25px;
border-radius: 25px;
backdrop-filter: blur(10px);
border: 1px solid rgba(255,255,255,0.2);
}
.highlight-icon[b-grtpfj9zjh] {
font-size: 1.5rem;
}
.last-updated[b-grtpfj9zjh] {
background: rgba(255,255,255,0.15);
padding: 12px 20px;
border-radius: 20px;
font-size: 0.9rem;
display: inline-block;
margin-top: 1rem;
backdrop-filter: blur(10px);
border: 1px solid rgba(255,255,255,0.2);
}
/* Privacy Content Layout */
.privacy-content[b-grtpfj9zjh] {
padding: 60px 0;
background-color: #f8f9fa;
}
.privacy-layout[b-grtpfj9zjh] {
display: grid;
grid-template-columns: 280px 1fr;
gap: 60px;
align-items: start;
}
/* Sidebar Table of Contents */
.privacy-sidebar[b-grtpfj9zjh] {
position: sticky;
top: 100px;
}
.toc-container[b-grtpfj9zjh] {
background: white;
padding: 30px;
border-radius: 15px;
box-shadow: 0 5px 20px rgba(0,0,0,0.1);
border: 2px solid #f1f3f4;
}
.toc-container h3[b-grtpfj9zjh] {
color: #2c5530;
font-size: 1.3rem;
margin-bottom: 1.5rem;
text-align: center;
border-bottom: 2px solid #4a7c59;
padding-bottom: 0.75rem;
}
.toc-nav[b-grtpfj9zjh] {
display: flex;
flex-direction: column;
gap: 8px;
}
.toc-link[b-grtpfj9zjh] {
color: #666;
text-decoration: none;
padding: 12px 15px;
border-radius: 8px;
transition: all 0.3s ease;
font-size: 0.95rem;
border-left: 3px solid transparent;
}
.toc-link:hover[b-grtpfj9zjh] {
background-color: #f8f9fa;
color: #2c5530;
border-left-color: #4a7c59;
transform: translateX(5px);
}
/* Main Content */
.privacy-main[b-grtpfj9zjh] {
background: white;
border-radius: 20px;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
overflow: hidden;
}
/* Privacy Summary */
.privacy-summary[b-grtpfj9zjh] {
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
padding: 40px;
margin-bottom: 0;
color: white;
}
.privacy-summary h3[b-grtpfj9zjh] {
color: white;
font-size: 1.8rem;
margin-bottom: 1.5rem;
text-align: center;
}
.privacy-summary p[b-grtpfj9zjh] {
font-size: 1.1rem;
margin-bottom: 2rem;
text-align: center;
opacity: 0.95;
color: white;
}
.summary-points[b-grtpfj9zjh] {
display: grid;
gap: 15px;
}
.summary-point[b-grtpfj9zjh] {
background: rgba(255,255,255,0.1);
padding: 20px;
border-radius: 10px;
backdrop-filter: blur(10px);
border: 1px solid rgba(255,255,255,0.2);
}
.summary-point strong[b-grtpfj9zjh] {
color: white;
font-weight: 600;
}
/* Privacy Sections */
.privacy-section[b-grtpfj9zjh] {
padding: 40px;
border-bottom: 1px solid #e9ecef;
}
.privacy-section:last-child[b-grtpfj9zjh] {
border-bottom: none;
}
.section-content[b-grtpfj9zjh] {
max-width: none;
}
/* Information Categories Grid */
.info-categories[b-grtpfj9zjh] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 25px;
margin: 2rem 0;
}
.info-category[b-grtpfj9zjh] {
background: #f8f9fa;
padding: 25px;
border-radius: 12px;
border-left: 4px solid #4a7c59;
}
.info-category h4[b-grtpfj9zjh] {
color: #2c5530;
margin-top: 0;
margin-bottom: 1rem;
}
.info-category ul[b-grtpfj9zjh] {
margin: 0;
padding-left: 1.5rem;
}
.info-category li[b-grtpfj9zjh] {
color: #555;
margin-bottom: 0.5rem;
}
/* Usage Grid */
.usage-grid[b-grtpfj9zjh] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 30px;
margin: 2rem 0;
}
.usage-item[b-grtpfj9zjh] {
background: #f8f9fa;
padding: 30px;
border-radius: 15px;
text-align: center;
transition: transform 0.3s ease;
border: 2px solid transparent;
}
.usage-item:hover[b-grtpfj9zjh] {
transform: translateY(-5px);
border-color: #4a7c59;
box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}
.usage-icon[b-grtpfj9zjh] {
font-size: 3rem;
margin-bottom: 1rem;
display: block;
}
.usage-item h4[b-grtpfj9zjh] {
color: #2c5530;
margin-bottom: 1rem;
text-align: center;
}
.usage-item ul[b-grtpfj9zjh] {
text-align: left;
margin: 0;
padding-left: 1.5rem;
}
/* Sharing Promise */
.sharing-promise[b-grtpfj9zjh] {
background: linear-gradient(135deg, #e8f5e8 0%, #d4edda 100%);
padding: 25px;
border-radius: 12px;
text-align: center;
margin: 2rem 0;
border: 2px solid #4a7c59;
}
.sharing-promise h4[b-grtpfj9zjh] {
color: #2c5530;
font-size: 1.3rem;
margin-bottom: 1rem;
}
.sharing-promise p[b-grtpfj9zjh] {
color: #2c5530;
font-size: 1.1rem;
margin: 0;
}
/* Security Measures */
.security-measures[b-grtpfj9zjh] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 25px;
margin: 2rem 0;
}
.security-item[b-grtpfj9zjh] {
background: #f8f9fa;
padding: 25px;
border-radius: 12px;
text-align: center;
border: 2px solid transparent;
transition: all 0.3s ease;
}
.security-item:hover[b-grtpfj9zjh] {
border-color: #4a7c59;
transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}
.security-icon[b-grtpfj9zjh] {
font-size: 2.5rem;
margin-bottom: 1rem;
display: block;
}
.security-item h4[b-grtpfj9zjh] {
color: #2c5530;
margin-bottom: 1rem;
}
.security-item p[b-grtpfj9zjh] {
color: #666;
font-size: 1rem;
margin: 0;
}
.security-note[b-grtpfj9zjh] {
background: #fff3cd;
border: 1px solid #ffeaa7;
padding: 20px;
border-radius: 10px;
margin-top: 2rem;
}
.security-note p[b-grtpfj9zjh] {
color: #856404;
margin: 0;
}
/* Cookies Section */
.cookies-grid[b-grtpfj9zjh] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 25px;
margin: 2rem 0;
}
.cookie-type[b-grtpfj9zjh] {
background: #f8f9fa;
padding: 25px;
border-radius: 12px;
border-left: 4px solid #4a7c59;
}
.cookie-type h4[b-grtpfj9zjh] {
color: #2c5530;
margin-bottom: 1rem;
}
.cookie-examples[b-grtpfj9zjh] {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 1rem;
}
.cookie-examples span[b-grtpfj9zjh] {
background: #e9ecef;
padding: 4px 12px;
border-radius: 15px;
font-size: 0.9rem;
color: #495057;
}
.cookie-controls[b-grtpfj9zjh] {
text-align: center;
margin-top: 2rem;
}
/* Rights Grid */
.rights-grid[b-grtpfj9zjh] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 25px;
margin: 2rem 0;
}
.right-item[b-grtpfj9zjh] {
background: #f8f9fa;
padding: 25px;
border-radius: 12px;
text-align: center;
transition: transform 0.3s ease;
border: 2px solid transparent;
}
.right-item:hover[b-grtpfj9zjh] {
transform: translateY(-3px);
border-color: #4a7c59;
box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}
.right-icon[b-grtpfj9zjh] {
font-size: 2.5rem;
margin-bottom: 1rem;
display: block;
}
.right-item h4[b-grtpfj9zjh] {
color: #2c5530;
margin-bottom: 1rem;
}
.right-item p[b-grtpfj9zjh] {
color: #666;
font-size: 1rem;
margin: 0;
}
.rights-request[b-grtpfj9zjh] {
background: linear-gradient(135deg, #e8f5e8 0%, #d4edda 100%);
padding: 30px;
border-radius: 15px;
margin-top: 3rem;
text-align: center;
border: 2px solid #4a7c59;
}
.rights-request h4[b-grtpfj9zjh] {
color: #2c5530;
margin-bottom: 1rem;
}
.rights-actions[b-grtpfj9zjh] {
display: flex;
justify-content: center;
gap: 15px;
margin-top: 2rem;
flex-wrap: wrap;
}
/* Data Retention */
.retention-schedule[b-grtpfj9zjh] {
display: grid;
gap: 20px;
margin: 2rem 0;
}
.retention-item[b-grtpfj9zjh] {
background: #f8f9fa;
padding: 25px;
border-radius: 12px;
border-left: 4px solid #4a7c59;
}
.retention-item h4[b-grtpfj9zjh] {
color: #2c5530;
margin-bottom: 1rem;
}
.retention-item p[b-grtpfj9zjh] {
margin-bottom: 0.5rem;
color: #666;
}
/* Third Party Services */
.third-party-services[b-grtpfj9zjh] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 25px;
margin: 2rem 0;
}
.service-category[b-grtpfj9zjh] {
background: #f8f9fa;
padding: 25px;
border-radius: 12px;
border-left: 4px solid #4a7c59;
}
.service-category h4[b-grtpfj9zjh] {
color: #2c5530;
margin-bottom: 1rem;
}
.service-category ul[b-grtpfj9zjh] {
margin: 0;
padding-left: 1.5rem;
}
/* Contact Methods */
.contact-methods[b-grtpfj9zjh] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 30px;
margin: 2rem 0;
}
.contact-method[b-grtpfj9zjh] {
background: #f8f9fa;
padding: 30px;
border-radius: 15px;
border-left: 4px solid #4a7c59;
}
.contact-method h4[b-grtpfj9zjh] {
color: #2c5530;
margin-bottom: 1rem;
}
.contact-method a[b-grtpfj9zjh] {
color: #4a7c59;
text-decoration: none;
}
.contact-method a:hover[b-grtpfj9zjh] {
text-decoration: underline;
}
.contact-form-link[b-grtpfj9zjh] {
text-align: center;
margin-top: 2rem;
}
/* Buttons */
.privacy-page .btn[b-grtpfj9zjh] {
padding: 14px 28px;
font-size: 1rem;
font-weight: 600;
border: none;
border-radius: 25px;
cursor: pointer;
text-decoration: none;
display: inline-block;
transition: all 0.3s ease;
text-align: center;
}
.privacy-page .btn-primary[b-grtpfj9zjh] {
background: #4a7c59;
color: white;
box-shadow: 0 4px 15px rgba(74, 124, 89, 0.3);
}
.privacy-page .btn-primary:hover[b-grtpfj9zjh] {
background: #3d6249;
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(74, 124, 89, 0.4);
}
.privacy-page .btn-secondary[b-grtpfj9zjh] {
background: transparent;
color: #4a7c59;
border: 2px solid #4a7c59;
}
.privacy-page .btn-secondary:hover[b-grtpfj9zjh] {
background: #4a7c59;
color: white;
transform: translateY(-2px);
}
/* Privacy CTA Section */
.privacy-cta[b-grtpfj9zjh] {
padding: 80px 0;
background: linear-gradient(135deg, #2c5530 0%, #1a3d1f 100%);
color: white;
text-align: center;
}
.privacy-cta h2[b-grtpfj9zjh] {
color: white;
font-size: 2.5rem;
margin-bottom: 1.5rem;
border: none;
padding: 0;
}
.privacy-cta p[b-grtpfj9zjh] {
font-size: 1.2rem;
margin-bottom: 2.5rem;
opacity: 0.95;
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
.cta-buttons[b-grtpfj9zjh] {
display: flex;
justify-content: center;
gap: 20px;
flex-wrap: wrap;
}
.privacy-cta .btn-primary[b-grtpfj9zjh] {
background: #ff6b35;
box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3);
}
.privacy-cta .btn-primary:hover[b-grtpfj9zjh] {
background: #e55a2b;
box-shadow: 0 8px 25px rgba(255, 107, 53, 0.4);
}
.privacy-cta .btn-secondary[b-grtpfj9zjh] {
background: transparent;
color: white;
border: 2px solid white;
}
.privacy-cta .btn-secondary:hover[b-grtpfj9zjh] {
background: white;
color: #2c5530;
}
/* Responsive Design */
@media (max-width: 1024px) {
.privacy-layout[b-grtpfj9zjh] {
grid-template-columns: 250px 1fr;
gap: 40px;
}
.privacy-sidebar[b-grtpfj9zjh] {
position: static;
}
}
@media (max-width: 768px) {
.privacy-page .container[b-grtpfj9zjh] {
padding: 0 15px;
}
.privacy-hero h1[b-grtpfj9zjh] {
font-size: 2.5rem;
}
.hero-subtitle[b-grtpfj9zjh] {
font-size: 1.1rem;
}
.privacy-highlights[b-grtpfj9zjh] {
flex-direction: column;
align-items: center;
gap: 15px;
}
.privacy-layout[b-grtpfj9zjh] {
grid-template-columns: 1fr;
gap: 30px;
}
.toc-container[b-grtpfj9zjh] {
padding: 20px;
}
.privacy-section[b-grtpfj9zjh] {
padding: 30px 25px;
}
.info-categories[b-grtpfj9zjh],
.usage-grid[b-grtpfj9zjh],
.security-measures[b-grtpfj9zjh],
.cookies-grid[b-grtpfj9zjh],
.rights-grid[b-grtpfj9zjh],
.contact-methods[b-grtpfj9zjh],
.third-party-services[b-grtpfj9zjh] {
grid-template-columns: 1fr;
gap: 20px;
}
.rights-actions[b-grtpfj9zjh],
.cta-buttons[b-grtpfj9zjh] {
flex-direction: column;
align-items: center;
}
.privacy-page .btn[b-grtpfj9zjh] {
width: 100%;
max-width: 300px;
}
.privacy-page h2[b-grtpfj9zjh] {
font-size: 1.8rem;
}
}
@media (max-width: 480px) {
.privacy-hero[b-grtpfj9zjh] {
padding: 60px 0;
}
.privacy-hero h1[b-grtpfj9zjh] {
font-size: 2rem;
}
.privacy-content[b-grtpfj9zjh] {
padding: 40px 0;
}
.privacy-section[b-grtpfj9zjh] {
padding: 25px 20px;
}
.privacy-summary[b-grtpfj9zjh] {
padding: 30px 25px;
}
.toc-container[b-grtpfj9zjh] {
padding: 15px;
}
.privacy-cta[b-grtpfj9zjh] {
padding: 60px 0;
}
.privacy-cta h2[b-grtpfj9zjh] {
font-size: 2rem;
}
}
/* _content/ClearoutJunk/Components/Pages/ServiceAreas.razor.rz.scp.css */
/* Service Areas Page Styles */
/* Reset and Base Styles for Service Areas Page */
.service-areas-page *[b-sp9mi2tk7n] {
margin: 0;
padding: 0;
box-sizing: border-box;
}
.service-areas-page[b-sp9mi2tk7n] {
font-family: 'Arial', sans-serif;
line-height: 1.6;
color: #333;
background-color: #ffffff;
}
.service-areas-page .container[b-sp9mi2tk7n] {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}
/* Typography */
.service-areas-page h1[b-sp9mi2tk7n] {
font-size: 3rem;
color: #2c5530;
font-weight: 700;
margin-bottom: 1rem;
}
.service-areas-page h2[b-sp9mi2tk7n] {
font-size: 2.5rem;
color: #2c5530;
font-weight: 600;
margin-bottom: 1.5rem;
text-align: center;
}
.service-areas-page h3[b-sp9mi2tk7n] {
font-size: 1.5rem;
color: #2c5530;
font-weight: 600;
margin-bottom: 1rem;
}
.service-areas-page h4[b-sp9mi2tk7n] {
font-size: 1.2rem;
color: #2c5530;
font-weight: 600;
margin-bottom: 0.75rem;
}
.service-areas-page p[b-sp9mi2tk7n] {
margin-bottom: 1rem;
font-size: 1.05rem;
line-height: 1.7;
}
.service-areas-page ul[b-sp9mi2tk7n] {
margin: 1rem 0;
padding-left: 1.5rem;
}
.service-areas-page li[b-sp9mi2tk7n] {
margin-bottom: 0.5rem;
font-size: 1rem;
line-height: 1.6;
}
/* Hero Section */
.service-areas-hero[b-sp9mi2tk7n] {
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
padding: 100px 0;
text-align: center;
position: relative;
overflow: hidden;
}
.service-areas-hero[b-sp9mi2tk7n]::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('data:image/svg+xml,') repeat-x;
background-size: 100px 100px;
}
.hero-content[b-sp9mi2tk7n] {
position: relative;
z-index: 1;
}
.service-areas-hero h1[b-sp9mi2tk7n] {
color: white;
font-size: 3.5rem;
margin-bottom: 1.5rem;
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}
.hero-subtitle[b-sp9mi2tk7n] {
font-size: 1.2rem;
max-width: 700px;
margin: 0 auto 3rem auto;
opacity: 0.95;
line-height: 1.6;
}
.hero-stats[b-sp9mi2tk7n] {
display: flex;
justify-content: center;
gap: 60px;
flex-wrap: wrap;
}
.stat-item[b-sp9mi2tk7n] {
text-align: center;
background: rgba(255,255,255,0.1);
padding: 25px 30px;
border-radius: 15px;
backdrop-filter: blur(10px);
border: 1px solid rgba(255,255,255,0.2);
min-width: 150px;
}
.stat-number[b-sp9mi2tk7n] {
display: block;
font-size: 2.5rem;
font-weight: 800;
color: white;
line-height: 1;
margin-bottom: 0.5rem;
}
.stat-label[b-sp9mi2tk7n] {
font-size: 1rem;
opacity: 0.9;
font-weight: 500;
}
/* Section Intro */
.section-intro[b-sp9mi2tk7n] {
text-align: center;
font-size: 1.15rem;
color: #666;
max-width: 800px;
margin: 0 auto 3rem auto;
line-height: 1.6;
}
/* Primary Service Areas */
.primary-areas[b-sp9mi2tk7n] {
padding: 80px 0;
background-color: #f8f9fa;
}
.areas-grid[b-sp9mi2tk7n] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
gap: 30px;
margin-top: 3rem;
}
.area-card[b-sp9mi2tk7n] {
background: white;
border-radius: 20px;
padding: 30px;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
transition: all 0.3s ease;
border: 3px solid transparent;
}
.area-card:hover[b-sp9mi2tk7n] {
transform: translateY(-8px);
box-shadow: 0 20px 40px rgba(0,0,0,0.15);
border-color: #4a7c59;
}
.area-card.primary[b-sp9mi2tk7n] {
border-top: 5px solid #4a7c59;
}
.area-header[b-sp9mi2tk7n] {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1.5rem;
}
.area-header h3[b-sp9mi2tk7n] {
color: #2c5530;
font-size: 1.8rem;
margin: 0;
}
.area-badge[b-sp9mi2tk7n] {
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
padding: 6px 15px;
border-radius: 20px;
font-size: 0.85rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.area-description[b-sp9mi2tk7n] {
color: #666;
margin-bottom: 1.5rem;
line-height: 1.6;
}
.area-features[b-sp9mi2tk7n] {
list-style: none;
padding: 0;
margin: 1.5rem 0;
}
.area-features li[b-sp9mi2tk7n] {
color: #4a7c59;
margin-bottom: 0.75rem;
font-weight: 500;
display: flex;
align-items: center;
gap: 8px;
}
.area-zipcodes[b-sp9mi2tk7n] {
background: #f8f9fa;
padding: 15px;
border-radius: 10px;
font-size: 0.95rem;
color: #555;
border-left: 4px solid #4a7c59;
}
.area-zipcodes strong[b-sp9mi2tk7n] {
color: #2c5530;
}
/* Extended Service Areas */
.extended-areas[b-sp9mi2tk7n] {
padding: 80px 0;
background-color: white;
}
.extended-grid[b-sp9mi2tk7n] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 40px;
margin-top: 3rem;
}
.extended-column h3[b-sp9mi2tk7n] {
color: #2c5530;
font-size: 1.4rem;
margin-bottom: 2rem;
text-align: center;
padding-bottom: 1rem;
border-bottom: 2px solid #4a7c59;
}
.city-list[b-sp9mi2tk7n] {
display: flex;
flex-direction: column;
gap: 15px;
}
.city-item[b-sp9mi2tk7n] {
background: #f8f9fa;
padding: 20px;
border-radius: 12px;
transition: all 0.3s ease;
border-left: 4px solid #ff6b35;
}
.city-item:hover[b-sp9mi2tk7n] {
transform: translateX(5px);
box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
.city-name[b-sp9mi2tk7n] {
display: block;
font-weight: 600;
color: #2c5530;
font-size: 1.1rem;
margin-bottom: 0.5rem;
}
.city-details[b-sp9mi2tk7n] {
font-size: 0.9rem;
color: #666;
}
.extended-note[b-sp9mi2tk7n] {
display: flex;
align-items: flex-start;
gap: 20px;
background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
padding: 30px;
border-radius: 15px;
margin-top: 3rem;
border: 2px solid #ffc107;
}
.note-icon[b-sp9mi2tk7n] {
font-size: 2rem;
flex-shrink: 0;
}
.note-content h4[b-sp9mi2tk7n] {
color: #856404;
margin-bottom: 0.75rem;
}
.note-content p[b-sp9mi2tk7n] {
color: #856404;
margin: 0;
}
/* Service Levels Comparison */
.service-levels[b-sp9mi2tk7n] {
padding: 80px 0;
background-color: #f8f9fa;
}
.comparison-table[b-sp9mi2tk7n] {
background: white;
border-radius: 15px;
overflow: hidden;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
margin-top: 3rem;
}
.table-header[b-sp9mi2tk7n] {
display: grid;
grid-template-columns: 2fr 1fr 1fr;
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
}
.header-cell[b-sp9mi2tk7n] {
padding: 20px;
font-weight: 600;
text-align: center;
font-size: 1.1rem;
}
.header-cell:first-child[b-sp9mi2tk7n] {
text-align: left;
}
.table-row[b-sp9mi2tk7n] {
display: grid;
grid-template-columns: 2fr 1fr 1fr;
border-bottom: 1px solid #e9ecef;
}
.table-row:last-child[b-sp9mi2tk7n] {
border-bottom: none;
}
.feature-cell[b-sp9mi2tk7n] {
padding: 20px;
font-weight: 600;
color: #2c5530;
background: #f8f9fa;
}
.primary-cell[b-sp9mi2tk7n], .extended-cell[b-sp9mi2tk7n] {
padding: 20px;
text-align: center;
font-weight: 500;
}
.primary-cell[b-sp9mi2tk7n] {
background: #e8f5e8;
color: #2c5530;
}
.extended-cell[b-sp9mi2tk7n] {
background: #fff3e0;
color: #bf5600;
}
/* Area Checker */
.area-checker[b-sp9mi2tk7n] {
padding: 80px 0;
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
text-align: center;
}
.area-checker h2[b-sp9mi2tk7n] {
color: white;
margin-bottom: 1rem;
}
.checker-intro[b-sp9mi2tk7n] {
font-size: 1.1rem;
margin-bottom: 3rem;
opacity: 0.95;
}
.checker-container[b-sp9mi2tk7n] {
max-width: 600px;
margin: 0 auto;
}
.checker-form[b-sp9mi2tk7n] {
background: rgba(255,255,255,0.1);
padding: 40px;
border-radius: 20px;
backdrop-filter: blur(10px);
border: 1px solid rgba(255,255,255,0.2);
}
.input-group[b-sp9mi2tk7n] {
display: flex;
gap: 15px;
margin-bottom: 2rem;
flex-wrap: wrap;
justify-content: center;
}
.input-group input[b-sp9mi2tk7n] {
flex: 1;
min-width: 200px;
padding: 15px 20px;
border: none;
border-radius: 25px;
font-size: 1.1rem;
text-align: center;
outline: none;
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}
.input-group input[b-sp9mi2tk7n]::placeholder {
color: #999;
}
.checker-result[b-sp9mi2tk7n] {
margin-top: 2rem;
text-align: left;
}
.result-success[b-sp9mi2tk7n] {
background: rgba(255,255,255,0.95);
color: #2c5530;
padding: 30px;
border-radius: 15px;
box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}
.result-success h4[b-sp9mi2tk7n] {
color: #2c5530;
margin-bottom: 1.5rem;
text-align: center;
font-size: 1.4rem;
}
.result-details[b-sp9mi2tk7n] {
margin-bottom: 2rem;
}
.result-details p[b-sp9mi2tk7n] {
margin-bottom: 0.75rem;
color: #555;
}
.result-success .btn[b-sp9mi2tk7n] {
display: block;
width: 100%;
margin: 0 auto;
max-width: 200px;
}
.result-error[b-sp9mi2tk7n] {
background: rgba(220, 53, 69, 0.9);
color: white;
padding: 25px;
border-radius: 15px;
text-align: center;
}
.result-not-served[b-sp9mi2tk7n] {
background: rgba(255,255,255,0.95);
color: #333;
padding: 30px;
border-radius: 15px;
box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}
.result-not-served h4[b-sp9mi2tk7n] {
color: #bf5600;
margin-bottom: 1rem;
text-align: center;
}
.result-not-served ul[b-sp9mi2tk7n] {
margin: 1rem 0;
text-align: left;
}
.result-actions[b-sp9mi2tk7n] {
display: flex;
gap: 10px;
justify-content: center;
margin-top: 1.5rem;
flex-wrap: wrap;
}
/* Why Choose Local */
.why-local[b-sp9mi2tk7n] {
padding: 80px 0;
background-color: white;
}
.local-benefits[b-sp9mi2tk7n] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 30px;
margin-top: 3rem;
}
.benefit-card[b-sp9mi2tk7n] {
background: #f8f9fa;
padding: 30px;
border-radius: 15px;
text-align: center;
transition: all 0.3s ease;
border: 2px solid transparent;
}
.benefit-card:hover[b-sp9mi2tk7n] {
transform: translateY(-5px);
border-color: #4a7c59;
box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}
.benefit-icon[b-sp9mi2tk7n] {
font-size: 3rem;
margin-bottom: 1.5rem;
display: block;
}
.benefit-card h3[b-sp9mi2tk7n] {
color: #2c5530;
margin-bottom: 1rem;
text-align: center;
}
.benefit-card p[b-sp9mi2tk7n] {
color: #666;
margin: 0;
line-height: 1.6;
}
/* Coverage Map */
.coverage-map[b-sp9mi2tk7n] {
padding: 80px 0;
background-color: #f8f9fa;
}
.map-container[b-sp9mi2tk7n] {
margin-top: 3rem;
}
.map-placeholder[b-sp9mi2tk7n] {
background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
border: 3px dashed #adb5bd;
border-radius: 20px;
height: 400px;
display: flex;
align-items: center;
justify-content: center;
}
.map-content[b-sp9mi2tk7n] {
text-align: center;
color: #6c757d;
}
.map-icon[b-sp9mi2tk7n] {
font-size: 4rem;
margin-bottom: 1rem;
display: block;
}
.map-content h3[b-sp9mi2tk7n] {
color: #495057;
margin-bottom: 1rem;
}
.map-content p[b-sp9mi2tk7n] {
color: #6c757d;
margin-bottom: 2rem;
}
.map-legend[b-sp9mi2tk7n] {
display: flex;
justify-content: center;
gap: 30px;
flex-wrap: wrap;
}
.legend-item[b-sp9mi2tk7n] {
display: flex;
align-items: center;
gap: 10px;
}
.legend-color[b-sp9mi2tk7n] {
width: 20px;
height: 20px;
border-radius: 4px;
}
.legend-color.primary[b-sp9mi2tk7n] {
background: #4a7c59;
}
.legend-color.extended[b-sp9mi2tk7n] {
background: #ff6b35;
}
.map-note[b-sp9mi2tk7n] {
text-align: center;
margin-top: 2rem;
color: #666;
font-style: italic;
}
/* Expansion Plans */
.expansion-plans[b-sp9mi2tk7n] {
padding: 80px 0;
background-color: white;
text-align: center;
}
.expansion-content h2[b-sp9mi2tk7n] {
margin-bottom: 1.5rem;
}
.expansion-content > p[b-sp9mi2tk7n] {
font-size: 1.1rem;
color: #666;
margin-bottom: 3rem;
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
.upcoming-areas[b-sp9mi2tk7n] {
margin-bottom: 3rem;
}
.upcoming-areas h3[b-sp9mi2tk7n] {
color: #2c5530;
margin-bottom: 2rem;
text-align: center;
}
.upcoming-list[b-sp9mi2tk7n] {
display: flex;
justify-content: center;
gap: 15px;
flex-wrap: wrap;
}
.upcoming-item[b-sp9mi2tk7n] {
background: #f8f9fa;
padding: 10px 20px;
border-radius: 20px;
color: #666;
border: 2px solid #e9ecef;
transition: all 0.3s ease;
}
.upcoming-item:hover[b-sp9mi2tk7n] {
border-color: #4a7c59;
color: #2c5530;
transform: translateY(-2px);
}
.expansion-cta[b-sp9mi2tk7n] {
background: #f8f9fa;
padding: 30px;
border-radius: 15px;
border-left: 4px solid #4a7c59;
}
.expansion-link[b-sp9mi2tk7n] {
color: #4a7c59;
text-decoration: none;
font-weight: 600;
}
.expansion-link:hover[b-sp9mi2tk7n] {
text-decoration: underline;
}
/* Buttons */
.service-areas-page .btn[b-sp9mi2tk7n] {
padding: 14px 28px;
font-size: 1rem;
font-weight: 600;
border: none;
border-radius: 25px;
cursor: pointer;
text-decoration: none;
display: inline-block;
transition: all 0.3s ease;
text-align: center;
}
.service-areas-page .btn-large[b-sp9mi2tk7n] {
padding: 18px 40px;
font-size: 1.2rem;
}
.service-areas-page .btn-primary[b-sp9mi2tk7n] {
background: #4a7c59;
color: white;
box-shadow: 0 4px 15px rgba(74, 124, 89, 0.3);
}
.service-areas-page .btn-primary:hover[b-sp9mi2tk7n] {
background: #3d6249;
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(74, 124, 89, 0.4);
}
.service-areas-page .btn-secondary[b-sp9mi2tk7n] {
background: transparent;
color: #4a7c59;
border: 2px solid #4a7c59;
}
.service-areas-page .btn-secondary:hover[b-sp9mi2tk7n] {
background: #4a7c59;
color: white;
transform: translateY(-2px);
}
/* Areas CTA Section */
.areas-cta[b-sp9mi2tk7n] {
padding: 80px 0;
background: linear-gradient(135deg, #2c5530 0%, #1a3d1f 100%);
color: white;
text-align: center;
}
.areas-cta h2[b-sp9mi2tk7n] {
color: white;
font-size: 2.5rem;
margin-bottom: 1.5rem;
}
.areas-cta p[b-sp9mi2tk7n] {
font-size: 1.2rem;
margin-bottom: 2.5rem;
opacity: 0.95;
max-width: 600px;
margin-left: auto;
margin-right: auto;
color: white;
}
.cta-buttons[b-sp9mi2tk7n] {
display: flex;
justify-content: center;
gap: 20px;
flex-wrap: wrap;
}
.areas-cta .btn-primary[b-sp9mi2tk7n] {
background: #ff6b35;
box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3);
}
.areas-cta .btn-primary:hover[b-sp9mi2tk7n] {
background: #e55a2b;
box-shadow: 0 8px 25px rgba(255, 107, 53, 0.4);
}
.areas-cta .btn-secondary[b-sp9mi2tk7n] {
background: transparent;
color: white;
border: 2px solid white;
}
.areas-cta .btn-secondary:hover[b-sp9mi2tk7n] {
background: white;
color: #2c5530;
}
/* Responsive Design */
@media (max-width: 768px) {
.service-areas-page .container[b-sp9mi2tk7n] {
padding: 0 15px;
}
.service-areas-hero h1[b-sp9mi2tk7n] {
font-size: 2.5rem;
}
.hero-subtitle[b-sp9mi2tk7n] {
font-size: 1.1rem;
}
.hero-stats[b-sp9mi2tk7n] {
gap: 30px;
}
.stat-item[b-sp9mi2tk7n] {
padding: 20px 25px;
min-width: 120px;
}
.stat-number[b-sp9mi2tk7n] {
font-size: 2rem;
}
.areas-grid[b-sp9mi2tk7n] {
grid-template-columns: 1fr;
gap: 25px;
}
.extended-grid[b-sp9mi2tk7n] {
grid-template-columns: 1fr;
gap: 30px;
}
.table-header[b-sp9mi2tk7n],
.table-row[b-sp9mi2tk7n] {
grid-template-columns: 1fr;
}
.header-cell[b-sp9mi2tk7n],
.feature-cell[b-sp9mi2tk7n],
.primary-cell[b-sp9mi2tk7n],
.extended-cell[b-sp9mi2tk7n] {
text-align: left;
padding: 15px;
}
.input-group[b-sp9mi2tk7n] {
flex-direction: column;
align-items: center;
}
.input-group input[b-sp9mi2tk7n] {
width: 100%;
max-width: 300px;
}
.local-benefits[b-sp9mi2tk7n] {
grid-template-columns: 1fr;
gap: 25px;
}
.map-placeholder[b-sp9mi2tk7n] {
height: 300px;
}
.upcoming-list[b-sp9mi2tk7n] {
flex-direction: column;
align-items: center;
}
.upcoming-item[b-sp9mi2tk7n] {
width: 100%;
max-width: 200px;
text-align: center;
}
.cta-buttons[b-sp9mi2tk7n] {
flex-direction: column;
align-items: center;
}
.service-areas-page .btn[b-sp9mi2tk7n] {
width: 100%;
max-width: 300px;
}
.result-actions[b-sp9mi2tk7n] {
flex-direction: column;
}
.result-actions .btn[b-sp9mi2tk7n] {
width: 100%;
}
}
@media (max-width: 480px) {
.service-areas-hero[b-sp9mi2tk7n] {
padding: 60px 0;
}
.service-areas-hero h1[b-sp9mi2tk7n] {
font-size: 2rem;
}
.primary-areas[b-sp9mi2tk7n],
.extended-areas[b-sp9mi2tk7n],
.service-levels[b-sp9mi2tk7n],
.area-checker[b-sp9mi2tk7n],
.why-local[b-sp9mi2tk7n],
.coverage-map[b-sp9mi2tk7n],
.expansion-plans[b-sp9mi2tk7n],
.areas-cta[b-sp9mi2tk7n] {
padding: 60px 0;
}
.area-card[b-sp9mi2tk7n] {
padding: 25px 20px;
}
.checker-form[b-sp9mi2tk7n] {
padding: 30px 20px;
}
.extended-note[b-sp9mi2tk7n] {
flex-direction: column;
text-align: center;
padding: 25px 20px;
}
.map-placeholder[b-sp9mi2tk7n] {
height: 250px;
}
.map-legend[b-sp9mi2tk7n] {
flex-direction: column;
gap: 15px;
}
.expansion-cta[b-sp9mi2tk7n] {
padding: 25px 20px;
}
.service-areas-page h2[b-sp9mi2tk7n] {
font-size: 2rem;
}
.areas-cta h2[b-sp9mi2tk7n] {
font-size: 2rem;
}
}
/* _content/ClearoutJunk/Components/Pages/Services.razor.rz.scp.css */
/* Services Page Styles - Self-Contained */
/* Services Hero */
.services-hero[b-fqi7nbfmi6] {
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
padding: 120px 0 80px;
color: white;
text-align: center;
position: relative;
overflow: hidden;
}
.services-hero[b-fqi7nbfmi6]::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('data:image/svg+xml,') repeat-x;
background-size: 100px 100px;
}
.hero-content[b-fqi7nbfmi6] {
position: relative;
z-index: 1;
}
.services-hero h1[b-fqi7nbfmi6] {
font-size: 3.5rem;
font-weight: 700;
margin-bottom: 1.5rem;
color: white;
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}
.hero-subtitle[b-fqi7nbfmi6] {
font-size: 1.2rem;
max-width: 700px;
margin: 0 auto 3rem auto;
opacity: 0.95;
line-height: 1.6;
color: white;
}
.hero-stats[b-fqi7nbfmi6] {
display: flex;
justify-content: center;
gap: 60px;
margin-top: 3rem;
flex-wrap: wrap;
}
.stat-item[b-fqi7nbfmi6] {
text-align: center;
background: rgba(255,255,255,0.1);
padding: 25px 30px;
border-radius: 15px;
backdrop-filter: blur(10px);
border: 1px solid rgba(255,255,255,0.2);
min-width: 150px;
}
.stat-number[b-fqi7nbfmi6] {
display: block;
font-size: 2.5rem;
font-weight: 800;
color: white;
margin-bottom: 0.5rem;
line-height: 1;
}
.stat-label[b-fqi7nbfmi6] {
color: rgba(255, 255, 255, 0.9);
font-weight: 500;
font-size: 1rem;
}
/* Main Services */
.main-services[b-fqi7nbfmi6] {
padding: 80px 0;
background: white;
}
.main-services .container h2[b-fqi7nbfmi6] {
text-align: center;
color: #2c5530;
font-size: 2.5rem;
margin-bottom: 1.5rem;
}
.section-intro[b-fqi7nbfmi6] {
text-align: center;
font-size: 1.15rem;
color: #666;
margin-bottom: 3rem;
max-width: 800px;
margin-left: auto;
margin-right: auto;
line-height: 1.6;
}
.services-grid[b-fqi7nbfmi6] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
gap: 30px;
margin-top: 3rem;
}
.service-card[b-fqi7nbfmi6] {
background: white;
border-radius: 20px;
padding: 30px;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
transition: all 0.3s ease;
border: 3px solid transparent;
display: flex;
flex-direction: column;
}
.service-card:hover[b-fqi7nbfmi6] {
transform: translateY(-8px);
box-shadow: 0 20px 40px rgba(0,0,0,0.15);
border-color: #4a7c59;
}
.service-card.featured[b-fqi7nbfmi6] {
border-color: #4a7c59;
transform: scale(1.02);
box-shadow: 0 15px 40px rgba(74, 124, 89, 0.15);
}
.service-card.featured:hover[b-fqi7nbfmi6] {
transform: scale(1.02) translateY(-5px);
}
.service-header[b-fqi7nbfmi6] {
padding-bottom: 1.5rem;
border-bottom: 1px solid #e2e8f0;
margin-bottom: 1.5rem;
text-align: center;
}
.service-icon[b-fqi7nbfmi6] {
font-size: 3rem;
margin-bottom: 1rem;
display: block;
}
.service-header h3[b-fqi7nbfmi6] {
color: #2c5530;
font-size: 1.5rem;
margin-bottom: 0.5rem;
font-weight: 600;
}
.service-tagline[b-fqi7nbfmi6] {
color: #666;
font-style: italic;
margin: 0;
font-size: 1rem;
}
.service-content[b-fqi7nbfmi6] {
flex-grow: 1;
margin-bottom: 2rem;
}
.service-description[b-fqi7nbfmi6] {
line-height: 1.6;
margin-bottom: 1.5rem;
color: #555;
font-size: 1.05rem;
}
.service-features[b-fqi7nbfmi6] {
list-style: none;
margin-bottom: 2rem;
padding: 0;
}
.service-features li[b-fqi7nbfmi6] {
padding: 0.75rem 0;
color: #555;
font-weight: 500;
border-bottom: 1px solid #f1f3f4;
}
.service-features li:last-child[b-fqi7nbfmi6] {
border-bottom: none;
}
.service-pricing[b-fqi7nbfmi6] {
display: flex;
align-items: baseline;
gap: 0.75rem;
margin-bottom: 1.5rem;
justify-content: center;
padding: 20px;
background: #f8f9fa;
border-radius: 12px;
}
.price-label[b-fqi7nbfmi6] {
color: #666;
font-size: 0.95rem;
font-weight: 500;
}
.price[b-fqi7nbfmi6] {
font-size: 2.2rem;
font-weight: 700;
color: #4a7c59;
}
.service-footer[b-fqi7nbfmi6] {
border-top: 1px solid #e2e8f0;
padding-top: 1.5rem;
text-align: center;
margin-top: auto;
}
.service-footer .btn[b-fqi7nbfmi6] {
width: 100%;
padding: 14px 28px;
font-size: 1rem;
font-weight: 600;
border: none;
border-radius: 25px;
cursor: pointer;
text-decoration: none;
text-align: center;
transition: all 0.3s ease;
}
.service-footer .btn-primary[b-fqi7nbfmi6] {
background: linear-gradient(135deg, #ff6b35 0%, #e55a2b 100%);
color: white;
box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3);
}
.service-footer .btn-primary:hover[b-fqi7nbfmi6] {
background: #e55a2b;
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(255, 107, 53, 0.4);
}
/* Specialty Services */
.specialty-services[b-fqi7nbfmi6] {
padding: 80px 0;
background: white;
}
.specialty-services h2[b-fqi7nbfmi6] {
text-align: center;
color: #2c5530;
font-size: 2.5rem;
margin-bottom: 1.5rem;
}
.specialty-grid[b-fqi7nbfmi6] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 30px;
margin-top: 3rem;
}
.specialty-item[b-fqi7nbfmi6] {
text-align: center;
padding: 30px;
border-radius: 20px;
transition: all 0.3s ease;
background: #f8f9fa;
border: 2px solid transparent;
}
.specialty-item:hover[b-fqi7nbfmi6] {
transform: translateY(-5px);
box-shadow: 0 10px 25px rgba(0,0,0,0.1);
border-color: #4a7c59;
background: white;
}
.specialty-icon[b-fqi7nbfmi6] {
font-size: 3.5rem;
margin-bottom: 1.5rem;
display: block;
}
.specialty-item h3[b-fqi7nbfmi6] {
color: #2c5530;
margin-bottom: 1rem;
font-size: 1.3rem;
font-weight: 600;
}
.specialty-item p[b-fqi7nbfmi6] {
color: #666;
line-height: 1.6;
margin: 0;
font-size: 1rem;
}
/* Service Process */
.service-process[b-fqi7nbfmi6] {
padding: 80px 0;
background: #f8f9fa;
}
.service-process h2[b-fqi7nbfmi6] {
text-align: center;
color: #2c5530;
font-size: 2.5rem;
margin-bottom: 1.5rem;
}
.process-steps[b-fqi7nbfmi6] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 30px;
margin-top: 3rem;
}
.process-step[b-fqi7nbfmi6] {
text-align: center;
padding: 30px;
background: white;
border-radius: 20px;
box-shadow: 0 5px 20px rgba(0,0,0,0.08);
transition: all 0.3s ease;
}
.process-step:hover[b-fqi7nbfmi6] {
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}
.step-number[b-fqi7nbfmi6] {
width: 60px;
height: 60px;
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
font-weight: 700;
margin: 0 auto 1.5rem;
box-shadow: 0 4px 15px rgba(74, 124, 89, 0.3);
}
.step-content h3[b-fqi7nbfmi6] {
color: #2c5530;
margin-bottom: 1rem;
font-size: 1.3rem;
font-weight: 600;
}
.step-content p[b-fqi7nbfmi6] {
color: #666;
line-height: 1.6;
margin: 0;
font-size: 1rem;
}
/* Items Guide */
.items-guide[b-fqi7nbfmi6] {
padding: 80px 0;
background: white;
}
.items-guide h2[b-fqi7nbfmi6] {
text-align: center;
color: #2c5530;
font-size: 2.5rem;
margin-bottom: 3rem;
}
.items-grid[b-fqi7nbfmi6] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 40px;
}
.items-section[b-fqi7nbfmi6] {
padding: 30px;
border-radius: 20px;
}
.items-section.accepted[b-fqi7nbfmi6] {
background: #f0fff4;
border: 3px solid #48bb78;
}
.items-section.restricted[b-fqi7nbfmi6] {
background: #fff5f5;
border: 3px solid #e53e3e;
}
.items-section h3[b-fqi7nbfmi6] {
color: #2c5530;
font-size: 1.8rem;
margin-bottom: 1.5rem;
text-align: center;
font-weight: 600;
}
.items-categories[b-fqi7nbfmi6], .restricted-items[b-fqi7nbfmi6] {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
margin-top: 1.5rem;
}
.category[b-fqi7nbfmi6], .restriction-category[b-fqi7nbfmi6] {
background: white;
padding: 20px;
border-radius: 12px;
box-shadow: 0 2px 10px rgba(0,0,0,0.08);
}
.category h4[b-fqi7nbfmi6], .restriction-category h4[b-fqi7nbfmi6] {
color: #2c5530;
margin-bottom: 1rem;
font-size: 1.1rem;
font-weight: 600;
}
.category ul[b-fqi7nbfmi6], .restriction-category ul[b-fqi7nbfmi6] {
list-style: none;
margin: 0;
padding: 0;
}
.category li[b-fqi7nbfmi6], .restriction-category li[b-fqi7nbfmi6] {
padding: 0.4rem 0;
color: #555;
font-size: 0.95rem;
border-bottom: 1px solid #f1f3f4;
}
.category li:last-child[b-fqi7nbfmi6], .restriction-category li:last-child[b-fqi7nbfmi6] {
border-bottom: none;
}
.restriction-note[b-fqi7nbfmi6] {
margin-top: 1.5rem;
padding: 20px;
background: rgba(255, 255, 255, 0.8);
border-radius: 12px;
border-left: 4px solid #e53e3e;
}
.restriction-note p[b-fqi7nbfmi6] {
color: #666;
margin: 0;
font-weight: 500;
}
/* Environmental Commitment */
.environmental-commitment[b-fqi7nbfmi6] {
padding: 80px 0;
background: #f8f9fa;
}
.environmental-commitment h2[b-fqi7nbfmi6] {
text-align: center;
color: #2c5530;
font-size: 2.5rem;
margin-bottom: 1rem;
}
.commitment-intro[b-fqi7nbfmi6] {
text-align: center;
font-size: 1.2rem;
color: #666;
margin-bottom: 3rem;
max-width: 600px;
margin-left: auto;
margin-right: auto;
line-height: 1.6;
}
.commitment-stats[b-fqi7nbfmi6] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 30px;
margin-bottom: 4rem;
}
.commitment-stat[b-fqi7nbfmi6] {
display: flex;
align-items: center;
gap: 20px;
padding: 30px;
background: white;
border-radius: 20px;
box-shadow: 0 5px 20px rgba(0,0,0,0.08);
transition: all 0.3s ease;
}
.commitment-stat:hover[b-fqi7nbfmi6] {
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}
.stat-icon[b-fqi7nbfmi6] {
font-size: 3.5rem;
flex-shrink: 0;
}
.stat-info .stat-number[b-fqi7nbfmi6] {
font-size: 2.2rem;
font-weight: 700;
color: #4a7c59;
display: block;
line-height: 1;
}
.stat-info .stat-label[b-fqi7nbfmi6] {
font-weight: 600;
color: #2c5530;
display: block;
margin-bottom: 0.5rem;
font-size: 1.1rem;
}
.stat-info p[b-fqi7nbfmi6] {
color: #666;
margin: 0;
font-size: 0.95rem;
line-height: 1.5;
}
.commitment-process[b-fqi7nbfmi6] {
text-align: center;
}
.commitment-process h3[b-fqi7nbfmi6] {
margin-bottom: 2rem;
color: #2c5530;
font-size: 1.8rem;
font-weight: 600;
}
.sorting-steps[b-fqi7nbfmi6] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 30px;
}
.sorting-step[b-fqi7nbfmi6] {
text-align: center;
padding: 30px 20px;
background: white;
border-radius: 15px;
box-shadow: 0 5px 15px rgba(0,0,0,0.08);
transition: all 0.3s ease;
}
.sorting-step:hover[b-fqi7nbfmi6] {
transform: translateY(-5px);
box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}
.sorting-icon[b-fqi7nbfmi6] {
font-size: 3.5rem;
margin-bottom: 1.5rem;
display: block;
}
.sorting-step h4[b-fqi7nbfmi6] {
color: #2c5530;
margin-bottom: 1rem;
font-size: 1.2rem;
font-weight: 600;
}
.sorting-step p[b-fqi7nbfmi6] {
color: #666;
font-size: 0.95rem;
margin: 0;
line-height: 1.5;
}
/* Services CTA */
.services-cta[b-fqi7nbfmi6] {
padding: 80px 0;
background: linear-gradient(135deg, #2c5530 0%, #1a3d1f 100%);
color: white;
text-align: center;
}
.services-cta h2[b-fqi7nbfmi6] {
color: white;
font-size: 2.5rem;
margin-bottom: 1.5rem;
font-weight: 700;
}
.services-cta p[b-fqi7nbfmi6] {
font-size: 1.2rem;
margin-bottom: 2.5rem;
opacity: 0.95;
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
.cta-buttons[b-fqi7nbfmi6] {
display: flex;
justify-content: center;
gap: 20px;
flex-wrap: wrap;
margin-bottom: 2rem;
}
.cta-buttons .btn[b-fqi7nbfmi6] {
padding: 18px 40px;
font-size: 1.2rem;
font-weight: 600;
border-radius: 25px;
text-decoration: none;
transition: all 0.3s ease;
}
.cta-buttons .btn-primary[b-fqi7nbfmi6] {
background: linear-gradient(135deg, #ff6b35 0%, #e55a2b 100%);
color: white;
border: none;
box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3);
}
.cta-buttons .btn-primary:hover[b-fqi7nbfmi6] {
background: #e55a2b;
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(255, 107, 53, 0.4);
}
.cta-buttons .btn-secondary[b-fqi7nbfmi6] {
background: transparent;
color: white;
border: 2px solid white;
}
.cta-buttons .btn-secondary:hover[b-fqi7nbfmi6] {
background: white;
color: #2c5530;
transform: translateY(-2px);
}
.cta-guarantees[b-fqi7nbfmi6] {
display: flex;
justify-content: center;
gap: 30px;
margin-top: 2rem;
flex-wrap: wrap;
}
.cta-guarantees .guarantee[b-fqi7nbfmi6] {
color: rgba(255, 255, 255, 0.9);
font-size: 0.95rem;
font-weight: 500;
}
/* Responsive Design */
@media (max-width: 1024px) {
.services-grid[b-fqi7nbfmi6] {
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.items-grid[b-fqi7nbfmi6] {
grid-template-columns: 1fr;
gap: 30px;
}
.items-categories[b-fqi7nbfmi6], .restricted-items[b-fqi7nbfmi6] {
grid-template-columns: 1fr;
gap: 15px;
}
}
@media (max-width: 768px) {
.services-hero[b-fqi7nbfmi6] {
padding: 80px 0 60px;
}
.services-hero h1[b-fqi7nbfmi6] {
font-size: 2.5rem;
}
.hero-stats[b-fqi7nbfmi6] {
gap: 30px;
flex-direction: column;
align-items: center;
}
.stat-item[b-fqi7nbfmi6] {
min-width: 200px;
}
.services-grid[b-fqi7nbfmi6],
.specialty-grid[b-fqi7nbfmi6],
.process-steps[b-fqi7nbfmi6],
.commitment-stats[b-fqi7nbfmi6],
.sorting-steps[b-fqi7nbfmi6] {
grid-template-columns: 1fr;
gap: 25px;
}
.commitment-stat[b-fqi7nbfmi6] {
flex-direction: column;
text-align: center;
gap: 15px;
}
.cta-buttons[b-fqi7nbfmi6] {
flex-direction: column;
align-items: center;
}
.cta-buttons .btn[b-fqi7nbfmi6] {
width: 100%;
max-width: 300px;
}
.cta-guarantees[b-fqi7nbfmi6] {
flex-direction: column;
gap: 15px;
}
}
@media (max-width: 480px) {
.services-hero[b-fqi7nbfmi6] {
padding: 60px 0 40px;
}
.services-hero h1[b-fqi7nbfmi6] {
font-size: 2rem;
}
.main-services[b-fqi7nbfmi6],
.specialty-services[b-fqi7nbfmi6],
.service-process[b-fqi7nbfmi6],
.items-guide[b-fqi7nbfmi6],
.environmental-commitment[b-fqi7nbfmi6],
.services-cta[b-fqi7nbfmi6] {
padding: 60px 0;
}
.service-card[b-fqi7nbfmi6] {
padding: 25px 20px;
}
.specialty-item[b-fqi7nbfmi6],
.process-step[b-fqi7nbfmi6],
.sorting-step[b-fqi7nbfmi6] {
padding: 25px 20px;
}
.commitment-stat[b-fqi7nbfmi6] {
padding: 25px 20px;
}
.items-section[b-fqi7nbfmi6] {
padding: 25px 20px;
}
.services-cta h2[b-fqi7nbfmi6] {
font-size: 2rem;
}
}
/* _content/ClearoutJunk/Components/Pages/TermsAndConditions.razor.rz.scp.css */
/* Terms & Conditions Page Styles */
/* Reset and Base Styles for Terms Page */
.terms-page *[b-3hkcjlc0t5] {
margin: 0;
padding: 0;
box-sizing: border-box;
}
.terms-page[b-3hkcjlc0t5] {
font-family: 'Arial', sans-serif;
line-height: 1.6;
color: #333;
background-color: #ffffff;
}
.terms-page .container[b-3hkcjlc0t5] {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}
/* Typography */
.terms-page h1[b-3hkcjlc0t5] {
font-size: 3rem;
color: #2c5530;
font-weight: 700;
margin-bottom: 1rem;
}
.terms-page h2[b-3hkcjlc0t5] {
font-size: 2rem;
color: #2c5530;
font-weight: 600;
margin-bottom: 1.5rem;
border-bottom: 3px solid #4a7c59;
padding-bottom: 0.5rem;
}
.terms-page h3[b-3hkcjlc0t5] {
font-size: 1.4rem;
color: #2c5530;
font-weight: 600;
margin: 2rem 0 1rem 0;
}
.terms-page h4[b-3hkcjlc0t5] {
font-size: 1.2rem;
color: #2c5530;
font-weight: 600;
margin: 1.5rem 0 0.75rem 0;
}
.terms-page p[b-3hkcjlc0t5] {
margin-bottom: 1rem;
font-size: 1.05rem;
line-height: 1.7;
color: #444;
}
.terms-page ul[b-3hkcjlc0t5], .terms-page ol[b-3hkcjlc0t5] {
margin: 1rem 0 1rem 2rem;
}
.terms-page li[b-3hkcjlc0t5] {
margin-bottom: 0.5rem;
font-size: 1rem;
line-height: 1.6;
color: #555;
}
/* Hero Section */
.terms-hero[b-3hkcjlc0t5] {
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
padding: 80px 0;
text-align: center;
position: relative;
overflow: hidden;
}
.terms-hero[b-3hkcjlc0t5]::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('data:image/svg+xml,') repeat-x;
background-size: 100px 100px;
}
.hero-content[b-3hkcjlc0t5] {
position: relative;
z-index: 1;
}
.terms-hero h1[b-3hkcjlc0t5] {
color: white;
font-size: 3.5rem;
margin-bottom: 1.5rem;
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}
.hero-subtitle[b-3hkcjlc0t5] {
font-size: 1.2rem;
max-width: 700px;
margin: 0 auto 2rem auto;
opacity: 0.95;
line-height: 1.6;
}
.last-updated[b-3hkcjlc0t5] {
background: rgba(255,255,255,0.15);
padding: 12px 20px;
border-radius: 20px;
font-size: 0.9rem;
display: inline-block;
backdrop-filter: blur(10px);
border: 1px solid rgba(255,255,255,0.2);
}
/* Terms Content Layout */
.terms-content[b-3hkcjlc0t5] {
padding: 60px 0;
background-color: #f8f9fa;
}
.terms-layout[b-3hkcjlc0t5] {
display: grid;
grid-template-columns: 280px 1fr;
gap: 60px;
align-items: start;
}
/* Sidebar Table of Contents */
.terms-sidebar[b-3hkcjlc0t5] {
position: sticky;
top: 100px;
}
.toc-container[b-3hkcjlc0t5] {
background: white;
padding: 30px;
border-radius: 15px;
box-shadow: 0 5px 20px rgba(0,0,0,0.1);
border: 2px solid #f1f3f4;
}
.toc-container h3[b-3hkcjlc0t5] {
color: #2c5530;
font-size: 1.3rem;
margin-bottom: 1.5rem;
text-align: center;
border-bottom: 2px solid #4a7c59;
padding-bottom: 0.75rem;
}
.toc-nav[b-3hkcjlc0t5] {
display: flex;
flex-direction: column;
gap: 6px;
}
.toc-link[b-3hkcjlc0t5] {
color: #666;
text-decoration: none;
padding: 10px 15px;
border-radius: 8px;
transition: all 0.3s ease;
font-size: 0.9rem;
border-left: 3px solid transparent;
}
.toc-link:hover[b-3hkcjlc0t5] {
background-color: #f8f9fa;
color: #2c5530;
border-left-color: #4a7c59;
transform: translateX(5px);
}
/* Main Content */
.terms-main[b-3hkcjlc0t5] {
background: white;
border-radius: 20px;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
overflow: hidden;
}
/* Terms Introduction */
.terms-intro[b-3hkcjlc0t5] {
background: linear-gradient(135deg, #4a7c59 0%, #2c5530 100%);
color: white;
padding: 40px;
margin-bottom: 0;
}
.terms-intro p[b-3hkcjlc0t5] {
font-size: 1.15rem;
margin: 0;
text-align: center;
opacity: 0.95;
line-height: 1.7;
color: white;
}
/* Terms Sections */
.terms-section[b-3hkcjlc0t5] {
padding: 40px;
border-bottom: 1px solid #e9ecef;
}
.terms-section:last-child[b-3hkcjlc0t5] {
border-bottom: none;
}
.section-content[b-3hkcjlc0t5] {
max-width: none;
}
/* Important Notice */
.important-notice[b-3hkcjlc0t5] {
background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
border: 2px solid #ffc107;
padding: 25px;
border-radius: 12px;
margin: 2rem 0;
}
.important-notice h4[b-3hkcjlc0t5] {
color: #856404;
margin-bottom: 1rem;
display: flex;
align-items: center;
gap: 10px;
}
.important-notice p[b-3hkcjlc0t5] {
color: #856404;
margin: 0;
font-weight: 500;
}
/* Restrictions Grid */
.restrictions-grid[b-3hkcjlc0t5] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 25px;
margin: 2rem 0;
}
.restriction-category[b-3hkcjlc0t5] {
background: #f8f9fa;
padding: 25px;
border-radius: 12px;
border-left: 4px solid #dc3545;
}
.restriction-category h4[b-3hkcjlc0t5] {
color: #dc3545;
margin-bottom: 1rem;
font-weight: 600;
}
.restriction-category ul[b-3hkcjlc0t5] {
margin: 0;
padding-left: 1.5rem;
}
.restriction-category li[b-3hkcjlc0t5] {
color: #555;
margin-bottom: 0.4rem;
}
/* Contact Information */
.contact-info[b-3hkcjlc0t5] {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 30px;
margin: 2rem 0;
padding: 30px;
background: #f8f9fa;
border-radius: 15px;
border-left: 4px solid #4a7c59;
}
.contact-method[b-3hkcjlc0t5] {
line-height: 1.8;
}
.contact-method a[b-3hkcjlc0t5] {
color: #4a7c59;
text-decoration: none;
font-weight: 500;
}
.contact-method a:hover[b-3hkcjlc0t5] {
text-decoration: underline;
}
/* Privacy Link */
.privacy-link[b-3hkcjlc0t5] {
color: #4a7c59;
text-decoration: none;
font-weight: 600;
display: inline-flex;
align-items: center;
gap: 5px;
transition: all 0.3s ease;
}
.privacy-link:hover[b-3hkcjlc0t5] {
color: #2c5530;
text-decoration: underline;
}
/* Acceptance Statement */
.acceptance-statement[b-3hkcjlc0t5] {
background: linear-gradient(135deg, #e8f5e8 0%, #d4edda 100%);
padding: 40px;
margin: 0;
text-align: center;
border-top: 4px solid #4a7c59;
}
.statement-content h3[b-3hkcjlc0t5] {
color: #2c5530;
margin-bottom: 1.5rem;
font-size: 1.6rem;
}
.statement-content p[b-3hkcjlc0t5] {
color: #2c5530;
margin-bottom: 1rem;
font-size: 1.05rem;
}
.statement-content p:last-child[b-3hkcjlc0t5] {
margin: 0;
font-weight: 600;
}
/* Buttons */
.terms-page .btn[b-3hkcjlc0t5] {
padding: 14px 28px;
font-size: 1rem;
font-weight: 600;
border: none;
border-radius: 25px;
cursor: pointer;
text-decoration: none;
display: inline-block;
transition: all 0.3s ease;
text-align: center;
}
.terms-page .btn-primary[b-3hkcjlc0t5] {
background: #4a7c59;
color: white;
box-shadow: 0 4px 15px rgba(74, 124, 89, 0.3);
}
.terms-page .btn-primary:hover[b-3hkcjlc0t5] {
background: #3d6249;
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(74, 124, 89, 0.4);
}
.terms-page .btn-secondary[b-3hkcjlc0t5] {
background: transparent;
color: #4a7c59;
border: 2px solid #4a7c59;
}
.terms-page .btn-secondary:hover[b-3hkcjlc0t5] {
background: #4a7c59;
color: white;
transform: translateY(-2px);
}
/* Terms CTA Section */
.terms-cta[b-3hkcjlc0t5] {
padding: 80px 0;
background: linear-gradient(135deg, #2c5530 0%, #1a3d1f 100%);
color: white;
text-align: center;
}
.terms-cta h2[b-3hkcjlc0t5] {
color: white;
font-size: 2.5rem;
margin-bottom: 1.5rem;
border: none;
padding: 0;
}
.terms-cta p[b-3hkcjlc0t5] {
font-size: 1.2rem;
margin-bottom: 2.5rem;
opacity: 0.95;
max-width: 600px;
margin-left: auto;
margin-right: auto;
color: white;
}
.cta-buttons[b-3hkcjlc0t5] {
display: flex;
justify-content: center;
gap: 20px;
flex-wrap: wrap;
}
.terms-cta .btn-primary[b-3hkcjlc0t5] {
background: #ff6b35;
box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3);
}
.terms-cta .btn-primary:hover[b-3hkcjlc0t5] {
background: #e55a2b;
box-shadow: 0 8px 25px rgba(255, 107, 53, 0.4);
}
.terms-cta .btn-secondary[b-3hkcjlc0t5] {
background: transparent;
color: white;
border: 2px solid white;
}
.terms-cta .btn-secondary:hover[b-3hkcjlc0t5] {
background: white;
color: #2c5530;
}
/* Enhanced List Styling */
.terms-page .section-content > ul > li[b-3hkcjlc0t5] {
position: relative;
padding-left: 10px;
}
.terms-page .section-content > ul > li[b-3hkcjlc0t5]::before {
content: "•";
color: #4a7c59;
font-weight: bold;
position: absolute;
left: -15px;
}
/* Subsection Lists */
.terms-page .section-content ul ul[b-3hkcjlc0t5] {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.terms-page .section-content ul ul li[b-3hkcjlc0t5] {
font-size: 0.95rem;
color: #666;
}
/* Strong Text Highlighting */
.terms-page strong[b-3hkcjlc0t5] {
color: #2c5530;
font-weight: 600;
}
/* Link Styling */
.terms-page a[b-3hkcjlc0t5] {
color: #4a7c59;
text-decoration: none;
transition: color 0.3s ease;
}
.terms-page a:hover[b-3hkcjlc0t5] {
color: #2c5530;
text-decoration: underline;
}
/* Responsive Design */
@media (max-width: 1024px) {
.terms-layout[b-3hkcjlc0t5] {
grid-template-columns: 250px 1fr;
gap: 40px;
}
.terms-sidebar[b-3hkcjlc0t5] {
position: static;
}
}
@media (max-width: 768px) {
.terms-page .container[b-3hkcjlc0t5] {
padding: 0 15px;
}
.terms-hero h1[b-3hkcjlc0t5] {
font-size: 2.5rem;
}
.hero-subtitle[b-3hkcjlc0t5] {
font-size: 1.1rem;
}
.terms-layout[b-3hkcjlc0t5] {
grid-template-columns: 1fr;
gap: 30px;
}
.toc-container[b-3hkcjlc0t5] {
padding: 20px;
}
.terms-section[b-3hkcjlc0t5] {
padding: 30px 25px;
}
.terms-intro[b-3hkcjlc0t5] {
padding: 30px 25px;
}
.restrictions-grid[b-3hkcjlc0t5],
.contact-info[b-3hkcjlc0t5] {
grid-template-columns: 1fr;
gap: 20px;
}
.cta-buttons[b-3hkcjlc0t5] {
flex-direction: column;
align-items: center;
}
.terms-page .btn[b-3hkcjlc0t5] {
width: 100%;
max-width: 300px;
}
.terms-page h2[b-3hkcjlc0t5] {
font-size: 1.8rem;
}
.acceptance-statement[b-3hkcjlc0t5] {
padding: 30px 25px;
}
}
@media (max-width: 480px) {
.terms-hero[b-3hkcjlc0t5] {
padding: 60px 0;
}
.terms-hero h1[b-3hkcjlc0t5] {
font-size: 2rem;
}
.terms-content[b-3hkcjlc0t5] {
padding: 40px 0;
}
.terms-section[b-3hkcjlc0t5] {
padding: 25px 20px;
}
.terms-intro[b-3hkcjlc0t5] {
padding: 25px 20px;
}
.toc-container[b-3hkcjlc0t5] {
padding: 15px;
}
.important-notice[b-3hkcjlc0t5] {
padding: 20px;
}
.restriction-category[b-3hkcjlc0t5] {
padding: 20px;
}
.contact-info[b-3hkcjlc0t5] {
padding: 25px 20px;
}
.acceptance-statement[b-3hkcjlc0t5] {
padding: 25px 20px;
}
.terms-cta[b-3hkcjlc0t5] {
padding: 60px 0;
}
.terms-cta h2[b-3hkcjlc0t5] {
font-size: 2rem;
}
}
/* Print Styles */
@media print {
.terms-hero[b-3hkcjlc0t5],
.terms-cta[b-3hkcjlc0t5],
.terms-sidebar[b-3hkcjlc0t5] {
display: none;
}
.terms-layout[b-3hkcjlc0t5] {
grid-template-columns: 1fr;
}
.terms-main[b-3hkcjlc0t5] {
box-shadow: none;
border: 1px solid #ddd;
}
.terms-section[b-3hkcjlc0t5] {
page-break-inside: avoid;
border-bottom: 1px solid #ddd;
}
.terms-page[b-3hkcjlc0t5] {
color: #000;
}
.terms-page h2[b-3hkcjlc0t5] {
color: #000;
border-bottom: 2px solid #000;
}
}