/* Limitless Web - styles.css (Pro #00) */
/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500&family=Outfit:wght@600;700&display=swap');

:root {
  --color-primary: #0B3B8C;
  --color-primary-dark: #072B66;
  --color-primary-light: #3C79FF;
  --color-text: #0E1726;
  --color-text-muted: #334155;
  --color-bg: #FFFFFF;
  --color-bg-alt: #F6F8FC;
  --color-border: #E5E7EB;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --shadow-md: 0 6px 24px rgba(2, 6, 23, 0.08);
  --max-w: 1200px;
  --container-pad: 24px;
  --section-gap: 96px;
  --h1: 44px;
  --h2: 32px;
  --h3: 24px;
  --body: 16px;
  --small: 14px;
}

*,
*::before,
*::after { box-sizing: border-box; }

html:focus-within { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html:focus-within { scroll-behavior: auto; }
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}

body {
  margin: 0;
  font-family: 'Manrope', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Apple Color Emoji', 'Segoe UI Emoji';
  font-size: var(--body);
  line-height: 1.6;
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }
a { color: var(--color-primary); text-decoration: none; }
a:hover { text-decoration: underline; }
button { font: inherit; cursor: pointer; }

.container { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--container-pad); }
.section { padding: calc(var(--section-gap) * 0.75) 0; }
.section--alt { background: var(--color-bg-alt); }

h1,h2,h3 { font-family: 'Outfit', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial; margin: 0 0 12px; }
h1 { font-size: var(--h1); line-height: 1.15; }
h2 { font-size: var(--h2); }
h3 { font-size: var(--h3); }
p.small { font-size: var(--small); color: var(--color-text-muted); }

.btn {
  display: inline-block;
  padding: 14px 20px;
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  background: var(--color-primary);
  color: #fff;
  font-weight: 600;
  text-align: center;
  transition: transform .15s ease, background .2s ease;
}
.btn:hover { background: var(--color-primary-dark); text-decoration: none; transform: translateY(-1px); }
.btn--ghost { background: transparent; color: var(--color-primary); border-color: var(--color-primary); }
.btn--full { width: 100%; }

/* Header */
.site-header {
  position: sticky; top: 0; z-index: 1000;
  background: rgba(255,255,255,0.5);
  backdrop-filter: saturate(180%) blur(8px);
  transition: background .2s ease, box-shadow .2s ease;
  border-bottom: 1px solid rgba(229,231,235,.6);
}
.site-header.scrolled { background: #fff; box-shadow: var(--shadow-md); }

.nav { display: flex; align-items: center; gap: 24px; }
.nav__brand { display: flex; align-items: center; gap: 10px; padding: 10px 0; }
.nav__brand img { width: 28px; height: 28px; }
.nav__title { font-weight: 700; font-family: 'Outfit'; color: var(--color-text); }

.nav__menu { margin-left: auto; display: flex; gap: 10px; }
.nav__item { position: relative; list-style: none; }
.nav__link { display: inline-block; padding: 14px 12px; color: var(--color-text); font-weight: 600; }
.nav__link:focus-visible { outline: 3px solid var(--color-primary-light); border-radius: 8px; }

/* Dropdown */
.dropdown { position: absolute; left: 0; top: 48px; min-width: 220px; background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-md); box-shadow: var(--shadow-md); padding: 8px; display: none; }
.nav__item:hover .dropdown, .nav__item:focus-within .dropdown { display: grid; }
.dropdown a { padding: 10px 12px; border-radius: 8px; color: var(--color-text); font-weight: 500; }
.dropdown a:hover { background: var(--color-bg-alt); text-decoration: none; }

/* Hero generic */
.hero { padding: 96px 0 48px; background: linear-gradient(180deg, rgba(245,248,255,1) 0%, rgba(255,255,255,1) 100%); }
.hero__title { margin-bottom: 8px; }
.hero__lead { color: var(--color-text-muted); max-width: 720px; }
.hero__actions { margin-top: 24px; max-width: 480px; }

/* Footer */
.site-footer { border-top: 1px solid var(--color-border); padding: 32px 0; margin-top: 48px; }
.footer__top { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.footer__brand { display: flex; align-items: center; gap: 12px; }
.footer__links { display: flex; flex-wrap: wrap; gap: 12px 18px; }
.footer__note { color: var(--color-text-muted); font-size: var(--small); margin-top: 16px; }

@media (max-width: 768px) {
  .nav__menu { display: none; } /* mobile menu to be added later */
  .footer__top { grid-template-columns: 1fr; }
}

/* Reveal on scroll */
[data-reveal] { opacity: 0; transform: translateY(12px); transition: opacity .4s ease, transform .4s ease; }
[data-reveal].is-visible { opacity: 1; transform: translateY(0); }

/* Utilities */
.muted { color: var(--color-text-muted); }
.border { border: 1px solid var(--color-border); }
.card { background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: 20px; }
.badge { display: inline-block; padding: 4px 8px; border-radius: 999px; background: var(--color-bg-alt); color: var(--color-text-muted); font-size: 12px; font-weight: 600; }

/* Favicon placeholder (for completeness) */


/* === Home components (v0.1) === */

/* Hero with background image & parallax */
.hero{ position:relative; overflow:hidden; min-height:82vh; }
.hero__bg{
  position:absolute; inset:-10% -10% -10% -10%;
  background-size:cover; background-position:center;
  transform:translateY(0);
  will-change:transform;
  filter:saturate(110%);
}
.hero__overlay{position:absolute; inset:0; background:linear-gradient(to bottom, rgba(255,255,255,.00), rgba(255,255,255,.55) 55%, #fff 100%);}
.hero__inner{ position:relative; z-index:1; padding-block:120px }
.hero__buttons{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap }
.hero__buttons .btn{ min-width:220px }
.btn--ghost{ background:transparent; border-color:var(--color-border); color:var(--color-text) }
.btn--ghost:hover{ background:var(--color-bg-alt) }

/* Interlude full-bleed image */
.interlude{ position:relative; }
.interlude__img{ width:100%; max-height:420px; object-fit:cover; border-radius:0 }
.interlude__cta{
  position:absolute; right:24px; bottom:24px;
  backdrop-filter:saturate(180%) blur(6px);
  background:rgba(255,255,255,.9);
  border:1px solid var(--color-border);
  padding:10px 14px; border-radius:10px;
}

/* Stats */
.stats{ text-align:center }
.stats__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-4); margin-top:var(--space-4) }
.stats__item{ background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-md); padding:24px; box-shadow:var(--shadow-subtle) }
.stats__value{ font-size:32px; font-weight:700; color:var(--color-primary) }
.stats__label{ color:var(--color-text-muted) }

/* Offer teaser cards */
.cards{ display:grid; gap:var(--space-4); grid-template-columns:repeat(3,minmax(0,1fr)) }
@media (max-width:1024px){ .cards{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:640px){ .cards{ grid-template-columns:1fr } }
.card{
  background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-md);
  padding:20px; box-shadow:var(--shadow-subtle); display:grid; gap:8px
}
.card h3{ font-size:20px }
.card p{ color:var(--color-text-muted) }
.card a{ align-self:start }

/* Industries showcase */
.industries__grid{ display:grid; gap:var(--space-4); grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width:1024px){ .industries__grid{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:640px){ .industries__grid{ grid-template-columns:1fr } }
.industry-card{ border:1px solid var(--color-border); border-radius:var(--radius-md); overflow:hidden; background:#fff; box-shadow:var(--shadow-subtle) }
.industry-card img{ width:100%; height:180px; object-fit:cover }
.industry-card__body{ padding:16px; display:grid; gap:6px }
.badge{ display:inline-block; padding:2px 8px; border-radius:999px; font-size:12px; background:var(--color-bg-alt); border:1px solid var(--color-border) }

/* Workflow */
.workflow{ text-align:center }
.workflow__grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--space-4); margin-top:var(--space-4) }
@media (max-width:1024px){ .workflow__grid{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:640px){ .workflow__grid{ grid-template-columns:1fr } }
.step{
  background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-lg);
  padding:20px; box-shadow:var(--shadow-subtle);
}
.step__num{
  width:40px; height:40px; border-radius:999px; display:grid; place-items:center;
  background:var(--color-primary); color:#fff; font-weight:700; margin:0 auto 10px auto;
}

/* FAQ preview */
.faq-preview__list{ display:grid; gap:12px; margin-top:var(--space-4) }
.faq-item{ border:1px solid var(--color-border); border-radius:var(--radius-md); background:#fff; padding:16px }
.faq-item strong{ display:block; margin-bottom:6px }
.faq-preview__cta{ margin-top:16px; text-align:center }