:root {
  --bg:#fff;
  --fg:#E88C00;
  --accent:#0000ff;
  --panel:#f4f4f4;
  --max-width:1200px;
  --nav-height:72px;
  --transition:.3s ease;
}

/* Global Styles */
* { box-sizing:border-box; margin:0; padding:0; }
html, body { overflow-x:hidden; font-family:"Poppins",sans-serif; background:var(--bg); color:var(--fg); line-height:1.5; scroll-behavior:smooth; }
.container { width:92%; max-width:var(--max-width); margin:0 auto; padding:0 16px; }

/* NAVBAR */
.navbar { position:fixed; top:0; left:0; right:0; height:var(--nav-height); background:#0a0a0a; display:flex; align-items:center; z-index:1200; box-shadow:0 2px 8px rgba(0,0,0,.12);}
.nav-inner { width:100%; display:flex; justify-content:space-between; align-items:center; }
.logo { display:flex; align-items:center; gap:10px; font-weight:900; color:#fff; text-decoration:none; }
.logo-img { height:36px; }
.nav-list { display:flex; gap:22px; list-style:none; transition:left .3s ease; }
.nav-list li a { color:#E88C00; text-decoration:none; font-weight:500; }
.contact-link { color:#fff; background:var(--fg); padding:8px 14px; border-radius:999px; font-weight:700; }

.dropdown { position:relative; }
.dropdown-menu { display:none; position:absolute; top:100%; left:0; background:#0a0a0a; min-width:180px; z-index:1500; }
.dropdown:hover .dropdown-menu { display:block; }

.nav-toggle { display:none; background:none; border:none; color:#E88C00; font-size:1.8rem; cursor:pointer; }

/* MOBILE NAV */
@media(max-width:700px){
  .nav-toggle { display:block; }
  .nav-list {
    position:fixed;
    top:72px;
    left:-250px; /* off-screen */
    width:250px;
    height:calc(100% - 72px);
    background:#0a0a0a;
    flex-direction:column;
    padding-top:20px;
    gap:0;
    overflow-y:auto;
    transition:left 0.3s ease;
    z-index:1400;
  }
  .nav-list.active { left:0; } /* slide in */
  .nav-list li { width:100%; }
  .nav-list li a { display:block; padding:14px 20px; }
  .dropdown-menu { position:static; background:transparent; min-width:auto; padding-left:20px; display:none !important; }
  .dropdown.open > .dropdown-menu { display:block !important; }
}

/* HERO */
.hero-section { padding-top:var(--nav-height); text-align:center; background:linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.5)), url("images/branding.jpg") center/cover no-repeat; color:#fff; }
.hero-inner { max-width:800px; margin:0 auto; padding:80px 20px; animation:fadeInUp 1s forwards; box-sizing:border-box; }
.hero-title { font-size:clamp(28px,6vw,48px); font-weight:900; margin-bottom:20px; }
.hero-lead { font-size:1.1rem; margin-bottom:30px; color:#e6e8ee; }
.cta { background:var(--accent); color:#fff; padding:12px 24px; border-radius:6px; text-decoration:none; display:inline-block; }

/* CARDS */
.cards { display:flex; flex-wrap:wrap; gap:24px; justify-content:center; margin-top:40px; }
.card { background:var(--panel); border:1px solid #e6e6e6; flex:1 1 300px; max-width:320px; padding:22px; border-radius:10px; text-align:center; word-wrap:break-word; }
.card-icon { font-size:28px; margin-bottom:12px; color:var(--fg); }
.view-more { display:inline-block; margin-top:16px; padding:10px 20px; background:var(--fg); color:#fff; border-radius:8px; text-decoration:none; }

/* GALLERY */
.gallery { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:24px; }
.gallery-item img { width:100%; border-radius:8px; height:auto; display:block; }

/* CTA SECTION */
.cta-section { text-align:center; padding:72px 20px; background:var(--panel); }

/* FOOTER */
.site-footer { background:var(--fg); color:#fff; padding:48px 20px 26px; margin-top:40px; font-size:14px; }
.footer-top { display:grid; grid-template-columns:minmax(220px,1fr) repeat(3,minmax(160px,1fr)); gap:32px; max-width:1200px; margin:0 auto; }
@media(max-width:700px){ .footer-top { display:flex; flex-direction:column; gap:32px; } }
.footer-brand .footer-logo { font-weight:900; font-size:1.3rem; display:block; margin-bottom:12px; }
.footer-desc, .footer-links ul, .footer-links ul li a { word-wrap:break-word; word-break:break-word; }
.footer-links ul { padding-left:0; margin:0; }
.footer-links ul li { list-style:none; margin-bottom:6px; max-width:100%; }
.footer-links ul li a { display:inline-block; max-width:100%; white-space:normal; color:#fff; text-decoration:none; transition:color 0.2s ease; }
.footer-links ul li a:hover { color:#ccc; }
.footer-links h4 { font-weight:700; margin-bottom:12px; }
.socials { list-style:none; display:flex; gap:12px; padding-left:0; margin:0; }
.socials li a { color:#fff; font-size:1.1rem; text-decoration:none; }
.footer-bottom { margin-top:28px; border-top:1px solid rgba(255,255,255,.2); padding-top:16px; text-align:center; max-width:1200px; margin-left:auto; margin-right:auto; }

/* WHATSAPP FLOAT */
.whatsapp-float { position:fixed; bottom:22px; right:22px; width:56px; height:56px; background:#25D366; color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:28px; z-index:1500; cursor:pointer; }

/* ANIMATION */
@keyframes fadeInUp { from{opacity:0; transform:translateY(20px);} to{opacity:1; transform:translateY(0);} }
img, video, iframe { max-width:100%; height:auto; display:block; }
