@import url('https://fonts.googleapis.com/css2?family=Urbanist:wght@400;500;600;700&family=Inter:wght@300;400;500&display=swap');*, *::before, *::after {margin:0;padding:0;box-sizing:border-box;} :root {--orange:#e54d1e;--orange-dark:#c9411a;--blue-light:#d3e7e9;--beige:#F3ECDB;--white:#ffffff;--gray-light:#f5f5f5;--gray:#888;--gray-dark:#333;--black:#111;--font-heading:'Urbanist', sans-serif;--font-body:'Inter', sans-serif;} html {scroll-behavior:smooth;} body {font-family:var(--font-body);color:var(--gray-dark);line-height:1.7;font-size:16px;background:var(--white);} a {text-decoration:none;color:inherit;} img {max-width:100%;height:auto;display:block;} .container {max-width:1200px;margin:0 auto;padding:0 20px;} header {position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(255,255,255,0.85);backdrop-filter:blur(10px);border-bottom:1px solid rgba(0,0,0,0.05);transition:box-shadow 0.3s;} header.scrolled {box-shadow:0 2px 20px rgba(0,0,0,0.08);} header .container {display:flex;align-items:center;justify-content:space-between;height:80px;} .logo {font-family:var(--font-heading);font-size:1.5rem;font-weight:700;color:var(--black);} .logo span {display:block;font-size:0.7rem;font-weight:400;color:var(--gray);letter-spacing:1px;} nav {display:flex;align-items:center;gap:30px;} nav a {font-family:var(--font-heading);font-size:0.95rem;font-weight:500;color:var(--gray-dark);transition:color 0.3s;position:relative;} nav a:hover, nav a.active {color:var(--orange);} nav a::after {content:'';position:absolute;bottom:-4px;left:0;width:0;height:2px;background:var(--orange);transition:width 0.3s;} nav a:hover::after, nav a.active::after {width:100%;} .header-phone {font-family:var(--font-heading);font-weight:600;font-size:0.95rem;color:var(--orange);} .header-phone:hover {color:var(--orange-dark);} .header-instagram {display:flex;align-items:center;justify-content:center;color:var(--gray-dark);transition:color 0.3s;} .header-instagram:hover {color:var(--orange);} .hamburger {display:none;flex-direction:column;gap:5px;cursor:pointer;padding:5px;background:transparent;border:none;} .hamburger span {display:block;width:25px;height:2px;background:var(--black);transition:0.3s;} .hero {position:relative;height:70vh;min-height:400px;max-height:600px;display:flex;align-items:center;overflow:hidden;margin-top:80px;max-width:1400px;margin-left:auto;margin-right:auto;border-radius:0 0 20px 20px;} .hero-bg {position:absolute;inset:0;z-index:0;} @keyframes heroZoom {0% {transform:scale(1);} 100% {transform:scale(1.05);}} .hero-bg img {width:100%;height:100%;object-fit:cover;animation:heroZoom 15s ease-in-out infinite alternate;} .hero-bg::after {content:'';position:absolute;inset:0;background:linear-gradient(135deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.2) 100%);} .hero-content {position:relative;z-index:1;color:var(--white);padding:0 60px;max-width:700px;} .hero-content .subtitle {font-family:var(--font-heading);font-size:0.9rem;font-weight:500;letter-spacing:3px;text-transform:uppercase;margin-bottom:15px;opacity:0.9;} .hero-content h1 {font-family:var(--font-heading);font-size:3.2rem;font-weight:700;line-height:1.2;margin-bottom:15px;} .hero-content p {font-size:1.2rem;font-weight:300;opacity:0.9;} .btn {display:inline-block;font-family:var(--font-heading);font-weight:600;font-size:0.95rem;padding:14px 35px;border-radius:50px;transition:all 0.3s;cursor:pointer;border:none;} .btn-primary {background:var(--orange);color:var(--white);} .btn-primary:hover {background:var(--orange-dark);transform:translateY(-2px);box-shadow:0 8px 25px rgba(229,77,30,0.3);} .btn-outline {background:transparent;color:var(--orange);border:2px solid var(--orange);} .btn-outline:hover {background:var(--orange);color:var(--white);} section {padding:100px 0;} .section-title {font-family:var(--font-heading);font-size:2.2rem;font-weight:700;color:var(--black);margin-bottom:15px;} .section-subtitle {font-size:1rem;color:var(--gray);max-width:600px;margin-bottom:50px;} .text-center {text-align:center;} .text-center .section-subtitle {margin-left:auto;margin-right:auto;} .services {background:var(--white);} .services-grid {display:grid;grid-template-columns:repeat(3, 1fr);gap:30px;} .service-card {border-radius:15px;overflow:hidden;background:var(--white);box-shadow:0 5px 30px rgba(0,0,0,0.06);transition:transform 0.3s, box-shadow 0.3s;} .service-card:hover {transform:translateY(-8px);box-shadow:0 15px 40px rgba(0,0,0,0.1);} .service-card .card-img {height:250px;overflow:hidden;} .service-card .card-img img {width:100%;height:100%;object-fit:cover;transition:transform 0.5s;} .service-card:hover .card-img img {transform:scale(1.05);} .service-card .card-body {padding:25px;} .service-card h3 {font-family:var(--font-heading);font-size:1.2rem;font-weight:600;margin-bottom:10px;color:var(--black);} .service-card p {font-size:0.9rem;color:var(--gray);line-height:1.6;} .philosophy {background:var(--beige);} .split {display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;} .split-img {border-radius:15px;overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,0.1);} .split-img img {width:100%;height:100%;object-fit:cover;} .split-text h2 {font-family:var(--font-heading);font-size:2rem;font-weight:700;color:var(--black);margin-bottom:20px;line-height:1.3;} .split-text p {margin-bottom:15px;color:var(--gray-dark);line-height:1.8;} .split-text .btn {margin-top:15px;} .projects {background:var(--gray-light);} .projects-grid {display:grid;grid-template-columns:repeat(3, 1fr);gap:30px;} .project-card {position:relative;border-radius:15px;overflow:hidden;height:400px;cursor:pointer;} .project-card img {width:100%;height:100%;object-fit:cover;transition:transform 0.5s;} .project-card:hover img {transform:scale(1.08);} .project-card .overlay {position:absolute;inset:0;background:linear-gradient(to top, rgba(0,0,0,0.7) 0%, transparent 60%);display:flex;flex-direction:column;justify-content:flex-end;padding:30px;color:var(--white);transition:background 0.3s;} .project-card:hover .overlay {background:linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.2) 60%);} .project-card .overlay h3 {font-family:var(--font-heading);font-size:1.3rem;font-weight:600;margin-bottom:8px;} .project-card .overlay p {font-size:0.85rem;opacity:0.9;line-height:1.5;} .testimonials {background:var(--white);} .testimonials-grid {display:grid;grid-template-columns:repeat(2, 1fr);gap:30px;} .testimonial-card {background:var(--gray-light);border-radius:15px;padding:35px;transition:transform 0.3s;} .testimonial-card:hover {transform:translateY(-5px);} .testimonial-header {display:flex;align-items:center;gap:15px;margin-bottom:15px;} .testimonial-avatar {width:50px;height:50px;border-radius:50%;background:var(--blue-light);display:flex;align-items:center;justify-content:center;font-family:var(--font-heading);font-weight:700;font-size:1.1rem;color:var(--orange);flex-shrink:0;} .testimonial-name {font-family:var(--font-heading);font-weight:600;font-size:1rem;color:var(--black);} .testimonial-stars {color:#f5a623;font-size:0.9rem;letter-spacing:2px;} .testimonial-card p {font-size:0.9rem;color:var(--gray-dark);line-height:1.7;font-style:italic;} .cta-section {background:var(--beige);} .cta-content {text-align:center;max-width:700px;margin:0 auto;} .cta-content h2 {font-family:var(--font-heading);font-size:2.2rem;font-weight:700;color:var(--black);margin-bottom:20px;} .cta-content p {margin-bottom:30px;color:var(--gray-dark);} .page-hero {margin-top:80px;padding:80px 0;background:var(--beige);text-align:center;} .page-hero h1 {font-family:var(--font-heading);font-size:2.8rem;font-weight:700;color:var(--black);margin-bottom:10px;} .page-hero p {font-size:1.1rem;color:var(--gray);} .about-content {background:var(--white);} .gallery-section {background:var(--white);} .gallery-filters {display:flex;flex-wrap:wrap;gap:10px;margin-bottom:40px;justify-content:center;} .filter-btn {font-family:var(--font-heading);font-size:0.9rem;font-weight:500;padding:10px 25px;border-radius:50px;border:2px solid #ddd;background:transparent;cursor:pointer;transition:all 0.3s;color:var(--gray-dark);} .filter-btn:hover, .filter-btn.active {border-color:var(--orange);background:var(--orange);color:var(--white);} .gallery-grid {display:grid;grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));gap:15px;} .gallery-item {border-radius:10px;overflow:hidden;height:280px;cursor:pointer;position:relative;} .gallery-item img {width:100%;height:100%;object-fit:cover;transition:transform 0.4s;} .gallery-item:hover img {transform:scale(1.05);} .gallery-item .gallery-overlay {position:absolute;inset:0;background:rgba(0,0,0,0);transition:background 0.3s;display:flex;align-items:center;justify-content:center;} .gallery-item:hover .gallery-overlay {background:rgba(0,0,0,0.3);} .gallery-item .gallery-overlay svg {opacity:0;transition:opacity 0.3s;color:white;} .gallery-item:hover .gallery-overlay svg {opacity:1;} .contact-section {background:var(--white);} .contact-grid {display:grid;grid-template-columns:1fr 1fr;gap:60px;} .contact-info {display:flex;flex-direction:column;gap:30px;} .contact-item {display:flex;align-items:flex-start;gap:15px;} .contact-icon {width:50px;height:50px;border-radius:50%;background:var(--beige);display:flex;align-items:center;justify-content:center;flex-shrink:0;} .contact-icon svg {width:22px;height:22px;color:var(--orange);} .contact-item h4 {font-family:var(--font-heading);font-weight:600;margin-bottom:4px;color:var(--black);} .contact-item p, .contact-item a {color:var(--gray);font-size:0.95rem;} .contact-item a:hover {color:var(--orange);} .contact-form h3 {font-family:var(--font-heading);font-size:1.5rem;font-weight:600;margin-bottom:10px;color:var(--black);} .contact-form > p {color:var(--gray);margin-bottom:25px;font-size:0.9rem;} .form-group {margin-bottom:20px;} .form-group label {display:block;font-family:var(--font-heading);font-weight:500;font-size:0.9rem;margin-bottom:6px;color:var(--gray-dark);} .form-group input, .form-group textarea {width:100%;padding:12px 16px;border:1px solid #ddd;border-radius:10px;font-family:var(--font-body);font-size:0.95rem;transition:border-color 0.3s;background:var(--gray-light);} .form-group input:focus, .form-group textarea:focus {outline:none;border-color:var(--orange);} .form-group textarea {height:150px;resize:vertical;} .form-row {display:grid;grid-template-columns:1fr 1fr;gap:20px;} footer {background:var(--black);color:rgba(255,255,255,0.7);padding:60px 0 30px;} .footer-top {display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:40px;flex-wrap:wrap;gap:30px;} .footer-brand .logo {color:var(--white);margin-bottom:8px;} .footer-brand p {font-size:0.85rem;color:rgba(255,255,255,0.5);} .footer-links {display:flex;gap:25px;} .footer-links a {font-size:0.9rem;transition:color 0.3s;} .footer-links a:hover {color:var(--orange);} .footer-social a {display:inline-flex;align-items:center;gap:6px;font-size:0.9rem;transition:color 0.3s;} .footer-social a:hover {color:var(--orange);} .footer-bottom {border-top:1px solid rgba(255,255,255,0.1);padding-top:20px;text-align:center;font-size:0.8rem;color:rgba(255,255,255,0.4);} .lightbox {display:none;position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,0.92);align-items:center;justify-content:center;} .lightbox.active {display:flex;} .lightbox img {max-width:90vw;max-height:90vh;border-radius:8px;} .lightbox-close {position:absolute;top:20px;right:30px;color:white;font-size:2rem;cursor:pointer;background:none;border:none;padding:10px;} .lightbox-nav {position:absolute;top:50%;transform:translateY(-50%);color:white;font-size:2.5rem;cursor:pointer;background:none;border:none;padding:20px;opacity:0.7;transition:opacity 0.3s;} .lightbox-nav:hover {opacity:1;} .lightbox-prev {left:10px;} .lightbox-next {right:10px;} @media (max-width:968px) {.services-grid, .projects-grid {grid-template-columns:repeat(2, 1fr);} .split {grid-template-columns:1fr;gap:40px;} .contact-grid {grid-template-columns:1fr;} .hero-content h1 {font-size:2.5rem;} .hero-content {padding:0 30px;}} @media (max-width:768px) {nav {position:fixed;top:80px;left:0;right:0;background:white;flex-direction:column;padding:30px;gap:20px;transform:translateY(-110%);transition:transform 0.3s, visibility 0.3s;box-shadow:0 10px 30px rgba(0,0,0,0.1);visibility:hidden;pointer-events:none;} nav.open {transform:translateY(0);visibility:visible;pointer-events:auto;} .hamburger {display:flex;} .header-phone {display:none;} .services-grid, .projects-grid, .testimonials-grid {grid-template-columns:1fr;} .hero {height:70vh;} .hero-content h1 {font-size:2rem;} section {padding:60px 0;} .section-title {font-size:1.8rem;} .gallery-grid {grid-template-columns:repeat(2, 1fr);} .form-row {grid-template-columns:1fr;} .footer-top {flex-direction:column;align-items:center;text-align:center;} .footer-links {flex-wrap:wrap;justify-content:center;}} @media (max-width:480px) {.gallery-grid {grid-template-columns:1fr;}}