:root {
    --primary: #05386b;
    --secondary: #edf5e1;
    --accent: #379683;
}
body { font-family: 'Inter', 'Jost', sans-serif; color: #1e293b; }
.text-primary { color: var(--primary) !important; }
.bg-primary { background-color: var(--primary) !important; }
.navbar { box-shadow: 0 1px 3px rgba(0,0,0,0.08); }
.navbar-brand { font-size: 1.25rem; color: var(--primary) !important; }
.nav-link { font-weight: 500; color: #475569 !important; transition: color 0.2s; }
.nav-link:hover, .nav-link.active { color: var(--accent) !important; }
.hero-section { background-color: var(--secondary); position: relative; overflow: hidden; min-height: 400px; display: flex; align-items: center; }
.hero-section .hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.hero-section .hero-overlay { position: absolute; inset: 0; }
.hero-section .hero-content { position: relative; z-index: 2; }
blockquote { border-left: 4px solid var(--accent); padding: 1rem 1.5rem; background: #f8fafc; border-radius: 0 0.5rem 0.5rem 0; }
.btn-custom { background-color: var(--accent); color: #fff; border: none; padding: 0.75rem 2rem; border-radius: 0.5rem; font-weight: 600; transition: background-color 0.2s; }
.btn-custom:hover { background-color: #2d7a68; color: #fff; }
.btn-outline-custom { border: 2px solid var(--accent); color: var(--accent); padding: 0.75rem 2rem; border-radius: 0.5rem; font-weight: 600; background: transparent; transition: all 0.2s; }
.btn-outline-custom:hover { background-color: var(--accent); color: #fff; }
.gallery-header { background-color: var(--primary); color: #fff; padding: 3rem 0; }
.contact-section iframe { border-radius: 0.5rem; border: 1px solid #e2e8f0; }
section.py-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; }
@media (prefers-reduced-motion: reduce) {
    * { animation: none !important; transition: none !important; }
}
/* ===== RESPONSIVE / MOBILE ===== */

/* Navbar mobile */
@media (max-width: 991.98px) {
    .navbar-brand { font-size: 1.1rem; }
    .navbar-nav { padding: 0.5rem 0; }
    .nav-link { padding: 0.6rem 0; font-size: 1rem; }
}

/* Hero section mobile */
@media (max-width: 767.98px) {
    .hero-section { min-height: 280px; }
    .hero-section .container { padding-top: 2rem !important; padding-bottom: 2rem !important; }
    .hero-section h1.display-4 { font-size: 1.75rem; }
    .hero-section .lead { font-size: 1rem; }
    section.py-5 { padding-top: 2rem !important; padding-bottom: 2rem !important; }
}

/* Home page lightbox mobile */
@media (max-width: 991.98px) {
    #homeLightbox > div { flex-direction: column !important; }
    #homeLightbox > div > div:first-child { flex: 1 1 55% !important; }
    #homeLightbox > div > div:last-child { flex: 0 0 auto !important; max-height: 35vh; padding: 1.5rem; }
}
@media (max-width: 575.98px) {
    #homeLightbox > div > div:last-child { padding: 1rem; }
    #homeLightbox h3 { font-size: 1.1rem; }
}

/* Gallery page mobile */
@media (max-width: 767.98px) {
    .gallery-hero { padding: 1.5rem 0; }
    .gallery-hero h1 { font-size: 1.5rem; }
    .g-cinematic .cin-text { padding: 1.5rem 1rem; }
    .g-cinematic .cin-text h3 { font-size: 1.2rem; }
    .g-flipcard .flip-card { height: 320px; }
    .g-flipcard .flip-back { padding: 1.25rem; }
    .g-flipcard .flip-back h5 { font-size: 1rem; }
    .g-flipcard .flip-back p { font-size: 0.8rem; }
    .g-fullscreen .fs-slide .fs-content { padding: 1rem; }
    .g-fullscreen .fs-slide .fs-content h2 { font-size: 1.5rem; }
    .g-fullscreen .fs-slide .fs-content p { font-size: 0.85rem; }
    .lb-nav { width: 36px; height: 36px; font-size: 1.2rem; }
    .lb-prev { left: 0.5rem; }
    .lb-next { right: 0.5rem; }
    .lb-info { padding: 1rem; }
    .lb-info h3 { font-size: 1.1rem; }
}

/* Contact page mobile */
@media (max-width: 767.98px) {
    .contact-section iframe { height: 250px; }
}

/* Buttons mobile */
@media (max-width: 575.98px) {
    .btn-custom, .btn-outline-custom { padding: 0.6rem 1.25rem; font-size: 0.9rem; }
}

/* Touch device: flip cards tap to flip instead of hover */
@media (hover: none) and (pointer: coarse) {
    .g-flipcard .flip-card { cursor: pointer; }
    .g-flipcard .flip-card:hover .flip-inner { transform: none; }
    .g-flipcard .flip-card.flipped .flip-inner { transform: rotateY(180deg); }
}

/* iOS smooth scrolling */
.g-fullscreen { -webkit-overflow-scrolling: touch; }

/* Prevent horizontal overflow on mobile */
body { overflow-x: hidden; }

/* Mobile: make sure containers don't overflow */
.container { max-width: 100%; }

/* Mobile: improve tap targets for nav */
@media (max-width: 991.98px) {
    .navbar-toggler { padding: 0.5rem 0.75rem; min-height: 44px; min-width: 44px; }
}

/* Mobile: form inputs bigger for touch */
@media (max-width: 575.98px) {
    .form-control { font-size: 16px; padding: 0.75rem; }
    .form-label { font-size: 0.9rem; }
}
