:root {
  --green: #3a1714;
  --green2: #c14f2f;
  --cream: #f4ead8;
  --paper: #fffaf0;
  --lime: #f2b544;
  --ink: #2b1713;
  --line: #aa8f78;
}

.scroll-progress { position: fixed; inset: 0 0 auto; height: 3px; z-index: 100; background: transparent; }
.scroll-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, #f2b544, #e36b3f); box-shadow: 0 0 14px #f2b544; }
body { background-image: radial-gradient(circle at var(--pointer-x, 50%) var(--pointer-y, 15%), rgba(242,181,68,.12), transparent 28rem); }
.site-header { background: rgba(58,23,20,.94); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
nav a { position: relative; }
nav a:not(.nav-cta)::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -7px; height: 2px; background: var(--lime); transition: right .3s ease; }
nav a:hover::after, nav a.active::after { right: 0; }
.primary { box-shadow: 0 4px 0 #8f321f; transition: transform .2s ease, box-shadow .2s ease; }
.primary:hover { transform: translateY(-3px); box-shadow: 0 8px 0 #8f321f; }
.dashboard-art { background: linear-gradient(145deg, #3a1714 0%, #6b2a20 100%); transition: transform .45s cubic-bezier(.2,.8,.2,1); transform-style: preserve-3d; }
.feature-card:hover .dashboard-art { transform: perspective(1100px) rotateY(-2deg) rotateX(1deg) scale(1.01); }
.report-section { background: radial-gradient(circle at 85% 15%, #783121 0, transparent 32%), linear-gradient(150deg, #2b100f, #512019); }
.ticker { background: #f2b544; }
.portrait-card { box-shadow: 12px 12px 0 #c14f2f; transition: transform .4s ease, box-shadow .4s ease; }
.portrait-card:hover { transform: translate(-4px,-4px); box-shadow: 18px 18px 0 #c14f2f; }
.portrait-card img { transition: transform .8s cubic-bezier(.2,.8,.2,1), filter .5s ease; }
.portrait-card:hover img { transform: scale(1.035); filter: saturate(1) contrast(1.04); }
.powerbi-frame { position: relative; width: 100%; aspect-ratio: 16 / 9; background: #3a1714; }
.powerbi-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.contact small a { color: #725a4d; }
.feature-card, .principles div, .certs div { transition: border-color .3s ease, transform .3s ease, background-color .3s ease; }
.feature-card:hover { border-color: #c14f2f; }
.principles div:hover { background: rgba(242,181,68,.12); transform: translateY(-4px); }
.certs div:hover { background: #fff3dd; }
.embed-shell { transition: transform .45s ease, box-shadow .45s ease; }
.embed-shell:hover { transform: translateY(-5px); box-shadow: 0 0 0 1px #ffffff35,0 38px 95px #18070699; }
.reveal { transform: translateY(28px) scale(.985); }
.reveal.visible { transform: translateY(0) scale(1); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } .reveal { opacity: 1; transform: none; } }

@media (max-width: 800px) {
  .site-header { height: 68px; }
  .brand { font-size: 34px; }
  .hero {
    min-height: 0;
    padding-top: 42px;
    padding-bottom: 64px;
    gap: 38px;
  }
  .hero-copy { order: 0; }
  .portrait-card {
    order: 1;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 10px 10px 0;
    border-radius: 28px;
    box-shadow: 8px 8px 0 var(--green2);
  }
  .portrait-card:hover { transform: none; box-shadow: 8px 8px 0 var(--green2); }
  .portrait-card img {
    height: clamp(300px, 88vw, 390px);
    border-radius: 20px 20px 0 0;
    object-position: center 33%;
  }
  .portrait-mark { display: none; }
  .portrait-footer { padding: 13px 4px 14px; gap: 12px; }
  .portrait-footer span { font-size: 10px; letter-spacing: .08em; }
  .portrait-footer span:last-child { text-align: right; }
  .eyebrow { margin: 0 0 22px; font-size: 11px; letter-spacing: .14em; }
  h1 { font-size: clamp(48px, 14vw, 66px); line-height: .95; max-width: 11ch; }
  .intro { margin: 22px 0 26px; font-size: 17px; line-height: 1.55; }
  .hero-actions { flex-direction: row; align-items: center; gap: 18px; }
  .hero-actions .button { padding: 14px 18px; gap: 18px; }
  .hero-actions .text-link { font-size: 14px; }
  .mini-proof {
    display: grid;
    grid-template-columns: auto 1fr auto 1fr;
    gap: 10px;
    margin-top: 34px;
    padding-top: 17px;
  }
  .mini-proof strong { font-size: 28px; }
  .mini-proof span { margin: 0; font-size: 9px; }
}

@media (max-width: 420px) {
  .wrap { width: calc(100% - 32px); }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 14px; }
  .mini-proof { grid-template-columns: auto 1fr; }
  .portrait-card img { height: 330px; }
}