:root{
  --bg:#0b1220;
  --text:#e5e7eb;
  --muted:#a3adc2;
  --line:#24304a;
  --accent:#22c55e;
  --radius:18px;
  --shadow: 0 14px 50px rgba(0,0,0,.45);
  --max: 1050px;
  --recent-card-w: 260px;
  --badge-w: 140px;
  --badge-h: 32px;
  --badge-play-scale-prev: 1.3225;
  --badge-play-scale: 1.520875;
  --badge-apple-scale: 1.0;
  --ui-zoom-desktop: 1.25;
  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --sans: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
}
*{box-sizing:border-box}
html,body{height:100%; overflow-x:hidden}
body{
  margin:0;
  background: var(--bg);
  color:var(--text);
  font-family:var(--sans);
  line-height:1.45;
}
@media (min-width: 1101px){
  html{
    zoom: var(--ui-zoom-desktop);
  }
}
.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;
}
a{color:inherit}
.container{max-width:var(--max); margin:0 auto; padding:28px 18px 72px}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; padding:10px 12px; border:1px solid var(--line);
  border-radius:999px; background: var(--surface-1, rgba(17,26,46,.65)); backdrop-filter: blur(10px);
  position: static; z-index: 10;
}
.brand{display:flex; align-items:center; gap:0; padding-left:10px; text-decoration:none}
.brand strong{
  letter-spacing:.2px;
  font-size:20px;
  line-height:1;
  white-space: nowrap;
}
.nav .links{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:nowrap;
  justify-content:flex-end;
  flex: 1 1 auto;
  min-width: 0;
}
.top-nav{
  border-radius: 14px;
  padding: 6px 10px;
  margin-bottom: 7px;
}
.top-nav .links{
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}
.top-nav .pill{
  min-height: 34px;
  padding: 0 10px;
  font-size: 12px;
}
.top-nav .pill.primary-cta{
  background: var(--text);
  color: var(--surface-2, #ffffff);
  border-color: var(--text);
  font-weight: 700;
}
.top-nav .pill.primary-cta:hover{
  background: var(--text);
  color: var(--surface-2, #ffffff);
  border-color: var(--text);
}
.top-nav .pill.primary-cta:focus-visible{
  outline: 2px solid rgba(96, 165, 250, 0.55);
  outline-offset: 1px;
}
.top-nav .pill.social-pill{
  padding: 0 10px;
}
.top-nav .pill.social-pill img{
  width: 18px;
  height: 18px;
}
.nav-rail-logo{
  display:none;
}
.nav-toggle-pill{
  display:none;
}
.nav-toggle-icon{
  display:inline-flex;
  align-items: center;
  justify-content: center;
  width:16px;
  height:16px;
  font-size: 16px;
  line-height: 1;
  font-weight: 700;
  color: currentColor;
}
.nav-toggle-icon svg{
  display:none;
}
.nav-toggle-label{
  display:inline;
  line-height:1;
}
.pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 12px; border-radius:999px;
  border:1px solid var(--line);
  background: transparent;
  text-decoration:none;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
  font-weight:600;
}
.nav .pill{
  min-height: 44px;
  padding: 0 12px;
  font-size:13px;
  line-height: 1;
  white-space: nowrap;
}
.nav .links.compact-links{gap:6px}
.nav .pill.nav-mode-pill{
  color: var(--text);
  font-weight: 700;
  justify-content: flex-start;
  gap: 8px;
  min-width: 120px;
  cursor: pointer;
}
.nav .pill.demo-pill{
  text-transform: none;
  gap: 8px;
}
.nav .pill.resume-pill{
  gap: 10px;
}
.nav-pill-text{
  line-height: 1;
}
.nav-pill-icon{
  display: inline-flex;
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
  color: currentColor;
}
.nav-pill-icon svg{
  width: 100%;
  height: 100%;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.nav-pill-emoji{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  font-size: 16px;
  line-height: 1;
}
.nav .pill.social-pill{
  width: auto;
  padding: 0 12px;
  gap: 8px;
}
.nav .pill.social-pill img{
  width: 22px;
  height: 22px;
  object-fit: contain;
  display: block;
}
.nav .pill.social-pill .social-label{
  font-weight: 700;
  line-height: 1;
}
.github-pill img{
  filter: none;
}
body[data-theme="slate"] .github-pill img,
body[data-theme="graphite"] .github-pill img,
body[data-theme="storm"] .github-pill img,
body[data-theme="midnight"] .github-pill img,
body[data-theme="ink"] .github-pill img{
  filter: invert(1) brightness(1.12);
}
.pill:hover{transform: translateY(-1px); border-color: rgba(96,165,250,.6); background: transparent}
.pill .k{font-family:var(--mono); font-size:12px; color:var(--muted)}
.hero{
  margin-top:22px;
  display:grid;
  grid-template-columns: 140px 1fr;
  gap:18px;
  align-items:center;
}
.hero-with-demo{
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: start;
}
body.demo-enabled .hero-with-demo{
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}
.hero-main{
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}
.hero-copy{
  min-width: 0;
}
.hero-media{
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: stretch;
}
.hero-media .theme-toggle{
  justify-content: center;
}
.hero-media .theme-switcher{
  margin-top: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.hero-media .theme-switcher button{
  width: 100%;
}
.hero-demo-inline{
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  align-self: flex-start;
}
.hero-demo-toolbar{
  width: min(390px, 36vw);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.hero-demo-label{
  width: min(320px, 32vw);
  color: var(--muted);
  font-size: 19px;
  font-weight: 700;
  line-height: 1.2;
}
.hero-demo-shell{
  width: min(390px, 36vw);
  aspect-ratio: 390 / 844;
  margin: 0;
  border-radius: 34px;
}
.hero-demo-note{
  width: min(320px, 32vw);
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
.beta-qr-card{
  width: min(320px, 32vw);
  margin: 6px 0 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  display: grid;
  grid-template-columns: 98px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}
.beta-qr-image{
  width: 98px;
  height: 98px;
  display: block;
  background: #ffffff;
  border-radius: 9px;
  border: 1px solid var(--line);
  padding: 4px;
}
.beta-qr-copy{
  min-width: 0;
}
.beta-qr-copy p{
  margin: 0;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.4;
}
.beta-qr-copy .beta-qr-title{
  color: var(--text);
  font-weight: 700;
  margin-bottom: 4px;
  font-size: 13px;
}
.beta-qr-link{
  display: inline-flex;
  margin-top: 6px;
  font-family: var(--mono);
  font-size: 10px;
  line-height: 1.3;
  color: var(--text);
  text-underline-offset: 2px;
  word-break: break-all;
}
.beta-qr-link:hover{
  color: var(--accent);
}
.demo-expand-btn{
  white-space: nowrap;
}
.demo-expand-btn span:first-child{
  font-size: 14px;
  line-height: 1;
}
@media (max-width: 1100px){
  .nav{
    position: static;
    margin-bottom: 10px;
  }
  .nav .links{
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  .hero-with-demo{
    grid-template-columns: 1fr;
  }
  body.demo-enabled .hero-with-demo{
    grid-template-columns: 1fr;
  }
  .hero-main{
    grid-template-columns: 1fr;
  }
  .hero-media{
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
  }
  .hero-media .theme-switcher{
    display: flex;
    flex-wrap: wrap;
  }
  .hero-media .theme-switcher button{
    width: auto;
  }
  .hero-demo-inline{
    align-items: stretch;
  }
  .hero-demo-toolbar,
  .hero-demo-shell,
  .hero-demo-label,
  .hero-demo-note,
  .beta-qr-card{
    width: min(390px, 100%);
  }
  .hero-demo-shell{
    margin: 0 auto;
  }
  .hero-demo-label,
  .hero-demo-note,
  .beta-qr-card{
    margin: 2px auto 0;
  }
}
@media (max-width: 1200px){
  .container{padding:22px 16px 60px}
  .nav{gap:12px; padding:12px 12px}
  .nav .links{
    gap:8px;
    flex-wrap: wrap;
  }
  .pill{padding:7px 10px; font-size:14px}
  .pill .k{font-size:11px}
  .grid{gap:10px; grid-template-columns: 1fr}
  .grid > .card{grid-column: 1 / -1 !important}
  .kpi{gap:10px}
  .kpi .item{flex: 1 1 100%}
  .cards{grid-template-columns: 1fr}
}
@media (max-width: 960px){
  .nav{
    display: grid;
    grid-template-columns: 1fr;
    justify-content: stretch;
    align-items: start;
    border-radius: 18px;
    padding: 12px;
    gap: 12px;
  }
  .brand{
    padding-left: 0;
  }
  .nav .links{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    justify-content: stretch;
  }
  .nav .pill{
    width: 100%;
    justify-content: center;
  }
  .nav .pill.nav-mode-pill{
    min-width: 0;
    justify-content: center;
  }
  .nav .pill.social-pill{
    justify-content: center;
  }
  .top-nav{
    display: block;
    border-radius: 12px;
    padding: 8px;
  }
  .top-nav .links{
    width: auto;
    display: flex;
    grid-template-columns: none;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .top-nav .pill{
    width: auto;
    justify-content: flex-start;
  }
}
@media (max-width: 720px){
  .nav{position: static; top: auto}
  .nav .links{grid-template-columns: 1fr}
  .pill{
    padding: 8px 10px;
    font-size: 14px;
  }
  .nav .pill.social-pill{
    width: auto;
    padding: 0 12px;
  }
  .top-nav .links{
    display: flex;
    grid-template-columns: none;
    gap: 6px;
    flex-wrap: wrap;
  }
  .top-nav .pill{
    width: auto;
    padding: 0 10px;
  }
  .top-nav .pill.social-pill{
    padding: 0 10px;
  }
  .nav .pill.nav-mode-pill{
    min-height: 44px;
  }
  .pill .k{font-size:11px}
  .hero{grid-template-columns: 1fr; text-align:left}
  .hero-main{grid-template-columns: 1fr}
  .hero-media{
    flex-direction: column;
    align-items: flex-start;
  }
  .hero-media .theme-switcher{
    display: flex;
    flex-wrap: wrap;
  }
  .hero-demo-toolbar{
    width: 100%;
  }
  .hero-demo-shell{
    width: 100%;
    border-radius: 22px;
  }
  .hero-demo-note{
    width: 100%;
  }
  .beta-qr-card{
    width: 100%;
    grid-template-columns: 85px minmax(0, 1fr);
    padding: 9px;
  }
  .beta-qr-image{
    width: 85px;
    height: 85px;
  }
  .demo-expand-btn span:last-child{
    display: none;
  }
  .grid{grid-template-columns: 1fr}
  .grid > .card{grid-column: 1 / -1}
  .card .top{flex-wrap:wrap}
  .tag{max-width:100%; white-space:normal}
  .card ul{margin-left:0; padding-left:18px}
}
.avatar{
  width:140px;height:140px;border-radius:28px;
  border:1px solid var(--line);
  box-shadow: var(--shadow);
  background: #0d1628;
  overflow:hidden;
}
.avatar-link{
  display: block;
  width: 100%;
  height: 100%;
}
.avatar img{width:100%; height:100%; object-fit:cover; display:block}
.cazares-llc .hero{
  grid-template-columns: 140px 1fr;
  align-items: start;
}
.cazares-llc .avatar{
  width: 132px;
  height: 132px;
  border-radius: 24px;
  margin-top: 4px;
}
.cazares-llc .avatar.avatar-logo{
  background: transparent;
  border: 0;
  box-shadow: none;
}
.cazares-llc .avatar.avatar-logo img{
  object-fit: contain;
  padding: 4px;
}
@media (max-width: 720px){
  .cazares-llc .hero{
    grid-template-columns: 1fr;
  }
  .cazares-llc .avatar{
    width: 108px;
    height: 108px;
    margin-top: 0;
  }
}
.cazares-llc{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(190,200,215,.35) 0%, rgba(250,252,255,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(210,220,235,.25) 0%, rgba(250,252,255,0) 55%),
        linear-gradient(180deg, #f7f9fc 0%, #eef2f7 100%);
  --text:#0b1220;
  --muted:#3c4a60;
  --line:#c7d0dd;
  --accent:#1f2d44;
  --radius:12px;
  --shadow: 0 6px 18px rgba(32,40,55,.08);
  --sans: "Space Grotesk", "Avenir Next", "Helvetica Neue", Arial, sans-serif;
  --surface-1: rgba(255,255,255,.85);
  --surface-2: rgba(255,255,255,.92);
  --surface-2-hover: rgba(245,248,252,.98);
  --surface-3: rgba(255,255,255,.9);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,253,.98));
  --kpi-bg: rgba(252,253,255,.98);
  --tag-bg: rgba(245,247,251,.98);
  --copy-bg: rgba(255,255,255,.9);
  --button-bg: rgba(243,246,251,.98);
  --border-strong: rgba(120,135,155,.35);
  --border-stronger: rgba(80,95,120,.55);
}
body[data-theme="pearl"],
.cazares-llc[data-theme="pearl"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(200,210,225,.35) 0%, rgba(250,252,255,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(220,230,245,.25) 0%, rgba(250,252,255,0) 55%),
        linear-gradient(180deg, #f7f9fc 0%, #eef2f7 100%);
  --text:#0b1220;
  --muted:#3c4a60;
  --line:#c7d0dd;
  --accent:#1f2d44;
  --surface-1: rgba(255,255,255,.85);
  --surface-2: rgba(255,255,255,.92);
  --surface-2-hover: rgba(245,248,252,.98);
  --surface-3: rgba(255,255,255,.9);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,253,.98));
  --kpi-bg: rgba(252,253,255,.98);
  --tag-bg: rgba(245,247,251,.98);
  --copy-bg: rgba(255,255,255,.9);
  --button-bg: rgba(243,246,251,.98);
  --border-strong: rgba(120,135,155,.35);
  --border-stronger: rgba(80,95,120,.55);
}
body[data-theme="sand"],
.cazares-llc[data-theme="sand"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(255,214,150,.35) 0%, rgba(255,248,235,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(255,228,185,.25) 0%, rgba(255,248,235,0) 55%),
        linear-gradient(180deg, #fff6e8 0%, #fff1dd 100%);
  --text:#2a1b11;
  --muted:#59402a;
  --line:#dcc49b;
  --accent:#8a3f0c;
  --surface-1: rgba(255,248,236,.92);
  --surface-2: rgba(255,242,228,.96);
  --surface-2-hover: rgba(255,234,210,.98);
  --surface-3: rgba(255,244,230,.96);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,246,232,.98));
  --kpi-bg: rgba(255,242,226,.98);
  --tag-bg: rgba(255,234,214,.98);
  --copy-bg: rgba(255,244,230,.96);
  --button-bg: rgba(255,232,205,.98);
  --border-strong: rgba(180,135,85,.45);
  --border-stronger: rgba(120,70,25,.6);
}
body[data-theme="mist"],
.cazares-llc[data-theme="mist"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(200,220,235,.4) 0%, rgba(245,250,255,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(185,205,225,.25) 0%, rgba(245,250,255,0) 55%),
        linear-gradient(180deg, #f2f7fb 0%, #e9f0f7 100%);
  --text:#0a1320;
  --muted:#3f4f68;
  --line:#c0cbd8;
  --accent:#1a3352;
  --surface-1: rgba(255,255,255,.88);
  --surface-2: rgba(255,255,255,.94);
  --surface-2-hover: rgba(238,244,251,.98);
  --surface-3: rgba(255,255,255,.9);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(244,249,254,.98));
  --kpi-bg: rgba(246,250,255,.98);
  --tag-bg: rgba(237,244,251,.98);
  --copy-bg: rgba(255,255,255,.92);
  --button-bg: rgba(234,242,250,.98);
  --border-strong: rgba(110,130,155,.4);
  --border-stronger: rgba(60,85,115,.6);
}
body[data-theme="sage"],
.cazares-llc[data-theme="sage"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(200,220,205,.35) 0%, rgba(245,250,248,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(185,210,195,.25) 0%, rgba(245,250,248,0) 55%),
        linear-gradient(180deg, #f3f8f5 0%, #e9f1ed 100%);
  --text:#0b1814;
  --muted:#3f564b;
  --line:#bdccc4;
  --accent:#1a3f31;
  --surface-1: rgba(255,255,255,.9);
  --surface-2: rgba(255,255,255,.95);
  --surface-2-hover: rgba(237,244,240,.98);
  --surface-3: rgba(255,255,255,.92);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(242,248,244,.98));
  --kpi-bg: rgba(244,249,246,.98);
  --tag-bg: rgba(235,243,239,.98);
  --copy-bg: rgba(255,255,255,.94);
  --button-bg: rgba(232,241,236,.98);
  --border-strong: rgba(105,130,115,.4);
  --border-stronger: rgba(60,100,82,.6);
}
body[data-theme="sky"],
.cazares-llc[data-theme="sky"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(195,215,240,.4) 0%, rgba(245,250,255,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(175,200,230,.25) 0%, rgba(245,250,255,0) 55%),
        linear-gradient(180deg, #f1f7ff 0%, #e7f0fb 100%);
  --text:#0a1422;
  --muted:#3f5878;
  --line:#c1cedf;
  --accent:#1a3464;
  --surface-1: rgba(255,255,255,.88);
  --surface-2: rgba(255,255,255,.94);
  --surface-2-hover: rgba(236,244,255,.98);
  --surface-3: rgba(255,255,255,.9);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(242,248,255,.98));
  --kpi-bg: rgba(244,249,255,.98);
  --tag-bg: rgba(234,242,252,.98);
  --copy-bg: rgba(255,255,255,.92);
  --button-bg: rgba(230,240,252,.98);
  --border-strong: rgba(105,130,160,.4);
  --border-stronger: rgba(55,90,130,.6);
}
.cazares-llc[data-theme="sky"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(195,215,240,.4) 0%, rgba(245,250,255,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(175,200,230,.25) 0%, rgba(245,250,255,0) 55%),
        linear-gradient(180deg, #f1f7ff 0%, #e7f0fb 100%);
  --text:#0a1422;
  --muted:#3f5878;
  --line:#c1cedf;
  --accent:#1a3464;
  --surface-1: rgba(255,255,255,.88);
  --surface-2: rgba(255,255,255,.94);
  --surface-2-hover: rgba(236,244,255,.98);
  --surface-3: rgba(255,255,255,.9);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(242,248,255,.98));
  --kpi-bg: rgba(244,249,255,.98);
  --tag-bg: rgba(234,242,252,.98);
  --copy-bg: rgba(255,255,255,.92);
  --button-bg: rgba(230,240,252,.98);
  --border-strong: rgba(105,130,160,.4);
  --border-stronger: rgba(55,90,130,.6);
}

body[data-theme="slate"],
.cazares-llc[data-theme="slate"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(120,135,165,.35) 0%, rgba(18,22,32,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(95,110,140,.25) 0%, rgba(18,22,32,0) 55%),
        linear-gradient(180deg, #121722 0%, #0d121b 100%);
  --text:#f3f6fb;
  --muted:#b9c4d8;
  --line:#273246;
  --accent:#8fa3c6;
  --surface-1: rgba(18,24,34,.8);
  --surface-2: rgba(20,28,40,.85);
  --surface-2-hover: rgba(28,38,54,.92);
  --surface-3: rgba(22,30,42,.88);
  --card-bg: linear-gradient(180deg, rgba(20,28,40,.96), rgba(14,20,30,.98));
  --kpi-bg: rgba(18,26,38,.98);
  --tag-bg: rgba(24,32,46,.92);
  --copy-bg: rgba(18,26,38,.9);
  --button-bg: rgba(28,38,54,.95);
  --border-strong: rgba(120,140,175,.45);
  --border-stronger: rgba(170,190,230,.7);
}

body[data-theme="graphite"],
.cazares-llc[data-theme="graphite"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(90,100,110,.28) 0%, rgba(10,12,16,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(70,80,90,.22) 0%, rgba(10,12,16,0) 55%),
        linear-gradient(180deg, #0d1117 0%, #070a0f 100%);
  --text:#f5f7fb;
  --muted:#b9c1cf;
  --line:#1f2734;
  --accent:#a2adbf;
  --surface-1: rgba(16,20,28,.86);
  --surface-2: rgba(18,24,34,.9);
  --surface-2-hover: rgba(26,34,48,.96);
  --surface-3: rgba(20,26,38,.9);
  --card-bg: linear-gradient(180deg, rgba(18,24,34,.96), rgba(10,14,20,.98));
  --kpi-bg: rgba(16,22,32,.98);
  --tag-bg: rgba(22,28,40,.92);
  --copy-bg: rgba(16,22,32,.92);
  --button-bg: rgba(26,34,48,.96);
  --border-strong: rgba(110,125,150,.4);
  --border-stronger: rgba(180,195,220,.7);
}

body[data-theme="dusk"],
.cazares-llc[data-theme="dusk"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(110,85,150,.28) 0%, rgba(14,10,20,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(90,60,130,.2) 0%, rgba(14,10,20,0) 55%),
        linear-gradient(180deg, #14101c 0%, #0b0812 100%);
  --text:#f5f2fb;
  --muted:#c7bddf;
  --line:#2f2544;
  --accent:#b59be8;
  --surface-1: rgba(22,16,32,.86);
  --surface-2: rgba(26,18,36,.9);
  --surface-2-hover: rgba(36,26,50,.95);
  --surface-3: rgba(28,20,40,.92);
  --card-bg: linear-gradient(180deg, rgba(26,18,36,.96), rgba(16,10,24,.98));
  --kpi-bg: rgba(24,16,34,.98);
  --tag-bg: rgba(30,20,42,.92);
  --copy-bg: rgba(24,16,34,.92);
  --button-bg: rgba(36,26,50,.96);
  --border-strong: rgba(150,120,190,.45);
  --border-stronger: rgba(210,185,245,.75);
}

body[data-theme="clay"],
.cazares-llc[data-theme="clay"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(210,160,120,.35) 0%, rgba(255,247,240,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(190,135,95,.25) 0%, rgba(255,247,240,0) 55%),
        linear-gradient(180deg, #fff5ee 0%, #f8ede3 100%);
  --text:#2a1a12;
  --muted:#6a4a3c;
  --line:#e2c7b4;
  --accent:#b36a4a;
  --surface-1: rgba(255,249,244,.92);
  --surface-2: rgba(255,242,234,.96);
  --surface-2-hover: rgba(255,232,222,.98);
  --surface-3: rgba(255,244,236,.96);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(251,243,236,.98));
  --kpi-bg: rgba(255,242,234,.98);
  --tag-bg: rgba(255,232,222,.98);
  --copy-bg: rgba(255,244,236,.96);
  --button-bg: rgba(255,230,218,.98);
  --border-strong: rgba(180,130,110,.45);
  --border-stronger: rgba(140,95,75,.6);
}

body[data-theme="glacier"],
.cazares-llc[data-theme="glacier"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(210,235,245,.5) 0%, rgba(250,255,255,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(190,220,235,.3) 0%, rgba(250,255,255,0) 55%),
        linear-gradient(180deg, #f6fbff 0%, #eaf3fb 100%);
  --text:#0b1522;
  --muted:#3f5a78;
  --line:#c7d9ea;
  --accent:#1f4c7a;
  --surface-1: rgba(255,255,255,.92);
  --surface-2: rgba(255,255,255,.96);
  --surface-2-hover: rgba(235,246,255,.98);
  --surface-3: rgba(255,255,255,.94);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(241,248,255,.98));
  --kpi-bg: rgba(244,250,255,.98);
  --tag-bg: rgba(233,244,255,.98);
  --copy-bg: rgba(255,255,255,.94);
  --button-bg: rgba(230,244,255,.98);
  --border-strong: rgba(120,160,190,.4);
  --border-stronger: rgba(70,110,150,.6);
}

body[data-theme="ink"],
.cazares-llc[data-theme="ink"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(40,45,70,.28) 0%, rgba(8,10,16,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(30,35,60,.22) 0%, rgba(8,10,16,0) 55%),
        linear-gradient(180deg, #0b0f16 0%, #06080d 100%);
  --text:#f2f5ff;
  --muted:#b5bdd6;
  --line:#1f2636;
  --accent:#7f90bf;
  --surface-1: rgba(12,16,26,.86);
  --surface-2: rgba(14,20,30,.9);
  --surface-2-hover: rgba(22,30,42,.95);
  --surface-3: rgba(16,22,34,.92);
  --card-bg: linear-gradient(180deg, rgba(14,20,30,.96), rgba(8,12,20,.98));
  --kpi-bg: rgba(12,18,28,.98);
  --tag-bg: rgba(18,24,36,.92);
  --copy-bg: rgba(12,18,28,.92);
  --button-bg: rgba(22,30,42,.96);
  --border-strong: rgba(100,120,170,.45);
  --border-stronger: rgba(160,185,230,.7);
}

body[data-theme="aurora"],
.cazares-llc[data-theme="aurora"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(120,210,180,.35) 0%, rgba(245,255,252,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(90,180,210,.25) 0%, rgba(245,255,252,0) 55%),
        linear-gradient(180deg, #f1fffb 0%, #e6fbf6 100%);
  --text:#0a1a18;
  --muted:#3f6a64;
  --line:#b9e0d7;
  --accent:#178c7e;
  --surface-1: rgba(255,255,255,.92);
  --surface-2: rgba(255,255,255,.96);
  --surface-2-hover: rgba(234,250,246,.98);
  --surface-3: rgba(255,255,255,.94);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(239,249,246,.98));
  --kpi-bg: rgba(242,250,248,.98);
  --tag-bg: rgba(231,246,242,.98);
  --copy-bg: rgba(255,255,255,.94);
  --button-bg: rgba(226,246,242,.98);
  --border-strong: rgba(120,175,165,.4);
  --border-stronger: rgba(60,120,110,.6);
}

body[data-theme="copper"],
.cazares-llc[data-theme="copper"]{
  --bg: radial-gradient(920px 420px at 10% -8%, rgba(180,110,70,.25) 0%, rgba(20,14,12,0) 60%),
        radial-gradient(700px 380px at 90% -5%, rgba(120,80,50,.18) 0%, rgba(20,14,12,0) 55%),
        linear-gradient(180deg, #171110 0%, #0f0a0a 100%);
  --text:#f8f2ea;
  --muted:#d7c2b3;
  --line:#4a3026;
  --accent:#d08b5f;
  --surface-1: rgba(26,18,16,.85);
  --surface-2: rgba(30,20,18,.85);
  --surface-2-hover: rgba(40,26,22,.95);
  --surface-3: rgba(32,22,20,.9);
  --card-bg: linear-gradient(180deg, rgba(32,22,20,.98), rgba(20,14,12,.98));
  --kpi-bg: rgba(28,20,18,.98);
  --tag-bg: rgba(34,24,22,.9);
  --copy-bg: rgba(30,20,18,.92);
  --button-bg: rgba(40,26,22,.96);
  --border-strong: rgba(170,120,90,.6);
  --border-stronger: rgba(220,170,140,.8);
}

body[data-theme="solar"],
.cazares-llc[data-theme="solar"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(255,215,120,.45) 0%, rgba(255,252,240,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(255,200,80,.3) 0%, rgba(255,252,240,0) 55%),
        linear-gradient(180deg, #fff9e9 0%, #fff1d2 100%);
  --text:#2a1a08;
  --muted:#6a4b1d;
  --line:#edd3a6;
  --accent:#b56a08;
  --surface-1: rgba(255,251,240,.94);
  --surface-2: rgba(255,246,230,.96);
  --surface-2-hover: rgba(255,236,208,.98);
  --surface-3: rgba(255,248,236,.96);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,246,230,.98));
  --kpi-bg: rgba(255,242,222,.98);
  --tag-bg: rgba(255,234,208,.98);
  --copy-bg: rgba(255,248,236,.96);
  --button-bg: rgba(255,232,200,.98);
  --border-strong: rgba(200,150,90,.45);
  --border-stronger: rgba(150,100,40,.6);
}

body[data-theme="rose"],
.cazares-llc[data-theme="rose"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(240,180,200,.45) 0%, rgba(255,245,248,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(220,150,175,.3) 0%, rgba(255,245,248,0) 55%),
        linear-gradient(180deg, #fff5f8 0%, #ffeaf1 100%);
  --text:#2a131a;
  --muted:#6b3e4f;
  --line:#e9c5d3;
  --accent:#b84a6e;
  --surface-1: rgba(255,250,252,.94);
  --surface-2: rgba(255,244,248,.96);
  --surface-2-hover: rgba(255,232,240,.98);
  --surface-3: rgba(255,246,250,.96);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,243,248,.98));
  --kpi-bg: rgba(255,240,246,.98);
  --tag-bg: rgba(255,232,242,.98);
  --copy-bg: rgba(255,246,250,.96);
  --button-bg: rgba(255,232,242,.98);
  --border-strong: rgba(200,140,160,.45);
  --border-stronger: rgba(150,90,120,.6);
}

body[data-theme="lavender"],
.cazares-llc[data-theme="lavender"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(210,200,255,.45) 0%, rgba(250,248,255,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(185,170,240,.3) 0%, rgba(250,248,255,0) 55%),
        linear-gradient(180deg, #f6f2ff 0%, #eee7ff 100%);
  --text:#1e1530;
  --muted:#4f3f74;
  --line:#d6cbed;
  --accent:#6a4fb7;
  --surface-1: rgba(255,252,255,.94);
  --surface-2: rgba(255,246,255,.96);
  --surface-2-hover: rgba(244,236,255,.98);
  --surface-3: rgba(255,248,255,.96);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(245,238,255,.98));
  --kpi-bg: rgba(246,240,255,.98);
  --tag-bg: rgba(238,230,255,.98);
  --copy-bg: rgba(255,248,255,.96);
  --button-bg: rgba(238,230,255,.98);
  --border-strong: rgba(170,150,220,.45);
  --border-stronger: rgba(120,90,180,.6);
}

body[data-theme="meadow"],
.cazares-llc[data-theme="meadow"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(190,230,170,.45) 0%, rgba(245,255,245,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(160,210,150,.3) 0%, rgba(245,255,245,0) 55%),
        linear-gradient(180deg, #f3fff0 0%, #e7f8e2 100%);
  --text:#172214;
  --muted:#4a6a46;
  --line:#c7e1bf;
  --accent:#3f8a4b;
  --surface-1: rgba(255,255,255,.94);
  --surface-2: rgba(248,255,248,.96);
  --surface-2-hover: rgba(236,250,236,.98);
  --surface-3: rgba(248,255,248,.96);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(240,250,238,.98));
  --kpi-bg: rgba(242,250,240,.98);
  --tag-bg: rgba(232,246,232,.98);
  --copy-bg: rgba(248,255,248,.96);
  --button-bg: rgba(232,246,232,.98);
  --border-strong: rgba(140,190,140,.45);
  --border-stronger: rgba(90,140,90,.6);
}

body[data-theme="citrus"],
.cazares-llc[data-theme="citrus"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(255,230,150,.45) 0%, rgba(255,252,235,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(255,210,120,.3) 0%, rgba(255,252,235,0) 55%),
        linear-gradient(180deg, #fff9ec 0%, #fff1d8 100%);
  --text:#2a1f0a;
  --muted:#6a5124;
  --line:#edd6a8;
  --accent:#c77a15;
  --surface-1: rgba(255,252,242,.94);
  --surface-2: rgba(255,246,232,.96);
  --surface-2-hover: rgba(255,236,210,.98);
  --surface-3: rgba(255,248,236,.96);
  --card-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,246,230,.98));
  --kpi-bg: rgba(255,242,222,.98);
  --tag-bg: rgba(255,234,210,.98);
  --copy-bg: rgba(255,248,236,.96);
  --button-bg: rgba(255,232,200,.98);
  --border-strong: rgba(200,150,90,.45);
  --border-stronger: rgba(150,100,40,.6);
}

body[data-theme="storm"],
.cazares-llc[data-theme="storm"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(110,120,140,.28) 0%, rgba(12,16,22,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(90,100,120,.22) 0%, rgba(12,16,22,0) 55%),
        linear-gradient(180deg, #12151b 0%, #0b0f14 100%);
  --text:#f2f5fb;
  --muted:#b7c0d0;
  --line:#262c36;
  --accent:#93a3c4;
  --surface-1: rgba(18,22,30,.86);
  --surface-2: rgba(20,26,36,.9);
  --surface-2-hover: rgba(28,36,48,.95);
  --surface-3: rgba(22,28,38,.92);
  --card-bg: linear-gradient(180deg, rgba(20,26,36,.96), rgba(12,16,24,.98));
  --kpi-bg: rgba(18,24,34,.98);
  --tag-bg: rgba(24,30,40,.92);
  --copy-bg: rgba(18,24,34,.92);
  --button-bg: rgba(28,36,48,.96);
  --border-strong: rgba(120,135,160,.45);
  --border-stronger: rgba(180,195,220,.7);
}

body[data-theme="midnight"],
.cazares-llc[data-theme="midnight"]{
  --bg: radial-gradient(900px 420px at 12% -8%, rgba(50,60,90,.28) 0%, rgba(8,10,16,0) 60%),
        radial-gradient(700px 380px at 88% -5%, rgba(40,45,70,.22) 0%, rgba(8,10,16,0) 55%),
        linear-gradient(180deg, #0a0f19 0%, #06080f 100%);
  --text:#f3f6ff;
  --muted:#b2bdd6;
  --line:#1e2536;
  --accent:#7f90c7;
  --surface-1: rgba(10,14,22,.86);
  --surface-2: rgba(12,18,28,.9);
  --surface-2-hover: rgba(20,28,42,.95);
  --surface-3: rgba(14,20,32,.92);
  --card-bg: linear-gradient(180deg, rgba(12,18,28,.96), rgba(8,12,20,.98));
  --kpi-bg: rgba(10,16,26,.98);
  --tag-bg: rgba(16,22,34,.92);
  --copy-bg: rgba(10,16,26,.92);
  --button-bg: rgba(20,28,42,.96);
  --border-strong: rgba(100,120,170,.45);
  --border-stronger: rgba(160,185,230,.7);
}
.cazares-llc .h1{
  color: var(--text);
  text-shadow: 0 6px 24px rgba(0,0,0,.28);
}
.cazares-llc .sub{
  color: var(--muted);
}
.cazares-llc .nav{
  border-color: var(--line);
  background: var(--surface-1);
}
.cazares-llc .pill{
  border-color: var(--line);
  background: transparent;
  box-shadow: none;
}
.cazares-llc .pill:hover{
  border-color: var(--border-stronger);
  background: transparent;
}
.cazares-llc .badge{
  border-color: var(--border-strong);
  background: transparent;
  box-shadow: none;
}
.cazares-llc .card{
  border-color: var(--line);
  background: var(--card-bg);
  box-shadow: none;
}
.cazares-llc .kpi .item{
  border-color: var(--border-strong);
  background: var(--kpi-bg);
  box-shadow: none;
}
.cazares-llc .tag{
  border-color: var(--border-strong);
  color: var(--text);
  background: transparent;
}
.cazares-llc .section-title{
  color: var(--muted);
  letter-spacing:.34em;
}
.cazares-llc .copy{
  border-color: var(--border-strong);
  background: transparent;
  box-shadow: none;
  width: 100%;
  max-width: 380px;
}
.cazares-llc .copy.copy-wide{
  max-width: 100%;
  width: 100%;
}
.cazares-llc .copy span{
  display:flex;
  align-items:center;
  gap:10px;
  flex: 1 1 auto;
}
.cazares-llc .copy button{
  margin-left: auto;
  margin-right: 0;
}
.cazares-llc .copy button{
  border-color: var(--border-strong);
  background: var(--button-bg);
  box-shadow: none;
}
.cazares-llc .copy button:hover{
  border-color: var(--border-stronger);
}
.h1{
  font-size: 36px; line-height:1.05; margin:0 0 8px;
  letter-spacing: -.6px;
}
.sub{
  color:var(--muted);
  font-size:16px;
  margin:0 0 14px;
}
.reliability{
  margin: 12px 0 18px;
  padding: 16px 18px 18px;
  border: 1px solid rgba(36,48,74,.6);
  border-radius: 16px;
  background: rgba(11,18,32,.22);
}
.reliability h2{
  margin: 0 0 10px;
  font-size: 19px;
  letter-spacing: -.2px;
}
.reliability p{
  margin: 0 0 14px;
  color: var(--muted);
}
.reliability .intro{
  margin-bottom: 18px;
  color: var(--muted);
  font-size: 15.5px;
}
.reliability .intro-strong{
  color: var(--text);
  font-weight: 700;
}
.reliability blockquote{
  margin: 18px 0 18px;
  padding: 16px 24px;
  border-left: 2px solid var(--accent);
  line-height: 1.72;
  font-size: 16.5px;
}
.reliability blockquote p{
  margin: 0 0 6px;
  color: var(--text);
}
.reliability blockquote p:last-child{margin-bottom:0}
.reliability .strong{
  font-weight: 600;
  font-size: 16px;
}
.reliability .muted{
  color: var(--muted);
  font-style: italic;
}
.reliability .muted.murphy{
  color: var(--text);
  font-style: italic;
  font-weight: 700;
}
.reliability .thesis{
  font-weight: 600;
  color: var(--text);
}
.reliability .stack{
  margin-top: 8px;
}
.hard-results{
  margin: 8px 0 0;
}
.hard-results-split{
  display:grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, .95fr);
  gap: 14px 18px;
  align-items:start;
}
.hard-results-main{
  min-width: 0;
}
.hard-results .label{
  display: block;
  color: var(--muted);
  font-weight: 600;
  margin-bottom: 6px;
}
.hard-results .label.strong{
  color: var(--text);
  font-weight: 700;
}
.hard-results-inline{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.hard-results-inline .label{
  display:inline;
  margin-bottom: 0;
}
.result-pills{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.hard-results-side{
  margin-top: 0;
  display:grid;
  gap: 10px;
  align-content:start;
}
.hard-results-side .badges{
  display:grid;
  gap:10px;
}
.hard-results-side .availability-badge{
  white-space: normal;
}
.hard-results-side .copy{
  width: 100%;
}
.pill.mini{
  padding: 8px 12px;
  font-size: 14.5px;
  font-weight: 600;
  background: var(--surface-1, transparent);
  border-color: var(--border-strong, var(--line, rgba(36,48,74,.6)));
  color: var(--text);
}
.pill.mini strong{
  font-weight: 600;
  color: var(--text);
}
.app-links{
  margin: 8px 0 0;
  font-size: 13.5px;
  color: var(--muted);
}
.app-links a{color: var(--text); text-decoration: none}
.app-links a:hover{text-decoration: underline}
.store-badges{
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  align-items: center;
  justify-content: flex-start;
}
.store-badges .store{
  display: inline-flex;
  align-items: center;
  height: var(--badge-h);
  width: var(--badge-w);
}
.store-badges .store img{
  height: 100%;
  width: 100%;
  max-width: 100%;
  display: block;
  object-fit: contain;
  object-position: center;
}
.store-badges .badge-play{
  height: 100%;
  width: 100%;
  max-width: 100%;
  transform: scale(var(--badge-play-scale));
  transform-origin: center;
}
.store-badges .badge-apple{
  height: 100%;
  width: 100%;
  max-width: 100%;
  transform: scale(var(--badge-apple-scale));
  transform-origin: center;
}
@media (max-width: 720px){
  :root{
    --badge-w: 120px;
    --badge-h: 28px;
    --badge-play-scale-prev: 1.3225;
    --badge-play-scale: 1.520875;
    --badge-apple-scale: 1.0;
  }
  .store-badges{
    flex-wrap: wrap;
  }
  .store-badges .store img{
    height: 100%;
    width: 100%;
    max-width: 100%;
  }
  .store-badges .store{
    height: var(--badge-h);
    width: var(--badge-w);
  }
  .store-badges .badge-play{
    height: 100%;
    width: 100%;
    max-width: 100%;
  }
  .store-badges .badge-apple{
    height: 100%;
    width: 100%;
    max-width: 100%;
  }
}
.production-apps .card .top{
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: 6px 10px;
}
.production-apps .card .top .tag,
.production-apps .card .top .tag-group{
  justify-self: end;
  margin-left: 0;
}
.production-apps .card .top h2{
  grid-column: 1 / 2;
  justify-self: start;
  margin: 0;
}
.card-sub{
  margin: 6px 0 0;
  color: var(--muted);
}
.production-apps .card{
  display:flex;
  flex-direction:column;
  padding: 12px;
}
.production-apps .store-badges{
  margin-top: 8px;
}
.production-apps .card-sub{
  margin: 4px 0 0;
}
.production-apps .result-pills{
  gap: 6px;
  margin-top: 6px;
}
.production-apps .pill.mini{
  padding: 6px 10px;
  font-size: 13px;
}
.production-apps .hr{
  margin: 10px 0;
}
.production-apps .store-badges .store{
  width: 108px;
  height: 24px;
}
.compact-app-links{
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.5;
}
@media (min-width: 1024px){
  .reliability .metrics{
    white-space: nowrap;
  }
}
@media (max-width: 1023px){
  .reliability .metrics{
    white-space: normal;
  }
}
@media (max-width: 720px){
  .reliability{
    padding: 14px 14px;
  }
  .reliability .results{
    margin-top: 12px;
  }
  .reliability .metrics{
    font-size: 15px;
  }
}
.badges{display:flex; gap:10px; flex-wrap:wrap}
.badge{
  display:inline-flex; align-items:center; gap:10px;
  padding:8px 12px; border-radius:999px;
  border:1px solid var(--line); background: transparent;
  font-weight:700; letter-spacing:.1px;
}
.theme-switcher{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.theme-switcher.is-hidden{
  display:none;
}
.theme-toggle.is-hidden{
  display:none;
}
.theme-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid var(--line);
  background: transparent;
  color: var(--text);
  font-weight: 600;
  cursor: pointer;
  font-size: 12.5px;
}
.theme-switcher button{
  appearance:none;
  border:1px solid var(--line);
  background: var(--surface-2, rgba(11,18,32,.55));
  color: var(--text);
  border-radius: 999px;
  padding: 6px 12px;
  font-weight: 600;
  cursor: pointer;
  font-size: 12.5px;
}
.theme-switcher button[aria-pressed="true"]{
  border-color: var(--border-stronger, rgba(255,255,255,.35));
  box-shadow: 0 0 0 1px rgba(255,255,255,.12) inset;
}
.availability-badge{
  flex: 0 0 auto;
  white-space: nowrap;
}
.badge strong{color:var(--accent)}
.badge .mini{color:var(--muted); font-weight:700}
.grid{
  margin-top:18px;
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  gap:12px;
}
.row-split{
  grid-column: span 12;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
}
.row-split > .card{
  height: 100%;
}
.card{
  border:1px solid var(--line, rgba(96, 120, 170, .45));
  border-radius:var(--radius);
  background: var(--card-bg, rgba(21,30,50,.62));
  box-shadow: none;
  padding:16px;
  color: var(--text);
}
.roles-card{
  justify-self: start;
  width: fit-content;
  max-width: 100%;
}
.card h2{margin:0 0 10px; font-size:16px}
.card p{margin:0; color:var(--muted)}
.card ul{margin:8px 0 0 14px; padding-left:12px; color:var(--muted)}
.card li{margin:6px 0}
.card .card-meta{
  margin-top:4px;
  color: var(--text);
  font-weight: 600;
}
.best-at-card ul{color:var(--text)}
.roles-card .roles-list{color:var(--text)}
.other-projects-card ul{color:var(--text)}
.other-projects-card a{color:inherit}
.kpi{
  display:flex; gap:14px; flex-wrap:wrap; margin-top:10px
}
.kpi .item{
  flex: 1 1 160px;
  border:1px solid var(--line, rgba(120, 150, 200, .55));
  border-radius:14px;
  padding:12px 12px;
  background: var(--kpi-bg, rgba(24,38,64,.82));
  box-shadow: none;
  color: var(--text);
}
.kpi .big{font-size:16px; font-weight:700}
.kpi .small{color:var(--text); font-size:14px; margin-top:2px}
.section-title{
  margin:26px 0 12px;
  font-size:14px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--muted);
}
.cards{display:grid; grid-template-columns: repeat(2, 1fr); gap:12px}
@media (min-width: 1200px){ .cards{grid-template-columns: repeat(3, 1fr)} }
@media (max-width: 900px){ .cards{grid-template-columns: 1fr} }
.production-apps{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  width: 100%;
}
.waybetter-card{
  grid-column: auto;
}
.app-suite-pills{
  margin-top: 6px;
}
.waybetter-store-groups{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 8px;
}
.waybetter-store-group{
  display: grid;
  gap: 8px;
}
.waybetter-store-group .store-badges{
  margin-top: 0;
}
@media (max-width: 900px){
  .production-apps{
    grid-template-columns: 1fr;
  }
  .waybetter-store-groups{
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px){
  .production-apps .card .top{
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .production-apps .card .top h2{
    grid-column: 1 / -1;
  }
  .production-apps .card .top .tag,
  .production-apps .card .top .tag-group{
    justify-self: start;
  }
  .production-apps .card .top .tag-group{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px;
  }
  .production-apps .store-badges{
    justify-content: flex-start;
    gap: 10px;
  }
}
.cards-auto{grid-template-columns: repeat(auto-fit, minmax(260px, 1fr))}
.cards.recent-stack{
  grid-template-columns: minmax(0, 1fr) var(--recent-card-w) !important;
  align-items: start;
  column-gap: 12px;
  row-gap: 8px;
}
.other-projects-card{
  width: calc(100% - var(--recent-card-w) - 12px);
}
.cards.recent-stack .recent-side .top{
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: 6px 10px;
}
.cards.recent-stack .recent-side .top h2{
  margin: 0;
}
.cards.recent-stack .recent-side .top .tag,
.cards.recent-stack .recent-side .top .tag-group{
  justify-self: end;
  margin-left: 0;
}
@media (min-width: 1200px){
  .cards-auto{grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))}
}
.other-projects-grid{
  grid-template-columns: 2fr 1fr;
}
@media (max-width: 900px){
  .other-projects-grid{
    grid-template-columns: 1fr;
  }
}
.recent-stack > .card{
  height: auto;
}
.recent-stack > .card:first-child{
  width: 100%;
  height: 100%;
  grid-row: span 2;
}
.recent-side-stack{
  grid-column: 2;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.recent-side-stack .card{width: 100%}
@media (max-width: 900px){
  .cards.recent-stack{
    grid-template-columns: 1fr !important;
  }
  .recent-stack{
    grid-template-columns: 1fr;
  }
  .recent-side-stack{
    grid-column: auto;
    grid-row: auto;
  }
  .recent-stack > .card:first-child{
    grid-row: auto;
  }
  .other-projects-card{
    width: 100%;
  }
}
.cards .span-2{grid-column: span 2}
@media (max-width: 1199px){
  .cards .span-2{grid-column: auto}
}
.card .top{display:flex; align-items:flex-start; justify-content:space-between; gap:10px}
.card .top .tag,
.card .top .tag-group{
  margin-left: auto;
}
.tag-group{
  display:flex;
  align-items:center;
  gap:8px;
}
.tag{
  font-family: var(--mono);
  font-size: 12px;
  color: var(--text);
  padding: 6px 10px;
  border:1px solid var(--line);
  border-radius: 999px;
  background: transparent;
  white-space: nowrap;
}
.tag.green,
.tag.blue,
.tag.amber,
.tag.white,
.tag.red,
.tag.cyan{
  border-color: var(--border-stronger, var(--line));
}
.hr{height:1px; background: var(--line); border:0; margin:14px 0}
.footer{
  margin-top:32px;
  color:var(--muted);
  display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
  border-top:1px solid var(--line);
  padding-top:14px;
}
.copy{
  border:1px solid var(--line);
  border-radius: 12px;
  padding: 10px 12px;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  background: transparent;
  font-family: var(--mono);
  font-size: 14px;
  width: fit-content;
}
.copy > span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space: nowrap;
  min-width: 0;
}
.hero-actions{
  margin-top:12px;
  display:grid;
  grid-template-columns: 1fr;
  align-items:start;
  gap:10px;
}
.mixterious-demo-embed-shell{
  width: min(390px, 100%);
  margin: 0 auto;
  aspect-ratio: 390 / 844;
  border: 1px solid var(--line);
  border-radius: 32px;
  overflow: hidden;
  background: #050a12;
}
.mixterious-demo-embed-shell iframe{
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  background: #050a12;
}
.hero-demo-inline,
.mixterious-demo-embed-shell,
.mixterious-demo-embed-shell iframe{
  pointer-events: auto;
}
@media (max-width: 900px){
  .hero-actions{
    grid-template-columns: 1fr;
  }
  .hard-results-split{
    grid-template-columns: 1fr;
  }
  .hard-results-side .badges{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
  }
  .mixterious-demo-embed-shell{
    border-radius: 22px;
  }
}
@media (max-width: 900px){
  .availability-badge{
    flex: 1 1 100%;
    white-space: normal;
  }
  .row-split{
    grid-template-columns: 1fr;
  }
  .roles-card{
    width: 100%;
    justify-self: stretch;
  }
  .other-projects-card{
    width: 100%;
  }
  .copy{
    width: 100%;
    flex-wrap: wrap;
    word-break: break-word;
  }
}
.copy .email-emoji{
  font-size: 20px;
  line-height: 1;
  margin-right: 0;
}
.copy button{
  appearance:none;
  border:1px solid var(--line);
  background: transparent;
  color: var(--text);
  border-radius: 10px;
  padding: 8px 10px;
  font-weight: 600;
  cursor: pointer;
  margin-left: auto;
  margin-right: 0;
  width: 100px;
}
.copy button:hover{border-color: rgba(34,197,94,.55)}
.note{
  margin-top:10px;
  font-size: 13px;
  color: var(--muted);
}

/* Scan-first refresh: quieter typography, clearer hierarchy, less visual noise. */
:root{
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semi: 600;
}
body{
  line-height: 1.5;
}
.brand strong{
  font-weight: var(--fw-semi);
}
.pill{
  font-weight: var(--fw-medium);
}
.nav .pill.social-pill .social-label{
  font-weight: var(--fw-medium);
}
.h1{
  margin: 0 0 10px;
  font-size: clamp(34px, 4.2vw, 46px);
  font-weight: var(--fw-semi);
  line-height: 1.08;
  letter-spacing: -0.02em;
}
.cazares-llc .h1{
  text-shadow: none;
}
.sub{
  font-size: 17px;
  line-height: 1.55;
}
.card h2{
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: var(--fw-semi);
}
.card-sub{
  font-size: 15px;
  line-height: 1.55;
}
.app-achievements{
  margin-top: 10px;
}
.tag{
  font-size: 11.5px;
  font-weight: var(--fw-medium);
}
.pill.mini{
  font-weight: var(--fw-medium);
}
.pill.mini strong{
  font-weight: var(--fw-semi);
}
.badge{
  font-weight: var(--fw-medium);
}
.kpi .big{
  font-weight: var(--fw-semi);
}
.section-title{
  font-size: 12px;
  letter-spacing: 0.14em;
}
.copy button{
  font-weight: var(--fw-semi);
}
.copy.copy-wide{
  width: 100%;
}
.copy.copy-wide > span{
  white-space: normal;
}
.hero-revamp{
  gap: 18px;
  align-items: start;
}
.hero-main-revamp{
  grid-template-columns: 128px minmax(0, 1fr);
  gap: 22px;
}
.hero-media-revamp{
  gap: 12px;
}
.hero-availability{
  margin: 0;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.45;
}
.eyebrow{
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: var(--fw-medium);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.hero-value{
  margin: 0 0 8px;
}
.hero-proof-line{
  display: block;
  margin-top: 1px;
  color: var(--text);
  font-weight: 600;
}
.hero-proof-line strong{
  font-weight: 700;
}
.how-i-work-rail{
  margin-top: 2px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-1, transparent);
}
.how-i-work-rail h3{
  margin: 0;
  font-size: 12px;
  line-height: 1.2;
}
.how-i-work-rail-list{
  margin: 6px 0 0 14px;
  padding-left: 10px;
  display: grid;
  gap: 4px;
  font-size: 11px;
  line-height: 1.25;
}
.how-i-work-rail-list li{
  margin: 0;
}
.how-i-work-rail-list strong{
  color: var(--text);
}
.launch-panel{
  width: min(430px, 36vw);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-content: start;
}
.launch-panel .top{
  align-items: center;
}
.launch-tags{
  margin-top: 4px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.launch-roles{
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.launch-roles .roles-list{
  margin-top: 8px;
}
.launch-evidence{
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.launch-evidence .kpi{
  margin-top: 8px;
}
.hero-revamp .hero-demo-inline{
  align-items: stretch;
}
.hero-revamp .beta-qr-card{
  width: 100%;
  margin: 0;
  grid-template-columns: 90px minmax(0, 1fr);
}
.hero-revamp .beta-qr-image{
  width: 90px;
  height: 90px;
}
.hero-revamp .beta-qr-copy .beta-qr-title{
  font-size: 13px;
  font-weight: var(--fw-semi);
}
.hero-revamp .beta-qr-link{
  font-family: var(--sans);
  font-size: 12px;
}
.spotlight{
  margin-top: 12px;
}
.pipeline-steps{
  margin-top: 8px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.pipeline-step{
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px;
  background: var(--surface-1, transparent);
}
.pipeline-step h3{
  margin: 0 0 6px;
  font-size: 15px;
  font-weight: var(--fw-semi);
}
.pipeline-step p{
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
}
.architecture-list{
  margin: 8px 0 0;
  padding-left: 18px;
  color: var(--text);
}
.architecture-list li{
  margin: 7px 0;
  line-height: 1.45;
}
.architecture-list strong{
  font-weight: var(--fw-semi);
}
.shipstation-metrics{
  margin-top: 10px;
}
@media (max-width: 1100px){
  .hero-revamp{
    grid-template-columns: 1fr;
  }
  .hero-main-revamp{
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .hero-media-revamp{
    flex-direction: row;
    align-items: center;
  }
  .launch-panel{
    width: 100%;
  }
  .pipeline-steps{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 720px){
  .sub{
    font-size: 16px;
  }
  .hero-media-revamp{
    flex-direction: column;
    align-items: flex-start;
  }
  .launch-panel{
    padding: 14px;
  }
  .pipeline-steps{
    grid-template-columns: 1fr;
  }
}

/* Fast scan compression: higher signal, much smaller footprint. */
.container{
  max-width: 980px;
  padding: 8px 14px 30px;
}
.nav{
  padding: 8px 10px;
  gap: 10px;
}
.brand strong{
  font-size: 21px;
}
.nav .pill{
  min-height: 38px;
  padding: 0 10px;
  font-size: 13.2px;
}
.nav .pill.social-pill img{
  width: 22px;
  height: 22px;
}
.hero-fastlane{
  margin-top: 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 348px);
  gap: 14px;
  align-items: start;
}
body.demo-enabled .hero-fastlane{
  grid-template-columns: minmax(0, 1fr) minmax(300px, 348px);
}
.hero-left-column{
  display: grid;
  gap: 12px;
}
.hero-main-fastlane{
  display: grid;
  grid-template-columns: 196px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.hero-media-fastlane{
  display: grid;
  gap: 10px;
  align-content: start;
}
.avatar{
  width: 96px;
  height: 96px;
  border-radius: 16px;
}
.hero-availability{
  font-size: 11.5px;
  line-height: 1.35;
  margin-top: 1px;
}
.hero-copy-fastlane .h1{
  margin: 0 0 5px;
  font-size: clamp(27px, 3.2vw, 35px);
  line-height: 1.05;
}
.hero-copy-fastlane .sub{
  margin: 0;
  font-size: 15px;
  line-height: 1.35;
}
.hero-stack-tags{
  margin-top: 10px;
  gap: 5px;
  flex-wrap: wrap;
}
.hero-stack-tags .tag{
  font-size: 11.6px;
  padding: 5px 8px;
  white-space: nowrap;
}
.scan-metrics{
  margin: 10px 0 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.scan-metrics-rail{
  grid-template-columns: 1fr;
  gap: 6px;
}
.scan-metrics-inline{
  margin-top: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.scan-metric{
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px 8px 7px;
  background: var(--surface-1, transparent);
  min-width: 0;
}
.scan-metric .metric-value{
  margin: 0;
  font-size: 15.5px;
  line-height: 1.05;
  color: var(--text);
  font-weight: 600;
}
.scan-metric .metric-label{
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.2;
}
.murphy-callout{
  margin-top: 10px;
  padding: 11px 12px 12px;
  border-radius: 12px;
  border: 1px solid var(--line);
  border-left: 4px solid rgba(70, 92, 127, 0.45);
  background:
    linear-gradient(180deg, rgba(112, 126, 148, 0.2) 0%, rgba(112, 126, 148, 0.1) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.45),
    inset 0 -1px 0 rgba(82, 102, 132, 0.22),
    0 1px 2px rgba(20, 36, 62, 0.08);
  display: grid;
  gap: 6px;
}
.murphy-eyebrow{
  margin: 0;
  font-size: 10.5px;
  font-family: var(--mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}
.murphy-quote{
  margin: 0;
  font-size: clamp(16px, 2vw, 20px);
  line-height: 1.16;
  font-style: normal;
  font-weight: 500;
  color: var(--muted);
}
.murphy-emphasis-word{
  font-style: normal;
  color: var(--text);
  font-weight: 800;
}
.murphy-recovery-line{
  margin: 0;
  padding-top: 8px;
  border-top: 1px solid rgba(79, 99, 128, 0.36);
  font-size: 14.8px;
  line-height: 1.24;
  font-weight: 700;
  color: var(--text);
}
.hero-roles{
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.hero-roles-side{
  margin-top: 0;
  padding-top: 10px;
}
.hero-roles .top{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.hero-roles h3{
  margin: 0;
  font-size: 14px;
}
.roles-inline-list{
  margin-top: 6px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 12px;
}
.hero-roles-side .roles-inline-list{
  grid-template-columns: 1fr;
  margin-top: 6px;
  margin-left: 14px;
  padding-left: 10px;
  font-size: 12.4px;
  line-height: 1.25;
}
.hero-support-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-items: start;
}
.how-i-work-row{
  margin: 0;
  padding: 10px 11px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-1, transparent);
}
.how-i-work-row .top{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.how-i-work-row h3{
  margin: 0;
  font-size: 14px;
}
.how-i-work-row-list{
  margin-top: 8px;
}
.how-i-work-row .workflow-inline{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.hero-actions{
  margin-top: 8px;
  gap: 0;
}
.copy{
  padding: 8px 10px;
  border-radius: 10px;
  font-size: 13px;
}
.copy button{
  padding: 6px 10px;
  width: 86px;
  font-size: 12px;
}
.launch-panel{
  width: 100%;
  max-width: 348px;
  padding: 14px;
  gap: 10px;
  align-items: stretch;
  text-align: left;
}
.launch-panel .top{
  justify-content: flex-start;
  align-items: flex-start;
  text-align: left;
}
.launch-panel .top .tag{
  margin-left: 0;
}
.launch-panel .top h2{
  margin-bottom: 0;
}
.launch-panel .card-sub{
  margin: 0;
  font-size: 13.5px;
  line-height: 1.35;
}
.launch-snapshot-list{
  margin-top: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.launch-best-at{
  margin-top: 10px;
}
.beta-qr-link{
  margin-top: 1px;
  font-size: 11px;
  line-height: 1.2;
}
.scan-block{
  border-top: 1px solid var(--line);
  padding-top: 10px;
}
.scan-block .top{
  align-items: center;
}
.scan-block h3{
  margin: 0;
  font-size: 14px;
}
.compact-list{
  margin: 8px 0 0 16px;
  padding-left: 12px;
  display: grid;
  gap: 5px;
  color: var(--text);
  font-size: 13px;
  line-height: 1.3;
}
.compact-list li{
  margin: 0;
}
.evidence-list strong{
  color: var(--text);
}
.grid{
  margin-top: 10px;
  gap: 10px;
}
.card{
  padding: 11px;
  border-radius: 12px;
}
.card h2{
  margin: 0 0 5px;
  font-size: 16px;
}
.card .card-meta{
  margin-top: 2px;
  font-size: 14px;
}
.card ul{
  margin: 6px 0 0 14px;
  padding-left: 12px;
}
.card li{
  margin: 4px 0;
  line-height: 1.35;
}
.workflow-inline{
  margin: 5px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}
.workflow-inline li{
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 7px 9px;
  background: var(--surface-1, transparent);
  font-size: 12.8px;
  line-height: 1.3;
  color: var(--text);
}
.workflow-inline li strong{
  font-weight: 700;
}
.row-split{
  gap: 10px;
}
.section-title{
  margin: 10px 0 6px;
  font-size: 12.5px;
  letter-spacing: 0.12em;
}
.shipstation-summary-card{
  margin: 0;
  padding: 11px 12px;
}
.shipstation-summary-card .top{
  align-items: center;
}
.shipstation-summary-lede{
  margin: 0;
  font-size: 13.8px;
  line-height: 1.3;
  color: var(--text);
}
.shipstation-summary-list{
  margin: 7px 0 0 16px;
  padding-left: 12px;
  display: grid;
  gap: 5px;
  font-size: 13.2px;
  line-height: 1.32;
  color: var(--muted);
}
.shipstation-summary-list li{
  margin: 0;
}
.portfolio-matrix-wrap{
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-1, transparent);
  overflow: hidden;
}
.portfolio-matrix{
  width: 100%;
  border-collapse: collapse;
}
.portfolio-matrix thead th{
  text-align: left;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 600;
  background: var(--surface-2, transparent);
}
.portfolio-matrix tbody tr + tr{
  border-top: 1px solid var(--line);
}
.portfolio-matrix tbody th,
.portfolio-matrix tbody td{
  padding: 8px 10px;
  vertical-align: top;
  font-size: 13px;
  line-height: 1.3;
  color: var(--text);
}
.portfolio-matrix tbody th{
  width: 17%;
  font-size: 15px;
  font-weight: 600;
  text-align: left;
}
.portfolio-matrix td[data-label="Stack"]{
  width: 18%;
}
.portfolio-matrix td[data-label="Role"]{
  width: 13%;
  white-space: nowrap;
}
.portfolio-matrix td[data-label="Impact"]{
  width: 32%;
  color: var(--muted);
}
.portfolio-matrix td[data-label="Impact"]:not(.project-impact-cell) strong{
  color: var(--text);
  font-weight: 700;
}
.portfolio-matrix td[data-label="Links"]{
  width: 21%;
}
.portfolio-matrix td[data-label="Impact"].project-impact-cell{
  min-width: 0;
}
.matrix-chip{
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  margin: 0 5px 5px 0;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 11px;
  font-family: var(--mono);
  white-space: nowrap;
}
.matrix-links{
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.matrix-links.store-pair{
  flex-wrap: nowrap;
  align-items: center;
}
.matrix-links.product-links-cell{
  display: grid;
  gap: 4px;
  justify-items: start;
}
.product-badge-group{
  display: grid;
  gap: 4px;
  justify-items: start;
}
.product-badge-label{
  font-size: 10px;
  font-family: var(--mono);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  line-height: 1.1;
}
.product-badge-pair{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 5px;
}
.product-badge-pair .matrix-link-store{
  flex: 0 0 auto;
}
.matrix-links.waybetter-links-cell{
  display: grid;
  gap: 6px;
  justify-items: start;
}
.waybetter-badge-group{
  display: grid;
  gap: 4px;
  justify-items: start;
}
.waybetter-badge-label{
  font-size: 10px;
  font-family: var(--mono);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
  line-height: 1.1;
}
.waybetter-badge-pair{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 5px;
}
.waybetter-badge-pair .matrix-link-store{
  flex: 0 0 auto;
}
.matrix-links.project-pill-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-items: stretch;
  width: 100%;
}
.project-impact-layout{
  display: grid;
  gap: 8px;
  align-items: start;
}
.project-impact-copy{
  margin: 0;
  color: var(--muted);
}
.project-impact-layout .project-pill-grid{
  width: min(320px, 100%);
  justify-self: end;
}
.matrix-link{
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  text-decoration: none;
  font-size: 11px;
  line-height: 1;
  font-weight: 500;
  background: var(--surface-1, transparent);
  white-space: nowrap;
}
.matrix-links.project-pill-grid .matrix-link{
  width: 100%;
  min-height: 40px;
  padding: 8px 12px;
  border-radius: 12px;
  justify-content: flex-start;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.1;
  white-space: normal;
}
.project-pill-octocat{
  width: 18px;
  height: 18px;
  display: block;
  object-fit: contain;
  flex: 0 0 auto;
}
.matrix-links.project-pill-grid .matrix-link span{
  display: inline-block;
  overflow-wrap: break-word;
  word-break: normal;
}
.portfolio-matrix td[data-label="Links"].project-links-empty{
  color: transparent;
}
.matrix-link:hover{
  border-color: var(--border-stronger, var(--line));
}
.matrix-link-store{
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
}
.matrix-link-store:hover{
  border: 0;
  transform: none;
  opacity: 0.92;
}
.store-badge-image{
  display: block;
  width: auto;
  height: 24px;
}
.compact-apps-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.app-mini{
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 10px;
}
.app-mini .top{
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  gap: 6px 8px;
}
.app-mini h2{
  margin: 0;
  min-width: 0;
}
.app-mini .top .tag-group{
  margin-left: 0;
  justify-self: start;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 6px;
  max-width: 100%;
}
.app-mini .tag{
  font-size: 10px;
}
.app-mini .card-sub{
  margin: 0;
  font-size: 12.6px;
  line-height: 1.26;
}
.app-proof{
  margin: 0;
  font-size: 11.8px;
  line-height: 1.24;
  color: var(--text);
}
.app-mini-wide{
  grid-column: auto;
}
.store-pill-row{
  margin-top: 1px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.store-pill-link{
  display: inline-flex;
  align-items: center;
  padding: 4px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  text-decoration: none;
  font-size: 11px;
  line-height: 1;
  font-weight: 600;
  background: var(--surface-1, transparent);
}
.store-pill-link:hover{
  border-color: var(--border-stronger, var(--line));
}
.compact-projects .card{
  padding: 11px 12px;
}
.project-note{
  margin: 2px 0 0;
  font-size: 13px;
  line-height: 1.35;
}
.project-links{
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.project-link-pill{
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 11px;
  line-height: 1;
  text-decoration: none;
  background: var(--surface-1, transparent);
}
.projects-mini .project-links{
  margin-top: 5px;
}
.project-link-pill:hover{
  border-color: var(--border-stronger, var(--line));
}
.footer{
  margin-top: 18px;
  padding-top: 10px;
  font-size: 14.3px;
}

@media (max-width: 1100px){
  .hero-main-fastlane{
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 12px;
  }
  .hero-roles-side .roles-inline-list{
    font-size: 11.5px;
  }
  .hero-support-grid{
    grid-template-columns: 1fr;
  }
  .hero-fastlane{
    grid-template-columns: 1fr;
  }
  body.demo-enabled .hero-fastlane{
    grid-template-columns: 1fr;
  }
  .launch-panel{
    max-width: none;
  }
  .scan-metrics{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .hero-stack-tags{
    flex-wrap: wrap;
  }
  .workflow-inline{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .compact-apps-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .app-mini-wide{
    grid-column: span 2;
  }
  .portfolio-matrix{
    table-layout: fixed;
  }
  .portfolio-matrix tbody th{
    width: 20%;
  }
  .portfolio-matrix td[data-label="Impact"]{
    width: 30%;
  }
}

@media (max-width: 980px){
  .hero-main-fastlane{
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .hero-media-fastlane{
    grid-template-columns: 92px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
  }
  .hero-media-fastlane .hero-roles-side{
    grid-column: 1 / -1;
  }
  .hero-roles-side .roles-inline-list{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-left: 14px;
    padding-left: 10px;
    font-size: 12.2px;
  }
  .hero-stack-tags{
    flex-wrap: wrap;
  }
  .portfolio-matrix thead{
    display: none;
  }
  .portfolio-matrix,
  .portfolio-matrix tbody,
  .portfolio-matrix tr,
  .portfolio-matrix th,
  .portfolio-matrix td{
    display: block;
    width: 100%;
  }
  .portfolio-matrix tbody tr{
    padding: 8px 10px;
  }
  .portfolio-matrix tbody tr + tr{
    border-top: 1px solid var(--line);
  }
  .portfolio-matrix tbody th,
  .portfolio-matrix tbody td{
    padding: 2px 0;
  }
  .portfolio-matrix tbody th{
    margin-bottom: 4px;
    font-size: 15px;
    text-align: left;
  }
  .portfolio-matrix td::before{
    display: none;
  }
  .portfolio-matrix td[data-label="Role"]{
    margin-top: 3px;
    font-weight: 600;
    color: var(--muted);
  }
  .portfolio-matrix td[data-label="Impact"]{
    margin-top: 2px;
    color: var(--muted);
  }
  .portfolio-matrix td[data-label="Links"]{
    margin-top: 4px;
  }
  .matrix-links.store-pair{
    flex-wrap: nowrap;
  }
  .matrix-links.project-pill-grid{
    grid-template-columns: 1fr;
  }
  .project-impact-layout .project-pill-grid{
    width: 100%;
    justify-self: start;
  }
  .portfolio-matrix td[data-label="Links"].project-links-empty{
    display: none;
  }
  .store-badge-image{
    height: 21px;
  }
}

@media (max-width: 720px){
  .container{
    padding: 12px 10px 24px;
  }
  .hero-media-fastlane{
    grid-template-columns: 78px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
  }
  .hero-media-fastlane .hero-roles-side{
    grid-column: 1 / -1;
  }
  .hero-media-fastlane .how-i-work-rail{
    grid-column: 1 / -1;
  }
  .hero-media-fastlane .scan-metrics-rail{
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .avatar{
    width: 78px;
    height: 78px;
    border-radius: 14px;
  }
  .hero-copy-fastlane .h1{
    font-size: 30px;
  }
  .hero-copy-fastlane .sub{
    font-size: 15px;
  }
  .murphy-callout{
    margin-top: 8px;
    padding: 9px 10px 10px;
  }
  .murphy-quote{
    font-size: 16px;
  }
  .murphy-recovery-line{
    padding-top: 7px;
    font-size: 13.8px;
    line-height: 1.25;
  }
  .scan-metric .metric-value{
    font-size: 15px;
  }
  .roles-inline-list{
    grid-template-columns: 1fr;
  }
  .hero-roles-side .roles-inline-list{
    grid-template-columns: 1fr;
    margin-left: 11px;
    font-size: 12.2px;
  }
  .workflow-inline{
    grid-template-columns: 1fr;
  }
  .row-split{
    grid-template-columns: 1fr;
  }
  .compact-apps-grid{
    grid-template-columns: 1fr;
  }
  .app-mini-wide{
    grid-column: auto;
  }
  .store-badge-image{
    height: 20px;
  }
}

/* Traditional vertical page flow with expandable portfolio section. */
.content-stack{
  margin-top: 0;
  position: relative;
}
.top-stack{
  margin-top: 4px;
}
.stack-shell{
  display: grid;
  gap: 10px;
}
.top-stack .hero-fastlane{
  margin-top: 0;
}
.portfolio-toggle-row{
  display: flex;
  justify-content: center;
  margin-top: 2px;
}
.portfolio-expand-btn{
  width: min(420px, 100%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 11px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-1, transparent);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
  color: var(--text);
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
}
.portfolio-expand-btn:hover{
  border-color: var(--border-stronger, var(--line));
  transform: translateY(-1px);
}
.portfolio-expand-btn:focus-visible{
  outline: 2px solid var(--line);
  outline-offset: 2px;
}
.portfolio-expand-icon{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  border: 1px solid var(--line);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  line-height: 1;
  flex: 0 0 auto;
  background: var(--surface-2, transparent);
}
.portfolio-panel{
  display: grid;
  gap: 8px;
}
.portfolio-panel.is-collapsed{
  display: none;
}
.carousel-shell{
  grid-area: shell;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 8px;
  background: var(--surface-2, transparent);
  min-width: 0;
}
.carousel-meta{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}
.carousel-kicker{
  margin: 0;
  font-size: 15px;
  line-height: 1.2;
  color: var(--text);
  font-weight: var(--fw-semi);
}
.carousel-center{
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}
.carousel-dots{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.carousel-dot{
  width: 12px;
  height: 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: transparent;
  cursor: pointer;
  padding: 0;
}
.carousel-dot.is-active{
  background: var(--text);
  border-color: var(--text);
}
.carousel-status{
  margin: 0;
  font-size: 12px;
  color: var(--muted);
}
.carousel-window{
  overflow: hidden;
}
.carousel-track{
  display: block;
}
.carousel-page{
  min-width: 0;
}
.carousel-page + .carousel-page{
  margin-top: 14px;
}
.carousel-page > .grid:first-child{
  margin-top: 0;
}
.carousel-arrow{
  display: none;
  position: absolute;
  top: 50%;
  align-items: center;
  justify-content: center;
  width: 74px;
  height: 74px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface-1, transparent);
  color: var(--text);
  cursor: pointer;
  font-size: 56px;
  line-height: 1;
  padding: 0;
  transform: translateY(-50%);
  transition: transform .12s ease, border-color .12s ease, opacity .12s ease, background .12s ease;
}
.carousel-arrow span{
  transform: translateY(-2px);
}
.carousel-arrow-left{
  left: -84px;
}
.carousel-arrow-right{
  right: -84px;
}
.carousel-arrow:hover{
  transform: translateY(-50%) scale(1.03);
  border-color: var(--border-stronger, var(--line));
}
.carousel-arrow:disabled{
  opacity: .4;
  cursor: not-allowed;
  transform: translateY(-50%);
}
body.js-enabled .carousel-arrow{
  display: inline-flex;
}
body.js-enabled .carousel-window{
  overflow: hidden;
}
body.js-enabled .carousel-track{
  display: block;
}
body.js-enabled .carousel-page{
  display: none;
}
body.js-enabled .carousel-page.is-active{
  display: block;
}
body.js-enabled .carousel-page + .carousel-page{
  margin-top: 0;
}

@media (max-width: 1100px){
  .stack-shell{
    gap: 9px;
  }
  .carousel-shell{
    padding: 9px;
  }
  .portfolio-expand-btn{
    width: 100%;
  }
}

@media (max-width: 720px){
  .carousel-shell{
    padding: 8px;
    border-radius: 12px;
  }
  .portfolio-expand-btn{
    width: 100%;
    padding: 10px 12px;
  }
}

@media (min-width: 1101px){
  .container{
    max-width: 1000px;
    padding: 8px 12px 26px;
  }
  .top-nav{
    position: sticky;
    top: 0;
    z-index: 20;
  }
  .top-stack{
    margin-top: 4px;
  }
  .carousel-arrow{
    width: 58px;
    height: 58px;
    font-size: 44px;
  }
  .carousel-arrow-left{
    left: -58px;
  }
  .carousel-arrow-right{
    right: -58px;
  }
}