/* ==============================================================
   CC&A StratEx — UX/UI Master v8.4 · Etapa 4
   Pruebas, móvil, accesibilidad y preparación de publicación
   ============================================================== */
:root {
  --cca-focus:#7F0000;
  --cca-focus-offset:#FFFFFF;
  --cca-mobile-gutter:18px;
  color-scheme:light;
}
html { overflow-x:clip; }
body { min-width:320px; overflow-x:clip; -webkit-text-size-adjust:100%; }
main, section, article, aside, nav, footer, header, div { min-width:0; }
img, video, svg, canvas, iframe { max-width:100%; }
img, video { height:auto; }
iframe { width:100%; border:0; }
a, button, input, select, textarea { touch-action:manipulation; }
button, input, select, textarea { font:inherit; }
main[id], [id] { scroll-margin-top:calc(var(--cca-header-height,78px) + 24px); }
main:focus { outline:none; }

/* Foco de teclado visible y corporativo */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible {
  outline:3px solid var(--cca-focus) !important;
  outline-offset:3px !important;
  box-shadow:0 0 0 2px var(--cca-focus-offset) !important;
}
:where(.btn,.button,.hv82-btn,.header-cta,.mobile-cta):focus-visible {
  outline-color:#F0D9A3 !important;
  box-shadow:0 0 0 2px #7F0000,0 0 0 5px #F0D9A3 !important;
}
.skip-link {
  position:fixed !important;
  top:10px !important;
  left:12px !important;
  z-index:100000 !important;
  transform:translateY(-160%);
  padding:12px 16px !important;
  color:#fff !important;
  background:#7F0000 !important;
  border:2px solid #fff !important;
  border-radius:8px !important;
  font-size:.9rem !important;
  font-weight:800 !important;
  text-decoration:none !important;
  transition:transform .18s ease !important;
}
.skip-link:focus { transform:translateY(0); }
.sr-only,.visually-hidden {
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

/* Links y contraste */
main a:not([class]) { text-decoration-thickness:.08em; text-underline-offset:.18em; }
.hv82-eyebrow-gold { color:#76541A !important; }
.cca-footer-v8 .cca-footer-kicker,.cca-footer-v8 .cca-footer-positioning { color:#E4D3AE !important; }
::selection { color:#fff; background:#7F0000; }

/* Formularios accesibles y cómodos en móvil */
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea) {
  max-width:100%;
  min-height:46px;
  font-size:16px;
}
textarea { min-height:120px; resize:vertical; }
label { line-height:1.38; }
input[aria-invalid="true"],select[aria-invalid="true"],textarea[aria-invalid="true"] {
  border-color:#7F0000 !important;
  box-shadow:0 0 0 3px rgba(127,0,0,.12) !important;
}
.form-status:not([hidden]),[role="alert"],[role="status"] { scroll-margin-top:110px; }
fieldset { min-width:0; }
legend { max-width:100%; }

/* Tablas sin romper la pantalla */
.cca-table-scroll {
  width:100%;
  max-width:100%;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
  border-radius:12px;
  scrollbar-width:thin;
}
.cca-table-scroll:focus-visible { outline-offset:4px !important; }
.cca-table-scroll > table { min-width:640px; margin:0; }

/* Menú móvil: panel estable, desplazable y operable con teclado */
@media (max-width:1020px) {
  html.cca-nav-open,body.cca-nav-open { overflow:hidden; }
  .cca-header-v8 .menu-toggle { min-width:48px; min-height:48px; justify-content:center; }
  .cca-header-v8 .menu-toggle-lines i { transform-origin:center; transition:transform .18s ease,opacity .18s ease; }
  .cca-header-v8 .menu-toggle[aria-expanded="true"] .menu-toggle-lines i:nth-child(1) { transform:translateY(5px) rotate(45deg); }
  .cca-header-v8 .menu-toggle[aria-expanded="true"] .menu-toggle-lines i:nth-child(2) { opacity:0; }
  .cca-header-v8 .menu-toggle[aria-expanded="true"] .menu-toggle-lines i:nth-child(3) { transform:translateY(-5px) rotate(-45deg); }
  .cca-header-v8 .mobile-nav {
    display:grid !important;
    position:fixed !important;
    z-index:9999;
    top:var(--cca-mobile-nav-top,78px);
    left:0;right:0;
    width:100%;
    max-height:calc(100dvh - var(--cca-mobile-nav-top,78px));
    padding:14px max(var(--cca-mobile-gutter),env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(var(--cca-mobile-gutter),env(safe-area-inset-left));
    overflow-y:auto;
    overscroll-behavior:contain;
    background:#FFFDFA;
    border-top:1px solid rgba(33,31,32,.12);
    box-shadow:0 20px 42px rgba(28,22,21,.16);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-8px);
    transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
  }
  .cca-header-v8 .mobile-nav.open {
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
  }
  .cca-header-v8 .mobile-nav a {
    display:flex;
    align-items:center;
    min-height:48px;
    padding:10px 12px;
    border-radius:9px;
    line-height:1.3;
  }
  .cca-header-v8 .mobile-nav a:hover { background:#F5EDED; }
  .cca-header-v8 .mobile-group-title { padding:13px 10px 6px; }
  .cca-header-v8 .mobile-catalog { min-height:56px; }
  .cca-header-v8 .mobile-cta { justify-content:center; min-height:50px; }
}

/* Móvil: jerarquía, aire y controles */
@media (max-width:760px) {
  :root { --cca-mobile-gutter:16px; }
  main h1,main .page-title,main .hero-title,main .display-title {
    font-size:clamp(2rem,9vw,2.55rem) !important;
    line-height:1.12 !important;
    letter-spacing:-.025em !important;
    overflow-wrap:normal;
    hyphens:none;
  }
  main h2,main .section-title {
    font-size:clamp(1.65rem,7vw,2.1rem) !important;
    line-height:1.2 !important;
  }
  main h3 { line-height:1.28; }
  p,li { overflow-wrap:anywhere; }
  .container,.hv82-container { width:min(100% - 32px,100%) !important; }
  :where(.hero-actions,.page-actions,.hv82-actions,.hv82-card-actions,.hv82-final-actions,.product-actions-pro,.book-actions-pro,.form-actions) {
    width:100%;
    align-items:stretch;
  }
  :where(.hero-actions,.page-actions,.hv82-actions,.hv82-final-actions,.product-actions-pro,.book-actions-pro) > :where(a,button) {
    width:100%;
    justify-content:center;
    text-align:center;
  }
  .hv82-proof-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .hv82-proof article { min-height:112px; padding:22px 12px; }
  .hv82-proof strong { font-size:clamp(2.1rem,12vw,3rem) !important; }
  .hv82-route-flow { grid-template-columns:1fr !important; }
  .hv82-route-arrow { transform:rotate(90deg); margin:2px auto; }
  .cca-footer-v8 .cca-footer-legal,.cca-footer-v8 .cca-footer-legal-links { width:100%; }
  .cca-footer-v8 .cca-footer-legal-links { display:grid; gap:8px; }
  .cca-footer-v8 .cca-footer-cookie { min-height:44px; text-align:left; }
  .whatsapp-float { right:16px !important; bottom:calc(18px + env(safe-area-inset-bottom)) !important; }
  .back-to-top { right:16px !important; bottom:calc(76px + env(safe-area-inset-bottom)) !important; }
  .cookie-banner,.cookie-consent { max-width:calc(100vw - 24px) !important; }
}
@media (max-width:420px) {
  .hv82-proof-grid { grid-template-columns:1fr 1fr !important; }
  .cca-header-v8 .brand img { width:126px !important; }
  .cca-header-v8 .header-inner { width:calc(100% - 20px) !important; }
}

/* Usuarios que solicitan menos movimiento */
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto !important; }
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .reveal-up,.cca-motion-ready .hv82-proof article { opacity:1!important; transform:none!important; }
  [data-parallax] { transform:none!important; }
  .hv82-hero-media,.hero-video { display:none!important; }
}
@media (prefers-contrast:more) {
  :root { --cca-line:#6A6260; }
  body { color:#151313; }
  .btn-secondary,.hv82-btn-secondary { border-width:2px!important; }
}
@media (forced-colors:active) {
  .catalog-featured,.mobile-catalog,.btn,.button,.hv82-btn { border:2px solid ButtonText!important; }
  :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible { outline:3px solid Highlight!important; box-shadow:none!important; }
}
@media print {
  .site-header,.mobile-nav,.whatsapp-float,.back-to-top,.scroll-progress,.cookie-banner,.cookie-consent { display:none!important; }
  body { color:#000!important; background:#fff!important; font-size:11pt; }
  main { padding-top:0!important; }
  a { color:#000!important; text-decoration:underline; }
}