/*
 * Organic SEO (page 14171, template page-seo). Concept "מפת הגילוי": a search phrase finds the home page and the
 * page types under it; authority as a link graph; the six stages as a winding route.
 * Palette: moss ink, linen paper, moss signal, citrus accent (fills, or behind ink text only).
 * Own compositions: search-result cards (fit), a spine list (value), alert cards (issues), the route (stages).
 */

:root, .sv-page--seo {
	--sv-ink: #18210f;
	--sv-ink-2: #222e17;
	--sv-ink-3: #3a4a2a;
	--sv-paper: #f5f4ec;
	--sv-paper-2: #e8e8d8;
	--sv-card: #fbfbf6;
	--sv-line: #d3d5c0;
	--sv-line-strong: #98a07c;
	--sv-muted: #50583e;
	--sv-signal: #4a6b12;
	--sv-signal-deep: #3e5a0e;
	--sv-signal-soft: #c3dc84;
	--sv-accent: #ffd447;
	--sv-alert: #a63d2a;
	--sv-on-ink: #f5f4ec;
	--sv-on-ink-muted: #bcc2a6;
	--sv-on-ink-line: #364428;
	--sv-on-signal: #ffffff;
	--sv-grid: rgba(24, 33, 15, .05);
	--sv-grid-ink: rgba(245, 244, 236, .045);
	--sv-glow: rgba(74, 107, 18, .18);
	--sv-underline: linear-gradient(90deg, #ffd447 0 30%, #4a6b12 30% 100%);
	--sv-cta-mark: "⌕";
}

/* ---------- Hero: discovery map ---------- */
.seo-map { display: grid; justify-items: center; text-align: center; }
.seo-map .sv-tag, .seo-map .sv-board__title, .seo-map .sv-board__caption { justify-self: stretch; text-align: start; }
.seo-map__query {
	display: inline-flex; align-items: center; gap: .55rem; margin: 0 0 2rem !important; padding: .55rem 1.1rem;
	background: var(--sv-paper); border: 1.5px solid var(--sv-ink); border-radius: 999px; font-weight: 700; font-size: .9375rem; position: relative;
	box-shadow: 4px 4px 0 var(--sv-accent);
}
.seo-map__lens { width: .95rem; height: .95rem; border: 2.5px solid currentColor; border-radius: 50%; position: relative; flex: none; }
.seo-map__lens::after { content: ""; position: absolute; width: 2.5px; height: .45rem; background: currentColor; right: -.3rem; bottom: -.38rem; transform: rotate(-45deg); }
.seo-map__query::after { /* the crawl line down to the home page */
	content: ""; position: absolute; top: 100%; left: 50%; width: 2px; height: 2rem; translate: -1px 0;
	background: repeating-linear-gradient(var(--sv-ink) 0 4px, transparent 4px 8px);
}
.seo-map__root { margin: 0 !important; padding: .7rem 1.6rem; background: var(--sv-ink); color: var(--sv-on-ink); font-weight: 700; border-radius: var(--sv-radius); position: relative; }
.seo-map__root::after { content: ""; position: absolute; top: 100%; left: 50%; width: 2px; height: 1.1rem; background: var(--sv-ink); translate: -1px 0; }
.seo-map__branches { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; width: 100%; margin-block-start: 1.1rem !important; padding-block-start: 1.1rem !important; }
.seo-map__branches::before { content: ""; position: absolute; top: 0; inset-inline: calc(100% / 6); height: 2px; background: var(--sv-ink); }
.seo-map__branches li {
	position: relative; padding: .6rem .4rem 2.6rem; font-size: .875rem; font-weight: 700; line-height: 1.25;
	background: var(--sv-paper); border: 1.5px solid var(--sv-ink); border-radius: var(--sv-radius);
}
.seo-map__branches li::before { content: ""; position: absolute; bottom: 100%; left: 50%; width: 2px; height: 1.1rem; background: var(--sv-ink); translate: -1px 0; }
.seo-map__branches li::after { /* the pages inside each branch */
	content: ""; position: absolute; left: 18%; right: 18%; bottom: .7rem; height: 1.1rem;
	background: linear-gradient(var(--sv-line-strong) 0 0) top / 100% 3px no-repeat, linear-gradient(var(--sv-line-strong) 0 0) center / 70% 3px no-repeat, linear-gradient(var(--sv-line-strong) 0 0) bottom / 85% 3px no-repeat;
}
.seo-map__branches li:nth-child(2) { background: var(--sv-signal-soft); }
@media (prefers-reduced-motion: no-preference) {
	.seo-map__branches li { animation: sv-pop .45s var(--sv-ease) both; }
	.seo-map__branches li:nth-child(1) { animation-delay: .5s; } .seo-map__branches li:nth-child(2) { animation-delay: .65s; } .seo-map__branches li:nth-child(3) { animation-delay: .8s; }
	.seo-map__query { animation: seo-search 5s ease-in-out 1.2s infinite; }
}
@keyframes seo-search { 0%, 70%, 100% { box-shadow: 4px 4px 0 var(--sv-accent); } 80% { box-shadow: 4px 4px 0 var(--sv-accent), 0 0 0 6px rgba(255, 212, 71, .45); } }

/* ---------- Fit: search-result cards ---------- */
.sv-fit--search .sv-fit__grid { border: 0; gap: 1rem; }
@media (min-width: 900px) {
	.sv-fit--search .sv-fit__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.sv-fit--search .sv-fit__item {
	grid-template-columns: minmax(0, 1fr); align-items: start; gap: .9rem; padding: 1.4rem 1.4rem 1.5rem;
	background: var(--sv-card); border: 1px solid var(--sv-line); border-radius: var(--sv-radius);
}
.sv-fit--search .sv-fit__item:hover { padding-inline-start: 1.4rem; background: var(--sv-card); border-color: var(--sv-signal); }
.sv-fit--search .sv-fit__num {
	width: auto; height: auto; display: inline-flex; align-items: center; gap: .5rem; justify-self: start;
	border: 0; border-radius: 0; font-size: .8125rem; color: var(--sv-signal-deep);
}
.sv-fit--search .sv-fit__num::before { content: ""; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--sv-paper-2) radial-gradient(circle at 45% 45%, transparent 0 .32rem, var(--sv-signal) .33rem .45rem, transparent .46rem); }
.sv-fit--search .sv-fit__item:hover .sv-fit__num { background: none; color: var(--sv-signal-deep); }
.sv-fit--search .sv-fit__text { font-weight: 700; }
.sv-fit--search .sv-fit__item:hover .sv-fit__text { text-decoration: underline; text-decoration-color: var(--sv-accent); text-decoration-thickness: .2em; text-underline-offset: .15em; }

/* ---------- Value: one spine, six statements ---------- */
.sv-cards--spine .sv-cards__grid { grid-template-columns: minmax(0, 1fr); gap: 0; position: relative; }
.sv-cards--spine .sv-cards__grid::before { content: ""; position: absolute; top: 1.5rem; bottom: 1.5rem; inset-inline-start: 1.6rem; width: 2px; background: var(--sv-on-ink-line); }
.sv-cards--spine .sv-card {
	min-height: 0; background: transparent; border: 0; border-block-end: 1px solid var(--sv-on-ink-line); border-radius: 0;
	grid-template-columns: 3.2rem minmax(0, 1fr); align-items: center; gap: 1.5rem; padding: 1.4rem 0;
}
.sv-cards--spine .sv-card::before { display: none; }
.sv-cards--spine .sv-card:hover { transform: none; }
.sv-cards--spine .sv-card__num { position: relative; z-index: 1; width: 3.2rem; height: 3.2rem; display: grid; place-items: center; border-radius: 50%; background: var(--sv-ink); border: 2px solid var(--sv-signal-soft); color: var(--sv-signal-soft); text-align: center; }
.sv-cards--spine .sv-card:hover .sv-card__num { background: var(--sv-accent); color: var(--sv-ink); border-color: var(--sv-accent); }
.sv-cards--spine .sv-card__title { margin: 0 0 .2rem; display: block; font-size: clamp(1.15rem, 1.05rem + .45vw, 1.4rem); }
.sv-cards--spine .sv-card__text { font-size: 1.0625rem; }
@media (min-width: 1024px) {
	.sv-cards--spine .sv-cards__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 3rem; }
	.sv-cards--spine .sv-cards__grid::before { display: none; }
}
.seo-graph { width: 100%; height: auto; display: block; }
.seo-graph__edges path { stroke: var(--sv-signal-soft); stroke-width: 1.5; fill: none; }
.seo-graph__edges .seo-graph__edge--soft { stroke: var(--sv-on-ink-line); stroke-dasharray: 4 5; }
.seo-graph__core { fill: var(--sv-accent); }
.seo-graph__core-label { font-family: var(--sv-sans); font-size: 18px; font-weight: 700; fill: var(--sv-ink); }
.seo-graph__node circle { fill: var(--sv-ink); stroke: var(--sv-signal-soft); stroke-width: 2.5; }
.seo-graph__node text { font-family: var(--sv-sans); font-size: 13px; font-weight: 500; fill: var(--sv-on-ink); }
@media (prefers-reduced-motion: no-preference) {
	.seo-graph__edges path:not(.seo-graph__edge--soft) { stroke-dasharray: 240; stroke-dashoffset: 240; }
	.is-in .seo-graph__edges path:not(.seo-graph__edge--soft), .editor-styles-wrapper .seo-graph__edges path { animation: seo-draw 1.2s var(--sv-ease) forwards; }
	.sv-js .seo-figure:not(.is-in) .seo-graph__node { opacity: 0; }
	.seo-graph__node { transition: opacity .5s var(--sv-ease); transition-delay: calc(.3s + var(--i) * .12s); }
}
html:not(.sv-js) .seo-graph__edges path { stroke-dasharray: none; stroke-dashoffset: 0; }
@keyframes seo-draw { to { stroke-dashoffset: 0; } }

/* ---------- Issues: alert cards ---------- */
.sv-issues--alerts .sv-issues__box { border: 0; }
.sv-issues--alerts .sv-issues__list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
@media (min-width: 760px) {
	.sv-issues--alerts .sv-issues__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1100px) {
	.sv-issues--alerts .sv-issues__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.sv-issues--alerts .sv-issues__list li {
	display: block; padding: 3.6rem 1.4rem 1.4rem; background: var(--sv-card); border: 1px solid var(--sv-line); border-block-start: 4px solid var(--sv-alert); border-radius: var(--sv-radius);
}
.sv-issues--alerts .sv-issues__list li::before { top: 1.1rem; inset-inline-start: 1.4rem; font-size: .9375rem; }
.sv-issues--alerts .sv-issues__list li::after { content: "!"; position: absolute; top: .95rem; inset-inline-end: 1.2rem; width: 1.7rem; height: 1.7rem; display: grid; place-items: center; border-radius: 50%; background: var(--sv-alert); color: #fff; font-weight: 700; font-family: var(--sv-mono); }

/* ---------- Stages: the route ---------- */
.sv-build--route .sv-build__grid { grid-template-columns: minmax(0, 1fr); gap: 2.5rem; }
.sv-build--route .sv-build__aside { position: static; display: grid; gap: 1.25rem; }
.sv-build--route .sv-build__nav { grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: .5rem; border: 0; }
.sv-build--route .sv-build__nav a { border: 1px solid var(--sv-line); border-radius: 999px; padding-block: .55rem; background: var(--sv-card); }
.sv-build--route .sv-build__nav .sv-num { top: .7rem; }
.sv-build--route .sv-build__figure { max-width: none; margin: 0; }
.seo-route { max-height: 11rem; }
.seo-route__path { fill: none; stroke: var(--sv-ink); stroke-width: 2; stroke-dasharray: 6 7; }
.seo-route .sv-zone__bar { fill: var(--sv-signal-soft); stroke: var(--sv-ink); stroke-width: 1.5; }
.seo-route .sv-zone.is-pending .sv-zone__bar { fill: var(--sv-paper); stroke: var(--sv-line-strong); stroke-dasharray: 3 4; opacity: 1; }
.sv-build--route .sv-build__chapters { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) {
	.sv-build--route .sv-build__chapters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem 1.5rem; }
}