/* Hero SEO presentation overrides — preserves the existing dark editorial design. */
.h-quote{max-width:34ch}
.h-ranks{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.65rem;
  width:100%;
  max-width:920px;
  align-items:stretch;
}
.h-rank{
  min-width:0;
  min-height:96px;
  height:96px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:.25rem;
  padding:.75rem .9rem;
  line-height:1.35;
  overflow:hidden;
}
.h-rank.rank-aiims{color:#D97850;border-color:rgba(194,95,56,.42);background:rgba(194,95,56,.035)}
.h-rank.rank-pgi{color:#C9A84C;border-color:rgba(201,168,76,.40);background:rgba(201,168,76,.055)}
.h-rank.rank-tmc{color:#B9B5AE;border-color:rgba(239,235,227,.18);background:rgba(239,235,227,.025)}
.h-rank .rank-kicker{font-size:9px;letter-spacing:.15em;color:var(--dm);line-height:1.2}
.h-rank strong{font-size:14px;letter-spacing:.08em;color:var(--tx);font-weight:600;line-height:1.15}
.h-rank .rank-detail{font-size:8px;letter-spacing:.08em;color:var(--dm);line-height:1.35}
/* SketchRoot logo: mouse/gyroscope-driven 3D tilt (same behaviour as sketchroot.com's header logo) */
.h-founder-logo{display:inline-block;line-height:0}
.h-founder-img{will-change:transform;transition:transform .08s linear;transform-origin:50% 50%}
.h-founder-logo:hover .h-founder-img{filter:brightness(1.08)}
@media(max-width:1100px) and (min-width:961px){
  .h-rank{min-height:104px;height:104px;padding:.7rem .7rem}
  .h-rank strong{font-size:12px}
  .h-rank .rank-detail{font-size:7.5px}
}
@media(max-width:960px){
  .h-ranks{grid-template-columns:1fr;max-width:520px;gap:.5rem}
  .h-rank{height:auto;min-height:76px}
  .h-rank .rank-detail{font-size:8px}
}
@media(prefers-reduced-motion:reduce){
  .h-founder-img{transition:none}
}

.h-rank .rank-gold{font-size:20px;font-weight:700;letter-spacing:.06em;color:#C9A84C;line-height:1.1}
@media(max-width:900px){.h-rank .rank-gold{font-size:17px}}

/* SketchRoot logo: letters hop around confused, reshuffle, settle into "SketchRoot"; the two o's are eyes that look around and blink */
.sr-logo{overflow:visible}
.sr-g{transform-box:fill-box;transform-origin:center;animation:sr-shuffle 10s infinite;animation-delay:calc(var(--i)*60ms)}
@keyframes sr-shuffle{
  0%,44%{transform:translate(0,0) rotate(0);animation-timing-function:cubic-bezier(.34,1.56,.64,1)}
  52%{transform:translate(var(--x1),var(--y1)) rotate(var(--r1));animation-timing-function:cubic-bezier(.34,1.56,.64,1)}
  60%{transform:translate(var(--x2),var(--y2)) rotate(var(--r2));animation-timing-function:cubic-bezier(.34,1.56,.64,1)}
  68%{transform:translate(var(--x3),var(--y3)) rotate(var(--r3));animation-timing-function:cubic-bezier(.34,1.56,.64,1)}
  80%,100%{transform:translate(0,0) rotate(0)}
}
.sr-eye{transform-box:fill-box;transform-origin:center;animation:sr-blink 3.6s infinite}
@keyframes sr-blink{0%,90%,100%{transform:scaleY(1)}94%{transform:scaleY(.08)}}
.sr-pupil{animation:sr-look 10s infinite}
@keyframes sr-look{
  0%,4%{transform:translate(0,0)}
  9%,15%{transform:translate(-6px,-1px)}
  20%,26%{transform:translate(6px,-2px)}
  31%,36%{transform:translate(-3px,5px)}
  41%,45%{transform:translate(0,0)}
  50%{transform:translate(6px,-5px)}
  54%{transform:translate(-6px,4px)}
  58%{transform:translate(5px,5px)}
  62%{transform:translate(-5px,-5px)}
  66%{transform:translate(6px,1px)}
  70%{transform:translate(-6px,-1px)}
  80%,100%{transform:translate(0,0)}
}
@media(prefers-reduced-motion:reduce){.sr-g,.sr-eye,.sr-pupil{animation:none}}