/* Research samples share the site's typography and Barba/GSAP page chrome. */
.research-page { color: #1c1d20; background: #fff; font-size: 16px; line-height: 1.65; }
.research-page .wrap { max-width: 1320px; margin: auto; padding: 0 clamp(24px,6vw,96px); }
.research-page header { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 35px 0; border-bottom: 1px solid #d5d6d7; }
.research-page .brand { text-decoration: none; letter-spacing: -.04em; }
.research-page nav { display: flex; flex-wrap: wrap; gap: 16px 28px; }
.research-page nav a { font-size: 14px; text-decoration: none; color: #5b5d60; }
.research-page .wrap > nav { padding: 24px 0; border-bottom: 1px solid #d5d6d7; }
.research-page nav a[aria-current] { color: #1c1d20; text-decoration: underline; text-underline-offset: 6px; }
.research-page a { color: #455ce9; text-underline-offset: 5px; }
.research-page a:hover { text-decoration-thickness: 2px; }
.research-page a:focus-visible { outline: 3px solid #455ce9; outline-offset: 5px; }
.research-page .brand { color: #1c1d20; }
.research-page .page-intro { padding: 90px 0 55px; max-width: 1000px; }
.research-page .eyebrow { font: 12px/1.5 Consolas,monospace; text-transform: uppercase; letter-spacing: 1.8px; color: #5b5d60; }
.research-page h1 { font-size: clamp(42px,6.2vw,88px); letter-spacing: -.045em; line-height: 1.08; margin: 22px 0; font-weight: 450; }
.research-page h2 { font-size: clamp(28px,3vw,40px); line-height: 1.15; letter-spacing: -.025em; margin: 8px 0 20px; }
.research-page h3 { font-size: 18px; line-height: 1.4; margin: 0 0 12px; }
.research-page p { font-size: 16px; line-height: 1.65; margin: 0 0 17px; }
.research-page .page-intro p { font-size: 18px; color: #5b5d60; max-width: 760px; }
.research-page .reading { max-width: 760px; padding-bottom: 65px; }
.research-page .reading h2 { font-size: 30px; margin: 42px 0 16px; }
.research-page .reading ul { padding-left: 22px; list-style: disc; margin-bottom: 20px; }
.research-page .reading li { margin-bottom: 10px; }
.research-page .section { padding: 65px 0; border-top: 1px solid #d5d6d7; }
.research-page .meta { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 25px; }
.research-page .tag { font: 11px/1.5 Consolas,monospace; padding: 5px 9px; border: 1px solid #d5d6d7; display: inline-block; }
.research-page .note { padding: 20px; background: #e9eaeb; color: #5b5d60; margin: 20px 0; }
.research-page .subtle { color: #5b5d60; }
.research-page .actions { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 25px; }
.research-page .step { padding: 20px 0; border-bottom: 1px solid #d5d6d7; }
.research-page .message { background: #f3f3f3; padding: 30px; border-left: 4px solid #455ce9; }
.research-page .report-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.research-page .report-table td, .research-page .report-table th { padding: 14px; text-align: left; border: 1px solid #d5d6d7; }
.research-page .report-table th { background: #e9eaeb; }
.research-page .report-table caption { padding: 12px 0; color: #5b5d60; text-align: left; }
.research-page .sample-list { padding-bottom: 70px; }
.research-page .sample-list article { display: grid; grid-template-columns: 60px 1fr; gap: 20px; padding: 35px 0; border-top: 1px solid #d5d6d7; }
.research-page .sample-list a { color: #1c1d20; text-decoration: none; }
.research-page .sample-list p { max-width: 660px; color: #5b5d60; }
.research-page footer { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px; padding: 25px 0 35px; border-top: 1px solid #d5d6d7; font-size: 12px; color: #5b5d60; }
.research-page .evidence-figure { margin: 30px 0 64px; }
.research-page .evidence-figure > a { display: block; border: 1px solid #d5d6d7; background: #f3f3f3; }
.research-page .evidence-figure img { display: block; width: 100%; height: auto; }
.research-page figcaption { max-width: 760px; padding-top: 16px; font-size: 13px; line-height: 1.6; color: #5b5d60; }
.research-page strong { font-weight: 700; }
@media(max-width:600px) {
  .research-page header { align-items: flex-start; flex-direction: column; gap: 18px; }
  .research-page .page-intro { padding-top: 55px; }
  .research-page .sample-list article { grid-template-columns: 30px 1fr; gap: 12px; }
  .research-page .message { padding: 20px; }
  .research-page .report-table td, .research-page .report-table th { padding: 10px; }
  .research-page footer { flex-direction: column; }
  .research-page .section { padding: 45px 0; }
}
@media print { .research-page nav,.research-page header { display:none; } .research-page .page-intro,.research-page .section { padding:25px 0; } }

/* Homepage proof of work: actual screenshots, with explicit personal-project labels. */
.home-data-work { background: #f1f1f1; color: #1c1d20; }
.home-data-work .data-work-heading { display: grid; grid-template-columns: 1.4fr 1fr; align-items: end; gap: 8%; margin-bottom: clamp(50px,7vw,100px); }
.home-data-work .data-work-eyebrow { font-size: 12px; letter-spacing: .09em; text-transform: uppercase; margin-bottom: 24px; color: #5b5d60; }
.home-data-work .data-work-heading h2 { font-size: clamp(38px,5.5vw,76px); line-height: 1.06; letter-spacing: -.045em; }
.home-data-work .data-work-heading > p { max-width: 36ch; line-height: 1.65; color: #5b5d60; }
.home-data-work .data-work-sample { display: grid; grid-template-columns: 1fr 1.8fr; gap: 6%; align-items: center; padding: 48px 0; border-top: 1px solid #c8c9ca; }
.home-data-work .data-work-number { display: block; font-size: 12px; color: #5b5d60; margin-bottom: 28px; }
.home-data-work h3 { font-size: clamp(28px,3vw,42px); letter-spacing: -.035em; line-height: 1.12; margin-bottom: 24px; }
.home-data-work .data-work-copy p { font-size: 15px; line-height: 1.65; margin-bottom: 24px; max-width: 37ch; color: #5b5d60; }
.home-data-work a { text-decoration: underline; text-underline-offset: 5px; }
.home-data-work a:hover { text-decoration-thickness: 2px; }
.home-data-work a:focus-visible { outline: 3px solid #455ce9; outline-offset: 5px; }
.home-data-work figure { margin: 0; min-width: 0; }
.home-data-work figure > a { display: block; border: 1px solid #c8c9ca; background: white; }
.home-data-work img { display: block; width: 100%; height: auto; }
.home-data-work figcaption { font-size: 12px; line-height: 1.6; color: #5b5d60; margin-top: 14px; max-width: 65ch; }
.home-data-work .data-work-footer { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px; border-top: 1px solid #c8c9ca; padding-top: 32px; }
.home-data-work .data-work-footer p { color: #5b5d60; }
@media(max-width:800px) {
  .home-data-work .data-work-heading, .home-data-work .data-work-sample { grid-template-columns: 1fr; gap: 32px; }
  .home-data-work .data-work-heading > p, .home-data-work .data-work-copy p { max-width: 55ch; }
  .home-data-work .data-work-heading { margin-bottom: 48px; }
  .home-data-work .data-work-sample { padding: 35px 0; }
  .home-data-work .data-work-number { margin-bottom: 18px; }
  .home-data-work .data-work-footer { flex-direction: column; }
}



/* A compact, irregular stack of original screenshots and generated examples. */
.home-feedback { background:#fff; color:#1c1d20; overflow:hidden; padding-top:calc(var(--section-padding) / 2); padding-bottom:calc(var(--section-padding) / 2); }
.home-feedback .feedback-note { font-size:11px; color:#777; margin-bottom:20px; }
.home-feedback .feedback-cloud { position:relative; height:755px; max-width:1120px; margin:auto; }
.home-feedback .feedback-float { position:absolute; display:block; width:34%; max-width:345px; transform:rotate(var(--tilt)); transition:transform .3s ease,filter .3s ease; filter:drop-shadow(0 8px 12px #1c1d2012); }
.home-feedback .feedback-float:hover,.home-feedback .feedback-float:focus-visible { transform:translateY(-8px) rotate(0deg) scale(1.08); z-index:20; }
.home-feedback .feedback-float:focus-visible { outline:3px solid #455ce9; outline-offset:5px; }
.home-feedback .feedback-float img { display:block; width:100%; height:auto; animation:feedback-drift 7s ease-in-out infinite alternate; }
.home-feedback .feedback-generated img { border-radius:8px; }
.home-feedback .feedback-float:nth-child(even) img { animation-duration:9s; animation-delay:-3s; }
.home-feedback .feedback-float:nth-child(3n) img { animation-delay:-5s; }
@keyframes feedback-drift { from { transform:translateY(-5px); } to { transform:translateY(7px); } }
@media(max-width:800px) {
 .home-feedback .feedback-cloud { height:665px; }
 .home-feedback .feedback-float { width:63%; max-width:320px; }
           }
@media(prefers-reduced-motion:reduce) { .home-feedback .feedback-float { transition:none; } .home-feedback .feedback-float img { animation:none; } .home-feedback .feedback-float:hover,.home-feedback .feedback-float:focus-visible { transform:rotate(var(--tilt)); } }

.home-feedback .feedback-float { left:var(--float-left); top:var(--float-top); z-index:var(--float-layer); width:29%; max-width:310px; }
.home-feedback .feedback-float:hover,.home-feedback .feedback-float:focus-visible { z-index:50; }
@media(max-width:800px) { .home-feedback .feedback-float { left:var(--mobile-left); top:var(--mobile-top); width:54%; max-width:280px; } }

/* Full-width collage with deliberate edge spill. */
.home-feedback > .container { max-width:none; width:100%; padding-left:0; padding-right:0; }
.home-feedback .feedback-note { padding-inline:var(--container-padding); }
.home-feedback .feedback-cloud { width:100vw; max-width:none; }
.home-feedback .feedback-float { width:24vw; max-width:350px; }
@media(max-width:800px) { .home-feedback .feedback-float { width:48vw; max-width:300px; } }

.home-feedback { position:relative; }
.home-feedback .feedback-info { position:relative; margin:0 24px 8px auto; width:24px; z-index:60; color:#777; }
.home-feedback .feedback-info summary { list-style:none; cursor:pointer; font-size:17px; text-align:center; }
.home-feedback .feedback-info summary::-webkit-details-marker { display:none; }
.home-feedback .feedback-info summary:focus-visible { outline:2px solid #455ce9; outline-offset:3px; }
.home-feedback .feedback-info p { position:absolute; right:0; top:28px; width:min(300px,80vw); padding:16px; background:white; border:1px solid #ddd; border-radius:8px; font-size:12px; line-height:1.6; box-shadow:0 8px 24px #00000012; }

/* Compact homepage introduction and image-led research previews. */
.home-intro.home-intro-compact { padding:64px 0; }
.home-intro-compact .intro-compact-layout { display:flex; gap:8%; align-items:center; justify-content:space-between; }
.home-intro-compact h2 { width:48%; font-size:clamp(30px,3.8vw,52px); line-height:1.12; letter-spacing:-.035em; margin:0; }
.home-intro-compact .intro-compact-layout > div { width:44%; }
.home-intro-compact .intro-compact-layout p { font-size:16px; line-height:1.6; margin:0 0 18px; max-width:44ch; }
.home-intro-compact .intro-compact-links { display:flex; flex-wrap:wrap; gap:12px 28px; font-size:15px; }
.home-intro-compact a { text-decoration:underline; text-underline-offset:5px; }
.home-data-work.home-data-compact { padding:64px 0; }
.home-data-compact .data-compact-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:28px; }
.home-data-compact .data-work-eyebrow { margin-bottom:12px; font-size:11px; }
.home-data-compact .data-compact-heading h2 { font-size:clamp(34px,4vw,54px); line-height:1.1; letter-spacing:-.035em; }
.home-data-compact .data-compact-heading > a { font-size:14px; }
.home-data-compact .data-preview-pair { display:flex; gap:28px; }
.home-data-compact .data-preview-pair figure { width:calc(50% - 14px); }
.home-data-compact .data-preview-pair figcaption { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-top:14px; max-width:none; }
.home-data-compact figcaption a { font-size:16px; }
.home-data-compact figcaption span { font-size:12px; }
.home-data-compact .data-preview-date { font-size:11px; color:#777; margin:24px 0 0; }
@media(max-width:700px) {
 .home-intro.home-intro-compact,.home-data-work.home-data-compact { padding:40px 0; }
 .home-intro-compact .intro-compact-layout { flex-direction:column; align-items:flex-start; gap:20px; }
 .home-intro-compact h2,.home-intro-compact .intro-compact-layout > div { width:100%; }
 .home-data-compact .data-compact-heading { align-items:flex-start; }
 .home-data-compact .data-preview-pair { flex-direction:column; gap:28px; }
 .home-data-compact .data-preview-pair figure { width:100%; }
 .home-data-compact .data-work-eyebrow { max-width:24ch; }
}