/* ============================================================
   FUCANNAMEDCR — Header DS (clases .fh-* + #fuca-hdr + .menu)
   Extraído del inline de inicio.php para las 40 páginas internas.
   font-size usa em (no rem) → inmune a Bootstrap que pone html{font-size:10px}
   ============================================================ */

@keyframes fucaFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes fucaUp   { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }

/* ── Header wrapper — BASE: 16px absoluto ─────────────────── */
#fuca-hdr {
  position: fixed; top: 0; left: 0; width: 100%; box-sizing: border-box;
  display: flex; justify-content: space-between; align-items: center;
  padding: 24px 64px; z-index: 999;
  transition: background .4s ease, padding .4s ease, box-shadow .4s ease;
  background: linear-gradient(to bottom, rgba(0,0,0,.30), rgba(0,0,0,0));
  font-size: 16px;   /* base local: blinda contra html{10px} de Bootstrap */
}
#fuca-hdr.down {
  background: #739800;
  padding: 14px 64px;
  box-shadow: 0 4px 18px rgba(0,0,0,.18);
}

/* ── Brand ────────────────────────────────────────────────── */
.fh-brand      { display: flex; align-items: center; gap: 12px; text-decoration: none; flex-shrink: 0; }
.fh-brand-logo { height: 64px; width: auto; display: block; flex-shrink: 0; }
.fh-brand-text { display: flex; flex-direction: column; line-height: 1.05; }
.fh-brand-name { color: #fff; font-weight: 800; font-size: 1.05em; letter-spacing: 2px; font-family: var(--font-head); }
.fh-brand-sub  { color: rgba(255,255,255,.8); font-weight: 300; font-size: .62em;
                 letter-spacing: 1.3px; text-transform: uppercase; line-height: 1.35; }

/* ── Desktop nav ──────────────────────────────────────────── */
.fh-nav              { display: flex; align-items: center; gap: 2px; }
.fh-nav-item         { position: relative; display: flex; align-items: center; }
.fh-nav-item > a     { color: #fff; padding: 10px 12px; font-size: 1rem; font-weight: 500;
                       border-radius: 5px; white-space: nowrap; text-decoration: none;
                       display: flex; align-items: center; gap: 5px; transition: background .2s; }
.fh-nav-item > a:hover { background: rgba(56,74,19,.45); }
.fh-active-bar       { position: absolute; left: 16px; right: 16px; bottom: 3px;
                       height: 2px; background: #f28d00; border-radius: 2px; pointer-events: none; }
.fh-cta              { margin-left: 6px; background: #f28d00; color: #fff; padding: 10px 18px;
                       font-size: 1rem; font-weight: 700; border-radius: 5px;
                       text-decoration: none; white-space: nowrap;
                       box-shadow: 0 4px 12px rgba(242,141,0,.32); transition: background .2s; }
.fh-cta:hover        { background: #d97e00 !important; color: #fff !important; }
.fh-drop             { position: relative; display: flex; align-items: center; }

/* ── Dropdown ─────────────────────────────────────────────── */
.fh-dropdown         { display: none; position: absolute; top: 100%; left: 0; min-width: 220px;
                       background: rgba(28,44,6,.96); border-radius: 6px;
                       box-shadow: 0 12px 32px rgba(0,0,0,.40); overflow: hidden;
                       animation: fucaFade .15s ease; z-index: 30;
                       backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.fh-drop:hover .fh-dropdown { display: block; }
.fh-dropdown a       { display: block; padding: 14px 20px; color: #f8f8f0;
                       font-size: .95rem; font-weight: 500; text-decoration: none;
                       text-shadow: 0 1px 3px rgba(0,0,0,.45); transition: background .2s; }
.fh-dropdown a:hover { background: rgba(115,152,0,.35); }

/* ── Botón hamburguesa ────────────────────────────────────── */
.fh-mob-btn          { display: none; background: rgba(255,255,255,.16);
                       border: 1.5px solid rgba(255,255,255,.55); color: #fff;
                       width: 48px; height: 48px; border-radius: 9px; font-size: 1.4em;
                       cursor: pointer; align-items: center; justify-content: center;
                       padding: 0; font-family: var(--font-body); transition: background .2s; }
.fh-mob-btn:hover    { background: rgba(255,255,255,.26); }

/* ── Menú móvil overlay — BASE: 16px absoluto ────────────── */
.menu                { display: none; position: fixed; top: 70px; left: 0; right: 0;
                       background: #739800; box-shadow: 0 14px 30px rgba(0,0,0,.28);
                       padding: 6px 0 16px; z-index: 998;
                       max-height: calc(100vh - 70px); overflow-y: auto;
                       animation: fucaFade .15s ease;
                       font-size: 16px; } /* base local: blinda contra html{10px} de Bootstrap */
.menu.active         { display: block; }
.menu a              { display: block; padding: 13px 26px; color: #fff;
                       font-weight: 600; font-size: 1em; text-decoration: none; transition: background .2s; }
.menu a:hover        { background: rgba(56,74,19,.45); }
.menu a.fhm-sub      { padding-left: 38px; font-weight: 400; font-size: .96em; }
.fhm-label           { padding: 14px 26px 4px; color: rgba(255,255,255,.6);
                       font-size: .7em; letter-spacing: 2px; text-transform: uppercase; font-weight: 700; }
.fhm-contact         { padding: 14px 26px 4px; }
.fhm-contact a       { display: block; text-align: center; background: #f28d00;
                       padding: 14px; border-radius: 7px; font-weight: 700; }
.fhm-contact a:hover { background: #d97e00; }

/* ── Responsive 880px ─────────────────────────────────────── */
@media (max-width: 880px) {
  .fh-nav        { display: none; }
  .fh-mob-btn    { display: flex; }
  #fuca-hdr      { padding: 18px 22px; }
  #fuca-hdr.down { padding: 12px 22px; }
  .menu          { top: 66px; }
}

/* ── Hero interno (40 páginas internas) ──────────────────── */
.hero-int {
  position: relative; min-height: 45vh; display: flex; align-items: center;
  background: linear-gradient(100deg, rgba(12,25,14,.92), rgba(26,45,20,.6)),
              url('image/hero-interno.webp') center/cover no-repeat, #0c190e;
  overflow: hidden;
  border-bottom: 5px solid transparent;
  border-image: linear-gradient(to right, #739800, #f28d00, #739800) 1;
  padding-top: 90px;
}
.hero-int__content { position: relative; max-width: 1200px; margin: 0 auto; padding: 0 64px; width: 100%; }
.hero-int__title   { color: #fff; font-size: 2.6rem; font-weight: 800;
                     text-shadow: 0 2px 12px rgba(0,0,0,.5); margin: 0; }
@media (max-width: 768px) {
  .hero-int          { min-height: 35vh; padding-top: 70px; }
  .hero-int__title   { font-size: 1.8rem; }
  .hero-int__content { padding: 0 24px; }
}

/* ── Bug-fix: quitar outline/border/box-shadow heredado de style.css ── */
#fuca-hdr a,
#fuca-hdr a:focus,
#fuca-hdr .fh-nav-item,
.menu a,
.menu a:focus {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}
#fuca-hdr a:focus-visible {
  outline: 2px solid #f28d00 !important;
  outline-offset: 2px;
}
