body.sample-packet-page {
  background:#071724;
  color:#071724;
}

.sample-packet-page .overlay.overlay-global,
.sample-packet-page .overlay.overlay-global .overlay-global-color {
  display:none !important;
}

.sample-packet-page .site-navbar {
  background:rgba(255,255,255,.94);
  border-bottom:1px solid rgba(7,23,36,.08);
  backdrop-filter:blur(18px);
}

.sample-packet-page .navbar .navbar-nav .active > .nav-link:before,
.sample-packet-page .navbar .navbar-nav .nav-link.active:before {
  opacity:0;
}

.sample-packet-page .navbar .navbar-nav .active > .nav-link,
.sample-packet-page .navbar .navbar-nav .nav-link.active {
  color:inherit !important;
}

.packet-page,
.packet-section,
.packet-hero {
  position:relative;
  overflow:hidden;
}

.packet-section,
.packet-hero {
  padding:clamp(4.75rem, 8vw, 7.5rem) 0;
}

.packet-section-dark {
  background:
    radial-gradient(circle at 18% 12%, rgba(0,201,216,.18), transparent 34%),
    radial-gradient(circle at 84% 24%, rgba(255,122,0,.12), transparent 31%),
    linear-gradient(180deg, #071724 0%, #0c2134 100%);
  color:#f8fbff;
}

.packet-section-light {
  background:
    radial-gradient(circle at 12% 0%, rgba(0,201,216,.09), transparent 30%),
    linear-gradient(180deg, #f7fbfd 0%, #eef6f8 100%);
  color:#071724;
}

.packet-hero {
  padding-top:clamp(7rem, 12vw, 10rem);
}

.packet-hero-grid,
.packet-preview-shell,
.packet-form-panel,
.packet-next-steps {
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(340px, .78fr);
  gap:clamp(2rem, 4vw, 4rem);
  align-items:center;
}

.packet-next-steps .packet-btn {
  margin-bottom: 1rem;
}

.packet-eyebrow {
  display:inline-flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  padding:.36rem .68rem;
  border:1px solid rgba(0,201,216,.42);
  border-radius:999px;
  background:rgba(0,201,216,.11);
  color:#bafaff;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.packet-eyebrow-light {
  color:#006f79;
  background:rgba(0,201,216,.12);
}

.packet-hero h1,
.packet-section-title h2,
.packet-preview-header h2,
.packet-form-panel h2,
.packet-next-steps h2 {
  margin:.8rem 0 1rem;
  letter-spacing:0;
  line-height:1.02;
}

.packet-hero h1 {
  max-width:900px;
  color:#fff;
  font-size:clamp(3rem, 6vw, 6.4rem);
}

.packet-hero-copy {
  max-width:760px;
  color:#d8e5ee;
  font-size:clamp(1.08rem, 1.45vw, 1.32rem);
  line-height:1.6;
}

.packet-support-copy {
  max-width:680px;
  margin:1rem 0 0;
  color:#9fb2c3;
  font-weight:700;
}

.packet-proof-list {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:.7rem;
  max-width:720px;
  padding:0;
  margin:1.6rem 0;
  list-style:none;
}

.packet-proof-list li,
.packet-capture-grid span,
.packet-proof-chip {
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  padding:.56rem .72rem;
  border:1px solid rgba(0,201,216,.18);
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:inherit;
  font-weight:800;
  font-size:.9rem;
}

.packet-proof-list li:before,
.packet-capture-grid span:before {
  content:"";
  width:.52rem;
  height:.52rem;
  border-radius:50%;
  background:#00c9d8;
  box-shadow:0 0 0 4px rgba(0,201,216,.13);
  flex:0 0 auto;
}

.packet-hero-actions,
.packet-section-actions,
.packet-form-actions,
.packet-next-actions,
.packet-report-actions {
  display:flex;
  flex-wrap:wrap;
  gap:.8rem;
  align-items:center;
}

.packet-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:.88rem 1.15rem;
  border-radius:12px;
  border:1px solid transparent;
  font-weight:900;
  line-height:1.1;
  text-decoration:none;
  cursor:pointer;
  transition:transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.packet-btn:hover,
.packet-btn:focus {
  transform:translateY(-1px);
  text-decoration:none;
}

.packet-btn-primary {
  background:#55d9e6;
  color:#03131f;
  box-shadow:0 18px 40px rgba(0,201,216,.22);
}

.packet-btn[disabled] {
  cursor: wait;
  opacity:.62;
  transform:none;
  box-shadow:none;
}

.packet-btn-secondary {
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.22);
  color:#fff;
}

.packet-section-light .packet-btn-secondary,
.packet-report .packet-btn-secondary {
  color:#071724;
  background:#fff;
  border-color:rgba(7,23,36,.12);
}

.packet-btn-ghost {
  color:inherit;
  background:transparent;
  border-color:rgba(255,255,255,.22);
}

.packet-link-arrow {
  color:#7bf3ff;
  font-weight:900;
}

.packet-hero-preview,
.packet-side-card,
.packet-report,
.packet-detail-grid article,
.packet-value-grid article,
.packet-capture-panel,
.packet-form-panel,
.packet-next-steps,
.packet-faq-grid article,
.packet-selector-card {
  border:1px solid rgba(7,23,36,.12);
  border-radius:24px;
  background:rgba(255,255,255,.88);
  box-shadow:0 24px 70px rgba(7,23,36,.12);
}

.packet-hero-preview {
  color:#071724;
  padding:1.4rem;
  background:
    radial-gradient(circle at 84% 12%, rgba(0,201,216,.18), transparent 32%),
    linear-gradient(160deg, rgba(255,255,255,.98), rgba(221,249,252,.92));
  position:relative;
  overflow:hidden;
}

.packet-hero-preview:before {
  content:"";
  position:absolute;
  inset:14px;
  border:1px solid rgba(7,23,36,.08);
  border-radius:18px;
  pointer-events:none;
}

.packet-preview-label {
  display:inline-flex;
  margin-top:.8rem;
  padding:.38rem .55rem;
  border-radius:999px;
  background:#ecf7fa;
  color:#557084;
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.packet-preview-top,
.packet-report-header,
.packet-preview-header,
.packet-side-card .packet-side-kicker,
.packet-report-section-head {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:flex-start;
}

.packet-preview-top span,
.packet-side-kicker,
.packet-report-section-head span {
  color:#007784;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:.72rem;
}

.packet-preview-score {
  margin:1.3rem 0;
  padding:1.25rem;
  border-radius:20px;
  background:
    radial-gradient(circle at 78% 20%, rgba(0,201,216,.24), transparent 38%),
    linear-gradient(150deg, #071724, #0d2a42);
  color:#fff;
  text-align:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}

.packet-preview-score strong {
  display:block;
  font-size:clamp(3.2rem, 7vw, 5.5rem);
  line-height:.9;
}

.packet-preview-score span {
    margin-top: 10px;
    display: block;
}

.packet-preview-stats,
.packet-side-stats,
.packet-summary-grid,
.packet-stat-grid {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:.75rem;
}

.packet-preview-stats span,
.packet-side-stats span,
.packet-stat-card {
  padding:.72rem;
  border-radius:14px;
  background:rgba(0,201,216,.1);
  color:#294154;
  font-weight:800;
}

.packet-mini-timeline {
  display:grid;
  gap:.5rem;
  margin-top:1rem;
}

.packet-mini-timeline div {
  display:grid;
  grid-template-columns:10px minmax(0, 1fr);
  gap:.55rem;
  align-items:center;
  padding:.55rem .65rem;
  border:1px solid rgba(7,23,36,.08);
  border-radius:13px;
  background:rgba(255,255,255,.74);
  color:#334c61;
  font-weight:800;
  font-size:.86rem;
}

.packet-mini-timeline i {
  display:block;
  width:10px;
  height:10px;
  border-radius:999px;
  background:#00c9d8;
  box-shadow:0 0 0 4px rgba(0,201,216,.13);
}

.packet-hero-evidence {
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:.55rem;
  margin-top:1rem;
}

.packet-hero-evidence span {
  position:relative;
  min-height:78px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:.5rem;
  overflow:hidden;
  border-radius:15px;
  border:1px solid rgba(7,23,36,.1);
  background:
    linear-gradient(135deg, rgba(0,201,216,.22), transparent 45%),
    linear-gradient(155deg, #0b2135, #43687b);
  color:#fff;
  font-size:.72rem;
  font-weight:900;
  text-align:center;
}

.packet-hero-evidence img {
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  filter:brightness(.78) contrast(1.08) saturate(1.04);
}

.packet-hero-evidence b {
  position:relative;
  z-index:2;
  display:inline-flex;
  padding:.24rem .4rem;
  border-radius:999px;
  background:rgba(5,19,31,.72);
  color:#fff;
  font-size:inherit;
  line-height:1.1;
}

.packet-hero-evidence span:before,
.packet-hero-evidence span:after {
  content:"";
  position:absolute;
  z-index:1;
  pointer-events:none;
}

.packet-hero-evidence span:before {
  inset:0;
  border:0;
  border-radius:0;
  background:linear-gradient(180deg, rgba(5,19,31,.06), rgba(5,19,31,.7));
}

.packet-hero-evidence span:after {
  inset:0;
  width:auto;
  height:auto;
  border:1px solid rgba(255,255,255,.18);
  border-radius:15px;
  transform:none;
  background:none;
}

.packet-section-title {
  max-width:850px;
  margin-bottom:clamp(1.5rem, 4vw, 2.5rem);
}

.packet-section-title h2,
.packet-preview-header h2,
.packet-form-panel h2,
.packet-next-steps h2 {
  font-size:clamp(2.2rem, 4.6vw, 4.3rem);
}

.packet-section-title p,
.packet-preview-header p,
.packet-form-panel p,
.packet-next-steps p {
  max-width:760px;
  color:#64778a;
  font-size:1.06rem;
  line-height:1.65;
}

.packet-section-dark .packet-section-title p,
.packet-section-dark .packet-preview-header p,
.packet-section-dark .packet-form-panel p {
  color:#b7c6d2;
}

.packet-selector {
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:1rem;
}

.packet-selector-card {
  appearance:none;
  width:100%;
  min-height:100%;
  padding:1.25rem;
  text-align:left;
  color:#071724;
  cursor:pointer;
  display:grid;
  grid-template-rows:auto auto auto 1fr auto auto;
  gap:.3rem;
}

.packet-selector-card[aria-pressed="true"] {
  border-color:#00c9d8;
  box-shadow:0 18px 50px rgba(0,201,216,.2);
  background:linear-gradient(160deg, #fff, #eafffc);
}

.packet-selector-card small,
.packet-selector-card strong {
  color:#607488;
  font-weight:800;
}

.packet-selector-card h3 {
  margin:.65rem 0;
  font-size:1.5rem;
}

.packet-selector-card p {
  color:#4c6073;
  line-height:1.55;
}

.packet-selector-card strong {
  display:inline-flex;
  margin-top:.4rem;
  padding:.5rem .68rem;
  border:1px solid rgba(0,201,216,.22);
  border-radius:999px;
  color:#006f79;
  background:rgba(0,201,216,.1);
  font-size:.84rem;
}

.packet-selector-visual {
  position:relative;
  display:block;
  aspect-ratio:16 / 9;
  margin-bottom:.35rem;
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(7,23,36,.1);
  background:
    radial-gradient(circle at 70% 25%, rgba(0,201,216,.22), transparent 32%),
    linear-gradient(145deg, #0b2135, #24445b);
}

.packet-selector-visual img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.packet-selector-chips {
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
  margin:.4rem 0 .25rem;
}

.packet-selector-chips span {
  display:inline-flex;
  padding:.32rem .5rem;
  border-radius:999px;
  background:#edf8fa;
  color:#006f79;
  font-size:.75rem;
  font-weight:900;
}

.packet-preview-header {
  margin-bottom:1.5rem;
}

.packet-preview-shell {
  grid-template-columns:minmax(0, 1fr) minmax(300px, 360px);
  align-items:start;
}

.packet-report {
  padding:clamp(1.2rem, 3vw, 2rem);
  color:#071724;
  background:
    linear-gradient(90deg, rgba(0,201,216,.04) 1px, transparent 1px),
    linear-gradient(180deg, #fff, #fbfdfe);
  background-size:28px 28px, auto;
}

.packet-report-header {
  padding-bottom:1.25rem;
  border-bottom:1px solid rgba(7,23,36,.1);
}

.packet-report-header h3 {
  margin:.35rem 0;
  font-size:clamp(1.8rem, 3vw, 2.7rem);
}

.packet-status-badge {
  display:inline-flex;
  padding:.48rem .68rem;
  border-radius:999px;
  background:#092033;
  color:#9cf7ff;
  font-weight:900;
  white-space:nowrap;
}

.packet-report-status {
  display:grid;
  gap:.35rem;
  justify-items:end;
}

.packet-report-status small {
  color:#667a8b;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.packet-report-section-head small {
  color:#6d8091;
  font-weight:800;
  line-height:1.3;
}

.packet-summary-grid,
.packet-stat-grid,
.packet-evidence-grid {
  margin:1.25rem 0;
}

.packet-summary-grid {
  grid-template-columns:repeat(3, minmax(0, 1fr));
}

.packet-summary-grid div {
  padding:.78rem;
  border-radius:14px;
  background:#f3f8fa;
}

.packet-summary-grid span,
.packet-stat-card span {
  display:block;
  color:#627487;
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.packet-summary-grid strong,
.packet-stat-card strong {
  display:block;
  margin-top:.2rem;
  overflow-wrap:anywhere;
}

.packet-stat-card {
  border:1px solid rgba(7,23,36,.08);
  background:#f7fbfd;
}

.packet-stat-card strong {
  font-size:1.35rem;
}

.packet-timeline {
  position:relative;
  display:grid;
  gap:.8rem;
  margin:1.3rem 0;
}

.packet-timeline-entry {
  position:relative;
  display:grid;
  grid-template-columns:34px minmax(0, 1fr);
  gap:.75rem;
  padding:.9rem;
  border:1px solid rgba(7,23,36,.08);
  border-radius:16px;
  background:#fbfdfe;
}

.packet-timeline-index {
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:50%;
  background:#071724;
  color:#8af4ff;
  font-weight:900;
}

.packet-timeline-entry h4 {
  margin:0 0 .35rem;
  font-size:1.02rem;
}

.packet-timeline-meta {
  color:#657688;
  font-weight:800;
  font-size:.84rem;
}

.packet-proof-chips {
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
  margin:.55rem 0;
}

.packet-proof-chip {
  padding:.34rem .55rem;
  background:rgba(0,201,216,.12);
  color:#005f68;
  font-size:.78rem;
}

.packet-evidence-grid {
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:.75rem;
}

.packet-evidence-card {
  overflow:hidden;
  border:1px solid rgba(7,23,36,.1);
  border-radius:16px;
  background:#fff;
  box-shadow:0 10px 25px rgba(7,23,36,.06);
}

.packet-evidence-visual {
  min-height:118px;
  overflow:hidden;
  background:
    linear-gradient(135deg, rgba(0,201,216,.28), transparent 42%),
    linear-gradient(160deg, #0b2135, #64788a);
  position:relative;
}

.packet-evidence-visual img {
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  filter:brightness(.86) contrast(1.08) saturate(1.04);
}

.packet-evidence-visual:before,
.packet-evidence-visual:after {
  content:"";
  position:absolute;
  z-index:1;
  pointer-events:none;
}

.packet-evidence-visual:before {
  inset:0;
  width:auto;
  height:auto;
  border-radius:0;
  background:linear-gradient(180deg, rgba(5,19,31,.1), rgba(5,19,31,.68));
  border:0;
}

.packet-evidence-visual:after {
  inset:0;
  border:1px solid rgba(255,255,255,.16);
  border-radius:0;
}

.packet-evidence-visual > span {
  position:absolute;
  top:17px;
  right:22px;
  z-index:2;
  padding:.22rem .45rem;
  border-radius:999px;
  background:rgba(5,19,31,.7);
  color:#fff;
  font-size:.68rem;
  font-weight:900;
}

.packet-evidence-visual i,
.packet-evidence-visual b {
  position:absolute;
  z-index:1;
  display:block;
}

.packet-evidence-visual i {
  left:30px;
  right:30px;
  bottom:30px;
  height:18px;
  border-radius:999px;
  background:rgba(255,255,255,.2);
}

.packet-evidence-visual b {
  width:40px;
  height:24px;
  left:34px;
  top:34px;
  border:1px solid rgba(255,255,255,.58);
  border-radius:8px;
  background:rgba(255,255,255,.14);
}

.packet-evidence-visual--exception {
  background:
    radial-gradient(circle at 72% 28%, rgba(255,122,0,.38), transparent 28%),
    linear-gradient(160deg, #0b2135, #76533f);
}

.packet-evidence-visual--signoff,
.packet-evidence-visual--after {
  background:
    radial-gradient(circle at 72% 28%, rgba(0,201,216,.34), transparent 28%),
    linear-gradient(160deg, #0b2135, #476f78);
}

.packet-evidence-visual--before,
.packet-evidence-visual--asset,
.packet-evidence-visual--nameplate {
  background:
    radial-gradient(circle at 72% 28%, rgba(255,255,255,.2), transparent 28%),
    linear-gradient(160deg, #0b2135, #64788a);
}

.packet-evidence-visual--safety,
.packet-evidence-visual--inspection,
.packet-evidence-visual--location {
  background:
    radial-gradient(circle at 72% 28%, rgba(85,217,230,.28), transparent 28%),
    linear-gradient(160deg, #0b2135, #37576b);
}

.packet-evidence-card div:last-child {
  padding:.75rem;
}

.packet-evidence-card strong,
.packet-evidence-card span {
  display:block;
}

.packet-evidence-card span {
  color:#627487;
  font-size:.82rem;
}

.packet-evidence-card em {
  display:inline-flex;
  margin-top:.38rem;
  padding:.24rem .42rem;
  border-radius:999px;
  background:#eef8fa;
  color:#006f79;
  font-size:.72rem;
  font-style:normal;
  font-weight:900;
}

.packet-block {
  margin-top:1rem;
  padding:1rem;
  border-radius:18px;
  background:#f5f9fb;
  border:1px solid rgba(7,23,36,.08);
}

.packet-exception-block {
  border-color:rgba(255,122,0,.28);
  background:linear-gradient(135deg, rgba(255,122,0,.1), #fff);
}

.packet-export-code {
  display:grid;
  gap:.35rem;
  margin-top:.85rem;
  padding:.9rem;
  border-radius:14px;
  background:#071724;
  color:#bafaff;
  font-family:monospace;
  font-size:.82rem;
}

.packet-export-block {
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(260px, .72fr);
  gap:1rem;
  align-items:start;
}

.packet-export-flow {
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
  margin-top:1rem;
  align-items:center;
}

.packet-export-flow span {
  display:inline-flex;
  padding:.42rem .55rem;
  border-radius:999px;
  background:#eaf8fb;
  color:#005f68;
  font-size:.78rem;
  font-weight:900;
}

.packet-export-flow i {
  width:22px;
  height:1px;
  background:rgba(7,23,36,.24);
}

.packet-side-panel {
  position:sticky;
  top:104px;
  display:grid;
  gap:1rem;
}

.packet-side-card {
  padding:1.15rem;
}

.packet-side-card .packet-btn {
  width:100%;
  margin-top:.75rem;
}

.packet-side-card .packet-btn.packet-btn-secondary {
      color: var(--nyc-deep);
    border: 1px solid;
}

.packet-side-card-muted {
  background:rgba(255,255,255,.08);
  color:#fff;
  border-color:rgba(255,255,255,.16);
}

.packet-detail-grid,
.packet-value-grid,
.packet-faq-grid,
.packet-reviewer-row {
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:1rem;
}

.packet-value-grid {
  margin-bottom: 2rem;
}

.packet-annotation-panel {
  display:grid;
  grid-template-columns:minmax(280px, .62fr) minmax(0, 1fr);
  gap:1.2rem;
  align-items:stretch;
}

.packet-annotation-content {
  display:grid;
  align-content:start;
  gap:1rem;
  min-width:0;
}

.packet-annotation-report {
  min-height:100%;
  padding:1rem;
  border:1px solid rgba(7,23,36,.1);
  border-radius:24px;
  background:#fff;
  box-shadow:0 24px 70px rgba(7,23,36,.12);
}

.packet-annotation-header {
  display:flex;
  gap:.65rem;
  align-items:center;
  padding:.8rem;
  border-radius:16px;
  background:#071724;
  color:#fff;
}

.packet-annotation-header span {
  width:34px;
  height:34px;
  border-radius:10px;
  background:linear-gradient(135deg, #55d9e6, #ffb15c);
}

.packet-annotation-header em {
  margin-left:auto;
  color:#9cf7ff;
  font-style:normal;
  font-weight:900;
}

.packet-annotation-row {
  display:grid;
  grid-template-columns:12px 72px minmax(0, 1fr);
  gap:.65rem;
  align-items:center;
  margin-top:.75rem;
  padding:.75rem;
  border:1px solid rgba(7,23,36,.08);
  border-radius:14px;
  background:#f7fbfd;
}

.packet-annotation-row i {
  width:12px;
  height:12px;
  border-radius:50%;
  background:#55d9e6;
}

.packet-annotation-row span {
  color:#687b8d;
  font-size:.78rem;
  font-weight:900;
}

.packet-annotation-row.is-active {
  border-color:rgba(0,201,216,.3);
  background:#eafbfd;
}

.packet-annotation-code {
  display:grid;
  gap:.4rem;
  margin-top:1rem;
  padding:.8rem;
  border-radius:14px;
  background:#071724;
  color:#bafaff;
  font-family:monospace;
  font-size:.78rem;
}

.packet-detail-grid {
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.packet-annotation-content .proof-packet-media {
  max-width:none;
  margin:0;
}

.packet-annotation-content .proof-packet-media img {
  aspect-ratio:16 / 9;
  object-position:center;
}

.packet-detail-grid article,
.packet-value-grid article,
.packet-faq-grid article,
.packet-reviewer-row article {
  padding:1.15rem;
}

.packet-detail-grid p,
.packet-value-grid p,
.packet-faq-grid p,
.packet-reviewer-row p {
  color:#607488;
  line-height:1.55;
}

.packet-card-icon,
.packet-review-icon {
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  margin-bottom:.85rem;
  border-radius:14px;
  background:#071724;
  color:#8af4ff;
  font-size:.78rem;
  font-weight:900;
}

.packet-reviewer-row article {
  border:1px solid rgba(7,23,36,.1);
  border-radius:22px;
  background:#fff;
  box-shadow:0 16px 45px rgba(7,23,36,.09);
}

.packet-section-dark .packet-value-grid article {
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.14);
  color:#fff;
}

.packet-section-dark .packet-value-grid p {
  color:#c5d1dc;
}

.packet-capture-panel,
.packet-form-panel,
.packet-next-steps {
  padding:clamp(1.2rem, 3vw, 2rem);
}

.packet-capture-grid {
  display:flex;
  flex-wrap:wrap;
  gap:.6rem;
  margin-top:1.2rem;
}

.packet-capture-grid span {
  color:#071724;
  background:#fff;
}

.packet-form-panel {
  grid-template-columns:minmax(240px, .54fr) minmax(620px, 1.46fr);
  gap:clamp(2rem, 3.4vw, 3.25rem);
  align-items:start;
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.16);
  color:#fff;
}

.packet-form-panel > div:first-child {
  max-width:430px;
}

.packet-form-panel form {
  min-width:0;
}

.packet-form-preview {
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  margin-top:1rem;
}

.packet-form-preview span {
  padding:.5rem .65rem;
  border-radius:999px;
  background:rgba(0,201,216,.12);
  color:#c8fbff;
  font-weight:800;
}

.packet-form-aside {
  margin-top:1.2rem;
  padding:1rem;
  border:1px solid rgba(255,255,255,.16);
  border-radius:18px;
  background:rgba(255,255,255,.07);
}

.packet-form-aside h3 {
  margin:0 0 .7rem;
  color:#fff;
}

.packet-form-aside ul {
  display:grid;
  gap:.45rem;
  margin:0 0 .9rem;
  padding:0;
  list-style:none;
}

.packet-form-aside li {
  position:relative;
  padding-left:1.1rem;
  color:#dbe8f1;
  line-height:1.45;
}

.packet-form-aside li:before {
  content:"";
  position:absolute;
  left:0;
  top:.55rem;
  width:.45rem;
  height:.45rem;
  border-radius:50%;
  background:#55d9e6;
}

.packet-form-aside div {
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
}

.packet-form-aside div span {
  padding:.36rem .5rem;
  border-radius:999px;
  background:rgba(0,201,216,.12);
  color:#c8fbff;
  font-size:.76rem;
  font-weight:900;
}

.packet-form-grid {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:.8rem;
}

.packet-field label,
.packet-goals-field legend {
  display:block;
  margin-bottom:.35rem;
  color:#d9e8f2;
  font-weight:900;
}

.packet-field input,
.packet-field select {
  width:100%;
  min-height:48px;
  padding:.78rem .85rem;
  border:1px solid rgba(255,255,255,.2);
  border-radius:12px;
  background:rgba(255,255,255,.94);
  color:#071724;
}

.packet-field input[aria-invalid="true"],
.packet-field select[aria-invalid="true"] {
  border-color:#ff7a00;
  box-shadow:0 0 0 3px rgba(255,122,0,.18);
}

.packet-goals-field {
  margin:1rem 0;
  padding:0;
  border:0;
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
}

.packet-goals-field label,
.packet-consent {
  display:inline-flex;
  gap:.5rem;
  align-items:flex-start;
  padding:.55rem .65rem;
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  background:rgba(255,255,255,.06);
}

.packet-consent {
  margin-bottom:1rem;
}

.packet-honeypot {
  position:absolute;
  left:-10000px;
}

.packet-form-status {
  min-height:1.5rem;
  margin-top:.85rem;
  color:#c8fbff;
  font-weight:800;
}

.packet-form-status.is-error {
  color:#ffd1ad;
}

.packet-next-steps {
  background:linear-gradient(160deg, #fff, #e9fbfd);
}

.packet-next-actions {
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.75rem;
}

.sample-packet-page a.backtotop {
  width:42px !important;
  height:42px !important;
  border-radius:999px !important;
}

#packetSideTitle {
  color: var(--nyc-deep);
}

.packet-faq-section {
  background:
    linear-gradient(135deg, rgba(112,237,244,.15) 0%, rgba(255,255,255,.96) 36%, rgba(244,250,252,.98) 100%),
    linear-gradient(90deg, rgba(7,23,36,.035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(7,23,36,.035) 1px, transparent 1px);
  background-size:auto, 76px 76px, 76px 76px;
}

.packet-faq-heading {
  max-width:980px;
  margin-bottom:clamp(1.8rem, 3vw, 2.7rem);
}

.packet-faq-heading h2 {
  max-width:900px;
  letter-spacing:0;
}

.packet-faq-heading p {
  max-width:760px;
  color:#536774;
}

.packet-faq-grid {
  counter-reset:packetFaq;
  grid-template-columns:repeat(12, minmax(0, 1fr));
  gap:clamp(1rem, 1.55vw, 1.35rem);
  align-items:stretch;
}

.packet-faq-grid article {
  position:relative;
  grid-column:span 4;
  display:flex;
  flex-direction:column;
  min-height:250px;
  padding:clamp(1.25rem, 2vw, 1.75rem);
  overflow:hidden;
  border-color:rgba(7,23,36,.1);
  border-radius:28px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(250,253,254,.93)),
    linear-gradient(135deg, rgba(112,237,244,.11), transparent 56%);
  box-shadow:0 26px 78px rgba(22,57,72,.11);
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.packet-faq-grid article:nth-child(1),
.packet-faq-grid article:nth-child(2) {
  grid-column:span 6;
  min-height:230px;
}

.packet-faq-grid article::before {
  counter-increment:packetFaq;
  content:"0" counter(packetFaq);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:34px;
  margin-bottom:1.15rem;
  border-radius:999px;
  background:#0fc8d7;
  color:#04131f;
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.04em;
  box-shadow:0 12px 28px rgba(15,200,215,.18);
}

.packet-faq-grid article::after {
  content:"";
  position:absolute;
  right:-1px;
  bottom:-1px;
  width:42%;
  height:46%;
  border-top:1px solid rgba(15,200,215,.12);
  border-left:1px solid rgba(15,200,215,.1);
  border-top-left-radius:54px;
  background:
    linear-gradient(135deg, rgba(112,237,244,.1), transparent 62%),
    linear-gradient(90deg, rgba(7,23,36,.035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(7,23,36,.035) 1px, transparent 1px);
  background-size:auto, 18px 18px, 18px 18px;
  pointer-events:none;
}

.packet-faq-grid article:hover,
.packet-faq-grid article:focus-within {
  transform:translateY(-4px);
  border-color:rgba(15,200,215,.32);
  box-shadow:0 30px 86px rgba(22,57,72,.16);
}

.packet-faq-grid h3,
.packet-faq-grid p,
.packet-faq-actions {
  position:relative;
  z-index:1;
}

.packet-faq-grid h3 {
  margin:0 0 .72rem;
  color:#071724;
  font-size:clamp(1.35rem, 1.85vw, 1.95rem);
  line-height:1.16;
}

.packet-faq-grid p {
  max-width:44ch;
  margin:0;
  color:#536774;
  font-size:1rem;
  line-height:1.6;
}

.packet-faq-grid article:nth-child(5) {
  border-color:rgba(112,237,244,.28);
  background:
    linear-gradient(145deg, rgba(8,22,34,.98), rgba(9,60,72,.94)),
    linear-gradient(135deg, rgba(112,237,244,.24), transparent 56%);
  color:#fff;
  box-shadow:0 30px 90px rgba(8,22,34,.23);
}

.packet-faq-grid article:nth-child(5)::before {
  background:#fff;
  color:#007e8b;
}

.packet-faq-grid article:nth-child(5)::after {
  border-color:rgba(255,255,255,.12);
  background:
    linear-gradient(135deg, rgba(112,237,244,.14), transparent 62%),
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:auto, 18px 18px, 18px 18px;
}

.packet-faq-grid article:nth-child(5) h3 {
  color:#fff;
}

.packet-faq-grid article:nth-child(5) p {
  color:rgba(233,241,247,.78);
}

.packet-faq-actions {
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  margin-top:auto;
  padding-top:1.15rem;
}

.packet-faq-actions a {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:.55rem .75rem;
  border:1px solid rgba(112,237,244,.24);
  border-radius:999px;
  background:rgba(112,237,244,.1);
  color:#bafaff;
  font-size:.84rem;
  font-weight:900;
  line-height:1.1;
  text-decoration:none;
}

.packet-faq-actions a:hover,
.packet-faq-actions a:focus {
  background:#70edf4;
  color:#04131f;
}

@media (max-width: 1199px) {
  .packet-hero-grid,
  .packet-preview-shell,
  .packet-form-panel,
  .packet-next-steps {
    grid-template-columns:1fr;
  }

  .packet-side-panel {
    position:static;
  }

  .packet-selector,
  .packet-detail-grid,
  .packet-value-grid,
  .packet-faq-grid,
  .packet-reviewer-row,
  .packet-export-block {
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .packet-faq-grid article,
  .packet-faq-grid article:nth-child(1),
  .packet-faq-grid article:nth-child(2) {
    grid-column:auto;
  }

  .packet-annotation-panel {
    grid-template-columns:1fr;
  }
}

@media (max-width: 720px) {
  .sample-packet-page .container {
    width:calc(100% - 40px) !important;
    max-width:calc(100% - 40px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box;
  }

  .packet-hero-grid,
  .packet-hero-grid > *,
  .packet-hero-preview {
    min-width:0;
    max-width:100%;
  }

  .packet-hero h1,
  .packet-hero-copy,
  .packet-proof-list li {
    width:100%;
    max-width:calc(100vw - 40px) !important;
    white-space:normal !important;
    text-wrap:wrap !important;
    overflow-wrap:anywhere;
    word-break:break-word;
  }

  .packet-hero h1 {
    font-size:clamp(1.65rem, 8vw, 1.9rem);
    line-height:1.05;
  }

  .packet-section,
  .packet-hero {
    padding:4rem 0;
  }

  .packet-hero {
    padding-top:6.5rem;
  }

  .packet-proof-list,
  .packet-selector,
  .packet-summary-grid,
  .packet-preview-stats,
  .packet-side-stats,
  .packet-stat-grid,
  .packet-evidence-grid,
  .packet-detail-grid,
  .packet-value-grid,
  .packet-faq-grid,
  .packet-form-grid,
  .packet-reviewer-row,
  .packet-export-block {
    grid-template-columns:1fr;
  }

  .packet-faq-grid article,
  .packet-faq-grid article:nth-child(1),
  .packet-faq-grid article:nth-child(2) {
    min-height:auto;
  }

  .packet-faq-grid h3 {
    font-size:clamp(1.35rem, 7vw, 1.85rem);
  }

  .packet-faq-actions a {
    width:100%;
  }

  .packet-hero-evidence {
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .packet-btn,
  .packet-hero-actions .packet-link-arrow {
    width:100%;
  }

  .packet-preview-header,
  .packet-report-header,
  .packet-next-actions,
  .packet-report-section-head {
    display:block;
  }

  .packet-report-status {
    justify-items:start;
    margin-top:.75rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .packet-btn {
    transition:none;
  }
}

@media print {
  .sample-packet-page .site-navbar,
  .sample-packet-page .site-footer,
  .sample-packet-page .overlay,
  .sample-packet-page .scroll-progress,
  .sample-packet-page .loader,
  .sample-packet-page a.backtotop,
  .packet-hero,
  .packet-section:not(#packet-preview),
  .packet-side-panel,
  .packet-preview-header,
  .packet-report-actions,
  .packet-export-flow {
    display:none !important;
  }

  body.sample-packet-page {
    background:#fff !important;
    color:#000 !important;
  }

  #packet-preview,
  .packet-section-dark {
    display:block !important;
    padding:0 !important;
    background:#fff !important;
    color:#000 !important;
  }

  .packet-preview-shell,
  .packet-report {
    display:block !important;
    box-shadow:none !important;
    border:0 !important;
    background:#fff !important;
  }

  .packet-report:before {
    content:"Sample proof packet - CoSkip";
    display:block;
    margin-bottom:1rem;
    font-weight:900;
  }

  .packet-evidence-card,
  .packet-block,
  .packet-summary-grid div,
  .packet-stat-card,
  .packet-timeline-entry {
    break-inside:avoid;
    box-shadow:none !important;
  }

  .packet-export-block {
    display:block !important;
  }
}
