/* =========================================================================
   netex · pages/ai-visibility.css · /marketing/ai-visibility/ (bible §7.15)
   ========================================================================= */
@layer reset, tokens, base, components, layout, pages, utilities;

@layer pages {

/* ---- s1 hero: the prompt that asks about you ------------------------------------------------- */
.av-hero__grid { row-gap: var(--s-8); align-items: end; }
.av-hero__text { display: grid; gap: var(--s-4); align-content: start; }
.av-hero__text .nx-eyebrow { margin-bottom: 0; }
.av-title { font-size: clamp(2.25rem, 1rem + 4.2vw, 5.25rem); max-width: 15ch; }
/* Phones: the price leaves the Molten button for a mono line under it (Molten ≤ 5 % of the screen). */
.av-hero__price { display: none; }
@media (max-width: 479px) {
	/* The long Greek label made this the largest Molten area on the phone screen: a 44 px button, tighter sides. */
	.av-hero__cta { min-height: 44px; padding-inline: 14px; }
	.av-hero__ctaprice { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	.av-hero__price { display: block; flex-basis: 100%; margin-top: calc(var(--s-2) * -1); font: 600 .75rem/1.4 var(--f-mono); letter-spacing: var(--tr-label); text-transform: uppercase; color: var(--fg-2); }
}
.av-prompt { margin: 0; display: grid; gap: var(--s-3); }
.av-prompt__bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-3) var(--s-3) var(--s-4); background: var(--paper); border: var(--bw-2) solid var(--ink); box-shadow: var(--shadow-print); }
.av-prompt__field { flex: 1 1 14rem; display: flex; align-items: center; min-height: 40px; font: 500 1rem/1.35 var(--f-mono); color: var(--ink); }
.av-prompt__caret { display: inline-block; width: 2px; height: 1.2em; margin-left: 4px; background: var(--cyan-deep); animation: ai-blink 900ms steps(1, jump-end) 5; }
@keyframes ai-blink { 50% { opacity: 0; } }
.av-prompt__card { display: grid; gap: 10px; padding: var(--s-5); background: var(--paper-2); border: var(--bw) dashed var(--rule); }
.av-prompt__card i { display: block; height: 8px; background: var(--paper-3); }
.av-prompt__card i:nth-child(2) { width: 82%; }
.av-prompt__card i:nth-child(3) { width: 58%; }
.av-prompt__hint { color: var(--fg-2); }
html.rm .av-prompt__caret { animation: none; }
@media (min-width: 1024px) {
	.av-hero__text { grid-column: 1 / span 7; }
	.av-prompt { grid-column: 8 / -1; padding-bottom: var(--s-4); }
}

/* ---- s3 why now: four stamped figures in dot-matrix, kept as an evidence ledger (figure · finding ·
   who says so), not a stat wall --------------------------------------------------------------------- */
.av-stats { container-type: inline-size; display: grid; margin: 0; padding: 0; list-style: none; border-bottom: var(--bw) solid var(--rule); }
.av-stat { display: grid; gap: var(--s-3) var(--gutter); align-content: start; padding: var(--s-5) 0; border-top: var(--bw) solid var(--rule); }
.av-stat:first-child { border-top: var(--bw-2) solid var(--fg); }
.av-stat__n { font-family: var(--f-dot); font-weight: 500; font-variation-settings: "ELSH" 2; font-size: var(--t-readout); line-height: .9; letter-spacing: .02em; color: var(--fg); justify-self: start; }
.av-stat__t { max-width: 52ch; }
.av-stat .mk-srcline { margin-top: 0; }
@container (min-width: 860px) {
	.av-stat { grid-template-columns: minmax(0, 4fr) minmax(0, 6fr) minmax(0, 2.6fr); align-items: baseline; }
	.av-stat .mk-srcline { text-align: right; }
}
.av-why__body { margin-top: var(--s-8); max-width: 52ch; }

/* ---- s4 six jobs: the readout and its citation line to a mini spec table ------------------------- */
.av-jobs { margin: 0; padding: 0; list-style: none; border-bottom: var(--bw) solid var(--rule); container-type: inline-size; }
.av-job { position: relative; display: grid; gap: var(--s-2) var(--gutter); padding: var(--s-5) 0; border-top: var(--bw) solid var(--rule); }
.av-job__title { font-size: var(--t-h4); font-weight: var(--w-h3); line-height: 1.25; }
.av-job__body { max-width: 58ch; }
.av-job__measure { display: inline-flex; align-items: center; gap: var(--s-3); font: 600 .8125rem/1.4 var(--f-mono); color: var(--fg); }
.av-job__measure var { font: italic 500 1.05em var(--f-serif); }
.av-job__icon { position: relative; display: grid; gap: 2px; width: 22px; padding: 3px; border: var(--bw) solid var(--fg); }
.av-job__icon i { height: 2px; background: var(--fg); }
.av-job__icon::before { content: ""; position: absolute; right: 100%; top: 50%; width: 0; height: 1px; background: var(--sig); transition: width var(--dur-ui) var(--ease-mech); }
@media (hover: hover) { .av-job:hover .av-job__icon::before { width: 28px; } .av-job:hover .av-job__icon { border-color: var(--sig); } }
@container (min-width: 900px) {
	.av-job { grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) minmax(0, 1fr); align-items: start; }
	.av-job__measure { justify-self: end; text-align: right; }
}

/* ---- s5 method ----------------------------------------------------------------------------------- */
.av-method__grid { row-gap: var(--s-7); align-items: start; }
.av-method__p { margin-top: var(--s-5); max-width: 52ch; }
.av-method__honest { margin-top: var(--s-5); font-size: var(--t-lead); max-width: 40ch; }
@media (min-width: 1024px) {
	.av-method__text { grid-column: 1 / span 5; position: sticky; top: calc(var(--header-h) + var(--s-6)); }
	.av-ledger { grid-column: 7 / -1; }
}

/* ---- s7 offer: two spec sheets -------------------------------------------------------------------- */
.av-offer__grid { display: grid; gap: var(--s-7) var(--gutter); align-items: start; }
.av-sheet { display: grid; gap: var(--s-4); }
.av-sheet .nx-sheet__head b { color: var(--ink); font-weight: 700; }
.av-sheet__credit { font-size: var(--t-small); color: var(--fg-2); }
.av-quick__body { max-width: 52ch; }
.av-quick .av-form { max-width: none; }
.av-form__grid { display: grid; gap: var(--s-4) var(--gutter); }
@media (min-width: 768px) { .av-form__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) {
	.av-offer__grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
	.av-offer__grid > :first-child { grid-column: 1 / span 5; }
	.av-offer__grid > :last-child { grid-column: 6 / -1; }
}

/* ---- s8 crawlers ----------------------------------------------------------------------------------- */
.av-crawl { row-gap: var(--s-7); align-items: center; }
.av-crawl__note { margin-top: var(--s-5); max-width: 52ch; font-size: var(--t-small); color: var(--fg-2); }
@media (min-width: 1024px) {
	.av-crawl__text { grid-column: 1 / span 6; }
	.av-robots { grid-column: 8 / -1; }
}

/* ---- s9 FAQ ------------------------------------------------------------------------------------------- */
.av-faq { row-gap: var(--s-6); align-items: start; }
@media (min-width: 1024px) {
	.av-faq__title { grid-column: 1 / span 4; }
	.av-faq__list { grid-column: 5 / -1; }
}

/* ---- s10 cta ------------------------------------------------------------------------------------------ */
.av-cta .nx-grid { row-gap: var(--s-7); align-items: end; }
.av-cta__cross { margin-top: var(--s-6); }
.av-cta__prompt { display: grid; gap: var(--s-3); }
.av-cta__prompt .av-prompt__bar { box-shadow: none; }
.av-cta__prompt .av-prompt__card { background: var(--ink-2); border-color: var(--rule); }
.av-cta__prompt .av-prompt__card i { background: var(--ink-3); }

} /* end @layer pages */