/* ============================================================
   TouringXX · Base + reset + accesibilidad
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.5;
  text-wrap:pretty;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

h1,h2,h3,h4,h5,h6{margin:0;text-wrap:balance;font-weight:700}
p{margin:0}
ul,ol{margin:0;padding:0}
img,svg,video{max-width:100%;height:auto;display:block}
button{font:inherit;color:inherit}

a{color:var(--petrol);text-decoration:none}
a:hover{color:var(--green-600)}

::selection{background:var(--green-200);color:var(--ink)}

/* Foco visible — anillo petróleo 2px + offset */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:2px solid var(--petrol);
  outline-offset:2px;
  border-radius:4px;
}

/* Skip link */
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--ink);color:#fff;
  font:600 13px/1 var(--sans);
  padding:14px 18px;border-radius:0 0 var(--radius-3) 0;
}
.skip-link:focus{left:0;color:#fff}

/* Solo lectores de pantalla */
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* Layout */
.container{max-width:var(--container);margin:0 auto;padding:0 var(--container-pad)}
.section{padding-block:var(--space-9)}
.rule-h{height:1px;background:var(--line-2);border:0;margin:0}
.bd-b{border-bottom:1px solid var(--line)}
.bg-inset{background:var(--inset)}
.bg-surface{background:var(--surface)}
.bg-dark{background:var(--dark)}
[hidden]{display:none !important}

/* Animaciones */
@keyframes txRise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.anim-rise{animation:txRise .5s ease both}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important;transition:none !important}
}

/* ===== RESPONSIVE global ===== */
@media (max-width:1000px){
  :root{--container-pad:22px;--space-9:52px}
}
@media (max-width:620px){
  :root{--container-pad:16px;--space-9:44px}
}