/* ═══════════════════════════════════════════
   CORPROINCO – SHARED STYLES
   ═══════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: 'Open Sans', sans-serif; color: #0D2137; background: #fff; margin: 0; }
h1,h2,h3,h4,h5 { font-family: 'Montserrat', sans-serif; }
a { text-decoration: none; }

/* ── NAVBAR ── */
#navbar { transition: background 0.3s, box-shadow 0.3s; }
#navbar.scrolled { background: #0D2137 !important; box-shadow: 0 2px 20px rgba(0,0,0,0.25); }
#navbar.solid   { background: #0D2137 !important; }

/* ── SECTION TAG ── */
.section-tag {
  display: inline-block;
  background: rgba(242,108,33,0.12);
  color: #F26C21;
  font-family: 'Montserrat', sans-serif;
  font-size: 0.7rem; font-weight: 700;
  letter-spacing: 0.15em; text-transform: uppercase;
  padding: 5px 14px; border-radius: 2px; margin-bottom: 12px;
}

/* ── ORANGE BAR ── */
.orange-bar { height: 4px; background: linear-gradient(90deg, #F26C21, #F5873E); }

/* ── BUTTONS ── */
.btn-orange {
  background: #F26C21; color: #fff;
  font-family: 'Montserrat', sans-serif; font-weight: 700;
  letter-spacing: 0.03em; border: none;
  transition: background 0.2s, transform 0.2s; cursor: pointer; display: inline-block;
}
.btn-orange:hover { background: #D4570F; transform: translateY(-2px); }
.btn-outline-white {
  background: transparent; color: #fff;
  font-family: 'Montserrat', sans-serif; font-weight: 600;
  border: 2px solid rgba(255,255,255,0.5);
  transition: background 0.2s, border-color 0.2s; cursor: pointer; display: inline-block;
}
.btn-outline-white:hover { background: rgba(255,255,255,0.1); border-color: #fff; }
.btn-outline-navy {
  background: transparent; color: #0D2137;
  font-family: 'Montserrat', sans-serif; font-weight: 600;
  border: 2px solid #0D2137;
  transition: background 0.2s, color 0.2s; cursor: pointer; display: inline-block;
}
.btn-outline-navy:hover { background: #0D2137; color: #fff; }

/* ── MOBILE MENU ── */
#mobile-menu { display: none; }
#mobile-menu.open { display: block; }

/* ── SCROLL REVEAL ── */
.reveal { opacity: 0; transform: translateY(30px); transition: opacity 0.7s, transform 0.7s; }
.reveal.visible { opacity: 1; transform: translateY(0); }
.reveal-left { opacity: 0; transform: translateX(-30px); transition: opacity 0.7s, transform 0.7s; }
.reveal-left.visible { opacity: 1; transform: translateX(0); }
.reveal-right { opacity: 0; transform: translateX(30px); transition: opacity 0.7s, transform 0.7s; }
.reveal-right.visible { opacity: 1; transform: translateX(0); }

/* ── PAGE HERO (inner pages) ── */
.page-hero {
  background: linear-gradient(135deg, #071525 0%, #0D2137 50%, #16355A 100%);
  padding: 130px 0 70px; position: relative; overflow: hidden;
}
.page-hero::after {
  content: ''; position: absolute; top: -200px; right: -200px;
  width: 600px; height: 600px; border-radius: 50%;
  background: radial-gradient(circle, rgba(242,108,33,0.12) 0%, transparent 70%);
}
.page-hero-title {
  font-family: 'Montserrat', sans-serif; font-weight: 900;
  font-size: clamp(2rem,5vw,3.2rem); color: #fff; margin: 0 0 14px; line-height: 1.15;
}
.page-hero-sub {
  color: rgba(255,255,255,0.6); font-size: 1rem; max-width: 560px; line-height: 1.75;
}

/* ── BREADCRUMB ── */
.breadcrumb { display: flex; align-items: center; gap: 8px; margin-bottom: 20px; }
.breadcrumb a { color: rgba(255,255,255,0.45); font-size: 0.78rem; font-family: 'Montserrat', sans-serif; }
.breadcrumb a:hover { color: #F26C21; }
.breadcrumb span { color: rgba(255,255,255,0.3); font-size: 0.78rem; }
.breadcrumb .current { color: #F26C21; font-size: 0.78rem; font-family: 'Montserrat', sans-serif; font-weight: 600; }

/* ── CONTACT INPUTS ── */
.contact-input {
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.15);
  color: #fff; border-radius: 3px; padding: 12px 16px; width: 100%;
  font-family: 'Open Sans', sans-serif; font-size: 0.9rem;
  transition: border-color 0.2s; outline: none;
}
.contact-input::placeholder { color: rgba(255,255,255,0.4); }
.contact-input:focus { border-color: #F26C21; }

/* ── FLOATING WA ── */
.wa-float {
  position: fixed; bottom: 28px; right: 28px; z-index: 999;
  width: 58px; height: 58px; border-radius: 50%; background: #25D366;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 24px rgba(37,211,102,0.45);
  transition: transform 0.2s, box-shadow 0.2s;
}
.wa-float:hover { transform: scale(1.1); box-shadow: 0 10px 30px rgba(37,211,102,0.55); }

/* ── FOOTER ── */
footer { background: #071525; }

/* ── ACTIVE NAV LINK ── */
.nav-link-active { color: #F26C21 !important; }

/* ── ANIMATIONS ── */
@keyframes bounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(6px)} }
@keyframes fadeIn { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }
@keyframes lineSlide {
  0%   { transform: translateY(-100%); opacity: 0; }
  10%  { opacity: 1; }
  90%  { opacity: 1; }
  100% { transform: translateY(100vh); opacity: 0; }
}
.diagonal-lines { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.diagonal-lines span {
  position: absolute; width: 1px;
  background: linear-gradient(to bottom, transparent, rgba(242,108,33,0.3), transparent);
  animation: lineSlide 4s infinite linear; opacity: 0;
}
