/* Sample report excerpts (Audits + Digital Presence Audit pages).
   The images are screenshots of real reports with identifying details blurred in the
   image files themselves. Dark report panels sit in a quiet frame; clicking opens a larger view. */
.sample{margin:0}
.sample-zoom{display:block;border-radius:12px;overflow:hidden;border:1px solid rgba(26,46,59,.18);background:#12161d;box-shadow:0 14px 30px -18px rgba(17,31,41,.55);cursor:zoom-in;transition:box-shadow .25s ease,border-color .25s ease}
.sample-zoom img{display:block;width:100%;height:auto;transition:transform .5s cubic-bezier(.16,1,.3,1)}
.sample-zoom:hover img,.sample-zoom:focus-visible img{transform:scale(1.02)}
.sample-zoom:hover{border-color:rgba(31,102,114,.5);box-shadow:0 18px 36px -18px rgba(17,31,41,.65)}
.sample-zoom:focus-visible{outline:2px solid var(--teal-strong);outline-offset:3px}
.sample figcaption{margin-top:.8rem;display:flex;flex-direction:column;gap:.15rem}
.sample figcaption strong{font-size:14px;font-weight:500;color:var(--ink)}
.sample figcaption span{font-size:13px;line-height:1.6;color:var(--ink-mid)}
.sample-dark .sample-zoom{border-color:rgba(232,244,240,.16);box-shadow:0 14px 30px -18px rgba(0,0,0,.7)}
.sample-dark .sample-zoom:hover{border-color:rgba(91,196,212,.5)}
.sample-dark .sample figcaption strong{color:#e8f4f0}
.sample-dark .sample figcaption span{color:rgba(232,244,240,.72)}
.sample-dark .sample-zoom:focus-visible{outline-color:var(--teal-bright)}

/* three-up on /audits/ */
.sample-trio{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(1.25rem,3vw,2.25rem);align-items:start}
.sample-stack{display:grid;gap:clamp(1.25rem,3vw,2rem)}
.sample-more{margin-top:2rem}
.sample-more .arrow-link{color:var(--teal-strong);font-size:14px;font-weight:500;text-decoration:none}
.sample-more .arrow-link span{display:inline-block;transition:transform .2s ease}
.sample-more .arrow-link:hover span,.sample-more .arrow-link:focus-visible span{transform:translateX(4px)}

/* masonry-style flow on /audit/ */
.sample-masonry{column-count:2;column-gap:clamp(1.25rem,3vw,2.25rem)}
.sample-masonry .sample{break-inside:avoid;margin:0 0 clamp(1.5rem,3vw,2.25rem)}

/* enlarge dialog */
dialog.sample-dialog{border:0;padding:0;background:transparent;max-width:min(96vw,1400px);width:96vw;max-height:94vh;margin:auto;overflow:visible}
dialog.sample-dialog::backdrop{background:rgba(10,18,24,.82)}
.sample-dialog-inner{position:relative}
.sample-dialog img{display:block;width:100%;height:auto;max-height:88vh;object-fit:contain;border-radius:10px;background:#12161d}
.sample-dialog-close{position:absolute;top:-2.6rem;right:0;display:inline-flex;align-items:center;gap:.4rem;font:inherit;font-size:13px;color:#e8f4f0;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);border-radius:100px;padding:.45rem 1rem;cursor:pointer;transition:background .2s ease}
.sample-dialog-close:hover{background:rgba(255,255,255,.2)}
.sample-dialog-close:focus-visible{outline:2px solid var(--teal-bright);outline-offset:3px}
.sample-dialog-cap{margin-top:.75rem;color:rgba(232,244,240,.85);font-size:13.5px;text-align:center}

@media(max-width:900px){
  .sample-trio{grid-template-columns:1fr}
  .sample-masonry{column-count:1}
  .sample-dialog-close{top:-2.4rem}
}
@media (prefers-reduced-motion:reduce){
  .sample-zoom img{transition:none}
  .sample-zoom:hover img,.sample-zoom:focus-visible img{transform:none}
}

/* Website Audit sample pages (A4 portrait) */
.sample-sub{font-family:var(--font-display);font-weight:400;font-size:clamp(1.3rem,2.2vw,1.65rem);letter-spacing:-.02em;color:var(--ink);margin:2.75rem 0 1.4rem}
.sample-dark .sample-sub{color:#e8f4f0}
.sample-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.25rem,3vw,2.25rem);max-width:56rem}
.sample-pages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.25rem,3vw,2rem)}
.sample-page .sample-zoom{background:#faf8f5}
.sample-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.75rem;margin-top:2rem}
.sample-actions .arrow-link{color:var(--teal-strong);font-size:14px;font-weight:500;text-decoration:none}
.sample-actions .arrow-link span{display:inline-block;transition:transform .2s ease}
.sample-actions .arrow-link:hover span,.sample-actions .arrow-link:focus-visible span{transform:translateX(4px)}
.sample-disclaimer{margin-top:2rem;max-width:44rem;font-size:12.5px;line-height:1.7;color:var(--ink-mid)}
.sample-dark .sample-disclaimer{color:rgba(232,244,240,.72)}
.sample-divider{height:1px;background:rgba(26,46,59,.14);margin:3rem 0 0}
.sample-head p{font-size:14.5px;line-height:1.75;color:var(--ink-mid);max-width:40rem;margin:-.6rem 0 1.4rem}
.sample-head .sample-sub{margin-top:2rem}
@media(max-width:900px){
  .sample-pages,.sample-pair{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .sample-pages,.sample-pair{grid-template-columns:1fr}
}