/* --- Home.css --- */

.hero { 
    padding: 10rem 0; 
    text-align: center; 
    background: radial-gradient(circle at top, #fffdf5 0%, transparent 70%);
}

.hero h1 { 
    font-size: 4rem; 
    font-weight: 800; 
    color: #4a4a4a;
    font-family: 'Quicksand', sans-serif;
    letter-spacing: -1px;
}

.hero h1 span { 
    background: linear-gradient(90deg, #ffb347, #ff6600); 
    background-clip: text; 
    -webkit-background-clip: text; 
    color: transparent;
    -webkit-text-fill-color: transparent; 
}

.hero p { 
    color: #6a6a6a; 
    font-size: 1.3rem; 
    margin-top: 1.5rem; 
    font-family: 'Varela Round', sans-serif;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.cta-container {
    margin-top: 3rem;
    display: flex;
    justify-content: center;
    gap: 1.5rem;
}

/* Primary Button Style */
.btn-primary {
    background: var(--pet-gold);
    color: white;
    padding: 1.1rem 2.5rem;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700;
    box-shadow: 0 4px 15px rgba(255, 179, 71, 0.3);
    transition: 0.3s;
}

.btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(255, 179, 71, 0.4);
}

/* Secondary Button Style */
.btn-secondary {
    background: white;
    color: var(--pet-gold);
    padding: 1.1rem 2.5rem;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700;
    border: 2px solid var(--pet-gold);
    transition: 0.3s;
}

.btn-secondary:hover {
    background: var(--pet-gold);
    color: white;
}

.home-footer {
    text-align: center;
    padding: 2rem;
    color: #aaa;
    font-size: 0.85rem;
}

/* Mobile Responsive Adjustments */
@media (max-width: 768px) {
    .hero { padding: 6rem 0; }
    .hero h1 { font-size: 2.8rem; }
    .cta-container { flex-direction: column; align-items: center; gap: 1rem; }
    .btn-primary, .btn-secondary { width: 80%; }
}