/* Option 3: sculptural brand, architectural light, practical HTML examples. */
[data-signature] {
  --p-ink: #151c26;
  --p-wash: #f4f6f8;
  --p-line: #d7dee7;
  --p-dark: #141c24;
}
[data-signature] .site-header {
  background: #f9fbfdf5;
  border-bottom-color: #d7dee780;
}
[data-signature] .site-header__inner { min-height: 84px; }
[data-signature] .site-nav>.nav-cta { border-radius: 4px; }
[data-signature] :is(.button,.nav-cta) { transition: background .18s ease, color .18s ease; }
[data-signature] :is(.button,.nav-cta):active { transform: translateY(1px); }
[data-signature] .skip-link { z-index: 210; }
[data-signature] .site-footer { border-top: 1px solid var(--p-line); }
[data-signature] .footer-links a:hover { text-decoration: underline; }

/* Keep the example inside the hero's semantic section, below its brand scene. */
.premium-home[data-signature] .premium-hero { display: block; min-height: 0; overflow: visible; background: #fff; }
.premium-home[data-signature] .signature-stage { position: relative; isolation: isolate; background: #edf3f8; }
.premium-home[data-signature] .premium-hero__image { position: absolute; inset: 0; z-index: -1; margin: 0; width: 100%; height: 100%; opacity: 1; pointer-events: none; }
.premium-home[data-signature] .premium-hero__image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 53%; transform: none; }
.premium-home[data-signature] .clarity-hero-layout { display: flex; align-items: center; min-height: 570px; padding-block: 62px 70px; }
.premium-home[data-signature] .premium-hero__copy { width: 53%; max-width: 680px; padding: 0; }
.premium-home[data-signature] .premium-hero h1 { font-size: 60px; line-height: 1.06; font-weight: 500; margin-bottom: 25px; white-space: normal; text-wrap: balance; }
.premium-home[data-signature] .premium-hero__lead { font-size: 19px; line-height: 1.6; color: #394757; max-width: 540px; margin-bottom: 28px; }
.premium-home[data-signature] .premium-hero__actions { gap: 25px; align-items: center; flex-direction: row; flex-wrap: wrap; }
.premium-home[data-signature] .premium-hero__actions .text-link { color: var(--p-ink); }
.premium-home[data-signature] .premium-hero__note { font-size: 14px; line-height: 1.6; color: #394757; max-width: 520px; margin-top: 20px; }
.premium-home[data-signature] .signature-example-band { border-top: 2px solid var(--p-blue); padding: 38px 0 40px; background: #fff; }
.premium-home[data-signature] .clarity-example { display: grid; grid-template-columns: minmax(0,1.12fr) 130px minmax(0,1fr); grid-template-rows: auto auto auto auto; gap: 0 24px; padding: 0; }
.premium-home[data-signature] .clarity-example h2 { grid-column: 1 / 3; grid-row: 1; font-size: 29px; line-height: 1.25; margin: 0 0 21px; max-width: none; }
.premium-home[data-signature] .clarity-document { grid-column: 1; grid-row: 2 / 5; align-self: start; max-width: none; margin: 0; padding: 22px 25px; background: #fbfcfe; border: 1px solid var(--p-line); border-radius: 4px; box-shadow: none; }
.premium-home[data-signature] .clarity-document__meta { font-size: 13px; gap: 12px; }
.premium-home[data-signature] .clarity-document p { font-size: 18px; line-height: 1.65; margin-top: 17px; }
.premium-home[data-signature] .clarity-connection { grid-column: 2; grid-row: 2 / 5; flex-direction: column; justify-content: center; align-self: center; padding: 0; gap: 10px; text-align: center; font-size: 13px; line-height: 1.6; }
.premium-home[data-signature] .clarity-connection .icon { transform: none; width: 27px; height: 27px; }
.premium-home[data-signature] .clarity-task-result { grid-column: 3; grid-row: 1 / 3; background: none; box-shadow: none; border: 0; padding: 5px 0 0 30px; border-left: 1px solid var(--p-line); }
.premium-home[data-signature] .clarity-task-result h3 { font-size: 17px; margin-bottom: 13px; }
.premium-home[data-signature] .clarity-task-list li { grid-template-columns: 34px 1fr; gap: 2px 12px; padding: 13px 0; font-size: 17px; }
.premium-home[data-signature] .clarity-task-list li::before { content: counter(task); grid-row: 1 / 3; height: 34px; display: grid; place-items: center; color: #174bb8; background: #e9f0ff; border-radius: 50%; font-weight: 500; }
.premium-home[data-signature] .clarity-task-list small { font-size: 13px; margin-top: 0; }
.premium-home[data-signature] .clarity-example__caption { grid-column: 3; grid-row: 3; max-width: none; padding-left: 30px; border-left: 1px solid var(--p-line); margin: 0; padding-top: 12px; font-size: 13px; line-height: 1.6; }
.premium-home[data-signature] .clarity-example__caption+.clarity-example__caption { grid-row: 4; margin: 0; padding-top: 5px; padding-bottom: 4px; }
.premium-home[data-signature] .premium-strip { border-top: 1px solid var(--p-line); background: #f8fafc; }
.premium-home[data-signature] .premium-section { padding-block: 84px; }
.premium-home[data-signature] .premium-intro { gap: 70px; margin-bottom: 42px; }
.premium-home[data-signature] .premium-tasks { gap: 48px; }
.premium-home[data-signature] .premium-tasks article { border-top-color: #a8b8d0; padding-top: 27px; }
.premium-home[data-signature] .premium-tasks h3 { font-size: 25px; }
.premium-home[data-signature] .premium-boundary { font-size: 14px; }
.premium-home[data-signature] .local-ai-demo { background: #f4f6f8; padding-block: 52px; border-block: 1px solid var(--p-line); }
.premium-home[data-signature] .local-ai-demo__disclosure { font-size: 13px; }
.premium-home[data-signature] .premium-running { background: #141c24; }
.premium-home[data-signature] .premium-running .premium-process { background: transparent; }
.premium-home[data-signature] .premium-services details { transition: background .2s ease; }
.premium-home[data-signature] .premium-services details[open] { background: #f4f7fc; }
.premium-home[data-signature] .premium-services summary { padding-inline: 18px; }
.premium-home[data-signature] .premium-services .service-body { padding-inline: 18px; }

/* The same light/material palette on explanatory pages, not inside tools. */
[data-signature] :is(.page-hero,.local-ai-hero,.service-detail-hero):not(.security-hero) { background: #f3f6f9; border-bottom: 1px solid var(--p-line); }
[data-signature] .page-title { font-weight: 500; }
[data-signature] :is(.service-family__heading h2,.scanner-heading h2) { text-wrap: pretty; }
[data-signature] .signature-word { white-space: nowrap; }
[data-signature] .services-overview { background: #fff; padding-block: 26px; border-bottom: 1px solid var(--p-line); }
[data-signature] .service-map a { transition: background .18s ease; }
[data-signature] .service-map a:hover { background: #f1f5fd; }
[data-signature] .service-map a strong { color: #174bb8; }
[data-signature] .local-ai-hero__sample { background: #fff; border: 1px solid var(--p-line); border-radius: 4px; }
[data-signature] .local-ai-sample__source { background: #f4f6f8; }
[data-signature] .local-ai-jobs__list article { padding-block: 30px; }
[data-signature] .local-ai-faq__group>summary { padding-block: 25px; }
[data-signature] :is(.form,.company-facts) { border: 1px solid var(--p-line); border-radius: 4px; }
[data-signature] .form :is(input,textarea,select):focus-visible { outline-width: 2px; outline-offset: 3px; }
[data-signature] .form .form-section { padding-top: 8px; margin-bottom: 28px; }
[data-signature] .form .form-section legend { padding-bottom: 8px; }
[data-signature] :is(.premium-contact,.final-cta) { position: relative; isolation: isolate; overflow: hidden; background: #141c24; color: #fff; }
[data-signature] :is(.premium-contact,.final-cta)::before { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg,#141c24 35%,#141c24b8 70%,#141c2440), url('/assets/media/signature-20261007/sculpture-1024.webp') center right / cover; opacity: .7; pointer-events: none; }
[data-signature] :is(.premium-contact,.final-cta) p { color: #e4eaf2; }
[data-signature] .premium-contact .premium-contact__meta { border-color: #c0ced159; }

@media (prefers-reduced-motion:no-preference) {
  .premium-home[data-signature] .premium-hero__copy { animation: signature-arrive .55s cubic-bezier(.16,1,.3,1) both; }
  @keyframes signature-arrive { from { transform: translateY(12px); } to { transform: translateY(0); } }
}
@media (min-width:1700px) {
  .premium-home[data-signature] .clarity-hero-layout { min-height: 650px; }
  .premium-home[data-signature] .premium-hero h1 { font-size: 78px; }
}
@media (max-width:1150px) {
  .premium-home[data-signature] .clarity-hero-layout { min-height: 545px; padding-block: 52px; }
  .premium-home[data-signature] .premium-hero h1 { font-size: 56px; }
  .premium-home[data-signature] .premium-hero__copy { width: 56%; }
  .premium-home[data-signature] .premium-hero__lead { font-size: 18px; }
  .premium-home[data-signature] .premium-hero__image img { object-position: 60% center; }
  .premium-home[data-signature] .clarity-example { grid-template-columns: minmax(0,1fr) 82px minmax(0,1fr); gap: 0 16px; }
  .premium-home[data-signature] .clarity-example h2 { font-size: 25px; }
  .premium-home[data-signature] .clarity-document { padding: 19px; }
  .premium-home[data-signature] .clarity-document p { font-size: 17px; }
  .premium-home[data-signature] :is(.clarity-task-result,.clarity-example__caption) { padding-left: 20px; }
  .premium-home[data-signature] .premium-intro { gap: 40px; }
}
@media (max-width:850px) {
  [data-signature] .site-header__inner { min-height: 76px; }
  .premium-home[data-signature] .clarity-hero-layout { min-height: 500px; }
  .premium-home[data-signature] .premium-hero__copy { width: 56%; }
  .premium-home[data-signature] .premium-hero h1 { font-size: 46px; }
  .premium-home[data-signature] .premium-hero__lead { font-size: 16px; }
  .premium-home[data-signature] .premium-hero__actions { gap: 10px 18px; }
  .premium-home[data-signature] .premium-hero__note { font-size: 13px; }
  .premium-home[data-signature] .clarity-example { grid-template-columns: minmax(0,1fr) minmax(0,1fr); column-gap: 35px; }
  .premium-home[data-signature] .clarity-example h2 { grid-column: 1 / -1; }
  .premium-home[data-signature] .clarity-document { grid-row: 2 / 4; }
  .premium-home[data-signature] .clarity-connection { grid-column: 1; grid-row: 4; flex-direction: row; padding-top: 18px; text-align: left; justify-content: start; }
  .premium-home[data-signature] .clarity-task-result { grid-column: 2; grid-row: 2; border-left: 0; padding: 0; }
  .premium-home[data-signature] .clarity-example__caption { grid-column: 2; grid-row: 3; border-left: 0; padding-left: 0; }
  .premium-home[data-signature] .clarity-example__caption+.clarity-example__caption { grid-row: 4; }
  .premium-home[data-signature] .premium-section { padding-block: 64px; }
}
@media (max-width:600px) {
  [data-signature] .site-header__inner { min-height: 72px; }
  .premium-home[data-signature] .signature-stage { display: flex; flex-direction: column; background: #f2f6fa; }
  .premium-home[data-signature] .premium-hero__image { position: relative; inset: auto; order: 2; z-index: 0; height: 220px; aspect-ratio: auto; }
  .premium-home[data-signature] .premium-hero__image img { object-position: 88% 53%; object-fit: cover; }
  .premium-home[data-signature] .clarity-hero-layout { min-height: 0; padding-block: 36px 25px; display: block; }
  .premium-home[data-signature] .premium-hero__copy { width: 100%; max-width: none; }
  .premium-home[data-signature] .premium-hero h1 { font-size: 43px; line-height: 1.08; margin-bottom: 20px; max-width: 450px; }
  .premium-home[data-signature] .premium-hero__lead { font-size: 16px; line-height: 1.6; margin-bottom: 23px; }
  .premium-home[data-signature] .premium-hero__actions { gap: 10px 16px; }
  .premium-home[data-signature] .premium-hero__actions .button { padding: 15px 18px; }
  .premium-home[data-signature] .premium-hero__actions .text-link { font-size: 14px; }
  .premium-home[data-signature] .premium-hero__note { font-size: 13px; margin-top: 15px; }
  .premium-home[data-signature] .signature-example-band { padding-block: 31px 34px; }
  .premium-home[data-signature] .clarity-example { display: block; }
  .premium-home[data-signature] .clarity-example h2 { font-size: 26px; line-height: 1.24; margin-bottom: 23px; max-width: 24ch; }
  .premium-home[data-signature] .clarity-document { padding: 19px; }
  .premium-home[data-signature] .clarity-document p { font-size: 17px; }
  .premium-home[data-signature] .clarity-document__meta { font-size: 12px; }
  .premium-home[data-signature] .clarity-connection { padding-block: 19px; justify-content: start; font-size: 13px; }
  .premium-home[data-signature] .clarity-connection .icon { transform: rotate(90deg); width: 22px; height: 22px; }
  .premium-home[data-signature] .clarity-task-result { padding: 0; }
  .premium-home[data-signature] .clarity-task-list li { font-size: 17px; }
  .premium-home[data-signature] .clarity-example__caption { padding-top: 15px; font-size: 13px; }
  .premium-home[data-signature] .clarity-example__caption+.clarity-example__caption { padding-top: 5px; }
  .premium-home[data-signature] .premium-section { padding-block: 48px; }
  .premium-home[data-signature] .premium-intro { margin-bottom: 28px; gap: 20px; }
  .premium-home[data-signature] .premium-tasks { gap: 28px; }
  .premium-home[data-signature] .premium-tasks article { padding-top: 22px; }
  .premium-home[data-signature] .premium-tasks h3 { font-size: 24px; }
  .premium-home[data-signature] .local-ai-demo { padding-block: 36px; }
  .premium-home[data-signature] .premium-services summary { padding-inline: 0; }
  .premium-home[data-signature] .premium-services .service-body { padding-inline: 0; }
  [data-signature] :is(.premium-contact,.final-cta)::before { background-image: linear-gradient(90deg,#141c24ec,#141c24db), url('/assets/media/signature-20261007/sculpture-640.webp'); }
}
@media (max-width:360px) {
  .premium-home[data-signature] .premium-hero h1 { font-size: 36px; }
  .premium-home[data-signature] .premium-hero__actions { align-items: start; flex-direction: column; gap: 2px; }
  .premium-home[data-signature] .premium-hero__image { height: 185px; }
  .premium-home[data-signature] .clarity-example h2 { font-size: 24px; }
}