/* run2airport.com - minimal Tailwind-like subset (purged utilities only)
   Note: Critical above-the-fold CSS will be inlined per page; this file is deferred.
   Size-conscious: only utilities actually used across the 3 pages.
*/

/* 1) Modern CSS reset (trimmed) */
*,*::before,*::after{box-sizing:border-box}
html:focus-within{scroll-behavior:smooth}
html,body{height:100%}
body{margin:0;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img,svg,video,canvas,audio,iframe,embed,object{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
a{text-decoration:none;color:inherit}

/* 2) Design tokens */
:root{
  --bg: #ffffff;
  --bg-muted: #f7fafc;
  --text: #1f2937;
  --muted: #6b7280;
  --accent: #0AA6FF; /* brand accent */
  --accent-600: #0094EB;
  --accent-700: #007FD1;
  --card: #ffffff;
  --border: #e5e7eb;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg: #0b0f14;
    --bg-muted: #0f1319;
    --text: #e5e7eb;
    --muted: #9ca3af;
    --card: #0f1319;
    --border: #1f2937;
  }
}

/* 3) Base */
body{
  background:var(--bg);
  color:var(--text);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, "Helvetica Neue", Arial, "Apple Color Emoji","Segoe UI Emoji";
  line-height:1.5;
}
a{color:var(--accent)}
a:hover{color:var(--accent-600)}
hr{border:0;border-top:1px solid var(--border);margin:1.5rem 0}

/* 4) Layout utilities (subset) */
.container{width:100%;max-width:72rem;margin-left:auto;margin-right:auto}
.mx-auto{margin-left:auto;margin-right:auto}
.w-full{width:100%}
.max-w-screen-lg{max-width:1024px}
.max-w-prose{max-width:68ch}
.px-2{padding-left:.5rem;padding-right:.5rem}
.px-4{padding-left:1rem;padding-right:1rem}
.px-6{padding-left:1.5rem;padding-right:1.5rem}
.py-2{padding-top:.5rem;padding-bottom:.5rem}
.py-4{padding-top:1rem;padding-bottom:1rem}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.py-8{padding-top:2rem;padding-bottom:2rem}
.p-4{padding:1rem}
.p-6{padding:1.5rem}
.p-8{padding:2rem}
.mt-2{margin-top:.5rem}
.mt-4{margin-top:1rem}
.mt-6{margin-top:1.5rem}
.mt-8{margin-top:2rem}
.mb-2{margin-bottom:.5rem}
.mb-4{margin-bottom:1rem}
.mb-6{margin-bottom:1.5rem}
.mb-8{margin-bottom:2rem}
.space-y-2>*+*{margin-top:.5rem}
.space-y-4>*+*{margin-top:1rem}
.space-y-6>*+*{margin-top:1.5rem}
.space-x-2>*+*{margin-left:.5rem}
.space-x-3>*+*{margin-left:.75rem}
.space-x-4>*+*{margin-left:1rem}

/* Flex & grid */
.flex{display:flex}
.inline-flex{display:inline-flex}
.items-center{align-items:center}
.justify-between{justify-content:space-between}
.justify-center{justify-content:center}
.gap-2{gap:.5rem}
.gap-3{gap:.75rem}
.gap-4{gap:1rem}
.gap-6{gap:1.5rem}
.grid{display:grid}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}

/* Breakpoints */
@media (min-width:640px){
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}
  .sm\:p-8{padding:2rem}
}
@media (min-width:768px){
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .md\:px-8{padding-left:2rem;padding-right:2rem}
  .md\:py-12{padding-top:3rem;padding-bottom:3rem}
  .md\:text-5xl{font-size:3rem;line-height:1.1}
  .md\:flex{display:flex}
}
@media (min-width:1024px){
  .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* 5) Typography */
.text-xs{font-size:.75rem;line-height:1rem}
.text-sm{font-size:.875rem;line-height:1.25rem}
.text-base{font-size:1rem;line-height:1.5rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-2xl{font-size:1.5rem;line-height:2rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-4xl{font-size:2.25rem;line-height:2.5rem}
.font-medium{font-weight:500}
.font-semibold{font-weight:600}
.font-bold{font-weight:700}
.leading-tight{line-height:1.15}
.tracking-tight{letter-spacing:-0.01em}
.text-muted{color:var(--muted)}
.text-white{color:#fff}
.text-black{color:#000}

/* 6) Colors / backgrounds / borders */
.bg-white{background:#fff}
.bg-muted{background:var(--bg-muted)}
.bg-card{background:var(--card)}
.bg-primary{background:var(--accent)}
.text-primary{color:var(--accent)}
.border{border:1px solid var(--border)}
.rounded{border-radius:.5rem}
.rounded-full{border-radius:9999px}
.shadow-sm{box-shadow:0 1px 2px rgba(0,0,0,.05)}
.shadow{box-shadow:0 4px 12px rgba(0,0,0,.08)}

/* 7) Components */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:.625rem 1rem;border-radius:.5rem;font-weight:600;
  border:1px solid transparent;cursor:pointer;transition:background .2s,transform .1s,color .2s,border-color .2s;
}
.btn:focus-visible{outline:2px solid var(--accent-600);outline-offset:2px}
.btn-primary{
  background:var(--accent);color:#fff;border-color:var(--accent-700);
}
.btn-primary:hover{background:var(--accent-600)}
.btn-ghost{
  background:transparent;color:var(--accent);
}
.btn-ghost:hover{background:rgba(50,168,221,.08)}
.badge{
  display:inline-flex;align-items:center;border:1px solid var(--border);
  padding:.125rem .5rem;border-radius:999px;font-size:.75rem;color:var(--muted)
}

/* Cards */
.card{background:var(--card);border:1px solid var(--border);border-radius:.75rem;padding:1rem}
.card-hover:hover{box-shadow:0 6px 20px rgba(0,0,0,.10)}

/* 8) Utilities */
.hidden{display:none}
.sticky{position:sticky}
.bottom-0{bottom:0}
.z-40{z-index:40}
.backdrop-blur{backdrop-filter:blur(8px)}
.opacity-90{opacity:.9}
.text-center{text-align:center}
.text-right{text-align:right}

/* 9) Dark mode via data attribute (manual toggle) */
html[data-theme="dark"]{color-scheme:dark}

/* 10) Accessibility helpers */
.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;
}

/* 11) Footer social icons */
.social a{
  display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:9999px;border:1px solid var(--border);
  color:var(--accent);
}
.social a:hover{background:rgba(50,168,221,.08)}

/* 12) Sticky mobile CTA bar */
.cta-bar{
  position:sticky;bottom:0;z-index:40;
  background:color-mix(in oklab, var(--bg) 92%, #000 8%);
  border-top:1px solid var(--border);
  padding:.5rem 1rem;
  backdrop-filter:blur(6px);
}

/* 13) Hero */
.hero{
  background: linear-gradient(180deg, rgba(50,168,221,.08), transparent);
  border-bottom:1px solid var(--border);
}

/* 14) Link underline on hover (nice for blog) */
.link{
  color:inherit; text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:3px;
  text-decoration-color: rgba(50,168,221,.35);
}
.link:hover{color:var(--accent);text-decoration-color: var(--accent)}

/* 15) Minimal prose */
.prose p{margin:0 0 1rem}
.prose h1,.prose h2,.prose h3{margin:1.5rem 0 .75rem;line-height:1.2}
.prose ul{margin:.75rem 0 .75rem 1rem;padding:0}
.prose li{margin:.25rem 0}

/* 16) Section */
.section{padding:2rem 0}
.section-muted{background:var(--bg-muted);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}

/* End of subset */