/*
 * Folha de Estilos Personalizada v6.13 para o Site MacHelp Lisboa Portugal
 * Com novo menu dropdown e scroll suave.
 */

/* ------------------------------------------- */
/* --- IMPORTAÇÕES E VARIÁVEIS GLOBAIS --- */
/* ------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');

:root {
    --bs-primary: #0070c9;
    --bs-primary-rgb: 0, 112, 201;
    --bs-secondary: #6c757d;
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    --text-dark: #333;
    --text-light: #f8f9fa;
}

/* ------------------------------------------- */
/* --- ESTILOS GERAIS --- */
/* ------------------------------------------- */
html {
    scroll-behavior: smooth; /* Animação de scroll suave */
}

body { font-family: 'Poppins', sans-serif; color: var(--text-dark); }
h1, h2, h3, h4, h5, h6 { font-weight: 700; }
.section-padding { padding: 80px 0; }
.section-title { margin-bottom: 4rem; }
.btn-primary { --bs-btn-bg: var(--bs-primary); --bs-btn-border-color: var(--bs-primary); --bs-btn-hover-bg: #005a9e; --bs-btn-hover-border-color: #005a9e; padding: 12px 30px; font-weight: 600; border-radius: 8px; transition: all 0.3s ease; }
.btn-primary:hover { transform: translateY(-3px); box-shadow: 0 4px 15px rgba(0, 112, 201, 0.3); }
.navbar { box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important; }

/* ------------------------------------------- */
/* --- ESTILOS DE PÁGINAS ESPECÍFICAS --- */
/* ------------------------------------------- */
#hero-carousel .carousel-item { height: 650px; background-color: #333; }
#hero-carousel .carousel-item img { height: 100%; object-fit: cover; opacity: 0.5; }
#hero-carousel .carousel-caption { bottom: 50%; transform: translateY(50%); padding: 2rem; text-shadow: 1px 1px 3px rgba(0,0,0,0.7); }
@media (max-width: 768px) { #hero-carousel .carousel-item { height: 500px; } }

.apple-style-hero { background-color: #f5f5f7; width: 100%; height: 500px; padding: 30px 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; overflow: hidden; }
.about-hero { position: relative; padding: 120px 0; background: url('https://images.unsplash.com/photo-1522204523234-8729aa6e3d5f?q=80&w=2070&auto=format&fit=crop') no-repeat center center; background-size: cover; background-attachment: fixed; }
.about-hero-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 47, 85, 0.7); }
.contact-hero { position: relative; padding: 120px 0; background-color: var(--bs-dark); }
.contact-hero-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.2); opacity: 0.5; }

/* NOVO: Margem para os títulos com âncora para não ficarem atrás do menu */
.section-anchor {
    scroll-margin-top: 100px;
}

/* ------------------------------------------- */
/* --- ESTILOS DE COMPONENTES --- */
/* ------------------------------------------- */
.why-us-card, .value-card { background-color: #ffffff; border: 1px solid #e9ecef; padding: 35px; text-align: center; border-radius: 15px; height: 100%; transition: transform 0.3s ease, box-shadow 0.3s ease; box-shadow: 0 5px 15px rgba(0,0,0,0.04); }
.why-us-card:hover, .value-card:hover { transform: translateY(-10px); box-shadow: 0 15px 30px rgba(0,0,0,0.1); }
.why-us-card .icon-box, .value-card .icon-box { margin: 0 auto 25px auto; width: 70px; height: 70px; background-color: var(--bs-primary); color: var(--text-light); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 32px; transition: all 0.4s ease; }
.why-us-card:hover .icon-box, .value-card:hover .icon-box { background-color: var(--bs-dark); transform: rotate(15deg); }

.repair-card { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 20px; border: 1px solid #e9ecef; border-radius: 10px; height: 100%; text-decoration: none; color: var(--text-dark); transition: all 0.3s ease; background-color: #fff; }
.repair-card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.08); color: var(--bs-primary); }
.model-support-card { background-color: #fff; border-radius: 15px; box-shadow: 0 10px 30px rgba(0,0,0,0.07); overflow: hidden; transition: all 0.4s ease; height: 100%; }
.model-support-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.15); }
.model-support-card img { width: 100%; height: 200px; object-fit: cover; transition: transform 0.4s ease; }
.model-support-card:hover img { transform: scale(1.05); }

/* ------------------------------------------- */
/* --- ESTILOS DO RODAPÉ (VERSÃO PRETA FINAL) --- */
/* ------------------------------------------- */
.footer { background-color: var(--bs-dark); color: #cccccc; padding-top: 3.5rem; }
.footer .footer-brand { color: #ffffff; font-weight: 700; font-size: 1.5rem; }
.footer .footer-text { font-size: 0.9rem; max-width: 300px; }
.footer .footer-heading { color: #ffffff; font-size: 1rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 1rem; }
.footer .footer-links a { color: #cccccc; text-decoration: none; transition: all 0.3s ease; }
.footer .footer-links a:hover { color: #ffffff; padding-left: 5px; }
.footer .footer-contact i { color: var(--bs-primary); margin-right: 10px; margin-top: 4px; }
.footer .social-icons .social-icon { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; background-color: #343a40; color: #ffffff; border-radius: 50%; margin-right: 10px; text-decoration: none; transition: all 0.3s ease; }
.footer .social-icons .social-icon:hover { background-color: var(--bs-primary); }
.footer .footer-bottom { border-top: 1px solid #343a40; background-color: transparent; padding: 1rem 0; margin-top: 2rem; font-size: 0.85rem; color: #cccccc; }